公务用车 界面修改

src/views/login.vue

@@ -4,42 +4,42 @@
       <h3 class="title-pass">账号登录</h3>
       <el-form-item prop="username">
         <label class="custom-label">
-        <el-input
-          v-model="loginForm.username"
-          type="text"
-          auto-complete="off"
-          placeholder="账号"
-        >
-          <!-- <svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" /> -->
+          <el-input
+            v-model="loginForm.username"
+            type="text"
+            auto-complete="off"
+            placeholder="账号"
+          >
+            <!-- <svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" /> -->
 
-        </el-input>
-      </label>
+          </el-input>
+        </label>
       </el-form-item>
       <el-form-item prop="password">
         <label class="custom-Pass">
-        <el-input
-          v-model="loginForm.password"
-          type="password"
-          auto-complete="off"
-          placeholder="密码"
-          @keyup.enter.native="handleLogin"
-        >
-          <!-- <svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" /> -->
-        </el-input>
-      </label>
+          <el-input
+            v-model="loginForm.password"
+            type="password"
+            auto-complete="off"
+            placeholder="密码"
+            @keyup.enter.native="handleLogin"
+          >
+            <!-- <svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" /> -->
+          </el-input>
+        </label>
       </el-form-item>
       <el-form-item prop="code" v-if="captchaEnabled">
         <label class="custom-yzm">
-        <el-input
-          v-model="loginForm.code"
-          auto-complete="off"
-          placeholder="验证码"
-          style="width: 63%"
-          @keyup.enter.native="handleLogin"
-        >
-          <!-- <svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" /> -->
-        </el-input>
-      </label>
+          <el-input
+            v-model="loginForm.code"
+            auto-complete="off"
+            placeholder="验证码"
+            style="width: 63%"
+            @keyup.enter.native="handleLogin"
+          >
+            <!-- <svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" /> -->
+          </el-input>
+        </label>
         <div class="login-code">
           <img :src="codeUrl" @click="getCode" class="login-code-img"/>
         </div>
@@ -64,7 +64,7 @@
     </el-form>
     <!--  底部  -->
     <div class="el-login-footer">
-<!--      <span>Copyright © 2018-2022 All Rights Reserved.</span>-->
+      <!--      <span>Copyright © 2018-2022 All Rights Reserved.</span>-->
     </div>
   </div>
 </template>
@@ -136,51 +136,51 @@ export default {
       };
     },
     handleLogin() {
-  this.$refs.loginForm.validate(valid => {
-    if (valid) {
-      this.loading = true;
-
-      // 设置记住密码逻辑
-      if (this.loginForm.rememberMe) {
-        Cookies.set("username", this.loginForm.username, { expires: 30 });
-        Cookies.set("password", encrypt(this.loginForm.password), { expires: 30 });
-        Cookies.set('rememberMe', this.loginForm.rememberMe, { expires: 30 });
-      } else {
-        Cookies.remove("username");
-        Cookies.remove("password");
-        Cookies.remove('rememberMe');
-      }
+      this.$refs.loginForm.validate(valid => {
+        if (valid) {
+          this.loading = true;
 
-      this.$store.dispatch("Login", this.loginForm)
-        .then(() => {
-          this.$router.push({ path: this.redirect || "/" }).catch(() => {});
-        })
-        .catch((error) => {
-          // 提取具体错误信息
-          let errorMsg;
-          if (error && error.msg) {
-            errorMsg = error.msg;
-          } else if (error && error.message) {
-            errorMsg = error.message;
+          // 设置记住密码逻辑
+          if (this.loginForm.rememberMe) {
+            Cookies.set("username", this.loginForm.username, { expires: 30 });
+            Cookies.set("password", encrypt(this.loginForm.password), { expires: 30 });
+            Cookies.set('rememberMe', this.loginForm.rememberMe, { expires: 30 });
           } else {
-            errorMsg = '登录失败';
+            Cookies.remove("username");
+            Cookies.remove("password");
+            Cookies.remove('rememberMe');
           }
-          this.$message.error(errorMsg);
-          // 刷新验证码
-          if (this.captchaEnabled) {
-            try {
-              this.getCode();
-            } catch (e) {
-              console.error('刷新验证码失败:', e);
-            }
-          }
-        })
-        .finally(() => {
-          this.loading = false;
-        });
+
+          this.$store.dispatch("Login", this.loginForm)
+            .then(() => {
+              this.$router.push({ path: this.redirect || "/" }).catch(() => {});
+            })
+            .catch((error) => {
+              // 提取具体错误信息
+              let errorMsg;
+              if (error && error.msg) {
+                errorMsg = error.msg;
+              } else if (error && error.message) {
+                errorMsg = error.message;
+              } else {
+                errorMsg = '登录失败';
+              }
+              this.$message.error(errorMsg);
+              // 刷新验证码
+              if (this.captchaEnabled) {
+                try {
+                  this.getCode();
+                } catch (e) {
+                  console.error('刷新验证码失败:', e);
+                }
+              }
+            })
+            .finally(() => {
+              this.loading = false;
+            });
+        }
+      });
     }
-  });
-}
   }
 };
 </script>
@@ -196,12 +196,12 @@ export default {
 }
 .title-pass {
   margin: 0px auto 30px auto;
-    text-align: center;
-    font-family: FZZCHJW--GB1-0;
-    font-weight: 400;
-    font-size: 30px;
-    color: #A9FFFE;
-    letter-spacing: 4.21px;
+  text-align: center;
+  font-family: FZZCHJW--GB1-0;
+  font-weight: 400;
+  font-size: 30px;
+  color: #A9FFFE;
+  letter-spacing: 4.21px;
 }
 
 .login-form {
@@ -239,65 +239,65 @@ export default {
   }
 }
 .login-code-img {
-    height: 38px;
-    border: 2px #009998 solid;
+  height: 38px;
+  border: 2px #009998 solid;
 }
 .login-form .el-input input {
-    height: 38px;
-    background: #096C78;
-    border: 2px #009998 solid;
-    color: #A9FFFE;
-    opacity: 0.9;
-    padding-left: 35px;
+  height: 38px;
+  background: #096C78;
+  border: 2px #009998 solid;
+  color: #A9FFFE;
+  opacity: 0.9;
+  padding-left: 35px;
 }
 .el-form-item.is-error .el-input__inner, .el-form-item.is-error .el-input__inner:focus, .el-form-item.is-error .el-textarea__inner, .el-form-item.is-error .el-textarea__inner:focus {
-    border-color: #009998;
+  border-color: #009998;
 }
 .login-submit{
-    font-family: PingFangSC-SNaNpxibold;
-    font-weight: 600;
-    font-size: 18px;
-    color: #002230;
-    /* color: #FFFFFF; */
-    background-color: #1890ff;
-    /* border-color: #1890ff; */
-     opacity: 0.85;
-    background: #0DDBDA;
-    border: 1px solid #0FF9F7;
-    margin-top: 30px;
+  font-family: PingFangSC-SNaNpxibold;
+  font-weight: 600;
+  font-size: 18px;
+  color: #002230;
+  /* color: #FFFFFF; */
+  background-color: #1890ff;
+  /* border-color: #1890ff; */
+  opacity: 0.85;
+  background: #0DDBDA;
+  border: 1px solid #0FF9F7;
+  margin-top: 30px;
 }
 .login-submit:hover{
   font-family: PingFangSC-SNaNpxibold;
-    font-weight: 600;
-    font-size: 18px;
-    color: #002230;
-    /* color: #FFFFFF; */
-    background-color: #1890ff;
-    /* border-color: #1890ff; */
-     opacity: 0.85;
-    background: #0DDBDA;
-    border: 1px solid #0FF9F7;
-    margin-top: 30px;
+  font-weight: 600;
+  font-size: 18px;
+  color: #002230;
+  /* color: #FFFFFF; */
+  background-color: #1890ff;
+  /* border-color: #1890ff; */
+  opacity: 0.85;
+  background: #0DDBDA;
+  border: 1px solid #0FF9F7;
+  margin-top: 30px;
 }
 .login-submit:enabled {
   font-family: PingFangSC-SNaNpxibold;
-    font-weight: 600;
-    font-size: 18px;
-    color: #002230;
-    /* color: #FFFFFF; */
-    background-color: #1890ff;
-    /* border-color: #1890ff; */
-     opacity: 0.85;
-    background: #0DDBDA;
-    border: 1px solid #0FF9F7;
-    margin-top: 30px;
+  font-weight: 600;
+  font-size: 18px;
+  color: #002230;
+  /* color: #FFFFFF; */
+  background-color: #1890ff;
+  /* border-color: #1890ff; */
+  opacity: 0.85;
+  background: #0DDBDA;
+  border: 1px solid #0FF9F7;
+  margin-top: 30px;
 }
 .el-checkbox__input.is-checked + .el-checkbox__label {
-    color: #0FF9F7;
+  color: #0FF9F7;
 }
 .el-checkbox__input.is-checked .el-checkbox__inner {
-    background-color: #0FF9F7;
-    border-color: #0FF9F7;
+  background-color: #0FF9F7;
+  border-color: #0FF9F7;
 }
 
 .custom-label::before {
@@ -354,4 +354,4 @@ export default {
 .login-code-img {
   height: 38px;
 }
-</style>
+</style>

src/views/pad/logistics/car/carStockDialog.vue

@@ -1,99 +1,102 @@
 <template>
-  <div class="c1" @mouseleave="leaveFun">
-    <div style="display: flex;justify-content: center;width: 100%;flex-wrap: wrap">
-      <div style="position: relative;height: 38px">
-        <div class="overTitle">监控管理</div>
-        <img src="@/assets/images/main/cont_title_bg.png" width="284" alt="" class="Img">
-      </div>
-      <div class="c1_bg">
-        <div class="c1_title"></div>
-        <div class="c1_body">
-          <div style="display: flex;justify-content: center;align-items: center;margin-bottom: 10px;flex-wrap: wrap">
-            <div style="display: flex;width: 100%;align-items: center;justify-content: center;margin-bottom: 10px;">
-              <img src="../../../../assets/zhang/publicCar/car.png" width="68" style="margin-right: 20px">
-              <div class="carInstall">
-                <div style="width: 90%;display: flex;flex-wrap: wrap">
-                  <div style="width: 80%;margin-bottom: 10px">公务车终端安装率</div>
-                  <div style="width: 20%;text-align: right">{{ monitorData.percentageInstall }}%</div>
-                  <div style="width: 100%;height: 5px;background-color: #14424C;border-radius: 5px">
-                    <div class="animated-width-fir" style="height: 5px; border-radius: 5px;" :style="progressStyleFir"></div>
+  <div style="display: flex;width: 100%">
+    <div class="c1">
+      <div style="display: flex;justify-content: center;width: 100%;flex-wrap: wrap">
+        <div style="position: relative;height: 38px">
+          <div class="overTitle">监控管理</div>
+          <img src="@/assets/images/main/cont_title_bg.png" width="284" alt="" class="Img">
+        </div>
+        <div class="c1_bg">
+          <div class="c1_title"></div>
+          <div class="c1_body">
+            <div style="display: flex;justify-content: center;align-items: center;margin-bottom: 10px;flex-wrap: wrap">
+              <div style="display: flex;width: 100%;align-items: center;justify-content: center;margin-bottom: 10px;">
+                <img src="../../../../assets/zhang/publicCar/car.png" width="68" style="margin-right: 20px">
+                <div class="carInstall">
+                  <div style="width: 90%;display: flex;flex-wrap: wrap">
+                    <div style="width: 80%;margin-bottom: 10px">公务车终端安装率</div>
+                    <div style="width: 20%;text-align: right">{{ monitorData.percentageInstall }}%</div>
+                    <div style="width: 100%;height: 5px;background-color: #14424C;border-radius: 5px">
+                      <div class="animated-width-fir" style="height: 5px; border-radius: 5px;" :style="progressStyleFir"></div>
+                    </div>
                   </div>
+                  <div style="width: 8%;height:30px;border-right: 3px #14424C solid"></div>
                 </div>
-                <div style="width: 8%;height:30px;border-right: 3px #14424C solid"></div>
               </div>
-            </div>
-            <div style="display: flex;width: 100%;align-items: center;justify-content: center">
-              <img src="../../../../assets/zhang/publicCar/car.png" width="68" style="margin-right: 20px">
-              <div class="carInstall">
-                <div style="width: 90%;display: flex;flex-wrap: wrap">
-                  <div style="width: 80%;margin-bottom: 10px">公务车终端在线率</div>
-                  <div style="width: 20%;text-align: right">{{ monitorData.percentageOnline }}%</div>
-                  <div style="width: 100%;height: 5px;background-color: #14424C;border-radius: 5px">
-                    <div class="animated-width-sec" style="height: 5px; border-radius: 5px;" :style="progressStyleSec"></div>
+              <div style="display: flex;width: 100%;align-items: center;justify-content: center">
+                <img src="../../../../assets/zhang/publicCar/car.png" width="68" style="margin-right: 20px">
+                <div class="carInstall">
+                  <div style="width: 90%;display: flex;flex-wrap: wrap">
+                    <div style="width: 80%;margin-bottom: 10px">公务车终端在线率</div>
+                    <div style="width: 20%;text-align: right">{{ monitorData.percentageOnline }}%</div>
+                    <div style="width: 100%;height: 5px;background-color: #14424C;border-radius: 5px">
+                      <div class="animated-width-sec" style="height: 5px; border-radius: 5px;" :style="progressStyleSec"></div>
+                    </div>
                   </div>
+                  <div style="width: 8%;height:30px;border-right: 3px #14424C solid"></div>
                 </div>
-                <div style="width: 8%;height:30px;border-right: 3px #14424C solid"></div>
               </div>
             </div>
           </div>
-        </div>
-        <div style="display: flex;width: 100%;flex-wrap: wrap">
+          <div style="display: flex;width: 100%;flex-wrap: wrap">
 
-          <div style="width: 50%;">
-            <div class="c1_title_half">
-              <div style="position: absolute;left: 20px;top: -5px;">处置未归档车辆数</div>
-            </div>
-            <div style="display: flex;align-items: center">
-              <img src="../../../../assets/zhang/public_car.png" width="58" style="margin: 0 5px 0 33px">
-              <div style="width: 108px;height: 24px;color: #00FFFF;font-size: 34px;margin-bottom: 10px">
-                <span style="font-family: 'electronicFont'">{{ monitorData.notArchivedNum }}</span>
-                <span style="width: 15px;height: 24px;font-size: 14px;align-content: end">辆</span>
+            <div style="width: 50%;">
+              <div class="c1_title_half">
+                <div style="position: absolute;left: 20px;top: -5px;">处置未归档车辆数</div>
+              </div>
+              <div style="display: flex;align-items: center">
+                <img src="../../../../assets/zhang/public_car.png" width="58" style="margin: 0 5px 0 33px">
+                <div style="width: 108px;height: 24px;color: #00FFFF;font-size: 34px;margin-bottom: 10px">
+                  <span style="font-family: 'electronicFont'">{{ monitorData.notArchivedNum }}</span>
+                  <span style="width: 15px;height: 24px;font-size: 14px;align-content: end">辆</span>
+                </div>
               </div>
             </div>
-          </div>
 
-          <div style="width: 50%;">
-            <div class="c1_title_half">
-              <div style="position: absolute;left: 20px;top: -5px;">未带工单预警数</div>
-            </div>
-            <div style="display: flex;align-items: center;cursor: pointer" @click="chooseX">
-              <img src="../../../../assets/zhang/publicCar/pentagonCar.png" width="55" style="margin: 0 5px 0 33px">
-              <div style="width: 108px;height: 24px;color: #00FFFF;font-size: 34px;margin-bottom: 10px">
-                <span style="font-family: 'electronicFont'">{{ monitorData.noPidNum }}</span>
-                <span style="width: 15px;height: 24px;font-size: 14px;align-content: end">辆</span>
+            <div style="width: 50%;">
+              <div class="c1_title_half">
+                <div style="position: absolute;left: 20px;top: -5px;">未带工单预警数</div>
+              </div>
+              <div style="display: flex;align-items: center;cursor: pointer" @click="chooseX">
+                <img src="../../../../assets/zhang/publicCar/pentagonCar.png" width="55" style="margin: 0 5px 0 33px">
+                <div style="width: 108px;height: 24px;color: #00FFFF;font-size: 34px;margin-bottom: 10px">
+                  <span style="font-family: 'electronicFont'">{{ monitorData.noPidNum }}</span>
+                  <span style="width: 15px;height: 24px;font-size: 14px;align-content: end">辆</span>
+                </div>
               </div>
             </div>
-          </div>
 
-          <div style="width: 50%;margin-top: 10px">
-            <div class="c1_title_half">
-              <div style="position: absolute;left: 20px;top: -5px">超速预警数</div>
-            </div>
-            <div style="display: flex;align-items: center;cursor: pointer" @click="chooseY">
-              <img src="../../../../assets/zhang/publicCar/pentagonCar.png" width="55" style="margin: 0 5px 0 33px">
-              <div style="width: 108px;height: 24px;color: #00FFFF;font-size: 34px;margin-bottom: 10px">
-                <span style="font-family: 'electronicFont'">{{ monitorData.overSpeedNum }}</span>
-                <span style="width: 15px;height: 24px;font-size: 14px;align-content: end">辆</span>
+            <div style="width: 50%;margin-top: 10px">
+              <div class="c1_title_half">
+                <div style="position: absolute;left: 20px;top: -5px">超速预警数</div>
+              </div>
+              <div style="display: flex;align-items: center;cursor: pointer" @click="chooseY">
+                <img src="../../../../assets/zhang/publicCar/pentagonCar.png" width="55" style="margin: 0 5px 0 33px">
+                <div style="width: 108px;height: 24px;color: #00FFFF;font-size: 34px;margin-bottom: 10px">
+                  <span style="font-family: 'electronicFont'">{{ monitorData.overSpeedNum }}</span>
+                  <span style="width: 15px;height: 24px;font-size: 14px;align-content: end">辆</span>
+                </div>
               </div>
             </div>
-          </div>
 
-          <div style="width: 50%;margin-top: 10px">
-            <div class="c1_title_half">
-              <div style="position: absolute;left: 20px;top: -5px;">节假日预警数</div>
-            </div>
-            <div style="display: flex;align-items: center;cursor: pointer" @click="chooseZ">
-              <img src="../../../../assets/zhang/publicCar/pentagonCar.png" width="55" style="margin: 0 5px 0 33px">
-              <div style="width: 108px;height: 24px;color: #00FFFF;font-size: 34px;margin-bottom: 10px">
-                <span style="font-family: 'electronicFont'">{{ monitorData.holidayNum }}</span>
-                <span style="width: 15px;height: 24px;font-size: 14px;align-content: end">辆</span>
+            <div style="width: 50%;margin-top: 10px">
+              <div class="c1_title_half">
+                <div style="position: absolute;left: 20px;top: -5px;">节假日预警数</div>
+              </div>
+              <div style="display: flex;align-items: center;cursor: pointer" @click="chooseZ">
+                <img src="../../../../assets/zhang/publicCar/pentagonCar.png" width="55" style="margin: 0 5px 0 33px">
+                <div style="width: 108px;height: 24px;color: #00FFFF;font-size: 34px;margin-bottom: 10px">
+                  <span style="font-family: 'electronicFont'">{{ monitorData.holidayNum }}</span>
+                  <span style="width: 15px;height: 24px;font-size: 14px;align-content: end">辆</span>
+                </div>
               </div>
             </div>
-          </div>
 
+          </div>
         </div>
       </div>
     </div>
+    <div style="flex: 1" @click="leaveFun"></div>
   </div>
 </template>
 

src/views/pad/official/main.vue

@@ -135,7 +135,6 @@
     <div
       :class="dialogType < 3 ? 'dialog' : 'dialog-r'"
       v-if="dialogShow"
-      @click="closeDialog"
     >
       <terminal-data-dialog
         v-if="dialogType === 1"

src/views/pad/official/terminalDataDialog.vue

@@ -1,5 +1,6 @@
 <template>
-  <div class="c1" @mouseleave="leaveFun">
+  <div style="display: flex;width: 100%">
+    <div class="c1" >
     <div style="display: flex;justify-content: center;width: 100%;flex-wrap: wrap">
       <div style="position: relative;height: 38px">
         <div class="overTitle">资源台账</div>
@@ -133,6 +134,8 @@
       </div>
     </div>
   </div>
+    <div style="flex: 1" @click="leaveFun"></div>
+  </div>
 </template>
 
 <script>

src/views/screen/logistics/car/carStockDialog.vue

@@ -1,99 +1,102 @@
 <template>
-  <div class="c1" @mouseleave="leaveFun">
-    <div style="display: flex;justify-content: center;width: 100%;flex-wrap: wrap">
-      <div style="position: relative;height: 38px">
-        <div class="overTitle">监控管理</div>
-        <img src="@/assets/images/main/cont_title_bg.png" width="284" alt="" class="Img">
-      </div>
-      <div class="c1_bg">
-        <div class="c1_title"></div>
-        <div class="c1_body">
-          <div style="display: flex;justify-content: center;align-items: center;margin-bottom: 10px;flex-wrap: wrap">
-            <div style="display: flex;width: 100%;align-items: center;justify-content: center;margin-bottom: 10px;">
-              <img src="../../../../assets/zhang/publicCar/car.png" width="68" style="margin-right: 20px">
-              <div class="carInstall">
-                <div style="width: 90%;display: flex;flex-wrap: wrap">
-                  <div style="width: 80%;margin-bottom: 10px">公务车终端安装率</div>
-                  <div style="width: 20%;text-align: right">{{ monitorData.percentageInstall }}%</div>
-                  <div style="width: 100%;height: 5px;background-color: #14424C;border-radius: 5px">
-                    <div class="animated-width-fir" style="height: 5px; border-radius: 5px;" :style="progressStyleFir"></div>
+  <div style="display: flex;width: 100%">
+    <div class="c1" >
+      <div style="display: flex;justify-content: center;width: 100%;flex-wrap: wrap">
+        <div style="position: relative;height: 38px">
+          <div class="overTitle">监控管理</div>
+          <img src="@/assets/images/main/cont_title_bg.png" width="284" alt="" class="Img">
+        </div>
+        <div class="c1_bg">
+          <div class="c1_title"></div>
+          <div class="c1_body">
+            <div style="display: flex;justify-content: center;align-items: center;margin-bottom: 10px;flex-wrap: wrap">
+              <div style="display: flex;width: 100%;align-items: center;justify-content: center;margin-bottom: 10px;">
+                <img src="../../../../assets/zhang/publicCar/car.png" width="68" style="margin-right: 20px">
+                <div class="carInstall">
+                  <div style="width: 90%;display: flex;flex-wrap: wrap">
+                    <div style="width: 80%;margin-bottom: 10px">公务车终端安装率</div>
+                    <div style="width: 20%;text-align: right">{{ monitorData.percentageInstall }}%</div>
+                    <div style="width: 100%;height: 5px;background-color: #14424C;border-radius: 5px">
+                      <div class="animated-width-fir" style="height: 5px; border-radius: 5px;" :style="progressStyleFir"></div>
+                    </div>
                   </div>
+                  <div style="width: 8%;height:30px;border-right: 3px #14424C solid"></div>
                 </div>
-                <div style="width: 8%;height:30px;border-right: 3px #14424C solid"></div>
               </div>
-            </div>
-            <div style="display: flex;width: 100%;align-items: center;justify-content: center">
-              <img src="../../../../assets/zhang/publicCar/car.png" width="68" style="margin-right: 20px">
-              <div class="carInstall">
-                <div style="width: 90%;display: flex;flex-wrap: wrap">
-                  <div style="width: 80%;margin-bottom: 10px">公务车终端在线率</div>
-                  <div style="width: 20%;text-align: right">{{ monitorData.percentageOnline }}%</div>
-                  <div style="width: 100%;height: 5px;background-color: #14424C;border-radius: 5px">
-                    <div class="animated-width-sec" style="height: 5px; border-radius: 5px;" :style="progressStyleSec"></div>
+              <div style="display: flex;width: 100%;align-items: center;justify-content: center">
+                <img src="../../../../assets/zhang/publicCar/car.png" width="68" style="margin-right: 20px">
+                <div class="carInstall">
+                  <div style="width: 90%;display: flex;flex-wrap: wrap">
+                    <div style="width: 80%;margin-bottom: 10px">公务车终端在线率</div>
+                    <div style="width: 20%;text-align: right">{{ monitorData.percentageOnline }}%</div>
+                    <div style="width: 100%;height: 5px;background-color: #14424C;border-radius: 5px">
+                      <div class="animated-width-sec" style="height: 5px; border-radius: 5px;" :style="progressStyleSec"></div>
+                    </div>
                   </div>
+                  <div style="width: 8%;height:30px;border-right: 3px #14424C solid"></div>
                 </div>
-                <div style="width: 8%;height:30px;border-right: 3px #14424C solid"></div>
               </div>
             </div>
           </div>
-        </div>
-        <div style="display: flex;width: 100%;flex-wrap: wrap">
+          <div style="display: flex;width: 100%;flex-wrap: wrap">
 
-          <div style="width: 50%;">
-            <div class="c1_title_half">
-              <div style="position: absolute;left: 20px;top: -5px;">处置未归档车辆数</div>
-            </div>
-            <div style="display: flex;align-items: center">
-              <img src="../../../../assets/zhang/public_car.png" width="58" style="margin: 0 5px 0 33px">
-              <div style="width: 108px;height: 24px;color: #00FFFF;font-size: 34px;margin-bottom: 10px">
-                <span style="font-family: 'electronicFont'">{{ monitorData.notArchivedNum }}</span>
-                <span style="width: 15px;height: 24px;font-size: 14px;align-content: end">辆</span>
+            <div style="width: 50%;">
+              <div class="c1_title_half">
+                <div style="position: absolute;left: 20px;top: -5px;">处置未归档车辆数</div>
+              </div>
+              <div style="display: flex;align-items: center">
+                <img src="../../../../assets/zhang/public_car.png" width="58" style="margin: 0 5px 0 33px">
+                <div style="width: 108px;height: 24px;color: #00FFFF;font-size: 34px;margin-bottom: 10px">
+                  <span style="font-family: 'electronicFont'">{{ monitorData.notArchivedNum }}</span>
+                  <span style="width: 15px;height: 24px;font-size: 14px;align-content: end">辆</span>
+                </div>
               </div>
             </div>
-          </div>
 
-          <div style="width: 50%;">
-            <div class="c1_title_half">
-              <div style="position: absolute;left: 20px;top: -5px;">未带工单预警数</div>
-            </div>
-            <div style="display: flex;align-items: center;cursor: pointer" @click="chooseX">
-              <img src="../../../../assets/zhang/publicCar/pentagonCar.png" width="55" style="margin: 0 5px 0 33px">
-              <div style="width: 108px;height: 24px;color: #00FFFF;font-size: 34px;margin-bottom: 10px">
-                <span style="font-family: 'electronicFont'">{{ monitorData.noPidNum }}</span>
-                <span style="width: 15px;height: 24px;font-size: 14px;align-content: end">辆</span>
+            <div style="width: 50%;">
+              <div class="c1_title_half">
+                <div style="position: absolute;left: 20px;top: -5px;">未带工单预警数</div>
+              </div>
+              <div style="display: flex;align-items: center;cursor: pointer" @click="chooseX">
+                <img src="../../../../assets/zhang/publicCar/pentagonCar.png" width="55" style="margin: 0 5px 0 33px">
+                <div style="width: 108px;height: 24px;color: #00FFFF;font-size: 34px;margin-bottom: 10px">
+                  <span style="font-family: 'electronicFont'">{{ monitorData.noPidNum }}</span>
+                  <span style="width: 15px;height: 24px;font-size: 14px;align-content: end">辆</span>
+                </div>
               </div>
             </div>
-          </div>
 
-          <div style="width: 50%;margin-top: 10px">
-            <div class="c1_title_half">
-              <div style="position: absolute;left: 20px;top: -5px">超速预警数</div>
-            </div>
-            <div style="display: flex;align-items: center;cursor: pointer" @click="chooseY">
-              <img src="../../../../assets/zhang/publicCar/pentagonCar.png" width="55" style="margin: 0 5px 0 33px">
-              <div style="width: 108px;height: 24px;color: #00FFFF;font-size: 34px;margin-bottom: 10px">
-                <span style="font-family: 'electronicFont'">{{ monitorData.overSpeedNum }}</span>
-                <span style="width: 15px;height: 24px;font-size: 14px;align-content: end">辆</span>
+            <div style="width: 50%;margin-top: 10px">
+              <div class="c1_title_half">
+                <div style="position: absolute;left: 20px;top: -5px">超速预警数</div>
+              </div>
+              <div style="display: flex;align-items: center;cursor: pointer" @click="chooseY">
+                <img src="../../../../assets/zhang/publicCar/pentagonCar.png" width="55" style="margin: 0 5px 0 33px">
+                <div style="width: 108px;height: 24px;color: #00FFFF;font-size: 34px;margin-bottom: 10px">
+                  <span style="font-family: 'electronicFont'">{{ monitorData.overSpeedNum }}</span>
+                  <span style="width: 15px;height: 24px;font-size: 14px;align-content: end">辆</span>
+                </div>
               </div>
             </div>
-          </div>
 
-          <div style="width: 50%;margin-top: 10px">
-            <div class="c1_title_half">
-              <div style="position: absolute;left: 20px;top: -5px;">节假日预警数</div>
-            </div>
-            <div style="display: flex;align-items: center;cursor: pointer" @click="chooseZ">
-              <img src="../../../../assets/zhang/publicCar/pentagonCar.png" width="55" style="margin: 0 5px 0 33px">
-              <div style="width: 108px;height: 24px;color: #00FFFF;font-size: 34px;margin-bottom: 10px">
-                <span style="font-family: 'electronicFont'">{{ monitorData.holidayNum }}</span>
-                <span style="width: 15px;height: 24px;font-size: 14px;align-content: end">辆</span>
+            <div style="width: 50%;margin-top: 10px">
+              <div class="c1_title_half">
+                <div style="position: absolute;left: 20px;top: -5px;">节假日预警数</div>
+              </div>
+              <div style="display: flex;align-items: center;cursor: pointer" @click="chooseZ">
+                <img src="../../../../assets/zhang/publicCar/pentagonCar.png" width="55" style="margin: 0 5px 0 33px">
+                <div style="width: 108px;height: 24px;color: #00FFFF;font-size: 34px;margin-bottom: 10px">
+                  <span style="font-family: 'electronicFont'">{{ monitorData.holidayNum }}</span>
+                  <span style="width: 15px;height: 24px;font-size: 14px;align-content: end">辆</span>
+                </div>
               </div>
             </div>
-          </div>
 
+          </div>
         </div>
       </div>
     </div>
+    <div style="flex: 1" @click="leaveFun"></div>
   </div>
 </template>
 

src/views/screen/official/main.vue

@@ -38,83 +38,7 @@
     <div class="middle">
       <img src="@/assets/zhang/publicCar/officialCar.png" width="50" style="position: absolute;top: 125px;left: 20px;cursor: pointer">
       <MapTwo @transmit="transmit" :mapData="mapData" ref="map"></MapTwo>
-<!--      <img
-        v-if="showLocal"
-        class="build"
-        src="@/assets/images/build.png"
-        alt=""
-      />-->
-      <!-- 返回按钮 -->
-<!--      <div class="bottom-area flex-row align-items-center space-between">
-        <div class="bottom-left flex-row align-items-center">
-          <div class="left-item">
-            <el-cascader
-              v-model="curCompany"
-              :options="company"
-              @change="handleCompanyChange"
-              placeholder="单位"
-              :show-all-levels="false"
-            >
-              <template slot-scope="{ node, data }">
-                <div style="display: flex; align-items: center">
-                  <img
-                    v-if="data.label == '山西省公司(本部)'"
-                    src="../../../assets/images/main/tiaozhuanlouyu.png"
-                    style="width: 15px; margin-right: 10px"
-                  />
-                  <span
-                    v-else-if="data.value == '1A001' || data.value == '1A002' || data.value == '1A004' || data.value == '1A005'"
-                    style="
-                      display: inline-block;
-                      width: 10px;
-                      height: 10px;
-                      border-radius: 50%;
-                      margin-right: 10px;
-                      background: rgb(255, 180, 74);
-                    "
-                  ></span>
-                  <span
-                    v-else-if="data.value.length == 5 && data.value != '10001'"
-                    style="
-                      display: inline-block;
-                      width: 10px;
-                      height: 10px;
-                      border-radius: 50%;
-                      margin-right: 10px;
-                      background: rgb(74, 194, 29);
-                    "
-                  ></span>
-                  <span
-                    v-else-if="data.value.length == 7"
-                    style="
-                      display: inline-block;
-                      width: 10px;
-                      height: 10px;
-                      border-radius: 50%;
-                      margin-right: 10px;
-                      background: rgb(99, 235, 255);
-                    "
-                  ></span>
-                  <span>{{ data.label }}</span>
-                </div>
-                &lt;!&ndash; <div
-                    v-if="data.level == 2"
-                    style="width: 1.5vh;height: 1.5vh;background-color: red;border-radius: 60%;margin-top:10px;margin-left:10px;float:right"
-                  ></div> &ndash;&gt;
-              </template>
-            </el-cascader>
-          </div>
-          <div class="office" disabled>办公区</div>
-        </div>
-        <div class="bottom-right">
-          <img
-            v-if="showBack"
-            @click="onBack"
-            src="@/assets/images/main/back.png"
-            class="back"
-          />
-        </div>
-      </div>-->
+
     </div>
     <div class="right">
       <div class="right-cont" v-if="rightShow">
@@ -135,7 +59,6 @@
     <div
       :class="dialogType < 3 ? 'dialog' : 'dialog-r'"
       v-if="dialogShow"
-      @click="closeDialog"
     >
       <terminal-data-dialog
         v-if="dialogType === 1"
@@ -230,12 +153,6 @@ export default {
     CarWarningDialog,
     CarStockDialog,
   },
-  // props: {
-  //   appOrg: {
-  //     type: String,
-  //     default: "0000",
-  //   },
-  // },
   data() {
     return {
       total: 0,

src/views/screen/official/terminalDataDialog.vue

@@ -1,138 +1,142 @@
 <template>
-  <div class="c1" @mouseleave="leaveFun">
-    <div style="display: flex;justify-content: center;width: 100%;flex-wrap: wrap">
-      <div style="position: relative;height: 38px">
-        <div class="overTitle">资源台账</div>
-        <img src="@/assets/images/main/cont_title_bg.png" width="284" alt="" class="Img">
-      </div>
-      <div class="c1_bg">
-        <div class="c1_title"></div>
-        <div class="c1_body">
-          <div style="display: flex;justify-content: center;align-items: center;margin-bottom: 10px">
-            <img src="../../../assets/zhang/publicCar/car.png" width="68" style="margin-right: 20px">
-            <div class="carNum" v-for="(it, index) in resourceData.totalCarNum.split('')">
-              <span v-if="index < resourceData.cd" style="color: rgba(0,255,255,0.3)">{{ it }}</span>
-              <span v-if="index >= resourceData.cd">{{ it }}</span>
-            </div>
-            <div class="carText">辆</div>
-          </div>
-          <div class="c1_titleText"></div>
-          <div style="display: flex;justify-content: center;align-items: center;margin-bottom: 20px">
-            <div class="carTypeNumBox" v-for="(it, index) in carTypeNum">
-              <div style="display: flex;width: 100%;height: 25px">
-                <img src="../../../assets/zhang/publicCar/miniCar.png" width="18" style="object-fit: cover">
-                <div style="color: white;font-size: 15px">{{ it.type }}</div>
-              </div>
-              <div style="width: 100%;height: 25px;color: #00FFFF;display: flex">
-                <div style="font-size: 25px;font-family: 'electronicFont'">{{ it.num }}</div>
-                <div style="font-size: 10px;height: 100%;display: flex;align-items: end">辆</div>
+  <div style="display: flex;width: 100%">
+    <div class="c1">
+      <div style="display: flex;justify-content: center;width: 100%;flex-wrap: wrap">
+        <div style="position: relative;height: 38px">
+          <div class="overTitle">资源台账</div>
+          <img src="@/assets/images/main/cont_title_bg.png" width="284" alt="" class="Img">
+        </div>
+        <div class="c1_bg">
+          <div class="c1_title"></div>
+          <div class="c1_body">
+            <div style="display: flex;justify-content: center;align-items: center;margin-bottom: 10px">
+              <img src="../../../assets/zhang/publicCar/car.png" width="68" style="margin-right: 20px">
+              <div class="carNum" v-for="(it, index) in resourceData.totalCarNum.split('')">
+                <span v-if="index < resourceData.cd" style="color: rgba(0,255,255,0.3)">{{ it }}</span>
+                <span v-if="index >= resourceData.cd">{{ it }}</span>
               </div>
+              <div class="carText">辆</div>
             </div>
-          </div>
-          <div style="display: flex;width: 100%;">
-            <div style="width: 50%">
-              <div class="c1_titleText_half1"></div>
-              <div style="display: flex;align-items: center;margin-bottom: 10px;padding-left: 30px">
-                <div style="height: 50px;margin-right: 15px" v-for="(it, index) in carUseNum">
-                  <div style="display: flex;width: 100%;height: 25px;align-items: center">
-                    <img src="../../../assets/zhang/publicCar/miniCar.png" width="30" style="object-fit: cover">
-                    <div style="color: white;font-size: 13px">{{ it.type }}</div>
-                  </div>
-                  <div style="width: 100%;height: 25px;color: #00FFFF;display: flex;margin-left: 10px">
-                    <div style="font-size: 25px;font-family: 'electronicFont'">{{ it.num }}</div>
-                    <div style="font-size: 10px;height: 100%;display: flex;align-items: end">辆</div>
-                  </div>
+            <div class="c1_titleText"></div>
+            <div style="display: flex;justify-content: center;align-items: center;margin-bottom: 20px">
+              <div class="carTypeNumBox" v-for="(it, index) in carTypeNum">
+                <div style="display: flex;width: 100%;height: 25px">
+                  <img src="../../../assets/zhang/publicCar/miniCar.png" width="18" style="object-fit: cover">
+                  <div style="color: white;font-size: 15px">{{ it.type }}</div>
+                </div>
+                <div style="width: 100%;height: 25px;color: #00FFFF;display: flex">
+                  <div style="font-size: 25px;font-family: 'electronicFont'">{{ it.num }}</div>
+                  <div style="font-size: 10px;height: 100%;display: flex;align-items: end">辆</div>
                 </div>
               </div>
             </div>
-            <div style="width: 50%">
-              <div class="c1_titleText_half2"></div>
-              <div style="display: flex;align-items: center;margin-bottom: 10px;padding-left: 30px">
-                <div style="height: 50px;margin-right: 15px" v-for="(it, index) in carActivationNum">
-                  <div style="display: flex;width: 100%;height: 25px;align-items: center">
-                    <img src="../../../assets/zhang/publicCar/miniCar.png" width="30" style="object-fit: cover">
-                    <div style="color: white;font-size: 13px">{{ it.type }}</div>
+            <div style="display: flex;width: 100%;">
+              <div style="width: 50%">
+                <div class="c1_titleText_half1"></div>
+                <div style="display: flex;align-items: center;margin-bottom: 10px;padding-left: 30px">
+                  <div style="height: 50px;margin-right: 15px" v-for="(it, index) in carUseNum">
+                    <div style="display: flex;width: 100%;height: 25px;align-items: center">
+                      <img src="../../../assets/zhang/publicCar/miniCar.png" width="30" style="object-fit: cover">
+                      <div style="color: white;font-size: 13px">{{ it.type }}</div>
+                    </div>
+                    <div style="width: 100%;height: 25px;color: #00FFFF;display: flex;margin-left: 10px">
+                      <div style="font-size: 25px;font-family: 'electronicFont'">{{ it.num }}</div>
+                      <div style="font-size: 10px;height: 100%;display: flex;align-items: end">辆</div>
+                    </div>
                   </div>
-                  <div style="width: 100%;height: 25px;color: #00FFFF;display: flex;margin-left: 10px">
-                    <div style="font-size: 25px;font-family: 'electronicFont'">{{ it.num }}</div>
-                    <div style="font-size: 10px;height: 100%;display: flex;align-items: end">辆</div>
+                </div>
+              </div>
+              <div style="width: 50%">
+                <div class="c1_titleText_half2"></div>
+                <div style="display: flex;align-items: center;margin-bottom: 10px;padding-left: 30px">
+                  <div style="height: 50px;margin-right: 15px" v-for="(it, index) in carActivationNum">
+                    <div style="display: flex;width: 100%;height: 25px;align-items: center">
+                      <img src="../../../assets/zhang/publicCar/miniCar.png" width="30" style="object-fit: cover">
+                      <div style="color: white;font-size: 13px">{{ it.type }}</div>
+                    </div>
+                    <div style="width: 100%;height: 25px;color: #00FFFF;display: flex;margin-left: 10px">
+                      <div style="font-size: 25px;font-family: 'electronicFont'">{{ it.num }}</div>
+                      <div style="font-size: 10px;height: 100%;display: flex;align-items: end">辆</div>
+                    </div>
                   </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div style="display: flex;width: 100%;flex-wrap: wrap;margin-top: 10px">
-          <div style="width: 50%;margin-bottom: 10px">
-            <div class="c1_title_half">
-              <div style="position: absolute;left: 20px;top: -5px;">公务车编制数</div>
-            </div>
-            <div style="display: flex;align-items: center">
-              <img src="../../../assets/zhang/public_car.png" width="58" style="margin: 10px 5px 0 33px">
-              <div style="width: 108px;height: 24px;color: #00FFFF;font-size: 34px;margin-bottom: 10px">
-                <span style="font-family: 'electronicFont'">{{ resourceData.establishmentsCarNum }}</span>
-                <span style="width: 15px;height: 24px;font-size: 14px;align-content: end">辆</span>
+          <div style="display: flex;width: 100%;flex-wrap: wrap;margin-top: 10px">
+            <div style="width: 50%;margin-bottom: 10px">
+              <div class="c1_title_half">
+                <div style="position: absolute;left: 20px;top: -5px;">公务车编制数</div>
               </div>
-            </div>
-          </div>
-
-          <div style="width: 50%;margin-bottom: 10px">
-            <div class="c1_title_half">
-              <div style="position: absolute;left: 20px;top: -5px;">公务车缺编率</div>
-            </div>
-            <div style="display: flex;align-items: center">
-              <div style="position: relative">
-                <img src="../../../assets/zhang/publicCar/arcBlueEx.png" width="90" style="margin: 20px 5px 0 33px">
-                <div style="position: absolute;color: #00FFFF;width: 158px;top: 5px;font-size: 34px;font-family: 'electronicFont';text-align: center">
-                  {{ Number.isNaN(resourceData.percentageLack) ? 0 : resourceData.percentageLack }}<span style="font-size: 12px">%</span>
+              <div style="display: flex;align-items: center">
+                <img src="../../../assets/zhang/public_car.png" width="58" style="margin: 10px 5px 0 33px">
+                <div style="width: 108px;height: 24px;color: #00FFFF;font-size: 34px;margin-bottom: 10px">
+                  <span style="font-family: 'electronicFont'">{{ resourceData.establishmentsCarNum }}</span>
+                  <span style="width: 15px;height: 24px;font-size: 14px;align-content: end">辆</span>
                 </div>
               </div>
-
             </div>
-          </div>
 
-          <div style="width: 50%;margin-bottom: 10px">
-            <div class="c1_title_half">
-              <div style="position: absolute;left: 20px;top: -5px;">公务车占编率</div>
-            </div>
-            <div style="display: flex;align-items: center">
-              <div style="position: relative">
-                <img src="../../../assets/zhang/publicCar/arcBlueEx.png" width="90" style="margin: 20px 5px 0 33px">
-                <div style="position: absolute;color: #00FFFF;width: 158px;top: 5px;font-size: 34px;font-family: 'electronicFont';text-align: center">{{ Number.isNaN(resourceData.percentagePosess) ? 0 : resourceData.percentagePosess }}<span style="font-size: 12px">%</span></div>
+            <div style="width: 50%;margin-bottom: 10px">
+              <div class="c1_title_half">
+                <div style="position: absolute;left: 20px;top: -5px;">公务车缺编率</div>
               </div>
-            </div>
-          </div>
+              <div style="display: flex;align-items: center">
+                <div style="position: relative">
+                  <img src="../../../assets/zhang/publicCar/arcBlueEx.png" width="90" style="margin: 20px 5px 0 33px">
+                  <div style="position: absolute;color: #00FFFF;width: 158px;top: 5px;font-size: 34px;font-family: 'electronicFont';text-align: center">
+                    {{ Number.isNaN(resourceData.percentageLack) ? 0 : resourceData.percentageLack }}<span style="font-size: 12px">%</span>
+                  </div>
+                </div>
 
-          <div style="width: 50%;margin-bottom: 10px">
-            <div class="c1_title_half">
-              <div style="position: absolute;left: 20px;top: -5px;">2025年度公务车车辆数</div>
+              </div>
             </div>
-            <div style="display: flex;align-items: center;margin-bottom: 20px">
-              <div style="position: relative;cursor: pointer" @click="chooseX">
-                <img src="../../../assets/zhang/publicCar/arcBlue.png" width="97" style="margin: 10px 5px 0 33px">
-                <div style="position: absolute;width: 48px;color: #00FFFF;top: 5px;left: 55px;font-size: 12px;text-align: center">年度增加车辆数</div>
+
+            <div style="width: 50%;margin-bottom: 10px">
+              <div class="c1_title_half">
+                <div style="position: absolute;left: 20px;top: -5px;">公务车占编率</div>
               </div>
-              <div style="width: 108px;height: 24px;color: #00FFFF;font-size: 34px;margin-bottom: 20px">
-                <span style="font-family: 'electronicFont'">{{ resourceData.yearAddNum }}</span>
-                <span style="width: 15px;height: 24px;font-size: 10px;align-content: end">万辆</span>
+              <div style="display: flex;align-items: center">
+                <div style="position: relative">
+                  <img src="../../../assets/zhang/publicCar/arcBlueEx.png" width="90" style="margin: 20px 5px 0 33px">
+                  <div style="position: absolute;color: #00FFFF;width: 158px;top: 5px;font-size: 34px;font-family: 'electronicFont';text-align: center">{{ Number.isNaN(resourceData.percentagePosess) ? 0 : resourceData.percentagePosess }}<span style="font-size: 12px">%</span></div>
+                </div>
               </div>
             </div>
-            <div style="display: flex;align-items: center">
-              <div style="position: relative;cursor: pointer" @click="chooseY">
-                <img src="../../../assets/zhang/publicCar/arcOrange.png" width="97" style="margin: 10px 5px 0 33px">
-                <div style="position: absolute;width: 48px;color: #FEC72F;top: 5px;left: 55px;font-size: 12px;text-align: center">年度减少车辆数</div>
+
+            <div style="width: 50%;margin-bottom: 10px">
+              <div class="c1_title_half">
+                <div style="position: absolute;left: 20px;top: -5px;">2025年度公务车车辆数</div>
               </div>
-              <div style="width: 108px;height: 24px;color: #FEC72F;font-size: 34px;margin-bottom: 20px">
-                <span style="font-family: 'electronicFont'">{{ resourceData.yearReduceNum }}</span>
-                <span style="width: 15px;height: 24px;font-size: 10px;align-content: end">万辆</span>
+              <div style="display: flex;align-items: center;margin-bottom: 20px">
+                <div style="position: relative;cursor: pointer" @click="chooseX">
+                  <img src="../../../assets/zhang/publicCar/arcBlue.png" width="97" style="margin: 10px 5px 0 33px">
+                  <div style="position: absolute;width: 48px;color: #00FFFF;top: 5px;left: 55px;font-size: 12px;text-align: center">年度增加车辆数</div>
+                </div>
+                <div style="width: 108px;height: 24px;color: #00FFFF;font-size: 34px;margin-bottom: 20px">
+                  <span style="font-family: 'electronicFont'">{{ resourceData.yearAddNum }}</span>
+                  <span style="width: 15px;height: 24px;font-size: 10px;align-content: end">万辆</span>
+                </div>
+              </div>
+              <div style="display: flex;align-items: center">
+                <div style="position: relative;cursor: pointer" @click="chooseY">
+                  <img src="../../../assets/zhang/publicCar/arcOrange.png" width="97" style="margin: 10px 5px 0 33px">
+                  <div style="position: absolute;width: 48px;color: #FEC72F;top: 5px;left: 55px;font-size: 12px;text-align: center">年度减少车辆数</div>
+                </div>
+                <div style="width: 108px;height: 24px;color: #FEC72F;font-size: 34px;margin-bottom: 20px">
+                  <span style="font-family: 'electronicFont'">{{ resourceData.yearReduceNum }}</span>
+                  <span style="width: 15px;height: 24px;font-size: 10px;align-content: end">万辆</span>
+                </div>
               </div>
             </div>
-          </div>
 
+          </div>
         </div>
       </div>
     </div>
+    <div style="flex: 1" @click="leaveFun"></div>
   </div>
+
 </template>
 
 <script>