From 5ffd91762a85913e9bcaba09b17ab89073a16be3 Mon Sep 17 00:00:00 2001 From: 1154079537 <1154079537@qq.com> Date: Tue, 30 Apr 2024 17:57:27 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E7=9C=81=E5=B8=82=E5=8C=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/shoplist.js | 10 +- src/views/merchant/application/index.vue | 20 +-- .../merchant/list/handle/merEditForm.vue | 163 +++++++++++------- 3 files changed, 118 insertions(+), 75 deletions(-) diff --git a/src/api/shoplist.js b/src/api/shoplist.js index db7e0c2..86bb404 100644 --- a/src/api/shoplist.js +++ b/src/api/shoplist.js @@ -1,18 +1,22 @@ 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) + +// 省份 +export const get_province = (data) => request.get('api/city/get_province', data) diff --git a/src/views/merchant/application/index.vue b/src/views/merchant/application/index.vue index a5f3837..a8599ed 100644 --- a/src/views/merchant/application/index.vue +++ b/src/views/merchant/application/index.vue @@ -172,8 +172,6 @@ </el-form-item> </el-col> - - <el-col :span="24"> <el-form-item label="资质:"> <div class="demo-image__preview"> @@ -186,7 +184,7 @@ <el-col :span="24"> <el-form-item label="备注:"> - <el-input readony :value="statusAuditForm.mark" /> + <el-input v-mode ="statusAuditForm.mark" /> </el-form-item> </el-col> </el-row> @@ -266,8 +264,6 @@ </el-form-item> </el-col> - - <el-col :span="24"> <el-form-item label="资质:"> <div class="demo-image__preview"> @@ -278,8 +274,6 @@ </el-form-item> </el-col> - - <el-col :span="24"> <el-form-item label="备注:"> <el-input readony :value="statusAuditForm.mark" /> @@ -390,11 +384,11 @@ export default { this.$refs.searchForm.resetFields() this.getList(1) }, - statusChange(tab) { - this.tableFrom.status = tab; - this.tableFrom.page = 1; - this.getList(""); - }, + // statusChange(tab) { + // this.tableFrom.status = tab; + // this.tableFrom.page = 1; + // this.getList(""); + // }, // 具体日期 onchangeTime(e) { this.timeVal = e; @@ -445,7 +439,7 @@ export default { // 修改状态 onchangeIsShow(item) { this.statusAuditVisible = true; - this.statusAuditForm = item; + this.statusAuditForm = Object.assign(this.statusAuditForm,item) this.$set(this.statusAuditForm, 'state', 1); this.$set(this.statusAuditForm, 'create_mer', 1); }, diff --git a/src/views/merchant/list/handle/merEditForm.vue b/src/views/merchant/list/handle/merEditForm.vue index e0fd990..04119a9 100644 --- a/src/views/merchant/list/handle/merEditForm.vue +++ b/src/views/merchant/list/handle/merEditForm.vue @@ -1,6 +1,6 @@ <template> <el-form ref="merDataField" size="small" :rules="ruleValidate" :model="merData" label-width="120px" - @submit.native.prevent> + @submit.native.prevent> <el-tabs v-loading="loading" type="border-card" v-model="activeName"> <el-tab-pane label="基本信息" name="detail"> <div class="section"> @@ -8,12 +8,12 @@ <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-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-input size="small" v-model="merData.mer_address" placeholder="请填写详细地址" class="selWidth"/> </el-form-item> </el-col> </el-row> @@ -21,7 +21,7 @@ <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-option v-for="item in merCateList" :key="item.value" :label="item.label" :value="item.value"/> </el-select> </el-form-item> </el-col> @@ -38,27 +38,28 @@ <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-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="否" /> + 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-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="关闭" /> + inactive-text="关闭"/> </el-form-item> </el-col> </el-row> @@ -66,28 +67,37 @@ <el-row> <el-col> <el-form-item label="店铺商圈:"> + <el-select v-model="merData.province_id" placeholder="请选择省份" class="selWidth" + @change="cityChange($event, 5)" style="width:150px;" + v-if="provinceList && provinceList.length > 0"> + <el-option v-for="(item, indx) in provinceList" :key="indx" :value="Number(item.code)" + :label="item.name"/> + </el-select> + <el-select v-model="merData.city_id" placeholder="请选择城市" class="selWidth" - @change="cityChange($event, 1)" style="width:150px;" v-if="cityList && cityList.length > 0"> + @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" /> + :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"> + @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" /> + :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"> + @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" /> + :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"> + @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" /> + :label="item.name"/> </el-select> </el-form-item> </el-col> @@ -105,7 +115,8 @@ </el-col> <el-col :span="12"> <el-form-item label="备注:" prop="mark"> - <el-input type="textarea" size="small" v-model="merData.mark" placeholder="请填写备注" class="selWidth" /> + <el-input type="textarea" size="small" v-model="merData.mark" placeholder="请填写备注" + class="selWidth"/> </el-form-item> </el-col> </el-row> @@ -133,12 +144,14 @@ <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="关闭" /> + 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="请输入手续费" />% + placeholder="请输入手续费"/>% </span> - <div class="info info-red">(注:此处如未设置手续费,系统会自动读取商户分类下对应手续费;此处已设置,则优先以此处设置为准)</div> + <div class="info info-red"> + (注:此处如未设置手续费,系统会自动读取商户分类下对应手续费;此处已设置,则优先以此处设置为准) + </div> </el-form-item> </el-col> </el-row> @@ -149,19 +162,19 @@ <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="否" /> + 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="否" /> + 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="否" /> + active-text="是" inactive-text="否"/> </el-form-item> </el-col> </el-row> @@ -172,7 +185,7 @@ <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-input size="small" v-model="merData.mer_keyword" placeholder="请填写商户关键字" class="selWidth"/> </el-form-item> </el-col> </el-row> @@ -181,7 +194,8 @@ <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> + style="margin-left: 10px;position:absolute;right: -30px;">修改 + </el-button> </el-form-item> </el-col> </el-row> @@ -194,23 +208,24 @@ <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-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" /> + 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-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-input size="small" placeholder="请填写联系电话" v-model="merData.mer_phone" class="selWidth"/> </el-form-item> </el-col> </el-row> @@ -220,11 +235,13 @@ <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-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> + <div class="info-red" style="margin-left: 120px;"> + 当开启自动分账时,每个子商户在微信后台的分账商户号,即特约子商户号 + </div> </el-col> </el-row> </div> @@ -242,13 +259,15 @@ // +---------------------------------------------------------------------- // | 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 + get_city, + get_province } from "@/api/shoplist"; + export default { props: { merData: { @@ -285,19 +304,20 @@ export default { activeName: 'detail', ruleValidate: { mer_name: [ - { required: true, message: '请输入商户名称', trigger: 'blur' } + {required: true, message: '请输入商户名称', trigger: 'blur'} ], mer_account: [ - { required: true, message: '请输入商户账号', trigger: 'blur' } + {required: true, message: '请输入商户账号', trigger: 'blur'} ], category_id: [ - { required: true, message: '请选择商户分类', trigger: 'change' } + {required: true, message: '请选择商户分类', trigger: 'change'} ], type_id: [ - { required: true, message: '请选择店铺类型', trigger: 'change' } + {required: true, message: '请选择店铺类型', trigger: 'change'} ], - mer_phone: [{ required: true, validator: validatePhone, trigger: 'blur' }], + mer_phone: [{required: true, validator: validatePhone, trigger: 'blur'}], }, + provinceList: [], cityList: [], areaList: [], streetList: [], @@ -316,44 +336,72 @@ export default { }, mounted() { setTimeout(() => { - this.getCity(this.merData.city_id, this.merData.area_id, this.merData.street_id); + this.getProvince(this.merData.province_id, this.merData.city_id, this.merData.area_id, this.merData.street_id); this.$forceUpdate(); }, 200); }, methods: { - //获取商圈 - getCity(cityCode, areaCode, streetCode) { - get_city().then(res => { - this.cityList = res.data; - this.getArea(cityCode, areaCode, streetCode); + // 获取省 + getProvince(provinceCode, cityCode, areaCode, streetCode) { + get_province().then(res => { + this.provinceList = res.data; + this.getCity(provinceCode, cityCode, areaCode, streetCode); }); }, + // 城市 + getCity(provinceCode, cityCode, areaCode, streetCode) { + if (provinceCode) { + get_city({province_code: provinceCode}).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); - }) + if (cityCode) { + 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); - }) + if (areaCode) { + 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; - }) + if (street_code) { + get_village({street_code}).then(res => { + this.villageList = res.data; + }) + } }, // 城市 1城市 2区县 3街道 4社区 cityChange(code, type) { + if (type == 5) { + this.getCity(code); + this.merData.city_id = ""; + this.merData.area_id = ""; + this.merData.street_id = ""; + this.merData.village_id = ""; + this.cityList = []; + this.areaList = []; + this.streetList = []; + this.villageList = []; + } + if (type == 1) { this.getArea(code); this.merData.area_id = ""; @@ -389,9 +437,6 @@ export default { }, /*提交信息*/ onSubmit(id) { - - console.log(1) - this.$refs['merDataField'].validate(valid => { if (valid) { this.loading = true; @@ -520,4 +565,4 @@ export default { .gary { color: #aaa; } -</style> \ No newline at end of file +</style>