Skip to content

D
digital-construction
Commit 7f7a7a3c authored by 张牧越's avatar 张牧越
Browse files
Options

安全检查 联调

parent fad28904
Show whitespace changes
Inline Side-by-side
Showing with 1093 additions and 34 deletions
src/api/index.js
View file @ 7f7a7a3c
...@@ -418,3 +418,42 @@ export function getElevatorRealData(params) { ...@@ -418,3 +418,42 @@ export function getElevatorRealData(params) {
} }
//projectcheck
export function getCurrentMonthCheckStats() {
return request({
url: '/pweb/s/check/current/month/statistics',
method: 'get',
})
}
export function getBlackspotRankingList(params) {
return request({
url: '/pweb/s/check/item/sort',
method: 'get',
params
})
}
export function getMonthCheckStatis(params) {
return request({
url: '/pweb/s/check/month/statistics',
method: 'get',
params
})
}
export function getCorrectRecords(params) {
return request({
url: '/pweb/s/check/danger',
method: 'get',
params
})
}
export function getCorrectRecordDetail(id) {
return request({
url: `/pweb/s/check/${id}`,
method: 'get',
})
}
src/components/elevator/Index.vue
View file @ 7f7a7a3c
...@@ -79,7 +79,11 @@ ...@@ -79,7 +79,11 @@
<div class="warning-table-message">报警信息</div> <div class="warning-table-message">报警信息</div>
<div class="warning-table-status">处理状态</div> <div class="warning-table-status">处理状态</div>
</div> </div>
<div class="warning-table-list" v-infinite-scroll="load"> <div
class="warning-table-list"
v-infinite-scroll="load"
:infinite-scroll-distance="1"
>
<div <div
class="warning-table-column" class="warning-table-column"
v-for="(column, index) in elevatorWarningList" v-for="(column, index) in elevatorWarningList"
...@@ -340,7 +344,15 @@ export default { ...@@ -340,7 +344,15 @@ export default {
limit: 20, limit: 20,
}).then((res) => { }).then((res) => {
this.page += 1; this.page += 1;
this.getElevatorWarningList += res.data.data; this.elevatorWarningList = [
...this.elevatorWarningList,
...res.data.data,
];
});
} else if (this.elevatorWarningList.length == 0) {
getElevatorWarningList({ page: 1, limit: 20 }).then((res) => {
this.page = 1;
this.elevatorWarningList = res.data.data;
}); });
} }
}, },
...@@ -377,9 +389,6 @@ export default { ...@@ -377,9 +389,6 @@ export default {
this.currentElevatorTower = res.data[0]; this.currentElevatorTower = res.data[0];
this.getCurrentElevatorStatus(this.currentElevatorTower); this.getCurrentElevatorStatus(this.currentElevatorTower);
}); });
getElevatorWarningList({ page: 1, limit: 20 }).then((res) => {
this.elevatorWarningList = res.data.data;
});
getElevatorWarningStatus().then((res) => { getElevatorWarningStatus().then((res) => {
this.elevatorWarningStatus = res.data; this.elevatorWarningStatus = res.data;
}); });
...@@ -645,7 +654,7 @@ export default { ...@@ -645,7 +654,7 @@ export default {
line-height: 40px; line-height: 40px;
color: #c6def9; color: #c6def9;
font-size: 14px; font-size: 14px;
padding: 0 30px; padding: 0 12px;
margin-bottom: 2px; margin-bottom: 2px;
&:last-child { &:last-child {
margin-bottom: 0; margin-bottom: 0;
......
src/components/fallprotection/Index.vue
View file @ 7f7a7a3c
...@@ -119,7 +119,11 @@ ...@@ -119,7 +119,11 @@
<div class="warning-table-info">告警信息</div> <div class="warning-table-info">告警信息</div>
<div class="warning-table-status">处理状态</div> <div class="warning-table-status">处理状态</div>
</div> </div>
<div class="warning-table-list" v-infinite-scroll="load"> <div
class="warning-table-list"
v-infinite-scroll="load"
:infinite-scroll-distance="1"
>
<div <div
class="warning-table-column" class="warning-table-column"
v-for="(column, index) in fallwarningTableData" v-for="(column, index) in fallwarningTableData"
...@@ -341,7 +345,15 @@ export default { ...@@ -341,7 +345,15 @@ export default {
if (this.fallwarningTableData.length == this.page * 10) { if (this.fallwarningTableData.length == this.page * 10) {
getFallWarningTableList({ page: this.page + 1 }).then((res) => { getFallWarningTableList({ page: this.page + 1 }).then((res) => {
this.page += 1; this.page += 1;
this.fallwarningTableData += res.data.data; this.fallwarningTableData = [
...this.fallwarningTableData,
...res.data.data,
];
});
} else if (this.fallwarningTableData.length == 0) {
getFallWarningTableList({ page: 1 }).then((res) => {
this.page = 1;
this.fallwarningTableData = res.data.data;
}); });
} }
}, },
...@@ -365,9 +377,6 @@ export default { ...@@ -365,9 +377,6 @@ export default {
getFallWarningStatus().then((res) => { getFallWarningStatus().then((res) => {
this.fallwarningStatus = res.data; this.fallwarningStatus = res.data;
}); });
getFallWarningTableList({ page: 1 }).then((res) => {
this.fallwarningTableData = res.data.data;
});
}, },
}; };
</script> </script>
......
src/components/noise/Index.vue
View file @ 7f7a7a3c
...@@ -128,14 +128,18 @@ ...@@ -128,14 +128,18 @@
<div class="warning-table-message">报警信息</div> <div class="warning-table-message">报警信息</div>
<div class="warning-table-status">处理状态</div> <div class="warning-table-status">处理状态</div>
</div> </div>
<div class="warning-table-list" v-infinite-scroll="load"> <div
class="warning-table-list"
v-infinite-scroll="load"
:infinite-scroll-distance="1"
>
<div <div
class="warning-table-column" class="warning-table-column"
v-for="(column, index) in warnings" v-for="(column, index) in warnings"
:key="index" :key="index"
> >
<div class="warning-table-time">{{ column.log_time }}</div> <div class="warning-table-time">{{ column.log_time }}</div>
<div class="warning-table-device"></div> <div class="warning-table-device">{{ column.device_no }}</div>
<div class="warning-table-message"> <div class="warning-table-message">
{{ column.alarm_content }} {{ column.alarm_content }}
</div> </div>
...@@ -478,13 +482,6 @@ export default { ...@@ -478,13 +482,6 @@ export default {
this.renderAQIChart(); this.renderAQIChart();
}); });
}); });
getWarningMessageList({
start_log_time: this.getTime(new Date().getTime() - 2592000000),
end_log_time: this.getTime(new Date().getTime()),
page: 1,
}).then((res) => {
this.warnings = res.data.data;
});
getNoiseDeviceList({ top_cat: 9 }).then((res) => { getNoiseDeviceList({ top_cat: 9 }).then((res) => {
this.noiseMonitors = res.data; this.noiseMonitors = res.data;
if (res.data.length > 0) { if (res.data.length > 0) {
...@@ -510,9 +507,20 @@ export default { ...@@ -510,9 +507,20 @@ export default {
if (this.warnings.length == this.page * 10) { if (this.warnings.length == this.page * 10) {
getWarningMessageList({ getWarningMessageList({
page: this.page + 1, page: this.page + 1,
start_log_time: this.getTime(new Date().getTime() - 2592000000),
end_log_time: this.getTime(new Date().getTime()),
}).then((res) => { }).then((res) => {
this.page += 1; this.page += 1;
this.warnings += res.data.data; this.warnings = [...this.warnings, ...res.data.data];
});
} else if (this.warnings.length == 0) {
getWarningMessageList({
start_log_time: this.getTime(new Date().getTime() - 2592000000),
end_log_time: this.getTime(new Date().getTime()),
page: 1,
}).then((res) => {
this.page = 1;
this.warnings = res.data.data;
}); });
} }
}, },
......
src/components/projectcheck/CorrectDialog.vue 0 → 100644
View file @ 7f7a7a3c
<template>
<el-dialog
:visible.sync="dialogVisible"
title="整改详情"
width="70vw"
top="10vh"
append-to-body
>
<div class="step-area" v-if="correctDetail.check_result == 2">
<el-steps :active="correctDetail.step" align-center>
<el-step
v-for="(step, index) in correctDetail.progress"
:key="index"
:title="step.title"
:description="`${step.person} / ${step.time}`"
:status="
step.status == 1
? 'process'
: step.status == 3
? 'error'
: step.status == 2
? 'success'
: 'wait'
"
></el-step>
</el-steps>
</div>
<div
class="dialog-title"
:style="{ marginTop: correctDetail.check_result == 1 ? '0px' : '12px' }"
>
生成检查单
</div>
<div class="dialog-form">
<div class="dialog-item">
检查人员：{{ correctDetail.check_person_name }}
</div>
<div class="dialog-item">检查时间：{{ correctDetail.check_date }}</div>
<div class="dialog-item">巡查类型：{{ correctDetail.check_type }}</div>
<div class="dialog-item">
检查部位：{{ correctDetail.check_part_name }}
</div>
<div class="dialog-item">
检查事项：{{ correctDetail.check_item_name }}
</div>
<div class="dialog-item">
检查结果：
<span
:style="{
color: correctDetail.check_result == 1 ? '#24F0B8' : '#FF5A56',
}"
>{{ correctDetail.check_result_text }}</span
>
</div>
<div class="dialog-item">
负责人：{{ correctDetail.duty_person_name }}
</div>
<template v-if="correctDetail.check_result == 2">
<div class="dialog-item inline">
问题描述：{{ correctDetail.check_describe }}
</div>
<div class="dialog-item inline">
隐患图片：
<el-image
class="imgs"
v-for="(img, index) in correctDetail.check_images_list"
:key="index"
:src="img.url"
:preview-src-list="computedUrlList(correctDetail.check_images_list)"
/>
</div>
<div class="dialog-item">
问题等级：<span style="color: #ff5a56">{{
correctDetail.level_text
}}</span>
</div>
<div class="dialog-item">
整改期限：{{ correctDetail.rectify_date }}
</div>
<div class="dialog-item">
整改人员：{{ correctDetail.rectify_person_name }}
</div>
<div class="dialog-item">
短信通知：{{ correctDetail.is_message_text }}
</div>
<div class="dialog-item">
整改要求：{{ correctDetail.rectify_require }}
</div>
<div class="dialog-item">
补充描述：{{ correctDetail.other_describe }}
</div>
</template>
</div>
<template v-if="correctDetail.check_result == 2">
<div v-for="(correct, index) in correctDetail.rectify_list" :key="index">
<div class="dialog-title">整改上传</div>
<div class="dialog-form">
<div class="dialog-item">
整改人员：{{ correct.rectify_person_name }}
</div>
<div class="dialog-item">整改时间：{{ correct.create_time }}</div>
<div class="dialog-item inline">
整改描述：{{ correct.rectify_describe }}
</div>
<div class="dialog-item inline">
整改图片:
<el-image
class="imgs"
v-for="(img, index) in correct.rectify_images_list"
:key="index"
:src="img.url"
:preview-src-list="computedUrlList(correct.rectify_images_list)"
/>
</div>
</div>
<template v-if="correct.examine_status != 1">
<div class="dialog-title">复查审核</div>
<div class="dialog-form">
<div class="dialog-item">
复查人员：{{ correct.examine_person_name }} /
<span
:style="{
color: correct.examine_status == 2 ? '#24F0B8' : '#FF5A56',
}"
>{{ correct.examine_status_text }}</span
>
</div>
<div class="dialog-item">复查时间：{{ correct.examine_time }}</div>
<div class="dialog-item inline">
审核备注：{{ correct.examine_remark }}
</div>
</div>
</template>
</div>
</template>
</el-dialog>
</template>
<script>
export default {
name: "CorrectDialog",
props: {
visible: {
type: Boolean,
default: false,
},
data: {
type: Object,
default: () => {
return {};
},
},
},
data() {
return {
correctDetail: {
check_images_list: [],
},
};
},
methods: {
computedUrlList(data) {
return data.map((item) => {
return item.url;
});
},
},
computed: {
dialogVisible: {
get() {
return this.visible;
},
set(val) {
this.$emit("changeVisible", val);
},
},
},
watch: {
dialogVisible(val) {
if (val) {
this.correctDetail = this.data;
console.log(this.correctDetail);
}
},
},
};
</script>
<style lang="less" scoped>
.step-area {
padding: 24px;
background: #0e3b72;
}
.dialog-title {
line-height: 44px;
background: #0e3b72;
text-align: center;
font-size: 16px;
color: #24f0b8;
margin-bottom: 2px;
margin-top: 12px;
}
.dialog-form {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.dialog-item {
width: calc(50% - 50px);
margin-bottom: 2px;
background: #114483;
padding: 12px 24px;
color: #c6def9;
font-size: 14px;
&.inline {
width: 100%;
}
}
}
.imgs {
width: 100px;
height: 100px;
margin-right: 12px;
vertical-align: middle;
}
::v-deep .el-step__description {
line-height: 40px;
background: rgba(36, 240, 184, 0.05);
border-radius: 4px;
}
::v-deep .el-step.is-center .el-step__description {
padding: 0 !important;
margin: 0 20% !important;
}
::v-deep .el-step__title.is-finish {
color: #67c23a !important;
}
::v-deep .el-step__description.is-finish {
color: #67c23a !important;
}
::v-deep .el-step__title.is-process {
color: #c6def9 !important;
}
::v-deep .el-step__description.is-process {
color: #c6def9 !important;
}
::v-deep .el-step__icon .el-step__icon-inner {
display: inherit !important;
}
::v-deep .el-step__icon.is-text {
border-color: inherit !important;
}
::v-deep div.el-step__icon-inner {
color: transparent !important;
}
</style>
\ No newline at end of file
src/components/projectcheck/Index.vue
View file @ 7f7a7a3c
<template>
<div id="project-check">
<div class="side-area">
<Title text="本月检查统计"></Title>
<ShadowContainer>
<div class="chart-container" id="current-chart">
<img class="custom-chart" src="@/assets/chart.png" />
<div id="current-check-stats" ref="currentCheckStatsChart"></div>
</div>
</ShadowContainer>
<Title text="检查事项隐患排行"></Title>
<ShadowContainer>
<div class="blackspot-table">
<div class="warning-table-header">
<div class="warning-table-index">排序</div>
<div class="warning-table-point">检查事项</div>
<div class="warning-table-count">隐患数量</div>
</div>
<div
class="warning-table-list"
v-infinite-scroll="load"
:infinite-scroll-distance="1"
>
<div
class="warning-table-column"
v-for="(column, index) in blackspotRanking"
:key="index"
>
<div class="warning-table-index">
<img
:src="
index == 0
? require('@/assets/projectcheck/rect-red.png')
: index == 1
? require('@/assets/projectcheck/rect-orange.png')
: require('@/assets/projectcheck/rect-yellow.png')
"
alt=""
/>
<span>{{ index + 1 }}</span>
</div>
<el-tooltip
class="item"
effect="dark"
:content="column.check_item_name"
placement="top"
>
<div class="warning-table-point">
{{ column.check_item_name }}
</div>
</el-tooltip>
<div class="warning-table-count">
{{ column.check_item_count }}
</div>
</div>
</div>
</div>
</ShadowContainer>
</div>
<div class="right-area">
<Title text="月检测概况" type="long"></Title>
<ShadowContainer>
<div class="time-selector">
<i class="el-icon-arrow-left" @click="getPrevMonth"></i>
<span>{{ year }}年{{ month }}月</span>
<i class="el-icon-arrow-right" @click="getNextMonth"></i>
</div>
<div class="chart-status">
<div class="left-pie-charts">
<div class="chart-angle">
<div class="chart-title">项目自查</div>
<div class="chart-container">
<img class="custom-chart" src="@/assets/chart.png" />
<div id="project-check-chart" ref="projectCheck"></div>
</div>
</div>
<div class="chart-angle">
<div class="chart-title">企业检查</div>
<div class="chart-container">
<img class="custom-chart" src="@/assets/chart.png" />
<div id="enterprise-check" ref="enterpriseCheck"></div>
</div>
</div>
<div class="chart-angle">
<div class="chart-title">监督检测</div>
<div class="chart-container">
<img class="custom-chart" src="@/assets/chart.png" />
<div id="supervise-check" ref="superviseCheck"></div>
</div>
</div>
<div class="chart-angle">
<div class="chart-title">移动巡查</div>
<div class="chart-container">
<img class="custom-chart" src="@/assets/chart.png" />
<div id="move-check" ref="moveCheck"></div>
</div>
</div>
</div>
<div id="right-question-chart" ref="questionBarChart"></div>
</div>
</ShadowContainer>
<Title text="整改记录" type="long"></Title>
<ShadowContainer>
<div class="record-table">
<div class="warning-table-header">
<div class="warning-table-no">检查单号</div>
<div class="warning-table-check">检查部位/事项</div>
<div class="warning-table-type">检查类别</div>
<div class="warning-table-emergency">紧急程度</div>
<div class="warning-table-person">检查人员</div>
<div class="warning-table-time">发起时间</div>
<div class="warning-table-limit">整改期限</div>
<div class="warning-table-status">处理状态</div>
</div>
<div
class="warning-table-list"
v-infinite-scroll="loadCorrect"
:infinite-scroll-distance="1"
>
<div
class="warning-table-column"
v-for="(column, index) in correctList"
:key="index"
@click="getCorrectDetail(column.id)"
>
<div class="warning-table-no">{{ column.check_no }}</div>
<div class="warning-table-check">
{{ column.check_part_name }}/{{ column.check_item_name }}
</div>
<div class="warning-table-type">{{ column.check_type_text }}</div>
<div class="warning-table-emergency">{{ column.level_text }}</div>
<div class="warning-table-person">
{{ column.check_person_name }}
</div>
<div class="warning-table-time">{{ column.check_date }}</div>
<div class="warning-table-limit">{{ column.rectify_date }}</div>
<div :class="['warning-table-status', `status${column.status}`]">
{{ column.status_text }}
</div>
</div>
</div>
</div>
</ShadowContainer>
<CorrectDialog
:visible="correctDialogVisible"
:data="correctDetail"
@changeVisible="(val) => (correctDialogVisible = val)"
/>
</div>
</div>
</template>
<script>
import {
getCurrentMonthCheckStats,
getBlackspotRankingList,
getMonthCheckStatis,
getCorrectRecords,
getCorrectRecordDetail,
} from "@/api/index";
import CorrectDialog from "./CorrectDialog.vue";
export default {
name: "ProjectCheck",
components: { CorrectDialog },
data() {
return {
year: new Date().getFullYear(),
month: new Date().getMonth() + 1,
blackspotRanking: [],
currentMonthCheckData: [],
blackSpotPage: 1,
monthCheckData: {},
recordList: [],
correctList: [],
correctPage: 1,
correctDialogVisible: false,
correctDetail: {},
};
},
methods: {
getPrevMonth() {
if (this.month == 1) {
this.month = 12;
this.year = this.year - 1;
} else {
this.month = this.month - 1;
}
this.getMonthCheckStatis();
},
getNextMonth() {
if (this.month == 12) {
this.month = 1;
this.year = this.year + 1;
} else {
this.month = this.month + 1;
}
this.getMonthCheckStatis();
},
renderCurrentMonthCheckChart() {
const chartData = [...this.currentMonthCheckData];
const chart = this.$echarts.init(this.$refs.currentCheckStatsChart);
let total = 0;
chartData.map((item) => {
total += item.value;
});
const option = {
title: {
x: "27%", //X坐标
y: "40%",
text: total,
subtext: "累计检查",
textAlign: "center",
textStyle: {
//标题样式
fontSize: 30,
fontWeight: "bolder",
color: "#00fcff",
},
subtextStyle: {
//副标题样式
fontSize: 16,
fontWeight: "bolder",
lineHeight: 24,
color: "rgba(255,255,255,0.7)",
},
},
tooltip: {
trigger: "item",
},
legend: {
itemHeight: 12,
itemWidth: 12,
icon: "rect",
right: "10%",
top: "30%",
orient: "vertical",
itemGap: 20,
textStyle: {
color: "inherit",
rich: {
a: {
fontSize: 14,
align: "left",
},
b: {
fontSize: 20,
align: "left",
lineHeight: 25,
},
},
},
formatter: (name) => {
let data = chartData;
let target;
for (let i = 0, l = data.length; i < l; i++) {
if (data[i].name == name) {
target = data[i].value;
}
}
let arr = [`{a|${name}}`, `{b|${target}}`];
return arr.join(" ");
},
},
series: [
{
type: "pie",
radius: ["50%", "60%"],
center: ["28%", "50%"],
avoidLabelOverlap: false,
itemStyle: {
borderRadius: 20,
borderWidth: 4,
},
label: {
show: false,
position: "center",
},
data: chartData,
},
],
};
chart.setOption(option);
this.$nextTick(() => {
// 解决echarts图表放大溢出父容器
const resizeOb = new ResizeObserver((entries) => {
for (const entry of entries) {
this.$echarts.getInstanceByDom(entry.target).resize();
}
});
resizeOb.observe(document.getElementById("current-check-stats"));
});
},
load() {
if (this.blackspotRanking.length == this.blackSpotPage * 10) {
getBlackspotRankingList({
page: this.blackSpotPage + 1,
}).then((res) => {
this.blackSpotPage += 1;
this.blackspotRanking = [...this.blackspotRanking, ...res.data.data];
this.$forceUpdate();
});
} else if (this.blackspotRanking.length == 0) {
getBlackspotRankingList({ page: 1 }).then((res) => {
this.blackSpotPage = 1;
this.blackspotRanking = res.data.data;
this.$forceUpdate();
});
}
},
loadCorrect() {
if (this.correctList.length == this.correctPage * 10) {
getCorrectRecords({
page: this.correctPage + 1,
}).then((res) => {
this.correctPage += 1;
this.correctList = [...this.correctList, ...res.data.data];
this.$forceUpdate();
});
} else if (this.correctList.length == 0) {
getCorrectRecords({ page: 1 }).then((res) => {
this.correctPage = 1;
this.correctList = res.data.data;
this.$forceUpdate();
});
}
},
getMonthCheckStatis() {
getMonthCheckStatis({
month: `${this.year}-${
this.month < 10 ? "0" + this.month : this.month
}`,
}).then((res) => {
this.monthCheckData = res.data;
this.renderSmallChart(
"project-check-chart",
"projectCheck",
res.data.project_data
);
this.renderSmallChart(
"enterprise-check",
"enterpriseCheck",
res.data.company_data
);
this.renderSmallChart(
"supervise-check",
"superviseCheck",
res.data.supervise_data
);
this.renderSmallChart("move-check", "moveCheck", res.data.move_data);
this.renderQuestionBarChart(res.data);
});
},
renderSmallChart(id, ref, data) {
const chartData = [...data];
const chart = this.$echarts.init(this.$refs[`${ref}`]);
let total = 0;
chartData.map((item) => {
total += item.value;
});
const option = {
title: {
x: "26%", //X坐标
y: "30%",
text: total,
subtext: "检查量",
textAlign: "center",
textStyle: {
//标题样式
fontSize: 18,
fontWeight: "bolder",
color: "#00fcff",
},
subtextStyle: {
//副标题样式
fontSize: 13,
color: "rgba(255,255,255,0.7)",
},
},
tooltip: {
trigger: "item",
},
legend: {
itemHeight: 12,
itemWidth: 12,
icon: "rect",
right: "15%",
top: "28%",
orient: "vertical",
itemGap: 20,
textStyle: {
color: "inherit",
rich: {
a: {
fontSize: 12,
align: "left",
},
b: {
fontSize: 14,
align: "left",
lineHeight: 25,
},
},
},
formatter: (name) => {
let data = chartData;
let target;
for (let i = 0, l = data.length; i < l; i++) {
if (data[i].name == name) {
target = data[i].value;
}
}
let arr = [`{a|${name}}`, `{b|${target}}`];
return arr.join(" ");
},
},
series: [
{
type: "pie",
radius: ["65%", "75%"],
center: ["28%", "50%"],
avoidLabelOverlap: false,
itemStyle: {
borderRadius: 20,
borderWidth: 4,
},
label: {
show: false,
position: "center",
},
data: chartData,
},
],
};
chart.setOption(option);
this.$nextTick(() => {
// 解决echarts图表放大溢出父容器
const resizeOb = new ResizeObserver((entries) => {
for (const entry of entries) {
this.$echarts.getInstanceByDom(entry.target).resize();
}
});
resizeOb.observe(document.getElementById(`${id}`));
});
},
renderQuestionBarChart(data) {
const chart = this.$echarts.init(this.$refs.questionBarChart);
const xAxisData = data.bar_chart_data.map((item) => {
return item.name;
});
const series = data.bar_chart_data[0].data.map((item) => {
return {
name: item.name,
type: "bar",
data: data.bar_chart_data.map((iItem) => {
return iItem.data.filter((filterItem) => {
return filterItem.name == item.name;
})[0].value;
}),
barWidth: 15,
};
});
const option = {
grid: {
top: 80,
bottom: 30,
left: 50,
right: 0,
},
tooltip: {
trigger: "item",
},
legend: {
itemHeight: 12,
itemWidth: 12,
icon: "rect",
top: "5%",
itemGap: 20,
textStyle: {
fontSize: 12,
color: "rgba(225, 239, 255, 0.7)",
},
},
xAxis: {
type: "category",
data: xAxisData,
axisLabel: {
fontSize: "12",
color: "#c6def9",
},
},
yAxis: {
type: "value",
axisLabel: {
fontSize: "12",
color: "#c6def9",
},
splitLine: {
lineStyle: {
color: "rgba(95, 120, 144, 0.4)",
},
},
},
series: series,
};
chart.setOption(option);
this.$nextTick(() => {
// 解决echarts图表放大溢出父容器
const resizeOb = new ResizeObserver((entries) => {
for (const entry of entries) {
this.$echarts.getInstanceByDom(entry.target).resize();
}
});
resizeOb.observe(document.getElementById(`right-question-chart`));
});
},
getCorrectDetail(id) {
getCorrectRecordDetail(id).then((res) => {
this.correctDetail = res.data;
this.correctDialogVisible = true;
});
},
},
mounted() {
getCurrentMonthCheckStats().then((res) => {
this.currentMonthCheckData = res.data;
this.$nextTick(() => {
this.renderCurrentMonthCheckChart();
});
});
this.getMonthCheckStatis();
},
};
</script>
<style lang="less" scoped>
@import "@/assets/common/element.less";
#project-check {
padding: 12px 20px;
display: flex;
justify-content: space-between;
.side-area {
width: 28%;
}
.right-area {
width: calc(72% - 20px);
margin-left: 0 20px;
}
}
.time-selector {
line-height: 40px;
background: rgba(44, 96, 162, 0.2);
display: flex;
justify-content: space-between;
color: #c6def9;
font-size: 14px;
i {
line-height: 40px !important;
font-size: 22px;
padding: 0 12px;
cursor: pointer;
}
}
.chart-status {
display: flex;
margin-top: 12px;
.left-pie-charts {
width: calc(50% - 6px);
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.chart-angle {
width: calc(50% - 6px);
}
.chart-container {
width: 100%;
height: 130px;
background: linear-gradient(
90deg,
rgba(39, 172, 251, 0.05) 0%,
rgba(39, 172, 251, 0) 50%,
rgba(39, 172, 251, 0.05) 100%
);
margin-bottom: 12px;
position: relative;
div {
width: 100%;
height: 100%;
}
.custom-chart {
position: absolute;
width: 25%;
left: 15.5%;
transform: translateY(-50%);
top: 50%;
}
}
}
#right-question-chart {
width: calc(50% - 6px);
}
}
.chart-title {
line-height: 30px;
text-align: center;
background: linear-gradient(
90deg,
rgba(39, 172, 251, 0.4) 0%,
rgba(39, 172, 251, 0.15) 50%,
rgba(39, 172, 251, 0.4) 100%
);
font-size: 14px;
color: #c6def9;
}
.blackspot-table {
font-size: 14px;
text-align: center;
color: #c6def9;
.warning-table-list {
height: 280px;
overflow: auto;
}
.warning-table-header {
background: rgba(44, 96, 162, 0.2);
display: flex;
padding: 12px 0;
}
.warning-table-column {
padding: 12px 0;
background: rgba(44, 96, 162, 0.05);
display: flex;
&:nth-child(2n) {
background: rgba(44, 96, 162, 0.1);
}
}
.warning-table-index {
width: 15%;
position: relative;
img {
width: 40px;
margin: 0 auto;
position: absolute;
left: 50%;
top: 50%;
transform: translateX(-50%) translateY(-50%);
}
}
.warning-table-point {
width: 65%;
}
.warning-table-count {
width: 20%;
}
}
.record-table {
font-size: 14px;
text-align: center;
color: #c6def9;
.warning-table-list {
height: 280px;
overflow: auto;
}
.warning-table-header {
background: rgba(44, 96, 162, 0.2);
display: flex;
padding: 12px 0;
}
.warning-table-column {
padding: 12px 0;
background: rgba(44, 96, 162, 0.05);
display: flex;
&:nth-child(2n) {
background: rgba(44, 96, 162, 0.1);
}
cursor: pointer;
}
.warning-table-no {
width: 10%;
}
.warning-table-check {
width: 30%;
}
.warning-table-type {
width: 10%;
}
.warning-table-emergency {
width: 10%;
}
.warning-table-person {
width: 10%;
}
.warning-table-time {
width: 10%;
}
.warning-table-limit {
width: 10%;
}
.warning-table-status {
width: 10%;
&.status1 {
color: #ff5a56;
}
&.status2 {
color: #e39b36;
}
&.status3 {
color: #b42de6;
}
&.status4 {
color: #66cab9;
}
}
}
#current-chart {
position: relative;
.custom-chart {
position: absolute;
width: 32%;
top: 50%;
transform: translateY(-50%);
left: 12%;
}
#current-check-stats {
height: 396px;
}
}
</style>
\ No newline at end of file
src/components/tower/Index.vue
View file @ 7f7a7a3c
...@@ -92,7 +92,11 @@ ...@@ -92,7 +92,11 @@
<div class="warning-table-info">报警信息</div> <div class="warning-table-info">报警信息</div>
<div class="warning-table-status">处理状态</div> <div class="warning-table-status">处理状态</div>
</div> </div>
<div class="warning-table-list" v-infinite-scroll="load"> <div
class="warning-table-list"
v-infinite-scroll="load"
:infinite-scroll-distance="1"
>
<div <div
class="warning-table-column" class="warning-table-column"
v-for="(column, index) in warnings" v-for="(column, index) in warnings"
...@@ -425,9 +429,6 @@ export default { ...@@ -425,9 +429,6 @@ export default {
this.renderForceChart(); this.renderForceChart();
this.renderDipChart(); this.renderDipChart();
}); });
getTowerWarnings({ page: 1, limit: 20 }).then((res) => {
this.warnings = res.data.data;
});
getBaseInfo().then((res) => { getBaseInfo().then((res) => {
this.mapCenter = [res.data.longitude, res.data.latitude]; this.mapCenter = [res.data.longitude, res.data.latitude];
...@@ -657,7 +658,12 @@ export default { ...@@ -657,7 +658,12 @@ export default {
if (this.warnings.length == this.page * 20) { if (this.warnings.length == this.page * 20) {
getTowerWarnings({ page: this.page + 1, limit: 20 }).then((res) => { getTowerWarnings({ page: this.page + 1, limit: 20 }).then((res) => {
this.page += 1; this.page += 1;
this.warnings += res.data.data; this.warnings = [...this.warnings, ...res.data.data];
});
} else if (this.warnings.length == 0) {
getTowerWarnings({ page: 1, limit: 20 }).then((res) => {
this.page = 1;
this.warnings = res.data.data;
}); });
} }
}, },
......
src/components/unloadingplatform/Index.vue
View file @ 7f7a7a3c
...@@ -103,7 +103,11 @@ ...@@ -103,7 +103,11 @@
<div class="warning-table-info">告警信息</div> <div class="warning-table-info">告警信息</div>
<div class="warning-table-status">处理状态</div> <div class="warning-table-status">处理状态</div>
</div> </div>
<div class="warning-table-list" v-infinite-scroll="load"> <div
class="warning-table-list"
v-infinite-scroll="load"
:infinite-scroll-distance="1"
>
<div <div
class="warning-table-column" class="warning-table-column"
v-for="(column, index) in platformWarningList" v-for="(column, index) in platformWarningList"
...@@ -414,9 +418,17 @@ export default { ...@@ -414,9 +418,17 @@ export default {
getPlatformWarningList({ page: this.page + 1, limit: 20 }).then( getPlatformWarningList({ page: this.page + 1, limit: 20 }).then(
(res) => { (res) => {
this.page += 1; this.page += 1;
this.platformWarningList += res.data.data; this.platformWarningList = [
...this.platformWarningList,
...res.data.data,
];
} }
); );
} else if (this.platformWarningList.length == 0) {
getPlatformWarningList({ page: 1, limit: 20 }).then((res) => {
this.page = 1;
this.platformWarningList = res.data.data;
});
} }
}, },
}, },
...@@ -436,15 +448,9 @@ export default { ...@@ -436,15 +448,9 @@ export default {
this.renderWeightChart(); this.renderWeightChart();
}); });
}); });
getPlatformWarningList({ page: 1, limit: 20 }).then((res) => {
this.platformWarningList = res.data.data;
});
getPlatformWarningStatus().then((res) => { getPlatformWarningStatus().then((res) => {
this.platformWarningStatus = res.data; this.platformWarningStatus = res.data;
}); });
// getFallWarningTableList().then((res) => {
// this.fallwarningTableData = res.data.data;
// });
}, },
}; };
</script> </script>
......
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