<template>
  <div class="addOpinion">
    <div >
        <el-form ref="form" :model="form" inline label-width="100px">
          <el-form-item label="无效理由：">
            <el-select v-model="form.invalidName" placeholder="请选择" @change="changeInvalid" >
              <el-option
                v-for="item in invalidList"
                :key="item.value"
                :label="item.label"
                :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item :label="form.invalidName==1?'说明书：':'权要：'" v-if="form.invalidName+''">
            <div v-if="form.invalidName == 1">说明书</div>
            <div v-else>
              <el-select v-model="form.content" placeholder="请选择" @change="changeContent" >
                <el-option
                  v-for="item in rightList"
                  :key="item.id"
                  :label="'权要'+(item.content+1)"
                  :value="item.id">
                </el-option>
              </el-select>
              <span class="margin-left_10"><el-link type="primary" @click="show = !show">{{ show?'收起':'展开' }}</el-link></span>
            </div>
            
          </el-form-item>
          <!-- <el-form-item label="证据组合：" v-if="form.content+''">
            <el-select v-model="form.proofGroups" placeholder="请选择" @change="changeProofGroups">
              <el-option
                v-for="item in proofGroups"
                :key="item.value"
                :label="item.label"
                :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="证据：" v-if="form.proofGroups+''">
            <el-select v-model="form.proofs" placeholder="请选择" @change="changeProofs">
              <el-option
                v-for="item in proofs"
                :key="item.value"
                :label="'D' + item.sort"
                :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="特征：" v-if="form.proofs+''">
            <el-select v-model="form.features" placeholder="请选择">
              <el-option
                v-for="item in features"
                :key="item.featureId"
                :label="item.featureName"
                :value="item.featureId">
              </el-option>
            </el-select>
          </el-form-item> -->
          <el-form-item >
            <el-button type="primary" @click="addInvalid">无效理由和证据</el-button>
          </el-form-item>
        </el-form>
    </div>
    <div v-if="show">
      <InvalidDetails :invalidReasonId="form.content" :reportId="reportId" :rightSort="rightSort" :right="rights.find(item => item.sort == rightSort)"></InvalidDetails>
    </div>
    <div style="margin-left:20px">
      <div style="display:flex;justify-content:space-between;align-items:center">
        <p style="margin-top:0">陈述意见：</p>
        <el-button type="primary" size="small" @click="submit">保存</el-button>
      </div>
      <myRich-Text placeholder="请输入陈述意见" v-model="argumentStr"></myRich-Text>
    </div>

    <el-dialog title="无效理由和证据" :visible.sync="visible" width="1200px" :before-close="close"> 
      <div>
        <InvalidIndex :reportId="reportId" :signPatentNo="signPatentNo"></InvalidIndex>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import InvalidIndex from '../InvalidIndex.vue'
import InvalidDetails from '../InvalidDetails/InvalidDetails.vue';
export default {
  components: {
    InvalidIndex,
    InvalidDetails
  },
  mixins:[],
  props: ['reportId','signPatentNo'],
  data() {
    return {
      show:false,
      rightSort:null,
      visible:false,
        form:{
          invalidName:'',
          content:'',
          proofGroups:'',
          proofs:'',
          features:''
        },
        options:[],
        argumentStr:'',
        invalidList:[
        {
          id: 0,
          label: '权利要求不清楚',
          value: 0
        },
        {
          id: 1,
          label: '说明书公开不充分',
          value: 1
        },
        {
          id: 2,
          label: '不具备创造性',
          value: 2
        },
        {
          id: 3,
          label: '不具备新颖性',
          value: 3
        },
      ],
      rightList:[],
      rights:[],
      proofGroups:[],
      proofs:[],
      features:[]
    };
  },
  watch: {
    reportId(){
      this.getFeatureRights(this.signPatentNo)
        this.getInvalidReason()  
    },
  },
  computed: {},
  created() {},
  async mounted() {
    if(this.reportId){
     await this.getFeatureRights(this.signPatentNo)
       this.getInvalidReason() 
       
    }
    
  },
  methods: {
      // 请求权要特征
      async getFeatureRights(val) {
      let params = { patentNo: val}
      await this.$api.getFeatureRights(params).then((res) => {
        if (res.code == 200) {
          this.rights = res.data
        }
      })
    },
    //更新陈述意见
    submit(){
      if(!this.form.content){
        this.$message.error('请选择无效理由')
        return false
      }
      var params={
        id:this.form.content,
        argumentStr:this.argumentStr
      }
      this.$api.updateArgumentStr(params).then(response=>{
        if(response.code == 200){
          this.$message.success('陈述意见添加成功')
          this.getInvalidReason()
        }
      }).catch(error=>{
        this.$message.error('陈述意见添加失败')
      })
    },
    //打开无效理由和证据弹窗
    addInvalid(){
      this.visible = true
    },
    //关闭无效理由和证据弹窗
    close(){
      this.visible = false
      this.getInvalidReason() 
    },
    //修改无效理由选项
    changeInvalid(val){
      this.form.content = ''
      this.form.proofGroups = ''
      this.form.proofs = ''
      this.form.features = ''
      this.argumentStr = ''
      if(val==1){
        return false
      }
        var rightList = this.options.filter(item=>{return item.invalidName == val})
        this.rightList = rightList
        if(rightList.length==0){
          return false
        }
        this.rightSort = rightList[0].content
        this.form.content = rightList[0].id
        this.argumentStr = rightList[0].argumentStr || ''
        // if(rightList.length>0){
        //   this.rightList = [...new Set(rightList.map(item1=>item1.content))].map(item1=>{
        //     return {
        //       label : item1!=-1?('权要'+(item1+1)):'说明书',
        //       value :item1
        //     }
        //     item1.
        //     item1.value = item1
        //     return item1
        //   })
        // }
    },
    //修改权要选项
    changeContent(val){
      var a = this.rightList.find(item=>{return item.id == val})
      this.rightSort = a.content
      this.argumentStr = a.argumentStr || ''
      // this.form.proofGroups = ''
      // this.form.proofs = ''
      // this.form.features = ''
      //   if(val == -1 ){
      //     return false
      //   }
      //   this.proofGroups = []
      // var proofGroups = this.options.filter(item=>{return item.invalidName = this.form.invalidName && item.content == val})
      // if(proofGroups.length>0){
      //   proofGroups.forEach(item=>{
      //     item.proofGroups.forEach(item1=>{
      //       item1.label = item1.proofs.map(i=>'D'+i.sort).join('+')
      //       item1.value = item1.proofs.map(i=>'D'+i.sort).join('+')
      //       this.proofGroups.push(item1)
      //     })
      //   })
      // }
    },
    //修改证据组合选项
    changeProofGroups(val){
      this.form.proofs = ''
      this.form.features = ''
      this.proofs = this.proofGroups.find(item=>{return item.value == val}).proofs

    },
    //修改证据选项
    changeProofs(val){
      this.form.features = ''
      let params = {
        reportId: this.reportId,
        rightSort:this.form.content
      }
       this.$api.getFeatureList(params).then((res) => {
        if (res.code == 200) {
          this.$set(this,'features',res.data)
        }
      })
    },
    //获取无效理由和证据
    async getInvalidReason() {
      await this.$api.queryInvalidReason({reportId:this.reportId}).then((res) => {
        if (res.code == 200) {
          if(res.data){
            this.options = res.data
            // this.arrangeData(res.data)
            // var a = [...new Set(res.data.map(item => item.invalidName))]
            // this.tableData=res.data.sort((x,y)=>{
            //     return a.indexOf(x.invalidName) - a.indexOf(y.invalidName)
            // })
          }else{
            this.options = []
          }
        }
      })
    },
    //整理无效理由和证据数据
    arrangeData(data){
        var invalidList=[
        {
          id: 0,
          label: '权利要求不清楚',
          value: 0
        },
        {
          id: 1,
          label: '说明书公开不充分',
          value: 1
        },
        {
          id: 2,
          label: '不具备创造性',
          value: 2
        },
        {
          id: 3,
          label: '不具备新颖性',
          value: 3
        },
      ]
      invalidList.forEach(item=>{
        var rightList = data.filter(item1=>{return item1.invalidName == item.value})
        if(rightList.length>0){
         
          item.children = [...new Set(rightList.map(item1=>item1.content))].map(item1=>{
            return {
              label:item1 != -1?'权要'+item1:'说明书',
              value:item1
            }
          })
          if(item.children.length>0){
            item.children.forEach(item1=>{
              item1.children = rightList.filter(item2=>{return item2.content == item1.value}).map(item2=>{
                if(item2.proofGroups>0){
                  item2.proofGroups.forEach(i=>{
                    
                  })
                }
              })
            })
          }
        }else{
          item.children = []
        }
        
      })
    },
  },
};
</script>
<style lang="scss" scoped>
.addOpinion{
    // display: flex;
}
</style>