<template>
|
<div id="app">
|
<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 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'
|
|
export default {
|
name: 'app',
|
components: {
|
Desktop, NotificationCenter, NoticeTip, Tools, ToolsEntry
|
},
|
|
mounted() {
|
document.getElementById('app').style.backgroundImage = process.env.VUE_APP_MAIN_URL;
|
let _that = this;
|
let user_res = require("./mock/userData.json")
|
if (user_res.success) {
|
user_res.data.docks.forEach(function (item) {
|
_that.$store.commit('desktop/addDock', item);
|
});
|
}
|
|
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: 'v1.0.0',
|
time: new Date()
|
}, true);
|
}, 1000);
|
},
|
methods: {
|
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);
|
}
|
}
|
}
|
</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>
|
