jhbigscreen/src/pages/projectEngin.vue

<template>
    <div class="project-engin-index">
         <!--大屏背景-->
         <background-video></background-video>
        <!--大屏内容-->
        <div class="screen-content-max">
            <screen-header :nav="7" @itemdata="onItemData"></screen-header>
        
        <div class="screen-content">
            <el-row>
                <el-col :span="8">
                    <module-one-1-1 label="现场管理标准化" style="position: relative;">
                        <imageItem :images="list1" v-if="list1.length>0 && !loading"></imageItem>
                        <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;">
                        <imageItem :images="list2" v-if="list2.length>0 && !loading"></imageItem>
                        <div v-if="list2.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;">
                        <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">

                    </module-one-1-1>
                    <module-one-1-1 label="待审批" :border="1">
                        
                    </module-one-1-1>
                    <module-one-1-1 label="集团期刊" :border="1">
                        
                    </module-one-1-1>
                </el-col>
                <el-col :span="8">
                    <module-one-1-1 label="设备管理标准">
                        <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="文明施工标准">
                        <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="环境保护标准">
                        <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>
        </div>
    </div>
    </div>
</template>

<script>
import '../components/module/module-one-1-2'
import '../components/background_video'
import '../components/header'
import '../components/staff-survey-chart'
import BorderBox6 from './components/BorderBox6.vue'
import debounce from 'lodash.debounce'
import imageItem from './engin/enginImageItems.vue'
export default {
    name: 'JhbigscreenProjectEngin',
    components: {
        BorderBox6,
        imageItem
    },
    data() {
        return {
            loading:true,
            index1:0,
            index2:0,
            index3:0,
            index4:0,
            index5:0,
            index6:0,
            list1:[],
            list2:[],
            list3:[],
            list4:[],
            list5:[],
            list6:[],
            chart1Data:[],
            chart2Data:[]
        };
    },

    mounted() {
        this.$bus.$on("loadProjects", debounce(prjs => {
            this.prjs = prjs;
        }));
        this.$bus.$on("projectChange",debounce(res => {
            this.project = res;            
            this.loadData();
        }));
        this.$bus.$on("deptChange",debounce(dept => {
            this.dept = dept;
            this.loadData();
        }));
    },

    methods: {
        getProjectId(cb) {
            let func = () => {
                let prjId = this.project?.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();
        },
        loadData(){
            this.getProjectId(id => {
                let ajaxs=[
                    this.$api.standard.getList(id,this.dept.id),
                    this.$api.flow.groupByCategory(this.project.id,this.dept.id),
                    this.$api.flow.groupByUnit(this.project.id,this.dept.id),
                ];
                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;
                   this.chart1Data=(res[1].data||[]).map(it=>{
                    let o= {
                        title:it.taskName,
                        comp:it.assigneeId||0,
                        uncomp:it.procDefVersion||0,
                        total:0
                    }
                    o.total=o.comp+o.uncomp;
                    return o;
                   })
                   console.log("-1->",this.chart1Data);
                   let tmps2=[{title:'总包单位',count:0},
                    {title:'监理单位',count:0},
                    {title:'设计单位',count:0},
                    {title:'甲方代表',count:0},
                    {title:'子公司',count:0},
                   ];
                   let objs=res[2].data||[];
                   tmps2.forEach(it=>{
                    let o=objs.find(item=>it.title==item.taskName);
                    if(o){
                        it.count=o.assigneeId
                    }
                   });
                   this.chart2Data=tmps2;
                   console.log("-2->",this.chart2Data);
                });
            });
        },
        onItemData(e) {
            if (e.type == 1) {
                location.href = 'index.html'
            }
            this.getProjectOverview(e.id)
        },
    },
};
</script>

<style lang="less" scoped>
.project-engin-index{
    /deep/ .border-1{
        padding-left:0px;
    }
}
</style>