<template>
  <!-- <el-drawer
    :title="title"
    :before-close="cancelForm"
    :visible.sync="dialog"
    direction="rtl"
    ref="drawer"
  > -->
  <el-dialog
    :title="title"
    :visible.sync="dialog"
    width="600px"
    append-to-body
    @close="cancelForm"
  >
    <div class="demo-drawer__content" style="padding: 0 20px">
      <el-form :model="form" label-position="left" label-width="70px">
        <el-row :gutter="30">
          <!-- <el-col :span="24">
            <el-form-item label="ID">
              <el-input v-model="form.id" disabled></el-input>
            </el-form-item>
          </el-col> -->
          <el-col :span="24">
            <el-form-item label="作业内容">
              <el-input v-model="form.opContent" disabled></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <!-- <el-row :gutter="30">
          <el-col :span="12">
            <el-form-item label="线路/变电站">
              <el-input v-model="form.subsOrLineId" disabled></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="电压等级">
              <el-input v-model="form.voltLvlCd" disabled></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="30">
          <el-col :span="12">
            <el-form-item label="作业类型">
              <el-input v-model="form.opTypDsc" disabled></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="管理单位">
              <el-input v-model="form.mgmtOrgNm" disabled></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="30">
          <el-col :span="12">
            <el-form-item label="作业单位">
              <el-input v-model="form.submitOrgNm" disabled></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="工作负责人">
              <el-input v-model="form.workPrincipNm" disabled></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="30">
          <el-col :span="12">
            <el-form-item label="作业班组">
              <el-input v-model="form.workTeamNm" disabled></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="作业风险">
              <el-input v-model="form.opRiskLvlDsc" disabled></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="30">
          <el-col :span="12">
            <el-form-item label="作业人数">
              <el-input v-model="form.mainBusiOrgOpNum" disabled></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="作业开始时间">
              <el-input v-model="form.planStartWkTm" disabled></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="30">
          <el-col :span="12">
            <el-form-item label="作业结束时间">
              <el-input v-model="form.planEndTm" disabled></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="专业类型">
              <el-input v-model="form.majorTypDsc" disabled></el-input>
            </el-form-item>
          </el-col>
        </el-row> -->
        <el-row :gutter="30">
          <el-col :span="24" v-if="type == 1">
            <el-form-item label="取消原因">
              <el-input
                type="textarea"
                :rows="3"
                placeholder="请输入取消原因"
                v-model="form.cancelReason"
                :disabled="title == '明细'"
              />
            </el-form-item>
          </el-col>
          <el-col :span="24" v-if="type == 2">
            <el-form-item label="临时计划原因">
              <el-input
                type="textarea"
                :rows="3"
                placeholder="请输入临时计划原因"
                v-model="form.planReason"
                :disabled="title == '明细'"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <!-- <div class="demo-drawer__footer" style="text-align: right">
        <el-button @click="cancelForm"
          >{{ title == "明细" ? "关 闭" : "取 消" }}
        </el-button>
        <el-button
          v-if="title != '明细'"
          type="primary"
          @click="handleClose"
          :loading="loading"
          >{{ loading ? "提交中 ..." : "确 定" }}</el-button
        >
      </div> -->
    </div>
    <div slot="footer" class="dialog-footer">
      <el-button @click="cancelForm"
        >{{ title == "明细" ? "关 闭" : "取 消" }}
      </el-button>
      <el-button
        v-if="title != '明细'"
        type="primary"
        @click="handleClose"
        :loading="loading"
        >{{ loading ? "提交中 ..." : "确 定" }}</el-button
      >
    </div>
  </el-dialog>
  <!-- </el-drawer> -->
</template>

<script>
import { updateWorkPlan } from "@/api/secure/pdm-work-plan";
export default {
  data() {
    return {
      title: "",
      form: {
        opContent: "",
        opAddr: "",
        subsOrLineId: "",
        voltLvlCd: "",
        opTypDsc: "",
        mgmtOrgNm: "",
        submitOrgNm: "",
        workPrincipNm: "",
        workTeamNm: "",
        opRiskLvlDsc: "",
        mainBusiOrgOpNum: "",
        planStartWkTm: "",
        planEndTm: "",
        majorTypDsc: "",
        cancelReason: "",
        planReason: "",
      },
      loading: false,
      dialog: false,
      type: null, //1作业取消计划  2临时计划
    };
  },
  methods: {
    openModel(data, title, type) {
      this.form = { ...data };
      this.title = title;
      this.dialog = true;
      this.type = type;
    },
    handleClose(done) {
      if (this.loading) {
        return;
      }
      this.loading = true;
      updateWorkPlan(this.form).then((response) => {
        this.$modal.msgSuccess("修改成功");
        this.loading = false;
        this.dialog = false;
        this.$emit("refresh");
      });
    },
    cancelForm() {
      this.form = {
        opContent: "",
        opAddr: "",
        subsOrLineId: "",
        voltLvlCd: "",
        opTypDsc: "",
        mgmtOrgNm: "",
        submitOrgNm: "",
        workPrincipNm: "",
        workTeamNm: "",
        opRiskLvlDsc: "",
        mainBusiOrgOpNum: "",
        planStartWkTm: "",
        planEndTm: "",
        majorTypDsc: "",
        cancelReason: "",
        planReason: "",
        id: null,
      };
      this.loading = false;
      this.dialog = false;
    },
  },
};
</script>

<style lang="scss" scoped>
::v-deep {
  .el-drawer.ttb,
  .el-drawer.btt {
    height: 90% !important;
  }
}
</style>
