1. 优化

src/views/venue/performanceHallMr/dialog/seatTemplateEdit copy 2.vue

@@ -1,391 +0,0 @@
-<!--
- * @Description: 新增/编辑弹框
- * @Author: Sugar.
- * @Date: 2023-11-24 13:55:00
- * @LastEditors: Sugar.
- * @LastEditTime: 22023-11-24 13:55:00
- * @FilePath: \cattle_webui\src\views\venue\performanceHallMr\dialog\seatTemplateEdit.vue
- * @Copyright: Copyright (c) 2016~2023 by Sugar., All Rights Reserved.
--->
-<template>
-  <el-dialog
-    :title="title"
-    :visible.sync="open"
-    width="90%"
-    append-to-body
-    :close-on-click-modal="false"
-    @close="cancel"
-    :fullscreen="dialogFull"
-    class="ygh-dialog"
-  >
-    <template slot="title">
-        <div class="avue-crud__dialog__header">
-            <span class="el-dialog__title">
-            <span style="display:inline-block;background-color: #3478f5;width:3px;height:20px;margin-right:5px; float: left;margin-top:2px"></span>
-              座位配置
-            </span>
-          <div class="avue-crud__dialog__menu" @click="dialogFull? dialogFull=false: dialogFull=true">
-            <i class="el-icon-full-screen"></i>
-          </div>
-        </div>
-      </template>
-    <div class="dialog">
-      <seatManagementTable />
-    </div>
-    <span slot="footer" class="dialog-footer">
-      <el-button @click="cancel">取消</el-button>
-      <el-button
-        type="primary"
-        @click="submitForm"
-        v-loading.fullscreen.lock="loading"
-        element-loading-text="提交中..."
-        element-loading-spinner="el-icon-loading"
-        element-loading-background="rgba(0, 0, 0, 0.8)"
-      >
-        <span v-if="loading">提交中...</span>
-        <span v-else>保存</span>
-      </el-button>
-    </span>
-  </el-dialog>
-</template>
-
-<script>
-import { pageList } from '@/api/seatTypeMr/seatTypeMr'
-import { seatSaveAndEdit, saveAndEdit, getSelectById } from "@/api/performanceHallMr/performanceHallMr";
-import { getToken } from "@/utils/auth";
-import seatManagementTable from "../model/seatManagementTable"
-export default {
-  name: "seatTemplateEdit",
-  that: this,
-  components: {
-    seatManagementTable
-  },
-  data() {
-    return {
-      title: "编辑",
-      model: "EDIT",
-      activeName: '01',
-      open: false,
-      seatType: false,
-      loading: false,
-      seatWidth: null,
-      seatMap: {
-        row: 0,
-        col: 0,
-      },
-      seatMapRow: '',
-      seatMapCol: '',
-      seatSetMap: {},
-      seatTemplateMap: [],
-      colSeatMap: {},
-      form: {
-        id: undefined,
-        status: "1",
-        content: "",
-      },
-      seatList: [],
-      auditoriumId: '',
-      zoom: 10,
-      boxWidth: '',
-      initWidth: '',
-      moveStatus: false,
-      mouseMap: {},
-      mousemoveMap: {},
-      scrollTop: 0,
-      scrollLeft: 0,
-      scrollEvenTop: 0,
-      scrollEvenLeft: 0,
-      dragStatus: true,
-      canNum: [],
-      unCanNum: [],
-
-      drawForm: {
-        status: '1'
-      },
-      drawDialogType: false,
-      drawRules: {
-        status: [{ required: true, message: "请选择状态", trigger: ["change","blur"] }],
-        seatTypeId: [{ required: true, message: "请选择座位类型", trigger: ["change","blur"] }]
-      },
-
-      dialogFull: false,
-    };
-  },
-  methods: {
-    /**
-     * 打开弹框
-     * @date 2023-11-22
-     * @param {any} obj
-     * @returns {any}
-     */
-    openDialog(title, obj) {
-      this.open = true;
-      this.seatType = false;
-      this.getSeatTypeList();
-      this.colSeatMap = {}
-      this.drawForm = {};
-      this.$set(this.drawForm, 'status', '1')
-      this.boxWidth = 0;
-      this.dragStatus = true;
-      this.$set(this.form, 'status', '1')
-      if (obj){ // 编辑模式
-        this.title = "座位模板";
-        this.auditoriumId = obj.id;
-        this.$set(this.seatMap, 'row', obj.rows);
-        this.$set(this.seatMap, 'col', obj.cols);
-        this.$set(this, 'seatMapRow', obj.rows);
-        this.$set(this, 'seatMapCol', obj.cols);
-
-        this.getSelectByIdApi(obj)
-      }else{ // 新增模式
-        this.seatType = true;
-        this.title = "座位模板";
-        this.$nextTick(() => {
-          this.$refs["form"].clearValidate();
-        });
-      }
-    },
-    /** 获取详情 */
-    getSelectByIdApi(row) {
-      const id = row.id
-      getSelectById(id).then(response => {
-        const dataList = response.data;
-        this.$nextTick(() =>{
-          dataList.forEach(item => {
-            if(item.status == 2){
-              item.color = '#7d7d7e';
-            }
-            this.$set(this.colSeatMap, item.sortId + '_', item);
-          })
-          this.seatType = true;
-        })
-      });
-    },
-    /** 座位类型列表 */
-    getSeatTypeList() {
-      pageList(this.addDateRange({pageNum: 1, pageSize: 100}))
-        .then(response => {
-            this.seatList = response.data.rows;
-          }
-        );
-    },
-    /**
-     * 保存
-     * @date 2023-11-22
-     * @returns {any}
-     */
-    submitForm() {
-      let that = this;
-      this.$refs["form"].validate(async (valid) => {
-        if (valid) {
-          let postList = []
-          for (const codeKey in this.colSeatMap) {
-            postList.push(this.colSeatMap[codeKey])
-          }
-          try {
-            this.loading = true;
-            const { code } = await saveAndEdit({ id: this.auditoriumId, rows: this.seatMap.row, cols: this.seatMap.col });
-            if (code === 200) {
-              let postList = []
-              for (const codeKey in this.colSeatMap) {
-                postList.push(this.colSeatMap[codeKey])
-              }
-              const { code } = await seatSaveAndEdit(postList);
-              if (code === 200) {
-                that.$message.success("操作成功!");
-                that.$emit("getList");
-                that.cancel();
-              }
-            }
-          } catch (error) {
-          } finally {
-            this.loading = false;
-          }
-        }
-      });
-    },
-    /**
-     * 重置
-     * @date 2023-11-22
-     * @returns {any}
-     */
-    reset() {
-      this.$refs["form"].resetFields();
-      this.form.id = undefined;
-    },
-    /**
-     * 关闭弹框
-     * @date 2023-11-22
-     * @returns {any}
-     */
-    cancel() {
-      this.reset();
-      this.open = false;
-    },
-    /**
-     * 上传成功
-     * @date 2023-11-22
-     * @param {any} res
-     * @returns {any}
-     */
-    handleAvatarSuccess(res) {
-      if (res.code === 200) {
-        // this.form.mainImg = res?.data?.url;
-        this.$set(this.form, 'mainImg', res?.data?.url)
-      }
-    },
-    /**
-     * 上传文件之前之前
-     * @date 2023-11-22
-     * @param {any} file
-     * @returns {any}
-     */
-    beforeAvatarUpload(file) {
-      const isJPG = file.type === "image/jpeg" || "image/png";
-      if (!isJPG) {
-        this.$message.error("上传头像图片只能是jpg或png格式!");
-      }
-      return isJPG;
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-.dialog {
-  padding: 0 30px;
-  max-height: 75vh;
-  overflow-y: auto;
-}
-.draw-dialog-class{
-  border-radius: 10px;
-  height: 240px;
-  width: 220px;
-  background-color: #fff;
-  position: absolute;
-  z-index: 55;
-  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
-}
-.dialog {
-  padding: 0 30px;
-
-  .title-class{
-    text-align: center;
-    color: #6e6e6e;
-    margin: 10px auto;
-  }
-  .box-top-class{
-    .stage-class{
-      margin: 10px auto;
-      width: 160px;
-      height: 80px;
-      border: 2px solid #7d7d7e;
-      text-align: center;
-      line-height: 80px;
-    }
-  }
-  .box-class ::-webkit-scrollbar{ /*滚动条基本样式，高度*/
-    width:10px;height:10px;
-  }
-  .box-class{
-    width: 100%;
-    height: 500px;
-    border: 2px solid #7d7d7e;
-    border-radius: 4px;
-    padding: 10px;
-
-    .box-bottom-class{
-      //border: 2px solid #5656c2;
-      //margin-top: 15px;
-      //padding-left: 4px;
-
-      .seat-tag{
-        display: inline-block;
-        border: 1px solid #7d7d7e;
-        margin-right: 2px;
-        cursor: pointer;
-        background: url("../../../../assets/images/seat-icon.png") no-repeat;
-        background-size: 100% 100%;
-        position: relative;
-
-        &:hover{
-          opacity: 0.8;
-        }
-      }
-      .seat-p-class{
-        position: absolute;
-        left: 0;
-        top: 0;
-        text-align: center;
-        font-size: 18px;
-        display: inline-block;
-        color: white;
-      }
-    }
-  }
-
-  .upload-btn {
-    width: 100px;
-    height: 100px;
-    background-color: #fbfdff;
-    border: dashed 1px #c0ccda;
-    border-radius: 5px;
-    i {
-      font-size: 30px;
-      margin-top: 20px;
-    }
-    &-text {
-      margin-top: -10px;
-    }
-  }
-  .avatar {
-    cursor: pointer;
-  }
-}
-
-//这里注意：我当前将css样式加载全局上，如果单页添加样式需要每个样式前添加 ‘/deep/’ 修饰符
-
-/*  dialog*/
-.ygh-dialog ::v-deep .el-dialog__header {
-  padding: 16px 20px 15px;
-}
-.el-dialog__headerbtn{
-  top: 15px;
-}
-
-/*dialog header*/
-.el-dialog__header{
-  background: #e3eaed;
-}
-.avue-crud__dialog__header {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  align-items: center;
-  -webkit-box-pack: justify;
-  -ms-flex-pack: justify;
-  justify-content: space-between;
-}
-.el-dialog__title {
-  color: rgba(0,0,0,.85);
-  font-weight: 500;
-  word-wrap: break-word;
-}
-.avue-crud__dialog__menu {
-  padding-right: 20px;
-  float: left;
-}
-.avue-crud__dialog__menu i {
-  color: #909399;
-  font-size: 15px;
-}
-.el-icon-full-screen{
-  cursor: pointer;
-}
-.el-icon-full-screen:before {
-  content: "\e719";
-}
-
-</style>

src/views/venue/performanceHallMr/index.vue

@@ -131,7 +131,8 @@
 
 import { merchantPageList, deleteById } from '@/api/performanceHallMr/performanceHallMr'
 import addAndEdit from "./dialog/addAndEdit.vue";
-import seatTemplateEdit from "./dialog/seatTemplateEdit.vue";
+//import seatTemplateEdit from "./dialog/seatTemplateEdit.vue";
+import seatTemplateEdit from "./dialog/seatTemplateEditOld.vue";
 import programmeAddAndEdit from "./dialog/programmeAddAndEdit.vue";
 
 export default {

src/views/venue/performanceHallMr/model/seatManagementTable.vue

@@ -61,6 +61,7 @@
                                 :key="item1.id"
                                 dragSelectType="div"
                                 :dragSelectId="item1.id"
+                                :style="{backgroundColor: item1.delFlag !=0?'#ccc':item1.color}"
                                 >
                                     <i style="line-height: 15px;">{{ item1.colNo }}</i>
                                     <i style="line-height: 15px;">{{ item1.seatNo }}</i>
@@ -79,9 +80,10 @@
                     @tab-click="handleClick">
                         <el-tab-pane label="创建区域" name="first"></el-tab-pane>
                         <el-tab-pane label="座位管理" name="second"></el-tab-pane>
-                        <el-tab-pane label="批量处理" name="second"></el-tab-pane>
+                        <el-tab-pane label="批量处理" name="batch"></el-tab-pane>
                     </el-tabs>
                 </div>
+                <!--  创建区域  -->
                 <div 
                 v-if="activeName == 'first'"
                 class="qu-first-box">
@@ -95,7 +97,7 @@
                             <el-form-item label="区域名称" prop="name">
                                 <el-input v-model="ruleForm.name"></el-input>
                             </el-form-item>
-                            <el-form-item label="座位排练" prop="region">
+                            <el-form-item label="座位排列" prop="region">
                                 <el-select v-model="ruleForm.region" placeholder="请选择座位排练">
                                     <el-option label="靠左" value="flex-start"></el-option>
                                     <el-option label="居中" value="center"></el-option>
@@ -123,8 +125,8 @@
                                 >
                                     <span>{{ item.title }}</span>
                                     <div>
-                                        <span>编辑</span>
-                                        <span>删除</span>
+                                        <span @click="editTableHeader(item,index)">编辑</span>
+                                        <span @click="delTableHeader(item,index)">删除</span>
                                     </div>
                                 </div>
                             </transition-group>
@@ -132,7 +134,7 @@
                         </div>
                     </div>
                 </div>
-                
+                <!--  座位管理 -->
                 <div v-if="activeName == 'second'" class="qu-second-box">
                     <div class="qu-second-select">
                         <span>当前选择的是：</span> 
@@ -148,11 +150,15 @@
                                     <el-radio :label="2">批量</el-radio>
                                 </el-radio-group>
                             </el-form-item>
-                            <el-form-item label="座位类型" prop="region">
-                                <el-select v-model="ruleForm1.region" placeholder="请选择座位排练">
-                                    <el-option label="普通坐" value="qutong"></el-option>
-                                    <el-option label="VIP坐" value="VIP"></el-option>
-                                    <el-option label="老人坐" value="old"></el-option>
+                            <el-form-item label="座位类型" prop="seatTypeId">
+                                <el-select 
+                                v-model="ruleForm1.seatTypeId"
+                                placeholder="请选择座位排练">
+                                    <el-option 
+                                    v-for="(item,index) in seatTypeList"
+                                    :key="item.id"
+                                    :label="item.name" 
+                                    :value="item.id"></el-option>
                                 </el-select>
                             </el-form-item>
                             <el-form-item label="座位名称" prop="name">
@@ -181,6 +187,12 @@
                             <span>该区已创建的座位</span>
                             <span>(注：从左至右排序如下)</span>
                         </div> 
+                        <div class="qu-second-info-tool">
+                            <span>快速排序:</span>
+                            <span>升序</span>
+                            <span>降序</span>
+                            <span>奇偶对称</span>
+                        </div> 
                         <div class="qu-second-info-list">
                             <div 
                             class="qu-second-info-item"
@@ -190,8 +202,108 @@
                         </div>
                     </div>                 
                 </div>
+
+                <!-- 批量操作  -->
+                <div v-if="activeName == 'batch'" class="qu-batch-box">
+                    <div class="qu-batch-form">
+                        <el-form :model="queryParams" ref="queryForm" size="mini" label-width="50px">
+                            <el-form-item label="排号" prop="menuName" >
+                                <el-input
+                                v-model="queryParams.menuName"
+                                placeholder="排号"
+                                clearable
+                                @keyup.enter.native="handleQuery"
+                                />
+                            </el-form-item>
+                            <el-form-item label="区域" prop="status">
+                                <div style="display: flex;">
+                                    <el-select v-model="queryParams.status" placeholder="区域" clearable>
+                                    <el-option
+                                        v-for="item in tableHeader"
+                                        :key="item.key"
+                                        :label="item.title"
+                                        :value="item.key"
+                                    />
+                                    <el-option
+                                        label="未绑定"
+                                        :value="-1"
+                                    />
+                                    </el-select>
+                                    <el-button style="margin-left: 5px;" type="primary" size="mini" @click="handleQuery">搜索</el-button>
+                                    <el-button size="mini" @click="resetQuery">重置</el-button>
+                                </div>
+                                
+                            </el-form-item>
+                        </el-form>
+                    </div>
+                    <div class="qu-batch-tool">
+                        <el-button type="primary" size="mini" @click="handleQuery">绑定区域</el-button>
+                        <el-button type="danger" size="mini" @click="handleQuery">批量禁用</el-button>
+                        
+                    </div>
+                    <div class="qu-batch-table">
+                        <el-table
+                            size="mini"
+                            :data="batchTableList"
+                            @selection-change="handleSelectionChange"
+                            style="width: 100%"
+                            height="100%"
+                            >
+                            <el-table-column
+                            type="selection"
+                            align="center"
+                            width="40">
+                            </el-table-column>
+                            <el-table-column
+                            prop="seatNo"
+                            align="center"
+                            label="名称">
+                            </el-table-column>
+                            <el-table-column
+                            align="center"
+                            label="区域">
+                                <template slot-scope="scope">
+                                    <span>{{ scope.row.style && scope.row.style.key }}</span>
+                                </template>
+                            </el-table-column>
+                        </el-table>
+                    </div>
+                </div>
+
             </div>
         </div>
+
+        <!--  编辑区域   -->
+        <el-dialog
+            title="编辑区域"
+            :visible.sync="formDialogVisible"
+            width="30%"
+            append-to-body
+            >
+            <el-form 
+            :model="formAll" 
+            :rules="formRules" 
+            ref="formAll" 
+            label-width="100px" >
+                <div v-if="formAllType=='region'">
+                    <el-form-item label="区域名称" prop="title">
+                        <el-input v-model="formAll.title"></el-input>
+                    </el-form-item>
+                    <el-form-item label="座位排练" prop="align">
+                        <el-select v-model="formAll.align" placeholder="请选择座位排练">
+                            <el-option label="靠左" value="flex-start"></el-option>
+                            <el-option label="居中" value="center"></el-option>
+                            <el-option label="靠右" value="flex-end"></el-option>
+                        </el-select>
+                    </el-form-item>
+                </div>
+            </el-form>
+            <span slot="footer" class="dialog-footer">
+                <el-button @click="formDialogVisible = false">取 消</el-button>
+                <el-button type="primary" @click="chekeFormAll('formAll')">确 定</el-button>
+            </span>
+        </el-dialog>
+
     </div>
 </template>
  
@@ -216,6 +328,88 @@ export default {
                     sort: '0'
                 }
             ],
+            seatTypeList: [
+                {
+                    "id": "899466154989936640",
+                    "createBy": "admin",
+                    "createTime": "2023-12-26 11:24:13",
+                    "updateBy": "admin",
+                    "updateTime": "2023-12-26 11:24:13",
+                    "delFlag": 0,
+                    "name": "贵宾席-OTA测试",
+                    "color": "#EB3286"
+                },
+                {
+                    "id": "899466065307328512",
+                    "createBy": "admin",
+                    "createTime": "2023-12-26 11:23:51",
+                    "updateBy": "admin",
+                    "updateTime": "2023-12-26 11:23:51",
+                    "delFlag": 0,
+                    "name": "普通席-OTA测试",
+                    "color": "#AE3BE7"
+                },
+                {
+                    "id": "898175951457316864",
+                    "createBy": "admin",
+                    "createTime": "2023-12-22 21:57:24",
+                    "updateBy": "admin",
+                    "updateTime": "2023-12-22 21:57:24",
+                    "delFlag": 0,
+                    "name": "VIP票",
+                    "color": "#FF0000"
+                },
+                {
+                    "id": "898175913469505536",
+                    "createBy": "admin",
+                    "createTime": "2023-12-22 21:57:15",
+                    "updateBy": "admin",
+                    "updateTime": "2023-12-22 21:57:15",
+                    "delFlag": 0,
+                    "name": "贵宾票",
+                    "color": "#FFD000"
+                },
+                {
+                    "id": "898175825946963968",
+                    "createBy": "admin",
+                    "createTime": "2023-12-22 21:56:54",
+                    "updateBy": "admin",
+                    "updateTime": "2023-12-22 21:56:54",
+                    "delFlag": 0,
+                    "name": "普通票",
+                    "color": "#0BB8B8"
+                },
+                {
+                    "id": "898175718375649280",
+                    "createBy": "admin",
+                    "createTime": "2023-12-22 21:56:29",
+                    "updateBy": "admin",
+                    "updateTime": "2023-12-26 11:23:02",
+                    "delFlag": 0,
+                    "name": "普通座位-测试",
+                    "color": "#DE5421"
+                },
+                {
+                    "id": "898175647802290176",
+                    "createBy": "admin",
+                    "createTime": "2023-12-22 21:56:12",
+                    "updateBy": "admin",
+                    "updateTime": "2023-12-22 21:56:35",
+                    "delFlag": 0,
+                    "name": "贵宾座位-测试",
+                    "color": "#2FBB60"
+                },
+                {
+                    "id": "898175609768341504",
+                    "createBy": "admin",
+                    "createTime": "2023-12-22 21:56:03",
+                    "updateBy": "admin",
+                    "updateTime": "2023-12-24 20:17:00",
+                    "delFlag": 0,
+                    "name": "VIP座位-测试",
+                    "color": "#002FFF"
+                }
+            ],
             tableHeader: [
                 // { title: '左1',key: 'zuo',align: 'flex-end' },
                 // { title: '过道2',key: 'zuo11',align: 'center' },
@@ -228,7 +422,33 @@ export default {
                 // { title: '右8',key: 'you',align: 'flex-start' },
                 // { title: '右9',key: 'you',align: 'flex-start' },
             ],
-            tableData: [],
+            tableData: [
+                // {
+                //     id: this.currentRow+"_"+this.currentProperty+"_"+i,
+                //     seatNo: this.ruleForm1.name.replace('${row}',this.currentRow).replace('${col}',i),
+                //     status: this.ruleForm1.seatTypeId,
+                //     rowNo: this.currentRow,
+                //     colNo: i,
+                //     sort: i,
+                //     style: {key: this.currentProperty}
+                // }
+            ], // 全部的座位 表格形式
+            tableDataAll: [
+                // {
+                //     "id": "899524164202352651",
+                //     "delFlag": 0,
+                //     "auditoriumId": "899466305364123648",
+                //     "name": "",
+                //     "rowNo": 2,
+                //     "columnNo": 9,
+                //     "seatTypeId": "899466154989936640",
+                //     "seatLabel": "贵宾席-OTA测试",
+                //     "priority": 1,
+                //     "status": 1,
+                //     "sortId": 11,
+                //     "color": "#EB3286"
+                // }
+            ], // 全部的座位
             widthAll: '100%',
             heightAll: '100%',
             width: 26,
@@ -266,7 +486,7 @@ export default {
                 name: [
                     { required: true, message: '请选择座位名称', trigger: ['blur','change'] }
                 ],
-                region: [
+                seatTypeId: [
                     { required: true, message: '请输入座位类型', trigger: ['blur','change'] }
                 ],
             },
@@ -275,6 +495,18 @@ export default {
             currentLabel: null, // 当前选择的单元格列 名称
             currentProperty: null, // 当前选择的key
             currentTabelList: [], // 当前单元格的座位列表
+
+            /** 批量操作   */
+            batchTableList: [],
+            multipleSelection: [],  //  批量操作选中的
+            queryParams: {},
+
+            /** 编辑区域 开始  */
+            formDialogVisible: false, // 弹窗
+            formAll: {},
+            formRules: {},
+            formAllType: '', // region 区域
+            /** 编辑区域 结束  */
         };
     },
     mounted() {
@@ -490,9 +722,12 @@ export default {
             return src
         },
 
-        /**  右侧工具 */
-        handleClick(){
-
+        /** tab 切换 右侧工具 */
+        handleClick(item){
+            console.log("item====",item,this.activeName)
+            if(this.activeName == 'batch') { // 批量操作
+                this.batchTableList = this.tableDataAll
+            }
         },
         /**  创建区域  开始 */
         submitForm(formName) {
@@ -519,6 +754,69 @@ export default {
         resetForm(formName) {
             this.$refs[formName].resetFields();
         },
+        // 删除区域
+        delTableHeader(params,index){
+            let flog = false
+            this.tableDataAll.forEach((item,index)=>{
+                if(item.style && item.style.key == params.key) {
+                    flog = true
+                }
+            })
+            if(flog){
+                this.$message.error('区域存在座位，请将座位移到别的区域再删除!');
+            }else{
+                this.$confirm(`确定删除${params.title}区域`, '提示', {
+                    confirmButtonText: '确定',
+                    cancelButtonText: '取消',
+                    callback: action => {
+                        this.tableHeader.splice(index,1)
+                    }
+                });
+            }
+        },
+        // 编辑区域
+        editTableHeader(item,index){
+            this.formAllType = 'region'
+            this.formDialogVisible = true
+            this.$set(this,'formAll',JSON.parse(JSON.stringify({
+                index: index,
+                ...item
+            })))
+        },
+        // 验证表单
+        chekeFormAll(formName){
+            this.$refs[formName].validate((valid) => {
+                if (valid) {
+                    if(this.formAllType == 'region'){
+                        this.submitFormAll()
+                    }
+                } else {
+                    console.log('error submit!!');
+                    return false;
+                }
+            });
+        },
+        // 
+        submitFormAll(){
+            let index = this.formAll.index
+            this.$set(this.tableHeader[index],'title',this.formAll.title)
+            this.$set(this.tableHeader[index],'align',this.formAll.align)
+            // let list = []
+            // this.tableDataAll.forEach((item,index)=>{
+            //     if(item.style.key == this.formAll.key) {
+            //         list.push({
+            //             ...item,
+            //             style: {
+            //                 item.sty
+            //             }
+            //         })
+            //     }else {
+
+            //     }
+            // })
+            this.formDialogVisible = false
+        },
+        /**  创建区域  结束 */
 
         /**
         *  创建排数
@@ -555,6 +853,7 @@ export default {
             row.index=rowIndex;
             column.index=columnIndex;
         },
+        /**  点击某个单元格   */
         cellDblclick(row, column, cell, event){
             this.currentRow = row.index + 1
             this.currentRegion = column.index
@@ -567,38 +866,61 @@ export default {
             this.currentTabelList = list && list.length>0 ? JSON.parse(JSON.stringify(list)) : []
             console.log("row, column, cell, event===",row, column, cell, event)
         },
+        /**  点击创建座位   */
         submitForm1(formName) {
             this.$refs[formName].validate((valid) => {
             if (valid) {
+                let color = ''
+                let seatLabel = ''
+                this.seatTypeList.forEach((item,index)=>{
+                    if(this.ruleForm1.seatTypeId == item.id) {
+                        color = item.color
+                        seatLabel = item.seatLabel
+                    }
+                })
                 if(this.ruleForm1.resource == 2){ // 批量
                     let list = []
                     let min = Number(this.ruleForm1.colMin)
                     let max = Number(this.ruleForm1.colMax)
+                    
                     for(let i = min;i<=max;i++) {
                         list.push({
                             id: this.currentRow+"_"+this.currentProperty+"_"+i,
                             seatNo: this.ruleForm1.name.replace('${row}',this.currentRow).replace('${col}',i),
-                            status: this.ruleForm1.region,
+                            status: this.ruleForm1.seatTypeId,
                             rowNo: this.currentRow,
                             colNo: i,
                             sort: i,
-                            style: {key: this.currentProperty}
+                           
+                            style: {
+                                key: this.currentProperty,
+                                keyLabel: this.currentLabel
+                            },
+                            rowNo: this.currentRow,
+                            columnNo: i,
+                            seatTypeId: this.ruleForm1.seatTypeId,
+                            seatLabel: seatLabel,
+                            color: color,// 座位类型对应的颜色
+                            delFlag: 0,
                         })
                     }
+                    this.tableDataAll = this.tableDataAll.concat(JSON.parse(JSON.stringify(list)))
                     this.$set(this.tableData[this.currentRow-1],this.currentProperty,list)
                     this.currentTabelList = JSON.parse(JSON.stringify(this.tableData[this.currentRow-1][this.currentProperty]))
                 }else { // 单个
                     console.log("this.tableData=====",this.tableData)
                     console.log("this.tableData111=====",this.currentRow,this.currentProperty,this.tableData[this.currentRow-1][this.currentProperty])
                     let index = this.tableData[this.currentRow-1][this.currentProperty].length
-                    this.tableData[this.currentRow-1][this.currentProperty].push({
+                    let obj = {
                         id: this.currentRow+"_"+this.currentProperty+"_"+(index+1),
                         seatNo: this.ruleForm1.name,
-                        status: this.ruleForm1.region,
+                        status: this.ruleForm1.seatTypeId,
                         rowNo: this.currentRow,
                         colNo: index+1,
                         sort: index+1
-                    })
+                    }
+                    this.tableData[this.currentRow-1][this.currentProperty].push(obj)
+                    this.tableDataAll.push(JSON.parse(JSON.stringify(obj)))
                     this.currentTabelList = JSON.parse(JSON.stringify(this.tableData[this.currentRow-1][this.currentProperty]))
                 }
                 this.countRegionW()
@@ -609,6 +931,7 @@ export default {
             }
             });
         },
+        /**  清除创建座位的表单 */
         resetForm1(formName) {
             this.$refs[formName].resetFields();
         },
@@ -659,6 +982,38 @@ export default {
         dragLostItemChange(){},
         reSelect() {
 
+        },
+
+        /**  批量操作 */
+        handleSelectionChange(val){
+            this.multipleSelection = val;
+        },
+        /** 删选 */
+        handleQuery(){
+            let list = []
+            if(!this.queryParams.menuName&&this.queryParams.status){
+                this.batchTableList = this.tableDataAll
+            }else {
+                this.tableDataAll.forEach((item,index)=>{
+                    if(this.queryParams.menuName&&this.queryParams.status) {
+                        if(item.rowNo==this.queryParams.menuName && item.key == this.queryParams.status) {
+                            list.push(item)
+                        }
+                    }else if(this.queryParams.menuName){
+                        if(item.rowNo==this.queryParams.menuName) {
+                            list.push(item)
+                        }
+                    }else {
+                        if(item.key == this.queryParams.status) {
+                            list.push(item)
+                        }
+                    }
+                })
+            }   
+        },
+        resetQuery(){
+            this.queryParams = {}
+
         }
     }
 };
@@ -703,7 +1058,7 @@ export default {
 }
 
 .row-item-box:hover {
-    background-color: #409eff;
+    background-color: rgba(64, 158, 255,0.3);
 }
 
 .row-item {
@@ -719,6 +1074,9 @@ export default {
     box-sizing: border-box;
     justify-content: center;
     overflow: hidden;
+    i {
+        color: #fff;
+    }
 }
 
 .row-item:first-child {
@@ -875,17 +1233,47 @@ export default {
             align-items: flex-end;
             padding-bottom: 5px;
             span:first-child{
-                font-size: 16px;
+                font-size: 14px;
+                font-weight: 600;
             }
             span:last-child{
                 font-size: 12px;
                 margin-left: 10px;
             }
         }
-
+        .qu-second-info-tool {
+            width: 100%;
+            height: 25px;
+            display: flex;
+            align-items: center;
+            padding-bottom: 5px;
+            span:first-child{
+                font-size: 14px;
+                font-weight: 600;
+            }
+            
+            span:nth-child(2){
+                font-size: 12px;
+                margin-left: 10px;
+                background-color: #1890FF;
+                color: #fff;
+            }
+            span:nth-child(3){
+                font-size: 12px;
+                margin-left: 10px;
+                background-color: #1890FF;
+                color: #fff;
+            }
+            span:nth-child(4){
+                font-size: 12px;
+                margin-left: 10px;
+                background-color: #1890FF;
+                color: #fff;
+            }
+        }
         .qu-second-info-list {
             width: 100%;
-            height: calc( 100% - 30px );
+            height: calc( 100% - 60px );
             box-sizing: border-box;
             padding-right: 5px;
             overflow: hidden;
@@ -937,6 +1325,27 @@ export default {
     }
 }
 
+
+.qu-batch-box {
+    width: 100%;
+    height: 100%;
+    box-sizing: border-box;
+
+    .qu-batch-form {
+        height: 90px;
+        box-sizing: border-box;
+    }
+    .qu-batch-tool {
+        height: 40px;
+        box-sizing: border-box;
+    }
+    .qu-batch-table {
+        height: calc( 100% - 180px );
+        box-sizing: border-box;
+    }
+}
+
+
 ::v-deep .exchange_table {
   th {
     padding: 0 !important;

src/views/windowTicketSales/ticketingCollection.vue

@@ -104,6 +104,7 @@
           <dict-tag :options="dict.type.order_status_type" :value="scope.row.status"/>
         </template>
       </el-table-column>
+      <el-table-column label="打印次数" align="center" prop="printNum" />
         <el-table-column label="操作" align="center" fixed="right" width="80" class-name="small-padding fixed-width">
           <template slot-scope="scope">
             <el-button