Files
k3GPT/main/ui/search.aps
2025-11-19 19:43:14 +08:00

296 lines
21 KiB
Plaintext
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<div x-data="query" class="flex flex-col h-[92vh]">
<!-- 搜索框-->
<div class="mx-auto flex flex-col w-full max-w-6xl rounded-lg bg-white shadow-lg p-4 mb-2">
<div class="flex justify-center">
<img :src="$store.nav.logo" id="logo" width="150px" height="24px" @click="fetchSomething()" class="cursor-pointer">
<div class="relative my-4 flex w-full max-w-xl mx-4 flex-col gap-1 text-neutral-600 dark:text-zinc-200">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="currentColor" fill="none" stroke-width="2" class="absolute left-2 top-1/2 size-5 -translate-y-1/2 text-neutral-600/50 dark:text-zinc-200/50" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" d="m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z"/>
</svg>
<input x-model="search" x-on:input.debounce.900ms="fetchSomething()" placeholder="搜索全站知识库、知识百科、文件中心等文档" type="search" class="w-full border border-zinc-300 rounded bg-zinc-50 px-2 py-1.5 pl-9 text-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-sky-700 disabled:cursor-not-allowed disabled:opacity-75 dark:border-zinc-700 dark:bg-zinc-900/50 dark:focus-visible:outline-sky-600" name="search" aria-label="Search" placeholder="Search"/>
</div>
</div>
<div x-text="count" class="flex justify-end text-sm"></div>
</div>
<!-- 搜索结果 -->
<div class="mx-auto w-full max-w-6xl flex-grow overflow-y-auto p-4">
<!--信息显示-->
<div x-show="!showList">
<div x-data="info_t" class="relative w-full overflow-hidden">
<!-- previous button -->
<button type="button" class="absolute left-5 top-1/2 z-20 flex rounded-full -translate-y-1/2 items-center justify-center bg-zinc-50/40 p-2 text-neutral-600 transition hover:bg-zinc-50/60 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-sky-700 active:outline-offset-0 dark:bg-zinc-900/40 dark:text-zinc-200 dark:hover:bg-zinc-900/60 dark:focus-visible:outline-sky-600" aria-label="previous slide" x-on:click="previous()">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="currentColor" fill="none" stroke-width="3" class="size-5 md:size-6 pr-0.5" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" d="M15.75 19.5 8.25 12l7.5-7.5" />
</svg>
</button>
<!-- next button -->
<button type="button" class="absolute right-5 top-1/2 z-20 flex rounded-full -translate-y-1/2 items-center justify-center bg-zinc-50/40 p-2 text-neutral-600 transition hover:bg-zinc-50/60 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-sky-700 active:outline-offset-0 dark:bg-zinc-900/40 dark:text-zinc-200 dark:hover:bg-zinc-900/60 dark:focus-visible:outline-sky-600" aria-label="next slide" x-on:click="next()">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke="currentColor" fill="none" stroke-width="3" class="size-5 md:size-6 pl-0.5" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" d="M8.25 4.5l7.5 7.5-7.5 7.5" />
</svg>
</button>
<!-- slides -->
<!-- Change min-h-[50svh] to your preferred height size -->
<div class="relative min-h-[70vh] w-full">
<template x-for="(slide, index) in slides">
<div x-cloak x-show="currentSlideIndex == index + 1" class="absolute inset-0" x-transition.opacity.duration.1000ms>
<!-- Title and description -->
<div class="lg:px-32 lg:py-14 absolute inset-0 z-10 flex flex-col items-center justify-end gap-2 bg-gradient-to-t from-zinc-900/85 to-transparent px-16 py-12 text-center">
<h3 class="w-full lg:w-[80%] text-balance text-2xl lg:text-3xl font-bold text-zinc-50" x-text="slide.title" x-bind:aria-describedby="'slide' + (index + 1) + 'Description'"></h3>
<p class="lg:w-1/2 w-full text-pretty text-sm text-zinc-200" x-text="slide.description" x-bind:id="'slide' + (index + 1) + 'Description'"></p>
</div>
<img class="absolute w-full h-full inset-0 object-cover text-neutral-600 dark:text-zinc-200" x-bind:src="slide.imgSrc" x-bind:alt="slide.imgAlt" />
</div>
</template>
</div>
<!-- indicators -->
<div class="absolute rounded bottom-3 md:bottom-5 left-1/2 z-20 flex -translate-x-1/2 gap-4 md:gap-3 px-1.5 py-1 md:px-2" role="group" aria-label="slides" >
<template x-for="(slide, index) in slides">
<button class="size-2 cursor-pointer rounded-full transition" x-on:click="currentSlideIndex = index + 1" x-bind:class="[currentSlideIndex === index + 1 ? 'bg-zinc-200' : 'bg-zinc-200/50']" x-bind:aria-label="'slide ' + (index + 1)"></button>
</template>
</div>
</div>
</div>
<!--结果列表-->
<div x-show="showList" class="flex flex-col gap-2">
<template x-for="(item,index) in filteredItems" :key="index">
<!-- 老样式
<li>
<div>
<a :href="item.path" target="_blank"><span style="color:red;" x-text="index+1"></span>.<span style="color:red;" x-text="item.name"></span></a>
[<span x-text="item.fdate"></span>]
</div>
<div x-html="item.content" class="ml-4"></div>
<br>
</li>
-->
<div class="w-full max-w-6xl border-zinc-300 bg-zinc-100 p-2 text-left dark:border-zinc-700 dark:bg-zinc-800 rounded border" >
<div class="flex items-center gap-2 text-neutral-900 dark:text-zinc-50">
<span class="flex size-8 items-center justify-center rounded-full bg-blue-700 text-white dark:bg-sky-600 dark:text-white">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" class="size-5">
<path d="M6 12.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5M3 8.062C3 6.76 4.235 5.765 5.53 5.886a26.6 26.6 0 0 0 4.94 0C11.765 5.765 13 6.76 13 8.062v1.157a.93.93 0 0 1-.765.935c-.845.147-2.34.346-4.235.346s-3.39-.2-4.235-.346A.93.93 0 0 1 3 9.219zm4.542-.827a.25.25 0 0 0-.217.068l-.92.9a25 25 0 0 1-1.871-.183.25.25 0 0 0-.068.495c.55.076 1.232.149 2.02.193a.25.25 0 0 0 .189-.071l.754-.736.847 1.71a.25.25 0 0 0 .404.062l.932-.97a25 25 0 0 0 1.922-.188.25.25 0 0 0-.068-.495c-.538.074-1.207.145-1.98.189a.25.25 0 0 0-.166.076l-.754.785-.842-1.7a.25.25 0 0 0-.182-.135" />
<path d="M8.5 1.866a1 1 0 1 0-1 0V3h-2A4.5 4.5 0 0 0 1 7.5V8a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1v1a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-1a1 1 0 0 0 1-1V9a1 1 0 0 0-1-1v-.5A4.5 4.5 0 0 0 10.5 3h-2zM14 7.5V13a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V7.5A3.5 3.5 0 0 1 5.5 4h5A3.5 3.5 0 0 1 14 7.5" />
</svg>
</span>
<span x-text="item.name" class="text-sm font-bold">文件名</span>
[<span x-text="item.fdate" class="text-sm">日期</span>]
</div>
<p x-html="item.content" style="overflow-wrap: break-word;" class="text-pretty sm:pl-10 mt-4 sm:mt-0 text-sm text-neutral-600 dark:text-zinc-200">
高亮的内容
</p>
<!-- Actions -->
<div class="mt-2 flex items-center gap-2 sm:pl-10">
<button x-on:click="copyToClipboard(item.name);" class="rounded-full p-1 text-neutral-600/75 hover:bg-zinc-900/10 hover:text-neutral-600 focus:outline-none focus-visible:text-neutral-600 focus-visible:zinc-300 focus-visible:outline-offset-0 focus-visible:outline-sky-700 active:bg-zinc-900/5 active:-outline-offset-2 dark:text-zinc-200/75 dark:hover:bg-zinc-50/10 dark:hover:text-zinc-200 dark:focus-visible:text-zinc-200 dark:focus-visible:outline-sky-600 dark:active:bg-zinc-50/5" title="复制" aria-label="Read Aloud" >
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="size-4" aria-hidden="true">
<path fill-rule="evenodd" d="M13.887 3.182c.396.037.79.08 1.183.128C16.194 3.45 17 4.414 17 5.517V16.75A2.25 2.25 0 0 1 14.75 19h-9.5A2.25 2.25 0 0 1 3 16.75V5.517c0-1.103.806-2.068 1.93-2.207.393-.048.787-.09 1.183-.128A3.001 3.001 0 0 1 9 1h2c1.373 0 2.531.923 2.887 2.182ZM7.5 4A1.5 1.5 0 0 1 9 2.5h2A1.5 1.5 0 0 1 12.5 4v.5h-5V4Z" clip-rule="evenodd"/>
</svg>
</button>
<!-- 下载-->
<button @click="download(item.path,item.name,item.base)" class="rounded-full p-1 text-neutral-600/75 hover:bg-zinc-900/10 hover:text-neutral-600 focus:outline-none focus-visible:text-neutral-600 focus-visible:zinc-300 focus-visible:outline-offset-0 focus-visible:outline-sky-700 active:bg-zinc-900/5 active:-outline-offset-2 dark:text-zinc-200/75 dark:hover:bg-zinc-50/10 dark:hover:text-zinc-200 dark:focus-visible:text-zinc-200 dark:focus-visible:outline-sky-600 dark:active:bg-zinc-50/5" title="下载或查看" aria-label="Download" >
<template x-if="item.base!='知识百科'">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" class="size-4" fill="currentColor">
<path d="M19 9h-4V3H9v6H5l7 7z"/>
<path d="M20 18H4v2h16z"/>
</svg>
</template>
<template x-if="item.base=='知识百科'">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="size-4" aria-hidden="true">
<path d="M10 2a8 8 0 1 0 0 16 8 8 0 0 0 0-16zM5 9a1 1 0 1 1 2 0v4a1 1 0 1 1-2 0V9zM14.707 14.707l4.293 4.293a1 1 0 0 1-1.414 1.414l-4.293-4.293a5 5 0 1 1 1.414-1.414z"/>
</svg>
</template>
</button>
<!-- 点赞 -->
<button @click="like_it(item.path,item.name,item.base)" class="rounded-full p-1 text-neutral-600/75 hover:bg-zinc-900/10 hover:text-neutral-600 focus:outline-none focus-visible:text-neutral-600 focus-visible:zinc-300 focus-visible:outline-offset-0 focus-visible:outline-sky-700 active:bg-zinc-900/5 active:-outline-offset-2 dark:text-zinc-200/75 dark:hover:bg-zinc-50/10 dark:hover:text-zinc-200 dark:focus-visible:text-zinc-200 dark:focus-visible:outline-sky-600 dark:active:bg-zinc-50/5" title="点赞" aria-label="Like" >
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="size-4" aria-hidden="true">
<path d="M1 8.25a1.25 1.25 0 1 1 2.5 0v7.5a1.25 1.25 0 1 1-2.5 0v-7.5ZM11 3V1.7c0-.268.14-.526.395-.607A2 2 0 0 1 14 3c0 .995-.182 1.948-.514 2.826-.204.54.166 1.174.744 1.174h2.52c1.243 0 2.261 1.01 2.146 2.247a23.864 23.864 0 0 1-1.341 5.974C17.153 16.323 16.072 17 14.9 17h-3.192a3 3 0 0 1-1.341-.317l-2.734-1.366A3 3 0 0 0 6.292 15H5V8h.963c.685 0 1.258-.483 1.612-1.068a4.011 4.011 0 0 1 2.166-1.73c.432-.143.853-.386 1.011-.814.16-.432.248-.9.248-1.388Z"/>
</svg>
</button>
<!-- AI对话知识问答 -->
<button @click="ai_it(item.path,item.name,item.base)" class="rounded-full p-1 text-neutral-600/75 hover:bg-zinc-900/10 hover:text-neutral-600 focus:outline-none focus-visible:text-neutral-600 focus-visible:zinc-300 focus-visible:outline-offset-0 focus-visible:outline-sky-700 active:bg-zinc-900/5 active:-outline-offset-2 dark:text-zinc-200/75 dark:hover:bg-zinc-50/10 dark:hover:text-zinc-200 dark:focus-visible:text-zinc-200 dark:focus-visible:outline-sky-600 dark:active:bg-zinc-50/5" title="知识对话" aria-label="Like" >
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true" class="size-4">
<path d="M3.505 2.365A41.369 41.369 0 0 1 9 2c1.863 0 3.697.124 5.495.365 1.247.167 2.18 1.108 2.435 2.268a4.45 4.45 0 0 0-.577-.069 43.141 43.141 0 0 0-4.706 0C9.229 4.696 7.5 6.727 7.5 8.998v2.24c0 1.413.67 2.735 1.76 3.562l-2.98 2.98A.75.75 0 0 1 5 17.25v-3.443c-.501-.048-1-.106-1.495-.172C2.033 13.438 1 12.162 1 10.72V5.28c0-1.441 1.033-2.717 2.505-2.914Z" />
<path d="M14 6c-.762 0-1.52.02-2.271.062C10.157 6.148 9 7.472 9 8.998v2.24c0 1.519 1.147 2.839 2.71 2.935.214.013.428.024.642.034.2.009.385.09.518.224l2.35 2.35a.75.75 0 0 0 1.28-.531v-2.07c1.453-.195 2.5-1.463 2.5-2.915V8.998c0-1.526-1.157-2.85-2.729-2.936A41.645 41.645 0 0 0 14 6Z" />
</svg>
</button>
<button class="rounded-full p-1 text-neutral-600/75 hover:bg-zinc-900/10 hover:text-neutral-600 focus:outline-none focus-visible:text-neutral-600 focus-visible:zinc-300 focus-visible:outline-offset-0 focus-visible:outline-sky-700 active:bg-zinc-900/5 active:-outline-offset-2 dark:text-zinc-200/75 dark:hover:bg-zinc-50/10 dark:hover:text-zinc-200 dark:focus-visible:text-zinc-200 dark:focus-visible:outline-sky-600 dark:active:bg-zinc-50/5" :title="item.path">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="currentColor" class="size-4" aria-hidden="true">
<path d="M9.5 13a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0"/>
</svg>
</button>
</div>
</div>
</template>
</div>
</div>
</div>
<script>
async function search(key){
var rsp= await axios.get('/api/search?q='+key);
return rsp;
}
function query(){
return {
search: '',
count: "",
showList: false,
filteredItems:[],
fetchSomething() {
if (this.search==""){
this.showList=false;
this.filteredItems=[];
this.count="";
}else{
this.showList=true;
axios.get('/api/search?q='+this.search).then(response => {
//console.log('Data:', response.data);
this.filteredItems= response.data.data;
this.count="约查到 "+response.data.count+" 个文件";
}).catch(error => {
console.error('Error fetching data:', error);
throw error; // 重新抛出错误以便调用者可以处理
});
// var rsp =search(this.search);
// console.info(rsp);
}
},// fetchSomething
download(path,name,base){
if (base=="知识百科"){
window.open(`/ui/view.html?id=${path}`);
}else{
window.open(`/api/fd?path=${path}&filename=${name}&base=${base}`);
}
},
like_it(path,name,base){
axios.get(`/api/fd/like?path=${path}&filename=${name}&base=${base}`).then(response => {
}).catch(error => {
console.error('Error fetching data:', error);
throw error; // 重新抛出错误以便调用者可以处理
});
},
ai_it(path,name,base){
this.$store.nav.selectedTab='comments';
this.$store.nav.qItems=[];
this.$store.nav.Items=[];
this.$store.nav.ai_file={base:base,path:path,name:name};
//this.$store.nav.ai_tips=`你好,你选定了《${name}》文件,我可以根据文件内容回答你的问题。如文章的主要内容?文章的大纲?等`;
}
}
}
//内容信息
function info_t(){
return {
slides: [
{
imgSrc: 'images/default-slide-1.webp',
imgAlt: 'Vibrant abstract painting with swirling blue and light pink hues on a canvas.',
title: '知识搜索,在知识的海洋中荡漾',
description: 'The architects of the digital world, constantly battling against their mortal enemy browser compatibility.',
},
{
imgSrc: 'images/default-slide-2.webp',
imgAlt: 'Vibrant abstract painting with swirling red, yellow, and pink hues on a canvas.',
title: '知识对话,与智者同行成为智者',
description: 'Because not all superheroes wear capes, some wear headphones and stare at terminal screens',
},
{
imgSrc: 'images/default-slide-3.webp',
imgAlt: 'Vibrant abstract painting with swirling blue and purple hues on a canvas.',
title: '知识创作,创意无限智慧通天',
description: 'Where &quot;burnout&quot; is just a fancy term for &quot;Tuesday&quot;.'
},
],
currentSlideIndex: 1,
previous() {
if (this.currentSlideIndex > 1) {
this.currentSlideIndex = this.currentSlideIndex - 1
} else {
// If it's the first slide, go to the last slide
this.currentSlideIndex = this.slides.length
}
},
next() {
if (this.currentSlideIndex < this.slides.length) {
this.currentSlideIndex = this.currentSlideIndex + 1
} else {
// If it's the last slide, go to the first slide
this.currentSlideIndex = 1
}
},
count() {
axios.get('/api/count').then(response => {
let data_size = response.data.data_size;
let baike_count = response.data.baike_count;
let catalog_count = response.data.catalog_count;
let base_count = response.data.base_count;
let doc_count = response.data.doc_count;
let QA_count = response.data.QA_count;
let watch_sum = response.data.watch_sum;
//今日统计
let qa_cnt = response.data.qa_cnt;
let baike_cnt = response.data.baike_cnt;
let doc_cnt = response.data.doc_cnt;
let view_size = formatBytes(data_size);
this.slides[0].description=`目前共接入${base_count}个知识库,文档数量达到${doc_count}个,数据总量超过${view_size},今日更新${doc_cnt}个,汇聚让知识更好沉淀!`;
this.slides[1].description=`目前共计对话总数超过${QA_count}次,今日新增${qa_cnt}次,让人更方便的获取知识,让知识流动到每一个人的心里`;
this.slides[2].description=`目前共创建知识百科${baike_count}条,分类数量达到${catalog_count}个,总计浏览${watch_sum}次,今日更新${baike_cnt}条,创新让知识更有价值`;
}).catch(error => {
top.window.location.href="/ui/login.html";
});
},
init(){
this.count();
setInterval(() => {
this.next();
}, 10000);
//5分钟
setInterval(() => {
this.count();
}, 300000);
}
}
}
</script>