config/dev.env.js

@@ -4,5 +4,5 @@ const prodEnv = require('./prod.env')
 
 module.exports = merge(prodEnv, {
   NODE_ENV: '"development"',
-  BASE_API: '"/api"'
+  BASE_API: '"/proxyApi"'
 })

src/api/personnel.js

@@ -1,29 +0,0 @@
-import request from '@/utils/request'
-import axios from 'axios'
-import qs from 'qs'
-if (process.env.NODE_ENV === 'development') {
-    axios.defaults.baseURL = '/'
-} else if (process.env.NODE_ENV === 'production') {
-    axios.defaults.baseURL = '/'
-}
-//设置公共请求头
-let access_token = JSON.parse(sessionStorage.getItem("token"))
-axios.defaults.headers.common['Blade-Auth'] =  access_token;
-// //获取token登录接口
-// export const getToken = (data) => {
-//     // axios.defaults.headers.common['Authorization'] = `Basic c2FiZXI6c2FiZXJfc2VjcmV0`;
-//     // axios.defaults.headers.common['Tenant-Id'] = `748495`
-//     return axios.post('api/blade-auth/oauth/token'+'?grant_type='+data.grant_type+'&scope='+data.scope
-//     +'&tenantId='+data.tenantId+'&username='+data.username+'&password='+data.password+'&type='+data.type,
-//     data,
-//      {headers: {'Authorization':'Basic c2FiZXI6c2FiZXJfc2VjcmV0',
-//      'Tenant-Id': '748495','Content-Type': 'application/json;charset=UTF-8'}}
-//      )
-// };
-//人员统计
-export const getUserGroup = (params) => {
-    return axios.get('api/ems-third-party-service/user/group',
-    {params},
-     )
-};
-

src/components/common/pieDateChart.vue

@@ -2,23 +2,22 @@
   <div style="width:100%;height:100%;position: relative;">
     <div class="allTotle">
       <div>项目总人数</div>
-      <span>{{totalPer}}</span>
+      <span>100</span>
       <span>人</span>
     </div>
     <div ref="chart" style="width:100%;height:100%;"></div>
     <div class="jsBox">
-      <div class="bogJs" v-for="(item, i) in pieData" :key="i">
+      <div class="bogJs">
         <div class="jsChild">
-          <span :style="item.color"></span>
+          <span style="background: #00B3FF;"></span>
-          <!-- <span :background="item.color"></span> -->
+          <span>项目管理组</span>
-          <span>{{item.groupName}}</span>
         </div>
         <div class="js2Child">
-          <span>{{item.number}}</span>
+          <span>85</span>
           <span>人</span>
         </div>
       </div>
-      <!-- <div class="bogJs">
+      <div class="bogJs">
         <div class="jsChild">
           <span style="background: #F1E453;"></span>
           <span>项目管理组</span>
@@ -37,28 +36,19 @@
           <span>85</span>
           <span>人</span>
         </div>
-      </div> -->
+      </div>
     </div>
 
   </div>
 </template>
 <script>
 export default {
-  props: {
+  props: {},
-      pieData:{
-        type:Array,
-        default: []
-      }
-  },
 
   components: {},
 
   data() {
-    return {
+    return {};
-        totalPer:0,
-        pieDataNew:[],
-        color:['background-color:#00B3FF','background-color:#F1E453','background-color:#F85B60','background-color:#00A572', 'background-color:#008AA4', 'background-color:#7968D9', 'background-color:#C7A73E'],
-    };
   },
   mounted() {
     this.initCharts();
@@ -70,356 +60,133 @@ export default {
       handler() {
         this.resetOption();
       }
-    },
-    pieData: {
-        deep: true,
-        handler(newVal) {
-          console.log(newVal,'==============');
-        //    this.initCharts(newVal)
-          this.changeNewVal(newVal)
-          
-        }
     }
   },
 
   methods: {
-    //获取人员数据
-    changeNewVal(newVal){
-        console.log("newVal",newVal)
-        this.pieDataNew = newVal
-        // var pieDataN = []
-            newVal.map((item,index) => {
-                this.totalPer+=item.number
-                console.log("this.totalPer",this.totalPer)
-             this.color.forEach((items,indexs) => {
-                if(index==indexs){
-                   return  item.color = items
-                }
-             })            
-            })
-    },
-
     initCharts() {
       let myChart = this.$echarts.init(this.$refs.chart);
-    //   var placeHolderStyle = {
+      var placeHolderStyle = {
-    //     normal: {
+        normal: {
-    //       label: {
+          label: {
-    //         show: false,
+            show: false,
-    //         position: "center"
+            position: "center"
-    //       },
-    //       labelLine: {
-    //         show: false
-    //       },
-    //       color: "#104841a3",
-    //       borderWidth: 0
-    //     },
-    //     emphasis: {
-    //       color: "#104841a3",
-    //       borderColor: "#00b3ff",
-    //       borderWidth: 0
-    //     }
-    //   };
-    //   // 绘制图表
-    //   myChart.setOption({
-    //     series: [
-    //       {
-    //         name: '值',
-    //         type: 'pie',
-    //         clockWise: true,
-    //         hoverAnimation: false,
-    //         radius: ['92%', '97%'],
-    //         center: ['50%', '50%'],
-    //         itemStyle: {
-    //           normal: {
-    //             label: {
-    //               show: false
-    //             },
-    //             labelLine: {
-    //               show: false,
-    //               length: 100,
-    //               smooth: 0.5
-    //             },
-    //             borderWidth: 5,
-    //             shadowBlur: 40,
-    //             borderColor: "#00B3FF",
-    //             shadowColor: 'rgba(0, 0, 0, 0)' //边框阴影
-    //           }
-    //         },
-    //         data: [{
-    //           value: 12,
-    //         }, {
-    //           value: 4,
-    //           name: '',
-    //           itemStyle: placeHolderStyle
-    //         }]
-    //       },
-    //       // ------------2
-    //       {
-    //         name: '值',
-    //         type: 'pie',
-    //         clockWise: true,
-    //         hoverAnimation: false,
-    //         radius: ['72%', '67%'],
-    //         center: ['50%', '50%'],
-    //         itemStyle: {
-    //           normal: {
-    //             label: {
-    //               show: false
-    //             },
-    //             labelLine: {
-    //               show: false,
-    //               length: 100,
-    //               smooth: 0.5
-    //             },
-    //             borderWidth: 5,
-    //             shadowBlur: 40,
-    //             borderColor: "#F1E453",
-    //             shadowColor: 'rgba(0, 0, 0, 0)' //边框阴影
-    //           }
-    //         },
-    //         data: [{
-    //           value: 6,
-    //         }, {
-    //           value: 4,
-    //           name: '',
-    //           itemStyle: placeHolderStyle
-    //         }]
-    //       },
-    //       // ------------3
-    //       {
-    //         name: '值',
-    //         type: 'pie',
-    //         clockWise: true,
-    //         hoverAnimation: false,
-    //         radius: ['48%', '44%'],
-    //         center: ['50%', '50%'],
-    //         itemStyle: {
-    //           normal: {
-    //             label: {
-    //               show: false
-    //             },
-    //             labelLine: {
-    //               show: false,
-    //               length: 100,
-    //               smooth: 0.5
-    //             },
-    //             borderWidth: 5,
-    //             shadowBlur: 40,
-    //             borderColor: "#f85b60",
-    //             shadowColor: 'rgba(0, 0, 0, 0)' //边框阴影
-    //           }
-    //         },
-    //         data: [{
-    //           value: 9,
-    //         }, {
-    //           value: 44,
-    //           name: '',
-    //           itemStyle: placeHolderStyle
-    //         }]
-    //       },
-    //     ]
-    //   });
-   var  data = [{
-        name: "本科及以上",
-        value: 13211
           },
-    {
+          labelLine: {
-        name: "高中",
+            show: false
-        value: 42111
           },
-    {
+          color: "#104841a3",
-        name: "初中及以下",
+          borderWidth: 0
-        value: 81711
         },
-    {
+        emphasis: {
-        name: "其他",
+          color: "#104841a3",
-        value: 121711
+          borderColor: "#00b3ff",
+          borderWidth: 0
         }
-];
-function   getArrayValue(array, key) {
-    var key = key || "value";
-    var res = [];
-    if (array) {
-        array.forEach(function(t) {
-            res.push(t[key]);
-        });
-    }
-    return res;
-}
-function array2obj(array,key) {
-	var resObj = {};
-	for(var i=0;i<array.length;i++){
-		resObj[array[i][key]] = array[i];
-	}
-	return resObj;
-}
-function getData(data) {
-    var res = {
-        series: [],
-        yAxis: []
       };
-    for (let i = 0; i < data.length; i++) {
+      // 绘制图表
-        res.series.push({
+      myChart.setOption({
-            name: '学历',
+        series: [
+          {
+            name: '值',
             type: 'pie',
-            clockWise: false, //顺时加载
+            clockWise: true,
-            hoverAnimation: false, //鼠标移入变大
+            hoverAnimation: false,
-            radius: [65 - i * 15 + '%', 57 - i * 15 + '%'],
+            radius: ['92%', '97%'],
-            center: ["30%", "55%"],
+            center: ['50%', '50%'],
+            itemStyle: {
+              normal: {
                 label: {
                   show: false
                 },
-            itemStyle: {
-                label: {
-                    show: false,
-                },
                 labelLine: {
-                    show: false
+                  show: false,
+                  length: 100,
+                  smooth: 0.5
                 },
                 borderWidth: 5,
+                shadowBlur: 40,
+                borderColor: "#00B3FF",
+                shadowColor: 'rgba(0, 0, 0, 0)' //边框阴影
+              }
             },
             data: [{
-                value: data[i].value,
+              value: 12,
-                name: data[i].name
             }, {
-                value: sumValue - data[i].value,
+              value: 4,
               name: '',
-                itemStyle: {
+              itemStyle: placeHolderStyle
-                    color: "rgba(0,0,0,0)",
-                    borderWidth: 0
-                },
-                tooltip: {
-                    show: false
-                },
-                hoverAnimation: false
             }]
-        });
+          },
-        res.series.push({
+          // ------------2
-            name: '',
+          {
+            name: '值',
             type: 'pie',
-            silent: true,
+            clockWise: true,
-            z: 1,
+            hoverAnimation: false,
-            clockWise: false, //顺时加载
+            radius: ['72%', '67%'],
-            hoverAnimation: false, //鼠标移入变大
+            center: ['50%', '50%'],
-            radius: [65 - i * 15 + '%', 57 - i * 15 + '%'],
+            itemStyle: {
-            center: ["30%", "55%"],
+              normal: {
                 label: {
                   show: false
                 },
-            itemStyle: {
-                label: {
-                    show: false,
-                },
                 labelLine: {
-                    show: false
+                  show: false,
+                  length: 100,
+                  smooth: 0.5
                 },
                 borderWidth: 5,
+                shadowBlur: 40,
+                borderColor: "#F1E453",
+                shadowColor: 'rgba(0, 0, 0, 0)' //边框阴影
+              }
             },
             data: [{
-                value: 7.5,
+              value: 6,
-                itemStyle: {
-                    color: "#E3F0FF",
-                    borderWidth: 0
-                },
-                tooltip: {
-                    show: false
-                },
-                hoverAnimation: false
             }, {
-                value: 2.5,
+              value: 4,
               name: '',
-                itemStyle: {
+              itemStyle: placeHolderStyle
-                    color: "rgba(0,0,0,0)",
-                    borderWidth: 0
-                },
-                tooltip: {
-                    show: false
-                },
-                hoverAnimation: false
             }]
+          },
+          // ------------3
+          {
+            name: '值',
+            type: 'pie',
+            clockWise: true,
+            hoverAnimation: false,
+            radius: ['48%', '44%'],
+            center: ['50%', '50%'],
+            itemStyle: {
+              normal: {
+                label: {
+                  show: false
+                },
+                labelLine: {
+                  show: false,
+                  length: 100,
+                  smooth: 0.5
+                },
+                borderWidth: 5,
+                shadowBlur: 40,
+                borderColor: "#f85b60",
+                shadowColor: 'rgba(0, 0, 0, 0)' //边框阴影
+              }
+            },
+            data: [{
+              value: 9,
+            }, {
+              value: 44,
+              name: '',
+              itemStyle: placeHolderStyle
+            }]
+          },
+        ]
       });
-        res.yAxis.push((data[i].value / sumValue * 100).toFixed(2) + "%");
-    }
-    return res;
-}
-var arrName = getArrayValue(data, "name");
-var arrValue = getArrayValue(data, "value");
-var sumValue = eval(arrValue.join('+'));
-var objData = array2obj(data, "name");
-var optionData = getData(data);
-
-
-myChart.option = {
-    backgroundColor:'#fff',
-    legend: {
-        show: true,
-        top: "center",
-        left: '70%',
-        data: arrName,
-        itemWidth: 30,
-        itemHeight: 20,
-        width:50,
-        padding: [0, 5],
-        itemGap: 25,
-        formatter: function(name) {
-            return "{title|" + name + "}\n{value|" + (objData[name].value) + "人}"
-        },
-        textStyle: {
-            rich: {
-                title: {
-                    fontSize: 10,
-                    lineHeight: 10,
-                    color: "rgba(0,0,0,.45)"
-                },
-                value: {
-                    fontSize: 14,
-                    lineHeight: 18,
-                    color: "rgba(0,0,0,.85)"
-                }
-            }
-        },
-    },
-    tooltip: {
-        show: true,
-        trigger: "item",
-        formatter: "{a}<br>{b}:{c}({d}%)"
-    },
-    color: ['#FF8700', '#ffc300', '#00e473', '#009DFF'],
-    grid: {
-        top: '20%',
-        bottom: '48%',
-        left: "30%",
-        containLabel: false
-    },
-    yAxis: [{
-        type: 'category',
-        inverse: true,
-        axisLine: {
-            show: false
-        },
-        axisTick: {
-            show: false
-        },
-        axisLabel: {
-            interval: 0,
-            inside: true,
-            textStyle: {
-                color: "#000",
-                fontSize: 10,
-            },
-            show: true
-        },
-        data: optionData.yAxis
-    }],
-    xAxis: [{
-        show: false
-    }],
-    series: optionData.series
-};
       //默认第一条高亮
-    //   myChart.dispatchAction({ type: 'highlight', seriesIndex: [0, 1, 2], dataIndex: 0 });
+      myChart.dispatchAction({ type: 'highlight', seriesIndex: [0, 1, 2], dataIndex: 0 });
-    },
+    }
-
   }
 };
 </script>

src/views/index.vue

@@ -21,9 +21,6 @@
             <span>&nbsp;&nbsp;天气&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
             <span>{{weatherItem.weather}} &nbsp;{{weatherItem.temperature}}℃</span>
           </div>
-           <div class="closeIndex" @click="closeindex">
-            <img src="../assets/pic/closeIndex.png" alt="">
-          </div>
         </div>
         </div>
         
@@ -370,9 +367,6 @@ export default {
           break; 
       }
     },
-    closeindex(){
-         this.$router.push('/')
-    },
     //获取当前时间
     getTime(){
         let myDate = new Date()  
@@ -1102,17 +1096,11 @@ position: absolute;
       right: 80px;
       width: 17.5px;
       height: 18px;
-    //   background: url("~@/assets/pic/sun.png") no-repeat;
+      background: url("~@/assets/pic/sun.png") no-repeat;
       background-size: 100% 100%;
     }
   }
-.closeIndex{
+
-     width: 40px;
-    height: 40px;
-    position: absolute;
-    top: 5px;
-    right: 22px;
-}
 }
 
 .header .title {

src/views/login.vue

@@ -1,8 +1,7 @@
 <template>
   <Resize>
     <div style="width:100%;height:100%;position: relative;">
-      <!-- <div class="bgPicture" :style="{ height: vdaH }"> -->
+      <div class="bgPicture" :style="{ height: vdaH }">
-        <div class="bgPicture" style="height:100%">
         <!-- 标题 -->
         <div class="title"></div>
         <div class="titTop">

src/views/modelScreen.vue

@@ -9,13 +9,10 @@
           </div>
           <div class="titRight">
             <span>{{dateNew}}&nbsp;{{getWeek}}&nbsp;{{time}}</span>
-            <!-- <span></span> -->
+            <span></span>
             <span>&nbsp;&nbsp;天气&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
             <span>{{weatherItem.weather}} &nbsp;{{weatherItem.temperature}}℃</span>
           </div>
-          <div class="closeIndex" @click="closeindex">
-            <img src="../assets/pic/closeIndex.png" alt="">
-          </div>
         </div>
       </div>
       <div @click="disBox" ref="screenBox" :class="!boxNone ? 'screenBox dh1' : 'screenBox dh2'"
@@ -479,9 +476,6 @@ export default {
           break; 
       }
     },
-    closeindex(){
-         this.$router.push('/')
-    },
     //获取当前时间
     getTime(){
         let myDate = new Date()  
@@ -1138,10 +1132,7 @@ export default {
       background-size: 100% 100%;
     }
   }
-.closeIndex{
+
-   width: 100px;
-   height: 80px;
-}
 }
 
 .title {

src/views/modelScreenComponents.vue

@@ -638,10 +638,6 @@ export default {
     getProjectInfo().then((res) => {
       this.introduction = res.data.data[0].introduction;
       this.projectId = res.data.data[0].id;
-      sessionStorage.setItem(
-                            "projectId",
-                            res.data.data[0].id
-                          );
       //人员监控信息
       getUserMonitorInfo({
         projectId: this.projectId,

src/views/personnelComponents.vue

@@ -1,5 +1,25 @@
 <template>
+    <!-- <Resize> -->
         <div >
+            <!-- <div class="bgPicture" :style="{ height: vdaH }">
+                <div class="title"></div>
+                <div class="titTop">
+                    <div class="titLeft">
+                        <span @click="goBack(1)">首页</span>
+                        <span>/</span>
+                        <span @click="goBack(2)">人员管理</span>
+                    </div>
+                    <div class="titRight">
+                        <span>2023年2月17日 星期四 14:26</span>
+                        <span></span>
+                        <span>&nbsp;&nbsp;天气&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
+                        <span>晴 12℃</span>
+                    </div>
+                </div>
+            </div>
+            <div @click="disBox" class="screenBox"
+                :style="{ 'background-image': !boxNone ? `url(${require(`../assets/pic/exitFull.png`)}` : `url(${require(`../assets/pic/fullScreen.png`)}` ,right: boxNone ? '483px' : '10px'}">
+            </div>            -->
              <div @click="disBox" class="screenBox"
                 :style="{ 'background-image': !boxNone ? `url(${require(`../assets/pic/exitFull.png`)}` : `url(${require(`../assets/pic/fullScreen.png`)}` ,right: boxNone ? '483px' : '10px'}">
             </div>   
@@ -11,7 +31,7 @@
                     <span></span>
                 </div>
                 <div class="concet">
-                    <pieDateChart style="width: 100%; height: 100%" :pieData='pieData'/>
+                    <pieDateChart style="width: 100%; height: 100%" />
                 </div>
             </div>
             <!-- 左侧模块2 -->
@@ -207,7 +227,7 @@ import RadarChart from "@/components/common/RadarChart";
 import pieChart from "@/components/common/pieChart";
 import pieDateChart from "@/components/common/pieDateChart";
 import Resize from '../utils/Resize.vue'
-import {getUserGroup} from "@/api/personnel";
+
 export default {
     name: "report",
     components: {
@@ -351,8 +371,7 @@ export default {
             numberList: [5, 5],
             innerHeight: null,
             dialogShow: false,
-            topicSends:[],
+            topicSends:[]
-            pieData:[],
         };
     },
     created() {
@@ -362,30 +381,10 @@ export default {
         console.log("this.iconPicList",this.iconPicList)
 
     },
-     mounted() {
+    mounted(){
-         this.getUser()
         this.createMqtt()
-        // this.switchDiv();
-        // window.onresize = () => {
-        //         return (() => {
-        //             let h = document.documentElement.clientHeight || document.body.clientHeight;
-        //           this.vdaH = h - 0 + "px";
-        //         })()
-        //     }
     },
     methods: {
-        //获取人员统计
-        getUser(){
-            let projectId = sessionStorage.getItem("projectId")
-            console.log("projectId",projectId)
-             getUserGroup({
-          projectId:projectId
-        }).then((res)=>{
-            console.log("res.data.data",res.data.data)
-        //   this.projectUser = res.data.data
-        this.pieData= res.data.data
-        })
-        },
          createMqtt() {
            
             this.topicSends = ['webdata'];
@@ -458,7 +457,15 @@ export default {
             }
         }
     },
-   
+    mounted() {
+        this.switchDiv();
+        window.onresize = () => {
+                return (() => {
+                    let h = document.documentElement.clientHeight || document.body.clientHeight;
+                  this.vdaH = h - 0 + "px";
+                })()
+            }
+    }
 };
 </script>