采购付款静态页

src/components/testForm/index.vue

@@ -214,7 +214,7 @@
             is-link
             :readonly="true"
             :placeholder="i.placeholder ? i.placeholder : '请选择'"
-            @click="() => (!formOption.readonly ? defaultTimeFn(i, index) : '')"
+            @click="() => (!formOption.readonly ?i.needDefault? defaultTimeFn(i, index) :i.showPicker=true: '')"
             :rules="getRules(i.prop)"
             :required="getRequired(i.prop)"
           >

src/lang/cnCZ.js

@@ -55,12 +55,40 @@ export function cnCZ() {
       applicationsAmount: "申请金额",
       approvalStatus: "审批状态",
       paymentStatus: "付款状态",
+      supplyName: "供应商",
+      paymentTerm: "付款期限",
+      paymentType: "付款类型",
+      prepaymentCode: "预付款单号",
+      paymentDescription: "付款说明",
+      documentNumber: "单据数量",
+      invoiceType: "发票类型",
+      taxRate: "税率",
+      totalPaymentAmount: "付款总金额",
+      paymentMethon: "付款方式",
+      paymentAccount: "付款账户",
+      accountName: "户名",
+      bankAccount: "银行账号",
+      bankOfDeposit: "开户银行",
+      interbankNumber: "联行号",
+      paymentDetails: "付款明细",
+      purchaseContract: "采购合同",
+      contractAmount: "合同金额",
+      paidAmount: "已付款金额",
+      paymentDescription: "款项说明",
+      paymentAmount: "付款金额",
+      supplyNameCanNotBeEmpty: '供应商不能为空',
+      paymentTypeCanNotBeEmpty: "付款类型不能为空",
+      prepaymentCodeCanNotBeEmpty: "预付款单号不能为空",
+      descriptionCanNotBeEmpty: "说明不能为空",
+      invoiceTypeCanNotBeEmpty: "发票类型不能为空",
+      taxRateCanNotBeEmpty: "税率不能为空",
+      purchaseContractCanNotBeEmpty: "采购合同不能为空",
+      paymentAmountCanNotBeEmpty: "付款金额不能为空",
+      paymentMethonCanNotBeEmpty: "付款方式不能为空",
+      paymentAccountCanNotBeEmpty: "付款账户不能为空",
+      accountNameCanNotBeEmpty: "户名不能为空",
+      pleaseAddPaymentDetails: "请添加付款明细",
 
-      stockNumber: "库存数量",
-      inventoryNumber: "盘点数量",
-      inventoryWarehouseCanNotBeEmpty: '盘点仓库不能为空',
-      goodsNameCanNotBeEmpty: "物品名称不能为空",
-      inventoryNumberCanNotBeEmpty: "盘点数量不能为空",
     },
   };
 

src/views/processApproval/components/SendPurchasePayment.vue

@@ -8,6 +8,14 @@
       @onSubmit="onSubmit"
       ref="formDom"
     ></testForm>
+    <testForm
+      v-model="formData.data"
+      :formOption="formOptionOne"
+      :formConfig="formConfigOne"
+      :rules="rules"
+      @onSubmit="onSubmit"
+      ref="formDomOne"
+    ></testForm>
   </div>
 </template>
 
@@ -19,26 +27,76 @@ import testForm from "@/components/testForm/index.vue";
 const proxy = getCurrentInstance().proxy;
 const route = useRoute();
 const formDom = ref(null);
+const formDomOne = ref(null);
+
 const formData = reactive({
   data: {},
 });
 const rules = {
-  warehouseId: [
+  supplyId: [
+    {
+      required: true,
+      message: proxy.t("purchasePayment.supplyNameCanNotBeEmpty"),
+    },
+  ],
+  type: [
+    {
+      required: true,
+      message: proxy.t("purchasePayment.paymentTypeCanNotBeEmpty"),
+    },
+  ],
+  advanceCode: [
+    {
+      required: true,
+      message: proxy.t("purchasePayment.prepaymentCodeCanNotBeEmpty"),
+    },
+  ],
+  remark: [
+    {
+      required: true,
+      message: proxy.t("purchasePayment.descriptionCanNotBeEmpty"),
+    },
+  ],
+  invoiceType: [
+    {
+      required: true,
+      message: proxy.t("purchasePayment.invoiceTypeCanNotBeEmpty"),
+    },
+  ],
+  rate: [
     {
       required: true,
-      message: proxy.t("inventoryCount.inventoryWarehouseCanNotBeEmpty"),
+      message: proxy.t("purchasePayment.taxRateCanNotBeEmpty"),
     },
   ],
-  productId: [
+  purchaseId: [
     {
       required: true,
-      message: proxy.t("inventoryCount.goodsNameCanNotBeEmpty"),
+      message: proxy.t("purchasePayment.purchaseContractCanNotBeEmpty"),
     },
   ],
-  checkQuantity: [
+  money: [
     {
       required: true,
-      message: proxy.t("inventoryCount.inventoryNumberCanNotBeEmpty"),
+      message: proxy.t("purchasePayment.paymentAmountCanNotBeEmpty"),
+    },
+  ],
+  payType: [
+    {
+      required: true,
+      message: proxy.t("purchasePayment.paymentMethonCanNotBeEmpty"),
+    },
+  ],
+  accountManagementId: [
+    {
+      required: true,
+      message: proxy.t("purchasePayment.paymentAccountCanNotBeEmpty"),
+    },
+  ],
+  name: [
+    {
+      required: true,
+      message: proxy.t("purchasePayment.accountNameCanNotBeEmpty"),
     },
   ],
 };
@@ -52,14 +110,14 @@ const formOption = reactive({
   hiddenSubmitBtn: true,
   btnConfig: {
     isNeed: true,
-    label: proxy.t("common.details"),
+    label: proxy.t("purchasePayment.paymentDetails"),
     prop: "payDetailList",
     plain: true,
     listConfig: [
       {
         type: "picker",
-        label: proxy.t("inventoryCount.goodsName"),
-        prop: "productId",
+        label: proxy.t("purchasePayment.purchaseContract"),
+        prop: "purchaseId",
         itemType: "onePicker",
         showPicker: false,
         readonly: false,
@@ -80,33 +138,46 @@ const formOption = reactive({
       },
       {
         type: "input",
-        itemType: "text",
-        label: proxy.t("inventoryCount.stockNumber"),
-        prop: "quantity",
+        itemType: "number",
+        label: proxy.t("purchasePayment.contractAmount"),
+        prop: "amount",
+        readonly: true,
+      },
+      {
+        type: "input",
+        itemType: "number",
+        label: proxy.t("purchasePayment.paidAmount"),
+        prop: "sumPayMoney",
         readonly: true,
       },
       {
         type: "input",
+        itemType: "textarea",
+        label: proxy.t("purchasePayment.paymentDescription"),
+        prop: "remark",
+        readonly: false,
+      },
+      {
+        type: "input",
         itemType: "number",
-        label: proxy.t("inventoryCount.inventoryNumber"),
-        prop: "checkQuantity",
+        label: proxy.t("purchasePayment.paymentAmount"),
+        prop: "money",
         readonly: false,
       },
     ],
     clickFn: () => {
-      if (formData.data.list && formData.data.list.length > 0) {
-        formData.data.list.push({
-          productId: "",
-          quantity: "",
-          checkQuantity: "",
+      if (
+        formData.data.payDetailList &&
+        formData.data.payDetailList.length > 0
+      ) {
+        formData.data.payDetailList.push({
+          purchaseId: "",
+          money: "",
+          remark: "",
         });
       } else {
-        formData.data.list = [
-          {
-            productId: "",
-            quantity: "",
-            checkQuantity: "",
-          },
+        formData.data.payDetailList = [
+          { purchaseId: "", money: "", remark: "" },
         ];
       }
     },
@@ -115,8 +186,8 @@ const formOption = reactive({
 const formConfig = reactive([
   {
     type: "picker",
-    label: "供应商",
-    prop: "warehouseId",
+    label: proxy.t("purchasePayment.supplyName"),
+    prop: "supplyId",
     itemType: "onePicker",
     showPicker: false,
     readonly: false,
@@ -134,14 +205,174 @@ const formConfig = reactive([
   },
   {
     type: "picker",
-    label: "付款期限",
-    prop: "aa",
+    label: proxy.t("purchasePayment.paymentTerm"),
+    prop: "deadline",
     itemType: "datePickerTime",
     showPicker: false,
     readonly: false,
+    needDefault: false,
+  },
+  {
+    type: "picker",
+    label: proxy.t("purchasePayment.paymentType"),
+    prop: "type",
+    itemType: "onePicker",
+    showPicker: false,
+    readonly: false,
+    fieldNames: {
+      text: "label",
+      value: "value",
+    },
+    data: [
+      { label: "未核销", value: "0" },
+      { label: "发票核销", value: "1" },
+    ],
+    changeFn: function (option, item, index) {
+      proxy.formChange(option, item, formData);
+      formConfig[index].showPicker = false;
+      changeType(formData.data[item.prop]);
+    },
+  },
+  {
+    type: "pickerOne",
+    label: proxy.t("purchasePayment.prepaymentCode"),
+    prop: "advanceCode",
+    itemType: "onePicker",
+    showPicker: false,
+    readonly: false,
+    fieldNames: {
+      text: "label",
+      value: "value",
+    },
+    data: [],
+    changeFn: function (option, item, index) {
+      formData.data[item.prop] = option.selectedOptions[0].value;
+      formData.data[item.prop + "Name"] = option.selectedOptions[0].label;
+      formConfig[index].showPicker = false;
+      changeSupply(option.selectedOptions[0].value);
+    },
+  },
+  {
+    type: "input",
+    label: proxy.t("purchasePayment.paymentDescription"),
+    prop: "remark",
+    itemType: "textarea",
+    readonly: false,
+  },
+  {
+    type: "input",
+    label: proxy.t("purchasePayment.documentNumber"),
+    prop: "receiptsNum",
+    itemType: "number",
+    readonly: false,
+  },
+  {
+    type: "picker",
+    label: proxy.t("purchasePayment.invoiceType"),
+    prop: "invoiceType",
+    itemType: "onePicker",
+    showPicker: false,
+    readonly: false,
+    fieldNames: {
+      text: "label",
+      value: "value",
+    },
+    data: [],
+    changeFn: function (option, item, index) {
+      proxy.formChange(option, item, formData);
+      formConfig[index].showPicker = false;
+      changeInvoiceType(formData.data[item.prop]);
+    },
+  },
+  {
+    type: "input",
+    label: proxy.t("purchasePayment.taxRate") + "（%）",
+    prop: "rate",
+    itemType: "number",
+    readonly: false,
+  },
+]);
+const formOptionOne = reactive({
+  readonly: false, //用于控制整个表单是否只读
+  disabled: false,
+  labelAlign: "top",
+  scroll: true,
+  labelWidth: "62pk",
+  submitBtnText: proxy.t("common.submit"),
+  hiddenSubmitBtn: true,
+});
+const formConfigOne = reactive([
+  {
+    type: "input",
+    label: proxy.t("purchasePayment.totalPaymentAmount"),
+    prop: "amount",
+    itemType: "number",
+    readonly: false,
+  },
+  {
+    type: "picker",
+    label: proxy.t("purchasePayment.paymentMethon"),
+    prop: "payType",
+    itemType: "onePicker",
+    showPicker: false,
+    readonly: false,
+    fieldNames: {
+      text: "label",
+      value: "value",
+    },
+    data: [],
+    changeFn: function (option, item, index) {
+      proxy.formChange(option, item, formData);
+      formConfigOne[index].showPicker = false;
+    },
+  },
+  {
+    type: "picker",
+    label: proxy.t("purchasePayment.paymentAccount"),
+    prop: "accountManagementId",
+    itemType: "onePicker",
+    showPicker: false,
+    readonly: false,
+    fieldNames: {
+      text: "label",
+      value: "value",
+    },
+    data: [],
+    changeFn: function (option, item, index) {
+      proxy.formChange(option, item, formData);
+      formConfigOne[index].showPicker = false;
+      changeAccount(formData.data[item.prop]);
+    },
+  },
+  {
+    type: "input",
+    label: proxy.t("purchasePayment.accountName"),
+    prop: "name",
+    itemType: "text",
+    readonly: false,
+  },
+  {
+    type: "input",
+    label: proxy.t("purchasePayment.bankAccount"),
+    prop: "accountOpening",
+    itemType: "text",
+    readonly: false,
+  },
+  {
+    type: "input",
+    label: proxy.t("purchasePayment.bankOfDeposit"),
+    prop: "openingBank",
+    itemType: "text",
+    readonly: false,
+  },
+  {
+    type: "input",
+    label: proxy.t("purchasePayment.interbankNumber"),
+    prop: "interbankNumber",
+    itemType: "text",
+    readonly: false,
   },
 ]);
-
 const supplierList = ref([]);
 const accountList = ref([]);
 const invoiceType = ref([]);
@@ -169,6 +400,36 @@ const changeSupply = (val) => {
   }
   formData.data.payDetailList = [];
 };
+const changeType = (val) => {
+  if (val == "1") {
+    formConfig[3].type = "picker";
+  } else {
+    formConfig[3].type = "pickerOne";
+  }
+};
+const changeInvoiceType = (val) => {
+  if (val == "1") {
+    formConfig[7].type = "input";
+    formData.data.rate = "13";
+  } else if (val == "2") {
+    formConfig[7].type = "input";
+    formData.data.rate = "6";
+  } else {
+    formConfig[7].type = "inputOne";
+    formData.data.rate = "";
+  }
+};
+const changeAccount = (val) => {
+  if (val) {
+    let data = accountList.value.filter((item) => item.value === val);
+    if (data && data.length > 0) {
+      formData.data.name = data[0].bankName;
+      formData.data.accountOpening = data[0].accountOpening;
+      formData.data.openingBank = data[0].openingBank;
+      formData.data.interbankNumber = data[0].interbankNumber;
+    }
+  }
+};
 const getDict = () => {
   proxy
     .post("/supplierInfo/page", { pageNum: 1, pageSize: 999 })
@@ -196,6 +457,7 @@ const getDict = () => {
           value: item.id,
         };
       });
+      formConfigOne[2].data = accountList.value;
     });
   proxy.getDictOne(["invoice_type", "funds_payment_method"]).then((res) => {
     invoiceType.value = res["invoice_type"].data.map((x) => ({
@@ -206,9 +468,24 @@ const getDict = () => {
       label: x.dictValue,
       value: x.dictKey,
     }));
+    formConfig[6].data = invoiceType.value;
+    formConfigOne[1].data = fundsPaymentMethod.value;
   });
 };
 getDict();
+
+const handleSubmit = async () => {
+  if (formData.data.payDetailList && formData.data.payDetailList.length > 0) {
+    console.log(formDom.value.testForm.value.submit(), "ss");
+  } else {
+    showFailToast(proxy.t("purchasePayment.pleaseAddPaymentDetails"));
+    return false;
+  }
+};
+
+defineExpose({
+  handleSubmit,
+});
 </script>
 
 <style lang="scss" scoped>