byte-sailing-mobile/src/views/processApproval/components/Contract.vue

<template>
  <div class="form">
    <van-tabs v-model:active="active">
      <van-tab :title="proxy.t('contract.transactionInformation')" />
      <van-tab :title="proxy.t('contract.commodityInformation')" />
      <van-tab :title="proxy.t('contract.otherCharges')" />
      <van-tab :title="proxy.t('contract.deliveryInformation')" />
      <van-tab :title="proxy.t('contract.shipmentPlan')" />
      <div class="common-process-card" v-show="active == 0">
        <div class="common-title">{{ proxy.t("contract.transactionInformation") }}</div>
        <testForm v-model="formData.data" :formOption="formOption" :formConfig="formConfig" :rules="rules" ref="formDom1"> </testForm>
      </div>
      <div class="common-process-card" v-show="active == 1">
        <div class="common-title">{{ proxy.t("contract.commodityInformation") }}</div>
        <testForm v-model="formData.data" :formOption="formGoodsOption" :formConfig="formEmptyConfig" :rules="rules" ref="formDom2"> </testForm>
        <testForm v-model="formData.data" :formOption="formOption" :formConfig="formAmountProductConfig" :rules="rules" ref="formDom3"> </testForm>
      </div>
      <div class="common-process-card" v-show="active == 2">
        <div class="common-title">{{ proxy.t("contract.otherCharges") }}</div>
        <testForm v-model="formData.data" :formOption="formProjectOption" :formConfig="formEmptyConfig" :rules="rules" ref="formDom4"> </testForm>
        <testForm v-model="formData.data" :formOption="formOption" :formConfig="formAmountProjectConfig" :rules="rules" ref="formDom5"> </testForm>
      </div>
      <div class="common-process-card" v-show="active == 3">
        <div class="common-title">{{ proxy.t("contract.deliveryInformation") }}</div>
        <testForm v-model="formData.data" :formOption="formOption" :formConfig="formDeliveryConfig" :rules="rulesTwo" ref="formDom6"> </testForm>
      </div>
      <div class="common-process-card" v-show="active == 4">
        <div class="common-title">{{ proxy.t("contract.shipmentPlan") }}</div>
        <testForm v-model="formData.data" :formOption="formShipmentOption" :formConfig="formEmptyConfig" :rules="rulesTwo" ref="formDom7"> </testForm>
      </div>
    </van-tabs>
  </div>
</template>

<script setup>
import { ref, getCurrentInstance, onMounted, defineProps, defineExpose, watch, reactive, toRefs } from "vue";
import { useRoute } from "vue-router";
import testForm from "@/components/testForm/index.vue";
import { getUserInfo } from "@/utils/auth";
import { showFailToast } from "vant";

// 接收父组件的传值
const props = defineProps({
  queryData: Object,
});
const refProps = toRefs(props);
const proxy = getCurrentInstance().proxy;
const route = useRoute();
const active = ref(0);
const tabsChange = () => {
	active.value ++
}
const formData = reactive({
  data: {
    contractType: "1",
    contractProductList: [],
    contractProjectList: [],
    contractShipmentList: [],
  },
});
const formDom1 = ref(null);
const formDom2 = ref(null);
const formDom3 = ref(null);
const formDom4 = ref(null);
const formDom5 = ref(null);
const formDom6 = ref(null);
const formDom7 = ref(null);
const formOption = reactive({
  readonly: false,
  disabled: false,
  labelAlign: "top",
  scroll: true,
  labelWidth: "62pk",
  hiddenSubmitBtn: true,
});
const formConfig = reactive([
  {
    type: "picker",
    label: proxy.t("contract.contractType"),
    prop: "contractType",
    itemType: "onePicker",
    showPicker: false,
    fieldNames: {
      text: "label",
      value: "value",
    },
    data: [],
  },
  {
    type: "picker",
    label: proxy.t("contract.contractTemplateId"),
    prop: "contractTemplateId",
    itemType: "onePicker",
    showPicker: false,
    fieldNames: {
      text: "label",
      value: "value",
    },
    data: [],
    changeFn: (val, data) => {
      proxy.formChange(val, data, formData);
      formData.data.sellCorporationId = "";
      formData.data.sellCountryName = "";
      formData.data.sellProvinceName = "";
      formData.data.sellCityName = "";
      formData.data.sellAddress = "";
      formData.data.sellContactName = "";
      formData.data.sellContactNumber = "";
      if (val.selectedValues[0]) {
        proxy.post("/contractTemplate/detail", { id: val.selectedValues[0] }).then((res) => {
          formData.data.sellCorporationId = res.data.corporationId;
          if (res.data.corporationId) {
            proxy.post("/corporation/detail", { id: res.data.corporationId }).then((detailCorporation) => {
              let sellCity = "";
              if (detailCorporation.data.countryEnStr) {
                formData.data.sellCountryName = detailCorporation.data.countryEnStr;
                sellCity = detailCorporation.data.countryEnStr;
              }
              if (detailCorporation.data.provinceEnStr) {
                formData.data.sellProvinceName = detailCorporation.data.provinceEnStr;
                sellCity = sellCity + " " + detailCorporation.data.provinceEnStr;
              }
              if (detailCorporation.data.cityEnStr) {
                formData.data.sellCityName = detailCorporation.data.cityEnStr;
                sellCity = sellCity + " " + detailCorporation.data.cityEnStr;
              }
              if (detailCorporation.data.addressEn) {
                formData.data.sellAddress = detailCorporation.data.addressEn;
              }
              formData.data.sellCity = sellCity;
              formDom1.value.formDataShowLabelOne();
            });
          }
          formData.data.sellContactName = res.data.contactName;
          formData.data.sellContactNumber = res.data.contactNumber;
          formDom1.value.formDataShowLabelOne();
        });
      }
      data.showPicker = false;
    },
  },
  {
    type: "title",
    title: proxy.t("contract.sellerInformation"),
  },
  {
    type: "picker",
    label: proxy.t("contract.sellCorporationId"),
    prop: "sellCorporationId",
    itemType: "onePicker",
    showPicker: false,
    fieldNames: {
      text: "label",
      value: "value",
    },
    data: [],
    readonly: true,
  },
  {
    type: "input",
    label: proxy.t("contract.cityText"),
    prop: "sellCity",
    itemType: "text",
    readonly: true,
  },
  {
    type: "input",
    label: proxy.t("contract.address"),
    prop: "sellAddress",
    itemType: "textarea",
  },
  {
    type: "input",
    label: proxy.t("contract.contactName"),
    prop: "sellContactName",
    itemType: "text",
  },
  {
    type: "input",
    label: proxy.t("contract.contactNumber"),
    prop: "sellContactNumber",
    itemType: "text",
  },
  {
    type: "title",
    title: proxy.t("contract.buyerInformation"),
  },
  {
    type: "picker",
    label: proxy.t("contract.buyCorporationId"),
    prop: "buyCorporationId",
    itemType: "onePicker",
    showPicker: false,
    fieldNames: {
      text: "label",
      value: "value",
    },
    data: [],
    changeFn: (val, data) => {
      proxy.formChange(val, data, formData);
      formData.data.buyContactName = "";
      formData.data.buyContactNumber = "";
      if (val.selectedValues[0]) {
        proxy.post("/customer/detail", { id: val.selectedValues[0] }).then((res) => {
          if (res.data.customerUserList && res.data.customerUserList.length > 0) {
            formData.data.buyContactName = res.data.customerUserList[0].name;
            if (res.data.customerUserList[0].contactJson) {
              let contactJson = JSON.parse(res.data.customerUserList[0].contactJson);
              if (contactJson && contactJson.length > 0) {
                formData.data.buyContactNumber = contactJson[0].contactNo;
              }
            }
          }
          let countryCityName = "";
          if (res.data.countryName) {
            countryCityName = res.data.countryName;
            if (res.data.provinceName) {
              countryCityName = countryCityName + " " + res.data.provinceName;
              if (res.data.cityName) {
                countryCityName = countryCityName + " " + res.data.cityName;
              }
            }
          }
          formData.data.countryCityName = countryCityName;
          if (res.data.cityId) {
            formData.data.countryCity = res.data.cityId;
          } else if (res.data.provinceId) {
            formData.data.countryCity = res.data.provinceId;
          } else if (res.data.countryId) {
            formData.data.countryCity = res.data.countryId;
          } else {
            formData.data.countryCity = "";
          }
          formData.data.countryId = res.data.countryId;
          formData.data.provinceId = res.data.provinceId;
          formData.data.cityId = res.data.cityId;
          formData.data.buyPostalCode = res.data.zipCode;
          formData.data.buyAddress = res.data.address;
        });
      } else {
        formData.data.countryId = "";
        formData.data.provinceId = "";
        formData.data.cityId = "";
        formData.data.buyPostalCode = "";
        formData.data.buyAddress = "";
      }
      data.showPicker = false;
    },
  },
  {
    type: "cascader",
    label: proxy.t("contract.cityText"),
    prop: "countryCity",
    itemType: "city",
    showPicker: false,
  },
  {
    type: "input",
    label: proxy.t("contract.address"),
    prop: "buyAddress",
    itemType: "textarea",
  },
  {
    type: "input",
    label: proxy.t("contract.postalCode"),
    prop: "buyPostalCode",
    itemType: "text",
  },
  {
    type: "input",
    label: proxy.t("contract.contactName"),
    prop: "buyContactName",
    itemType: "text",
  },
  {
    type: "input",
    label: proxy.t("contract.contactNumber"),
    prop: "buyContactNumber",
    itemType: "text",
  },
]);
const formGoodsOption = reactive({
  readonly: false,
  disabled: false,
  labelAlign: "top",
  scroll: true,
  labelWidth: "62pk",
  hiddenSubmitBtn: true,
  btnConfig: {
    isNeed: true,
    prop: "contractProductList",
    plain: true,
    listTitle: proxy.t("contract.commodityInformation"),
    listConfig: [
      {
        type: "picker",
        label: proxy.t("contract.productId"),
        prop: "productId",
        itemType: "onePicker",
        showPicker: false,
        readonly: false,
        fieldNames: {
          text: "label",
          value: "value",
        },
        data: [],
        changeFn: (val, data, index, indexTwo, propName) => {
          let selectList = formData.data[propName].filter((item, itemIndex) => item[data.prop] === val.selectedValues[0] && itemIndex !== index);
          if (selectList && selectList.length > 0) {
            return showFailToast(proxy.t("contract.productRepeat"));
          }
          formData.data[propName][index][data.prop] = val.selectedValues[0];
          formData.data.contractShipmentList[index][data.prop] = val.selectedValues[0];
          let list = data.data.filter((item) => item[data.fieldNames.value] == val.selectedValues[0]);
          if (list && list.length > 0) {
            formData.data[propName][index][data.prop + "Name"] = list[0][data.fieldNames.text];
            let name = list[0].name;
            if (list[0].standardJson) {
              let standardJson = JSON.parse(list[0].standardJson);
              if (standardJson && standardJson.englishName) {
                name = standardJson.englishName;
              }
            }
            formData.data[propName][index].productName = name;
            formData.data[propName][index].productModel = list[0].spec;
            formData.data.contractShipmentList[index].productName = name;
          } else {
            formData.data[propName][index][data.prop + "Name"] = "";
          }
          formData.data[propName][index].quantity = null;
          formData.data[propName][index].price = null;
          formData.data[propName][index].amount = null;
          formData.data[propName][index].remark = null;
          formData.data.contractShipmentList[index].shipmentTime = null;
          formData.data.contractShipmentList[index].quantity = null;
          formData.data.contractShipmentList[index].remark = null;
          data.showPicker = false;
        },
      },
      {
        type: "input",
        label: proxy.t("contract.productName"),
        prop: "productName",
        itemType: "text",
      },
      {
        type: "input",
        label: proxy.t("contract.productModel"),
        prop: "productModel",
        itemType: "text",
      },
      {
        type: "input",
        label: proxy.t("contract.quantity"),
        prop: "quantity",
        itemType: "number",
        changeFn: () => {
          calculatedAmount();
        },
      },
      {
        type: "input",
        label: proxy.t("contract.price"),
        prop: "price",
        itemType: "number",
        changeFn: () => {
          calculatedAmount();
        },
      },
    ],
    clickFn: () => {
      if (formData.data.contractProductList && formData.data.contractProductList.length > 0) {
        formData.data.contractProductList.push({
          productId: null,
          productName: null,
          productModel: null,
          quantity: null,
          price: null,
          amount: null,
          remark: null,
        });
        formData.data.contractShipmentList.push({
          productId: null,
          productName: null,
          shipmentTime: null,
          quantity: null,
          remark: null,
        });
      } else {
        formData.data.contractProductList = [
          {
            productId: null,
            productName: null,
            productModel: null,
            quantity: null,
            price: null,
            amount: null,
            remark: null,
          },
        ];
        formData.data.contractShipmentList = [
          {
            productId: null,
            productName: null,
            shipmentTime: null,
            quantity: null,
            remark: null,
          },
        ];
      }
    },
    deleteFn: (index) => {
      formData.data.contractProductList.splice(index, 1);
      formData.data.contractShipmentList.splice(index, 1);
      handleChangeAmount();
    },
  },
});
const formEmptyConfig = reactive([]);
const formAmountProductConfig = reactive([
  {
    type: "input",
    label: proxy.t("contract.amountProduct"),
    prop: "amountProduct",
    itemType: "text",
    readonly: true,
    placeholder: proxy.t("contract.amountProductPlaceholder"),
  },
]);
const formAmountProjectConfig = reactive([
  {
    type: "input",
    label: proxy.t("contract.amountProject"),
    prop: "amountProject",
    itemType: "text",
    readonly: true,
    placeholder: proxy.t("contract.amountProjectPlaceholder"),
  },
]);
const formProjectOption = reactive({
  readonly: false,
  disabled: false,
  labelAlign: "top",
  scroll: true,
  labelWidth: "62pk",
  hiddenSubmitBtn: true,
  btnConfig: {
    isNeed: true,
    prop: "contractProjectList",
    plain: true,
    listTitle: proxy.t("contract.chargeItem"),
    listConfig: [
      {
        type: "input",
        label: proxy.t("contract.chargeItem"),
        prop: "payName",
        itemType: "text",
      },
      {
        type: "input",
        label: proxy.t("contract.amount"),
        prop: "amount",
        itemType: "number",
        changeFn: () => {
          handleChangeAmount();
        },
      },
      {
        type: "input",
        label: proxy.t("contract.remark"),
        prop: "remark",
        itemType: "textarea",
      },
    ],
    clickFn: () => {
      if (formData.data.contractProjectList && formData.data.contractProjectList.length > 0) {
        formData.data.contractProjectList.push({
          payName: null,
          amount: null,
          remark: null,
        });
      } else {
        formData.data.contractProjectList = [
          {
            payName: null,
            amount: null,
            remark: null,
          },
        ];
      }
    },
    deleteFn: (index) => {
      formData.data.contractProjectList.splice(index, 1);
      handleChangeAmount();
    },
  },
});
const formDeliveryConfig = reactive([
  {
    type: "title",
    title: proxy.t("contract.collectionInformation"),
  },
  {
    type: "picker",
    label: proxy.t("contract.currency"),
    prop: "currency",
    itemType: "onePicker",
    showPicker: false,
    fieldNames: {
      text: "label",
      value: "value",
    },
    data: [],
  },
  {
    type: "input",
    label: proxy.t("contract.amountAll"),
    prop: "amount",
    itemType: "text",
    readonly: true,
    placeholder: proxy.t("contract.amountAllPlaceholder"),
  },
  {
    type: "picker",
    label: proxy.t("contract.paymentMethod"),
    prop: "paymentMethod",
    itemType: "onePicker",
    showPicker: false,
    fieldNames: {
      text: "label",
      value: "value",
    },
    data: [],
  },
  {
    type: "input",
    label: proxy.t("contract.advanceRatio"),
    prop: "advanceRatio",
    itemType: "number",
    inputFn: (val) => {
      if (val) {
        if (val > 100) {
          formData.data.advanceRatio = 100;
        } else if (val < 0) {
          formData.data.advanceRatio = 0;
        }
      }
    },
  },
  {
    type: "picker",
    label: proxy.t("contract.shroffAccountId"),
    prop: "shroffAccountId",
    itemType: "onePicker",
    showPicker: false,
    fieldNames: {
      text: "label",
      value: "value",
    },
    data: [],
  },
  {
    type: "title",
    title: proxy.t("contract.deliveryInformation"),
  },
  {
    type: "picker",
    label: proxy.t("contract.tradeMethods"),
    prop: "tradeMethods",
    itemType: "onePicker",
    showPicker: false,
    fieldNames: {
      text: "label",
      value: "value",
    },
    data: [],
  },
  {
    type: "picker",
    label: proxy.t("contract.transportMethod"),
    prop: "transportMethod",
    itemType: "onePicker",
    showPicker: false,
    fieldNames: {
      text: "label",
      value: "value",
    },
    data: [],
  },
  {
    type: "input",
    label: proxy.t("contract.transportRemark"),
    prop: "transportRemark",
    itemType: "text",
  },
  {
    type: "input",
    label: proxy.t("contract.remarks"),
    prop: "remark",
    itemType: "textarea",
  },
  {
    type: "input",
    label: proxy.t("contract.warranty"),
    prop: "warranty",
    itemType: "digit",
  },
  {
    type: "input",
    label: proxy.t("contract.deliveryTime"),
    prop: "deliveryTime",
    itemType: "digit",
  },
]);
const formShipmentOption = reactive({
  readonly: false,
  disabled: false,
  labelAlign: "top",
  scroll: true,
  labelWidth: "62pk",
  hiddenSubmitBtn: true,
  btnConfig: {
    isNeed: false,
    prop: "contractShipmentList",
    plain: true,
    listTitle: proxy.t("contract.commodity"),
    listConfig: [
      {
        type: "input",
        label: proxy.t("contract.productName"),
        prop: "productName",
        itemType: "text",
        readonly: true,
        placeholder: proxy.t("contract.productNamePlaceholder"),
      },
      {
        type: "picker",
        label: proxy.t("contract.shipmentTime"),
        prop: "shipmentTime",
        itemType: "datePicker",
        showPicker: false,
        split: "-",
        columnsType: ["year", "month", "day"],
      },
      {
        type: "input",
        label: proxy.t("contract.quantityShipment"),
        prop: "quantity",
        itemType: "number",
      },
    ],
  },
});
const rules = {
  contractType: [{ required: true, message: proxy.t("contract.contractTypeMsg") }],
  contractTemplateId: [{ required: true, message: proxy.t("contract.contractTemplateIdMsg") }],
  sellCorporationId: [{ required: true, message: proxy.t("contract.sellCorporationIdMsg") }],
  buyCorporationId: [{ required: true, message: proxy.t("contract.buyCorporationIdMsg") }],
  sellCity: [{ required: true, message: proxy.t("contract.cityMsg") }],
  countryCity: [{ required: true, message: proxy.t("contract.cityMsg") }],
  sellAddress: [{ required: true, message: proxy.t("contract.addressMsg") }],
  buyAddress: [{ required: true, message: proxy.t("contract.addressMsg") }],
  sellContactName: [{ required: true, message: proxy.t("contract.contactNameMsg") }],
  sellContactNumber: [{ required: true, message: proxy.t("contract.contactNumberMsg") }],
  // buyPostalCode: [{ required: true, message: proxy.t("contract.postalCodeMsg") }],
  buyContactName: [{ required: true, message: proxy.t("contract.contactNameMsg") }],
  buyContactNumber: [{ required: true, message: proxy.t("contract.contactNumberMsg") }],
  productId: [{ required: true, message: proxy.t("contract.productIdMsg") }],
  productName: [{ required: true, message: proxy.t("contract.productNameMsg") }],
  productModel: [{ required: true, message: proxy.t("contract.productModelMsg") }],
  quantity: [{ required: true, message: proxy.t("contract.quantityMsg") }],
  price: [{ required: true, message: proxy.t("contract.priceMsg") }],
  payName: [{ required: true, message: proxy.t("contract.chargeItemMsg") }],
  amount: [{ required: true, message: proxy.t("contract.amountMsg") }],
};
const rulesTwo = {
  currency: [{ required: true, message: proxy.t("contract.currencyMsg") }],
  paymentMethod: [{ required: true, message: proxy.t("contract.paymentMethodMsg") }],
  advanceRatio: [{ required: true, message: proxy.t("contract.advanceRatioMsg") }],
  shroffAccountId: [{ required: true, message: proxy.t("contract.shroffAccountIdMsg") }],
  tradeMethods: [{ required: true, message: proxy.t("contract.tradeMethodsMsg") }],
  transportMethod: [{ required: true, message: proxy.t("contract.transportMethodMsg") }],
  transportRemark: [{ required: true, message: proxy.t("contract.transportRemarkMsg") }],
  remark: [{ required: true, message: proxy.t("contract.remarksMsg") }],
};
const getDict = () => {
  let query = {
    pageNum: 1,
    pageSize: 999,
    tenantId: getUserInfo().tenantId,
  };
  proxy.post("/dictTenantData/page", { ...query, dictCode: "contract_type" }).then((res) => {
    if (res.data.rows && res.data.rows.length > 0) {
      formConfig[0].data = res.data.rows.map((item) => {
        return {
          label: item.dictValue,
          value: item.dictKey,
        };
      });
    }
  });
  proxy.post("/contractTemplate/page", { pageNum: 1, pageSize: 999 }).then((res) => {
    if (res.data.rows && res.data.rows.length > 0) {
      formConfig[1].data = res.data.rows.map((item) => {
        return {
          ...item,
          label: item.templateName,
          value: item.id,
        };
      });
    }
  });
  proxy.post("/corporation/page", { pageNum: 1, pageSize: 999 }).then((res) => {
    if (res.data.rows && res.data.rows.length > 0) {
      formConfig[3].data = res.data.rows.map((item) => {
        return {
          ...item,
          label: item.name,
          value: item.id,
        };
      });
    }
  });
  proxy.post("/customer/privateSeaPage", { pageNum: 1, pageSize: 999 }).then((res) => {
    if (res.data.rows && res.data.rows.length > 0) {
      formConfig[9].data = res.data.rows.map((item) => {
        return {
          ...item,
          label: item.name,
          value: item.id,
        };
      });
    }
  });
  proxy.post("/productInfo/page", { pageNum: 1, pageSize: 9999, definition: "1" }).then((res) => {
    if (res.data.rows && res.data.rows.length > 0) {
      formGoodsOption.btnConfig.listConfig[0].data = res.data.rows.map((item) => {
        return {
          ...item,
          label: item.name,
          value: item.id,
        };
      });
    }
  });
  proxy.post("/dictTenantData/page", { ...query, dictCode: "account_currency" }).then((res) => {
    if (res.data.rows && res.data.rows.length > 0) {
      formDeliveryConfig[1].data = res.data.rows.map((item) => {
        return {
          label: item.dictValue,
          value: item.dictKey,
        };
      });
    }
  });
  proxy.post("/dictTenantData/page", { ...query, dictCode: "funds_payment_method" }).then((res) => {
    if (res.data.rows && res.data.rows.length > 0) {
      formDeliveryConfig[3].data = res.data.rows.map((item) => {
        return {
          label: item.dictValue,
          value: item.dictKey,
        };
      });
    }
  });
  proxy.post("/accountManagement/page", { pageNum: 1, pageSize: 999 }).then((res) => {
    if (res.data.rows && res.data.rows.length > 0) {
      formDeliveryConfig[5].data = res.data.rows.map((item) => {
        return {
          ...item,
          label: item.alias,
          value: item.id,
        };
      });
    }
  });
  proxy.post("/dictTenantData/page", { ...query, dictCode: "trade_mode" }).then((res) => {
    if (res.data.rows && res.data.rows.length > 0) {
      formDeliveryConfig[7].data = res.data.rows.map((item) => {
        return {
          label: item.dictValue,
          value: item.dictKey,
        };
      });
    }
  });
  proxy.post("/dictTenantData/page", { ...query, dictCode: "shipping_method" }).then((res) => {
    if (res.data.rows && res.data.rows.length > 0) {
      formDeliveryConfig[8].data = res.data.rows.map((item) => {
        return {
          label: item.dictValue,
          value: item.dictKey,
        };
      });
    }
  });
};
getDict();
const calculatedAmount = () => {
  if (formData.data.contractProductList && formData.data.contractProductList.length > 0) {
    for (let i = 0; i < formData.data.contractProductList.length; i++) {
      let money = 0;
      if (formData.data.contractProductList[i].quantity && formData.data.contractProductList[i].price) {
        money = Number(Math.round(Number(formData.data.contractProductList[i].quantity) * Number(formData.data.contractProductList[i].price) * 10000) / 10000);
      }
      formData.data.contractProductList[i].amount = money;
    }
  }
  handleChangeAmount();
};
const handleChangeAmount = () => {
  let money = 0;
  let amountProduct = 0;
  let amountProject = 0;
  if (formData.data.contractProductList && formData.data.contractProductList.length > 0) {
    for (let i = 0; i < formData.data.contractProductList.length; i++) {
      if (formData.data.contractProductList[i].amount) {
        money = Number(Math.round((Number(money) + Number(formData.data.contractProductList[i].amount)) * 10000) / 10000);
        amountProduct = Number(Math.round((Number(amountProduct) + Number(formData.data.contractProductList[i].amount)) * 10000) / 10000);
      }
    }
  }
  if (formData.data.contractProjectList && formData.data.contractProjectList.length > 0) {
    for (let i = 0; i < formData.data.contractProjectList.length; i++) {
      if (formData.data.contractProjectList[i].amount) {
        money = Number(Math.round((Number(money) + Number(formData.data.contractProjectList[i].amount)) * 10000) / 10000);
        amountProduct = Number(Math.round((Number(amountProduct) + Number(formData.data.contractProjectList[i].amount)) * 10000) / 10000);
      }
    }
  }
  formData.data.amount = money;
  formData.data.amountProduct = amountProduct;
  formData.data.amountProject = amountProject;
};
const handleSubmit = async () => {
  const flag = await formDom1.value.validateForm().then((status) => {
    if (status) {
      active.value = 0;
      return false;
    } else {
      if (!(formData.data.contractProductList && formData.data.contractProductList.length > 0)) {
        active.value = 1;
        showFailToast(proxy.t("contract.pleaseAddProduct"));
        return false;
      }
      return formDom2.value.validateForm().then((status1) => {
        if (status1) {
          active.value = 1;
          return false;
        } else {
          return formDom4.value.validateForm().then((status2) => {
            if (status2) {
              active.value = 2;
              return false;
            } else {
              return formDom6.value.validateForm().then((status3) => {
                if (status3) {
                  active.value = 3;
                  return false;
                } else {
                  return true;
                }
              });
            }
          });
        }
      });
    }
  });
  if (flag) {
    return formData.data;
  }
};
watch(
  refProps.queryData,
  () => {
    if (refProps.queryData.value && ["10", "20", "30"].includes(route.query.processType)) {
      for (const key in refProps.queryData.value) {
        formData.data[key] = refProps.queryData.value[key];
      }
      formDom1.value.formDataShowLabelOne();
      formDom2.value.formDataListShowLabelOne();
      formDom6.value.formDataShowLabelOne();
      if (["10", "20"].includes(route.query.processType)) {
        formOption.readonly = true;
        formGoodsOption.readonly = true;
        formGoodsOption.btnConfig.isNeed = false;
        formProjectOption.readonly = true;
        formProjectOption.btnConfig.isNeed = false;
        formShipmentOption.readonly = true;
      }
    }
  },
  {
    deep: true,
  }
);
defineExpose({
  handleSubmit,
});
onMounted(() => {});
</script>
<style lang="scss" scoped></style>