视频录制

src/api/caseFiling/caseFiling.js

     method: 'get',
     params: data
   })
+}
+//根据案件id查询视频列表
+export function videoList(data) {
+  return request({
+    url: '/video/videoList',
+    method: 'get',
+    params: data
+  })
 }

src/views/caseFiling/archiveList.vue

     <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
       @pagination="getList(queryParams)" />
     <!-- 弹窗 -->
-    <archiveDetailsDialog v-if="showarchiveDetails" :showarchiveDetails="showarchiveDetails" :detailform="detailform"
+    <archiveDetailsDialog v-if="showarchiveDetails" :showarchiveDetails="showarchiveDetails" :videoList="videoList" :detailform="detailform"
       :flagLoading="flagLoading" @cancelpaymentdetails="cancelpaymentdetails" @updataList="updataList">
     </archiveDetailsDialog>
   </div>
   
 <script>
 import { caseApplicationList, selectSignSealUrl } from "@/api/awardManagement/awardManagement";
-import { adjudicationArchives } from "@/api/caseFiling/caseFiling";
+import { adjudicationArchives, videoList } from "@/api/caseFiling/caseFiling";
 import archiveDetailsDialog from "./components/archiveDetailsDialog.vue";
 export default {
   name: "archiveList",
       detailform: {}, //详情数据
       showarchiveDetails: false, //详情数据弹框
       flagLoading: false, //详情弹框loading
+      videoList:""
     };
   },
   created() {
     // model框显示
     showDetail(row) {
       this.getDetail({ id: row.id });
+      this.getvideoList({ caseId: row.id });
       this.showarchiveDetails = true;
       this.flagLoading = true;
     },
     cancelpaymentdetails() {
       this.showarchiveDetails = false;
     },
+    // 根据id查询视频列表
+    getvideoList(data) {
+      videoList(data).then(res => {
+        this.videoList = res.data;
+      })
+    },
     /** 查询详情 */
     getDetail(parms) {
       adjudicationArchives(parms).then((res) => {

src/views/caseFiling/components/archiveDetailsDialog.vue

               :deliveryDataArr="deliveryDataArr"
             ></expressDeliveryInfo>
           </el-tab-pane>
+          <el-tab-pane label="案件视频" name="four">
+            <!-- <div @click="getVideo">chakanshipin</div> -->
+            <video style="background-color: #181717;" :src="videoUrl" controls="controls"></video>
+          </el-tab-pane>
         </el-tabs>
       </div>
       <div slot="footer" class="dialog-footer">
 import caselogInfo from "./caselogInfo.vue";
 import expressDeliveryInfo from "./expressDeliveryInfo.vue";
 export default {
-  props: ["showarchiveDetails", "detailform", "flagLoading"],
+  props: ["showarchiveDetails", "detailform", "flagLoading","videoList"],
   components: {
     caseInfo,
     caselogInfo,
       caselogDataArr: [], //案件日志
       deliveryDataArr: [], //快递信息
       noData: false,
+      videoUrl:''
     };
   },
   watch: {
   methods: {
     handleClick(tab, event) {
       // console.log(tab, event);
+      let headPath = window.location.origin + "/API";
+      this.videoUrl = headPath + this.videoList[0].annexPath;
     },
     cancel() {
       this.$emit("cancelpaymentdetails");
     },
+    getVideo(){
+      // console.log(this.videoList[0].annexPath,"PPPPPPPPPPPPPPPP");
+      let headPath = window.location.origin + "/API";
+      this.videoUrl = headPath + this.videoList[0].annexPath;
+      // window.open(headPath + this.videoList[0].annexPath)
+    }
   },
 };
 </script>