great_webui/src/views/officesale/model/lockSeat.vue

<template>
    <el-dialog :title="title" :visible.sync="dialogVisible" width="40%" :before-close="handleClose">
        <div v-if="type == 1" v-loading="loading">
            <el-table :data="tableData" style="width: 100%">
                <el-table-column prop="date" label="座位号" width="180">
                </el-table-column>
                <el-table-column prop="name" label="锁定人" width="180">
                </el-table-column>
                <el-table-column prop="address" label="锁定原因">
                </el-table-column>
            </el-table>
        </div>
        <div v-if="type == 0" v-loading="loading">
            <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
                <el-form-item label="锁定原因" prop="remark">
                    <el-input type="textarea" :rows="4" placeholder="请输入锁定原因" maxlength="250" v-model="ruleForm.remark"></el-input>
                </el-form-item>
            </el-form>
        </div>
        <span slot="footer" class="dialog-footer">
            <el-button @click="handleClose">取 消</el-button>
            <el-button :loading="loading" type="primary" @click="lockOrUnLockFun">提交</el-button>
        </span>
    </el-dialog>
</template>
<script>
import { lockOrUnLockApi, lockOrUnLock } from "@/api/windowTicketSales/ticketingSales"
export default {
    name: "LockSeat",
    data() {
        return {
            loading: false,
            dialogVisible: false,
            tableData: [],
            type: null,
            list: [],
            title: '',
            auditoriumId: '',
            timeId: '',
            ruleForm: {
                remark: null
            },
            rules: {
                remark: [
                    { required: true, message: '请输入锁定原因', trigger: ['blur', 'change'] },
                ]
            }
        }
    },
    methods: {
        /**
         * 
         * @param list 解锁列表
         * @param list1 上锁列表
         */
        async open(list = [], list1 = [], auditoriumId = null, timeId = null) {
            this.auditoriumId = auditoriumId
            this.timeId = timeId
            this.list = list.length > 0 ? list : list1
            this.type = list.length > 0 ? 1 : 0 // 1 解锁 0 上锁
            this.title = list.length > 0 ? '解锁提示' : '锁定提示' // 1 解锁 0 上锁
            console.log(list, list1)
            if (list.length > 0) {
                await this.lockOrUnLockDeatilFun()
            }
            this.dialogVisible = true
            this.$nextTick(() => {
                if (list.length == 0) {
                    this.$refs.ruleForm.clearValidate()
                }
            })
        },
        handleClose() {
            this.ruleForm = {}
            this.dialogVisible = false
        },
        /**  */
        async lockOrUnLockDeatilFun() {
            try {
                let list = []
                this.list.forEach((item, index) => {
                    list.push({
                        "auditoriumId": this.auditoriumId,
                        "seatId": item.id,
                        "timeId": this.timeId
                    })
                })
                let res = await lockOrUnLockApi({
                    seatList: list
                })
                if (res.code == 200) {
                    console.log("ssssss====", res)
                } else {
                    this.handleClose()
                }
            } catch (error) {
                this.handleClose()
            }
        },
        /**  座位锁定/解锁  */
        async lockOrUnLockFun(type) {
            try {
                this.loading = true
                let list = []
                this.list.forEach((item, index) => {
                    list.push({
                        "auditoriumId": this.auditoriumId,
                        "seatId": item.id,
                        "timeId": this.timeId
                    })
                })
                let res = await lockOrUnLock({
                    type: this.type,
                    seatList: list,
                    remark: this.ruleForm.remark
                })
                this.loading = false
                if (res.code) {
                    this.$message({
                        showClose: true,
                        message: res.msg,
                        type: 'success'
                    });
                    this.$emit('querySeatListFun', true)
                    this.handleClose()
                }

            } catch (error) {
                this.loading = false
                this.$message({
                    showClose: true,
                    message: "操作失败!!!",
                    type: 'error'
                });
                console.error('error===', error)
            }

        },
    }
}
</script>