信号源列表增加播放视频功能

src/renderer/components/SignalList.vue

@@ -33,7 +33,12 @@
         >
             <div class="signal_item_bg">
                 <div class="signal_item_bg_body">
-                    <div class="signal_item_bg_body_space"></div>
+                    <div v-show="item.preview" class="signal_item_bg_body_space">
+                        <VideoPlayer
+                                :options="videoPlayObj[item.sourceId]"
+                                :playsinline="true"
+                        />
+                    </div>
                     <div class="signal_item_bg_body_font">{{item.deviceName}}</div>
                 </div>
             </div>
@@ -45,25 +50,50 @@
     import {mapState} from 'vuex'
     import draggable from 'vuedraggable'
     import {getStaticFile} from "../../utils/tools"
+    import VideoPlayer from "./player"
 
     export default {
         data() {
             return {
-                signalBorder:[]
+                signalBorder: [], // 信号源容器
+                videoPlayObj: {}, // 视频播放配置对象
             }
         },
 
         components: {
-            draggable
+            draggable,
+            VideoPlayer
         },
 
         async beforeCreate() {
             this.signalBorder = await getStaticFile('EnitySignalPreviewList.Data')
         },
 
+        beforeUpdate() {
+            const signalList = this.$store.state.signalListJson
+            const videoPlayObj = {}
+            for (const item of signalList) {
+                videoPlayObj[item.sourceId] = {
+                    sources: [
+                        {
+                            "src": item.previewUrl,
+                            "type": "rtmp/flv"
+                        }
+                    ],
+                    techOrder: ['flash'],
+                    autoplay: true,
+                    controls: false,
+                    fluid: true,
+                    preload: 'auto',
+                    notSupportedMessage: '此视频暂无法播放，请稍后再试',
+                }
+            }
+            this.videoPlayObj = videoPlayObj
+        },
+
         updated() {
             const flag = this.signalBorder[0] ? (this.signalBorder[0].Orientation === 0 ? 'column' : 'row') : ''
-            if(flag === 'column'){
+            if (flag === 'column') {
                 document.getElementById('signalContainer').style.alignItems = 'center'
             }
         },
@@ -72,7 +102,7 @@
             // 移动信号源
             onMove({relatedContext, draggedContext}) {
                 // 更新当前操作大屏ID
-                this.$store.dispatch('updateCurBigscreenId',relatedContext.component.$el.id)
+                this.$store.dispatch('updateCurBigscreenId', relatedContext.component.$el.id)
 
                 const relatedElement = relatedContext.element
                 const draggedElement = draggedContext.element
@@ -84,14 +114,14 @@
             end: function (evt) {
                 const bigscreenObj = this.$store.state.bigScreenObj
                 let len = bigscreenObj[evt.to.id] ? bigscreenObj[evt.to.id].signalArr.length : 0
-                const count = evt.newIndex+1-len>0 ? evt.newIndex+1-len : 1
+                const count = evt.newIndex + 1 - len > 0 ? evt.newIndex + 1 - len : 1
                 // 更新当前拖拽的位置
-                this.$store.dispatch('updatePositionNum',count)
+                this.$store.dispatch('updatePositionNum', count)
             },
         },
 
         computed: {
-            ...mapState(['signalListJson','bigScale','signalPreList']),
+            ...mapState(['signalListJson', 'bigScale', 'signalPreList']),
             dragOptions1() {
                 return {
                     animation: 0,
@@ -100,7 +130,7 @@
                         pull: 'clone',
                         put: false
                     },
-                    sort:false,
+                    sort: false,
                     ghostClass: "ghost",
                 }
             },

static/Data/EnityLogin.Data

@@ -1,35 +1 @@
-[
-    {
-        "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/Data/EnityMemory.Data

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

static/Data/EnitySlider.Data

@@ -1,230 +1 @@
-[
-  {
-    "BackIcon":"77.png",
-    "SliderIcon":"76.png",
-    "Orientation":0,
-    "InitValue":0,
-    "SliderFrequency":10,
-    "MinValue":1,
-    "MaxValue":100,
-    "DevCode":null,
-    "Channel":0,
-    "VolMargin":"5",
-    "SliderMargin":"0",
-    "ShowVol":true,
-    "imgBgWidth":67,
-    "imgBgHeight":215,
-    "imgSliderWidth":33,
-    "imgSliderHeight":54,
-    "Cmd":null,
-    "BindVar":null,
-    "DeviceID":null,
-    "IsPanel":false,
-    "EnityName":"Slider",
-    "ID":"b3539067-d6ea-4dbf-9e43-fd6d043f8684",
-    "Name":"Slider0",
-    "Left":244,
-    "Top":472,
-    "Width":54,
-    "Height":226,
-    "ZIndex":10600,
-    "GroupNumber":"",
-    "IsRunVisiable":true,
-    "IsVisibility":false,
-    "isSyn":true,
-    "WindowID":"cb2687fd-931a-4b38-a76d-9c3ea171b8d8",
-    "PanelID":null,
-    "IsLock":false,
-    "IsWindow":false
-  },
-  {
-    "BackIcon":"77.png",
-    "SliderIcon":"76.png",
-    "Orientation":0,
-    "InitValue":0,
-    "SliderFrequency":10,
-    "MinValue":1,
-    "MaxValue":100,
-    "DevCode":null,
-    "Channel":0,
-    "VolMargin":"6",
-    "SliderMargin":"0",
-    "ShowVol":true,
-    "imgBgWidth":67,
-    "imgBgHeight":215,
-    "imgSliderWidth":33,
-    "imgSliderHeight":54,
-    "Cmd":null,
-    "BindVar":null,
-    "DeviceID":null,
-    "IsPanel":false,
-    "EnityName":"Slider",
-    "ID":"228f105d-ebe4-45ba-a072-a1196bf6030e",
-    "Name":"Slider1",
-    "Left":307,
-    "Top":471,
-    "Width":56,
-    "Height":226,
-    "ZIndex":10900,
-    "GroupNumber":"",
-    "IsRunVisiable":true,
-    "IsVisibility":false,
-    "isSyn":true,
-    "WindowID":"cb2687fd-931a-4b38-a76d-9c3ea171b8d8",
-    "PanelID":null,
-    "IsLock":false,
-    "IsWindow":false
-  },
-  {
-    "BackIcon":"77.png",
-    "SliderIcon":"76.png",
-    "Orientation":0,
-    "InitValue":0,
-    "SliderFrequency":10,
-    "MinValue":1,
-    "MaxValue":100,
-    "DevCode":null,
-    "Channel":0,
-    "VolMargin":"6",
-    "SliderMargin":"0",
-    "ShowVol":true,
-    "imgBgWidth":67,
-    "imgBgHeight":215,
-    "imgSliderWidth":33,
-    "imgSliderHeight":54,
-    "Cmd":null,
-    "BindVar":null,
-    "DeviceID":null,
-    "IsPanel":false,
-    "EnityName":"Slider",
-    "ID":"a4ada37c-c564-45fe-a049-48650cf7d66e",
-    "Name":"Slider2",
-    "Left":374,
-    "Top":472,
-    "Width":61,
-    "Height":226,
-    "ZIndex":11000,
-    "GroupNumber":"",
-    "IsRunVisiable":true,
-    "IsVisibility":false,
-    "isSyn":true,
-    "WindowID":"cb2687fd-931a-4b38-a76d-9c3ea171b8d8",
-    "PanelID":null,
-    "IsLock":false,
-    "IsWindow":false
-  },
-  {
-    "BackIcon":"77.png",
-    "SliderIcon":"76.png",
-    "Orientation":0,
-    "InitValue":0,
-    "SliderFrequency":10,
-    "MinValue":1,
-    "MaxValue":100,
-    "DevCode":null,
-    "Channel":0,
-    "VolMargin":"6",
-    "SliderMargin":"0",
-    "ShowVol":true,
-    "imgBgWidth":67,
-    "imgBgHeight":215,
-    "imgSliderWidth":33,
-    "imgSliderHeight":54,
-    "Cmd":null,
-    "BindVar":null,
-    "DeviceID":null,
-    "IsPanel":false,
-    "EnityName":"Slider",
-    "ID":"42cf859e-bcd1-43b2-8eb0-63964eeab067",
-    "Name":"Slider3",
-    "Left":449,
-    "Top":472,
-    "Width":61,
-    "Height":227,
-    "ZIndex":11200,
-    "GroupNumber":"",
-    "IsRunVisiable":true,
-    "IsVisibility":false,
-    "isSyn":true,
-    "WindowID":"cb2687fd-931a-4b38-a76d-9c3ea171b8d8",
-    "PanelID":null,
-    "IsLock":false,
-    "IsWindow":false
-  },
-  {
-    "BackIcon":"77.png",
-    "SliderIcon":"76.png",
-    "Orientation":0,
-    "InitValue":0,
-    "SliderFrequency":10,
-    "MinValue":1,
-    "MaxValue":100,
-    "DevCode":null,
-    "Channel":0,
-    "VolMargin":"6",
-    "SliderMargin":"0",
-    "ShowVol":true,
-    "imgBgWidth":67,
-    "imgBgHeight":215,
-    "imgSliderWidth":33,
-    "imgSliderHeight":54,
-    "Cmd":null,
-    "BindVar":null,
-    "DeviceID":null,
-    "IsPanel":false,
-    "EnityName":"Slider",
-    "ID":"87f9e83f-38a5-4db6-82ca-76edc5a32e05",
-    "Name":"Slider4",
-    "Left":520,
-    "Top":472,
-    "Width":62,
-    "Height":230,
-    "ZIndex":11600,
-    "GroupNumber":"",
-    "IsRunVisiable":true,
-    "IsVisibility":false,
-    "isSyn":true,
-    "WindowID":"cb2687fd-931a-4b38-a76d-9c3ea171b8d8",
-    "PanelID":null,
-    "IsLock":false,
-    "IsWindow":false
-  },
-  {
-    "BackIcon":"77.png",
-    "SliderIcon":"76.png",
-    "Orientation":0,
-    "InitValue":0,
-    "SliderFrequency":10,
-    "MinValue":1,
-    "MaxValue":100,
-    "DevCode":null,
-    "Channel":0,
-    "VolMargin":"6",
-    "SliderMargin":"0",
-    "ShowVol":true,
-    "imgBgWidth":67,
-    "imgBgHeight":215,
-    "imgSliderWidth":33,
-    "imgSliderHeight":54,
-    "Cmd":null,
-    "BindVar":null,
-    "DeviceID":null,
-    "IsPanel":false,
-    "EnityName":"Slider",
-    "ID":"96b74f03-87ce-48cf-80d8-718d21059530",
-    "Name":"Slider5",
-    "Left":593,
-    "Top":472,
-    "Width":59,
-    "Height":225,
-    "ZIndex":11700,
-    "GroupNumber":"",
-    "IsRunVisiable":true,
-    "IsVisibility":false,
-    "isSyn":true,
-    "WindowID":"cb2687fd-931a-4b38-a76d-9c3ea171b8d8",
-    "PanelID":null,
-    "IsLock":false,
-    "IsWindow":false
-  }
-]
+[]

static/Data/EnityTimer.Data

@@ -1,16 +1 @@
-[
-  {
-    "ID":"f5f1217e-f606-4372-8650-4363931fa8e1",
-    "Code":"f5f1217e-f606-4372-8650-4363931fa8e1",
-    "Name":"500ms",
-    "ActionType":0,
-    "Milliseconds":500
-  },
-  {
-    "ID":"08be426e-f9ae-469c-8ea3-ab41403c9f47",
-    "Code":"08be426e-f9ae-469c-8ea3-ab41403c9f47",
-    "Name":"1s",
-    "ActionType":0,
-    "Milliseconds":1000
-  }
-]
+[{"ID":"d4469bbc-3ef3-4912-85a1-c43059b90b54","Code":"d4469bbc-3ef3-4912-85a1-c43059b90b54","Name":"延时1","ActionType":0,"Milliseconds":500},{"ID":"736ecb94-11a7-4315-9045-7f4f50fb2d89","Code":"736ecb94-11a7-4315-9045-7f4f50fb2d89","Name":"电源延时","ActionType":0,"Milliseconds":10000},{"ID":"bf9c0da6-85d0-4d9f-847c-130d34be7d12","Code":"bf9c0da6-85d0-4d9f-847c-130d34be7d12","Name":"会商延时","ActionType":0,"Milliseconds":1000}]

static/Data/EnityView.Data

@@ -1 +1 @@
-[]
+[]

static/Data2/EnityLogin.Data

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

static/Data2/EnityMemory.Data

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

static/Data2/EnitySlider.Data

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

static/Data2/EnitySystem.data

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

static/Data2/EnityTimer.Data

@@ -1 +0,0 @@
-[{"ID":"d4469bbc-3ef3-4912-85a1-c43059b90b54","Code":"d4469bbc-3ef3-4912-85a1-c43059b90b54","Name":"延时1","ActionType":0,"Milliseconds":500},{"ID":"736ecb94-11a7-4315-9045-7f4f50fb2d89","Code":"736ecb94-11a7-4315-9045-7f4f50fb2d89","Name":"电源延时","ActionType":0,"Milliseconds":10000},{"ID":"bf9c0da6-85d0-4d9f-847c-130d34be7d12","Code":"bf9c0da6-85d0-4d9f-847c-130d34be7d12","Name":"会商延时","ActionType":0,"Milliseconds":1000}]

static/Data2/EnityView.Data

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