Admin.vue 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101
  1. <!--管理界面-->
  2. <template>
  3. <div class="containers">
  4. <!--主页-->
  5. <div
  6. :style="{
  7. position: 'relative',
  8. left:windowJson[0] ? windowJson[0].Left*bigScale+'px' : '',
  9. top:windowJson[0] ? windowJson[0].Top*bigScale+'px' : '',
  10. width:windowJson[0] ? windowJson[0].Width*bigScale + 'px' : '',
  11. height:windowJson[0] ? windowJson[0].Height*bigScale + 'px' : '',
  12. zIndex:windowJson[0] ? windowJson[0].ZIndex : '',
  13. display:windowJson[0] ? (windowJson[0].IsVisibility ? 'block' : 'none') : '',
  14. backgroundRepeat:'no-repeat',
  15. backgroundSize:'100% 100%',
  16. backgroundColor:`#${windowJson[0] ? (windowJson[0].BrackgroupStr ? windowJson[0].BrackgroupStr.slice(3) : null) : ''}`,
  17. margin:'0 auto'}"
  18. ref="mainpage"
  19. >
  20. <!--按钮-->
  21. <ButtonComponent />
  22. <!--大屏显示-->
  23. <BigShowComponent />
  24. <!--label标签-->
  25. <LabelComponent />
  26. <!--图片-->
  27. <ImageComponent />
  28. <!--信号源列表-->
  29. <SignalListComponent />
  30. <!--滑块-->
  31. <SliderComponent />
  32. </div>
  33. <!--最小化和关闭按钮-->
  34. <div class="mini" @click="miniWindow">-</div>
  35. <div class="close" @click="closeWindow">×</div>
  36. </div>
  37. </template>
  38. <script>
  39. import {mapState} from 'vuex'
  40. import storageUtils from "../../utils/storageUtils"
  41. import '../assets/less/mainpage.less'
  42. import ButtonComponent from './Button'
  43. import LabelComponent from './Label'
  44. import BigShowComponent from './BigShow'
  45. import SignalListComponent from './SignalList'
  46. import ImageComponent from './Image'
  47. import SliderComponent from './Slider'
  48. import {getStaticFile} from "../../utils/tools"
  49. export default {
  50. components: {
  51. ButtonComponent,
  52. LabelComponent,
  53. BigShowComponent,
  54. SignalListComponent,
  55. ImageComponent,
  56. SliderComponent,
  57. },
  58. data() {
  59. return {
  60. user: storageUtils.getUser(), // 本地存储的用户
  61. windowJson:[], // 主窗口配置文件
  62. staticUrl:this.$store.state.staticUrl
  63. }
  64. },
  65. async beforeCreate() {
  66. const result = await getStaticFile('EnityWindow.Data')
  67. this.windowJson = result.filter(item => item.IsVisibility === true)
  68. },
  69. updated() {
  70. // 添加背景图片
  71. this.$refs.mainpage.style.backgroundImage = this.windowJson[0].BackIcon ? 'url('+`${this.staticUrl}/Data/${this.windowJson[0].BackIcon}`+')' : null
  72. },
  73. methods: {
  74. // 最小化窗口
  75. miniWindow() {
  76. require('electron').ipcRenderer.send('window-min')
  77. },
  78. // 关闭窗口
  79. closeWindow() {
  80. require('electron').ipcRenderer.send('window-close')
  81. },
  82. },
  83. computed: {
  84. ...mapState(['bigScale'])
  85. }
  86. }
  87. </script>