初始分屏默认为bigshow中的bindList的数量

.electron-vue/webpack.renderer.config.js

@@ -71,9 +71,10 @@ let rendererConfig = {
         use: {
           loader: 'url-loader',
           query: {
-            limit: 10000,
+            // limit: 10000,
             // name: 'imgs/[name]--[folder].[ext]'
-            name: 'imgs/[name].[ext]'
+            // name: 'imgs/[name].[ext]'
+            name: 'static/Data/[name].[ext]'
           }
         }
       },

src/renderer/assets/less/splitscreen.less

@@ -14,9 +14,8 @@
   .sitem {
     border: 1px solid #000000;
     color:#fff;
-    //background-color: #717171;
-    background-color: #000000;
     position: relative;
+    background-color: #717171;
 
     // 关闭信号源开窗按钮
     .closeBtn {
@@ -48,27 +47,27 @@
 /*1分屏*/
 .split_screen_one {
   display: grid;
-  grid-template-columns: repeat(1,100%);
-  grid-template-rows: repeat(1,100%);
+  grid-template-columns: repeat(1,1fr);
+  grid-template-rows: repeat(1,1fr);
 }
 
 /*4分屏*/
 .split_screen_four {
   display: grid;
-  grid-template-columns: repeat(2,50%);
-  grid-template-rows: repeat(2,50%);
+  grid-template-columns: repeat(2,1fr);
+  grid-template-rows: repeat(2,1fr);
 }
 
 /*9分屏*/
 .split_screen_nine {
   display: grid;
-  grid-template-columns: repeat(3,33.333333%);
-  grid-template-rows: repeat(3,33.333333%);
+  grid-template-columns: repeat(3,1fr);
+  grid-template-rows: repeat(3,1fr);
 }
 
 /*16分屏*/
 .split_screen_sixteen {
   display: grid;
-  grid-template-columns: repeat(4,25%);
-  grid-template-rows: repeat(4,25%);
+  grid-template-columns: repeat(4,1fr);
+  grid-template-rows: repeat(4,1fr);
 }

src/renderer/components/Admin.vue

@@ -11,7 +11,7 @@
                 height:windowJson[0] ? windowJson[0].Height*bigScale + 'px' : '',
                 zIndex:windowJson[0] ? windowJson[0].ZIndex : '',
                 display:windowJson[0] ? (windowJson[0].IsVisibility ? 'block' : 'none') : '',
-                backgroundImage:windowJson[0] ? (windowJson[0].BackIcon ? 'url('+require(`../../../static/Data/${windowJson[0].BackIcon}`)+')' : null) : '',
+                backgroundImage:windowJson[0] ? (windowJson[0].BackIcon ? 'url('+require(`static/Data/${windowJson[0].BackIcon}`)+')' : null) : '',
                 backgroundRepeat:'no-repeat',
                 backgroundSize:'100% 100%',
                 backgroundColor:`#${windowJson[0] ? (windowJson[0].BrackgroupStr ? windowJson[0].BrackgroupStr.slice(3) : null) : ''}`,

src/renderer/components/BigShow.vue

@@ -28,24 +28,25 @@
                     @resizestop="(obj) => reSizeSignal(obj,itemV)"
             >
                 <div ref="signal">
-                    <div class="closeBtn" @click.stop="closeSignal(itemV)">×</div>
+                    {{itemV.deviceID}}
+                    <!--<div class="closeBtn" @click.stop="closeSignal(itemV)">×</div>
                     <video-player
                             ref="videoPlayer"
                             :options="playerOptions"
                             :playsinline="true"
                     >
-                    </video-player>
+                    </video-player>-->
                 </div>
             </VueDragResize>
 
-            <div v-for="itemD in divArr" :key="itemD" class="sitem2">
+            <div v-for="itemD in bindList" :key="itemD" class="sitem2">
                 {{itemD}}
             </div>
 
-            <!--<div v-for="item in [...signalPreList,...divArr]">
+            <!--<div v-for="item in [...signalPreList,...bindList]">
                 <VueDragResize
-                        v-if="item.deviceID" :key="item" class="sitem"
-                        :w="item.Width*bigScale/item.splitdeviceIDScreenStatus" :h="item.Height*bigScale/item.splitScreenStatus"
+                        v-if="item.deviceID" :key="item.Id" class="sitem"
+                        :w="item.Width*bigScale/item.splitScreenStatus" :h="item.Height*bigScale/item.splitScreenStatus"
                         @dragstop="dragStop"
                         @resizestop="(obj) => reSizeSignal(obj,item)"
                 >
@@ -83,7 +84,7 @@
         data() {
             return {
                 isDragging: false, // 是否可拖动标志
-                divArr:[],// 默认大屏中盒子的数组
+                bindList:[], // 拼接屏的数量
                 streamWindows:[], // 传递出去的信号源位置信息
                 bigScreenJson:[], // 大屏配置json文件
                 playerOptions: { // rtmp视频流配置
@@ -101,7 +102,6 @@
                     preload: 'auto',
                     notSupportedMessage: '此视频暂无法播放，请稍后再试',
                 },
-                allDiv:[], // 大屏中所有的盒子（包括普通div和信号源列表）
             }
         },
 
@@ -114,6 +114,11 @@
         async beforeCreate() {
             this.bigScreenJson = await getStaticFile('EnityBigScreen.Data')
             this.currentBigshow = this.bigScreenJson.filter(item => item.IsVisibility === true)
+            const num = this.currentBigshow[0].BindList.length
+            for(let i=0;i<num;i++){
+                this.$data.bindList.push(i+1)
+            }
+            this.$store.dispatch('splitScreen', Math.sqrt(num)-1)
         },
 
         methods: {
@@ -249,9 +254,9 @@
 
             // 监视分屏的状态
             splitScreenStatus: function(num) {
-                this.$data.divArr = []
+                this.$data.bindList = []
                 for (let i=0;i<(num+1)*(num+1);i++){
-                    this.$data.divArr.push(i+1)
+                    this.$data.bindList.push(i+1)
                 }
                 this.reqRefreshBigScreen(this.$data.streamWindows)
             }

src/renderer/components/Button.vue

@@ -75,6 +75,7 @@
         methods: {
             // 点击按钮
             clickBtn(e) {
+                console.log(e)
                 // 预案管理声音开关
                 if (e.ID === '355d3c32-1502-40b4-9ddd-663d5b8469e7') {
                     if (this.count % 2 === 0) {

static/Data2/EnityIcon.Data

@@ -0,0 +1 @@
+[{"ID":"1","Name":"Koala.jpg","Path":"1.jpg"}]

static/Data2/EnityImage.Data

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

static/Data2/EnityLable.Data

@@ -0,0 +1 @@
+[{"Code":"51e036f0-8c5e-463b-9705-d12b0ba047e3","ActionType":5,"Text":"文字文字文字文字文字文字","ForegroundStr":"#FFFF0000","FontSize":40,"IsShow":false,"IsPanel":false,"EnityName":"Lable","ID":"51e036f0-8c5e-463b-9705-d12b0ba047e3","Name":"文字","Left":212,"Top":100,"Width":554,"Height":72,"ZIndex":300,"GroupNumber":"","IsRunVisiable":true,"IsVisibility":true,"isSyn":false,"WindowID":"3d2600a6-23e0-4f22-be51-d1597d7c223a","PanelID":null,"IsLock":false,"IsWindow":false}]

static/Data2/EnityLogin.Data

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

static/Data2/EnityMemory.Data

@@ -0,0 +1 @@
+[{"ID":"01","Code":"01","Name":"LoginUser","isInt":false,"Value":null,"IsSyn":false,"IsSystem":true,"Mark":null,"ActionType":4},{"ID":"02","Code":"02","Name":"LoginRole","isInt":false,"Value":null,"IsSyn":false,"IsSystem":true,"Mark":null,"ActionType":4}]

static/Data2/EnitySlider.Data

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

static/Data2/EnitySystem.data

@@ -0,0 +1,7 @@
+{
+  "ServerIP":"http://112.74.78.188",
+  "ServerPort":8080,
+  "Users":[
+
+  ]
+}

static/Data2/EnityTimer.Data

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

static/Data2/EnityView.Data

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

static/Data2/测试.prj

@@ -0,0 +1 @@
+{"Name":"测试","DevWidth":1920,"DevHeight":1080,"UIAdaption":0}