czg_team
/
management
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优化店铺信息

This commit is contained in:
gyq 2024-05-14 09:15:31 +08:00
parent 5eb74b5463
commit 055b0a068b
2 changed files with 99 additions and 126 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/views/shop/components/addShop.vue
View File

@ -5,7 +5,7 @@
<el-form-item label="店铺名称" prop="shopName">
<el-input v-model="form.shopName" placeholder="请输入门店名称"></el-input>
</el-form-item>
<el-form-item label="连锁店扩展店名" prop="chainName">
<el-form-item label="连锁店扩展店名">
<el-input v-model="form.chainName" placeholder="请输入连锁店扩展店名"></el-input>
</el-form-item>
<el-form-item label="门店logo" prop="logo">
@ -50,7 +50,7 @@
<el-input-number v-model="form.takeaway_money" placeholder="0.00" controls-position="right"
:min="0"></el-input-number>
</el-form-item> -->
<el-form-item label="店铺经度">
<el-form-item label="店铺经度" prop="provinces">
<el-row>
<el-col :span="9" v-if="form.provinces">
<el-input :value="`${form.provinces}-${form.cities}-${form.districts}`" disabled />
@ -189,11 +189,11 @@ export default {
trigger: 'blur'
}
],
chainName: [
provinces: [
{
required: true,
message: ' ',
trigger: 'blur'
message: '请选择坐标',
trigger: 'change'
}
],
logo: [

215
src/views/shop/components/shopInfo.vue
View File

@ -1,118 +1,76 @@
<template>
<div>
<div>
<el-form
ref="form"
:model="form"
:rules="rules"
label-width="120px"
label-position="left"
>
<el-form ref="form" :model="form" :rules="rules" label-width="120px" label-position="left">
<el-form-item label="门店名称" prop="shopName">
<el-input
v-model="form.shopName"
placeholder="请输入门店名称"
style="width: 500px;"
></el-input>
<el-input v-model="form.shopName" placeholder="请输入门店名称" style="width: 500px;"></el-input>
</el-form-item>
<el-form-item label="连锁店扩展店名">
<el-input v-model="form.chainName" placeholder="请输入连锁店扩展店名" style="width: 500px;"></el-input>
</el-form-item>
<el-form-item label="门店logo">
<el-image
:src="form.logo || require('@/assets/images/upload.png')"
fit="contain"
style="width: 80px;height: 80px;"
@click="
<el-image :src="form.logo || require('@/assets/images/upload.png')" fit="contain"
style="width: 80px;height: 80px;" @click="
showUpload = true;
uploadIndex = 1;
"
></el-image>
uploadIndex = 1;
"></el-image>
</el-form-item>
<el-form-item label="门店照片">
<el-image
:src="form.coverImg || require('@/assets/images/upload.png')"
fit="contain"
style="width: 80px;height: 80px;"
@click="
<el-image :src="form.coverImg || require('@/assets/images/upload.png')" fit="contain"
style="width: 80px;height: 80px;" @click="
showUpload = true;
uploadIndex = 2;
"
></el-image>
uploadIndex = 2;
"></el-image>
</el-form-item>
<el-form-item label="微信二维码">
<el-image
:src="form.shopQrcode || require('@/assets/images/upload.png')"
fit="contain"
style="width: 80px;height: 80px;"
@click="
<el-image :src="form.shopQrcode || require('@/assets/images/upload.png')" fit="contain"
style="width: 80px;height: 80px;" @click="
showUpload = true;
uploadIndex = 3;
"
></el-image>
uploadIndex = 3;
"></el-image>
</el-form-item>
<el-form-item label="联系电话" prop="phone">
<el-input
v-model="form.phone"
placeholder="请输入联系电话"
style="width: 500px;"
></el-input>
<el-input v-model="form.phone" placeholder="请输入联系电话" style="width: 500px;"></el-input>
</el-form-item>
<!-- <el-form-item label="外卖起送金额">
<el-input-number v-model="form.takeaway_money" placeholder="0.00" controls-position="right"
:min="0"></el-input-number>
</el-form-item> -->
<el-form-item label="店铺经度">
<el-form-item label="店铺经度" prop="provinces">
<el-row>
<el-col :span="4">
<el-input v-model="form.lng" placeholder="经度"></el-input>
<el-col :span="9" v-if="form.provinces">
<el-input :value="`${form.provinces}-${form.cities}-${form.districts}`" disabled />
</el-col>
<el-col :span="4" v-if="form.lng">
<el-input v-model="form.lng" placeholder="经度" disabled></el-input>
</el-col>
<el-col :span="4" v-if="form.lng">
<el-input v-model="form.lat" placeholder="纬度" disabled></el-input>
</el-col>
<el-col :span="4">
<el-input
v-model="form.lat"
placeholder="纬度"
style="margin-left: 10px;"
></el-input>
</el-col>
<el-col :span="4">
<el-button
type="primary"
plain
icon="el-icon-place"
style="margin-left: 20px;"
@click="showLocation = true"
>选择坐标</el-button
>
<el-button type="primary" plain icon="el-icon-place" @click="showLocation = true">选择坐标</el-button>
</el-col>
</el-row>
<div style="color: #999;">注：准确的定位便于用户导航到店铺</div>
</el-form-item>
<el-form-item label="门店详细地址">
<el-input
type="textarea"
v-model="form.address"
placeholder="请输入门店详细地址"
style="width: 500px;"
></el-input>
<el-input type="textarea" v-model="form.address" placeholder="请输入门店详细地址" style="width: 500px;"></el-input>
</el-form-item>
<el-form-item label="营业时间">
<el-time-picker
placeholder="起始时间"
v-model="startTime"
:picker-options="{
selectableRange: '00:00:00 - 23:59:59',
format: 'HH:mm'
}"
format="HH:mm"
value-format="HH:mm"
>
<el-select v-model="form.businessStartDay" placeholder="周几开始">
<el-option :value="item.label" :label="item.label" v-for="item in weeks" :key="item.value"></el-option>
</el-select>
<el-select v-model="form.businessEndDay" placeholder="周几结束">
<el-option :value="item.label" :label="item.label" v-for="item in weeks" :key="item.value"></el-option>
</el-select>
<el-time-picker placeholder="起始时间" v-model="startTime" :picker-options="{
selectableRange: '00:00:00 - 23:59:59',
format: 'HH:mm'
}" format="HH:mm" value-format="HH:mm">
</el-time-picker>
<el-time-picker
placeholder="结束时间"
v-model="endTime"
:picker-options="{
selectableRange: `${startTime}:00 - 23:59:59`
}"
format="HH:mm"
value-format="HH:mm"
>
<el-time-picker placeholder="结束时间" v-model="endTime" :picker-options="{
selectableRange: `${startTime}:00 - 23:59:59`
}" format="HH:mm" value-format="HH:mm">
</el-time-picker>
</el-form-item>
<!-- <el-form-item label="结算类型">
@ -135,12 +93,7 @@
</el-time-picker>
</el-form-item> -->
<el-form-item label="店铺简介">
<el-input
type="textarea"
v-model="form.detail"
placeholder="请输入店铺简介"
style="width: 500px;"
></el-input>
<el-input type="textarea" v-model="form.detail" placeholder="请输入店铺简介" style="width: 500px;"></el-input>
</el-form-item>
<el-form-item label="状态">
<el-radio-group v-model="form.status">
@ -149,11 +102,7 @@
</el-radio-group>
</el-form-item>
<el-form-item>
<el-button
type="primary"
@click="submitHandle"
:loading="formLoading"
>
<el-button type="primary" @click="submitHandle" :loading="formLoading">
<span v-if="!formLoading">保存</span>
<span v-else>保存中...</span>
</el-button>
@ -168,10 +117,7 @@
</el-amap>
</div>
<div class="search_box">
<el-amap-search-box
:search-option="searchOption"
:on-search-result="onSearchResult"
></el-amap-search-box>
<el-amap-search-box :search-option="searchOption" :on-search-result="onSearchResult"></el-amap-search-box>
</div>
<div class="search_wrap">
@ -189,23 +135,10 @@
</div>
</div>
</el-dialog>
<el-dialog
:visible.sync="showUpload"
:close-on-click-modal="false"
append-to-body
width="500px"
@close="showUpload = false"
>
<el-upload
:before-remove="handleBeforeRemove"
:on-success="handleSuccess"
:on-error="handleError"
:file-list="fileList"
:headers="headers"
:action="qiNiuUploadApi"
class="upload-demo"
multiple
>
<el-dialog :visible.sync="showUpload" :close-on-click-modal="false" append-to-body width="500px"
@close="showUpload = false">
<el-upload :before-remove="handleBeforeRemove" :on-success="handleSuccess" :on-error="handleError"
:file-list="fileList" :headers="headers" :action="qiNiuUploadApi" class="upload-demo" multiple>
<el-button size="small" type="primary">点击上传</el-button>
<div slot="tip" style="display: block;" class="el-upload__tip">
请勿上传违法文件，且文件不超过15M
@ -223,6 +156,7 @@ import { getToken } from "@/utils/auth";
import { mapGetters } from "vuex";
import crudQiNiu from "@/api/tools/qiniu";
import { tbShopInfo, tbShopInfoPut } from "@/api/user";
import { geocode } from '@/api/shop'
export default {
computed: {
...mapGetters(["qiNiuUploadApi"])
@ -272,7 +206,37 @@ export default {
amapOptions: {
center: [108.946465, 34.347984],
position: []
}
},
weeks: [
{
value: '1',
label: '周一'
},
{
value: '2',
label: '周二'
},
{
value: '3',
label: '周三'
},
{
value: '4',
label: '周四'
},
{
value: '5',
label: '周五'
},
{
value: '6',
label: '周六'
},
{
value: '7',
label: '周天'
}
]
};
},
mounted() {
@ -284,10 +248,19 @@ export default {
this.amapOptions.center = [res[0].lng, res[0].lat];
},
// 确认地址选择
selectLocationHandle(item) {
async selectLocationHandle(item) {
this.form.lng = item.lng;
this.form.lat = item.lat;
this.form.address = item.address
this.showLocation = false;
const position = `${item.lng},${item.lat}`;
const res = JSON.parse(await geocode({ location: position }))
console.log(res);
this.form.provinces = res.addressComponent.province
this.form.cities = res.addressComponent.city
this.form.districts = res.addressComponent.district
},
// 获取用户详情
async tbShopInfo() {
@ -300,7 +273,7 @@ export default {
this.startTime = businessTime[0];
this.endTime = businessTime[1];
}
} catch (error) {}
} catch (error) { }
},
// 保存
submitHandle() {
@ -319,7 +292,7 @@ export default {
message: "提交成功",
type: "success"
});
} catch (error) {}
} catch (error) { }
}
});
},
@ -333,7 +306,7 @@ export default {
handleBeforeRemove(file, fileList) {
for (let i = 0; i < this.files.length; i++) {
if (this.files[i].uid === file.uid) {
crudQiNiu.del([this.files[i].id]).then(res => {});
crudQiNiu.del([this.files[i].id]).then(res => { });
return true;
}
}