|
|
|
@ -1,6 +1,6 @@
|
|
|
|
import { useEffect, useState } from 'react';
|
|
|
|
import { useEffect, useState } from 'react';
|
|
|
|
import { useParams, Link } from 'react-router-dom';
|
|
|
|
import { useParams, Link, Navigate, useNavigate } from 'react-router-dom';
|
|
|
|
import { App, Button, Collapse, Table, Space, Divider } from 'antd';
|
|
|
|
import { App, Empty, Button, Collapse, Table, Space, Divider, Select } from 'antd';
|
|
|
|
import { useProductsTypes, useProductsAuditStatesMapVal } from '@/hooks/useProductsSets';
|
|
|
|
import { useProductsTypes, useProductsAuditStatesMapVal } from '@/hooks/useProductsSets';
|
|
|
|
import SecondHeaderWrapper from '@/components/SecondHeaderWrapper';
|
|
|
|
import SecondHeaderWrapper from '@/components/SecondHeaderWrapper';
|
|
|
|
import { useTranslation } from 'react-i18next';
|
|
|
|
import { useTranslation } from 'react-i18next';
|
|
|
|
@ -10,19 +10,49 @@ import useAuthStore from '@/stores/Auth';
|
|
|
|
import RequireAuth from '@/components/RequireAuth';
|
|
|
|
import RequireAuth from '@/components/RequireAuth';
|
|
|
|
// import PrintContractPDF from './PrintContractPDF';
|
|
|
|
// import PrintContractPDF from './PrintContractPDF';
|
|
|
|
import { PERM_PRODUCTS_OFFER_AUDIT, PERM_PRODUCTS_OFFER_PUT } from '@/config';
|
|
|
|
import { PERM_PRODUCTS_OFFER_AUDIT, PERM_PRODUCTS_OFFER_PUT } from '@/config';
|
|
|
|
|
|
|
|
import dayjs from 'dayjs';
|
|
|
|
const Header = ({ title, agency, refresh, ...props }) => {
|
|
|
|
import VendorSelector from '@/components/VendorSelector';
|
|
|
|
|
|
|
|
const Header = ({ refresh, ...props }) => {
|
|
|
|
const { travel_agency_id, use_year, audit_state } = useParams();
|
|
|
|
const { travel_agency_id, use_year, audit_state } = useParams();
|
|
|
|
const { t } = useTranslation();
|
|
|
|
const { t } = useTranslation();
|
|
|
|
const [activeAgency] = useProductsStore((state) => [state.activeAgency]);
|
|
|
|
const isPermitted = useAuthStore(state => state.isPermitted);
|
|
|
|
|
|
|
|
const [activeAgency, setActiveAgency] = useProductsStore((state) => [state.activeAgency, state.setActiveAgency]);
|
|
|
|
const { message, notification } = App.useApp();
|
|
|
|
const { message, notification } = App.useApp();
|
|
|
|
|
|
|
|
const navigate = useNavigate();
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const yearOptions = [];
|
|
|
|
|
|
|
|
const currentYear = dayjs().year();
|
|
|
|
|
|
|
|
const baseYear = Number(use_year === 'all' ? currentYear : use_year);
|
|
|
|
|
|
|
|
for (let i = baseYear - 3; i <= baseYear + 3; i++) {
|
|
|
|
|
|
|
|
yearOptions.push({ label: i, value: i, });
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const [param, setParam] = useState({ pick_year: baseYear, pick_agency: travel_agency_id, });
|
|
|
|
|
|
|
|
const [pickYear, setPickYear] = useState(baseYear);
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
|
|
|
refresh(param);
|
|
|
|
|
|
|
|
navigate(`/products/${activeAgency.travel_agency_id}/${pickYear}/${audit_state}/audit`);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return () => {};
|
|
|
|
|
|
|
|
}, [param]);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const handleYearChange = (value) => {
|
|
|
|
|
|
|
|
setPickYear(value);
|
|
|
|
|
|
|
|
setParam((pre) => ({ ...pre, ...{ pick_year: value } }));
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const handleAgencyChange = ({ label, value }) => {
|
|
|
|
|
|
|
|
setActiveAgency({ travel_agency_id: value, travel_agency_name: label });
|
|
|
|
|
|
|
|
setParam((pre) => ({ ...pre, ...{ pick_agency: value } }));
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
const handleAuditItem = (state, row) => {
|
|
|
|
const handleAuditItem = (state, row) => {
|
|
|
|
postProductsQuoteAuditAction(state, { id: row.id, travel_agency_id: activeAgency.travel_agency_id })
|
|
|
|
postProductsQuoteAuditAction(state, { id: row.id, travel_agency_id: activeAgency.travel_agency_id })
|
|
|
|
.then((json) => {
|
|
|
|
.then((json) => {
|
|
|
|
if (json.errcode === 0) {
|
|
|
|
if (json.errcode === 0) {
|
|
|
|
message.success(json.errmsg);
|
|
|
|
message.success(json.errmsg);
|
|
|
|
if (typeof refresh === 'function') {
|
|
|
|
if (typeof refresh === 'function') {
|
|
|
|
refresh();
|
|
|
|
refresh(param);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
})
|
|
|
|
})
|
|
|
|
@ -39,20 +69,33 @@ const Header = ({ title, agency, refresh, ...props }) => {
|
|
|
|
<div className='flex justify-end items-center gap-4 h-full'>
|
|
|
|
<div className='flex justify-end items-center gap-4 h-full'>
|
|
|
|
<div className='grow'>
|
|
|
|
<div className='grow'>
|
|
|
|
<h2 className='m-0 leading-tight'>
|
|
|
|
<h2 className='m-0 leading-tight'>
|
|
|
|
{title}
|
|
|
|
{isPermitted(PERM_PRODUCTS_OFFER_AUDIT) ? (
|
|
|
|
|
|
|
|
<VendorSelector
|
|
|
|
|
|
|
|
value={{ label: activeAgency.travel_agency_name, value: activeAgency.travel_agency_id }}
|
|
|
|
|
|
|
|
onChange={handleAgencyChange}
|
|
|
|
|
|
|
|
mode={null}
|
|
|
|
|
|
|
|
className='w-72'
|
|
|
|
|
|
|
|
size='large'
|
|
|
|
|
|
|
|
variant={'borderless'}
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
) : (
|
|
|
|
|
|
|
|
activeAgency.travel_agency_name
|
|
|
|
|
|
|
|
)}
|
|
|
|
<Divider type={'vertical'} />
|
|
|
|
<Divider type={'vertical'} />
|
|
|
|
{(use_year || '').replace('all', '')}
|
|
|
|
<Select options={yearOptions} variant={'borderless'} className='w-24' size='large' value={pickYear} onChange={handleYearChange} />
|
|
|
|
|
|
|
|
{/* <Divider type={'vertical'} />
|
|
|
|
|
|
|
|
{(use_year || '').replace('all', '')} */}
|
|
|
|
</h2>
|
|
|
|
</h2>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
{/* <Button size='small'>{t('Copy')}</Button> */}
|
|
|
|
{/* <Button size='small'>{t('Copy')}</Button> */}
|
|
|
|
{/* <Button size='small'>{t('Import')}</Button> */}
|
|
|
|
{/* <Button size='small'>{t('Import')}</Button> */}
|
|
|
|
<RequireAuth subject={PERM_PRODUCTS_OFFER_PUT}>
|
|
|
|
<RequireAuth subject={PERM_PRODUCTS_OFFER_PUT}>
|
|
|
|
<Link className='px-2' to={`/products/${travel_agency_id}/${use_year}/${audit_state}/edit`}>
|
|
|
|
<Link className='px-2' to={`/products/${activeAgency.travel_agency_id}/${pickYear}/${audit_state}/edit`}>
|
|
|
|
{t('Edit')}
|
|
|
|
{t('Edit')}
|
|
|
|
</Link>
|
|
|
|
</Link>
|
|
|
|
</RequireAuth>
|
|
|
|
</RequireAuth>
|
|
|
|
<RequireAuth subject={PERM_PRODUCTS_OFFER_AUDIT}>
|
|
|
|
<RequireAuth subject={PERM_PRODUCTS_OFFER_AUDIT}>
|
|
|
|
<Button size='small' type={'primary'} onClick={() => handleAuditItem('2', agency)}>
|
|
|
|
<Button size='small' type={'primary'} onClick={() => handleAuditItem('2', activeAgency)}>
|
|
|
|
{t('products:auditStateAction.Published')}
|
|
|
|
{t('products:auditStateAction.Published')}
|
|
|
|
</Button>
|
|
|
|
</Button>
|
|
|
|
</RequireAuth>
|
|
|
|
</RequireAuth>
|
|
|
|
@ -60,7 +103,7 @@ const Header = ({ title, agency, refresh, ...props }) => {
|
|
|
|
{t('products:auditStateAction.Approved')}
|
|
|
|
{t('products:auditStateAction.Approved')}
|
|
|
|
</Button> */}
|
|
|
|
</Button> */}
|
|
|
|
<RequireAuth subject={PERM_PRODUCTS_OFFER_AUDIT}>
|
|
|
|
<RequireAuth subject={PERM_PRODUCTS_OFFER_AUDIT}>
|
|
|
|
<Button size='small' type={'primary'} danger ghost onClick={() => handleAuditItem('3', agency)}>
|
|
|
|
<Button size='small' type={'primary'} danger ghost onClick={() => handleAuditItem('3', activeAgency)}>
|
|
|
|
{t('products:auditStateAction.Rejected')}
|
|
|
|
{t('products:auditStateAction.Rejected')}
|
|
|
|
</Button>
|
|
|
|
</Button>
|
|
|
|
</RequireAuth>
|
|
|
|
</RequireAuth>
|
|
|
|
@ -216,27 +259,22 @@ const TypesPanels = (props) => {
|
|
|
|
const onCollapseChange = (_activeKey) => {
|
|
|
|
const onCollapseChange = (_activeKey) => {
|
|
|
|
setActiveKey(_activeKey);
|
|
|
|
setActiveKey(_activeKey);
|
|
|
|
};
|
|
|
|
};
|
|
|
|
return <Collapse items={showTypes} activeKey={activeKey} onChange={onCollapseChange} />;
|
|
|
|
return isEmpty(agencyProducts) ? <Empty /> : <Collapse items={showTypes} activeKey={activeKey} onChange={onCollapseChange} />;
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
const Audit = ({ ...props }) => {
|
|
|
|
const Audit = ({ ...props }) => {
|
|
|
|
const { travel_agency_id, use_year, audit_state } = useParams();
|
|
|
|
const { travel_agency_id, use_year, audit_state } = useParams();
|
|
|
|
const [loading, activeAgency, getAgencyProducts] = useProductsStore((state) => [state.loading, state.activeAgency, state.getAgencyProducts]);
|
|
|
|
const [loading, activeAgency, getAgencyProducts] = useProductsStore((state) => [state.loading, state.activeAgency, state.getAgencyProducts]);
|
|
|
|
|
|
|
|
|
|
|
|
const handleGetAgencyProducts = () => {
|
|
|
|
const handleGetAgencyProducts = ({pick_year, pick_agency}={}) => {
|
|
|
|
getAgencyProducts({ travel_agency_id, use_year, audit_state });
|
|
|
|
const year = pick_year || use_year;
|
|
|
|
|
|
|
|
const agency = pick_agency || travel_agency_id;
|
|
|
|
|
|
|
|
getAgencyProducts({ travel_agency_id: agency, use_year: year, audit_state });
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
|
|
|
handleGetAgencyProducts();
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return () => {};
|
|
|
|
|
|
|
|
}, [travel_agency_id]);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
<>
|
|
|
|
<>
|
|
|
|
<SecondHeaderWrapper header={<Header title={activeAgency.travel_agency_name} agency={activeAgency} refresh={handleGetAgencyProducts} />} loading={loading} >
|
|
|
|
<SecondHeaderWrapper header={<Header title={activeAgency.travel_agency_name} refresh={handleGetAgencyProducts} />} loading={loading} backTo={`/products`}>
|
|
|
|
{/* debug: 0 */}
|
|
|
|
|
|
|
|
{/* <PrintContractPDF /> */}
|
|
|
|
{/* <PrintContractPDF /> */}
|
|
|
|
|
|
|
|
|
|
|
|
<TypesPanels refresh={handleGetAgencyProducts} />
|
|
|
|
<TypesPanels refresh={handleGetAgencyProducts} />
|
|
|
|
|
黄文强@HWQ-PC
1 year ago