ZQ/laws-sinotruk-client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[update] 一般检索，加载状态更改为全页面范围

Browse Source
This commit is contained in:
lideqin
2023-11-23 14:10:42 +08:00
parent 951aa228ac
commit 33977f873c
1 changed files with 32 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/dashboard/search/GeneralSearch.vue
+32 -29
View File
@@ -1,5 +1,5 @@
<template> <template>
<div> <a-spin :spinning="loading || selectOptionLoading">
<a-card :bordered="false"> <a-card :bordered="false">
<!-- 搜索框部分 --> <!-- 搜索框部分 -->
<div class="top-search-div"> <div class="top-search-div">
@@ -55,36 +55,35 @@
{{ toggleSearchStatus ? $t('putAway') : $t('open') }} {{ toggleSearchStatus ? $t('putAway') : $t('open') }}
</div> </div>
</div> </div>
<!-- 结果展示 -->
<template v-if="dataSource && dataSource.length > 0"> <template v-if="dataSource && dataSource.length > 0">
<!-- 查询结果展示区域 --> <!-- 查询结果展示区域 -->
<div class="result-wrapper"> <div class="result-wrapper">
<a-spin :spinning="loading"> <div class="result-div" v-for="item in dataSource" :key="item.id">
<div class="result-div" v-for="item in dataSource" :key="item.id"> <div class="result-title-wrapper">
<div class="result-title-wrapper"> <!-- 正在搜索，标题根据搜索内容高亮显示 -->
<!-- 正在搜索，标题根据搜索内容高亮显示 --> <a-tooltip>
<a-tooltip> <template #title>
<template #title> <span v-html="item.title"></span>
<span v-html="item.title"></span> </template>
</template> <p class="result-title" v-html="item.title"></p>
<p class="result-title" v-html="item.title"></p> </a-tooltip>
</a-tooltip> <div class="result-source-wrapper">
<div class="result-source-wrapper"> <p class="result-source">{{ resourceTypeOptions.find(i => i.key === item.resourceType).label }}</p>
<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>
<template v-if="retrievalModeCurrent === '1'"> <p class="result-date">{{ $t('dashboard.generalSearch.releaseDate') }} {{ item.releaseDate || global.emptyLine }}</p>
<!-- 全文检索 -->
<div v-html="item.content" class="result-content-wrapper"></div>
</template>
<template v-else>
<div v-if="item.resourceType !== '4'" class="result-content-wrapper">
{{ item.content }}
</div>
<div v-else v-html="item.content" class="result-content-wrapper"></div>
</template>
</div> </div>
</a-spin> <template v-if="retrievalModeCurrent === '1'">
<!-- 全文检索 -->
<div v-html="item.content" class="result-content-wrapper"></div>
</template>
<template v-else>
<div v-if="item.resourceType !== '4'" class="result-content-wrapper">
{{ item.content }}
</div>
<div v-else v-html="item.content" class="result-content-wrapper"></div>
</template>
</div>
</div> </div>
<a-pagination <a-pagination
v-if="dataSource && dataSource.length > 0" v-if="dataSource && dataSource.length > 0"
@@ -101,10 +100,10 @@
/> />
</template> </template>
<a-empty class="empty-content" v-else /> <a-empty class="empty-content" v-else />
</a-card>
<search-history-modal ref="searchHistoryModal"></search-history-modal> <search-history-modal ref="searchHistoryModal"></search-history-modal>
</div> </a-card>
</a-spin>
</template> </template>
<script> <script>
@@ -121,6 +120,7 @@ export default {
components: { SearchHistoryModal }, components: { SearchHistoryModal },
data () { data () {
return { return {
selectOptionLoading: false, // 其他筛选条件部分的loading
loading: false, loading: false,
searchValue: '', // 搜索框内容 searchValue: '', // 搜索框内容
toggleSearchStatus: false, // 检索条件收缩还是展开， false收缩状态 toggleSearchStatus: false, // 检索条件收缩还是展开， false收缩状态
@@ -206,6 +206,7 @@ export default {
} else { } else {
func = getSearchParamNum func = getSearchParamNum
} }
this.selectOptionLoading = true
func(param).then(res => { func(param).then(res => {
if (res.success) { if (res.success) {
// 设置对象key为搜索时需要传给后端的字段名，以及设置选项和字段label // 设置对象key为搜索时需要传给后端的字段名，以及设置选项和字段label
@@ -255,6 +256,8 @@ export default {
this.$message.warning(res.message) this.$message.warning(res.message)
this.selectOptions = {} this.selectOptions = {}
} }
}).finally(() => {
this.selectOptionLoading = false
}) })
}, },
// 查询时获取参数 // 查询时获取参数