perf: optimize record summary

This commit is contained in:
sealday 2024-03-09 02:56:27 +08:00
parent 71c84a00de
commit fbe0c14920

View File

@ -1,45 +1,31 @@
import { onFieldInit, onFieldValueChange } from '@formily/core'; import { observer, useForm } from '@formily/react';
import { useForm, useFormEffects } from '@formily/react';
import { ConversionLogics, RecordCategory } from '../../utils/constants'; import { ConversionLogics, RecordCategory } from '../../utils/constants';
import { Descriptions, Tabs, type DescriptionsProps } from 'antd'; import { Descriptions, Tabs } from 'antd';
import { import {
CUSTOM_COMPONENT_TYPE_FORM_ITEM, CUSTOM_COMPONENT_TYPE_FORM_ITEM,
KEY_CUSTOM_COMPONENT_LABEL, KEY_CUSTOM_COMPONENT_LABEL,
KEY_CUSTOM_COMPONENT_TYPE, KEY_CUSTOM_COMPONENT_TYPE,
} from '@hera/plugin-core/client'; } from '@hera/plugin-core/client';
import React, { useEffect, useState } from 'react'; import React from 'react';
import { useRequest } from '@nocobase/client';
import _ from 'lodash'; import _ from 'lodash';
import { formatCurrency, formatQuantity } from '../../utils/currencyUtils'; import { formatCurrency, formatQuantity } from '../../utils/currencyUtils';
export const RecordSummary = (props) => { import { useCachedRequest, useLeaseItems } from '../hooks';
const [products, setProducts] = useState([]); export const RecordSummary = observer((props) => {
const [leaseData, setLeaseData] = useState(null); const form = useForm();
const [groupWeight, setGroupWeight] = useState([]); const contractPlanId = form.values.contract_plan?.id;
const [recordWeight, setRecordWeight] = useState(0); const inContractPlanId = form.values.in_contract_plan?.id;
const outContractPlanId = form.values.out_contract_plan?.id;
const [contractPlanId, setContractPlanId] = useState(-1); const leaseData = form.values.price_items;
const [contractProducts, setContractProducts] = useState([]); const recordWeight = form.values.weight;
const [inContractProducts, setInContractProducts] = useState([]); const reqWeightRules = useCachedRequest<any>({
const [inContractPlanId, setInContractPlanId] = useState(-1);
const [outContractProducts, setOutContractProducts] = useState([]);
const [outContractPlanId, setOutContractPlanId] = useState(-1);
const contractPlans = useRequest<any>({
resource: 'contract_plans',
action: 'list',
params: {
appends: ['lease_items', 'lease_items.products'],
pageSize: 99999,
},
});
const reqWeightRules = useRequest<any>({
resource: 'weight_rules', resource: 'weight_rules',
action: 'list', action: 'list',
params: { params: {
pageSize: 99999, pageSize: 99999,
}, },
}); });
const reqProduct = useRequest<any>({ const reqProduct = useCachedRequest<any>({
resource: 'product', resource: 'product',
action: 'list', action: 'list',
params: { params: {
@ -47,84 +33,10 @@ export const RecordSummary = (props) => {
pageSize: 99999, pageSize: 99999,
}, },
}); });
const { loading: loadingLeaseItems } = useRequest<any>( const { data: leaseItems } = useLeaseItems(contractPlanId);
{ const { data: inLeaseItems } = useLeaseItems(inContractPlanId);
resource: 'contract_plan_lease_items', const { data: outLeaseItems } = useLeaseItems(outContractPlanId);
action: 'list',
params: {
appends: ['products'],
filter: {
contract_plan_id: contractPlanId,
},
pageSize: 9999,
},
},
{
refreshDeps: [contractPlanId],
onSuccess(data) {
if (data?.data?.length > 0) {
const result = data.data;
setContractProducts(result);
} else {
setContractProducts([]);
}
},
},
);
const { loading: loadingInLeaseItems } = useRequest<any>(
{
resource: 'contract_plan_lease_items',
action: 'list',
params: {
appends: ['products'],
filter: {
contract_plan_id: inContractPlanId,
},
pageSize: 9999,
},
},
{
refreshDeps: [inContractPlanId],
onSuccess(data) {
if (data?.data?.length > 0) {
const result = data.data;
setInContractProducts(result);
} else {
setInContractProducts([]);
}
},
},
);
const { loading: loadingOutLeaseItems } = useRequest<any>(
{
resource: 'contract_plan_lease_items',
action: 'list',
params: {
appends: ['products'],
filter: {
contract_plan_id: outContractPlanId,
},
pageSize: 9999,
},
},
{
refreshDeps: [outContractPlanId],
onSuccess(data) {
if (data?.data?.length > 0) {
const result = data.data;
setOutContractProducts(result);
} else {
setOutContractProducts([]);
}
},
},
);
const [value, setValue] = useState<DescriptionsProps['items']>([]);
const [inContractvalue, setInContractvalue] = useState<DescriptionsProps['items']>([]);
const [outContractvalue, setOutContractvalue] = useState<DescriptionsProps['items']>([]);
const [leasevalue, setLeasevalue] = useState<DescriptionsProps['items']>([]);
const form = useForm();
const calcLeaseSum = () => {
const allPrice = { const allPrice = {
key: '1', key: '1',
name: '总金额', name: '总金额',
@ -179,13 +91,16 @@ export const RecordSummary = (props) => {
total: 0, total: 0,
unit: '吨', unit: '吨',
}; };
if (form.values.category === RecordCategory.lease || form.values.category === RecordCategory.lease2lease) { if (
(form.values.category === RecordCategory.lease || form.values.category === RecordCategory.lease2lease) &&
(leaseItems || inLeaseItems)
) {
form.values.items?.forEach((element) => { form.values.items?.forEach((element) => {
const productCategory = reqProduct.data.data?.find( const productCategory = reqProduct.data.data?.find(
(product) => product.category_id === element.product?.category_id, (product) => product.category_id === element.product?.category_id,
)?.category; )?.category;
// 合同方案 // 合同方案
const in_contract = form.values.category === RecordCategory.lease ? contractProducts : inContractProducts; const in_contract = form.values.category === RecordCategory.lease ? leaseItems.data : inLeaseItems.data;
const contractPlain = in_contract.find((item) => const contractPlain = in_contract.find((item) =>
item.products.find( item.products.find(
(product) => product.id - 99999 === element.product?.category_id || product.id === element.product?.id, (product) => product.id - 99999 === element.product?.category_id || product.id === element.product?.id,
@ -258,13 +173,13 @@ export const RecordSummary = (props) => {
} }
}); });
} }
if (form.values.category === RecordCategory.purchase2lease) { if (form.values.category === RecordCategory.purchase2lease && inLeaseItems) {
// 出现两次purchase2lease上面处理报价小结此处处理入库合同小结 // 出现两次purchase2lease上面处理报价小结此处处理入库合同小结
form.values.items?.forEach((element) => { form.values.items?.forEach((element) => {
const productCategory = reqProduct.data.data?.find( const productCategory = reqProduct.data.data?.find(
(product) => product.category_id === element.product?.category_id, (product) => product.category_id === element.product?.category_id,
)?.category; )?.category;
const contractPlain = inContractProducts.find((item) => const contractPlain = inLeaseItems.data.find((item) =>
item.products.find( item.products.find(
(product) => product.id - 99999 === element.product?.category_id || product.id === element.product?.id, (product) => product.id - 99999 === element.product?.category_id || product.id === element.product?.id,
), ),
@ -294,13 +209,13 @@ export const RecordSummary = (props) => {
total: 0, total: 0,
unit: '吨', unit: '吨',
}; };
if (form.values.category === RecordCategory.lease2lease) { if (form.values.category === RecordCategory.lease2lease && outLeaseItems) {
// 此判断出现两次,上面处理入库小结,此处要处理出库小结 // 此判断出现两次,上面处理入库小结,此处要处理出库小结
form.values.items?.forEach((element) => { form.values.items?.forEach((element) => {
const productCategory = reqProduct.data.data?.find( const productCategory = reqProduct.data.data?.find(
(product) => product.category_id === element.product?.category_id, (product) => product.category_id === element.product?.category_id,
)?.category; )?.category;
const contractPlain = outContractProducts.find((item) => const contractPlain = outLeaseItems.data.find((item) =>
item.products.find( item.products.find(
(product) => product.id - 99999 === element.product?.category_id || product.id === element.product?.id, (product) => product.id - 99999 === element.product?.category_id || product.id === element.product?.id,
), ),
@ -336,7 +251,7 @@ export const RecordSummary = (props) => {
form.values.category === RecordCategory.purchase || form.values.category === RecordCategory.purchase2lease form.values.category === RecordCategory.purchase || form.values.category === RecordCategory.purchase2lease
? [weight, ...items, allPrice] ? [weight, ...items, allPrice]
: [weight, ...items]; : [weight, ...items];
const showItems = result const value = result
.map((item) => { .map((item) => {
if (!item.total) return; if (!item.total) return;
return { return {
@ -345,7 +260,6 @@ export const RecordSummary = (props) => {
}; };
}) })
.filter(Boolean); .filter(Boolean);
setValue(showItems);
// 合同小结/入库合同小结(租赁单,使用合同 租赁直发单,使用入库合同) // 合同小结/入库合同小结(租赁单,使用合同 租赁直发单,使用入库合同)
const inContract = []; const inContract = [];
@ -356,7 +270,7 @@ export const RecordSummary = (props) => {
} }
} }
inContract.unshift(contractSummaryWeight); inContract.unshift(contractSummaryWeight);
const inContractItems = inContract const inContractvalue = inContract
.map((item) => { .map((item) => {
if (!item.total) return; if (!item.total) return;
return { return {
@ -365,7 +279,6 @@ export const RecordSummary = (props) => {
}; };
}) })
.filter(Boolean); .filter(Boolean);
setInContractvalue(inContractItems);
// 出库合同小结 // 出库合同小结
const outContract = []; const outContract = [];
@ -376,7 +289,7 @@ export const RecordSummary = (props) => {
} }
} }
outContract.unshift(outContractSummaryWeight); outContract.unshift(outContractSummaryWeight);
const outContractItems = outContract const outContractvalue = outContract
.map((item) => { .map((item) => {
if (!item.total) return; if (!item.total) return;
return { return {
@ -385,7 +298,6 @@ export const RecordSummary = (props) => {
}; };
}) })
.filter(Boolean); .filter(Boolean);
setOutContractvalue(outContractItems);
// 报价小结 // 报价小结
const lease = []; const lease = [];
@ -397,7 +309,7 @@ export const RecordSummary = (props) => {
} }
lease.unshift(leaseSummaryWeight); lease.unshift(leaseSummaryWeight);
lease.push(leaseSummaryPrice); lease.push(leaseSummaryPrice);
const leaseItems = lease const leasevalue = lease
.map((item) => { .map((item) => {
if (!item.total) return; if (!item.total) return;
return { return {
@ -406,109 +318,15 @@ export const RecordSummary = (props) => {
}; };
}) })
.filter(Boolean); .filter(Boolean);
setLeasevalue(leaseItems);
};
useFormEffects(() => {
onFieldInit('items.*', () => {
setProducts(_.cloneDeep(form.values.items));
});
onFieldValueChange('items.*', () => {
setProducts(_.cloneDeep(form.values.items));
});
onFieldInit('price_items.*', () => {
setLeaseData(_.cloneDeep(form.values.price_items));
});
onFieldValueChange('price_items.*', () => {
setLeaseData(_.cloneDeep(form.values.price_items));
});
onFieldInit('group_weight_items.*', () => {
setGroupWeight(_.cloneDeep(form.values.group_weight_items));
});
onFieldValueChange('group_weight_items.*', () => {
setGroupWeight(_.cloneDeep(form.values.group_weight_items));
});
onFieldInit('weight', () => {
setRecordWeight(_.cloneDeep(form.values.weight));
});
onFieldValueChange('weight', () => {
setRecordWeight(_.cloneDeep(form.values.weight));
});
onFieldInit('contract_plan', () => { const resultItems = [
if (form.values.contract_plan) {
setContractPlanId(form.values.contract_plan.id);
} else {
setContractPlanId(-1);
}
});
onFieldValueChange('contract_plan', () => {
if (form.values.contract_plan) {
setContractPlanId(form.values.contract_plan.id);
} else {
setContractPlanId(-1);
}
});
onFieldInit('in_contract_plan', () => {
if (form.values.in_contract_plan) {
setInContractPlanId(form.values.in_contract_plan.id);
} else {
setInContractPlanId(-1);
}
});
onFieldValueChange('in_contract_plan', () => {
if (form.values.in_contract_plan) {
setInContractPlanId(form.values.in_contract_plan.id);
} else {
setInContractPlanId(-1);
}
});
onFieldInit('out_contract_plan', () => {
if (form.values.out_contract_plan) {
setOutContractPlanId(form.values.out_contract_plan.id);
} else {
setOutContractPlanId(-1);
}
});
onFieldValueChange('out_contract_plan', () => {
if (form.values.out_contract_plan) {
setOutContractPlanId(form.values.out_contract_plan.id);
} else {
setOutContractPlanId(-1);
}
});
});
useEffect(() => {
if (
!contractPlans.loading &&
!reqWeightRules.loading &&
!reqProduct.loading &&
!loadingLeaseItems &&
!loadingInLeaseItems &&
!loadingOutLeaseItems
) {
calcLeaseSum();
}
}, [
products,
leaseData,
groupWeight,
recordWeight,
contractPlans.loading,
reqWeightRules.loading,
reqProduct.loading,
loadingLeaseItems,
loadingInLeaseItems,
loadingOutLeaseItems,
]);
const items = [
{ label: '基础', value: value }, { label: '基础', value: value },
{ label: '报价', value: leasevalue }, { label: '报价', value: leasevalue },
{ label: '出库合同', value: outContractvalue }, { label: '出库合同', value: outContractvalue },
{ label: form.values.category === RecordCategory.lease ? '合同' : '入库合同', value: inContractvalue }, { label: form.values.category === RecordCategory.lease ? '合同' : '入库合同', value: inContractvalue },
]; ];
const trans: any[] = items const trans: any[] = resultItems
.map((item, index) => { .map((item, index) => {
if (item.value.length) { if (item.value.length) {
const data = { const data = {
@ -534,7 +352,7 @@ export const RecordSummary = (props) => {
</div> </div>
) )
); );
}; });
RecordSummary.displayName = 'RecordSummary'; RecordSummary.displayName = 'RecordSummary';
RecordSummary[KEY_CUSTOM_COMPONENT_TYPE] = CUSTOM_COMPONENT_TYPE_FORM_ITEM; RecordSummary[KEY_CUSTOM_COMPONENT_TYPE] = CUSTOM_COMPONENT_TYPE_FORM_ITEM;