1

src/pages/activity/513/index.tsx

@@ -64,10 +64,6 @@ export default () => {
 
     const handleCreate = async (fields) => {
         setRow(fields);
-        // let data = JSON.parse(JSON.stringify(fields))
-        // const { m, mobile, username, ...rest } = data;
-        // const extracted = { m, mobile, username };
-        // const remainingData = { ...rest };
         const { success } = await activity10CarUserAdd(fields);
 
         if (success) {

src/pages/activity/813/components/CreateFormModal.jsx

@@ -0,0 +1,85 @@
+/*
+ * @Note:
+ * @Author: 2058827620@qq.com
+ * @Date: 2022-04-03 17:02:15
+ */
+
+import { ProForm, ModalForm, ProFormSelect, ProFormText, ProFormDatePicker, ProFormRadio,ProFormDigit } from '@ant-design/pro-components';
+import { Tree } from 'antd';
+import { useEffect, useRef, useState } from 'react';
+import FilesManager from '@/components/FilesManage/index';
+// import services from '@/services/admin';
+
+// const { shopLevelItems } = services.ShopLevelController;
+
+// const { shopItems } = services.ShopController;
+
+
+export default ({ values, modalOpenState, onModalOpenState, onSubmit }) => {
+  const restFormRef = useRef();
+
+  const [shopOption, setShopOption] = useState([]);
+
+  const searchShop = (e) => {
+    console.log(e);
+  }
+
+  useEffect(() => {
+    restFormRef.current?.setFieldsValue(values);
+  }, [values]);
+
+  const handleFinish = async (formValues) => {
+    await onSubmit(formValues);
+    restFormRef.current?.resetFields();
+  };
+
+  return (
+    <>
+      <ModalForm
+        title="买十赠一活动"
+        formRef={restFormRef}
+        submitter={{
+          searchConfig: {
+            resetText: '重置',
+          },
+          resetButtonProps: {
+            onClick: () => {
+              restFormRef.current?.resetFields();
+            },
+          },
+        }}
+        initialValues={values}
+        onFinish={handleFinish}
+        open={modalOpenState}
+        onOpenChange={onModalOpenState}
+      >
+        <ProForm.Group>
+          <ProFormText
+            width="md"
+            name="userName"
+            label="用户名"
+            placeholder="请输入用户名"
+            rules={[{ required: true, message: '请输入' }]}
+          />
+          <ProFormText
+            width="md"
+            name="phone"
+            label="手机号"
+            placeholder="请输入手机号"
+            rules={[{ required: true, message: '请输入手机号' }, { pattern: /^1[3-9]\d{9}$/, message: '请输入有效的手机号' }]}
+          />
+          < ProFormDatePicker
+            rules={[{ required: true, message: '请选择' }]}
+            name="confirmDate"
+            label="认领日期"
+          />
+          <ProFormDigit
+              name="count"
+              label="赠送数量"
+            />
+        </ProForm.Group>
+      </ModalForm >
+    </>
+  );
+};
+

src/pages/activity/813/index.tsx

@@ -3,11 +3,18 @@ import { Select, Space, Image, Button } from 'antd';
 import {
   PageContainer,
   ProTable,
+  ActionType
 } from '@ant-design/pro-components';
 import { activity10s1UserList } from '@/services/activity/index';
-import { usersPage } from '@/services/user/user';
+import { usersPage,activity10s1UserAdd } from '@/services/user/user';
+import CreateFormModal from './components/CreateFormModal';
+
+
+
 
 export default () => {
+  const [createFormModal, setCreateFormModal] = useState(false);
+
 
   const initRow = {
     shop_id: '',
@@ -28,19 +35,19 @@ export default () => {
   const [rowCancellationModal, setRowCancellationModal] = useState(initRowCancellationModal);
 
 
-  const actionRef = useRef();
+  const actionRef = useRef<ActionType>();
 
   const [searchParams, setSearchParams] = useState(null);
 
   const [shopOption, setShopOption] = useState([]);
   const searchShop = async (value) => {
-      const { success, data } = await usersPage({
-          userName: value
-      });
-      data.records.map((i) => {
-          i.userName = i.userName + ' ' + i.phone
-      })
-      setShopOption(data.records)
+    const { success, data } = await usersPage({
+      userName: value
+    });
+    data.records.map((i) => {
+      i.userName = i.userName + ' ' + i.phone
+    })
+    setShopOption(data.records)
   }
 
   const columns = [
@@ -59,17 +66,17 @@ export default () => {
       dataIndex: 'userId',
       render: (_, record) => {
         return <>
-            <div>用户名：{record?.usersInfo?.userName}</div>
-            <div>手机号：{record?.usersInfo?.phone}</div>
-            <div>等级：{record?.usersInfo?.level}</div>
+          <div>用户名：{record?.usersInfo?.userName}</div>
+          <div>手机号：{record?.usersInfo?.phone}</div>
+          <div>等级：{record?.usersInfo?.level}</div>
         </>
-    },
-    renderFormItem: (
-      _,
-      { type, defaultRender, formItemProps, fieldProps, ...rest },
-      form,
-  ) => {
-      return <Select
+      },
+      renderFormItem: (
+        _,
+        { type, defaultRender, formItemProps, fieldProps, ...rest },
+        form,
+      ) => {
+        return <Select
           {...fieldProps}
           allowClear
           showSearch
@@ -77,20 +84,20 @@ export default () => {
           style={{ width: "100%" }}
           filterOption={false}
           onSearch={
-              (e) => {
-                  if (!e) {
-                      return;
-                  }
-                  searchShop(e);
+            (e) => {
+              if (!e) {
+                return;
               }
+              searchShop(e);
+            }
           }
           fieldNames={{
-              label: "userName",
-              value: "id"
+            label: "userName",
+            value: "id"
           }}
           options={shopOption}
-      />
-  },
+        />
+      },
     },
     {
       title: '认领时间',
@@ -115,11 +122,29 @@ export default () => {
     }
   ];
 
+  const handleCreate = async (fields) => {
+    setRow(fields);
+    const { success } = await activity10s1UserAdd(fields);
+
+    if (success) {
+      setRow(initRow);
+      actionRef.current?.reload();
+      setCreateFormModal(false);
+    }
+  };
+
+
   return (
     <PageContainer
       ghost
     >
       <>
+        <CreateFormModal
+          values={row}
+          modalOpenState={createFormModal}
+          onModalOpenState={setCreateFormModal}
+          onSubmit={handleCreate}
+        />
         <ProTable
           actionRef={actionRef}
           rowKey="id"
@@ -127,33 +152,15 @@ export default () => {
             defaultCollapsed: false,
           }}
           toolBarRender={() => [
-            // <AuthConsumer action={'admin/shop_activity/create'} key="admin/shop_activity/create">
-            //   <Button
-            //     type="primary"
-            //     style={{ background: '#67c23a' }}
-            //     onClick={() => {
-            //       setCreateFormModal(true)
-            //     }}
-            //   >
-            //     添加
-            //   </Button>
-            // </AuthConsumer>,
-            // <AuthConsumer action={'admin/shop_activity/export'} key="admin/shop_activity/export">
-            //   <Button type="primary" onClick={() => {
-            //     window.location.href = exportLink(searchParams, '/admin/shop_activity/export');
-            //   }}>导出表格</Button>
-            // </AuthConsumer>,
-            // <AuthConsumer action={'admin/shop_activity/delete'} key="admin/shop_activity/delete">
-            //   <Button
-            //     danger
-            //     type="primary"
-            //     onClick={() => {
-            //       setCancellationModal(true)
-            //     }}
-            //   >
-            //     作废
-            //   </Button>
-            // </AuthConsumer>
+            <Button
+              type="primary"
+              style={{ background: '#67c23a' }}
+              onClick={() => {
+                setCreateFormModal(true)
+              }}
+            >
+              添加
+            </Button>,
           ]}
           request={async (params, sorter, filter) => {
             setSearchParams({ token: '', ...params });

src/services/user/user.ts

@@ -141,3 +141,15 @@ export async function updateUserPemType(body) {
         data: body || {},
     });
 }
+
+
+
+export async function activity10s1UserAdd(body) {
+    return request(`/api/activity/activity10s1UserAdd`, {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'application/json;charset=UTF-8',
+        },
+        data: body || {},
+    });
+}