mkm/new_shop_admin_vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

1

Browse Source
This commit is contained in:
DESKTOP-GMUNQ1B\k 2024-03-14 18:03:24 +08:00
parent 9da1abfbd8
commit 66116960a0
8 changed files with 858 additions and 494 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/api/request.js
View File

@ -15,7 +15,7 @@ const instance = axios.create({
baseURL: SettingMer.https, baseURL: SettingMer.https,
timeout: 60000 timeout: 60000
}) })
const defaultOpt = {login: true} const defaultOpt = { login: true }
function baseRequest(options) { function baseRequest(options) {
const token = store.getters.token const token = store.getters.token
@ -28,7 +28,7 @@ function baseRequest(options) {
instance(options).then(res => { instance(options).then(res => {
const data = res.data || {} const data = res.data || {}
if (res.status !== 200) { if (res.status !== 200) {
return reject({message: '请求失败', res, data}) return reject({ message: '请求失败', res, data })
} }
if ([410000, 410001, 410002, 40000].indexOf(data.status) !== -1) { if ([410000, 410001, 410002, 40000].indexOf(data.status) !== -1) {
@ -38,9 +38,9 @@ function baseRequest(options) {
} else if (data.status === 200) { } else if (data.status === 200) {
return resolve(data, res) return resolve(data, res)
} else { } else {
return reject({message: data.message, res, data}) return reject({ message: data.message, res, data })
} }
}).catch(message => reject({message})); }).catch(message => reject({ message }));
}) })
} }
/** /**
@ -58,7 +58,7 @@ const request = ['post', 'put', 'patch', 'delete'].reduce((request, method) => {
*/ */
request[method] = (url, data = {}, options = {}) => { request[method] = (url, data = {}, options = {}) => {
return baseRequest( return baseRequest(
Object.assign({url, data, method}, defaultOpt, options) Object.assign({ url, data, method }, defaultOpt, options)
) )
} }
return request return request
@ -74,7 +74,7 @@ const request = ['post', 'put', 'patch', 'delete'].reduce((request, method) => {
*/ */
request[method] = (url, params = {}, options = {}) => { request[method] = (url, params = {}, options = {}) => {
return baseRequest( return baseRequest(
Object.assign({url, params, method}, defaultOpt, options) Object.assign({ url, params, method }, defaultOpt, options)
) )
} }
}) })

82
src/api/request_area.js Normal file
View File

@ -0,0 +1,82 @@
// +----------------------------------------------------------------------
// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
// +----------------------------------------------------------------------
// | Copyright (c) 2016~2024 https://www.crmeb.com All rights reserved.
// +----------------------------------------------------------------------
// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
// +----------------------------------------------------------------------
// | Author: CRMEB Team <admin@crmeb.com>
// +----------------------------------------------------------------------
import axios from 'axios'
import store from '@/store'
import SettingMer from '@/libs/settingMer'
const instance = axios.create({
baseURL: SettingMer.https.replace("sys", ""),
timeout: 60000
})
const defaultOpt = { login: true }
function baseRequest(options) {
const token = store.getters.token
const headers = options.headers || {}
if (token) {
headers['X-Token'] = token
options.headers = headers
}
return new Promise((resolve, reject) => {
instance(options).then(res => {
const data = res.data || {}
if (res.status !== 200) {
return reject({ message: '请求失败', res, data })
}
if ([410000, 410001, 410002, 40000].indexOf(data.status) !== -1) {
store.dispatch('user/resetToken').then(() => {
location.reload()
})
} else if (data.status === 200) {
return resolve(data, res)
} else {
return reject({ message: data.message, res, data })
}
}).catch(message => reject({ message }));
})
}
/**
* http 请求基础类
* 参考文档 https://www.kancloud.cn/yunye/axios/234845
*
*/
const request = ['post', 'put', 'patch', 'delete'].reduce((request, method) => {
/**
*
* @param url string 接口地址
* @param data object get参数
* @param options object axios 配置项
* @returns {AxiosPromise}
*/
request[method] = (url, data = {}, options = {}) => {
return baseRequest(
Object.assign({ url, data, method }, defaultOpt, options)
)
}
return request
}, {});
['get', 'head'].forEach(method => {
/**
*
* @param url string 接口地址
* @param params object get参数
* @param options object axios 配置项
* @returns {AxiosPromise}
*/
request[method] = (url, params = {}, options = {}) => {
return baseRequest(
Object.assign({ url, params, method }, defaultOpt, options)
)
}
})
export default request

18
src/api/shoplist.js Normal file
View File

@ -0,0 +1,18 @@
import request from './request_area'
/*
获取第一级商圈
*/
export const get_area = (data) => request.get('api/city/get_area', data)
/*
获取第二级商圈
*/
export const get_stree = (data) => request.get('api/city/get_street', data)
/*
获取第三级级商圈
*/
export const get_village = (data) => request.get('api/city/get_village', data)
export const get_city = (data) => request.get('api/city/get_city', data)

456
src/views/merchant/application/index.vue
View File

@ -3,71 +3,30 @@
<div class="selCard"> <div class="selCard">
<el-form :model="tableFrom" ref="searchForm" size="small" label-width="85px" :inline="true"> <el-form :model="tableFrom" ref="searchForm" size="small" label-width="85px" :inline="true">
<el-form-item label="状态：" prop="status"> <el-form-item label="状态：" prop="status">
<el-select <el-select v-model="tableFrom.status" clearable placeholder="请选择" class="selWidth" @change="getList(1)">
v-model="tableFrom.status" <el-option label="全部" value="" />
clearable <el-option label="待审核" value="0" />
placeholder="请选择" <el-option label="审核通过" value="1" />
class="selWidth" <el-option label="审核未通过" value="-1" />
@change="getList(1)"
>
<el-option label="全部" value=""/>
<el-option label="待审核" value="0"/>
<el-option label="审核通过" value="1"/>
<el-option label="审核未通过" value="-1"/>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="选择时间："> <el-form-item label="选择时间：">
<el-date-picker <el-date-picker v-model="timeVal" type="daterange" placeholder="选择日期" format="yyyy/MM/dd"
v-model="timeVal" value-format="yyyy/MM/dd" :picker-options="pickerOptions" @change="onchangeTime" style="width: 280px" />
type="daterange"
placeholder="选择日期"
format="yyyy/MM/dd"
value-format="yyyy/MM/dd"
:picker-options="pickerOptions"
@change="onchangeTime"
style="width: 280px"
/>
</el-form-item> </el-form-item>
<el-form-item label="商户分类：" prop="category_id"> <el-form-item label="商户分类：" prop="category_id">
<el-select <el-select v-model="tableFrom.category_id" clearable placeholder="请选择" class="selWidth" @change="getList(1)">
v-model="tableFrom.category_id" <el-option v-for="item in merCateList" :key="item.value" :label="item.label" :value="item.value" />
clearable
placeholder="请选择"
class="selWidth"
@change="getList(1)"
>
<el-option
v-for="item in merCateList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="店铺类型：" prop="type_id"> <el-form-item label="店铺类型：" prop="type_id">
<el-select <el-select v-model="tableFrom.type_id" clearable placeholder="请选择" class="selWidth" @change="getList(1)">
v-model="tableFrom.type_id" <el-option v-for="item in storeType" :key="item.value" :label="item.label" :value="item.value" />
clearable
placeholder="请选择"
class="selWidth"
@change="getList(1)"
>
<el-option
v-for="item in storeType"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="关键字：" prop="keyword"> <el-form-item label="关键字：" prop="keyword">
<el-input <el-input v-model="tableFrom.keyword" @keyup.enter.native="getList(1)" placeholder="请输入商户名称关键字/联系电话"
v-model="tableFrom.keyword" class="selWidth" clearable />
@keyup.enter.native="getList(1)"
placeholder="请输入商户名称关键字/联系电话"
class="selWidth"
clearable
/>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" size="small" @click="getList(1)">搜索</el-button> <el-button type="primary" size="small" @click="getList(1)">搜索</el-button>
@ -76,13 +35,7 @@
</el-form> </el-form>
</div> </div>
<el-card class="mt14"> <el-card class="mt14">
<el-table <el-table v-loading="listLoading" :data="tableData.data" size="small" highlight-current-row class="switchTable">
v-loading="listLoading"
:data="tableData.data"
size="small"
highlight-current-row
class="switchTable"
>
<el-table-column prop="mer_intention_id" label="ID" min-width="60" /> <el-table-column prop="mer_intention_id" label="ID" min-width="60" />
<el-table-column prop="mer_name" label="商户名称" min-width="150" /> <el-table-column prop="mer_name" label="商户名称" min-width="150" />
<el-table-column prop="category_name" label="商户分类" min-width="150" /> <el-table-column prop="category_name" label="商户分类" min-width="150" />
@ -93,13 +46,8 @@
<el-table-column prop="create_time" label="资质图片" min-width="150"> <el-table-column prop="create_time" label="资质图片" min-width="150">
<template slot-scope="scope"> <template slot-scope="scope">
<div class="demo-image__preview"> <div class="demo-image__preview">
<el-image <el-image v-for="(item, index) in scope.row.images" :key="index" :src="item" class="mr5"
v-for="(item, index) in scope.row.images" :preview-src-list="[item]" />
:key="index"
:src="item"
class="mr5"
:preview-src-list="[item]"
/>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
@ -112,42 +60,288 @@
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="mark" label="备注" min-width="150" /> <el-table-column prop="mark" label="备注" min-width="150" />
<el-table-column label="操作" min-width="150" fixed="right"> <el-table-column label="操作" min-width="170" fixed="right" align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button <el-button v-if="scope.row.status == 0" type="text" size="small"
v-if="scope.row.status == 0" @click="onchangeIsShow(scope.row)">审核</el-button>
type="text" <el-button type="text" size="small" @click="onEdit(scope.row.mer_intention_id)">备注</el-button>
size="small" <el-button type="text" size="small" @click="handleView(scope.row)">查看</el-button>
@click="onchangeIsShow(scope.row.mer_intention_id)" <el-button type="text" size="small" @click="handleDelete(scope.row.mer_intention_id)">删除</el-button>
>审核</el-button
>
<el-button
type="text"
size="small"
@click="onEdit(scope.row.mer_intention_id)"
>备注</el-button
>
<el-button
type="text"
size="small"
@click="handleDelete(scope.row.mer_intention_id)"
>删除</el-button
>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<div class="block"> <div class="block">
<el-pagination <el-pagination background :page-size="tableFrom.limit" :current-page="tableFrom.page"
background layout="total, prev, pager, next, jumper" :total="tableData.total" @size-change="handleSizeChange"
:page-size="tableFrom.limit" @current-change="pageChange" />
:current-page="tableFrom.page"
layout="total, prev, pager, next, jumper"
:total="tableData.total"
@size-change="handleSizeChange"
@current-change="pageChange"
/>
</div> </div>
</el-card> </el-card>
<!-- 审核状态 -->
<el-dialog title="修改审核状态" :visible.sync="statusAuditVisible" width="60%">
<el-form ref="statusAuditForm" :model="statusAuditForm" label-width="120px" @submit.native.prevent>
<el-row>
<el-col :span="12">
<el-form-item label="审核状态：">
<el-select v-model="statusAuditForm.state" placeholder="请选择审核状态" @change="statusChange">
<el-option label="同意" :value="1"> </el-option>
<el-option label="拒绝" :value="2"> </el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="自动创建商户：">
<el-radio-group v-model="statusAuditForm.create_mer" @change="createMerChange">
<el-radio :label="1">创建</el-radio>
<el-radio :label="2">不创建</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="24" v-if="statusAuditForm.state == 2">
<el-form-item label="拒绝原因：" prop="fail_msg">
<el-input type="textarea" :rows="2" placeholder="请输入拒绝原因" v-model="statusAuditForm.fail_msg">
</el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="申请类型：">
<el-input readony :value="statusAuditForm.type == 1 ? '商户入驻申请' : '商户开通交易申请'" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="商户名称：">
<el-input readony :value="statusAuditForm.mer_name" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="商户分类：">
<el-input readony :value="statusAuditForm.category_name" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="店铺类型：">
<el-input readony :value="statusAuditForm.type_name" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="商户姓名：">
<el-input readony :value="statusAuditForm.name" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="联系方式：">
<el-input readony :value="statusAuditForm.phone" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="申请时间：">
<el-input readony :value="statusAuditForm.create_time" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="法人姓名：">
<el-input readony :value="statusAuditForm.name" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="社会代码：">
<el-input readony :value="statusAuditForm.social_credit_code" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="公司名称：">
<el-input readony :value="statusAuditForm.company_name" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="公司性质：">
<el-input readony :value="statusAuditForm.is_company == 1 ? '对公户' : '个体户'" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item :label="statusAuditForm.is_company == 1 ? '对公账号：' : '银行卡号：'">
<el-input readony :value="statusAuditForm.bank_code" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="开户银行：">
<el-input readony :value="statusAuditForm.bank_username" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="开户网点：">
<el-input readony :value="statusAuditForm.bank_opening" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="资质：">
<div class="demo-image__preview">
<el-image style="width: 80px;height: 60px;margin-right: 10px;"
v-for="(ii, index) in statusAuditForm.images" :key="index" :src="ii" class="preview"
:preview-src-list="[ii]" />
</div>
</el-form-item>
</el-col>
<el-col :span="24" v-if="statusAuditForm.is_company == 0">
<el-form-item label="银行卡照片：">
<div class="demo-image__preview">
<el-image style="width: 80px;height: 60px;margin-right: 10px;"
v-for="(ii, index) in statusAuditForm.bank_img" :key="index" :src="ii" class="preview"
:preview-src-list="[ii]" />
</div>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="备注：">
<el-input readony :value="statusAuditForm.mark" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer">
<el-button type="primary" class="submission" size="small" @click="handleSubmit()">提交</el-button>
</div>
</el-dialog>
<!-- 提交信息查看 -->
<el-dialog title="查看" :visible.sync="formShow" width="60%">
<el-form ref="statusAuditForm" :model="statusAuditForm" label-width="120px" @submit.native.prevent>
<el-row>
<el-col :span="12">
<el-form-item label="申请类型：">
<el-input readony :value="statusAuditForm.type == 1 ? '商户入驻申请' : '商户开通交易申请'" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="商户名称：">
<el-input readony :value="statusAuditForm.mer_name" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="商户分类：">
<el-input readony :value="statusAuditForm.category_name" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="店铺类型：">
<el-input readony :value="statusAuditForm.type_name" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="商户姓名：">
<el-input readony :value="statusAuditForm.name" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="联系方式：">
<el-input readony :value="statusAuditForm.phone" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="申请时间：">
<el-input readony :value="statusAuditForm.create_time" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="法人姓名：">
<el-input readony :value="statusAuditForm.name" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="社会代码：">
<el-input readony :value="statusAuditForm.social_credit_code" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="公司名称：">
<el-input readony :value="statusAuditForm.company_name" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="公司性质：">
<el-input readony :value="statusAuditForm.is_company == 1 ? '对公户' : '个体户'" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item :label="statusAuditForm.is_company == 1 ? '对公账号：' : '银行卡号：'">
<el-input readony :value="statusAuditForm.bank_code" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="开户银行：">
<el-input readony :value="statusAuditForm.bank_username" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="开户网点：">
<el-input readony :value="statusAuditForm.bank_opening" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="资质：">
<div class="demo-image__preview">
<el-image style="width: 80px;height: 60px;margin-right: 10px;"
v-for="(ii, index) in statusAuditForm.images" :key="index" :src="ii" class="preview"
:preview-src-list="[ii]" />
</div>
</el-form-item>
</el-col>
<el-col :span="24" v-if="statusAuditForm.is_company == 0">
<el-form-item label="银行卡照片：">
<div class="demo-image__preview">
<el-image style="width: 80px;height: 60px;margin-right: 10px;"
v-for="(ii, index) in statusAuditForm.bank_img" :key="index" :src="ii" class="preview"
:preview-src-list="[ii]" />
</div>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="备注：">
<el-input readony :value="statusAuditForm.mark" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer">
<el-button type="primary" plain class="submission" size="small" @click="formShow = false">关闭</el-button>
</div>
</el-dialog>
</div> </div>
</template> </template>
@ -204,11 +398,14 @@ 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: [],
statusAuditForm: {},
formShow: false,
statusAuditVisible: false
}; };
}, },
watch: { watch: {
mer_id(newName, oldName) { mer_id(newName, oldName) {
this.getList(""); this.getList("");
} }
}, },
mounted() { mounted() {
@ -217,8 +414,26 @@ export default {
this.getList(""); this.getList("");
}, },
methods: { methods: {
// 如果审核状态为拒绝，就不能创建商户
statusChange() {
if (this.statusAuditForm.state == 2) {
this.statusAuditForm.create_mer = 2;
} else {
this.statusAuditForm.create_mer = 1;
}
},
// 如果创建商户，则同意审核
createMerChange() {
if (this.statusAuditForm.create_mer == 2) {
this.statusAuditForm.state = 2;
} else {
this.statusAuditForm.state = 1;
}
},
/**重置 */ /**重置 */
searchReset(){ searchReset() {
this.timeVal = [] this.timeVal = []
this.tableFrom.date = "" this.tableFrom.date = ""
this.$refs.searchForm.resetFields() this.$refs.searchForm.resetFields()
@ -239,17 +454,17 @@ export default {
// 商户分类； // 商户分类；
getMerCategory() { getMerCategory() {
getMerCateApi().then(res => { getMerCateApi().then(res => {
this.merCateList = res.data this.merCateList = res.data
}).catch(res => { }).catch(res => {
this.$message.error(res.message) this.$message.error(res.message)
}) })
}, },
/**获取店铺类型 */ /**获取店铺类型 */
getStoreType(){ getStoreType() {
getstoreTypeApi().then(res => { getstoreTypeApi().then(res => {
this.storeType = res.data this.storeType = res.data
}).catch(res => { }).catch(res => {
this.$message.error(res.message) this.$message.error(res.message)
}) })
}, },
// 列表 // 列表
@ -275,16 +490,37 @@ export default {
this.tableFrom.limit = val; this.tableFrom.limit = val;
this.getList(1); this.getList(1);
}, },
// 修改状态 // 修改状态
onchangeIsShow(id) { onchangeIsShow(item) {
this.$modalForm(intentionStatusApi(id)).then(() => this.getList("")); this.statusAuditVisible = true;
if (item.financial_bank) {
let bi = JSON.parse(item.financial_bank);
item.bank_username = bi.bank;
item.bank_code = bi.bank_code;
item.bank_opening = bi.bank_branch;
if (bi.bank_front[0]) {
this.$set(item, 'bank_img', bi.bank_front);
}
}
this.statusAuditForm = item;
this.$set(this.statusAuditForm, 'state', 1);
this.$set(this.statusAuditForm, 'create_mer', 1);
}, },
// 添加 // 添加
// 编辑 // 编辑
onEdit(id) { onEdit(id) {
this.$modalForm(auditApi(id)).then(() => this.getList("")); this.$modalForm(auditApi(id)).then(() => this.getList(""));
}, },
// 查看
handleView(row) {
this.statusAuditForm = row;
this.formShow = true;
},
// 删除 // 删除
handleDelete(id) { handleDelete(id) {
this.$deleteSure().then(() => { this.$deleteSure().then(() => {
@ -302,9 +538,15 @@ export default {
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss">
::v-deep table .el-image { ::v-deep table .el-image {
display: inline-block !important; display: inline-block !important;
} }
.el-dialog__body {
max-height: 66vh !important;
overflow: auto
}
@import '@/styles/form.scss'; @import '@/styles/form.scss';
</style> </style>

114
src/views/merchant/list/handle/merDetails.vue
View File

@ -1,12 +1,7 @@
<template> <template>
<div> <div>
<el-drawer <el-drawer :with-header="false" :size="1000" :visible.sync="drawer" :direction="direction"
:with-header="false" :before-close="handleClose">
:size="1000"
:visible.sync="drawer"
:direction="direction"
:before-close="handleClose"
>
<div v-loading="loading"> <div v-loading="loading">
<div v-if="!isAdd" class="head"> <div v-if="!isAdd" class="head">
<div class="full"> <div class="full">
@ -15,33 +10,17 @@
<div class="title"> <div class="title">
<span class="bold">{{ merData.mer_name }}</span> <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.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> <el-tag v-if="merData.merchantType" type="warning" class="tags_name" effect="dark"
size="mini">{{ merData.merchantType.type_name }}</el-tag>
</div> </div>
<div> <div>
<span class="mr20">{{ merData.mer_address }}</span> <span class="mr20">{{ merData.mer_address }}</span>
</div> </div>
</div> </div>
<div> <div>
<el-button <el-button v-if="isEdit" size="small" @click="cancelEdit">取消</el-button>
v-if="isEdit" <el-button v-if="!isEdit" type="primary" size="small" @click="merEdit">编辑</el-button>
size="small" <el-button v-if="isEdit" type="success" size="small" @click="saveInfo">完成</el-button>
@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
>
<el-dropdown @command="handleCommand" class="ml10"> <el-dropdown @command="handleCommand" class="ml10">
<el-button icon="el-icon-more" size="small"></el-button> <el-button icon="el-icon-more" size="small"></el-button>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
@ -53,7 +32,7 @@
<ul class="list"> <ul class="list">
<li class="item"> <li class="item">
<div class="title">联系人</div> <div class="title">联系人</div>
<div>{{merData.real_name}}</div> <div>{{ merData.real_name }}</div>
</li> </li>
<li class="item"> <li class="item">
<div class="title">联系电话</div> <div class="title">联系电话</div>
@ -61,7 +40,7 @@
</li> </li>
<li class="item"> <li class="item">
<div class="title">状态</div> <div class="title">状态</div>
<div>{{ merData.status==1 ? '开启' : '关闭' }}</div> <div>{{ merData.status == 1 ? '开启' : '关闭' }}</div>
</li> </li>
<li class="item"> <li class="item">
<div class="title">入驻时间</div> <div class="title">入驻时间</div>
@ -77,16 +56,8 @@
</div> </div>
</div> </div>
<!--详情--> <!--详情-->
<merEditForm <merEditForm ref="editForm" :merId="merId" :merCateList="merCateList" :storeType="storeType" :isAdd="isAdd"
ref="editForm" :merData="merData" @modifyCopy="modifyCopy" @success="editSuccess" v-if="merData && (isEdit || isAdd)">
:merId="merId"
:merCateList="merCateList"
:storeType="storeType"
:isAdd="isAdd"
:merData="merData"
@modifyCopy="modifyCopy"
@success="editSuccess"
v-if="isEdit || isAdd">
</merEditForm> </merEditForm>
<mer-info ref="merInfo" :merData="merData" v-else-if="!isEdit && !isAdd"></mer-info> <mer-info ref="merInfo" :merData="merData" v-else-if="!isEdit && !isAdd"></mer-info>
</div> </div>
@ -146,10 +117,10 @@ export default {
}, },
methods: { methods: {
handleClose() { handleClose() {
if(this.isEdit || this.isAdd) { if (this.isEdit || this.isAdd) {
this.$refs.editForm.resetData(); this.$refs.editForm.resetData();
this.$refs.editForm.activeName = 'detail'; this.$refs.editForm.activeName = 'detail';
}else{ } else {
this.$refs.merInfo.activeName = 'detail'; this.$refs.merInfo.activeName = 'detail';
} }
this.$emit('closeDrawer'); this.$emit('closeDrawer');
@ -162,23 +133,23 @@ export default {
this.loading = false; this.loading = false;
this.drawer = true; this.drawer = true;
this.merData = res.data; this.merData = res.data;
if(!this.isEdit)this.$refs.merInfo.onOperateLog(this.merId); if (!this.isEdit) this.$refs.merInfo.onOperateLog(this.merId);
}) })
.catch((res) => { .catch((res) => {
this.$message.error(res.message); this.$message.error(res.message);
}); });
}, },
initData(){ initData() {
this.merData = { this.merData = {
is_trader:0 is_trader: 0
} }
this.isEdit = false; this.isEdit = false;
this.isAdd = true; this.isAdd = true;
this.loading = false; this.loading = false;
}, },
merEdit(){ merEdit() {
this.isEdit = true; this.isEdit = true;
this.$nextTick(()=>{ this.$nextTick(() => {
this.getInfo(this.merId); this.getInfo(this.merId);
}) })
}, },
@ -186,29 +157,29 @@ export default {
this.isEdit = false this.isEdit = false
}, },
// 编辑成功回调 // 编辑成功回调
editSuccess(){ editSuccess() {
if(this.isAdd){ if (this.isAdd) {
this.handleClose(); this.handleClose();
}else{ } else {
this.isEdit = false; this.isEdit = false;
} }
this.$emit('getList') this.$emit('getList')
}, },
// 修改采集商品次数 // 修改采集商品次数
modifyCopy(){ modifyCopy() {
this.$emit('handleTimes',this.merId); this.$emit('handleTimes', this.merId);
}, },
//下拉 //下拉
handleCommand() { handleCommand() {
this.$emit('onPassword',this.merId); this.$emit('onPassword', this.merId);
}, },
saveInfo(){ saveInfo() {
this.$refs.editForm.onSubmit(this.merId); this.$refs.editForm.onSubmit(this.merId);
setTimeout(()=>{ setTimeout(() => {
this.getInfo(this.merId); this.getInfo(this.merId);
},500) }, 500)
}, },
submitInfo(){ submitInfo() {
this.$refs.editForm.handleCreate(); this.$refs.editForm.handleCreate();
} }
}, },
@ -217,13 +188,16 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.head { .head {
padding: 20px 35px; padding: 20px 35px;
.full { .full {
display: flex; display: flex;
align-items: center; align-items: center;
.order_icon { .order_icon {
width: 60px; width: 60px;
height: 60px; height: 60px;
} }
.text { .text {
align-self: center; align-self: center;
flex: 1; flex: 1;
@ -231,6 +205,7 @@ export default {
padding-left: 12px; padding-left: 12px;
font-size: 13px; font-size: 13px;
color: #606266; color: #606266;
.title { .title {
margin-bottom: 10px; margin-bottom: 10px;
font-weight: 500; font-weight: 500;
@ -240,21 +215,25 @@ export default {
} }
} }
} }
.bold{
.bold {
font-weight: bold; font-weight: bold;
} }
.list { .list {
display: flex; display: flex;
margin-top: 20px; margin-top: 20px;
overflow: hidden; overflow: hidden;
list-style: none; list-style: none;
padding: 0; padding: 0;
.item { .item {
flex: none; flex: none;
width: 200px; width: 200px;
font-size: 14px; font-size: 14px;
line-height: 14px; line-height: 14px;
color: rgba(0, 0, 0, 0.85); color: rgba(0, 0, 0, 0.85);
.title { .title {
margin-bottom: 12px; margin-bottom: 12px;
font-size: 13px; font-size: 13px;
@ -264,13 +243,16 @@ export default {
} }
} }
} }
.el-tabs--border-card { .el-tabs--border-card {
box-shadow: none; box-shadow: none;
border-bottom: none; border-bottom: none;
} }
.section { .section {
padding: 20px 0 8px; padding: 20px 0 8px;
border-bottom: 1px dashed #eeeeee; border-bottom: 1px dashed #eeeeee;
.title { .title {
padding-left: 10px; padding-left: 10px;
border-left: 3px solid var(--prev-color-primary); border-left: 3px solid var(--prev-color-primary);
@ -278,12 +260,14 @@ export default {
line-height: 15px; line-height: 15px;
color: #303133; color: #303133;
} }
.list { .list {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
list-style: none; list-style: none;
padding: 0; padding: 0;
} }
.item { .item {
flex: 0 0 calc(100% / 2); flex: 0 0 calc(100% / 2);
display: flex; display: flex;
@ -295,12 +279,15 @@ export default {
padding-right: 20px; padding-right: 20px;
padding-left: 20px; padding-left: 20px;
} }
&:nth-child(2n) { &:nth-child(2n) {
padding-right: 20px; padding-right: 20px;
} }
} }
.value { .value {
flex: 1; flex: 1;
image { image {
display: inline-block; display: inline-block;
width: 40px; width: 40px;
@ -310,22 +297,27 @@ export default {
} }
} }
} }
.tab { .tab {
display: flex; display: flex;
align-items: center; align-items: center;
.el-image { .el-image {
width: 36px; width: 36px;
height: 36px; height: 36px;
margin-right: 10px; margin-right: 10px;
} }
} }
::v-deep .el-drawer__body { ::v-deep .el-drawer__body {
overflow: auto; overflow: auto;
} }
.gary { .gary {
color: #aaa; color: #aaa;
} }
.footer{
.footer {
width: 100%; width: 100%;
text-align: center; text-align: center;
position: absolute; position: absolute;

407
src/views/merchant/list/handle/merEditForm.vue
View File

@ -1,12 +1,6 @@
<template> <template>
<el-form <el-form ref="merDataField" size="small" :rules="ruleValidate" :model="merData" label-width="120px"
ref="merDataField" @submit.native.prevent>
size="small"
:rules="ruleValidate"
:model="merData"
label-width="120px"
@submit.native.prevent
>
<el-tabs v-loading="loading" type="border-card" v-model="activeName"> <el-tabs v-loading="loading" type="border-card" v-model="activeName">
<el-tab-pane label="基本信息" name="detail"> <el-tab-pane label="基本信息" name="detail">
<div class="section"> <div class="section">
@ -14,48 +8,26 @@
<el-row :gutter="24" class="mt20"> <el-row :gutter="24" class="mt20">
<el-col :span="12"> <el-col :span="12">
<el-form-item label="商户名称：" prop="mer_name"> <el-form-item label="商户名称：" prop="mer_name">
<el-input <el-input size="small" v-model="merData.mer_name" placeholder="请填写商户名称" class="selWidth" />
size="small"
v-model="merData.mer_name"
placeholder="请填写商户名称"
class="selWidth"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="商户地址：" prop="mer_address"> <el-form-item label="商户地址：" prop="mer_address">
<el-input <el-input size="small" v-model="merData.mer_address" placeholder="请填写详细地址" class="selWidth" />
size="small"
v-model="merData.mer_address"
placeholder="请填写详细地址"
class="selWidth"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="商户分类：" prop="category_id"> <el-form-item label="商户分类：" prop="category_id">
<el-select <el-select size="small" v-model="merData.category_id" placeholder="请选择" class="selWidth">
size="small" <el-option v-for="item in merCateList" :key="item.value" :label="item.label" :value="item.value" />
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-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="商户类型：" prop="is_trader"> <el-form-item label="商户类型：" prop="is_trader">
<el-radio-group <el-radio-group v-model="merData.is_trader">
v-model="merData.is_trader"
>
<el-radio :label="1" class="radio">自营</el-radio> <el-radio :label="1" class="radio">自营</el-radio>
<el-radio :label="0">非自营</el-radio> <el-radio :label="0">非自营</el-radio>
</el-radio-group> </el-radio-group>
@ -65,68 +37,66 @@
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="店铺类型：" prop="type_id"> <el-form-item label="店铺类型：" prop="type_id">
<el-select <el-select size="small" v-model="merData.type_id" placeholder="请选择" class="selWidth">
size="small" <el-option v-for="item in storeType" :key="item.value" :label="item.label" :value="item.value" />
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-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="推荐商户：" prop="is_best"> <el-form-item label="推荐商户：" prop="is_best">
<el-switch <el-switch v-model="merData.is_best" :active-value="1" :inactive-value="0" :width="50" active-text="是"
v-model="merData.is_best" inactive-text="否" />
:active-value="1"
:inactive-value="0"
:width="50"
active-text="是"
inactive-text="否"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="排序：" prop="sort"> <el-form-item label="排序：" prop="sort">
<el-input-number <el-input-number size="small" v-model="merData.sort" controls-position="right" placeholder="请输入排序" />
size="small"
v-model="merData.sort"
controls-position="right"
placeholder="请输入排序"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="商户状态：" prop="status"> <el-form-item label="商户状态：" prop="status">
<el-switch <el-switch v-model="merData.status" :active-value="1" :inactive-value="0" :width="55" active-text="开启"
v-model="merData.status" inactive-text="关闭" />
:active-value="1"
:inactive-value="0"
:width="55"
active-text="开启"
inactive-text="关闭"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row>
<el-col>
<el-form-item label="店铺商圈：">
<el-select v-model="merData.city_id" placeholder="请选择城市" class="selWidth"
@change="cityChange($event, 1)" style="width:150px;" v-if="cityList && cityList.length > 0">
<el-option v-for="(item, indx) in cityList" :key="indx" :value="Number(item.code)"
:label="item.name" />
</el-select>
<el-select v-model="merData.area_id" placeholder="请选择区县" class="selWidth"
@change="cityChange($event, 2)" style="width:150px;" v-if="areaList && areaList.length > 0">
<el-option v-for="(item, indx) in areaList" :key="indx" :value="Number(item.code)"
:label="item.name" />
</el-select>
<el-select v-model="merData.street_id" placeholder="请选择街道" class="selWidth"
@change="cityChange($event, 3)" style="width:150px;" v-if="streetList && streetList.length > 0">
<el-option v-for="(item, indx) in streetList" :key="indx" :value="Number(item.code)"
:label="item.name" />
</el-select>
<el-select v-model="merData.village_id" placeholder="请选择社区" class="selWidth"
@change="cityChange($event, 4)" style="width:150px;" v-if="villageList && villageList.length > 0">
<el-option v-for="(item, indx) in villageList" :key="indx" :value="Number(item.id)"
:label="item.name" />
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="备注：" prop="mark"> <el-form-item label="备注：" prop="mark">
<el-input <el-input type="textarea" size="small" v-model="merData.mark" placeholder="请填写备注" class="selWidth" />
type="textarea"
size="small"
v-model="merData.mark"
placeholder="请填写备注"
class="selWidth"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
@ -138,37 +108,26 @@
<el-row :gutter="24" class="mt20"> <el-row :gutter="24" class="mt20">
<el-col v-if="!isAdd" :span="24"> <el-col v-if="!isAdd" :span="24">
<el-form-item label="店铺保证金：" prop="ot_margin"> <el-form-item label="店铺保证金：" prop="ot_margin">
<span>{{merData.is_margin == 0 ? '无' : merData.ot_margin+'元'}}</span> <span>{{ merData.is_margin == 0 ? '无' : merData.ot_margin + '元' }}</span>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col v-if="!isAdd && merData.is_margin != 0" :span="24"> <el-col v-if="!isAdd && merData.is_margin != 0" :span="24">
<el-form-item label="保证金支付状态："> <el-form-item label="保证金支付状态：">
<span>{{merData.is_margin == 1 ? '待缴' : merData.is_margin == 0 ? '无' : '已缴' }}</span> <span>{{ merData.is_margin == 1 ? '待缴' : merData.is_margin == 0 ? '无' : '已缴' }}</span>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col v-if="!isAdd && merData.is_margin != 0" :span="24"> <el-col v-if="!isAdd && merData.is_margin != 0" :span="24">
<el-form-item label="保证金余额："> <el-form-item label="保证金余额：">
<span>{{merData.margin}}</span> <span>{{ merData.margin }}</span>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="24"> <el-col :span="24">
<el-form-item label="手续费设置：" prop="commission_rate"> <el-form-item label="手续费设置：" prop="commission_rate">
<el-switch <el-switch v-model="merData.commission_switch" :active-value="1" :inactive-value="0" :width="55"
v-model="merData.commission_switch" active-text="开启" inactive-text="关闭" />
:active-value="1"
:inactive-value="0"
:width="55"
active-text="开启"
inactive-text="关闭"
/>
<span v-if="merData.commission_switch"> <span v-if="merData.commission_switch">
<el-input-number <el-input-number :min="0" v-model="merData.commission_rate" size="small" controls-position="right"
:min="0" placeholder="请输入手续费" />%
v-model="merData.commission_rate"
size="small"
controls-position="right"
placeholder="请输入手续费"
/>%
</span> </span>
<div class="info info-red">(注：此处如未设置手续费，系统会自动读取商户分类下对应手续费；此处已设置，则优先以此处设置为准)</div> <div class="info info-red">(注：此处如未设置手续费，系统会自动读取商户分类下对应手续费；此处已设置，则优先以此处设置为准)</div>
</el-form-item> </el-form-item>
@ -177,44 +136,26 @@
</div> </div>
<div class="section"> <div class="section">
<div class="title">审核信息</div> <div class="title">审核信息</div>
<el-row :gutter="24" class="mt20"> <el-row :gutter="24" class="mt20">
<el-col :span="8"> <el-col :span="8">
<el-form-item label="商品审核：" prop="is_audit"> <el-form-item label="商品审核：" prop="is_audit">
<el-switch <el-switch v-model="merData.is_audit" :active-value="1" :inactive-value="0" :width="50" active-text="是"
v-model="merData.is_audit" inactive-text="否" />
:active-value="1"
:inactive-value="0"
:width="50"
active-text="是"
inactive-text="否"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<el-form-item label="直播间审核：" prop="is_bro_room"> <el-form-item label="直播间审核：" prop="is_bro_room">
<el-switch <el-switch v-model="merData.is_bro_room" :active-value="1" :inactive-value="0" :width="50"
v-model="merData.is_bro_room" active-text="是" inactive-text="否" />
:active-value="1"
:inactive-value="0"
:width="50"
active-text="是"
inactive-text="否"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<el-form-item label="直播商品：" prop="is_bro_goods"> <el-form-item label="直播商品：" prop="is_bro_goods">
<el-switch <el-switch v-model="merData.is_bro_goods" :active-value="1" :inactive-value="0" :width="50"
v-model="merData.is_bro_goods" active-text="是" inactive-text="否" />
:active-value="1"
:inactive-value="0"
:width="50"
active-text="是"
inactive-text="否"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
</div> </div>
<div class="section"> <div class="section">
<div class="title">其他信息</div> <div class="title">其他信息</div>
@ -222,97 +163,65 @@
<el-row :gutter="24"> <el-row :gutter="24">
<el-col :span="12"> <el-col :span="12">
<el-form-item label="商户关键字：" prop="mer_keyword"> <el-form-item label="商户关键字：" prop="mer_keyword">
<el-input <el-input size="small" v-model="merData.mer_keyword" placeholder="请填写商户关键字" class="selWidth" />
size="small"
v-model="merData.mer_keyword"
placeholder="请填写商户关键字"
class="selWidth"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row v-if="!isAdd" :gutter="24"> <el-row v-if="!isAdd" :gutter="24">
<el-col :span="12" style="position: relative;"> <el-col :span="12" style="position: relative;">
<el-form-item label="商品采集数："> <el-form-item label="商品采集数：">
<el-input v-model="merData.copy_product_num" size="small" disabled ></el-input> <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-button type="text" @click="modifyCopy"
</el-form-item> style="margin-left: 10px;position:absolute;right: -30px;">修改</el-button>
</el-col> </el-form-item>
</el-row> </el-col>
</el-row>
</div> </div>
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="账号信息" name="account"> <el-tab-pane label="账号信息" name="account">
<div class="section"> <div class="section">
<div class="title">登录账号</div> <div class="title">登录账号</div>
<el-row :gutter="24" class="mt20"> <el-row :gutter="24" class="mt20">
<el-col :span="12"> <el-col :span="12">
<el-form-item label="商户账号：" prop="mer_account"> <el-form-item label="商户账号：" prop="mer_account">
<el-input <el-input type="text" size="small" v-model="merData.mer_account" :disabled="!isAdd" class="selWidth" />
type="text"
size="small"
v-model="merData.mer_account"
:disabled="!isAdd"
class="selWidth"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="登陆密码：" prop="mer_password"> <el-form-item label="登陆密码：" prop="mer_password">
<el-input <el-input type="password" size="small" v-model="merData.mer_password" :disabled="!isAdd"
type="password" class="selWidth" />
size="small"
v-model="merData.mer_password"
:disabled="!isAdd"
class="selWidth"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col v-if="!isAdd" :span="12"> <el-col v-if="!isAdd" :span="12">
<el-form-item label="联系人：" prop="real_name"> <el-form-item label="联系人：" prop="real_name">
<el-input <el-input type="text" size="small" placeholder="请填写联系人" v-model="merData.real_name" class="selWidth" />
type="text"
size="small"
placeholder="请填写联系人"
v-model="merData.real_name"
class="selWidth"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="联系电话：" prop="mer_phone"> <el-form-item label="联系电话：" prop="mer_phone">
<el-input <el-input size="small" placeholder="请填写联系电话" v-model="merData.mer_phone" class="selWidth" />
size="small"
placeholder="请填写联系电话"
v-model="merData.mer_phone"
class="selWidth"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
</div> </div>
<div class="section"> <div class="section">
<div class="title">财务帐号</div> <div class="title">财务帐号</div>
<el-row :gutter="24" class="mt20"> <el-row :gutter="24" class="mt20">
<el-col :span="12"> <el-col :span="12">
<el-form-item label="分账商户号：" prop="sub_mchid"> <el-form-item label="分账商户号：" prop="sub_mchid">
<el-input <el-input placeholder="请填写分账商户号" size="small" v-model="merData.sub_mchid" class="selWidth" />
placeholder="请填写分账商户号"
size="small"
v-model="merData.sub_mchid"
class="selWidth"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="24"> <el-col :span="24">
<div class="info-red" style="margin-left: 120px;">当开启自动分账时，每个子商户在微信后台的分账商户号，即特约子商户号</div> <div class="info-red" style="margin-left: 120px;">当开启自动分账时，每个子商户在微信后台的分账商户号，即特约子商户号</div>
</el-col> </el-col>
</el-row> </el-row>
</div> </div>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
</el-form> </el-form>
</template> </template>
<script> <script>
// +---------------------------------------------------------------------- // +----------------------------------------------------------------------
@ -325,6 +234,12 @@
// | Author: CRMEB Team <admin@crmeb.com> // | Author: CRMEB Team <admin@crmeb.com>
// +---------------------------------------------------------------------- // +----------------------------------------------------------------------
import { merchantUpdate, merchantCreate } from "@/api/merchant"; import { merchantUpdate, merchantCreate } from "@/api/merchant";
import {
get_area,
get_stree,
get_village,
get_city
} from "@/api/shoplist";
export default { export default {
props: { props: {
merData: { merData: {
@ -374,43 +289,119 @@ export default {
], ],
mer_phone: [{ required: true, validator: validatePhone, trigger: 'blur' }], mer_phone: [{ required: true, validator: validatePhone, trigger: 'blur' }],
}, },
cityList: [],
areaList: [],
streetList: [],
villageList: []
}; };
}, },
filters: { watch: {
// 'merData.area_id'(newVal, oldVal) {
// if (this.merData.area_id && this.merData.city_id && this.merData.village_id) {
// this.$nextTick(() => {
// this.getCity(this.merData.city_id, this.merData.area_id, this.merData.street_id);
// this.$forceUpdate();
// })
// }
// }
}, },
mounted() { mounted() {
setTimeout(() => {
this.getCity(this.merData.city_id, this.merData.area_id, this.merData.street_id);
this.$forceUpdate();
}, 200);
}, },
methods: { methods: {
//获取商圈
getCity(cityCode, areaCode, streetCode) {
get_city().then(res => {
this.cityList = res.data;
this.getArea(cityCode, areaCode, streetCode);
});
},
// 获取区县
getArea(cityCode, areaCode, streetCode) {
get_area({ city_code: cityCode }).then(res => {
this.areaList = res.data;
this.getStreet(areaCode, streetCode);
})
},
// 获取街道
getStreet(areaCode, streetCode) {
get_stree({ area_code: areaCode }).then(res => {
this.streetList = res.data;
this.getVillage(streetCode);
})
},
// 获取社区
getVillage(street_code) {
get_village({ street_code }).then(res => {
this.villageList = res.data;
})
},
// 城市 1城市 2区县 3街道 4社区
cityChange(code, type) {
if (type == 1) {
this.getArea(code);
this.merData.area_id = "";
this.merData.street_id = "";
this.merData.village_id = "";
this.areaList = [];
this.streetList = [];
this.villageList = [];
}
if (type == 2) {
this.getStreet(code);
this.merData.street_id = "";
this.merData.village_id = "";
this.streetList = [];
this.villageList = [];
}
if (type == 3) {
this.getVillage(code);
this.merData.village_id = "";
this.villageList = [];
}
this.$forceUpdate();
},
/**修改采集次数 */ /**修改采集次数 */
modifyCopy() { modifyCopy() {
this.$emit('modifyCopy') this.$emit('modifyCopy')
}, },
/**重置表单数据 */ /**重置表单数据 */
resetData(){ resetData() {
this.$refs.merDataField.resetFields(); this.$refs.merDataField.resetFields();
}, },
/*提交信息*/ /*提交信息*/
onSubmit(id){ onSubmit(id) {
console.log(1)
this.$refs['merDataField'].validate(valid => { this.$refs['merDataField'].validate(valid => {
if (valid) { if (valid) {
this.loading = true; this.loading = true;
merchantUpdate(id,this.merData) merchantUpdate(id, this.merData)
.then(async res => { .then(async res => {
this.$message.success(res.message); this.$message.success(res.message);
this.loading = false; this.loading = false;
this.$emit('success'); this.$emit('success');
}) })
.catch(res => { .catch(res => {
this.loading = false; this.loading = false;
this.$message.error(res.message); this.$message.error(res.message);
}); });
} }
}); });
}, },
/**创建商户 */ /**创建商户 */
handleCreate(){ handleCreate() {
this.$refs['merDataField'].validate((valid) => { this.$refs['merDataField'].validate((valid) => {
if (valid) { if (valid) {
merchantCreate(this.merData) merchantCreate(this.merData)
@ -422,11 +413,11 @@ export default {
this.$message.error(res.message); this.$message.error(res.message);
}); });
} else { } else {
if(!this.merData.mer_name)return this.$message.error('请填写基本信息-商户名称'); if (!this.merData.mer_name) return this.$message.error('请填写基本信息-商户名称');
if(!this.merData.category_id)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.type_id) return this.$message.error('请选择基本信息-店铺类型');
if(!this.merData.mer_account)return this.$message.error('请填写账号信息-商户账号'); if (!this.merData.mer_account) return this.$message.error('请填写账号信息-商户账号');
if(!this.merData.mer_phone)return this.$message.error('请填写账号信息-联系电话'); if (!this.merData.mer_phone) return this.$message.error('请填写账号信息-联系电话');
} }
}); });
} }
@ -438,9 +429,11 @@ export default {
box-shadow: none; box-shadow: none;
border-bottom: none; border-bottom: none;
} }
.section { .section {
padding: 20px 0 8px; padding: 20px 0 8px;
border-bottom: 1px dashed #eeeeee; border-bottom: 1px dashed #eeeeee;
.title { .title {
padding-left: 10px; padding-left: 10px;
border-left: 3px solid var(--prev-color-primary); border-left: 3px solid var(--prev-color-primary);
@ -448,12 +441,14 @@ export default {
line-height: 15px; line-height: 15px;
color: #303133; color: #303133;
} }
.list { .list {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
list-style: none; list-style: none;
padding: 0; padding: 0;
} }
.item { .item {
flex: 0 0 calc(100% / 2); flex: 0 0 calc(100% / 2);
display: flex; display: flex;
@ -465,12 +460,15 @@ export default {
padding-right: 20px; padding-right: 20px;
padding-left: 20px; padding-left: 20px;
} }
&:nth-child(2n) { &:nth-child(2n) {
padding-right: 20px; padding-right: 20px;
} }
} }
.value { .value {
flex: 1; flex: 1;
image { image {
display: inline-block; display: inline-block;
width: 40px; width: 40px;
@ -480,32 +478,37 @@ export default {
} }
} }
} }
.info-red{
.info-red {
color: red; color: red;
font-size: 12px; font-size: 12px;
} }
::v-deep .el-input-number.is-controls-right .el-input__inner{
padding: 0 40px 0 10px; ::v-deep .el-input-number.is-controls-right .el-input__inner {
padding: 0 40px 0 10px;
} }
::v-deep .el-form-item__label{
::v-deep .el-form-item__label {
font-weight: normal; font-weight: normal;
color: #282828; color: #282828;
} }
.tab { .tab {
display: flex; display: flex;
align-items: center; align-items: center;
.el-image { .el-image {
width: 36px; width: 36px;
height: 36px; height: 36px;
margin-right: 10px; margin-right: 10px;
} }
} }
::v-deep .el-drawer__body { ::v-deep .el-drawer__body {
overflow: auto; overflow: auto;
} }
.gary { .gary {
color: #aaa; color: #aaa;
} }
</style> </style>

159
src/views/merchant/type/typeEditForm.vue
View File

@ -1,12 +1,6 @@
<template> <template>
<el-form <el-form ref="formValidate" size="small" :rules="ruleValidate" :model="formValidate" label-width="120px"
ref="formValidate" @submit.native.prevent>
size="small"
:rules="ruleValidate"
:model="formValidate"
label-width="120px"
@submit.native.prevent
>
<el-tabs v-loading="loading" type="border-card" v-model="name"> <el-tabs v-loading="loading" type="border-card" v-model="name">
<el-tab-pane label="基本信息" name="basic"> <el-tab-pane label="基本信息" name="basic">
<div class="section"> <div class="section">
@ -14,11 +8,7 @@
<el-row class="mt20"> <el-row class="mt20">
<el-col :span="12"> <el-col :span="12">
<el-form-item label="店铺类型名称：" prop="type_name"> <el-form-item label="店铺类型名称：" prop="type_name">
<el-input <el-input v-model="formValidate.type_name" placeholder="请填写店铺类型名称" class="selWidth" />
v-model="formValidate.type_name"
placeholder="请填写店铺类型名称"
class="selWidth"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
@ -28,98 +18,101 @@
<el-radio :label="1">有</el-radio> <el-radio :label="1">有</el-radio>
</el-radio-group> </el-radio-group>
<span v-if="formValidate.is_margin == 1"> <span v-if="formValidate.is_margin == 1">
<el-input <el-input v-model="formValidate.margin" placeholder="请填写保证金" style="width:120px;margin-left: 8px;" />
v-model="formValidate.margin" 元
placeholder="请填写保证金"
style="width:120px;margin-left: 8px;"
/> 元
</span> </span>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="店铺类型要求："> <el-form-item label="商家申请类型：" prop="is_allow_apply">
<el-input <el-select v-model="formValidate.is_allow_apply" placeholder="请选择商家申请类型">
v-model="formValidate.type_info" <el-option label="是" value="1"></el-option>
type="textarea" <el-option label="否" value="0"></el-option>
:rows="3" </el-select>
placeholder="请填写店铺类型要求"
class="selWidth"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="其他说明："> <el-form-item label="搜索商家：" prop="is_search_display">
<el-input <el-select v-model="formValidate.is_search_display" placeholder="请选择搜索商家是否展示">
v-model="formValidate.description" <el-option label="是" value="1"></el-option>
type="textarea" <el-option label="否" value="0"></el-option>
:rows="3" </el-select>
placeholder="请填写其他说明"
class="selWidth"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="12">
<el-form-item label="自动扣除保证金比例" prop="commission_rate">
<el-input type="number" v-model="formValidate.auto_margin_rate" style="width: 200px"
autocomplete="off"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="店铺类型要求：">
<el-input v-model="formValidate.type_info" type="textarea" :rows="3" placeholder="请填写店铺类型要求"
class="selWidth" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="其他说明：">
<el-input v-model="formValidate.description" type="textarea" :rows="3" placeholder="请填写其他说明"
class="selWidth" />
</el-form-item>
</el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="备注："> <el-form-item label="备注：">
<el-input <el-input v-model="formValidate.mark" type="textarea" :rows="3" placeholder="请填写备注" class="selWidth" />
v-model="formValidate.mark"
type="textarea"
:rows="3"
placeholder="请填写备注"
class="selWidth"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col v-if="!create" :span="24"> <el-col v-if="!create" :span="24">
<el-form-item label="已有店铺数量："> <el-form-item label="已有店铺数量：">
<span>{{formValidate.merchant_count}}</span> <span>{{ formValidate.merchant_count }}</span>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col v-if="!create" :span="24"> <el-col v-if="!create" :span="24">
<el-form-item label="创建时间："> <el-form-item label="创建时间：">
<span>{{formValidate.create_time}}</span> <span>{{ formValidate.create_time }}</span>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col v-if="!create" :span="24"> <el-col v-if="!create" :span="24">
<el-form-item label="最新修改时间："> <el-form-item label="最新修改时间：">
<span>{{formValidate.update_time}}</span> <span>{{ formValidate.update_time }}</span>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="权限信息" name="permission"> <el-tab-pane label="权限信息" name="permission">
<div class="section"> <div class="section">
<div class="title">权限管理</div> <div class="title">权限管理</div>
<el-form-item prop="auth"> <el-form-item prop="auth">
<el-tree <el-tree ref="tree" :data="permissions" show-checkbox node-key="value"
ref="tree"
:data="permissions"
show-checkbox
node-key="value"
:default-checked-keys="formValidate.auth || []" :default-checked-keys="formValidate.auth || []"
@hook:mounted="$refs.tree.setCheckedKeys(formValidate.auth || [])" @hook:mounted="$refs.tree.setCheckedKeys(formValidate.auth || [])" @check="
@check=" [
[ (formValidate.auth = $refs.tree.getCheckedKeys()),
(formValidate.auth = $refs.tree.getCheckedKeys()), $refs.formValidate.validateField('auth'),
$refs.formValidate.validateField('auth'), ]
] "></el-tree>
"
></el-tree>
</el-form-item> </el-form-item>
</div> </div>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
</el-form> </el-form>
</template> </template>
<script> <script>
@ -132,7 +125,7 @@
// +---------------------------------------------------------------------- // +----------------------------------------------------------------------
// | Author: CRMEB Team <admin@crmeb.com> // | Author: CRMEB Team <admin@crmeb.com>
// +---------------------------------------------------------------------- // +----------------------------------------------------------------------
import { storeTypeUpdateApi, storeTypeCreateApi } from "@/api/merchant"; import { storeTypeUpdateApi, storeTypeCreateApi } from "@/api/merchant";
export default { export default {
props: { props: {
formValidate: { formValidate: {
@ -176,7 +169,7 @@ export default {
}, },
methods: { methods: {
/*提交信息*/ /*提交信息*/
onSubmit(id){ onSubmit(id) {
this.$refs['formValidate'].validate(valid => { this.$refs['formValidate'].validate(valid => {
if (valid) { if (valid) {
this.loading = true; this.loading = true;
@ -194,11 +187,11 @@ export default {
}); });
}, },
/**重置表单验证 */ /**重置表单验证 */
resetForm(){ resetForm() {
this.$refs.formValidate.resetFields(); this.$refs.formValidate.resetFields();
}, },
/**添加类型初始化 */ /**添加类型初始化 */
addType(){ addType() {
this.loading = false; this.loading = false;
}, },
/**编辑初始化 */ /**编辑初始化 */
@ -207,10 +200,10 @@ export default {
this.setChecked(); this.setChecked();
}, },
/**根据返回数据选中权限 */ /**根据返回数据选中权限 */
setChecked(){ setChecked() {
this.$refs.tree && this.$refs.tree.setCheckedKeys(this.formValidate.auth); this.$refs.tree && this.$refs.tree.setCheckedKeys(this.formValidate.auth);
}, },
handleCreateType(name){ handleCreateType(name) {
this.$refs[name].validate((valid) => { this.$refs[name].validate((valid) => {
if (valid) { if (valid) {
storeTypeCreateApi(this.formValidate) storeTypeCreateApi(this.formValidate)
@ -235,9 +228,11 @@ export default {
box-shadow: none; box-shadow: none;
border-bottom: none; border-bottom: none;
} }
.section { .section {
padding: 20px 0 8px; padding: 20px 0 8px;
border-bottom: 1px dashed #eeeeee; border-bottom: 1px dashed #eeeeee;
.title { .title {
padding-left: 10px; padding-left: 10px;
border-left: 3px solid var(--prev-color-primary); border-left: 3px solid var(--prev-color-primary);
@ -245,12 +240,14 @@ export default {
line-height: 15px; line-height: 15px;
color: #303133; color: #303133;
} }
.list { .list {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
list-style: none; list-style: none;
padding: 0; padding: 0;
} }
.item { .item {
flex: 0 0 calc(100% / 2); flex: 0 0 calc(100% / 2);
display: flex; display: flex;
@ -262,12 +259,15 @@ export default {
padding-right: 20px; padding-right: 20px;
padding-left: 20px; padding-left: 20px;
} }
&:nth-child(2n) { &:nth-child(2n) {
padding-right: 20px; padding-right: 20px;
} }
} }
.value { .value {
flex: 1; flex: 1;
image { image {
display: inline-block; display: inline-block;
width: 40px; width: 40px;
@ -277,32 +277,37 @@ export default {
} }
} }
} }
.info-red{
.info-red {
color: red; color: red;
font-size: 12px; font-size: 12px;
} }
::v-deep .el-input-number.is-controls-right .el-input__inner{
padding: 0 40px 0 10px; ::v-deep .el-input-number.is-controls-right .el-input__inner {
padding: 0 40px 0 10px;
} }
::v-deep .el-form-item__label{
::v-deep .el-form-item__label {
font-weight: normal; font-weight: normal;
color: #282828; color: #282828;
} }
.tab { .tab {
display: flex; display: flex;
align-items: center; align-items: center;
.el-image { .el-image {
width: 36px; width: 36px;
height: 36px; height: 36px;
margin-right: 10px; margin-right: 10px;
} }
} }
::v-deep .el-drawer__body { ::v-deep .el-drawer__body {
overflow: auto; overflow: auto;
} }
.gary { .gary {
color: #aaa; color: #aaa;
} }
</style> </style>

56
src/views/merchant/type/typeInfo.vue
View File

@ -7,32 +7,48 @@
<li class="item"> <li class="item">
<div>店铺类型名称：</div> <div>店铺类型名称：</div>
<div class="value"> <div class="value">
{{typeData.type_name}} {{ typeData.type_name }}
</div> </div>
</li> </li>
<li class="item"> <li class="item">
<div>店铺保证金：</div> <div>店铺保证金：</div>
<div class="value">{{typeData.is_margin ? typeData.margin+'元' : '无'}}</div> <div class="value">{{ typeData.is_margin ? typeData.margin + '元' : '无' }}</div>
</li> </li>
<li class="item">
<div>自动扣除保证金比例：</div>
<div class="value">{{ typeData.auto_margin_rate }}</div>
</li>
<li class="item"> <li class="item">
<div>店铺类型要求：</div> <div>店铺类型要求：</div>
<div class="value">{{typeData.type_info}}</div> <div class="value">{{ typeData.type_info }}</div>
</li>
<li class="item">
<div>商户类型是否隐藏：</div>
<div class="value">{{ typeData.is_allow_apply == 1 ? '是' : '否' }}</div>
</li> </li>
<li class="item">
<div>是否搜索商家：</div>
<div class="value">{{ typeData.is_search_displayy == 1 ? '是' : '否' }}</div>
</li>
<li class="item"> <li class="item">
<div>已有店铺数量：</div> <div>已有店铺数量：</div>
<div class="value">{{typeData.merchant_count}}</div> <div class="value">{{ typeData.merchant_count }}</div>
</li> </li>
<li class="item"> <li class="item">
<div>其他说明：</div> <div>其他说明：</div>
<div class="value">{{typeData.description || "无"}}</div> <div class="value">{{ typeData.description || "无" }}</div>
</li> </li>
<li class="item"> <li class="item">
<div>创建时间：</div> <div>创建时间：</div>
<div class="value">{{typeData.create_time}}</div> <div class="value">{{ typeData.create_time }}</div>
</li> </li>
<li class="item"> <li class="item">
<div>最新修改时间：</div> <div>最新修改时间：</div>
<div class="value">{{typeData.update_time}}</div> <div class="value">{{ typeData.update_time }}</div>
</li> </li>
</ul> </ul>
</div> </div>
@ -44,11 +60,7 @@
<li class="item"> <li class="item">
<div>权限范围：</div> <div>权限范围：</div>
<div class="value"> <div class="value">
<el-tree <el-tree ref="treeDetail" :data="typeData.options" :props="{ label: 'title' }"></el-tree>
ref="treeDetail"
:data="typeData.options"
:props="{ label: 'title' }"
></el-tree>
</div> </div>
</li> </li>
</ul> </ul>
@ -98,9 +110,11 @@ export default {
box-shadow: none; box-shadow: none;
border-bottom: none; border-bottom: none;
} }
.section { .section {
padding: 20px 0 8px; padding: 20px 0 8px;
border-bottom: 1px dashed #eeeeee; border-bottom: 1px dashed #eeeeee;
.title { .title {
padding-left: 10px; padding-left: 10px;
border-left: 3px solid var(--prev-color-primary); border-left: 3px solid var(--prev-color-primary);
@ -108,6 +122,7 @@ export default {
line-height: 15px; line-height: 15px;
color: #303133; color: #303133;
} }
.list { .list {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
@ -115,27 +130,33 @@ export default {
padding: 0; padding: 0;
margin-top: 5px; margin-top: 5px;
} }
.item { .item {
flex: 0 0 calc(100% / 2); flex: 0 0 calc(100% / 2);
display: flex; display: flex;
margin-top: 16px; margin-top: 16px;
font-size: 13px; font-size: 13px;
color: #606266; color: #606266;
&.item100{
flex: 0 0 calc(100% / 1); &.item100 {
padding-right: 20px; flex: 0 0 calc(100% / 1);
padding-left: 20px; padding-right: 20px;
padding-left: 20px;
} }
&:nth-child(2n + 1) { &:nth-child(2n + 1) {
padding-right: 20px; padding-right: 20px;
padding-left: 20px; padding-left: 20px;
} }
&:nth-child(2n) { &:nth-child(2n) {
padding-right: 20px; padding-right: 20px;
} }
} }
.value { .value {
flex: 1; flex: 1;
image { image {
display: inline-block; display: inline-block;
width: 40px; width: 40px;
@ -145,6 +166,7 @@ export default {
} }
} }
} }
::v-deep .el-drawer__body { ::v-deep .el-drawer__body {
overflow: auto; overflow: auto;
} }