数据资产登记更新

@@ -9,6 +9,7 @@ import { ElMessage, ElMessageBox } from 'element-plus';
 import { useRouter, useRoute } from "vue-router";
 import { MoreFilled } from "@element-plus/icons-vue";
 import {
+  changeNum,
   tagMethod,
   tagType,
 } from "@/utils/common";
@@ -34,6 +35,13 @@ const route = useRoute();
 const { proxy } = getCurrentInstance() as any;
 const path = route.path;
 
+const loading = ref(false);
+const defaultItemLogo = new URL('@/assets/images/home-finance-product.png', import.meta.url).href
+const demandListData: any = ref([
+  { companyName: '北数所', listedNum: 16, processNum: 1235 },
+  { companyName: '深数所', listedNum: 16, processNum: 1235 },
+  { companyName: '苏数所', listedNum: 16, processNum: 1235 },
+]);
 const searchItemList = ref([
   {
     type: "input",
@@ -167,6 +175,9 @@ const getTableBtns = (row, includeDetail = true) => {
 
 const currTableData: any = ref({});
 
+const btnClick = (btn) => {
+}
+
 const tableBtnClick = (scope, btn) => {
   const type = btn.value;
   const row = scope.row;
@@ -486,7 +497,33 @@ const createBtnVisible = computed(() => {
 </script>
 
 <template>
-  <div class="container_wrap">
+  <div class="container_wrap" v-loading="loading">
+    <div class="list-content">
+      <div class="card-content" v-for="item in demandListData" :key="item.guid">
+        <div class="header">
+          <img class="left-img" :src="(item.picUrl && typeof item.picUrl == 'string') ? item.picUrl : defaultItemLogo"
+            alt="" />
+          <div class="right-main">
+            <div class="title">{{ item.companyName ?? '--' }}</div>
+            <div class="count-group">
+              <div class="count-item">
+                <div class="item-label">已上架产品数</div>
+                <div class="item-num">{{ changeNum(item.listedNum) }}</div>
+              </div>
+              <div class="count-item">
+                <div class="item-label">审批中产品数</div>
+                <div class="item-num">{{ changeNum(item.processNum) }}</div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="operator-btn">
+          <div class="left-btn borderRight" @click="btnClick(item)">更新模板</div>
+          <div class="left-btn" @click="btnClick(item)">资产登记</div>
+        </div>
+      </div>
+    </div>
+    <div class="content_main_wrap">
       <div class="table_tool_wrap">
         <TableTools :searchItems="searchItemList" :searchId="'register-data-search'" @search="toSearch" />
         <div class="tools_btns">
@@ -554,6 +591,7 @@ const createBtnVisible = computed(() => {
         <Table v-else :tableInfo="tableInfo" @tableBtnClick="tableBtnClick" />
         <PageNav :class="[pageInfo.type]" :pageInfo="pageInfo" @pageChange="pageChange" />
       </div>
+    </div>
     <Dialog :dialogInfo="passDialogInfo" @btnClick="passDialogBtnClick" />
     <Dialog :dialogInfo="rejectDialogInfo" @btnClick="rejectDialogBtnClick" />
   </div>
@@ -561,7 +599,13 @@ const createBtnVisible = computed(() => {
 
 <style scoped lang="scss">
 .container_wrap {
-  padding: 0 16px;
+  padding: 16px 16px 0;
+  display: flex;
+  flex-direction: column;
+}
+
+.content_main_wrap {
+  flex: 1;
 }
 
 .table_panel {
@@ -696,4 +740,83 @@ const createBtnVisible = computed(() => {
     }
   }
 }
+
+.list-content {
+  display: flex;
+  justify-content: space-between;
+  flex-wrap: wrap;
+  margin-bottom: 8px;
+
+  .card-content {
+    width: calc(33.33% - 10px);
+    padding: 16px;
+    box-shadow: 0 0 0 1px #d9d9d9;
+
+    .header {
+      display: flex;
+      margin-bottom: 16px;
+
+      img {
+        width: 80px;
+        margin-right: 16px;
+      }
+
+      .title {
+        font-size: 16px;
+        color: #212121;
+        font-weight: 600;
+        margin-bottom: 8px;
+      }
+
+      .right-main {
+        width: calc(100% - 96px);
+        display: flex;
+        flex-direction: column;
+        justify-content: space-between;
+
+        .count-group {
+          display: flex;
+          justify-content: space-between;
+
+          .item-num {
+            font-size: 20px;
+            font-weight: 600;
+            color: #212121;
+            margin-top: 8px;
+          }
+        }
+      }
+    }
+
+    .operator-btn {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      box-shadow: 0 0 0 1px #d9d9d9;
+      position: relative;
+
+      &::after {
+        content: '';
+        width: 0;
+        height: 100%;
+        border-left: 1px solid #d9d9d9;
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+      }
+
+      >.left-btn {
+        width: 50%;
+        height: 40px;
+        line-height: 40px;
+        text-align: center;
+        cursor: pointer;
+
+        &:hover {
+          color: #4fa1a4;
+        }
+      }
+    }
+  }
+}
 </style>