<!-- 年度检验安全附件 -->
<template>
  <div class="app-container">
    <sticky style="margin-bottom: 10px;">
      <btn ref="btn" />
    </sticky>
    <el-form ref="ysjl" :model="ysjl" class="el-form" label-position="right">
      <fieldset>
        <legend>检验信息</legend>
        <el-row :gutter="20">
          <el-col :span="9">
            <el-form-item label="检验日期" prop="jianyanjieshuriqi">
              <el-date-picker v-model="ysjl.jianyanjieshuriqi" type="date" placeholder="选择日期" />
            </el-form-item>
          </el-col>
        </el-row>
      </fieldset>
      <fieldset>
        <legend>检验项目</legend>
        <el-table id="myTable" ref="tableData" :span-method="tableJs.mergeColRows" :data="tableData" border stripe style="width:100%;margin-top: 5px;">
          <el-table-column type="index" prop="C1" align="center" width="50" label="序号" />
          <el-table-column align="left" label="检验项目">
            <el-table-column align="center" prop="C2" label="检验项" />
            <el-table-column align="left" prop="C3" label="检验内容" />
          </el-table-column>
          <el-table-column align="center" prop="C4" label="检查结果">
            <template slot-scope="scope">
              <el-input v-model="scope.row.C4" :disabled="edit" />
            </template>
          </el-table-column>
        </el-table>
      </fieldset>
    </el-form>
  </div>
</template>
<script>
import Sticky from '@/components/Sticky'
import btn from '@/views/common/FxButton'
export default {
  name: 'GdNdAqfj',
  components: { Sticky, btn },
  data() {
    return {
      ysjl: {},
      param: {},
      state: '',
      edit: false,
      ysjlId: this.$route.query.id,
      info: {
        ysjlId: this.$route.query.id,
        ysjl: this.ysjl,
        param: this.param,
        jyxm: this.$route.query.jyxm,
        state: this.state
      },
      // 表格合并相关
      // 参与列合并的字段，在这里增加即可
      cols: [
        {
          name: 'C2', // 参与计算的列名，必须和el-table-column prop=''值一致
          getValue(row) { // 该列用于比较的值的获取方法
            return row.C2
          }
        }
      ],
      tableData: []
    }
  },
  created() {
    this.getInfo()
  },
  methods: {
    getInfo() {
      this.api({
        url: '/fx/getFxByYsjlId',
        method: 'get',
        params: {
          ysjlId: this.$route.query.id,
          jyxm: this.$route.query.jyxm
        }
      }).then(data => {
        this.ysjl = data.ysjl
        this.state = 'create'
        if (data.param !== null && data.param !== undefined) {
          // 有无损原始报告参数
          this.state = 'update'
          this.param = data.param
          this.tableData = JSON.parse(data.param.fubiao) === null ? JSON.parse('[]') : JSON.parse(data.param.fubiao)
          this.tableJs.getData(this.cols, null, this.tableData)
        } else {
          this.getJyxm()
        }
        if (this.ysjl.flowstatus === 4) {
          this.state = 'finish'
          this.edit = true
        }
        this.$refs.btn.getParentInfo(this.ysjl, this.param, null, this.tableData, this.state, 'ndAqfj')
      })
    },
    getJyxm() {
      // 查询检验项目
      this.api({
        url: '/jyxm/getCyJyxm',
        method: 'post',
        data: {
          templateId: this.ysjl.modelId,
          order: 1
        }
      }).then(data => {
        data.forEach((v, i) => {
          this.tableData.push({
            C1: i,
            C2: v.jianyanxiang,
            C3: v.jianyanneirong,
            C4: v.jianyanjieguo
          })
        })
        this.tableJs.getData(this.cols, null, this.tableData)
      })
    }
  }
}
</script>
