update code
parent
8b66eee585
commit
b91ab2b7c6
|
@ -0,0 +1,20 @@
|
||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
const projectFunVerifyGroupByCheckType=(deptId,projectId)=>{
|
||||||
|
return request({
|
||||||
|
url: `/project/projectFunVerify/groupByCheckType?deptId=${deptId||0}&projectId=${projectId||0}`,
|
||||||
|
method: 'get'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const listFunVerify=data=>{
|
||||||
|
return request({
|
||||||
|
url: `/project/projectFunVerify/list`,
|
||||||
|
method: 'get',
|
||||||
|
params:data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
export default{
|
||||||
|
projectFunVerifyGroupByCheckType,
|
||||||
|
listFunVerify
|
||||||
|
}
|
|
@ -321,7 +321,6 @@ export default {
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
dtChange() {
|
dtChange() {
|
||||||
debugger
|
|
||||||
this.commChange();
|
this.commChange();
|
||||||
this.getCommList({ value: this.selType })
|
this.getCommList({ value: this.selType })
|
||||||
},
|
},
|
||||||
|
|
|
@ -181,7 +181,7 @@
|
||||||
</module-one-1-1>
|
</module-one-1-1>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="6">
|
<el-col :span="6">
|
||||||
<module-one-1-1 label="工程功能检验">
|
<module-one-1-1 label="工程功能检验" style="position: relative">
|
||||||
<funVerifyGroupByCheckType ref="funGroupByCheckType"/>
|
<funVerifyGroupByCheckType ref="funGroupByCheckType"/>
|
||||||
</module-one-1-1>
|
</module-one-1-1>
|
||||||
<projectChecking></projectChecking>
|
<projectChecking></projectChecking>
|
||||||
|
|
|
@ -0,0 +1,169 @@
|
||||||
|
<template>
|
||||||
|
<div class="fun-verify-group-check-type">
|
||||||
|
<img src="images/icon2001.png" v-if="total > 1"
|
||||||
|
style="position: absolute; cursor: pointer; right: 12px; top: 12px" @click="showFunVerifyDlg" />
|
||||||
|
<project-overview-chart :key="'ai1' + elKey" :sp="''" txtTop="0" gifTop="8px"
|
||||||
|
:maintitle="total" :legend-opt="legendOpt2" :typedata="dataList"
|
||||||
|
:text="showText" :height="180" :width="450" :fn="changeChart1"></project-overview-chart>
|
||||||
|
<div class="div-legend">
|
||||||
|
<div v-for="(it,idx) in showList" :key="idx" class="legend-item">
|
||||||
|
<span class="item-no" :style="'background:'+it.color">{{idx+1 }}</span>
|
||||||
|
<span class="item-name">{{ it.name }}</span>
|
||||||
|
<span class="item-value">{{ it.value }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<funVerifyGroupDlg ref="dlg"/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import throttle from 'lodash.throttle'
|
||||||
|
import funVerifyGroupDlg from './funVerifyGroupDlg.vue'
|
||||||
|
export default {
|
||||||
|
components:{
|
||||||
|
funVerifyGroupDlg
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
showText:'汇总总数',
|
||||||
|
dept: null,
|
||||||
|
projectInfo: null,
|
||||||
|
prjs:[],
|
||||||
|
dataList:[],
|
||||||
|
showList:[],
|
||||||
|
total:0,
|
||||||
|
elKey:0,
|
||||||
|
legendOpt2: {
|
||||||
|
icon: "rect",
|
||||||
|
textStyle: {
|
||||||
|
fontSize: 14,
|
||||||
|
color: "#c3dbfd",
|
||||||
|
rich: {
|
||||||
|
name: {
|
||||||
|
color: "#c3dbfd",
|
||||||
|
padding: [0, 20, 0, 0],
|
||||||
|
},
|
||||||
|
val: {
|
||||||
|
color: "#63f8bc",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
|
||||||
|
mounted() {
|
||||||
|
this.$bus.$on("projectChange", throttle((res) => {
|
||||||
|
this.projectInfo = res;
|
||||||
|
this.dept = this.$root.dept || this.dept||{};
|
||||||
|
this.prjs=this.$root.projects || this.prjs||[];
|
||||||
|
this.loadData();
|
||||||
|
}));
|
||||||
|
if (this.$root.hasInitHeader) {
|
||||||
|
this.initMe();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
showFunVerifyDlg(){
|
||||||
|
this.$refs.dlg.showDialog({
|
||||||
|
dataList:this.dataList,
|
||||||
|
deptId:this.dept?.id || 0,
|
||||||
|
projectId:this.projectInfo?.id||0
|
||||||
|
})
|
||||||
|
},
|
||||||
|
changeChart1(opt){
|
||||||
|
let colors=["#D50000","#AA00FF","#304FFE","#0091EA","#00B8D4","#00C853","#AEEA00","#FFAB00","#5D4037","#F06292","#4A148C","##F9FBE7","#311B92","#004D40","#1A237E","#795548","#FF8A80"];
|
||||||
|
opt.legend[0].formatter= (name) =>{
|
||||||
|
let res = this.dataList.filter((v) => v.name === name);
|
||||||
|
return "{name| " + name + "}"+ " {val|" + res[0].value + "} ";
|
||||||
|
}
|
||||||
|
opt.series[0].data.forEach((it,idx)=>{
|
||||||
|
it.itemStyle.color=colors[idx];
|
||||||
|
});
|
||||||
|
this.showList=opt.series[0].data.map(it=>{
|
||||||
|
return {
|
||||||
|
name:it.name,
|
||||||
|
value:it.value,
|
||||||
|
color:it.itemStyle.color
|
||||||
|
};
|
||||||
|
})
|
||||||
|
if(opt.legend){
|
||||||
|
delete opt.legend
|
||||||
|
}
|
||||||
|
opt.series[0].center=["50%", "40%"];
|
||||||
|
opt.series[0].radius=["40%", "56%"];
|
||||||
|
|
||||||
|
opt.series[1].center=["50%", "40%"];
|
||||||
|
opt.series[1].radius=["40%", "40%"];
|
||||||
|
opt.title.padding=[50,0,0,224];
|
||||||
|
return opt;
|
||||||
|
},
|
||||||
|
initMe() {
|
||||||
|
this.projectInfo = this.$root.project || {};
|
||||||
|
this.dept = this.$root.dept || {};
|
||||||
|
this.loadData();
|
||||||
|
},
|
||||||
|
loadData: throttle(function () {
|
||||||
|
this.$api.quality.projectFunVerifyGroupByCheckType(this.dept?.id || 0,this.projectInfo?.id||0).then(d=>{
|
||||||
|
this.dataList=(d.data||[]).map(it=>{
|
||||||
|
return {
|
||||||
|
name:it.checkName,
|
||||||
|
value:it.id,
|
||||||
|
checkType:it.checkType
|
||||||
|
}
|
||||||
|
});
|
||||||
|
this.total=0;
|
||||||
|
this.dataList.forEach(it=>{
|
||||||
|
this.total+=it.value;
|
||||||
|
});
|
||||||
|
this.elKey++;
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="less">
|
||||||
|
.fun-verify-group-check-type{
|
||||||
|
.chart-gif.chart-overview-gif{
|
||||||
|
width:85px;
|
||||||
|
height: 85px;
|
||||||
|
left:182px;
|
||||||
|
top:28px !important;
|
||||||
|
}
|
||||||
|
.div-legend{
|
||||||
|
position: relative;
|
||||||
|
top:-20px;
|
||||||
|
font-size:12px;
|
||||||
|
padding:0px 10px;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
.legend-item{
|
||||||
|
width:48%;
|
||||||
|
flex-direction: column;
|
||||||
|
line-height: 20px;
|
||||||
|
position: relative;
|
||||||
|
.item-no{
|
||||||
|
display: inline-block;
|
||||||
|
height:18px;
|
||||||
|
width: 18px;
|
||||||
|
text-align:center;
|
||||||
|
border-radius: 5px;
|
||||||
|
margin-right:5px;
|
||||||
|
}
|
||||||
|
.item-name{
|
||||||
|
display: inline-block;
|
||||||
|
position: relative;
|
||||||
|
top:-3px;
|
||||||
|
}
|
||||||
|
.item-value{
|
||||||
|
position:absolute;
|
||||||
|
right:10px;
|
||||||
|
font-size:12px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #63f8bc;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,307 @@
|
||||||
|
<template>
|
||||||
|
<MyDialog v-if="show" v-model="show" :width="'1200px'" height="800px" :class="'font-size-' + fontSize"
|
||||||
|
class="fun-verify-group-dlg">
|
||||||
|
<template slot="title">
|
||||||
|
<div style="display: flex; align-items: center;justify-content: space-between;">
|
||||||
|
<div :key="elKey" class="header-title">
|
||||||
|
工程功能检验
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
<div class="fun-main">
|
||||||
|
<div class="fun-nav">
|
||||||
|
<div v-for="(it, idx) in dataList" :key="idx" class="fun-nav-item"
|
||||||
|
:class="nav == it.checkType ? 'active' : ''" @click="doNav(it)">
|
||||||
|
{{ it.name }}({{ it.value }})
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="fun-list">
|
||||||
|
<div v-if="selFun.value == 0" class="div-no-data" style="margin-top:200px;">
|
||||||
|
<img src="images/nodata.png" style="width: 120px;">
|
||||||
|
<div style="text-align: center;font-size: 12px;color:#888;">暂无数据</div>
|
||||||
|
</div>
|
||||||
|
<template v-else>
|
||||||
|
<div class="fun-data-list">
|
||||||
|
<div v-for="(it, idx) in datas" :key="idx" class="fun-data-item">
|
||||||
|
<div class="data-row1">
|
||||||
|
<el-image style="width: 180px; height: 100px" :src="it.mainImage + '.min.jpg'"
|
||||||
|
:preview-src-list="it.images">
|
||||||
|
</el-image>
|
||||||
|
<div class="data-info">
|
||||||
|
<span class="data-state"
|
||||||
|
:class="it.checkResult ? it.checkResult == 1 ? 'is-ok' : 'is-fail' : 'is-progress'">
|
||||||
|
{{ it.checkResult ? it.checkResult == 1 ? '检验合格' : '检验不合格' : '检验进行中' }}
|
||||||
|
</span>
|
||||||
|
<div class="data-item">
|
||||||
|
<span class="data-label">项目名称:</span>
|
||||||
|
<el-popover placement="bottom" trigger="hover"
|
||||||
|
popper-class="engin-image-item-pop">
|
||||||
|
{{ it.projectName }}
|
||||||
|
<span slot="reference" class="data-text">{{ it.projectName }}</span>
|
||||||
|
</el-popover>
|
||||||
|
</div>
|
||||||
|
<div class="data-item">
|
||||||
|
<span class="data-label">总包单位:</span>
|
||||||
|
<el-popover placement="bottom" trigger="hover"
|
||||||
|
popper-class="engin-image-item-pop">
|
||||||
|
{{ it.deptName }}
|
||||||
|
<span slot="reference" class="data-text">{{ it.deptName }}</span>
|
||||||
|
</el-popover>
|
||||||
|
</div>
|
||||||
|
<div class="data-item">
|
||||||
|
<span class="data-label">检验标题:</span>
|
||||||
|
<el-popover placement="bottom" trigger="hover"
|
||||||
|
popper-class="engin-image-item-pop">
|
||||||
|
{{ it.checkName }}
|
||||||
|
<span slot="reference" class="data-text">{{ it.checkName }}</span>
|
||||||
|
</el-popover>
|
||||||
|
</div>
|
||||||
|
<div class="data-item date-time" style="margin-top:4px;">
|
||||||
|
<span class="data-label">检验时间:</span>
|
||||||
|
<span class="data-text">{{ it.checkDate }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="data-detail">
|
||||||
|
<el-popover placement="bottom" trigger="hover" popper-class="engin-image-item-pop">
|
||||||
|
{{ it.checkName }}
|
||||||
|
<span slot="reference" class="state-content">
|
||||||
|
<span class="data-label">检验描述:</span>
|
||||||
|
<span class="data-text">{{ it.intro }}</span>
|
||||||
|
</span>
|
||||||
|
</el-popover>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<el-pagination layout="total,prev, pager, next" @current-change="handleCurrentChange" :total="total"
|
||||||
|
:page-size="size" :current-page.sync="index" class="bg-pagination"></el-pagination>
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</MyDialog>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import MyDialog from "../components/MyDialog";
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
MyDialog,
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
elKey: 0,
|
||||||
|
fontSize: 0,
|
||||||
|
show: false,
|
||||||
|
dataList: [],
|
||||||
|
nav: 0,
|
||||||
|
selFun: null,
|
||||||
|
deptId: 0,
|
||||||
|
projectId: 0,
|
||||||
|
total: 0,
|
||||||
|
size: 6,
|
||||||
|
index: 1,
|
||||||
|
datas: [],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
|
||||||
|
mounted() { },
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
handledownload(it) {
|
||||||
|
window.open(it.url);
|
||||||
|
},
|
||||||
|
showDialog(opt) {
|
||||||
|
this.index = 1;
|
||||||
|
this.dataList = opt.dataList;
|
||||||
|
this.deptId = opt.deptId;
|
||||||
|
this.projectId = opt.projectId;
|
||||||
|
this.nav = this.dataList[0].checkType;
|
||||||
|
this.selFun = this.dataList[0];
|
||||||
|
this.show = true;
|
||||||
|
this.loadData();
|
||||||
|
},
|
||||||
|
doNav(o) {
|
||||||
|
this.selFun = o;
|
||||||
|
this.index = 1;
|
||||||
|
this.nav = o.checkType;
|
||||||
|
this.loadData();
|
||||||
|
},
|
||||||
|
handleCurrentChange(n) {
|
||||||
|
this.index = n;
|
||||||
|
this.loadData();
|
||||||
|
},
|
||||||
|
loadData() {
|
||||||
|
let postData = {
|
||||||
|
checkType: this.nav,
|
||||||
|
activeName: "all",
|
||||||
|
pageNum: this.index,
|
||||||
|
pageSize: this.size,
|
||||||
|
};
|
||||||
|
if (this.projectId && this.projectId > 0) {
|
||||||
|
postData.projectId = this.projectId;
|
||||||
|
}
|
||||||
|
if (this.deptId && this.deptId > 0) {
|
||||||
|
postData.projectDeptId = this.deptId;
|
||||||
|
}
|
||||||
|
this.$api.quality.listFunVerify(postData).then((d) => {
|
||||||
|
this.total = d.total || 0;
|
||||||
|
this.datas = (d.rows || []).map((it) => {
|
||||||
|
it.images = (it.imageUrls || it.mainImage || "")
|
||||||
|
.split(",")
|
||||||
|
.filter((it) => it);
|
||||||
|
return it;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less">
|
||||||
|
.fun-verify-group-dlg {
|
||||||
|
.popup-project-introduction-min {
|
||||||
|
transform: translateY(150px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup-project-introduction-details {
|
||||||
|
padding: 0px !important;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.quality-table {
|
||||||
|
padding: 0px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fun-main {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.fun-nav {
|
||||||
|
width: 300px;
|
||||||
|
min-width: 300px;
|
||||||
|
height: 505px;
|
||||||
|
border-right: solid 1px #dddddd55;
|
||||||
|
padding: 20px 10px;
|
||||||
|
|
||||||
|
.fun-nav-item {
|
||||||
|
line-height: 30px;
|
||||||
|
color: #ddddddba;
|
||||||
|
cursor: pointer;
|
||||||
|
padding-left: 20px;
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
background: #36607d;
|
||||||
|
border-radius: 4px;
|
||||||
|
color: #63f8bc;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.fun-list {
|
||||||
|
flex-grow: 1;
|
||||||
|
padding: 10px;
|
||||||
|
|
||||||
|
.fun-data-list {
|
||||||
|
.fun-data-item {
|
||||||
|
padding: 10px;
|
||||||
|
display: inline-block;
|
||||||
|
width: calc(50% - 20px);
|
||||||
|
font-size: 12px;
|
||||||
|
|
||||||
|
.data-row1 {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.el-image {
|
||||||
|
width: 150px !important;
|
||||||
|
height: 130px !important;
|
||||||
|
max-width: 150px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.data-info {
|
||||||
|
padding-left: 8px;
|
||||||
|
flex-grow: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.data-state {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 0px 10px;
|
||||||
|
line-height: 24px;
|
||||||
|
margin-bottom: 4px;
|
||||||
|
|
||||||
|
&.is-ok {
|
||||||
|
background: #27771d6b;
|
||||||
|
color: #63f8bc;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-fail {
|
||||||
|
background: #ff2d2d33;
|
||||||
|
color: #ff0505;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-progress {
|
||||||
|
background: #034ef1a3;
|
||||||
|
color: #a8d6ed;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.data-item {
|
||||||
|
line-height: 20px;
|
||||||
|
color:#00aaff;
|
||||||
|
&.date-time{
|
||||||
|
color:#868b93;
|
||||||
|
}
|
||||||
|
.data-text.el-popover__reference {
|
||||||
|
white-space: nowrap;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
display: inline-block;
|
||||||
|
overflow: hidden;
|
||||||
|
max-width: 100%;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
span {
|
||||||
|
&:first-child {
|
||||||
|
display: inline-block;
|
||||||
|
width: 60px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
display: inline-block;
|
||||||
|
width: calc(100% - 80px);
|
||||||
|
|
||||||
|
.el-popover__reference-wrapper {
|
||||||
|
display: inline-block;
|
||||||
|
width: 100%;
|
||||||
|
line-height: 20px;
|
||||||
|
position: relative;
|
||||||
|
top: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.data-detail{
|
||||||
|
margin-top:10px;
|
||||||
|
&>span{
|
||||||
|
width:100%;
|
||||||
|
.el-popover__reference-wrapper{
|
||||||
|
width:100%;
|
||||||
|
.state-content{
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
-webkit-line-clamp: 2;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
height: 30px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
Loading…
Reference in New Issue