1507 lines
49 KiB
Vue
1507 lines
49 KiB
Vue
<template>
|
||
<section class="content">
|
||
<div class="box box-primary">
|
||
<div class="box-body">
|
||
<!-- Content Header (Page header) -->
|
||
<section class="content-header">
|
||
<h1 id="itemTitle"></h1>
|
||
添加/解锁新的贵族等级请联系产品经理
|
||
</section>
|
||
<div id="toolbar"></div>
|
||
</div>
|
||
<!-- .content -->
|
||
<div id="table"></div>
|
||
</div>
|
||
|
||
<div
|
||
class="modal fade"
|
||
id="editModal"
|
||
tabindex="-1"
|
||
role="dialog"
|
||
aria-labelledby="modalLabel"
|
||
style="height: 100%; overflow: hidden; overflow: scroll"
|
||
>
|
||
<div class="modal-dialog" role="document">
|
||
<div class="modal-content" style="width: 500px">
|
||
<div class="modal-header">
|
||
<button
|
||
type="button"
|
||
class="close"
|
||
data-dismiss="modal"
|
||
aria-label="Close"
|
||
>
|
||
<span aria-hidden="true">×</span>
|
||
</button>
|
||
<h4 class="modal-title" id="modalLabel">贵族编辑</h4>
|
||
</div>
|
||
<div class="modal-body">
|
||
<div class="form-horizontal" id="addForm">
|
||
<input type="hidden" name="vipLevel" id="vipLevel" />
|
||
<input type="hidden" name="addSize" id="addSize" />
|
||
<div class="form-group">
|
||
<label for="vipName" class="col-sm-4 control-label"
|
||
>名称:</label
|
||
>
|
||
<div class="col-sm-6">
|
||
<input
|
||
type="text"
|
||
class="form-control validate[required]"
|
||
name="vipName"
|
||
id="vipName"
|
||
disabled
|
||
/>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">贵族中心大图:</label>
|
||
<div class="col-sm-6">
|
||
<input
|
||
type="file"
|
||
id="logoUploadIconPic"
|
||
name="uploadFile"
|
||
accept="image/gif,image/jpeg,image/jpg,image/png,image/svg"
|
||
/>
|
||
<button
|
||
class="btn btn-success upload fromBtn"
|
||
name="vipLogo"
|
||
type="button"
|
||
id="logoUploadBtn"
|
||
>
|
||
上传
|
||
</button>
|
||
<input
|
||
type="text"
|
||
id="vipLogo"
|
||
name="vipLogo"
|
||
class="form-control upload-input-vipLogo"
|
||
/>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">贵族Icon:</label>
|
||
<div class="col-sm-6">
|
||
<img
|
||
src=""
|
||
id="iconPicUrl"
|
||
name="vipIcon"
|
||
style="height: 44px"
|
||
alt=""
|
||
/>
|
||
<input
|
||
type="file"
|
||
id="iconUploadIconPic"
|
||
name="uploadFile"
|
||
accept="image/gif,image/jpeg,image/jpg,image/png,image/svg"
|
||
/>
|
||
<button
|
||
class="btn btn-success upload fromBtn"
|
||
name="vipIcon"
|
||
type="button"
|
||
id="iconUploadBtn"
|
||
>
|
||
上传
|
||
</button>
|
||
<input
|
||
type="hidden"
|
||
id="vipIcon"
|
||
name="vipIcon"
|
||
class="form-control upload-input-vipIcon"
|
||
/>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">贵族升级飘屏背景:</label>
|
||
<div class="col-sm-6">
|
||
<input
|
||
type="file"
|
||
id="floatUploadIconPic"
|
||
name="uploadFile"
|
||
accept="image/gif,image/jpeg,image/jpg,image/png,image/svg"
|
||
/>
|
||
<button
|
||
class="btn btn-success upload fromBtn"
|
||
name="floatPic"
|
||
type="button"
|
||
id="floatUploadBtn"
|
||
>
|
||
上传
|
||
</button>
|
||
<input
|
||
type="text"
|
||
id="floatPic"
|
||
name="floatPic"
|
||
class="form-control upload-input-floatPic"
|
||
/>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="levelKeepScore" class="col-sm-4 control-label"
|
||
>保级值:</label
|
||
>
|
||
<div class="col-sm-6">
|
||
<input
|
||
type="text"
|
||
class="form-control validate[required]"
|
||
name="levelKeepScore"
|
||
id="levelKeepScore"
|
||
disabled
|
||
/>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="levelUpScore" class="col-sm-4 control-label"
|
||
>升级值:</label
|
||
>
|
||
<div class="col-sm-6">
|
||
<input
|
||
type="text"
|
||
class="form-control validate[required]"
|
||
name="name"
|
||
id="levelUpScore"
|
||
disabled
|
||
/>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="comingSoon" class="col-sm-4 control-label"
|
||
>是否敬请期待:</label
|
||
>
|
||
<div class="col-sm-6">
|
||
<select
|
||
name="comingSoon"
|
||
id="comingSoon"
|
||
data-btn-class="btn-warning"
|
||
class="form-control"
|
||
disabled="disabled"
|
||
>
|
||
<option value="1">否</option>
|
||
<option value="2">是</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
<!--权限-->
|
||
<div id="authDiv">
|
||
<div class="form-group">
|
||
<label for="buyAmount" class="col-sm-4 control-label"
|
||
>购买价格:</label
|
||
>
|
||
<div class="col-sm-6">
|
||
<input
|
||
type="text"
|
||
class="form-control"
|
||
name="buyAmount"
|
||
id="buyAmount"
|
||
/>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="isReturnProfit" class="col-sm-4 control-label"
|
||
>是否返利:</label
|
||
>
|
||
<div class="col-sm-6">
|
||
<select
|
||
name="isReturnProfit"
|
||
id="isReturnProfit"
|
||
data-btn-class="btn-warning"
|
||
class="form-control"
|
||
onchange="swapProfit()"
|
||
>
|
||
<option value="1">是</option>
|
||
<option value="0">否</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
<div id="profitDiv">
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">返利日期配置</label>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label"></label>
|
||
<div class="col-sm-8" id="returnProfits"></div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label"></label>
|
||
<div class="col-sm-3">
|
||
<button
|
||
type="button"
|
||
class="btn btn-primary form-control"
|
||
id="returnProfitAdd"
|
||
>
|
||
+ 添加
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="namePlateIds"
|
||
value="1"
|
||
/>贵族铭牌
|
||
</label>
|
||
<div class="col-sm-6">
|
||
<input
|
||
type="text"
|
||
class="form-control validate[required] refBoxValue-1"
|
||
name="namePlateIds"
|
||
id="namePlateIds"
|
||
placeholder="请输入铭牌id,多个用,隔开"
|
||
/>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="infoCardIds"
|
||
value="5"
|
||
data-refitemname="info-card"
|
||
/>贵族资料卡
|
||
</label>
|
||
<div class="col-sm-6">
|
||
<input
|
||
type="text"
|
||
class="form-control validate[required] refBoxValue-5"
|
||
name="infoCardIds"
|
||
id="infoCardIds"
|
||
placeholder="请输入资料卡id,多个用,隔开"
|
||
/>
|
||
</div>
|
||
</div>
|
||
<!-- <div class="form-group">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="hasGift"
|
||
style="margin-left: 80px"
|
||
value="4"
|
||
/>贵族礼物
|
||
</div> -->
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="levelBuffValue"
|
||
value="6"
|
||
/>财富值经验加成
|
||
</label>
|
||
<div class="col-sm-6">
|
||
<input
|
||
type="text"
|
||
class="form-control validate[required] refBoxValue-6"
|
||
name="levelBuffValue"
|
||
id="levelBuffValue"
|
||
placeholder="不可超过1"
|
||
/>
|
||
</div>
|
||
</div>
|
||
<!-- <div class="form-group">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="hasFace"
|
||
style="margin-left: 80px"
|
||
value="7"
|
||
/>贵族表情
|
||
</div> -->
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="micCircleLogo"
|
||
value="8"
|
||
style="margin-left: 60px"
|
||
/>麦序光圈
|
||
</label>
|
||
<div class="col-sm-6 refBoxValue-8">
|
||
<input
|
||
type="file"
|
||
id="micCircleUploadIconPic"
|
||
name="uploadFile"
|
||
/>
|
||
<button
|
||
class="btn btn-success upload fromBtn"
|
||
name="micCircleLogo"
|
||
type="button"
|
||
id="micCircleUploadBtn"
|
||
>
|
||
上传
|
||
</button>
|
||
<input
|
||
type="text"
|
||
id="micCircleLogo"
|
||
name="micCircleLogo"
|
||
class="form-control validate[required] upload-input-micCircleLogo"
|
||
/>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="nickColorValue"
|
||
value="9"
|
||
/>麦位昵称颜色
|
||
</label>
|
||
<div class="col-sm-6">
|
||
<input
|
||
type="text"
|
||
class="form-control validate[required] refBoxValue-9"
|
||
name="nickColorValue"
|
||
id="nickColorValue"
|
||
/>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="friendNickColorValue"
|
||
value="10"
|
||
/>好友昵称颜色
|
||
</label>
|
||
<div class="col-sm-6">
|
||
<input
|
||
type="text"
|
||
class="form-control validate[required] refBoxValue-10"
|
||
name="friendNickColorValue"
|
||
id="friendNickColorValue"
|
||
/>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="chatBubbleValue"
|
||
value="11"
|
||
/>聊天气泡
|
||
</label>
|
||
<div class="col-sm-6">
|
||
<input
|
||
type="text"
|
||
class="form-control validate[required] refBoxValue-11"
|
||
name="chatBubbleValue"
|
||
id="chatBubbleValue"
|
||
/>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="headValue"
|
||
value="2"
|
||
/>头饰
|
||
</label>
|
||
<div class="col-sm-6">
|
||
<input
|
||
type="text"
|
||
class="form-control validate[required] refBoxValue-2"
|
||
name="headValue"
|
||
id="headValue"
|
||
/>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="carValue"
|
||
value="3"
|
||
/>座驾
|
||
</label>
|
||
<div class="col-sm-6">
|
||
<input
|
||
type="text"
|
||
class="form-control validate[required] refBoxValue-3"
|
||
name="carValue"
|
||
id="carValue"
|
||
/>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="roomHornValue"
|
||
value="14"
|
||
/>房间小喇叭次数
|
||
</label>
|
||
<div class="col-sm-6">
|
||
<input
|
||
type="text"
|
||
class="form-control validate[required] refBoxValue-14"
|
||
name="roomHornValue"
|
||
id="roomHornValue"
|
||
/>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="enterRoomEffects"
|
||
value="12"
|
||
/>进场特效
|
||
</label>
|
||
<div class="col-sm-6">
|
||
<input
|
||
type="text"
|
||
class="form-control validate[required] refBoxValue-12"
|
||
name="enterRoomEffects"
|
||
id="enterRoomEffects"
|
||
/>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="enterHide"
|
||
value="13"
|
||
/>隐身进房
|
||
</label>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="preventKick"
|
||
value="15"
|
||
/>防被踢
|
||
</label>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="medalValue"
|
||
value="16"
|
||
/>勋章
|
||
</label>
|
||
<div class="col-sm-6">
|
||
<input
|
||
type="text"
|
||
class="form-control validate[required] refBoxValue-16"
|
||
name="medalValue"
|
||
id="medalValue"
|
||
/>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="preventKick"
|
||
value="17"
|
||
/>不给跟随进房
|
||
</label>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="preventKick"
|
||
value="18"
|
||
/>不给关注
|
||
</label>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="preventKick"
|
||
value="19"
|
||
/>动态头像
|
||
</label>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="preventKick"
|
||
value="20"
|
||
/>送礼飘屏
|
||
</label>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="privateChatCountLimitValue"
|
||
value="21"
|
||
/>私聊次数限制
|
||
</label>
|
||
<div class="col-sm-6">
|
||
<input
|
||
type="text"
|
||
class="form-control validate[required] refBoxValue-21"
|
||
name="privateChatCountLimitValue"
|
||
id="privateChatCountLimitValue"
|
||
/>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="preventKick"
|
||
value="22"
|
||
/>私聊限制
|
||
</label>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="discount"
|
||
value="23"
|
||
/>商店折扣
|
||
</label>
|
||
<div class="col-sm-6">
|
||
<input
|
||
type="text"
|
||
class="form-control validate[required] refBoxValue-23"
|
||
name="discount"
|
||
id="discount"
|
||
/>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
value="24"
|
||
/>公屏支持发送图片
|
||
</label>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
value="25"
|
||
/>无痕浏览个人页
|
||
</label>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
value="26"
|
||
/>查看访客
|
||
</label>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="col-sm-4 control-label">
|
||
<input
|
||
type="checkbox"
|
||
class="authCheckBox"
|
||
name="medalSeatValue"
|
||
value="27"
|
||
/>勋章席位
|
||
</label>
|
||
<div class="col-sm-6">
|
||
<input
|
||
type="text"
|
||
class="form-control validate[required] refBoxValue-27"
|
||
name="medalSeatValue"
|
||
id="medalSeatValue"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="modal-footer">
|
||
<button type="button" class="btn btn-default" data-dismiss="modal">
|
||
关闭
|
||
</button>
|
||
<button type="button" class="btn btn-primary" id="button-save">
|
||
保存
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</template>
|
||
|
||
<script>
|
||
import TableHelper from "@/utils/bootstrap-table-helper";
|
||
|
||
let vipMap = {};
|
||
let authItems = {};
|
||
const VIP_AUTH_TYPE = {
|
||
/**
|
||
* 铭牌
|
||
*/
|
||
NAMEPLATE: 1,
|
||
/**
|
||
* 头饰
|
||
*/
|
||
HEADWEAR: 2,
|
||
/**
|
||
* 座驾
|
||
*/
|
||
CAR: 3,
|
||
/**
|
||
* 礼物
|
||
*/
|
||
GIFT: 4,
|
||
/**
|
||
* 用户资料卡
|
||
*/
|
||
USER_INFO_CARD: 5,
|
||
/**
|
||
* 财富等级提成
|
||
*/
|
||
LEVEL_EXP_BUFF: 6,
|
||
/**
|
||
* 表情
|
||
*/
|
||
FACE: 7,
|
||
/**
|
||
* 麦位光圈
|
||
*/
|
||
MIC_CIRCLE: 8,
|
||
/**
|
||
* 麦位昵称颜色
|
||
*/
|
||
MIC_NICK_COLOUR: 9,
|
||
/**
|
||
* 好友昵称颜色
|
||
*/
|
||
FRIEND_NICK_COLOUR: 10,
|
||
/**
|
||
* 聊天气泡
|
||
*/
|
||
ROOM_CHAT_BUBBLE: 11,
|
||
/**
|
||
* 进场特效
|
||
*/
|
||
IN_ROOM_SPECIAL_EFFECTS: 12,
|
||
/**
|
||
* 隐身进房
|
||
*/
|
||
INVISIBLE_IN_ROOM: 13,
|
||
/**
|
||
* 房间小喇叭
|
||
*/
|
||
ROOM_HORN: 14,
|
||
/**
|
||
* 防被踢
|
||
*/
|
||
PREVENT_KICK: 15,
|
||
/**
|
||
* 勋章
|
||
*/
|
||
MEDAL: 16,
|
||
/**
|
||
* 防跟踪
|
||
* */
|
||
PREVENT_TRACE: 17,
|
||
/**
|
||
* 不给关注
|
||
*/
|
||
PREVENT_FOLLOW: 18,
|
||
/**
|
||
* 动态头像
|
||
*/
|
||
GIF_AVATAR: 19,
|
||
/**
|
||
* 送礼飘屏
|
||
*/
|
||
GIFT_FLOATING_SCREEN: 20,
|
||
/**
|
||
* 私聊次数限制
|
||
*/
|
||
PRIVATE_CHAT_COUNT_LIMIT: 21,
|
||
/**
|
||
* 私聊限制
|
||
*/
|
||
PRIVATE_CHAT_LIMIT: 22,
|
||
/**
|
||
* 商店折扣
|
||
*/
|
||
SHOP_DISCOUNT: 23,
|
||
/**
|
||
* 公屏支持发送图片
|
||
*/
|
||
PUBLIC_SCREEN_SUPPORTS_SENDINGPICTURES: 24,
|
||
/**
|
||
* 查看方可欣
|
||
*/
|
||
LOOK_GUEST: 26,
|
||
/**
|
||
* 无痕浏览个人页
|
||
*/
|
||
INVISIBLE_GUEST: 25,
|
||
/**
|
||
* 勋章席位
|
||
*/
|
||
Medal_Seat:27
|
||
|
||
};
|
||
export default {
|
||
name: "VipManageView",
|
||
setup() {
|
||
function swapProfit() {
|
||
let isReturnProfit = $("#isReturnProfit").val();
|
||
if (isReturnProfit && isReturnProfit == 1) {
|
||
document.getElementById("profitDiv").style.display = "block";
|
||
} else {
|
||
document.getElementById("profitDiv").style.display = "none";
|
||
}
|
||
}
|
||
window.swapProfit = swapProfit;
|
||
return {
|
||
swapProfit,
|
||
};
|
||
},
|
||
created() {
|
||
this.$nextTick(function () {
|
||
this.initData();
|
||
});
|
||
},
|
||
methods: {
|
||
initData() {
|
||
$(function () {
|
||
$("#table").bootstrapTable("destroy");
|
||
$("#table").bootstrapTable({
|
||
columns: [
|
||
{
|
||
field: "vipLevel",
|
||
title: "贵族等级",
|
||
align: "center",
|
||
width: "5%",
|
||
},
|
||
{
|
||
field: "vipName",
|
||
title: "贵族名称",
|
||
align: "center",
|
||
width: "5%",
|
||
},
|
||
{
|
||
field: "vipIcon",
|
||
title: "贵族icon",
|
||
align: "center",
|
||
width: "5%",
|
||
formatter: function (val, row, index) {
|
||
if (val) {
|
||
return (
|
||
"<img style='max-width: 40px;max-height: 40px' src='" +
|
||
val +
|
||
"'>"
|
||
);
|
||
} else {
|
||
return "-";
|
||
}
|
||
},
|
||
},
|
||
{
|
||
field: "levelKeepScore",
|
||
title: "保级值",
|
||
align: "center",
|
||
width: "5%",
|
||
},
|
||
{
|
||
field: "levelUpScore",
|
||
title: "所需升级值",
|
||
align: "center",
|
||
width: "5%",
|
||
},
|
||
{
|
||
field: "comingSoon",
|
||
title: "是否敬请期待",
|
||
visible: false,
|
||
align: "center",
|
||
width: "5%",
|
||
},
|
||
{
|
||
field: "authItems",
|
||
title: "贵族特权",
|
||
align: "center",
|
||
width: "5%",
|
||
formatter: function (val, row) {
|
||
if (row.comingSoon == 2) {
|
||
return "敬请期待";
|
||
} else {
|
||
const desc = buildTableAuthField(row.vipLevel);
|
||
return desc;
|
||
}
|
||
},
|
||
},
|
||
{
|
||
field: "isReturnProfit",
|
||
title: "是否返利",
|
||
align: "center",
|
||
width: "5%",
|
||
formatter: function (val, row) {
|
||
let value = "否";
|
||
if (val == 1) {
|
||
value = "是";
|
||
}
|
||
return value;
|
||
},
|
||
},
|
||
{
|
||
field: "returnProfits",
|
||
title: "返利日期+返利金币数量",
|
||
align: "center",
|
||
width: "5%",
|
||
formatter: function (val, row) {
|
||
let value = "";
|
||
if (val && val.length > 0) {
|
||
for (let i = 0, len = val.length; i < len; i++) {
|
||
let item = val[i];
|
||
let profitDate = item.profitDate;
|
||
let profitAmount = item.profitAmount;
|
||
if (profitDate == 0) {
|
||
value += "立即返利：" + profitAmount;
|
||
} else {
|
||
value += "第" + profitDate + "天：" + profitAmount;
|
||
}
|
||
if (i != len - 1) {
|
||
value += "<br/>";
|
||
}
|
||
}
|
||
} else {
|
||
value = "/";
|
||
}
|
||
return value;
|
||
},
|
||
},
|
||
{
|
||
field: "buyAmount",
|
||
title: "购买价格",
|
||
align: "center",
|
||
width: "5%",
|
||
},
|
||
{
|
||
field: "opt",
|
||
title: "操作",
|
||
align: "middle",
|
||
width: "5%",
|
||
formatter: function (val, row, index) {
|
||
return (
|
||
'<button id="btnEdit" name="btnEdit" class="btn btn-sm btn-success opt-edit" data-id=' +
|
||
row.vipLevel +
|
||
">" +
|
||
'<i class="glyphicon glyphicon-edit"></i>编辑</button> '
|
||
);
|
||
},
|
||
},
|
||
],
|
||
cache: false,
|
||
striped: true,
|
||
showRefresh: false,
|
||
pageSize: 10,
|
||
pagination: true,
|
||
pageList: [10, 20, 50, 100],
|
||
uniqueId: "id",
|
||
search: false,
|
||
sidePagination: "server", //表示服务端请求
|
||
//设置为undefined可以获取pageNumber，pageSize，searchText，sortName，sortOrder
|
||
//设置为limit可以获取limit, offset, search, sort, order
|
||
queryParamsType: "-",
|
||
queryParams: function queryParams(params) {
|
||
//设置查询参数
|
||
var param = {
|
||
page: params.pageNumber,
|
||
pageSize: params.pageSize,
|
||
};
|
||
return param;
|
||
},
|
||
ajax: function (request) {
|
||
//使用ajax请求
|
||
$.ajax({
|
||
type: "GET",
|
||
url: "/admin/vip/listByPage",
|
||
contentType: "application/json;charset=utf-8",
|
||
dataType: "json",
|
||
data: request.data,
|
||
success: function (res) {
|
||
console.log(res);
|
||
for (let i = 0; i < res.rows.length; i++) {
|
||
const vip = res.rows[i];
|
||
vipMap[vip.vipLevel] = vip;
|
||
}
|
||
console.log(vipMap);
|
||
request.success({
|
||
rows: res.rows,
|
||
total: res.total,
|
||
});
|
||
},
|
||
error: function (error) {
|
||
console.log(error);
|
||
},
|
||
});
|
||
},
|
||
toolbar: "#toolbar",
|
||
onLoadSuccess: function () {
|
||
//加载成功时执行
|
||
console.log("load success");
|
||
},
|
||
onLoadError: function () {
|
||
//加载失败时执行
|
||
console.log("load fail");
|
||
},
|
||
});
|
||
|
||
// 查询刷新
|
||
$("#btnSearch").on("click", function () {
|
||
TableHelper.doRefresh("#table");
|
||
});
|
||
|
||
// 编辑
|
||
$("#table").on("click", "#btnEdit", function () {
|
||
var id = $(this).attr("data-id");
|
||
const vip = vipMap[id];
|
||
console.log(vip);
|
||
initEditModal(vip);
|
||
initVipAuth(vip);
|
||
initReturnProfit(vip);
|
||
$("#editModal").modal("show");
|
||
});
|
||
|
||
function initEditModal(val) {
|
||
$("#addForm")
|
||
.find("input[type=text],input[type=hidden],input[type=file]")
|
||
.each(function () {
|
||
$(this).val("");
|
||
});
|
||
// 清除复选框的值
|
||
$(".authCheckBox").attr("checked", false);
|
||
$(".authCheckBox").attr("checked", false);
|
||
// 赋值
|
||
$("#addForm #vipLevel").val(val.vipLevel);
|
||
$("#addForm #vipName").val(val.vipName);
|
||
$("#logoPicUrl").attr("src", val.vipLogo);
|
||
$("#addForm #vipLogo").val(val.vipLogo);
|
||
$("#iconPicUrl").attr("src", val.vipIcon);
|
||
$("#addForm #vipIcon").val(val.vipIcon);
|
||
$("#floatPicUrl").attr("src", val.floatPic);
|
||
$("#addForm #floatPic").val(val.floatPic);
|
||
$("#addForm #levelKeepScore").val(val.levelKeepScore);
|
||
$("#addForm #levelUpScore").val(val.levelUpScore);
|
||
$("#addForm #comingSoon").val(val.comingSoon);
|
||
$("#addForm #isReturnProfit").val(val.isReturnProfit);
|
||
$("#addForm #buyAmount").val(val.buyAmount);
|
||
if (val.comingSoon === 2) {
|
||
document.getElementById("authDiv").style.display = "none";
|
||
} else {
|
||
document.getElementById("authDiv").style.display = "block";
|
||
}
|
||
let isReturnProfit = val.isReturnProfit;
|
||
if (isReturnProfit && isReturnProfit == 1) {
|
||
document.getElementById("profitDiv").style.display = "block";
|
||
} else {
|
||
document.getElementById("profitDiv").style.display = "none";
|
||
}
|
||
}
|
||
|
||
function initVipAuth(val) {
|
||
authItems = val.authItems;
|
||
var boxes = document.getElementsByClassName("authCheckBox");
|
||
for (let i = 0; i < boxes.length; i++) {
|
||
for (const authType in authItems) {
|
||
let value = authItems[authType];
|
||
if (boxes[i].value === authType) {
|
||
boxes[i].checked = true;
|
||
// 展示具体的值
|
||
const name = boxes[i].name;
|
||
$("#" + `${name}`).val(value);
|
||
break;
|
||
}
|
||
}
|
||
}
|
||
for (let i = 0; i < boxes.length; i++) {
|
||
const value = boxes[i].value;
|
||
console.log(value);
|
||
if (boxes[i].checked) {
|
||
$(".refBoxValue-" + `${value}`).show();
|
||
} else {
|
||
$(".refBoxValue-" + `${value}`).hide();
|
||
}
|
||
}
|
||
}
|
||
|
||
// 上传图片
|
||
$(".fromBtn").on("click", function () {
|
||
const name = $(this).attr("name");
|
||
var options = {
|
||
type: "post",
|
||
url: "/admin/upload/img",
|
||
dataType: "json",
|
||
success: function (json) {
|
||
if (json.path) {
|
||
$(".upload-input-" + `${name}`).val(json.path);
|
||
$(`img[name=${name}]`).attr("src", json.path);
|
||
}
|
||
},
|
||
};
|
||
$("#addForm").ajaxSubmit(options);
|
||
});
|
||
|
||
// 更改checkBox
|
||
$(".authCheckBox").click(function () {
|
||
const value = $(this).attr("value");
|
||
if ($(this).prop("checked")) {
|
||
$(".refBoxValue-" + `${value}`).show();
|
||
} else {
|
||
$(".refBoxValue-" + `${value}`).hide();
|
||
}
|
||
});
|
||
|
||
function initReturnProfit(val) {
|
||
if (!val) {
|
||
return;
|
||
}
|
||
$("#returnProfits").children().remove();
|
||
let returnProfits = val.returnProfits;
|
||
if (!returnProfits || returnProfits.length <= 0) {
|
||
return;
|
||
}
|
||
$("#addSize").val(returnProfits.length);
|
||
let $div = $("#returnProfits");
|
||
for (let i = 0, len = returnProfits.length; i < len; i++) {
|
||
let returnProfit = returnProfits[i];
|
||
let returnProfitId = returnProfit.id;
|
||
let profitDate = returnProfit.profitDate;
|
||
let profitAmount = returnProfit.profitAmount;
|
||
let $span = $("<span/>");
|
||
$span.attr("id", "returnProfit" + i);
|
||
let $input = $("<input/>");
|
||
$input.attr("type", "hidden");
|
||
$input.attr("name", "returnProfitId" + i);
|
||
$input.attr("id", "returnProfitId" + i);
|
||
$input.attr("value", returnProfitId);
|
||
$span.append($input);
|
||
let html = "";
|
||
if (!profitDate || profitDate == 0) {
|
||
html +=
|
||
'立即返利<input type="hidden" data-index="' +
|
||
i +
|
||
'" id="profitDate' +
|
||
i +
|
||
'" value="0"/>，';
|
||
} else {
|
||
html +=
|
||
'第 <input type="text" data-index="' +
|
||
i +
|
||
'" id="profitDate' +
|
||
i +
|
||
'" value="' +
|
||
profitDate +
|
||
'" style="width:41px;"/> 天，';
|
||
}
|
||
html +=
|
||
'返利 <input type="text" data-index="' +
|
||
i +
|
||
'" id="profitAmount' +
|
||
i +
|
||
'" value="' +
|
||
profitAmount +
|
||
'" style="width:41px;"/> 金币 <button class="btn btn-sm btn-default opt-del" data-index="' +
|
||
i +
|
||
'">删除</button><br/>';
|
||
$span.append(html);
|
||
$div.append($span);
|
||
}
|
||
}
|
||
|
||
//添加返利
|
||
$("#returnProfitAdd").click(function () {
|
||
let i = parseInt($("#addSize").val());
|
||
if (!i) {
|
||
i = 0;
|
||
}
|
||
let $div = $("#returnProfits");
|
||
let $span = $("<span/>");
|
||
$span.attr("id", "returnProfit" + i);
|
||
let html = "";
|
||
if (!i || i == 0) {
|
||
html +=
|
||
'立即返利<input type="hidden" data-index="' +
|
||
i +
|
||
'" id="profitDate' +
|
||
i +
|
||
'" value="0"/>，';
|
||
} else {
|
||
html +=
|
||
'第 <input type="text" data-index="' +
|
||
i +
|
||
'" id="profitDate' +
|
||
i +
|
||
'" style="width:41px;"/> 天，';
|
||
}
|
||
html +=
|
||
'返利 <input type="text" data-index="' +
|
||
i +
|
||
'" id="profitAmount' +
|
||
i +
|
||
'" style="width:41px;"/> 金币 <button class="btn btn-sm btn-default opt-del" data-index="' +
|
||
i +
|
||
'">删除</button><br/>';
|
||
$span.html(html);
|
||
$div.append($span);
|
||
$("#addSize").val(++i);
|
||
});
|
||
|
||
//删除
|
||
$("#editModal .modal-body .form-horizontal").on(
|
||
"click",
|
||
".opt-del",
|
||
function () {
|
||
var index = $(this).data("index");
|
||
var returnProfitId = $("#returnProfitId" + index).val();
|
||
if (returnProfitId) {
|
||
const msg = "确定要删除吗？";
|
||
if (confirm(msg)) {
|
||
$.ajax({
|
||
type: "get",
|
||
url:
|
||
"/admin/vip/return/profit/del?returnProfitId=" +
|
||
returnProfitId,
|
||
dataType: "json",
|
||
success: function (json) {
|
||
if (json.success == "true" || json.code == 200) {
|
||
$("#tipMsg").text("删除成功");
|
||
$("#tipModal").modal("show");
|
||
} else {
|
||
$("#tipMsg").text("删除失败." + json.message);
|
||
$("#tipModal").modal("show");
|
||
}
|
||
},
|
||
});
|
||
}
|
||
}
|
||
let addSize = $("#addSize").val();
|
||
if (!addSize) {
|
||
addSize = 0;
|
||
}
|
||
if (addSize > 0) {
|
||
$("#addSize").val(--addSize);
|
||
}
|
||
$("#returnProfit" + index).remove();
|
||
}
|
||
);
|
||
|
||
// 保存
|
||
$("#button-save").on("click", function () {
|
||
let params = buildSaveParams();
|
||
if (!params) {
|
||
return;
|
||
}
|
||
console.log(params);
|
||
$.ajax({
|
||
type: "post",
|
||
url: "/admin/vip/updateVip",
|
||
data: params,
|
||
dataType: "json",
|
||
success: function (res) {
|
||
if (res.code == 200) {
|
||
$("#editModal").modal("hide");
|
||
$("#tipMsg").text("保存成功");
|
||
$("#tipModal").modal("show");
|
||
TableHelper.doRefresh("#table");
|
||
} else {
|
||
$("#tipMsg").text("保存失败，错误码：" + res.message);
|
||
$("#tipModal").modal("show");
|
||
}
|
||
},
|
||
});
|
||
});
|
||
|
||
function buildSaveParams() {
|
||
let authMap = {};
|
||
var boxes = document.getElementsByClassName("authCheckBox");
|
||
for (let i = 0; i < boxes.length; i++) {
|
||
const value = boxes[i].value;
|
||
const name = boxes[i].name;
|
||
if (boxes[i].checked) {
|
||
if (value == 13 || value == 15
|
||
|| value == 17 || value == 18 || value == 19 || value == 20 || value == 22 || value == 24 || value == 25 || value == 26) {
|
||
authMap[value] = "false";
|
||
} else if (value == 8) {
|
||
console.log("name", name);
|
||
authMap[value] = $("#" + `${name}`).val();
|
||
} else {
|
||
authMap[value] = $(".refBoxValue-" + `${value}`).val();
|
||
}
|
||
}
|
||
}
|
||
let vipLevel = $("#addForm #vipLevel").val();
|
||
let addSize = $("#addSize").val();
|
||
if (addSize && addSize > 5) {
|
||
$("#tipMsg").text("返利数量超过5个！！！");
|
||
$("#tipModal").modal("show");
|
||
return null;
|
||
}
|
||
let isReturnProfit = $("#isReturnProfit").val();
|
||
let returnProfitArray = [];
|
||
if (isReturnProfit && isReturnProfit == 1) {
|
||
for (let i = 0; i < addSize; i++) {
|
||
let returnProfitId = $("#returnProfitId" + i).val();
|
||
let profitDate = parseFloat($("#profitDate" + i).val());
|
||
let profitAmount = $("#profitAmount" + i).val();
|
||
if (!returnProfitId && !profitDate && !profitAmount) {
|
||
continue;
|
||
}
|
||
if (profitDate != 0 && profitDate > 29) {
|
||
$("#tipMsg").text("返利日期不能超过30天！");
|
||
$("#tipModal").modal("show");
|
||
return null;
|
||
}
|
||
if (!profitAmount || profitAmount <= 0) {
|
||
$("#tipMsg").text("返利数量不能为空！");
|
||
$("#tipModal").modal("show");
|
||
return null;
|
||
}
|
||
let returnProfit = {
|
||
vipLevel: vipLevel,
|
||
profitDate: profitDate,
|
||
profitAmount: parseInt(profitAmount),
|
||
seqNo: vipLevel,
|
||
};
|
||
if (returnProfitId) {
|
||
returnProfit.id = returnProfitId;
|
||
}
|
||
returnProfitArray.push(returnProfit);
|
||
}
|
||
}
|
||
const param = {
|
||
vipLevel: $("#addForm #vipLevel").val(),
|
||
vipLogo: $("#addForm #vipLogo").val(),
|
||
vipIcon: $("#addForm #vipIcon").val(),
|
||
floatPic: $("#addForm #floatPic").val(),
|
||
isReturnProfit: isReturnProfit,
|
||
buyAmount: $("#buyAmount").val(),
|
||
authMap: authMap,
|
||
returnProfitJson:
|
||
returnProfitArray && returnProfitArray.length > 0
|
||
? JSON.stringify(returnProfitArray)
|
||
: null,
|
||
};
|
||
return param;
|
||
}
|
||
|
||
function buildTableAuthField(vipLevel) {
|
||
const vipInfo = vipMap[vipLevel];
|
||
const authItems = vipInfo.authItems;
|
||
const options = [];
|
||
for (const authType in authItems) {
|
||
let value = authItems[authType];
|
||
let desc = getDescByType(authType);
|
||
|
||
if (
|
||
authType == VIP_AUTH_TYPE.NAMEPLATE ||
|
||
authType == VIP_AUTH_TYPE.USER_INFO_CARD ||
|
||
authType == VIP_AUTH_TYPE.CAR ||
|
||
authType == VIP_AUTH_TYPE.ROOM_CHAT_BUBBLE ||
|
||
authType == VIP_AUTH_TYPE.MEDAL || authType == VIP_AUTH_TYPE.MIC_NICK_COLOUR || authType == VIP_AUTH_TYPE.FRIEND_NICK_COLOUR || authType == VIP_AUTH_TYPE.ROOM_HORN || authType == VIP_AUTH_TYPE.PRIVATE_CHAT_COUNT_LIMIT || authType == VIP_AUTH_TYPE.Medal_Seat || authType == VIP_AUTH_TYPE.HEADWEAR
|
||
) {
|
||
value = authItems[authType];
|
||
} else if (authType == VIP_AUTH_TYPE.LEVEL_EXP_BUFF || authType == VIP_AUTH_TYPE.SHOP_DISCOUNT) {
|
||
value = value * 100 + "%";
|
||
} else {
|
||
value = "";
|
||
}
|
||
|
||
// if (!desc || !value){
|
||
// continue
|
||
// }
|
||
|
||
// console.log("desc:" + desc)
|
||
|
||
options.push(
|
||
"" + desc + " " + value + " <br>"
|
||
);
|
||
}
|
||
console.log("options", options);
|
||
return options.join("");
|
||
}
|
||
|
||
function getDescByType(authType) {
|
||
switch (Number(authType)) {
|
||
case 1:
|
||
return "贵族铭牌";
|
||
case 2:
|
||
return "头饰";
|
||
case 5:
|
||
return "贵族资料卡";
|
||
case 4:
|
||
return "贵族礼物";
|
||
case 6:
|
||
return "财富值经验加成";
|
||
case 8:
|
||
return "麦序光圈";
|
||
case 7:
|
||
return "贵族表情";
|
||
case 9:
|
||
return "麦位昵称颜色";
|
||
case 10:
|
||
return "好友昵称颜色";
|
||
case 11:
|
||
return "聊天气泡";
|
||
case 3:
|
||
return "座驾";
|
||
case 14:
|
||
return "房间小喇叭次数";
|
||
case 12:
|
||
return "进场特效";
|
||
case 13:
|
||
return "隐身进房";
|
||
case 15:
|
||
return "防被踢";
|
||
case 16:
|
||
return "勋章";
|
||
case 17:
|
||
return "不给跟随进房";
|
||
case 18:
|
||
return "不给关注";
|
||
case 19:
|
||
return "动态头像";
|
||
case 20:
|
||
return "送礼飘屏";
|
||
case 21:
|
||
return "私聊次数限制";
|
||
case 22:
|
||
return "私聊限制";
|
||
case 23:
|
||
return "商店折扣";
|
||
case 24:
|
||
return "公屏支持发送图片";
|
||
case 25:
|
||
return "无痕浏览个人页";
|
||
case 26:
|
||
return "查看访客";
|
||
case 27:
|
||
return "勋章席位";
|
||
|
||
}
|
||
// if (authType == VIP_AUTH_TYPE.NAMEPLATE) {
|
||
// return "贵族铭牌";
|
||
// } else if (authType == VIP_AUTH_TYPE.USER_INFO_CARD) {
|
||
// return "贵族资料卡";
|
||
// } else if (authType == VIP_AUTH_TYPE.GIFT) {
|
||
// return "贵族礼物";
|
||
// } else if (authType == VIP_AUTH_TYPE.LEVEL_EXP_BUFF) {
|
||
// return "财富值经验加成";
|
||
// } else if (authType == VIP_AUTH_TYPE.FACE) {
|
||
// return "贵族表情";
|
||
// } else if (authType == VIP_AUTH_TYPE.MIC_CIRCLE) {
|
||
// return "麦序光圈";
|
||
// } else if (authType == VIP_AUTH_TYPE.MIC_NICK_COLOUR) {
|
||
// return "麦位昵称颜色";
|
||
// } else if (authType == VIP_AUTH_TYPE.FRIEND_NICK_COLOUR) {
|
||
// return "好友红名";
|
||
// } else if (authType == VIP_AUTH_TYPE.CAR) {
|
||
// return "座驾";
|
||
// } else if (authType == VIP_AUTH_TYPE.ROOM_CHAT_BUBBLE) {
|
||
// return "聊天气泡";
|
||
// } else if (authType == VIP_AUTH_TYPE.ROOM_HORN) {
|
||
// return "房内小喇叭";
|
||
// } else if (authType == VIP_AUTH_TYPE.IN_ROOM_SPECIAL_EFFECTS) {
|
||
// return "进场特效";
|
||
// } else if (authType == VIP_AUTH_TYPE.INVISIBLE_IN_ROOM) {
|
||
// return "隐身进房";
|
||
// } else if (authType == VIP_AUTH_TYPE.PREVENT_KICK) {
|
||
// return "防被踢";
|
||
// } else if (authType == VIP_AUTH_TYPE.MEDAL) {
|
||
// return "勋章";
|
||
// } else if (authType == VIP_AUTH_TYPE.PREVENT_TRACE) {
|
||
// return "防跟随进房";
|
||
// } else if (authType == VIP_AUTH_TYPE.PREVENT_FOLLOW) {
|
||
// return "不给关注";
|
||
// } else if (authType == VIP_AUTH_TYPE.GIF_AVATAR) {
|
||
// return "动态头像";
|
||
// } else if (authType == VIP_AUTH_TYPE.GIFT_FLOATING_SCREEN) {
|
||
// return "送礼飘屏";
|
||
// } else if (authType == VIP_AUTH_TYPE.PRIVATE_CHAT_COUNT_LIMIT) {
|
||
// return "私聊次数限制";
|
||
// } else if (authType == VIP_AUTH_TYPE.PRIVATE_CHAT_LIMIT) {
|
||
// return "私聊限制";
|
||
// } else if (authType == VIP_AUTH_TYPE.PUBLIC_SCREEN_SUPPORTS_SENDINGPICTURES) {
|
||
// return "公屏支持发送图片";
|
||
// }
|
||
}
|
||
});
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style scoped>
|
||
#imgMask {
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
width: 450px;
|
||
height: 450px;
|
||
padding: 4px;
|
||
background: #fff;
|
||
z-index: 999;
|
||
display: none;
|
||
}
|
||
|
||
#imgMask img {
|
||
width: 100%;
|
||
height: 100%;
|
||
vertical-align: top;
|
||
}
|
||
|
||
.control-span {
|
||
padding-top: 7px;
|
||
margin-bottom: 0;
|
||
font-weight: 400;
|
||
display: block;
|
||
}
|
||
|
||
.ul-li {
|
||
margin-bottom: 20px !important;
|
||
}
|
||
|
||
.ul-i {
|
||
margin-right: 10px !important;
|
||
}
|
||
|
||
.i-font {
|
||
color: #00acd6;
|
||
}
|
||
|
||
.ul-li label {
|
||
color: #c9cccf;
|
||
}
|
||
|
||
.fixed-table-body {
|
||
height: auto !important;
|
||
}
|
||
</style> |