<template>
  <el-dialog  :close-on-click-modal="false" :title="$t('改造记录')" :visible.sync="visible" width="1200px" append-to-body>
    <el-table v-loading="loading" ref="reTable" :data="specHiYlgdList" :height="clientHeight" border>
      <el-table-column type="selection" width="55" align="center"  fixed="left" />
      <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="devname" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('管道编号')" align="center" fixed="left" prop="devno" :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="useno" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('管道级别')" align="center" prop="grade" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('设计单位')" align="center" prop="designer" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('安装单位')" align="center" prop="installer" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('安装年月')" align="center" prop="installDate" width="100">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.installDate, '{y}-{m}') }}</span>
        </template>
      </el-table-column>
      <el-table-column :label="$t('投用年月')" align="center" prop="submitdate" width="100">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.submitdate, '{y}-{m}') }}</span>
        </template>
      </el-table-column>
      <el-table-column :label="$t('材质')" align="center" prop="material" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('公称直径')" align="center" prop="dia" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('壁厚(mm)')" align="center" prop="scheduleNo" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('长度')+'（m）'" align="center" prop="length" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('焊口数量')" align="center" prop="weldNumber" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('起点')" align="center" prop="starting" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('终点')" align="center" prop="ending" :show-overflow-tooltip="true"/>
      <el-table-column :label="$t('敷设方式')" align="center" prop="layingMethod" :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="adiabatic" :show-overflow-tooltip="true"/>
      <!--      <el-table-column :label="$t('防腐层代码')" align="center" prop="antiCorrosion" :show-overflow-tooltip="true"/>-->
      <el-table-column :label="$t('是否涉危化品')" align="center" prop="isDanger" :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" sortable="custom">
        <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="$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>
  </el-dialog>
</template>

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

    export default {
        name: "specYlgd-hisReform",
      data() {
        return {
          specHiYlgdList: [],
          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.loading = true;
          this.$nextTick(() => {
            console.log(this.queryParams)
            getSpecYlgdByReform(row.id).then(response => {
              this.specHiYlgdList = response.data;
              this.$nextTick(() => {
                this.$refs.reTable.doLayout(); // 解决表格错位
              });
              this.loading = false;
            });
          })

        },
        // 状态字典翻译
        statusFormat(row, column) {
          return this.selectDictLabel(this.statusOptions, row.status);
        },
        // 申请状态字典翻译
        approveStatusFormat(row, column) {
          return this.selectDictLabel(this.approveStatusOptions, row.approveStatus);
        },
      }
    }
</script>

<style scoped>

</style>
