<template>
    <el-container>
        <el-main class="nopadding">
            <el-form label-width="110px" :model="formData" style="padding: 20px;">
                <el-form-item label="创建时间" v-if="localMode !== 'add'">
                    {{ formData.create_time }}
                </el-form-item>
                <el-form-item label="设备选择" required>
                   <xtSelect
                        v-model="formData.equipment"
                        style="width: 100%;"
                        :apiObj = "$API.em.equipment.list"
                        v-model:label="formData.equipment_fullname"
                        :labelField="'full_name'"
                        :edit="localMode === 'add'"
                   >
                    <el-table-column prop="number" label="设备编号"></el-table-column>
                    <el-table-column prop="name" label="设备名称"></el-table-column>
                    <el-table-column prop="belong_dept_name" label="所属部门"></el-table-column>
                   </xtSelect>
                </el-form-item>
                <el-form-item label="报修事由" required>
                    <el-input
                        type="textarea"
                        :rows="3"
                        v-model="formData.fault_description"
                        placeholder="请输入报修事由"
                        :readonly="localMode === 'show'"
                    ></el-input>
                </el-form-item>
                <el-form-item label="故障分类" required v-if="localMode != 'add'">
                    <el-select
                        v-model="ticket_data.fault_cate"
                        placeholder="请选择故障分类"
                        v-if="formData.ticket && formData.ticket_.state_.name == '条保负责人分派'" 
                    >
                        <el-option label="机械" value="机械"></el-option>
                        <el-option label="电气" value="电气"></el-option>
                    </el-select>
                    <span v-else>{{ formData.fault_cate }}</span>
                </el-form-item>
                <el-form-item label="维修人" required v-if="localMode != 'add'">
                    <xtSelect :apiObj="$API.system.user.list" 
                    v-if="formData.ticket && formData.ticket_.state_.name == '条保负责人分派'" v-model="ticket_data.repair_user">
                            <el-table-column prop="name" label="姓名"></el-table-column>
                            <el-table-column prop="belong_dept_name" label="部门"></el-table-column>
                    </xtSelect>
                    <span v-else>{{ formData.repair_user_name }}</span>
                </el-form-item>
                <el-form-item label="维修开始时间" required v-if="localMode != 'add'">
                    <el-date-picker
                        v-if="formData.ticket && formData.ticket_.state_.name == '维修人员处理'" 
                        v-model="ticket_data.repair_start_time"
                        type="datetime"
                        placeholder="请选择维修开始时间"
                        value-format="YYYY-MM-DD HH:mm:ss"
                    ></el-date-picker>
                    <span v-else>{{ formData.repair_start_time }}</span>
                </el-form-item>
                <el-form-item label="维修工时" required v-if="localMode != 'add'">
                    <el-input-number v-model="ticket_data.repair_duration" :min="0" :precision="1" 
                    v-if="formData.ticket && formData.ticket_.state_.name == '维修人员处理'" ></el-input-number>
                    <span v-else>{{ formData.repair_duration }}</span>
                </el-form-item>
                <el-form-item label="维修描述" required v-if="localMode != 'add'">
                    <el-input
                        type="textarea"
                        :rows="3"
                        v-model="ticket_data.repair_description"
                        placeholder="请输入维修描述"
                        v-if="formData.ticket && formData.ticket_.state_.name == '维修人员处理'"
                    ></el-input>
                    <span v-else>{{ formData.repair_description }}</span>
                </el-form-item>
            </el-form>
                    <el-footer>
            <el-button type="danger"
            v-if="localMode=='edit'"
            style="margin-right: 4px;"
            @click="handleDel"
            :loading="saveLoading"
            >删除</el-button>
            <ticketd_b 
                    v-if = "formData.ticket_"
                    :t_id="formData.id" 
                    :ticket_="formData.ticket_"
                    :ticket_data="ticket_data"
                    @success="$emit('success', localMode)" 
                    ref="ticketd_b"
                ></ticketd_b>
                    <el-button 
                    v-else
                    type="primary"
                    style="margin-right: 4px;"
                    @click="handleSave"
                    :loading="saveLoading"
                    >提交审批</el-button>
        </el-footer>
        </el-main>
        <el-aside width="20%" v-if="formData.ticket_">
            <ticketd :ticket_="formData.ticket_" @success="$emit('success')"></ticketd>
        </el-aside>
    </el-container>
</template>

<script>
import ticketd_b from "@/views/wf/ticketd_b.vue";
import ticketd from '@/views/wf/ticketd.vue'

export default {
    name: 'repair_form',
    components: {
        ticketd_b,
        ticketd
    },
    props: {
        mode: {
            type: String,
            default: 'show'
        },
        t_id: {
            type: String,
            default: ""
        }
    },
    data() {
        return {
            formData: {
            },
            ticket_data: {},
            localMode: this.mode,
            saveLoading: false
        }
    },
    mounted() {
        if (this.t_id) {
            this.getTid();
        } else {
            this.localMode = "add";
        }
    },
    methods: {
        async getTid() {
            try {
                let res = await this.$API.em.repair.item.req(this.t_id);
                this.formData = res;
                if (res.ticket_ && res.ticket_.state_.type == 1 && res.create_by == this.$TOOL.data.get("USER_INFO").id) {
                    this.localMode = "edit";
                }
            } catch (error) {
                console.error('获取数据失败:', error);
            }
        },
        handleDel() {
            this.$confirm(`确定删除吗？`, "提示", {
				type: "warning",
			})
				.then(()=>{
                    this.$API.em.repair.delete.req(this.formData.id).then(res=>{
                        this.$message.success("删除成功");
                        this.$emit('success');
                    })
                })
        },
        async handleSave() {
            if (this.localMode == "add") {
                try {
                    let res = await this.$API.em.repair.create.req(this.formData);
                    this.$message.success("提交成功");
                    this.$emit('success', this.localMode);
                } catch (error) {
                    console.error('提交失败:', error);
                    throw error;
                }
            } else if (this.localMode == "edit") {
                this.$message.error("不支持编辑");
            }
        }
    }
}
</script>