fix: 设备联调

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

@@ -1,10 +1,11 @@
-const BASE_URL = '/carbon-smart';
+import { BASE_URL } from './index';
 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 {
-  queryDeviceGroupTree = `${BASE_URL}/deviceGroup/queryDeviceGroupTree`,
+  queryDeviceGroupTree = `${BASE_URL}/deviceGroup/queryDeviceGroupTree`, // 左侧树
+  creatOrUpdate = `${BASE_URL}/deviceGroup/creatOrUpdate`, // 左侧树节点新增编辑
 }

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

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

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

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

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>

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 { 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 = {
+export const formSchema = [
-  defaultExpandAll: true,
+  {
-  header: {
+    field: 'isCreate',
-    icon: 'orgLink',
+    component: 'NsInput',
-    title: '能耗分组',
+    show: false,
   },
-
+  {
-  api: () => {
+    field: 'orgId',
-    return new Promise((resolve) => {
+    component: 'NsInput',
-      setTimeout(() => {
+    show: false,
-        resolve(data);
+  },
-      }, 100);
+  {
-    });
+    field: 'isCreatSon',
+    component: 'NsInput',
+    show: false,
   },
-  formConfig: {
+  {
-    schemas: [
+    label: '节点名称',
+    field: 'pointName',
+    component: 'NsInput',
+    componentProps: {
+      placeholder: '请输入节点名称(必填)',
+    },
+    rules: [
       {
-        field: 'type',
+        required: true,
-        label: '',
+        message: '请输入节点名称',
-        component: 'NsSelect',
-        autoSubmit: true,
-        defaultValue: 1,
-        componentProps: {
-          options: [
-            { label: '碳排', value: 1 },
-            { label: '用电量', value: 2 },
-            { label: '用水量', value: 3 },
-            { label: '燃气量', value: 4 },
-            { label: '供热量', value: 5 },
-          ],
-        },
       },
+    ],
+  },
+  {
+    label: '节点类型',
+    field: 'pointType',
+    component: 'NsSelectApi',
+    componentProps: {
+      placeholder: '请选择节点类型(必填)',
+      api: dict,
+      params: { dicKey: 'COUNT_POINT' },
+      immediate: true,
+      resultField: 'data.COUNT_POINT',
+      labelField: 'cnValue',
+      valueField: 'cnValue',
+    },
+    rules: [
       {
-        field: 'name',
+        required: true,
-        label: '',
+        message: '请输入节点类型',
-        component: 'NsInput',
-        autoSubmit: true,
-        componentProps: {
-          placeholder: '请输入',
-        },
       },
     ],
   },
+];
+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 {

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

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

lib/component/form/form/form.vue

@@ -120,14 +120,8 @@
       provide('addChildForm', addChildForm);
 
       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;
       });

lib/component/tree/tree-api.vue

@@ -10,10 +10,10 @@
       </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">
         <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>
       </ns-tree>
       <!-- <a-empty v-if="!treeData?.length" /> -->

lib/saas/config/form.config.ts

@@ -11,6 +11,17 @@ export const formConfig = {
       gutter: [0, 0],
       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: {
       // layout: 'horizontal',
       class: 'ns-flex-form ns-flex-form-horizontal',