Skip to content

Q
quality-dynamic
Commit ced7199f authored by 张牧越's avatar 张牧越
Browse files
Options

12.6 详情更改以及预警列表变更

parent b319eaca
Show whitespace changes
Inline Side-by-side
Showing with 2054 additions and 417 deletions
src/App.vue
View file @ ced7199f
......@@ -62,7 +62,7 @@ export default {
document.getElementsByTagName("body")[0].style.fontSize =
(document.body.offsetWidth / designW) * font_rate + "px";
//监测窗口大小变化
console.log(document.body.offsetWidth);
var that = this;
window.addEventListener(
"onorientationchange" in window ? "orientationchange" : "resize",
......
src/api/dataStatis.js
View file @ ced7199f
......@@ -104,3 +104,80 @@ export async function getImportantQuestion() {
method: 'get',
})
}
// 获取严重问题列表
export async function getWarningStatusNum() {
return await request({
url: `/site/index/warning_config`,
method: 'get',
})
}
// 获取政府监管选项下拉
export async function getZFJGConfig() {
return await request({
url: `/site/question/table`,
method: 'get',
})
}
// 获取政府监管问题列表
export async function getZFJGQuestionList(params) {
return await request({
url: `/site/question`,
method: 'get',
params,
noloading: true
})
}
// 获取政府监管问题详情
export async function getZFJGQuestionDetail(id) {
return await request({
url: `/site/question/pages/detail/${id}`,
method: 'get',
})
}
// 获取创新创优详情
export async function getExcellenceDetail(id) {
return await request({
url: `/site/excellence?project_id=${id}`,
method: 'get',
})
}
//获取质量评定列表接口
export async function getZLPDList(id) {
return await request({
url: `/site/part/info/${id}?part_type=2`,
method: 'get',
})
}
//获取质量检测列表接口
export async function getZLJCList(id) {
return await request({
url: `/site/quality/check/getcheck?project_id=${id}`,
method: 'get',
})
}
// 获取区域详情接口
export async function getAreaDetail(projectId) {
return await request({
url: `/site/index/whole/${projectId}`,
method: 'get',
})
}
src/assets/common/element.less
View file @ ced7199f
......@@ -31,13 +31,23 @@
}
.el-table thead.is-group th.el-table__cell {
background-color: #103972;
}
.el-table--border th.el-table__cell,
.el-table__fixed-right-patch {
border-bottom: 1px solid #1f4c89 !important;
}
.el-table thead {
color: #fff;
}
.el-table th.el-table__cell {
background: rgba(35, 221, 255, 0.2);
background: #103972;
}
.el-table .el-table__cell {
......@@ -235,7 +245,7 @@
}
.dialog-data-table.el-table th.el-table__cell {
background: #16488B;
background: #103972;
}
.dialog-data-table.el-table {
......
src/assets/images/value_bg.png
View replaced file @ b319eaca View file @ ced7199f
src/assets/images/value_bg.png

891 Bytes | W: | H:

src/assets/images/value_bg.png

885 Bytes | W: | H:

src/assets/images/value_bg.png
src/assets/images/value_bg.png
src/assets/images/value_bg.png
src/assets/images/value_bg.png
  • 2-up
  • Swipe
  • Onion skin
src/components/common/Dialog.vue
View file @ ced7199f
......@@ -13,12 +13,12 @@
<span class="dialog-title-span">
{{ title }}
</span>
<span class="op-buttons">
<!-- <span class="op-buttons">
<i
@click="changeFullScreen"
:class="['iconfont', isFullScreen ? 'icon-suoxiao' : 'icon-fangda']"
></i>
</span>
</span> -->
</div>
</template>
<slot />
......@@ -58,9 +58,7 @@ export default {
},
methods: {
closeDialog() {
console.log("???");
this.dialogVisible = false;
console.log(this.dialogVisible);
},
changeFullScreen() {
this.isFullScreen = !this.isFullScreen;
......
src/components/common/DialogApiDataTable.vue
View file @ ced7199f
......@@ -7,6 +7,7 @@
v-loading="loading"
:element-loading-background="loadingBG"
height="calc(100% - .5rem)"
@row-click="rowClick"
>
<el-table-column
v-if="hasIndex"
......@@ -147,6 +148,9 @@ export default {
this.currentPage = currentPage;
this.getData();
},
rowClick(row) {
this.$emit("row-click", row);
},
},
};
</script>
......
src/components/common/STable.vue
View file @ ced7199f
......@@ -28,6 +28,7 @@
class="table-data-columns"
v-for="(row, index) in tableData"
:key="index"
@click="rowClick(row)"
>
<div class="table-data-column" v-if="hasIndex" style="width: 0.4rem">
{{ index + 1 }}
......@@ -130,17 +131,18 @@ export default {
clearInterval(this.scrollInterval);
}
},
rowClick(row) {
this.$emit("row-click", row);
},
data() {
return {};
},
mounted() {
this.$refs.scrollContainer.onscroll = () => {
let list = document.getElementsByClassName("el-tooltip__popper");
if (list.length > 0) {
list[list.length - 1].style.display = "none";
}
};
// this.$refs.scrollContainer.onscroll = () => {
// let list = document.getElementsByClassName("el-tooltip__popper");
// if (list.length > 0) {
// list[list.length - 1].style.display = "none";
// }
// };
this.$refs.scrollContainer.onmouseover = () => {
this.stopScrolling();
};
......@@ -181,6 +183,7 @@ export default {
color: #fff;
font-size: 14px;
margin-bottom: 4px;
cursor: pointer;
background: url("@/assets/images/index/icon_moren@2x.png");
background-repeat: no-repeat;
......
src/components/common/STable2.vue
View file @ ced7199f
......@@ -28,6 +28,7 @@
class="table-data-columns"
v-for="(row, index) in tableData"
:key="index"
@click="rowClick(row)"
>
<div class="table-data-column" v-if="hasIndex" style="width: 0.4rem">
{{ index + 1 }}
......@@ -82,7 +83,7 @@ export default {
},
},
tableData: {
type: Array,
type: [Array, Object],
default: () => {
return [];
},
......@@ -131,17 +132,17 @@ export default {
clearInterval(this.scrollInterval);
}
},
rowClick(row) {
this.$emit("row-click", row);
},
data() {
return {};
},
mounted() {
this.$refs.scrollContainer.onscroll = () => {
let list = document.getElementsByClassName("el-tooltip__popper");
if (list.length > 0) {
list[list.length - 1].style.display = "none";
}
};
// this.$refs.scrollContainer.onscroll = () => {
// let list = document.getElementsByClassName("el-tooltip__popper");
// if (list.length > 0) {
// list[list.length - 1].style.display = "none";
// }
// };
this.$refs.scrollContainer.onmouseover = () => {
this.stopScrolling();
};
......@@ -158,9 +159,8 @@ export default {
}
.table-headers {
line-height: 32px;
border: 1px solid #21436b;
background: #19314d;
color: #fff;
color: #b2bfcf;
font-size: 14px;
text-align: center;
display: flex;
......
src/views/DataStatis/Dialogs/AreaProjectDetail.vue 0 → 100644
View file @ ced7199f
<template>
<Dialog
:title="data.project_name"
:visible="dialogVisible"
width="16rem"
@change-visible="changeVisible"
:destroy-on-close="true"
>
<div class="top-scores">
<div class="top-score">
<img src="@/assets/images/dialogs/zt.png" alt="" />
工程整体得分
<span
:style="{
color: project_info.total_score < warningNum[6] ? '#f86262' : '',
}"
>{{ project_info.total_score }}</span
>
</div>
<div class="top-score">
<img src="@/assets/images/dialogs/zfjg.png" alt="" />
政府监管得分
<span
:style="{
color:
project_info.regulation_score < warningNum[2] ? '#f86262' : '',
}"
>{{ project_info.regulation_score }}</span
>
</div>
<div class="top-score">
<img src="@/assets/images/dialogs/gczl.png" alt="" />
工程质量得分
<span
:style="{
color:
project_info.quality_total_score < warningNum[7] ? '#f86262' : '',
}"
>{{ project_info.quality_total_score }}</span
>
</div>
<div class="top-score">
<img src="@/assets/images/dialogs/cxcy.png" alt="" />
创新创优得分
<span
:style="{
color:
project_info.excellence_score < warningNum[3] ? '#f86262' : '',
}"
>{{ project_info.excellence_score }}</span
>
</div>
</div>
<div class="scores">
<div class="score-title">
<div class="title">
政府监管(得分：
<span
:style="{
color:
project_info.regulation_score < warningNum[2] ? '#f86262' : '',
}"
>
{{ project_info.regulation_score }})</span
>
<el-tooltip
v-if="project_info.regulation_score < warningNum[2]"
class="item"
effect="dark"
:content="`低于合格分：${warningNum[2]}分`"
placement="top"
>
<i class="el-icon-warning"></i>
</el-tooltip>
</div>
</div>
<div class="score-detail">
<!-- -->
<el-table border class="dialog-data-table" :data="question_info">
<el-table-column
label="问题总数"
align="center"
prop="total_num"
></el-table-column>
<el-table-column
label="一般问题数量"
align="center"
prop="yb_num"
></el-table-column>
<!-- <el-table-column
label="一般问题扣分"
align="center"
prop="yb_score"
></el-table-column> -->
<el-table-column
label="较重问题数量"
align="center"
prop="jz_num"
></el-table-column>
<!-- <el-table-column
label="较重问题扣分"
align="center"
prop="jz_score"
></el-table-column> -->
<el-table-column
label="严重问题数量"
align="center"
prop="yz_num"
></el-table-column>
<!-- <el-table-column
label="严重问题扣分"
align="center"
prop="yz_score"
></el-table-column> -->
<el-table-column
label="总扣分"
align="center"
prop="total_koufen"
></el-table-column>
<el-table-column
label="最终得分"
align="center"
prop="total_score"
></el-table-column>
</el-table>
</div>
</div>
<div class="scores">
<div class="score-title">
<div class="title">
工程质量(得分：
<span
:style="{
color:
project_info.quality_total_score < warningNum[7]
? '#f86262'
: '',
}"
>
{{ project_info.quality_total_score }})</span
>
<el-tooltip
v-if="project_info.quality_total_score < warningNum[7]"
class="item"
effect="dark"
:content="`低于合格分：${warningNum[7]}分`"
placement="top"
>
<i class="el-icon-warning"></i>
</el-tooltip>
</div>
</div>
<div class="score-detail" style="max-height: 6rem; overflow-y: auto">
<div class="inner-title">
质量检测<span>(得分：{{ project_info.quality_check_score }})</span>
</div>
<el-table
border
class="dialog-data-table"
:data="check_info"
:span-method="handleSpanJC"
style="margin-bottom: 10px; margin-top: 0"
>
<el-table-column
label="指标"
align="center"
prop="check_type_str"
></el-table-column>
<el-table-column label="部位" align="center" prop="is_important">
<template slot-scope="scope">
<span>{{
scope.row.is_important == 1 ? "重要部位" : "一般部位"
}}</span>
</template>
</el-table-column>
<el-table-column
v-for="column in columns"
:key="column.key"
:label="column.label"
align="center"
:prop="column.key"
></el-table-column>
</el-table>
<div class="inner-title">
质量评定<span>(得分：{{ project_info.quality_score }})</span>
</div>
<el-table
border
class="dialog-data-table"
:data="pd_info"
style="margin-top: 0"
:span-method="handleSpan"
>
<el-table-column
label="单位工程名称"
align="center"
prop="parent_name"
></el-table-column>
<el-table-column
label="是否为主要单位"
align="center"
prop="tis_main_unit_name"
></el-table-column>
<el-table-column
label="外观质量得分"
align="center"
prop="tappearance_quality_score"
></el-table-column>
<el-table-column
label="分部工程名称"
align="center"
prop="part_name"
></el-table-column>
<el-table-column
label="是否为主要分部"
align="center"
prop="is_main_distribution_name"
></el-table-column>
<el-table-column
label="重要隐蔽或关键单元工程个数"
align="center"
prop="concealed_critical_num"
></el-table-column>
<el-table-column
label="重要隐蔽或关键单元工程的优良率"
align="center"
prop="concealed_critical_percentage"
></el-table-column>
<el-table-column
label="一般单元工程个数"
align="center"
prop="general_num"
></el-table-column>
<el-table-column
label="一般单元工程优良率"
align="center"
prop="general_percentage"
></el-table-column>
</el-table>
</div>
</div>
<div class="scores">
<div class="score-title">
<div class="title">
创新创优(得分：
<span
:style="{
color:
project_info.excellence_score < warningNum[3] ? '#f86262' : '',
}"
>
{{ project_info.excellence_score }})</span
>
<el-tooltip
v-if="project_info.excellence_score < warningNum[3]"
class="item"
effect="dark"
:content="`低于合格分：${warningNum[3]}分`"
placement="top"
>
<i class="el-icon-warning"></i>
</el-tooltip>
</div>
</div>
<div class="score-detail">
<el-table border class="dialog-data-table" :data="excellence_info">
<el-table-column
label="创新工法"
align="center"
prop="cxgf_score"
></el-table-column>
<el-table-column
label="工程专利"
align="center"
prop="patent_score"
></el-table-column>
<el-table-column
label="优秀质量管理成果"
align="center"
prop="result_score"
></el-table-column>
<el-table-column
label="工程质量获奖"
align="center"
prop="city_project_score"
></el-table-column>
<el-table-column
label="最终得分"
align="center"
prop="total_score"
></el-table-column>
</el-table>
</div>
</div>
</Dialog>
</template>
<script>
import { getAreaDetail } from "@/api/dataStatis";
export default {
name: "AreaProjectDetail",
props: {
data: {
type: Object,
default: () => {
return {};
},
},
visible: {
type: Boolean,
default: false,
},
},
data() {
return {
formData: {},
project_info: {},
warningNum: {
1: 0,
2: 0,
3: 0,
4: 0,
5: 0,
6: 0,
7: 0,
},
excellence_info: [],
question_info: [],
pd_info: [],
columns: [],
allData: [],
check_info: [],
};
},
computed: {
dialogVisible: {
get() {
return this.visible;
},
set(val) {
this.$emit("change-visible", val);
},
},
},
methods: {
changeVisible(val) {
this.dialogVisible = val;
},
getData() {
getAreaDetail(this.data.id).then((res) => {
this.excellence_info = [res.data.excellence_info];
this.question_info = [res.data.question_info];
this.project_info = res.data.project_info;
this.pd_info = res.data.pd_info;
// this.check_info = res.data.check_info;
this.allData = [...res.data.check_info];
let arr = [];
res.data.check_info.forEach((item) => {
item[`unqualified_percent${item.entrust_type}`] =
item.unqualified_percent + "%";
let index = arr.findIndex(
(row) =>
row.check_type == item.check_type &&
row.is_important == item.is_important
);
if (index >= 0) {
arr[index][`unqualified_percent${item.entrust_type}`] =
item.unqualified_percent + "%";
} else {
arr.push(item);
}
});
this.getColumns();
this.check_info = arr;
});
// project_info 工程信息
// question_info 政府监管
// check_info质量检测
// pd_info评定
// excellence_info创新创优
},
handleSpan({ row, column, rowIndex, columnIndex }) {
if (columnIndex <= 2) {
// 只对 type 列进行处理
const rowspan = this.getRowspan(row, rowIndex);
if (rowspan >= 2) {
return {
rowspan,
colspan: 1,
};
} else {
return {
rowspan: 0,
colspan: 0,
};
}
}
},
getRowspan(row, rowIndex) {
const currentFactorMainNumber = row.tid;
let rowspan = 1; // 默认rowspan为1，也就是每个单元格只占一行
// 如果当前行不是第一行，则先查看前一行，如果前一行的值（同列单元格）与当前行（同列单元格）相同，则将当前单元格与前一行合并（当前单元格占0行，rowspan=0）
if (rowIndex > 0) {
const previousRow = this.pd_info[rowIndex - 1];
const previousFactorMainNumber = previousRow.tid;
if (currentFactorMainNumber === previousFactorMainNumber) {
return 0;
}
}
// 然后向查看，如果后面行（同列单元格）的值与当前行（同列单元格）相同，则每找到一行rowspan加1，直到找到与当前行（同列单元格）的值不同的行为止。（也就是说只能合并连续的行）
for (let i = rowIndex + 1; i < this.pd_info.length; i++) {
const nextRow = this.pd_info[i];
const nextFactorMainNumber = nextRow.tid;
if (currentFactorMainNumber === nextFactorMainNumber) {
rowspan++;
} else {
break;
}
}
return rowspan;
},
handleSpanJC({ row, column, rowIndex, columnIndex }) {
if (columnIndex == 0) {
// 只对 type 列进行处理
const rowspan = this.getRowspanJC(row, rowIndex);
if (rowspan >= 1) {
return {
rowspan,
colspan: 1,
};
} else {
return {
rowspan: 0,
colspan: 0,
};
}
}
},
getRowspanJC(row, rowIndex) {
const currentFactorMainNumber = row.check_type;
let rowspan = 1; // 默认rowspan为1，也就是每个单元格只占一行
// 如果当前行不是第一行，则先查看前一行，如果前一行的值（同列单元格）与当前行（同列单元格）相同，则将当前单元格与前一行合并（当前单元格占0行，rowspan=0）
if (rowIndex > 0) {
const previousRow = this.check_info[rowIndex - 1];
const previousFactorMainNumber = previousRow.check_type;
if (currentFactorMainNumber === previousFactorMainNumber) {
return 0;
}
}
// 然后向查看，如果后面行（同列单元格）的值与当前行（同列单元格）相同，则每找到一行rowspan加1，直到找到与当前行（同列单元格）的值不同的行为止。（也就是说只能合并连续的行）
for (let i = rowIndex + 1; i < this.check_info.length; i++) {
const nextRow = this.check_info[i];
const nextFactorMainNumber = nextRow.check_type;
if (currentFactorMainNumber === nextFactorMainNumber) {
rowspan++;
} else {
break;
}
}
return rowspan;
},
getColumns() {
let arr = [];
this.allData.forEach((item) => {
let index = arr.findIndex((row) => row.key == item.entrust_type);
if (index == -1) {
arr.push({ key: item.entrust_type, value: item.entrust_type_str });
}
});
arr.forEach((item) => {
this.columns.push({
label: item.value + "不合格率",
key: `unqualified_percent${item.key}`,
});
});
console.log(this.columns);
this.columns = [...this.columns];
console.log(arr, "arr");
},
},
mounted() {},
watch: {
dialogVisible(val) {
if (val) {
this.warningNum = window.warningNum;
this.$nextTick(() => {
this.getData();
});
}
},
},
};
</script>
<style lang="less" scoped>
.scores {
margin-bottom: 10px;
}
.score-title {
background: #16488b;
padding: 0 24px;
line-height: 40px;
display: flex;
justify-content: space-between;
.title {
font-size: 14px;
color: #60fff6;
font-weight: bold;
position: relative;
&::before {
position: absolute;
content: "";
width: 3px;
height: 16px;
background: #60fff6;
left: -12px;
top: 50%;
transform: translateY(-50%);
}
}
.got-score {
color: #d9d9d9;
font-size: 14px;
}
}
.score-detail {
background: #0c3163;
border: 1px solid #1f4c89;
border-top: 0;
padding: 12px 20px;
}
.w-50 {
width: 50%;
text-align: left;
color: #d9d9d9;
font-size: 14px;
}
::v-deep .el-dialog .el-dialog__body {
min-height: 400px !important;
height: inherit !important;
}
.top-scores {
display: flex;
justify-content: space-between;
margin-bottom: 10px;
.top-score {
width: calc(25% - 6px);
font-size: 16px;
line-height: 40px;
padding: 15px 30px;
background: #12407f;
color: #d9d9d9;
white-space: nowrap;
&:first-child {
background: #117093;
border: 4px solid #1d81a6;
}
span {
font-size: 28px;
vertical-align: top;
line-height: 40px;
font-weight: bold;
margin-left: 20px;
}
img {
width: 40px;
height: 40px;
vertical-align: top;
margin-right: 10px;
}
}
}
.inner-title {
background: #16488b;
line-height: 40px;
text-align: center;
color: #0fd8d0;
span {
color: #fff;
}
}
.el-icon-warning {
color: red;
font-size: 0.2rem;
margin-left: 0.12rem;
line-height: 0.4rem;
vertical-align: top;
}
</style>
\ No newline at end of file
src/views/DataStatis/Dialogs/CXCYDialog.vue 0 → 100644
View file @ ced7199f
<template>
<Dialog
title="创新创优详情"
:visible="dialogVisible"
width="600"
@change-visible="changeVisible"
:destroy-on-close="true"
>
<div class="project-name">
<div>
<img src="@/assets/images/index/project.png" alt="" />
{{ data.project_name }}
</div>
<div>
创新创优得分：<span class="count">{{ data.excellence_score }}</span>
</div>
</div>
<div class="scores">
<div class="score-title">
<div class="title">创新工法</div>
<div class="got-score">得分：{{ formData.cxgf_score }}/24</div>
</div>
<div class="score-detail">
<div class="w-50">省级以上工法：{{ formData.province_num }}</div>
<div class="w-50">国家级工法：{{ formData.country_num }}</div>
</div>
</div>
<div class="scores">
<div class="score-title">
<div class="title">工程专利</div>
<div class="got-score">得分：{{ formData.patent_score }}/30</div>
</div>
<div class="score-detail">
<div class="w-50">发明专利数：{{ formData.invention_patent_num }}</div>
<div class="w-50">
实用新型专利：{{ formData.practical_patent_num }}
</div>
</div>
</div>
<div class="scores">
<div class="score-title">
<div class="title">优秀质量管理成果</div>
<div class="got-score">得分：{{ formData.result_score }}/28</div>
</div>
<div class="score-detail">
<div class="w-50">国家级：{{ formData.country_result_num }}</div>
<div class="w-50">省部级：{{ formData.province_result_num }}</div>
</div>
</div>
<div class="scores">
<div class="score-title">
<div class="title">工程质量获奖</div>
<div class="got-score">得分：{{ formData.city_project_score }}/18</div>
</div>
<div class="score-detail">
<div class="w-50">工程质量获奖：{{ formData.city_project_num }}</div>
</div>
</div>
</Dialog>
</template>
<script>
import { getExcellenceDetail } from "@/api/dataStatis";
export default {
name: "CXCYDetail",
props: {
data: {
type: Object,
default: () => {
return {};
},
},
visible: {
type: Boolean,
default: false,
},
},
data() {
return {
formData: {},
};
},
computed: {
dialogVisible: {
get() {
return this.visible;
},
set(val) {
this.$emit("change-visible", val);
},
},
},
methods: {
changeVisible(val) {
this.dialogVisible = val;
},
getData() {
getExcellenceDetail(this.data.id).then((res) => {
this.formData = res.data.data[0] ? res.data.data[0] : {};
});
},
},
mounted() {},
watch: {
dialogVisible(val) {
if (val) {
this.$nextTick(() => {
this.getData();
});
}
},
},
};
</script>
<style lang="less" scoped>
.project-name {
line-height: 50px;
padding: 0 10px;
background: #12407f;
display: flex;
justify-content: space-between;
margin-bottom: 10px;
color: #60fff6;
font-size: 14px;
.count {
font-size: 20px;
font-weight: bold;
vertical-align: top;
}
img {
width: 20px;
vertical-align: top;
margin: 15px 10px;
}
}
.scores {
margin-bottom: 10px;
}
.score-title {
background: #16488b;
padding: 0 24px;
line-height: 40px;
display: flex;
justify-content: space-between;
.title {
font-size: 14px;
color: #60fff6;
font-weight: bold;
position: relative;
&::before {
position: absolute;
content: "";
width: 3px;
height: 16px;
background: #60fff6;
left: -12px;
top: 50%;
transform: translateY(-50%);
}
}
.got-score {
color: #d9d9d9;
font-size: 14px;
}
}
.score-detail {
background: #0c3163;
border: 1px solid #1f4c89;
border-top: 0;
padding: 12px 20px;
display: flex;
justify-content: flex-start;
}
.w-50 {
width: 50%;
text-align: left;
color: #d9d9d9;
font-size: 14px;
}
::v-deep .el-dialog .el-dialog__body {
min-height: 400px !important;
height: inherit !important;
}
</style>
\ No newline at end of file
src/views/DataStatis/Dialogs/GCZLDialog/Index.vue 0 → 100644
View file @ ced7199f
<template>
<Dialog
title="工程质量详情"
:visible="dialogVisible"
width="70%"
@change-visible="changeVisible"
>
<DialogTabs
:tabList="tabList"
:currentTab="currentTabNow"
@change="(val) => changeTab(val)"
></DialogTabs>
<component :is="currentTabNow" :data="data"></component>
</Dialog>
</template>
<script>
import ZLPD from "./ZLJCPD.vue";
import ZLJC from "./ZLJC.vue";
export default {
name: "GCZLIndex",
components: { ZLPD, ZLJC },
props: {
visible: {
type: Boolean,
default: false,
},
data: {
type: Object,
default: () => {
return {};
},
},
},
data() {
return {
tabList: [
{ name: "ZLPD", label: "质量评定" },
{ name: "ZLJC", label: "质量检测" },
],
currentTabNow: "",
};
},
computed: {
dialogVisible: {
get() {
return this.visible;
},
set(val) {
this.$emit("change-visible", val);
},
},
},
methods: {
changeTab(e) {
this.currentTabNow = e;
},
changeVisible(val) {
this.dialogVisible = val;
},
},
mounted() {
this.$eventBus.$on("switchTabGC", (type) => {
this.$nextTick(() => {
this.currentTabNow = type;
});
});
},
watch: {
dialogVisible(val) {
if (val) {
this.currentTabNow = "ZLPD";
} else {
this.currentTabNow = "";
}
},
},
};
</script>
<style lang="less" scoped>
</style>
\ No newline at end of file
src/views/DataStatis/Dialogs/GCZLDialog/ZLJC.vue 0 → 100644
View file @ ced7199f
<template>
<div style="height: 100%; margin-top: 10px">
<div class="project-name">
<div>
<img src="@/assets/images/index/project.png" alt="" />
{{ data.project_name }}
</div>
<div>
质量检测得分：<span class="count">{{ data.quality_check_score }}</span>
</div>
</div>
<el-table
border
class="dialog-data-table"
:data="tableData"
v-loading="loading"
:element-loading-background="loadingBG"
height="calc(100% - .7rem)"
:span-method="handleSpan"
>
<el-table-column
label="指标"
align="center"
prop="check_type_str"
></el-table-column>
<el-table-column label="部位" align="center" prop="is_important">
<template slot-scope="scope">
<span>{{
scope.row.is_important == 1 ? "重要部位" : "一般部位"
}}</span>
</template>
</el-table-column>
<el-table-column
v-for="column in columns"
:key="column.key"
:label="column.label"
align="center"
:prop="column.key"
></el-table-column>
</el-table>
</div>
</template>
<script>
import { getZLJCList } from "@/api/dataStatis";
export default {
name: "ZFJGDetail",
props: {
data: {
type: Object,
default: () => {
return {};
},
},
},
data() {
return {
tableData: [],
loading: false,
loadingBG: "rgba(0, 0, 0, 0.2)",
columns: [],
allData: [],
};
},
methods: {
changeVisible(val) {
this.dialogVisible = val;
},
changeTime(tr) {
this.searchForm.start_time = tr[0] ? tr[0] : "";
this.searchForm.end_time = tr[1] ? tr[1] : "";
},
handleSearch() {
this.$refs.table.getData();
},
handleSpan({ row, column, rowIndex, columnIndex }) {
if (columnIndex == 0) {
// 只对 type 列进行处理
const rowspan = this.getRowspan(row, rowIndex);
if (rowspan >= 1) {
return {
rowspan,
colspan: 1,
};
} else {
return {
rowspan: 0,
colspan: 0,
};
}
}
},
getRowspan(row, rowIndex) {
const currentFactorMainNumber = row.check_type;
let rowspan = 1; // 默认rowspan为1，也就是每个单元格只占一行
// 如果当前行不是第一行，则先查看前一行，如果前一行的值（同列单元格）与当前行（同列单元格）相同，则将当前单元格与前一行合并（当前单元格占0行，rowspan=0）
if (rowIndex > 0) {
const previousRow = this.tableData[rowIndex - 1];
const previousFactorMainNumber = previousRow.check_type;
if (currentFactorMainNumber === previousFactorMainNumber) {
return 0;
}
}
// 然后向查看，如果后面行（同列单元格）的值与当前行（同列单元格）相同，则每找到一行rowspan加1，直到找到与当前行（同列单元格）的值不同的行为止。（也就是说只能合并连续的行）
for (let i = rowIndex + 1; i < this.tableData.length; i++) {
const nextRow = this.tableData[i];
const nextFactorMainNumber = nextRow.check_type;
if (currentFactorMainNumber === nextFactorMainNumber) {
rowspan++;
} else {
break;
}
}
return rowspan;
},
getData() {
getZLJCList(this.data.id).then((res) => {
this.allData = [...res.data.score_data];
let arr = [];
res.data.score_data.forEach((item) => {
item[`unqualified_percent${item.entrust_type}`] =
item.unqualified_percent + "%";
let index = arr.findIndex(
(row) =>
row.check_type == item.check_type &&
row.is_important == item.is_important
);
if (index >= 0) {
arr[index][`unqualified_percent${item.entrust_type}`] =
item.unqualified_percent + "%";
} else {
arr.push(item);
}
});
console.log(arr);
this.getColumns();
this.tableData = arr;
});
},
getColumns() {
let arr = [];
this.allData.forEach((item) => {
let index = arr.findIndex((row) => row.key == item.entrust_type);
if (index == -1) {
arr.push({ key: item.entrust_type, value: item.entrust_type_str });
}
});
arr.forEach((item) => {
this.columns.push({
label: item.value + "不合格率",
key: `unqualified_percent${item.key}`,
});
});
console.log(this.columns);
this.columns = [...this.columns];
console.log(arr, "arr");
},
},
mounted() {
this.getData();
},
};
</script>
<style lang="less" scoped>
.project-name {
line-height: 50px;
padding: 0 10px;
background: #12407f;
display: flex;
justify-content: space-between;
margin-bottom: 10px;
color: #60fff6;
font-size: 14px;
.count {
font-size: 20px;
font-weight: bold;
vertical-align: top;
}
img {
width: 20px;
vertical-align: top;
margin: 15px 10px;
}
}
</style>
\ No newline at end of file
src/views/DataStatis/Dialogs/GCZLDialog/ZLJCPD.vue 0 → 100644
View file @ ced7199f
<template>
<div style="height: 100%; margin-top: 10px">
<div class="project-name">
<div>
<img src="@/assets/images/index/project.png" alt="" />
{{ data.project_name }}
</div>
<div>
质量评定得分：<span class="count">{{ data.quality_score }}</span>
</div>
</div>
<el-table
border
class="dialog-data-table"
:data="tableData"
v-loading="loading"
:element-loading-background="loadingBG"
height="calc(100% - .7rem)"
:span-method="handleSpan"
>
<el-table-column
label="单位工程名称"
align="center"
prop="parent_name"
></el-table-column>
<el-table-column
label="是否为主要单位"
align="center"
prop="tis_main_unit_name"
></el-table-column>
<el-table-column
label="外观质量得分"
align="center"
prop="tappearance_quality_score"
></el-table-column>
<el-table-column
label="分部工程名称"
align="center"
prop="part_name"
></el-table-column>
<el-table-column
label="是否为主要分部"
align="center"
prop="is_main_distribution_name"
></el-table-column>
<el-table-column
label="重要隐蔽或关键单元工程个数"
align="center"
prop="concealed_critical_num"
></el-table-column>
<el-table-column
label="重要隐蔽或关键单元工程的优良率"
align="center"
prop="concealed_critical_percentage"
></el-table-column>
<el-table-column
label="一般单元工程个数"
align="center"
prop="general_num"
></el-table-column>
<el-table-column
label="一般单元工程优良率"
align="center"
prop="general_percentage"
></el-table-column>
</el-table>
</div>
</template>
<script>
import { getZLPDList } from "@/api/dataStatis";
export default {
name: "ZFJGDetail",
props: {
data: {
type: Object,
default: () => {
return {};
},
},
},
data() {
return {
tableData: [],
loading: false,
loadingBG: "rgba(0, 0, 0, 0.2)",
};
},
methods: {
changeVisible(val) {
this.dialogVisible = val;
},
changeTime(tr) {
this.searchForm.start_time = tr[0] ? tr[0] : "";
this.searchForm.end_time = tr[1] ? tr[1] : "";
},
handleSearch() {
this.$refs.table.getData();
},
handleSpan({ row, column, rowIndex, columnIndex }) {
if (columnIndex <= 2) {
// 只对 type 列进行处理
const rowspan = this.getRowspan(row, rowIndex);
if (rowspan >= 2) {
return {
rowspan,
colspan: 1,
};
} else {
return {
rowspan: 0,
colspan: 0,
};
}
}
},
getRowspan(row, rowIndex) {
const currentFactorMainNumber = row.tid;
let rowspan = 1; // 默认rowspan为1，也就是每个单元格只占一行
// 如果当前行不是第一行，则先查看前一行，如果前一行的值（同列单元格）与当前行（同列单元格）相同，则将当前单元格与前一行合并（当前单元格占0行，rowspan=0）
if (rowIndex > 0) {
const previousRow = this.tableData[rowIndex - 1];
const previousFactorMainNumber = previousRow.tid;
if (currentFactorMainNumber === previousFactorMainNumber) {
return 0;
}
}
// 然后向查看，如果后面行（同列单元格）的值与当前行（同列单元格）相同，则每找到一行rowspan加1，直到找到与当前行（同列单元格）的值不同的行为止。（也就是说只能合并连续的行）
for (let i = rowIndex + 1; i < this.tableData.length; i++) {
const nextRow = this.tableData[i];
const nextFactorMainNumber = nextRow.tid;
if (currentFactorMainNumber === nextFactorMainNumber) {
rowspan++;
} else {
break;
}
}
return rowspan;
},
getData() {
getZLPDList(this.data.id).then((res) => {
this.tableData = res.data.list;
});
},
},
mounted() {
this.getData();
},
};
</script>
<style lang="less" scoped>
.project-name {
line-height: 50px;
padding: 0 10px;
background: #12407f;
display: flex;
justify-content: space-between;
margin-bottom: 10px;
color: #60fff6;
font-size: 14px;
.count {
font-size: 20px;
font-weight: bold;
vertical-align: top;
}
img {
width: 20px;
vertical-align: top;
margin: 15px 10px;
}
}
</style>
\ No newline at end of file
src/views/DataStatis/Dialogs/QuestionDetail.vue 0 → 100644
View file @ ced7199f
<template>
<Dialog
title="问题详情"
:visible="dialogVisible"
width="8rem"
@change-visible="changeVisible"
:destroy-on-close="true"
>
<div class="scores">
<div class="score-title">
<div class="title">问题信息</div>
<div
class="got-score"
:style="{ color: data.question_status == 1 ? '#DF3333' : '#30B34F' }"
>
{{ data.question_status_str }}
</div>
</div>
<div class="score-detail">
<div class="w-100">工程名称：{{ data.project_name }}</div>
<div class="w-100">所在地址：{{ data.address }}</div>
<div class="w-100">
负责人：{{ data.person_name }} / {{ data.person_mobile }}
</div>
<div class="w-100">标段名称：{{ data.lot_project_name }}</div>
<div class="w-100">所属机构：{{ data.c_company_name }}</div>
<div class="w-100">所属单位：{{ data.units_company_name }}</div>
<div class="w-100">问题分类：{{ data.category_name }}</div>
<div class="w-100">问题等级：{{ data.question_level_str }}</div>
<div class="w-100">问题种类：{{ data.question_type_str }}</div>
<div class="w-100">处理状态：{{ data.question_status_str }}</div>
<div class="w-100">法规依据：{{ data.legal_basis }}</div>
<div class="w-100">系统问题描述：{{ data.system_question }}</div>
<div class="w-100">用户问题描述：{{ data.user_question }}</div>
</div>
</div>
</Dialog>
</template>
<script>
import { getZFJGQuestionDetail } from "@/api/dataStatis";
export default {
name: "QuestionDetail",
props: {
visible: {
type: Boolean,
default: false,
},
questionId: {
type: [String, Number],
default: "",
},
},
data() {
return {
data: {},
};
},
computed: {
dialogVisible: {
get() {
return this.visible;
},
set(val) {
this.$emit("change-visible", val);
},
},
},
methods: {
changeVisible(val) {
this.dialogVisible = val;
},
getData() {
getZFJGQuestionDetail(this.questionId).then((res) => {
this.data = res.data;
});
},
},
mounted() {},
watch: {
visible(val) {
if (val) {
this.getData();
}
},
},
};
</script>
<style lang="less" scoped>
.project-name {
line-height: 50px;
padding: 0 10px;
background: #12407f;
display: flex;
justify-content: space-between;
margin-bottom: 10px;
color: #60fff6;
font-size: 14px;
.count {
font-size: 20px;
font-weight: bold;
vertical-align: top;
}
img {
width: 20px;
vertical-align: top;
margin: 15px 10px;
}
}
.scores {
margin-bottom: 10px;
}
.score-title {
background: #16488b;
padding: 0 24px;
line-height: 40px;
display: flex;
justify-content: space-between;
.title {
font-size: 14px;
color: #60fff6;
font-weight: bold;
position: relative;
&::before {
position: absolute;
content: "";
width: 3px;
height: 16px;
background: #60fff6;
left: -12px;
top: 50%;
transform: translateY(-50%);
}
}
.got-score {
color: #d9d9d9;
font-size: 14px;
}
}
.score-detail {
background: #0c3163;
border: 1px solid #1f4c89;
border-top: 0;
padding: 12px 20px;
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
}
.w-100 {
width: 100%;
text-align: left;
color: #d9d9d9;
font-size: 14px;
line-height: 28px;
}
::v-deep .el-dialog .el-dialog__body {
min-height: 400px !important;
height: inherit !important;
}
</style>
\ No newline at end of file
src/views/DataStatis/Dialogs/ZFJGDialog.vue 0 → 100644
View file @ ced7199f
<template>
<Dialog
title="政府监管工程详情"
:visible="dialogVisible"
width="80%"
@change-visible="changeVisible"
:destroy-on-close="true"
>
<div class="project-name">
<div>
<img src="@/assets/images/index/project.png" alt="" />
{{ data.project_name }}
</div>
<div>
政府监管得分：<span class="count">{{ data.regulation_score }}</span>
</div>
</div>
<el-form inline :model="searchForm" class="search-form">
<el-form-item label="记录时间：">
<el-date-picker
v-model="dateRange"
type="datetimerange"
start-placeholder="开始时间"
end-placeholder="结束时间"
value-format="yyyy-MM-dd HH:mm:ss"
@change="changeTime"
/>
</el-form-item>
<el-form-item label="问题类型：">
<el-input size="small" v-model="searchForm.category_name"></el-input>
</el-form-item>
<el-form-item label="问题种类：">
<el-select
style="width: 1rem"
v-model="searchForm.question_type"
size="small"
clearable
>
<el-option
v-for="option in question_type"
:label="option.value"
:value="option.key"
:key="option.key"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="问题等级：">
<el-select
style="width: 1rem"
v-model="searchForm.question_level"
size="small"
clearable
>
<el-option
v-for="option in question_level"
:label="option.value"
:value="option.key"
:key="option.key"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="处理状态：">
<el-select
style="width: 1rem"
v-model="searchForm.question_status"
size="small"
clearable
>
<el-option
v-for="option in question_status"
:label="option.value"
:value="option.key"
:key="option.key"
></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="handleSearch" size="small"
>查询</el-button
>
</el-form-item>
</el-form>
<DialogApiDataTable
:has-index="true"
ref="table"
:columns="columns"
:parameters="searchForm"
:api="api"
:auto-load="false"
@row-click="showQuestionDetail"
>
<template #question_level_str="{ data }">
<span
:style="{
color: data.question_level == 1 ? '#E27F37' : '#DF3333',
}"
>
{{ data.question_level_str }}
</span>
</template>
<template #question_status_str="{ data }">
<span
:style="{
color: data.question_status == 1 ? '#DF3333' : '#30B34F',
}"
>
{{ data.question_status_str }}
</span>
</template>
</DialogApiDataTable>
<QuestionDetail
:question-id="questionId"
:visible="questionVisible"
@change-visible="(val) => (questionVisible = val)"
>
</QuestionDetail>
</Dialog>
</template>
<script>
import { getZFJGConfig, getZFJGQuestionList } from "@/api/dataStatis";
import QuestionDetail from "./QuestionDetail.vue";
export default {
name: "ZFJGDetail",
components: { QuestionDetail },
props: {
data: {
type: Object,
default: () => {
return {};
},
},
visible: {
type: Boolean,
default: false,
},
},
data() {
return {
searchForm: {},
dateRange: [],
api: getZFJGQuestionList,
columns: [
{
label: "标段",
prop: "lot_project_name",
minWidth: "300px",
},
{
label: "机构名称",
prop: "c_company_name",
minWidth: "200px",
},
{
label: "单位名称",
prop: "units_company_name",
minWidth: "200px",
},
{
label: "单位类型",
prop: "utype_str",
minWidth: "100px",
},
{
label: "问题类型",
prop: "name",
minWidth: "120px",
},
{
label: "问题种类",
prop: "question_type_str",
minWidth: "100px",
},
{
label: "用户问题描述",
prop: "user_question",
minWidth: "300px",
},
{
label: "记录时间",
prop: "create_time",
minWidth: "150px",
},
{
label: "问题等级",
prop: "question_level_str",
hasSlot: true,
minWidth: "100px",
},
{
label: "处理状态",
prop: "question_status_str",
minWidth: "100px",
hasSlot: true,
},
],
question_level: [],
question_status: [],
question_type: [],
questionVisible: false,
questionId: "",
};
},
computed: {
dialogVisible: {
get() {
return this.visible;
},
set(val) {
this.$emit("change-visible", val);
},
},
},
methods: {
changeVisible(val) {
this.dialogVisible = val;
},
changeTime(tr) {
this.searchForm.start_time = tr[0] ? tr[0] : "";
this.searchForm.end_time = tr[1] ? tr[1] : "";
},
handleSearch() {
this.$refs.table.getData();
},
showQuestionDetail(row) {
this.questionId = row.id;
this.questionVisible = true;
},
},
mounted() {
getZFJGConfig().then((res) => {
for (let i in res.data.question_level) {
this.question_level.push({
key: i,
value: res.data.question_level[i],
});
}
for (let i in res.data.question_status) {
this.question_status.push({
key: i,
value: res.data.question_status[i],
});
}
for (let i in res.data.question_type) {
this.question_type.push({
key: i,
value: res.data.question_type[i],
});
}
});
},
watch: {
dialogVisible(val) {
if (val) {
this.searchForm = {
project_id: this.data.id,
};
this.dateRange = [];
this.$nextTick(() => {
this.handleSearch();
});
}
},
},
};
</script>
<style lang="less" scoped>
.project-name {
line-height: 50px;
padding: 0 10px;
background: #12407f;
display: flex;
justify-content: space-between;
margin-bottom: 10px;
color: #60fff6;
font-size: 14px;
.count {
font-size: 20px;
font-weight: bold;
vertical-align: top;
}
img {
width: 20px;
vertical-align: top;
margin: 15px 10px;
}
}
</style>
\ No newline at end of file
src/views/DataStatis/Index.vue
View file @ ced7199f
<template>
<div id="data-statis">
<div id="amap-container"></div>
<!-- v-loading="mapLoading"
element-loading-background="rgba(0, 0, 0, 0.2)"
element-loading-text="地图加载中..." -->
<div class="left-area">
<Section class="sections" title="政府监管">
<template #right-slot>
<span class="show-more" @click="showZFJG">查看更多</span>
</template>
<STable :headers="header1" :table-data="data1">
<STable
:headers="header1"
:table-data="data1"
@row-click="rowClickZFJG"
>
<template slot-scope="scope">
<template v-if="scope.header.slot == 'regulation_score'">
<span
:style="{
color: scope.row.regulation_score < 80 ? '#f86262' : '',
color:
scope.row.regulation_score < warningNum[2] ? '#f86262' : '',
}"
>{{ scope.row.regulation_score }}</span
>
......@@ -26,12 +29,17 @@
<template #right-slot>
<span class="show-more" @click="showGCZL">查看更多</span>
</template>
<STable :headers="header2" :table-data="data2">
<STable
:headers="header2"
:table-data="data2"
@row-click="rowClickGCZL"
>
<template slot-scope="scope">
<template v-if="scope.header.slot == 'quality_score'">
<span
:style="{
color: scope.row.quality_score < 80 ? '#f86262' : '',
color:
scope.row.quality_score < warningNum[5] ? '#f86262' : '',
}"
>{{ scope.row.quality_score }}</span
>
......@@ -39,7 +47,10 @@
<template v-if="scope.header.slot == 'quality_check_score'">
<span
:style="{
color: scope.row.quality_check_score < 80 ? '#f86262' : '',
color:
scope.row.quality_check_score < warningNum[4]
? '#f86262'
: '',
}"
>{{ scope.row.quality_check_score }}</span
>
......@@ -47,7 +58,10 @@
<template v-if="scope.header.slot == 'quality_total_score'">
<span
:style="{
color: scope.row.quality_total_score < 80 ? '#f86262' : '',
color:
scope.row.quality_total_score < warningNum[6]
? '#f86262'
: '',
}"
>{{ scope.row.quality_total_score }}</span
>
......@@ -59,12 +73,17 @@
<template #right-slot>
<span class="show-more" @click="showCXCY">查看更多</span>
</template>
<STable :headers="header3" :table-data="data3">
<STable
:headers="header3"
:table-data="data3"
@row-click="rowClickCXCY"
>
<template slot-scope="scope">
<template v-if="scope.header.slot == 'excellence_score'">
<span
:style="{
color: scope.row.excellence_score < 80 ? '#f86262' : '',
color:
scope.row.excellence_score < warningNum[3] ? '#f86262' : '',
}"
>{{ scope.row.excellence_score }}</span
>
......@@ -82,13 +101,16 @@
<div class="points">
<div
class="grade"
:style="{ color: score_count < 80 ? '#f86262' : '#5aefd1' }"
:style="{
color: score_count < warningNum[6] ? '#f86262' : '#5aefd1',
}"
>
<div class="label">区域总得分：</div>
<countTo
:decimals="2"
ref="countTo"
:startVal="0"
:endVal="score_count"
:endVal="Number(score_count)"
:duration="3000"
></countTo>
</div>
......@@ -109,28 +131,57 @@
:style="{ marginTop: '.1rem', height: 'calc(100% - .6rem)' }"
:headers="header4_1"
:table-data="data4"
@row-click="rowClickArea"
>
<template slot-scope="scope">
<template v-if="scope.header.slot == 'regulation_score'">
<span
:style="{
color: scope.row.regulation_score < 80 ? '#f86262' : '',
color:
scope.row.regulation_score < warningNum[2] ? '#f86262' : '',
}"
>
<countTo
:decimals="
getDecimalPlaces(Number(scope.row.regulation_score))
"
:startVal="0"
:endVal="Number(scope.row.regulation_score)"
:duration="3000"
></countTo>
</span>
</template>
<template v-if="scope.header.slot == 'excellence_score'">
<span
:style="{
color:
scope.row.excellence_score < warningNum[3] ? '#f86262' : '',
}"
>
<countTo
:decimals="
getDecimalPlaces(Number(scope.row.excellence_score))
"
:startVal="0"
:endVal="Number(scope.row.excellence_score)"
:duration="3000"
></countTo
></span>
</template>
<template v-if="scope.header.slot == 'quality_total_score'">
<span
:style="{
color: scope.row.quality_total_score < 80 ? '#f86262' : '',
color:
scope.row.quality_total_score < warningNum[7]
? '#f86262'
: '',
}"
>
<countTo
:decimals="
getDecimalPlaces(Number(scope.row.quality_total_score))
"
:startVal="0"
:endVal="Number(scope.row.quality_total_score)"
:duration="3000"
......@@ -139,9 +190,12 @@
</template>
<template v-if="scope.header.slot == 'total_score'">
<span
:style="{ color: scope.row.total_score < 80 ? '#f86262' : '' }"
:style="{
color: scope.row.total_score < warningNum[6] ? '#f86262' : '',
}"
>
<countTo
:decimals="getDecimalPlaces(Number(scope.row.total_score))"
:startVal="0"
:endVal="Number(scope.row.total_score)"
:duration="3000"
......@@ -165,24 +219,39 @@
:visible="projectListVisible"
@change-visible="(val) => (projectListVisible = val)"
></ProjectList>
<ZFJGDialog
:data="currentRowData"
:visible="ZFJGVisible"
@change-visible="(val) => (ZFJGVisible = val)"
></ZFJGDialog>
<CXCYDialog
:data="currentRowData"
:visible="CXCYVisible"
@change-visible="(val) => (CXCYVisible = val)"
></CXCYDialog>
<GCZLDialog
:data="currentRowData"
:visible="GCZLVisible"
@change-visible="(val) => (GCZLVisible = val)"
></GCZLDialog>
<AreaProjectDetail
:data="currentRowData"
:visible="areaDialogVisible"
@change-visible="(val) => (areaDialogVisible = val)"
></AreaProjectDetail>
<div class="bottom-area">
<Section2 title="严重问题预警" class="bottom-section">
<STable2 :headers="header5" :table-data="data5">
<template slot-scope="scope">
<template v-if="scope.header.slot == 'count'">
<span
>{{ scope.row.question_count }}/<span style="color: green">{{
scope.row.question_general
}}</span></span
>
</template>
</template>
</STable2>
<STable2
:headers="header5"
:table-data="data5"
@row-click="rowClickArea"
></STable2>
</Section2>
</div>
<!-- <img src="@/assets/images/index/lt.png" class="lt" alt="" />
<img src="@/assets/images/index/rt.png" class="rt" alt="" />
<img src="@/assets/images/index/btm.png" class="btm" alt="" /> -->
</div>
</template>
<script>
......@@ -190,13 +259,10 @@ import * as echarts from "echarts";
import { zhejiangJson } from "@/assets/data/zhejiang.js";
import {
getMapData,
getYearQuestion,
getLevelQuestion,
getStatusQuestion,
getScoreByCity,
getScoreStatusByCity,
getProjectList,
getImportantQuestion,
getWarningStatusNum,
} from "@/api/dataStatis";
import { mapState } from "vuex";
......@@ -205,6 +271,10 @@ import Section2 from "@/components/common/Section2.vue";
import STable2 from "@/components/common/STable2.vue";
import ProjectList from "@/views/DataStatis/project/Index.vue";
import CountTo from "vue-count-to";
import ZFJGDialog from "./Dialogs/ZFJGDialog.vue";
import CXCYDialog from "./Dialogs/CXCYDialog.vue";
import GCZLDialog from "./Dialogs/GCZLDialog/Index.vue";
import AreaProjectDetail from "./Dialogs/AreaProjectDetail.vue";
export default {
name: "DataStatis",
components: {
......@@ -212,6 +282,10 @@ export default {
STable2,
ProjectList,
CountTo,
ZFJGDialog,
CXCYDialog,
GCZLDialog,
AreaProjectDetail,
},
data() {
return {
......@@ -282,89 +356,18 @@ export default {
slot: "excellence_score",
},
],
// header1: [
// {
// name: "市区",
// props: "city_name",
// width: "calc(100% / 5 - .1rem)",
// },
// {
// name: "政府监管",
// props: "zfjg",
// width: "calc(100% / 5)",
// },
// {
// name: "质量管理制度",
// props: "zlglzd",
// width: "calc(100% / 5 + .1rem)",
// },
// {
// name: "资质资格",
// props: "zzzg",
// width: "calc(100% / 5)",
// },
// {
// name: "实体质量",
// props: "stzl",
// width: "calc(100% / 5)",
// },
// ],
data1: [],
// header2: [
// {
// name: "市区",
// props: "city_name",
// width: "calc(100% / 4)",
// },
// {
// name: "严重问题",
// props: "serious",
// width: "calc(100% / 4)",
// },
// {
// name: "一般问题",
// props: "general",
// width: "calc(100% / 4)",
// },
// {
// name: "问题总数",
// props: "count",
// width: "calc(100% / 4)",
// },
// ],
data2: [],
// header3: [
// {
// name: "市区",
// props: "city_name",
// width: "20%",
// },
// {
// name: "涉及工程",
// props: "project_count",
// width: "20%",
// },
// {
// name: "涉及单位",
// props: "units_count",
// width: "20%",
// },
// {
// name: "问题总数/已处理数",
// props: "count",
// slot: "count",
// width: "40%",
// },
// ],
data3: [],
header4_1: [
{
name: "工程名称",
props: "project_name",
width: "40%",
width: "35%",
headerStyle: {
textAlign: "left",
},
......@@ -374,15 +377,21 @@ export default {
{
name: "政府监管",
props: "regulation_score",
width: "20%",
width: "15%",
slot: "regulation_score",
},
{
name: "工程质量",
props: "quality_total_score",
width: "20%",
width: "15%",
slot: "quality_total_score",
},
{
name: "创新创优",
props: "excellence_score",
width: "15%",
slot: "excellence_score",
},
{
name: "工程总得分",
props: "total_score",
......@@ -390,107 +399,37 @@ export default {
slot: "total_score",
},
],
header4_2: [
{
name: "工程名称",
props: "name",
width: "calc(100% / 3)",
headerStyle: {
textAlign: "left",
},
style: {},
align: "left",
},
{
name: "单位工程",
props: "value1",
width: "calc(100% / 3)",
headerStyle: {
textAlign: "left",
},
style: {},
align: "left",
// headerStyle: {
// fontSize: "0.13rem",
// },
},
{
name: "得分情况",
props: "value2",
width: "calc(100% / 3)",
},
],
header4_3: [
{
name: "工程名称",
props: "name",
width: "70%",
headerStyle: {
textAlign: "left",
},
style: {},
align: "left",
},
{
name: "不合格率",
props: "value1",
width: "30%",
},
],
header4_4: [
{
name: "人员资格",
props: "name",
width: "calc(100% / 4)",
},
{
name: "工程外观",
props: "category_count_11",
width: "calc(100% / 4)",
},
{
name: "开挖与基础处理质量",
props: "category_count_12",
width: "calc(100% / 3)",
},
{
name: "工程结构质量",
props: "category_count_13",
width: "calc(100% / 4)",
},
],
data4: [],
header5: [
{
name: "工程名称",
props: "project_name",
width: "55%",
width: "40%",
align: "left",
},
{
name: "所属区域",
props: "city_name",
width: "10%",
width: "15%",
headerStyle: {},
style: {},
align: "left",
},
{
name: "当前问题总数",
props: "question_total",
width: "10%",
name: "预警类型",
props: "type_str",
width: "15%",
},
{
name: "严重问题数量",
props: "level_count",
width: "10%",
name: "合格分值",
props: "warning",
width: "15%",
},
{
name: "最近严重预警时间",
props: "update_time",
name: "当前分值",
props: "score",
width: "15%",
},
],
......@@ -518,6 +457,20 @@ export default {
score_count: 0,
projectListVisible: false,
showNumber: false,
warningNum: {
1: 0,
2: 0,
3: 0,
4: 0,
5: 0,
6: 0,
7: 0,
},
currentRowData: {},
ZFJGVisible: false,
CXCYVisible: false,
GCZLVisible: false,
areaDialogVisible: false,
};
},
methods: {
......@@ -548,7 +501,10 @@ export default {
});
},
getData() {
getProjectList({ limit: 20 }, false).then((res) => {
getWarningStatusNum().then((res) => {
this.warningNum = res.data;
window.warningNum = res.data;
getProjectList({ limit: 100 }, false).then((res) => {
this.data1 = res.data.data;
this.data2 = res.data.data;
this.data3 = res.data.data;
......@@ -556,179 +512,15 @@ export default {
getImportantQuestion().then((res) => {
this.data5 = res.data;
});
// getYearQuestion().then((res) => {
// this.data1 = res.data;
// });
// getLevelQuestion().then((res) => {
// this.data2 = res.data;
// });
// getStatusQuestion().then((res) => {
// this.data3 = res.data;
// });
// this.data1 = [
// {
// project_name: "东苕溪防洪后续西险大塘达标加固工程（杭州市段）",
// quality_score: "90",
// },
// {
// project_name: "杭州市萧山区西江塘义桥段古海塘抢险加固工程",
// quality_score: "85",
// },
// {
// project_name: "钱塘江北岸五堡排涝泵站工程",
// quality_score: "77",
// },
// {
// project_name: "钱塘江西江塘闻堰段海塘提标加固工程",
// quality_score: "92",
// },
// {
// project_name: "杭州市萧围西线（一工段至四工段）提标加固工程",
// quality_score: "85",
// },
// {
// project_name: "杭州市本级海塘安澜工程 （三堡至乔司段海塘）一期",
// quality_score: "90",
// },
// {
// project_name: "杭州市本级海塘安澜工程（珊瑚沙海塘）",
// quality_score: "82",
// },
// {
// project_name: "杭州市本级海塘安澜工程（上泗南北大塘）二期",
// quality_score: "87",
// },
// {
// project_name: "杭州市本级海塘安澜工程（三堡船闸段海塘）",
// quality_score: "88",
// },
// {
// project_name: "临安区双溪口水库工程",
// quality_score: "81",
// },
// {
// project_name: "宁波市界牌碶泵站工程",
// quality_score: "79",
// },
// {
// project_name: "奉化区柏坑水库扩容工程",
// quality_score: "89",
// },
// {
// project_name: "余姚市陶家路江排涝枢纽及供水工程",
// quality_score: "85",
// },
// ];
// this.data2 = [
// {
// project_name: "东苕溪防洪后续西险大塘达标加固工程（杭州市段）",
// quality_score: "80",
// },
// {
// project_name: "杭州市萧山区西江塘义桥段古海塘抢险加固工程",
// quality_score: "75",
// },
// {
// project_name: "钱塘江北岸五堡排涝泵站工程",
// quality_score: "97",
// },
// {
// project_name: "钱塘江西江塘闻堰段海塘提标加固工程",
// quality_score: "92",
// },
// {
// project_name: "杭州市萧围西线（一工段至四工段）提标加固工程",
// quality_score: "82",
// },
// {
// project_name: "杭州市本级海塘安澜工程 （三堡至乔司段海塘）一期",
// quality_score: "90",
// },
// {
// project_name: "杭州市本级海塘安澜工程（珊瑚沙海塘）",
// quality_score: "82",
// },
// {
// project_name: "杭州市本级海塘安澜工程（上泗南北大塘）二期",
// quality_score: "84",
// },
// {
// project_name: "杭州市本级海塘安澜工程（三堡船闸段海塘）",
// quality_score: "82",
// },
// {
// project_name: "临安区双溪口水库工程",
// quality_score: "81",
// },
// {
// project_name: "宁波市界牌碶泵站工程",
// quality_score: "79",
// },
// {
// project_name: "奉化区柏坑水库扩容工程",
// quality_score: "83",
// },
// {
// project_name: "余姚市陶家路江排涝枢纽及供水工程",
// quality_score: "82",
// },
// ];
// this.data3 = [
// {
// project_name: "东苕溪防洪后续西险大塘达标加固工程（杭州市段）",
// quality_score: "90",
// },
// {
// project_name: "杭州市萧山区西江塘义桥段古海塘抢险加固工程",
// quality_score: "90",
// },
// {
// project_name: "钱塘江北岸五堡排涝泵站工程",
// quality_score: "87",
// },
// {
// project_name: "钱塘江西江塘闻堰段海塘提标加固工程",
// quality_score: "92",
// },
// {
// project_name: "杭州市萧围西线（一工段至四工段）提标加固工程",
// quality_score: "85",
// },
// {
// project_name: "杭州市本级海塘安澜工程 （三堡至乔司段海塘）一期",
// quality_score: "77",
// },
// {
// project_name: "杭州市本级海塘安澜工程（珊瑚沙海塘）",
// quality_score: "90",
// },
// {
// project_name: "杭州市本级海塘安澜工程（上泗南北大塘）二期",
// quality_score: "95",
// },
// {
// project_name: "杭州市本级海塘安澜工程（三堡船闸段海塘）",
// quality_score: "88",
// },
// {
// project_name: "临安区双溪口水库工程",
// quality_score: "97",
// },
// {
// project_name: "宁波市界牌碶泵站工程",
// quality_score: "79",
// },
// {
// project_name: "奉化区柏坑水库扩容工程",
// quality_score: "83",
// },
// {
// project_name: "余姚市陶家路江排涝枢纽及供水工程",
// quality_score: "74",
// },
// ];
this.initMap();
});
},
getDecimalPlaces(num) {
const str = String(num);
const dotIndex = str.indexOf(".");
return dotIndex !== -1 ? str.length - dotIndex - 1 : 0;
},
async load() {
console.log("load");
},
......@@ -737,7 +529,7 @@ export default {
this.activeTab = type;
this.data4 = [];
this.showNumber = false;
getProjectList({ city_id: this.currentCityId, limit: 20 }, false).then(
getProjectList({ city_id: this.currentCityId, limit: 100 }, false).then(
(res) => {
this.data4 = res.data.data;
}
......@@ -946,8 +738,8 @@ export default {
color: ["#2f4ca3", "#8c2d2d"],
//区域颜色范范围
pieces: [
{ min: 0, max: 79 },
{ min: 80, max: 100 },
{ min: 0, max: Number(this.warningNum[1]) },
{ min: Number(this.warningNum[1]), max: 99999 },
],
textStyle: {
color: "#eee",
......@@ -1037,7 +829,7 @@ export default {
type: "scatter",
coordinateSystem: "geo",
symbol: (value, params) => {
if (value[2] < 80) {
if (value[2] < Number(this.warningNum[1])) {
return (
"image://" + require("@/assets/images/index/icon_hong.png")
);
......@@ -1054,7 +846,9 @@ export default {
label: {
position: "inside",
formatter: function (params) {
return `${params.data.name}\n${params.data.value[2]}分`;
return `${params.data.name}\n${Number(
params.data.value[2]
).toFixed(2)}分`;
},
show: true,
color: "#fff",
......@@ -1118,11 +912,51 @@ export default {
this.projectListVisible = true;
this.$eventBus.$emit("switchTab", "ProjectDetail");
},
rowClickZFJG(data) {
this.currentRowData = data;
this.ZFJGVisible = true;
},
rowClickCXCY(data) {
this.currentRowData = data;
this.CXCYVisible = true;
},
rowClickGCZL(data) {
this.currentRowData = data;
this.GCZLVisible = true;
},
rowClickArea(data) {
console.log(data.type, data);
if (data.id) {
this.currentRowData = data;
this.areaDialogVisible = true;
} else {
this.currentRowData = {
...data,
id: data.project_id,
};
if (data.type == 5 || data.type == 7 || data.type == 4) {
this.GCZLVisible = true;
if (data.type == 4) {
this.$eventBus.$emit("switchTabGC", "ZLJC");
}
}
if (data.type == 6) {
this.areaDialogVisible = true;
}
if (data.type == 2) {
this.ZFJGVisible = true;
}
if (data.type == 3) {
this.CXCYVisible = true;
}
}
},
},
mounted() {
this.getData();
this.initMap();
window.clickDetail = this.clickDetail;
},
watch: {},
......@@ -1145,13 +979,13 @@ export default {
left: 50%;
transform: translateX(-50%);
top: 0;
width: calc(100% - 900px);
width: calc(100% - 1080px);
height: calc(100% - calc(calc(100% - 90px) / 3 - calc(28px / 3)));
background: transparent !important;
z-index: 5;
}
.left-area {
width: 440px;
width: 530px;
left: 10px;
top: 80px;
position: fixed;
......@@ -1162,7 +996,7 @@ export default {
position: fixed;
right: 10px;
top: 80px;
width: 440px;
width: 530px;
height: calc(
calc(100% - 90px) - calc(calc(100% - 90px) / 3 - calc(28px / 3)) - 10px
);
......@@ -1170,8 +1004,8 @@ export default {
}
.bottom-area {
position: fixed;
width: calc(100% - 480px);
left: 470px;
width: calc(100% - 570px);
left: 560px;
bottom: 10px;
right: 10px;
height: calc(calc(100% - 90px) / 3 - calc(28px / 3)) !important;
......
src/views/DataStatis/project/CXCY.vue
View file @ ced7199f
......@@ -29,7 +29,11 @@
:api="api"
>
<template #excellence_score="{ data }">
<span :style="{ color: data.excellence_score < 80 ? '#f86262' : '' }">
<span
:style="{
color: data.excellence_score < warningNum[3] ? '#f86262' : '',
}"
>
{{ data.excellence_score }}
</span>
</template>
......@@ -67,6 +71,7 @@ export default {
],
api: getProjectList,
cities: [],
warningNum: window.warningNum,
};
},
mounted() {
......
src/views/DataStatis/project/GCZL.vue
View file @ ced7199f
......@@ -30,19 +30,27 @@
>
<template #quality_check_score="{ data }">
<span
:style="{ color: data.quality_check_score < 80 ? '#f86262' : '' }"
:style="{
color: data.quality_check_score < warningNum[4] ? '#f86262' : '',
}"
>
{{ data.quality_check_score }}
</span>
</template>
<template #quality_score="{ data }">
<span :style="{ color: data.quality_score < 80 ? '#f86262' : '' }">
<span
:style="{
color: data.quality_score < warningNum[5] ? '#f86262' : '',
}"
>
{{ data.quality_score }}
</span>
</template>
<template #quality_total_score="{ data }">
<span
:style="{ color: data.quality_total_score < 80 ? '#f86262' : '' }"
:style="{
color: data.quality_total_score < warningNum[7] ? '#f86262' : '',
}"
>
{{ data.quality_total_score }}
</span>
......@@ -94,6 +102,7 @@ export default {
dateRange: [],
api: getProjectList,
cities: [],
warningNum: window.warningNum,
};
},
mounted() {
......
src/views/DataStatis/project/ProjectDetail.vue
View file @ ced7199f
......@@ -29,29 +29,45 @@
:api="api"
>
<template #regulation_score="{ data }">
<span :style="{ color: data.regulation_score < 80 ? '#f86262' : '' }">
<span
:style="{
color: data.regulation_score < warningNum[2] ? '#f86262' : '',
}"
>
{{ data.regulation_score }}
</span>
</template>
<template #quality_check_score="{ data }">
<span
:style="{ color: data.quality_check_score < 80 ? '#f86262' : '' }"
:style="{
color: data.quality_check_score < warningNum[4] ? '#f86262' : '',
}"
>
{{ data.quality_check_score }}
</span>
</template>
<template #quality_score="{ data }">
<span :style="{ color: data.quality_score < 80 ? '#f86262' : '' }">
<span
:style="{
color: data.quality_score < warningNum[5] ? '#f86262' : '',
}"
>
{{ data.quality_score }}
</span>
</template>
<template #excellence_score="{ data }">
<span :style="{ color: data.excellence_score < 80 ? '#f86262' : '' }">
<span
:style="{
color: data.excellence_score < warningNum[3] ? '#f86262' : '',
}"
>
{{ data.excellence_score }}
</span>
</template>
<template #total_score="{ data }">
<span :style="{ color: data.total_score < 80 ? '#f86262' : '' }">
<span
:style="{ color: data.total_score < warningNum[6] ? '#f86262' : '' }"
>
{{ data.total_score }}
</span>
</template>
......@@ -114,6 +130,7 @@ export default {
api: getProjectList,
cities: [],
warningNum: window.warningNum,
};
},
mounted() {
......
src/views/DataStatis/project/ZFJG.vue
View file @ ced7199f
......@@ -29,7 +29,11 @@
:api="api"
>
<template #regulation_score="{ data }">
<span :style="{ color: data.regulation_score < 80 ? '#f86262' : '' }">
<span
:style="{
color: data.regulation_score < warningNum[2] ? '#f86262' : '',
}"
>
{{ data.regulation_score }}
</span>
</template>
......@@ -68,6 +72,7 @@ export default {
],
api: getProjectList,
cities: [],
warningNum: window.warningNum,
};
},
mounted() {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment