历史记录页修改

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(() => {
+  // onMount(() => {
-    setTimeout(() => {
+  //   return
-      let itemList = conversationMapSortList.get()
+  //   setTimeout(() => {
-      let setName = JSON.parse(sessionStorage.getItem('dialogueName') as any)||'未命名对话'
+  //     let itemList = conversationMapSortList.get()
-      let numList: number[] = []
+  //     let setName = JSON.parse(sessionStorage.getItem('dialogueName') as any) || '未命名对话'
-      itemList.map((res, i) => {
+  //     let numList: number[] = []
-        if (checkName(res.name, setName.name)) numList.push(i)
+  //     itemList.map((res, i) => {
-      })
+  //       if (checkName(res.name, setName.name)) numList.push(i)
+  //     })
 
-      if(setName.switch){
+  //     if (setName.switch) {
-        addConversation({name:setNameNum(setName.name, numList),systemInfo:setName.systemInfo})
+  //       addConversation({ name: setNameNum(setName.name, numList), systemInfo: setName.systemInfo })
-        showConversationEditModal.set(true)
+  //       showConversationEditModal.set(true)
-        setName.switch=false
+  //       setName.switch = false
-        sessionStorage.setItem('dialogueName',JSON.stringify({name:setName.name,switch:false}))
+  //       sessionStorage.setItem('dialogueName', JSON.stringify({ name: setName.name, switch: false }))
-      }
+  //     }
-    }, 1000)
+  //   }, 1000)
-  })
+  // })
 
   return (
-    <div class="h-full flex flex-col bg-sidebar">
+    <div style={{height:'100vh'}}>
-      <header class="h-14 fi justify-between px-4 text-xs uppercase">
+      <div class="h-full flex flex-col bg-sidebar" style={{height:'50%',overflow:'auto'}}>
-        <p class="px-2">{t('conversations.title')}</p>
+        <header class="h-14 fi justify-between px-4 text-xs uppercase">
-        <div class="fi gap-1">
+          <p class="px-2">{t('conversations.title')}</p>
-          {/* <Button
+          <div class="fi gap-1">
+            {/* <Button
             icon="i-carbon-search"
             onClick={() => {}}
             size="sm"
           /> */}
-          <ConversationSidebarAdd />
+            <ConversationSidebarAdd />
-        </div>
+          </div>
-      </header>
+        </header>
-      <div class="flex-1 overflow-auto">
+        <div class="flex-1 overflow-auto">
-        <div class="px-2">
+          <div class="px-2">
-          <For each={$conversationMapSortList()}>
+            <For each={$conversationMapSortList()}>
-            {instance => (
+              {instance => (
-              <ConversationSidebarItem instance={instance} />
+                <ConversationSidebarItem instance={instance} />
-            )}
+              )}
-          </For>
+            </For>
+          </div>
         </div>
       </div>
+      <ChatList></ChatList>
     </div>
   )
 }

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<Conversation, 'messages'> & {
@@ -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)
   }

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 (
-    <Switch
+    <>
-      fallback={(
+      <Show when={!chat()}>
-        <Welcome />
+        <Switch
-      )}
+          fallback={(
-    >
+            <Welcome />
-      <Match when={$currentConversationId() && !currentConversationMessages().length}>
+          )}
-        <ConversationEmpty conversation={currentConversation()} />
+        >
-      </Match>
+          <Match when={$currentConversationId() && !currentConversationMessages().length}>
-      <Match when={currentBot()?.type === 'chat_continuous'}>
+            <ConversationEmpty conversation={currentConversation()} />
-        <Continuous
+          </Match>
-          conversationId={$currentConversationId()}
+          <Match when={currentBot()?.type === 'chat_continuous'}>
-          messages={currentConversationMessages}
+            <Continuous
-        />
+              conversationId={$currentConversationId()}
-      </Match>
+              messages={currentConversationMessages}
-      <Match when={currentBot()?.type === 'chat_single'}>
+            />
-        <Single
+          </Match>
-          conversationId={$currentConversationId()}
+          <Match when={currentBot()?.type === 'chat_single'}>
-          messages={currentConversationMessages}
+            <Single
-        />
+              conversationId={$currentConversationId()}
-      </Match>
+              messages={currentConversationMessages}
-      <Match when={currentBot()?.type === 'image_generation'}>
+            />
-        <Image
+          </Match>
-          // conversationId={$currentConversationId()}
+          <Match when={currentBot()?.type === 'image_generation'}>
-          messages={currentConversationMessages}
+            <Image
-          // fetching={isLoading() || !isStreaming()}
+              // conversationId={$currentConversationId()}
-        />
+              messages={currentConversationMessages}
-      </Match>
+            // fetching={isLoading() || !isStreaming()}
-    </Switch>
+            />
+          </Match>
+        </Switch>
+      </Show>
+      <Show when={chat()}>
+        <Iframe></Iframe>
+      </Show>
+    </>
+
   )
 }

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 (

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:'',
+        systemmessage: '',
-        title:''
+        title: ''
     }
 
-    //新建对话框
+    // //新建对话框
-    const newlyAdded = () => {
+    // const newlyAdded = () => {
-        window.open(`${location.protocol}//${location.host}`)
+    //     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 }))
-            sessionStorage.setItem('dialogueName', JSON.stringify({ name: dialogue.title, switch: true,systemInfo:dialogue.systemmessage }))
+            // if (isMobile()) {
-            if (isMobile()) {
+            //     location.pathname = '/'
-                location.pathname = '/'
+            // } else {
-            } else {
+                // newlyAdded()
-                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 = () => (
         <div class='tps-error-box'>
@@ -126,7 +175,7 @@ export default () => {
     })
 
     return (
-        <div class="h-full flex flex-col bg-sidebar max-w-350 min-w-260">
+        <div class="h-full flex flex-col bg-sidebar">
             <Show when={pop()}>
                 <div class='pop center-f'>
                     <div class='center-f text-box'>
@@ -150,12 +199,12 @@ export default () => {
             <Show when={errorShow().show}>
                 <ErrorState />
             </Show>
-            <div class="flex-1 overflow-auto">
+            <div class="overflow-auto">
-                <div class="px-2">
+                <div style={{ width: '100%' }}>
                     <For each={list.data}>
                         {(instance, i) => (
                             <Show when={instance.title}>
-                                <ConversationSidebarItem popShow={popShow} setErrorFun={setErrorFun} instanceData={{ ...instance }} infoList={list.data} key={i as any} setList={setList} />
+                                <ConversationSidebarItem chatWatch={chatWatch} popShow={popShow} setErrorFun={setErrorFun} instanceData={{ ...instance }} infoList={list.data} key={i as any} setList={setList} />
                             </Show>
                         )}
                     </For>

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 (
+        <div style={{width:'100%',height:'100%'}}>
+            <iframe src={`https://ansnid.com/share/?id=${id()}`} style={{width:'100%',height:'100%'}}></iframe>
+        </div>
+    )
+}

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)}
         >
             <div class="fcc w-8 h-8 rounded-full text-xl shrink-0">
                 <div class="text-base i-carbon-chat" />

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:;
 }

src/pages/chat/datalist.astro

@@ -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'
-
----
-
-<Layout title="Ansnid">
-    <div class="h-100vh w-screen flex">
-      <Sidebar direction="left" class='w-100'>
-        <ConversationSidebar client:only="solid-js" />
-      </Sidebar>
-      <!-- <Main /> -->
-    </div>
-    <!-- <ModalsLayer client:only />
-    <BuildStores client:only /> -->
-</Layout>

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 (
+    <div class='top-bor' style={{height:'50%',overflow:'auto'}}>
+      <div class='chat-list-title'>
+        分享历史记录
+      </div>
+      <div class="flex">
+        <Sidebar direction="none" class=''>
+          <ConversationSidebar />
+        </Sidebar>
+      </div>
+      {/* <ModalsLayer />
+      <BuildStores/> */}
+    </div>
+  )
+}
+
+

src/pages/chat/ts/store.ts

@@ -0,0 +1,3 @@
+import { atom } from 'nanostores';
+export const chatShow=atom(false)
+export const uniqid=atom('')

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'
+
 ---
 
 <Layout title="Ansnid">