This commit is contained in:
xuziqiang
2024-07-22 14:15:40 +08:00
26 changed files with 615 additions and 187 deletions

View File

@@ -48,7 +48,6 @@
name: 'alarmOverviewIndex', // 与页面路由name一致缓存才可生效
});
const info = ref({});
let chartInstance: echarts.ECharts | null = null;
let chartInstanceOne: echarts.ECharts | null = null;
let chartInstanceTow: echarts.ECharts | null = null;
@@ -57,8 +56,11 @@
const echartPieTow = ref(null);
const getGraphChart = () => {
let dayData = [];
// 能源告警
let energyAlarm = [];
// 网关告警
let wgAlarm = [];
// 设备告警
let equipmentAlarm = [];
let total = [];

View File

@@ -26,7 +26,6 @@
import editConfigureEnergyAlarm from './editConfigureEnergyAlarm.vue';
import { energyAlarms } from '/@/api/alarmManagement/alarmSettings/energyAlarm';
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import { device } from '/@/api/deviceManage';
import { dict } from '/@/api';
export default {
@@ -229,29 +228,6 @@
formConfig: {
title: value.errorCode,
schemas: [
// {
// field: 'deviceNode',
// label: '设备名称',
// component: 'nsSelectApi',
// componentProps: {
// api: device.queryDevicePage,
// allowClear: true,
// params: {
// orgId: orgId.value,
// pageNum: 1,
// pageSize: 99,
// },
// placeholder: '请选择设备名称',
// resultField: 'data.records',
// labelField: 'deviceName',
// valueField: 'id',
// showSearch: true,
// filterOption: (input: string, option: any) => {
// return option.deviceName.toLowerCase().indexOf(input.toLowerCase()) >= 0;
// },
// // autoAddLink: true, //默认添加联动
// },
// },
{
field: 'deviceName',
label: '设备信息/节点信息',

View File

@@ -42,6 +42,7 @@
const orgId = ref('');
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
orgId.value = result;
// 改变状态
const clickSwitch = (data: any) => {
NsModal.confirm({
title: '启用状态',

View File

@@ -213,6 +213,7 @@
http.post(device.queryDevicePoint, value).then((res) => {
if (res.msg === 'success') {
res.data.forEach((item: any) => {
//显示格式
devicePointData.value.push({
value: item.id,
label: item.code + ' ( ' + item.unit + ' ) ',
@@ -336,10 +337,13 @@
item.logic = item.logic.value;
});
}
infoObject.value.valueType = infoObject.value.valueType.value;
infoObject.value.alarmList = infoObject.value.hxAlarmRuleLogicList || [];
delete infoObject.value.hxAlarmRuleLogicList;
// 回显 格式化
infoObject.value.deviceType = selectDevice;
infoObject.value.valueType = infoObject.value.valueType.value;
//数据类型转换
infoObject.value.ruleType = infoObject.value.ruleType + '';
}
});
@@ -450,6 +454,8 @@
abnormalDescription: null,
deviceType: [],
devicePoint: null,
valueType: null,
deviceId: null,
enableRules: 0,
alarmList: [{ logic: null, num: null, isDelete: 0 }],
};
@@ -470,6 +476,7 @@
// 确保 index 在有效范围内
if (index < infoObject.value.alarmList.length && index >= 0) {
const alarmItemToDelete = infoObject.value.alarmList[index];
// 判断删除的 是否在数据库中
if (alarmItemToDelete?.id) {
// 添加到 delAlarmList 中,并标记为已删除
delAlarmList.value.push({ ...alarmItemToDelete, isDelete: 1 });

View File

@@ -274,10 +274,12 @@
// 设备告警 编辑或添加成功 刷新列表
const editObject = () => {
mainRefEquipmentAlarm.value?.nsTableRef.reload();
mainRef.value?.nsTableRef.reload();
};
// 能源告警 编辑或添加成功 刷新列表
const editeEnergyAlarmInfo = () => {
mainEnergyAlarmConfig.value?.nsTableRef.reload();
mainRef.value?.nsTableRef.reload();
};
return {
notificationConfig,

View File

@@ -133,7 +133,7 @@
pageSize: 10,
showQuickJumper: true,
showLessItems: true,
// showSizeChanger: true,
// showSizeChanger: true, //分页改变大小
showTotal: (total: number, range: any) =>
total && range ? `显示第${range[0]}${range[1]}条记录,共 ${total} 条记录` : '',
onChange: handleChangePage,
@@ -145,6 +145,7 @@
dataSource.value.forEach((item) => {
ids.push(item.userId);
});
// 传到子页面
linkPeoples.value.getData({ id: ids, data: dataSource.value });
};
//取消弹窗
@@ -194,14 +195,17 @@
})
.then((res) => {
infoObject.value = res.data;
//处理通知方式
if (infoObject.value.notificationMethod) {
infoObject.value.notificationMethod = infoObject.value.notificationMethod.split(',');
} else {
infoObject.value.notificationMethod = [];
}
//处理通知人
dataSource.value = res.data.hxAlarmNotifyUserList;
});
} else {
dataSource.value = [];
infoObject.value = {
enableNotifications: 0,
notificationMethod: [],
@@ -236,6 +240,7 @@
obj.notificationMethod = infoObject.value.notificationMethod.toString();
obj.id = infoObject.value.id;
obj.enableNotifications = infoObject.value.enableNotifications;
//处理 选择人数据
dataSource.value.forEach((item) => {
obj.hxAlarmNotifyUserList.push({
userId: item.userId,
@@ -247,6 +252,7 @@
if (res.msg === 'success') {
NsMessage.success('操作成功');
visible.value = false;
dataSource.value = [];
emit('updNotification', null);
}
});
@@ -257,6 +263,7 @@
formRef.value.resetFields();
visible.value = false;
visibleModel.value = false;
dataSource.value = [];
};
defineExpose({
toggle,

View File

@@ -69,15 +69,14 @@
</template>
<script lang="ts">
import { ref, watch, computed } from 'vue';
import { ref, watch } from 'vue';
import { defineComponent } from 'vue';
import type { TreeProps } from 'ant-design-vue';
import { origanizemanage } from '/@/api/origanizemanage';
import { department } from '/@/api/origanizemanage';
import { http } from '/nerv-lib/util';
// import { editTreeConfig } from './config';
//搜索存储
//搜索存储 拼凑树的搜索类型
const dataList: TreeProps['treeData'] = [];
const generateList = (data: TreeProps['treeData']) => {
for (let i = 0; i < data.length; i++) {
@@ -126,16 +125,20 @@
const deptTreeData = ref([]);
//选择 组织
const selectOrgId = ref('');
//默认当前缓存的组织
selectOrgId.value = result;
//选择部门
const selectDeptId = ref('');
const show = ref(false);
//人员搜索
const onSearch = () => {
pagination.value.current = 1;
getList();
};
//点击树 搜索人员
const onSelect = (selectedKeys: any, info: any) => {
selectedKeys.value = selectedKeys;
//判断选择的部门 还是 组织
if (info.node.dataRef.deptInfo) {
selectDeptId.value = info.node.dataRef.deptInfo.deptId;
selectOrgId.value = info.node.dataRef.deptInfo.orgId;
@@ -189,7 +192,7 @@
orgId: selectOrgId.value,
deptId: selectDeptId.value,
realName: realName.value,
userStatus: 0,
userStatus: 0, // 写死 没有被冻结的用户
})
.then((res) => {
dataSource.value = res.data.records;
@@ -197,12 +200,24 @@
loading.value = false;
});
};
// 改变页码
const handleChangePage = (current: number, pageSize: number) => {
pagination.value.current = current;
pagination.value.pageSize = pageSize;
getList();
};
const pagination = ref({
total: 0,
size: 'small',
current: 1,
pageSize: 10,
showQuickJumper: true,
showLessItems: true,
// showSizeChanger: true,
showTotal: (total: number, range: any) =>
total && range ? `显示第${range[0]}${range[1]}条记录,共 ${total} 条记录` : '',
onChange: handleChangePage,
});
const onSelectChange = (selectedRowKeys: any, selectedRows: any) => {
selectedRowKey.value = selectedRowKeys;
// 使用 forEach 循环遍历 selectedRows 数组
@@ -225,18 +240,6 @@
selectedRowKeys.includes(existingRow.userId),
);
};
const pagination = ref({
total: 0,
size: 'small',
current: 1,
pageSize: 10,
showQuickJumper: true,
showLessItems: true,
// showSizeChanger: true,
showTotal: (total: number, range: any) =>
total && range ? `显示第${range[0]}${range[1]}条记录,共 ${total} 条记录` : '',
onChange: handleChangePage,
});
const columns = [
{
title: '序号',
@@ -262,15 +265,21 @@
dataIndex: 'address',
},
];
const handleOk = () => {
// 处理确定按钮的逻辑
emit('handleOk', { id: selectedRowKey.value, data: selectedRow.value });
const reback = () => {
show.value = false;
pagination.value.current = 1;
realName.value = null;
searchValue.value = '';
selectDeptId.value = '';
selectOrgId.value = orgId.value;
selectedRow.value = [];
selectedRowKey.value = [];
};
const handleOk = () => {
// 处理确定按钮的逻辑
emit('handleOk', { id: selectedRowKey.value, data: selectedRow.value });
//恢复数据
reback();
};
const getData = (data: any) => {
selectedRow.value = data.data;
@@ -281,17 +290,12 @@
//获取树
getTreeData();
};
const show = ref(false);
const handleCancel = () => {
// 处理取消按钮的逻辑
emit('handleCancel', null);
show.value = false;
pagination.value.current = 1;
realName.value = null;
searchValue.value = '';
selectDeptId.value = '';
selectOrgId.value = orgId.value;
reback();
};
// 监听树的搜索
watch(searchValue, (value) => {
const expanded = dataList
.map((item: TreeProps['treeData'][number]) => {
@@ -324,6 +328,7 @@
onSelectChange,
pagination,
handleOk,
reback,
show,
getData,
getTreeData,

View File

@@ -117,9 +117,7 @@ export const energyAlarmConfigs = (
if (obj.monitorFrequency) {
obj.monitorFrequency = data.monitorFrequency.value;
}
if (obj.createWorkOrder) {
obj.createWorkOrder = data.createWorkOrder + '';
}
obj.createWorkOrder = obj.createWorkOrder + '';
if (obj.alarmFrequency !== 2) {
obj.repetitions = null;
obj.intervalDuration = null;

View File

@@ -114,9 +114,7 @@ export const equipmentAlarmTableConfig = (
if (obj.intervalDurationUnit) {
obj.intervalDurationUnit = data.intervalDurationUnit.value;
}
if (obj.createWorkOrder) {
obj.createWorkOrder = data.createWorkOrder + '';
}
obj.createWorkOrder = obj.createWorkOrder + '';
if (obj.alarmFrequency !== 2) {
obj.repetitions = null;
obj.intervalDuration = null;

View File

@@ -1,5 +1,18 @@
<template>
<ns-view-list-table v-bind="config" ref="mainRef" />
<ns-view-list-table v-bind="config" ref="mainRef">
<template #bodyCell="{ record, column }">
<template v-if="column.dataIndex === 'alarmTitle'">
<div style="color: #2778ff">{{ record.alarmTitle }}</div>
{{ record.abnormalDescription }}
</template>
<template v-if="column.dataIndex === 'priority'">
{{ record.priority ? record.priority.label : '' }}
</template>
<template v-if="column.dataIndex === 'alarmLogState'">
{{ record.alarmLogState ? record.alarmLogState.label : '' }}
</template>
</template>
</ns-view-list-table>
<!-- 详情页面 -->
<Look ref="look" />
<!-- 状态页面 -->

View File

@@ -13,10 +13,10 @@
<div class="box">
<div class="card"></div>
<div style="left: 25px; position: absolute; height: 35px; line-height: 35px">
告警编号20230310001
告警编号{{ infoObject.alarmCode }}
</div>
<div style="right: 20px; position: absolute; height: 35px; line-height: 35px">
2024-03-10 15:08:10
{{ infoObject.updateTime }}
</div>
</div>
<!-- center -->
@@ -26,14 +26,21 @@
<!-- bottom -->
<div style="width: 100%; margin-top: 10px">
<a-descriptions :column="1" bordered>
<a-descriptions-item label="优先级">紧急</a-descriptions-item>
<a-descriptions-item label="状态">新告警</a-descriptions-item>
<a-descriptions-item label="错误码">C003</a-descriptions-item>
<a-descriptions-item label="告警描述"
><div style="color: #2778ff">用电量超标</div> 当日用电量超出预设值</a-descriptions-item
<a-descriptions-item label="优先级">{{
infoObject.priority ? infoObject.priority.label : ''
}}</a-descriptions-item>
<a-descriptions-item label="状态">{{
infoObject.alarmLogState ? infoObject.alarmLogState.label : ''
}}</a-descriptions-item>
<a-descriptions-item label="错误码">{{ infoObject.errorCode }}</a-descriptions-item>
<a-descriptions-item label="告警描述">
<div style="color: #2778ff">{{ infoObject.alarmTitle }}</div>
{{ infoObject.abnormalDescription }}</a-descriptions-item
>
<a-descriptions-item label="设备信息"> 1栋10层低压柜 </a-descriptions-item>
<a-descriptions-item label="重复次数"> 0 </a-descriptions-item>
<a-descriptions-item label="设备信息"> {{ infoObject.deviceInfo }} </a-descriptions-item>
<a-descriptions-item label="重复次数">
{{ infoObject.alarmRepetitions }}
</a-descriptions-item>
</a-descriptions>
</div>
</div>
@@ -51,16 +58,37 @@
let chartInstance: echarts.ECharts | null = null;
const graphChart = ref(null);
const infoObject = ref({
priority: null,
alarmCode: null,
alarmLogState: null,
errorCode: null,
alarmTitle: null,
abnormalDescription: null,
deviceInfo: null,
alarmRepetitions: null,
updateTime: null,
});
const visible = ref(false);
const handleClose = () => {
visible.value = false;
infoObject.value = {
priority: null,
alarmCode: null,
alarmLogState: null,
errorCode: null,
alarmTitle: null,
abnormalDescription: null,
deviceInfo: null,
alarmRepetitions: null,
updateTime: null,
};
};
const btnClick = () => {
console.log('btnClick');
handleClose();
};
const toggle = (data: any) => {
console.log(data, 'data');
infoObject.value = data;
visible.value = true;
setTimeout(() => {
getChatr();

View File

@@ -39,21 +39,22 @@
</div>
</a-tab-pane>
<a-tab-pane key="2" tab="状态流程">
<NsSteps v-bind="config" />
<!-- 自动生成工单 -->
<div v-if="infoObject.createWorkOrder === 1"> xxxx </div>
<!-- 没有自动生成工单 -->
<NsSteps v-else v-bind="config" />
</a-tab-pane>
</a-tabs>
<template #footer>
<!-- <a-button style="margin-right: 8px" type="primary" @click="createOrder">创建工单</a-button> -->
<a-button type="primary" @click="btnClick">确定</a-button>
</template>
</ns-drawer>
</template>
<script>
import { defineComponent } from 'vue';
import { ref, createVNode } from 'vue';
import { ref } from 'vue';
import NsSteps from '/@/components/ns-steps.vue';
import { NsMessage, NsModal } from '/nerv-lib/component';
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import { NsMessage } from '/nerv-lib/component';
export default defineComponent({
components: { NsSteps },
@@ -62,19 +63,14 @@
const visible = ref(false);
const showEdit = ref(true);
const infoObject = ref({});
const statusOptions = ref([
{ value: '0', label: '待处理' },
{ value: '1', label: '处理中' },
{ value: '2', label: '已完成' },
{ value: '3', label: '超时' },
{ value: '4', label: '已关闭' },
]);
const equipmentAlarm = ref({});
const statusOptions = ref();
const logList = ref([
{ name: '李四', status: '2', time: '2024-03-10 10:00:00', desc: '完成' },
{ name: '王五', status: '4', time: '2024-03-10 10:00:00' },
{ name: '王五', status: '3', time: '2024-03-10 10:00:00' },
{ name: '王五', status: '1', time: '2024-03-10 10:00:00', desc: '创建工单' },
{ name: '赵六', status: '0', time: '2024-03-10 10:00:00' },
{ name: '李四', status: 3, time: '2024-03-10 10:00:00', desc: '完成' },
{ name: '王五', status: 5, time: '2024-03-10 10:00:00' },
{ name: '王五', status: 4, time: '2024-03-10 10:00:00' },
{ name: '王五', status: 2, time: '2024-03-10 10:00:00', desc: '创建工单' },
{ name: '赵六', status: 1, time: '2024-03-10 10:00:00' },
]);
const config = ref({
size: logList.value.length,
@@ -84,23 +80,44 @@
visible.value = false;
};
const btnClick = () => {
NsMessage.success('操作成功');
delete infoObject.value.time;
console.log(infoObject.value, equipmentAlarm.value, '操作');
console.log('btnClick');
};
const toggle = (data) => {
console.log(data, '数据');
equipmentAlarm.value = data;
infoObject.value = { ...logList.value[0] };
if (equipmentAlarm.value.createWorkOrder === 1) {
statusOptions.value = [
{ value: 1, label: '待处理' },
{ value: 2, label: '处理中' },
{ value: 3, label: '已完成' },
{ value: 4, label: '超时' },
{ value: 5, label: '已关闭' },
];
} else {
statusOptions.value = [
{ value: 1, label: '待处理' },
{ value: 2, label: '处理中' },
{ value: 3, label: '已完成' },
{ value: 5, label: '已关闭' },
];
}
let statusMap = {
0: '待处理',
1: '处理中',
2: '已完成',
3: '超时',
4: '已关闭',
1: '待处理',
2: '处理中',
3: '已完成',
4: '超时',
5: '已关闭',
};
let colorMap = {
0: '#ff7602',
1: '#00a1e6',
2: '#04d919',
3: '#d9001b',
4: '#a6a6a6',
1: '#ff7602',
2: '#00a1e6',
3: '#04d919',
4: '#d9001b',
5: '#a6a6a6',
};
logList.value.forEach((item) => {
item.statusName = statusMap[item.status];
@@ -109,38 +126,12 @@
});
visible.value = true;
};
const createOrder = () => {
NsModal.confirm({
title: '提示',
icon: createVNode(ExclamationCircleOutlined),
content: '是否创建工单',
okText: '确认',
okType: 'primary',
cancelText: '取消',
onOk() {
NsModal.confirm({
title: '提示',
icon: createVNode(ExclamationCircleOutlined),
content: '工单创建成功工单号xxxxxxxxx',
okText: '确认',
okType: 'primary',
cancelButtonProps: { style: { display: 'none' } }, // 正确设置取消按钮样式
onOk() {
console.log('创建工单');
},
});
},
onCancel() {
console.log('Cancel');
},
});
};
return {
infoObject,
showEdit,
equipmentAlarm,
statusOptions,
btnClick,
createOrder,
visible,
logList,
config,

View File

@@ -1,6 +1,8 @@
import { dateUtil } from '/nerv-lib/util/date-util';
import data from '../notificationManagementMock.json';
import { http } from '/nerv-lib/util';
import { equipmentAlarmApi } from '/@/api/alarmManagement/equipmentAlarm';
import { ref } from 'vue';
const tableKeyMap = [
{
@@ -12,45 +14,45 @@ const tableKeyMap = [
},
{
title: '告警编号',
dataIndex: 'id',
dataIndex: 'alarmCode',
},
{
title: '告警描述',
dataIndex: 'deviceCode',
dataIndex: 'alarmTitle',
},
{
title: '优先级',
dataIndex: 'deviceName',
dataIndex: 'priority',
},
{
title: '状态',
dataIndex: 'position',
dataIndex: 'alarmLogState',
},
{
title: '错误码',
dataIndex: 'position',
textEllipsis: true,
dataIndex: 'errorCode',
},
{
title: '设备信息',
dataIndex: 'position',
dataIndex: 'deviceInfo',
},
{
title: '更新时间',
dataIndex: 'enableRules',
dataIndex: 'updateTime',
},
{
title: '重复次数',
dataIndex: 'enableRules',
dataIndex: 'alarmRepetitions',
},
];
const mockData = ref(data.listData);
export const notificationtableConfig = (look: any, status: any) => {
return {
title: '告警记录',
// api: '/carbon_emission/device/getDeviceList',
api: equipmentAlarmApi.getTableList,
value: mockData.value,
headerActions: [{}],
scroll: { x: 2000 },
columns: tableKeyMap,
// rowSelection: null, 选择按钮
columnActions: {
@@ -61,7 +63,6 @@ export const notificationtableConfig = (look: any, status: any) => {
name: 'FeedBackDetail',
dynamicParams: ['uuid', 'appealType'],
handle: (data: any) => {
console.log(look.value);
look.value.toggle(data);
},
},
@@ -79,29 +80,29 @@ export const notificationtableConfig = (look: any, status: any) => {
formConfig: {
schemas: [
{
field: 'name',
label: '告警类型',
field: 'priority',
label: '优先级',
component: 'NsSelect',
componentProps: {
placeholder: '请选择告警优先级',
options: [
{
label: '紧急',
value: '1',
value: 1,
},
{
label: '重要',
value: '2',
value: 2,
},
{
label: '一般',
value: '3',
value: 3,
},
],
},
},
{
field: 'provider',
field: 'alarmLogState',
label: '状态',
component: 'NsSelect',
componentProps: {
@@ -109,33 +110,38 @@ export const notificationtableConfig = (look: any, status: any) => {
options: [
{
label: '待处理',
value: '1',
value: 1,
},
{
label: '处理中',
value: '2',
value: 2,
},
{
label: '已完成',
value: '3',
value: 3,
},
{
label: '超时',
value: '4',
value: 4,
},
{
label: '关闭',
value: '5',
value: 5,
},
],
},
},
{
field: 'provider',
field: 'errorCode',
label: '错误码',
component: 'NsInput',
component: 'NsSelectApi',
componentProps: {
placeholder: '请输入告警错误码',
placeholder: '请选择错误码',
autoSelectFirst: false,
api: equipmentAlarmApi.getCodeList,
resultField: 'data',
labelField: 'errorCode',
valueField: 'errorCode',
},
},
{

View File

@@ -34,6 +34,7 @@
</div>
</a-tab-pane>
<a-tab-pane key="2" tab="状态流程">
<!-- 只有创建工单流程 -->
<NsSteps v-bind="config" />
</a-tab-pane>
</a-tabs>
@@ -56,18 +57,18 @@
const visible = ref(false);
const infoObject = ref({});
const statusOptions = ref([
{ value: '0', label: '待处理' },
{ value: '1', label: '处理中' },
{ value: '2', label: '已完成' },
{ value: '3', label: '超时' },
{ value: '4', label: '已关闭' },
{ value: '1', label: '待处理' },
{ value: '2', label: '处理中' },
{ value: '3', label: '已完成' },
{ value: '4', label: '超时' },
{ value: '5', label: '已关闭' },
]);
const logList = ref([
{ name: '李四', status: '2', time: '2024-03-10 10:00:00', desc: '完成' },
{ name: '李四', status: '3', time: '2024-03-10 10:00:00', desc: '完成' },
{ name: '王五', status: '5', time: '2024-03-10 10:00:00' },
{ name: '王五', status: '4', time: '2024-03-10 10:00:00' },
{ name: '王五', status: '3', time: '2024-03-10 10:00:00' },
{ name: '王五', status: '1', time: '2024-03-10 10:00:00', desc: '创建工单' },
{ name: '赵六', status: '0', time: '2024-03-10 10:00:00' },
{ name: '王五', status: '2', time: '2024-03-10 10:00:00', desc: '创建工单' },
{ name: '赵六', status: '1', time: '2024-03-10 10:00:00' },
]);
const config = ref({
size: logList.value.length,
@@ -82,18 +83,18 @@
const toggle = (data) => {
infoObject.value = { ...logList.value[0] };
let statusMap = {
0: '待处理',
1: '处理中',
2: '已完成',
3: '超时',
4: '已关闭',
1: '待处理',
2: '处理中',
3: '已完成',
4: '超时',
5: '已关闭',
};
let colorMap = {
0: '#ff7602',
1: '#00a1e6',
2: '#04d919',
3: '#d9001b',
4: '#a6a6a6',
1: '#ff7602',
2: '#00a1e6',
3: '#04d919',
4: '#d9001b',
5: '#a6a6a6',
};
logList.value.forEach((item) => {
item.statusName = statusMap[item.status];

View File

@@ -0,0 +1,51 @@
export const tableColumns = [
// {
// title: '序号',
// customRender: (text: any) => {
// return text.index + 1;
// },
// },
{
title: 'id',
dataIndex: 'id',
},
{
title: '字典组名',
dataIndex: 'grp',
},
{
title: '字典组名描述',
dataIndex: 'grpDesc',
},
{
title: '字典Key',
dataIndex: 'dicKey',
},
{
title: '字典中文Value',
dataIndex: 'cnValue',
},
{
title: '字典英文Value',
dataIndex: 'enValue',
},
{
title: '字典描述',
dataIndex: 'description',
},
{
title: '父级ID',
dataIndex: 'parentId',
},
{
title: '排序数字',
dataIndex: 'seq',
},
{
title: '是否展示',
dataIndex: 'showed',
},
{
title: '操作',
},
];

View File

@@ -0,0 +1,316 @@
<!-- eslint-disable vue/multi-word-component-names -->
<template>
<div>
<a-table
:columns="tableColumns"
:data-source="data"
bordered
:pagination="false"
:scroll="{ y: 530 }">
<template #bodyCell="{ text, column, record }">
<template v-if="column.dataIndex === 'showed'">
<a-switch
:checked="text"
:checked-value="0"
:unCheckedValue="1"
@change="(checked) => updateShowed(record, true)" />
</template>
<template v-if="column.title === '操作'">
<a-button type="link" @click="updateDict(record)">编辑</a-button>
<a-button type="link" @click="deleteDict(record)">删除</a-button>
</template>
</template>
<template #title>
<div
style="display: flex; align-items: center; justify-content: space-between; width: 100%">
<div style="display: flex; align-items: center; width: 85%">
<div style="width: 10%">数据报表</div>
<a-input
v-model:value="queryParams.grp"
placeholder="请输入字典组名"
style="width: 15%" />
<a-input
v-model:value="queryParams.grpDesc"
placeholder="请输入字典组名描述"
style="width: 15%; margin-left: 10px" />
<a-input
v-model:value="queryParams.dicKey"
placeholder="请输入字典Key"
style="width: 15%; margin-left: 10px" />
<a-input
v-model:value="queryParams.cnValue"
placeholder="请输入字典中文Value"
style="width: 15%; margin-left: 10px" />
<a-button type="primary" style="margin-left: 10px" @click="getTableList">
查询
</a-button>
</div>
<a-button type="primary" style="margin-left: 10px" @click="addDict"> 新增 </a-button>
</div>
</template>
</a-table>
<a-drawer
:width="600"
:visible="visible"
:title="updateInfo && updateInfo.id ? '编辑' : '新增'"
:body-style="{ paddingBottom: '80px' }"
:footer-style="{ textAlign: 'right' }"
destroyOnClose
@close="onClose">
<a-form
ref="formRef"
:model="updateInfo"
:rules="rules"
:label-col="labelCol"
:wrapper-col="wrapperCol">
<a-form-item ref="grp" label="字典组名" name="grp">
<a-input v-model:value="updateInfo.grp" placeholder="请输入字典组名" />
</a-form-item>
<a-form-item ref="grpDesc" label="字典组名描述" name="grpDesc">
<a-input v-model:value="updateInfo.grpDesc" placeholder="请输入字典组名描述" />
</a-form-item>
<a-form-item ref="dicKey" label="字典Key" name="dicKey">
<a-input v-model:value="updateInfo.dicKey" placeholder="请输入字典Key" />
</a-form-item>
<a-form-item ref="cnValue" label="字典中文Value" name="cnValue">
<a-input v-model:value="updateInfo.cnValue" placeholder="请输入字典中文Value" />
</a-form-item>
<a-form-item ref="enValue" label="字典英文Value" name="enValue">
<a-input v-model:value="updateInfo.enValue" placeholder="请输入字典英文Value" />
</a-form-item>
<a-form-item ref="description" label="字典描述" name="description">
<a-input v-model:value="updateInfo.description" placeholder="请输入字典描述" />
</a-form-item>
<a-form-item ref="parentId" label="父级ID" name="parentId">
<a-input v-model:value="updateInfo.parentId" placeholder="请输入父级ID" />
</a-form-item>
<a-form-item ref="seq" label="排序数字" name="seq">
<a-input v-model:value="updateInfo.seq" placeholder="请输入排序数字" />
</a-form-item>
<a-form-item ref="showed" label="是否展示" name="showed">
<!-- <a-input v-model:value="updateInfo.showed" placeholder="请输入是否展示" /> -->
<a-switch
:checked="updateInfo.showed"
:checked-value="0"
:unCheckedValue="1"
@change="updateShowed(updateInfo, false)" />
</a-form-item>
<!-- <a-form-item label="计量单位" name="unit">
<a-cascader v-model:value="formState.unit" :options="measurementUnit" />
</a-form-item>
<a-form-item label="自动采集节点" name="collectionNode">
<a-tree-select
v-model:value="formState.collectionNode"
:tree-line="true"
:tree-data="treeData" />
</a-form-item>
<a-form-item label="计算碳排" name="isComputeCarbon">
<a-radio-group v-model:value="formState.isComputeCarbon" @change="changeRadio">
<a-radio :value="0"></a-radio>
<a-radio :value="1"></a-radio>
</a-radio-group>
</a-form-item>
<a-form-item label="排放类型" name="emissionType" :required="isRequired">
<a-select v-model:value="formState.emissionType" placeholder="请选择排放类型">
<a-select-option v-for="(item, index) in emissionTypeDic" :key="index" :value="item.id">
{{ item.cnValue }}
</a-select-option>
</a-select>
</a-form-item> -->
</a-form>
<template #footer>
<a-button style="margin-right: 8px" @click="onClose">取消</a-button>
<a-button type="primary" @click="onSubmit">确定</a-button>
</template>
</a-drawer>
</div>
</template>
<script lang="ts" setup>
import { ref, onMounted, defineOptions } from 'vue';
import { http } from '/nerv-lib/util/http';
import type { FormInstance, Rule } from 'ant-design-vue/es/form';
import { tableColumns } from './config';
import { dict } from '/@/api/dict';
import { NsMessage } from '/nerv-lib/component';
import { Modal } from 'ant-design-vue';
defineOptions({
energyType: 'dictIndex', // 与页面路由name一致缓存才可生效
});
const data = ref([]);
const updateInfo = ref({});
const formRef = ref<FormInstance | null>(null);
const queryParams = ref({
grp: '',
grpDesc: '',
dicKey: '',
cnValue: '',
});
const orgId = ref('');
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
orgId.value = result;
const fetch = (api, params = { orgId }) => {
return http.post(api, params);
};
// 获取表格数据
const getTableList = () => {
fetch(dict.dictionaryUnitManagement, queryParams.value).then((res) => {
data.value = res.data;
});
};
// 修改是否显示状态
const updateShowed = (record: any, falg: Boolean) => {
if (record.showed == 0) {
record.showed = 1;
} else {
record.showed = 0;
}
if (falg) {
fetch(dict.updateDictionary, record).then((res) => {
getTableList();
});
} else {
}
};
const visible = ref(false);
// const formState = ref({
// orgId: orgId.value,
// });
const labelCol = { span: 5 };
const wrapperCol = { span: 19 };
// 定义form表单的必填
const rules: Record<string, Rule[]> = {
grp: [{ required: true, message: '请输入字典组名', trigger: 'change' }],
grpDesc: [{ required: true, message: '请输入字典组名描述', trigger: 'change' }],
dicKey: [{ required: true, message: '请输入字典Key', trigger: 'change' }],
cnValue: [{ required: true, message: '请输入字典中文Value', trigger: 'change' }],
seq: [{ required: true, message: '请输入排序数字', trigger: 'change' }],
showed: [{ required: true, message: '请输入是否展示', trigger: 'change' }],
};
// interface FormState {
// energyType: string;
// unit: string;
// collectionNode: string;
// emissionType: string | undefined;
// isComputeCarbon: string;
// janFlag: string;
// febFlag: string;
// marFlag: string;
// aprFlag: string;
// mayFlag: string;
// junFlag: string;
// julFlag: string;
// augFlag: string;
// sepFlag: string;
// octFlag: string;
// novFlag: string;
// decFlag: string;
// }
// 关闭新增抽屉
const onClose = () => {
visible.value = false;
// formState.value = {
// orgId: orgId.value,
// };
// formRef.value.resetFields();
};
// 打开编辑页
const updateDict = (record: any) => {
updateInfo.value = record;
visible.value = true;
// todo 打开编辑页
};
// 打开新增页
const addDict = () => {
updateInfo.value = {};
updateInfo.value.showed = 1;
visible.value = true;
// todo 打开编辑页
};
// 点击确定提交
const onSubmit = () => {
debugger;
formRef.value
?.validate()
.then((valid) => {
if (valid) {
if (updateInfo.value.id) {
fetch(dict.updateDictionary, updateInfo.value).then((res) => {
if (res.retcode == 0) {
visible.value = false;
NsMessage.success('保存成功');
getTableList();
}
});
} else {
fetch(dict.createDictionary, updateInfo.value).then((res) => {
if (res.retcode == 0) {
visible.value = false;
NsMessage.success('保存成功');
getTableList();
}
});
}
} else {
console.log('表单验证失败');
}
})
.catch((error) => {
console.log('表单验证失败', error);
});
};
// 删除字典
const deleteDict = (record: any) => {
Modal.confirm({
title: '警告',
// icon: createVNode(ExclamationCircleOutlined),
content: '确定要删除么?',
okText: '确认',
okType: 'primary',
cancelText: '取消',
onOk() {
// let params = ;
// // http.post(dict.delDictionary, params).then((res) => {
// // if (res.retcode == 0) {
// // visible.value = false;
// // NsMessage.success('删除成功');
// // getTableList();
// // }
// // });
fetch(dict.delDictionary, { id: record.id }).then((res) => {
if (res.retcode == 0) {
visible.value = false;
NsMessage.success('删除成功');
getTableList();
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
onMounted(() => {
getTableList();
});
</script>
<style scoped lang="less">
::v-deep .ant-table-title {
display: flex;
}
::v-deep .ant-table-container {
padding: 0px 16px;
}
</style>
<style scoped>
th.column-money,
td.column-money {
text-align: right !important;
}
</style>