|
|
@@ -16,8 +16,6 @@ const props = defineProps({
|
|
|
}
|
|
|
});
|
|
|
|
|
|
-// 主体元素ref
|
|
|
-const drawerContentElem = ref<HTMLInputElement | null>(null)
|
|
|
// 组件可见状态
|
|
|
const visible = ref<boolean>(false);
|
|
|
// 章节搜索结果总数量
|
|
|
@@ -31,11 +29,28 @@ const pagination = reactive({
|
|
|
page: 1,
|
|
|
size: 10,
|
|
|
})
|
|
|
+// 重新检索的查询词
|
|
|
+const queryKeywords = ref<string[]>([])
|
|
|
|
|
|
-function search(keywords: string[], page?: number) {
|
|
|
+function getFrom(page?: number) {
|
|
|
+ return (Math.max(1, page || 1) - 1) * pagination.size
|
|
|
+}
|
|
|
+
|
|
|
+function getDefaultKeywords(): string[] {
|
|
|
+ return props.keywords as string[]
|
|
|
+}
|
|
|
+
|
|
|
+function getSearchRequest(): ChapterSearchRequest {
|
|
|
+ const request: ChapterSearchRequest = {
|
|
|
+ keywords: getDefaultKeywords(),
|
|
|
+ queryKeywords: queryKeywords.value,
|
|
|
+ from: getFrom(pagination.page)
|
|
|
+ }
|
|
|
+ return request
|
|
|
+}
|
|
|
+
|
|
|
+function search(request: ChapterSearchRequest) {
|
|
|
loading.value = true
|
|
|
- const from = Math.max(1, page || 1) * pagination.size
|
|
|
- const request: ChapterSearchRequest = { from, keywords }
|
|
|
referenceSearchResult.value = []
|
|
|
chapterSearchService.search(request).then((resp) => {
|
|
|
loading.value = false
|
|
|
@@ -49,11 +64,13 @@ function search(keywords: string[], page?: number) {
|
|
|
|
|
|
function onPageChange(page: number) {
|
|
|
pagination.page = page
|
|
|
- search(props.keywords as string[], page)
|
|
|
- if (drawerContentElem.value) {
|
|
|
- (drawerContentElem.value as HTMLElement).scrollTop = 0
|
|
|
- console.log('(drawerContentElem.value as HTMLElement).scrollTop', (drawerContentElem.value as HTMLElement).scrollTop)
|
|
|
- }
|
|
|
+ search(getSearchRequest())
|
|
|
+}
|
|
|
+
|
|
|
+function onReferenceSearchBoxSearch(queryKeywordsIn: string[]) {
|
|
|
+ pagination.page = 1
|
|
|
+ queryKeywords.value = queryKeywordsIn
|
|
|
+ search(getSearchRequest())
|
|
|
}
|
|
|
|
|
|
const onClose = () => {
|
|
|
@@ -64,7 +81,7 @@ const show = () => {
|
|
|
visible.value = true;
|
|
|
const keywords = props.keywords
|
|
|
if (keywords && keywords.length > 0) {
|
|
|
- search(keywords as string[])
|
|
|
+ search(getSearchRequest())
|
|
|
}
|
|
|
};
|
|
|
|
|
|
@@ -83,26 +100,24 @@ defineExpose({
|
|
|
@close="onClose"
|
|
|
class="reference-drawer"
|
|
|
>
|
|
|
- <div class="content-wrap" ref="drawerContentElem">
|
|
|
- <ReferenceSearchBox />
|
|
|
- <a-divider />
|
|
|
- <SpinComponent :spinning="loading">
|
|
|
- <div v-for="(item, index) in referenceSearchResult" :key="index">
|
|
|
- <ReferenceSearchResultItem :data="item" />
|
|
|
- <a-divider class="result-item-divider" v-if="index < referenceSearchResult.length - 1" />
|
|
|
- </div>
|
|
|
- <div class="pigination-wrap">
|
|
|
- <a-pagination
|
|
|
- :current="pagination.page"
|
|
|
- :pageSize="pagination.size"
|
|
|
- :total="total"
|
|
|
- :show-size-changer="false"
|
|
|
- size="small"
|
|
|
- @change="onPageChange"
|
|
|
- />
|
|
|
- </div>
|
|
|
- </SpinComponent>
|
|
|
- </div>
|
|
|
+ <ReferenceSearchBox @search="onReferenceSearchBoxSearch" />
|
|
|
+ <a-divider />
|
|
|
+ <SpinComponent :spinning="loading">
|
|
|
+ <div v-for="(item, index) in referenceSearchResult" :key="index">
|
|
|
+ <ReferenceSearchResultItem :data="item" />
|
|
|
+ <a-divider class="result-item-divider" v-if="index < referenceSearchResult.length - 1" />
|
|
|
+ </div>
|
|
|
+ <div class="pigination-wrap">
|
|
|
+ <a-pagination
|
|
|
+ :current="pagination.page"
|
|
|
+ :pageSize="pagination.size"
|
|
|
+ :total="total"
|
|
|
+ :show-size-changer="false"
|
|
|
+ size="small"
|
|
|
+ @change="onPageChange"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </SpinComponent>
|
|
|
</a-drawer>
|
|
|
</template>
|
|
|
|