<template>
  <el-dialog :title="$t('改造记录')" :visible.sync="visible" width="1200px" append-to-body>
    <el-table v-loading="loading" ref="reTable" :data="specHiYlrqList" :height="clientHeight" border>
      <el-table-column :label="$t('装置')" align="center"  fixed="left" prop="plantCode" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('单元')" align="center"  fixed="left" prop="unit" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('装置维修组')" align="center"  fixed="left" prop="plantMaint" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('装置维修工程师')" align="center"  fixed="left" prop="engineer" :show-overflow-tooltip="true"/>
<!--      <el-table-column :label="$t('状态')" align="center"  fixed="left" prop="status" :formatter="statusFormat" />-->
<!--      <el-table-column :label="$t('申请状态')" align="center"  fixed="left" prop="approveStatus" :formatter="approveStatusFormat" />-->
      <el-table-column :label="$t('位号')" align="center"  fixed="left" prop="devno" :show-overflow-tooltip="true"/>

      <el-table-column :label="$t('设备名称')" align="center" prop="devname" width="200" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('设备出厂编号')" align="center" prop="factoryNo" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('使用证号码')" align="center" prop="useno" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('注册编号')" align="center" prop="regno" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('容器类别')" align="center" prop="vesselType" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('制造单位')" align="center" prop="createUnit" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('国家')" align="center" prop="nation" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('外形尺寸(直径*长(高)*厚(mm))')" align="center" prop="outSize" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('材料')" align="center" prop="material" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('介质')" align="center" prop="medium" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('设计压力')+'MPa'" align="center" prop="desPressure" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('操作压力')+'MPa'" align="center" prop="optPressure" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('设计温度')+'℃'" align="center" prop="desTemp" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('操作温度')+'℃'" align="center" prop="optTemp" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('投用日期')" align="center" prop="submitdate" width="100">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.submitdate, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column :label="$t('是否涉危化品')" align="center" prop="isDanger" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('设计使用年限')" align="center" prop="desYear" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('是否达到设计使用年限')" align="center" prop="isOverlife" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('检验单位')" align="center" prop="checkUnit" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('定期检验日期')" align="center" prop="warnDate" width="100">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.warnDate, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column :label="$t('安全状况等级')" align="center" prop="safeClass" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('下次定期检验日期')" align="center" prop="nextWarnDate" width="100">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.nextWarnDate, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column :label="$t('定期检验报告编号')" align="center" prop="reportNo" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('年度检查日期')" align="center" prop="yearWarnDate" width="100">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.yearWarnDate, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>

      <el-table-column :label="$t('年度检查结论')" align="center" prop="checkConclusion" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('下次年度检查日期')" align="center" prop="yearNextWarnDate" width="100">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.yearNextWarnDate, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column :label="$t('年度检查报告编号')" align="center" prop="yearReportNo" :show-overflow-tooltip="true"/>
      <!--      <el-table-column label="部门编号" align="center" prop="deptId" :show-overflow-tooltip="true"/>-->
      <el-table-column :label="$t('备注')" align="center" prop="remarks" :show-overflow-tooltip="true"/>

      <<el-table-column :label="$t('创建时间')" align="center" prop="createdate" width="100">
      <template slot-scope="scope">
        <span>{{ parseTime(scope.row.createdate, '{y}-{m}-{d}') }}</span>
      </template>
    </el-table-column>
    </el-table>

    <!--<pagination
      v-show="total>0"
      :total="total"
             :page.sync="queryParams.pageNum"
      :page-sizes="[20,100,300,500]"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />-->
  </el-dialog>
</template>

<script>
  import {getSpecYlrqByReform} from "@/api/sems/specYlrq";
  import { getToken } from "@/utils/auth";
  import "@riophae/vue-treeselect/dist/vue-treeselect.css";

  export default {
    name: "Check",
    data() {
      return {
        specHiYlrqList: [],
        devType: null,
        // 遮罩层
        loading: true,
        visible: false,
        // 选中数组
        ids: [],
        // 非单个禁用
        single: true,
        // 非多个禁用
        multiple: true,
        // 显示搜索条件
        showSearch: false,
        // 总条数
        total: 0,
        // 特种设备检验记录表格数据
        checkList: [],
        // 弹出层标题
        title: "",
        // 部门树选项
        deptOptions: undefined,
        clientHeight:300,
        // 是否显示弹出层
        open: false,
        // 用户导入参数
        upload: {
          // 是否显示弹出层（用户导入）
          open: false,
          // 弹出层标题（用户导入）
          title: "",
          // 是否禁用上传
          isUploading: false,
          // 是否更新已经存在的用户数据
          updateSupport: 0,
          // 设置上传的请求头部
          headers: { Authorization: "Bearer " + getToken() },
          // 上传的地址
          url: process.env.VUE_APP_BASE_API + "/sems/check/importData"
        },
        // 查询参数
        queryParams: {
          pageNum: 1,
          pageSize: 20,
          createrCode: null,
          createdate: null,
          updaterCode: null,
          updatedate: null,
          checkUnit: null,
          warnDate: null,
          nextWarnDate: null,
          reportNo: null,
          yearWarnDate: null,
          checkConclusion: null,
          yearNextWarnDate: null,
          yearReportNo: null,
          outWarnDate: null,
          outNextWarnDate: null,
          outCheckConclusion: null,
          outReportNo: null,
          devId: null,
          devType: null,
          safeClass: null
        },

        // 表单参数
        form: {},
        // 表单校验
        rules: {
        }
      };
    },
    watch: {
      // // 根据名称筛选部门树
      // deptName(val) {
      //   this.$refs.tree.filter(val);
      // }
    },
    created() {
      //设置表格高度对应屏幕高度
      this.$nextTick(() => {
        this.clientHeight = document.body.clientHeight -250
      })

    },
    methods: {
      init (row) {
        this.visible = true
        this.queryParams.devId = row.id
        // this.queryParams.devType = type
        // this.devType = type
        // console.log(this.devType)
        this.loading = true;
        this.$nextTick(() => {
          console.log(this.queryParams)
          getSpecYlrqByReform(row.id).then(response => {
            this.specHiYlrqList = response.data;
            this.$nextTick(() => {
              this.$refs.reTable.doLayout(); // 解决表格错位
            });
            this.loading = false;
          });
        })

      },
      /** 查询特种设备检验记录列表 */
      /*getList() {
        this.loading = true;
        getHistoryYlrq(row.id).then(response => {
          this.specHiYlrqList = response.rows;
          this.total = response.total;
          this.loading = false;
        });
      },*/
      // 状态字典翻译
      statusFormat(row, column) {
        return this.selectDictLabel(this.statusOptions, row.status);
      },
      // 申请状态字典翻译
      approveStatusFormat(row, column) {
        return this.selectDictLabel(this.approveStatusOptions, row.approveStatus);
      },
      // /** 查询部门下拉树结构 */
      // getTreeselect() {
      //   treeselect().then(response => {
      //     this.deptOptions = response.data;
      //   });
      // },
      // // 取消按钮
      // cancel() {
      //   this.open = false;
      //   this.reset();
      // },
      // // 表单重置
      // reset() {
      //   this.form = {
      //     id: null,
      //     delFlag: null,
      //     createrCode: null,
      //     createdate: null,
      //     updaterCode: null,
      //     updatedate: null,
      //     checkUnit: null,
      //     warnDate: null,
      //     nextWarnDate: null,
      //     reportNo: null,
      //     yearWarnDate: null,
      //     checkConclusion: null,
      //     yearNextWarnDate: null,
      //     yearReportNo: null,
      //     outWarnDate: null,
      //     outNextWarnDate: null,
      //     outCheckConclusion: null,
      //     outReportNo: null,
      //     devId: null,
      //     devType: null,
      //     safeClass: null
      //   };
      //   this.resetForm("form");
      // },
      // /** 搜索按钮操作 */
      // handleQuery() {
      //   this.queryParams.pageNum = 1;
      //   this.getList();
      // },
      // /** 重置按钮操作 */
      // resetQuery() {
      //   this.resetForm("queryForm");
      //   this.handleQuery();
      // },
      // // 多选框选中数据
      // handleSelectionChange(selection) {
      //   this.ids = selection.map(item => item.id)
      //   this.single = selection.length!==1
      //   this.multiple = !selection.length
      // },
      // /** 新增按钮操作 */
      // handleAdd() {
      //   this.reset();
      //   this.open = true;
      //   this.title = "添加特种设备检验记录";
      // },
      // /** 修改按钮操作 */
      // handleUpdate(row) {
      //   this.reset();
      //   const id = row.id || this.ids
      //   getCheck(id).then(response => {
      //     this.form = response.data;
      //     this.open = true;
      //     this.title = "修改特种设备检验记录";
      //   });
      // },
      // /** 提交按钮 */
      // submitForm() {
      //   this.$refs["form"].validate(valid => {
      //     if (valid) {
      //       if (this.form.id != null) {
      //         updateCheck(this.form).then(response => {
      //           this.msgSuccess("修改成功");
      //           this.open = false;
      //           this.getList();
      //         });
      //       } else {
      //         addCheck(this.form).then(response => {
      //           this.msgSuccess("新增成功");
      //           this.open = false;
      //           this.getList();
      //         });
      //       }
      //     }
      //   });
      // },
      // /** 删除按钮操作 */
      // handleDelete(row) {
      //   const ids = row.id || this.ids;
      //   this.$confirm('是否确认删除?', "警告", {
      //     confirmButtonText: "确定",
      //     cancelButtonText: "取消",
      //     type: "warning"
      //   }).then(function() {
      //     return delCheck(ids);
      //   }).then(() => {
      //     this.getList();
      //     this.msgSuccess("删除成功");
      //   })
      // },
      // /** 导出按钮操作 */
      // handleExport() {
      //   const queryParams = this.queryParams;
      //   this.$confirm('是否确认导出所有特种设备检验记录数据项?', "警告", {
      //     confirmButtonText: "确定",
      //     cancelButtonText: "取消",
      //     type: "warning"
      //   }).then(function() {
      //     return exportCheck(queryParams);
      //   }).then(response => {
      //     this.download(response.msg);
      //   })
      // },
      // /** 导入按钮操作 */
      // handleImport() {
      //   this.upload.title = "用户导入";
      //   this.upload.open = true;
      // },
      // /** 下载模板操作 */
      // importTemplate() {
      //   importTemplate().then(response => {
      //     this.download(response.msg);
      //   });
      // },
      // // 文件上传中处理
      // handleFileUploadProgress(event, file, fileList) {
      //   this.upload.isUploading = true;
      // },
      // // 文件上传成功处理
      // handleFileSuccess(response, file, fileList) {
      //   this.upload.open = false;
      //   this.upload.isUploading = false;
      //   this.$refs.upload.clearFiles();
      //   this.$alert(response.msg, "导入结果", { dangerouslyUseHTMLString: true });
      //   this.getList();
      // },
      // // 提交上传文件
      // submitFileForm() {
      //   this.$refs.upload.submit();
      // }
    }
  };
</script>
