Lawrence
2020-12-16 44d216100b45c3337c593ee82ee68e7e0f35d24b
web_src/src/components/videoList.vue
@@ -1,7 +1,6 @@
<template>
   <div id="app">
      <el-container>
         <el-header>
            <uiHeader></uiHeader>
         </el-header>
@@ -30,21 +29,29 @@
               </el-table-column>
               <el-table-column prop="model" label="固件版本" align="center">
               </el-table-column>
               <el-table-column prop="transport" label="通讯方式" align="center">
               <el-table-column label="流传输模式" align="center" width="160">
            <template slot-scope="scope">
              <el-select size="mini" @change="transportChange(scope.row)" v-model="scope.row.streamMode" placeholder="请选择">
                <el-option key="UDP" label="UDP" value="UDP"></el-option>
                <el-option key="TCP-ACTIVE" label="TCP主动模式" :disabled="true" value="TCP-ACTIVE"></el-option>
                <el-option key="TCP-PASSIVE" label="TCP被动模式"  value="TCP-PASSIVE"></el-option>
              </el-select>
            </template>
               </el-table-column>
               <el-table-column prop="channelCount" label="通道数" align="center">
               </el-table-column>
               <el-table-column label="状态" width="180" align="center">
                  <template slot-scope="scope">
                     <div slot="reference" class="name-wrapper">
                        <el-tag size="medium">{{ scope.row.online==1?'在线' :'离线'}}</el-tag>
                        <el-tag size="medium" v-if="scope.row.online == 1">在线</el-tag>
                        <el-tag size="medium" type="info" v-if="scope.row.online == 0">离线</el-tag>
                     </div>
                  </template>
               </el-table-column>
               <el-table-column label="操作" width="240" align="center" fixed="right">
                  <template slot-scope="scope">
                     <el-button size="mini" icon="el-icon-refresh"  @click="refDevice(scope.row)">刷新</el-button>
                     <el-button size="mini" icon="el-icon-refresh"  @click="refDevice(scope.row)">刷新通道</el-button>
                     <el-button size="mini" icon="el-icon-s-open"  type="primary" @click="showChannelList(scope.row)">查看通道</el-button>
                  </template>
               </el-table-column>
@@ -66,12 +73,10 @@
</template>
<script>
    import devicePlayer from './gb28181/devicePlayer.vue'
    import uiHeader from './UiHeader.vue'
   export default {
      name: 'app',
      components: {
         devicePlayer,
         uiHeader
      },
      data() {
@@ -180,7 +185,19 @@
               that.$refs.devicePlayer.play(ssrc,deviceId,channelId);
            }).catch(function(e) {
            });
         }
         },
      transportChange: function (row) {
        console.log(row);
        console.log(`修改传输方式为 ${row.streamMode}:${row.deviceId} `);
        let that = this;
        this.$axios({
          method: 'get',
          url: '/api/devices/' + row.deviceId + '/transport/' + row.streamMode
        }).then(function(res) {
        }).catch(function(e) {
        });
      }
      }
   };