增加成员名录

config/routes.ts

@@ -74,6 +74,18 @@ export default [
       },
     ],
   },
+  {
+    name: 'Product',
+    path: '/Product',
+    icon: 'smile',
+    routes: [
+      {
+        name: 'member',
+        path: '/Product/member',
+        component: './Product/member',
+      },
+    ],
+  },
   {
     name: 'GoinZZ',
     path: '/GoinZZ',

src/global.less

@@ -309,6 +309,9 @@ ol {
 .ant-pro-layout .ant-pro-sider .ant-menu .ant-menu-item:hover {
   color: #00d3a1;
 }
+.ant-pro-layout .ant-pro-sider .ant-menu .ant-menu-item:not(.ant-menu-item-selected):hover{
+  color: #00d3a1;
+}
 
 //自定义滚动条;
 .custom-scrollbar {

src/pages/Product/member/edit.tsx

@@ -0,0 +1,188 @@
+import React, { useEffect, useState, useRef } from 'react';
+import {
+  ProForm,
+  ProFormText,
+  ProFormDigit,
+} from '@ant-design/pro-components';
+import { Form, Drawer, Upload, Space, Button } from 'antd';
+import { useIntl } from '@umijs/max';
+import { upload } from '@/services/product/member'
+import "quill/dist/quill.snow.css";
+import { RcFile } from 'antd/es/upload';
+
+export type Props = {
+  onCancel: (flag?: boolean, formVals?: any) => void;
+  onSubmit: (values: any) => Promise<void>;
+  open: boolean;
+  currentRow: any;
+};
+
+const VideoForm: React.FC<Props> = (props) => {
+  const [form] = Form.useForm();
+  const intl = useIntl();
+
+  useEffect(() => {
+    form.resetFields();
+    if (!props.open) return;
+    if (!props.currentRow) return;
+    const { sort, title, digest, pcImg, pcImgUrl,url } = props.currentRow;
+    if (props.currentRow) {
+      form.setFieldsValue({
+        sort, title, digest, pcImg, pcImgUrl,url
+      })
+    }
+
+    setpcImg(pcImg)
+
+    if (pcImgUrl && pcImg) {
+      setFileList([
+        {
+          uid: pcImg,
+          thumbUrl: pcImgUrl
+        }
+      ])
+    }
+
+    setmImg(mImg)
+
+  }, [props.open]);
+
+
+  const [fileList, setFileList] = useState<any>([]);
+  const [fileList2, setFileList2] = useState<any>([]);
+  const [pcImg, setpcImg] = useState<any>('');
+  const [mImg, setmImg] = useState<any>('');
+  const handleOk = async () => {
+    let data = form.getFieldsValue()
+
+    let val = await form.validateFields()
+    let formData = {
+      ...data,
+      pcImg,
+      mImg
+    }
+    form.setFieldsValue({
+      title: '',
+      digest: ""
+    })
+    setFileList([]);
+    setFileList2([]);
+    props.onSubmit(formData);
+  };
+  const handleCancel = () => {
+    form.setFieldsValue({
+      title: '',
+      digest: "",
+    })
+    setFileList([]);
+    props.onCancel();
+
+  };
+
+  const handleChange = async (res) => {
+    const { fileList } = res;
+    setFileList(fileList);
+  };
+
+  const handlePCBeforeUpload = async (file: RcFile) => {
+    const formData = new FormData();
+    formData.append('file', file, file.name);
+    const res = await upload(formData);
+    if (res?.data?.uuid) {
+      setpcImg(res.data.uuid)
+    }
+    return false;
+  };
+
+
+  return (
+    <Drawer
+      width={'80%'}
+      title={props.currentRow ? '编辑' : '新建'}
+      forceRender
+      open={props.open}
+      destroyOnClose
+      onClose={handleCancel}
+      extra={
+        <Space>
+          <Button onClick={handleCancel}>取消</Button>
+          <Button type="primary" onClick={handleOk}>确认</Button>
+        </Space>
+      }
+    >
+      <ProForm
+        form={form}
+        grid={true}
+        submitter={false}
+        layout="horizontal"
+      >
+        <ProForm.Item
+          label={'logo图'}
+          extra={'图片尺寸620*114'}
+          labelCol={{
+            style: { width: 95 }
+          }}
+          rules={[
+            {
+              required: true,
+              message: "请上传图片!",
+            }
+          ]
+          }
+        >
+          <Upload
+            listType="picture-card" // 设置为图片卡片模式
+            fileList={fileList}
+            maxCount={1}
+            onChange={handleChange}
+            beforeUpload={handlePCBeforeUpload}
+          >
+            {fileList?.length < 1 && '+' + intl.formatMessage({ id: 'public.uploadImg' })}
+          </Upload>
+        </ProForm.Item>
+
+        <ProFormText
+          name="title"
+          label='标题'
+          labelCol={{
+            style: { width: 95 }
+          }}
+        />
+
+        <ProFormText
+          name="digest"
+          label='简述'
+          labelCol={{
+            style: { width: 95 }
+          }}
+        />
+
+        <ProFormText
+          name="url"
+          label='链接'
+          labelCol={{
+            style: { width: 95 }
+          }}
+        />
+
+        <ProFormDigit
+          name="sort"
+          label="排序"
+          labelCol={{
+            style: { width: 95 }
+          }}
+          placeholder="请输入排序"
+          rules={[
+            {
+              required: true,
+              message: "请输入排序!",
+            },
+          ]}
+        />
+
+      </ProForm>
+    </Drawer>
+  );
+};
+
+export default VideoForm;

src/pages/Product/member/index.less

@@ -0,0 +1,3 @@
+.ant-pro-table-list-toolbar-title{
+    display:none;
+}

src/pages/Product/member/index.tsx

@@ -0,0 +1,253 @@
+
+import React, { useState, useRef, useEffect } from 'react';
+import { useIntl, FormattedMessage } from '@umijs/max';
+import type { FormInstance } from 'antd';
+import { Button, message, Modal, Image } from 'antd';
+import { ActionType, PageContainer, ProColumns, ProTable } from '@ant-design/pro-components';
+import { PlusOutlined } from '@ant-design/icons';
+import { getBannerList, saveBanner, deleteBanner,push } from '@/services/product/member';
+import BannerForm from './edit';
+import { KeepAlive } from 'react-activation';
+import './index.less'
+import { getDataEnumList } from '../../../services/system/Enum';
+
+
+const NoticeTableList: React.FC = () => {
+    const formTableRef = useRef<FormInstance>();
+
+    const [modalVisible, setModalVisible] = useState<boolean>(false);
+
+    const actionRef = useRef<ActionType>();
+    const intl = useIntl();
+    const [currentRow, setCurrentRow] = useState<any>();
+    const [enumList, setEnumList] = useState()
+
+    const handleRemoveOne = async (selectedRow: API.System.Notice) => {
+        const hide = message.loading(intl.formatMessage({ id: 'public.loadingDelete' }));
+        if (!selectedRow) return true;
+        try {
+            const params = [selectedRow.uuid];
+            const resp = await deleteBanner(params.join(','));
+            hide();
+            if (resp.code === 200) {
+                message.success(intl.formatMessage({ id: 'public.deleteSuccess' }));
+            } else {
+                message.error(resp.msg);
+            }
+            return true;
+        } catch (error) {
+            hide();
+            message.error(intl.formatMessage({ id: 'public.deleteError' }));
+            return false;
+        }
+    };
+
+    useEffect(() => {
+        getEnum()
+    }, [])
+
+    const getEnum = () => {
+        getDataEnumList({ enumUuid: '2024810214616101' }).then((res) => {
+            console.log(res.rows)
+
+            const enumOptions = res.rows.map((item: any) => ({
+                label: item.dataName,
+                value: item.uuid,
+            }));
+            setEnumList(enumOptions); // 设置 enumList
+        })
+    }
+    const columns: ProColumns<API.System.Notice>[] = [
+        {
+            title: '序号',
+            dataIndex: 'id',
+            valueType: 'text',
+            hideInSearch: true,
+            render: (_, record: any) => {
+                // console.log('record---',_,record)
+                return record.rowIndex;
+            },
+        },
+        {
+            title: 'logo图片',
+            dataIndex: 'pcImgUrl',
+            valueType: 'text',
+            hideInSearch: true,
+            render: (_, record: any) => {
+                // console.log('record---',_,record)
+                return <Image src={record.pcImgUrl} style={{ 'height': '40px' }}></Image>;
+            }
+        },
+        // {
+        //     title: '焦点图(移动端)',
+        //     dataIndex: 'mImgUrl',
+        //     valueType: 'text',
+        //     hideInSearch: true,
+        //     render: (_, record: any) => {
+        //         // console.log('record---',_,record)
+        //         return <Image src={record.mImgUrl} style={{ 'height': '40px' }}></Image>;
+        //     }
+        // },
+        {
+            title: '标题',
+            dataIndex: 'title',
+            valueType: 'text',
+            hideInSearch: true,
+        },
+        {
+            title: '简述',
+            dataIndex: 'digest',
+            valueType: 'text',
+            hideInSearch: true,
+        },
+        {
+            title: '链接',
+            dataIndex: 'url',
+            valueType: 'text',
+            hideInSearch: true,
+        },
+        {
+            title: '排序',
+            dataIndex: 'sort',
+            valueType: 'text',
+            hideInSearch: true,
+        },
+        {
+            title: '操作',
+            dataIndex: 'option',
+            width: '120px',
+            valueType: 'option',
+            render: (_, record: any) => [
+                <Button
+                    type="link"
+                    size="small"
+                    key="edit"
+
+                    onClick={() => {
+                        setModalVisible(true);
+                        setCurrentRow(record);
+                    }}
+                >
+                    编辑
+                </Button>,
+
+                <Button
+                    type="link"
+                    size="small"
+                    danger
+                    key="batchRemove"
+
+                    onClick={async () => {
+                        Modal.confirm({
+                            title: intl.formatMessage({ id: 'public.delete' }),
+                            content: intl.formatMessage({ id: 'public.confirmdeletemsg' }),
+                            okText: intl.formatMessage({ id: 'public.confirm' }),
+                            cancelText: intl.formatMessage({ id: 'public.cancel' }),
+                            onOk: async () => {
+                                const success = await handleRemoveOne(record);
+                                if (success) {
+                                    if (actionRef.current) {
+                                        actionRef.current.reload();
+                                    }
+                                }
+                            },
+                        });
+                    }}
+                >
+                    <FormattedMessage id="public.delete" defaultMessage="删除" />
+                </Button>,
+            ],
+        },
+    ];
+
+    /**
+     * 一键发布
+     */
+    const publishing = async () => {
+        try {
+            const resp = await push();
+            if (resp.code === 200) {
+                message.success('发布成功');
+            } else {
+                message.error(resp.msg);
+            }
+        } catch (error) { }
+    }
+
+    return (
+        <KeepAlive name='成员名录' path="/Product/member">
+            <PageContainer>
+                <div style={{ width: '100%', float: 'right' }}>
+                    <ProTable<API.System.Notice>
+                        actionRef={actionRef}
+                        formRef={formTableRef}
+                        rowKey="uuid"
+                        search={false}
+                        toolBarRender={() => [
+                            <Button
+                                type="primary"
+                                key="add"
+                                onClick={async () => {
+                                    setCurrentRow(undefined);
+                                    setModalVisible(true);
+                                }}
+                            >
+                                <PlusOutlined /> <FormattedMessage id="public.add" defaultMessage="新建" />
+                            </Button>,
+                            <Button
+                                type="primary"
+                                key="fabu"
+                                onClick={publishing}
+                            >
+                                一键发布
+                            </Button>
+                        ]}
+                        request={(params) => {
+                            return getBannerList({ ...params } as API.System.NoticeListParams).then((res) => {
+
+                                res.rows.forEach((item: any, index: any) => {
+                                    item.rowIndex = index + 1
+                                })
+                                const result = {
+                                    data: res.rows,
+                                    total: res.total,
+                                    success: true,
+
+                                };
+                                return result;
+                            })
+                        }
+                        }
+                        columns={columns}
+                    />
+                </div>
+                <BannerForm
+                    onSubmit={async (values) => {
+                        let success = false;
+                        if (currentRow) {
+                            values.uuid = currentRow.uuid;
+                        }
+
+                        success = await saveBanner({ ...values });
+                        if (success) {
+                            setModalVisible(false);
+                            setCurrentRow(undefined);
+                            if (actionRef.current) {
+                                actionRef.current.reload();
+                            }
+                        }
+                    }}
+                    onCancel={() => {
+                        setModalVisible(false);
+                        setCurrentRow(undefined);
+                    }}
+                    currentRow={currentRow}
+                    open={modalVisible}
+                />
+            </PageContainer>
+        </KeepAlive>
+
+    );
+};
+
+export default NoticeTableList;

src/services/product/member.ts

@@ -0,0 +1,52 @@
+import { request } from '@umijs/max'; 
+
+// 查询
+export async function getBannerList(params: any) {
+    return request('/api/system/banner/select', {
+      method: 'GET',
+      headers: {
+        'Content-Type': 'application/json;charset=UTF-8',
+      },
+      params,
+    });
+  }
+
+// 保存
+export async function saveBanner(data: any) {
+  return request('/api/system/banner/save', {
+    method: 'post',
+    data: data, 
+  });
+}
+
+// 上传
+export async function upload(data: any) {
+  return request('/api/file/upload', {
+    method: 'post',
+    data: data,
+  });
+}
+
+//删除
+export async function deleteBanner(bannerUuid:any) {
+  return request(`/api/system/banner/remove`, {
+    method: 'DELETE',
+    headers: {
+      'Content-Type': 'application/json;charset=UTF-8',
+    },
+    params:{
+      bannerUuid:bannerUuid
+    },
+  });
+}
+
+//发布
+export async function push(params: any) {
+  return request('/api/staticize/static/index', {
+    method: 'GET',
+    headers: {
+      'Content-Type': 'application/json;charset=UTF-8',
+    },
+    params,
+  });
+}