From 7b76e5ccb27d25f20bae6a48665ca712e491c513 Mon Sep 17 00:00:00 2001
From: haoxuan <haoxuan>
Date: 星期一, 11 九月 2023 16:56:11 +0800
Subject: [PATCH] 生产看板 样式改版 2023-9-11

---
 src/components/AddIssue.vue |   98 ++++++++++++++++++++++++++++++++++--------------
 1 files changed, 69 insertions(+), 29 deletions(-)

diff --git a/src/components/AddIssue.vue b/src/components/AddIssue.vue
index 8accaf8..41c8c49 100644
--- a/src/components/AddIssue.vue
+++ b/src/components/AddIssue.vue
@@ -7,8 +7,13 @@
     class="add-event-dialog"
     :show-close="false"
   >
-    <div class="tank-box" v-loading.fullscreen.lock="isLoading" element-loading-text="涓嬪彂涓紝璇风◢鍚�...">
-      <div slot="title" class="tac drawerHeader">鏂颁换鍔�</div>
+    <div class="tank-box">
+      <div slot="title" class="tac drawerHeader">
+        <span class="title-l">鏂颁换鍔�</span>
+        <span class="title-r" @click="closeClick">
+          <img src="../../public/close.png" />
+        </span>
+      </div>
       <div class="dialog-content-box">
         <div
           style="
@@ -16,7 +21,6 @@
             width: 100%;
             height: 100%;
             overflow: hidden;
-            margin-bottom: 30px;
             text-align: left;
           "
         >
@@ -85,10 +89,10 @@
                   style="
                     color: #fff;
                     font-size: 18px;
-                    font-weight: 700;
                     margin-bottom: 10px;
                     margin-top: 20px;
                   "
+                  class="color_4efefa"
                 >
                   宸ヨ壓鍙傛暟
                 </div>
@@ -97,7 +101,8 @@
                   v-for="(item, index) in Arr"
                   :key="index"
                 >
-                  {{ item.Key }}锛歿{ item.Value || "" }}
+                  {{ item.Key }}锛歿{ item.Value || "" }} 
+                  
                 </div>
               </div>
             </div>
@@ -139,14 +144,12 @@
       </div>
       <div slot="footer" class="dialog-footer tac" style="overflow: hidden">
         <template v-if="messageError">
-          <div class="btn" style="margin-left: 220px" @click="confirmClick2">
+          <div class="btn"  @click="confirmClick2">
             <img src="../../public/confirm3.png" />
           </div>
         </template>
         <template v-else>
-          <div class="btn" @click="closeClick">
-            <img src="../../public/btn1.png" />
-          </div>
+         
           <div class="btn" v-if="showBtn == 1" @click="confirmClick1">
             <img src="../../public/confirm3.png" />
           </div>
@@ -159,7 +162,11 @@
             v-prevent-re-click="3000"
             @click="onSubmit()"
           >
+            <i class="el-icon-loading icon-loading" v-if="isLoading"/>
             <img src="../../public/confirm1.png" />
+          </div>
+          <div class="btn" @click="closeClick">
+              <img src="../../public/btn1.png" />
           </div>
         </template>
       </div>
@@ -200,7 +207,7 @@
   data() {
     return {
       islook: false,
-      showBtn: 1,
+      showBtn:1,
       num: 0,
       timer: null,
       message: "璇风‘璁ょ敓浜у畨鍏紒",
@@ -253,6 +260,7 @@
         this.islook = true;
       } else {
         this.islook = false;
+        // this.islook = true;
       }
     },
     getDateObj(date, fmt) {
@@ -305,6 +313,9 @@
             this.getCode(this.resParams);
           }
         }, 1000);
+        if(this.isLoading){
+          return true;
+        }
         this.isLoading=true;
           sendProcessParams({ id: this.taskData.Procedure.ID }).then((res) => {
             console.log(res,'====res')
@@ -318,6 +329,9 @@
               this.resParams = res;
             }
           });
+          setTimeout(()=>{
+            this.isLoading=false;
+          },30000)
       }
     },
     getCode(res) {
@@ -352,14 +366,14 @@
 
 <style lang="scss" scoped>
 .tank-box {
-  width: 638px;
+  width: 783px;
   height: 630px;
-  padding: 0 20px;
   background: url("../../public/tank.png") no-repeat center center / cover;
   position: relative;
   .dialog-footer {
     position: absolute;
-    bottom: 40px;
+    bottom: 30px;
+    width:94%;
   }
 }
 .color_4efefa {
@@ -375,9 +389,10 @@
   margin-bottom: 13px;
 }
 .title-box {
-  width: 100%;
+  width: calc(100% - 160px);
   height: auto;
   overflow: hidden;
+  padding:0 80px;
   .title-item {
     width: 45%;
     float: left;
@@ -391,11 +406,11 @@
   }
 
   .title-bng {
-    height: 42px;
-    line-height: 42px;
+    height: 52px;
+    line-height:52px;
     span {
-      width: calc(100% - 110px);
-      height: 42px;
+      width: calc(100% - 120px);
+      height: 52px;
       text-align: center;
       display: inline-block;
       background: url("../../public/number.png") no-repeat center center / cover;
@@ -430,16 +445,24 @@
   padding: 0 !important;
 }
 .btn {
-  width: 200px;
+  width: 150px;
   height: auto;
-  float: left;
+  float: right;
   display: inline-block;
+  position:relative;
   img {
     width: 100%;
   }
+  .icon-loading{
+    font-size:19px;
+    color:#333;
+    position:absolute;
+    line-height:3.4;
+    left:15%;
+  }
   &:nth-of-type(1) {
-    margin-right: 30px;
-    margin-left: 110px;
+    // margin-right: 30px;
+    // margin-left: 110px;
   }
 }
 ::v-deep .el-tabs__content {
@@ -519,7 +542,7 @@
 .dialog-content-box {
   height: calc(100% - 200px);
   // overflow: hidden;
-  padding: 50px 20px 20px;
+  padding: 20px 0px 20px;
   .el-form {
     overflow: hidden;
   }
@@ -553,12 +576,29 @@
   font-weight: 600;
 }
 .drawerHeader {
-  font-weight: 700;
-  font-size: 20px;
-  text-align: center;
-  color: #fff;
-  height: 35px;
-  line-height: 35px;
+  width:98%;
+  margin:0 auto;
+  overflow:hidden;
+  .title-l{
+    width:25%;
+    float:left;
+    margin-left:30px;
+    font-size: 27px;
+    color: #fff;
+    height: 3.2vw;
+    line-height: 4.5vw;
+  }
+  .title-r{
+    width:60px;
+    float:right;
+    height: 60px;
+    line-height: 5vw;
+    cursor:pointer;
+    img{
+      display:inline-block;
+      width:100%;
+    }
+  }
   .identify {
     width: 80px;
     height: 25px;

--
Gitblit v1.8.0