Ver Fonte

柯赛看板调整样式

xiaost há 5 meses atrás
pai
commit
b21dc0c428

BIN
src/assets/bgNew.jpg


+ 15 - 8
src/assets/scss/indexmakeprocess.scss

@@ -1,5 +1,5 @@
 #index {
-  color: #d3d6dd;
+ // color: #d3d6dd;
   width: 1920px;
   height: 1080px;
   position:fixed;
@@ -17,13 +17,16 @@
   .bg {
     width: 100%;
     height: 100%;
-    padding: 16px 16px 0 16px;
-    background-image: url("../../assets/bg3.jpg");
+    padding: 0px 16px 0 16px;
+    background-image: url("../../assets/bgNew.jpg");
     background-size: cover;
     background-position: center center;
   }
 
   .host-body {
+    .header-pad{
+      padding-top: 50px;
+    }
     .dv-dec-10,
     .dv-dec-10-s {
       width: 33.3%;
@@ -68,7 +71,7 @@
     }
     .react-r-s,
     .react-l-s {
-      background-color: #1a5cd7;
+     /* background-color: #1a5cd7;*/
     }
 
     // 平行四边形
@@ -89,7 +92,7 @@
         top: 0;
         height: 50px;
         width: 50px;
-        background-color: #1a5cd7;
+      /*  background-color: #1a5cd7;*/
         transform: skewX(45deg);
       }
 
@@ -97,6 +100,10 @@
         display: inline-block;
         transform: skewX(45deg);
       }
+      .datetext{
+        font-size: 18px;
+        font-weight: bold;
+      }
     }
 
     .react-left {
@@ -110,7 +117,7 @@
       line-height: 50px;
       text-align: center;
       transform: skewX(45deg);
-      background-color: #1a5cd7;
+    /*  background-color: #1a5cd7;*/
 
       .react-left {
         position: absolute;
@@ -118,7 +125,7 @@
         top: 0;
         height: 50px;
         width: 50px;
-        background-color: #1a5cd7;
+       /* background-color: #1a5cd7;*/
         transform: skewX(-45deg);
       }
 
@@ -129,7 +136,7 @@
     }
 
     .body-box {
-      margin-top: 10px;
+      margin-top: 23px;
       display: flex;
       flex-direction: column;
 

+ 15 - 8
src/assets/scss/indexprodline.scss

@@ -1,5 +1,5 @@
 #index {
-  color: #d3d6dd;
+  //color: #d3d6dd;
   width: 1920px;
   height: 1080px;
   position:fixed;
@@ -17,13 +17,16 @@
   .bg {
     width: 100%;
     height: 100%;
-    padding: 16px 16px 0 16px;
-    background-image: url("../../assets/bg3.jpg");
+    padding: 0px 16px 0 16px;
+    background-image: url("../../assets/bgNew.jpg");
     background-size: cover;
     background-position: center center;
   }
 
   .host-body {
+    .header-pad{
+      padding-top: 50px;
+    }
     .dv-dec-10,
     .dv-dec-10-s {
       width: 33.3%;
@@ -68,7 +71,7 @@
     }
     .react-r-s,
     .react-l-s {
-      background-color: #1a5cd7;
+     /* background-color: #1a5cd7;*/
     }
 
     // 平行四边形
@@ -89,7 +92,7 @@
         top: 0;
         height: 50px;
         width: 50px;
-        background-color: #1a5cd7;
+      /*  background-color: #1a5cd7;*/
         transform: skewX(45deg);
       }
 
@@ -97,6 +100,10 @@
         display: inline-block;
         transform: skewX(45deg);
       }
+      .datetext{
+        font-size: 18px;
+        font-weight: bold;
+      }
     }
 
     .react-left {
@@ -110,7 +117,7 @@
       line-height: 50px;
       text-align: center;
       transform: skewX(45deg);
-      background-color: #1a5cd7;
+    /*  background-color: #1a5cd7;*/
 
       .react-left {
         position: absolute;
@@ -118,7 +125,7 @@
         top: 0;
         height: 50px;
         width: 50px;
-        background-color: #1a5cd7;
+       /* background-color: #1a5cd7;*/
         transform: skewX(-45deg);
       }
 
@@ -129,7 +136,7 @@
     }
 
     .body-box {
-      margin-top: 10px;
+      margin-top: 23px;
       display: flex;
       flex-direction: column;
       .content-box {

+ 15 - 8
src/assets/scss/indexzz.scss

@@ -1,5 +1,5 @@
 #index {
-  color: #d3d6dd;
+ /* color: #d3d6dd;*/
   width: 1920px;
   height: 1080px;
   position:fixed;
@@ -17,13 +17,16 @@
   .bg {
     width: 100%;
     height: 100%;
-    padding: 16px 16px 0 16px;
-    background-image: url("../../assets/bg3.jpg");
+    padding: 0px 16px 0 16px;
+    background-image: url("../../assets/bgNew.jpg");
     background-size: cover;
     background-position: center center;
   }
 
   .host-body {
+    .header-pad{
+      padding-top: 50px;
+    }
     .dv-dec-10,
     .dv-dec-10-s {
       width: 33.3%;
@@ -68,7 +71,7 @@
     }
     .react-r-s,
     .react-l-s {
-      background-color: #1a5cd7;
+     /* background-color: #1a5cd7;*/
     }
 
     // 平行四边形
@@ -89,7 +92,7 @@
         top: 0;
         height: 50px;
         width: 50px;
-        background-color: #1a5cd7;
+      /*  background-color: #1a5cd7;*/
         transform: skewX(45deg);
       }
 
@@ -97,6 +100,10 @@
         display: inline-block;
         transform: skewX(45deg);
       }
+      .datetext{
+        font-size: 18px;
+        font-weight: bold;
+      }
     }
 
     .react-left {
@@ -110,7 +117,7 @@
       line-height: 50px;
       text-align: center;
       transform: skewX(45deg);
-      background-color: #1a5cd7;
+    /*  background-color: #1a5cd7;*/
 
       .react-left {
         position: absolute;
@@ -118,7 +125,7 @@
         top: 0;
         height: 50px;
         width: 50px;
-        background-color: #1a5cd7;
+       /* background-color: #1a5cd7;*/
         transform: skewX(-45deg);
       }
 
@@ -129,7 +136,7 @@
     }
 
     .body-box {
-      margin-top: 10px;
+      margin-top: 23px;
       display: flex;
       flex-direction: column;
       .content-box {

+ 7 - 7
src/components/prodlinechart/up1Chart/up1DChart/index.vue

@@ -36,12 +36,12 @@ export default {
       type: Object,
       default: function () {
         return {
-          textStyle: "#3fc0fb",
+          textStyle: "#000000",
           series: {
             color: ["#00bcd44a", "transparent"],
             dataColor: {
-              normal: "#03a9f4",
-              shadowColor: "#97e2f5"
+              normal: '#00aa55',
+              shadowColor: '#0ad386'
             }
           }
         };
@@ -55,17 +55,17 @@ export default {
         this.options = {
           title:{
             text: newData * 1 + "%",
-            x: "50%",
+            x: "47%",
             y: "center",
             textStyle: {
-              color: this.colorObj.textStyle,
+              color: '#000000',
               fontSize: 16
             }
           },
           series: [
             {
               type: "pie",
-              radius: ["79%", "85%"],
+              radius: ["75%", "85%"],
               center: ["60%", "50%"],
               hoverAnimation: false,
               color: this.colorObj.series.color,
@@ -80,7 +80,7 @@ export default {
                   itemStyle: {
                     normal: {
                       color: this.colorObj.series.dataColor.normal,
-                      shadowBlur: 10,
+                      shadowBlur: 0,
                       shadowColor: this.colorObj.series.dataColor.shadowColor
                     }
                   }

+ 33 - 23
src/views/makeprocess/index.vue

@@ -3,40 +3,40 @@
     <div class="bg">
       <dv-loading v-if="loading">Loading...</dv-loading>
       <div v-else class="host-body">
-        <div class="d-flex jc-center">
+<!--        <div class="d-flex jc-center">
           <dv-decoration-10 class="dv-dec-10" />
           <div class="d-flex jc-center">
             <dv-decoration-8 class="dv-dec-8" :color="decorationColor" />
             <div class="title">
               <span class="title-text">COSTEC-MES 可视化平台</span>
               <dv-decoration-6
-                  class="dv-dec-6"
-                  :reverse="true"
-                  :color="['#50e3c2', '#67a1e5']"
+                class="dv-dec-6"
+                :reverse="true"
+                :color="['#50e3c2', '#67a1e5']"
               />
             </div>
             <dv-decoration-8
-                class="dv-dec-8"
-                :reverse="true"
-                :color="decorationColor"
+              class="dv-dec-8"
+              :reverse="true"
+              :color="decorationColor"
             />
           </div>
           <dv-decoration-10 class="dv-dec-10-s" />
-        </div>
+        </div>-->
 
         <!-- 第二行 -->
-        <div class="d-flex jc-between px-2">
+        <div class="d-flex jc-between px-2 header-pad">
           <div class="d-flex aside-width">
-            <div class="react-left ml-4 react-l-s bg-color-blue">
+<!--            <div class="react-left ml-4 react-l-s bg-color-blue">
               <span class="react-left"></span>
               <span class="text fw-b" style="font-size:24px;">柯赛科技数据看板</span>
-            </div>
+            </div>-->
           </div>
           <div class="d-flex aside-width">
             <div class="react-right bg-color-r mr-3">
-              <el-button type="text" class="text" style="width:50% ;font-size: 21px;" @click="fullScreen" ref="fullScreen"
+              <el-button type="text" class="text" style="width:50% ;font-size: 21px; color: #000000 !important;font-weight: bold;" @click="fullScreen" ref="fullScreen"
                          v-show=!isFullScreen >全屏</el-button>
-              <el-button type="text" class="text" style="width:50% ;font-size: 21px;" @click="exitFullScreen" ref="exitFullScreen" v-show=isFullScreen>退出全屏</el-button>
+              <el-button type="text" class="text" style="width:50% ;font-size: 21px; color: #000000 !important;font-weight: bold;" @click="exitFullScreen" ref="exitFullScreen" v-show=isFullScreen>退出全屏</el-button>
             </div>
             <div class="react-right mr-4 react-l-s" style="width: 900px">
               <span class="react-after"></span>
@@ -53,8 +53,8 @@
                   <el-dropdown-item class="dropdownitem"><router-link to="compare">各车间进度</router-link></el-dropdown-item>
                 </el-dropdown-menu>
               </el-dropdown>
-              <span class="text">&nbsp;&nbsp;&nbsp;&nbsp;</span>
-              <span class="text">{{ dateYear }} {{ dateWeek }} {{ dateDay }}</span>
+              <span class="text">&nbsp;&nbsp;</span>
+              <span class="text datetext">{{ dateYear }} {{ dateWeek }} {{ dateDay }}</span>
             </div>
           </div>
         </div>
@@ -172,26 +172,31 @@ export default {
 
 .dropdown{
   font-size: 22px;
-  color: #f7f8fa;
+  color: #000000;
+  font-weight: bold;
   transform: skewX(45deg);
   ::v-deep .el-select-dropdown {
-    border: 1px solid #0f1325;
-    background: #04308D !important;
+    /* // 若不将下拉框的背景颜色设置为:transparent,那么做不出来半透明的效果;
+    // 因为其最终的显示为:下拉框有一个背景颜色且下拉框的字体有一个背景颜色,重叠后的效果展示; */
+    border: 0px solid #0f1325;
+  /*  background: #04308D !important;*/
   }
 
   ::v-deep .el-input__inner {
-    background-color: #0f1325;
-    color: #fff;
-    border: 1px solid #0f1325;
+   /* background-color: #1a5cd7;*/
+    color: #000000;
+    font-size: 22px;
+    font-weight: bold;
+    border: 0px solid #0f1325;
   }
 
   .el-select-dropdown__item {
-    color: #fff;
+    color: #000000;
     background-color: #0f1325;
   }
   ::v-deep .el-select-dropdown {
     background-color: transparent;
-    border: 1px solid #0f1325;
+   /* border: 1px solid #0f1325;*/
   }
   ::v-deep.el-select-dropdown__list {
     padding: 0;
@@ -208,6 +213,11 @@ export default {
   }
 }
 
+::v-deep.el-select .el-input .el-select__caret {
+  color: #000000;
+  padding: 6px 0px 0px 6px;
+  font-size: 22px;
+}
 /* 新增样式 */
 .bg {
   height: 100vh;

+ 22 - 9
src/views/makeprocess/list.vue

@@ -1,6 +1,6 @@
 <template>
   <div id="ddlist">
-    <div class="bg-color-black">
+    <div class="bg-color-black1">
       <div class="d-flex mt-2 pt-1 pl-2 pb-2 jc-center mb-2">
         <span class="text mx-2 fw-b">产线计划未完成订单明细</span>
       </div>
@@ -19,10 +19,10 @@ export default {
         header:[],
         data: [],
         rowNum: 14, //表格行数
-        headerHeight: 35,
-        headerBGC: '#0f1325', //表头
-        oddRowBGC: '#0f1325', //奇数行
-        evenRowBGC: '#171c33', //偶数行
+        headerHeight: 50,
+        headerBGC: '#FFFFFF', //表头
+        oddRowBGC: '#FFFFFF', //奇数行
+        evenRowBGC: '#FFFFFF', //偶数行
         columnWidth: [],
         align: [],
         carousel: 'page',
@@ -102,29 +102,42 @@ $box-width: 100%;
   height: $box-height;
   width: $box-width;
   border-radius: 5px;
-  .bg-color-black {
+  .bg-color-black1 {
     height: $box-height - 25px;
     border-radius: 10px;
   }
   .text {
-    color: #c3cbde;
+    color: #000000;
     font-size: 50px;
   }
   .body-box {
-    border-radius: 10px;
     overflow: hidden;
     height: 915px;
     ::v-deep .dv-scroll-board {
       height: 885px;
       .header{
         font-size: 25px;
+        color: #000000 !important;
+        font-weight: bold;
+      /*  .header-item{
+          border-right: 1px solid #000000 !important;
+        }*/
       }
+      // 添加全局边框样式
+      /*.header, .rows .row-item,  {
+        border: 1px solid #000000 !important;
+      }*/
       .rows {
         .row-item {
           font-size: 26px !important;
-          // color: #c3cbde !important;
+          color: #000000 !important;
         }
+        /* .ceil {
+           border-right: 1px solid #000000 !important;
+         }*/
+
       }
+
     }
   }
 }

+ 48 - 14
src/views/prodline/bottom1.vue

@@ -1,6 +1,6 @@
 <template>
-  <div id="bottom1">
-    <div class="bg-color-black">
+  <div id="pbottom1">
+    <div class="bg-color-black1">
       <div class="up">
           <div class ="left">
             <div class="vertical-text">
@@ -47,11 +47,11 @@ export default {
         header: ['销售工单','业务员', '产品名称', '订单数', '计划数','完成数', '提醒事项','异常事项'],
         data: [],
         rowNum: 9,
-        headerHeight: 35,
-        headerBGC: 'rgba(15,19,37,0.1)',
-        oddRowBGC: 'rgba(15,19,37,0.1)',
-        evenRowBGC: 'rgba(23,28,51,0.1)',
-        columnWidth: [220,120,350,140,140,140,420,200],
+        headerHeight: 45,
+        headerBGC: '#FFFFFF',
+        oddRowBGC: '#FFFFFF',
+        evenRowBGC: '#FFFFFF',
+        columnWidth: [220,120,350,140,140,140,420],
         align: ['center','center','center','center','center','center','center','center'],
         index: false,
         carousel: 'page',
@@ -183,12 +183,12 @@ export default {
 $box-height: 630px;
 $box-width: 100%;
 
-#bottom1 {
+#pbottom1 {
   padding: 13px;
   height: $box-height;
   width: $box-width;
   border-radius: 5px;
-  .bg-color-black {
+  .bg-color-black1 {
     border-radius: 10px;
     height: 605px;
     padding: 5px;
@@ -227,22 +227,38 @@ $box-width: 100%;
       width: $box-width;
       height: 495px;
       overflow: hidden;
+     // border: 1px solid #000000;
       .dv-scroll-board {
         width: 100% !important;
-        height: 100% !important;
-
+        height: 495px;
         .header {
           font-size: 25px;
-
+          color: #000000 !important;
+          font-weight: bold;
           .header-item {
-            line-height: 35px !important;
+            line-height: 45px !important;
+           // border-right: 1px solid #000000 !important;
+           // border-bottom: 1px solid #000000 !important; // 加粗表头下边框
+
+            // 表头单元格伪元素解决边框重叠
+            &:after {
+              content: "";
+              position: absolute;
+              top: -1px;
+              left: -1px;
+              right: -1px;
+              height: 1px;
+              background: #000000;
+            }
           }
         }
+
         .rows {
           .row-item {
             line-height: 40px !important;
             margin: 0 !important;
             padding: 0 !important;
+            color: #000000 !important;
 
             span.cell-text {
               display: inline-block;
@@ -251,6 +267,24 @@ $box-width: 100%;
               line-height: 1.5;
               padding: 4px 0;
             }
+
+          }
+
+         /* .ceil {
+            border-right: 1px solid #000000 !important;
+            border-bottom: 1px solid #000000 !important;
+          }*/
+
+          // 行底边框
+          &:after {
+            content: "";
+            position: absolute;
+            bottom: -1px;
+            left: 0;
+            right: 0;
+            height: 1px;
+            background: #000000;
+            z-index: 1;
           }
         }
       }
@@ -286,7 +320,7 @@ $box-width: 100%;
     height: 50px;
     align-items: center;
     overflow: hidden;
-    color: red;
+    color: #f32121;
     padding: 5px 25px 0px 25px;
     background: linear-gradient(160deg, #0066cc, #0044aa);
     font-size: 23px;

+ 26 - 18
src/views/prodline/index.vue

@@ -3,7 +3,7 @@
     <div class="bg">
       <dv-loading v-if="loading">Loading...</dv-loading>
       <div v-else class="host-body">
-        <div class="d-flex jc-center">
+<!--        <div class="d-flex jc-center">
           <dv-decoration-10 class="dv-dec-10" />
           <div class="d-flex jc-center">
             <dv-decoration-8 class="dv-dec-8" :color="decorationColor" />
@@ -22,21 +22,21 @@
             />
           </div>
           <dv-decoration-10 class="dv-dec-10-s" />
-        </div>
+        </div>-->
 
         <!-- 第二行 -->
-        <div class="d-flex jc-between px-2">
+        <div class="d-flex jc-between px-2 header-pad">
           <div class="d-flex aside-width">
-            <div class="react-left ml-4 react-l-s bg-color-blue">
+<!--            <div class="react-left ml-4 react-l-s bg-color-blue">
               <span class="react-left"></span>
               <span class="text fw-b" style="font-size:24px;">柯赛科技数据看板</span>
-            </div>
+            </div>-->
           </div>
           <div class="d-flex aside-width">
             <div class="react-right bg-color-r mr-3">
-              <el-button type="text" class="text" style="width:50% ;font-size: 21px;" @click="fullScreen" ref="fullScreen"
+              <el-button type="text" class="text" style="width:50% ;font-size: 21px; color: #000000 !important;font-weight: bold;" @click="fullScreen" ref="fullScreen"
                          v-show=!isFullScreen >全屏</el-button>
-              <el-button type="text" class="text" style="width:50% ;font-size: 21px;" @click="exitFullScreen" ref="exitFullScreen" v-show=isFullScreen>退出全屏</el-button>
+              <el-button type="text" class="text" style="width:50% ;font-size: 21px; color: #000000 !important;font-weight: bold;" @click="exitFullScreen" ref="exitFullScreen" v-show=isFullScreen>退出全屏</el-button>
             </div>
             <div class="react-right mr-4 react-l-s" style="width: 900px">
               <span class="react-after"></span>
@@ -62,9 +62,8 @@
                     :value="item.LI_CODE"
                 ></el-option>
               </el-select>
-
-              <span class="text">&nbsp;&nbsp;&nbsp;&nbsp;</span>
-              <span class="text">{{ dateYear }} {{ dateWeek }} {{ dateDay }}</span>
+              <span class="text">&nbsp;&nbsp;</span>
+              <span class="text datetext">{{ dateYear }} {{ dateWeek }} {{ dateDay }}</span>
             </div>
           </div>
         </div>
@@ -236,29 +235,31 @@ export default {
 @import '../../assets/scss/indexprodline.scss';
 .dropdown{
   font-size: 22px;
-  color: #f7f8fa;
+  color: #000000;
+  font-weight: bold;
   transform: skewX(45deg);
   ::v-deep .el-select-dropdown {
     /* // 若不将下拉框的背景颜色设置为:transparent,那么做不出来半透明的效果;
     // 因为其最终的显示为:下拉框有一个背景颜色且下拉框的字体有一个背景颜色,重叠后的效果展示; */
-    border: 1px solid #0f1325;
-    background: #04308D !important;
+    border: 0px solid #0f1325;
+  /*  background: #04308D !important;*/
   }
 
   ::v-deep .el-input__inner {
-    background-color: #1a5cd7;
-    color: #fff;
+   /* background-color: #1a5cd7;*/
+    color: #000000;
     font-size: 22px;
-    border: 1px solid #0f1325;
+    font-weight: bold;
+    border: 0px solid #0f1325;
   }
 
   .el-select-dropdown__item {
-    color: #fff;
+    color: #000000;
     background-color: #0f1325;
   }
   ::v-deep .el-select-dropdown {
     background-color: transparent;
-    border: 1px solid #0f1325;
+   /* border: 1px solid #0f1325;*/
   }
   ::v-deep.el-select-dropdown__list {
     padding: 0;
@@ -273,6 +274,13 @@ export default {
   .el-select-dropdown__item:hover {
     background-color: rgba(0, 225, 219, 0.690196078431373);
   }
+
+  ::v-deep.el-select .el-input .el-select__caret {
+    color: #000000;
+    padding: 6px 0px 0px 6px;
+    font-size: 22px;
+  }
+
 }
 
 </style>

+ 5 - 16
src/views/prodline/up1.vue

@@ -1,6 +1,6 @@
 <template>
   <div id="up1">
-    <div class="bg-color-black">
+    <div class="bg-color-black1">
       <div class ="left">
         <div class="vertical-text">
           <span class="text mx-2 fw-b">设备状况</span>
@@ -38,29 +38,18 @@ import CenterChart from "../../components/prodlinechart/up1Chart/up1DChart";
         okqty: 0,
         abnormalqty: 0,
         byqty: 0,
-        config1: {
-          header: ['设备编号','提醒事项'],
-          data: [],
-          rowNum: 4, //表格行数
-          headerHeight: 40,
-          headerBGC: 'rgba(15,19,37,0.1)', //表头
-          oddRowBGC: 'rgba(15,19,37,0.1)', //奇数行
-          evenRowBGC: 'rgba(23,28,51,0.1)', //偶数行
-          columnWidth: [100,180],
-          align: ['center','center'],
-        },
         timing:null,
         rate: {
             id: 'centerRate1',
             tips: 60,
             title:'保养状况',
             colorData: {
-              textStyle: '#31b4fb',
+              textStyle: '#000000',
               series: {
                 color: ['rgba(19,122,244,0.29)', 'transparent'],
                 dataColor: {
-                  normal: '#137af4',
-                  shadowColor: '#80e0f5'
+                  normal: '#00aa55',
+                  shadowColor: '#0ad386'
                 }
               }
             }
@@ -128,7 +117,7 @@ import CenterChart from "../../components/prodlinechart/up1Chart/up1DChart";
     height: $box-height;
     width: $box-width;
     border-radius: 5px;
-    .bg-color-black {
+    .bg-color-black1 {
       height: $box-height - 25px;
       border-radius: 10px;
       padding: 5px ;

+ 8 - 7
src/views/prodline/up2.vue

@@ -1,6 +1,6 @@
 <template>
   <div id="up2">
-    <div class="bg-color-black">
+    <div class="bg-color-black1">
       <div class="d-flex jc-center body-box">
         <dv-scroll-board :config="config" ref="scroll-board" />
       </div>
@@ -23,9 +23,9 @@ export default {
         data: [],
         rowNum: 6, //表格行数
         headerHeight: 40,
-        headerBGC: 'rgba(15,19,37,0.1)', //表头
-        oddRowBGC: 'rgba(15,19,37,0.1)', //奇数行
-        evenRowBGC: 'rgba(23,28,51,0.1)', //偶数行
+        headerBGC: '#ded9d9', //表头
+        oddRowBGC: '#ded9d9', //奇数行
+        evenRowBGC: '#ded9d9', //偶数行
         columnWidth: [180,250,150,150],
         align: ['center','center','center','center'],
       },
@@ -96,7 +96,7 @@ $box-width: 100%;
   font-size: 40px;
   width: $box-width;
   border-radius: 5px;
-  .bg-color-black {
+  .bg-color-black1 {
     height: $box-height - 25px;
     //width: $box-width - 10px;
     border-radius: 10px;
@@ -109,16 +109,17 @@ $box-width: 100%;
       padding-top: 0px; // 添加这行减少顶部间距
       .header {
         font-size: 20px !important;
-        color: #c3cbde !important;
+        color: #000000 !important;
         font-weight: bold;
       }
 
       .rows {
         .row-item {
           font-size: 10px !important;
-          color: #c3cbde !important;
+          color: #000000 !important;
         }
       }
+
     }
 
     ::v-deep .rows span {

+ 9 - 9
src/views/prodline/up4.vue

@@ -1,27 +1,27 @@
 <template>
   <div id="up4">
-    <div class="bg-color-black">
+    <div class="bg-color-black1">
       <div class="d-flex body-box ">
         <div class="item fs-xxxl">
-          <div class="dv-dig-flop ml-1 pl-3 ">
+          <div class="dv-dig-flop ml-1 pl-3 fw-b">
             <img :src="imgSrc1" class="responsive-img">
-            <div class="mt-3 ml-3 colorText fw-b ">生产负责人</div>
+            <div class="mt-3 ml-3 ">生产负责人</div>
             <div class ='mt-3 ai-center' >
               <p>{{ upitem.v_leadname }}</p>
             </div>
           </div>
         </div>
         <div class="item fs-xxxl">
-          <div class="dv-dig-flop ml-1 pl-3 ">
+          <div class="dv-dig-flop ml-1 pl-3 fw-b">
             <img :src="imgSrc2"  class="responsive-img">
-            <div class="mt-3  colorText fw-b ">品质负责人</div>
+            <div class="mt-3  ">品质负责人</div>
             <div class ='mt-3 ai-center '>
               <p>{{ upitem.v_quaname }}</p>
             </div>
           </div>
         </div>
 
-        <div class="item fs-xxl">
+        <div class="item fs-xxl fw-b">
           <div class="ml-5">
             <div class="mt-3">应到人数:{{mancount}}</div>
             <div class="mt-3">实到人数:{{actmancount}}</div>
@@ -143,13 +143,13 @@ $box-width: 100%;
   font-size: 32px;
   width: $box-width;
   border-radius: 5px;
-  .bg-color-black {
+  .bg-color-black1 {
     height: $box-height - 25px;
     border-radius: 10px;
     padding: 5px;
   }
   .text {
-    color: #c3cbde;
+    color: #000000;
     font-size: 25px;
   }
   .body-box {
@@ -164,7 +164,7 @@ $box-width: 100%;
       height: 100%;
       .dv-dig-flop {
         width: 100%;
-        color: #3de7c9;
+        color: #000000;
         display: flex;
         flex-direction: column;
         justify-content: center;

+ 27 - 18
src/views/zz/index.vue

@@ -3,7 +3,7 @@
     <div class="bg">
       <dv-loading v-if="loading">Loading...</dv-loading>
       <div v-else class="host-body">
-        <div class="d-flex jc-center">
+<!--        <div class="d-flex jc-center">
           <dv-decoration-10 class="dv-dec-10" />
           <div class="d-flex jc-center">
             <dv-decoration-8 class="dv-dec-8" :color="decorationColor" />
@@ -22,21 +22,21 @@
             />
           </div>
           <dv-decoration-10 class="dv-dec-10-s" />
-        </div>
+        </div>-->
 
         <!-- 第二行 -->
-        <div class="d-flex jc-between px-2">
+        <div class="d-flex jc-between px-2 header-pad">
           <div class="d-flex aside-width">
-            <div class="react-left ml-4 react-l-s bg-color-blue">
+<!--            <div class="react-left ml-4 react-l-s bg-color-blue">
               <span class="react-left"></span>
               <span class="text fw-b" style="font-size:24px;">柯赛科技数据看板</span>
-            </div>
+            </div>-->
           </div>
           <div class="d-flex aside-width">
             <div class="react-right bg-color-r mr-3">
-              <el-button type="text" class="text" style="width:50% ;font-size: 21px;" @click="fullScreen" ref="fullScreen"
+              <el-button type="text" class="text" style="width:50% ;font-size: 21px; color: #000000 !important;font-weight: bold;" @click="fullScreen" ref="fullScreen"
                          v-show=!isFullScreen >全屏</el-button>
-              <el-button type="text" class="text" style="width:50% ;font-size: 21px;" @click="exitFullScreen" ref="exitFullScreen" v-show=isFullScreen>退出全屏</el-button>
+              <el-button type="text" class="text" style="width:50% ;font-size: 21px; color: #000000 !important;font-weight: bold;" @click="exitFullScreen" ref="exitFullScreen" v-show=isFullScreen>退出全屏</el-button>
             </div>
             <div class="react-right mr-4 react-l-s" style="width: 900px">
               <span class="react-after"></span>
@@ -61,8 +61,8 @@
                     :value="item.LI_CODE"
                 ></el-option>
               </el-select>
-              <span class="text">&nbsp;&nbsp;&nbsp;&nbsp;</span>
-              <span class="text">{{ dateYear }} {{ dateWeek }} {{ dateDay }}</span>
+              <span class="text">&nbsp;&nbsp;</span>
+              <span class="text datetext">{{ dateYear }} {{ dateWeek }} {{ dateDay }}</span>
             </div>
           </div>
         </div>
@@ -140,7 +140,7 @@ export default {
           type: 'warning'
       });
     })
-   setTimeout(() => {
+  setTimeout(() => {
       this.$router.push("/makeprocess")
     }, 60000)
   },
@@ -191,29 +191,31 @@ export default {
 @import '../../assets/scss/indexzz.scss';
 .dropdown{
   font-size: 22px;
-  color: #f7f8fa;
+  color: #000000;
+  font-weight: bold;
   transform: skewX(45deg);
   ::v-deep .el-select-dropdown {
     /* // 若不将下拉框的背景颜色设置为:transparent,那么做不出来半透明的效果;
     // 因为其最终的显示为:下拉框有一个背景颜色且下拉框的字体有一个背景颜色,重叠后的效果展示; */
-    border: 1px solid #0f1325;
-    background: #04308D !important;
+    border: 0px solid #0f1325;
+  /*  background: #04308D !important;*/
   }
 
   ::v-deep .el-input__inner {
-    background-color: #1a5cd7;
-    color: #fff;
+   /* background-color: #1a5cd7;*/
+    color: #000000;
     font-size: 22px;
-    border: 1px solid #0f1325;
+    font-weight: bold;
+    border: 0px solid #0f1325;
   }
 
   .el-select-dropdown__item {
-    color: #fff;
+    color: #000000;
     background-color: #0f1325;
   }
   ::v-deep .el-select-dropdown {
     background-color: transparent;
-    border: 1px solid #0f1325;
+   /* border: 1px solid #0f1325;*/
   }
   ::v-deep.el-select-dropdown__list {
     padding: 0;
@@ -228,6 +230,13 @@ export default {
   .el-select-dropdown__item:hover {
     background-color: rgba(0, 225, 219, 0.690196078431373);
   }
+
+  ::v-deep.el-select .el-input .el-select__caret {
+    color: #000000;
+    padding: 6px 0px 0px 6px;
+    font-size: 22px;
+  }
+
 }
 
 </style>

+ 21 - 10
src/views/zz/up1.vue

@@ -32,9 +32,9 @@ export default {
         data: [],
         rowNum: 12,
         headerHeight: 35,
-        headerBGC: 'rgba(15,19,37,0.1)',
-        oddRowBGC: 'rgba(15,19,37,0.1)',
-        evenRowBGC: 'rgba(23,28,51,0.1)',
+        headerBGC: '#FFFFFFFF',
+        oddRowBGC: '#FFFFFFFF',
+        evenRowBGC: '#FFFFFFFF',
         columnWidth: [190, 120, 340, 120, 120, 160, 330, 200],
         align: [ 'center', 'center', 'center', 'center', 'center', 'center', 'center', 'center'],
         carousel: 'page',
@@ -129,10 +129,10 @@ export default {
     .header-content {
       border-radius: 10px;
       padding: 5px;
-      background-color: rgba(15, 19, 37, 0.1);
+     // background-color: rgba(15, 19, 37, 0.1);
 
       .header-title {
-        color: #c3cbde;
+        //color: #000000;
         font-size: 25px;
         font-weight: bold;
         display: flex;
@@ -152,10 +152,24 @@ export default {
 
       ::v-deep .header {
         font-size: 25px;
+        color: #000000 !important;
+        font-weight: bold;
       }
       ::v-deep .rows span{
         font-size: 26px;
-      } 
+      }
+      ::v-deep .colorY {
+        color: #000000;
+        &:hover {
+          color: #000000 !important;
+        }
+      }
+      ::v-deep  .colorRemind {
+        color: #faad14!important;
+        &:hover {
+          color: #faad14!important;
+        }
+      }
     }
   }
 }
@@ -165,14 +179,11 @@ export default {
   color: #ff4d4f;
 }
 
-.colorRemind {
-  color: #faad14;
-}
-
 .colorGrass {
   color: #52c41a;
 }
 
+
 .fs-xxl {
   font-size: 16px;
 }

+ 8 - 8
src/views/zz/up4.vue

@@ -1,20 +1,20 @@
 <template>
   <div id="zzup4">
-    <div class="bg-color-black">
+    <div class="bg-color-black1">
       <div class="d-flex body-box ">
         <div class="item fs-xxxl">
-          <div class="dv-dig-flop ml-1 ">
+          <div class="dv-dig-flop ml-1 fw-b ">
             <img :src="imgSrc1" class="responsive-img">
-            <div class="mt-3 ml-3 colorText fw-b ">生产负责人</div>
+            <div class="mt-3 ml-3 ">生产负责人</div>
             <div class ='mt-3 ai-center' >
               <p>{{ upitem.v_leadname }}</p>
             </div>
           </div>
         </div>
         <div class="item fs-xxxl">
-          <div class="dv-dig-flop ml-1">
+          <div class="dv-dig-flop ml-1 fw-b">
             <img :src="imgSrc2"  class="responsive-img">
-            <div class="mt-3  colorText fw-b ">品质负责人</div>
+            <div class="mt-3 ">品质负责人</div>
             <div class ='mt-3 ai-center '>
               <p>{{ upitem.v_quaname }}</p>
             </div>
@@ -22,7 +22,7 @@
         </div>
 
         <div class="item fs-xxl ml-2">
-          <div class="ml-5">
+          <div class="ml-5 fw-b">
             <div class="mt-3 ml-4">出勤数据</div>
             <div class="mt-3">应到人数:{{mancount}}</div>
             <div class="mt-3">实到人数:{{actmancount}}</div>
@@ -167,7 +167,7 @@ $box-width: 100%;
   font-size: 32px;
   width: $box-width;
   border-radius: 5px;
-  .bg-color-black {
+  .bg-color-black1 {
     height: $box-height - 25px;
     border-radius: 10px;
     padding: 5px;
@@ -188,7 +188,7 @@ $box-width: 100%;
       height: 265px;
       .dv-dig-flop {
         width: 100%;
-        color: #3de7c9;
+     //   color: #3de7c9;
         display: flex;
         flex-direction: column;
         justify-content: center;