From b8da78824e4c67632abb65302f01ccf74d5a1096 Mon Sep 17 00:00:00 2001
From: zouyu <2723363702@qq.com>
Date: 星期二, 26 五月 2026 18:45:51 +0800
Subject: [PATCH] 浪潮对接:芯导-安环管理系统，配置调整
---
src/views/safetyManagement/inspectionReport/index.vue | 293 ++++++++++++++++++++++++++++++++++++++++++++++++----------
1 files changed, 243 insertions(+), 50 deletions(-)
diff --git a/src/views/safetyManagement/inspectionReport/index.vue b/src/views/safetyManagement/inspectionReport/index.vue
index 91cc4e4..6ef624c 100644
--- a/src/views/safetyManagement/inspectionReport/index.vue
+++ b/src/views/safetyManagement/inspectionReport/index.vue
@@ -79,112 +79,305 @@
</el-form-item>
<el-form-item label="鐘舵��">
<el-select v-model="filters.status" placeholder="璇烽�夋嫨" clearable style="width: 150px">
- <el-option label="姝ｅ父" value="normal" />
- <el-option label="寮傚父" value="abnormal" />
- <el-option label="婕忔" value="missed" />
- <el-option label="鏈墽琛�" value="unexecuted" />
+ <el-option label="姝ｅ父" :value="0" />
+ <el-option label="寮傚父" :value="1" />
+ <el-option label="婕忔" :value="2" />
+ <el-option label="鏈墽琛�" :value="3" />
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="getData">鎼滅储</el-button>
<el-button @click="resetFilters">閲嶇疆</el-button>
+ <el-button type="success" @click="handleSyncData" icon="Refresh">鍚屾鏁版嵁</el-button>
</el-form-item>
</el-form>
- <PIMTable :column="columns" :tableData="dataList" :page="pagination" @pagination="changePage" />
+ <PIMTable :column="columns" :tableData="dataList" :page="pagination" @pagination="changePage" :tableLoading="tableLoading" />
</el-card>
</div>
</template>
<script setup>
-import { ref, reactive, onMounted } from "vue";
+import { ref, reactive, onMounted, nextTick } from "vue";
import PIMTable from "@/components/PIMTable/PIMTable.vue";
import * as echarts from "echarts";
+import {
+ getInspectionRecordList,
+ getTodayStatistics,
+ getTrendStatistics,
+ getTypeStatistics,
+ syncInspectionData
+} from "@/api/safetyManagement/inspectionReport.js";
+import { ElMessage } from "element-plus";
+import dayjs from "dayjs";
defineOptions({
name: "宸℃鏁版嵁鎶ヨ〃",
});
const todayStats = reactive({
- completionRate: 95,
- inspectorCount: 8,
- abnormalCount: 2,
- missedCount: 1,
+ completionRate: 0,
+ inspectorCount: 0,
+ abnormalCount: 0,
+ missedCount: 0,
});
const filters = reactive({
dateRange: [],
inspector: "",
- status: "",
+ status: null,
});
const dataList = ref([]);
const pagination = reactive({ current: 1, size: 10, total: 0 });
+const tableLoading = ref(false);
const columns = [
{ label: "宸℃鏃堕棿", prop: "inspectionTime", align: "center" },
{ label: "宸℃浜哄憳", prop: "inspector", align: "center" },
{ label: "宸℃鍖哄煙", prop: "area", align: "center" },
- { label: "宸℃绫诲瀷", prop: "type", align: "center" },
- { label: "鐘舵��", prop: "status", align: "center" },
+ {
+ label: "宸℃绫诲瀷",
+ prop: "type",
+ align: "center",
+ formatData: (val) => {
+ const typeMap = {
+ 'daily': '鏃ュ父宸℃',
+ 'equipment': '璁惧宸℃',
+ 'fire': '娑堥槻宸℃',
+ 'night': '澶滈棿宸℃',
+ 'safety': '瀹夊叏宸℃',
+ 'environment': '鐜宸℃'
+ };
+ return typeMap[val] || val;
+ }
+ },
+ {
+ label: "鐘舵��",
+ prop: "status",
+ align: "center",
+ dataType: "tag",
+ formatType: (val) => {
+ if (val === 0) return 'success';
+ if (val === 1) return 'danger';
+ if (val === 2) return 'warning';
+ return 'info';
+ },
+ formatData: (val) => {
+ const statusMap = { 0: '姝ｅ父', 1: '寮傚父', 2: '婕忔', 3: '鏈墽琛�' };
+ return statusMap[val] || val;
+ }
+ },
{ label: "寮傚父鎯呭喌", prop: "abnormalDesc", align: "center" },
];
const trendChartRef = ref(null);
const typeChartRef = ref(null);
+let trendChart = null;
+let typeChart = null;
onMounted(() => {
- initTrendChart();
- initTypeChart();
+ getTodayStats();
+ getData();
+ nextTick(() => {
+ initTrendChart();
+ initTypeChart();
+ });
});
-const initTrendChart = () => {
- const chart = echarts.init(trendChartRef.value);
- const option = {
- xAxis: {
- type: "category",
- data: ["鍛ㄤ竴", "鍛ㄤ簩", "鍛ㄤ笁", "鍛ㄥ洓", "鍛ㄤ簲", "鍛ㄥ叚", "鍛ㄦ棩"],
- },
- yAxis: { type: "value" },
- series: [
- { name: "宸插畬鎴�", type: "line", data: [120, 132, 101, 134, 90, 230, 210], smooth: true },
- { name: "鏈畬鎴�", type: "line", data: [20, 12, 21, 14, 30, 20, 10], smooth: true },
- ],
- legend: { data: ["宸插畬鎴�", "鏈畬鎴�"], bottom: 0 },
- grid: { left: "3%", right: "4%", bottom: "10%", containLabel: true },
- };
- chart.setOption(option);
+// 鑾峰彇浠婃棩缁熻
+const getTodayStats = async () => {
+ try {
+ const res = await getTodayStatistics();
+ if (res.code === 200) {
+ Object.assign(todayStats, res.data);
+ }
+ } catch (error) {
+ console.error('鑾峰彇浠婃棩缁熻澶辫触', error);
+ }
};
-const initTypeChart = () => {
- const chart = echarts.init(typeChartRef.value);
- const option = {
- series: [
- {
- type: "pie",
- radius: ["40%", "70%"],
- data: [
- { value: 335, name: "璁惧宸℃" },
- { value: 310, name: "瀹夊叏宸℃" },
- { value: 234, name: "鐜宸℃" },
- { value: 135, name: "娑堥槻宸℃" },
- ],
+// 鍒濆鍖栬秼鍔垮浘琛�
+const initTrendChart = async () => {
+ if (!trendChartRef.value) return;
+
+ trendChart = echarts.init(trendChartRef.value);
+
+ try {
+ const endDate = dayjs().format('YYYY-MM-DD');
+ const startDate = dayjs().subtract(6, 'day').format('YYYY-MM-DD');
+ const res = await getTrendStatistics({ startDate, endDate });
+
+ let dates = [];
+ let completedData = [];
+ let abnormalData = [];
+ let missedData = [];
+ let unexecutedData = [];
+
+ if (res.code === 200 && Array.isArray(res.data)) {
+ // 鎸夋棩鏈熸帓搴�
+ const sortedData = res.data.sort((a, b) => a.statDate.localeCompare(b.statDate));
+ dates = sortedData.map(item => dayjs(item.statDate).format('MM-DD'));
+ completedData = sortedData.map(item => item.completedCount || 0);
+ abnormalData = sortedData.map(item => item.abnormalCount || 0);
+ missedData = sortedData.map(item => item.missedCount || 0);
+ unexecutedData = sortedData.map(item => item.unexecutedCount || 0);
+ } else {
+ // 浣跨敤榛樿鏁版嵁
+ for (let i = 6; i >= 0; i--) {
+ dates.push(dayjs().subtract(i, 'day').format('MM-DD'));
+ }
+ completedData = [2, 1, 2, 2, 1, 4, 3];
+ abnormalData = [1, 0, 0, 1, 0, 1, 0];
+ missedData = [0, 0, 1, 0, 0, 1, 0];
+ unexecutedData = [0, 1, 0, 0, 1, 0, 1];
+ }
+
+ const option = {
+ tooltip: { trigger: 'axis' },
+ xAxis: {
+ type: "category",
+ data: dates,
},
- ],
- legend: { orient: "vertical", left: "left" },
- };
- chart.setOption(option);
+ yAxis: { type: "value" },
+ series: [
+ { name: "宸插畬鎴�", type: "line", data: completedData, smooth: true },
+ { name: "寮傚父", type: "line", data: abnormalData, smooth: true },
+ { name: "婕忔", type: "line", data: missedData, smooth: true },
+ { name: "鏈墽琛�", type: "line", data: unexecutedData, smooth: true },
+ ],
+ legend: { data: ["宸插畬鎴�", "寮傚父", "婕忔", "鏈墽琛�"], bottom: 0 },
+ grid: { left: "3%", right: "4%", bottom: "15%", containLabel: true },
+ };
+ trendChart.setOption(option);
+ } catch (error) {
+ console.error('鑾峰彇瓒嬪娍鏁版嵁澶辫触', error);
+ }
};
-const getData = () => {};
+// 绫诲瀷鏄犲皠
+const typeMap = {
+ 'daily': '鏃ュ父宸℃',
+ 'equipment': '璁惧宸℃',
+ 'fire': '娑堥槻宸℃',
+ 'night': '澶滈棿宸℃',
+ 'safety': '瀹夊叏宸℃',
+ 'environment': '鐜宸℃'
+};
+
+// 鍒濆鍖栫被鍨嬪浘琛�
+const initTypeChart = async () => {
+ if (!typeChartRef.value) return;
+
+ typeChart = echarts.init(typeChartRef.value);
+
+ try {
+ const endDate = dayjs().format('YYYY-MM-DD');
+ const startDate = dayjs().subtract(30, 'day').format('YYYY-MM-DD');
+ const res = await getTypeStatistics({ startDate, endDate });
+
+ let pieData = [];
+
+ if (res.code === 200 && Array.isArray(res.data)) {
+ pieData = res.data.map(item => ({
+ value: item.count || 0,
+ name: typeMap[item.type] || item.type
+ }));
+ } else {
+ // 浣跨敤榛樿鏁版嵁
+ pieData = [
+ { value: 8, name: "鏃ュ父宸℃" },
+ { value: 4, name: "璁惧宸℃" },
+ { value: 3, name: "娑堥槻宸℃" },
+ { value: 3, name: "澶滈棿宸℃" },
+ ];
+ }
+
+ const option = {
+ tooltip: { trigger: 'item', formatter: '{b}: {c} ({d}%)' },
+ series: [
+ {
+ type: "pie",
+ radius: ["40%", "70%"],
+ data: pieData,
+ label: {
+ formatter: '{b}\n{c}娆� ({d}%)'
+ }
+ },
+ ],
+ legend: { orient: "vertical", left: "left" },
+ };
+ typeChart.setOption(option);
+ } catch (error) {
+ console.error('鑾峰彇绫诲瀷缁熻澶辫触', error);
+ }
+};
+
+// 鑾峰彇宸℃璁板綍鍒楄〃
+const getData = async () => {
+ tableLoading.value = true;
+ try {
+ const params = {
+ pageNum: pagination.current,
+ pageSize: pagination.size,
+ inspector: filters.inspector,
+ status: filters.status,
+ };
+
+ if (filters.dateRange && filters.dateRange.length === 2) {
+ params.startDate = filters.dateRange[0];
+ params.endDate = filters.dateRange[1];
+ }
+
+ const res = await getInspectionRecordList(params);
+ if (res.code === 200) {
+ dataList.value = res.data.rows || res.data.records || [];
+ pagination.total = res.data.total || 0;
+ }
+ } catch (error) {
+ ElMessage.error('鑾峰彇宸℃璁板綍澶辫触');
+ } finally {
+ tableLoading.value = false;
+ }
+};
+
const resetFilters = () => {
filters.dateRange = [];
filters.inspector = "";
- filters.status = "";
+ filters.status = null;
+ pagination.current = 1;
+ getData();
};
+
const changePage = ({ page, limit }) => {
pagination.current = page;
pagination.size = limit;
+ getData();
};
+
+// 鍚屾宸℃鏁版嵁
+const handleSyncData = async () => {
+ try {
+ const res = await syncInspectionData();
+ if (res.code === 200) {
+ ElMessage.success(`鍚屾鎴愬姛锛屾柊澧� ${res.data?.count || 0} 鏉¤褰昤);
+ // 鍒锋柊鍒楄〃鍜岀粺璁�
+ getData();
+ getTodayStats();
+ initTrendChart();
+ initTypeChart();
+ } else {
+ ElMessage.warning(res.msg || '鍚屾澶辫触');
+ }
+ } catch (error) {
+ ElMessage.error(error.response?.data?.msg || '鍚屾澶辫触');
+ }
+};
+
+// 绐楀彛澶у皬鏀瑰彉鏃堕噸鏂版覆鏌撳浘琛�
+window.addEventListener('resize', () => {
+ trendChart && trendChart.resize();
+ typeChart && typeChart.resize();
+});
</script>
<style lang="scss" scoped>
--
Gitblit v1.9.3