|
|
@@ -12,8 +12,13 @@
|
|
|
<BasicTable @register="registerTable" :scroll="{ x: 'max-content' }">
|
|
|
<template #action="{ record }">
|
|
|
<div class="action-buttons">
|
|
|
- <button @click="openModal(record, 'realtime')" class="action-btn">
|
|
|
- <SvgIcon name="details" />
|
|
|
+ <!-- 操作按钮 -->
|
|
|
+ <button @click="openModal(record, 'detail')" class="action-btn detail-btn" title="操作">
|
|
|
+ <span class="action-text">详情</span>
|
|
|
+ </button>
|
|
|
+ <!-- 已解决按钮 -->
|
|
|
+ <button @click="openModal(record, 'resolved')" class="action-btn resolved-btn" title="已解决">
|
|
|
+ <span class="action-text">已解决</span>
|
|
|
</button>
|
|
|
</div>
|
|
|
</template>
|
|
|
@@ -33,6 +38,22 @@
|
|
|
</BasicTable>
|
|
|
</TabPane>
|
|
|
</Tabs>
|
|
|
+ <!-- 弹窗组件 -->
|
|
|
+ <a-modal style="top: 30%; left: 170px" v-model:visible="visibleModal" :width="450" title="实时监测数据">
|
|
|
+ <a-table></a-table>
|
|
|
+ </a-modal>
|
|
|
+ <!-- 弹窗组件 -->
|
|
|
+ <a-modal
|
|
|
+ style="height: 400px"
|
|
|
+ v-model:visible="visibleresolveModal"
|
|
|
+ :width="600"
|
|
|
+ centered
|
|
|
+ title="密闭漏风处理情况"
|
|
|
+ @ok="handleOkEdit"
|
|
|
+ @cancel="handleCancelEdit"
|
|
|
+ >
|
|
|
+ <a-textarea style="width: 90%; margin-left: 20px; margin-right: 20px" v-model:value="resolveValue" placeholder="请输入解决情况" :rows="4" />
|
|
|
+ </a-modal>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
@@ -42,14 +63,26 @@ import { BasicTable, useTable } from '/@/components/Table';
|
|
|
import { Tabs, TabPane } from 'ant-design-vue';
|
|
|
import MiniBoard from '/@/components/Configurable/detail/MiniBoard.vue';
|
|
|
import { SvgIcon } from '/@/components/Icon';
|
|
|
-import { getMineData, getProvinceAlarm, getProvinceAlarmNum, getGoafData, getProvinceAlarmHistory, getEnfMineTreeData } from './airLeak.api';
|
|
|
+import {
|
|
|
+ getMineData,
|
|
|
+ getProvinceAlarm,
|
|
|
+ getProvinceAlarmNum,
|
|
|
+ getGoafData,
|
|
|
+ getProvinceAlarmHistory,
|
|
|
+ getEnfMineTreeData,
|
|
|
+ resolveAlarm,
|
|
|
+} from './airLeak.api';
|
|
|
import formConfig from '/@/components/Form/src/jeecg/components/formCard/formConfig.vue';
|
|
|
import JPopup from '/@/components/Form/src/jeecg/components/JPopup.vue';
|
|
|
// 引入模拟数据
|
|
|
-import { columns, searchFormSchema, historicalMinesData } from './airLeakStatus.data';
|
|
|
+import { columns, historyColumns, searchFormSchema, historicalMinesData } from './airLeakStatus.data';
|
|
|
|
|
|
// 激活的Tab页签
|
|
|
const activeTab = ref('realtime');
|
|
|
+const visibleModal = ref(false);
|
|
|
+const visibleresolveModal = ref(false);
|
|
|
+const resolveValue = ref('');
|
|
|
+const resolveId = ref('');
|
|
|
//煤矿列表数据
|
|
|
const deviceOptions = ref([]);
|
|
|
const goafOptions = ref([]);
|
|
|
@@ -91,7 +124,7 @@ const [registerTable] = useTable({
|
|
|
showIndexColumn: false,
|
|
|
canResize: false,
|
|
|
actionColumn: {
|
|
|
- width: 60,
|
|
|
+ width: 120,
|
|
|
title: '操作',
|
|
|
dataIndex: 'action',
|
|
|
slots: { customRender: 'action' },
|
|
|
@@ -101,7 +134,7 @@ const [registerTable] = useTable({
|
|
|
// 注册历史数据表格
|
|
|
const [registerHistoryTable] = useTable({
|
|
|
dataSource: historyData,
|
|
|
- columns,
|
|
|
+ columns: historyColumns,
|
|
|
api: getProvinceAlarmHistory,
|
|
|
formConfig: {
|
|
|
labelWidth: 120,
|
|
|
@@ -208,6 +241,13 @@ const openModal = (record, type) => {
|
|
|
if (type === 'realtime') {
|
|
|
// 可向实时弹窗传递当前记录数据
|
|
|
realtimeModalRef.value?.showModal(record);
|
|
|
+ } else if (type === 'resolved') {
|
|
|
+ visibleresolveModal.value = true;
|
|
|
+ resolveValue.value = '';
|
|
|
+ // record.isResolved = resolveValue.value || '';
|
|
|
+ resolveId.value = record.id;
|
|
|
+ } else if (type === 'detail') {
|
|
|
+ visibleModal.value = true;
|
|
|
} else {
|
|
|
// 可向历史弹窗传递当前记录数据
|
|
|
historyModalRef.value?.showModal(record);
|
|
|
@@ -272,6 +312,18 @@ async function getEnfMineData() {
|
|
|
console.log(lawDeptOptions.value, '11111111');
|
|
|
// deviceOptions.value = res;
|
|
|
}
|
|
|
+// 解决预警
|
|
|
+async function handleOkEdit() {
|
|
|
+ const params = {
|
|
|
+ id: resolveId.value,
|
|
|
+ content: resolveValue.value,
|
|
|
+ };
|
|
|
+ await resolveAlarm(params);
|
|
|
+ visibleresolveModal.value = false;
|
|
|
+}
|
|
|
+const handleCancelEdit = () => {
|
|
|
+ visibleresolveModal.value = false;
|
|
|
+};
|
|
|
onMounted(() => {
|
|
|
// 页面挂载时的逻辑
|
|
|
getMineDataList();
|
|
|
@@ -311,4 +363,21 @@ onMounted(() => {
|
|
|
:where(.css-dev-only-do-not-override-x9w3vz).ant-form-item .ant-form-item-label {
|
|
|
margin-top: 10px !important;
|
|
|
}
|
|
|
+.action-buttons {
|
|
|
+ display: flex;
|
|
|
+ gap: 8px;
|
|
|
+}
|
|
|
+.action-btn {
|
|
|
+ cursor: pointer;
|
|
|
+ border: none;
|
|
|
+ padding: 4px;
|
|
|
+}
|
|
|
+.action-icon {
|
|
|
+ width: 16px;
|
|
|
+ height: 16px;
|
|
|
+}
|
|
|
+.action-text {
|
|
|
+ font-size: 12px;
|
|
|
+ color: #6398fc;
|
|
|
+}
|
|
|
</style>
|
