Commit 5fae9a7b34cc096d6becc514f3dd6e6fa6606451

Authored by 648540858
1 parent c801ee62

优化列表展示效果

src/main/java/com/genersoft/iot/vmp/service/impl/GbStreamServiceImpl.java
... ... @@ -106,7 +106,8 @@ public class GbStreamServiceImpl implements IGbStreamService {
106 106 deviceChannel.setStatus(1);
107 107 deviceChannel.setParentId(catalogId ==null?gbStream.getCatalogId():catalogId);
108 108 deviceChannel.setRegisterWay(1);
109   - if (catalogId.length() <= 10) { // 父节点是行政区划,则设置CivilCode使用此行政区划
  109 + if (catalogId.length() > 0 && catalogId.length() <= 10) {
  110 + // 父节点是行政区划,则设置CivilCode使用此行政区划
110 111 deviceChannel.setCivilCode(catalogId);
111 112 }else {
112 113 deviceChannel.setCivilCode(platform.getAdministrativeDivision());
... ...
web_src/src/components/CloudRecord.vue
... ... @@ -18,19 +18,17 @@
18 18 <div v-if="!recordDetail">
19 19  
20 20 <!--设备列表-->
21   - <el-table :data="recordList" border style="width: 100%" :height="winHeight">
22   - <el-table-column prop="app" label="应用名" align="center">
  21 + <el-table :data="recordList" style="width: 100%" :height="winHeight">
  22 + <el-table-column prop="app" label="应用名" >
23 23 </el-table-column>
24   - <el-table-column prop="stream" label="流ID" align="center">
  24 + <el-table-column prop="stream" label="流ID" >
25 25 </el-table-column>
26   - <el-table-column prop="time" label="时间" align="center">
  26 + <el-table-column prop="time" label="时间" >
27 27 </el-table-column>
28   - <el-table-column label="操作" width="360" align="center" fixed="right">
  28 + <el-table-column label="操作" width="360" fixed="right">
29 29 <template slot-scope="scope">
30   - <el-button-group>
31   - <el-button size="mini" icon="el-icon-video-camera-solid" type="primary" @click="showRecordDetail(scope.row)">查看</el-button>
32   - <!-- <el-button size="mini" icon="el-icon-delete" type="danger" @click="deleteRecord(scope.row)">删除</el-button>-->
33   - </el-button-group>
  30 + <el-button size="medium" icon="el-icon-folder-opened" type="text" @click="showRecordDetail(scope.row)">查看</el-button>
  31 + <!-- <el-button size="mini" icon="el-icon-delete" type="danger" @click="deleteRecord(scope.row)">删除</el-button>-->
34 32 </template>
35 33 </el-table-column>
36 34 </el-table>
... ...
web_src/src/components/DeviceList.vue
... ... @@ -7,34 +7,33 @@
7 7 @click="getDeviceList()"></el-button>
8 8 </div>
9 9 </div>
10   - <!-- <devicePlayer ref="devicePlayer"></devicePlayer> -->
11 10 <!--设备列表-->
12 11 <el-table :data="deviceList" style="width: 100%;font-size: 12px;" :height="winHeight" header-row-class-name="table-header">
13   - <el-table-column prop="name" label="名称" >
  12 + <el-table-column prop="name" label="名称" min-width="160">
14 13 </el-table-column>
15   - <el-table-column prop="deviceId" label="设备编号" width="180" >
  14 + <el-table-column prop="deviceId" label="设备编号" min-width="200" >
16 15 </el-table-column>
17   - <el-table-column label="地址" width="180" >
  16 + <el-table-column label="地址" min-width="160" >
18 17 <template slot-scope="scope">
19 18 <div slot="reference" class="name-wrapper">
20 19 <el-tag size="medium">{{ scope.row.hostAddress }}</el-tag>
21 20 </div>
22 21 </template>
23 22 </el-table-column>
24   - <el-table-column prop="manufacturer" label="厂家" >
  23 + <el-table-column prop="manufacturer" label="厂家" min-width="120" >
25 24 </el-table-column>
26   - <el-table-column label="流传输模式" width="120">
  25 + <el-table-column label="流传输模式" min-width="160" >
27 26 <template slot-scope="scope">
28   - <el-select size="mini" @change="transportChange(scope.row)" v-model="scope.row.streamMode" placeholder="请选择">
  27 + <el-select size="mini" @change="transportChange(scope.row)" v-model="scope.row.streamMode" placeholder="请选择" style="width: 120px">
29 28 <el-option key="UDP" label="UDP" value="UDP"></el-option>
30 29 <el-option key="TCP-ACTIVE" label="TCP主动模式" :disabled="true" value="TCP-ACTIVE"></el-option>
31 30 <el-option key="TCP-PASSIVE" label="TCP被动模式" value="TCP-PASSIVE"></el-option>
32 31 </el-select>
33 32 </template>
34 33 </el-table-column>
35   - <el-table-column prop="channelCount" label="通道数" >
  34 + <el-table-column prop="channelCount" label="通道数" min-width="120" >
36 35 </el-table-column>
37   - <el-table-column label="状态" width="120" >
  36 + <el-table-column label="状态" min-width="120">
38 37 <template slot-scope="scope">
39 38 <div slot="reference" class="name-wrapper">
40 39 <el-tag size="medium" v-if="scope.row.online == 1">在线</el-tag>
... ... @@ -42,32 +41,32 @@
42 41 </div>
43 42 </template>
44 43 </el-table-column>
45   - <el-table-column prop="keepaliveTime" label="最近心跳" width="140">
  44 + <el-table-column prop="keepaliveTime" label="最近心跳" min-width="160" >
46 45 </el-table-column>
47   - <el-table-column prop="registerTime" label="最近注册" width="140">
48   - </el-table-column>
49   - <el-table-column prop="updateTime" label="更新时间" width="140">
50   - </el-table-column>
51   - <el-table-column prop="createTime" label="创建时间" width="140">
  46 + <el-table-column prop="registerTime" label="最近注册" min-width="160">
52 47 </el-table-column>
  48 +<!-- <el-table-column prop="updateTime" label="更新时间" width="140">-->
  49 +<!-- </el-table-column>-->
  50 +<!-- <el-table-column prop="createTime" label="创建时间" width="140">-->
  51 +<!-- </el-table-column>-->
53 52  
54   - <el-table-column label="操作" width="450" fixed="right">
  53 + <el-table-column label="操作" min-width="450" fixed="right">
55 54 <template slot-scope="scope">
56   - <el-button type="text" size="mini" v-bind:disabled="scope.row.online==0" icon="el-icon-refresh" @click="refDevice(scope.row)"
  55 + <el-button type="text" size="medium" v-bind:disabled="scope.row.online==0" icon="el-icon-refresh" @click="refDevice(scope.row)"
57 56 @mouseover="getTooltipContent(scope.row.deviceId)">刷新
58 57 </el-button>
59 58 <el-divider direction="vertical"></el-divider>
60   - <el-button type="text" size="mini" icon="el-icon-video-camera-solid" v-bind:disabled="scope.row.online==0"
  59 + <el-button type="text" size="medium" icon="el-icon-video-camera-solid" v-bind:disabled="scope.row.online==0"
61 60 @click="showChannelList(scope.row)">通道
62 61 </el-button>
63 62 <el-divider direction="vertical"></el-divider>
64   - <el-button size="mini" icon="el-icon-location" v-bind:disabled="scope.row.online==0" type="text"
  63 + <el-button size="medium" icon="el-icon-location" v-bind:disabled="scope.row.online==0" type="text"
65 64 @click="showDevicePosition(scope.row)">定位
66 65 </el-button>
67 66 <el-divider direction="vertical"></el-divider>
68   - <el-button size="mini" icon="el-icon-edit" type="text" @click="edit(scope.row)">编辑</el-button>
  67 + <el-button size="medium" icon="el-icon-edit" type="text" @click="edit(scope.row)">编辑</el-button>
69 68 <el-divider direction="vertical"></el-divider>
70   - <el-button size="mini" icon="el-icon-delete" type="text" @click="deleteDevice(scope.row)" style="color: #f56c6c">删除</el-button>
  69 + <el-button size="medium" icon="el-icon-delete" type="text" @click="deleteDevice(scope.row)" style="color: #f56c6c">删除</el-button>
71 70 </template>
72 71 </el-table-column>
73 72 </el-table>
... ...
web_src/src/components/ParentPlatformList.vue
... ... @@ -4,14 +4,15 @@
4 4 <div class="page-title">上级平台列表</div>
5 5 <div class="page-header-btn">
6 6 <el-button icon="el-icon-plus" size="mini" style="margin-right: 1rem;" type="primary" @click="addParentPlatform">添加</el-button>
  7 + <el-button icon="el-icon-refresh-right" circle size="mini" @click="refresh()"></el-button>
7 8 </div>
8 9 </div>
9 10  
10 11 <!--设备列表-->
11   - <el-table :data="platformList" border style="width: 100%" :height="winHeight">
12   - <el-table-column prop="name" label="名称" align="center"></el-table-column>
13   - <el-table-column prop="serverGBId" label="平台编号" align="center"></el-table-column>
14   - <el-table-column label="是否启用" width="120" align="center">
  12 + <el-table :data="platformList" style="width: 100%" :height="winHeight">
  13 + <el-table-column prop="name" label="名称" ></el-table-column>
  14 + <el-table-column prop="serverGBId" label="平台编号" min-width="200"></el-table-column>
  15 + <el-table-column label="是否启用" min-width="80" >
15 16 <template slot-scope="scope">
16 17 <div slot="reference" class="name-wrapper">
17 18 <el-tag size="medium" v-if="scope.row.enable">已启用</el-tag>
... ... @@ -19,7 +20,7 @@
19 20 </div>
20 21 </template>
21 22 </el-table-column>
22   - <el-table-column label="状态" width="120" align="center">
  23 + <el-table-column label="状态" min-width="80" >
23 24 <template slot-scope="scope">
24 25 <div slot="reference" class="name-wrapper">
25 26 <el-tag size="medium" v-if="scope.row.status">在线</el-tag>
... ... @@ -27,17 +28,17 @@
27 28 </div>
28 29 </template>
29 30 </el-table-column>
30   - <el-table-column label="地址" width="180" align="center">
  31 + <el-table-column label="地址" min-width="160" >
31 32 <template slot-scope="scope">
32 33 <div slot="reference" class="name-wrapper">
33 34 <el-tag size="medium">{{ scope.row.serverIP}}:{{scope.row.serverPort }}</el-tag>
34 35 </div>
35 36 </template>
36 37 </el-table-column>
37   - <el-table-column prop="deviceGBId" label="设备国标编号" width="200" align="center"></el-table-column>
38   - <el-table-column prop="transport" label="信令传输模式" width="120" align="center"></el-table-column>
39   - <el-table-column prop="channelCount" label="通道数" width="120" align="center"></el-table-column>
40   - <el-table-column label="订阅信息" width="240" align="center" fixed="right">
  38 + <el-table-column prop="deviceGBId" label="设备国标编号" min-width="200" ></el-table-column>
  39 + <el-table-column prop="transport" label="信令传输模式" min-width="120" ></el-table-column>
  40 + <el-table-column prop="channelCount" label="通道数" min-width="120" ></el-table-column>
  41 + <el-table-column label="订阅信息" min-width="120" fixed="right">
41 42 <template slot-scope="scope">
42 43 <i v-if="scope.row.alarmSubscribe" style="font-size: 20px" title="报警订阅" class="iconfont icon-gbaojings subscribe-on " ></i>
43 44 <i v-if="!scope.row.alarmSubscribe" style="font-size: 20px" title="报警订阅" class="iconfont icon-gbaojings subscribe-off " ></i>
... ... @@ -48,11 +49,11 @@
48 49 </template>
49 50 </el-table-column>
50 51  
51   - <el-table-column label="操作" width="300" align="center" fixed="right">
  52 + <el-table-column label="操作" min-width="240" fixed="right">
52 53 <template slot-scope="scope">
53   - <el-button size="mini" icon="el-icon-edit" @click="editPlatform(scope.row)">编辑</el-button>
54   - <el-button size="mini" icon="el-icon-share" type="primary" @click="chooseChannel(scope.row)">选择通道</el-button>
55   - <el-button size="mini" icon="el-icon-delete" type="danger" @click="deletePlatform(scope.row)">删除</el-button>
  54 + <el-button size="medium" icon="el-icon-edit" type="text" @click="editPlatform(scope.row)">编辑</el-button>
  55 + <el-button size="medium" icon="el-icon-share" type="text" @click="chooseChannel(scope.row)">选择通道</el-button>
  56 + <el-button size="medium" icon="el-icon-delete" type="text" style="color: #f56c6c" @click="deletePlatform(scope.row)">删除</el-button>
56 57 </template>
57 58 </el-table-column>
58 59 </el-table>
... ... @@ -168,6 +169,9 @@ export default {
168 169 console.log(error);
169 170 });
170 171  
  172 + },
  173 + refresh: function (){
  174 + this.initData();
171 175 }
172 176  
173 177 }
... ...
web_src/src/components/PushVideoList.vue
... ... @@ -34,52 +34,54 @@
34 34 <el-button icon="el-icon-delete" size="mini" style="margin-right: 1rem;"
35 35 :disabled="multipleSelection.length === 0" type="danger" @click="batchDel">批量移除
36 36 </el-button>
  37 + <el-button icon="el-icon-refresh-right" circle size="mini" @click="refresh()"></el-button>
37 38 </div>
38 39 </div>
39 40 <devicePlayer ref="devicePlayer"></devicePlayer>
40 41 <addStreamTOGB ref="addStreamTOGB"></addStreamTOGB>
41   - <el-table ref="pushListTable" :data="pushList" border style="width: 100%" :height="winHeight"
  42 + <el-table ref="pushListTable" :data="pushList" style="width: 100%" :height="winHeight"
42 43 @selection-change="handleSelectionChange" :row-key="(row)=> row.app + row.stream">
43   - <el-table-column align="center" type="selection" :reserve-selection="true" width="55">
  44 + <el-table-column type="selection" :reserve-selection="true" min-width="55">
44 45 </el-table-column>
45   - <el-table-column prop="name" label="名称" align="center">
  46 + <el-table-column prop="name" label="名称" min-width="200">
46 47 </el-table-column>
47   - <el-table-column prop="app" label="APP" align="center">
  48 + <el-table-column prop="app" label="APP" min-width="200">
48 49 </el-table-column>
49   - <el-table-column prop="stream" label="流ID" align="center">
  50 + <el-table-column prop="stream" label="流ID" min-width="200">
50 51 </el-table-column>
51   - <el-table-column prop="gbId" label="国标编码" width="200" align="center">
  52 + <el-table-column prop="gbId" label="国标编码" min-width="200" >
52 53 </el-table-column>
53   - <el-table-column prop="mediaServerId" label="流媒体" width="200" align="center">
  54 + <el-table-column prop="mediaServerId" label="流媒体" min-width="200" >
54 55 </el-table-column>
55   - <el-table-column label="开始时间" align="center" width="200">
  56 + <el-table-column label="开始时间" min-width="200">
56 57 <template slot-scope="scope">
57 58 <el-button-group>
58 59 {{ dateFormat(parseInt(scope.row.createStamp)) }}
59 60 </el-button-group>
60 61 </template>
61 62 </el-table-column>
62   - <el-table-column label="正在推流" align="center" width="100">
  63 + <el-table-column label="正在推流" min-width="100">
63 64 <template slot-scope="scope">
64 65 {{ (scope.row.status == false && scope.row.gbId == null) || scope.row.status ? '是' : '否' }}
65 66 </template>
66 67 </el-table-column>
67 68  
68   - <el-table-column label="操作" width="360" align="center" fixed="right">
  69 + <el-table-column label="操作" min-width="360" fixed="right">
69 70 <template slot-scope="scope">
70   - <el-button-group>
71   - <el-button size="mini" icon="el-icon-video-play"
72   - v-if="(scope.row.status == false && scope.row.gbId == null) || scope.row.status"
73   - @click="playPush(scope.row)">播放
74   - </el-button>
75   - <el-button size="mini" icon="el-icon-delete" type="danger" @click="stopPush(scope.row)">移除</el-button>
76   - <el-button size="mini" icon="el-icon-position" type="primary" v-if="!!!scope.row.gbId"
77   - @click="addToGB(scope.row)">加入国标
78   - </el-button>
79   - <el-button size="mini" icon="el-icon-position" type="primary" v-if="!!scope.row.gbId"
80   - @click="removeFromGB(scope.row)">移出国标
81   - </el-button>
82   - </el-button-group>
  71 + <el-button size="medium" icon="el-icon-video-play"
  72 + v-if="(scope.row.status == false && scope.row.gbId == null) || scope.row.status"
  73 + @click="playPush(scope.row)" type="text">播放
  74 + </el-button>
  75 + <el-divider direction="vertical"></el-divider>
  76 + <el-button size="medium" icon="el-icon-delete" type="text" @click="stopPush(scope.row)" style="color: #f56c6c" >移除</el-button>
  77 + <el-divider direction="vertical"></el-divider>
  78 + <el-button size="medium" icon="el-icon-position" type="text" v-if="!!!scope.row.gbId"
  79 + @click="addToGB(scope.row)">加入国标
  80 + </el-button>
  81 + <el-divider v-if="!!!scope.row.gbId" direction="vertical"></el-divider>
  82 + <el-button size="medium" icon="el-icon-position" type="text" v-if="!!scope.row.gbId"
  83 + @click="removeFromGB(scope.row)">移出国标
  84 + </el-button>
83 85 </template>
84 86 </el-table-column>
85 87 </el-table>
... ... @@ -284,6 +286,9 @@ export default {
284 286 handleSelectionChange: function (val) {
285 287 this.multipleSelection = val;
286 288 },
  289 + refresh: function () {
  290 + this.initData();
  291 + },
287 292 }
288 293 };
289 294 </script>
... ...
web_src/src/components/StreamProxyList.vue
... ... @@ -5,14 +5,15 @@
5 5 <div class="page-header-btn">
6 6 <el-button icon="el-icon-plus" size="mini" style="margin-right: 1rem;" type="primary" @click="addStreamProxy">添加代理</el-button>
7 7 <el-button v-if="false" icon="el-icon-search" size="mini" style="margin-right: 1rem;" type="primary" @click="addOnvif">搜索ONVIF</el-button>
  8 + <el-button icon="el-icon-refresh-right" circle size="mini" @click="refresh()"></el-button>
8 9 </div>
9 10 </div>
10 11 <devicePlayer ref="devicePlayer"></devicePlayer>
11   - <el-table :data="streamProxyList" border style="width: 100%" :height="winHeight">
12   - <el-table-column prop="name" label="名称" align="center" show-overflow-tooltip/>
13   - <el-table-column prop="app" label="流应用名" align="center" show-overflow-tooltip/>
14   - <el-table-column prop="stream" label="流ID" align="center" show-overflow-tooltip/>
15   - <el-table-column label="流地址" width="400" align="center" show-overflow-tooltip >
  12 + <el-table :data="streamProxyList" style="width: 100%" :height="winHeight">
  13 + <el-table-column prop="name" label="名称" min-width="120" show-overflow-tooltip/>
  14 + <el-table-column prop="app" label="流应用名" min-width="120" show-overflow-tooltip/>
  15 + <el-table-column prop="stream" label="流ID" min-width="120" show-overflow-tooltip/>
  16 + <el-table-column label="流地址" min-width="400" show-overflow-tooltip >
16 17 <template slot-scope="scope">
17 18 <div slot="reference" class="name-wrapper">
18 19  
... ... @@ -27,8 +28,8 @@
27 28 </div>
28 29 </template>
29 30 </el-table-column>
30   - <el-table-column prop="mediaServerId" label="流媒体" width="150" align="center"></el-table-column>
31   - <el-table-column label="类型" width="100" align="center">
  31 + <el-table-column prop="mediaServerId" label="流媒体" min-width="180" ></el-table-column>
  32 + <el-table-column label="类型" width="100" >
32 33 <template slot-scope="scope">
33 34 <div slot="reference" class="name-wrapper">
34 35 <el-tag size="medium">{{scope.row.type}}</el-tag>
... ... @@ -36,8 +37,8 @@
36 37 </template>
37 38 </el-table-column>
38 39  
39   - <el-table-column prop="gbId" label="国标编码" width="180" align="center" show-overflow-tooltip/>
40   - <el-table-column label="状态" width="120" align="center">
  40 + <el-table-column prop="gbId" label="国标编码" min-width="180" show-overflow-tooltip/>
  41 + <el-table-column label="状态" min-width="120" >
41 42 <template slot-scope="scope">
42 43 <div slot="reference" class="name-wrapper">
43 44 <el-tag size="medium" v-if="scope.row.status">在线</el-tag>
... ... @@ -45,7 +46,7 @@
45 46 </div>
46 47 </template>
47 48 </el-table-column>
48   - <el-table-column label="启用" width="120" align="center">
  49 + <el-table-column label="启用" min-width="120" >
49 50 <template slot-scope="scope">
50 51 <div slot="reference" class="name-wrapper">
51 52 <el-tag size="medium" v-if="scope.row.enable">已启用</el-tag>
... ... @@ -53,8 +54,8 @@
53 54 </div>
54 55 </template>
55 56 </el-table-column>
56   - <el-table-column prop="createTime" label="创建时间" align="center" width="150" show-overflow-tooltip/>
57   - <el-table-column label="转HLS" width="120" align="center">
  57 + <el-table-column prop="createTime" label="创建时间" min-width="150" show-overflow-tooltip/>
  58 + <el-table-column label="转HLS" min-width="120" >
58 59 <template slot-scope="scope">
59 60 <div slot="reference" class="name-wrapper">
60 61 <el-tag size="medium" v-if="scope.row.enable_hls">已启用</el-tag>
... ... @@ -62,7 +63,7 @@
62 63 </div>
63 64 </template>
64 65 </el-table-column>
65   - <el-table-column label="MP4录制" width="120" align="center">
  66 + <el-table-column label="MP4录制" min-width="120" >
66 67 <template slot-scope="scope">
67 68 <div slot="reference" class="name-wrapper">
68 69 <el-tag size="medium" v-if="scope.row.enable_mp4">已启用</el-tag>
... ... @@ -70,7 +71,7 @@
70 71 </div>
71 72 </template>
72 73 </el-table-column>
73   - <el-table-column label="无人观看自动删除" width="160" align="center">
  74 + <el-table-column label="无人观看自动删除" min-width="160" >
74 75 <template slot-scope="scope">
75 76 <div slot="reference" class="name-wrapper">
76 77 <el-tag size="medium" v-if="scope.row.enable_remove_none_reader">已启用</el-tag>
... ... @@ -80,14 +81,15 @@
80 81 </el-table-column>
81 82  
82 83  
83   - <el-table-column label="操作" width="360" align="center" fixed="right">
  84 + <el-table-column label="操作" width="360" fixed="right">
84 85 <template slot-scope="scope">
85   - <el-button-group>
86   - <el-button size="mini" icon="el-icon-video-play" v-if="scope.row.enable" @click="play(scope.row)">播放</el-button>
87   - <el-button size="mini" icon="el-icon-close" type="success" v-if="scope.row.enable" @click="stop(scope.row)">停用</el-button>
88   - <el-button size="mini" icon="el-icon-check" type="primary" :loading="startBtnLaoding" v-if="!scope.row.enable" @click="start(scope.row)">启用</el-button>
89   - <el-button size="mini" icon="el-icon-delete" type="danger" @click="deleteStreamProxy(scope.row)">删除</el-button>
90   - </el-button-group>
  86 + <el-button size="medium" icon="el-icon-video-play" type="text" v-if="scope.row.enable" @click="play(scope.row)">播放</el-button>
  87 + <el-divider direction="vertical"></el-divider>
  88 + <el-button size="medium" icon="el-icon-switch-button" type="text" v-if="scope.row.enable" @click="stop(scope.row)">停用</el-button>
  89 + <el-divider direction="vertical"></el-divider>
  90 + <el-button size="medium" icon="el-icon-check" type="text" :loading="startBtnLaoding" v-if="!scope.row.enable" @click="start(scope.row)">启用</el-button>
  91 + <el-divider v-if="!scope.row.enable" direction="vertical"></el-divider>
  92 + <el-button size="medium" icon="el-icon-delete" type="text" style="color: #f56c6c" @click="deleteStreamProxy(scope.row)">删除</el-button>
91 93 </template>
92 94 </el-table-column>
93 95 </el-table>
... ... @@ -305,8 +307,10 @@
305 307 console.log(error);
306 308 that.getListLoading = false;
307 309 });
308   - }
309   -
  310 + },
  311 + refresh: function (){
  312 + this.initData();
  313 + }
310 314 }
311 315 };
312 316 </script>
... ...
web_src/src/components/channelList.vue
... ... @@ -2,10 +2,8 @@
2 2 <div id="channelList" style="width: 100%">
3 3 <div class="page-header">
4 4 <div class="page-title">
5   - <el-button icon="el-icon-arrow-left" size="mini" style="margin-right: 1rem;" type="primary" @click="showDevice">
6   - 返回
7   - </el-button>
8   - 通道列表({{ parentChannelId == 0 ? deviceId : parentChannelId }})</div>
  5 + <el-button icon="el-icon-back" size="mini" style="font-size: 20px; color: #000;" type="text" @click="showDevice" ></el-button>
  6 + 通道列表</div>
9 7 <div class="page-header-btn">
10 8 搜索:
11 9 <el-input @input="search" style="margin-right: 1rem; width: auto;" size="mini" placeholder="关键字"
... ... @@ -25,73 +23,73 @@
25 23 <el-option label="在线" value="true"></el-option>
26 24 <el-option label="离线" value="false"></el-option>
27 25 </el-select>
28   - <el-checkbox size="mini" v-model="autoList" @change="autoListChange">
29   - 自动刷新
30   - </el-checkbox>
  26 + <el-button icon="el-icon-refresh-right" circle size="mini" @click="refresh()"></el-button>
31 27 </div>
32 28 </div>
33 29 <devicePlayer ref="devicePlayer" v-loading="isLoging"></devicePlayer>
34 30 <!--设备列表-->
35 31 <el-table ref="channelListTable" :data="deviceChannelList" :height="winHeight" style="width: 100%" header-row-class-name="table-header">
36   - <el-table-column prop="channelId" label="通道编号" width="200">
  32 + <el-table-column prop="channelId" label="通道编号" min-width="200">
  33 + </el-table-column>
  34 + <el-table-column prop="deviceId" label="设备编号" min-width="200">
37 35 </el-table-column>
38   - <el-table-column prop="name" label="通道名称" >
  36 + <el-table-column prop="name" label="通道名称" min-width="200">
39 37 </el-table-column>
40   - <el-table-column label="快照" width="80">
  38 + <el-table-column label="快照" min-width="120">
41 39 <template slot-scope="scope">
42 40 <el-image
43 41 :src="getSnap(scope.row)"
44 42 :preview-src-list="getBigSnap(scope.row)"
45 43 @error="getSnapErrorEvent(scope.row.deviceId, cope.row.channelId)"
46   - :fit="'contain'">
  44 + :fit="'contain'"
  45 + style="width: 60px">
47 46 <div slot="error" class="image-slot">
48 47 <i class="el-icon-picture-outline"></i>
49 48 </div>
50 49 </el-image>
51 50 </template>
52 51 </el-table-column>
53   - <el-table-column prop="subCount" label="子节点数" width="120">
  52 + <el-table-column prop="subCount" label="子节点数" min-width="120">
54 53 </el-table-column>
55   - <el-table-column prop="manufacture" label="厂家" width="120">
  54 + <el-table-column prop="manufacture" label="厂家" min-width="120">
56 55 </el-table-column>
57   - <el-table-column label="位置信息" width="180">
  56 + <el-table-column label="位置信息" min-width="200">
58 57 <template slot-scope="scope">
59 58 <span v-if="scope.row.longitude*scope.row.latitude > 0">{{ scope.row.longitude }},<br>{{ scope.row.latitude }}</span>
60 59 <span v-if="scope.row.longitude*scope.row.latitude === 0">无</span>
61 60 </template>
62 61 </el-table-column>
63   - <el-table-column prop="ptztypeText" label="云台类型" width="120" />
64   - <el-table-column label="开启音频" >
  62 + <el-table-column prop="ptztypeText" label="云台类型" min-width="120"/>
  63 + <el-table-column label="开启音频" min-width="120">
65 64 <template slot-scope="scope">
66 65 <el-switch @change="updateChannel(scope.row)" v-model="scope.row.hasAudio" active-color="#409EFF">
67 66 </el-switch>
68 67 </template>
69 68 </el-table-column>
70   - <el-table-column label="状态" width="240" >
  69 + <el-table-column label="状态" min-width="120">
71 70 <template slot-scope="scope">
72 71 <div slot="reference" class="name-wrapper">
73   - <el-tag size="medium" v-if="scope.row.status == 1">开启</el-tag>
74   - <el-tag size="medium" type="info" v-if="scope.row.status == 0">关闭</el-tag>
  72 + <el-tag size="medium" v-if="scope.row.status == 1">在线</el-tag>
  73 + <el-tag size="medium" type="info" v-if="scope.row.status == 0">离线</el-tag>
75 74 </div>
76 75 </template>
77 76 </el-table-column>
78 77  
79 78  
80   - <el-table-column label="操作" width="280" fixed="right">
  79 + <el-table-column label="操作" min-width="280" fixed="right">
81 80 <template slot-scope="scope">
82 81 <!-- <el-button size="mini" icon="el-icon-video-play" v-if="scope.row.parental == 0" @click="sendDevicePush(scope.row)">播放</el-button> -->
83   - <el-button size="mini" icon="el-icon-video-play" type="text" @click="sendDevicePush(scope.row)">播放</el-button>
84   - <el-button size="mini" icon="el-icon-switch-button" type="text" style="color: #f56c6c" v-if="!!scope.row.streamId"
  82 + <el-button size="medium" icon="el-icon-video-play" type="text" @click="sendDevicePush(scope.row)">播放</el-button>
  83 + <el-button size="medium" icon="el-icon-switch-button" type="text" style="color: #f56c6c" v-if="!!scope.row.streamId"
85 84 @click="stopDevicePush(scope.row)">停止
86 85 </el-button>
87 86 <el-divider direction="vertical"></el-divider>
88   - <el-button size="mini" icon="el-icon-s-open" type="text" v-if="scope.row.subCount > 0 || scope.row.parental === 1"
  87 + <el-button size="medium" icon="el-icon-s-open" type="text" v-if="scope.row.subCount > 0 || scope.row.parental === 1"
89 88 @click="changeSubchannel(scope.row)">查看
90 89 </el-button>
91 90 <el-divider v-if="scope.row.subCount > 0 || scope.row.parental === 1" direction="vertical"></el-divider>
92   - <el-button size="mini" icon="el-icon-video-camera" type="text" @click="queryRecords(scope.row)">设备录像
  91 + <el-button size="medium" icon="el-icon-video-camera" type="text" @click="queryRecords(scope.row)">设备录像
93 92 </el-button>
94   - <!-- <el-button size="mini" @click="sendDevicePush(scope.row)">录像查询</el-button> -->
95 93 </template>
96 94 </el-table-column>
97 95 </el-table>
... ... @@ -130,17 +128,12 @@ export default {
130 128 total: 0,
131 129 beforeUrl: "/deviceList",
132 130 isLoging: false,
133   - autoList: true,
134 131 loadSnap: {}
135 132 };
136 133 },
137 134  
138 135 mounted() {
139 136 this.initData();
140   - if (this.autoList) {
141   - this.updateLooper = setInterval(this.initData, 5000);
142   - }
143   -
144 137 },
145 138 destroyed() {
146 139 this.$destroy('videojs');
... ... @@ -342,12 +335,8 @@ export default {
342 335 console.log(JSON.stringify(res));
343 336 });
344 337 },
345   - autoListChange: function () {
346   - if (this.autoList) {
347   - this.updateLooper = setInterval(this.initData, 1500);
348   - } else {
349   - window.clearInterval(this.updateLooper);
350   - }
  338 + refresh: function () {
  339 + this.initData();
351 340 }
352 341  
353 342 }
... ...