Merge branch 'dev' of http://62.234.3.186:3000/sxyanzhu/jhbigscreen into dev

# Conflicts:
#	public/index.html

public/css/largeScreenLayout.css

@@ -57,6 +57,9 @@
     height: 970px;
     background: url("../images/one/3x3.png") no-repeat center/100% 100%;
 }
+.screen-one-3-3.no-title{
+    background: url("../images/one/3x32.png") no-repeat center/100% 100%;
+}
 .screen-one-3-4{
     height: 970px;
     background: url("../images/one/3x4.png") no-repeat center/100% 100%;

src/api/flow/index.js

@@ -13,6 +13,29 @@ const groupByUnit=(projectId,deptId)=> {
       method: 'get'
     })
   }
+
+const groupByUnitFinish=(projectId,deptId)=> {
+  return request({
+    url: `bgscreen/flow/groupByUnitFinish?projectId=${projectId}&deptId=${deptId}`,
+    method: 'get'
+  })
+}
+
+const groupByUnitTotal=(projectId,deptId)=> {
+  return request({
+    url: `bgscreen/flow/groupByUnitTotal?projectId=${projectId}&deptId=${deptId}`,
+    method: 'get'
+  })
+}
+
+const groupByProject=()=> {
+  return request({
+    url: `bgscreen/flow/groupByProject`,
+    method: 'get'
+  })
+}
+
+
 const listByUnit=(projectId,deptId,unit,pageNum,pageSize)=>{
   return request({
     url: `bgscreen/flow/listByUnit?pageNum=${pageNum}&pageSize=${pageSize}`,
@@ -39,6 +62,9 @@ const listByState=(projectId,deptId,state,pageNum,pageSize)=>{
 export default{
     groupByCategory,
     groupByUnit,
+    groupByUnitFinish,
+    groupByUnitTotal,
     listByUnit,
-    listByState
+    listByState,
+    groupByProject
 }

src/api/project/index.js

@@ -92,7 +92,12 @@ const getInfo=()=>{
     method:'get'
   })
 }
-
+const listPhotography=id=>{
+  return request({
+    url: `bgscreen/photography/listPhotography?projectId=${id}`,
+    method: 'get'
+  });
+}
 
 export default{
     findProjectByDept,
@@ -102,7 +107,8 @@ export default{
     groupByCategory,
     groupByLevel,
     getProjectUser,
-    getInfo
+    getInfo,
+    listPhotography
 }
 
 

src/api/standard/index.js

@@ -7,6 +7,25 @@ const getList=(projectId,deptId)=> {
   })
 }
 
-export default{
+const groupByType=data=>{
-    getList
+  return request({
+    url:'bgscreen/standard/groupByType',
+    method:'post',
+    data:data
+  })
+}
+
+
+const groupByProject=()=>{
+  return request({
+    url:'bgscreen/standard/groupByProject',
+    method:'get'
+  })
+}
+
+
+export default{
+    getList,
+    groupByType,
+    groupByProject
 }

src/components/chart-bar.js

@@ -54,7 +54,7 @@ Vue.component("chart-bar", {
                       dataset: {
                         source: this.optData
                       },
-                      xAxis: { type: 'category' },
+                      xAxis: { type: 'category' , axisLabel: {color:"#fff"}},
                       yAxis: {},
                       series: [{ type: 'bar' }, { type: 'bar' }, { type: 'bar' }]
                 }

src/components/header.vue

@@ -21,7 +21,7 @@
                                 @click="pageJump(61, '#/video')">视频监控</button>
                             <button type="button" :class="nav == 62 ? 'active' : ''" class="sub-btn"
                                 @click="pageJump(62, '#/aiVideo')">AI识别监控</button>
-                            <button v-if="1==2" type="button" :class="nav == 63 ? 'active' : ''" class="sub-btn"
+                            <button v-if="1==1" type="button" :class="nav == 63 ? 'active' : ''" class="sub-btn"
                                 @click="pageJump(63, '#/photography')">延时摄影</button>
                         </div>
                     </div>
@@ -188,7 +188,7 @@ export default {
                         return it;
                     })]
                 }                
-                this.deptChange();
+                this.deptChange((()=>{}));
             });
         }
         this.$root.isTypeBuser = this.isTypeBuser;
@@ -268,11 +268,11 @@ export default {
                 this.loadProject(true);
             }
         },
-        deptChange() {
+        deptChange(cb) {
             if(!this.dept1){
                 if(this.depts.length>0){
                     this.dept1=this.depts[0].text;
-                    this.loadProject(true);
+                    this.loadProject(true,cb);
                 }
             }
             let tmps = this.depts.filter(d => d.text == this.dept1);
@@ -331,7 +331,7 @@ export default {
             this.deptChange();
             this.loadProject();
         },
-        loadProject(init) {
+        loadProject(init,cb) {
             if (this.isTypeBuser) {
                 return;
             }
@@ -348,6 +348,9 @@ export default {
                 } else {
                     this.setScreenLiSel2(null);
                 }
+                if(cb){
+                    cb();
+                }
             });
         },
         setScreenLiSel2(item, init) {

src/components/module/module-one-3-3.js

@@ -2,7 +2,7 @@ import Vue from 'vue'
 Vue.component('module-one-3-3', {
     template:`
         <div class="screen-module">
-            <div class="screen-one-3-3">
+            <div class="screen-one-3-3" :class="notitle?'no-title':''">
                 <div class="module-title"><span>{{label}}</span></div>
                 <slot></slot> 
             </div>
@@ -11,6 +11,9 @@ Vue.component('module-one-3-3', {
     props: {
         label:{
             type:String
+        },
+        notitle:{
+            type:Boolean
         }
     },
 

src/pages/engin/enginChart.vue

@@ -0,0 +1,57 @@
+<template>
+    <div class='engin-chart1' style="position: relative" >
+        <div :style="{ 'height': height + 'px' }" ref="warningPieChart">
+
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    props: {
+        fn: {
+            type: Function
+        },
+        height: {
+            type: Number
+        }       
+    },
+    data() {
+        return {
+            options:{},
+            opt:null
+        };
+    },
+    mounted() {
+        
+    },
+    methods: {       
+        init(opt) {
+            this.opt=opt;
+            this.getChartData()
+        },
+        getChartData() {
+            //品类金额占比 饼图
+            var chChartPie = echarts.init(this.$refs.warningPieChart);
+            this.echartPie(chChartPie)
+        },
+        echartPie(chChart) {
+            let newPromise = new Promise((resolve) => {
+                resolve()
+            })
+
+            //然后异步执行echarts的初始化函数
+            newPromise.then(() => {
+                this.option = {
+                   ...this.opt||{}
+                }
+                if (this.fn) {
+                    this.option = this.fn(this.option);
+                }
+                chChart.setOption(this.option);
+                window.onresize = chChart.resize;
+            })
+        },
+    },
+};
+</script>

src/pages/index.vue

@@ -277,9 +277,9 @@ export default {
                 icon: "rect",
                 orient: "horizontal",
                 left: '50%',
-                top: '0',
+                top: '10%',
-                itemGap: 0,     
+                itemGap: 20,
-                       
+                itemHeight:30,
                 textStyle: {
                     padding:[0,0,2,0],    
                     fontSize: 10,
@@ -611,7 +611,7 @@ export default {
                     roleType: 0
                 };
                 this.$api.problemmodify.safetySummary(postData).then(d => {
-                    this.dangersDatas = (d || []).map(it => {
+                   let tmps= (d || []).map(it => {
                         return {
                             text: it.problemArea,
                             prop: '0.0',
@@ -619,6 +619,8 @@ export default {
                             value: +it.roleType || 0
                         }
                     });
+                    tmps.splice(6)
+                    this.dangersDatas =tmps;
                     let sum = 0;
                     this.dangersDatas.forEach(it => {
                         sum += it.value * 1;
@@ -633,7 +635,7 @@ export default {
                 };
                 this.qualityNavTitle = "质量隐患总数";
                 this.$api.problemmodify.qualitySummary(postData).then(d => {
-                    this.dangersDatas = (d || []).map(it => {
+                   let tmps = (d || []).map(it => {
                         return {
                             text: it.problemArea,
                             prop: '0.0',
@@ -641,6 +643,8 @@ export default {
                             value: +it.roleType || 0
                         }
                     });
+                    tmps.splice(6)
+                    this.dangersDatas=tmps;
                     let sum = 0;
                     this.dangersDatas.forEach(it => {
                         sum += it.value * 1;

src/pages/photography.vue

@@ -0,0 +1,216 @@
+<template>
+    <div class="prj-photography-main">
+        <div class="screen-content">
+            <el-row>
+                <el-col :span="6">
+                    <module-one-3-1 label="延时摄影列表">
+                        <div class="left-list scroll">
+                            <template v-if="dataList && dataList.length>0">
+                        <el-collapse v-model="activeNames" >                           
+                            <el-collapse-item v-for="(it, idx) in dataList" :key="idx" :name="it.videoDate">
+                                <template slot="title">
+                                    <div style="position:relative;padding-left:20px;width: 100%;">
+                                        <span>{{ it.videoDate }}</span>
+                                        <i class="header-icon el-icon-camera-solid" @click.stop="playVideo(it)"
+                                            style="position: absolute;right: 30px;top: 10px;font-size: 30px;"></i>
+                                    </div>
+                                </template>
+                                <div class="img-items">
+                                    <div v-for="(item, index) in it.images" :key="index" class="img-item">
+                                        <el-image :src="item.url + '.min.jpg'" style="width: 90%;"
+                                            :preview-src-list="[item.url]" />
+                                        <div class="div-date">{{ item.date }}</div>
+                                    </div>
+                                </div>
+                            </el-collapse-item>
+                        </el-collapse>
+                    </template>
+                        <div v-else style="text-align: center;" class="div-no-data">
+                                        <img src="images/nodata.png" style="width: 120px;">
+                                        <div style="text-align: center;font-size: 12px;color:#888;">暂无数据</div>
+                                    </div>
+                    </div>
+                    </module-one-3-1>
+                </el-col>
+                <el-col :span="18" class="no-title">
+                    <module-one-3-3 label="" :notitle="true">
+                        <template v-if="info">
+                        <div class="right-title">
+                            <span class="sp-title">{{info.videoDate }}</span>
+                        </div>
+                        <video controls v-if="info">
+                            <source :src="info.videoUrl" type="video/mp4" />
+                            您的浏览器不支持Video标签。
+                        </video>
+                        </template>
+                        <div v-else style="text-align: center;" class="div-no-data">
+                                        <img src="images/nodata.png" style="width: 120px;">
+                                        <div style="text-align: center;font-size: 12px;color:#888;">暂无数据</div>
+                                    </div>
+                    </module-one-3-3>
+                </el-col>
+            </el-row>
+        </div>
+    </div>
+</template>
+
+<script>
+import '../components/module/module-one-3-1'
+import '../components/module/module-one-3-3'
+import debounce from 'lodash.debounce'
+export default {
+    name: 'JhbigscreenPhotography',
+
+    data() {
+        return {
+            prj: {},
+            prjs: [],
+            dataList: [],
+            activeNames: [],
+            info: null,
+        };
+    },
+
+    mounted() {
+        this.$bus.$on("loadProjects", debounce(prjs => {
+            this.prjs = prjs;
+        }));
+        this.$bus.$on("projectChange", debounce(res => {
+            this.prj = res;
+            this.loadData();
+        }));
+        if (this.$root.hasInitHeader) {
+            this.initMe();
+        }
+    },
+
+    methods: {
+        playVideo(it){
+            this.info=it;
+        },
+        loadData() {
+            this.info=null;
+            this.getProjectId(id => {
+                this.$api.project.listPhotography(id).then(d => {
+                    this.dataList = (d.data || []).map(it => {
+                        it.images = this.$tryToJson(it.imageUrl);
+                        return it;
+                    })
+                    if (this.dataList.length > 0) {
+                        this.activeNames = [this.dataList[0].videoDate];
+                        this.info = this.dataList[0];
+                    }
+                })
+
+            });
+        },
+        initMe() {
+            this.project = this.$root.project || {};
+            this.prjs = this.$root.projects || [];
+            this.loadData();
+        },
+        getProjectId(cb) {
+            let func = () => {
+                let prjId = this.prj?.id || 0;
+                if (prjId == 0) {
+                    if (!this.prjs || this.prjs.length == 0) {
+                        setTimeout(func, 100);
+                    } else {
+                        cb && cb(this.prjs[1].id);
+                    }
+                } else {
+                    cb && cb(prjId);
+                }
+            }
+            func();
+        },
+    },
+};
+</script>
+
+<style lang="less" scoped>
+.prj-photography-main {
+    .div-no-data{
+        text-align: center;
+    height: 600px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    }
+    .no-title {
+        /deep/ .screen-one-3-3 {
+            background-image: none;
+            border: solid 1px #409eff5c;
+            .module-title{
+                display: none;
+            }
+            .right-title{
+                height: 200px;
+                display: flex;
+                align-items: center;
+                justify-content: center
+            }
+            .sp-title{
+                display: inline-block;
+                line-height: 72px;
+                padding: 0px 40px;
+                font-size: 40px;
+                background-size: 100% 100%;
+                background-image: url('../assets/images/bgphoto.png');
+            }
+            video{
+                width: 100%;
+                height: calc(100% - 201px);
+            }
+        }
+    }
+    .left-list{
+        max-height: calc(100% - 40px);
+        overflow-y: auto;
+        &::-webkit-scrollbar {
+            width: 4px;
+            height: 4px;
+        }
+    }
+    /deep/ .screen-one-3-1 {
+        .el-collapse {
+            border: none;
+            margin-top: 4px;
+
+            .el-collapse-item {}
+
+            .el-collapse-item__header {
+                background-color: #097fca2e;
+                color: #089fff;
+                border: none;
+            }
+
+            .el-collapse-item__content {
+                padding-bottom: 12px;
+            }
+
+            .el-collapse-item__wrap {
+                background-color: transparent;
+                border: none;                
+                .img-item {
+                    margin-top: 8px;
+                    display: flex;
+                    align-items: center;
+                    justify-content: center;
+                    flex-direction: column;
+                    color: #fff;
+                    position: relative;
+
+                    .div-date {
+                        width: calc(90% - 24px);
+                        text-align: left;
+                        position: absolute;
+                        bottom: 0px;
+                        background-color: #ffffff38;
+                        padding-left: 24px;
+                    }
+                }
+            }
+        }
+    }
+}</style>

src/pages/projectEngin.vue

@@ -3,68 +3,72 @@
         <div class="screen-content">
             <el-row>
                 <el-col :span="8">
-                    <module-one-1-1 label="现场管理标准化" style="position: relative;">
+                    <module-one-1-1 :label="label1" style="position: relative;">
-                        <imageItem :images="list1" v-if="list1.length>0 && !loading"></imageItem>
+                        <enginChart ref="chart1" :height="300"></enginChart>
-                        <div v-if="list1.length==0 && !loading" style="text-align: center;margin-top: 40px;">
-                            <img src="images/nodata.png" style="width: 240px;">
-                            <div style="text-align: center;">暂无数据</div>
-                        </div>
                     </module-one-1-1>
-                    <module-one-1-1 label="作业标准" style="position: relative;">
+                    <module-one-2-1 label="作业标准" style="position: relative;">
-                        <imageItem :images="list2" v-if="list2.length>0 && !loading"></imageItem>
+                        <div class="scroll" style="max-height: 580px;overflow-y: auto;margin-top: 20px;">
-                        <div v-if="list2.length==0 && !loading" style="text-align: center;margin-top: 40px;">
+                            <table class="tb-list1">
-                            <img src="images/nodata.png" style="width: 240px;">
+                                <tr>
-                            <div style="text-align: center;">暂无数据</div>
+                                    <th>排名</th>
+                                    <th>项目名称</th>
+                                    <th>上传数量</th>
+                                    <th>上传占比</th>
+                                </tr>
+                                <tr v-for="(it, idx) in list1" :key="idx">
+                                    <td>{{ it.no }}</td>
+                                    <td>{{ it.name }}</td>
+                                    <td>{{ it.value }}</td>
+                                    <td>{{ it.percent }}%</td>
+                                </tr>
+                            </table>
                         </div>
-                    </module-one-1-1>
+                    </module-one-2-1>
-                    <module-one-1-1 label="安全技术标准" style="position: relative;">
-                        <imageItem :images="list3" v-if="list3.length>0 && !loading"></imageItem>
-                        <div v-if="list3.length==0 && !loading" style="text-align: center;margin-top: 40px;">
-                            <img src="images/nodata.png" style="width: 240px;">
-                            <div style="text-align: center;">暂无数据</div>
-                        </div>
-                    </module-one-1-1>
                 </el-col>
                 <el-col :span="8">
-                    <module-one-1-1 label="审批进度" :border="1"  style="position: relative;">
+                    <module-one-1-1 :label="lablel3" :border="1" style="position: relative;">
-                        <img src="images/icon2001.png" style="position: absolute;cursor: pointer;right: 20px;top: 32px;z-index: 9;" @click="doStateDlg">
+                        <img src="images/icon2001.png"
+                            style="position: absolute;cursor: pointer;right: 20px;top: 32px;z-index: 9;"
+                            @click="doStateDlg">
                         <chart-bar :height="280" :optData="chart1Data" :fn="changeChart1" :key="elChart2"></chart-bar>
                     </module-one-1-1>
-                    <module-one-1-1 label="待审批" :border="1" class="chart2" style="position: relative;">
+                    <module-one-1-1 label="项目审批排名" :border="1" class="chart2" style="position: relative;">
-                        <img src="images/icon2001.png" style="position: absolute;cursor: pointer;right: 20px;top: 32px;z-index:9;" @click="doUnitDlg">
+                        <div class="scroll" style="margin-top: 30px;max-height: 240px;overflow-y: auto;">
-                        <project-overview-chart :key="elChart2" :fn="changeChart2" :sp="'\n'" :maintitle="flowTotal" :legend-opt="legendOpt2"
+                            <table class="tb-list1">
-                                :typedata="chart2Data" :text="flowTitle" :height="280"
+                                <tr>
-                                txtTop="52" gifTop="90px"     style="top:0px"></project-overview-chart>
+                                    <th>排名</th>
+                                    <th>申请项目</th>
+                                    <th>申请数量</th>
+                                    <th>申请占比</th>
+                                </tr>
+                                <tr v-for="(it, idx) in list1" :key="idx">
+                                    <td>{{ it.no }}</td>
+                                    <td>{{ it.name }}</td>
+                                    <td>{{ it.value }}</td>
+                                    <td>{{ it.percent }}%</td>
+                                </tr>
+                            </table>
+                        </div>
                     </module-one-1-1>
                     <module-one-1-1 label="集团期刊" style="position: relative;">
-                        <imageItem :images="periodicalList" v-if="periodicalList.length>0 && !loading" mode="periodical"></imageItem>
+                        <imageItem :images="periodicalList" v-if="periodicalList.length > 0 && !loading" mode="periodical">
-                        <div v-if="periodicalList.length==0 && !loading" style="text-align: center;margin-top: 40px;">
+                        </imageItem>
+                        <div v-if="periodicalList.length == 0 && !loading" style="text-align: center;margin-top: 40px;"
+                            :key="elList4">
                             <img src="images/nodata.png" style="width: 240px;">
                             <div style="text-align: center;">暂无数据</div>
                         </div>
                     </module-one-1-1>
                 </el-col>
                 <el-col :span="8">
-                    <module-one-1-1 label="设备管理标准"  style="position: relative;">
+                    <module-one-1-1 :label="label6" style="position: relative;">
-                        <imageItem :images="list4" v-if="list4.length>0 && !loading"></imageItem>
+                        <enginChart ref="chart3" :height="300"></enginChart>
-                        <div v-if="list4.length==0 && !loading" style="text-align: center;margin-top: 40px;">
-                            <img src="images/nodata.png" style="width: 240px;">
-                            <div style="text-align: center;">暂无数据</div>
-                        </div>
                     </module-one-1-1>
-                    <module-one-1-1 label="文明施工标准"  style="position: relative;">
+                    <module-one-1-1 :label="label7" style="position: relative;">
-                        <imageItem :images="list5" v-if="list5.length>0 && !loading"></imageItem>
+                        <enginChart ref="chart4" :height="300"></enginChart>
-                        <div v-if="list5.length==0 && !loading" style="text-align: center;margin-top: 40px;">
-                            <img src="images/nodata.png" style="width: 240px;">
-                            <div style="text-align: center;">暂无数据</div>
-                        </div>
                     </module-one-1-1>
-                    <module-one-1-1 label="环境保护标准"  style="position: relative;">
+                    <module-one-1-1 :label="label8" style="position: relative;">
-                        <imageItem :images="list6" v-if="list6.length>0 && !loading"></imageItem>
+                        <enginChart ref="chart5" :height="300"></enginChart>
-                        <div v-if="list6.length==0 && !loading" style="text-align: center;margin-top: 40px;">
-                            <img src="images/nodata.png" style="width: 240px;">
-                            <div style="text-align: center;">暂无数据</div>
-                        </div>
                     </module-one-1-1>
                 </el-col>
             </el-row>
@@ -76,6 +80,7 @@
 
 <script>
 import '../components/module/module-one-1-2'
+import '../components/module/module-one-2-1'
 import '../components/staff-survey-chart'
 import '../components/chart-bar'
 import BorderBox6 from './components/BorderBox6.vue'
@@ -83,60 +88,42 @@ import debounce from 'lodash.debounce'
 import imageItem from './engin/enginImageItems.vue'
 import unitDialog from './engin/flowDetailByUnitDialog.vue'
 import stateDialog from './engin/flowDetailByStateDialog.vue'
+import enginChart from './engin/enginChart.vue'
+import { tryToJson } from '@/utils/tools'
 export default {
     name: 'JhbigscreenProjectEngin',
     components: {
         BorderBox6,
-        imageItem,unitDialog,stateDialog
+        imageItem, unitDialog, stateDialog, enginChart
     },
     data() {
         return {
-            elChart2:0,
+            label1: '项目标准化管理',
-            loading:true,
+            lablel3: '审批进度',
-            index1:0,
+            label6: '审批总数',
-            index2:0,
+            label7: '已完成审批',
-            index3:0,
+            label8: '待审批',
-            index4:0,
+            elChart2: 0,
-            index5:0,
+            elChart3: 0,
-            index6:0,
+            elList4: 0,
-            list1:[],
+            loading: true,
-            list2:[],
+            index1: 0,
-            list3:[],
+            index2: 0,
-            list4:[],
+            index3: 0,
-            list5:[],
+            index4: 0,
-            list6:[],
+            index5: 0,
-            chart1Data:[],
+            index6: 0,
-            chart2Data:[],
+            list1: [],
-            legendOpt2:{
+            list2: [],
-                icon: "rect",
+            list3: [],
-                orient: "vertical",
+            list4: [],
-                left: '70%',
+            list5: [],
-                top: '0',
+            list6: [],
-                itemGap: 10,
+            chart1Data: [],
-                itemWidth:20,
+            chart2Data: [],
-                itemHeight:40,
+            flowTitle: '待审批',
-                textStyle: {
+            flowTotal: 0,
-                    fontSize: 14,
+            periodicalList: []
-                    rich: {
-                        name: {
-                            color: "#c3dbfd",
-                            padding: [0, 2, 10, 2],
-                        },
-                        value: {
-                            color: "#ffffff",
-                            fontSize: 16,
-                        },
-                        percent: {
-                            color: "#4676FD",
-                            fontSize: 16,
-                            padding: [0, 2, 0, 2],
-                        },
-                    },
-                }          
-            },
-            flowTitle:'待审批',
-            flowTotal:0,
-            periodicalList:[]
         };
     },
 
@@ -144,64 +131,70 @@ export default {
         this.$bus.$on("loadProjects", debounce(prjs => {
             this.prjs = prjs;
         }));
-        this.$bus.$on("projectChange",debounce(res => {
+        this.$bus.$on("projectChange", debounce(res => {
             this.project = res;
             this.loadData();
         }));
-        this.$bus.$on("deptChange",debounce(dept => {
+        this.$bus.$on("deptChange", debounce(dept => {
             this.dept = dept;
             this.loadData();
         }));
         this.loadPeriodical();
-        if(this.$root.hasInitHeader){
+        if (this.$root.hasInitHeader) {
             this.initMe();
         }
     },
 
     methods: {
-        initMe(){
+        initMe() {
-            this.project=this.$root.project||{};
+            this.project = this.$root.project || {};
-            this.dept=this.$root.dept||{};
+            this.dept = this.$root.dept || {};
-            this.prjs=this.$root.projects||[];
+            this.prjs = this.$root.projects || [];
             this.loadData();
         },
-        doStateDlg(){
+        doStateDlg() {
             this.$refs.stateDlg.showDialog({
-                deptId:this.dept?.id||0,
+                deptId: this.dept?.id || 0,
-                projectId:this.project?.id||0
+                projectId: this.project?.id || 0
             });
         },
-        doUnitDlg(){
+        doUnitDlg() {
             this.$refs.unitDlg.showDialog({
-                deptId:this.dept?.id||0,
+                deptId: this.dept?.id || 0,
-                projectId:this.project?.id||0
+                projectId: this.project?.id || 0
             });
         },
-        loadPeriodical(){
+        loadPeriodical() {
-            this.$api.periodical.getList().then(d=>{
+            this.$api.periodical.getList().then(d => {
-               this.periodicalList=(d.data||[]).map(it=>{
+                this.periodicalList = (d.data || []).map(it => {
-                    it.fileUrl=JSON.parse(it.fileUrl);
+                    it.fileUrl = JSON.parse(it.fileUrl);
-                    it.imageFile=it.imageUrl;
+                    it.imageFile = it.imageUrl;
-                    it.standardDesc=it.name;
+                    it.standardDesc = it.name;
                     return it;
                 })
             });
         },
-        changeChart1(opt){            
+        changeChart1(opt) {
+            opt.legend = {
+                textStyle: {
+                    color: "#fff"
+                }
+            };
             return opt;
         },
-        changeChart2(opt){
+        changeChart2(opt) {
-            opt.title.left=135;
+            opt.title.left = 135;
-            opt.title.top=20;
+            opt.title.top = 20;
-            opt.series[0].center=["40%","50%"];
+            opt.legend = {};
-            opt.series[1].center=["40%","50%"];
+            opt.series[0].center = ["40%", "50%"];
+            opt.series[1].center = ["40%", "50%"];
             return opt;
         },
         getProjectId(cb) {
             let func = () => {
-                let prjId = this.project?.id||0;
+                let prjId = this.project?.id || 0;
                 if (prjId == 0) {
-                    if (!this.prjs||this.prjs.length == 0) {
+                    if (!this.prjs || this.prjs.length == 0) {
                         setTimeout(func, 100);
                     } else {
                         cb && cb(this.prjs[1].id);
@@ -212,66 +205,324 @@ export default {
             }
             func();
         },
-        addBr(s){
+        addBr(s) {
-            let out="";
+            let out = "";
-            for(let i=0;i<s.length;i++){
+            for (let i = 0; i < s.length; i++) {
-                out+=s.charAt(i);
+                out += s.charAt(i);
-                if((i+1)%3==0 && i<s.length-2){
+                if ((i + 1) % 3 == 0 && i < s.length - 2) {
-                    out+="\n";
+                    out += "\n";
                 }
             }
             return out;
         },
-        loadData(){
+        showChart1(data) {
-            this.getProjectId(id => {
+            let tmps = data.data || [];
-                let ajaxs=[
+            let datas = tmps.map(d => (d.status || 0) * 1);
-                    this.$api.standard.getList(id,this.dept?.id||0),
+            let sum = 0;
-                    this.$api.flow.groupByCategory(this.project?.id||0,this.dept?.id||0),
+            datas.forEach(d => {
-                    this.$api.flow.groupByUnit(this.project?.id||0,this.dept?.id||0),
+                sum += d;
-                ];
-                this.$api.http.all(ajaxs).then(res=>{                    
-                   let d=res[0];
-                   let tmps=d.data||[];
-                   this.list1=tmps.filter(it=>it.standardType==1);
-                   this.list2=tmps.filter(it=>it.standardType==2);
-                   this.list3=tmps.filter(it=>it.standardType==3);
-                   this.list4=tmps.filter(it=>it.standardType==4);
-                   this.list5=tmps.filter(it=>it.standardType==5);
-                   this.list6=tmps.filter(it=>it.standardType==6);
-                   this.loading=false;
-                   let chartData=[ ['分类', '总计', '审批中', '已完成']];
-                   this.chartInfo=[];
-                   (res[1].data||[]).forEach(it=>{
-                    let o= {
-                        title:it.taskName,
-                        comp:it.assigneeId||0,
-                        uncomp:it.procDefVersion||0,
-                        total:0
-                    }                  
-                    o.total=o.comp+o.uncomp;
-                    chartData.push([this.addBr(o.title),o.total,o.uncomp,o.comp])
-                   })
-                   this.chart1Data=chartData;
-                   let tmps2=[{title:'总包单位',count:0},
-                    {title:'监理单位',count:0},
-                    {title:'设计单位',count:0},
-                    {title:'甲方代表',count:0},
-                    {title:'子公司',count:0},
-                   ];
-                   let objs=res[2].data||[];
-                   this.flowTotal=0;
-                   tmps2.forEach(it=>{
-                    let o=objs.find(item=>it.title==item.taskName);
-                    if(o){
-                        it.count=o.assigneeId
-                        this.flowTotal+=o.assigneeId;
-                    }
-                    it.name=it.title;
-                    it.value=it.count;
             });
-                   this.chart2Data=tmps2;
+            this.label1 = `项目标准化管理(${sum})`
-                   
+            let lbls = tmps.map(d => d.dictLabel);
+            let opt = {
+                xAxis: {
+                    type: 'category',
+                    boundaryGap: false,
+                    data: lbls,
+                    axisLabel: {
+                        show: true,
+                        interval: 0,
+                        color: "#fff"
+                    }
+                },
+                yAxis: {
+                    type: 'value'
+                },
+                series: [
+                    {
+                        data: datas,
+                        type: 'line',
+                        smooth: true,
+                        areaStyle: {
+                            color: "rgba(58, 145, 227, 0.68)"
+                        }
+                    }
+                ]
+            }
+            this.$refs.chart1.init(opt);
+        },
+        showList1(res) {
+            let tmps = (res.data || []).map((d, i) => {
+                return {
+                    id: d.projectId,
+                    no: i + 1,
+                    name: d.standardDesc,
+                    value: d.deptId || 0,
+                    percent: 0,
+                }
+            });
+            let sum = 0;
+            tmps.forEach(d => {
+                sum += d.value;
+            });
+            if (sum > 0) {
+                tmps.forEach(d => {
+                    d.percent = (d.value * 100.0 / sum).toFixed(2);
+                });
+            }
+            let objs = [];
+            let prjIds = this.prjs.map(d => d.id).filter(d => d > 0);
+            tmps.forEach(d => {
+                if (prjIds.indexOf(d.id) >= 0) {
+                    objs.push(d);
+                }
+            })
+            if (this.project?.id != 0) {
+                let out = objs.filter(d => d.id == this.project.id);
+                if (out.length == 0) {
+                    this.list1 = [{ id: this.project.id, name: this.project.projectName, value: 0, percent: 0, no: '-' }];
+                } else {
+                    this.list1 = out;
+                }
+            } else {
+                this.list1 = objs;
+            }
+        },
+        showChart2(res) {
+            let chartData = [['分类', '总计', '审批中', '已完成']];
+            this.chartInfo = [];
+            let sum = 0;
+            (res.data || []).forEach(it => {
+                let o = {
+                    title: it.taskName,
+                    comp: it.assigneeId || 0,
+                    uncomp: it.procDefVersion || 0,
+                    total: 0
+                }
+                o.total = o.comp + o.uncomp;
+                sum += o.total;
+                chartData.push([this.addBr(o.title), o.total, o.uncomp, o.comp])
+            })
+            this.chart1Data = chartData;
+            this.lablel3 = `审批进度 (${sum})`;
             this.elChart2++;
+        },
+        showList2(res) {
+            let tmps = (res.data || []).map((it, idx) => {
+                return {
+                    no: idx + 1,
+                    id: it.businessKey,
+                    name: it.businessKeyName,
+                    value: it.duration * 1,
+                    percent: 0
+                }
+            });
+            let sum = 0;
+            tmps.forEach(d => {
+                sum += d.value;
+            });
+            if (sum > 0) {
+                tmps.forEach(d => {
+                    d.percent = (d.value * 100.0 / sum).toFixed(2);
+                });
+            }
+            let objs = [];
+            let prjIds = this.prjs.map(d => d.id).filter(d => d > 0);
+            tmps.forEach(d => {
+                if (prjIds.indexOf(d.id) >= 0) {
+                    objs.push(d);
+                }
+            })
+            if (this.project?.id != 0) {
+                let out = objs.filter(d => d.id == this.project.id);
+                if (out.length == 0) {
+                    this.list2 = [{ id: this.project.id, name: this.project.projectName, value: 0, percent: 0, no: '-' }];
+                } else {
+                    this.list2 = out;
+                }
+            } else {
+                this.list2 = objs;
+            }
+        },
+        showList3(res) {
+            this.periodicalList = (res.data || []).map(it => {
+                it.fileUrl = JSON.parse(it.fileUrl);
+                it.imageFile = it.imageUrl;
+                it.standardDesc = it.name;
+                return it;
+            })
+            this.elList4++;
+        },
+        showChart3(res) {
+            let tmps = (res.data || []).map(d => {
+                return {
+                    name: d.taskName,
+                    value: (d.assigneeId || 0) * 1
+                }
+            })
+            let sum = 0;
+            tmps.forEach(it => {
+                sum += it.value;
+            })
+            let opt = {
+                tooltip: {
+                    trigger: 'item'
+                },
+                legend: {
+                    orient: 'vertical',
+                    left: 'right',
+                    top: 'middle',
+                    textStyle: {
+                        color: "#fff"
+                    }
+                },
+                series: [
+                    {
+
+                        type: 'pie',
+                        radius: '50%',
+                        data: tmps,
+                        label: {
+                            color: "#fff"
+                        }
+
+                    }
+                ]
+            };
+            this.label6 = `审批总数 (${sum})`
+            this.$refs.chart3.init(opt);
+        },
+        showChart4(res) {
+            let tmps = (res.data || []).map(d => {
+                return {
+                    name: d.taskName,
+                    value: (d.assigneeId || 0) * 1
+                }
+            })
+            let sum = 0;
+            tmps.forEach(it => {
+                sum += it.value;
+            })
+            this.label7 = `已完成审批 (${sum})`
+            let opt = {
+                tooltip: {
+                    trigger: 'axis',
+                    axisPointer: {
+                        type: 'shadow'
+                    }
+                },
+                color: ['#409eff'],
+                xAxis: {
+                    type: 'category',
+                    data: tmps.map(d => d.name),
+                    axisLabel: {
+                        color: "#fff"
+                    }
+                },
+                yAxis: {
+                    type: 'value',
+                    axisLabel: {
+                        color: "#fff"
+                    }
+                },
+                series: [
+                    {
+                        data: tmps.map(d => d.value),
+                        type: 'bar'
+
+                    }
+                ]
+            };
+            this.$refs.chart4.init(opt);
+        },
+        showChart5(res) {
+            let tmps = (res.data || []).map(d => {
+                return {
+                    name: d.taskName,
+                    value: (d.assigneeId || 0) * 1,
+                    max: 0
+                }
+            })
+            let sum = 0;
+            let max = 10;
+            tmps.forEach(it => {
+                sum += it.value;
+                if (it.value > max) {
+                    max = it.value;
+                }
+            })
+            max = (max / 5 + 1) * 5;
+            tmps.forEach(it => {
+                it.max = max;
+            });
+            this.label8 = `待审批 (${sum})`
+            let opt = {
+                radar: {
+                    indicator: tmps,
+                },
+                series: [
+                    {
+                        type: 'radar',                       
+                        data: [
+                            {
+                                value: tmps.map(d=>d.max-5),
+                                symbol: 'rect',
+                                symbolSize: 12,
+                                lineStyle: {
+                                    type: 'dashed'
+                                },
+                                label: {
+                                    show: true,
+                                    color:"#409eff"
+                                }
+                            },
+                            {
+                                value:  tmps.map(d=>d.value),
+                                label: {
+                                    show: true,
+                                    color:"#fff"
+                                },
+                                areaStyle: {
+                                    color: new echarts.graphic.RadialGradient(0.1, 0.6, 1, [
+                                        {
+                                            color: 'rgba(255, 145, 124, 0.1)',
+                                            offset: 0
+                                        },
+                                        {
+                                            color: 'rgba(255, 145, 124, 0.9)',
+                                            offset: 1
+                                        }
+                                    ])
+                                }
+                            }
+                        ]
+                    }
+                ]
+            };
+            this.$refs.chart5.init(opt);
+        },
+        loadData() {
+            this.getProjectId(id => {
+                let ajaxs = [
+                    this.$api.standard.groupByType({ projectId: this.project?.id || 0, deptId: this.dept?.id || 0 }),
+                    this.$api.standard.groupByProject(),
+                    this.$api.flow.groupByCategory(this.project?.id || 0, this.dept?.id || 0),
+                    this.$api.flow.groupByProject(),
+                    this.$api.periodical.getList(),
+                    this.$api.flow.groupByUnitTotal(this.project?.id || 0, this.dept?.id || 0),
+                    this.$api.flow.groupByUnitFinish(this.project?.id || 0, this.dept?.id || 0),
+                    this.$api.flow.groupByUnit(this.project?.id || 0, this.dept?.id || 0),
+                ];
+                this.$api.http.all(ajaxs).then(res => {
+                    this.showChart1(res[0]);
+                    this.showList1(res[1]);
+                    this.showChart2(res[2]);
+                    this.showList2(res[3]);
+                    this.showList3(res[4]);
+                    this.showChart3(res[5]);
+                    this.showChart4(res[6]);
+                    this.showChart5(res[7]);
+                    this.loading = false;
                 });
             });
         },
@@ -286,14 +537,35 @@ export default {
 </script>
 
 <style lang="less" scoped>
-.project-engin-index{
+.project-engin-index {
-    /deep/ .border-1{
+    /deep/ .border-1 {
-        padding-left:0px;
+        padding-left: 0px;
     }
-    .chart2{
+
-        /deep/ .chart-gif{
+    .chart2 {
-            top:89px;
+        /deep/ .chart-gif {
-            left:196px;
+            top: 89px;
+            left: 196px;
+        }
+    }
+
+    .tb-list1 {
+        margin: 12px;
+        width: calc(100% - 24px);
+        border-collapse: collapse;
+        border: solid 1px #ffffff52;
+
+        th {
+            font-size: 14px;
+            border: solid 1px #ffffff52;
+            line-height: 60px;
+        }
+
+        td {
+            font-size: 12px;
+            text-align: center;
+            border: solid 1px #ffffff52;
+            line-height: 40px;
         }
     }
 }

src/pages/projectQuality.vue

@@ -272,6 +272,7 @@ export default {
                     itemWidth:50,                    
                     textStyle: {
                         fontSize: 14,
+                        color: "#c3dbfd",
                         rich: {
                             name: {
                                 color: "#c3dbfd",

src/router/index.js

@@ -46,6 +46,11 @@ const routes = [
     path: '/engin',
     name: 'engin',
     component: () => import(/* webpackChunkName: "video" */ '../pages/projectEngin.vue')
+  }, 
+  {
+    path: '/photography',
+    name: 'photography',
+    component: () => import(/* webpackChunkName: "video" */ '../pages/photography.vue')
   }
 ]
 const router = new VueRouter({