|
|
|
|
@ -2,193 +2,44 @@ import { createContext, useEffect, useState } from 'react';
|
|
|
|
|
import { Breadcrumb, Form, Divider, Button, Input, Select, Row, Col } from 'antd';
|
|
|
|
|
import { useTranslation } from 'react-i18next';
|
|
|
|
|
import { useProductsTypesMapVal, } from '@/hooks/useProductsSets';
|
|
|
|
|
import useProductsStore from '@/stores/Products/Index';
|
|
|
|
|
import useProductsStore, { postProductsSave } from '@/stores/Products/Index';
|
|
|
|
|
import useAuthStore from '@/stores/Auth';
|
|
|
|
|
import RequireAuth from '@/components/RequireAuth';
|
|
|
|
|
import { PERM_PRODUCTS_MANAGEMENT, PERM_PRODUCTS_OFFER_AUDIT, PERM_PRODUCTS_OFFER_PUT } from '@/config';
|
|
|
|
|
import DeptSelector from '@/components/DeptSelector';
|
|
|
|
|
import CitySelector from '@/components/CitySelector';
|
|
|
|
|
import { at, isEmpty } from '@/utils/commons';
|
|
|
|
|
import { at, isEmpty, pick } from '@/utils/commons';
|
|
|
|
|
import ProductInfoForm from './ProductInfoForm';
|
|
|
|
|
|
|
|
|
|
const ProductInfo = ({ ...props }) => {
|
|
|
|
|
const { t } = useTranslation();
|
|
|
|
|
const [form] = Form.useForm();
|
|
|
|
|
const isPermitted = useAuthStore((state) => state.isPermitted);
|
|
|
|
|
const productsTypesMapVal = useProductsTypesMapVal();
|
|
|
|
|
const [agencyProducts, editingProduct, setEditingProduct] = useProductsStore((state) => [state.agencyProducts, state.editingProduct, state.setEditingProduct]);
|
|
|
|
|
const [activeAgency, agencyProducts, editingProduct, setEditingProduct] = useProductsStore((state) => [state.activeAgency, state.agencyProducts, state.editingProduct, state.setEditingProduct]);
|
|
|
|
|
|
|
|
|
|
const [editable, setEditable] = useState(true);
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
const notAudit = activeAgency.audit_state_id < 0 || activeAgency.audit_state_id === 3;
|
|
|
|
|
const hasAuditPer = isPermitted(PERM_PRODUCTS_OFFER_AUDIT);
|
|
|
|
|
const hasEditPer = isPermitted(PERM_PRODUCTS_OFFER_PUT);
|
|
|
|
|
setEditable(notAudit && hasEditPer);
|
|
|
|
|
// setEditable(true); // test: 0
|
|
|
|
|
return () => {};
|
|
|
|
|
}, [activeAgency, editingProduct])
|
|
|
|
|
|
|
|
|
|
return () => {
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
}, [editingProduct])
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const productTypeFormItems = {
|
|
|
|
|
'6': [
|
|
|
|
|
{ key: 'code', name: t('products:Code'), nameKey: 'products:Code' },
|
|
|
|
|
{ key: 'city_name', name: t('products:City'), nameKey: 'products:City' },
|
|
|
|
|
],
|
|
|
|
|
'B': [
|
|
|
|
|
{ key: 'code', name: t('products:Code'), nameKey: 'products:Code' },
|
|
|
|
|
{ key: 'city_name', name: t('products:City'), nameKey: 'products:City' },
|
|
|
|
|
{ key: 'km', name: t('products:KM'), nameKey: 'products:KM' },
|
|
|
|
|
{
|
|
|
|
|
key: 'remarks',
|
|
|
|
|
name: <RequireAuth subject={PERM_PRODUCTS_MANAGEMENT}>{t('products:Remarks')}</RequireAuth>,
|
|
|
|
|
nameKey: 'products:Remarks',
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
'J': [
|
|
|
|
|
{ key: 'code', name: t('products:Code'), nameKey: 'products:Code' },
|
|
|
|
|
{ key: 'city_name', name: t('products:City'), nameKey: 'products:City' },
|
|
|
|
|
{
|
|
|
|
|
key: 'recommends_rate',
|
|
|
|
|
name: <RequireAuth subject={PERM_PRODUCTS_MANAGEMENT}>{t('products:recommendationRate')}</RequireAuth>,
|
|
|
|
|
nameKey: 'products:recommendationRate',
|
|
|
|
|
},
|
|
|
|
|
{ key: 'duration', name: t('products:Duration'), nameKey: 'products:Duration' },
|
|
|
|
|
{
|
|
|
|
|
key: 'dept_name',
|
|
|
|
|
name: <RequireAuth subject={PERM_PRODUCTS_MANAGEMENT}>{t('products:Dept')}</RequireAuth>,
|
|
|
|
|
nameKey: 'products:Dept',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
key: 'display_to_c',
|
|
|
|
|
name: <RequireAuth subject={PERM_PRODUCTS_MANAGEMENT}>{t('products:DisplayToC')}</RequireAuth>,
|
|
|
|
|
nameKey: 'products:DisplayToC',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
key: 'remarks',
|
|
|
|
|
name: <RequireAuth subject={PERM_PRODUCTS_MANAGEMENT}>{t('products:Remarks')}</RequireAuth>,
|
|
|
|
|
nameKey: 'products:Remarks',
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
'Q': [
|
|
|
|
|
{ key: 'code', name: t('products:Code'), nameKey: 'products:Code' },
|
|
|
|
|
{ key: 'city_name', name: t('products:City'), nameKey: 'products:City' },
|
|
|
|
|
{
|
|
|
|
|
key: 'recommends_rate',
|
|
|
|
|
name: <RequireAuth subject={PERM_PRODUCTS_MANAGEMENT}>{t('products:recommendationRate')}</RequireAuth>,
|
|
|
|
|
nameKey: 'products:recommendationRate',
|
|
|
|
|
},
|
|
|
|
|
{ key: 'duration', name: t('products:Duration'), nameKey: 'products:Duration' },
|
|
|
|
|
{
|
|
|
|
|
key: 'dept_name',
|
|
|
|
|
name: <RequireAuth subject={PERM_PRODUCTS_MANAGEMENT}>{t('products:Dept')}</RequireAuth>,
|
|
|
|
|
nameKey: 'products:Dept',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
key: 'display_to_c',
|
|
|
|
|
name: <RequireAuth subject={PERM_PRODUCTS_MANAGEMENT}>{t('products:DisplayToC')}</RequireAuth>,
|
|
|
|
|
nameKey: 'products:DisplayToC',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
key: 'remarks',
|
|
|
|
|
name: <RequireAuth subject={PERM_PRODUCTS_MANAGEMENT}>{t('products:Remarks')}</RequireAuth>,
|
|
|
|
|
nameKey: 'products:Remarks',
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
'D': [
|
|
|
|
|
{ key: 'code', name: t('products:Code'), nameKey: 'products:Code' },
|
|
|
|
|
{ key: 'city_name', name: t('products:City'), nameKey: 'products:City' },
|
|
|
|
|
{
|
|
|
|
|
key: 'recommends_rate',
|
|
|
|
|
name: <RequireAuth subject={PERM_PRODUCTS_MANAGEMENT}>{t('products:recommendationRate')}</RequireAuth>,
|
|
|
|
|
nameKey: 'products:recommendationRate',
|
|
|
|
|
},
|
|
|
|
|
{ key: 'duration', name: t('products:Duration'), nameKey: 'products:Duration' },
|
|
|
|
|
{
|
|
|
|
|
key: 'dept_name',
|
|
|
|
|
name: <RequireAuth subject={PERM_PRODUCTS_MANAGEMENT}>{t('products:Dept')}</RequireAuth>,
|
|
|
|
|
nameKey: 'products:Dept',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
key: 'display_to_c',
|
|
|
|
|
name: <RequireAuth subject={PERM_PRODUCTS_MANAGEMENT}>{t('products:DisplayToC')}</RequireAuth>,
|
|
|
|
|
nameKey: 'products:DisplayToC',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
key: 'remarks',
|
|
|
|
|
name: <RequireAuth subject={PERM_PRODUCTS_MANAGEMENT}>{t('products:Remarks')}</RequireAuth>,
|
|
|
|
|
nameKey: 'products:Remarks',
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
'7': [
|
|
|
|
|
{ key: 'code', name: t('products:Code'), nameKey: 'products:Code' },
|
|
|
|
|
{ key: 'city_name', name: t('products:City'), nameKey: 'products:City' },
|
|
|
|
|
{
|
|
|
|
|
key: 'recommends_rate',
|
|
|
|
|
name: <RequireAuth subject={PERM_PRODUCTS_MANAGEMENT}>{t('products:recommendationRate')}</RequireAuth>,
|
|
|
|
|
nameKey: 'products:recommendationRate',
|
|
|
|
|
},
|
|
|
|
|
{ key: 'duration', name: t('products:Duration'), nameKey: 'products:Duration' },
|
|
|
|
|
{ key: 'open_weekdays', name: t('products:OpenWeekdays'), nameKey: 'products:OpenWeekdays' },
|
|
|
|
|
{
|
|
|
|
|
key: 'remarks',
|
|
|
|
|
name: <RequireAuth subject={PERM_PRODUCTS_MANAGEMENT}>{t('products:Remarks')}</RequireAuth>,
|
|
|
|
|
nameKey: 'products:Remarks',
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
'8': [
|
|
|
|
|
{ key: 'code', name: t('products:Code'), nameKey: 'products:Code' },
|
|
|
|
|
{ key: 'city_name', name: t('products:City'), nameKey: 'products:City' },
|
|
|
|
|
],
|
|
|
|
|
'R': [
|
|
|
|
|
{ key: 'code', name: t('products:Code'), nameKey: 'products:Code' },
|
|
|
|
|
{ key: 'city_name', name: t('products:City'), nameKey: 'products:City' },
|
|
|
|
|
],
|
|
|
|
|
};
|
|
|
|
|
const isCanEditable = false;
|
|
|
|
|
const renderFormItem = (item) => {
|
|
|
|
|
// const item = { key: 'code', name: t('products:Code'), nameKey: 'products:Code' };
|
|
|
|
|
// console.log(editingProduct?.info);
|
|
|
|
|
if (isEmpty(editingProduct)) {
|
|
|
|
|
return null;
|
|
|
|
|
}
|
|
|
|
|
console.log(item.key, at(editingProduct?.info, item.key)[0]);
|
|
|
|
|
let InputCom = <Input disabled={isCanEditable} />;
|
|
|
|
|
switch (item.key) {
|
|
|
|
|
case 'duration':
|
|
|
|
|
InputCom = <Input suffix='H' disabled={isCanEditable} />;
|
|
|
|
|
break;
|
|
|
|
|
case 'display_to_c':
|
|
|
|
|
InputCom = (
|
|
|
|
|
<Select disabled={isCanEditable}>
|
|
|
|
|
<Select.Option value={0}>在计划显示，不在报价信显示</Select.Option>
|
|
|
|
|
<Select.Option value={1}>计划和报价信都要显示</Select.Option>
|
|
|
|
|
<Select.Option value={2}>计划和报价信都不用显示</Select.Option>
|
|
|
|
|
</Select>
|
|
|
|
|
);
|
|
|
|
|
break;
|
|
|
|
|
case 'dept_name':
|
|
|
|
|
InputCom = <DeptSelector disabled={isCanEditable} />;
|
|
|
|
|
break;
|
|
|
|
|
case 'city_name':
|
|
|
|
|
InputCom = <CitySelector disabled={isCanEditable} />;
|
|
|
|
|
break;
|
|
|
|
|
case 'remarks':
|
|
|
|
|
InputCom = <Input.TextArea rows={2} disabled={isCanEditable} />;
|
|
|
|
|
break;
|
|
|
|
|
default:
|
|
|
|
|
InputCom = <Input disabled={isCanEditable} />;
|
|
|
|
|
}
|
|
|
|
|
return (
|
|
|
|
|
<Col span={item.key === 'remarks' ? 24 : 8} key={`${item.key}`}>
|
|
|
|
|
<Form.Item name={item.key} label={t(item.nameKey)} >
|
|
|
|
|
{/* {renderFormItem(item)} */}
|
|
|
|
|
<InputCom />
|
|
|
|
|
</Form.Item>
|
|
|
|
|
</Col>
|
|
|
|
|
);
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
const onValuesChange = (changedValues, allValues) => {
|
|
|
|
|
// const dest = formValuesMapper(allValues);
|
|
|
|
|
console.log('form onValuesChange', Object.keys(changedValues), );
|
|
|
|
|
const onSave = (err, values, forms) => {
|
|
|
|
|
values.travel_agency_id = activeAgency.travel_agency_id;
|
|
|
|
|
const poster = {
|
|
|
|
|
"audit_state": "-1",
|
|
|
|
|
// "create_date": "",
|
|
|
|
|
// "created_by": "",
|
|
|
|
|
"travel_agency_id": activeAgency.travel_agency_id,
|
|
|
|
|
// "travel_agency_name": "",
|
|
|
|
|
// "lastedit_changed": "",
|
|
|
|
|
};
|
|
|
|
|
const onSave = (e) => {
|
|
|
|
|
console.log(e);
|
|
|
|
|
const copyFields = pick(editingProduct.info, ['title', 'product_type_id', ]);
|
|
|
|
|
const readyToSubInfo = {...values.info, ...copyFields, type: copyFields.product_type_id, ...poster };
|
|
|
|
|
console.log('onSave', editingProduct.info, readyToSubInfo);
|
|
|
|
|
};
|
|
|
|
|
return (
|
|
|
|
|
<>
|
|
|
|
|
@ -200,16 +51,7 @@ const ProductInfo = ({ ...props }) => {
|
|
|
|
|
/>
|
|
|
|
|
<Divider className='my-1' />
|
|
|
|
|
<h2>{t('products:EditComponents.info')}</h2>
|
|
|
|
|
<ProductInfoForm editable showSubmit initialValues={editingProduct?.info} />
|
|
|
|
|
{/* <Form form={form} name='product-edit' initialValues={editingProduct?.info} onValuesChange={onValuesChange} onFinish={onSave}>
|
|
|
|
|
<Form.Item>
|
|
|
|
|
<div className='flex justify-around'>
|
|
|
|
|
<Button type='primary' htmlType='submit'>
|
|
|
|
|
{t('Save')}
|
|
|
|
|
</Button>
|
|
|
|
|
</div>
|
|
|
|
|
</Form.Item>
|
|
|
|
|
</Form> */}
|
|
|
|
|
<ProductInfoForm editable={editable} showSubmit initialValues={editingProduct?.info} onSubmit={onSave} />
|
|
|
|
|
<Divider className='my-1' />
|
|
|
|
|
</>
|
|
|
|
|
);
|
|
|
|
|
|
Lei OT
1 year ago