jiangyq
/
YZProjectCloud
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
YZProjectCloud/yanzhu-bigscreen/src/views/projectDetail.vue

294 lines
11 KiB
Vue
Raw Normal View History

增加大屏项目
2024-11-27 23:42:39 +08:00
<template>
<div class="project-detail main-page">
<el-col :span="6" class="h100">
<module-one-1-1 label="项目概况">
update code
2024-11-29 23:08:39 +08:00
<img src="images/icon2001.png" class="img-openwin"/>
<div class="glr-title prj-info-title">{{ selProject?.projectName||'' }}</div>
update code
2024-11-28 23:59:43 +08:00
<div class="dept-info-list">
update code
2024-11-29 23:08:39 +08:00
<el-row>
update code
2024-11-28 23:59:43 +08:00
<el-col :span="12" class="dept-item">
<div class="dept-title">建设单位</div>
<div v-if="deptType1==null" class="dept-nodata">
暂无数据
</div>
<div class="dept-info" v-else>
<img class="dept-img" src="images/company_3.png"/>
<div class="dept-row">
<div class="dept-name"> {{ deptType1.deptName }}</div>
update code
2024-11-29 23:08:39 +08:00
<div class="dept-leader-phone" :title="(deptType1.leader||'')+' '+(deptType1.phone||'')">
update code
2024-11-28 23:59:43 +08:00
<span class="dept-leader">{{deptType1.leader}}</span>
<span class="dept-phone">{{deptType1.phone}}</span>
</div>
</div>
</div>
</el-col>
<el-col :span="12" class="dept-item">
<div class="dept-title">设计单位</div>
<div v-if="deptType2==null" class="dept-nodata">
暂无数据
</div>
<div class="dept-info" v-else>
<img class="dept-img" src="images/company_2.png"/>
<div class="dept-row">
<div class="dept-name"> {{ deptType2.deptName }}</div>
update code
2024-11-29 23:08:39 +08:00
<div class="dept-leader-phone" :title="(deptType2.leader||'')+' '+(deptType2.phone||'')">
update code
2024-11-28 23:59:43 +08:00
<span class="dept-leader">{{deptType2.leader}}</span>
<span class="dept-phone">{{deptType2.phone}}</span>
</div>
</div>
</div>
</el-col>
update code
2024-11-29 23:08:39 +08:00
</el-row>
<el-row>
update code
2024-11-28 23:59:43 +08:00
<el-col :span="12" class="dept-item">
<div class="dept-title">总包单位</div>
<div v-if="deptType3.deptName==null" class="dept-nodata">
暂无数据
</div>
<div class="dept-info" v-else>
<img class="dept-img" src="images/company_3.png"/>
<div class="dept-row">
<div class="dept-name"> {{ deptType3.deptName }}</div>
update code
2024-11-29 23:08:39 +08:00
<div class="dept-leader-phone" :title="(deptType3.leader||'')+' '+(deptType3.phone||'')">
update code
2024-11-28 23:59:43 +08:00
<span class="dept-leader">{{deptType3.leader}}</span>
<span class="dept-phone">{{deptType3.phone}}</span>
</div>
</div>
</div>
</el-col>
<el-col :span="12" class="dept-item">
<div class="dept-title">监理单位</div>
<div v-if="deptType4==null" class="dept-nodata">
暂无数据
</div>
<div class="dept-info" v-else>
<img class="dept-img" src="images/company_11.png"/>
<div class="dept-row">
<div class="dept-name"> {{ deptType4.deptName }}</div>
update code
2024-11-29 23:08:39 +08:00
<div class="dept-leader-phone" :title="(deptType4.leader||'')+' '+(deptType4.phone||'')">
update code
2024-11-28 23:59:43 +08:00
<span class="dept-leader">{{deptType4.leader}}</span>
<span class="dept-phone">{{deptType4.phone}}</span>
</div>
</div>
</div>
</el-col>
update code
2024-11-29 23:08:39 +08:00
</el-row>
<el-row>
update code
2024-11-28 23:59:43 +08:00
<el-col :span="12" class="dept-item">
<div class="dept-title">检测单位</div>
<div v-if="deptType5==null" class="dept-nodata">
暂无数据
</div>
<div class="dept-info" v-else>
<img class="dept-img" src="images/company_12.png"/>
<div class="dept-row">
<div class="dept-name"> {{ deptType5.deptName }}</div>
update code
2024-11-29 23:08:39 +08:00
<div class="dept-leader-phone" :title="(deptType5.leader||'')+' '+(deptType5.phone||'')">
update code
2024-11-28 23:59:43 +08:00
<span class="dept-leader">{{deptType5.leader}}</span>
<span class="dept-phone">{{deptType5.phone}}</span>
</div>
</div>
</div>
</el-col>
<el-col :span="12" class="dept-item">
<div class="dept-title">勘察单位</div>
<div v-if="deptType6==null" class="dept-nodata">
暂无数据
</div>
<div class="dept-info" v-else>
<img class="dept-img" src="images/company_10.png"/>
<div class="dept-row">
<div class="dept-name"> {{ deptType6.deptName }}</div>
update code
2024-11-29 23:08:39 +08:00
<div class="dept-leader-phone" :title="(deptType6.leader||'')+' '+(deptType6.phone||'')">
update code
2024-11-28 23:59:43 +08:00
<span class="dept-leader">{{deptType6.leader}}</span>
<span class="dept-phone">{{deptType6.phone}}</span>
</div>
</div>
</div>
</el-col>
update code
2024-11-29 23:08:39 +08:00
</el-row>
update code
2024-11-28 23:59:43 +08:00
</div>
增加大屏项目
2024-11-27 23:42:39 +08:00
</module-one-1-1>
<module-one-1-1 label="项目概况">
</module-one-1-1>
<module-one-1-1 label="项目概况">
</module-one-1-1>
</el-col>
<el-col :span="12" class="h100">
<module-one-2-2 label="项目概况">
</module-one-2-2>
<module-one-1-2 label="项目概况">
</module-one-1-2>
</el-col>
<el-col :span="6" class="h100">
<module-one-1-1 label="项目概况">
</module-one-1-1>
<module-one-2-1 label="项目概况">
</module-one-2-1>
</el-col>
</div>
</template>
<script>
export default {
data() {
return {
update code
2024-11-28 23:59:43 +08:00
selProject:null,
prjInfo:{},
deptType1:[],//建设单位
deptType2:[],//设计单位
deptType3:[],//总包单位
deptType4:[],//监理单位
deptType5:[],//检测单位
deptType6:[],//勘察单位
增加大屏项目
2024-11-27 23:42:39 +08:00
}
},
mounted() {
this.$store.dispatch('ChangeNav', 2);
this.$bus.$on('projectChange', prj => {
this.selProject=prj;
update code
2024-11-28 23:59:43 +08:00
this.init();
增加大屏项目
2024-11-27 23:42:39 +08:00
});
update code
2024-11-28 23:59:43 +08:00
this.selProject=this.$store.getters.selProject;
this.init();
},
methods:{
init(){
if(!this.selProject){
return;
}
this.$api.project.getProjectInfo(this.selProject.id).then(d=>{
this.prjInfo=d.data||{};
let tmps=this.prjInfo.projectDeptsList||[];
const func=(t)=>{
let objs=tmps.filter(it=>it.deptType==t);
return objs.length>0?objs[0]:null;
};
this.deptType1=func('建设单位');
this.deptType2=func('设计单位');
this.deptType3={deptName:this.prjInfo.disDeptName,leader:this.prjInfo.projectPerson,phone:this.prjInfo.projectPersonPhone};
this.deptType4=func("监理单位");
this.deptType5=func("检测单位");
this.deptType6=func("勘察单位");
});
}
增加大屏项目
2024-11-27 23:42:39 +08:00
}
}
</script>
update code
2024-11-29 23:08:39 +08:00
<style lang="less">
.project-detail{
color: #c2d5f6;
.dept-info-list{
height: calc(100% - 30px);
margin-top:10px;
.el-row{
min-height: 33%;
}
.dept-item{
.dept-title{
line-height: 30px;
font-size: 14px;
}
.dept-nodata{
color:#ccc;
font-size: 12px;
}
.dept-info{
display: flex;
.dept-img{
width:42px;
height:42px;
}
.dept-row{
margin-left: 8px;
font-size:12px;
line-height: 22px;
display: inline-grid;
flex-grow: 1;
padding-right: 10px;
.dept-name{
color: #50a2eb;
}
.dept-leader-phone{
color: #ab3715;
cursor: pointer;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
.dept-leader{
margin-right:10px;
}
}
}
}
}
}
}
@media (min-width: 1921px) and (max-width: 2560px) {
.project-detail{
.prj-info-title{
font-size:24px;
}
.dept-info-list{
.dept-item{
.dept-title{
font-size: 18px;
line-height: 40px;
}
.dept-nodata{
font-size: 16px;
}
.dept-info{
.dept-img{
width:60px;
height:60px;
}
.dept-row{
font-size: 18px;
line-height: 32px;
}
}
}
}
}
}
@media (min-width: 2561px) {
.project-detail{
.prj-info-title{
font-size:32px;
}
.dept-info-list{
.dept-item{
.dept-title{
font-size: 24px;
line-height: 40px;
}
.dept-nodata{
font-size: 18px;
}
.dept-info{
.dept-img{
width:100px;
height:100px;
}
.dept-row{
font-size: 24px;
line-height: 32px;
}
}
}
}
}
}
</style>