<template>
    <div class="random">
        <other-option @query="handleQuery" @changeDialogFormVisible="changeDialogFormVisible"/>
        <other-table ref="table" @editData="editData" @approveStatus="approveStatus"
                        @deleteData="deleteData"
                        @dispatchUser="dispatchUser" :restForm="restForm"
        />
        <el-dialog :visible.sync="dialogFormVisible" v-if="dialogFormVisible" :title="title">
            <add-or-edit-other @changeDialogFormVisible="changeDialogFormVisible" :jobType="'OTHER'"
                                  :editObject="editObject"
                                  @resetForm="resetForm">
            </add-or-edit-other>
        </el-dialog>
        <el-dialog :visible.sync="approveVisible" v-if="approveVisible" title="审核" :width="'340px'">
            <approve-status-v2 :id="this.approveId" @changeApproveVisible="changeApproveVisible"></approve-status-v2>
        </el-dialog>
        <el-dialog :visible.sync="dispatchVisible" v-if="dispatchVisible" title="分配执法人员" :width="'400px'">
            <dispatch-users :id="this.jobId"
                            @changeDispatchVisible="changeDispatchVisible" :jobType="'OTHER'"
                            @resetForm="resetForm"></dispatch-users>
        </el-dialog>
    </div>
</template>

<script>
    import OtherOption from './component/OtherOption.vue'
    import OtherTable from './component/OtherTable.vue'
    import AddOrEditOther from "./component/AddOrEditOther";
    import ApproveStatusV2 from '@/component/ApproveStatusV2'
    import DispatchUsers from '@/component/DispatchUsers'
    import {removeOneJob} from '@/api/job'


    export default {
        components: {
            OtherOption,
            OtherTable,
            AddOrEditOther,
            ApproveStatusV2,
            DispatchUsers
        },
        data() {
            return {
                dialogFormVisible: false,
                editObject: null,
                approveVisible: false,
                title: '新增',
                dispatchVisible: false,
                approveId: null,
                jobId: null,
                restForm:false
            }
        },
        methods: {
            changeDispatchVisible() {
                this.dispatchVisible = !this.dispatchVisible;
            },
            //分配人员
            dispatchUser(id) {
                this.jobId = id;
                this.changeDispatchVisible();
            },
            changeApproveVisible() {
                this.approveVisible = !this.approveVisible;
                this.approveId = null;
                this.resetForm();
            },
            resetForm() {
                if (this.$refs.table) {
                    this.$refs.table.resetForm()
                }
            },
            handleQuery(data) {
                if (this.$refs.table) {
                    this.$refs.table.resetForm(data)
                }
            },
            changeDialogFormVisible() {
                // this.$message.info("id:" + id)
                this.dialogFormVisible = !this.dialogFormVisible;
                this.editObject = null
                this.title = '新增'
            },
            approveStatus(id) {
                this.approveVisible = true;
                this.approveId = id;
            },
            editData(data) {
                this.editObject = data;
                this.title = '编辑';
                this.dialogFormVisible = !this.dialogFormVisible;
            },
            deleteData(id) {
                this.$confirm('删除, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    removeOneJob(id).then(res => {
                        this.$message({
                            type: 'success',
                            message: '删除成功!'
                        });
                        this.restForm = !this.restForm
                    })
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '取消删除'
                    });
                });
            }
        }
    }
</script>