功能：招标快讯联调

package.json

@@ -60,7 +60,7 @@
     "prettier": "^2.6.2",
     "sass": "^1.62.0",
     "typescript": "^4.6.3",
-    "vite": "^4.3.5",
+    "vite": "^4.3.9",
     "vite-tsconfig-paths": "^3.5.0"
   }
 }

src/api/interface/resourceManageType.ts

@@ -30,3 +30,46 @@ export type releaseTenderNewsAdd = InterFunction<any, any>;
 export type releaseTenderNewsUpdate = InterFunction<any, any>;
 // 删除招标快讯
 export type releaseTenderNewsDelete = InterFunction<{ id: number }, any>;
+// 查询-招标快讯详情列表-分页
+export type releaseTenderNewsInfo = InterListFunction<
+  {
+    tenderNewsId?: number;
+  },
+  {
+    createTime: string;
+    id: number;
+    tenderContent: string;
+    tenderInfoNo: string;
+    tenderNewsId: number;
+    tenderPrice: number;
+    tenderTitle: string;
+  }
+>;
+// 修改-招标快讯详情
+export type releaseTenderNewsInfoUpdate = InterListFunction<
+  {
+    id: number;
+    tenderContent?: string;
+    tenderPrice?: number;
+    tenderTitle?: string;
+  },
+  NonNullable<unknown>
+>;
+// 用户反馈列表-分页
+export type releaseTenderNewsApplyList = InterListFunction<
+  {
+    tenderInfoId?: number;
+    tenderNewsId?: number;
+    userName?: string;
+  },
+  {
+    createTime: string;
+    id: number;
+    nickName: string;
+    phoneNum: string;
+    tenderInfoId: number;
+    tenderInfoNo: string;
+    tenderTitle: string;
+    userName: string;
+  }
+>;

src/api/modules/resourceManageAPI.ts

@@ -5,6 +5,9 @@ import {
   releaseTenderNewsAdd,
   releaseTenderNewsDelete,
   releaseTenderNewsUpdate,
+  releaseTenderNewsInfo,
+  releaseTenderNewsInfoUpdate,
+  releaseTenderNewsApplyList,
 } from '~/api/interface/resourceManageType';
 import axios from '../request';
 
@@ -31,4 +34,16 @@ export class ResourceManageAPI {
   // 删除招标快讯
   static releaseTenderNewsDelete: releaseTenderNewsDelete = (params) =>
     axios.delete(`/release/tender/news/${params?.id}`);
+
+  // 查询-招标快讯详情列表-分页
+  static releaseTenderNewsInfo: releaseTenderNewsInfo = (params) =>
+    axios.get('/release/tender/info', { params });
+
+  // 修改-招标快讯详情
+  static releaseTenderNewsInfoUpdate: releaseTenderNewsInfoUpdate = (params) =>
+    axios.put('/release/tender/info', params);
+
+  // 用户反馈列表-分页
+  static releaseTenderNewsApplyList: releaseTenderNewsApplyList = (params) =>
+    axios.post('/release/tender/applyList', params);
 }

src/pages/resourceManage/materielManage/comp/addEditModal/index.tsx

@@ -207,7 +207,10 @@ const AddEditModal: React.FC<propType> = (props) => {
           <Form.Item
             label='链接地址'
             name='bannerUrl'
-            rules={[{ required: true, message: '请输入链接地址' }]}
+            rules={[
+              { required: true, message: '请输入链接地址' },
+              { pattern: /^[^\s]*$/, message: '地址不能包含空格' },
+            ]}
           >
             <Input placeholder={'请输入链接地址'} maxLength={100} allowClear />
           </Form.Item>

src/pages/resourceManage/tenderManage/comp/addEditDetailModal/index.tsx

+import React, { useEffect } from 'react';
+import { Form, Input, message, Modal } from 'antd';
+import { InterListType, InterReqType } from '~/api/interface';
+import {
+  releaseTenderNewsInfoUpdate,
+  releaseTenderNewsInfo,
+} from '~/api/interface/resourceManageType';
+import { ResourceManageAPI } from '~/api';
+import RichText from '~/components/richText';
+// 列表的类型
+type TableType = InterListType<releaseTenderNewsInfo>;
+// 请求的表单类型
+type ReqType = InterReqType<releaseTenderNewsInfoUpdate>;
+// 传参类型
+interface propType {
+  title: string;
+  open: boolean;
+  closed: any;
+  data?: TableType[0];
+}
+
+const AddEditDetailModal: React.FC<propType> = (props) => {
+  AddEditDetailModal.defaultProps = {
+    data: undefined,
+  };
+  // 参数
+  const { title, open, closed, data } = props;
+  // 表单钩子
+  const [form] = Form.useForm<ReqType>();
+  // 关闭弹窗
+  const handleCancel = () => {
+    form.resetFields();
+    closed();
+  };
+  // 确认事件
+  const handleOk = () => {
+    form
+      .validateFields()
+      .then(async (values) => {
+        await handleSubmit(values as ReqType & { file: any[] });
+      })
+      .catch((err) => {
+        message
+          .warning({
+            content: err.errorFields[0].errors[0],
+          })
+          .then();
+      });
+  };
+  // 提交事件
+  const handleSubmit = async (values: ReqType) => {
+    const res = await ResourceManageAPI.releaseTenderNewsInfoUpdate({
+      ...values,
+      id: Number(data?.id),
+    });
+    if (res && res.code === '200') {
+      message.success('操作成功');
+      handleCancel();
+    }
+  };
+  // componentDidMount
+  useEffect(() => {
+    if (!open) return;
+    if (!data) return;
+    form.setFieldsValue(data);
+    // console.log('data --->', data);
+  }, [open]);
+  return (
+    <Modal
+      open={open}
+      title={title}
+      onCancel={handleCancel}
+      onOk={handleOk}
+      destroyOnClose
+      width={768}
+    >
+      <Form
+        name='Form'
+        form={form}
+        labelAlign='right'
+        labelCol={{ span: 4 }}
+        wrapperCol={{ span: 20 }}
+      >
+        <Form.Item
+          label='标题'
+          name='tenderTitle'
+          rules={[{ required: true, message: '请输入标题' }]}
+        >
+          <Input placeholder={'请输入标题'} maxLength={50} allowClear />
+        </Form.Item>
+        <Form.Item
+          label='价格'
+          name='tenderPrice'
+          rules={[
+            { required: true, message: '请输入价格' },
+            () => ({
+              validator(_, value) {
+                if (value && value.length > 10) {
+                  return Promise.reject('金额不能超过十位数');
+                }
+                return Promise.resolve();
+              },
+            }),
+          ]}
+        >
+          <Input
+            type={'number'}
+            placeholder={'请输入价格'}
+            maxLength={10}
+            allowClear
+            suffix={'万元'}
+          />
+        </Form.Item>
+        <Form.Item
+          label='详情'
+          name='tenderContent'
+          rules={[{ required: true, message: '请输入详情' }]}
+        >
+          <RichText
+            value={form.getFieldValue('tenderContent')}
+            onChange={(e) => form.setFieldValue('tenderContent', e)}
+            height={250}
+          />
+        </Form.Item>
+      </Form>
+    </Modal>
+  );
+};
+
+export default AddEditDetailModal;

src/pages/resourceManage/tenderManage/detail/index.tsx

-import React from 'react';
+import { useEffect, useState } from 'react';
+import { useLocation, useNavigate } from 'react-router-dom';
+import SearchBox from '~/components/search-box';
+import { Button, Table } from 'antd';
+import { ArrowLeftOutlined } from '@ant-design/icons';
+import qs from 'query-string';
+import { InterListType } from '~/api/interface';
+import { releaseTenderNewsInfo } from '~/api/interface/resourceManageType';
+import { ResourceManageAPI } from '~/api';
+import { ColumnsType } from 'antd/es/table';
+import AddEditDetailModal from '~/pages/resourceManage/tenderManage/comp/addEditDetailModal';
+
+// 列表类型
+type TableType = InterListType<releaseTenderNewsInfo>;
 
 const TenderManageDetail = () => {
-  return <div>TenderManageDetail</div>;
+  // 路由钩子
+  const location = useLocation();
+  // 导航钩子
+  const navigate = useNavigate();
+  // 返回上一页
+  const handleBack = () => {
+    navigate(-1);
+  };
+  // 新增修改弹窗是否开启
+  const [addModalVisible, setAddModalVisible] = useState(false);
+  // 需要编辑的数据
+  const [editData, setEditData] = useState<TableType[0]>();
+  // 表格数据
+  const [tableData, setTableData] = useState<TableType>([]);
+  // 表格分页配置
+  const [pagination, setPagination] = useState({
+    total: 0,
+    pageSize: 10,
+    current: 1,
+    totalPage: 0,
+  });
+  // 加载列表
+  const getTableList = async (value = {}) => {
+    // 只需要修改这个地方的接口即可
+    const res = await ResourceManageAPI.releaseTenderNewsInfo({
+      pageNo: pagination.current,
+      pageSize: pagination.pageSize,
+      ...value,
+      tenderNewsId: Number(qs.parse(location.search)?.id),
+    });
+    if (res && res.code === '200') {
+      const { list, pageNo, totalCount, pageSize, totalPage } = res.result; // 解构
+      setPagination({
+        total: totalCount,
+        current: pageNo,
+        pageSize,
+        totalPage,
+      });
+      setTableData(list || []);
+    }
+  };
+  // 翻页
+  const paginationChange = (pageNo: number, pageSize: number) => {
+    getTableList({ pageNo, pageSize }).then();
+  };
+  // componentDidMount
+  useEffect(() => {
+    getTableList().then();
+  }, []);
+  // 表格结构
+  const columns: ColumnsType<TableType[0]> = [
+    {
+      title: '序号',
+      dataIndex: 'accountNo',
+      align: 'center',
+      width: '50px',
+      render: (_text, _record, index) => (pagination.current - 1) * pagination.pageSize + index + 1,
+    },
+    {
+      title: '标题',
+      dataIndex: 'tenderTitle',
+      align: 'center',
+      width: '200px',
+      ellipsis: true,
+    },
+    {
+      title: '详情',
+      dataIndex: 'tenderContent',
+      align: 'center',
+      width: '300px',
+      ellipsis: true,
+    },
+    {
+      title: '价格(万元)',
+      dataIndex: 'tenderPrice',
+      align: 'center',
+      width: '100px',
+      ellipsis: true,
+      render: (text) => text?.toLocaleString(),
+    },
+    {
+      title: '操作',
+      dataIndex: 'action',
+      align: 'center',
+      width: '100px',
+      fixed: 'right',
+      render: (_text, record) => (
+        <Button
+          type={'link'}
+          onClick={() => {
+            setEditData(JSON.parse(JSON.stringify(record)));
+            setAddModalVisible(true);
+          }}
+        >
+          编辑
+        </Button>
+      ),
+    },
+  ];
+  return (
+    <>
+      <SearchBox
+        child={
+          <>
+            <Button type={'primary'} icon={<ArrowLeftOutlined />} onClick={handleBack}>
+              返回
+            </Button>
+          </>
+        }
+      />
+      <Table
+        size='small'
+        dataSource={tableData}
+        columns={columns}
+        rowKey='id'
+        // scroll={{ x: 1500 }}
+        bordered
+        pagination={{
+          total: pagination.total,
+          pageSize: pagination.pageSize,
+          current: pagination.current,
+          showSizeChanger: true,
+          showQuickJumper: true,
+          onChange: (page: number, pageSize: number) => paginationChange(page, pageSize),
+          showTotal: (total, range) => `当前 ${range[0]}-${range[1]} 条记录 / 共 ${total} 条数据`,
+        }}
+      />
+      <AddEditDetailModal
+        open={addModalVisible}
+        title={editData?.id ? '编辑' : '新增'}
+        data={editData}
+        closed={() => {
+          setAddModalVisible(false);
+          setEditData(undefined);
+          paginationChange(pagination.current, pagination.pageSize);
+        }}
+      />
+    </>
+  );
 };
 
 export default TenderManageDetail;

src/pages/resourceManage/tenderManage/feedback/index.tsx

+import { useEffect, useState } from 'react';
+import SearchBox from '~/components/search-box';
+import { ResourceManageAPI } from '~/api';
+import qs from 'query-string';
+import { useLocation, useNavigate } from 'react-router-dom';
+import { Button, Table } from 'antd';
+import { ArrowLeftOutlined } from '@ant-design/icons';
+import {
+  releaseTenderNewsApplyList,
+  releaseTenderNewsInfo,
+} from '~/api/interface/resourceManageType';
+import { InterListType, InterReqListType } from '~/api/interface';
+import { ColumnsType } from 'antd/es/table';
+
+// 列表类型
+type ListType = InterListType<releaseTenderNewsInfo>;
+// 表格类型
+type TableType = InterListType<releaseTenderNewsApplyList>;
+// 请求的参数
+type ReqType = InterReqListType<releaseTenderNewsApplyList>;
+// 搜索表单的数据
+let query: ReqType = {};
+
+const TenderManageFeedback = () => {
+  // 路由钩子
+  const location = useLocation();
+  // 导航钩子
+  const navigate = useNavigate();
+  // 返回上一页
+  const handleBack = () => {
+    navigate(-1);
+  };
+  // 表格数据
+  const [tableData, setTableData] = useState<TableType>([]);
+  // 表格分页配置
+  const [pagination, setPagination] = useState({
+    total: 0,
+    pageSize: 10,
+    current: 1,
+    totalPage: 0,
+  });
+  // 快讯详情列表
+  const [tenderInfoList, setTenderInfoId] = useState<
+    { value: number; label: string; data: ListType[0] }[]
+  >([]);
+  // 获取快讯详情列表
+  const getNewsInfoList = async () => {
+    const res = await ResourceManageAPI.releaseTenderNewsInfo({
+      pageNo: 1,
+      pageSize: 9999,
+      tenderNewsId: Number(qs.parse(location.search)?.id),
+    });
+    if (res && res.code === '200') {
+      const list = res.result?.list || [];
+      setTenderInfoId(
+        list?.map((i, j) => ({
+          value: i.id,
+          label: `${j + 1}、${i.tenderTitle}`,
+          data: i,
+        })),
+      );
+    }
+  };
+  // 加载列表
+  const getTableList = async (value = {}) => {
+    // 只需要修改这个地方的接口即可
+    const res = await ResourceManageAPI.releaseTenderNewsApplyList({
+      pageNo: pagination.current,
+      pageSize: pagination.pageSize,
+      ...value,
+      ...query,
+      tenderNewsId: Number(qs.parse(location.search)?.id),
+    });
+    if (res && res.code === '200') {
+      const { list, pageNo, totalCount, pageSize, totalPage } = res.result; // 解构
+      setPagination({
+        total: totalCount,
+        current: pageNo,
+        pageSize,
+        totalPage,
+      });
+      setTableData(list);
+    }
+  };
+  // 翻页
+  const paginationChange = (pageNo: number, pageSize: number) => {
+    getTableList({ pageNo, pageSize }).then();
+  };
+  // 表单提交
+  const onFinish = (data: ReqType) => {
+    pagination.current = 1;
+    query = data;
+    getTableList(data).then();
+  };
+  // componentDidMount
+  useEffect(() => {
+    query = {};
+    getNewsInfoList().then();
+    getTableList().then();
+  }, []);
+  // 表格结构
+  const columns: ColumnsType<TableType[0]> = [
+    {
+      title: '编号',
+      dataIndex: 'tenderInfoNo',
+      align: 'center',
+    },
+    {
+      title: '标题',
+      dataIndex: 'tenderTitle',
+      align: 'center',
+      ellipsis: true,
+    },
+    {
+      title: '用户昵称',
+      dataIndex: 'nickName',
+      align: 'center',
+    },
+    {
+      title: '用户姓名',
+      dataIndex: 'userName',
+      align: 'center',
+    },
+    {
+      title: '电话号码',
+      dataIndex: 'phoneNum',
+      align: 'center',
+    },
+  ];
+  return (
+    <>
+      <SearchBox
+        search={[
+          {
+            label: '项目编号',
+            name: 'tenderInfoId',
+            type: 'Select',
+            placeholder: '请选择编号',
+            options: tenderInfoList,
+          },
+          { label: '用户姓名', name: 'userName', type: 'input', placeholder: '请输入编号' },
+        ]}
+        searchData={onFinish}
+        child={
+          <>
+            <Button type={'primary'} icon={<ArrowLeftOutlined />} onClick={handleBack}>
+              返回
+            </Button>
+          </>
+        }
+      />
+      <Table
+        size='small'
+        dataSource={tableData}
+        columns={columns}
+        rowKey='id'
+        // scroll={{ x: 1500 }}
+        bordered
+        pagination={{
+          total: pagination.total,
+          pageSize: pagination.pageSize,
+          current: pagination.current,
+          showSizeChanger: true,
+          showQuickJumper: true,
+          onChange: (page: number, pageSize: number) => paginationChange(page, pageSize),
+          showTotal: (total, range) => `当前 ${range[0]}-${range[1]} 条记录 / 共 ${total} 条数据`,
+        }}
+      />
+    </>
+  );
+};
+
+export default TenderManageFeedback;

src/pages/resourceManage/tenderManage/index.tsx

@@ -9,6 +9,7 @@ import { releaseTenderNews } from '~/api/interface/resourceManageType';
 import AddEditModal from './comp/addEditModal';
 import qs from 'query-string';
 import { useNavigate } from 'react-router-dom';
+import saveAs from 'file-saver';
 // 列表类型
 type TableType = InterListType<releaseTenderNews>;
 // 请求的参数
@@ -87,6 +88,13 @@ const TenderManageView = () => {
     };
     navigate(`/resourceManage/tenderManage/detail?${qs.stringify(search)}`);
   };
+  // 跳转反馈
+  const handleFeedback = (record: TableType[0]) => {
+    const search = {
+      id: record.id,
+    };
+    navigate(`/resourceManage/tenderManage/feedback?${qs.stringify(search)}`);
+  };
   // componentDidMount
   useEffect(() => {
     query = {};
@@ -131,7 +139,9 @@ const TenderManageView = () => {
           >
             编辑
           </Button>
-          <Button type={'link'}>用户反馈</Button>
+          <Button type={'link'} onClick={() => handleFeedback(record)}>
+            用户反馈
+          </Button>
           <Button type={'link'} danger onClick={() => handleDelete(record)}>
             删除
           </Button>
@@ -171,7 +181,10 @@ const TenderManageView = () => {
               type={'primary'}
               icon={<DownloadOutlined />}
               onClick={() => {
-                console.log('新增');
+                saveAs(
+                  'https://pad-video-x.oss-cn-shenzhen.aliyuncs.com/doc/%E6%8B%9B%E6%A0%87%E5%BF%AB%E8%AE%AF.xlsx',
+                  `招标快讯模板_${new Date().getTime()}.xlsx`,
+                );
               }}
             >
               下载模板

src/router/router.tsx

@@ -100,6 +100,7 @@ const DirectoryManage = React.lazy(() => import('~/pages/categoryManage/director
 import AccountManageView from '~/pages/systemManage/accountManage';
 import TenderManageView from '~/pages/resourceManage/tenderManage';
 import TenderManageDetail from '~/pages/resourceManage/tenderManage/detail';
+import TenderManageFeedback from '~/pages/resourceManage/tenderManage/feedback';
 
 // const IndustryListView = React.lazy(() => import('~/pages/mallManage/industryManage/industryList')); //行业列表
 // const IndustryDetailView = React.lazy(
@@ -282,6 +283,16 @@ export const routerList: Array<RouteObjectType> = [
           hidden: true,
         },
       },
+      {
+        path: '/resourceManage/tenderManage/feedback',
+        element: withLoadingComponent(<TenderManageFeedback />),
+        meta: {
+          id: 30200,
+          title: '用户反馈',
+          icon: <CoffeeOutlined />,
+          hidden: true,
+        },
+      },
     ],
   },
   {