Mediation-Frontend/src/views/caseManagement/components/timeConfirm.vue

<template>
    <div>
        <el-dialog title="确认时间" :visible="timeConfirmVisable" v-if="timeConfirmVisable" @close="cancel" center
            :distroy-on-close="true">
            <!-- <div style="margin-bottom: 20px;">
                <el-radio-group v-model="confirmFlag">
                    <el-radio :label="1">同意</el-radio>
                    <el-radio :label="2">拒绝</el-radio>
                </el-radio-group>
            </div> -->
            <div>
                <div>
                    <!-- <div style="margin-top: 20px;margin-bottom: 20px;">时间</div> -->
                    <el-form label-position="right" label-width="80px" :model="formLabelAlign">
                        <el-form-item label="时间">
                            <el-date-picker v-model="formLabelAlign.name" type="datetime" :picker-options="pickerOptions" placeholder="选择日期时间">
                            </el-date-picker>
                            <!-- <el-input v-else v-model="formLabelAlign.name"></el-input> -->
                        </el-form-item>
                    </el-form>
                </div>
            </div>
            <div slot="footer" class="dialog-footer">
                <el-button @click="cancel" class="endbutton1" round><span>取 消</span></el-button>
                <el-button @click="submitMediator" class="endbutton1" type="primary" round><span>确 认</span></el-button>
            </div>
        </el-dialog>
    </div>
</template>
  
<script>
import { Message } from 'element-ui'
import { listMediator, selectReservation, confirmDate } from '@/api/caseManagement/caseManagement.js'
import { createRoomId } from '@/api/metting/metting.js'
import moment from "moment";
export default {
    props: ["timeConfirmVisable", "timeConfirmData", "queryParams"],
    data() {
        return {
            tableData: [],
            multipleSelection: [],
            formLabelAlign: {
                time: [],
                name: ""
            },
            pickerOptions: {
                disabledDate(time) {
                    return time.getTime() <= Date.now() -1 * 24 * 3600 * 1000; // 禁用超过当前时间的日期
                },
                selectableRange: `${new Date()}- 23:59:59`,//这
            },
        };
    },
    watch: {
        timeConfirmVisable(val) {
            if (val) {
                this.formLabelAlign.name = null;
            }
        },
    },
    methods: {
        cancel() {
            this.$emit("cancelTimeConfirm");
        },
        selectReservationFn(data) {
            selectReservation(data).then(res => {
                this.tableData = res.data.mediatorList;
                this.formLabelAlign.name = res.data.herDates[0]
            })
        },
        /**核实时间 */
        verifyMediatorFn(data) {
            confirmDate(data).then(res => {
                this.$modal.msgSuccess("成功");
                this.$emit("cancelTimeConfirm");
                this.$emit('getList', this.queryParams);
            })
        },
        // 生成会议房间号
        createRoomIdFn(data) {
            createRoomId(data).then(res => {
                console.log(res, "房间号");
            })
        },
        /**提交选择结果*/
        async submitMediator() {
            this.createRoomIdFn({
                caseId: this.timeConfirmData.id
            })
            if (!this.formLabelAlign.name) {
                Message.error('请选择时间');
                return
            }
            console.log(this.formLabelAlign.name)
            this.formLabelAlign.name = moment(
                this.formLabelAlign.name
            ).format("YYYY-MM-DD HH:mm:ss");
            this.verifyMediatorFn({
                id: this.timeConfirmData.id,
                caseFlowId: this.timeConfirmData.caseFlowId,
                herDates: [this.formLabelAlign.name]
            })
        },
    },
};
</script>
  
<style lang="scss" scoped>
.steps {
    display: flex;
    flex-wrap: wrap;
}

::v-deep .el-step {
    // width: 150px;
    flex-basis: 25% !important;
    margin-right: 20px;
    margin-bottom: 20px;
}
.timeTitle {
    width: 1000%;
    text-align: center;
}
</style>