ProfitFormPanel.vue 4.96 KB
<template>
  <BasicForm @register="registerForm" />
</template>
<script lang="ts">
  import { computed, defineComponent, reactive, ref, nextTick } from 'vue';
  import { BasicForm, useForm } from '/@/components/Form/index';
  import { FIELDS_PROFIT_INFO } from '../tableData';
  import { getProfitDisable } from '/@/utils/project';
  import { debounce, get } from 'lodash-es';
  import { useOrderInfo } from '/@/hooks/component/order';
  import { useOrderStoreWithOut } from '/@/store/modules/order';
  import message from '/@/views/form-design/utils/message';
  import { getOrderProfitRate } from '/@/api/project/order';

  export default defineComponent({
    components: { BasicForm },

    props: {
      onGoCheckDetail: {
        type: Function,
      },
      id: {
        type: String,
      },
      profitFormData: {
        type: Object,
      },
      orderCount: {
        type: Number,
        default: 0,
      },
    },
    emits: ['success'],
    setup(props, { emit }) {
      let fields = ref({});
      const orderStore = useOrderStoreWithOut();

      const { exchangeRate } = useOrderInfo(orderStore);
      const updateProfitRate = debounce(async (field) => {
        const values = getFieldsValue();
        const {
          profitType,
          packetPrice,
          exchangeRate = 0,
          customerPrice,
          customerRmbPrice,
          productionDepartmentPrice,
          profitRate,
        } = values;
        if (customerPrice && exchangeRate && packetPrice && customerRmbPrice) {
          const customerTotalPrice = (customerPrice * (props.orderCount || 0)).toFixed(2); // 客户总价,美元
          const productionDepartmentTotalPrice = (
            productionDepartmentPrice * (props.orderCount || 0)
          ).toFixed(2); // 生成科总价¥
          const packetTotalPrice = (packetPrice * (props.orderCount || 0)).toFixed(2); // 包装费用总价
          if (
            customerPrice &&
            customerRmbPrice &&
            productionDepartmentPrice &&
            // 只修改单价和部门才会计算利润率
            ['customerPrice', 'customerRmbPrice', 'productionDepartmentPrice'].includes(field)
          ) {
            const res = await getOrderProfitRate({
              profitType: profitType || '0',
              packetTotalPrice,
              productionDepartmentTotalPrice,
              customerTotalPrice,
              exchangeRate,
            });
            if (profitRate !== (res * 100).toFixed(2)) {
              setFieldsValue({ profitRate: (res * 100).toFixed(2) + '%' });
            }
          }
        }
      }, 300);

      const schemas = computed(() => {
        const options = {
          exchangeRate,
        };

        return FIELDS_PROFIT_INFO.map((item) => {
          return {
            ...item,
            field: `${item.field}`,
            componentProps: {
              ...item.componentProps,
              ...(item.component === 'Select' && { showSearch: true }),
              ...(item.component === 'Select' &&
                !item.componentProps?.options?.length && { options: options[item.field] }),
              disabled: getProfitDisable(
                item.field,
                get(fields.value, `${item.field}`),
                props.id,
                get(props.profitFormData, `${item.field}`),
              ),
              onChange: async (val) => {
                const values = getFieldsValue();
                const { exchangeRate = 0, customerPrice, customerRmbPrice } = values || {};
                // 修改的客户单价
                if (item.field === 'customerPrice' && val !== customerPrice) {
                  if (exchangeRate !== 0) {
                    await setFieldsValue({ customerRmbPrice: val * exchangeRate });
                  } else {
                    message.error('汇率等于0,美元人民币之间无法转换');
                  }
                }
                // 值不相等才变化,不然无限循环了
                if (item.field === 'customerRmbPrice' && val !== customerRmbPrice) {
                  if (exchangeRate !== 0) {
                    await setFieldsValue({ customerPrice: val / exchangeRate });
                  } else {
                    message.error('汇率等于0,美元人民币之间无法转换');
                  }
                }
                nextTick(() => {
                  updateProfitRate(item.field);
                });
              },
            },
            colProps: {
              span: 24,
            },
          };
        });
      });

      const [registerForm, { setFieldsValue, getFieldsValue, resetFields, validate }] = useForm({
        labelWidth: 120,
        schemas,
        layout: 'vertical',
        showActionButtonGroup: false,
        actionColOptions: {
          span: 24,
        },
      });

      return {
        fields,
        schemas,
        validate,
        registerForm,
        getFieldsValue,
        setFieldsValue,
        resetFields,
      };
    },
  });
</script>