523 lines
22 KiB
Vue
523 lines
22 KiB
Vue
<template>
|
||
<section class="content">
|
||
<div class="box box-primary">
|
||
<div class="box-body">
|
||
<section class="content-header">
|
||
<h1 id="itemTitle"></h1>
|
||
</section>
|
||
|
||
<section class="content">
|
||
<div id="table"></div>
|
||
<div id="toolbar">
|
||
<div class="search-wrapper">
|
||
<label for="erbanNum" class="control-label">平台号:</label>
|
||
<input type="text" class="" name="erbanNum" id="erbanNum">
|
||
<!--<label for="nobleType" class="control-label">贵族类型:</label>-->
|
||
<select name="nobleType" id="checkType" class="">
|
||
<option value="1">指定用户贵族信息</option>
|
||
<option value="2">指定用户的开通记录</option>
|
||
</select>
|
||
<button id="btnSearch" class="btn btn-sm btn-primary">查询</button>
|
||
<button id="addBtn" class="btn btn-default">
|
||
<i class="glyphicon glyphicon-plus"></i>增加
|
||
</button>
|
||
</div>
|
||
<!--<div class="button-wrapper">-->
|
||
<!--<button id="btnExper" class="btn btn-sm btn-primary">体验</button>-->
|
||
<!--<button id="btnOpen" class="btn btn-sm btn-primary">开通</button>-->
|
||
<!--<button id="btnRenew" class="btn btn-sm btn-primary">续费</button>-->
|
||
<!--</div>-->
|
||
</div>
|
||
<!--<form id="openForm" class="form-horizontal">-->
|
||
<!--<div class="col-sm-8">-->
|
||
<!--<label for="erbanNum" class="col-sm-4 control-label">平台号:</label>-->
|
||
<!--<div class="col-sm-3">-->
|
||
<!--<span><input type="text" class="form-control validate[required]" name="erbanNum" id="erbanNum" ></span>-->
|
||
<!--</div>-->
|
||
<!--</div>-->
|
||
<!--<div class="col-sm-8">-->
|
||
<!--<label for="nobleType" class="col-sm-4 control-label">贵族类型:</label>-->
|
||
<!--<div class="col-sm-6">-->
|
||
<!--<select name="nobleType" id="nobleType" class="col-sm-3">-->
|
||
<!--</select>-->
|
||
<!--</div>-->
|
||
<!--</div>-->
|
||
<!--</form>-->
|
||
<!--<div class="modal-footer">-->
|
||
<!--<button id="btnSearch" class="btn btn-sm btn-primary">查询</button>-->
|
||
<!--<button id="btnOpen" class="btn btn-sm btn-primary">开通</button>-->
|
||
<!--<button id="btnRenew" class="btn btn-sm btn-primary">续费</button>-->
|
||
<!--</div>-->
|
||
</section>
|
||
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<!-- 为用户增加贵族段位 -->
|
||
<div class="modal fade" id="addNobleModal" tabindex="-1" role="dialog" aria-labelledby="modalLabel">
|
||
<div class="modal-dialog" role="document">
|
||
<div class="modal-content">
|
||
<div class="modal-header">
|
||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
|
||
aria-hidden="true">x</span></button>
|
||
<h4 class="modal-title" id="modalLabel">操作贵族</h4>
|
||
</div>
|
||
<div class="modal-body">
|
||
<form class="form-horizontal" id="carAddForm">
|
||
<div class="form-group">
|
||
<label for="addErbanNo" class="col-sm-3 control-label">平台号</label>
|
||
<div class="col-sm-7 control-label">
|
||
<textarea type="text" name="erbanNo" id="addErbanNo" class="form-control validate[required]"
|
||
placeholder="请输入平台号，多个请用英文逗号,隔开，最多不超300个" />
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="nobleType" class="col-sm-3 control-label">贵族段位</label>
|
||
<div class="col-sm-2 control-label">
|
||
<!--<select name="carId" id="addCarId">-->
|
||
<!--<option value="">-- 请选择 --</option>-->
|
||
<!--</select>-->
|
||
<select name="nobleType" id="nobleType" class="">
|
||
</select>
|
||
</div>
|
||
<!--<label for="nobleType" class="control-label">贵族类型:</label>-->
|
||
<!--<select name="nobleType" id="nobleType" class="">-->
|
||
<!--</select>-->
|
||
</div>
|
||
<div class="form-group opt-group">
|
||
<label for="addOpt" class="col-sm-3 control-label">体验天数</label>
|
||
<div class="col-sm-7 control-label">
|
||
<select name="days" id="addOpt">
|
||
<option value="1">开通</option>
|
||
<option value="2">续费</option>
|
||
<option value="3">体验</option>
|
||
</select>
|
||
<span class="tips">开通会打公帐而且会返钻石</span>
|
||
</div>
|
||
</div>
|
||
<div class="form-group toggle-group">
|
||
<label for="addDays" class="col-sm-3 control-label">体验天数</label>
|
||
<div class="col-sm-2 control-label">
|
||
<!--<input type="number" name="desc" id="addDesc" class="form-control validate[required]" />-->
|
||
<select name="days" id="addDays">
|
||
<option value="1">1天</option>
|
||
<option value="3">3天</option>
|
||
<option value="5">5天</option>
|
||
<option value="7">7天</option>
|
||
<option value="15">15天</option>
|
||
<option value="30">30天</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
<div class="modal-footer">
|
||
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
|
||
<button type="button" class="btn btn-primary" id="save">保存</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import TableHelper from '@/utils/bootstrap-table-helper';
|
||
|
||
var tipsArr = [
|
||
'开通会打公帐而且会返钻石',
|
||
'续费会打公帐而且会返钻石',
|
||
'体验不会打公帐也不会返还钻石'
|
||
];
|
||
export default {
|
||
name: "NobleAdminView",
|
||
setup() {
|
||
return {};
|
||
},
|
||
created() {
|
||
this.$nextTick(function () {
|
||
this.initData();
|
||
});
|
||
},
|
||
methods: {
|
||
initData() {
|
||
$(function () {
|
||
setSelectOption();
|
||
|
||
function refreshNobleUser() {
|
||
$('#table').bootstrapTable('destroy');
|
||
$('#table').bootstrapTable({
|
||
columns: [
|
||
{ field: 'erbanNo', title: '平台号', align: 'center', valign: 'middle', width: '10%' },
|
||
{
|
||
field: 'expire', title: '有效时间', align: 'center', valign: 'middle', formatter: function (val, row, index) {
|
||
if (val) {
|
||
var date = new Date(val);
|
||
return date.format("yyyy-MM-dd hh:mm:ss");
|
||
} else {
|
||
return '-';
|
||
}
|
||
}
|
||
},
|
||
{ field: 'nick', title: '昵称', align: 'center', valign: 'middle', width: '10%' },
|
||
{ field: 'nobleName', title: '贵族名称', align: 'center', valign: 'middle', width: '10%' },
|
||
{
|
||
field: 'openTime', title: '开通时间', align: 'center', valign: 'middle', formatter: function (val, row, index) {
|
||
if (val) {
|
||
var date = new Date(val);
|
||
return date.format("yyyy-MM-dd hh:mm:ss");
|
||
} else {
|
||
return '-';
|
||
}
|
||
}
|
||
},
|
||
{
|
||
field: 'renewTime', title: '续费时间', align: 'center', valign: 'middle', formatter: function (val, row, index) {
|
||
if (val) {
|
||
var date = new Date(val);
|
||
return date.format("yyyy-MM-dd hh:mm:ss");
|
||
} else {
|
||
return '-';
|
||
}
|
||
}
|
||
}
|
||
],
|
||
type: "get",
|
||
cache: false,
|
||
striped: true,
|
||
showRefresh: false,
|
||
pageSize: 10,
|
||
pagination: true,
|
||
pageList: [10, 20, 30, 50],
|
||
sidePagination: "server", //表示服务端请求
|
||
queryParamsType: "undefined",
|
||
queryParams: function queryParams(params) { //设置查询参数
|
||
var param = {
|
||
erbanNo: $('#erbanNum').val()
|
||
};
|
||
return param;
|
||
},
|
||
uniqueId: 'code',
|
||
toolbar: '#toolbar',
|
||
url: '/admin/nobleAdmin/getUser',
|
||
dataType: 'json',
|
||
onLoadSuccess: function () { //加载成功时执行
|
||
console.log("load success");
|
||
},
|
||
onLoadError: function () { //加载失败时执行
|
||
console.log("load fail");
|
||
}
|
||
})
|
||
}
|
||
|
||
function refreshNobleUserRecord() {
|
||
$('#table').bootstrapTable('destroy');
|
||
$('#table').bootstrapTable({
|
||
columns: [
|
||
{ field: 'roomUid', title: '开通房间房主号', align: 'center', valign: 'middle', width: '10%' },
|
||
{
|
||
field: 'money', title: '钱', align: 'center', valign: 'middle', width: '10%', formatter: function (val, row, index) {
|
||
if (val) {
|
||
return val + '元';
|
||
}
|
||
}
|
||
},
|
||
{ field: 'nobleName', title: '贵族名称', align: 'center', valign: 'middle', width: '10%' },
|
||
{ field: 'goldNum', title: '钻石数', align: 'center', valign: 'middle', width: '10%' },
|
||
{
|
||
field: 'nobleDays', title: '贵族选择时间', align: 'center', valign: 'middle', width: '10%', formatter: function (val, row, index) {
|
||
if (val) {
|
||
return val + '天';
|
||
}
|
||
}
|
||
},
|
||
{
|
||
field: 'payType', title: '支付类型', align: 'center', valign: 'middle', formatter: function (val, row, index) {
|
||
switch (val) {
|
||
case 1:
|
||
return '钻石开通';
|
||
|
||
case 2:
|
||
return '用户付款开通';
|
||
|
||
case 3:
|
||
return '打款公账开通';
|
||
|
||
case 4:
|
||
return '官方体验赠送';
|
||
|
||
case 5:
|
||
return '摇一摇中奖';
|
||
|
||
}
|
||
}
|
||
},
|
||
{
|
||
field: 'optType', title: '操作类型', align: 'center', valign: 'middle', width: '10%', formatter: function (val, row, index) {
|
||
switch (val) {
|
||
case 1:
|
||
return '开通';
|
||
|
||
case 2:
|
||
return '续费';
|
||
|
||
case 3:
|
||
return '体验';
|
||
|
||
}
|
||
}
|
||
},
|
||
{
|
||
field: 'createTime', title: '创建时间', align: 'center', valign: 'middle', formatter: function (val, row, index) {
|
||
if (val) {
|
||
var date = new Date(val);
|
||
return date.format("yyyy-MM-dd hh:mm:ss");
|
||
} else {
|
||
return '-';
|
||
}
|
||
}
|
||
}
|
||
],
|
||
type: "get",
|
||
cache: false,
|
||
striped: true,
|
||
showRefresh: false,
|
||
pageSize: 10,
|
||
pagination: true,
|
||
pageList: [10, 20, 30, 50],
|
||
sidePagination: "server", //表示服务端请求
|
||
queryParamsType: "undefined",
|
||
queryParams: function queryParams(params) { //设置查询参数
|
||
var param = {
|
||
pageNumber: params.pageNumber,
|
||
pageSize: params.pageSize,
|
||
erbanNo: $('#erbanNum').val()
|
||
};
|
||
return param;
|
||
},
|
||
uniqueId: 'code',
|
||
toolbar: '#toolbar',
|
||
url: '/admin/nobleAdmin/getUserNobleRecord',
|
||
dataType: 'json',
|
||
onLoadSuccess: function () { //加载成功时执行
|
||
console.log("load success");
|
||
},
|
||
onLoadError: function () { //加载失败时执行
|
||
console.log("load fail");
|
||
}
|
||
})
|
||
}
|
||
/*查询刷新*/
|
||
$('#btnSearch').on('click', function () {
|
||
var checkType = $('#checkType').val();
|
||
if (checkType == 1) {
|
||
refreshNobleUser();
|
||
} else if (checkType == 2) {
|
||
refreshNobleUserRecord();
|
||
}
|
||
|
||
})
|
||
|
||
$('#addOpt').on('change', function () {
|
||
var val = $(this).val();
|
||
$('.tips').html(tipsArr[val - 1]);
|
||
if (val == 3) {
|
||
$('.toggle-group').show();
|
||
} else {
|
||
$('.toggle-group').hide();
|
||
}
|
||
});
|
||
|
||
$('#save').on('click', function () {
|
||
var erbanNo = $('#addErbanNo').val();
|
||
console.log(erbanNo);
|
||
if (erbanNo == '') {
|
||
$("#tipMsg").text("请输入平台号");
|
||
$("#tipModal").modal('show');
|
||
return;
|
||
}
|
||
var optType = $('#addOpt').val();
|
||
var multiErbanNo = erbanNo.match(',');
|
||
if (multiErbanNo && optType != 3) {
|
||
$("#tipMsg").text("开通/续费贵族不支持多个平台号");
|
||
$("#tipModal").modal('show');
|
||
return;
|
||
}
|
||
$("#tipMsg").text("操作中，请稍后...");
|
||
$("#tipModal").modal('show');
|
||
if (optType == 1) {
|
||
// 开通
|
||
openNoble();
|
||
} else if (optType == 2) {
|
||
// 续费
|
||
renewNoble();
|
||
} else if (optType == 3) {
|
||
// 体验
|
||
experNoble();
|
||
}
|
||
});
|
||
|
||
$('#addBtn').on('click', function () {
|
||
$('#addErbanNo').val('');
|
||
$('#addNobleModal').modal("show");
|
||
});
|
||
|
||
});
|
||
}
|
||
},
|
||
|
||
};
|
||
|
||
function openNoble() {
|
||
$.ajax({
|
||
type: "post",
|
||
url: "/admin/nobleAdmin/openNoble",
|
||
data: {
|
||
erbanNo: $("#addErbanNo").val(),
|
||
nobleId: $("#nobleType").val()
|
||
},
|
||
dataType: 'json',
|
||
success: function (data) {
|
||
if (data == 1) {
|
||
$("#tipMsg").text("开通成功");
|
||
$("#tipModal").modal('show');
|
||
TableHelper.doRefresh("#table");
|
||
} else if (data == 2) {
|
||
$("#tipMsg").text("开通失败,该用户已开通此等级贵族");
|
||
$("#tipModal").modal('show');
|
||
TableHelper.doRefresh("#table");
|
||
} else if (data == 4) {
|
||
$("#tipMsg").text("开通失败,该账户余额不足");
|
||
$("#tipModal").modal('show');
|
||
TableHelper.doRefresh("#table");
|
||
}
|
||
else {
|
||
$("#tipMsg").text("开通失败，错误码：" + data);
|
||
$("#tipModal").modal('show');
|
||
}
|
||
}
|
||
})
|
||
}
|
||
function renewNoble() {
|
||
$.ajax({
|
||
type: "post",
|
||
url: "/admin/nobleAdmin/renewNoble",
|
||
data: {
|
||
erbanNo: $("#addErbanNo").val(),
|
||
nobleId: $("#nobleType").val()
|
||
},
|
||
dataType: 'json',
|
||
success: function (data) {
|
||
if (data == 1) {
|
||
$('#addSendMessage').modal('hide');
|
||
$("#tipMsg").text("续费成功");
|
||
$("#tipModal").modal('show');
|
||
TableHelper.doRefresh("#table");
|
||
} else {
|
||
$("#tipMsg").text("续费失败，错误码：" + data);
|
||
$("#tipModal").modal('show');
|
||
}
|
||
}
|
||
})
|
||
}
|
||
|
||
function experNoble() {
|
||
$.ajax({
|
||
type: "post",
|
||
url: "/admin/nobleAdmin/experNoble",
|
||
data: {
|
||
erbanNoList: $("#addErbanNo").val(),
|
||
nobleId: $("#nobleType").val(),
|
||
days: $('#addDays').val()
|
||
},
|
||
dataType: 'json',
|
||
success: function (res) {
|
||
if (res.code == 200) {
|
||
$('#addSendMessage').modal('hide');
|
||
$("#tipMsg").text("添加体验成功");
|
||
$("#tipModal").modal('show');
|
||
TableHelper.doRefresh("#table");
|
||
} else {
|
||
$("#tipMsg").text("添加体验失败，错误码：" + res.code + "，错误原因：" + res.message + "，错误列表为" + res.data);
|
||
$("#tipModal").modal('show');
|
||
}
|
||
}
|
||
})
|
||
}
|
||
|
||
/*下载数据*/
|
||
function setSelectOption() {
|
||
$.ajax({
|
||
type: "get",
|
||
url: '/admin/nobleAdmin/getNobleRight',
|
||
dataType: 'json',
|
||
success: function (res) {
|
||
var data = res;
|
||
makeOption(data);
|
||
}
|
||
})
|
||
function makeOption(data) {
|
||
var str = '';
|
||
for (var i = 0; i < data.length; i++) {
|
||
str += '<option value="' + data[i].id + '">' + data[i].name + '</option>';
|
||
}
|
||
$('#nobleType').html(str);
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
.bar1,
|
||
.bar2 {
|
||
margin-bottom: 10px;
|
||
}
|
||
|
||
label.col-sm-1 {
|
||
padding: 0;
|
||
line-height: 30px;
|
||
text-align: right;
|
||
/*padding-right: 4px;*/
|
||
}
|
||
|
||
label.col-sm-1 {
|
||
padding: 0;
|
||
line-height: 30px;
|
||
text-align: right;
|
||
/*padding-right: 4px;*/
|
||
}
|
||
|
||
input,
|
||
select {
|
||
margin-left: 8px;
|
||
margin-right: 8px;
|
||
}
|
||
|
||
#btnSearch {
|
||
margin-left: 36px;
|
||
margin-right: 20px;
|
||
}
|
||
|
||
.button-wrapper {
|
||
margin-top: 10px;
|
||
}
|
||
|
||
.record {
|
||
margin-top: 10px;
|
||
}
|
||
|
||
.record .title {
|
||
font-size: 16px;
|
||
}
|
||
|
||
.toggle-group {
|
||
display: none;
|
||
}
|
||
|
||
.tips {
|
||
font-size: 13px;
|
||
color: red;
|
||
}
|
||
|
||
.opt-group .col-sm-7 {
|
||
text-align: left;
|
||
}
|
||
</style> |