|
@@ -0,0 +1,153 @@
|
|
|
|
+import { View } from "@tarojs/components";
|
|
|
|
+import RoundedLabel from "../rounded-label";
|
|
|
|
+import IconFilterFeeds from "@/components/icon/IconFilterFeeds";
|
|
|
|
+import IconFilterBatch from "@/components/icon/IconFilterBatch";
|
|
|
|
+import IconFilterList from "@/components/icon/IconFilterList";
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+import Popup from "@/components/popup/popup";
|
|
|
|
+import WemetaSwitch from "@/components/wemeta-switch";
|
|
|
|
+import { useState } from "react";
|
|
|
|
+
|
|
|
|
+import ViewStyleListCorrection from '../view-style/ViewStyleListCorrection'
|
|
|
|
+
|
|
|
|
+import PickerSingleColumn from "@/components/Picker/PickerSingleColumn";
|
|
|
|
+import IconArrowDownRounded from '@/components/icon/IconArrowDownRounded';
|
|
|
|
+import { useUserStore } from "@/store/userStore";
|
|
|
|
+import { TEntItem } from "@/types/user";
|
|
|
|
+
|
|
|
|
+type TListStyle = "card" | "list";
|
|
|
|
+
|
|
|
|
+const Index = () => {
|
|
|
|
+ const ents = useUserStore(state => state.entList)
|
|
|
|
+ const [checked, setChecked] = useState(false);
|
|
|
|
+ const [showPopup, setShowPopup] = useState(false);
|
|
|
|
+ const [listStyle, setListStyle] = useState<TListStyle>("card");
|
|
|
|
+ const [current, setCurrent] = useState<TEntItem|string>('')
|
|
|
|
+
|
|
|
|
+ const handleListStyleChange = (listStyle: TListStyle) => {
|
|
|
|
+ setListStyle(listStyle);
|
|
|
|
+ };
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ // 当前选中的值
|
|
|
|
+ const options = ['个人知识库', ...ents.map( item => item.entName)]
|
|
|
|
+
|
|
|
|
+ // 如果没有当前企业,则默认第一个
|
|
|
|
+ if(!current){
|
|
|
|
+ setCurrent(options[0])
|
|
|
|
+ }
|
|
|
|
+ // 是否显示选择器
|
|
|
|
+ const [showPicker, setShowPicker] = useState(false)
|
|
|
|
+
|
|
|
|
+ // 当前选中的值
|
|
|
|
+ const [selected, setSelected] = useState(options[0])
|
|
|
|
+
|
|
|
|
+ const handleChange = (value: string) => {
|
|
|
|
+ setSelected(value)
|
|
|
|
+ const ent = ents.find(item=> item.entName === value)
|
|
|
|
+ if(ent){
|
|
|
|
+ setCurrent(ent)
|
|
|
|
+ }else{
|
|
|
|
+ setCurrent(value)
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ const renderContent = () => {
|
|
|
|
+ const entId = typeof current === 'string' ? undefined : current.entId
|
|
|
|
+ if(listStyle === 'card'){
|
|
|
|
+ return <ViewStyleListCorrection entId={entId} viewStyle="card"/>
|
|
|
|
+ }
|
|
|
|
+ return <ViewStyleListCorrection entId={entId} viewStyle="list"/>
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ return (
|
|
|
|
+ <>
|
|
|
|
+ <View className="pt-12 h-full">
|
|
|
|
+ <View className="rounded-container-header"></View>
|
|
|
|
+ <View className="px-16 pb-20">
|
|
|
|
+ <View className="pb-8">
|
|
|
|
+ <PickerSingleColumn options={options} selected={selected} onChange={handleChange} showPicker={showPicker} setShowPicker={setShowPicker}>
|
|
|
|
+ <View className="flex items-center gap-2 bg-gray-3 rounded-12 p-12 mb-16" onClick={() => setShowPicker(true)}>
|
|
|
|
+ <View className="flex-1 text-14 leading-22 text-gray-45">{selected}</View>
|
|
|
|
+ <View className="flex-center">
|
|
|
|
+ <IconArrowDownRounded/>
|
|
|
|
+ </View>
|
|
|
|
+ </View>
|
|
|
|
+ </PickerSingleColumn>
|
|
|
|
+ </View>
|
|
|
|
+ <View className="flex items-center">
|
|
|
|
+
|
|
|
|
+ <View className="flex-1 text-12 leading-20 text-gray-45">
|
|
|
|
+ {/* 共 {listStyle === 'chat' ? total : listTotalCount} 个文件 */}
|
|
|
|
+ </View>
|
|
|
|
+ <View className="flex items-center">
|
|
|
|
+ {listStyle === "card" ? (
|
|
|
|
+ <RoundedLabel
|
|
|
|
+ onClick={() => setShowPopup(true)}
|
|
|
|
+ text="信息流"
|
|
|
|
+ icon={IconFilterFeeds}
|
|
|
|
+ ></RoundedLabel>
|
|
|
|
+ ) : (
|
|
|
|
+ <>
|
|
|
|
+ <RoundedLabel
|
|
|
|
+ text="列表"
|
|
|
|
+ onClick={() => {
|
|
|
|
+ setShowPopup(true)
|
|
|
|
+ }}
|
|
|
|
+ icon={IconFilterList}
|
|
|
|
+ ></RoundedLabel>
|
|
|
|
+ </>
|
|
|
|
+ )}
|
|
|
|
+ </View>
|
|
|
|
+ </View>
|
|
|
|
+ </View>
|
|
|
|
+ <View className="px-16 h-full">
|
|
|
|
+ {renderContent()}
|
|
|
|
+ </View>
|
|
|
|
+ </View>
|
|
|
|
+
|
|
|
|
+ <Popup setShow={setShowPopup} show={showPopup} title="展示样式">
|
|
|
|
+ <View
|
|
|
|
+ className={`rounded-card ${
|
|
|
|
+ listStyle === "card" ? "rounded-card-actived" : ""
|
|
|
|
+ }`}
|
|
|
|
+ onClick={() => {
|
|
|
|
+ handleListStyleChange("card");
|
|
|
|
+ }}
|
|
|
|
+ >
|
|
|
|
+ <View className="border-bottom1-gray mb-12">
|
|
|
|
+ <View className="mb-8 text-14 font-medium leading-22">
|
|
|
|
+ 对话信息流
|
|
|
|
+ </View>
|
|
|
|
+ </View>
|
|
|
|
+ <View className="flex items-center">
|
|
|
|
+ <WemetaSwitch
|
|
|
|
+ checked={checked}
|
|
|
|
+ onChange={(checked) => setChecked(checked)}
|
|
|
|
+ ></WemetaSwitch>
|
|
|
|
+ </View>
|
|
|
|
+ </View>
|
|
|
|
+ <View
|
|
|
|
+ className={`rounded-card ${
|
|
|
|
+ listStyle === "list" ? "rounded-card-actived" : ""
|
|
|
|
+ }`}
|
|
|
|
+ onClick={() => {
|
|
|
|
+ handleListStyleChange("list");
|
|
|
|
+ }}
|
|
|
|
+ >
|
|
|
|
+ <View className="mb-8 text-14 font-medium leading-22">列表形式</View>
|
|
|
|
+ <View className="mb-12 text-12 leading-20 text-gray-45">
|
|
|
|
+ 将知识点以简洁列表呈现,清晰快速地提供信息。
|
|
|
|
+ </View>
|
|
|
|
+ </View>
|
|
|
|
+ </Popup>
|
|
|
|
+ </>
|
|
|
|
+ );
|
|
|
|
+};
|
|
|
|
+
|
|
|
|
+export default Index;
|