This commit is contained in:
22
parent
446b145667
commit
7a9dff0999
|
|
@ -161,6 +161,9 @@ export function merchantLoginApi(mer_id) {
|
||||||
export function intentionLstApi(data) {
|
export function intentionLstApi(data) {
|
||||||
return request.get('merchant/intention/lst', data)
|
return request.get('merchant/intention/lst', data)
|
||||||
}
|
}
|
||||||
|
export function intentionDetailApi(mer_id) {
|
||||||
|
return request.get(`merchant/intention/detail/${mer_id}`)
|
||||||
|
}
|
||||||
/**
|
/**
|
||||||
* @description 申请管理 -- 备注
|
* @description 申请管理 -- 备注
|
||||||
*/
|
*/
|
||||||
|
|
|
||||||
|
|
@ -127,6 +127,7 @@
|
||||||
@click="onEdit(scope.row.mer_intention_id)"
|
@click="onEdit(scope.row.mer_intention_id)"
|
||||||
>备注</el-button
|
>备注</el-button
|
||||||
>
|
>
|
||||||
|
<el-button type="text" size="small" @click="onDetails(scope.row.mer_intention_id)">详情</el-button>
|
||||||
<el-button
|
<el-button
|
||||||
type="text"
|
type="text"
|
||||||
size="small"
|
size="small"
|
||||||
|
|
@ -148,6 +149,19 @@
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</el-card>
|
</el-card>
|
||||||
|
|
||||||
|
<!--商户详情-->
|
||||||
|
<mer-detail
|
||||||
|
ref="merDetail"
|
||||||
|
:merId="mer_id"
|
||||||
|
:merCateList="merCateList"
|
||||||
|
:storeType="storeType"
|
||||||
|
@closeDrawer="closeDrawer"
|
||||||
|
@changeDrawer="changeDrawer"
|
||||||
|
@getList="getList"
|
||||||
|
:drawer="drawer"
|
||||||
|
></mer-detail>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
@ -169,11 +183,13 @@ import {
|
||||||
getstoreTypeApi,
|
getstoreTypeApi,
|
||||||
getMerCateApi
|
getMerCateApi
|
||||||
} from "@/api/merchant";
|
} from "@/api/merchant";
|
||||||
|
import merDetail from './merApplicationDetail.vue';
|
||||||
import { fromList, statusList } from "@/libs/constants.js";
|
import { fromList, statusList } from "@/libs/constants.js";
|
||||||
import { roterPre } from "@/settings";
|
import { roterPre } from "@/settings";
|
||||||
import timeOptions from '@/utils/timeOptions';
|
import timeOptions from '@/utils/timeOptions';
|
||||||
export default {
|
export default {
|
||||||
name: "MerchantApplication",
|
name: "MerchantApplication",
|
||||||
|
components: { merDetail },
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
props: {
|
props: {
|
||||||
|
|
@ -204,6 +220,7 @@ export default {
|
||||||
mer_id: this.$route.query.id ? this.$route.query.id : "",
|
mer_id: this.$route.query.id ? this.$route.query.id : "",
|
||||||
autoUpdate: true,
|
autoUpdate: true,
|
||||||
timeVal: [],
|
timeVal: [],
|
||||||
|
drawer: false
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
|
|
@ -252,6 +269,18 @@ export default {
|
||||||
this.$message.error(res.message)
|
this.$message.error(res.message)
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
onDetails(id){
|
||||||
|
this.mer_id = id;
|
||||||
|
this.$refs.merDetail.isEdit = false;
|
||||||
|
this.$refs.merDetail.getInfo(id);
|
||||||
|
this.drawer = true;
|
||||||
|
},
|
||||||
|
changeDrawer(v) {
|
||||||
|
this.drawer = v;
|
||||||
|
},
|
||||||
|
closeDrawer() {
|
||||||
|
this.drawer = false;
|
||||||
|
},
|
||||||
// 列表
|
// 列表
|
||||||
getList(num) {
|
getList(num) {
|
||||||
this.listLoading = true;
|
this.listLoading = true;
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,329 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<el-drawer
|
||||||
|
:with-header="false"
|
||||||
|
:size="1000"
|
||||||
|
:visible.sync="drawer"
|
||||||
|
:direction="direction"
|
||||||
|
:before-close="handleClose"
|
||||||
|
>
|
||||||
|
<div v-loading="loading">
|
||||||
|
<div v-if="!isAdd" class="head">
|
||||||
|
<div class="full">
|
||||||
|
<img class="order_icon" :src="orderImg" alt="" />
|
||||||
|
<div class="text">
|
||||||
|
<div class="title">
|
||||||
|
<span class="bold">{{ merData.mer_name }}</span>
|
||||||
|
<el-tag v-if="merData.is_trader" type="danger" class="tags_name" effect="dark" size="mini">自营</el-tag>
|
||||||
|
<el-tag v-if="merData.merchantType" type="warning" class="tags_name" effect="dark" size="mini">{{merData.merchantType.type_name}}</el-tag>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<span class="mr20">{{ merData.mer_address }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- <div>
|
||||||
|
<el-button
|
||||||
|
v-if="isEdit"
|
||||||
|
size="small"
|
||||||
|
@click="cancelEdit"
|
||||||
|
>取消</el-button
|
||||||
|
>
|
||||||
|
<el-button
|
||||||
|
v-if="!isEdit"
|
||||||
|
type="primary"
|
||||||
|
size="small"
|
||||||
|
@click="merEdit"
|
||||||
|
>编辑</el-button
|
||||||
|
>
|
||||||
|
<el-button
|
||||||
|
v-if="isEdit"
|
||||||
|
type="success"
|
||||||
|
size="small"
|
||||||
|
@click="saveInfo"
|
||||||
|
>完成</el-button
|
||||||
|
>
|
||||||
|
</div> -->
|
||||||
|
</div>
|
||||||
|
<ul class="list">
|
||||||
|
<li class="item">
|
||||||
|
<div class="title">联系人</div>
|
||||||
|
<div>{{merData.name}}</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div class="title">联系电话</div>
|
||||||
|
<div>{{ merData.phone }}</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div class="title">状态</div>
|
||||||
|
<div>{{ merData.status==1 ? '通过' : '未通过' }}</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div class="title">申请时间</div>
|
||||||
|
<div>{{ merData.create_time }}</div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div v-else class="head">
|
||||||
|
<div class="text">
|
||||||
|
<div class="title">
|
||||||
|
<span class="bold">添加商户</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!--详情-->
|
||||||
|
<merEditForm
|
||||||
|
ref="editForm"
|
||||||
|
:merId="merId"
|
||||||
|
:merCateList="merCateList"
|
||||||
|
:storeType="storeType"
|
||||||
|
:isAdd="isAdd"
|
||||||
|
:merData="merData"
|
||||||
|
@modifyCopy="modifyCopy"
|
||||||
|
@success="editSuccess"
|
||||||
|
v-if="isEdit || isAdd">
|
||||||
|
</merEditForm>
|
||||||
|
<mer-info ref="merInfo" :merData="merData" v-else-if="!isEdit && !isAdd"></mer-info>
|
||||||
|
</div>
|
||||||
|
<div v-if="isAdd" class="footer">
|
||||||
|
<el-button size="small" @click="handleClose">取消</el-button>
|
||||||
|
<el-button type="primary" size="small" @click="submitInfo">提交</el-button>
|
||||||
|
</div>
|
||||||
|
</el-drawer>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Copyright (c) 2016~2024 https://www.crmeb.com All rights reserved.
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Author: CRMEB Team <admin@crmeb.com>
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
import {
|
||||||
|
intentionDetailApi,
|
||||||
|
} from '@/api/merchant';
|
||||||
|
import merInfo from './merInfo';
|
||||||
|
import merEditForm from './merEditForm';
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
drawer: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
merCateList: {
|
||||||
|
type: Array,
|
||||||
|
default: [],
|
||||||
|
},
|
||||||
|
storeType: {
|
||||||
|
type: Array,
|
||||||
|
default: [],
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components: { merInfo, merEditForm },
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
loading: true,
|
||||||
|
merId: '',
|
||||||
|
isEdit: false,
|
||||||
|
isAdd: false,
|
||||||
|
direction: 'rtl',
|
||||||
|
activeName: 'detail',
|
||||||
|
merData: {},
|
||||||
|
orderImg: require('@/assets/images/store_icon.png')
|
||||||
|
};
|
||||||
|
},
|
||||||
|
filters: {
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
handleClose() {
|
||||||
|
if(this.isEdit || this.isAdd) {
|
||||||
|
this.$refs.editForm.resetData();
|
||||||
|
this.$refs.editForm.activeName = 'detail';
|
||||||
|
}else{
|
||||||
|
this.$refs.merInfo.activeName = 'detail';
|
||||||
|
}
|
||||||
|
this.$emit('closeDrawer');
|
||||||
|
},
|
||||||
|
getInfo(id) {
|
||||||
|
this.merId = id
|
||||||
|
this.isAdd = false;
|
||||||
|
intentionDetailApi(id)
|
||||||
|
.then((res) => {
|
||||||
|
this.loading = false;
|
||||||
|
this.drawer = true;
|
||||||
|
this.merData = res.data;
|
||||||
|
if(!this.isEdit)this.$refs.merInfo.onOperateLog(this.merId);
|
||||||
|
})
|
||||||
|
.catch((res) => {
|
||||||
|
this.$message.error(res.message);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
initData(){
|
||||||
|
this.merData = {
|
||||||
|
is_trader:0
|
||||||
|
}
|
||||||
|
this.isEdit = false;
|
||||||
|
this.isAdd = true;
|
||||||
|
this.loading = false;
|
||||||
|
},
|
||||||
|
merEdit(){
|
||||||
|
this.isEdit = true;
|
||||||
|
this.$nextTick(()=>{
|
||||||
|
this.getInfo(this.merId);
|
||||||
|
})
|
||||||
|
},
|
||||||
|
cancelEdit() {
|
||||||
|
this.isEdit = false
|
||||||
|
},
|
||||||
|
// 编辑成功回调
|
||||||
|
editSuccess(){
|
||||||
|
if(this.isAdd){
|
||||||
|
this.handleClose();
|
||||||
|
}else{
|
||||||
|
this.isEdit = false;
|
||||||
|
}
|
||||||
|
this.$emit('getList')
|
||||||
|
},
|
||||||
|
//下拉
|
||||||
|
handleCommand() {
|
||||||
|
this.$emit('onPassword',this.merId);
|
||||||
|
},
|
||||||
|
saveInfo(){
|
||||||
|
this.$refs.editForm.onSubmit(this.merId);
|
||||||
|
setTimeout(()=>{
|
||||||
|
this.getInfo(this.merId);
|
||||||
|
},500)
|
||||||
|
},
|
||||||
|
submitInfo(){
|
||||||
|
this.$refs.editForm.handleCreate();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.head {
|
||||||
|
padding: 20px 35px;
|
||||||
|
.full {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
.order_icon {
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
}
|
||||||
|
.text {
|
||||||
|
align-self: center;
|
||||||
|
flex: 1;
|
||||||
|
min-width: 0;
|
||||||
|
padding-left: 12px;
|
||||||
|
font-size: 13px;
|
||||||
|
color: #606266;
|
||||||
|
.title {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 16px;
|
||||||
|
line-height: 16px;
|
||||||
|
color: #282828;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.bold{
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.list {
|
||||||
|
display: flex;
|
||||||
|
margin-top: 20px;
|
||||||
|
overflow: hidden;
|
||||||
|
list-style: none;
|
||||||
|
padding: 0;
|
||||||
|
.item {
|
||||||
|
flex: none;
|
||||||
|
width: 200px;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 14px;
|
||||||
|
color: rgba(0, 0, 0, 0.85);
|
||||||
|
.title {
|
||||||
|
margin-bottom: 12px;
|
||||||
|
font-size: 13px;
|
||||||
|
line-height: 13px;
|
||||||
|
color: #666666;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.el-tabs--border-card {
|
||||||
|
box-shadow: none;
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
.section {
|
||||||
|
padding: 20px 0 8px;
|
||||||
|
border-bottom: 1px dashed #eeeeee;
|
||||||
|
.title {
|
||||||
|
padding-left: 10px;
|
||||||
|
border-left: 3px solid var(--prev-color-primary);
|
||||||
|
font-size: 15px;
|
||||||
|
line-height: 15px;
|
||||||
|
color: #303133;
|
||||||
|
}
|
||||||
|
.list {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
list-style: none;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
.item {
|
||||||
|
flex: 0 0 calc(100% / 2);
|
||||||
|
display: flex;
|
||||||
|
margin-top: 16px;
|
||||||
|
font-size: 13px;
|
||||||
|
color: #606266;
|
||||||
|
|
||||||
|
&:nth-child(2n + 1) {
|
||||||
|
padding-right: 20px;
|
||||||
|
padding-left: 20px;
|
||||||
|
}
|
||||||
|
&:nth-child(2n) {
|
||||||
|
padding-right: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.value {
|
||||||
|
flex: 1;
|
||||||
|
image {
|
||||||
|
display: inline-block;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
margin: 0 12px 12px 0;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.tab {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
.el-image {
|
||||||
|
width: 36px;
|
||||||
|
height: 36px;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
::v-deep .el-drawer__body {
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
.gary {
|
||||||
|
color: #aaa;
|
||||||
|
}
|
||||||
|
.footer{
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 17px;
|
||||||
|
padding-top: 17px;
|
||||||
|
border-top: 1px dashed #eeeeee;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,511 @@
|
||||||
|
<template>
|
||||||
|
<el-form
|
||||||
|
ref="merDataField"
|
||||||
|
size="small"
|
||||||
|
:rules="ruleValidate"
|
||||||
|
:model="merData"
|
||||||
|
label-width="120px"
|
||||||
|
@submit.native.prevent
|
||||||
|
>
|
||||||
|
<el-tabs v-loading="loading" type="border-card" v-model="activeName">
|
||||||
|
<el-tab-pane label="基本信息" name="detail">
|
||||||
|
<div class="section">
|
||||||
|
<div class="title">基础信息</div>
|
||||||
|
<el-row :gutter="24" class="mt20">
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="商户名称：" prop="mer_name">
|
||||||
|
<el-input
|
||||||
|
size="small"
|
||||||
|
v-model="merData.mer_name"
|
||||||
|
placeholder="请填写商户名称"
|
||||||
|
class="selWidth"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="商户地址：" prop="mer_address">
|
||||||
|
<el-input
|
||||||
|
size="small"
|
||||||
|
v-model="merData.mer_address"
|
||||||
|
placeholder="请填写详细地址"
|
||||||
|
class="selWidth"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="商户分类：" prop="category_id">
|
||||||
|
<el-select
|
||||||
|
size="small"
|
||||||
|
v-model="merData.category_id"
|
||||||
|
placeholder="请选择"
|
||||||
|
class="selWidth"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="item in merCateList"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="商户类型：" prop="is_trader">
|
||||||
|
<el-radio-group
|
||||||
|
v-model="merData.is_trader"
|
||||||
|
>
|
||||||
|
<el-radio :label="1" class="radio">自营</el-radio>
|
||||||
|
<el-radio :label="0">非自营</el-radio>
|
||||||
|
</el-radio-group>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="店铺类型：" prop="type_id">
|
||||||
|
<el-select
|
||||||
|
size="small"
|
||||||
|
v-model="merData.type_id"
|
||||||
|
placeholder="请选择"
|
||||||
|
class="selWidth"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="item in storeType"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="推荐商户：" prop="is_best">
|
||||||
|
<el-switch
|
||||||
|
v-model="merData.is_best"
|
||||||
|
:active-value="1"
|
||||||
|
:inactive-value="0"
|
||||||
|
:width="50"
|
||||||
|
active-text="是"
|
||||||
|
inactive-text="否"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="排序：" prop="sort">
|
||||||
|
<el-input-number
|
||||||
|
size="small"
|
||||||
|
v-model="merData.sort"
|
||||||
|
controls-position="right"
|
||||||
|
placeholder="请输入排序"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="商户状态：" prop="status">
|
||||||
|
<el-switch
|
||||||
|
v-model="merData.status"
|
||||||
|
:active-value="1"
|
||||||
|
:inactive-value="0"
|
||||||
|
:width="55"
|
||||||
|
active-text="开启"
|
||||||
|
inactive-text="关闭"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="备注：" prop="mark">
|
||||||
|
<el-input
|
||||||
|
type="textarea"
|
||||||
|
size="small"
|
||||||
|
v-model="merData.mark"
|
||||||
|
placeholder="请填写备注"
|
||||||
|
class="selWidth"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</div>
|
||||||
|
</el-tab-pane>
|
||||||
|
<el-tab-pane label="经营信息" name="operate">
|
||||||
|
<div class="section">
|
||||||
|
<div class="title">费用信息</div>
|
||||||
|
<el-row :gutter="24" class="mt20">
|
||||||
|
<el-col v-if="!isAdd" :span="24">
|
||||||
|
<el-form-item label="店铺保证金：" prop="ot_margin">
|
||||||
|
<span>{{merData.is_margin == 0 ? '无' : merData.ot_margin+'元'}}</span>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col v-if="!isAdd && merData.is_margin != 0" :span="24">
|
||||||
|
<el-form-item label="保证金支付状态：">
|
||||||
|
<span>{{merData.is_margin == 1 ? '待缴' : merData.is_margin == 0 ? '无' : '已缴' }}</span>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col v-if="!isAdd && merData.is_margin != 0" :span="24">
|
||||||
|
<el-form-item label="保证金余额：">
|
||||||
|
<span>{{merData.margin}}</span>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="24">
|
||||||
|
<el-form-item label="手续费设置：" prop="commission_rate">
|
||||||
|
<el-switch
|
||||||
|
v-model="merData.commission_switch"
|
||||||
|
:active-value="1"
|
||||||
|
:inactive-value="0"
|
||||||
|
:width="55"
|
||||||
|
active-text="开启"
|
||||||
|
inactive-text="关闭"
|
||||||
|
/>
|
||||||
|
<span v-if="merData.commission_switch">
|
||||||
|
<el-input-number
|
||||||
|
:min="0"
|
||||||
|
v-model="merData.commission_rate"
|
||||||
|
size="small"
|
||||||
|
controls-position="right"
|
||||||
|
placeholder="请输入手续费"
|
||||||
|
/>%
|
||||||
|
</span>
|
||||||
|
<div class="info info-red">(注：此处如未设置手续费，系统会自动读取商户分类下对应手续费；此处已设置，则优先以此处设置为准)</div>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</div>
|
||||||
|
<div class="section">
|
||||||
|
<div class="title">审核信息</div>
|
||||||
|
<el-row :gutter="24" class="mt20">
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item label="商品审核：" prop="is_audit">
|
||||||
|
<el-switch
|
||||||
|
v-model="merData.is_audit"
|
||||||
|
:active-value="1"
|
||||||
|
:inactive-value="0"
|
||||||
|
:width="50"
|
||||||
|
active-text="是"
|
||||||
|
inactive-text="否"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item label="直播间审核：" prop="is_bro_room">
|
||||||
|
<el-switch
|
||||||
|
v-model="merData.is_bro_room"
|
||||||
|
:active-value="1"
|
||||||
|
:inactive-value="0"
|
||||||
|
:width="50"
|
||||||
|
active-text="是"
|
||||||
|
inactive-text="否"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item label="直播商品：" prop="is_bro_goods">
|
||||||
|
<el-switch
|
||||||
|
v-model="merData.is_bro_goods"
|
||||||
|
:active-value="1"
|
||||||
|
:inactive-value="0"
|
||||||
|
:width="50"
|
||||||
|
active-text="是"
|
||||||
|
inactive-text="否"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</div>
|
||||||
|
<div class="section">
|
||||||
|
<div class="title">其他信息</div>
|
||||||
|
<div class="mt20">
|
||||||
|
<el-row :gutter="24">
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="商户关键字：" prop="mer_keyword">
|
||||||
|
<el-input
|
||||||
|
size="small"
|
||||||
|
v-model="merData.mer_keyword"
|
||||||
|
placeholder="请填写商户关键字"
|
||||||
|
class="selWidth"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row v-if="!isAdd" :gutter="24">
|
||||||
|
<el-col :span="12" style="position: relative;">
|
||||||
|
<el-form-item label="商品采集数：">
|
||||||
|
<el-input v-model="merData.copy_product_num" size="small" disabled ></el-input>
|
||||||
|
<el-button type="text" @click="modifyCopy" style="margin-left: 10px;position:absolute;right: -30px;">修改</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</el-tab-pane>
|
||||||
|
<el-tab-pane label="账号信息" name="account">
|
||||||
|
<div class="section">
|
||||||
|
<div class="title">登录账号</div>
|
||||||
|
<el-row :gutter="24" class="mt20">
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="商户账号：" prop="mer_account">
|
||||||
|
<el-input
|
||||||
|
type="text"
|
||||||
|
size="small"
|
||||||
|
v-model="merData.mer_account"
|
||||||
|
:disabled="!isAdd"
|
||||||
|
class="selWidth"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="登陆密码：" prop="mer_password">
|
||||||
|
<el-input
|
||||||
|
type="password"
|
||||||
|
size="small"
|
||||||
|
v-model="merData.mer_password"
|
||||||
|
:disabled="!isAdd"
|
||||||
|
class="selWidth"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col v-if="!isAdd" :span="12">
|
||||||
|
<el-form-item label="联系人：" prop="real_name">
|
||||||
|
<el-input
|
||||||
|
type="text"
|
||||||
|
size="small"
|
||||||
|
placeholder="请填写联系人"
|
||||||
|
v-model="merData.real_name"
|
||||||
|
class="selWidth"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="联系电话：" prop="mer_phone">
|
||||||
|
<el-input
|
||||||
|
size="small"
|
||||||
|
placeholder="请填写联系电话"
|
||||||
|
v-model="merData.mer_phone"
|
||||||
|
class="selWidth"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</div>
|
||||||
|
<div class="section">
|
||||||
|
<div class="title">财务帐号</div>
|
||||||
|
<el-row :gutter="24" class="mt20">
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="分账商户号：" prop="sub_mchid">
|
||||||
|
<el-input
|
||||||
|
placeholder="请填写分账商户号"
|
||||||
|
size="small"
|
||||||
|
v-model="merData.sub_mchid"
|
||||||
|
class="selWidth"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="24">
|
||||||
|
<div class="info-red" style="margin-left: 120px;">当开启自动分账时，每个子商户在微信后台的分账商户号，即特约子商户号</div>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</div>
|
||||||
|
</el-tab-pane>
|
||||||
|
</el-tabs>
|
||||||
|
</el-form>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Copyright (c) 2016~2024 https://www.crmeb.com All rights reserved.
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Author: CRMEB Team <admin@crmeb.com>
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
import { merchantUpdate, merchantCreate } from "@/api/merchant";
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
merData: {
|
||||||
|
type: Object,
|
||||||
|
default: {},
|
||||||
|
},
|
||||||
|
isAdd: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
merCateList: {
|
||||||
|
type: Array,
|
||||||
|
default: [],
|
||||||
|
},
|
||||||
|
storeType: {
|
||||||
|
type: Array,
|
||||||
|
default: [],
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
const validatePhone = (rule, value, callback) => {
|
||||||
|
if (!value) {
|
||||||
|
return callback(new Error('请填写联系方式'))
|
||||||
|
} else if (!/^1[3456789]\d{9}$/.test(value)) {
|
||||||
|
callback(new Error('格式不正确!'))
|
||||||
|
} else {
|
||||||
|
callback()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
loading: false,
|
||||||
|
merId: '',
|
||||||
|
direction: 'rtl',
|
||||||
|
activeName: 'detail',
|
||||||
|
ruleValidate: {
|
||||||
|
mer_name: [
|
||||||
|
{ required: true, message: '请输入商户名称', trigger: 'blur' }
|
||||||
|
],
|
||||||
|
mer_account: [
|
||||||
|
{ required: true, message: '请输入商户账号', trigger: 'blur' }
|
||||||
|
],
|
||||||
|
category_id: [
|
||||||
|
{ required: true, message: '请选择商户分类', trigger: 'change' }
|
||||||
|
],
|
||||||
|
type_id: [
|
||||||
|
{ required: true, message: '请选择店铺类型', trigger: 'change' }
|
||||||
|
],
|
||||||
|
mer_phone: [{ required: true, validator: validatePhone, trigger: 'blur' }],
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
filters: {
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
|
||||||
|
/**修改采集次数 */
|
||||||
|
modifyCopy() {
|
||||||
|
this.$emit('modifyCopy')
|
||||||
|
},
|
||||||
|
/**重置表单数据 */
|
||||||
|
resetData(){
|
||||||
|
this.$refs.merDataField.resetFields();
|
||||||
|
},
|
||||||
|
/*提交信息*/
|
||||||
|
onSubmit(id){
|
||||||
|
this.$refs['merDataField'].validate(valid => {
|
||||||
|
if (valid) {
|
||||||
|
this.loading = true;
|
||||||
|
merchantUpdate(id,this.merData)
|
||||||
|
.then(async res => {
|
||||||
|
this.$message.success(res.message);
|
||||||
|
this.loading = false;
|
||||||
|
this.$emit('success');
|
||||||
|
})
|
||||||
|
.catch(res => {
|
||||||
|
this.loading = false;
|
||||||
|
this.$message.error(res.message);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/**创建商户 */
|
||||||
|
handleCreate(){
|
||||||
|
this.$refs['merDataField'].validate((valid) => {
|
||||||
|
if (valid) {
|
||||||
|
merchantCreate(this.merData)
|
||||||
|
.then(async (res) => {
|
||||||
|
this.$message.success(res.message);
|
||||||
|
this.$emit('success');
|
||||||
|
})
|
||||||
|
.catch((res) => {
|
||||||
|
this.$message.error(res.message);
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
if(!this.merData.mer_name)return this.$message.error('请填写基本信息-商户名称');
|
||||||
|
if(!this.merData.category_id)return this.$message.error('请选择基本信息-商户分类');
|
||||||
|
if(!this.merData.type_id)return this.$message.error('请选择基本信息-店铺类型');
|
||||||
|
if(!this.merData.mer_account)return this.$message.error('请填写账号信息-商户账号');
|
||||||
|
if(!this.merData.mer_phone)return this.$message.error('请填写账号信息-联系电话');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.el-tabs--border-card {
|
||||||
|
box-shadow: none;
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
.section {
|
||||||
|
padding: 20px 0 8px;
|
||||||
|
border-bottom: 1px dashed #eeeeee;
|
||||||
|
.title {
|
||||||
|
padding-left: 10px;
|
||||||
|
border-left: 3px solid var(--prev-color-primary);
|
||||||
|
font-size: 15px;
|
||||||
|
line-height: 15px;
|
||||||
|
color: #303133;
|
||||||
|
}
|
||||||
|
.list {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
list-style: none;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
.item {
|
||||||
|
flex: 0 0 calc(100% / 2);
|
||||||
|
display: flex;
|
||||||
|
margin-top: 16px;
|
||||||
|
font-size: 13px;
|
||||||
|
color: #606266;
|
||||||
|
|
||||||
|
&:nth-child(2n + 1) {
|
||||||
|
padding-right: 20px;
|
||||||
|
padding-left: 20px;
|
||||||
|
}
|
||||||
|
&:nth-child(2n) {
|
||||||
|
padding-right: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.value {
|
||||||
|
flex: 1;
|
||||||
|
image {
|
||||||
|
display: inline-block;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
margin: 0 12px 12px 0;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.info-red{
|
||||||
|
color: red;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
::v-deep .el-input-number.is-controls-right .el-input__inner{
|
||||||
|
padding: 0 40px 0 10px;
|
||||||
|
}
|
||||||
|
::v-deep .el-form-item__label{
|
||||||
|
font-weight: normal;
|
||||||
|
color: #282828;
|
||||||
|
}
|
||||||
|
.tab {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
.el-image {
|
||||||
|
width: 36px;
|
||||||
|
height: 36px;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
::v-deep .el-drawer__body {
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
.gary {
|
||||||
|
color: #aaa;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
||||||
|
|
@ -0,0 +1,429 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<el-tabs type="border-card" v-model="activeName">
|
||||||
|
<el-tab-pane label="基本信息" name="detail">
|
||||||
|
<div class="section">
|
||||||
|
<div class="title">基础信息</div>
|
||||||
|
<ul class="list">
|
||||||
|
<li class="item">
|
||||||
|
<div>商户名称：</div>
|
||||||
|
<div class="value">
|
||||||
|
{{merData.mer_name}}
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>商户分类：</div>
|
||||||
|
<div class="value">
|
||||||
|
{{merData.category_name}}
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>店铺类型：</div>
|
||||||
|
<div class="value">{{merData.type_name}}</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>商户状态：</div>
|
||||||
|
<div class="value">{{merData.status == 1 ? "开启" : "关闭"}}</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>更新时间：</div>
|
||||||
|
<div class="value">{{merData.update_time}}</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>备注：</div>
|
||||||
|
<div class="value">{{merData.mark}}</div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</el-tab-pane>
|
||||||
|
<el-tab-pane label="企业信息" name="business">
|
||||||
|
<div class="section">
|
||||||
|
<ul class="list">
|
||||||
|
<li class="item">
|
||||||
|
<div>企业名称</div>
|
||||||
|
<div class="value">
|
||||||
|
{{merData.com.name}}
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>企业类型</div>
|
||||||
|
<div class="value">
|
||||||
|
{{merData.com.type}}
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>客服电话:</div>
|
||||||
|
<div class="value">
|
||||||
|
{{ merData.com.service}}
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>企业对接人姓名：</div>
|
||||||
|
<div class="value">
|
||||||
|
{{ merData.com.contact}}
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>企业对接人联系电话：</div>
|
||||||
|
<div class="value">
|
||||||
|
{{ merData.com.mobile}}
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>企业对接人编号:</div>
|
||||||
|
<div class="value">
|
||||||
|
{{ merData.com.number}}
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>发起人:</div>
|
||||||
|
<div class="value">
|
||||||
|
{{ merData.com.initiator}}
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>发起人电话:</div>
|
||||||
|
<div class="value">
|
||||||
|
{{ merData.com.inti_mobile}}
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="item item100">
|
||||||
|
<div>发起人编号:</div>
|
||||||
|
<div class="value">
|
||||||
|
{{ merData.com.inti_number}}
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="item item100">
|
||||||
|
<div>发起人手持介绍信照片:</div>
|
||||||
|
<div class="value">
|
||||||
|
<el-image v-for="(url,i) in merData.com.init_image"
|
||||||
|
:key="i"
|
||||||
|
style="width: 100px; height: 100px"
|
||||||
|
:src="url"
|
||||||
|
:preview-src-list="merData.com.init_image">
|
||||||
|
</el-image>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="item item100">
|
||||||
|
<div>是否惠美乡村店铺:</div>
|
||||||
|
<div class="value">
|
||||||
|
{{ merData.com.is_huimei? '是': '否'}}
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="item item100">
|
||||||
|
<div>惠美乡村红头文件:</div>
|
||||||
|
<div class="value">
|
||||||
|
<el-image v-for="(url,i) in merData.com.image_huimei"
|
||||||
|
:key="i"
|
||||||
|
style="width: 100px; height: 100px"
|
||||||
|
:src="url"
|
||||||
|
:preview-src-list="merData.com.image_huimei">
|
||||||
|
</el-image>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="item item100">
|
||||||
|
<div>是否退伍军人:</div>
|
||||||
|
<div class="value">
|
||||||
|
{{ merData.com.is_soldier? '是': '否'}}
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="item item100">
|
||||||
|
<div>退伍军人证件照:</div>
|
||||||
|
<div class="value">
|
||||||
|
<el-image v-for="(url,i) in merData.com.image_soldier"
|
||||||
|
:key="i"
|
||||||
|
style="width: 100px; height: 100px"
|
||||||
|
:src="url"
|
||||||
|
:preview-src-list="merData.com.image_soldier">
|
||||||
|
</el-image>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</el-tab-pane>
|
||||||
|
<el-tab-pane label="身份证信息" name="account">
|
||||||
|
<div class="section">
|
||||||
|
<div class="title">身份证信息</div>
|
||||||
|
<ul class="list">
|
||||||
|
<li class="item">
|
||||||
|
<div>身份证正面：</div>
|
||||||
|
<div class="value">
|
||||||
|
<el-image
|
||||||
|
style="width: 100px; height: 100px"
|
||||||
|
:src="merData.idcard.image1"
|
||||||
|
:preview-src-list="[merData.idcard.image1]">
|
||||||
|
</el-image>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>身份证反面：</div>
|
||||||
|
<div class="value">
|
||||||
|
<el-image
|
||||||
|
style="width: 100px; height: 100px"
|
||||||
|
:src="merData.idcard.image2"
|
||||||
|
:preview-src-list="[merData.idcard.image2]">
|
||||||
|
</el-image>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>身份证上的名字：</div>
|
||||||
|
<div class="value">{{merData.idcard.name}}</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>身份证上的号码：</div>
|
||||||
|
<div class="value">{{merData.idcard.number}}</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>身份证上的开始时间：</div>
|
||||||
|
<div class="value">{{merData.idcard.start}}</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>身份证结束时间：</div>
|
||||||
|
<div class="value">{{merData.idcard.end}}</div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</el-tab-pane>
|
||||||
|
<el-tab-pane label="营业执照信息" name="biz">
|
||||||
|
<div class="section">
|
||||||
|
<div class="title">营业执照信息</div>
|
||||||
|
<ul class="list">
|
||||||
|
<li class="item">
|
||||||
|
<div>营业执照照片：</div>
|
||||||
|
<div class="value">
|
||||||
|
<el-image v-for="(url,i) in merData.biz.image"
|
||||||
|
:key="i"
|
||||||
|
style="width: 100px; height: 100px"
|
||||||
|
:src="url"
|
||||||
|
:preview-src-list="merData.biz.image">
|
||||||
|
</el-image>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>营业执照号码：</div>
|
||||||
|
<div class="value">{{merData.biz.number}}</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>开始时间：</div>
|
||||||
|
<div class="value">{{merData.biz.start}}</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>结束时间：</div>
|
||||||
|
<div class="value">{{merData.biz.end}}</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>营业执照地址：</div>
|
||||||
|
<div class="value">{{merData.biz.address}}</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>实际经营地址：</div>
|
||||||
|
<div class="value">{{merData.biz.address_true}}</div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</el-tab-pane>
|
||||||
|
<el-tab-pane label="银行卡信息" name="bank">
|
||||||
|
<div class="section">
|
||||||
|
<div class="title">银行卡信息</div>
|
||||||
|
<ul class="list">
|
||||||
|
<li class="item">
|
||||||
|
<div>姓名：</div>
|
||||||
|
<div class="value">
|
||||||
|
{{merData.bank.bankCardUserName}}
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>银行：</div>
|
||||||
|
<div class="value">{{merData.bank.bankName}}</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>卡号：</div>
|
||||||
|
<div class="value">{{merData.bank.bankCard}}</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>开户行：</div>
|
||||||
|
<div class="value">{{merData.bank.bankBranchName}}</div>
|
||||||
|
</li>
|
||||||
|
<li class="item">
|
||||||
|
<div>营业执照地址：</div>
|
||||||
|
<div class="value">
|
||||||
|
<el-image v-for="(url,i) in merData.bank.bankCardImg"
|
||||||
|
:key="i"
|
||||||
|
style="width: 100px; height: 100px"
|
||||||
|
:src="url"
|
||||||
|
:preview-src-list="merData.bank.bankCardImg">
|
||||||
|
</el-image>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</el-tab-pane>
|
||||||
|
</el-tabs>
|
||||||
|
<div class="images" v-show="false" v-viewer="{ movable: false }">
|
||||||
|
<img v-for="(src,index) in merData.mer_certificate" :src="src" :key="index" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Copyright (c) 2016~2024 https://www.crmeb.com All rights reserved.
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
// | Author: CRMEB Team <admin@crmeb.com>
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
import { merchantOperateLog } from "@/api/merchant";
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
merData: {
|
||||||
|
type: Object,
|
||||||
|
default: {},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
loading: true,
|
||||||
|
merId: '',
|
||||||
|
direction: 'rtl',
|
||||||
|
activeName: 'detail',
|
||||||
|
timeVal: [],
|
||||||
|
tableDataLog: {
|
||||||
|
data: [],
|
||||||
|
total: 0
|
||||||
|
},
|
||||||
|
tableFromLog: {
|
||||||
|
user_type: '',
|
||||||
|
date: [],
|
||||||
|
page: 1,
|
||||||
|
limit: 10
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
filters: {
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
lookImg(item) {
|
||||||
|
this.imageUrl = item;
|
||||||
|
const viewer = this.$el.querySelector('.images').$viewer;
|
||||||
|
viewer.show();
|
||||||
|
this.$nextTick(() => {
|
||||||
|
let i = this.merData.mer_certificate.findIndex((e) => e === item);
|
||||||
|
viewer.update().view(i);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 具体日期
|
||||||
|
onchangeTime(e) {
|
||||||
|
this.timeVal = e
|
||||||
|
this.tableFromLog.date = e ? this.timeVal.join('-') : ''
|
||||||
|
this.onOperateLog(this.merId)
|
||||||
|
},
|
||||||
|
onOperateLog(id){
|
||||||
|
this.merId = id;
|
||||||
|
merchantOperateLog(id, this.tableFromLog).then((res) => {
|
||||||
|
this.tableDataLog.data = res.data.list
|
||||||
|
this.tableDataLog.total = res.data.count
|
||||||
|
});
|
||||||
|
},
|
||||||
|
pageChangeLog(page) {
|
||||||
|
this.tableFromLog.page = page
|
||||||
|
this.onOperateLog(this.merId)
|
||||||
|
},
|
||||||
|
handleSizeChangeLog(val) {
|
||||||
|
this.tableFromLog.limit = val
|
||||||
|
this.onOperateLog(this.merId)
|
||||||
|
},
|
||||||
|
operationType(type) {
|
||||||
|
if (type == 0) {
|
||||||
|
return '系统';
|
||||||
|
} else if (type == 1) {
|
||||||
|
return '用户';
|
||||||
|
} else if (type == 2) {
|
||||||
|
return '平台';
|
||||||
|
} else if (type == 3) {
|
||||||
|
return '商户';
|
||||||
|
} else if (type == 4) {
|
||||||
|
return '商家客服';
|
||||||
|
} else {
|
||||||
|
return '未知';
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.el-tabs--border-card {
|
||||||
|
box-shadow: none;
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
.section {
|
||||||
|
padding: 20px 0 8px;
|
||||||
|
border-bottom: 1px dashed #eeeeee;
|
||||||
|
.title {
|
||||||
|
padding-left: 10px;
|
||||||
|
border-left: 3px solid var(--prev-color-primary);
|
||||||
|
font-size: 15px;
|
||||||
|
line-height: 15px;
|
||||||
|
color: #303133;
|
||||||
|
}
|
||||||
|
.list {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
list-style: none;
|
||||||
|
padding: 0;
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
.item {
|
||||||
|
flex: 0 0 calc(100% / 2);
|
||||||
|
display: flex;
|
||||||
|
margin-top: 16px;
|
||||||
|
font-size: 13px;
|
||||||
|
color: #606266;
|
||||||
|
padding-right: 20px;
|
||||||
|
padding-left: 20px;
|
||||||
|
&.item100{
|
||||||
|
flex: 0 0 calc(100% / 1);
|
||||||
|
padding-right: 20px;
|
||||||
|
padding-left: 20px;
|
||||||
|
}
|
||||||
|
&:nth-child(2n + 1) {
|
||||||
|
padding-right: 20px;
|
||||||
|
padding-left: 20px;
|
||||||
|
}
|
||||||
|
// &:nth-child(2n) {
|
||||||
|
// padding-right: 20px;
|
||||||
|
// }
|
||||||
|
}
|
||||||
|
.value {
|
||||||
|
flex: 1;
|
||||||
|
image {
|
||||||
|
display: inline-block;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
margin: 0 12px 12px 0;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.info-red{
|
||||||
|
color: red;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
.tab {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
.el-image {
|
||||||
|
width: 36px;
|
||||||
|
height: 36px;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
::v-deep .el-drawer__body {
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
.gary {
|
||||||
|
color: #aaa;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
@ -38,6 +38,13 @@ module.exports = {
|
||||||
errors: true
|
errors: true
|
||||||
},
|
},
|
||||||
before: require('./mock/mock-server.js')
|
before: require('./mock/mock-server.js')
|
||||||
|
// proxy: {
|
||||||
|
// '/api': { //接口地址 以 api开头的都走下面的配置
|
||||||
|
// target: 'http://192.168.1.224:8324', //代理目标地址为后端服务器地址
|
||||||
|
// ws: true, //是否支持 websocket 请求 支持
|
||||||
|
// changeOrigin: true, //是否启用跨域
|
||||||
|
// }
|
||||||
|
// }
|
||||||
},
|
},
|
||||||
configureWebpack: {
|
configureWebpack: {
|
||||||
// provide the app's title in webpack's name field, so that
|
// provide the app's title in webpack's name field, so that
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue