update code

dev_xd
lijun 2024-11-29 23:08:39 +08:00
parent c6596db86c
commit 909bc281a9
3 changed files with 294 additions and 68 deletions

View File

@ -50,6 +50,10 @@ body{
width:1912px;
height: 1080px;
}
.img-openwin{
width: 26px;
height:26px;
}
.div-header{
background-image: url("../images/banner-top-1k.png");
}
@ -71,6 +75,22 @@ body{
.div-header{
background-image: url("../images/banner-top-2k.png");
}
.img-openwin{
width: 30px;
height:30px;
}
.screen-one-1-1::after,.screen-one-1-2::after,.screen-one-1-3::after,
.screen-one-2-1::after,.screen-one-2-2::after,.screen-one-2-3::after,
.screen-one-3-1::after,.screen-one-3-2::after,.screen-one-3-3::after
{
background-size: auto 30px;
height: 30px !important;
}
.module-title{
height: 30px !important;
line-height: 30px !important;
font-size: 20px;
}
}
@ -90,6 +110,27 @@ body{
.div-header{
background-image: url("../images/banner-top-4k.png");
}
.img-openwin{
width: 40px;
height: 40px;
}
.screen-one-1-1::after,.screen-one-1-2::after,.screen-one-1-3::after,
.screen-one-2-1::after,.screen-one-2-2::after,.screen-one-2-3::after,
.screen-one-3-1::after,.screen-one-3-2::after,.screen-one-3-3::after
{
background-size: auto 40px;
height: 40px !important;
}
.module-title{
height: 40px !important;
line-height: 40px !important;
font-size: 26px;
}
}
.img-openwin{
position: absolute;
top:0px;
right: 0px;
}
.main-app {
height:calc(100% - 130px);

View File

@ -1,84 +1,87 @@
<template>
<div class="div-header">
<el-row >
<el-col :span="8">
<div class="head-title-tab">
<div :class="nav == 1 ? 'head-nav active' : 'head-nav'" @click="doNav(1)"></div>
<div :class="nav == 2 ? 'head-nav active' : 'head-nav'" @click="doNav(2)"></div>
<div :class="nav == 3 ? 'head-nav active' : 'head-nav'" @click="doNav(3)"></div>
<div :class="nav == 4 ? 'head-nav active' : 'head-nav'" @click="doNav(4)"></div>
<div :class="nav == 5 ? 'head-nav active' : 'head-nav'" @click="doNav(5)"></div>
</div>
</el-col>
<el-col :span="8" class="header-center">
数字建安施工管理平台
</el-col>
<el-col :span="8">
<div class="header-title-user-info">
<el-select v-model="selProject" style="width: 150px;margin-right: 20px;height:30px;line-height: 30px;" @change="doProjectSelect">
<el-option v-for="it in projects" :key="it.id" :label="it.projectName" :value="it.id"></el-option>
</el-select>
<span class="command" @click="doLogout">{{ nickName }}
<i class="el-icon-switch-button"></i>
</span>
</div>
</el-col>
</el-row>
</div>
<div class="div-header">
<el-row>
<el-col :span="8">
<div class="head-title-tab">
<div :class="nav == 1 ? 'head-nav active' : 'head-nav'" @click="doNav(1)"></div>
<div :class="nav == 2 ? 'head-nav active' : 'head-nav'" @click="doNav(2)"></div>
<div :class="nav == 3 ? 'head-nav active' : 'head-nav'" @click="doNav(3)"></div>
<div :class="nav == 4 ? 'head-nav active' : 'head-nav'" @click="doNav(4)"></div>
<div :class="nav == 5 ? 'head-nav active' : 'head-nav'" @click="doNav(5)"></div>
</div>
</el-col>
<el-col :span="8" class="header-center">
数字建安施工管理平台
</el-col>
<el-col :span="8">
<div class="header-title-user-info">
<el-select v-model="selProject" popper-class="header-sel-project-pop"
style="width: 150px;margin-right: 20px;height:30px;line-height: 30px;"
@change="doProjectSelect">
<el-option v-for="it in projects" :key="it.id" :label="it.projectName"
:value="it.id"></el-option>
</el-select>
<span class="command" @click="doLogout">{{ nickName }}
<i class="el-icon-switch-button"></i>
</span>
</div>
</el-col>
</el-row>
</div>
</template>
<script>
export default {
data(){
data() {
return {
nav:1,
selProject:'',
projects:[]
nav: 1,
selProject: '',
projects: []
}
},
computed:{
nickName(){
computed: {
nickName() {
return this.$store.getters.nickName;
},
curNav(){
curNav() {
return this.$store.getters.nav;
}
},
watch:{
curNav(n,o){
this.nav=this.$store.getters.nav;
watch: {
curNav(n, o) {
this.nav = this.$store.getters.nav;
}
},
mounted(){
window.xapp=this;
this.$api.project.findMyProjectList().then(d=>{
this.projects=d.rows||[];
if(this.projects.length>0){
let id=localStorage.getItem("selProj")||this.projects[0].id
this.selProject=+id;
mounted() {
window.xapp = this;
this.$api.project.findMyProjectList().then(d => {
this.projects = d.rows || [];
if (this.projects.length > 0) {
let id = localStorage.getItem("selProj") || this.projects[0].id
this.selProject = +id;
this.doProjectSelect();
}
});
},
methods:{
doProjectSelect(){
let tmps=this.projects.filter(d=>d.id==this.selProject);
if(tmps.length>0){
this.$store.dispatch('SetSelProject',tmps[0]);
}else{
this.$store.dispatch('SetSelProject',null);
methods: {
doProjectSelect() {
let tmps = this.projects.filter(d => d.id == this.selProject);
if (tmps.length > 0) {
this.$store.dispatch('SetSelProject', tmps[0]);
} else {
this.$store.dispatch('SetSelProject', null);
}
localStorage.setItem("selProj",this.selProject);
localStorage.setItem("selProj", this.selProject);
},
doNav(n){
if(this.nav==n){
doNav(n) {
if (this.nav == n) {
return;
}
this.nav=n;
let path=["/index","/detail","/prjSafety","/prjQuality","/prjProgress"][n-1];
this.nav = n;
let path = ["/index", "/detail", "/prjSafety", "/prjQuality", "/prjProgress"][n - 1];
this.$router.push(path);
},
doLogout(){
doLogout() {
this.$confirm('确定注销并退出系统吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
@ -94,13 +97,85 @@ export default {
</script>
<style lang="less">
.div-header{
.div-header {
line-height: 100px;
.header-center{
.header-center {
text-align: center;
color: #3da2ff;
font-size: 32px;
font-weight: bold;
}
}
@media (min-width: 1921px) and (max-width: 2560px) {
.div-header {
.head-nav {
font-size: 16px;
width: auto;
height: auto;
padding: 5px 40px;
position: relative;
top: -8px;
}
}
.header-center {
font-size: 42px !important;
margin-top: 10px;
}
.header-title-user-info {
font-size: 20px;
.el-select {
transform: scale(1.5);
margin-right: 60px !important;
position: relative;
top: -5px;
}
}
.header-sel-project-pop {
transform: scale(1.5);
width: 200px;
min-width: unset !important;
margin-left: 50px;
}
}
@media (min-width: 2561px) {
.div-header {
.head-nav {
font-size: 20px;
width: auto;
height: auto;
padding: 5px 40px;
position: relative;
top: -8px;
}
}
.header-center {
font-size: 52px !important;
margin-top: 10px;
}
.header-title-user-info {
font-size: 30px;
.el-select {
transform: scale(2);
margin-right: 100px !important;
position: relative;
top: -5px;
}
}
.header-sel-project-pop {
transform: scale(2);
width: 200px;
min-width: unset !important;
margin-left: 100px;
}
}
</style>

View File

@ -3,8 +3,10 @@
<el-col :span="6" class="h100">
<module-one-1-1 label="项目概况">
<div class="glr-title">{{ selProject?.projectName||'' }}</div>
<img src="images/icon2001.png" class="img-openwin"/>
<div class="glr-title prj-info-title">{{ selProject?.projectName||'' }}</div>
<div class="dept-info-list">
<el-row>
<el-col :span="12" class="dept-item">
<div class="dept-title">建设单位</div>
<div v-if="deptType1==null" class="dept-nodata">
@ -14,7 +16,7 @@
<img class="dept-img" src="images/company_3.png"/>
<div class="dept-row">
<div class="dept-name"> {{ deptType1.deptName }}</div>
<div class="dept-leader-phone">
<div class="dept-leader-phone" :title="(deptType1.leader||'')+' '+(deptType1.phone||'')">
<span class="dept-leader">{{deptType1.leader}}</span>
<span class="dept-phone">{{deptType1.phone}}</span>
</div>
@ -30,13 +32,15 @@
<img class="dept-img" src="images/company_2.png"/>
<div class="dept-row">
<div class="dept-name"> {{ deptType2.deptName }}</div>
<div class="dept-leader-phone">
<div class="dept-leader-phone" :title="(deptType2.leader||'')+' '+(deptType2.phone||'')">
<span class="dept-leader">{{deptType2.leader}}</span>
<span class="dept-phone">{{deptType2.phone}}</span>
</div>
</div>
</div>
</el-col>
</el-row>
<el-row>
<el-col :span="12" class="dept-item">
<div class="dept-title">总包单位</div>
<div v-if="deptType3.deptName==null" class="dept-nodata">
@ -46,7 +50,7 @@
<img class="dept-img" src="images/company_3.png"/>
<div class="dept-row">
<div class="dept-name"> {{ deptType3.deptName }}</div>
<div class="dept-leader-phone">
<div class="dept-leader-phone" :title="(deptType3.leader||'')+' '+(deptType3.phone||'')">
<span class="dept-leader">{{deptType3.leader}}</span>
<span class="dept-phone">{{deptType3.phone}}</span>
</div>
@ -62,14 +66,15 @@
<img class="dept-img" src="images/company_11.png"/>
<div class="dept-row">
<div class="dept-name"> {{ deptType4.deptName }}</div>
<div class="dept-leader-phone">
<div class="dept-leader-phone" :title="(deptType4.leader||'')+' '+(deptType4.phone||'')">
<span class="dept-leader">{{deptType4.leader}}</span>
<span class="dept-phone">{{deptType4.phone}}</span>
</div>
</div>
</div>
</el-col>
</el-row>
<el-row>
<el-col :span="12" class="dept-item">
<div class="dept-title">检测单位</div>
<div v-if="deptType5==null" class="dept-nodata">
@ -79,7 +84,7 @@
<img class="dept-img" src="images/company_12.png"/>
<div class="dept-row">
<div class="dept-name"> {{ deptType5.deptName }}</div>
<div class="dept-leader-phone">
<div class="dept-leader-phone" :title="(deptType5.leader||'')+' '+(deptType5.phone||'')">
<span class="dept-leader">{{deptType5.leader}}</span>
<span class="dept-phone">{{deptType5.phone}}</span>
</div>
@ -96,14 +101,14 @@
<img class="dept-img" src="images/company_10.png"/>
<div class="dept-row">
<div class="dept-name"> {{ deptType6.deptName }}</div>
<div class="dept-leader-phone">
<div class="dept-leader-phone" :title="(deptType6.leader||'')+' '+(deptType6.phone||'')">
<span class="dept-leader">{{deptType6.leader}}</span>
<span class="dept-phone">{{deptType6.phone}}</span>
</div>
</div>
</div>
</el-col>
</el-row>
</div>
</module-one-1-1>
<module-one-1-1 label="项目概况">
@ -181,4 +186,109 @@ export default {
}
</script>
<style lang="less"></style>
<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>