377 行
15 KiB
HTML
可执行文件
377 行
15 KiB
HTML
可执行文件
<!--[1.8.50]-->
|
||
<style>
|
||
.tips {
|
||
color: #aaa;
|
||
line-height: 16px;
|
||
font-size: 12px;
|
||
}
|
||
|
||
.swiper-box {
|
||
display: flex;
|
||
padding: 10px 0;
|
||
flex-wrap: wrap;
|
||
}
|
||
|
||
.banner-wrap {
|
||
position: relative;
|
||
margin-right: 15px;
|
||
margin-bottom: 15px;
|
||
}
|
||
|
||
.image-slide-show {
|
||
display: block;
|
||
width: 153px;
|
||
height: 76px;
|
||
border: 1px dashed rgb(194, 204, 209);
|
||
}
|
||
|
||
.del-banner {
|
||
position: absolute;
|
||
top: 0;
|
||
right: 5px;
|
||
font-size: 18px;
|
||
color: #aaa;
|
||
}
|
||
|
||
.del-banner:hover {
|
||
color: #666;
|
||
}
|
||
|
||
.mini-form-item > .el-form-item__label {
|
||
line-height: 16px;
|
||
}
|
||
|
||
.el-form-item.how-to-enter-the-store .el-form-item__content {
|
||
clear: both;
|
||
margin-left: 32px !important;
|
||
}
|
||
|
||
.el-form-item.how-to-enter-the-store .el-form-item__content span.label {
|
||
width: 105px;
|
||
display: inline-block;
|
||
}
|
||
|
||
.el-form-item.how-to-enter-the-store .el-form-item__content .first {
|
||
margin-bottom: 15px;
|
||
margin-top: 5px;
|
||
}
|
||
</style>
|
||
<div id="setNearby" v-cloak style="width: 100%">
|
||
<el-tabs :tab-position="'left'">
|
||
<el-tab-pane label="进入门店选项">
|
||
<el-form size="small" label-width="130px">
|
||
<el-form-item label="进入门店方式" class="how-to-enter-the-store">
|
||
<template slot="label">
|
||
<el-tooltip class="item" effect="dark"
|
||
content="该设置不限制分享及扫描门店二维码；当会员/普通用户没有隶属门店或所属门店已关闭/删除时，按第一次进入小程序的用户所设置进入门店的方式来进入门店。"
|
||
placement="top-start">
|
||
<el-button type="text">
|
||
<i class="el-icon-question"></i>
|
||
</el-button>
|
||
</el-tooltip>
|
||
<span>进入门店方式</span>
|
||
</template>
|
||
<div class="first">
|
||
<span class="label"><el-tooltip class="item" effect="dark" content="第一次进入商城的新用户"
|
||
placement="top-start">
|
||
<el-button type="text">
|
||
<i class="el-icon-question"></i>
|
||
</el-button>
|
||
</el-tooltip>
|
||
<span>商城新用户</span>
|
||
</span>
|
||
<el-radio-group v-model="tourist_store_access">
|
||
<el-radio label="1" border>最近门店</el-radio>
|
||
<el-radio label="3" border>主店</el-radio>
|
||
</el-radio-group>
|
||
</div>
|
||
<div>
|
||
<span class="label">会员、普通用户</span>
|
||
<el-radio-group v-model="store_access">
|
||
<el-radio label="2" border>隶属门店</el-radio>
|
||
<el-radio label="1" border>最近门店</el-radio>
|
||
<el-radio label="3" border>主店</el-radio>
|
||
</el-radio-group>
|
||
</div>
|
||
</el-form-item>
|
||
<el-form-item>
|
||
<template slot="label">
|
||
<el-tooltip class="item" effect="dark" placement="top-start">
|
||
<div slot="content">
|
||
当选择不可切换时：<br/>
|
||
①只能通过门店链接进入其他门店<br/>
|
||
②进入其他门店后，只能通过删除小程序或等小程序自动清除缓存才能按照“进入门店方式”进入门店
|
||
</div>
|
||
<el-button type="text">
|
||
<i class="el-icon-question"></i>
|
||
</el-button>
|
||
</el-tooltip>
|
||
<span>切换门店设置</span>
|
||
</template>
|
||
<el-radio-group v-model="store_switch">
|
||
<el-radio label="1" border>可切换</el-radio>
|
||
<el-radio label="2" border>不可切换</el-radio>
|
||
</el-radio-group>
|
||
</el-form-item>
|
||
<el-form-item>
|
||
<el-button type="primary" :disabled="operate.saveStoreSetting?false:true" @click="saveStoreSetting">
|
||
保存设置
|
||
</el-button>
|
||
</el-form-item>
|
||
</el-form>
|
||
</el-tab-pane>
|
||
<el-tab-pane v-if="operate.setting||operate.getBanner" label="旧版设置">
|
||
<template slot="label">
|
||
<el-tooltip class="item" effect="dark" content="注意：该设置在商城2.0.0版本及之后的版本将无效" placement="top-start">
|
||
<i class="el-icon-warning-outline"></i>
|
||
</el-tooltip>
|
||
<span>旧版设置</span>
|
||
</template>
|
||
<el-form size="small" label-width="100px">
|
||
<el-form-item v-if="operate.setting" label="跳转最近门店">
|
||
<el-switch v-model="nearby_status" @change="setting" active-value="1" inactive-value="2">
|
||
</el-switch>
|
||
<i class="tips">开启后进入门店列表页将自动跳转到最近门店</i>
|
||
</el-form-item>
|
||
<el-form-item v-if="operate.getBanner" label="门店轮播图">
|
||
<el-button type="primary" plain @click="showSelectImage = true">新增图片</el-button>
|
||
<div class="swiper-box">
|
||
<div class="banner-wrap" v-for="(item,index) in bannerList">
|
||
<img :src="item.image" class="image-slide-show">
|
||
<el-button size="mini" type="text" class="del-banner" @click="del(index)"
|
||
icon="el-icon-delete"></el-button>
|
||
</div>
|
||
</div>
|
||
<p class="tips">建议尺寸：414 x 204，或等比例图片</p>
|
||
<p class="tips">该图片为门店列表页轮播图</p>
|
||
</el-form-item>
|
||
|
||
</el-form>
|
||
</el-tab-pane>
|
||
</el-tabs>
|
||
<el-dialog title="选择图片" :modal-append-to-body="false" :visible.sync="showSelectImage"
|
||
custom-class="select-image-el-dialog" :top="'10px'">
|
||
<template-select-image :can-select-num="1" @selectfile="selectFile"></template-select-image>
|
||
</el-dialog>
|
||
</div>
|
||
<script>
|
||
var setNearby = new Vue({
|
||
el: '#setNearby',
|
||
data: function () {
|
||
return {
|
||
store_access: '', //会员进入门店方式 1最近门店 2隶属门店 3主店
|
||
tourist_store_access: '', //非会员进入门店方式 1最近门店 3主店 （2隶属门店已删除）
|
||
store_switch: '',//是否可以切换门店 1可 2否
|
||
nearby_status: 1,//跳转最近门店 1.开启 2.关闭
|
||
bannerList: [],//轮播图列表
|
||
showSelectImage: false,//是否显示图库
|
||
operate: {},//权限
|
||
};
|
||
},
|
||
|
||
methods: {
|
||
//保存用户进入门店及跳转设置
|
||
saveStoreSetting() {
|
||
$.ajax({
|
||
url: "{:U('saveStoreSetting')}",
|
||
type: "post",
|
||
data: {
|
||
store_access: this.store_access,
|
||
store_switch: this.store_switch,
|
||
tourist_store_access: this.tourist_store_access
|
||
},
|
||
success: (res) => {
|
||
if (res.status == 1) {
|
||
this.$message({
|
||
message: res.msg,
|
||
type: 'success'
|
||
});
|
||
} else {
|
||
this.$message({
|
||
message: res.msg,
|
||
type: 'error'
|
||
});
|
||
}
|
||
}
|
||
})
|
||
},
|
||
// 获取小程序跳转配置
|
||
getXcxConfig() {
|
||
$.ajax({
|
||
url: "{:U('getXcxConfig')}",
|
||
type: "post",
|
||
success: (res) => {
|
||
if (res.status == 1) {
|
||
this.nearby_status = res.data.nearby_status;
|
||
this.store_access = res.data.store_access;
|
||
this.store_switch = res.data.store_switch;
|
||
this.tourist_store_access = res.data.tourist_store_access
|
||
} else {
|
||
this.$message({
|
||
message: res.msg,
|
||
type: 'error',
|
||
duration: 1500
|
||
})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
// 保存小程序跳转设置
|
||
setting() {
|
||
$.ajax({
|
||
url: "{:U('setting')}",
|
||
type: "post",
|
||
data: {
|
||
nearby_status: this.nearby_status
|
||
},
|
||
success: (res) => {
|
||
if (res.status == 1) {
|
||
this.$message({
|
||
message: res.msg,
|
||
type: 'success'
|
||
});
|
||
} else {
|
||
this.$message({
|
||
message: res.msg,
|
||
type: 'error'
|
||
});
|
||
this.getXcxConfig();
|
||
}
|
||
}
|
||
})
|
||
},
|
||
//获取轮播图
|
||
getStoreBanner() {
|
||
$.ajax({
|
||
url: "{:U('getBanner')}",
|
||
type: "post",
|
||
success: (res) => {
|
||
if (res.status == 1) {
|
||
this.bannerList = res.data;
|
||
} else {
|
||
this.$message({
|
||
message: res.msg,
|
||
type: 'error',
|
||
duration: 1500
|
||
})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
//新增轮播图
|
||
selectFile(item) {
|
||
this.showSelectImage = false;
|
||
if (item.length) {
|
||
this.$loading({
|
||
lock: true,
|
||
text: '添加中，请等待',
|
||
spinner: 'el-icon-loading',
|
||
background: 'rgba(255, 255, 255, 0.7)'
|
||
});
|
||
$.ajax({
|
||
url: "{:U('addSlideShow')}",
|
||
type: "POST",
|
||
data: {
|
||
image_id: item[0].id,
|
||
image: item[0].path,
|
||
},
|
||
success: (res) => {
|
||
this.$loading().close();
|
||
if (res.status == 1) {
|
||
var bannerList = JSON.parse(JSON.stringify(this.bannerList));
|
||
var obj = {
|
||
id: res.id,
|
||
image: item[0].path,
|
||
}
|
||
bannerList.unshift(obj);
|
||
this.bannerList = [];
|
||
this.bannerList = bannerList;
|
||
this.$message({
|
||
type: 'success',
|
||
message: res.msg,
|
||
duration: 1000,
|
||
});
|
||
} else {
|
||
this.$message({
|
||
type: 'error',
|
||
message: res.msg,
|
||
duration: 1000
|
||
});
|
||
}
|
||
},
|
||
error: () => {
|
||
this.$loading().close();
|
||
}
|
||
})
|
||
}
|
||
},
|
||
//删除轮播图
|
||
del(index) {
|
||
this.$confirm("确认要删除该图片吗?", "温馨提示", {
|
||
confirmButtonText: '删除',
|
||
cancelButtonText: '取消',
|
||
type: 'info'
|
||
}).then(() => {
|
||
this.$loading({
|
||
lock: true,
|
||
text: '删除中，请等待',
|
||
spinner: 'el-icon-loading',
|
||
background: 'rgba(255, 255, 255, 0.7)'
|
||
});
|
||
var bannerList = JSON.parse(JSON.stringify(this.bannerList));
|
||
$.ajax({
|
||
url: "{:U('delSlideShow')}",
|
||
type: "post",
|
||
data: {id: bannerList[index].id},
|
||
success: (res) => {
|
||
this.$loading().close();
|
||
if (res.status == 1) {
|
||
this.$message({
|
||
message: res.msg,
|
||
type: 'success',
|
||
duration: 1000
|
||
});
|
||
bannerList.splice(index, 1);
|
||
this.bannerList = [];
|
||
this.bannerList = bannerList;
|
||
} else {
|
||
this.$message({
|
||
message: res.msg,
|
||
type: 'error',
|
||
duration: 1500
|
||
})
|
||
}
|
||
}
|
||
})
|
||
}).catch(() => {
|
||
})
|
||
},
|
||
//获取用户权限
|
||
getOperate() {
|
||
var auth_list = {
|
||
getBanner: '/index.php/Retail/XcxConfig/slideshow',
|
||
setting: '/index.php/Retail/XcxConfig/setting',
|
||
saveStoreSetting: '/index.php/Retail/XcxConfig/saveStoreSetting',
|
||
};
|
||
$.ajax({
|
||
url: "{:U('Retail/Component/checkOperateAuth')}",
|
||
type: "post",
|
||
data: {
|
||
auth_list: JSON.stringify(auth_list),
|
||
},
|
||
success: (res) => {
|
||
if (res.status == 1) {
|
||
this.operate = res.data;
|
||
}
|
||
}
|
||
})
|
||
}
|
||
},
|
||
|
||
created: function () {
|
||
this.getOperate();
|
||
this.getXcxConfig();
|
||
this.getStoreBanner();
|
||
},
|
||
})
|
||
</script> |