Files
boluo-app-main/src/components/job-manage-card/index.tsx
2025-11-06 00:06:03 +08:00

78 lines
2.3 KiB
TypeScript

import { Image } from '@tarojs/components';
import { Arrow } from '@taroify/icons';
import classNames from 'classnames';
import React, { useCallback } from 'react';
import { cityValues } from '@/components/user-batch-publish';
import { PageUrl } from '@/constants/app';
import { JOB_MANAGE_STATUS_TITLE_MAP, JobManageStatus } from '@/constants/job';
import { JobManageInfo } from '@/types/job';
import { getJobLocation } from '@/utils/job';
import { navigateTo } from '@/utils/route';
import './index.less';
interface IProps {
data: JobManageInfo;
className?: string;
}
const PREFIX = 'job-manage-card';
const STATUS_CLASS_MAP = {
[JobManageStatus.WaitVerify]: 'pending',
[JobManageStatus.Open]: 'open',
[JobManageStatus.Pending]: 'pending',
[JobManageStatus.Error]: 'error',
[JobManageStatus.Close]: 'close',
[JobManageStatus.Expire]: 'close',
};
function GoBatchTag({ cityCode, jobId }: { cityCode: string; jobId: JobManageInfo['id'] }) {
const handleClick = useCallback(
e => {
e.preventDefault();
e.stopPropagation();
navigateTo(PageUrl.GroupDelegatePublish, { cityCode, jobId });
},
[cityCode, jobId]
);
if (!cityValues.find(c => c.cityCode === cityCode)) {
return null;
}
return (
<div onClick={handleClick} className={`${PREFIX}__buy-tag-wrapper`}>
<div className={`${PREFIX}__buy-tag`}>
<Image className={`${PREFIX}__buy-tag-icon`} src="https://publiccdn.neighbourhood.com.cn/img/lightning.svg" />
<div></div>
<Arrow size={12} />
</div>
</div>
);
}
function JobManageCard(props: IProps) {
const { data = {} } = props;
const { id, title, status } = data as JobManageInfo;
const handleClick = useCallback(() => {
navigateTo(PageUrl.JobDetail, { id });
}, [id]);
return (
<div className={PREFIX} onClick={handleClick}>
<div className={`${PREFIX}__info`}>
<div className={`${PREFIX}__info__title`}>{title}</div>
<div className={`${PREFIX}__info__location`}>{getJobLocation(data as JobManageInfo)}</div>
</div>
<div className={classNames(`${PREFIX}__status`, { [STATUS_CLASS_MAP[status]]: true })}>
<div>{JOB_MANAGE_STATUS_TITLE_MAP[status]}</div>
<GoBatchTag cityCode={props.data.cityCode} jobId={props.data.id} />
</div>
</div>
);
}
export default React.memo(JobManageCard);