Merge branch 'temp' into deploy-dev
This commit is contained in:
@@ -48,11 +48,18 @@
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
// 树组件
|
||||
:deep(.ant-tree-node-content-wrapper) {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
text-wrap: nowrap;
|
||||
}
|
||||
|
||||
:deep(.ant-tree-node-selected) {
|
||||
color: @primary-color !important;
|
||||
}
|
||||
|
||||
// ns-view-list-table 搜索区域
|
||||
:deep(.ns-table-search) {
|
||||
.ns-flexv2-form {
|
||||
.ns-operate {
|
||||
|
20
hx-ai-intelligent/src/api/IlluminationInfo.ts
Normal file
20
hx-ai-intelligent/src/api/IlluminationInfo.ts
Normal file
@@ -0,0 +1,20 @@
|
||||
|
||||
// 照明系统及相关接口
|
||||
export enum lightingManage {
|
||||
|
||||
// 主页 ========================================================
|
||||
|
||||
// 获得分区与线路
|
||||
getArea = '/carbon-smart/IlluminationInfo/region',
|
||||
// 修改线路的可用/禁用状态
|
||||
setDisable = '/carbon-smart/IlluminationInfo/revisePanel',
|
||||
|
||||
// 计划列表tab页 ================================================
|
||||
|
||||
// 获得计划列表tab页的表格数据
|
||||
getPlanTable = '/carbon-smart/IlluminationPlan/selectPanelPlan',
|
||||
// 获得计划列表tab页的穿梭框左侧数据
|
||||
getLeftPlan = '/carbon-smart/IlluminationPlan/getPlan',
|
||||
// 提交穿梭框被选择的数据
|
||||
submitLeftPlan = '/carbon-smart/IlluminationPlan/joinPlan',
|
||||
}
|
@@ -0,0 +1,5 @@
|
||||
export enum notificationManagementApi {
|
||||
getTableList = '/carbon-smart/api/AlarmContactInformation/selectAlarmContactInformation', //通知管理分页
|
||||
upData = '/carbon-smart/api/AlarmContactInformation/update', //通知管理 修改
|
||||
findById = '/carbon-smart/api/AlarmContactInformation/findById', //通知管理 查询详情
|
||||
}
|
@@ -9,11 +9,11 @@ export enum carbonEmissionFactorLibrary {
|
||||
creat = '/carbon-smart/api/carbon/emission/type/creatOrUpdate',
|
||||
delTreeNode = '/carbon-smart/api/carbon/emission/type/del',
|
||||
// 单位管理
|
||||
dictionaryUnitManagement = '/carbon-smart/api/carbon/emission/factor/dictionaryUnitManagement',
|
||||
findOutermost = '/carbon-smart/api/carbon/emission/factor/findOutermost',
|
||||
createDictionary = '/carbon-smart/api/carbon/emission/factor/createDictionary',
|
||||
updateDictionary = '/carbon-smart/api/carbon/emission/factor/updateDictionary',
|
||||
delDictionary = '/carbon-smart/api/carbon/emission/factor/delDictionary',
|
||||
dictionaryUnitManagement = '/carbon-smart/client/dict/dictionaryUnitManagement',
|
||||
findOutermost = '/carbon-smart/client/dict/findOutermost',
|
||||
createDictionary = '/carbon-smart/client/dict/createDictionary',
|
||||
updateDictionary = '/carbon-smart/client/dict/updateDictionary',
|
||||
delDictionary = '/carbon-smart/client/dict/delDictionary',
|
||||
}
|
||||
// 碳排管理-碳排统计接口
|
||||
export enum energyConsumption {
|
||||
@@ -35,4 +35,11 @@ export enum quickCalculation {
|
||||
// 碳排管理-碳排统计接口
|
||||
export enum carbonEmission {
|
||||
carbonEmissionStatistics = '/carbon-smart/api/carbon/energy/correlation/carbonEmissionStatistics',
|
||||
}
|
||||
// 碳盘查接口
|
||||
export enum carbonInventoryCheck {
|
||||
carbonInventoryList = '/carbon-smart/api/carbon/report/carbonInventoryList',
|
||||
createOrUpdate = '/carbon-smart/api/carbon/report/createOrUpdate',
|
||||
findById = '/carbon-smart/api/carbon/report/findById',
|
||||
delete = '/carbon-smart/api/carbon/report/delete',
|
||||
}
|
@@ -1,7 +1,6 @@
|
||||
<template>
|
||||
<ns-modal
|
||||
ref="modalRef"
|
||||
centered
|
||||
v-bind="extraModalConfig"
|
||||
destroyOnClose
|
||||
v-model:visible="visible"
|
||||
|
@@ -3,40 +3,17 @@
|
||||
<template v-for="(item, index) in dataSource" :key="index">
|
||||
<a-step>
|
||||
<template #icon>
|
||||
<img :style="{ width: item.status === '2' ? '19px' : '20px' }" :src="getSrc(item)" />
|
||||
<ns-icon size="20" :name="item.src" />
|
||||
</template>
|
||||
<template #description>
|
||||
<div
|
||||
style="
|
||||
width: 400px;
|
||||
min-height: 0px;
|
||||
background-color: #f8fafc;
|
||||
margin-left: 20px;
|
||||
border-radius: 4px; /* 设置圆角半径 */
|
||||
padding: 12px;
|
||||
">
|
||||
<div style="width: 100%; height: 30px; display: flex; position: relative">
|
||||
<a-tag
|
||||
style="width: 60px; height: 20px; text-align: center"
|
||||
:color="getColor(item)"
|
||||
>{{ getStatus(item) }}</a-tag
|
||||
>
|
||||
<div
|
||||
style="
|
||||
position: absolute;
|
||||
left: 35%;
|
||||
top: -2px;
|
||||
transform: translateX(-50%);
|
||||
color: #3a3a3a;
|
||||
"
|
||||
>{{ item.name }}</div
|
||||
>
|
||||
<div style="position: absolute; right: 10px; top: -2px; color: #ff7602"
|
||||
>2024-03-11 11:30:06</div
|
||||
>
|
||||
<div class="card">
|
||||
<div class="card-title">
|
||||
<a-tag class="card-title-tag" :color="item.color">{{ item.statusName }}</a-tag>
|
||||
<div class="name">{{ item.name }}</div>
|
||||
<div class="time">{{ item.time }}</div>
|
||||
</div>
|
||||
<div style="width: 100%; color: #3a3a3a; height: 25px; overflow: auto">
|
||||
工单已完成并通过验收</div
|
||||
{{ item.desc }}</div
|
||||
>
|
||||
</div>
|
||||
</template>
|
||||
@@ -53,37 +30,6 @@
|
||||
size: any;
|
||||
};
|
||||
const props = withDefaults(defineProps<Props>(), {});
|
||||
const getColor = (item: any) => {
|
||||
switch (item.status) {
|
||||
case '0':
|
||||
return '#ff7602';
|
||||
case '1':
|
||||
return '#00a1e6';
|
||||
case '2':
|
||||
return '#04d919';
|
||||
case '3':
|
||||
return '#d9001b';
|
||||
case '4':
|
||||
return '#a6a6a6';
|
||||
}
|
||||
};
|
||||
const getSrc = (item: any) => {
|
||||
return '../../../../src/icon/status-' + item.status + '.svg';
|
||||
};
|
||||
const getStatus = (item: any) => {
|
||||
switch (item.status) {
|
||||
case '0':
|
||||
return '待处理';
|
||||
case '1':
|
||||
return '处理中';
|
||||
case '2':
|
||||
return '已完成';
|
||||
case '3':
|
||||
return '超时';
|
||||
case '4':
|
||||
return '已关闭';
|
||||
}
|
||||
};
|
||||
const { dataSource } = toRefs(props);
|
||||
const { size } = toRefs(props);
|
||||
|
||||
@@ -94,6 +40,38 @@
|
||||
margin-left: 20px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.card {
|
||||
width: 400px;
|
||||
min-height: 0px;
|
||||
background-color: #f8fafc;
|
||||
margin-left: 20px;
|
||||
border-radius: 4px; /* 设置圆角半径 */
|
||||
padding: 12px;
|
||||
.card-title {
|
||||
width: 100%;
|
||||
height: 30px;
|
||||
display: flex;
|
||||
position: relative;
|
||||
.card-title-tag {
|
||||
width: 60px;
|
||||
height: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
.name {
|
||||
position: absolute;
|
||||
left: 35%;
|
||||
top: -2px;
|
||||
transform: translateX(-50%);
|
||||
color: #3a3a3a;
|
||||
}
|
||||
.time {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: -2px;
|
||||
color: #ff7602;
|
||||
}
|
||||
:deep(.ant-steps-item-tail) {
|
||||
position: absolute !important;
|
||||
top: -10px !important;
|
||||
|
@@ -6,8 +6,11 @@ import { get } from 'lodash-es';
|
||||
import { computed, ref, toRef } from 'vue';
|
||||
|
||||
const ORGID = sessionStorage.getItem('ORGID') ? Number(sessionStorage.getItem('ORGID')) : '';
|
||||
|
||||
const isAdmin = sessionStorage.getItem('ISADMIN')
|
||||
? Boolean(sessionStorage.getItem('ISADMIN'))
|
||||
: false;
|
||||
const selectDefaultValue = ref(ORGID);
|
||||
const selectDefaultDisabled = ref(isAdmin);
|
||||
const transform = (data, map) => {
|
||||
return Object.keys(map).reduce((pre, cur) => {
|
||||
pre[cur] = data[map[cur]];
|
||||
@@ -43,6 +46,7 @@ export const appConfig = {
|
||||
api: '/carbon-smart/user/login/logInInfo',
|
||||
size: 'large',
|
||||
defaultValue: selectDefaultValue,
|
||||
disabled: selectDefaultDisabled,
|
||||
// autoSelectFirst: true,
|
||||
placeholder: '请选择',
|
||||
onSelect: async (cur, record) => {
|
||||
@@ -52,7 +56,7 @@ export const appConfig = {
|
||||
sessionStorage.setItem('ORGID', record.orgId);
|
||||
const res = await configStore.userResource({ data: record });
|
||||
useAuthorization.updateUserResource(res.data);
|
||||
|
||||
window.location.reload();
|
||||
// value.value = cur;
|
||||
},
|
||||
resultField: 'data.linkList',
|
||||
@@ -91,8 +95,11 @@ export const appConfig = {
|
||||
projectId: 'projectId',
|
||||
linkList: 'linkList',
|
||||
permissionVos: 'permissionVos',
|
||||
adminFlag: 'adminFlag',
|
||||
});
|
||||
sessionStorage.setItem('ORGID', info.orgId);
|
||||
sessionStorage.setItem('ISADMIN', trD?.adminFlag === '1');
|
||||
selectDefaultDisabled.value = info?.adminFlag === '1';
|
||||
selectDefaultValue.value = info.orgId;
|
||||
return { data: { ...trD } };
|
||||
});
|
||||
|
6
hx-ai-intelligent/src/icon/baocun.svg
Normal file
6
hx-ai-intelligent/src/icon/baocun.svg
Normal file
@@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="20px" height="20px" xmlns="http://www.w3.org/2000/svg">
|
||||
<g transform="matrix(1 0 0 1 -320 -9 )">
|
||||
<path d="M 5.72142857421875 4.29571427734375 L 5.72142857421875 0.0171428515625 L 10 0.0171428515625 L 10 4.29571427734375 L 5.72142857421875 4.29571427734375 Z M 14.564285722656251 0.3028571484375 L 19.84 5.57857142578125 C 19.9828571484375 5.57857142578125 19.9828571484375 5.864285703125001 20 6.0071428515625005 L 20 19.27 C 19.9828571484375 19.69857142578125 19.697142871093753 19.98428572265625 19.27 20 L 0.73 20 C 0.30142857421874997 19.98428572265625 0.015714277343749916 19.6985714453125 0 19.27 L 0 0.73 C 0.015714277343749916 0.30142857421874997 0.30142855468749996 0.015714277343749916 0.73 0.015714277343749916 L 4.29571427734375 0.015714277343749916 L 4.29571427734375 5.72142857421875 L 11.42571427734375 5.72142857421875 L 11.42571427734375 0.0171428515625 L 13.992857148437501 0.0171428515625 C 14.135714296875001 0.0171428515625 14.421428574218751 0.16 14.564285722656251 0.3028571484375 Z M 4.29571427734375 15.70428572265625 L 15.70428572265625 15.704285722656248 L 15.70428572265625 10 L 4.29571427734375 10 L 4.29571427734375 15.70428572265625 Z " fill-rule="nonzero" fill="#ff7602" stroke="none" transform="matrix(1 0 0 1 320 9 )" />
|
||||
</g>
|
||||
</svg>
|
6
hx-ai-intelligent/src/icon/bianji.svg
Normal file
6
hx-ai-intelligent/src/icon/bianji.svg
Normal file
@@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="20px" height="20px" xmlns="http://www.w3.org/2000/svg">
|
||||
<g transform="matrix(1 0 0 1 -320 -9 )">
|
||||
<path d="M 17.482232142857143 6.05310267857143 L 7.481830357142856 16.053526785714283 L 3.946339285714287 12.518035714285713 L 13.946741071428567 2.5176116071428565 L 17.482232142857143 6.05310267857143 Z M 2.8571428571428568 17.142857142857142 L 2.8571428571428568 13.607142857142856 L 6.392857142857144 17.142857142857142 L 2.8571428571428568 17.142857142857142 Z M 18.013392857142858 0.4017857142857143 L 19.598214285714285 1.9866071428571428 C 20.133928571428573 2.5223214285714284 20.133928571428573 3.3995535714285703 19.598214285714285 3.937500000000002 L 18.55357142857143 4.982142857142853 L 15.017857142857142 1.4464285714285705 L 16.062499999999996 0.4017857142857143 C 16.598214285714285 -0.13392857142857142 17.47544642857143 -0.13392857142857142 18.013392857142858 0.4017857142857143 Z M 0 15.714285714285714 L 1.4285714285714284 15.714285714285714 L 1.4285714285714284 18.571428571424978 L 1.4285714285714284 20 L 0 20 L 0 15.714285714285714 Z M 18.571428571428573 20 L 1.4285714285714284 20 L 1.4285714285714284 18.571428571428573 L 18.571428571428573 18.571428571428573 L 18.571428571428573 20 Z M 20 15.714285714285714 L 20 20 L 18.571428571428573 20 L 18.571428571428573 15.714285714285714 L 20 15.714285714285714 Z " fill-rule="nonzero" fill="#ff7602" stroke="none" transform="matrix(1 0 0 1 320 9 )" />
|
||||
</g>
|
||||
</svg>
|
@@ -18,7 +18,7 @@ const alarmManagement = {
|
||||
component: () => import('/@/view/alarmManagement/alarmOverview/index.vue'),
|
||||
meta: {
|
||||
title: '告警总览',
|
||||
keepAlive: true,
|
||||
keepAlive: false,
|
||||
// backApi: [],
|
||||
},
|
||||
},
|
||||
@@ -37,12 +37,31 @@ const alarmManagement = {
|
||||
component: () => import('/@/view/alarmManagement/equipmentAlarm/index.vue'),
|
||||
meta: {
|
||||
title: '设备告警',
|
||||
keepAlive: true,
|
||||
keepAlive: false,
|
||||
// backApi: [],
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
// {
|
||||
// path: 'gatewayAlarm',
|
||||
// name: 'GatewayAlarm',
|
||||
// meta: { title: '网关告警', hideChildren: true, icon: 'gaojingguanli' },
|
||||
// component: Base,
|
||||
// redirect: { name: 'GatewayAlarmIndex' },
|
||||
// children: [
|
||||
// {
|
||||
// path: 'index',
|
||||
// name: 'GatewayAlarmIndex',
|
||||
// component: () => import('/@/view/alarmManagement/gatewayAlarm/index.vue'),
|
||||
// meta: {
|
||||
// title: '网关告警',
|
||||
// keepAlive: false,
|
||||
// // backApi: [],
|
||||
// },
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
{
|
||||
path: 'alarmSettings',
|
||||
name: 'AlarmSettings',
|
||||
@@ -56,7 +75,7 @@ const alarmManagement = {
|
||||
component: () => import('/@/view/alarmManagement/alarmSettings/index.vue'),
|
||||
meta: {
|
||||
title: '告警设置',
|
||||
keepAlive: true,
|
||||
keepAlive: false,
|
||||
operates: [
|
||||
{ title: '设备告警新增', code: 'equipmentAlarmAdd' },
|
||||
{ title: '设备告警导入', code: 'equipmentAlarmImport' },
|
||||
|
@@ -19,7 +19,7 @@ const equipment = {
|
||||
component: () => import('/@/view/carbonEmissionManage/carbonEmissionStatistics/index.vue'),
|
||||
meta: {
|
||||
title: '碳排统计',
|
||||
keepAlive: true,
|
||||
keepAlive: false,
|
||||
// backApi: [],
|
||||
},
|
||||
},
|
||||
@@ -39,7 +39,27 @@ const equipment = {
|
||||
component: () => import('/@/view/carbonEmissionManage/carbonEmissionFactorLibrary/index.vue'),
|
||||
meta: {
|
||||
title: '碳排因子库',
|
||||
keepAlive: true,
|
||||
keepAlive: false,
|
||||
// backApi: [],
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: 'carbonInventoryCheck',
|
||||
name: 'CarbonInventoryCheck',
|
||||
meta: { title: '碳盘查', hideChildren: true, icon: 'tanpaiguanli' },
|
||||
component: Base,
|
||||
redirect: { name: 'CarbonInventoryCheckIndex' },
|
||||
children: [
|
||||
{
|
||||
path: 'index',
|
||||
name: 'CarbonInventoryCheckIndex',
|
||||
// component: () => import('/nerv-lib/saas/view/menuManage/index.vue'),
|
||||
component: () => import('/@/view/carbonEmissionManage/carbonInventoryCheck/index.vue'),
|
||||
meta: {
|
||||
title: '碳盘查',
|
||||
keepAlive: false,
|
||||
// backApi: [],
|
||||
},
|
||||
},
|
||||
|
@@ -18,7 +18,7 @@ const equipmentControl = {
|
||||
component: () => import('/@/view/equipmentControl/lightingManage/indexs.vue'),
|
||||
meta: {
|
||||
title: '智能照明',
|
||||
keepAlive: true,
|
||||
keepAlive: false,
|
||||
// backApi: [],
|
||||
},
|
||||
},
|
||||
|
@@ -19,7 +19,7 @@ const equipment = {
|
||||
component: () => import('/@/view/equipmentManage/ledger/index.vue'),
|
||||
meta: {
|
||||
title: '设备台账',
|
||||
keepAlive: true,
|
||||
keepAlive: false,
|
||||
// backApi: [],
|
||||
},
|
||||
},
|
||||
@@ -38,7 +38,7 @@ const equipment = {
|
||||
component: () => import('/@/view/equipmentManage/group/index.vue'),
|
||||
meta: {
|
||||
title: '分组管理',
|
||||
keepAlive: true,
|
||||
keepAlive: false,
|
||||
// backApi: [],
|
||||
},
|
||||
},
|
||||
@@ -57,7 +57,7 @@ const equipment = {
|
||||
// component: () => import('/@/view/equipmentManage/energyMapping/index.vue'),
|
||||
// meta: {
|
||||
// title: '能耗映射',
|
||||
// keepAlive: true,
|
||||
// keepAlive: false,
|
||||
// // backApi: [],
|
||||
// },
|
||||
// },
|
||||
|
@@ -17,7 +17,7 @@ const home = {
|
||||
// name: 'homeIndex',
|
||||
// meta: {
|
||||
// title: '首页',
|
||||
// keepAlive: true,
|
||||
// keepAlive: false,
|
||||
// // backApi: [],
|
||||
// },
|
||||
// },
|
||||
|
@@ -18,7 +18,7 @@ const equipment = {
|
||||
component: () => import('/@/view/monitor/environmentMonitor/index.vue'),
|
||||
meta: {
|
||||
title: '环境监测',
|
||||
keepAlive: true,
|
||||
keepAlive: false,
|
||||
// backApi: [],
|
||||
},
|
||||
},
|
||||
@@ -37,7 +37,7 @@ const equipment = {
|
||||
component: () => import('/@/view/monitor/deviceMonitor/index.vue'),
|
||||
meta: {
|
||||
title: '设备监测',
|
||||
keepAlive: true,
|
||||
keepAlive: false,
|
||||
// backApi: [],
|
||||
},
|
||||
},
|
||||
@@ -56,7 +56,7 @@ const equipment = {
|
||||
component: () => import('/@/view/monitor/energyMonitor/index.vue'),
|
||||
meta: {
|
||||
title: '能耗监测',
|
||||
keepAlive: true,
|
||||
keepAlive: false,
|
||||
// backApi: [],
|
||||
},
|
||||
},
|
||||
@@ -75,7 +75,7 @@ const equipment = {
|
||||
// component: () => import('/@/view/monitor/group/index.vue'),
|
||||
// meta: {
|
||||
// title: '分组管理',
|
||||
// keepAlive: true,
|
||||
// keepAlive: false,
|
||||
// // backApi: [],
|
||||
// },
|
||||
// },
|
||||
|
@@ -18,7 +18,7 @@ const organizationManage = {
|
||||
component: () => import('/@/view/organizationManage/usermanage/index.vue'),
|
||||
meta: {
|
||||
title: '用户管理',
|
||||
keepAlive: true,
|
||||
keepAlive: false,
|
||||
operates: [
|
||||
{ title: '新增', code: 'userAdd' },
|
||||
{ title: '导入', code: 'userImport' },
|
||||
@@ -48,7 +48,7 @@ const organizationManage = {
|
||||
component: () => import('/@/view/organizationManage/departmentManage/index.vue'),
|
||||
meta: {
|
||||
title: '部门/权限',
|
||||
keepAlive: true,
|
||||
keepAlive: false,
|
||||
operates: [
|
||||
{ title: '新增部门', code: 'authorityDeptAdd' },
|
||||
{ title: '新增子部门', code: 'authorityDeptSonAdd' },
|
||||
|
@@ -8,18 +8,66 @@
|
||||
:cancel="handleClose"
|
||||
placement="right"
|
||||
@close="handleClose">
|
||||
<ns-form ref="formRef" :schemas="schemas" :model="infoObject" formLayout="vertical" />
|
||||
<div style="margin-left: 52px">
|
||||
应用规则:
|
||||
<a-switch
|
||||
:checked="infoObject?.enableRules === 1 ? true : false"
|
||||
:class="{
|
||||
'blue-background': infoObject?.enableRules === 1 ? true : false,
|
||||
'grey-background': infoObject?.enableRules === 1 ? false : true,
|
||||
}"
|
||||
style="margin-left: 6px"
|
||||
@change="changeSwitch" />
|
||||
</div>
|
||||
<a-form ref="formRef" :model="infoObject" :rules="rules">
|
||||
<a-form-item name="alarmTitle" label="告警标题">
|
||||
<ns-input allowClear v-model:value="infoObject.alarmTitle" placeholder="请输入告警标题" />
|
||||
</a-form-item>
|
||||
<a-form-item label="告警频率" name="alarmFrequency">
|
||||
<a-select
|
||||
v-model:value="infoObject.alarmFrequency"
|
||||
placeholder="请选择告警频率"
|
||||
style="width: 100%"
|
||||
allowClear
|
||||
:options="alarmFrequencyData" />
|
||||
</a-form-item>
|
||||
<a-form-item v-if="infoObject.alarmFrequency === 2" name="repetitions" label="重复次数">
|
||||
<ns-input-number v-model:value="infoObject.repetitions" placeholder="请输入重复次数" />
|
||||
</a-form-item>
|
||||
<a-form-item v-if="infoObject.alarmFrequency === 2" name="intervalDuration" label="间隔时长">
|
||||
<ns-input-number
|
||||
style="width: 60%"
|
||||
v-model:value="infoObject.intervalDuration"
|
||||
placeholder="请输入间隔时长" />
|
||||
<a-select
|
||||
v-model:value="infoObject.intervalDurationUnit"
|
||||
placeholder="请选择间隔时长单位"
|
||||
style="width: 40%"
|
||||
allowClear
|
||||
:options="intervalDurationUnitData" />
|
||||
</a-form-item>
|
||||
<a-form-item label="优先级" name="priority">
|
||||
<a-select
|
||||
v-model:value="infoObject.priority"
|
||||
placeholder="请选择优先级"
|
||||
style="width: 100%"
|
||||
allowClear
|
||||
:options="priorityData" />
|
||||
</a-form-item>
|
||||
<a-form-item label="监测频率" name="monitorFrequency">
|
||||
<a-select
|
||||
v-model:value="infoObject.monitorFrequency"
|
||||
placeholder="请选择监测频率"
|
||||
style="width: 100%"
|
||||
allowClear
|
||||
:options="monitorFrequencyData" />
|
||||
</a-form-item>
|
||||
<a-form-item label="启用规则">
|
||||
<a-switch
|
||||
:checked="infoObject?.enableRules === 1 ? true : false"
|
||||
:class="{
|
||||
'blue-background': infoObject?.enableRules === 1 ? true : false,
|
||||
'grey-background': infoObject?.enableRules === 1 ? false : true,
|
||||
}"
|
||||
style="margin-left: 6px"
|
||||
@change="changeSwitch" />
|
||||
</a-form-item>
|
||||
<a-form-item label="是否创建工单" name="createWorkOrder">
|
||||
<a-radio-group v-model:value="infoObject.createWorkOrder">
|
||||
<a-radio value="1">是 </a-radio>
|
||||
<a-radio value="0">否 </a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</ns-drawer>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
@@ -31,156 +79,147 @@
|
||||
const visible = ref(false);
|
||||
//表单数据
|
||||
const infoObject = ref({
|
||||
alarmTitle: null,
|
||||
alarmFrequency: null,
|
||||
priority: null,
|
||||
monitorFrequency: null,
|
||||
createWorkOrder: null,
|
||||
enableRules: 0,
|
||||
});
|
||||
const formRef = ref();
|
||||
const emit = defineEmits(['editObject']);
|
||||
const alarmFrequencyData = ref([
|
||||
{
|
||||
label: '单次',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '重复',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: '累计',
|
||||
value: 3,
|
||||
},
|
||||
]);
|
||||
const priorityData = ref([
|
||||
{
|
||||
label: '紧急',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '重要',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: '一般',
|
||||
value: 3,
|
||||
},
|
||||
]);
|
||||
const intervalDurationUnitData = ref([
|
||||
{
|
||||
label: '分',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '时',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: '天',
|
||||
value: 3,
|
||||
},
|
||||
]);
|
||||
const monitorFrequencyData = ref([
|
||||
{
|
||||
label: '小时',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '每日',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: '每周',
|
||||
value: 3,
|
||||
},
|
||||
{
|
||||
label: '月度',
|
||||
value: 4,
|
||||
},
|
||||
{
|
||||
label: '年度',
|
||||
value: 5,
|
||||
},
|
||||
]);
|
||||
const rules = {
|
||||
alarmTitle: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入告警标题',
|
||||
trigger: 'change',
|
||||
validator: (rules: any, alarmTitle: any, cbfn: any) => {
|
||||
if (alarmTitle && alarmTitle.trim() !== '') {
|
||||
cbfn();
|
||||
} else {
|
||||
cbfn('告警标题不能为空');
|
||||
}
|
||||
},
|
||||
},
|
||||
],
|
||||
alarmFrequency: [{ required: true, message: '请选择告警频率', trigger: 'change' }],
|
||||
intervalDuration: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入正确的间隔时长',
|
||||
trigger: 'change',
|
||||
validator: (rules: any, intervalDuration: any, cbfn: any) => {
|
||||
if (intervalDuration && intervalDuration > 0) {
|
||||
cbfn();
|
||||
} else {
|
||||
cbfn('请输入正确的间隔时长');
|
||||
}
|
||||
if (!infoObject.value.intervalDurationUnit) {
|
||||
cbfn('请选择间隔时长单位');
|
||||
}
|
||||
},
|
||||
},
|
||||
],
|
||||
repetitions: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入正确的重复次数',
|
||||
trigger: 'change',
|
||||
validator: (rules: any, repetitions: any, cbfn: any) => {
|
||||
if (repetitions && repetitions > 0) {
|
||||
cbfn();
|
||||
} else {
|
||||
cbfn('请输入正确的重复次数');
|
||||
}
|
||||
},
|
||||
},
|
||||
],
|
||||
createWorkOrder: [{ required: true, message: '请选择是否创建工单', trigger: 'change' }],
|
||||
monitorFrequency: [{ required: true, message: '请选择监测频率', trigger: 'change' }],
|
||||
priority: [{ required: true, message: '请选择优先级', trigger: 'change' }],
|
||||
monitorTimeUnit: [{ required: true, message: '请选择监测时长单位', trigger: 'change' }],
|
||||
};
|
||||
const toggle = (value: any) => {
|
||||
//判断 是新增 还是修改
|
||||
if (value) {
|
||||
infoObject.value = value;
|
||||
} else {
|
||||
infoObject.value = {
|
||||
alarmTitle: null,
|
||||
alarmFrequency: null,
|
||||
priority: null,
|
||||
monitorFrequency: null,
|
||||
createWorkOrder: null,
|
||||
enableRules: 0,
|
||||
};
|
||||
}
|
||||
visible.value = !visible.value;
|
||||
};
|
||||
const schemas = [
|
||||
{
|
||||
field: 'basicInfo',
|
||||
label: '',
|
||||
displayFormItem: false,
|
||||
class: 'ns-form-item-full',
|
||||
component: 'NsChildForm',
|
||||
componentProps: {
|
||||
schemas: [
|
||||
{
|
||||
field: 'alarmTitle',
|
||||
label: '告警标题',
|
||||
component: 'NsInput',
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '告警标题不能为空',
|
||||
trigger: 'change',
|
||||
validator: (rules: any, alarmTitle: any, cbfn: any) => {
|
||||
if (alarmTitle && alarmTitle.trim() !== '') {
|
||||
cbfn();
|
||||
} else {
|
||||
cbfn('告警标题不能为空');
|
||||
}
|
||||
},
|
||||
},
|
||||
],
|
||||
componentProps: {
|
||||
placeholder: '请输入告警标题',
|
||||
maxLength: 20,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'repetitions',
|
||||
label: '重复次数',
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '重复次数不能为空',
|
||||
trigger: 'change',
|
||||
},
|
||||
],
|
||||
component: 'NsSelect',
|
||||
componentProps: {
|
||||
allowClear: true,
|
||||
placeholder: '请选择重复次数',
|
||||
|
||||
options: [
|
||||
{
|
||||
label: '单次',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '重复',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: '累计',
|
||||
value: 3,
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'priority',
|
||||
label: '优先级',
|
||||
component: 'NsSelect',
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '优先级不能为空',
|
||||
trigger: 'change',
|
||||
},
|
||||
],
|
||||
componentProps: {
|
||||
allowClear: true,
|
||||
placeholder: '请选择优先级',
|
||||
options: [
|
||||
{
|
||||
label: '紧急',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '重要',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: '一般',
|
||||
value: 3,
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'monitorFrequency',
|
||||
label: '监测频率',
|
||||
component: 'NsSelect',
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '监测频率不能为空',
|
||||
trigger: 'change',
|
||||
},
|
||||
],
|
||||
componentProps: {
|
||||
allowClear: true,
|
||||
placeholder: '请选择优先级',
|
||||
options: [
|
||||
{
|
||||
label: '小时',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '每日',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: '每周',
|
||||
value: 3,
|
||||
},
|
||||
{
|
||||
label: '月度',
|
||||
value: 4,
|
||||
},
|
||||
{
|
||||
label: '年度',
|
||||
value: 5,
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
];
|
||||
//开关
|
||||
const changeSwitch = () => {
|
||||
switch (infoObject.value.enableRules) {
|
||||
@@ -194,9 +233,16 @@
|
||||
};
|
||||
const btnClick = () => {
|
||||
//表单校验
|
||||
formRef.value.triggerSubmit().then(() => {
|
||||
formRef.value.validate().then(() => {
|
||||
let data = { ...infoObject.value };
|
||||
data.createWorkOrder = Number(data.createWorkOrder);
|
||||
if (data.alarmFrequency !== 2) {
|
||||
data.repetitions = null;
|
||||
data.intervalDuration = null;
|
||||
data.intervalDurationUnit = null;
|
||||
}
|
||||
//调用接口
|
||||
http.post(energyAlarms.addOrUpNewData, infoObject.value).then(() => {
|
||||
http.post(energyAlarms.addOrUpNewData, data).then(() => {
|
||||
emit('editObject', null);
|
||||
if (infoObject.value.id) {
|
||||
NsMessage.success('告警编辑成功');
|
||||
@@ -209,8 +255,13 @@
|
||||
};
|
||||
const handleClose = () => {
|
||||
// 清楚校验错误信息
|
||||
formRef.value.formElRef.clearValidate();
|
||||
formRef.value.resetFields();
|
||||
infoObject.value = {
|
||||
alarmTitle: null,
|
||||
alarmFrequency: null,
|
||||
priority: null,
|
||||
monitorFrequency: null,
|
||||
createWorkOrder: null,
|
||||
enableRules: 0,
|
||||
};
|
||||
visible.value = false;
|
||||
@@ -250,4 +301,9 @@
|
||||
.grey-background.ant-switch .ant-switch-handle {
|
||||
background-color: grey !important;
|
||||
}
|
||||
:deep(.ant-form-item-label) {
|
||||
z-index: 20;
|
||||
text-align: right;
|
||||
width: 23%;
|
||||
}
|
||||
</style>
|
||||
|
@@ -204,7 +204,7 @@
|
||||
title: value.errorCode,
|
||||
schemas: [
|
||||
{
|
||||
field: 'deviceName',
|
||||
field: 'deviceId',
|
||||
label: '设备名称',
|
||||
component: 'nsSelectApi',
|
||||
componentProps: {
|
||||
@@ -215,7 +215,7 @@
|
||||
pageNum: 1,
|
||||
pageSize: 99,
|
||||
},
|
||||
placeholder: '请选择设备点位',
|
||||
placeholder: '请选择设备名称',
|
||||
resultField: 'data.records',
|
||||
labelField: 'deviceName',
|
||||
valueField: 'id',
|
||||
@@ -231,7 +231,7 @@
|
||||
label: '设备点位',
|
||||
component: 'nsSelectApi',
|
||||
dynamicParams: {
|
||||
id: 'deviceName', //帮定上级联动数据
|
||||
id: 'deviceId', //帮定上级联动数据
|
||||
},
|
||||
componentProps: {
|
||||
api: device.queryDevicePoint,
|
||||
@@ -240,7 +240,7 @@
|
||||
placeholder: '请选择设备点位',
|
||||
labelField: 'code',
|
||||
valueField: 'id',
|
||||
dependency: 'deviceName',
|
||||
dependency: 'deviceId',
|
||||
showSearch: true,
|
||||
filterOption: (input: string, option: any) => {
|
||||
return option.code.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
||||
|
@@ -40,9 +40,9 @@
|
||||
@change="selectDeviceType"
|
||||
placeholder="请选择设备类型" />
|
||||
</a-form-item>
|
||||
<a-form-item label="设备名称" name="deviceName">
|
||||
<a-form-item label="设备名称" name="deviceId">
|
||||
<a-select
|
||||
v-model:value="infoObject.deviceName"
|
||||
v-model:value="infoObject.deviceId"
|
||||
:disabled="!(infoObject && infoObject.deviceType && infoObject.deviceType.length > 0)"
|
||||
style="width: 100%"
|
||||
:autoClearSearchValue="true"
|
||||
@@ -61,7 +61,7 @@
|
||||
show-search
|
||||
placeholder="请选择设备点位"
|
||||
style="width: 100%"
|
||||
:disabled="!infoObject?.deviceName"
|
||||
:disabled="!infoObject?.deviceId"
|
||||
:options="devicePointData"
|
||||
:filter-option="filterDevicePoint" />
|
||||
</a-form-item>
|
||||
@@ -167,7 +167,7 @@
|
||||
deviceType: [],
|
||||
devicePoint: null,
|
||||
valueType: null,
|
||||
deviceName: null,
|
||||
deviceId: null,
|
||||
enableRules: 0,
|
||||
alarmList: [{ logic: null, num: null, isDelete: 0 }],
|
||||
});
|
||||
@@ -190,14 +190,14 @@
|
||||
//获取该类型设备
|
||||
getDevicePage({
|
||||
orgId: orgId.value,
|
||||
code: selectedOptions[selectedOptions.length - 1].code,
|
||||
deviceCode: selectedOptions[selectedOptions.length - 1].code,
|
||||
pageNum: 1,
|
||||
pageSize: 999,
|
||||
});
|
||||
};
|
||||
//选择设备方法
|
||||
const selectDevice = (value: string) => {
|
||||
console.log(`selected ${value}`);
|
||||
const selectDevice = () => {
|
||||
getDevicePoint({ id: infoObject.value.deviceId });
|
||||
};
|
||||
//获取设备列表
|
||||
const getDevicePage = (value: any) => {
|
||||
@@ -258,16 +258,21 @@
|
||||
const emit = defineEmits(['editObject']);
|
||||
|
||||
// 定义一个递归函数来查找每一级的id 设备类型回显 层级方法
|
||||
function findParentIds(tree: any, targetId: number, result: any) {
|
||||
function findParentIds(tree: any[], targetId: number, result: number[]): boolean {
|
||||
for (let item of tree) {
|
||||
if (item.children && item.children.length > 0) {
|
||||
if (item.children.some((child: any) => child.id === targetId)) {
|
||||
result.unshift(item.id); // 将当前节点的id添加到结果数组的最前面
|
||||
findParentIds(tree, item.id, result); // 递归查找父级节点的id
|
||||
break; // 找到后可以退出循环
|
||||
return true; // 表示找到了目标节点的父节点
|
||||
}
|
||||
// 递归查找当前节点的子节点
|
||||
if (findParentIds(item.children, targetId, result)) {
|
||||
result.unshift(item.id); // 递归返回后,将当前节点的id添加到结果数组的最前面
|
||||
return true;
|
||||
}
|
||||
}
|
||||
}
|
||||
return false; // 没有找到目标节点
|
||||
}
|
||||
// 递归 获取当前 选择的设备类型 对象 用来获取设备列表
|
||||
const findNodeById = (nodes: any, id: any) => {
|
||||
@@ -305,7 +310,6 @@
|
||||
siteDataTree.value = res.data.linkList;
|
||||
}
|
||||
});
|
||||
|
||||
//判断 是新增 还是修改
|
||||
if (value) {
|
||||
//获取详情接口
|
||||
@@ -316,9 +320,13 @@
|
||||
let selectDevice = ref([Number(infoObject.value.deviceType)]);
|
||||
findNodeById(deviceTypeTreeData.value, Number(infoObject.value.deviceType));
|
||||
//获取设备点位
|
||||
getDevicePoint({ id: infoObject.value.deviceName });
|
||||
getDevicePoint({ id: infoObject.value.deviceId });
|
||||
// 回显 选择设备类型
|
||||
findParentIds(deviceTypeTreeData.value, infoObject.value.deviceType, selectDevice.value);
|
||||
findParentIds(
|
||||
deviceTypeTreeData.value,
|
||||
Number(infoObject.value.deviceType),
|
||||
selectDevice.value,
|
||||
);
|
||||
//枚举 需要重新赋值
|
||||
if (
|
||||
infoObject.value.hxAlarmRuleLogicList &&
|
||||
@@ -344,7 +352,7 @@
|
||||
deviceType: [],
|
||||
devicePoint: null,
|
||||
valueType: null,
|
||||
deviceName: null,
|
||||
deviceId: null,
|
||||
enableRules: 0,
|
||||
alarmList: [{ logic: null, num: null, isDelete: 0 }],
|
||||
};
|
||||
@@ -357,7 +365,7 @@
|
||||
site: [{ required: true, message: '请选择站点', trigger: 'change' }],
|
||||
deviceType: [{ required: true, message: '请选择设备类型', trigger: 'change' }],
|
||||
enableRules: [{ required: true, message: '请选择启用规则', trigger: 'change' }],
|
||||
deviceName: [{ required: true, message: '请选择设备名称', trigger: 'change' }],
|
||||
deviceId: [{ required: true, message: '请选择设备名称', trigger: 'change' }],
|
||||
devicePoint: [{ required: true, message: '请选择设备点位', trigger: 'change' }],
|
||||
valueType: [{ required: true, message: '请选择取值类型', trigger: 'change' }],
|
||||
ruleType: [{ required: true, message: '请选择规则类型', trigger: 'change' }],
|
||||
|
@@ -8,18 +8,72 @@
|
||||
:cancel="handleClose"
|
||||
placement="right"
|
||||
@close="handleClose">
|
||||
<ns-form ref="formRef" :schemas="schemas" :model="infoObject" formLayout="vertical" />
|
||||
<div style="margin-left: 52px">
|
||||
应用规则:
|
||||
<a-switch
|
||||
:checked="infoObject?.enableRules === 1 ? true : false"
|
||||
:class="{
|
||||
'blue-background': infoObject?.enableRules === 1 ? true : false,
|
||||
'grey-background': infoObject?.enableRules === 1 ? false : true,
|
||||
}"
|
||||
style="margin-left: 6px"
|
||||
@change="changeSwitch" />
|
||||
</div>
|
||||
<a-form ref="formRef" :model="infoObject" :rules="rules">
|
||||
<a-form-item name="alarmTitle" label="告警标题">
|
||||
<ns-input allowClear v-model:value="infoObject.alarmTitle" placeholder="请输入告警标题" />
|
||||
</a-form-item>
|
||||
<a-form-item label="告警频率" name="alarmFrequency">
|
||||
<a-select
|
||||
v-model:value="infoObject.alarmFrequency"
|
||||
placeholder="请选择告警频率"
|
||||
style="width: 100%"
|
||||
allowClear
|
||||
:options="alarmFrequencyData" />
|
||||
</a-form-item>
|
||||
<a-form-item v-if="infoObject.alarmFrequency === 2" name="repetitions" label="重复次数">
|
||||
<ns-input-number v-model:value="infoObject.repetitions" placeholder="请输入重复次数" />
|
||||
</a-form-item>
|
||||
<a-form-item v-if="infoObject.alarmFrequency === 2" name="intervalDuration" label="间隔时长">
|
||||
<ns-input-number
|
||||
style="width: 60%"
|
||||
v-model:value="infoObject.intervalDuration"
|
||||
placeholder="请输入间隔时长" />
|
||||
<a-select
|
||||
v-model:value="infoObject.intervalDurationUnit"
|
||||
placeholder="请选择间隔时长单位"
|
||||
style="width: 40%"
|
||||
allowClear
|
||||
:options="intervalDurationUnitData" />
|
||||
</a-form-item>
|
||||
<a-form-item name="monitorTime" label="监测时长">
|
||||
<ns-input-number
|
||||
allowClear
|
||||
v-model:value="infoObject.monitorTime"
|
||||
placeholder="请输入监测时长" />
|
||||
</a-form-item>
|
||||
<a-form-item label="监测时长单位" name="monitorTimeUnit">
|
||||
<a-select
|
||||
v-model:value="infoObject.monitorTimeUnit"
|
||||
placeholder="请选择监测时长单位"
|
||||
style="width: 100%"
|
||||
allowClear
|
||||
:options="monitorTimeUnitData" />
|
||||
</a-form-item>
|
||||
<a-form-item label="优先级" name="priority">
|
||||
<a-select
|
||||
v-model:value="infoObject.priority"
|
||||
placeholder="请选择优先级"
|
||||
style="width: 100%"
|
||||
allowClear
|
||||
:options="priorityData" />
|
||||
</a-form-item>
|
||||
<a-form-item label="启用规则">
|
||||
<a-switch
|
||||
:checked="infoObject?.enableRules === 1 ? true : false"
|
||||
:class="{
|
||||
'blue-background': infoObject?.enableRules === 1 ? true : false,
|
||||
'grey-background': infoObject?.enableRules === 1 ? false : true,
|
||||
}"
|
||||
style="margin-left: 6px"
|
||||
@change="changeSwitch" />
|
||||
</a-form-item>
|
||||
<a-form-item label="是否创建工单" name="createWorkOrder">
|
||||
<a-radio-group v-model:value="infoObject.createWorkOrder">
|
||||
<a-radio value="1">是 </a-radio>
|
||||
<a-radio value="0">否 </a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</ns-drawer>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
@@ -32,11 +86,72 @@
|
||||
//表单数据
|
||||
const infoObject = ref({
|
||||
id: null,
|
||||
accountNo: null,
|
||||
alarmTitle: null,
|
||||
alarmFrequency: null,
|
||||
monitorTime: null,
|
||||
monitorTimeUnit: null,
|
||||
priority: null,
|
||||
createWorkOrder: null,
|
||||
enableRules: 0,
|
||||
});
|
||||
const formRef = ref();
|
||||
const emit = defineEmits(['editObject']);
|
||||
const alarmFrequencyData = ref([
|
||||
{
|
||||
label: '单次',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '重复',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: '累计',
|
||||
value: 3,
|
||||
},
|
||||
]);
|
||||
const monitorTimeUnitData = ref([
|
||||
{
|
||||
label: '分',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '时',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: '天',
|
||||
value: 3,
|
||||
},
|
||||
]);
|
||||
const intervalDurationUnitData = ref([
|
||||
{
|
||||
label: '分',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '时',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: '天',
|
||||
value: 3,
|
||||
},
|
||||
]);
|
||||
const priorityData = ref([
|
||||
{
|
||||
label: '紧急',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '重要',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: '一般',
|
||||
value: 3,
|
||||
},
|
||||
]);
|
||||
const toggle = (value: any) => {
|
||||
//判断 是新增 还是修改
|
||||
if (value) {
|
||||
@@ -50,155 +165,69 @@
|
||||
}
|
||||
visible.value = !visible.value;
|
||||
};
|
||||
const schemas = [
|
||||
{
|
||||
field: 'basicInfo',
|
||||
label: '',
|
||||
displayFormItem: false,
|
||||
class: 'ns-form-item-full',
|
||||
component: 'NsChildForm',
|
||||
componentProps: {
|
||||
schemas: [
|
||||
{
|
||||
field: 'alarmTitle',
|
||||
label: '告警标题',
|
||||
component: 'NsInput',
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '告警标题不能为空',
|
||||
trigger: 'change',
|
||||
validator: (rules: any, alarmTitle: any, cbfn: any) => {
|
||||
if (alarmTitle && alarmTitle.trim() !== '') {
|
||||
cbfn();
|
||||
} else {
|
||||
cbfn('告警标题不能为空');
|
||||
}
|
||||
},
|
||||
},
|
||||
],
|
||||
componentProps: {
|
||||
placeholder: '请输入告警标题',
|
||||
maxLength: 20,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'repetitions',
|
||||
label: '重复次数',
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '重复次数不能为空',
|
||||
trigger: 'change',
|
||||
},
|
||||
],
|
||||
component: 'NsSelect',
|
||||
componentProps: {
|
||||
allowClear: true,
|
||||
placeholder: '请选择重复次数',
|
||||
|
||||
options: [
|
||||
{
|
||||
label: '单次',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '重复',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: '累计',
|
||||
value: 3,
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'monitorTime',
|
||||
label: '检测时长',
|
||||
component: 'NsInputNumber',
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
validator: (rules: any, value: any, cbfn: any) => {
|
||||
if (value && /^[0-9]*$/.test(value)) {
|
||||
cbfn();
|
||||
} else {
|
||||
cbfn('请输入正确的监测时长');
|
||||
}
|
||||
},
|
||||
trigger: 'change',
|
||||
},
|
||||
],
|
||||
componentProps: {
|
||||
placeholder: '请输入监测时长',
|
||||
// maxLength: 30,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'monitorTimeUnit',
|
||||
label: '监测时长单位',
|
||||
component: 'NsSelect',
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '监测时长单位不能为空',
|
||||
trigger: 'change',
|
||||
},
|
||||
],
|
||||
componentProps: {
|
||||
allowClear: true,
|
||||
placeholder: '请选择监测时长单位',
|
||||
options: [
|
||||
{
|
||||
label: '分',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '时',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: '天',
|
||||
value: 3,
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'priority',
|
||||
label: '优先级',
|
||||
component: 'NsSelect',
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '优先级不能为空',
|
||||
trigger: 'change',
|
||||
},
|
||||
],
|
||||
componentProps: {
|
||||
allowClear: true,
|
||||
placeholder: '请选择优先级',
|
||||
options: [
|
||||
{
|
||||
label: '紧急',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '重要',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: '一般',
|
||||
value: 3,
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
],
|
||||
//表单 判断规格
|
||||
const rules = {
|
||||
alarmTitle: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入告警标题',
|
||||
trigger: 'change',
|
||||
validator: (rules: any, alarmTitle: any, cbfn: any) => {
|
||||
if (alarmTitle && alarmTitle.trim() !== '') {
|
||||
cbfn();
|
||||
} else {
|
||||
cbfn('告警标题不能为空');
|
||||
}
|
||||
},
|
||||
},
|
||||
},
|
||||
];
|
||||
],
|
||||
alarmFrequency: [{ required: true, message: '请选择告警频率', trigger: 'change' }],
|
||||
monitorTime: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入正确的监测时长',
|
||||
trigger: 'change',
|
||||
validator: (rules: any, monitorTime: any, cbfn: any) => {
|
||||
if (monitorTime && monitorTime > 0) {
|
||||
cbfn();
|
||||
} else {
|
||||
cbfn('请输入正确的监测时长');
|
||||
}
|
||||
},
|
||||
},
|
||||
],
|
||||
intervalDuration: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入正确的间隔时长',
|
||||
trigger: 'change',
|
||||
validator: (rules: any, monitorTime: any, cbfn: any) => {
|
||||
if (monitorTime && monitorTime > 0) {
|
||||
cbfn();
|
||||
} else {
|
||||
cbfn('请输入正确的间隔时长');
|
||||
}
|
||||
},
|
||||
},
|
||||
],
|
||||
repetitions: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入正确的重复次数',
|
||||
trigger: 'change',
|
||||
validator: (rules: any, repetitions: any, cbfn: any) => {
|
||||
if (repetitions && repetitions > 0) {
|
||||
cbfn();
|
||||
} else {
|
||||
cbfn('请输入正确的重复次数');
|
||||
}
|
||||
},
|
||||
},
|
||||
],
|
||||
createWorkOrder: [{ required: true, message: '请选择是否创建工单', trigger: 'change' }],
|
||||
priority: [{ required: true, message: '请选择优先级', trigger: 'change' }],
|
||||
monitorTimeUnit: [{ required: true, message: '请选择监测时长单位', trigger: 'change' }],
|
||||
};
|
||||
//开关
|
||||
const changeSwitch = () => {
|
||||
switch (infoObject.value.enableRules) {
|
||||
@@ -212,9 +241,16 @@
|
||||
};
|
||||
const btnClick = () => {
|
||||
//表单校验
|
||||
formRef.value.triggerSubmit().then(() => {
|
||||
formRef.value.validate().then(() => {
|
||||
//调用接口
|
||||
http.post(deviceAlarms.addOrUpNewData, infoObject.value).then(() => {
|
||||
let data = { ...infoObject.value };
|
||||
data.createWorkOrder = Number(data.createWorkOrder);
|
||||
if (data.alarmFrequency !== 2) {
|
||||
data.repetitions = null;
|
||||
data.intervalDuration = null;
|
||||
data.intervalDurationUnit = null;
|
||||
}
|
||||
http.post(deviceAlarms.addOrUpNewData, data).then(() => {
|
||||
if (infoObject.value.id) {
|
||||
NsMessage.success('告警编辑成功');
|
||||
} else {
|
||||
@@ -227,7 +263,7 @@
|
||||
};
|
||||
const handleClose = () => {
|
||||
// 清楚校验错误信息
|
||||
formRef.value.formElRef.clearValidate();
|
||||
formRef.value.resetFields();
|
||||
visible.value = false;
|
||||
};
|
||||
defineExpose({
|
||||
@@ -265,4 +301,9 @@
|
||||
.grey-background.ant-switch .ant-switch-handle {
|
||||
background-color: grey !important;
|
||||
}
|
||||
:deep(.ant-form-item-label) {
|
||||
z-index: 20;
|
||||
text-align: right;
|
||||
width: 23%;
|
||||
}
|
||||
</style>
|
||||
|
@@ -4,21 +4,27 @@
|
||||
<a-tab-pane key="1" tab="通知管理">
|
||||
<ns-view-list-table v-bind="notificationConfig" ref="mainRef">
|
||||
<template #bodyCell="{ record, column }">
|
||||
<template v-if="column.dataIndex === 'enableRules'">
|
||||
<template v-if="column.dataIndex === 'enableNotifications'">
|
||||
<a-switch
|
||||
:checked="record.enableRules === 1 ? true : false"
|
||||
:checked="record.enableNotifications === 1 ? true : false"
|
||||
:class="{
|
||||
'blue-background': record.enableRules === 1 ? true : false,
|
||||
'grey-background': record.enableRules === 1 ? false : true,
|
||||
'blue-background': record.enableNotifications === 1 ? true : false,
|
||||
'grey-background': record.enableNotifications === 1 ? false : true,
|
||||
}"
|
||||
@change="
|
||||
clickSwitch({ type: 1, enableRules: record.enableRules, record: record })
|
||||
" />
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'prioritys'">
|
||||
{{ record.priority ? record.priority.label : '' }}
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'notificationMethod'">
|
||||
{{ getNotificationMethod(record.notificationMethod) }}
|
||||
</template>
|
||||
</template>
|
||||
</ns-view-list-table>
|
||||
<!-- 联系方式 -->
|
||||
<notificationManagement ref="notificationManagements" @editObject="editObject" />
|
||||
<notificationManagement ref="notificationManagements" @updNotification="updNotification" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="设备告警" force-render>
|
||||
<ns-view-list-table
|
||||
@@ -42,14 +48,26 @@
|
||||
{{
|
||||
record.monitorTime && record.monitorTimeUnit
|
||||
? record.monitorTime + '' + record.monitorTimeUnit.label
|
||||
: '-'
|
||||
: ''
|
||||
}}
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'repetition'">
|
||||
{{ record.repetitions.label }}
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'prioritys'">
|
||||
{{ record.priority.label }}
|
||||
{{ record.priority ? record.priority.label : '' }}
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'alarmFrequency'">
|
||||
{{ record.alarmFrequency ? record.alarmFrequency.label : '' }}
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'repetitions'">
|
||||
{{
|
||||
record.repetitions && record.alarmFrequency.value === 2 ? record.repetitions : ''
|
||||
}}
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'interval'">
|
||||
{{
|
||||
record.intervalDuration && record.alarmFrequency.value === 2
|
||||
? record.intervalDuration + '' + record.intervalDurationUnit.label
|
||||
: ''
|
||||
}}
|
||||
</template>
|
||||
</template>
|
||||
</ns-view-list-table>
|
||||
@@ -83,14 +101,26 @@
|
||||
clickSwitch({ type: 3, enableRules: record.enableRules, record: record })
|
||||
" />
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'monitorFrequencys'">
|
||||
<template v-if="column.dataIndex === 'monitorFrequency'">
|
||||
{{ record.monitorFrequency.label }}
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'rep'">
|
||||
{{ record.repetitions.label }}
|
||||
<template v-if="column.dataIndex === 'alarmFrequency'">
|
||||
{{ record.alarmFrequency ? record.alarmFrequency.label : '' }}
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'prioritys'">
|
||||
{{ record.priority.label }}
|
||||
<template v-if="column.dataIndex === 'priority'">
|
||||
{{ record.priority ? record.priority.label : '' }}
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'repetitions'">
|
||||
{{
|
||||
record.repetitions && record.alarmFrequency.value === 2 ? record.repetitions : ''
|
||||
}}
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'interval'">
|
||||
{{
|
||||
record.intervalDuration && record.alarmFrequency.value === 2
|
||||
? record.intervalDuration + '' + record.intervalDurationUnit.label
|
||||
: ''
|
||||
}}
|
||||
</template>
|
||||
</template>
|
||||
</ns-view-list-table>
|
||||
@@ -124,6 +154,7 @@
|
||||
import { deviceAlarms } from '/@/api/alarmSettings/deviceAlarms';
|
||||
import { energyAlarms } from '/@/api/alarmSettings/energyAlarm';
|
||||
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||
import { notificationManagementApi } from '/@/api/alarmSettings/notificationManagements';
|
||||
|
||||
export default {
|
||||
name: 'AlarmSettingsIndex',
|
||||
@@ -146,6 +177,22 @@
|
||||
const equipmentAlarm = ref(true);
|
||||
const energyAlarm = ref(true);
|
||||
const notificationConfig = notificationtableConfig(notificationManagements);
|
||||
//获取 通知方式
|
||||
const getNotificationMethod = (data: any) => {
|
||||
if (!data) return '';
|
||||
const methods = [];
|
||||
const notifications = data.split(',');
|
||||
|
||||
notifications.forEach((notification) => {
|
||||
if (notification === '1') {
|
||||
methods.push('站内信息');
|
||||
} else if (notification === '2') {
|
||||
methods.push('邮件');
|
||||
}
|
||||
});
|
||||
|
||||
return methods.join('/');
|
||||
};
|
||||
//能源告警配置
|
||||
const energyAlarmConfig = energyAlarmConfigs(
|
||||
editeEnergyAlarm,
|
||||
@@ -169,6 +216,10 @@
|
||||
energyAlarm.value = !energyAlarm.value;
|
||||
configureEnergyAlarms.value.show = false;
|
||||
};
|
||||
//通知 修改成功
|
||||
const updNotification = () => {
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
};
|
||||
const clickSwitch = (data: any) => {
|
||||
NsModal.confirm({
|
||||
title: '启用状态',
|
||||
@@ -182,12 +233,14 @@
|
||||
if (data.type === 1) {
|
||||
//通知方式
|
||||
http
|
||||
.post(deviceAlarms.addOrUpNewData, {
|
||||
.post(notificationManagementApi.upData, {
|
||||
id: data.record.id,
|
||||
enableRules: data.record.enableRules === 1 ? 0 : 1,
|
||||
enableNotifications: data.record.enableNotifications === 1 ? 0 : 1,
|
||||
})
|
||||
.then(() => {
|
||||
NsMessage.success(data.record.enableRules === 1 ? '通知已关闭' : '通知已启用');
|
||||
NsMessage.success(
|
||||
data.record.enableNotifications === 1 ? '通知已关闭' : '通知已启用',
|
||||
);
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
});
|
||||
}
|
||||
@@ -232,6 +285,8 @@
|
||||
equipmentAlarmConfig,
|
||||
editObject,
|
||||
editeEnergyAlarm,
|
||||
updNotification,
|
||||
getNotificationMethod,
|
||||
clickSwitch,
|
||||
editEquipmentAlarm,
|
||||
notificationManagements,
|
||||
|
@@ -10,10 +10,10 @@
|
||||
@close="handleClose">
|
||||
<div style="width: 100%; overflow: hidden; overflow-y: hidden; height: 100%">
|
||||
<a-form ref="formRef" :model="infoObject" :rules="rules" style="width: 80%">
|
||||
<a-form-item ref="notification" label="通知方式" name="notification">
|
||||
<a-form-item ref="notificationMethod" label="通知方式" name="notificationMethod">
|
||||
<a-select
|
||||
ref="select"
|
||||
v-model:value="infoObject.notification"
|
||||
v-model:value="infoObject.notificationMethod"
|
||||
style="width: 100%"
|
||||
mode="multiple"
|
||||
:options="devicePointData"
|
||||
@@ -24,34 +24,18 @@
|
||||
</a-form-item>
|
||||
<a-form-item label="启用规则">
|
||||
<a-switch
|
||||
:checked="infoObject.enableRules === 1 ? true : false"
|
||||
:checked="infoObject.enableNotifications === 1 ? true : false"
|
||||
:class="{
|
||||
'blue-background': infoObject.enableRules === 1 ? true : false,
|
||||
'grey-background': infoObject.enableRules === 1 ? false : true,
|
||||
'blue-background': infoObject.enableNotifications === 1 ? true : false,
|
||||
'grey-background': infoObject.enableNotifications === 1 ? false : true,
|
||||
}"
|
||||
@click="clickSwitch" />
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
<div style="width: 100%; height: 765px; overflow-y: auto">
|
||||
<div style="margin-bottom: 8px">
|
||||
<div style="width: 100%; display: flex; position: relative">
|
||||
<div
|
||||
style="
|
||||
border-width: 0px;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
top: 5px;
|
||||
width: 5px;
|
||||
height: 15px;
|
||||
background: inherit;
|
||||
background-color: #2778ff;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
-moz-box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
"></div>
|
||||
<span style="margin-left: 24px; color: #333333">联系人名单</span>
|
||||
<div style="width: 100%; display: flex; position: relative" class="ns-title-extra-box">
|
||||
<span style="margin-left: 12px; color: #333333">联系人名单</span>
|
||||
</div>
|
||||
<img
|
||||
style="width: 100%; margin-top: -10px"
|
||||
@@ -67,10 +51,10 @@
|
||||
:pagination="pagination">
|
||||
<template #bodyCell="{ record, column }">
|
||||
<template v-if="column.dataIndex === 'address'">
|
||||
{{ record.userRoleInfos?.[0].deptRoleInfoList }}
|
||||
{{ record?.deptRoleInfoList || record.userRoleInfos?.[0].deptRoleInfoList }}
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'operation'">
|
||||
<a style="color: rgb(210, 0, 5)" @click="remove(record)">移除</a>
|
||||
<a style="color: #2778ff" @click="remove(record)">移除</a>
|
||||
</template>
|
||||
</template>
|
||||
</a-table>
|
||||
@@ -85,12 +69,11 @@
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
// import { NsMessage } from '/nerv-lib/component';
|
||||
// import { http } from '/nerv-lib/util';
|
||||
// import { number } from 'vue-types';
|
||||
import { NsMessage } from '/nerv-lib/component';
|
||||
import { http } from '/nerv-lib/util';
|
||||
import linkPeople from './linkPeople/index.vue';
|
||||
|
||||
// import { deviceAlarms } from '/@/api/alarmSettings/deviceAlarms';
|
||||
import { notificationManagementApi } from '/@/api/alarmSettings/notificationManagements';
|
||||
import { async } from '@antv/x6/lib/registry/marker/async';
|
||||
|
||||
//table 数据
|
||||
const columns = [
|
||||
@@ -125,6 +108,8 @@
|
||||
title: '部门',
|
||||
dataIndex: 'address',
|
||||
key: 'address',
|
||||
width: 200,
|
||||
textEllipsis: true,
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
@@ -160,7 +145,7 @@
|
||||
dataSource.value.forEach((item) => {
|
||||
ids.push(item.userId);
|
||||
});
|
||||
linkPeoples.value.getData({ id: ids, data: dataSource });
|
||||
linkPeoples.value.getData({ id: ids, data: dataSource.value });
|
||||
};
|
||||
//取消弹窗
|
||||
const handleCancel = () => {
|
||||
@@ -173,7 +158,7 @@
|
||||
};
|
||||
//表单数据
|
||||
const infoObject = ref({
|
||||
enableRules: 0,
|
||||
enableNotifications: 0,
|
||||
});
|
||||
//设备点位搜索
|
||||
const filterDevicePoint = (input: string, option: any) => {
|
||||
@@ -181,45 +166,47 @@
|
||||
};
|
||||
//开关
|
||||
const clickSwitch = () => {
|
||||
if (infoObject.value.enableRules === 1) {
|
||||
infoObject.value.enableRules = 0;
|
||||
if (infoObject.value.enableNotifications === 1) {
|
||||
infoObject.value.enableNotifications = 0;
|
||||
} else {
|
||||
infoObject.value.enableRules = 1;
|
||||
infoObject.value.enableNotifications = 1;
|
||||
}
|
||||
};
|
||||
// 通知信息
|
||||
const devicePointData = ref([
|
||||
{ label: '站内信息', value: 1 },
|
||||
{ label: '邮件', value: 2 },
|
||||
{ label: '站内信息', value: '1' },
|
||||
{ label: '邮件', value: '2' },
|
||||
]);
|
||||
|
||||
const rules = {
|
||||
notification: [{ required: true, message: '请选择通知方式', trigger: 'change' }],
|
||||
notificationMethod: [{ required: true, message: '请选择通知方式', trigger: 'change' }],
|
||||
user: [{ required: true, message: '请选择通知人', trigger: 'change' }],
|
||||
};
|
||||
const formRef = ref();
|
||||
const emit = defineEmits(['editObject']);
|
||||
const toggle = (value: any) => {
|
||||
const emit = defineEmits(['updNotification']);
|
||||
const toggle = async (value: any) => {
|
||||
//判断 是新增 还是修改
|
||||
if (value) {
|
||||
// 获取接口
|
||||
infoObject.value = {
|
||||
enableRules: 0,
|
||||
};
|
||||
// await http
|
||||
// .post(group.queryDeviceGroupTree, {
|
||||
// pageNum: 1,
|
||||
// pageSize: 999,
|
||||
// energyType: selectedOptions[0].dicKey,
|
||||
// orgId: orgId.value,
|
||||
// })
|
||||
// .then((res) => {
|
||||
// jdTreeData.value = res.data;
|
||||
// });
|
||||
// // 获取接口
|
||||
await http
|
||||
.post(notificationManagementApi.findById, {
|
||||
id: value.id,
|
||||
})
|
||||
.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 {
|
||||
infoObject.value = {
|
||||
enableRules: 0,
|
||||
enableNotifications: 0,
|
||||
notificationMethod: [],
|
||||
};
|
||||
dataSource.value = [];
|
||||
}
|
||||
visible.value = !visible.value;
|
||||
};
|
||||
@@ -233,24 +220,36 @@
|
||||
dataSource.value = [...dataSource.value];
|
||||
};
|
||||
const btnClick = () => {
|
||||
console.log(infoObject.value);
|
||||
//发送请求数据
|
||||
let obj = {};
|
||||
obj.selectList = [];
|
||||
dataSource.value.forEach((item) => {
|
||||
obj.selectList.push({
|
||||
userId: item.userId,
|
||||
});
|
||||
});
|
||||
console.log(obj, '数据');
|
||||
if (dataSource.value.length === 0) {
|
||||
NsMessage.warn('请选择联系人');
|
||||
return;
|
||||
}
|
||||
//表单校验
|
||||
formRef.value.validate().then(() => {
|
||||
//发送请求数据
|
||||
let obj = {
|
||||
id: null,
|
||||
notificationMethod: null,
|
||||
hxAlarmNotifyUserList: [],
|
||||
enableNotifications: 0,
|
||||
};
|
||||
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,
|
||||
contactInformationId: infoObject.value.id,
|
||||
});
|
||||
});
|
||||
//调用接口
|
||||
// http.post(deviceAlarms.addOrUpNewData, infoObject.value).then(() => {
|
||||
// NsMessage.success('操作成功');
|
||||
// visible.value = false;
|
||||
// emit('editObject', null);
|
||||
// });
|
||||
http.post(notificationManagementApi.upData, obj).then((res) => {
|
||||
if (res.msg === 'success') {
|
||||
NsMessage.success('操作成功');
|
||||
visible.value = false;
|
||||
emit('updNotification', null);
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
const handleClose = () => {
|
||||
|
@@ -1,22 +0,0 @@
|
||||
import { department } from '/@/api/origanizemanage';
|
||||
|
||||
export const editTreeConfig = (orgId) => ({
|
||||
selectedKeys: ['0-0'],
|
||||
defaultExpandAll: true,
|
||||
api: department.queryDeptTree,
|
||||
params: { orgId },
|
||||
resultField: 'data.orgInfos',
|
||||
fieldNames: { title: 'orgName', key: 'orgId' },
|
||||
formConfig: {
|
||||
schemas: [
|
||||
{
|
||||
field: 'orgName',
|
||||
component: 'NsInput',
|
||||
autoSubmit: true,
|
||||
componentProps: {
|
||||
placeholder: '请输入企业名称',
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
});
|
@@ -1,16 +1,15 @@
|
||||
<template>
|
||||
<a-modal
|
||||
<ns-modal
|
||||
v-model:visible="show"
|
||||
width="1100px"
|
||||
style="top: 50%; transform: translateY(-50%); overflow-y: hidden"
|
||||
style="overflow-y: hidden"
|
||||
title="添加联系人"
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel">
|
||||
<div class="box">
|
||||
<div class="box-left">
|
||||
<div style="width: 100%; display: flex; position: relative">
|
||||
<div class="border-card"></div>
|
||||
<span style="margin-left: 24px; color: #333333">联系人名单</span>
|
||||
<div style="width: 100%; display: flex; position: relative" class="ns-title-extra-box">
|
||||
<span style="margin-left: 12px; color: #333333">联系人名单</span>
|
||||
</div>
|
||||
<img
|
||||
style="width: 100%; height: 2px"
|
||||
@@ -31,9 +30,8 @@
|
||||
/></div>
|
||||
</div>
|
||||
<div class="box-right">
|
||||
<div style="width: 100%; display: flex; position: relative">
|
||||
<div class="border-card"></div>
|
||||
<span style="margin-left: 24px; color: #333333">人员列表 </span>
|
||||
<div style="width: 100%; display: flex; position: relative" class="ns-title-extra-box">
|
||||
<span style="margin-left: 12px; color: #333333">人员列表 </span>
|
||||
<a-input-search
|
||||
v-model:value="realName"
|
||||
style="margin-bottom: 8px; width: 280px; position: absolute; right: 20px"
|
||||
@@ -67,7 +65,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a-modal>
|
||||
</ns-modal>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
@@ -191,6 +189,7 @@
|
||||
orgId: selectOrgId.value,
|
||||
deptId: selectDeptId.value,
|
||||
realName: realName.value,
|
||||
userStatus: 0,
|
||||
})
|
||||
.then((res) => {
|
||||
dataSource.value = res.data.records;
|
||||
@@ -206,7 +205,25 @@
|
||||
|
||||
const onSelectChange = (selectedRowKeys: any, selectedRows: any) => {
|
||||
selectedRowKey.value = selectedRowKeys;
|
||||
selectedRow.value = selectedRows;
|
||||
// 使用 forEach 循环遍历 selectedRows 数组
|
||||
let newSelectRows = [];
|
||||
selectedRows.forEach((item, index) => {
|
||||
if (item) {
|
||||
newSelectRows.push(item);
|
||||
}
|
||||
});
|
||||
// 添加新选中的行的 userId 到 selectedRow.value
|
||||
selectedRow.value = [
|
||||
...selectedRow.value,
|
||||
...newSelectRows.filter(
|
||||
(newRow: any) =>
|
||||
!selectedRow.value.some((existingRow) => existingRow.userId === newRow.userId),
|
||||
),
|
||||
];
|
||||
// 移除取消选中的行的 userId
|
||||
selectedRow.value = selectedRow.value.filter((existingRow: any) =>
|
||||
selectedRowKeys.includes(existingRow.userId),
|
||||
);
|
||||
};
|
||||
const pagination = ref({
|
||||
total: 0,
|
||||
@@ -252,6 +269,8 @@
|
||||
pagination.value.current = 1;
|
||||
realName.value = null;
|
||||
searchValue.value = '';
|
||||
selectDeptId.value = '';
|
||||
selectOrgId.value = orgId.value;
|
||||
};
|
||||
const getData = (data: any) => {
|
||||
selectedRow.value = data.data;
|
||||
@@ -265,16 +284,18 @@
|
||||
const show = ref(false);
|
||||
const handleCancel = () => {
|
||||
// 处理取消按钮的逻辑
|
||||
pagination.value.current = 1;
|
||||
realName.value = null;
|
||||
emit('handleCancel', null);
|
||||
show.value = false;
|
||||
pagination.value.current = 1;
|
||||
realName.value = null;
|
||||
searchValue.value = '';
|
||||
selectDeptId.value = '';
|
||||
selectOrgId.value = orgId.value;
|
||||
};
|
||||
watch(searchValue, (value) => {
|
||||
const expanded = dataList
|
||||
.map((item: TreeProps['treeData'][number]) => {
|
||||
if (item.title.indexOf(value) > -1) {
|
||||
console.log(item.title.indexOf(value));
|
||||
return getParentKey(item.key, deptTreeData.value);
|
||||
}
|
||||
return null;
|
||||
@@ -317,21 +338,6 @@
|
||||
});
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
.border-card {
|
||||
border-width: 0px;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
top: 5px;
|
||||
width: 5px;
|
||||
height: 15px;
|
||||
background: inherit;
|
||||
background-color: @primary-color;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
-moz-box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
.box {
|
||||
width: 100%;
|
||||
height: 500px;
|
||||
|
@@ -12,7 +12,7 @@ const tableKeyMap = [
|
||||
},
|
||||
{
|
||||
title: '优先级',
|
||||
dataIndex: 'prioritys',
|
||||
dataIndex: 'priority',
|
||||
},
|
||||
{
|
||||
title: '告警标题',
|
||||
@@ -22,13 +22,21 @@ const tableKeyMap = [
|
||||
title: '错误码',
|
||||
dataIndex: 'errorCode',
|
||||
},
|
||||
{
|
||||
title: '告警频率',
|
||||
dataIndex: 'alarmFrequency',
|
||||
},
|
||||
{
|
||||
title: '重复次数',
|
||||
dataIndex: 'rep',
|
||||
dataIndex: 'repetitions',
|
||||
},
|
||||
{
|
||||
title: '频率间隔',
|
||||
dataIndex: 'interval',
|
||||
},
|
||||
{
|
||||
title: '监测时长',
|
||||
dataIndex: 'monitorFrequencys',
|
||||
dataIndex: 'monitorFrequency',
|
||||
},
|
||||
{
|
||||
title: '是否启用',
|
||||
@@ -98,10 +106,26 @@ export const energyAlarmConfigs = (
|
||||
name: 'energyAlarmEdit',
|
||||
dynamicParams: ['uuid', 'appealType'],
|
||||
handle: (data: any) => {
|
||||
data.monitorFrequency = data.monitorFrequency.value;
|
||||
data.priority = data.priority.value;
|
||||
data.repetitions = data.repetitions.value;
|
||||
editeEnergyAlarm.value.toggle(data);
|
||||
const obj = { ...data };
|
||||
obj.priority = data.priority.value;
|
||||
if (obj.alarmFrequency) {
|
||||
obj.alarmFrequency = data.alarmFrequency.value;
|
||||
}
|
||||
if (obj.intervalDurationUnit) {
|
||||
obj.intervalDurationUnit = data.intervalDurationUnit.value;
|
||||
}
|
||||
if (obj.monitorFrequency) {
|
||||
obj.monitorFrequency = data.monitorFrequency.value;
|
||||
}
|
||||
if (obj.createWorkOrder) {
|
||||
obj.createWorkOrder = data.createWorkOrder + '';
|
||||
}
|
||||
if (obj.alarmFrequency !== 2) {
|
||||
obj.repetitions = null;
|
||||
obj.intervalDuration = null;
|
||||
obj.intervalDurationUnit = null;
|
||||
}
|
||||
editeEnergyAlarm.value.toggle(obj);
|
||||
},
|
||||
},
|
||||
{
|
||||
|
@@ -1,9 +1,7 @@
|
||||
import data from '../notificationManagementMock.json';
|
||||
import { http } from '/nerv-lib/util';
|
||||
import { NsMessage } from '/nerv-lib/component';
|
||||
import { deviceAlarms } from '/@/api/alarmSettings/deviceAlarms';
|
||||
|
||||
import { ref } from 'vue';
|
||||
const tableKeyMap = [
|
||||
{
|
||||
title: '序号',
|
||||
@@ -24,9 +22,17 @@ const tableKeyMap = [
|
||||
title: '错误码',
|
||||
dataIndex: 'errorCode',
|
||||
},
|
||||
{
|
||||
title: '告警频率',
|
||||
dataIndex: 'alarmFrequency',
|
||||
},
|
||||
{
|
||||
title: '重复次数',
|
||||
dataIndex: 'repetition',
|
||||
dataIndex: 'repetitions',
|
||||
},
|
||||
{
|
||||
title: '频率间隔',
|
||||
dataIndex: 'interval',
|
||||
},
|
||||
{
|
||||
title: '监测时长',
|
||||
@@ -37,7 +43,6 @@ const tableKeyMap = [
|
||||
dataIndex: 'enableRules',
|
||||
},
|
||||
];
|
||||
const mockData = ref(data.listData);
|
||||
const doWnload = (url: any) => {
|
||||
const a = document.createElement('a');
|
||||
document.body.appendChild(a);
|
||||
@@ -57,7 +62,6 @@ export const equipmentAlarmTableConfig = (
|
||||
return {
|
||||
title: '告警规则',
|
||||
api: deviceAlarms.getTableList,
|
||||
value: mockData.value,
|
||||
headerActions: [
|
||||
{
|
||||
label: '新增',
|
||||
@@ -103,10 +107,24 @@ export const equipmentAlarmTableConfig = (
|
||||
name: 'equipmentAlarmEdit',
|
||||
dynamicParams: ['uuid', 'appealType'],
|
||||
handle: (data: any) => {
|
||||
data.priority = data.priority.value;
|
||||
data.repetitions = data.repetitions.value;
|
||||
data.monitorTimeUnit = data.monitorTimeUnit.value;
|
||||
editEquipmentAlarm.value.toggle(data);
|
||||
const obj = { ...data };
|
||||
obj.priority = data.priority.value;
|
||||
if (obj.alarmFrequency) {
|
||||
obj.alarmFrequency = data.alarmFrequency.value;
|
||||
}
|
||||
if (obj.intervalDurationUnit) {
|
||||
obj.intervalDurationUnit = data.intervalDurationUnit.value;
|
||||
}
|
||||
if (obj.createWorkOrder) {
|
||||
obj.createWorkOrder = data.createWorkOrder + '';
|
||||
}
|
||||
if (obj.alarmFrequency !== 2) {
|
||||
obj.repetitions = null;
|
||||
obj.intervalDuration = null;
|
||||
obj.intervalDurationUnit = null;
|
||||
}
|
||||
obj.monitorTimeUnit = data.monitorTimeUnit.value;
|
||||
editEquipmentAlarm.value.toggle(obj);
|
||||
},
|
||||
},
|
||||
{
|
||||
|
@@ -1,7 +1,8 @@
|
||||
import { dateUtil } from '/nerv-lib/util/date-util';
|
||||
import data from '../notificationManagementMock.json';
|
||||
import { http } from '/nerv-lib/util';
|
||||
import { notificationManagementApi } from '/@/api/alarmSettings/notificationManagements';
|
||||
import { ref } from 'vue';
|
||||
|
||||
const tableKeyMap = [
|
||||
{
|
||||
title: '序号',
|
||||
@@ -12,43 +13,41 @@ const tableKeyMap = [
|
||||
},
|
||||
{
|
||||
title: '优先级',
|
||||
dataIndex: 'id',
|
||||
dataIndex: 'prioritys',
|
||||
},
|
||||
{
|
||||
title: '告警类型',
|
||||
dataIndex: 'deviceCode',
|
||||
dataIndex: 'alarmTypeName',
|
||||
},
|
||||
{
|
||||
title: '告警标题',
|
||||
dataIndex: 'deviceName',
|
||||
dataIndex: 'alarmTitle',
|
||||
},
|
||||
{
|
||||
title: '错误码',
|
||||
dataIndex: 'position',
|
||||
dataIndex: 'errorCode',
|
||||
},
|
||||
{
|
||||
title: '通知名单',
|
||||
dataIndex: 'position',
|
||||
dataIndex: 'notificationList',
|
||||
width: 150,
|
||||
textEllipsis: true,
|
||||
},
|
||||
{
|
||||
title: '通知方式',
|
||||
dataIndex: 'position',
|
||||
dataIndex: 'notificationMethod',
|
||||
},
|
||||
{
|
||||
title: '启用通知',
|
||||
dataIndex: 'enableRules',
|
||||
dataIndex: 'enableNotifications',
|
||||
},
|
||||
];
|
||||
const mockData = ref(data.listData);
|
||||
export const notificationtableConfig = (notificationManagements: any) => {
|
||||
return {
|
||||
title: '告警规则',
|
||||
// api: '/carbon_emission/device/getDeviceList',
|
||||
value: mockData.value,
|
||||
headerActions: [{}],
|
||||
api: notificationManagementApi.getTableList,
|
||||
headerActions: [],
|
||||
columns: tableKeyMap,
|
||||
// rowSelection: null, 选择按钮
|
||||
columnActions: {
|
||||
title: '操作',
|
||||
actions: [
|
||||
@@ -66,70 +65,75 @@ export const notificationtableConfig = (notificationManagements: any) => {
|
||||
formConfig: {
|
||||
schemas: [
|
||||
{
|
||||
field: 'name',
|
||||
field: 'alarmType',
|
||||
label: '告警类型',
|
||||
component: 'NsSelect',
|
||||
componentProps: {
|
||||
placeholder: '请选告警类型',
|
||||
allowClear: true,
|
||||
options: [
|
||||
{
|
||||
label: '设备告警',
|
||||
value: '1',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '网关告警',
|
||||
value: '2',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: '能耗告警',
|
||||
value: '3',
|
||||
value: 3,
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'provider',
|
||||
field: 'priority',
|
||||
label: '告警优先级',
|
||||
component: 'NsSelect',
|
||||
componentProps: {
|
||||
placeholder: '请选择告警优先级',
|
||||
allowClear: true,
|
||||
options: [
|
||||
{
|
||||
label: '紧急',
|
||||
value: '1',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '重要',
|
||||
value: '1',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: '一般',
|
||||
value: '2',
|
||||
value: 3,
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'provider',
|
||||
field: 'alarmTitle',
|
||||
label: '告警标题',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
allowClear: true,
|
||||
placeholder: '请输入告警标题关键字',
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'provider',
|
||||
field: 'errorCode',
|
||||
label: '错误码',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
allowClear: true,
|
||||
placeholder: '请输入告警错误码',
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'payWay',
|
||||
field: 'enableNotifications',
|
||||
label: '启用状态',
|
||||
component: 'NsSelect',
|
||||
componentProps: {
|
||||
allowClear: true,
|
||||
placeholder: '请选择启用状态',
|
||||
options: [
|
||||
{
|
||||
|
@@ -10,21 +10,13 @@
|
||||
@close="handleClose">
|
||||
<div style="width: 100%; height: 100%; overflow-y: auto; overflow-x: hidden">
|
||||
<!-- top -->
|
||||
<div
|
||||
style="
|
||||
width: 100%;
|
||||
height: 35px;
|
||||
display: flex;
|
||||
position: relative;
|
||||
font-size: 16px;
|
||||
border-bottom: 1px solid rgb(255, 118, 2); /* 设置底部边框为1像素实线,并指定颜色 */
|
||||
">
|
||||
<div class="box">
|
||||
<div class="card"></div>
|
||||
<div style="left: 25px; position: absolute; height: 35px; line-height: 35px">
|
||||
告警编号:20230310001
|
||||
</div>
|
||||
<div style="right: 20px; position: absolute; height: 35px; line-height: 35px">
|
||||
15点08分
|
||||
2024-03-10 15:08:10
|
||||
</div>
|
||||
</div>
|
||||
<!-- center -->
|
||||
@@ -38,7 +30,7 @@
|
||||
<a-descriptions-item label="状态">新告警</a-descriptions-item>
|
||||
<a-descriptions-item label="错误码">C003</a-descriptions-item>
|
||||
<a-descriptions-item label="告警描述"
|
||||
><div style="color: #ff7602">用电量超标</div> 当日用电量超出预设值</a-descriptions-item
|
||||
><div style="color: #2778ff">用电量超标</div> 当日用电量超出预设值</a-descriptions-item
|
||||
>
|
||||
<a-descriptions-item label="设备信息"> 1栋10层低压柜 </a-descriptions-item>
|
||||
<a-descriptions-item label="重复次数"> 0 </a-descriptions-item>
|
||||
@@ -201,7 +193,7 @@
|
||||
itemStyle: {
|
||||
normal: {
|
||||
barBorderRadius: 0,
|
||||
color: '#6395F9',
|
||||
color: '#2778FF',
|
||||
},
|
||||
},
|
||||
symbol: 'circle', // 数据点的形状,这里设置为圆形
|
||||
@@ -227,13 +219,21 @@
|
||||
});
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
.box {
|
||||
width: 100%;
|
||||
height: 35px;
|
||||
display: flex;
|
||||
position: relative;
|
||||
font-size: @font-size-base;
|
||||
border-bottom: 1px solid @primary-color;
|
||||
}
|
||||
.card {
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
top: 0px;
|
||||
width: 5px;
|
||||
height: 35px;
|
||||
background-color: rgb(254, 118, 2);
|
||||
background-color: @primary-color;
|
||||
}
|
||||
:deep(.ant-descriptions-item-label) {
|
||||
width: 25%;
|
||||
|
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<ns-drawer
|
||||
v-model:visible="visible"
|
||||
width="520"
|
||||
width="550"
|
||||
:title="' '"
|
||||
:footer-style="{ textAlign: 'right' }"
|
||||
:ok="btnClick"
|
||||
@@ -9,53 +9,41 @@
|
||||
placement="right"
|
||||
@close="handleClose">
|
||||
<a-tabs>
|
||||
<a-tab-pane key="1" tab="更新状态">Content of Tab Pane 1</a-tab-pane>
|
||||
<a-tab-pane key="1" tab="更新状态">
|
||||
<div style="width: 100%; padding: 24px">
|
||||
<a-form ref="formRef" :model="infoObject" :rules="rules">
|
||||
<a-form-item ref="status" label="当前状态" name="status">
|
||||
<a-select
|
||||
v-model:value="infoObject.status"
|
||||
show-search
|
||||
placeholder="请选择设备点位"
|
||||
style="width: 85%"
|
||||
:options="statusOptions"
|
||||
:disabled="showEdit"
|
||||
:filter-option="filterDevicePoint" />
|
||||
<ns-icon
|
||||
size="20"
|
||||
@click="() => (showEdit = !showEdit)"
|
||||
style="margin-left: 20px"
|
||||
:name="showEdit ? 'bianji' : 'baocun'" />
|
||||
</a-form-item>
|
||||
<a-form-item label="备注" name="desc">
|
||||
<a-textarea
|
||||
v-model:value="infoObject.desc"
|
||||
placeholder="请输入异常描述"
|
||||
:disabled="showEdit"
|
||||
style="width: 85%"
|
||||
:autoSize="{ minRows: 4, maxRows: 4 }" />
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</div>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="状态流程">
|
||||
<!-- <a-steps direction="vertical" :current="4">
|
||||
<template v-for="index in 4">
|
||||
<a-step>
|
||||
<template #icon>
|
||||
<img src="../../../../src/icon/status-off.svg" />
|
||||
</template>
|
||||
<template #description>
|
||||
<div
|
||||
style="
|
||||
width: 400px;
|
||||
min-height: 40px;
|
||||
background-color: #f8fafc;
|
||||
margin-left: 20px;
|
||||
border-radius: 4px; /* 设置圆角半径 */
|
||||
padding: 12px;
|
||||
">
|
||||
<div style="width: 100%; height: 40px; display: flex; position: relative">
|
||||
<a-tag style="width: 60px; height: 20px; text-align: center" color="#04d919"
|
||||
>已完成</a-tag
|
||||
>
|
||||
<div
|
||||
style="
|
||||
position: absolute;
|
||||
left: 30%;
|
||||
top: -2px;
|
||||
transform: translateX(-50%);
|
||||
color: #3a3a3a;
|
||||
"
|
||||
>李四</div
|
||||
>
|
||||
<div style="position: absolute; right: 10px; top: -2px; color: #ff7602"
|
||||
>2024-03-11 11:30:06</div
|
||||
>
|
||||
</div>
|
||||
<div style="width: 100%; color: #3a3a3a"> 工单已完成并通过验收 </div>
|
||||
</div>
|
||||
</template>
|
||||
</a-step>
|
||||
</template>
|
||||
</a-steps> -->
|
||||
<NsSteps v-bind="config" />
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
<template #footer>
|
||||
<a-button style="margin-right: 8px" type="primary" @click="createOrder">创建工单</a-button>
|
||||
<!-- <a-button style="margin-right: 8px" type="primary" @click="createOrder">创建工单</a-button> -->
|
||||
<a-button type="primary" @click="btnClick">确定</a-button>
|
||||
</template>
|
||||
</ns-drawer>
|
||||
@@ -72,12 +60,21 @@
|
||||
|
||||
setup() {
|
||||
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 logList = ref([
|
||||
{ name: '李四', status: '2' },
|
||||
{ name: '王五', status: '4' },
|
||||
{ name: '王五', status: '3' },
|
||||
{ name: '王五', status: '1' },
|
||||
{ name: '赵六', status: '0' },
|
||||
{ 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' },
|
||||
]);
|
||||
const config = ref({
|
||||
size: logList.value.length,
|
||||
@@ -90,7 +87,26 @@
|
||||
console.log('btnClick');
|
||||
};
|
||||
const toggle = (data) => {
|
||||
console.log(data, 'data');
|
||||
infoObject.value = { ...logList.value[0] };
|
||||
let statusMap = {
|
||||
0: '待处理',
|
||||
1: '处理中',
|
||||
2: '已完成',
|
||||
3: '超时',
|
||||
4: '已关闭',
|
||||
};
|
||||
let colorMap = {
|
||||
0: '#ff7602',
|
||||
1: '#00a1e6',
|
||||
2: '#04d919',
|
||||
3: '#d9001b',
|
||||
4: '#a6a6a6',
|
||||
};
|
||||
logList.value.forEach((item) => {
|
||||
item.statusName = statusMap[item.status];
|
||||
item.color = colorMap[item.status];
|
||||
item.src = 'status-' + item.status;
|
||||
});
|
||||
visible.value = true;
|
||||
};
|
||||
const createOrder = () => {
|
||||
@@ -120,6 +136,9 @@
|
||||
});
|
||||
};
|
||||
return {
|
||||
infoObject,
|
||||
showEdit,
|
||||
statusOptions,
|
||||
btnClick,
|
||||
createOrder,
|
||||
visible,
|
||||
@@ -131,4 +150,10 @@
|
||||
},
|
||||
});
|
||||
</script>
|
||||
<style scoped lang="less"></style>
|
||||
<style scoped lang="less">
|
||||
:deep(.ant-form-item-label) {
|
||||
z-index: 20;
|
||||
text-align: right;
|
||||
width: 17%;
|
||||
}
|
||||
</style>
|
||||
|
@@ -145,7 +145,7 @@ export const notificationtableConfig = (look: any, status: any) => {
|
||||
fieldMap: ['manufactureBeginDate', 'manufactureEndDate'],
|
||||
componentProps: {
|
||||
valueFormat: 'YYYY-MM-DD',
|
||||
placeholder: ['设备生产开始日期', '设备生产结束日期'],
|
||||
placeholder: ['开始日期', '结束日期'],
|
||||
},
|
||||
},
|
||||
],
|
||||
|
@@ -0,0 +1,29 @@
|
||||
<template>
|
||||
<ns-view-list-table v-bind="config" ref="mainRef" />
|
||||
<!-- 详情页面 -->
|
||||
<Look ref="look" />
|
||||
<!-- 状态页面 -->
|
||||
<Status ref="status" />
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { notificationtableConfig } from './ts/config';
|
||||
import Look from './look.vue';
|
||||
import Status from './status.vue';
|
||||
import { ref } from 'vue';
|
||||
|
||||
export default {
|
||||
name: 'EquipmentAlarmIndex',
|
||||
components: { Look, Status },
|
||||
|
||||
setup() {
|
||||
const look = ref(null);
|
||||
const status = ref(null);
|
||||
const config = notificationtableConfig(look, status);
|
||||
return {
|
||||
config,
|
||||
look,
|
||||
status,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
234
hx-ai-intelligent/src/view/alarmManagement/gatewayAlarm/look.vue
Normal file
234
hx-ai-intelligent/src/view/alarmManagement/gatewayAlarm/look.vue
Normal file
@@ -0,0 +1,234 @@
|
||||
<template>
|
||||
<ns-drawer
|
||||
v-model:visible="visible"
|
||||
width="520"
|
||||
:title="' '"
|
||||
:footer-style="{ textAlign: 'right' }"
|
||||
:ok="btnClick"
|
||||
:cancel="handleClose"
|
||||
placement="right"
|
||||
@close="handleClose">
|
||||
<div style="width: 100%; height: 100%; overflow-y: auto; overflow-x: hidden">
|
||||
<!-- top -->
|
||||
<div class="box">
|
||||
<div class="card"></div>
|
||||
<div style="left: 25px; position: absolute; height: 35px; line-height: 35px">
|
||||
告警编号:20230310001
|
||||
</div>
|
||||
<div style="right: 20px; position: absolute; height: 35px; line-height: 35px">
|
||||
2024-03-10 15:08:10
|
||||
</div>
|
||||
</div>
|
||||
<!-- center -->
|
||||
<div style="width: 100%; height: 400px">
|
||||
<div style="width: 100%; height: 100%" ref="graphChart"></div>
|
||||
</div>
|
||||
<!-- 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="告警描述">网关心跳包丢失</a-descriptions-item>
|
||||
<a-descriptions-item label="设备信息">1号网关_Di23j596_0001 </a-descriptions-item>
|
||||
<a-descriptions-item label="重复次数"> 0 </a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</div>
|
||||
</div>
|
||||
<template #footer>
|
||||
<a-button type="primary" @click="handleClose">确定</a-button>
|
||||
</template>
|
||||
</ns-drawer>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
defineOptions({
|
||||
name: 'look', // 与页面路由name一致缓存才可生效
|
||||
});
|
||||
import { ref } from 'vue';
|
||||
import * as echarts from 'echarts';
|
||||
|
||||
let chartInstance: echarts.ECharts | null = null;
|
||||
const graphChart = ref(null);
|
||||
const visible = ref(false);
|
||||
const handleClose = () => {
|
||||
visible.value = false;
|
||||
};
|
||||
const btnClick = () => {
|
||||
console.log('btnClick');
|
||||
handleClose();
|
||||
};
|
||||
const toggle = (data: any) => {
|
||||
console.log(data, 'data');
|
||||
visible.value = true;
|
||||
setTimeout(() => {
|
||||
getChatr();
|
||||
}, 500);
|
||||
};
|
||||
const getChatr = () => {
|
||||
let dayData = [];
|
||||
let energyAlarm = [];
|
||||
|
||||
// Extend data for 30 days
|
||||
for (let i = 1; i < 9; i++) {
|
||||
dayData.push('10:' + i * 9 + ':00');
|
||||
energyAlarm.push(Math.floor(Math.random() * 2));
|
||||
}
|
||||
if (chartInstance) {
|
||||
chartInstance.dispose();
|
||||
}
|
||||
chartInstance = echarts.init(graphChart.value);
|
||||
const option = {
|
||||
// title: {
|
||||
// text: '告警趋势/ 近30天',
|
||||
// textStyle: {
|
||||
// fontSize: 16,
|
||||
// fontWeight: 'normal',
|
||||
// color: '#aaaaaa',
|
||||
// },
|
||||
// left: '1%',
|
||||
// top: '2%',
|
||||
// },
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'shadow',
|
||||
},
|
||||
formatter: function (params: any) {
|
||||
let res = params[0].marker + ' ' + params[0].seriesName + ' : ' + params[0].data;
|
||||
return res;
|
||||
},
|
||||
},
|
||||
grid: {
|
||||
left: '10%', // 设置图表距离左边的距离
|
||||
right: '4%', // 设置图表距离右边的距离
|
||||
top: '6%',
|
||||
borderWidth: 0,
|
||||
y2: 60, // 距离底边
|
||||
},
|
||||
legend: [
|
||||
{
|
||||
show: false,
|
||||
top: 5,
|
||||
left: 'center', // 将图例居中显示
|
||||
textStyle: {
|
||||
color: 'rgb(89, 89, 89)',
|
||||
fontSize: '14',
|
||||
fontWeight: 'normal',
|
||||
}, // 注意这里的颜色值要用引号括起来
|
||||
data: ['状态'],
|
||||
itemGap: 30, // 这里可以调整图例项之间的间距,单位为像素
|
||||
},
|
||||
],
|
||||
calculable: true,
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
splitLine: {
|
||||
show: false,
|
||||
},
|
||||
axisTick: {
|
||||
show: true,
|
||||
},
|
||||
splitArea: {
|
||||
show: false,
|
||||
},
|
||||
axisLabel: {
|
||||
show: true, // 显示 X 轴刻度标签
|
||||
color: 'rgb(89, 89, 89)', // X 轴刻度标签的字体颜色
|
||||
fontSize: 12, // X 轴刻度标签的字体大小
|
||||
interval: 0, // 显示所有刻度标签
|
||||
formatter: function (value) {
|
||||
// 可选:格式化 X 轴刻度标签文本
|
||||
return value;
|
||||
},
|
||||
},
|
||||
data: dayData,
|
||||
},
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value',
|
||||
shwo: false,
|
||||
splitLine: {
|
||||
show: true,
|
||||
},
|
||||
axisLine: {
|
||||
show: false,
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
splitArea: {
|
||||
show: false,
|
||||
},
|
||||
axisLabel: {
|
||||
show: true, // 显示
|
||||
formatter: function (value) {
|
||||
return value;
|
||||
},
|
||||
},
|
||||
interval: 1, // 设置 Y 轴刻度间隔为 1
|
||||
},
|
||||
],
|
||||
dataZoom: [
|
||||
{
|
||||
height: 12,
|
||||
start: 0,
|
||||
end: 100,
|
||||
handleSize: '300%', // 设置滑块的大小
|
||||
bottom: 15,
|
||||
},
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: '状态',
|
||||
type: 'line',
|
||||
itemStyle: {
|
||||
normal: {
|
||||
barBorderRadius: 0,
|
||||
color: '#2778FF',
|
||||
},
|
||||
},
|
||||
symbol: 'circle', // 数据点的形状,这里设置为圆形
|
||||
symbolSize: 8,
|
||||
// label: {
|
||||
// show: true,
|
||||
// color: 'rgb(89, 89, 89)',
|
||||
// position: 'top',
|
||||
// top: '10',
|
||||
// formatter: function (value) {
|
||||
// return Number(energyAlarm[value.dataIndex]) ;
|
||||
// },
|
||||
// },
|
||||
data: energyAlarm,
|
||||
},
|
||||
],
|
||||
};
|
||||
chartInstance = echarts.init(graphChart.value);
|
||||
chartInstance.setOption(option);
|
||||
};
|
||||
defineExpose({
|
||||
toggle,
|
||||
});
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
.box {
|
||||
width: 100%;
|
||||
height: 35px;
|
||||
display: flex;
|
||||
position: relative;
|
||||
font-size: @font-size-base;
|
||||
border-bottom: 1px solid @primary-color;
|
||||
}
|
||||
.card {
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
top: 0px;
|
||||
width: 5px;
|
||||
height: 35px;
|
||||
background-color: @primary-color;
|
||||
}
|
||||
:deep(.ant-descriptions-item-label) {
|
||||
width: 25%;
|
||||
}
|
||||
</style>
|
@@ -0,0 +1,108 @@
|
||||
{
|
||||
"listData":[
|
||||
{
|
||||
"id": "d4",
|
||||
"isDel": "0",
|
||||
"officesId": "84",
|
||||
"deviceCode": "37430200143",
|
||||
"deviceName": "地听测试电表",
|
||||
"category": "1",
|
||||
"type": "1001",
|
||||
"energyCount": "1",
|
||||
"serialNumber": "69",
|
||||
"pidCode": null,
|
||||
"brand": "",
|
||||
"types": "",
|
||||
"manufacturer": "elit non in",
|
||||
"contacts": "ad reprehenderit",
|
||||
"phonenumber": "34",
|
||||
"position": "in esse commodo1",
|
||||
"activeState": "1",
|
||||
"measurementDirection": "1",
|
||||
"deviceMagnification": 62,
|
||||
"deviceAccuracy": "89",
|
||||
"frequency": "anim consequat irure",
|
||||
"standardFrequency": "ut elit",
|
||||
"deviceHead": "pariatur ex velit",
|
||||
"constructor": "84566",
|
||||
"voltageType": "cillum aliquip reprehenderit",
|
||||
"pt": 61,
|
||||
"ct": 64,
|
||||
"communicationProtocol": "cupidatat nisi ea ad",
|
||||
"ip": "",
|
||||
"port": "",
|
||||
"com": "",
|
||||
"slaveAddress": "",
|
||||
"dlt": "",
|
||||
"conversionIdentifier": "48",
|
||||
"multiplicationAdjustment": "1",
|
||||
"accessMethod": "1",
|
||||
"replacementFrequency": "0",
|
||||
"dataDetail": "sit",
|
||||
"insertTime": null,
|
||||
"children": null,
|
||||
"devicePointList": null,
|
||||
"insertUser": null,
|
||||
"priority": "1",
|
||||
"alarmTitle": "电压异常告警",
|
||||
"errorCode": "A001",
|
||||
"monitorTime":"1",
|
||||
"repetitions":"1",
|
||||
"monitorTimeUnit": "分",
|
||||
"enableRules": "1",
|
||||
"isUse":true
|
||||
} , {
|
||||
"id": "d5",
|
||||
"isDel": "0",
|
||||
"officesId": "84",
|
||||
"deviceCode": "37430200143",
|
||||
"deviceName": "地听测试电表",
|
||||
"category": "1",
|
||||
"type": "1001",
|
||||
"energyCount": "1",
|
||||
"serialNumber": "69",
|
||||
"pidCode": null,
|
||||
"brand": "",
|
||||
"types": "",
|
||||
"manufacturer": "elit non in",
|
||||
"contacts": "ad reprehenderit",
|
||||
"phonenumber": "34",
|
||||
"position": "in esse commodo2",
|
||||
"activeState": "1",
|
||||
"measurementDirection": "1",
|
||||
"deviceMagnification": 62,
|
||||
"deviceAccuracy": "89",
|
||||
"frequency": "anim consequat irure",
|
||||
"standardFrequency": "ut elit",
|
||||
"deviceHead": "pariatur ex velit",
|
||||
"constructor": "84566",
|
||||
"voltageType": "cillum aliquip reprehenderit",
|
||||
"pt": 61,
|
||||
"ct": 64,
|
||||
"communicationProtocol": "cupidatat nisi ea ad",
|
||||
"ip": "",
|
||||
"port": "",
|
||||
"com": "",
|
||||
"slaveAddress": "",
|
||||
"dlt": "",
|
||||
"conversionIdentifier": "48",
|
||||
"multiplicationAdjustment": "1",
|
||||
"accessMethod": "1",
|
||||
"replacementFrequency": "0",
|
||||
"dataDetail": "sit",
|
||||
"insertTime": null,
|
||||
"children": null,
|
||||
"devicePointList": null,
|
||||
"insertUser": null,
|
||||
"priority": "1",
|
||||
"alarmTitle": "电压异常告警",
|
||||
"errorCode": "A001",
|
||||
"monitorTime":"1",
|
||||
"repetitions":"1",
|
||||
"monitorTimeUnit": "分",
|
||||
"enableRules": "0",
|
||||
"isUse":true
|
||||
}
|
||||
]
|
||||
|
||||
}
|
@@ -0,0 +1,124 @@
|
||||
<template>
|
||||
<ns-drawer
|
||||
v-model:visible="visible"
|
||||
width="550"
|
||||
:title="' '"
|
||||
:footer-style="{ textAlign: 'right' }"
|
||||
:ok="btnClick"
|
||||
:cancel="handleClose"
|
||||
placement="right"
|
||||
@close="handleClose">
|
||||
<a-tabs>
|
||||
<a-tab-pane key="1" tab="更新状态">
|
||||
<div style="width: 100%; padding: 24px">
|
||||
<a-form ref="formRef" :model="infoObject" :rules="rules">
|
||||
<a-form-item ref="status" label="当前状态" name="status">
|
||||
<a-select
|
||||
v-model:value="infoObject.status"
|
||||
show-search
|
||||
placeholder="请选择设备点位"
|
||||
style="width: 85%"
|
||||
:options="statusOptions"
|
||||
:disabled="true"
|
||||
:filter-option="filterDevicePoint" />
|
||||
</a-form-item>
|
||||
<a-form-item label="备注" name="desc">
|
||||
<a-textarea
|
||||
v-model:value="infoObject.desc"
|
||||
placeholder="请输入异常描述"
|
||||
:disabled="true"
|
||||
style="width: 85%"
|
||||
:autoSize="{ minRows: 4, maxRows: 4 }" />
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</div>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="状态流程">
|
||||
<NsSteps v-bind="config" />
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
<template #footer>
|
||||
<a-button type="primary" @click="btnClick">确定</a-button>
|
||||
</template>
|
||||
</ns-drawer>
|
||||
</template>
|
||||
<script>
|
||||
import { defineComponent } from 'vue';
|
||||
import { ref, createVNode } from 'vue';
|
||||
import NsSteps from '/@/components/ns-steps.vue';
|
||||
import { NsMessage, NsModal } from '/nerv-lib/component';
|
||||
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||
|
||||
export default defineComponent({
|
||||
components: { NsSteps },
|
||||
|
||||
setup() {
|
||||
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: '已关闭' },
|
||||
]);
|
||||
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' },
|
||||
]);
|
||||
const config = ref({
|
||||
size: logList.value.length,
|
||||
dataSource: logList.value,
|
||||
});
|
||||
const handleClose = () => {
|
||||
visible.value = false;
|
||||
};
|
||||
const btnClick = () => {
|
||||
visible.value = false;
|
||||
};
|
||||
const toggle = (data) => {
|
||||
infoObject.value = { ...logList.value[0] };
|
||||
let statusMap = {
|
||||
0: '待处理',
|
||||
1: '处理中',
|
||||
2: '已完成',
|
||||
3: '超时',
|
||||
4: '已关闭',
|
||||
};
|
||||
let colorMap = {
|
||||
0: '#ff7602',
|
||||
1: '#00a1e6',
|
||||
2: '#04d919',
|
||||
3: '#d9001b',
|
||||
4: '#a6a6a6',
|
||||
};
|
||||
logList.value.forEach((item) => {
|
||||
item.statusName = statusMap[item.status];
|
||||
item.color = colorMap[item.status];
|
||||
item.src = 'status-' + item.status;
|
||||
});
|
||||
visible.value = true;
|
||||
};
|
||||
return {
|
||||
infoObject,
|
||||
statusOptions,
|
||||
btnClick,
|
||||
visible,
|
||||
logList,
|
||||
config,
|
||||
handleClose,
|
||||
toggle,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
:deep(.ant-form-item-label) {
|
||||
z-index: 20;
|
||||
text-align: right;
|
||||
width: 17%;
|
||||
}
|
||||
</style>
|
@@ -0,0 +1,158 @@
|
||||
import { dateUtil } from '/nerv-lib/util/date-util';
|
||||
import data from '../notificationManagementMock.json';
|
||||
import { http } from '/nerv-lib/util';
|
||||
import { ref } from 'vue';
|
||||
const tableKeyMap = [
|
||||
{
|
||||
title: '序号',
|
||||
dataIndex: 'address',
|
||||
customRender: (text: any) => {
|
||||
return text.index + 1;
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '告警编号',
|
||||
dataIndex: 'id',
|
||||
},
|
||||
{
|
||||
title: '告警描述',
|
||||
dataIndex: 'deviceCode',
|
||||
},
|
||||
{
|
||||
title: '优先级',
|
||||
dataIndex: 'deviceName',
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'position',
|
||||
},
|
||||
{
|
||||
title: '错误码',
|
||||
dataIndex: 'position',
|
||||
textEllipsis: true,
|
||||
},
|
||||
{
|
||||
title: '设备信息',
|
||||
dataIndex: 'position',
|
||||
},
|
||||
{
|
||||
title: '更新时间',
|
||||
dataIndex: 'enableRules',
|
||||
},
|
||||
{
|
||||
title: '断网时长',
|
||||
dataIndex: 'enableRules',
|
||||
},
|
||||
];
|
||||
const mockData = ref(data.listData);
|
||||
export const notificationtableConfig = (look: any, status: any) => {
|
||||
return {
|
||||
title: '告警记录',
|
||||
// api: '/carbon_emission/device/getDeviceList',
|
||||
value: mockData.value,
|
||||
headerActions: [{}],
|
||||
columns: tableKeyMap,
|
||||
// rowSelection: null, 选择按钮
|
||||
columnActions: {
|
||||
title: '操作',
|
||||
actions: [
|
||||
{
|
||||
label: '详情',
|
||||
name: 'FeedBackDetail',
|
||||
dynamicParams: ['uuid', 'appealType'],
|
||||
handle: (data: any) => {
|
||||
console.log(look.value);
|
||||
look.value.toggle(data);
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '状态',
|
||||
name: 'FeedBackDetail',
|
||||
dynamicParams: ['uuid', 'appealType'],
|
||||
handle: (data: any) => {
|
||||
status.value.toggle(data);
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
formConfig: {
|
||||
schemas: [
|
||||
{
|
||||
field: 'name',
|
||||
label: '告警类型',
|
||||
component: 'NsSelect',
|
||||
defaultValue: '2',
|
||||
componentProps: {
|
||||
placeholder: '请选择告警优先级',
|
||||
disabled: true,
|
||||
options: [
|
||||
{
|
||||
label: '紧急',
|
||||
value: '1',
|
||||
},
|
||||
{
|
||||
label: '重要',
|
||||
value: '2',
|
||||
},
|
||||
{
|
||||
label: '一般',
|
||||
value: '3',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'provider',
|
||||
label: '状态',
|
||||
component: 'NsSelect',
|
||||
componentProps: {
|
||||
placeholder: '请选择状态',
|
||||
options: [
|
||||
{
|
||||
label: '待处理',
|
||||
value: '1',
|
||||
},
|
||||
{
|
||||
label: '处理中',
|
||||
value: '2',
|
||||
},
|
||||
{
|
||||
label: '已完成',
|
||||
value: '3',
|
||||
},
|
||||
{
|
||||
label: '超时',
|
||||
value: '4',
|
||||
},
|
||||
{
|
||||
label: '关闭',
|
||||
value: '5',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'provider',
|
||||
label: '错误码',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入告警错误码',
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'createTime',
|
||||
label: '生产日期',
|
||||
component: 'NsRangePicker',
|
||||
fieldMap: ['manufactureBeginDate', 'manufactureEndDate'],
|
||||
componentProps: {
|
||||
valueFormat: 'YYYY-MM-DD',
|
||||
placeholder: ['开始日期', '结束日期'],
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
// pagination: { pageSizeOptions: false },
|
||||
rowKey: 'id',
|
||||
};
|
||||
};
|
@@ -5,7 +5,7 @@
|
||||
<div class="left">
|
||||
<div class="top">
|
||||
<a-form style="width: 100%;margin: 0 auto;">
|
||||
<div class="ns-form-title"><span>排放分类</span></div>
|
||||
<div class="ns-form-title"><div class="title">排放分类</div></div>
|
||||
<div style="padding: 0 16px !important;width: 100%;">
|
||||
<a-row>
|
||||
<a-col :span="24" style="margin-bottom: 16px;">
|
||||
@@ -562,6 +562,7 @@
|
||||
});
|
||||
opMap.value.fuc = (formData: any) => {
|
||||
formData.emissionType = formData.emissionType[formData.emissionType.length - 1]
|
||||
debugger
|
||||
return http.post(carbonEmissionFactorLibrary.creatOrUpdate, formData).then(() => {
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
visible.value = false;
|
||||
@@ -665,14 +666,22 @@
|
||||
handle: (record: any) => {
|
||||
userAuthList.value.splice(0);
|
||||
setTimeout(() => {
|
||||
console.log(record.id);
|
||||
|
||||
http.post(carbonEmissionFactorLibrary.findById,{ id: record.id } ).then((res) => {
|
||||
formData.value = res.data;
|
||||
const measurementUnit = ref([])
|
||||
http.post(carbonEmissionFactorLibrary.getCarbonFactorTree,{}).then((res) => {
|
||||
measurementUnit.value = res.data
|
||||
http.post(carbonEmissionFactorLibrary.findById,{ id: record.id } ).then((res) => {
|
||||
if (res.data.emissionType) {
|
||||
let selectDevice = ref([Number(res.data.emissionType)]);
|
||||
findParentIds(measurementUnit.value, res.data.emissionType, selectDevice.value);
|
||||
res.data.emissionType = selectDevice
|
||||
}
|
||||
formData.value = res.data;
|
||||
});
|
||||
});
|
||||
}, 10);
|
||||
opMap.value.type = 'edit';
|
||||
opMap.value.fuc = (formData: any) => {
|
||||
formData.emissionType = formData.emissionType[formData.emissionType.length - 1]
|
||||
return http.post(carbonEmissionFactorLibrary.creatOrUpdate, formData).then(() => {
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
visible.value = false;
|
||||
@@ -707,16 +716,17 @@
|
||||
{
|
||||
field: 'emissionProcess',
|
||||
label: '排放环节',
|
||||
component: 'NsSelect',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
allowClear: true,
|
||||
// allowClear: true,
|
||||
placeholder: '请选择排放环节',
|
||||
options: [
|
||||
{
|
||||
label: '消费环节',
|
||||
value: 0,
|
||||
}
|
||||
],
|
||||
maxLength: 30,
|
||||
// options: [
|
||||
// {
|
||||
// label: '消费环节',
|
||||
// value: 0,
|
||||
// }
|
||||
// ],
|
||||
},
|
||||
},
|
||||
{
|
||||
@@ -789,6 +799,27 @@
|
||||
// pagination: { defaultPageSize: 10 },
|
||||
rowKey: 'id',
|
||||
});
|
||||
function findParentIds(tree: any, targetId: number, result: any) {
|
||||
for (let item of tree) {
|
||||
if (item.children && item.children.length > 0) {
|
||||
if (item.children.some((child: any) => child.id === Number(targetId))) {
|
||||
result.unshift(item.id); // 将当前节点的id添加到结果数组的最前面
|
||||
findParentIds(tree, item.id, result); // 递归查找父级节点的id
|
||||
break; // 找到后可以退出循环
|
||||
}else{
|
||||
for(let childsItem of item.children){
|
||||
if(childsItem.children && childsItem.children.length > 0){
|
||||
if (childsItem.children.some((child: any) => child.id === Number(targetId))) {
|
||||
result.unshift(childsItem.id); // 将当前节点的id添加到结果数组的最前面
|
||||
findParentIds(tree, childsItem.id, result); // 递归查找父级节点的id
|
||||
break; // 找到后可以退出循环
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 单位管理
|
||||
const unitExpandedKeys = ref<string[]>();
|
||||
@@ -976,6 +1007,26 @@
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 1px solid #e9e9e9;
|
||||
}
|
||||
.title{
|
||||
text-align: left;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
font-weight: bold;
|
||||
user-select: text;
|
||||
position: relative;
|
||||
padding-left: 9px;
|
||||
}
|
||||
.title::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
height: 13px;
|
||||
width: 3px;
|
||||
border-radius: 1px;
|
||||
background-color: #2778FF;
|
||||
}
|
||||
.treeRow {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
@@ -0,0 +1,306 @@
|
||||
<template>
|
||||
<div>
|
||||
<!-- <a-table
|
||||
:columns="column"
|
||||
:data-source="data"
|
||||
bordered
|
||||
:pagination="false"
|
||||
:scroll="{ x: 2000 }">
|
||||
<template #title>
|
||||
<a-date-picker v-model:value="selectYear" picker="year" @change="changeYearData" valueFormat="YYYY" />
|
||||
</template>
|
||||
</a-table> -->
|
||||
<ns-view-list-table v-bind="tableConfig" :model="data" ref="mainRef" />
|
||||
<!-- <a-pagination
|
||||
:current="queryParams.pageNum"
|
||||
:total="total"
|
||||
:page-size="queryParams.pageSize"
|
||||
style="display: flex;justify-content: center;margin-top: 16px;"
|
||||
:show-size-changer="true"
|
||||
:show-quick-jumper="true"
|
||||
@change="onChange" /> -->
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
import { http } from '/nerv-lib/util/http';
|
||||
import { Pagination } from 'ant-design-vue';
|
||||
import dayjs, { Dayjs } from 'dayjs';
|
||||
import { carbonEmission } from '/@/api/carbonEmissionFactorLibrary';
|
||||
defineOptions({
|
||||
energyType: 'CarbonEmissions', // 与页面路由name一致缓存才可生效
|
||||
components: {
|
||||
'a-pagination': Pagination,
|
||||
},
|
||||
});
|
||||
const orgId = ref('');
|
||||
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||
orgId.value = result;
|
||||
const fetch = (api, params = { orgId } ) => {
|
||||
return http.post(api, params);
|
||||
};
|
||||
const data = ref([]);
|
||||
const selectYear = ref<Dayjs>(dayjs( new Date().getFullYear().toString()));
|
||||
const total = ref<number>()
|
||||
const queryParams = ref({
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
year: selectYear.value.format('YYYY'),
|
||||
orgId: orgId.value
|
||||
})
|
||||
|
||||
// 年份选择改变触发
|
||||
// const changeYearData = () => {
|
||||
// queryParams.value.year = selectYear.value
|
||||
// getTableList()
|
||||
// }
|
||||
// 表头
|
||||
const mainRef = ref();
|
||||
const column: TableColumnsType [] = [
|
||||
{
|
||||
title: '排放类型',
|
||||
dataIndex: 'cnValue',
|
||||
customCell: (record, rowIndex) => {
|
||||
if (rowIndex == undefined) {
|
||||
return {
|
||||
rowSpan: 0,
|
||||
colSpan: 0,
|
||||
};
|
||||
}
|
||||
const rowSpan = getRowSpan('cnValue', record, data.value);
|
||||
if (rowIndex != 0 && data.value[rowIndex - 1].name == record.name) {
|
||||
return {
|
||||
rowSpan: 0,
|
||||
colSpan: 0,
|
||||
};
|
||||
}
|
||||
return {
|
||||
rowSpan: rowSpan,
|
||||
};
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '能源种类',
|
||||
dataIndex: 'energyType',
|
||||
},
|
||||
{
|
||||
title: '计量单位',
|
||||
dataIndex: 'unit',
|
||||
},
|
||||
{
|
||||
title: '加权平均',
|
||||
dataIndex: 'averageFactorValue',
|
||||
},
|
||||
{
|
||||
title: '全年',
|
||||
dataIndex: 'carbonYearly',
|
||||
},
|
||||
{
|
||||
title: '1月',
|
||||
dataIndex: 'jan',
|
||||
},
|
||||
{
|
||||
title: '2月',
|
||||
dataIndex: 'feb',
|
||||
},
|
||||
{
|
||||
title: '3月',
|
||||
dataIndex: 'mar',
|
||||
},
|
||||
{
|
||||
title: '4月',
|
||||
dataIndex: 'apr',
|
||||
},
|
||||
{
|
||||
title: '5月',
|
||||
dataIndex: 'may',
|
||||
},
|
||||
{
|
||||
title: '6月',
|
||||
dataIndex: 'jun',
|
||||
},
|
||||
{
|
||||
title: '7月',
|
||||
dataIndex: 'jul',
|
||||
},
|
||||
{
|
||||
title: '8月',
|
||||
dataIndex: 'aug',
|
||||
},
|
||||
{
|
||||
title: '9月',
|
||||
dataIndex: 'sep',
|
||||
},
|
||||
{
|
||||
title: '10月',
|
||||
dataIndex: 'oct',
|
||||
},
|
||||
{
|
||||
title: '11月',
|
||||
dataIndex: 'nov',
|
||||
},
|
||||
{
|
||||
title: '12月',
|
||||
dataIndex: 'dec',
|
||||
},
|
||||
];
|
||||
const year = ref(selectYear.value.format('YYYY'))
|
||||
const tableConfig = ref({
|
||||
title: '碳排统计',
|
||||
api: carbonEmission.carbonEmissionStatistics,
|
||||
params: {
|
||||
orgId,
|
||||
year
|
||||
},
|
||||
columns: [
|
||||
{
|
||||
title: '排放类型',
|
||||
dataIndex: 'cnValue',
|
||||
customCell: (record, rowIndex) => {
|
||||
if (rowIndex == undefined) {
|
||||
return {
|
||||
rowSpan: 0,
|
||||
colSpan: 0,
|
||||
};
|
||||
}
|
||||
const rowSpan = getRowSpan('cnValue', record, data.value);
|
||||
if (rowIndex != 0 && data.value[rowIndex - 1].name == record.name) {
|
||||
return {
|
||||
rowSpan: 0,
|
||||
colSpan: 0,
|
||||
};
|
||||
}
|
||||
return {
|
||||
rowSpan: rowSpan,
|
||||
};
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '能源种类',
|
||||
dataIndex: 'energyType',
|
||||
},
|
||||
{
|
||||
title: '计量单位',
|
||||
dataIndex: 'unit',
|
||||
},
|
||||
{
|
||||
title: '加权平均',
|
||||
dataIndex: 'averageFactorValue',
|
||||
},
|
||||
{
|
||||
title: '全年',
|
||||
dataIndex: 'carbonYearly',
|
||||
},
|
||||
{
|
||||
title: '1月',
|
||||
dataIndex: 'jan',
|
||||
},
|
||||
{
|
||||
title: '2月',
|
||||
dataIndex: 'feb',
|
||||
},
|
||||
{
|
||||
title: '3月',
|
||||
dataIndex: 'mar',
|
||||
},
|
||||
{
|
||||
title: '4月',
|
||||
dataIndex: 'apr',
|
||||
},
|
||||
{
|
||||
title: '5月',
|
||||
dataIndex: 'may',
|
||||
},
|
||||
{
|
||||
title: '6月',
|
||||
dataIndex: 'jun',
|
||||
},
|
||||
{
|
||||
title: '7月',
|
||||
dataIndex: 'jul',
|
||||
},
|
||||
{
|
||||
title: '8月',
|
||||
dataIndex: 'aug',
|
||||
},
|
||||
{
|
||||
title: '9月',
|
||||
dataIndex: 'sep',
|
||||
},
|
||||
{
|
||||
title: '10月',
|
||||
dataIndex: 'oct',
|
||||
},
|
||||
{
|
||||
title: '11月',
|
||||
dataIndex: 'nov',
|
||||
},
|
||||
{
|
||||
title: '12月',
|
||||
dataIndex: 'dec',
|
||||
},
|
||||
],
|
||||
formConfig: {
|
||||
schemas: [
|
||||
{
|
||||
field: 'year',
|
||||
label: '年份',
|
||||
component: 'NsDatePicker',
|
||||
componentProps: {
|
||||
picker: 'year',
|
||||
valueFormat: 'YYYY',
|
||||
defaultValue: selectYear.value.format('YYYY'),
|
||||
},
|
||||
},
|
||||
],
|
||||
params: {},
|
||||
},
|
||||
rowKey: 'id',
|
||||
});
|
||||
// 合并单元格
|
||||
const getRowSpan = (dataIndex: string, record: any, data: any, dependents: string[] = []) => {
|
||||
let rowSpan = 1;
|
||||
for (let i = data.indexOf(record) + 1; i < data.length; i++) {
|
||||
let shouldMerge = true;
|
||||
for (const dependent of dependents) {
|
||||
if (data[i][dependent] !== record[dependent]) {
|
||||
shouldMerge = false;
|
||||
break;
|
||||
}
|
||||
}
|
||||
if (shouldMerge && data[i][dataIndex] === record[dataIndex]) {
|
||||
rowSpan++;
|
||||
} else {
|
||||
break;
|
||||
}
|
||||
}
|
||||
return rowSpan;
|
||||
};
|
||||
// 获取表格数据
|
||||
// const getTableList = () => {
|
||||
// fetch(carbonEmission.carbonEmissionStatistics , queryParams.value).then((res) => {
|
||||
// data.value = res.data.records
|
||||
// total.value = res.data.total
|
||||
// });
|
||||
// };
|
||||
// 分页器
|
||||
// const onChange = (pageNumber: number,size: number) => {
|
||||
// queryParams.value.pageNum = pageNumber;
|
||||
// queryParams.value.pageSize = size;
|
||||
// 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>
|
@@ -83,7 +83,7 @@
|
||||
},
|
||||
{
|
||||
title: '计量单位',
|
||||
dataIndex: 'unit',
|
||||
dataIndex: 'unitName',
|
||||
},
|
||||
{
|
||||
title: '加权平均',
|
||||
|
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<a-table
|
||||
<!-- <a-table
|
||||
:columns="tableColumns"
|
||||
:data-source="data"
|
||||
bordered
|
||||
@@ -26,15 +26,16 @@
|
||||
<a-button type="primary">凭证下载</a-button>
|
||||
</div>
|
||||
</template>
|
||||
</a-table>
|
||||
<a-pagination
|
||||
</a-table> -->
|
||||
<ns-view-list-table v-bind="tableConfig" :model="data" ref="mainRef" :scroll="{ x: 1500}" />
|
||||
<!-- <a-pagination
|
||||
:current="queryParams.pageNum"
|
||||
:total="total"
|
||||
:page-size="queryParams.pageSize"
|
||||
style="display: flex;justify-content: center;margin-top: 16px;"
|
||||
:show-size-changer="true"
|
||||
:show-quick-jumper="true"
|
||||
@change="onChange" />
|
||||
@change="onChange" /> -->
|
||||
<!-- 新增数据库数据 -->
|
||||
<a-drawer
|
||||
:width="500"
|
||||
@@ -158,6 +159,7 @@
|
||||
import { Pagination,message,Modal } from 'ant-design-vue';
|
||||
import { InboxOutlined } from '@ant-design/icons-vue';
|
||||
import type { CascaderProps,TreeSelectProps,UploadChangeParam } from 'ant-design-vue';
|
||||
import { NsMessage } from '/nerv-lib/component';
|
||||
import dayjs, { Dayjs } from 'dayjs';
|
||||
import { http } from '/nerv-lib/util/http';
|
||||
import { tableColumns } from '../config';
|
||||
@@ -212,7 +214,9 @@
|
||||
const wrapperCol = { span: 19 };
|
||||
const switchLabelCol = { span: 10 };
|
||||
const switchWrapperCol = { span: 14 };
|
||||
const formState = ref({})
|
||||
const formState = ref({
|
||||
orgId: orgId.value,
|
||||
})
|
||||
// 定义form表单的必填
|
||||
const rules: Record<string, Rule[]> = {
|
||||
energyType: [{ required: true, message: '请输入能源种类', trigger: 'change' }],
|
||||
@@ -229,19 +233,196 @@
|
||||
queryParams.value.year = selectYear.value
|
||||
getTableList()
|
||||
}
|
||||
const mainRef = ref();
|
||||
const year = selectYear.value.format('YYYY')
|
||||
const tableConfig = ref({
|
||||
title: '能耗统计',
|
||||
api: energyConsumption.pageList,
|
||||
params: queryParams.value,
|
||||
headerActions: [
|
||||
{
|
||||
label: '新增',
|
||||
name: 'userAdd',
|
||||
type: 'primary',
|
||||
handle: () => {
|
||||
getDictList()
|
||||
visible.value = true
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '导入',
|
||||
type: 'primary',
|
||||
name: 'userImport',
|
||||
handle: () => {},
|
||||
},
|
||||
{
|
||||
label: '导出',
|
||||
type: 'primary',
|
||||
name: 'userExports',
|
||||
},
|
||||
{
|
||||
label: '模板下载',
|
||||
type: 'primary',
|
||||
name: 'userExports',
|
||||
},
|
||||
{
|
||||
label: '上传凭证',
|
||||
type: 'primary',
|
||||
handle: () => {
|
||||
openUpload.value = true;
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '凭证下载',
|
||||
type: 'primary',
|
||||
name: 'userExports',
|
||||
},
|
||||
],
|
||||
columns: [
|
||||
{
|
||||
title: '序号',
|
||||
customRender: (text: any) => {
|
||||
return text.index + 1;
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '能源种类',
|
||||
dataIndex: 'energyType',
|
||||
},
|
||||
{
|
||||
title: '计量单位',
|
||||
className: 'unitName',
|
||||
dataIndex: 'unitName',
|
||||
},
|
||||
{
|
||||
title: '全年',
|
||||
dataIndex: 'yearly',
|
||||
},
|
||||
{
|
||||
title: '1月',
|
||||
dataIndex: 'jan',
|
||||
// customRender: ({ text, record }) => ({
|
||||
// children: text,
|
||||
// attrs: {
|
||||
// style: record.janFlag === 1 ? 'color: red' : 'color: blue'
|
||||
// }
|
||||
// })
|
||||
},
|
||||
{
|
||||
title: '2月',
|
||||
dataIndex: 'feb',
|
||||
},
|
||||
{
|
||||
title: '3月',
|
||||
dataIndex: 'mar',
|
||||
},
|
||||
{
|
||||
title: '4月',
|
||||
dataIndex: 'apr',
|
||||
},
|
||||
{
|
||||
title: '5月',
|
||||
dataIndex: 'may',
|
||||
},
|
||||
{
|
||||
title: '6月',
|
||||
dataIndex: 'jun',
|
||||
},
|
||||
{
|
||||
title: '7月',
|
||||
dataIndex: 'jul',
|
||||
},
|
||||
{
|
||||
title: '8月',
|
||||
dataIndex: 'aug',
|
||||
},
|
||||
{
|
||||
title: '9月',
|
||||
dataIndex: 'sep',
|
||||
},
|
||||
{
|
||||
title: '10月',
|
||||
dataIndex: 'oct',
|
||||
},
|
||||
{
|
||||
title: '11月',
|
||||
dataIndex: 'nov',
|
||||
},
|
||||
{
|
||||
title: '12月',
|
||||
dataIndex: 'dec',
|
||||
},
|
||||
],
|
||||
columnActions: {
|
||||
title: '操作',
|
||||
actions: [
|
||||
{
|
||||
label: '编辑',
|
||||
name: 'userEdit',
|
||||
handle: (record: any) => {
|
||||
getDictList()
|
||||
visible.value = true
|
||||
fetch(energyConsumption.findById , {id : record.id }).then((res) => {
|
||||
if (res.data.unit) {
|
||||
let selectDevice = ref([Number(res.data.unit)]);
|
||||
findParentIds(measurementUnit.value, res.data.unit, selectDevice.value);
|
||||
res.data.unit = selectDevice
|
||||
}
|
||||
formState.value = res.data
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '删除',
|
||||
name: 'userDelete',
|
||||
dynamicParams: { id: 'id' },
|
||||
confirm: true,
|
||||
isReload: true,
|
||||
api: energyConsumption.del,
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
formConfig: {
|
||||
schemas: [
|
||||
{
|
||||
field: 'year',
|
||||
label: '年份',
|
||||
component: 'NsDatePicker',
|
||||
componentProps: {
|
||||
picker: 'year',
|
||||
valueFormat: 'YYYY',
|
||||
defaultValue: selectYear.value.format('YYYY'),
|
||||
},
|
||||
},
|
||||
],
|
||||
params: {},
|
||||
},
|
||||
rowKey: 'id',
|
||||
});
|
||||
// 定义一个递归函数来查找每一级的id 设备类型回显 层级方法
|
||||
function findParentIds(tree: any, targetId: number, result: any) {
|
||||
for (let item of tree) {
|
||||
if (item.children && item.children.length > 0) {
|
||||
if (item.children.some((child: any) => child.value === targetId)) {
|
||||
result.unshift(item.value); // 将当前节点的id添加到结果数组的最前面
|
||||
findParentIds(tree, item.value, result); // 递归查找父级节点的id
|
||||
break; // 找到后可以退出循环
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// 获取表格数据
|
||||
const getTableList = () => {
|
||||
fetch(energyConsumption.pageList , queryParams.value).then((res) => {
|
||||
data.value = res.data.records
|
||||
total.value = res.data.total
|
||||
});
|
||||
};
|
||||
getTableList()
|
||||
// 分页器
|
||||
const onChange = (pageNumber: number,size: number) => {
|
||||
queryParams.value.pageNum = pageNumber;
|
||||
queryParams.value.pageSize = size;
|
||||
getTableList()
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
};
|
||||
// 计算碳排切换
|
||||
const changeRadio = (e) => {
|
||||
@@ -258,28 +439,29 @@
|
||||
.then(() => {
|
||||
console.log('values', formState, toRaw(formState));
|
||||
if(formState.value.unit){
|
||||
formState.value.unit = formState.value.unit.join(',')
|
||||
formState.value.unit = formState.value.unit.join(',').split(',')[1]
|
||||
}
|
||||
if(formState.value.id){
|
||||
fetch(energyConsumption.update , formState.value).then((res) => {
|
||||
visible.value = false
|
||||
formState.value = {
|
||||
orgId: orgId.value,
|
||||
}
|
||||
message.success('操作成功!');
|
||||
getTableList()
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
});
|
||||
}else{
|
||||
fetch(energyConsumption.creat , formState.value).then((res) => {
|
||||
if(res.data === '新增数据已存在'){
|
||||
visible.value = false
|
||||
queryParams.value = formState.value
|
||||
queryParams.value.pageNum = 1,
|
||||
queryParams.value.pageSize = 10,
|
||||
queryParams.value.orgId = orgId.value,
|
||||
queryParams.value.year = selectYear.value.format('YYYY')
|
||||
getTableList()
|
||||
NsMessage.warning(res.data);
|
||||
}else{
|
||||
visible.value = false
|
||||
formState.value = {
|
||||
orgId: orgId.value,
|
||||
}
|
||||
message.success('操作成功!');
|
||||
getTableList()
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
}
|
||||
});
|
||||
}
|
||||
@@ -298,22 +480,23 @@
|
||||
fetch(carbonEmissionFactorLibrary.dictionaryUnitManagement, { grp: 'MEASUREMENT_UNIT'}).then((res) => {
|
||||
measurementUnit.value = res.data
|
||||
measurementUnit.value = measurementUnit.value.map(item => ({
|
||||
value: item.cnValue,
|
||||
value: item.id,
|
||||
label: item.cnValue,
|
||||
children: item.children ? item.children.map(child => ({
|
||||
value: child.cnValue,
|
||||
value: child.id,
|
||||
label: child.cnValue
|
||||
})) : []
|
||||
}));
|
||||
debugger
|
||||
});
|
||||
// 获取自动采集节点的数据
|
||||
fetch(group.queryDeviceGroupTree, { energyType: 'ELECTRICITY_USAGE',orgId: orgId.value }).then((res) => {
|
||||
treeData.value = res.data
|
||||
treeData.value = treeData.value.map(item => ({
|
||||
value: item.pointName,
|
||||
value: item.id,
|
||||
label: item.pointName,
|
||||
children: item.children ? item.children.map(child => ({
|
||||
value: child.pointName,
|
||||
value: child.id,
|
||||
label: child.pointName
|
||||
})) : []
|
||||
}));
|
||||
@@ -329,8 +512,8 @@
|
||||
getDictList()
|
||||
visible.value = true
|
||||
fetch(energyConsumption.findById , {id : record.id }).then((res) => {
|
||||
if(res.data.unit){
|
||||
res.data.unit = res.data.unit.split(',')
|
||||
if(res.data.unitName){
|
||||
res.data.unitName = res.data.unitName.split(',')
|
||||
}
|
||||
formState.value = res.data
|
||||
});
|
||||
@@ -346,7 +529,7 @@
|
||||
onOk() {
|
||||
fetch(energyConsumption.del , {id : record.id }).then((res) => {
|
||||
message.success('操作成功!');
|
||||
getTableList()
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
});
|
||||
},
|
||||
onCancel() {
|
||||
@@ -357,6 +540,9 @@
|
||||
// 关闭新增抽屉
|
||||
const onClose = () => {
|
||||
visible.value = false;
|
||||
formState.value = {
|
||||
orgId: orgId.value,
|
||||
}
|
||||
formRef.value.resetFields();
|
||||
};
|
||||
// 点击上传凭证按钮
|
||||
|
@@ -3,7 +3,7 @@
|
||||
<div class="left">
|
||||
<div class="top">
|
||||
<a-form style="width: 100%;margin: 0 auto;">
|
||||
<div class="ns-form-title"><span>因子分类</span></div>
|
||||
<div class="ns-form-title"><div class="title">因子分类</div></div>
|
||||
<div style="padding: 0 16px !important;width: 100%;">
|
||||
<a-row>
|
||||
<a-col :span="24" style="margin-bottom: 16px;">
|
||||
@@ -39,7 +39,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<a-table
|
||||
<!-- <a-table
|
||||
:columns="columns"
|
||||
:data-source="tableData"
|
||||
bordered
|
||||
@@ -59,7 +59,8 @@
|
||||
<a-button type="primary" @click="addNewData">新增</a-button>
|
||||
</div>
|
||||
</template>
|
||||
</a-table>
|
||||
</a-table> -->
|
||||
<ns-view-list-table v-bind="tableConfig" :model="tableData" ref="mainRef" />
|
||||
<a-pagination
|
||||
:current="queryParams.pageNum"
|
||||
:total="total"
|
||||
@@ -139,6 +140,7 @@
|
||||
const fetch = (api, params = { orgId } ) => {
|
||||
return http.post(api, params);
|
||||
};
|
||||
const mainRef = ref();
|
||||
// 数结构
|
||||
const x = 3;
|
||||
const y = 2;
|
||||
@@ -209,12 +211,13 @@
|
||||
autoExpandParent.value = false;
|
||||
};
|
||||
// 被选中的树节点
|
||||
const energyType = ref()
|
||||
const onSelect = (selectedKey: string[], info: any) => {
|
||||
selectedKeys.value = selectedKey;
|
||||
if(info.selected){
|
||||
queryParams.value.energyType = info.node.id
|
||||
energyType.value = info.node.id
|
||||
statsId.value = info.node.id
|
||||
getTableList()
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
}
|
||||
};
|
||||
|
||||
@@ -239,10 +242,9 @@
|
||||
const getTreeData = () => {
|
||||
fetch(quickCalculation.carbonQuickTree).then((res) => {
|
||||
gData.value = res.data
|
||||
debugger
|
||||
queryParams.value.energyType = gData.value[0].children[0].id
|
||||
energyType.value = gData.value[0].children[0].id
|
||||
statsId.value = gData.value[0].children[0].id
|
||||
getTableList()
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
});
|
||||
};
|
||||
getTreeData()
|
||||
@@ -254,6 +256,90 @@
|
||||
orgId: orgId.value
|
||||
})
|
||||
const tableData = ref([]);
|
||||
|
||||
const tableConfig = ref({
|
||||
title: '排放因子库',
|
||||
api: quickCalculation.queryCarbonEmissionPage,
|
||||
params: {
|
||||
orgId,
|
||||
energyType
|
||||
},
|
||||
headerActions: [
|
||||
{
|
||||
label: '新增',
|
||||
name: 'userAdd',
|
||||
type: 'primary',
|
||||
handle: () => {
|
||||
visible.value = true
|
||||
getNewTable()
|
||||
},
|
||||
},
|
||||
],
|
||||
columns: [
|
||||
{
|
||||
title: '序号',
|
||||
customRender: (text: any) => {
|
||||
return text.index + 1;
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '因子值',
|
||||
dataIndex: 'emissionFactors',
|
||||
},
|
||||
{
|
||||
title: '计量单位',
|
||||
className: 'carbonEmissionSuffix',
|
||||
dataIndex: 'carbonEmissionSuffix',
|
||||
},
|
||||
{
|
||||
title: '更新时间',
|
||||
className: 'updateTime',
|
||||
dataIndex: 'updateTime',
|
||||
},
|
||||
{
|
||||
title: '启用时间',
|
||||
className: 'startTime',
|
||||
dataIndex: 'startTime',
|
||||
},
|
||||
{
|
||||
title: '结束时间',
|
||||
className: 'endTime',
|
||||
dataIndex: 'endTime',
|
||||
},
|
||||
{
|
||||
title: '数据来源',
|
||||
className: 'dataSources',
|
||||
dataIndex: 'dataSources',
|
||||
},
|
||||
],
|
||||
columnActions: {
|
||||
title: '操作',
|
||||
actions: [
|
||||
{
|
||||
label: '编辑',
|
||||
name: 'userEdit',
|
||||
handle: (record: any) => {
|
||||
selectedRowKeys.value = [record.factorId];
|
||||
formState.value.id = record.id
|
||||
formState.value.emissionFactors = record.emissionFactors
|
||||
formState.value.dateRange = [record.startTime, record.endTime];
|
||||
formState.value.factorId = record.factorId
|
||||
visible.value = true
|
||||
getNewTable()
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '删除',
|
||||
name: 'userDelete',
|
||||
dynamicParams: { id: 'id' },
|
||||
confirm: true,
|
||||
isReload: true,
|
||||
api: quickCalculation.del,
|
||||
},
|
||||
],
|
||||
},
|
||||
rowKey: 'id',
|
||||
});
|
||||
// 获取列表数据
|
||||
const getTableList = () => {
|
||||
fetch(quickCalculation.queryCarbonEmissionPage,queryParams.value).then((res) => {
|
||||
@@ -265,7 +351,7 @@
|
||||
const onChange = (pageNumber: number,size: number) => {
|
||||
queryParams.value.pageNum = pageNumber;
|
||||
queryParams.value.pageSize = size;
|
||||
getTableList()
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
};
|
||||
// 新增/编辑
|
||||
const formRef = ref();
|
||||
@@ -289,7 +375,7 @@
|
||||
const onSelectionChange = (selectedKeys, selectedRows) => {
|
||||
selectedRowKeys.value = selectedKeys;
|
||||
formState.value.emissionFactors = selectedRows[0].emissionFactors
|
||||
formState.value.carbonId = selectedRows[0].id
|
||||
formState.value.factorId = selectedRows[0].id
|
||||
};
|
||||
const queryData = ref({
|
||||
orgId: orgId.value,
|
||||
@@ -304,11 +390,11 @@
|
||||
};
|
||||
// 点击编辑按钮
|
||||
const editData = (record) =>{
|
||||
selectedRowKeys.value = [record.carbonId];
|
||||
selectedRowKeys.value = [record.factorId];
|
||||
formState.value.id = record.id
|
||||
formState.value.emissionFactors = record.emissionFactors
|
||||
formState.value.dateRange = [record.startTime, record.endTime];
|
||||
formState.value.carbonId = record.carbonId
|
||||
formState.value.factorId = record.factorId
|
||||
visible.value = true
|
||||
getNewTable()
|
||||
};
|
||||
@@ -321,14 +407,13 @@
|
||||
formState.value.startTime = formState.value.dateRange[0]
|
||||
formState.value.endTime = formState.value.dateRange[1]
|
||||
console.log('values', formState, toRaw(formState));
|
||||
debugger
|
||||
if(formState.value.id){
|
||||
fetch(quickCalculation.update,formState.value).then((res) => {
|
||||
visible.value = false
|
||||
selectedRowKeys.value = [];
|
||||
formState.value = {}
|
||||
formRef.value.resetFields();
|
||||
getTableList()
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
});
|
||||
}else{
|
||||
fetch(quickCalculation.creat,formState.value).then((res) => {
|
||||
@@ -336,7 +421,7 @@
|
||||
selectedRowKeys.value = [];
|
||||
formState.value = {}
|
||||
formRef.value.resetFields();
|
||||
getTableList()
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
});
|
||||
}
|
||||
})
|
||||
@@ -408,6 +493,9 @@
|
||||
::v-deep .ant-table-container{
|
||||
padding: 0px 16px;
|
||||
}
|
||||
:deep(.ns-table-main) {
|
||||
margin-top: unset !important;
|
||||
}
|
||||
.top {
|
||||
overflow: auto;
|
||||
}
|
||||
@@ -419,6 +507,26 @@
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 1px solid #e9e9e9;
|
||||
}
|
||||
.title{
|
||||
text-align: left;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
font-weight: bold;
|
||||
user-select: text;
|
||||
position: relative;
|
||||
padding-left: 9px;
|
||||
}
|
||||
.title::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
height: 13px;
|
||||
width: 3px;
|
||||
border-radius: 1px;
|
||||
background-color: #2778FF;
|
||||
}
|
||||
::v-deep .ant-table-title{
|
||||
display: flex;
|
||||
height: 100%;
|
||||
|
@@ -0,0 +1,283 @@
|
||||
import { ref } from 'vue';
|
||||
import { http } from '/nerv-lib/util';
|
||||
import { origanizemanage } from '/@/api/origanizemanage';
|
||||
import { carbonEmissionFactorLibrary } from '/@/api/carbonEmissionFactorLibrary';
|
||||
export const formConfig = (disabled) => {
|
||||
return ref([
|
||||
{
|
||||
field: 'fields',
|
||||
component: 'NsChildForm',
|
||||
componentProps: {
|
||||
schemas: [
|
||||
{
|
||||
label: '排放源',
|
||||
field: 'emissionSources',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入排放源',
|
||||
maxLength: 20,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入排放源',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
field: 'emissionType',
|
||||
label: '排放分类',
|
||||
component: 'NsCascader',
|
||||
fieldMap: ['emissionType'],
|
||||
componentProps: {
|
||||
placeholder: '请选择排放分类',
|
||||
api: carbonEmissionFactorLibrary.getCarbonFactorTree,
|
||||
fieldNames: { label: 'emissionName', value: 'id' },
|
||||
showSearch: true,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择排放分类',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
field: 'emissionGas',
|
||||
label: '排放气体',
|
||||
component: 'NsSelect',
|
||||
componentProps: {
|
||||
allowClear: true,
|
||||
placeholder: '请选择排放气体',
|
||||
options: [
|
||||
{
|
||||
label: 'CO2',
|
||||
value: 'CO2',
|
||||
},
|
||||
{
|
||||
label: 'CO2e',
|
||||
value: 'CO2e',
|
||||
},
|
||||
{
|
||||
label: 'SF6',
|
||||
value:'SF6',
|
||||
},
|
||||
{
|
||||
label: 'CH4',
|
||||
value: 'CH4',
|
||||
},
|
||||
{
|
||||
label: 'PFCs',
|
||||
value: 'PFCs',
|
||||
},
|
||||
{
|
||||
label: 'HFCs',
|
||||
value: 'HFCs',
|
||||
},
|
||||
],
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择排放气体',
|
||||
},
|
||||
],
|
||||
},
|
||||
// {
|
||||
// field: 'emissionProcess',
|
||||
// label: '排放环节',
|
||||
// component: 'NsSelectApi',
|
||||
// componentProps: {
|
||||
// api: carbonEmissionFactorLibrary.getEmissionProcess,
|
||||
// params: {
|
||||
// emissionType: sessionStorage.getItem('checkedTreeNode'),
|
||||
// },
|
||||
// resultField: 'data',
|
||||
// labelField: 'emissionProcess',
|
||||
// valueField: 'emissionProcess',
|
||||
// immediate: true,
|
||||
// autoSelectFirst: false,
|
||||
// filterOption:false,
|
||||
// showSearch:true,
|
||||
// autoClearSearchValue:false
|
||||
// },
|
||||
// },
|
||||
{
|
||||
label: '排放环节',
|
||||
field: 'emissionProcess',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入排放环节',
|
||||
maxLength: 20,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入排放环节',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '排放因子',
|
||||
field: 'emissionFactors',
|
||||
component: 'NsInputNumber',
|
||||
componentProps: {
|
||||
placeholder: '请输入排放因子值',
|
||||
maxLength: 20,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入排放因子值',
|
||||
trigger: 'change',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
field: 'carbonEmissionPrefix',
|
||||
label: '碳排前缀',
|
||||
component: 'NsSelect',
|
||||
componentProps: {
|
||||
disabled: true,
|
||||
allowClear: true,
|
||||
defaultValue: 't',
|
||||
placeholder: '请选择碳排前缀',
|
||||
options: [
|
||||
{
|
||||
label: 'g',
|
||||
value: 'g',
|
||||
},
|
||||
{
|
||||
label: 'kg',
|
||||
value: 'kg',
|
||||
},
|
||||
{
|
||||
label: 't',
|
||||
value: 't',
|
||||
},
|
||||
],
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择碳排前缀',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '碳排后缀',
|
||||
field: 'carbonEmissionSuffix',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入碳排后缀',
|
||||
maxLength: 20,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入碳排后缀',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '已引用数',
|
||||
field: 'numberOfReferences',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
defaultValue: 10,
|
||||
disabled: true,
|
||||
maxLength: 20,
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '参考文献',
|
||||
field: 'reference',
|
||||
component: 'NsTextarea',
|
||||
componentProps: {
|
||||
placeholder: '请输入参考文献',
|
||||
maxLength: 20,
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
]);
|
||||
};
|
||||
const options = ref([]);
|
||||
|
||||
const getUserPerList = (transform, params = {}) => {
|
||||
return http.post(origanizemanage.queryUserPerList, { ...params }).then((res) => {
|
||||
return res.data?.map((item) => {
|
||||
item = { ...item, ...transform(item) };
|
||||
return item;
|
||||
});
|
||||
});
|
||||
};
|
||||
export const formConfig2 = (casData: any) => {
|
||||
return ref([
|
||||
{
|
||||
field: 'information',
|
||||
component: 'NsCascader',
|
||||
componentProps: {
|
||||
placeholder: '请选择',
|
||||
displayRender: ({ labels, selectedOptions }: any) => {
|
||||
console.log(labels, selectedOptions);
|
||||
|
||||
casData.value = selectedOptions.map(({ label, value }) => {
|
||||
return { label, value };
|
||||
});
|
||||
return labels.join('/');
|
||||
},
|
||||
loadData: (selectedOptions, options) => {
|
||||
console.log(selectedOptions, options, 'selectedOptions, options');
|
||||
|
||||
const targetOption = selectedOptions[selectedOptions.length - 1];
|
||||
let transForm, params;
|
||||
// load options lazily
|
||||
if (!selectedOptions.length) {
|
||||
transForm = (data) => {
|
||||
data['label'] = data.orgName;
|
||||
data['value'] = data.orgId;
|
||||
data['isLeaf'] = false;
|
||||
data['level'] = 1;
|
||||
return data;
|
||||
};
|
||||
getUserPerList(transForm).then((res) => {
|
||||
options.value = [...res];
|
||||
});
|
||||
}
|
||||
const id = targetOption?.value;
|
||||
const level = targetOption?.level;
|
||||
if (targetOption) {
|
||||
targetOption.loading = true;
|
||||
}
|
||||
|
||||
if (level === 1) {
|
||||
transForm = (data) => {
|
||||
data['label'] = data.deptName;
|
||||
data['value'] = data.deptId;
|
||||
data['isLeaf'] = false;
|
||||
data['level'] = 2;
|
||||
return data;
|
||||
};
|
||||
params = { orgId: id };
|
||||
} else if (level === 2) {
|
||||
transForm = (data) => {
|
||||
data['label'] = data.roleName;
|
||||
data['value'] = data.roleId;
|
||||
data['level'] = 3;
|
||||
return data;
|
||||
};
|
||||
params = { deptId: id };
|
||||
}
|
||||
if (targetOption) {
|
||||
getUserPerList(transForm, { ...params }).then((res) => {
|
||||
targetOption.loading = false;
|
||||
targetOption.children = [...res];
|
||||
});
|
||||
}
|
||||
},
|
||||
},
|
||||
},
|
||||
]);
|
||||
};
|
@@ -0,0 +1,406 @@
|
||||
<template>
|
||||
<div class="main">
|
||||
<div class="left">
|
||||
<div class="top">
|
||||
<a-form style="width: 100%;margin: 0 auto;">
|
||||
<div class="ns-form-title"><div class="title">2024年济阳站碳盘查报告</div></div>
|
||||
<div style="padding: 0 16px !important;width: 100%;">
|
||||
<a-row>
|
||||
<a-col :span="24" style="margin-bottom: 16px;">
|
||||
<a-input-search v-model:value="searchValue" style="margin-bottom: 8px" placeholder="请输入关键词" />
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
</a-form>
|
||||
<a-tree
|
||||
:expanded-keys="expandedKeys"
|
||||
:auto-expand-parent="autoExpandParent"
|
||||
:tree-data="gData"
|
||||
:height="233"
|
||||
show-line
|
||||
style="padding: 0 16px !important;"
|
||||
@expand="onExpand"
|
||||
>
|
||||
<template #title="{ title }">
|
||||
<span v-if="title.indexOf(searchValue) > -1">
|
||||
{{ title.substring(0, title.indexOf(searchValue)) }}
|
||||
<span style="color: #f50">{{ searchValue }}</span>
|
||||
{{ title.substring(title.indexOf(searchValue) + searchValue.length) }}
|
||||
</span>
|
||||
<span v-else>{{ title }}</span>
|
||||
</template>
|
||||
</a-tree>
|
||||
</div>
|
||||
<div class="bottom">
|
||||
<a-form style="width: 100%;margin: 0 auto;">
|
||||
<div class="ns-form-title"><div class="title">报告相关</div></div>
|
||||
<div class="button" style="padding: 0 16px !important;">
|
||||
<div class="changePage">排放统计</div>
|
||||
<div class="changePage">碳排流向</div>
|
||||
</div>
|
||||
</a-form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<div class="ns-table-title ns-title-extra-box">排放源</div>
|
||||
<div class="mainLeft"></div>
|
||||
<div class="mainRight">
|
||||
<ns-view-list-table v-bind="tableConfig" :model="data" ref="mainRef" :scroll="{ x: 1500}" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, watch } from 'vue';
|
||||
import type { TreeProps } from 'ant-design-vue';
|
||||
import { energyConsumption } from '/@/api/carbonEmissionFactorLibrary';
|
||||
const orgId = ref('');
|
||||
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||
orgId.value = result;
|
||||
const fetch = (api, params = { orgId } ) => {
|
||||
return http.post(api, params);
|
||||
};
|
||||
// 树结构
|
||||
const x = 3;
|
||||
const y = 2;
|
||||
const z = 1;
|
||||
const genData: TreeProps['treeData'] = [];
|
||||
|
||||
const generateData = (_level: number, _preKey?: string, _tns?: TreeProps['treeData']) => {
|
||||
const preKey = _preKey || '0';
|
||||
const tns = _tns || genData;
|
||||
|
||||
const children = [];
|
||||
for (let i = 0; i < x; i++) {
|
||||
const key = `${preKey}-${i}`;
|
||||
tns.push({ title: key, key });
|
||||
if (i < y) {
|
||||
children.push(key);
|
||||
}
|
||||
}
|
||||
if (_level < 0) {
|
||||
return tns;
|
||||
}
|
||||
const level = _level - 1;
|
||||
children.forEach((key, index) => {
|
||||
tns[index].children = [];
|
||||
return generateData(level, key, tns[index].children);
|
||||
});
|
||||
};
|
||||
generateData(z);
|
||||
|
||||
const dataList: TreeProps['treeData'] = [];
|
||||
const generateList = (data: TreeProps['treeData']) => {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
const node = data[i];
|
||||
const key = node.key;
|
||||
dataList.push({ key, title: key });
|
||||
if (node.children) {
|
||||
generateList(node.children);
|
||||
}
|
||||
}
|
||||
};
|
||||
generateList(genData);
|
||||
|
||||
const getParentKey = (
|
||||
key: string | number,
|
||||
tree: TreeProps['treeData'],
|
||||
): string | number | undefined => {
|
||||
let parentKey;
|
||||
for (let i = 0; i < tree.length; i++) {
|
||||
const node = tree[i];
|
||||
if (node.children) {
|
||||
if (node.children.some(item => item.key === key)) {
|
||||
parentKey = node.key;
|
||||
} else if (getParentKey(key, node.children)) {
|
||||
parentKey = getParentKey(key, node.children);
|
||||
}
|
||||
}
|
||||
}
|
||||
return parentKey;
|
||||
};
|
||||
const expandedKeys = ref<(string | number)[]>([]);
|
||||
const searchValue = ref<string>('');
|
||||
const autoExpandParent = ref<boolean>(true);
|
||||
const gData = ref<TreeProps['treeData']>(genData);
|
||||
|
||||
const onExpand = (keys: string[]) => {
|
||||
expandedKeys.value = keys;
|
||||
autoExpandParent.value = false;
|
||||
};
|
||||
|
||||
watch(searchValue, value => {
|
||||
const expanded = dataList
|
||||
.map((item: TreeProps['treeData'][number]) => {
|
||||
if (item.title.indexOf(value) > -1) {
|
||||
return getParentKey(item.key, gData.value);
|
||||
}
|
||||
return null;
|
||||
})
|
||||
.filter((item, i, self) => item && self.indexOf(item) === i);
|
||||
expandedKeys.value = expanded;
|
||||
searchValue.value = value;
|
||||
autoExpandParent.value = true;
|
||||
});
|
||||
// 填报表格数据
|
||||
const queryParams = ref({
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
orgId: orgId.value,
|
||||
})
|
||||
const tableConfig = ref({
|
||||
title: '能耗统计',
|
||||
api: energyConsumption.pageList,
|
||||
params: queryParams.value,
|
||||
headerActions: [
|
||||
{
|
||||
label: '新增',
|
||||
name: 'userAdd',
|
||||
type: 'primary',
|
||||
handle: () => {
|
||||
getDictList()
|
||||
visible.value = true
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '导入',
|
||||
type: 'primary',
|
||||
name: 'userImport',
|
||||
handle: () => {},
|
||||
},
|
||||
{
|
||||
label: '导出',
|
||||
type: 'primary',
|
||||
name: 'userExports',
|
||||
},
|
||||
{
|
||||
label: '模板下载',
|
||||
type: 'primary',
|
||||
name: 'userExports',
|
||||
},
|
||||
{
|
||||
label: '上传凭证',
|
||||
type: 'primary',
|
||||
handle: () => {
|
||||
openUpload.value = true;
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '凭证下载',
|
||||
type: 'primary',
|
||||
name: 'userExports',
|
||||
},
|
||||
],
|
||||
columns: [
|
||||
{
|
||||
title: '序号',
|
||||
customRender: (text: any) => {
|
||||
return text.index + 1;
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '能源种类',
|
||||
dataIndex: 'energyType',
|
||||
},
|
||||
{
|
||||
title: '计量单位',
|
||||
className: 'unitName',
|
||||
dataIndex: 'unitName',
|
||||
},
|
||||
{
|
||||
title: '全年',
|
||||
dataIndex: 'yearly',
|
||||
},
|
||||
{
|
||||
title: '1月',
|
||||
dataIndex: 'jan',
|
||||
},
|
||||
{
|
||||
title: '2月',
|
||||
dataIndex: 'feb',
|
||||
},
|
||||
{
|
||||
title: '3月',
|
||||
dataIndex: 'mar',
|
||||
},
|
||||
{
|
||||
title: '4月',
|
||||
dataIndex: 'apr',
|
||||
},
|
||||
{
|
||||
title: '5月',
|
||||
dataIndex: 'may',
|
||||
},
|
||||
{
|
||||
title: '6月',
|
||||
dataIndex: 'jun',
|
||||
},
|
||||
{
|
||||
title: '7月',
|
||||
dataIndex: 'jul',
|
||||
},
|
||||
{
|
||||
title: '8月',
|
||||
dataIndex: 'aug',
|
||||
},
|
||||
{
|
||||
title: '9月',
|
||||
dataIndex: 'sep',
|
||||
},
|
||||
{
|
||||
title: '10月',
|
||||
dataIndex: 'oct',
|
||||
},
|
||||
{
|
||||
title: '11月',
|
||||
dataIndex: 'nov',
|
||||
},
|
||||
{
|
||||
title: '12月',
|
||||
dataIndex: 'dec',
|
||||
},
|
||||
],
|
||||
columnActions: {
|
||||
title: '操作',
|
||||
actions: [
|
||||
{
|
||||
label: '编辑',
|
||||
name: 'userEdit',
|
||||
handle: (record: any) => {
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '删除',
|
||||
name: 'userDelete',
|
||||
dynamicParams: { id: 'id' },
|
||||
confirm: true,
|
||||
isReload: true,
|
||||
api: energyConsumption.del,
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
formConfig: {
|
||||
schemas: [
|
||||
{
|
||||
field: 'year',
|
||||
label: '年份',
|
||||
component: 'NsDatePicker',
|
||||
componentProps: {
|
||||
picker: 'year',
|
||||
valueFormat: 'YYYY',
|
||||
},
|
||||
},
|
||||
],
|
||||
params: {},
|
||||
},
|
||||
rowKey: 'id',
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.main {
|
||||
background-color: @ns-content-bg;
|
||||
display: flex;
|
||||
height: 100%;
|
||||
}
|
||||
.left {
|
||||
width: 300px;
|
||||
margin-right: @ns-gap;
|
||||
min-width: fit-content;
|
||||
> div {
|
||||
background-color: @white;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.top{
|
||||
position: relative;
|
||||
height: 80%;
|
||||
.ns-form-title{
|
||||
font-weight: bold;
|
||||
user-select: text;
|
||||
padding: 16px;
|
||||
margin-bottom: 16px;
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 1px solid #e9e9e9;
|
||||
}
|
||||
.title{
|
||||
text-align: left;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
font-weight: bold;
|
||||
user-select: text;
|
||||
position: relative;
|
||||
padding-left: 9px;
|
||||
}
|
||||
.title::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
height: 13px;
|
||||
width: 3px;
|
||||
border-radius: 1px;
|
||||
background-color: #2778FF;
|
||||
}
|
||||
}
|
||||
.bottom{
|
||||
position: relative;
|
||||
height: 20%;
|
||||
.ns-form-title{
|
||||
font-weight: bold;
|
||||
user-select: text;
|
||||
padding: 16px;
|
||||
margin-bottom: 16px;
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 1px solid #e9e9e9;
|
||||
}
|
||||
.title{
|
||||
text-align: left;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
font-weight: bold;
|
||||
user-select: text;
|
||||
position: relative;
|
||||
padding-left: 9px;
|
||||
}
|
||||
.title::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
height: 13px;
|
||||
width: 3px;
|
||||
border-radius: 1px;
|
||||
background-color: #2778FF;
|
||||
}
|
||||
.changePage{
|
||||
height: 3vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
.right {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
height: 100%;
|
||||
padding: @ns-gap;
|
||||
background-color: @white;
|
||||
border-radius: @ns-border-radius;
|
||||
box-shadow: @ns-content-box-shadow;
|
||||
.ns-table-title {
|
||||
text-align: left;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
user-select: text;
|
||||
width: 100%;
|
||||
margin-bottom: @ns-gap;
|
||||
}
|
||||
}
|
||||
</style>
|
@@ -0,0 +1,225 @@
|
||||
<template>
|
||||
<!-- 首页 -->
|
||||
<div v-if="isMainPage">
|
||||
<ns-view-list-table v-bind="tableConfig" :model="data" ref="mainRef" />
|
||||
</div>
|
||||
<!-- 填报页 -->
|
||||
<div v-if="fillInPage">
|
||||
<fillIn />
|
||||
</div>
|
||||
<!-- 新增报告弹窗 -->
|
||||
<a-drawer
|
||||
:width="500"
|
||||
:visible="visible"
|
||||
:body-style="{ paddingBottom: '80px' }"
|
||||
:footer-style="{ textAlign: 'right' }"
|
||||
destroyOnClose
|
||||
@close="onClose">
|
||||
<a-form
|
||||
ref="formRef"
|
||||
:model="formState"
|
||||
:rules="rules"
|
||||
:label-col="labelCol"
|
||||
:wrapper-col="wrapperCol"
|
||||
>
|
||||
<a-form-item ref="name" label="报告名称" name="reportName">
|
||||
<a-input v-model:value="formState.reportName" placeholder="请输入报告名称" />
|
||||
</a-form-item>
|
||||
<a-form-item ref="name" label="报告年度" name="reportYear">
|
||||
<a-date-picker v-model:value="formState.reportYear" picker="year" valueFormat="YYYY" />
|
||||
</a-form-item>
|
||||
<a-form-item ref="name" label="适用标准" name="genericStandard">
|
||||
<a-input v-model:value="formState.genericStandard" placeholder="请输入适用标准" />
|
||||
</a-form-item>
|
||||
<a-form-item label="报告周期" name="reportPeriod">
|
||||
<a-select v-model:value="formState.reportPeriod" placeholder="请选择排放类型">
|
||||
<a-select-option value="1">年度</a-select-option>
|
||||
<a-select-option value="2">月度</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
<a-form-item ref="name" label="报告范围" name="reportScope">
|
||||
<a-range-picker v-model:value="formState.reportScope" picker="month" valueFormat="YYYY-MM" />
|
||||
</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>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref,toRaw } from 'vue';
|
||||
import { http } from '/nerv-lib/util/http';
|
||||
import { carbonInventoryCheck } from '/@/api/carbonEmissionFactorLibrary';
|
||||
import fillIn from './fillInPage/index.vue';
|
||||
defineOptions({ name: 'CarbonInventoryCheck' });
|
||||
const orgId = ref('');
|
||||
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||
orgId.value = result;
|
||||
const fetch = (api, params = { orgId }) => {
|
||||
return http.post(api, params);
|
||||
};
|
||||
// 判断展示哪个页面
|
||||
const isMainPage = ref(true);
|
||||
const fillInPage = ref(false);
|
||||
// 新增相关数据
|
||||
const visible = ref(false);
|
||||
const formState = ref({})
|
||||
const formRef = ref();
|
||||
const labelCol = { span: 5 };
|
||||
const wrapperCol = { span: 19 };
|
||||
// 定义form表单的必填
|
||||
const rules: Record<string, Rule[]> = {
|
||||
reportName: [{ required: true, message: '请输入报告名称', trigger: 'change' }],
|
||||
reportYear: [{ required: true, message: '请选择报告年度', trigger: 'change' }],
|
||||
genericStandard: [{ required: true, message: '请输入适用标准', trigger: 'change' }],
|
||||
reportPeriod: [{ required: true, message: '请选择排放类型', trigger: 'change' }],
|
||||
reportScope: [{ required: true, message: '请选择报告范围', trigger: 'change' }],
|
||||
};
|
||||
// 关闭新增抽屉
|
||||
const onClose = () => {
|
||||
visible.value = false;
|
||||
formState.value = {}
|
||||
formRef.value.resetFields();
|
||||
};
|
||||
// 点击确定提交
|
||||
const onSubmit = () => {
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(() => {
|
||||
console.log('values', formState, toRaw(formState));
|
||||
formState.value.enterpriseOrgId = orgId.value
|
||||
formState.value.startTime = formState.value.reportScope[0]
|
||||
formState.value.endTime = formState.value.reportScope[1]
|
||||
fetch(carbonInventoryCheck.createOrUpdate,formState.value).then((res) => {
|
||||
visible.value = false
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
});
|
||||
})
|
||||
.catch(error => {
|
||||
console.log('error', error);
|
||||
});
|
||||
};
|
||||
// 表格相关数据
|
||||
const data = ref([]);
|
||||
const mainRef = ref();
|
||||
const tableConfig = ref({
|
||||
title: '数据库',
|
||||
api: carbonInventoryCheck.carbonInventoryList,
|
||||
params: {
|
||||
orgId
|
||||
},
|
||||
headerActions: [
|
||||
{
|
||||
label: '新增',
|
||||
name: 'userAdd',
|
||||
type: 'primary',
|
||||
handle: () => {
|
||||
visible.value = true
|
||||
},
|
||||
},
|
||||
],
|
||||
columns: [
|
||||
{
|
||||
title: '序号',
|
||||
customRender: (text: any) => {
|
||||
return text.index + 1;
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '企业名称',
|
||||
dataIndex: 'enterpriseName',
|
||||
},
|
||||
{
|
||||
title: '报告名称',
|
||||
dataIndex: 'reportName',
|
||||
},
|
||||
{
|
||||
title: '报告年度',
|
||||
dataIndex: 'reportYear',
|
||||
},
|
||||
{
|
||||
title: '适用标准',
|
||||
dataIndex: 'genericStandard',
|
||||
},
|
||||
{
|
||||
title: '更新人',
|
||||
dataIndex: 'updateUser',
|
||||
},
|
||||
{
|
||||
title: '更新时间',
|
||||
dataIndex: 'updateTime',
|
||||
},
|
||||
],
|
||||
columnActions: {
|
||||
title: '操作',
|
||||
actions: [
|
||||
{
|
||||
label: '编辑',
|
||||
name: 'userEdit',
|
||||
handle: (record: any) => {
|
||||
visible.value = true
|
||||
fetch(carbonInventoryCheck.findById,{id:record.id}).then((res) => {
|
||||
formState.value = res.data
|
||||
formState.value.reportScope = [res.data.startTime,res.data.endTime]
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '填报',
|
||||
name: 'fillIn',
|
||||
handle: (record: any) => {
|
||||
isMainPage.value = false
|
||||
fillInPage.value = true
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '下载',
|
||||
name: 'download',
|
||||
handle: (record: any) => {
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '删除',
|
||||
name: 'userDelete',
|
||||
dynamicParams: { id: 'id' },
|
||||
confirm: true,
|
||||
isReload: true,
|
||||
api: carbonInventoryCheck.delete,
|
||||
},
|
||||
],
|
||||
},
|
||||
formConfig: {
|
||||
schemas: [
|
||||
{
|
||||
field: 'reportName',
|
||||
label: '报告名称',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入报告名称',
|
||||
maxLength: 30,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'reportYear',
|
||||
label: '报告年度',
|
||||
component: 'NsRangePicker',
|
||||
fieldMap: ['startYear', 'endYear'],
|
||||
componentProps: {
|
||||
valueFormat: 'YYYY',
|
||||
placeholder: ['报告年度', '报告年度'],
|
||||
picker:"year"
|
||||
},
|
||||
},
|
||||
],
|
||||
params: {},
|
||||
},
|
||||
rowKey: 'id',
|
||||
});
|
||||
// 填报页
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
|
||||
</style>
|
@@ -0,0 +1,45 @@
|
||||
import { ref } from 'vue';
|
||||
import { origanizemanage } from '/@/api/origanizemanage';
|
||||
import { http } from '/nerv-lib/saas';
|
||||
|
||||
export const mockData = ref([
|
||||
{
|
||||
id: 3,
|
||||
zhanghao: 'axb',
|
||||
name: '张三',
|
||||
sex: '男',
|
||||
phone: '123456789',
|
||||
email: '1234567889',
|
||||
relation: '1',
|
||||
role: '1',
|
||||
status: '1',
|
||||
},
|
||||
]);
|
||||
|
||||
export const mockData2 = ref([
|
||||
{
|
||||
information: '铁路局1/产品部1/产品总监1',
|
||||
},
|
||||
]);
|
||||
|
||||
export const treeData = ref([
|
||||
{
|
||||
title: '铁路总局',
|
||||
key: '0-0',
|
||||
children: [
|
||||
{ title: '济阳站', key: '0-0-0' },
|
||||
{ title: '临沂站', key: '0-0-1' },
|
||||
],
|
||||
},
|
||||
]);
|
||||
|
||||
export const treeData2 = [
|
||||
{
|
||||
title: '全部',
|
||||
key: '0-0',
|
||||
children: [
|
||||
{ title: '产品部', key: '0-0-0' },
|
||||
{ title: '运维部', key: '0-0-1' },
|
||||
],
|
||||
},
|
||||
];
|
@@ -3,6 +3,7 @@
|
||||
right: 496px;
|
||||
width: 500px;
|
||||
height: 100%;
|
||||
z-index: 99;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
margin: auto;
|
||||
@@ -12,6 +13,7 @@
|
||||
display: flex;
|
||||
padding: 25px;
|
||||
flex-direction: column;
|
||||
transition: all ease 0.5s;
|
||||
.content {
|
||||
overflow-y: scroll;
|
||||
.div-operation {
|
||||
@@ -138,4 +140,11 @@
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fade-enter-active, .fade-leave-active {
|
||||
transform: translateX(0px);
|
||||
}
|
||||
.fade-enter-from, .fade-leave-to {
|
||||
transform: translateX(496px);
|
||||
}
|
@@ -1,7 +1,5 @@
|
||||
// 页面容器
|
||||
.lighting-box {
|
||||
// width: 100%;
|
||||
// height: 100%;
|
||||
position: relative;
|
||||
// background: linear-gradient(#badaff, #8cabeb, #7095de);
|
||||
// 照明设备功能总容器
|
||||
@@ -47,32 +45,46 @@
|
||||
height: 240px;
|
||||
transform: rotateX(79deg) rotateZ(-22deg) skew(29deg);
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
gap: 5px;
|
||||
.area1 {
|
||||
width: 170px;
|
||||
width: 70px;
|
||||
background: rgba(0, 251, 91, 0.3);
|
||||
border: 2px solid rgb(0, 251, 91);
|
||||
display: flex;
|
||||
}
|
||||
.area2 {
|
||||
width: 240px;
|
||||
width: 200px;
|
||||
background: rgba(255, 165, 0, 0.3);
|
||||
border: 2px solid rgb(255, 165, 0);
|
||||
display: flex;
|
||||
}
|
||||
.area3 {
|
||||
width: 110px;
|
||||
width: 120px;
|
||||
background: rgba(255, 0, 0, 0.3);
|
||||
border: 2px solid rgb(255, 0, 0);
|
||||
display: flex;
|
||||
}
|
||||
.area4 {
|
||||
flex: 1;
|
||||
width: 70px;
|
||||
background: rgba(80, 236, 244, 0.3);
|
||||
border: 2px solid rgb(80, 236, 244);
|
||||
display: flex;
|
||||
}
|
||||
// .area-item:hover {
|
||||
// transform: scale(1.05);
|
||||
// }
|
||||
.area5 {
|
||||
flex: 1;
|
||||
background: rgba(0, 251, 91, 0.3);
|
||||
border: 2px solid rgb(0, 251, 91);
|
||||
display: flex;
|
||||
}
|
||||
.area6 {
|
||||
flex: 1;
|
||||
background: rgba(255, 165, 0, 0.3);
|
||||
border: 2px solid rgb(255, 165, 0);
|
||||
display: flex;
|
||||
}
|
||||
.area-item:hover {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
.area-item {
|
||||
cursor: pointer;
|
||||
transition: all ease 0.2s;
|
||||
@@ -82,37 +94,16 @@
|
||||
display:flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
.group-shadow1 {
|
||||
width: 35px;
|
||||
height: 150px;
|
||||
box-sizing: border-box;
|
||||
padding: 10px;
|
||||
// border: 2px solid red;
|
||||
.shadow-box {
|
||||
width: 30px;
|
||||
height: 200px;
|
||||
border-radius: 20px;
|
||||
background: rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.group-shadow2 {
|
||||
width: 35px;
|
||||
height: 180px;
|
||||
border-radius: 20px;
|
||||
background: rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.group-shadow3 {
|
||||
width: 40px;
|
||||
height: 180px;
|
||||
border-radius: 20px;
|
||||
background: rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.group-shadow4 {
|
||||
width: 40px;
|
||||
height: 160px;
|
||||
border-radius: 20px;
|
||||
background: rgba(0, 0, 0, 0.1);
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
}
|
||||
// .group-shadow {
|
||||
// transition: all ease 0.2s;
|
||||
// }
|
||||
// .group-shadow:hover {
|
||||
// transform: scale(1.05);
|
||||
// }
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@@ -3,25 +3,31 @@
|
||||
<div class="lighting-img-box">
|
||||
<!-- 左上角,区域切换 -->
|
||||
<div class="btn-box">
|
||||
<button class="btn-item" @click=changeArea(1)>1F</button>
|
||||
<button class="btn-item" @click=changeArea(2)>2F</button>
|
||||
<button class="btn-item" @click=changeArea(3)>站台</button>
|
||||
<button class="btn-item" @click=changeFloor(1)>1F</button>
|
||||
<button class="btn-item" @click=changeFloor(2)>2F</button>
|
||||
</div>
|
||||
<!-- 楼层区域 -->
|
||||
<div class="area">
|
||||
<div
|
||||
v-for="(item, index) in treeData"
|
||||
:class="computedClass(String(item.id))"
|
||||
@click="getArea(item)"
|
||||
:class="computedClass(item.id)"
|
||||
@click="changeThisArea([item])"
|
||||
:key="index">
|
||||
<div v-for="(v, i) in item.children" :key="i" class="light-group">
|
||||
<div class="group-shadow group-shadow1" :class="computedClass(v.id)" @click.stop="getArea(v)"></div>
|
||||
<div class="group-shadow" @click.stop="changeThisArea([item, v])">
|
||||
<div :class="computedClass(v.id)" class="shadow-box"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 照明设备 -->
|
||||
<div class="lights">
|
||||
<light v-for="(item, index) in bulbs" :key="index" :styleObject="item.styleText" :type="item.type" :visible="item.visible"></light>
|
||||
<light v-for="(item, index) in bulbs"
|
||||
:key="index"
|
||||
:styleObject="item.styleText"
|
||||
:type="item.type"
|
||||
:visible="item.visible">
|
||||
</light>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 右侧抽屉的触发按钮 -->
|
||||
@@ -44,7 +50,7 @@
|
||||
:maskStyle="{ 'background-color': 'rgba(0, 0, 0, 0)' }">
|
||||
<a-tabs v-model:activeKey="activeKey">
|
||||
<a-tab-pane key="1" tab="控制面板">
|
||||
<tabs1 @changeArea="getArea" :treeData="treeData"></tabs1>
|
||||
<tabs1 @changeArea="changeArea" :treeData="treeData" :nowArea="nowArea"></tabs1>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="计划列表" force-render>
|
||||
<tabs2></tabs2>
|
||||
@@ -59,94 +65,170 @@
|
||||
|
||||
<script setup lang="ts">
|
||||
|
||||
import { ref } from 'vue';
|
||||
import { treeData } from './treeData'
|
||||
import { ref, onMounted } from 'vue';
|
||||
// 组件
|
||||
import light from './light.vue';
|
||||
import tabs1 from './tabs1.vue'
|
||||
import tabs2 from './tabs2.vue'
|
||||
import tabs3 from './tabs3.vue'
|
||||
// 请求
|
||||
import { http } from '/nerv-lib/util/http';
|
||||
import { lightingManage } from '/@/api/IlluminationInfo';
|
||||
// ICON
|
||||
import {
|
||||
DoubleLeftOutlined,
|
||||
DoubleRightOutlined
|
||||
} from '@ant-design/icons-vue';
|
||||
} from '@ant-design/icons-vue';
|
||||
|
||||
// 分区 - 当前选择的分区序号 - 默认选择一区
|
||||
// 类声明 =======================================================
|
||||
|
||||
interface items {
|
||||
id: string,
|
||||
|
||||
}
|
||||
|
||||
// 初始化 =======================================================
|
||||
|
||||
onMounted(() => {
|
||||
http.post(lightingManage.getArea, { floor: '1', siteId: '10000001' }).then(res => {
|
||||
const data = res.data
|
||||
/** 由前端创建的,只在前端使用的变量
|
||||
* @param id 用于判断样式和层级的前端属性
|
||||
* @param selected 用于表示是否选中的前端属性
|
||||
*/
|
||||
data.forEach((item, index) => {
|
||||
if (index == 0) {
|
||||
item.selected = true
|
||||
} else {
|
||||
item.selected = false
|
||||
}
|
||||
item.id = String(index + 1)
|
||||
item.children = []
|
||||
// deviceGroup后端返回了对象,此处转化为数组
|
||||
let i = 1;
|
||||
for (let obj in item.deviceGroup) {
|
||||
item.deviceGroup[obj].selected = false
|
||||
item.deviceGroup[obj].id = String((index + 1) + '-' + i++)
|
||||
item.children.push(item.deviceGroup[obj])
|
||||
}
|
||||
})
|
||||
treeData.value = data
|
||||
})
|
||||
})
|
||||
|
||||
// 分层业务 =====================================================
|
||||
|
||||
// 左上角分层切换
|
||||
const changeFloor = (area: number) => {
|
||||
if (area == 1) {
|
||||
console.log('1F')
|
||||
} else if (area == 2) {
|
||||
console.log('2F')
|
||||
}
|
||||
}
|
||||
|
||||
// 分区业务 =====================================================
|
||||
|
||||
// 分区结构树
|
||||
const treeData = ref([])
|
||||
// 当前选中的分区id
|
||||
const nowArea = ref('1')
|
||||
// 当前选中的分区序号 - 用于样式渲染
|
||||
const area = ref(['1'])
|
||||
// 分区 - 分区小灯泡 - 此处位置需前端写死
|
||||
// 线路内小灯泡 - 此处位置需前端写死
|
||||
const bulbs = ref([
|
||||
{
|
||||
styleText: { left: '190px', bottom: '200px' },
|
||||
styleText: { left: '180px', bottom: '200px' },
|
||||
area: 1,
|
||||
type: 1,
|
||||
visible: true
|
||||
},
|
||||
{
|
||||
styleText: { left: '245px', bottom: '125px' },
|
||||
styleText: { left: '230px', bottom: '125px' },
|
||||
area: 1,
|
||||
type: 2,
|
||||
visible: true
|
||||
},
|
||||
{
|
||||
styleText: { left: '355px', bottom: '160px' },
|
||||
styleText: { left: '320px', bottom: '140px' },
|
||||
area: 1,
|
||||
type: 3,
|
||||
visible: true
|
||||
},
|
||||
{
|
||||
styleText: { left: '295px', bottom: '230px' },
|
||||
styleText: { left: '245px', bottom: '230px' },
|
||||
area: 1,
|
||||
type: 3,
|
||||
visible: true
|
||||
},
|
||||
{
|
||||
styleText: { left: '425px', bottom: '230px' },
|
||||
styleText: { left: '405px', bottom: '230px' },
|
||||
area: 2,
|
||||
type: 3,
|
||||
visible: true
|
||||
},
|
||||
{
|
||||
styleText: { left: '470px', bottom: '190px' },
|
||||
styleText: { left: '460px', bottom: '180px' },
|
||||
area: 2,
|
||||
type: 3,
|
||||
visible: true
|
||||
},
|
||||
{
|
||||
styleText: { left: '380px', bottom: '275px' },
|
||||
styleText: { left: '360px', bottom: '275px' },
|
||||
area: 2,
|
||||
type: 3,
|
||||
visible: true
|
||||
},
|
||||
{
|
||||
styleText: { left: '700px', bottom: '320px' },
|
||||
styleText: { left: '715px', bottom: '320px' },
|
||||
area: 3,
|
||||
type: 1,
|
||||
visible: true
|
||||
},
|
||||
])
|
||||
|
||||
// 分区 - 左上角分区切换
|
||||
const changeArea = (area: number) => {
|
||||
if (area == 1) {
|
||||
console.log('1F')
|
||||
} else if (area == 2) {
|
||||
console.log('2F')
|
||||
} else if (area == 3) {
|
||||
console.log('站台')
|
||||
}
|
||||
}
|
||||
// 分区 - 单个分区切换
|
||||
const getArea = (result: any) => {
|
||||
// 如果传入的值是数组
|
||||
// 由子组件控制的分区与线路切换
|
||||
const changeArea = (result: any) => {
|
||||
console.log(result,'changeArea')
|
||||
// 数组
|
||||
if (Array.isArray(result)) {
|
||||
area.value = result
|
||||
// 如果不是数组
|
||||
// 不是数组
|
||||
} else {
|
||||
area.value.length = 0
|
||||
area.value[0] = String(result)
|
||||
}
|
||||
}
|
||||
// 分区 - 样式函数
|
||||
// 由当前组件控制的分区切换
|
||||
const changeThisArea = (result: any) => {
|
||||
console.log(result, 'changeThisArea')
|
||||
// 修改前,将所有选项置空
|
||||
reset()
|
||||
let level1 = result[0];
|
||||
area.value.length = 0
|
||||
if (result.length === 1) {
|
||||
result[0].selected = true
|
||||
area.value.push(result[0].id)
|
||||
} else if (result.length === 2) {
|
||||
// 如果没有分区,默认选择第一个
|
||||
if (!level1) {
|
||||
level1 = treeData.value[0]
|
||||
}
|
||||
// 选中状态都设为true
|
||||
level1.selected = result[1].selected = true
|
||||
area.value.splice(0, 0, level1.id, result[1].id)
|
||||
}
|
||||
nowArea.value = level1.id
|
||||
}
|
||||
// 重置分区树所有当前选项
|
||||
const reset = () => {
|
||||
treeData.value.forEach(item => {
|
||||
item.selected = false
|
||||
item.children.forEach(i => {
|
||||
i.selected = false
|
||||
})
|
||||
})
|
||||
}
|
||||
// 俯视图分区选中计算函数
|
||||
const computedClass = (string: string) => {
|
||||
if (area.value.indexOf(string) != -1) {
|
||||
return `isActive area-item area${string}`
|
||||
@@ -154,6 +236,9 @@ const computedClass = (string: string) => {
|
||||
return `area-item area${string}`
|
||||
}
|
||||
}
|
||||
|
||||
// 抽屉业务 =====================================================
|
||||
|
||||
// 抽屉 - 当前选择的tab
|
||||
let activeKey = ref('1');
|
||||
// 抽屉 - 打开状态
|
||||
@@ -166,9 +251,11 @@ const toggleDrawer = () => {
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
@import "./index.less";
|
||||
// 当前选中分区的样式
|
||||
.isActive {
|
||||
border: 3px solid white !important;
|
||||
}
|
||||
// 抽屉顶部tab按钮样式
|
||||
:deep(.ant-tabs-tab-btn) {
|
||||
color: white;
|
||||
}
|
||||
|
@@ -0,0 +1,439 @@
|
||||
// 抽屉
|
||||
.drawer-item {
|
||||
|
||||
.light-area,
|
||||
.circuit-area,
|
||||
.control-area,
|
||||
.control-scene-area,
|
||||
.light-parameters-area {
|
||||
width: 100%;
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.light-area-tab,
|
||||
.circuit-tab,
|
||||
.control-tab,
|
||||
.control-scene-tab,
|
||||
.light-parameters-tab {
|
||||
width: 5px;
|
||||
height: 23px;
|
||||
opacity: 1;
|
||||
background: rgba(26, 174, 251, 1);
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
.light-area-text,
|
||||
.circuit-text,
|
||||
.control-text,
|
||||
.control-scene-text,
|
||||
.light-parameters-text {
|
||||
font-size: 14px;
|
||||
color: white;
|
||||
padding-left: 5px;
|
||||
line-height: 23px;
|
||||
width: 110px;
|
||||
height: 23px;
|
||||
background: linear-gradient(270deg, rgba(86, 221, 253, 0) 0%, rgba(25, 176, 255, 1) 100%);
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.light-area-tab,
|
||||
.light-area-text {
|
||||
display: inline-block;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.plan.enabled {
|
||||
border: none;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
border-radius: 5px;
|
||||
vertical-align: top;
|
||||
margin-left: 235px;
|
||||
width: 88px;
|
||||
height: 32px;
|
||||
background: linear-gradient(180deg, rgba(103, 222, 0, 1) 0%, rgba(0, 181, 6, 1) 100%);
|
||||
color: white;
|
||||
}
|
||||
|
||||
.plan.disabled {
|
||||
border: none;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
border-radius: 5px;
|
||||
color: white;
|
||||
vertical-align: top;
|
||||
margin-left: 235px;
|
||||
width: 88px;
|
||||
height: 32px;
|
||||
background-color: red;
|
||||
}
|
||||
|
||||
.plan:disabled {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.openPlan.enabled2 {
|
||||
border: none;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
border-radius: 5px;
|
||||
color: white;
|
||||
vertical-align: top;
|
||||
width: 88px;
|
||||
height: 32px;
|
||||
background: linear-gradient(180deg, rgba(103, 222, 0, 1) 0%, rgba(0, 181, 6, 1) 100%);
|
||||
color: white;
|
||||
}
|
||||
|
||||
.openPlan.disabled2 {
|
||||
border: none;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
border-radius: 5px;
|
||||
color: white;
|
||||
vertical-align: top;
|
||||
width: 88px;
|
||||
height: 32px;
|
||||
background-color: red;
|
||||
}
|
||||
|
||||
.openPlan:disabled {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.btn2 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 80px;
|
||||
}
|
||||
|
||||
.openzm {
|
||||
cursor: pointer;
|
||||
color: rgba(34, 183, 255, 1);
|
||||
margin-left: 20px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.custom-checkbox {
|
||||
width: 13px;
|
||||
height: 13px;
|
||||
}
|
||||
|
||||
.both {
|
||||
width: 59.79px;
|
||||
height: 32px;
|
||||
opacity: 1;
|
||||
background: linear-gradient(180deg,
|
||||
rgba(255, 187, 0, 1) 0%,
|
||||
rgba(255, 112, 3, 1) 91.21%,
|
||||
rgba(255, 129, 3, 1) 100%);
|
||||
margin-left: 8px;
|
||||
font-size: 12px;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.btn2 {
|
||||
button {
|
||||
margin: 0 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.allBtn {
|
||||
border: 0;
|
||||
width: 40px;
|
||||
color: white;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.blue-background.ant-switch-checked {
|
||||
background-color: linear-gradient(180deg,
|
||||
rgba(1, 206, 255, 1) 0%,
|
||||
rgba(0, 150, 229, 1) 100%) !important;
|
||||
}
|
||||
|
||||
.grey-background.ant-switch {
|
||||
background-color: grey !important;
|
||||
}
|
||||
|
||||
.blue-background.ant-switch-checked .ant-switch-handle {
|
||||
background-color: linear-gradient(180deg,
|
||||
rgba(1, 206, 255, 1) 0%,
|
||||
rgba(0, 150, 229, 1) 100%) !important;
|
||||
}
|
||||
|
||||
.grey-background.ant-switch .ant-switch-handle {
|
||||
background-color: grey !important;
|
||||
}
|
||||
|
||||
p {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.area,
|
||||
.btnArea,
|
||||
.control-mode-btn-area,
|
||||
.control-scene-btn-area {
|
||||
margin-left: -17px;
|
||||
|
||||
button {
|
||||
width: 21%;
|
||||
padding: 0 2%;
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
width: 92px;
|
||||
height: 40px;
|
||||
border-radius: 4px;
|
||||
opacity: 1;
|
||||
margin-top: 10px;
|
||||
margin-left: 17px;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
opacity: 1;
|
||||
border: 1px solid rgba(207, 212, 219, 1);
|
||||
line-height: 20.27px;
|
||||
color: white;
|
||||
text-align: center;
|
||||
vertical-align: top;
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.selected {
|
||||
background: linear-gradient(180deg, rgba(201, 245, 255, 1) 0%, rgba(138, 215, 255, 1) 100%);
|
||||
color: rgba(0, 61, 90, 1);
|
||||
border: 1px solid white;
|
||||
}
|
||||
|
||||
.btn:hover {
|
||||
background-color: rgba(207, 212, 219, 1);
|
||||
}
|
||||
|
||||
.btn:active {
|
||||
background-color: rgba(102, 102, 102, 1);
|
||||
color: white;
|
||||
}
|
||||
|
||||
.circuit-area,
|
||||
.control-scene-area,
|
||||
.light-parameters-area {
|
||||
left: 51px;
|
||||
width: 100%;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.circuit-tab,
|
||||
.circuit-text {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.batch {
|
||||
width: 60px;
|
||||
height: 32px;
|
||||
opacity: 1;
|
||||
border: 1px solid rgba(67, 136, 251, 1);
|
||||
color: rgba(67, 136, 251, 1);
|
||||
border-radius: 5px;
|
||||
background-color: white;
|
||||
margin-left: 11px;
|
||||
}
|
||||
|
||||
.control-area {
|
||||
left: 51px;
|
||||
width: 100%;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.control-tab,
|
||||
.control-text {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
:deep(.cell) {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
:deep(#pane-first) {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.control-scene-tab,
|
||||
.control-scene-text {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.light-parameters-tab,
|
||||
.light-parameters-text {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.light-parameters-textarea>p {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
border: 1px solid rgba(236, 239, 245, 1);
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.bottom {
|
||||
width: 100%;
|
||||
height: 64px;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.execute {
|
||||
margin-right: 20px;
|
||||
width: 74px;
|
||||
height: 40px;
|
||||
opacity: 1;
|
||||
cursor: pointer;
|
||||
border-radius: 4px;
|
||||
background: rgba(67, 136, 251, 1);
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: white;
|
||||
border: 0;
|
||||
margin: 0 10px;
|
||||
}
|
||||
|
||||
.flushed {
|
||||
width: 74px;
|
||||
height: 40px;
|
||||
cursor: pointer;
|
||||
opacity: 1;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: rgba(102, 102, 102, 1);
|
||||
background: white;
|
||||
border: 1px solid rgba(193, 197, 204, 1);
|
||||
margin: 0 10px;
|
||||
}
|
||||
|
||||
:deep(.ant-table-pagination) {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.drawer-content {
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
.arrow-indicator {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 0;
|
||||
transform: translateY(-50%);
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.drawer-title1 {
|
||||
position: fixed;
|
||||
width: 33px;
|
||||
height: 33px;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 20px;
|
||||
margin: auto;
|
||||
z-index: 99999;
|
||||
}
|
||||
|
||||
.drawer-title2 {
|
||||
position: fixed;
|
||||
width: 33px;
|
||||
height: 33px;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 495px;
|
||||
margin: auto;
|
||||
z-index: 99999;
|
||||
}
|
||||
|
||||
.arrowbtn {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
background: rgba(0, 0, 0, 1);
|
||||
opacity: 0.5;
|
||||
border: none;
|
||||
}
|
||||
|
||||
:deep(.ant-tabs-tab-btn) {
|
||||
color: white;
|
||||
}
|
||||
|
||||
:deep(.ant-table) {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
:deep(.ant-table-bordered) {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
:deep(.ant-table-thead) {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
:deep(.ant-table-cell) {
|
||||
background-color: transparent;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.custom-table {
|
||||
border-collapse: collapse;
|
||||
width: 416px;
|
||||
height: 60px;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
}
|
||||
|
||||
.custom-table th,
|
||||
.custom-table td {
|
||||
border: 1px solid rgba(163, 192, 243, 1);
|
||||
text-align: left;
|
||||
padding: 8px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.table1 {
|
||||
margin-top: 20px;
|
||||
width: 100%;
|
||||
cellspacing: 0;
|
||||
cellpadding: 0;
|
||||
border: 1px solid rgba(255, 255, 255);
|
||||
border-radius: 5px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.light-area,
|
||||
.circuit-area,
|
||||
.control-area,
|
||||
.control-scene-area,
|
||||
.light-parameters-area {
|
||||
width: 100%;
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.zmhlbtn {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
// 禁用图标
|
||||
.anticon-stop {
|
||||
position: absolute;
|
||||
right: 3px;
|
||||
bottom: 3px;
|
||||
}
|
||||
}
|
File diff suppressed because it is too large
Load Diff
@@ -14,29 +14,29 @@
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(row, index) in dataSource" :key="index">
|
||||
<td>{{ row.key }}</td>
|
||||
<td>{{ row.data }}</td>
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>{{ row.startTime }}</td>
|
||||
<td>{{ row.planName }}</td>
|
||||
<td v-if="row.status === '待执行'">
|
||||
<td v-if="row.planStatus == '2'">
|
||||
<button
|
||||
style="
|
||||
font-size: 12px;
|
||||
background: rgba(57, 215, 187, 0.1);
|
||||
color: rgb(57, 215, 187);
|
||||
border: 1px solid rgb(57, 215, 187);
|
||||
font-size: 12px;
|
||||
background: rgba(57, 215, 187, 0.1);
|
||||
color: rgb(57, 215, 187);
|
||||
border: 1px solid rgb(57, 215, 187);
|
||||
">
|
||||
{{ row.status }}
|
||||
已执行
|
||||
</button>
|
||||
</td>
|
||||
<td v-if="row.status !== '待执行'">
|
||||
<td v-if="row.planStatus == '1'">
|
||||
<button
|
||||
style="
|
||||
font-size: 12px;
|
||||
background: rgba(243, 97, 99, 0.1);
|
||||
border: 1px solid rgba(243, 97, 99);
|
||||
color: rgba(243, 97, 99);
|
||||
font-size: 12px;
|
||||
background: rgba(243, 97, 99, 0.1);
|
||||
border: 1px solid rgba(243, 97, 99);
|
||||
color: rgba(243, 97, 99);
|
||||
">
|
||||
{{ row.status }}
|
||||
待执行
|
||||
</button>
|
||||
</td>
|
||||
<td>
|
||||
@@ -73,41 +73,53 @@
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted } from 'vue';
|
||||
// 请求
|
||||
import { http } from '/nerv-lib/util/http';
|
||||
import { lightingManage } from '/@/api/IlluminationInfo';
|
||||
|
||||
// 初始化 ===========================================================
|
||||
|
||||
// 初始化
|
||||
onMounted(() => {
|
||||
|
||||
getTable()
|
||||
getLeftPlan()
|
||||
})
|
||||
|
||||
// tab页部分 ========================================================
|
||||
|
||||
// 表格数据
|
||||
const dataSource = ref([
|
||||
{
|
||||
key: '1',
|
||||
data: '2024-05-01',
|
||||
planName: '劳动节',
|
||||
status: '暂停中',
|
||||
},
|
||||
{
|
||||
key: '2',
|
||||
data: '2024-05-01',
|
||||
planName: '国庆节',
|
||||
status: '待执行',
|
||||
},
|
||||
{
|
||||
key: '3',
|
||||
data: '2024-05-01',
|
||||
planName: '元旦',
|
||||
status: '待执行',
|
||||
},
|
||||
]);
|
||||
const addVisible = ref<boolean>(false);
|
||||
const dataSource = ref([]);
|
||||
// 获得表格数据
|
||||
const getTable = () => {
|
||||
http.get(lightingManage.getPlanTable, {}).then(res => {
|
||||
dataSource.value = res.data
|
||||
})
|
||||
}
|
||||
|
||||
// tab页弹窗部分 ====================================================
|
||||
|
||||
// 添加弹窗控制变量
|
||||
const addVisible = ref(false);
|
||||
// 打开弹窗
|
||||
const addModal = () => {
|
||||
addVisible.value = true;
|
||||
};
|
||||
|
||||
// 穿梭框部分 =======================================================
|
||||
|
||||
// 穿梭框数据
|
||||
const transferData = ref([])
|
||||
// 获得穿梭框原始数据
|
||||
const getLeftPlan = () => {
|
||||
http.get(lightingManage.getLeftPlan, {}).then(res => {
|
||||
console.log(res)
|
||||
})
|
||||
}
|
||||
|
||||
// 操作日志
|
||||
const handleRefClick1 = () => {
|
||||
alert(111)
|
||||
};
|
||||
const addModal = () => {
|
||||
addVisible.value = true;
|
||||
};
|
||||
|
||||
const handleChange = (keys: string[], direction: string, moveKeys: string[]) => {
|
||||
console.log(keys, direction, moveKeys);
|
||||
};
|
||||
@@ -138,8 +150,6 @@ const mockData = ref([
|
||||
]);
|
||||
const targetKeys = ref<string[]>([]);
|
||||
const filterOption = (inputValue: string, option: MockData) => {
|
||||
console.log(option.description);
|
||||
|
||||
return option.description.indexOf(inputValue) > -1;
|
||||
};
|
||||
|
||||
@@ -200,6 +210,7 @@ const filterOption = (inputValue: string, option: MockData) => {
|
||||
letter-spacing: 0;
|
||||
line-height: 20px;
|
||||
color: rgba(67, 136, 251, 1);
|
||||
cursor: pointer;
|
||||
}
|
||||
.tabReboot {
|
||||
margin-right: 8px;
|
||||
|
@@ -18,19 +18,19 @@
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="out-dialog" v-if="logModalVisible">
|
||||
|
||||
<div class="out-dialog" :class="{ 'showDialog' : logModalVisible }" v-if="logModalVisible">
|
||||
<div class="content" v-if="logModalVisible">
|
||||
<div>
|
||||
<div class="div-operation"></div>
|
||||
<span class="text-operation">变更内容 </span>
|
||||
<span class="text-operation">操作日志 </span>
|
||||
</div>
|
||||
<div class="jbox" v-for="item in cxList" :key="item.id">
|
||||
<div class="j-box" v-for="item in cxList" :key="item.id">
|
||||
<div class="journal" style="margin-top: 20px">
|
||||
<div class="imgText">
|
||||
<div class="zjzm">
|
||||
<img class="title-img" src="/asset/image//bulbLogo/21961.png" alt="" />
|
||||
<span class="title-text" style="font-size: 20px; font-weight: 500; color: rgba(255, 255, 255, 1)">{{
|
||||
item.name }}</span>
|
||||
<span class="title-text" style="font-size: 20px; font-weight: 500; color: rgba(255, 255, 255, 1)">{{ item.name }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn-box">
|
||||
@@ -180,7 +180,6 @@ const handleRowClick = (index: any) => {
|
||||
|
||||
// 右下角添加按钮
|
||||
.div-add {
|
||||
|
||||
height: 64px;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
@@ -199,6 +198,7 @@ const handleRowClick = (index: any) => {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
|
@@ -237,4 +237,11 @@
|
||||
.common-style;
|
||||
}
|
||||
}
|
||||
|
||||
.tree,
|
||||
:deep(.ns-table-search),
|
||||
// :deep(.ns-list-table),
|
||||
:deep(.ns-table-main) {
|
||||
box-shadow: @ns-content-box-shadow;
|
||||
}
|
||||
</style>
|
||||
|
@@ -1,3 +1,4 @@
|
||||
import { device } from './../../../api/deviceManage';
|
||||
import { dateUtil } from '/nerv-lib/util/date-util';
|
||||
import { device } from '/@/api/deviceManage';
|
||||
import { ref } from 'vue';
|
||||
@@ -14,7 +15,7 @@ export const tableConfig = (orgId) => {
|
||||
title: '设备类别',
|
||||
},
|
||||
params: { orgId },
|
||||
dynamicParams: 'code',
|
||||
dynamicParams: { deviceCode: 'code' },
|
||||
defaultExpandAll: true,
|
||||
api: device.queryDeviceTree,
|
||||
fieldNames: { title: 'deviceType', key: 'code' },
|
||||
|
@@ -13,4 +13,10 @@
|
||||
name: 'LedgerIndex', // 与页面路由name一致缓存才可生效
|
||||
});
|
||||
</script>
|
||||
<style lang="less" scoped></style>
|
||||
<style lang="less" scoped>
|
||||
:deep(.ns-table-search),
|
||||
:deep(.ns-part-tree),
|
||||
:deep(.ns-table-main) {
|
||||
box-shadow: @ns-content-box-shadow;
|
||||
}
|
||||
</style>
|
||||
|
@@ -145,7 +145,7 @@
|
||||
<ns-button type="primary" @click="CancelUser">取消</ns-button>
|
||||
<ns-button
|
||||
v-if="roleDisabled"
|
||||
:disabled="!roleTreeData?.length"
|
||||
:disabled="!selectRoleRef || !roleTreeData?.length"
|
||||
type="primary"
|
||||
@click="rolePipe(roleEdit, false, false)">
|
||||
编辑
|
||||
@@ -194,10 +194,10 @@
|
||||
const selectRoleRef = ref();
|
||||
const formSchema = formConfig(disabled as any);
|
||||
const formSchema2 = formConfig2(roleDisabled as any);
|
||||
const { orgName, projectId, orgId } = JSON.parse(
|
||||
const { orgName, projectId } = JSON.parse(
|
||||
sessionStorage.getItem(import.meta.env.VITE_PUBLIC_PATH),
|
||||
);
|
||||
// const orgId = JSON.parse(sessionStorage.getItem('ORGID'));
|
||||
const orgId = JSON.parse(sessionStorage.getItem('ORGID'));
|
||||
const roleTreeData = ref([]);
|
||||
const rolePermissionTreeData = ref([]);
|
||||
const deptTreeData = ref([]);
|
||||
@@ -501,6 +501,7 @@
|
||||
roleFormData.value = {};
|
||||
opMap.type = '';
|
||||
opMap.fuc = '';
|
||||
selectRoleRef.value = '';
|
||||
roleDisabled.value = true;
|
||||
};
|
||||
|
||||
@@ -627,6 +628,7 @@
|
||||
roleActiveKey.value = 1;
|
||||
// 需要重置数据
|
||||
clearDeptData();
|
||||
clearRoleData();
|
||||
const { selected } = info;
|
||||
if (!selectedKeys?.length) return;
|
||||
|
||||
@@ -686,7 +688,7 @@
|
||||
roleFormData.value = cloneDeep(info.node.dataRef);
|
||||
roleCheckedKeys.value = [];
|
||||
if (selectRoleRef.value?.proleId) {
|
||||
// 查询子部门
|
||||
// 查询子角色
|
||||
getRolesonPermissionTree({ roleId: selectRoleRef.value?.proleId });
|
||||
} else {
|
||||
getRolePermissionTree({ deptId: selectRef.value.deptInfo.deptId });
|
||||
@@ -723,6 +725,13 @@
|
||||
deptPermission().then(() => {
|
||||
clearDeptData();
|
||||
disabled.value = true;
|
||||
// 部门权限修改后更新角色树
|
||||
if (selectRoleRef.value?.proleId) {
|
||||
// 查询子角色
|
||||
getRolesonPermissionTree({ roleId: selectRoleRef.value?.proleId });
|
||||
} else {
|
||||
getRolePermissionTree({ deptId: selectRef.value.deptInfo.deptId });
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
@@ -816,7 +825,7 @@
|
||||
padding: @ns-gap;
|
||||
background-color: @white;
|
||||
border-radius: @ns-border-radius;
|
||||
// box-shadow: @ns-content-box-shadow;
|
||||
box-shadow: @ns-content-box-shadow;
|
||||
}
|
||||
|
||||
.tree {
|
||||
|
@@ -4,100 +4,91 @@ import { origanizemanage } from '/@/api/origanizemanage';
|
||||
export const formConfig = (disabled) => {
|
||||
return ref([
|
||||
{
|
||||
field: 'field111',
|
||||
component: 'NsChildForm',
|
||||
label: '账号',
|
||||
field: 'accountNo',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
title: '用户信息',
|
||||
schemas: [
|
||||
{
|
||||
label: '账号',
|
||||
field: 'accountNo',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入账号',
|
||||
maxLength: 20,
|
||||
disabled,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入账号',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '姓名',
|
||||
field: 'realName',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入姓名',
|
||||
maxLength: 20,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入姓名',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '性别',
|
||||
field: 'sex',
|
||||
component: 'NsRadioGroup',
|
||||
defaultValue: '男',
|
||||
componentProps: {
|
||||
radioType: 'radio',
|
||||
options: [
|
||||
{ label: '男', value: '男' },
|
||||
{ label: '女', value: '女' },
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '手机号',
|
||||
field: 'telephone',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入手机号',
|
||||
maxLength: 11,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入正确手机号格式',
|
||||
pattern: /^[1][3-9][0-9]{9}$/,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '邮箱',
|
||||
field: 'email',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入邮箱',
|
||||
maxLength: 30,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
pattern: /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/,
|
||||
message: '请输入正确的邮箱格式',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '组织关系',
|
||||
field: 'orgName',
|
||||
component: 'NsInput',
|
||||
defaultValue: JSON.parse(sessionStorage.getItem(import.meta.env.VITE_PUBLIC_PATH)).orgName,
|
||||
componentProps: {
|
||||
disabled: true,
|
||||
maxLength: 30,
|
||||
},
|
||||
},
|
||||
placeholder: '请输入账号',
|
||||
maxLength: 20,
|
||||
disabled,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入账号',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '姓名',
|
||||
field: 'realName',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入姓名',
|
||||
maxLength: 20,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入姓名',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '性别',
|
||||
field: 'sex',
|
||||
component: 'NsRadioGroup',
|
||||
defaultValue: '男',
|
||||
componentProps: {
|
||||
radioType: 'radio',
|
||||
options: [
|
||||
{ label: '男', value: '男' },
|
||||
{ label: '女', value: '女' },
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '手机号',
|
||||
field: 'telephone',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入手机号',
|
||||
maxLength: 11,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入正确手机号格式',
|
||||
pattern: /^[1][3-9][0-9]{9}$/,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '邮箱',
|
||||
field: 'email',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入邮箱',
|
||||
maxLength: 30,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
pattern: /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/,
|
||||
message: '请输入正确的邮箱格式',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '组织关系',
|
||||
field: 'orgName',
|
||||
component: 'NsInput',
|
||||
defaultValue: JSON.parse(sessionStorage.getItem(import.meta.env.VITE_PUBLIC_PATH)).orgName,
|
||||
componentProps: {
|
||||
disabled: true,
|
||||
maxLength: 30,
|
||||
},
|
||||
},
|
||||
]);
|
||||
};
|
||||
const options = ref([]);
|
||||
|
@@ -32,12 +32,14 @@
|
||||
:footer-style="{ textAlign: 'right' }"
|
||||
destroyOnClose
|
||||
@close="onClose">
|
||||
<span class="admin">用户信息</span>
|
||||
<ns-form
|
||||
ref="formRef"
|
||||
:schemas="formSchema"
|
||||
:model="formData"
|
||||
class="form"
|
||||
:wrapperCol="{ span: 20 }"
|
||||
:labelCol="{ span: 4 }"
|
||||
formLayout="vertical" />
|
||||
<span class="admin">用户权限</span>
|
||||
<ns-view-list-table
|
||||
@@ -71,7 +73,7 @@
|
||||
<script lang="ts" setup>
|
||||
import { computed, createVNode, defineComponent, reactive, ref, watchEffect } from 'vue';
|
||||
import { http } from '/nerv-lib/util/http';
|
||||
import { NsMessage, NsModal } from '/nerv-lib/component';
|
||||
import { Badge, NsMessage, NsModal } from '/nerv-lib/component';
|
||||
import { formConfig, formConfig2 } from './config';
|
||||
import { origanizemanage } from '/@/api/origanizemanage';
|
||||
|
||||
@@ -265,6 +267,7 @@
|
||||
deptRoleInfoList: str,
|
||||
roleId: casData.value[2].value,
|
||||
roleName: casData.value[2].label,
|
||||
deptId: casData.value[1].value,
|
||||
orgId: casData.value[0].value,
|
||||
} as never);
|
||||
handleClose();
|
||||
@@ -386,19 +389,21 @@
|
||||
return createVNode('div', {}, [
|
||||
createVNode('span', {}, value[0]?.deptRoleInfoList),
|
||||
value.length > 1 &&
|
||||
createVNode(
|
||||
'a',
|
||||
{
|
||||
onClick: () =>
|
||||
NsModal.info({
|
||||
icon: null,
|
||||
content: createVNode('div', {
|
||||
innerHTML: value.map((item) => item?.deptRoleInfoList).join('<br>'),
|
||||
}),
|
||||
createVNode(Badge, {
|
||||
onClick: () =>
|
||||
NsModal.info({
|
||||
icon: null,
|
||||
content: createVNode('div', {
|
||||
innerHTML: value.map((item) => item?.deptRoleInfoList).join('<br>'),
|
||||
}),
|
||||
}),
|
||||
size: 'small',
|
||||
style: {
|
||||
transform: 'translateY(-4px)',
|
||||
cursor: 'pointer',
|
||||
},
|
||||
`+${value.length}`,
|
||||
),
|
||||
count: value.length - 1,
|
||||
}),
|
||||
]);
|
||||
},
|
||||
},
|
||||
@@ -596,6 +601,12 @@
|
||||
.main {
|
||||
background-color: @ns-content-bg;
|
||||
display: flex;
|
||||
|
||||
.top,
|
||||
:deep(.ns-table-search),
|
||||
:deep(.ns-table-main) {
|
||||
box-shadow: @ns-content-box-shadow;
|
||||
}
|
||||
}
|
||||
.left {
|
||||
width: 300px;
|
||||
|
@@ -11,7 +11,7 @@ const home = {
|
||||
component: () => import('/@/view/developing.vue'),
|
||||
meta: {
|
||||
title: '首页',
|
||||
keepAlive: true,
|
||||
keepAlive: false,
|
||||
// backApi: [],
|
||||
},
|
||||
},
|
||||
|
@@ -11,7 +11,7 @@ const organizationManage = {
|
||||
component: () => import('/@/view/organizationManage/enterpriseManage/index.vue'),
|
||||
meta: {
|
||||
title: '企业管理',
|
||||
keepAlive: true,
|
||||
keepAlive: false,
|
||||
// backApi: [],
|
||||
},
|
||||
},
|
||||
|
@@ -1,7 +1,7 @@
|
||||
<!-- @format -->
|
||||
|
||||
<template>
|
||||
<a-modal v-bind="getBindValue">
|
||||
<a-modal v-bind="getBindValue" centered>
|
||||
<template #[item]="data" v-for="item in Object.keys($slots)" :key="item">
|
||||
<slot :name="item" v-bind="data || {}"></slot>
|
||||
</template>
|
||||
|
@@ -46,4 +46,5 @@ export const treeProps = {
|
||||
type: Function,
|
||||
default: (data: any) => data,
|
||||
},
|
||||
cancelable: PropTypes.bool.def(false), // 选中树节点是否可以取消
|
||||
};
|
||||
|
@@ -1,22 +1,24 @@
|
||||
<template>
|
||||
<a-spin :spinning="treeState.loading">
|
||||
<div class="ns-tree-form">
|
||||
<div v-if="header" class="ns-tree-title">
|
||||
<ns-icon :name="header.icon" size="14" />
|
||||
<span>{{ header.title }}</span>
|
||||
<div class="ns-tree-container">
|
||||
<div class="ns-tree-form">
|
||||
<div v-if="header" class="ns-tree-title">
|
||||
<ns-icon :name="header.icon" size="14" />
|
||||
<span>{{ header.title }}</span>
|
||||
</div>
|
||||
<div v-if="!formConfig?.schema">
|
||||
<ns-form ref="formElRef" v-bind="formConfig" :model="formModel" @finish="formFinish" />
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="!formConfig?.schema">
|
||||
<ns-form ref="formElRef" v-bind="formConfig" :model="formModel" @finish="formFinish" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="min-height: 150px; overflow-y: scroll">
|
||||
<ns-tree v-if="treeData?.length" v-bind="getBindValue" v-model:selectedKeys="selectedKeys">
|
||||
<template #[item]="data" v-for="(item, index) in Object.keys($slots)" :key="index">
|
||||
<slot :name="item" v-bind="{ ...data, formModel } || {}"></slot>
|
||||
</template>
|
||||
</ns-tree>
|
||||
<!-- <a-empty v-if="!treeData?.length" /> -->
|
||||
<div style="min-height: 150px">
|
||||
<ns-tree v-if="treeData?.length" v-bind="getBindValue" :selectedKeys="selectedKeys">
|
||||
<template #[item]="data" v-for="(item, index) in Object.keys($slots)" :key="index">
|
||||
<slot :name="item" v-bind="{ ...data, formModel } || {}"></slot>
|
||||
</template>
|
||||
</ns-tree>
|
||||
<!-- <a-empty v-if="!treeData?.length" /> -->
|
||||
</div>
|
||||
</div>
|
||||
</a-spin>
|
||||
</template>
|
||||
@@ -25,7 +27,7 @@
|
||||
import { TreeDataItem } from 'ant-design-vue/es/tree/Tree';
|
||||
import { useApi } from '/nerv-lib/use/use-api';
|
||||
import { AxiosRequestConfig } from 'axios';
|
||||
import { get } from 'lodash-es';
|
||||
import { get, isEmpty } from 'lodash-es';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { debounce } from 'lodash-es';
|
||||
import { treeProps, treeFormProps } from '/nerv-lib/component/tree/props';
|
||||
@@ -33,7 +35,7 @@
|
||||
defineOptions({
|
||||
name: 'NsTreeApi',
|
||||
});
|
||||
const emit = defineEmits(['update:treeData']);
|
||||
const emit = defineEmits(['update:treeData', 'select']);
|
||||
// const model = defineModel('treeData');
|
||||
|
||||
const formElRef = ref();
|
||||
@@ -67,14 +69,25 @@
|
||||
const isSticky: any = computed(() => {
|
||||
return props.isSticky ? 'sticky' : 'static';
|
||||
});
|
||||
|
||||
const formFinish = debounce((data: object) => {
|
||||
selectedKeys.value = [];
|
||||
getData(data);
|
||||
}, 200);
|
||||
|
||||
const handleSelect = (keys: any, selectedRows: any) => {
|
||||
if (props.cancelable || !isEmpty(keys)) {
|
||||
selectedKeys.value = keys;
|
||||
// props.onSelect && props.onSelect(keys, selectedRows);
|
||||
emit('select', keys, selectedRows);
|
||||
}
|
||||
};
|
||||
|
||||
const getBindValue = computed(() => ({
|
||||
...attrs,
|
||||
...props,
|
||||
treeData: treeData.value,
|
||||
onSelect: handleSelect,
|
||||
}));
|
||||
const setLoading = (loading: boolean) => {
|
||||
treeState.loading = loading;
|
||||
@@ -150,4 +163,12 @@
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.ns-tree-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
&:last-child {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@@ -337,7 +337,7 @@
|
||||
height: 100%;
|
||||
background-color: @white;
|
||||
border-radius: @ns-border-radius;
|
||||
overflow-y: auto;
|
||||
// overflow-y: auto;
|
||||
// overflow-x: hidden;
|
||||
// margin: 0 16px 16px 16px;
|
||||
}
|
||||
|
Reference in New Issue
Block a user