11

src/components/InitForm/FormItems.jsx

@@ -30,7 +30,7 @@ import {
 import ImgCrop from 'antd-img-crop';
 import { doFetch } from '@/utils/doFetch';
 import moment from 'moment';
-import { useAsyncEffect } from 'ahooks';
+import { useAsyncEffect, useRequest } from 'ahooks';
 import * as Antd from 'antd';
 import { PlusOutlined, DownOutlined, CloseOutlined, RedoOutlined } from '@ant-design/icons';
 import BraftEditor from 'braft-editor';
@@ -38,8 +38,20 @@ import EditTable from './EditTable';
 import EditorItem from './EditorItem';
 import Diyrule from './Diyrule';
 import defaultSetting from '../../../config/defaultSettings';
-
-const { Image, Form, Upload, Col, Pagination, Avatar, Dropdown, Menu, Tabs, message } = Antd;
+const {
+  Image,
+  Form,
+  Upload,
+  Col,
+  Pagination,
+  Avatar,
+  Dropdown,
+  Menu,
+  Tabs,
+  message,
+  AutoComplete,
+  Row,
+} = Antd;
 const AntdCheckBox = Antd.Checkbox;
 
 const FormItems = {
@@ -76,6 +88,7 @@ const FormItems = {
   FormSelectList,
   CheckboxItem,
   RadioItem,
+  MyAutoComplete,
 };
 function upperCase(str) {
   const newStr = str.slice(0, 1).toUpperCase() + str.slice(1);
@@ -190,6 +203,60 @@ function Input({ item, colProps }) {
     </>
   );
 }
+
+function MyAutoComplete({ item, colProps, formRef }) {
+  const [options, setoptions] = useState([]);
+  const [username, setusername] = useState();
+  const { data, run, runAsync } = useRequest(
+    async () => {
+      let res = await doFetch({
+        url: '/auth/sysUser/queryLikeIotUsername',
+        params: { username },
+      });
+      return res?.data?.dataList;
+    },
+    {
+      manual: true,
+    },
+  );
+  useEffect(() => {
+    console.log(username);
+    runAsync()
+      .then((data) => {
+        const options = data?.map((it) => ({
+          ...it,
+          label: `${it?.username}-${it?.fullName}`,
+          value: `${it?.username}-${it?.fullName}`,
+        }));
+        setoptions(options);
+      })
+      .catch((error) => {
+        console.log(error);
+      });
+  }, [username]);
+  let col = item.colProps ?? colProps;
+  let curkey = item.key ?? item.dataIndex;
+  return (
+    <Col span={12}>
+      <ProForm.Item name={curkey} label={item.title} {...item.formItemProps}>
+        <AutoComplete
+          formRef={formRef}
+          allowClear={true}
+          style={{ width: '100%' }}
+          fieldProps={item?.fieldProps}
+          disabled={item?.disabled}
+          colProps={item.colProps ?? colProps}
+          onSearch={(e) => {
+            setusername(e);
+          }}
+          options={options}
+          onSelect={item?.onSelect}
+        />
+      </ProForm.Item>
+    </Col>
+  );
+}
+
 //pwd
 function Password({ item, colProps }) {
   return (

src/pages/setting/users/columns.js

@@ -2,12 +2,11 @@ import { doFetch } from '@/utils/doFetch';
 import { Image } from 'antd';
 import fieldsDetail from '@/utils/fieldsDetail';
 import { useState, useEffect } from 'react';
-function getcolumns(setDrawer, usermsg) {
-  const options = usermsg?.map((it) => ({
-    label: `${it?.username}-${it?.fullName}`,
-    value: it?.id,
-  }));
-  console.log(options);
+function getcolumns(ifs, formRef) {
+  // const options = usermsg?.map((it) => ({
+  //   label: `${it?.username}-${it?.fullName}`,
+  //   value: it?.id,
+  // }));
   return [
     {
       title: '用户名',
@@ -15,9 +14,24 @@ function getcolumns(setDrawer, usermsg) {
       width: 120,
       key: 'username',
       formItemProps: { rules: [{ required: true, message: '此项为必填项' }] },
-      valueType: 'select',
-      options,
+      valueType: 'MyAutoComplete',
+      onSelect: (value, option) => {
+        formRef.current.setFieldValue('telephone', option?.phone);
+        formRef.current.setFieldValue('fullName', option?.fullName);
+        formRef.current.setFieldValue('mailNo', option?.mailbox);
+        formRef.current.setFieldValue('status', option?.enabled);
+      },
+      disabled: ifs,
     },
+    // {
+    //   title: '用户名',
+    //   dataIndex: 'username',
+    //   width: 120,
+    //   key: 'username',
+    //   formItemProps: { rules: [{ required: true, message: '此项为必填项' }] },
+    //   valueType: 'select',
+    //   options,
+    // },
     {
       title: '姓名',
       dataIndex: 'fullName',

src/pages/setting/users/index.jsx

@@ -2,7 +2,7 @@
  * @Author: Li Hanlin
  * @Date: 2022-11-09 14:44:44
  * @Last Modified by: Li Hanlin
- * @Last Modified time: 2022-12-16 16:57:18
+ * @Last Modified time: 2022-12-16 20:20:17
  */
 
 import * as React from 'react';
@@ -17,18 +17,12 @@ import { message, AutoComplete } from 'antd';
 import ExtendField from '@/components/ExtendField';
 import { useModel } from 'umi';
 import { useRequest } from 'ahooks';
+import { indexOf } from 'lodash';
 
 function User(props) {
   const { initialState, loading, error, refresh, setInitialState } = useModel('@@initialState');
   const [username, setusername] = useState(null);
-  const { data } = useRequest(async () => {
-    let res = await doFetch({
-      url: '/auth/sysUser/queryLikeIotUsername',
-      params: { username: initialState?.currentUser?.username },
-    });
-    return res?.data?.dataList;
-  });
-  console.log(data);
+
   const actionRef = useRef(),
     formRef = useRef();
   const [drawer, setDrawer] = useState({
@@ -149,14 +143,14 @@ function User(props) {
   };
 
   const columns = useMemo(() => {
-    let defcolumn = getcolumns(setDrawer, data);
+    let defcolumn = getcolumns(setDrawer, formRef);
     return defcolumn.concat({
       title: '操作',
       valueType: 'option',
       width: 150,
       render: (text, row, _, action) => [edit(text, row, _, action), remove(text, row, _, action)],
     });
-  }, [data]);
+  }, []);
 
   function selectType(type) {
     switch (type) {
@@ -182,6 +176,7 @@ function User(props) {
               }
               let params = {
                 ...vals,
+                username: vals?.username.slice(0, vals?.username?.indexOf('-')),
                 id: drawer?.title == '编辑' ? drawer?.item?.id : '',
                 userCharReqList,
               };
@@ -205,16 +200,12 @@ function User(props) {
               }
             }}
             defaultFormValue={drawer.item}
-            onValuesChange={(changedValues, allValues) => {
-              if (changedValues['username']) {
-                let item = data?.filter((it) => {
-                  return it?.id == ;
-                });
-                console.log(item);
-                console.log(changedValues, allValues);
-                formRef.current.setFieldValue('telephone', '123123');
-              }
-            }}
+            // onValuesChange={(changedValues, allValues) => {
+            //   console.log(changedValues, allValues);
+            //   if (changedValues['username']) {
+            //     console.log(changedValues, allValues);
+            //   }
+            // }}
           />
         );
 
@@ -224,7 +215,7 @@ function User(props) {
             setDrawer={setDrawer}
             drawer={drawer}
             actionRef={actionRef}
-            columns={columns}
+            columns={getcolumns(true, formRef)}
             formId={'1'}
             urlParams={urlParams}
             onFinish={async (vals) => {