@qmlight/web-platform-components 1.0.0

package/SearchAssistanceSelect/src/SearchAssistanceComponent/AdvancedSearch/searchboard.tsx

@@ -0,0 +1,359 @@
+/*
+ * @Author: 谭冬洋
+ * @Date: 2024-08-14 10:24:33
+ * @LastEditors: 谭冬洋
+ * @LastEditTime: 2024-08-26 13:56:46
+ * @FilePath: \faw-component\src\modules\AdvancedSearch\searchboard.tsx
+ */
+import React, { useEffect, useRef, useState, forwardRef, useImperativeHandle } from 'react';
+import PropTypes from 'prop-types';
+import { QmForm, QmSpace, QmButton } from 'dcp-design-react';
+import type { FormRef, IFormItem } from 'dcp-design-react/lib/form';
+import SearchSelect from '../index';
+import { getRoleList, getOrgAndDept, getOrgsByConditions } from '../api/tabList';
+import './index.less';
+import { getUserInfo } from '@/utils/cookies';
+import { getOrgTypeList } from './api';
+
+const SearchBoard: React.FC<any> = forwardRef(
+  (
+    {
+      type = 'default', // 高级搜索的类型
+      value = '', // 外部筛选框数据
+      onSearch = () => {}, // 筛选
+      changeValue = () => {}, // 改变form值
+      onClose = () => {}, // 关闭Popover
+    },
+    ref
+  ) => {
+    useImperativeHandle(ref, () => ({
+      getFormValue: () => formRef.current?.GET_FIELDS_VALUE(),
+    }));
+
+    useEffect(() => {
+      setFilters(createFormList());
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [type]);
+    const createFormList = (): Array<IFormItem> => {
+      const formData = formRef.current?.GET_FIELDS_VALUE() || {};
+      switch (type) {
+        case 'branch':
+          //分部
+          return [
+            // {
+            //   type: 'INPUT',
+            //   label: '分部名称',
+            //   fieldName: 'name',
+            //   onChange: (value) => {
+            //     changeValue(value);
+            //   },
+            // },
+            // {
+            //   type: 'INPUT',
+            //   label: '上级分部',
+            //   fieldName: 'h',
+            //   render: (formItem) => {
+            //     return (
+            //       <InputDemo
+            //         value={formData[formItem.fieldName]}
+            //         modalInfo={{ title: '分部', fieldName: formItem.fieldName }}
+            //         changeFormData={changeFormData}
+            //       />
+            //     );
+            //   },
+            // },
+            {
+              type: 'SELECT',
+              label: '组织维度',
+              fieldName: 'orgTypeCode',
+              allowClear: false,
+              options: {
+                itemList: [
+                  { text: '启明信息技术股份有限公司', value: '0' },
+                  { text: '客户维度', value: '1' },
+                  { text: '公交交换维度', value: '2' },
+                ],
+              },
+            },
+          ];
+        case 'dept':
+          //分部
+          return [
+            // {
+            //   type: 'INPUT',
+            //   label: '部门名称',
+            //   fieldName: 'name',
+            //   onChange: (value) => {
+            //     changeValue(value);
+            //   },
+            // },
+            // {
+            //   type: 'INPUT',
+            //   label: '分部',
+            //   fieldName: 'e',
+            //   render: (formItem) => {
+            //     return (
+            //       <InputDemo
+            //         value={formData[formItem.fieldName]}
+            //         modalInfo={{ title: '多分部', fieldName: formItem.fieldName }}
+            //         changeFormData={changeFormData}
+            //       />
+            //     );
+            //   },
+            // },
+            // {
+            //   type: 'INPUT',
+            //   label: '部门编号',
+            //   fieldName: 'code',
+            // },
+            // {
+            //   type: 'INPUT',
+            //   label: '上级分部',
+            //   fieldName: 'h',
+            //   render: (formItem) => {
+            //     return (
+            //       <InputDemo
+            //         value={formData[formItem.fieldName]}
+            //         modalInfo={{ title: '分部', fieldName: formItem.fieldName }}
+            //         changeFormData={changeFormData}
+            //       />
+            //     );
+            //   },
+            // },
+            {
+              type: 'SELECT',
+              label: '组织维度',
+              fieldName: 'orgTypeCode',
+              allowClear: false,
+              options: {
+                itemList: [
+                  { text: '启明信息技术股份有限公司', value: '0' },
+                  { text: '客户维度', value: '1' },
+                  { text: '公交交换维度', value: '2' },
+                ],
+              },
+            },
+          ];
+        case 'role':
+          //分部
+          return [
+            {
+              type: 'INPUT',
+              label: '名称',
+              fieldName: 'name',
+              onChange: (value) => {
+                changeValue(value);
+              },
+            },
+            // {
+            //   type: 'INPUT',
+            //   label: '说明',
+            //   fieldName: 'e',
+            // },
+          ];
+        case 'org':
+          //分部
+          return [
+            {
+              type: 'INPUT',
+              label: '组织名称',
+              fieldName: 'name',
+              onChange: (value) => {
+                changeValue(value);
+              },
+            },
+            {
+              type: 'SELECT',
+              label: '组织维度',
+              fieldName: 'orgTypeCode',
+              allowClear: false,
+            },
+            {
+              type: 'INPUT',
+              label: '组织编码',
+              fieldName: 'code',
+              allowClear: false,
+            },
+            {
+              type: 'INPUT',
+              label: '上级组织',
+              fieldName: 'deptId',
+              render: (option, vm) => {
+                return (
+                  <SearchSelect
+                    $$form={vm}
+                    option={option}
+                    fetchOptions={getOrgsByConditions}
+                    params={{}}
+                    items={[
+                      {
+                        label: '组织结构',
+                        key: '4',
+                        type: 'org',
+                      },
+                    ]}
+                    type={'org'}
+                  />
+                );
+              },
+            },
+          ];
+        default:
+          // 默认
+          return [
+            {
+              type: 'INPUT',
+              label: '姓名',
+              fieldName: 'name',
+              onChange: (value) => {
+                changeValue(value);
+              },
+            },
+            {
+              type: 'SELECT',
+              label: '组织维度',
+              fieldName: 'orgTypeCode',
+              allowClear: false,
+            },
+            {
+              type: 'SELECT',
+              label: '状态',
+              fieldName: 'deleted',
+              allowClear: false,
+              options: {
+                itemList: [
+                  { text: '在职', value: 0 },
+                  { text: '其他', value: 1 },
+                  // { text: '全部', value: '0' },
+                  // { text: '在职', value: '1' },
+                  // { text: '试用', value: '2' },
+                  // { text: '正式', value: '3' },
+                  // { text: '临时', value: '4' },
+                  // { text: '试用延期', value: '5' },
+                  // { text: '解聘', value: '6' },
+                  // { text: '离职', value: '7' },
+                  // { text: '退休', value: '8' },
+                  // { text: '无效', value: '9' },
+                ],
+              },
+            },
+
+            {
+              type: 'INPUT',
+              label: '部门',
+              fieldName: 'orgIdList',
+              render: (option, vm) => {
+                return (
+                  <SearchSelect
+                    type={''}
+                    $$form={vm}
+                    option={option}
+                    mode={'multiple'}
+                    fetchOptions={getOrgAndDept}
+                    params={{}}
+                    items={[
+                      {
+                        label: '组织结构',
+                        key: '4',
+                        type: 'dept',
+                      },
+                    ]}
+                  />
+                );
+              },
+            },
+            {
+              type: 'INPUT',
+              label: '岗位',
+              fieldName: 'jobName',
+            },
+            {
+              type: 'INPUT',
+              label: '角色',
+              fieldName: 'roleId',
+              render: (option, vm) => {
+                return (
+                  <SearchSelect
+                    type={''}
+                    fetchOptions={getRoleList}
+                    params={{ loginUserId: getUserInfo().id }}
+                    items={[
+                      {
+                        label: '角色',
+                        key: '6',
+                        type: 'role',
+                      },
+                    ]}
+                    $$form={vm}
+                    option={option}
+                  />
+                );
+              },
+            },
+          ];
+      }
+    };
+
+    const formRef = useRef<FormRef>(null);
+    const [filters, setFilters] = useState<Array<IFormItem>>(createFormList());
+    useEffect(() => {
+      formRef?.current?.SET_FIELDS_VALUE({ name: value });
+    }, [value]);
+
+    const fetchData = async () => {
+      const res = await getOrgTypeList({ currentPage: 1, pageSize: 50 });
+      if (res.code === 200) {
+        const data = res.data?.list.map((i) => ({
+          text: i.name,
+          value: i.code,
+        }));
+        formRef.current?.SET_FORM_ITEM('orgTypeCode', { 'options.itemList': data }, true);
+        if (data && data.length > 0) {
+          formRef.current?.SET_FIELDS_VALUE({ orgTypeCode: data[0].value });
+        }
+      }
+    };
+    useEffect(() => {
+      if (type !== 'role') {
+        fetchData();
+      }
+      if (type === 'default') {
+        formRef.current?.SET_FIELDS_VALUE({ deleted: 0 });
+      }
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+
+    // 重置form
+    const resetForm = () => {
+      formRef.current!.RESET_FORM();
+      changeValue(undefined);
+    };
+
+    return (
+      <>
+        <div style={{ padding: '20px 0 60px' }} className="tdy_popover">
+          <QmForm items={filters} ref={formRef} fieldsChange={(items) => setFilters(items)} />
+          <QmSpace className={`fixed-footer`}>
+            <QmButton type="primary" click={onSearch}>
+              搜索
+            </QmButton>
+
+            <QmButton onClick={resetForm}>重置</QmButton>
+            <QmButton onClick={onClose}>取消</QmButton>
+          </QmSpace>
+        </div>
+      </>
+    );
+  }
+);
+
+SearchBoard.displayName = 'SearchBoard';
+
+SearchBoard.propTypes = {
+  value: PropTypes.string,
+  onSearch: PropTypes.func,
+  changeValue: PropTypes.func,
+  onClose: PropTypes.func,
+};
+
+export default SearchBoard;

package/SearchAssistanceSelect/src/SearchAssistanceComponent/api/server.js

@@ -0,0 +1,15 @@
+/*
+ * @Author: 焦质晔
+ * @Date: 2021-07-20 16:37:14
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2022-12-10 22:37:39
+ */
+import env from '@/config/envMaps';
+const { prefix } = env;
+
+export default {
+  QFC_BASE: `${prefix}/dcp-base-user`,
+  QFC_PUBLIC: `${prefix}/dcp-base-public`,
+  QFC_AUTH: `${prefix}/dcp-base-auth`,
+  GWGL_SERVICE: `/gwgl-service`,
+};

package/SearchAssistanceSelect/src/SearchAssistanceComponent/api/tabList/index.js

@@ -0,0 +1,55 @@
+import axios from '@/api/fetch';
+import SERVER from '../server';
+
+export const getMySubordinates = (params) => {
+  return axios.post(`${SERVER.QFC_BASE}/lowcode/getMySubordinates`, params);
+};
+export const getDeptUsers = (params) => {
+  return axios.post(`${SERVER.QFC_BASE}/lowcode/getDeptUsers`, params);
+};
+export const getOrgsByConditions = (params) => {
+  return axios.post(`${SERVER.QFC_BASE}/lowcode/getOrgsByConditions`, params);
+};
+export const recentUserPage = (params) => {
+  return axios.post(`${SERVER.QFC_BASE}/custom/getCommonGroup`, params);
+};
+
+export const getUsersByConditions = (params) => {
+  return axios.post(`${SERVER.QFC_BASE}/lowcode/getUsersByConditions`, params);
+};
+
+// 查询角色
+export const getRoleList = (params) => {
+  return axios.post(`${SERVER.QFC_AUTH}/role/list`, params);
+};
+// 查询部门
+export const getOrgAndDept = (params) => {
+  return axios.post(`${SERVER.QFC_BASE}/lowcode/getOrgAndDept`, {
+    orgName: params.name,
+  });
+};
+//同部门选择更新人员
+export const updateRecentUser = (params) => {
+  return axios.post(`${SERVER.QFC_BASE}/lowcode/updateRecentUser`, params);
+};
+
+// 查询自定义组
+export const getAllCustomGroups = (params) => {
+  return axios.post(`${SERVER.QFC_BASE}/custom/getAllCustomGroups`, params);
+};
+// 新增自定义组
+export const createCustomGroups = (params) => {
+  return axios.post(`${SERVER.QFC_BASE}/custom/createCustomGroup`, params);
+};
+// 查询组内人员
+export const getUsersByCustomGroup = (params) => {
+  return axios.post(`${SERVER.QFC_BASE}/custom/getUsersByCustomGroup`, params);
+};
+// 删除自定义组
+export const deleteCustomGroup = (params) => {
+  return axios.post(`${SERVER.QFC_BASE}/custom/deleteCustomGroup`, params);
+};
+// 更新自定义组
+export const updateCustomGroup = (params) => {
+  return axios.post(`${SERVER.QFC_BASE}/custom/updateCustomGroup`, params);
+};

package/SearchAssistanceSelect/src/SearchAssistanceComponent/api/treeData/index.js

@@ -0,0 +1,26 @@
+import axios from '@/api/fetch';
+import SERVER from '../server';
+
+// 执行登录
+export const getTreeDataList = (params) => {
+  return axios.post(`${SERVER.QFC_BASE}/org/getTreeForNeed`, params);
+};
+
+// 查询组织
+export const getOrgTypeList = (params) => {
+  return axios.post(`${SERVER.QFC_BASE}/orgtype/page`, params);
+};
+// 查询人员
+export const getOrgPerson = (params) => {
+  return axios.post(`${SERVER.QFC_BASE}/staff/getStaffOfOrgNew`, params);
+};
+
+// 查询组织部门
+export const getUsersUnderOrg = (params) => {
+  return axios.post(`${SERVER.QFC_BASE}/lowcode/getUsersUnderOrg`, params);
+};
+
+// 查询收文发文单位
+export const getDeptTreeNode = (params) => {
+  return axios.post(`${SERVER.GWGL_SERVICE}/api/v1/organization-and-user/getDeptTreeNode`, params);
+};

package/SearchAssistanceSelect/src/SearchAssistanceComponent/component/customNode/index.tsx

@@ -0,0 +1,62 @@
+import React, { useEffect, useState } from 'react';
+import TabList from '../tabList';
+import './style.less';
+
+const CustomNode = (props) => {
+  const [data, setData] = useState([]);
+  const [itemKeys, setItemKeys] = useState<any[]>([]);
+  const {
+    customData,
+    mode,
+    selectedKeys,
+    targetKeys,
+    onDataChange,
+    onValueChange,
+    onItemSelect,
+    onDoubleClickChange,
+  } = props;
+  const [dataSource, setDataSource] = useState<any[]>([]);
+  useEffect(() => {
+    if (customData?.length) {
+      const list = customData.map((item) => {
+        return {
+          ...item,
+          title: item.name,
+          key: item.id,
+          value: item.id,
+          orgName: (item.centerMainJobList && item.centerMainJobList[0]?.orgName) || '',
+          departmentName: (item.centerMainJobList && item.centerMainJobList[0]?.deptName) || '',
+          deptName: (item.centerMainJobList && item.centerMainJobList[0]?.deptName) || '',
+        };
+      });
+      setDataSource(list);
+      onDataChange && onDataChange(list);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [customData]);
+  useEffect(() => {
+    setItemKeys(selectedKeys || []);
+  }, [selectedKeys]);
+  const itemSelect = (value, checked) => {
+    console.log(value);
+    if (mode === 'multiple') {
+      onItemSelect && onItemSelect(value, checked);
+      return;
+    }
+    setItemKeys([value]);
+    const field = dataSource.find((item) => item.id === value);
+    onValueChange && onValueChange(field);
+  };
+  return (
+    <div className="custom-node-page">
+      <TabList
+        onDoubleClickChange={onDoubleClickChange}
+        onItemSelect={itemSelect}
+        selectedKeys={itemKeys}
+        dataSource={dataSource.filter((item) => !targetKeys.includes(item.id))}
+      />
+    </div>
+  );
+};
+
+export default CustomNode;

package/SearchAssistanceSelect/src/SearchAssistanceComponent/component/customNode/style.less

@@ -0,0 +1,9 @@
+.custom-node-page{
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  .tab-list-page{
+    flex: 1;
+    overflow-y: auto;
+  }
+}