Skip to content

P
poc-fe
Commit 533fb105 authored by nick zheng's avatar nick zheng
Browse files
Options

chore: 移动端应用页单位更换

parent a90eeca3
Show whitespace changes
Inline Side-by-side
Showing with 31 additions and 28 deletions
src/views/share/components/mobile/footer-input.vue
View file @ 533fb105
......@@ -458,7 +458,7 @@ defineExpose({
<template>
<div class="my-[7px]">
<div class="flex items-end gap-2.5">
<div class="flex items-end gap-[10px]">
<n-upload
:show-file-list="false"
accept=".doc, .pdf, .docx, .txt, .md"
......@@ -478,11 +478,11 @@ defineExpose({
"
@click="handleSelectFile(handleClick)"
>
<i class="iconfont icon-upload flex h-4 w-4 items-center justify-center" />
<i class="iconfont icon-upload flex h-[16px] w-[16px] items-center justify-center" />
</div>
</template>
<span class="text-xs"> {{ t('common_module.dialogue_module.upload_file_limit') }} </span>
<span class="text-[12px]"> {{ t('common_module.dialogue_module.upload_file_limit') }} </span>
</n-popover>
</n-upload-trigger>
</n-upload>
......@@ -505,11 +505,11 @@ defineExpose({
"
@click="handleSelectImage(handleClick)"
>
<i class="iconfont icon-upload-image flex h-4 w-4 items-center justify-center" />
<i class="iconfont icon-upload-image flex h-[16px] w-[16px] items-center justify-center" />
</div>
</template>
<span class="text-xs"> {{ t('common_module.dialogue_module.upload_image_limit') }} </span>
<span class="text-[12px]"> {{ t('common_module.dialogue_module.upload_image_limit') }} </span>
</n-popover>
</n-upload-trigger>
</n-upload>
......@@ -536,11 +536,11 @@ defineExpose({
<div
v-for="uploadImageItem in uploadImageList"
:key="uploadImageItem.id"
class="border-inactive-border-color relative mb-1.5 h-[48px] w-[48px] rounded-[10px] border bg-white"
class="border-inactive-border-color relative mb-[6px] h-[48px] w-[48px] rounded-[10px] border bg-white"
:class="{ 'border-[#F25744]!': uploadImageItem.status === UploadStatus.ERROR }"
>
<div
class="absolute right-[-4px] top-[-4px] flex h-4 w-4 cursor-pointer items-center justify-center rounded-full bg-[rgba(0,0,0,0.55)] hover:opacity-80"
class="absolute right-[-4px] top-[-4px] flex h-[16px] w-[16px] cursor-pointer items-center justify-center rounded-full bg-[rgba(0,0,0,0.55)] hover:opacity-80"
@click="handleRemoveUploadImage(uploadImageItem.id)"
>
<CloseSmall theme="outline" size="16" fill="#fff" />
......@@ -560,7 +560,7 @@ defineExpose({
</div>
</div>
<ul v-show="uploadFileList.length > 0" class="mb-1.5 grid gap-1.5">
<ul v-show="uploadFileList.length > 0" class="mb-[6px] grid gap-[6px]">
<li
v-for="uploadFileItem in uploadFileList"
:key="uploadFileItem.id"
......@@ -569,9 +569,9 @@ defineExpose({
>
<div class="flex w-full items-center justify-between">
<div class="flex w-full items-center overflow-hidden">
<img :src="uploadFileIcon(uploadFileItem.type!)" class="h-6 w-6" />
<img :src="uploadFileIcon(uploadFileItem.type!)" class="h-[24px] w-[24px]" />
<div class="mx-2 flex flex-1 flex-col overflow-hidden text-[12px]">
<div class="mx-[8px] flex flex-1 flex-col overflow-hidden text-[12px]">
<n-ellipsis>
{{ uploadFileItem.name }}
</n-ellipsis>
......@@ -580,7 +580,7 @@ defineExpose({
<n-progress
v-show="!['finished', 'error'].includes(uploadFileItem.status)"
class="left-13.5 w-[calc(100%-78px)]! absolute bottom-0"
class="w-[calc(100%-78px)]! absolute bottom-0 left-[54px]"
type="line"
rail-color="#F3F3F3"
:height="4"
......@@ -614,7 +614,7 @@ defineExpose({
:autosize="{ minRows: 1, maxRows: 5 }"
:placeholder="inputPlaceholder"
:disabled="!isLogin || isInputMessageDisabled"
class="question-textarea rounded-xl! shadow-[0_1px_#09122105,0_1px_1px_#09122105,0_3px_3px_#09122103,0_9px_9px_#09122103]! bg-[#F2F2F2]! min-h-[35px] pr-[50px]"
class="question-textarea rounded-[20px]! shadow-[0_1px_#09122105,0_1px_1px_#09122105,0_3px_3px_#09122103,0_9px_9px_#09122103]! bg-[#F2F2F2]! min-h-[35px] pr-[50px]"
@keydown="handleInputMessageEnter"
/>
<div
......@@ -634,10 +634,10 @@ defineExpose({
<div
v-show="!isLogin"
class="absolute left-3 top-[8px] flex h-[19px] max-w-[calc(100%-60px)] items-center overflow-hidden text-[12px] leading-[19px] text-[#84868c]"
class="absolute left-[12px] top-[8px] flex h-[19px] max-w-[calc(100%-60px)] items-center overflow-hidden text-[12px] leading-[19px] text-[#84868c]"
>
<span class="shrink-0">{{ t('share_agent_module.please') }}</span>
<span class="text-theme-color shrink-0 cursor-pointer px-1 hover:opacity-80" @click="handleToLogin">
<span class="text-theme-color shrink-0 cursor-pointer px-[4px] hover:opacity-80" @click="handleToLogin">
{{ t('common_module.login') }}
</span>
<span class="shrink-0">{{ t('share_agent_module.after_action') }}</span>
......@@ -647,7 +647,7 @@ defineExpose({
</div>
<div class="mt-[9px]">
<span class="flex w-full justify-center text-xs text-[#b8babf]">
<span class="flex w-full justify-center text-[12px] text-[#b8babf]">
{{ t('common_module.dialogue_module.generate_warning_message') }}
</span>
</div>
......
src/views/share/components/mobile/message-item.vue
View file @ 533fb105
......@@ -115,7 +115,7 @@ function handleShowReasoningContentSwitch() {
<!-- 模型内容 -->
<div class="flex min-w-[80px] max-w-full flex-col">
<div
class="w-full flex-wrap rounded-xl border px-4 px-[12px] py-[11px]"
class="w-full flex-wrap rounded-[10px] border px-[12px] py-[11px]"
:class="[
{ 'rounded-tr-none border-[#DCDEFF] bg-[#DCDEFF] text-white': role === 'user' },
{ 'rounded-tl-none border-[#e8e9eb] bg-white text-[#333]': role === 'assistant' },
......@@ -146,7 +146,7 @@ function handleShowReasoningContentSwitch() {
</span>
</div>
<div v-if="messageItem.isTextContentLoading" class="py-1.5 pl-4">
<div v-if="messageItem.isTextContentLoading" class="py-[6px] pl-[16px]">
<CustomLoading :active-color="'#000DFF'" />
</div>
......@@ -164,13 +164,16 @@ function handleShowReasoningContentSwitch() {
/>
</p>
<div v-show="isShowVoiceLoading || messageItem.isAnswerResponseLoading" class="mb-[5px] mt-4 px-4">
<div
v-show="isShowVoiceLoading || messageItem.isAnswerResponseLoading"
class="mb-[5px] mt-[16px] px-[16px]"
>
<CustomLoading :active-color="'#000DFF'" />
</div>
</div>
<!-- 移动端语音播放 -->
<div v-show="isShowAudioControl" class="mt-[13px] flex items-center gap-2">
<div v-show="isShowAudioControl" class="mt-[13px] flex items-center gap-[8px]">
<div
class="h-[18px] w-[18px] cursor-pointer"
:class="messageItem.isVoicePlaying ? 'bg-svg-pause' : 'bg-svg-play'"
......
src/views/share/components/mobile/message-list.vue
View file @ 533fb105
......@@ -60,7 +60,7 @@ function handleScrollToBottom() {
</script>
<template>
<main ref="scrollRef" class="h-full overflow-y-auto overflow-x-hidden px-5" @scroll="throttleScrollContainer">
<main ref="scrollRef" class="h-full overflow-y-auto overflow-x-hidden px-[20px]" @scroll="throttleScrollContainer">
<div>
<MessageItem
v-for="[key, messageItem] in messageList"
......@@ -73,7 +73,7 @@ function handleScrollToBottom() {
/>
</div>
<p v-show="isAnswerResponseLoading" class="my-[7px] ml-1 text-xs text-[#84868c]">
<p v-show="isAnswerResponseLoading" class="my-[7px] ml-[4px] text-[12px] text-[#84868c]">
{{ t('common_module.dialogue_module.do_not_exit_page') }}
</p>
......@@ -83,10 +83,10 @@ function handleScrollToBottom() {
<div
v-show="visible"
class="flex-center hover:text-theme-color absolute bottom-5 right-5 h-6 w-6 cursor-pointer rounded-full bg-white shadow-[0_0_0_1px_#ededed]"
class="flex-center hover:text-theme-color absolute bottom-[20px] right-[20px] h-[24px] w-[24px] cursor-pointer rounded-full bg-white shadow-[0_0_0_1px_#ededed]"
@click.stop="clickBackBottom"
>
<i class="iconfont icon-left rotate-270 text-sm" />
<i class="iconfont icon-left rotate-270 text-[14px]" />
</div>
</main>
</template>
src/views/share/components/mobile/page-header.vue
View file @ 533fb105
......@@ -56,7 +56,7 @@ function handleToLogout() {
<template>
<header class="flex h-[58px] w-full items-center justify-between px-[20px]">
<div>
<div v-show="isEnableVoice" class="flex items-center gap-2">
<div v-show="isEnableVoice" class="flex items-center gap-[8px]">
<span class="text-[12px]">{{ t('common_module.voice_auto_play') }}</span>
<n-switch
v-model:value="answerAudioAutoPlay"
......@@ -86,10 +86,10 @@ function handleToLogout() {
<NButton
v-show="!isLogin"
color="#EBECFF"
class="rounded-md! h-[28]! text-[12px]! min-w-[80px]! text-theme-color!"
class="rounded-md! h-[28px]! text-[12px]! min-w-[80px]! text-theme-color!"
@click="handleToLogin"
>
<span class="text-xs"> {{ t('common_module.login_now') }}</span>
{{ t('common_module.login_now') }}
</NButton>
<div v-show="isLogin" class="flex-center h-[28px] w-[28px] rounded-[5px] bg-[#EBECFF]">
......
src/views/share/share-application-mobile.vue
View file @ 533fb105
......@@ -406,14 +406,14 @@ function handleToLogoutPage() {
:is-answer-response-loading="isAnswerResponseLoading"
:create-continue-questions-exception="createContinueQuestionsException"
:is-answer-response-interrupt="isAnswerResponseInterrupt"
class="pt-5"
class="pt-[20px]"
@audio-play="handleAudioPlay"
@audio-pause="handleAudioPause"
/>
</div>
</div>
<div class="footer-operation bg-white px-4">
<div class="footer-operation bg-white px-[16px]">
<FooterInput
ref="footerInputRef"
v-model:is-answer-response-loading="isAnswerResponseLoading"
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment