From 0d84d1730949ad3c9d409c587b99c03737c8d95d Mon Sep 17 00:00:00 2001
From: liaozetao <1107136310@qq.com>
Date: Fri, 22 Dec 2023 15:52:51 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E6=B8=B8=E6=88=8F=E5=88=86?=
 =?UTF-8?q?=E7=B1=BB=E8=AE=BE=E7=BD=AE=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/common/upload.js                |  23 ++
 src/api/game/gamePartner.js             |   8 +
 src/api/home/homeGameTab.js             |  33 +++
 src/utils/maintainer.js                 |  12 +
 src/views/home/HomeGameTabAdminView.vue | 300 ++++++++++++++++++++++++
 src/views/room/RoomTabHomeView.vue      | 100 +++++---
 6 files changed, 437 insertions(+), 39 deletions(-)
 create mode 100644 src/api/common/upload.js
 create mode 100644 src/api/game/gamePartner.js
 create mode 100644 src/api/home/homeGameTab.js
 create mode 100644 src/views/home/HomeGameTabAdminView.vue

diff --git a/src/api/common/upload.js b/src/api/common/upload.js
new file mode 100644
index 0000000..e744de1
--- /dev/null
+++ b/src/api/common/upload.js
@@ -0,0 +1,23 @@
+import '@/utils/ajaxfileupload';
+
+export const uploadFile = id => {
+    return new Promise((resolve, reject) => {
+        $.ajaxFileUpload({
+            fileElementId: id,
+            url: '/admin/upload/img',
+            type: 'post',
+            dataType: 'json',
+            secureuri: false,
+            async: true,
+            submitType: 'ajax',
+            success: function (res) {
+                resolve(res);
+            },
+            error: function (res, status, e) {
+                console.error(res);
+                console.error(status);
+                reject(e);
+            }
+        });
+    });
+};
\ No newline at end of file
diff --git a/src/api/game/gamePartner.js b/src/api/game/gamePartner.js
new file mode 100644
index 0000000..ea911cb
--- /dev/null
+++ b/src/api/game/gamePartner.js
@@ -0,0 +1,8 @@
+import request from "@/utils/request";
+
+export const getGamePartnerList = () => {
+    return request({
+        url: '/admin/gamePartner/info/listAll',
+        method: 'get',
+    });
+}
\ No newline at end of file
diff --git a/src/api/home/homeGameTab.js b/src/api/home/homeGameTab.js
new file mode 100644
index 0000000..9c0d2c4
--- /dev/null
+++ b/src/api/home/homeGameTab.js
@@ -0,0 +1,33 @@
+import request from "@/utils/request";
+
+export const getHomeGameTabPage = query => {
+    return request({
+        url: '/admin/home/game/tab/page',
+        method: 'get',
+        params: query,
+    });
+}
+
+export const saveHomeGameTab = data => {
+    return request({
+        url: '/admin/home/game/tab',
+        method: 'post',
+        data: data,
+    });
+}
+
+export const updateHomeGameTab = data => {
+    return request({
+        url: '/admin/home/game/tab',
+        method: 'post',
+        data: data,
+    });
+}
+
+export const delHomeGameTab = query => {
+    return request({
+        url: '/admin/home/game/tab',
+        method: 'get',
+        params: query,
+    });
+}
diff --git a/src/utils/maintainer.js b/src/utils/maintainer.js
index 497ce80..54d2144 100644
--- a/src/utils/maintainer.js
+++ b/src/utils/maintainer.js
@@ -56,4 +56,16 @@ export function param(json) {
         return encodeURIComponent(key) + '=' +
             encodeURIComponent(json[key])
     })).join('&')
+}
+
+export function buildSelectOption(id, defVal, array) {
+    let $select = $(id);
+    for(let i in array) {
+        let obj = array[i];
+        let selected = false;
+        if (obj.value == defVal) {
+            selected = true;
+        }
+        $select.append('<option value="' + obj.value + '"' + (selected ? 'selected' : '') + '>' + obj.text + '</option>');
+    }
 }
\ No newline at end of file
diff --git a/src/views/home/HomeGameTabAdminView.vue b/src/views/home/HomeGameTabAdminView.vue
new file mode 100644
index 0000000..6b7edca
--- /dev/null
+++ b/src/views/home/HomeGameTabAdminView.vue
@@ -0,0 +1,300 @@
+<template>
+    <section class="content">
+        <div class="box box-danger">
+            <div class="box-body">
+                <!-- Content Header (Page header) -->
+                <section class="content-header">
+                    <h1 id="itemTitle"></h1>
+                </section>
+                <!-- .content -->
+                <section class="content">
+                    <div id="table"></div>
+                    <div id="toolbar">
+                        <button id="addBtn" class="btn btn-default">
+                            <i class="glyphicon glyphicon-plus"></i>添加
+                        </button>
+                    </div>
+                </section><!-- .content -->
+            </div>
+        </div>
+    </section>
+    <div class="modal fade" id="editModal" 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">&times;</span>
+                    </button>
+                    <h4 class="modal-title" id="modalLabel">添加分类</h4>
+                </div>
+                <div class="modal-body">
+                    <form class="form-horizontal">
+                        <input type="hidden" name="id" v-model="homeGameTab.id" />
+                        <div class="form-group">
+                            <label for="seqNo" class="col-sm-3 control-label">排序<font color="red">*</font>:</label>
+                            <div class="col-sm-8">
+                                <input type="text" class="form-control validate[required]" name="seqNo" id="seqNo"
+                                    v-model="homeGameTab.seqNo" />
+                            </div>
+                        </div>
+                        <div class="form-group">
+                            <label for="tabName" class="col-sm-3 control-label">名称<font color="red">*</font>:</label>
+                            <div class="col-sm-8">
+                                <input type="text" class="form-control validate[required]" name="tabName" id="tabName"
+                                    v-model="homeGameTab.tabName" />
+                            </div>
+                        </div>
+                        <div class="form-group">
+                            <label for="gameId" class="col-sm-3 control-label">用户列表:</label>
+                            <div class="col-sm-8">
+                                <select name="gameId" class="form-control" id="gameId" v-model="homeGameTab.gameId">
+                                </select>
+                            </div>
+                        </div>
+                        <div class="form-group">
+                            <label for="erbanNoStr" class="col-sm-3 control-label">用户列表:</label>
+                            <div class="col-sm-8">
+                                <input type="text" class="form-control validate[required]" name="erbanNoStr" id="erbanNoStr" placeholder="多个用,隔开"
+                                    v-model="homeGameTab.erbanNoStr" />
+                            </div>
+                        </div>
+                        <div class="form-group">
+                            <label class="col-sm-3 control-label">选中状态图</label>
+                            <div class="col-sm-8">
+                                <input type="hidden" class="form-control" name="onClick" v-model="homeGameTab.onClick" />
+                                <img :src="homeGameTab.onClick" style="width:120px;"/>
+                                <input type="file" class="form-control" id="onClickFile" name="uploadFile">
+                            </div>
+                        </div>
+                        <div class="form-group">
+                            <label class="col-sm-3 control-label"></label>
+                            <div class="col-sm-8">
+                                <button class="btn btn-success col-sm-4" type="button" id="onClickUploadBtn">上传</button>
+                                <span class="btn col-sm-4" id="onClickUploadInfo" style="color:red;"></span>
+                            </div>
+                        </div>
+                        <div class="form-group">
+                            <label class="col-sm-3 control-label">未选中状态图</label>
+                            <div class="col-sm-8">
+                                <input type="hidden" class="form-control" name="onUnclick" v-model="homeGameTab.onUnclick" />
+                                <img :src="homeGameTab.onUnclick" style="width:120px;"/>
+                                <input type="file" class="form-control" id="onUnclickFile" name="uploadFile">
+                            </div>
+                        </div>
+                        <div class="form-group">
+                            <label class="col-sm-3 control-label"></label>
+                            <div class="col-sm-8">
+                                <button class="btn btn-success col-sm-4" type="button" id="onUnclickUploadBtn">上传</button>
+                                <span class="btn col-sm-4" id="onUnclickUploadInfo" style="color:red;"></span>
+                            </div>
+                        </div>
+                    </form>
+                </div>
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
+                    <button type="button" class="btn btn-primary" id="save">保存</button>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+  
+<script>
+import TableHelper from '@/utils/bootstrap-table-helper';
+import { getHomeGameTabPage, saveHomeGameTab, updateHomeGameTab, delHomeGameTab } from '@/api/home/homeGameTab';
+import { getGamePartnerList } from '@/api/game/gamePartner';
+import { apiResult, buildSelectOption } from '@/utils/maintainer';
+
+export default {
+    name: 'HomeGameTabAdminView',
+    data() {
+        return {
+            columns: [
+                { field: 'seqNo', title: '排序', align: 'center', width: '5%' },
+                { field: 'tabName', title: '游戏名', align: 'center', width: '5%' },
+                { 
+                    field: 'onClick', 
+                    title: '点击状态下图片', 
+                    align: 'center', 
+                    width: '5%',
+                    formatter: function (val, row, index) {
+                        return '<img src="' + val + '" width="70" height="60"/>';
+                    }
+                },
+                { 
+                    field: 'onUnclick', 
+                    title: '未点击状态下图片', 
+                    align: 'center', 
+                    width: '5%',
+                    formatter: function (val, row, index) {
+                        return '<img src="' + val + '" width="70" height="60"/>';
+                    }
+                },
+                { field: 'erbanNoStr', title: '配置用户列表', align: 'center', width: '5%' },
+                {
+                    field: 'id',
+                    title: '操作',
+                    align: 'center',
+                    width: '20%',
+                    formatter: function (val, row, index) {
+                        let value = '<button class="btn btn-sm btn-success opt-edit" data-id="' + val + '" data-index="' + index + '">编辑</button>';
+                        value += '<button class="btn btn-sm btn-danger opt-del" data-id="' + val + '" data-index="' + index + '">删除</button>';
+                        return value;
+                    }
+                }
+            ],
+            gamePartners: [],
+            homeGameTab: {
+                id: 0,
+                tabName: '',
+                gameId: 0,
+                onClick: '',
+                onUnclick: '',
+                erbanNoStr: '',
+                seqNo: 0,
+            },
+        };
+    },
+    created() {
+        this.getGame();
+        this.init();
+    },
+    methods: {
+        init() {
+            this.$nextTick(function () {
+                let $this = this;
+                $this.initTable();
+                $('#addBtn').click(function () {
+                    $this.add();
+                });
+                $('#table').on('click', '.opt-edit', function () {
+                    $this.edit(this);
+                });
+                $('#table').on('click', '.opt-del', function () {
+                    $this.del(this);
+                });
+                $('#save').click(function () {
+                    $this.save();
+                });
+                $('#onClickUploadBtn').click(function () {
+                    uploadFile('onClickFile').then(res => {
+                        $this.homeGameTab.onClick = res.path;
+                    });
+                });
+                $('#onUnclickUploadBtn').click(function () {
+                    uploadFile('onUnclickFile').then(res => {
+                        $this.homeGameTab.onUnclick = res.path;
+                    });
+                });
+            });
+        },
+        initTable() {
+            let $this = this;
+            TableHelper.destroy('#table');
+            $('#table').bootstrapTable({
+                columns: $this.columns,
+                cache: false,
+                striped: true,
+                showRefresh: false,
+                pageSize: 10,
+                pagination: true,
+                pageList: [1, 10, 20, 30, 50],
+                search: false,
+                sidePagination: 'server',
+                queryParamsType: 'undefined',
+                queryParams: function queryParams(params) {
+                    var param = {
+                        pageNum: params.pageNumber,
+                        pageSize: params.pageSize,
+                    };
+                    return param;
+                },
+                ajax:function(request){
+                    getHomeGameTabPage(request.data).then(res => {
+                        let data = res.data;
+                        request.success({
+                            'rows': data.records,
+                            'total': data.total
+                        });
+                    });
+                },
+                toolbar: '#toolbar',
+            });
+        },
+        add() {
+            this.homeGameTab.id = 0;
+            this.homeGameTab.tabName = '';
+            this.homeGameTab.gameId = 0;
+            this.homeGameTab.onClick = '';
+            this.homeGameTab.onUnclick = '';
+            this.homeGameTab.erbanNoStr = '';
+            this.homeGameTab.seqNo = 0;
+            this.show();
+        },
+        edit(obj) {
+            const index = $(obj).data('index');
+            const record = TableHelper.getData('#table')[index];
+            this.homeGameTab.id = record.id;
+            this.homeGameTab.tabName = record.tabName;
+            this.homeGameTab.gameId = record.gameId;
+            this.homeGameTab.onClick = record.onClick;
+            this.homeGameTab.onUnclick = record.onUnclick;
+            this.homeGameTab.erbanNoStr = record.erbanNoStr;
+            this.homeGameTab.seqNo = record.seqNo;
+            this.show();
+        },
+        show() {
+            $('#editModal').modal('show');
+        },
+        save() {
+            let data = {
+                id: this.homeGameTab.id,
+                tabName: this.homeGameTab.tabName,
+                gameId: new Number(this.homeGameTab.gameId),
+                onClick: this.homeGameTab.onClick,
+                onUnclick: this.homeGameTab.onUnclick,
+                erbanNoStr: this.homeGameTab.erbanNoStr,
+                seqNo: new Number(this.category.seqNo),
+            };
+            (data.id ? updateHomeGameTab(data) : saveHomeGameTab(data)).then(res => {
+                console.log(res);
+                apiResult(res);
+                TableHelper.doRefresh('#table');
+                $('#editModal').modal('hide');
+            });
+
+        },
+        del(obj) {
+            const index = $(obj).data('index');
+            const record = TableHelper.getData('#table')[index];
+            const id = record.id;
+            if (!confirm('是否确定要删除？')) {
+                return;
+            }
+            delHomeGameTab(id).then(res => {
+                console.log(res);
+                apiResult(res);
+                TableHelper.doRefresh('#table');
+            });
+        },
+        getGame() {
+            getGamePartnerList().then(res => {
+                let data = res.data;
+                if (data) {
+                    this.gamePartners = data.map(v => {
+                        return {
+                            value: v.gameId,
+                            text: v.gameName
+                        };
+                    });
+                }
+                if (this.gamePartners.length > 0) {
+                    buildSelectOption('#gameId', this.gamePartners[0].value, this.gamePartners);
+                }
+            });
+        }
+    },
+}
+</script>
+  
+<style scoped></style>
\ No newline at end of file
diff --git a/src/views/room/RoomTabHomeView.vue b/src/views/room/RoomTabHomeView.vue
index 1fb0531..035be7b 100644
--- a/src/views/room/RoomTabHomeView.vue
+++ b/src/views/room/RoomTabHomeView.vue
@@ -15,7 +15,7 @@
                     </div>
                 </div>-->
                     <div class="col-sm-12">
-                        <label for="erbanNo" class="col-sm-2 control-label">房主音萌号:</label>
+                        <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>
@@ -23,6 +23,13 @@
                         <div class="col-sm-2">
                             <input type="text" class="form-control" name="roomTitle" id="roomTitle" placeholder="">
                         </div>
+                        <label for="isTop" class="col-sm-2 control-label">是否置顶:</label>
+                        <div class="col-sm-2">
+                            <select name="isTop" id="isTop" class="form-control">
+                                <option value="1">是</option>
+                                <option value="0">否</option>
+                            </select>
+                        </div>
                         <button id="btnSearch" class="btn btn-default">
                             <i class="glyphicon glyphicon-search"></i>查询
                         </button>
@@ -92,13 +99,21 @@
         </div>
     </div>
 </template>
+
 <script>
 import TableHelper from '@/utils/bootstrap-table-helper';
 import { formatTime } from '@/utils/maintainer';
 
+// tab类型选择变化查询
+/*function selectOnTabChange(obj){
+    // console.log(obj);
+    TableHelper.doRefresh('#table');
+}*/
 export default {
     name: "RoomTabHomeView",
-    setup() { },
+    setup() {
+        return {};
+    },
     created() {
         this.$nextTick(function () {
             this.initData();
@@ -106,11 +121,6 @@ export default {
     },
     methods: {
         initData() {
-            // tab类型选择变化查询
-            /*function selectOnTabChange(obj){
-                // console.log(obj);
-                TableHelper.doRefresh('#table');
-            }*/
             $(function () {
                 $('.datetime').datetimepicker({
                     format: 'yyyy-mm-dd hh:ii:00',
@@ -118,12 +128,11 @@ export default {
                 });
                 // 拉取所有tab
                 //getRoomTabs();
+
                 $('#table').bootstrapTable('destroy');
-                // 清空分页组件的容器
-                $('.fixed-table-pagination').empty();
                 $('#table').bootstrapTable({
                     columns: [
-                        { field: 'erbanNo', title: '房主音萌号', align: 'center', width: '5%' },
+                        { 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%' },
@@ -144,6 +153,7 @@ export default {
                                 } else {
                                     return '否';
                                 }
+
                             }
                         },
                         { field: 'seq', title: '置顶排序', align: 'center', width: '5%' },
@@ -155,10 +165,10 @@ export default {
                             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 + '>' +
+                                return '<button id="btnEdit" name="btnEdit" class="btn btn-sm btn-success opt-edit" data-id="' + val + '" >' +
                                     '<i class="glyphicon glyphicon-edit"></i> 编辑</button>' +
-                                    '&nbsp;&nbsp;<button class="btn btn-sm btn-danger opt-remove" data-id=' + val +
-                                    '><i class="glyphicon glyphicon-remove"></i>删除</button>';
+                                    '&nbsp;&nbsp;<button class="btn btn-sm btn-danger opt-remove" data-id="' + val +
+                                    '"><i class="glyphicon glyphicon-remove"></i>删除</button>';
                             }
                         }
                     ],
@@ -181,7 +191,8 @@ export default {
                             page: params.pageNumber,
                             pageSize: params.pageSize,
                             erbanNo: $('#erbanNo').val(),
-                            roomTitle: $('#roomTitle').val()
+                            roomTitle: $('#roomTitle').val(),
+                            isTop: $('#isTop').val(),
                             //tabId: tabId
                         };
                         console.log(param);
@@ -214,21 +225,23 @@ export default {
                         console.log("load fail");
                     }
                 });
+
                 // 查询刷新
                 $('#btnSearch').on('click', function () {
                     TableHelper.doRefresh('#table');
                 });
+
                 // 编辑或者新增
                 $("#btnConfirm").click(function () {
                     var id = $("#id").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();
                     if (!iconContent) {
                         iconContent = '';
                     }
-                    var topStart = $("#modal_topStart").val();
-                    var topEnd = $("#modal_topEnd").val();
                     if ($("#addForm").validationEngine('validate')) {
                         $.ajax({
                             type: "post",
@@ -257,34 +270,39 @@ export default {
                             }
                         });
                     }
+
                 });
+
                 // 获取信息
                 $("#table").on("click", '.opt-edit', function () {
                     var id = $(this).attr("data-id");
-                    $.ajax({
-                        type: "get",
-                        url: "/admin/roomTabHome/get.action",
-                        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));
-                                // 打开编辑弹窗
-                                $("#roomTabHomeModal").modal('show');
-                                $("#modalLabel").text("编辑");
-                            } else {
-                                $("#tipMsg").text("获取菜单信息出错");
-                                $("#tipModal").modal('show');
+                    if (id && id != 'null') {
+                        $.ajax({
+                            type: "get",
+                            url: "/admin/roomTabHome/get.action",
+                            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));
+                                } else {
+                                    $("#tipMsg").text("获取菜单信息出错");
+                                    $("#tipModal").modal('show');
+                                }
                             }
-                        }
-                    });
+                        });
+                    }
+                    // 打开编辑弹窗
+                    $("#roomTabHomeModal").modal('show');
+                    $("#modalLabel").text("编辑");
                 });
+
                 // 删除操作
                 $("#table").on("click", '.opt-remove', function () {
                     var id = $(this).attr("data-id");
@@ -312,6 +330,7 @@ export default {
                         });
                     }
                 });
+
                 // 通过接口获取所有房间tab
                 function getRoomTabs() {
                     $.ajax({
@@ -337,9 +356,12 @@ export default {
                         }
                     });
                 }
+
             });
         }
-    }
+    },
+
 };
 </script>
 
+<style scoped></style>
\ No newline at end of file