<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" label-width="160px">
      <fieldset>
        <legend>基本信息</legend>
        <el-row :gutter="20">
          <el-col :span="18">
            <el-form-item label="装置名称或管道编号">
              <el-input v-model="param.zhuangzhibianhao" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20" style="height: 100px">
          <el-col :span="18">
            <el-form-item label="记事栏" label-width="140px">
              <el-input v-model="param.jishilan" type="textarea" :autosize="{ minRows: 4, maxRows: 4}" />
            </el-form-item>
          </el-col>
        </el-row>
      </fieldset>
      <fieldset>
        <legend>穿跨越检验要求</legend>
        <el-row :gutter="20">
          <el-col :span="18">
            <el-form-item label="穿跨越工程施工质量">
              <el-input v-model="param.shigongzhiliang" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="18">
            <el-form-item label="穿跨越施工记录或报告">
              <el-input v-model="param.jiluorbaogao" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="9">
            <el-form-item label="检验结论">
              <el-input v-model="ysjl.jianyanjielun" />
            </el-form-item>
          </el-col>
        </el-row>
      </fieldset>
    </el-form>
    <el-table ref="tableData" :data="tableData" border stripe style="margin-top: 10px" @row-click="onRowClick">
      <el-table-column type="selection" />
      <el-table-column align="center" type="index" :index="indexMethod" label="序号" width="60" />
      <el-table-column :formatter="fmtJyx" align="center" prop="C1" label="项目" />
      <el-table-column align="center" prop="C2" label="施工记录及报告">
        <template slot-scope="{ row }">
          <el-input v-model="row.C2" />
        </template>
      </el-table-column>
      <el-table-column align="center" prop="C3" label="内容是否齐全、正确">
        <template slot-scope="{ row }">
          <el-input v-model="row.C3" />
        </template>
      </el-table-column>
      <el-table-column align="center" prop="C4" label="检验结论">
        <template slot-scope="{ row }">
          <el-input v-model="row.C4" />
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import Sticky from '@/components/Sticky'
import btn from '@/views/common/FxButton'

export default {
  name: 'GdJjSsaz',
  components: { Sticky, btn },
  data() {
    return {
      ysjl: {},
      param: {},
      tableData: [],
      state: '',
      edit: false
    }
  },
  created() {
    this.getInfo()
  },
  methods: {
    getInfo() {
      this.api({
        url: '/fx',
        method: 'get',
        params: {
          ysjlId: this.$route.query.id,
          jyxm: this.$route.query.jyxm
        }
      }).then(data => {
        this.ysjl = data.ysjl
        if (data.param) {
          // 有无损原始记录参数
          this.state = 'update'
          this.param = data.param
          this.tableData = JSON.parse(data.param.fubiao) === null ? JSON.parse('[]') : JSON.parse(data.param.fubiao)
        } else {
          this.state = 'create'
          // 默认值
        }
        if (this.ysjl.flowstatus === 4) {
          this.state = 'finish'
          this.edit = true
        }
        if (this.state === 'create') {
          this.getJyxm(1)
        } else {
          this.$refs.btn.getParentInfo(this.ysjl, this.param, null, this.tableData, this.state, this.$route.query.jyxm, false, true)
        }
      })
    },
    // 查询检验项目
    getJyxm(sort) {
      this.api({
        url: '/jyxm/getCyJyxm',
        method: 'get',
        params: {
          templateId: this.ysjl.modelId,
          order: sort
        }
      }).then(data => {
        this.tableData = data
        this.$refs.btn.getParentInfo(this.ysjl, this.param, null, this.tableData, this.state, this.$route.query.jyxm, false, true)
      })
    },
    indexMethod(index) {
      this.tableData[index].index = index
      return (index + 1)
    },
    fmtJyx(row) {
      if (this.state === 'create') {
        row.C1 = row.jianyanxiang
      }
      return row.C1
    },
    uploadTableData(file) {
      this.common.uploadTableData(file, this.tableData)
    },
    /**
     * 表格单击选中行
     * @param row
     */
    onRowClick(row) {
      this.$refs.tableData.toggleRowSelection(row)
    },
    beforeSaveBuildData() {
      // 保存前构建数据
    }
  }
}
</script>

<style scoped>

</style>
