Mirrors/coco-app
1
0
Fork 0
mirror of https://github.com/infinilabs/coco-app.git synced 2025-12-16 11:37:47 +01:00
Code Issues Packages Projects Releases Wiki Activity

chore: add ellipsis to display more categories (#108)

Browse Source 
* chore: add ellipsis to display more categories

* chore: modify css

* chore: search list right css

* chore: search list right css
This commit is contained in:
BiggerRain
2025-01-22 12:33:29 +08:00
committed by GitHub
parent cb4f1ac4b1
commit 9f0dcbc3dd
5 changed files with 114 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

105
src/components/AppAI/DropdownList.tsx
View File

@@ -262,7 +262,7 @@ function DropdownList({
) : null}
{Object.entries(SearchData).map(([sourceName, items]) => (
<div key={sourceName}>
{items.length > 2 ? (
{Object.entries(SearchData).length < 5 ? (
<div className="p-2 text-xs text-[#999] dark:text-[#666] flex items-center gap-2.5 relative">
<img className="w-4 h-4" src={getTypeIcon(items[0])} alt="icon" />
{sourceName}
@@ -298,7 +298,7 @@ function DropdownList({
selected(item);
}
}}
className={`w-full px-2 py-2.5 text-sm flex items-center justify-between rounded-lg transition-colors ${
className={`w-full px-2 py-2.5 text-sm flex gap-7 items-center justify-between rounded-lg transition-colors ${
isSelected
? "text-white bg-[#950599] hover:bg-[#950599]"
: "text-[#333] dark:text-[#d8d8d8]"
@@ -314,41 +314,86 @@ function DropdownList({
{item?._source?.title}
</span>
</div>
<div className="flex-1 min-w-[180px] h-full text-[12px] flex gap-2 items-center justify-end relative">
<span
className={`text-[12px] truncate ${
isSelected
? "text-[#DCDCDC]"
: "text-[#999] dark:text-[#666]"
}`}
>
{(item?._source?.category || "") +
(item?._source?.subcategory
? `/${item?._source?.subcategory}`
: "")}
</span>
<div className="flex-1 text-right min-w-[160px] h-full pl-5 text-[12px] flex gap-2 items-center justify-end relative">
{Object.entries(SearchData).length < 5 ? null : (
<img
className="w-4 h-4 cursor-pointer"
src={getTypeIcon(item)}
alt="icon"
onClick={(e) => {
e.stopPropagation();
goToTwoPage(item);
}}
/>
)}
{item?._source?.rich_categories ? (
<div className="truncate flex gap-2">
<img
className="w-4 h-4 cursor-pointer"
src={getRichIcon(item)}
alt="icon"
onClick={(e) => {
e.stopPropagation();
goToTwoPage(item);
}}
/>
{item?._source?.rich_categories?.map((rich_item: any) => (
<div className="flex items-center justify-end max-w-[calc(100%-20px)] whitespace-nowrap">
{Object.entries(SearchData).length < 5 ? (
<img
className="w-4 h-4 mr-2 cursor-pointer"
src={getRichIcon(item)}
alt="icon"
onClick={(e) => {
e.stopPropagation();
goToTwoPage(item);
}}
/>
) : null}
<span
className={`${
isSelected ? "text-[#C8C8C8]" : "text-[#666]"
} text-right truncate`}
>
{item?._source?.rich_categories?.map(
(rich_item: any, index: number) => {
if (
item?._source?.rich_categories.length > 2 &&
index ===
item?._source?.rich_categories.length - 1
)
return "";
else
return (
(index !== 0 ? "/" : "") + rich_item?.label
);
}
)}
</span>
{item?._source?.rich_categories.length > 2 ? (
<span
className={`${
isSelected ? "text-[#C8C8C8]" : "text-[#666]"
} text-right mr-1`}
} text-right truncate`}
>
{rich_item?.label}
{"/" + item?._source?.rich_categories?.at(-1)?.label}
</span>
))}
) : null}
</div>
) : null}
) : item?._source?.category || item?._source?.subcategory ? (
<span
className={`text-[12px] truncate ${
isSelected
? "text-[#DCDCDC]"
: "text-[#999] dark:text-[#666]"
}`}
>
{(item?._source?.category || "") +
(item?._source?.subcategory
? `/${item?._source?.subcategory}`
: "")}
</span>
) : (
<span
className={`text-[12px] truncate ${
isSelected
? "text-[#DCDCDC]"
: "text-[#999] dark:text-[#666]"
}`}
>
{item?._source?.type || ""}
</span>
)}
{isSelected ? (
<div

4
src/components/AppAI/Search.tsx
View File

@@ -8,7 +8,7 @@ import Footer from "./Footer";
import { tauriFetch } from "@/api/tauriFetchClient";
import noDataImg from "@/assets/coconut-tree.png";
import { useAppStore } from "@/stores/appStore";
// import { res_search } from "@/mock/index";
// import { res_search2 } from "@/mock/index";
import { SearchResults } from "../SearchChat/SearchResults";
import { useSearchStore } from "@/stores/searchStore";
@@ -62,7 +62,7 @@ function Search({ isChatMode, input }: SearchProps) {
if (!input) return;
//
// mock
// let list = res_search?.hits?.hits;
// let list = res_search2?.hits?.hits;
// setSuggests(list);
// const search_data = list.reduce((acc: any, item) => {
// const name = item._source.source.name;

2
src/main.css
View File

@@ -191,7 +191,7 @@
border: 0px;
padding: 2px;
background: var(--docsearch-key-gradient);
/* box-shadow: var(--docsearch-key-shadow); */
box-shadow: var(--docsearch-key-shadow);
color: var(--docsearch-muted-color);
}

33
src/mock/index.ts
View File

File diff suppressed because one or more lines are too long

6
tailwind.config.js
View File

@@ -34,9 +34,9 @@ export default {
"window-custom": "0px 16px 32px 0px rgba(0,0,0,0.3)",
},
zIndex: {
100: '100',
1000: '1000',
2000: '2000',
100: "100",
1000: "1000",
2000: "2000",
},
},
},