From ae1ca8085c08fbaf0c854affa522c6e4ffac4312 Mon Sep 17 00:00:00 2001
From: lion <120344285@qq.com>
Date: Mon, 4 Aug 2025 13:17:28 +0800
Subject: [PATCH] =?UTF-8?q?=E9=A6=96=E9=A1=B5=E6=95=B0=E6=8D=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/dashboard/components/PanelGroup.vue | 186 +++++++++++-------
 src/views/dashboard/index.vue                 | 166 ++++++++++++++--
 2 files changed, 265 insertions(+), 87 deletions(-)

diff --git a/src/views/dashboard/components/PanelGroup.vue b/src/views/dashboard/components/PanelGroup.vue
index 4fe4e3f..7d39cbb 100644
--- a/src/views/dashboard/components/PanelGroup.vue
+++ b/src/views/dashboard/components/PanelGroup.vue
@@ -10,8 +10,8 @@
         <div class="boxcontentsubtitle">总数</div>
         <div class="boxcontent">
           <div class="boxcontentitem">
-            <div class="boxcontentitem-big">
-              <count-to separator="" :start-val="0" :end-val="totaldata.recordsTotal"
+            <div class="boxcontentitem-big">
+              <count-to separator="" :start-val="0" :end-val="totaldata.recordsTotal"
                 :duration="3000" />
             </div>
           </div>
@@ -28,8 +28,8 @@
         <div class="boxcontentsubtitle">总数</div>
         <div class="boxcontent">
           <div class="boxcontentitem">
-            <div class="boxcontentitem-big">
-              <count-to separator="" :start-val="0" :end-val="totaldata.organizesTotal"
+            <div class="boxcontentitem-big">
+              <count-to separator="" :start-val="0" :end-val="totaldata.organizesTotal"
                 :duration="3000" />
             </div>
           </div>
@@ -45,46 +45,85 @@
         <div class="boxcontentsubtitle">总数</div>
         <div class="boxcontent">
           <div class="boxcontentitem">
-            <div class="boxcontentitem-big">
-              <count-to separator="" :start-val="0" :end-val="totaldata.areasTotal"
+            <div class="boxcontentitem-big">
+              <count-to separator="" :start-val="0" :end-val="totaldata.areasTotal"
                 :duration="3000" />
             </div>
           </div>
         </div>
-      </div> -->
-      <div class="box box5" @click="toUrl(2)">
-        <div class="boxtitle">
-          <span>预警提醒</span>
-          <i class="el-icon-warning-outline statIcon"></i>
-        </div>
-        <div class="bline"></div>
-        <div class="boxcontentsubtitle">总数</div>
-        <div class="boxcontent">
-          <div class="boxcontentitem">
-            <div class="boxcontentitem-big">
-              <count-to separator="" :start-val="0" :end-val="totaldata.dateTotal"
-                :duration="3000" />
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="box box4" @click="toUrl(1)">
-        <div class="boxtitle">
-          <span>到期提醒</span>
-          <i class="el-icon-warning statIcon"></i>
-        </div>
-        <div class="bline"></div>
-        <div class="boxcontentsubtitle">总数</div>
-        <div class="boxcontent">
-          <div class="boxcontentitem">
-            <div class="boxcontentitem-big">
-              <count-to separator="" :start-val="0" :end-val="totaldata.status1Total"
-                :duration="3000" />
-            </div>
-          </div>
-        </div>
-      </div>
-
+      </div> -->
+      <div class="box box5" @click="toUrl(2)">
+        <div class="boxtitle">
+          <span>预警提醒</span>
+          <i class="el-icon-warning-outline statIcon"></i>
+        </div>
+        <div class="bline"></div>
+        <div class="boxcontentsubtitle">总数</div>
+        <div class="boxcontent">
+          <div class="boxcontentitem">
+            <div class="boxcontentitem-big">
+              <count-to separator="" :start-val="0" :end-val="totaldata.dateTotal" :duration="3000" />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="box box4" @click="toUrl(1)">
+        <div class="boxtitle">
+          <span>到期提醒</span>
+          <i class="el-icon-warning statIcon"></i>
+        </div>
+        <div class="bline"></div>
+        <div class="boxcontentsubtitle">总数</div>
+        <div class="boxcontent">
+          <div class="boxcontentitem">
+            <div class="boxcontentitem-big">
+              <count-to separator="" :start-val="0" :end-val="totaldata.status1Total" :duration="3000" />
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <div class="box box3">
+        <div class="boxtitle">
+          <span>员工人数</span>
+          <i class="el-icon-s-check statIcon"></i>
+        </div>
+        <div class="bline"></div>
+        <div style="display: flex;justify-content: space-between;align-items: center;padding:0 20px">
+          <div>
+            <div class="boxcontentsubtitle">总人数</div>
+            <div class="boxcontent">
+              <div class="boxcontentitem">
+                <div class="boxcontentitem-big">
+                  <count-to separator="" :start-val="0" :end-val="totaldata.person.total" :duration="3000" />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div>
+            <div class="boxcontentsubtitle">管理人员人数</div>
+            <div class="boxcontent">
+              <div class="boxcontentitem">
+                <div class="boxcontentitem-big">
+                  <count-to separator="" :start-val="0" :end-val="totaldata.person.manage" :duration="3000" />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div>
+            <div class="boxcontentsubtitle">服务人员人数</div>
+            <div class="boxcontent">
+              <div class="boxcontentitem">
+                <div class="boxcontentitem-big">
+                  <count-to separator="" :start-val="0" :end-val="totaldata.person.serve" :duration="3000" />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+
 
     </div>
   </div>
@@ -101,11 +140,16 @@
       totaldata: {
         type: Object,
         default: {
-          // recordsTotal:0,
-          // organizesTotal:0,
-          // areasTotal:0,
-          status1Total:0,
-          dateTotal:0
+          // recordsTotal:0,
+          // organizesTotal:0,
+          // areasTotal:0,
+          status1Total: 0,
+          dateTotal: 0,
+          person: {
+            total: 0,
+            manage: 0,
+            serve: 0
+          }
         }
       }
     },
@@ -115,15 +159,15 @@
     methods: {
       handleRoute(type) {
         this.$emit('handleRoute', type)
-      },
-      toUrl(type){
-        if(type==1 && this.totaldata.status1Total>0){
-          this.$router.push('/record/index?status1Total=1')
-        }
-        if(type==2 && this.totaldata.dateTotal>0){
-          this.$router.push('/record/index?dateTotal=1')
-        }
-
+      },
+      toUrl(type) {
+        if (type == 1 && this.totaldata.status1Total > 0) {
+          this.$router.push('/record/index?status1Total=1')
+        }
+        if (type == 2 && this.totaldata.dateTotal > 0) {
+          this.$router.push('/record/index?dateTotal=1')
+        }
+
       },
       toCaculateper(f1, f2) {
         return ((f1 / (f2 == 0 ? 1 : f2)) * 100).toFixed(2) + "%"
@@ -134,7 +178,7 @@
 
 <style lang="scss" scoped>
   .boxlist {
-    display: flex;
+    display: flex;
     justify-content: center;
   }
 
@@ -166,8 +210,8 @@
 
   .box {
     position: relative;
-    width: 30%;
-    margin:0 5%;
+    width: 30%;
+    margin: 0 2%;
     // margin-left: 0.5%;
     // margin-right: 0.5%;
     margin-bottom: 10px;
@@ -175,7 +219,7 @@
     border-radius: 8px;
     box-sizing: border-box;
     opacity: 0.8;
-    padding: 1.25rem 0;
+    padding: 1.25rem 0;
     cursor: pointer;
 
     .boxcontentsubtitle {
@@ -301,19 +345,19 @@
       margin-bottom: 1.25rem;
     }
   }
-
-  .box4 {
-
-    background: linear-gradient(-55deg,  #b3241d,#b3241d);
-
-    .boxcline {
-      width: 100%;
-      background: #b3241d;
-      height: 0.125rem;
-      margin-top: 1.25rem;
-      margin-bottom: 1.25rem;
-    }
-  }
+
+  .box4 {
+
+    background: linear-gradient(-55deg, #b3241d, #b3241d);
+
+    .boxcline {
+      width: 100%;
+      background: #b3241d;
+      height: 0.125rem;
+      margin-top: 1.25rem;
+      margin-bottom: 1.25rem;
+    }
+  }
 
   .panel-group {
     // margin-top: 18px;
diff --git a/src/views/dashboard/index.vue b/src/views/dashboard/index.vue
index d886235..d0c93c8 100644
--- a/src/views/dashboard/index.vue
+++ b/src/views/dashboard/index.vue
@@ -41,10 +41,11 @@
         <myecharts :width="'100%'" :height="'400px'" :data="overall_month_data"></myecharts>
       </el-col>
       <el-col :span="24" class="chartSize">
-        <div class="search">
-          <div class="title">年度业务统计</div>
+        <div class="search">
+          <!-- 年度业务统计 -->
+          <div class="title">各区域应收款到账情况</div>
           <div class="search-wrap">
-            <div>
+            <!-- <div>
               <el-date-picker @change="getYearChart" v-model="yearSelect.year" value-format="yyyy" type="year"
                 placeholder="选择年">
               </el-date-picker>
@@ -54,11 +55,16 @@
                 <el-option v-for="item in all_areas" :key="item.id" :label="item.name" :value="item.id">
                 </el-option>
               </el-select>
-            </div>
+            </div> -->
 
           </div>
+        </div>
+        <div v-if="showList">
+          <xy-table :list="caiwuList" :is-page="false" :height="550"
+            :table-item="caiwuTable">
+          </xy-table>
         </div>
-        <div class="yearData">
+        <div class="yearData" v-if="false">
           <myecharts v-if="false" style="margin-top:20px" :width="'100%'" :height="'350px'" :data="budget_data"></myecharts>
 
           <div class="yearData-item" v-for="item in yearsArr">
@@ -117,7 +123,8 @@
     fillChart
   } from "@/api/home"
   import {
-    index
+    index,
+    show
   } from "@/api/system/baseForm.js"
   import state from '@/store/modules/user.js'
   export default {
@@ -132,7 +139,12 @@
           // organizesTotal: 0,
           // areasTotal: 0,
           status1Total: 0,
-          dateTotal: 0
+          dateTotal: 0,
+          person:{
+            total:0,
+            manage:0,
+            serve:0
+          }
         },
         stateObj: {},
         nowDate: '',
@@ -158,6 +170,18 @@
         all_areas: [],
         overall_year_data: {},
         monthArr: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
+        // 财务数据
+        caiwuTable:[{
+          prop:'name',
+          label:'区域',
+          width:180,
+          align:'center',
+          fixed:'left'
+        }],
+        showList:false,
+        caiwuList:[],
+        id_business_types_business_id_relation:[], //财务填报的业务类型
+        id_business_datas_business_id_relation:[], //财务填报的业务数据
 
       }
     },
@@ -169,9 +193,11 @@
       this.yearSelect.year = this.$moment(new Date).format("YYYY")
       this.stateObj = state.state
       this.init()
-      this.getRecords()
+      this.getRecords()
+      this.getPerson()
       this.getMonthList()
-      this.getYearList()
+      this.getYearList()
+      this.getCaiwuTable()
     },
     mounted() {
 
@@ -201,7 +227,114 @@
           }]
         })
         this.list.dateTotal = res.total
-      },
+      },
+      // 获取当月员工人数 固定的数据获取
+      // http://sstt-dangan.ali251.langye.net/api/fill-datas-chart?business_id=20&year=2025&business_type_id=88&area_id=13
+      async getPerson(){
+        const res = await fillChart({
+          business_id: 20,
+          year: this.monthSelect.year,
+          business_type_id: 88,
+          area_id: 13
+        })
+        const currentMonth = String(new Date().getMonth() + 1).padStart(2, '0');
+        const currentMonthData = res.list[currentMonth] || [];
+        currentMonthData.forEach(item => {
+          switch (item.name) {
+            case "总人数":
+              this.list.person.total = item.total; // 赋值总人数
+              break;
+            case "管理人员人数":
+              this.list.person.manage = item.total; // 赋值管理人员人数
+              break;
+            case "服务人员人数":
+              this.list.person.serve = item.total; // 赋值服务人员人数
+              break;
+          }
+        });
+      },
+      // 获取财务部 填报的数据内容
+      // http://sstt-dangan.ali251.langye.net/api/admin/base-form/show?id=15&table_name=businesses&json_data_fields[]=area_ids
+      async getCaiwuTable(){
+        const res = await show({
+          id: 15,
+          table_name: 'businesses',
+        })
+        res.id_business_types_business_id_relation.map(item=>{
+          this.caiwuList.push({
+            business_type_id:item.id,
+            name:item.name
+          })
+        })
+        res.id_business_datas_business_id_relation.map(item=>{
+          this.caiwuTable.push({
+            prop:item.name,
+            business_data_id:item.id,
+            label:item.name
+          })
+          this.caiwuList.map(item1=>{
+            item1.business_data_id = item.id
+            item1[item.name] = 0
+          })
+        })
+        this.getCaiwuList()
+      },
+      async getCaiwuList(){
+        const res = await index({
+          page_size: 9999,
+          page: 1,
+          table_name: 'fills',
+          filter: [{
+            "key": "business_id",
+            "op": "eq",
+            "value": 15
+          },{
+            "key": "year",
+            "op": "eq",
+            "value": this.monthSelect.year
+          }],
+        })
+
+        // return
+        // 1. 先将 id_fill_datas_fill_id_relation 转换为映射表，提高查询效率
+        if(res.data.length>0){
+          const data = res.data[0]
+          console.log("data",data)
+          // 1. 先按 business_type_id 对 id_fill_datas_fill_id_relation 分组，提高匹配效率
+          const relationGroup = {};
+          data.id_fill_datas_fill_id_relation.forEach(relationItem => {
+            const typeId = relationItem.business_type_id;
+            // 按 business_type_id 分组，每组存储该类型下的所有 relation 项
+            if (!relationGroup[typeId]) {
+              relationGroup[typeId] = [];
+            }
+            relationGroup[typeId].push(relationItem);
+          });
+          console.log("relationGroup",relationGroup)
+          // 2. 遍历 caiwuList，匹配并赋值
+          this.caiwuList.forEach(caiwuItem => {
+            const targetTypeId = caiwuItem.business_type_id;
+            // 找到同 business_type_id 的所有 relation 项
+            const matchedRelations = relationGroup[targetTypeId] || [];
+            // 遍历同类型的 relation 项，匹配 business_data.name 与 caiwuItem 的属性
+            matchedRelations.forEach(relationItem => {
+              // 获取 relation 项中 business_data 的 name（注意处理可能的空值）
+              const targetProp = relationItem.business_data?.name;
+              if (!targetProp) return; // 若 name 不存在，跳过
+
+              // 若 caiwuItem 存在该属性，则赋值
+              if (caiwuItem.hasOwnProperty(targetProp)) {
+                caiwuItem[targetProp] = relationItem.value;
+              }
+            });
+          });
+          console.log("this.caiwuList",this.caiwuList)
+          console.log("this.caiwuTable",this.caiwuTable)
+          this.$forceUpdate()
+        }
+        this.showList = true
+      },
+
       async getStatusList() {
         this.nowDate = this.$moment().add(1, 'months').format('YYYY-MM-DD')
         this.startDate = this.$moment('1900-01-01').format("YYYY-MM-DD")
@@ -237,7 +370,8 @@
             this.getFillChart()
           }
         })
-      },
+      },
+
       changeArea(e) {
         this.list_business.map(item => {
           if (this.monthSelect.business_id === item.id) {
@@ -300,7 +434,7 @@
         let dMonth = this.getMonthArr(res.list)
         this.overall_month_data.x = xMonth
         this.overall_month_data.list = dMonth
-        console.log("this.overall_month_data", this.overall_month_data)
+        // console.log("this.overall_month_data", this.overall_month_data)
       },
       // 月度数据根据类别 归类
       getMonthArr(list) {
@@ -391,7 +525,7 @@
           area_id: this.yearSelect.area_id
         })
         this.yearsArr = this.getYearObj(res.list, res.budgets)
-        console.log("getYearObj", this.getYearObj(res.list, res.budgets))
+        // console.log("getYearObj", this.getYearObj(res.list, res.budgets))
       },
       // 合并预算  和业务数据
       getYearObj(list, budgets) {
@@ -424,7 +558,7 @@
                   radius: '60%',
                   tooltip: {
                     formatter: function(item) {
-                      console.log(item)
+                      // console.log(item)
                       let result = `${item.seriesName}<br/>`;
                       const name = item.name; // 系列名称
                       const value = item.value; // 数据值
@@ -448,7 +582,7 @@
             let matchedBudgets = flatBudgets.filter(budget =>
               list[name].some(item => item.business_id === budget.business_id)
             );
-            console.log(name, list[name], matchedBudgets)
+            // console.log(name, list[name], matchedBudgets)
             // 年度预算
             this.budget_data.list.map(item=>{
               if(item.id==='quarter_1'){
@@ -473,7 +607,7 @@
               })
             })
             yearObjs.push(yearObj);
-            console.log("budget_data", this.budget_data)
+            // console.log("budget_data", this.budget_data)
           }
         }
         this.budget_data.x = budget_data_x