模块添加

src/layout/components/Header/index.vue

@@ -464,7 +464,7 @@ export default class Header extends Vue {
   }
 
   .right-menu {
-    width: 10%;
+    // width: 10%;
     height: 100%;
     display: flex;
     align-items: center;

src/utils/constant.ts

@@ -1,4 +1,4 @@
-export const gisNames = ['xjxt', 'whxt', 'monitor', 'psjc', 'psxc']
+export const gisNames = ['xjxt', 'whxt', 'monitor', 'psjc', 'psxc','jcgn']
 
 export const pageSizes = [10, 20, 30, 50, 100, 1000]
 

src/views/widgets/PersonWorkbench/dailyBuild.vue

@@ -0,0 +1,171 @@
+<template>
+    <div class="chart-containter-right-bottom" id='chart-containter-right-bottom'></div>
+</template>
+
+<script>
+import * as echarts from "echarts";
+export default {
+    name:"dailyBuild",//每日施工部件个数与扫码次数分析图表
+    props:{
+        data:{
+            type:Object,
+            required:true
+        },
+    },
+    created(){
+        this.showChartDailyBuild(this.data)
+    },
+    methods:{
+        showChartDailyBuild(result){
+            if(!result.dailyScansAndParts) return
+            this.sgts=this.setNullAndUndefinedEmpty(result.dailyScansAndParts.builtTime);
+            this.smgj=this.setNullAndUndefinedEmpty(result.dailyScansAndParts.scanTotal);
+            this.sgsm=this.setNullAndUndefinedEmpty(result.dailyScansAndParts.conScans);
+            this.jlsm=this.setNullAndUndefinedEmpty(result.dailyScansAndParts.spvScans);
+            this.sczp=this.setNullAndUndefinedEmpty(result.dailyScansAndParts.fileTotal);
+            this.sgsc=this.setNullAndUndefinedEmpty(result.dailyScansAndParts.conFiles);
+            this.jlsc=this.setNullAndUndefinedEmpty(result.dailyScansAndParts.spvFiles);
+            //图表显示
+            let res = [];let bj = [];let sm = [];let bjm=[];let smm=[];
+            result.dailyData.forEach(item => {
+                res.push(item.datestr);//日期
+                bj.push(item.partsCount);//部件个数
+                sm.push(item.scanCount);//扫码次数
+                //
+                bjm.push(item.partsCount);//部件个数
+                smm.push(item.scanCount);//扫码次数
+            });
+            bjm.sort(function (a, b) {
+                return a-b;
+            }); 
+            let bjmax = bjm[bjm.length - 1]; 
+            smm.sort(function (a, b) {
+                return a-b;
+            }); 
+            let smmax = smm[smm.length - 1]; 
+            let showmax=bjmax>smmax?bjmax+10:smmax+10;//双y轴刻度显示，取个数或者次数最大值，加10防止显示溢出
+            let dataInterval = showmax >100?50:10;
+            //图表配置
+            let colors = ['#648FD7', '#FFD143','#000000'];
+            let option = {
+                color: colors,
+                tooltip: {
+                    trigger: 'axis',
+                    axisPointer: {
+                        type: 'cross'
+                    }
+                },
+                legend: {
+                    data: ['部件个数', '扫码次数'],
+                    top:'5%'
+                },
+                xAxis: [
+                    {
+                        type: 'category',
+                        boundaryGap: true,
+                        data:res 
+                    }
+                ],
+                dataZoom: [{
+                    type: 'slider',
+                    show: true,
+                    xAxisIndex: [0],
+                    left: '9%',
+                    bottom: '5%',
+                    height: 20,//组件高度
+                    start: 0,
+                    end: 100 ,//初始化滚动条
+                }],
+                yAxis: [
+                    {
+                        type: 'value',
+                        name: '个数',
+                        min: 0,
+                        max: showmax,
+                        interval:dataInterval,
+                        position: 'left',
+                        axisLine: {
+                            show: true,
+                            lineStyle: {
+                                color: colors[2]
+                            }
+                        },
+                        axisLabel: {
+                            formatter: '{value}'
+                        },
+                        splitLine:{
+                            show:true
+                        }//横向分割线
+                    },
+                    {
+                        type: 'value',
+                        name: '次数',
+                        min: 0,
+                        max: showmax,
+                        interval:dataInterval,
+                        position: 'right',
+                        axisLine: {
+                            show: true,
+                            lineStyle: {
+                                color: colors[2]
+                            }
+                        },
+                        axisLabel: {
+                            formatter: '{value}'
+                        },
+                        splitLine:{
+                            show:true
+                        }//横向分割线
+                    },
+                ],
+                series: [
+                    {
+                        name: '部件个数',
+                        type: 'bar',
+                        // barWidth : 24,
+                        data: bj
+                    },
+                    {
+                        name: '扫码次数',
+                        type: 'line',
+                        yAxisIndex: 1,
+                        data: sm
+                    }
+                ]
+            };        
+            let gChart = echarts.init(document.getElementById('chart-containter-right-bottom'));
+            gChart.resize();
+            gChart.setOption(option,{
+                notMerge: true,
+            });
+            //图表大小自适应
+            window.addEventListener("resize", ()=>{
+                gChart.resize()
+            })
+        },
+        //数据检查公共方法(针对数字)
+        setNullAndUndefinedEmpty(input) {
+            if (input === "Null"||input === "null"||input === "NULL"||input === null || input === undefined || input === "") {
+                return 0
+            } else {
+                return input
+            }
+        },
+    },
+    watch:{
+        data:{
+            handler(n,o){
+                this.showChartDailyBuild(n)
+            },
+            deep:true// 深度监听父组件传过来对象变化
+        },
+    },
+}
+</script>
+
+<style lang="scss" scoped>
+    .chart-containter-right-bottom{
+        width: 100%;
+        height: 70%;
+    }
+</style>

src/views/widgets/PersonWorkbench/photoList.vue

@@ -0,0 +1,193 @@
+<template>
+    <el-row class="list">
+      <el-col :span="1" v-show="hasData">
+        <div class="imgbtn">
+          <el-button type="primary" :disabled="leftType" @click="handleLeft"  icon="el-icon-caret-left" circle></el-button>
+        </div>
+      </el-col>
+      <el-col :span="21" class="photoWall">
+        <div class="image-item" v-for="(item,index) of srcList" :key="index" v-show="hasData">
+        <el-image 
+            style="width: 128px; height: 80px;margin-right:5px"
+            :src="srcList[index].picurl" 
+            :preview-src-list="deconstruction(srcList,index)">
+        </el-image>
+        <div class="picName">{{srcList[index].info.name}}</div>
+        <div class="picCreateTime">{{srcList[index].info.createTime}}</div>
+        <div>{{getInfo(srcList[index].info)}}</div>
+        <div>{{srcList[index].info.pdName}}</div>
+        </div>
+        <div class='no-picture' :style="noDataStyle" v-show="!hasData"><span>暂无照片</span></div>
+      </el-col>
+      <el-col :span="1" v-show="hasData">
+        <div class="imgbtn" style="display:flex;justify-content: flex-end;">
+          <el-button type="primary" :disabled="rightType" @click="handleRight" icon="el-icon-caret-right" circle ></el-button>
+        </div>
+      </el-col>
+    </el-row>
+  
+</template>
+
+<script>
+export default {
+    name:"photoList",//照片列表
+    props:{
+        data:{
+            type:Object,
+            required:true
+        },
+    },
+    data() {
+      return {
+        noDataStyle:"background:url("+require("@/assets/icon/null.png")+") no-repeat 50%;",
+        hasData:false,
+        srcList:[],
+        dzplist: [], //待渲染照片数组
+        currentIndex: 0, // 要渲染的开始索引
+        leftType:true,
+        rightType:false,
+      }
+    },
+    created(){
+        this.getDataInfo(this.data)
+    },
+    methods:{
+        getDataInfo(data){
+            this.currentIndex=0;
+            this.getPictureUrl(data)
+        },
+        getPictureUrl(data){
+            this.listData=data.files
+            if (this.listData && this.listData.length > 0) {
+                this.hasData=true
+                this.dzplist=[];
+                this.srcList=[];
+                // 照片组
+                this.listData.forEach((item) => {
+                    let token="&access_token=29e2de53-0003-4ee0-a4d6-ba91d8bbd81e";
+                    const nodeINDEX=item.filePath.lastIndexOf('/');
+                    const newFilePath=item.filePath.slice(0,nodeINDEX)+"/thumbnail-"+item.filePath.slice(nodeINDEX+1);
+                    //原始图片
+                    let orgurl = "https://yeepms.yeec.com.cn/gis-api" + '/base/file/loadImg' + "?remotePath=" + item.filePath + token; 
+                    //缩略图片
+                    let picurl = "https://yeepms.yeec.com.cn/gis-api" + '/base/file/loadImg' + "?remotePath=" + newFilePath + token; 
+                    this.dzplist.push({orgurl:orgurl,picurl:picurl,info:item})
+                });
+                this.srcList = this.dzplist.slice(
+                    this.currentIndex,
+                    this.currentIndex + 10
+                );
+                if(this.dzplist.length<10){
+                    this.leftType=true;
+                    this.rightType=true;
+                }
+            }else{
+                this.hasData=false
+            }
+        },
+        deconstruction(data,index){
+            let temp=[]
+            data.forEach((item)=>{
+                temp.push(item.orgurl)
+            })
+            return temp.slice(index).concat(temp.slice(0,index))//构建一个以当前图片为起始的数组
+        },
+        getInfo(item){
+            const type = item.dataType.toUpperCase() == "CON" ?
+                "(施工)" : item.dataType.toUpperCase() == "SPV" ? "(监理)" : "";
+            const name = (item.realName ? item.realName : "无名") + type;
+            return name
+        },
+        handleLeft() {
+            if (this.currentIndex >= 10) {
+                this.currentIndex -= 10;
+                this.srcList = this.dzplist.slice(
+                    this.currentIndex,
+                    this.currentIndex + 10
+                );
+            }
+        },
+        handleRight() {
+            if (this.currentIndex < this.dzplist.length) {
+                this.currentIndex += 10;
+                this.srcList = this.dzplist.slice(
+                    this.currentIndex,
+                    this.currentIndex + 10
+                );
+            }
+        },
+    },
+    watch:{
+        data:{
+            handler(n,o){
+                this.getDataInfo(n)
+            },
+            deep:true// 深度监听父组件传过来对象变化
+        },
+        currentIndex:{
+            immediate:true,
+            handler(n,o){
+                if(n==0){
+                    this.leftType=true;
+                    this.rightType=false
+                }
+                if(n>0&&n<=this.dzplist.length){
+                    this.leftType=false;
+                    this.rightType=false;
+                    if(this.srcList.length<10){
+                        this.rightType=true;
+                    }
+                }
+                if(n>this.dzplist.length){
+                    this.leftType=false;
+                    this.rightType=true
+                }
+            },
+        }
+    },
+}
+</script>
+
+<style lang="scss" scoped>
+    .list{
+        height: 100%;
+        width: 100%;
+        display: flex;
+        justify-content: space-around;
+        align-items: center;
+    }
+    .image-item{
+        position: relative;
+        margin: 0 11px;
+        .picName{
+            position: absolute;
+            top: 0;
+            color: #fff;
+        }
+        .picCreateTime{
+            position: absolute;
+            bottom: 35px;
+            font-size: 13px;
+            color: #fff;
+            background-color: rgba(0,0,0,0.5);
+        }
+    }
+    .photoWall{
+        height: 100%;
+        width: 100%;
+        display: flex;
+        overflow: overlay;
+        align-items: center;
+    }
+    .no-picture {
+        width: 100%;
+        height: 90%;
+        display: flex;
+        justify-content: center;
+        align-items: flex-end;
+        span {
+            color: #909399;
+            font-size: 14px;
+        }
+    }
+</style>

src/views/widgets/PersonWorkbench/projectInfoTable.vue

@@ -0,0 +1,91 @@
+<template>
+        <el-table stripe
+        class="test-5" :data="tableData" border height="100%" style="width: 100%"  :header-cell-style="{ textAlign: 'center',background: '#ebeff4',color: 'rgba(0, 0, 0, 0.6)', }" :cell-style="{ textAlign: 'center' }">
+            <el-table-column :show-overflow-tooltip="true" prop="name" label="工程">
+            </el-table-column>
+            <el-table-column :show-overflow-tooltip="true" prop="designUnit" label="设计单位" >
+            </el-table-column>
+            <el-table-column :show-overflow-tooltip="true" prop="buildUnit" label="施工单位" >
+            </el-table-column>
+            <el-table-column :show-overflow-tooltip="true" prop="supervisionUnit" label="监理单位" >
+            </el-table-column>
+            <el-table-column :show-overflow-tooltip="true" prop="partsCounts" label="扫码部件占比" min-width="140">
+            </el-table-column>
+            <el-table-column prop="nodeCount" label="扫码管点占比" min-width="120">
+            </el-table-column>
+            <el-table-column prop="pipeCount" label="扫码管线占比" min-width="120">
+            </el-table-column>
+            <el-table-column prop="pipeLength" label="扫码管线长度占比" min-width="160">
+            </el-table-column>
+            <el-table-column prop="pictures" label="照片数量" min-width="120">
+            </el-table-column>
+        </el-table>
+</template>
+
+<script>
+export default {
+    name:"projectInfoTable",
+    props:{
+        projectType:{
+            type:String,
+            required:true
+        },
+        searchDate:{
+            type:Object,
+            required:true
+        },
+    },
+    data(){
+        return{
+            proType:this.projectType,
+            date:this.searchDate,
+            tableData:[]
+        }
+    },
+    created(){
+        this.getTableInfo()
+    },
+    methods:{
+        async getTableInfo(){
+            let data={
+                tjName:this.proType,
+                beginDate:this.date.startDate,
+                endDate:this.date.endDate
+            }
+            const res = await this.$PortApi.PersonWorkList_api(data);
+            const { code, result } = res.data;
+            if (code === 1) {
+                result.records.forEach(item => {
+                    item['partsCounts']=""+(item['partsCounts']/item['designTotalParts']).toFixed(2)+"%"+"("+item['partsCounts']+"个/"+item['designTotalParts']+"个)"+""
+                    item['nodeCount']=""+(item['nodeCount']/item['designNodePartsTotal']).toFixed(2)+"%"+"("+item['nodeCount']+"个/"+item['designNodePartsTotal']+"个)"+""
+                    item['pipeCount']=""+(item['pipeCount']/item['designPipePartsTotal']).toFixed(2)+"%"+"("+item['pipeCount']+"个/"+item['designPipePartsTotal']+"个)"+""
+                    item['pipeLength']=""+(item['pipeLength']/item['designLength']).toFixed(2)+"%"+"("+(item['pipeLength']/1000).toFixed(2)+"km/"+(item['designLength']/1000).toFixed(2)+"km)"+""
+                });
+                this.tableData = result.records;
+            } else {
+                this.$message.error("信息获取失败");
+            }
+        },
+    },
+    watch:{
+        projectType:{
+            handler(n,o){
+                this.proType=n;
+                this.getTableInfo()
+            },
+            deep:true// 深度监听父组件传过来对象变化
+        },
+        searchDate:{
+            handler(n,o){
+                this.date=n;
+                this.getTableInfo()
+            },
+            deep:true// 深度监听父组件传过来对象变化
+        },
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/views/widgets/PersonWorkbench/projectTree.vue

@@ -0,0 +1,94 @@
+<template>
+  <div>
+    <el-select ref='stlectTree' v-model="treeSelectText" placeholder="请选择项目(或输入搜索)" clearable filterable :filter-method="filterMethod" 
+    @clear="clearInput" size="mini">
+        <el-option :value="treeValue.id" :label="treeValue.label" style="height: auto;padding:0;">
+            <el-tree :data="datas"
+                :props="defaultProps"
+                :expand-on-click-node="false"
+                node-key="pbsTree"
+                highlight-current
+                @node-click="nodeClick"
+                :filter-node-method="filterNode"
+                ref="tree" 
+            />
+        </el-option>
+    </el-select>
+
+  </div>
+</template>
+
+<script>
+export default {
+    name:"projectTree",//显示工程树
+    data() {
+      return {
+        treeSelectText: '',
+		treeValue: {},
+        datas: [],
+        defaultProps: {
+            children: 'children',
+            label: 'name'
+        }
+      }
+    },
+    created(){
+        this.getPbsTree()
+    },
+    methods: {
+        async getPbsTree(){
+            const res = await this.$PortApi.pbsTreeList_api();
+            const { code, result } = res.data;
+            console.log(res.data)
+            if (code === 1) {
+                function formatTree (obj) {
+                    const copyedObj = JSON.parse(JSON.stringify(obj)); // 深拷贝源数据
+                    return copyedObj.filter((parent) => {
+                        const findChildren = copyedObj.filter(
+                            (child) => (parent.id === child.pid&&child.levelname!="分部工程（专业）")
+                        );
+                        findChildren.length > 0
+                            ? (parent.children = findChildren)
+                            : delete (parent.children = []);
+                        return parent.pid === null; // 返回顶层，依据实际情况判断这里的返回值
+                    });
+                }
+                this.datas=formatTree(result[0].structures);
+                console.log(this.datas)
+            } else {
+                this.$message.error("信息获取失败");
+            }
+        },
+        // 点击tree节点
+        nodeClick(item) {
+            const { id, name } = item
+            this.treeValue.id = id;
+            this.treeValue.label= name;
+            this.treeSelectText = name
+            this.$refs.stlectTree.blur()
+            //项目改变
+            let emitName=name
+            if(name=='岳阳水环境'){
+                emitName=''
+            }
+            this.$emit('changeProjectName',emitName)
+        },
+        // 搜索逻辑
+        filterMethod(value) {
+            this.$refs.tree.filter(value)
+        },
+        // tree节点过滤
+        filterNode(value, data) {
+            if (!value) return true
+            return data.name.indexOf(value) !== -1
+        },
+        clearInput(){
+            this.$refs.tree.filter("")
+            this.$emit('changeProjectName','')
+        }
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+</style>

src/views/widgets/PersonWorkbench/scanCodeRank.vue

@@ -0,0 +1,242 @@
+<template>
+    <div class="wrap">
+        <div class="frequencyContainer">
+            <div class="head-container">
+                <span class="span-bg"></span>
+                <span>扫码百分比排行榜</span>
+            </div>
+            <div class="frequencyRank">
+                <template v-if="partsCount.length>0">
+                    <div class='scanInfo' v-for="(item,index) of partsCount" :key="index">
+                            <div class='name-value'>
+                                <span class='name' :title="scanFrequency(item,scanData).title">{{scanFrequency(item,scanData).name}}</span>
+                            </div>
+                            <div class='bg-grey'>
+                                <div class='bg-violet' :style="{width:scanFrequency(item,scanData).width}">
+                                    <span class='value'>{{scanFrequency(item,scanData).percent}}%</span>
+                                </div>
+                            </div>
+                    </div>
+                </template>
+                <div v-else class='no-picture' :style="noDataStyle"><span>没有查询到数据</span></div>
+            </div>
+        </div>
+        <div class="numberContainer">
+            <div class="head-container">
+                <span class="span-bg"></span>
+                <span >管网设计排行榜</span>
+                <span class="gwsjphb">({{lengthNum.toFixed(2)+"km"+","+partsNum+"个"}})</span>
+            </div>
+            <div class="numberRank">
+                <template v-if="designRank.length>0">
+                    <div class='scanInfo' v-for="(item,index) of designRank" :key="index">
+                            <div class='name-value'>
+                                <span class='name' :title="designRankInfo(item).title">{{designRankInfo(item).designUnit}}</span>
+                            </div>
+                            <div class='bg-grey'>
+                                <div class='bg-violet' :style="{width:designRankInfo(item).width}">
+                                    <span class='value'>{{designRankInfo(item).pipeLength}}km</span>
+                                </div>
+                            </div>
+                    </div>
+                </template>
+                <div v-else class='no-picture' :style="noDataStyle"><span>没有查询到数据</span></div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    name:"scanCodeRank",//每日施工部件个数与扫码次数分析图表
+    props:{
+        data:{
+            type:Object,
+            required:true
+        },
+    },
+    data(){
+        return{
+            noDataStyle:"background:url("+require("@/assets/icon/null.png")+") no-repeat 50%;",
+            scanData:this.data,
+            partsCount:[],
+            designRank:[],
+            lengthNum:0,//设计管网总长度
+            partsNum:0,//部件总个数
+        }
+    },
+    created(){
+        this.showScanCodeRank()
+    },
+    methods:{
+        showScanCodeRank(){
+            this.lengthNum=0;
+            this.partsNum=0;
+            if(this.scanData.scan){
+                this.partsCount=this.scanData.scan.partsCount
+            }
+            if(this.scanData.designRank){
+                this.designRank=this.scanData.designRank
+                this.designRank.forEach(item => {
+                    this.lengthNum+=item.pipeLength
+                    this.partsNum+=item.totalNum
+                });
+            }
+        },
+        scanFrequency(item,data){
+            let type = item.dataType ?
+                item.dataType.toUpperCase() == "CON" ?
+                    "(施工)" : item.dataType.toUpperCase() == "SPV" ?
+                        "(监理)" : "" : "";
+            let scanPartsAll=data.builtCount.filter(e => e.name==="扫码部件")
+            let name = type + (item.unitname ? item.unitname : '无');
+            let width = (item.partsCount/scanPartsAll[0].numberBefore)*100 + '%';
+            let percent = ((item.partsCount/scanPartsAll[0].numberBefore)*100).toFixed(2)
+            let title = name+ "\n"+"部件总数:"+scanPartsAll[0].numberBefore+"个,"+"扫码个数:"+item.partsCount+"个"+"\n"+
+                     "扫码百分比:"+percent+"%"
+            return {name:name,width:width,title:title,percent:percent}
+        },
+        designRankInfo(item){
+            let designUnit=item.designUnit?item.designUnit:"无";
+            let pipeLength=item.pipeLength.toFixed(2);
+            let width = ((item.pipeLength/this.lengthNum)*100).toFixed(0) + '%';
+            let title="(设计)"+item.designUnit+"\n设计工程"+item.projectNum+"个，管网长度"+item.pipeLength.toFixed(2)+
+                    "km"+"\n"+"部件总个数"+item.totalNum+"个，管点"+item.nodeNum+"个，管线"+item.pipeNum+"个"
+            return {designUnit:designUnit,width:width,pipeLength:pipeLength,title:title}
+        }
+    },
+    watch:{
+        data:{
+            handler(n,o){
+                this.scanData=n
+                this.showScanCodeRank()
+            },
+            deep:true// 深度监听父组件传过来对象变化
+        },
+    },
+}
+</script>
+
+<style lang="scss" scoped>
+      .wrap{
+        height: 100%;
+        width: 100%;
+        display: flex;
+        flex-flow: column;
+        .head-container{
+            height: 5%;
+            width: 100%;
+            display: flex;
+            align-items: center;
+            white-space: nowrap;
+            text-overflow: ellipsis;
+            .span-bg{
+                width: 4px;
+                height: 18px;
+                background-color: #1066d0;
+                margin-right: 5px;
+            }
+        }
+        .frequencyContainer {
+            flex: 0.5;
+            width: 100%;
+            height: 50%;
+            .frequencyRank {
+                padding: 10px;
+                width: 95%;
+                height: 80%;
+                overflow: auto;
+                .scanInfo{
+                    width:100%;
+                    height:32px;
+                    margin-bottom:12px;
+                    .name-value{
+                        width:100%;
+                        height:16px;
+                        line-height:16px;
+                        margin-bottom:2px;
+                        .name{
+                            width: 90%;
+                            float: left;
+                            overflow: hidden;
+                            white-space: nowrap;
+                            text-overflow: ellipsis;
+                            cursor:pointer;
+                        }
+                    }
+                    .bg-grey{
+                        width:100%;
+                        height:16px;
+                        background:#E5E5E5;
+                        position: relative;
+                    }
+                    .bg-violet{
+                        width:30%;
+                        height:16px;
+                        background:#648FD7;
+                    }
+                    .value{
+                        position: absolute;
+                        right: 0;
+                    }
+                }
+            }
+        }
+        .numberContainer {
+            flex: 0.5;
+            width: 100%;
+            height: 50%;
+            .numberRank {
+                padding: 10px;
+                width: 95%;
+                height: 80%;
+                overflow: auto;
+                .scanInfo{
+                    width:100%;
+                    height:32px;
+                    margin-bottom:12px;
+                    .name-value{
+                        width:100%;
+                        height:16px;
+                        line-height:16px;
+                        margin-bottom:2px;
+                        .name{
+                            width: 90%;
+                            float: left;
+                            overflow: hidden;
+                            white-space: nowrap;
+                            text-overflow: ellipsis;
+                            cursor:pointer;
+                        }
+                    }
+                    .bg-grey{
+                        width:100%;
+                        height:16px;
+                        background:#E5E5E5;
+                        position: relative;
+                    }
+                    .bg-violet{
+                        width:30%;
+                        height:16px;
+                        background:#648FD7;
+                    }
+                    .value{
+                        position: absolute;
+                        right: 0;
+                    }
+                }
+            }
+        }
+        .no-picture {
+            width: 100%;
+            height: 90%;
+            display: flex;
+            justify-content: center;
+            align-items: flex-end;
+            span {
+                color: #909399;
+                font-size: 14px;
+            }
+        }
+      }
+</style>

src/views/widgets/PersonWorkbench/tubeStock.vue

@@ -0,0 +1,167 @@
+<template>
+<div class="chart-containter-left-bottom" id="chart-containter-left-bottom"></div>
+</template>
+
+<script>
+import * as echarts from "echarts";
+export default {
+    name:"tubeStock",//管材到货与使用情况对比分析图表
+    props:{
+        data:{
+            type:Object,
+            required:true
+        },
+    },
+    created(){
+        this.showChartTubeStock(this.data)
+    },
+    methods:{
+        showChartTubeStock(result){
+            if(!result.sharpDataCount) return
+            let gxsg=[];
+            let gcdh=[];
+            let gxsgArr=[];
+            let gcdhArr=[];
+            let gjcd=[];
+            result.sharpDataCount.forEach(item => {
+                gxsg.push(-item.buildTotal)//加负号是为了让其横向左侧显示
+                gcdh.push(item.deliverTotal)
+                gjcd.push(item.sharpdata?item.sharpdata:0)
+
+                gxsgArr.push(item.buildTotal)//加负号是为了让其横向左侧显示
+                gcdhArr.push(item.deliverTotal)
+            })
+            gxsgArr.sort(function (a, b) {
+                return a-b;
+            }); 
+            var gxsgmax = gxsgArr[gxsgArr.length - 1]; 
+            gcdhArr.sort(function (a, b) {
+                return a-b;
+            }); 
+            let gcdhmax = gcdhArr[gcdhArr.length - 1]; 
+            let showmax=gxsgmax>gcdhmax?Math.round(gxsgmax)+4:Math.round(gcdhmax)+4;//双y轴刻度显示，取个数或者次数最大值，加4防止显示溢出
+            let pjName=result.sumProjectName!==null?result.sumProjectName:"";
+            let option = {
+                tooltip: {
+                    trigger: 'axis',
+                    axisPointer: {            // 坐标轴指示器，坐标轴触发有效
+                        type: 'line'        // 默认为直线，可选为：'line' | 'shadow'
+                    },
+                    formatter: function (params) {
+                        var showHtm="";
+                        showHtm=
+                        "<span style='display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#4D92E6;'></span>"+
+                        "管线施工长度(公里):"+Math.abs(params[0].data).toFixed(3)+"<br>"+
+                        "<span style='display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#2bc3cc;'></span>"+
+                        "管材到货长度(公里):"+Math.abs(params[1].data).toFixed(3)+"";
+                        return showHtm;
+                    }
+                },
+                grid:{
+                    top:"20%",
+                    left:"10%",
+                    right:"10%",
+                    bottom:'10%'
+                },
+                legend: {
+                    data: ['管线施工长度(公里)', '管材到货长度(公里)'],
+                    formatter: function (name) {
+                        return name+" "+pjName;
+                    }
+                },
+                xAxis : [
+                    {
+                        type : 'value',
+                        axisLabel : { formatter: function (value){return Math.abs(value);}},//显示的数值都取绝对值
+                        min: -showmax,
+                        max: showmax,
+                        // interval:5,
+                        axisLine: {
+                        show: true
+                        },
+                    }
+                ],
+                yAxis: [
+                    {
+                        type: 'category',
+                        // name: '管径mm',
+                        axisTick: {
+                            show: false
+                        },
+                        position: 'left',
+                        data: gjcd
+                    },
+                    {
+                        type: 'category',
+                        name: '管径mm',
+                        axisTick: {
+                            show: false
+                        },
+                        position: 'right',
+                        data: gjcd
+                    }
+                ],
+                series: [
+                    {
+                        name: '管线施工长度(公里)',
+                        type: 'bar',
+                        stack: '总量',
+                        label: {
+                            show: true,
+                            position: 'left',
+                            formatter:function(v){
+                                let kms=Math.abs(v.data)
+                                return kms.toFixed(3)
+                            }//将数值显示为正
+                        },
+                        color:'#4D92E6',
+                        emphasis: {
+                            focus: 'series'
+                        },
+                        data: gxsg
+                    },
+                    {
+                        name: '管材到货长度(公里)',
+                        type: 'bar',
+                        stack: '总量',
+                        label: {
+                            show: true,
+                            position: 'right',
+                            formatter:function(v){return v.data.toFixed(3)}
+                        },
+                        color:'#2bc3cc',
+                        emphasis: {
+                            focus: 'series'
+                        },
+                        data: gcdh
+                    }   
+                ]
+            };
+            let gChart = echarts.init(document.getElementById('chart-containter-left-bottom'));
+            gChart.resize();
+            gChart.setOption(option,{
+                notMerge: true,
+            });
+            //图表大小自适应
+            window.addEventListener("resize", ()=>{
+                gChart.resize()
+            })
+        },
+    },
+    watch:{
+        data:{
+            handler(n,o){
+                this.showChartTubeStock(n)
+            },
+            deep:true// 深度监听父组件传过来对象变化
+        },
+    },
+}
+</script>
+
+<style lang="scss" scoped>
+    .chart-containter-left-bottom{
+        width: 100%;
+        height: 90%;
+    }
+</style>

src/views/widgets/PersonWorkbench/widget.vue

@@ -0,0 +1,949 @@
+<template>
+<div class="widget-PersonWorkbench">
+    <div class="head-info">
+      <div class="project-item">
+        <span class="projectInfo">{{projectName==''?"岳阳水环境":projectName}}施工情况综合信息展示{{titleDate}}</span>
+      </div>
+      <div class="condition-item">
+        <span>工程：</span>
+        <project-tree 
+        @changeProjectName="changeProjectName($event)"
+        />
+      </div>
+      <div class="condition-item">
+        <span>单位：</span>
+        <el-select v-model="unit" filterable placeholder="请选择单位（或输入搜索）" size="mini" clearable>
+          <el-option
+            v-for="item in unitOptions"
+            :key="item.id"
+            :label="item.label"
+            :value="item.value">
+          </el-option>
+        </el-select>
+      </div>
+      <div class="time-item">
+        <el-row style="display:flex;align-items:center">
+          <el-col :span="4">
+            <span>日期：</span>
+          </el-col>
+          <el-date-picker
+                v-model="value"
+                type="daterange"
+                align="right"
+                unlink-panels
+                range-separator="~"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+                :picker-options="pickerOptions"
+                size="mini">
+          </el-date-picker>
+        </el-row>
+      </div>
+      <!-- <div class="operation-item">
+          <el-button type="primary" size="mini">查询</el-button>
+          <el-button type="primary" size="mini">重置</el-button>
+      </div> -->
+    </div>
+    <div class="statistic-panel">
+        <div class="head-container">
+            <span class="span-bg"></span>
+            <span class='span-name'>施工统计</span>
+        </div>
+        <div class="statistic">
+        <div class="term term-project" >
+            <div class="chart-container sggcPercent" id='sggcPercent'>
+            </div>
+            <div class="sta">
+                <div class="num">{{workbenchProjectNum}}</div>
+                <div>施工工程</div>
+            </div>
+            <div class="tooltiptext">
+              <span>工程施工率：{{sgbfb}}%</span>
+              <div>{{termDate}}</div>
+              <div>共计{{sgzs}}个管网工程</div>
+              <div>施工工程{{sgs}}个</div>
+              <div>工程施工率{{sgbfb}}%</div>
+            </div>
+        </div>
+        <div class="term term-codeparamater">
+            <div class="chart-container smrsPercent" id='smrsPercent'>
+            </div>
+            <div class="sta">
+                <div class="num workbench-scancode-num">{{scanNum}}</div>
+                <div>扫码人数</div>
+            </div>
+            <div class="tooltiptext">
+              <span>用户系统使用率：{{smbfb}}%</span>
+              <div>{{termDate}}</div>
+              <div>已开通施工、监理账号{{smzs}}个</div>
+              <div>有{{sms}}个人上传过扫码数据</div>
+              <div>占比{{smbfb}}%</div>
+            </div>
+        </div>
+        <div class="term term-parts">
+            <div class="chart-container smbjPercent" id='smbjPercent'>
+            </div>
+            <div class="sta">
+                <div class="num workbench-scanprat-num">{{scanPartsNum}}</div>
+                <div>扫码部件</div>
+            </div>
+            <div class="tooltiptext">
+              <span>扫码百分比：{{smbjbfb}}%</span>
+              <div>{{termDate}}</div>
+              <div>设计管网部件共计{{smbjzs}}个</div>
+              <div>有{{smbjs}}个部件上传过扫码数据</div>
+              <div>占比{{smbjbfb}}%</div>
+            </div>
+        </div>
+        <div class="term term-pictures">
+            <div class="chart-container sjsgPercent" id='sjsgPercent'>
+            </div>
+            <div class="sta-bd">
+                <div class="bd-item">
+                    <span class="num workbench-sg-num">{{sgnum}}</span>
+                    <span>施工(公里)</span>
+                </div>
+                <div class="split-line"></div>
+                <div class="bd-item">
+                    <span class="num workbench-sj-num">{{sjnum}}</span>
+                    <span>设计(公里)</span>
+                </div>
+            </div>
+            <div class="tooltiptext">
+              <span>施工里程百分比：{{sjsgbfb}}%</span>
+              <div>{{termDate}}</div>
+              <div>设计管网长度共计{{sjsgzs}}公里</div>
+              <div>有{{sjsgs}}公里管网施工</div>
+              <div>占比{{sjsgbfb}}%</div>
+            </div>
+        </div>
+        <div class="term term-supplier">
+            <div class="chart-container gcPercent" id='gcPercent'>
+            </div>
+            <div class="sta">
+                <div>
+                    <span class="num workbench-suplier-num">{{suplierNUm}}</span>家
+                    <span class="num">/</span>
+                    <span class="num workbench-batch-num">{{batchNum}}</span>批次
+                </div>
+                <div>管材<span class="workbench-batch-length" style="font-weight: bold">{{lengthTotal}}</span>(公里)</div>
+            </div>
+            <div class="tooltiptext">
+              <span>管材供货使用率：{{ghbfb}}%</span>
+              <div>{{termDate}}</div>
+              <div>共计{{ghsj}}家材料商送货{{ghpc}}批次</div>
+              <div>共计{{ghzs}}公里管材</div>
+              <div>已施工{{ghs}}公里</div>
+              <div>则管材供货使用率为{{ghbfb}}%</div>
+            </div>
+        </div>
+        </div>
+    </div>
+    <div class="statistic-container">
+        <div class="chart-container">
+          <div class="head-container">
+              <span class="span-bg"></span>
+              <span class='span-name'>在建工程情况</span>
+              <el-tooltip class="span-chart" effect="dark" content="统计图表" placement="top">
+                  <img class="img" src="@/assets/icon/chart.png" @click="isChart=true">
+              </el-tooltip>
+              <el-tooltip class="span-list" effect="dark" content="信息表格" placement="top">
+                  <img class="img" src="@/assets/icon/list.png" @click="isChart=false"/>
+              </el-tooltip>
+              <el-radio-group class="span-radio" v-model="projectType" v-show="!isChart">
+                  <el-radio label="projectName">按工程</el-radio>
+                  <el-radio label="singleProject">按单项工程</el-radio>
+                  <el-radio label="unitName">按单位工程</el-radio>
+                  <el-radio label="childUnitName">按子单位工程</el-radio>
+              </el-radio-group>
+          </div>
+          <div class="content-container">
+              <div class="chartRegion" v-show="isChart">
+                  <div class="chart-containter-left-top"><span>管材到货与使用情况对比分析图</span></div>
+                  <tube-stock  :data="resultData" />
+              </div>
+              <div class="infoRegion" v-show="isChart">
+                  <div class="chart-containter-right-top">
+                      <div class='sginfoTitle'><span>每日施工部件个数与扫码次数分析图</span></div>
+                      <div class="sginfo">
+                          <div class="sginfo-left">
+                              <div class="sginfo-left-top"><span class="sgts">{{sgts}}</span><span class="sgtsdw">天</span></div>
+                              <div class="sginfo-left-bottom"><span>施工天数</span></div>
+                          </div>
+                          <div class="sginfo-right">
+                              <div class="sginfo-right-top">
+                                  <label>扫码共计:</label><span>{{smgj}}</span><label>次</label><span>其中施工单位:</span><span>{{sgsm}}</span><label>次</label><span>监理:</span><span>{{jlsm}}</span><label>次</label>
+                              </div>
+                              <div class="sginfo-right-bottom">
+                                  <label>上传照片:</label><span>{{sczp}}</span><label>次</label><span>其中施工单位:</span><span>{{sgsc}}</span><label>次</label><span>监理:</span><span>{{jlsc}}</span><label>次</label>
+                              </div>
+                          </div>
+                      </div>
+                  </div>
+                  <daily-build :data="resultData" />
+              </div>
+            <div v-show="!isChart" style="height:100%;width:98%">
+              <project-info-table :projectType="projectType" :searchDate="searchDate" />
+            </div>
+          </div>
+        </div>
+        <div class="rank-container">
+          <scan-code-rank :data="resultData" />
+        </div>
+    </div>
+    <div class="photo-container">
+      <photo-list :data="resultData" />
+    </div>
+</div>
+</template>
+<script>
+import * as echarts from "echarts";
+import tubeStock from "./tubeStock.vue"
+import dailyBuild from "./dailyBuild.vue"
+import scanCodeRank from "./scanCodeRank.vue"
+import photoList from "./photoList.vue"
+import projectInfoTable from './projectInfoTable.vue'
+import projectTree from './projectTree.vue'
+export default {
+  name:'PersonWorkbench',//个人工作台
+  components:{
+    tubeStock,
+    dailyBuild,
+    scanCodeRank,
+    photoList,
+    projectInfoTable,
+    projectTree
+  },
+  data(){
+    return{
+        //时间选择配置
+        pickerOptions: {
+          shortcuts: [
+          {
+            text: '今天',
+            onClick(picker) {
+              const end = new Date();
+              const start = new Date();
+              start.setTime(start.getTime());
+              picker.$emit('pick', [start, end]);
+            }
+          },{
+            text: '近7天',
+            onClick(picker) {
+              const end = new Date();
+              const start = new Date();
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
+              picker.$emit('pick', [start, end]);
+            }
+          }, {
+            text: '最近一个月',
+            onClick(picker) {
+              const end = new Date();
+              const start = new Date();
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+              picker.$emit('pick', [start, end]);
+            }
+          }, {
+            text: '本年',
+            onClick(picker) {
+              const end = new Date();
+              const start = new Date(new Date().getFullYear(), 0);
+              // start.setTime(start.getTime());
+              picker.$emit('pick', [start, end]);
+            }
+          }]
+        },
+        value:[],
+        //项目信息
+        projectName:'',
+        //单位信息
+        unitOptions: [],
+        unit: '',
+        //图表&&表格信息显示标识
+        isChart:true,
+        projectType:"projectName",//:label 绑定的是Boolean布尔类型或Integer整型数值;label 绑定的是String字符串类型
+        //施工统计显示参数
+        workbenchProjectNum:"0/0",
+        scanNum:"0/0",
+        scanPartsNum:"0/0",
+        sjnum:"0",
+        sgnum:"0", 
+        suplierNUm:"0",
+        batchNum:"0",
+        lengthTotal:"0",
+        //浮动提示内容
+        sgbfb:0,sgzs:0,sgs:0,
+        smbfb:0,smzs:0,sms:0,
+        smbjs:0,smbjzs:0,smbjbfb:0,
+        sjsgs:0,sjsgzs:0,sjsgbfb:0,
+        ghs:0,ghzs:0,ghbfb:0,ghsj:0,ghpc:0,
+        //每日施工部件个数与扫码次数信息
+        sgts:0,smgj:0,sgsm:0,jlsm:0,sczp:0,sgsc:0,jlsc:0,
+        //日期显示
+        dateShow:{
+          startDate:"",
+          endDate:""
+        },
+        searchDate:{
+          startDate:"",
+          endDate:""
+        },
+        //组件传值
+        resultData:{},
+    }
+  },
+  created(){
+    this.getStatistic();
+    this.getUnit();
+  },
+  methods:{
+    async getStatistic(){
+      let data = {
+            beginDate:this.searchDate.startDate,
+            endDate:this.searchDate.endDate,
+            projectName:this.projectName,
+            departmentName:this.unit,
+      }
+      const res = await this.$PortApi.PersonWorkOtherCount_api(data);
+      const { code, result } = res.data;
+      if (code === 1) {
+        console.log("统计结果",result)
+        this.showBuildingStatistic(result); //显示施工统计数据信息
+        this.showPercentageDisplay(result); //显示施工统计百分比信息
+        this.showDailyBuild(result);//显示具体施工信息
+        this.resultData=result;//管材到货与使用情况对比分析图表
+      } else {
+          this.$message.error("信息获取失败");
+      }
+    },
+    //获取单位
+    async getUnit(){
+      const res = await this.$PortApi.PohtopageFilterPrj_api({
+        size: 999,
+        current: 1,
+        prjId: 1,
+        departmentType:"CON,SPV,VEN"
+      });
+      const { code, result } = res.data;
+      if (code === 1) {
+        result.records.forEach(item => {
+          this.unitOptions.push({
+            value: item.name,
+            label: item.name
+          })
+        });
+      } else {
+          this.$message.error("信息获取失败");
+      }
+    },
+    //项目名称改变
+    changeProjectName(data){
+      this.projectName=data;
+      this.getStatistic()
+    },
+    //显示施工统计数据信息
+    showBuildingStatistic(param){
+      //施工工程
+      this.workbenchProjectNum=this.setNullAndUndefinedEmpty(param.builtCount[0].numberBefore)+"/"+this.setNullAndUndefinedEmpty(param.builtCount[0].numberAfter)
+      this.sgs=this.setNullAndUndefinedEmpty(param.builtCount[0].numberBefore);
+      this.sgzs=this.setNullAndUndefinedEmpty(param.builtCount[0].numberAfter);
+      this.sgbfb=this.computePercent(this.sgs,this.sgzs);
+      //扫码人数
+      this.scanNum=this.setNullAndUndefinedEmpty(param.builtCount[1].numberBefore)+"/"+this.setNullAndUndefinedEmpty(param.builtCount[1].numberAfter)
+      this.sms=this.setNullAndUndefinedEmpty(param.builtCount[1].numberBefore)
+      this.smzs=this.setNullAndUndefinedEmpty(param.builtCount[1].numberAfter)
+      this.smbfb=this.computePercent(this.sms,this.smzs);
+      //扫码部件
+      this.scanPartsNum=this.setNullAndUndefinedEmpty(param.builtCount[2].numberBefore)+"/"+this.setNullAndUndefinedEmpty(param.builtCount[2].numberAfter)
+      this.smbjs=this.setNullAndUndefinedEmpty(param.builtCount[2].numberBefore)
+      this.smbjzs=this.setNullAndUndefinedEmpty(param.builtCount[2].numberAfter)
+      this.smbjbfb=this.computePercent(this.smbjs,this.smbjzs)
+      //设计&&施工里程
+      this.sjnum=this.setNullAndUndefinedEmpty(param.builtCount[3].numberAfter).toFixed(0);
+      this.sgnum=this.setNullAndUndefinedEmpty(param.builtCount[3].numberBefore).toFixed(0);
+      this.sjsgs=this.setNullAndUndefinedEmpty(param.builtCount[3].numberBefore)
+      this.sjsgzs=this.setNullAndUndefinedEmpty(param.builtCount[3].numberAfter)
+      this.sjsgbfb=this.computePercent(this.sjsgs,this.sjsgzs)
+      //供货信息
+      this.suplierNUm=this.setNullAndUndefinedEmpty(param.materialSum.supplyVendor);
+      this.batchNum=this.setNullAndUndefinedEmpty(param.materialSum.supplyTimes);
+      this.lengthTotal= param.materialSum.lengthTotal ? param.materialSum.lengthTotal.toFixed(3) : 0;
+      this.ghs=param.materialSum.builtlength?param.materialSum.builtlength.toFixed(3):0;
+      this.ghzs=param.materialSum.lengthTotal?param.materialSum.lengthTotal.toFixed(3):0;
+      this.ghbfb=this.computePercent(this.ghs,this.ghzs)
+      this.ghsj=this.setNullAndUndefinedEmpty(param.materialSum.supplyVendor);
+      this.ghpc=this.setNullAndUndefinedEmpty(param.materialSum.supplyTimes);
+    },
+    showPercentageDisplay(param){
+        //施工工程百分比
+        this.indexPieChart(param.builtCount[0].numberBefore?param.builtCount[0].numberBefore:0,param.builtCount[0].numberAfter?(param.builtCount[0].numberAfter-param.builtCount[0].numberBefore):0,'sggcPercent')
+        //扫码人数百分比
+        this.indexPieChart(param.builtCount[1].numberBefore?param.builtCount[1].numberBefore:0,param.builtCount[1].numberAfter?(param.builtCount[1].numberAfter-param.builtCount[1].numberBefore):0,'smrsPercent')
+        //扫码部件百分比
+        this.indexPieChart(param.builtCount[2].numberBefore?param.builtCount[2].numberBefore:0,param.builtCount[2].numberAfter?(param.builtCount[2].numberAfter-param.builtCount[2].numberBefore):0,'smbjPercent')
+        //设计施工百分比
+        this.indexPieChart(param.builtCount[3].numberBefore?param.builtCount[3].numberBefore:0,param.builtCount[3].numberAfter?(param.builtCount[3].numberAfter-param.builtCount[3].numberBefore):0,'sjsgPercent')
+        //管材百分比
+        var realbuild;
+        var realtotal;
+        if(param.materialSum.builtlength&&param.materialSum.lengthTotal){
+            if(param.materialSum.lengthTotal===0||param.materialSum.lengthTotal===null){
+                realbuild=0;
+                realtotal=0;
+            }else{
+                realbuild=param.materialSum.builtlength;
+                realtotal=(param.materialSum.lengthTotal-param.materialSum.builtlength)
+            }
+        }else{
+                realbuild=0;
+                realtotal=0;
+        }
+        this.indexPieChart(realbuild,realtotal,'gcPercent')
+    },
+    /**
+     * 生产指标饼图
+     * @param part 实际数值
+     * @param total 总和数值
+     * @param domId 容器ID
+     */
+    indexPieChart(part,total,domId){
+        //数据为0时不填充
+        if (part===0||total===0) {
+            part=0;
+            total=100;
+        }
+        //图表配置
+        var option = {
+            color:['#FFFFFF','rgb(255,255,255,0.3)'],
+            series: [
+                {
+                    type: 'pie',
+                    radius: ['85%', '100%'],
+                    silent:true,
+                    label: {
+                        show: false,
+                        position: 'center',
+                        formatter: '{d}%',
+                        borderWidth:0,
+                        color:"#fff"
+                    },
+                    labelLine: {
+                        show: false
+                    },
+                    data: [
+                        {
+                            value: part,
+                            selected:true,     //默认选中第一块
+                            label:{
+                                    show:true,     //默认显示第一块
+                                    fontSize: '13',
+                                    fontWeight: 'bold'
+                            },
+                        },
+                        {
+                            value: total,
+                        }
+                    ]
+                }
+            ]
+        };
+        let indexChart = echarts.init(document.getElementById(domId));
+        indexChart.resize();
+        indexChart.setOption(option,{
+            notMerge: true,
+        });
+        //图表大小自适应
+        window.addEventListener("resize", ()=>{
+            indexChart.resize()
+        })
+    },
+    //具体施工信息显示
+    showDailyBuild(result){
+      this.sgts=this.setNullAndUndefinedEmpty(result.dailyScansAndParts.builtTime)
+      this.smgj=this.setNullAndUndefinedEmpty(result.dailyScansAndParts.scanTotal)
+      this.sgsm=this.setNullAndUndefinedEmpty(result.dailyScansAndParts.conScans)
+      this.jlsm=this.setNullAndUndefinedEmpty(result.dailyScansAndParts.spvScans)
+      this.sczp=this.setNullAndUndefinedEmpty(result.dailyScansAndParts.fileTotal)
+      this.sgsc=this.setNullAndUndefinedEmpty(result.dailyScansAndParts.conFiles)
+      this.jlsc=this.setNullAndUndefinedEmpty(result.dailyScansAndParts.spvFiles)
+    },
+    //百分比计算
+    computePercent(numerator,denominator){
+      if(denominator===0||denominator === "Null"||denominator === "null"||
+      denominator === "NULL"||denominator === null || denominator === undefined || denominator === "") return 0
+      return ((numerator/denominator)*100).toFixed(2)
+    },
+    //时间取0位
+    formatTen(num) { 
+		  return num > 9 ? (num + "") : ("0" + num); 
+	  }, 
+    //时间转换
+    timeConversion(date,isShow){
+      let time = new Date(date);
+      if(isShow){
+        //getMonth()的返回值是0-11也就是从0开始而不是从1开始。所以一般都需要加一个1 才能达到1-12月。否则就成了0-11月了
+        return time.getFullYear()+'年'+this.formatTen((time.getMonth()+1))+'月'+this.formatTen(time.getDate())+'日'
+      }else{
+        return time.getFullYear()+this.formatTen((time.getMonth()+1))+this.formatTen(time.getDate())
+      }
+    },
+    //数据检查公共方法(针对数字)
+    setNullAndUndefinedEmpty(input) {
+        if (input === "Null"||input === "null"||input === "NULL"||input === null || input === undefined || input === "") {
+            return 0
+        } else {
+            return input
+        }
+    },
+  },
+  computed:{
+    termDate(){
+      if(this.dateShow.startDate||this.dateShow.endDate){
+        return this.dateShow.startDate+'至'+this.dateShow.endDate
+      }else{
+        return ""
+      }
+    },
+    titleDate(){
+      if(this.dateShow.startDate||this.dateShow.endDate){
+        return ":"+this.dateShow.startDate+'-'+this.dateShow.endDate
+      }else{
+        return ""
+      }
+    }
+  },
+  watch:{
+    value:{
+      handler(n,o){
+        if(n){
+          this.dateShow.startDate=this.timeConversion(n[0],true)
+          this.dateShow.endDate=this.timeConversion(n[1],true)
+          this.searchDate.startDate=this.timeConversion(n[0],false)
+          this.searchDate.endDate=this.timeConversion(n[1],false)
+          this.getStatistic();
+        }else{
+          this.dateShow.startDate="";
+          this.dateShow.endDate="";
+          this.searchDate.startDate="";
+          this.searchDate.endDate="";
+          this.getStatistic();
+        }
+      }
+    },
+    unit:{
+      handler(n,o){
+        this.getStatistic()
+      }
+    },
+  }
+}
+</script>
+<style lang="scss" scoped>
+.widget-PersonWorkbench{
+  width: 100%;
+  height: 100%;
+  background: #f5f5f6 !important;
+  margin: 0;
+  padding: 0;
+  overflow: hidden;
+  font-family: Source Han Sans CN;
+  font-weight: 400;
+  position: relative;
+  .head-info{
+    margin: 10px 0 0 10px;
+    height: 3%;
+    width: 98%;
+    background: #fff;
+    border-radius: 6px;
+    padding: 6px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    .project-item{
+      flex: 0.4;
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+      .projectInfo{
+        font-size: 20px;
+        color: #000;
+      }
+    }
+    .condition-item{
+      font-size: 14px;
+      color: #000;
+      flex: 0.15;
+      white-space: nowrap;
+      display: flex;
+      align-items: center;
+    }
+    .time-item{
+      font-size: 14px;
+      flex: 0.18;
+    }
+    .line{
+      text-align: center;
+    }
+    .operation-item{
+      font-size: 14px;
+      flex: 0.1;
+      display: flex;
+      justify-content: flex-end;
+    }
+  }
+  .statistic-panel{
+    margin: 10px 0 0 10px;
+    height: 15%;
+    width: 98%;
+    background: #fff;
+    border-radius: 6px;
+    padding: 6px;
+    .head-container{
+      height: 20%;
+      width: 100%;
+      display: flex;
+      align-items: center;
+      .span-bg{
+        width: 4px;
+        height: 18px;
+        background-color: #1066d0;
+        margin-right: 5px;
+      }
+    }
+    .statistic{
+      height: 80%;
+      width: 100%;
+      display: flex;
+      justify-content: space-around;
+      align-items: center;
+      .term {
+        height: 100%;
+        width: calc(20% - 10px);
+        border-radius: 4px;
+        font-size: 14px;
+        cursor: pointer;
+        display: flex;
+        .chart-container {
+          padding: 5px;
+          flex: 0.5;
+        }
+        .sta {
+          flex: 0.5;
+          text-align: center;
+          color: #fff;
+          padding: 16px 0;
+          display: flex;
+          flex-flow: column;
+          justify-content: space-around;
+          .num {
+            font-size: 22px;
+            font-weight: bold;
+          }
+        }
+        .sta-bd{
+          flex: 0.5;
+          text-align: center;
+          color: #fff;
+          padding: 16px 0;
+          display: flex;
+          justify-content: space-around;
+          .bd-item{
+            display: flex;
+            flex-flow: column;
+            justify-content: space-around;
+          }
+          .num {
+            font-size: 22px;
+            font-weight: bold;
+          }
+          .split-line{
+              width: 2px;
+              height: 100%;
+              background-color: #fff;
+          }
+        }
+      }
+      .term-project .tooltiptext,.term-codeparamater .tooltiptext,.term-parts .tooltiptext,
+      .term-pictures .tooltiptext,.term-supplier .tooltiptext{
+          display: flex;
+          flex-flow: column;
+          visibility: hidden;
+          width: 18.5%;
+          background-color: #fff;
+          color: #000;
+          text-align: center;
+          border-radius: 6px;
+          padding: 5px;
+          // box-shadow: 5px 5px 5px 0 rgb(0 0 0 / 5%);
+          // -webkit-box-shadow: rgb(212, 210, 210) 0px 0px 10px;
+          // -moz-box-shadow: rgb(212, 210, 210) 0px 0px 10px;
+          position: absolute;
+          z-index: 9999;
+          top: 2%;
+          div{
+            margin: 2px 0;
+          }
+      }
+      .term-project .tooltiptext{
+        span{
+          font-size: 14px;
+          font-family: Source Han Sans CN;
+          font-weight: 600;
+          color: #4D92E6;
+        }
+      }
+      .term-codeparamater .tooltiptext{
+        span{
+          font-size: 14px;
+          font-family: Source Han Sans CN;
+          font-weight: 600;
+          color: #28B6C1;
+        }
+      }
+      .term-parts .tooltiptext{
+        span{
+          font-size: 14px;
+          font-family: Source Han Sans CN;
+          font-weight: 600;
+          color: #64A5C4;
+        }
+      }
+      .term-pictures .tooltiptext{
+        span{
+          font-size: 14px;
+          font-family: Source Han Sans CN;
+          font-weight: 600;
+          color: #837FD8;
+        }
+      }
+      .term-supplier .tooltiptext{
+        span{
+          font-size: 14px;
+          font-family: Source Han Sans CN;
+          font-weight: 600;
+          color: #5F86C5;
+        }
+      }
+      .term-project:hover .tooltiptext{
+        visibility: visible;
+      }
+      .term-codeparamater:hover .tooltiptext{
+        visibility: visible;
+      }
+      .term-parts:hover .tooltiptext{
+        visibility: visible;
+      }
+      .term-pictures:hover .tooltiptext{
+        visibility: visible;
+      }
+      .term-supplier:hover .tooltiptext{
+        visibility: visible;
+      }
+      .term-project {
+        background: linear-gradient(90deg, #3A86E3, #50A5F5);
+        opacity: 0.9;
+      }
+      .term-codeparamater {
+        background: linear-gradient(90deg, #10ACB6, #14BDD6);
+        opacity: 0.9;
+      }
+      .term-parts {
+        background: linear-gradient(90deg, #3C8CB2, #4BA6D1);
+        opacity: 0.9;
+      }
+      .term-pictures {
+        background: linear-gradient(90deg, #7570D4, #8D87DD);
+        opacity: 0.9;
+      }
+      .term-supplier {
+        background: linear-gradient(90deg, #4E78BE, #5485D7);
+        opacity: 0.9;
+        .workbench-suplier-num,.workbench-batch-num {
+          margin-right: 2px;
+        }
+      }
+    }
+  }
+  .statistic-container{
+    margin: 10px 0 0 10px;
+    height: 56%;
+    width: 98%;
+    background: #fff;
+    border-radius: 6px;
+    padding: 6px;
+    display: flex;
+    .chart-container{
+      flex: 0.8;
+      .head-container{
+        height: 5%;
+        width: 100%;
+        display: flex;
+        align-items: center;
+        .span-bg{
+          width: 4px;
+          height: 18px;
+          background-color: #1066d0;
+          margin-right: 5px;
+        }
+        .span-chart,.span-list,.span-radio{
+          margin-left: 20px;
+          cursor: pointer;
+        }
+      }
+      .content-container{
+        height: 95%;
+        width: 100%;
+        display: flex;
+        .chartRegion{
+          flex: 0.55;
+          border-right: 1px solid #909399;
+          .chart-containter-left-top{
+            height: 5%;
+            width: 100%;
+            margin: 10px 0 0 10px;
+            span{
+              color: #333333;
+            }
+          }
+        }
+        .infoRegion{
+          flex: 0.45;
+          border-right: 1px solid #e7e7e7;
+          padding-right: 20px;
+          .chart-containter-right-top{
+            width: 100%;
+            height: 30%;
+            margin: 10px 0 0 10px;
+            span{
+              color: #333333;
+              // height: 100%;
+            }
+            .sginfoTitle{
+              padding-left: 2%;
+            }
+            .sginfo{
+              height:70%;
+              margin:2%;
+              background: #EFF7FF;
+              border-radius: 4px;
+              display: flex;
+              flex-flow: row nowrap;
+              .sginfo-left{
+                height: 100%;
+                width: 20%;
+                display: flex;
+                flex-flow: column nowrap;
+                font-family: Source Han Sans CN;
+                .sginfo-left-top{
+                  height: 50%;
+                  width: 100%;
+                  display: flex;
+                  flex-flow: row nowrap;
+                  justify-content: center;
+                  align-items: center;
+                  color: #333333;
+                  padding-top: 10px;
+                  .sgts{
+                    font-size: 24px;
+                    font-weight: bold;
+                    display: flex;
+                    align-items: center;
+                  }
+                  .sgtsdw{
+                    font-size: 14px;
+                    font-weight: 400;
+                    display: flex;
+                    align-items: center;
+                  }
+                }
+                .sginfo-left-bottom{
+                  height: 50%;
+                  width: 100%;
+                  display: flex;
+                  justify-content: center;
+                  align-items: center;
+                  span{
+                    display: flex;
+                    align-items: baseline;
+                    font-size: 14px;
+                    font-family: Source Han Sans CN;
+                    font-weight: 400;
+                    color: #333333;
+                  }
+                }
+              }
+              .sginfo-right{
+                height: 100%;
+                width: 80%;
+                padding: 1%;
+                display: flex;
+                flex-flow: column nowrap;
+                span{
+                  display: flex;
+                  align-items: center;
+                  flex-flow: row nowrap;
+                  white-space: nowrap;
+                  font-size: 14px;
+                  font-family: Microsoft YaHei UI;
+                  font-weight: 400;
+                }
+                label{
+                  display: flex;
+                  align-items: center;
+                  flex-flow: row nowrap;
+                  white-space: nowrap;
+                  margin-bottom: 0;
+                  font-size: 14px;
+                  font-family: Microsoft YaHei UI;
+                  font-weight: 400;
+                }
+                .sginfo-right-top{
+                  height: 49%;
+                  width: 100%;
+                  border-bottom:1px solid ;
+                  display: flex;
+                  justify-content: space-between;
+                  align-items: center;
+                  flex-flow: row nowrap;
+                }
+                .sginfo-right-bottom{
+                  height: 49%;
+                  width: 100%;
+                  display: flex;
+                  justify-content: space-between;
+                  align-items: center;
+                  flex-flow: row nowrap;
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+    .rank-container{
+      flex: 0.2;
+      .head-container{
+        height: 5%;
+        width: 100%;
+        display: flex;
+        align-items: center;
+        .span-bg{
+          width: 4px;
+          height: 18px;
+          background-color: #1066d0;
+          margin-right: 5px;
+        }
+      }
+    }
+
+  }
+  .photo-container{
+    margin: 10px 0 0 10px;
+    height: 15%;
+    width: 98%;
+    background: #fff;
+    border-radius: 6px;
+    padding: 6px;
+  }
+}
+</style>