提交阶段性预览

src/views/workbench/index2.vue

@@ -68,8 +68,11 @@
               <div class="villagename">{{ villageinfo.villageName }}</div>
               <div class="week">{{ new Date().toLocaleDateString().replaceAll('/', '-') }} {{ numToWeek2(new Date().getDay()) }}</div>
             </div>
+            <i class="white1"></i>
+            <i class="white2"></i>
+            <i class="white3"></i>
           </div>
-          <div class="tabsbox">
+          <div class="tabsbox flex flex-col">
             <div class="topbox">
               <div
                 :class="{
@@ -90,16 +93,16 @@
                 <i class="righti"></i>
               </div>
             </div>
-            <div class="body">
+            <div class="body flex-1">
               <div class="quicly_box" v-if="Sideactive === 1">
                 <div class="quickly_item" v-for="(item, index) in quickBox" :key="index" @click="handleRouter(item.url)">
                   <div class="quickly_item_icon"></div>
                   <div class="quickly_item_content">{{ item.name }}</div>
                 </div>
-                <div class="quickly_item add">
+                <!-- <div class="quickly_item add">
                   <el-icon><Plus /></el-icon>
                   <span>添加</span>
-                </div>
+                </div> -->
               </div>
               <div v-else>
                 <div class="noticeNav">
@@ -128,6 +131,7 @@
                     <el-form-item label="附件">
                       <el-upload
                         v-model:file-list="fileList"
+                        :auto-upload="false"
                         class="upload-demo"
                         action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
                         multiple
@@ -216,14 +220,6 @@ const villageinfo = ref({
   'villageId': null,
   'villageName': ''
 });
-function getVillageinfo() {
-  const id = Number(localStorage.getItem('villageid'));
-  getVillageByIdAPI(id).then((res) => {
-    villageinfo.value = res.data;
-    houseStore.updateVilageinfo(res.data);
-  });
-}
-getVillageinfo();
 
 import icon1 from '@/assets/images/index/1.png';
 import icon2 from '@/assets/images/index/2.png';
@@ -234,6 +230,7 @@ import { UploadUserFile } from 'element-plus';
 import { getVillageByIdAPI } from '@/api/system/community';
 import { getLast7Days, numToWeek2 } from '@/utils/time';
 import { EChartsOption } from 'echarts';
+import { workSpaceTotalListApi } from '@/api/workflow';
 
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 const { com_resident_type } = toRefs<any>(proxy?.useDict('com_resident_type'));
@@ -247,6 +244,25 @@ const list = ref([
   { name: '物料总数量', value: 458, icon: icon6 },
   { name: '投诉总数量', value: 458, icon: icon6 }
 ]);
+
+function getVillageinfo() {
+  const id = Number(localStorage.getItem('villageid'));
+  workSpaceTotalListApi(id).then((res) => {
+    list.value[0].value = res.totalResident;
+    list.value[1].value = res.totalHouse;
+    list.value[2].value = res.totalParking;
+    list.value[5].value = res.totalComplaint;
+  });
+  getVillageByIdAPI(id).then((res) => {
+    villageinfo.value = {
+      ...villageinfo.value,
+      villageId: res.data.villageId,
+      villageName: res.data.villageName
+    };
+    houseStore.updateVilageinfo(res.data);
+  });
+}
+getVillageinfo();
 // ! echarts 切换
 const active_index = ref(0);
 const actions = ref([
@@ -380,7 +396,7 @@ const quickBox = ref([
   },
   {
     name: '账单管理',
-    url: '/repair/visitorList'
+    url: '/sdb/sdbbill'
   }
 ]);
 const router = useRouter();
@@ -605,6 +621,8 @@ getList();
     background: #036aff;
     border-radius: 16px 16px 16px 16px;
     margin-bottom: 20px;
+    position: relative;
+    overflow: hidden;
     .iconbox {
       width: 70px;
       height: 70px;
@@ -627,6 +645,34 @@ getList();
         line-height: 23px;
       }
     }
+
+    // 白色装饰
+    .white1,
+    .white2,
+    .white3 {
+      position: absolute;
+      background: #d9d9d9;
+      border-radius: 50%;
+      display: block;
+      width: 100px;
+      height: 100px;
+      left: 0;
+      bottom: 0;
+      transform: translate(-50%, 50%) scale(1.5);
+      opacity: 0.1;
+    }
+    .white2 {
+      width: 200px;
+      height: 200px;
+      opacity: 0.08;
+      transform: translate(-20%, 63%) scale(1.5);
+    }
+    .white3 {
+      width: 300px;
+      height: 300px;
+      opacity: 0.05;
+      transform: translate(-20%, 65%) scale(1.5);
+    }
   }
 
   // tabs