RMS-FrontEnd/RMS-FrontEnd/src/views/report/components/SelectedPatent.vue

<template>
    <!-- 对比文件2 -->
    <div style="">
        <!-- <el-form :inline="true" style="margin-top:20px">
        <el-form-item>
          <el-input v-model="queryParams.name" size="small" placeholder="请输入"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="" size="small" @click="getList2">查询</el-button>
          <el-button type="" size="small" @click="getPatentList">确定对比清单</el-button>
        </el-form-item>
      </el-form> -->
      <div style="display: flex; justify-content: space-between;">
        <div :style="{visibility: selectedTotal>0?'visible':'hidden'}" >
          已勾选 <b>{{ selectedTotal }}</b> 条
        </div>
        <!-- <el-select v-model="queryParams.showPatent" @chang="showPatent($event)">
          <el-option label="未选择" value="0"></el-option>
          <el-option label="已选择" value="1"></el-option>
          <el-option label="全部展示" value="2"></el-option>
        </el-select> -->
        <div>
          <!-- <el-button type="primary" @click="checkSelected">查看已选择</el-button> -->
          <!-- <el-button type="primary" @click="savePatentList" >删除</el-button> -->
        </div>
        
      </div>
      <!-- <el-tabs v-model="activeName" @tab-click="handleClick" style="margin-top:40px">
        <el-tab-pane label="相似特征专利文件" name="first"> 
          <el-table
            :data="sameData"
            border
            :span-method="objectSpanMethod"
            style="min-width: 100%; overflow:auto">
            <el-table-column
              prop="patentNo"
              align="center"
              label="专利号"
              width="200px">
              <template slot-scope="scope">
                <el-checkbox-group v-model="checkList" style="display:inline-block">
                   <el-checkbox :label="scope.row.patentNo" @change="getFunInfo(scope.row.patentNo)"> {{scope.row.patentNo}} </el-checkbox>
                </el-checkbox-group>
              </template>
            </el-table-column>
            <el-table-column prop="word" align="center" label="文字"> </el-table-column>
            <el-table-column  prop="features" align="center" label="特征"> </el-table-column>
          </el-table>
        </el-tab-pane>
            <el-tab-pane label="选择对比文件" name="second">  -->
              <div style="display:flex;justify-content: flex-end;padding-bottom:20px">
                <!-- <el-button type="primary" size="small" style="margin-right:10px;width:70px">导入</el-button> -->
                <el-button type="primary" size="small" @click="deletePatentList" style="margin-right:10px;width:70px">删除</el-button>
                <div class="btn1" @click="sift" style="width:80px;height:32px;display:flex;justify-content:space-around;border-radius:5px; cursor: pointer;">
                  <img src="@/assets/img/filtrationSearch.png" alt="" style="width:16px;height:16px;margin-top:9px;margin-left:8px"><p style="margin:0 8px 0 0;line-height:32px;color:white;font-size:14px">筛选 </p> 
                </div>
                <el-popover placement="bottom" title="" width="250" trigger="click">
                    <el-main class="patent-fast-edit-popover" v-loading="selectNumberLoading">
                              <div class="btn" @click="handleSelectNumber(0)">本页选择</div>
                              <div class="btn" @click="handleSelectNumber(1)">全部选择</div>
                              <el-divider></el-divider>
                      <div class="select-number">
                                <span>从</span>
                                <el-input size="mini" v-model="queryParams.startNumber"></el-input>
                                <span>到</span>
                                <el-input size="mini" v-model="queryParams.endNumber"></el-input>
                                <el-button type="text" size="" @click="handleSelectNumber(2)">确定</el-button>
                      </div>
                    </el-main>
                    <el-button type="info" size="small" class="margin-left_10" slot="reference">
                        选择专利<i class="el-icon-arrow-down el-icon--right"></i>
                     </el-button>
                  </el-popover>
                  <el-button type="text" size="small" class="margin-left_10" @click="handleCancelSelectNumber">取消选择</el-button> 
              </div>
           
            <el-table
              :data="tableData"
              border
              :row-key="getRowKeys"
              v-loading="loading"
              style="min-width: 100%; overflow:auto">
              <el-table-column width="80" align="center">
              <template slot-scope="scope">
                <div>
                  <el-checkbox-group v-model="checkList" style="display:inline-block">
                    <el-checkbox :label="scope.row.patentNo" @change="getFunInfo(scope.row.patentNo)">
                      <span>{{ (scope.$index + 1) + ((queryParams.current - 1) * queryParams.size) }}</span>
                    </el-checkbox>
                  </el-checkbox-group>
                </div>
              </template>
            </el-table-column>
              <el-table-column
                prop="patentNo"
                label="专利号"
                align="center"
                width="200px">
                <template slot-scope="scope">
                  <div>
                    <el-link type="primary"  @click="toPatentDetails(scope.row.patentNo)">{{scope.row.patentNo}}</el-link>
                  </div>
                <!-- <el-checkbox-group v-model="checkList" style="display:inline-block">
                    <el-checkbox :label="scope.row.patentNo" @change="getFunInfo(scope.row.patentNo)">
                          {{scope.row.patentNo}}
                    </el-checkbox>
                </el-checkbox-group> -->
                </template>
              </el-table-column>
              <el-table-column
                prop="name"
                label="专利标题"
                align="center"
                width="300px">
              </el-table-column>
              <el-table-column
                prop="simpleStatus"
                align="center"
                label="状态">
              </el-table-column>
              
            </el-table>
            <div class="pagination">
              <el-pagination :current-page.sync="queryParams.current" :page-size="queryParams.size" :total="total" @current-change="handleCurrentChange" layout="total, prev, pager, next, jumper" background></el-pagination>
            </div>
              <!-- <Patent-List :id="projectId"></Patent-List> -->
            <!-- </el-tab-pane>
  
      </el-tabs> -->
  
      <el-dialog title="筛选" :visible.sync="visible" width="1000px" max-height="600" :before-close="close" append-to-body > 
        <div style="height: 500px">
          <el-form ref="form" :model="form" label-width="80px" label-position="left">
            <el-form-item label="标题">
              <el-input type="textarea" v-model="form.patentName" placeholder="请输入查询内容"></el-input>
            </el-form-item>
            <el-form-item label="摘要">
            <el-input type="textarea" v-model="form.abstractStr" placeholder="请输入查询内容"></el-input>
            </el-form-item>
            <el-form-item label="专利号">
              <el-input type="textarea" v-model="form.patentNo" placeholder="请输入查询内容"></el-input>
            </el-form-item>
            <el-form-item label="申请号">
              <el-input type="textarea" v-model="form.applicationNo" placeholder="请输入查询内容"></el-input>
            </el-form-item>
            <el-form-item label="申请人">
            <el-input type="textarea" v-model="form.applicationName" placeholder="请输入查询内容"></el-input>
          </el-form-item>
          <el-form-item label="权利人">
            <el-input type="textarea" v-model="form.obligeeName" placeholder="请输入查询内容"></el-input>
          </el-form-item>
            <!-- <el-form-item label="申请号">
              <el-input type="textarea" v-model="form.applicationNo" placeholder="请输入查询内容"></el-input>
            </el-form-item> -->
          </el-form>
          </div>
          <div slot="footer" class="dialog-footer">
            <el-button @click="close">取 消</el-button>
            <el-button type="primary" @click="sure" >确 定</el-button>
          </div>
      </el-dialog>
    </div>
</template>
  <script>
  import { PatentDetails } from '@/views/components/common/mixins';
  export default {
    mixins:[PatentDetails],
    props: ['reportId','loadPatent'],
    data() {
      return {
        selectedTotal:0,
        isFetch:true,
        quickSelect:false,//是否快速选择
        loading: true,
        visible: false,
        activeName: 'first',
        selected: [],
        checkList: [],//回显
        tableData: [],
        sameData: [],
        total: 0,
        form: {},
        formS:{},
        startNumber:1,
        endNumber:0,
        queryParams: {
          state:1,
          isAdd:[],
          isDelete:[],
          folder: null,
          projectId: null,
          read: 'all',
          current: 1,
          size: 10,
          name: '',
          abstractStr: '',
          publicNo: '',
          applicationNo: '',
          rightContent: '',
          sort: {
            order: 'asc',
            prop: 'id'
          },
          field: [],
          tree: [],
          selected: [],
          startNumber: 1,
          endNumber: 0,
          family: 0,
          showPatent: "0",
          patentName: "",
          patentNo: "",
          applicationName: "",
          obligeeName:"",
        },
        mergeArr: ['id', 'patentNo'],
        mergeObj: {},
        selectNumberLoading: false,
      }
    },
  
    created() {
  
    },
    mounted() {
      this.getList()
    //   this.getSameData()
    },
    methods: {
      sift() {
        this.visible = true
      },
      // 筛选弹窗确定
      sure() {
        this.formS=JSON.parse(JSON.stringify(this.form))
      for (let key in this.formS) {
        this.queryParams[key]=this.formS[key]
      }
      // this.queryParams.patentName=this.form.patentName
      this.handleCancelSelectNumber()
      this.getList2()
      this.visible = false
      // this.form = {}
    },
      close() {
        this.visible = false
        this.form = this.formS
      },
      getSelectedTotal(){
        this.selectedTotal = Number(this.endNumber) - Number(this.startNumber) + 1 + Number(this.queryParams.isAdd.length) - Number(this.queryParams.isDelete.length)
      },
      async Switch(type) {//选择...确定公用
        let params = { ...this.queryParams }
        if (params.field.length == 0) {
          params.field = params.tree
        }
        switch (type) {
          case 0:
            this.queryParams.selected = this.tableData.map(item => item.patentNo);
            this.checkList = [...new Set(this.checkList.concat(this.queryParams.selected))]
            // this.endNumber = this.queryParams.endNumber
            // this.selectedTotal = this.checkList.length
              // 
            
          if(!this.quickSelect){
            this.queryParams.isAdd=JSON.parse(JSON.stringify(this.checkList))
            this.getSelectedTotal()
            break;
          }
          this.tableData.forEach((item,index)=>{
            var position = (this.queryParams.current-1)*this.queryParams.size + index + 1
            if(position>=this.startNumber){
              if(this.endNumber>=this.queryParams.current * this.queryParams.size){
                var index1 = this.queryParams.isDelete.findIndex(i=>{
                  return i == item.patentNo
                })
                if(index1!=-1){
                  this.queryParams.isDelete.splice(index1,1)
                }
              }else{
                if(position<=this.endNumber){
                  var index1 = this.queryParams.isDelete.findIndex(i=>{
                      return i == item.patentNo
                    })
                    if(index1!=-1){
                      this.queryParams.isDelete.splice(index1,1)
                    }
                }else{
                  var index2 = this.queryParams.isAdd.findIndex(i=>{
                    return i == item.patentNo
                  })
                  if(index2==-1){
                    this.queryParams.isAdd.push(item.patentNo)
                  }
                }
              }
            }else{
              var index2 = this.queryParams.isAdd.findIndex(i=>{
                return i == item.patentNo
              })
              if(index2==-1){
                this.queryParams.isAdd.push(item.patentNo)
              }
            }
          })
            this.getSelectedTotal()
            this.getList()
            break
          case 1:
            params.startNumber = 1;
            params.endNumber = this.total
            this.startNumber = 1
            this.endNumber = this.total
            // this.commonSwitch()
            // this.quickSelect = true
            // break
          case 2:
            // this.selectNumberLoading = true
            // this.$api.getComPatentNos(params).then(response => {
            //   console.log(response.data)
            //   this.queryParams.selected = response.data
            //   this.checkList = [...new Set(this.checkList.concat(this.queryParams.selected))]
            //   // this.checkList = this.queryParams.selected
            //   this.selectNumberLoading = false
            //   this.getList()
            // }).catch(error => {
            //   this.selectNumberLoading = false
            // })
            this.queryParams.isDelete = []
            this.queryParams.isAdd = []
              if (type == 2) {
                if (!Number(this.queryParams.startNumber)||!Number(this.queryParams.endNumber)) {
                  this.queryParams.endNumber =this.endNumber>0?this.endNumber:this.total
                  this.queryParams.startNumber =this.endNumber>0?this.startNumber:1
                  break;
                }
              this.startNumber = this.queryParams.startNumber
              this.endNumber = this.queryParams.endNumber
            }
            
            // this.checkList =JSON.parse(JSON.stringify(this.queryParams.selected)) 
            this.checkList=[]
            this.queryParams.isDelete = []
            this.queryParams.isAdd = []
            await this.getList()
            this.commonSwitch()
            this.quickSelect = true
            
            break
        }
      },
      commonSwitch(){
        
              if(this.queryParams.size*this.queryParams.current>=this.startNumber ){
                if(this.queryParams.size*this.queryParams.current>=this.endNumber){
                  if(this.queryParams.size*(this.queryParams.current-1)+1<=this.startNumber){
                    var a = this.startNumber-(this.queryParams.size*(this.queryParams.current-1)+1)
                    var b = this.endNumber-(this.queryParams.size*(this.queryParams.current-1)+1)
                    for(var y=a;y<=b;y++){
                     this.toIsDelete(this.tableData[y].patentNo,y)
  
                    }
                  }else{
                    var a = (this.queryParams.size*(this.queryParams.current-1)+1)-(this.queryParams.size*(this.queryParams.current-1)+1)
                    var b = this.endNumber-(this.queryParams.size*(this.queryParams.current-1)+1)
                    for(var y=a;y<=b;y++){
                      this.toIsDelete(this.tableData[y].patentNo,y)
  
                    }
                  }
                }else{
                  if(this.queryParams.size*(this.queryParams.current-1)+1<=this.startNumber){
                    var a = this.startNumber-(this.queryParams.size*(this.queryParams.current-1)+1)
                    var b = this.queryParams.size*this.queryParams.current-(this.queryParams.size*(this.queryParams.current-1)+1)
                    for(var y=a;y<=b;y++){
                      this.toIsDelete(this.tableData[y].patentNo,y)
  
                    }
                  }else{
                    var a = (this.queryParams.size*(this.queryParams.current-1)+1)-(this.queryParams.size*(this.queryParams.current-1)+1)
                    var b = this.queryParams.size*this.queryParams.current-(this.queryParams.size*(this.queryParams.current-1)+1)
                    for(var y=a;y<=b;y++){
                      this.toIsDelete(this.tableData[y].patentNo,y)
                      
                    }
                  }
                }
              }
             this.checkList = [...new Set(this.checkList)]
             this.selected = this.checkList
             this.getSelectedTotal()
        // console.log(this.checkList)
            
      },
      toIsDelete(patentNo,y){
        var index2 = this.queryParams.isDelete.findIndex(i=>{
          return i==patentNo
        })
        if(index2!=-1){
  
        }else{
          this.checkList.push(this.tableData[y].patentNo)
        }
        var index = this.queryParams.selected.findIndex(item=>{
          return item == patentNo
        })
        if(index!=-1){
          var index3 = this.queryParams.isDelete.findIndex(m=>{
          return m==patentNo
        })
        if(index3!=-1){
  
        }else{
          this.queryParams.isDelete.push(this.queryParams.selected[index])
        }
         
        }
  
        
      },
      handleSelectNumber(type) {
     
        this.Switch(type)
      
      },
  
      handleCancelSelectNumber() {//取消选择
        this.queryParams.isAdd = []
        this.queryParams.isDelete = []
        this.startNumber = 1
        this.queryParams.startNumber = 1
        this.queryParams.endNumber = this.total
        this.endNumber = 0
        this.queryParams.selected = []
        this.checkList = []
        this.quickSelect = false
        this.selectedTotal = 0
        // this.getList()
      },
      handleClick(tab, event) {
        // console.log(tab, event);
      },
      getFunInfo(val) {
        if(this.quickSelect){
          var index4 = this.queryParams.selected.findIndex(item=>{
              return item == val
            }) 
            if(index4!=-1){
              var a = {
                reportId:this.reportId,
                patentNo:val
              }
              this.$api.deleteCompareNo(a).then(response=>{
                if(response.code == 200){
                          // this.getList()
                  this.queryParams.selected.splice(index4,1)
                }
              })
            
           this.isFind(val)
         
        }else{
          this.isFind(val)
        }
        }else{
          var index = this.queryParams.selected.findIndex(item=>{
            return item == val
          }) 
          if(index!=-1){
            var a = {
              reportId:this.reportId,
              patentNo:val
            }
            this.$api.deleteCompareNo(a).then(response=>{
              if(response.code == 200){
                this.getList()
              }
            })
          }else{
            var index5 = this.queryParams.isAdd.findIndex(item=>{
              return item == val
            })
            if(index5!=-1){
              this.queryParams.isAdd.splice(index5,1)
            }else{
              this.queryParams.isAdd.push(val)
            }
          }
        }
        this.getSelectedTotal()
      },
      isFind(val){
        if(this.isFetch){
            var index = this.selected.findIndex(item=>{
            return item == val
          })
          if(index!=-1){
              this.queryParams.isDelete.push(val)
              this.selected.splice(index, 1)
          }else{
            var index2 = this.queryParams.isDelete.findIndex(i=>{
              return i == val
            })
            if(index2!=-1){
              this.queryParams.isDelete.splice(index2, 1)
            }else{
              var index3 = this.queryParams.isAdd.findIndex(m=>{
                return m == val
              })
              if(index3!=-1){
                this.queryParams.isAdd.splice(index3,1)
              }else{
                this.queryParams.isAdd.push(val)
              }
            }
          }
          this.isFetch = false
        }else{
          var index3 = this.queryParams.isAdd.findIndex(m=>{
                return m == val
              })
              if(index3!=-1){
                 this.queryParams.isAdd.splice(index3,1)
              }else{
                var index2 = this.queryParams.isDelete.findIndex(i=>{
                  return i == val
                })
                if(index2!=-1){
                  this.queryParams.isDelete.splice(index2, 1)
                }else{
                  // this.isFetch = true
                  // this.getFunInfo()
                  var index = this.selected.findIndex(item=>{
                    return item == val
                  })
                  if(index!=-1){
                    var index4 = this.queryParams.selected.findIndex(item=>{
                      return item == val
                    }) 
                    if(index4!=-1){
                      var a = {
                        reportId:this.reportId,
                        patentNo:val
                      }
                      this.$api.deleteCompareNo(a).then(response=>{
                        if(response.code == 200){
                        this.queryParams.selected.splice(index4,1)
                        }
                      })
                    }else{
                      this.queryParams.isDelete.push(val)
                      this.selected.splice(index, 1)
                    }
                  }else{
                    this.queryParams.isAdd.push(val)
                  }
                }
              }
          }
      },
      getSameData() {//相似特征
        let rep = {
          size:this.queryParams.size,
          current:this.queryParams.current,
          reportId:this.reportId
        }
        this.$api.simFeaturePatent(rep).then(res => {//相似特征
          // console.log("simFeaturePatent", res);
          if (res.code==200) {
          }
        })
        // this.getSpanArr(this.sameData)
      },
      getSpanArr(data) {
        this.row = []
        this.mergeArr.forEach((key, index1) => {
          let count = 0;
          this.mergeObj[key] = [];
          data.forEach((item, index) => {
  
            if (index === 0) {
              this.mergeObj[key].push(1);
            } else {
              if (item[key] === data[index - 1][key] && item[key] !== 'explain') {
                this.mergeObj[key][count] += 1;
                this.mergeObj[key].push(0);
              } else {
                count = index;
                this.mergeObj[key].push(1);
              }
            }
          })
        })
      },
      objectSpanMethod({ row, column, rowIndex, columnIndex }) {
        if (this.mergeArr.indexOf(column.property) !== -1) {
          if (this.mergeObj[column.property][rowIndex]) {
  
            return [this.mergeObj[column.property][rowIndex], 1]
          } else {
            return [0, 0];
          }
        }
      },
      getRowKeys(row) {
        return row.id
      },
      // handleSelectionChange(val) {
      //   this.checkList = val
      // },
      async handleCurrentChange(val) {//分页
        this.queryParams.current = val;
        // this.checkList = []
        // this.queryParams.endNumber=0
          await this.getList();
          // console.log(this.checkList);
        if(this.quickSelect){
          this.commonSwitch()
        }
        
      },
      
      deletePatentList() {//删除
        let add = {
         isDelete:this.queryParams.isDelete,
         isAdd:this.queryParams.isAdd,
         startNumber:this.startNumber,
         endNumber:this.endNumber,
         reportId:this.reportId,
        }
        this.queryParams.startNumber=this.startNumber,
        this.queryParams.endNumber=this.endNumber,
        this.queryParams.reportId = this.reportId,
        this.$api.deleteCompareNo(this.queryParams).then(res => {
            if (res.code==200) {
              this.startNumber = 1
              this.endNumber = 0
              this.selectedTotal = 0
              this.quickSelect = false
              this.queryParams.isAdd=[]
              this.queryParams.isDelete=[]
              this.checkList = []
              // for (let key in this.form) {
              //   this.queryParams[key]=''
              // }
              // this.form = {}
              this.getList2()
              this.$emit("save", true);
              this.$message({
                message: '删除成功',
                type: 'success'
              });
            }
          })
        // if (add.patentNos.length>0) {
        //   this.$api.addCompareFile(add).then(res => {
        //     console.log(res);
        //     if (res.code==200) {
        //       this.$emit("save", true);
        //     }
        //   })
        // } else {
        //   this.$confirm('您未做勾选!点击确定将会进行下一步!', '温馨提示',  {
        //       confirmButtonText: '确定',
        //       cancelButtonText: '取消',
        //       type: 'warning'
        //   }).then(() => {//
        //     this.$emit("save", true);
        //   }).catch(() => {
                    
        //   });
        // }
       
        
      },
      getList2() {
        this.queryParams.current = 1
        this.getList()
      },
     async getList(key) {
       this.queryParams.reportId = this.reportId
        let params = JSON.parse(JSON.stringify(this.queryParams))
        params.tree.map(tree => {
          let field = params.field.filter(item => item.key === tree.key)
          if (field.length === 0) {
            params.field.push(tree)
          }
        })
        params.tree = undefined
        this.$store.commit('SET_PATENT_PARAMS', params)
       await this.$api.getCompareFile(params).then(response => {
          this.loading = false
           this.total = response.data.datas.total
          this.queryParams.startNumber = this.endNumber>0?this.startNumber:1
          // this.queryParams.endNumber =this.queryParams.endNumber==0? response.data.datas.total:this.queryParams.endNumber
          this.queryParams.endNumber =this.endNumber>0?this.endNumber: response.data.datas.total
          this.tableData = response.data.datas.records
          this.queryParams.selected = []
          // this.checkList =JSON.parse(JSON.stringify(this.queryParams.selected)) 
          // this.checkList =JSON.parse(JSON.stringify([...new Set(this.checkList.concat(this.queryParams.selected))])) 
          // this.selected = this.checkList
          this.isFetch = true
          
        //  this.selectedTotal=response.data.selectedTotal+(this.endNumber-this.startNumber+1)+this.queryParams.isAdd.length-this.queryParams.isDelete.length
        
        }).catch(error => {
  
        })
      },
      showPatent(even) {//选择下拉框
        // console.log(even);
      },
    },
    watch: {
     
      loadPatent(val){
        for (let key in this.form) {
          this.queryParams[key]=''
        }
        this.form = {}
        this.getList()
      },
      ChosePatentSure(val) {
        if (val) {
          if(this.checkList.length>0){
             this.deletePatentList()
             this.$nextTick(_=>{
              this.$emit("save", true);
             })
            
          }else{
            this.$confirm('您未做勾选!点击确定将会进行下一步!', '温馨提示',  {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            }).then(() => {
              this.$emit("save", true);
            }).catch(() => {
                      
            });
          }
         
        }
      }
    }
  }
  </script>
  
  <style lang="scss" >
  .btn1 {
    background: #909399;
  }
  
  .btn1:hover {
  
    background-color: #a4a7ab;
  }
  
  .patent-fast-edit-popover {
    padding: 0 !important;
  
    .btn {
      color: #000;
      line-height: 40px;
      border-radius: 5px;
      padding-left: 10px;
      cursor: pointer;
  
      &:hover {
        background: #adadad;
        color: #fff;
      }
    }
  
    .disabled {
      cursor: not-allowed !important;
    }
  
    .bottom {
      text-align: right;
      color: #1e9fff;
      line-height: 40px;
      padding-left: 10px;
      font-size: 18px;
    }
  
    .el-divider--horizontal {
      margin: 10px 0 !important;
    }
  
    .select-number {
      .el-input {
        width: 70px;
      }
  
      span {
        padding: 0 3px;
      }
    }
  }
  </style>