调整演示

src/assets/scss/indexmakeprocess.scss

@@ -18,9 +18,10 @@
     width: 100%;
     height: 100%;
     padding: 0px 16px 0 16px;
-    background-image: url("../../assets/bgNew.jpg");
+    background-image: url("../../assets/bgNew.png");
     background-size: cover;
     background-position: center center;
+    background-position: top -20px center;
   }
 
   .host-body {

src/assets/scss/indexprodline.scss

@@ -18,9 +18,9 @@
     width: 100%;
     height: 100%;
     padding: 0px 16px 0 16px;
-    background-image: url("../../assets/bgNew.jpg");
+    background-image: url("../../assets/bgNew.png");
     background-size: cover;
-    background-position: center center;
+    background-position: top -20px center;
   }
 
   .host-body {
@@ -81,10 +81,10 @@
         width: 500px;
       }
       font-size: 18px;
-      width: 300px;
+      width: 10%;
       line-height: 50px;
       text-align: center;
-      transform: skewX(-45deg);
+      // transform: skewX(-45deg);
 
       .react-after {
         position: absolute;
@@ -93,15 +93,15 @@
         height: 50px;
         width: 50px;
       /*  background-color: #1a5cd7;*/
-        transform: skewX(45deg);
+        // transform: skewX(45deg);
       }
 
       .text {
         display: inline-block;
-        transform: skewX(45deg);
+        // transform: skewX(45deg);
       }
       .datetext{
-        font-size: 18px;
+        font-size: 30px;
         font-weight: bold;
       }
     }
@@ -116,7 +116,7 @@
       height: 50px;
       line-height: 50px;
       text-align: center;
-      transform: skewX(45deg);
+      // transform: skewX(45deg);
     /*  background-color: #1a5cd7;*/
 
       .react-left {
@@ -126,12 +126,12 @@
         height: 50px;
         width: 50px;
        /* background-color: #1a5cd7;*/
-        transform: skewX(-45deg);
+        // transform: skewX(-45deg);
       }
 
       .text {
         display: inline-block;
-        transform: skewX(-45deg);
+        // transform: skewX(-45deg);
       }
     }
 

src/assets/scss/indexzz.scss

@@ -18,9 +18,9 @@
     width: 100%;
     height: 100%;
     padding: 0px 16px 0 16px;
-    background-image: url("../../assets/bgNew.jpg");
+    background-image: url("../../assets/bgNew.png");
     background-size: cover;
-    background-position: center center;
+    background-position: top -20px center;
   }
 
   .host-body {

src/views/makeprocess/index.vue

@@ -26,11 +26,13 @@
 
         <!-- 第二行 -->
         <div class="d-flex jc-between px-2 header-pad">
-          <div class="d-flex aside-width">
+          <div class="d-flex aside-width" style="width: 55%">
 <!--            <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>-->
+            
+            <span style="text-align: right;width: 100%; font-size: 50px; font-weight: bold;letter-spacing: .3em;">产线计划未完成订单明细</span>
           </div>
           <div class="d-flex aside-width">
             <div class="react-right bg-color-r mr-3">

src/views/makeprocess/list.vue

@@ -2,7 +2,7 @@
   <div id="ddlist">
     <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>
+        <!-- <span class="text mx-2 fw-b">产线计划未完成订单明细</span> -->
       </div>
       <div class="d-flex jc-center body-box">
         <dv-scroll-board class="dv-scr-board" :config="config" ref="scroll-board" />
@@ -62,14 +62,18 @@ export default {
             for (let index = 0; index < columns.length; index++) {
               const element = columns[index];
               if(element.width>0) {
-                headers.push(element.text);
+                if(element.text == "抵达线体"){
+                  continue;
+                }else{
+                  headers.push(element.text);
+                }
                 columnWidths.push(element.width);
                 fieldnames.push(element.dataIndex);
                 aligns.push('center');
               }
             }
             this.config.header = headers;
-            this.config.columnWidth = columnWidths;
+            this.config.columnWidth = [180,120,320,140,140,100,200,200,465];
             this.config.align = aligns;
             let dataList = JSON.parse(result.data.data);
             let resultList = new Array();
@@ -78,7 +82,15 @@ export default {
               let item = new Array();
               fieldnames.forEach(function (ele) {
                 // 遍历数组，对每个元素进行操作
-                item.push("<span>" + element[ele] + "</span>");
+                if(ele == "ma_salecode"){
+                  let str = element[ele].slice(2)
+                  item.push("<span>" + str + "</span>");
+                }else if (ele == "ma_kind"){
+                  let str = element[ele].slice(0,2)
+                  item.push("<span>" + str + "</span>");
+                }else{
+                  item.push("<span>" + element[ele] + "</span>");
+                }
               });
               resultList.push(item);
             }
@@ -131,6 +143,9 @@ $box-width: 100%;
         .row-item {
           font-size: 26px !important;
           color: #000000 !important;
+          >.ceil{
+            // border: 1px solid #000000;
+          }
         }
         /* .ceil {
            border-right: 1px solid #000000 !important;

src/views/prodline/bottom1.vue

@@ -19,12 +19,12 @@
       </div>
 
       <div class="down1">
-        <div>{{shop}}</div>
+        <!-- <div>{{shop}}</div> -->
         <div>今日计划数 <span class="spec">{{finishrate2}}</span> </div>
         <div>急单数   <span class="spec">{{finishrate}} </span> </div>
         <div>今日完成数 <span class="spec">{{finishrate3}} </span> </div>
         <div>今日完成率 <span class="spec">{{finishrate4}}% </span>  </div>
-        <div>今日订单数 <span class="spec">{{finishrate2}} </span> </div>
+        <div>未完成订单数 <span class="spec">{{finishrate2}} </span> </div>
         <div>昨日达成率  <span class="spec">{{finishrate5}}% </span>  </div>
       </div>
 
@@ -51,7 +51,7 @@ export default {
         headerBGC: '#FFFFFF',
         oddRowBGC: '#FFFFFF',
         evenRowBGC: '#FFFFFF',
-        columnWidth: [220,120,350,140,140,140,420],
+        columnWidth: [170,100,460,100,100,100,435,300],
         align: ['center','center','center','center','center','center','center','center'],
         index: false,
         carousel: 'page',
@@ -105,9 +105,9 @@ export default {
           let item = [];
           const cellClass = element.v_remark1 && element.v_remark1 !== "" ? 'colorRed' :
               element.v_blstatus == '加工中' ? 'colorRemind' : element.v_blstatus == '已完成'?'colorGrass':'colorY';
-
+          let wo = element.v_sacode;
           //item.push(`<span class="cell-text ${cellClass}">${element.v_licode}</span>`);
-          item.push(`<span class="cell-text ${cellClass}">${element.v_sacode}</span>`);
+          item.push(`<span class="cell-text ${cellClass}">${wo.slice(2)}</span>`);
           item.push(`<span class="cell-text ${cellClass}">${element.v_seller}</span>`);
           item.push(`<span class="cell-text ${cellClass}">${element.v_jitype}</span>`);
           item.push(`<span class="cell-text ${cellClass}">${element.v_qty}</span>`);
@@ -115,9 +115,9 @@ export default {
           item.push(`<span class="cell-text ${cellClass}">${element.v_planoutqty}</span>`);
           item.push(`<span class="cell-text ${cellClass}">${element.v_madeqty}</span>`);
          // item.push(`<span class="cell-text ${cellClass}">${element.v_madejd}</span>`);
-          item.push(`<span class="cell-text ${element.v_remark ? 'colorRemind' : cellClass}">${element.v_remark}</span>`);
-          item.push(`<span class="cell-text ${cellClass}">${element.v_remark1}</span>`);
-          item.push(`<span class="cell-text ${element.v_yc ? 'colorRemind' : cellClass}">${element.v_yc}</span>`);
+          item.push(`<span class="cell-text ${element.v_remark ? '' : cellClass}" style="color:red;">${element.v_remark}</span>`);
+          item.push(`<span class="cell-text ${cellClass}" style="color:red;">${element.v_remark1}</span>`);
+          // item.push(`<span class="cell-text ${element.v_yc ? '' : cellClass}">${element.v_yc}</span>`);
 
           resultList.push(item);
         }
@@ -237,6 +237,7 @@ $box-width: 100%;
           font-weight: bold;
           .header-item {
             line-height: 45px !important;
+            border: 1px solid #000000;
            // border-right: 1px solid #000000 !important;
            // border-bottom: 1px solid #000000 !important; // 加粗表头下边框
 
@@ -260,6 +261,9 @@ $box-width: 100%;
             padding: 0 !important;
             color: #000000 !important;
 
+            >.ceil{
+              border: 1px solid #000000;
+            }
             span.cell-text {
               display: inline-block;
               vertical-align: middle;
@@ -293,6 +297,7 @@ $box-width: 100%;
   .down1{
     width:100%;
     height: 50px;
+    margin-top: 5px;
     border-radius: 15px;
     color: white;              /* 文字颜色 */
     padding: 1px 35px;        /* 内边距 */

src/views/prodline/index.vue

@@ -26,23 +26,23 @@
 
         <!-- 第二行 -->
         <div class="d-flex jc-between px-2 header-pad">
-          <div class="d-flex aside-width">
+          <div class="d-flex aside-width" style="width: 50%">
 <!--            <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>-->
+            <span style="text-align: right;width: 100%; font-size: 50px; font-weight: bold;letter-spacing: .3em;">车间生产信息数据看板</span>
           </div>
-          <div class="d-flex aside-width">
+          <div class="d-flex aside-width"  style="width: 50%">
             <div class="react-right bg-color-r mr-3">
               <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; 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>
+            <div class="react-right mr-4 react-l-s" style="width: 90%">
               <el-dropdown class="dropdown">
                 <span class="el-dropdown-link" ref="echarType">
-                  车间看板<i class="el-icon-arrow-down el-icon--right"></i>&nbsp;&nbsp;&nbsp;&nbsp;
+                  车间看板<i class="el-icon-arrow-down el-icon--right"></i>
                 </span>
                 <el-dropdown-menu slot="dropdown">
                   <el-dropdown-item class="dropdownitem"><router-link to="total">总看板</router-link></el-dropdown-item>
@@ -62,8 +62,7 @@
                     :value="item.LI_CODE"
                 ></el-option>
               </el-select>
-              <span class="text">&nbsp;&nbsp;</span>
-              <span class="text datetext">{{ dateYear }} {{ dateWeek }} {{ dateDay }}</span>
+              <div class="text datetext">{{ dateYear }} {{ dateWeek }} {{ dateDay }}</div>
             </div>
           </div>
         </div>
@@ -229,10 +228,11 @@ export default {
 <style lang="scss" scoped>
 @import '../../assets/scss/indexprodline.scss';
 .dropdown{
-  font-size: 22px;
+  font-size: 30px;
   color: #000000;
   font-weight: bold;
-  transform: skewX(45deg);
+  margin-right: 15px;
+  // transform: skewX(45deg);
   ::v-deep .el-select-dropdown {
     /* // 若不将下拉框的背景颜色设置为：transparent，那么做不出来半透明的效果；
     // 因为其最终的显示为：下拉框有一个背景颜色且下拉框的字体有一个背景颜色，重叠后的效果展示； */
@@ -243,7 +243,7 @@ export default {
   ::v-deep .el-input__inner {
    /* background-color: #1a5cd7;*/
     color: #000000;
-    font-size: 22px;
+    font-size: 30px;
     font-weight: bold;
     border: 0px solid #0f1325;
   }

src/views/prodline/up2.vue

@@ -26,8 +26,10 @@ export default {
         headerBGC: '#ded9d9', //表头
         oddRowBGC: '#ded9d9', //奇数行
         evenRowBGC: '#ded9d9', //偶数行
-        columnWidth: [180,250,150,150],
+        columnWidth: [180,270,150,150],
         align: ['center','center','center','center'],
+        carousel: 'page',
+        waitTime: 5000
       },
     }
   },
@@ -55,21 +57,26 @@ export default {
       }).then((result) => {
             let dataList = JSON.parse(result.data.data);
             let resultList = new Array();
+            let styleStr = '';
             for (let index = 0; index < dataList.length; index++) {
               const element = dataList[index];
               let item = new Array();
+              styleStr = element.de_maintain == '未保养' || element.de_maintain == '待维保' || element.de_maintain == '维修中' > 0 ? 'color:red;' : 'color:black;';
+
               if(element.de_maintain =='未保养' ||element.de_runstatus =='故障中'){
                 item.push("<span  class='colorRed fs-xl'>" + element.de_code + "</span>");
                 item.push("<span  class='colorRed fs-xl'>" + element.de_name + "</span>");
                 item.push("<span  class='colorRed fs-xl'>" + element.de_runstatus + "</span>");
-                item.push("<span  class='colorRed fs-xl'>" + element.de_maintain + "</span>");
-                item.push("<span  class='colorRed fs-xl'>" + element.de_remark + "</span>");
+                // item.push("<span  class='colorRed fs-xl'>" + element.de_maintain + "</span>");
+                item.push(`<span  class='colorGrass fs-xl' style='${styleStr}'>${element.de_maintain}</span>`);
+                // item.push("<span  class='colorRed fs-xl'>" + element.de_remark + "</span>");
               }else{
                 item.push("<span  class='colorGrass fs-xl'>" + element.de_code + "</span>");
                 item.push("<span  class='colorGrass fs-xl'>" + element.de_name + "</span>");
                 item.push("<span  class='colorGrass fs-xl'>" + element.de_runstatus + "</span>");
-                item.push("<span  class='colorGrass fs-xl'>" + element.de_maintain + "</span>");
-                item.push("<span  class='colorGrass fs-xl'>" + element.de_remark + "</span>");
+                // item.push("<span  class='colorGrass fs-xl'>" + element.de_maintain + "</span>");
+                item.push(`<span  class='colorGrass fs-xl' style='${styleStr}'>${element.de_maintain}</span>`);
+                // item.push("<span  class='colorGrass fs-xl'>" + element.de_remark + "</span>");
               }
               resultList.push(item);
             }
@@ -111,12 +118,19 @@ $box-width: 100%;
         font-size: 20px !important;
         color: #000000 !important;
         font-weight: bold;
+
+        .header-item {
+          border: 1px solid #000000;
+        }
       }
 
       .rows {
         .row-item {
           font-size: 10px !important;
           color: #000000 !important;
+          >.ceil{
+              border: 1px solid #000000;
+          }
         }
       }