<template>
  <div style="padding:10px">
    <div v-for="(item,index2) in InvalidDetails" :key="item.id">
        <div>
            <p>
              <span>证据组合{{ index2+1 }}：</span><span v-for="(i,index) in item.proofs" :key="i.id"><span v-if="i.id">D{{ i.sort }}</span><span v-else>公知常识</span> <span v-if="index<item.proofs.length-1">+</span> </span>
              <span >
                <i v-if="!item.show" class="iconfont icon-yanjing_xianshi" @click="changeShow(item)" style="font-size:20px"></i>
                <i class="iconfont icon-yanjing_yincang" v-else @click="changeShow(item)" style="font-size:20px"></i>
              </span>
            </p>
            <div v-if="!item.show" style="margin-bottom:10px">
              <Table :tableData="item.proofDetails" @submit="submitInvalid" :reportId="reportId"  v-bind="$attrs" v-on="$listeners" :proofs="item.proofs" :proofGroup="item"></Table>
            </div>
            <div style="display:flex;align-items:center;" v-if="!item.show">
              <p style="min-width:80px !important">陈述意见：</p>
                <div  v-if="!item.editArgumentStr" style="display:flex;align-items:center">
                  <div v-html="item.argumentStr" class="div_MAX_Height" style="border:1px solid #DCDFE6"></div>
                  <span @click="editArgumentStr(item)" v-if=" $reportPermission(reportId,[0,1])"><el-link type="primary"><i class="iconfont icon-bianji" style="font-size:28px"></i></el-link></span>
                </div>
                <div v-else style="width:100%;display:flex;align-items:center">
                  <myRich-Text style="width:100%" v-model="item.argumentStr" placeholder="请输入陈述意见"></myRich-Text>
                  <el-button type="primary" class="margin-left_10" icon="el-icon-check" circle style="font-size:15px" @click="saveArgumentStr(item)"></el-button>
                  <el-button type="primary" class="margin-left_10" icon="iconfont icon-fanhui" circle style="font-size:15px" @click="cancelArgumentStr(item)"></el-button>
                  <!-- <span class="margin-left_10" @click="saveArgumentStr(item)"><el-link type="primary"><i class="el-icon-check" style="font-size:28px"></i></el-link></span> -->
                </div>
            </div>
        </div>
        
    </div>
  </div>
</template>

<script>
import Table from './table.vue';
export default {
  components: {
    Table
  },
  props: ['invalidReasonId','proofGroupId','reportId'],
  data() {
    return {
      InvalidDetails:[],
    };
  },
  watch: {
    proofGroupId(){
      this.queryDetailByInvalidId()
    },
    opinionContrastList(){
      this.queryDetailByInvalidId()
    },
    invalidReasonId(){
      this.queryDetailByInvalidId()
    }
  },
  computed: {
    opinionContrastList() {
      return this.$store.state.report.opinionContrastList
    },
  },
  created() {},
  mounted() {
    this.queryDetailByInvalidId()
    
  },
  methods: {
    
    //根据无效理由Id查询证据组合详情
    queryDetailByInvalidId(){
      var params = {
        invalidReasonId:this.invalidReasonId,
        proofGroupId:this.proofGroupId?this.proofGroupId:null
      }
        this.$api.queryDetailByInvalidId(params).then(response=>{
            if(response.code == 200){
              if(this.proofGroupId){
                this.InvalidDetails = response.data.filter(item=>{
                  return item.id == this.proofGroupId
                })
              }else{
                this.InvalidDetails = response.data
              }
                
            }
        })
    },
   //修改是否展示详情
   changeShow(row){
    this.$set(row,'show',!row.show)
   },
   //编辑组合陈述意见
   editArgumentStr(row){
    this.$set(row,'editArgumentStr',!row.editArgumentStr)
    this.$set(row,'argumentStr1',row.argumentStr)
   },
   //保存证据组合陈述意见
   saveArgumentStr(row){
    var params = {
      ...row,
    }
    this.$api.updateProofGroup(params).then(response=>{
      if(response.code == 200){
        this.$message.success('陈述意见更新成功')
        this.editArgumentStr(row)
      }
    }).catch(error=>{
      this.$message.error('陈述意见更新失败')
    })
   },
   //取消证据组合陈述意见
   cancelArgumentStr(row){
    this.$set(row,'editArgumentStr',!row.editArgumentStr)
    this.$set(row,'argumentStr',row.argumentStr1)
   },
  //修改证据组合的无效证据
    submitInvalid(){
      this.queryDetailByInvalidId()
    },
  },
};
</script>
<style lang="scss" scoped>

</style>