功能：租赁品牌，租赁类型，租赁型号

src/api/interface/rentManageType.ts

 import { InterFunction, InterItemFunction } from '~/api/interface';
 
-//租赁-新增
+//租赁-类型-新增
 export type addType = InterFunction<{ name: string; url: string }, any>;
-//租赁-列表
+//租赁-类型-列表
 export type getTypeListType = InterItemFunction<any, { id: number; name: string; url: string }[]>;
-//租赁-编辑
+//租赁-类型-编辑
 export type rentTypeEditType = InterFunction<{ name: string; url: string; id: number }, any>;
-//租赁-删除
+//租赁-类型-删除
 export type rentTypeRemoveType = InterFunction<{ id: number }, any>;
+
+//租赁-品牌-新增
+export type rentMakeAddType = InterFunction<{ brandName: string }, any>;
+//租赁-品牌-编辑
+export type editBrandInfoType = InterFunction<{ brandName: string; id?: number }, any>;
+//租赁-品牌-列表
+export type listBrandInfoType = InterItemFunction<
+  any,
+  {
+    brandName: string;
+    createTime: string;
+    id: number;
+    modeInfoList: {
+      brandInfoId: number;
+      id: number;
+      modeName: string;
+      productTypeId: number;
+      tag: string;
+    }[];
+  }[]
+>;
+
+//租赁-型号-新增
+export type addRentModeType = InterFunction<
+  { modeName: string; brandInfoId: number; productTypeId: number },
+  any
+>;

src/api/modules/rentManageAPI.ts

 import {
+  addRentModeType,
   addType,
+  editBrandInfoType,
   getTypeListType,
+  listBrandInfoType,
+  rentMakeAddType,
   rentTypeEditType,
   rentTypeRemoveType,
 } from '~/api/interface/rentManageType';
 import axios from '../request';
 
 export class RentManageAPI {
-  //租赁-新增类型
+  //租赁-类型-新增
   static addTypeReq: addType = (data) => axios.post('/pms/attribute/addType', data);
-  //租赁-类型列表
+  //租赁-类型-列表
   static getTypeList: getTypeListType = (params) =>
     axios.get('/pms/attribute/typeList', { params });
-  //  租赁-编辑类型
+  //  租赁-类型-编辑
   static editTypeReq: rentTypeEditType = (data) => axios.post('/pms/attribute/editType', data);
-  //  租赁-删除
+  //  租赁-类型-删除
   static rentTypeRemove: rentTypeRemoveType = (params) =>
     axios.get('/pms/attribute/removeType', { params });
+
+  //  租赁-品牌-新增
+  static addBrandInfo: rentMakeAddType = (params) =>
+    axios.get('/pms/brand/addBrandInfo', { params });
+  //  租赁-品牌-编辑
+  static editBrandInfo: editBrandInfoType = (params) =>
+    axios.get('/pms/brand/editBrandInfo', { params });
+  //   租赁-品牌-列表
+  static getListBrandInfo: listBrandInfoType = (params) =>
+    axios.get('/pms/brand/listBrandInfo', { params });
+
+  //  租赁-型号-新增
+  static addRentMode: addRentModeType = (data) => axios.post('/pms/brand/addMode', data);
 }

src/pages/mallManage/mallGoods/goodsAddOrEditOrDetail/components/skuInfo/index.tsx

@@ -542,7 +542,10 @@ const SkuInfo = forwardRef<any, selfProps>(({ goodsDetailsInfo }, ref) => {
                     dropdownRender={(menu) => (
                       <>
                         {v.optionList.length ? menu : ''}
-                        <Input onPressEnter={(e) => specificationPressEnter(e, index)} />
+                        <Input
+                          onPressEnter={(e) => specificationPressEnter(e, index)}
+                          maxLength={30}
+                        />
                       </>
                     )}
                     options={v.optionList}

src/pages/rentManage/rentMake/components/addOrEditRentMakeModal/index.tsx

+import { Form, Input, message, Modal, ModalProps } from 'antd';
+import { FC, useEffect } from 'react';
+import { InterDataType, InterReqType } from '~/api/interface';
+import { listBrandInfoType, rentMakeAddType } from '~/api/interface/rentManageType';
+import { RentManageAPI } from '~/api';
+
+//品牌列表返回类型
+type makeListType = InterDataType<listBrandInfoType>['list'];
+interface selfProps {
+  onCancel: () => void;
+  onOk: () => void;
+  currentRentMakeItem: makeListType[0] | undefined;
+}
+//新增品牌参数类型
+type addRentMakeParameterType = Exclude<InterReqType<rentMakeAddType>, undefined>;
+
+const AddOrEditRentMakeModal: FC<ModalProps & selfProps> = ({
+  open,
+  onCancel,
+  onOk,
+  currentRentMakeItem,
+}) => {
+  const [form] = Form.useForm<addRentMakeParameterType>();
+
+  const handleCancel = () => {
+    form.resetFields();
+    onCancel();
+  };
+
+  const handleOk = () => {
+    form.validateFields().then((values) => {
+      RentManageAPI[currentRentMakeItem ? 'editBrandInfo' : 'addBrandInfo']({
+        ...values,
+        id: currentRentMakeItem ? currentRentMakeItem.id : undefined,
+      }).then(({ code }) => {
+        if (code === '200') {
+          message.success(currentRentMakeItem ? '编辑成功' : '新增成功');
+          form.resetFields();
+          onOk();
+        }
+      });
+    });
+  };
+
+  useEffect(() => {
+    if (currentRentMakeItem) {
+      form.setFieldValue('brandName', currentRentMakeItem.brandName);
+    }
+  }, [currentRentMakeItem]);
+
+  return (
+    <Modal open={open} onOk={handleOk} onCancel={handleCancel} title='新增品牌'>
+      <Form form={form}>
+        <Form.Item
+          label='品牌名称'
+          name='brandName'
+          rules={[{ required: true, message: '请输入品牌名称' }]}
+        >
+          <Input placeholder='请输入品牌名称' maxLength={30} />
+        </Form.Item>
+      </Form>
+    </Modal>
+  );
+};
+export default AddOrEditRentMakeModal;

src/pages/rentManage/rentMake/index.tsx

+import { Button, Table, Tag } from 'antd';
+import { PlusOutlined } from '@ant-design/icons';
+import { ColumnsType } from 'antd/es/table';
+import AddOrEditRentMakeModal from './components/addOrEditRentMakeModal';
+import { useEffect, useState } from 'react';
+import { RentManageAPI } from '~/api';
+import { InterDataType, PaginationProps } from '~/api/interface';
+import { listBrandInfoType } from '~/api/interface/rentManageType';
+
+//品牌列表返回类型
+type makeListType = InterDataType<listBrandInfoType>['list'];
+
+const RentMake = () => {
+  const tableColumns: ColumnsType<makeListType[0]> = [
+    {
+      title: '品牌名称',
+      align: 'center',
+      dataIndex: 'brandName',
+    },
+    {
+      title: '设备型号',
+      align: 'center',
+      dataIndex: 'modeInfoList',
+      render: (text: makeListType[0]['modeInfoList']) =>
+        text?.map((v) => <Tag key={v.id}>{v.modeName}</Tag>),
+    },
+    {
+      title: '操作',
+      align: 'center',
+      width: '15%',
+      render: (_: any, record) => (
+        <>
+          <Button type='link'>绑定型号</Button>
+          <Button type='link' onClick={() => addOrEditRentMakeModalClick(record)}>
+            编辑
+          </Button>
+          <Button type='link'>详情</Button>
+        </>
+      ),
+    },
+  ];
+  const [addOrEditRentMakeModalShow, setAddOrEditRentMakeModalShow] = useState<boolean>(false);
+  const [pagination, setPagination] = useState<PaginationProps & { totalCount: number }>({
+    pageNo: 1,
+    pageSize: 10,
+    totalCount: 0,
+  });
+  const [tableData, setTableData] = useState<makeListType>([]);
+  const [currentRentMakeItem, setCurrentRentMakeItem] = useState<makeListType[0]>();
+
+  //品牌列表
+  const getListBrandInfo = () => {
+    RentManageAPI.getListBrandInfo({
+      pageNo: pagination.pageNo,
+      pageSize: pagination.pageSize,
+    }).then(({ result }) => {
+      pagination.totalCount = result.totalCount;
+      setPagination({ ...pagination });
+      setTableData(result.list || []);
+    });
+  };
+  //品牌新增，编辑弹窗
+  const addOrEditRentMakeModalClick = (record?: makeListType[0]) => {
+    setCurrentRentMakeItem(record ? { ...record } : undefined);
+    setAddOrEditRentMakeModalShow(true);
+  };
+  const addOrEditRentMakeModalCancel = () => {
+    setAddOrEditRentMakeModalShow(false);
+  };
+  const addOrEditRentMakeModalOk = () => {
+    getListBrandInfo();
+    setAddOrEditRentMakeModalShow(false);
+  };
+  //分页
+  const paginationChange = (pageNo: number, pageSize: number) => {
+    pagination.pageNo = pageNo;
+    pagination.pageSize = pageSize;
+    getListBrandInfo();
+  };
+
+  useEffect(() => {
+    getListBrandInfo();
+  }, []);
+
+  return (
+    <div className='rent-make'>
+      <div className='rent-make-operate' style={{ marginBottom: '10px' }}>
+        <Button
+          icon={<PlusOutlined />}
+          type='primary'
+          onClick={() => addOrEditRentMakeModalClick()}
+        >
+          新增品牌
+        </Button>
+      </div>
+      <Table
+        columns={tableColumns}
+        bordered
+        dataSource={tableData}
+        pagination={{
+          total: pagination.totalCount,
+          pageSize: pagination.pageSize,
+          current: pagination.pageNo,
+          showSizeChanger: true,
+          showQuickJumper: true,
+          onChange: (page: number, pageSize: number) => paginationChange(page, pageSize),
+          showTotal: (total, range) => `当前 ${range[0]}-${range[1]} 条记录 / 共 ${total} 条数据`,
+        }}
+        rowKey='id'
+      />
+      <AddOrEditRentMakeModal
+        open={addOrEditRentMakeModalShow}
+        onCancel={addOrEditRentMakeModalCancel}
+        onOk={addOrEditRentMakeModalOk}
+        currentRentMakeItem={currentRentMakeItem}
+      />
+    </div>
+  );
+};
+export default RentMake;

src/pages/rentManage/rentMode/components/addOrEditRentModeModal/index.tsx

+import { Form, Input, Modal, ModalProps, Select } from 'antd';
+import { FC, useEffect, useState } from 'react';
+import { InterDataType, InterReqType } from '~/api/interface';
+import { addRentModeType, getTypeListType } from '~/api/interface/rentManageType';
+import { RentManageAPI } from '~/api';
+
+interface selfProps {
+  onOk: () => void;
+  onCancel: () => void;
+}
+//型号新增参数类型
+type addRentParameterType = Exclude<InterReqType<addRentModeType>, undefined>;
+//类型类别返回类型
+type rentTypeListType = InterDataType<getTypeListType>['list'];
+
+const AddOrEditRentModeModal: FC<ModalProps & selfProps> = ({ open, onOk, onCancel }) => {
+  const [form] = Form.useForm<addRentParameterType>();
+  const [rentTypeList, setRentTypeList] = useState<rentTypeListType>([]);
+
+  const handleOk = () => {
+    onOk();
+  };
+  const handleCancel = () => {
+    onCancel();
+  };
+  //获取类型列表
+  const getRentTypeList = () => {
+    RentManageAPI.getTypeList({ pageNo: 1, pageSize: 99999 }).then(({ result }) => {
+      setRentTypeList(result.list || []);
+    });
+  };
+
+  useEffect(() => {
+    getRentTypeList();
+  }, []);
+
+  return (
+    <Modal open={open} onOk={handleOk} onCancel={handleCancel} title='新增型号'>
+      <Form form={form}>
+        <Form.Item label='所属类别'>
+          <Select placeholder='请选择所属类别'>
+            {rentTypeList.map((v) => (
+              <Select.Option key={v.id} value={v.id}>
+                {v.name}
+              </Select.Option>
+            ))}
+          </Select>
+        </Form.Item>
+        <Form.Item label='型号名称'>
+          <Input placeholder='请输入型号名称' />
+        </Form.Item>
+      </Form>
+    </Modal>
+  );
+};
+export default AddOrEditRentModeModal;

src/pages/rentManage/rentMode/index.tsx

+import SearchBox, { searchColumns as searchColumnsType } from '~/components/search-box';
+import { Button, Table } from 'antd';
+import { PlusOutlined } from '@ant-design/icons';
+import { ColumnsType } from 'antd/es/table/InternalTable';
+import AddOrEditRentModeModal from '~/pages/rentManage/rentMode/components/addOrEditRentModeModal';
+import { useState } from 'react';
+
+const RentMode = () => {
+  const tableColumns: ColumnsType<any> = [
+    {
+      title: '型号名称',
+      align: 'center',
+    },
+    {
+      title: '所属类型',
+      align: 'center',
+    },
+    {
+      title: '所属品牌',
+      align: 'center',
+    },
+    {
+      title: '标签',
+      align: 'center',
+    },
+    {
+      title: '操作',
+      align: 'center',
+    },
+  ];
+
+  const searchColumns: searchColumnsType[] = [
+    {
+      name: '',
+      label: '设备类型',
+      placeholder: '请选择设备类型',
+      type: 'select',
+      options: [],
+    },
+  ];
+
+  const [addOrEditRentModelModalShow, setAddOrEditRentModelModalShow] = useState<boolean>(false);
+
+  //新增，编辑型号弹窗
+  const addOrEditRentModelClick = () => {
+    setAddOrEditRentModelModalShow(true);
+  };
+  const addOrEditRentModelModalCancel = () => {
+    setAddOrEditRentModelModalShow(false);
+  };
+  const addOrEditRentModelModalOk = () => {
+    setAddOrEditRentModelModalShow(true);
+  };
+  return (
+    <div className='rent-model'>
+      <SearchBox
+        search={searchColumns}
+        child={
+          <Button type='primary' icon={<PlusOutlined />} onClick={addOrEditRentModelClick}>
+            新增型号
+          </Button>
+        }
+      />
+      <Table bordered columns={tableColumns} />
+      <AddOrEditRentModeModal
+        open={addOrEditRentModelModalShow}
+        onCancel={addOrEditRentModelModalCancel}
+        onOk={addOrEditRentModelModalOk}
+      />
+    </div>
+  );
+};
+export default RentMode;

src/pages/rentManage/rentType/index.tsx

@@ -109,6 +109,7 @@ const RentType = () => {
         bordered
         columns={tableColumns}
         dataSource={tableData}
+        rowKey='id'
         pagination={{
           total: pagination.totalCount,
           pageSize: pagination.pageSize,

src/router/router.tsx

@@ -101,7 +101,9 @@ const RentListView = React.lazy(() => import('~/pages/rentManage/rentGoods/rentL
 const RentAddOrEditOrDetailView = React.lazy(
   () => import('~/pages/rentManage/rentGoods/rentAddOrEditOrDetail'),
 ); //租赁新增、编辑、详情
-const RentTypeView = React.lazy(() => import('~/pages/rentManage/rentType')); //类型管理
+const RentTypeView = React.lazy(() => import('~/pages/rentManage/rentType')); //租赁-类型管理
+const RentMakeView = React.lazy(() => import('~/pages/rentManage/rentMake')); //租赁-品牌管理
+const RentModeView = React.lazy(() => import('~/pages/rentManage/rentMode')); //租赁-型号管理
 
 const MallGoodsView = React.lazy(() => import('~/pages/mallManage/mallGoods/goodsList')); //商城商品
 const MallAddOrEditOrDetailView = React.lazy(
@@ -697,10 +699,9 @@ export const routerList: Array<RouteObjectType> = [
     element: <LayoutView />,
     errorElement: <ErrorPage />,
     meta: {
-      id: 10001,
+      id: 2000,
       icon: <ShopOutlined />,
       title: '租赁管理',
-      develop: true,
     },
     children: [
       {
@@ -751,10 +752,32 @@ export const routerList: Array<RouteObjectType> = [
         element: withLoadingComponent(<RentTypeView />),
         errorElement: <ErrorPage />,
         meta: {
-          id: 10137,
+          id: 2010,
           icon: <SmileOutlined />,
           title: '类型管理',
-          develop: true,
+          // develop: true,
+        },
+      },
+      {
+        path: '/rentManage/rentMake',
+        element: withLoadingComponent(<RentMakeView />),
+        errorElement: <ErrorPage />,
+        meta: {
+          id: 10138,
+          icon: <SmileOutlined />,
+          title: '品牌管理',
+          // develop: true,
+        },
+      },
+      {
+        path: '/rentManage/rentModel',
+        element: withLoadingComponent(<RentModeView />),
+        errorElement: <ErrorPage />,
+        meta: {
+          id: 10139,
+          icon: <SmileOutlined />,
+          title: '型号管理',
+          // develop: true,
         },
       },
     ],
@@ -869,7 +892,7 @@ export const routerList: Array<RouteObjectType> = [
     element: <LayoutView />,
     errorElement: <ErrorPage />,
     meta: {
-      id: 12000,
+      id: 2200,
       icon: <AccountBookOutlined />,
       title: '积分管理',
       develop: true,
@@ -879,7 +902,7 @@ export const routerList: Array<RouteObjectType> = [
         path: '/pointManage/pointList',
         element: withLoadingComponent(<PointList />),
         meta: {
-          id: 12100,
+          id: 2210,
           title: '积分列表',
           icon: <MacCommandOutlined />,
           develop: true,