功能：单位管理

src/api/interface/systemManageType.ts

@@ -79,18 +79,87 @@ export type updateBAccountType = InterFunction<
 // 账号-修改密码
 export type updatePasswordType = InterFunction<
   {
-    accountNo: string;
-    accountStatus: number;
-    alertPwd: number;
+    accountNo?: string;
+    accountStatus?: number;
+    alertPwd?: number;
     cityCode?: number;
     districtCode?: number;
     email?: string;
+    id?: number;
+    passWord?: number;
+    phoneNum?: string;
+    provinceCode?: number;
+    remark?: string;
+    userName?: string;
+  },
+  NonNullable<unknown>
+>;
+// 单位-列表
+export type listCompanyPage = InterListFunction<
+  { companyName?: string },
+  {
+    address: string;
+    city: string;
+    companyName: string;
+    companyType: number;
+    companyUserName: string;
+    district: string;
+    fullName: string;
     id: number;
-    passWord: number;
     phoneNum: string;
-    provinceCode?: number;
+    province: string;
+    remark: string;
+  }
+>;
+// 单位-新增
+export type listCompanyAdd = InterFunction<
+  {
+    address?: string;
+    city?: string;
+    companyName?: string;
+    companyType?: number;
+    companyUserName?: string;
+    district?: string;
+    fullName?: string;
+    id?: number;
+    phoneNum?: number;
+    province?: string;
     remark?: string;
-    userName: string;
+    area?: string[];
+  },
+  NonNullable<unknown>
+>;
+// 单位-修改
+export type listCompanyUpdate = InterFunction<
+  {
+    address?: string;
+    city?: string;
+    companyName?: string;
+    companyType?: number;
+    companyUserName?: string;
+    district?: string;
+    fullName?: string;
+    id?: number;
+    phoneNum?: number;
+    province?: string;
+    remark?: string;
+    area?: string[];
+  },
+  NonNullable<unknown>
+>;
+// 单位-地域
+export type getSecondDistrictInfo = InterFunction<
+  NonNullable<unknown>,
+  {
+    childInfo: any[];
+    id: number;
+    name: string;
+  }[]
+>;
+// 单位-删除
+export type listCompanyRemove = InterFunction<
+  {
+    id: number;
   },
   NonNullable<unknown>
 >;

src/api/modules/systemManage.ts

 import {
+  getSecondDistrictInfo,
   insertBAccountType,
   listBAccountPageType,
+  listCompanyAdd,
+  listCompanyPage,
+  listCompanyRemove,
+  listCompanyUpdate,
   removeBAccountType,
   updateBAccountType,
   updatePasswordType,
@@ -27,4 +32,23 @@ export class SystemManageAPI {
   // 账号-修改密码
   static updatePassword: updatePasswordType = (params) =>
     axios.post('/userapp/back-user/updatePassword', params);
+
+  // 单位-列表
+  static listCompanyPage: listCompanyPage = (params) =>
+    axios.post('/userapp/company/listCompanyPage', params);
+
+  // 单位-新增
+  static listCompanyAdd: listCompanyAdd = (params) => axios.post('/userapp/company/add', params);
+
+  // 单位-修改
+  static listCompanyUpdate: listCompanyUpdate = (params) =>
+    axios.post('/userapp/company/update', params);
+
+  // 单位-删除
+  static listCompanyRemove: listCompanyRemove = (params) =>
+    axios.get('/userapp/company/remove', { params });
+
+  // 单位-区域
+  static getSecondDistrictInfo: getSecondDistrictInfo = (params) =>
+    axios.get('/pms/webDevice/getSecondDistrictInfo', { params });
 }

src/pages/systemManage/companyManage/comp/addEditModal/index.tsx

+import React, { useEffect, useState } from 'react';
+import { InterListType, InterReqType } from '~/api/interface';
+import { listCompanyAdd, listCompanyPage } from '~/api/interface/systemManageType';
+import { Cascader, Form, Input, message, Modal } from 'antd';
+import { SystemManageAPI } from '~/api';
+import DistrictData from '~/assets/json/district.json';
+
+// 列表的类型
+type TableType = InterListType<listCompanyPage>;
+// 请求的表单类型
+type ReqType = InterReqType<listCompanyAdd>;
+// 传参类型
+interface propType {
+  title: string;
+  open: boolean;
+  closed: any;
+  data?: TableType[0];
+}
+const AddEditModal: React.FC<propType> = (props) => {
+  // 参数
+  const { title, open, closed, data } = props;
+  /// 表单钩子
+  const [form] = Form.useForm<ReqType>();
+  // 地区
+  const [localList, setLocalList] = useState<
+    {
+      childInfo: any[];
+      id: number;
+      name: string;
+    }[]
+  >();
+  // 关闭弹窗
+  const handleCancel = () => {
+    form.resetFields();
+    closed();
+  };
+  // 确认事件
+  const handleOk = () => {
+    form
+      .validateFields()
+      .then(async (values) => {
+        await handleSubmit({
+          ...values,
+          province: values?.area?.at(0),
+          city: values?.area?.at(1),
+          district: values?.area?.at(2),
+        });
+      })
+      .catch((err) => {
+        message
+          .warning({
+            content: err.errorFields[0].errors[0],
+          })
+          .then();
+      });
+  };
+  // 提交事件
+  const handleSubmit = async (values: ReqType) => {
+    const res = await SystemManageAPI[data?.id ? 'listCompanyUpdate' : 'listCompanyAdd']({
+      ...values,
+      id: Number(data?.id),
+    });
+    if (res && res.code === '200') {
+      message.success('操作成功');
+      handleCancel();
+    }
+  };
+  // 获取地区信息
+  const getSecondDistrictInfo = async () => {
+    setLocalList(DistrictData || []);
+  };
+  // componentDidMount
+  useEffect(() => {
+    if (!open) return;
+    getSecondDistrictInfo().then();
+    if (!data) return;
+    form.setFieldsValue({
+      ...data,
+      area: [data?.province, data?.city, data?.district],
+    });
+    // console.log('data --->', data);
+  }, [open]);
+  return (
+    <Modal
+      open={open}
+      title={title}
+      onCancel={handleCancel}
+      onOk={handleOk}
+      destroyOnClose
+      width={450}
+    >
+      <Form name='addForm' form={form} labelAlign='right' labelCol={{ span: 4 }}>
+        <Form.Item
+          label='单位名称'
+          rules={[{ required: true, message: '请输入单位名称' }]}
+          name='companyName'
+        >
+          <Input placeholder={'请输入单位名称'} maxLength={25} allowClear />
+        </Form.Item>
+        <Form.Item
+          label='单位全称'
+          rules={[{ required: false, message: '请输入单位全称' }]}
+          name='fullName'
+        >
+          <Input placeholder={'请输入单位全称'} maxLength={50} allowClear />
+        </Form.Item>
+        <Form.Item
+          label='行政区划'
+          name='area'
+          rules={[{ required: true, message: '请选择行政区划' }]}
+        >
+          <Cascader
+            options={localList}
+            placeholder='请选择行政区划'
+            allowClear
+            fieldNames={{
+              label: 'name',
+              value: 'name',
+              children: 'childInfo',
+            }}
+          />
+        </Form.Item>
+        <Form.Item
+          label='详细地址'
+          name='address'
+          rules={[{ required: true, message: '请输入详细地址' }]}
+        >
+          <Input.TextArea placeholder='请输入详细地址' maxLength={70} showCount />
+        </Form.Item>
+        <Form.Item label='联系人' name='companyUserName'>
+          <Input placeholder='请输入联系人' maxLength={15} />
+        </Form.Item>
+        <Form.Item
+          label='联系方式'
+          name='phoneNum'
+          rules={[
+            () => ({
+              validator(_, value) {
+                if (!value || /^1[3-9]\d{9}$/.test(value)) {
+                  return Promise.resolve();
+                }
+                return Promise.reject('请输入正确的手机号');
+              },
+            }),
+          ]}
+        >
+          <Input placeholder='请输入联系方式' maxLength={11} type={'number'} />
+        </Form.Item>
+        <Form.Item label='备注' name='remark'>
+          <Input.TextArea placeholder='请输入备注' maxLength={70} showCount />
+        </Form.Item>
+      </Form>
+    </Modal>
+  );
+};
+
+export default AddEditModal;

src/pages/systemManage/companyManage/index.tsx

+import { useState, useEffect } from 'react';
+import SearchBox from '~/components/search-box';
+import { Button, message, Modal, Table } from 'antd';
+import { PlusOutlined } from '@ant-design/icons';
+import { InterListType, InterReqType } from '~/api/interface';
+import { ColumnsType } from 'antd/es/table';
+import { SystemManageAPI } from '~/api';
+import { listCompanyPage } from '~/api/interface/systemManageType';
+import AddEditModal from './comp/addEditModal';
+
+// 列表的数据类型
+type TableType = InterListType<listCompanyPage>;
+// 请求数据的类型
+type ReqType = InterReqType<listCompanyPage>;
+// 搜索表单的数据
+let query: ReqType = {};
+
+const CompanyManageView = () => {
+  const { confirm } = Modal;
+  // 新增编辑弹窗是否开启
+  const [addEditModalVisible, setAddEditModalVisible] = 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 SystemManageAPI.listCompanyPage({
+      pageNo: pagination.current,
+      pageSize: pagination.pageSize,
+      ...value,
+      ...query,
+    });
+    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();
+  };
+  // 删除单位
+  const handleDelete = (value: TableType[0]) => {
+    confirm({
+      title: '提示',
+      content: '是否删除该单位？',
+      onOk: async () => {
+        const res = await SystemManageAPI.listCompanyRemove({ id: value.id });
+        if (res && res.code === '200') {
+          message.success('删除成功');
+          paginationChange(
+            tableData.length === 1 ? pagination.current - 1 : pagination.current,
+            pagination.pageSize,
+          );
+        }
+      },
+    });
+  };
+  // componentDidMount
+  useEffect(() => {
+    query = {};
+    getTableList().then();
+  }, []);
+  // 表格结构
+  const columns: ColumnsType<TableType[0]> = [
+    {
+      title: '单位名称',
+      dataIndex: 'companyName',
+      align: 'center',
+      width: '150px',
+      fixed: 'left',
+      ellipsis: true,
+    },
+    {
+      title: '行政区划',
+      dataIndex: 'province',
+      align: 'center',
+      render: (_value, record) => `${record.province} / ${record.city} / ${record.district}`,
+    },
+    {
+      title: '详细地址',
+      dataIndex: 'address',
+      align: 'center',
+      width: '250px',
+      ellipsis: true,
+    },
+    {
+      title: '联系人',
+      dataIndex: 'companyUserName',
+      align: 'center',
+    },
+    {
+      title: '联系电话',
+      dataIndex: 'phoneNum',
+      align: 'center',
+    },
+    {
+      title: '操作',
+      width: '100px',
+      fixed: 'right',
+      align: 'center',
+      render: (_text, record) => (
+        <>
+          <Button
+            type='link'
+            onClick={() => {
+              setEditData(JSON.parse(JSON.stringify(record)));
+              setAddEditModalVisible(true);
+            }}
+          >
+            变更
+          </Button>
+          <Button type='link' danger onClick={() => handleDelete(record)}>
+            删除
+          </Button>
+        </>
+      ),
+    },
+  ];
+  return (
+    <>
+      <SearchBox
+        search={[
+          {
+            label: '单位名称',
+            name: 'companyName',
+            type: 'input',
+            placeholder: '请输入单位名称',
+          },
+        ]}
+        searchData={onFinish}
+        child={
+          <>
+            <Button
+              type={'primary'}
+              icon={<PlusOutlined />}
+              onClick={() => {
+                setAddEditModalVisible(true);
+              }}
+            >
+              新增单位
+            </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} 条数据`,
+        }}
+      />
+      <AddEditModal
+        open={addEditModalVisible}
+        title={editData ? '变更单位' : '新增单位'}
+        data={editData}
+        closed={() => {
+          setAddEditModalVisible(false);
+          setEditData(undefined);
+          paginationChange(pagination.current, pagination.pageSize);
+        }}
+      />
+    </>
+  );
+};
+
+export default CompanyManageView;

src/router/router.tsx

@@ -32,6 +32,7 @@ import {
   PaperClipOutlined,
   ReadOutlined,
   ThunderboltOutlined,
+  BankOutlined,
 } from '@ant-design/icons';
 // eslint-disable-next-line @typescript-eslint/ban-ts-comment
 // @ts-ignore
@@ -107,6 +108,7 @@ import TenderManageDetail from '~/pages/resourceManage/tenderManage/detail';
 import TenderManageFeedback from '~/pages/resourceManage/tenderManage/feedback';
 import BusinessCaseManage from '~/pages/resourceManage/businessCaseManage';
 import CustomIdentityView from '~/pages/customManage/customIdentity';
+import CompanyManageView from '~/pages/systemManage/companyManage';
 
 // const IndustryListView = React.lazy(() => import('~/pages/mallManage/industryManage/industryList')); //行业列表
 // const IndustryDetailView = React.lazy(
@@ -846,6 +848,15 @@ export const routerList: Array<RouteObjectType> = [
           icon: <UserOutlined />,
         },
       },
+      {
+        path: '/systemManage/companyManage',
+        element: withLoadingComponent(<CompanyManageView />),
+        meta: {
+          id: 28200,
+          title: '单位管理',
+          icon: <BankOutlined />,
+        },
+      },
     ],
   },
 ];