This commit is contained in:
zhaohy
2024-07-24 15:13:56 +08:00
36 changed files with 1096 additions and 1082 deletions

View File

@@ -42,4 +42,13 @@ 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',
}

View File

@@ -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`, // 能耗监测用查询设备(能耗监测设备树)
}

View File

@@ -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 {}

View File

@@ -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;

View File

@@ -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' },
],
},
},
],

View File

@@ -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
},
},
],

View File

@@ -50,7 +50,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>
@@ -67,7 +67,13 @@
</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">
@@ -406,10 +412,11 @@
editTreeNode.value.type = 'create'
};
// 编辑树节点
const editTreeNodeData = () => {
const editTreeNodeData = (data) => {
operationTree.value='编辑'
treeNodeAdd.value = true;
editTreeNode.value.type = 'update'
addTreeNode.value = data.emissionName
}
// 删除树节点
const deleteTreeNode = () => {
@@ -562,7 +569,6 @@
});
opMap.value.fuc = (formData: any) => {
formData.emissionType = formData.emissionType[formData.emissionType.length - 1]
debugger
return http.post(carbonEmissionFactorLibrary.creatOrUpdate, formData).then(() => {
mainRef.value?.nsTableRef.reload();
visible.value = false;
@@ -602,7 +608,7 @@
name: 'userAdd',
handle: () => {
unitManagement.value = true,
fetch(carbonEmissionFactorLibrary.findOutermost).then((res) => {
fetch(carbonEmissionFactorLibrary.findOutermost,{grp:'MEASUREMENT_UNIT'}).then((res) => {
groupData.value = res.data
});
getUnitTree()
@@ -682,6 +688,9 @@
opMap.value.type = 'edit';
opMap.value.fuc = (formData: any) => {
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 +748,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,
},
],
},

View File

@@ -5,7 +5,7 @@
: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" />
</template>
@@ -164,11 +164,11 @@
// 获取表格数据
const getTableList = () => {
fetch(carbonEmission.carbonEmissionStatistics , queryParams.value).then((res) => {
data.value = res.data.records
total.value = res.data.total
data.value = res.data
total.value = res.data.length
});
};
getTableList()
getTableList()
// 分页器
const onChange = (pageNumber: number,size: number) => {
queryParams.value.pageNum = pageNumber;

View File

@@ -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"
@@ -220,7 +232,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 +376,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 +454,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 +504,6 @@
label: child.cnValue
})) : []
}));
debugger
});
// 获取自动采集节点的数据
fetch(group.queryDeviceGroupTree, { energyType: 'ELECTRICITY_USAGE',orgId: orgId.value }).then((res) => {

View File

@@ -19,21 +19,25 @@
</div>
</a-form>
<a-tree
:expanded-keys="expandedKeys"
:expanded-keys="expandedKeysL"
:selectedKeys="selectedKeysL"
:auto-expand-parent="autoExpandParent"
:tree-data="gData"
v-if="gData && gData.length > 0"
:height="233"
show-line
style="padding: 0 16px !important;"
@expand="onExpand"
@expand="onExpandL"
@select="onSelectL"
block-node
>
<template #title="{ title }">
<span v-if="title.indexOf(searchValue) > -1">
{{ title.substring(0, title.indexOf(searchValue)) }}
<template #title="{ cnValue }">
<span v-if="cnValue && searchValue && cnValue.indexOf(searchValue) > -1">
{{ cnValue.substring(0, cnValue.indexOf(searchValue)) }}
<span style="color: #f50">{{ searchValue }}</span>
{{ title.substring(title.indexOf(searchValue) + searchValue.length) }}
{{ cnValue.substring(cnValue.indexOf(searchValue) + searchValue.length) }}
</span>
<span v-else>{{ title }}</span>
<span v-else>{{ cnValue }}</span>
</template>
</a-tree>
</div>
@@ -55,22 +59,21 @@
<div style="display: flex;" v-if="fillInPage">
<div class="mainLeft">
<a-tree
v-model:expandedKeys="expandedKeysR"
v-model:selectedKeys="selectedKeys"
v-model:checkedKeys="checkedKeys"
:expandedKeys="expandedKeysR"
:selectedKeys="selectedKeysR"
:checkedKeys="checkedKeys"
:tree-data="treeData"
@select="onSelectR"
block-node
>
<template #title="data">
<div class="treeRow">
<div>
<span>{{ data.title }}</span>
<span>{{ data.emissionSource }}</span>
</div>
<div class="actionMore">
<EditOutlined v-if="!data.parentId" @click="editGroup(data)" />
<EditOutlined v-else @click="editUnit(data)" />
<EditOutlined @click="editUnit(data)" />
<MinusCircleOutlined style="margin-left: 6px;" @click="delUnit(data)" />
<PlusCircleOutlined v-if="!data.parentId" style="margin-left: 6px;" @click="addUnit(data)" />
</div>
</div>
</template>
@@ -110,7 +113,7 @@
:scroll="{ x: 2000 }">
</a-table>
</div>
<div v-if="isClickedTplx">
<div v-if="isClickedTplx" style="width: 100%; height: 100%">
<div ref="tplxChart" style="width: 100%; height: 68vh"></div>
</div>
</div>
@@ -136,9 +139,11 @@
<a-tree
:expanded-keys="categoryExpandedKeys"
:selectedKeys="categorySelectedKeys"
:checkedKeys="categoryCheckedKeys"
:tree-data="categoryTreeData"
v-if="categoryTreeData && categoryTreeData.length > 0"
class="draggable-tree"
@check="checkTreeNode"
checkable
block-node>
<template #title="data">
@@ -152,7 +157,7 @@
</div>
<template #footer>
<a-button style="margin-right: 8px" @click="closeCategoryConfig">取消</a-button>
<a-button type="primary" @click="closeUnitManag">确定</a-button>
<a-button type="primary" @click="submitCategory">确定</a-button>
</template>
</a-drawer>
<!-- 新增/编辑排放源树节点 -->
@@ -170,41 +175,24 @@
:label-col="labelCol"
:wrapper-col="wrapperCol"
>
<a-form-item ref="name" label="排放源" name="energyType">
<a-form-item ref="name" label="排放源" name="emissionSource">
<a-input v-model:value="formState.emissionSource" placeholder="请输入排放源" />
</a-form-item>
<a-form-item ref="name" label="计量单位" name="unitId">
<a-cascader v-model:value="formState.unitId" :options="measurementUnit" />
</a-form-item>
<a-form-item ref="name" label="温室气体" name="greenhouseGases">
<a-select
ref="select"
v-model:value="formState.unit"
v-model:value="formState.greenhouseGases"
>
<a-select-option value="jack">Jack</a-select-option>
<a-select-option value="lucy">Lucy</a-select-option>
<a-select-option v-for="(item, index) in groupData" :key="index" :value="item.id">
{{ item.cnValue }}
</a-select-option>
</a-select>
</a-form-item>
<a-form-item ref="name" label="计量单位" name="energyType">
<a-select
ref="select"
v-model:value="formState.unit"
>
<a-select-option value="jack">Jack</a-select-option>
<a-select-option value="lucy">Lucy</a-select-option>
</a-select>
</a-form-item>
<a-form-item ref="name" label="温室气体" name="energyType">
<a-select
ref="select"
v-model:value="formState.unit"
>
<a-select-option value="jack">Jack</a-select-option>
<a-select-option value="lucy">Lucy</a-select-option>
</a-select>
</a-form-item>
<a-form-item ref="name" label="碳排单位" name="energyType">
<a-select
ref="select"
v-model:value="formState.unit"
>
<a-select-option value="jack">Jack</a-select-option>
<a-select-option value="lucy">Lucy</a-select-option>
</a-select>
<a-form-item ref="name" label="碳排单位" name="carbonEmissionUnits">
<a-cascader v-model:value="formState.carbonEmissionUnits" :options="CarbonUnit" />
</a-form-item>
<!-- <a-form-item label="排放类型" name="emissionType" :required="isRequired">
<a-select v-model:value="formState.emissionType" placeholder="请选择排放类型">
@@ -345,14 +333,14 @@
</template>
<script lang="ts" setup>
import { ref, watch } from 'vue';
import { ref, watch, toRaw } from 'vue';
import { http } from '/nerv-lib/util/http';
import { Pagination } from 'ant-design-vue';
import { Pagination, Modal, message } from 'ant-design-vue';
import type { TreeProps,TableColumnsType,UploadChangeParam } from 'ant-design-vue';
import { EditOutlined,PlusCircleOutlined,MinusCircleOutlined,UploadOutlined } from '@ant-design/icons-vue';
import * as echarts from 'echarts';
import { columns,voucherColumns,drawerColumns } from '../config';
import { energyConsumption,carbonEmissionFactorLibrary } from '/@/api/carbonEmissionFactorLibrary';
import { energyConsumption,carbonEmissionFactorLibrary,carbonInventoryCheck } from '/@/api/carbonEmissionFactorLibrary';
defineOptions({
energyType: 'fillInPage', // 与页面路由name一致缓存才可生效
components: {
@@ -362,7 +350,7 @@
const orgId = ref('');
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
orgId.value = result;
const fetch = (api, params = { orgId } ) => {
const fetch = (api, params = { orgId:orgId.value } ) => {
return http.post(api, params);
};
// 左侧树结构
@@ -424,13 +412,14 @@
}
return parentKey;
};
const expandedKeys = ref<(string | number)[]>([]);
const expandedKeysL = ref<(string | number)[]>([]);
const selectedKeysL = ref<string[]>(['0-0']);
const searchValue = ref<string>('');
const autoExpandParent = ref<boolean>(true);
const gData = ref<TreeProps['treeData']>(genData);
const onExpand = (keys: string[]) => {
expandedKeys.value = keys;
const onExpandL = (keys: string[]) => {
expandedKeysL.value = keys;
autoExpandParent.value = false;
};
@@ -443,10 +432,34 @@
return null;
})
.filter((item, i, self) => item && self.indexOf(item) === i);
expandedKeys.value = expanded;
expandedKeysL.value = expanded;
searchValue.value = value;
autoExpandParent.value = true;
});
// 被选中的树节点
const categoryId = ref()
const onSelectL = (selectedKey: string[], info: any) => {
selectedKeysL.value = selectedKey;
categoryId.value = info.node.id
formState.value.categoryId = categoryId.value
};
// 获取碳盘查报告树
const selectedIds = ref([]);
const getReportTree = () => {
fetch(carbonInventoryCheck.getCategoryTree).then((res) => {
gData.value = res.data
if(res.data.length > 0){
categoryId.value = res.data[0].id
formState.value.categoryId = categoryId.value
selectedIds.value = getAllIds(gData.value);
}
getEmissionSourceTree();
});
};
getReportTree();
const getAllIds = (nodes: TreeNode[]): number[] => {
return nodes.flatMap(node => [node.id, ...(node.children ? getAllIds(node.children) : [])]);
};
// 填报表格数据
const data = [...Array(12)].map((_, i) => ({
key: i,
@@ -460,36 +473,25 @@
gender: 'M',
}));
// 右侧树数据
const treeData: TreeProps['treeData'] = [
{
title: 'parent 1',
key: '0-0',
children: [
{
title: 'parent 1-0',
key: '0-0-0',
children: [
{ title: 'leaf', key: '0-0-0-0'},
{ title: 'leaf', key: '0-0-0-1' },
],
},
{
title: 'parent 1-1',
key: '0-0-1',
children: [{ key: '0-0-1-0', title: 'sss' }],
},
],
},
];
const expandedKeysR = ref<string[]>(['0-0-0', '0-0-1']);
const selectedKeys = ref<string[]>(['0-0-0', '0-0-1']);
const checkedKeys = ref<string[]>(['0-0-0', '0-0-1']);
const treeData = ref<TreeProps['treeData']>(genData);
// 获取数据
const getEmissionSourceTree = () => {
fetch(carbonInventoryCheck.getInventoryTree, { categoryId: categoryId.value }).then((res) => {
treeData.value = res.data
});
};
// 排放源树中被选中的树节点
const onSelectR = (selectedKey: string[], info: any) => {
selectedKeysR.value = selectedKey;
};
const expandedKeysR = ref<string[]>([]);
const selectedKeysR = ref<string[]>(['0-0']);
const checkedKeys = ref<string[]>([]);
watch(expandedKeysR, () => {
console.log('expandedKeysR', expandedKeysR);
});
watch(selectedKeys, () => {
console.log('selectedKeys', selectedKeys);
watch(selectedKeysR, () => {
console.log('selectedKeys', selectedKeysR);
});
watch(checkedKeys, () => {
console.log('checkedKeys', checkedKeys);
@@ -500,14 +502,44 @@
const categoryTreeData = ref<TreeProps['treeData']>(genData);
const categoryExpandedKeys = ref<string[]>();
const categorySelectedKeys = ref<string[]>([]);
const categoryCheckedKeys = ref<string[]>([]);
const checkTreeNode = (checkedKeys, info) => {
categoryCheckedKeys.value = checkedKeys
queryConfigure.value.dictionaryIdList = categoryCheckedKeys.value
}
const getUnitTree = () => {
fetch(carbonEmissionFactorLibrary.dictionaryUnitManagement).then((res) => {
fetch(carbonEmissionFactorLibrary.dictionaryUnitManagement,{grp:'CATEGORY_CONFIGURATION'}).then((res) => {
categoryTreeData.value = res.data
categoryCheckedKeys.value = selectedIds.value.map(id => String(id));
// 格式化树节点数据并设置 key
categoryTreeData.value = formatTreeData(categoryTreeData.value);
});
}
getUnitTree()
const formatTreeData = (treeData) => {
return treeData.map(node => {
const newNode = { ...node };
newNode.key = String(node.id); // 将 id 转换为字符串作为 key
if (node.children) {
newNode.children = formatTreeData(node.children);
}
return newNode;
});
};
const openCategoryConfig = () => {
categoryConfig.value = true;
getUnitTree()
};
// 类别配置树点击确定
const queryConfigure = ref({
orgId:orgId.value
})
const submitCategory = () => {
fetch(carbonInventoryCheck.updateCategoryTree,queryConfigure.value).then((res) => {
categoryConfig.value = false;
getReportTree();
});
};
const closeCategoryConfig = () => {
categoryConfig.value = false;
@@ -518,15 +550,138 @@
const labelCol = { span: 5 };
const wrapperCol = { span: 19 };
const formState = ref({
orgId: orgId.value,
orgId: orgId.value
})
// 计量单位的变量
const measurementUnit = ref([])
// 碳排单位变量
const CarbonUnit = ref([])
// 温室气体变量
const groupData = ref([])
// 定义form表单的必填
const rules: Record<string, Rule[]> = {
energyType: [{ required: true, message: '请输入能源种类', trigger: 'change' }],
isComputeCarbon: [{ required: true, message: '请选择是否计算碳排', trigger: 'change' }]
emissionSource: [{ required: true, message: '请输入排放源', trigger: 'change' }],
unitId: [{ required: true, message: '请选择计量单位', trigger: 'change' }],
greenhouseGases: [{ required: true, message: '请选择温室气体', trigger: 'change' }],
carbonEmissionUnits: [{ required: true, message: '请选择碳排单位', trigger: 'change' }],
};
const addTreeNodeData = () => {
addTreeNodeVisible.value = true;
getDictData()
};
// 获取字典值
const getDictData = () => {
// 获取计量单位的数据
fetch(carbonEmissionFactorLibrary.dictionaryUnitManagement, { grp: 'MEASUREMENT_UNIT'}).then((res) => {
measurementUnit.value = res.data
measurementUnit.value = measurementUnit.value.map(item => ({
value: item.id,
label: item.cnValue,
children: item.children ? item.children.map(child => ({
value: child.id,
label: child.cnValue
})) : []
}));
});
// 获取碳排单位的数据
fetch(carbonEmissionFactorLibrary.dictionaryUnitManagement, { grp: 'GREENHOUSE_GASES'}).then((res) => {
CarbonUnit.value = res.data
CarbonUnit.value = CarbonUnit.value.map(item => ({
value: item.id,
label: item.cnValue,
children: item.children ? item.children.map(child => ({
value: child.id,
label: child.cnValue
})) : []
}));
});
// 获取温室气体数据
fetch(carbonEmissionFactorLibrary.findOutermost,{grp:'GREENHOUSE_GASES'}).then((res) => {
groupData.value = res.data
});
};
const onSubmit = () => {
formRef.value
.validate()
.then(() => {
console.log('values', formState, toRaw(formState));
if(formState.value.unitId){
formState.value.unitId = formState.value.unitId.join(',').split(',')[1]
}
if(formState.value.carbonEmissionUnits){
formState.value.carbonEmissionUnits = formState.value.carbonEmissionUnits.join(',').split(',')[1]
}
if(formState.value.id){
fetch(carbonInventoryCheck.update , formState.value).then((res) => {
addTreeNodeVisible.value = false
formState.value = {
orgId: orgId.value,
}
message.success('操作成功!');
getEmissionSourceTree();
});
}else{
fetch(carbonInventoryCheck.create , formState.value).then((res) => {
addTreeNodeVisible.value = false
formState.value = {
orgId: orgId.value,
}
message.success('操作成功!');
getEmissionSourceTree();
});
}
})
.catch(error => {
console.log('error', error);
});
};
const editUnit = (data) => {
getDictData()
addTreeNodeVisible.value = true;
setTimeout(() => {
let selectDevice = ref([Number(data.unitId)]);
findParentIds(measurementUnit.value, data.unitId, selectDevice.value);
data.unitId = selectDevice
let selectDeviceC = ref([Number(data.carbonEmissionUnits)]);
findParentIds(CarbonUnit.value, data.carbonEmissionUnits, selectDeviceC.value);
data.carbonEmissionUnits = selectDeviceC
formState.value.id = data.id
formState.value = data
}, 500);
};
// 定义一个递归函数来查找每一级的id 设备类型回显 层级方法
function findParentIds(tree: any, targetId: number, result: any) {
for (let item of tree) {
if (item.children && item.children.length > 0) {
if (item.children.some((child: any) => child.value === targetId)) {
result.unshift(item.value); // 将当前节点的id添加到结果数组的最前面
findParentIds(tree, item.value, result); // 递归查找父级节点的id
break; // 找到后可以退出循环
}
}
}
}
// 删除排放源左侧树节点
const delUnit = (data) => {
Modal.confirm({
title: '警告',
content: '确定要删除吗?',
okText: '确定',
okType: 'primary',
cancelText: '取消',
onOk() {
fetch(carbonInventoryCheck.del , {id:data.id}).then((res) => {
message.success('操作成功!');
getEmissionSourceTree();
});
},
onCancel() {
console.log('Cancel');
},
});
};
const onClose = () => {
addTreeNodeVisible.value = false;
@@ -637,7 +792,9 @@
fillInPage.value = false
isClickedPftj.value = false
isClickedTplx.value = true
drawEcharts();
setTimeout(() => {
drawEcharts();
}, 500);
};
// 排放统计表头
const pftjColumn = [
@@ -939,8 +1096,8 @@
};
itemStyleColor.push(datalist[d]);
}
option = {
backgroundColor: "#031d7a",
const option = {
backgroundColor: "transparent",
tooltip: {
trigger: "item",
triggerOn: "mousemove",
@@ -1171,7 +1328,7 @@
height: 5vh;
display: flex;
align-items: center;
justify-content: space-evenly;
margin-left: 10%;
}
.treePart{
width: 70%;

View 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

View File

@@ -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

View File

@@ -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

View File

@@ -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

View File

@@ -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

View File

@@ -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

View File

@@ -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

View File

@@ -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

View File

@@ -0,0 +1,53 @@
<template>
<div class="map-box">
<div class="map">
<liftInfo></liftInfo>
</div>
</div>
</template>
<script setup lang="ts">
import { ref, onMounted } from 'vue';
import liftInfo from './liftInfo.vue'
// 请求
import { message } from 'ant-design-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>

View File

@@ -0,0 +1,151 @@
<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>

View File

@@ -50,6 +50,7 @@
<a-tabs v-model:activeKey="activeKey">
<a-tab-pane key="1" tab="控制面板">
<tabs1
ref="tabs1Ref"
@changeArea="changeArea"
@reset="reset"
:treeData="treeData"
@@ -89,33 +90,13 @@ import {
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()
})
// 分层业务 =====================================================
// 所有楼层的数据
const floorData = ref([])
// 左上角分层切换
const changeFloor = (area: any) => {
// 重置数据
@@ -130,8 +111,6 @@ const changeFloor = (area: any) => {
// 分区业务 =====================================================
// 所有楼层的数据
const floorData = ref([])
// 分区结构树
const treeData = ref([])
// 当前选中的分区id
@@ -203,6 +182,7 @@ const changeArea = (result: any) => {
}
// 由当前组件控制的分区切换
const changeThisArea = (result: any) => {
tabs1Ref.value.changeCancel()
console.log(result, 'changeThisArea')
// 修改前,将所有选项置空
reset()
@@ -224,9 +204,9 @@ const changeThisArea = (result: any) => {
}
// 重置分区树所有当前选项
const reset = () => {
treeData.value.forEach(item => {
treeData.value.forEach((item: any) => {
item.selected = false
item.childList.forEach(i => {
item.childList.forEach((i: any) => {
i.selected = false
})
})
@@ -240,6 +220,32 @@ const computedClass = (string: 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)
})
})
})
treeData.value = data[0].childList
})
}
// 抽屉业务 =====================================================
// 抽屉 - 当前选择的tab
@@ -250,6 +256,7 @@ let visible = ref(false);
const toggleDrawer = () => {
visible.value = !visible.value;
};
const tabs1Ref = ref()
</script>
<style lang="less" scoped>

View File

@@ -75,60 +75,34 @@
</div>
<!-- 控制模式部分 -->
<div>
<div class="control-area" v-show="showControlMode">
<div class="control-area" v-show="thisButton2.code">
<div class="control-tab"></div>
<span class="control-text"> 控制模式 </span>
</div>
<!-- 控制模式按钮部分 -->
<div class="control-mode-btn-area" v-show="showControlMode">
<div class="control-mode-btn-area" v-show="thisButton2.code">
<button v-for="(button3, index) in controlMode" :key="index"
class="btn"
:class="{ selected: thisButton.mode.value == button3.value }" @click="selectButton3(button3)">
:disabled="button3.value!= 3"
:class="{ selected: thisButton2.mode.value == button3.value }" @click="selectButton3(button3)">
{{ button3.label }}
</button>
</div>
</div>
<!-- 控制场景部分 -->
<div>
<div class="control-scene-area" v-show="showControlScene">
<div class="control-scene-area" v-show="thisButton2.mode.value == '3'">
<div class="control-scene-tab"></div>
<span class="control-scene-text"> 控制场景 </span>
</div>
<!-- 控制场景按钮部分 -->
<div class="control-scene-btn-area" v-show="showControlScene">
<button v-for="(button4, index) in controlSceneButtons" :key="index"
:class="{ btn: true, selected: button4.label === selectedButton4 }" @click="selectButton4(button4)">
<div class="control-scene-btn-area" v-show="thisButton2.mode.value == '3'">
<button v-for="(button4, index) in controlScene" :key="index"
:class="{ btn: true, selected: thisButton2.mode.value == button4.value }" @click="selectButton4(button4)">
{{ button4.label }}
</button>
</div>
</div>
<!-- 灯具参数部分表格 -->
<div>
<div class="light-parameters-area" v-if="selectedButton4">
<div class="light-parameters-tab"></div>
<span class="light-parameters-text"> 灯具参数 </span>
</div>
<div class="light-parameters-textarea" v-if="selectedButton4">
<table class="custom-table table1">
<thead>
<tr :style="{ background: 'rgba(35,45,69)' }">
<th>开启数量</th>
<th>亮度(lux)</th>
<th>色温</th>
</tr>
</thead>
<tbody>
<tr v-for="(row, index) in lightSource" :key="index" @click="handleRowClick(row.num)"
:style="{ height: '50px' }">
<td>{{ row.num }}</td>
<td>{{ row.light }}</td>
<td>{{ row.temperature }}</td>
</tr>
</tbody>
</table>
<div style="margin-bottom: 60px;"></div>
</div>
</div>
<!-- 底部按钮区 -->
<div class="bottom">
<a-popconfirm
@@ -228,13 +202,22 @@ import { getAllEnum } from '/@/api/index'
onMounted(() => {
// 设置分区
setArea()
setArea(0)
// 获得枚举
getEnum(['IlluminationMode', 'IlluminationScene'])
})
// 获得枚举,初始化
const getEnum = (arr: any) => {
getAllEnum({ params: arr }).then(res => {
const data = res.data
controlMode.value = data.IlluminationMode
controlScene.value = data.IlluminationScene
})
}
// 父组件点击俯视图切换分区时,子组件切换线路
const setArea = () => {
const data = props.treeData.find(item => {
const setArea = (isHandle: number) => {
const data = props.treeData.find((item: any) => {
return item.id == props.nowArea
})
// 默认选中第一个分区
@@ -243,6 +226,22 @@ const setArea = () => {
selectedButton.value = props.nowArea
// 设置当前显示的回路
buttons2.value = data.childList
// 如果非初始化触发(点击俯视图)
if (isHandle) {
// 如果选中了线路则children中的某个selected为true
const button2 = data.childList.find((item: any) => {
return item.selected == true
})
// 如果选中了线路
if (button2) {
thisButton2.value = button2;
console.log(button2,'2222222222')
} else {
resetMode()
}
}
}
// 与父组件的交互 ===================================================================
@@ -266,7 +265,7 @@ const props = defineProps({
const emit = defineEmits(['changeArea','reset']);
// 监听父组件选中的分区,并实时修改分区
watch(() => props.nowArea, () => {
setArea()
setArea(1)
// 分区产生了切换, 线路的选中状态置空
handleButton.value = ''
})
@@ -283,16 +282,16 @@ const togglePlan = () => {
// 按钮区展开与收起状态
const showAllButtonsArea = ref(false);
// 被选中的分区 默认为1
const selectedButton = ref('1');
const selectedButton = ref<string | undefined>('1');
// 区域切换(按钮点击-单选)事件
const selectButton = (button: any) => {
console.log(button,'button')
// 当前选中按钮
selectedButton.value = button.id;
initMenu(1)
button.selected = true
buttons2.value = button.childList
emit('changeArea', button.id);
resetMode()
handleButton.value = ''
};
// 默认最多展示8个按钮
@@ -312,11 +311,12 @@ const togglePlan2 = () => {
return message.info('请选择照明回路');
}
// 获取最近交互过的按钮
const btn = buttons2.value.find((button) => button.id === handleButton.value)
const btn: any = buttons2.value.find((button) => button.id === handleButton.value)
let panel = +(!btn.ctrlStatus)
isLoading.value = true
http.get(lightingManage.setDisable, { deviceGroup: btn.code, panel }).then(res => {
if (res.msg === 'success') {
// 确认成功后 - 按钮文本取反 - 按钮布尔值修改 - 关闭loading
isPlanEnabled2.value = !isPlanEnabled2.value;
btn.ctrlStatus = panel
isLoading.value = false
@@ -335,8 +335,7 @@ const selectAll = () => {
button.selected = false;
});
singleSelection.value = !singleSelection.value;
// 线路按钮被重置,
showControlMode.value = false
resetMode()
emit('changeArea', [selectedButton.value])
};
@@ -351,12 +350,11 @@ const toggleAllSelection = () => {
item.selected = true;
arr.push(item.id)
});
// 全不选
// 全不选
} else {
buttons2.value.forEach((item) => {
item.selected = false;
});
showControlMode.value = false
}
emit('changeArea', arr)
};
@@ -396,23 +394,12 @@ const toggleSelection = (button: any) => {
// 用于展示控制模式
if (button.selected) {
// 发生了选中事件
showControlMode.value = true
thisButton.value = button
if (button.type == 3) {
showControlScene.value = true
} else {
showControlScene.value = false
}
thisButton2.value = button
} else {
// 未发生选中 或 多选被取消
showControlMode.value = false
thisButton.value = {
mode: {
value: '0'
}
}
resetMode()
}
console.log(thisButton,'button')
console.log(thisButton2,'button')
};
// 照明回路所有按钮
@@ -424,42 +411,34 @@ const limitedButtons2 = computed(() => buttons2.value.slice(0, 8));
// 控制模式业务 ====================================================================
// 决定该区域是否显示
const showControlMode = ref(false);
const thisButton = ref({
const thisButton2 = ref({
code: '',
mode: {
value: '0'
}
})
// 控制模式 - 按钮切换
const selectButton3 = (button3) => {
let checked = thisButton.value.mode.value
console.log(button3.value,'---', checked)
let checked = thisButton2.value.mode
console.log(button3.value,'---', checked.value)
// 如果点击了相同的按钮,未作出修改
if (checked === button3.value) {
if (checked.value === button3.value) {
return
}
checked = button3.value
// 如果当前选项是手动模式
showControlScene.value = button3.label === '手动模式';
checked.value = button3.value
selectedButton4.value = null; // 清空选中的控制场景按钮
};
const diff = () => {
console.log(thisButton2)
}
// 控制场景业务 =====================================================================
// 控制模式枚举
const controlMode = ref([])
// 场景枚举
const controlScene = ref([])
// 决定该区域是否显示
const showControlScene = ref(false);
// 控制场景 - 所有按钮
const controlSceneButtons = ref([
{ label: '检修', selected: false },
{ label: '午休', selected: false },
{ label: '疏散', selected: false },
{ label: '客流高峰', selected: false },
]);
// 控制场景 - 当前选择按钮
const selectedButton4 = ref(null);
// 控制场景 - 按钮切换
@@ -467,19 +446,6 @@ const selectButton4 = (button4) => {
selectedButton4.value = button4.label;
};
// 灯具参数表格 =====================================================================
// 灯具参数 - 表格数据
const lightSource = ref([{ num: '8/10', light: '100', temperature: '4200' }]);
let trIndex = ref('-1');
const handleRowClick = (index: any) => {
trIndex.value = index;
if (index === trIndex.value) {
console.log('tri');
}
};
// 内侧弹窗 ========================================================================
// 需要向后端提交的修改内容
@@ -541,15 +507,9 @@ const initMenu = (tier: number) => {
// 1 = 照明区域 - 切换时,重置以下所有菜单
if (tier == 1) {
emit('reset')
// 控制模式 隐藏
showControlMode.value = false;
// 控制场景 隐藏
showControlScene.value = false;
// 灯具参数 隐藏
selectedButton4.value = null;
} else if (tier == 2) {
// 控制场景 隐藏
showControlScene.value = false;
// 灯具参数 隐藏
selectedButton4.value = null;
}
@@ -566,10 +526,8 @@ const refresh = () => {
// 默认选中
data.selected = true
buttons2.value = data.childList
showControlMode.value = false;
showControlScene.value = false;
selectedButton4.value = null;
resetMode()
};
// 执行确认
const executeVisible = ref<boolean>(false);
@@ -584,18 +542,22 @@ const changeConfirm = () => {
// 取消
const changeCancel = () => {
}
// 获得枚举,初始化
const getEnum = (arr: any) => {
getAllEnum({ params: arr }).then(res => {
const data = res.data
controlMode.value = data.IlluminationMode
controlScene.value = data.IlluminationScene
})
console.log(controlMode, controlScene, '001')
// 将当前选择的线路置空
const resetMode = () => {
thisButton2.value = {
code: '',
mode: {
value: '0'
}
}
}
defineExpose({
changeCancel
});
</script>
<style lang="less" scoped>
@import "./dialogStyle.less";

View File

@@ -64,7 +64,7 @@
: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"
@@ -106,14 +106,14 @@ const getTable = () => {
}
// 删除表格中的计划
const deletePlan = (id: String) => {
http.delete(lightingManage.deletePlan, [id]).then(res => {
http.delete(lightingManage.deletePlan, [id]).then(() => {
message.success('操作成功')
getTable()
})
}
// 重启表格中的计划
const restartPlan = (id: String) => {
http.post(lightingManage.restartPlan, { planId: id }).then(res => {
http.post(lightingManage.restartPlan, { planId: id }).then(() => {
message.success('操作成功')
getTable()
})
@@ -128,7 +128,6 @@ const addModal = () => {
addVisible.value = true;
};
// 穿梭框部分 =======================================================
// 穿梭框数据
@@ -137,7 +136,7 @@ const transferData = ref([]) as any;
const getLeftPlan = () => {
http.get(lightingManage.getLeftPlan, {}).then(res => {
let arr = []
res.data.forEach(item => {
res.data.forEach((item: any) => {
arr.push({
key: item.id,
title: item.planName
@@ -160,7 +159,7 @@ const sendPlan = () => {
if (targetKeys.value.length < 1) {
return message.info('没有选择任何计划');
}
http.post(lightingManage.submitLeftPlan, targetKeys.value).then(res => {
http.post(lightingManage.submitLeftPlan, targetKeys.value).then(() => {
message.success('添加成功')
// 如果发送成功,则刷新表格
getTable()

View File

@@ -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,
}])

View File

@@ -225,7 +225,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 +234,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 +247,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 +259,7 @@ export const tableConfig = (el, elGroup, elFormula, defaultParams) => {
},
{
label: '批量导入',
name: 'groupImport',
name: 'GroupPointImport',
type: 'primary',
extra: {
// api: props.postImportApi, // 导入接口名
@@ -277,7 +277,7 @@ export const tableConfig = (el, elGroup, elFormula, defaultParams) => {
{
label: '模板下载',
name: 'groupTemDownload',
name: 'GroupTempDownload',
type: 'primary',
handle: () => {
// http.get('/asset/file/whiteListUser.xlsx');
@@ -291,7 +291,7 @@ export const tableConfig = (el, elGroup, elFormula, defaultParams) => {
actions: [
{
label: '删除',
name: 'groupDelete',
name: 'GroupDelete',
dynamicParams: { linkIds: 'linkId[]' },
confirm: true,
isClearCheck: true,
@@ -346,7 +346,7 @@ export const tableConfigCal = (el, elGroup, elFormula, defaultParams) => {
headerActions: [
{
label: '编辑',
name: 'groupEdit',
name: 'GroupPointEdit',
type: 'primary',
handle: (a, b) => {
el.value.toggle();
@@ -354,7 +354,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 +367,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 +379,7 @@ export const tableConfigCal = (el, elGroup, elFormula, defaultParams) => {
},
{
label: '批量导入',
name: 'groupImport',
name: 'GroupPointImport',
type: 'primary',
extra: {
// api: props.postImportApi, // 导入接口名
@@ -397,7 +397,7 @@ export const tableConfigCal = (el, elGroup, elFormula, defaultParams) => {
{
label: '模板下载',
name: 'groupTemDownload',
name: 'GroupTempDownload',
type: 'primary',
handle: () => {
// http.get('/asset/file/whiteListUser.xlsx');
@@ -407,7 +407,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 +421,7 @@ export const tableConfigCal = (el, elGroup, elFormula, defaultParams) => {
},
{
label: '公式编辑',
name: 'groupFormulaEdit',
name: 'GroupFormulaEdit',
type: 'primary',
handle: () => {
elFormula.value.toggle();
@@ -435,7 +435,7 @@ export const tableConfigCal = (el, elGroup, elFormula, defaultParams) => {
actions: [
{
label: '删除',
name: 'groupDelete',
name: 'GroupPointDelete',
dynamicParams: { ids: 'id[]' },
confirm: true,
isReload: true,

View File

@@ -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) => {
//清除选中行数据

View File

@@ -34,7 +34,7 @@ export const tableConfig = (orgId) => {
},
},
rowSelection: null,
scroll: { x: 2000 },
// scroll: { x: 2000 },
columns: [
{
title: '设备名称',

View File

@@ -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) {

View File

@@ -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,

View File

@@ -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: {

View File

@@ -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,
};
},
});

View File

@@ -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: {

View File

@@ -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,

View File

@@ -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" />

View File

@@ -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_005333333333',
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_005333333333',
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_005333333333',
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_005333333333',
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_005333333333',
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,

View File

@@ -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%" />