From a2c90214ad2d325c8b3d1ce1e0e0c3f66560ef76 Mon Sep 17 00:00:00 2001 From: luJianJun <2587063613@qq.com> Date: Wed, 23 Aug 2023 17:13:21 +0800 Subject: [PATCH] =?UTF-8?q?=E5=8E=86=E5=8F=B2=E8=AE=B0=E5=BD=95=E9=A1=B5?= =?UTF-8?q?=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../conversations/ConversationSidebar.tsx | 71 ++++++++------- .../conversations/ConversationSidebarItem.tsx | 2 + src/components/main/Conversation.tsx | 73 +++++++++------- src/components/ui/Sidebar.tsx | 4 +- src/pages/chat/components/dataList.tsx | 87 +++++++++++++++---- src/pages/chat/components/iframe.tsx | 19 ++++ src/pages/chat/components/listItem.tsx | 7 +- src/pages/chat/css/list.css | 17 ++++ src/pages/chat/datalist.astro | 21 ----- src/pages/chat/datalist.tsx | 23 +++++ src/pages/chat/ts/store.ts | 3 + src/pages/index.astro | 1 + 12 files changed, 221 insertions(+), 107 deletions(-) create mode 100644 src/pages/chat/components/iframe.tsx delete mode 100644 src/pages/chat/datalist.astro create mode 100644 src/pages/chat/datalist.tsx create mode 100644 src/pages/chat/ts/store.ts diff --git a/src/components/conversations/ConversationSidebar.tsx b/src/components/conversations/ConversationSidebar.tsx index 337dddd..5eadef4 100644 --- a/src/components/conversations/ConversationSidebar.tsx +++ b/src/components/conversations/ConversationSidebar.tsx @@ -6,12 +6,13 @@ import ConversationSidebarItem from './ConversationSidebarItem' import ConversationSidebarAdd from './ConversationSidebarAdd' import { addConversation } from '@/stores/conversation' import { showConversationEditModal } from '@/stores/ui' +import ChatList from '../../pages/chat/datalist' export default () => { const { t } = useI18n() const $conversationMapSortList = useStore(conversationMapSortList) - //设置副标题数字 + //设置副标题数字 const setNameNum = (setName: string, numList: any) => { let list = conversationMapSortList.get() let title = '' @@ -24,7 +25,7 @@ export default () => { count = Math.max(count, Number(num[0].replace('(', '').replace(')', ''))) } }) - title =count?`${setName}(${count + 1})`:`${setName}${numList.length>0?'(1)':''}` + title = count ? `${setName}(${count + 1})` : `${setName}${numList.length > 0 ? '(1)' : ''}` return title } @@ -36,46 +37,50 @@ export default () => { } } - onMount(() => { - setTimeout(() => { - let itemList = conversationMapSortList.get() - let setName = JSON.parse(sessionStorage.getItem('dialogueName') as any)||'未命名对话' - let numList: number[] = [] - itemList.map((res, i) => { - if (checkName(res.name, setName.name)) numList.push(i) - }) + // onMount(() => { + // return + // setTimeout(() => { + // let itemList = conversationMapSortList.get() + // let setName = JSON.parse(sessionStorage.getItem('dialogueName') as any) || '未命名对话' + // let numList: number[] = [] + // itemList.map((res, i) => { + // if (checkName(res.name, setName.name)) numList.push(i) + // }) - if(setName.switch){ - addConversation({name:setNameNum(setName.name, numList),systemInfo:setName.systemInfo}) - showConversationEditModal.set(true) - setName.switch=false - sessionStorage.setItem('dialogueName',JSON.stringify({name:setName.name,switch:false})) - } - }, 1000) - }) + // if (setName.switch) { + // addConversation({ name: setNameNum(setName.name, numList), systemInfo: setName.systemInfo }) + // showConversationEditModal.set(true) + // setName.switch = false + // sessionStorage.setItem('dialogueName', JSON.stringify({ name: setName.name, switch: false })) + // } + // }, 1000) + // }) return ( -
-
-

{t('conversations.title')}

-
- {/*
-
-
-
- - {instance => ( - - )} - + +
+ +
+
+ + {instance => ( + + )} + +
+
) } diff --git a/src/components/conversations/ConversationSidebarItem.tsx b/src/components/conversations/ConversationSidebarItem.tsx index 5eb18cf..6158059 100644 --- a/src/components/conversations/ConversationSidebarItem.tsx +++ b/src/components/conversations/ConversationSidebarItem.tsx @@ -3,6 +3,7 @@ import { currentConversationId, deleteConversationById } from '@/stores/conversa import { showConversationSidebar } from '@/stores/ui' import { useI18n } from '@/hooks' import type { Conversation } from '@/types/conversation' +import { chatShow } from '@/pages/chat/ts/store' interface Props { instance: Omit & { @@ -16,6 +17,7 @@ export default ({ instance }: Props) => { const isTouchDevice = 'ontouchstart' in document.documentElement || navigator.maxTouchPoints > 0 const handleClick = () => { + chatShow.set(false) currentConversationId.set(instance.id) showConversationSidebar.set(false) } diff --git a/src/components/main/Conversation.tsx b/src/components/main/Conversation.tsx index 62daa41..aab98c4 100644 --- a/src/components/main/Conversation.tsx +++ b/src/components/main/Conversation.tsx @@ -1,4 +1,4 @@ -import { Match, Switch, createEffect,onMount } from 'solid-js' +import { Match, Switch, createEffect, Show } from 'solid-js' import { useStore } from '@nanostores/solid' import { conversationMap, currentConversationId } from '@/stores/conversation' import { conversationMessagesMap } from '@/stores/messages' @@ -10,6 +10,8 @@ import Welcome from './Welcome' import Continuous from './Continuous' import Single from './Single' import Image from './Image' +import { chatShow } from '@/pages/chat/ts/store' +import Iframe from '@/pages/chat/components/iframe' export default () => { const { t } = useI18n() @@ -33,7 +35,7 @@ export default () => { createEffect(() => { const conversation = currentConversation() const currentDomain = window.location.hostname; - const contentDomain = currentDomain=='gtering.com'?'Gtering.com':'Ansnid.Com'; + const contentDomain = currentDomain == 'gtering.com' ? 'Gtering.com' : 'Ansnid.Com'; document.title = conversation ? `${(conversation.name || t('conversations.untitled'))} - ` + contentDomain : contentDomain const link = document.querySelector("link[rel~='icon']") as HTMLLinkElement @@ -43,34 +45,45 @@ export default () => { } }) + let chat: any = null + chat = useStore(chatShow) + return ( - - )} - > - - - - - - - - - - - - - + <> + + + )} + > + + + + + + + + + + + + + + + + + + + ) } diff --git a/src/components/ui/Sidebar.tsx b/src/components/ui/Sidebar.tsx index 51776a8..78c3e65 100644 --- a/src/components/ui/Sidebar.tsx +++ b/src/components/ui/Sidebar.tsx @@ -1,7 +1,8 @@ import type { JSXElement } from 'solid-js' +import '../../pages/chat/css/list.css' interface Props { - direction: 'left' | 'right' + direction: 'left' | 'right' | 'none' class?: string children: JSXElement } @@ -10,6 +11,7 @@ export default (props: Props) => { const containerBaseClass = { left: 'w-[260px] h-100dvh border-r', right: 'w-[300px] h-100dvh border-l', + none:'w-100' }[props.direction] return ( diff --git a/src/pages/chat/components/dataList.tsx b/src/pages/chat/components/dataList.tsx index 6cfe669..85ab385 100644 --- a/src/pages/chat/components/dataList.tsx +++ b/src/pages/chat/components/dataList.tsx @@ -3,12 +3,16 @@ import ConversationSidebarItem from './listItem' import { createStore } from "solid-js/store"; import '../css/list.css' import { fetchData } from '../../../http/api' - +import { addConversation } from '@/stores/conversation' +import { showConversationEditModal } from '@/stores/ui' +import { conversationMapSortList } from '@/stores/conversation' +import { chatShow,uniqid } from '../ts/store'; +import { showConversationSidebar } from '@/stores/ui' export default () => { // dataItemLists.set([{id:'1'},{id:'2'},{id:'3'},{id:'4'},{id:'5'},{id:'6'}]) const [list, setList] = createStore({ - data: [{title:''}] + data: [{ title: '' }] }) type errorObj = { @@ -33,14 +37,14 @@ export default () => { //标题 let dialogue = { - systemmessage:'', - title:'' + systemmessage: '', + title: '' } - //新建对话框 - const newlyAdded = () => { - window.open(`${location.protocol}//${location.host}`) - } + // //新建对话框 + // const newlyAdded = () => { + // window.open(`${location.protocol}//${location.host}`) + // } //删除记录 let deleteItem = { key: null, e: null } @@ -79,16 +83,54 @@ export default () => { setPop(!pop()) } + //设置副标题数字 + const setNameNum = (setName: string, numList: any) => { + let list = conversationMapSortList.get() + let title = '' + let count = 0 + numList.map((res: number) => { + let regex1 = new RegExp("" + setName + '\\(\\d+\\)', 'g') + let seachText = list[res].name.match(regex1) || 'null' + let num = seachText[0].match(/\(\d+\)/g) || 'null' + if (num !== 'null') { + count = Math.max(count, Number(num[0].replace('(', '').replace(')', ''))) + } + }) + title = count ? `${setName}(${count + 1})` : `${setName}${numList.length > 0 ? '(1)' : ''}` + return title + } + + //查重 + const checkName = (name: string, setName: string) => { + let setNameReg = new RegExp(setName, 'g') + if (setNameReg.test(name) && name.replace(/\(\d+\)/g, '') === setName) { + return true + } + } + //确认按钮 const determineBtn = () => { if (popType() === 'open') { - console.log(dialogue) - sessionStorage.setItem('dialogueName', JSON.stringify({ name: dialogue.title, switch: true,systemInfo:dialogue.systemmessage })) - if (isMobile()) { - location.pathname = '/' - } else { - newlyAdded() - } + sessionStorage.setItem('dialogueName', JSON.stringify({ name: dialogue.title, switch: true, systemInfo: dialogue.systemmessage })) + // if (isMobile()) { + // location.pathname = '/' + // } else { + // newlyAdded() + let itemList = conversationMapSortList.get() + let setName = JSON.parse(sessionStorage.getItem('dialogueName') as any) || '未命名对话' + let numList: number[] = [] + itemList.map((res, i) => { + if (checkName(res.name, setName.name)) numList.push(i) + }) + + if (setName.switch) { + addConversation({ name: setNameNum(setName.name, numList), systemInfo: setName.systemInfo }) + showConversationEditModal.set(true) + setName.switch = false + sessionStorage.setItem('dialogueName', JSON.stringify({ name: setName.name, switch: false })) + } + chatShow.set(false) + // } } else if (popType() === 'delete') { handleDelete(deleteItem['e'] as any, deleteItem['key'] as any) } @@ -104,6 +146,13 @@ export default () => { }) } + //查看记录内容 + const chatWatch = (id:string='')=>{ + chatShow.set(true) + showConversationSidebar.set(false) + uniqid.set(id) + } + //提示弹窗 const ErrorState = () => (
@@ -126,7 +175,7 @@ export default () => { }) return ( -
+
@@ -150,12 +199,12 @@ export default () => { -
-
+
+
{(instance, i) => ( - + )} diff --git a/src/pages/chat/components/iframe.tsx b/src/pages/chat/components/iframe.tsx new file mode 100644 index 0000000..edfcbe6 --- /dev/null +++ b/src/pages/chat/components/iframe.tsx @@ -0,0 +1,19 @@ +import { keys } from 'idb-keyval' +import '../css/list.css' +import { createSignal } from 'solid-js' +import { uniqid } from '@/pages/chat/ts/store' +import { useStore } from '@nanostores/solid' + +interface Props { + +} + +export default () => { + let id: any = '' + id = useStore(uniqid) as any + return ( +
+ +
+ ) +} diff --git a/src/pages/chat/components/listItem.tsx b/src/pages/chat/components/listItem.tsx index dc6099b..e2ff144 100644 --- a/src/pages/chat/components/listItem.tsx +++ b/src/pages/chat/components/listItem.tsx @@ -17,10 +17,11 @@ interface Props { setList: Function, infoList: any, popShow: Function, - setErrorFun:Function + setErrorFun:Function, + chatWatch:Function } -export default ({ instanceData, key, setList, infoList, popShow,setErrorFun }: Props) => { +export default ({ instanceData, key, setList, infoList, popShow,setErrorFun,chatWatch }: Props) => { //设置数据 const instanceItem = instanceData @@ -72,7 +73,7 @@ export default ({ instanceData, key, setList, infoList, popShow,setErrorFun }: P class={[ 'group fi h-10 my-0.5 px-2 gap-2 hv-base rounded-md' ].join(' ')} - onClick={()=>window.open(`${location.protocol}//${window.location.host}/share/?id=${ instance.uniqid }`)} + onClick={()=>chatWatch(instance.uniqid)} >
diff --git a/src/pages/chat/css/list.css b/src/pages/chat/css/list.css index 7540d46..53982a4 100644 --- a/src/pages/chat/css/list.css +++ b/src/pages/chat/css/list.css @@ -97,4 +97,21 @@ height:10rem; background:rgba(246, 246, 246, 1); width:100%; +} + +.chat-list-title{ + font-size:0.75rem; + line-height:1rem; + height:3.5rem; + text-transform:uppercase; + padding:0 1rem; + display: flex; + align-items: center; +} +.top-bor{ + border-top:1px solid #e9ecef; +} + +.chat-list-box{ + max-height:; } \ No newline at end of file diff --git a/src/pages/chat/datalist.astro b/src/pages/chat/datalist.astro deleted file mode 100644 index b435cbb..0000000 --- a/src/pages/chat/datalist.astro +++ /dev/null @@ -1,21 +0,0 @@ ---- -import Layout from '@/layouts/Layout.astro' -import Main from '@/components/Main.astro' -import ConversationSidebar from './components/dataList' -import ModalsLayer from '@/components/ModalsLayer' -import Sidebar from '@/components/ui/Sidebar' -import BuildStores from '@/components/client-only/BuildStores' -import './css/list.css' - ---- - - -
- - - - -
- - diff --git a/src/pages/chat/datalist.tsx b/src/pages/chat/datalist.tsx new file mode 100644 index 0000000..1036610 --- /dev/null +++ b/src/pages/chat/datalist.tsx @@ -0,0 +1,23 @@ +import ConversationSidebar from './components/dataList' +import Sidebar from '@/components/ui/Sidebar' +import './css/list.css' + +export default () => { + + return ( +
+
+ 分享历史记录 +
+
+ + + +
+ {/* + */} +
+ ) +} + + diff --git a/src/pages/chat/ts/store.ts b/src/pages/chat/ts/store.ts new file mode 100644 index 0000000..00a73bb --- /dev/null +++ b/src/pages/chat/ts/store.ts @@ -0,0 +1,3 @@ +import { atom } from 'nanostores'; +export const chatShow=atom(false) +export const uniqid=atom('') \ No newline at end of file diff --git a/src/pages/index.astro b/src/pages/index.astro index af9a3ee..cef4809 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -6,6 +6,7 @@ import Settings from '@/components/settings/SettingsSidebar' import ModalsLayer from '@/components/ModalsLayer' import Sidebar from '@/components/ui/Sidebar' import BuildStores from '@/components/client-only/BuildStores' + ---