封装axios请求本地资源

.eslintrc.json

@@ -1,20 +0,0 @@
-{
-  "globals": {
-    "EnityLogin":true,
-    "EnityBigScreen":true,
-    "EnityButton":true,
-    "EnityDevice":true,
-    "EnityIcon":true,
-    "EnityImage":true,
-    "EnityLable":true,
-    "EnityMemory":true,
-    "EnitySignalPreviewList":true,
-    "EnitySlider":true,
-    "EnitySystem":true,
-    "EnityTimer":true,
-    "EnityTopology":true,
-    "EnityTopologyConnection":true,
-    "EnityView":true,
-    "EnityWindow":true
-  }
-}

src/index.ejs

@@ -16,21 +16,5 @@
     <script>
       if (process.env.NODE_ENV !== 'development') window.__static = require('path').join(__dirname, '/static').replace(/\\/g, '\\\\')
     </script>
-    <script src="../static/json/EnityLogin.js"></script>
-    <script src="../static/json/EnityBigScreen.js"></script>
-    <script src="../static/json/EnityButton.js"></script>
-    <script src="../static/json/EnityDevice.js"></script>
-    <script src="../static/json/EnityIcon.js"></script>
-    <script src="../static/json/EnityImage.js"></script>
-    <script src="../static/json/EnityLable.js"></script>
-    <script src="../static/json/EnityMemory.js"></script>
-    <script src="../static/json/EnitySignalPreviewList.js"></script>
-    <script src="../static/json/EnitySlider.js"></script>
-    <script src="../static/json/EnitySystem.js"></script>
-    <script src="../static/json/EnityTimer.js"></script>
-    <script src="../static/json/EnityTopology.js"></script>
-    <script src="../static/json/EnityTopologyConnection.js"></script>
-    <script src="../static/json/EnityView.js"></script>
-    <script src="../static/json/EnityWindow.js"></script>
   </body>
 </html>

src/renderer/App.vue

@@ -5,51 +5,51 @@
 </template>
 
 <script>
-  import fs from 'fs'
-  import path from 'path'
-
+  import axios from 'axios'
   import {
     reqBigScreen,
     reqConfigBigScreen,
     reqConfigDevice,
     reqDevice,
-    reqImportConfigFiles,
     reqPreviewSourceList
   } from "./api"
 
   export default {
-    name: 'vedio_app',
-
     async mounted() {
-      // 将配置文件传给服务器
-      /*const formData = new FormData()
-      let device = fs.readFileSync(path.join(__static, '/json/EnityDevice.js'), 'utf8')
-      let bigscreen = fs.readFileSync(path.join(__static, '/json/EnityBigScreen.js'), 'utf8')
-      formData.append('device',EnityDevice)
-      formData.append('bigscreen',EnityBigScreen)
-      const res = await reqImportConfigFiles(formData)
-      if(!res){
-        console.log('上传配置文件成功!')
-      }*/
-
       // 单独上传配置文件
-      const res = await reqConfigBigScreen(EnityBigScreen)
-      const res2 = await reqConfigDevice(EnityDevice)
-      if(res[0].ID && res2[0].ID){
-        console.log('上传大屏和设备配置文件成功!')
-      }
-
-      // 获取大屏,信号源，设备数据并保存到vuex中
-      const bigScreenJson = await reqBigScreen()
-      const signalListJson = await reqPreviewSourceList()
-      const deviceJson = await reqDevice()
-      this.$store.dispatch('saveBigscreen',bigScreenJson.filter(item => item.IsVisibility === true))
-      this.$store.dispatch('saveSignalList',signalListJson)
-      this.$store.dispatch('saveDevice',deviceJson)
+      axios.get('static/EnityBigScreen.Data').then(async res => {
+        if (res.status === 200) {
+          const result = await reqConfigBigScreen(res.data)
+          if(result[0].ID){
+            console.log('上传大屏配置文件成功!')
+          }
+        }
+      })
+
+      axios.get('static/EnityDevice.Data').then(async res => {
+        if (res.status === 200) {
+          const result = await reqConfigDevice(res.data)
+          if(result[0].ID){
+            console.log('上传设备配置文件成功!')
+
+            // 获取大屏,信号源，设备数据并保存到vuex中
+            const bigScreenJson = await reqBigScreen()
+            const signalListJson = await reqPreviewSourceList()
+            const deviceJson = await reqDevice()
+            this.$store.dispatch('saveBigscreen',bigScreenJson.filter(item => item.IsVisibility === true))
+            this.$store.dispatch('saveSignalList',signalListJson)
+            this.$store.dispatch('saveDevice',deviceJson)
+          }
+        }
+      })
+
+      // 更新vuex中的缩放比例
+      axios.get('static/EnityWindow.Data').then(async res => {
+        if (res.status === 200) {
+              const scale = window.screen.height/res.data[0].Height
+              this.$store.dispatch('updateScale',scale)
+          }
+      })
     }
   }
 </script>
-
-<style>
-
-</style>

src/renderer/api/ajax.js

@@ -42,9 +42,6 @@ export default function ajax (url, data={}, type='GET') {
       // 成功了调用resolve()
       resolve(response.data)
     }).catch(function (error) {
-      /*new Notification('请求反馈', {
-        body: `请求出错了 ${error}`
-      })*/
       alert(`请求出错了 ${error}`)
     })
   })

src/renderer/api/index.js

@@ -2,12 +2,16 @@
 包含n个接口请求函数的模块
 函数的返回值: promise对象
  */
-
+import axios from 'axios'
 import ajax from './ajax'
-import state from '../store/state'
 
-const {systemJson} = state
-const BASE_URL = `${systemJson.ServerIP}:${systemJson.ServerPort}`
+let BASE_URL
+
+axios.get('static/EnitySystem.data').then(async res => {
+    if (res.status === 200) {
+        BASE_URL = `${res.data ? res.data.ServerIP : ''}:${res.data ? res.data.ServerPort : ''}`
+    }
+})
 
 // 登录
 export const reqLogin = (data) => ajax(BASE_URL+'/login',data,'POST')
@@ -15,9 +19,6 @@ export const reqLogin = (data) => ajax(BASE_URL+'/login',data,'POST')
 // 退出登录
 export const reqLogout = (data) => ajax(BASE_URL+'/logout',data,'POST')
 
-// 导入配置json文件(device和bigscreen)
-export const reqImportConfigFiles = (data) => ajax(BASE_URL+'/v1/import',data,'POST')
-
 // 获取大屏
 export const reqBigScreen= () => ajax(BASE_URL+'/v1/bigscreen')
 

src/renderer/components/Admin.vue

@@ -1,71 +1,53 @@
 <!--管理界面-->
 <template>
     <div class="containers">
-        <!--主页-->
-        <div
-                :style="{
+    <!--主页-->
+    <div
+            :style="{
                 position: 'relative',
-                left:windowJson[0].Left*Scale+'px',
-                top:windowJson[0].Top*Scale+'px',
-                width:windowJson[0].Width*Scale + 'px',
-                height:windowJson[0].Height*Scale + 'px',
-                zIndex:windowJson[0].ZIndex,
-                display:windowJson[0].IsVisibility ? 'block' : 'none',
-                backgroundImage:windowJson[0].BackIcon ? 'url('+require(`../../../static/images/${windowJson[0].BackIcon}`)+')' : null,
+                left:windowJson[0] ? windowJson[0].Left*scale+'px' : '',
+                top:windowJson[0] ? windowJson[0].Top*scale+'px' : '',
+                width:windowJson[0] ? windowJson[0].Width*scale + 'px' : '',
+                height:windowJson[0] ? windowJson[0].Height*scale + 'px' : '',
+                zIndex:windowJson[0] ? windowJson[0].ZIndex : '',
+                display:windowJson[0] ? (windowJson[0].IsVisibility ? 'block' : 'none') : '',
+                backgroundImage:windowJson[0] ? (windowJson[0].BackIcon ? 'url('+require(`../../../static/images/${windowJson[0].BackIcon}`)+')' : null) : '',
                 backgroundRepeat:'no-repeat',
                 backgroundSize:'100% 100%',
-                backgroundColor:`#${windowJson[0].BrackgroupStr ? windowJson[0].BrackgroupStr.slice(3) : null}`,
+                backgroundColor:`#${windowJson[0] ? (windowJson[0].BrackgroupStr ? windowJson[0].BrackgroupStr.slice(3) : null) : ''}`,
                 margin:'0 auto'}"
-                ref="mainpage"
-        >
-            <!--按钮-->
-            <ButtonComponent />
+            ref="mainpage"
+    >
+        <!--按钮-->
+        <ButtonComponent />
 
-            <!--大屏显示-->
-            <BigShowComponent />
+        <!--大屏显示-->
+        <BigShowComponent />
 
-            <!--label标签-->
-            <LabelComponent />
+        <!--label标签-->
+        <LabelComponent />
 
-            <!--图片-->
-            <ImageComponent />
+        <!--图片-->
+        <ImageComponent />
 
-            <!--信号源列表-->
-            <SignalListComponent />
+        <!--信号源列表-->
+        <SignalListComponent />
 
-            <!--滑块-->
-            <SliderComponent />
+        <!--滑块-->
+        <SliderComponent />
 
-            <!--其他页面-->
-            <!--<div v-for="item in windowJson"
-                 :style="{
-                    left:item.Left+'px',
-                    top:item.Top+'px',
-                    width:item.Width + 'px',
-                    height:item.Height + 'px',
-                    zIndex:item.ZIndex,
-                    display:item.IsVisibility ? 'block' : 'none',
-                    backgroundColor:`#${item.BrackgroupStr.slice(3)}`,
-                    backgroundImage:item.BackIcon ? 'url('+require(`../../../static/images/${item.BackIcon}`)+')' : null,
-                    backgroundRepeat:'no-repeat',
-                    backgroundSize:'100% 100%',
-                    margin:'0 auto',
-                }"
-            >
-            </div>-->
-
-            <button class="logoutBtn" @click="logout">退出</button>
-        </div>
-        <!--最小化和关闭按钮-->
-        <div class="mini" @click="miniWindow">－</div>
-        <div class="close" @click="closeWindow">×</div>
+        <button class="logoutBtn" @click="logout">退出</button>
     </div>
+    <!--最小化和关闭按钮-->
+    <div class="mini" @click="miniWindow">－</div>
+    <div class="close" @click="closeWindow">×</div>
+</div>
 </template>
 
 <script>
-    import '../assets/less/mainpage.less'
     import {mapState} from 'vuex'
     import storageUtils from "../../utils/storageUtils"
+    import '../assets/less/mainpage.less'
 
     import ButtonComponent from './Button'
     import LabelComponent from './Label'
@@ -74,6 +56,7 @@
     import ImageComponent from './Image'
     import SliderComponent from './Slider'
     import {reqLogout} from "../api"
+    import {getStaticFile} from "../../utils/tools"
 
     export default {
         components: {
@@ -85,16 +68,17 @@
             SliderComponent
         },
 
-        mounted() {
-          this.fullScreen()
-        },
-
         data() {
             return {
                 user: storageUtils.getUser(), // 本地存储的用户
+                windowJson:[]
             }
         },
 
+        async beforeCreate() {
+            this.windowJson = await getStaticFile('EnityWindow.Data')
+        },
+
         methods: {
             // 退出登录
             async logout() {
@@ -105,18 +89,6 @@
                 this.$router.replace('/login')
             },
 
-            // 显示全屏
-            fullScreen(){
-                const de = this.$refs.mainpage
-                if (de.requestFullscreen) {
-                    de.requestFullscreen()
-                } else if (de.mozRequestFullScreen) {
-                    de.mozRequestFullScreen()
-                } else if (de.webkitRequestFullScreen) {
-                    de.webkitRequestFullScreen()
-                }
-            },
-
             // 最小化窗口
             miniWindow() {
                 require('electron').ipcRenderer.send('window-min')
@@ -129,7 +101,7 @@
         },
 
         computed: {
-            ...mapState(['windowJson','Scale'])
+            ...mapState(['scale'])
         }
     }
 </script>

src/renderer/components/BigShow.vue

@@ -13,17 +13,17 @@
                 @end="isDragging=false"
                 ref="bigscreen"
                 :style="{
-                    width:item.Width*Scale + 'px',
-                    height:item.Height*Scale + 'px',
-                    left:item.Left*Scale+'px',
-                    top:item.Top*Scale+'px',
+                    width:item.Width*scale + 'px',
+                    height:item.Height*scale + 'px',
+                    left:item.Left*scale+'px',
+                    top:item.Top*scale+'px',
                     zIndex:item.ZIndex,
                     display:item.IsVisibility ? 'black' : 'none',
                 }"
         >
             <VueDragResize
                     v-for="itemV in signalPreList" :key="itemV.deviceID" class="sitem"
-                    :w="item.Width*Scale/(splitScreenStatus+1)" :h="item.Height*Scale/(splitScreenStatus+1)"
+                    :w="item.Width*scale/(splitScreenStatus+1)" :h="item.Height*scale/(splitScreenStatus+1)"
                     :parentLimitation="false"
                     @dragstop="dragStop"
                     @resizestop="(obj) => reSizeSignal(obj,itemV)"
@@ -53,7 +53,7 @@
     import { videoPlayer } from 'vue-video-player'
 
     import '../assets/less/splitscreen.less'
-    import {getElementLeft, getElementTop} from "../../utils/tools"
+    import {getElementLeft, getElementTop, getStaticFile} from "../../utils/tools"
     import {reqRefreshView} from "../api"
 
     export default {
@@ -85,7 +85,8 @@
                         remainingTimeDisplay: false,
                         fullscreenToggle: false // 全屏按钮
                     }
-                }
+                },
+                bigScreenJson:[]
             }
         },
 
@@ -95,12 +96,8 @@
             videoPlayer,
         },
 
-        mounted() {
-
-        },
-
-        beforeDestroy() {
-
+        async beforeCreate() {
+            this.bigScreenJson = await getStaticFile('EnityBigScreen.Data')
         },
 
         methods: {
@@ -115,7 +112,6 @@
 
             // 大屏开窗
             reqRefreshBigScreen(arr) {
-                const Scale = this.$store.state.Scale
                 const streamWindows = []
                 setTimeout(async () => {
                     const elementArr = this.$refs.signal
@@ -127,10 +123,10 @@
                             streamWindows.push({
                                 left,
                                 top,
-                                width:this.bigScreenJson[0].Width*Scale/(this.splitScreenStatus+1),
-                                height:this.bigScreenJson[0].Height*Scale/(this.splitScreenStatus+1),
+                                width:this.bigScreenJson[0].Width/(this.splitScreenStatus+1),
+                                height:this.bigScreenJson[0].Height/(this.splitScreenStatus+1),
                                 id:0,
-                                sourceId:arr[index].sourceId,
+                                sourceId:arr[index] ? arr[index].sourceId : '',
                                 widthScale:1/(this.splitScreenStatus+1),
                                 heightScale:1/(this.splitScreenStatus+1),
                                 orginRect:{}
@@ -168,14 +164,13 @@
         },
 
         computed: {
-            ...mapState(['bigScreenJson','splitScreenStatus','Scale']),
+            ...mapState(['splitScreenStatus','scale']),
 
             signalPreList: {
                 get() {
                     return this.$store.state.signalPreList
                 },
                 set(arr) {
-                    // const signalArr = [...arr,...this.divArr]
                     this.$store.dispatch('updateSignalPreList',arr)
                 }
             },

src/renderer/components/Button.vue

@@ -5,19 +5,19 @@
         <div v-for="item in buttonJson"
              :style="{
                     position:'absolute',
-                    left:item.Left*Scale+'px',
-                    top:item.Top*Scale+'px',
-                    width:item.Width*Scale + 'px',
-                    height:item.Height*Scale + 'px',
+                    left:item.Left*scale+'px',
+                    top:item.Top*scale+'px',
+                    width:item.Width*scale + 'px',
+                    height:item.Height*scale + 'px',
                     zIndex:item.ZIndex,
                     display:item.IsVisibility ? 'block' : 'none',
-                    fontSize:item.FontSize*Scale + 'px',
+                    fontSize:item.FontSize*scale + 'px',
                     backgroundImage:'url('+require(`../../../static/images/${item.BackIcon}`)+')',
                     backgroundSize:'100% 100%',
                     backgroundRepeat:'no-repeat',
                     color:`#${item.ForegroundStr.slice(3)}`,
                     textAlign:'center',
-                    lineHeight:item.Height*Scale + 'px',
+                    lineHeight:item.Height*scale + 'px',
                     cursor:'default'
                 }"
              :ref="item.ID"
@@ -32,6 +32,7 @@
 
 <script>
     import {mapState} from 'vuex'
+    import {getStaticFile} from "../../utils/tools"
 
     export default {
         data() {
@@ -41,36 +42,38 @@
                 count3: 0, // 管理控制按钮计数器
                 count4: 0, // 3个视频按钮计数器
                 count5: 0, // 安卓分布式按钮
+                buttonJson:[],
+                labelJson:[],
+                slideJson:[]
             }
         },
 
-        mounted() {
-            // 获取分屏按钮数组(将分屏按钮和其他按钮区分开)
-            this.arr = this.buttonJson.filter(item => (item.WindowID === '9a0dff23-8633-4e7f-89bf-cc4f68ec88e1' || item.WindowID === '08208721-41cc-4f1e-937b-3a1627389049' || item.WindowID === 'ab842585-0c91-4e65-bfed-a219bcaaeb43'))
-
-            // 获取功能按钮涉及到的按钮和label
-            // 1.电源管理  2.音频管理  3.视频管理  4.环境控制  5.电脑控制
-            const funcBtnArr = this.buttonJson.filter(item => (item.WindowID === 'd80a8b6e-9f88-41ff-b3a7-1ff8d6ee37a5' || item.WindowID === 'cb2687fd-931a-4b38-a76d-9c3ea171b8d8' || item.WindowID === '027ab76d-6b9c-46ac-abe6-75b8059f786b' || item.WindowID === 'a12b287f-f68c-4efa-b652-d6e5b0a09d0d' || item.WindowID === 'd9868551-b579-4258-9bc7-7c1f733773f5'))
-            const funcLabArr = this.labelJson.filter(item => (item.WindowID === 'd80a8b6e-9f88-41ff-b3a7-1ff8d6ee37a5' || item.WindowID === 'cb2687fd-931a-4b38-a76d-9c3ea171b8d8' || item.WindowID === '027ab76d-6b9c-46ac-abe6-75b8059f786b' || item.WindowID === 'a12b287f-f68c-4efa-b652-d6e5b0a09d0d' || item.WindowID === 'd9868551-b579-4258-9bc7-7c1f733773f5'))
-            this.funcObj = {
-                funcBtnArr,
-                funcLabArr,
-                funSliderArr:this.sliderJson
-            }
+        async mounted() {
 
+            this.buttonJson = await getStaticFile('EnityButton.Data')
+            // 获取分屏按钮数组
+            this.arr = this.buttonJson.filter(item => (item.WindowID === '9a0dff23-8633-4e7f-89bf-cc4f68ec88e1' || item.WindowID === '08208721-41cc-4f1e-937b-3a1627389049' || item.WindowID === 'ab842585-0c91-4e65-bfed-a219bcaaeb43'))
+            // 获取功能按钮
+            this.funcBtnArr = this.buttonJson.filter(item => (item.WindowID === 'd80a8b6e-9f88-41ff-b3a7-1ff8d6ee37a5' || item.WindowID === 'cb2687fd-931a-4b38-a76d-9c3ea171b8d8' || item.WindowID === '027ab76d-6b9c-46ac-abe6-75b8059f786b' || item.WindowID === 'a12b287f-f68c-4efa-b652-d6e5b0a09d0d' || item.WindowID === 'd9868551-b579-4258-9bc7-7c1f733773f5'))
             // 获取电源管理和电脑控制按钮
             this.powerAndCompBtns = this.buttonJson.filter(item => (item.WindowID === 'd80a8b6e-9f88-41ff-b3a7-1ff8d6ee37a5' || item.WindowID === 'd9868551-b579-4258-9bc7-7c1f733773f5') && item.ID !== '19554440-98bc-4644-83a0-d9cefd69153e')
+
+
+            this.labelJson = await getStaticFile('EnityLable.Data')
+            this.funcLabArr = this.labelJson.filter(item => (item.WindowID === 'd80a8b6e-9f88-41ff-b3a7-1ff8d6ee37a5' || item.WindowID === 'cb2687fd-931a-4b38-a76d-9c3ea171b8d8' || item.WindowID === '027ab76d-6b9c-46ac-abe6-75b8059f786b' || item.WindowID === 'a12b287f-f68c-4efa-b652-d6e5b0a09d0d' || item.WindowID === 'd9868551-b579-4258-9bc7-7c1f733773f5'))
+
+
+            this.slideJson = await getStaticFile('EnitySlider.Data')
+            this.funSliderArr = res.data
         },
 
         computed: {
-            ...mapState(['buttonJson','labelJson','sliderJson','Scale']),
+            ...mapState(['scale']),
         },
 
         methods: {
             // 点击按钮
             clickBtn(e) {
-                // console.log(e)
-
                 // 预案管理声音开关
                 if (e.ID === '355d3c32-1502-40b4-9ddd-663d5b8469e7') {
                     if (this.count % 2 === 0) {
@@ -139,7 +142,7 @@
 
                     // （2）界面切换
                     // 按钮
-                    this.funcObj.funcBtnArr.forEach((item, index) => {
+                    this.funcBtnArr.forEach((item, index) => {
                         if (e.MouseDownActionList[0].SourceID === item.WindowID) {
                             item.IsVisibility = true
                         } else {
@@ -148,7 +151,7 @@
                     })
 
                     // 标签
-                    this.funcObj.funcLabArr.forEach((item, index) => {
+                    this.funcLabArr.forEach((item, index) => {
                         if (e.MouseDownActionList[0].SourceID === item.WindowID) {
                             item.IsVisibility = true
                         } else {
@@ -157,7 +160,7 @@
                     })
 
                     // 滑块
-                    this.funcObj.funSliderArr.forEach((item, index) => {
+                    this.funSliderArr.forEach((item, index) => {
                         if (e.MouseDownActionList[0].SourceID === item.WindowID) {
                             item.IsVisibility = true
                         } else {

src/renderer/components/Image.vue

@@ -5,10 +5,10 @@
         <div v-for="item in imageJson"
              :style="{
                     position:'absolute',
-                    left:item.Left*Scale+'px',
-                    top:item.Top*Scale+'px',
-                    width:item.Width*Scale + 'px',
-                    height:item.Height*Scale + 'px',
+                    left:item.Left*scale+'px',
+                    top:item.Top*scale+'px',
+                    width:item.Width*scale + 'px',
+                    height:item.Height*scale + 'px',
                     zIndex:item.ZIndex,
                     display:item.IsVisibility ? 'block' : 'none',
                     backgroundImage:'url('+require(`../../../static/images/${item.BackIcon}`)+')',
@@ -25,8 +25,18 @@
 
     export default {
 
+        data() {
+            return {
+                imageJson:[]
+            }
+        },
+
+        async beforeCreate() {
+            this.imageJson = await getStaticFile('EnityImage.Data')
+        },
+
         computed: {
-            ...mapState(['imageJson','Scale'])
+            ...mapState(['scale'])
         }
     }
 </script>

src/renderer/components/Label.vue

@@ -4,17 +4,17 @@
     <div>
         <label v-for="item in labelJson"
                :style="{
-                 fontSize:item.FontSize*Scale + 'px',
+                 fontSize:item.FontSize*scale + 'px',
                  position:'absolute',
-                 left:item.Left*Scale+'px',
-                 top:item.Top*Scale+'px',
-                 width:item.Width*Scale + 'px',
-                 height:item.Height*Scale + 'px',
+                 left:item.Left*scale+'px',
+                 top:item.Top*scale+'px',
+                 width:item.Width*scale + 'px',
+                 height:item.Height*scale + 'px',
                  zIndex:item.ZIndex,
                  display:item.IsVisibility ? 'block' : 'none',
                  color:`#${item.ForegroundStr.slice(3)}`,
                  textAlign:'center',
-                 lineHeight:item.Height*Scale + 'px',
+                 lineHeight:item.Height*scale + 'px',
             }">
             {{item.Text}}
         </label>
@@ -27,12 +27,16 @@
     export default {
         data() {
             return {
-
+                labelJson:[]
             }
         },
 
+        async beforeCreate() {
+            this.labelJson = await getStaticFile('EnityLable.Data')
+        },
+
         computed: {
-            ...mapState(['labelJson','Scale']),
+            ...mapState(['scale']),
         },
 
         methods: {

src/renderer/components/Login.vue

@@ -8,7 +8,8 @@
             top:loginJson[0] ? loginJson[0].Top + 'px' : '',
             zIndex: loginJson[0] ? loginJson[0].ZIndex : '',
             border: `1px solid #${loginJson[0] ? loginJson[0].BorderStr.slice(3) : ''}`,
-            backgroundColor: `#${loginJson[0] ? loginJson[0].ForegroundStr.slice(3) : ''}`}">
+            backgroundColor: `#${loginJson[0] ? loginJson[0].ForegroundStr.slice(3) : ''}`}"
+        >
             <h2>用户登录</h2>
             <el-form :model="ruleForm" status-icon :rules="rules" ref="ruleForm" label-width="55px" class="login-form">
                 <el-form-item label="账号" prop="username">
@@ -27,12 +28,9 @@
 </template>
 
 <script>
-    import {mapState} from 'vuex'
     import {reqLogin} from "../api"
     import storageUtils from "../../utils/storageUtils"
-    import fs from 'fs'
-    import path from 'path'
-    import axios from 'axios'
+    import {getStaticFile} from "../../utils/tools"
 
     export default {
         data() {
@@ -63,21 +61,8 @@
             }
         },
 
-        beforeCreate() {
-            /*fs.readFile(path.join(__static, '/EnityLogin.json'), 'utf8',(err,data) => {
-                this.loginJson = data
-            })*/
-
-            axios.get('static/EnityLogin.json').then(res => {
-                if (res.status === 200) {
-                    this.loginJson = res.data
-                }
-            })
-
-        },
-
-        computed: {
-            // ...mapState(['loginJson'])
+        async beforeCreate() {
+            this.loginJson = await getStaticFile('EnityLogin.Data')
         },
 
         methods: {

src/renderer/components/SignalList.vue

@@ -1,14 +1,14 @@
 <template>
     <draggable
             :style="{
-                left:signalBorder[0].Left*Scale+'px',
-                top:signalBorder[0].Top*Scale+'px',
-                width:signalBorder[0].Width*Scale + 'px',
-                height:signalBorder[0].Height*Scale + 'px',
-                zIndex:signalBorder[0].ZIndex,
-                display:signalBorder[0].IsVisibility ? 'block' : 'none',
-                fontSize:signalBorder[0].FontSize*Scale + 'px',
-                color:`#${signalBorder[0].ForegroundStr.slice(3)}`,
+                left:signalBorder[0] ? signalBorder[0].Left*scale+'px' : '',
+                top:signalBorder[0] ? signalBorder[0].Top*scale+'px' : '',
+                width:signalBorder[0] ? signalBorder[0].Width*scale + 'px' : '',
+                height:signalBorder[0] ? signalBorder[0].Height*scale + 'px' : '',
+                zIndex:signalBorder[0] ? signalBorder[0].ZIndex : '',
+                display:signalBorder[0] ? (signalBorder[0].IsVisibility ? 'block' : 'none') : '',
+                fontSize:signalBorder[0] ? signalBorder[0].FontSize*scale + 'px' : '',
+                color:`#${signalBorder[0] ? signalBorder[0].ForegroundStr.slice(3) : ''}`,
                 position:'absolute',
                 overflow:'auto',
             }"
@@ -33,14 +33,25 @@
 </template>
 
 <script>
+    import axios from 'axios'
     import {mapState} from 'vuex'
     import draggable from 'vuedraggable'
 
     export default {
+        data() {
+            return {
+                signalBorder:[]
+            }
+        },
+
         components: {
             draggable
         },
 
+        async beforeCreate() {
+            this.signalBorder = await getStaticFile('EnitySignalPreviewList.Data')
+        },
+
         methods: {
             // 移动信号源
             onMove({relatedContext, draggedContext}) {
@@ -53,7 +64,7 @@
         },
 
         computed: {
-            ...mapState(['signalListJson','signalBorder','Scale']),
+            ...mapState(['signalListJson','scale']),
             dragOptions1() {
                 return {
                     animation: 0,

src/renderer/components/Slider.vue

@@ -5,10 +5,10 @@
         <div v-for="item in sliderJson"
              :style="{
                     position:'absolute',
-                    left:item.Left*Scale+'px',
-                    top:item.Top*Scale+'px',
-                    width:item.Width*Scale + 'px',
-                    height:item.Height*Scale + 'px',
+                    left:item.Left*scale+'px',
+                    top:item.Top*scale+'px',
+                    width:item.Width*scale + 'px',
+                    height:item.Height*scale + 'px',
                     zIndex:item.ZIndex,
                     display:item.IsVisibility ? 'block' : 'none',
                     backgroundImage:'url('+require(`../../../static/images/${item.BackIcon}`)+')',
@@ -17,14 +17,14 @@
         >
             <div
                     :style="{
-                           width:item.imgBgWidth*Scale + 'px',
-                           height:item.imgBgHeight*Scale + 'px',
+                           width:item.imgBgWidth*scale + 'px',
+                           height:item.imgBgHeight*scale + 'px',
                         }"
             >
                 <div
                         :style="{
-                            width:item.imgSliderWidth*Scale + 'px',
-                            height:item.imgSliderHeight*Scale + 'px',
+                            width:item.imgSliderWidth*scale + 'px',
+                            height:item.imgSliderHeight*scale + 'px',
                             backgroundImage:'url('+require(`../../../static/images/${item.SliderIcon}`)+')',
                             backgroundRepeat:'no-repeat',
                             marginLeft:'40%',
@@ -42,8 +42,18 @@
     import {mapState} from 'vuex'
 
     export default {
+        data() {
+            return {
+                sliderJson:[]
+            }
+        },
+
+        async beforeCreate() {
+            this.sliderJson = await getStaticFile('EnitySlider.Data')
+        },
+
         computed: {
-            ...mapState(['sliderJson','Scale']),
+            ...mapState(['scale']),
         }
     }
 </script>

src/renderer/store/actions.js

@@ -8,7 +8,7 @@ import {
   SAVE_BIGSCREEN,
   SAVE_SIGNALLIST,
   SAVE_DEVICE,
-  SAVE_LOGIN
+  UPDATE_SCALE
 } from './mutation-types'
 
 export default {
@@ -51,5 +51,10 @@ export default {
   // 保存设备数据
   saveDevice({commit},deviceJson) {
     commit(SAVE_DEVICE,{deviceJson})
+  },
+
+  // 更新元素缩放比例
+  updateScale({commit},scale) {
+    commit(UPDATE_SCALE,{scale})
   }
 }

src/renderer/store/mutation-types.js

@@ -1,12 +1,11 @@
 /*包含n个mutation名称常量*/
 export const SAVE_USER = 'save_user' // 保存用户信息
 export const RESET_USER = 'reset_user' // 重置用户信息
-export const OPEN_SIGNAL_MODAL = 'open_signal_modal' // 打开信号源对话框
 export const CLEAR_SCREEN = 'clear_screen' // 清屏操作
 export const SPLIT_SCREEN = 'split_screen' // 分屏操作
 export const UPDATE_SIGNALPRELIST = 'update_signalprelist' // 更新拖动到大屏中的信号源
 export const SAVE_BIGSCREEN = 'save_bigscreen' // 保存大屏数据
 export const SAVE_SIGNALLIST = 'save_signallist' // 保存信号源列表数据
 export const SAVE_DEVICE = 'save_device' // 保存设备数据
-export const SAVE_LOGIN = 'save_login' // 保存登录界面数据
+export const UPDATE_SCALE = 'update_scale' // 更新元素缩放比例
 

src/renderer/store/mutations.js

@@ -7,7 +7,8 @@ import {
   UPDATE_SIGNALPRELIST,
   SAVE_BIGSCREEN,
   SAVE_SIGNALLIST,
-  SAVE_DEVICE
+  SAVE_DEVICE,
+  UPDATE_SCALE
 } from './mutation-types'
 
 import storageUtils from "../../utils/storageUtils"
@@ -53,5 +54,10 @@ export default {
   // 保存设备数据
   [SAVE_DEVICE] (state,{deviceJson}) {
     state.deviceJson = deviceJson
+  },
+
+  // 更新元素缩放比例
+  [UPDATE_SCALE] (state,{scale}) {
+    state.scale = scale
   }
 }

src/renderer/store/state.js

@@ -1,5 +1,4 @@
 /*状态对象模块*/
-
 export default {
   // 用户信息
   user: {},
@@ -10,39 +9,9 @@ export default {
   // 分屏状态（默认0: 自由屏，1: 4分屏  2：9分屏  3: 16分屏）
   splitScreenStatus: 0,
 
-  // 大屏显示
-  bigScreenJson:[],
-
   // 信号源列表
   signalListJson:[],
 
-  // 信号源外壳
-  signalBorder:EnitySignalPreviewList,
-
-  // 设备数据
-  deviceJson:[],
-
-  // 登录
-  loginJson:[],
-
-  // window窗口
-  windowJson:EnityWindow,
-
-  // button按钮
-  buttonJson:EnityButton,
-
-  // label标签
-  labelJson:EnityLable,
-
-  // 图片
-  imageJson:EnityImage,
-
-  // 滑块组件
-  sliderJson:EnitySlider,
-
-  // ip 端口
-  systemJson:EnitySystem,
-
-  // 缩放比例
-  Scale:window.screen.height/EnityWindow[0].Height
+  // 元素缩放比例
+  scale:1
 }

src/utils/tools.js

@@ -1,4 +1,5 @@
 /*工具函数模块*/
+import axios from 'axios'
 
 // 数组去重
 export function uniq(array){
@@ -32,9 +33,14 @@ export function getElementTop(element){
     return actualTop;
 }
 
-// 获取元素位置的快速方法
-export function fastGetElementPosition(element) {
-    var x = element.getBoundingClientRect().left;
-    var y = element.getBoundingClientRect().top;
-    return {x,y}
+// 通过axios静态获取本地资源
+export function getStaticFile(url) {
+    return new Promise(function (resolve) {
+        let promise
+        promise = axios.get(`static/${url}`)
+
+        promise.then(function (response) {
+            resolve(response.data)
+        })
+    })
 }

static/json/EnityBigScreen.js

@@ -1,4 +1,4 @@
-const EnityBigScreen = [
+[
     {
         "BindList":[
             {

static/json/EnityButton.js

@@ -1,4 +1,4 @@
-const EnityButton = [
+[
   {
     "Name":"V0--Btn6",
     "MouseDownActionList":[

static/json/EnityDevice.js

@@ -1,4 +1,4 @@
-const EnityDevice = [
+[
   {
     "DeviceModelID":"0400001",
     "DeviceModelName":"DY-Audio",

static/json/EnityIcon.js

@@ -1,4 +1,4 @@
-const EnityIcon = [
+[
   {
     "ID":"1",
     "Name":"1.png",

static/json/EnityImage.js

@@ -1,5 +1,4 @@
-const EnityImage
-    = [
+[
   {
     "BackIcon":"161.png",
     "ResourceID":"161",

static/json/EnityLable.js

@@ -1,4 +1,4 @@
-const EnityLable = [
+[
   {
     "Code":"9f2f47a0-6c7c-428f-ae6f-1a4d2101520b",
     "ActionType":5,

static/json/EnityMemory.js

@@ -1,4 +1,4 @@
-const EnityMemory = [
+[
   {
     "ID":"01",
     "Code":"01",

static/json/EnitySignalPreviewList.js

@@ -1,4 +1,4 @@
-const EnitySignalPreviewList = [
+[
   {
     "ForegroundStr":"#FF000000",
     "FontSize":12,

static/json/EnitySlider.js

@@ -1,4 +1,4 @@
-const EnitySlider = [
+[
   {
     "BackIcon":"77.png",
     "SliderIcon":"76.png",

static/json/EnitySystem.js

@@ -1,4 +1,4 @@
-const EnitySystem = {
+{
   "ServerIP":"http://112.74.78.188",
   "ServerPort":8080,
   "Users":[

static/json/EnityTimer.js

@@ -1,4 +1,4 @@
-const EnityTimer = [
+[
   {
     "ID":"f5f1217e-f606-4372-8650-4363931fa8e1",
     "Code":"f5f1217e-f606-4372-8650-4363931fa8e1",

static/json/EnityTopology.js

@@ -1,4 +1,4 @@
-const EnityTopology = [
+[
   {
     "ID":"2c0d93d3-32db-48cb-8a81-ca119264dc61",
     "DeviceID":"fb9bf45d-1ef9-4759-87bd-68aeb43f90bf",

static/json/EnityTopologyConnection.js

@@ -1,4 +1,4 @@
-const EnityTopologyConnection = [
+[
   {
     "ID":"df81e3a0-045f-4f83-9ffe-4e36813ee41a",
     "SourceID":"2c0d93d3-32db-48cb-8a81-ca119264dc61",

static/EnityView.Data

@@ -0,0 +1 @@
+[]

static/json/EnityWindow.js

@@ -1,4 +1,4 @@
-const EnityWindow = [
+[
   {
     "ID":"64a2f252-370a-4bc6-a817-3397f8abb4dc",
     "IsVisibility":true,

static/json/EnityLogin.js

@@ -1,35 +0,0 @@
-const EnityLogin = [
-    {
-        "IsBorder":true,
-        "BorderStr":"#FFFFFFFF",
-        "ForegroundStr":"#FFD6D6D6",
-        "BTNForegroundStr":"#FF000000",
-        "BrackgroupStr":"#FF03A9F4",
-        "BackIconObjID":"",
-        "BackIcon":null,
-        "ActionIconObjID":"",
-        "ActionIcon":null,
-        "FontSize":16,
-        "IsPanel":false,
-        "ValidatType":1,
-        "EnityName":"Login",
-        "VerifyPassActionList":[
-
-        ],
-        "ID":"cb3c80b1-f1e4-459d-88ae-e2979666b5e3",
-        "Name":"V1--Login0",
-        "Left":294,
-        "Top":194,
-        "Width":411,
-        "Height":266,
-        "ZIndex":20100,
-        "GroupNumber":"",
-        "IsRunVisiable":true,
-        "IsVisibility":false,
-        "isSyn":false,
-        "WindowID":"b7872c9a-45ec-46c6-a388-f8d364a9f2d7",
-        "PanelID":null,
-        "IsLock":false,
-        "IsWindow":false
-    }
-]

static/json/EnityView.js

@@ -1 +0,0 @@
-const EnityView = []