hyperzlib
/
IsekaiAIToolbox-frontend
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

升级ionic版本，修改样式

Browse Source
master
落雨楓 3 weeks ago
parent b737cd3659
commit 963373647f
10 changed files with 4913 additions and 1779 deletions
Show Stats Download Patch File Download Diff File

6531
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

36
package.json
Unescape Escape View File

@ -12,8 +12,10 @@
"lint": "eslint"
},
"dependencies": {
"@ionic/vue": "^7.0.14",
"@ionic/vue-router": "^7.0.14",
"@ionic/vue": "^8.0.0",
"@ionic/vue-router": "^8.0.0",
"vue": "^3.3.0",
"vue-router": "^4.2.0",
"axios": "^1.3.6",
"github-markdown-css": "^5.2.0",
"highlight.js": "^11.7.0",
@ -22,28 +24,30 @@
"lru-cache": "^10.0.0",
"markdown-it": "^13.0.1",
"pinia": "^2.0.36",
"pinia-plugin-persist": "^1.0.0",
"vue": "^3.3.4",
"vue-router": "^4.1.6",
"pinia-plugin-persist": "*",
"vue-virtual-scroller": "^2.0.0-beta.8"
},
"devDependencies": {
"@types/markdown-it": "^12.2.3",
"@capacitor/cli": "7.0.1",
"@vitejs/plugin-legacy": "^5.0.0",
"@vitejs/plugin-vue": "^4.0.0",
"@vue/eslint-config-typescript": "^11.0.2",
"@vue/runtime-core": "^3.3.4",
"@vue/eslint-config-typescript": "^12.0.0",
"@vue/test-utils": "^2.3.0",
"cypress": "^12.7.0",
"cypress": "^13.5.0",
"eslint": "^8.35.0",
"eslint-plugin-vue": "^9.9.0",
"jsdom": "^21.1.0",
"jsdom": "^22.1.0",
"terser": "^5.4.0",
"typescript": "~5.6.2",
"vite": "~5.2.0",
"vitest": "^0.34.6",
"vue-tsc": "^2.1.10",
"@types/markdown-it": "^12.2.3",
"sass": "^1.62.0",
"typescript": "^5.1.3",
"unplugin-auto-import": "^0.15.3",
"unplugin-vue-components": "^0.24.1",
"vite": "^4.1.0",
"vitest": "^0.29.2",
"vue-tsc": "^1.0.24"
"unplugin-auto-import": "^*",
"unplugin-vue-components": "*",
"vite-plugin-windicss": "^1.9.4",
"windicss": "^3.5.6"
},
"description": "An Ionic project"
}

1
src/auto-imports.d.ts vendored
Unescape Escape View File

@ -45,7 +45,6 @@ declare global {
const toRaw: typeof import('vue')['toRaw']
const toRef: typeof import('vue')['toRef']
const toRefs: typeof import('vue')['toRefs']
const toValue: typeof import('vue')['toValue']
const triggerRef: typeof import('vue')['triggerRef']
const unref: typeof import('vue')['unref']
const useAttrs: typeof import('vue')['useAttrs']

99
src/components/ChatMessage.vue
Unescape Escape View File

@ -43,32 +43,32 @@ const displayTime = computed(() => {
<template>
<div class="message-container" :class="{ assistant: props.assistant }">
<div class="message container">
<div class="avatar-col">
<div class="message-avatar">
<ion-avatar class="avatar">
<img :src="props.avatar" />
</ion-avatar>
</div>
<div class="message-content">
<div class="message-header">
<div class="header-left text-selectable">
<span class="message-sender">{{ props.sender }}</span>
<span class="message-time">{{ displayTime }}</span>
</div>
<div class="header-right" v-if="props.msgId || props.error">
<ion-button fill="clear" size="small" color="primary" v-if="props.edit" @click="emit('clickEdit')">
<ion-icon slot="start" :icon="createOutline"></ion-icon>
<ion-label>编辑</ion-label>
</ion-button>
<ion-button fill="clear" size="small" color="primary" v-if="props.change" @click="emit('clickChange')">
<ion-icon slot="start" :icon="reloadOutline"></ion-icon>
<ion-label>{{ props.error ? "重试" : "换一个" }}</ion-label>
</ion-button>
<ion-button fill="clear" size="small" color="primary" v-if="props.assistant && !props.error" @click="emit('clickCreateBranch')">
<ion-icon slot="start" :icon="gitNetworkOutline"></ion-icon>
<ion-label>创建分支</ion-label>
</ion-button>
</div>
<div class="message-header">
<div class="header-left text-selectable">
<span class="message-sender">{{ props.sender }}</span>
<span class="message-time">{{ displayTime }}</span>
</div>
<div class="header-right" v-if="props.msgId || props.error">
<ion-button fill="clear" size="small" color="primary" v-if="props.edit" @click="emit('clickEdit')">
<ion-icon slot="start" :icon="createOutline"></ion-icon>
<ion-label>编辑</ion-label>
</ion-button>
<ion-button fill="clear" size="small" color="primary" v-if="props.change" @click="emit('clickChange')">
<ion-icon slot="start" :icon="reloadOutline"></ion-icon>
<ion-label>{{ props.error ? "重试" : "换一个" }}</ion-label>
</ion-button>
<ion-button fill="clear" size="small" color="primary" v-if="props.assistant && !props.error" @click="emit('clickCreateBranch')">
<ion-icon slot="start" :icon="gitNetworkOutline"></ion-icon>
<ion-label>创建分支</ion-label>
</ion-button>
</div>
</div>
<div class="message-content">
<div class="message-body">
<markdown-parser v-if="props.content !== undefined" :md="props.content" :cursor="props.cursor"></markdown-parser>
<div class="message-error text-selectable" v-else-if="props.error">
@ -76,7 +76,6 @@ const displayTime = computed(() => {
</div>
</div>
</div>
<div class="avatar-fill"></div>
</div>
</div>
</template>
@ -94,30 +93,30 @@ const displayTime = computed(() => {
}
.message {
display: flex;
flex-direction: row;
gap: 16px;
display: grid;
grid-template-areas: "avatar-col message-header avatar-balance" "avatar-col message-content avatar-balance";
grid-template-columns: 46px 1fr 46px;
grid-template-rows: auto auto;
column-gap: 16px;
row-gap: 8px;
padding-top: 16px;
padding-bottom: 16px;
.avatar-col,
.avatar-fill {
flex: 0 0;
@media (max-width: 767px) {
grid-template-areas: "avatar-col message-header" "message-content message-content";
grid-template-columns: auto 1fr;
grid-template-rows: auto auto;
}
.avatar-fill {
width: 0;
flex-basis: 0;
}
@media (min-width: 768px) {
.avatar-fill {
width: 48px;
flex-basis: 48px;
}
.message-avatar {
grid-area: avatar-col;
display: flex;
justify-content: center;
align-items: flex-start;
}
.message-header {
grid-area: message-header;
display: flex;
justify-content: space-between;
align-items: center;
@ -127,12 +126,30 @@ const displayTime = computed(() => {
display: flex;
align-items: center;
gap: 8px;
}
>.header-right {
display: flex;
flex-direction: row;
}
@media (max-width: 767px) {
@media (max-width: 767px) {
align-items: flex-start;
>.header-left {
flex-direction: column;
align-items: flex-start;
gap: 4px;
}
>.header-right {
flex-direction: column;
ion-button {
margin: 0;
}
}
}
.message-sender {
@ -149,7 +166,7 @@ const displayTime = computed(() => {
}
.message-content {
flex: 1 1;
grid-area: message-content;
width: 100%;
}

8
src/components/ConversationList.vue
Unescape Escape View File

@ -301,7 +301,7 @@ onMounted(async () => {
</div>
<h2>{{ p.title || "无标题" }}</h2>
</div>
<p>{{ p.description || " " }}</p>
<p class="conversation-page-preview">{{ p.description || " " }}</p>
</ion-label>
</ion-menu-toggle>
<ion-button
@ -568,4 +568,10 @@ ion-item.selected {
margin-top: 20px;
font-size: 1.2rem;
}
.conversation-page-preview {
height: 5.5ex;
overflow: hidden;
color: rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.4);
}
</style>

4
src/theme/content-container.scss
Unescape Escape View File

@ -1,6 +1,6 @@
.container {
padding-left: 12px;
padding-right: 12px;
padding-left: 16px;
padding-right: 16px;
@media (min-width: 768px) {
padding-left: 18px;

0
src/utils/directive.ts
Unescape Escape View File

9
src/views/ChatComplete.vue
Unescape Escape View File

@ -207,14 +207,14 @@ watch(() => conversationInfo.value, (currentConversation) => {
v-model="state.formMessage" @keydown="controller.onMessageInputKeyDown" @ion-input="controller.onInput"
@compositionstart="controller.onCompositionStart" @compositionend="controller.onCompositionEnd"
:disabled="state.conversationLoading"></ion-textarea>
<ion-button shape="round" class="message-send-btn" title="发送" @click="controller.onSendMessage"
<ion-button shape="round" size="small" class="message-send-btn" title="发送" @click="controller.onSendMessage"
:disabled="state.conversationLoading || state.formMessage.length === 0 || state.pointUsageLoading">
<ion-icon :icon="paperPlane" slot="start"></ion-icon>
发送
</ion-button>
<ion-button fill="clear" class="message-send-btn-mobile" title="发送" @click="controller.onSendMessage"
:disabled="state.conversationLoading || state.formMessage.length === 0 || state.pointUsageLoading">
<ion-icon :icon="paperPlane" slot="icon-only" size="default"></ion-icon>
<ion-icon :icon="paperPlane" slot="icon-only" size="large"></ion-icon>
</ion-button>
</div>
</ion-toolbar>
@ -266,6 +266,7 @@ watch(() => conversationInfo.value, (currentConversation) => {
.message-input-container {
display: flex;
gap: 4px;
align-items: flex-start;
padding-top: 6px;
padding-bottom: 6px;
--opacity: 1;
@ -302,7 +303,10 @@ watch(() => conversationInfo.value, (currentConversation) => {
.message-send-btn {
height: 35px;
width: 8rem;
margin: 0 0 0 8px;
--padding-start: 14px;
--padding-end: 14px;
}
.message-send-btn-mobile {
@ -330,6 +334,7 @@ watch(() => conversationInfo.value, (currentConversation) => {
margin-right: 4px;
margin-bottom: 1px;
margin-left: 0;
padding-inline-start: 14px;
ion-spinner {
width: 20px;

2
tsconfig.tsbuildinfo
View File

File diff suppressed because one or more lines are too long

2
vite.config.ts
Unescape Escape View File

@ -5,6 +5,7 @@ import Components from 'unplugin-vue-components/vite'
import { IonicResolver } from 'unplugin-vue-components/resolvers'
import path from 'path'
import { env } from 'process'
import WindiCSS from 'vite-plugin-windicss'
// https://vitejs.dev/config/
export default defineConfig({
@ -25,6 +26,7 @@ export default defineConfig({
],
dts: './src/components.d.ts'
}),
WindiCSS(),
],
resolve: {
alias: {

Write Preview
Loading…
Cancel
Save