Merge branch 'temp' of http://123.60.103.97:3000/xuziqiang/SaaS-lib into temp
This commit is contained in:
chenpingsen
@@ -1,10 +1,11 @@
|
||||
const BASE_URL = '/carbon-smart';
|
||||
import { BASE_URL } from './index';
|
||||
export enum device {
|
||||
queryDeviceTree = `${BASE_URL}/deviceInfo/queryDeviceTree`,
|
||||
queryDevicePage = `${BASE_URL}/deviceInfo/queryDevicePage`,
|
||||
dropArea = `${BASE_URL}/deviceInfo/dropArea`,
|
||||
queryDeviceTree = `${BASE_URL}/deviceInfo/queryDeviceTree`, // 左侧树
|
||||
queryDevicePage = `${BASE_URL}/deviceInfo/queryDevicePage`, // 列表
|
||||
dropArea = `${BASE_URL}/deviceInfo/dropArea`, // 查询下拉区域
|
||||
}
|
||||
|
||||
export enum group {
|
||||
queryDeviceGroupTree = `${BASE_URL}/deviceGroup/queryDeviceGroupTree`,
|
||||
queryDeviceGroupTree = `${BASE_URL}/deviceGroup/queryDeviceGroupTree`, // 左侧树
|
||||
creatOrUpdate = `${BASE_URL}/deviceGroup/creatOrUpdate`, // 左侧树节点新增编辑
|
||||
}
|
||||
|
||||
@@ -4,3 +4,6 @@
|
||||
export const apiModule = {
|
||||
parking: ['User', 'CurrentUser', 'Organizational'],
|
||||
};
|
||||
|
||||
export const BASE_URL = '/carbon-smart';
|
||||
export const dict = `${BASE_URL}/client/dict/listByKey`;
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
const BASE_URL = '/carbon-smart';
|
||||
import { BASE_URL } from './index';
|
||||
|
||||
export enum permission {
|
||||
add = `${BASE_URL}/admin/permission/save`,
|
||||
queryOrgPermission = `${BASE_URL}/api/dept/queryOrgPermission`,
|
||||
|
||||
88
hx-ai-intelligent/src/components/ns-modal-form.vue
Normal file
88
hx-ai-intelligent/src/components/ns-modal-form.vue
Normal file
@@ -0,0 +1,88 @@
|
||||
<template>
|
||||
<ns-modal
|
||||
ref="modalRef"
|
||||
v-bind="extraModalConfig"
|
||||
destroyOnClose
|
||||
v-model:visible="visible"
|
||||
:title="title"
|
||||
:okButtonProps="buttonProps"
|
||||
@ok="handleOk">
|
||||
<ns-form ref="formRef" :schemas="schemas" :model="formData" formLayout="formVertical" />
|
||||
</ns-modal>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { computed, ref, toRefs, watch } from 'vue';
|
||||
import { HttpRequestConfig, NsMessage, useApi } from '/nerv-lib/saas';
|
||||
import { useRoute } from 'vue-router';
|
||||
type Props = {
|
||||
title?: string;
|
||||
schemas: Array<any>;
|
||||
api: string | object | Function;
|
||||
data?: object;
|
||||
extraModalConfig?: object;
|
||||
};
|
||||
const route = useRoute();
|
||||
const { httpRequest } = useApi();
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
title: '新增',
|
||||
});
|
||||
const { schemas } = toRefs(props);
|
||||
const formData = ref();
|
||||
watch(
|
||||
() => props?.data,
|
||||
(val) => {
|
||||
formData.value = val;
|
||||
},
|
||||
{
|
||||
immediate: true,
|
||||
deep: true,
|
||||
},
|
||||
);
|
||||
const modalRef = ref();
|
||||
const formRef = ref();
|
||||
const visible = ref(false);
|
||||
const validateResult = computed(() => {
|
||||
return !formRef.value?.validateResult;
|
||||
});
|
||||
const toggle = () => {
|
||||
visible.value = !visible.value;
|
||||
};
|
||||
|
||||
const setLoading = (loading = true) => {
|
||||
buttonProps.value.loading = loading;
|
||||
};
|
||||
|
||||
const handleOk = () => {
|
||||
setLoading(true);
|
||||
formRef.value
|
||||
.triggerSubmit()
|
||||
.then((data: any) => {
|
||||
const { api } = props;
|
||||
const requestConfig: HttpRequestConfig = { method: 'POST' };
|
||||
const { params } = route;
|
||||
|
||||
httpRequest({ api, params: data, pathParams: params, requestConfig })
|
||||
.then(() => {
|
||||
NsMessage.success('操作成功', 1, () => {
|
||||
toggle();
|
||||
});
|
||||
})
|
||||
.finally(() => {
|
||||
setLoading(false);
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
};
|
||||
|
||||
const buttonProps = ref({
|
||||
disabled: validateResult,
|
||||
loading: false,
|
||||
});
|
||||
|
||||
defineExpose({
|
||||
toggle,
|
||||
});
|
||||
</script>
|
||||
<style lang="less"></style>
|
||||
1
hx-ai-intelligent/src/icon/biaoge.svg
Normal file
1
hx-ai-intelligent/src/icon/biaoge.svg
Normal file
@@ -0,0 +1 @@
|
||||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1720144479404" class="icon" viewBox="0 0 1142 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2572" xmlns:xlink="http://www.w3.org/1999/xlink" width="17.84375" height="16"><path d="M1102.769231 39.384615v945.23077H39.384615V39.384615h1063.384616m0-39.384615H39.384615a39.384615 39.384615 0 0 0-39.384615 39.384615v945.23077a39.384615 39.384615 0 0 0 39.384615 39.384615h1063.384616a39.384615 39.384615 0 0 0 39.384615-39.384615V39.384615a39.384615 39.384615 0 0 0-39.384615-39.384615z" fill="#4D4D4D" p-id="2573"></path><path d="M39.384615 393.846154h1063.384616v39.384615H39.384615zM39.384615 590.769231h1063.384616v39.384615H39.384615zM39.384615 787.692308h1063.384616v39.384615H39.384615zM39.384615 196.923077h1063.384616v39.384615H39.384615z" fill="#B3B3B3" p-id="2574"></path><path d="M315.076923 196.923077v787.692308H275.692308V196.923077zM590.769231 196.923077v787.692308h-39.384616V196.923077zM866.461538 196.923077v787.692308h-39.384615V196.923077z" fill="#B3B3B3" p-id="2575"></path><path d="M39.384615 39.384615h1063.384616v157.538462H39.384615z" fill="#05AFC8" p-id="2576"></path></svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
1
hx-ai-intelligent/src/icon/bingtu.svg
Normal file
1
hx-ai-intelligent/src/icon/bingtu.svg
Normal file
@@ -0,0 +1 @@
|
||||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1720145764410" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4680" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16"><path d="M495.611479 159.364238C285.562631 159.364238 115.284768 329.642102 115.284768 539.690949S285.562631 920.01766 495.611479 920.01766 875.93819 749.739797 875.93819 539.690949H518.216336c-12.484662 0-22.604857-10.120194-22.604857-22.604856V159.364238z" fill="#839BFB" p-id="4681"></path><path d="M562.860927 495.046358h368.459161c0-215.978102-175.085916-391.064018-391.064017-391.064018v368.459161c0 12.484662 10.120194 22.604857 22.604856 22.604857z" fill="#839BFB" fill-opacity=".6" p-id="4682"></path></svg>
|
||||
|
After Width: | Height: | Size: 838 B |
1
hx-ai-intelligent/src/icon/huanjingjiance.svg
Normal file
1
hx-ai-intelligent/src/icon/huanjingjiance.svg
Normal file
@@ -0,0 +1 @@
|
||||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1720061440927" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11363" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16"><path d="M659.925333 128a74.666667 74.666667 0 0 1 71.338667 52.618667L754.56 256H821.333333c64.8 0 117.333333 52.533333 117.333334 117.333333v426.666667c0 64.8-52.533333 117.333333-117.333334 117.333333H202.666667c-64.8 0-117.333333-52.533333-117.333334-117.333333V373.333333c0-64.8 52.533333-117.333333 117.333334-117.333333h66.773333l23.296-75.381333A74.666667 74.666667 0 0 1 364.074667 128h295.850666zM512 405.333333c-88.362667 0-160 71.637333-160 160 0 88.362667 71.637333 160 160 160 88.362667 0 160-71.637333 160-160 0-88.362667-71.637333-160-160-160z m0 256a96 96 0 1 0 0-192 96 96 0 0 0 0 192z" fill="#000000" p-id="11364"></path></svg>
|
||||
|
After Width: | Height: | Size: 969 B |
1
hx-ai-intelligent/src/icon/jiankongzhongxin.svg
Normal file
1
hx-ai-intelligent/src/icon/jiankongzhongxin.svg
Normal file
@@ -0,0 +1 @@
|
||||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1720061108318" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="10061" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16"><path d="M512 12L94.71 138v314.92C94.71 657.7 263.86 880.16 512 1012c248.14-131.84 417.29-354.3 417.29-559.08V138z m209.91 510H562v159.91H462V522H302.09V422H462V262.09h100V422h159.91z" fill="#2c2c2c" p-id="10062"></path></svg>
|
||||
|
After Width: | Height: | Size: 549 B |
67
hx-ai-intelligent/src/router/monitor.ts
Normal file
67
hx-ai-intelligent/src/router/monitor.ts
Normal file
@@ -0,0 +1,67 @@
|
||||
const Base = () => import('/nerv-lib/saas/view/system/layout/content.vue');
|
||||
const equipment = {
|
||||
path: '/monitor',
|
||||
name: 'Monitor',
|
||||
meta: { title: '监控中心', icon: 'jiankongzhongxin', index: 1 },
|
||||
redirect: { name: 'EnvironmentMonitor' },
|
||||
children: [
|
||||
{
|
||||
path: 'environmentMonitor',
|
||||
name: 'EnvironmentMonitor',
|
||||
meta: { title: '环境监测', hideChildren: true, icon: 'huanjingjiance' },
|
||||
component: Base,
|
||||
redirect: { name: 'EnvironmentMonitorIndex' },
|
||||
children: [
|
||||
{
|
||||
path: 'index',
|
||||
name: 'EnvironmentMonitorIndex',
|
||||
component: () => import('/@/view/monitor/environmentMonitor/index.vue'),
|
||||
meta: {
|
||||
title: '环境监测',
|
||||
keepAlive: true,
|
||||
// backApi: [],
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: 'deviceMonitor',
|
||||
name: 'DeviceMonitor',
|
||||
meta: { title: '设备监测', hideChildren: true, icon: 'huanjingjiance' },
|
||||
component: Base,
|
||||
redirect: { name: 'DeviceMonitorIndex' },
|
||||
children: [
|
||||
{
|
||||
path: 'index',
|
||||
name: 'DeviceMonitorIndex',
|
||||
component: () => import('/@/view/monitor/deviceMonitor/index.vue'),
|
||||
meta: {
|
||||
title: '设备监测',
|
||||
keepAlive: true,
|
||||
// backApi: [],
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
// {
|
||||
// path: 'group',
|
||||
// name: 'Group',
|
||||
// meta: { title: '分组管理', hideChildren: true, icon: 'shebeiguanli' },
|
||||
// component: Base,
|
||||
// redirect: { name: 'GroupIndex' },
|
||||
// children: [
|
||||
// {
|
||||
// path: 'index',
|
||||
// name: 'GroupIndex',
|
||||
// component: () => import('/@/view/monitor/group/index.vue'),
|
||||
// meta: {
|
||||
// title: '分组管理',
|
||||
// keepAlive: true,
|
||||
// // backApi: [],
|
||||
// },
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
],
|
||||
};
|
||||
export default equipment;
|
||||
@@ -19,7 +19,6 @@ const organizationManage = {
|
||||
meta: {
|
||||
title: '用户管理',
|
||||
keepAlive: true,
|
||||
isCheck: false,
|
||||
operates: [
|
||||
{ title: '新增', code: 'userAdd' },
|
||||
{ title: '导入', code: 'userImport' },
|
||||
|
||||
@@ -2,6 +2,8 @@ import { dateUtil } from '/nerv-lib/util/date-util';
|
||||
import data from './mock.json';
|
||||
import { http } from '/nerv-lib/util';
|
||||
import { ref } from 'vue';
|
||||
import { group } from '/@/api/deviceManage';
|
||||
import { dict } from '/@/api';
|
||||
const tableKeyMap = [
|
||||
{
|
||||
title: '来源企业',
|
||||
@@ -57,49 +59,105 @@ const doWnload = (url) => {
|
||||
};
|
||||
|
||||
const mockData = ref(data.listData);
|
||||
export const treeConfig = {
|
||||
defaultExpandAll: true,
|
||||
header: {
|
||||
icon: 'orgLink',
|
||||
title: '能耗分组',
|
||||
export const formSchema = [
|
||||
{
|
||||
field: 'isCreate',
|
||||
component: 'NsInput',
|
||||
show: false,
|
||||
},
|
||||
|
||||
api: () => {
|
||||
return new Promise((resolve) => {
|
||||
setTimeout(() => {
|
||||
resolve(data);
|
||||
}, 100);
|
||||
});
|
||||
{
|
||||
field: 'orgId',
|
||||
component: 'NsInput',
|
||||
show: false,
|
||||
},
|
||||
formConfig: {
|
||||
schemas: [
|
||||
{
|
||||
field: 'isCreatSon',
|
||||
component: 'NsInput',
|
||||
show: false,
|
||||
},
|
||||
{
|
||||
label: '节点名称',
|
||||
field: 'pointName',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入节点名称(必填)',
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
field: 'type',
|
||||
label: '',
|
||||
component: 'NsSelect',
|
||||
autoSubmit: true,
|
||||
defaultValue: 1,
|
||||
componentProps: {
|
||||
options: [
|
||||
{ label: '碳排', value: 1 },
|
||||
{ label: '用电量', value: 2 },
|
||||
{ label: '用水量', value: 3 },
|
||||
{ label: '燃气量', value: 4 },
|
||||
{ label: '供热量', value: 5 },
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
label: '',
|
||||
component: 'NsInput',
|
||||
autoSubmit: true,
|
||||
componentProps: {
|
||||
placeholder: '请输入',
|
||||
},
|
||||
required: true,
|
||||
message: '请输入节点名称',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '节点类型',
|
||||
field: 'pointType',
|
||||
component: 'NsSelectApi',
|
||||
componentProps: {
|
||||
placeholder: '请选择节点类型(必填)',
|
||||
api: dict,
|
||||
params: { dicKey: 'COUNT_POINT' },
|
||||
immediate: true,
|
||||
resultField: 'data.COUNT_POINT',
|
||||
labelField: 'cnValue',
|
||||
valueField: 'cnValue',
|
||||
},
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入节点类型',
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
export const treeConfig = (orgId) => {
|
||||
return {
|
||||
defaultExpandAll: true,
|
||||
header: {
|
||||
icon: 'orgLink',
|
||||
title: '能耗分组',
|
||||
},
|
||||
params: { orgId },
|
||||
api: group.queryDeviceGroupTree,
|
||||
// api: () => {
|
||||
// return new Promise((resolve) => {
|
||||
// setTimeout(() => {
|
||||
// resolve({ data: [{ title: '全部', key: 'all', children: data.data }] });
|
||||
// }, 100);
|
||||
// });
|
||||
// },
|
||||
transform: (data) => {
|
||||
return [{ title: '全部', key: 'all', selectable: false, children: data }];
|
||||
},
|
||||
formConfig: {
|
||||
schemas: [
|
||||
{
|
||||
field: 'energyType',
|
||||
label: '',
|
||||
component: 'NsSelectApi',
|
||||
autoSubmit: true,
|
||||
componentProps: {
|
||||
api: dict,
|
||||
params: { dicKey: 'ENERGY_TYPE' },
|
||||
immediate: true,
|
||||
resultField: 'data.ENERGY_TYPE',
|
||||
labelField: 'cnValue',
|
||||
valueField: 'cnValue',
|
||||
placeholder: '请选择能耗种类',
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'pointName',
|
||||
label: '',
|
||||
component: 'NsInput',
|
||||
autoSubmit: true,
|
||||
componentProps: {
|
||||
placeholder: '请输入节点名称',
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
};
|
||||
};
|
||||
export const tableConfig = (el, elGroup, elFormula) => {
|
||||
return {
|
||||
|
||||
@@ -2,29 +2,113 @@
|
||||
<editDrawer ref="editDrawerRef" />
|
||||
<editGroup ref="editGroupRef" />
|
||||
<editFormula ref="editFormulaRef" />
|
||||
|
||||
<!-- <ns-modal ref="modalRef" title="新增" v-model:visible="visible">
|
||||
<ns-form ref="formRef" :schemas="formSchema" :model="formData" formLayout="formVertical" />
|
||||
</ns-modal> -->
|
||||
|
||||
<NsModalFrom ref="modalFormRef" v-bind="nsModalFormConfig" />
|
||||
<div class="groupContainer">
|
||||
<div class="tree">
|
||||
<ns-tree-api v-bind="treeConfig" @select="handleSelect" />
|
||||
<ns-tree-api v-bind="tConfig" @select="handleSelect">
|
||||
<template #title="data">
|
||||
<div class="treeRow">
|
||||
<span>{{ data.title }}</span>
|
||||
<a-dropdown>
|
||||
<ns-icon name="actionMore" size="14" class="actionMore" />
|
||||
<template #overlay>
|
||||
<a-menu>
|
||||
<a-menu-item
|
||||
v-for="(item, index) in actionList"
|
||||
:key="index"
|
||||
@click="item.func(data)">
|
||||
<span>{{ item.title }}</span>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</template>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
</template>
|
||||
</ns-tree-api>
|
||||
</div>
|
||||
<ns-view-list-table v-show="defaultType" class="table" v-bind="config" />
|
||||
<ns-view-list-table v-show="!defaultType" class="table" v-bind="configCal" />
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { createVNode, onMounted, ref } from 'vue';
|
||||
import { tableConfig, treeConfig, tableConfigCal } from './config';
|
||||
import { createVNode, nextTick, onMounted, ref } from 'vue';
|
||||
import { tableConfig, treeConfig, tableConfigCal, formSchema } from './config';
|
||||
import { useParams } from '/nerv-lib/use';
|
||||
import editDrawer from './edit.vue';
|
||||
import editGroup from './editGroup.vue';
|
||||
import editFormula from './editFormula.vue';
|
||||
import { NsMessage, NsModal } from '/nerv-lib/component';
|
||||
import NsModalFrom from '/@/components/ns-modal-form.vue';
|
||||
import { group } from '/@/api/deviceManage';
|
||||
|
||||
type opType = 'up' | 'down';
|
||||
const { getParams } = useParams();
|
||||
const modalFormRef = ref();
|
||||
const editDrawerRef = ref();
|
||||
const editGroupRef = ref();
|
||||
const editFormulaRef = ref();
|
||||
const defaultType = ref(true);
|
||||
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||
const config = tableConfig(editDrawerRef, editGroupRef, editFormulaRef);
|
||||
const configCal = tableConfigCal(editDrawerRef, editGroupRef, editFormulaRef);
|
||||
const tConfig = treeConfig(result);
|
||||
const nsModalFormConfig = ref({
|
||||
api: group.creatOrUpdate,
|
||||
data: {},
|
||||
title: '新增',
|
||||
schemas: formSchema,
|
||||
extraModalConfig: {
|
||||
bodyStyle: { paddingBottom: 0 },
|
||||
},
|
||||
});
|
||||
nextTick(() => {
|
||||
console.log(modalFormRef.value, 'modal');
|
||||
});
|
||||
|
||||
const addNodeSon = (data) => {
|
||||
console.log(data);
|
||||
nsModalFormConfig.value.title = '新增';
|
||||
nsModalFormConfig.value.data = {
|
||||
pointName: '新增',
|
||||
isCreate: true,
|
||||
isCreatSon: false,
|
||||
orgId: result,
|
||||
};
|
||||
modalFormRef.value?.toggle();
|
||||
};
|
||||
const editNode = (data) => {
|
||||
console.log(data);
|
||||
nsModalFormConfig.value.title = '编辑';
|
||||
nsModalFormConfig.value.data = { pointName: 123 };
|
||||
modalFormRef.value?.toggle();
|
||||
|
||||
data.value = { pointName: 'qwe' };
|
||||
};
|
||||
const moveNode = (data, type: opType) => {
|
||||
console.log(data);
|
||||
};
|
||||
|
||||
const deleteNode = (a) => {
|
||||
NsModal.confirm({
|
||||
content: '确定删除吗?',
|
||||
onOk: () => {
|
||||
console.log(a);
|
||||
},
|
||||
});
|
||||
};
|
||||
const filterAction = (data) => {};
|
||||
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) },
|
||||
];
|
||||
const handleSelect = () => {
|
||||
defaultType.value = !defaultType.value;
|
||||
};
|
||||
@@ -55,4 +139,21 @@
|
||||
min-width: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.actionMore {
|
||||
display: none;
|
||||
}
|
||||
:deep(.ant-tree-node-content-wrapper) {
|
||||
&:hover {
|
||||
.actionMore {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.treeRow {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
|
||||
180
hx-ai-intelligent/src/view/monitor/deviceMonitor/config.ts
Normal file
180
hx-ai-intelligent/src/view/monitor/deviceMonitor/config.ts
Normal file
@@ -0,0 +1,180 @@
|
||||
import { dateUtil } from '/nerv-lib/util/date-util';
|
||||
import data from './mock.json';
|
||||
export const tableConfig = {
|
||||
title: '设备台账',
|
||||
// api: '/carbon_emission/device/getDeviceList',
|
||||
value: data.dataSource,
|
||||
treeConfig: {
|
||||
header: {
|
||||
icon: 'orgLink',
|
||||
title: '设备类别',
|
||||
},
|
||||
defaultExpandAll: true,
|
||||
api: () => {
|
||||
return new Promise((resolve) => {
|
||||
setTimeout(() => {
|
||||
resolve(data);
|
||||
}, 100);
|
||||
});
|
||||
},
|
||||
formConfig: {
|
||||
schemas: [
|
||||
{
|
||||
field: 'name',
|
||||
label: '设备名称',
|
||||
component: 'NsInput',
|
||||
autoSubmit: true,
|
||||
componentProps: {
|
||||
placeholder: '请输入',
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
params: {
|
||||
page: 0,
|
||||
pageSize: 10,
|
||||
},
|
||||
rowSelection: null,
|
||||
columns: [
|
||||
{
|
||||
title: '设备名称',
|
||||
dataIndex: 'id',
|
||||
},
|
||||
{
|
||||
title: '设备型号',
|
||||
dataIndex: 'deviceCode',
|
||||
},
|
||||
{
|
||||
title: 'SN码',
|
||||
dataIndex: 'deviceName',
|
||||
textNumber: 8,
|
||||
textEllipsis: true,
|
||||
},
|
||||
{
|
||||
title: '设备一级区域',
|
||||
dataIndex: 'position',
|
||||
},
|
||||
{
|
||||
title: '设备二级区域',
|
||||
dataIndex: 'position',
|
||||
},
|
||||
{
|
||||
title: '设备详细位置',
|
||||
dataIndex: 'position',
|
||||
},
|
||||
{
|
||||
title: '设备规格',
|
||||
dataIndex: 'position',
|
||||
},
|
||||
{
|
||||
title: '设备厂商纳税人识别号',
|
||||
dataIndex: 'position',
|
||||
},
|
||||
{
|
||||
title: '厂商联系人',
|
||||
dataIndex: 'position',
|
||||
},
|
||||
{
|
||||
title: '设备描述',
|
||||
dataIndex: 'position',
|
||||
},
|
||||
{
|
||||
title: 'IP地址',
|
||||
dataIndex: 'position',
|
||||
},
|
||||
{
|
||||
title: '生产日期',
|
||||
dataIndex: 'position',
|
||||
},
|
||||
{
|
||||
title: '采购日期',
|
||||
dataIndex: 'position',
|
||||
},
|
||||
{
|
||||
title: '启用日期',
|
||||
dataIndex: 'position',
|
||||
},
|
||||
{
|
||||
title: '设备成本（元）',
|
||||
dataIndex: 'position',
|
||||
},
|
||||
{
|
||||
title: '使用期限',
|
||||
dataIndex: 'position',
|
||||
},
|
||||
{
|
||||
title: '额定功率',
|
||||
dataIndex: 'position',
|
||||
},
|
||||
{
|
||||
title: '特殊参数',
|
||||
dataIndex: 'position',
|
||||
},
|
||||
],
|
||||
|
||||
formConfig: {
|
||||
schemas: [
|
||||
{
|
||||
field: 'name',
|
||||
label: '设备名称',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入',
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'provider',
|
||||
label: '设备厂商',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
placeholder: '请输入',
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'payWay',
|
||||
label: '设备区域',
|
||||
component: 'NsSelect',
|
||||
componentProps: {
|
||||
placeholder: '请选择',
|
||||
options: [
|
||||
{
|
||||
label: '全部',
|
||||
value: '',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'createTime',
|
||||
label: '生产日期',
|
||||
component: 'NsRangePicker',
|
||||
fieldMap: ['queryStartDate', 'queryEndDate'],
|
||||
componentProps: {
|
||||
valueFormat: 'YYYY-MM-DD',
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'createTime1',
|
||||
label: '采购日期',
|
||||
component: 'NsRangePicker',
|
||||
fieldMap: ['queryStartDate', 'queryEndDate'],
|
||||
componentProps: {
|
||||
valueFormat: 'YYYY-MM-DD',
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'createTime2',
|
||||
label: '启用日期',
|
||||
component: 'NsRangePicker',
|
||||
fieldMap: ['queryStartDate', 'queryEndDate'],
|
||||
componentProps: {
|
||||
valueFormat: 'YYYY-MM-DD',
|
||||
},
|
||||
},
|
||||
],
|
||||
params: {},
|
||||
},
|
||||
// pagination: { pageSizeOptions: false },
|
||||
rowKey: 'uuid',
|
||||
};
|
||||
210
hx-ai-intelligent/src/view/monitor/deviceMonitor/graph/index.vue
Normal file
210
hx-ai-intelligent/src/view/monitor/deviceMonitor/graph/index.vue
Normal file
@@ -0,0 +1,210 @@
|
||||
|
||||
<template>
|
||||
|
||||
<div ref="chart" style="width: 100%; height: 80%;"></div>
|
||||
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted, ref, watch } from 'vue';
|
||||
import * as echarts from 'echarts';
|
||||
|
||||
const data = [
|
||||
{
|
||||
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'
|
||||
}
|
||||
]
|
||||
},
|
||||
];
|
||||
|
||||
export default defineComponent({
|
||||
name: 'Graph',
|
||||
setup() {
|
||||
const chart = ref(null);
|
||||
|
||||
onMounted(() => {
|
||||
|
||||
var seriesList = []
|
||||
var date = []
|
||||
var legendList: string|any[] = []
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
|
||||
date.push(data[i].date)
|
||||
|
||||
for (let j = 0; j < data[i].data.length; j++) {
|
||||
if (seriesList.length < j + 1) {
|
||||
seriesList.push(
|
||||
{
|
||||
name: data[i].data[j].name,
|
||||
data: [data[i].data[j].value],
|
||||
type: 'line',
|
||||
smooth: true
|
||||
}
|
||||
)
|
||||
} else {
|
||||
seriesList[j].data.push(data[i].data[j].value)
|
||||
}
|
||||
|
||||
if (legendList.length == 0 || legendList.length < j + 1) {
|
||||
legendList.push(data[i].data[j].name)
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
const option = {
|
||||
|
||||
|
||||
legend: {
|
||||
data: legendList,
|
||||
orient: 'horizontal',
|
||||
bottom: 30
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
formatter: (params: any) => {
|
||||
const date = params[0].name;
|
||||
const values = params.map((param: any) => {
|
||||
const unit = data.find(d => d.date === date)?.unit || '';
|
||||
return `<tr>
|
||||
<td>${param.marker}${param.seriesName}</td>
|
||||
<td style="text-align: right;">${param.value} ${unit}</td>
|
||||
</tr>`;
|
||||
}).join('');
|
||||
return `<div>${date}</div><table style="width: 100%;">${values}</table>`;
|
||||
}
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: date
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value'
|
||||
},
|
||||
dataZoom: [
|
||||
// {
|
||||
// type: 'inside',
|
||||
// start: 0,
|
||||
// end: 10
|
||||
// },
|
||||
{
|
||||
height: 10,
|
||||
start: 0,
|
||||
end: 100,
|
||||
handleSize: '300%', // 设置滑块的大小
|
||||
bottom: 15,
|
||||
|
||||
}
|
||||
],
|
||||
series: seriesList
|
||||
// series: [
|
||||
|
||||
// {
|
||||
// data: [820, 932, 901, 934, 1290, 1330, 1320],
|
||||
// type: 'line'
|
||||
// }
|
||||
// ]
|
||||
};
|
||||
|
||||
const chartInstance = echarts.init(chart.value);
|
||||
chartInstance.setOption(option);
|
||||
});
|
||||
|
||||
return { chart };
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
|
||||
</style>
|
||||
76
hx-ai-intelligent/src/view/monitor/deviceMonitor/index.vue
Normal file
76
hx-ai-intelligent/src/view/monitor/deviceMonitor/index.vue
Normal file
@@ -0,0 +1,76 @@
|
||||
<template>
|
||||
<a-row type="flex">
|
||||
<a-col :span="4">
|
||||
<div style="padding: 0 20px; width: 100%; height: 100%;">
|
||||
<tree ref="treeRef"></tree>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="20">
|
||||
<div style="width: 100%; height: 100%;">
|
||||
<div class="ns-right-title">
|
||||
<span>历史数据</span>
|
||||
<div class="button">
|
||||
<ns-icon name="biaoge" size="18" style="margin-right: 10px;"/>
|
||||
<ns-icon :name="iconName" size="18" style="margin-right: 10px;" @click="change"/>
|
||||
</div>
|
||||
</div>
|
||||
<graph ref="graphRef" v-if="isGraph"></graph>
|
||||
<environment-table ref="tableRef" v-else></environment-table>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
import tree from './tree/index.vue';
|
||||
import graph from './graph/index.vue';
|
||||
import environmentTable from './table/index.vue';
|
||||
|
||||
const iconName = ref('biaoge');
|
||||
|
||||
const treeRef = ref();
|
||||
const graphRef = ref();
|
||||
const tableRef = ref();
|
||||
|
||||
let isGraph = ref(true)
|
||||
|
||||
defineOptions({
|
||||
name: 'EnvironmentMonitorIndex', // 与页面路由name一致缓存才可生效
|
||||
});
|
||||
|
||||
function change() {
|
||||
|
||||
isGraph.value = !isGraph.value
|
||||
if (iconName.value == 'biaoge') {
|
||||
iconName.value = 'bingtu'
|
||||
} else {
|
||||
iconName.value = 'biaoge'
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.ns-right-title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
user-select: text;
|
||||
margin-bottom: 5px;
|
||||
padding-bottom: 10px;
|
||||
padding-top: 10px;
|
||||
border-bottom: 1px solid #e9e9e9;
|
||||
|
||||
> span {
|
||||
padding-left: 10px;
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
.button {
|
||||
display: inline-block;
|
||||
padding-right: 10px;
|
||||
|
||||
}
|
||||
</style>
|
||||
186
hx-ai-intelligent/src/view/monitor/deviceMonitor/table/index.vue
Normal file
186
hx-ai-intelligent/src/view/monitor/deviceMonitor/table/index.vue
Normal file
@@ -0,0 +1,186 @@
|
||||
<template>
|
||||
<a-table :columns="columns" :data-source="data" bordered />
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import type { TableColumnType } from 'ant-design-vue';
|
||||
|
||||
const data = [
|
||||
{
|
||||
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',
|
||||
},
|
||||
];
|
||||
|
||||
export default defineComponent({
|
||||
name: 'EnvironmentTable',
|
||||
setup() {
|
||||
const getRowSpan = (dataIndex: string, record, data, dependents: string[] = []) => {
|
||||
let rowSpan = 1;
|
||||
for (let i = data.indexOf(record) + 1; i < data.length; i++) {
|
||||
let shouldMerge = true;
|
||||
for (const dependent of dependents) {
|
||||
if (data[i][dependent] !== record[dependent]) {
|
||||
shouldMerge = false;
|
||||
break;
|
||||
}
|
||||
}
|
||||
if (shouldMerge && data[i][dataIndex] === record[dataIndex]) {
|
||||
rowSpan++;
|
||||
} else {
|
||||
break;
|
||||
}
|
||||
}
|
||||
return rowSpan;
|
||||
};
|
||||
|
||||
const columns: TableColumnType[] = [
|
||||
{
|
||||
title: '序号',
|
||||
dataIndex: 'key',
|
||||
customCell: (record, rowIndex) => {
|
||||
const rowSpan = getRowSpan('name', record, data);
|
||||
if (rowIndex != 0 && data[rowIndex-1].key == record.key) {
|
||||
return {
|
||||
rowSpan: 0,
|
||||
colSpan: 0,
|
||||
}
|
||||
}
|
||||
return {
|
||||
rowSpan: rowSpan,
|
||||
};
|
||||
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '设备名称',
|
||||
dataIndex: 'name',
|
||||
customCell: (record, rowIndex) => {
|
||||
const rowSpan = getRowSpan('name', record, data);
|
||||
if (rowIndex != 0 && data[rowIndex-1].name == record.name) {
|
||||
return {
|
||||
rowSpan: 0,
|
||||
colSpan: 0,
|
||||
}
|
||||
}
|
||||
return {
|
||||
rowSpan: rowSpan,
|
||||
};
|
||||
|
||||
// if (rowIndex === data.indexOf(record)) {
|
||||
// return {
|
||||
// rowSpan: rowSpan,
|
||||
// };
|
||||
// }
|
||||
// return {
|
||||
// rowSpan: 0,
|
||||
// colSpan: 0,
|
||||
// };
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '设备点位',
|
||||
dataIndex: 'position',
|
||||
customCell: (record, rowIndex) => {
|
||||
const rowSpan = getRowSpan('position', record, data, ['name']);
|
||||
if (rowIndex != 0 && data[rowIndex-1].name == record.name && data[rowIndex-1].position == record.position) {
|
||||
return {
|
||||
rowSpan: 0,
|
||||
colSpan: 0,
|
||||
}
|
||||
}
|
||||
return {
|
||||
rowSpan: rowSpan,
|
||||
};
|
||||
// if (rowIndex === data.indexOf(record)) {
|
||||
// return {
|
||||
// rowSpan: rowSpan,
|
||||
// };
|
||||
// }
|
||||
// return {
|
||||
// rowSpan: 0,
|
||||
// colSpan: 0,
|
||||
// };
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '计量单位',
|
||||
dataIndex: 'unit',
|
||||
customCell: (record, rowIndex) => {
|
||||
const rowSpan = getRowSpan('unit', record, data, ['name', 'position']);
|
||||
if (rowIndex != 0 && data[rowIndex-1].name == record.name && data[rowIndex-1].position == record.position && data[rowIndex-1].unit == record.unit) {
|
||||
return {
|
||||
rowSpan: 0,
|
||||
colSpan: 0,
|
||||
}
|
||||
}
|
||||
return {
|
||||
rowSpan: rowSpan,
|
||||
};
|
||||
// if (rowIndex === data.indexOf(record)) {
|
||||
// return {
|
||||
// rowSpan: rowSpan,
|
||||
// };
|
||||
// }
|
||||
// return {
|
||||
// rowSpan: 0,
|
||||
// colSpan: 0,
|
||||
// };
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '日期',
|
||||
dataIndex: 'date',
|
||||
},
|
||||
{
|
||||
title: '1:00',
|
||||
dataIndex: '1:00',
|
||||
},
|
||||
];
|
||||
|
||||
return {
|
||||
data,
|
||||
columns,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
||||
225
hx-ai-intelligent/src/view/monitor/deviceMonitor/tree/index.vue
Normal file
225
hx-ai-intelligent/src/view/monitor/deviceMonitor/tree/index.vue
Normal file
@@ -0,0 +1,225 @@
|
||||
<template>
|
||||
<div class="parent-container">
|
||||
<div class="ns-tree-title">
|
||||
<span>设备列表</span>
|
||||
</div>
|
||||
<a-tree-select
|
||||
v-model:value="value"
|
||||
style="width: 100%"
|
||||
|
||||
:tree-line="treeLine && { showLeafIcon }"
|
||||
:tree-data="treeData1"
|
||||
>
|
||||
<!-- <template #title="{ value: val, title }">
|
||||
<b v-if="val === 'parent 1-1'" style="color: #08c">sss</b>
|
||||
<template v-else>{{ title }}</template>
|
||||
</template> -->
|
||||
</a-tree-select>
|
||||
|
||||
<a-tree
|
||||
v-model:expandedKeys="expandedKeys"
|
||||
v-model:selectedKeys="selectedKeys"
|
||||
v-model:checkedKeys="checkedKeys"
|
||||
checkable
|
||||
style="width: 100%; margin-bottom: 10px;"
|
||||
:tree-data="treeData2"
|
||||
>
|
||||
<!-- <template #title="{ title, key }">
|
||||
<span v-if="key === '0-0-1-0'" style="color: #1890ff">{{ title }}</span>
|
||||
<template v-else>{{ title }}</template>
|
||||
</template> -->
|
||||
</a-tree>
|
||||
|
||||
<div class="fixed-bottom">
|
||||
<a-divider />
|
||||
<a-select
|
||||
ref="select"
|
||||
v-model:value="selectedValue"
|
||||
placeholder="请选择点位"
|
||||
style="width: 100%; margin-bottom: 10px;"
|
||||
:options="options1"
|
||||
></a-select>
|
||||
<a-select
|
||||
v-model:value="frequencyValue"
|
||||
placeholder="请选择频率"
|
||||
style="width: 100%; margin-bottom: 10px;"
|
||||
:options="options2"
|
||||
></a-select>
|
||||
<a-range-picker v-model:value="dateRange" style="width: 100%; margin-bottom: 10px;" :placeholder="['请选择日期','请选择日期']"/>
|
||||
<a-button type="primary" style="width: 100%; margin-bottom: 10px;" @click="getDianWeiList">查询</a-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import type { TreeSelectProps, TreeProps, SelectProps } from 'ant-design-vue';
|
||||
import { defineComponent, ref, watch ,onMounted } from 'vue';
|
||||
import dayjs, { Dayjs } from 'dayjs';
|
||||
|
||||
const treeData2: TreeProps['treeData'] = [
|
||||
{
|
||||
title: 'AC_001(总电表)',
|
||||
key: '1',
|
||||
children: [
|
||||
{
|
||||
title: 'AC_002(暖通电表)',
|
||||
key: '2',
|
||||
},
|
||||
{
|
||||
title: 'AC_003(照明电表)',
|
||||
key: '3',
|
||||
},
|
||||
{
|
||||
title: 'AC_004(给排水电表)',
|
||||
key: '4',
|
||||
},
|
||||
{
|
||||
title: 'AC_005(通风电表)',
|
||||
key: '5',
|
||||
},
|
||||
{
|
||||
title: 'AC_006(电动门电表)',
|
||||
key: '6',
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
export default defineComponent({
|
||||
name: 'Tree',
|
||||
setup() {
|
||||
const treeLine = ref(true);
|
||||
const showLeafIcon = ref(false);
|
||||
const value = ref<string>();
|
||||
|
||||
const treeData1 = ref<TreeSelectProps['treeData']>([
|
||||
{
|
||||
title: '3.电梯',
|
||||
value: '3',
|
||||
children: [
|
||||
{
|
||||
title: '301.扶梯',
|
||||
value: '301',
|
||||
},
|
||||
{
|
||||
title: '302.直梯',
|
||||
value: '302',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: '4.冷热源',
|
||||
value: '4',
|
||||
children: [
|
||||
{
|
||||
title: '401.冷水机组',
|
||||
value: '401',
|
||||
},
|
||||
{
|
||||
title: '402.热泵机组',
|
||||
value: '402',
|
||||
},
|
||||
{
|
||||
title: '403.锅炉',
|
||||
value: '403',
|
||||
},
|
||||
{
|
||||
title: '404.水处理机组',
|
||||
value: '404',
|
||||
},
|
||||
],
|
||||
},
|
||||
]);
|
||||
|
||||
const expandedKeys = 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 options1 = ref<SelectProps['options']>([]);
|
||||
const options2 = ref<SelectProps['options']>([
|
||||
{
|
||||
value: '1',
|
||||
label: '5分钟',
|
||||
},
|
||||
{
|
||||
value: '2',
|
||||
label: '10分钟',
|
||||
},
|
||||
{
|
||||
value: '3',
|
||||
label: '30分钟',
|
||||
},
|
||||
{
|
||||
value: '4',
|
||||
label: '1小时',
|
||||
},
|
||||
]);
|
||||
const selectedValue = ref<string | undefined>();
|
||||
const frequencyValue = ref<string | undefined>();
|
||||
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 项电流' },
|
||||
];
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getDianWeiList();
|
||||
});
|
||||
|
||||
const dateFormat = 'YYYY-MM-DD';
|
||||
|
||||
|
||||
|
||||
return {
|
||||
treeLine,
|
||||
showLeafIcon,
|
||||
value,
|
||||
treeData1,
|
||||
treeData2,
|
||||
expandedKeys,
|
||||
selectedKeys,
|
||||
checkedKeys,
|
||||
options1,
|
||||
options2,
|
||||
selectedValue,
|
||||
frequencyValue,
|
||||
dateRange,
|
||||
getDianWeiList,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.ns-tree-title {
|
||||
user-select: text;
|
||||
margin-bottom: 5px;
|
||||
padding-bottom: 10px;
|
||||
padding-top: 10px;
|
||||
border-bottom: 1px solid #e9e9e9;
|
||||
> span {
|
||||
padding-left: 10px;
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
.parent-container {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.fixed-bottom {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
</style>
|
||||
@@ -131,6 +131,7 @@ export const formConfig2 = (disabled2: Boolean) => {
|
||||
label: '是否部门领导',
|
||||
field: 'isLeader',
|
||||
component: 'NsRadioGroup',
|
||||
defaultValue: 1,
|
||||
componentProps: {
|
||||
disabled: disabled2,
|
||||
radioType: 'radio',
|
||||
|
||||
@@ -65,10 +65,10 @@
|
||||
</a-tabs>
|
||||
<a-space v-if="activeKey === 1 || deptPermissionTreeData?.length">
|
||||
<ns-button type="primary" @click="CancelApartment">取消 </ns-button>
|
||||
<ns-button v-show="disabled" type="primary" @click="pipe(deptEdit, true, false)">
|
||||
<ns-button v-if="disabled" type="primary" @click="pipe(deptEdit, true, false)">
|
||||
编辑
|
||||
</ns-button>
|
||||
<ns-button v-show="!disabled" type="primary" @click="deptSure">确定</ns-button>
|
||||
<ns-button v-else type="primary" @click="deptSure">确定</ns-button>
|
||||
</a-space>
|
||||
</div>
|
||||
</a-col>
|
||||
@@ -79,11 +79,11 @@
|
||||
<a-row>
|
||||
<a-col :span="8" class="tree">
|
||||
<a-space wrap style="margin-bottom: 16px; justify-content: flex-start">
|
||||
<ns-button v-auth="'userAdd'" type="primary" @click="rolePipe(addUser, true)">
|
||||
<!-- <ns-button v-auth="'userAdd'" type="primary" @click="rolePipe(addUser, true)">
|
||||
新增角色
|
||||
</ns-button>
|
||||
<ns-button type="primary" @click="rolePipe(addUserSon)">新增子角色</ns-button>
|
||||
<ns-button type="primary" @click="rolePipe(deleteUser)"> 删除 </ns-button>
|
||||
<ns-button type="primary" @click="rolePipe(deleteUser)"> 删除 </ns-button> -->
|
||||
</a-space>
|
||||
<a-tree
|
||||
v-if="roleTreeData.length"
|
||||
@@ -95,19 +95,19 @@
|
||||
<template #title="data">
|
||||
<div style="display: flex; justify-content: space-between; align-items: center">
|
||||
<span> {{ data.zhName }}</span>
|
||||
<!-- <a-dropdown>
|
||||
<a-dropdown>
|
||||
<ns-icon name="actionMore" size="14" class="actionMore" />
|
||||
<template #overlay>
|
||||
<a-menu>
|
||||
<a-menu-item
|
||||
v-for="(action, index) in dropRoleActions"
|
||||
v-for="(action, index) in filterAction(data, dropRoleActions, 'addUser')"
|
||||
:key="index"
|
||||
@click="action.func(data)">
|
||||
<span>{{ action.title }}</span>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</template>
|
||||
</a-dropdown> -->
|
||||
</a-dropdown>
|
||||
</div>
|
||||
</template>
|
||||
</a-tree>
|
||||
@@ -139,20 +139,16 @@
|
||||
<a-empty style="margin-top: 120px" v-else />
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
<a-space>
|
||||
<a-space v-if="roleActiveKey === 1 || rolePermissionTreeData?.length">
|
||||
<ns-button type="primary" @click="CancelUser">取消</ns-button>
|
||||
<ns-button
|
||||
v-show="roleDisabled"
|
||||
v-if="roleDisabled"
|
||||
:disabled="!roleTreeData?.length"
|
||||
type="primary"
|
||||
@click="rolePipe(roleEdit, false, false)">
|
||||
编辑
|
||||
</ns-button>
|
||||
<ns-button
|
||||
v-show="!roleDisabled"
|
||||
:disabled="!roleTreeData?.length"
|
||||
type="primary"
|
||||
@click="roleSure">
|
||||
<ns-button v-else :disabled="!roleTreeData?.length" type="primary" @click="roleSure">
|
||||
确定
|
||||
</ns-button>
|
||||
</a-space>
|
||||
@@ -167,7 +163,7 @@
|
||||
import { Modal } from 'ant-design-vue';
|
||||
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||
import { http } from '/nerv-lib/util/http';
|
||||
import { cloneDeep, get } from 'lodash-es';
|
||||
import { cloneDeep, get, isEmpty } from 'lodash-es';
|
||||
import { formConfig, formConfig2 } from './config';
|
||||
import { department } from '/@/api/origanizemanage';
|
||||
import { permission } from '/@/api/origanizemanage';
|
||||
@@ -180,7 +176,7 @@
|
||||
const formRef = ref();
|
||||
const formRoleRef = ref();
|
||||
let formData = ref({});
|
||||
let roleFormData = ref({});
|
||||
let roleFormData = ref({ isLeader: 1 });
|
||||
const activeKey = ref(1);
|
||||
const roleActiveKey = ref(1);
|
||||
const disabled = ref(true);
|
||||
@@ -224,7 +220,7 @@
|
||||
|
||||
/**操作拦截 */
|
||||
const pipe = (func: Function, flag = false, toggle = true) => {
|
||||
if (toggle) activeKey.value = 1;
|
||||
// if (toggle) activeKey.value = 1;
|
||||
if (flag) {
|
||||
// 只有部门的操作
|
||||
if (selectRef.value?.hasOwnProperty('orgInfo') || !selectRef.value?.deptInfo) {
|
||||
@@ -243,13 +239,15 @@
|
||||
|
||||
const rolePipe = (func: Function, linkDept = false, toggle = true) => {
|
||||
console.log(selectRoleRef.value);
|
||||
if (toggle) roleActiveKey.value = 1;
|
||||
// if (toggle) roleActiveKey.value = 1;
|
||||
// 需要先选择部门
|
||||
if ((linkDept && !selectRef.value?.deptInfo) || selectRef.value?.hasOwnProperty('own')) {
|
||||
NsMessage.error('请先选择相关部门');
|
||||
return;
|
||||
}
|
||||
if (!linkDept && !selectRoleRef.value) {
|
||||
console.log(123);
|
||||
|
||||
if (!linkDept && isEmpty(selectRoleRef.value)) {
|
||||
NsMessage.error('请先选择相关角色');
|
||||
return;
|
||||
}
|
||||
@@ -302,6 +300,7 @@
|
||||
item['deptInfo'] = item.orgInfo;
|
||||
item['deptInfo']['deptName'] = item?.orgInfo?.orgName;
|
||||
item['own'] = !index;
|
||||
item['selectable'] = false;
|
||||
item['children'] = item.deptTrees;
|
||||
return item;
|
||||
});
|
||||
@@ -325,7 +324,7 @@
|
||||
// 获取角色树
|
||||
const getUserTree = (params = { deptId: selectRef.value?.deptInfo?.deptId }) => {
|
||||
return http.post(department.queryRoleTree, params).then((res) => {
|
||||
roleTreeData.value = res.data;
|
||||
roleTreeData.value = [{ zhName: '全部', selectable: false, orgInfo: {}, children: res.data }];
|
||||
});
|
||||
};
|
||||
// 根据依赖刷新角色树
|
||||
@@ -334,12 +333,12 @@
|
||||
getUserTree().then(() => {
|
||||
if (!roleTreeData.value?.length) {
|
||||
selectRoleRef.value = {};
|
||||
roleFormData.value = {};
|
||||
roleFormData.value = { isLeader: 1 };
|
||||
}
|
||||
const info = {
|
||||
node: { key: '0-0', dataRef: { ...roleTreeData.value[0] } },
|
||||
node: { key: '0-0-0', dataRef: { ...roleTreeData.value[0].children[0] } },
|
||||
};
|
||||
SelectUserTree(['0-0'], info);
|
||||
SelectUserTree([''], info);
|
||||
});
|
||||
}
|
||||
});
|
||||
@@ -351,8 +350,10 @@
|
||||
callback: null,
|
||||
};
|
||||
|
||||
// 添加部门
|
||||
const addApartment = (data) => {
|
||||
const { deptInfo } = data;
|
||||
activeKey.value = 1;
|
||||
|
||||
disabled.value = false;
|
||||
opMap.type = 'addDept';
|
||||
@@ -369,23 +370,17 @@
|
||||
orgId: deptInfo?.orgId,
|
||||
sourceOrgId,
|
||||
projectId,
|
||||
pdeptId: deptInfo.pdeptId || '',
|
||||
orgName,
|
||||
});
|
||||
});
|
||||
};
|
||||
};
|
||||
|
||||
const getParent = (data) => {
|
||||
if (data?.parent) {
|
||||
getParent(data.parent);
|
||||
} else {
|
||||
data;
|
||||
}
|
||||
};
|
||||
|
||||
// 添加子部门
|
||||
const addApartmentSon = (data) => {
|
||||
const { deptInfo } = data;
|
||||
|
||||
activeKey.value = 1;
|
||||
disabled.value = false;
|
||||
opMap.type = 'addson';
|
||||
formData.value = {};
|
||||
@@ -407,10 +402,11 @@
|
||||
};
|
||||
};
|
||||
|
||||
const addUser = () => {
|
||||
const addUser = (data) => {
|
||||
roleDisabled.value = false;
|
||||
opMap.type = 'addUser';
|
||||
roleFormData.value = {};
|
||||
roleFormData.value = { isLeader: 1 };
|
||||
roleActiveKey.value = 1;
|
||||
opMap.fuc = (params) => {
|
||||
delete params.roleId;
|
||||
return formRoleRef.value.triggerSubmit().then(() => {
|
||||
@@ -418,6 +414,7 @@
|
||||
...params,
|
||||
orgId,
|
||||
projectId,
|
||||
proleId: data.proleId || '',
|
||||
deptId: selectRef.value.deptInfo.deptId,
|
||||
deptName: selectRef.value.deptInfo.deptName,
|
||||
});
|
||||
@@ -425,10 +422,11 @@
|
||||
};
|
||||
};
|
||||
|
||||
const addUserSon = () => {
|
||||
const addUserSon = (data) => {
|
||||
roleDisabled.value = false;
|
||||
opMap.type = 'addUserSon';
|
||||
roleFormData.value = {};
|
||||
roleActiveKey.value = 1;
|
||||
roleFormData.value = { isLeader: 1 };
|
||||
opMap.fuc = (params) => {
|
||||
delete params.roleId;
|
||||
return formRoleRef.value.triggerSubmit().then(() => {
|
||||
@@ -436,7 +434,7 @@
|
||||
...params,
|
||||
orgId,
|
||||
projectId,
|
||||
proleId: selectRoleRef.value.roleId,
|
||||
proleId: data.roleId,
|
||||
deptId: selectRef.value.deptInfo.deptId,
|
||||
deptName: selectRef.value.deptInfo.deptName,
|
||||
});
|
||||
@@ -444,8 +442,6 @@
|
||||
};
|
||||
};
|
||||
const deleteDept = (data) => {
|
||||
console.log(data);
|
||||
|
||||
// 删除逻辑
|
||||
Modal.confirm({
|
||||
title: '是否确认删除',
|
||||
@@ -458,6 +454,7 @@
|
||||
// 删除选中的数据需要清空
|
||||
deptTreeSelectedKeys.value = [];
|
||||
selectRef.value = '';
|
||||
roleTreeData.value = [{ zhName: '全部', selectable: false, orgInfo: {}, children: [] }];
|
||||
}
|
||||
});
|
||||
},
|
||||
@@ -467,16 +464,20 @@
|
||||
});
|
||||
};
|
||||
|
||||
const deleteUser = () => {
|
||||
const deleteUser = (data) => {
|
||||
Modal.confirm({
|
||||
title: '是否确认删除',
|
||||
onOk() {
|
||||
http.post(department.delRole, { roleId: selectRoleRef.value.roleId }).then(() => {
|
||||
http.post(department.delRole, { roleId: data.roleId }).then(() => {
|
||||
getUserTree({ deptId: selectRef.value.deptInfo.deptId });
|
||||
clearRoleData();
|
||||
// 清空select树
|
||||
roleTreeSelectedKeys.value = [];
|
||||
selectRoleRef.value = '';
|
||||
if (data.selected) {
|
||||
// 删除选中的数据需要清空
|
||||
roleTreeSelectedKeys.value = [];
|
||||
selectRoleRef.value = '';
|
||||
}
|
||||
|
||||
NsMessage.success('操作成功');
|
||||
});
|
||||
},
|
||||
@@ -554,6 +555,7 @@
|
||||
};
|
||||
// 保存角色权限
|
||||
const rolePermission = () => {
|
||||
if (!roleTotalCheckedKeys.value?.length) return;
|
||||
http
|
||||
.post(department.addRolePermission, {
|
||||
// deptId: selectRef.value?.deptInfo.deptId,
|
||||
@@ -645,6 +647,7 @@
|
||||
rolePermissionTreeData.value = [];
|
||||
roleCheckedKeys.value = [];
|
||||
roleTreeSelectedKeys.value = [];
|
||||
roleDisabled.value = true;
|
||||
};
|
||||
|
||||
/**
|
||||
@@ -739,10 +742,10 @@
|
||||
// { title: '新增角色', func: addUser, key: 'addUser' },
|
||||
]);
|
||||
|
||||
const filterAction = (data, actions) => {
|
||||
const filterAction = (data, actions, keyV = 'addDept') => {
|
||||
if (data.hasOwnProperty('orgInfo')) {
|
||||
// 企业节点
|
||||
return actions.filter(({ key }) => key === 'addDept');
|
||||
return actions.filter(({ key }) => key === keyV);
|
||||
}
|
||||
return actions;
|
||||
};
|
||||
|
||||
@@ -44,6 +44,7 @@ export const formConfig = (disabled) => {
|
||||
label: '性别',
|
||||
field: 'sex',
|
||||
component: 'NsRadioGroup',
|
||||
defaultValue: '男',
|
||||
componentProps: {
|
||||
radioType: 'radio',
|
||||
options: [
|
||||
|
||||
@@ -4,30 +4,17 @@
|
||||
<div class="main">
|
||||
<div class="left">
|
||||
<div class="top">
|
||||
<ns-tree-api v-bind="orgTreeConfig" @select="handleSelect">
|
||||
<ns-tree-api v-bind="orgTreeConfig" @select="handleSelect" v-model:treeData="treeData">
|
||||
<template #title="data">
|
||||
{{ data.orgInfo?.orgName }}
|
||||
</template>
|
||||
</ns-tree-api>
|
||||
</div>
|
||||
<div class="top">
|
||||
<!-- <div class="ns-table-title">关联部门</div>
|
||||
|
||||
<a-input-search
|
||||
v-model:value="searchValue2"
|
||||
style="margin-bottom: 8px"
|
||||
placeholder="请输入关联部门"
|
||||
@search="onSearch2" />
|
||||
<a-tree
|
||||
v-if="treeData2?.length"
|
||||
:tree-data="treeData2"
|
||||
defaultExpandAll
|
||||
@select="handleSelect2">
|
||||
<template #title="data">
|
||||
{{ data.deptInfo?.deptName }}
|
||||
</template>
|
||||
</a-tree> -->
|
||||
<ns-tree-api v-bind="deptTreeConfig" @select="handleSelect2">
|
||||
<ns-tree-api
|
||||
v-bind="deptTreeConfig"
|
||||
@select="handleSelect2"
|
||||
v-model:treeData="treeDataDept">
|
||||
<template #title="data">
|
||||
{{ data.deptInfo?.deptName }}
|
||||
</template>
|
||||
@@ -87,7 +74,7 @@
|
||||
import { formConfig, formConfig2 } from './config';
|
||||
import { origanizemanage } from '/@/api/origanizemanage';
|
||||
|
||||
defineOptions({ name: 'OrderListIndex' });
|
||||
defineOptions({ name: 'UserManageIndex' });
|
||||
|
||||
const mainRef = ref();
|
||||
const data = reactive({});
|
||||
@@ -113,19 +100,21 @@
|
||||
const casData = ref([]);
|
||||
const formSchema2 = formConfig2(casData);
|
||||
const treeData = ref([]);
|
||||
const treeDataDept = ref([]);
|
||||
const treeData2 = ref([]);
|
||||
const userAuthList = ref([]);
|
||||
const orgId = JSON.parse(sessionStorage.getItem('userInfo')).orgId;
|
||||
// const orgId = JSON.parse(sessionStorage.getItem('userInfo')).orgId;
|
||||
const orgId = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||
const orgTreeConfig = ref({
|
||||
selectedKeys: ['0-0'],
|
||||
defaultExpandAll: true,
|
||||
api: origanizemanage.queryOrgTree,
|
||||
defaultParams: { orgId },
|
||||
params: { orgId },
|
||||
transform: (data) => {
|
||||
const otherOrg = data[0].listOrg;
|
||||
const otherOrg = data[0]?.listOrg;
|
||||
let treeData = [];
|
||||
// 特殊处理
|
||||
if (data[0].orgInfo) {
|
||||
if (data[0]?.orgInfo) {
|
||||
treeData = data;
|
||||
}
|
||||
otherOrg?.map((item) => {
|
||||
@@ -153,7 +142,7 @@
|
||||
const deptTreeConfig = ref({
|
||||
defaultExpandAll: true,
|
||||
api: origanizemanage.queryDeptTree,
|
||||
defaultParams: { orgId },
|
||||
params: { orgId },
|
||||
|
||||
header: {
|
||||
title: '关联部门',
|
||||
@@ -192,11 +181,11 @@
|
||||
});
|
||||
});
|
||||
};
|
||||
getOrgTree();
|
||||
// getOrgTree();
|
||||
// 部门树
|
||||
fetch(origanizemanage.queryDeptTree).then((res) => {
|
||||
treeData2.value = res.data;
|
||||
});
|
||||
// fetch(origanizemanage.queryDeptTree).then((res) => {
|
||||
// treeData2.value = res.data;
|
||||
// });
|
||||
|
||||
const onSearch = () => {
|
||||
console.log(searchValue.value);
|
||||
@@ -225,8 +214,10 @@
|
||||
};
|
||||
|
||||
const handleSelect = (selectedKeys: any, info: any) => {
|
||||
console.log(info);
|
||||
|
||||
fetch(origanizemanage.queryDeptTree, { orgId: info.node?.orgInfo.orgId }).then((res) => {
|
||||
treeData2.value = res.data;
|
||||
treeDataDept.value = res.data;
|
||||
});
|
||||
tableFetch({ orgId: info.node?.orgInfo.orgId });
|
||||
};
|
||||
@@ -298,6 +289,7 @@
|
||||
opMap.value.type = 'add';
|
||||
setTimeout(() => {
|
||||
formData.value = {
|
||||
sex: '男',
|
||||
orgName: JSON.parse(sessionStorage.getItem('userInfo')).orgName,
|
||||
};
|
||||
userAuthList.value.splice(0);
|
||||
@@ -350,30 +342,23 @@
|
||||
customRender: (text: any) => {
|
||||
return text.index + 1;
|
||||
},
|
||||
sorter: {
|
||||
compare: (a, b) => a.address - b.address,
|
||||
},
|
||||
sorter: true,
|
||||
},
|
||||
{
|
||||
title: '账号',
|
||||
dataIndex: 'accountNo',
|
||||
sorter: {
|
||||
compare: (a, b) => a.accountNo - b.accountNo,
|
||||
},
|
||||
sorter: true,
|
||||
},
|
||||
{
|
||||
title: '姓名',
|
||||
dataIndex: 'realName',
|
||||
sorter: {
|
||||
compare: (a, b) => a.realName - b.realName,
|
||||
},
|
||||
sorter: true,
|
||||
},
|
||||
{
|
||||
title: '性别',
|
||||
dataIndex: 'sex',
|
||||
sorter: {
|
||||
compare: (a, b) => a.name - b.name,
|
||||
},
|
||||
sorter: true,
|
||||
textNumber: 4,
|
||||
},
|
||||
{
|
||||
title: '手机号',
|
||||
@@ -381,11 +366,15 @@
|
||||
},
|
||||
{
|
||||
title: '邮箱',
|
||||
textNumber: 5,
|
||||
textEllipsis: true,
|
||||
dataIndex: 'email',
|
||||
},
|
||||
{
|
||||
title: '组织关系',
|
||||
dataIndex: 'orgName',
|
||||
// textNumber: 9,
|
||||
// textEllipsis: true,
|
||||
},
|
||||
{
|
||||
title: '部门/角色',
|
||||
|
||||
Reference in New Issue
Block a user