首页-后台-最近
(cherry picked from commit 8064566ab0e895e509802501dc69305a1b7b179f)
This commit is contained in:
khalil
@@ -41,7 +41,7 @@ export function buildSelectOption(id, defVal, array) {
|
||||
let $select = $(id);
|
||||
let children = $select.children();
|
||||
if (children && children.length > 0) {
|
||||
return;
|
||||
$select.empty();
|
||||
}
|
||||
for(let i in array) {
|
||||
let obj = array[i];
|
||||
|
||||
@@ -1,103 +1,154 @@
|
||||
<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 class="col-sm-12">
|
||||
<label for="erbanNo" class="col-sm-2 control-label">房主平台号:</label>
|
||||
<div class="col-sm-2">
|
||||
<input type="text" class="form-control" name="erbanNo" id="erbanNo" placeholder="">
|
||||
</div>
|
||||
<label for="roomTitle" class="col-sm-2 control-label">房间标题:</label>
|
||||
<div class="col-sm-2">
|
||||
<input type="text" class="form-control" name="roomTitle" id="roomTitle" placeholder="">
|
||||
</div>
|
||||
<label for="roomTitle" class="col-sm-2 control-label">地区:</label>
|
||||
<div class="col-sm-2">
|
||||
<select name="partitionId" id="partitionId" class="form-control"></select>
|
||||
</div>
|
||||
<button id="btnSearch" class="btn btn-default">
|
||||
<i class="glyphicon glyphicon-search"></i>查询
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<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 class="col-sm-12">
|
||||
<label for="erbanNo"
|
||||
class="col-sm-2 control-label">房主平台号:</label>
|
||||
<div class="col-sm-2">
|
||||
<input type="text"
|
||||
class="form-control"
|
||||
name="erbanNo"
|
||||
id="erbanNo"
|
||||
placeholder="">
|
||||
</div>
|
||||
|
||||
<!-- .content -->
|
||||
<div id="table"></div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 编辑弹框 -->
|
||||
<div class="modal fade" id="roomTabHomeModal" 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">×</span>
|
||||
</button>
|
||||
<h4 class="modal-title" id="modalLabel">编辑</h4>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form class="form-horizontal" id="addForm">
|
||||
<input type="hidden" name="id" id="id" />
|
||||
<input type="hidden" name="roomUid" id="roomUid" />
|
||||
<div class="form-group">
|
||||
<label for="modal_isTop" class="col-sm-3 control-label">是否置顶<font color="red">*</font>：</label>
|
||||
<div class="col-sm-9">
|
||||
<select name="isTop" id="modal_isTop" class="form-control">
|
||||
<option value=""></option>
|
||||
<option value="1">是</option>
|
||||
<option value="0">否</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="modal_seq" class="col-sm-3 control-label">置顶排序<font color="red">*</font>:</label>
|
||||
<div class="col-sm-9">
|
||||
<input type="text" class="form-control" name="seq" id="modal_seq"
|
||||
placeholder="数字小的排前面，必填">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="modal_topStart" 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" name="topStart"
|
||||
id="modal_topStart">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="modal_topEnd" 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" name="topEnd" id="modal_topEnd">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="modal_isShow" class="col-sm-3 control-label">是否在App首页展示<font color="red">*</font>：</label>
|
||||
<div class="col-sm-9">
|
||||
<select name="isShow" id="modal_isShow" class="form-control validate[required]">
|
||||
<option value="1">是</option>
|
||||
<option value="0">否</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="btnConfirm">确定</button>
|
||||
</div>
|
||||
|
||||
<label for="roomTitle"
|
||||
class="col-sm-2 control-label">房间标题:</label>
|
||||
<div class="col-sm-2">
|
||||
<input type="text"
|
||||
class="form-control"
|
||||
name="roomTitle"
|
||||
id="roomTitle"
|
||||
placeholder="">
|
||||
</div>
|
||||
<label for="partitionId"
|
||||
class="col-sm-1 control-label">地区:</label>
|
||||
<div class="col-sm-2">
|
||||
<select name="partitionId"
|
||||
id="partitionId"
|
||||
class="form-control">
|
||||
<option value="4"
|
||||
selected>华语区</option>
|
||||
</select>
|
||||
</div>
|
||||
<button id="btnSearch"
|
||||
class="btn btn-default">
|
||||
<i class="glyphicon glyphicon-search"></i>查询
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- .content -->
|
||||
<div id="table"></div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 编辑弹框 -->
|
||||
<div class="modal fade"
|
||||
id="roomTabHomeModal"
|
||||
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">×</span>
|
||||
</button>
|
||||
<h4 class="modal-title"
|
||||
id="modalLabel">编辑</h4>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form class="form-horizontal"
|
||||
id="addForm">
|
||||
<input type="hidden"
|
||||
name="id"
|
||||
id="id" />
|
||||
<input type="hidden"
|
||||
name="roomUid"
|
||||
id="roomUid" />
|
||||
<div class="form-group">
|
||||
<label for="modal_isTop"
|
||||
class="col-sm-3 control-label">是否置顶<font color="red">*</font>：</label>
|
||||
<div class="col-sm-9">
|
||||
<select name="isTop"
|
||||
id="modal_isTop"
|
||||
class="form-control">
|
||||
<option value=""></option>
|
||||
<option value="1">是</option>
|
||||
<option value="0">否</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="modal_seq"
|
||||
class="col-sm-3 control-label">置顶排序<font color="red">*</font>:</label>
|
||||
<div class="col-sm-9">
|
||||
<input type="text"
|
||||
class="form-control"
|
||||
name="seq"
|
||||
id="modal_seq"
|
||||
placeholder="数字小的排前面，必填">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="modal_topStart"
|
||||
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"
|
||||
name="topStart"
|
||||
id="modal_topStart">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="modal_topEnd"
|
||||
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"
|
||||
name="topEnd"
|
||||
id="modal_topEnd">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="modal_isShow"
|
||||
class="col-sm-3 control-label">是否在App首页展示<font color="red">*</font>：</label>
|
||||
<div class="col-sm-9">
|
||||
<select name="isShow"
|
||||
id="modal_isShow"
|
||||
class="form-control validate[required]">
|
||||
<option value="1">是</option>
|
||||
<option value="0">否</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="btnConfirm">确定</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -112,321 +163,286 @@ import { buildSelectOption } from '@/utils/system-helper';
|
||||
TableHelper.doRefresh('#table');
|
||||
}*/
|
||||
export default {
|
||||
name: "RoomTabHomeView",
|
||||
setup() {
|
||||
return {};
|
||||
},
|
||||
created() {
|
||||
this.$nextTick(function () {
|
||||
this.initPartition();
|
||||
this.initData();
|
||||
name: "RoomTabHomeView",
|
||||
setup () {
|
||||
return {};
|
||||
},
|
||||
created () {
|
||||
this.$nextTick(function () {
|
||||
this.initPartition();
|
||||
this.initData();
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
initData () {
|
||||
$(function () {
|
||||
$('.datetime').datetimepicker({
|
||||
format: 'yyyy-mm-dd hh:ii:00',
|
||||
autoclose: true
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
initData() {
|
||||
$(function () {
|
||||
$('.datetime').datetimepicker({
|
||||
format: 'yyyy-mm-dd hh:ii:00',
|
||||
autoclose: true
|
||||
});
|
||||
// 拉取所有tab
|
||||
//getRoomTabs();
|
||||
|
||||
$('#table').bootstrapTable('destroy');
|
||||
$('#table').bootstrapTable({
|
||||
columns: [
|
||||
{ field: 'erbanNo', title: '房主平台号', align: 'center', width: '5%' },
|
||||
{ field: 'roomUid', title: '房主Uid', align: 'center', width: '5%' },
|
||||
{ field: 'roomTitle', title: '房间标题', align: 'center', width: '8%' },
|
||||
{ field: 'roomTag', title: '房间标签', align: 'center', width: '5%' },
|
||||
{
|
||||
field: 'isPermitRoom',
|
||||
title: '房间类型',
|
||||
align: 'center',
|
||||
width: '5%',
|
||||
formatter: function (val, row, index) {
|
||||
let value = '';
|
||||
if (val == 1) {
|
||||
value = '牌照房';
|
||||
} else if (val == 4) {
|
||||
value = '个播房';
|
||||
} else {
|
||||
value = '非牌照房';
|
||||
}
|
||||
return value;
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'iconContent',
|
||||
title: '图标内容',
|
||||
align: 'center',
|
||||
width: '5%',
|
||||
formatter: function (val, row, index) {
|
||||
return "<img src='" + val + "' width='40' height='40'>";
|
||||
}
|
||||
},
|
||||
{ field: 'partitionDesc', title: '地区', align: 'center', valign: 'middle' },
|
||||
{
|
||||
field: 'isTop',
|
||||
title: '是否置顶',
|
||||
align: 'center',
|
||||
valign: 'middle',
|
||||
width: '5%',
|
||||
formatter: function (val, row, index) {
|
||||
if (val == 1) {
|
||||
return '是';
|
||||
} else if (val == 0) {
|
||||
return '否';
|
||||
}
|
||||
return '否';
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'isShow',
|
||||
title: '是否在App首页展示',
|
||||
align: 'center',
|
||||
valign: 'middle',
|
||||
width: '5%',
|
||||
formatter: function (val, row, index) {
|
||||
if (val == 1) {
|
||||
return '是';
|
||||
} else if (val == 0) {
|
||||
return '否';
|
||||
}
|
||||
return '是';
|
||||
}
|
||||
},
|
||||
{ field: 'seq', title: '置顶排序', align: 'center', width: '5%' },
|
||||
{ field: 'topStart', title: '置顶开始时间', align: 'center', valign: 'middle', width: '10%', formatter: formatTime },
|
||||
{ field: 'topEnd', title: '置顶结束时间', align: 'center', valign: 'middle', width: '10%', formatter: formatTime },
|
||||
{
|
||||
field: 'id',
|
||||
title: '操作',
|
||||
align: 'center',
|
||||
width: '10%',
|
||||
formatter: function (val, row, index) {
|
||||
return '<button id="btnEdit" name="btnEdit" class="btn btn-sm btn-success opt-edit" data-id="' + val + '" data-index="' + index + '">' +
|
||||
'<i class="glyphicon glyphicon-edit"></i> 编辑</button>';
|
||||
}
|
||||
}
|
||||
],
|
||||
undefinedText: "",
|
||||
cache: false,
|
||||
striped: true,
|
||||
showRefresh: false,
|
||||
pageSize: 20,
|
||||
pagination: true,
|
||||
pageList: [10, 20, 50, 100, 200, 500],
|
||||
search: false,
|
||||
sidePagination: "server", //表示服务端请求
|
||||
queryParamsType: "undefined",
|
||||
queryParams: function queryParams(params) { //设置查询参数
|
||||
/*var tabId = $('#roomTab').val();
|
||||
if (tabId == null || tabId.length <= 0) {
|
||||
tabId = '1';
|
||||
}*/
|
||||
var param = {
|
||||
page: params.pageNumber,
|
||||
pageSize: params.pageSize,
|
||||
erbanNo: $('#erbanNo').val(),
|
||||
roomTitle: $('#roomTitle').val(),
|
||||
partitionId: $('#partitionId').val(),
|
||||
};
|
||||
console.log(param);
|
||||
return param;
|
||||
},
|
||||
ajax: function (request) { //使用ajax请求
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: '/admin/roomTabHome/list',
|
||||
contentType: 'application/json;charset=utf-8',
|
||||
dataType: 'json',
|
||||
data: request.data,
|
||||
success: function (res) {
|
||||
console.log(res);
|
||||
request.success({
|
||||
rows: res.data.roomTabHomeList,
|
||||
total: res.data.totalPage
|
||||
});
|
||||
},
|
||||
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');
|
||||
});
|
||||
|
||||
// 编辑或者新增
|
||||
$("#btnConfirm").click(function () {
|
||||
var id = $("#id").val();
|
||||
var roomUid = $('#roomUid').val();
|
||||
var seq = $("#modal_seq").val();
|
||||
var isTop = $("#modal_isTop").val();
|
||||
var iconContent = $("#modal_iconContent").val();
|
||||
var topStart = $("#modal_topStart").val();
|
||||
var topEnd = $("#modal_topEnd").val();
|
||||
var isShow = $('#modal_isShow').val();
|
||||
if ($("#addForm").validationEngine('validate')) {
|
||||
$.ajax({
|
||||
type: "post",
|
||||
url: "/admin/roomTabHome/save",
|
||||
data: {
|
||||
id: id,
|
||||
roomUid: roomUid,
|
||||
seq: seq,
|
||||
isTop: isTop,
|
||||
iconContent: iconContent,
|
||||
topStart: topStart,
|
||||
topEnd: topEnd,
|
||||
isShow: isShow,
|
||||
},
|
||||
dataType: "json",
|
||||
success: function (json) {
|
||||
if (json.code == 200) {
|
||||
$("#tipMsg").text("保存成功");
|
||||
$("#tipModal").modal('show');
|
||||
TableHelper.doRefresh("#table");
|
||||
$("#roomTabHomeModal").modal('hide');
|
||||
} else {
|
||||
$("#tipMsg").text("保存失败." + json.msg);
|
||||
$("#tipModal").modal('show');
|
||||
TableHelper.doRefresh("#table");
|
||||
$("#roomTabHomeModal").modal('hide');
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
// 获取信息
|
||||
$("#table").on("click", '.opt-edit', function () {
|
||||
var id = $(this).attr("data-id");
|
||||
const index = $(this).data('index');
|
||||
const record = TableHelper.getData('#table')[index];
|
||||
$("#id").val(null);
|
||||
$("#modal_iconContent").val('');
|
||||
$("#modal_seq").val(0);
|
||||
$("#modal_isTop").val(0);
|
||||
$("#modal_topStart").val('');
|
||||
$("#modal_topEnd").val('');
|
||||
$("#modal_isShow").val(0);
|
||||
$('#roomUid').val(record.roomUid);
|
||||
if (id && id != 'null') {
|
||||
$.ajax({
|
||||
type: "get",
|
||||
url: "/admin/roomTabHome/get",
|
||||
data: { id: id },
|
||||
dataType: "json",
|
||||
success: function (ret) {
|
||||
if (ret.code == 200) {
|
||||
var json = ret.data.roomTabHome;
|
||||
$("#id").val(id);
|
||||
$("#modal_iconContent").val(json.iconContent);
|
||||
$("#modal_seq").val(json.seq);
|
||||
$("#modal_isTop").val(json.isTop ? 1 : 0);
|
||||
$("#modal_topStart").val(formatTime(json.topStart));
|
||||
$("#modal_topEnd").val(formatTime(json.topEnd));
|
||||
$("#modal_isShow").val(json.isShow ? 1 : 0);
|
||||
} else {
|
||||
$("#tipMsg").text("获取菜单信息出错");
|
||||
$("#tipModal").modal('show');
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
// 打开编辑弹窗
|
||||
$("#roomTabHomeModal").modal('show');
|
||||
$("#modalLabel").text("编辑");
|
||||
});
|
||||
|
||||
// 删除操作
|
||||
$("#table").on("click", '.opt-remove', function () {
|
||||
var id = $(this).attr("data-id");
|
||||
if (id == 'undefined') {
|
||||
$("#tipMsg").text("id参数有误");
|
||||
$("#tipModal").modal('show');
|
||||
return;
|
||||
}
|
||||
if (confirm("你确认删除吗? \r\n 删除后不会恢复，请谨慎操作！")) {
|
||||
$.ajax({
|
||||
type: 'post',
|
||||
url: "/admin/roomTabHome/delete",
|
||||
data: { id: id },
|
||||
dataType: "json",
|
||||
success: function (json) {
|
||||
if (json.code == 200) {
|
||||
$("#tipMsg").text("删除成功");
|
||||
$("#tipModal").modal('show');
|
||||
TableHelper.doRefresh("#table");
|
||||
} else {
|
||||
$("#tipMsg").text("删除失败");
|
||||
$("#tipModal").modal('show');
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
// 通过接口获取所有房间tab
|
||||
function getRoomTabs() {
|
||||
$.ajax({
|
||||
url: "/admin/roomTab/excludelist?page=1&pageSize=1000", //后台controller中的请求路径
|
||||
type: 'GET',
|
||||
async: false,
|
||||
datatype: 'json',
|
||||
success: function (res) {
|
||||
console.log(res);
|
||||
if (res) {
|
||||
var data = res.data.roomTabList;
|
||||
var tabs = [];
|
||||
for (var i = 0, len = data.length; i < len; i++) {
|
||||
var item = data[i];
|
||||
//拼接成多个<option><option/>
|
||||
tabs.push('<option value="' + item.id + '">' + item.name + '</option>')
|
||||
}
|
||||
$("#roomTab").html(tabs.join(' ')); //填充到select标签中
|
||||
}
|
||||
},
|
||||
error: function () {
|
||||
alert('查询房间tab出错');
|
||||
}
|
||||
});
|
||||
$('#table').bootstrapTable('destroy');
|
||||
$('#table').bootstrapTable({
|
||||
columns: [
|
||||
{ field: 'erbanNo', title: '房主平台号', align: 'center', width: '5%' },
|
||||
{ field: 'roomUid', title: '房主Uid', align: 'center', width: '5%' },
|
||||
{ field: 'roomTitle', title: '房间标题', align: 'center', width: '8%' },
|
||||
{ field: 'roomTag', title: '房间标签', align: 'center', width: '5%' },
|
||||
{
|
||||
field: 'isPermitRoom',
|
||||
title: '房间类型',
|
||||
align: 'center',
|
||||
width: '5%',
|
||||
formatter: function (val, row, index) {
|
||||
let value = '';
|
||||
if (val == 1) {
|
||||
value = '牌照房';
|
||||
} else if (val == 4) {
|
||||
value = '个播房';
|
||||
} else {
|
||||
value = '非牌照房';
|
||||
}
|
||||
return value;
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'avatar',
|
||||
title: '图标内容',
|
||||
align: 'center',
|
||||
width: '5%',
|
||||
formatter: function (val, row, index) {
|
||||
return "<img src='" + val + "' width='40' height='40'>";
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'isTop',
|
||||
title: '是否置顶',
|
||||
align: 'center',
|
||||
valign: 'middle',
|
||||
width: '5%',
|
||||
formatter: function (val, row, index) {
|
||||
if (val == 1) {
|
||||
return '是';
|
||||
} else if (val == 0) {
|
||||
return '否';
|
||||
}
|
||||
return '否';
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'isShow',
|
||||
title: '是否在App首页展示',
|
||||
align: 'center',
|
||||
valign: 'middle',
|
||||
width: '5%',
|
||||
formatter: function (val, row, index) {
|
||||
if (val == 1) {
|
||||
return '是';
|
||||
} else if (val == 0) {
|
||||
return '否';
|
||||
}
|
||||
return '是';
|
||||
}
|
||||
},
|
||||
{ field: 'seq', title: '置顶排序', align: 'center', width: '5%' },
|
||||
{ field: 'topStart', title: '置顶开始时间', align: 'center', valign: 'middle', width: '10%', formatter: formatTime },
|
||||
{ field: 'topEnd', title: '置顶结束时间', align: 'center', valign: 'middle', width: '10%', formatter: formatTime },
|
||||
{
|
||||
field: 'isHourTop1', title: '小时榜top1', align: 'center', valign: 'middle', width: '10%', formatter: function (val, row, index) {
|
||||
return val ? '是' : '否';
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'isHourTop1', title: '周榜top1', align: 'center', valign: 'middle', width: '10%', formatter: function (val, row, index) {
|
||||
return val ? '是' : '否';
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'micUserCount', title: '麦上人数', align: 'center', valign: 'middle', width: '10%'
|
||||
},
|
||||
{
|
||||
field: 'onlineNum', title: '房间人数', align: 'center', valign: 'middle', width: '10%'
|
||||
},
|
||||
{
|
||||
field: 'id',
|
||||
title: '操作',
|
||||
align: 'center',
|
||||
width: '10%',
|
||||
formatter: function (val, row, index) {
|
||||
return '<button id="btnEdit" name="btnEdit" class="btn btn-sm btn-success opt-edit" data-id="' + val + '" data-index="' + index + '">' +
|
||||
'<i class="glyphicon glyphicon-edit"></i> 编辑</button>';
|
||||
}
|
||||
}
|
||||
],
|
||||
undefinedText: "",
|
||||
cache: false,
|
||||
striped: true,
|
||||
showRefresh: false,
|
||||
search: false,
|
||||
sidePagination: "server", //表示服务端请求
|
||||
queryParamsType: "undefined",
|
||||
queryParams: function queryParams (params) { //设置查询参数
|
||||
var param = {
|
||||
page: params.pageNumber,
|
||||
pageSize: params.pageSize,
|
||||
erbanNo: $('#erbanNo').val(),
|
||||
roomTitle: $('#roomTitle').val(),
|
||||
partitionId: $('#partitionId').val(),
|
||||
};
|
||||
console.log(param);
|
||||
return param;
|
||||
},
|
||||
url: '/admin/roomTabHome/list',
|
||||
responseHandler: function (data) {
|
||||
console.info(111, data)
|
||||
if (data.code === 200) {
|
||||
return { "rows": data.data, "total": data.data.length };
|
||||
} else {
|
||||
return { "rows": [], "total": 0 };
|
||||
}
|
||||
},
|
||||
toolbar: '#toolbar',
|
||||
onLoadSuccess: function () { //加载成功时执行
|
||||
console.log("load success");
|
||||
},
|
||||
onLoadError: function () { //加载失败时执行
|
||||
console.log("load fail");
|
||||
}
|
||||
});
|
||||
|
||||
// 查询刷新
|
||||
$('#btnSearch').on('click', function () {
|
||||
TableHelper.doRefresh('#table');
|
||||
});
|
||||
|
||||
// 编辑或者新增
|
||||
$("#btnConfirm").click(function () {
|
||||
var id = $("#id").val();
|
||||
var roomUid = $('#roomUid').val();
|
||||
var seq = $("#modal_seq").val();
|
||||
var isTop = $("#modal_isTop").val();
|
||||
var iconContent = $("#modal_iconContent").val();
|
||||
var topStart = $("#modal_topStart").val();
|
||||
var topEnd = $("#modal_topEnd").val();
|
||||
var isShow = $('#modal_isShow').val();
|
||||
if ($("#addForm").validationEngine('validate')) {
|
||||
$.ajax({
|
||||
type: "post",
|
||||
url: "/admin/roomTabHome/save",
|
||||
data: {
|
||||
id: id,
|
||||
roomUid: roomUid,
|
||||
seq: seq,
|
||||
isTop: isTop,
|
||||
iconContent: iconContent,
|
||||
topStart: topStart,
|
||||
topEnd: topEnd,
|
||||
isShow: isShow,
|
||||
},
|
||||
dataType: "json",
|
||||
success: function (json) {
|
||||
if (json.code == 200) {
|
||||
$("#tipMsg").text("保存成功");
|
||||
$("#tipModal").modal('show');
|
||||
TableHelper.doRefresh("#table");
|
||||
$("#roomTabHomeModal").modal('hide');
|
||||
} else {
|
||||
$("#tipMsg").text("保存失败." + json.msg);
|
||||
$("#tipModal").modal('show');
|
||||
TableHelper.doRefresh("#table");
|
||||
$("#roomTabHomeModal").modal('hide');
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
initPartition() {
|
||||
getPartitionInfoList().then(res => {
|
||||
let data = res.data;
|
||||
buildSelectOption(
|
||||
"#partitionId",
|
||||
null,
|
||||
[{
|
||||
value: '',
|
||||
text: '全部',
|
||||
}].concat(data.map((v) => {
|
||||
return {
|
||||
value: v.id,
|
||||
text: v.desc,
|
||||
};
|
||||
}))
|
||||
);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
// 获取信息
|
||||
$("#table").on("click", '.opt-edit', function () {
|
||||
var id = $(this).attr("data-id");
|
||||
const index = $(this).data('index');
|
||||
const record = TableHelper.getData('#table')[index];
|
||||
$("#id").val(null);
|
||||
$("#modal_seq").val(0);
|
||||
$("#modal_isTop").val(0);
|
||||
$("#modal_topStart").val('');
|
||||
$("#modal_topEnd").val('');
|
||||
$("#modal_isShow").val(0);
|
||||
$('#roomUid').val(record.roomUid);
|
||||
if (id && id != 'null') {
|
||||
$.ajax({
|
||||
type: "get",
|
||||
url: "/admin/roomTabHome/get",
|
||||
data: { id: id },
|
||||
dataType: "json",
|
||||
success: function (ret) {
|
||||
if (ret.code == 200) {
|
||||
var json = ret.data;
|
||||
$("#id").val(id);
|
||||
$("#modal_seq").val(json.seq);
|
||||
$("#modal_isTop").val(json.isTop ? 1 : 0);
|
||||
$("#modal_topStart").val(formatTime(json.topStart));
|
||||
$("#modal_topEnd").val(formatTime(json.topEnd));
|
||||
$("#modal_isShow").val(json.isShow ? 1 : 0);
|
||||
} else {
|
||||
$("#tipMsg").text("获取菜单信息出错");
|
||||
$("#tipModal").modal('show');
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
}
|
||||
// 打开编辑弹窗
|
||||
$("#roomTabHomeModal").modal('show');
|
||||
$("#modalLabel").text("编辑");
|
||||
});
|
||||
|
||||
// 删除操作
|
||||
$("#table").on("click", '.opt-remove', function () {
|
||||
var id = $(this).attr("data-id");
|
||||
if (id == 'undefined') {
|
||||
$("#tipMsg").text("id参数有误");
|
||||
$("#tipModal").modal('show');
|
||||
return;
|
||||
}
|
||||
if (confirm("你确认删除吗? \r\n 删除后不会恢复，请谨慎操作！")) {
|
||||
$.ajax({
|
||||
type: 'post',
|
||||
url: "/admin/roomTabHome/delete",
|
||||
data: { id: id },
|
||||
dataType: "json",
|
||||
success: function (json) {
|
||||
if (json.code == 200) {
|
||||
$("#tipMsg").text("删除成功");
|
||||
$("#tipModal").modal('show');
|
||||
TableHelper.doRefresh("#table");
|
||||
} else {
|
||||
$("#tipMsg").text("删除失败");
|
||||
$("#tipModal").modal('show');
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
},
|
||||
initPartition () {
|
||||
getPartitionInfoList().then(res => {
|
||||
let data = res.data;
|
||||
buildSelectOption(
|
||||
"#partitionId",
|
||||
4,
|
||||
data.map((v) => {
|
||||
return {
|
||||
value: v.id,
|
||||
text: v.desc,
|
||||
};
|
||||
})
|
||||
);
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
449
src/views/room/RoomTabNewestView.vue
Normal file
449
src/views/room/RoomTabNewestView.vue
Normal file
@@ -0,0 +1,449 @@
|
||||
<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 class="col-sm-12">
|
||||
<label for="erbanNo"
|
||||
class="col-sm-2 control-label">房主平台号:</label>
|
||||
<div class="col-sm-2">
|
||||
<input type="text"
|
||||
class="form-control"
|
||||
name="erbanNo"
|
||||
id="erbanNo"
|
||||
placeholder="">
|
||||
</div>
|
||||
<label for="roomTitle"
|
||||
class="col-sm-2 control-label">房间标题:</label>
|
||||
<div class="col-sm-2">
|
||||
<input type="text"
|
||||
class="form-control"
|
||||
name="roomTitle"
|
||||
id="roomTitle"
|
||||
placeholder="">
|
||||
</div>
|
||||
<label for="partitionId"
|
||||
class="col-sm-1 control-label">地区:</label>
|
||||
<div class="col-sm-2">
|
||||
<select name="partitionId"
|
||||
id="partitionId"
|
||||
class="form-control">
|
||||
<option value="4"
|
||||
selected>华语区</option>
|
||||
</select>
|
||||
</div>
|
||||
<button id="btnSearch"
|
||||
class="btn btn-default">
|
||||
<i class="glyphicon glyphicon-search"></i>查询
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- .content -->
|
||||
<div id="table"></div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 编辑弹框 -->
|
||||
<div class="modal fade"
|
||||
id="roomTabHomeModal"
|
||||
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">×</span>
|
||||
</button>
|
||||
<h4 class="modal-title"
|
||||
id="modalLabel">编辑</h4>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form class="form-horizontal"
|
||||
id="addForm">
|
||||
<input type="hidden"
|
||||
name="id"
|
||||
id="id" />
|
||||
<input type="hidden"
|
||||
name="roomUid"
|
||||
id="roomUid" />
|
||||
<div class="form-group">
|
||||
<label for="modal_isTop"
|
||||
class="col-sm-3 control-label">是否置顶<font color="red">*</font>：</label>
|
||||
<div class="col-sm-9">
|
||||
<select name="isTop"
|
||||
id="modal_isTop"
|
||||
class="form-control">
|
||||
<option value=""></option>
|
||||
<option value="1">是</option>
|
||||
<option value="0">否</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="modal_seq"
|
||||
class="col-sm-3 control-label">置顶排序<font color="red">*</font>:</label>
|
||||
<div class="col-sm-9">
|
||||
<input type="text"
|
||||
class="form-control"
|
||||
name="seq"
|
||||
id="modal_seq"
|
||||
placeholder="数字小的排前面，必填">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="modal_topStart"
|
||||
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"
|
||||
name="topStart"
|
||||
id="modal_topStart">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="modal_topEnd"
|
||||
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"
|
||||
name="topEnd"
|
||||
id="modal_topEnd">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="modal_isShow"
|
||||
class="col-sm-3 control-label">是否在App首页展示<font color="red">*</font>：</label>
|
||||
<div class="col-sm-9">
|
||||
<select name="isShow"
|
||||
id="modal_isShow"
|
||||
class="form-control validate[required]">
|
||||
<option value="1">是</option>
|
||||
<option value="0">否</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="btnConfirm">确定</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TableHelper from '@/utils/bootstrap-table-helper';
|
||||
import { formatTime } from '@/utils/maintainer';
|
||||
import { getPartitionInfoList } from '@/api/partition/partitionInfo';
|
||||
import { buildSelectOption } from '@/utils/system-helper';
|
||||
|
||||
// tab类型选择变化查询
|
||||
/*function selectOnTabChange(obj){
|
||||
// console.log(obj);
|
||||
TableHelper.doRefresh('#table');
|
||||
}*/
|
||||
export default {
|
||||
name: "RoomTabNewestView",
|
||||
setup () {
|
||||
return {};
|
||||
},
|
||||
created () {
|
||||
this.$nextTick(function () {
|
||||
this.initPartition();
|
||||
this.initData();
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
initData () {
|
||||
$(function () {
|
||||
$('.datetime').datetimepicker({
|
||||
format: 'yyyy-mm-dd hh:ii:00',
|
||||
autoclose: true
|
||||
});
|
||||
|
||||
$('#table').bootstrapTable('destroy');
|
||||
$('#table').bootstrapTable({
|
||||
columns: [
|
||||
{ field: 'erbanNo', title: '房主平台号', align: 'center', width: '5%' },
|
||||
{ field: 'roomUid', title: '房主Uid', align: 'center', width: '5%' },
|
||||
{ field: 'roomTitle', title: '房间标题', align: 'center', width: '8%' },
|
||||
{ field: 'roomTag', title: '房间标签', align: 'center', width: '5%' },
|
||||
{
|
||||
field: 'isPermitRoom',
|
||||
title: '房间类型',
|
||||
align: 'center',
|
||||
width: '5%',
|
||||
formatter: function (val, row, index) {
|
||||
let value = '';
|
||||
if (val == 1) {
|
||||
value = '牌照房';
|
||||
} else if (val == 4) {
|
||||
value = '个播房';
|
||||
} else {
|
||||
value = '非牌照房';
|
||||
}
|
||||
return value;
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'avatar',
|
||||
title: '图标内容',
|
||||
align: 'center',
|
||||
width: '5%',
|
||||
formatter: function (val, row, index) {
|
||||
return "<img src='" + val + "' width='40' height='40'>";
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'isTop',
|
||||
title: '是否置顶',
|
||||
align: 'center',
|
||||
valign: 'middle',
|
||||
width: '5%',
|
||||
formatter: function (val, row, index) {
|
||||
if (val == 1) {
|
||||
return '是';
|
||||
} else if (val == 0) {
|
||||
return '否';
|
||||
}
|
||||
return '否';
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'isShow',
|
||||
title: '是否在App首页展示',
|
||||
align: 'center',
|
||||
valign: 'middle',
|
||||
width: '5%',
|
||||
formatter: function (val, row, index) {
|
||||
if (val == 1) {
|
||||
return '是';
|
||||
} else if (val == 0) {
|
||||
return '否';
|
||||
}
|
||||
return '是';
|
||||
}
|
||||
},
|
||||
{ field: 'seq', title: '置顶排序', align: 'center', width: '5%' },
|
||||
{ field: 'topStart', title: '置顶开始时间', align: 'center', valign: 'middle', width: '10%', formatter: formatTime },
|
||||
{ field: 'topEnd', title: '置顶结束时间', align: 'center', valign: 'middle', width: '10%', formatter: formatTime },
|
||||
{
|
||||
field: 'isHourTop1', title: '小时榜top1', align: 'center', valign: 'middle', width: '10%', formatter: function (val, row, index) {
|
||||
return val ? '是' : '否';
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'isHourTop1', title: '周榜top1', align: 'center', valign: 'middle', width: '10%', formatter: function (val, row, index) {
|
||||
return val ? '是' : '否';
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'micUserCount', title: '麦上人数', align: 'center', valign: 'middle', width: '10%'
|
||||
},
|
||||
{
|
||||
field: 'onlineNum', title: '房间人数', align: 'center', valign: 'middle', width: '10%'
|
||||
},
|
||||
{
|
||||
field: 'id',
|
||||
title: '操作',
|
||||
align: 'center',
|
||||
width: '10%',
|
||||
formatter: function (val, row, index) {
|
||||
return '<button id="btnEdit" name="btnEdit" class="btn btn-sm btn-success opt-edit" data-id="' + val + '" data-index="' + index + '">' +
|
||||
'<i class="glyphicon glyphicon-edit"></i> 编辑</button>';
|
||||
}
|
||||
}
|
||||
],
|
||||
undefinedText: "",
|
||||
cache: false,
|
||||
striped: true,
|
||||
showRefresh: false,
|
||||
search: false,
|
||||
sidePagination: "server", //表示服务端请求
|
||||
queryParamsType: "undefined",
|
||||
queryParams: function queryParams (params) { //设置查询参数
|
||||
var param = {
|
||||
page: params.pageNumber,
|
||||
pageSize: params.pageSize,
|
||||
erbanNo: $('#erbanNo').val(),
|
||||
roomTitle: $('#roomTitle').val(),
|
||||
partitionId: $('#partitionId').val(),
|
||||
};
|
||||
console.log(param);
|
||||
return param;
|
||||
},
|
||||
url: '/admin/roomTabHome/list',
|
||||
responseHandler: function (data) {
|
||||
console.info(111, data)
|
||||
if (data.code === 200) {
|
||||
return { "rows": data.data, "total": data.data.length };
|
||||
} else {
|
||||
return { "rows": [], "total": 0 };
|
||||
}
|
||||
},
|
||||
toolbar: '#toolbar',
|
||||
onLoadSuccess: function () { //加载成功时执行
|
||||
console.log("load success");
|
||||
},
|
||||
onLoadError: function () { //加载失败时执行
|
||||
console.log("load fail");
|
||||
}
|
||||
});
|
||||
|
||||
// 查询刷新
|
||||
$('#btnSearch').on('click', function () {
|
||||
TableHelper.doRefresh('#table');
|
||||
});
|
||||
|
||||
// 编辑或者新增
|
||||
$("#btnConfirm").click(function () {
|
||||
var id = $("#id").val();
|
||||
var roomUid = $('#roomUid').val();
|
||||
var seq = $("#modal_seq").val();
|
||||
var isTop = $("#modal_isTop").val();
|
||||
var iconContent = $("#modal_iconContent").val();
|
||||
var topStart = $("#modal_topStart").val();
|
||||
var topEnd = $("#modal_topEnd").val();
|
||||
var isShow = $('#modal_isShow').val();
|
||||
if ($("#addForm").validationEngine('validate')) {
|
||||
$.ajax({
|
||||
type: "post",
|
||||
url: "/admin/roomTabHome/save",
|
||||
data: {
|
||||
id: id,
|
||||
roomUid: roomUid,
|
||||
seq: seq,
|
||||
isTop: isTop,
|
||||
iconContent: iconContent,
|
||||
topStart: topStart,
|
||||
topEnd: topEnd,
|
||||
isShow: isShow,
|
||||
},
|
||||
dataType: "json",
|
||||
success: function (json) {
|
||||
if (json.code == 200) {
|
||||
$("#tipMsg").text("保存成功");
|
||||
$("#tipModal").modal('show');
|
||||
TableHelper.doRefresh("#table");
|
||||
$("#roomTabHomeModal").modal('hide');
|
||||
} else {
|
||||
$("#tipMsg").text("保存失败." + json.msg);
|
||||
$("#tipModal").modal('show');
|
||||
TableHelper.doRefresh("#table");
|
||||
$("#roomTabHomeModal").modal('hide');
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
// 获取信息
|
||||
$("#table").on("click", '.opt-edit', function () {
|
||||
var id = $(this).attr("data-id");
|
||||
const index = $(this).data('index');
|
||||
const record = TableHelper.getData('#table')[index];
|
||||
$("#id").val(null);
|
||||
$("#modal_seq").val(0);
|
||||
$("#modal_isTop").val(0);
|
||||
$("#modal_topStart").val('');
|
||||
$("#modal_topEnd").val('');
|
||||
$("#modal_isShow").val(0);
|
||||
$('#roomUid').val(record.roomUid);
|
||||
if (id && id != 'null') {
|
||||
$.ajax({
|
||||
type: "get",
|
||||
url: "/admin/roomTabHome/get",
|
||||
data: { id: id },
|
||||
dataType: "json",
|
||||
success: function (ret) {
|
||||
if (ret.code == 200) {
|
||||
var json = ret.data;
|
||||
$("#id").val(id);
|
||||
$("#modal_seq").val(json.seq);
|
||||
$("#modal_isTop").val(json.isTop ? 1 : 0);
|
||||
$("#modal_topStart").val(formatTime(json.topStart));
|
||||
$("#modal_topEnd").val(formatTime(json.topEnd));
|
||||
$("#modal_isShow").val(json.isShow ? 1 : 0);
|
||||
} else {
|
||||
$("#tipMsg").text("获取菜单信息出错");
|
||||
$("#tipModal").modal('show');
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
// 打开编辑弹窗
|
||||
$("#roomTabHomeModal").modal('show');
|
||||
$("#modalLabel").text("编辑");
|
||||
});
|
||||
|
||||
// 删除操作
|
||||
$("#table").on("click", '.opt-remove', function () {
|
||||
var id = $(this).attr("data-id");
|
||||
if (id == 'undefined') {
|
||||
$("#tipMsg").text("id参数有误");
|
||||
$("#tipModal").modal('show');
|
||||
return;
|
||||
}
|
||||
if (confirm("你确认删除吗? \r\n 删除后不会恢复，请谨慎操作！")) {
|
||||
$.ajax({
|
||||
type: 'post',
|
||||
url: "/admin/roomTabHome/delete",
|
||||
data: { id: id },
|
||||
dataType: "json",
|
||||
success: function (json) {
|
||||
if (json.code == 200) {
|
||||
$("#tipMsg").text("删除成功");
|
||||
$("#tipModal").modal('show');
|
||||
TableHelper.doRefresh("#table");
|
||||
} else {
|
||||
$("#tipMsg").text("删除失败");
|
||||
$("#tipModal").modal('show');
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
},
|
||||
initPartition () {
|
||||
getPartitionInfoList().then(res => {
|
||||
let data = res.data;
|
||||
buildSelectOption(
|
||||
"#partitionId",
|
||||
4,
|
||||
data.map((v) => {
|
||||
return {
|
||||
value: v.id,
|
||||
text: v.desc,
|
||||
};
|
||||
})
|
||||
);
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
Reference in New Issue
Block a user