|
|
@@ -21,10 +21,24 @@
|
|
|
display:item.IsVisibility ? 'black' : 'none',
|
|
|
}"
|
|
|
>
|
|
|
- <div v-for="(item,index) in signalPreList" :key="index" :class="item.showName ? 'sitem' : 'sitem2'" ref="signal">
|
|
|
+ <!--<div
|
|
|
+ v-for="(item,index) in signalPreList" :key="index" :class="item.showName ? 'sitem' : 'sitem2'" ref="signal">
|
|
|
{{item.showName ? item.showName : item}}
|
|
|
<div class="doubleArrow"></div>
|
|
|
- </div>
|
|
|
+ </div>-->
|
|
|
+
|
|
|
+
|
|
|
+ <VueDragResize
|
|
|
+ v-for="itemV in signalPreList" :key="itemV.deviceID" class="sitem" ref="signal"
|
|
|
+ :w="item.Width/(splitScreenStatus+1)" :h="item.Height/(splitScreenStatus+1)"
|
|
|
+ >
|
|
|
+ {{itemV.showName}}
|
|
|
+ </VueDragResize >
|
|
|
+
|
|
|
+ <div v-for="(itemD,index) in divArr" :key="index" class="sitem2" ref="signal">
|
|
|
+ {{itemD}}
|
|
|
+ </div >
|
|
|
+
|
|
|
</draggable>
|
|
|
</div>
|
|
|
</template>
|
|
|
@@ -32,6 +46,7 @@
|
|
|
<script>
|
|
|
import {mapState} from 'vuex'
|
|
|
import draggable from 'vuedraggable'
|
|
|
+ import VueDragResize from 'vue-drag-resize'
|
|
|
import '../assets/less/splitscreen.less'
|
|
|
import {getElementLeft, getElementTop} from "../../utils/tools"
|
|
|
import {reqRefreshView} from "../api"
|
|
|
@@ -46,6 +61,7 @@
|
|
|
|
|
|
components: {
|
|
|
draggable,
|
|
|
+ VueDragResize
|
|
|
},
|
|
|
|
|
|
methods: {
|
|
|
@@ -90,6 +106,13 @@
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
+
|
|
|
+ resize(newRect) {
|
|
|
+ this.width = newRect.width;
|
|
|
+ this.height = newRect.height;
|
|
|
+ this.top = newRect.top;
|
|
|
+ this.left = newRect.left;
|
|
|
+ }
|
|
|
},
|
|
|
|
|
|
computed: {
|
|
|
@@ -100,8 +123,8 @@
|
|
|
return this.$store.state.signalPreList
|
|
|
},
|
|
|
set(arr) {
|
|
|
- const signalArr = [...arr,...this.divArr]
|
|
|
- this.$store.dispatch('updateSignalPreList',signalArr)
|
|
|
+ // const signalArr = [...arr,...this.divArr]
|
|
|
+ this.$store.dispatch('updateSignalPreList',arr)
|
|
|
}
|
|
|
},
|
|
|
|
|
|
@@ -137,9 +160,10 @@
|
|
|
for (let i=0;i<(num+1)*(num+1);i++){
|
|
|
this.$data.divArr.push(i+1)
|
|
|
}
|
|
|
- this.$store.dispatch('updateSignalPreList',this.$data.divArr)
|
|
|
|
|
|
- const arr = this.$store.state.signalPreList
|
|
|
+ // this.$store.dispatch('updateSignalPreList',this.$data.divArr)
|
|
|
+
|
|
|
+ // const arr = this.$store.state.signalPreList
|
|
|
// this.reqRefreshBigScreen(arr)
|
|
|
}
|
|
|
}
|
