|
@@ -0,0 +1,773 @@
|
|
|
+<template>
|
|
|
+ <div class="form">
|
|
|
+ <van-tabs v-model:active="active">
|
|
|
+ <van-tab :title="proxy.t('priceSheet.transactionInformation')" />
|
|
|
+ <van-tab :title="proxy.t('priceSheet.quotationDetails')" />
|
|
|
+ <van-tab :title="proxy.t('priceSheet.otherCharges')" />
|
|
|
+ <van-tab :title="proxy.t('priceSheet.otherInformation')" />
|
|
|
+ <div class="common-process-card" v-show="active == 0">
|
|
|
+ <div class="common-title">{{ proxy.t("priceSheet.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("priceSheet.quotationDetails") }}</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("priceSheet.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("priceSheet.otherInformation") }}</div>
|
|
|
+ <testForm v-model="formData.data" :formOption="formOption" :formConfig="formDeliveryConfig" :rules="rulesTwo" ref="formDom6"> </testForm>
|
|
|
+ </div>
|
|
|
+ </van-tabs>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { ref, getCurrentInstance, onMounted, defineProps, defineExpose, watch, reactive } 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: String,
|
|
|
+});
|
|
|
+const proxy = getCurrentInstance().proxy;
|
|
|
+const route = useRoute();
|
|
|
+const active = ref(0);
|
|
|
+const formData = reactive({
|
|
|
+ data: {
|
|
|
+ quotationProductList: [],
|
|
|
+ quotationPayList: [],
|
|
|
+ },
|
|
|
+});
|
|
|
+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 formOption = reactive({
|
|
|
+ readonly: false,
|
|
|
+ disabled: false,
|
|
|
+ labelAlign: "top",
|
|
|
+ scroll: true,
|
|
|
+ labelWidth: "62pk",
|
|
|
+ hiddenSubmitBtn: true,
|
|
|
+});
|
|
|
+const formConfig = reactive([
|
|
|
+ {
|
|
|
+ type: "picker",
|
|
|
+ label: proxy.t("priceSheet.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("priceSheet.sellerInformation"),
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "picker",
|
|
|
+ label: proxy.t("priceSheet.sellCorporationId"),
|
|
|
+ prop: "sellCorporationId",
|
|
|
+ itemType: "onePicker",
|
|
|
+ showPicker: false,
|
|
|
+ fieldNames: {
|
|
|
+ text: "label",
|
|
|
+ value: "value",
|
|
|
+ },
|
|
|
+ data: [],
|
|
|
+ readonly: true,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: proxy.t("priceSheet.cityText"),
|
|
|
+ prop: "sellCity",
|
|
|
+ itemType: "text",
|
|
|
+ readonly: true,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: proxy.t("priceSheet.address"),
|
|
|
+ prop: "sellAddress",
|
|
|
+ itemType: "textarea",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: proxy.t("priceSheet.contactName"),
|
|
|
+ prop: "sellContactName",
|
|
|
+ itemType: "text",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: proxy.t("priceSheet.contactNumber"),
|
|
|
+ prop: "sellContactNumber",
|
|
|
+ itemType: "text",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "title",
|
|
|
+ title: proxy.t("priceSheet.buyerInformation"),
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "picker",
|
|
|
+ label: proxy.t("priceSheet.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 cityName = "";
|
|
|
+ if (res.data.countryName) {
|
|
|
+ cityName = res.data.countryName;
|
|
|
+ if (res.data.provinceName) {
|
|
|
+ cityName = cityName + " " + res.data.provinceName;
|
|
|
+ if (res.data.cityName) {
|
|
|
+ cityName = cityName + " " + res.data.cityName;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ formData.data.cityName = cityName;
|
|
|
+ if (res.data.cityId) {
|
|
|
+ formData.data.city = res.data.cityId;
|
|
|
+ } else if (res.data.provinceId) {
|
|
|
+ formData.data.city = res.data.provinceId;
|
|
|
+ } else if (res.data.countryId) {
|
|
|
+ formData.data.city = res.data.countryId;
|
|
|
+ } else {
|
|
|
+ formData.data.city = "";
|
|
|
+ }
|
|
|
+ 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("priceSheet.cityText"),
|
|
|
+ prop: "city",
|
|
|
+ itemType: "city",
|
|
|
+ showPicker: false,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: proxy.t("priceSheet.address"),
|
|
|
+ prop: "buyAddress",
|
|
|
+ itemType: "textarea",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: proxy.t("priceSheet.postalCode"),
|
|
|
+ prop: "buyPostalCode",
|
|
|
+ itemType: "text",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: proxy.t("priceSheet.contactName"),
|
|
|
+ prop: "buyContactName",
|
|
|
+ itemType: "text",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: proxy.t("priceSheet.contactNumber"),
|
|
|
+ prop: "buyContactNumber",
|
|
|
+ itemType: "text",
|
|
|
+ },
|
|
|
+]);
|
|
|
+const formGoodsOption = reactive({
|
|
|
+ readonly: false,
|
|
|
+ disabled: false,
|
|
|
+ labelAlign: "top",
|
|
|
+ scroll: true,
|
|
|
+ labelWidth: "62pk",
|
|
|
+ hiddenSubmitBtn: true,
|
|
|
+ btnConfig: {
|
|
|
+ isNeed: true,
|
|
|
+ prop: "quotationProductList",
|
|
|
+ plain: true,
|
|
|
+ listTitle: proxy.t("priceSheet.commodityInformation"),
|
|
|
+ listConfig: [
|
|
|
+ {
|
|
|
+ type: "picker",
|
|
|
+ label: proxy.t("priceSheet.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("priceSheet.productRepeat"));
|
|
|
+ }
|
|
|
+ formData.data[propName][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;
|
|
|
+ } 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;
|
|
|
+ data.showPicker = false;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: proxy.t("priceSheet.productName"),
|
|
|
+ prop: "productName",
|
|
|
+ itemType: "text",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: proxy.t("priceSheet.productModel"),
|
|
|
+ prop: "productModel",
|
|
|
+ itemType: "text",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: proxy.t("priceSheet.quantity"),
|
|
|
+ prop: "quantity",
|
|
|
+ itemType: "number",
|
|
|
+ changeFn: () => {
|
|
|
+ calculatedAmount();
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: proxy.t("priceSheet.price"),
|
|
|
+ prop: "price",
|
|
|
+ itemType: "number",
|
|
|
+ changeFn: () => {
|
|
|
+ calculatedAmount();
|
|
|
+ },
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ clickFn: () => {
|
|
|
+ if (formData.data.quotationProductList && formData.data.quotationProductList.length > 0) {
|
|
|
+ formData.data.quotationProductList.push({
|
|
|
+ productId: null,
|
|
|
+ productName: null,
|
|
|
+ productModel: null,
|
|
|
+ quantity: null,
|
|
|
+ price: null,
|
|
|
+ amount: null,
|
|
|
+ remark: null,
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ formData.data.quotationProductList = [
|
|
|
+ {
|
|
|
+ productId: null,
|
|
|
+ productName: null,
|
|
|
+ productModel: null,
|
|
|
+ quantity: null,
|
|
|
+ price: null,
|
|
|
+ amount: null,
|
|
|
+ remark: null,
|
|
|
+ },
|
|
|
+ ];
|
|
|
+ }
|
|
|
+ },
|
|
|
+ deleteFn: (index) => {
|
|
|
+ formData.data.quotationProductList.splice(index, 1);
|
|
|
+ handleChangeAmount();
|
|
|
+ },
|
|
|
+ },
|
|
|
+});
|
|
|
+const formEmptyConfig = reactive([]);
|
|
|
+const formAmountProductConfig = reactive([
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: proxy.t("priceSheet.amountProduct"),
|
|
|
+ prop: "amountProduct",
|
|
|
+ itemType: "text",
|
|
|
+ readonly: true,
|
|
|
+ placeholder: proxy.t("priceSheet.amountProductPlaceholder"),
|
|
|
+ },
|
|
|
+]);
|
|
|
+const formAmountProjectConfig = reactive([
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: proxy.t("priceSheet.amountProject"),
|
|
|
+ prop: "amountProject",
|
|
|
+ itemType: "text",
|
|
|
+ readonly: true,
|
|
|
+ placeholder: proxy.t("priceSheet.amountProjectPlaceholder"),
|
|
|
+ },
|
|
|
+]);
|
|
|
+const formProjectOption = reactive({
|
|
|
+ readonly: false,
|
|
|
+ disabled: false,
|
|
|
+ labelAlign: "top",
|
|
|
+ scroll: true,
|
|
|
+ labelWidth: "62pk",
|
|
|
+ hiddenSubmitBtn: true,
|
|
|
+ btnConfig: {
|
|
|
+ isNeed: true,
|
|
|
+ prop: "quotationPayList",
|
|
|
+ plain: true,
|
|
|
+ listTitle: proxy.t("priceSheet.chargeItem"),
|
|
|
+ listConfig: [
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: proxy.t("priceSheet.chargeItem"),
|
|
|
+ prop: "payName",
|
|
|
+ itemType: "text",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: proxy.t("priceSheet.amount"),
|
|
|
+ prop: "amount",
|
|
|
+ itemType: "number",
|
|
|
+ changeFn: () => {
|
|
|
+ handleChangeAmount();
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: proxy.t("priceSheet.remark"),
|
|
|
+ prop: "remark",
|
|
|
+ itemType: "textarea",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ clickFn: () => {
|
|
|
+ if (formData.data.quotationPayList && formData.data.quotationPayList.length > 0) {
|
|
|
+ formData.data.quotationPayList.push({
|
|
|
+ payName: null,
|
|
|
+ amount: null,
|
|
|
+ remark: null,
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ formData.data.quotationPayList = [
|
|
|
+ {
|
|
|
+ payName: null,
|
|
|
+ amount: null,
|
|
|
+ remark: null,
|
|
|
+ },
|
|
|
+ ];
|
|
|
+ }
|
|
|
+ },
|
|
|
+ deleteFn: (index) => {
|
|
|
+ formData.data.quotationPayList.splice(index, 1);
|
|
|
+ handleChangeAmount();
|
|
|
+ },
|
|
|
+ },
|
|
|
+});
|
|
|
+const formDeliveryConfig = reactive([
|
|
|
+ {
|
|
|
+ type: "title",
|
|
|
+ title: proxy.t("priceSheet.quotedAmount"),
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "picker",
|
|
|
+ label: proxy.t("priceSheet.currency"),
|
|
|
+ prop: "currency",
|
|
|
+ itemType: "onePicker",
|
|
|
+ showPicker: false,
|
|
|
+ fieldNames: {
|
|
|
+ text: "label",
|
|
|
+ value: "value",
|
|
|
+ },
|
|
|
+ data: [],
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: proxy.t("priceSheet.amountAll"),
|
|
|
+ prop: "amount",
|
|
|
+ itemType: "text",
|
|
|
+ readonly: true,
|
|
|
+ placeholder: proxy.t("priceSheet.amountAllPlaceholder"),
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: proxy.t("priceSheet.effective"),
|
|
|
+ prop: "effective",
|
|
|
+ itemType: "digit",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "picker",
|
|
|
+ label: proxy.t("priceSheet.paymentMethod"),
|
|
|
+ prop: "paymentMethod",
|
|
|
+ itemType: "onePicker",
|
|
|
+ showPicker: false,
|
|
|
+ fieldNames: {
|
|
|
+ text: "label",
|
|
|
+ value: "value",
|
|
|
+ },
|
|
|
+ data: [],
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: proxy.t("priceSheet.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: "title",
|
|
|
+ title: proxy.t("priceSheet.deliveryInformation"),
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "picker",
|
|
|
+ label: proxy.t("priceSheet.tradeMethods"),
|
|
|
+ prop: "tradeMethods",
|
|
|
+ itemType: "onePicker",
|
|
|
+ showPicker: false,
|
|
|
+ fieldNames: {
|
|
|
+ text: "label",
|
|
|
+ value: "value",
|
|
|
+ },
|
|
|
+ data: [],
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "picker",
|
|
|
+ label: proxy.t("priceSheet.transportMethod"),
|
|
|
+ prop: "transportMethod",
|
|
|
+ itemType: "onePicker",
|
|
|
+ showPicker: false,
|
|
|
+ fieldNames: {
|
|
|
+ text: "label",
|
|
|
+ value: "value",
|
|
|
+ },
|
|
|
+ data: [],
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: proxy.t("priceSheet.transportRemark"),
|
|
|
+ prop: "transportRemark",
|
|
|
+ itemType: "text",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: proxy.t("priceSheet.remarks"),
|
|
|
+ prop: "remark",
|
|
|
+ itemType: "textarea",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ label: proxy.t("priceSheet.warranty"),
|
|
|
+ prop: "warranty",
|
|
|
+ itemType: "digit",
|
|
|
+ },
|
|
|
+]);
|
|
|
+const rules = {
|
|
|
+ contractTemplateId: [{ required: true, message: proxy.t("priceSheet.contractTemplateIdMsg") }],
|
|
|
+ sellCorporationId: [{ required: true, message: proxy.t("priceSheet.sellCorporationIdMsg") }],
|
|
|
+ buyCorporationId: [{ required: true, message: proxy.t("priceSheet.buyCorporationIdMsg") }],
|
|
|
+ sellCity: [{ required: true, message: proxy.t("priceSheet.cityMsg") }],
|
|
|
+ city: [{ required: true, message: proxy.t("priceSheet.cityMsg") }],
|
|
|
+ sellAddress: [{ required: true, message: proxy.t("priceSheet.addressMsg") }],
|
|
|
+ buyAddress: [{ required: true, message: proxy.t("priceSheet.addressMsg") }],
|
|
|
+ sellContactName: [{ required: true, message: proxy.t("priceSheet.contactNameMsg") }],
|
|
|
+ sellContactNumber: [{ required: true, message: proxy.t("priceSheet.contactNumberMsg") }],
|
|
|
+ buyPostalCode: [{ required: true, message: proxy.t("priceSheet.postalCodeMsg") }],
|
|
|
+ buyContactName: [{ required: true, message: proxy.t("priceSheet.contactNameMsg") }],
|
|
|
+ buyContactNumber: [{ required: true, message: proxy.t("priceSheet.contactNumberMsg") }],
|
|
|
+ productId: [{ required: true, message: proxy.t("priceSheet.productIdMsg") }],
|
|
|
+ productName: [{ required: true, message: proxy.t("priceSheet.productNameMsg") }],
|
|
|
+ productModel: [{ required: true, message: proxy.t("priceSheet.productModelMsg") }],
|
|
|
+ quantity: [{ required: true, message: proxy.t("priceSheet.quantityMsg") }],
|
|
|
+ price: [{ required: true, message: proxy.t("priceSheet.priceMsg") }],
|
|
|
+ payName: [{ required: true, message: proxy.t("priceSheet.chargeItemMsg") }],
|
|
|
+ amount: [{ required: true, message: proxy.t("priceSheet.amountMsg") }],
|
|
|
+};
|
|
|
+const rulesTwo = {
|
|
|
+ currency: [{ required: true, message: proxy.t("priceSheet.currencyMsg") }],
|
|
|
+ effective: [{ required: true, message: proxy.t("priceSheet.effectiveMsg") }],
|
|
|
+ paymentMethod: [{ required: true, message: proxy.t("priceSheet.paymentMethodMsg") }],
|
|
|
+ advanceRatio: [{ required: true, message: proxy.t("priceSheet.advanceRatioMsg") }],
|
|
|
+ tradeMethods: [{ required: true, message: proxy.t("priceSheet.tradeMethodsMsg") }],
|
|
|
+ transportMethod: [{ required: true, message: proxy.t("priceSheet.transportMethodMsg") }],
|
|
|
+ transportRemark: [{ required: true, message: proxy.t("priceSheet.transportRemarkMsg") }],
|
|
|
+ remark: [{ required: true, message: proxy.t("priceSheet.remarksMsg") }],
|
|
|
+};
|
|
|
+const getDict = () => {
|
|
|
+ let query = {
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 999,
|
|
|
+ tenantId: getUserInfo().tenantId,
|
|
|
+ };
|
|
|
+ proxy.post("/contractTemplate/page", { pageNum: 1, pageSize: 999 }).then((res) => {
|
|
|
+ if (res.data.rows && res.data.rows.length > 0) {
|
|
|
+ formConfig[0].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[2].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[8].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[4].data = res.data.rows.map((item) => {
|
|
|
+ return {
|
|
|
+ label: item.dictValue,
|
|
|
+ value: item.dictKey,
|
|
|
+ };
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ 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.quotationProductList && formData.data.quotationProductList.length > 0) {
|
|
|
+ for (let i = 0; i < formData.data.quotationProductList.length; i++) {
|
|
|
+ let money = 0;
|
|
|
+ if (formData.data.quotationProductList[i].quantity && formData.data.quotationProductList[i].price) {
|
|
|
+ money = parseFloat(Number(formData.data.quotationProductList[i].quantity) * Number(formData.data.quotationProductList[i].price)).toFixed(2);
|
|
|
+ }
|
|
|
+ formData.data.quotationProductList[i].amount = money;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ handleChangeAmount();
|
|
|
+};
|
|
|
+const handleChangeAmount = () => {
|
|
|
+ let money = 0;
|
|
|
+ let amountProduct = 0;
|
|
|
+ let amountProject = 0;
|
|
|
+ if (formData.data.quotationProductList && formData.data.quotationProductList.length > 0) {
|
|
|
+ for (let i = 0; i < formData.data.quotationProductList.length; i++) {
|
|
|
+ if (formData.data.quotationProductList[i].amount) {
|
|
|
+ money = parseFloat(Number(money) + Number(formData.data.quotationProductList[i].amount)).toFixed(2);
|
|
|
+ amountProduct = parseFloat(Number(amountProduct) + Number(formData.data.quotationProductList[i].amount)).toFixed(2);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (formData.data.quotationPayList && formData.data.quotationPayList.length > 0) {
|
|
|
+ for (let i = 0; i < formData.data.quotationPayList.length; i++) {
|
|
|
+ if (formData.data.quotationPayList[i].amount) {
|
|
|
+ money = parseFloat(Number(money) + Number(formData.data.quotationPayList[i].amount)).toFixed(2);
|
|
|
+ amountProject = parseFloat(Number(amountProject) + Number(formData.data.quotationPayList[i].amount)).toFixed(2);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ 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 = 3;
|
|
|
+ return false;
|
|
|
+ } else {
|
|
|
+ if (!(formData.data.quotationProductList && formData.data.quotationProductList.length > 0)) {
|
|
|
+ active.value = 1;
|
|
|
+ showFailToast(proxy.t("priceSheet.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(
|
|
|
+ props.queryData,
|
|
|
+ () => {
|
|
|
+ if (props.queryData && [10, 20, 30].includes(route.query.processType)) {
|
|
|
+ for (const key in props.queryData) {
|
|
|
+ formData.data[key] = props.queryData[key];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ deep: true,
|
|
|
+ }
|
|
|
+);
|
|
|
+defineExpose({
|
|
|
+ handleSubmit,
|
|
|
+});
|
|
|
+onMounted(() => {});
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped></style>
|