<template>
|
<!--
|
作者 lyzflash
|
时间：2022-03-19
|
描述：设置-商城注册设置
|
-->
|
<div class="product-add">
|
<!--form表单-->
|
<el-form size="small" ref="form" :model="form" label-width="150px">
|
<!--添加门店-->
|
<div class="common-form">商城注册设置</div>
|
<el-form-item label="注册方式">
|
<el-radio v-model="form.register_type" :label="0">微信授权自动注册</el-radio>
|
<el-radio v-model="form.register_type" :label="1">填写信息手动注册</el-radio>
|
<div class="red">请慎用！尽量在开始运营的时候就确定好注册方式</div>
|
</el-form-item>
|
<el-form-item label="是否开启邀请注册" prop="is_code">
|
<el-radio v-model="form.is_code" :label="1">是</el-radio>
|
<el-radio v-model="form.is_code" :label="0">否</el-radio>
|
<div class="tips">开启后，用户注册必须填写邀请码</div>
|
</el-form-item>
|
<template v-if="form.register_type==1">
|
<el-form-item label="是否开启手机验证码" prop="is_code">
|
<el-radio v-model="form.is_sms" :label="1">是</el-radio>
|
<el-radio v-model="form.is_sms" :label="0">否</el-radio>
|
<div class="tips">开启后，用户注册必须填写手机验证码。注意：需要购买阿里云短信包才能使用</div>
|
</el-form-item>
|
</template>
|
<template v-if="form.register_type==0">
|
<el-form-item label="授权时完善头像昵称" prop="is_manual">
|
<el-radio v-model="form.is_manual" :label="1">必需</el-radio>
|
<el-radio v-model="form.is_manual" :label="0">可以跳过</el-radio>
|
<div class="tips">用户微信授权时需要完善的信息包括头像、昵称</div>
|
</el-form-item>
|
<el-form-item label="必须完善姓名和手机号" prop="is_skip">
|
<el-radio v-model="form.is_skip" :label="0">是</el-radio>
|
<el-radio v-model="form.is_skip" :label="1">否</el-radio>
|
<div class="tips">用户浏览页面时需要完善姓名和手机号</div>
|
<div class="tips">如果开启了邀请注册，则不允许跳过</div>
|
</el-form-item>
|
<el-form-item label="例外会员" v-if="form.is_code">
|
<div class="user-except-box">
|
<el-row>
|
<el-button @click="addUser">选择会员</el-button>
|
<div v-if="user_list && user_list.length > 0" class="d-s-c f-w">
|
<div v-for="(item, index) in user_list" :key="index" class="img pr">
|
<a href="javascript:void(0)" class="delete-btn" @click="deleteFunc(index)"><i class="el-icon-error"></i></a>
|
<img :src="item.avatarUrl" width="100" height="100" />
|
<p class="text-ellipsis">{{ item.nickName }}</p>
|
</div>
|
</div>
|
<div class="gray9">针对开启完善信息启用前的会员，即使没有推荐人，也不会跳出注册页面</div>
|
</el-row>
|
</div>
|
</el-form-item>
|
<!-- <el-form-item label="拒绝注册后" prop="send_day" v-if="form.is_manual">
|
<div style="width: 500px;">
|
<el-input placeholder="请输入" v-model="form.send_day" type="number">
|
<template slot="append">
|
天不再提醒
|
</template>
|
</el-input>
|
<p class="gray">拒绝注册后多久再提示，设置为0则每次都要提示</p>
|
</div>
|
</el-form-item> -->
|
</template>
|
|
|
|
<!-- <el-form-item label="允许跳过" prop="is_skip" v-if="form.is_manual">
|
<el-checkbox v-model="form.is_skip">允许跳过</el-checkbox>
|
<div class="tips">如果不允许跳过，用户必须完成注册后才能浏览商城内容（小程序审核时请务必关闭）</div>
|
</el-form-item> -->
|
|
<el-form-item label="头部背景图片" v-if="form.register_type==1">
|
<el-button @click="chooseImg">选择图片</el-button>
|
<img class="mt10" v-img-url="form.bg_image" width="750">
|
<div class="tips">建议宽度750px，高度400px</div>
|
</el-form-item>
|
<!--提交-->
|
<div class="common-button-wrapper">
|
<el-button type="primary" @click="onSubmit" :loading="loading">提交</el-button>
|
</div>
|
</el-form>
|
<!--上传图片-->
|
<Upload v-if="isupload" :isupload="isupload" :config="{ total: 3 }" @returnImgs="returnImgsFunc"></Upload>
|
<!--选择会员-->
|
<GetUser :is_open="open_add" @close="closeDialogFunc"></GetUser>
|
</div>
|
|
</template>
|
|
<script>
|
import SettingApi from '@/api/setting.js';
|
import { formatModel } from '@/utils/base.js';
|
import Upload from '@/components/file/Upload';
|
import GetUser from '@/components/user/GetUser.vue';
|
export default {
|
components:{
|
Upload,
|
GetUser
|
},
|
data() {
|
return {
|
/*是否正在加载*/
|
loading: false,
|
/*form表单数据*/
|
form: {
|
register_type: 0,
|
is_manual: 0,
|
is_skip: 1, // 0不能跳过 1可以跳过
|
send_day: 7,
|
is_code: 0,
|
bg_image: '',
|
user_except_ids: [],
|
is_sms: 0, // 注册是否开启手机验证码
|
},
|
/*是否打开图片选择*/
|
isupload:false,
|
open_add: false,
|
user_list: []
|
};
|
},
|
created() {
|
this.getParams()
|
},
|
|
methods: {
|
|
/*获取配置数据*/
|
getParams() {
|
let self = this;
|
SettingApi.registerDetail({}, true).then(res => {
|
let vars = res.data.vars.values;
|
self.form = formatModel(self.form, vars);
|
self.form.register_type = parseInt(self.form.register_type);
|
self.user_list = res.data.userList;
|
self.loading=false;
|
})
|
.catch(error => {
|
|
});
|
|
},
|
|
/*提交*/
|
onSubmit() {
|
let self = this;
|
let params = this.form;
|
let user_except_ids = [];
|
self.user_list.forEach((item)=>{
|
user_except_ids.push(item.user_id);
|
})
|
params.user_except_ids = user_except_ids;
|
console.log(params)
|
self.$refs.form.validate((valid) => {
|
if (valid) {
|
self.loading = true;
|
SettingApi.editRegister({params: JSON.stringify(params)}, true)
|
.then(data => {
|
self.loading = false;
|
self.$message({
|
message: '恭喜你，商城注册设置成功',
|
type: 'success'
|
});
|
self.$router.push('/setting/register/index');
|
})
|
.catch(error => {
|
self.loading = false;
|
});
|
}
|
});
|
},
|
|
//监听复选框选中
|
handleCheckedGetLog(e) {
|
|
},
|
|
/*选择图片*/
|
chooseImg(){
|
this.isupload=true;
|
},
|
|
/*关闭选择图片*/
|
returnImgsFunc(e){
|
this.isupload=false;
|
this.form.bg_image=e[0].file_path;
|
},
|
|
/*打开弹出层*/
|
addUser() {
|
this.open_add = true;
|
},
|
|
/*关闭获取用户弹窗*/
|
closeDialogFunc(e) {
|
if (e.type != 'error') {
|
this.user_list = this.user_list.concat(e.params);
|
}
|
this.open_add = false;
|
},
|
|
/*取消*/
|
cancelFunc() {
|
this.$router.back(-1);
|
},
|
|
/*删除商品*/
|
deleteFunc(i) {
|
this.user_list.splice(i, 1);
|
},
|
}
|
|
};
|
</script>
|
<style scoped="scoped">
|
.tips {
|
color: #ccc;
|
}
|
.user-except-box .img {
|
width: 60px;
|
margin-top: 10px;
|
height: 90px;
|
margin-right: 10px;
|
}
|
|
.user-except-box .img img {
|
border: 1px solid #eeeeee;
|
width: 60px;
|
height: 60px;
|
}
|
|
.user-except-box .delete-btn {
|
position: absolute;
|
display: block;
|
width: 16px;
|
height: 16px;
|
line-height: 16px;
|
right: -8px;
|
top: -8px;
|
color: red;
|
border-radius: 30px;
|
background: #fff;
|
font-size: 16px;
|
}
|
</style>
|
