添加查看详情功能

.hintrc

@@ -0,0 +1,5 @@
+{
+  "extends": [
+    "development"
+  ]
+}

.vs/VSWorkspaceState.json

@@ -0,0 +1,6 @@
+{
+  "ExpandedNodes": [
+    ""
+  ],
+  "PreviewInSolutionExplorer": false
+}

src/pages/Classify/Industry/edit.tsx

@@ -6,11 +6,17 @@ import {
   ProFormRadio,
   ProFormSelect,
   ProFormText,
+  ProDescriptions,
 } from '@ant-design/pro-components';
 import { Form } from 'antd';
 import { DictValueEnumObj } from '@/components/DictTag';
 import { FormattedMessage } from '@@/exports';
 import { getCmsIndustryTree } from '@/services/classify/industry';
+import { values } from 'lodash';
+
+interface IndustryDetail extends API.ClassifyIndustry.IndustryRow {
+  parentName: string;
+}
 
 export type ListFormProps = {
   onCancel: (flag?: boolean, formVars?: unknown) => void;
@@ -19,17 +25,30 @@ export type ListFormProps = {
   values?: Partial<API.ClassifyIndustry.IndustryRow>;
   // industryStatusEnum: DictOptionType[];
   industryStatusEnum: DictValueEnumObj;
+  mode?: 'view' | 'edit' | 'create';
 };
 
 const listEdit: React.FC<ListFormProps> = (props) => {
   const [form] = Form.useForm();
-  const { industryStatusEnum } = props;
+  const { industryStatusEnum, mode = props.values ? 'edit' : 'create',values } = props;
   useEffect(() => {
     form.resetFields();
-    if (props.values) {
+    if (values) {
-      form.setFieldsValue(props.values);
+      form.setFieldsValue(values);
     }
-  }, [form, props]);
+  }, [form,values?.industryId]);
+
+  const getSafeDetailData = (
+    data?: Partial<API.ClassifyIndustry.IndustryRow>
+  ): IndustryDetail => {
+    return{
+    industryId: data?.industryId ?? 0,
+    industryName: data?.industryName ?? '',
+    orderNum: data?.orderNum ?? 0,
+    parentId: data?.parentId ?? 0,
+    parentName: (data as any)?.parentName ?? '无', // 或通过 parentId 映射
+    status: data?.status ?? '0',}
+  };
 
   const handleCancel = () => {
     props.onCancel();
@@ -39,13 +58,45 @@ const listEdit: React.FC<ListFormProps> = (props) => {
   const handleFinish = async (values: Record<string, any>) => {
     props.onSubmit(values as API.ClassifyIndustry.IndustryRow);
   };
-
+// check
+if (mode === 'view') {
   return (
-    <ModalForm<{
+    <ModalForm
-      name: string;
+      title="行业详情"
-      company: string;
+      open={props.open}
-    }>
+      width={800}
-      title={`${props.values ? '编辑' : '新增'}行业`}
+      modalProps={{
+        destroyOnClose: true,
+        onCancel: () => handleCancel(),
+        footer: null, 
+      }}
+      submitter={false} 
+      >
+      <ProDescriptions<IndustryDetail>
+          column={1}
+          dataSource={getSafeDetailData(values)}
+          loading={!values}
+        >
+          <ProDescriptions.Item label="行业ID" dataIndex="industryId" />
+          <ProDescriptions.Item label="行业名称" dataIndex="industryName" />
+          <ProDescriptions.Item label="显示顺序" dataIndex="orderNum" />
+          <ProDescriptions.Item 
+            label="父行业" 
+            dataIndex="parentName" 
+            valueType="text"// 假设API返回中有parentName字段
+          />
+          <ProDescriptions.Item 
+            label="行业状态" 
+            dataIndex="status"
+            valueEnum={industryStatusEnum}
+          />
+        </ProDescriptions>
+      </ModalForm>
+    );
+  }
+  return (
+    <ModalForm
+      title={`${values ? '编辑' : '新增'}行业`}
       form={form}
       autoFocusFirstInput
       open={props.open}

src/pages/Classify/Industry/index.tsx

@@ -2,7 +2,7 @@ import React, { Fragment, useEffect, useRef, useState } from 'react';
 import { FormattedMessage, useAccess } from '@umijs/max';
 import { Button, FormInstance, message, Modal } from 'antd';
 import { ActionType, ProColumns, ProTable } from '@ant-design/pro-components';
-import { DeleteOutlined, FormOutlined, PlusOutlined } from '@ant-design/icons';
+import { AlignLeftOutlined, DeleteOutlined, FormOutlined, PlusOutlined } from '@ant-design/icons';
 import EditCompanyListRow from './edit';
 import {
   addCmsIndustryIndustryt,
@@ -49,7 +49,6 @@ const handleExport = async (values: API.ClassifyIndustry.Params) => {
 
 function ManagementList() {
   const access = useAccess();
-
   const formTableRef = useRef<FormInstance>();
   const actionRef = useRef<ActionType>();
 
@@ -96,6 +95,19 @@ function ManagementList() {
       dataIndex: 'industryId',
       width: 300,
       render: (industryId, record) => [
+        <Button
+          type="link"
+          size="small"
+          key="view"
+          icon={<AlignLeftOutlined />}
+          hidden={!access.hasPerms('area:business:List.view')}
+          onClick={() => {
+            setModalVisible(true);
+            setCurrentRow(record);
+      }}
+      >
+        详情
+    </Button>,
         <Button
           type="link"
           size="small"
@@ -142,8 +154,6 @@ function ManagementList() {
     <Fragment>
       <div style={{ width: '100%', float: 'right' }}>
         <ProTable<API.ClassifyIndustry.IndustryRow>
-          // params 是需要自带的参数
-          // 这个参数优先级更高，会覆盖查询表单的参数
           actionRef={actionRef}
           formRef={formTableRef}
           rowKey="industryId"
@@ -185,7 +195,7 @@ function ManagementList() {
           ]}
         />
       </div>
-      <EditCompanyListRow
+<EditCompanyListRow
   open={modalVisible}
   onSubmit={async (values) => {
     let resData;
@@ -213,7 +223,12 @@ function ManagementList() {
   }}
   industryStatusEnum={industryStatusEnum}
   values={currentRow}
-      ></EditCompanyListRow>
+  mode={
+    currentRow?.industryId 
+      ? access.hasPerms('area:business:List.update') ? 'edit' : 'view' 
+      : 'create'
+  }
+/>
     </Fragment>
   );
 }

src/pages/Company/List/edit.tsx

@@ -8,8 +8,8 @@ import {
   ProFormTextArea,
   ProFormTreeSelect,
 } from '@ant-design/pro-components';
-import { Form } from 'antd';
+import { Form, Button, message, Modal, Descriptions } from 'antd';
-import { DictValueEnumObj } from '@/components/DictTag';
+import DictTag, { DictValueEnumObj } from '@/components/DictTag';
 import { getCmsIndustryTree } from '@/services/classify/industry';
 
 export type ListFormProps = {
@@ -17,27 +17,17 @@ export type ListFormProps = {
   onSubmit: (values: API.CompanyList.Company) => Promise<void>;
   open: boolean;
   values?: Partial<API.CompanyList.Company>;
-  // jobGroupOptions: DictOptionType[];
   scaleEnum?: DictValueEnumObj;
 };
 
-const waitTime = (time: number = 100) => {
+const ListEdit: React.FC<ListFormProps> = (props) => {
-  return new Promise((resolve) => {
-    setTimeout(() => {
-      resolve(true);
-    }, time);
-  });
-};
-
-const listEdit: React.FC<ListFormProps> = (props) => {
   const [form] = Form.useForm();
-  const { scaleEnum } = props;
+
   useEffect(() => {
     form.resetFields();
     if (props.values) {
       form.setFieldsValue({
         ...props.values,
-        // industry: props.values.industry.split(','),
       });
     }
   }, [form, props]);
@@ -48,8 +38,7 @@ const listEdit: React.FC<ListFormProps> = (props) => {
   };
 
   const handleFinish = async (values: Record<string, any>) => {
-    // values.industry = values.industry.join(',');
+    await props.onSubmit(values as API.CompanyList.Company);
-    props.onSubmit(values as API.CompanyList.Company);
   };
 
   return (
@@ -75,14 +64,13 @@ const listEdit: React.FC<ListFormProps> = (props) => {
           width="md"
           name="scale"
           label={'单位规模'}
-          valueEnum={scaleEnum}
+          valueEnum={props.scaleEnum}
           placeholder="请选择单位规模"
           rules={[{ required: true, message: '请选择单位规模!' }]}
         />
       </ProForm.Group>
       <ProForm.Group>
         <ProFormText width="md" name="code" label="信用代码" placeholder="请输入信用代码" />
-        {/*<ProFormText width="md" name="industry" label="主要行业" placeholder="请输入主要行业" />*/}
         <ProFormTreeSelect
           name="industry"
           label="主要行业"
@@ -124,4 +112,44 @@ const listEdit: React.FC<ListFormProps> = (props) => {
   );
 };
 
-export default listEdit;
+// 独立的详情查看组件
+export const CompanyDetailView = ({ 
+  open, 
+  onCancel, 
+  record,
+  scaleEnum 
+}: { 
+  open: boolean; 
+  onCancel: () => void; 
+  record?: API.CompanyList.Company;
+  scaleEnum?: DictValueEnumObj;
+}) => {
+  return (
+    <Modal
+      title="公司详情"
+      open={open}
+      width={600}
+      onCancel={onCancel}
+      footer={[
+        <Button key="back" onClick={onCancel}>
+          关闭
+        </Button>,
+      ]}
+    >
+      <div style={{ padding: '20px' }}>
+        <Descriptions column={1} bordered>
+          <Descriptions.Item label="单位名称">{record?.name}</Descriptions.Item>
+          <Descriptions.Item label="主要行业">{record?.industry}</Descriptions.Item>
+          <Descriptions.Item label="单位规模">
+            <DictTag enums={scaleEnum} value={record?.scale} />
+          </Descriptions.Item>
+          <Descriptions.Item label="公司位置">{record?.location}</Descriptions.Item>
+          <Descriptions.Item label="信用代码">{record?.code}</Descriptions.Item>
+          <Descriptions.Item label="单位介绍">{record?.description}</Descriptions.Item>
+        </Descriptions>
+      </div>
+    </Modal>
+  );
+};
+
+export default ListEdit;

src/pages/Company/List/index.tsx

@@ -1,8 +1,8 @@
 import React, { Fragment, useEffect, useRef, useState } from 'react';
 import { FormattedMessage, useAccess } from '@umijs/max';
-import { Button, FormInstance, message, Modal } from 'antd';
+import { Button, FormInstance, message, Modal, Descriptions } from 'antd';
 import { ActionType, ProColumns, ProTable } from '@ant-design/pro-components';
-import { DeleteOutlined, FormOutlined, PlusOutlined } from '@ant-design/icons';
+import { DeleteOutlined, FormOutlined, PlusOutlined, EyeOutlined, AlignLeftOutlined } from '@ant-design/icons';
 import EditCompanyListRow from './edit';
 import {
   addCmsCompanyList,
@@ -14,7 +14,54 @@ import {
 import { getDictValueEnum } from '@/services/system/dict';
 import DictTag from '@/components/DictTag';
 
-const handleRemoveOne = async (jobId: string) => {
+// 详情查看组件
+const CompanyDetailModal = ({ 
+  visible, 
+  onCancel, 
+  record,
+  scaleEnum 
+}: { 
+  visible: boolean; 
+  onCancel: () => void; 
+  record?: API.CompanyList.Company;
+  scaleEnum: Record<string, any>;
+}) => {
+  return (
+    <Modal
+      title="公司详情"
+      open={visible}
+      width={600}
+      onCancel={onCancel}
+      footer={[
+        <Button key="back" onClick={onCancel}>
+          关闭
+        </Button>,
+      ]}
+    >
+      <Descriptions column={1} bordered>
+        <Descriptions.Item label="公司名称">{record?.name}</Descriptions.Item>
+        <Descriptions.Item label="公司行业">{record?.industry}</Descriptions.Item>
+        <Descriptions.Item label="公司规模">
+          <DictTag enums={scaleEnum} value={record?.scale} />
+        </Descriptions.Item>
+        <Descriptions.Item label="公司位置">{record?.location}</Descriptions.Item>
+      </Descriptions>
+    </Modal>
+  );
+};
+
+function ManagementList() {
+  const access = useAccess();
+
+  const formTableRef = useRef<FormInstance>();
+  const actionRef = useRef<ActionType>();
+
+  const [currentRow, setCurrentRow] = useState<API.CompanyList.Company>();
+  const [modalVisible, setModalVisible] = useState<boolean>(false);
+  const [detailVisible, setDetailVisible] = useState<boolean>(false);
+  const [scaleEnum, setScaleEnum] = useState<Record<string, any>>({});
+
+  const handleRemoveOne = async (jobId: string) => {
     const hide = message.loading('正在删除');
     if (!jobId) return true;
     try {
@@ -31,9 +78,9 @@ const handleRemoveOne = async (jobId: string) => {
       message.error('删除失败，请重试');
       return false;
     }
-};
+  };
 
-const handleExport = async (values: API.CompanyList.Params) => {
+  const handleExport = async (values: API.CompanyList.Params) => {
     const hide = message.loading('正在导出');
     try {
       await exportCmsCompanyList(values);
@@ -45,17 +92,7 @@ const handleExport = async (values: API.CompanyList.Params) => {
       message.error('导出失败，请重试');
       return false;
     }
-};
+  };
-
-function ManagementList() {
-  const access = useAccess();
-
-  const formTableRef = useRef<FormInstance>();
-  const actionRef = useRef<ActionType>();
-
-  const [currentRow, setCurrentRow] = useState<API.CompanyList.Company>();
-  const [modalVisible, setModalVisible] = useState<boolean>(false);
-  const [scaleEnum, setScaleEnum] = useState<any>([]);
 
   useEffect(() => {
     getDictValueEnum('scale', true, true).then((data) => {
@@ -63,8 +100,6 @@ function ManagementList() {
     });
   }, []);
 
-  const editSubmit = () => {};
-
   const columns: ProColumns<API.CompanyList.Company>[] = [
     {
       title: '公司名称',
@@ -102,6 +137,19 @@ function ManagementList() {
       dataIndex: 'companyId',
       width: 300,
       render: (companyId, record) => [
+        <Button
+          type="link"
+          size="small"
+          key="detail"
+          icon={<AlignLeftOutlined />}
+          hidden={!access.hasPerms('area:business:List.view')}
+          onClick={() => {
+            setCurrentRow(record);
+            setDetailVisible(true);
+          }}
+        >
+          详情
+        </Button>,
         <Button
           type="link"
           size="small"
@@ -144,12 +192,11 @@ function ManagementList() {
       ],
     },
   ];
+
   return (
     <Fragment>
       <div style={{ width: '100%', float: 'right' }}>
         <ProTable<API.CompanyList.Company>
-          // params 是需要自带的参数
-          // 这个参数优先级更高，会覆盖查询表单的参数
           actionRef={actionRef}
           formRef={formTableRef}
           rowKey="companyId"
@@ -157,12 +204,11 @@ function ManagementList() {
           columns={columns}
           request={(params) =>
             getCmsCompanyList({ ...params } as API.CompanyList.Params).then((res) => {
-              const result = {
+              return {
                 data: res.rows,
                 total: res.total,
                 success: true,
               };
-              return result;
             })
           }
           toolBarRender={() => [
@@ -182,7 +228,7 @@ function ManagementList() {
               key="export"
               hidden={!access.hasPerms('system:user:export')}
               onClick={async () => {
-                const searchVal = formTableRef.current && formTableRef.current.getFieldsValue();
+                const searchVal = formTableRef.current?.getFieldsValue();
                 handleExport(searchVal as API.CompanyList.Params);
               }}
             >
@@ -192,10 +238,10 @@ function ManagementList() {
           ]}
         />
       </div>
+
       <EditCompanyListRow
         open={modalVisible}
         onSubmit={async (values) => {
-          console.log(values);
           let resData;
           if (values.companyId) {
             resData = await putCmsCompanyList(values);
@@ -205,14 +251,8 @@ function ManagementList() {
           if (resData.code === 200) {
             setModalVisible(false);
             setCurrentRow(undefined);
-            if (values.companyId) {
+            message.success(values.companyId ? '修改成功' : '新增成功');
-              message.success('修改成功');
+            actionRef.current?.reload();
-            } else {
-              message.success('新增成功');
-            }
-            if (actionRef.current) {
-              actionRef.current.reload();
-            }
           }
         }}
         onCancel={() => {
@@ -221,7 +261,17 @@ function ManagementList() {
         }}
         values={currentRow}
         scaleEnum={scaleEnum}
-      ></EditCompanyListRow>
+      />
+
+      <CompanyDetailModal
+        visible={detailVisible}
+        onCancel={() => {
+          setDetailVisible(false);
+          setCurrentRow(undefined);
+        }}
+        record={currentRow}
+        scaleEnum={scaleEnum}
+      />
     </Fragment>
   );
 }

src/pages/Management/List/edit.tsx

@@ -5,6 +5,7 @@ import {
   ProFormSelect,
   ProFormText,
   ProFormTextArea,
+  ProDescriptions,
 } from '@ant-design/pro-components';
 import { Form } from 'antd';
 import React, { useEffect } from 'react';
@@ -19,6 +20,7 @@ export type ListFormProps = {
   educationEnum: DictValueEnumObj;
   experienceEnum: DictValueEnumObj;
   areaEnum: DictValueEnumObj;
+  mode?: 'view' | 'edit' | 'create'; 
 };
 
 const waitTime = (time: number = 100) => {
@@ -32,6 +34,7 @@ const waitTime = (time: number = 100) => {
 const listEdit: React.FC<ListFormProps> = (props) => {
   const [form] = Form.useForm<{ name: string; company: string; companyName: number }>();
   const { educationEnum, experienceEnum, areaEnum } = props;
+  const { mode = props.values ? 'edit' : 'create' } = props;
   useEffect(() => {
     form.resetFields();
     if (props.values) {
@@ -40,7 +43,7 @@ const listEdit: React.FC<ListFormProps> = (props) => {
         jobLocationAreaCode: String(props.values.jobLocationAreaCode || ''),
       });
     }
-  }, [form, props]);
+  }, [form, props.values?.jobID]);
 
   const handleCancel = () => {
     props.onCancel();
@@ -54,13 +57,59 @@ const listEdit: React.FC<ListFormProps> = (props) => {
   const handleChange = (_: string, value: any) => {
     form.setFieldValue('companyName', value.label);
   };
-
+  if (mode === 'view') {
+    return (
+      <ModalForm
+        title="岗位详情"
+        open={props.open}
+        width={800}
+        modalProps={{
+          destroyOnClose: true,
+          onCancel: () => handleCancel(),
+          footer: null, 
+        }}
+        submitter={false}
+      >
+         <ProDescriptions<API.ManagementList.Manage>
+          column={2}
+          dataSource={props.values || {}}
+        >
+          <ProDescriptions.Item dataIndex="jobTitle" label="岗位名称" />
+          <ProDescriptions.Item dataIndex="companyName" label="招聘公司" />
+          <ProDescriptions.Item dataIndex="minSalary" label="最低薪资(元/月)" />
+          <ProDescriptions.Item dataIndex="maxSalary" label="最高薪资(元/月)" />
+          <ProDescriptions.Item 
+            dataIndex="education" 
+            label="学历要求"
+            valueEnum={educationEnum}
+          />
+          <ProDescriptions.Item 
+            dataIndex="experience" 
+            label="工作经验"
+            valueEnum={experienceEnum}
+          />
+          <ProDescriptions.Item 
+            dataIndex="jobLocationAreaCode" 
+            label="工作区县"
+            valueEnum={areaEnum}
+          />
+          <ProDescriptions.Item dataIndex="vacancies" label="招聘人数" />
+          <ProDescriptions.Item dataIndex="jobLocation" label="工作地点" />
+          <ProDescriptions.Item 
+            dataIndex="description" 
+            label="岗位描述" 
+            span={2}  // 跨两列显示
+          />
+        </ProDescriptions>
+      </ModalForm>
+    );
+  }
   return (
     <ModalForm<{
       name: string;
       company: string;
     }>
-      title="新建表单"
+       title={mode === 'edit' ? '编辑岗位' : '新建岗位'}
       form={form}
       autoFocusFirstInput
       open={props.open}

src/pages/Management/List/index.tsx

@@ -10,7 +10,7 @@ import {
 } from '@/services/Management/list';
 import { Button, FormInstance, message, Modal, Switch } from 'antd';
 import { ActionType, ProColumns, ProTable } from '@ant-design/pro-components';
-import { BarChartOutlined, DeleteOutlined, FormOutlined, PlusOutlined } from '@ant-design/icons';
+import { AlignLeftOutlined, BarChartOutlined, DeleteOutlined, FormOutlined, PlusOutlined } from '@ant-design/icons';
 import EditManageRow from './edit';
 import { getDictValueEnum } from '@/services/system/dict';
 import DictTag from '@/components/DictTag';
@@ -60,7 +60,7 @@ function ManagementList() {
   const [hotEnum, setHotEnum] = useState<any>([]);
   const [currentRow, setCurrentRow] = useState<API.ManagementList.Manage>();
   const [modalVisible, setModalVisible] = useState<boolean>(false);
-
+  const [mode, setMode] = useState<'view' | 'edit' | 'create'>('create');
   useEffect(() => {
     getDictValueEnum('education', true, true).then((data) => {
       setEducationEnum(data);
@@ -178,6 +178,21 @@ function ManagementList() {
       dataIndex: 'jobId',
       width: 300,
       render: (jobId, record) => [
+        <div key="first-row" style={{ marginBottom: 8, display: 'flex', justifyContent: 'center' }}>
+        <Button
+        type="link"
+        size="small"
+        key="view"
+        icon={<AlignLeftOutlined />}
+        hidden={!access.hasPerms('area:business:List.view')}
+        onClick={() => {
+          setCurrentRow(record);
+          setModalVisible(true);
+          setMode('view'); // 新增状态控制模式
+        }}
+      >
+        查看详情
+      </Button>
       <Button
           type="link"
           size="small"
@@ -187,7 +202,9 @@ function ManagementList() {
           onClick={() => history.push(`/management/see-matching/index/${record.jobId}`)}
         >
           查看申请人
-        </Button>,
+        </Button>
+        </div>,
+        <div key="second-row" style={{ display: 'flex', justifyContent: 'space-evenly'}}>
         <Button
           type="link"
           size="small"
@@ -200,7 +217,7 @@ function ManagementList() {
           }}
         >
           编辑
-        </Button>,
+        </Button>
         <Button
           type="link"
           size="small"
@@ -226,7 +243,8 @@ function ManagementList() {
           }}
         >
           删除
-        </Button>,
+        </Button>
+        </div>
       ],
     },
   ];
@@ -260,6 +278,7 @@ function ManagementList() {
               onClick={async () => {
                 setCurrentRow(undefined);
                 setModalVisible(true);
+                setMode('create');
               }}
             >
               <PlusOutlined /> 新建
@@ -281,6 +300,7 @@ function ManagementList() {
       </div>
       <EditManageRow
         open={modalVisible}
+        mode={mode}
         onSubmit={async (values) => {
           let resData;
           if (values.jobId) {