flat:招聘会添加
This commit is contained in:
@@ -20,28 +20,7 @@ body,
|
|||||||
.ant-pro-sider.ant-layout-sider.ant-pro-sider-fixed {
|
.ant-pro-sider.ant-layout-sider.ant-pro-sider-fixed {
|
||||||
left: unset;
|
left: unset;
|
||||||
}
|
}
|
||||||
.ant-table-cell .ant-table-row-expand-icon {
|
|
||||||
vertical-align: middle;
|
|
||||||
margin-right: 8px;
|
|
||||||
}
|
|
||||||
.ant-table-row {
|
|
||||||
&-level-0 .ant-table-cell:first-child {
|
|
||||||
padding-left: 16px !important;
|
|
||||||
}
|
|
||||||
&-level-1 .ant-table-cell:first-child {
|
|
||||||
padding-left: 40px !important;
|
|
||||||
}
|
|
||||||
&-level-2 .ant-table-cell:first-child {
|
|
||||||
padding-left: 64px !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.ant-table-row .ant-table-cell:first-child {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
.ant-table-row-level-2 .ant-table-row-expand-icon {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
canvas {
|
canvas {
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -48,11 +48,14 @@ const buildTree = (
|
|||||||
): API.ClassifyJobs.Jobs[] => {
|
): API.ClassifyJobs.Jobs[] => {
|
||||||
const children = data
|
const children = data
|
||||||
.filter((item) => item.parentId === parentId)
|
.filter((item) => item.parentId === parentId)
|
||||||
.map((item) => ({
|
.map((item) => {
|
||||||
|
const child = buildTree(data, item.jobId, depth + 1);
|
||||||
|
return {
|
||||||
...item,
|
...item,
|
||||||
depth,
|
depth,
|
||||||
children: buildTree(data, item.jobId, depth + 1),
|
children: child.length ? child : undefined,
|
||||||
}));
|
};
|
||||||
|
});
|
||||||
return children || [];
|
return children || [];
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@@ -1,19 +1,20 @@
|
|||||||
import {useEffect, useCallback, useState} from 'react'
|
import { useEffect, useState } from 'react';
|
||||||
import {
|
import {
|
||||||
ModalForm,
|
ModalForm,
|
||||||
ProForm,
|
ProForm,
|
||||||
ProFormTextArea,
|
ProFormDateTimeRangePicker,
|
||||||
ProFormText,
|
|
||||||
ProFormDigit,
|
ProFormDigit,
|
||||||
ProFormRadio,
|
|
||||||
ProFormDateRangePicker,
|
|
||||||
ProFormList,
|
ProFormList,
|
||||||
|
ProFormRadio,
|
||||||
ProFormSelect,
|
ProFormSelect,
|
||||||
|
ProFormText,
|
||||||
|
ProFormTextArea,
|
||||||
} from '@ant-design/pro-components';
|
} from '@ant-design/pro-components';
|
||||||
import { Button, Form, message } from 'antd';
|
import { Button, Form } from 'antd';
|
||||||
import {DictOptionType, DictValueEnumObj} from "@/components/DictTag";
|
import { DictValueEnumObj } from '@/components/DictTag';
|
||||||
import { useIntl, FormattedMessage } from '@umijs/max';
|
import { FormattedMessage, useIntl } from '@umijs/max';
|
||||||
import {getCmsCompanyList} from "@/services/company/list";
|
import { getCmsCompanyList } from '@/services/company/list';
|
||||||
|
import ProFromMap from '@/components/ProFromMap';
|
||||||
|
|
||||||
export type ListFormProps = {
|
export type ListFormProps = {
|
||||||
onCancel: (flag?: boolean, formVals?: unknown) => void;
|
onCancel: (flag?: boolean, formVals?: unknown) => void;
|
||||||
@@ -35,34 +36,35 @@ const listEdit: React.FC<ListFormProps> = (props) => {
|
|||||||
const intl = useIntl();
|
const intl = useIntl();
|
||||||
const { jobFairType } = props;
|
const { jobFairType } = props;
|
||||||
|
|
||||||
const [companyOptions, setCompanyOptions] = useState([])
|
const [open, setOpen] = useState<boolean>(false);
|
||||||
|
const [viewInfo, setViewInfo] = useState<any>({});
|
||||||
|
const [companyOptions, setCompanyOptions] = useState([]);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
form.resetFields();
|
form.resetFields();
|
||||||
if (props.values) {
|
if (props.values) {
|
||||||
console.log(props.values)
|
console.log(props.values);
|
||||||
form.setFieldsValue({
|
form.setFieldsValue({
|
||||||
...props.values,
|
...props.values,
|
||||||
createTimeRanger: [props.values.startTime, props.values.endTime],
|
createTimeRanger: [props.values.startTime, props.values.endTime],
|
||||||
});
|
});
|
||||||
|
setViewInfo(props.values);
|
||||||
}
|
}
|
||||||
}, [form, props]);
|
}, [form, props]);
|
||||||
|
|
||||||
|
|
||||||
const handleChange = (_: string, value: any) => {
|
const handleChange = (_: string, value: any) => {
|
||||||
const ls = form.getFieldsValue().companyList.map((item: any) => {
|
const ls = form.getFieldsValue().companyList.map((item: any) => {
|
||||||
if (value.value === item.companyId) {
|
if (value.value === item.companyId) {
|
||||||
return {
|
return {
|
||||||
...item,
|
...item,
|
||||||
companyName: value.title
|
companyName: value.title,
|
||||||
}
|
};
|
||||||
}
|
}
|
||||||
return item;
|
return item;
|
||||||
})
|
});
|
||||||
form.setFieldValue('companyList', ls)
|
form.setFieldValue('companyList', ls);
|
||||||
console.log(ls)
|
console.log(ls);
|
||||||
}
|
};
|
||||||
|
|
||||||
|
|
||||||
const handleCancel = () => {
|
const handleCancel = () => {
|
||||||
props.onCancel();
|
props.onCancel();
|
||||||
@@ -73,6 +75,25 @@ const listEdit: React.FC<ListFormProps> = (props) => {
|
|||||||
props.onSubmit(values as API.JobFairList.JobFairListRows);
|
props.onSubmit(values as API.JobFairList.JobFairListRows);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const select = (result) => {
|
||||||
|
if (result.location) {
|
||||||
|
const { lat, lng } = result.location;
|
||||||
|
form.setFieldValue('latitude', lat);
|
||||||
|
form.setFieldValue('longitude', lng);
|
||||||
|
form.setFieldValue('address', result.address);
|
||||||
|
const obj = {
|
||||||
|
latitude: lat,
|
||||||
|
longitude: lng,
|
||||||
|
address: result.address,
|
||||||
|
};
|
||||||
|
setViewInfo(obj);
|
||||||
|
setOpen(false);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const cancel = () => {
|
||||||
|
setOpen(false);
|
||||||
|
};
|
||||||
return (
|
return (
|
||||||
<ModalForm<{
|
<ModalForm<{
|
||||||
name: string;
|
name: string;
|
||||||
@@ -89,19 +110,9 @@ const listEdit: React.FC<ListFormProps> = (props) => {
|
|||||||
submitTimeout={2000}
|
submitTimeout={2000}
|
||||||
onFinish={handleFinish}
|
onFinish={handleFinish}
|
||||||
>
|
>
|
||||||
<ProFormDigit
|
<ProFormDigit label="InputNumber" name="jobFairId" disabled hidden={true} />
|
||||||
label="InputNumber"
|
|
||||||
name="jobFairId"
|
|
||||||
disabled
|
|
||||||
hidden={true}
|
|
||||||
/>
|
|
||||||
<ProForm.Group>
|
<ProForm.Group>
|
||||||
<ProFormText
|
<ProFormText width="md" name="name" label="招聘会名称" placeholder="请输入招聘会名称" />
|
||||||
width="md"
|
|
||||||
name="name"
|
|
||||||
label="招聘会名称"
|
|
||||||
placeholder="请输入招聘会名称"
|
|
||||||
/>
|
|
||||||
<ProFormRadio.Group
|
<ProFormRadio.Group
|
||||||
valueEnum={jobFairType}
|
valueEnum={jobFairType}
|
||||||
name="jobFairType"
|
name="jobFairType"
|
||||||
@@ -111,27 +122,48 @@ const listEdit: React.FC<ListFormProps> = (props) => {
|
|||||||
rules={[
|
rules={[
|
||||||
{
|
{
|
||||||
required: false,
|
required: false,
|
||||||
message: <FormattedMessage id="请选择招聘会类型!" defaultMessage="请选择招聘会类型!" />,
|
message: (
|
||||||
|
<FormattedMessage id="请选择招聘会类型!" defaultMessage="请选择招聘会类型!" />
|
||||||
|
),
|
||||||
},
|
},
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
<ProFormDateRangePicker
|
<ProFormDateTimeRangePicker
|
||||||
transform={(values) => {
|
transform={(values) => {
|
||||||
return {
|
return {
|
||||||
startTime: values ? values[0] : undefined,
|
startTime: values ? values[0] : undefined,
|
||||||
endTime: values ? values[1] : undefined,
|
endTime: values ? values[1] : undefined,
|
||||||
};
|
};
|
||||||
}}
|
}}
|
||||||
width="md"
|
width="xl"
|
||||||
name="createTimeRanger"
|
name="createTimeRanger"
|
||||||
label="招聘会时间"
|
label="招聘会时间"
|
||||||
/>
|
/>
|
||||||
</ProForm.Group>
|
</ProForm.Group>
|
||||||
|
|
||||||
<ProForm.Group>
|
<ProForm.Group>
|
||||||
|
<div>
|
||||||
|
<Button onClick={() => setOpen(true)}>选择位置信息</Button>
|
||||||
|
<div style={{ margin: '10px 0 0 0' }}>
|
||||||
|
{viewInfo.address ? (
|
||||||
|
<span style={{ padding: '0 0 0 16px' }}>地址:{viewInfo.address}</span>
|
||||||
|
) : null}
|
||||||
|
{viewInfo.latitude ? (
|
||||||
|
<span style={{ padding: '0 0 0 16px' }}>
|
||||||
|
经纬度:{viewInfo.latitude},{viewInfo.longitude}
|
||||||
|
</span>
|
||||||
|
) : (
|
||||||
|
<span style={{ padding: '0 0 0 16px', color: 'red' }}>请选择位置!</span>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</ProForm.Group>
|
||||||
|
<ProForm.Group>
|
||||||
|
<ProFormText width="xl" name="location" label="招聘会地点" placeholder="请输入招聘会地点" />
|
||||||
<ProFormTextArea
|
<ProFormTextArea
|
||||||
width="xl"
|
width="xl"
|
||||||
name="location"
|
name="description"
|
||||||
label="招聘会地点"
|
label="招聘会描述"
|
||||||
placeholder="请输入招聘会地点"
|
placeholder="请输入招聘会地点"
|
||||||
/>
|
/>
|
||||||
</ProForm.Group>
|
</ProForm.Group>
|
||||||
@@ -156,23 +188,60 @@ const listEdit: React.FC<ListFormProps> = (props) => {
|
|||||||
name="companyId"
|
name="companyId"
|
||||||
onChange={handleChange}
|
onChange={handleChange}
|
||||||
request={async ({ keyWords }) => {
|
request={async ({ keyWords }) => {
|
||||||
let resData = await getCmsCompanyList({ name: keyWords })
|
let resData = await getCmsCompanyList({ name: keyWords });
|
||||||
return resData.rows.map((item) => ({ label: item.name, value: item.companyId}))
|
return resData.rows.map((item) => ({ label: item.name, value: item.companyId }));
|
||||||
}}
|
}}
|
||||||
placeholder="请输入公司名称选择公司"
|
placeholder="请输入公司名称选择公司"
|
||||||
rules={[{ required: true, message: '请输入公司名称选择公司!' }]}
|
rules={[{ required: true, message: '请输入公司名称选择公司!' }]}
|
||||||
label="招聘会公司列表"
|
label="招聘会公司列表"
|
||||||
/>
|
/>
|
||||||
<ProFormText
|
<ProFormText width="md" name="companyName" label=" " hidden={true} />
|
||||||
width="md"
|
|
||||||
name="companyName"
|
|
||||||
label=" "
|
|
||||||
hidden={true}
|
|
||||||
/>
|
|
||||||
</ProForm.Group>
|
</ProForm.Group>
|
||||||
</ProFormList>
|
</ProFormList>
|
||||||
|
<ProForm.Group>
|
||||||
|
<ProFormText
|
||||||
|
width="md"
|
||||||
|
name="address"
|
||||||
|
label="地理位置"
|
||||||
|
hidden={true}
|
||||||
|
placeholder="请输入地理位置"
|
||||||
|
/>
|
||||||
|
<ProFormDigit
|
||||||
|
label="纬度"
|
||||||
|
placeholder="请输入纬度"
|
||||||
|
name="latitude"
|
||||||
|
width="md"
|
||||||
|
hidden={true}
|
||||||
|
min={-90}
|
||||||
|
max={90}
|
||||||
|
fieldProps={{ controls: false }}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: '请输入纬度!',
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ProFormDigit
|
||||||
|
label="经度"
|
||||||
|
placeholder="请输入经度"
|
||||||
|
name="longitude"
|
||||||
|
width="md"
|
||||||
|
min={-180}
|
||||||
|
hidden={true}
|
||||||
|
max={180}
|
||||||
|
fieldProps={{ controls: false }}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: '请输入经度!',
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
</ProForm.Group>
|
||||||
|
<ProFromMap open={open} onSelect={select} onCancel={cancel}></ProFromMap>
|
||||||
</ModalForm>
|
</ModalForm>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export default listEdit
|
export default listEdit;
|
||||||
|
|||||||
Reference in New Issue
Block a user