coys

src/api/cockpit.js

@@ -0,0 +1,21 @@
+// 驾驶舱相关接口
+import request from '@/utils/request'
+
+// 获取驾驶舱总览
+export function getOverview() {
+  return request({
+    url: '/core/cockpit/app/overview',
+
+    method: 'get',
+    
+  })
+}
+// 获取任务列表
+export function gettrainingList(query) {
+  return request({
+    url: '/core/eduTask/list',
+
+    method: 'get',
+    params: query
+  })
+}

src/views/menu/cockpit/components/overviewCom.vue

@@ -1,12 +1,12 @@
 <template>
   <div class="titleCom">
     <div>
-      <van-cell v-for="i in 6" :key="i">
+      <van-cell v-for="i in list" :key="i.name">
         <!-- 使用 title 插槽来自定义标题 -->
         <template #title>
-          <span class="custom-title">行社</span>
+          <span class="custom-title">{{ i.name }}</span>
         </template>
-        <span class="itemNum" v-for="(item, index) in 6" :key="index">{{ index }}</span>
+        <span class="itemNum" v-for="(item, index) in allData[i.key]" :key="index">{{ item }}</span>
       </van-cell>
     </div>
     <!-- 设备 -->
@@ -15,13 +15,13 @@
         <template #title>
           <span class="custom-title">大堂式设备数量</span>
         </template>
-        <span class="itemNum" v-for="(item, index) in 6" :key="index">{{ index }}</span>
+        <span class="itemNum" v-for="(item, index) in allData['onlineATMCount']" :key="index">{{ item }}</span>
       </van-cell>
       <van-cell>
         <template #title>
           <span class="custom-title">穿墙式设备数量</span>
         </template>
-        <span class="itemNum" v-for="(item, index) in 6" :key="index">{{ index }}</span>
+        <span class="itemNum" v-for="(item, index) in allData['throughwallDeviceCount']" :key="index">{{ item }}</span>
       </van-cell>
     </div>
     <!-- 模块数据展示 -->
@@ -30,17 +30,17 @@
         <div>GA38-2021</div>
         <div class="moduleItem">
           <div>
-            <div class="numCls wj-title-blue">55%</div>
+            <div class="numCls wj-title-blue">{{ parseInt(allData.ga38['GA382021'].currentCompletedRate * 100) }}%</div>
             <div class="fontCls">当月完成率</div>
           </div>
           <div>
-            <div class="numCls wj-title-blue">150</div>
+            <div class="numCls wj-title-blue">{{ allData.ga38['GA382021'].currentCompletedCount }}</div>
             <div class="fontCls">当月完成数</div>
           </div>
           <div>
             <div class="numCls wj-title-blue">
               <van-icon name="down" class="wj-title-red rate" />
-              <span>10</span>
+              <span>{{ allData.ga38['GA382021'].compare }}</span>
             </div>
             <div class="fontCls">较上月</div>
           </div>
@@ -48,20 +48,20 @@
       </div>
 
       <div class="moduleCom">
-        <div>GA38-2021</div>
+        <div>GA38-2015</div>
         <div class="moduleItem">
           <div>
-            <div class="numCls wj-title-blue">55%</div>
+            <div class="numCls wj-title-blue">{{ parseInt(allData.ga38['GA382015'].currentCompletedRate * 100) }}%</div>
             <div class="fontCls">当月完成率</div>
           </div>
           <div>
-            <div class="numCls wj-title-blue">150</div>
+            <div class="numCls wj-title-blue">{{ allData.ga38['GA382021'].currentCompletedCount }}</div>
             <div class="fontCls">当月完成数</div>
           </div>
           <div>
             <div class="numCls wj-title-blue">
               <van-icon name="down" class="wj-title-green" />
-              <span>10</span>
+              <span>{{ allData.ga38['GA382021'].compare }}</span>
             </div>
             <div class="fontCls">较上月</div>
           </div>
@@ -69,27 +69,31 @@
       </div>
     </div>
     <div class="businessModule">
-      <div class="moduleCom">
-        <div>日常履职</div>
+      <div class="moduleCom" v-for="(item, index) in Object.keys(allData.taskInfo)" :key="index">
+        <div>{{ Object.keys(allData.taskInfo)[index] }}</div>
         <div class="moduleItem">
           <div>
-            <div class="numCls wj-title-blue">55%</div>
+            <div class="numCls wj-title-blue">
+              {{ parseInt(allData.taskInfo[Object.keys(allData.taskInfo)[index]].currentCompletedRate * 100) }}%
+            </div>
             <div class="fontCls">当月完成率</div>
           </div>
           <div>
-            <div class="numCls wj-title-blue">150</div>
+            <div class="numCls wj-title-blue">
+              {{ allData.taskInfo[Object.keys(allData.taskInfo)[index]].currentCompletedCount }}
+            </div>
             <div class="fontCls">当月完成数</div>
           </div>
           <div>
             <div class="numCls wj-title-blue">
               <van-icon name="down" class="wj-title-green" />
-              <span>10</span>
+              <span>{{ allData.taskInfo[Object.keys(allData.taskInfo)[index]].compare }}</span>
             </div>
             <div class="fontCls">较上月</div>
           </div>
         </div>
       </div>
-      <div class="moduleCom">
+      <!-- <div class="moduleCom">
         <div>网点自查</div>
         <div class="moduleItem">
           <div>
@@ -109,8 +113,6 @@
           </div>
         </div>
       </div>
-    </div>
-    <div class="businessModule">
       <div class="moduleCom">
         <div>教育培训</div>
         <div class="moduleItem">
@@ -151,8 +153,6 @@
           </div>
         </div>
       </div>
-    </div>
-    <div class="businessModule">
       <div class="moduleCom">
         <div>监控调阅</div>
         <div class="moduleItem">
@@ -191,21 +191,100 @@
             <div class="fontCls">已整改</div>
           </div>
         </div>
-      </div>
+      </div> -->
     </div>
   </div>
 </template>
 <script>
+import { getOverview } from '@/api/cockpit.js'
+// /core/cockpit/app/overview
 export default {
   name: 'SocAppOverviewCom',
-
+  components: {},
   data() {
-    return {}
+    return {
+      list: [
+        {
+          name: '行社',
+          key: 'bankingCount'
+        },
+        {
+          name: '营业网点',
+          key: 'bankingStoreCount'
+        },
+        {
+          name: '中心业务库',
+          key: 'centerStoreCount'
+        },
+        {
+          name: '网点业务库',
+          key: 'hangsheCount'
+        },
+        {
+          name: '在行式自助银行',
+          key: 'lobbyDeviceCount'
+        },
+        {
+          name: '离行式自助银行',
+          key: 'offlineATMCount'
+        }
+        // {
+        //   name: '大堂式设备数量',
+        //   key: 'onlineATMCount'
+        // },
+        // {
+        //   name: '穿墙式设备数量',
+        //   key: 'throughwallDeviceCount'
+        // }
+      ],
+      allData: {
+        bankingCount: '',
+        bankingStoreCount: '',
+        centerStoreCount: '',
+        hangsheCount: '',
+        lobbyDeviceCount: '',
+        offlineATMCount: '',
+        onlineATMCount: '',
+        throughwallDeviceCount: '',
+        ga38: {
+          GA382015: null,
+          GA382021: null
+        }
+      } //总览数据对象
+    }
+  },
+  created() {
+    this.getAllList()
   },
-
   mounted() {},
 
-  methods: {}
+  methods: {
+    // 获取总览数据
+    getAllList() {
+      getOverview().then(res => {
+        let { data } = res
+        this.allData = data
+        this.allData.bankingCount = this.remedyZero(this.allData.bankingCount)
+        this.allData.bankingStoreCount = this.remedyZero(this.allData.bankingStoreCount)
+        this.allData.centerStoreCount = this.remedyZero(this.allData.centerStoreCount)
+        this.allData.hangsheCount = this.remedyZero(this.allData.hangsheCount)
+        this.allData.lobbyDeviceCount = this.remedyZero(this.allData.lobbyDeviceCount)
+        this.allData.offlineATMCount = this.remedyZero(this.allData.offlineATMCount)
+        this.allData.onlineATMCount = this.remedyZero(this.allData.onlineATMCount)
+        this.allData.throughwallDeviceCount = this.remedyZero(this.allData.throughwallDeviceCount)
+      })
+    },
+    //自动补0
+    remedyZero(val) {
+      let newVal = val + ''
+      let num = 6 - newVal.length
+
+      for (let index = 0; index < num; index++) {
+        newVal = '0' + newVal
+      }
+      return ('' + newVal).split('')
+    }
+  }
 }
 </script>
 <style lang="scss" scoped>
@@ -256,14 +335,13 @@ export default {
     }
   }
 }
-.moduleCom:not(.bigModule :has(+ .moduleCom),.businessModule :has(+ .moduleCom)) {
+.moduleCom:not(.bigModule :has(+ .moduleCom), .businessModule :has(+ .moduleCom)) {
   border-left: 1px solid #008cd6;
 }
 
 .businessModule {
   display: flex;
   flex-wrap: wrap;
- 
 }
 .businessModule {
   .moduleCom {