LK/income_payments_enterprise_terminal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[update]-重构了会员管理页面缴费、编辑模态框代码；证书续费和续费编辑的代码

Browse Source
This commit is contained in:
fengchenchen
2023-07-25 20:34:32 +08:00
parent f2c1ab886b
commit 320035d78b
3 changed files with 696 additions and 1057 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/standardsAssociation/PaymentInfo/modules/PaymentInfoModal.vue
+320 -667
View File
File diff suppressed because it is too large Load Diff
src/views/standardsAssociation/model/RenewChargeEditModel.vue
+261 -218
View File
@@ -76,12 +76,22 @@
<a-input :maxLength="50" disabled v-model="model.mobile" placeholder="请输入手机号"></a-input>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="缴费日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-date
date-format="YYYY-MM-DD HH:mm:ss"
placeholder="请选择缴费时间"
v-decorator="['submissionTime',validatorRules.submissionTime]"
:trigger-change="true"
style="width: 100%"/>
</a-form-item>
</a-col>
</a-row>
<a-row>
<a-col :span="12">
<a-form-item label="缴费方式" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-dict-select-tag
type="list"
v-model="memberInfoPayment.paymentMethod"
v-decorator="['paymentMethod',validatorRules.paymentMethod]"
@change="changePaymentMethod"
:trigger-change="true"
@@ -89,155 +99,130 @@
placeholder="请选择缴费方式"/>
</a-form-item>
</a-col>
</a-row>
<a-row>
<a-col :span="12">
<a-form-item label="缴费金额" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input-number
:maxLength="50"
v-model="memberInfoPayment.paymentAmount"
v-decorator="['paymentAmount',validatorRules.paymentAmount]"
placeholder="请输入缴费金额"
style="width: 100%"/>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="缴费日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-date
date-format="YYYY-MM-DD HH:mm:ss"
placeholder="请选择缴费时间"
v-model="memberInfoPayment.submissionTime"
v-decorator="['submissionTime',validatorRules.submissionTime]"
:trigger-change="true"
style="width: 100%"/>
</a-form-item>
</a-col>
</a-row>
<div v-if="paymentMethodFlag">
<a-row>
<a-col :span="12" v-if="isWireTransfer == 2">
<a-form-item label="打包协议" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-upload
file-type="pdf"
file-type-error-message="请上传pdf文件"
:multiple="false"
:number="1"
bizPath="payment"
v-model="memberInfoPayment.paymentRecord"
v-decorator="['paymentRecord',validatorRules.paymentRecord1]"
:trigger-change="true"></j-upload>
<span style="color: #bfbfbf">请上传pdf文件</span>
</a-form-item>
</a-col>
</a-row>
</div>
<div v-if="paymentMethodFlag == false">
<a-row>
</a-row>
<a-row>
<!--缴费方式为电汇或者现金 -->
<template v-if="paymentMethodFormValue === PaymentMethodEnums.wireTransfer.index || paymentMethodFormValue === PaymentMethodEnums.cash.index">
<a-col :span="12">
<a-form-item label="缴费凭证/付款说明" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-form-item label="缴费凭证/付款说明2" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-image-upload
isLessThan5M
isMultiple
:number="2"
bizPath="payment"
v-decorator="['paymentRecord',validatorRules.paymentRecord]"
v-model="memberInfoPayment.paymentRecord"></j-image-upload>
v-decorator="['paymentRecord', validatorRules.paymentRecord]">
</j-image-upload>
</a-form-item>
<span v-if="!validateCompanyNameFlag " class="paymentRecord-notice">需上传"垫付款说明（盖章"文件）</span>
</a-col>
</template>
<a-col :span="12">
<a-form-item label="凭证金额" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input-number
:maxLength="50"
v-decorator="['paymentAmount',validatorRules.paymentAmount]"
placeholder="请输入凭证金额"
style="width: 100%"/>
</a-form-item>
</a-col>
</a-row>
<!--发票信息 begin-->
<a-divider orientation="left">发票信息</a-divider>
<a-row>
<a-col :span="12">
<a-form-item label="发票" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-dict-select-tag
type="list"
v-decorator="['invoiceRequirements',validatorRules.invoiceRequirements]"
@change="invoiceRequirementsChange"
:trigger-change="true"
dictCode="invoice_requirements"
placeholder="请选择发票"/>
<span v-if="!invoiceRequirementsFlag" class="apply-code-notice">本选项不提供任何形式的发票凭证</span>
</a-form-item>
</a-col>
</a-row>
<template v-if="invoiceRequirementsFlag">
<a-row>
<a-col :span="12">
<a-form-item label="付款单位发票抬头" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
v-decorator="['headerName',{ ...validatorRules.headerName,initialValue:currentMemberInfo.invoiceInfo}]"
:trigger-change="true"
@change="event => event.target.value = event.target.value.trim()"
@blur="validateCompanyName"
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
type="list"
v-model="memberInfoPayment.invoiceRequirements"
v-decorator="['invoiceRequirements',validatorRules.invoiceRequirements]"
@change="invoiceRequirementsChange"
:trigger-change="true"
dictCode="invoice_requirements"
placeholder="请选择发票"/>
<a-form-item label="社会统一代码/税号" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
@change="event => event.target.value = event.target.value.trim()"
v-decorator="['taxNumber',{ ...validatorRules.taxNumber, initialValue: currentMemberInfo.taxNo}]"
placeholder="请输入社会统一代码/税号"
:maxLength="50"></a-input>
</a-form-item>
<span v-if="!invoiceRequirementsFlag" class="apply-code-notice">本选项不提供任何形式的发票凭证</span>
</a-col>
</a-row>
<template v-if="invoiceRequirementsFlag">
<a-row>
<a-col :span="12">
<a-form-item label="付款单位发票抬头" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
:maxLength="50"
v-decorator="['headerName',{ ...validatorRules.headerName,initialValue:currentMemberInfo.invoiceInfo}]"
placeholder="请输入付款单位发票抬头"></a-input>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="社会统一代码/税号" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
:maxLength="50"
v-decorator="['taxNumber',{ ...validatorRules.taxNumber,initialValue: currentMemberInfo.taxNo}]"
placeholder="请输入社会统一代码/税号"></a-input>
</a-form-item>
</a-col>
</a-row>
<!-- 2021-09-23变更 增加 单位地址 电话号码 开户银行 银行账户 增值税发票的时候存在-->
<a-row v-if="currentSelectInvoiceType === 2">
<a-col :span="12">
<a-form-item label="单位地址" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
@change="event => event.target.value = event.target.value.trim()"
v-decorator="['invoiceAddress',{ ...validatorRules.invoiceAddress, initialValue:currentMemberInfo.invoiceAddress}]"
placeholder="请输入单位地址"
:maxLength="50"></a-input>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="电话号码" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
v-decorator="['invoicePhone',{ ...validatorRules.invoicePhone, initialValue: currentMemberInfo.invoicePhone}]"
:trigger-change="true"
@change="(e) => {e.target.value = e.target.value.replace(/[^0-9|-]/g,'')}"
placeholder="请输入电话号码"
:maxLength="50"></a-input>
</a-form-item>
</a-col>
</a-row>
<a-row v-if="currentSelectInvoiceType === 2">
<a-col :span="12">
<a-form-item label="开户银行" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
@change="event => event.target.value = event.target.value.trim()"
v-decorator="['depositBank',{ ...validatorRules.depositBank, initialValue:currentMemberInfo.depositBank}]"
placeholder="请输入开户银行"
:maxLength="50"></a-input>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="银行账户" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
@change="(e) => {e.target.value = e.target.value.trim()}"
v-decorator="['bankAccount',{ ...validatorRules.bankAccount, initialValue:currentMemberInfo.bankAccount}]"
placeholder="请输入银行账户"
:maxLength="50"></a-input>
</a-form-item>
</a-col>
</a-row>
<a-row v-if="currentSelectInvoiceType === 2">
<a-col :span="12">
<a-form-item label="联行号" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
@change="(e) => {e.target.value = e.target.value.trim()}"
v-decorator="['linkBankNumber',{ ...validatorRules.linkBankNumber, initialValue:currentMemberInfo.linkBankNumber}]"
placeholder="请输入联行号"
:maxLength="50"></a-input>
</a-form-item>
</a-col>
</a-row>
</template>
<!--发票信息 end-->
<!-- 2021-09-23变更 增加 单位地址 电话号码 开户银行 银行账户 增值税发票的时候存在-->
<a-row v-if="currentSelectInvoiceType === 2">
<a-col :span="12">
<a-form-item label="单位地址" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
@change="event => event.target.value = event.target.value.trim()"
v-decorator="['invoiceAddress',{ ...validatorRules.invoiceAddress, initialValue:currentMemberInfo.invoiceAddress}]"
placeholder="请输入单位地址"
:maxLength="50"></a-input>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="电话号码" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
v-decorator="['invoicePhone',{ ...validatorRules.invoiceAddress, initialValue: currentMemberInfo.invoicePhone}]"
:trigger-change="true"
@change="(e) => {e.target.value = e.target.value.replace(/[^0-9|-]/g,'')}"
placeholder="请输入电话号码"
:maxLength="50"></a-input>
</a-form-item>
</a-col>
</a-row>
<a-row v-if="currentSelectInvoiceType === 2">
<a-col :span="12">
<a-form-item label="开户银行" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
@change="event => event.target.value = event.target.value.trim()"
v-decorator="['depositBank',{ ...validatorRules.depositBank, initialValue:currentMemberInfo.depositBank}]"
placeholder="请输入开户银行"
:maxLength="50"></a-input>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="银行账户" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
@change="(e) => {e.target.value = e.target.value.trim()}"
v-decorator="['bankAccount',{ ...validatorRules.bankAccount, initialValue:currentMemberInfo.bankAccount}]"
placeholder="请输入银行账户"
:maxLength="50"></a-input>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="联行号" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
@change="(e) => {e.target.value = e.target.value.trim()}"
v-decorator="['linkBankNumber',{ ...validatorRules.linkBankNumber, initialValue:currentMemberInfo.linkBankNumber}]"
placeholder="请输入联行号"
:maxLength="50"></a-input>
</a-form-item>
</a-col>
</a-row>
</template>
</div>
<!-- 缴费备注-->
<!-- 缴费备注-->
<a-row>
<a-col :span="24" class="remark">
<a-form-item label="备注" :labelCol="labelColText" :wrapperCol="wrapperCol">
@@ -246,46 +231,7 @@
<span style="color: #bfbfbf">一个缴费单可在多个缴费处上传</span>
</a-col>
</a-row>
<a-row>
<!-- 企业证书换证原因-->
<a-col :span="12" v-if="selectType == '2' ">
<!-- :options="dictOptionsForCorporation"-->
<a-form-item label="换证原因" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-multi-select-tag
placeholder="请选择换证原因"
v-decorator="['reasonsRenewal']"
dict-code="certificate_type_ec"
>
</j-multi-select-tag>
</a-form-item>
</a-col>
<!-- 世界制造厂证书换证原因-->
<a-col :span="12" v-if="selectType == 1 ">
<!-- :options="dictOptionsForCorporation"-->
<a-form-item label="换证原因" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-multi-select-tag
placeholder="请选择换证原因"
v-decorator="['reasonsRenewal']"
dict-code="certificate_type_wmi"
>
</j-multi-select-tag>
</a-form-item>
</a-col>
</a-row>
<!-- 换证备注-->
<a-row>
<a-col :span="24">
<a-form-item label="备注" :labelCol="labelColText" :wrapperCol="wrapperCol">
<a-textarea
rows="5"
v-decorator="['replacementRemark']"
placeholder="请输入备注"
:maxLength="500"></a-textarea>
</a-form-item>
<a-col :span="2"></a-col>
</a-col>
</a-row>
</a-form>
</a-spin>
</template>
@@ -298,27 +244,30 @@
</template>
<script>
import JMultiSelectTag from '@comp/standardsAssociation/JMultiSelectTag'
import JImageUpload from '@comp/standardsAssociation/JImageUpload'
import JUpload from '@comp/standardsAssociation/JUpload'
import JDate from '@comp/tools/JDate'
import JDictSelectTag from '@comp/standardsAssociation/JDictSelectTag'
import JSearchSelectTag from '@comp/standardsAssociation/JSearchSelectTag'
import { getAction, httpAction } from '@api/memberManage'
import pick from 'lodash.pick'
import {PaymentMethodEnums} from '../../../enums/memberEnums'
export default {
// 证书续费编辑 窗口
name: 'RenewChargeEditModel',
components: {
JMultiSelectTag,
JImageUpload,
JUpload,
JDate,
JSearchSelectTag
JSearchSelectTag,
JDictSelectTag
},
data() {
return {
title: '续费',
loginUserId: this.$store.getters.userInfo.memberId,
PaymentMethodEnums,
visible: false,
confirmLoading: false,
pageType: 12,
@@ -335,8 +284,8 @@ export default {
xs: { span: 24 },
sm: { span: 3 }
},
// 会员缴费信息
memberInfoPayment: {},
// 上一次缴费信息
lastPaymentInfo: {},
// 当前登录用户的会员信息
currentMemberInfo: {},
model: {},
@@ -418,7 +367,7 @@ export default {
paymentAmount: {
rules: [
{
required: true, message: '请输入缴费金额!'
required: true, message: '请输入凭证金额!'
},
{
pattern: /^[1-9](\d{1,10})?(\.\d{1,2})$|^0\.([1-9](\d{0,1})|\d[1-9])$|^[1-9]\d{0,10}$|^0$/,
@@ -464,9 +413,7 @@ export default {
{ required: true, message: '请输入社会统一代码/税号!' },
{ min: 1, max: 50, message: '长度不超过50个字符', validateTrigger: 'blur' },
{
// pattern: /^[A-Z0-9]{15}$|^[A-Z0-9]{17}$|^[A-Z0-9]{18}$|^[A-Z0-9]{20}$/,
pattern: /^([0-9A-HJ-NPQRTUWXY]{2}\d{6}[0-9A-HJ-NPQRTUWXY]{10}|[1-9]\d{14})$/,
// message: '15位、17位、18位、20位数字和大写英文字母',
message: '请输入15位、18位的社会统一代码/税号',
validateTrigger: 'blur'
}
@@ -496,14 +443,12 @@ export default {
sendMethod: { rules: [{ required: false, message: '请选择快递公司' }], validateTrigger: 'change' },
postNo: { rules: [{ required: false, message: '请输入邮寄单号' }], validateTrigger: 'blur' }
},
// 缴费方式标志
paymentMethodFlag: false, // 发票选择
// form 表单中 缴费方式的值
paymentMethodFormValue: 1,
// 验证单位名称与发票抬头是否一致
validateCompanyNameFlag:false,
// 免费证书对象
freeCertificate: {},
// 续费会员信pageType息
renewMemberInfo: {},
// 是否是电汇
isWireTransfer: '1'
}
},
methods: {
@@ -518,34 +463,33 @@ export default {
this.currentMemberInfo = res.result || {}
}
})
// 在核对证书的时候，需要设置生效日期的初始值
this.checkEffectDate = record.effectDate
this.form.resetFields()
this.model = Object.assign({}, record)
// this.freeCertificate = Object.assign({}, record)
// this.renewMemberInfo = Object.assign({}, record)
this.visible = true
this.$nextTick(() => {
this.form.setFieldsValue(pick(this.model, 'paymentRecord', 'paymentMark', 'id', 'address', 'postcode', 'mobile', 'liaisonMan', 'companyName', 'certificateType', 'effectDate', 'reasonsRenewal', 'certificateStatus', 'code'))
// 第一次赋值的含义， 感觉没有意义了
// this.form.setFieldsValue(pick(this.model, 'submissionTime', 'paymentMethod', 'paymentRecord', 'paymentAmount', 'invoiceRequirements', 'headerName', 'taxNumber', 'invoiceAddress', 'invoicePhone', 'depositBank', 'bankAccount', 'linkBankNumber', 'paymentMark'))
})
// 查询证书最新的缴费信息
// 获取驳回的缴费信息
this.memberInfoPayment = {}
this.lastPaymentInfo = {}
// 查询对应证书的缴费信息
const params = 'certificateId=' + record.id
getAction('/certificatePaymentInfo/getLastCertificatePayment?' + params).then((res) => {
if (res.success) {
this.memberInfoPayment = res.result
this.lastPaymentInfo = res.result
// 获取缴费方式
this.isWireTransfer = res.result.paymentMethod + ''
if (this.memberInfoPayment.paymentMethod === 1) {
this.paymentMethodFlag = false
} else {
this.paymentMethodFlag = true
}
this.paymentMethodFormValue = Number(res.result.paymentMethod)
// 对是否需要发票字段进行处理
this.invoiceRequirementsChange(this.lastPaymentInfo.invoiceRequirements)
// 判断是否是垫付的状态
this.validateCompanyNameFlag = this.lastPaymentInfo.headerName === this.model.companyName
// 赋值上一次编辑的数据
this.$nextTick(() => {
this.form.setFieldsValue(pick(this.memberInfoPayment, 'submissionTime', 'paymentMark', 'replacementRemark', 'paymentAmount', 'certificateType', 'headerName', 'invoiceRequirements', 'paymentMethod', 'taxNumber', 'invoiceAddress', 'invoicePhone', 'depositBank', 'bankAccount', 'paymentRecord', 'id', 'address', 'postcode', 'mobile', 'liaisonMan', 'companyName', 'effectDate', 'reasonsRenewal', 'certificateStatus', 'code'))
this.form.setFieldsValue(pick(this.lastPaymentInfo, 'submissionTime', 'paymentMethod', 'paymentRecord', 'paymentAmount', 'invoiceRequirements', 'headerName', 'taxNumber', 'invoiceAddress', 'invoicePhone', 'depositBank', 'bankAccount', 'linkBankNumber', 'paymentMark'))
})
} else {
console.log(res.message)
@@ -565,7 +509,7 @@ export default {
that.confirmLoading = true
const httpurl = '/certificatePaymentInfo/addVinChargeInfo'
const method = 'post'
let formData = Object.assign(this.memberInfoPayment, values)
let formData = Object.assign(this.lastPaymentInfo, values)
// 证书续费信息添加
formData.companyName = this.model.companyName
@@ -589,11 +533,13 @@ export default {
const chargeUrl = '/vinCertificate/vinCertificate/renewChargeCertificate'
const chargeMethod = 'post'
const chargeFormData = Object.assign(this.model, values)
// 设置证书状态为 未提交
chargeFormData.certificateStatus = 0
httpAction(chargeUrl, chargeFormData, chargeMethod).then((res) => {
if (res.success) {
that.$message.success(res.message)
// that.$message.success(res.message)
that.$message.success('续费暂存成功！')
that.$emit('ok')
that.visible = false
}
@@ -620,7 +566,7 @@ export default {
that.confirmLoading = true
const httpurl = '/certificatePaymentInfo/addVinChargeInfo'
const method = 'post'
let formData = Object.assign(this.memberInfoPayment, values)
let formData = Object.assign(this.lastPaymentInfo, values)
// 证书续费信息添加
formData.companyName = this.model.companyName
@@ -668,13 +614,13 @@ export default {
/* 缴费方式*/
changePaymentMethod(value) {
// 1 是电汇 2 打包 3 是现金
this.isWireTransfer = value
this.form.resetFields(['paymentType', 'paymentAmount', 'paymentTime', 'submissionTime', 'paymentRecord'])
if (value !== '1') {
this.paymentMethodFlag = true
} else {
this.paymentMethodFlag = false
}
this.paymentMethodFormValue = Number(value)
},
/**
* 校验发票抬头是否与公司名称一致
* */
validateCompanyName() {
this.validateCompanyNameFlag = this.form.getFieldValue('headerName') === this.model.companyName
},
// 校验是否选择 要发票
invoiceRequirementsChange(value) {
@@ -704,6 +650,103 @@ export default {
}
</script>
<style scoped>
<style lang="less" scoped>
.v-middle {
height: 100px;
text-align: center;
vertical-align: middle;
/deep/ .ant-form-item {
margin-bottom: 0px !important;
box-sizing: border-box;
margin: 0;
padding: 0;
color: rgba(0, 0, 0, 0.65);
font-size: 14px;
font-variant: tabular-nums;
line-height: 1.5;
list-style: none;
font-feature-settings: 'tnum';
vertical-align: middle;
}
}
.remark span {
display: inline-block;
font-size: 14px;
margin-left: 165px;
transform: translateY(-20px);
}
.vin-style {
display: inline-block;
max-width: 120px;
white-space: pre-wrap;
text-align: center;
}
.table {
width: 100%;
height: 180px;
text-align: center;
margin-bottom: 10px;
border-color: #ccc;
border-collapse: collapse;
}
// 证书状态颜色
.certificate {
display: inline-block;
height: 24px;
font-size: 12px;
line-height: 24px;
padding: 0 7px;
border-radius: 3px;
color: #ddd;
}
.status-0 {
background: #c37e00;
}
.status-1 {
background: #40835e;
}
.status-2 {
background: #8a8c8e;
}
.transalte-y-10 {
transform: translateY(10px);
}
.apply-notice {
color: #f5222d;
}
.apply-code-notice {
color: #f5222d;
position: absolute;
bottom: 4px;
left: 25%
}
.other-notice {
color: #f5222d;
position: absolute;
bottom: -40px;
left: 0%;
}
// 上传额外附件的缴费凭证
.paymentRecord-notice {
color: #f5222d;
position: absolute;
bottom: 25px;
left: 25%
}
</style>
src/views/standardsAssociation/model/RenewChargeModel.vue
+115 -172
View File
@@ -19,9 +19,9 @@
<a-form-item label="证书类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-search-select-tag
dict="certificate_type"
v-model="freeCertificate.certificateType"
v-model="model.certificateType"
placeholder="请选择证书类型"
@change="selectcertificateType"
disabled
/>
</a-form-item>
</a-col>
@@ -29,8 +29,8 @@
<a-form-item label=" 证书代码" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
:maxLength="50"
:disabled="selectTypeDisabled"
v-model="freeCertificate.code"
disabled
v-model="model.code"
placeholder="请输入证书代码"></a-input>
</a-form-item>
<span class="apply-code-notice">一次申请仅能输入一个证书代码</span>
@@ -42,8 +42,8 @@
<a-form-item label="通讯地址" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
:maxLength="50"
:disabled="selectTypeDisabled"
v-model="renewMemberInfo.address"
disabled
v-model="model.address"
placeholder=""></a-input>
</a-form-item>
</a-col>
@@ -52,8 +52,8 @@
<a-form-item label="邮编" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
:maxLength="50"
:disabled="selectTypeDisabled"
v-model="renewMemberInfo.postcode"
disabled
v-model="model.postcode"
placeholder=""></a-input>
</a-form-item>
</a-col>
@@ -65,7 +65,7 @@
<a-row>
<a-col :span="12">
<a-form-item label="单位全称" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input :maxLength="50" disabled v-model="renewMemberInfo.companyName"></a-input>
<a-input :maxLength="50" disabled v-model="model.companyName"></a-input>
</a-form-item>
</a-col>
<a-col :span="12">
@@ -73,7 +73,7 @@
<a-input
:maxLength="50"
:disabled="selectTypeDisabled"
v-model="renewMemberInfo.liaisonMan"
v-model="model.liaisonMan"
placeholder="请输入联系人"></a-input>
</a-form-item>
</a-col>
@@ -85,36 +85,11 @@
<a-input
:maxLength="50"
:disabled="selectTypeDisabled"
v-model="renewMemberInfo.mobile"
v-model="model.mobile"
placeholder="请输入手机号"
></a-input>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="缴费方式" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-dict-select-tag
type="list"
v-decorator="['paymentMethod',validatorRules.paymentMethod]"
@change="changePaymentMethod"
:trigger-change="true"
dictCode="payment_method"
placeholder="请选择缴费方式"/>
</a-form-item>
</a-col>
</a-row>
<a-row>
<a-col :span="12">
<a-form-item label="缴费金额" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input-number
:maxLength="50"
v-decorator="['paymentAmount',validatorRules.paymentAmount]"
placeholder="请输入缴费金额"
style="width:100%"
/>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="缴费日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-date
@@ -126,73 +101,83 @@
</a-form-item>
</a-col>
</a-row>
<!-- 打包会员显示-->
<div v-if="isWireTransfer ==='2' ">
<a-row>
<a-col :span="12">
<a-form-item label="打包协议" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-upload
file-type="pdf"
file-type-error-message="请上传pdf文件"
:multiple="false"
:number="1"
bizPath="payment"
v-decorator="['paymentRecord',validatorRules.paymentRecord1]"
:trigger-change="true"></j-upload>
<span style="color: #bfbfbf">请上传pdf文件</span>
</a-form-item>
</a-col>
</a-row>
</div>
<a-row v-if="isWireTransfer != '2'">
<a-row>
<a-col :span="12">
<a-form-item label="缴费方式" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-dict-select-tag
type="list"
v-decorator="['paymentMethod',validatorRules.paymentMethod]"
@change="changePaymentMethod"
:trigger-change="true"
dictCode="payment_method"
placeholder="请选择缴费方式"/>
</a-form-item>
</a-col>
<!--缴费方式为电汇或者现金 -->
<template v-if="paymentMethodFormValue === PaymentMethodEnums.wireTransfer.index || paymentMethodFormValue === PaymentMethodEnums.cash.index">
<a-col :span="12">
<a-form-item label="缴费凭证/付款说明2" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-image-upload
isLessThan5M
isMultiple
:number="2"
bizPath="payment"
v-decorator="['paymentRecord', validatorRules.paymentRecord]">
</j-image-upload>
</a-form-item>
<span v-if="!validateCompanyNameFlag " class="paymentRecord-notice">需上传"垫付款说明（盖章"文件）</span>
</a-col>
</template>
<!-- -->
<a-col :span="12">
<a-form-item label="凭证金额" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input-number
:maxLength="50"
v-decorator="['paymentAmount',validatorRules.paymentAmount]"
placeholder="请输入凭证金额"
style="width:100%"
/>
</a-form-item>
</a-col>
</a-row>
<!--发票信息 begin-->
<a-divider orientation="left">发票信息</a-divider>
<a-row>
<a-col :span="12">
<a-form-item label="发票" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-dict-select-tag
type="list"
v-decorator="['invoiceRequirements',validatorRules.invoiceRequirements]"
@change="invoiceRequirementsChange"
type="list"
v-decorator="['invoiceRequirements',{ rules: validatorRules.invoiceRequirements.rules, initialValue:2,validateTrigger: 'change'},]"
:trigger-change="true"
dictCode="invoice_requirements"
placeholder="请选择发票"/>
<span v-if="currentSelectInvoiceType === 0 " class="other-notice">本选项不提供任何形式的发票凭证</span>
</a-form-item>
<span v-if="currentSelectInvoiceType === 0 " class="other-notice">本选项不提供任何形式的发票凭证</span>
</a-col>
</a-row>
<!--只有电汇才会上传缴费凭证/付款说明-->
<a-row v-if="isWireTransfer ==='1' ">
<a-col :span="12">
<a-form-item label="缴费凭证/付款说明" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-image-upload
isLessThan5M
isMultiple
:number="2"
bizPath="payment"
v-decorator="['paymentRecord',validatorRules.paymentRecord]"
></j-image-upload>
</a-form-item>
<span v-if="!validateCompanyNameFlag && currentSelectInvoiceType && currentSelectInvoiceType !== 0" class="paymentRecord-notice">需上传"垫付款说明（盖章"文件）</span>
</a-col>
</a-row>
<!-- 是否需要发票-->
<template v-if="invoiceRequirementsFlag">
<a-row>
<a-col :span="12">
<a-form-item label="付款单位发票抬头" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
:maxLength="50"
v-decorator="['headerName',{ rules: validatorRules.headerName.rules, initialValue:currentMemberInfo.invoiceInfo,validateTrigger: 'blur',},]"
:trigger-change="true"
@change="event => event.target.value = event.target.value.trim()"
@blur="validateCompanyName"
v-decorator="['headerName',{ ...validatorRules.headerName,initialValue:currentMemberInfo.invoiceInfo}]"
placeholder="请输入付款单位发票抬头"></a-input>
placeholder="请输入付款单位发票抬头"
:maxLength="50"></a-input>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="社会统一代码/税号" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
:maxLength="50"
v-decorator="['taxNumber',{ ...validatorRules.taxNumber,initialValue: currentMemberInfo.taxNo}]"
placeholder="请输入社会统一代码/税号"></a-input>
@change="event => event.target.value = event.target.value.trim()"
v-decorator="['taxNumber',{ rules: validatorRules.taxNumber.rules, validateTrigger: 'blur',initialValue:currentMemberInfo.taxNo},]"
placeholder="请输入社会统一代码/税号"
:maxLength="50"></a-input>
</a-form-item>
</a-col>
</a-row>
@@ -202,7 +187,7 @@
<a-form-item label="单位地址" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
@change="event => event.target.value = event.target.value.trim()"
v-decorator="['invoiceAddress',{ ...validatorRules.invoiceAddress, initialValue:currentMemberInfo.invoiceAddress}]"
v-decorator="['invoiceAddress',{ rules: validatorRules.invoiceAddress.rules, validateTrigger: 'blur', initialValue:currentMemberInfo.invoiceAddress}]"
placeholder="请输入单位地址"
:maxLength="50"></a-input>
</a-form-item>
@@ -210,7 +195,7 @@
<a-col :span="12">
<a-form-item label="电话号码" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
v-decorator="['invoicePhone',{ ...validatorRules.invoiceAddress, initialValue: currentMemberInfo.invoicePhone}]"
v-decorator="['invoicePhone',{ rules: validatorRules.invoicePhone.rules, initialValue: currentMemberInfo.invoicePhone,validateTrigger: 'blur'}]"
:trigger-change="true"
@change="(e) => {e.target.value = e.target.value.replace(/[^0-9|-]/g,'')}"
placeholder="请输入电话号码"
@@ -223,7 +208,7 @@
<a-form-item label="开户银行" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
@change="event => event.target.value = event.target.value.trim()"
v-decorator="['depositBank',{ ...validatorRules.depositBank, initialValue:currentMemberInfo.depositBank}]"
v-decorator="['depositBank',{ rules: validatorRules.depositBank.rules, validateTrigger: 'blur',initialValue:currentMemberInfo.depositBank}]"
placeholder="请输入开户银行"
:maxLength="50"></a-input>
</a-form-item>
@@ -232,24 +217,27 @@
<a-form-item label="银行账户" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
@change="(e) => {e.target.value = e.target.value.trim()}"
v-decorator="['bankAccount',{ ...validatorRules.bankAccount, initialValue:currentMemberInfo.bankAccount}]"
v-decorator="['bankAccount',{ rules: validatorRules.bankAccount.rules, validateTrigger: 'blur',initialValue:currentMemberInfo.bankAccount}]"
placeholder="请输入银行账户"
:maxLength="50"></a-input>
</a-form-item>
</a-col>
</a-row>
<a-row v-if="currentSelectInvoiceType === 2">
<a-col :span="12">
<a-form-item label="联行号" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input
@change="(e) => {e.target.value = e.target.value.trim()}"
v-decorator="['linkBankNumber',{ ...validatorRules.linkBankNumber, initialValue:currentMemberInfo.linkBankNumber}]"
v-decorator="['linkBankNumber',{ rules: validatorRules.linkBankNumber.rules, validateTrigger: 'blur',initialValue:currentMemberInfo.linkBankNumber}]"
placeholder="请输入联行号"
:maxLength="50"></a-input>
</a-form-item>
</a-col>
</a-row>
</template>
<!--发票信息 end-->
<!-- 缴费备注-->
<!-- 缴费备注-->
<a-row>
<a-col :span="24" class="remark">
<a-form-item label="备注" :labelCol="labelColText" :wrapperCol="wrapperCol">
@@ -258,46 +246,9 @@
<span style="color: #bfbfbf">一个缴费单可在多个缴费处上传</span>
</a-col>
</a-row>
<a-row>
<!-- 企业证书换证原因-->
<a-col :span="12" v-if="selectType == '2' ">
<!-- :options="dictOptionsForCorporation"-->
<a-form-item label="换证原因" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-multi-select-tag
placeholder="请选择换证原因"
v-decorator="['reasonsRenewal']"
dict-code="certificate_type_ec"
>
</j-multi-select-tag>
</a-form-item>
</a-col>
<!-- 世界制造厂证书换证原因-->
<a-col :span="12" v-if="selectType == 1 ">
<!-- :options="dictOptionsForCorporation"-->
<a-form-item label="换证原因" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-multi-select-tag
placeholder="请选择换证原因"
v-decorator="['reasonsRenewal']"
dict-code="certificate_type_wmi"
>
</j-multi-select-tag>
</a-form-item>
</a-col>
</a-row>
<!-- 换证备注-->
<a-row>
<a-col :span="24">
<a-form-item label="备注" :labelCol="labelColText" :wrapperCol="wrapperCol">
<a-textarea
rows="5"
v-decorator="['replacementRemark']"
placeholder="请输入备注"
:maxLength="500"></a-textarea>
</a-form-item>
<a-col :span="2"></a-col>
</a-col>
</a-row>
</a-form>
</a-spin>
</template>
@@ -311,37 +262,42 @@
<script>
import JSearchSelectTag from '@comp/standardsAssociation/JSearchSelectTag'
import JMultiSelectTag from '@comp/standardsAssociation/JMultiSelectTag'
// import JMultiSelectTag from '@comp/standardsAssociation/JMultiSelectTag'
import JImageUpload from '@comp/standardsAssociation/JImageUpload'
import JDictSelectTag from '@comp/standardsAssociation/JDictSelectTag'
import JUpload from '@comp/standardsAssociation/JUpload'
// import JUpload from '@comp/standardsAssociation/JUpload'
import JDate from '@comp/tools/JDate'
import { getAction, httpAction } from '@api/memberManage'
import pick from 'lodash.pick'
import {PaymentMethodEnums} from '../../../enums/memberEnums';
import {InvoiceTypeEnums} from "../../../enums/commonEnum";
export default {
// 证书续费 窗口
name: 'RenewChargeModel',
components: {
JSearchSelectTag,
JMultiSelectTag,
// JMultiSelectTag,
JImageUpload,
JDictSelectTag,
JUpload,
JDate
},
data() {
return {
// 是否是电汇
isWireTransfer: '1',
PaymentMethodEnums,
loginUserId: this.$store.getters.userInfo.memberId,
title: '续费',
visible: false,
confirmLoading: false,
validateCompanyNameFlag:false,// 验证单位名称与发票抬头是否一致
// 验证单位名称与发票抬头是否一致
validateCompanyNameFlag:false,
pageType: 7,
// 记录续费证书选择
selectType: 1,
currentSelectInvoiceType: '',
// 当前选中的发票类型
currentSelectInvoiceType: 2,
// form 表单中缴费方式的值
paymentMethodFormValue: 1,
invoiceRequirementsFlag: false,
form: this.$form.createForm(this),
labelCol: {
@@ -356,9 +312,8 @@ export default {
xs: { span: 24 },
sm: { span: 16 }
},
// 所有获取的相关信息
model: {},
// 免费证书对象
freeCertificate: {},
validatorRules: {
defaultRules: {
rules: [{ required: true, message: '请选择' },
@@ -438,7 +393,7 @@ export default {
paymentAmount: {
rules: [
{
required: true, message: '请输入缴费金额!'
required: true, message: '请输入凭证金额!'
},
{
pattern: /^[1-9](\d{1,10})?(\.\d{1,2})$|^0\.([1-9](\d{0,1})|\d[1-9])$|^[1-9]\d{0,10}$|^0$/,
@@ -458,7 +413,7 @@ export default {
required: true, message: '请上传缴费凭证/付款说明!'
}]
},
paymentRecord1: { rules: [{ required: true, message: '请上传打包协议' }] },
paymentRecord1: { rules: [{ required: false, message: '请上传打包协议' }] },
liaisonMan: {
rules: [
{ required: true, message: '请输入联系人!' },
@@ -522,17 +477,11 @@ export default {
memberInfoPayment: {},
// 续费换证选择证书的flagcheckInvalidDatecheckInvalidDate
selectTypeDisabled: true,
// 续费会员信pageType息
renewMemberInfo: {},
}
},
methods: {
// 证书续费的编辑窗口
edit(record) {
// 是否要发票设置为false;
this.invoiceRequirementsFlag = false
// 打包会员设置为false
this.paymentMethodFlag = false
// 获取证书类型
this.selectType = record.certificateType
// 数据准备
@@ -543,18 +492,18 @@ export default {
}
})
this.form.resetFields()
this.freeCertificate = Object.assign({}, record)
this.renewMemberInfo = Object.assign({}, record)
this.model = {}
this.model = Object.assign({}, record)
this.visible = true
// 是否要发票设置为false;
this.invoiceRequirementsFlag = false
// 在核对证书的时候，需要设置生效日期的初始值
this.checkEffectDate = record.effectDate
// 是否要发票设置为true 默认全部需要发票;
// this.invoiceRequirementsFlag = true
// 设置默认进来发票选择增值税发票
this.invoiceRequirementsChange(InvoiceTypeEnums.special.index)
this.$nextTick(() => {
this.form.setFieldsValue(pick(this.model, 'paymentRecord', 'id', 'auditOpinion', 'address', 'postcode', 'mobile', 'liaisonMan', 'certificateValidDate', 'companyName', 'certificationDate', 'certificateType', 'applyDate', 'effectDate', 'invalidDate', 'certificateStatus', 'memberId', 'code', 'chargeType'))
this.validateCompanyName()
this.form.setFieldsValue(pick(this.model, 'submissionTime', 'paymentMethod', 'paymentRecord', 'paymentAmount', 'invoiceRequirements'))
// this.validateCompanyName()
// 初始化的时候默认不是垫付
this.validateCompanyNameFlag = true
})
},
// 校验是否选择 要发票
@@ -568,25 +517,17 @@ export default {
if(value === '2'){
this.validateCompanyName()
}
},
/* 缴费方式*/
changePaymentMethod(value) {
// 1 是电汇 2 打包 3 是现金
this.isWireTransfer = value
this.form.resetFields(['paymentType', 'paymentAmount', 'paymentTime', 'submissionTime', 'paymentRecord'])
if (value !== '1') {
this.paymentMethodFlag = true
} else {
this.paymentMethodFlag = false
}
this.paymentMethodFormValue = Number(value)
},
/**
* 校验发票抬头是否与公司名称一致
* */
validateCompanyName() {
this.validateCompanyNameFlag = this.form.getFieldValue('headerName') === this.renewMemberInfo.companyName
this.validateCompanyNameFlag = this.form.getFieldValue('headerName') === this.model.companyName
},
/*
* 续费选择换证
@@ -600,10 +541,10 @@ export default {
const originCode = this.model.code
if (val !== originType.toString()) {
this.selectTypeDisabled = false
this.freeCertificate.code = ''
this.model.code = ''
} else {
this.selectTypeDisabled = true
this.freeCertificate.code = originCode
this.model.code = originCode
}
},
// 证书续费
@@ -622,7 +563,7 @@ export default {
let formData = Object.assign(this.memberInfoPayment, values)
// 证书续费信息添加
formData.companyName = this.renewMemberInfo.companyName
formData.companyName = this.model.companyName
// 续费
formData.paymentType = 1
// 证书ID
@@ -632,14 +573,14 @@ export default {
// 添加权限控制
formData.memberId = this.loginUserId
formData = Object.assign(formData, pick(this.renewMemberInfo, 'address', 'postcode', 'companyName'))
formData = Object.assign(formData, pick(this.model, 'address', 'postcode', 'companyName'))
httpAction(httpurl, formData, method).then((res) => {
if (res.success) {
// 修改证书的状态，和证书的类型
const chargeUrl = '/vinCertificate/vinCertificate/renewChargeCertificate'
const chargeMethod = 'post'
const chargeFormData = Object.assign(this.freeCertificate, values)
const chargeFormData = Object.assign(this.model, values)
// 设置证书状态为 已提交
chargeFormData.certificateStatus = 2
httpAction(chargeUrl, chargeFormData, chargeMethod).then((res) => {
@@ -670,12 +611,13 @@ export default {
this.form.validateFields((err, values) => {
if (!err) {
that.confirmLoading = true
// 证书缴费信息表 中先添加数据
const httpurl = '/certificatePaymentInfo/addVinChargeInfo'
const method = 'post'
let formData = Object.assign(this.memberInfoPayment, values)
// 证书续费信息添加
formData.companyName = this.renewMemberInfo.companyName
formData.companyName = this.model.companyName
// 续费
formData.paymentType = 1
// 证书ID
@@ -689,14 +631,15 @@ export default {
// 缴费状态为 未提交状态
formData.paymentStatus = 0
formData = Object.assign(formData, pick(this.renewMemberInfo, 'address', 'postcode', 'companyName'))
formData = Object.assign(formData, pick(this.model, 'address', 'postcode', 'companyName'))
httpAction(httpurl, formData, method).then((res) => {
if (res.success) {
// 修改证书的状态，和证书的类型
const chargeUrl = '/vinCertificate/vinCertificate/renewChargeCertificate'
const chargeMethod = 'post'
const chargeFormData = Object.assign(this.freeCertificate, values)
const chargeFormData = Object.assign(this.model, values)
// 设置证书状态为 未提交
chargeFormData.certificateStatus = 0
httpAction(chargeUrl, chargeFormData, chargeMethod).then((res) => {
@@ -822,8 +765,8 @@ export default {
.other-notice {
color: #f5222d;
position: absolute;
bottom: 10px;
left: 25%;
bottom: -40px;
left: 0%;
}
// 上传额外附件的缴费凭证