- <template>
- <router-view> </router-view>
- <RongyunCommunication v-if="isRY"></RongyunCommunication>
-
- <el-popover :width="407" placement="left" v-if="description">
- <template #reference>
- <div class="menuIcons">
- <img src="../src/assets/images/show_menu.png" style="margin-bottom: -3px" />
- </div>
- </template>
- <template #default>
- <div class="menu-description flex flex-v">
- <div class="description-title flex flex-align-center">文档标题</div>
- <div class="description-content" v-html="description"></div>
- </div>
- </template>
- </el-popover>
- </template>
-
- <script setup>
- import { getToken } from '@/utils/auth';
- import { listMenu } from '@/api/menu';
- import useSettingsStore from '@/store/modules/settings';
- import { handleThemeStyle } from '@/utils/theme';
- import { useRouter } from 'vue-router';
-
- const router = useRouter();
- const description = ref('');
- import RongyunCommunication from '@/views/RongyunCommunication/index.vue'; //融云
- const isRY = ref(false);
- import useUserStore from '@/store/modules/user';
- const appStore = useUserStore();
- watch(
- () => appStore.token,
- (newVal, oldVal) => {
- console.log('走了这里watch');
- if (newVal) {
- console.log(' 新的token;', newVal);
- isRY.value = true;
- } else {
- console.log('改变');
- isRY.value = false;
- }
- },
- { immediate: false, deep: true }
- );
-
- watch(
- () => router.currentRoute.value.path,
- (newValue, oldValue) => {
- // 全屏项目中无需说明弹窗
- if (router.currentRoute.value.query.type == 'FullScreen') {
- // 全屏页面
- description.value = '';
- } else {
- // 非全屏页面
- getMenuList(router.currentRoute.value.meta.title);
- }
- },
- { immediate: true }
- );
- function getMenuList(menuName) {
- if (getToken()) {
- listMenu({ menuName: menuName }).then(res => {
- if (res.data.length) {
- description.value = res.data[0].description;
- } else {
- description.value = '';
- }
- });
- }
- }
- onMounted(() => {
- console.log('走了这里', appStore.token);
- if (appStore.token) {
- setTimeout(() => {
- isRY.value = true;
- }, 1000);
- } else {
- isRY.value = false;
- }
-
- nextTick(() => {
- handleThemeStyle(useSettingsStore().theme);
- });
- });
- </script>
- <style lang="scss" scoped>
- .menuIcons {
- position: absolute;
- right: 60px;
- bottom: 50px;
- z-index: 999;
- box-shadow: 0px 0px 3px #000000;
- border-radius: 50%;
- }
- :deep(.el-popper) {
- padding: 0 !important;
- }
- .menu-description {
- width: 407px;
- border-radius: 2px 2px 0px 0px;
-
- .description-title {
- width: 400px;
- height: 50px;
- margin: -12px;
- background: #1981ff;
- border-radius: 2px 2px 0px 0px;
- font-size: 18px;
-
- font-weight: 500;
- color: #ffffff;
- padding-left: 19px;
- }
- .description-content {
- width: 400px;
- margin-left: -12px;
- margin-right: -12px;
- padding: 24px 12px 12px 12px;
- font-size: 14px;
-
- font-weight: 500;
- color: #666666;
- }
- }
-
- :deep(.el-message) {
- z-index: 9999999 !important;
- }
- </style>
- <style lang="scss">
- .message-zindex {
- z-index: 100000000 !important;
- }
- </style>