[update] 部分问题调整

src/assets/less/common.less

@@ -4,6 +4,11 @@
   font-family: 'Alimama ShuHeiTi';
   src: url('~@assets/font/AlimamaShuHeiTi-Bold.ttf');
 }
+// 阿里妈妈数黑体
+@font-face {
+  font-family: 'Audiowide';
+  src: url('~@assets/font/Audiowide-Regular.ttf');
+}
 /*列表上方操作按钮区域*/
 .ant-card-body .table-operator {
   //margin-bottom: 8px;
@@ -219,6 +224,9 @@ input.ant-input,
 textarea.ant-input {
   background-color: transparent;
 }
+.mobile-html textarea.ant-input {
+  resize:none;
+}
 .input-search-suffix {
   font-size: 0;
   cursor: pointer;
@@ -474,19 +482,6 @@ button.ant-btn {
     margin-right: 0.04rem;
   }
 }
-// 特殊大数字
-.big-number {
-  font-family: Audiowide, Audiowide, sans-serif;
-  font-weight: 400;
-  font-size: 24px;
-  line-height: 32px;
-  margin-right: 8px;
-  color: @primary-color;
-}
-.mobile-html .big-number {
-  font-size: 0.22rem;
-  line-height: 0.32rem;
-}
 
 // 标题加渐变背景(按需给伪元素设置max-width，否则会超出宽度)
 .title-background {

src/components/CommonCard.vue

@@ -7,7 +7,9 @@
     <!--  暂无数据  -->
     <common-empty class="card-empty" v-if="isEmpty"/>
     <!--  内容  -->
-    <slot v-else></slot>
+    <a-spin :spinning="loading" v-else>
+      <slot></slot>
+    </a-spin>
   </a-card>
 </template>
 
@@ -27,6 +29,11 @@ export default {
       type: Boolean,
       default: false,
       required: false
+    },
+    loading: {
+      type: Boolean,
+      default: false,
+      required: false
     }
   }
 }
@@ -93,7 +100,6 @@ export default {
   font-size: 14px;
   color: @text-color;
   line-height: 16px;
-  text-shadow: 1px 1px 0 rgba(21,154,255,0.7), 1px 1px 0 #000000;
 }
 // 如果是移动端设置为rem单位
 .mobile-html {

src/store/modules/user.js

@@ -125,6 +125,7 @@ const user = {
           } else {
             menuData = menuData.filter(item => item.path !== '/mobile')
           }
+          response.result.menu = menuData
           const authData = response.result.auth
           const allAuthData = response.result.allAuth
           // Vue.ls.set(USER_AUTH,authData);

src/views/mobile/home/Home.vue

@@ -321,6 +321,8 @@ export default {
     }
   },
   mounted () {
+    // 默认搜索井口设备
+    this.$set(this.queryParam, 'deviceType', deviceType.wellheadEquipment.value)
     this.searchQuery()
   },
   beforeDestroy () {
@@ -358,7 +360,6 @@ export default {
     },
     // 加载实时数据(实时示功图)(每10s请求一次)
     loadOilWellRealTimeData () {
-      this.loading = true
       getOilWellRealTimeData({ id: this.defaultId }).then(res => {
         if (res.success) {
           this.hasData = !!res.result
@@ -371,7 +372,6 @@ export default {
           this.$message.warning(res.message)
         }
       }).finally(() => {
-        this.loading = false
       })
     },
     // 初始化 实时示功图
@@ -555,4 +555,7 @@ export default {
   padding: 0;
   width: 0.36rem;
 }
+.empty-box {
+  margin-top: 20vh;
+}
 </style>

src/views/mobile/manage/Manage.vue

@@ -1,7 +1,7 @@
 <template>
   <a-spin :spinning="loading">
     <div class="mb-12">
-      <common-card title="系统设备概况">
+      <common-card title="系统设备概况" :loading="deviceOverviewLoading">
         <div class="overview-grid">
           <div class="overview-card" v-for="item in deviceOverview" :key="item.id || item.title">
             <div class="title-background">
@@ -13,7 +13,8 @@
               </div>
               <div class="overview-card-content">
                 <div class="first-content" v-if="sysDeviceOverviewData[item.countField] || sysDeviceOverviewData[item.countField] === 0">
-                  <span class="big-number">{{sysDeviceOverviewData[item.countField]}}</span>台
+                  {{sysDeviceOverviewData[item.countField]}}
+                  <span class="first-content-unit">台</span>
                 </div>
                 <!-- 在线 -->
                 <div v-if="sysDeviceOverviewData[item.onLineField] || sysDeviceOverviewData[item.onLineField] === 0"
@@ -23,9 +24,11 @@
                      class="cease">离线：{{ sysDeviceOverviewData[item.offLineField] }}台</div>
                 <!-- 其他数据 -->
                 <template v-if="item.otherData">
-                  <div v-for="it in item.otherData" :key="it.id || it.label">
+                  <template v-for="it in item.otherData">
-                    {{it.label}}：{{sysDeviceOverviewData[it.valueField]}}{{it.unit}}
+                    <div v-if="sysDeviceOverviewData[it.valueField] || sysDeviceOverviewData[it.valueField] === 0" :key="it.id || it.label">
-                  </div>
+                      {{it.label}}：{{sysDeviceOverviewData[it.valueField]}}{{it.unit}}
+                    </div>
+                  </template>
                 </template>
               </div>
             </div>
@@ -34,7 +37,7 @@
       </common-card>
     </div>
     <div class="mb-12">
-      <common-card title="设备列表" :isEmpty="deviceDataSource.length === 0">
+      <common-card title="设备列表" :isEmpty="deviceDataSource.length === 0" :loading="deviceData.loading">
         <div class="device-list">
           <div class="device-list-item custom-content-card"
                v-for="(item, index) in deviceDataSource"
@@ -183,6 +186,8 @@ export default {
     return {
       deviceStatus,
       loading: false,
+      // 系统设备概况loading
+      deviceOverviewLoading: false,
       // 系统设备概况
       deviceOverview: [
         {
@@ -267,12 +272,15 @@ export default {
     },
     // 加载系统设备概况数据
     loadSysDeviceOverview () {
+      this.deviceOverviewLoading = true
       getSysDeviceOverview().then(res => {
         if (res.success) {
           this.sysDeviceOverviewData = res.result || {}
         } else {
           this.$message.warning(res.message)
         }
+      }).finally(() => {
+        this.deviceOverviewLoading = false
       })
     },
     // 加载设备列表
@@ -442,7 +450,7 @@ export default {
   .overview-card-main {
     display: flex;
     justify-content: space-between;
-    height: 0.78rem;
+    min-height: 0.78rem;
 
     .overview-card-img {
       flex: 0 0 0.56rem;
@@ -464,7 +472,23 @@ export default {
       line-height: 0.14rem;
 
       .first-content {
-        padding-left: 0.16rem;
+        position: relative;
+        padding-right: 0.2rem;
+        font-family: Audiowide, Audiowide, sans-serif;
+        font-weight: 400;
+        font-size: 0.22rem;
+        line-height: 0.22rem;
+        color: @primary-color;
+        text-align: center;
+
+        .first-content-unit {
+          font-size: 0.12rem;
+          color: @text-color;
+          position: absolute;
+          top: 50%;
+          right: 0.1rem;
+          transform: translateY(-50%);
+        }
       }
     }
   }

src/views/systemOverview/equipmentManagement/EquipmentManagement.vue

@@ -2,7 +2,7 @@
   <a-spin :spinning="loading">
     <a-row :gutter="20" type="flex" class="mb-20">
       <a-col flex="545px">
-        <common-card title="系统设备概况">
+        <common-card title="系统设备概况" :loading="deviceOverviewLoading">
           <div class="overview-grid">
             <div class="overview-card custom-content-card" v-for="item in deviceOverview" :key="item.id || item.title">
               <div class="title-background">
@@ -14,7 +14,8 @@
                 </div>
                 <div class="overview-card-content">
                   <div class="first-content" v-if="sysDeviceOverviewData[item.countField] || sysDeviceOverviewData[item.countField] === 0">
-                    <span class="big-number">{{sysDeviceOverviewData[item.countField]}}</span>台
+                    {{sysDeviceOverviewData[item.countField]}}
+                    <span class="first-content-unit">台</span>
                   </div>
                   <!-- 在线 -->
                   <div v-if="sysDeviceOverviewData[item.onLineField] || sysDeviceOverviewData[item.onLineField] === 0"
@@ -24,9 +25,11 @@
                        class="cease">离线：{{ sysDeviceOverviewData[item.offLineField] }}台</div>
                   <!-- 其他数据 -->
                   <template v-if="item.otherData">
-                    <div v-for="it in item.otherData" :key="it.id || it.label">
+                    <template v-for="it in item.otherData">
-                      {{it.label}}：{{sysDeviceOverviewData[it.valueField] || 0}}{{it.unit}}
+                      <div v-if="sysDeviceOverviewData[it.valueField] || sysDeviceOverviewData[it.valueField] === 0" :key="it.id || it.label">
-                    </div>
+                        {{it.label}}：{{sysDeviceOverviewData[it.valueField]}}{{it.unit}}
+                      </div>
+                    </template>
                   </template>
                 </div>
               </div>
@@ -200,6 +203,8 @@ export default {
         column: 'createTime',
         order: 'desc'
       },
+      // 系统设备概况loading
+      deviceOverviewLoading: false,
       // 系统设备概况
       deviceOverview: [
         {
@@ -503,12 +508,15 @@ export default {
     },
     // 加载系统设备概况数据
     loadSysDeviceOverview () {
+      this.deviceOverviewLoading = true
       getSysDeviceOverview().then(res => {
         if (res.success) {
           this.sysDeviceOverviewData = res.result || {}
         } else {
           this.$message.warning(res.message)
         }
+      }).finally(() => {
+        this.deviceOverviewLoading = false
       })
     },
     // 加载设备列表
@@ -598,7 +606,19 @@ export default {
       line-height: 15px;
 
       .first-content {
-        padding-left: 12px;
+        padding-right: 20px;
+        font-family: Audiowide, Audiowide, sans-serif;
+        font-weight: 400;
+        font-size: 24px;
+        line-height: 32px;
+        color: @primary-color;
+        text-align: center;
+
+        .first-content-unit {
+          vertical-align: middle;
+          font-size: 12px;
+          color: @text-color;
+        }
       }
     }
   }

src/views/systemOverview/wellheadDataMonitoring/WellheadDataMonitoring.vue

@@ -551,7 +551,11 @@ export default {
     }
   },
   mounted () {
-    this.searchQuery()
+    this.$set(this.queryParam, 'wellheadArea', '1')
+    this.loadOilWellList('1').then(() => {
+      this.$set(this.queryParam, 'singleWell', this.singleWellList[0].id)
+      this.searchQuery()
+    })
   },
   beforeDestroy () {
     // 离开页面前清除定时器
@@ -770,7 +774,7 @@ export default {
     },
     // 油井下拉
     loadOilWellList (wellheadArea) {
-      getWellheadList({
+      return getWellheadList({
         wellheadArea: wellheadArea,
         wellheadType: wellheadType.oil.value
       }).then(res => {

src/views/user/Login.vue

@@ -37,9 +37,8 @@
                   autocomplete="false"
                   placeholder="请输入密码"
                 >
-                  <a-icon title="显示密码" @click="passwordType='text'" slot="suffix" v-if="passwordType==='password'" type="eye" :style="{ color: '#B3B7C2',fontSize:'20px' }"/>
+                  <a-icon title="显示密码" @click="passwordType='text'" slot="suffix" v-if="passwordType==='password'" type="eye" class="password-suffix"/>
-                  <a-icon title="隐藏密码" @click="passwordType='password'" slot="suffix" v-else type="eye-invisible" :style="{ color: '#B3B7C2',fontSize:'20px' }"/>
+                  <a-icon title="隐藏密码" @click="passwordType='password'" slot="suffix" v-else type="eye-invisible" class="password-suffix"/>
-                  <!--                <a-icon slot="prefix" type="lock" :style="{ color: '#B3B7C2',fontSize:'20px' }"/>-->
                 </a-input>
               </a-form-item>
             </a-col>
@@ -92,9 +91,8 @@
               placeholder="请输入密码"
             >
               <img slot="prefix" class="prefix-icon" :src="require('@assets/images/icon/password.png')" alt="密码"/>
-              <a-icon title="显示密码" @click="passwordType='text'" slot="suffix" v-if="passwordType==='password'" type="eye" :style="{ color: '#B3B7C2',fontSize:'20px' }"/>
+              <a-icon title="显示密码" @click="passwordType='text'" slot="suffix" v-if="passwordType==='password'" type="eye" class="password-suffix"/>
-              <a-icon title="隐藏密码" @click="passwordType='password'" slot="suffix" v-else type="eye-invisible" :style="{ color: '#B3B7C2',fontSize:'20px' }"/>
+              <a-icon title="隐藏密码" @click="passwordType='password'" slot="suffix" v-else type="eye-invisible" class="password-suffix"/>
-              <!--                <a-icon slot="prefix" type="lock" :style="{ color: '#B3B7C2',fontSize:'20px' }"/>-->
             </a-input>
           </a-form-item>
         </a-col>
@@ -572,4 +570,11 @@ function isMobile () {
       }
     }
   }
+  .password-suffix {
+    color: @primary-color;
+    font-size: 20px;
+  }
+  .mobile-html .password-suffix {
+    font-size: 0.2rem;
+  }
 </style>