From b8198734a140076cd392b1ce194aa9aee2aaa0db Mon Sep 17 00:00:00 2001 From: wl <173@qq.com> Date: 星期四, 03 十一月 2022 17:46:32 +0800 Subject: [PATCH] 图片管理 视频管理 右上角个人中心 驾驶舱管理 --- src/views/operate/video/updateInterface/index.vue | 24 +++++++++++++++++------- 1 files changed, 17 insertions(+), 7 deletions(-) diff --git a/src/views/operate/video/updateInterface/index.vue b/src/views/operate/video/updateInterface/index.vue index a3758a6..63f233f 100644 --- a/src/views/operate/video/updateInterface/index.vue +++ b/src/views/operate/video/updateInterface/index.vue @@ -3,20 +3,26 @@ <main> <div class="mainContent"> <el-form ref="user" style="width: 100%;"> - <el-form-item prop="code" label="鎵�灞炰簨浠剁紪鍙�" > + <el-form-item prop="code" label="鎵�灞炰簨浠剁紪鍙�"> <el-input v-model="imagedata.code"></el-input> </el-form-item> - <el-form-item prop="code" label="澶х被鍚嶇О" > + <el-form-item prop="code" label="澶х被鍚嶇О"> <el-input v-model="imagedata.questionType"></el-input> </el-form-item> - <el-form-item prop="code" label="灏忕被鍚嶇О" > + <el-form-item prop="code" label="灏忕被鍚嶇О"> <el-input v-model="imagedata.bigType"></el-input> </el-form-item> - <el-form-item prop="code" label="瑙嗛Id" > + <el-form-item prop="code" label="瑙嗛Id"> <el-input v-model="imagedata.videoId"></el-input> </el-form-item> - <el-form-item prop="code" label="涓婁紶鏃堕棿" > + <el-form-item prop="code" label="涓婁紶鏃堕棿"> <el-input v-model="imagedata.uploadTime"></el-input> + </el-form-item> + <el-form-item prop="code" label="瑙嗛锛�"> + <video id="my-video" class="video-js" controls preload="auto" width="210px" height="150px" + :poster="imagedata.imageUrl" data-setup="{}"> + <source :src="imagedata.videoUrl" type="video/mp4" /> + </video> </el-form-item> <!-- <el-form-item v-if="updateFlag"> --> <div class="optionBtn"> @@ -29,6 +35,7 @@ </main> </div> </template> +<script src="https://vjs.zencdn.net/7.20.3/video.min.js"></script> <script> import { getTypeList } from "@/utils/helper"; export default { @@ -42,7 +49,9 @@ bigType: "杩濆弽鍥藉鏈夊叧鏍囧噯缂栧埗鍩庝埂瑙勫垝", smallType: "鍦ㄥ眳姘戜綇瀹呮ゼ銆佹湭閰嶅璁剧珛涓撶敤鐑熼亾鐨勫晢浣忕患鍚堟ゼ銆佸晢浣忕患鍚堟ゼ鍐呬笌灞呬綇灞傜浉閭荤殑鍟嗕笟妤煎眰鍐呮柊寤恒�佹敼寤恒�佹墿寤轰骇鐢熸补鐑熴�佸紓鍛炽�佸簾姘旂殑椁愰ギ鏈嶅姟椤圭洰", videoId: "1", - uploadTime: "2022-10-31 20:20:01" + uploadTime: "2022-10-31 20:20:01", + imageUrl:"https://img0.baidu.com/it/u=1063261925,3306857657&fm=253&fmt=auto&app=138&f=JPEG?w=669&h=500", + videoUrl:"http://vali-g1.cp31.ott.cibntv.net/youku/65730720cb94e7220271a3c96/0300080100632D30A3E43019FD116537F5162F-1035-48AC-BE1B-602DF0E92893.mp4?sid=166729534400010004780_00_Bda935cf9a33346c593fc27da8e694df3&sign=db39289573d143cf6e1ad8d8dff36682&ctype=50&si=183&psid=c732c4364319e7ef4685d8f1a568015941346" }, } }, @@ -146,7 +155,7 @@ // }, // props: ["userInfo", "updateFlag", "getDepartList", "changeDialog"], }, - props:['updateFlag'] + props: ['updateFlag'] }; </script> <style lang="scss" scoped> @@ -198,6 +207,7 @@ display: flex; margin-top: 20px; justify-content: center; + .btn { padding: 12px 50px; } -- Gitblit v1.8.0