添加短视频管理

src/components/shortvideo/shortVideoDetail.vue

+<template>
+  <el-dialog
+      title="查看视频"
+      :visible="showVideoDetail"
+      @close="handlerClose"
+      width="780px"
+  >
+    <div class="video-detail-container">
+      <el-form ref="searchForm" :model="detailObj"  label-suffix=":" size="small" label-width="100px">
+        <el-form-item label="视频描述">
+          <div>{{videoDesc}}</div>
+          <video :src="resourceUrl" controls="controls" poster="posterImg" class="video-content"></video>
+        </el-form-item>
+        <div style="width: 100%;height: 1px;background-color: #DCDFE6;"></div>
+        <p class="title">审核结果</p>
+        <el-form-item label="送审时间">
+          <div>{{detailObj.startTime}}</div>
+        </el-form-item>
+        <el-form-item label="机审完成时间">
+          <div>{{detailObj.endTime}}</div>
+        </el-form-item>
+        <el-form-item label="审核结果">
+          <div>{{detailObj.status | videoStatusFilter}}</div>
+        </el-form-item>
+        <el-form-item label="审核说明">
+          <div>{{detailObj.intro}}</div>
+        </el-form-item>
+        <el-form-item label="图片" class="image-check-video">
+          <div v-for="(item, index) in detailObj.srcList" style="display: inline-block">
+            <el-image
+                style="width: 100px; height: 100px;margin-right: 25px"
+                :src="item"
+                :preview-src-list="setSrc(index)">
+              <div slot="error" class="image-slot err-icon-set">
+                <i class="el-icon-picture-outline" style="font-size: 40px;margin-top: 25px;"></i>
+              </div>
+            </el-image>
+            <p style="text-align: center;padding-right: 25px;">1分30秒</p>
+          </div>
+        </el-form-item>
+      </el-form>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+  import { getVideoDetail } from '@/utils/shortvideo/videoApi';
+  export default {
+    data() {
+      return {
+        resourceUrl: '',
+        videoDesc: '',
+        detailObj: {
+          desc: '这是一段完整描述文字这是一段完整描述文字这是一段完整描述文字这是一段完整描述文字这是一段完整描述文字这是一段完整,' +
+            '这是一段完整描述文字这是一段完整描述文字这是一段完整描述文字这是一段完整描述文字这是一段完整描述文字这是一段完整',
+          link: '',
+          posterImg: '',
+          startTime: '',
+          endTime: '',
+          status: 2,
+          intro: '涉及血腥暴力这是一段完整描述文字这是一段完整描述文字这是一段完整描述文字这是一段完整描述文字这是一段完整描述文字这是一段完整,' +
+            '这是一段完整描述文字这是一段完整描述文字这是一段完整描述文字这是一段完整描述文字这是一段完整描述文字这是一段完整',
+          srcList: [
+            'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+            'https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg',
+            'https://fuss10.elemecdn.com/1/8e/aeffeb4de74e2fde4bd74fc7b4486jpeg.jpeg',
+            '',
+            'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+            'https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg',
+            'https://fuss10.elemecdn.com/1/8e/aeffeb4de74e2fde4bd74fc7b4486jpeg.jpeg',
+            '',
+          ]
+        },
+
+      }
+    },
+    props: {
+      showVideoDetail: {
+        type: Boolean,
+        default: false
+      },
+      id: {
+        type: Number | String,
+        default: 0,
+      }
+    },
+    watch: {
+      id(val){
+        console.log('当前查看id',val);
+        this.init(val)
+      }
+    },
+    computed: {
+      setSrc(){
+        return function (index) {
+          let newArr = [];
+          let newItem = this.detailObj.srcList[index];
+          newArr[0] = newItem;
+          return newArr;
+        }
+      },
+    },
+    mounted() {},
+    methods: {
+      init(id) {
+        getVideoDetail(id).then((res) => {
+          if(res.code == "000000") {
+            const { id, resourceUrl, videoDesc, liteAvCheckInfo } = res.data;
+            this.resourceUrl = resourceUrl;//视频地址
+            this.videoDesc = videoDesc;//视频描述
+          }
+        }).catch((error) => {
+          this.$message.error("请重试");
+        })
+      },
+      handlerClose() {
+        this.$emit('closeCheckDetail')
+      },
+    },
+  }
+</script>
+<style lang="scss" scoped>
+.video-detail-container{
+  min-height: 500px;
+  .title{
+    line-height: 24px;
+    font-size: 18px;
+    color: #303133;
+    margin: 23px 0 15px;
+  }
+  .video-content{
+    max-height: 300px;
+    width: 100%;
+    margin-top: 20px;
+  }
+}
+</style>
+<style lang="scss">
+  .image-check-video{
+    .err-icon-set{
+      width: 100px;
+      height: 100px;
+      background: #eee;
+      text-align: center;
+      vertical-align: middle;
+    }
+  }
+</style>

src/router/router.js

@@ -80,6 +80,7 @@ const orderDetail = r => require.ensure([], () => r(require('../views/goods/orde
 const plazaList = r => require.ensure([], () => r(require('../views/plaza/plaza-list.vue')), 'plaza-list')
 const activityMember = r => require.ensure([], () => r(require('../views/activitymanagement/activity-member.vue')), 'activity-member')
 
+const videoManage = r => require.ensure([], () => r(require('../views/shortvideo/video-manage.vue')), 'video-manage')
 
 export default [{
     path: '/',
@@ -337,6 +338,10 @@ export default [{
             path: '/activity-member',
             component: activityMember,
         },
+        {
+            path: 'video-manage',
+            component: videoManage,
+        },
 
       // {
       //   path: '/followup',

src/utils/filter.js

@@ -531,7 +531,7 @@ const vueFilter = {
             return '未发布'
         }
     },
-    liveStatusFilter: (value) => {
+    liveStatusFilter1: (value) => {
         if (value == 1) {
             return '预告'
         }else if (value == 2) {
@@ -596,6 +596,19 @@ const vueFilter = {
         }
       }
       return text;
+  },
+  videoStatusFilter: (value) => {
+      let obj = {
+        1: '机审中',
+        2: '机审通过已发布',
+        3: '疑似违规',
+        4: '机审通过待人审',
+        5: '机审拒绝',
+        6: '人审通过已发布',
+        7: '已下线',
+        8: '已删除',
+      }
+      return obj[value];
   }
 
 

src/utils/shortvideo/videoApi.js

+import fetch from '../fetch';
+import { getBaseUrl, getSaasDomain, getSaasApiDomain } from '@/utils/index'
+let headers = {
+  'Content-Type': 'application/json;charset=UTF-8',
+  token: localStorage.getItem('storageToken'),
+};
+
+
+export const getVideoList = (params) => {
+  return fetch({
+    headers,
+    url: getBaseUrl(`circle/liteav/admin/list`),
+    method: 'post',
+    data: params,
+    description: '获取短视频列表',
+  })
+};
+
+export const getSwitch = () => {
+  return fetch({
+    headers,
+    url: getBaseUrl(`circle/liteav/admin/switch`),
+    method: 'get',
+    description: '获取视频审核开关',
+  })
+};
+
+export const setSwitch = (btnVal) => {
+  return fetch({
+    headers,
+    url: getBaseUrl(`circle/liteav/admin/switch/set?button=${btnVal}`),
+    method: 'get',
+    description: '设置视频审核开关',
+  })
+};
+
+export const getVideoDetail = (id) => {
+  return fetch({
+    headers,
+    url: getBaseUrl(`circle/liteav/admin/detail/${id}`),
+    method: 'get',
+    description: '获取短视频详情',
+  })
+};
+
+export const manualCheck = (params) => {
+  return fetch({
+    headers,
+    url: getBaseUrl(`circle/liteav/admin/man/check`),
+    method: 'post',
+    data: params,
+    description: '短视频人工审核',
+  })
+};
+
+

src/views/yqrange/live-manage.vue

@@ -49,7 +49,7 @@
         <el-table-column prop="name" label="直播名称" min-width="100" align="center"></el-table-column>
         <el-table-column prop="liveStatus" label="直播状态" min-width="100" align="center">
           <template slot-scope="scope">
-            <span>{{ scope.row.liveStatus | liveStatusFilter }}</span>
+            <span>{{ scope.row.liveStatus | liveStatusFilter1 }}</span>
           </template>
         </el-table-column>
         <el-table-column prop="streamType" label="直播方式" min-width="100" align="center">