Browse Source

add: 内网聊天样式

master
tiantian 5 months ago
parent
commit
f410e5b6f4
  1. 1
      frontend/src/assets/chat.scss
  2. 20
      frontend/src/components/localchat/LocalChat.vue
  3. 4
      frontend/src/main.ts

1
frontend/src/assets/chat.scss

@ -108,7 +108,6 @@
@media screen and (max-width: 768px) { @media screen and (max-width: 768px) {
.chat-bot{ .chat-bot{
.input-area{ .input-area{
width: 90%;
.file-btn{ .file-btn{
margin-left: vw(-20); margin-left: vw(-20);
} }

20
frontend/src/components/localchat/LocalChat.vue

@ -3,10 +3,16 @@
<el-aside class="menu"> <el-aside class="menu">
<chat-nav /> <chat-nav />
</el-aside> </el-aside>
<el-container class="side"> <el-container class="side" v-if="!isMobileDevice()">
<chat-domain v-if="store.navId > 0" /> <chat-domain v-if="store.navId > 0" />
<ai-chat-left v-else /> <ai-chat-left v-else />
</el-container> </el-container>
<van-button v-else icon="apps-o" size="small" type="primary" @click="showLeft = !showLeft"></van-button>
<!-- 左侧弹出 -->
<van-popup v-model:show="showLeft" position="left" :style="{ width: '50%', height: '100%' }">
<chat-domain v-if="store.navId > 0" />
<ai-chat-left v-else />
</van-popup>
<el-container class="chat-box"> <el-container class="chat-box">
<chat-content v-if="store.navId > 0" /> <chat-content v-if="store.navId > 0" />
<ai-chat-main v-else /> <ai-chat-main v-else />
@ -18,10 +24,11 @@
import { onMounted } from "vue"; import { onMounted } from "vue";
import { useAiChatStore } from "@/stores/aichat"; import { useAiChatStore } from "@/stores/aichat";
import { useLocalChatStore } from "@/stores/localchat"; import { useLocalChatStore } from "@/stores/localchat";
import { isMobileDevice } from "@/util/device";
const store = useLocalChatStore(); const store = useLocalChatStore();
const aiStore = useAiChatStore(); const aiStore = useAiChatStore();
const showLeft = ref(false)
//let source:any; //let source:any;
onMounted(async () => { onMounted(async () => {
await store.init() await store.init()
@ -85,5 +92,14 @@ onMounted(async () => {
.chat-box { .chat-box {
height: 100%; height: 100%;
} }
.van-button {
position: absolute;
right: 0;
top: 50%;
transform: translateX(-50%);
z-index: 1;
}
} }
</style> </style>

4
frontend/src/main.ts

@ -9,7 +9,7 @@ import "./assets/windows10.scss"
import { i18n } from "./i18n/index.ts" import { i18n } from "./i18n/index.ts"
import pinia from "./stores/index.ts" import pinia from "./stores/index.ts"
import router from "./system/router" import router from "./system/router"
import { NavBar } from "vant" import Vant from "vant"
import "vant/lib/index.css" import "vant/lib/index.css"
const app = createApp(App) const app = createApp(App)
@ -17,7 +17,7 @@ app.use(router)
app.use(ElementPlus) app.use(ElementPlus)
app.use(pinia) app.use(pinia)
app.use(i18n) app.use(i18n)
app.use(NavBar) app.use(Vant)
app.use(screenShort, { enableWebRtc: true }) app.use(screenShort, { enableWebRtc: true })
for (const [key, component] of Object.entries(ElementPlusIconsVue)) { for (const [key, component] of Object.entries(ElementPlusIconsVue)) {

Loading…
Cancel
Save