<template>
|
<div id="app" @contextmenu.prevent>
|
<tools></tools>
|
<desktop></desktop>
|
<tools-entry ref="dock_model"></tools-entry>
|
<notice-tip ref="notice_tip_model"></notice-tip>
|
<notification-center></notification-center>
|
</div>
|
</template>
|
|
<script>
|
import html2canvas from 'html2canvas';
|
import Desktop from './components/Desktop';
|
import NotificationCenter from './components/NotificationCenter';
|
import NoticeTip from './components/NoticeTip';
|
import Tools from './components/Tools';
|
import ToolsEntry from './components/ToolsEntry';
|
import axios from 'axios'
|
|
import { getApps } from '@/api/app'
|
import { findAllSdk } from '@/api/taskMange'
|
|
import config from '../../../../package.json'
|
|
export default {
|
name: 'app',
|
components: {
|
Desktop, NotificationCenter, NoticeTip, Tools, ToolsEntry
|
},
|
data() {
|
return {
|
buttonAuthority: sessionStorage.getItem('buttonAuthoritys') || []
|
}
|
},
|
computed: {
|
isAdmin() {
|
if (
|
sessionStorage.getItem('userInfo') &&
|
sessionStorage.getItem('userInfo') !== ''
|
) {
|
let loginName = JSON.parse(sessionStorage.getItem('userInfo')).username
|
return (
|
loginName === 'superadmin' || loginName === 'basic'
|
)
|
}
|
return false
|
}
|
},
|
mounted() {
|
document.getElementById('app').style.backgroundImage = process.env.VUE_APP_MAIN_URL;
|
this.showApps();
|
|
let _that = this;
|
let msgResp = require("./mock/messages.json")
|
if (msgResp.success) {
|
msgResp.data.forEach(function (item) {
|
_that.addMessage(item);
|
})
|
}
|
|
let weather = require("./mock/weather.json")
|
if (weather.success) {
|
_that.addWeather(weather.data.data);
|
}
|
setTimeout(function () {
|
_that.addMessage({
|
id: 'N2',
|
icon: '/images/desktop/message.png',
|
tip: '消息',
|
title: 'SmartAI',
|
body: 'V' + config.version,
|
time: new Date()
|
}, true);
|
}, 1000);
|
window.addEventListener('message', (e) => {
|
if (e.data.msg == 'AppUpdate') {
|
this.showApps();
|
}
|
});
|
},
|
methods: {
|
showApps() {
|
let _that = this;
|
|
getApps().then(rsp => {
|
if (rsp && rsp.success) {
|
_that.$store.state.desktop.docks = [];
|
let installedApps = [];
|
rsp.data
|
rsp.data.forEach(function (item) {
|
if (item.installed) {
|
let temp = {
|
id: item.id,
|
create_by: item.create_by,
|
create_time: item.create_time,
|
height: item.height,
|
icon: item.icon,
|
src: item.iconBlob ? 'data:image/png;base64,' + item.iconBlob : item.icon,
|
installed: item.installed,
|
isDelete: item.isDelete,
|
isUpgrade: item.isUpgrade,
|
title: item.title,
|
name: item.package,
|
remoteVersion: item.remoteVersion,
|
type: item.type,
|
update_by: item.update_by,
|
update_time: item.update_time,
|
url: item.url,
|
version: item.version,
|
width: item.width,
|
isDefault: item.isDefault
|
}
|
|
// 判断权限
|
if (_that.isAdmin || _that.buttonAuthority.indexOf(item.package) >= 0) {
|
_that.$store.commit('desktop/addDock', temp);
|
}
|
|
installedApps.push(item.package);
|
}
|
});
|
|
sessionStorage.setItem("apps", installedApps.join(","));
|
}
|
})
|
},
|
addMessage: function (message, ding) {
|
this.$store.dispatch('desktop/addMessage', message);
|
// if (ding) {
|
// new Audio('sounds/ping.mp3').play();
|
// }
|
this.$refs.notice_tip_model.showTip(message);
|
},
|
addWeather: function (weather) {
|
this.$store.commit('desktop/addWeather', weather);
|
},
|
screenShot(dock) {
|
//找到当前的iframe
|
let curIframe = Array.from(document.querySelectorAll('iframe')).find(iframe => iframe.src.indexOf(dock.url) >= 0);
|
//保存当前应用快照
|
html2canvas(curIframe.contentWindow.document.body, {
|
dpi: window.devicePixelRatio * 4,
|
logging: true, //查看html2canvas内部执行流程
|
removeContainer: true,
|
imageTimeout: 0,
|
useCORS: true, //开启跨域配置
|
//allowTaint: true
|
}).then(canvas => {
|
let shotSrc = canvas.toDataURL();
|
// this.$store.commit('desktop/addMinDock', {
|
// id: dock.id,
|
// src: dock.icon,
|
// alt: dock.title,
|
// type: "3",
|
// screenshot: shotSrc
|
// });
|
this.$store.commit('desktop/shotscreen', { id: dock.id, src: shotSrc });
|
|
}).catch(e => {
|
this.$store.commit('desktop/shotscreen', { id: dock.id, src: '' });
|
});
|
}
|
}
|
}
|
</script>
|
|
<style>
|
html {
|
height: 100%;
|
}
|
|
body {
|
padding: 0;
|
margin: 0;
|
height: 100%;
|
overflow: hidden;
|
}
|
|
#app {
|
width: 100%;
|
height: 100%;
|
background-size: 100% 100%;
|
background-image: url("/images/desktop/background.png");
|
background-attachment: fixed;
|
}
|
|
.clearFix:after {
|
content: "";
|
display: block;
|
height: 0;
|
clear: both;
|
}
|
</style>
|
