首页

src/views/index.vue

@@ -6,22 +6,64 @@
     </div>
     <!-- 分割线 -->
     <div class="mt10 grid-container grid-container3" style="height: 15%">
-      <el-card v-for="item in card" class="grid-item" body-style="padding:0px;height:100%">
+      <el-card class="grid-item" body-style="padding:0px;height:100%">
+        <el-row>
+          <div class="height-full fl center ml20" style="width: 30%">
+            <el-image style="border-radius: 4%;width: 80%;height: 80%"
+                      :src="productSvg">
+              <div slot="placeholder" class="image-slot">
+                加载中<span class="dot">...</span>
+              </div>
+            </el-image>
+          </div>
+          <div class="height-full fr center mr20">
+              <span class="header d-block">
+                已对照产品
+              </span>
+            <span class="d-block mt10" :style="{'font-size': '32px','font-weight': 'bolder',color:'#394047'}">
+                {{ productCount }}
+              </span>
+          </div>
+        </el-row>
+      </el-card>
+
+      <el-card class="grid-item" body-style="padding:0px;height:100%">
+        <el-row>
+          <div class="height-full fl center ml20" style="width: 30%">
+            <el-image style="border-radius: 4%;width: 80%;height: 80%"
+                      :src="invSvg">
+              <div slot="placeholder" class="image-slot">
+                加载中<span class="dot">...</span>
+              </div>
+            </el-image>
+          </div>
+          <div class="height-full fr center mr20">
+              <span class="header d-block">
+                库存预警
+              </span>
+            <span class="d-block mt10" :style="{'font-size': '32px','font-weight': 'bolder',color:'#ef5c3b'}">
+                {{ invMsgCount }}
+              </span>
+          </div>
+        </el-row>
+      </el-card>
+
+      <el-card class="grid-item" body-style="padding:0px;height:100%">
         <el-row>
           <div class="height-full fl center ml20" style="width: 30%">
-          <el-image style="border-radius: 4%;width: 80%;height: 80%"
+            <el-image style="border-radius: 4%;width: 80%;height: 80%"
-                    :src="item.svg">
+                      :src="certSvg">
-            <div slot="placeholder" class="image-slot">
+              <div slot="placeholder" class="image-slot">
-              加载中<span class="dot">...</span>
+                加载中<span class="dot">...</span>
-            </div>
+              </div>
-          </el-image>
+            </el-image>
           </div>
           <div class="height-full fr center mr20">
               <span class="header d-block">
-                {{ item.title }}
+                资质预警
               </span>
-            <span class="d-block mt10" :style="{'font-size': '32px','font-weight': 'bolder',color:item.color}">
+            <span class="d-block mt10" :style="{'font-size': '32px','font-weight': 'bolder',color:'#ef5c3b'}">
-                {{ item.text }}
+                {{ invMsgCount }}
               </span>
           </div>
         </el-row>
@@ -156,22 +198,23 @@
 <script>
 import {getOrderList} from "../api/inout/order";
 import {sysMsgTodoPage} from "../api/system/sysMsgTodoApi";
-
+import productSvg from "@/assets/svg/已对照产品.svg"
-import 已对照产品 from "@/assets/svg/已对照产品.svg"
+import invSvg from "@/assets/svg/库存预警.svg"
-import 库存预警 from "@/assets/svg/库存预警.svg"
+import certSvg from "@/assets/svg/资质预警.svg"
-import 资质预警 from "@/assets/svg/资质预警.svg"
+import {getInvRemindMsgList} from "../api/system/invRemindMsg";
+import {getUdiInfos} from "../api/basic/udiRelevance";
+import {getSupCertRemindMsgList} from "../api/purchase/supCertRedmindMsg";
 
 export default {
   name: "Index",
   data() {
     return {
-      // 版本号
+      productSvg: productSvg,
-      version: "4.3.0",
+      invSvg: invSvg,
-      card: [
+      certSvg: certSvg,
-        {color: '#394047', title: '已对照产品', text: '999999', svg: 已对照产品},
+      productCount: 0,
-        {color: '#ef5c3b', title: '库存预警', text: '999999', svg: 库存预警},
+      invMsgCount: 0,
-        {color: '#ef5c3b', title: '资质预警', text: '999999', svg: 资质预警},
+      certMsgCount: 0,
-      ],
       // 待办==================================================
       msgLoading: false,
       msgList: [],
@@ -193,10 +236,46 @@ export default {
     };
   },
   created() {
+    this.getProductCount()
+    this.getInvMsgCount()
+    this.getCertMsgCount()
     this.getSysMsgTodoList()
     this.getOrderList()
   },
   methods: {
+    getProductCount(){
+      let param = {
+        page: 1,
+        limit: 1,
+        addType: 1,
+        filterType: 1
+      }
+      getUdiInfos(param).then(res=>{
+        this.productCount = res.data?.total || 0
+      })
+    },
+    getInvMsgCount() {
+      let param = {
+        page: 1,
+        limit: 1,
+        status: 1,
+        ignoreStatus: 0
+      }
+      getInvRemindMsgList(param).then(res => {
+        this.invMsgCount = res.data?.total || 0
+      })
+    },
+    getCertMsgCount(){
+      let param = {
+        page: 1,
+        limit: 1,
+        status: 1,
+        ignoreStatus: 0
+      }
+      getSupCertRemindMsgList(param).then(res => {
+        this.certMsgCount = res.data?.total || 0
+      })
+    },
     linkPage(path) {
       this.$router.push({path})
     },