2023-09-19 10:55:46 +08:00
|
|
|
|
<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">
|
|
|
|
|
|
<!-- Nav tabs -->
|
|
|
|
|
|
<ul class="nav nav-tabs" role="tablist">
|
|
|
|
|
|
<li role="presentation" class="active"><a href="#item" aria-controls="item" role="tab"
|
|
|
|
|
|
data-toggle="tab">单项</a></li>
|
|
|
|
|
|
<li role="presentation"><a href="#item-group" aria-controls="item-group" role="tab"
|
|
|
|
|
|
data-toggle="tab">组合</a></li>
|
|
|
|
|
|
</ul>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- Tab panes -->
|
|
|
|
|
|
<div class="tab-content">
|
|
|
|
|
|
<div role="tabpanel" class="tab-pane active" id="item">
|
|
|
|
|
|
<section class="content">
|
|
|
|
|
|
<div class="group-table-section">
|
|
|
|
|
|
<div class="prize-group-wrapper js-normal-prize-group-wrapper">
|
|
|
|
|
|
<div class="header-wrapper">
|
|
|
|
|
|
<div class="right-content js-no-editing">
|
|
|
|
|
|
<div class="action-btn-wrap"><button class="btn btn-primary js-edit-group"
|
|
|
|
|
|
data-pool-type="1">编辑</button></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="right-content right-content-edit js-editing">
|
|
|
|
|
|
<div class="action-btn-wrap">
|
|
|
|
|
|
<button class="btn btn-primary js-add-prize">新增</button>
|
|
|
|
|
|
<button class="btn btn-danger js-save-edit">保存</button>
|
|
|
|
|
|
<button class="btn btn-default js-cancel-edit">取消</button>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<table class="prize-group-table table table-hover table-striped">
|
|
|
|
|
|
<tr>
|
|
|
|
|
|
<th>ID</th>
|
|
|
|
|
|
<th>名称</th>
|
|
|
|
|
|
<th>图片</th>
|
|
|
|
|
|
<th>倍数</th>
|
|
|
|
|
|
</tr>
|
|
|
|
|
|
</table>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</section>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div role="tabpanel" class="tab-pane" id="item-group">
|
|
|
|
|
|
<section class="content">
|
|
|
|
|
|
<div id="toolbar">
|
|
|
|
|
|
<button id="addBtn" class="btn btn-primary">
|
|
|
|
|
|
<i class="glyphicon glyphicon-plus"></i>增加
|
|
|
|
|
|
</button>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<table id="table"></table>
|
|
|
|
|
|
</section>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</section>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 添加弹窗 -->
|
|
|
|
|
|
<div class="modal fade" id="addModal" 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="addModalLabel">新增</h4>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="modal-body">
|
|
|
|
|
|
<form class="form-horizontal" id="addForm">
|
|
|
|
|
|
<input type="hidden" name="id" id="id" />
|
|
|
|
|
|
<div class="form-group">
|
|
|
|
|
|
<label for="modal_name" class="col-sm-3 control-label">名称<font color="red">*</font>:</label>
|
|
|
|
|
|
<div class="col-sm-9">
|
|
|
|
|
|
<input type="text" class="form-control validate[required]" name="name" id="modal_name"
|
|
|
|
|
|
placeholder="配置名称只能为中文，数字，大小写英文与下划线">
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="form-group">
|
|
|
|
|
|
<label class="col-sm-3 control-label">配置图片<font color="red">*</font>:</label>
|
|
|
|
|
|
<div class="col-sm-9">
|
|
|
|
|
|
<img src="" id="picImage" style="width:250px;height:90px;" alt="">
|
|
|
|
|
|
<input type="file" id="picUploadFile" name="file">
|
|
|
|
|
|
<button class="btn btn-success" type="button" id="picUploadBtn">上传</button>
|
|
|
|
|
|
<input type="hidden" id="picUrl" name="imgUrl" class="form-control validate[required]" />
|
|
|
|
|
|
<span id="picImgInfo" style="color:red;"></span>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="form-group">
|
|
|
|
|
|
<label for="module_multiple" class="col-sm-3 control-label">倍数:<font color="red">*</font>
|
|
|
|
|
|
:</label>
|
|
|
|
|
|
<div class="col-sm-9">
|
|
|
|
|
|
<input type="text" class="input-sm form-control datetime validate[required]" name="multiple"
|
|
|
|
|
|
id="module_multiple" placeholder="倍数需要大于等于1">
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</form>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="modal-footer">
|
|
|
|
|
|
<button class="btn btn-default" type="button" id="addCancel">取消</button>
|
|
|
|
|
|
<button class="btn btn-primary" type="button" id="addSave">保存</button>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 添加弹窗 -->
|
|
|
|
|
|
<div class="modal fade" id="groupModal" 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="groupModalLabel">编辑</h4>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="modal-body">
|
|
|
|
|
|
<form class="form-horizontal" id="groupForm">
|
|
|
|
|
|
<input type="hidden" name="id" id="groupId" />
|
|
|
|
|
|
<div class="form-group">
|
|
|
|
|
|
<label for="name" class="col-sm-3 control-label">名称<font color="red">*</font>:</label>
|
|
|
|
|
|
<div class="col-sm-9">
|
|
|
|
|
|
<input type="text" class="form-control validate[required]" name="name" id="name"
|
|
|
|
|
|
placeholder="配置名称只能为中文，数字，大小写英文与下划线">
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="form-group">
|
|
|
|
|
|
<label for="itemIds" class="col-sm-3 control-label">开奖id<font color="red">*</font>:</label>
|
|
|
|
|
|
<div class="col-sm-9">
|
|
|
|
|
|
<input type="text" class="form-control validate[required]" name="itemIds" id="itemIds">
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="form-group">
|
|
|
|
|
|
<label for="status" class="col-sm-3 control-label">状态<font color="red">*</font>:</label>
|
|
|
|
|
|
<div class="col-sm-9">
|
|
|
|
|
|
<input class="checkbox" type="checkbox" id="status">
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</form>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="modal-footer">
|
|
|
|
|
|
<button class="btn btn-default" type="button" id="cancel">取消</button>
|
|
|
|
|
|
<button class="btn btn-primary" type="button" id="save">保存</button>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="modal fade" id="tipModal" tabindex="-1" role="dialog" aria-labelledby="modalLabel">
|
|
|
|
|
|
<div class="modal-dialog" role="document">
|
|
|
|
|
|
<div class="modal-content">
|
|
|
|
|
|
<div class="modal-header">
|
|
|
|
|
|
<h4 class="modal-title">提示信息</h4>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="modal-body" id="tipMsg"></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
|
|
|
|
|
|
|
export default {
|
|
|
|
|
|
name: "LuckySeaItemAdminView",
|
|
|
|
|
|
setup() {
|
|
|
|
|
|
return {};
|
|
|
|
|
|
},
|
|
|
|
|
|
created() {
|
|
|
|
|
|
this.$nextTick(function () {
|
|
|
|
|
|
this.initData();
|
|
|
|
|
|
});
|
|
|
|
|
|
},
|
|
|
|
|
|
methods: {
|
|
|
|
|
|
initData() {
|
|
|
|
|
|
$(function () {
|
|
|
|
|
|
let isSeniorPrizeEditing;
|
|
|
|
|
|
let seniorPrizeGroupCache;
|
|
|
|
|
|
$('#table').bootstrapTable('destroy');
|
|
|
|
|
|
$('#table').bootstrapTable({
|
|
|
|
|
|
columns: [
|
|
|
|
|
|
{ field: 'id', title: 'id', align: 'center', valign: 'middle', width: '10%' },
|
|
|
|
|
|
{ field: 'name', title: '组合名', align: 'center', valign: 'middle', width: '10%' },
|
|
|
|
|
|
{ field: 'itemIds', title: '礼物清单', align: 'center', valign: 'middle', width: '20%' },
|
|
|
|
|
|
{ field: 'itemNames', title: '礼物清单', align: 'center', valign: 'middle', width: '20%' },
|
|
|
|
|
|
{
|
|
|
|
|
|
field: 'status',
|
|
|
|
|
|
title: '状态',
|
|
|
|
|
|
align: 'center',
|
|
|
|
|
|
width: '10%',
|
|
|
|
|
|
valign: 'middle',
|
|
|
|
|
|
formatter: function (val, row, index) {
|
|
|
|
|
|
return val == 0 ? "关闭" : "开启";
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
field: 'tmp',
|
|
|
|
|
|
title: '操作',
|
|
|
|
|
|
align: 'center',
|
|
|
|
|
|
width: '10%',
|
|
|
|
|
|
valign: 'middle',
|
|
|
|
|
|
formatter: function (val, row, index) {
|
|
|
|
|
|
return "<button class='btn btn-sm btn-primary opt-edit' data-id=" + row.id + ">编辑</button>" + " " +
|
|
|
|
|
|
"<button class='btn btn-sm btn-danger opt-del' data-id=" + row.id + ">删除</button>";
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
],
|
|
|
|
|
|
showRefresh: true,
|
|
|
|
|
|
pagination: false,
|
|
|
|
|
|
sidePagination: "null", //表示服务端请求
|
|
|
|
|
|
//设置为undefined可以获取pageNumber，pageSize，searchText，sortName，sortOrder
|
|
|
|
|
|
//设置为limit可以获取limit, offset, search, sort, order
|
|
|
|
|
|
queryParamsType: "undefined",
|
|
|
|
|
|
uniqueId: 'id',
|
|
|
|
|
|
toolbar: '#toolbar',
|
|
|
|
|
|
url: '/admin/luckySea/listItemGroup.action',
|
|
|
|
|
|
onLoadSuccess: function (data) { //加载成功时执行
|
|
|
|
|
|
console.log("load success");
|
|
|
|
|
|
},
|
|
|
|
|
|
onLoadError: function () { //加载失败时执行
|
|
|
|
|
|
console.log("load fail");
|
|
|
|
|
|
}
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
$("#table").on("click", '.opt-edit', function () {
|
|
|
|
|
|
const id = $(this).attr("data-id");
|
|
|
|
|
|
const row = $('#table').bootstrapTable('getRowByUniqueId', id);
|
|
|
|
|
|
$('#groupId').val(row.id);
|
|
|
|
|
|
$('#name').val(row.name);
|
|
|
|
|
|
$('#itemIds').val(row.itemIds);
|
|
|
|
|
|
$('#status').prop('checked', row.status == 1);
|
|
|
|
|
|
$('#groupModal').modal('show');
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
$("#table").on("click", '.opt-del', function () {
|
|
|
|
|
|
const id = $(this).attr("data-id");
|
|
|
|
|
|
if (confirm("你确定要移除吗？")) {
|
|
|
|
|
|
$.ajax({
|
|
|
|
|
|
type: "post",
|
|
|
|
|
|
url: "/admin/luckySea/delItemGroup",
|
|
|
|
|
|
data: { id },
|
|
|
|
|
|
success: function (json) {
|
|
|
|
|
|
if (json.code == 200) {
|
|
|
|
|
|
$("#tipMsg").text("删除成功");
|
|
|
|
|
|
$("#tipModal").modal('show');
|
|
|
|
|
|
$('#table').bootstrapTable('refresh');
|
|
|
|
|
|
} else {
|
|
|
|
|
|
$("#tipMsg").text("删除失败." + json.message);
|
|
|
|
|
|
$("#tipModal").modal('show');
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
$('#addBtn').on('click', function () {
|
|
|
|
|
|
$('#groupForm')[0].reset();
|
|
|
|
|
|
$('#status').attr('checked', true);
|
|
|
|
|
|
$('#groupModal').modal('show');
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
$('#cancel').on('click', function () {
|
|
|
|
|
|
$('#groupModal').modal('hide');
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
$('#save').on('click', function () {
|
|
|
|
|
|
const id = $('#groupId').val();
|
|
|
|
|
|
const name = $('#name').val();
|
|
|
|
|
|
if (undefined == name || "" == name || name.length < 1 || name.length > 5) {
|
|
|
|
|
|
alert("组合名不能为空，且不能超过5个字")
|
|
|
|
|
|
return;
|
|
|
|
|
|
}
|
|
|
|
|
|
const itemIds = $('#itemIds').val();
|
|
|
|
|
|
console.info(!itemIds.includes(','))
|
|
|
|
|
|
if (undefined == itemIds || "" == itemIds || !itemIds.includes(',') || itemIds.split(",").length < 2
|
|
|
|
|
|
|| itemIds.split(",").some(id => "" == id)) {
|
|
|
|
|
|
alert("开奖ID不能少于两个")
|
|
|
|
|
|
return;
|
|
|
|
|
|
}
|
|
|
|
|
|
const status = $('#status').is(':checked') ? 1 : 0;
|
|
|
|
|
|
$.ajax({
|
|
|
|
|
|
type: "post",
|
|
|
|
|
|
url: "/admin/luckySea/saveItemGroup",
|
|
|
|
|
|
data: { id, name, itemIds, status },
|
|
|
|
|
|
success: function (json) {
|
|
|
|
|
|
if (json.code == 200) {
|
|
|
|
|
|
$("#tipMsg").text("保存成功");
|
|
|
|
|
|
$("#tipModal").modal('show');
|
|
|
|
|
|
$('#table').bootstrapTable('refresh');
|
|
|
|
|
|
} else {
|
|
|
|
|
|
$("#tipMsg").text("保存失败." + json.message);
|
|
|
|
|
|
$("#tipModal").modal('show');
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
const POOL_TYPE = {
|
|
|
|
|
|
normal: 1,
|
|
|
|
|
|
senior: 2,
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
function changeDateValue(propName, idx, inputValue) {
|
|
|
|
|
|
editingNormalPrizeGroup[idx][propName] = inputValue;
|
|
|
|
|
|
reRenderPage({
|
|
|
|
|
|
normalPrizeGroup: editingNormalPrizeGroup,
|
|
|
|
|
|
})
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
function inputChanged(e) {
|
|
|
|
|
|
const propName = $(e.target).attr("name");
|
|
|
|
|
|
const idx = $(e.target).attr("data-idx");
|
|
|
|
|
|
const inputValue = e.target.value;
|
|
|
|
|
|
console.log("input change", e, propName, idx, inputValue);
|
|
|
|
|
|
changeDateValue(propName, idx, inputValue);
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
function removePirzeItem(e) {
|
|
|
|
|
|
const idx = $(e.target).attr("data-idx");
|
|
|
|
|
|
if (confirm("你确定要移除吗？")) {
|
|
|
|
|
|
editingNormalPrizeGroup.splice(idx, 1);
|
|
|
|
|
|
console.debug("remove item", editingNormalPrizeGroup)
|
|
|
|
|
|
reRenderPage({
|
|
|
|
|
|
normalPrizeGroup: editingNormalPrizeGroup,
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
function renderPrizeGroup(items, isEdit) {
|
|
|
|
|
|
let wrapperClassName = '.js-normal-prize-group-wrapper';
|
|
|
|
|
|
if (isEdit) {
|
|
|
|
|
|
console.debug("show editing action btns")
|
|
|
|
|
|
$(`${wrapperClassName} .js-no-editing`).hide();
|
|
|
|
|
|
$(`${wrapperClassName} .js-editing`).show();
|
|
|
|
|
|
} else {
|
|
|
|
|
|
console.debug("hide editing action btns")
|
|
|
|
|
|
$(`${wrapperClassName} .js-no-editing`).show();
|
|
|
|
|
|
$(`${wrapperClassName} .js-editing`).hide();
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
const groupTableDom = $(`${wrapperClassName} .prize-group-table`);
|
|
|
|
|
|
$(`${wrapperClassName} .prize-group-table input`).unbind("change");
|
|
|
|
|
|
$(`${wrapperClassName} .prize-group-table .js-remove-item`).unbind("click");
|
|
|
|
|
|
groupTableDom.html("<thead><tr>\n" +
|
|
|
|
|
|
" <th>ID</th>\n" +
|
|
|
|
|
|
" <th>名称</th>\n" +
|
|
|
|
|
|
" <th>图片</th>\n" +
|
|
|
|
|
|
" <th>倍数</th>\n" +
|
|
|
|
|
|
" </tr></thead>");
|
|
|
|
|
|
groupTableDom.append("<tbody>")
|
|
|
|
|
|
items.forEach((item, idx) => {
|
|
|
|
|
|
const tds = [];
|
|
|
|
|
|
if (isEdit) {
|
|
|
|
|
|
tds.push(`<td><i class="glyphicon glyphicon-remove js-remove-item" data-idx="${idx}"></i>${item.id}</td>`);
|
|
|
|
|
|
} else {
|
|
|
|
|
|
tds.push(`<td>${item.id}</td>`)
|
|
|
|
|
|
}
|
|
|
|
|
|
if (isEdit) {
|
|
|
|
|
|
tds.push(`<td><input type="text" name="name" data-idx="${idx}" value="${item.name}"></td>`);
|
|
|
|
|
|
} else {
|
|
|
|
|
|
tds.push(`<td>${item.name}</td>`)
|
|
|
|
|
|
}
|
|
|
|
|
|
if (isEdit) {
|
|
|
|
|
|
tds.push(`<td>
|
|
|
|
|
|
<img width="40" height="40" name="imgUrl" data-idx="${idx}" src="${item.imgUrl}"/>
|
|
|
|
|
|
<input type="file" id = "picUploadFile2${idx}" name="file">
|
|
|
|
|
|
<button class="btn btn-success picUploadBtn" type="button" class="picUploadBtn2" data-idx="${idx}" >上传</button>
|
|
|
|
|
|
</td>`)
|
|
|
|
|
|
} else {
|
|
|
|
|
|
tds.push(`<td><img width="40" height="40" src="${item.imgUrl}"/></td>`)
|
|
|
|
|
|
}
|
|
|
|
|
|
if (isEdit) {
|
|
|
|
|
|
tds.push(`<td><input type="text" name="multiple" data-idx="${idx}" value="${item.multiple}"></td>`)
|
|
|
|
|
|
} else {
|
|
|
|
|
|
tds.push(`<td>${item.multiple}</td>`)
|
|
|
|
|
|
}
|
|
|
|
|
|
let row = `<tr>${tds.join()}</tr>`;
|
|
|
|
|
|
groupTableDom.append(row);
|
|
|
|
|
|
})
|
|
|
|
|
|
groupTableDom.append("</tbody>")
|
|
|
|
|
|
|
|
|
|
|
|
// 注册输入框变更事件
|
|
|
|
|
|
$(`${wrapperClassName} .prize-group-table input[type=text]`).bind('change', inputChanged);
|
|
|
|
|
|
// 注册删除事件
|
|
|
|
|
|
$(`${wrapperClassName} .prize-group-table .js-remove-item`).bind("click", removePirzeItem);
|
|
|
|
|
|
// 变更图片
|
|
|
|
|
|
$(`${wrapperClassName} .prize-group-table .picUploadBtn`).bind("click", changedImg);
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
let normalPrizeGroupCache;
|
|
|
|
|
|
let statisticsDatas;
|
|
|
|
|
|
let deployedStatisticsDatas;
|
|
|
|
|
|
let editingNormalPrizeGroup;
|
|
|
|
|
|
let currentPoolLineId;
|
|
|
|
|
|
let maxLineId;
|
|
|
|
|
|
let isNormalPrizeEditing = false;
|
|
|
|
|
|
|
|
|
|
|
|
function renderPageWhenInit(groupData) {
|
|
|
|
|
|
const normalPrizeGroup = groupData.rows;
|
|
|
|
|
|
normalPrizeGroupCache = normalPrizeGroup;
|
|
|
|
|
|
editingNormalPrizeGroup = null;
|
|
|
|
|
|
isNormalPrizeEditing = false;
|
|
|
|
|
|
renderPrizeGroup(normalPrizeGroup, false)
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
function getPageInfo() {
|
|
|
|
|
|
$.get('/admin/luckySea/listItem.action', {
|
|
|
|
|
|
}, function (res) {
|
|
|
|
|
|
console.log(res);
|
|
|
|
|
|
const data = res;
|
|
|
|
|
|
renderPageWhenInit(data);
|
|
|
|
|
|
})
|
|
|
|
|
|
}
|
|
|
|
|
|
getPageInfo();
|
|
|
|
|
|
|
|
|
|
|
|
function deepClone(o) {
|
|
|
|
|
|
// 判断如果不是引用类型，直接返回数据即可
|
|
|
|
|
|
if (typeof o === 'string' || typeof o === 'number' || typeof o === 'boolean' || typeof o === 'undefined') {
|
|
|
|
|
|
return o
|
|
|
|
|
|
} else if (Array.isArray(o)) { // 如果是数组，则定义一个新数组，完成复制后返回
|
|
|
|
|
|
// 注意，这里判断数组不能用typeof，因为typeof Array 返回的是object
|
|
|
|
|
|
console.log(typeof []) // --> object
|
|
|
|
|
|
var _arr = []
|
|
|
|
|
|
o.forEach(item => { _arr.push(deepClone(item)) })
|
|
|
|
|
|
return _arr
|
|
|
|
|
|
} else if (typeof o === 'object') {
|
|
|
|
|
|
var _o = {}
|
|
|
|
|
|
for (let key in o) {
|
|
|
|
|
|
_o[key] = deepClone(o[key])
|
|
|
|
|
|
}
|
|
|
|
|
|
return _o
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
$('.js-edit-group').on('click', function () {
|
|
|
|
|
|
// 进入编辑状态,则使用深度拷贝复制2组数据
|
|
|
|
|
|
if (!editingNormalPrizeGroup) {
|
|
|
|
|
|
editingNormalPrizeGroup = deepClone(normalPrizeGroupCache);
|
|
|
|
|
|
}
|
|
|
|
|
|
isNormalPrizeEditing = true;
|
|
|
|
|
|
renderPrizeGroup(editingNormalPrizeGroup, true)
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
function reRenderPage (groupData) {
|
|
|
|
|
|
console.debug("reRenderPage groupData", groupData)
|
|
|
|
|
|
const normalPrizeGroup = groupData.normalPrizeGroup;
|
|
|
|
|
|
renderPrizeGroup(normalPrizeGroup, isNormalPrizeEditing)
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
$('.js-cancel-edit').on('click', function () {
|
|
|
|
|
|
console.log("js-cancel-edit ", normalPrizeGroupCache);
|
|
|
|
|
|
editingNormalPrizeGroup = null;
|
|
|
|
|
|
isNormalPrizeEditing = false;
|
|
|
|
|
|
reRenderPage({
|
|
|
|
|
|
normalPrizeGroup: normalPrizeGroupCache,
|
|
|
|
|
|
});
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
// 保存编辑
|
|
|
|
|
|
$('.js-save-edit').on('click', function () {
|
|
|
|
|
|
isNormalPrizeEditing = false;
|
|
|
|
|
|
const prizeItems = editingNormalPrizeGroup;
|
|
|
|
|
|
console.log("js-save-edit prizeGroup", editingNormalPrizeGroup);
|
|
|
|
|
|
prizeItems.forEach((item, idx) => {
|
|
|
|
|
|
if (item.id === '-') {
|
|
|
|
|
|
item.id = null;
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
$.ajax({
|
|
|
|
|
|
type: "post",
|
|
|
|
|
|
url: "/admin/luckySea/saveLuckySeaActItems",
|
|
|
|
|
|
data: JSON.stringify({
|
|
|
|
|
|
items: editingNormalPrizeGroup,
|
|
|
|
|
|
}),
|
|
|
|
|
|
dataType: "json",
|
|
|
|
|
|
contentType: 'application/json',
|
|
|
|
|
|
success: function (json) {
|
|
|
|
|
|
if (json.success) {
|
|
|
|
|
|
$("#tipMsg").text("保存成功");
|
|
|
|
|
|
$("#tipModal").modal('show');
|
|
|
|
|
|
getPageInfo();
|
|
|
|
|
|
} else {
|
|
|
|
|
|
$("#tipMsg").text("保存失败." + json.message);
|
|
|
|
|
|
$("#tipModal").modal('show');
|
|
|
|
|
|
isNormalPrizeEditing = true;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function clearModal() {
|
|
|
|
|
|
$('#addForm').find('input[type=text],input[type=hidden],input[type=file],img,span').each(function () {
|
|
|
|
|
|
$(this).val('');
|
|
|
|
|
|
$(this).html('');
|
|
|
|
|
|
$(this).attr("src", '');
|
|
|
|
|
|
});
|
|
|
|
|
|
$('#editForm').find('input[type=text],select,input[type=hidden]').each(function () {
|
|
|
|
|
|
$(this).val('');
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
// 添加按钮事件
|
|
|
|
|
|
$('.js-add-prize').on('click', function () {
|
|
|
|
|
|
clearModal();
|
|
|
|
|
|
$('#addModal').modal('show');
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 保存按钮事件
|
|
|
|
|
|
$('#addSave').on('click', function () {
|
|
|
|
|
|
console.log(' before editingNormalPrizeGroup', editingNormalPrizeGroup)
|
|
|
|
|
|
const newItem = {
|
|
|
|
|
|
id: '-',
|
|
|
|
|
|
name: $('#modal_name').val(),
|
|
|
|
|
|
imgUrl: $('#picUrl').val(),
|
|
|
|
|
|
multiple: $('#module_multiple').val()
|
|
|
|
|
|
}
|
|
|
|
|
|
// 按平台价值递增排序
|
|
|
|
|
|
let insertIdx = editingNormalPrizeGroup.length;
|
|
|
|
|
|
for (let i = 0; i < editingNormalPrizeGroup.length; i++) {
|
|
|
|
|
|
const exsistsPrize = editingNormalPrizeGroup[i];
|
|
|
|
|
|
if (newItem.multiple < exsistsPrize.multiple) {
|
|
|
|
|
|
insertIdx = i;
|
|
|
|
|
|
break;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
isNormalPrizeEditing = true;
|
|
|
|
|
|
editingNormalPrizeGroup.splice(insertIdx, 0, newItem);
|
|
|
|
|
|
console.log('after editingNormalPrizeGroup', editingNormalPrizeGroup)
|
|
|
|
|
|
reRenderPage({
|
|
|
|
|
|
normalPrizeGroup: editingNormalPrizeGroup,
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
$('#addModal').modal('hide');
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
$('#addCancel').on('click', function () {
|
|
|
|
|
|
$('#addModal').modal('hide');
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
// 上传图片
|
|
|
|
|
|
$('#picUploadBtn').on('click', function () {
|
|
|
|
|
|
$.ajaxFileUpload({
|
|
|
|
|
|
fileElementId: 'picUploadFile', //需要上传的文件域的ID，即<input type="file">的ID。
|
|
|
|
|
|
url: '/admin/luckySea/upload', //后台方法的路径
|
|
|
|
|
|
type: 'post', //当要提交自定义参数时，这个参数要设置成post
|
|
|
|
|
|
dataType: 'json', //服务器返回的数据类型。可以为xml,script,json,html。如果不填写，jQuery会自动判断。
|
|
|
|
|
|
secureuri: false, //是否启用安全提交，默认为false。
|
|
|
|
|
|
async: true, //是否是异步
|
|
|
|
|
|
success: function (json) { //提交成功后自动执行的处理函数，参数data就是服务器返回的数据。
|
|
|
|
|
|
if (json.path) {
|
|
|
|
|
|
$('#picUrl').val(json.path);
|
|
|
|
|
|
$('#picImage').attr("src", json.path);
|
|
|
|
|
|
if (json.path != '') {
|
|
|
|
|
|
$("#picImgInfo").html('已上传成功');
|
|
|
|
|
|
} else {
|
|
|
|
|
|
$("#picImgInfo").html('未上传成功');
|
|
|
|
|
|
}
|
|
|
|
|
|
console.log(json.path);
|
|
|
|
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
$("#tipMsg").text(json.msg);
|
|
|
|
|
|
$("#tipModal").modal('show');
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
error: function (data, status, e) { //提交失败自动执行的处理函数。
|
|
|
|
|
|
console.error(e);
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
function changedImg(e) {
|
|
|
|
|
|
console.log('发生点啥')
|
|
|
|
|
|
const idx = $(e.target).attr("data-idx");
|
|
|
|
|
|
$.ajaxFileUpload({
|
|
|
|
|
|
fileElementId: `picUploadFile2${idx}`, //需要上传的文件域的ID，即<input type="file">的ID。
|
|
|
|
|
|
url: '/admin/luckySea/upload', //后台方法的路径
|
|
|
|
|
|
type: 'post', //当要提交自定义参数时，这个参数要设置成post
|
|
|
|
|
|
dataType: 'json', //服务器返回的数据类型。可以为xml,script,json,html。如果不填写，jQuery会自动判断。
|
|
|
|
|
|
secureuri: false, //是否启用安全提交，默认为false。
|
|
|
|
|
|
async: true, //是否是异步
|
|
|
|
|
|
success: function (json) { //提交成功后自动执行的处理函数，参数data就是服务器返回的数据。
|
|
|
|
|
|
if (json.path) {
|
|
|
|
|
|
console.log(json.path);
|
|
|
|
|
|
// 需要重新渲染table
|
|
|
|
|
|
changeDateValue('imgUrl', idx, json.path);
|
|
|
|
|
|
} else {
|
|
|
|
|
|
$("#tipMsg").text(json.msg);
|
|
|
|
|
|
$("#tipModal").modal('show');
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
error: function (data, status, e) { //提交失败自动执行的处理函数。
|
|
|
|
|
|
console.error(e);
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
// 发布
|
|
|
|
|
|
$('.js-deploy').on('click', function () {
|
|
|
|
|
|
if (isSeniorPrizeEditing || isNormalPrizeEditing) {
|
|
|
|
|
|
$('#tipMsg').text('当前有礼物组未报错,请先保存礼物组后再尝试发布');
|
|
|
|
|
|
$('#tipModal').modal('show');
|
|
|
|
|
|
return;
|
|
|
|
|
|
}
|
|
|
|
|
|
if (!normalPrizeGroupCache.isUndeploy && !seniorPrizeGroupCache.isUndeploy) {
|
|
|
|
|
|
$('#tipMsg').text('没有待发布的修改');
|
|
|
|
|
|
$('#tipModal').modal('show');
|
|
|
|
|
|
return;
|
|
|
|
|
|
}
|
|
|
|
|
|
console.debug('js-deploy data', normalPrizeGroupCache, seniorPrizeGroupCache)
|
|
|
|
|
|
if ((normalPrizeGroupCache.prizeItems.length <= 0) ||
|
|
|
|
|
|
(seniorPrizeGroupCache.prizeItems.length <= 0)) {
|
|
|
|
|
|
$('#tipMsg').text('所有的礼物组都必须至少添加一个奖品');
|
|
|
|
|
|
$('#tipModal').modal('show');
|
|
|
|
|
|
return;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
$('#deployedPrizeRate').text(deployedStatisticsDatas.prizeRate.toFixed(4));
|
|
|
|
|
|
$('#currPrizeRate').text(statisticsDatas.prizeRate.toFixed(4));
|
|
|
|
|
|
$('#currPoolLineId').text(currentPoolLineId);
|
|
|
|
|
|
$('#activePoolLineId').text(maxLineId + 1);
|
|
|
|
|
|
|
|
|
|
|
|
$('#deployConfirmModal').modal('show');
|
|
|
|
|
|
})
|
|
|
|
|
|
$('#deployCancel').on('click', function () {
|
|
|
|
|
|
$('#deployConfirmModal').modal('hide');
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
$('#deployConfirm').on('click', function () {
|
|
|
|
|
|
$.ajax({
|
|
|
|
|
|
type: "post",
|
|
|
|
|
|
url: "/admin/linearlyPool/deploy",
|
|
|
|
|
|
dataType: "json",
|
|
|
|
|
|
contentType: 'application/json',
|
|
|
|
|
|
success: function (json) {
|
|
|
|
|
|
if (json.success) {
|
|
|
|
|
|
$("#tipMsg").text("发布成功.当前奖池线: " + json.data.currentPoolLineId + ". 生效奖池线: " + json.data.willActiveLineId);
|
|
|
|
|
|
$("#tipModal").modal('show');
|
|
|
|
|
|
getPageInfo();
|
|
|
|
|
|
} else {
|
|
|
|
|
|
$("#tipMsg").text(json.message);
|
|
|
|
|
|
$("#tipModal").modal('show');
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
$('#deployConfirmModal').modal('hide');
|
|
|
|
|
|
})
|
|
|
|
|
|
})
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
2023-10-16 11:20:05 +08:00
|
|
|
|
unmounted() {
|
|
|
|
|
|
$('#table').bootstrapTable('destroy');
|
|
|
|
|
|
}
|
2023-09-19 10:55:46 +08:00
|
|
|
|
};
|
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|
<style scoped>
|
|
|
|
|
|
.dataCount>p {
|
|
|
|
|
|
padding: 5px;
|
|
|
|
|
|
border-radius: 5px;
|
|
|
|
|
|
margin-right: 20px;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.group-table-section {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.group-table-section .prize-group-wrapper {
|
|
|
|
|
|
width: 50%;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.prize-group-wrapper .header-wrapper {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
|
max-width: 512px;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.prize-group-wrapper .header-wrapper .title {
|
|
|
|
|
|
font-size: 20px;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.prize-group-wrapper .header-wrapper .right-content {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: flex-start;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.prize-group-wrapper .header-wrapper .right-content.right-content-edit {
|
|
|
|
|
|
display: none;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.prize-group-wrapper .header-wrapper .action-btn-wrap button:not(last-child) {
|
|
|
|
|
|
margin-right: 10px;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.prize-group-wrapper .header-wrapper .right-content .undeploy {
|
|
|
|
|
|
color: red;
|
|
|
|
|
|
margin-right: 10px;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.prize-group-wrapper .data-wrapper {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
margin-top: 12px;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.prize-group-wrapper .data-wrapper div {
|
|
|
|
|
|
margin-right: 20px;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.prize-group-wrapper .prize-group-table {
|
|
|
|
|
|
margin-top: 12px;
|
|
|
|
|
|
margin-right: 10px;
|
|
|
|
|
|
max-width: 1024px;
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.prize-group-wrapper .prize-group-table .glyphicon-remove {
|
|
|
|
|
|
color: red;
|
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
#deployConfirmModal .modal-body {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
#deployConfirmModal .modal-body #currPrizeRate {
|
|
|
|
|
|
color: red;
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
#deployConfirmModal .modal-body div:first-child {
|
|
|
|
|
|
margin-bottom: 10px;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
#deployConfirmModal .modal-body div:last-child {
|
|
|
|
|
|
margin-top: 10px;
|
|
|
|
|
|
}</style>
|
