<template>
  <div class="height_100" v-DivHeight="getDivHeight">
    <el-table
      ref="table"
      :data="tableData"
      :span-method="objectSpanMethod"
      :row-class-name="tableRowClassName"
      :maxHeight="tableHeight"
      border
      v-loading="loading"
      :header-cell-style="{'text-align':'center'}"
      style="min-width: 100%; overflow: auto"
    >
      <el-table-column
        prop="rightName"
        label="标的权利项"
        align="center"
        width="200px"
      >
        <template slot-scope="scope">
          <el-tooltip
            class="item"
            effect="dark"
            :content="scope.row.rightContent"
            placement="top"
          >
            <span>{{ scope.row.rightName }}</span>
          </el-tooltip>
        </template>
      </el-table-column>
      <el-table-column
        prop="featureContent"
        label="标的权利要求特征"
        width="300px"
      >
        <template slot-scope="scope">
          {{ scope.row.featureContent }}
        </template>
      </el-table-column>

      <el-table-column v-for="(item, index) in tableHeader" :key="index" :min-width="item.length > 6 ? '190' : '110'">
        <template slot="header">
            <span>
                <span>
                    <el-link type="primary" @click="editContrast(item)">{{ item.type == 0?item.literatureNo:item.name }}(D{{ item.sysOrder }})</el-link>
                </span>
                <el-tag style="font-size: 12px; border-radius: 50%" v-if="item.remark">{{ item.remark }}</el-tag>
                <span>
                    <my-draggable :list="tableHeader" :check="item.id" @change="changeOrder" @update="updateOrder"></my-draggable>
                </span>
            </span>
          
        </template>
        <template slot-scope="scope">
          <div
            class=""
            v-if="scope.row.evidenceReasons"
            style="width: calc(100% + 20px); margin-left: -10px"
          >
            <p v-for="i in scope.row.evidenceReasons.filter(i=>i.literatureId == item.id)" :key="i.evidenceId">
              <span>
                <el-link style="color:red;margin-left:10px" @click="delContrast(i.evidenceId)">删除</el-link>
              </span>
              [{{ i.fieldName }}]
              <span v-if="i.common">
                (解析过程：{{ i.common }})
              </span>
              
              {{ i.evidenceText }}
              <el-image
                ref="image"
                :preview-src-list="imgList"
                v-if="i.fileGuid"
                :src="$commonJS.checkViewer(i.fileGuid)"
                style="vertical-align: middle; width: 100px"
                @click="showImage($commonJS.checkViewer(i.fileGuid))"
              ></el-image>
              <span v-if="i.conclusion">
                ({{ i.conclusion }})
                </span>
            </p>
          </div>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import mixins from './mixins'
export default {
  mixins:[mixins],
  components: {},
  props: {},
  data() {
    return {
        
    };
  },
  watch: {
    tableData(val){
        if(val){
            this.getSpanArr(this.tableData)
        }
    }
  },
  computed: {},
  created() {},
  mounted() {
    if(this.tableData.length>0){
        this.getSpanArr(this.tableData)
    }
  },
  methods: {
    
  },
};
</script>
<style lang="scss" scoped>
</style>