fix: 修复页面间距
This commit is contained in:
parent
35bc2f99e6
commit
8a636bfde3
BIN
AIchat.rar
BIN
AIchat.rar
Binary file not shown.
@ -6,6 +6,7 @@
|
|||||||
"versionCode": "100",
|
"versionCode": "100",
|
||||||
"transformPx": false,
|
"transformPx": false,
|
||||||
"app-plus": {
|
"app-plus": {
|
||||||
|
|
||||||
"usingComponents": true,
|
"usingComponents": true,
|
||||||
"nvueStyleCompiler": "uni-app",
|
"nvueStyleCompiler": "uni-app",
|
||||||
"compilerVersion": 3,
|
"compilerVersion": 3,
|
||||||
|
@ -13,7 +13,7 @@
|
|||||||
<div
|
<div
|
||||||
class="flex-none flex items-center justify-between px-5 py-3 bg-white shadow-md h-10 pt-10 z-999"
|
class="flex-none flex items-center justify-between px-5 py-3 bg-white shadow-md h-10 pt-10 z-999"
|
||||||
>
|
>
|
||||||
<image src="/static/aichat/black.png" class="w-2 h-4" @click="goBack" />
|
<image src="/static/aichat/black.png" class="w-3 h-4" @click="goBack" />
|
||||||
<div class="text-lg font-medium ml-12">小墨</div>
|
<div class="text-lg font-medium ml-12">小墨</div>
|
||||||
<div class="flex items-center space-x-3">
|
<div class="flex items-center space-x-3">
|
||||||
<!-- v-if="rawList.length > 0" -->
|
<!-- v-if="rawList.length > 0" -->
|
||||||
@ -21,11 +21,12 @@
|
|||||||
<image src="/static/aichat/new.png" class="w-5 h-5" @click="newChat" />
|
<image src="/static/aichat/new.png" class="w-5 h-5" @click="newChat" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 消息区 -->
|
<!-- 消息区 -->
|
||||||
<div
|
<div
|
||||||
:class="[
|
:class="[
|
||||||
'flex relative p-b-10',
|
'flex relative p-b-10 box-border',
|
||||||
showActions ? (uploadList.length ? 'h-118' : 'h-137') : 'h-157',
|
showActions ? (uploadList.length ? 'h-118' : 'h-137') : 'h-167',
|
||||||
]"
|
]"
|
||||||
>
|
>
|
||||||
<!-- 背景层 -->
|
<!-- 背景层 -->
|
||||||
@ -45,33 +46,36 @@
|
|||||||
>
|
>
|
||||||
<div :class="['relative z-10 px-4 py-6', showActions ? 'mb--11 h-105' : 'mb--21 h-135']">
|
<div :class="['relative z-10 px-4 py-6', showActions ? 'mb--11 h-105' : 'mb--21 h-135']">
|
||||||
<template v-for="(msg, idx) in messages" :key="idx">
|
<template v-for="(msg, idx) in messages" :key="idx">
|
||||||
<view v-if="shouldShowTimestamp(idx)" class="text-center text-xs text-gray-500 my-2">
|
<view v-if="shouldShowTimestamp(idx)" class="text-center text-xs text-gray-500 mt--3">
|
||||||
{{ formatDayGroup(msg.timestamp) }}
|
{{ formatDayGroup(msg.timestamp) }}
|
||||||
</view>
|
</view>
|
||||||
<view
|
<view
|
||||||
class="flex items-start"
|
class="flex items-start"
|
||||||
:class="msg.role === 'assistant' ? 'justify-start' : 'justify-end'"
|
:class="msg.role === 'assistant' ? 'justify-start mt-0.3' : 'justify-end mt-2 '"
|
||||||
>
|
>
|
||||||
<image
|
<image
|
||||||
v-if="msg.role === 'assistant'"
|
v-if="msg.role === 'assistant'"
|
||||||
src="/static/aichat/logo-message.png"
|
src="/static/aichat/logo-message.png"
|
||||||
class="w-8 h-8 rounded-full mr-2 mt-1"
|
class="w-8 h-8 rounded-full mr-2 mt-1"
|
||||||
/>
|
/>
|
||||||
<view class="relative max-w-[54%] mt-4 mb-3">
|
<view
|
||||||
|
class="relative max-w-[76.5%] mt-5"
|
||||||
|
:class="idx === messages.length - 1 ? 'mb-10' : 'mb-3'"
|
||||||
|
>
|
||||||
<view
|
<view
|
||||||
:class="[
|
:class="[
|
||||||
'absolute -top-4 text-xs text-gray-400 w-20 text-right',
|
'absolute -top-5 text-xs text-gray-400 w-20 text-right',
|
||||||
msg.role === 'assistant' ? 'left-0' : 'right-0',
|
msg.role === 'assistant' ? 'left--4' : 'right-0',
|
||||||
]"
|
]"
|
||||||
>
|
>
|
||||||
{{ formatTimeShort(msg.timestamp) }}
|
{{ formatTimeShort(msg.timestamp) }}
|
||||||
</view>
|
</view>
|
||||||
<view
|
<view
|
||||||
:class="[
|
:class="[
|
||||||
'py-2 pl-2 rounded-md break-words mt-1',
|
'py-3 pl-3 rounded-md break-words mb-3 tracking-[2rpx] ',
|
||||||
msg.role === 'assistant'
|
msg.role === 'assistant'
|
||||||
? 'bg-[#f9f8fd] text-black shadow pb-1'
|
? 'bg-[#f9f8fd] text-black shadow '
|
||||||
: 'bg-[#45299e] text-white',
|
: 'bg-[#45299e] text-white ',
|
||||||
]"
|
]"
|
||||||
>
|
>
|
||||||
<!-- 图片消息 -->
|
<!-- 图片消息 -->
|
||||||
@ -148,12 +152,12 @@
|
|||||||
</view>
|
</view>
|
||||||
<view
|
<view
|
||||||
v-if="msg.role === 'assistant' && msg.type === 'text'"
|
v-if="msg.role === 'assistant' && msg.type === 'text'"
|
||||||
class="absolute bottom-0 flex space-x-3 ml-1 mb--5.5"
|
class="absolute bottom--3.5 flex space-x-3 ml-1"
|
||||||
>
|
>
|
||||||
<image src="/static/aichat/copy.png" class="w-4 h-4" @click="copyText(msg)" />
|
<image src="/static/aichat/copy.png" class="w-4 h-4" @click="copyText(msg)" />
|
||||||
<image
|
<image
|
||||||
src="/static/aichat/resect.png"
|
src="/static/aichat/resect.png"
|
||||||
class="w-4 h-4"
|
class="w-4.3 h-4"
|
||||||
@click="refreshText(msg)"
|
@click="refreshText(msg)"
|
||||||
/>
|
/>
|
||||||
</view>
|
</view>
|
||||||
@ -503,11 +507,12 @@ const refreshToken = ref<string>('')
|
|||||||
const statusBarHeight = ref<number>(0)
|
const statusBarHeight = ref<number>(0)
|
||||||
const mask = ref('')
|
const mask = ref('')
|
||||||
// ---- 页面初始化 ----
|
// ---- 页面初始化 ----
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
// 1. 定义一个 init 函数,拿 Extras 并依次调用接口
|
// 1. 定义一个 init 函数,拿 Extras 并依次调用接口
|
||||||
|
|
||||||
const init = async () => {
|
const init = async () => {
|
||||||
const wv = plus.webview.currentWebview()
|
const wv = plus.webview.currentWebview()
|
||||||
|
|
||||||
token.value = wv.token || uni.getStorageSync('token') || import.meta.env.VITE_DEV_TOKEN
|
token.value = wv.token || uni.getStorageSync('token') || import.meta.env.VITE_DEV_TOKEN
|
||||||
userInfo.value = JSON.parse(wv.userInfo) || {}
|
userInfo.value = JSON.parse(wv.userInfo) || {}
|
||||||
refreshToken.value = wv.refreshToken || uni.getStorageSync('refreshToken')
|
refreshToken.value = wv.refreshToken || uni.getStorageSync('refreshToken')
|
||||||
@ -517,29 +522,31 @@ onMounted(() => {
|
|||||||
await createChatSession()
|
await createChatSession()
|
||||||
await fetchHistoryList()
|
await fetchHistoryList()
|
||||||
}
|
}
|
||||||
|
|
||||||
// 2. 如果在 Plus 环境里,等 plusready
|
|
||||||
if (window.plus && plus.webview) {
|
|
||||||
document.addEventListener('plusready', init, false)
|
|
||||||
// plusready 可能已经触发过,直接再调用一次以防万一
|
|
||||||
if (plus.webview.currentWebview()) {
|
|
||||||
init()
|
init()
|
||||||
}
|
|
||||||
}
|
|
||||||
// 3. 普通 H5 调试,直接从 storage/SystemInfo 拿
|
|
||||||
else {
|
|
||||||
token.value = import.meta.env.VITE_DEV_TOKEN || uni.getStorageSync('token') || wv.token
|
|
||||||
userInfo.value = uni.getStorageSync('userInfo')
|
|
||||||
refreshToken.value = uni.getStorageSync('refreshToken')
|
|
||||||
statusBarHeight.value = uni.getSystemInfoSync().statusBarHeight
|
|
||||||
|
|
||||||
createChatSession().then(fetchHistoryList)
|
// // 2. 如果在 Plus 环境里,等 plusready
|
||||||
}
|
// if (window.plus && plus.webview) {
|
||||||
|
// document.addEventListener('plusready', init, false)
|
||||||
|
// // plusready 可能已经触发过,直接再调用一次以防万一
|
||||||
|
// if (plus.webview.currentWebview()) {
|
||||||
|
// init()
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// // 3. 普通 H5 调试,直接从 storage/SystemInfo 拿
|
||||||
|
// else {
|
||||||
|
// token.value = uni.getStorageSync('token') || import.meta.env.VITE_DEV_TOKEN
|
||||||
|
// userInfo.value = uni.getStorageSync('userInfo')
|
||||||
|
// refreshToken.value = uni.getStorageSync('refreshToken')
|
||||||
|
// statusBarHeight.value = uni.getSystemInfoSync().statusBarHeight
|
||||||
|
// createChatSession().then(fetchHistoryList)
|
||||||
|
// }
|
||||||
})
|
})
|
||||||
|
|
||||||
function scrollToBottom() {
|
function scrollToBottom() {
|
||||||
const el = scrollEl.value!
|
const el = scrollEl.value!
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
|
// el.scrollTo({ top: el.scrollHeight, behavior: 'smooth' })
|
||||||
|
console.log(el.scrollHeight, 'el.scrollHeight')
|
||||||
el.scrollTo({ top: el.scrollHeight, behavior: 'smooth' })
|
el.scrollTo({ top: el.scrollHeight, behavior: 'smooth' })
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user