<template>
|
<el-dropdown trigger="hover" placement="right-start">
|
<div class="nav__chat">
|
<div class="nav__chat-icon">
|
<span class="chat_img ywifont ywicon-shoujidiannao !text-[20px] text-[#fff]"></span>
|
</div>
|
</div>
|
<template #dropdown>
|
<el-dropdown-menu>
|
<el-dropdown-item>
|
<el-popover placement="right-start" :width="136" trigger="hover" @show="initQrcode" :offset="35">
|
<template #reference>
|
<div class="flex items-center justify-between w-full">
|
<div class="flex items-center">
|
<span class="ywifont ywicon-shouji mr-2"></span>
|
<span>下载手机应用</span>
|
</div>
|
</div>
|
</template>
|
<template #default>
|
<div class="relative">
|
<div class="p-0 box-shadow-none rounded-[10px]">
|
<!-- <p class="text-center text-[#5e6772] m-0 p-0 leading-5 text-[12px]">请使用手机浏览器扫描二维码</p>
|
<p class="text-center text-[red] m-0 p-0 leading-5 text-[12px]">(不支持微信扫描)</p> -->
|
<div ref="setPhoneQRCode" class="mt-[8px] mb-[8px]"></div>
|
<p class="text-center text-info m-0 p-0 leading-5 text-sm">
|
浏览器扫码下载 <br />
|
WI 水务智能助手
|
</p>
|
</div>
|
</div>
|
</template>
|
</el-popover>
|
</el-dropdown-item>
|
<el-dropdown-item @click="addPluginClick">
|
<div class="flex items-center">
|
<span class="ywifont ywicon-chajian mr-2"></span>
|
<span>添加浏览器插件</span>
|
</div>
|
</el-dropdown-item>
|
</el-dropdown-menu>
|
</template>
|
</el-dropdown>
|
</template>
|
|
<script setup lang="ts" name="OtherPlatform">
|
import { ref, nextTick, onMounted } from 'vue';
|
import { SERVE_URL } from '/@/constants';
|
import { selectFirstRoom } from '/@/stores/chatRoom';
|
import QRCode from 'qrcodejs2-fixes';
|
|
//#region ====================== 扫码手机端下载 ======================
|
const setPhoneQRCode = ref<HTMLElement | null>(null);
|
let isInitQrcode = false;
|
// 初始化生成二维码
|
const initQrcode = () => {
|
if (isInitQrcode) return;
|
isInitQrcode = true;
|
let currentTime = new Date().getTime();
|
const url = `${SERVE_URL}mobile/prod/html/views/mobile_download/index.html?v=${currentTime}`;
|
nextTick(() => {
|
(<HTMLElement>setPhoneQRCode.value).innerHTML = '';
|
new QRCode(setPhoneQRCode.value, {
|
text: url,
|
width: 126,
|
height: 126,
|
colorDark: '#000000',
|
colorLight: '#ffffff',
|
});
|
});
|
};
|
//#endregion
|
|
const addPluginClick = () => {
|
window.open(`${SERVE_URL}ai_html/views/extension/index.html`);
|
};
|
onMounted(async () => {
|
selectFirstRoom();
|
initQrcode();
|
});
|
</script>
|
<style scoped lang="scss"></style>
|
