Browse Source

fix: 设备联调

main
xuziqiang 5 months ago
parent
commit
78d49ff16e
  1. 11
      hx-ai-intelligent/src/api/deviceManage.ts
  2. 3
      hx-ai-intelligent/src/api/index.ts
  3. 3
      hx-ai-intelligent/src/api/origanizemanage.ts
  4. 88
      hx-ai-intelligent/src/components/ns-modal-form.vue
  5. 98
      hx-ai-intelligent/src/view/equipmentManage/group/config.ts
  6. 107
      hx-ai-intelligent/src/view/equipmentManage/group/index.vue
  7. 10
      lib/component/form/form/form.vue
  8. 4
      lib/component/tree/tree-api.vue
  9. 11
      lib/saas/config/form.config.ts

11
hx-ai-intelligent/src/api/deviceManage.ts

@ -1,10 +1,11 @@
const BASE_URL = '/carbon-smart'; import { BASE_URL } from './index';
export enum device { export enum device {
queryDeviceTree = `${BASE_URL}/deviceInfo/queryDeviceTree`, queryDeviceTree = `${BASE_URL}/deviceInfo/queryDeviceTree`, // 左侧树
queryDevicePage = `${BASE_URL}/deviceInfo/queryDevicePage`, queryDevicePage = `${BASE_URL}/deviceInfo/queryDevicePage`, // 列表
dropArea = `${BASE_URL}/deviceInfo/dropArea`, dropArea = `${BASE_URL}/deviceInfo/dropArea`, // 查询下拉区域
} }
export enum group { export enum group {
queryDeviceGroupTree = `${BASE_URL}/deviceGroup/queryDeviceGroupTree`, queryDeviceGroupTree = `${BASE_URL}/deviceGroup/queryDeviceGroupTree`, // 左侧树
creatOrUpdate = `${BASE_URL}/deviceGroup/creatOrUpdate`, // 左侧树节点新增编辑
} }

3
hx-ai-intelligent/src/api/index.ts

@ -4,3 +4,6 @@
export const apiModule = { export const apiModule = {
parking: ['User', 'CurrentUser', 'Organizational'], parking: ['User', 'CurrentUser', 'Organizational'],
}; };
export const BASE_URL = '/carbon-smart';
export const dict = `${BASE_URL}/client/dict/listByKey`;

3
hx-ai-intelligent/src/api/origanizemanage.ts

@ -1,4 +1,5 @@
const BASE_URL = '/carbon-smart'; import { BASE_URL } from './index';
export enum permission { export enum permission {
add = `${BASE_URL}/admin/permission/save`, add = `${BASE_URL}/admin/permission/save`,
queryOrgPermission = `${BASE_URL}/api/dept/queryOrgPermission`, queryOrgPermission = `${BASE_URL}/api/dept/queryOrgPermission`,

88
hx-ai-intelligent/src/components/ns-modal-form.vue

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

98
hx-ai-intelligent/src/view/equipmentManage/group/config.ts

@ -2,6 +2,8 @@ import { dateUtil } from '/nerv-lib/util/date-util';
import data from './mock.json'; import data from './mock.json';
import { http } from '/nerv-lib/util'; import { http } from '/nerv-lib/util';
import { ref } from 'vue'; import { ref } from 'vue';
import { group } from '/@/api/deviceManage';
import { dict } from '/@/api';
const tableKeyMap = [ const tableKeyMap = [
{ {
title: '来源企业', title: '来源企业',
@ -57,49 +59,105 @@ const doWnload = (url) => {
}; };
const mockData = ref(data.listData); const mockData = ref(data.listData);
export const treeConfig = { export const formSchema = [
{
field: 'isCreate',
component: 'NsInput',
show: false,
},
{
field: 'orgId',
component: 'NsInput',
show: false,
},
{
field: 'isCreatSon',
component: 'NsInput',
show: false,
},
{
label: '节点名称',
field: 'pointName',
component: 'NsInput',
componentProps: {
placeholder: '请输入节点名称(必填)',
},
rules: [
{
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, defaultExpandAll: true,
header: { header: {
icon: 'orgLink', icon: 'orgLink',
title: '能耗分组', title: '能耗分组',
}, },
params: { orgId },
api: () => { api: group.queryDeviceGroupTree,
return new Promise((resolve) => { // api: () => {
setTimeout(() => { // return new Promise((resolve) => {
resolve(data); // setTimeout(() => {
}, 100); // resolve({ data: [{ title: '全部', key: 'all', children: data.data }] });
}); // }, 100);
// });
// },
transform: (data) => {
return [{ title: '全部', key: 'all', selectable: false, children: data }];
}, },
formConfig: { formConfig: {
schemas: [ schemas: [
{ {
field: 'type', field: 'energyType',
label: '', label: '',
component: 'NsSelect', component: 'NsSelectApi',
autoSubmit: true, autoSubmit: true,
defaultValue: 1,
componentProps: { componentProps: {
options: [ api: dict,
{ label: '碳排', value: 1 }, params: { dicKey: 'ENERGY_TYPE' },
{ label: '用电量', value: 2 }, immediate: true,
{ label: '用水量', value: 3 }, resultField: 'data.ENERGY_TYPE',
{ label: '燃气量', value: 4 }, labelField: 'cnValue',
{ label: '供热量', value: 5 }, valueField: 'cnValue',
], placeholder: '请选择能耗种类',
}, },
}, },
{ {
field: 'name', field: 'pointName',
label: '', label: '',
component: 'NsInput', component: 'NsInput',
autoSubmit: true, autoSubmit: true,
componentProps: { componentProps: {
placeholder: '请输入', placeholder: '请输入节点名称',
}, },
}, },
], ],
}, },
};
}; };
export const tableConfig = (el, elGroup, elFormula) => { export const tableConfig = (el, elGroup, elFormula) => {
return { return {

107
hx-ai-intelligent/src/view/equipmentManage/group/index.vue

@ -2,29 +2,113 @@
<editDrawer ref="editDrawerRef" /> <editDrawer ref="editDrawerRef" />
<editGroup ref="editGroupRef" /> <editGroup ref="editGroupRef" />
<editFormula ref="editFormulaRef" /> <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="groupContainer">
<div class="tree"> <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> </div>
<ns-view-list-table v-show="defaultType" class="table" v-bind="config" /> <ns-view-list-table v-show="defaultType" class="table" v-bind="config" />
<ns-view-list-table v-show="!defaultType" class="table" v-bind="configCal" /> <ns-view-list-table v-show="!defaultType" class="table" v-bind="configCal" />
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { createVNode, onMounted, ref } from 'vue'; import { createVNode, nextTick, onMounted, ref } from 'vue';
import { tableConfig, treeConfig, tableConfigCal } from './config'; import { tableConfig, treeConfig, tableConfigCal, formSchema } from './config';
import { useParams } from '/nerv-lib/use'; import { useParams } from '/nerv-lib/use';
import editDrawer from './edit.vue'; import editDrawer from './edit.vue';
import editGroup from './editGroup.vue'; import editGroup from './editGroup.vue';
import editFormula from './editFormula.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 { getParams } = useParams();
const modalFormRef = ref();
const editDrawerRef = ref(); const editDrawerRef = ref();
const editGroupRef = ref(); const editGroupRef = ref();
const editFormulaRef = ref(); const editFormulaRef = ref();
const defaultType = ref(true); const defaultType = ref(true);
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
const config = tableConfig(editDrawerRef, editGroupRef, editFormulaRef); const config = tableConfig(editDrawerRef, editGroupRef, editFormulaRef);
const configCal = tableConfigCal(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 = () => { const handleSelect = () => {
defaultType.value = !defaultType.value; defaultType.value = !defaultType.value;
}; };
@ -55,4 +139,21 @@
min-width: 0; 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> </style>

10
lib/component/form/form/form.vue

@ -120,14 +120,8 @@
provide('addChildForm', addChildForm); provide('addChildForm', addChildForm);
const getFormClass = computed(() => { const getFormClass = computed(() => {
if (props.formLayout === 'flexVertical') { if (props.formLayout) {
return formConfig.formLayout.flexVertical; return formConfig.formLayout[props.formLayout as keyof typeof formConfig.formLayout];
}
if (props.formLayout === 'flex') {
return formConfig.formLayout.flex;
}
if (props.formLayout === 'flexv2') {
return formConfig.formLayout.flexv2;
} }
return formConfig.formLayout.vertical; return formConfig.formLayout.vertical;
}); });

4
lib/component/tree/tree-api.vue

@ -10,10 +10,10 @@
</div> </div>
</div> </div>
<div style="min-height: 300px"> <div style="min-height: 300px; overflow-y: scroll">
<ns-tree v-if="treeData?.length" v-bind="getBindValue" v-model:selectedKeys="selectedKeys"> <ns-tree v-if="treeData?.length" v-bind="getBindValue" v-model:selectedKeys="selectedKeys">
<template #[item]="data" v-for="(item, index) in Object.keys($slots)" :key="index"> <template #[item]="data" v-for="(item, index) in Object.keys($slots)" :key="index">
<slot :name="item" v-bind="data || {}"></slot> <slot :name="item" v-bind="{ ...data, formModel } || {}"></slot>
</template> </template>
</ns-tree> </ns-tree>
<!-- <a-empty v-if="!treeData?.length" /> --> <!-- <a-empty v-if="!treeData?.length" /> -->

11
lib/saas/config/form.config.ts

@ -11,6 +11,17 @@ export const formConfig = {
gutter: [0, 0], gutter: [0, 0],
justify: 'space-around', justify: 'space-around',
}, },
formVertical: {
layout: 'horizontal',
class: 'ns-vertical-form',
wrapperCol: { span: 24 },
labelCol: { span: 0 },
span: 24,
sm: null, //≥576px <=768
lg: null, //>= 768
gutter: [0, 0],
justify: 'space-around',
},
flex: { flex: {
// layout: 'horizontal', // layout: 'horizontal',
class: 'ns-flex-form ns-flex-form-horizontal', class: 'ns-flex-form ns-flex-form-horizontal',

Loading…
Cancel
Save