【开发】组合缴费

2022-07-18 17:13:24 +08:00
parent 6c8cb5fc81
commit 536e97ee86
2 changed files with 193 additions and 8 deletions
@@ -99,7 +99,7 @@
            </a-form-item>
          </a-col>
        </a-row>
-        <a-row class="payment-table">
+        <a-row class="payment-table" v-if="!addFlag">
          <a-col :span="1"></a-col>
          <a-col :span="22">
            <table class="table" border="1">
@@ -168,6 +168,81 @@
          </a-col>
          <a-col :span="1"></a-col>
        </a-row>
+        <template v-if="addFlag">
+          <a-row>
+            <a-col :span="12">
+              <a-form-item label="缴费总金额" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                {{allAmount}}
+                (请填写分类金额)
+              </a-form-item>
+            </a-col>
+            <a-col :span="12">
+              <a-form-item label="会员类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <template v-if="memberType === 1  ">
+                  副理事长单位
+                </template>
+                <template v-else>
+                  <span v-if="initVal == '2' ">VIP会员</span>
+                  <span v-else>普通会员</span>
+                </template>
+              </a-form-item>
+            </a-col>
+          </a-row>
+          <a-row>
+            <a-col :span="12">
+              <a-form-item label="会员缴费金额" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input
+                  :disabled="checkFlag||detailFlag"
+                  v-decorator="['memberPaymentAmount',validatorRules.serviceCharge]"
+                  :trigger-change="true"
+                  @blur="calculateAllAmount"
+                  @change="event => event.target.value = event.target.value.trim()"
+                  placeholder="请输入会员缴费金额"
+                  :maxLength="50"></a-input>
+              </a-form-item>
+            </a-col>
+
+            <a-col :span="12">
+              <a-form-item label="缴费时长" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <j-dict-select-tag
+                  :disabled="checkFlag||detailFlag"
+                  @change="changgeType"
+                  type="list"
+                  v-decorator="['paymentTime',{ rules: validatorRules.paymentTime.rules, initialValue:paymentTime}]"
+                  :trigger-change="true"
+                  dictCode="payment_time"
+                  placeholder="请选择缴费时长"
+                />
+              </a-form-item>
+            </a-col>
+
+          </a-row>
+
+          <a-row>
+            <a-col :span="12">
+              <a-form-item label="证书缴费金额" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input
+                  :disabled="checkFlag||detailFlag"
+                  v-decorator="['certificatePaymentAmount',validatorRules.certificatePaymentAmount]"
+                  @blur="calculateAllAmount"
+                  @change="event => event.target.value = event.target.value.trim()"
+                  placeholder="请输入证书缴费金额"
+                  :maxLength="50"></a-input>
+              </a-form-item>
+            </a-col>
+            <a-col :span="12">
+              <a-form-item label="其他缴费金额" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input
+                  :disabled="checkFlag||detailFlag"
+                  v-decorator="['otherPaymentAmount',validatorRules.certificatePaymentAmount]"
+                  @blur="calculateAllAmount"
+                  @change="event => event.target.value = event.target.value.trim()"
+                  placeholder="请输入其他缴费金额"
+                  :maxLength="50"></a-input>
+              </a-form-item>
+            </a-col>
+          </a-row>
+        </template>
        <!--        打包会员显示 -->
        <div v-if="paymentMethodFlag">
          <a-row>
@@ -451,6 +526,67 @@
        </div>

        <!--   证书信息     -->
+        <!--   申请证书信息begin     -->
+        <!--只有新增的时候显示-->
+        <template v-if="!model.id">
+          <a-divider orientation="left">证书申请信息</a-divider>
+          <a-row>
+            <a-col :span="12">
+              <a-form-item label="证书类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <j-dict-select-tag
+                  @change="changeCertificateType"
+                  dictCode="certificate_type"
+                  :triggerChange="true"
+                  v-decorator="['certificateType',validatorRules.certificateType]"
+                  placeholder="请选择证书类型"/>
+              </a-form-item>
+            </a-col>
+            <a-col :span="12">
+              <a-form-item label=" 证书代码" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input
+                  :maxLength="50"
+                  placeholder="请输入证书代码"
+                  v-decorator="['code',validatorRules.clientCode]"
+                ></a-input>
+              </a-form-item>
+              <span class="apply-code-notice">一次申请仅能输入一个证书代码</span>
+            </a-col>
+          </a-row>
+          <a-row>
+            <a-col :span="12">
+              <a-form-item label="通讯地址" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input
+                  :maxLength="50"
+                  placeholder="请输入通讯地址"
+                  v-decorator="['address',validatorRules.address]"
+                ></a-input>
+              </a-form-item>
+            </a-col>
+
+            <a-col :span="12">
+              <a-form-item label="邮编" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-input
+                  :maxLength="50"
+                  placeholder="请输入邮编"
+                  v-decorator="['postcode',validatorRules.postcode]"
+                ></a-input>
+              </a-form-item>
+            </a-col>
+          </a-row>
+          <a-row v-if="certificateType == '1' ">
+            <a-col :span="12">
+              <a-form-item label="备案通知书" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <j-dict-select-tag
+                  v-decorator="['noticeOfFiling']"
+                  :triggerChange="true"
+                  placeholder="请选择备案通知书"
+                  dictCode="notice_of_filing"/>
+              </a-form-item>
+            </a-col>
+          </a-row>
+        </template>
+        <!--   申请证书信息end     -->
+


        <!--   审核     -->
@@ -584,6 +720,18 @@ export default {
          ],
          validateTrigger: 'blur'
        },
+        certificatePaymentAmount: {
+          rules: [
+            {
+              required: false, message: '请输入缴费金额'
+            },
+            {
+              pattern: /^[1-9](\d{1,8})?(\.\d{1,2})$|^0\.([1-9](\d{0,1})|\d[1-9])$|^[1-9]\d{0,8}$|^0$/,
+              message: '请输入合法的金额数字，最多2位小数,8位正数'
+            }
+          ],
+          validateTrigger: 'blur'
+        },

        paymentAmount: {
          rules: [
@@ -656,10 +804,12 @@ export default {
      url: {
        add: '/paymentInfo/add',
        edit: '/paymentInfo/edit',
-        check: '/paymentInfo/check'
+        check: '/paymentInfo/check',
+        combinationUrl: '/paymentInfo/addCombination' // 组合缴费
      },
      // 缴费时长 5年vip会员 为true  1年普通会员为  false
      typeFlag: false,
+      certificateType: undefined, // 证书类型
      // 缴费表头
      payColumns: [
        {
@@ -856,13 +1006,35 @@ export default {
      // 提交
      submitFlag: false,
      // 最新的缴费通知单信息
-      newestNoticeInfo: {}
+      newestNoticeInfo: {},
+      allAmount: 0 // 缴费总金额
    }
  },
  created() {
    // this.loadMember();
  },
  methods: {
+    /**
+     * 计算缴费总金额
+     * */
+    calculateAllAmount() {
+      this.$nextTick(() => {
+        const memberAmount = this.form.getFieldValue('memberPaymentAmount') ? Number(this.form.getFieldValue('memberPaymentAmount')) : 0
+        const certificateAmount = this.form.getFieldValue('certificatePaymentAmount') ? Number(this.form.getFieldValue('certificatePaymentAmount')) : 0
+        const otherAmount = this.form.getFieldValue('otherPaymentAmount') ? Number(this.form.getFieldValue('otherPaymentAmount')) : 0
+        this.form.validateFields(['memberPaymentAmount', 'certificatePaymentAmount', 'otherPaymentAmount'], (err) => {
+          if (!err) {
+            this.allAmount = (memberAmount + certificateAmount + otherAmount) + ''
+          }
+        })
+      })
+    },
+    /**
+     * 改变证书类型 世界制造厂证书显示备案通知书
+     * */
+    changeCertificateType(val) {
+      this.certificateType = val
+    },
    /* 添加*/
    add() {
      this.addFlag = true
@@ -949,8 +1121,10 @@ export default {
      if(!this.model.id){
         // 判断是否是 副理事单位
        this.$nextTick( () => {
-          this.form.setFieldsValue({paymentAmount:commonMemberCost(this.memberType)})
+          this.form.setFieldsValue({paymentAmount:commonMemberCost(this.memberType),'memberPaymentAmount': commonMemberCost(this.memberType)})
        })
+        // 计算缴费总金额
+        this.calculateAllAmount()
      }

      this.model.memberId = this.memberId
@@ -982,6 +1156,7 @@ export default {
    close() {
      this.$emit('close')
      this.visible = false
+      this.certificateType = undefined
      this.addFlag = false
      this.typeFlag = false
      this.checkFlag = false
@@ -1004,6 +1179,7 @@ export default {
      this.isCash = ''
      this.submitFlag = false
      this.initVal = 1
+      this.confirmLoading = false
    },
    handleOk() {

@@ -1178,19 +1354,20 @@ export default {
      switch (Number(value)) {
        // 1年
        case 1: this.typeFlag = false
-          form.setFieldsValue({ 'paymentType': 0, 'paymentAmount': commonMemberCost(this.memberType) })
+          form.setFieldsValue({ 'paymentType': 0, 'paymentAmount': commonMemberCost(this.memberType),'memberPaymentAmount': commonMemberCost(this.memberType)  })
          break
        // 5年
        case 2:
          this.typeFlag = true
-          form.setFieldsValue({ 'paymentType': 1, 'paymentAmount': vipMemberCost(this.memberType) })
+          form.setFieldsValue({ 'paymentType': 1, 'paymentAmount': vipMemberCost(this.memberType),'memberPaymentAmount': vipMemberCost(this.memberType) })
          break
        // 升级专用
        case 3:
          this.typeFlag = true
-          form.setFieldsValue({ 'paymentAmount': upgradeVip(this.memberType) })
+          form.setFieldsValue({ 'paymentAmount': upgradeVip(this.memberType),'memberPaymentAmount': upgradeVip(this.memberType)  })
          break
      }
+      this.calculateAllAmount()
    },

    /* 审核选择*/
@@ -1344,6 +1521,13 @@ export default {
  font-size: 14px;
 }

+.apply-code-notice {
+  color: #f5222d;
+  position: absolute;
+  bottom: 4px;
+  left: 25%
+}
+
 .remark {
  //margin-left: -100px;
 }
@@ -9,7 +9,7 @@
    <div class='alteration-center'>
      <div class='alteration-content'>

-        <span class='setPassword'>注册</span>
+        <span class='setPassword'>中汽标协会员注册</span>
        <div class="steps-box">
          <a-steps :current="current">
            <a-step v-for="item in steps" :key="item.title" :title="item.title"/>
@@ -562,6 +562,7 @@ export default {
    background: #fff;
    height: 60px;
    text-align: center !important;
+    letter-spacing: 2px;
    margin-top: 30px;
  }
 }