Browse Source

fix:1. 会话列表的连接改为跳转新的标签页;2. 菜单栏增加滚动;3. 修改线上地址为域名;

dxj
李朋徽 1 year ago
parent
commit
8286d20bea
  1. 2
      .env.production
  2. 31
      src/components/AppMessage/index.vue
  3. 21
      src/layout/AppMenu/index.vue

2
.env.production

@ -1,7 +1,7 @@
# 正式环境 # 正式环境
# 公共地址 # 公共地址
VITE_GLOB_BASE_URL = "http://223.99.228.207:19872" VITE_GLOB_BASE_URL = "https://ai.sinenux.com:19876"
# 本地MQTT地址 # 本地MQTT地址
VITE_GLOB_MQTT_HOST = "223.99.228.240" VITE_GLOB_MQTT_HOST = "223.99.228.240"

31
src/components/AppMessage/index.vue

@ -3,6 +3,7 @@ import { computed, nextTick, onMounted, ref, watch } from 'vue'
import { Image } from 'ant-design-vue' import { Image } from 'ant-design-vue'
import { MdPreview } from 'md-editor-v3' import { MdPreview } from 'md-editor-v3'
import 'md-editor-v3/lib/style.css' import 'md-editor-v3/lib/style.css'
import { throttle } from 'lodash-es'
import type { MessageItem } from './index.d' import type { MessageItem } from './index.d'
import { SvgIcon } from '@/components/SvgIcon' import { SvgIcon } from '@/components/SvgIcon'
import { MessageStatusEnum, MessageTypeEnum } from '@/enums/messageEnum' import { MessageStatusEnum, MessageTypeEnum } from '@/enums/messageEnum'
@ -46,6 +47,7 @@ const conversationData = computed(() => messageStore.getConversationData)
watch( watch(
() => props.list[props.list.length - 1], () => props.list[props.list.length - 1],
() => { () => {
throttle(setHrefTarget, 500)
if (isAutoScroll.value) { if (isAutoScroll.value) {
scrollToBottom() scrollToBottom()
} }
@ -53,6 +55,19 @@ watch(
{ immediate: true }, { immediate: true },
) )
watch(
() => messageStore.messageStatus,
() => {
setHrefTarget()
},
)
watch(
() => props.list.length,
() => {
setHrefTarget()
},
)
/** /**
* @description: 滚动到底部 * @description: 滚动到底部
*/ */
@ -111,8 +126,22 @@ function reloadMessage() {
emit('reloadMessage') emit('reloadMessage')
} }
/**
* @description: 给链接添加target="_blank"
*/
async function setHrefTarget() {
if (messageRef.value && props.list.length) {
await nextTick()
const links = messageRef.value.querySelectorAll('a')
links.forEach((item: { target: string }) => {
item.target = '_blank'
})
}
}
onMounted(async () => { onMounted(async () => {
scrollToBottom() scrollToBottom()
setHrefTarget()
}) })
</script> </script>
@ -123,7 +152,7 @@ onMounted(async () => {
<div class="content"> <div class="content">
<MdPreview <MdPreview
:editor-id="`preview-only-user${index}${Date.now()}`" :editor-id="`preview-only-user${index}${Date.now()}`"
:model-value="item.content" :model-value="`[我是连接](https://open.ys7.com/console/device.html?_blank)${item.content}`"
/> />
</div> </div>
<img class="icon-user" src="@/assets/images/conversation/user.png" alt=""> <img class="icon-user" src="@/assets/images/conversation/user.png" alt="">

21
src/layout/AppMenu/index.vue

@ -104,8 +104,8 @@ function showConfirm() {
<template> <template>
<div class="app-menu h-full flex flex-col justify-between"> <div class="app-menu h-full flex flex-col justify-between">
<div class="menu w-full">
<img class="logo" src="~@/assets/images/logo.png" alt=""> <img class="logo" src="~@/assets/images/logo.png" alt="">
<div class="menu header-menu w-full">
<div <div
v-for="item in menu" v-for="item in menu"
:key="item.key" :key="item.key"
@ -119,7 +119,7 @@ function showConfirm() {
</p> </p>
</div> </div>
</div> </div>
<div class="menu foot-menu w-full"> <div class="menu foot-menu w-full flex flex-col flex-justify-end">
<div <div
v-for="item in footMenu" v-for="item in footMenu"
:key="item.key" :key="item.key"
@ -144,16 +144,20 @@ function showConfirm() {
</template> </template>
<style lang="scss" scoped> <style lang="scss" scoped>
::-webkit-scrollbar {
width: 0px;
height: 8px;
}
@include app('menu') { @include app('menu') {
background-image: url('../../assets/images/bg_menu.png'); background-image: url('../../assets/images/bg_menu.png');
background-size: cover; background-size: cover;
.menu {
.logo { .logo {
width: 50px; width: 50px;
margin: 15px auto 30px auto; margin: 15px auto 30px auto;
display: block; display: block;
} }
.menu {
.menu-item { .menu-item {
color: #fff; color: #fff;
cursor: pointer; cursor: pointer;
@ -181,5 +185,14 @@ function showConfirm() {
} }
} }
} }
.header-menu {
height: calc(100vh - 180px - 63px);
overflow: auto;
}
.foot-menu {
height: 180px;
overflow: auto;
box-shadow: 0 0 15px #3766d6;
}
} }
</style> </style>

Loading…
Cancel
Save