<template>
    <div class="">
        <el-dialog
            :title="num_oinspect[type]"
            :visible.sync="dialogVisible"
            @closed="$emit('closed')"
        >
            <el-form
              ref="dialogForm"
              :model="form"
              label-width="100px"
              label-position="right"
              :rules="rules"
            >
                <el-form-item label="检查类型" >
                    <el-select
                        v-model="form.cate"
                        placeholder="检查类型"
                    >
                    <el-option
                        v-for="item in options"
                        :key="item.value"
                        :label="item.key"
                        :value="item.value"
                    >
                    </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="检查机构" >
                    <el-input v-model="form.checker"></el-input>
                </el-form-item>
                <el-form-item label="检查日期" >
                    <el-date-picker
                        v-model="form.date_inspect"
                        type="date"
                        placeholder="选择日期"
                        value-format="yyyy-MM-dd"
                        style="width:50%"
                    >
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="检查结果" >
                    <el-input v-model="form.result"></el-input>
                </el-form-item>
                <el-form-item label="结果日期" >
                    <el-date-picker
                        v-model="form.result_date"
                        type="date"
                        placeholder="选择日期"
                        value-format="yyyy-MM-dd"
                        style="width:50%"
                    >
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="检查通知单" prop="file">
                    <el-upload
                    ref="upload"
                    :action="upUrl"
                    :on-success="handleUpSuccess"
                    :on-remove="handleRemove"
                    :on-preview="handlePreview"
                    :headers="upHeaders"
                    :file-list="fileList"
                    :limit="1"
                    accept=".doc,.docx,.xls,.xlsx,.ppt,.pptx,.pdf,.zip">
                    <el-button size="small" type="primary">上传文件</el-button>
                    </el-upload>
                    <!-- <div style="text-align: right">
                        <el-button type="danger" @click="impDialogVisible = false">取消</el-button>
                        <el-button type="primary" @click="onSubmit()">确认</el-button>
                    </div> -->
                </el-form-item>
                <el-form-item label="结果告知单" prop="file">
                    <el-upload
                    ref="upload"
                    :action="upUrl"
                    :on-success="handleUpSuccess_res"
                    :on-remove="handleRemove_res"
                    :on-preview="handlePreview"
                    :headers="upHeaders"
                    :file-list="fileList_res"
                    :limit="1"
                    accept=".doc,.docx,.xls,.xlsx,.ppt,.pptx,.pdf,.zip">
                    <el-button size="small" type="primary">上传文件</el-button>
                    </el-upload>
                    <div style="text-align: right">
                        <el-button type="danger"  @click = "close_dialog()">取消</el-button>
                        <el-button type="primary" @click="onSubmit_result()">确认</el-button>
                </div>
                </el-form-item>
            </el-form>
            
        </el-dialog>
    </div>
  </template>
  
  <script>
  import { createOinspect,updateOinspect} from "@/api/task";
  import { upUrl, upHeaders } from "@/api/file";
  import {updateRecord} from "@/api/record";
  export default {
    emits: ["onSubmit", "onCancel", "onSubmit_result"],
    data() {
      return {
        type:'add',
        form:{
            checker: "",
            result: "",
            date_inspect: "",
            result_date: "",
            notification_form: "",
            result_form:"",
            cate: 10,
            task2do: 0,
        },
        impDialogVisible: false,
        upUrl: upUrl(),
        upHeaders: upHeaders(),
        fileList: [],
        fileList_res: [],
        num_oinspect: {
            add: "新增外部监督检查",
            edit: "外部监督检查编辑",
        },
        isSaveing:false,
        dialogVisible:false,
        rules: {
            number: [{ required: true, message: "请填入" }],
            vchannel: [{ required: true, message: "请选择视频" }],
        },
        options:[
            {key:'市场监管部门检查',value:10},
            {key:'行业主管部门检查',value:20},
            {key:'其他检查',value:30}
        ],
      }
    },
    methods: {
        //显示
        open(type = "add",task2do) {
            this.type = type;
            if(task2do){
                this.form.task2do = task2do;
            }
            this.dialogVisible = true;
            return this;
        },
        
        close_dialog(){
            this.impDialogVisible = false;
            this.$emit('close_dialog');
        },
        //表单注入数据
        setData(data) {
            console.log(data);
            console.log("111111111111111")
            Object.assign(this.form, data);
            if(data.notification_form){
                this.fileList = [{ name: data.notification_form.split('/')[5], value: data.notification_form }];
            }else if(data.result_form){
                console.log(data.result_form.split('/'))
                this.fileList_res = [{ name: data.result_form.split('/')[5], value: data.result_form }];
            }
        },
        beforeUpload(file) {
            const isLt2M = file.size / 1024 / 1024 < 5;
            if (!isLt2M) {
                this.$message.error("单文件不能超过5MB!");
            }
            return isLt2M;
        },
        handleUpSuccess(res, file) {
            this.fileList = [file];
            this.form.notification_form = res.data.path
            console.log(this.form)
        },
        handleUpSuccess_res(res, file) {
            this.fileList_res = [file];
            this.form.result_form = res.data.path
            console.log(this.form)
        },
        handleRemove(file) {
            // 实现删除文件
            this.fileList = [];
            this.form.notification_form = null
            console.log(this.form)
        },
        handleRemove_res(file) {
            // 实现删除文件结果告知单
            this.fileList_res = [];
            this.form.result_form = null
            console.log(this.form)
        },
        handlePreview(file) {
          if ("response" in file) {
            window.open(file.response.data.path);
          } else {
            window.open(file.value); 
          }
        },
        //提交
        onSubmit() {
            this.$refs.dialogForm.validate(async (valid) => {
                if (valid) {
                this.isSaveing = true;
                try {
                    var res;
                    if (this.type == "add") {
                        createOinspect(this.form).then(res=>{
                            this.isSaveing = false;
                            if(res.code>=200){
                                this.dialogVisible = false;
                                this.$emit("success",this.type);
                            }else{
                                this.$message.warning(res.data.msg);
                            }
                        })
                    } else if (this.type == "edit") {
                        updateOinspect(this.form.id,this.form).then(res=>{
                            this.isSaveing = false;
                            if(res.code>=200){
                                this.dialogVisible = false;
                                this.$emit("success",this.type);
                            }else{
                                this.$message.warning(res.data.msg);
                            }
                        })
                    }
                    return res;
                } catch (err) {
                    //可以处理校验错误
                    this.isSaveing = false;
                    return err;
                }
                }
            });
        },
        //提交检验结果告知单
        onSubmit_result() {
            this.$refs.dialogForm.validate(async (valid) => {
                if (valid) {
                this.isSaveing = true;
                try {
                    var res;
                    if (this.type == "add") {
                        createOinspect(this.form).then(res=>{
                            this.isSaveing = false;
                            if(res.code>=200){
                                this.dialogVisible = false;
                                this.$emit("success",this.type);
                            }else{
                                this.$message.warning(res.data.msg);
                            }
                        })
                    } else if (this.type == "edit") {
                        updateOinspect(this.form.id,this.form).then(res=>{
                            this.isSaveing = false;
                            if(res.code>=200){
                                this.dialogVisible = false;
                                this.$emit("success",this.type);
                            }else{
                                this.$message.warning(res.data.msg);
                            }
                        })
                    }
                    return res;
                } catch (err) {
                    //可以处理校验错误
                    this.isSaveing = false;
                    return err;
                }
                }
            });
        },
        onCancel() {
            this.$emit("closed");
        },
    }
  }
  </script>
  
  <style scoped>
  .line{
    text-align: center;
  }
  </style>
  
  