506 lines
13 KiB
Vue
506 lines
13 KiB
Vue
![]() |
<template>
|
|||
|
<view class="content">
|
|||
|
<u-overlay :show="overlayShow"></u-overlay>
|
|||
|
<view class="container">
|
|||
|
<headers :titles="titles"><uni-icons type="arrow-left" color="#fff" size="22px"></uni-icons></headers>
|
|||
|
<view class="box_">
|
|||
|
|
|||
|
<view class="title_">
|
|||
|
商户信息
|
|||
|
</view>
|
|||
|
<view class="box_bs">
|
|||
|
<view class="">名称</view>
|
|||
|
<view class="right_size">
|
|||
|
<input type="text" placeholder="请输入" v-model="formData.merchantName" />
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="box_bs">
|
|||
|
<view class="">商户简称</view>
|
|||
|
<view class="right_size">
|
|||
|
<input type="text" placeholder="请输入" v-model="formData.abbreviation" />
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="box_bs">
|
|||
|
<view class="">商户归属地</view>
|
|||
|
<view class="dis_">
|
|||
|
<view class="dis_" @click="openLevel()">
|
|||
|
<view v-if="!formData.merProvinceNames" class="size_">请选择</view>
|
|||
|
<view v-else class="size_">
|
|||
|
{{formData.merProvinceNames+formData.merRegionNames+formData.merCountyNames}}
|
|||
|
</view>
|
|||
|
|
|||
|
<u-icon name="arrow-right" color="#ececec" size="18"></u-icon>
|
|||
|
</view>
|
|||
|
<image @click="openMap()" src="/static/imgs/ic_poi_map.png"
|
|||
|
style="width: 20px;height:20px;margin: 0 auto;">
|
|||
|
</image>
|
|||
|
|
|||
|
</view>
|
|||
|
|
|||
|
</view>
|
|||
|
<view class="box_bs">
|
|||
|
<view class="">详情地址</view>
|
|||
|
<view class="right_size">
|
|||
|
<input type="text" placeholder="请填写" v-model="formData.merAddress" />
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="box_bs">
|
|||
|
<view class="">行业分类</view>
|
|||
|
<view class="dis_" @click="selectPick()">
|
|||
|
<view v-if="!formData.merTertiaryBusKindName" class="size_">请选择</view>
|
|||
|
<view v-else class="size_">
|
|||
|
{{this.formData.merTertiaryBusKindName}}
|
|||
|
</view>
|
|||
|
<u-icon name="arrow-right" color="#ececec" size="18"></u-icon>
|
|||
|
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="box_bs">
|
|||
|
<view class="">年营业收入</view>
|
|||
|
<view class="dis_" style="width: 75%; align-items: center;">
|
|||
|
<ep-select v-model="formData.annualIncomeUnit" :options="capitalUnits"
|
|||
|
@change="change"></ep-select>
|
|||
|
<view class="input_color">
|
|||
|
<input type="number" v-model="formData.annualIncome" />
|
|||
|
</view>
|
|||
|
<view style="width: 50px;margin-left: 5px;">万元</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
|
|||
|
|
|||
|
</view>
|
|||
|
<view class="box_">
|
|||
|
<view class="title_">
|
|||
|
商户费率
|
|||
|
</view>
|
|||
|
<view class="box_bs">
|
|||
|
<view class="">微信费率(%)</view>
|
|||
|
<view class="right_size">
|
|||
|
<input type="number" placeholder="请填写" v-model="formData.wxRate" />
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="box_bs">
|
|||
|
<view class="">支付宝费率(%)</view>
|
|||
|
<view class="right_size">
|
|||
|
<input type="number" placeholder="请填写" v-model="formData.aliRate" />
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="box_bs">
|
|||
|
<view class="">云闪付费率(%)</view>
|
|||
|
<view class="right_size">
|
|||
|
<input type="number" placeholder="请填写" v-model="formData.unionPayRate" />
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
|
|||
|
</view>
|
|||
|
<view class="box_">
|
|||
|
<view class="title_">
|
|||
|
场景说明
|
|||
|
</view>
|
|||
|
<u--textarea v-model="formData.scenarioDescription" placeholder="请输入内容"></u--textarea>
|
|||
|
</view>
|
|||
|
<view class="button_p" @click="nextStep()">
|
|||
|
<view class="">下一步</view>
|
|||
|
</view>
|
|||
|
<level-linkage ref="levelLinkage" :pickerValueDefault="pickerValueDefault" @onConfirm="onConfirm"
|
|||
|
themeColor='#007AFF'></level-linkage>
|
|||
|
|
|||
|
<level-linkage valueName="busId" keyName="busName" ref="selectKind" :pickerValueDefault="kindDefault"
|
|||
|
@onConfirm="kindConfirm" themeColor='#007AFF'></level-linkage>
|
|||
|
</view>
|
|||
|
|
|||
|
</view>
|
|||
|
</template>
|
|||
|
|
|||
|
<script>
|
|||
|
import headers from '../../components/header/headers.vue'
|
|||
|
import request from '../../utils/request.js'
|
|||
|
import levelLinkage from "@/components/three-level-linkage/linkage.nvue"
|
|||
|
export default {
|
|||
|
data() {
|
|||
|
return {
|
|||
|
overlayShow: false,
|
|||
|
titles: "商户信息录入",
|
|||
|
msg: "1",
|
|||
|
merchantId: 1000022008,
|
|||
|
dataList: [],
|
|||
|
show: false,
|
|||
|
status: 'loading',
|
|||
|
select: '',
|
|||
|
pickData: {
|
|||
|
columns: [],
|
|||
|
show: false,
|
|||
|
pickType: null, //下部选择器类型:certSelect 证件选择
|
|||
|
title: ""
|
|||
|
},
|
|||
|
formData: {
|
|||
|
areaType: "7", //商户类型 7 小微 写死
|
|||
|
legalPerson: {
|
|||
|
address: "",
|
|||
|
backPic: "",
|
|||
|
backPicUrl: "",
|
|||
|
certEffectDate: "",
|
|||
|
certExaDate: "",
|
|||
|
certNo: "",
|
|||
|
certType: "11",
|
|||
|
certTypeName: "身份证",
|
|||
|
city: "",
|
|||
|
cityName: "",
|
|||
|
county: "",
|
|||
|
countyName: "",
|
|||
|
email: "",
|
|||
|
facePic: "",
|
|||
|
facePicUrl: "",
|
|||
|
firstCareerName: "",
|
|||
|
firstCareerNo: "",
|
|||
|
gender: "1",
|
|||
|
mobileNo: "",
|
|||
|
nation: "CHN",
|
|||
|
nationLabel: "中国",
|
|||
|
participantName: "",
|
|||
|
province: "",
|
|||
|
provinceName: "",
|
|||
|
secondCareerName: "",
|
|||
|
secondCareerNo: "",
|
|||
|
sort: 0,
|
|||
|
thirdCareerName: "",
|
|||
|
thirdCareerNo: ""
|
|||
|
},
|
|||
|
openAccount: "",
|
|||
|
openAccountUrl: "",
|
|||
|
rate: "0.25",
|
|||
|
steps: "2" //步骤当前页面写死第一页
|
|||
|
},
|
|||
|
pickerValueDefault: [14, 0, 0],
|
|||
|
kindDefault: [0, 0],
|
|||
|
chinaArea: [],
|
|||
|
capitalUnits: [],
|
|||
|
businessKinds: []
|
|||
|
|
|||
|
}
|
|||
|
},
|
|||
|
onLoad(options) {
|
|||
|
if (options && options.merchantId) {
|
|||
|
this.merchantId = options.merchantId
|
|||
|
this.getMerchantInfo()
|
|||
|
this.getChinaArea()
|
|||
|
this.getCorCapitalUnit()
|
|||
|
this.getBusinessKind()
|
|||
|
}
|
|||
|
},
|
|||
|
|
|||
|
components: {
|
|||
|
headers,
|
|||
|
levelLinkage
|
|||
|
},
|
|||
|
methods: {
|
|||
|
regPos(address) {
|
|||
|
let resAddress = {}
|
|||
|
var reg = /.+?(省|市|自治区|自治州|县|区)/g;
|
|||
|
let addressList = address.match(reg).toString().split(",");
|
|||
|
if (addressList[0] == '重庆市' || addressList[0] == '北京市' || addressList[0] == '天津市' ||
|
|||
|
addressList[0] == '上海市') {
|
|||
|
resAddress.province = addressList[0];
|
|||
|
resAddress.city = addressList[0];
|
|||
|
resAddress.district = addressList[1];
|
|||
|
} else {
|
|||
|
resAddress.province = addressList[0];
|
|||
|
resAddress.city = addressList[1];
|
|||
|
resAddress.district = addressList[2];
|
|||
|
};
|
|||
|
let data = uni.getStorageSync("sysAddress")
|
|||
|
//处理地址信息
|
|||
|
let userAddress = {}
|
|||
|
for (var i = 0; i < data.length; i++) {
|
|||
|
if (resAddress.province == data[i].name) {
|
|||
|
//省找到了
|
|||
|
userAddress.merProvinceCode = data[i].code
|
|||
|
userAddress.merProvinceName = data[i].name
|
|||
|
userAddress.merProvinceIdx = i
|
|||
|
for (var j = 0; j < data[i].inferior.length; j++) {
|
|||
|
if (resAddress.city == data[i].inferior[j].name) {
|
|||
|
//市找到了
|
|||
|
userAddress.merCityCode = data[i].inferior[j].code
|
|||
|
userAddress.merCityName = data[i].inferior[j].name
|
|||
|
userAddress.merCityIdx = j
|
|||
|
for (var k = 0; k < data[i].inferior[j].inferior.length; k++) {
|
|||
|
if (resAddress.district == data[i].inferior[j].inferior[k]
|
|||
|
.name) {
|
|||
|
//区找到了
|
|||
|
userAddress.merRegionCode = data[i].inferior[j].inferior[k]
|
|||
|
.code
|
|||
|
userAddress.merRegionName = data[i].inferior[j].inferior[k]
|
|||
|
.name
|
|||
|
userAddress.merRegionIdx = k
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
return userAddress
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
}
|
|||
|
return res
|
|||
|
},
|
|||
|
dealPosition(data) {
|
|||
|
if (data) {
|
|||
|
//处理省市区
|
|||
|
this.formData.merProvinceNames = data.merProvinceName
|
|||
|
this.formData.merProvince = data.merProvinceCode
|
|||
|
this.formData.merProvinceId = data.merProvinceCode
|
|||
|
this.formData.merRegionNames = data.merCityName
|
|||
|
this.formData.merRegion = data.merCityCode
|
|||
|
this.formData.merRegionId = data.merCityCode
|
|||
|
this.formData.merCountyNames = data.merRegionName
|
|||
|
this.formData.merCounty = data.merRegionCode
|
|||
|
this.formData.merCountyId = data.merRegionCode
|
|||
|
this.pickerValueDefault = [data.merProvinceIdx, data.merCityIdx, data.merRegionIdx]
|
|||
|
this.$forceUpdate()
|
|||
|
}
|
|||
|
},
|
|||
|
openMap() {
|
|||
|
let data = uni.getStorageSync("userAddress")
|
|||
|
let keyword = ""
|
|||
|
if (data) {
|
|||
|
keyword = data.merProvinceName + data.merCityName + data.merRegionName
|
|||
|
}
|
|||
|
let that = this
|
|||
|
uni.getLocation({
|
|||
|
type: 'gcj02',
|
|||
|
geocode: true,
|
|||
|
success: function(ress) {
|
|||
|
uni.chooseLocation({
|
|||
|
keyword: keyword,
|
|||
|
success: function(res) {
|
|||
|
let temp = that.regPos(res.address)
|
|||
|
that.dealPosition(temp)
|
|||
|
that.formData.merAddr = res.name
|
|||
|
}
|
|||
|
});
|
|||
|
},
|
|||
|
})
|
|||
|
|
|||
|
},
|
|||
|
selectPick() {
|
|||
|
this.$refs.selectKind.open();
|
|||
|
},
|
|||
|
kindConfirm(data) {
|
|||
|
// 行业选择后
|
|||
|
this.formData.merSecondaryBusKindName = data.firstPick.busName
|
|||
|
this.formData.merSecondaryBusKind = data.firstPick.busId
|
|||
|
this.formData.merTertiaryBusKindName = data.secondPick.busName
|
|||
|
this.formData.merTertiaryBusKind = data.secondPick.busId
|
|||
|
},
|
|||
|
onConfirm(data) {
|
|||
|
// 地区选择确认后选中的数据
|
|||
|
this.formData.merProvinceNames = data.firstPick.name
|
|||
|
this.formData.merProvince = data.firstPick.code
|
|||
|
this.formData.merProvinceId = data.firstPick.code
|
|||
|
this.formData.merRegionNames = data.secondPick.name
|
|||
|
this.formData.merRegion = data.secondPick.code
|
|||
|
this.formData.merRegionId = data.secondPick.code
|
|||
|
this.formData.merCountyNames = data.thirdPick.name
|
|||
|
this.formData.merCounty = data.thirdPick.code
|
|||
|
this.formData.merCountyId = data.thirdPick.code
|
|||
|
|
|||
|
},
|
|||
|
async getChinaArea() {
|
|||
|
let res = await request({
|
|||
|
url: 'app/drop/getChinaArea',
|
|||
|
method: 'get'
|
|||
|
})
|
|||
|
if (res.code == 0) {
|
|||
|
this.chinaArea = res.data
|
|||
|
this.$refs.levelLinkage.init(res.data);
|
|||
|
|
|||
|
}
|
|||
|
},
|
|||
|
openLevel() {
|
|||
|
this.$refs.levelLinkage.open();
|
|||
|
},
|
|||
|
async getMerchantInfo() {
|
|||
|
uni.showLoading({
|
|||
|
title: '加载中'
|
|||
|
});
|
|||
|
this.overlayShow = true
|
|||
|
let ress = await request({
|
|||
|
url: 'app/report/newBaseInfo',
|
|||
|
method: 'post',
|
|||
|
data: {
|
|||
|
objectId: this.merchantId
|
|||
|
}
|
|||
|
})
|
|||
|
this.formData = ress.data
|
|||
|
this.formData.steps = '2'
|
|||
|
if (!this.formData.annualIncomeUnit) {
|
|||
|
this.formData.annualIncomeUnit = 'CNY'
|
|||
|
}
|
|||
|
|
|||
|
if (!this.formData.corKind) {
|
|||
|
|
|||
|
this.formData.corKind = 13
|
|||
|
}
|
|||
|
if (!this.formData.merProvinceNames) {
|
|||
|
let data = uni.getStorageSync("userAddress")
|
|||
|
this.dealPosition(data)
|
|||
|
|
|||
|
}
|
|||
|
uni.hideLoading()
|
|||
|
this.overlayShow = false
|
|||
|
|
|||
|
|
|||
|
},
|
|||
|
change(e) {
|
|||
|
console.log('select = ', e)
|
|||
|
},
|
|||
|
|
|||
|
async nextStep() {
|
|||
|
let that = this
|
|||
|
//小微商户字段重复使用进行赋值
|
|||
|
this.formData.shortName = this.formData.merchantName
|
|||
|
|
|||
|
this.formData.merProvinceName = this.formData.merProvinceNames
|
|||
|
this.formData.merRegionName = this.formData.merRegionNames
|
|||
|
this.formData.merCountyName = this.formData.merCountyNames
|
|||
|
|
|||
|
this.formData.merAddr = this.formData.merAddress
|
|||
|
uni.showLoading({
|
|||
|
title: '提交中'
|
|||
|
});
|
|||
|
this.overlayShow = true
|
|||
|
let res = await request({
|
|||
|
url: 'app/report/newBaseInfoSaveOrUpdate',
|
|||
|
method: 'post',
|
|||
|
data: this.formData
|
|||
|
})
|
|||
|
uni.hideLoading()
|
|||
|
that.overlayShow = false
|
|||
|
if (res.code == 0) {
|
|||
|
|
|||
|
uni.navigateTo({
|
|||
|
url: '/homePages/merchantsMerchant/debitCard?merchantId=' + res.merchantId
|
|||
|
})
|
|||
|
|
|||
|
}
|
|||
|
|
|||
|
|
|||
|
},
|
|||
|
goback() {
|
|||
|
uni.navigateBack()
|
|||
|
},
|
|||
|
async getCorCapitalUnit() {
|
|||
|
this.capitalUnits = await this.$getDictList('pos_merchant_extend_corCapitalUnit')
|
|||
|
},
|
|||
|
async getBusinessKind() {
|
|||
|
let res = await request({
|
|||
|
url: 'app/drop/getBusinessKind',
|
|||
|
method: 'get'
|
|||
|
|
|||
|
})
|
|||
|
if (res.code == 0) {
|
|||
|
this.businessKinds = res.data
|
|||
|
this.$refs.selectKind.init(res.data);
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
</script>
|
|||
|
|
|||
|
<style scoped lang="scss">
|
|||
|
.content {
|
|||
|
background: #f4f5f6;
|
|||
|
|
|||
|
height: 100vh;
|
|||
|
}
|
|||
|
|
|||
|
.container {
|
|||
|
width: 100%;
|
|||
|
background: #f4f5f6;
|
|||
|
box-sizing: border-box;
|
|||
|
padding-top: 88px;
|
|||
|
padding-bottom: 88px;
|
|||
|
}
|
|||
|
|
|||
|
.box_ {
|
|||
|
width: 95%;
|
|||
|
border-radius: 8px;
|
|||
|
box-sizing: border-box;
|
|||
|
padding: 10px;
|
|||
|
background: #fff;
|
|||
|
margin: 15px auto;
|
|||
|
}
|
|||
|
|
|||
|
.box_bs {
|
|||
|
display: flex;
|
|||
|
align-items: center;
|
|||
|
justify-content: space-between;
|
|||
|
box-sizing: border-box;
|
|||
|
padding: 10px 0px;
|
|||
|
color: #aeaeae;
|
|||
|
border-bottom: 1px solid #eeeeee;
|
|||
|
}
|
|||
|
|
|||
|
.dis_ {
|
|||
|
display: flex;
|
|||
|
}
|
|||
|
|
|||
|
.size_ {
|
|||
|
margin-right: 5px;
|
|||
|
color: #000;
|
|||
|
}
|
|||
|
|
|||
|
.title_ {
|
|||
|
font-size: 18px;
|
|||
|
font-weight: bold;
|
|||
|
margin: 10px 0px;
|
|||
|
margin-bottom: 20px;
|
|||
|
}
|
|||
|
|
|||
|
.upload-box {
|
|||
|
width: 100%;
|
|||
|
margin: 5px 0px;
|
|||
|
|
|||
|
display: flex;
|
|||
|
text-align: center;
|
|||
|
justify-content: space-between;
|
|||
|
margin-bottom: 20px;
|
|||
|
}
|
|||
|
|
|||
|
.upload-title {
|
|||
|
font-size: 16px;
|
|||
|
margin-right: 10%;
|
|||
|
|
|||
|
}
|
|||
|
|
|||
|
.right_size {
|
|||
|
text-align: right;
|
|||
|
color: #000;
|
|||
|
}
|
|||
|
|
|||
|
.input_color {
|
|||
|
width: 100px;
|
|||
|
display: flex;
|
|||
|
align-items: center;
|
|||
|
height: 36px;
|
|||
|
border: 2px solid #efefef;
|
|||
|
border-radius: 4px;
|
|||
|
box-sizing: border-box;
|
|||
|
padding: 5px;
|
|||
|
margin-left: 10px;
|
|||
|
}
|
|||
|
|
|||
|
.button_p {
|
|||
|
width: 100%;
|
|||
|
background: #E4612E;
|
|||
|
height: 55px;
|
|||
|
display: flex;
|
|||
|
align-items: center;
|
|||
|
justify-content: center;
|
|||
|
color: #fff;
|
|||
|
border-radius: 4px;
|
|||
|
position: fixed;
|
|||
|
bottom: 0px;
|
|||
|
}
|
|||
|
</style>
|