<template>
    <el-dialog :title="row.status == 1 ?'下发':'补发'" :close-on-click-modal="false" append-to-body
        :visible.sync="visible" class="JNPF-dialog JNPF-dialog_center" lock-scroll width="1000px">
        <el-row :gutter="15" class="">
            <el-form ref="formRef" :model="dataForm" :rules="dataRule" size="small"
                label-width="140px" label-position="right">
                <template v-if="!loading">
                    <!-- 具体表单 -->
                    <template v-if="row.status == 1">
                        <el-col :span="24">
                            <jnpf-form-tip-item label="是否匿名" align="left" prop="anonymity">
                                <el-switch v-model="dataForm.anonymity"></el-switch>
                            </jnpf-form-tip-item>
                        </el-col>
                        <el-col :span="24">
                            <jnpf-form-tip-item label="是否延迟下发" align="left" prop="delay">
                                <el-switch v-model="delay"></el-switch>
                            </jnpf-form-tip-item>
                        </el-col>
                        <el-col :span="24" v-if="delay">
                            <jnpf-form-tip-item label="开始时间" align="left" prop="startTime">
                                <el-date-picker v-model="dataForm.startTime" type="datetime"
                                    placeholder="选择开始时间" default-time="12:00:00"
                                    value-format="timestamp">
                                </el-date-picker>
                            </jnpf-form-tip-item>
                        </el-col>
                        <el-col :span="24">
                            <jnpf-form-tip-item label="结束时间" align="left" prop="endTime">
                                <el-date-picker v-model="dataForm.endTime" type="datetime"
                                    placeholder="选择结束时间" default-time="12:00:00"
                                    value-format="timestamp">
                                </el-date-picker>
                            </jnpf-form-tip-item>
                        </el-col>
                    </template>
                    <template v-else>
                        <el-col :span="24">
                            <jnpf-form-tip-item label="开始时间" align="left">
                                {{getDate(row.startTime)}}
                            </jnpf-form-tip-item>
                        </el-col>
                        <el-col :span="24">
                            <jnpf-form-tip-item label="结束事件" align="left">
                                {{getDate(row.endTime)}}
                            </jnpf-form-tip-item>
                        </el-col>
                    </template>

                    <el-col :span="24">
                        <jnpf-form-tip-item label="人员" align="left" prop="userIds">
                            <JnpfUserSelect v-model="dataForm.userIds" class="item"
                                placeholder="请选择人员" clearable :ableIds="ableIds" :multiple="true"
                                :filterIds="hasIssuedUsersList" />
                        </jnpf-form-tip-item>
                    </el-col>

                    <!-- 表单结束 -->
                </template>
            </el-form>

        </el-row>
        <span slot="footer" class="dialog-footer">
            <el-button @click="visible = false"> 取 消</el-button>
            <el-button type="primary" @click="dataFormSubmit()" :loading="btnLoading"> 确
                定</el-button>
        </span>
    </el-dialog>
</template>


<script>
import request from '@/utils/request'
import { mapGetters } from "vuex";
import dayjs from 'dayjs'

import {
    IssuedQuestionnaire, getQuestionnaireUser
} from "@/api/governmentCloud/questionnaireInvestigation/questionnaireInvestigation";


export default {
    components: {},
    props: [],
    data() {
        return {
            continueBtnLoading: false,
            index: 0,
            visible: false,
            loading: false,
            btnLoading: false,
            dataValueAll: {},
            delay: false,
            ableIds: [],
            dataForm: {
                anonymity: true,
                startTime: '',
                endTime: '',
                userIds: [],
                questionnaireId: null
            },

            dataRule:
            {
                anonymity: [
                    {
                        required: true,
                        message: '请选择是否匿名',
                        trigger: 'blur'
                    },
                ],
                startTime: [
                    {
                        required: true,
                        message: '请选择开始时间',
                        trigger: 'change'
                    },
                ],
                endTime: [
                    {
                        required: true,
                        message: '请选择结束时间',
                        trigger: 'change'
                    },
                ],
                userIds: [
                    {
                        required: true,
                        message: '请选择人员',
                        trigger: 'change'
                    },
                ]
            },
            labelOptions: [],
            treeSelectProps: {
                value: 'id',             // ID字段名
                label: 'name',       // 显示名称
                children: 'children',    // 子级字段名
            },
            hasIssuedUsersList: [],
            row: null
        }
    },
    computed: {
        ...mapGetters(['userInfo']),


    },
    watch: {},
    created() {
        this.dataAll()
        this.dataValueAll = JSON.parse(JSON.stringify(this.dataForm))
    },
    mounted() { },
    methods: {
        getDate(time) {
            let str = time ? dayjs(time).format('YYYY-MM-DD HH:mm:ss') : '无数据'
            return str
        },
        dataAll() {
        },
        clearData() {
            this.dataForm = JSON.parse(JSON.stringify(this.dataValueAll))
        },
        init(row) {
            this.loading = true
            this.clearData()

            this.row = row

            if (row.id) {
                this.dataForm.questionnaireId = row.id
            }


            getQuestionnaireUser(row.id).then(res => {
                this.hasIssuedUsersList = res.data
                this.loading = false
                this.visible = true;
            })

        },

        // 表单提交
        dataFormSubmit() {
            this.$refs['formRef'].validate((valid) => {
                if (valid) {
                    this.request()
                }
            })
        },
        request() {
            let _data = null
            if (this.row.status == 1) {
                _data = this.dataList()

                if (!this.delay) {
                    delete _data.startTime
                }
                this.btnLoading = true
            } else {
                console.log(this.row)
                _data = {
                    anonymity: this.row.anonymity,
                    endTime: this.row.endTime,
                    userIds: this.dataList().userIds,
                    questionnaireId: this.row.id
                }
            }

            IssuedQuestionnaire(_data).then((res) => {
                if (res.code == 200) {
                    this.$message({
                        message: '下发成功',
                        type: 'success',
                        duration: 1000,
                        onClose: () => {
                            this.visible = false
                            this.btnLoading = false
                            this.clearData()
                            this.$emit('close')

                        }
                    })
                } else {
                    this.$message({
                        message: res.msg,
                        type: 'warning',
                        duration: 1000,
                    })
                    this.btnLoading = false

                }

            }).catch(() => {
                this.btnLoading = false
                this.continueBtnLoading = false
            })

        },
        dataList() {
            var _data = JSON.parse(JSON.stringify(this.dataForm));
            return _data;
        },
        dataInfo(dataAll) {
            this.dataForm.content = dataAll.content
            this.dataForm.label = JSON.parse(dataAll.label)
            this.dataForm.knowledgeBaseId = dataAll.knowledgeBaseId
            this.dataForm.title = dataAll.title
            this.isEdit = true
            this.dataAll()
        },
    },
}

</script>
