From ee6fac17c7ac08298b38e2938f9cbfd841c001de Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9C002001lixiaobang=E2=80=9D?= <2547956374@qq.com>
Date: Tue, 21 Mar 2023 17:49:40 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BB=A3=E7=A0=81=E6=8F=90=E4=BA=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/api.js                        | 26 ++++++++-
 src/components/common/mdScreenPie.vue | 67 +++++++++++------------
 src/views/modelScreenComponents.vue   | 79 +++++++++++++++++++--------
 3 files changed, 112 insertions(+), 60 deletions(-)

diff --git a/src/api/api.js b/src/api/api.js
index 67181ed..00b0323 100644
--- a/src/api/api.js
+++ b/src/api/api.js
@@ -6,7 +6,8 @@ if (process.env.NODE_ENV === 'development') {
 } else if (process.env.NODE_ENV === 'production') {
     axios.defaults.baseURL = '/'
 }
-//获取token
+
+//获取token登录接口
 export const getToken = (data) => {
     // axios.defaults.headers.common['Authorization'] = `Basic c2FiZXI6c2FiZXJfc2VjcmV0`;
     // axios.defaults.headers.common['Tenant-Id'] = `748495`
@@ -17,6 +18,29 @@ export const getToken = (data) => {
      'Tenant-Id': '748495','Content-Type': 'application/json;charset=UTF-8'}}
      )
 };
+//项目信息接口
+export const getProjectInfo = (params) => {
+  let access_token = JSON.parse(sessionStorage.getItem("token"))
+  axios.defaults.headers.common['Blade-Auth'] =  access_token;
+  return axios.get('api/ems-third-party-service/project/list',
+  params,
+   )
+};
+//人员信息监控接口
+export const getUserMonitorInfo = (params) => {
+  let access_token = JSON.parse(sessionStorage.getItem("token"))
+axios.defaults.headers.common['Blade-Auth'] =  access_token;
+  return axios.get('api/ems-third-party-service/user/monitor',{
+  params,
+  }
+   )
+};
+//项目人员分组信息接口
+export const getUserGroup = (params) => {
+  return axios.get('api/ems-third-party-service/user/group',
+  {params},
+   )
+};
 export function filterCompanyAPI (params) {
   return request({
     url: '/rcm/company-credit/filterCompany',
diff --git a/src/components/common/mdScreenPie.vue b/src/components/common/mdScreenPie.vue
index 723969a..aabf4f7 100644
--- a/src/components/common/mdScreenPie.vue
+++ b/src/components/common/mdScreenPie.vue
@@ -1,7 +1,7 @@
 <template>
     <div style="width:100%;height:100%;">
       <div ref="chart" style="width:100%;height:100%;"></div>
-      <div class="boxPeople aa">
+      <!-- <div class="boxPeople aa">
         <div class="name" style="color: #F2DA8D;">施工工作组</div>
         <div class="nucm" style="color: #F9EBBD;font-weight: bold;font-size: 24px; ">33<span style=" font-size: 14px; color: #F2DA8D;">人</span></div>
       </div>
@@ -16,7 +16,7 @@
       <div class="boxPeople dd">
         <div class="name" style="color: #53E3FF">项目监理组</div>
         <div class="nucm" style="color: #E3FAFF;font-weight: bold;font-size: 24px; ">33<span style=" font-size: 14px; color: #53E3FF;">人</span></div>
-      </div>
+      </div> -->
     </div>
 </template>
   <script>
@@ -34,6 +34,10 @@
             return ['#00A572', '#008AA4', '#7968D9', '#C7A73E']
         } 
       },
+      projectUser:{
+        type:Array,
+        default: []
+      }
     },
 
     components: {
@@ -43,7 +47,6 @@
       return {}
     },
     mounted() {
-      this.initCharts()
     },
     watch: {
       // 监听父组件中的数据变化，重新触发Echarts
@@ -52,52 +55,39 @@
         handler() {
           this.resetOption()
         }
+      },
+      projectUser: {
+        deep: true,
+        handler(newVal) {
+          console.log(newVal,'==============');
+          this.initCharts(newVal)
+        }
       }
     },
     methods: {
-      initCharts() {
+      initCharts(value) {
         let myChart = this.$echarts.init(this.$refs.chart)
+        console.log(value,'============');
         var val1data2 = [{
           value: 33,
           name: '电工',
-          itemStyle: { // 此配置
-                normal: {
-                  borderWidth: 2,
-                  borderColor: '#52FFC1'
-                }
-              },
         },
         {
           value: 13,
           name: '项目监理组',
-          itemStyle: { // 此配置
-                normal: {
-                  borderWidth: 2,
-                  borderColor: '#B6F9FF'
-                }
-              },
         },
         {
           value: 14,
           name: '土建专工',
-          itemStyle: { // 此配置
-                normal: {
-                  borderWidth: 2,
-                  borderColor: '#DCD6FF'
-                }
-              },
         },
         {
           value: 43,
           name: '架子工',
-          itemStyle: { // 此配置
-                normal: {
-                  borderWidth: 2,
-                  borderColor: '#FFF6DA'
-                }
-              },
         }
         ]
+        val1data2 = Object.keys(value).map((item,index)=>{
+          return {name:value[item].groupName,value:value[item].number}
+        })
         var arr = ['middleLost', 0.6, val1data2, '今日完成进度']
         // 绘制图表
         myChart.setOption({
@@ -121,19 +111,19 @@
               color: this.colorList,
               hoverAnimation: true, /// /设置饼图默认的展开样式
               label: {
-                show: false,
-                formatter: '{b}{c}%',
+                show: true,
+                formatter: '{b}：{c}',
                 rich: {
                   d: {
                     color: '#fff',
-                    fontSize: 16,
-                    lineHeight: 24,
-                    height: 24
+                    fontSize: 25,
+                    // lineHeight: 24,
+                    height: 24,
                   },
                   c: {
                     color: "red",
-                    fontSize: 14,
-                    lineHeight: 20,
+                    fontSize: 25,
+                    // lineHeight: 20,
                     align: 'left',
                   }
                 },
@@ -144,7 +134,12 @@
                   show: false
                 }
               },
-
+              itemStyle: { // 此配置
+                normal: {
+                  borderWidth: 2,
+                  borderColor: '#fff'
+                }
+              },
               data: arr[2]
             }
           ]
diff --git a/src/views/modelScreenComponents.vue b/src/views/modelScreenComponents.vue
index cb2e6a8..6631e24 100644
--- a/src/views/modelScreenComponents.vue
+++ b/src/views/modelScreenComponents.vue
@@ -63,7 +63,7 @@
           <span></span>
         </div>
         <div class="concet">
-          本次智慧工地建设的目标是借助AI人工智能识别、三维BIM模型数字孪生、物联网多元化数据实时检测、室内人员定位、智能安全帽、电缆智能化敷设、移动互联技术、云计算服务等新技术手段实现工地端的项目的进度、安全、质量、技术、人员等全方位的管理优化提升，实现工程建设管理过程的数字化、智能化、可视化、移动化、标准化，提高工地现场的整体管控水平，树立典型电缆敷设工程智慧工地管控标杆。
+          {{introduction}}
         </div>
       </div>
       <!-- 左侧模块2 -->
@@ -75,32 +75,43 @@
         </div>
         <div class="numTotle">
           <span>今日出勤：</span>
-          <span class="num" v-for="(item, i) in numberList" :key="i">{{
+          <span class="num" v-for="(item, i) in attendanceNumber" :key="i">{{
             item
           }}</span>
           <span>人</span>
         </div>
         <div class="numT2otle">
           <span>实时现场：</span>
-          <span class="num" v-for="(item, i) in numberList" :key="i">{{
+          <span class="num" v-for="(item, i) in onSiteNumber" :key="i">{{
             item
           }}</span>
           <span>人</span>
         </div>
         <div class="peopleMessage"></div>
-        <div class="firBox" style="position: absolute;top: 116px;left:58px">
-          <div class="nameMessage">
-            <span style="color: #7FFFFC;">姓名</span>
-            <span style="color: #ffffff;">：王刚</span>
+        <div class="firBox" style="position: absolute;top: 116px;left:58px; height: 87px;overflow: auto;">
+          <div class="nameMessage" v-for="(item,index) in peopleList" :key="index">
+            <div style="margin-top:10px">
+              <span style="color: #7FFFFC;">{{item.label}}</span>
+            <span style="color: #ffffff;">{{item.name1}}</span>
+            </div>
+            <div style="margin-top:10px">
+              <span style="color: #7FFFFC;">{{item.label1}}</span>
+            <span style="color: #ffffff;">{{item.name2}}</span>
+            </div>
+            <div style="margin-top:10px">
+              <span style="color: #7FFFFC;">{{item.label2}}</span>
+            <span style="color: #ffffff;">{{item.time}}</span>
+            </div>
+            
           </div>
-          <div class="nameMessage">
+          <!-- <div class="nameMessage">
             <span style="color: #7FFFFC;">岗位</span>
             <span style="color: #ffffff;">：项目经理</span>
           </div>
           <div class="nameMessage">
             <span style="color: #7FFFFC;">出勤时间</span>
             <span style="color: #ffffff;">：2022-11-20 12:12:0{{ tienum }}</span>
-          </div>
+          </div> -->
         </div>
         <div class="passBox">
           <div></div>
@@ -117,7 +128,7 @@
       </div>
       <div class="pieBox">
         <mdScreenPie style="width: 100%; height: 100%" color="#1ffdfa" chart-title="扫描数量分析" :chart-data="chartData"
-          :x-axis-data="xArry" />
+          :x-axis-data="xArry" :projectUser="projectUser"/>
       </div>
     </div>
     <!-- 右侧模块1 -->
@@ -228,6 +239,7 @@ import mdScreenPie from "@/components/common/mdScreenPie";
 import Swiper from "@/components/common/carousel";
 import Resize from '../utils/Resize.vue'
 import axios from 'axios';
+import {getProjectInfo,getUserMonitorInfo,getUserGroup} from "@/api/api";
 export default {
   name: "report",
   components: {
@@ -238,6 +250,9 @@ export default {
   },
   data() {
     return {
+      introduction:'',//基本情况
+      projectId:'',//项目Id
+      projectUser:[],//项目人员
         getWeek:'星期四',
         dateNew:'2023年2月17日',
         time:'14:26',
@@ -426,22 +441,19 @@ export default {
       chartData: [],
       peopleList: [
         {
-          name: "姓名",
-          value: "：王刚"
+          label: "姓名:",
+          name1: "王刚",
+          label1: "岗位:",
+          name2:'施工人员',
+          label2:'出勤时间:',
+          time:'2022-11-26 08:22:13'
         },
-        {
-          name: "岗位",
-          value: "：项目经理"
-        },
-        {
-          name: "入岗时间",
-          value: "：2022-11-26 08:22:13"
-        }
       ],
       vdaH: 0,
       type: false,
       menuType: null,
-      numberList: [5, 5],
+      attendanceNumber: [], //今日出勤
+      onSiteNumber: [], //今日出勤
       boxNone: true,
       topicSends:[]
     };
@@ -557,7 +569,28 @@ export default {
   },
 
   mounted() {
-    // this.switchDiv(); 
+    //基本情况
+    getProjectInfo().then((res)=>{
+      this.introduction = res.data.data[0].introduction
+      this.projectId = res.data.data[0].id
+      //人员监控信息
+        getUserMonitorInfo({
+          projectId: this.projectId
+        }).then((res)=>{
+          this.attendanceNumber.push(res.data.data.attendanceNumber)
+          this.onSiteNumber.push(res.data.data.onSiteNumber)
+          this.peopleList = Object.keys(res.data.data.users).map((item,index)=>{
+            return {label:'姓名:',label1:'岗位',label2:'出勤时间',name1:res.data.data.users[item].name,name2:res.data.data.users[item].post,time:res.data.data.users[item].inTime}
+          })
+        })
+        //项目人员分组信息接口
+        getUserGroup({
+          projectId: this.projectId
+        }).then((res)=>{
+          this.projectUser = res.data.data
+        })
+    })
+    
     window.onresize = () => {
       return (() => {
         let h = document.documentElement.clientHeight || document.body.clientHeight;
@@ -985,7 +1018,7 @@ export default {
 
   span:nth-child(1) {
     display: inline-block;
-    width: 56px;
+    width: 65px;
     text-align-last: justify;
   }
 }