diff --git a/src/api/room/roomTabRegion.js b/src/api/room/roomTabRegion.js
new file mode 100644
index 0000000..ea9ec79
--- /dev/null
+++ b/src/api/room/roomTabRegion.js
@@ -0,0 +1,40 @@
+import request from '@/utils/request';
+
+export const listRegionTab = query => {
+    return request({
+        url: '/admin/roomTabRegion/listRegionTab',
+        method: 'get',
+        params: query
+    });
+};
+
+export const list = query => {
+    return request({
+        url: '/admin/roomTabRegion/list',
+        method: 'get',
+        params: query
+    });
+};
+
+export const get = query => {
+    return request({
+        url: '/admin/roomTabRegion/get',
+        method: 'get',
+        params: query
+    });
+};
+
+export const save = query => {
+    return request({
+        url: '/admin/roomTabRegion/save',
+        method: 'post',
+        params: query
+    });
+};
+export const del = query => {
+    return request({
+        url: '/admin/roomTabRegion/delete',
+        method: 'post',
+        params: query
+    });
+};
\ No newline at end of file
diff --git a/src/views/room/RoomTabMapView.vue b/src/views/room/RoomTabMapView.vue
index 7da2b4e..40d0449 100644
--- a/src/views/room/RoomTabMapView.vue
+++ b/src/views/room/RoomTabMapView.vue
@@ -1,133 +1,197 @@
 <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="roomTab" class="col-sm-2 control-label">房间Tab:</label>
-                        <div class="col-sm-2">
-                            <select name="roomTab" id="roomTab" class="col-sm-2 form-control" data-btn-class="btn-warning"
-                                onchange="selectOnTabChange(this)">
-                            </select>
-                        </div>
-                        <label for="partitionId" class="col-sm-2 control-label">地区:</label>
-                        <div class="col-sm-2">
-                            <select name="partitionId" id="partitionId" class="form-control"></select>
-                        </div>
-                        <button id="btnAddRoom" class="btn btn-default">
-                            <i class="glyphicon glyphicon-plus"></i>添加房间
-                        </button>
-                    </div>
-                    <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>
-                        <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="roomTab"
+                   class="col-sm-2 control-label">房间Tab:</label>
+            <div class="col-sm-2">
+              <select name="roomTab"
+                      id="roomTab"
+                      class="col-sm-2 form-control"
+                      data-btn-class="btn-warning"
+                      onchange="selectOnTabChange(this)">
+              </select>
             </div>
-
-            <!-- .content -->
-            <div id="table"></div>
-
-        </div>
-    </section>
-
-    <!-- 编辑弹框 -->
-    <div class="modal fade" id="roomTabMapModal" 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" id="addForm">
-                        <input type="hidden" name="id" id="id" />
-                        <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 validate[required]">
-                                    <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 validate[custom[integer]]" 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>
-                    </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="partitionId"
+                   class="col-sm-2 control-label">地区:</label>
+            <div class="col-sm-2">
+              <select name="partitionId"
+                      id="partitionId"
+                      class="form-control"></select>
             </div>
+            <button id="btnAddRoom"
+                    class="btn btn-default">
+              <i class="glyphicon glyphicon-plus"></i>添加房间
+            </button>
+          </div>
+          <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>
+            <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="addRoomTabMapModal" 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="modalLabel2">增加房间</h4>
-                </div>
-                <div class="modal-body">
-                    <form class="form-horizontal" id="addForm2">
-                        <div class="form-group">
-                            <label for="sendErbanNo" class="col-sm-3 control-label">房间平台号</label>
-                            <div class="col-sm-9">
-                                <textarea name="sendErbanNo" id="sendErbanNo" class="form-control validate[required]"
-                                    placeholder="多个平台号使用换行符分隔"></textarea>
-                            </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="btnConfirm2">确定</button>
-                </div>
-
-            </div>
+  <!-- 编辑弹框 -->
+  <div class="modal fade"
+       id="roomTabMapModal"
+       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"
+                id="addForm">
+            <input type="hidden"
+                   name="id"
+                   id="id" />
+            <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 validate[required]">
+                  <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 validate[custom[integer]]"
+                       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>
+          </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>
+
+  <!-- 增加房间弹框 -->
+  <div class="modal fade"
+       id="addRoomTabMapModal"
+       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="modalLabel2">增加房间</h4>
+        </div>
+        <div class="modal-body">
+          <form class="form-horizontal"
+                id="addForm2">
+            <div class="form-group">
+              <label for="sendErbanNo"
+                     class="col-sm-3 control-label">房间平台号</label>
+              <div class="col-sm-9">
+                <textarea name="sendErbanNo"
+                          id="sendErbanNo"
+                          class="form-control validate[required]"
+                          placeholder="多个平台号使用换行符分隔"></textarea>
+              </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="btnConfirm2">确定</button>
+        </div>
+
+      </div>
+    </div>
+  </div>
 </template>
 
 <script>
@@ -137,337 +201,339 @@ import { getPartitionInfoList } from '@/api/partition/partitionInfo';
 import { buildSelectOption } from '@/utils/system-helper';
 
 export default {
-    name: "RoomTabMapView",
-    setup() {
-        // tab类型选择变化查询
-        function selectOnTabChange(obj) {
-            // console.log(obj);
-            TableHelper.doRefresh('#table');
-        }
-        window.selectOnTabChange = selectOnTabChange;
-        return {
-            selectOnTabChange
-        };
-    },
-    created() {
-        this.$nextTick(function () {
-            this.initPartition();
-            this.initData();
+  name: "RoomTabMapView",
+  setup () {
+    // tab类型选择变化查询
+    function selectOnTabChange (obj) {
+      // console.log(obj);
+      TableHelper.doRefresh('#table');
+    }
+    window.selectOnTabChange = selectOnTabChange;
+    return {
+      selectOnTabChange
+    };
+  },
+  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();
+        // 拉取所有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: 'isPermitRoom', 
-                            title: '房间类型', 
-                            align: 'center', 
-                            width: '8%',
-                            formatter: function (val, row, index) {
-                                let value = '';
-                                if (val == 1) {
-                                    value = '牌照房';
-                                } else if (val == 4) {
-                                    value = '个播房';
-                                } else {
-                                    value = '非牌照房';
-                                }
-                                return value;
-                            }
-                        },
-                        { field: 'roomTag', title: '房间标签', align: 'center', width: '5%' },
-                        { field: 'partitionDesc', title: '地区', align: 'center', valign: 'middle' },
-                        {
-                            field: 'isTop', title: '是否置顶', align: 'center', valign: 'middle', width: '5%',
-                            formatter: function (val, row, index) {
-                                if (val) {
-                                    return '是';
-                                } else {
-                                    return '否';
-                                }
-
-                            }
-                        },
-                        { field: 'topStart', title: '置顶开始时间', align: 'center', valign: 'middle', width: '10%', formatter: formatTime },
-                        { field: 'topEnd', title: '置顶结束时间', align: 'center', valign: 'middle', width: '10%', formatter: formatTime },
-                        { field: 'seq', title: '置顶排序', align: 'center', width: '5%' },
-                        {
-                            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 + '>' +
-                                    '<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>';
-                            }
-                        }
-                    ],
-                    undefinedText: "",
-                    cache: false,
-                    striped: true,
-                    showRefresh: false,
-                    pageSize: 10,
-                    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(),
-                            tabId: tabId,
-                            partitionId: $('#partitionId').val(),
-                        };
-                        console.log(param);
-                        return param;
-                    },
-                    ajax: function (request) {                    //使用ajax请求
-                        $.ajax({
-                            type: "GET",
-                            url: '/admin/roomTabMap/list',
-                            contentType: 'application/json;charset=utf-8',
-                            dataType: 'json',
-                            data: request.data,
-                            success: function (res) {
-                                console.log(res);
-                                request.success({
-                                    rows: res.data.roomTabMapList,
-                                    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');
-                });
-
-                // 添加房间打开弹窗
-                $("#btnAddRoom").on('click', function () {
-                    //清除数据
-                    $('#addRoomTabMapModal').find('input').val('');
-                    $('#addRoomTabMapModal').find('textarea').val('');
-                    //$('#modal_isHome2').val('');
-                    $('#addRoomTabMapModal').modal('show');
-                });
-
-                // 添加房间
-                $("#btnConfirm2").click(function () {
-                    var erbanNo = $('#sendErbanNo').val().trim();//去掉首尾的空格和换行符
-                    if (!(erbanNo.length > 0)) {
-                        $("#tipMsg").text("请输入房间平台号");
-                        $("#tipModal").modal('show');
-                        return;
-                    }
-                    var tabId = $('#roomTab').val();
-                    if (tabId.length <= 0) {
-                        $("#tipMsg").text("请选择正确的房间Tab");
-                        $("#tipModal").modal('show');
-                        return;
-                    }
-                    if ($("#addForm2").validationEngine('validate')) {
-                        $.ajax({
-                            type: "post",
-                            url: "/admin/roomTabMap/add",
-                            data: {
-                                erbanNo: erbanNo,
-                                isHome: 1,
-                                tabId: tabId,
-                            },
-                            dataType: "json",
-                            success: function (json) {
-                                if (json.code == 200) {
-                                    $("#tipMsg").text("成功用户:" + json.data.success + "    失败用户:" + json.data.fail);
-                                    $("#tipModal").modal('show');
-                                    TableHelper.doRefresh('#table');
-                                    $("#addRoomTabMapModal").modal('hide');
-                                } else {
-                                    $("#tipMsg").text("保存失败." + json.data.msg);
-                                    $("#tipModal").modal('show');
-                                    $("#addRoomTabMapModal").modal('hide');
-                                }
-                            }
-                        });
-                    }
-                });
-
-                // 编辑或者新增
-                $("#btnConfirm").click(function () {
-                    var id = $("#id").val();
-                    var seq = $("#modal_seq").val();
-                    var isHome = $("#modal_isHome").val();
-                    var isTop = $("#modal_isTop").val();
-                    var topStart = $('#modal_topStart').val();
-                    var topEnd = $('#modal_topEnd').val();
-                    if ($("#addForm").validationEngine('validate')) {
-                        $.ajax({
-                            type: "post",
-                            url: "/admin/roomTabMap/save",
-                            data: {
-                                id: id,
-                                seq: seq,
-                                isHome: isHome,
-                                isTop: isTop,
-                                topStart: topStart,
-                                topEnd: topEnd,
-                            },
-                            dataType: "json",
-                            success: function (json) {
-                                if (json.code == 200) {
-                                    $("#tipMsg").text("保存成功");
-                                    $("#tipModal").modal('show');
-                                    TableHelper.doRefresh("#table");
-                                    $("#roomTabMapModal").modal('hide');
-                                } else {
-                                    $("#tipMsg").text("保存失败." + json.msg);
-                                    $("#tipModal").modal('show');
-                                    TableHelper.doRefresh("#table");
-                                    $("#roomTabMapModal").modal('hide');
-                                }
-                            }
-                        });
-                    }
-
-                });
-
-                // 获取信息
-                $("#table").on("click", '.opt-edit', function () {
-                    var id = $(this).attr("data-id");
-                    $.ajax({
-                        type: "get",
-                        url: "/admin/roomTabMap/get",
-                        data: { id: id },
-                        dataType: "json",
-                        success: function (ret) {
-                            if (ret.code == 200) {
-                                var json = ret.data.roomTabMap;
-                                $("#id").val(id);
-                                $("#modal_seq").val(json.seq);
-                                $("#modal_isTop").val(json.isTop ? 1 : 0);
-                                $("#modal_isHome").val(json.isHome ? 1 : 0);
-                                $('#modal_topStart').val(formatTime(json.topStart));
-                                $('#modal_topEnd').val(formatTime(json.topEnd));
-                                // 打开编辑弹窗
-                                $("#roomTabMapModal").modal('show');
-                                $("#modalLabel").text("编辑");
-                            } else {
-                                $("#tipMsg").text("获取菜单信息出错");
-                                $("#tipModal").modal('show');
-                            }
-                        }
-                    });
-                });
-
-                // 删除操作
-                $("#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/roomTabMap/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: 'isPermitRoom',
+              title: '房间类型',
+              align: 'center',
+              width: '8%',
+              formatter: function (val, row, index) {
+                let value = '';
+                if (val == 1) {
+                  value = '牌照房';
+                } else if (val == 4) {
+                  value = '个播房';
+                } else {
+                  value = '非牌照房';
+                }
+                return value;
+              }
+            },
+            { field: 'roomTag', title: '房间标签', align: 'center', width: '5%' },
+            { field: 'partitionDesc', title: '地区', align: 'center', valign: 'middle' },
+            {
+              field: 'isTop', title: '是否置顶', align: 'center', valign: 'middle', width: '5%',
+              formatter: function (val, row, index) {
+                if (val) {
+                  return '是';
+                } else {
+                  return '否';
                 }
 
+              }
+            },
+            { field: 'topStart', title: '置顶开始时间', align: 'center', valign: 'middle', width: '10%', formatter: formatTime },
+            { field: 'topEnd', title: '置顶结束时间', align: 'center', valign: 'middle', width: '10%', formatter: formatTime },
+            { field: 'seq', title: '置顶排序', align: 'center', width: '5%' },
+            {
+              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 + '>' +
+                  '<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>';
+              }
+            }
+          ],
+          undefinedText: "",
+          cache: false,
+          striped: true,
+          showRefresh: false,
+          pageSize: 10,
+          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(),
+              tabId: tabId,
+              partitionId: $('#partitionId').val(),
+            };
+            console.log(param);
+            return param;
+          },
+          ajax: function (request) {                    //使用ajax请求
+            $.ajax({
+              type: "GET",
+              url: '/admin/roomTabMap/list',
+              contentType: 'application/json;charset=utf-8',
+              dataType: 'json',
+              data: request.data,
+              success: function (res) {
+                console.log(res);
+                request.success({
+                  rows: res.data.roomTabMapList,
+                  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');
+        });
+
+        // 添加房间打开弹窗
+        $("#btnAddRoom").on('click', function () {
+          //清除数据
+          $('#addRoomTabMapModal').find('input').val('');
+          $('#addRoomTabMapModal').find('textarea').val('');
+          //$('#modal_isHome2').val('');
+          $('#addRoomTabMapModal').modal('show');
+        });
+
+        // 添加房间
+        $("#btnConfirm2").click(function () {
+          var erbanNo = $('#sendErbanNo').val().trim();//去掉首尾的空格和换行符
+          if (!(erbanNo.length > 0)) {
+            $("#tipMsg").text("请输入房间平台号");
+            $("#tipModal").modal('show');
+            return;
+          }
+          var tabId = $('#roomTab').val();
+          if (tabId.length <= 0) {
+            $("#tipMsg").text("请选择正确的房间Tab");
+            $("#tipModal").modal('show');
+            return;
+          }
+          if ($("#addForm2").validationEngine('validate')) {
+            $.ajax({
+              type: "post",
+              url: "/admin/roomTabMap/add",
+              data: {
+                erbanNo: erbanNo,
+                isHome: 1,
+                tabId: tabId,
+              },
+              dataType: "json",
+              success: function (json) {
+                if (json.code == 200) {
+                  $("#tipMsg").text("成功用户:" + json.data.success + "    失败用户:" + json.data.fail);
+                  $("#tipModal").modal('show');
+                  TableHelper.doRefresh('#table');
+                  $("#addRoomTabMapModal").modal('hide');
+                } else {
+                  $("#tipMsg").text("保存失败." + json.data.msg);
+                  $("#tipModal").modal('show');
+                  $("#addRoomTabMapModal").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,
-                    };
-                    }))
-                );
+          }
+        });
+
+        // 编辑或者新增
+        $("#btnConfirm").click(function () {
+          var id = $("#id").val();
+          var seq = $("#modal_seq").val();
+          var isHome = $("#modal_isHome").val();
+          var isTop = $("#modal_isTop").val();
+          var topStart = $('#modal_topStart').val();
+          var topEnd = $('#modal_topEnd').val();
+          if ($("#addForm").validationEngine('validate')) {
+            $.ajax({
+              type: "post",
+              url: "/admin/roomTabMap/save",
+              data: {
+                id: id,
+                seq: seq,
+                isHome: isHome,
+                isTop: isTop,
+                topStart: topStart,
+                topEnd: topEnd,
+              },
+              dataType: "json",
+              success: function (json) {
+                if (json.code == 200) {
+                  $("#tipMsg").text("保存成功");
+                  $("#tipModal").modal('show');
+                  TableHelper.doRefresh("#table");
+                  $("#roomTabMapModal").modal('hide');
+                } else {
+                  $("#tipMsg").text("保存失败." + json.msg);
+                  $("#tipModal").modal('show');
+                  TableHelper.doRefresh("#table");
+                  $("#roomTabMapModal").modal('hide');
+                }
+              }
             });
-        },
+          }
+
+        });
+
+        // 获取信息
+        $("#table").on("click", '.opt-edit', function () {
+          var id = $(this).attr("data-id");
+          $.ajax({
+            type: "get",
+            url: "/admin/roomTabMap/get",
+            data: { id: id },
+            dataType: "json",
+            success: function (ret) {
+              if (ret.code == 200) {
+                var json = ret.data.roomTabMap;
+                $("#id").val(id);
+                $("#modal_seq").val(json.seq);
+                $("#modal_isTop").val(json.isTop ? 1 : 0);
+                $("#modal_isHome").val(json.isHome ? 1 : 0);
+                $('#modal_topStart').val(formatTime(json.topStart));
+                $('#modal_topEnd').val(formatTime(json.topEnd));
+                // 打开编辑弹窗
+                $("#roomTabMapModal").modal('show');
+                $("#modalLabel").text("编辑");
+              } else {
+                $("#tipMsg").text("获取菜单信息出错");
+                $("#tipModal").modal('show');
+              }
+            }
+          });
+        });
+
+        // 删除操作
+        $("#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/roomTabMap/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++) {
+                  const item = data[i];
+                  const desc = JSON.parse(item.name).zh;
+                  console.log(item.name.zh);
+                  //拼接成多个<option><option/>
+                  tabs.push('<option value="' + item.id + '">' + desc + '</option>')
+                }
+                $("#roomTab").html(tabs.join(' '));    //填充到select标签中
+              }
+            },
+            error: function () {
+              alert('查询房间tab出错');
+            }
+          });
+        }
+
+      });
     },
-    
+    initPartition () {
+      getPartitionInfoList().then(res => {
+        let data = res.data;
+        buildSelectOption(
+          "#partitionId",
+          null,
+          [{
+            value: '',
+            text: '全部',
+          }].concat(data.map((v) => {
+            return {
+              value: v.id,
+              text: v.desc,
+            };
+          }))
+        );
+      });
+    },
+  },
+
 };
 </script>
 
diff --git a/src/views/room/RoomTabRegionView.vue b/src/views/room/RoomTabRegionView.vue
new file mode 100644
index 0000000..784062b
--- /dev/null
+++ b/src/views/room/RoomTabRegionView.vue
@@ -0,0 +1,442 @@
+<template>
+  <div class="box">
+    <div class="inquire">
+      <span>分区</span>
+      <partition-select v-model:partition-id="formParam.partitionId"
+                        v-model:handle-change="updatePartitionId"
+                        v-model:after-init="initRegionTab" />
+    </div>
+    <!-- 类型 -->
+    <div class="inquire">
+      <span class="demonstration">国家</span>
+      <el-select v-model="formParam.regionId"
+                 class="input"
+                 placeholder="全部"
+                 clearable>
+        <el-option v-for="item in formParam.partitionRegionList"
+                   :key="item.id"
+                   :label="item.desc"
+                   :value="item.id" />
+      </el-select>
+    </div>
+
+    <!-- 查询按钮 -->
+    <el-button class="primary"
+               type="primary"
+               @click="listData">查询</el-button>
+
+    <!-- 编辑弹窗 -->
+    <el-dialog v-model="editDialog.show"
+               v-loading="editDialog.loading"
+               v-model:title="editDialog.title"
+               @close="closeEditDialog"
+               label-width="auto"
+               width="28%"
+               center>
+      <el-form :model="editDialog.obj">
+        <el-form-item label="是否展示">
+          <el-switch v-model="editDialog.obj.isHome"
+                     class="mb-2"
+                     active-text="是"
+                     inactive-text="否" />
+        </el-form-item>
+        <el-form-item label="是否置顶">
+          <el-switch v-model="editDialog.obj.isTop"
+                     class="mb-2"
+                     active-text="是"
+                     inactive-text="否" />
+        </el-form-item>
+        <el-form-item label="置顶排序位置">
+          <el-input type="number"
+                    v-model="editDialog.obj.seq" />
+        </el-form-item>
+        <el-form-item label="置顶开始时间">
+          <el-date-picker v-model="editDialog.obj.topStart"
+                          type="datetime"
+                          value-format="YYYY-MM-DD HH:mm:ss" />
+        </el-form-item>
+        <el-form-item label="置顶结束时间">
+          <el-date-picker v-model="editDialog.obj.topEnd"
+                          type="datetime"
+                          value-format="YYYY-MM-DD HH:mm:ss" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button @click="closeEditDialog">取消</el-button>
+          <el-button v-loading="editDialog.loading"
+                     type="primary"
+                     @click="saveObj">保存</el-button>
+        </div>
+      </template>
+    </el-dialog>
+
+    <!-- 表格 -->
+    <el-table v-loading="table.loading"
+              :data="table.data"
+              ref="multipleTable"
+              border
+              style="width: 100%; margin-top: 25px">
+      <el-table-column prop="roomUid"
+                       align="center"
+                       label="房主uid" />
+      <el-table-column prop="erbanNo"
+                       align="center"
+                       label="房主平台号" />
+      <el-table-column prop="roomTitle"
+                       align="center"
+                       label="标题" />
+      <el-table-column prop="roomTag"
+                       align="center"
+                       label="标签" />
+      <el-table-column prop="avatar"
+                       align="center"
+                       label="头像">
+        <template v-slot="scope">
+          <el-image :src="scope.row.avatar"
+                    :zoom-rate="1.1"
+                    fit="scale-down"
+                    preview-teleported="true"
+                    hide-on-click-modal="true" />
+        </template>
+      </el-table-column>
+      <el-table-column prop="isTop"
+                       align="center"
+                       label="是否置顶">
+        <template #default="scope">
+          {{ scope.row.isTop == undefined? '': scope.row.isTop ? '是' : '否' }}
+        </template>
+      </el-table-column>
+      <el-table-column prop="isShow"
+                       align="center"
+                       label="是否展示">
+        <template #default="scope">
+          {{ scope.row.isShow == undefined? '': scope.row.isShow ? '是' : '否' }}
+        </template>
+      </el-table-column>
+      <el-table-column prop="seq"
+                       align="center"
+                       label="排序" />
+      <el-table-column prop="topStart"
+                       align="center"
+                       label="置顶开始时间" />
+      <el-table-column prop="topEnd"
+                       align="center"
+                       label="置顶结束时间" />
+      <el-table-column prop="hourTop"
+                       align="center"
+                       label="小时榜排名" />
+      <el-table-column prop="hotValue"
+                       align="center"
+                       label="热力值" />
+      <el-table-column prop="regionFlag"
+                       align="center"
+                       label="国家旗帜">
+        <template v-slot="scope">
+          <el-image :src="scope.row.regionFlag"
+                    :zoom-rate="1.1"
+                    fit="scale-down"
+                    preview-teleported="true"
+                    hide-on-click-modal="true" />
+        </template>
+      </el-table-column>
+      <el-table-column prop="micUserCount"
+                       align="center"
+                       label="麦上人数" />
+      <el-table-column prop="onlineNum"
+                       align="center"
+                       label="房间人数" />
+      <el-table-column align="center"
+                       label="操作">
+        <template v-slot="scope">
+          <el-button @click="openEditDialog(scope.row)">编辑</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+  </div>
+</template>
+<script>
+// 声明额外的选项
+export default {
+  name: "RoomTabRegionView",
+};
+</script>
+<script setup>
+import { reactive } from "vue";
+import { listRegionTab, list, get, save } from "@/api/room/roomTabRegion";
+import { ElMessage } from "element-plus";
+
+const formParam = reactive({
+  partitionId: undefined,
+  regionId: undefined,
+  regionList: [],
+  partitionRegionList: [],
+});
+
+const table = reactive({
+  loading: false,
+  data: [],
+});
+
+const initRegionTab = async () => {
+  try {
+    const res = await listRegionTab();
+    if (res.code !== 200) {
+      throw Error(res.message);
+    }
+    formParam.regionList = res.data.map((item) => {
+      return {
+        ...item,
+        desc: JSON.parse(item.name).zh,
+      };
+    });
+    updatePartitionId(formParam.partitionId);
+  } catch (error) {
+    ElMessage({
+      showClose: true,
+      message: error.message,
+      type: "error",
+    });
+  }
+};
+
+const updatePartitionId = (partitionId) => {
+  formParam.partitionId = partitionId;
+  formParam.regionId = undefined;
+
+  const partitionRegionList = formParam.regionList.filter((item) => {
+    return !partitionId || ((item.partitionFlag & partitionId) != 0);
+  });
+  formParam.partitionRegionList = partitionRegionList;
+};
+
+const emptyObj = {
+  id: undefined,
+  roomUid: undefined,
+  tabId: undefined,
+  seq: 0,
+  isHome: true,
+  isTop: false,
+  topStart: undefined,
+  topEnd: undefined,
+};
+
+const editDialog = reactive({
+  show: false,
+  loading: false,
+  title: "",
+  obj: Object.assign({}, emptyObj),
+});
+
+const openEditDialog = async (row) => {
+  editDialog.show = true;
+  editDialog.title = "新增";
+
+  editDialog.obj.tabId = formParam.regionId
+  editDialog.obj.roomUid = row.roomUid
+
+  if (row.id) {
+    editDialog.title = "编辑";
+    editDialog.loading = true;
+    const params = { id: row.id };
+    try {
+      const res = await get(params);
+      if (res.code !== 200) {
+        throw Error(res.message);
+      }
+      editDialog.obj = res.data;
+    } catch (error) {
+      ElMessage({
+        showClose: true,
+        message: error,
+        type: "error",
+      });
+    } finally {
+      editDialog.loading = false;
+    }
+  }
+
+  editDialog.show = true;
+};
+
+const closeEditDialog = () => {
+  editDialog.show = false;
+  editDialog.obj = Object.assign({}, emptyObj);
+};
+
+function validObj (obj) {
+  let valid = false;
+  try {
+    if (!obj.isTop || !obj.isHome) {
+      obj.seq = 0;
+      obj.topStart = undefined;
+      obj.topEnd = undefined;
+    }
+
+    if (obj.isHome || obj.isTop) {
+      if (obj.seq <= 0) {
+        throw new Error('请输入正确的置顶序号');
+      }
+      if (!obj.topStart) {
+        throw new Error('请选择置顶开始时间');
+      }
+      if (!obj.topEnd) {
+        throw new Error('请选择置顶结束时间');
+      }
+      if (obj.topStart >= obj.topEnd) {
+        throw new Error('置顶开始时间不能大于等于置顶结束时间');
+      }
+    }
+
+    valid = true;
+  } catch (e) {
+    ElMessage({
+      showClose: true,
+      message: e,
+      type: "error",
+    });
+  }
+
+  return valid;
+}
+
+const saveObj = async () => {
+  // valid
+  if (!validObj(editDialog.obj)) {
+    return;
+  }
+
+  editDialog.loading = true;
+  try {
+    const params = { ...editDialog.obj };
+    const res = await save(params);
+    if (res.code !== 200) {
+      ElMessage({
+        showClose: true,
+        message: res.message,
+        type: "error",
+      });
+      return;
+    }
+
+    ElMessage({
+      showClose: true,
+      message: "保存成功",
+      type: "success",
+    });
+
+    closeEditDialog();
+
+    listData()
+  } catch (e) {
+    ElMessage({
+      showClose: true,
+      message: e,
+      type: "error",
+    });
+  } finally {
+    editDialog.loading = false;
+  }
+};
+
+const listData = async () => {
+  if (!formParam.partitionId) {
+    ElMessage({
+      showClose: true,
+      message: "请选择分区",
+      type: "error",
+    });
+    return;
+  }
+  if (!formParam.regionId) {
+    ElMessage({
+      showClose: true,
+      message: "请选择国家",
+      type: "error",
+    });
+    return;
+  }
+  table.loading = true;
+  const params = { tabId: formParam.regionId, partitionId: formParam.partitionId };
+  try {
+    const res = await list(params);
+    if (res.code !== 200) {
+      throw Error(res.message);
+    }
+    table.data = res.data;
+  } catch (e) {
+    ElMessage({
+      showClose: true,
+      message: e,
+      type: "error",
+    });
+  } finally {
+    table.loading = false;
+  }
+
+};
+
+</script>
+<style lang="less" scoped>
+.box {
+  padding-top: 20px;
+  background: #ecf0f5;
+  .inquire {
+    display: inline-block;
+    margin-right: 20px;
+    span {
+      margin-right: 10px;
+    }
+    .input {
+      width: 180px;
+      margin-right: 10px;
+    }
+  }
+  .dialogTableVisibleBut {
+    display: block;
+    margin: 30px 0 0 830px;
+  }
+  .paginationClass {
+    margin: 15px 0 5px 0px;
+  }
+}
+.selectBox {
+  display: flex;
+  height: 35px;
+  line-height: 35px;
+  margin-bottom: 20px;
+}
+.selectBoxImg {
+  height: 150px;
+}
+.pagination {
+  margin: 10px auto 10px;
+  position: relative;
+  left: 50%;
+  transform: translateX(-50%);
+}
+.pagination_in {
+  text-align: center;
+}
+.dialogBox {
+  width: 100%;
+  //   height: 50px;
+  //   line-height: 50px;
+  display: flex;
+  align-items: baseline;
+  margin-bottom: 20px;
+  .input {
+    width: 50%;
+  }
+  .selectBox {
+    display: flex;
+    height: 35px;
+    line-height: 35px;
+    margin-bottom: 20px;
+  }
+  .selectBoxImg {
+    height: 150px;
+  }
+}
+</style>