<!--
|
* @Author: c.y
|
* @Date: 2019-09-02 09:01:22
|
* @LastEditors: 小明丶
|
* @LastEditTime: 2019-09-02 09:15:03
|
* @Description:
|
-->
|
<template>
|
<div class="open-gjzj-page">
|
<group>
|
<div class="title">
|
<span class="line"></span>
|
基本信息
|
</div>
|
<x-input title='商户名称' v-model.trim="storeInfo.merName" readonly text-align='right'></x-input>
|
<x-input title='营业执照号' v-model.trim="storeInfo.licenseNo" readonly text-align='right'></x-input>
|
<x-input title='地址' v-model.trim="storeInfo.merAddr" readonly text-align='right'></x-input>
|
<x-input title='详细地址' v-model.trim="storeInfo.merDtlAddr" readonly text-align='right'></x-input>
|
<x-input title='营业面积' v-model.trim="storeInfo.merArea" placeholder='请输入' :max='10' text-align='right'>
|
</x-input>
|
<datetime title="成立日期" v-model.trim="storeInfo.foundDate" placeholder='请选择'></datetime>
|
<datetime v-if="isHeyd" v-model="storeInfo.agreeStartTime" format="YYYY-MM-DD" title="协议开始时间"></datetime>
|
<datetime v-if="isHeyd" v-model="storeInfo.agreeEndTime" format="YYYY-MM-DD" title="协议结束时间"></datetime>
|
</group>
|
<f-space></f-space>
|
<group>
|
<div class="title">
|
<span class="line"></span>
|
法人信息
|
</div>
|
<x-input title='法人姓名' v-model.trim="storeInfo.legalName" readonly text-align='right'></x-input>
|
<x-input title='法人身份证号' v-model.trim="storeInfo.legalIdNo" readonly text-align='right'></x-input>
|
<x-input title='法人电话' v-model.trim="storeInfo.legalMblNo" placeholder='请输入' :max='11' text-align='right'>
|
</x-input>
|
<x-input title='法人家庭住址' v-model.trim="storeInfo.legalHomeAddr" placeholder='请输入' :max='20'
|
text-align='right'></x-input>
|
</group>
|
<f-space></f-space>
|
<group>
|
<div class="title">
|
<span class="line"></span>
|
联系人信息
|
</div>
|
<x-input title='联系人姓名' v-model.trim="storeInfo.contactName" placeholder='请输入' :max='8' text-align='right'>
|
</x-input>
|
<x-input title='联系人电话' v-model.trim="storeInfo.contactMblNo" placeholder='请输入' :max='11' text-align='right'>
|
</x-input>
|
<x-input title='联系人职务' v-model.trim="storeInfo.contactDuty" placeholder='请输入' :max='10' text-align='right'>
|
</x-input>
|
</group>
|
<f-space></f-space>
|
|
<group>
|
<div class="title">
|
<span class="line"></span>
|
银行信息
|
</div>
|
<selector title='银行名称' placeholder='请选择' @on-change='handleBankChange' v-model="storeInfo.bankCode"
|
:options='bankList' :value-map="['code','name']" direction='rtl'></selector>
|
<x-input title='开户行' v-model.trim="storeInfo.bankDtlName" placeholder='请输入' :max='20' text-align='right'>
|
</x-input>
|
|
<x-address v-model="calcAddress" title="地址" v-if="isHeyd" :list="addressList" hide-district placeholder="请选择" ></x-address>
|
|
<x-input title='户名' v-model.trim="storeInfo.cardName" placeholder='请输入' text-align='right'></x-input>
|
<x-input title='银行账号' v-model.trim="storeInfo.cardNo" placeholder='请输入' :max='30' text-align='right'>
|
</x-input>
|
<selector title='账号类型' placeholder='请选择' @on-change='handleCardTypeChange' v-model="storeInfo.cardType"
|
:options='cardTypeList' :value-map="['code','name']" direction='rtl'></selector>
|
<x-input v-show="storeInfo.cardType==='pu'" v-if="isHeyd" title='开户行行号' v-model.trim="storeInfo.bankNo" :max='20' type="number" placeholder='请输入'
|
text-align='right'></x-input>
|
</group>
|
</div>
|
</template>
|
|
<script>
|
import {
|
Datetime,
|
XAddress
|
} from 'vux';
|
export default {
|
name: 'huaGjzjOpen',
|
components: {
|
Datetime,
|
XAddress
|
},
|
data() {
|
return {
|
|
};
|
},
|
props: {
|
addressList: {
|
type: Array,
|
default: []
|
},
|
address: {
|
type: Array,
|
default: []
|
},
|
storeInfo: {
|
type: Object
|
},
|
// 银行列表
|
bankList: {
|
type: Array,
|
default: () => {
|
return [];
|
}
|
},
|
cardTypeList: {
|
type: Array,
|
default: () => {
|
return [];
|
}
|
},
|
isHeyd: {
|
type: Boolean,
|
default: false
|
}
|
},
|
computed:{
|
calcAddress:{
|
get(){
|
return this.address || [];
|
},
|
set(newV){
|
this.$emit('addr-change', newV);
|
}
|
}
|
},
|
methods: {
|
// 处理银行名称的改变
|
handleBankChange(val) {
|
let currentEle = this.bankList.find(item => {
|
return item.code === val;
|
})
|
// 银行卡姓名
|
this.storeInfo.bankName = currentEle.name;
|
},
|
// 账号类型
|
handleCardTypeChange(val) {
|
let currentEle = JSON.parse(JSON.stringify(this.cardTypeList)).find((item) => {
|
return item.code = val;
|
});
|
this.storeInfo.cardTypeName = currentEle.name;
|
}
|
}
|
};
|
|
</script>
|
|
<style lang="less" scoped>
|
.open-gjzj-page {
|
.title {
|
padding: 14px 12px;
|
font-size: 15px;
|
color: #333;
|
|
.line {
|
display: inline-block;
|
width: 2px;
|
height: 16px;
|
margin-right: 8px;
|
background: @color-text-three;
|
vertical-align: middle;
|
margin-top: -1px;
|
}
|
}
|
|
.vux-datetime {
|
font-size: 15Px;
|
}
|
|
.vux-datetime-value {
|
span {
|
width: 100%;
|
text-align: right;
|
}
|
}
|
}
|
|
</style>
|
