新功能-云端录像列表支持下载

648540858

2024-04-30 fa8ff09b426ac3fab3e3e715ffff15e60c20779c

 web_src/src/components/PushVideoList.vue

old mode 100644
new mode 100755
@@ -34,52 +34,63 @@
        <el-button icon="el-icon-delete" size="mini" style="margin-right: 1rem;"
                   :disabled="multipleSelection.length === 0" type="danger" @click="batchDel">批量移除
        </el-button>
        <el-button icon="el-icon-plus" size="mini" style="margin-right: 1rem;" type="primary" @click="addStream">添加通道
        </el-button>
        <el-button icon="el-icon-refresh-right" circle size="mini" @click="refresh()"></el-button>
      </div>
    </div>
    <devicePlayer ref="devicePlayer"></devicePlayer>
    <addStreamTOGB ref="addStreamTOGB"></addStreamTOGB>
    <el-table ref="pushListTable" :data="pushList" border style="width: 100%" :height="winHeight"
    <el-table ref="pushListTable" :data="pushList" style="width: 100%" :height="winHeight"
              @selection-change="handleSelectionChange" :row-key="(row)=> row.app + row.stream">
      <el-table-column align="center" type="selection" :reserve-selection="true" width="55">
      <el-table-column  type="selection" :reserve-selection="true" min-width="55">
      </el-table-column>
      <el-table-column prop="name" label="名称" align="center">
      <el-table-column prop="name" label="名称" min-width="200">
      </el-table-column>
      <el-table-column prop="app" label="APP" align="center">
      <el-table-column prop="app" label="APP" min-width="200">
      </el-table-column>
      <el-table-column prop="stream" label="流ID" align="center">
      <el-table-column prop="stream" label="流ID" min-width="200">
      </el-table-column>
      <el-table-column prop="gbId" label="国标编码" width="200" align="center">
      <el-table-column prop="gbId" label="国标编码" min-width="200" >
      </el-table-column>
      <el-table-column prop="mediaServerId" label="流媒体" width="200" align="center">
      <el-table-column prop="mediaServerId" label="流媒体" min-width="200" >
      </el-table-column>
      <el-table-column label="开始时间" align="center" width="200">
      <el-table-column label="开始时间"  min-width="200">
        <template slot-scope="scope">
          <el-button-group>
            {{ dateFormat(parseInt(scope.row.createStamp)) }}
            {{ scope.row.pushTime == null? "-":scope.row.pushTime }}
          </el-button-group>
        </template>
      </el-table-column>
      <el-table-column label="正在推流" align="center" width="100">
      <el-table-column label="正在推流"  min-width="100">
        <template slot-scope="scope">
          {{ (scope.row.status == false && scope.row.gbId == null) || scope.row.status ? '是' : '否' }}
          {{scope.row.pushIng ? '是' : '否' }}
        </template>
      </el-table-column>
      <el-table-column label="本平台推流"  min-width="100">
        <template slot-scope="scope">
          {{scope.row.pushIng && !!scope.row.self ? '是' : '否' }}
        </template>
      </el-table-column>

      <el-table-column label="操作" width="360" align="center" fixed="right">
      <el-table-column label="操作" min-width="360"  fixed="right">
        <template slot-scope="scope">
          <el-button-group>
            <el-button size="mini" icon="el-icon-video-play"
                       v-if="(scope.row.status == false && scope.row.gbId == null) || scope.row.status"
                       @click="playPush(scope.row)">播放
            </el-button>
            <el-button size="mini" icon="el-icon-delete" type="danger" @click="stopPush(scope.row)">移除</el-button>
            <el-button size="mini" icon="el-icon-position" type="primary" v-if="!!!scope.row.gbId"
                       @click="addToGB(scope.row)">加入国标
            </el-button>
            <el-button size="mini" icon="el-icon-position" type="primary" v-if="!!scope.row.gbId"
                       @click="removeFromGB(scope.row)">移出国标
            </el-button>
          </el-button-group>
          <el-button size="medium" icon="el-icon-video-play"
                     v-if="scope.row.pushIng === true"
                     @click="playPush(scope.row)" type="text">播放
          </el-button>
          <el-divider direction="vertical"></el-divider>
          <el-button size="medium" icon="el-icon-delete" type="text" @click="stopPush(scope.row)" style="color: #f56c6c" >移除</el-button>
          <el-divider direction="vertical"></el-divider>
          <el-button size="medium" icon="el-icon-position" type="text" v-if="!!!scope.row.gbId"
                     @click="addToGB(scope.row)">加入国标
          </el-button>
          <el-divider v-if="!!!scope.row.gbId" direction="vertical"></el-divider>
          <el-button size="medium" icon="el-icon-position" type="text" v-if="!!scope.row.gbId"
                     @click="removeFromGB(scope.row)">移出国标
          </el-button>
          <el-button size="medium" icon="el-icon-cloudy" type="text" @click="queryCloudRecords(scope.row)">云端录像
          </el-button>
        </template>
      </el-table-column>
    </el-table>
@@ -101,7 +112,7 @@
<script>
import streamProxyEdit from './dialog/StreamProxyEdit.vue'
import devicePlayer from './dialog/devicePlayer.vue'
import addStreamTOGB from './dialog/addStreamTOGB.vue'
import addStreamTOGB from './dialog/pushStreamEdit.vue'
import uiHeader from '../layout/UiHeader.vue'
import importChannel from './dialog/importChannel.vue'
import MediaServer from './service/MediaServer'
@@ -171,8 +182,11 @@
          mediaServerId: that.mediaServerId,
        }
      }).then(function (res) {
        that.total = res.data.total;
        that.pushList = res.data.list;
          if (res.data.code === 0) {
            that.total = res.data.data.total;
            that.pushList = res.data.data.list;
          }

        that.getDeviceListLoading = false;
      }).catch(function (error) {
        console.error(error);
@@ -185,7 +199,7 @@
      this.getListLoading = true;
      this.$axios({
        method: 'get',
        url: '/api/media/stream_info_by_app_and_stream',
        url: '/api/push/getPlayUrl',
        params: {
          app: row.app,
          stream: row.stream,
@@ -193,10 +207,15 @@
        }
      }).then(function (res) {
        that.getListLoading = false;
        that.$refs.devicePlayer.openDialog("streamPlay", null, null, {
          streamInfo: res.data.data,
          hasAudio: true
        });
        if (res.data.code === 0 ) {
          that.$refs.devicePlayer.openDialog("streamPlay", null, null, {
            streamInfo: res.data.data,
            hasAudio: true
          });
        }else {
          that.$message.error(res.data.msg);
        }

      }).catch(function (error) {
        console.error(error);
        that.getListLoading = false;
@@ -212,7 +231,7 @@
          streamId: row.stream
        }
      }).then((res) => {
        if (res.data == "success") {
        if (res.data.code === 0) {
          that.initData()
        }
      }).catch(function (error) {
@@ -233,30 +252,24 @@
        url: "/api/push/remove_form_gb",
        data: row
      }).then((res) => {
        if (res.data == "success") {
        if (res.data.code === 0) {
          that.initData()
        }
      }).catch(function (error) {
        console.error(error);
      });
    },
    dateFormat: function (/** timestamp=0 **/) {
      let ts = arguments[0] || 0;
      let t, y, m, d, h, i, s;
      t = ts ? new Date(ts) : new Date();
      y = t.getFullYear();
      m = t.getMonth() + 1;
      d = t.getDate();
      h = t.getHours();
      i = t.getMinutes();
      s = t.getSeconds();
      // 可根据需要在这里定义时间格式
      return y + '-' + (m < 10 ? '0' + m : m) + '-' + (d < 10 ? '0' + d : d) + ' ' + (h < 10 ? '0' + h : h) + ':' + (i < 10 ? '0' + i : i) + ':' + (s < 10 ? '0' + s : s);
    queryCloudRecords: function (row) {

      this.$router.push(`/cloudRecordDetail/${row.app}/${row.stream}`)
    },
    importChannel: function () {
      this.$refs.importChannel.openDialog(() => {

      })
    },
    addStream: function (){
      this.$refs.addStreamTOGB.openDialog(null, this.initData);
    },
    batchDel: function () {
      this.$confirm(`确定删除选中的${this.multipleSelection.length}个通道?`, '提示', {
@@ -284,6 +297,9 @@
    handleSelectionChange: function (val) {
      this.multipleSelection = val;
    },
    refresh: function () {
      this.initData();
    },
  }
};
</script>