Merge remote-tracking branch 'origin/main'

tzipc-ui/src/App.vue

@@ -34,3 +34,26 @@ export default {
   },
 };
 </script>
+<style lang="scss">
+@import "@/theme/index.scss";
+.el-picker-panel__sidebar, .el-picker-panel__footer {
+  @include font_color(buttonFontColor);
+  @include background_color(componentBackgroundColor);
+}
+
+.el-message-box {
+  @include background_bg(dialogBackgroundImage);
+  @include font_color(colorPrimary);
+  .el-message-box__header, .el-message-box__content {
+    @include font_color(colorPrimary);
+  }
+}
+
+.el-tabs__item.is-active {
+  @include font_color(colorPrimary);
+}
+
+.el-tabs__item {
+  @include font_color(componentFontColor);
+}
+</style>

tzipc-ui/src/assets/styles/element-ui.scss

@@ -602,14 +602,11 @@ div.el-switch {
   border-radius: 10px;
   border: none;
   .el-message-box__title {
-    background: url("../images/login/modal-title.png") no-repeat 0px 0px;
     background-size: 100% 100%;
     padding-left: 26px;
     font-size: 16px;
     span {
-      background: linear-gradient(180deg, #ffffff 0%, #87c5f4 100%);
-      -webkit-background-clip: text;
-      -webkit-text-fill-color: transparent;
+      @include border_color(colorPrimary);
     }
   }
   .el-message-box__content {

tzipc-ui/src/layout/components/Navbar.vue

@@ -71,7 +71,8 @@
           v-for="item in themeOptions"
           :key="item.key"
           :value="item.key"
-        >{{item.label}}</el-option>
+          :label="item.label"
+        >{{ item.label }}</el-option>
       </el-select>
       <!-- <el-switch
         v-model="value"

tzipc-ui/src/layout/components/TagsView/index.vue

@@ -299,7 +299,7 @@ export default {
       }
       &.active {
         @include font_color(buttonActiveFontColor);
-        @include background_color(buttonActiveBackgroundColor);
+        @include background_color(colorPrimary);
         border-color: #42b983;
         &::before {
           content: "";

tzipc-ui/src/theme/blueTheme/index.scss

@@ -13,6 +13,7 @@ $blueTheme: (
     buttonActiveBackgroundColor:#013dac,
     buttonActiveFontColor: #fff,
     tableRowBackgroundColor: #ffffffaa,
+    loginTitleFontColor: #fff,
 
     // 定制颜色定制背景图
     basicBackgroundColor: #000000,
@@ -30,6 +31,10 @@ $blueTheme: (
     subTitleBackgroundImage: url(/theme/blueTheme/subTitleBg.png),
     subBigTitleBackgroundImage: url(/theme/blueTheme/bigSubTitleBg.png),
     deviceImage: url(/theme/blueTheme/device.png),
+    deviceImage1: url(/theme/blueTheme/img1.png),
+    deviceImage2: url(/theme/blueTheme/img2.png),
+    deviceImage3: url(/theme/blueTheme/img3.png),
+    deviceImage4: url(/theme/blueTheme/img4.png),
 
     // element ui 样式
     elTableHeaderBackgroundColor: #fff,

tzipc-ui/src/theme/default/index.scss

@@ -14,6 +14,8 @@ $default: (
     buttonActiveFontColor: #fff,
     tableRowBackgroundColor: #000000b4,
 
+    loginTitleFontColor: #fff,
+
     // 定制颜色定制背景图
     basicBackgroundColor: #000000,
     loginBackgroundImage: url(/theme/default/loginBg.png),
@@ -30,6 +32,10 @@ $default: (
     subTitleBackgroundImage: url(/theme/default/subTitleBg.png),
     subBigTitleBackgroundImage: url(/theme/default/bigSubTitleBg.png),
     deviceImage: url(/theme/default/device.png),
+    deviceImage1: url(/theme/default/img1.png),
+    deviceImage2: url(/theme/default/img2.png),
+    deviceImage3: url(/theme/default/img3.png),
+    deviceImage4: url(/theme/default/img4.png),
 
     // element ui 样式
     elTableHeaderBackgroundColor: #fff,

tzipc-ui/src/theme/redTheme/index.scss

@@ -13,6 +13,7 @@ $redTheme: (
     buttonActiveBackgroundColor: #ad352f,
     buttonActiveFontColor: #fff,
     tableRowBackgroundColor: #ffffffb5,
+    loginTitleFontColor: #ad352f,
 
     // 定制颜色定制背景图
     basicBackgroundColor: #000000,
@@ -31,6 +32,10 @@ $redTheme: (
     subTitleBackgroundImage: url(/theme/redTheme/subTitleBg.png),
     subBigTitleBackgroundImage: url(/theme/redTheme/bigSubTitleBg.png),
     deviceImage: url(/theme/redTheme/device.png),
+    deviceImage1: url(/theme/redTheme/img1.png),
+    deviceImage2: url(/theme/redTheme/img2.png),
+    deviceImage3: url(/theme/redTheme/img3.png),
+    deviceImage4: url(/theme/redTheme/img4.png),
 
     // element ui 样式
     elTableHeaderBackgroundColor: #fff,

tzipc-ui/src/views/login.vue

@@ -3,9 +3,13 @@
     <div class="login-content">
       <div
         class="login-content-title"
-        style="margin-bottom: 1rem;"
+        style="margin-bottom: 1rem;text-align: center;"
       >
-        <img :src="getTitleBg()">
+        <!-- <img :src="getTitleBg()"> -->
+
+        <div
+          class="text-main-wrapper"
+        >油膜轴承监测与预测性维护数字管理系统</div>
       </div>
       <div
         class="login-content-sub-title"
@@ -153,6 +157,7 @@ export default {
     this.getCode();
     this.getSystemInfo();
     this.getCookie();
+    this.getTitleBg()
   },
   methods: {
     getSystemInfo() {
@@ -163,6 +168,7 @@ export default {
 
     getTitleBg() {
       const theme = localStorage.getItem("data-theme") || "default";
+      console.log('theme', theme);
       window.document.documentElement.setAttribute("data-theme", theme);
       window.document.documentElement.setAttribute("class", "light");
       if (theme === "default") return "/theme/default/loginTitle.png";
@@ -228,6 +234,22 @@ export default {
 
 <style rel="stylesheet/scss" lang="scss">
 @import "@/theme/index.scss";
+
+@font-face {
+  font-family: "BiaoTi";
+  src: url(../assets/biaoti.ttf);
+}
+
+.text-main-wrapper {
+  position: absolute;
+  left:calc(50% - 40vw);
+  bottom: .6rem;
+  @include font_color(loginTitleFontColor);
+  letter-spacing: .1rem;
+  width: 80vw;
+  font-size: 1.8rem;
+  font-family: "BiaoTi";
+}
 .login {
   height: 100vh;
   width: 100vw;
@@ -245,6 +267,7 @@ export default {
     .login-content-title {
       padding: 0 15px;
       width: 100%;
+      position: relative;
       img {
         width: 100%;
         height: 100%;

tzipc-ui/src/views/zf/bigscreen/index.vue

@@ -20,11 +20,28 @@
         style="grid-row: span 2;grid-column: span 2;padding: 2rem;"
         @click="(e) => { e.stopPropagation() }"
       >
-        <div class="device-image">
-          <div @click="handleTypeChange(['rtd', 'rto'])"></div>
-          <div @click="handleTypeChange(['ftd', 'fto'])"></div>
-          <div @click="handleTypeChange(['rbd', 'rbo'])"></div>
-          <div @click="handleTypeChange(['fbd', 'fbo'])"></div>
+        <div :class="`device-image-${curImageIndex}`">
+          <div @click="() => {
+            curImageIndex = 1
+            handleTypeChange(['rtd', 'rto'])
+          }"></div>
+          <div
+            @click="() => {
+              curImageIndex = 2
+              handleTypeChange(['ftd', 'fto'])
+            }"
+          ></div>
+          <div
+            @click="() => {
+              curImageIndex = 3
+              handleTypeChange(['rbd', 'rbo'])
+            }"></div>
+          <div
+            @click="() => {
+              curImageIndex = 4
+              handleTypeChange(['fbd', 'fbo'])
+            }"
+          ></div>
         </div>
       </div>
       <div class="grid-item-wrapper">
@@ -338,7 +355,7 @@
       </div>
       <div
         v-loading="loading"
-        element-loading-text="拼命加载中"
+        element-loading-text="加载中..."
         element-loading-spinner="el-icon-loading"
         element-loading-background="rgba(0, 0, 0, 0.8)"
         ref="tendencyChart"
@@ -451,6 +468,8 @@ export default {
           },
         ],
       },
+
+      curImageIndex: 1
     };
   },
   mounted() {
@@ -1300,6 +1319,20 @@ export default {
   grid-template-rows: 1fr 1fr;
 }
 
+@for $i from 1 through 4 {
+  .device-image-#{$i} {
+    width: 100%;
+    height: 100%;
+    @include background_bg(deviceImage#{$i});
+    background-size: contain;
+    background-repeat: no-repeat;
+    background-position: center center;
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    grid-template-rows: 1fr 1fr;
+  }
+}
+
 .bottom-grid-wrapper {
   display: grid;
   height: 100%;
@@ -1336,8 +1369,7 @@ export default {
 }
 
 .scroll-text-wrapper {
-  border: 1px solid #ff0000b5;
-  background-color: #eb16161a;
+  color: #ff0000b5;
   display: flex;
   justify-content: center;
   align-items: center;
@@ -1346,17 +1378,17 @@ export default {
   overflow: hidden;
   .scroll-inner {
     position: absolute;
-    width: 100%;
-    animation: scrollAnimation 10s linear infinite;
+    white-space: nowrap;
+    animation: scrollAnimation 300s linear infinite;
   }
 }
 
 @keyframes scrollAnimation {
   0% {
-    left: 100%;
+    transform: translateX(100%);
   }
   100% {
-    left: -100%;
+    transform: translateX(-100%);
   }
 }
 </style>