fix: modbus设备页

src/pages/device/Instance/Detail/Modbus/channelList.tsx

@@ -1,8 +1,45 @@
-import { FormItem, Input, ArrayTable, Editable, FormButtonGroup, Submit } from '@formily/antd';
-import { createForm } from '@formily/core';
+import {
+  FormItem,
+  Input,
+  ArrayTable,
+  Editable,
+  FormButtonGroup,
+  Submit,
+  Select,
+  NumberPicker,
+} from '@formily/antd';
+import { createForm, Field, onFieldReact, FormPath } from '@formily/core';
 import { FormProvider, createSchemaField } from '@formily/react';
+import { Button, Badge } from 'antd';
 
 const Render = (props: any) => <>{props.value}</>;
+const ActionButton = () => {
+  const record = ArrayTable.useRecord?.();
+  const index = ArrayTable.useIndex?.();
+  return (
+    <Button
+      onClick={() => {
+        console.log(record(index));
+      }}
+    >
+      启用
+    </Button>
+  );
+};
+const StatusRender = (props: any) => {
+  switch (props.value?.value) {
+    case 'enabled':
+      return <Badge status="success" text={props.value?.text} />;
+    case 'disabled':
+      return <Badge status="error" text={props.value?.text} />;
+    case 'connect':
+      return <Badge status="success" text={props.value?.text} />;
+    case 'disconnect':
+      return <Badge status="warning" text={props.value?.text} />;
+    default:
+      return <></>;
+  }
+};
 
 const SchemaField = createSchemaField({
   components: {
@@ -10,13 +47,53 @@ const SchemaField = createSchemaField({
     Editable,
     Input,
     ArrayTable,
+    Select,
+    NumberPicker,
     Render,
+    ActionButton,
+    StatusRender,
   },
 });
 
 const form = createForm({
   initialValues: {
-    array: [{ a2: '111', a1: '1111', a3: '1111' }],
+    array: [
+      {
+        // a2: '111',
+        a1: 'wendu',
+        // a3: '1111',
+        id: '0718',
+        state: {
+          text: '正常',
+          value: 'enabled',
+        },
+      },
+      {
+        // a2: '2',
+        a1: 'sudu',
+        // a3: '3',
+        id: '0718-1',
+        state: {
+          text: '禁用',
+          value: 'disabled',
+        },
+      },
+    ],
+  },
+  effects: () => {
+    onFieldReact('array.*.a2', (field, f) => {
+      const value = (field as Field).value;
+      const path = FormPath.transform(field.path, /\d+/, (index) => `array.${parseInt(index)}.a3`);
+      console.log(value);
+      f.setFieldState(path, (state) => {
+        if (value) {
+          state.required = true;
+          form.validate();
+        } else {
+          state.required = false;
+        }
+      });
+    });
   },
 });
 
@@ -34,48 +111,163 @@ const schema = {
       items: {
         type: 'object',
         properties: {
-          column3: {
+          column1: {
             type: 'void',
             'x-component': 'ArrayTable.Column',
             'x-component-props': { width: 120, title: '属性' },
             properties: {
               a1: {
                 type: 'string',
-                // 'x-decorator': 'Editable',
                 'x-component': 'Render',
-                'x-component-props': {},
               },
             },
           },
-          column4: {
+          column2: {
             type: 'void',
             'x-component': 'ArrayTable.Column',
-            'x-component-props': { width: 200, title: 'A2' },
+            'x-component-props': { width: 200, title: '通道' },
             properties: {
               a2: {
                 type: 'string',
                 'x-decorator': 'FormItem',
-                'x-component': 'Input',
+                'x-component': 'Select',
+                'x-component-props': {
+                  placeholder: '请选择',
+                  showSearch: true,
+                  allowClear: true,
+                  showArrow: true,
+                  filterOption: (input: string, option: any) =>
+                    option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0,
+                  onBlur: () => {
+                    const value = form.validate();
+                    console.log(value.array?.value);
+                  },
+                },
+                enum: [
+                  {
+                    label: '通道1',
+                    value: 'channel1',
+                  },
+                  {
+                    label: '通道2',
+                    value: 'channel2',
+                  },
+                ],
               },
             },
           },
-          column5: {
+          column3: {
             type: 'void',
             'x-component': 'ArrayTable.Column',
-            'x-component-props': { width: 200, title: 'A3' },
+            'x-component-props': { width: 200, title: '数据点名称' },
             properties: {
               a3: {
                 type: 'string',
                 'x-decorator': 'FormItem',
-                'x-component': 'Input',
+                'x-component': 'Select',
+                'x-validator': {
+                  triggerType: 'onBlur',
+                },
+                'x-component-props': {
+                  placeholder: '请选择',
+                  showSearch: true,
+                  allowClear: true,
+                  showArrow: true,
+                  filterOption: (input: string, option: any) =>
+                    option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0,
+                },
+                enum: [
+                  {
+                    label: '名称1',
+                    value: 'name1',
+                  },
+                  {
+                    label: '名称2',
+                    value: 'name2',
+                  },
+                ],
+              },
+            },
+          },
+          column4: {
+            type: 'void',
+            'x-component': 'ArrayTable.Column',
+            'x-component-props': { width: 200, title: '数据点类型' },
+            properties: {
+              a4: {
+                type: 'string',
+                'x-decorator': 'FormItem',
+                'x-component': 'Select',
+                'x-component-props': {
+                  placeholder: '请选择',
+                  showSearch: true,
+                  allowClear: true,
+                  showArrow: true,
+                  filterOption: (input: string, option: any) =>
+                    option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0,
+                },
+                enum: [
+                  {
+                    label: '类型1',
+                    value: 'type1',
+                  },
+                  {
+                    label: '类型2',
+                    value: 'type2',
+                  },
+                ],
+              },
+            },
+          },
+          column5: {
+            type: 'void',
+            'x-component': 'ArrayTable.Column',
+            'x-component-props': { width: 200, title: '缩放因子' },
+            properties: {
+              a5: {
+                type: 'string',
+                default: 1,
+                'x-decorator': 'FormItem',
+                'x-component': 'NumberPicker',
+                'x-component-props': {
+                  min: 1,
+                },
               },
             },
           },
           column6: {
             type: 'void',
             'x-component': 'ArrayTable.Column',
+            'x-component-props': { width: 200, title: '数据点说明' },
+            properties: {
+              a6: {
+                type: 'string',
+                'x-decorator': 'FormItem',
+                'x-component': 'Render',
+              },
+            },
+          },
+          column7: {
+            type: 'void',
+            'x-component': 'ArrayTable.Column',
             'x-component-props': {
-              title: 'Operations',
+              width: 200,
+              title: '状态',
+              sorter: (a: any, b: any) => a.state.value.length - b.state.value.length,
+            },
+            properties: {
+              state: {
+                type: 'string',
+                'x-decorator': 'FormItem',
+                'x-component': 'StatusRender',
+              },
+            },
+          },
+          column8: {
+            type: 'void',
+            'x-component': 'ArrayTable.Column',
+            'x-component-props': {
+              title: '操作',
               dataIndex: 'operations',
               width: 100,
               fixed: 'right',
@@ -87,15 +279,7 @@ const schema = {
                 properties: {
                   remove: {
                     type: 'void',
-                    'x-component': 'ArrayTable.Remove',
-                  },
-                  moveDown: {
-                    type: 'void',
-                    'x-component': 'ArrayTable.MoveDown',
-                  },
-                  moveUp: {
-                    type: 'void',
-                    'x-component': 'ArrayTable.MoveUp',
+                    'x-component': 'ActionButton',
                   },
                 },
               },
@@ -103,13 +287,6 @@ const schema = {
           },
         },
       },
-      properties: {
-        add: {
-          type: 'void',
-          'x-component': 'ArrayTable.Addition',
-          title: '添加条目',
-        },
-      },
     },
   },
 };

src/pages/user/Login/index.tsx

@@ -18,6 +18,7 @@ import Footer from '@/components/Footer';
 const Login: React.FC = () => {
   const [captcha, setCaptcha] = useState<{ key?: string; base64?: string }>({});
   const [bindings, setBindings] = useState<any>([]);
+  const [basis, setBasis] = useState<any>({});
   const { initialState, setInitialState } = useModel('@@initialState');
   const intl = useIntl();
 
@@ -77,19 +78,19 @@ const Login: React.FC = () => {
   useEffect(getCode, []);
 
   useEffect(() => {
-    Service.settingDetail('basis').then(res=>{
-      if(res.status===200){
-        console.log(res.result)
-      }
-    })
-  }, [])
-  useEffect(() => {
     localStorage.clear();
     Service.bindInfo().then((res) => {
       if (res.status === 200) {
         setBindings(res.result);
       }
     });
+    Service.settingDetail('basis').then((res) => {
+      if (res.status === 200) {
+        console.log(res.result);
+        const ico: any = document.querySelector('link[rel="icon"]');
+        ico.href = res.result.ico + setBasis(res.result);
+      }
+    });
   }, []);
 
   const SchemaField = createSchemaField({
@@ -251,7 +252,10 @@ const Login: React.FC = () => {
           </div>
         </div>
         <div className={styles.right}>
-          <img src={require('/public/images/login.png')} style={{width:'100%',height:'100%'}}/>
+          <img
+            src={basis.backgroud || require('/public/images/login.png')}
+            style={{ width: '100%', height: '100%' }}
+          />
           {/*<div className={styles.systemName}>{SystemConst.SYSTEM_NAME}</div>*/}
           {/*<div className={styles.systemDesc}>OPEN SOURCE INTERNET OF THINGS BASIC PLATFORM</div>*/}
         </div>