jh-admin/addon/team/shop/view/index/index.html

359 lines
13 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

{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;
}
.user-content{
width: 100%;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: center;
align-items: center;
}
.user-content .user-avatar{
height: 65px;
width: 65px;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: center;
align-items: center;
}
.user-content .user-avatar img{
height: 80%!important;
width: 80%!important;
border-radius: 50% !important;
}
.user-content .user-info{
width: calc(100% - 70px) !important;
display: inline-flex;
flex-direction: column;
flex-wrap: nowrap;
justify-content: center;
align-items: flex-start;
}
.user-content .user-info .nickname{
font-size: 15px;
font-weight: bold;
height: 30px;
line-height: 30px;
width: 100%;
text-align: left;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.user-content .user-info .user-id{
font-size: 13px;
height: 25px;
line-height: 25px;
width: 100%;
text-align: left;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.rate-num{
margin-top: 5px!important;
}
.selWidth {
width: 350px !important;
margin-bottom: 5px;
}
</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-select v-model="tableFrom.level_id" placeholder="请选择等级" class="filter-item selWidth" clearable>
<el-option v-for="(item,index) in level_list" :key="index" :label="item.title" :value="item.id"></el-option>
</el-select>
<el-input v-model="tableFrom.member_id" placeholder="请输入用户ID" 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>
</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 label="用户信息" min-width="230" align="center">
<template slot-scope="scope">
<div class="user-content">
<div class="user-avatar">
<img :src="scope.row.headimg || moren" />
</div>
<div class="user-info">
<div class="nickname">{{ scope.row.nickname || scope.row.username }}</div>
<div class="user-id">UID{{ scope.row.member_id }}</div>
</div>
</div>
</template>
</el-table-column>
<el-table-column label="当前等级" prop="title" min-width="100" align="center"></el-table-column>
<el-table-column label="直推人数" prop="one_people" min-width="80" align="center"></el-table-column>
<el-table-column label="团队人数" prop="team_people" min-width="80" align="center"></el-table-column>
<el-table-column label="直推业绩" prop="one_money" min-width="100" align="center"></el-table-column>
<el-table-column label="团队业绩" prop="team_money" min-width="100" align="center"></el-table-column>
<el-table-column label="操作" min-width="300" align="center">
<template slot-scope="scope">
<el-button type="primary" size="small" @click="updateLevel(scope.row)">修改等级</el-button>
<el-button type="info" size="small" @click="seeChangeRecord(scope.row.id)">变更记录</el-button>
<el-button type="danger" size="small" @click="delInfo(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="editLevelDialog" width="75%" append-to-body :close-on-click-modal="false">
<el-form size="small" label-width="150px">
<el-form-item label="当前等级">
<el-input v-model="currentInfo.title" class="selWidth" type="text" disabled readonly></el-input>
</el-form-item>
<el-form-item label="修改为">
<el-select v-model="update_level_id" placeholder="请选择等级" class="filter-item selWidth">
<el-option v-for="(item,index) in level_list" :key="index" :label="item.title" :value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="">
<el-button v-if="Number(update_level_id) === Number(currentInfo.level_id) || Number(update_level_id) <= 0" type="info" effect="dark" size="small" disabled>提交</el-button>
<el-button v-else type="primary" effect="dark" size="small" @click="updateLevelSubmit">提交</el-button>
</el-form-item>
</el-form>
</el-dialog>
<!-- 查看等级变更记录 -->
<el-dialog title="等级变更记录" :visible.sync="seeDialog" width="75%" append-to-body :close-on-click-modal="false">
<!--表格信息-->
<el-table v-loading="seeListLoading" :data="seeTableData.data" style="width: 100%">
<el-table-column prop="id" label="ID" min-width="50" align="center"></el-table-column>
<el-table-column label="变更前等级" align="center">
<el-table-column prop="front_level_id" label="等级ID" min-width="80" align="center"></el-table-column>
<el-table-column prop="front_level_weight" label="等级权重" min-width="80" align="center"></el-table-column>
<el-table-column prop="front_level_title" label="等级名称" min-width="100" align="center"></el-table-column>
</el-table-column>
<el-table-column label="变更原因" min-width="200" align="center">
<template slot-scope="scope">
<el-tag v-if="scope.row.reason.indexOf('one_people') >= 0" effect="plain" class="rate-num" size="small">直推人数达标</el-tag>
<el-tag v-if="scope.row.reason.indexOf('team_people') >= 0" effect="plain" class="rate-num" size="small">团队人数达标</el-tag>
<el-tag v-if="scope.row.reason.indexOf('one_money') >= 0" effect="plain" class="rate-num" size="small">直推业绩达标</el-tag>
<el-tag v-if="scope.row.reason.indexOf('team_money') >= 0" effect="plain" class="rate-num" size="small">团队业绩达标</el-tag>
<el-tag v-if="scope.row.reason.indexOf('buy_goods') >= 0" effect="plain" class="rate-num" size="small">已购买指定商品之一</el-tag>
<el-tag v-if="scope.row.reason.indexOf('admin_operate') >= 0" effect="plain" class="rate-num" size="small">管理后台手动修改</el-tag>
</template>
</el-table-column>
<el-table-column label="变更后等级" align="center">
<el-table-column prop="after_level_id" label="等级ID" min-width="80" align="center"></el-table-column>
<el-table-column prop="after_level_weight" label="等级权重" min-width="80" align="center"></el-table-column>
<el-table-column prop="after_level_title" label="等级名称" min-width="100" align="center"></el-table-column>
</el-table-column>
<el-table-column prop="create_time" label="变更时间" min-width="140" align="center"></el-table-column>
</el-table>
<!--分页-->
<div class="pagination">
<el-pagination :current-page="seeTableFrom.page" hide-on-single-page :total="seeTableData.total" @current-change="levelChangeLogPageChange"></el-pagination>
</div>
</el-dialog>
</div>
{/block}
{block name="script"}
<script>
new Vue({
el:'#vueContent',
data(){
return {
moren: '/public/static/img/default_img/head.png',
// 列表相关
listLoading: true,
tableData: {
data: [],
total: 0,
},
tableFrom: {
page: 1,
limit: 10,
member_id: '',
level_id: '',
},
// 等级列表
level_list: {},
// 修改等级相关
editLevelDialog: false,
currentInfo: {},
update_level_id: '',
// 等级变更记录相关
seeDialog: false,
seeListLoading: false,
seeTableData: {
data: [],
total: 0,
},
seeTableFrom: {
page: 1,
limit: 10,
team_id: '',
},
};
},
mounted(){
this.getLevelList();
this.getList('');
},
methods: {
// 获取列表
getList(num) {
let _this = this;
_this.listLoading = true;
_this.tableFrom.page = num ? num : this.tableFrom.page;
$.ajax({
url: ns.url("team://shop/index/index"),
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('');
},
// 等级列表
getLevelList() {
let _this = this;
let params = {
page: 1,
limit: 1000,
};
$.ajax({
url: ns.url("team://shop/index/level"),
data: { params: params },
dataType: 'JSON',
type: 'POST',
success: function(res) {
if(Number(res.code) === 0){
let data = res.data || {};
_this.level_list = data.list || {};
}
}
});
},
// 修改等级 - 显示弹框
updateLevel(info){
let _this = this;
_this.currentInfo = Object.assign({}, info);
_this.update_level_id = '';
_this.editLevelDialog = true;
},
// 修改等级 - 提交修改
updateLevelSubmit(){
let _this = this;
_this.$confirm('确认修改当前用户的团队等级吗?', {
confirmButtonText: '确认修改',
cancelButtonText: '取消修改',
}).then(() => {
$.ajax({
url: ns.url("team://shop/index/teamLevelUpdate"),
data: {
level_id: _this.update_level_id,
member_id: _this.currentInfo.member_id
},
dataType: 'JSON',
type: 'POST',
success: function(res) {
if(Number(res.code) === 0){
_this.getList('');
_this.editLevelDialog = false;
}
_this.$alert(res.message);
}
});
}).catch(() => {})
},
// 查看等级变更记录 - 显示弹框
seeChangeRecord(id){
this.seeTableFrom.team_id = id || 0;
this.getLevelChangeLogList(1);
this.seeDialog = true;
},
// 查看等级变更记录 - 获取列表
getLevelChangeLogList(num) {
let _this = this;
_this.seeListLoading = true;
_this.seeTableFrom.page = num ? num : this.seeTableFrom.page;
$.ajax({
url: ns.url("team://shop/index/getTeamLevelChangeLog"),
data: { params: _this.seeTableFrom },
dataType: 'JSON',
type: 'POST',
success: function(res) {
if(Number(res.code) === 0){
let data = res.data || {};
_this.seeTableData.data = data.list || {};
_this.seeTableData.total = data.count || 0;
_this.seeListLoading = false;
}
}
});
},
levelChangeLogPageChange(page) {
this.seeTableFrom.page = page;
this.getLevelChangeLogList('');
},
// 删除信息
delInfo(id){
let _this = this;
_this.$confirm('确认删除当前信息吗?', {
confirmButtonText: '确认删除',
cancelButtonText: '取消删除',
}).then(() => {
$.ajax({
url: ns.url("team://shop/index/delInfo"),
data: {
team_id: id
},
dataType: 'JSON',
type: 'POST',
success: function(res) {
if(Number(res.code) === 0){
_this.getList('');
_this.editLevelDialog = false;
}
_this.$alert(res.message);
}
});
}).catch(() => {})
}
}
});
</script>
{/block}