<template>
  <el-dialog v-model="dialogFormVisible" :title="title" width="500px">
    <el-form ref="form" :model="form" label-width="100px" label-position="left">
      <el-form-item label="选择站点">
        <el-select
          v-model="form.deviceCode"
          filterable
          placeholder="选择站点"
          @change="deviceChange"
        >
          <el-option
            v-for="item in deviceData"
            :key="item.code"
            :label="item.name"
            :value="item.code"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="紧急程度" prop="taskLevel">
        <el-select
          v-model="form.taskLevel"
          size="small"
          filterable
          placeholder="选择紧急程度"
        >
          <el-option
            v-for="item in levelData"
            :key="item.dataCode"
            :label="item.dataValue"
            :value="item.dataCode"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item :label="$t('task.rwnr')">
        <el-input v-model="form.taskContent" type="textarea"></el-input>
      </el-form-item>
      <el-form-item :label="$t('task.clr')">
        <el-select v-model="form.handler" filterable placeholder="选择处理人">
          <el-option
            v-for="item in handlersData"
            :key="item.id"
            :label="item.name"
            :value="item.id"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item :label="$t('task.wcsj')">
        <el-date-picker
          v-model="form.completeTime"
          type="datetime"
          :placeholder="$t('defalult.xzrq')"
          @change="standardToTime"
        ></el-date-picker>
      </el-form-item>
    </el-form>
    <div class="dialog-footer">
      <el-button type="primary" @click="save">确 定</el-button>
      <el-button @click="close">取 消</el-button>
    </div>
  </el-dialog>
</template>

<script>
import { doAdd, doEdit, getHandlers, getTaskLevel } from '@/api/task';
import { getDevices } from '@/api/inspection';
import { formatDateTime } from '@/common/times';

export default {
  data() {
    return {
      form: {
        id: '',
        deviceCode: '',
        taskContent: '',
        handler: '',
        completeTime: '',
        taskLevel: '',
        type: 1,
      },
      title: '',
      dialogFormVisible: false,
      deviceData: [],
      handlersData: [],
      queryForm: {
        projectId: '',
      },
    };
  },
  created() {
    this.queryForm.projectId = sessionStorage.getItem('projectId');
  },
  methods: {
    async getDictData() {
      const { data } = await getDevices(this.queryForm);
      this.deviceData = data;
    },
    deviceChange() {
      this.getHandlersData();
    },
    async getHandlersData() {
      const { data } = await getHandlers(this.form);
      this.handlersData = data;
    },
    async getTaskLevelData() {
      const { data } = await getTaskLevel(this.form);
      this.levelData = data;
    },
    //标准时间转yyyy-mm-dd
    standardToTime() {
      this.form.completeTime = formatDateTime(this.form.completeTime);
    },
    setDefaultTime() {
      this.form.completeTime = formatDateTime();
    },
    showEdit(row) {
      this.getDictData();
      this.getTaskLevelData();
      if (!row) {
        this.title = '添加';
        this.form.id = '';
        this.form.deviceCode = '';
        this.form.taskContent = '';
        this.form.handler = '';
        this.form.completeTime = '';
      } else {
        this.title = '编辑';
        this.menuId = row.id;
        var data = Object.assign({}, row);
        this.form.id = data.id;
        this.form.deviceCode = data.device.code;
        this.form.taskContent = data.taskContent;
        this.form.handler = data.handler.id;
        this.form.completeTime = data.completeTime;
        if (data.taskLevel != undefined) {
          this.form.taskLevel = data.taskLevel.dataCode;
        }
        this.getHandlersData();
      }
      this.dialogFormVisible = true;
    },
    close() {
      this.$refs['form'].resetFields();
      this.form = this.$options.data().form;
      this.dialogFormVisible = false;
      this.$emit('fetch-data');
    },
    save() {
      this.$refs['form'].validate(async valid => {
        if (valid) {
          if (this.form.taskContent == '') {
            delete this.form.taskContent;
          }
          if (this.form.handler == '') {
            delete this.form.handler;
          }
          if (this.form.completeTime == '') {
            delete this.form.completeTime;
          }
          if (this.form.id) {
            const { msg } = await doEdit(this.form);
            this.$notify({
              title: msg,
              type: 'success',
            });
          } else {
            delete this.form.id;
            const { msg } = await doAdd(this.form);
            this.$notify({
              title: msg,
              type: 'success',
            });
          }
          this.$refs['form'].resetFields();
          this.dialogFormVisible = false;
          this.$parent.fetchData();
        } else {
          return false;
        }
      });
    },
  },
};
</script>
