<template>
  <!-- 弹出框表单 -->
  <el-drawer
    :title="title"
    :visible.sync="open"
    :direction="direction"
    :destroy-on-close="true"
    size="53%"
  >
    <div class="content_box">
      <div class="text_line">
        <div class="text_box">
          <span style="width: 160px;">窗口 (单位) 名称：</span>
          <span>{{ windowName || "--" }}</span>
        </div>
        <div class="text_box">
          <span>登记年月：</span>
          <span>{{
            `${form.year ? form.year : "--"}-${
              form.month
                ? [1, 2, 3, 4, 5, 6, 7, 8, 9].includes(form.month)
                  ? "0" + form.month
                  : form.month
                : "--"
            }`
          }}</span>
        </div>
      </div>
      <div class="text_line">
        <div class="text_box">
          <div style="width: 100%;">
            <el-table
              :data="form.windowWorkmanPerformDetailList"
              border
              style="width: 100%"
            >
              <el-table-column type="index" label="序号" width="50">
              </el-table-column>
              <el-table-column prop="staffName" label="姓名" align="center">
              </el-table-column>
              <el-table-column label="考核得分（分）">
                <el-table-column
                  prop="discipline"
                  label="工作纪律"
                  align="center"
                >
                  <template slot-scope="scope">
                    <el-input
                      v-if="form.view !== '查看'"
                      class="item"
                      v-model="scope.row.discipline"
                      @input="handleInput(scope.row)"
                      placeholder="请输入内容"
                    ></el-input>
                    <div v-else class="txt">{{ scope.row.discipline }}</div>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="specification"
                  label="服务规范"
                  align="center"
                >
                  <template slot-scope="scope">
                    <el-input
                      v-if="form.view !== '查看'"
                      class="item"
                      v-model="scope.row.specification"
                      placeholder="请输入内容"
                      @input="handleInput(scope.row)"
                    ></el-input>
                    <div v-else class="txt">{{ scope.row.specification }}</div>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="management"
                  label="综合管理"
                  align="center"
                >
                  <template slot-scope="scope">
                    <el-input
                      v-if="form.view !== '查看'"
                      class="item"
                      @input="handleInput(scope.row)"
                      v-model="scope.row.management"
                      placeholder="请输入内容"
                    ></el-input>
                    <div v-else class="txt">{{ scope.row.management }}</div>
                  </template>
                </el-table-column>
                <!-- <el-table-column
                  prop="evaluation"
                  label="群众评议"
                  align="center"
                >
                </el-table-column> -->
                <el-table-column
                  prop="efficiency"
                  label="工作效能"
                  align="center"
                >
                  <template slot-scope="scope">
                    <el-input
                      v-if="form.view !== '查看'"
                      class="item"
                      @input="handleInput(scope.row)"
                      v-model="scope.row.efficiency"
                      placeholder="请输入内容"
                    ></el-input>
                    <div v-else class="txt">{{ scope.row.efficiency }}</div>
                  </template>
                </el-table-column>
                <el-table-column prop="bonusScore" label="加分" align="center">
                  <template slot-scope="scope">
                    <el-input
                      v-if="form.view !== '查看'"
                      class="item"
                      @input="handleInput(scope.row)"
                      v-model="scope.row.bonusScore"
                      placeholder="请输入内容"
                    ></el-input>
                    <div v-else class="txt">{{ scope.row.bonusScore }}</div>
                  </template>
                </el-table-column>
              </el-table-column>
              <el-table-column
                prop="sumScore"
                label="综合评定打分"
                align="center"
              >
                <template slot-scope="scope">
                  <div class="txt">{{ scope.row.sumScore }}</div>
                </template>
              </el-table-column>
              <el-table-column
                prop="examineLevel"
                label="建议考核等次"
                align="center"
                width="200"
              >
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.examineLevel"
                    v-if="form.view !== '查看'"
                    placeholder="请选择"
                  >
                    <el-option
                      v-for="($label, $value) in dict.examineLevel"
                      :key="$value"
                      :label="$label"
                      :value="Number($value)"
                    >
                      <!-- {{ dict.examineLevel }} -->
                    </el-option>
                  </el-select>
                  <div v-else class="txt">
                    {{ dict.examineLevel[scope.row.examineLevel] }}
                  </div>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </div>
      </div>
      <div class="text_line">
        <div class="text_box">
          <span>备注：</span>
          <span>{{ form.remark || "--" }}</span>
        </div>
      </div>
      <div class="text_line">
        <div class="text_box">
          <span>附件材料：</span>
          <el-link
            v-if="form.annexUrl"
            :href="baseUrl + form.annexUrl"
            target="_blank"
            type="primary"
          >
            {{ form.annex || "--" }}</el-link
          >
          <span v-else> {{ form.annex || "--" }}</span>
        </div>
      </div>
      <div class="hecha_box">
        <div class="hecha_title">
          <span class="line"></span>
          <span
            style="font-size: 18px;font: bold;margin-bottom: 20px;color: #409eff;"
            >核查情况</span
          >
        </div>
        <div class="hecha_content">
          <el-form ref="form" :model="form" :rules="rules" label-width="180px">
            <el-row>
              <el-form-item label="政务服务管理科评荐意见：" prop="checkResult">
                <div
                  v-if="form.view == '查看'"
                  style="display: flex; justify-content: space-between;"
                >
                  <span class="left">
                    {{ dict.manageCheckResult[form.manageCheckResult] }}
                  </span>
                  <span class="right">
                    {{ form.manageCheckPerson }}
                    {{ functionTime(form.manageCheckTime) }} 核查
                  </span>
                </div>
                <el-radio-group v-model="form.manageCheckResult" v-else>
                  <el-radio
                    v-for="(val, i) in dict.manageCheckResult"
                    :key="i"
                    :label="i"
                    >{{ val }}</el-radio
                  >
                </el-radio-group>
              </el-form-item>
              <el-form-item label="管理组核查说明：" prop="manageCheckDesc">
                <el-input
                  v-model="form.manageCheckDesc"
                  type="textarea"
                  placeholder="请填写说明"
                  :disabled="form.view == '查看'"
                ></el-input>
              </el-form-item>
            </el-row>
            <form-buttons
              @submit="submitForm"
              v-if="pageInfo.type != 'view'"
              noCancelBtn
            />
          </el-form>
        </div>
      </div>
    </div>
    <!-- <el-form ref="form" :model="form" :rules="rules" label-width="120px">
      <el-row>
        <Field
          label="记录ID"
          prop="recordId"
          v-model="form.recordId"
          placeholder="请输入记录ID"
        />
        <Field
          label="考核年度"
          prop="year"
          v-model="form.year"
          placeholder="请输入考核年度"
        />
        <Field
          label="考核月份"
          prop="month"
          v-model="form.month"
          placeholder="请输入考核月份"
        />
        <Field
          label="窗口ID"
          prop="windowId"
          v-model="form.windowId"
          placeholder="请输入窗口ID"
        />
        <Field
          label="窗口名称"
          prop="windowName"
          v-model="form.windowName"
          placeholder="请输入窗口名称"
        />
        <Field
          label="窗口负责人id"
          prop="ownerId"
          v-model="form.ownerId"
          placeholder="请输入窗口负责人id"
        />
        <Field
          label="窗口负责人名称"
          prop="ownerName"
          v-model="form.ownerName"
          placeholder="请输入窗口负责人名称"
        />
        <Field
          label="所属部门id"
          prop="deptId"
          v-model="form.deptId"
          placeholder="请输入所属部门id"
        />
        <Field
          label="所属部门名称"
          prop="deptName"
          v-model="form.deptName"
          type="textarea"
          placeholder="请输入所属部门名称"
        />
        <Field
          label="所属大厅"
          prop="salaId"
          v-model="form.salaId"
          placeholder="请输入所属大厅"
        />
        <Field
          label="所属大厅名称"
          prop="salaName"
          v-model="form.salaName"
          placeholder="请输入所属大厅名称"
        />
        <Field
          label="考核表单名称"
          prop="fromName"
          v-model="form.fromName"
          placeholder="请输入考核表单名称"
        />
        <Field
          label="提交时间"
          prop="submitDate"
          v-model="form.submitDate"
          type="date"
        />
        <Field
          label="管理组核查人员"
          prop="manageCheckPerson"
          v-model="form.manageCheckPerson"
          placeholder="请输入管理组核查人员"
        />
        <Field
          label="管理组核查时间"
          prop="manageCheckTime"
          v-model="form.manageCheckTime"
          type="date"
        />
        <Field
          label="管理组核查说明"
          prop="manageCheckDesc"
          v-model="form.manageCheckDesc"
          type="textarea"
          placeholder="请输入管理组核查说明"
        />
        <Field
          label="管理组核查结果"
          prop="manageCheckResult"
          v-model="form.manageCheckResult"
          type="radio"
          :enumData="dict.manageCheckResult"
        />
        <Field
          label="备注"
          prop="remark"
          v-model="form.remark"
          type="textarea"
          placeholder="请输入备注"
        />
      </el-row>

      <form-buttons
        @submit="submitForm"
        v-if="pageInfo.type != 'view'"
        noCancelBtn
      />
    </el-form> -->
  </el-drawer>
</template>

<script>
import form from "@/assets/mixins/formdialog";
import { timestampToTime } from "@/assets/utils/dateFormat.js";

export default {
  name: "CheckWindowWorkmanPerformDetail",
  mixins: [form],
  components: {},
  created() {
    this.changePath("check/window/workman/perform");
  },
  data() {
    return {
      windowName: "",
      // 遮罩层
      loading: true,
      // 弹出层标题
      title: "市政务服务大厅窗口工作人员考核汇总表",
      // 是否显示弹出层
      open: false,
      direction: "rtl",
      toString: [],
      toDate: ["submitDate", "manageCheckTime"],
      // 表单校验
      rules: {},
      tableData: [],
      baseUrl: process.env.VUE_APP_API_BASE_URL + "/",
    };
  },

  methods: {
    handleInput(val) {
      val.sumScore =
        Number(val.bonusScore) +
        Number(val.discipline) +
        Number(val.efficiency) +
        Number(val.evaluation) +
        Number(val.management) +
        Number(val.specification);
    },
    functionTime(val) {
      let time = timestampToTime(val, 6);
      return time;
    },
    /** 编辑 */
    async edit(row) {
      this.windowName = row.windowName;
      //   this.reset();
      //   this.query = { id: row.id };
      this.urls.saveUrl = "check/window/workman/perform/examine";
      //   this.getData();
      //   this.pageInfo.type = "edit";
      //   this.title = "修改窗口人员考核汇总核查";
      this.form = row;
      this.reset();
      this.query = { id: row.id };
      await this.$get("/window/workman/perform/info", {
        id: row.recordId,
      })
        .then((res) => {
          console.log(res);
          if (res.code == 1) {
            this.form = res.data;
            this.form.id = row.id;
            this.dict = res.dict;
          } else {
            this.form = row;
          }
          this.form.view = "修改";
          this.open = true;
        })
        .catch((error) => {
          this.$message.error(error.message);
        });
      this.pageInfo.type = "edit";
      this.title = "市政务服务大厅窗口工作人员考核汇总表";
      // await this.$get("/check/window/workman/perform/info", {
      //   id: row.id,
      // }).then((res) => {
      //   if (res.code == 1) {
      //     this.form = res.data;
      //     this.dict = res.dict;
      //   } else {
      //     this.form = row;
      //   }
      //   for (let key in this.form) {
      //     key == "fillDate"
      //       ? (this.form[key] = timestampToTime(this.form[key], 6))
      //       : key == "createTime"
      //       ? (this.form[key] = timestampToTime(this.form[key], 6))
      //       : key == "deductTime"
      //       ? (this.form[key] = timestampToTime(this.form[key], 6))
      //       : key == "updateTime"
      //       ? (this.form[key] = timestampToTime(this.form[key], 6))
      //       : key == "checkTime"
      //       ? (this.form[key] = timestampToTime(this.form[key], 6))
      //       : key == "reviewTime"
      //       ? (this.form[key] = timestampToTime(this.form[key], 6))
      //       : "";
      //   }
      //   this.$get("/window/workman/perform/detail/info", { id: row.id }).then(
      //     (response) => {
      //       if (response.code == 1) {
      //         this.form = { ...this.form, ...response.data };

      //         this.dict = { ...this.dict, ...response.dict };
      //       }
      //     }
      //   );
      //   this.$get("/window/workman/perform/info", { id: row.id }).then(
      //     (responses) => {
      //       if (responses.code == 1) {
      //         this.form = { ...this.form, ...responses.data };

      //         this.dict = { ...this.dict, ...responses.dict };
      //       }
      //     }
      //   );
      //   this.tableData = [];
      //   this.tableData.push({
      //     staffName: this.form["staffName"] ? this.form["staffName"] : "--",
      //     discipline: this.form["discipline"] ? this.form["discipline"] : "--",
      //     specification: this.form["specification"]
      //       ? this.form["specification"]
      //       : "--",
      //     management: this.form["management"] ? this.form["management"] : "--",
      //     evaluation: this.form["evaluation"] ? this.form["evaluation"] : "--",
      //     efficiency: this.form["efficiency"] ? this.form["efficiency"] : "--",
      //     bonusScore: this.form["bonusScore"] ? this.form["bonusScore"] : "--",
      //     sumScore: this.form["sumScore"] ? this.form["sumScore"] : "--",
      //     examineLevel: this.form["examineLevel"]
      //       ? this.dict["examineLevel"]
      //       : "--",
      //   });
      //   this.form.view = "修改";
      //   this.open = true;
      // });
      // this.pageInfo.type = "edit";
      // this.title = "窗口人员自评绩效核查";
    },
    /** 新增 */
    add(row) {
      this.reset();
      this.urls.currUrl = "check/window/workman/perform/add";
      this.getData();
      this.pageInfo.type = "add";
      this.title = "新增窗口人员考核汇总核查";
    },
    /** 查看*/
    async view(row) {
      //   this.reset();
      //   this.query = { id: row.id };
      //   this.urls.currUrl = "check/window/workman/perform/view";
      //   this.getData();
      //   this.pageInfo.type = "view";
      //   this.title = "窗口人员考核汇总核查详细";
      this.windowName = row.windowName;
      this.form = row;
      this.reset();
      this.query = { id: row.id };
      await this.$get("/window/workman/perform/info", {
        id: row.recordId,
      })
        .then((res) => {
          if (res.code == 1) {
            this.form = res.data;
            this.form.id = row.id;
            this.dict = res.dict;
          } else {
            this.form = row;
          }
          this.form.view = "查看";
          this.open = true;
          this.$get("/check/window/workman/perform/info", { id: row.id }).then(
            (response) => {
              if (response.code == 1) {
                this.form = { ...this.form, ...response.data };
                this.dict = { ...this.dict, ...response.dict };
              }
            }
          );
        })
        .catch((error) => {
          this.$message.error(error.message);
        });
      this.pageInfo.type = "view";
      this.title = "市政务服务大厅窗口工作人员考核汇总表";
      // this.form = row;
      // this.reset();
      // this.query = { id: row.id };
      // await this.$get("/check/window/workman/perform/info", {
      //   id: row.id,
      // }).then((res) => {
      //   if (res.code == 1) {
      //     this.form = res.data;
      //     this.dict = res.dict;
      //   } else {
      //     this.form = row;
      //   }
      //   for (let key in this.form) {
      //     key == "fillDate"
      //       ? (this.form[key] = timestampToTime(this.form[key], 6))
      //       : key == "createTime"
      //       ? (this.form[key] = timestampToTime(this.form[key], 6))
      //       : key == "deductTime"
      //       ? (this.form[key] = timestampToTime(this.form[key], 6))
      //       : key == "updateTime"
      //       ? (this.form[key] = timestampToTime(this.form[key], 6))
      //       : key == "checkTime"
      //       ? (this.form[key] = timestampToTime(this.form[key], 6))
      //       : key == "reviewTime"
      //       ? (this.form[key] = timestampToTime(this.form[key], 6))
      //       : "";
      //   }
      //   this.$get("/window/workman/perform/detail/info", { id: row.id }).then(
      //     (response) => {
      //       if (response.code == 1) {
      //         this.form = { ...this.form, ...response.data };

      //         this.dict = { ...this.dict, ...response.dict };
      //       }
      //     }
      //   );
      //   this.$get("/window/workman/perform/info", { id: row.id }).then(
      //     (responses) => {
      //       if (responses.code == 1) {
      //         this.form = { ...this.form, ...responses.data };

      //         this.dict = { ...this.dict, ...responses.dict };
      //       }
      //     }
      //   );
      //   this.tableData = [];
      //   this.tableData.push({
      //     staffName: this.form["staffName"] ? this.form["staffName"] : "--",
      //     discipline: this.form["discipline"] ? this.form["discipline"] : "--",
      //     specification: this.form["specification"]
      //       ? this.form["specification"]
      //       : "--",
      //     management: this.form["management"] ? this.form["management"] : "--",
      //     evaluation: this.form["evaluation"] ? this.form["evaluation"] : "--",
      //     efficiency: this.form["efficiency"] ? this.form["efficiency"] : "--",
      //     bonusScore: this.form["bonusScore"] ? this.form["bonusScore"] : "--",
      //     sumScore: this.form["sumScore"] ? this.form["sumScore"] : "--",
      //     examineLevel: this.form["examineLevel"]
      //       ? this.dict["examineLevel"]
      //       : "--",
      //   });
      //   this.form.view = "查看";
      //   this.open = true;
      // });
      // this.pageInfo.type = "view";
      // this.title = "窗口人员自评绩效核查信息详细";
    },
    /**取消按钮 */
    cancel() {
      this.open = false;
    },
    /**获取数据后弹框 */
    afterRender(data) {
      this.open = true;
    },

    afterSubmit(data) {
      this.open = false;
      this.$emit("ok");
    },

    // 表单重置
    reset() {
      this.form = {
        recordId: null,
        year: null,
        month: null,
        windowId: null,
        windowName: "",
        ownerId: null,
        ownerName: "",
        deptId: null,
        deptName: "",
        salaId: null,
        salaName: "",
        fromName: "",
        submitDate: null,
        manageCheckPerson: "",
        manageCheckTime: null,
        manageCheckDesc: "",
        manageCheckResult: "",
        remark: "",
      };
      this.resetForm("form");
    },
    resetForm(refName) {
      if (this.$refs[refName]) {
        this.$refs[refName].resetFields();
      }
    },
  },
};
</script>
<style lang="less" scoped>
.content_box {
  padding: 0 20px;
  font-size: 14px;
  .text_line {
    width: 100%;
    display: flex;
    margin-bottom: 25px;
    .text_box:nth-child(2) {
      margin: 0 100px;
    }
    .text_box {
      display: flex;
      span {
        text-align: end;
        width: 100px;
        display: inline-block;
      }
      span:nth-child(2) {
        text-align: start;
      }
    }
  }
}
</style>
