.umirc.ts

@@ -14,14 +14,8 @@ export default defineConfig({
   },
   proxy: {
     '/api/': {
-<<<<<<< HEAD
-      // target: 'http://yt:8003',
-      target: 'http://10.39.13.80:8001',
-      // target: 'https://weapp-api.linyikj.com.cn/',
-=======
       target: 'http://yt:8001',
       // target: 'http://10.39.13.80:8001',
->>>>>>> 1275c157f58b27d4d2b966e91a73bab4f3360be2
       // target: 'http://we6f9c65.natappfree.cc',
       // target: 'https://loanos-test.nchl.net/',
       changeOrigin: true,

src/common/components/MyButtons.tsx

@@ -49,14 +49,14 @@ export const MyButtons = {
   },
   View({ title, ...rest }: MyButtonsType): JSX.Element {
     return (
-      <Button type="primary" size="small" {...rest}>
+      <Button type="link" size="small" {...rest}>
         {title ?? '查看'}
       </Button>
     );
   },
   Edit({ title = '编辑', ...rest }: MyButtonsType): JSX.Element {
     return (
-      <Button type="primary" size="small" icon={<EditOutlined />} {...rest}>
+      <Button type="link" size="small" icon={<EditOutlined />} {...rest}>
         {title}
       </Button>
     );

src/common/components/layout/MyImportModal.tsx

@@ -54,10 +54,7 @@ export function MyImportModal(props: MyImportModalType) {
             });
         }}
         confirmLoading={loading}
-        // 使用 destroyOnClose 已弃用，建议使用 afterClose 处理清理逻辑
+        destroyOnClose={true}
-        afterClose={() => {
-          setFormData(undefined);
-        }}
         maskClosable={false}
         footer={(dom) => {
           return (

src/components/MyModal.tsx

@@ -1,15 +1,15 @@
 import { MyButtons } from '@/common';
 import { Modal } from 'antd';
-import { useImperativeHandle, useState } from 'react';
+import {  useImperativeHandle, useState } from 'react';
 
 export function MyModal(props?: any) {
   const [open, setOpen] = useState(false);
   const close = () => {
-    setOpen(false);
+    setOpen(false)
-  };
+  }
   useImperativeHandle(props.myRef, () => ({
-    close,
+    close
-  }));
+    }));
   return (
     <>
       {props?.trigger ? (
@@ -17,7 +17,6 @@ export function MyModal(props?: any) {
       ) : (
         <MyButtons.View
           title={props.title || '详情'}
-          type={props.type || 'primary'}
           onClick={() => setOpen(true)}
         />
       )}

src/gen/ApiTypes.d.ts

@@ -46,12 +46,18 @@ declare namespace ApiTypes {
         "asset_houses_id": number; // 房屋ID 
         "type": string; // 类型,[enum:HouseRegistersTypeEnum] 
         "status"?: string; // 状态,[enum:HouseRegistersStatusEnum] 
+        "house_status"?: string; // 房屋状态,[enum:HouseRegistersHouseStatusEnum] 
+        "usage_plan"?: string; // 使用计划,[enum:HouseRegistersUsagePlanEnum] 
+        "customer_type"?: string; // 客户类型,[enum:HouseRegistersCustomerTypeEnum] 
         "customer_info"?: string[]; // 客户信息 
         "ownership_info"?: string[]; // 产权信息 
       };
       type Update = {
         "id": number; // id 
         "type": string; // 类型,[enum:HouseRegistersTypeEnum] 
+        "house_status"?: string; // 房屋状态,[enum:HouseRegistersHouseStatusEnum] 
+        "usage_plan"?: string; // 使用计划,[enum:HouseRegistersUsagePlanEnum] 
+        "customer_type"?: string; // 客户类型,[enum:HouseRegistersCustomerTypeEnum] 
         "customer_info"?: string[]; // 客户信息 
         "ownership_info"?: string[]; // 产权信息 
       };
@@ -175,10 +181,6 @@ declare namespace ApiTypes {
         "asset_units_id"?: number; // 所属单元id,[ref:asset_units] 
         "keywords"?: string; // 关键词 
       };
-      type Import = {
-        "asset_projects_id"?: number; // 所属项目id,[ref:asset_projects] 
-        "upload_file"?: mimes:xlsx,xls; // 上传的时候必填文件 
-      };
     }
     namespace AssetProjects {
       type List = {
@@ -418,7 +420,6 @@ declare namespace ApiTypes {
         "asset_houses_id"?: number; // 房屋id,[ref:asset_houses] 
         "channel"?: string; // 通知渠道,[enum:HouseCollectionTasksChannelEnum] 
         "status"?: string; // 通知状态,[enum:HouseCollectionRecordsStatusEnum] 
-        "full_name"?: string; // 房屋名称 
       };
       type Show = {
         "id": number; // id 
@@ -959,10 +960,10 @@ declare namespace ApiTypes {
         "id": number; // id 
         "type": string; // 工单类型,[enum:HouseWorkOrdersTypeEnum] 
         "level": string; // 优先级,[enum:HouseWorkOrdersLevelEnum] 
+        "title": string; // 工单标题 
         "content": string; // 工单内容 
         "reporter_name"?: string; // 上报人名称 
         "reporter_phone"?: string; // 上报人手机 
-        "contact_phone"?: string; // 联系人电话 
         "attachments"?: string[]; // 工单附件 
         "asset_houses_id": number; // 资产房屋id,[ref:asset_houses] 
       };

src/gen/Apis.ts

@@ -96,12 +96,6 @@ export const Apis = {
       Select(data?: ApiTypes.Asset.AssetHouses.Select): Promise<MyResponseType> {
         return request('admin/asset/asset_houses/select', { data });
       },
-      Import(data?: ApiTypes.Asset.AssetHouses.Import): Promise<MyResponseType> {
-        return request('admin/asset/asset_houses/import', { data });
-      },
-      DownloadTemplate(): Promise<MyResponseType> {
-        return request('admin/asset/asset_houses/download_template', {responseType: 'blob',});
-      },
     },
     AssetProjects: {
       List(data?: ApiTypes.Asset.AssetProjects.List): Promise<MyResponseType> {

src/gen/Enums.ts

@@ -126,7 +126,7 @@ export const BannersTypeEnum= {
 
 // 缓存类型
 export const CacheTypeEnum= {
-  'MobilePhoneVerificationCode': {"text":"手机验证码","color":"#2f067d","value":"MobilePhoneVerificationCode"}, 
+  'MobilePhoneVerificationCode': {"text":"手机验证码","color":"#f8c2db","value":"MobilePhoneVerificationCode"}, 
 };
 
 // CompaniesMerchantTypeEnum
@@ -148,18 +148,6 @@ export const CompanyAppsModuleEnum= {
   'Customer': {"text":"客户端","color":"#10b981","value":"Customer"}, 
 };
 
-// CompanyEmployeeBacklogsStatusEnum
-export const CompanyEmployeeBacklogsStatusEnum= {
-  'Pending': {"text":"待办","color":"#FF6600","value":"Pending"}, 
-  'Completed': {"text":"已办","color":"#2A82E4","value":"Completed"}, 
-};
-
-// CompanyEmployeeBacklogsTypeEnum
-export const CompanyEmployeeBacklogsTypeEnum= {
-  'WorkOrder': {"text":"工单","color":"#FF6600","value":"WorkOrder"}, 
-  'Contract': {"text":"合同","color":"#2A82E4","value":"Contract"}, 
-};
-
 // CompanyReceiptAccountsPayChannelEnum
 export const CompanyReceiptAccountsPayChannelEnum= {
   'WeChat': {"text":"微信","color":"#07c160","value":"WeChat"}, 
@@ -171,7 +159,7 @@ export const CompanyReceiptAccountsPayChannelEnum= {
 // CustomerBacklogsStatusEnum
 export const CustomerBacklogsStatusEnum= {
   'Pending': {"text":"待办","color":"#faad14","value":"Pending"}, 
-  'Completed': {"text":"已办","color":"#2A82E4","value":"Completed"}, 
+  'Done': {"text":"已办","color":"#52c41a","value":"Done"}, 
 };
 
 // CustomerBacklogsTypeEnum
@@ -246,23 +234,18 @@ export const HouseOccupantsCardTypeEnum= {
 // HouseOccupantsHouseRelationEnum
 export const HouseOccupantsHouseRelationEnum= {
   'Owner': {"text":"产权人","color":"#2db7f5","value":"Owner"}, 
-  'NonOwner': {"text":"非产权人","color":"#fa8c16","value":"NonOwner"}, 
+  'Resident': {"text":"住户","color":"#87d068","value":"Resident"}, 
+  'Tenant': {"text":"租客","color":"#fa8c16","value":"Tenant"}, 
 };
 
 // HouseOccupantsRelationWithOwnerEnum
 export const HouseOccupantsRelationWithOwnerEnum= {
-  'Spouse': {"text":"配偶","color":"#2db7f5","value":"Spouse"}, 
+  'Self': {"text":"本人","color":"#52c41a","value":"Self"}, 
+  'Spouse': {"text":"夫妻","color":"#2db7f5","value":"Spouse"}, 
+  'FatherSon': {"text":"父子","color":"#faad14","value":"FatherSon"}, 
+  'MotherSon': {"text":"母子","color":"#fa8c16","value":"MotherSon"}, 
   'Children': {"text":"子女","color":"#87d068","value":"Children"}, 
-  'Parents': {"text":"父母","color":"#faad14","value":"Parents"}, 
+  'ContactPerson': {"text":"指定联系人","color":"#f5222d","value":"ContactPerson"}, 
-  'Siblings': {"text":"兄弟姐妹","color":"#fa8c16","value":"Siblings"}, 
-  'OtherRelatives': {"text":"其他亲属","color":"#f5222d","value":"OtherRelatives"}, 
-};
-
-// HouseOccupantsResidentialRelationEnum
-export const HouseOccupantsResidentialRelationEnum= {
-  'Resident': {"text":"住户","color":"#2db7f5","value":"Resident"}, 
-  'PrimaryTenant': {"text":"主租人","color":"#87d068","value":"PrimaryTenant"}, 
-  'Tenant': {"text":"租客","color":"#fa8c16","value":"Tenant"}, 
 };
 
 // HouseOccupantsStatusEnum
@@ -319,12 +302,12 @@ export const HouseRegistersStatusEnum= {
 
 // HouseRegistersTypeEnum
 export const HouseRegistersTypeEnum= {
-  'AddOwner': {"text":"添加产权人","color":"#52c41a","value":"AddOwner"}, 
+  'Delivery': {"text":"入户登记","color":"#2db7f5","value":"Delivery"}, 
-  'RemoveOwner': {"text":"减少产权人","color":"#d9363e","value":"RemoveOwner"}, 
+  'Transfer': {"text":"过户登记","color":"#87d068","value":"Transfer"}, 
   'AddOccupant': {"text":"添加住户","color":"#108ee9","value":"AddOccupant"}, 
-  'RemoveOccupant': {"text":"移除住户","color":"#fa8c16","value":"RemoveOccupant"}, 
   'MoveOut': {"text":"搬离登记","color":"#f50","value":"MoveOut"}, 
   'MoveIn': {"text":"搬入登记","color":"#ffc53d","value":"MoveIn"}, 
+  'RemoveOwner': {"text":"减少产权人","color":"#d9363e","value":"RemoveOwner"}, 
 };
 
 // HouseRegistersUsagePlanEnum

src/pages/archive/components/OccupantsNow.tsx

@@ -8,8 +8,8 @@ import {
 import { ProTable } from '@ant-design/pro-components';
 import { Popconfirm, Space, Tag } from 'antd';
 import { useEffect, useRef } from 'react';
-import Delivery from '../modals/Delivery';
 import AddOccupant from './modals/AddOccupant';
+import AddRent from './modals/AddRent';
 import MoveIn from './modals/MoveIn';
 import MoveOut from './modals/MoveOut';
 import OccupantShow from './modals/OccupantShow';
@@ -45,30 +45,24 @@ export default function Index({ ...rest }) {
           )
         }
         toolBarRender={(action) => [
-          <Delivery
+          <AddOccupant
-            key="Delivery"
+            key="AddOccupant"
-            item={{ ...rest.item, size: 'middle' }}
+            item={rest.item}
             reload={action?.reload}
-            title="添加产权人"
+            title="添加住户"
+          />,
+          <AddRent
+            key="AddOccupant"
+            item={rest.item}
+            reload={action?.reload}
+            title="添加租客"
+          />,
+          <Transfer
+            key="Transfer"
+            item={rest.item}
+            reload={action?.reload}
+            title=" 过户登记"
           />,
-          !rest.item?.house_occupants?.length ? (
-            ''
-          ) : (
-            <>
-              <AddOccupant
-                key="AddOccupant"
-                item={rest.item}
-                reload={action?.reload}
-                title="添加客户"
-              />
-              <Transfer
-                key="Transfer"
-                item={rest.item}
-                reload={action?.reload}
-                title=" 过户登记"
-              />
-            </>
-          ),
         ]}
         search={false}
         columns={[

src/pages/archive/components/modals/AddOccupant.tsx

@@ -10,13 +10,11 @@ import {
   HouseOccupantsCardTypeEnum,
   HouseOccupantsHouseRelationEnum,
   HouseOccupantsRelationWithOwnerEnum,
-  HouseOccupantsResidentialRelationEnum,
-  HouseRegistersTypeEnum,
 } from '@/gen/Enums';
 import { BetaSchemaForm, ProCard } from '@ant-design/pro-components';
 import { Form, message } from 'antd';
 
-export default function AddOccupant(props: MyBetaModalFormProps) {
+export default function Create(props: MyBetaModalFormProps) {
   const [form] = Form.useForm();
   return (
     <BetaSchemaForm<ApiTypes.Archive.HouseRegisters.Store>
@@ -38,13 +36,7 @@ export default function AddOccupant(props: MyBetaModalFormProps) {
         Apis.Archive.HouseRegisters.Store({
           ...values,
           asset_houses_id: props?.item?.id,
-          type: HouseRegistersTypeEnum.AddOccupant.value,
+          type: 'AddOccupant',
-          customer_info: values.customer_info?.map((res: any) => {
-            return {
-              ...res,
-              house_relation: HouseOccupantsHouseRelationEnum.NonOwner.value,
-            };
-          }),
         })
           .then(() => {
             props.reload?.();
@@ -58,12 +50,10 @@ export default function AddOccupant(props: MyBetaModalFormProps) {
           valueType: 'formList',
           dataIndex: 'customer_info',
           colProps: { span: 24 },
-          initialValue: [''],
-
           fieldProps: {
             copyIconProps: false,
             creatorButtonProps: {
-              creatorButtonText: '添加客户',
+              creatorButtonText: '添加住户',
             },
             itemRender: (
               { listDom, action }: any,
@@ -73,7 +63,7 @@ export default function AddOccupant(props: MyBetaModalFormProps) {
                 <ProCard
                   bordered
                   style={{ marginBlockEnd: 0 }}
-                  title={`客户${index + 1}`}
+                  title={`住户${index + 1}`}
                   extra={action}
                   bodyStyle={{ paddingBlockEnd: 0 }}
                 >
@@ -87,17 +77,16 @@ export default function AddOccupant(props: MyBetaModalFormProps) {
               valueType: 'group',
               columns: [
                 MyFormItems.EnumRadio({
-                  key: 'residential_relation',
+                  key: 'house_relation',
-                  title: '居住关系',
+                  title: '房客关系',
-                  colProps: { span: 12 },
+                  colProps: { span: 6 },
-                  valueEnum: HouseOccupantsResidentialRelationEnum,
+                  valueEnum: () => {
-                  // valueEnum: () => {
+                    let obj: any = JSON.parse(
-                  //   let obj: any = JSON.parse(
+                      JSON.stringify(HouseOccupantsHouseRelationEnum),
-                  //     JSON.stringify(HouseOccupantsResidentialRelationEnum),
+                    );
-                  //   );
+                    delete obj.Tenant;
-                  //   delete obj.Tenant;
+                    return obj;
-                  //   return obj;
+                  },
-                  // },
                   required: true,
                 }),
                 MyFormItems.EnumRadio({
@@ -105,8 +94,16 @@ export default function AddOccupant(props: MyBetaModalFormProps) {
                   title: '关系标记',
                   valueEnum: HouseOccupantsRelationWithOwnerEnum,
                   colProps: { span: 18 },
+                  // valueEnum: () => {
+                  //   let obj: any = JSON.parse(
+                  //     JSON.stringify(HouseOccupantsRelationWithOwnerEnum),
+                  //   );
+                  //   delete obj.Self;
+                  //   return obj;
+                  // },
                   required: true,
                 }),
+
                 {
                   title: '姓名',
                   dataIndex: 'name',

src/pages/archive/index.tsx

@@ -111,7 +111,7 @@ export default function Index({ title = '房屋档案' }) {
             render: (_, item: any, index, action) => (
               <Space key={index}>
                 <MyButtons.View
-                  title="查看"
+                  title="详情"
                   onClick={() => {
                     navigate(`/archive/${item.id}`);
                   }}
@@ -120,10 +120,17 @@ export default function Index({ title = '房屋档案' }) {
                   <Delivery
                     item={item}
                     reload={action?.reload}
-                    title="添加产权人"
+                    title="入户登记"
                   />
                 ) : (
-                  ''
+                  <MyButtons.Default
+                    title="客户管理"
+                    size="small"
+                    type="link"
+                    onClick={() => {
+                      navigate(`/archive/asset_house/${item.id}`);
+                    }}
+                  />
                 )}
               </Space>
             ),

src/pages/archive/modals/Delivery.tsx

@@ -9,7 +9,7 @@ import { Apis } from '@/gen/Apis';
 import {
   HouseOccupantsCardTypeEnum,
   HouseOccupantsHouseRelationEnum,
-  HouseRegistersTypeEnum,
+  HouseRegistersCustomerTypeEnum,
 } from '@/gen/Enums';
 import { BetaSchemaForm, ProCard } from '@ant-design/pro-components';
 import { Form, message } from 'antd';
@@ -19,17 +19,12 @@ export default function Create(props: MyBetaModalFormProps) {
   return (
     <BetaSchemaForm<ApiTypes.Archive.HouseRegisters.Store>
       {...MyModalFormProps.props}
-      title={`${props.title}`}
+      title={`添加${props.title}`}
       wrapperCol={{ span: 24 }}
       width="800px"
       trigger={
-        <MyButtons.View
+        <MyButtons.Default title={props.title} size="small" type="link" />
-          title={props.title}
-          size={props.item?.size || 'small'}
-          type="primary"
-        />
       }
-      key={new Date().getTime()}
       form={form}
       onOpenChange={(open: any) => {
         if (open) {
@@ -40,11 +35,13 @@ export default function Create(props: MyBetaModalFormProps) {
         Apis.Archive.HouseRegisters.Store({
           ...values,
           asset_houses_id: props?.item?.id,
-          type: HouseRegistersTypeEnum.AddOwner.value,
+          type: 'Delivery',
           customer_info: values.customer_info?.map((res: any) => {
             return {
               ...res,
-              house_relation: HouseOccupantsHouseRelationEnum.Owner.value,
+              house_relation: 'Owner',
+              house_status: 'SelfOccupied',
+              relation_with_owner: 'Self',
             };
           }),
         })
@@ -57,25 +54,38 @@ export default function Create(props: MyBetaModalFormProps) {
       }
       columns={[
         // MyFormItems.EnumRadio({
-        //   key: 'customer_type',
+        //   key: 'house_status',
-        //   title: '产权归属类型',
+        //   title: '房屋状态',
         //   colProps: { span: 12 },
-        //   valueEnum: HouseRegistersCustomerTypeEnum,
+        //   valueEnum: HouseRegistersHouseStatusEnum,
+        //   formItemProps: { ...rulesHelper.text },
         // }),
+        // MyFormItems.EnumRadio({
+        //   key: 'house_status',
+        //   title: '使用计划',
+        //   colProps: { span: 8 },
+        //   valueEnum: HouseRegistersUsagePlanEnum,
+        //   formItemProps: { ...rulesHelper.text },
+        // }),
+        MyFormItems.EnumSelect({
+          key: 'customer_type',
+          title: '产权归属',
+          colProps: { span: 6 },
+          valueEnum: HouseRegistersCustomerTypeEnum,
+        }),
         MyFormItems.UploadImages({
           key: 'ownership_info',
           title: '产权文件',
-          tooltip: '上限9张',
+          tooltip: '上限3张',
           uploadType: 'file',
-          max: 9,
+          max: 3,
-          colProps: { span: 24 },
+          colProps: { span: 18 },
           formItemProps: { ...rulesHelper.array },
         }),
         {
           valueType: 'formList',
           dataIndex: 'customer_info',
           colProps: { span: 24 },
-          initialValue: [''],
           fieldProps: {
             copyIconProps: false,
             creatorButtonProps: {
@@ -149,21 +159,19 @@ export default function Create(props: MyBetaModalFormProps) {
                     MyFormItems.UploadImages({
                       key: 'card_front_image',
                       title: '证件正面',
-                      // uploadType: 'file',
+                      uploadType: 'file',
-                      required: true,
                       max: 1,
                       colProps: { span: 6 },
                     }),
                     MyFormItems.UploadImages({
                       key: 'card_back_image',
                       title: '证件反面',
-                      // uploadType: 'file',
+                      uploadType: 'file',
-                      required: true,
                       max: 1,
                       colProps: { span: 6 },
                     }),
                     {
-                      title: '是否入住',
+                      title: '是否办理入住',
                       dataIndex: 'is_live_in',
                       colProps: { span: 6 },
                       valueType: 'switch',

src/pages/asset/$id.tsx

@@ -17,7 +17,7 @@ export default function Show({ title }: { title?: string } = {}) {
   // 注册当前页面为标签页
   const { addTab } = usePageTabs({
     tabKey: `asset-show-${id}`,
-    tabLabel: data?.name || title || '项目详情',
+    tabLabel: data?.name || title || '资产详情',
   });
 
   const loadShow = () => {
@@ -71,7 +71,7 @@ export default function Show({ title }: { title?: string } = {}) {
     // },
   ];
   return (
-    <MyPageContainer title={data?.name || title || '项目详情'}>
+    <MyPageContainer title={data?.name || title || '资产详情'}>
       <Basic item={data} reload={() => loadShow()} />
       <ProCard>
         <Tabs type="card" items={data?.id ? items : []} />

src/pages/asset/components/AssetInfo.tsx

@@ -8,7 +8,7 @@ import {
 import { ProCard, ProDescriptions } from '@ant-design/pro-components';
 import { Space } from 'antd';
 
-export default function AssetInfo(props: MyBetaModalFormProps) {
+export default function info(props: MyBetaModalFormProps) {
   return (
     <Space direction="vertical" style={{ width: '100%' }}>
       <ProCard extra={props.extra}>

src/pages/asset/components/modals/HousesCreate.tsx

@@ -9,6 +9,7 @@ import { Apis } from '@/gen/Apis';
 import {
   AssetHousesOrientationEnum,
   AssetHousesOwnershipTypeEnum,
+  AssetHousesStatusEnum,
   AssetHousesUsageEnum,
 } from '@/gen/Enums';
 import { BetaSchemaForm } from '@ant-design/pro-components';
@@ -52,20 +53,14 @@ export default function Create(props: MyBetaModalFormProps) {
           colProps: { span: 6 },
           formItemProps: { ...rulesHelper.text },
         },
-        MyFormItems.EnumRadio({
-          key: 'ownership_type',
-          title: '房屋属性',
-          colProps: { span: 24 },
-          valueEnum: AssetHousesOwnershipTypeEnum,
-          // required: true,
-        }),
         MyFormItems.EnumRadio({
           key: 'usage',
           title: '用途',
-          colProps: { span: 24 },
+          colProps: { span: 18 },
           valueEnum: AssetHousesUsageEnum,
           required: true,
         }),
+
         {
           key: 'floor',
           title: '楼层',
@@ -167,29 +162,35 @@ export default function Create(props: MyBetaModalFormProps) {
           valueEnum: AssetHousesOrientationEnum,
           // required: true,
         }),
-        // MyFormItems.EnumRadio({
+        MyFormItems.EnumRadio({
-        //   key: 'status',
+          key: 'status',
-        //   title: '房屋状态',
+          title: '房屋状态',
-        //   colProps: { span: 6 },
+          colProps: { span: 6 },
-        //   // valueEnum: AssetHousesStatusEnum,
+          // valueEnum: AssetHousesStatusEnum,
-        //   // required: true,
+          // required: true,
-        //   valueEnum: () => {
+          valueEnum: () => {
-        //     let obj: any = JSON.parse(JSON.stringify(AssetHousesStatusEnum));
+            let obj: any = JSON.parse(JSON.stringify(AssetHousesStatusEnum));
-        //     delete obj.SelfOccupied;
+            delete obj.SelfOccupied;
-        //     delete obj.Rented;
+            delete obj.Rented;
-        //     delete obj.Vacant;
+            delete obj.Vacant;
-        //     return obj;
+            return obj;
-        //   },
+          },
-        // }),
+        }),
-
+        MyFormItems.EnumSelect({
-        // {
+          key: 'ownership_type',
-        //   key: 'ownership_term',
+          title: '产权性质',
-        //   title: '产权年限',
+          colProps: { span: 6 },
-        //   fieldProps: {
+          valueEnum: AssetHousesOwnershipTypeEnum,
-        //     addonAfter: '年',
+          // required: true,
-        //   },
+        }),
-        //   colProps: { span: 6 },
+        {
-        // },
+          key: 'ownership_term',
+          title: '产权年限',
+          fieldProps: {
+            addonAfter: '年',
+          },
+          colProps: { span: 6 },
+        },
       ]}
     />
   );

src/pages/asset/components/modals/HousesUpdate.tsx

@@ -10,6 +10,7 @@ import { Apis } from '@/gen/Apis';
 import {
   AssetHousesOrientationEnum,
   AssetHousesOwnershipTypeEnum,
+  AssetHousesStatusEnum,
   AssetHousesUsageEnum,
 } from '@/gen/Enums';
 import { BetaSchemaForm } from '@ant-design/pro-components';
@@ -24,7 +25,7 @@ export default function Update(props: MyBetaModalFormProps) {
       wrapperCol={{ span: 24 }}
       width="800px"
       trigger={
-        <MyButtons.Default title={props.title} size="small" type="primary" />
+        <MyButtons.Default title={props.title} size="small" type="link" />
       }
       form={form}
       key={new Date().getTime()}
@@ -86,31 +87,25 @@ export default function Update(props: MyBetaModalFormProps) {
                     colProps: { span: 6 },
                     formItemProps: { ...rulesHelper.number },
                   }),
-                  {
-                    key: 'name',
-                    title: '房号',
-                    colProps: { span: 6 },
-                    formItemProps: { ...rulesHelper.text },
-                  },
                 ],
               },
             ];
           },
         },
-        MyFormItems.EnumRadio({
+        {
-          key: 'ownership_type',
+          key: 'name',
-          title: '房屋属性',
+          title: '房号',
-          colProps: { span: 24 },
+          colProps: { span: 6 },
-          valueEnum: AssetHousesOwnershipTypeEnum,
+          formItemProps: { ...rulesHelper.text },
-          // required: true,
+        },
-        }),
         MyFormItems.EnumRadio({
           key: 'usage',
           title: '用途',
-          colProps: { span: 24 },
+          colProps: { span: 18 },
           valueEnum: AssetHousesUsageEnum,
           required: true,
         }),
+
         {
           key: 'floor',
           title: '楼层',
@@ -212,20 +207,35 @@ export default function Update(props: MyBetaModalFormProps) {
           valueEnum: AssetHousesOrientationEnum,
           // required: true,
         }),
-        // MyFormItems.EnumRadio({
+        MyFormItems.EnumRadio({
-        //   key: 'status',
+          key: 'status',
-        //   title: '房屋状态',
+          title: '房屋状态',
-        //   colProps: { span: 6 },
+          colProps: { span: 6 },
-        //   // valueEnum: AssetHousesStatusEnum,
+          // valueEnum: AssetHousesStatusEnum,
-        //   // required: true,
+          // required: true,
-        //   valueEnum: () => {
+          valueEnum: () => {
-        //     let obj: any = JSON.parse(JSON.stringify(AssetHousesStatusEnum));
+            let obj: any = JSON.parse(JSON.stringify(AssetHousesStatusEnum));
-        //     delete obj.SelfOccupied;
+            delete obj.SelfOccupied;
-        //     delete obj.Rented;
+            delete obj.Rented;
-        //     delete obj.Vacant;
+            delete obj.Vacant;
-        //     return obj;
+            return obj;
-        //   },
+          },
-        // }),
+        }),
+        MyFormItems.EnumSelect({
+          key: 'ownership_type',
+          title: '产权性质',
+          colProps: { span: 6 },
+          valueEnum: AssetHousesOwnershipTypeEnum,
+          // required: true,
+        }),
+        {
+          key: 'ownership_term',
+          title: '产权年限',
+          fieldProps: {
+            addonAfter: '年',
+          },
+          colProps: { span: 6 },
+        },
       ]}
     />
   );

src/pages/asset/index.tsx

@@ -1,7 +1,6 @@
 import {
   MyButtons,
   MyColumns,
-  MyImportModal,
   MyPageContainer,
   MyProTableProps,
   usePageTabs,
@@ -11,7 +10,7 @@ import { AssetProjectsPropertyTypeEnum } from '@/gen/Enums';
 import { ProTable } from '@ant-design/pro-components';
 import { Space } from 'antd';
 import { useNavigate } from 'react-router-dom';
-import AssetCreate from './modals/AssetCreate';
+import Create from './modals/AssetCreate';
 
 export default function Index({ title = '项目管理' }) {
   const navigate = useNavigate();
@@ -31,7 +30,7 @@ export default function Index({ title = '项目管理' }) {
         }
         // headerTitle="项目列表"
         toolBarRender={(action) => [
-          <AssetCreate key="Create" reload={action?.reload} title={'项目'} />,
+          <Create key="Create" reload={action?.reload} title={'项目'} />,
         ]}
         columns={[
           MyColumns.ID(),
@@ -102,14 +101,6 @@ export default function Index({ title = '项目管理' }) {
                     navigate(`/asset/${item.id}`);
                   }}
                 />
-                <MyImportModal
-                  key="ImportHouse"
-                  params={{ asset_projects_id: item?.id }}
-                  title="批量导入"
-                  templateApi={Apis.Asset.AssetHouses.DownloadTemplate}
-                  importApi={Apis.Asset.AssetHouses.Import}
-                  reload={action?.reload}
-                />
                 <MyButtons.Delete
                   onConfirm={() =>
                     Apis.Common.Admins.Delete({ id: item.id }).then(() =>

src/pages/asset/modals/AssetCreate.tsx

@@ -27,14 +27,10 @@ export default function Create(props: MyBetaModalFormProps) {
       wrapperCol={{ span: 24 }}
       width="600px"
       trigger={<MyButtons.Create title={`添加${props.title}`} />}
-      key={new Date().getTime()}
       form={form}
       onOpenChange={(open: any) => {
         if (open) {
           form.resetFields(); // 清空表单数据
-          form.setFieldsValue({
-            companies_id: props?.item?.id,
-          });
         }
       }}
       onFinish={async (values) =>

src/pages/asset/modals/AssetUpdate.tsx

@@ -6,6 +6,7 @@ import {
   rulesHelper,
 } from '@/common';
 import { Address } from '@/components/Address';
+import { Selects } from '@/components/Select';
 import { Apis } from '@/gen/Apis';
 import {
   AssetProjectsChargeEnum,
@@ -65,12 +66,12 @@ export default function Update(props: MyBetaModalFormProps) {
           title: '项目别名',
           colProps: { span: 12 },
         },
-        // Selects?.Companies({
+        Selects?.Companies({
-        //   key: 'companies_id',
+          key: 'companies_id',
-        //   title: '所属机构',
+          title: '所属机构',
-        //   colProps: { span: 24 },
+          colProps: { span: 24 },
-        //   formItemProps: { ...rulesHelper.number },
+          formItemProps: { ...rulesHelper.number },
-        // }),
+        }),
         Address.Cascader({
           key: 'casacader',
           title: '选择地址',

src/pages/asset_houses/index.tsx

@@ -8,6 +8,7 @@ import { Apis } from '@/gen/Apis';
 import {
   AssetHousesOrientationEnum,
   AssetHousesOwnershipTypeEnum,
+  AssetHousesStatusEnum,
   AssetHousesUsageEnum,
 } from '@/gen/Enums';
 import { ProTable } from '@ant-design/pro-components';
@@ -91,12 +92,12 @@ export default function Index({ title = '房屋列表' }) {
             valueEnum: AssetHousesOrientationEnum,
             search: false,
           }),
-          // MyColumns.EnumTag({
+          MyColumns.EnumTag({
-          //   title: '房屋状态',
+            title: '房屋状态',
-          //   dataIndex: 'status',
+            dataIndex: 'status',
-          //   valueEnum: AssetHousesStatusEnum,
+            valueEnum: AssetHousesStatusEnum,
-          //   search: false,
+            search: false,
-          // }),
+          }),
           MyColumns.EnumTag({
             title: '产权性质',
             dataIndex: 'ownership_type',
@@ -104,14 +105,14 @@ export default function Index({ title = '房屋列表' }) {
             search: false,
           }),
 
-          // {
+          {
-          //   title: '产权年限',
+            title: '产权年限',
-          //   dataIndex: 'ownership_term',
+            dataIndex: 'ownership_term',
-          //   render(_, record) {
+            render(_, record) {
-          //     return `${record?.ownership_term || '-'} 年`;
+              return `${record?.ownership_term || '-'} 年`;
-          //   },
+            },
-          //   search: false,
+            search: false,
-          // },
+          },
           MyColumns.Option({
             render: (_, item: any, index, action) => (
               <Space key={index}>

src/pages/banner/index.tsx

@@ -14,7 +14,7 @@ import BannerCreate from './modals/BannerCreate';
 import BannerShow from './modals/BannerShow';
 import BannerUpdate from './modals/BannerUpdate';
 
-export default function Index({ title = '内容管理' }) {
+export default function Index({ title = '投放内容' }) {
   const navigate = useNavigate();
 
   // 注册当前页面为标签页

src/pages/banner_space/index.tsx

@@ -13,7 +13,7 @@ import { Space } from 'antd';
 import BannerSpaceCreate from './modals/BannerSpaceCreate';
 import BannerSpaceUpdate from './modals/BannerSpaceUpdate';
 
-export default function Index({ title = '点位管理' }) {
+export default function Index({ title = '投放位置' }) {
   const navigate = useNavigate();
 
   // 注册当前页面为标签页

src/pages/company/$id.tsx

@@ -2,17 +2,15 @@ import { MyPageContainer, usePageTabs } from '@/common';
 import { Apis } from '@/gen/Apis';
 import { ProCard } from '@ant-design/pro-components';
 import { useParams } from '@umijs/max';
-import { Space, Tabs } from 'antd';
+import { Tabs } from 'antd';
 import { useEffect, useState } from 'react';
-
-import Assets from './components/Assets';
 import CompanyApps from './components/CompanyApps';
 import ComponentsInfo from './components/ComponentsInfo';
 import Employees from './components/Employees';
 import Organizations from './components/Organizations';
 import Positions from './components/Positions';
+import Projects from './components/Projects';
 import ReceiptAccounts from './components/ReceiptAccounts';
-import CompanyUpdate from './modals/CompanyUpdate';
 
 export default function Show({ title }: { title?: string } = {}) {
   const { id } = useParams<{ id: string }>();
@@ -21,7 +19,7 @@ export default function Show({ title }: { title?: string } = {}) {
   // 注册当前页面为标签页
   const { addTab } = usePageTabs({
     tabKey: `company-show-${id}`,
-    tabLabel: '配置:' + (data?.short_name || title || '资产详情'),
+    tabLabel: data?.short_name || title || '资产详情',
   });
   const loadShow = () => {
     let paramsId: any = { id: id ?? 0 };
@@ -43,37 +41,37 @@ export default function Show({ title }: { title?: string } = {}) {
 
   let items = [
     {
-      label: '1-项目配置',
+      label: '项目管理',
       key: '1',
       closable: false,
-      children: <Assets item={data} />,
+      children: <Projects item={data} />,
     },
     {
-      label: '2-组织配置',
+      label: '组织管理',
       key: '2',
       closable: false,
       children: <Organizations item={data} />,
     },
     {
-      label: '3-岗位配置',
+      label: '岗位管理',
       key: '3',
       closable: false,
       children: <Positions item={data} />,
     },
     {
-      label: '4-员工配置',
+      label: '员工管理',
       key: '4',
       closable: false,
       children: <Employees item={data} />,
     },
     {
-      label: '5-账号配置',
+      label: '收款账号',
       key: '5',
       closable: false,
       children: <ReceiptAccounts item={data} />,
     },
     {
-      label: '6-应用配置',
+      label: '应用管理',
       key: '6',
       closable: false,
       children: <CompanyApps item={data} />,
@@ -81,24 +79,7 @@ export default function Show({ title }: { title?: string } = {}) {
   ];
   return (
     <MyPageContainer title={title}>
-      {/* <ComponentsInfo item={data} /> */}
+      <ComponentsInfo item={data} />
-      <ProCard
-        title={`${data?.name} (${data?.short_name})`}
-        extra={
-          <Space>
-            <ComponentsInfo
-              item={{ ...data, type: 'primary' }}
-              title="查看"
-              reload={loadShow}
-            />
-            <CompanyUpdate item={data} title="机构" reload={loadShow} />
-          </Space>
-        }
-      >
-        <div>
-          * 您可在以下页签中对应配置：项目、组织、岗位、员工、账号、应用；
-        </div>
-      </ProCard>
       <ProCard>
         <Tabs type="card" items={data?.id ? items : []} />
       </ProCard>

src/pages/company/components/ComponentsInfo.tsx

@@ -1,69 +1,62 @@
 import { MyBetaModalFormProps, renderTextHelper } from '@/common';
-import { MyModal } from '@/components/MyModal';
 import { CompaniesMerchantTypeEnum } from '@/gen/Enums';
 import { ProCard, ProDescriptions } from '@ant-design/pro-components';
 import { Space } from 'antd';
+import CompanyUpdate from '../modals/CompanyUpdate';
 
 export default function info(props: MyBetaModalFormProps) {
   return (
-    <MyModal
+    <Space direction="vertical" style={{ width: '100%' }}>
-      title={props.title || '查看'}
+      <ProCard extra={props.extra}>
-      type={props.item?.type || 'primary'}
+        <ProDescriptions bordered>
-      width="1000px"
+          <ProDescriptions.Item label="机构简称">
-      node={
+            {props?.item?.short_name}
-        <Space direction="vertical" style={{ width: '100%' }}>
+          </ProDescriptions.Item>
-          <ProCard extra={props.extra}>
+          <ProDescriptions.Item label="机构名称" span={2}>
-            <ProDescriptions bordered>
+            <Space>
-              <ProDescriptions.Item label="机构简称">
+              {props?.item?.name}
-                {props?.item?.short_name}
+              <CompanyUpdate
-              </ProDescriptions.Item>
+                item={props?.item}
-              <ProDescriptions.Item label="机构名称" span={2}>
+                title="机构"
-                <Space>
+                reload={props?.reload}
-                  {props?.item?.name}
+              />
-                  {/* <CompanyUpdate
+            </Space>
-                    item={props?.item}
+          </ProDescriptions.Item>
-                    title="机构"
+          <ProDescriptions.Item label="商户类型">
-                    reload={props?.reload}
+            <renderTextHelper.Tag
-                  /> */}
+              Enums={CompaniesMerchantTypeEnum}
-                </Space>
+              value={props?.item?.merchant_type}
-              </ProDescriptions.Item>
+              key="merchant_type"
-              <ProDescriptions.Item label="商户类型">
+            />
-                <renderTextHelper.Tag
+          </ProDescriptions.Item>
-                  Enums={CompaniesMerchantTypeEnum}
-                  value={props?.item?.merchant_type}
-                  key="merchant_type"
-                />
-              </ProDescriptions.Item>
 
-              <ProDescriptions.Item label="营业执照号" span={2}>
+          <ProDescriptions.Item label="营业执照号" span={2}>
-                {props?.item?.business_license_number}
+            {props?.item?.business_license_number}
-              </ProDescriptions.Item>
+          </ProDescriptions.Item>
 
-              <ProDescriptions.Item label="联系人姓名">
+          <ProDescriptions.Item label="联系人姓名">
-                {props?.item?.contact_name}
+            {props?.item?.contact_name}
-              </ProDescriptions.Item>
+          </ProDescriptions.Item>
-              <ProDescriptions.Item label="联系人手机">
+          <ProDescriptions.Item label="联系人手机">
-                {props?.item?.contact_phone}
+            {props?.item?.contact_phone}
-              </ProDescriptions.Item>
+          </ProDescriptions.Item>
-              <ProDescriptions.Item label="联系人邮箱">
+          <ProDescriptions.Item label="联系人邮箱">
-                {props?.item?.contact_email}
+            {props?.item?.contact_email}
-              </ProDescriptions.Item>
+          </ProDescriptions.Item>
-              <ProDescriptions.Item label="机构地址">
+          <ProDescriptions.Item label="机构地址">
-                {props?.item?.province || ''}
+            {props?.item?.province || ''}
-                {props?.item?.city || ''}
+            {props?.item?.city || ''}
-                {props?.item?.district || ''}
+            {props?.item?.district || ''}
-                {props?.item?.address || ''}
+            {props?.item?.address || ''}
-              </ProDescriptions.Item>
+          </ProDescriptions.Item>
-              <ProDescriptions.Item label="创建日期">
+          <ProDescriptions.Item label="创建日期">
-                {props?.item?.created_at}
+            {props?.item?.created_at}
-              </ProDescriptions.Item>
+          </ProDescriptions.Item>
-              <ProDescriptions.Item label="最近修改">
+          <ProDescriptions.Item label="最近修改">
-                {props?.item?.updated_at}
+            {props?.item?.updated_at}
-              </ProDescriptions.Item>
+          </ProDescriptions.Item>
-            </ProDescriptions>
+        </ProDescriptions>
-          </ProCard>
+      </ProCard>
-        </Space>
+    </Space>
-      }
-    />
   );
 }

src/pages/company/components/Organizations.tsx

@@ -33,7 +33,7 @@ export default function Organizations(props: MyBetaModalFormProps) {
           />,
         ]}
         // search={false}
-        // options={false}
+        options={false}
         columns={[
           MyColumns.EnumTag({
             title: '组织类型',

src/pages/company/components/Projects.tsx

@@ -9,7 +9,6 @@ import {
   AssetProjectsPropertyTypeEnum,
   AssetProjectsStatusEnum,
 } from '@/gen/Enums';
-import AssetCreate from '@/pages/asset/modals/AssetCreate';
 import { ProTable } from '@ant-design/pro-components';
 import { Space } from 'antd';
 import { useNavigate } from 'react-router-dom';
@@ -28,16 +27,16 @@ export default function Index(props: MyBetaModalFormProps) {
             Apis.Asset.AssetProjects.List,
           )
         }
-        toolBarRender={(action) => [
+        // toolBarRender={(action) => [
-          <AssetCreate
+        //   <OrganizationsCreate
-            key="Create"
+        //     key="Create"
-            reload={action?.reload}
+        //     reload={action?.reload}
-            item={props?.item}
+        //     item={props?.item}
-            title="项目"
+        //     title="组织"
-          />,
+        //   />,
-        ]}
+        // ]}
         // search={false}
-        // options={false}
+        options={false}
         columns={[
           MyColumns.ID(),
           {

src/pages/company/index.tsx

@@ -10,9 +10,7 @@ import { CompaniesMerchantTypeEnum } from '@/gen/Enums';
 import { ProTable } from '@ant-design/pro-components';
 import { useNavigate } from '@umijs/max';
 import { Space } from 'antd';
-import ComponentsInfo from './components/ComponentsInfo';
 import CompanyCreate from './modals/CompanyCreate';
-import CompanyUpdate from './modals/CompanyUpdate';
 
 export default function Index({ title = '机构列表' }) {
   const navigate = useNavigate();
@@ -63,18 +61,8 @@ export default function Index({ title = '机构列表' }) {
           MyColumns.Option({
             render: (_, item: any, index, action) => (
               <Space key={index}>
-                <ComponentsInfo
-                  item={item}
-                  title="查看"
-                  reload={action?.reload}
-                />
-                <CompanyUpdate
-                  item={{ ...item, type: 'link' }}
-                  title="机构"
-                  reload={action?.reload}
-                />
                 <MyButtons.View
-                  title="配置"
+                  title="详情"
                   onClick={() => {
                     navigate(`/company/${item.id}`);
                   }}

src/pages/examine/house_registers_audit/modals/Audit.tsx

@@ -13,6 +13,7 @@ import { Apis } from '@/gen/Apis';
 import {
   HouseOccupantsCardTypeEnum,
   HouseOccupantsHouseRelationEnum,
+  HouseRegistersHouseStatusEnum,
   HouseRegistersStatusEnum,
   HouseRegistersTypeEnum,
 } from '@/gen/Enums';
@@ -56,17 +57,17 @@ export default function Update(props: MyBetaModalFormProps) {
           valueType: 'text',
           renderFormItem: () => (
             <Space direction="vertical" style={{ width: '100%' }}>
-              <ProCard size="small">
+              <ProCard title="基本信息" size="small">
-                <ProDescriptions bordered size="small" column={1}>
+                <ProDescriptions bordered size="small" column={2}>
                   <ProDescriptions.Item label="房屋信息">
                     {props?.item?.asset_house?.full_name || '-'}
                   </ProDescriptions.Item>
-                  {/* <ProDescriptions.Item label="房屋状态">
+                  <ProDescriptions.Item label="房屋状态">
                     <renderTextHelper.Tag
                       Enums={HouseRegistersHouseStatusEnum}
                       value={props?.item?.house_status}
                     />
-                  </ProDescriptions.Item> */}
+                  </ProDescriptions.Item>
                   <ProDescriptions.Item label="登记类型">
                     <renderTextHelper.Tag
                       Enums={HouseRegistersTypeEnum}

src/pages/tabs-demo.tsx

@@ -0,0 +1,243 @@
+import React from 'react';
+import { Button, Card, Space, Divider, Row, Col, Statistic, Alert } from 'antd';
+import { 
+  PlusOutlined, 
+  UserOutlined, 
+  SettingOutlined, 
+  HomeOutlined,
+  FileTextOutlined,
+  TeamOutlined
+} from '@ant-design/icons';
+import { MyPageContainer, usePageTabs } from '@/common';
+import { history } from '@umijs/max';
+
+/**
+ * 多标签页功能演示页面
+ * 展示完整的标签页管理功能
+ */
+export default function TabsDemo() {
+  const tabsApi = usePageTabs({
+    tabKey: 'tabs-demo',
+    tabLabel: '标签页演示',
+    closable: false // 演示页面不可关闭
+  });
+
+  // 模拟打开不同的页面标签
+  const openTab = (key: string, label: string, path: string) => {
+    tabsApi.addTab({
+      key,
+      label,
+      path,
+      closable: true
+    });
+    // 注意：在实际项目中，这里应该使用 history.push(path)
+    // 由于这是演示，我们只是添加标签而不实际跳转
+    console.log(`模拟跳转到: ${path}`);
+  };
+
+  const demoTabs = [
+    {
+      key: 'employees',
+      label: '员工管理',
+      path: '/employees',
+      icon: <TeamOutlined />,
+      description: '管理公司员工信息'
+    },
+    {
+      key: 'companies',
+      label: '公司管理',
+      path: '/company/companies',
+      icon: <HomeOutlined />,
+      description: '管理公司基本信息'
+    },
+    {
+      key: 'house-bills',
+      label: '房屋账单',
+      path: '/house_bills',
+      icon: <FileTextOutlined />,
+      description: '查看和管理房屋账单'
+    },
+    {
+      key: 'system-admins',
+      label: '系统管理员',
+      path: '/system/admins',
+      icon: <UserOutlined />,
+      description: '管理系统管理员账户'
+    },
+    {
+      key: 'system-roles',
+      label: '角色管理',
+      path: '/system/sys_roles',
+      icon: <SettingOutlined />,
+      description: '管理系统角色权限'
+    }
+  ];
+
+  return (
+    <MyPageContainer
+      enableTabs
+      tabKey="tabs-demo"
+      tabLabel="标签页演示"
+      title="多标签页功能演示"
+    >
+      <Alert
+        message="多标签页功能演示"
+        description="这个页面展示了 MyPageContainer 的多标签页功能。您可以点击下方按钮打开新的标签页，然后右键点击标签体验各种操作。"
+        type="info"
+        showIcon
+        style={{ marginBottom: 24 }}
+      />
+      
+      {/* 统计信息 */}
+      <Row gutter={16} style={{ marginBottom: 24 }}>
+        <Col span={6}>
+          <Card>
+            <Statistic
+              title="当前标签数量"
+              value={tabsApi.getTabs().length}
+              prefix={<FileTextOutlined />}
+            />
+          </Card>
+        </Col>
+        <Col span={6}>
+          <Card>
+            <Statistic
+              title="激活标签"
+              value={tabsApi.getActiveKey()}
+              valueStyle={{ fontSize: '16px' }}
+            />
+          </Card>
+        </Col>
+        <Col span={6}>
+          <Card>
+            <Statistic
+              title="可用操作"
+              value={6}
+              suffix="种"
+              prefix={<SettingOutlined />}
+            />
+          </Card>
+        </Col>
+        <Col span={6}>
+          <Card>
+            <Statistic
+              title="演示页面"
+              value={demoTabs.length}
+              suffix="个"
+              prefix={<PlusOutlined />}
+            />
+          </Card>
+        </Col>
+      </Row>
+
+      {/* 快速打开标签页 */}
+      <Card title="🚀 快速打开页面" style={{ marginBottom: 24 }}>
+        <Row gutter={[16, 16]}>
+          {demoTabs.map(tab => (
+            <Col span={8} key={tab.key}>
+              <Card
+                size="small"
+                hoverable
+                onClick={() => openTab(tab.key, tab.label, tab.path)}
+                style={{ cursor: 'pointer', textAlign: 'center' }}
+              >
+                <div style={{ fontSize: '24px', marginBottom: '8px' }}>
+                  {tab.icon}
+                </div>
+                <div style={{ fontWeight: 'bold', marginBottom: '4px' }}>
+                  {tab.label}
+                </div>
+                <div style={{ fontSize: '12px', color: '#666' }}>
+                  {tab.description}
+                </div>
+              </Card>
+            </Col>
+          ))}
+        </Row>
+      </Card>
+
+      {/* 标签页操作 */}
+      <Card title="🎛️ 标签页操作" style={{ marginBottom: 24 }}>
+        <Space wrap size="middle">
+          <Button 
+            type="primary"
+            onClick={() => tabsApi.closeOtherTabs()}
+            disabled={tabsApi.getTabs().length <= 1}
+          >
+            关闭其他标签
+          </Button>
+          
+          <Button 
+            onClick={() => tabsApi.closeLeftTabs()}
+            disabled={tabsApi.getTabs().length <= 1}
+          >
+            关闭左侧标签
+          </Button>
+          
+          <Button 
+            onClick={() => tabsApi.closeRightTabs()}
+            disabled={tabsApi.getTabs().length <= 1}
+          >
+            关闭右侧标签
+          </Button>
+          
+          <Button 
+            onClick={() => tabsApi.refreshTab()}
+          >
+            刷新当前标签
+          </Button>
+          
+          <Button 
+            danger
+            onClick={() => {
+              const tabs = tabsApi.getTabs();
+              const closableTabs = tabs.filter(tab => tab.closable);
+              closableTabs.forEach(tab => tabsApi.removeTab(tab.key));
+            }}
+            disabled={tabsApi.getTabs().filter(tab => tab.closable).length === 0}
+          >
+            关闭所有可关闭标签
+          </Button>
+        </Space>
+      </Card>
+
+      {/* 功能说明 */}
+      <Card title="📖 功能说明">
+        <Row gutter={24}>
+          <Col span={12}>
+            <h4>🎯 核心功能</h4>
+            <ul style={{ lineHeight: '1.8' }}>
+              <li><strong>多标签页支持</strong>：支持同时打开多个页面标签</li>
+              <li><strong>右键菜单</strong>：右键点击标签页显示操作菜单</li>
+              <li><strong>智能导航</strong>：关闭标签时自动切换到相邻标签</li>
+              <li><strong>状态持久化</strong>：标签页状态在组件间共享</li>
+              <li><strong>自定义样式</strong>：支持主题定制和样式覆盖</li>
+            </ul>
+          </Col>
+          
+          <Col span={12}>
+            <h4>🖱️ 右键菜单操作</h4>
+            <ul style={{ lineHeight: '1.8' }}>
+              <li><strong>刷新</strong>：重新加载当前标签页</li>
+              <li><strong>关闭</strong>：关闭当前标签页</li>
+              <li><strong>关闭其他</strong>：关闭除当前标签外的所有标签</li>
+              <li><strong>关闭左侧</strong>：关闭当前标签左侧的所有标签</li>
+              <li><strong>关闭右侧</strong>：关闭当前标签右侧的所有标签</li>
+            </ul>
+          </Col>
+        </Row>
+        
+        <Divider />
+        
+        <h4>💡 使用提示</h4>
+        <ul style={{ lineHeight: '1.8' }}>
+          <li>点击上方的页面卡片可以快速打开对应的标签页</li>
+          <li>右键点击任意标签页可以看到完整的操作菜单</li>
+          <li>使用工具栏按钮可以批量操作标签页</li>
+          <li>演示页面（当前页面）被设置为不可关闭</li>
+          <li>在实际项目中，标签页会自动与路由系统集成</li>
+        </ul>
+      </Card>
+    </MyPageContainer>
+  );
+}