fix:联系方式

2024-07-16 15:42:49 +08:00
parent c68dc4deb7
commit d29c724920
11 changed files with 997 additions and 191 deletions
--- a/hx-ai-intelligent/src/view/alarmManagement/alarmSettings/energyAlarm/editConfigureEnergyAlarm.vue
+++ b/hx-ai-intelligent/src/view/alarmManagement/alarmSettings/energyAlarm/editConfigureEnergyAlarm.vue
@@ -229,7 +229,7 @@
        .post(device.queryDevicePage, {
          pageNum: 1,
          pageSize: 999,
-          energyType: selectedOptions[0].cnValue,
+          energyType: selectedOptions[0].dicKey,
          orgId: orgId.value,
        })
        .then((res) => {
@@ -241,7 +241,7 @@
        .post(group.queryDeviceGroupTree, {
          pageNum: 1,
          pageSize: 999,
-          energyType: selectedOptions[0].cnValue,
+          energyType: selectedOptions[0].dicKey,
          orgId: orgId.value,
        })
        .then((res) => {
@@ -502,7 +502,7 @@
  .grey-background.ant-switch .ant-switch-handle {
    background-color: grey !important;
  }
-  /deep/ .ant-form-item-label {
+  :deep(.ant-form-item-label) {
    z-index: 20;
    text-align: right;
    width: 23%;
--- a/hx-ai-intelligent/src/view/alarmManagement/alarmSettings/equipmentAlarm/editConfigureDeviceAlarm.vue
+++ b/hx-ai-intelligent/src/view/alarmManagement/alarmSettings/equipmentAlarm/editConfigureDeviceAlarm.vue
@@ -146,7 +146,7 @@
 </template>
 <script lang="ts" setup>
  import { NsMessage } from '/nerv-lib/component';
-  import { ref, toRaw } from 'vue';
+  import { ref } from 'vue';
  import type { SelectProps } from 'ant-design-vue';
  import type { ShowSearchType } from 'ant-design-vue/es/cascader';
  import { device } from '/@/api/deviceManage';
@@ -154,7 +154,6 @@

  import { http } from '/nerv-lib/util';

-  import type { Rule } from 'ant-design-vue/es/form';
  import { async } from '@antv/x6/lib/registry/marker/async';

  const visible = ref(false);
@@ -505,7 +504,7 @@
  .grey-background.ant-switch .ant-switch-handle {
    background-color: grey !important;
  }
-  /deep/ .ant-form-item-label {
+  :deep(.ant-form-item-label) {
    z-index: 20;
    text-align: right;
    width: 23%;
--- a/hx-ai-intelligent/src/view/alarmManagement/alarmSettings/notificationManagement/index.vue
+++ b/hx-ai-intelligent/src/view/alarmManagement/alarmSettings/notificationManagement/index.vue
@@ -73,7 +73,11 @@
        </a-table>
      </div>
    </div>
-    <linkPeople v-show="visibleModel" ref="linkPeoples" @handleCancel="handleCancel" />
+    <linkPeople
+      v-show="visibleModel"
+      ref="linkPeoples"
+      @handleCancel="handleCancel"
+      @handleOk="handleOk" />
  </ns-drawer>
 </template>
 <script lang="ts" setup>
@@ -98,10 +102,10 @@
    },
    {
      title: '姓名',
-      dataIndex: 'name',
+      dataIndex: 'deviceName',
      width: 80,
      fixed: 'left',
-      key: 'name',
+      key: 'deviceName',
    },
    {
      title: '性别',
@@ -127,127 +131,7 @@
    },
  ];
  const visibleModel = ref(false);
-  const dataSource = ref([
-    {
-      id: 1,
-      name: '张三1',
-      sex: '男',
-      site: '济阳站',
-      department: '济阳站/产品/产品经理',
-    },
-    {
-      id: 2,
-      name: '张三2',
-      sex: '男',
-      site: '济阳站',
-      department: '济阳站/产品/产品经理',
-    },
-    {
-      id: 3,
-      name: '张三3',
-      sex: '男',
-      site: '济阳站',
-      department: '济阳站/产品/产品经理',
-    },
-    {
-      id: 4,
-      name: '张三',
-      sex: '男',
-      site: '济阳站',
-      department: '济阳站/产品/产品经理',
-    },
-    {
-      id: 5,
-      name: '张三',
-      sex: '男',
-      site: '济阳站',
-      department: '济阳站/产品/产品经理',
-    },
-    {
-      id: 6,
-      name: '张三',
-      sex: '男',
-      site: '济阳站',
-      department: '济阳站/产品/产品经理',
-    },
-    {
-      id: 7,
-      name: '张三',
-      sex: '男',
-      site: '济阳站',
-      department: '济阳站/产品/产品经理',
-    },
-    {
-      id: 8,
-      name: '张三',
-      sex: '男',
-      site: '济阳站',
-      department: '济阳站/产品/产品经理',
-    },
-    {
-      id: 9,
-      name: '张三',
-      sex: '男',
-      site: '济阳站',
-      department: '济阳站/产品/产品经理',
-    },
-    {
-      id: 10,
-      name: '张三',
-      sex: '男',
-      site: '济阳站',
-      department: '济阳站/产品/产品经理',
-    },
-    {
-      id: 11,
-      name: '张三',
-      sex: '男',
-      site: '济阳站',
-      department: '济阳站/产品/产品经理',
-    },
-    {
-      id: 12,
-      name: '张三',
-      sex: '男',
-      site: '济阳站',
-      department: '济阳站/产品/产品经理',
-    },
-    {
-      id: 13,
-      name: '张三',
-      sex: '男',
-      site: '济阳站',
-      department: '济阳站/产品/产品经理',
-    },
-    {
-      id: 14,
-      name: '张三',
-      sex: '男',
-      site: '济阳站',
-      department: '济阳站/产品/产品经理',
-    },
-    {
-      id: 15,
-      name: '张三',
-      sex: '男',
-      site: '济阳站',
-      department: '济阳站/产品/产品经理',
-    },
-    {
-      id: 16,
-      name: '张三',
-      sex: '男',
-      site: '济阳站',
-      department: '济阳站/产品/产品经理',
-    },
-    {
-      id: 17,
-      name: '张三',
-      sex: '男',
-      site: '济阳站',
-      department: '济阳站/产品/产品经理',
-    },
-  ]);
+  const dataSource = ref([]);
  const visible = ref(false);
  const linkPeoples = ref(null);
  const handleChangePage = (current: number, pageSize: number) => {
@@ -269,12 +153,21 @@
  //点击联系人
  const chengUser = () => {
    visibleModel.value = true;
-    linkPeoples.value.getData();
+    let ids = [];
+    dataSource.value.forEach((item) => {
+      ids.push(item.id);
+    });
+    linkPeoples.value.getData({ id: ids, data: dataSource });
  };
  //取消弹窗
  const handleCancel = () => {
    visibleModel.value = false;
  };
+  //确定选择人
+  const handleOk = (data: any) => {
+    visibleModel.value = false;
+    dataSource.value = data.data;
+  };
  //表单数据
  const infoObject = ref({
    enableRules: 0,
@@ -306,10 +199,20 @@
  const toggle = (value: any) => {
    //判断 是新增 还是修改
    if (value) {
-      // infoObject.value = value;
+      // 获取接口
      infoObject.value = {
        enableRules: 0,
      };
+      // await http
+      //   .post(group.queryDeviceGroupTree, {
+      //     pageNum: 1,
+      //     pageSize: 999,
+      //     energyType: selectedOptions[0].dicKey,
+      //     orgId: orgId.value,
+      //   })
+      //   .then((res) => {
+      //     jdTreeData.value = res.data;
+      //   });
    } else {
      infoObject.value = {
        enableRules: 0,
@@ -328,6 +231,15 @@
  };
  const btnClick = () => {
    console.log(infoObject.value);
+    //发送请求数据
+    let obj = {};
+    obj.selectList = [];
+    dataSource.value.forEach((item) => {
+      obj.selectList.push({
+        people: item.id,
+      });
+    });
+    console.log(obj, '数据');
    //表单校验
    formRef.value.validate().then(() => {
      //调用接口
@@ -381,7 +293,7 @@
  .grey-background.ant-switch .ant-switch-handle {
    background-color: grey !important;
  }
-  /deep/ .ant-form-item-label {
+  :deep(.ant-form-item-label) {
    z-index: 20;
    text-align: left;
    width: 20%;
--- a/hx-ai-intelligent/src/view/alarmManagement/alarmSettings/notificationManagement/linkPeople/config.ts
+++ b/hx-ai-intelligent/src/view/alarmManagement/alarmSettings/notificationManagement/linkPeople/config.ts
@@ -0,0 +1,22 @@
+import { department } from '/@/api/origanizemanage';
+
+export const editTreeConfig = (orgId) => ({
+  selectedKeys: ['0-0'],
+  defaultExpandAll: true,
+  api: department.queryDeptTree,
+  params: { orgId },
+  resultField: 'data.orgInfos',
+  fieldNames: { title: 'orgName', key: 'orgId' },
+  formConfig: {
+    schemas: [
+      {
+        field: 'orgName',
+        component: 'NsInput',
+        autoSubmit: true,
+        componentProps: {
+          placeholder: '请输入企业名称',
+        },
+      },
+    ],
+  },
+});
--- a/hx-ai-intelligent/src/view/alarmManagement/alarmSettings/notificationManagement/linkPeople/index.vue
+++ b/hx-ai-intelligent/src/view/alarmManagement/alarmSettings/notificationManagement/linkPeople/index.vue
@@ -2,75 +2,63 @@
  <a-modal
    v-model:visible="show"
    width="1100px"
-    style="top: 50%; transform: translateY(-50%)"
+    style="top: 50%; transform: translateY(-50%); overflow-y: hidden"
    title="添加联系人"
    @ok="handleOk"
    @cancel="handleCancel">
-    <div style="width: 100%; height: 480px; display: flex">
-      <div style="width: 300px; height: 100%; overflow-y: auto; padding: 0, 12px; gap: 5px">
+    <div class="box">
+      <div class="box-left">
        <div style="width: 100%; display: flex; position: relative">
-          <div
-            style="
-              border-width: 0px;
-              position: absolute;
-              left: 0px;
-              top: 5px;
-              width: 5px;
-              height: 15px;
-              background: inherit;
-              background-color: rgba(251, 156, 67, 1);
-              border: none;
-              border-radius: 5px;
-              -moz-box-shadow: none;
-              -webkit-box-shadow: none;
-              box-shadow: none;
-            "></div>
+          <div class="border-card"></div>
          <span style="margin-left: 24px; color: #333333">联系人名单</span>
        </div>
        <img
-          style="width: 100%; margin-top: -10px"
+          style="width: 100%; height: 2px"
          src="https://files.axshare.com/gsc/4T0UQR/7e/5d/a2/7e5da2a277344db8af30521cefeb70cc/images/告警设置/u150.svg?pageId=1f58c1ba-b461-4fe8-a2b3-295f1e7b0aa0" />
        <a-input-search
          v-model:value="searchValue"
          style="margin-bottom: 8px"
          placeholder="请输入关键字" />
        <img
-          style="width: 100%; margin-top: -10px"
+          style="width: 100%; height: 2px"
          src="https://files.axshare.com/gsc/4T0UQR/7e/5d/a2/7e5da2a277344db8af30521cefeb70cc/images/告警设置/u150.svg?pageId=1f58c1ba-b461-4fe8-a2b3-295f1e7b0aa0" />
-        <a-tree
-          :expanded-keys="expandedKeys"
-          :auto-expand-parent="autoExpandParent"
-          :tree-data="gData"
-          @expand="onExpand">
-          <template #title="{ title }">
-            <span v-if="title.indexOf(searchValue) > -1">
-              {{ title.substr(0, title.indexOf(searchValue)) }}
-              <span style="color: #f50">{{ searchValue }}</span>
-              {{ title.substr(title.indexOf(searchValue) + searchValue.length) }}
-            </span>
-            <span v-else>{{ title }}</span>
-          </template>
-        </a-tree>
+        <div style="width: 100%; height: 370px; overflow-y: auto">
+          <a-tree
+            :expanded-keys="expandedKeys"
+            :auto-expand-parent="autoExpandParent"
+            :tree-data="gData"
+            @select="onSelect"
+            @expand="onExpand"
+        /></div>
+        <!-- <ns-tree-api v-bind="config" @select="treeSelect" /> -->
      </div>
-      <div style="width: calc(100% - 200px); height: 100%; padding: 0, 24px; overflow-y: auto">
+      <div class="box-right">
        <div style="width: 100%; display: flex; position: relative">
-          <div
-            style="
-              border-width: 0px;
-              position: absolute;
-              left: 0px;
-              top: 5px;
-              width: 5px;
-              height: 15px;
-              background: inherit;
-              background-color: rgba(251, 156, 67, 1);
-              border: none;
-              border-radius: 5px;
-              -moz-box-shadow: none;
-              -webkit-box-shadow: none;
-              box-shadow: none;
-            "></div>
-          <span style="margin-left: 24px; color: #333333">人员列表</span>
+          <div class="border-card"></div>
+          <span style="margin-left: 24px; color: #333333">人员列表 </span>
+          <a-input-search
+            v-model:value="name"
+            style="margin-bottom: 8px; width: 280px; position: absolute; right: 20px"
+            placeholder="请输入"
+            allowClear="true"
+            @search="onSearch" />
+        </div>
+        <img
+          style="width: 100%; height: 2px"
+          src="https://files.axshare.com/gsc/4T0UQR/7e/5d/a2/7e5da2a277344db8af30521cefeb70cc/images/告警设置/u150.svg?pageId=1f58c1ba-b461-4fe8-a2b3-295f1e7b0aa0" />
+        <div style="width: 100%; height: 450px; overflow-y: auto; padding: 12px 0">
+          <a-table
+            :row-selection="{
+              selectedRowKeys: selectedRowKey,
+              preserveSelectedRowKeys: true,
+              onChange: onSelectChange,
+            }"
+            :columns="columns"
+            :data-source="dataSource"
+            :rowKey="(record: any) => record.id"
+            :pagination="pagination"
+            :bordered="true"
+            :size="'middle'" />
        </div>
      </div>
    </div>
@@ -78,33 +66,276 @@
 </template>

 <script lang="ts">
-  import { ref } from 'vue';
+  import { ref, watch, computed } from 'vue';
  import { defineComponent } from 'vue';
+  import type { TreeProps } from 'ant-design-vue';
+  import { device } from '/@/api/deviceManage';
+  import { http } from '/nerv-lib/util';
+  // import { editTreeConfig } from './config';

+  const x = 3;
+  const y = 2;
+  const z = 1;
+  const genData: TreeProps['treeData'] = [];
+
+  const generateData = (_level: number, _preKey?: string, _tns?: TreeProps['treeData']) => {
+    const preKey = _preKey || '0';
+    const tns = _tns || genData;
+
+    const children = [];
+    for (let i = 0; i < x; i++) {
+      const key = `${preKey}-${i}`;
+      tns.push({ title: key, key });
+      if (i < y) {
+        children.push(key);
+      }
+    }
+    if (_level < 0) {
+      return tns;
+    }
+    const level = _level - 1;
+    children.forEach((key, index) => {
+      tns[index].children = [];
+      return generateData(level, key, tns[index].children);
+    });
+  };
+  generateData(z);
+
+  const dataList: TreeProps['treeData'] = [];
+  const generateList = (data: TreeProps['treeData']) => {
+    for (let i = 0; i < data.length; i++) {
+      const node = data[i];
+      const key = node.key;
+      dataList.push({ key, title: key });
+      if (node.children) {
+        generateList(node.children);
+      }
+    }
+  };
+  generateList(genData);
+
+  const getParentKey = (
+    key: string | number,
+    tree: TreeProps['treeData'],
+  ): string | number | undefined => {
+    let parentKey;
+    for (let i = 0; i < tree.length; i++) {
+      const node = tree[i];
+      if (node.children) {
+        if (node.children.some((item) => item.key === key)) {
+          parentKey = node.key;
+        } else if (getParentKey(key, node.children)) {
+          parentKey = getParentKey(key, node.children);
+        }
+      }
+    }
+    return parentKey;
+  };
  export default defineComponent({
    setup(props, { emit }) {
+      // const config = computed(() => {
+      //   return editTreeConfig(result);
+      // });
+      //组织数
+      const orgId = ref('');
+      const result = JSON.parse(sessionStorage.getItem('ORGID')!);
+      orgId.value = result;
+      const dataSource = ref([]);
+      const selectedRowKey = ref([]);
+      const selectedRow = ref([]);
+      const name = ref(null);
+      const onSearch = () => {
+        http
+          .post(device.queryDevicePage, {
+            pageNum: pagination.value.current,
+            pageSize: pagination.value.pageSize,
+            deviceName: name.value,
+            orgId: orgId.value,
+          })
+          .then((res) => {
+            dataSource.value = res.data.records;
+            pagination.value.total = res.data.total;
+          });
+      };
+      const onSelect = (selectedKeys: any, info: any) => {
+        console.log('selected', selectedKeys, info.node.dataRef);
+        pagination.value.current = 1;
+        onSearch();
+      };
+
+      const handleChangePage = (current: number, pageSize: number) => {
+        pagination.value.current = current;
+        pagination.value.pageSize = pageSize;
+        http
+          .post(device.queryDevicePage, {
+            pageNum: pagination.value.current,
+            pageSize: pagination.value.pageSize,
+            orgId: orgId.value,
+          })
+          .then((res) => {
+            dataSource.value = res.data.records;
+            pagination.value.total = res.data.total;
+          });
+        console.log(selectedRowKey.value, selectedRow.value);
+      };
+      const onSelectChange = (selectedRowKeys: any, selectedRows: any) => {
+        console.log(selectedRowKeys, selectedRows);
+        console.log(selectedRows, '数据');
+
+        selectedRowKey.value = selectedRowKeys;
+        selectedRow.value = selectedRows;
+      };
+      const pagination = ref({
+        total: 0,
+        size: 'small',
+        current: 1,
+        pageSize: 10,
+        showQuickJumper: true,
+        showLessItems: true,
+        // showSizeChanger: true,
+        showTotal: (total: number, range: any) =>
+          total && range ? `显示第${range[0]}到${range[1]}条记录,共 ${total} 条记录` : '',
+        onChange: handleChangePage,
+      });
+      const columns = [
+        {
+          title: '序号',
+          dataIndex: 'address',
+          customRender: (text: any) => {
+            return text.index + 1;
+          },
+        },
+        {
+          title: '姓名',
+          dataIndex: 'deviceName',
+        },
+        {
+          title: '性别',
+          dataIndex: 'sex',
+        },
+        {
+          title: '组织关系',
+          dataIndex: 'address',
+        },
+        {
+          title: '部门  ',
+          dataIndex: 'address',
+        },
+      ];
      const handleOk = () => {
        // 处理确定按钮的逻辑
-        console.log('点击了确定按钮');
+        emit('handleOk', { id: selectedRowKey.value, data: selectedRow.value });
+        show.value = false;
+        pagination.value.current = 1;
      };
-      const searchValue = ref<string>('');
-      const getData = () => {
+      const getData = (data: any) => {
+        selectedRow.value = data.data;
+        selectedRowKey.value = data.id;
        show.value = true;
+        http
+          .post(device.queryDevicePage, {
+            pageNum: pagination.value.current,
+            pageSize: pagination.value.pageSize,
+            orgId: orgId.value,
+          })
+          .then((res) => {
+            dataSource.value = res.data.records;
+            pagination.value.total = res.data.total;
+          });
      };
      const show = ref(false);
      const handleCancel = () => {
        // 处理取消按钮的逻辑
-        console.log('点击了取消按钮');
+        pagination.value.current = 1;
        emit('handleCancel', null);
        show.value = false;
      };
+      // 树方法
+      const expandedKeys = ref<(string | number)[]>([]);
+      const searchValue = ref<string>('');
+      const deviceName = ref<string>('');
+      const autoExpandParent = ref<boolean>(true);
+      const gData = ref<TreeProps['treeData']>(genData);
+
+      const onExpand = (keys: string[]) => {
+        expandedKeys.value = keys;
+        autoExpandParent.value = false;
+        console.log(keys, '数据');
+      };
+      watch(searchValue, (value) => {
+        console.log(gData.value, '数据');
+
+        const expanded = dataList
+          .map((item: TreeProps['treeData'][number]) => {
+            if (item.title.indexOf(value) > -1) {
+              return getParentKey(item.key, gData.value);
+            }
+            return null;
+          })
+          .filter((item, i, self) => item && self.indexOf(item) === i);
+        expandedKeys.value = expanded;
+        searchValue.value = value;
+        autoExpandParent.value = true;
+        console.log(expandedKeys.value, '数据');
+      });
      return {
+        columns,
+        name,
+        orgId,
+        // config,
+        onSearch,
+        dataSource,
+        onSelect,
+        gData,
+        onExpand,
+        selectedRow,
+        selectedRowKey,
+        autoExpandParent,
+        expandedKeys,
+        onSelectChange,
+        pagination,
        handleOk,
        show,
        getData,
        searchValue,
+        deviceName,
        handleCancel,
      };
    },
  });
 </script>
+<style scoped lang="less">
+  .border-card {
+    border-width: 0px;
+    position: absolute;
+    left: 0px;
+    top: 5px;
+    width: 5px;
+    height: 15px;
+    background: inherit;
+    background-color: rgba(251, 156, 67, 1);
+    border: none;
+    border-radius: 5px;
+    -moz-box-shadow: none;
+    -webkit-box-shadow: none;
+    box-shadow: none;
+  }
+  .box {
+    width: 100%;
+    height: 500px;
+    display: flex;
+    .box-left {
+      width: 300px;
+      height: 100%;
+      overflow-y: auto;
+      padding: 0, 12px;
+      gap: 5px;
+    }
+    .box-right {
+      width: calc(100% - 200px);
+      height: 100%;
+      padding: 0 12px;
+      overflow-y: auto;
+    }
+  }
+</style>