【update】会议报名编辑页面数据的回显

src/components/company/AddMeetingCompany.vue

@@ -36,6 +36,12 @@ export default {
     valueKey: {
       type: String,
       default: 'companyName'
+    },
+    // 是否返回企业的全部信息，如果是 则再change方法中以第二个参数返回
+    fullCompanyInfo: {
+      type: Boolean,
+      required: false,
+      default: false
     }
   },
   components: {
@@ -70,7 +76,11 @@ export default {
     * */
     setCompanyVal(selectedVal) {
       let {id, companyName} = selectedVal
-      this.$emit('change', {id, companyName})
+      if(this.fullCompanyInfo) {
+        this.$emit('change', {id, companyName}, {...selectedVal})
+      } else {
+        this.$emit('change', {id, companyName})
+      }
     }
   },
   model: {

src/enums/commonEnums.js

@@ -7,4 +7,18 @@ export const ProjectTypeEnums = {
   MEMBER_PRO: {name: '资料网员', value: 4},
   STANDARD_MEMBER_PRO: {name: '标协会员项目', value: 5},
   STANDARD_CERTIFICATE_PRO: {name: '标协证书项目', value: 6},
-}
+}
+
+// 参会人员身份类型
+export const MeetIdentifyTypeEnums = {
+  guest: { name: '嘉宾', index: 1 },
+  attendee: { name: '参会人', index: 2 },
+  internal: { name: '内部企业', index: 3 }
+}
+
+// 需要发票的类型
+export const InvoiceTypeEnums = {
+  noNeed: { name: '不需要', index: 0 },
+  plain: { name: '增值税普通发票', index: 1 },
+  special: { name: '增值税专用发票', index: 2 }
+}

src/views/incomePayments/meetManage/OtherMeetingForm.vue

@@ -1,32 +1,5 @@
 <template>
   <a-form :form="form">
-    <!--    <div class="item-title">行程信息</div>-->
-    <!--    <a-row :gutter="24">-->
-    <!--      <a-col :xxl="8" :xl="12" :sm="24">-->
-    <!--        <a-form-item label="是否住酒店" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
-    <!--          <a-radio-group v-decorator="['checkInHotel']">-->
-    <!--            <a-radio :value="1">是</a-radio>-->
-    <!--            <a-radio :value="0">否</a-radio>-->
-    <!--          </a-radio-group>-->
-    <!--        </a-form-item>-->
-    <!--      </a-col>-->
-
-    <!--      <a-col :xxl="8" :xl="12" :sm="24">-->
-    <!--        <a-form-item label="抵达时间" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
-    <!--          <j-date placeholder="请选择抵达时间" style="width: 100%;" v-decorator="['arrivalTime']" :trigger-change="true" :disabled-date="disabledStartDate"-->
-    <!--                  date-format="YYYY-MM-DD"/>-->
-    <!--        </a-form-item>-->
-    <!--      </a-col>-->
-
-    <!--      <a-col :xxl="8" :xl="12" :sm="24">-->
-    <!--        <a-form-item label="离开时间" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
-    <!--          <j-date placeholder="请选择离开时间" :disabled-date="disabledEndDate" style="width: 100%;"-->
-    <!--                  v-decorator="['departureTime']" :trigger-change="true"-->
-    <!--                  date-format="YYYY-MM-DD"/>-->
-    <!--        </a-form-item>-->
-    <!--      </a-col>-->
-    <!--    </a-row>-->
-    <!--    选择嘉宾和内部企业、缴费方式为打包也不显示-->
     <!--    会议费为0不显示 -->
     <template v-if="!meetingCostBool">
       <div class="item-title" v-if="identifyType === 2">缴费信息</div>
@@ -104,12 +77,87 @@
       </template>
 
     </template>
-    <!--    其他会议选择嘉宾和内部企业、缴费方式为打包也不显示-->
-    <!--    会议费为0不显示 -->
-    <template v-if="!meetingCostBool && !needInvoiceBool ">
-      <div class="item-title" v-if="identifyType === 2 && !payModeBool ">邮寄信息</div>
+
+    <!-- 发票信息=== 会议费用不为0 且需要发票 且 身份为参会人 且 缴费方式不是打包 -->
+    <template v-if="!meetingCostBool && needInvoiceBool && identifyType === MeetIdentifyTypeEnums.attendee.index && !payModeBool">
+      <div class="item-title">发票信息</div>
       <a-row :gutter="24">
-        <a-col :xxl="8" :xl="12" :sm="24" v-if="identifyType === 2 && !payModeBool ">
+        <a-col :xxl="8" :xl="12" :sm="24">
+          <a-form-item label="企业名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input placeholder="请输入企业名称"
+                     v-decorator="['companyName',validatorRules.companyName]"
+                     :maxLength='50'
+                     disabled
+                     @change="e => {e.target.value = (e.target.value + '').trim()}"></a-input>
+          </a-form-item>
+        </a-col>
+        <a-col :xxl="8" :xl="12" :sm="24">
+          <a-form-item label="信用代码" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input placeholder="请输入信用代码"
+                     v-decorator="['dutyCode', validatorRules.dutyCode]"
+                     :maxLength='18'
+                     @change="e => {e.target.value = (e.target.value + '').trim()}"></a-input>
+          </a-form-item>
+        </a-col>
+        <!--增值税专用发票 多5个信息-->
+        <template v-if="selectedInvoiceType === InvoiceTypeEnums.special.index">
+          <a-col :xxl="8" :xl="12" :sm="24">
+            <a-form-item label="公司地址" :labelCol="labelCol" :wrapperCol="wrapperCol">
+              <a-input placeholder="请输入公司地址"
+                       v-decorator="['companyAddress', validatorRules.companyAddress]"
+                       :maxLength='50'
+                       @change="e => {e.target.value = (e.target.value + '').trim()}"></a-input>
+            </a-form-item>
+          </a-col>
+          <a-col :xxl="8" :xl="12" :sm="24">
+            <a-form-item label="公司电话" :labelCol="labelCol" :wrapperCol="wrapperCol">
+              <a-input placeholder="请输入公司电话"
+                       v-decorator="['companyPhone', validatorRules.companyPhone]"
+                       :maxLength='15'
+                       @change="e => e.target.value = (e.target.value.replace(/[^0-9-]/g, '')).trim()"></a-input>
+            </a-form-item>
+          </a-col>
+          <a-col :xxl="8" :xl="12" :sm="24">
+            <a-form-item label="开户行" :labelCol="labelCol" :wrapperCol="wrapperCol">
+              <a-input placeholder="请输入开户行"
+                       v-decorator="['openingBank', validatorRules.openingBank]"
+                       :maxLength='50'
+                       @change="e => {e.target.value = (e.target.value + '').trim()}"></a-input>
+            </a-form-item>
+          </a-col>
+          <a-col :xxl="8" :xl="12" :sm="24">
+            <a-form-item label="银行账号" :labelCol="labelCol" :wrapperCol="wrapperCol">
+              <a-input placeholder="请输入银行账号"
+                       v-decorator="['bankAccount', validatorRules.bankAccount]"
+                       :maxLength='50'
+                       @change="e => {e.target.value = (e.target.value + '').trim()}"></a-input>
+            </a-form-item>
+          </a-col>
+          <a-col :xxl="8" :xl="12" :sm="24">
+            <a-form-item label="联行号" :labelCol="labelCol" :wrapperCol="wrapperCol">
+              <a-input placeholder="请输入联行号"
+                       v-decorator="['linkBankNumber', validatorRules.linkBankNumber]"
+                       :maxLength='50'
+                       @change="e => {e.target.value = (e.target.value + '').trim()}"></a-input>
+            </a-form-item>
+          </a-col>
+        </template>
+        <a-col :xxl="8" :xl="12" :sm="24">
+          <a-form-item label="发票项目" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <j-dict-select-tag style="width: 100%" dict-code="invoice_project"
+                               v-decorator="['invoiceProject',validatorRules.invoiceProject]"
+                               :trigger-change="true"
+                               placeholder="请选择发票项目"></j-dict-select-tag>
+          </a-form-item>
+        </a-col>
+      </a-row>
+    </template>
+    <!--    其他会议选择嘉宾和内部企业、缴费方式为打包也不显示-->
+    <!--    会议费用不为0 且需要发票 且 身份为参会人 且 缴费方式不是打包 -->
+    <template v-if="!meetingCostBool && needInvoiceBool && identifyType === MeetIdentifyTypeEnums.attendee.index && !payModeBool ">
+      <div class="item-title">邮寄信息</div>
+      <a-row :gutter="24">
+        <a-col :xxl="8" :xl="12" :sm="24">
           <a-form-item label="邮寄联系人" :labelCol="labelCol" :wrapperCol="wrapperCol">
             <select-contacts :selected-company="selectedCompany"
                              :init-contacts="selectPostPerson"
@@ -124,7 +172,7 @@
           </a-form-item>
         </a-col>
         <!--    选择嘉宾和内部企业、缴费方式为打包也不显示-->
-        <a-col :xxl="8" :xl="12" :sm="24" v-if="identifyType === 2 && !payModeBool ">
+        <a-col :xxl="8" :xl="12" :sm="24">
           <a-form-item label="邮寄地址" :labelCol="labelCol" :wrapperCol="wrapperCol">
             <a-input placeholder="请输入邮寄地址"
                      :maxLength='50'
@@ -133,7 +181,7 @@
           </a-form-item>
         </a-col>
 
-        <a-col :xxl="8" :xl="12" :sm="24" v-if="identifyType === 2 && !payModeBool ">
+        <a-col :xxl="8" :xl="12" :sm="24">
           <a-form-item label="邮编" :labelCol="labelCol" :wrapperCol="wrapperCol">
             <a-input placeholder="请输入邮编"
                      :disabled="isEditBool"
@@ -158,6 +206,8 @@ import {getContactsById} from '@api/api'
 import {money} from '@/utils/validate'
 import {CalcAmountMixin} from '@/mixins/CalcAmountMixin'
 import {addZero} from '@/utils/util'
+import { InvoiceTypeEnums, MeetIdentifyTypeEnums } from '../../../enums/commonEnums'
+
 
 export default {
   name: 'OtherMeetingForm',
@@ -196,6 +246,8 @@ export default {
   },
   data() {
     return {
+      InvoiceTypeEnums,
+      MeetIdentifyTypeEnums,
       desription: '其他会议的参会情况的表单',
       ysjeKey: 'amountReceivable',
       form: this.$form.createForm(this),
@@ -262,12 +314,45 @@ export default {
           rules: [{required: true, message: '请输入邮编'}],
           validateTrigger: 'blur'
         },
+        companyName: {
+          rules: [{ required: true, message: '请输入企业名称' }],
+          validateTrigger: 'blur'
+        },
+        dutyCode: {
+          rules: [{required: true, message: '请输入信用代码'}, {
+            pattern: /^([0-9A-HJ-NPQRTUWXY]{2}\d{6}[0-9A-HJ-NPQRTUWXY]{10}|[1-9]\d{14})$/,
+            message: '请输入15位、18位的信用代码'
+          }],
+          validateTrigger: 'blur'
+        },
+        companyAddress: {
+          rules: [{ required: true, message: '请输入公司地址' }],
+          validateTrigger: 'blur'
+        },
+        companyPhone: {
+          rules: [{ required: true, validator: this.checkCompanyPhone }],
+          validateTrigger: 'blur'
+        },
+        openingBank: {
+          rules: [{ required: true, message: '请输入开户行' }],
+          validateTrigger: 'blur'
+        },
+        bankAccount: {
+          rules: [{ required: true, message: '请输入银行账号' }],
+          validateTrigger: 'blur'
+        },
+        linkBankNumber: { rules: [{ required: true, message: '请输入联行号' }], validateTrigger: 'blur' },
+        invoiceProject: {
+          rules: [{required: true, message: '请选择发票项目'}],
+          validateTrigger: 'change'
+        },
 
       },
       // 是否可编辑
       isEditBool: false,
       // 是否需要发票
-      needInvoiceBool: true,
+      needInvoiceBool: false,
+      selectedInvoiceType: 0, // 选择是否需要发票
       // 是否已经到账
       isCheckInBool: false,
     }
@@ -319,6 +404,29 @@ export default {
     handleOk() {
       this.form.validateFields((err, values) => {
         if (!err) {
+          // 如果需要发票，判断当前的发票信息是否进行了修改，用于最后提交的时候判断是否请求接口，减少冗余的请求
+          let needInvoice = Number(values.needInvoice)
+          if (needInvoice) {
+            let confirmArr = [
+              {name: '企业名称', key: 'companyName'},
+              {name: '信用代码', key: 'dutyCode'},
+            ]
+            if(needInvoice === InvoiceTypeEnums.special.index) {
+              confirmArr = confirmArr.concat([
+                {name: '公司地址', key: 'companyAddress'},
+                {name: '公司电话', key: 'companyPhone'},
+                {name: '开户行', key: 'openingBank'},
+                {name: '银行账号', key: 'bankAccount'},
+                {name: '联行号', key: 'linkBankNumber'}
+              ])
+            }
+            let changeInvoiceFlag = confirmArr.some(tt => {
+              if(this.selectedCompany[tt.key] !== values[tt.key]) {
+                return true
+              }
+            })
+            values.changeInvoiceFlag = changeInvoiceFlag
+          }
           this.$emit('formData', values)
         } else {
           this.$emit('formData', {stop: true})
@@ -398,7 +506,10 @@ export default {
     setFormVal(record) {
       // this.isEditBool = record.checkResult === 1
       this.isEditBool = false
-      this.needInvoiceBool = record.needInvoice === 0
+      this.needInvoiceBool = record.needInvoice !== 0
+      this.changeInvoice(record.needInvoice)
+      // this.selectedInvoiceType = Number(record.needInvoice)
+
       // 是否已经到账
       this.isCheckInBool = record.inAccount === 1
       // 回显邮寄联系人
@@ -424,7 +535,8 @@ export default {
           'amountReceivable',
           'taxRate',
           'tax',
-          'noTaxAmount'
+          'noTaxAmount',
+          'invoiceProject' // 发票项目
         ))
       })
 
@@ -434,11 +546,43 @@ export default {
     * 选择发票
     * */
     changeInvoice(val) {
+      this.selectedInvoiceType = Number(val)
       if (val === '0') {
         // 不需要发票
-        this.needInvoiceBool = true
-      } else {
         this.needInvoiceBool = false
+      } else {
+        this.needInvoiceBool = true
+      }
+      this.setInvoiceFormItem()
+    },
+    // 设置表单中发票的信息
+    setInvoiceFormItem() {
+      if (this.selectedInvoiceType === InvoiceTypeEnums.special.index) {
+        this.$nextTick(() => {
+          this.form.setFieldsValue(pick(this.selectedCompany, 'companyName', 'dutyCode', 'companyAddress', 'companyPhone', 'bankAccount', 'openingBank', 'linkBankNumber'))
+        })
+      } else if(this.selectedInvoiceType === InvoiceTypeEnums.plain.index) {
+        this.$nextTick(() => {
+          this.form.setFieldsValue(pick(this.selectedCompany, 'companyName', 'dutyCode'))
+        })
+      }
+    },
+    // 清空 发票信息的数据
+    clearInvoiceFormItem() {
+      this.form.resetFields(['companyName', 'dutyCode', 'companyAddress', 'companyPhone', 'bankAccount', 'openingBank', 'linkBankNumber'])
+    },
+    /*
+    * 验证发票信息-电话号码 的正确性
+    * */
+    checkCompanyPhone(rule, value, callback) {
+      const reg = /^((13[0-9])|(14[579])|(15([0-3]|[5-9]))|(17[0135678])|(18[0-9])|(19[8|9])|(16[6]))\d{8}$|^([0-9]{3,4}-)[0-9]{7,8}$/
+      if (!value) {
+        callback('请输入电话号码')
+      }
+      if (value && !reg.test(value)) {
+        callback(new Error('请输入正确格式的电话号码'))
+      } else {
+        callback()
       }
     },
     addContactsOk() {

src/views/incomePayments/meetManage/SignUpInfoEdit.vue

@@ -11,6 +11,7 @@
               <a-form-item label="参会企业" :labelCol="labelCol" :wrapperCol="wrapperCol">
                 <add-meeting-company @change="changeCompany" v-decorator="['companyId',validatorRules.companyId]"
                                      placeholder="请选择参会企业"
+                                     full-company-info
                                      :disabled="model.checkResult === 1"
                                      :maxLength='50'>
                 </add-meeting-company>
@@ -43,25 +44,6 @@
               </a-form-item>
             </a-col>
 
-<!--            <a-col :xxl="8" :xl="12" :sm="24">-->
-<!--              <a-form-item label="职务" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
-<!--                <a-input placeholder="请输入职务"-->
-<!--                         :maxLength='50'-->
-<!--                         disabled-->
-<!--                         v-decorator="[ 'post']"></a-input>-->
-<!--              </a-form-item>-->
-<!--            </a-col>-->
-
-<!--            <a-col :xxl="8" :xl="12" :sm="24">-->
-<!--              <a-form-item label="邮箱" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
-<!--                <a-input placeholder="请输入邮箱"-->
-<!--                         :maxLength='50'-->
-<!--                         disabled-->
-<!--                         v-decorator="[ 'email',-->
-<!--                         validatorRules.email]"></a-input>-->
-<!--              </a-form-item>-->
-<!--            </a-col>-->
-
             <a-col :xxl="8" :xl="12" :sm="24">
               <a-form-item label="身份" :labelCol="labelCol" :wrapperCol="wrapperCol">
                 <a-radio-group   v-decorator="['identity',validatorRules.identify]" @change="changeIdentify">
@@ -324,10 +306,19 @@ export default {
       // 参会单位回显
       this.model.companyId = {
         id:this.model.companyId,
-        companyName:this.model.companyName
+        companyName:this.model.companyName,
       }
       // 参会人回显
-      this.selectedCompany = this.model.companyId
+      // this.selectedCompany = this.model.companyId
+      this.selectedCompany = Object.assign({}, this.model.companyId, {
+        //   写入发票的信息，因为需要回显
+        dutyCode:this.model.dutyCode, // 信用代码
+        companyAddress:this.model.companyAddress, // 公司地址
+        companyPhone:this.model.companyPhone, // 公司电话
+        openingBank:this.model.openingBank, // 开户行
+        bankAccount:this.model.bankAccount, // 银行账号
+        linkBankNumber:this.model.linkBankNumber // 联行号
+      })
       this.selectPerson = {
         id:this.model.companyContactTemporaryId,
         name:this.model.companyContactName
@@ -465,8 +456,9 @@ export default {
     /*
     * 选择参会企业
     * */
-    changeCompany(value) {
-      this.selectedCompany = value
+    changeCompany(value, otherParams) {
+      // this.selectedCompany = value
+      this.selectedCompany = otherParams
       // 去掉未审核 去判断的企业是否是标协会企业
       let companyName = this.selectedCompany.companyName.replaceAll('（未审核）','')
 
@@ -495,10 +487,13 @@ export default {
       this.form.resetFields(['companyContactId','phone'])
       if(this.$refs.formother ){
         this.$refs.formother.clearFormItem()
+        // 设置发票的相关信息
+        this.$refs.formother.setInvoiceFormItem()
       }
       // 判断当前企业是否是内部企业
       console.log('-----this.selectedCompany-----', this.selectedCompany)
       this.judgeInternalEnterprise(this.selectedCompany.id)
+
     },
     /*
     * 选择联系人获取信息