From da0a3c5dcb95cae59af0719d42f2b8f9225a5df5 Mon Sep 17 00:00:00 2001
From: haoxuan <haoxuan>
Date: 星期四, 14 九月 2023 17:33:06 +0800
Subject: [PATCH] 按钮样式修改

---
 src/components/AddIssue.vue |   99 ++++++++++++++++++++++++++++++++++++-------------
 1 files changed, 72 insertions(+), 27 deletions(-)

diff --git a/src/components/AddIssue.vue b/src/components/AddIssue.vue
index 0c0eb71..be37b28 100644
--- a/src/components/AddIssue.vue
+++ b/src/components/AddIssue.vue
@@ -69,7 +69,7 @@
                   宸ユ椂锛� {{ taskData.Procedure.procedure.workHours || "" }}
                 </div>
                 <div class="title-item">
-                  璧锋鏃堕棿锛� {{ formatDate(taskData.Order.startTime) || "" }}
+                  璁″垝鏃堕棿锛� {{ formatDate(taskData.Order.startTime) || "" }}
                   -
                   {{ formatDate(taskData.Order.endTime) }}
                 </div>
@@ -114,24 +114,37 @@
                   font-size: 26px;
                   width: 100%;
                   text-align: center;
-                  margin-bottom: 20px;
-                  margin-top: 10px;
+                  margin-bottom: 15px;
+                  line-height:35px;
                 "
+                :class="showBtn == 3&&isLoading?'margin-top-10px':'margin-top-40px'"
               >
+              <template v-if="showBtn == 2">
+                  <div class="gif">
+                    <img  src="../../public/shan.gif" />
+                  </div>
+                </template>
+                <template v-if="showBtn == 3&&!isLoading">
+                  <div class="gif">
+                    <span class="yuandian"></span>
+                  </div>
+                </template>
                 {{ message }}
               </div>
-              <div class="progress-item">
-                <span>{{ parseInt((num / 60) * 100) }}%</span>
-                <el-progress
-                  style="width: calc(100% - 50px); float: right"
-                  define-back-color="#CDC6C6"
-                  color="#00cc66"
-                  text-color="#fff"
-                  :text-inside="true"
-                  :stroke-width="20"
-                  :percentage="parseInt((num / 60) * 100)"
-                ></el-progress>
-              </div>
+              <template v-if="showBtn == 3&&isLoading">
+                <div class="progress-item">
+                    <span>{{ parseInt((num / 60) * 100) }}%</span>
+                    <el-progress
+                      style="width: calc(100% - 50px); float: right"
+                      define-back-color="#CDC6C6"
+                      color="#00cc66"
+                      text-color="#fff"
+                      :text-inside="true"
+                      :stroke-width="20"
+                      :percentage="parseInt((num / 60) * 100)"
+                    ></el-progress>
+                </div>
+              </template>
             </div>
           </template>
 
@@ -149,7 +162,9 @@
           </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/confirm1.png" />
           </div>
@@ -164,9 +179,6 @@
           >
             <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>
@@ -228,10 +240,18 @@
         this.showBtn = 3;
       }
     },
+    islook(){
+      this.showBtn=1;
+      if (this.timer) {
+        clearInterval(this.timer);
+      }
+      this.num = 0;
+    },
   },
   methods: {
     confirmClick2() {
       this.messageError = "";
+      this.isLoading=false;
     },
     confirmClick1() {
       this.num = 0;
@@ -259,7 +279,7 @@
         this.islook = true;
       } else {
         this.islook = false;
-        // this.islook = true;
+        this.islook = true;
       }
     },
     getDateObj(date, fmt) {
@@ -316,8 +336,7 @@
           return true;
         }
         this.isLoading=true;
-          sendProcessParams({ id: this.taskData.Procedure.ID }).then((res) => {
-            console.log(res,'====res')
+          sendProcessParams({ procedureId: this.taskData.Procedure.ID,position: Number(this.taskData.Position), }).then((res) => {
             if (res.code == 200) {
               this.resParams = res;
               this.isLoading=false;
@@ -370,8 +389,15 @@
   .dialog-footer {
     position: absolute;
     bottom: 30px;
-    width:94%;
+    width:100%;
+    text-align:center;
   }
+}
+.margin-top-10px{
+  margin-top:10px;
+}
+.margin-top-40px{
+  margin-top:40px;
 }
 .color_4efefa {
   color: #4efefa !important;
@@ -386,10 +412,10 @@
   margin-bottom: 13px;
 }
 .title-box {
-  width: calc(100% - 160px);
+  width: calc(100% - 140px);
   height: auto;
   overflow: hidden;
-  padding:0 80px;
+  padding:0 70px;
   .title-item {
     width: 45%;
     float: left;
@@ -444,7 +470,6 @@
 .btn {
   width: 150px;
   height: auto;
-  float: right;
   display: inline-block;
   position:relative;
   img {
@@ -551,7 +576,27 @@
     background:#0E246A;
     .title-box{
       padding:0 10px;
+      width:calc(100% - 20px);
     }
+  }
+  .gif{
+    width:35px;
+    margin:0 auto;
+    display:inline-block;
+    vertical-align: middle;
+    img{
+      width:100%;
+    }
+    .yuandian {
+        width: 35px;
+        height: 35px;
+        display: inline-block;
+        // background: #15d815;
+        background:red;
+        border-radius: 50%;
+        margin-top:-5px;
+        vertical-align: middle;
+      }
   }
   .progress-item {
     width: 55%;
@@ -586,7 +631,7 @@
     width:25%;
     float:left;
     margin-left:30px;
-    font-size: 27px;
+    font-size: 25px;
     color: #fff;
     height: 3.2vw;
     line-height: 4.5vw;

--
Gitblit v1.8.0