[update] 修改一般检索联调

src/api/dashboard.js

@@ -1,6 +1,10 @@
-import { getAction } from './manage'
+import { getAction, postAction } from './manage'
 // 获取检索历史数据
 const getSearchHistoryData = (params) => getAction('/home/lawsHomeNormalSearchHistory/page', params)
+// 根据id删除检索历史
+const deleteSearchHistoryById = (params) => postAction('/home/lawsHomeNormalSearchHistory/delete', params)
+// 批量删除检索历史
+const batchDeleteSearchHistory = (params) => postAction('/home/lawsHomeNormalSearchHistory/deleteBatch', params)
 // 一般检索(标题)——资源类型改变获取下面筛选项统计数据
 const getSearchParamNum = (params) => getAction('/home/lawsHomeSearch/getNormalSearchTitleCount', params)
 // 一般检索（标题）—— 查询
@@ -26,6 +30,8 @@ const getEnterStandardList = (params) => getAction('/laws/standard/enterprise/ge
 
 export {
   getSearchHistoryData,
+  deleteSearchHistoryById,
+  batchDeleteSearchHistory,
   getSearchParamNum,
   generalSearchTitleSearch,
   getSearchParamNumFullText,

src/views/dashboard/search/GeneralSearch.vue

@@ -1,13 +1,13 @@
 <template>
   <div>
-    <a-card :bordered="false" :loading="loading">
+    <a-card :bordered="false">
       <!--  搜索框部分  -->
       <div class="top-search-div">
         <div class="top-search-div-content">
           <a-input-search class="input-search"
                           :placeholder="$t('pleaseEnter')+$t('dashboard.generalSearch.queryCondition')"
                           v-model="searchValue"
-                          @search="onSearch">
+                          @search="onSearch(1)">
             <a-button type="primary" slot="enterButton">
               <i class="iconfont icon-Searchbar_Search_icon"></i>
             </a-button>
@@ -58,25 +58,26 @@
       <template v-if="dataSource && dataSource.length > 0">
         <!--  查询结果展示区域  -->
         <div class="result-wrapper">
-          <div class="result-div" v-for="item in dataSource" :key="item.standardNumber">
-            <div class="result-title-wrapper">
-              <!--  正在搜索，标题根据搜索内容高亮显示  -->
-              <a-tooltip>
-                <template #title>
-                  <span v-html="item.title"></span>
-                </template>
-                <p class="result-title" v-html="item.title"></p>
-              </a-tooltip>
-              <div class="result-source-wrapper">
-                <p class="result-source">{{ resourceTypeOptions.find(i => i.key === item.resourceType).label }}</p>
+          <a-spin :spinning="loading">
+            <div class="result-div" v-for="item in dataSource" :key="item.standardNumber">
+              <div class="result-title-wrapper">
+                <!--  正在搜索，标题根据搜索内容高亮显示  -->
+                <a-tooltip>
+                  <template #title>
+                    <span v-html="item.title"></span>
+                  </template>
+                  <p class="result-title" v-html="item.title"></p>
+                </a-tooltip>
+                <div class="result-source-wrapper">
+                  <p class="result-source">{{ resourceTypeOptions.find(i => i.key === item.resourceType).label }}</p>
+                </div>
+                <p class="result-date">{{ $t('dashboard.generalSearch.releaseDate') }} {{ item.releaseDate || global.emptyLine }}</p>
+              </div>
+              <div class="result-content-wrapper">
+                {{ item.content }}
               </div>
-              <p class="result-date">{{ $t('dashboard.generalSearch.releaseDate') }} {{ item.releaseDate || global.emptyLine }}</p>
             </div>
-            <div class="result-content-wrapper">
-              {{ item.content }}
-              <!--<span class="result-field-span" v-for="field in formInLine" :key="field.dbFieldName">{{field.dbFieldTxt}}: {{ item[field.dbFieldName] || '&#45;&#45;' }}</span>-->
-            </div>
-          </div>
+          </a-spin>
         </div>
         <a-pagination
           v-if="dataSource && dataSource.length > 0"
@@ -368,7 +369,7 @@ export default {
 // 头部搜索区域
 .top-search-div {
   width: 100%;
-  height: 124px;
+  min-height: 124px;
   background-image: url("../../../assets/image/searchPageBack.png");
   background-size: 100% 100%;
   background-repeat: no-repeat;

src/views/dashboard/search/modules/SearchHistoryModal.vue

@@ -9,7 +9,22 @@
     @cancel="handleCancel">
 
     <a-spin :spinning="confirmLoading">
-      <template v-if="model">
+      <template v-if="model && Object.keys(model).length > 0">
+        <div v-for="(item, key) in model" :key="key" class="content-wrapper" ref="contentWrapper" @scroll="contentWrapperScroll">
+          <p class="time-p">{{ isCurrentDate(key) ? '最近' : key }}</p>
+          <a-checkbox-group @change="onCheckChange">
+            <div v-for="arrItem in item" :key="arrItem.id" class="search-value-div">
+              <a-checkbox :value="arrItem.id"></a-checkbox>
+              <a-tooltip>
+                <template #title>
+                  {{ arrItem.searchContent }}
+                </template>
+                <p>{{ arrItem.searchContent }}</p>
+              </a-tooltip>
+              <i class="iconfont icon-shanchu_" @click="handleDelete(arrItem.id)"></i>
+            </div>
+          </a-checkbox-group>
+        </div>
         <!--<div class="record-item" v-for="record in recordList" :key="record.id">-->
         <!--  {{ record.content }}-->
         <!--</div>-->
@@ -18,56 +33,185 @@
     </a-spin>
 
     <template v-slot:footer>
-      <a-button @click="handleBatchDel">{{ $t('batchDelete') }}</a-button>
+      <a-button type="primary" ghost @click="handleBatchDel">{{ $t('batchDelete') }}</a-button>
       <a-button @click="handleCancel">{{ $t('close') }}</a-button>
     </template>
   </j-modal>
 </template>
 
 <script>
-import { getSearchHistoryData } from '@/api/dashboard'
+import {
+  getSearchHistoryData,
+  deleteSearchHistoryById,
+  batchDeleteSearchHistory
+} from '@/api/dashboard'
 
 export default {
   name: 'SearchHistoryModal',
   data () {
     return {
-      width: 800,
+      width: 500,
       visible: false,
       confirmLoading: false,
       model: {},
       page: {
         pageNo: 1,
-        pageSize: 50
-      }
+        pageSize: 20,
+        total: 0,
+        pages: 0
+      },
+      dataList: [],
+      checkedArr: []
     }
   },
   methods: {
     open () {
+      this.page = {
+        pageNo: 1,
+        pageSize: 20,
+        total: 0,
+        pages: 0
+      }
       this.initData()
       this.visible = true
     },
+    // 是否显示最近
+    isCurrentDate (createTime) {
+      let createDateStr = createTime.split(' ')[0]
+      createDateStr = createDateStr.replace(/([年月])/g, '-')
+      createDateStr = createDateStr.replace(/日/g, '')
+      const currentDate = new Date().getFullYear() + '-' + (new Date().getMonth() + 1) + '-' + new Date().getDate()
+      if (createDateStr === currentDate) {
+        return true
+      } else {
+        return false
+      }
+    },
+    // 内容展示区域滚动事件
+    contentWrapperScroll () {
+      const contentWrapper = this.$refs.contentWrapper[0]
+      // 滚动条触底，并且还不是最后一页时获取下一页
+      if (contentWrapper.scrollTop + contentWrapper.clientHeight === contentWrapper.scrollHeight && this.page.pageNo < this.page.pages) {
+        this.page.pageNo++
+        this.initData()
+      }
+    },
     // 获取列表数据
     initData () {
       const param = {}
       param.pageNo = this.page.pageNo
       param.pageSize = this.page.pageSize
+      this.confirmLoading = true
       getSearchHistoryData(param).then(res => {
         if (res.success) {
-          this.model = res.result.records
-          console.log(res.result)
+          if (this.page.pageNo === 1) {
+            this.dataList = res.result.records
+          } else {
+            this.dataList = this.dataList.concat(res.result.records)
+          }
+          this.page.pages = res.result.pages
+          this.page.total = res.result.total
+          for (const item of res.result.records) {
+            const modelKeys = Object.keys(this.model)
+            if (!modelKeys.includes(item.createTime)) {
+              // 还没有该日期
+              this.model[item.createTime] = []
+            }
+            this.model[item.createTime].push(item)
+          }
+        }
+      }).finally(() => {
+        this.confirmLoading = false
+      })
+    },
+    // 重新计算分页
+    reCalculatePage (count) {
+      // 总数量-count
+      const total = this.page.total - count
+      // 获取删除后的分页数
+      const currentIndex = Math.ceil(total / this.page.pageSize)
+      // 删除后的分页数<所在当前页
+      if (currentIndex < this.page.pageNo) {
+        this.page.current = currentIndex
+      }
+      console.log('currentIndex', currentIndex)
+    },
+    // 多选变化
+    onCheckChange (checkedValue) {
+      this.checkedArr = checkedValue
+    },
+    // 删除
+    handleDelete (id) {
+      deleteSearchHistoryById({ id: id }).then(res => {
+        if (res.success) {
+          this.$message.success(res.message)
+          // 判断当前删除的数据是否是最后一页的最后一条数据，如果是的话页码减一
+          if (this.page.pageNo > 1 && ((this.page.pageNo - 1) * this.page.pageSize) + 1 === this.page.total) {
+            this.page.pageNo -= 1
+          }
+          this.initData()
+        } else {
+          this.$message.warning(res.message)
         }
       })
     },
     // 批量删除
-    handleBatchDel () {},
+    handleBatchDel () {
+      batchDeleteSearchHistory({ ids: this.checkedArr.join(',') }).then(res => {
+        if (res.success) {
+          this.reCalculatePage(this.checkedArr.length)
+          this.$message.success(res.message)
+          this.checkedArr = []
+          this.initData()
+        } else {
+          this.$message.warning(res.message)
+        }
+      })
+    },
     // 取消
     handleCancel () {
       this.visible = false
+      this.model = {}
+      this.dataList = []
+      this.checkedArr = []
     }
   }
 }
 </script>
 
-<style scoped>
-
+<style scoped lang="less">
+.content-wrapper {
+  padding-right: 5px;
+  max-height: 600px;
+  overflow-y: auto;
+}
+.time-p {
+  color: @primary-color;
+}
+/deep/ .ant-checkbox-group {
+  width: 100%;
+}
+.search-value-div {
+  width: 100%;
+  height: 30px;
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  border: 1px solid #E5E6EB;
+  padding: 0 10px;
+  border-radius: 4px 4px 4px 4px;
+  margin-bottom: 5px;
+  p {
+    margin-bottom: 0;
+    flex: 1;
+    margin-left: 10px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+  .iconfont {
+    margin-left: auto;
+    color: @primary-color;
+  }
+}
 </style>