219 lines
7.3 KiB
JavaScript
219 lines
7.3 KiB
JavaScript
define({
|
||
name: "notification",
|
||
template: `
|
||
<div>
|
||
<el-form ref="form" label-width="15%">
|
||
<div id="vue_head">
|
||
<div class="base_set">
|
||
<div class="vue-main-title">
|
||
<div class="vue-main-title-left"></div>
|
||
<div class="vue-main-title-content">消息通知</div>
|
||
</div>
|
||
<div class="vue-main-form">
|
||
<el-form-item label="商家通知">
|
||
<div class="upload-box" >
|
||
<div class="upload-box-member" @click="btnNotificationData">
|
||
<i class="el-icon-plus notcie_icon" style="font-size:32px"></i><br>
|
||
<span>选择通知人</span>
|
||
</div>
|
||
</div>
|
||
<div class="img_box" v-if="member.avatar_image">
|
||
<img :src="member.avatar_image"/>
|
||
<span class="introduce_name">{{name}}</span>
|
||
</div>
|
||
<div class="tip">单品下单通知，可指定某个用户，通知商品下单备货通知，如果商品为同一商家，建议使用系统一设置</div>
|
||
<div class="tip">非公众号注册会员，无法绑定通知人员</div>
|
||
</el-form-item>
|
||
<el-form-item label="通知方式">
|
||
<el-checkbox-group v-model="form.notice_type">
|
||
<el-checkbox v-for="(item,index) in notification_list" :label="item.id" :key="index" :value="item.id">{{item.name}}</el-checkbox>
|
||
</el-checkbox-group>
|
||
<div class="tip">通知商家方式</div>
|
||
<div class="tip">因微信模板消息60秒内是不能重复，如果订单触发通知时间相近，可能只会收到一条消息</div>
|
||
</el-form-item>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</el-form>
|
||
|
||
<!-- 选择图片弹窗 -->
|
||
<el-dialog :visible.sync="choose_goods_show" width="60%" left title="选择通知人">
|
||
<div>
|
||
<div class="search_line">
|
||
<el-input v-if="is_storeCashier" style="width:90%" placeholder="请输入完整的手机号码！！" v-model="keyword_mobile"></el-input>
|
||
<el-input v-if="!is_storeCashier" style="width:90%" placeholder="" v-model="keyword"></el-input>
|
||
<el-button v-if="is_storeCashier" @click="btnSearchMobile">搜索</el-button>
|
||
<el-button v-if="!is_storeCashier" @click="btnSearch">搜索</el-button>
|
||
</div>
|
||
<el-table :data="goodsData" style="width: 100%;height:500px;overflow:auto" v-loading="loading">
|
||
<el-table-column label="昵称" align="" >
|
||
<template slot-scope="scope">
|
||
<div style="display:flex;">
|
||
<img style="width: 50px;height:50px" :src="scope.row.avatar_image" alt="">
|
||
<span class="nickname_card">{{scope.row.nickname}}</span>
|
||
</div>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="会员ID" align="center" prop="uid"></el-table-column>
|
||
<el-table-column label="姓名" align="center" prop="username"></el-table-column>
|
||
<el-table-column label="手机号码" align="center" prop="mobile"></el-table-column>
|
||
<el-table-column label="" align="center">
|
||
<template slot-scope="scope">
|
||
<span style="color:#399fbd" @click="btnSelect(scope.row)">
|
||
选择
|
||
</span>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
</div>
|
||
<span slot="footer" class="dialog-footer">
|
||
<el-button @click="choose_goods_show = false">取 消</el-button>
|
||
</span>
|
||
</el-dialog>
|
||
</div>
|
||
`,
|
||
data(){
|
||
return {
|
||
notification_list:[{
|
||
id:1,
|
||
name:"下单通知"
|
||
},{
|
||
id:2,
|
||
name:"付款通知"
|
||
},{
|
||
id:3,
|
||
name:"买家收货通知"
|
||
}],
|
||
choose_goods_loading:false,
|
||
choose_goods_show:false,
|
||
// current_page:1,
|
||
// total:1,
|
||
// per_page:1,
|
||
goodsData:[],
|
||
member:{
|
||
avatar_image:"",
|
||
uid:"",
|
||
},
|
||
name:"",
|
||
keyword:"",
|
||
keyword_mobile:'',
|
||
loading:false
|
||
}
|
||
},
|
||
style: `
|
||
.img_box{
|
||
margin:20px 0;
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
.img_box img{
|
||
width:150px;
|
||
height:150px;
|
||
}
|
||
.introduce_name{
|
||
width: 150px;
|
||
line-height: 20px;
|
||
}
|
||
.notcie_icon{
|
||
font-size: 32px;
|
||
width: 100%;
|
||
text-align: center;
|
||
}
|
||
.el-checkbox-group{
|
||
display: contents;
|
||
}
|
||
.nickname_card{
|
||
align-items: center;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
display: -webkit-box;
|
||
-webkit-box-orient: vertical;
|
||
-webkit-line-clamp: 1;
|
||
height: fit-content;
|
||
line-height: 50px;
|
||
margin-left:10px;
|
||
}
|
||
`,
|
||
created() {
|
||
this.member.avatar_image = this.form.member ? this.form.member.avatar_image : "";
|
||
this.member.uid = this.form.member ? this.form.member.uid : "";
|
||
this.is_storeCashier = this.form.is_storeCashier ? this.form.is_storeCashier : '';
|
||
// this.form.notice_type = [1,2]
|
||
this.name = this.form.member.username ? this.form.member.username : "";
|
||
},
|
||
methods: {
|
||
btnNotificationData(){
|
||
this.choose_goods_show = true;
|
||
this.choose_goods_loading = true
|
||
},
|
||
btnSelect(data){
|
||
// console.log(data,'data');
|
||
this.name = data.nickname
|
||
this.member.avatar_image = data.avatar_image
|
||
this.member.uid = data.uid
|
||
this.choose_goods_show = false
|
||
},
|
||
btnSearch(){
|
||
this.loading = true
|
||
this.$http.post(this.http_url +'member.member.get-search-member-json',{
|
||
keyword:this.keyword
|
||
}).then(response => {
|
||
if(response.data.result==1){
|
||
this.$message({
|
||
message: '成功',
|
||
type: 'success'
|
||
});
|
||
this.loading = false
|
||
this.goodsData = response.data.data.members
|
||
}
|
||
else{
|
||
this.$message.error(response.data);
|
||
}
|
||
}),function(res){
|
||
console.log(res);
|
||
};
|
||
},
|
||
btnSearchMobile() {
|
||
this.loading = true
|
||
this.$http.post(this.http_url +'plugin.store-cashier.store.admin.member-information.get-member-only-mobile',{
|
||
keyword:this.keyword_mobile
|
||
}).then(response => {
|
||
if(response.data.result==1){
|
||
this.$message({
|
||
message: '成功',
|
||
type: 'success'
|
||
});
|
||
this.loading = false
|
||
this.goodsData = response.data.data.members
|
||
}
|
||
else{
|
||
this.$message.error(response.data.msg);
|
||
this.loading = false
|
||
}
|
||
})
|
||
},
|
||
extraDate(){
|
||
|
||
},
|
||
validate(){
|
||
return {
|
||
type:this.form.notice_type,
|
||
uid:this.member.uid ? this.member.uid : ""
|
||
}
|
||
}
|
||
},
|
||
props: {
|
||
form: {
|
||
// type: Object,
|
||
default() {
|
||
return {}
|
||
}
|
||
},
|
||
http_url:{
|
||
type:String,
|
||
default() {
|
||
return "";
|
||
},
|
||
}
|
||
}
|
||
}) |