update final

Jeremy Han

2022-09-09 ca4fd655586ff0409347494f8a3508517632b3d2

update final

 src/api/url_analyst.js

@@ -17,6 +17,10 @@
  return axios.post('/PatentSearch/GetPatentList',data)
}

export const GetPatentListbyAdvance = (data)=>{
  return axios.post('/PatentSearch/GetPatentListbyAdvance',data)
}
//只能检索左侧筛选项
export const GetPatentListCount = (data)=>{
  return axios.post('/PatentSearch/GetPatentListCount',data)
}
@@ -25,6 +29,17 @@
export const GetPatentListbyLaw = (data)=>{
  return axios.post('/PatentSearch/GetPatentListbyLaw',data)
}
//批量检索
export const GetPatentListbyPatch = (data)=>{
  return axios.post('/PatentSearch/GetPatentListbyPatch',data)
}
//搜索详情
export const GetPatentListbyId = (data)=>{
  return axios.get('/PatentSearch/GetPatentListbyId',{params:data})
}




//获取相关分类树


 src/assets/nation_flags/AE.png

 src/assets/nation_flags/AL.png

 src/assets/nation_flags/AM.png

 src/assets/nation_flags/AO.png

 src/assets/nation_flags/AP.png

 src/assets/nation_flags/AR.png

 src/assets/nation_flags/AT.png

 src/assets/nation_flags/AU.png

 src/assets/nation_flags/AZ.png

 src/assets/nation_flags/BD.png

 src/assets/nation_flags/BE.png

 src/assets/nation_flags/BG.png

 src/assets/nation_flags/BH.png

 src/assets/nation_flags/BN.png

 src/assets/nation_flags/BR.png

 src/assets/nation_flags/BX.png

 src/assets/nation_flags/CA.png

 src/assets/nation_flags/CH.png

 src/assets/nation_flags/CL.png

 src/assets/nation_flags/CN.png

 src/assets/nation_flags/CO.png

 src/assets/nation_flags/CR.png

 src/assets/nation_flags/CS.png

 src/assets/nation_flags/CU.png

 src/assets/nation_flags/CY.png

 src/assets/nation_flags/CZ.png

 src/assets/nation_flags/DD.png

 src/assets/nation_flags/DE.png

 src/assets/nation_flags/DK.png

 src/assets/nation_flags/DO.png

 src/assets/nation_flags/DZ.png

 src/assets/nation_flags/EA.png

 src/assets/nation_flags/EC.png

 src/assets/nation_flags/EE.png

 src/assets/nation_flags/EG.png

 src/assets/nation_flags/EP.png

 src/assets/nation_flags/ES.png

 src/assets/nation_flags/EU.png

 src/assets/nation_flags/FI.png

 src/assets/nation_flags/FR.png

 src/assets/nation_flags/GB.png

 src/assets/nation_flags/GC.png

 src/assets/nation_flags/GE.png

 src/assets/nation_flags/GR.png

 src/assets/nation_flags/GT.png

 src/assets/nation_flags/HK.png

 src/assets/nation_flags/HN.png

 src/assets/nation_flags/HR.png

 src/assets/nation_flags/HU.png

 src/assets/nation_flags/ID.png

 src/assets/nation_flags/IE.png

 src/assets/nation_flags/IL.png

 src/assets/nation_flags/IN.png

 src/assets/nation_flags/IS.png

 src/assets/nation_flags/IT.png

 src/assets/nation_flags/JO.png

 src/assets/nation_flags/JP.png

 src/assets/nation_flags/KG.png

 src/assets/nation_flags/KR.png

 src/assets/nation_flags/LK.png

 src/assets/nation_flags/LT.png

 src/assets/nation_flags/LU.png

 src/assets/nation_flags/LV.png

 src/assets/nation_flags/MA.png

 src/assets/nation_flags/MC.png

 src/assets/nation_flags/MD.png

 src/assets/nation_flags/MK.png

 src/assets/nation_flags/MN.png

 src/assets/nation_flags/MO.png

 src/assets/nation_flags/MT.png

 src/assets/nation_flags/MX.png

 src/assets/nation_flags/MY.png

 src/assets/nation_flags/MZ.png

 src/assets/nation_flags/NL.png

 src/assets/nation_flags/NO.png

 src/assets/nation_flags/NZ.png

 src/assets/nation_flags/OA.png

 src/assets/nation_flags/PA.png

 src/assets/nation_flags/PE.png

 src/assets/nation_flags/PH.png

 src/assets/nation_flags/PK.png

 src/assets/nation_flags/PL.png

 src/assets/nation_flags/PT.png

 src/assets/nation_flags/RO.png

 src/assets/nation_flags/RS.png

 src/assets/nation_flags/RU.png

 src/assets/nation_flags/SA.png

 src/assets/nation_flags/SE.png

 src/assets/nation_flags/SG.png

 src/assets/nation_flags/SI.png

 src/assets/nation_flags/SK.png

 src/assets/nation_flags/SM.png

 src/assets/nation_flags/SU.png

 src/assets/nation_flags/SV.png

 src/assets/nation_flags/TH.png

 src/assets/nation_flags/TM.png

 src/assets/nation_flags/TN.png

 src/assets/nation_flags/TR.png

 src/assets/nation_flags/TW.png

 src/assets/nation_flags/UA.png

 src/assets/nation_flags/US.png

 src/assets/nation_flags/UY.png

 src/assets/nation_flags/VN.png

 src/assets/nation_flags/WO.png

 src/assets/nation_flags/YU.png

 src/assets/nation_flags/ZA.png

 src/assets/nation_flags/ZM.png

 src/assets/nation_flags/ZW.png

 src/components/ExportCom.vue

New file
@@ -0,0 +1,259 @@
<template>
  <div class="export">
    <a-row>
      <a-col :span="12" class="select-wrapper">
        <div class="item">
          <span class="label">专利范围</span>
          <div>
            <a-radio-group v-model="rangeType">
              <a-radio value="a">选中文件(已选20条)</a-radio>
              <div class="flex item-center">
                <a-radio default-checked value="b">
                </a-radio>
                <span style="line-height:32px">范围</span>
                <a-input-group compact style="display:inline-block;width: 180px;margin-left: 10px;">
                  <a-input style="width: 70px" default-value="0" /> --
                  <a-input style="width: 70px" :default-value="total" />
                </a-input-group>
                <span style="line-height:32px">共{{total}}条记录</span>
              </div>
            </a-radio-group>
          </div>
        </div>
        <div class="item">
          <span class="label">文件格式</span>
          <a-select default-value="EXCEl" style="width: 120px">
            <a-select-option value="EXCEL">
              EXCEL
            </a-select-option>
          </a-select>
        </div>
        <div class="item">
          <span class="label">选择下载模板</span>
          <a-select default-value="EXCEl" style="width: 120px">
            <a-select-option value="EXCEl">
              默认著录项目
            </a-select-option>
          </a-select>
        </div>
      </a-col>
      <a-col :span="12">
        <div class="tips-wrapper">
          <p>日下载总额度: <span class="cm-color">{{vipInfo.DownNumPerDay}}</span> 条/天    今日已使用: <span class="cm-color">{{vipInfo.DownNumPerDayActual}}</span> 条     今日剩余: <span class="cm-color">{{vipInfo.DownNumPerDayLeft}}</span> 条 &nbsp;&nbsp;&nbsp;&nbsp;</p>
          <p>月下载总额度: <span class="cm-color">{{vipInfo.DownNumPerMonth}}</span> 条/天    本月已使用: <span class="cm-color">{{vipInfo.DownNumPerMonthActual}}</span> 条     本月剩余: <span class="cm-color">{{vipInfo.DownNumPerMonthLeft}}</span> 条 &nbsp;&nbsp;&nbsp;&nbsp;</p>
        </div>
      </a-col>
    </a-row>
    <a-row :gutter="24" style="margin-top:24px">
      <a-col :span="6">
        <div class="check-box">
          <header>
            <h5>导出字段</h5>
          </header>
          <ul class="checked check-body">
            <li v-for="(item,index) in checkedList.a">
              <span>{{item}}</span>
              <a-icon type="delete" @click="handleDel('a',index)" />
            </li>
            <li v-for="(item,index) in checkedList.b">
              <span>{{item}}</span>
              <a-icon type="delete" @click="handleDel('b',index)" />
            </li>
          </ul>
        </div>
      </a-col>
      <a-col :span="18">
        <div class="check-box">
          <header>
            <h5>可选字段<span>(10/167)</span></h5>
          </header>
          <div class="check-body check-list" style="padding:4px 10px">
            <div class="section line">
              <a-checkbox :indeterminate="indeterminate.all" :checked="checkAll.all" @change="onCheckAllChange('all',...arguments)">
                全选
              </a-checkbox>
            </div>
            <div class="section line flex">
              <div class="part-all">
                <a-checkbox :indeterminate="indeterminate.a" :checked="checkAll.a" @change="onCheckAllChange('a',...arguments)">
                  默认著录项
                </a-checkbox>
              </div>
              <div class="part-list">
                <a-checkbox-group v-model="checkedList.a" :options="options.a" @change="checkItemChange('a',...arguments)" />
              </div>
            </div>
            <div class="section line flex">
              <div class="part-all">
                <a-checkbox :indeterminate="indeterminate.b" :checked="checkAll.b" @change="onCheckAllChange('b',...arguments)" >
                  分类号
                </a-checkbox>
              </div>
              <div class="part-list">
                <a-checkbox-group v-model="checkedList.b" :options="options.b" @change="checkItemChange('b',...arguments)" />
              </div>
            </div>
          </div>
        </div>
      </a-col>
    </a-row>
    <div class="footer">
      <a-button type="primary">&nbsp;&nbsp;下载&nbsp;&nbsp;</a-button>
      <a-input-search
      style="width:300px;margin-left:24px"
      placeholder="输入模板名称"
    >
      <a-button slot="enterButton">
        保存模板
      </a-button>
    </a-input-search>
    </div>
  </div>
</template>
<script>
import { getUserVipInfo } from "@/api/url_user";

const options = {
  a:['标题','摘要','申请人','公开(公告)日','申请号','申请日','专利类型','IPC'],
  b:['国民经济分类','新型产业分类']
}

export default {
  props:['total','checkNum'],
  data(){
    return{
      vipInfo:{},
      rangeType:'b',
      options,
      checkedList:{
        a:JSON.parse(JSON.stringify(options.a)),
        b:[]
      },
      indeterminate:{
        all:true,
        a:false,
        b:false,
      },
      checkAll:{
        all:false,
        a:true,
        b:false
      }
    }
  },
  mounted(){
    this.getUserVipInfo()
  },
  methods:{
    getUserVipInfo() {
      getUserVipInfo()
        .then((res) => {
          this.vipInfo = res.Data;
        })
    },
    checkItemChange(model,checkedList){
      console.log(model,checkedList)
      this.indeterminate[model] = !!checkedList.length && checkedList.length < this.options[model].length;
      this.checkAll[model] = checkedList.length === this.options[model].length;
      this.checkAllStatus()
    },
    onCheckAllChange(model,e){
      console.log(model,e.target.checked)
      if(model == 'all'){
        this.indeterminate.all = false
        this.onCheckAllChange('a',e)
        this.onCheckAllChange('b',e)
      }else{
        this.checkedList[model] =  e.target.checked ? JSON.parse(JSON.stringify(this.options[model])): [] 
        this.indeterminate[model] = false
        this.checkAll[model] = e.target.checked
        this.checkAllStatus()
      }
    },
    checkAllStatus(){
      let lengthChecked = this.checkedList['a'].length + this.checkedList['b'].length
      let lengthAll = this.options['a'].length + this.options['b'].length
      this.indeterminate['all'] = !!lengthChecked  && lengthChecked < lengthAll;
      this.checkAll['all'] = lengthChecked === lengthAll;
    },
    handleDel(model,index){
      this.checkedList[model].splice(index,1)
    }
  }
}

</script>
<style lang="scss" scoped>
.select-wrapper{
  border-right: 1px solid #e8e8e8;
  .item{
    display: flex;
    padding: 6px 0;
    .label{
      width: 120px;
    }
    .ant-radio-wrapper{
      padding: 5px 0;
    }
  }
}

.tips-wrapper{
  padding: 0 10px;
  p{
    line-height: 30px;
  }
  p.line{
    border-bottom: 1px dashed #e8e8e8;
    margin-bottom: 10px;
  }
}
.check-box{
  border: 1px solid #e8e8e8;
  header{
    border-bottom: 1px solid #e8e8e8;
    background: rgb(244,247,250);
    padding: 10px;
    h5{

    }
  }
  .check-body{
    height: 250px;
    overflow: auto;
  }
  ul.checked{
    padding: 4px 0;
    li{
      padding: 4px 10px;
      display: flex;
      justify-content: space-between;
      .a-icon{
        cursor: pointer;
      }
    }
  }
  .check-list{
    .section{
      padding: 8px 0;
      &.line{
        border-bottom: 1px dashed #e8e8e8;
      }
    }
    .part-all{
      width: 120px;
    }
    .part-list{
      flex: 1;
      flex-wrap: wrap;
      .ant-checkbox-wrapper{
        margin-left: 8px;
      }
    }
  }
}
.footer{
  margin-top: 24px;
}

</style>

 src/components/MainHeader.vue

@@ -9,7 +9,7 @@
          <li class="item" :class="{secItem:$route.path=='/home'}">
            <router-link to="/"><span>首页</span></router-link>
          </li>
          <li class="Retrieval item" :class="{secItem:$route.path=='/smart'||$route.path=='/senior'||$route.path=='/batch'||$route.path=='/law'||$route.path=='/detail'}">
          <li class="Retrieval item" :class="{secItem:['smart','senior','batch','law','detail'].indexOf($route.name)>=0 }">
            <span>检索</span>
            <ul class="RetrievalShow">
              <li>

 src/components/SeniorTranfer.vue

New file
@@ -0,0 +1,221 @@
<template>
  <div class="transfer-wrapper">
    <a-tabs :activeKey="activeKey" @change="modelTabChange">
        <a-tab-pane key="icpList" tab="IPC分类">
          <a-select v-model="ICPYear" style="width: 120px;margin-bottom:20px" @change="getTreeData">
            <a-select-option v-for="item in yearList" :key="item" :value="item">
              {{item}}版
            </a-select-option>
          </a-select>
        </a-tab-pane>
        <a-tab-pane key="cpcList" tab="CPC分类">
        </a-tab-pane>
        <a-tab-pane key="industrycn" tab="新兴产业分类">
        </a-tab-pane>
        <a-tab-pane key="stratregicIndustry" tab="GBC分类">
        </a-tab-pane>
      </a-tabs>
      <a-spin :spinning="treeLoading">
      <a-transfer
        class="tree-transfer"
        :data-source="dataSource"
        :target-keys="targetKeys"
        :render="item => item.title"
        :show-select-all="false"
        @change="transferChange"
      >
        <template
          slot="children"
          slot-scope="{ props: { direction, selectedKeys }, on: { itemSelect } }"
        >
          
            <a-tree
              v-if="direction === 'left'&&!treeLoading"
              blockNode
              checkable
              checkStrictly
              :defaultExpandAll="false"
              :checkedKeys="[...selectedKeys, ...targetKeys]"
              :treeData="treeData"
              :load-data="onLoadData"
              style="height:300px;overflow:auto"
              @check="
                (_, props) => {
                  onChecked(_, props, [...selectedKeys, ...targetKeys], itemSelect);
                }
              "
              @select="
                (_, props) => {
                  onChecked(_, props, [...selectedKeys, ...targetKeys], itemSelect);
                }
              "
            />
        </template>
      </a-transfer>
      </a-spin>
  </div>
</template>

<script>

import { GetIpcClass , GetCpcClass , GetStraindustryTree ,GetEcoindustryTree} from '@/api/url_analyst'

function isChecked(selectedKeys, eventKey) {
  return selectedKeys.indexOf(eventKey) !== -1;
}

function handleTreeData(data, targetKeys = []) {
  data.forEach(item => {
    item['disabled'] = targetKeys.includes(item.key);
    if (item.children) {
      handleTreeData(item.children, targetKeys);
    }
  });
  return data;
}

export default {
  props:['currentItem'],
  data(){
    return{
      activeKey:'',
      activeKey:'icpList',
      ICPYear:2020,
      yearList:[2020,2021,2022],
      parentCode:'',
      targetKeys: [],
      // dataSource: transferDataSource,
      treeData:[],
      treeLoading:false,
      treeDimensions:{children:'children', title:'Desc', key:'Code' },
    }
  },
  computed:{
    dataSource(){
      let transferDataSource = [];
      function flatten(list = []) {
        list.map(item => {
          item.disabled = false
          transferDataSource.push(item);
          flatten(item.children);
        });
      }
      flatten(JSON.parse(JSON.stringify(this.treeData)));
      return transferDataSource
    }
  },
  mounted(){
    this.activeKey = this.currentItem.select
    this.targetKeys = this.currentItem.text.split(',')
    if(this.currentItem.treeData&&this.currentItem.treeData.length){
      this.treeData = this.currentItem.treeData
    }else{
      this.getTreeData()
    }
  },
  methods:{
    printData(){
      console.log(this.activeKey,this.targetKeys)
      return {
        targetKeys:this.targetKeys,
        activeKey:this.activeKey,
        treeData:this.treeData
      }
    },
    modelTabChange(key){
      if(this.treeLoading) return
      this.activeKey = key
      this.treeData = []
      this.targetKeys = []
      this.getTreeData()
    },
    getTreeData(){
      let url = {}
      let params = {}
      this.treeData = []
      this.targetKeys = []
      // fenlei:[{code:'icpList',name:'IPC(国际分类)'},{code:'cpcList',name:'CPC(合作专利分类)'},{code:'industrycn',name:'国民经济行业分类'},{code:'stratregicIndustry',name:'战略性新兴产业分类'}],
      switch(this.activeKey){
        case 'icpList':
          url = GetIpcClass
          params = {
            year:this.ICPYear,
            parentCode:this.parentCode
          }
          this.treeDimensions = {children:'children', title:'Desc', key:'Code' }
        break;
        case 'cpcList':
          url = GetCpcClass
          params = {
            parentCode:this.parentCode
          }
          this.treeDimensions = {children:'children', title:'Desc', key:'Code' }
        break;
        case 'industrycn':
          url = GetStraindustryTree
          this.treeDimensions = {children:'children', title:'lable', key:'value' }
        break;
        case 'stratregicIndustry':
          url = GetEcoindustryTree
          this.treeDimensions = {children:'children', title:'lable', key:'value' }
        break;
      }
      this.treeLoading = true
      url(params).then(res=>{
        this.treeData = this.formatTreeData(res.Data)
        this.treeLoading = false
      })
    },
    //统一格式 key title
    formatTreeData(listData){
      let tempList = []
      let that = this
      function flatten(list = []) {
        list.forEach(item => {
          item.title = that.activeKey==='cpcList'||(that.activeKey==='icpList'&&item.ParentCode)? item.Code +" "+ item[that.treeDimensions.title]:item[that.treeDimensions.title] 
           
          item.key = item[that.treeDimensions.key]
          flatten(item.children);
        });
      }
      tempList = JSON.parse(JSON.stringify(listData))
      flatten(tempList);
      return tempList
    },
    transferChange(targetKeys) {
      this.targetKeys = targetKeys;
      handleTreeData(this.treeData,targetKeys)
    },
    onChecked(_, e, checkedKeys, itemSelect) {
      const { eventKey } = e.node;
      itemSelect(eventKey, !isChecked(checkedKeys, eventKey));
    },
    onLoadData(treeNode) {
      return new Promise(resolve => {
        if (treeNode.dataRef.children) {
          resolve();
          return;
        }
        setTimeout(() => {
          let url = GetIpcClass
          if(this.activeKey == 'cpcList'){
            url = GetCpcClass
          }
          url({
            year:this.activeKey == 'icpList'?this.ICPYear:undefined,
            parentCode:treeNode.dataRef.key
          }).then(res=>{
            treeNode.dataRef.children = this.formatTreeData(res.Data)
            this.treeData = [...this.treeData];
            resolve();
          })
        }, 1000);
      });
    },
  }
}
</script>

<style>

</style>

 src/css/common.less

@@ -57,4 +57,27 @@
  overflow: hidden; 
  text-overflow:ellipsis;
  white-space:nowrap
}

.flex{
  display: flex;
}
.justify-between{
  justify-content: space-between;
}
.item-center{
  align-items: center;
}


@place-color:hsv(0, 0, 75%);

input::-webkit-input-placeholder {
  color: @place-color;
}
input::-moz-input-placeholder {
color: @place-color;
}
input::-ms-input-placeholder {
color: @place-color;
}

 src/router/index.js

@@ -106,7 +106,7 @@
        // component:HomeView
      },
      {
        path: '/detail',
        path: '/detail/:id',
        name: 'detail',
        // route level code-splitting
        // this generates a separate chunk (about.[hash].js) for this route

 src/views/BatchView.vue

@@ -23,12 +23,12 @@
      </section>
      <section class="right">
        <!-- <div class="title">批量检索</div> -->
        <a-tabs class="tab" default-active-key="1" @change="callback">
          <a-tab-pane key="1" tab="公开号">
            <textarea name="" id="" cols="30" rows="10" placeholder="系统将根据公开号列表返回所有匹配的专利信息，单次输入公开号上限是5000"></textarea>
        <a-tabs class="tab" default-active-key="publicationNumber" @change="callback">
          <a-tab-pane key="publicationNumber" tab="公开号">
            <a-textarea v-model="searchParams.publicationNumber" cols="30" rows="6" placeholder="系统将根据公开号列表返回所有匹配的专利信息，单次输入公开号上限是5000"></a-textarea>
          </a-tab-pane>
          <a-tab-pane key="2" tab="申请号" force-render>
            <textarea name="" id="" cols="30" rows="10" placeholder="系统将根据申请号列表返回所有匹配的专利信息，单次输入申请号上限是5000"></textarea>
          <a-tab-pane key="applicationNumber" tab="申请号" force-render>
            <a-textarea v-model="searchParams.applicationNumber" cols="30" rows="6" placeholder="系统将根据申请号列表返回所有匹配的专利信息，单次输入申请号上限是5000"></a-textarea>
          </a-tab-pane>
          <!-- <a-tab-pane key="3" tab="优先权号">
            <textarea name="" id="" cols="30" rows="10"></textarea>
@@ -36,8 +36,8 @@
          <!-- <a-tab-pane key="4" tab="所有号码">
            <textarea name="" id="" cols="30" rows="10"></textarea>
          </a-tab-pane> -->
          <a-tab-pane key="5" tab="申请人">
            <textarea name="" id="" cols="30" rows="10" placeholder="系统将根据申请人列表返回所有匹配的专利信息，单次输入申请人上限是200"></textarea>
          <a-tab-pane key="assigneeHarmonizedName" tab="申请人">
            <a-textarea v-model="searchParams.assigneeHarmonizedName" cols="30" rows="6" placeholder="系统将根据申请人列表返回所有匹配的专利信息，单次输入申请人上限是200"></a-textarea>
          </a-tab-pane>
        </a-tabs>
        <ul>
@@ -48,9 +48,9 @@
            <div>上传TXT</div> -->
          </li>
          <li>
            <div>清除</div>
            <div>查看匹配结果</div>
            <div>检索</div>
            <div @click="clear">清除</div>
            <!-- <div>查看匹配结果</div> -->
            <div @click="handleSearch">检索</div>
          </li>
        </ul>
      </section>
@@ -69,33 +69,46 @@
    //这里存放数据
    return {
      ScrollHeight: document.documentElement.scrollTop,
      currentTab:'publicationNumber',
      searchParams:{
        publicationNumber:'',
        applicationNumber:'',
        assigneeHarmonizedName:''
      }
    };
  },
  //计算属性 类似于data概念
  computed: {},
  //监控data中的数据变化
  watch: {
    ScrollHeight() {},
  },
  //方法集合
  methods: {
    quit(){
     this.confirm()
    },
    confirm() {
      this.$confirm({
        title: '退出登录',
        content: '是否确认退出当前系统？',
        okText: '确认',
        cancelText: '取消',
      });
    },
    handleScroll() {
      this.ScrollHeight = document.documentElement.scrollTop;
    },
    callback(key) {
      console.log(key);
      this.currentTab = key
    },
    clear(){

      this.searchParams[this.currentTab] = ''
    },
    handleSearch(){
      if(this.searchParams[this.currentTab]==''){
        this.$message.warning('输入内容不能为空');
        return
      }
      let params = {
        keywordField:this.currentTab,
        content:this.searchParams[this.currentTab]
      }
      this.$router.push({
        path:"/smart",
        query:{
          from:'batch',
          params:JSON.stringify(params)
        }
      })
    }
  },
  beforeCreate() {}, //生命周期 - 创建之前
  //生命周期 - 创建完成(可以访问当前this实例)
@@ -103,7 +116,6 @@
  beforeMount() {}, //生命周期 - 挂载之前
  //生命周期 - 挂载完成(可以访问DOM元素)
  mounted() {
    window.addEventListener("scroll", this.handleScroll);
  },
  beforeUpdate() {}, //生命周期 - 更新之前
  updated() {}, //生命周期 - 更新之后
@@ -387,6 +399,7 @@
      li {
        display: flex;
        justify-content: space-between;
        cursor: pointer;
        div {
          padding: 0 10px;
          margin: 0 5px;

 src/views/DetailView.vue

@@ -25,12 +25,17 @@
    </a-layout-sider>
    <a-layout style="padding: 0 24px 24px;height: calc(100vh - 62px) ;overflow: auto;">
      <div class="mian-title">
        <span>{{basicInfo.publicationNumber}}</span>
        <b>{{basicInfo.title1}}</b>
        <a-tag v-if="basicInfo.status == 'expired'" color="#f50">
          失效
        </a-tag>
        <a-tag v-else color="green"> 有效 </a-tag>
        <div>
          <span>{{basicInfo.publicationNumber}}</span>
          <b>{{basicInfo.title0||basicInfo.title1}}</b>
          <a-tag v-if="basicInfo.status == 'expired'" color="#f50">
            失效
          </a-tag>
          <a-tag v-else color="green"> 有效 </a-tag>
        </div>
        <!-- <a-button type="link" icon="download">
          导出
        </a-button> -->
      </div>
      <a-layout-content
        style="
@@ -41,9 +46,9 @@
          min-height: 80vh;
        "
      >
        <basic-vue v-if="currentTab[0] == '1'" />
        <zhuanli-vue v-if="currentTab[0] == '2'" />
        <falv-vue v-if="currentTab[0] == '3'" />
        <basic-vue v-if="currentTab[0] == '1'" :basicInfo="basicInfo"/>
        <zhuanli-vue v-if="currentTab[0] == '2'" :basicInfo="basicInfo"/>
        <falv-vue v-if="currentTab[0] == '3'" :basicInfo="basicInfo"/>
      </a-layout-content>
    </a-layout>
  </a-layout>
@@ -55,6 +60,7 @@
import BasicVue from './detailCompos/Basic.vue';
import ZhuanliVue from './detailCompos/Zhuanli.vue';
import FalvVue from './detailCompos/Falv.vue';
import { GetPatentListbyId } from '../api/url_analyst'
export default {
  //import引入的组件需要注入到components对象中才能使用
  components: {
@@ -73,15 +79,28 @@
  computed: {},
  //方法集合
  mounted() {
    this.basicInfo = JSON.parse(localStorage.getItem('searchItem'))
    // this.basicInfo = JSON.parse(localStorage.getItem('searchItem'))
    this.getBasicInfo()
  },
  methods: {},
  methods: {
    getBasicInfo(){
      console.log(this.$route)
      
      GetPatentListbyId({
        id:this.$route.params.id
      }).then(res=>{
        this.basicInfo = res.Data
      })
    }
  },
};
</script>
<style lang="less" scoped>
.mian-title{
  line-height: 30px;
  padding: 10px 0;
  display: flex;
  justify-content: space-between;
  b{
    margin: 0 10px;
    font-size: 16px;

 src/views/HomeView.vue

@@ -169,7 +169,7 @@
      ScrollHeight: document.documentElement.scrollTop,
      footerheight: 0,
      footerheightTwo: 0,
      keyWord:''
      keyWord:'',
    };
  },
  //计算属性 类似于data概念
@@ -215,7 +215,16 @@
        return
      }
      if(this.keyWord){
        this.$router.push('/smart?keyWord='+this.keyWord)
        let params = {
          keyWord:this.keyWord
        }
        this.$router.push({
          path:"/smart",
          query:{
            from:'home',
            params:JSON.stringify(params)
          }
        })
      }else{
        this.$message.warning('请输入非空的关键词进行智能检索!')
      }

 src/views/SeniorView.vue

@@ -28,12 +28,12 @@
              <div class="seclect">
                <div v-for="(item,index) in form.keyWords">
                  <a-select v-model="item.select" style="width: 20%" @change="item.text=''">
                    <a-select-option v-for="(it) in options.keyWords" :key="it" :value="it" :title="it">
                      {{it}}
                    <a-select-option v-for="(it) in options.keyWords" :key="it.code" :value="it.code">
                      {{it.name}}
                    </a-select-option>
                  </a-select>
                  <a-input
                    style="width: 56%"
                    style="width: 50%"
                    v-model="item.text"
                    placeholder="请输入"
                  />
@@ -47,12 +47,12 @@
              <div class="seclect">
                <div v-for="(item,index) in form.name">
                  <a-select v-model="item.select" style="width: 20%" @change="item.text=''">
                    <a-select-option v-for="(it) in options.name" :key="it" :value="it">
                      {{it}}
                    <a-select-option v-for="(it) in options.name" :key="it.code" :value="it.code">
                      {{it.name}}
                    </a-select-option>
                  </a-select>
                  <a-input
                    style="width: 56%"
                    style="width: 50%"
                    v-model="item.text"
                    placeholder="请输入"
                  />
@@ -66,12 +66,12 @@
              <div class="seclect">
                <div v-for="(item,index) in form.address">
                  <a-select v-model="item.select" style="width: 20%" @change="item.text=''">
                    <a-select-option v-for="(it) in options.address" :key="it" :value="it">
                      {{it}}
                    <a-select-option v-for="(it) in options.address" :key="it.code" :value="it.code">
                      {{it.name}}
                    </a-select-option>
                  </a-select>
                  <a-input
                    style="width: 56%"
                    style="width: 50%"
                    v-model="item.text"
                    placeholder="例如：北京"
                  />
@@ -84,19 +84,19 @@
              <span>分类号</span>
              <div class="seclect">
                <div v-for="(item,index) in form.fenlei">
                  <a-select v-model="item.select" style="width: 20%" @change="item.text=''">
                    <a-select-option v-for="(it) in options.fenlei" :key="it" :value="it">
                      {{it}}
                  <a-select v-model="item.select" style="width: 20%" @change="item.text='';item.treeData=[]">
                    <a-select-option v-for="(it) in options.fenlei" :key="it.code" :value="it.code">
                      {{it.name}}
                    </a-select-option>
                  </a-select>
                  <a-input
                    style="width: 56%"
                    style="width: 50%"
                    v-model="item.text"
                    placeholder="请输入"
                  />
                  <a-button type="primary" v-if="index == (form.fenlei.length-1)&&form.fenlei.length<3" shape="circle" icon="plus" @click="doFormItem('plus','fenlei',index)"/>
                  <a-button type="danger" v-else shape="circle" icon="minus" @click="doFormItem('minus','fenlei',index)"/>
                  <a-button @click="openTool">查询工具</a-button>
                  <a-button @click="openTool(item)">查询工具</a-button>
                </div>
              </div>
            </li>
@@ -105,12 +105,12 @@
              <div class="seclect">
                <div v-for="(item,index) in form.haoma">
                  <a-select v-model="item.select" style="width: 20%" @change="item.text=''">
                    <a-select-option v-for="(it) in options.haoma" :key="it" :value="it">
                      {{it}}
                    <a-select-option v-for="(it) in options.haoma" :key="it.code" :value="it.code">
                      {{it.name}}
                    </a-select-option>
                  </a-select>
                  <a-input
                    style="width: 56%"
                    style="width: 50%"
                    v-model="item.text"
                    placeholder="请输入"
                  />
@@ -121,12 +121,12 @@
              <span>日期</span>
              <div class="seclect">
                <div v-for="(item,index) in form.date">
                  <a-select v-model="item.select" style="width: 20%" @change="item.text='';item.type=''">
                    <a-select-option v-for="(it) in options.date" :key="it" :value="it">
                      {{it}}
                  <a-select v-model="item.select" style="width: 20%" @change="item.text='';item.type='before'">
                    <a-select-option v-for="(it) in options.date" :key="it.code" :value="it.code">
                      {{it.name}}
                    </a-select-option>
                  </a-select>
                  <a-select v-model="item.type" style="width: 16%" @change="item.text=''">
                  <a-select v-model="item.type" style="width: 16%" @change=" item.type=='range'? item.text=[]:item.text=''">
                    <a-select-option :value="'before'">
                      某时间以前
                    </a-select-option>
@@ -138,114 +138,28 @@
                    </a-select-option>
                  </a-select>
                  <a-range-picker 
                    v-model="item.text"
                    v-if="item.type === 'range'"
                    valueFormat="YYYY-MM-DD"
                  />
                  <a-date-picker v-else />
                  <a-date-picker v-model="item.text" valueFormat="YYYY-MM-DD" v-else />
                </div>
              </div>
            </li>
          </ul>
          <div class="footer" style="margin-top:60px;text-align: right;padding-right: 20%;">
            <a-button type="primary"> 查询 </a-button>
            <a-button type="primary" @click="handleSearch"> 查询 </a-button>
          </div>
        </div>
        <!-- <div class="bottom">
          <div class="searchRole searchManner">
            <span>检索规则</span>
            <div class="right_role">
              <ul>
                <li>&&</li>
                <li>AND</li>
                <li>OR</li>
                <li>NOT</li>
                <li>(W)</li>
                <li>(N)</li>
                <li>(</li>
                <li>)</li>
                <li>?</li>
                <li>$</li>
                <li>*</li>
              </ul>
              <div class="auxiliary">辅助查询工具</div>
            </div>
          </div>
          <div class="directives searchManner">
            <span>指令检索</span>
            <div class="right_dir">
              <textarea
                name=""
                id=""
                cols="30"
                rows="10"
                placeholder="1111"
              ></textarea>
              <ul>
                <li>当前页检索</li>
                <li>执行多检索式</li>
                <li>清除</li>
                <li>检索</li>
              </ul>
            </div>
          </div>
        </div> -->
      </section>
    </main>

    <!-- 弹框部分 -->
    <a-modal v-model="dialogVisible" title="辅助查询工具" width="1000px" okText="确定" cancelText="取消" @ok="modelConfirm">
      <a-tabs :activeKey="activeKey" @change="modelTabChange">
        <a-tab-pane key="1" tab="IPC分类">
          <a-select v-model="ICPYear" style="width: 120px;margin-bottom:20px" @change="getTreeData">
            <a-select-option v-for="item in yearList" :key="item" :value="item">
              {{item}}版
            </a-select-option>
          </a-select>
        </a-tab-pane>
        <a-tab-pane key="2" tab="CPC分类">
        </a-tab-pane>
        <a-tab-pane key="3" tab="新兴产业分类">
        </a-tab-pane>
        <a-tab-pane key="4" tab="GBC分类">
        </a-tab-pane>
      </a-tabs>
      <a-spin :spinning="treeLoading">
      <a-transfer
        class="tree-transfer"
        :data-source="dataSource"
        :target-keys="targetKeys"
        :render="item => item.title"
        :show-select-all="false"
        @change="transferChange"
      >
        <template
          slot="children"
          slot-scope="{ props: { direction, selectedKeys }, on: { itemSelect } }"
        >
          
            <a-tree
              v-if="direction === 'left'"
              blockNode
              checkable
              checkStrictly
              defaultExpandAll
              :checkedKeys="[...selectedKeys, ...targetKeys]"
              :treeData="treeData"
              :load-data="onLoadData"
              style="height:300px;overflow:auto"
              @check="
                (_, props) => {
                  onChecked(_, props, [...selectedKeys, ...targetKeys], itemSelect);
                }
              "
              @select="
                (_, props) => {
                  onChecked(_, props, [...selectedKeys, ...targetKeys], itemSelect);
                }
              "
            />
        </template>
      </a-transfer>
      </a-spin>
      <senior-tranfer 
      ref="seniorTransfer"
      :currentItem="currentFenleiItem"
      v-if="dialogVisible" />
    </a-modal>
  </div>
</template>
@@ -253,104 +167,71 @@
<script>
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
//例如：import 《组件名称》 from '《组件路径》';
import { GetIpcClass , GetCpcClass , GetStraindustryTree ,GetEcoindustryTree} from '@/api/url_analyst'
import SeniorTranfer from '@/components/SeniorTranfer.vue';

function isChecked(selectedKeys, eventKey) {
  return selectedKeys.indexOf(eventKey) !== -1;
const options = {
  keyWords:[{code:'title0|abstract0',name:'标题/摘要'},{code:'title0|abstract0|claim0',name:'标题/摘要/权利要求'},{code:'title0|abstract0|claim0|description0',name:'标题/摘要/权利要求/说明书'},{code:'title0',name:'标题'},{code:'abstract0',name:'摘要'},{code:'claim0',name:'权利要求'},{code:'description0',name:'说明书'}],
  name:[{code:'assigneeHarmonizedName',name:'申请人'},{code:'inventorHarmonizedName',name:"发明人"}],
  address:[{code:'address',name:'申请人地址'},{code:'province',name:'中国申请人省'},{code:'city',name:'中国申请人地市'},{code:'county',name:'中国申请人区县'},{code:'assigneeCrossCountryCount',name:'申请人国别'},{code:'country',name:'公开国别'}],
  fenlei:[{code:'icpList',name:'IPC(国际分类)'},{code:'cpcList',name:'CPC(合作专利分类)'},{code:'industrycn',name:'国民经济行业分类'},{code:'stratregicIndustry',name:'战略性新兴产业分类'}],
  haoma:[{code:'applicationNumber',name:'申请号'}],
  // {code:'',name:'优先权号'}
  date:[{code:'publicationDate',name:'公开日'},{code:'system',name:'申请日'},{code:'grantDate',name:'授权日'},{code:'priorityDate',name:'优先权日'}]
}

function handleTreeData(data, targetKeys = []) {
  data.forEach(item => {
    item['disabled'] = targetKeys.includes(item.key);
    if (item.children) {
      handleTreeData(item.children, targetKeys);
    }
  });
  return data;
}


export default {
  //import引入的组件需要注入到components对象中才能使用
  components: {},
  components: {SeniorTranfer},
  data() {
    //这里存放数据
    return {
      ScrollHeight: document.documentElement.scrollTop,
      options: {
        keyWords: ['标题/摘要','标题/摘要/权利要求','标题/摘要/权利要求/说明书','标题','摘要','权利要求','说明书'],
        name: ['申请人','发明人'],
        address: ['申请人地址','中国申请人省','中国申请人地市','中国申请人区县','申请人国别','公开国别'],
        fenlei: ['IPC(国际分类)','CPC(合作专利分类)','国民经济行业分类','战略性新兴产业分类'],
        haoma: ['申请号','优先权号'],
        date: ['公开日','申请日','授权日','优先权日'],
      },
      options,
      form:{
        keyWords:[
          {
            select:'标题/摘要',
            select:'title0|abstract0',
            text:''
          }
        ],
        name:[
          {
            select:'申请人',
            select:'assigneeHarmonizedName',
            text:''
          }
        ],
        address:[
          {
            select:'申请人地址',
            select:'address',
            text:''
          }
        ],
        fenlei:[
          {
            select:'IPC(国际分类)',
            select:'icpList',
            text:''
          }
        ],
        haoma:[
          {
            select:'申请号',
            select:'applicationNumber',
            text:''
          }
        ],
        date:[
          {
            select:'公开日',
            select:'publicationDate',
            text:'',
            type:'',
            type:'before',
          }
        ],
      },
      
      dialogVisible:false,
      activeKey:'1',
      ICPYear:2020,
      yearList:[2020,2021,2022],
      parentCode:'',
      targetKeys: [],
      // dataSource: transferDataSource,
      treeData:[],
      treeLoading:false,
      treeDimensions:{children:'children', title:'Desc', key:'Code' }
      currentFenleiItem:{}
    };
  },
  //计算属性 类似于data概念
  computed:{
    dataSource(){
      let transferDataSource = [];
      function flatten(list = []) {
        list.forEach(item => {
          transferDataSource.push(item);
          flatten(item.children);
        });
      }
      flatten(JSON.parse(JSON.stringify(this.treeData)));
      return transferDataSource
    }
  },
  //监控data中的数据变化
  watch: {
    ScrollHeight() {},
@@ -367,7 +248,6 @@
      console.log("click", e);
    },
    getCurrentStyle(current, today) {
      console.log(today);
      const style = {};
      if (current.date() === 1) {
        style.border = "1px solid #1890ff";
@@ -381,105 +261,64 @@
      this.ScrollHeight = document.documentElement.scrollTop;
    },
    modelConfirm(){
      console.log(this.targetKeys,this.dataSource)
      let item = this.$refs.seniorTransfer.printData()
      this.currentFenleiItem.text = item.targetKeys.join(',')
      this.currentFenleiItem.select = item.activeKey
      this.currentFenleiItem.treeData = item.treeData
      this.dialogVisible = false
    },
    openTool(){
    openTool(item){
      this.targetKeys = item.text.split(',')
      this.dialogVisible = true
      console.log()
      this.getTreeData()
      this.currentFenleiItem = item
    },
    handleSearch(){
      let params = this.getParams()
      if(params.length == 0){
        this.$message.error('请输入筛选条件')
        return
      }
      this.$router.push({
          path:"/smart",
          query:{
            from:'senior',
            params:JSON.stringify(params)
          }
        })
      console.log(params)
    },
    getParams(){
      let params = []
      let keyArry = Object.keys(this.form)
      keyArry.map(key=>{
        let arry = this.form[key]
        arry.map(item=>{
          if(item.text){
            let obj = {
              field: item.select,
              childFieldLevel: 0,
              rule: key=="date"?'range':item.select.indexOf('|')<0? "like":'or',
              val: item.text,
            }
            if(key == 'date'){
              obj.val = ''
              obj.start = item.type=='after'?item.text:item.type=='range'?item.text[0]:''
              obj.end = item.type=='before'?item.text:item.type=='range'?item.text[1]:''
            }
            params.push(obj)
          }
        })
      })
      return params
    },
    doFormItem(type,key,index){
      if(type === 'plus'){
        this.form[key].push({select:this.options[key][0],text:''})
        this.form[key].push({select:this.options[key][0].code,text:''})
      }else{
        this.form[key].splice(index,1);
      }
    }, 
    modelTabChange(key){
      if(this.treeLoading) return
      this.activeKey = key
      this.getTreeData()
    },
    getTreeData(){
      let url = {}
      let params = {}
      this.treeData = []
      switch(this.activeKey){
        case '1':
          url = GetIpcClass
          params = {
            year:this.ICPYear,
            parentCode:this.parentCode
          }
          this.treeDimensions = {children:'children', title:'Desc', key:'Code' }
        break;
        case '2':
          url = GetCpcClass
          params = {
            parentCode:this.parentCode
          }
          this.treeDimensions = {children:'children', title:'Desc', key:'Code' }
        break;
        case '3':
          url = GetStraindustryTree
          this.treeDimensions = {children:'children', title:'lable', key:'value' }
        break;
        case '4':
          url = GetEcoindustryTree
          this.treeDimensions = {children:'children', title:'lable', key:'value' }
        break;
      }
      this.treeLoading = true
      url(params).then(res=>{
        this.treeData = this.formatTreeData(res.Data)
        this.treeLoading = false
      })
    },
    //统一格式 key title
    formatTreeData(listData){
      let tempList = []
      let that = this
      function flatten(list = []) {
        list.forEach(item => {
          item.title = that.activeKey==='2'? item.Code +" "+ item[that.treeDimensions.title]:item[that.treeDimensions.title] 
          item.key = item[that.treeDimensions.key]
          flatten(item.children);
        });
      }
      tempList = JSON.parse(JSON.stringify(listData))
      flatten(tempList);
      return tempList
    },
    transferChange(targetKeys) {
      this.targetKeys = targetKeys;
      handleTreeData(this.treeData,targetKeys)
    },
    onChecked(_, e, checkedKeys, itemSelect) {
      const { eventKey } = e.node;
      itemSelect(eventKey, !isChecked(checkedKeys, eventKey));
    },
    onLoadData(treeNode) {
      return new Promise(resolve => {
        if (treeNode.dataRef.children) {
          resolve();
          return;
        }
        setTimeout(() => {
          let url = GetIpcClass
          if(this.activeKey == '2'){
            url = GetCpcClass
          }
          url({
            year:this.activeKey == '1'?this.ICPYear:undefined,
            parentCode:treeNode.dataRef.key
          }).then(res=>{
            treeNode.dataRef.children = this.formatTreeData(res.Data)
            this.treeData = [...this.treeData];
            resolve();
          })
        }, 1000);
      });
    },
    
  },
};
</script>

 src/views/SmartView.vue

@@ -3,122 +3,174 @@
  <div class="search">
    <main>
      <section class="left">
        <div class="left_search">
        <!-- <div class="left_search">
          <a-input-search
            v-model="keyWord"
            placeholder="关键词、公司名等"
            allowClear
            size="large"
            enter-button
            @search="getPageList"
            @search="reloadPageList"
          />
        </div>
        </div> -->
        <div style="padding:20px 25px">
          <ul class="condition-box" v-if="conditionAnd.length">
            <li v-for="(item,index) in conditionAnd" :key="index">
              <span :class="item.rule">{{item.rule=='in'?'筛选':"过滤"}}</span>
              <span class="label" :title="item.name">{{item.name}}:</span>
              <span class="list" >
                <template v-for="it in item.checkedList">
                  {{it.text||it.code}} 
                </template>
              </span>
              <a-icon type="close" @click="conditionRemove(index,item)"/>
            </li>
          </ul>
          <a-collapse default-active-key="1" :expand-icon-position="'right'" >
            <template #expandIcon="props">
              <a-icon type="caret-right" :rotate="props.isActive ? 90 : 0" />
            </template>
            <a-collapse-panel key="1" header="受理局">
              <a-checkbox-group style="width:100%">
                <ul class="option-list" v-if="leftOptions.countryCodeAgg">
                  <li v-for="item in leftOptions.countryCodeAgg" v-if="item.value!=='0'">
                    <a-checkbox :value="item.code">{{item.text}}</a-checkbox>
                    <span>{{item.value}}</span>
              <a-checkbox-group v-model="checkedOption.countryCodeCount" v-if="leftOptions.countryCodeCount"  style="width:100%">
                <ul class="option-list" v-if="leftOptions.countryCodeCount">
                  <li v-for="item in leftOptions.countryCodeCount" v-if="item.value!=='0'">
                    <a-checkbox :checked="item.checked" :disabled="item.disabled" :value="item.code" @change="checkChange(item)">
                      <img :src="require('../assets/nation_flags/'+item.code+'.png')" alt="" style="width:20px;margin-right:10px"/>{{item.text}}
                    </a-checkbox>
                    <span>{{item.count}}</span>
                  </li>
                </ul>
                <p class="option-btn" v-if="leftOptions.countryCodeCount&&leftOptions.countryCodeCount.length">
                  <a-button @click="handleCondition('in','countryCode','国家')">筛选</a-button>
                  <a-button @click="handleCondition('not in','countryCode','国家')">过滤</a-button>
                </p>
              </a-checkbox-group>
            </a-collapse-panel>
            <a-collapse-panel key="2" header="申请日">
              <a-checkbox-group style="width:100%">
              <a-checkbox-group v-model="checkedOption.systemCount" style="width:100%">
                <ul class="option-list" v-if="leftOptions.systemCount">
                  <li v-for="item in leftOptions.systemCount" v-if="item.count!=='0'">
                    <a-checkbox :value="item.code">{{item.code}}</a-checkbox>
                    <a-checkbox :value="item.code" :checked="item.checked" :disabled="item.disabled" @change="checkChange(item)">{{item.code}}</a-checkbox>
                    <span>{{item.count}}</span>
                  </li>
                </ul>
                <p class="option-btn">
                  <a-button @click="handleCondition('range','system','申请日')">筛选</a-button>
                  <a-button @click="handleCondition('not range','system','申请日')">过滤</a-button>
                </p>
              </a-checkbox-group>
            </a-collapse-panel>
            <a-collapse-panel key="3" header="公开日">
              <a-checkbox-group style="width:100%">
              <a-checkbox-group v-model="checkedOption.publicationDateCount" style="width:100%">
                <ul class="option-list" v-if="leftOptions.publicationDateCount">
                  <li v-for="item in leftOptions.publicationDateCount" v-if="item.count!=='0'">
                    <a-checkbox :value="item.code">{{item.code}}</a-checkbox>
                    <a-checkbox :value="item.code" :checked="item.checked" :disabled="item.disabled" @change="checkChange(item)">{{item.code}}</a-checkbox>
                    <span>{{item.count}}</span>
                  </li>
                </ul>
                <p class="option-btn">
                  <a-button @click="handleCondition('range','publicationDate','公开日')">筛选</a-button>
                  <a-button @click="handleCondition('not range','publicationDate','公开日')">过滤</a-button>
                </p>
              </a-checkbox-group>
            </a-collapse-panel>
            <a-collapse-panel key="4" header="IPC分类">
              <a-checkbox-group style="width:100%">
              <a-checkbox-group v-model="checkedOption.ipcListCount" style="width:100%">
                <ul class="option-list" v-if="leftOptions.ipcListCount">
                  <li v-for="item in leftOptions.ipcListCount" v-if="item.count!=='0'">
                    <a-checkbox :value="item.code">{{item.text}}</a-checkbox>
                    <a-checkbox :value="item.code" :checked="item.checked" :disabled="item.disabled" @change="checkChange(item)">{{item.text}}</a-checkbox>
                    <span>{{item.count}}</span>
                  </li>
                </ul>
                <p class="option-btn">
                  <a-button @click="handleCondition('in','ipcList','IPC分类')">筛选</a-button>
                  <a-button @click="handleCondition('not in','ipcList','IPC分类')">过滤</a-button>
                </p>
              </a-checkbox-group>
            </a-collapse-panel>
            <a-collapse-panel key="5" header="法律状态">
              <a-checkbox-group v-model="checkedOption.lawStatusCount" style="width:100%">
                <ul class="option-list" v-if="leftOptions.lawStatusCount">
                  <li v-for="item in leftOptions.lawStatusCount" v-if="item.count!=='0'">
                    <a-checkbox :value="item.code" :checked="item.checked" :disabled="item.disabled" @change="checkChange(item)">{{item.text}}</a-checkbox>
                    <span>{{item.count}}</span>
                  </li>
                </ul>
                <p class="option-btn">
                  <a-button @click="handleCondition('in','lawStatus','法律状态')">筛选</a-button>
                  <a-button @click="handleCondition('not in','lawStatus','法律状态')">过滤</a-button>
                </p>
              </a-checkbox-group>
            </a-collapse-panel>
            <a-collapse-panel key="6" header="申请人">
              <a-checkbox-group v-model="checkedOption.assigneeHarmonizedCount" style="width:100%">
                <ul class="option-list" v-if="leftOptions.assigneeHarmonizedCount">
                  <li v-for="item in leftOptions.assigneeHarmonizedCount" v-if="item.count!=='0'">
                    <a-checkbox :value="item.code||item.text" :checked="item.checked" :disabled="item.disabled" @change="checkChange(item)">{{item.text}}</a-checkbox>
                    <span>{{item.count}}</span>
                  </li>
                </ul>
                <p class="option-btn">
                  <a-button @click="handleCondition('in','assigneeHarmonized','申请人')">筛选</a-button>
                  <a-button @click="handleCondition('not in','assigneeHarmonized','申请人')">过滤</a-button>
                </p>
              </a-checkbox-group>
            </a-collapse-panel>
            <a-collapse-panel key="7" header="发明人">
              <a-checkbox-group v-model="checkedOption.inventorHarmonizedCount" style="width:100%">
                <ul class="option-list" v-if="leftOptions.inventorHarmonizedCount">
                  <li v-for="item in leftOptions.inventorHarmonizedCount" v-if="item.count!=='0'">
                    <a-checkbox :value="item.code||item.text" :checked="item.checked" :disabled="item.disabled" @change="checkChange(item)">{{item.text}}</a-checkbox>
                    <span>{{item.count}}</span>
                  </li>
                </ul>
                <p class="option-btn">
                  <a-button @click="handleCondition('in','inventorHarmonized','发明人')">筛选</a-button>
                  <a-button @click="handleCondition('not in','inventorHarmonized','发明人')">过滤</a-button>
                </p>
              </a-checkbox-group>
            </a-collapse-panel>
            <a-collapse-panel key="8" header="战略新兴产业分类">
              <a-checkbox-group v-model="checkedOption.strategyIndustryCount" style="width:100%">
                <ul class="option-list" v-if="leftOptions.strategyIndustryCount">
                  <li v-for="item in leftOptions.strategyIndustryCount" v-if="item.count!=='0'">
                    <a-checkbox :value="item.code" :checked="item.checked" :disabled="item.disabled" @change="checkChange(item)">{{item.text}}</a-checkbox>
                    <span>{{item.count}}</span>
                  </li>
                </ul>
                <p class="option-btn">
                  <a-button @click="handleCondition('in','strategyIndustry','战略新兴产业分类')">筛选</a-button>
                  <a-button @click="handleCondition('not in','strategyIndustry','战略新兴产业分类')">过滤</a-button>
                </p>
              </a-checkbox-group>
            </a-collapse-panel>
            <a-collapse-panel key="9" header="国民经济行业分类">
              <a-checkbox-group v-model="checkedOption.economyIndustryCount" style="width:100%">
                <ul class="option-list" v-if="leftOptions.economyIndustryCount">
                  <li v-for="item in leftOptions.economyIndustryCount" v-if="item.count!=='0'">
                    <a-checkbox :value="item.code" :checked="item.checked" :disabled="item.disabled" @change="checkChange(item)">{{item.text}}</a-checkbox>
                    <span>{{item.count}}</span>
                  </li>
                </ul>
                <p class="option-btn">
                  <a-button @click="handleCondition('in','economyIndustry','国民经济行业分类')">筛选</a-button>
                  <a-button @click="handleCondition('not in','economyIndustry','国民经济行业分类')">过滤</a-button>
                </p>
              </a-checkbox-group>
            </a-collapse-panel>
          </a-collapse>
        </div>
        <!-- <div class="siftDialog" v-show="siftDialog">
          <div>已添加关键词（{{ num }}）</div>
          <span>{{ num }} AND{{ num }} </span>
          <div>已筛选</div>
          <span>国家{{ num }}</span>
          <div>已排除{{ num }}</div>
          <span>国家{{ num }}</span>
        </div> -->
        <!-- <div class="allPatent">
          <a-checkbox
            @change="onChangeAllPatent"
            :indeterminate="indeterminatePatent"
            :checked="checkAllPatent"
            >全部专利</a-checkbox
          >
          <div class="addKey">添加关键字</div>
        </div> -->
        
        <!-- <div
          class="countryList"
          v-for="item in CountryPatentList"
          :key="item.id"
        >
          <a-checkbox
            style="width: 100%; margin: 5px auto; text-align: left"
            @change="onChangeCountry(item, $event)"
            :indeterminate="item.indeterminateCountry"
            :checked="item.check"
          >
            <span>{{ item.country }}</span>
          </a-checkbox>
          <div class="list">
            <a-checkbox
              v-for="(nav, index) in item.detail"
              :key="index"
              class="item"
              @change="onChangeList(nav, $event, index)"
              :checked="nav.check"
            >
              {{ nav.name }}（{{ nav.num }}）
            </a-checkbox>
          </div>
        </div> -->

        <!-- <div class="more">
          <div class="sift">筛选</div>
          <div class="exclude">排除</div>
          <div class="moreOperate">展开更多></div>
        </div> -->
      </section>
      <section class="right">
        <div class="header">
          <div v-if="num">
        <!-- v-if="num" -->
        <div class="header flex justify-between item-center" >
          <div>
            共<span>{{ num }}</span
            >条专利
          </div>
          <!-- <div>切换视图</div> -->
          <!-- <div>相关性</div> -->
          <!-- <div>高亮显示</div> -->
          <a-button type="link" icon="download" @click="exportShow=true">
            导出
          </a-button>
        </div>
        <div class="dataList white">
          <div class="checkAll">
@@ -129,6 +181,30 @@
            >
              全选此页
            </a-checkbox>
            <div class="sort">
              <span style="margin:0 10px">排序：</span>
              <a-select v-model="sortFields" style="width: 120px" @change="reloadPageList">
                <a-select-option value="_score">相关度</a-select-option>
                <a-select-option value="publicationDate">公开日</a-select-option>
                <a-select-option value="system">申请日</a-select-option>
                <a-select-option value="assigneeHarmonizedCount">申请人数量</a-select-option>
                <a-select-option value="inventorHarmonizedCount">发明人数量</a-select-option>
                <a-select-option value="citationCount">引用数</a-select-option>
                <a-select-option value="citedCount">被引用数</a-select-option>
                <a-select-option value="publicationNumber">公开号</a-select-option>
                <a-select-option value="applicationNumber">申请号</a-select-option>
                <a-select-option value="priorityDate">优先权日</a-select-option>
                <a-select-option value="sameFamilyCount">同族数量</a-select-option>
              </a-select>
              <a-radio-group v-model="direction" button-style="solid" style="margin-left:10px" @change="reloadPageList">
                <a-radio-button value="desc">
                  高→低
                </a-radio-button>
                <a-radio-button value="asc">
                  低→高
                </a-radio-button>
              </a-radio-group>
            </div>
          </div>
          <a-spin :spinning="spinning">
          <div class="list" v-show="plainOptions.length" v-for="(item, index) in plainOptions" :key="index">
@@ -170,7 +246,7 @@
              <div class="content">{{ item.abstract1 }}</div>
            </div>
          </div>
          <div style="text-align:right">
          <div style="text-align:right" v-if="num>10">
            <a-pagination
              :default-current="1"
              :total="num"
@@ -182,22 +258,34 @@
        </div>
      </section>
    </main>
    <a-modal
      title="数据导出"
      :visible="exportShow"
      :width="1200"
      :footer="null"
      @cancel="exportShow=false"
    >
      <export-com v-if="exportShow" :total="num" />
    </a-modal>
  </div>
</template>

<script>
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
//例如：import 《组件名称》 from '《组件路径》';
import { GetPatentList , GetPatentListbyLaw , GetPatentListCount} from "@/api/url_analyst";
import { GetPatentListbyAdvance, GetPatentList , GetPatentListbyLaw , GetPatentListCount,GetPatentListbyPatch} from "@/api/url_analyst";
import ExportCom from '../components/ExportCom.vue'

export default {
  //import引入的组件需要注入到components对象中才能使用
  components: {},
  components: {ExportCom},
  data() {
    //这里存放数据
    return {
      ScrollHeight: document.documentElement.scrollTop,
      siftDialog: false, //筛选弹窗
      keyWord: "",
      conditionAnd:[],
      num: 0,
      pageNo: 1,
      spinning:false,
@@ -209,32 +297,17 @@
      checkAllCountry: false, //全选专利国家全选
      checkCountryList: false, //全选专利国家分类
      plainOptions: [],
      leftOptions:{},
      CountryPatentList: [
        {
          id: 1,
          country: "中国",
          check: false,
          indeterminateCountry: false,
          detail: [
            { name: "发明专利", num: 100, check: false },
            { name: "发明专利", num: 100, check: false },
            { name: "发明专利", num: 100, check: false },
          ],
        },
        {
          id: 2,
          country: "中国",
          check: false,
          indeterminateCountry: false,
          detail: [
            { name: "发明专利", num: 100, check: false },
            { name: "发明专利", num: 100, check: false },
            { name: "发明专利", num: 100, check: false },
          ],
        },
      ],
      leftOptions:{
        countryCodeCount:[]
      },
      length: 0, //复选框选中数量
      exportShow:false,
      checkedOption:{
      },
      currentUrl:null,
      currentParams:{},
      direction:'desc',
      sortFields:'publicationDate'
    };
  },
  //计算属性 类似于data概念
@@ -242,16 +315,15 @@
  //监控data中的数据变化
  watch: {
    ScrollHeight() {},
    "$route"(){
      window.location.reload()
    }
  },
  //方法集合
  mounted() {
    let keyWord = this.$route.query.keyWord
    let from = this.$route.query.from
    if(keyWord){
      this.keyWord = keyWord
    }
    this.getOptions()
    this.getPageList();
    this.initSearch(from)
  },
  methods: {
    keyWordSearch(){
@@ -261,20 +333,131 @@
        this.getPageList()
      }
    },
    getPageList() {
      let url = GetPatentList
      let from = this.$route.query.from
      let params = {}
      if(from&&from=='law'){
        url = GetPatentListbyLaw
        params =  JSON.parse(this.$route.query.params)
    checkChange(item){
      console.log(item)
      this.$set(item,'checked',!item.checked)

    },
    handleCondition(rule,field,name){
      let checkedList = []
      this.leftOptions[field+"Count"].forEach(item=>{
        if(item.checked && !item.disabled){
          item.disabled = true
          checkedList.push(item)
        }
      })
      if(checkedList.length==0) return
      let conditionItem = this.conditionAnd.find(item=>item.field==field&&item.rule==rule)
      if(conditionItem){
        conditionItem.checkedList.push(...checkedList)
        conditionItem.val = conditionItem.checkedList.map(item=>item.code||item.text).join(',')
      }else{
        params.keyWord = this.keyWord
        let obj = {
          field,
          rule,
          name,
          checkedList,
          val:checkedList.map(item=>item.code||item.text).join(','),
          childFieldLevel:0,
        }
        this.conditionAnd.push(obj)
      }
      this.initSearch()
    },
    conditionRemove(index,item){
      let val = item.val
      let checkedCode = []
      this.leftOptions[item.field+"Count"].forEach(it=>{
        if(val.indexOf(it.code||it.text)>=0){
          it.checked = false
          it.disabled = false
        }
        if(it.checked) checkedCode.push(it.code||it.text)
      })
      this.checkedOption[item.field+"Count"] = checkedCode
      this.conditionAnd.splice(index,1)
      this.initSearch()
    },
    initSearch(from){
      

      
      this.direction = 'desc'
      if(from){
        this.sortFields = 'publicationDate'
        this.currentParams =  JSON.parse(this.$route.query.params)
        switch(from){
          case 'home':
            this.currentUrl = GetPatentList
          break;
          case 'law':
            this.currentUrl = GetPatentListbyLaw
          break;
          case 'batch':
            this.currentUrl = GetPatentListbyPatch
          break;
          case 'senior':
            this.currentUrl = GetPatentListbyAdvance
            this.currentParams = {
              conditionAnd:JSON.parse(this.$route.query.params),
              conditionFilter: [
                {
                  "countryCode": "",
                  "countryText": "",
                  "kindText": ""
                }
              ],
            }
          break;
        }
      }else{
        this.sortFields = '_score'
        this.currentUrl = GetPatentListbyAdvance
        // 涉及时间的要特殊处理，多选时间要拆分
        let conditionAnd = []
        this.conditionAnd.map(item=>{
          if(item.rule=='range'||item.rule=='not range'){
            item.checkedList.map(it=>{
              conditionAnd.push({
                field:item.field,
                rule:item.rule,
                start:it.code + '-01-01',
                end:(Number(it.code)+1) + '-01-01'
              })
            })
          }else{
            conditionAnd.push(item)
          }
        })

        this.currentParams = {
          conditionAnd,
          conditionFilter: [
            {
              "countryCode": "",
              "countryText": "",
              "kindText": ""
            }
          ],
        }
      }

      this.reloadPageList()
    },
    reloadPageList(){
      this.pageNo == 1
      this.getPageList()
    },
    getPageList() {
      this.spinning = true
      url({
      this.currentUrl({
        pageNo: this.pageNo,
        ...params
        pageSize:10,
        sortFields:[{
          direction:this.direction,
          field:this.sortFields,
        }],
        ...this.currentParams
      }).then((res) => {
        this.plainOptions = res.Data.records.map(item=>{
          item.check = false
@@ -282,15 +465,21 @@
        })
        this.num = res.Data.total;
        this.spinning = false
      });
      }).catch(()=>{
        this.spinning = false
        this.plainOptions = []
        this.num = 0
      })
    },
    getOptions(){
      GetPatentListCount({value:''}).then(res=>{
        this.leftOptions = res.Data
      })
    },  
    checkChange(item){
      item.checked = !item.checked
    }, 
    handleItem(item){
      // localStorage.setItem('searchItem',JSON.stringify(item))
      window.open('/#/detail/'+item.id)
      // this.$router.push('/detail/'+item.id)
    },
    onPageChange(current){
      this.pageNo = current
@@ -319,7 +508,6 @@
      }
    },
    onChangeAll(e) {
      console.log(e)
      this.checkAll = !this.checkAll;
      this.length = this.plainOptions.length;
      if (e.target.checked) {
@@ -331,114 +519,6 @@
          this.plainOptions[i].check = false;
        }
        this.indeterminate = false
      }
    },
    onChangeAllPatent(e) {
      this.indeterminatePatent = false;
      this.checkAllPatent = e.target.checked;
      for (let i = 0; i < this.CountryPatentList.length; i++) {
        this.CountryPatentList[i].check = this.checkAllPatent;
        this.CountryPatentList[i].indeterminateCountry = false;
        for (let k = 0; k < this.CountryPatentList[i].detail.length; k++) {
          this.CountryPatentList[i].detail[k].check = this.checkAllPatent;
        }
      }
    },
    onChangeCountry(item, e) {
      this.indeterminateCountry = false;
      this.length = 0;
      item.check = e.target.checked;

      for (let k = 0; k < item.detail.length; k++) {
        item.indeterminateCountry = false;
        item.detail[k].check = e.target.checked;
      }

      for (let i = 0; i < this.CountryPatentList.length; i++) {
        if (this.CountryPatentList[i].check) {
          this.length++;
          for (let k = 0; k < this.CountryPatentList[i].detail.length; k++) {
            this.CountryPatentList[i].detail[k].check = true;
          }
        } else {
          for (let k = 0; k < this.CountryPatentList[i].detail.length; k++) {
            this.CountryPatentList[i].detail[k].check = false;
          }
        }
      }

      if (this.length === this.CountryPatentList.length) {
        this.checkAllPatent = true;
        this.indeterminatePatent = false;
      } else if (this.length === 0) {
        this.checkAllPatent = false;
        this.indeterminatePatent = false;
      } else if (0 < this.length < this.CountryPatentList.length) {
        this.checkAllPatent = false;
        this.indeterminatePatent = true;
      }
    },
    onChangeList(item, e) {
      let allCheck = 0;
      let multiSelect = 0;
      let newLength = 0;
      let allNO = 0;
      this.length = 0;
      item.check = e.target.checked;
      for (let i = 0; i < this.CountryPatentList.length; i++) {
        this.length = 0;
        for (let k = 0; k < this.CountryPatentList[i].detail.length; k++) {
          if (this.CountryPatentList[i].detail[k].check) {
            this.length++;
          }
          newLength = this.length;
        }

        if (newLength === this.CountryPatentList[i].detail.length) {
          this.CountryPatentList[i].check = true;
          this.CountryPatentList[i].indeterminateCountry = false;
        } else if (newLength === 0) {
          this.CountryPatentList[i].check = false;
          this.CountryPatentList[i].indeterminateCountry = false;
        } else if (0 < newLength < this.CountryPatentList[i].detail.length) {
          this.CountryPatentList[i].check = false;
          this.CountryPatentList[i].indeterminateCountry = true;
        }

        if (this.CountryPatentList[i].check) {
          allCheck++;
        } else if (this.CountryPatentList[i].indeterminateCountry) {
          multiSelect++;
        } else if (
          !this.CountryPatentList[i].check &&
          !this.CountryPatentList[i].indeterminateCountry
        ) {
          allNO++;
        }
      }
      console.log(allCheck, multiSelect, allNO);

      // if (allNO === this.CountryPatentList.length) {
      //   this.checkAllPatent = false;
      //   this.indeterminatePatent = false;
      // }
      if (allCheck === this.CountryPatentList.length) {
        this.checkAllPatent = true;
        this.indeterminatePatent = false;
      }
      if (allCheck === 0 && multiSelect === 0) {
        this.checkAllPatent = false;
        this.indeterminatePatent = false;
        console.log(1);
      }

      if (multiSelect === this.CountryPatentList.length) {
        this.checkAllPatent = false;
        this.indeterminatePatent = true;
      }
      if (0 < allNO < this.CountryPatentList.length) {
        this.checkAllPatent = false;
        this.indeterminatePatent = true;
      }
    },
  },
@@ -668,10 +748,49 @@
    .left_search {
      padding: 0 25px;
    }
    .condition-box{
      border: 1px solid #ef8201;
      padding: 10px;
      margin-bottom: 10px;
      li{
        display: flex;
        // align-items: center;
        span.in{
          color: green;
          &.not{
            color: red;
          }
        }
        span.label{
          max-width: 70px;
          margin-right: 8px;
          white-space: nowrap;
          overflow: hidden;
          text-overflow: ellipsis;
        }
        span.list{
          flex: 1;
          color: #ef8201;
        }
        .anticon-close{
          cursor: pointer;
          padding-top: 3px;
          &:hover{
            color: #ef8201;
          }
        }
      }
    }
    .option-list li{
      display: flex;
      width: 100%;
      justify-content: space-between;
    }
    .option-btn{
      padding-top: 10px;
      >*{
        margin-right: 8px;
      }
    }
    .siftDialog {
      margin: 20px auto;
@@ -752,6 +871,8 @@
        width: 100%;
        text-align: left;
        margin-bottom: 20px;
        display: flex;
        align-items: center;
      }
      .list {
        width: 100%;

 src/views/detailCompos/Basic.vue

@@ -5,14 +5,14 @@
        <h4>主著录项</h4>
        <ul>
          <li>
            <span>申请号：</span><span>{{ basicInfo.applicationNumber }}</span>
            <span>申请号：</span><span>{{ basicInfo.applicationNumber || '--' }}</span>
          </li>
          <li>
            <span>申请日：</span><span>{{ $fnFormatDate(basicInfo.system) }}</span>
          </li>
          <li>
            <span>公开号：</span
            ><span>{{basicInfo.publicationNumber }}</span>
            ><span>{{basicInfo.publicationNumber || '--' }}</span>
          </li>
          <li>
            <span>公开日：</span
@@ -20,54 +20,54 @@
          </li>
          <li>
            <span>发明人：</span
            ><span>NA</span>
            ><span>{{ basicInfo.inventorHarmonizedName || '--' }}</span>
          </li>
          <li>
            <span>申请人：</span
            ><span>{{ basicInfo.assigneeHarmonizedName }}</span>
            ><span>{{ basicInfo.assigneeHarmonizedName || '--' }}</span>
          </li>
          <li>
            <span>标准化申请人：</span
            ><span>NA</span>
            ><span>{{ basicInfo.assigneeHarmonizedName || '--' }}</span>
          </li>
          <li>
            <span>申请人地址：</span
            ><span>NA</span>
            ><span>{{ basicInfo.address || '--' }}</span>
          </li>
          <li>
            <span>IP C分类号：</span
            ><span>NA</span>
            ><span>{{ basicInfo.ipcList || '--' }}</span>
          </li>
          <li>
            <span>CPC分类号：</span
            ><span>NA</span>
            ><span>{{ basicInfo.cpcList || '--' }}</span>
          </li>
          <li>
            <span>国民经济分类号：</span
            ><span>NA</span>
            ><span>{{ basicInfo.industrycn || '--' }}</span>
          </li>
           <li>
            <span>战略性新兴产业分类号：</span
            ><span>NA</span>
            ><span>{{ basicInfo.stratregicIndustry || '--' }}</span>
          </li>
          <li>
            <span>引证数量：</span
            ><span>NA</span>
            ><span>{{ basicInfo.citationCount || '--' }}</span>
          </li>
          <li>
            <span>被引数量（动态调整的）：</span
            ><span>NA</span>
            ><span>{{ basicInfo.citedCount || '--' }}</span>
          </li>
          <li>
            <span>同族专利数量：</span
            ><span>NA</span>
            ><span>{{ basicInfo.sameFamilyCount || '--' }}</span>
          </li>
        </ul>
      </a-col>
      <a-col :span="12" class="abstract">
        <h4>摘要</h4>
        <p>{{basicInfo.abstract0||'-'}}</p>
        <p>{{basicInfo.abstract1||'-'}}</p>
        <p v-html="basicInfo.abstract0||'-'"></p>
        <p v-html="basicInfo.abstract1||'-'"></p>
      </a-col>
    </a-row>
    <!-- <a-row>
@@ -87,19 +87,7 @@
</template>
<script>
export default {
  data() {
    //这里存放数据
    return {
      basicInfo:{}
    };
  },
  //计算属性 类似于data概念
  computed: {},
  //方法集合
  mounted() {
    this.basicInfo = JSON.parse(localStorage.getItem('searchItem'))
  },
  methods: {},
  props:['basicInfo'],
};

</script>

 src/views/detailCompos/Falv.vue

@@ -1,24 +1,12 @@
<template>
  <div>
    <h4>法律状态</h4>
    <p>{{basicInfo.patentStatus_dictText}}</p>
    <p>{{basicInfo.patentStatus_dictText||'--'}}</p>
  </div>
</template>
<script>
export default {
  data() {
    //这里存放数据
    return {
      basicInfo:{}
    };
  },
  //计算属性 类似于data概念
  computed: {},
  //方法集合
  mounted() {
    this.basicInfo = JSON.parse(localStorage.getItem('searchItem'))
  },
  methods: {},
  props:['basicInfo'],
};
</script>
<style lang="less" scoped>

 src/views/detailCompos/Zhuanli.vue

@@ -1,25 +1,13 @@
<template>
  <div>
    <h4>专利描述</h4>
    <p>{{basicInfo.description0}}</p>
    <p>{{basicInfo.description1}}</p>
    <p>{{basicInfo.description0||'--'}}</p>
    <p>{{basicInfo.description1||'--'}}</p>
  </div>
</template>
<script>
export default {
  data() {
    //这里存放数据
    return {
      basicInfo:{}
    };
  },
  //计算属性 类似于data概念
  computed: {},
  //方法集合
  mounted() {
    this.basicInfo = JSON.parse(localStorage.getItem('searchItem'))
  },
  methods: {},
  props:['basicInfo'],
};
</script>