398 lines
18 KiB
HTML
398 lines
18 KiB
HTML
{extend name="app/shop/view/base.html"/}
|
||
{block name="resources"}
|
||
<link rel="stylesheet" href="__STATIC__/element-ui/index.css">
|
||
<script src="STATIC_JS/vue.js"></script>
|
||
<script src="__STATIC__/element-ui/index.js"></script>
|
||
<style>
|
||
.pagination{
|
||
text-align: right!important;
|
||
padding-top: 20px!important;
|
||
}
|
||
.cell{
|
||
padding: 0!important;
|
||
}
|
||
.selWidth {
|
||
width: 350px !important;
|
||
margin-bottom: 5px;
|
||
}
|
||
.whereWidth{
|
||
margin-top: 5px;
|
||
}
|
||
.goods-image{
|
||
width: 80px;
|
||
height: 80px;
|
||
}
|
||
.tips{
|
||
font-size: 13px;
|
||
color: #cccccc;
|
||
line-height: 15px;
|
||
}
|
||
</style>
|
||
{/block}
|
||
|
||
{block name="main"}
|
||
<div id="vueContent">
|
||
<el-card class="box-card">
|
||
<!--顶部搜索栏-->
|
||
<div slot="header" class="clearfix">
|
||
<div class="container">
|
||
<el-form inline size="small" label-width="80px">
|
||
<el-form-item label="搜索">
|
||
<el-input v-model="tableFrom.title" placeholder="请输入等级名称" class="selWidth" clearable></el-input>
|
||
<el-input v-model="tableFrom.weight" placeholder="请输入权重值" class="selWidth" clearable>
|
||
<el-button slot="append" icon="el-icon-search" class="el-button-solt" @click="getList(1)"></el-button>
|
||
</el-input>
|
||
</el-form-item>
|
||
</el-form>
|
||
<!--操作按钮-->
|
||
<el-button type="primary" effect="dark" size="small" @click="editLevel()">添加等级</el-button>
|
||
</div>
|
||
</div>
|
||
<!--表格信息-->
|
||
<el-table v-loading="listLoading" :data="tableData.data" style="width: 100%">
|
||
<el-table-column prop="id" label="ID" min-width="50" align="center"></el-table-column>
|
||
<el-table-column prop="title" label="等级名称" min-width="100" align="center"></el-table-column>
|
||
<el-table-column label="等级权重" min-width="100" align="center">
|
||
<template slot-scope="scope">
|
||
<el-tag type="info" effect="dark">{{scope.row.weight}}</el-tag>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="团队奖励比例" min-width="100" align="center">
|
||
<template slot-scope="scope">
|
||
{{scope.row.commission_rate}}%
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="团队奖励层级" min-width="100" align="center">
|
||
<template slot-scope="scope">
|
||
{{scope.row.commission_tier}}层
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column prop="same_level_rate" label="平级奖比例" min-width="100" align="center">
|
||
<template slot-scope="scope">
|
||
{{scope.row.same_level_rate}}%
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column prop="same_level_tier" label="平级奖层级" min-width="100" align="center">
|
||
<template slot-scope="scope">
|
||
{{scope.row.same_level_tier}}层
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="升级条件" min-width="150" align="center">
|
||
<template slot-scope="scope">
|
||
<el-tag v-if="scope.row.upgrade_type == 0" type="danger" effect="dark" size="small">不可升级</el-tag>
|
||
<el-tag v-else-if="scope.row.upgrade_type == 1" effect="dark" size="small">满足以下任一条件</el-tag>
|
||
<el-tag v-else-if="scope.row.upgrade_type == 2" type="success" effect="dark" size="small">满足以下全部条件</el-tag>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="操作" min-width="150" align="center">
|
||
<template slot-scope="scope">
|
||
<el-button type="primary" size="small" @click="editLevel(scope.row)">编辑</el-button>
|
||
<el-button type="danger" size="small" @click="deleteLevel(scope.row.id)">删除</el-button>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
<!--分页-->
|
||
<div class="pagination">
|
||
<el-pagination :current-page="tableFrom.page" hide-on-single-page :total="tableData.total" @current-change="pageChange"></el-pagination>
|
||
</div>
|
||
</el-card>
|
||
<!-- 等级编辑 -->
|
||
<el-dialog title="等级编辑" :visible.sync="editDialog" width="75%" append-to-body :close-on-click-modal="false">
|
||
<el-form size="small" label-width="150px" :model="currentInfo" :rules="rules" ref="formData">
|
||
<el-form-item label="等级名称" prop="title">
|
||
<el-input v-model="currentInfo.title" placeholder="请输入等级名称" class="selWidth" type="text"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="等级权重" prop="weight">
|
||
<el-input placeholder="请输入等级权重" v-model="currentInfo.weight" type="number" step="1" :max="99" class="selWidth"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="团队奖励比例" prop="commission_rate">
|
||
<el-input placeholder="请输入团队奖励比例" v-model="currentInfo.commission_rate" type="number" step="0.01" class="selWidth"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="团队奖励层级限制" prop="commission_tier">
|
||
<el-input placeholder="请输入团队奖励层级限制" v-model="currentInfo.commission_tier" type="number" step="1" class="selWidth"></el-input>
|
||
<p class="tips">代表当前等级的团队奖励最多有多少人可以获得，超过限制后的当前等级成员获得平级奖；0则不限制人数。</p>
|
||
</el-form-item>
|
||
<el-form-item label="平级奖比例" prop="same_level_rate">
|
||
<el-input placeholder="请输入平级奖比例" v-model="currentInfo.same_level_rate" type="number" step="0.01" class="selWidth"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="平级奖层级限制" prop="same_level_tier">
|
||
<el-input placeholder="请输入平级奖层级限制" v-model="currentInfo.same_level_tier" type="number" step="1" class="selWidth"></el-input>
|
||
<p class="tips">代表当前等级的平级奖最多有多少人可以获得，超过限制后的当前等级成员无奖励；0则不限制人数。</p>
|
||
</el-form-item>
|
||
<el-form-item label="升级方式">
|
||
<el-radio-group v-model="currentInfo.upgrade_type">
|
||
<el-radio :label="0">不可升级</el-radio>
|
||
<el-radio :label="1">满足以下任一条件</el-radio>
|
||
<el-radio :label="2">满足以下全部条件</el-radio>
|
||
</el-radio-group>
|
||
</el-form-item>
|
||
<el-form-item label="升级条件" prop="upgrade_conditions" v-if="Number(currentInfo.upgrade_type) !== 0">
|
||
<el-checkbox-group v-model="currentInfo.upgrade_conditions.where" size="small">
|
||
<el-checkbox label="one_people" border>直推人数</el-checkbox>
|
||
<el-checkbox label="team_people" border>团队人数</el-checkbox>
|
||
<el-checkbox label="one_money" border>直推业绩金额</el-checkbox>
|
||
<el-checkbox label="team_money" border>团队业绩金额</el-checkbox>
|
||
<el-checkbox label="buy_goods" border>购买指定商品之一</el-checkbox>
|
||
</el-checkbox-group>
|
||
<el-input v-if="Object.values(currentInfo.upgrade_conditions.where).includes('one_people')" placeholder="请输入人数" v-model="currentInfo.upgrade_conditions.one_people" type="number" step="1" class="whereWidth">
|
||
<template slot="prepend">直推</template>
|
||
<template slot="append">人升级</template>
|
||
</el-input>
|
||
<el-input v-if="Object.values(currentInfo.upgrade_conditions.where).includes('team_people')" placeholder="请输入人数" v-model="currentInfo.upgrade_conditions.team_people" type="number" step="1" class="whereWidth">
|
||
<template slot="prepend">团队人数达</template>
|
||
<template slot="append">人升级</template>
|
||
</el-input>
|
||
<el-input v-if="Object.values(currentInfo.upgrade_conditions.where).includes('one_money')" placeholder="请输入金额" v-model="currentInfo.upgrade_conditions.one_money" type="number" step="1" class="whereWidth">
|
||
<template slot="prepend">直推订单金额达</template>
|
||
<template slot="append">元升级</template>
|
||
</el-input>
|
||
<el-input v-if="Object.values(currentInfo.upgrade_conditions.where).includes('team_money')" placeholder="请输入金额" v-model="currentInfo.upgrade_conditions.team_money" type="number" step="1" class="whereWidth">
|
||
<template slot="prepend">团队订单金额达</template>
|
||
<template slot="append">元升级</template>
|
||
</el-input>
|
||
<div class="buy-goods-content whereWidth" v-if="Object.values(currentInfo.upgrade_conditions.where).includes('buy_goods')">
|
||
<el-button type="info" effect="dark" size="small" @click="selectGoods">选择商品</el-button>
|
||
<el-table v-if="Object.values(currentInfo.upgrade_conditions.buy_goods || {}).length > 0"
|
||
:data="Object.values(currentInfo.upgrade_conditions.buy_goods || {})" style="width: 100%">
|
||
<el-table-column prop="goods_id" label="商品ID" min-width="50" align="center"></el-table-column>
|
||
<el-table-column label="商品图片" min-width="100" align="center">
|
||
<template slot-scope="scope">
|
||
<img class="goods-image" :src="goodsImgHandle(scope.row.goods_image)" />
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column prop="goods_name" label="商品名称" min-width="150" align="left"></el-table-column>
|
||
<el-table-column label="操作" min-width="150" align="center">
|
||
<template slot-scope="scope">
|
||
<el-button type="danger" size="small" @click="deleteGoods(scope.row.goods_id)">删除</el-button>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
</div>
|
||
</el-form-item>
|
||
<el-form-item label="">
|
||
<el-button type="primary" effect="dark" size="small" @click="submitSave">提交</el-button>
|
||
</el-form-item>
|
||
</el-form>
|
||
</el-dialog>
|
||
</div>
|
||
{/block}
|
||
|
||
{block name="script"}
|
||
<script>
|
||
new Vue({
|
||
el:'#vueContent',
|
||
data(){
|
||
return {
|
||
// 列表相关
|
||
listLoading: true,
|
||
tableData: {
|
||
data: [],
|
||
total: 0,
|
||
},
|
||
tableFrom: {
|
||
page: 1,
|
||
limit: 10,
|
||
title: '',
|
||
weight: '',
|
||
},
|
||
// 等级编辑相关
|
||
editDialog: false,
|
||
currentInfo: {
|
||
title: '',
|
||
weight: '',
|
||
commission_rate: '',
|
||
commission_tier: 0,
|
||
same_level_rate: '',
|
||
same_level_tier: 0,
|
||
upgrade_type: 1,
|
||
upgrade_conditions: {
|
||
where: [],
|
||
one_people: '',
|
||
team_people: '',
|
||
one_money: '',
|
||
team_money: '',
|
||
buy_goods: {},
|
||
},
|
||
},
|
||
rules: {
|
||
title: [
|
||
{ required: true, message: '请输入等级名称', trigger: 'change' },
|
||
{ min: 1, max: 5, message: '长度在 1 到 5 个字符', trigger: 'change' }
|
||
],
|
||
weight: [
|
||
{ required: true, message: '请输入等级权重', trigger: 'change' },
|
||
],
|
||
commission_rate: [
|
||
{ required: true, message: '请输入团队奖励比例', trigger: 'change' },
|
||
],
|
||
commission_tier: [
|
||
{ required: true, message: '请输入团队奖励层级', trigger: 'change' },
|
||
],
|
||
same_level_rate: [
|
||
{ required: true, message: '请输入平级奖比例', trigger: 'change' },
|
||
],
|
||
same_level_tier: [
|
||
{ required: true, message: '请输入平级奖层级', trigger: 'change' },
|
||
],
|
||
upgrade_conditions: [
|
||
{
|
||
validator: function (rule, value, callback) {
|
||
let where = Object.values(value.where);
|
||
if(where.includes('one_people') && Number(value.one_people) <= 0){
|
||
callback(new Error('请输入直推人数要求！'));
|
||
}else if(where.includes('team_people') && Number(value.team_people) <= 0){
|
||
callback(new Error('请输入团队人数要求！'));
|
||
}else if(where.includes('one_money') && Number(value.one_money) <= 0){
|
||
callback(new Error('请输入直推业绩金额要求！'));
|
||
}else if(where.includes('team_money') && Number(value.team_money) <= 0){
|
||
callback(new Error('请输入团队业绩金额要求！'));
|
||
}else if(where.includes('buy_goods') && Object.values(value.buy_goods || {}).length <= 0){
|
||
callback(new Error('请至少选择一个商品！'));
|
||
}else{
|
||
callback();
|
||
}
|
||
}, trigger: 'change'
|
||
}
|
||
],
|
||
}
|
||
|
||
};
|
||
},
|
||
mounted(){
|
||
this.getList(1);
|
||
},
|
||
methods: {
|
||
// 获取列表
|
||
getList(num) {
|
||
let _this = this;
|
||
_this.listLoading = true;
|
||
_this.tableFrom.page = num ? num : this.tableFrom.page;
|
||
$.ajax({
|
||
url: ns.url("team://shop/index/level"),
|
||
data: { params: _this.tableFrom },
|
||
dataType: 'JSON',
|
||
type: 'POST',
|
||
success: function(res) {
|
||
if(Number(res.code) === 0){
|
||
let data = res.data || {};
|
||
_this.tableData.data = data.list || {};
|
||
_this.tableData.total = data.count || 0;
|
||
_this.listLoading = false;
|
||
}
|
||
}
|
||
});
|
||
},
|
||
pageChange(page) {
|
||
this.tableFrom.page = page;
|
||
this.getList('');
|
||
},
|
||
// 等级编辑 - 添加 or 编辑信息
|
||
editLevel(info = {}){
|
||
let defaultInfo = Object.assign({}, this.$options.data().currentInfo);
|
||
let useInfo = defaultInfo;
|
||
if(Object.values(info).length > 0){
|
||
useInfo.id = info.id || 0;
|
||
useInfo.title = info.title || defaultInfo.title;
|
||
useInfo.weight = info.weight || defaultInfo.weight;
|
||
useInfo.commission_rate = info.commission_rate || defaultInfo.commission_rate;
|
||
useInfo.commission_tier = info.commission_tier || defaultInfo.commission_tier;
|
||
useInfo.same_level_rate = info.same_level_rate || defaultInfo.same_level_rate;
|
||
useInfo.same_level_tier = info.same_level_tier || defaultInfo.same_level_tier;
|
||
useInfo.upgrade_type = info.upgrade_type;
|
||
// 信息补齐
|
||
useInfo.upgrade_conditions.where = info.upgrade_conditions.where || defaultInfo.upgrade_conditions.where;
|
||
useInfo.upgrade_conditions.one_people = info.upgrade_conditions.one_people || defaultInfo.upgrade_conditions.one_people;
|
||
useInfo.upgrade_conditions.team_people = info.upgrade_conditions.team_people || defaultInfo.upgrade_conditions.team_people;
|
||
useInfo.upgrade_conditions.one_money = info.upgrade_conditions.one_money || defaultInfo.upgrade_conditions.one_money;
|
||
useInfo.upgrade_conditions.team_money = info.upgrade_conditions.team_money || defaultInfo.upgrade_conditions.team_money;
|
||
useInfo.upgrade_conditions.buy_goods = info.upgrade_conditions.buy_goods || defaultInfo.upgrade_conditions.buy_goods;
|
||
}
|
||
|
||
this.currentInfo = Object.assign({}, useInfo);
|
||
this.editDialog = true;
|
||
},
|
||
// 等级编辑 - 选择商品
|
||
selectGoods(){
|
||
let _this = this;
|
||
let buyGoodsList = Object.assign({}, _this.currentInfo.upgrade_conditions.buy_goods);
|
||
let selectedGoodsIds = [];
|
||
Object.values(buyGoodsList).forEach((item,index) => {
|
||
selectedGoodsIds[index] = item.goods_id;
|
||
});
|
||
goodsSelect(function(res) {
|
||
if (!res.length) return false;
|
||
let buyGoods = {};
|
||
Object.values(res).forEach((item,index) => {
|
||
buyGoods[index] = {
|
||
goods_id: item.goods_id,
|
||
goods_name: item.goods_name,
|
||
goods_image: item.goods_image,
|
||
};
|
||
});
|
||
_this.currentInfo.upgrade_conditions.buy_goods = Object.assign({}, buyGoods);
|
||
_this.$forceUpdate();
|
||
}, selectedGoodsIds,{max_num:20,disabled:1});
|
||
},
|
||
// 等级编辑 - 删除商品
|
||
deleteGoods(goods_id){
|
||
let _this = this;
|
||
let goodsList = Object.assign({}, _this.currentInfo.upgrade_conditions.buy_goods);
|
||
Object.values(goodsList).forEach((item,index)=>{
|
||
if(Number(item.goods_id) === Number(goods_id)) {
|
||
delete goodsList[index];
|
||
}
|
||
});
|
||
|
||
_this.currentInfo.upgrade_conditions.buy_goods = Object.assign({}, Object.values(goodsList));
|
||
_this.$forceUpdate();
|
||
},
|
||
// 等级编辑 - 提交
|
||
submitSave(){
|
||
let _this = this;
|
||
_this.$refs['formData'].validate((valid) => {
|
||
if (valid) {
|
||
$.ajax({
|
||
url: ns.url("team://shop/index/levelEdit"),
|
||
data: { info: _this.currentInfo },
|
||
dataType: 'JSON',
|
||
type: 'POST',
|
||
success: function(res) {
|
||
if(Number(res.code) === 0){
|
||
_this.getList('');
|
||
_this.editDialog = false;
|
||
}
|
||
_this.$alert(res.message);
|
||
}
|
||
});
|
||
}
|
||
});
|
||
},
|
||
// 点击删除等级
|
||
deleteLevel(id){
|
||
let _this = this;
|
||
_this.$confirm('确认删除当前等级吗', {
|
||
confirmButtonText: '确认删除',
|
||
cancelButtonText: '取消删除',
|
||
}).then(() => {
|
||
$.ajax({
|
||
url: ns.url("team://shop/index/levelDel"),
|
||
data: { id: id },
|
||
dataType: 'JSON',
|
||
type: 'POST',
|
||
success: function(res) {
|
||
_this.getList('');
|
||
_this.$alert(res.message);
|
||
}
|
||
});
|
||
}).catch(() => {})
|
||
},
|
||
// 处理商品图片
|
||
goodsImgHandle(goods_image){
|
||
let imgArr = goods_image.split(',')
|
||
|
||
return imgArr[0] || '/public/static/img/default_img/article.png';
|
||
}
|
||
}
|
||
});
|
||
</script>
|
||
{/block} |