<template>
    <el-container>
        <el-main class="nopadding">
            <el-form label-width="100px" :model="formData" style="padding: 20px;">
                <el-form-item label="项目名称" required>
                    <el-input v-model="formData.name" placeholder="请输入项目名称" :disabled="localMode!='add'"></el-input>
                </el-form-item>
                <el-form-item label="项目介绍" required>
                    <el-input v-model="formData.description" :disabled="localMode!='add'" type="textarea"></el-input>
                </el-form-item>
                <el-form-item label="开始日期" required>
                  <el-date-picker
                    v-model="dateRange"
                    type="daterange"
                    align="right"
                    value-format="YYYY-MM-DD"
                    unlink-panels
                    range-separator="至"
                    start-placeholder="开始日期"
                    end-placeholder="归还日期"
                    :disabled="localMode != 'add'"
                    @change="handleDateChange">
                  </el-date-picker>
                </el-form-item>
                <el-form-item label="项目负责人" required>
                    <xtSelect
                        v-model="formData.leader"
                        :label="formData.leader_name"
                        :apiObj="$API.system.user.list"
                        :edit="localMode==='add'"
                        >
                        <el-table-column prop="name" label="姓名"></el-table-column>
                        <el-table-column prop="belong_dept_name" label="所属部门"></el-table-column>
                        <el-table-column prop="post_name" label="岗位"></el-table-column>
                        <el-table-column prop="phone" label="手机号"></el-table-column>
                    </xtSelect>
                </el-form-item>
                <el-form-item label="项目成员" required>
                    <el-input v-model="formData.participants" placeholder="请输入项目名称" :disabled="localMode==='show'"></el-input>
                </el-form-item>
                <el-form-item label="附件" required>
                    <sc-upload-filed
                        v-model="formData.files"
                        :file_ = "formData.files_"
                        :multiple="true"
                        :limit="10"
                        :disabled="localMode ==='show'"
                        />
                </el-form-item>
                <el-form-item label="备注">
                    <el-input v-model="formData.note" :disabled="localMode==='show'" type="textarea"></el-input>
                </el-form-item>
            </el-form>
            <el-footer>
                <div style="display:flex; justify-content: space-between;">
                <div>
                    <el-button type="danger"
                    v-auth="'research_project.delete'"
                    :loading="saveLoading"
                    style="margin-right: 4px;"
                    @click="handleDel"
                    >删除</el-button>
                </div>
                <div>
                <el-button 
                    v-if="localMode!='show'"
                    type="primary"
                    style="margin-right: 4px;"
                    @click="handleSave"
                    :loading="saveLoading"
                    >保存</el-button>
                                <!-- <ticketd_b 
                v-if = "formData.ticket_ && localMode=='show'"
                :t_id="formData.id" 
                :ticket_="formData.ticket_"
                :ticket_data="ticket_data"
                @success="$emit('success', localMode)" 
                ref="ticketd_b"
            ></ticketd_b> -->
            </div>
                </div>
            </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 {
    components: {
        ticketd_b,
        ticketd
    },
    props: {
        mode: {
            type: String,
            default: 'show'
        },
        t_id: {
            type: String,
            default: ""
        }
    },
    data() {
        return {
            formData: {
                survery_form_: null
            },
            localMode: this.mode,
            saveLoading: false,
            dateRange: []
        }
    },
    watch: {
        mode(newVal) {
            this.localMode = newVal;
        }
    },
    mounted() {
        if (this.t_id) {
            this.getTid();
        } else {
            this.localMode = "add";
        }
    },
    methods: {
        handleDateChange(value) {
          if (value && value.length == 2) {
            this.formData.start_date = value[0];
            this.formData.end_date = value[1];
          } else {
            this.formData.start_date = null;
            this.formData.end_date = null;
          }
        },
        async getTid() {
            let res = await this.$API.rem.project.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";
            }
        },
        handleDel() {
            this.$confirm(`确定删除吗？`, "提示", {
                type: "warning",
            })
                .then(()=>{
                    this.$API.rem.project.delete.req(this.formData.id).then(res=>{
                        this.$message.success("删除成功");
                        this.$emit('success');
                    })
                })
        },
        handleSave() {
            if (this.localMode == "add") {
                this.saveLoading = true;
                this.$API.rem.project.create.req(this.formData).then(res=>{
                    this.saveLoading = true;
                    this.$message.success("提交成功");
                    this.$emit('success', this.localMode);
                }).catch(e=>{
                    this.saveLoading = false;
                })
            } else if (this.localMode == "edit") {
                this.$API.rem.project.update.req(this.formData.id, this.formData).then(res=>{
                    this.saveLoading = true;
                    this.$message.success("提交成功");
                    this.$emit('success', this.localMode);
                }).catch(e=>{
                    this.saveLoading = false;
                })
            }
        },
    }
}
</script>