Compare commits
44 Commits
1b0118bb82
...
deploy-dev
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
6202151242 | ||
|
|
ad9a43a7c6 | ||
|
|
82b0f4cf96 | ||
|
|
bbed0e3ff3 | ||
|
|
1790db4595 | ||
|
|
8b40268bd1 | ||
|
|
7aa949bdcf | ||
|
|
61dcbfeacd | ||
|
|
6478070bd8 | ||
|
|
a1b3ee2c8c | ||
|
|
dd7c417f81 | ||
|
|
a9e6998430 | ||
|
|
261ad9017d | ||
|
|
b8b6a46e7e | ||
|
|
ab29f9152d | ||
|
|
2d96bbda3b | ||
|
|
7869b083c3 | ||
|
|
9637a6f13b | ||
|
|
ecf6cd38dd | ||
|
|
84191fe301 | ||
|
|
7dadb22181 | ||
|
|
b396c37426 | ||
|
|
ee99ba7340 | ||
|
|
c628c10f25 | ||
|
|
79c56bb979 | ||
|
|
9ca6cb83f0 | ||
|
|
a2bfe148d3 | ||
|
|
9134cf4ac3 | ||
|
|
7b77c3cc88 | ||
|
|
5e2f9cc966 | ||
|
|
4dcb8f74ca | ||
|
|
223ceed5eb | ||
|
|
5c5acf6942 | ||
|
|
975d5fe4f0 | ||
|
|
159698ffbe | ||
|
|
57b55b5f82 | ||
|
|
ca0ebf33f7 | ||
| 0585818abf | |||
|
|
9dfc3173ac | ||
|
|
7690f72636 | ||
|
|
211b013084 | ||
| a94531bd57 | |||
| 7802223799 | |||
|
|
e648da4b6e |
@@ -128,4 +128,64 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@min-padding: 5px;
|
||||
:deep(.ns-left-menu-space):not(.ns-left-menu-space-collapsed) {
|
||||
.firstMenuItem-selected {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
.ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected {
|
||||
background-color: transparent;
|
||||
&::before {
|
||||
background-color: @primary-color;
|
||||
opacity: 1;
|
||||
height: calc(100% - @min-padding*2);
|
||||
top: @min-padding;
|
||||
border-radius: @ns-border-radius;
|
||||
}
|
||||
}
|
||||
.ant-menu-item-active:not(.ant-menu-item-selected) {
|
||||
background-color: transparent !important;
|
||||
position: relative;
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
background-color: rgb(@primary-color, 0.1);
|
||||
height: calc(100% - @min-padding*2);
|
||||
top: @min-padding;
|
||||
left: 0;
|
||||
border-radius: @ns-border-radius;
|
||||
z-index: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// .ant-menu-inline .ant-menu-item-selected::after {
|
||||
// content: '';
|
||||
// position: absolute;
|
||||
// top: 50%;
|
||||
// right: -20px;
|
||||
// transform: translateY(-50%);
|
||||
// width: 3px !important;
|
||||
// border-radius: 2px;
|
||||
// background-color: red;
|
||||
// height: 30px;
|
||||
// z-index: 2;
|
||||
// border: none;
|
||||
// }
|
||||
|
||||
.ant-menu-title-content {
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.nsHeader_action) {
|
||||
.action {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
letter-spacing: 0px;
|
||||
line-height: 24px;
|
||||
color: rgba(51, 51, 51, 1);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -9,6 +9,13 @@ export enum lightingManage {
|
||||
// 修改线路的可用/禁用状态
|
||||
setDisable = '/carbon-smart/IlluminationInfo/revisePanel',
|
||||
|
||||
// 控制面板tab页 ================================================
|
||||
|
||||
// 获取当前修改的内容对比数据
|
||||
getChangeList = '/carbon-smart/IlluminationInfo/getLightSceneChangeInfo',
|
||||
// 提交当前修改
|
||||
submitChangeList = '/carbon-smart/IlluminationInfo/changeLightScene',
|
||||
|
||||
// 计划列表tab页 ================================================
|
||||
|
||||
// 获得计划列表tab页的表格数据
|
||||
|
||||
6
hx-ai-intelligent/src/api/alarmManagement/energyAlarm.ts
Normal file
@@ -0,0 +1,6 @@
|
||||
export enum energyAlarmApi {
|
||||
getTableList = '/carbon-smart/api/AlarmEnergyConsumptionLog/selectAlarmEnergyConsumptionLog', //能碳告警 列表
|
||||
getCodeList = '/carbon-smart/api/AlarmEnergyConsumptionLog/selectErrorCodeList ', //能碳告警 列表
|
||||
getSelectAlarmEnergyConsumptionLogStatusProcess = '/carbon-smart/api/AlarmEnergyConsumptionLogStatusProcess/selectAlarmEnergyConsumptionLogStatusProcess', //能碳告警 状态 没有创建工单log接口
|
||||
noCreatOrUpdateLog = '/carbon-smart/api/AlarmEnergyConsumptionLogStatusProcess/creatOrUpdate', //能碳告警 状态 没有创建工单 添加 修改状态log
|
||||
}
|
||||
@@ -2,4 +2,5 @@ export enum equipmentAlarmApi {
|
||||
getTableList = '/carbon-smart/api/AlarmEquipmentLog/selectAlarmEquipmentLog', //设备告警 列表
|
||||
getCodeList = '/carbon-smart/api/AlarmEquipmentLog/selectErrorCodeList', //设备告警 列表
|
||||
getSelectAlarmEquipmentLogStatusProcess = '/carbon-smart/api/AlarmEquipmentLogStatusProcess/selectAlarmEquipmentLogStatusProcess', //设备告警 状态 没有创建工单log接口
|
||||
noCreatOrUpdateLog = '/carbon-smart/api/AlarmEquipmentLogStatusProcess/creatOrUpdate', //设备告警 状态 没有创建工单 添加 修改状态log
|
||||
}
|
||||
|
||||
@@ -0,0 +1,3 @@
|
||||
export enum gatewayAlarmApi {
|
||||
getTableList = '/carbon-smart/api/AlarmGatewayLog/selectAlarmGatewayLog', //网关告警 列表
|
||||
}
|
||||
@@ -42,4 +42,19 @@ export enum carbonInventoryCheck {
|
||||
createOrUpdate = '/carbon-smart/api/carbon/report/createOrUpdate',
|
||||
findById = '/carbon-smart/api/carbon/report/findById',
|
||||
delete = '/carbon-smart/api/carbon/report/delete',
|
||||
}
|
||||
// 填报页面接口
|
||||
// 最左侧碳盘查报告树
|
||||
getCategoryTree = '/carbon-smart/api/carbon/inventory/contact/getCategoryTree',
|
||||
updateCategoryTree = '/carbon-smart/api/carbon/inventory/contact/update',
|
||||
// 排放源中左侧树
|
||||
getInventoryTree = '/carbon-smart/api/carbon/inventory/getInventoryTree',
|
||||
create = '/carbon-smart/api/carbon/inventory/create',
|
||||
update = '/carbon-smart/api/carbon/inventory/update',
|
||||
del = '/carbon-smart/api/carbon/inventory/del',
|
||||
// 获取排放源表格数据
|
||||
findUnitById = '/carbon-smartapi/carbon/inventory/findById',
|
||||
getDetailsList = '/carbon-smart/api/carbon/inventory/details/getDetailsList',
|
||||
updateTable = '/carbon-smart/api/carbon/inventory/details/update',
|
||||
// 排放统计接口
|
||||
emissionStatistic = '/carbon-smart/api/carbon/inventory/emissionStatistic',
|
||||
}
|
||||
|
||||
@@ -28,4 +28,5 @@ export enum group {
|
||||
queryFormula = `${BASE_URL}/deviceGroup/queryFormula`, // 公式查询
|
||||
dropGroupFilter = `${BASE_URL}/deviceGroup/dropGroupFilter`, // 分组列表查询
|
||||
dropGroupInfoFilter = `${BASE_URL}/deviceGroup/dropGroupInfoFilter`, // 计算列表查询
|
||||
queryDeviceToEnergy = `${BASE_URL}/deviceGroup/queryDeviceToEnergy`, // 能耗监测用查询设备(能耗监测设备树)
|
||||
}
|
||||
|
||||
@@ -50,14 +50,13 @@ export const getAllEnum = async ({
|
||||
return Promise.resolve(res);
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* 获取单个枚举(需传参,参数 enumType)
|
||||
* 获取单个枚举(需传参,参数 enumType)
|
||||
*/
|
||||
export const getEnum = async ({
|
||||
api = `${BASE_URL}/operation/enum/getEnum`,
|
||||
params = {},
|
||||
}: dictHttpConfig) => {
|
||||
const res = await http.post(api, params);
|
||||
const res = await http.get(api, params);
|
||||
return Promise.resolve(res);
|
||||
};
|
||||
};
|
||||
|
||||
@@ -1,13 +1,14 @@
|
||||
// 设备监测
|
||||
export enum deviceMonitor {
|
||||
// getTableList = '/carbon/emission/factor/queryCarbonFactorPage',
|
||||
// addNewData = '/carbon/emission/factor/creatOrUpdate',
|
||||
// editUser = '/carbon-smart/api/user/edit',
|
||||
// frozen = '/carbon-smart/api/user/frozen',
|
||||
// resetPwd = '/carbon-smart/api/user/resetPwd',
|
||||
// del = '/carbon-smart/api/user/del',
|
||||
// batchDel = '/carbon-smart/api/user/batchDel',
|
||||
// getCarbonFactorTree = '/carbon/emission/type/getCarbonFactorTree',
|
||||
// queryDeptTree = '/carbon-smart/api/user/queryDeptTree',
|
||||
// queryUserPerList = '/carbon-smart/api/user/queryUserPerList',
|
||||
getDeviceGraph = '/carbon-smart/api/monitor/getDeviceGraph',
|
||||
getDevicePointToMonitor = '/carbon-smart//api/monitor/getDevicePointToMonitor',
|
||||
}
|
||||
|
||||
// 能耗监测
|
||||
export enum energyMonitor {
|
||||
getDeviceOrNodeEnergyGraph = '/carbon-smart/api/monitor/getDeviceOrNodeEnergyGraph',
|
||||
getDeviceOrNodeEnergyAnalyse = '/carbon-smart/api/monitor/getDeviceOrNodeEnergyAnalyse',
|
||||
}
|
||||
|
||||
// 环境监测
|
||||
export enum environmentMonitor {}
|
||||
|
||||
@@ -9,7 +9,7 @@
|
||||
<div class="card">
|
||||
<div class="card-title">
|
||||
<a-tag class="card-title-tag" :color="item.color">{{ item.stateName }}</a-tag>
|
||||
<div class="name">{{ item.createName }}</div>
|
||||
<div class="name">{{ item.realName }}</div>
|
||||
<div class="time">{{ item.createTime }}</div>
|
||||
</div>
|
||||
<div style="width: 100%; color: #3a3a3a; height: 25px; overflow: auto">
|
||||
|
||||
@@ -22,7 +22,7 @@ export const appConfig = {
|
||||
projectType: 'web',
|
||||
baseApi: '/api',
|
||||
projectName: '济阳站_AI智能BAS系统',
|
||||
enablePermissions: false,
|
||||
enablePermissions: true,
|
||||
// themeColor: '#eee',
|
||||
siderPosition: 'left',
|
||||
baseHeader: '/parkingManage',
|
||||
|
||||
@@ -62,6 +62,25 @@ const alarmManagement = {
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: 'EnergyAlarm',
|
||||
name: 'EnergyAlarm',
|
||||
meta: { title: '能碳告警', hideChildren: true, icon: 'gaojingguanli' },
|
||||
component: Base,
|
||||
redirect: { name: 'EnergyAlarmIndex' },
|
||||
children: [
|
||||
{
|
||||
path: 'index',
|
||||
name: 'EnergyAlarmIndex',
|
||||
component: () => import('/@/view/alarmManagement/energyAlarm/index.vue'),
|
||||
meta: {
|
||||
title: '能碳告警',
|
||||
keepAlive: false,
|
||||
// backApi: [],
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: 'alarmSettings',
|
||||
name: 'AlarmSettings',
|
||||
|
||||
@@ -65,6 +65,26 @@ const equipment = {
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
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: [],
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
};
|
||||
export default equipment;
|
||||
|
||||
@@ -24,6 +24,25 @@ const equipmentControl = {
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: 'liftSystem',
|
||||
name: 'liftSystem',
|
||||
meta: { title: '电梯系统', hideChildren: true, icon: 'shebeiqunkong' },
|
||||
component: Base,
|
||||
redirect: { name: 'liftSystem' },
|
||||
children: [
|
||||
{
|
||||
path: 'index',
|
||||
name: 'liftSystem',
|
||||
component: () => import('/@/view/equipmentControl/liftSystem/index.vue'),
|
||||
meta: {
|
||||
title: '电梯系统',
|
||||
keepAlive: false,
|
||||
// backApi: [],
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
};
|
||||
export default equipmentControl;
|
||||
|
||||
@@ -39,7 +39,18 @@ const equipment = {
|
||||
meta: {
|
||||
title: '分组管理',
|
||||
keepAlive: false,
|
||||
// backApi: [],
|
||||
operates: [
|
||||
{ title: '新增分组', code: 'GroupAdd' },
|
||||
{ title: '删除分组', code: 'GroupDelete' },
|
||||
{ title: '编辑分组', code: 'GroupEdit' },
|
||||
{ title: '删除点位', code: 'GroupPointDelete' },
|
||||
{ title: '编辑点位', code: 'GroupPointEdit' },
|
||||
{ title: '导入点位', code: 'GroupPointImport' },
|
||||
{ title: '导出点位', code: 'GroupPointExports' },
|
||||
{ title: '模版下载', code: 'GroupTempDownload' },
|
||||
{ title: '批量分组', code: 'GroupBatchGroup' },
|
||||
{ title: '公式编辑', code: 'GroupFormulaEdit' },
|
||||
],
|
||||
},
|
||||
},
|
||||
],
|
||||
|
||||
@@ -20,7 +20,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="item-box-right">
|
||||
<img width="54px" height="54px" src="../../../../src/icon/gaojingtonglan.svg" />
|
||||
<img width="48px" height="48px" src="../../../../src/icon/gaojingtonglan.svg" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -194,7 +194,7 @@
|
||||
textEllipsis: true,
|
||||
},
|
||||
{
|
||||
title: '启用通知',
|
||||
title: '启用状态',
|
||||
dataIndex: 'enableRules',
|
||||
},
|
||||
],
|
||||
@@ -288,7 +288,7 @@
|
||||
},
|
||||
],
|
||||
},
|
||||
params: { equipmentAlarmId: value.id },
|
||||
params: { energyConsumptionAlarmId: value.id, orgId: orgId.value },
|
||||
// pagination: { pageSizeOptions: false },
|
||||
rowKey: 'id',
|
||||
};
|
||||
|
||||
@@ -25,6 +25,7 @@
|
||||
label: 'orgName',
|
||||
value: 'orgId',
|
||||
}"
|
||||
:disabled="true"
|
||||
tree-node-filter-prop="orgName" />
|
||||
</a-form-item>
|
||||
<a-form-item label="数据来源" name="dataSources">
|
||||
@@ -54,7 +55,8 @@
|
||||
infoObject.dataSources && infoObject.dataSources[1] === 1
|
||||
? 'deviceName'
|
||||
: 'pointName',
|
||||
value: 'id',
|
||||
value:
|
||||
infoObject.dataSources && infoObject.dataSources[1] === 1 ? 'deviceInfoCode' : 'id',
|
||||
}" />
|
||||
</a-form-item>
|
||||
<a-form-item label="启用规则">
|
||||
@@ -94,7 +96,7 @@
|
||||
<a-select
|
||||
v-model:value="infoObject.alarmList[index - 1].logic"
|
||||
style="width: 70px; margin-left: 12px"
|
||||
:options="ljOptions" />
|
||||
:options="logicEnum" />
|
||||
<span style="line-height: 32px; margin-left: 32px">{{ `数值${index}:` }}</span>
|
||||
<a-input
|
||||
style="width: 65px; margin-left: 6px"
|
||||
@@ -137,10 +139,7 @@
|
||||
import { device, group } from '/@/api/deviceManage';
|
||||
import { energyAlarms } from '/@/api/alarmManagement/alarmSettings/energyAlarm';
|
||||
import { http } from '/nerv-lib/util';
|
||||
import { dict } from '/@/api';
|
||||
import { async } from '@antv/x6/lib/registry/marker/async';
|
||||
|
||||
// import type { Rule } from 'ant-design-vue/es/form';
|
||||
import { dict, getEnum } from '/@/api';
|
||||
|
||||
const visible = ref(false);
|
||||
//父级数据
|
||||
@@ -257,13 +256,7 @@
|
||||
);
|
||||
};
|
||||
//逻辑
|
||||
const ljOptions = ref<SelectProps['options']>([
|
||||
{ value: 0, label: '≥' },
|
||||
{ value: 1, label: '>' },
|
||||
{ value: 2, label: '≤' },
|
||||
{ value: 3, label: '<' },
|
||||
{ value: 4, label: '=' },
|
||||
]);
|
||||
const logicEnum = ref<SelectProps['options']>([]);
|
||||
//开关
|
||||
const clickSwitch = () => {
|
||||
if (infoObject.value.enableRules === 1) {
|
||||
@@ -274,6 +267,8 @@
|
||||
};
|
||||
//父调子 页面显示方法
|
||||
const toggle = async (value: any, info: any) => {
|
||||
let enumData = await getEnum({ params: { enumType: 'LogicEnum' } });
|
||||
logicEnum.value = enumData.data;
|
||||
// 数据来源
|
||||
let energyType = await dict({ params: { dicKey: 'ENERGY_TYPE' } });
|
||||
if (energyType.data.data) {
|
||||
@@ -312,6 +307,10 @@
|
||||
infoObject.value.dataSourcesType,
|
||||
infoObject.value.dataSourcesWay,
|
||||
];
|
||||
//设备节点
|
||||
if (infoObject.value.dataSourcesWay === 2) {
|
||||
infoObject.value.deviceNode = Number(infoObject.value.deviceNode);
|
||||
}
|
||||
delete infoObject.value.dataSourcesType;
|
||||
delete infoObject.value.dataSourcesWay;
|
||||
infoObject.value.comparisonType = infoObject.value.comparisonType.split(',');
|
||||
@@ -349,8 +348,8 @@
|
||||
enableRules: 0,
|
||||
alarmList: [{ id: null, logic: null, num: null, isDelete: 0 }],
|
||||
};
|
||||
infoObject.value.site = orgId.value;
|
||||
}
|
||||
|
||||
visible.value = !visible.value;
|
||||
};
|
||||
//表单 判断规格
|
||||
@@ -367,7 +366,7 @@
|
||||
message: '请输入异常描述',
|
||||
trigger: 'blur',
|
||||
validator: (rules: any, abnormalDescription: any, cbfn: any) => {
|
||||
if (abnormalDescription.trim() !== '') {
|
||||
if (abnormalDescription && abnormalDescription.trim() !== '') {
|
||||
cbfn();
|
||||
} else {
|
||||
cbfn('告警标题不能为空');
|
||||
@@ -391,8 +390,11 @@
|
||||
formRef.value.validate().then(() => {
|
||||
//处理数据
|
||||
let data = { ...infoObject.value };
|
||||
if (!data.orgId) {
|
||||
data.orgId = orgId.value;
|
||||
}
|
||||
//关联能耗告警id
|
||||
data.equipmentAlarmId = energyAlarm.value.id;
|
||||
data.energyConsumptionAlarmId = energyAlarm.value.id;
|
||||
data.errorCode = energyAlarm.value.errorCode;
|
||||
data.dataSourcesType = data.dataSources[0];
|
||||
data.dataSourcesWay = data.dataSources[1];
|
||||
|
||||
@@ -18,22 +18,26 @@
|
||||
placeholder="请选择告警频率"
|
||||
style="width: 100%"
|
||||
allowClear
|
||||
:options="alarmFrequencyData" />
|
||||
:options="AlarmFrequencyEnum"
|
||||
@change="handleChangeAlarmFrequency" />
|
||||
</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%"
|
||||
style="width: 100%"
|
||||
v-model:value="infoObject.intervalDuration"
|
||||
placeholder="请输入间隔时长" />
|
||||
<a-select
|
||||
v-model:value="infoObject.intervalDurationUnit"
|
||||
placeholder="请选择间隔时长单位"
|
||||
style="width: 40%"
|
||||
allowClear
|
||||
:options="intervalDurationUnitData" />
|
||||
placeholder="请输入间隔时长">
|
||||
<template #addonAfter>
|
||||
<a-select
|
||||
v-model:value="infoObject.intervalDurationUnit"
|
||||
placeholder="请选择间隔时长单位"
|
||||
style="width: 80px"
|
||||
allowClear
|
||||
:options="intervalDurationUnitData" />
|
||||
</template>
|
||||
</ns-input-number>
|
||||
</a-form-item>
|
||||
<a-form-item label="优先级" name="priority">
|
||||
<a-select
|
||||
@@ -41,7 +45,7 @@
|
||||
placeholder="请选择优先级"
|
||||
style="width: 100%"
|
||||
allowClear
|
||||
:options="priorityData" />
|
||||
:options="PriorityEnum" />
|
||||
</a-form-item>
|
||||
<a-form-item label="监测频率" name="monitorFrequency">
|
||||
<a-select
|
||||
@@ -49,7 +53,7 @@
|
||||
placeholder="请选择监测频率"
|
||||
style="width: 100%"
|
||||
allowClear
|
||||
:options="monitorFrequencyData" />
|
||||
:options="MonitorFrequencyEnumm" />
|
||||
</a-form-item>
|
||||
<a-form-item label="启用规则">
|
||||
<a-switch
|
||||
@@ -75,8 +79,20 @@
|
||||
import { NsMessage } from '/nerv-lib/component';
|
||||
import { http } from '/nerv-lib/util';
|
||||
import { energyAlarms } from '/@/api/alarmManagement/alarmSettings/energyAlarm';
|
||||
import { getAllEnum } from '/@/api';
|
||||
|
||||
const visible = ref(false);
|
||||
// 间隔单位 默认值
|
||||
const handleChangeAlarmFrequency = () => {
|
||||
if (infoObject.value.alarmFrequency === 2 && !infoObject.value.intervalDurationUnit) {
|
||||
infoObject.value.intervalDurationUnit = 1;
|
||||
}
|
||||
};
|
||||
//组织id
|
||||
const orgId = ref('');
|
||||
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||
orgId.value = result;
|
||||
|
||||
//表单数据
|
||||
const infoObject = ref({
|
||||
alarmTitle: null,
|
||||
@@ -84,74 +100,16 @@
|
||||
priority: null,
|
||||
monitorFrequency: null,
|
||||
createWorkOrder: null,
|
||||
orgId: 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 AlarmFrequencyEnum = ref([]);
|
||||
const PriorityEnum = ref([]);
|
||||
const intervalDurationUnitData = ref([]);
|
||||
const MonitorFrequencyEnumm = ref([]);
|
||||
const rules = {
|
||||
alarmTitle: [
|
||||
{
|
||||
@@ -204,12 +162,29 @@
|
||||
priority: [{ required: true, message: '请选择优先级', trigger: 'change' }],
|
||||
monitorTimeUnit: [{ required: true, message: '请选择监测时长单位', trigger: 'change' }],
|
||||
};
|
||||
const getMenu = async () => {
|
||||
let enumData = await getAllEnum({
|
||||
params: [
|
||||
'PriorityEnum',
|
||||
'MonitorFrequencyEnumm',
|
||||
'AlarmFrequencyEnum',
|
||||
'IntervalDurationUnitEnum',
|
||||
],
|
||||
});
|
||||
PriorityEnum.value = enumData.data.PriorityEnum;
|
||||
MonitorFrequencyEnumm.value = enumData.data.MonitorFrequencyEnumm;
|
||||
AlarmFrequencyEnum.value = enumData.data.AlarmFrequencyEnum;
|
||||
intervalDurationUnitData.value = enumData.data.IntervalDurationUnitEnum;
|
||||
};
|
||||
const toggle = (value: any) => {
|
||||
//获取枚举 回显
|
||||
getMenu();
|
||||
//判断 是新增 还是修改
|
||||
if (value) {
|
||||
infoObject.value = value;
|
||||
} else {
|
||||
infoObject.value = {
|
||||
orgId: null,
|
||||
alarmTitle: null,
|
||||
alarmFrequency: null,
|
||||
priority: null,
|
||||
@@ -235,6 +210,9 @@
|
||||
//表单校验
|
||||
formRef.value.validate().then(() => {
|
||||
let data = { ...infoObject.value };
|
||||
if (!data.orgId) {
|
||||
data.orgId = orgId.value;
|
||||
}
|
||||
data.createWorkOrder = Number(data.createWorkOrder);
|
||||
if (data.alarmFrequency !== 2) {
|
||||
data.repetitions = null;
|
||||
|
||||
@@ -171,7 +171,7 @@
|
||||
dataIndex: 'abnormalDescription',
|
||||
},
|
||||
{
|
||||
title: '启用通知',
|
||||
title: '启用状态',
|
||||
dataIndex: 'enableRules',
|
||||
},
|
||||
],
|
||||
@@ -205,7 +205,7 @@
|
||||
title: value.errorCode,
|
||||
schemas: [
|
||||
{
|
||||
field: 'deviceId',
|
||||
field: 'deviceInfoCode',
|
||||
label: '设备名称',
|
||||
component: 'nsSelectApi',
|
||||
componentProps: {
|
||||
@@ -219,7 +219,7 @@
|
||||
placeholder: '请选择设备名称',
|
||||
resultField: 'data.records',
|
||||
labelField: 'deviceName',
|
||||
valueField: 'id',
|
||||
valueField: 'deviceInfoCode',
|
||||
showSearch: true,
|
||||
filterOption: (input: string, option: any) => {
|
||||
return option.deviceName.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
||||
@@ -232,7 +232,7 @@
|
||||
label: '设备点位',
|
||||
component: 'nsSelectApi',
|
||||
dynamicParams: {
|
||||
id: 'deviceId', //帮定上级联动数据
|
||||
deviceCode: 'deviceInfoCode', //帮定上级联动数据
|
||||
},
|
||||
componentProps: {
|
||||
api: device.queryDevicePoint,
|
||||
@@ -241,7 +241,7 @@
|
||||
placeholder: '请选择设备点位',
|
||||
labelField: 'code',
|
||||
valueField: 'id',
|
||||
dependency: 'deviceId',
|
||||
dependency: 'deviceInfoCode',
|
||||
showSearch: true,
|
||||
filterOption: (input: string, option: any) => {
|
||||
return option.code.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
||||
@@ -279,7 +279,7 @@
|
||||
},
|
||||
],
|
||||
},
|
||||
params: { equipmentAlarmId: value.id },
|
||||
params: { equipmentAlarmId: value.id, orgId: orgId.value },
|
||||
// pagination: { pageSizeOptions: false },
|
||||
rowKey: 'id',
|
||||
};
|
||||
|
||||
@@ -25,6 +25,7 @@
|
||||
value: 'orgId',
|
||||
}"
|
||||
:tree-data="siteDataTree"
|
||||
:disabled="true"
|
||||
tree-node-filter-prop="orgName" />
|
||||
</a-form-item>
|
||||
<a-form-item label="设备类型" name="deviceType">
|
||||
@@ -40,16 +41,17 @@
|
||||
@change="selectDeviceType"
|
||||
placeholder="请选择设备类型" />
|
||||
</a-form-item>
|
||||
<a-form-item label="设备名称" name="deviceId">
|
||||
<a-form-item label="设备名称" name="deviceInfoCode">
|
||||
<a-select
|
||||
v-model:value="infoObject.deviceId"
|
||||
v-model:value="infoObject.deviceInfoCode"
|
||||
:disabled="!(infoObject && infoObject.deviceType && infoObject.deviceType.length > 0)"
|
||||
style="width: 100%"
|
||||
:autoClearSearchValue="true"
|
||||
allow-clear
|
||||
@change="selectDevice"
|
||||
placeholder="请选择设备名称">
|
||||
<template v-for="(item, index) in deviceNameTreeData" :key="index">
|
||||
<a-select-option :value="item.id">
|
||||
<a-select-option :value="item.deviceInfoCode">
|
||||
{{ item.deviceName }}
|
||||
</a-select-option>
|
||||
</template>
|
||||
@@ -59,9 +61,11 @@
|
||||
<a-select
|
||||
v-model:value="infoObject.devicePoint"
|
||||
show-search
|
||||
:autoClearSearchValue="true"
|
||||
allow-clear
|
||||
placeholder="请选择设备点位"
|
||||
style="width: 100%"
|
||||
:disabled="!infoObject?.deviceId"
|
||||
:disabled="!infoObject?.deviceInfoCode"
|
||||
:options="devicePointData"
|
||||
:filter-option="filterDevicePoint" />
|
||||
</a-form-item>
|
||||
@@ -78,8 +82,9 @@
|
||||
<a-select
|
||||
v-model:value="infoObject.valueType"
|
||||
placeholder="请选择取值类型"
|
||||
allow-clear
|
||||
style="width: 100%"
|
||||
:options="qzOptions" />
|
||||
:options="valueTypeEnum" />
|
||||
</a-form-item>
|
||||
<a-form-item label="异常描述" name="abnormalDescription">
|
||||
<a-textarea
|
||||
@@ -109,11 +114,12 @@
|
||||
<a-select
|
||||
v-model:value="infoObject.alarmList[index - 1].logic"
|
||||
style="width: 70px; margin-left: 12px"
|
||||
:options="ljOptions" />
|
||||
:options="logicEnum" />
|
||||
<span style="line-height: 32px; margin-left: 32px">{{ `数值${index}:` }}</span>
|
||||
<a-input
|
||||
style="width: 65px; margin-left: 6px"
|
||||
type="number"
|
||||
status="error"
|
||||
v-model:value="infoObject.alarmList[index - 1].num" />
|
||||
<div
|
||||
style="width: 70px; align-items: center; cursor: pointer"
|
||||
@@ -151,10 +157,8 @@
|
||||
import type { ShowSearchType } from 'ant-design-vue/es/cascader';
|
||||
import { device } from '/@/api/deviceManage';
|
||||
import { deviceAlarms } from '/@/api/alarmManagement/alarmSettings/deviceAlarms';
|
||||
|
||||
import { http } from '/nerv-lib/util';
|
||||
|
||||
import { async } from '@antv/x6/lib/registry/marker/async';
|
||||
import { getAllEnum } from '/@/api';
|
||||
|
||||
const visible = ref(false);
|
||||
// 父级数据
|
||||
@@ -167,7 +171,7 @@
|
||||
deviceType: [],
|
||||
devicePoint: null,
|
||||
valueType: null,
|
||||
deviceId: null,
|
||||
deviceInfoCode: null,
|
||||
enableRules: 0,
|
||||
alarmList: [{ logic: null, num: null, isDelete: 0 }],
|
||||
});
|
||||
@@ -187,17 +191,20 @@
|
||||
let deviceNameTreeData = ref([]);
|
||||
//选择设备类型方法
|
||||
const selectDeviceType = (value: any, selectedOptions: any) => {
|
||||
//获取该类型设备
|
||||
getDevicePage({
|
||||
orgId: orgId.value,
|
||||
deviceCode: selectedOptions[selectedOptions.length - 1].code,
|
||||
pageNum: 1,
|
||||
pageSize: 999,
|
||||
});
|
||||
infoObject.value.deviceInfoCode = null;
|
||||
if (selectedOptions && selectedOptions.length > 0) {
|
||||
//获取该类型设备
|
||||
getDevicePage({
|
||||
orgId: orgId.value,
|
||||
deviceCode: selectedOptions[selectedOptions.length - 1].code,
|
||||
pageNum: 1,
|
||||
pageSize: 999,
|
||||
});
|
||||
}
|
||||
};
|
||||
//选择设备方法
|
||||
const selectDevice = () => {
|
||||
getDevicePoint({ id: infoObject.value.deviceId });
|
||||
getDevicePoint({ deviceCode: infoObject.value.deviceInfoCode });
|
||||
};
|
||||
//获取设备列表
|
||||
const getDevicePage = (value: any) => {
|
||||
@@ -235,18 +242,9 @@
|
||||
);
|
||||
};
|
||||
//取值类型
|
||||
const qzOptions = ref<SelectProps['options']>([
|
||||
{ value: 1, label: '实时值' },
|
||||
{ value: 2, label: '平均值' },
|
||||
]);
|
||||
const valueTypeEnum = ref<SelectProps['options']>();
|
||||
//逻辑
|
||||
const ljOptions = ref<SelectProps['options']>([
|
||||
{ value: 0, label: '≥' },
|
||||
{ value: 1, label: '>' },
|
||||
{ value: 2, label: '≤' },
|
||||
{ value: 3, label: '<' },
|
||||
{ value: 4, label: '=' },
|
||||
]);
|
||||
const logicEnum = ref<SelectProps['options']>([]);
|
||||
|
||||
//开关
|
||||
const clickSwitch = () => {
|
||||
@@ -293,10 +291,16 @@
|
||||
}
|
||||
return null; // 没有找到目标节点,返回 null
|
||||
};
|
||||
const getMenu = async () => {
|
||||
let enumData = await getAllEnum({ params: ['LogicEnum', 'ValueTypeEnum'] });
|
||||
logicEnum.value = enumData.data.LogicEnum;
|
||||
valueTypeEnum.value = enumData.data.ValueTypeEnum;
|
||||
};
|
||||
//父调子 页面显示方法
|
||||
const toggle = async (value: any, info: any) => {
|
||||
equipmentAlarm.value = info;
|
||||
|
||||
//获取枚举 回显
|
||||
getMenu();
|
||||
//获取设备类型
|
||||
await http
|
||||
.post(device.queryDeviceTree, { orgId: orgId.value, pageNum: 1, pageSize: 10 })
|
||||
@@ -321,7 +325,7 @@
|
||||
let selectDevice = ref([Number(infoObject.value.deviceType)]);
|
||||
findNodeById(deviceTypeTreeData.value, Number(infoObject.value.deviceType));
|
||||
//获取设备点位
|
||||
getDevicePoint({ id: infoObject.value.deviceId });
|
||||
getDevicePoint({ deviceCode: infoObject.value.deviceInfoCode });
|
||||
// 回显 选择设备类型
|
||||
findParentIds(
|
||||
deviceTypeTreeData.value,
|
||||
@@ -356,10 +360,11 @@
|
||||
deviceType: [],
|
||||
devicePoint: null,
|
||||
valueType: null,
|
||||
deviceId: null,
|
||||
deviceInfoCode: null,
|
||||
enableRules: 0,
|
||||
alarmList: [{ logic: null, num: null, isDelete: 0 }],
|
||||
};
|
||||
infoObject.value.site = orgId.value;
|
||||
}
|
||||
|
||||
visible.value = !visible.value;
|
||||
@@ -369,7 +374,7 @@
|
||||
site: [{ required: true, message: '请选择站点', trigger: 'change' }],
|
||||
deviceType: [{ required: true, message: '请选择设备类型', trigger: 'change' }],
|
||||
enableRules: [{ required: true, message: '请选择启用规则', trigger: 'change' }],
|
||||
deviceId: [{ required: true, message: '请选择设备名称', trigger: 'change' }],
|
||||
deviceInfoCode: [{ required: true, message: '请选择设备名称', trigger: 'change' }],
|
||||
devicePoint: [{ required: true, message: '请选择设备点位', trigger: 'change' }],
|
||||
valueType: [{ required: true, message: '请选择取值类型', trigger: 'change' }],
|
||||
ruleType: [{ required: true, message: '请选择规则类型', trigger: 'change' }],
|
||||
@@ -379,7 +384,7 @@
|
||||
message: '请输入异常描述',
|
||||
trigger: 'blur',
|
||||
validator: (rules: any, abnormalDescription: any, cbfn: any) => {
|
||||
if (abnormalDescription.trim() !== '') {
|
||||
if (abnormalDescription && abnormalDescription.trim() !== '') {
|
||||
cbfn();
|
||||
} else {
|
||||
cbfn('告警标题不能为空');
|
||||
@@ -392,6 +397,7 @@
|
||||
};
|
||||
// 确认按钮
|
||||
const btnClick = () => {
|
||||
infoObject.value.devicePoint = 1;
|
||||
infoObject.value.alarmList.forEach((item) => {
|
||||
if (item.logic === null || item.num === null) {
|
||||
return;
|
||||
@@ -404,6 +410,9 @@
|
||||
//数据是否验证通过
|
||||
formRef.value.validate().then(() => {
|
||||
let data = { ...infoObject.value };
|
||||
if (!data.orgId) {
|
||||
data.orgId = orgId.value;
|
||||
}
|
||||
// 配置关联id
|
||||
data.equipmentAlarmId = equipmentAlarm.value.id;
|
||||
// 逻辑列表
|
||||
@@ -455,7 +464,7 @@
|
||||
deviceType: [],
|
||||
devicePoint: null,
|
||||
valueType: null,
|
||||
deviceId: null,
|
||||
deviceInfoCode: null,
|
||||
enableRules: 0,
|
||||
alarmList: [{ logic: null, num: null, isDelete: 0 }],
|
||||
};
|
||||
|
||||
@@ -24,7 +24,7 @@
|
||||
placeholder="请选择监测时长单位"
|
||||
style="width: 100%"
|
||||
allowClear
|
||||
:options="monitorTimeUnitData" />
|
||||
:options="MonitorTimeUnitEnum" />
|
||||
</a-form-item>
|
||||
<a-form-item label="告警频率" name="alarmFrequency">
|
||||
<a-select
|
||||
@@ -32,22 +32,26 @@
|
||||
placeholder="请选择告警频率"
|
||||
style="width: 100%"
|
||||
allowClear
|
||||
:options="alarmFrequencyData" />
|
||||
:options="AlarmFrequencyEnum"
|
||||
@change="handleChangeAlarmFrequency" />
|
||||
</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%"
|
||||
style="width: 100%"
|
||||
v-model:value="infoObject.intervalDuration"
|
||||
placeholder="请输入间隔时长" />
|
||||
<a-select
|
||||
v-model:value="infoObject.intervalDurationUnit"
|
||||
placeholder="请选择间隔时长单位"
|
||||
style="width: 40%"
|
||||
allowClear
|
||||
:options="intervalDurationUnitData" />
|
||||
placeholder="请输入间隔时长">
|
||||
<template #addonAfter>
|
||||
<a-select
|
||||
v-model:value="infoObject.intervalDurationUnit"
|
||||
placeholder="请选择间隔时长单位"
|
||||
style="width: 80px"
|
||||
allowClear
|
||||
:options="IntervalDurationUnitEnum" />
|
||||
</template>
|
||||
</ns-input-number>
|
||||
</a-form-item>
|
||||
<a-form-item label="优先级" name="priority">
|
||||
<a-select
|
||||
@@ -55,7 +59,7 @@
|
||||
placeholder="请选择优先级"
|
||||
style="width: 100%"
|
||||
allowClear
|
||||
:options="priorityData" />
|
||||
:options="PriorityEnum" />
|
||||
</a-form-item>
|
||||
<a-form-item label="启用规则">
|
||||
<a-switch
|
||||
@@ -81,8 +85,13 @@
|
||||
import { NsMessage } from '/nerv-lib/component';
|
||||
import { http } from '/nerv-lib/util';
|
||||
import { deviceAlarms } from '/@/api/alarmManagement/alarmSettings/deviceAlarms';
|
||||
import { getAllEnum } from '/@/api';
|
||||
|
||||
const visible = ref(false);
|
||||
//组织id
|
||||
const orgId = ref('');
|
||||
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||
orgId.value = result;
|
||||
//表单数据
|
||||
const infoObject = ref({
|
||||
id: null,
|
||||
@@ -99,63 +108,27 @@
|
||||
});
|
||||
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 AlarmFrequencyEnum = ref([]);
|
||||
const MonitorTimeUnitEnum = ref([]);
|
||||
const IntervalDurationUnitEnum = ref([]);
|
||||
const PriorityEnum = ref([]);
|
||||
const getMenu = async () => {
|
||||
let enumData = await getAllEnum({
|
||||
params: [
|
||||
'PriorityEnum',
|
||||
'MonitorTimeUnitEnum',
|
||||
'AlarmFrequencyEnum',
|
||||
'IntervalDurationUnitEnum',
|
||||
],
|
||||
});
|
||||
PriorityEnum.value = enumData.data.PriorityEnum;
|
||||
MonitorTimeUnitEnum.value = enumData.data.MonitorTimeUnitEnum;
|
||||
AlarmFrequencyEnum.value = enumData.data.AlarmFrequencyEnum;
|
||||
IntervalDurationUnitEnum.value = enumData.data.IntervalDurationUnitEnum;
|
||||
};
|
||||
const toggle = (value: any) => {
|
||||
//获取枚举 回显
|
||||
getMenu();
|
||||
//判断 是新增 还是修改
|
||||
if (value) {
|
||||
infoObject.value = value;
|
||||
@@ -176,6 +149,12 @@
|
||||
}
|
||||
visible.value = !visible.value;
|
||||
};
|
||||
// 间隔单位 默认值
|
||||
const handleChangeAlarmFrequency = () => {
|
||||
if (infoObject.value.alarmFrequency === 2 && !infoObject.value.intervalDurationUnit) {
|
||||
infoObject.value.intervalDurationUnit = 1;
|
||||
}
|
||||
};
|
||||
//表单 判断规格
|
||||
const rules = {
|
||||
alarmTitle: [
|
||||
@@ -211,7 +190,11 @@
|
||||
required: true,
|
||||
trigger: 'change',
|
||||
validator: (rules: any, intervalDuration: any, cbfn: any) => {
|
||||
if (Number.isInteger(intervalDuration) && intervalDuration > 0) {
|
||||
if (
|
||||
Number.isInteger(intervalDuration) &&
|
||||
intervalDuration > 0 &&
|
||||
infoObject.value.intervalDurationUnit
|
||||
) {
|
||||
cbfn();
|
||||
} else {
|
||||
cbfn('请输入正确的间隔时长');
|
||||
@@ -302,6 +285,9 @@
|
||||
data.intervalDuration = null;
|
||||
data.intervalDurationUnit = null;
|
||||
}
|
||||
if (!data.orgId) {
|
||||
data.orgId = orgId.value;
|
||||
}
|
||||
http.post(deviceAlarms.addOrUpNewData, data).then(() => {
|
||||
if (infoObject.value.id) {
|
||||
NsMessage.success('告警编辑成功');
|
||||
|
||||
@@ -73,7 +73,6 @@
|
||||
import { http } from '/nerv-lib/util';
|
||||
import linkPeople from './linkPeople/index.vue';
|
||||
import { notificationManagementApi } from '/@/api/alarmManagement/alarmSettings/notificationManagements';
|
||||
import { async } from '@antv/x6/lib/registry/marker/async';
|
||||
|
||||
//table 数据
|
||||
const columns = [
|
||||
|
||||
@@ -1,7 +1,12 @@
|
||||
import { http } from '/nerv-lib/util';
|
||||
import { NsMessage } from '/nerv-lib/component';
|
||||
import { energyAlarms } from '/@/api/alarmManagement/alarmSettings/energyAlarm';
|
||||
import { ref } from 'vue';
|
||||
import { getEnum } from '/@/api';
|
||||
|
||||
const orgId = ref('');
|
||||
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||
orgId.value = result;
|
||||
const tableKeyMap = [
|
||||
{
|
||||
title: '序号',
|
||||
@@ -155,24 +160,23 @@ export const energyAlarmConfigs = (
|
||||
{
|
||||
field: 'priority',
|
||||
label: '告警优先级',
|
||||
component: 'NsSelect',
|
||||
component: 'nsSelectApi',
|
||||
// dynamicParams: {
|
||||
// id: 'deviceName', //帮定上级联动数据
|
||||
// },
|
||||
componentProps: {
|
||||
placeholder: '请选择告警优先级',
|
||||
api: () => getEnum({ params: { enumType: 'PriorityEnum' } }),
|
||||
immediate: true,
|
||||
allowClear: true,
|
||||
options: [
|
||||
{
|
||||
label: '紧急',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '重要',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: '一般',
|
||||
value: 3,
|
||||
},
|
||||
],
|
||||
resultField: 'data',
|
||||
labelField: 'label',
|
||||
valueField: 'value',
|
||||
placeholder: '请选择告警优先级',
|
||||
showSearch: true,
|
||||
filterOption: (input: string, option: any) => {
|
||||
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
||||
},
|
||||
// autoSelectFirst: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
@@ -214,6 +218,7 @@ export const energyAlarmConfigs = (
|
||||
},
|
||||
],
|
||||
},
|
||||
params: { orgId: orgId.value },
|
||||
// pagination: { pageSizeOptions: false },
|
||||
rowKey: 'id',
|
||||
};
|
||||
|
||||
@@ -1,6 +1,12 @@
|
||||
import { http } from '/nerv-lib/util';
|
||||
import { NsMessage } from '/nerv-lib/component';
|
||||
import { deviceAlarms } from '/@/api/alarmManagement/alarmSettings/deviceAlarms';
|
||||
import { ref } from 'vue';
|
||||
import { getEnum } from '/@/api';
|
||||
|
||||
const orgId = ref('');
|
||||
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||
orgId.value = result;
|
||||
const tableKeyMap = [
|
||||
{
|
||||
title: '序号',
|
||||
@@ -153,24 +159,23 @@ export const equipmentAlarmTableConfig = (
|
||||
{
|
||||
field: 'priority',
|
||||
label: '告警优先级',
|
||||
component: 'NsSelect',
|
||||
component: 'nsSelectApi',
|
||||
// dynamicParams: {
|
||||
// id: 'deviceName', //帮定上级联动数据
|
||||
// },
|
||||
componentProps: {
|
||||
placeholder: '请选择告警优先级',
|
||||
api: () => getEnum({ params: { enumType: 'PriorityEnum' } }),
|
||||
immediate: true,
|
||||
allowClear: true,
|
||||
options: [
|
||||
{
|
||||
label: '紧急',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '重要',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: '一般',
|
||||
value: 3,
|
||||
},
|
||||
],
|
||||
resultField: 'data',
|
||||
labelField: 'label',
|
||||
valueField: 'value',
|
||||
placeholder: '请选择告警优先级',
|
||||
showSearch: true,
|
||||
filterOption: (input: string, option: any) => {
|
||||
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
||||
},
|
||||
// autoSelectFirst: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
@@ -212,6 +217,7 @@ export const equipmentAlarmTableConfig = (
|
||||
},
|
||||
],
|
||||
},
|
||||
params: { orgId: orgId.value },
|
||||
// pagination: { pageSizeOptions: false },
|
||||
rowKey: 'id',
|
||||
};
|
||||
|
||||
@@ -1,8 +1,10 @@
|
||||
import { dateUtil } from '/nerv-lib/util/date-util';
|
||||
import { http } from '/nerv-lib/util';
|
||||
import { notificationManagementApi } from '/@/api/alarmManagement/alarmSettings/notificationManagements';
|
||||
import { ref } from 'vue';
|
||||
import { getEnum } from '/@/api';
|
||||
|
||||
const orgId = ref('');
|
||||
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||
orgId.value = result;
|
||||
const tableKeyMap = [
|
||||
{
|
||||
title: '序号',
|
||||
@@ -90,24 +92,23 @@ export const notificationtableConfig = (notificationManagements: any) => {
|
||||
{
|
||||
field: 'priority',
|
||||
label: '告警优先级',
|
||||
component: 'NsSelect',
|
||||
component: 'nsSelectApi',
|
||||
// dynamicParams: {
|
||||
// id: 'deviceName', //帮定上级联动数据
|
||||
// },
|
||||
componentProps: {
|
||||
placeholder: '请选择告警优先级',
|
||||
api: () => getEnum({ params: { enumType: 'PriorityEnum' } }),
|
||||
immediate: true,
|
||||
allowClear: true,
|
||||
options: [
|
||||
{
|
||||
label: '紧急',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '重要',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: '一般',
|
||||
value: 3,
|
||||
},
|
||||
],
|
||||
resultField: 'data',
|
||||
labelField: 'label',
|
||||
valueField: 'value',
|
||||
placeholder: '请选择告警优先级',
|
||||
showSearch: true,
|
||||
filterOption: (input: string, option: any) => {
|
||||
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
||||
},
|
||||
// autoSelectFirst: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
@@ -149,6 +150,7 @@ export const notificationtableConfig = (notificationManagements: any) => {
|
||||
},
|
||||
],
|
||||
},
|
||||
params: { orgId: orgId.value },
|
||||
// pagination: { pageSizeOptions: false },
|
||||
rowKey: 'id',
|
||||
};
|
||||
|
||||
@@ -0,0 +1,48 @@
|
||||
<template>
|
||||
<ns-view-list-table v-bind="config" ref="mainRef">
|
||||
<template #bodyCell="{ record, column }">
|
||||
<template v-if="column.dataIndex === 'alarmTitle'">
|
||||
<div style="color: #2778ff">{{ record.alarmTitle }}</div>
|
||||
{{ record.abnormalDescription }}
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'priority'">
|
||||
{{ record.priority ? record.priority.label : '' }}
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'alarmLogState'">
|
||||
{{ record.alarmLogState ? record.alarmLogState.label : '' }}
|
||||
</template>
|
||||
</template>
|
||||
</ns-view-list-table>
|
||||
<!-- 详情页面 -->
|
||||
<Look ref="look" />
|
||||
<!-- 状态页面 -->
|
||||
<Status ref="status" @logAdd="logAdd" />
|
||||
</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 mainRef = ref(null);
|
||||
const config = notificationtableConfig(look, status);
|
||||
const logAdd = () => {
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
};
|
||||
return {
|
||||
config,
|
||||
look,
|
||||
status,
|
||||
mainRef,
|
||||
logAdd,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
274
hx-ai-intelligent/src/view/alarmManagement/energyAlarm/look.vue
Normal file
@@ -0,0 +1,274 @@
|
||||
<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">
|
||||
告警编号:{{ infoObject.alarmCode }}
|
||||
</div>
|
||||
<div style="right: 20px; position: absolute; height: 35px; line-height: 35px">
|
||||
{{ infoObject.updateTime }}
|
||||
</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="优先级">{{
|
||||
infoObject.priority ? infoObject.priority.label : ''
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="状态">{{
|
||||
infoObject.alarmLogState ? infoObject.alarmLogState.label : ''
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="错误码">{{ infoObject.errorCode }}</a-descriptions-item>
|
||||
<a-descriptions-item label="告警描述">
|
||||
<div style="color: #2778ff">{{ infoObject.alarmTitle }}</div>
|
||||
{{ infoObject.abnormalDescription }}</a-descriptions-item
|
||||
>
|
||||
<a-descriptions-item label="监测点位">
|
||||
{{ infoObject.monitoringPoints }}
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="重复次数">
|
||||
{{ infoObject.alarmRepetitions }}
|
||||
</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 infoObject = ref({
|
||||
priority: null,
|
||||
alarmCode: null,
|
||||
alarmLogState: null,
|
||||
errorCode: null,
|
||||
alarmTitle: null,
|
||||
abnormalDescription: null,
|
||||
monitoringPoints: null,
|
||||
alarmRepetitions: null,
|
||||
updateTime: null,
|
||||
});
|
||||
const visible = ref(false);
|
||||
const handleClose = () => {
|
||||
visible.value = false;
|
||||
if (chartInstance) {
|
||||
chartInstance.dispose();
|
||||
}
|
||||
infoObject.value = {
|
||||
priority: null,
|
||||
alarmCode: null,
|
||||
alarmLogState: null,
|
||||
errorCode: null,
|
||||
alarmTitle: null,
|
||||
abnormalDescription: null,
|
||||
monitoringPoints: null,
|
||||
alarmRepetitions: null,
|
||||
updateTime: null,
|
||||
};
|
||||
};
|
||||
const btnClick = () => {
|
||||
handleClose();
|
||||
};
|
||||
const toggle = (data: any) => {
|
||||
infoObject.value = data;
|
||||
visible.value = true;
|
||||
setTimeout(() => {
|
||||
getChatr();
|
||||
}, 500);
|
||||
};
|
||||
const getChatr = () => {
|
||||
let dayData = [];
|
||||
let energyAlarm = [];
|
||||
|
||||
// Extend data for 30 days
|
||||
for (let i = 1; i < 30; i++) {
|
||||
dayData.push(`3/${i}`);
|
||||
energyAlarm.push(Math.floor(Math.random() * 250));
|
||||
}
|
||||
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, // 这里可以调整图例项之间的间距,单位为像素
|
||||
},
|
||||
],
|
||||
// toolbox: {
|
||||
// show: true,
|
||||
// feature: {
|
||||
// restore: {},
|
||||
// saveAsImage: {},
|
||||
// },
|
||||
// },
|
||||
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 轴刻度标签的字体大小
|
||||
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 + ' V'; // 在刻度值后加上单位
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
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]) + 'V';
|
||||
},
|
||||
},
|
||||
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,183 @@
|
||||
<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="state" label="当前状态" name="state">
|
||||
<a-select
|
||||
v-model:value="infoObject.state"
|
||||
show-search
|
||||
placeholder="请选择当前状态"
|
||||
style="width: 85%"
|
||||
:options="stateOptions"
|
||||
:disabled="showEdit" />
|
||||
<ns-icon
|
||||
size="20"
|
||||
@click="changeShowEdit"
|
||||
style="margin-left: 20px"
|
||||
:name="showEdit ? 'bianji' : 'baocun'" />
|
||||
</a-form-item>
|
||||
<a-form-item label="备注" name="remarks">
|
||||
<a-textarea
|
||||
v-model:value="infoObject.remarks"
|
||||
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="状态流程">
|
||||
<!-- 自动生成工单 -->
|
||||
<div v-if="infoObject.createWorkOrder === 1"> xxxx </div>
|
||||
<!-- 没有自动生成工单 -->
|
||||
<NsSteps v-else 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 } from 'vue';
|
||||
import NsSteps from '/@/components/ns-steps.vue';
|
||||
import { NsMessage } from '/nerv-lib/component';
|
||||
import { http } from '/nerv-lib/util';
|
||||
import { energyAlarmApi } from '/@/api/alarmManagement/energyAlarm';
|
||||
import { getEnum } from '/@/api';
|
||||
|
||||
export default defineComponent({
|
||||
components: { NsSteps },
|
||||
|
||||
setup(props, { emit }) {
|
||||
const visible = ref(false);
|
||||
const showEdit = ref(true);
|
||||
const infoObject = ref({});
|
||||
const energyAlarm = ref({});
|
||||
const stateOptions = ref();
|
||||
const logList = ref([]);
|
||||
const formRef = ref();
|
||||
const config = ref({
|
||||
size: logList.value.length,
|
||||
dataSource: logList.value,
|
||||
});
|
||||
// 表单校验
|
||||
const rules = {
|
||||
remarks: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入备注',
|
||||
trigger: 'change',
|
||||
validator: (rules, remarks, cbfn) => {
|
||||
if (remarks && remarks.trim() !== '') {
|
||||
cbfn();
|
||||
} else {
|
||||
cbfn('备注不能为空');
|
||||
}
|
||||
},
|
||||
},
|
||||
],
|
||||
state: [{ required: true, message: '请选择当前状态', trigger: 'change' }],
|
||||
};
|
||||
const handleClose = () => {
|
||||
showEdit.value = true;
|
||||
energyAlarm.value = {};
|
||||
infoObject.value = {};
|
||||
visible.value = false;
|
||||
config.value.dataSource = [];
|
||||
};
|
||||
const btnClick = () => {
|
||||
formRef.value.validate().then(() => {
|
||||
delete infoObject.value.createTime;
|
||||
infoObject.value.alarmEnergyConsumptionLogId = energyAlarm.value.id;
|
||||
if (energyAlarm.value.createWorkOrder === 0) {
|
||||
http.post(energyAlarmApi.noCreatOrUpdateLog, infoObject.value).then((res) => {
|
||||
if (res.msg === 'success') {
|
||||
NsMessage.success('操作成功');
|
||||
showEdit.value = true;
|
||||
energyAlarm.value = {};
|
||||
infoObject.value = {};
|
||||
visible.value = false;
|
||||
emit('logAdd', null);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
//修改状态
|
||||
const changeShowEdit = () => {
|
||||
// 未生成工单
|
||||
if (energyAlarm.value.createWorkOrder === 0) {
|
||||
showEdit.value = !showEdit.value;
|
||||
}
|
||||
};
|
||||
const toggle = async (data) => {
|
||||
energyAlarm.value = { ...data };
|
||||
visible.value = true;
|
||||
let states = await getEnum({ params: { enumType: 'AlarmLogStateEnum' } });
|
||||
stateOptions.value = states.data;
|
||||
if (energyAlarm.value.createWorkOrder !== 1) {
|
||||
stateOptions.value = stateOptions.value.filter((item) => item.value !== 4);
|
||||
}
|
||||
await http
|
||||
.post(energyAlarmApi.getSelectAlarmEnergyConsumptionLogStatusProcess, {
|
||||
alarmEnergyConsumptionLogId: data.id,
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.msg === 'success') {
|
||||
logList.value = res.data;
|
||||
infoObject.value = { ...logList.value[0] };
|
||||
infoObject.value.state = infoObject.value.state.value;
|
||||
let colorMap = {
|
||||
1: '#ff7602',
|
||||
2: '#00a1e6',
|
||||
3: '#04d919',
|
||||
4: '#d9001b',
|
||||
5: '#a6a6a6',
|
||||
};
|
||||
logList.value.forEach((item) => {
|
||||
item.stateName = item.state.label;
|
||||
item.color = colorMap[item.state.value];
|
||||
item.src = 'state-' + item.state.value;
|
||||
});
|
||||
config.value.dataSource = logList.value;
|
||||
}
|
||||
});
|
||||
};
|
||||
return {
|
||||
infoObject,
|
||||
changeShowEdit,
|
||||
showEdit,
|
||||
rules,
|
||||
formRef,
|
||||
energyAlarm,
|
||||
stateOptions,
|
||||
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,183 @@
|
||||
import { energyAlarmApi } from '/@/api/alarmManagement/energyAlarm';
|
||||
import { dict } from '/@/api';
|
||||
import { ref } from 'vue';
|
||||
import { getEnum } from '/@/api';
|
||||
|
||||
const orgId = ref('');
|
||||
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||
orgId.value = result;
|
||||
const tableKeyMap = [
|
||||
{
|
||||
title: '序号',
|
||||
dataIndex: 'address',
|
||||
width: 80,
|
||||
customRender: (text: any) => {
|
||||
return text.index + 1;
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '告警编号',
|
||||
dataIndex: 'alarmCode',
|
||||
},
|
||||
{
|
||||
title: '告警描述',
|
||||
dataIndex: 'alarmTitle',
|
||||
},
|
||||
{
|
||||
title: '类型',
|
||||
dataIndex: 'dataSourcesTypeName',
|
||||
},
|
||||
{
|
||||
title: '优先级',
|
||||
dataIndex: 'priority',
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'alarmLogState',
|
||||
},
|
||||
{
|
||||
title: '错误码',
|
||||
dataIndex: 'errorCode',
|
||||
},
|
||||
{
|
||||
title: '监测点位',
|
||||
dataIndex: 'monitoringPoints',
|
||||
},
|
||||
{
|
||||
title: '更新时间',
|
||||
dataIndex: 'updateTime',
|
||||
},
|
||||
{
|
||||
title: '重复次数',
|
||||
dataIndex: 'alarmRepetitions',
|
||||
},
|
||||
];
|
||||
export const notificationtableConfig = (look: any, status: any) => {
|
||||
return {
|
||||
title: '告警记录',
|
||||
api: energyAlarmApi.getTableList,
|
||||
headerActions: [{}],
|
||||
scroll: { x: 2000 },
|
||||
columns: tableKeyMap,
|
||||
// rowSelection: null, 选择按钮
|
||||
columnActions: {
|
||||
title: '操作',
|
||||
actions: [
|
||||
{
|
||||
label: '详情',
|
||||
name: 'FeedBackDetail',
|
||||
dynamicParams: ['uuid', 'appealType'],
|
||||
handle: (data: any) => {
|
||||
look.value.toggle(data);
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '状态',
|
||||
name: 'FeedBackDetail',
|
||||
dynamicParams: ['uuid', 'appealType'],
|
||||
handle: (data: any) => {
|
||||
status.value.toggle(data);
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
formConfig: {
|
||||
schemas: [
|
||||
{
|
||||
field: 'dataSourcesType',
|
||||
label: '类型',
|
||||
component: 'nsSelectApi',
|
||||
// dynamicParams: {
|
||||
// id: 'deviceName', //帮定上级联动数据
|
||||
// },
|
||||
componentProps: {
|
||||
api: () => dict({ params: { dicKey: 'ENERGY_TYPE' } }),
|
||||
immediate: true,
|
||||
allowClear: true,
|
||||
labelField: 'cnValue',
|
||||
valueField: 'id',
|
||||
placeholder: '请选择类型',
|
||||
showSearch: true,
|
||||
filterOption: (input: string, option: any) => {
|
||||
return option.cnValue.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
||||
},
|
||||
// autoSelectFirst: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'priority',
|
||||
label: '优先级',
|
||||
component: 'nsSelectApi',
|
||||
// dynamicParams: {
|
||||
// id: 'deviceName', //帮定上级联动数据
|
||||
// },
|
||||
componentProps: {
|
||||
api: () => getEnum({ params: { enumType: 'PriorityEnum' } }),
|
||||
immediate: true,
|
||||
allowClear: true,
|
||||
resultField: 'data',
|
||||
labelField: 'label',
|
||||
valueField: 'value',
|
||||
placeholder: '请选择告警优先级',
|
||||
showSearch: true,
|
||||
filterOption: (input: string, option: any) => {
|
||||
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
||||
},
|
||||
// autoSelectFirst: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'alarmLogState',
|
||||
label: '状态',
|
||||
component: 'nsSelectApi',
|
||||
// dynamicParams: {
|
||||
// id: 'deviceName', //帮定上级联动数据
|
||||
// },
|
||||
componentProps: {
|
||||
api: () => getEnum({ params: { enumType: 'AlarmLogStateEnum' } }),
|
||||
immediate: true,
|
||||
allowClear: true,
|
||||
resultField: 'data',
|
||||
labelField: 'label',
|
||||
valueField: 'value',
|
||||
placeholder: '请选择状态',
|
||||
showSearch: true,
|
||||
filterOption: (input: string, option: any) => {
|
||||
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
||||
},
|
||||
// autoSelectFirst: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'errorCode',
|
||||
label: '错误码',
|
||||
component: 'NsSelectApi',
|
||||
componentProps: {
|
||||
allowClear: true,
|
||||
placeholder: '请选择错误码',
|
||||
autoSelectFirst: false,
|
||||
api: energyAlarmApi.getCodeList,
|
||||
resultField: 'data',
|
||||
labelField: 'errorCode',
|
||||
valueField: 'errorCode',
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'createTime',
|
||||
label: '数据日期',
|
||||
component: 'NsRangePicker',
|
||||
allowClear: true,
|
||||
fieldMap: ['startTime', 'endTime'],
|
||||
componentProps: {
|
||||
valueFormat: 'YYYY-MM-DD',
|
||||
placeholder: ['开始日期', '结束日期'],
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
params: { orgId: orgId.value },
|
||||
// pagination: { pageSizeOptions: false },
|
||||
rowKey: 'id',
|
||||
};
|
||||
};
|
||||
@@ -16,7 +16,7 @@
|
||||
<!-- 详情页面 -->
|
||||
<Look ref="look" />
|
||||
<!-- 状态页面 -->
|
||||
<Status ref="status" />
|
||||
<Status ref="status" @logAdd="logAdd" />
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { notificationtableConfig } from './ts/config';
|
||||
@@ -31,11 +31,17 @@
|
||||
setup() {
|
||||
const look = ref(null);
|
||||
const status = ref(null);
|
||||
const mainRef = ref(null);
|
||||
const config = notificationtableConfig(look, status);
|
||||
const logAdd = () => {
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
};
|
||||
return {
|
||||
config,
|
||||
look,
|
||||
status,
|
||||
mainRef,
|
||||
logAdd,
|
||||
};
|
||||
},
|
||||
};
|
||||
|
||||
@@ -72,6 +72,9 @@
|
||||
const visible = ref(false);
|
||||
const handleClose = () => {
|
||||
visible.value = false;
|
||||
if (chartInstance) {
|
||||
chartInstance.dispose();
|
||||
}
|
||||
infoObject.value = {
|
||||
priority: null,
|
||||
alarmCode: null,
|
||||
@@ -91,6 +94,7 @@
|
||||
infoObject.value = data;
|
||||
visible.value = true;
|
||||
setTimeout(() => {
|
||||
//获取数据 echarts图展示
|
||||
getChatr();
|
||||
}, 500);
|
||||
};
|
||||
|
||||
@@ -12,25 +12,24 @@
|
||||
<a-tab-pane key="1" tab="更新状态">
|
||||
<div style="width: 100%; padding: 24px">
|
||||
<a-form ref="formRef" :model="infoObject" :rules="rules">
|
||||
<a-form-item ref="state" label="当前状态" createName="state">
|
||||
<a-form-item ref="state" label="当前状态" name="state">
|
||||
<a-select
|
||||
v-model:value="infoObject.state"
|
||||
show-search
|
||||
placeholder="请选择设备点位"
|
||||
placeholder="请选择当前状态"
|
||||
style="width: 85%"
|
||||
:options="stateOptions"
|
||||
:disabled="showEdit"
|
||||
:filter-option="filterDevicePoint" />
|
||||
:disabled="showEdit" />
|
||||
<ns-icon
|
||||
size="20"
|
||||
@click="changeShowEdit"
|
||||
style="margin-left: 20px"
|
||||
:createName="showEdit ? 'bianji' : 'baocun'" />
|
||||
:name="showEdit ? 'bianji' : 'baocun'" />
|
||||
</a-form-item>
|
||||
<a-form-item label="备注" createName="desc">
|
||||
<a-form-item label="备注" name="remarks">
|
||||
<a-textarea
|
||||
v-model:value="infoObject.desc"
|
||||
placeholder="请输入异常描述"
|
||||
v-model:value="infoObject.remarks"
|
||||
placeholder="请输入备注"
|
||||
:disabled="showEdit"
|
||||
style="width: 85%"
|
||||
:autoSize="{ minRows: 4, maxRows: 4 }" />
|
||||
@@ -57,92 +56,111 @@
|
||||
import { NsMessage } from '/nerv-lib/component';
|
||||
import { http } from '/nerv-lib/util';
|
||||
import { equipmentAlarmApi } from '/@/api/alarmManagement/equipmentAlarm';
|
||||
import { getEnum } from '/@/api';
|
||||
|
||||
export default defineComponent({
|
||||
components: { NsSteps },
|
||||
|
||||
setup() {
|
||||
setup(props, { emit }) {
|
||||
const visible = ref(false);
|
||||
const showEdit = ref(true);
|
||||
const infoObject = ref({});
|
||||
const equipmentAlarm = ref({});
|
||||
const stateOptions = ref();
|
||||
const logList = ref([
|
||||
{ createName: '李四', state: 3, createTime: '2024-03-10 10:00:00', desc: '完成' },
|
||||
{ createName: '王五', state: 5, createTime: '2024-03-10 10:00:00' },
|
||||
{ createName: '王五', state: 4, createTime: '2024-03-10 10:00:00' },
|
||||
{ createName: '王五', state: 2, createTime: '2024-03-10 10:00:00', desc: '创建工单' },
|
||||
{ createName: '赵六', state: 1, createTime: '2024-03-10 10:00:00' },
|
||||
]);
|
||||
const logList = ref([]);
|
||||
const formRef = ref();
|
||||
const config = ref({
|
||||
size: logList.value.length,
|
||||
dataSource: logList.value,
|
||||
});
|
||||
// 表单校验
|
||||
const rules = {
|
||||
remarks: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入备注',
|
||||
trigger: 'change',
|
||||
validator: (rules, remarks, cbfn) => {
|
||||
if (remarks && remarks.trim() !== '') {
|
||||
cbfn();
|
||||
} else {
|
||||
cbfn('备注不能为空');
|
||||
}
|
||||
},
|
||||
},
|
||||
],
|
||||
state: [{ required: true, message: '请选择当前状态', trigger: 'change' }],
|
||||
};
|
||||
const handleClose = () => {
|
||||
equipmentAlarm.value = P;
|
||||
showEdit.value = true;
|
||||
equipmentAlarm.value = {};
|
||||
infoObject.value = {};
|
||||
visible.value = false;
|
||||
config.value.dataSource = [];
|
||||
logList.value = [];
|
||||
};
|
||||
const btnClick = () => {
|
||||
NsMessage.success('操作成功');
|
||||
delete infoObject.value.createTime;
|
||||
console.log(infoObject.value, equipmentAlarm.value, '操作');
|
||||
console.log('btnClick');
|
||||
formRef.value.validate().then(() => {
|
||||
delete infoObject.value.createTime;
|
||||
infoObject.value.alarmEquipmentLogId = equipmentAlarm.value.id;
|
||||
if (equipmentAlarm.value.createWorkOrder === 0) {
|
||||
http.post(equipmentAlarmApi.noCreatOrUpdateLog, infoObject.value).then((res) => {
|
||||
if (res.msg === 'success') {
|
||||
NsMessage.success('操作成功');
|
||||
showEdit.value = true;
|
||||
equipmentAlarm.value = {};
|
||||
infoObject.value = {};
|
||||
visible.value = false;
|
||||
emit('logAdd', null);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
//修改状态
|
||||
const changeShowEdit = () => {
|
||||
if (equipmentAlarm.value.createWorkOrder === 1) {
|
||||
// 未生成工单
|
||||
if (equipmentAlarm.value.createWorkOrder === 0) {
|
||||
showEdit.value = !showEdit.value;
|
||||
}
|
||||
};
|
||||
const toggle = async (data) => {
|
||||
equipmentAlarm.value = { ...data };
|
||||
infoObject.value = { ...logList.value[0] };
|
||||
visible.value = true;
|
||||
let states = await getEnum({ params: { enumType: 'AlarmLogStateEnum' } });
|
||||
stateOptions.value = states.data;
|
||||
if (equipmentAlarm.value.createWorkOrder !== 1) {
|
||||
stateOptions.value = stateOptions.value.filter((item) => item.value !== 4);
|
||||
}
|
||||
await http
|
||||
.post(equipmentAlarmApi.getSelectAlarmEquipmentLogStatusProcess, {
|
||||
id: data.id,
|
||||
alarmEquipmentLogId: data.id,
|
||||
})
|
||||
.then((res) => {
|
||||
console.log(res);
|
||||
if (res.msg === 'success') {
|
||||
logList.value = res.data;
|
||||
infoObject.value = { ...logList.value[0] };
|
||||
infoObject.value.state = infoObject.value.state.value;
|
||||
let colorMap = {
|
||||
1: '#ff7602',
|
||||
2: '#00a1e6',
|
||||
3: '#04d919',
|
||||
4: '#d9001b',
|
||||
5: '#a6a6a6',
|
||||
};
|
||||
logList.value.forEach((item) => {
|
||||
item.stateName = item.state.label;
|
||||
item.color = colorMap[item.state.value];
|
||||
item.src = 'state-' + item.state.value;
|
||||
});
|
||||
config.value.dataSource = logList.value;
|
||||
}
|
||||
});
|
||||
if (equipmentAlarm.value.createWorkOrder === 1) {
|
||||
stateOptions.value = [
|
||||
{ value: 1, label: '待处理' },
|
||||
{ value: 2, label: '处理中' },
|
||||
{ value: 3, label: '已完成' },
|
||||
{ value: 4, label: '超时' },
|
||||
{ value: 5, label: '已关闭' },
|
||||
];
|
||||
} else {
|
||||
stateOptions.value = [
|
||||
{ value: 1, label: '待处理' },
|
||||
{ value: 2, label: '处理中' },
|
||||
{ value: 3, label: '已完成' },
|
||||
{ value: 5, label: '已关闭' },
|
||||
];
|
||||
}
|
||||
let statusMap = {
|
||||
1: '待处理',
|
||||
2: '处理中',
|
||||
3: '已完成',
|
||||
4: '超时',
|
||||
5: '已关闭',
|
||||
};
|
||||
let colorMap = {
|
||||
1: '#ff7602',
|
||||
2: '#00a1e6',
|
||||
3: '#04d919',
|
||||
4: '#d9001b',
|
||||
5: '#a6a6a6',
|
||||
};
|
||||
logList.value.forEach((item) => {
|
||||
item.stateName = statusMap[item.state];
|
||||
item.color = colorMap[item.state];
|
||||
item.src = 'state-' + item.state;
|
||||
});
|
||||
visible.value = true;
|
||||
};
|
||||
return {
|
||||
infoObject,
|
||||
rules,
|
||||
formRef,
|
||||
changeShowEdit,
|
||||
showEdit,
|
||||
equipmentAlarm,
|
||||
|
||||
@@ -1,9 +1,11 @@
|
||||
import { dateUtil } from '/nerv-lib/util/date-util';
|
||||
import data from '../notificationManagementMock.json';
|
||||
import { http } from '/nerv-lib/util';
|
||||
import { equipmentAlarmApi } from '/@/api/alarmManagement/equipmentAlarm';
|
||||
|
||||
import { ref } from 'vue';
|
||||
import { getEnum } from '/@/api';
|
||||
|
||||
const orgId = ref('');
|
||||
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||
orgId.value = result;
|
||||
|
||||
const tableKeyMap = [
|
||||
{
|
||||
title: '序号',
|
||||
@@ -24,18 +26,23 @@ const tableKeyMap = [
|
||||
{
|
||||
title: '优先级',
|
||||
dataIndex: 'priority',
|
||||
width: 80,
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'alarmLogState',
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: '错误码',
|
||||
dataIndex: 'errorCode',
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: '设备信息',
|
||||
dataIndex: 'deviceInfo',
|
||||
width: 400,
|
||||
// textEllipsis: true,
|
||||
},
|
||||
{
|
||||
title: '更新时间',
|
||||
@@ -44,14 +51,13 @@ const tableKeyMap = [
|
||||
{
|
||||
title: '重复次数',
|
||||
dataIndex: 'alarmRepetitions',
|
||||
width: 80,
|
||||
},
|
||||
];
|
||||
const mockData = ref(data.listData);
|
||||
export const notificationtableConfig = (look: any, status: any) => {
|
||||
return {
|
||||
title: '告警记录',
|
||||
api: equipmentAlarmApi.getTableList,
|
||||
value: mockData.value,
|
||||
headerActions: [{}],
|
||||
scroll: { x: 2000 },
|
||||
columns: tableKeyMap,
|
||||
@@ -83,53 +89,45 @@ export const notificationtableConfig = (look: any, status: any) => {
|
||||
{
|
||||
field: 'priority',
|
||||
label: '优先级',
|
||||
component: 'NsSelect',
|
||||
component: 'nsSelectApi',
|
||||
// dynamicParams: {
|
||||
// id: 'deviceName', //帮定上级联动数据
|
||||
// },
|
||||
componentProps: {
|
||||
api: () => getEnum({ params: { enumType: 'PriorityEnum' } }),
|
||||
immediate: true,
|
||||
allowClear: true,
|
||||
resultField: 'data',
|
||||
labelField: 'label',
|
||||
valueField: 'value',
|
||||
placeholder: '请选择告警优先级',
|
||||
options: [
|
||||
{
|
||||
label: '紧急',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '重要',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: '一般',
|
||||
value: 3,
|
||||
},
|
||||
],
|
||||
showSearch: true,
|
||||
filterOption: (input: string, option: any) => {
|
||||
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
||||
},
|
||||
// autoSelectFirst: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'alarmLogState',
|
||||
label: '状态',
|
||||
component: 'NsSelect',
|
||||
component: 'nsSelectApi',
|
||||
// dynamicParams: {
|
||||
// id: 'deviceName', //帮定上级联动数据
|
||||
// },
|
||||
componentProps: {
|
||||
api: () => getEnum({ params: { enumType: 'AlarmLogStateEnum' } }),
|
||||
immediate: true,
|
||||
allowClear: true,
|
||||
resultField: 'data',
|
||||
labelField: 'label',
|
||||
valueField: 'value',
|
||||
placeholder: '请选择状态',
|
||||
options: [
|
||||
{
|
||||
label: '待处理',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '处理中',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: '已完成',
|
||||
value: 3,
|
||||
},
|
||||
{
|
||||
label: '超时',
|
||||
value: 4,
|
||||
},
|
||||
{
|
||||
label: '关闭',
|
||||
value: 5,
|
||||
},
|
||||
],
|
||||
showSearch: true,
|
||||
filterOption: (input: string, option: any) => {
|
||||
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
||||
},
|
||||
// autoSelectFirst: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
@@ -137,6 +135,7 @@ export const notificationtableConfig = (look: any, status: any) => {
|
||||
label: '错误码',
|
||||
component: 'NsSelectApi',
|
||||
componentProps: {
|
||||
allowClear: true,
|
||||
placeholder: '请选择错误码',
|
||||
autoSelectFirst: false,
|
||||
api: equipmentAlarmApi.getCodeList,
|
||||
@@ -149,7 +148,8 @@ export const notificationtableConfig = (look: any, status: any) => {
|
||||
field: 'createTime',
|
||||
label: '数据日期',
|
||||
component: 'NsRangePicker',
|
||||
fieldMap: ['manufactureBeginDate', 'manufactureEndDate'],
|
||||
allowClear: true,
|
||||
fieldMap: ['startTime', 'endTime'],
|
||||
componentProps: {
|
||||
valueFormat: 'YYYY-MM-DD',
|
||||
placeholder: ['开始日期', '结束日期'],
|
||||
@@ -157,6 +157,7 @@ export const notificationtableConfig = (look: any, status: any) => {
|
||||
},
|
||||
],
|
||||
},
|
||||
params: { orgId: orgId.value },
|
||||
// pagination: { pageSizeOptions: false },
|
||||
rowKey: 'id',
|
||||
};
|
||||
|
||||
@@ -1,5 +1,14 @@
|
||||
<template>
|
||||
<ns-view-list-table v-bind="config" ref="mainRef" />
|
||||
<ns-view-list-table v-bind="config" ref="mainRef">
|
||||
<template #bodyCell="{ record, column }">
|
||||
<template v-if="column.dataIndex === 'priority'">
|
||||
{{ record.priority ? record.priority.label : '' }}
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'alarmLogState'">
|
||||
{{ record.alarmLogState ? record.alarmLogState.label : '' }}
|
||||
</template>
|
||||
</template>
|
||||
</ns-view-list-table>
|
||||
<!-- 详情页面 -->
|
||||
<Look ref="look" />
|
||||
<!-- 状态页面 -->
|
||||
|
||||
@@ -13,10 +13,10 @@
|
||||
<div class="box">
|
||||
<div class="card"></div>
|
||||
<div style="left: 25px; position: absolute; height: 35px; line-height: 35px">
|
||||
告警编号:20230310001
|
||||
告警编号:{{ infoObject.alarmCode }}
|
||||
</div>
|
||||
<div style="right: 20px; position: absolute; height: 35px; line-height: 35px">
|
||||
2024-03-10 15:08:10
|
||||
{{ infoObject.updateTime }}
|
||||
</div>
|
||||
</div>
|
||||
<!-- center -->
|
||||
@@ -26,12 +26,20 @@
|
||||
<!-- 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-item label="优先级">{{
|
||||
infoObject.priority ? infoObject.priority.label : ''
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="状态">{{
|
||||
infoObject.alarmLogState ? infoObject.alarmLogState.label : ''
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="错误码">{{ infoObject.errorCode }}</a-descriptions-item>
|
||||
<a-descriptions-item label="告警描述">{{
|
||||
infoObject.alarmDescription
|
||||
}}</a-descriptions-item>
|
||||
<a-descriptions-item label="设备信息">{{ infoObject.deviceInfo }} </a-descriptions-item>
|
||||
<a-descriptions-item label="断往时长">
|
||||
{{ infoObject.durationOfNetworkDisconnection }}</a-descriptions-item
|
||||
>
|
||||
</a-descriptions>
|
||||
</div>
|
||||
</div>
|
||||
@@ -49,16 +57,35 @@
|
||||
|
||||
let chartInstance: echarts.ECharts | null = null;
|
||||
const graphChart = ref(null);
|
||||
const infoObject = ref({
|
||||
alarmCode: null,
|
||||
updateTime: null,
|
||||
priority: null,
|
||||
alarmLogState: null,
|
||||
errorCode: null,
|
||||
alarmDescription: null,
|
||||
deviceInfo: null,
|
||||
durationOfNetworkDisconnection: null,
|
||||
});
|
||||
const visible = ref(false);
|
||||
const handleClose = () => {
|
||||
visible.value = false;
|
||||
infoObject.value = {
|
||||
alarmCode: null,
|
||||
updateTime: null,
|
||||
priority: null,
|
||||
alarmLogState: null,
|
||||
errorCode: null,
|
||||
alarmDescription: null,
|
||||
deviceInfo: null,
|
||||
durationOfNetworkDisconnection: null,
|
||||
};
|
||||
};
|
||||
const btnClick = () => {
|
||||
console.log('btnClick');
|
||||
handleClose();
|
||||
};
|
||||
const toggle = (data: any) => {
|
||||
console.log(data, 'data');
|
||||
infoObject.value = { ...data };
|
||||
visible.value = true;
|
||||
setTimeout(() => {
|
||||
getChatr();
|
||||
|
||||
@@ -12,13 +12,13 @@
|
||||
<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-form-item ref="state" label="当前状态" name="state">
|
||||
<a-select
|
||||
v-model:value="infoObject.status"
|
||||
v-model:value="infoObject.state"
|
||||
show-search
|
||||
placeholder="请选择设备点位"
|
||||
style="width: 85%"
|
||||
:options="statusOptions"
|
||||
:options="stateOptions"
|
||||
:disabled="true"
|
||||
:filter-option="filterDevicePoint" />
|
||||
</a-form-item>
|
||||
@@ -45,10 +45,9 @@
|
||||
</template>
|
||||
<script>
|
||||
import { defineComponent } from 'vue';
|
||||
import { ref, createVNode } from 'vue';
|
||||
import { ref } from 'vue';
|
||||
import NsSteps from '/@/components/ns-steps.vue';
|
||||
import { NsMessage, NsModal } from '/nerv-lib/component';
|
||||
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||
import { getEnum } from '/@/api';
|
||||
|
||||
export default defineComponent({
|
||||
components: { NsSteps },
|
||||
@@ -56,19 +55,13 @@
|
||||
setup() {
|
||||
const visible = ref(false);
|
||||
const infoObject = ref({});
|
||||
const statusOptions = ref([
|
||||
{ value: '1', label: '待处理' },
|
||||
{ value: '2', label: '处理中' },
|
||||
{ value: '3', label: '已完成' },
|
||||
{ value: '4', label: '超时' },
|
||||
{ value: '5', label: '已关闭' },
|
||||
]);
|
||||
const stateOptions = ref();
|
||||
const logList = ref([
|
||||
{ name: '李四', status: '3', time: '2024-03-10 10:00:00', desc: '完成' },
|
||||
{ name: '王五', status: '5', time: '2024-03-10 10:00:00' },
|
||||
{ name: '王五', status: '4', time: '2024-03-10 10:00:00' },
|
||||
{ name: '王五', status: '2', time: '2024-03-10 10:00:00', desc: '创建工单' },
|
||||
{ name: '赵六', status: '1', time: '2024-03-10 10:00:00' },
|
||||
{ realName: '李四', state: 3, createTime: '2024-03-10 10:00:00', remarks: '完成' },
|
||||
{ realName: '王五', state: 5, createTime: '2024-03-10 10:00:00' },
|
||||
{ realName: '王五', state: 4, createTime: '2024-03-10 10:00:00' },
|
||||
{ realName: '王五', state: 2, createTime: '2024-03-10 10:00:00', remarks: '创建工单' },
|
||||
{ realName: '赵六', state: 1, createTime: '2024-03-10 10:00:00' },
|
||||
]);
|
||||
const config = ref({
|
||||
size: logList.value.length,
|
||||
@@ -80,9 +73,11 @@
|
||||
const btnClick = () => {
|
||||
visible.value = false;
|
||||
};
|
||||
const toggle = (data) => {
|
||||
const toggle = async (data) => {
|
||||
let states = await getEnum({ params: { enumType: 'AlarmLogStateEnum' } });
|
||||
stateOptions.value = states.data;
|
||||
infoObject.value = { ...logList.value[0] };
|
||||
let statusMap = {
|
||||
let stateMap = {
|
||||
1: '待处理',
|
||||
2: '处理中',
|
||||
3: '已完成',
|
||||
@@ -97,15 +92,15 @@
|
||||
5: '#a6a6a6',
|
||||
};
|
||||
logList.value.forEach((item) => {
|
||||
item.statusName = statusMap[item.status];
|
||||
item.color = colorMap[item.status];
|
||||
item.src = 'status-' + item.status;
|
||||
item.stateName = stateMap[item.state];
|
||||
item.color = colorMap[item.state];
|
||||
item.src = 'state-' + item.state;
|
||||
});
|
||||
visible.value = true;
|
||||
};
|
||||
return {
|
||||
infoObject,
|
||||
statusOptions,
|
||||
stateOptions,
|
||||
btnClick,
|
||||
visible,
|
||||
logList,
|
||||
|
||||
@@ -1,7 +1,10 @@
|
||||
import { dateUtil } from '/nerv-lib/util/date-util';
|
||||
import data from '../notificationManagementMock.json';
|
||||
import { http } from '/nerv-lib/util';
|
||||
import { gatewayAlarmApi } from '/@/api/alarmManagement/gatewayAlarm';
|
||||
import { ref } from 'vue';
|
||||
import { getEnum } from '/@/api';
|
||||
|
||||
const orgId = ref('');
|
||||
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||
orgId.value = result;
|
||||
const tableKeyMap = [
|
||||
{
|
||||
title: '序号',
|
||||
@@ -12,44 +15,41 @@ const tableKeyMap = [
|
||||
},
|
||||
{
|
||||
title: '告警编号',
|
||||
dataIndex: 'id',
|
||||
dataIndex: 'alarmCode',
|
||||
},
|
||||
{
|
||||
title: '告警描述',
|
||||
dataIndex: 'deviceCode',
|
||||
dataIndex: 'alarmDescription',
|
||||
},
|
||||
{
|
||||
title: '优先级',
|
||||
dataIndex: 'deviceName',
|
||||
dataIndex: 'priority',
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'position',
|
||||
dataIndex: 'alarmLogState',
|
||||
},
|
||||
{
|
||||
title: '错误码',
|
||||
dataIndex: 'position',
|
||||
textEllipsis: true,
|
||||
dataIndex: 'errorCode',
|
||||
},
|
||||
{
|
||||
title: '设备信息',
|
||||
dataIndex: 'position',
|
||||
dataIndex: 'deviceInfo',
|
||||
},
|
||||
{
|
||||
title: '更新时间',
|
||||
dataIndex: 'enableRules',
|
||||
dataIndex: 'updateTime',
|
||||
},
|
||||
{
|
||||
title: '断网时长',
|
||||
dataIndex: 'enableRules',
|
||||
dataIndex: 'durationOfNetworkDisconnection',
|
||||
},
|
||||
];
|
||||
const mockData = ref(data.listData);
|
||||
export const notificationtableConfig = (look: any, status: any) => {
|
||||
return {
|
||||
title: '告警记录',
|
||||
// api: '/carbon_emission/device/getDeviceList',
|
||||
value: mockData.value,
|
||||
api: gatewayAlarmApi.getTableList,
|
||||
headerActions: [{}],
|
||||
columns: tableKeyMap,
|
||||
// rowSelection: null, 选择按钮
|
||||
@@ -78,65 +78,57 @@ export const notificationtableConfig = (look: any, status: any) => {
|
||||
|
||||
formConfig: {
|
||||
schemas: [
|
||||
// {
|
||||
// field: 'name',
|
||||
// label: '告警类型',
|
||||
// component: 'NsSelect',
|
||||
// defaultValue: '2',
|
||||
// componentProps: {
|
||||
// placeholder: '请选择告警优先级',
|
||||
// disabled: true, // 不可选择
|
||||
// options: [
|
||||
// {
|
||||
// label: '紧急',
|
||||
// value: '1',
|
||||
// },
|
||||
// {
|
||||
// label: '重要',
|
||||
// value: '2',
|
||||
// },
|
||||
// {
|
||||
// label: '一般',
|
||||
// value: '3',
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
// },
|
||||
{
|
||||
field: 'name',
|
||||
label: '告警类型',
|
||||
component: 'NsSelect',
|
||||
defaultValue: '2',
|
||||
componentProps: {
|
||||
placeholder: '请选择告警优先级',
|
||||
disabled: true,
|
||||
options: [
|
||||
{
|
||||
label: '紧急',
|
||||
value: '1',
|
||||
},
|
||||
{
|
||||
label: '重要',
|
||||
value: '2',
|
||||
},
|
||||
{
|
||||
label: '一般',
|
||||
value: '3',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'provider',
|
||||
field: 'alarmLogState',
|
||||
label: '状态',
|
||||
component: 'NsSelect',
|
||||
component: 'nsSelectApi',
|
||||
// dynamicParams: {
|
||||
// id: 'deviceName', //帮定上级联动数据
|
||||
// },
|
||||
componentProps: {
|
||||
api: () => getEnum({ params: { enumType: 'AlarmLogStateEnum' } }),
|
||||
immediate: true,
|
||||
allowClear: true,
|
||||
resultField: 'data',
|
||||
labelField: 'label',
|
||||
valueField: 'value',
|
||||
placeholder: '请选择状态',
|
||||
options: [
|
||||
{
|
||||
label: '待处理',
|
||||
value: '1',
|
||||
},
|
||||
{
|
||||
label: '处理中',
|
||||
value: '2',
|
||||
},
|
||||
{
|
||||
label: '已完成',
|
||||
value: '3',
|
||||
},
|
||||
{
|
||||
label: '超时',
|
||||
value: '4',
|
||||
},
|
||||
{
|
||||
label: '关闭',
|
||||
value: '5',
|
||||
},
|
||||
],
|
||||
showSearch: true,
|
||||
filterOption: (input: string, option: any) => {
|
||||
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
||||
},
|
||||
// autoSelectFirst: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'createTime',
|
||||
label: '数据日期',
|
||||
component: 'NsRangePicker',
|
||||
fieldMap: ['manufactureBeginDate', 'manufactureEndDate'],
|
||||
fieldMap: ['startTime', 'endTime'],
|
||||
componentProps: {
|
||||
valueFormat: 'YYYY-MM-DD',
|
||||
placeholder: ['开始日期', '结束日期'],
|
||||
@@ -144,6 +136,7 @@ export const notificationtableConfig = (look: any, status: any) => {
|
||||
},
|
||||
],
|
||||
},
|
||||
params: { orgId: orgId.value },
|
||||
// pagination: { pageSizeOptions: false },
|
||||
rowKey: 'id',
|
||||
};
|
||||
|
||||
@@ -52,27 +52,27 @@ export const formConfig = (disabled) => {
|
||||
options: [
|
||||
{
|
||||
label: 'CO2',
|
||||
value: 'CO2',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: 'CO2e',
|
||||
value: 'CO2e',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: 'SF6',
|
||||
value:'SF6',
|
||||
value: 3,
|
||||
},
|
||||
{
|
||||
label: 'CH4',
|
||||
value: 'CH4',
|
||||
value: 4,
|
||||
},
|
||||
{
|
||||
label: 'PFCs',
|
||||
value: 'PFCs',
|
||||
value: 5,
|
||||
},
|
||||
{
|
||||
label: 'HFCs',
|
||||
value: 'HFCs',
|
||||
value: 6,
|
||||
},
|
||||
],
|
||||
},
|
||||
@@ -195,7 +195,8 @@ export const formConfig = (disabled) => {
|
||||
component: 'NsTextarea',
|
||||
componentProps: {
|
||||
placeholder: '请输入参考文献',
|
||||
maxLength: 20,
|
||||
maxLength: 300,
|
||||
showCount: true,
|
||||
},
|
||||
},
|
||||
],
|
||||
|
||||
@@ -4,16 +4,15 @@
|
||||
<div class="main">
|
||||
<div class="left">
|
||||
<div class="top">
|
||||
<a-form style="width: 100%;margin: 0 auto;">
|
||||
<a-form style="width: 100%; margin: 0 auto">
|
||||
<div class="ns-form-title"><div class="title">排放分类</div></div>
|
||||
<div style="padding: 0 16px !important;width: 100%;">
|
||||
<div style="padding: 0 16px !important; width: 100%">
|
||||
<a-row>
|
||||
<a-col :span="24" style="margin-bottom: 16px;">
|
||||
<a-col :span="24" style="margin-bottom: 16px">
|
||||
<a-input-search
|
||||
v-model:value="selectTreeDataValue"
|
||||
placeholder="请输入关键词"
|
||||
@search="onSearchTreeData"
|
||||
/>
|
||||
@search="onSearchTreeData" />
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
@@ -21,7 +20,7 @@
|
||||
<a-tree
|
||||
v-if="gData && gData.length > 0"
|
||||
class="draggable-tree"
|
||||
style="padding: 0 16px !important;"
|
||||
style="padding: 0 16px !important"
|
||||
draggable
|
||||
show-line
|
||||
checkable
|
||||
@@ -39,10 +38,21 @@
|
||||
<template #title="data">
|
||||
<div class="treeRow">
|
||||
<div>
|
||||
<span v-if="data.emissionName && selectTreeDataValue && data.emissionName.indexOf(selectTreeDataValue) > -1">
|
||||
{{ data.emissionName.substring(0, data.emissionName.indexOf(selectTreeDataValue)) }}
|
||||
<span style="color: #f50" >{{ selectTreeDataValue }}</span>
|
||||
{{ data.emissionName.substring(data.emissionName.indexOf(selectTreeDataValue) + selectTreeDataValue.length) }}
|
||||
<span
|
||||
v-if="
|
||||
data.emissionName &&
|
||||
selectTreeDataValue &&
|
||||
data.emissionName.indexOf(selectTreeDataValue) > -1
|
||||
">
|
||||
{{
|
||||
data.emissionName.substring(0, data.emissionName.indexOf(selectTreeDataValue))
|
||||
}}
|
||||
<span style="color: #f50">{{ selectTreeDataValue }}</span>
|
||||
{{
|
||||
data.emissionName.substring(
|
||||
data.emissionName.indexOf(selectTreeDataValue) + selectTreeDataValue.length,
|
||||
)
|
||||
}}
|
||||
</span>
|
||||
<span v-else>{{ data.emissionName }}</span>
|
||||
</div>
|
||||
@@ -50,7 +60,7 @@
|
||||
<ns-icon name="actionMore" size="14" class="actionMore" />
|
||||
<template #overlay>
|
||||
<a-menu>
|
||||
<a-menu-item @click="editTreeNodeData">编辑</a-menu-item>
|
||||
<a-menu-item @click="editTreeNodeData(data)">编辑</a-menu-item>
|
||||
<a-menu-item @click="addTreeNodeData">新增子节点</a-menu-item>
|
||||
<a-menu-item>上移</a-menu-item>
|
||||
<a-menu-item>下移</a-menu-item>
|
||||
@@ -62,19 +72,22 @@
|
||||
</template>
|
||||
</a-tree>
|
||||
<div class="addTreeNode">
|
||||
<a-button type="primary" style="width:100%;" @click="addTreeNodeData">新增</a-button>
|
||||
<a-button type="primary" style="width: 100%" @click="addTreeNodeData">新增</a-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<ns-view-list-table v-bind="tableConfig" :model="data" ref="mainRef" :scroll="{ x: 2000}"/>
|
||||
<ns-view-list-table v-bind="tableConfig" :model="data" ref="mainRef" :scroll="{ x: 2000 }">
|
||||
<template #bodyCell="{ record, column }">
|
||||
<template v-if="column.dataIndex === 'emissionGas'">
|
||||
{{ record.emissionGas.label }}
|
||||
</template>
|
||||
</template>
|
||||
</ns-view-list-table>
|
||||
</div>
|
||||
<!-- 新增树节点 -->
|
||||
<ns-modal :visible="treeNodeAdd" :title="operationTree" @ok="handleOk" @cancel="handleCancel">
|
||||
<ns-input
|
||||
v-model:value="addTreeNode"
|
||||
class="input"
|
||||
placeholder="请输入排放类型"/>
|
||||
<ns-input v-model:value="addTreeNode" class="input" placeholder="请输入排放类型" />
|
||||
</ns-modal>
|
||||
<!-- 新增数据库数据 -->
|
||||
<a-drawer
|
||||
@@ -111,15 +124,21 @@
|
||||
<a-button type="primary" @click="addUnit">新增单位</a-button>
|
||||
</div>
|
||||
<div class="treePart">
|
||||
<div style="width: 100%;height: 7%;display: flex;justify-content: center;align-items: center;">
|
||||
<div
|
||||
style="
|
||||
width: 100%;
|
||||
height: 7%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
">
|
||||
<a-select
|
||||
ref="select"
|
||||
:value="unitTreeParams.id"
|
||||
allowClear
|
||||
style="width: 96%"
|
||||
placeholder="选择分组"
|
||||
@change="handleChange"
|
||||
>
|
||||
@change="handleChange">
|
||||
<a-select-option v-for="(item, index) in groupData" :key="index" :value="item.id">
|
||||
{{ item.cnValue }}
|
||||
</a-select-option>
|
||||
@@ -140,8 +159,11 @@
|
||||
<div class="actionMore">
|
||||
<EditOutlined v-if="!data.parentId" @click="editGroup(data)" />
|
||||
<EditOutlined v-else @click="editUnit(data)" />
|
||||
<MinusCircleOutlined style="margin-left: 6px;" @click="delUnit(data)" />
|
||||
<PlusCircleOutlined v-if="!data.parentId" style="margin-left: 6px;" @click="addUnit(data)" />
|
||||
<MinusCircleOutlined style="margin-left: 6px" @click="delUnit(data)" />
|
||||
<PlusCircleOutlined
|
||||
v-if="!data.parentId"
|
||||
style="margin-left: 6px"
|
||||
@click="addUnit(data)" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -152,31 +174,32 @@
|
||||
</template>
|
||||
</a-drawer>
|
||||
<!-- 新增分组管理 -->
|
||||
<ns-modal :visible="addGroupManage" :title="addGroupTitle" @ok="unitOrGroupOk" @cancel="groupCancel">
|
||||
<a-form
|
||||
ref="unitFormRef"
|
||||
:model="formState"
|
||||
:label-col="labelCol"
|
||||
:wrapper-col="wrapperCol"
|
||||
>
|
||||
<ns-modal
|
||||
:visible="addGroupManage"
|
||||
:title="addGroupTitle"
|
||||
@ok="unitOrGroupOk"
|
||||
@cancel="groupCancel">
|
||||
<a-form ref="unitFormRef" :model="formState" :label-col="labelCol" :wrapper-col="wrapperCol">
|
||||
<a-form-item label="分组名称" name="cnValue" :required="true">
|
||||
<a-input v-model:value="formState.cnValue" placeholder="请输入分组名称" />
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</ns-modal>
|
||||
<!-- 新增单位 -->
|
||||
<ns-modal :visible="addUnitManage" :title="addUnitTitle" @ok="unitOrGroupOk" @cancel="unitCancel">
|
||||
<a-form
|
||||
ref="unitFormRef"
|
||||
:model="formState"
|
||||
:label-col="labelCol"
|
||||
:wrapper-col="wrapperCol"
|
||||
>
|
||||
<ns-modal
|
||||
:visible="addUnitManage"
|
||||
:title="addUnitTitle"
|
||||
@ok="unitOrGroupOk"
|
||||
@cancel="unitCancel">
|
||||
<a-form ref="unitFormRef" :model="formState" :label-col="labelCol" :wrapper-col="wrapperCol">
|
||||
<a-form-item label="单位名称" name="cnValue" :required="true">
|
||||
<a-input v-model:value="formState.cnValue" placeholder="请输入单位名称" />
|
||||
</a-form-item>
|
||||
<a-form-item label="选择分组" name="parentId" :required="true">
|
||||
<a-select v-model:value="formState.parentId" placeholder="请选择所属分组" :disabled="canSelect">
|
||||
<a-select
|
||||
v-model:value="formState.parentId"
|
||||
placeholder="请选择所属分组"
|
||||
:disabled="canSelect">
|
||||
<a-select-option v-for="(item, index) in groupData" :key="index" :value="item.id">
|
||||
{{ item.cnValue }}
|
||||
</a-select-option>
|
||||
@@ -187,12 +210,17 @@
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { MoreOutlined,ExclamationCircleOutlined,EditOutlined,PlusCircleOutlined,MinusCircleOutlined } from '@ant-design/icons-vue';
|
||||
import {
|
||||
ExclamationCircleOutlined,
|
||||
EditOutlined,
|
||||
PlusCircleOutlined,
|
||||
MinusCircleOutlined,
|
||||
} from '@ant-design/icons-vue';
|
||||
import { Modal } from 'ant-design-vue';
|
||||
import { computed, createVNode, defineComponent, reactive, ref, watchEffect,watch,toRaw } from 'vue';
|
||||
import { computed, createVNode, reactive, ref, watchEffect, watch, toRaw } from 'vue';
|
||||
import { http } from '/nerv-lib/util/http';
|
||||
import { NsMessage, NsModal } from '/nerv-lib/component';
|
||||
import { formConfig, formConfig2 } from './config';
|
||||
import { NsMessage } from '/nerv-lib/component';
|
||||
import { formConfig } from './config';
|
||||
import { carbonEmissionFactorLibrary } from '/@/api/carbonEmissionFactorLibrary';
|
||||
import type {
|
||||
AntTreeNodeDragEnterEvent,
|
||||
@@ -202,10 +230,21 @@
|
||||
import { log } from 'node:console';
|
||||
|
||||
defineOptions({ name: 'OrderListIndex' });
|
||||
const orgId = ref('');
|
||||
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||
orgId.value = result;
|
||||
const dynamicDisabled = computed(() => {
|
||||
return formRef.value?.validateResult && userAuthList.value?.length;
|
||||
});
|
||||
const fetch = (api, params = { orgId }) => {
|
||||
return http.post(api, params);
|
||||
};
|
||||
const selectTreeDataValue = ref<string>('');
|
||||
const mainRef = ref();
|
||||
const data = reactive({});
|
||||
let formData = ref({});
|
||||
let formData = ref({
|
||||
orgId: orgId.value,
|
||||
});
|
||||
const formRef = ref();
|
||||
const visible = ref(false);
|
||||
const unitManagement = ref(false);
|
||||
@@ -214,7 +253,7 @@
|
||||
const disabled = ref(false);
|
||||
const treeNodeAdd = ref<boolean>(false);
|
||||
const operationTree = ref<string>('新增');
|
||||
const showOperation = ref(false)
|
||||
const showOperation = ref(false);
|
||||
|
||||
const opMap: any = ref({
|
||||
type: 'add',
|
||||
@@ -228,15 +267,6 @@
|
||||
const casData = ref([]);
|
||||
const treeData = ref([]);
|
||||
const userAuthList = ref([]);
|
||||
const orgId = ref('');
|
||||
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||
orgId.value = result;
|
||||
const dynamicDisabled = computed(() => {
|
||||
return formRef.value?.validateResult && userAuthList.value?.length;
|
||||
});
|
||||
const fetch = (api, params = { orgId }) => {
|
||||
return http.post(api, params);
|
||||
};
|
||||
|
||||
// 树结构
|
||||
const x = 3;
|
||||
@@ -352,7 +382,7 @@
|
||||
for (let i = 0; i < tree.length; i++) {
|
||||
const node = tree[i];
|
||||
if (node.children) {
|
||||
if (node.children.some(item => item.key === key)) {
|
||||
if (node.children.some((item) => item.key === key)) {
|
||||
parentKey = node.key;
|
||||
} else if (getParentKey(key, node.children)) {
|
||||
parentKey = getParentKey(key, node.children);
|
||||
@@ -368,7 +398,7 @@
|
||||
expandedKeys.value = keys;
|
||||
autoExpandParent.value = false;
|
||||
};
|
||||
watch(selectTreeDataValue, value => {
|
||||
watch(selectTreeDataValue, (value) => {
|
||||
const expanded = dataList
|
||||
.map((item: TreeProps['treeData'][number]) => {
|
||||
if (item.title.indexOf(value) > -1) {
|
||||
@@ -387,69 +417,70 @@
|
||||
console.log('or use this.value', value.value);
|
||||
};
|
||||
// 点击数据点的复选框
|
||||
const checkedIds = ref([])
|
||||
const emissionType = ref()
|
||||
const checkedIds = ref([]);
|
||||
const emissionType = ref();
|
||||
const checkTreeNode = (checkedKeys, info) => {
|
||||
checkedTreeNodeKeys.value = checkedKeys
|
||||
checkedIds.value = []
|
||||
info.checkedNodes.forEach(item=>{
|
||||
checkedIds.value.push(item.id)
|
||||
})
|
||||
checkedTreeNodeKeys.value = checkedKeys;
|
||||
checkedIds.value = [];
|
||||
info.checkedNodes.forEach((item) => {
|
||||
checkedIds.value.push(item.id);
|
||||
});
|
||||
sessionStorage.setItem('checkedTreeNode', checkedIds.value);
|
||||
emissionType.value = checkedIds.value.join(',')
|
||||
emissionType.value = checkedIds.value.join(',');
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
}
|
||||
};
|
||||
// 点击新增树节点
|
||||
const addTreeNodeData = () => {
|
||||
operationTree.value='新增'
|
||||
operationTree.value = '新增';
|
||||
treeNodeAdd.value = true;
|
||||
editTreeNode.value.type = 'create'
|
||||
editTreeNode.value.type = 'create';
|
||||
};
|
||||
// 编辑树节点
|
||||
const editTreeNodeData = () => {
|
||||
operationTree.value='编辑'
|
||||
const editTreeNodeData = (data) => {
|
||||
operationTree.value = '编辑';
|
||||
treeNodeAdd.value = true;
|
||||
editTreeNode.value.type = 'update'
|
||||
}
|
||||
editTreeNode.value.type = 'update';
|
||||
addTreeNode.value = data.emissionName;
|
||||
};
|
||||
// 删除树节点
|
||||
const deleteTreeNode = () => {
|
||||
Modal.confirm({
|
||||
title: '警告',
|
||||
icon: createVNode(ExclamationCircleOutlined),
|
||||
content: '确定要删除么?',
|
||||
okText: '确认',
|
||||
okType: 'primary',
|
||||
cancelText: '取消',
|
||||
onOk() {
|
||||
http.post(carbonEmissionFactorLibrary.delTreeNode,editTreeNode.value).then(() => {
|
||||
getOrgTree()
|
||||
NsMessage.success('操作成功');
|
||||
});
|
||||
},
|
||||
onCancel() {
|
||||
console.log('Cancel');
|
||||
},
|
||||
});
|
||||
}
|
||||
title: '警告',
|
||||
icon: createVNode(ExclamationCircleOutlined),
|
||||
content: '确定要删除么?',
|
||||
okText: '确认',
|
||||
okType: 'primary',
|
||||
cancelText: '取消',
|
||||
onOk() {
|
||||
http.post(carbonEmissionFactorLibrary.delTreeNode, editTreeNode.value).then(() => {
|
||||
getOrgTree();
|
||||
NsMessage.success('操作成功');
|
||||
});
|
||||
},
|
||||
onCancel() {
|
||||
console.log('Cancel');
|
||||
},
|
||||
});
|
||||
};
|
||||
// 新增/编辑树节点点击确定
|
||||
const addTreeNode =ref()
|
||||
const addTreeNode = ref();
|
||||
const handleOk = (e: MouseEvent) => {
|
||||
editTreeNode.value.emissionName = addTreeNode.value
|
||||
http.post(carbonEmissionFactorLibrary.creat,editTreeNode.value).then(() => {
|
||||
getOrgTree()
|
||||
editTreeNode.value.emissionName = addTreeNode.value;
|
||||
http.post(carbonEmissionFactorLibrary.creat, editTreeNode.value).then(() => {
|
||||
getOrgTree();
|
||||
NsMessage.success('操作成功');
|
||||
addTreeNode.value = ''
|
||||
addTreeNode.value = '';
|
||||
treeNodeAdd.value = false;
|
||||
});
|
||||
};
|
||||
const handleCancel = () => {
|
||||
addTreeNode.value = ''
|
||||
addTreeNode.value = '';
|
||||
treeNodeAdd.value = false;
|
||||
};
|
||||
// 获取排放分类树
|
||||
const getOrgTree = (params?) => {
|
||||
fetch(carbonEmissionFactorLibrary.getCarbonFactorTree, params).then((res) => {
|
||||
gData.value = res.data
|
||||
const getOrgTree = () => {
|
||||
fetch(carbonEmissionFactorLibrary.getCarbonFactorTree, { orgId: orgId.value }).then((res) => {
|
||||
gData.value = res.data;
|
||||
// 找到匹配的节点数据
|
||||
// const selectedNodes = [];
|
||||
// checkedTreeNodeKeys.value.forEach(key => {
|
||||
@@ -462,31 +493,31 @@
|
||||
// getDefaultIds(selectedNodes)
|
||||
});
|
||||
};
|
||||
const defaultIds = ref([])
|
||||
const defaultIds = ref([]);
|
||||
const getDefaultIds = (selectedNodes) => {
|
||||
selectedNodes.forEach(items => {
|
||||
defaultIds.value.push(items.id)
|
||||
if(items.children){
|
||||
getDefaultIds(items.children)
|
||||
selectedNodes.forEach((items) => {
|
||||
defaultIds.value.push(items.id);
|
||||
if (items.children) {
|
||||
getDefaultIds(items.children);
|
||||
}
|
||||
})
|
||||
emissionType.value = defaultIds.value.join(',')
|
||||
checkedIds.value = defaultIds.value
|
||||
});
|
||||
emissionType.value = defaultIds.value.join(',');
|
||||
checkedIds.value = defaultIds.value;
|
||||
sessionStorage.setItem('checkedTreeNode', checkedIds.value);
|
||||
}
|
||||
};
|
||||
getOrgTree();
|
||||
// 被选中的树节点
|
||||
const editTreeNode = ref({})
|
||||
const editTreeNode = ref({});
|
||||
const onSelect = (selectedKeys: string[], info: any) => {
|
||||
if(info.selected){
|
||||
showOperation.value = true
|
||||
if (info.selected) {
|
||||
showOperation.value = true;
|
||||
editTreeNode.value = {
|
||||
id:info.selectedNodes[0].id,
|
||||
level:info.selectedNodes[0].level,
|
||||
dataNumber:info.selectedNodes[0].dataNumber,
|
||||
sortNumber:info.selectedNodes[0].sortNumber,
|
||||
parentEmissionId:info.selectedNodes[0].parentEmissionId,
|
||||
}
|
||||
id: info.selectedNodes[0].id,
|
||||
level: info.selectedNodes[0].level,
|
||||
dataNumber: info.selectedNodes[0].dataNumber,
|
||||
sortNumber: info.selectedNodes[0].sortNumber,
|
||||
parentEmissionId: info.selectedNodes[0].parentEmissionId,
|
||||
};
|
||||
}
|
||||
};
|
||||
|
||||
@@ -509,13 +540,14 @@
|
||||
};
|
||||
|
||||
const handleSelect = (selectedKeys: any, info: any) => {
|
||||
fetch(carbonEmissionFactorLibrary.queryDeptTree, { orgId: info.node?.orgInfo.orgId }).then((res) => {
|
||||
treeData2.value = res.data;
|
||||
});
|
||||
fetch(carbonEmissionFactorLibrary.queryDeptTree, { orgId: info.node?.orgInfo.orgId }).then(
|
||||
(res) => {
|
||||
treeData2.value = res.data;
|
||||
},
|
||||
);
|
||||
tableFetch({ orgId: info.node?.orgInfo.orgId });
|
||||
};
|
||||
|
||||
|
||||
const onClose = () => {
|
||||
visible.value = false;
|
||||
formData.value = {};
|
||||
@@ -523,8 +555,8 @@
|
||||
};
|
||||
const closeUnitManag = () => {
|
||||
unitTreeParams.value = {
|
||||
grp: 'MEASUREMENT_UNIT'
|
||||
}
|
||||
grp: 'MEASUREMENT_UNIT',
|
||||
};
|
||||
unitManagement.value = false;
|
||||
};
|
||||
const onEdit = () => {
|
||||
@@ -535,8 +567,7 @@
|
||||
// return;
|
||||
// }
|
||||
|
||||
opMap.value.fuc &&
|
||||
opMap.value.fuc({ ...formData.value });
|
||||
opMap.value.fuc && opMap.value.fuc({ ...formData.value });
|
||||
});
|
||||
};
|
||||
const tableConfig = ref({
|
||||
@@ -544,7 +575,7 @@
|
||||
api: carbonEmissionFactorLibrary.getTableList,
|
||||
params: {
|
||||
orgId,
|
||||
emissionType
|
||||
emissionType,
|
||||
},
|
||||
headerActions: [
|
||||
{
|
||||
@@ -555,14 +586,13 @@
|
||||
opMap.value.type = 'add';
|
||||
setTimeout(() => {
|
||||
formData.value = {
|
||||
carbonEmissionPrefix:'t',
|
||||
numberOfReferences:'10'
|
||||
carbonEmissionPrefix: 't',
|
||||
numberOfReferences: '10',
|
||||
};
|
||||
userAuthList.value.splice(0);
|
||||
});
|
||||
opMap.value.fuc = (formData: any) => {
|
||||
formData.emissionType = formData.emissionType[formData.emissionType.length - 1]
|
||||
debugger
|
||||
formData.emissionType = formData.emissionType[formData.emissionType.length - 1];
|
||||
return http.post(carbonEmissionFactorLibrary.creatOrUpdate, formData).then(() => {
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
visible.value = false;
|
||||
@@ -601,11 +631,13 @@
|
||||
type: 'primary',
|
||||
name: 'userAdd',
|
||||
handle: () => {
|
||||
unitManagement.value = true,
|
||||
fetch(carbonEmissionFactorLibrary.findOutermost).then((res) => {
|
||||
groupData.value = res.data
|
||||
});
|
||||
getUnitTree()
|
||||
(unitManagement.value = true),
|
||||
fetch(carbonEmissionFactorLibrary.findOutermost, { grp: 'MEASUREMENT_UNIT' }).then(
|
||||
(res) => {
|
||||
groupData.value = res.data;
|
||||
},
|
||||
);
|
||||
getUnitTree();
|
||||
},
|
||||
},
|
||||
],
|
||||
@@ -666,14 +698,14 @@
|
||||
handle: (record: any) => {
|
||||
userAuthList.value.splice(0);
|
||||
setTimeout(() => {
|
||||
const measurementUnit = ref([])
|
||||
http.post(carbonEmissionFactorLibrary.getCarbonFactorTree,{}).then((res) => {
|
||||
measurementUnit.value = res.data
|
||||
http.post(carbonEmissionFactorLibrary.findById,{ id: record.id } ).then((res) => {
|
||||
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
|
||||
res.data.emissionType = selectDevice;
|
||||
}
|
||||
formData.value = res.data;
|
||||
});
|
||||
@@ -681,7 +713,10 @@
|
||||
}, 10);
|
||||
opMap.value.type = 'edit';
|
||||
opMap.value.fuc = (formData: any) => {
|
||||
formData.emissionType = formData.emissionType[formData.emissionType.length - 1]
|
||||
formData.emissionType = formData.emissionType[formData.emissionType.length - 1];
|
||||
if (formData.emissionGas.value) {
|
||||
formData.emissionGas = formData.emissionGas.value;
|
||||
}
|
||||
return http.post(carbonEmissionFactorLibrary.creatOrUpdate, formData).then(() => {
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
visible.value = false;
|
||||
@@ -739,27 +774,27 @@
|
||||
options: [
|
||||
{
|
||||
label: 'CO2',
|
||||
value: '1',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: 'CO2e',
|
||||
value: '2',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: 'SF6',
|
||||
value:'3',
|
||||
value: 3,
|
||||
},
|
||||
{
|
||||
label: 'CH4',
|
||||
value: '4',
|
||||
value: 4,
|
||||
},
|
||||
{
|
||||
label: 'PFCs',
|
||||
value: '5',
|
||||
value: 5,
|
||||
},
|
||||
{
|
||||
label: 'HFCs',
|
||||
value: '6',
|
||||
value: 6,
|
||||
},
|
||||
],
|
||||
},
|
||||
@@ -806,9 +841,9 @@
|
||||
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){
|
||||
} 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
|
||||
@@ -820,24 +855,26 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// 单位管理
|
||||
const unitExpandedKeys = ref<string[]>();
|
||||
const unitSelectedKeys = ref<string[]>([]);
|
||||
const unitTreeParams = ref({
|
||||
grp: 'MEASUREMENT_UNIT'
|
||||
})
|
||||
const groupData = ref([])
|
||||
const unitTreeParams = ref({
|
||||
grp: 'MEASUREMENT_UNIT',
|
||||
});
|
||||
const groupData = ref([]);
|
||||
const unitTreeData = ref<TreeProps['treeData']>(genData);
|
||||
const handleChange = (value: string) => {
|
||||
unitTreeParams.value.id = value
|
||||
getUnitTree()
|
||||
unitTreeParams.value.id = value;
|
||||
getUnitTree();
|
||||
};
|
||||
const getUnitTree = () => {
|
||||
fetch(carbonEmissionFactorLibrary.dictionaryUnitManagement, unitTreeParams.value).then((res) => {
|
||||
unitTreeData.value = res.data
|
||||
});
|
||||
}
|
||||
fetch(carbonEmissionFactorLibrary.dictionaryUnitManagement, unitTreeParams.value).then(
|
||||
(res) => {
|
||||
unitTreeData.value = res.data;
|
||||
},
|
||||
);
|
||||
};
|
||||
// 新增单位管理
|
||||
const labelCol = { span: 5 };
|
||||
const wrapperCol = { span: 19 };
|
||||
@@ -848,100 +885,100 @@
|
||||
const formState = ref({
|
||||
grp: 'MEASUREMENT_UNIT',
|
||||
grpDesc: '计量单位',
|
||||
})
|
||||
});
|
||||
const addGroupTitle = ref<string>('新增分组');
|
||||
const addUnitTitle = ref<string>('新增单位');
|
||||
const addGroup = () => {
|
||||
addGroupTitle.value = '新增分组'
|
||||
addGroupManage.value = true
|
||||
addGroupTitle.value = '新增分组';
|
||||
addGroupManage.value = true;
|
||||
};
|
||||
const editGroup = (data) => {
|
||||
addGroupTitle.value = '编辑分组'
|
||||
addGroupManage.value = true
|
||||
formState.value.id = data.id
|
||||
formState.value.cnValue = data.cnValue
|
||||
addGroupTitle.value = '编辑分组';
|
||||
addGroupManage.value = true;
|
||||
formState.value.id = data.id;
|
||||
formState.value.cnValue = data.cnValue;
|
||||
};
|
||||
const groupCancel = () => {
|
||||
addGroupManage.value = false
|
||||
addGroupManage.value = false;
|
||||
unitFormRef.value.resetFields();
|
||||
formState.value = {
|
||||
grp: 'MEASUREMENT_UNIT',
|
||||
grpDesc: '计量单位',
|
||||
}
|
||||
};
|
||||
};
|
||||
const addUnit = (data) => {
|
||||
if(data.id){
|
||||
canSelect.value = true
|
||||
formState.value.parentId = data.id
|
||||
}else{
|
||||
canSelect.value = false
|
||||
if (data.id) {
|
||||
canSelect.value = true;
|
||||
formState.value.parentId = data.id;
|
||||
} else {
|
||||
canSelect.value = false;
|
||||
}
|
||||
fetch(carbonEmissionFactorLibrary.findOutermost).then((res) => {
|
||||
groupData.value = res.data
|
||||
groupData.value = res.data;
|
||||
});
|
||||
addUnitTitle.value = '新增单位'
|
||||
addUnitManage.value = true
|
||||
addUnitTitle.value = '新增单位';
|
||||
addUnitManage.value = true;
|
||||
};
|
||||
const editUnit = (data) => {
|
||||
addUnitTitle.value = '编辑单位'
|
||||
addUnitManage.value = true
|
||||
canSelect.value = true
|
||||
formState.value.parentId = data.parentId
|
||||
formState.value.id = data.id
|
||||
formState.value.cnValue = data.cnValue
|
||||
addUnitTitle.value = '编辑单位';
|
||||
addUnitManage.value = true;
|
||||
canSelect.value = true;
|
||||
formState.value.parentId = data.parentId;
|
||||
formState.value.id = data.id;
|
||||
formState.value.cnValue = data.cnValue;
|
||||
};
|
||||
const unitCancel = () => {
|
||||
addUnitManage.value = false
|
||||
addUnitManage.value = false;
|
||||
unitFormRef.value.resetFields();
|
||||
formState.value = {
|
||||
grp: 'MEASUREMENT_UNIT',
|
||||
grpDesc: '计量单位',
|
||||
}
|
||||
};
|
||||
};
|
||||
const unitOrGroupOk = () => {
|
||||
unitFormRef.value
|
||||
.validate()
|
||||
.then(() => {
|
||||
console.log('values', formState, toRaw(formState));
|
||||
if(formState.value.id){
|
||||
if (formState.value.id) {
|
||||
fetch(carbonEmissionFactorLibrary.updateDictionary, formState.value).then((res) => {
|
||||
unitTreeData.value = res.data
|
||||
if(formState.value.parentId){
|
||||
addUnitManage.value = false
|
||||
}else{
|
||||
addGroupManage.value = false
|
||||
unitTreeData.value = res.data;
|
||||
if (formState.value.parentId) {
|
||||
addUnitManage.value = false;
|
||||
} else {
|
||||
addGroupManage.value = false;
|
||||
}
|
||||
unitFormRef.value.resetFields();
|
||||
formState.value = {
|
||||
grp: 'MEASUREMENT_UNIT',
|
||||
grpDesc: '计量单位',
|
||||
}
|
||||
getUnitTree()
|
||||
};
|
||||
getUnitTree();
|
||||
});
|
||||
}else{
|
||||
} else {
|
||||
fetch(carbonEmissionFactorLibrary.createDictionary, formState.value).then((res) => {
|
||||
unitTreeData.value = res.data
|
||||
if(formState.value.parentId){
|
||||
addUnitManage.value = false
|
||||
}else{
|
||||
addGroupManage.value = false
|
||||
unitTreeData.value = res.data;
|
||||
if (formState.value.parentId) {
|
||||
addUnitManage.value = false;
|
||||
} else {
|
||||
addGroupManage.value = false;
|
||||
}
|
||||
unitFormRef.value.resetFields();
|
||||
formState.value = {
|
||||
grp: 'MEASUREMENT_UNIT',
|
||||
grpDesc: '计量单位',
|
||||
}
|
||||
getUnitTree()
|
||||
};
|
||||
getUnitTree();
|
||||
});
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
.catch((error) => {
|
||||
console.log('error', error);
|
||||
});
|
||||
};
|
||||
// 删除单位管理的树节点
|
||||
const delUnit = (data) => {
|
||||
formState.value.id = data.id
|
||||
formState.value.id = data.id;
|
||||
Modal.confirm({
|
||||
title: '警告',
|
||||
content: '确定要删除吗?',
|
||||
@@ -949,9 +986,9 @@
|
||||
okType: 'primary',
|
||||
cancelText: '取消',
|
||||
onOk() {
|
||||
fetch(carbonEmissionFactorLibrary.delDictionary , formState.value).then((res) => {
|
||||
fetch(carbonEmissionFactorLibrary.delDictionary, formState.value).then((res) => {
|
||||
message.success('操作成功!');
|
||||
getUnitTree()
|
||||
getUnitTree();
|
||||
});
|
||||
},
|
||||
onCancel() {
|
||||
@@ -959,7 +996,6 @@
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.main {
|
||||
@@ -979,9 +1015,9 @@
|
||||
}
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.top{
|
||||
.top {
|
||||
position: relative;
|
||||
.addTreeNode{
|
||||
.addTreeNode {
|
||||
width: 100%;
|
||||
padding: 16px;
|
||||
position: absolute;
|
||||
@@ -999,7 +1035,7 @@
|
||||
// border-bottom: 5px solid rgb(229, 235, 240);
|
||||
// overflow-y: auto;
|
||||
}
|
||||
.ns-form-title{
|
||||
.ns-form-title {
|
||||
font-weight: bold;
|
||||
user-select: text;
|
||||
padding: 16px;
|
||||
@@ -1007,7 +1043,7 @@
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 1px solid #e9e9e9;
|
||||
}
|
||||
.title{
|
||||
.title {
|
||||
text-align: left;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
@@ -1025,21 +1061,21 @@
|
||||
height: 13px;
|
||||
width: 3px;
|
||||
border-radius: 1px;
|
||||
background-color: #2778FF;
|
||||
background-color: #2778ff;
|
||||
}
|
||||
.treeRow {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.addButton{
|
||||
.addButton {
|
||||
width: 70%;
|
||||
height: 5vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
.treePart{
|
||||
.treePart {
|
||||
width: 70%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
|
||||
@@ -1,20 +1,24 @@
|
||||
<template>
|
||||
<div>
|
||||
<a-table
|
||||
:columns="column"
|
||||
:data-source="data"
|
||||
<a-table
|
||||
:columns="column"
|
||||
:data-source="data"
|
||||
bordered
|
||||
:pagination="false"
|
||||
:scroll="{ x: 2000 }">
|
||||
:scroll="{ x: 2000, y: 480 }">
|
||||
<template #title>
|
||||
<a-date-picker v-model:value="selectYear" picker="year" @change="changeYearData" valueFormat="YYYY" />
|
||||
<a-date-picker
|
||||
v-model:value="selectYear"
|
||||
picker="year"
|
||||
@change="changeYearData"
|
||||
valueFormat="YYYY" />
|
||||
</template>
|
||||
</a-table>
|
||||
<a-pagination
|
||||
<a-pagination
|
||||
:current="queryParams.pageNum"
|
||||
:total="total"
|
||||
:page-size="queryParams.pageSize"
|
||||
style="display: flex;justify-content: center;margin-top: 16px;"
|
||||
style="display: flex; justify-content: center; margin-top: 16px"
|
||||
:show-size-changer="true"
|
||||
:show-quick-jumper="true"
|
||||
@change="onChange" />
|
||||
@@ -35,26 +39,26 @@
|
||||
const orgId = ref('');
|
||||
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||
orgId.value = result;
|
||||
const fetch = (api, params = { orgId } ) => {
|
||||
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 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
|
||||
})
|
||||
|
||||
orgId: orgId.value,
|
||||
});
|
||||
|
||||
// 年份选择改变触发
|
||||
const changeYearData = () => {
|
||||
queryParams.value.year = selectYear.value
|
||||
getTableList()
|
||||
}
|
||||
queryParams.value.year = selectYear.value;
|
||||
getTableList();
|
||||
};
|
||||
// 表头
|
||||
const column: TableColumnsType [] = [
|
||||
const column: TableColumnsType[] = [
|
||||
{
|
||||
title: '排放类型',
|
||||
dataIndex: 'cnValue',
|
||||
@@ -66,7 +70,7 @@
|
||||
};
|
||||
}
|
||||
const rowSpan = getRowSpan('cnValue', record, data.value);
|
||||
if (rowIndex != 0 && data.value[rowIndex - 1].name == record.name) {
|
||||
if (rowIndex != 0 && data.value[rowIndex - 1].cnValue == record.cnValue) {
|
||||
return {
|
||||
rowSpan: 0,
|
||||
colSpan: 0,
|
||||
@@ -163,24 +167,24 @@
|
||||
};
|
||||
// 获取表格数据
|
||||
const getTableList = () => {
|
||||
fetch(carbonEmission.carbonEmissionStatistics , queryParams.value).then((res) => {
|
||||
data.value = res.data.records
|
||||
total.value = res.data.total
|
||||
fetch(carbonEmission.carbonEmissionStatistics, queryParams.value).then((res) => {
|
||||
data.value = res.data;
|
||||
total.value = res.data.length;
|
||||
});
|
||||
};
|
||||
getTableList()
|
||||
getTableList();
|
||||
// 分页器
|
||||
const onChange = (pageNumber: number,size: number) => {
|
||||
const onChange = (pageNumber: number, size: number) => {
|
||||
queryParams.value.pageNum = pageNumber;
|
||||
queryParams.value.pageSize = size;
|
||||
getTableList()
|
||||
getTableList();
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
:deep(.ant-table-title){
|
||||
:deep(.ant-table-title) {
|
||||
display: flex;
|
||||
}
|
||||
:deep(.ant-table-container){
|
||||
:deep(.ant-table-container) {
|
||||
padding: 0px 16px;
|
||||
}
|
||||
</style>
|
||||
@@ -189,4 +193,4 @@
|
||||
td.column-money {
|
||||
text-align: right !important;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -27,7 +27,19 @@
|
||||
</div>
|
||||
</template>
|
||||
</a-table> -->
|
||||
<ns-view-list-table v-bind="tableConfig" :model="data" ref="mainRef" :scroll="{ x: 1500}" />
|
||||
<ns-view-list-table v-bind="tableConfig" :model="data" ref="mainRef" :scroll="{ x: 1500,y:350 }">
|
||||
<!-- <template #bodyCell="{ record, column }">
|
||||
<template v-if="column.dataIndex === 'enableRules'">
|
||||
<a-switch
|
||||
:checked="record.enableRules === 1 ? true : false"
|
||||
:class="{
|
||||
'blue-background': record.enableRules === 1 ? true : false,
|
||||
'grey-background': record.enableRules === 1 ? false : true,
|
||||
}"
|
||||
@click="clickSwitch({ enableRules: record.enableRules, record: record })" />
|
||||
</template>
|
||||
</template> -->
|
||||
</ns-view-list-table>
|
||||
<!-- <a-pagination
|
||||
:current="queryParams.pageNum"
|
||||
:total="total"
|
||||
@@ -153,19 +165,16 @@
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref,reactive, toRaw } from 'vue';
|
||||
import type { UnwrapRef } from 'vue';
|
||||
import { ref, toRaw } from 'vue';
|
||||
import type { Rule } from 'ant-design-vue/es/form';
|
||||
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 { Pagination,message,Modal } from 'ant-design-vue';
|
||||
import type { 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';
|
||||
import { energyConsumption,carbonEmissionFactorLibrary } from '/@/api/carbonEmissionFactorLibrary';
|
||||
import { group } from '/@/api/deviceManage';
|
||||
import { dict } from '/@/api';
|
||||
defineOptions({
|
||||
energyType: 'EnergyConsumption', // 与页面路由name一致缓存才可生效
|
||||
components: {
|
||||
@@ -220,7 +229,8 @@
|
||||
// 定义form表单的必填
|
||||
const rules: Record<string, Rule[]> = {
|
||||
energyType: [{ required: true, message: '请输入能源种类', trigger: 'change' }],
|
||||
isComputeCarbon: [{ required: true, message: '请选择是否计算碳排', trigger: 'change' }]
|
||||
isComputeCarbon: [{ required: true, message: '请选择是否计算碳排', trigger: 'change' }],
|
||||
unit: [{ required: true, message: '请选择计量单位', trigger: 'change' }]
|
||||
};
|
||||
// 排放类型的变量
|
||||
const emissionTypeDic = ref()
|
||||
@@ -363,6 +373,9 @@
|
||||
getDictList()
|
||||
visible.value = true
|
||||
fetch(energyConsumption.findById , {id : record.id }).then((res) => {
|
||||
if(res.data.emissionType){
|
||||
res.data.emissionType = Number(res.data.emissionType)
|
||||
}
|
||||
if (res.data.unit) {
|
||||
let selectDevice = ref([Number(res.data.unit)]);
|
||||
findParentIds(measurementUnit.value, res.data.unit, selectDevice.value);
|
||||
@@ -438,6 +451,7 @@
|
||||
.validate()
|
||||
.then(() => {
|
||||
console.log('values', formState, toRaw(formState));
|
||||
formState.value.year = selectYear.value.format('YYYY')
|
||||
if(formState.value.unit){
|
||||
formState.value.unit = formState.value.unit.join(',').split(',')[1]
|
||||
}
|
||||
@@ -487,7 +501,6 @@
|
||||
label: child.cnValue
|
||||
})) : []
|
||||
}));
|
||||
debugger
|
||||
});
|
||||
// 获取自动采集节点的数据
|
||||
fetch(group.queryDeviceGroupTree, { energyType: 'ELECTRICITY_USAGE',orgId: orgId.value }).then((res) => {
|
||||
|
||||
@@ -31,4 +31,3 @@
|
||||
// }
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
@@ -2,16 +2,15 @@
|
||||
<div class="main">
|
||||
<div class="left">
|
||||
<div class="top">
|
||||
<a-form style="width: 100%;margin: 0 auto;">
|
||||
<a-form style="width: 100%; margin: 0 auto">
|
||||
<div class="ns-form-title"><div class="title">因子分类</div></div>
|
||||
<div style="padding: 0 16px !important;width: 100%;">
|
||||
<div style="padding: 0 16px !important; width: 100%">
|
||||
<a-row>
|
||||
<a-col :span="24" style="margin-bottom: 16px;">
|
||||
<a-col :span="24" style="margin-bottom: 16px">
|
||||
<a-input-search
|
||||
v-model:value="searchValue"
|
||||
placeholder="请输入关键词"
|
||||
@search="onSearchTreeData"
|
||||
/>
|
||||
@search="onSearchTreeData" />
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
@@ -25,13 +24,15 @@
|
||||
show-line
|
||||
@expand="onExpand"
|
||||
@select="onSelect"
|
||||
style="padding: 0 16px !important;"
|
||||
>
|
||||
style="padding: 0 16px !important">
|
||||
<template #title="data">
|
||||
<span v-if="data.energyType && searchValue && data.energyType.indexOf(searchValue) > -1">
|
||||
<span
|
||||
v-if="data.energyType && searchValue && data.energyType.indexOf(searchValue) > -1">
|
||||
{{ data.energyType.substring(0, data.energyType.indexOf(searchValue)) }}
|
||||
<span style="color: #f50">{{ searchValue }}</span>
|
||||
{{ data.energyType.substring(data.energyType.indexOf(searchValue) + searchValue.length) }}
|
||||
{{
|
||||
data.energyType.substring(data.energyType.indexOf(searchValue) + searchValue.length)
|
||||
}}
|
||||
</span>
|
||||
<span v-else>{{ data.energyType }}</span>
|
||||
</template>
|
||||
@@ -61,33 +62,35 @@
|
||||
</template>
|
||||
</a-table> -->
|
||||
<ns-view-list-table v-bind="tableConfig" :model="tableData" ref="mainRef" />
|
||||
<a-pagination
|
||||
<a-pagination
|
||||
:current="queryParams.pageNum"
|
||||
:total="total"
|
||||
:page-size="queryParams.pageSize"
|
||||
style="display: flex;justify-content: center;margin-top: 16px;"
|
||||
style="display: flex; justify-content: center; margin-top: 16px"
|
||||
:show-size-changer="true"
|
||||
:show-quick-jumper="true"
|
||||
@change="onChange" />
|
||||
<!-- 新增/编辑 -->
|
||||
<a-drawer
|
||||
:width="700"
|
||||
: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-drawer
|
||||
:width="700"
|
||||
: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-row>
|
||||
<a-col :span="12">
|
||||
<a-form-item ref="name" label="日期范围" name="dateRange">
|
||||
<a-range-picker v-model:value="formState.dateRange" picker="month" valueFormat="YYYY-MM" />
|
||||
<a-range-picker
|
||||
v-model:value="formState.dateRange"
|
||||
picker="month"
|
||||
valueFormat="YYYY-MM" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
@@ -103,20 +106,24 @@
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
<a-table
|
||||
:columns="drawerColumns"
|
||||
:data-source="newTableData"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectionChange, type: 'radio' }"
|
||||
:pagination="false">
|
||||
</a-table>
|
||||
<template #footer>
|
||||
<a-button style="margin-right: 8px" @click="onClose">取消</a-button>
|
||||
<a-button type="primary" @click="onSubmit">确定</a-button>
|
||||
</template>
|
||||
</a-drawer>
|
||||
</a-form>
|
||||
<a-table
|
||||
:columns="drawerColumns"
|
||||
:data-source="newTableData"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:rowSelection="{
|
||||
selectedRowKeys: selectedRowKeys,
|
||||
onChange: onSelectionChange,
|
||||
type: 'radio',
|
||||
}"
|
||||
:pagination="false">
|
||||
</a-table>
|
||||
<template #footer>
|
||||
<a-button style="margin-right: 8px" @click="onClose">取消</a-button>
|
||||
<a-button type="primary" @click="onSubmit">确定</a-button>
|
||||
</template>
|
||||
</a-drawer>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -124,10 +131,14 @@
|
||||
<script lang="ts" setup>
|
||||
import { ref, watch, toRaw } from 'vue';
|
||||
import type { TreeProps } from 'ant-design-vue';
|
||||
import { Pagination,Modal } from 'ant-design-vue';
|
||||
import { columns,drawerColumns } from '../config';
|
||||
import { Pagination, Modal } from 'ant-design-vue';
|
||||
import { columns, drawerColumns } from '../config';
|
||||
import { http } from '/nerv-lib/util/http';
|
||||
import { quickCalculation,carbonEmissionFactorLibrary } from '/@/api/carbonEmissionFactorLibrary';
|
||||
import {
|
||||
quickCalculation,
|
||||
carbonEmissionFactorLibrary,
|
||||
} from '/@/api/carbonEmissionFactorLibrary';
|
||||
import { or } from '@vueuse/core';
|
||||
defineOptions({
|
||||
energyType: 'quickCalculation', // 与页面路由name一致缓存才可生效
|
||||
components: {
|
||||
@@ -137,7 +148,7 @@
|
||||
const orgId = ref('');
|
||||
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||
orgId.value = result;
|
||||
const fetch = (api, params = { orgId } ) => {
|
||||
const fetch = (api, params = { orgId }) => {
|
||||
return http.post(api, params);
|
||||
};
|
||||
const mainRef = ref();
|
||||
@@ -191,7 +202,7 @@
|
||||
for (let i = 0; i < tree.length; i++) {
|
||||
const node = tree[i];
|
||||
if (node.children) {
|
||||
if (node.children.some(item => item.key === key)) {
|
||||
if (node.children.some((item) => item.key === key)) {
|
||||
parentKey = node.key;
|
||||
} else if (getParentKey(key, node.children)) {
|
||||
parentKey = getParentKey(key, node.children);
|
||||
@@ -211,17 +222,17 @@
|
||||
autoExpandParent.value = false;
|
||||
};
|
||||
// 被选中的树节点
|
||||
const energyType = ref()
|
||||
const energyType = ref();
|
||||
const onSelect = (selectedKey: string[], info: any) => {
|
||||
selectedKeys.value = selectedKey;
|
||||
if(info.selected){
|
||||
energyType.value = info.node.id
|
||||
statsId.value = info.node.id
|
||||
selectedKeys.value = selectedKey;
|
||||
if (info.selected) {
|
||||
energyType.value = info.node.id;
|
||||
statsId.value = info.node.id;
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
}
|
||||
};
|
||||
|
||||
watch(searchValue, value => {
|
||||
watch(searchValue, (value) => {
|
||||
const expanded = dataList
|
||||
.map((item: TreeProps['treeData'][number]) => {
|
||||
if (item.title.indexOf(value) > -1) {
|
||||
@@ -235,34 +246,33 @@
|
||||
autoExpandParent.value = true;
|
||||
});
|
||||
// 查询因子分类树数据
|
||||
const onSearchTreeData = () => {
|
||||
};
|
||||
const statsId = ref()
|
||||
const onSearchTreeData = () => {};
|
||||
const statsId = ref();
|
||||
// 获取因子分类树数据
|
||||
const getTreeData = () => {
|
||||
fetch(quickCalculation.carbonQuickTree).then((res) => {
|
||||
gData.value = res.data
|
||||
energyType.value = gData.value[0].children[0].id
|
||||
statsId.value = gData.value[0].children[0].id
|
||||
fetch(quickCalculation.carbonQuickTree, { orgId: orgId.value }).then((res) => {
|
||||
gData.value = res.data;
|
||||
energyType.value = gData.value[0].children[0].id;
|
||||
statsId.value = gData.value[0].children[0].id;
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
});
|
||||
};
|
||||
getTreeData()
|
||||
getTreeData();
|
||||
// 列表数据
|
||||
const total = ref<number>()
|
||||
const total = ref<number>();
|
||||
const queryParams = ref({
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
orgId: orgId.value
|
||||
})
|
||||
orgId: orgId.value,
|
||||
});
|
||||
const tableData = ref([]);
|
||||
|
||||
|
||||
const tableConfig = ref({
|
||||
title: '排放因子库',
|
||||
api: quickCalculation.queryCarbonEmissionPage,
|
||||
params: {
|
||||
orgId,
|
||||
energyType
|
||||
energyType,
|
||||
},
|
||||
headerActions: [
|
||||
{
|
||||
@@ -270,8 +280,8 @@
|
||||
name: 'userAdd',
|
||||
type: 'primary',
|
||||
handle: () => {
|
||||
visible.value = true
|
||||
getNewTable()
|
||||
visible.value = true;
|
||||
getNewTable();
|
||||
},
|
||||
},
|
||||
],
|
||||
@@ -320,12 +330,12 @@
|
||||
name: 'userEdit',
|
||||
handle: (record: any) => {
|
||||
selectedRowKeys.value = [record.factorId];
|
||||
formState.value.id = record.id
|
||||
formState.value.emissionFactors = record.emissionFactors
|
||||
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()
|
||||
formState.value.factorId = record.factorId;
|
||||
visible.value = true;
|
||||
getNewTable();
|
||||
},
|
||||
},
|
||||
{
|
||||
@@ -342,13 +352,13 @@
|
||||
});
|
||||
// 获取列表数据
|
||||
const getTableList = () => {
|
||||
fetch(quickCalculation.queryCarbonEmissionPage,queryParams.value).then((res) => {
|
||||
tableData.value = res.data.records
|
||||
total.value = res.data.total
|
||||
fetch(quickCalculation.queryCarbonEmissionPage, queryParams.value).then((res) => {
|
||||
tableData.value = res.data.records;
|
||||
total.value = res.data.total;
|
||||
});
|
||||
};
|
||||
// 分页器
|
||||
const onChange = (pageNumber: number,size: number) => {
|
||||
const onChange = (pageNumber: number, size: number) => {
|
||||
queryParams.value.pageNum = pageNumber;
|
||||
queryParams.value.pageSize = size;
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
@@ -357,9 +367,11 @@
|
||||
const formRef = ref();
|
||||
const labelCol = { span: 6 };
|
||||
const wrapperCol = { span: 18 };
|
||||
const formState = ref({})
|
||||
const formState = ref({
|
||||
orgId: orgId.value,
|
||||
});
|
||||
const visible = ref(false);
|
||||
|
||||
|
||||
// 定义form表单的必填
|
||||
const rules: Record<string, Rule[]> = {
|
||||
dateRange: [{ required: true, message: '请选择日期范围', trigger: 'change' }],
|
||||
@@ -367,65 +379,65 @@
|
||||
};
|
||||
// 点击新增按钮
|
||||
const addNewData = () => {
|
||||
visible.value = true
|
||||
getNewTable()
|
||||
visible.value = true;
|
||||
getNewTable();
|
||||
};
|
||||
// 获取新增页面的列表
|
||||
const selectedRowKeys = ref([]);
|
||||
const onSelectionChange = (selectedKeys, selectedRows) => {
|
||||
selectedRowKeys.value = selectedKeys;
|
||||
formState.value.emissionFactors = selectedRows[0].emissionFactors
|
||||
formState.value.factorId = selectedRows[0].id
|
||||
formState.value.emissionFactors = selectedRows[0].emissionFactors;
|
||||
formState.value.factorId = selectedRows[0].id;
|
||||
};
|
||||
const queryData = ref({
|
||||
orgId: orgId.value,
|
||||
pageNum: 1,
|
||||
pageSize: 999
|
||||
})
|
||||
const newTableData = ref([])
|
||||
pageSize: 999,
|
||||
});
|
||||
const newTableData = ref([]);
|
||||
const getNewTable = () => {
|
||||
fetch(carbonEmissionFactorLibrary.getTableList,queryData.value).then((res) => {
|
||||
newTableData.value = res.data.records
|
||||
fetch(carbonEmissionFactorLibrary.getTableList, queryData.value).then((res) => {
|
||||
newTableData.value = res.data.records;
|
||||
});
|
||||
};
|
||||
// 点击编辑按钮
|
||||
const editData = (record) =>{
|
||||
const editData = (record) => {
|
||||
selectedRowKeys.value = [record.factorId];
|
||||
formState.value.id = record.id
|
||||
formState.value.emissionFactors = record.emissionFactors
|
||||
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()
|
||||
formState.value.factorId = record.factorId;
|
||||
visible.value = true;
|
||||
getNewTable();
|
||||
};
|
||||
// 点击确定提交
|
||||
const onSubmit = () => {
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(() => {
|
||||
formState.value.statsId = statsId.value
|
||||
formState.value.startTime = formState.value.dateRange[0]
|
||||
formState.value.endTime = formState.value.dateRange[1]
|
||||
formState.value.statsId = statsId.value;
|
||||
formState.value.startTime = formState.value.dateRange[0];
|
||||
formState.value.endTime = formState.value.dateRange[1];
|
||||
console.log('values', formState, toRaw(formState));
|
||||
if(formState.value.id){
|
||||
fetch(quickCalculation.update,formState.value).then((res) => {
|
||||
visible.value = false
|
||||
if (formState.value.id) {
|
||||
fetch(quickCalculation.update, formState.value).then((res) => {
|
||||
visible.value = false;
|
||||
selectedRowKeys.value = [];
|
||||
formState.value = {}
|
||||
formState.value = {};
|
||||
formRef.value.resetFields();
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
});
|
||||
}else{
|
||||
fetch(quickCalculation.creat,formState.value).then((res) => {
|
||||
visible.value = false
|
||||
} else {
|
||||
fetch(quickCalculation.creat, formState.value).then((res) => {
|
||||
visible.value = false;
|
||||
selectedRowKeys.value = [];
|
||||
formState.value = {}
|
||||
formState.value = {};
|
||||
formRef.value.resetFields();
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
});
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
.catch((error) => {
|
||||
console.log('error', error);
|
||||
});
|
||||
};
|
||||
@@ -438,9 +450,9 @@
|
||||
okType: 'primary',
|
||||
cancelText: '取消',
|
||||
onOk() {
|
||||
fetch(quickCalculation.del , {id : record.id }).then((res) => {
|
||||
fetch(quickCalculation.del, { id: record.id }).then((res) => {
|
||||
message.success('操作成功!');
|
||||
getTableList()
|
||||
getTableList();
|
||||
});
|
||||
},
|
||||
onCancel() {
|
||||
@@ -452,7 +464,7 @@
|
||||
const onClose = () => {
|
||||
visible.value = false;
|
||||
selectedRowKeys.value = [];
|
||||
formState.value = {}
|
||||
formState.value = {};
|
||||
formRef.value.resetFields();
|
||||
};
|
||||
</script>
|
||||
@@ -474,9 +486,9 @@
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.top{
|
||||
.top {
|
||||
position: relative;
|
||||
.addTreeNode{
|
||||
.addTreeNode {
|
||||
width: 100%;
|
||||
padding: 16px;
|
||||
position: absolute;
|
||||
@@ -499,7 +511,7 @@
|
||||
.top {
|
||||
overflow: auto;
|
||||
}
|
||||
.ns-form-title{
|
||||
.ns-form-title {
|
||||
font-weight: bold;
|
||||
user-select: text;
|
||||
padding: 16px;
|
||||
@@ -507,7 +519,7 @@
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 1px solid #e9e9e9;
|
||||
}
|
||||
.title{
|
||||
.title {
|
||||
text-align: left;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
@@ -525,17 +537,17 @@
|
||||
height: 13px;
|
||||
width: 3px;
|
||||
border-radius: 1px;
|
||||
background-color: #2778FF;
|
||||
background-color: #2778ff;
|
||||
}
|
||||
:deep(.ant-table-title) {
|
||||
display: flex;
|
||||
height: 100%;
|
||||
align-items: center;
|
||||
}
|
||||
.ns-table-title{
|
||||
.ns-table-title {
|
||||
font-weight: bold;
|
||||
}
|
||||
.buttonGroup{
|
||||
.buttonGroup {
|
||||
margin-left: 1vw;
|
||||
width: 5vw;
|
||||
display: flex;
|
||||
@@ -547,4 +559,4 @@
|
||||
td.column-money {
|
||||
text-align: right !important;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -1,59 +1,3 @@
|
||||
// 填报页表头
|
||||
export const columns = [
|
||||
{
|
||||
title: '日期',
|
||||
dataIndex: 'name',
|
||||
key: 'name',
|
||||
width: 100,
|
||||
fixed: 'left',
|
||||
},
|
||||
{
|
||||
title: '消耗量',
|
||||
children: [
|
||||
{
|
||||
title: '数据来源',
|
||||
dataIndex: 'companyAddress',
|
||||
key: 'companyAddress',
|
||||
width: 200,
|
||||
},
|
||||
{
|
||||
title: '数值',
|
||||
dataIndex: 'companyName',
|
||||
key: 'companyName',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: '碳排因子',
|
||||
children: [
|
||||
{
|
||||
title: '数据来源',
|
||||
dataIndex: 'companyAddress',
|
||||
key: 'companyAddress',
|
||||
width: 200,
|
||||
},
|
||||
{
|
||||
title: '数值',
|
||||
dataIndex: 'companyName',
|
||||
key: 'companyName',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: '排放量',
|
||||
dataIndex: 'gender',
|
||||
key: 'gender',
|
||||
width: 80,
|
||||
fixed: 'right',
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
key: 'action',
|
||||
width: 80,
|
||||
fixed: 'right',
|
||||
},
|
||||
];
|
||||
// 凭证弹窗表头
|
||||
export const voucherColumns = [
|
||||
{
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
</div>
|
||||
<!-- 填报页 -->
|
||||
<div v-if="fillInPage">
|
||||
<fillIn />
|
||||
<fillIn :reportId="reportId" :year="year" @change-data="updateData" />
|
||||
</div>
|
||||
<!-- 新增报告弹窗 -->
|
||||
<a-drawer
|
||||
@@ -20,8 +20,7 @@
|
||||
:model="formState"
|
||||
:rules="rules"
|
||||
:label-col="labelCol"
|
||||
:wrapper-col="wrapperCol"
|
||||
>
|
||||
:wrapper-col="wrapperCol">
|
||||
<a-form-item ref="name" label="报告名称" name="reportName">
|
||||
<a-input v-model:value="formState.reportName" placeholder="请输入报告名称" />
|
||||
</a-form-item>
|
||||
@@ -38,7 +37,10 @@
|
||||
</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-range-picker
|
||||
v-model:value="formState.reportScope"
|
||||
picker="month"
|
||||
valueFormat="YYYY-MM" />
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
<template #footer>
|
||||
@@ -49,7 +51,7 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref,toRaw } from 'vue';
|
||||
import { ref, toRaw } from 'vue';
|
||||
import { http } from '/nerv-lib/util/http';
|
||||
import { carbonInventoryCheck } from '/@/api/carbonEmissionFactorLibrary';
|
||||
import fillIn from './fillInPage/index.vue';
|
||||
@@ -61,11 +63,11 @@
|
||||
return http.post(api, params);
|
||||
};
|
||||
// 判断展示哪个页面
|
||||
const isMainPage = ref(false);
|
||||
const fillInPage = ref(true);
|
||||
const isMainPage = ref(true);
|
||||
const fillInPage = ref(false);
|
||||
// 新增相关数据
|
||||
const visible = ref(false);
|
||||
const formState = ref({})
|
||||
const formState = ref({});
|
||||
const formRef = ref();
|
||||
const labelCol = { span: 5 };
|
||||
const wrapperCol = { span: 19 };
|
||||
@@ -80,7 +82,7 @@
|
||||
// 关闭新增抽屉
|
||||
const onClose = () => {
|
||||
visible.value = false;
|
||||
formState.value = {}
|
||||
formState.value = {};
|
||||
formRef.value.resetFields();
|
||||
};
|
||||
// 点击确定提交
|
||||
@@ -89,26 +91,28 @@
|
||||
.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
|
||||
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 => {
|
||||
.catch((error) => {
|
||||
console.log('error', error);
|
||||
});
|
||||
};
|
||||
// 表格相关数据
|
||||
const data = ref([]);
|
||||
const mainRef = ref();
|
||||
const reportId = ref();
|
||||
const year = ref();
|
||||
const tableConfig = ref({
|
||||
title: '数据库',
|
||||
api: carbonInventoryCheck.carbonInventoryList,
|
||||
params: {
|
||||
orgId
|
||||
orgId,
|
||||
},
|
||||
headerActions: [
|
||||
{
|
||||
@@ -116,7 +120,7 @@
|
||||
name: 'userAdd',
|
||||
type: 'primary',
|
||||
handle: () => {
|
||||
visible.value = true
|
||||
visible.value = true;
|
||||
},
|
||||
},
|
||||
],
|
||||
@@ -159,10 +163,10 @@
|
||||
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]
|
||||
visible.value = true;
|
||||
fetch(carbonInventoryCheck.findById, { id: record.id }).then((res) => {
|
||||
formState.value = res.data;
|
||||
formState.value.reportScope = [res.data.startTime, res.data.endTime];
|
||||
});
|
||||
},
|
||||
},
|
||||
@@ -170,15 +174,16 @@
|
||||
label: '填报',
|
||||
name: 'fillIn',
|
||||
handle: (record: any) => {
|
||||
isMainPage.value = false
|
||||
fillInPage.value = true
|
||||
isMainPage.value = false;
|
||||
fillInPage.value = true;
|
||||
reportId.value = record.id;
|
||||
year.value = record.reportYear;
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '下载',
|
||||
name: 'download',
|
||||
handle: (record: any) => {
|
||||
},
|
||||
handle: (record: any) => {},
|
||||
},
|
||||
{
|
||||
label: '删除',
|
||||
@@ -209,7 +214,7 @@
|
||||
componentProps: {
|
||||
valueFormat: 'YYYY',
|
||||
placeholder: ['报告年度', '报告年度'],
|
||||
picker:"year"
|
||||
picker: 'year',
|
||||
},
|
||||
},
|
||||
],
|
||||
@@ -217,9 +222,11 @@
|
||||
},
|
||||
rowKey: 'id',
|
||||
});
|
||||
// 填报页
|
||||
// 填报页点击返回
|
||||
const updateData = (newDataOne, newDataTwo) => {
|
||||
isMainPage.value = newDataOne;
|
||||
fillInPage.value = newDataTwo;
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
|
||||
</style>
|
||||
<style lang="less" scoped></style>
|
||||
|
||||
40
hx-ai-intelligent/src/view/equipmentControl/image/box.svg
Normal file
@@ -0,0 +1,40 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48.591796875" height="50.19775390625" viewBox="0 0 48.591796875 50.19775390625" fill="none">
|
||||
<g mask="url(#mask-99_522)">
|
||||
<path d="M16.7025 37.3607C16.8444 37.6064 17.1088 37.7586 17.3925 37.7577L31.1236 37.7183C31.4045 37.7175 31.6667 37.5662 31.8078 37.3233L38.7075 25.4515C38.8502 25.2061 38.8505 24.9012 38.7087 24.6554L31.8864 12.8389C31.7445 12.5932 31.4802 12.4409 31.1964 12.4418L17.4653 12.4812C17.1844 12.4821 16.9222 12.6334 16.781 12.8762L9.88131 24.748C9.73876 24.9934 9.73835 25.2984 9.8802 25.5441L16.7025 37.3607ZM16.0148 37.7577L9.19251 25.9412C8.90801 25.4484 8.90885 24.841 9.19477 24.349L16.0944 12.4773C16.3779 11.9895 16.8988 11.6887 17.463 11.6871L31.1941 11.6477C31.7631 11.6461 32.2896 11.949 32.5741 12.4418L39.3964 24.2584C39.6809 24.7512 39.68 25.3585 39.3941 25.8505L32.4944 37.7223C32.2109 38.21 31.69 38.5108 31.1259 38.5124L17.3948 38.5518C16.8257 38.5535 16.2993 38.2505 16.0148 37.7577Z" fill="url(#linear_fill_99_525)" >
|
||||
</path>
|
||||
<g opacity="0.2">
|
||||
<path d="M14.7446 40.5246C14.923 40.8337 15.2557 41.0251 15.6126 41.0241L32.888 40.9745C33.2414 40.9735 33.5713 40.7831 33.7489 40.4775L42.4295 25.5414C42.6088 25.2328 42.6094 24.849 42.4309 24.5399L33.8477 9.67325C33.6692 9.36407 33.3365 9.17267 32.9796 9.17366L15.7042 9.22328C15.3508 9.22433 15.021 9.41479 14.8433 9.72033L6.16274 24.6564C5.98336 24.965 5.98283 25.3488 6.16133 25.658L14.7446 40.5246ZM13.8794 41.0241L5.29613 26.1575C4.93818 25.5375 4.93927 24.7734 5.29898 24.1544L13.9796 9.21833C14.3363 8.60469 14.9917 8.22629 15.7014 8.22429L32.9767 8.17466C33.6926 8.17264 34.3549 8.55376 34.7128 9.17374L43.2961 24.0404C43.654 24.6603 43.653 25.4245 43.2932 26.0434L34.6126 40.9795C34.256 41.5931 33.6006 41.9715 32.8909 41.9736L15.6155 42.0231C14.8996 42.0252 14.2373 41.6441 13.8794 41.0241Z" fill="url(#linear_fill_99_526)" >
|
||||
</path>
|
||||
</g>
|
||||
<g opacity="0.61">
|
||||
<path d="M5.29815 24.1543L13.9788 9.21819C14.3355 8.60454 14.9909 8.22614 15.7005 8.22414L32.9759 8.17451C33.6918 8.17249 34.3541 8.55361 34.712 9.1736L43.2953 24.0402L5.29815 24.1543Z" fill="url(#linear_fill_99_527)" >
|
||||
</path>
|
||||
</g>
|
||||
<rect x="20.998046875" y="41.22607421875" width="7" height="0.800000011920929" rx="0.4000000059604645" fill="#14FFFF" >
|
||||
</rect>
|
||||
<rect x="20.998046875" y="8.22607421875" width="7" height="0.800000011920929" rx="0.4000000059604645" fill="#14FFFF" >
|
||||
</rect>
|
||||
</g>
|
||||
<defs>
|
||||
<mask id="mask-99_522" style="mask-type:alpha" maskUnits="userSpaceOnUse">
|
||||
<rect x="4.998046875" y="7.72607421875" width="39" height="35" fill="#FFFFFF" >
|
||||
</rect>
|
||||
</mask>
|
||||
<linearGradient id="linear_fill_99_525" x1="9.4521484375" y1="25.099609375" x2="39.1962890625" y2="25.099609375" gradientUnits="userSpaceOnUse">
|
||||
<stop offset="0" stop-color="#04DFF8" />
|
||||
<stop offset="0.25519099831581116" stop-color="#0B4975" />
|
||||
<stop offset="0.7028830051422119" stop-color="#1A5A80" />
|
||||
<stop offset="1" stop-color="#02E4FB" />
|
||||
</linearGradient>
|
||||
<linearGradient id="linear_fill_99_526" x1="5.6220703125" y1="25.0987548828125" x2="43.0439453125" y2="25.0987548828125" gradientUnits="userSpaceOnUse">
|
||||
<stop offset="0" stop-color="#06E6FF" />
|
||||
<stop offset="0.175805002450943" stop-color="#004FBF" />
|
||||
<stop offset="0.8368269801139832" stop-color="#0055CC" />
|
||||
<stop offset="1" stop-color="#44D2FF" />
|
||||
</linearGradient>
|
||||
<linearGradient id="linear_fill_99_527" x1="25.06640625" y1="23.1058349609375" x2="24.810546875" y2="8.7030029296875" gradientUnits="userSpaceOnUse">
|
||||
<stop offset="0" stop-color="#06CAF2" stop-opacity="0" />
|
||||
<stop offset="1" stop-color="#1491FF" />
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.6 KiB |
@@ -0,0 +1,4 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="14.6513671875" height="14.65087890625" viewBox="0 0 14.6513671875 14.65087890625" fill="none">
|
||||
<path d="M12.6509 -1.17188e-05L1.99995 -1.17188e-05C0.895384 -1.17188e-05 -4.68751e-05 0.895419 -4.68751e-05 1.99999L-4.68751e-05 12.6509C-4.68751e-05 13.7555 0.895384 14.6509 1.99995 14.6509L12.6509 14.6509C13.7555 14.6509 14.6509 13.7555 14.6509 12.6509L14.6509 1.99999C14.6509 0.895419 13.7555 -1.17188e-05 12.6509 -1.17188e-05ZM6.76406 4.16484C6.23629 4.16484 5.80858 3.73709 5.80855 3.20936L5.80858 3.20936C5.80858 2.68167 6.23629 2.25389 6.76406 2.25389C7.29173 2.25389 7.71953 2.68167 7.71953 3.20936C7.71953 3.73709 7.29173 4.16484 6.76406 4.16484ZM5.80855 7.5471L5.80855 5.12019C5.80855 4.79533 6.05697 4.54689 6.38183 4.54689L7.1462 4.54689C7.47106 4.54689 7.71953 4.79533 7.71953 5.12019L7.71953 5.63612L5.80858 7.5471L5.80855 7.5471ZM3.40053 11.6944L5.17775 11.6944C5.4835 11.6944 5.77012 11.5606 5.98034 11.3503L10.3183 7.01241L11.4839 7.01241C12.1146 7.01241 12.6306 6.49651 12.6306 5.86587C12.6306 5.23525 12.1146 4.71929 11.4839 4.71929L9.84051 4.71929C9.55385 4.71929 9.24811 4.85308 9.0379 5.06328L4.69998 9.40117L3.40053 9.40117C2.76991 9.40117 2.25395 9.91717 2.25395 10.5478C2.25395 11.1784 2.76991 11.6944 3.40053 11.6944Z" fill-rule="evenodd" fill="#00FFD2" >
|
||||
</path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
@@ -0,0 +1,4 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="14.6513671875" height="14.65087890625" viewBox="0 0 14.6513671875 14.65087890625" fill="none">
|
||||
<path d="M12.6509 -1.17188e-05L1.99995 -1.17188e-05C0.895384 -1.17188e-05 -4.68751e-05 0.895419 -4.68751e-05 1.99999L-4.68751e-05 12.6509C-4.68751e-05 13.7555 0.895384 14.6509 1.99995 14.6509L12.6509 14.6509C13.7555 14.6509 14.6509 13.7555 14.6509 12.6509L14.6509 1.99999C14.6509 0.895419 13.7555 -1.17188e-05 12.6509 -1.17188e-05ZM6.76406 4.16484C6.23629 4.16484 5.80858 3.73709 5.80855 3.20936L5.80858 3.20936C5.80858 2.68167 6.23629 2.25389 6.76406 2.25389C7.29173 2.25389 7.71953 2.68167 7.71953 3.20936C7.71953 3.73709 7.29173 4.16484 6.76406 4.16484ZM5.80855 7.5471L5.80855 5.12019C5.80855 4.79533 6.05697 4.54689 6.38183 4.54689L7.1462 4.54689C7.47106 4.54689 7.71953 4.79533 7.71953 5.12019L7.71953 5.63612L5.80858 7.5471L5.80855 7.5471ZM3.40053 11.6944L5.17775 11.6944C5.4835 11.6944 5.77012 11.5606 5.98034 11.3503L10.3183 7.01241L11.4839 7.01241C12.1146 7.01241 12.6306 6.49651 12.6306 5.86587C12.6306 5.23525 12.1146 4.71929 11.4839 4.71929L9.84051 4.71929C9.55385 4.71929 9.24811 4.85308 9.0379 5.06328L4.69998 9.40117L3.40053 9.40117C2.76991 9.40117 2.25395 9.91717 2.25395 10.5478C2.25395 11.1784 2.76991 11.6944 3.40053 11.6944Z" fill-rule="evenodd" fill="#FFBC46" >
|
||||
</path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
@@ -0,0 +1,4 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="14.6513671875" height="14.65087890625" viewBox="0 0 14.6513671875 14.65087890625" fill="none">
|
||||
<path d="M12.6509 -1.17188e-05L1.99995 -1.17188e-05C0.895384 -1.17188e-05 -4.68751e-05 0.895419 -4.68751e-05 1.99999L-4.68751e-05 12.6509C-4.68751e-05 13.7555 0.895384 14.6509 1.99995 14.6509L12.6509 14.6509C13.7555 14.6509 14.6509 13.7555 14.6509 12.6509L14.6509 1.99999C14.6509 0.895419 13.7555 -1.17188e-05 12.6509 -1.17188e-05ZM6.76406 4.16484C6.23629 4.16484 5.80858 3.73709 5.80855 3.20936L5.80858 3.20936C5.80858 2.68167 6.23629 2.25389 6.76406 2.25389C7.29173 2.25389 7.71953 2.68167 7.71953 3.20936C7.71953 3.73709 7.29173 4.16484 6.76406 4.16484ZM5.80855 7.5471L5.80855 5.12019C5.80855 4.79533 6.05697 4.54689 6.38183 4.54689L7.1462 4.54689C7.47106 4.54689 7.71953 4.79533 7.71953 5.12019L7.71953 5.63612L5.80858 7.5471L5.80855 7.5471ZM3.40053 11.6944L5.17775 11.6944C5.4835 11.6944 5.77012 11.5606 5.98034 11.3503L10.3183 7.01241L11.4839 7.01241C12.1146 7.01241 12.6306 6.49651 12.6306 5.86587C12.6306 5.23525 12.1146 4.71929 11.4839 4.71929L9.84051 4.71929C9.55385 4.71929 9.24811 4.85308 9.0379 5.06328L4.69998 9.40117L3.40053 9.40117C2.76991 9.40117 2.25395 9.91717 2.25395 10.5478C2.25395 11.1784 2.76991 11.6944 3.40053 11.6944Z" fill-rule="evenodd" fill="#F36163" >
|
||||
</path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
@@ -0,0 +1,4 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="14.6484375" height="14.6502685546875" viewBox="0 0 14.6484375 14.6502685546875" fill="none">
|
||||
<path d="M0 0.586563L0 13.5965C0 14.1778 0.472382 14.6503 1.05357 14.6503L13.5949 14.6503C14.1762 14.6503 14.6485 14.1778 14.6485 13.5965L14.6485 1.0537C14.6485 0.472435 14.1762 0 13.5949 0L0.586494 0C0.263397 0 0 0.26342 0 0.586563ZM10.4552 9.30261L11.8653 9.30261C11.9461 9.30261 12.011 9.36758 12.011 9.44839L12.011 10.3282C12.011 10.3669 11.9952 10.4038 11.9689 10.4319C11.9408 10.46 11.9039 10.474 11.8653 10.474L10.4552 10.474C10.1988 11.259 9.46833 11.7912 8.64301 11.7929C7.79662 11.7929 7.07666 11.2379 6.83083 10.474L2.78326 10.474C2.70245 10.474 2.6375 10.4073 2.6375 10.3282L2.6375 9.45014C2.6375 9.3676 2.70245 9.30437 2.78326 9.30437L6.82908 9.30437C7.08543 8.51934 7.81596 7.98724 8.64124 7.98547C9.48939 7.98547 10.2094 8.53868 10.4552 9.30261ZM7.81944 4.18152L7.8177 4.17624L11.8635 4.17624C11.9443 4.17624 12.0093 4.24125 12.0093 4.32201L12.0093 5.20011C12.0093 5.23876 11.9934 5.2774 11.9671 5.30376C11.939 5.33185 11.9021 5.34766 11.8635 5.34766L7.81944 5.34766L7.82121 5.33887C7.56835 6.12738 6.83434 6.66127 6.00724 6.66127C5.18019 6.66127 4.44618 6.12738 4.19155 5.34061L4.19333 5.3494L2.78326 5.3494C2.70245 5.3494 2.6375 5.28266 2.6375 5.20189L2.6375 4.32201C2.6375 4.24299 2.70245 4.17624 2.78326 4.17624L4.19333 4.17624L4.19155 4.18327C4.44444 3.39474 5.17844 2.86089 6.00552 2.86089C6.8326 2.86089 7.56657 3.39474 7.81944 4.18152ZM6.00552 5.42139C6.24783 5.43195 6.4761 5.309 6.60077 5.10002C6.72546 4.89104 6.72546 4.63288 6.60077 4.42389C6.47663 4.21533 6.24793 4.09186 6.00552 4.10249C5.65253 4.11656 5.37334 4.40808 5.37334 4.76108C5.37509 5.11584 5.65253 5.40734 6.00552 5.42139ZM8.32342 9.31318L8.27953 9.33949C8.27778 9.33949 8.27778 9.34127 8.27602 9.34127L8.25318 9.35708C8.22861 9.37639 8.20401 9.3957 8.18294 9.41852L8.17767 9.42204L8.15836 9.44488C8.14432 9.45892 8.13026 9.47472 8.11974 9.49227L8.11974 9.49406L8.10394 9.51689L8.09865 9.5239C8.08285 9.54671 8.07056 9.56957 8.05827 9.5959C8.0565 9.59943 8.05476 9.60468 8.05125 9.60821L8.04247 9.62752L8.03543 9.64682C8.03191 9.65563 8.02664 9.66439 8.02664 9.67318L8.01963 9.69603L8.01434 9.71355L8.00909 9.73817C8.00733 9.74342 8.00733 9.74693 8.0056 9.75044L7.99856 9.78909C7.99856 9.79259 7.99856 9.79613 7.9968 9.80139L7.9933 9.83125L7.99155 9.84353L7.98978 9.88569C7.98978 9.9015 7.98978 9.91376 7.99155 9.92781L7.9933 9.94013C7.9933 9.95066 7.99503 9.96117 7.9968 9.97173C7.9968 9.97701 7.9968 9.98053 7.99856 9.98403L8.0056 10.0227C8.00733 10.0262 8.00733 10.0315 8.00909 10.035L8.01434 10.0613L8.01963 10.0789L8.02664 10.1017L8.03543 10.128L8.04247 10.1474L8.05125 10.1667C8.05302 10.1702 8.05476 10.1755 8.05827 10.179C8.07056 10.2018 8.08461 10.2264 8.09865 10.251L8.10394 10.258L8.11974 10.2808L8.11974 10.2826L8.15836 10.33C8.16539 10.337 8.17065 10.3458 8.17767 10.3528L8.18116 10.3563C8.20226 10.3774 8.22332 10.3967 8.24617 10.4143L8.25143 10.4178L8.27425 10.4336C8.27602 10.4336 8.27602 10.4354 8.27778 10.4354L8.32169 10.4617L8.33046 10.467C8.52536 10.5706 8.7589 10.5706 8.9538 10.467L8.96262 10.4617L9.00652 10.4354C9.00825 10.4354 9.00825 10.4336 9.01001 10.4336L9.03282 10.4178C9.05742 10.4003 9.082 10.3792 9.10313 10.3563L9.10836 10.3528L9.12767 10.33C9.14171 10.3159 9.15575 10.3001 9.16631 10.2826L9.16631 10.2808L9.18209 10.258L9.18738 10.251C9.20142 10.2281 9.21724 10.2036 9.22776 10.1807C9.22952 10.1755 9.23129 10.1702 9.23481 10.1667L9.24355 10.1474L9.2506 10.128C9.25412 10.1193 9.25762 10.1105 9.25937 10.1017L9.26642 10.0789L9.27168 10.063L9.27694 10.0367C9.27868 10.0332 9.27868 10.0279 9.28043 10.0244L9.28748 9.98579C9.28748 9.98229 9.28748 9.97701 9.28923 9.97349L9.29272 9.94364C9.29272 9.94013 9.29272 9.93484 9.2945 9.93133L9.29625 9.88918C9.29625 9.87514 9.29625 9.86284 9.2945 9.84705L9.29272 9.83475C9.29272 9.82246 9.29102 9.81192 9.28923 9.80311C9.28923 9.79965 9.28923 9.79435 9.28748 9.79082L9.28043 9.7522C9.27868 9.74871 9.27868 9.74342 9.27694 9.73993L9.27168 9.71355L9.26642 9.69776C9.26464 9.68898 9.26113 9.68196 9.25937 9.67494L9.2506 9.64682L9.24355 9.62752L9.23481 9.60821C9.23303 9.60468 9.23129 9.59943 9.22776 9.5959C9.21548 9.57133 9.20142 9.54671 9.18738 9.5239L9.18209 9.51689L9.16631 9.49406L9.16631 9.49227C9.15401 9.47647 9.13997 9.45892 9.12767 9.44488C9.12066 9.43785 9.11537 9.42905 9.10836 9.42204L9.10485 9.41852C9.082 9.39746 9.05742 9.37639 9.03282 9.35708L9.01001 9.34127C9.00825 9.34127 9.00825 9.33949 9.00652 9.33949L8.96262 9.31318L8.9538 9.30789C8.7589 9.20429 8.52536 9.20429 8.33046 9.30789C8.3287 9.30964 8.32517 9.31142 8.32342 9.31318Z" fill="#BFCDE2" >
|
||||
</path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.6 KiB |
@@ -0,0 +1,4 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="14.6484375" height="14.6502685546875" viewBox="0 0 14.6484375 14.6502685546875" fill="none">
|
||||
<path d="M0 0.586563L0 13.5965C0 14.1778 0.472382 14.6503 1.05357 14.6503L13.5949 14.6503C14.1762 14.6503 14.6485 14.1778 14.6485 13.5965L14.6485 1.0537C14.6485 0.472435 14.1762 0 13.5949 0L0.586494 0C0.263397 0 0 0.26342 0 0.586563ZM10.4552 9.30261L11.8653 9.30261C11.9461 9.30261 12.011 9.36758 12.011 9.44839L12.011 10.3282C12.011 10.3669 11.9952 10.4038 11.9689 10.4319C11.9408 10.46 11.9039 10.474 11.8653 10.474L10.4552 10.474C10.1988 11.259 9.46833 11.7912 8.64301 11.7929C7.79662 11.7929 7.07666 11.2379 6.83083 10.474L2.78326 10.474C2.70245 10.474 2.6375 10.4073 2.6375 10.3282L2.6375 9.45014C2.6375 9.3676 2.70245 9.30437 2.78326 9.30437L6.82908 9.30437C7.08543 8.51934 7.81596 7.98724 8.64124 7.98547C9.48939 7.98547 10.2094 8.53868 10.4552 9.30261ZM7.81944 4.18152L7.8177 4.17624L11.8635 4.17624C11.9443 4.17624 12.0093 4.24125 12.0093 4.32201L12.0093 5.20011C12.0093 5.23876 11.9934 5.2774 11.9671 5.30376C11.939 5.33185 11.9021 5.34766 11.8635 5.34766L7.81944 5.34766L7.82121 5.33887C7.56835 6.12738 6.83434 6.66127 6.00724 6.66127C5.18019 6.66127 4.44618 6.12738 4.19155 5.34061L4.19333 5.3494L2.78326 5.3494C2.70245 5.3494 2.6375 5.28266 2.6375 5.20189L2.6375 4.32201C2.6375 4.24299 2.70245 4.17624 2.78326 4.17624L4.19333 4.17624L4.19155 4.18327C4.44444 3.39474 5.17844 2.86089 6.00552 2.86089C6.8326 2.86089 7.56657 3.39474 7.81944 4.18152ZM6.00552 5.42139C6.24783 5.43195 6.4761 5.309 6.60077 5.10002C6.72546 4.89104 6.72546 4.63288 6.60077 4.42389C6.47663 4.21533 6.24793 4.09186 6.00552 4.10249C5.65253 4.11656 5.37334 4.40808 5.37334 4.76108C5.37509 5.11584 5.65253 5.40734 6.00552 5.42139ZM8.32342 9.31318L8.27953 9.33949C8.27778 9.33949 8.27778 9.34127 8.27602 9.34127L8.25318 9.35708C8.22861 9.37639 8.20401 9.3957 8.18294 9.41852L8.17767 9.42204L8.15836 9.44488C8.14432 9.45892 8.13026 9.47472 8.11974 9.49227L8.11974 9.49406L8.10394 9.51689L8.09865 9.5239C8.08285 9.54671 8.07056 9.56957 8.05827 9.5959C8.0565 9.59943 8.05476 9.60468 8.05125 9.60821L8.04247 9.62752L8.03543 9.64682C8.03191 9.65563 8.02664 9.66439 8.02664 9.67318L8.01963 9.69603L8.01434 9.71355L8.00909 9.73817C8.00733 9.74342 8.00733 9.74693 8.0056 9.75044L7.99856 9.78909C7.99856 9.79259 7.99856 9.79613 7.9968 9.80139L7.9933 9.83125L7.99155 9.84353L7.98978 9.88569C7.98978 9.9015 7.98978 9.91376 7.99155 9.92781L7.9933 9.94013C7.9933 9.95066 7.99503 9.96117 7.9968 9.97173C7.9968 9.97701 7.9968 9.98053 7.99856 9.98403L8.0056 10.0227C8.00733 10.0262 8.00733 10.0315 8.00909 10.035L8.01434 10.0613L8.01963 10.0789L8.02664 10.1017L8.03543 10.128L8.04247 10.1474L8.05125 10.1667C8.05302 10.1702 8.05476 10.1755 8.05827 10.179C8.07056 10.2018 8.08461 10.2264 8.09865 10.251L8.10394 10.258L8.11974 10.2808L8.11974 10.2826L8.15836 10.33C8.16539 10.337 8.17065 10.3458 8.17767 10.3528L8.18116 10.3563C8.20226 10.3774 8.22332 10.3967 8.24617 10.4143L8.25143 10.4178L8.27425 10.4336C8.27602 10.4336 8.27602 10.4354 8.27778 10.4354L8.32169 10.4617L8.33046 10.467C8.52536 10.5706 8.7589 10.5706 8.9538 10.467L8.96262 10.4617L9.00652 10.4354C9.00825 10.4354 9.00825 10.4336 9.01001 10.4336L9.03282 10.4178C9.05742 10.4003 9.082 10.3792 9.10313 10.3563L9.10836 10.3528L9.12767 10.33C9.14171 10.3159 9.15575 10.3001 9.16631 10.2826L9.16631 10.2808L9.18209 10.258L9.18738 10.251C9.20142 10.2281 9.21724 10.2036 9.22776 10.1807C9.22952 10.1755 9.23129 10.1702 9.23481 10.1667L9.24355 10.1474L9.2506 10.128C9.25412 10.1193 9.25762 10.1105 9.25937 10.1017L9.26642 10.0789L9.27168 10.063L9.27694 10.0367C9.27868 10.0332 9.27868 10.0279 9.28043 10.0244L9.28748 9.98579C9.28748 9.98229 9.28748 9.97701 9.28923 9.97349L9.29272 9.94364C9.29272 9.94013 9.29272 9.93484 9.2945 9.93133L9.29625 9.88918C9.29625 9.87514 9.29625 9.86284 9.2945 9.84705L9.29272 9.83475C9.29272 9.82246 9.29102 9.81192 9.28923 9.80311C9.28923 9.79965 9.28923 9.79435 9.28748 9.79082L9.28043 9.7522C9.27868 9.74871 9.27868 9.74342 9.27694 9.73993L9.27168 9.71355L9.26642 9.69776C9.26464 9.68898 9.26113 9.68196 9.25937 9.67494L9.2506 9.64682L9.24355 9.62752L9.23481 9.60821C9.23303 9.60468 9.23129 9.59943 9.22776 9.5959C9.21548 9.57133 9.20142 9.54671 9.18738 9.5239L9.18209 9.51689L9.16631 9.49406L9.16631 9.49227C9.15401 9.47647 9.13997 9.45892 9.12767 9.44488C9.12066 9.43785 9.11537 9.42905 9.10836 9.42204L9.10485 9.41852C9.082 9.39746 9.05742 9.37639 9.03282 9.35708L9.01001 9.34127C9.00825 9.34127 9.00825 9.33949 9.00652 9.33949L8.96262 9.31318L8.9538 9.30789C8.7589 9.20429 8.52536 9.20429 8.33046 9.30789C8.3287 9.30964 8.32517 9.31142 8.32342 9.31318Z" fill="#0DFFA4" >
|
||||
</path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.6 KiB |
@@ -0,0 +1,8 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="15.3515625" height="15.3531494140625" viewBox="0 0 15.3515625 15.3531494140625" fill="none">
|
||||
<path d="M15.0734 11.1506L8.34844 15.1864C8.16256 15.2977 7.91856 15.3532 7.67626 15.3532C7.43304 15.3532 7.18901 15.2977 7.00313 15.1864L0.278229 11.1506C-0.0927429 10.9286 -0.0927429 10.5665 0.278229 10.3439L1.41856 9.66016L6.60805 12.774C6.90598 12.9521 7.28445 13.0505 7.67619 13.0505C8.06707 13.0505 8.44553 12.9521 8.74334 12.774L13.9328 9.66016L15.0733 10.3439C15.4443 10.5663 15.4443 10.9286 15.0734 11.1506Z" fill="#FFBC46" >
|
||||
</path>
|
||||
<path d="M15.0734 8.0802L8.34844 12.1149C8.16256 12.2261 7.91856 12.2821 7.67626 12.2821C7.43304 12.2821 7.18901 12.2261 7.00313 12.1149L0.278229 8.0802C-0.0927429 7.857 -0.0927429 7.49603 0.278229 7.27271L1.41856 6.58838L6.60805 9.70221C6.90598 9.8808 7.28445 9.97937 7.67619 9.97937C8.06707 9.97937 8.44553 9.8808 8.74334 9.70221L13.9328 6.58838L15.0733 7.27271C15.4443 7.49603 15.4443 7.85706 15.0734 8.0802Z" fill="#FFBC46" >
|
||||
</path>
|
||||
<path d="M15.0734 5.00887L8.34847 9.04474C8.16256 9.15551 7.91859 9.21149 7.67625 9.21149C7.43299 9.21149 7.189 9.15551 7.00311 9.04474L0.278252 5.00887C-0.0927505 4.78691 -0.0927505 4.42469 0.278252 4.20217L7.00311 0.166824C7.189 0.0556412 7.43299 0 7.67625 0C7.91859 0 8.16256 0.055542 8.34847 0.166824L15.0734 4.20217C15.4443 4.42469 15.4443 4.78691 15.0734 5.00887Z" fill="#FFBC46" >
|
||||
</path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
@@ -0,0 +1,4 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="14.6484375" height="14.6502685546875" viewBox="0 0 14.6484375 14.6502685546875" fill="none">
|
||||
<path d="M0 0.586563L0 13.5965C0 14.1778 0.472382 14.6503 1.05357 14.6503L13.5949 14.6503C14.1762 14.6503 14.6485 14.1778 14.6485 13.5965L14.6485 1.0537C14.6485 0.472435 14.1762 0 13.5949 0L0.586494 0C0.263397 0 0 0.26342 0 0.586563ZM10.4552 9.30261L11.8653 9.30261C11.9461 9.30261 12.011 9.36758 12.011 9.44839L12.011 10.3282C12.011 10.3669 11.9952 10.4038 11.9689 10.4319C11.9408 10.46 11.9039 10.474 11.8653 10.474L10.4552 10.474C10.1988 11.259 9.46833 11.7912 8.64301 11.7929C7.79662 11.7929 7.07666 11.2379 6.83083 10.474L2.78326 10.474C2.70245 10.474 2.6375 10.4073 2.6375 10.3282L2.6375 9.45014C2.6375 9.3676 2.70245 9.30437 2.78326 9.30437L6.82908 9.30437C7.08543 8.51934 7.81596 7.98724 8.64124 7.98547C9.48939 7.98547 10.2094 8.53868 10.4552 9.30261ZM7.81944 4.18152L7.8177 4.17624L11.8635 4.17624C11.9443 4.17624 12.0093 4.24125 12.0093 4.32201L12.0093 5.20011C12.0093 5.23876 11.9934 5.2774 11.9671 5.30376C11.939 5.33185 11.9021 5.34766 11.8635 5.34766L7.81944 5.34766L7.82121 5.33887C7.56835 6.12738 6.83434 6.66127 6.00724 6.66127C5.18019 6.66127 4.44618 6.12738 4.19155 5.34061L4.19333 5.3494L2.78326 5.3494C2.70245 5.3494 2.6375 5.28266 2.6375 5.20189L2.6375 4.32201C2.6375 4.24299 2.70245 4.17624 2.78326 4.17624L4.19333 4.17624L4.19155 4.18327C4.44444 3.39474 5.17844 2.86089 6.00552 2.86089C6.8326 2.86089 7.56657 3.39474 7.81944 4.18152ZM6.00552 5.42139C6.24783 5.43195 6.4761 5.309 6.60077 5.10002C6.72546 4.89104 6.72546 4.63288 6.60077 4.42389C6.47663 4.21533 6.24793 4.09186 6.00552 4.10249C5.65253 4.11656 5.37334 4.40808 5.37334 4.76108C5.37509 5.11584 5.65253 5.40734 6.00552 5.42139ZM8.32342 9.31318L8.27953 9.33949C8.27778 9.33949 8.27778 9.34127 8.27602 9.34127L8.25318 9.35708C8.22861 9.37639 8.20401 9.3957 8.18294 9.41852L8.17767 9.42204L8.15836 9.44488C8.14432 9.45892 8.13026 9.47472 8.11974 9.49227L8.11974 9.49406L8.10394 9.51689L8.09865 9.5239C8.08285 9.54671 8.07056 9.56957 8.05827 9.5959C8.0565 9.59943 8.05476 9.60468 8.05125 9.60821L8.04247 9.62752L8.03543 9.64682C8.03191 9.65563 8.02664 9.66439 8.02664 9.67318L8.01963 9.69603L8.01434 9.71355L8.00909 9.73817C8.00733 9.74342 8.00733 9.74693 8.0056 9.75044L7.99856 9.78909C7.99856 9.79259 7.99856 9.79613 7.9968 9.80139L7.9933 9.83125L7.99155 9.84353L7.98978 9.88569C7.98978 9.9015 7.98978 9.91376 7.99155 9.92781L7.9933 9.94013C7.9933 9.95066 7.99503 9.96117 7.9968 9.97173C7.9968 9.97701 7.9968 9.98053 7.99856 9.98403L8.0056 10.0227C8.00733 10.0262 8.00733 10.0315 8.00909 10.035L8.01434 10.0613L8.01963 10.0789L8.02664 10.1017L8.03543 10.128L8.04247 10.1474L8.05125 10.1667C8.05302 10.1702 8.05476 10.1755 8.05827 10.179C8.07056 10.2018 8.08461 10.2264 8.09865 10.251L8.10394 10.258L8.11974 10.2808L8.11974 10.2826L8.15836 10.33C8.16539 10.337 8.17065 10.3458 8.17767 10.3528L8.18116 10.3563C8.20226 10.3774 8.22332 10.3967 8.24617 10.4143L8.25143 10.4178L8.27425 10.4336C8.27602 10.4336 8.27602 10.4354 8.27778 10.4354L8.32169 10.4617L8.33046 10.467C8.52536 10.5706 8.7589 10.5706 8.9538 10.467L8.96262 10.4617L9.00652 10.4354C9.00825 10.4354 9.00825 10.4336 9.01001 10.4336L9.03282 10.4178C9.05742 10.4003 9.082 10.3792 9.10313 10.3563L9.10836 10.3528L9.12767 10.33C9.14171 10.3159 9.15575 10.3001 9.16631 10.2826L9.16631 10.2808L9.18209 10.258L9.18738 10.251C9.20142 10.2281 9.21724 10.2036 9.22776 10.1807C9.22952 10.1755 9.23129 10.1702 9.23481 10.1667L9.24355 10.1474L9.2506 10.128C9.25412 10.1193 9.25762 10.1105 9.25937 10.1017L9.26642 10.0789L9.27168 10.063L9.27694 10.0367C9.27868 10.0332 9.27868 10.0279 9.28043 10.0244L9.28748 9.98579C9.28748 9.98229 9.28748 9.97701 9.28923 9.97349L9.29272 9.94364C9.29272 9.94013 9.29272 9.93484 9.2945 9.93133L9.29625 9.88918C9.29625 9.87514 9.29625 9.86284 9.2945 9.84705L9.29272 9.83475C9.29272 9.82246 9.29102 9.81192 9.28923 9.80311C9.28923 9.79965 9.28923 9.79435 9.28748 9.79082L9.28043 9.7522C9.27868 9.74871 9.27868 9.74342 9.27694 9.73993L9.27168 9.71355L9.26642 9.69776C9.26464 9.68898 9.26113 9.68196 9.25937 9.67494L9.2506 9.64682L9.24355 9.62752L9.23481 9.60821C9.23303 9.60468 9.23129 9.59943 9.22776 9.5959C9.21548 9.57133 9.20142 9.54671 9.18738 9.5239L9.18209 9.51689L9.16631 9.49406L9.16631 9.49227C9.15401 9.47647 9.13997 9.45892 9.12767 9.44488C9.12066 9.43785 9.11537 9.42905 9.10836 9.42204L9.10485 9.41852C9.082 9.39746 9.05742 9.37639 9.03282 9.35708L9.01001 9.34127C9.00825 9.34127 9.00825 9.33949 9.00652 9.33949L8.96262 9.31318L8.9538 9.30789C8.7589 9.20429 8.52536 9.20429 8.33046 9.30789C8.3287 9.30964 8.32517 9.31142 8.32342 9.31318Z" fill="#BFCDE2" >
|
||||
</path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.6 KiB |
@@ -0,0 +1,47 @@
|
||||
<template>
|
||||
<div class="map-box">
|
||||
<div class="map">
|
||||
<liftInfo />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted } from 'vue';
|
||||
import liftInfo from './liftInfo.vue';
|
||||
// 请求
|
||||
|
||||
// 初始化 ===========================================================
|
||||
|
||||
onMounted(() => {});
|
||||
|
||||
// tab页部分 ========================================================
|
||||
|
||||
// 表格数据
|
||||
const dataSource = ref([]);
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.map-box {
|
||||
// 颜色变量,用于区别颜色
|
||||
|
||||
// 正常 - 开启 - 上行 -下行
|
||||
--on: #0dffa4;
|
||||
// 关闭
|
||||
--off: #bfcde2;
|
||||
// 暂停 - 维修
|
||||
--pause: #ffbc46;
|
||||
// 告警 - 急停
|
||||
--stop: #f36163;
|
||||
// 故障
|
||||
--fault: #ff7636;
|
||||
// 未知
|
||||
--unknown: #a742ff;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.map {
|
||||
width: 1280px;
|
||||
height: 720px;
|
||||
background-image: url(../image/bg.jpg);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,146 @@
|
||||
<template>
|
||||
<div class="info-box">
|
||||
<div class="box-title">
|
||||
<div class="dot"></div>
|
||||
<span>办公区域扶梯A</span>
|
||||
</div>
|
||||
<div class="box-inner">
|
||||
<!-- 是否开启 -->
|
||||
<div class="item">
|
||||
<div class="item-box">
|
||||
<div class="icon">
|
||||
<div class="icon-item">
|
||||
<img src="../image/liftState/lift-normal.svg" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item-text">开启</div>
|
||||
</div>
|
||||
<!-- 是否故障 -->
|
||||
<div class="item">
|
||||
<div class="item-box">
|
||||
<div class="icon">
|
||||
<div class="icon-item">
|
||||
<img src="../image/liftState/lift-normal.svg" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item-text">开启</div>
|
||||
</div>
|
||||
<!-- 如何运行 -->
|
||||
<div class="item">
|
||||
<div class="item-box">
|
||||
<div class="icon">
|
||||
<div class="icon-item">
|
||||
<img src="../image/liftState/lift-normal.svg" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item-text">开启</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted } from 'vue';
|
||||
|
||||
// 请求
|
||||
|
||||
// 初始化 ===========================================================
|
||||
|
||||
onMounted(() => {});
|
||||
|
||||
// tab页部分 ========================================================
|
||||
|
||||
// 运行状态
|
||||
const runState = ref('1');
|
||||
// 电梯状态
|
||||
const liftState = ref('2');
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
// 面板
|
||||
.info-box {
|
||||
// 字体颜色变量
|
||||
--text: rgb(20, 255, 255);
|
||||
|
||||
width: 240px;
|
||||
height: 130px;
|
||||
display: flex;
|
||||
gap: 5px;
|
||||
flex-direction: column;
|
||||
background: rgb(17, 44, 86, 0.9);
|
||||
border-radius: 8px;
|
||||
box-sizing: border-box;
|
||||
padding: 8px;
|
||||
border: 3px solid var(--text);
|
||||
// 面板标题
|
||||
.box-title {
|
||||
height: auto;
|
||||
color: var(--text);
|
||||
// 标题前小方块
|
||||
.dot {
|
||||
display: inline-block;
|
||||
width: 2px;
|
||||
height: 16px;
|
||||
vertical-align: middle;
|
||||
background: var(--text);
|
||||
}
|
||||
// 标题
|
||||
span {
|
||||
padding-left: 8px;
|
||||
}
|
||||
}
|
||||
// 下半部分
|
||||
.box-inner {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
padding: 0 10px;
|
||||
// 单个盒子(3盒子)
|
||||
.item {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
// 盒子中放置图片的容器
|
||||
.item-box {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
// border: 1px solid red;
|
||||
.icon {
|
||||
width: 55px;
|
||||
height: 55px;
|
||||
background-image: url(../image/box.svg);
|
||||
background-size: 130% 130%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: left -8px top -8px;
|
||||
// border: 1px solid red;
|
||||
position: relative;
|
||||
.icon-item {
|
||||
position: absolute;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
top: 0;
|
||||
margin: auto;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.item-text {
|
||||
height: 20px;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
color: white;
|
||||
user-select: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,266 +1,276 @@
|
||||
<template>
|
||||
<div class="lighting-box">
|
||||
<div class="lighting-img-box">
|
||||
<!-- 左上角,区域切换 -->
|
||||
<div class="btn-box">
|
||||
<button v-for="item in floorData" class="btn-item" @click=changeFloor(item.childList)>{{ item.name }}</button>
|
||||
</div>
|
||||
<!-- 楼层区域 -->
|
||||
<div class="area">
|
||||
<div
|
||||
v-for="(item, index) in treeData"
|
||||
:class="computedClass(item.id)"
|
||||
@click="changeThisArea([item])"
|
||||
:key="index">
|
||||
<div v-for="(v, i) in item.childList" :key="i" class="light-group">
|
||||
<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>
|
||||
<div class="lighting-box">
|
||||
<div class="lighting-img-box">
|
||||
<!-- 左上角,区域切换 -->
|
||||
<div class="btn-box">
|
||||
<button v-for="item in floorData" class="btn-item" @click="changeFloor(item.childList)">{{
|
||||
item.name
|
||||
}}</button>
|
||||
</div>
|
||||
<!-- 楼层区域 -->
|
||||
<div class="area">
|
||||
<div
|
||||
v-for="(item, index) in treeData"
|
||||
:class="computedClass(item.id)"
|
||||
@click="changeThisArea([item])"
|
||||
:key="index">
|
||||
<div v-for="(v, i) in item.childList" :key="i" class="light-group">
|
||||
<div class="group-shadow" @click.stop="changeThisArea([item, v])">
|
||||
<div :class="computedClass(v.id)" class="shadow-box"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 右侧抽屉的触发按钮 -->
|
||||
<div class="drawer-box-in" v-if="!visible" @click="toggleDrawer">
|
||||
<double-left-outlined class="drawer-icon" style="color: white" />
|
||||
</div>
|
||||
<!-- 左侧抽屉的关闭按钮 -->
|
||||
<div class="drawer-box-out" v-if="visible" @click="toggleDrawer">
|
||||
<double-right-outlined class="drawer-icon" style="color: white;" />
|
||||
</div>
|
||||
<!-- 右侧抽屉 -->
|
||||
<a-drawer
|
||||
v-model:visible="visible"
|
||||
class="drawer-item"
|
||||
width="496"
|
||||
placement="right"
|
||||
:body-style="{ background: 'rgba(0, 0, 0)', opacity: 0.8 }"
|
||||
:closable="false"
|
||||
id="drawer"
|
||||
:maskStyle="{ 'background-color': 'rgba(0, 0, 0, 0)' }">
|
||||
<a-tabs v-model:activeKey="activeKey">
|
||||
<a-tab-pane key="1" tab="控制面板">
|
||||
<tabs1
|
||||
@changeArea="changeArea"
|
||||
@reset="reset"
|
||||
:treeData="treeData"
|
||||
:nowArea="nowArea"
|
||||
></tabs1>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="计划列表" force-render>
|
||||
<tabs2></tabs2>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="3" tab="日志">
|
||||
<tabs3></tabs3>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</a-drawer>
|
||||
</div>
|
||||
<!-- 照明设备 -->
|
||||
<div class="lights">
|
||||
<light
|
||||
v-for="(item, index) in bulbs"
|
||||
:key="index"
|
||||
:styleObject="item.styleText"
|
||||
:type="item.type"
|
||||
:visible="item.visible" />
|
||||
</div>
|
||||
</div>
|
||||
<!-- 右侧抽屉的触发按钮 -->
|
||||
<div class="drawer-box-in" v-if="!visible" @click="toggleDrawer">
|
||||
<double-left-outlined class="drawer-icon" style="color: white" />
|
||||
</div>
|
||||
<!-- 左侧抽屉的关闭按钮 -->
|
||||
<div class="drawer-box-out" v-if="visible" @click="toggleDrawer">
|
||||
<double-right-outlined class="drawer-icon" style="color: white" />
|
||||
</div>
|
||||
<!-- 右侧抽屉 -->
|
||||
<a-drawer
|
||||
v-model:visible="visible"
|
||||
class="drawer-item"
|
||||
width="496"
|
||||
:forceRender="preload"
|
||||
placement="right"
|
||||
:body-style="{ background: 'rgba(0, 0, 0)', opacity: 0.8 }"
|
||||
:closable="false"
|
||||
id="drawer"
|
||||
:maskStyle="{ 'background-color': 'rgba(0, 0, 0, 0)' }">
|
||||
<a-tabs v-model:activeKey="activeKey">
|
||||
<a-tab-pane key="1" tab="控制面板">
|
||||
<tabs1 ref="tabs1Ref" @changeArea="changeArea" @reset="reset" :treeData="treeData" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="计划列表" force-render>
|
||||
<tabs2 />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="3" tab="日志">
|
||||
<tabs3 />
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</a-drawer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
<script setup lang="ts">
|
||||
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';
|
||||
|
||||
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';
|
||||
// 初始化 =======================================================
|
||||
|
||||
|
||||
// 初始化 =======================================================
|
||||
|
||||
onMounted(() => {
|
||||
onMounted(() => {
|
||||
// 获得分区与线路的结构
|
||||
http.get(lightingManage.getArea, { projectId: 'HLlmTZp8' }).then(res => {
|
||||
const data = res.data
|
||||
floorData.value = data
|
||||
/** 只在前端使用的变量
|
||||
* @param id 用于判断样式和层级的前端属性
|
||||
* @param selected 用于表示是否选中的前端属性
|
||||
*/
|
||||
data.forEach(floor => {
|
||||
floor.childList.forEach((item, index) => {
|
||||
if (index == 0) {
|
||||
item.selected = true
|
||||
} else {
|
||||
item.selected = false
|
||||
}
|
||||
item.id = String(index + 1)
|
||||
item.childList.forEach((v, i) => {
|
||||
v.selected = false
|
||||
v.id = (index + 1) + '-' + (i + 1)
|
||||
})
|
||||
})
|
||||
})
|
||||
treeData.value = data[0].childList
|
||||
})
|
||||
})
|
||||
getAllArea();
|
||||
});
|
||||
|
||||
// 分层业务 =====================================================
|
||||
// 预加载flag,获得分区数据后,预加载抽屉,防止获取ref报错
|
||||
const preload = ref(false);
|
||||
|
||||
// 左上角分层切换
|
||||
const changeFloor = (area: any) => {
|
||||
// 分层业务 =====================================================
|
||||
|
||||
// 所有楼层的数据
|
||||
const floorData = ref([]);
|
||||
// 左上角分层切换
|
||||
const changeFloor = (area: any) => {
|
||||
// 重置数据
|
||||
reset()
|
||||
reset();
|
||||
// 重置视图
|
||||
changeArea(['1'])
|
||||
changeArea(['1']);
|
||||
// 切换楼层数据
|
||||
treeData.value = area
|
||||
treeData.value = area;
|
||||
// 默认选择第一项
|
||||
treeData.value[0].selected = true
|
||||
}
|
||||
treeData.value[0].selected = true;
|
||||
};
|
||||
|
||||
// 分区业务 =====================================================
|
||||
// 分区业务 =====================================================
|
||||
|
||||
// 所有楼层的数据
|
||||
const floorData = ref([])
|
||||
// 分区结构树
|
||||
const treeData = ref([])
|
||||
// 当前选中的分区id
|
||||
const nowArea = ref('1')
|
||||
// 当前选中的分区序号 - 用于样式渲染
|
||||
const area = ref(['1'])
|
||||
// 线路内小灯泡 - 此处位置需前端写死
|
||||
const bulbs = ref([
|
||||
// 分区结构树
|
||||
const treeData = ref([]);
|
||||
// 当前选中的分区序列 - 用于样式渲染
|
||||
const area = ref(['1']);
|
||||
// 线路内小灯泡 - 此处位置需前端写死
|
||||
const bulbs = ref([
|
||||
{
|
||||
styleText: { left: '180px', bottom: '200px' },
|
||||
area: 1,
|
||||
type: 1,
|
||||
visible: true
|
||||
styleText: { left: '180px', bottom: '200px' },
|
||||
area: 1,
|
||||
type: 1,
|
||||
visible: true,
|
||||
},
|
||||
{
|
||||
styleText: { left: '230px', bottom: '125px' },
|
||||
area: 1,
|
||||
type: 2,
|
||||
visible: true
|
||||
styleText: { left: '230px', bottom: '125px' },
|
||||
area: 1,
|
||||
type: 2,
|
||||
visible: true,
|
||||
},
|
||||
{
|
||||
styleText: { left: '320px', bottom: '140px' },
|
||||
area: 1,
|
||||
type: 3,
|
||||
visible: true
|
||||
styleText: { left: '320px', bottom: '140px' },
|
||||
area: 1,
|
||||
type: 3,
|
||||
visible: true,
|
||||
},
|
||||
{
|
||||
styleText: { left: '245px', bottom: '230px' },
|
||||
area: 1,
|
||||
type: 3,
|
||||
visible: true
|
||||
styleText: { left: '245px', bottom: '230px' },
|
||||
area: 1,
|
||||
type: 3,
|
||||
visible: true,
|
||||
},
|
||||
{
|
||||
styleText: { left: '405px', bottom: '230px' },
|
||||
area: 2,
|
||||
type: 3,
|
||||
visible: true
|
||||
styleText: { left: '405px', bottom: '230px' },
|
||||
area: 2,
|
||||
type: 3,
|
||||
visible: true,
|
||||
},
|
||||
{
|
||||
styleText: { left: '460px', bottom: '180px' },
|
||||
area: 2,
|
||||
type: 3,
|
||||
visible: true
|
||||
styleText: { left: '460px', bottom: '180px' },
|
||||
area: 2,
|
||||
type: 3,
|
||||
visible: true,
|
||||
},
|
||||
{
|
||||
styleText: { left: '360px', bottom: '275px' },
|
||||
area: 2,
|
||||
type: 3,
|
||||
visible: true
|
||||
styleText: { left: '360px', bottom: '275px' },
|
||||
area: 2,
|
||||
type: 3,
|
||||
visible: true,
|
||||
},
|
||||
{
|
||||
styleText: { left: '715px', bottom: '320px' },
|
||||
area: 3,
|
||||
type: 1,
|
||||
visible: true
|
||||
styleText: { left: '715px', bottom: '320px' },
|
||||
area: 3,
|
||||
type: 1,
|
||||
visible: true,
|
||||
},
|
||||
])
|
||||
// 由子组件控制的分区与线路切换
|
||||
const changeArea = (result: any) => {
|
||||
console.log(result,'changeArea')
|
||||
]);
|
||||
// 由子组件控制的分区与线路切换
|
||||
const changeArea = (result: any) => {
|
||||
console.log(result, 'changeArea');
|
||||
// 数组
|
||||
if (Array.isArray(result)) {
|
||||
area.value = result
|
||||
// 不是数组
|
||||
area.value = result;
|
||||
// 不是数组
|
||||
} else {
|
||||
area.value.length = 0
|
||||
area.value[0] = String(result)
|
||||
}
|
||||
}
|
||||
// 由当前组件控制的分区切换
|
||||
const changeThisArea = (result: any) => {
|
||||
console.log(result, 'changeThisArea')
|
||||
area.value.length = 0;
|
||||
area.value[0] = String(result);
|
||||
}
|
||||
};
|
||||
// 由当前组件控制的分区切换
|
||||
const changeThisArea = (result: any) => {
|
||||
console.log(result, 'changeThisArea');
|
||||
// 修改前,将所有选项置空
|
||||
reset()
|
||||
reset();
|
||||
let level1 = result[0];
|
||||
area.value.length = 0
|
||||
area.value.length = 0;
|
||||
// 只选择了分区
|
||||
if (result.length === 1) {
|
||||
result[0].selected = true
|
||||
area.value.push(result[0].id)
|
||||
result[0].selected = true;
|
||||
area.value.push(result[0].id);
|
||||
// 控制子组件按钮区
|
||||
tabs1Ref.value.changeArea(result[0]);
|
||||
// 选择了分区 + 线路
|
||||
} 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)
|
||||
// 如果没有分区,默认选择第一个
|
||||
if (!level1) {
|
||||
level1 = treeData.value[0];
|
||||
}
|
||||
// 选中状态都设为true
|
||||
level1.selected = result[1].selected = true;
|
||||
area.value.splice(0, 0, level1.id, result[1].id);
|
||||
// 控制子组件按钮区
|
||||
tabs1Ref.value.changeArea(result[0]);
|
||||
tabs1Ref.value.changeLine(result[1]);
|
||||
}
|
||||
nowArea.value = level1.id
|
||||
}
|
||||
// 重置分区树所有当前选项
|
||||
const reset = () => {
|
||||
treeData.value.forEach(item => {
|
||||
item.selected = false
|
||||
item.childList.forEach(i => {
|
||||
i.selected = false
|
||||
})
|
||||
})
|
||||
}
|
||||
// 俯视图分区选中计算函数
|
||||
const computedClass = (string: string) => {
|
||||
};
|
||||
// 重置分区树所有当前选项
|
||||
const reset = () => {
|
||||
treeData.value.forEach((item: any) => {
|
||||
item.selected = false;
|
||||
item.childList.forEach((i: any) => {
|
||||
i.selected = false;
|
||||
});
|
||||
});
|
||||
};
|
||||
// 俯视图分区选中计算函数
|
||||
const computedClass = (string: string) => {
|
||||
if (area.value.indexOf(string) != -1) {
|
||||
return `isActive area-item area${string}`
|
||||
return `isActive area-item area${string}`;
|
||||
} else {
|
||||
return `area-item area${string}`
|
||||
return `area-item area${string}`;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// 抽屉业务 =====================================================
|
||||
// 获得所有分区
|
||||
const getAllArea = () => {
|
||||
http.get(lightingManage.getArea, { projectId: 'HLlmTZp8' }).then((res) => {
|
||||
const data = res.data;
|
||||
floorData.value = data;
|
||||
/** 只在前端使用的变量
|
||||
* @param id 用于判断样式和层级的前端属性
|
||||
* @param selected 用于表示是否选中的前端属性
|
||||
*/
|
||||
data.forEach((floor: any) => {
|
||||
floor.childList.forEach((item: any, index: number) => {
|
||||
if (index == 0) {
|
||||
item.selected = true;
|
||||
} else {
|
||||
item.selected = false;
|
||||
}
|
||||
item.id = String(index + 1);
|
||||
item.childList.forEach((v: any, i: number) => {
|
||||
v.selected = false;
|
||||
v.id = index + 1 + '-' + (i + 1);
|
||||
});
|
||||
});
|
||||
});
|
||||
// 默认展示 线路 1-1
|
||||
treeData.value = data[0].childList;
|
||||
// 开始预加载
|
||||
preload.value = true;
|
||||
});
|
||||
};
|
||||
|
||||
// 抽屉 - 当前选择的tab
|
||||
let activeKey = ref('1');
|
||||
// 抽屉 - 打开状态
|
||||
let visible = ref(false);
|
||||
// 抽屉 - 开关事件
|
||||
const toggleDrawer = () => {
|
||||
// 抽屉业务 =====================================================
|
||||
|
||||
// 抽屉 - 当前选择的tab
|
||||
let activeKey = ref('1');
|
||||
// 抽屉 - 打开状态
|
||||
let visible = ref(false);
|
||||
// 抽屉 - 开关事件
|
||||
const toggleDrawer = () => {
|
||||
visible.value = !visible.value;
|
||||
};
|
||||
|
||||
};
|
||||
// 抽屉tab1组件的引用
|
||||
const tabs1Ref = ref();
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
@import "./index.less";
|
||||
// 当前选中分区的样式
|
||||
.isActive {
|
||||
@import './index.less';
|
||||
|
||||
// 当前选中分区的样式
|
||||
.isActive {
|
||||
border: 3px solid white !important;
|
||||
}
|
||||
// 抽屉顶部tab按钮样式
|
||||
:deep(.ant-tabs-tab-btn) {
|
||||
}
|
||||
|
||||
// 抽屉顶部tab按钮样式
|
||||
:deep(.ant-tabs-tab-btn) {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,59 +1,59 @@
|
||||
<template>
|
||||
<a-popover color="rgba(0, 0, 0, 0.8)">
|
||||
<template #content>
|
||||
<div class="light-tag">
|
||||
<div class="light-tag-tit">
|
||||
<div>
|
||||
<img src="/asset/image//bulbLogo/21962.png" alt="" />
|
||||
<span class="tag-text">{{ result.name }}</span>
|
||||
</div>
|
||||
<button class="right-button">{{ type == 1 ? '正常' : '关闭' }}</button>
|
||||
</div>
|
||||
<div class="light-tag-box">
|
||||
<div class="tag-box-item">
|
||||
<img src="/asset/image//bulbLogo/22496.png" alt="" />
|
||||
<span class="title">控制模式</span>
|
||||
<span class="result">自动</span>
|
||||
</div>
|
||||
<div class="tag-box-item">
|
||||
<img src="/asset/image//bulbLogo/22496.png" alt="" />
|
||||
<span class="title">亮度</span>
|
||||
<span class="result">{{ result.brightness }}</span>
|
||||
</div>
|
||||
<div class="tag-box-item">
|
||||
<img src="/asset/image//bulbLogo/22496.png" alt="" />
|
||||
<span class="title">控制场景</span>
|
||||
<span class="result">{{ result.automatic2 }}</span>
|
||||
</div>
|
||||
<div class="tag-box-item">
|
||||
<img src="/asset/image//bulbLogo/22496.png" alt="" />
|
||||
<span class="title">色温</span>
|
||||
<span class="result">{{ result.brightness3 }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<div class="icon-box" :style="styleObject" v-show="visible">
|
||||
<img v-if="type == 1" class="icon-item" src="/asset/image/bulbLogo/22394.png" alt="">
|
||||
<img v-if="type == 2" class="icon-item" src="/asset/image/bulbLogo/22396.png" alt="">
|
||||
<img v-if="type == 3" class="icon-item" src="/asset/image/bulbLogo/22400.png" alt="">
|
||||
<a-popover color="rgba(0, 0, 0, 0.8)">
|
||||
<template #content>
|
||||
<div class="light-tag">
|
||||
<div class="light-tag-tit">
|
||||
<div>
|
||||
<img src="/asset/image//bulbLogo/21962.png" alt="" />
|
||||
<span class="tag-text">{{ result.name }}</span>
|
||||
</div>
|
||||
<button class="right-button">{{ type == 1 ? '正常' : '关闭' }}</button>
|
||||
</div>
|
||||
</a-popover>
|
||||
<div class="light-tag-box">
|
||||
<div class="tag-box-item">
|
||||
<img src="/asset/image//bulbLogo/22496.png" alt="" />
|
||||
<span class="title">控制模式</span>
|
||||
<span class="result">自动</span>
|
||||
</div>
|
||||
<div class="tag-box-item">
|
||||
<img src="/asset/image//bulbLogo/22496.png" alt="" />
|
||||
<span class="title">亮度</span>
|
||||
<span class="result">{{ result.brightness }}</span>
|
||||
</div>
|
||||
<div class="tag-box-item">
|
||||
<img src="/asset/image//bulbLogo/22496.png" alt="" />
|
||||
<span class="title">控制场景</span>
|
||||
<span class="result">{{ result.automatic2 }}</span>
|
||||
</div>
|
||||
<div class="tag-box-item">
|
||||
<img src="/asset/image//bulbLogo/22496.png" alt="" />
|
||||
<span class="title">色温</span>
|
||||
<span class="result">{{ result.brightness3 }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<div class="icon-box" :style="styleObject" v-show="visible">
|
||||
<img v-if="type == 1" class="icon-item" src="/asset/image/bulbLogo/22394.png" alt="" />
|
||||
<img v-if="type == 2" class="icon-item" src="/asset/image/bulbLogo/22396.png" alt="" />
|
||||
<img v-if="type == 3" class="icon-item" src="/asset/image/bulbLogo/22400.png" alt="" />
|
||||
</div>
|
||||
</a-popover>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
|
||||
defineProps({
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
|
||||
defineProps({
|
||||
styleObject: Object,
|
||||
type: Number,
|
||||
visible: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
});
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
});
|
||||
|
||||
const result = ref({
|
||||
const result = ref({
|
||||
id: '1',
|
||||
name: '站厅照明 1区',
|
||||
manual: '手动',
|
||||
@@ -64,77 +64,86 @@ const result = ref({
|
||||
automatic2: '舒适',
|
||||
brightness3: '4000k',
|
||||
brightness4: '3800k',
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.icon-box {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
.icon-box {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
position: absolute;
|
||||
|
||||
.icon-item {
|
||||
width: 25px;
|
||||
cursor: pointer;
|
||||
transition: all ease 0.1s;
|
||||
}
|
||||
|
||||
.icon-item:active {
|
||||
transform: scale(1.2);
|
||||
}
|
||||
}
|
||||
|
||||
// 悬浮窗外部
|
||||
.light-tag {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
|
||||
// 悬浮窗标题
|
||||
.light-tag-tit {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
vertical-align: middle;
|
||||
height: 30px;
|
||||
|
||||
.tag-text {
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
color: white;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.right-button {
|
||||
width: 50px;
|
||||
height: 26px;
|
||||
background: rgba(57, 215, 187, 0.1);
|
||||
border: 1px solid rgba(57, 215, 187, 1);
|
||||
font-size: 12px;
|
||||
color: rgba(57, 215, 187, 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 悬浮窗底部4格子
|
||||
.light-tag-box {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
grid-template-rows: 1fr 1fr;
|
||||
grid-gap: 10px;
|
||||
|
||||
.tag-box-item {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
img {
|
||||
width: 120px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.title {
|
||||
position: absolute;
|
||||
.icon-item {
|
||||
width: 25px;
|
||||
cursor: pointer;
|
||||
transition: all ease 0.1s;
|
||||
}
|
||||
.icon-item:active {
|
||||
transform: scale(1.2);
|
||||
}
|
||||
}
|
||||
// 悬浮窗外部
|
||||
.light-tag {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
// 悬浮窗标题
|
||||
.light-tag-tit {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
vertical-align: middle;
|
||||
height: 30px;
|
||||
.tag-text {
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
color: white;
|
||||
padding-left: 10px;
|
||||
}
|
||||
.right-button {
|
||||
width: 50px;
|
||||
height: 26px;
|
||||
background: rgba(57, 215, 187, 0.1);
|
||||
border: 1px solid rgba(57, 215, 187, 1);
|
||||
font-size: 12px;
|
||||
color: rgba(57, 215, 187, 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
// 悬浮窗底部4格子
|
||||
.light-tag-box {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
grid-template-rows: 1fr 1fr;
|
||||
grid-gap: 10px;
|
||||
.tag-box-item {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
img {
|
||||
width: 120px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.title {
|
||||
position: absolute;
|
||||
left: 60px;
|
||||
top: 13px;
|
||||
color: rgba(64, 255, 252, 1);
|
||||
}
|
||||
.result {
|
||||
line-height: 50px;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
color: white;
|
||||
};
|
||||
}
|
||||
left: 60px;
|
||||
top: 13px;
|
||||
color: rgba(64, 255, 252, 1);
|
||||
}
|
||||
|
||||
.result {
|
||||
line-height: 50px;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -20,10 +20,10 @@
|
||||
<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);
|
||||
">
|
||||
已执行
|
||||
</button>
|
||||
@@ -31,10 +31,10 @@
|
||||
<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);
|
||||
">
|
||||
待执行
|
||||
</button>
|
||||
@@ -42,11 +42,10 @@
|
||||
<td>
|
||||
<div class="tabReboot" @click="restartPlan(row.id)">重启</div>
|
||||
<a-popconfirm
|
||||
title="此操作将永久删除该条数据"
|
||||
ok-text="确定"
|
||||
cancel-text="取消"
|
||||
@confirm="deletePlan(row.id)"
|
||||
>
|
||||
title="此操作将永久删除该条数据"
|
||||
ok-text="确定"
|
||||
cancel-text="取消"
|
||||
@confirm="deletePlan(row.id)">
|
||||
<div class="tabDelete">删除</div>
|
||||
</a-popconfirm>
|
||||
</td>
|
||||
@@ -64,13 +63,13 @@
|
||||
:data-source="transferData"
|
||||
show-search
|
||||
:filter-option="filterOption"
|
||||
:render="(item) => item.title"
|
||||
:render="(item: any) => item.title"
|
||||
@change="handleChange"
|
||||
:style="{ color: 'rgba(255,255,255,1)' }"
|
||||
@search="handleSearch"
|
||||
:listStyle="{ border: '2px solid rgba(25,74,125,1)', height: 'calc(100vh - 200px)' }" />
|
||||
</div>
|
||||
<div style="width: 100%; height: 60px;"></div>
|
||||
<div style="width: 100%; height: 60px"></div>
|
||||
<div class="button-box">
|
||||
<button class="cancel" @click="addVisible = false">取消</button>
|
||||
<button class="execute" @click="sendPlan">确定</button>
|
||||
@@ -79,176 +78,171 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted } from 'vue';
|
||||
// 请求
|
||||
import { http } from '/nerv-lib/util/http';
|
||||
import { lightingManage } from '/@/api/IlluminationInfo';
|
||||
import { message } from 'ant-design-vue';
|
||||
import { ref, onMounted } from 'vue';
|
||||
// 请求
|
||||
import { http } from '/nerv-lib/util/http';
|
||||
import { lightingManage } from '/@/api/IlluminationInfo';
|
||||
import { message } from 'ant-design-vue';
|
||||
|
||||
// 初始化 ===========================================================
|
||||
// 初始化 ===========================================================
|
||||
|
||||
onMounted(() => {
|
||||
// 计划表格
|
||||
getTable()
|
||||
// 穿梭框原始数据
|
||||
getLeftPlan()
|
||||
})
|
||||
onMounted(() => {
|
||||
// 计划表格
|
||||
getTable();
|
||||
// 穿梭框原始数据
|
||||
getLeftPlan();
|
||||
});
|
||||
|
||||
// tab页部分 ========================================================
|
||||
// tab页部分 ========================================================
|
||||
|
||||
// 表格数据
|
||||
const dataSource = ref([]);
|
||||
// 获得表格数据
|
||||
const getTable = () => {
|
||||
http.get(lightingManage.getPlanTable, {}).then(res => {
|
||||
dataSource.value = res.data
|
||||
})
|
||||
}
|
||||
// 删除表格中的计划
|
||||
const deletePlan = (id: String) => {
|
||||
http.delete(lightingManage.deletePlan, [id]).then(res => {
|
||||
message.success('操作成功')
|
||||
getTable()
|
||||
})
|
||||
}
|
||||
// 重启表格中的计划
|
||||
const restartPlan = (id: String) => {
|
||||
http.post(lightingManage.restartPlan, { planId: id }).then(res => {
|
||||
message.success('操作成功')
|
||||
getTable()
|
||||
})
|
||||
}
|
||||
// 表格数据
|
||||
const dataSource = ref([]);
|
||||
// 获得表格数据
|
||||
const getTable = () => {
|
||||
http.get(lightingManage.getPlanTable, {}).then((res) => {
|
||||
dataSource.value = res.data;
|
||||
});
|
||||
};
|
||||
// 删除表格中的计划
|
||||
const deletePlan = (id: String) => {
|
||||
http.delete(lightingManage.deletePlan, [id]).then(() => {
|
||||
message.success('操作成功');
|
||||
getTable();
|
||||
});
|
||||
};
|
||||
// 重启表格中的计划
|
||||
const restartPlan = (id: String) => {
|
||||
http.post(lightingManage.restartPlan, { planId: id }).then(() => {
|
||||
message.success('操作成功');
|
||||
getTable();
|
||||
});
|
||||
};
|
||||
|
||||
// tab页弹窗部分 ====================================================
|
||||
// tab页弹窗部分 ====================================================
|
||||
|
||||
// 添加弹窗控制变量
|
||||
const addVisible = ref(false);
|
||||
// 打开弹窗
|
||||
const addModal = () => {
|
||||
addVisible.value = true;
|
||||
};
|
||||
// 添加弹窗控制变量
|
||||
const addVisible = ref(false);
|
||||
// 打开弹窗
|
||||
const addModal = () => {
|
||||
addVisible.value = true;
|
||||
};
|
||||
|
||||
// 穿梭框部分 =======================================================
|
||||
|
||||
// 穿梭框部分 =======================================================
|
||||
|
||||
// 穿梭框数据
|
||||
const transferData = ref([]) as any;
|
||||
// 获得穿梭框原始数据
|
||||
const getLeftPlan = () => {
|
||||
http.get(lightingManage.getLeftPlan, {}).then(res => {
|
||||
let arr = []
|
||||
res.data.forEach(item => {
|
||||
arr.push({
|
||||
key: item.id,
|
||||
title: item.planName
|
||||
})
|
||||
})
|
||||
transferData.value = arr
|
||||
})
|
||||
}
|
||||
|
||||
const handleChange = (keys: string[], direction: string, moveKeys: string[]) => {
|
||||
console.log(keys, direction, moveKeys);
|
||||
};
|
||||
const handleSearch = (dir: string, value: string) => {
|
||||
console.log('search:', dir, value);
|
||||
};
|
||||
// 穿梭框选中数据
|
||||
const targetKeys = ref<string[]>([]);
|
||||
// 将穿梭框选中的计划提交
|
||||
const sendPlan = () => {
|
||||
if (targetKeys.value.length < 1) {
|
||||
return message.info('没有选择任何计划');
|
||||
}
|
||||
http.post(lightingManage.submitLeftPlan, targetKeys.value).then(res => {
|
||||
message.success('添加成功')
|
||||
// 如果发送成功,则刷新表格
|
||||
getTable()
|
||||
getLeftPlan()
|
||||
})
|
||||
}
|
||||
|
||||
const filterOption = (inputValue: string, option: any) => {
|
||||
return option.description.indexOf(inputValue) > -1;
|
||||
};
|
||||
// 穿梭框数据
|
||||
const transferData = ref([]) as any;
|
||||
// 获得穿梭框原始数据
|
||||
const getLeftPlan = () => {
|
||||
http.get(lightingManage.getLeftPlan, {}).then((res) => {
|
||||
let arr = [];
|
||||
res.data.forEach((item: any) => {
|
||||
arr.push({
|
||||
key: item.id,
|
||||
title: item.planName,
|
||||
});
|
||||
});
|
||||
transferData.value = arr;
|
||||
});
|
||||
};
|
||||
|
||||
const handleChange = (keys: string[], direction: string, moveKeys: string[]) => {
|
||||
console.log(keys, direction, moveKeys);
|
||||
};
|
||||
const handleSearch = (dir: string, value: string) => {
|
||||
console.log('search:', dir, value);
|
||||
};
|
||||
// 穿梭框选中数据
|
||||
const targetKeys = ref<string[]>([]);
|
||||
// 将穿梭框选中的计划提交
|
||||
const sendPlan = () => {
|
||||
if (targetKeys.value.length < 1) {
|
||||
return message.info('没有选择任何计划');
|
||||
}
|
||||
http.post(lightingManage.submitLeftPlan, targetKeys.value).then(() => {
|
||||
message.success('添加成功');
|
||||
// 如果发送成功,则刷新表格
|
||||
getTable();
|
||||
getLeftPlan();
|
||||
});
|
||||
};
|
||||
|
||||
const filterOption = (inputValue: string, option: any) => {
|
||||
return option.description.indexOf(inputValue) > -1;
|
||||
};
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
@import "./dialogStyle.less";
|
||||
@import './dialogStyle.less';
|
||||
|
||||
// 右下角添加按钮
|
||||
.div-add {
|
||||
height: 64px;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
margin-right: 20px;
|
||||
.add {
|
||||
width: 74px;
|
||||
height: 40px;
|
||||
opacity: 1;
|
||||
border-radius: 4px;
|
||||
background: rgba(67, 136, 251, 1);
|
||||
border: rgba(67, 136, 251, 1);
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
// 右下角添加按钮
|
||||
.div-add {
|
||||
height: 64px;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
margin-right: 20px;
|
||||
.add {
|
||||
width: 74px;
|
||||
height: 40px;
|
||||
opacity: 1;
|
||||
border-radius: 4px;
|
||||
background: rgba(67, 136, 251, 1);
|
||||
border: rgba(67, 136, 251, 1);
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
// 表格
|
||||
.custom-table {
|
||||
border-collapse: collapse;
|
||||
width: 416px;
|
||||
height: 60px;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
// 表格
|
||||
.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%;
|
||||
border: 1px solid rgba(255, 255, 255);
|
||||
border-radius: 5px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
// 表格中的操作按钮
|
||||
.tabReboot,
|
||||
.tabDelete {
|
||||
border: none;
|
||||
display: inline-block;
|
||||
background-color: rgba(0, 0, 0, 0);
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
letter-spacing: 0;
|
||||
line-height: 20px;
|
||||
color: rgba(67, 136, 251, 1);
|
||||
cursor: pointer;
|
||||
.custom-table th,
|
||||
.custom-table td {
|
||||
border: 1px solid rgba(163, 192, 243, 1);
|
||||
text-align: left;
|
||||
padding: 8px;
|
||||
text-align: center;
|
||||
}
|
||||
.tabReboot {
|
||||
margin-right: 8px;
|
||||
.table1 {
|
||||
margin-top: 20px;
|
||||
width: 100%;
|
||||
border: 1px solid rgba(255, 255, 255);
|
||||
border-radius: 5px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
// 表格中的操作按钮
|
||||
.tabReboot,
|
||||
.tabDelete {
|
||||
border: none;
|
||||
display: inline-block;
|
||||
background-color: rgba(0, 0, 0, 0);
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
letter-spacing: 0;
|
||||
line-height: 20px;
|
||||
color: rgba(67, 136, 251, 1);
|
||||
cursor: pointer;
|
||||
}
|
||||
.tabReboot {
|
||||
margin-right: 8px;
|
||||
}
|
||||
.tabReboot::active {
|
||||
color: white !important;
|
||||
}
|
||||
.tabDelete::active {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
.tabReboot::active {
|
||||
color: white !important;
|
||||
::v-deep(.ant-transfer) {
|
||||
// 屏蔽自带的hover效果
|
||||
.ant-transfer-list-content-item:hover {
|
||||
background: black;
|
||||
}
|
||||
}
|
||||
.tabDelete::active {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
::v-deep(.ant-transfer) {
|
||||
// 屏蔽自带的hover效果
|
||||
.ant-transfer-list-content-item:hover {
|
||||
background: black;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
@@ -9,7 +9,10 @@
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(row, index) in dataSource1" :key="index" @click="handleRowClick(row.key)"
|
||||
<tr
|
||||
v-for="(row, index) in dataSource1"
|
||||
:key="index"
|
||||
@click="handleRowClick(row.key)"
|
||||
:class="row.key === trIndex ? 'isTrIndex' : ''">
|
||||
<td>{{ row.key }}</td>
|
||||
<td>{{ row.data }}</td>
|
||||
@@ -19,7 +22,7 @@
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div class="out-dialog" :class="{ 'showDialog' : logModalVisible }" 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>
|
||||
@@ -30,7 +33,11 @@
|
||||
<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">
|
||||
@@ -43,9 +50,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn-item">
|
||||
<div class="left">
|
||||
亮度
|
||||
</div>
|
||||
<div class="left"> 亮度 </div>
|
||||
<div class="right">
|
||||
<span>100lux</span>
|
||||
<img src="/asset/image/bulbLogo/22406.png" alt="" />
|
||||
@@ -53,9 +58,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn-item">
|
||||
<div class="left">
|
||||
控制场景
|
||||
</div>
|
||||
<div class="left"> 控制场景 </div>
|
||||
<div class="right">
|
||||
<span>手动</span>
|
||||
<img src="/asset/image/bulbLogo/22406.png" alt="" />
|
||||
@@ -63,9 +66,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn-item">
|
||||
<div class="left">
|
||||
色温
|
||||
</div>
|
||||
<div class="left"> 色温 </div>
|
||||
<div class="right">
|
||||
<span>4000k</span>
|
||||
<img src="/asset/image/bulbLogo/22406.png" alt="" />
|
||||
@@ -76,7 +77,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="height: 60px;"></div>
|
||||
<div style="height: 60px"></div>
|
||||
<div class="button-box">
|
||||
<button class="cancel" @click="logModalVisible = false">取消</button>
|
||||
</div>
|
||||
@@ -87,169 +88,164 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted } from 'vue';
|
||||
import { ref, onMounted } from 'vue';
|
||||
|
||||
// 初始化
|
||||
onMounted(() => {
|
||||
|
||||
})
|
||||
|
||||
// 与父组件的交互 ===================================================================
|
||||
const props = defineProps({
|
||||
// 分区结构(照明区域 > 照明回路)
|
||||
treeData: {
|
||||
type: Array
|
||||
},
|
||||
});
|
||||
const emit = defineEmits(['changeArea']);
|
||||
|
||||
// 表格数据
|
||||
const dataSource1 = ref([
|
||||
{
|
||||
key: '1',
|
||||
data: '2024-05-01',
|
||||
planName: '计划再开',
|
||||
status: '张三111',
|
||||
},
|
||||
{
|
||||
key: '2',
|
||||
data: '2024-05-01',
|
||||
planName: '检修模式',
|
||||
status: '李四12',
|
||||
},
|
||||
{
|
||||
key: '3',
|
||||
data: '2024-05-01',
|
||||
planName: '设备变更',
|
||||
status: '王五33',
|
||||
},
|
||||
]);
|
||||
const cxList = ref([
|
||||
{
|
||||
id: '1',
|
||||
name: '站厅照明 1区',
|
||||
manual: '手动',
|
||||
automatic: '自动',
|
||||
brightness: '100lux',
|
||||
brightness2: '30lux',
|
||||
manual2: '手动',
|
||||
automatic2: '自动',
|
||||
brightness3: '4000k',
|
||||
brightness4: '3800k',
|
||||
},
|
||||
{
|
||||
id: '2',
|
||||
name: '站厅照明 2区',
|
||||
manual: '手动',
|
||||
automatic: '自动',
|
||||
brightness: '100lux',
|
||||
brightness2: '30lux',
|
||||
manual2: '手动',
|
||||
automatic2: '自动',
|
||||
brightness3: '4000k',
|
||||
brightness4: '3800k',
|
||||
},
|
||||
{
|
||||
id: '3',
|
||||
name: '站厅照明 3区',
|
||||
manual: '手动',
|
||||
automatic: '自动',
|
||||
brightness: '100lux',
|
||||
brightness2: '30lux',
|
||||
manual2: '手动',
|
||||
automatic2: '自动',
|
||||
brightness3: '4000k',
|
||||
brightness4: '3800k',
|
||||
},
|
||||
]);
|
||||
let trIndex = ref('-1');
|
||||
const logModalVisible = ref(false);
|
||||
const handleRowClick = (index: any) => {
|
||||
trIndex.value = index;
|
||||
if (index === trIndex.value) {
|
||||
console.log('tri');
|
||||
}
|
||||
// 显示模态框
|
||||
logModalVisible.value = true;
|
||||
};
|
||||
// 初始化
|
||||
onMounted(() => {});
|
||||
|
||||
// 与父组件的交互 ===================================================================
|
||||
const props = defineProps({
|
||||
// 分区结构(照明区域 > 照明回路)
|
||||
treeData: {
|
||||
type: Array,
|
||||
},
|
||||
});
|
||||
const emit = defineEmits(['changeArea']);
|
||||
|
||||
// 表格数据
|
||||
const dataSource1 = ref([
|
||||
{
|
||||
key: '1',
|
||||
data: '2024-05-01',
|
||||
planName: '计划再开',
|
||||
status: '张三111',
|
||||
},
|
||||
{
|
||||
key: '2',
|
||||
data: '2024-05-01',
|
||||
planName: '检修模式',
|
||||
status: '李四12',
|
||||
},
|
||||
{
|
||||
key: '3',
|
||||
data: '2024-05-01',
|
||||
planName: '设备变更',
|
||||
status: '王五33',
|
||||
},
|
||||
]);
|
||||
const cxList = ref([
|
||||
{
|
||||
id: '1',
|
||||
name: '站厅照明 1区',
|
||||
manual: '手动',
|
||||
automatic: '自动',
|
||||
brightness: '100lux',
|
||||
brightness2: '30lux',
|
||||
manual2: '手动',
|
||||
automatic2: '自动',
|
||||
brightness3: '4000k',
|
||||
brightness4: '3800k',
|
||||
},
|
||||
{
|
||||
id: '2',
|
||||
name: '站厅照明 2区',
|
||||
manual: '手动',
|
||||
automatic: '自动',
|
||||
brightness: '100lux',
|
||||
brightness2: '30lux',
|
||||
manual2: '手动',
|
||||
automatic2: '自动',
|
||||
brightness3: '4000k',
|
||||
brightness4: '3800k',
|
||||
},
|
||||
{
|
||||
id: '3',
|
||||
name: '站厅照明 3区',
|
||||
manual: '手动',
|
||||
automatic: '自动',
|
||||
brightness: '100lux',
|
||||
brightness2: '30lux',
|
||||
manual2: '手动',
|
||||
automatic2: '自动',
|
||||
brightness3: '4000k',
|
||||
brightness4: '3800k',
|
||||
},
|
||||
]);
|
||||
let trIndex = ref('-1');
|
||||
const logModalVisible = ref(false);
|
||||
const handleRowClick = (index: any) => {
|
||||
trIndex.value = index;
|
||||
if (index === trIndex.value) {
|
||||
console.log('tri');
|
||||
}
|
||||
// 显示模态框
|
||||
logModalVisible.value = true;
|
||||
};
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
@import "./dialogStyle.less";
|
||||
@import './dialogStyle.less';
|
||||
|
||||
// 右下角添加按钮
|
||||
.div-add {
|
||||
height: 64px;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
margin-right: 20px;
|
||||
.add {
|
||||
width: 74px;
|
||||
height: 40px;
|
||||
opacity: 1;
|
||||
border-radius: 4px;
|
||||
background: rgba(67, 136, 251, 1);
|
||||
border: rgba(67, 136, 251, 1);
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
// 右下角添加按钮
|
||||
.div-add {
|
||||
height: 64px;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
margin-right: 20px;
|
||||
.add {
|
||||
width: 74px;
|
||||
height: 40px;
|
||||
opacity: 1;
|
||||
border-radius: 4px;
|
||||
background: rgba(67, 136, 251, 1);
|
||||
border: rgba(67, 136, 251, 1);
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
// 表格
|
||||
.custom-table {
|
||||
border-collapse: collapse;
|
||||
width: 416px;
|
||||
height: 60px;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
// 表格
|
||||
.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%;
|
||||
border: 1px solid rgba(255, 255, 255);
|
||||
border-radius: 5px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
|
||||
.tabReboot,
|
||||
.tabDelete {
|
||||
border: none;
|
||||
background-color: rgba(0, 0, 0, 0);
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
letter-spacing: 0;
|
||||
line-height: 20px;
|
||||
color: rgba(67, 136, 251, 1);
|
||||
}
|
||||
|
||||
.tabReboot {
|
||||
margin-right: 8px;
|
||||
.custom-table th,
|
||||
.custom-table td {
|
||||
border: 1px solid rgba(163, 192, 243, 1);
|
||||
text-align: left;
|
||||
padding: 8px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.isTrIndex {
|
||||
background: rgba(67, 136, 251, 1);
|
||||
}
|
||||
}
|
||||
.table1 {
|
||||
margin-top: 20px;
|
||||
width: 100%;
|
||||
border: 1px solid rgba(255, 255, 255);
|
||||
border-radius: 5px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
|
||||
::v-deep(.ant-transfer) {
|
||||
.tabReboot,
|
||||
.tabDelete {
|
||||
border: none;
|
||||
background-color: rgba(0, 0, 0, 0);
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
letter-spacing: 0;
|
||||
line-height: 20px;
|
||||
color: rgba(67, 136, 251, 1);
|
||||
}
|
||||
|
||||
// 屏蔽自带的hover效果
|
||||
.ant-transfer-list-content-item:hover {
|
||||
background: black;
|
||||
.tabReboot {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.isTrIndex {
|
||||
background: rgba(67, 136, 251, 1);
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep(.ant-transfer) {
|
||||
// 屏蔽自带的hover效果
|
||||
.ant-transfer-list-content-item:hover {
|
||||
background: black;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,88 +0,0 @@
|
||||
import { ref } from 'vue';
|
||||
export const treeData = ref([
|
||||
{
|
||||
label: '站厅',
|
||||
id: '1',
|
||||
// 前端遍历后添加,属前端属性
|
||||
selected: false,
|
||||
children: [{
|
||||
label: '站厅1区',
|
||||
id: '1-1',
|
||||
// 前端属性
|
||||
selected: false,
|
||||
// 后端属性(表示禁用了一个设备)
|
||||
stop: false,
|
||||
// 当前的控制模式
|
||||
type: 3
|
||||
},{
|
||||
label: '站厅2区',
|
||||
id: '1-2',
|
||||
selected: false,
|
||||
stop: false,
|
||||
type: 1
|
||||
}]
|
||||
},
|
||||
{
|
||||
label: '站台',
|
||||
id: '2',
|
||||
selected: false,
|
||||
children: [{
|
||||
label: '站台1区',
|
||||
id: '2-1',
|
||||
selected: false,
|
||||
stop: false,
|
||||
type: 1
|
||||
},{
|
||||
label: '站台2区',
|
||||
id: '2-2',
|
||||
selected: false,
|
||||
stop: false,
|
||||
type: 2
|
||||
},{
|
||||
label: '站台3区',
|
||||
id: '2-3',
|
||||
selected: false,
|
||||
stop: false,
|
||||
type: 3
|
||||
},{
|
||||
label: '站台4区',
|
||||
id: '2-4',
|
||||
selected: false,
|
||||
stop: false,
|
||||
type: 1
|
||||
}]
|
||||
},{
|
||||
label: '办公室',
|
||||
id: '3',
|
||||
selected: false,
|
||||
children: [{
|
||||
label: '办公室1区',
|
||||
id: '3-1',
|
||||
selected: false,
|
||||
stop: false,
|
||||
type: 2
|
||||
}]
|
||||
},{
|
||||
label: '楼道',
|
||||
id: '4',
|
||||
selected: false,
|
||||
children: [{
|
||||
label: '楼道1区',
|
||||
id: '4-1',
|
||||
selected: false,
|
||||
stop: false,
|
||||
type: 3
|
||||
}]
|
||||
},
|
||||
]);
|
||||
|
||||
export const controlType = ref([{
|
||||
name: '托管',
|
||||
type: 1,
|
||||
},{
|
||||
name: 'AI',
|
||||
type: 2,
|
||||
},{
|
||||
name: '手动',
|
||||
type: 3,
|
||||
}])
|
||||
@@ -103,7 +103,8 @@ export const formSchema = [
|
||||
field: 'pointName',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入节点名称(必填)',
|
||||
placeholder: '请输入',
|
||||
maxLength: 32,
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
@@ -117,7 +118,7 @@ export const formSchema = [
|
||||
field: 'pointType',
|
||||
component: 'NsSelectApi',
|
||||
componentProps: {
|
||||
placeholder: '请选择节点类型(必填)',
|
||||
placeholder: '请选择',
|
||||
api: () => dict({ params: { dicKey: 'COUNT_POINT' } }),
|
||||
// params: { dicKey: 'COUNT_POINT' },
|
||||
immediate: true,
|
||||
@@ -225,7 +226,7 @@ export const tableConfig = (el, elGroup, elFormula, defaultParams) => {
|
||||
headerActions: [
|
||||
{
|
||||
label: '编辑',
|
||||
name: 'groupEdit',
|
||||
name: 'GroupEdit',
|
||||
type: 'primary',
|
||||
dynamicDisabled: () => !defaultParams.value?.id,
|
||||
handle: (a, b) => {
|
||||
@@ -234,7 +235,7 @@ export const tableConfig = (el, elGroup, elFormula, defaultParams) => {
|
||||
},
|
||||
{
|
||||
label: '批量删除',
|
||||
name: 'groupBatDelete',
|
||||
name: 'GroupDelete',
|
||||
type: 'primary',
|
||||
dynamicDisabled: (data: any) => {
|
||||
return data.list.length === 0;
|
||||
@@ -247,7 +248,7 @@ export const tableConfig = (el, elGroup, elFormula, defaultParams) => {
|
||||
},
|
||||
{
|
||||
label: '批量导出',
|
||||
name: 'groupExports',
|
||||
name: 'GroupPointExports',
|
||||
type: 'primary',
|
||||
dynamicDisabled: (data: any) => {
|
||||
return data.list.length === 0;
|
||||
@@ -259,7 +260,7 @@ export const tableConfig = (el, elGroup, elFormula, defaultParams) => {
|
||||
},
|
||||
{
|
||||
label: '批量导入',
|
||||
name: 'groupImport',
|
||||
name: 'GroupPointImport',
|
||||
type: 'primary',
|
||||
extra: {
|
||||
// api: props.postImportApi, // 导入接口名
|
||||
@@ -277,7 +278,7 @@ export const tableConfig = (el, elGroup, elFormula, defaultParams) => {
|
||||
|
||||
{
|
||||
label: '模板下载',
|
||||
name: 'groupTemDownload',
|
||||
name: 'GroupTempDownload',
|
||||
type: 'primary',
|
||||
handle: () => {
|
||||
// http.get('/asset/file/whiteListUser.xlsx');
|
||||
@@ -291,7 +292,7 @@ export const tableConfig = (el, elGroup, elFormula, defaultParams) => {
|
||||
actions: [
|
||||
{
|
||||
label: '删除',
|
||||
name: 'groupDelete',
|
||||
name: 'GroupDelete',
|
||||
dynamicParams: { linkIds: 'linkId[]' },
|
||||
confirm: true,
|
||||
isClearCheck: true,
|
||||
@@ -346,7 +347,7 @@ export const tableConfigCal = (el, elGroup, elFormula, defaultParams) => {
|
||||
headerActions: [
|
||||
{
|
||||
label: '编辑',
|
||||
name: 'groupEdit',
|
||||
name: 'GroupPointEdit',
|
||||
type: 'primary',
|
||||
handle: (a, b) => {
|
||||
el.value.toggle();
|
||||
@@ -354,7 +355,7 @@ export const tableConfigCal = (el, elGroup, elFormula, defaultParams) => {
|
||||
},
|
||||
{
|
||||
label: '批量删除',
|
||||
name: 'groupTemDownload',
|
||||
name: 'GroupPointDelete',
|
||||
type: 'primary',
|
||||
dynamicDisabled: (data: any) => {
|
||||
return data.list.length === 0;
|
||||
@@ -367,7 +368,7 @@ export const tableConfigCal = (el, elGroup, elFormula, defaultParams) => {
|
||||
},
|
||||
{
|
||||
label: '批量导出',
|
||||
name: 'groupExports',
|
||||
name: 'GroupPointExports',
|
||||
type: 'primary',
|
||||
dynamicDisabled: (data: any) => {
|
||||
return data.list.length === 0;
|
||||
@@ -379,7 +380,7 @@ export const tableConfigCal = (el, elGroup, elFormula, defaultParams) => {
|
||||
},
|
||||
{
|
||||
label: '批量导入',
|
||||
name: 'groupImport',
|
||||
name: 'GroupPointImport',
|
||||
type: 'primary',
|
||||
extra: {
|
||||
// api: props.postImportApi, // 导入接口名
|
||||
@@ -397,7 +398,7 @@ export const tableConfigCal = (el, elGroup, elFormula, defaultParams) => {
|
||||
|
||||
{
|
||||
label: '模板下载',
|
||||
name: 'groupTemDownload',
|
||||
name: 'GroupTempDownload',
|
||||
type: 'primary',
|
||||
handle: () => {
|
||||
// http.get('/asset/file/whiteListUser.xlsx');
|
||||
@@ -407,7 +408,7 @@ export const tableConfigCal = (el, elGroup, elFormula, defaultParams) => {
|
||||
|
||||
{
|
||||
label: '批量分组',
|
||||
name: 'groupBatGroup',
|
||||
name: 'GroupBatchGroup',
|
||||
type: 'primary',
|
||||
dynamicDisabled: (data: any) => {
|
||||
return data.list.length === 0;
|
||||
@@ -421,7 +422,7 @@ export const tableConfigCal = (el, elGroup, elFormula, defaultParams) => {
|
||||
},
|
||||
{
|
||||
label: '公式编辑',
|
||||
name: 'groupFormulaEdit',
|
||||
name: 'GroupFormulaEdit',
|
||||
type: 'primary',
|
||||
handle: () => {
|
||||
elFormula.value.toggle();
|
||||
@@ -435,7 +436,7 @@ export const tableConfigCal = (el, elGroup, elFormula, defaultParams) => {
|
||||
actions: [
|
||||
{
|
||||
label: '删除',
|
||||
name: 'groupDelete',
|
||||
name: 'GroupPointDelete',
|
||||
dynamicParams: { ids: 'id[]' },
|
||||
confirm: true,
|
||||
isReload: true,
|
||||
|
||||
@@ -27,9 +27,11 @@
|
||||
<template #overlay>
|
||||
<a-menu>
|
||||
<template v-for="(item, index) in filterAction(actionList, data)" :key="index">
|
||||
<!-- <div v-auth.all="item.name"> -->
|
||||
<a-menu-item @click="item.func(data)">
|
||||
<span>{{ item.title }}</span>
|
||||
</a-menu-item>
|
||||
<!-- </div> -->
|
||||
</template>
|
||||
</a-menu>
|
||||
</template>
|
||||
@@ -54,6 +56,8 @@
|
||||
import NsModalFrom from '/@/components/ns-modal-form.vue';
|
||||
import { group } from '/@/api/deviceManage';
|
||||
import { http } from '/nerv-lib/util/http';
|
||||
import { authorizationService } from '/nerv-lib/saas/store/modules/authorization-service';
|
||||
const { checkAllPermission } = authorizationService();
|
||||
|
||||
type opType = 'up' | 'down';
|
||||
const { getParams } = useParams();
|
||||
@@ -156,14 +160,15 @@
|
||||
if (data.id === 'all') {
|
||||
list = ['addNodeSon'];
|
||||
}
|
||||
return actions.filter(({ key }) => list.includes(key));
|
||||
const res = actions.filter(({ key, name }) => list.includes(key) && checkAllPermission(name));
|
||||
return res;
|
||||
};
|
||||
const actionList = [
|
||||
{ title: '新增子节点', key: 'addNodeSon', func: (data) => addNodeSon(data) },
|
||||
{ title: '编辑', key: 'editNode', func: (data) => editNode(data) },
|
||||
{ title: '上移', key: 'moveUp', func: (data) => moveNode(data, 'up') },
|
||||
{ title: '下移', key: 'moveDown', func: (data) => moveNode(data, 'down') },
|
||||
{ title: '删除', key: 'deleteNode', func: (data) => deleteNode(data) },
|
||||
{ title: '新增子节点', name: 'GroupAdd', key: 'addNodeSon', func: (data) => addNodeSon(data) },
|
||||
{ title: '编辑', name: 'GroupEdit', key: 'editNode', func: (data) => editNode(data) },
|
||||
{ title: '上移', name: 'Group', key: 'moveUp', func: (data) => moveNode(data, 'up') },
|
||||
{ title: '下移', name: 'Group', key: 'moveDown', func: (data) => moveNode(data, 'down') },
|
||||
{ title: '删除', name: 'GroupDelete', key: 'deleteNode', func: (data) => deleteNode(data) },
|
||||
];
|
||||
const handleSelect = (key, record) => {
|
||||
//清除选中行数据
|
||||
|
||||
@@ -34,7 +34,7 @@ export const tableConfig = (orgId) => {
|
||||
},
|
||||
},
|
||||
rowSelection: null,
|
||||
scroll: { x: 2000 },
|
||||
// scroll: { x: 2000 },
|
||||
columns: [
|
||||
{
|
||||
title: '设备名称',
|
||||
@@ -159,7 +159,7 @@ export const tableConfig = (orgId) => {
|
||||
// labelField: 'deviceName',
|
||||
// valueField: 'deviceName',
|
||||
filterOption: (input: string, option: any) => {
|
||||
return option.deviceName.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
||||
return option.deviceName?.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
||||
},
|
||||
showSearch: true,
|
||||
immediate: true,
|
||||
@@ -231,7 +231,7 @@ export const tableConfig = (orgId) => {
|
||||
// labelField: 'manufacturer',
|
||||
// valueField: 'manufacturer',
|
||||
filterOption: (input: string, option: any) => {
|
||||
return option.manufacturer.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
||||
return option.manufacturer?.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
||||
},
|
||||
showSearch: true,
|
||||
immediate: true,
|
||||
|
||||
@@ -69,11 +69,18 @@
|
||||
{
|
||||
title: '序号',
|
||||
customRender: ({ record, index }) => {
|
||||
debugger;
|
||||
// 自定义单元格内容,这里返回序号
|
||||
if (index == 0 || data.value[index - 1].deviceName == record.deviceName) {
|
||||
return index + 1;
|
||||
if (index == 0) {
|
||||
data.value[index].index = 1;
|
||||
// return 1;
|
||||
} else if (data.value[index - 1].deviceName == record.deviceName) {
|
||||
data.value[index].index = data.value[index - 1].index;
|
||||
// return data.value[index].index;
|
||||
} else {
|
||||
data.value[index].index = data.value[index - 1].index + 1;
|
||||
}
|
||||
return index;
|
||||
return data.value[index].index;
|
||||
},
|
||||
customCell: (record, rowIndex) => {
|
||||
if (rowIndex == undefined) {
|
||||
|
||||
@@ -52,12 +52,13 @@
|
||||
|
||||
<script lang="ts">
|
||||
import type { TreeSelectProps, SelectProps } from 'ant-design-vue';
|
||||
import { defineComponent, ref, onMounted } from 'vue';
|
||||
import { defineComponent, ref, onMounted, watch } from 'vue';
|
||||
import { Dayjs } from 'dayjs';
|
||||
import { inject } from 'vue';
|
||||
import { http } from '/nerv-lib/util';
|
||||
import { device } from '/@/api/deviceManage';
|
||||
import { deviceMonitor } from '/@/api/monitor';
|
||||
import { Item } from 'ant-design-vue/lib/menu';
|
||||
|
||||
export default defineComponent({
|
||||
// eslint-disable-next-line vue/multi-word-component-names
|
||||
@@ -106,7 +107,8 @@
|
||||
}
|
||||
let records = res.data.records;
|
||||
records.forEach((item: any) => {
|
||||
(item.title = item.deviceModel + ' ' + item.deviceName), (item.key = item.id);
|
||||
(item.title = item.snCode + '(' + item.deviceName + ')'),
|
||||
(item.key = item.deviceInfoCode);
|
||||
});
|
||||
let a: TreeSelectProps['treeData'] = [{ title: label[0], key: val, children: records }];
|
||||
treeData2.value = a;
|
||||
@@ -145,16 +147,34 @@
|
||||
const dateRange = ref<[Dayjs, Dayjs] | undefined>();
|
||||
|
||||
const getDianWeiList = () => {
|
||||
console.log('getDianWeiList 被调用');
|
||||
options1.value = [
|
||||
{ value: '1', label: 'A 项电压' },
|
||||
{ value: '2', label: 'B 项电压' },
|
||||
{ value: '3', label: 'C 项电压' },
|
||||
{ value: '4', label: 'AB 线电压' },
|
||||
{ value: '5', label: 'BC 线电压' },
|
||||
{ value: '6', label: 'A 项电流' },
|
||||
{ value: '7', label: 'B 项电流' },
|
||||
];
|
||||
if (checkedKeys.value && checkedKeys.value.length > 0) {
|
||||
http
|
||||
.post(deviceMonitor.getDevicePointToMonitor, {
|
||||
deviceIds: checkedKeys.value,
|
||||
orgId: orgId.value,
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.retcode == 0) {
|
||||
options1.value = [];
|
||||
res.data.forEach((item: any) => {
|
||||
options1.value?.push({ value: item.code, label: item.name });
|
||||
});
|
||||
}
|
||||
|
||||
// options1.value = res.data;
|
||||
});
|
||||
} else {
|
||||
options1.value = [];
|
||||
}
|
||||
// options1.value = [
|
||||
// { value: '1', label: 'A 项电压' },
|
||||
// { value: '2', label: 'B 项电压' },
|
||||
// { value: '3', label: 'C 项电压' },
|
||||
// { value: '4', label: 'AB 线电压' },
|
||||
// { value: '5', label: 'BC 线电压' },
|
||||
// { value: '6', label: 'A 项电流' },
|
||||
// { value: '7', label: 'B 项电流' },
|
||||
// ];
|
||||
};
|
||||
|
||||
interface PageData {
|
||||
@@ -171,11 +191,11 @@
|
||||
const getSelect = () => {
|
||||
http
|
||||
.post(deviceMonitor.getDeviceGraph, {
|
||||
deviceIds: ['HLlmTZp8-0601-0001', 'HLlmTZp-0804-0001'],
|
||||
devicePointCode: 'ua',
|
||||
devicePointId: 32,
|
||||
endDate: '2024-07-02',
|
||||
startDate: '2024-07-01',
|
||||
deviceIds: checkedKeys.value,
|
||||
devicePointCode: selectedValue.value,
|
||||
|
||||
endDate: endDate.value,
|
||||
startDate: startDate.value,
|
||||
timeRate: '2',
|
||||
})
|
||||
.then((res) => {
|
||||
@@ -185,172 +205,20 @@
|
||||
pageData.graphList = res.data.graphData;
|
||||
pageData.XData = res.data.XData;
|
||||
});
|
||||
// pageData.tableList = [
|
||||
// {
|
||||
// key: '1',
|
||||
// name: 'AC_002(暖通电表)',
|
||||
// position: 'A 相电压',
|
||||
// unit: 'V',
|
||||
// date: '2023-12-01',
|
||||
// '1:00': '3626',
|
||||
// },
|
||||
// {
|
||||
// key: '1',
|
||||
// name: 'AC_002(暖通电表)',
|
||||
// position: 'A 相电压',
|
||||
// unit: 'V',
|
||||
// date: '2023-12-01',
|
||||
// '1:00': '3626',
|
||||
// },
|
||||
// {
|
||||
// key: '2',
|
||||
// name: 'AC_003(照明电表)',
|
||||
// position: 'A 相电压',
|
||||
// unit: 'V',
|
||||
// date: '2023-12-01',
|
||||
// '1:00': '3626',
|
||||
// },
|
||||
// {
|
||||
// key: '2',
|
||||
// name: 'AC_003(照明电表)',
|
||||
// position: 'A 相电压',
|
||||
// unit: 'V',
|
||||
// date: '2023-12-01',
|
||||
// '1:00': '3626',
|
||||
// },
|
||||
// {
|
||||
// key: '3',
|
||||
// name: 'AC_004(给排水电表)',
|
||||
// position: 'A 相电压',
|
||||
// unit: 'V',
|
||||
// date: '2023-12-01',
|
||||
// '1:00': '3626',
|
||||
// },
|
||||
// ];
|
||||
// pageData.tableColumns = [
|
||||
// {
|
||||
// title: '00:00',
|
||||
// dataIndex: '00:00',
|
||||
// },
|
||||
// ];
|
||||
// pageData.graphList = [
|
||||
// {
|
||||
// date: '2023-12-01 0:00',
|
||||
// unit: 'V',
|
||||
// data: [
|
||||
// {
|
||||
// name: 'AC_002(暖通电表)',
|
||||
// value: '21',
|
||||
// },
|
||||
// {
|
||||
// name: 'AC_003(照明电表)',
|
||||
// value: '36',
|
||||
// },
|
||||
// {
|
||||
// name: 'AC_004(给排水电表)',
|
||||
// value: '5',
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
// {
|
||||
// date: '2023-12-02 0:00',
|
||||
// unit: 'V',
|
||||
// data: [
|
||||
// {
|
||||
// name: 'AC_002(暖通电表)',
|
||||
// value: '26',
|
||||
// },
|
||||
// {
|
||||
// name: 'AC_003(照明电表)',
|
||||
// value: '25',
|
||||
// },
|
||||
// {
|
||||
// name: 'AC_004(给排水电表)',
|
||||
// value: '47',
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
// {
|
||||
// date: '2023-12-03 0:00',
|
||||
// unit: 'V',
|
||||
// data: [
|
||||
// {
|
||||
// name: 'AC_002(暖通电表)',
|
||||
// value: '18',
|
||||
// },
|
||||
// {
|
||||
// name: 'AC_003(照明电表)',
|
||||
// value: '22',
|
||||
// },
|
||||
// {
|
||||
// name: 'AC_004(给排水电表)',
|
||||
// value: '26',
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
// {
|
||||
// date: '2023-12-04 0:00',
|
||||
// unit: 'V',
|
||||
// data: [
|
||||
// {
|
||||
// name: 'AC_002(暖通电表)',
|
||||
// value: '40',
|
||||
// },
|
||||
// {
|
||||
// name: 'AC_003(照明电表)',
|
||||
// value: '15',
|
||||
// },
|
||||
// {
|
||||
// name: 'AC_004(给排水电表)',
|
||||
// value: '12',
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
// {
|
||||
// date: '2023-12-05 0:00',
|
||||
// unit: 'V',
|
||||
// data: [
|
||||
// {
|
||||
// name: 'AC_002(暖通电表)',
|
||||
// value: '15',
|
||||
// },
|
||||
// {
|
||||
// name: 'AC_003(照明电表)',
|
||||
// value: '18',
|
||||
// },
|
||||
// {
|
||||
// name: 'AC_004(给排水电表)',
|
||||
// value: '15',
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
// {
|
||||
// date: '2023-12-06 0:00',
|
||||
// unit: 'V',
|
||||
// data: [
|
||||
// {
|
||||
// name: 'AC_002(暖通电表)',
|
||||
// value: '15',
|
||||
// },
|
||||
// {
|
||||
// name: 'AC_003(照明电表)',
|
||||
// value: '18',
|
||||
// },
|
||||
// {
|
||||
// name: 'AC_004(给排水电表)',
|
||||
// value: '15',
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
// ];
|
||||
};
|
||||
|
||||
type RangeValue = [Dayjs, Dayjs];
|
||||
const dates = ref<RangeValue>();
|
||||
const hackValue = ref<RangeValue>();
|
||||
const startDate = ref<String>();
|
||||
const endDate = ref<String>();
|
||||
|
||||
const onChange = (val: RangeValue) => {
|
||||
const onChange = (val: RangeValue, dateStrings: any) => {
|
||||
dateRange.value = val;
|
||||
if (dateStrings && dateStrings.length === 2) {
|
||||
startDate.value = dateStrings[0];
|
||||
endDate.value = dateStrings[1];
|
||||
}
|
||||
};
|
||||
const onOpenChange = (open: boolean) => {
|
||||
if (open) {
|
||||
@@ -373,10 +241,17 @@
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getDianWeiList();
|
||||
changeDeviceType(null, null);
|
||||
getSelect();
|
||||
});
|
||||
// 监听 pageData 的变化
|
||||
watch(
|
||||
() => checkedKeys,
|
||||
(_newValue, _oldValue) => {
|
||||
getDianWeiList();
|
||||
},
|
||||
{ deep: true },
|
||||
);
|
||||
|
||||
return {
|
||||
treeLine,
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<a-row type="flex" style="height: 92%">
|
||||
<a-col :span="8">
|
||||
<a-col :span="8" style="height: 100%">
|
||||
<div
|
||||
style="
|
||||
box-shadow: 0 0 0 2px rgba(218, 218, 218, 0.5); /* 灰色阴影 */
|
||||
@@ -24,7 +24,7 @@
|
||||
<div ref="analysisGraphchart" style="width: 100%; height: 95%"></div>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="16">
|
||||
<a-col :span="16" style="height: 100%">
|
||||
<div
|
||||
ref="analysisGraphRingchart"
|
||||
style="
|
||||
@@ -83,7 +83,14 @@
|
||||
},
|
||||
{ deep: true },
|
||||
);
|
||||
const changeMode = () => {};
|
||||
const changeMode = () => {
|
||||
// if (mode.value == '1') {
|
||||
// mode.value = '2';
|
||||
// } else {
|
||||
// mode.value = '1';
|
||||
// }
|
||||
drawLeft();
|
||||
};
|
||||
const analysisGraphchart = ref(null);
|
||||
const analysisGraphRingchart = ref(null);
|
||||
const analysisGraphBarchart = ref(null);
|
||||
@@ -97,7 +104,22 @@
|
||||
let chartRight2: echarts.ECharts | null = null;
|
||||
|
||||
const draw = () => {
|
||||
data.value = pageData.analysisGraphList;
|
||||
// 深度拷贝
|
||||
let dataList = JSON.parse(JSON.stringify(pageData.analysisGraphList));
|
||||
// let dataList = pageData.analysisGraphList;
|
||||
dataList.forEach((item) => {
|
||||
if (item.yoyValue < 0) {
|
||||
item.yoyLabel = { position: 'right' };
|
||||
} else {
|
||||
item.yoyLabel = { position: 'insideLeft' };
|
||||
}
|
||||
if (item.momValue < 0) {
|
||||
item.momLabel = { position: 'right' };
|
||||
} else {
|
||||
item.momLabel = { position: 'insideLeft' };
|
||||
}
|
||||
});
|
||||
data.value = dataList;
|
||||
// 绘制左侧图
|
||||
drawLeft();
|
||||
drawRight1();
|
||||
@@ -111,10 +133,35 @@
|
||||
|
||||
var seriesdata = [];
|
||||
var dateX = [];
|
||||
// {
|
||||
// name: 'AC_002(暖通电表)',
|
||||
// value: -21,
|
||||
// ringValue: 21,
|
||||
// energyType: selectedValue.value,
|
||||
// energyUnit: 'kWh',
|
||||
// unit: 'V',
|
||||
// labelRight: {
|
||||
// position: 'right',
|
||||
// },
|
||||
// },
|
||||
|
||||
// id: 'HLlmTZp8_0805_0001';
|
||||
// momDiff: 38.28; 环比差值
|
||||
// momRate: '-171.58%'; 环比率
|
||||
// momValue: -22.31; 环比值
|
||||
// name: '总电表';
|
||||
// value: 10.56; 值
|
||||
// yoyDiff: 38.28; 同比差值
|
||||
// yoyRate: '-138.10%'; 同比率
|
||||
// yoyValue: -27.72; 同比值
|
||||
for (let i = 0; i < data.value.length; i++) {
|
||||
dateX.push(data.value[i].name);
|
||||
|
||||
seriesdata.push({ value: data.value[i].value, label: data.value[i].labelRight });
|
||||
if (mode.value == '1') {
|
||||
seriesdata.push({ value: data.value[i].yoyValue, label: data.value[i].yoyLabel });
|
||||
} else {
|
||||
seriesdata.push({ value: data.value[i].momValue, label: data.value[i].momLabel });
|
||||
}
|
||||
}
|
||||
|
||||
var seriesList = [
|
||||
@@ -196,7 +243,7 @@
|
||||
for (let i = 0; i < data.value.length; i++) {
|
||||
dateX.push(data.value[i].name);
|
||||
|
||||
seriesdata.push({ value: data.value[i].ringValue, name: data.value[i].name });
|
||||
seriesdata.push({ value: data.value[i].value, name: data.value[i].name });
|
||||
}
|
||||
var seriesList = [
|
||||
{
|
||||
@@ -294,11 +341,10 @@
|
||||
data.value.forEach((item) => {
|
||||
if (item.name !== auxiliary.name) {
|
||||
dateX.push(item.name);
|
||||
showData.push(item.ringValue);
|
||||
showData.push(item.value);
|
||||
compareData.push(auxiliary.value);
|
||||
}
|
||||
});
|
||||
|
||||
const option = {
|
||||
// 图例
|
||||
legend: {
|
||||
|
||||
@@ -1,5 +1,18 @@
|
||||
<template>
|
||||
<a-table :columns="columns" :data-source="data" bordered />
|
||||
<a-table
|
||||
row-key="id"
|
||||
:columns="columns"
|
||||
:data-source="data"
|
||||
bordered
|
||||
:row-selection="rowSelection">
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.title === '操作'">
|
||||
<a-button type="link" @click="setStandard(record)" v-if="record.id != selectedKey[0]"
|
||||
>设为目标值</a-button
|
||||
>
|
||||
</template>
|
||||
</template>
|
||||
</a-table>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
@@ -8,25 +21,35 @@
|
||||
export default defineComponent({
|
||||
name: 'AnalysisTable',
|
||||
setup() {
|
||||
const selectedKey = ref([]);
|
||||
const rowSelection = {
|
||||
type: 'radio',
|
||||
|
||||
selectedRowKeys: selectedKey,
|
||||
// onChange: (selectedRowKeys: string[]) => {
|
||||
// selectedKey.value = selectedRowKeys;
|
||||
// debugger;
|
||||
// },
|
||||
};
|
||||
const columns = [
|
||||
{
|
||||
title: '设备/节点',
|
||||
dataIndex: 'key',
|
||||
dataIndex: 'name',
|
||||
},
|
||||
{
|
||||
title: '统计值',
|
||||
dataIndex: 'name',
|
||||
dataIndex: 'value',
|
||||
},
|
||||
{
|
||||
title: '同比',
|
||||
children: [
|
||||
{
|
||||
title: '△差值',
|
||||
dataIndex: 'position',
|
||||
dataIndex: 'yoyDiff',
|
||||
},
|
||||
{
|
||||
title: '增长率',
|
||||
dataIndex: 'unit',
|
||||
dataIndex: 'yoyRate',
|
||||
},
|
||||
],
|
||||
},
|
||||
@@ -35,11 +58,11 @@
|
||||
children: [
|
||||
{
|
||||
title: '△差值',
|
||||
dataIndex: 'position',
|
||||
dataIndex: 'momDiff',
|
||||
},
|
||||
{
|
||||
title: '增长率',
|
||||
dataIndex: 'unit',
|
||||
dataIndex: 'momRate',
|
||||
},
|
||||
],
|
||||
},
|
||||
@@ -48,18 +71,18 @@
|
||||
children: [
|
||||
{
|
||||
title: '△差值',
|
||||
dataIndex: 'position',
|
||||
dataIndex: 'zongxiangDiff',
|
||||
},
|
||||
{
|
||||
title: '增长率',
|
||||
dataIndex: 'unit',
|
||||
dataIndex: 'zongxiangRate',
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'date',
|
||||
// dataIndex: 'date',
|
||||
},
|
||||
];
|
||||
let data = ref<any[]>([]);
|
||||
@@ -85,16 +108,45 @@
|
||||
watch(
|
||||
() => pageData as PageData,
|
||||
(_newValue, _oldValue) => {
|
||||
data.value = pageData.analysisTableList;
|
||||
// 深度拷贝
|
||||
data.value = JSON.parse(JSON.stringify(pageData.analysisTableList));
|
||||
setStandard(data.value[0]);
|
||||
},
|
||||
{ deep: true },
|
||||
);
|
||||
onMounted(() => {
|
||||
data.value = pageData.analysisTableList;
|
||||
// 深度拷贝
|
||||
data.value = JSON.parse(JSON.stringify(pageData.analysisTableList));
|
||||
// selectedKey.value = [data.value[0]];
|
||||
setStandard(data.value[0]);
|
||||
});
|
||||
const setStandard = (record: any) => {
|
||||
selectedKey.value = [record.id];
|
||||
data.value.forEach((item) => {
|
||||
// id: 'HLlmTZp8_0805_0001';
|
||||
// momDiff: 38.28; 环比差值
|
||||
// momRate: '-171.58%'; 环比率
|
||||
// momValue: -22.31; 环比值
|
||||
// name: '总电表';
|
||||
// value: 10.56; 值
|
||||
// yoyDiff: 38.28; 同比差值
|
||||
// yoyRate: '-138.10%'; 同比率
|
||||
// yoyValue: -27.72; 同比值
|
||||
if (item.id == record.id) {
|
||||
item.zongxiangDiff = '——';
|
||||
item.zongxiangRate = '——';
|
||||
} else {
|
||||
item.zongxiangDiff = (item.value - record.value).toFixed(2);
|
||||
item.zongxiangRate = ((item.zongxiangDiff / record.value) * 100).toFixed(2) + '%';
|
||||
}
|
||||
});
|
||||
};
|
||||
return {
|
||||
data,
|
||||
columns,
|
||||
rowSelection,
|
||||
selectedKey,
|
||||
setStandard,
|
||||
};
|
||||
},
|
||||
});
|
||||
|
||||
@@ -48,26 +48,33 @@
|
||||
}
|
||||
chartInstance = echarts.init(graphGraphchart.value);
|
||||
var seriesList = [];
|
||||
var date = [];
|
||||
var date = pageData.graphTableColumns;
|
||||
var legendList: string | any[] = [];
|
||||
for (let i = 0; i < data.value.length; i++) {
|
||||
date.push(data.value[i].date);
|
||||
// date.push(data.value[i].date);
|
||||
|
||||
for (let j = 0; j < data.value[i].data.length; j++) {
|
||||
if (seriesList.length < j + 1) {
|
||||
seriesList.push({
|
||||
name: data.value[i].data[j].name,
|
||||
data: [data.value[i].data[j].value],
|
||||
type: 'line',
|
||||
smooth: true,
|
||||
});
|
||||
} else {
|
||||
seriesList[j].data.push(data.value[i].data[j].value);
|
||||
}
|
||||
if (legendList.length == 0 || legendList.length < j + 1) {
|
||||
legendList.push(data.value[i].data[j].name);
|
||||
}
|
||||
}
|
||||
// for (let j = 0; j < data.value[i].data.length; j++) {
|
||||
// if (seriesList.length < j + 1) {
|
||||
// seriesList.push({
|
||||
// name: data.value[i].data[j].name,
|
||||
// data: [data.value[i].data[j].value],
|
||||
// type: 'line',
|
||||
// smooth: true,
|
||||
// });
|
||||
// } else {
|
||||
// seriesList[j].data.push(data.value[i].data[j].value);
|
||||
// }
|
||||
// if (legendList.length == 0 || legendList.length < j + 1) {
|
||||
// legendList.push(data.value[i].data[j].name);
|
||||
// }
|
||||
// }
|
||||
seriesList.push({
|
||||
name: data.value[i].deviceName,
|
||||
data: data.value[i].data,
|
||||
type: 'line',
|
||||
smooth: true,
|
||||
});
|
||||
legendList.push(data.value[i].deviceName);
|
||||
}
|
||||
const option = {
|
||||
legend: {
|
||||
|
||||
@@ -1,5 +1,10 @@
|
||||
<template>
|
||||
<a-table :columns="columns" :data-source="data" bordered />
|
||||
<a-table
|
||||
:columns="columns"
|
||||
:data-source="data"
|
||||
bordered
|
||||
style="width: 100%"
|
||||
:scroll="{ x: '2000' }" />
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
@@ -33,13 +38,14 @@
|
||||
watch(
|
||||
() => pageData as PageData,
|
||||
(_newValue, _oldValue) => {
|
||||
data.value = pageData.graphTableList;
|
||||
// data.value = pageData.graphTableList;
|
||||
|
||||
let columnA: any[] = [...column];
|
||||
columnA.push(...pageData.graphTableColumns);
|
||||
columns.value = columnA;
|
||||
// pageData.graphList;
|
||||
// 执行你的逻辑代码
|
||||
// let columnA: any[] = [...column];
|
||||
// columnA.push(...pageData.graphTableColumns);
|
||||
// columns.value = columnA;
|
||||
// // pageData.graphList;
|
||||
// // 执行你的逻辑代码
|
||||
init();
|
||||
},
|
||||
{ deep: true },
|
||||
);
|
||||
@@ -66,7 +72,7 @@
|
||||
const column: TableColumnType[] = [
|
||||
{
|
||||
title: '设备/组名',
|
||||
dataIndex: 'name',
|
||||
dataIndex: 'deviceName',
|
||||
customCell: (record, rowIndex) => {
|
||||
if (rowIndex == undefined) {
|
||||
return {
|
||||
@@ -74,8 +80,8 @@
|
||||
colSpan: 0,
|
||||
};
|
||||
}
|
||||
const rowSpan = getRowSpan('name', record, data.value);
|
||||
if (rowIndex != 0 && data.value[rowIndex - 1].name == record.name) {
|
||||
const rowSpan = getRowSpan('deviceName', record, data.value);
|
||||
if (rowIndex != 0 && data.value[rowIndex - 1].deviceName == record.deviceName) {
|
||||
return {
|
||||
rowSpan: 0,
|
||||
colSpan: 0,
|
||||
@@ -88,7 +94,7 @@
|
||||
},
|
||||
{
|
||||
title: '参数名称',
|
||||
dataIndex: 'paramName',
|
||||
dataIndex: 'selectedValueName',
|
||||
customCell: (record, rowIndex) => {
|
||||
if (rowIndex == undefined) {
|
||||
return {
|
||||
@@ -96,8 +102,8 @@
|
||||
colSpan: 0,
|
||||
};
|
||||
}
|
||||
const rowSpan = getRowSpan('paramName', record, data.value, ['name']);
|
||||
if (rowIndex != 0 && data.value[rowIndex - 1].name == record.name) {
|
||||
const rowSpan = getRowSpan('selectedValueName', record, data.value, ['deviceName']);
|
||||
if (rowIndex != 0 && data.value[rowIndex - 1].deviceName == record.deviceName) {
|
||||
return {
|
||||
rowSpan: 0,
|
||||
colSpan: 0,
|
||||
@@ -110,12 +116,24 @@
|
||||
},
|
||||
];
|
||||
|
||||
onMounted(() => {
|
||||
const init = () => {
|
||||
data.value = pageData.graphTableList;
|
||||
|
||||
let columnA: any[] = [...column];
|
||||
columnA.push(...pageData.graphTableColumns);
|
||||
let columnB: any[] = [];
|
||||
pageData.graphTableColumns.forEach((item) => {
|
||||
columnB.push({ title: item, dataIndex: item });
|
||||
});
|
||||
columnA.push(...columnB);
|
||||
columns.value = columnA;
|
||||
};
|
||||
onMounted(() => {
|
||||
init();
|
||||
// data.value = pageData.graphTableList;
|
||||
// let columnA: any[] = [...column];
|
||||
// columnA.push(...pageData.graphTableColumns);
|
||||
// columns.value = columnA;
|
||||
// index.value = 0;
|
||||
});
|
||||
return {
|
||||
data,
|
||||
|
||||
@@ -19,9 +19,9 @@
|
||||
<ns-icon :name="iconName" size="18" style="margin-right: 10px" @click="change" />
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="activeKey == '1'" style="height: 90%">
|
||||
<div v-if="activeKey == '1'" style="height: 90%; width: 100%">
|
||||
<graph-graph ref="graphRef" v-if="isGraph" />
|
||||
<environment-table ref="tableRef" v-else />
|
||||
<environment-table ref="tableRef" v-else style="width: 100%" />
|
||||
</div>
|
||||
<div v-else style="height: 90%">
|
||||
<analysis-graph ref="analysisGraphRef" v-if="isGraph" />
|
||||
|
||||
@@ -15,15 +15,15 @@
|
||||
v-model:value="mode"
|
||||
@change="changeMode"
|
||||
style="padding-bottom: 10px; width: 100%">
|
||||
<a-radio-button value="1" style="width: 50%; text-align: center" :disabled="shebei">
|
||||
<a-radio-button value="0" style="width: 50%; text-align: center" :disabled="shebei">
|
||||
设备
|
||||
</a-radio-button>
|
||||
<a-radio-button value="2" style="width: 50%; text-align: center">节点</a-radio-button>
|
||||
<a-radio-button value="1" style="width: 50%; text-align: center">节点</a-radio-button>
|
||||
</a-radio-group>
|
||||
<a-input
|
||||
v-model:value="deviceName"
|
||||
placeholder="请输入设备名称"
|
||||
v-if="mode == '1'"
|
||||
v-if="mode == '0'"
|
||||
@change="changeMode" />
|
||||
<a-input v-model:value="pointName" placeholder="请输入节点名称" v-else @change="changeMode" />
|
||||
<a-spin :spinning="treeLoading">
|
||||
@@ -34,7 +34,21 @@
|
||||
checkable
|
||||
:height="300"
|
||||
style="width: 100%; overflow-y: auto; margin-bottom: 10px; margin-top: 10px"
|
||||
:tree-data="treeData2" />
|
||||
:tree-data="treeData2">
|
||||
<!-- <template #title="{ title }">
|
||||
<span v-if="title.indexOf(mode == '0' ? deviceName : pointName) > -1">
|
||||
{{ title.substr(0, title.indexOf(mode == '0' ? deviceName : pointName)) }}
|
||||
<span style="color: #f50">{{ mode == '0' ? deviceName : pointName }}</span>
|
||||
{{
|
||||
title.substr(
|
||||
title.indexOf(mode == '0' ? deviceName : pointName) +
|
||||
(mode == '0' ? deviceName : pointName).length,
|
||||
)
|
||||
}}
|
||||
</span>
|
||||
<span v-else>{{ title }}</span>
|
||||
</template> -->
|
||||
</a-tree>
|
||||
</a-spin>
|
||||
|
||||
<div class="fixed-bottom">
|
||||
@@ -48,20 +62,9 @@
|
||||
style="width: 100%; margin-bottom: 10px"
|
||||
v-model:value="dateValue"
|
||||
:picker="dateTypeValue" />
|
||||
<!-- <a-range-picker
|
||||
:value="hackValue || dateRange"
|
||||
:disabled-date="disabledDate"
|
||||
@change="onChange"
|
||||
@openChange="onOpenChange"
|
||||
@calendarChange="onCalendarChange"
|
||||
style="width: 100%; margin-bottom: 10px"
|
||||
:placeholder="['请选择日期', '请选择日期']" /> -->
|
||||
<a-button type="primary" style="width: 100%; margin-bottom: 10px" @click="getSelect">
|
||||
查询
|
||||
</a-button>
|
||||
<!-- <a-button type="primary" style="width: 100%; margin-bottom: 10px" @click="getSelect11">
|
||||
模拟不同数据查询
|
||||
</a-button> -->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -69,9 +72,10 @@
|
||||
<script lang="ts">
|
||||
import type { TreeSelectProps, SelectProps } from 'ant-design-vue';
|
||||
import { defineComponent, ref, onMounted, inject } from 'vue';
|
||||
import { Dayjs } from 'dayjs';
|
||||
import dayjs, { Dayjs } from 'dayjs';
|
||||
import { http } from '/nerv-lib/util';
|
||||
import { device, group } from '/@/api/deviceManage';
|
||||
import { energyMonitor } from '/@/api/monitor';
|
||||
import { dict } from '/@/api';
|
||||
|
||||
export default defineComponent({
|
||||
@@ -95,20 +99,20 @@
|
||||
const options1 = ref<SelectProps['options']>([]);
|
||||
// 日期类型list
|
||||
const options2 = ref<SelectProps['options']>([]);
|
||||
const mode = ref<String>('1');
|
||||
const mode = ref<String>('0');
|
||||
// 能耗类型
|
||||
const selectedValue = ref<string | number | null | undefined>();
|
||||
// 日期类型
|
||||
const dateTypeValue = ref<string | undefined>();
|
||||
const dateTypeValue = ref<string | undefined>('month');
|
||||
// 时间
|
||||
const dateValue = ref<[Dayjs, Dayjs] | undefined>();
|
||||
const dateValue = ref<Dayjs | undefined>(dayjs());
|
||||
|
||||
// 页面初始化参数
|
||||
const getOptionsList = async () => {
|
||||
try {
|
||||
const options = await dict({ params: { dicKey: 'ENERGY_TYPE' } });
|
||||
options.data.data.forEach((item: any) => {
|
||||
(item.value = item.cnValue), (item.label = item.cnValue);
|
||||
(item.value = item.dicKey), (item.label = item.cnValue);
|
||||
});
|
||||
options1.value = options.data.data; // 根据返回数据的结构来更新 options1.value
|
||||
if (options1.value) {
|
||||
@@ -149,452 +153,70 @@
|
||||
const changeEnergyType = () => {
|
||||
if (selectedValue.value == '碳排量') {
|
||||
shebei.value = true;
|
||||
mode.value = '2';
|
||||
mode.value = '1';
|
||||
} else {
|
||||
shebei.value = false;
|
||||
}
|
||||
changeMode();
|
||||
};
|
||||
const getSelect = () => {
|
||||
pageData.graphTableList = [
|
||||
{
|
||||
key: '1',
|
||||
name: 'AC_002(暖通电表)',
|
||||
paramName: '用电量(kWh)',
|
||||
date: '2023-12-01',
|
||||
'1:00': '3626',
|
||||
},
|
||||
{
|
||||
key: '1',
|
||||
name: 'AC_002(暖通电表)',
|
||||
paramName: '用电量(kWh)',
|
||||
date: '2023-12-01',
|
||||
'1:00': '3626',
|
||||
},
|
||||
{
|
||||
key: '2',
|
||||
name: 'AC_003(照明电表)',
|
||||
paramName: '用电量(kWh)',
|
||||
date: '2023-12-01',
|
||||
'1:00': '3626',
|
||||
},
|
||||
{
|
||||
key: '2',
|
||||
name: 'AC_003(照明电表)',
|
||||
paramName: '用电量(kWh)',
|
||||
date: '2023-12-01',
|
||||
'1:00': '3626',
|
||||
},
|
||||
{
|
||||
key: '3',
|
||||
name: 'AC_004(给排水电表)',
|
||||
paramName: '用电量(kWh)',
|
||||
date: '2023-12-01',
|
||||
'1:00': '3626',
|
||||
},
|
||||
];
|
||||
pageData.graphTableColumns = [
|
||||
{
|
||||
title: '日期',
|
||||
dataIndex: 'date',
|
||||
},
|
||||
{
|
||||
title: '1:00',
|
||||
dataIndex: '1:00',
|
||||
},
|
||||
];
|
||||
pageData.graphGraphList = [
|
||||
{
|
||||
date: '2023-12-01 0:00',
|
||||
unit: 'V',
|
||||
data: [
|
||||
{
|
||||
name: 'AC_002(暖通电表)',
|
||||
value: '21',
|
||||
},
|
||||
{
|
||||
name: 'AC_003(照明电表)',
|
||||
value: '36',
|
||||
},
|
||||
{
|
||||
name: 'AC_004(给排水电表)',
|
||||
value: '5',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
date: '2023-12-02 0:00',
|
||||
unit: 'V',
|
||||
data: [
|
||||
{
|
||||
name: 'AC_002(暖通电表)',
|
||||
value: '26',
|
||||
},
|
||||
{
|
||||
name: 'AC_003(照明电表)',
|
||||
value: '25',
|
||||
},
|
||||
{
|
||||
name: 'AC_004(给排水电表)',
|
||||
value: '47',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
date: '2023-12-03 0:00',
|
||||
unit: 'V',
|
||||
data: [
|
||||
{
|
||||
name: 'AC_002(暖通电表)',
|
||||
value: '18',
|
||||
},
|
||||
{
|
||||
name: 'AC_003(照明电表)',
|
||||
value: '22',
|
||||
},
|
||||
{
|
||||
name: 'AC_004(给排水电表)',
|
||||
value: '26',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
date: '2023-12-04 0:00',
|
||||
unit: 'V',
|
||||
data: [
|
||||
{
|
||||
name: 'AC_002(暖通电表)',
|
||||
value: '40',
|
||||
},
|
||||
{
|
||||
name: 'AC_003(照明电表)',
|
||||
value: '15',
|
||||
},
|
||||
{
|
||||
name: 'AC_004(给排水电表)',
|
||||
value: '12',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
date: '2023-12-05 0:00',
|
||||
unit: 'V',
|
||||
data: [
|
||||
{
|
||||
name: 'AC_002(暖通电表)',
|
||||
value: '15',
|
||||
},
|
||||
{
|
||||
name: 'AC_003(照明电表)',
|
||||
value: '18',
|
||||
},
|
||||
{
|
||||
name: 'AC_004(给排水电表)',
|
||||
value: '15',
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
pageData.analysisTableList = [
|
||||
{
|
||||
key: '1',
|
||||
name: 'AC_002(暖通电表)',
|
||||
position: 'A 相电压',
|
||||
unit: 'V',
|
||||
date: '2023-12-01',
|
||||
},
|
||||
{
|
||||
key: '1',
|
||||
name: 'AC_002(暖通电表)',
|
||||
position: 'A 相电压',
|
||||
unit: 'V',
|
||||
date: '2023-12-01',
|
||||
},
|
||||
{
|
||||
key: '2',
|
||||
name: 'AC_003(照明电表)',
|
||||
position: 'A 相电压',
|
||||
unit: 'V',
|
||||
date: '2023-12-01',
|
||||
},
|
||||
{
|
||||
key: '2',
|
||||
name: 'AC_003(照明电表)',
|
||||
position: 'A 相电压',
|
||||
unit: 'V',
|
||||
date: '2023-12-01',
|
||||
},
|
||||
{
|
||||
key: '3',
|
||||
name: 'AC_004(给排水电表)',
|
||||
position: 'A 相电压',
|
||||
unit: 'V',
|
||||
date: '2023-12-01',
|
||||
},
|
||||
];
|
||||
pageData.analysisGraphList = [
|
||||
{
|
||||
name: 'AC_002(暖通电表)',
|
||||
value: -21,
|
||||
ringValue: 21,
|
||||
const date = dateValue.value;
|
||||
let year = 0;
|
||||
let month = 0;
|
||||
if (date) {
|
||||
year = date.year();
|
||||
month = date.month() + 1;
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
|
||||
// 图表数据
|
||||
http
|
||||
.post(energyMonitor.getDeviceOrNodeEnergyGraph, {
|
||||
deviceName: deviceName.value,
|
||||
energyType: selectedValue.value,
|
||||
energyUnit: 'kWh',
|
||||
unit: 'V',
|
||||
labelRight: {
|
||||
position: 'right',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'AC_003(照明电表)',
|
||||
value: 36,
|
||||
ringValue: 36,
|
||||
orgId: orgId.value,
|
||||
|
||||
dateType: dateTypeValue.value == 'year' ? 0 : 1, //0 年 1月
|
||||
deviceInfoCodes: mode.value == '0' ? checkedKeys.value : [], // 设备需要传 device_info_code
|
||||
energyQueryType: mode.value, // 0 设备 1 节点
|
||||
month: month,
|
||||
nodeIds: mode.value == '1' ? checkedKeys.value : [],
|
||||
year: year,
|
||||
})
|
||||
.then((res) => {
|
||||
let selectedValueName = '';
|
||||
options1.value?.forEach((item) => {
|
||||
if (item.value == selectedValue.value) {
|
||||
selectedValueName = item.label;
|
||||
}
|
||||
});
|
||||
res.data.tableList.forEach((item) => {
|
||||
item.selectedValueName = selectedValueName;
|
||||
});
|
||||
pageData.graphTableList = res.data.tableList;
|
||||
pageData.graphTableColumns = res.data.tableHeaderList;
|
||||
pageData.graphGraphList = res.data.graghData;
|
||||
});
|
||||
|
||||
// 分析数据
|
||||
http
|
||||
.post(energyMonitor.getDeviceOrNodeEnergyAnalyse, {
|
||||
deviceName: deviceName.value,
|
||||
energyType: selectedValue.value,
|
||||
unit: 'V',
|
||||
labelRight: {
|
||||
position: 'insideLeft',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'AC_004(给排水电表)',
|
||||
value: -5,
|
||||
ringValue: 5,
|
||||
energyType: selectedValue.value,
|
||||
unit: 'V',
|
||||
labelRight: {
|
||||
position: 'right',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'AC_005(给排水电表)',
|
||||
value: -25,
|
||||
ringValue: 15,
|
||||
energyType: selectedValue.value,
|
||||
unit: 'V',
|
||||
labelRight: {
|
||||
position: 'right',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'AC_006(给排水电表)',
|
||||
value: 35,
|
||||
ringValue: 30,
|
||||
energyType: selectedValue.value,
|
||||
unit: 'V',
|
||||
labelRight: {
|
||||
position: 'insideLeft',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'AC_007(给排水电表)',
|
||||
value: 15,
|
||||
ringValue: 18,
|
||||
energyType: selectedValue.value,
|
||||
unit: 'V',
|
||||
labelRight: {
|
||||
position: 'insideLeft',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'AC_008(给排水电表)',
|
||||
value: -25,
|
||||
ringValue: 41,
|
||||
energyType: selectedValue.value,
|
||||
unit: 'V',
|
||||
labelRight: {
|
||||
position: 'right',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'AC_009(给排水电表)',
|
||||
value: -5,
|
||||
ringValue: 55,
|
||||
energyType: selectedValue.value,
|
||||
unit: 'V',
|
||||
labelRight: {
|
||||
position: 'right',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'AC_0090(给排水电表)',
|
||||
value: -5,
|
||||
ringValue: 55,
|
||||
energyType: selectedValue.value,
|
||||
unit: 'V',
|
||||
labelRight: {
|
||||
position: 'right',
|
||||
},
|
||||
},
|
||||
];
|
||||
};
|
||||
const getSelect11 = () => {
|
||||
pageData.graphTableList = [
|
||||
{
|
||||
key: '1',
|
||||
name: 'AC_002(暖通电表)',
|
||||
paramName: '用电量(kWh)',
|
||||
date: '2023-12-01',
|
||||
'1:00': '3626',
|
||||
'2:00': '3626',
|
||||
},
|
||||
{
|
||||
key: '1',
|
||||
name: 'AC_002(暖通电表)',
|
||||
paramName: '用电量(kWh)',
|
||||
date: '2023-12-01',
|
||||
'1:00': '3626',
|
||||
'2:00': '3626',
|
||||
},
|
||||
{
|
||||
key: '2',
|
||||
name: 'AC_003(照明电表)',
|
||||
paramName: '用电量(kWh)',
|
||||
date: '2023-12-01',
|
||||
'1:00': '3626',
|
||||
'2:00': '3626',
|
||||
},
|
||||
{
|
||||
key: '2',
|
||||
name: 'AC_003(照明电表)',
|
||||
paramName: '用电量(kWh)',
|
||||
date: '2023-12-01',
|
||||
'1:00': '3626',
|
||||
'2:00': '3626',
|
||||
},
|
||||
{
|
||||
key: '3',
|
||||
name: 'AC_004(给排水电表)',
|
||||
paramName: '用电量(kWh)',
|
||||
date: '2023-12-01',
|
||||
'1:00': '3626',
|
||||
'2:00': '3626',
|
||||
},
|
||||
];
|
||||
pageData.graphTableColumns = [
|
||||
{
|
||||
title: '日期',
|
||||
dataIndex: 'date',
|
||||
},
|
||||
{
|
||||
title: '1:00',
|
||||
dataIndex: '1:00',
|
||||
},
|
||||
{
|
||||
title: '2:00',
|
||||
dataIndex: '2:00',
|
||||
},
|
||||
];
|
||||
pageData.graphGraphList = [
|
||||
{
|
||||
date: '2023-12-01 0:00',
|
||||
unit: 'V',
|
||||
data: [
|
||||
{
|
||||
name: 'AC_002(暖通电表)',
|
||||
value: '21',
|
||||
},
|
||||
{
|
||||
name: 'AC_003(照明电表)',
|
||||
value: '36',
|
||||
},
|
||||
{
|
||||
name: 'AC_004(给排水电表)',
|
||||
value: '5',
|
||||
},
|
||||
{
|
||||
name: 'AC_005(333333333)',
|
||||
value: '22',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
date: '2023-12-02 0:00',
|
||||
unit: 'V',
|
||||
data: [
|
||||
{
|
||||
name: 'AC_002(暖通电表)',
|
||||
value: '26',
|
||||
},
|
||||
{
|
||||
name: 'AC_003(照明电表)',
|
||||
value: '25',
|
||||
},
|
||||
{
|
||||
name: 'AC_004(给排水电表)',
|
||||
value: '47',
|
||||
},
|
||||
{
|
||||
name: 'AC_005(333333333)',
|
||||
value: '28',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
date: '2023-12-03 0:00',
|
||||
unit: 'V',
|
||||
data: [
|
||||
{
|
||||
name: 'AC_002(暖通电表)',
|
||||
value: '18',
|
||||
},
|
||||
{
|
||||
name: 'AC_003(照明电表)',
|
||||
value: '22',
|
||||
},
|
||||
{
|
||||
name: 'AC_004(给排水电表)',
|
||||
value: '26',
|
||||
},
|
||||
{
|
||||
name: 'AC_005(333333333)',
|
||||
value: '44',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
date: '2023-12-04 0:00',
|
||||
unit: 'V',
|
||||
data: [
|
||||
{
|
||||
name: 'AC_002(暖通电表)',
|
||||
value: '40',
|
||||
},
|
||||
{
|
||||
name: 'AC_003(照明电表)',
|
||||
value: '15',
|
||||
},
|
||||
{
|
||||
name: 'AC_004(给排水电表)',
|
||||
value: '12',
|
||||
},
|
||||
{
|
||||
name: 'AC_005(333333333)',
|
||||
value: '26',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
date: '2023-12-05 0:00',
|
||||
unit: 'V',
|
||||
data: [
|
||||
{
|
||||
name: 'AC_002(暖通电表)',
|
||||
value: '15',
|
||||
},
|
||||
{
|
||||
name: 'AC_003(照明电表)',
|
||||
value: '18',
|
||||
},
|
||||
{
|
||||
name: 'AC_004(给排水电表)',
|
||||
value: '15',
|
||||
},
|
||||
{
|
||||
name: 'AC_005(333333333)',
|
||||
value: '35',
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
orgId: orgId.value,
|
||||
|
||||
dateType: dateTypeValue.value == 'year' ? 0 : 1, //0 年 1月
|
||||
deviceInfoCodes: mode.value == '0' ? checkedKeys.value : [], // 设备需要传 device_info_code
|
||||
energyQueryType: mode.value, // 0 设备 1 节点
|
||||
month: month,
|
||||
nodeIds: mode.value == '1' ? checkedKeys.value : [],
|
||||
year: year,
|
||||
})
|
||||
.then((res) => {
|
||||
pageData.analysisTableList = res.data.dataList;
|
||||
pageData.analysisGraphList = res.data.dataList;
|
||||
});
|
||||
};
|
||||
|
||||
const orgId = ref('');
|
||||
@@ -604,27 +226,29 @@
|
||||
// 切换树结构
|
||||
const changeMode = () => {
|
||||
treeLoading.value = true;
|
||||
if (mode.value == '1') {
|
||||
if (mode.value == '0') {
|
||||
http
|
||||
.post(device.queryDevicePage, {
|
||||
.post(group.queryDeviceToEnergy, {
|
||||
deviceName: deviceName.value,
|
||||
energyType: selectedValue.value,
|
||||
orgId: orgId.value,
|
||||
pageNum: 1,
|
||||
pageSize: 9999,
|
||||
// pageNum: 1,
|
||||
// pageSize: 9999,
|
||||
})
|
||||
.then((res) => {
|
||||
let val = '999999999';
|
||||
|
||||
let label = '所有设备';
|
||||
|
||||
let records = res.data.records;
|
||||
let records = res.data;
|
||||
records.forEach((item: any) => {
|
||||
(item.title = item.deviceModel + ' ' + item.deviceName), (item.key = item.id);
|
||||
(item.title = item.deviceNum), (item.key = item.deviceCode);
|
||||
});
|
||||
let a: TreeSelectProps['treeData'] = [{ title: label, key: val, children: records }];
|
||||
treeData2.value = a;
|
||||
expandedKeys.value = [val];
|
||||
checkedKeys.value.push(records[0].deviceCode, records[1].deviceCode);
|
||||
getSelect();
|
||||
})
|
||||
.finally(() => {
|
||||
treeLoading.value = false;
|
||||
@@ -687,16 +311,18 @@
|
||||
}
|
||||
};
|
||||
|
||||
// const onChange = (val: RangeValue) => {
|
||||
// dateRange.value = val;
|
||||
// };
|
||||
|
||||
const onCalendarChange = (val: RangeValue) => {
|
||||
dates.value = val;
|
||||
};
|
||||
onMounted(() => {
|
||||
getOptionsList();
|
||||
changeMode();
|
||||
// debugger;
|
||||
// await checkedKeys.value.push(
|
||||
// treeData2.value[0].children[0].deviceCode,
|
||||
// treeData2.value[0].children[1].deviceCode,
|
||||
// );
|
||||
// debugger;
|
||||
getSelect();
|
||||
});
|
||||
|
||||
@@ -716,12 +342,10 @@
|
||||
dateValue,
|
||||
getOptionsList,
|
||||
getSelect,
|
||||
getSelect11,
|
||||
changeMode,
|
||||
disabledDate,
|
||||
onCalendarChange,
|
||||
onOpenChange,
|
||||
// onChange,
|
||||
hackValue,
|
||||
treeLoading,
|
||||
changeEnergyType,
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
<template>
|
||||
<a-tabs v-model:activeKey="activeKey" style="height: 5%">
|
||||
<a-tab-pane key="1" tab="综合数据" />
|
||||
<a-tab-pane key="2" tab="历史数据" force-render>Content of Tab Pane 2</a-tab-pane>
|
||||
<a-tab-pane key="3" tab="平均数据">Content of Tab Pane 3</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="历史数据" force-render />
|
||||
<a-tab-pane key="3" tab="平均数据" />
|
||||
</a-tabs>
|
||||
|
||||
<aggregate-data ref="aggregateDataRef" v-if="activeKey == '1'" style="height: 85%" />
|
||||
|
||||
@@ -128,7 +128,7 @@
|
||||
formLayout="vertical"
|
||||
class="form" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane :key="2" tab="角色权限">
|
||||
<a-tab-pane :key="2" tab="角色权限" :disabled="!selectRoleRef">
|
||||
<a-tree
|
||||
v-if="rolePermissionTreeData?.length"
|
||||
:tree-data="rolePermissionTreeData"
|
||||
@@ -501,12 +501,11 @@
|
||||
roleFormData.value = {};
|
||||
opMap.type = '';
|
||||
opMap.fuc = '';
|
||||
selectRoleRef.value = '';
|
||||
roleDisabled.value = true;
|
||||
};
|
||||
|
||||
// 部门权限选择
|
||||
const deptCheck = (checked, { halfCheckedKeys }) => {
|
||||
const deptCheck = (checked: any, { halfCheckedKeys }: any) => {
|
||||
console.log(checked, halfCheckedKeys);
|
||||
|
||||
const result = checked.map((item) => {
|
||||
@@ -626,11 +625,13 @@
|
||||
|
||||
// 部门切换需要调整角色tab
|
||||
roleActiveKey.value = 1;
|
||||
|
||||
const { selected } = info;
|
||||
if (!selectedKeys?.length) return;
|
||||
// 需要重置数据
|
||||
clearDeptData();
|
||||
clearRoleData();
|
||||
const { selected } = info;
|
||||
if (!selectedKeys?.length) return;
|
||||
selectRoleRef.value = '';
|
||||
|
||||
deptTreeSelectedKeys.value = [info.node.key];
|
||||
selectRef.value = info.node.dataRef;
|
||||
@@ -679,8 +680,9 @@
|
||||
const { selected } = info;
|
||||
// roleDisabled.value = !selected;
|
||||
// 重置原操作逻辑
|
||||
clearRoleData();
|
||||
if (!selectedKeys?.length) return;
|
||||
clearRoleData();
|
||||
|
||||
roleTreeSelectedKeys.value = [info.node.key];
|
||||
selectRoleRef.value = info.node.dataRef;
|
||||
formRoleRef.value?.reset();
|
||||
@@ -745,7 +747,7 @@
|
||||
opMap.fuc(roleFormData.value).then(() => {
|
||||
getUserTree();
|
||||
opMap.type !== 'editRole' && clearRoleData();
|
||||
roleDisabled.value = !roleDisabled.value;
|
||||
roleDisabled.value = true;
|
||||
NsMessage.success('操作成功');
|
||||
});
|
||||
}
|
||||
|
||||
@@ -22,159 +22,150 @@
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<!-- <style lang="less" scoped>
|
||||
:deep(.ns-content) {
|
||||
// padding-top: 80px !important;
|
||||
}
|
||||
#app {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
min-width: 1000px;
|
||||
}
|
||||
|
||||
:deep(.ns-left-menu .firstMenuItem-selected .ant-menu-title-content) {
|
||||
background: unset !important;
|
||||
}
|
||||
:deep(.ns-left-menu) {
|
||||
.ant-menu-item-active,
|
||||
.ant-submenu-item-active {
|
||||
background: #ecf3ff !important;
|
||||
<style lang="less" scoped>
|
||||
:deep(.ns-content-main) {
|
||||
.ant-tabs-content {
|
||||
height: 100%;
|
||||
}
|
||||
.ant-menu-item-selected .ant-menu-title-content {
|
||||
// color: #fff !important;
|
||||
background: @primary-color;
|
||||
border-radius: 12px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
a {
|
||||
color: @white !important;
|
||||
}
|
||||
// 树组件
|
||||
: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 {
|
||||
text-align: left;
|
||||
margin-left: 0;
|
||||
.ant-btn {
|
||||
margin: 0;
|
||||
margin-right: 6px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.ns-form-body {
|
||||
max-width: 1000px;
|
||||
}
|
||||
}
|
||||
|
||||
// 区域阴影
|
||||
// .ns-list-table {
|
||||
|
||||
:deep(.ant-tabs) {
|
||||
// // overflow: visible;
|
||||
// box-shadow: @ns-content-box-shadow;
|
||||
// border-radius: @ns-border-radius;
|
||||
.ns-table-search {
|
||||
border-top-left-radius: 0px !important;
|
||||
border-top-right-radius: 0px !important;
|
||||
}
|
||||
.ns-table-main {
|
||||
border-bottom-left-radius: 0px !important;
|
||||
border-bottom-right-radius: 0px !important;
|
||||
}
|
||||
// .ant-tabs-tabpane-active > div {
|
||||
// height: 100%;
|
||||
// }
|
||||
}
|
||||
// .ant-tabs .ns-table-main {
|
||||
// border-bottom-left-radius: 0px !important;
|
||||
// border-bottom-right-radius: 0px !important;
|
||||
// }
|
||||
// }
|
||||
|
||||
// 菜单icon(仅仅处理特殊需求:未选中时icon与文字不同色)
|
||||
:deep(.anticon) {
|
||||
color: #8d96a3 !important;
|
||||
}
|
||||
|
||||
:deep(.ant-menu-item-selected .ant-menu-item-only-child),
|
||||
:deep(.ant-menu-submenu-selected .ant-menu-item-only-child),
|
||||
:deep(.firstMenuItem-selected) {
|
||||
.router-link-active > .anticon {
|
||||
color: @white !important;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.ant-menu-item-active) {
|
||||
.anticon {
|
||||
color: @primary-color !important;
|
||||
}
|
||||
}
|
||||
:deep(.ant-menu-submenu-active),
|
||||
:deep(.ant-menu-submenu-open),
|
||||
:deep(.ant-menu-item-selected) {
|
||||
.ant-menu-submenu-title {
|
||||
.anticon {
|
||||
color: @primary-color !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.ant-menu-light.ant-menu-horizontal > .ant-menu-item:hover) {
|
||||
background: @primary-color;
|
||||
}
|
||||
// :deep(.ant-menu-inline .ant-menu-submenu-title) {
|
||||
// color: rgba(255, 255, 255, 0.9) !important;
|
||||
// }
|
||||
:deep(.ns-left-menu .ant-layout-sider-children .ant-menu-sub.ant-menu-inline) {
|
||||
// position: relative;
|
||||
// &::before {
|
||||
// display: flex;
|
||||
// width: 2px;
|
||||
// height: calc(100% - 40px);
|
||||
// position: absolute;
|
||||
// top: 20px;
|
||||
// left: 20px;
|
||||
@min-padding: 5px;
|
||||
:deep(.ns-left-menu-space):not(.ns-left-menu-space-collapsed) {
|
||||
.firstMenuItem-selected {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
.ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected {
|
||||
background-color: transparent;
|
||||
&::before {
|
||||
background-color: @primary-color;
|
||||
opacity: 1;
|
||||
height: calc(100% - @min-padding*2);
|
||||
top: @min-padding;
|
||||
border-radius: @ns-border-radius;
|
||||
}
|
||||
}
|
||||
.ant-menu-item-active:not(.ant-menu-item-selected) {
|
||||
background-color: transparent !important;
|
||||
position: relative;
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
background-color: rgb(@primary-color, 0.1);
|
||||
height: calc(100% - @min-padding*2);
|
||||
top: @min-padding;
|
||||
left: 0;
|
||||
border-radius: @ns-border-radius;
|
||||
z-index: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// .ant-menu-inline .ant-menu-item-selected::after {
|
||||
// content: '';
|
||||
// background-color: rgba(255, 255, 255, 0.2);
|
||||
// position: absolute;
|
||||
// top: 50%;
|
||||
// right: -20px;
|
||||
// transform: translateY(-50%);
|
||||
// width: 3px !important;
|
||||
// border-radius: 2px;
|
||||
// background-color: red;
|
||||
// height: 30px;
|
||||
// z-index: 2;
|
||||
// border: none;
|
||||
// }
|
||||
|
||||
.ant-menu-title-content {
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
|
||||
//*************************含tab的 list列表样式 */
|
||||
:deep(.tabListTable) {
|
||||
.ns-table-title {
|
||||
text-align: left;
|
||||
height: 46px;
|
||||
line-height: 46px;
|
||||
:deep(.nsHeader_action) {
|
||||
.action {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
user-select: text;
|
||||
padding-left: 16px;
|
||||
background: #fff;
|
||||
width: calc(100% + 32px);
|
||||
margin-left: -16px;
|
||||
}
|
||||
.tabs-list {
|
||||
overflow: visible !important;
|
||||
}
|
||||
.ant-tabs-nav {
|
||||
width: calc(100% + 32px);
|
||||
margin-left: -16px !important;
|
||||
background: #fff;
|
||||
}
|
||||
.ant-tabs-nav-wrap {
|
||||
padding: 0 16px;
|
||||
letter-spacing: 0px;
|
||||
line-height: 24px;
|
||||
color: rgba(51, 51, 51, 1);
|
||||
}
|
||||
}
|
||||
|
||||
//*********************详情页返回修改 */
|
||||
:deep(.nsDetailView) {
|
||||
min-height: 100%;
|
||||
height: 100%;
|
||||
.ns-detail-content {
|
||||
padding: 0px 24px;
|
||||
border-top: 16px solid #e5ebf0;
|
||||
}
|
||||
.ant-descriptions-item-label {
|
||||
color: rgba(0, 0, 0, 0.5);
|
||||
font-family: PingFang SC;
|
||||
font-size: 14px;
|
||||
}
|
||||
.ant-descriptions-item-content {
|
||||
color: rgba(0, 0, 0, 0.95);
|
||||
font-family: PingFang SC;
|
||||
font-size: 14px;
|
||||
}
|
||||
.ant-descriptions-title {
|
||||
&::after {
|
||||
content: '';
|
||||
width: 75px;
|
||||
height: 7px;
|
||||
display: block;
|
||||
background: linear-gradient(90deg, #537fff 0%, #fff 82.67%);
|
||||
margin-left: 2px;
|
||||
margin-top: -2px;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-descriptions-row > th,
|
||||
.ant-descriptions-row > td {
|
||||
padding-bottom: 8px;
|
||||
}
|
||||
.ns-page-header {
|
||||
margin-bottom: 0 !important;
|
||||
padding-top: 7px !important;
|
||||
padding-bottom: 7px !important;
|
||||
width: calc(100% + 32px);
|
||||
margin-left: -16px;
|
||||
.title {
|
||||
cursor: pointer;
|
||||
font-size: 18px !important;
|
||||
}
|
||||
}
|
||||
.ant-descriptions-header {
|
||||
margin: 16px 0 16px 0 !important;
|
||||
|
||||
.ant-descriptions-title {
|
||||
line-height: 16px;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.ns-detail .ant-descriptions-header .descriptions-title) {
|
||||
&:after {
|
||||
content: '';
|
||||
width: 75px;
|
||||
height: 7px;
|
||||
display: block;
|
||||
background: linear-gradient(90deg, @primary-color 0%, #fff 82.67%);
|
||||
margin-left: 2px;
|
||||
margin-top: -2px;
|
||||
}
|
||||
}
|
||||
:deep(.ant-descriptions-header .descriptions-title) {
|
||||
&:after {
|
||||
content: '';
|
||||
width: 75px;
|
||||
height: 7px;
|
||||
display: block;
|
||||
background: linear-gradient(90deg, @primary-color 0%, #fff 82.67%);
|
||||
margin-left: 2px;
|
||||
margin-top: -2px;
|
||||
}
|
||||
}
|
||||
</style> -->
|
||||
</style>
|
||||
|
||||
@@ -3,8 +3,8 @@
|
||||
<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>
|
||||
<!-- <ns-icon :name="header.icon" size="14" /> -->
|
||||
<span class="ns-title-extra-box">{{ header.title }}</span>
|
||||
</div>
|
||||
<div v-if="!formConfig?.schema">
|
||||
<ns-form ref="formElRef" v-bind="formConfig" :model="formModel" @finish="formFinish" />
|
||||
@@ -155,9 +155,9 @@
|
||||
// padding-bottom: 10px;
|
||||
// border-bottom: 1px solid #e9e9e9;
|
||||
|
||||
> span {
|
||||
padding-left: 6px;
|
||||
}
|
||||
// > span {
|
||||
// padding-left: 6px;
|
||||
// }
|
||||
& ~ div {
|
||||
padding: 0 @gap !important;
|
||||
width: 100%;
|
||||
|
||||
@@ -93,7 +93,7 @@
|
||||
"
|
||||
>{{ userName }}</span
|
||||
>
|
||||
<ns-icon class="downArrow" name="downArrow" size="20" />
|
||||
<!-- <ns-icon class="downArrow" name="downArrow" size="20" /> -->
|
||||
</div>
|
||||
|
||||
<template #overlay>
|
||||
@@ -536,9 +536,9 @@
|
||||
.action {
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background-color: @layout-header-hover;
|
||||
}
|
||||
// &:hover {
|
||||
// background-color: @layout-header-hover;
|
||||
// }
|
||||
}
|
||||
|
||||
.projectName {
|
||||
|
||||