|
|
|
@ -1,35 +1,46 @@
|
|
|
|
|
import { useEffect, useState } from 'react';
|
|
|
|
|
import { useParams, Link, useNavigate, useLocation } from 'react-router-dom';
|
|
|
|
|
import { App, Button, Divider, Popconfirm, Select } from 'antd';
|
|
|
|
|
import { ReloadOutlined } from '@ant-design/icons';
|
|
|
|
|
import { useProductsAuditStatesMapVal } from '@/hooks/useProductsSets';
|
|
|
|
|
import { useTranslation } from 'react-i18next';
|
|
|
|
|
import useProductsStore, { postAgencyProductsAuditAction, postAgencyAuditAction, getAgencyAllExtrasAction } from '@/stores/Products/Index';
|
|
|
|
|
import { isEmpty, objectMapper } from '@/utils/commons';
|
|
|
|
|
import useAuthStore from '@/stores/Auth';
|
|
|
|
|
import RequireAuth from '@/components/RequireAuth';
|
|
|
|
|
import { useEffect, useState } from "react";
|
|
|
|
|
import { useParams, Link, useNavigate, useLocation } from "react-router-dom";
|
|
|
|
|
import { App, Button, Divider, Popconfirm, Select } from "antd";
|
|
|
|
|
import { ReloadOutlined } from "@ant-design/icons";
|
|
|
|
|
import { useProductsAuditStatesMapVal } from "@/hooks/useProductsSets";
|
|
|
|
|
import { useTranslation } from "react-i18next";
|
|
|
|
|
import useProductsStore, {
|
|
|
|
|
postAgencyProductsAuditAction,
|
|
|
|
|
postAgencyAuditAction,
|
|
|
|
|
getAgencyAllExtrasAction,
|
|
|
|
|
} from "@/stores/Products/Index";
|
|
|
|
|
import { isEmpty, objectMapper } from "@/utils/commons";
|
|
|
|
|
import useAuthStore from "@/stores/Auth";
|
|
|
|
|
import RequireAuth from "@/components/RequireAuth";
|
|
|
|
|
// import PrintContractPDF from './PrintContractPDF';
|
|
|
|
|
import { PERM_PRODUCTS_OFFER_AUDIT, PERM_PRODUCTS_OFFER_PUT } from '@/config';
|
|
|
|
|
import dayjs from 'dayjs';
|
|
|
|
|
import VendorSelector from '@/components/VendorSelector';
|
|
|
|
|
import AuditStateSelector from '@/components/AuditStateSelector';
|
|
|
|
|
import { usingStorage } from '@/hooks/usingStorage';
|
|
|
|
|
import { PERM_PRODUCTS_OFFER_AUDIT, PERM_PRODUCTS_OFFER_PUT } from "@/config";
|
|
|
|
|
import dayjs from "dayjs";
|
|
|
|
|
import VendorSelector from "@/components/VendorSelector";
|
|
|
|
|
import AuditStateSelector from "@/components/AuditStateSelector";
|
|
|
|
|
import { usingStorage } from "@/hooks/usingStorage";
|
|
|
|
|
|
|
|
|
|
import AgencyContract from '../Print/AgencyContract_v0903';
|
|
|
|
|
import AgencyContract from "../Print/AgencyContract_v1120";
|
|
|
|
|
// import AgencyContract from "../Print/AgencyContract_v0903";
|
|
|
|
|
import { saveAs } from "file-saver";
|
|
|
|
|
import { Packer } from "docx";
|
|
|
|
|
|
|
|
|
|
const Header = ({ refresh, ...props }) => {
|
|
|
|
|
const location = useLocation();
|
|
|
|
|
const isEditPage = location.pathname.includes('edit');
|
|
|
|
|
const showEditA = !location.pathname.includes('edit');
|
|
|
|
|
const showAuditA = !location.pathname.includes('audit');
|
|
|
|
|
const isEditPage = location.pathname.includes("edit");
|
|
|
|
|
const showEditA = !location.pathname.includes("edit");
|
|
|
|
|
const showAuditA = !location.pathname.includes("audit");
|
|
|
|
|
const { travel_agency_id, use_year, audit_state } = useParams();
|
|
|
|
|
const { travelAgencyId } = usingStorage();
|
|
|
|
|
const { t } = useTranslation();
|
|
|
|
|
const isPermitted = useAuthStore((state) => state.isPermitted);
|
|
|
|
|
const [activeAgency, setActiveAgency] = useProductsStore((state) => [state.activeAgency, state.setActiveAgency]);
|
|
|
|
|
const [switchParams, setSwitchParams] = useProductsStore((state) => [state.switchParams, state.setSwitchParams]);
|
|
|
|
|
const [activeAgency, setActiveAgency] = useProductsStore((state) => [
|
|
|
|
|
state.activeAgency,
|
|
|
|
|
state.setActiveAgency,
|
|
|
|
|
]);
|
|
|
|
|
const [switchParams, setSwitchParams] = useProductsStore((state) => [
|
|
|
|
|
state.switchParams,
|
|
|
|
|
state.setSwitchParams,
|
|
|
|
|
]);
|
|
|
|
|
// const [activeAgencyState] = useProductsStore((state) => [state.activeAgencyState]);
|
|
|
|
|
const [agencyProducts] = useProductsStore((state) => [state.agencyProducts]);
|
|
|
|
|
const stateMapVal = useProductsAuditStatesMapVal();
|
|
|
|
@ -38,26 +49,49 @@ const Header = ({ refresh, ...props }) => {
|
|
|
|
|
|
|
|
|
|
const yearOptions = [];
|
|
|
|
|
const currentYear = switchParams.use_year || dayjs().year();
|
|
|
|
|
const baseYear = use_year ? Number(use_year === 'all' ? currentYear : use_year) : currentYear;
|
|
|
|
|
const baseYear = use_year
|
|
|
|
|
? Number(use_year === "all" ? currentYear : use_year)
|
|
|
|
|
: currentYear;
|
|
|
|
|
for (let i = currentYear - 5; i <= baseYear + 5; i++) {
|
|
|
|
|
yearOptions.push({ label: i, value: i });
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const [param, setParam] = useState({ pick_year: baseYear, pick_agency: travel_agency_id });
|
|
|
|
|
const { getRemarkList } = useProductsStore((selector) => ({
|
|
|
|
|
getRemarkList: selector.getRemarkList,
|
|
|
|
|
}));
|
|
|
|
|
|
|
|
|
|
const [param, setParam] = useState({
|
|
|
|
|
pick_year: baseYear,
|
|
|
|
|
pick_agency: travel_agency_id,
|
|
|
|
|
});
|
|
|
|
|
const [pickYear, setPickYear] = useState(baseYear);
|
|
|
|
|
const [pickAgency, setPickAgency] = useState({ value: activeAgency.travel_agency_id, label: activeAgency.travel_agency_name });
|
|
|
|
|
const [pickAgency, setPickAgency] = useState({
|
|
|
|
|
value: activeAgency.travel_agency_id,
|
|
|
|
|
label: activeAgency.travel_agency_name,
|
|
|
|
|
});
|
|
|
|
|
const [pickAuditState, setPickAuditState] = useState();
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
const _param = objectMapper(param, { pick_year: 'use_year', pick_agency: 'travel_agency_id', pick_state: 'audit_state' });
|
|
|
|
|
setSwitchParams({ ..._param, travel_agency_id: _param?.travel_agency_id || travelAgencyId });
|
|
|
|
|
const _param = objectMapper(param, {
|
|
|
|
|
pick_year: "use_year",
|
|
|
|
|
pick_agency: "travel_agency_id",
|
|
|
|
|
pick_state: "audit_state",
|
|
|
|
|
});
|
|
|
|
|
setSwitchParams({
|
|
|
|
|
..._param,
|
|
|
|
|
travel_agency_id: _param?.travel_agency_id || travelAgencyId,
|
|
|
|
|
});
|
|
|
|
|
refresh(param);
|
|
|
|
|
|
|
|
|
|
return () => {};
|
|
|
|
|
}, [param]);
|
|
|
|
|
|
|
|
|
|
const emptyPickState = { value: '', label: t('products:State') };
|
|
|
|
|
const emptyPickState = { value: "", label: t("products:State") };
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
const baseState = audit_state ? (audit_state === 'all' ? emptyPickState : stateMapVal[`${audit_state}`]) : emptyPickState;
|
|
|
|
|
const baseState = audit_state
|
|
|
|
|
? audit_state === "all"
|
|
|
|
|
? emptyPickState
|
|
|
|
|
: stateMapVal[`${audit_state}`]
|
|
|
|
|
: emptyPickState;
|
|
|
|
|
if (isEmpty(pickAuditState)) {
|
|
|
|
|
setPickAuditState(baseState);
|
|
|
|
|
}
|
|
|
|
@ -84,20 +118,23 @@ const Header = ({ refresh, ...props }) => {
|
|
|
|
|
// const s = Object.keys(agencyProducts).map((typeKey) => {
|
|
|
|
|
|
|
|
|
|
// });
|
|
|
|
|
postAgencyProductsAuditAction(state, { travel_agency_id: activeAgency.travel_agency_id, use_year: switchParams.use_year })
|
|
|
|
|
postAgencyProductsAuditAction(state, {
|
|
|
|
|
travel_agency_id: activeAgency.travel_agency_id,
|
|
|
|
|
use_year: switchParams.use_year,
|
|
|
|
|
})
|
|
|
|
|
.then((json) => {
|
|
|
|
|
if (json.errcode === 0) {
|
|
|
|
|
message.success(json.errmsg);
|
|
|
|
|
if (typeof refresh === 'function') {
|
|
|
|
|
if (typeof refresh === "function") {
|
|
|
|
|
refresh(param);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
.catch((ex) => {
|
|
|
|
|
notification.error({
|
|
|
|
|
message: 'Notification',
|
|
|
|
|
message: "Notification",
|
|
|
|
|
description: ex.message,
|
|
|
|
|
placement: 'top',
|
|
|
|
|
placement: "top",
|
|
|
|
|
duration: 4,
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
@ -107,105 +144,166 @@ const Header = ({ refresh, ...props }) => {
|
|
|
|
|
postAgencyAuditAction(activeAgency.travel_agency_id, switchParams.use_year)
|
|
|
|
|
.then((json) => {
|
|
|
|
|
if (json.errcode === 0) {
|
|
|
|
|
message.success(t('Success'));
|
|
|
|
|
if (typeof refresh === 'function') {
|
|
|
|
|
message.success(t("Success"));
|
|
|
|
|
if (typeof refresh === "function") {
|
|
|
|
|
refresh(param);
|
|
|
|
|
const auditPagePath = isPermitted(PERM_PRODUCTS_OFFER_AUDIT)
|
|
|
|
|
? `/products/${activeAgency.travel_agency_id}/${switchParams.use_year}/all/audit`
|
|
|
|
|
: isPermitted(PERM_PRODUCTS_OFFER_PUT)
|
|
|
|
|
? `/products/audit`
|
|
|
|
|
: '';
|
|
|
|
|
: "";
|
|
|
|
|
navigate(auditPagePath);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
.catch((ex) => {
|
|
|
|
|
notification.error({
|
|
|
|
|
message: 'Notification',
|
|
|
|
|
message: "Notification",
|
|
|
|
|
description: ex.message,
|
|
|
|
|
placement: 'top',
|
|
|
|
|
placement: "top",
|
|
|
|
|
duration: 4,
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const handleDownload = async () => {
|
|
|
|
|
// await refresh();
|
|
|
|
|
const agencyExtras = await getAgencyAllExtrasAction(switchParams);
|
|
|
|
|
const remarks = await getRemarkList()
|
|
|
|
|
const documentCreator = new AgencyContract();
|
|
|
|
|
const doc = documentCreator.create([switchParams, activeAgency, agencyProducts, agencyExtras]);
|
|
|
|
|
const doc = documentCreator.create([
|
|
|
|
|
switchParams,
|
|
|
|
|
activeAgency,
|
|
|
|
|
agencyProducts,
|
|
|
|
|
agencyExtras,
|
|
|
|
|
remarks
|
|
|
|
|
]);
|
|
|
|
|
|
|
|
|
|
const _d = dayjs().format('YYYYMMDD_HH.mm.ss.SSS'); // Date.now().toString(32)
|
|
|
|
|
Packer.toBlob(doc).then(blob => {
|
|
|
|
|
saveAs(blob, `${activeAgency.travel_agency_name}${pickYear}年地接合同-${_d}.docx`);
|
|
|
|
|
const _d = dayjs().format("YYYYMMDD_HH.mm.ss.SSS"); // Date.now().toString(32)
|
|
|
|
|
Packer.toBlob(doc).then((blob) => {
|
|
|
|
|
saveAs(
|
|
|
|
|
blob,
|
|
|
|
|
`${activeAgency.travel_agency_name}${pickYear}年地接合同-${_d}.docx`
|
|
|
|
|
);
|
|
|
|
|
});
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<div className='flex justify-end items-center gap-4 h-full'>
|
|
|
|
|
<div className='grow'>
|
|
|
|
|
<h2 className='m-0 leading-tight'>
|
|
|
|
|
<div className="flex justify-end items-center gap-4 h-full">
|
|
|
|
|
<div className="grow">
|
|
|
|
|
<h2 className="m-0 leading-tight">
|
|
|
|
|
{isPermitted(PERM_PRODUCTS_OFFER_AUDIT) ? (
|
|
|
|
|
<VendorSelector
|
|
|
|
|
value={{ label: activeAgency.travel_agency_name, value: activeAgency.travel_agency_id }}
|
|
|
|
|
value={{
|
|
|
|
|
label: activeAgency.travel_agency_name,
|
|
|
|
|
value: activeAgency.travel_agency_id,
|
|
|
|
|
}}
|
|
|
|
|
onChange={handleAgencyChange}
|
|
|
|
|
allowClear={false}
|
|
|
|
|
mode={null}
|
|
|
|
|
className='w-72'
|
|
|
|
|
size='large'
|
|
|
|
|
variant={'borderless'}
|
|
|
|
|
className="w-72"
|
|
|
|
|
size="large"
|
|
|
|
|
variant={"borderless"}
|
|
|
|
|
/>
|
|
|
|
|
) : (
|
|
|
|
|
activeAgency.travel_agency_name
|
|
|
|
|
)}
|
|
|
|
|
<Divider type={'vertical'} />
|
|
|
|
|
<Select options={yearOptions} variant={'borderless'} className='w-24' size='large' value={pickYear} onChange={handleYearChange} />
|
|
|
|
|
<Divider type={'vertical'} />
|
|
|
|
|
<AuditStateSelector variant={'borderless'} className='w-32' size='large' value={pickAuditState} onChange={handleAuditStateChange} />
|
|
|
|
|
<Divider type={"vertical"} />
|
|
|
|
|
<Select
|
|
|
|
|
options={yearOptions}
|
|
|
|
|
variant={"borderless"}
|
|
|
|
|
className="w-24"
|
|
|
|
|
size="large"
|
|
|
|
|
value={pickYear}
|
|
|
|
|
onChange={handleYearChange}
|
|
|
|
|
/>
|
|
|
|
|
<Divider type={"vertical"} />
|
|
|
|
|
<AuditStateSelector
|
|
|
|
|
variant={"borderless"}
|
|
|
|
|
className="w-32"
|
|
|
|
|
size="large"
|
|
|
|
|
value={pickAuditState}
|
|
|
|
|
onChange={handleAuditStateChange}
|
|
|
|
|
/>
|
|
|
|
|
{/* <Divider type={'vertical'} />
|
|
|
|
|
{(use_year || '').replace('all', '')} */}
|
|
|
|
|
<Button onClick={() => refresh(param)} type='text' className='text-primary round-none' icon={<ReloadOutlined />} />
|
|
|
|
|
<Button
|
|
|
|
|
onClick={() => refresh(param)}
|
|
|
|
|
type="text"
|
|
|
|
|
className="text-primary round-none"
|
|
|
|
|
icon={<ReloadOutlined />}
|
|
|
|
|
/>
|
|
|
|
|
</h2>
|
|
|
|
|
</div>
|
|
|
|
|
{/* todo: export, 审核完成之后才能导出 */}
|
|
|
|
|
<RequireAuth subject={PERM_PRODUCTS_OFFER_AUDIT}>
|
|
|
|
|
<Button size='small' onClick={handleDownload}>{t('Export')} .docx</Button>
|
|
|
|
|
<Button size="small" onClick={handleDownload}>
|
|
|
|
|
{t("Export")} .docx
|
|
|
|
|
</Button>
|
|
|
|
|
{/* <PrintContractPDF /> */}
|
|
|
|
|
</RequireAuth>
|
|
|
|
|
{/* {activeAgencyState === 0 && ( */}
|
|
|
|
|
<>
|
|
|
|
|
<RequireAuth subject={PERM_PRODUCTS_OFFER_PUT}>
|
|
|
|
|
<Popconfirm title={t('products:sureSubmitAudit')} onConfirm={handleSubmitForAudit} okText={t('Yes')} placement={'bottomLeft'}>
|
|
|
|
|
<Button size='small' type={'primary'} >
|
|
|
|
|
{t('Submit')}
|
|
|
|
|
{t('Audit')}
|
|
|
|
|
</Button>
|
|
|
|
|
</Popconfirm>
|
|
|
|
|
</RequireAuth>
|
|
|
|
|
</>
|
|
|
|
|
<RequireAuth subject={PERM_PRODUCTS_OFFER_PUT}>
|
|
|
|
|
<Popconfirm
|
|
|
|
|
title={t("products:sureSubmitAudit")}
|
|
|
|
|
onConfirm={handleSubmitForAudit}
|
|
|
|
|
okText={t("Yes")}
|
|
|
|
|
placement={"bottomLeft"}
|
|
|
|
|
>
|
|
|
|
|
<Button size="small" type={"primary"}>
|
|
|
|
|
{t("Submit")}
|
|
|
|
|
{t("Audit")}
|
|
|
|
|
</Button>
|
|
|
|
|
</Popconfirm>
|
|
|
|
|
</RequireAuth>
|
|
|
|
|
</>
|
|
|
|
|
{/* )} */}
|
|
|
|
|
{showEditA && (
|
|
|
|
|
<Link className='px-2' to={isPermitted(PERM_PRODUCTS_OFFER_AUDIT) ? `/products/${activeAgency.travel_agency_id}/${pickYear}/${audit_state}/edit` : `/products/edit`}>
|
|
|
|
|
{t('Edit')}
|
|
|
|
|
<Link
|
|
|
|
|
className="px-2"
|
|
|
|
|
to={
|
|
|
|
|
isPermitted(PERM_PRODUCTS_OFFER_AUDIT)
|
|
|
|
|
? `/products/${activeAgency.travel_agency_id}/${pickYear}/${audit_state}/edit`
|
|
|
|
|
: `/products/edit`
|
|
|
|
|
}
|
|
|
|
|
>
|
|
|
|
|
{t("Edit")}
|
|
|
|
|
</Link>
|
|
|
|
|
)}
|
|
|
|
|
{showAuditA && (
|
|
|
|
|
<Link className='px-2' to={isPermitted(PERM_PRODUCTS_OFFER_AUDIT) ? `/products/${activeAgency.travel_agency_id}/${pickYear}/${audit_state}/audit` : `/products/audit`}>
|
|
|
|
|
{t('products:AuditRes')}
|
|
|
|
|
<Link
|
|
|
|
|
className="px-2"
|
|
|
|
|
to={
|
|
|
|
|
isPermitted(PERM_PRODUCTS_OFFER_AUDIT)
|
|
|
|
|
? `/products/${activeAgency.travel_agency_id}/${pickYear}/${audit_state}/audit`
|
|
|
|
|
: `/products/audit`
|
|
|
|
|
}
|
|
|
|
|
>
|
|
|
|
|
{t("products:AuditRes")}
|
|
|
|
|
</Link>
|
|
|
|
|
)}
|
|
|
|
|
<RequireAuth subject={PERM_PRODUCTS_OFFER_AUDIT}>
|
|
|
|
|
<Button size='small' type={'primary'} onClick={() => handleAuditAgency('1')}>
|
|
|
|
|
{t('products:auditStateAction.Published')}
|
|
|
|
|
<Button
|
|
|
|
|
size="small"
|
|
|
|
|
type={"primary"}
|
|
|
|
|
onClick={() => handleAuditAgency("1")}
|
|
|
|
|
>
|
|
|
|
|
{t("products:auditStateAction.Published")}
|
|
|
|
|
</Button>
|
|
|
|
|
</RequireAuth>
|
|
|
|
|
{/* <Button size='small' type={'primary'} ghost onClick={() => handleAuditAgency('2')}>
|
|
|
|
|
{t('products:auditStateAction.Approved')}
|
|
|
|
|
</Button> */}
|
|
|
|
|
<RequireAuth subject={PERM_PRODUCTS_OFFER_AUDIT}>
|
|
|
|
|
<Button size='small' type={'primary'} danger ghost onClick={() => handleAuditAgency('3')}>
|
|
|
|
|
{t('products:auditStateAction.Rejected')}
|
|
|
|
|
<Button
|
|
|
|
|
size="small"
|
|
|
|
|
type={"primary"}
|
|
|
|
|
danger
|
|
|
|
|
ghost
|
|
|
|
|
onClick={() => handleAuditAgency("3")}
|
|
|
|
|
>
|
|
|
|
|
{t("products:auditStateAction.Rejected")}
|
|
|
|
|
</Button>
|
|
|
|
|
</RequireAuth>
|
|
|
|
|
</div>
|
|
|
|
|