mirror of
https://github.com/continew-org/continew-admin.git
synced 2025-09-15 02:57:10 +08:00
Charles7c
3fc7adb1e2
1.父级菜单也必须存在 name 属性，父级菜单 name 属性，在很早之前曾考虑过移除，后来发现会引起 Bug，于是没有改动。但前段时间调整动态路由时没有想起该情况，一时疏忽移除了，所幸发现问题不晚，现在及时恢复回来 2.优化实时监控示例的相关变量命名
80 lines
2.0 KiB
Vue
80 lines
2.0 KiB
Vue
<template>
|
|
<a-card
|
|
class="general-card chat-panel"
|
|
:title="$t('realTimeMonitor.title.chatPanel')"
|
|
:bordered="false"
|
|
:header-style="{ paddingBottom: '0' }"
|
|
:body-style="{
|
|
height: '100%',
|
|
paddingTop: '16px',
|
|
display: 'flex',
|
|
flexFlow: 'column',
|
|
}"
|
|
>
|
|
<a-space :size="8">
|
|
<a-select style="width: 86px" default-value="all">
|
|
<a-option value="all">
|
|
{{ $t('realTimeMonitor.chat.options.all') }}
|
|
</a-option>
|
|
</a-select>
|
|
<a-input-search
|
|
:placeholder="$t('realTimeMonitor.chat.placeholder.searchCategory')"
|
|
/>
|
|
<a-button type="text">
|
|
<icon-download />
|
|
</a-button>
|
|
</a-space>
|
|
<div class="chat-panel-content">
|
|
<a-spin :loading="loading" style="width: 100%">
|
|
<ChatList :render-list="chatData" />
|
|
</a-spin>
|
|
</div>
|
|
<div class="chat-panel-footer">
|
|
<a-space :size="8">
|
|
<a-Input>
|
|
<template #suffix>
|
|
<icon-face-smile-fill />
|
|
</template>
|
|
</a-Input>
|
|
<a-button type="primary">{{ $t('realTimeMonitor.chat.update') }}</a-button>
|
|
</a-space>
|
|
</div>
|
|
</a-card>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { ref } from 'vue';
|
|
import { queryChatList, ChatRecord } from '@/api/demo/message';
|
|
import useLoading from '@/hooks/loading';
|
|
import ChatList from './chat-list.vue';
|
|
|
|
const { loading, setLoading } = useLoading(true);
|
|
const chatData = ref<ChatRecord[]>([]);
|
|
const fetchData = async () => {
|
|
try {
|
|
const { data } = await queryChatList();
|
|
chatData.value = data;
|
|
} catch (err) {
|
|
// you can report use errorHandler or other
|
|
} finally {
|
|
setLoading(false);
|
|
}
|
|
};
|
|
fetchData();
|
|
</script>
|
|
|
|
<style scoped lang="less">
|
|
.chat-panel {
|
|
display: flex;
|
|
flex-direction: column;
|
|
height: 100%;
|
|
// padding: 20px;
|
|
background-color: var(--color-bg-2);
|
|
|
|
&-content {
|
|
flex: 1;
|
|
margin: 20px 0;
|
|
}
|
|
}
|
|
</style>
|