<template>
  <div>
    <el-card style="margin: 5px;margin-top: -20px">
      <el-form label-width="100px" :model="inputQuery" style="width: 100%; margin: auto;" ref="formRef" >
        <el-row>
<!--          <el-col :span="11">-->
<!--            <el-form-item class="query-form-item" label="项目编码:" prop="content">-->
<!--              <el-input v-model="inputQuery.projectCode" :disabled="editType == 2" placeholder="请输入项目编码" style="width: 100%"-->
<!--                        clearable></el-input>-->
<!--            </el-form-item>-->
<!--          </el-col>-->
            <el-col :span="11">
              <el-form-item class="query-form-item" label="状态:" prop="content">
                <el-select v-model="inputQuery.status" style="width: 100%" :disabled="editType == 2 || check!=null" placeholder="请选择状态" clearable>
                  <el-option label="未开始" :value=1></el-option>
                  <el-option label="已检查" :value=2></el-option>
                  <el-option label="异常" :value=3></el-option>
                  <el-option label="不巡检" :value=4></el-option>
                </el-select>
              </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="22">
          <el-form-item class="query-form-item" label="项目内容:" prop="content">
            <el-input type="textarea" :rows="4" :disabled="editType == 2" v-model="inputQuery.projectContent" placeholder="请输入项目内容" style="width: 100%"></el-input>
          </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="22">
            <el-form-item class="query-form-item"  label="备注:" prop="remark">
              <el-input type="textarea" :rows="4" :disabled="editType == 2" placeholder="请输入备注" v-model="inputQuery.result"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row v-if="editType != 2">
          <el-col :span="11">
            <el-form-item label="现场照片:">
              <el-upload
                  class="upload-demo"
                  ref="upload"

                  :action="this.uploadUrl"
                  :on-remove="uploadHandleRemove"
                  :headers="headers"
                  :on-exceed="uploadHandleExceed"
                  accept=".jpg,.png,.pdf,.doc"
                  :on-change="uploadOnchange"
                  :on-success="uploadHandleSuccess"
                  :file-list="fileList"
                  :data="{ type: 'image2' }"
                  :auto-upload="true"
              >
                <el-button
                    slot="trigger"
                    size="small"
                    type="primary"
                >
                  现场照片
                </el-button>
                <div>只能上传 jpg,png,pdf,doc 文件，且不超过 10 MB</div>
              </el-upload>
            </el-form-item>
          </el-col>

        </el-row>
      </el-form>
      <div style="text-align: center;margin-top: 12px">
        <el-button type="primary" size="small" icon="search" v-if="editType != 2"  @click="onModifySubmit">提交</el-button>
        <el-button type="primary" size="small" icon="search" v-if="editType != 2" @click="closeDialog('close')">取消</el-button>
      </div>
    </el-card>
  </div>

</template>

<script>


import store from "@/store";
import {uploadDeviceInspecTakeDetail,addDeviceInspecTakeDetail} from "@/api/dev/deviceInspectTake";
import {getDeptDeviceList} from "@/api/dev/deptDevice";
import {isBlank} from "@/utils/strUtil";

export default {
  props: {
    inputQuery: {
      type: Object,
      required: true
    },
    editType: {
      type: Object,
      required: true
    },
    type: {
      type: Object,
      required: true
    },
    closeDialog: {
      type: Function,
      required: true
    },
    check: {
      type: Function,
      required: true
    },
  },
  name: "DeviceInspectPlanProjectSet",
  data() {
    return {
      uploadUrl: "",
      BASE_URL: process.env.VUE_APP_BASE_API,
      headers: {},
      fileList: [],
    };
  },
  methods: {
    onModifySubmit() {
      if (isBlank(this.inputQuery.projectContent)) {
        return this.$message.error("项目内容不能为空");
      }
      if(isBlank(this.inputQuery.id)){
        addDeviceInspecTakeDetail(this.inputQuery).then((res) => {
          this.deviceLoading = false;
          if (res.code === 20000) {
            this.closeDialog();
          } else {
            this.$message.error(res.message);
          }
        }).catch((error) => {
          this.$message.error(error.message);
        });
      }else{
        uploadDeviceInspecTakeDetail(this.inputQuery).then((res) => {
          this.deviceLoading = false;
          if (res.code === 20000) {
            this.closeDialog();
          } else {
            this.$message.error(res.message);
          }
        }).catch((error) => {
          this.$message.error(error.message);
        });
      }
    },

    uploadHandlePreview(file) {},
    uploadHandleRemove(file, fileList) {
      this.inputQuery.inspectImage = null;
      console.log(file, fileList);
    },
    uploadHandleExceed(files, fileList) {
      this.$message.warning(
          `当前限制选择 1 个文件，本次选择了 ${files.length} 个文件，共选择了 ${
              files.length + fileList.length
          } 个文件`
      );
    },
    uploadOnchange(file, fileList) {
      let fileName = file.name;
      let uid = file.uid;
      let pos = fileName.lastIndexOf(".");
      let lastName = fileName.substring(pos, fileName.length);
      if (
          lastName.toLowerCase() !== ".jpg" &&
          lastName.toLowerCase() !== ".png" &&
          lastName.toLowerCase() !== ".doc" &&
          lastName.toLowerCase() !== ".pdf"
      ) {
        this.$message.error("上传文件只能是 jpg,png,doc,pdf 格式");
        for (let i = 0; i < fileList.length; i++) {
          //从list删除
          if (fileList[i].uid === uid) {
            fileList.splice(i, 1);
          }
        }
        return;
      }
      // 限制上传文件的大小
      const isLt = file.size / 1024 / 1024 / 30 <= 1;
      if (!isLt) {
        this.$message.error("上传文件大小不能超过 30MB");
        for (let i = 0; i < fileList.length; i++) {
          if (fileList[i].uid === uid) {
            fileList.splice(i, 1);
          }
        }
      }
      return isLt;
    },
    uploadHandleSuccess(response, file, fileList) {
      if (response.code === 20000) {
        if(this.inputQuery.inspectImage == null){
          this.inputQuery.inspectImage = response.data.name+",";
        }else{
          this.inputQuery.inspectImage += response.data.name+",";
        }
      } else {
        this.$message.error("文件上传失败：" + response.message);
      }
    },

  },
  created() {
    this.inputQuery.inspectImage = null
    this.uploadUrl = this.BASE_URL + "/udiwms/upload/register/file";
    this.headers = {
      ADMINID: store.getters.adminId,
      ADMINTOKEN: store.getters.token,
    };
  },
}
</script>

<style scoped>

</style>
