fix(icc public login)

src/components/form/form.less

@@ -0,0 +1,24 @@
+.form_style1 {
+  display: grid;
+  grid-template-columns: repeat(1, 1fr);
+  gap: 10px;
+}
+
+.form_style2 {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  gap: 10px;
+}
+
+
+.form_style3 {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 10px;
+}
+
+.form_style4 {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 10px;
+}

src/components/form/interface.ts

@@ -44,6 +44,8 @@ export interface SimpleFormData {
     createCallback?: Function
     children?: React.ReactElement
     childrenPosi?: boolean
+    rowStyle?: string,
+    showLable?: boolean,
 }
 
 
@@ -63,13 +65,13 @@ export interface UploadFileProps {
     onChange?: (value: Array<UploadFileEx>) => void;
     maxCount?: number;
     id?: string;
-  }
-  
-  export interface UploadFileEx extends UploadFile {
+}
+
+export interface UploadFileEx extends UploadFile {
     systemImageId?: number;
     bannerName?: string;
     file_name?: string;
     file_url?: string;
     redictUrl?: string;
     id?: number;
-  }
+}

src/components/form/simple_form.tsx

@@ -5,6 +5,7 @@ import { FormSelect } from "./select";
 import AliUpload from "../ali_upload";
 import MyEditor from "../edittor";
 import MapFrom from "../map/MapFrom";
+import "./form.less"
 // import VideoSelect from "../video_select";
 const { TextArea } = Input;
 const SimpleForm = (props: SimpleFormData) => {
@@ -22,26 +23,27 @@ const SimpleForm = (props: SimpleFormData) => {
     <Form
       name={props.formName}
       ref={props.formRef}
+      className={props.rowStyle}
       autoComplete="on"
       form={form}
+
       labelCol={{ span: props.span ?? 4 }}
       wrapperCol={{ span: props.colProps }}
       layout="horizontal"
       initialValues={{ menubar: true }}
       onFinish={onFinish}
     >
-      {props.childrenPosi ? null : props.children ?? props.children}
       {props.formDatas.map((v) => {
         switch (v.type) {
           case FormType.input:
             return (
               <Form.Item
                 key={v.label}
-                label={v.label}
+                label={props.showLable ?? v.label}
                 name={v.name}
                 rules={v.rules}
               >
-                <Input />
+                <Input placeholder={"请输入"+v.label} />
               </Form.Item>
             );
           case FormType.inputNumber:
@@ -195,7 +197,7 @@ const SimpleForm = (props: SimpleFormData) => {
             );
         }
       })}
-      {props.childrenPosi ? props.children ?? props.children : null}
+      { props.children ?? props.children}
     </Form>
   );
 };

src/pages/user/user.less

@@ -1,8 +1,14 @@
-.contentBox{
-    overflow-y: auto;
+.contentBox {
+  overflow-y: auto;
+  height: 100%;
+  .searchBox {
+    display: flex;
+    align-items: start;
+    justify-content: space-between;
+  }
+
+  .tableName {
     height: 100%;
-    .tableName{
-        height: 100%;
-        overflow-y: auto;
-    }
-}
+    overflow-y: auto;
+  }
+}

src/pages/user/user.tsx

@@ -4,7 +4,7 @@ import BTable from "@/components/b_table";
 import { useEffect, useState } from "react";
 import { Store } from "antd/lib/form/interface";
 import React from "react";
-import { columns, defaultConfig } from "./user_config";
+import { columns, defaultConfig, searchConfig } from "./user_config";
 import "./user.less";
 import SimpleForm from "@/components/form/simple_form";
 
@@ -12,6 +12,7 @@ const User = (props: Store) => {
   const { usrStore } = props;
   const [isModalOpen, setIsModalOpen] = useState<boolean>(false);
   const formRef = React.useRef<FormInstance>(null);
+  const searchFormRef = React.useRef<FormInstance>(null);
   const [userId, setId] = useState<Number | null>(null);
   const [record, setRecord] = useState<any>(null);
 
@@ -23,9 +24,28 @@ const User = (props: Store) => {
   return (
     <div className="contentBox">
       <Space direction="vertical" size="middle" style={{ display: "flex" }}>
-        <Button type="default" onClick={() => setIsModalOpen(true)}>
-          添加用户
-        </Button>
+        <div className="searchBox">
+          <Button type="default" onClick={() => setIsModalOpen(true)} style={{ marginRight: "10px" }}>
+            添加用户
+          </Button>
+          <SimpleForm
+            formRef={searchFormRef}
+            rowStyle="form_style4"
+            formName={"user_search_form"}
+            colProps={20}
+            span={8}
+            onFinish={() => { }}
+            formDatas={searchConfig as any} >
+            <>
+              <Button type="primary" onClick={() => setIsModalOpen(true)}>
+                搜索
+              </Button>
+              <Button type="default" onClick={() => setIsModalOpen(true)}>
+                重置
+              </Button>
+            </>
+          </SimpleForm>
+        </div>
         <BTable
           store={usrStore}
           scroll={{ x: "max-content" }}

src/pages/user/user_config.tsx

@@ -85,3 +85,31 @@ export const columns: ColumnsType<UserDataType> = [
     dataIndex: "tel",
   },
 ];
+
+
+export const searchConfig = [
+  {
+    type: FormType.input,
+    label: "用户名",
+    name: "user_name",
+    value: "",
+  },
+  {
+    type: FormType.input,
+    label: "身份证",
+    name: "id_card",
+    value: "",
+  },
+  {
+    type: FormType.input,
+    label: "联系电话",
+    name: "tel",
+    value: "",
+  },
+  {
+    type: FormType.input,
+    label: "邮箱",
+    name: "email",
+    value: "",
+  },
+];