From c1e567ddda7f65651179a8a73ca849b07b066b14 Mon Sep 17 00:00:00 2001 From: zxl <763096477@qq.com> Date: 星期四, 19 六月 2025 19:58:42 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/dev' into dev --- manager/src/views/health/HealthVideoList.vue | 929 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 929 insertions(+), 0 deletions(-) diff --git a/manager/src/views/health/HealthVideoList.vue b/manager/src/views/health/HealthVideoList.vue new file mode 100644 index 0000000..43ef70c --- /dev/null +++ b/manager/src/views/health/HealthVideoList.vue @@ -0,0 +1,929 @@ +<template> + <div> + <Card> + <Form + ref="searchForm" + @keydown.enter.native="handleSearch" + :model="searchForm" + inline + :label-width="70" + class="search-form" + > + <Form-item label="鏍囬" prop="title"> + <Input + type="text" + v-model="searchForm.title" + clearable + @on-clear="handleSearch" + @on-change="handleSearch" + style="width: 160px" + /> + </Form-item> +<!-- todo 鏆傛椂闅愯棌澶у仴搴蜂竴鏈熸病瀹氫箟鏍囩--> + <Form-item v-if="false" label="鏍囩" prop="tagList"> + <Select + v-model="searchForm.tagList" + clearable + filterable + multiple + @on-clear="handleSearch" + @on-change="handleSearch" + style="width: 160px" + > + <Option v-for="tag in tagList" :key="tag.id" :value="tag.id">{{ tag.tagName }}</Option> + </Select> + </Form-item> + <Form-item label="瑙嗛鐘舵��" prop="status"> + <Select + v-model="searchForm.status" + clearable + @on-clear="handleSearch" + @on-change="handleSearch" + style="width: 160px" + > + <Option value="99">寰呭鏍�</Option> + <Option value="1">宸插彂甯�</Option> + <Option value="0">宸蹭笅鏋�</Option> + <Option value="-1">瀹℃牳鏈�氳繃</Option> + </Select> + </Form-item> + <Button + @click="handleSearch" + type="primary" + icon="ios-search" + class="search-btn" + >鎼滅储 + </Button + > + <Button + @click="handleVideoUpLoad" + type="primary" + icon="md-arrow-up" + class="search-btn" + >涓婁紶瑙嗛 + </Button + > + </Form> + <!-- 澶у仴搴疯棰戜笂浼�--> + <Modal + v-model="upLoadVideoShow" + :title="uploadVideoForm.id?'缂栬緫澶у仴搴疯棰�':'涓婁紶澶у仴搴疯棰�'" + width="800" + :mask-closable="false" + > + + <Form + :model="uploadVideoForm" + ref="uploadVideoForm" + :rules="uploadVideoFileRule" + > + <Row :gutter="24"> + <Col span="24"> + <Spin size="large" fix v-if="upLoadVideoLoading"> 鏂囦欢涓婁紶涓�...</Spin> + </Col> + <Col span="12"> + <FormItem label="鏍囬" prop="title"> + <Input placeholder="璇疯緭鍏ユ爣棰�" v-model="uploadVideoForm.title" + style="width: 200px" + /> + </FormItem> + </Col> + <Col span="24"> + <FormItem label="鍒锋柊dom浣跨敤" prop="title" v-show="false"> + <Input placeholder="璇疯緭鍏ユ爣棰�" v-model="uploadVideoForm.temp" + style="width: 200px" + /> + </FormItem> + </Col> + <Col span="12" v-if="!uploadVideoForm.videoFileKey"> + <FormItem label="涓婁紶瑙嗛" prop="videoFileKey"> + <Upload + :multiple="true" + :before-upload="upLoadVideo" + accept="video/*" + action="" + > + <Button icon="ios-cloud-upload-outline">閫夋嫨瑙嗛</Button> + </Upload> + </FormItem> + </Col> + + <Col span="24" v-else> + <FormItem label="瑙嗛"> + <video style="width: 150px;height: 150px" + controls + @loadedmetadata="getVideoDuration" + :poster="uploadVideoForm.showCoverUrl" + :autoplay="false" + id="remoteVideo" :src="uploadVideoForm.showVideoUrl" + ref="healthVideoInfo" + ></video> + </FormItem> + </Col> + + <Col span="12" v-show="uploadVideoForm.videoFileKey && !uploadVideoForm.coverUrl"> + <FormItem label="涓婁紶灏侀潰" prop="coverUrl"> + <Upload + :multiple="true" + :before-upload="upLoadImg" + accept="image/*" + action="" + > + <Button icon="ios-cloud-upload-outline">閫夋嫨灏侀潰</Button> + </Upload> + </FormItem> + </Col> + <Col span="24"> + <div> + <Button type="primary" @click="clearCoverImage" v-show="uploadVideoForm.coverUrl">閲嶆柊涓婁紶灏侀潰</Button> + <Button type="primary" @click="clearVideo" style="margin-left: 20px" + v-show="uploadVideoForm.videoFileKey">閲嶆柊涓婁紶瑙嗛 + </Button> + </div> + </Col> + <!-- <Col span="24" v-else>--> + <!-- <FormItem label="灏侀潰">--> + <!-- <div class="showCoverImg" style="width: 150px;height: 150px;">--> + <!-- <img :src="uploadVideoForm.showCoverUrl" style="width: 150px;height: 150px" class="coverImg"/>--> + <!-- <Icon type="ios-close" size="24" class="coverImgRemove" color="red"--> + <!-- style="border-radius: 50%;background: #fff;cursor: pointer"--> + <!-- @click="removeCover"--> + <!-- />--> + <!-- </div>--> + <!-- </FormItem>--> + <!-- </Col>--> + </Row> + + </Form> + <div slot="footer"> + <Button type="text" @click="closeHealthVideo">鍏抽棴</Button> + <Button type="primary" @click="submitHealthVideo">纭</Button> + </div> + </Modal> + <Modal + v-model="playVideoShow" + :title="playVideoTitle" + width="800" + :mask-closable="false" + > + <div class="video-warp"> + <video :src="playVideoUrl" autoplay controls style="width: 768px;height: 432px"/> + </div> + <div slot="footer"> + <Button type="text" @click="playVideoClose">鍏抽棴</Button> + </div> + </Modal> + + <Modal + v-model="auditingShow" + title="瑙嗛瀹℃牳" + width="800" + :loading="auditingLoading" + :mask-closable="false" + > + + <Form + ref="auditingForm" + :model="auditingForm" + :label-width="70" + :rules="auditingRule" + > + <Form-item label="鏍囬锛�"> + <div>{{ detail.title }}</div> + </Form-item> + <Form-item label="鏍囩锛�"> + <div style="display: flex;flex-wrap: wrap"> + <div v-for="(tag, index) in detail.tagList" :key="'tag' + index" style="margin-right: 5px"> + <Tag color="red">{{ tag.tagName }}</Tag> + </div> + </div> + </Form-item> + <Form-item label="瑙嗛鏃堕暱锛�" :label-width="72"> + <div>{{ formatSeconds(detail.videoDuration) }}</div> + </Form-item> + <Form-item class="video-warp" :label-width="0"> + <video :src="detail.videoUrl" autoplay controls style="width: 768px;height: 432px"/> + </Form-item> + <Form-item label="瀹℃牳缁撴灉锛�" :label-width="100" prop="result"> + <RadioGroup v-model="auditingForm.result"> + <Radio :label="1">閫氳繃</Radio> + <Radio :label="0">涓嶉�氳繃</Radio> + </RadioGroup> + </Form-item> + <Form-item v-show="auditingForm.result === 0" label="涓嶉�氳繃鍘熷洜锛�" :label-width="100" prop="reason"> + <Input + type="textarea" + v-model="auditingForm.reason" + clearable + style="width: 100%" + /> + </Form-item> + </Form> + <div slot="footer"> + <Button type="text" @click="closeAuditing">鍏抽棴</Button> + <Button type="primary" @click="submitAuditing">纭</Button> + </div> + </Modal> + + <Modal + v-model="videoDownShow" + title="瑙嗛涓嬫灦" + width="800" + :mask-closable="false" + > + <Form :model="videoDownForm" :rules="videoDownRule" ref="videoDownForm"> + <FormItem label="涓嬫灦鍘熷洜锛�" :labelWidth="100" prop="reason"> + <editor ref="editor" @input="getReason"/> + </FormItem> + </Form> + <div slot="footer"> + <Button type="text" @click="closeVideoDown">鍏抽棴</Button> + <Button type="primary" @click="videoDown">纭</Button> + </div> + </Modal> + + <Table + :loading="loading" + border + :columns="columns" + :data="data" + ref="table" + sortable="custom" + @on-sort-change="changeSort" + @on-selection-change="showSelect" + > + <template slot-scope="{ row, index }" slot="tagList"> + <div v-for="(tag, index) in row.tagList" :key="'tag' + index" style="margin-top: 5px"> + <Tag color="red">{{ tag.tagName }}</Tag> + </div> + </template> + <template slot-scope="{ row, index }" slot="videoFileKey"> + <div class="play-text" @click="playVideo(row.videoFileKey, row.title)">鐐瑰嚮鎾斁</div> + </template> + <template slot-scope="{ row, index }" slot="videoDuration"> + <div>{{ formatSeconds(row.videoDuration) }}</div> + </template> + <template slot-scope="{ row, index }" slot="recommend"> + <i-switch v-model="row.recommend" :before-change="() => handleBeforeChange(row)" true-color="#13ce66"/> + </template> + <template slot-scope="{ row, index }" slot="status"> + {{ transStatus(row.status) }} + </template> + <template slot-scope="{ row, index }" slot="action"> + <Button type="primary" size="small" style="margin-right: 5px" v-if="row.status === '99'" + @click="openAuditing(row)">瀹℃牳 + </Button> + <Button type="error" size="small" style="margin-right: 5px" v-if="row.status === '1'" + @click="openVideoDown(row)">涓嬫灦 + </Button> + <Button type="success" size="small" style="margin-right: 5px" v-else-if="row.status === '0'" + @click="videoUp(row)">涓婃灦 + </Button> + <Button type="success" size="small" style="margin-right: 5px" + @click="handleVideoUpLoad(row)">缂栬緫 + </Button> + <Button type="success" size="small" style="margin-right: 5px" + @click="deleteHealthVideo(row)">鍒犻櫎 + </Button> + </template> + </Table> + + <Row type="flex" justify="end" class="mt_10"> + <Page + :current="searchForm.pageNumber" + :total="total" + :page-size="searchForm.pageSize" + @on-change="changePage" + @on-page-size-change="changePageSize" + :page-size-opts="[10, 20, 50]" + size="small" + show-total + show-elevator + show-sizer + ></Page> + </Row> + </Card> + </div> +</template> + +<script> +import {recommendSet, getVideoById, auditingVideo, up, down} from "@/api/video"; +import {healthVideo, getHealthVideos, updateHealthVideo,delHealth} from "@/api/health-video"; +import {getVideoTagList} from "@/api/videoTag"; +import {getFilePreview, getSts} from "@/api/file"; +import Editor from '@/components/editor/index.vue' +import COS from 'cos-js-sdk-v5'; +import {getFileKey} from "@/utils/file.js"; + +export default { + name: "VideoList", + components: {Editor}, + data() { + return { + videoDownForm: { + id: '', + reason: '' + }, + videoDownRule: { + reason: [ + { + require: true, + message: '璇疯緭鍏ヤ笅鏋跺師鍥�', + trigger: 'blur', + validator: (rule, value, callback) => { + if (value === null || value === '') { + callback(new Error('璇疯緭鍏ヤ笅鏋跺師鍥�')); + } else { + callback(); + } + } + } + ] + }, + videoDownShow: false, // 瑙嗛涓嬫灦 + videoDownMsg: '', // 涓嬫灦鎻愮ず淇℃伅 + auditingForm: { // 瀹℃牳琛ㄥ崟 + id: null, + result: null, + reason: '' + }, + auditingRule: { + result: [ + { + required: true, + message: '璇烽�夋嫨瑙嗛瀹℃牳缁撴灉', + trigger: 'change', + validator: (rule, value, callback) => { + if (value === null || value === undefined) { + callback(new Error('璇烽�夋嫨瑙嗛瀹℃牳缁撴灉')); + } else { + callback(); + } + } + } + ], + }, + uploadVideoFileRule: { + coverUrl: [ + { + required: true, + message: '璇蜂笂浼犲皝闈�', + trigger: 'blur', + validator: (rule, value, callback) => { + if (value === null || value === undefined) { + callback(new Error('璇蜂笂浼犲皝闈�')); + } else { + callback(); + } + } + } + ], + title: [ + { + required: true, + message: '璇疯緭鍏ユ爣棰�', + trigger: 'blur', + validator: (rule, value, callback) => { + console.log('楠岃瘉鍊�:-------------->', value, '绫诲瀷:', typeof value); + if (value === null || value === undefined) { + callback(new Error('璇疯緭鍏ユ爣棰�')); + } else { + callback(); + } + } + } + ], + }, + detail: {}, // 瑙嗛璇︽儏淇℃伅 + auditingShow: false, // 瀹℃牳寮圭獥 + upLoadVideoShow: false,//鏂囦欢涓婁紶寮圭獥 + auditingLoading: false, // 瀹℃牳寮圭獥 + upLoadVideoLoading: false,//涓婁紶瑙嗛 + playVideoShow: false, // 瑙嗛鎾斁寮圭獥 + playVideoTitle: '', // 瑙嗛鎾斁鏍囬 + playVideoUrl: '', // 褰撳墠姝e湪鎾斁鐨勮棰戝湴鍧� + modelShow: false, // 寮圭獥鏄鹃殣 + modelTitle: '', // 寮圭獥title + loading: false, // 琛ㄥ崟鍔犺浇鐘舵�� + searchForm: { + // 鎼滅储妗嗗垵濮嬪寲瀵硅薄 + pageNumber: 1, // 褰撳墠椤垫暟 + pageSize: 10, // 椤甸潰澶у皬 + title: '', // 鏍囬 + tagList: [], // 鏍囩 + status: '99' + }, + tagList: [], // 鏍囩鍒楄〃 + columns: [ + { + type: 'selection', + width: 60, + align: 'center' + }, + { + title: "鏍囬", + key: "title", + minWidth: 240, + tooltip: true, + }, + // { + // title: "浣滆��", + // key: "authorName", + // width: 130, + // tooltip: true, + // }, + // { + // title: "瑙嗛鏍囩", + // key: "tagList", + // width: 180, + // slot: "tagList", + // }, + { + title: "瑙嗛鍐呭", + key: "videoFileKey", + width: 170, + slot: "videoFileKey" + }, + { + title: "鏃堕暱", + key: "videoDuration", + width: 80, + align: 'center', + slot: "videoDuration", + }, + { + title: "鎾斁閲�", + key: "playNum", + width: 80, + align: 'center' + }, + { + title: "鏀惰棌鏁�", + key: "collectNum", + width: 80, + align: 'center' + }, + { + title: "璇勮鏁�", + key: "commentNum", + width: 80, + align: 'center' + }, + { + title: "棣栭〉鎺ㄨ崘", + key: "recommend", + slot: "recommend", + width: 100, + align: 'center' + }, + { + title: "鏉冮噸", + key: "weight", + width: 170, + }, + { + title: "鐘舵��", + key: "status", + slot: "status", + width: 120, + align: 'center' + }, + { + title: "鎿嶄綔", + key: "action", + slot: "action", + align: "center", + width: 200, + }, + ], + data: [], // 琛ㄥ崟鏁版嵁 + total: 0, // 琛ㄥ崟鏁版嵁鎬绘暟 + selectCount: 0, // 宸查�夋暟閲� + selectList: [], // 宸查�夋暟鎹垪琛� + uploadVideoForm: { + id: null, + coverUrl: null, + videoFileKey: null, + videoFit: null, + videoDuration: null, + title: null, + videoContentType: null, + videoType: null, + showCoverUrl: null, + showVideoUrl: null, + temp: null + + }, + } + }, + created() { + this.getDataList(); + this.getTags('') + }, + methods: { + // 绉掕浆x鍒唜绉� + formatSeconds(seconds) { + if (isNaN(seconds) || seconds < 0) return '0绉�'; + + const mins = Math.floor(seconds / 60); + const secs = seconds % 60; + + if (mins === 0) return `${secs}绉抈; + if (secs === 0) return `${mins}鍒哷; + + return `${mins}鍒�${secs}绉抈; + }, + // 鑾峰彇鏍囩鍒楄〃 + getTags(tagName) { + let params = { + 'tagName': tagName + } + getVideoTagList(params).then(res => { + this.tagList = res.data + }) + }, + // 鑾峰彇瀵屾枃鏈紪杈戝櫒鐨勫唴瀹� + getReason(content) { + this.videoDownForm.reason = content + }, + //閲嶆柊涓婁紶灏侀潰 + clearCoverImage() { + this.$set(this.uploadVideoForm, 'coverUrl', ''); + this.$set(this.uploadVideoForm, 'showCoverUrl', ''); + this.$set(this.uploadVideoForm, 'temp', new Date().getTime()); + }, + //閲嶆柊涓婁紶瑙嗛 + clearVideo() { + this.clearCoverImage(); + this.$set(this.uploadVideoForm, 'videoFileKey', ''); + this.$set(this.uploadVideoForm, 'showVideoUrl', ''); + this.$set(this.uploadVideoForm, 'temp', new Date().getTime()); + console.log(this.uploadVideoForm) + }, + // 瑙嗛涓婃灦 + videoUp(row) { + this.$Modal.confirm({ + title: "鎿嶄綔纭", + content: "鎮ㄧ‘璁よ涓婃灦瑙嗛銆� " + row.title + "銆戝悧?", + loading: true, + onOk: () => { + up(row.id).then(res => { + this.$Modal.remove(); + if (res.code == 200) { + this.$Message.success("瑙嗛涓婃灦鎴愬姛"); + this.getDataList(); + } + }); + } + }); + }, + // 瑙嗛涓嬫灦 + videoDown() { + this.$refs.videoDownForm.validate((valid) => { + if (valid) { + down(this.videoDownForm).then(res => { + this.$Message.success("涓嬫灦鎴愬姛") + this.closeVideoDown() + this.getDataList() + }) + } + }) + }, + // 鍏抽棴瑙嗛涓嬫灦 + closeVideoDown() { + this.videoDownShow = false + this.videoDownForm = { + id: '', + reason: '' + } + this.$refs.editor.setContent('') + }, + // 瑙嗛涓嬫灦 + openVideoDown(row) { + this.videoDownForm.id = row.id + this.videoDownShow = true + }, + // 瑙嗛鍙戝竷/淇敼 + submitHealthVideo() { + try { + this.upLoadVideoLoading = true + this.$refs.uploadVideoForm.validate((valid) => { + if (valid) { + // 淇敼 + if (this.uploadVideoForm.id) { + updateHealthVideo(this.uploadVideoForm).then(res => { + this.$Message.success("淇敼瀹屾垚") + this.closeHealthVideo() + this.getDataList() + }) + } else { + healthVideo(this.uploadVideoForm).then(res => { + this.$Message.success("娣诲姞瀹屾垚") + this.closeHealthVideo() + this.getDataList() + }) + } + } + }) + } finally { + this.upLoadVideoLoading = false + } + }, + // 鍏抽棴绐楀彛 + closeHealthVideo() { + // + this.uploadVideoForm = {}; + this.upLoadVideoShow = false; + }, + // 鎻愪氦瀹℃牳缁撴灉 + submitAuditing() { + console.log(this.auditingForm, "sb") + this.$refs.auditingForm.validate((valid) => { + if (valid) { + auditingVideo(this.auditingForm).then(res => { + this.$Message.success("瀹℃牳瀹屾垚") + this.closeAuditing() + this.getDataList() + }) + } + }) + }, + // 瀹℃牳缁撴灉鍙樺寲 + resultChange(selected) { + this.auditingForm.result = selected === '閫氳繃' ? 1 : 0 + console.log(this.auditingForm.result) + }, + closeAuditing() { + this.auditingForm = { + id: null, + result: null, + reason: '' + } + this.detail = {} + this.auditingShow = false + }, + // 鎵撳紑瀹℃牳寮圭獥 + openAuditing(row) { + this.auditingShow = true + this.auditingLoading = true + this.auditingForm.id = row.id + getVideoById(row.id).then(res => { + this.detail = res.data + this.auditingLoading = false + }) + }, + getVideoDuration(e){ + const duration = this.$refs.healthVideoInfo.duration; + this.uploadVideoForm.videoDuration = Math.floor(duration); + }, + // 鎵撳紑缂栬緫寮圭獥 + deleteHealthVideo(row) { + console.log('鍒犻櫎娴嬭瘯', row) + this.$Modal.confirm({ + title: "鎿嶄綔纭", + content: "鎮ㄧ‘璁よ鍒犻櫎瑙嗛銆� " + row.title + "銆戝悧?", + loading: true, + onOk: () => { + delHealth(row.id).then(res => { + this.$Modal.remove(); + if (res.code === 200) { + this.$Message.success("瑙嗛鍒犻櫎鎴愬姛"); + this.getDataList(); + } + }); + } + }); + }, + // 缈昏瘧鐘舵�� + transStatus(status) { + switch (status) { + case '99': + return '寰呭鏍�' + case '1': + return '宸插彂甯�' + case '0': + return '宸蹭笅鏋�' + case '-1': + return '瀹℃牳鏈�氳繃' + default: + return '鏈煡' + } + }, + // 寮�鍚垨鍏抽棴鎺ㄨ崘鐨勬柟娉� + handleBeforeChange(row) { + let content = "" + if (row.recommend) { + content = '纭瑕佸叧闂椤垫帹鑽愬悧锛�' + } else { + content = '纭瑕佸紑鍚椤垫帹鑽愬悧锛�' + } + return new Promise((resolve) => { + this.$Modal.confirm({ + title: '鎿嶄綔鎻愰啋', + content: content, + onOk: () => { + recommendSet({id: row.id, recommend: !row.recommend}).then(res => { + this.$Message.success(res.msg); + resolve(); + }) + } + }); + }); + }, + // 鍏抽棴瑙嗛鎾斁 + playVideoClose() { + this.playVideoTitle = ''; + this.playVideoUrl = ''; + this.playVideoShow = false + }, + // 鐐瑰嚮鎾斁瑙嗛 + playVideo(fileKey, title) { + this.playVideoTitle = title; + + getFilePreview(fileKey).then(res => { + this.playVideoUrl = res.data + this.playVideoShow = true + }) + }, + // 鎼滅储 + handleSearch() { + this.searchForm.pageNumber = 1; + this.searchForm.pageSize = 10; + this.getDataList(); + }, + // 鑾峰彇鍒楄〃鏁版嵁 + getDataList() { + this.loading = true; + getHealthVideos(this.searchForm).then((res) => { + console.log(res) + this.loading = false; + if (res.code === 200) { + this.data = res.data; + this.total = res.total; + } + }); + this.total = this.data.length; + this.loading = false; + }, + showSelect(e) { + this.selectList = e.map(d => d.id); + this.selectCount = e.length; + }, + // 鎺掑簭 + changeSort(e) { + this.searchForm.sort = e.key; + this.searchForm.order = e.order; + if (e.order == "normal") { + this.searchForm.order = ""; + } + this.getDataList(); + }, + // 鍒嗛〉 鏀瑰彉椤电爜 + changePage(v) { + this.searchForm.pageNumber = v; + this.getDataList(); + }, + // 鍒嗛〉 鏀瑰彉椤垫暟 + changePageSize(v) { + this.searchForm.pageNumber = 1; + this.searchForm.pageSize = v; + this.getDataList(); + }, + handleVideoUpLoad(row) { + this.uploadVideoForm = {}; + this.upLoadVideoShow = true; + if (row.id) { + this.uploadVideoForm.id = row.id; + this.uploadVideoForm.showVideoUrl = row.videoUrl + this.uploadVideoForm.videoFileKey = row.videoFileKey; + this.uploadVideoForm.coverUrl = row.coverUrl; + this.uploadVideoForm.showCoverUrl = row.coverShowUrl; + this.uploadVideoForm.title = row.title; + } + }, + async upLoadVideo(file) { + try { + this.$nextTick(() => { + this.upLoadVideoLoading = true; + }) + // 鑾峰彇鏂囦欢涓婁紶涓存椂瀵嗛挜 + const sts = await getSts(); + const cos = new COS({ + getAuthorization: async function (options, callback) { + callback({ + TmpSecretId: sts.data.tmpSecretId, + TmpSecretKey: sts.data.tmpSecretKey, + SecurityToken: sts.data.sessionToken, + // 寤鸿杩斿洖鏈嶅姟鍣ㄦ椂闂翠綔涓虹鍚嶇殑寮�濮嬫椂闂达紝閬垮厤瀹㈡埛绔湰鍦版椂闂村亸宸繃澶у鑷寸鍚嶉敊璇� + StartTime: sts.data.stsStartTime, // 鏃堕棿鎴筹紝鍗曚綅绉掞紝濡傦細1580000000 + ExpiredTime: sts.data.stsEndTime,// 鏃堕棿鎴筹紝鍗曚綅绉掞紝濡傦細1580000000 + ScopeLimit: true, // 缁嗙矑搴︽帶鍒舵潈闄愰渶瑕佽涓� true锛屼細闄愬埗瀵嗛挜鍙湪鐩稿悓璇锋眰鏃堕噸澶嶄娇鐢� + }); + } + }) + const fileKey = getFileKey(file.name) + const upData = await cos.uploadFile({ + Bucket: sts.data.bucket, + Region: sts.data.region, + Key: fileKey, + Body: file, // 瑕佷笂浼犵殑鏂囦欢瀵硅薄銆� + SliceSize: 1024 * 1024 * 5, + onProgress: function (progressData) { + console.log('涓婁紶杩涘害锛�', progressData); + }, + }); + + console.log(this.uploadVideoForm) + this.$nextTick(() => { + this.uploadVideoForm.videoFileKey = fileKey; + this.uploadVideoForm.showVideoUrl = sts.data.endpoint + "/" + fileKey; + }) + console.log("涓婁紶鎴愬姛", upData) + const duration = this.$refs.healthVideoInfo.duration; + console.log('-娴嬭瘯鑾峰彇鏃堕棿淇℃伅---------------->', duration); + } catch (e) { + console.log("涓婁紶澶辫触", upData) + } finally { + this.$nextTick(() => { + this.upLoadVideoLoading = false; + }) + } + return false; + }, + async upLoadImg(file) { + try { + this.upLoadVideoLoading = true; + // 鑾峰彇鏂囦欢涓婁紶涓存椂瀵嗛挜 + const sts = await getSts(); + const cos = new COS({ + getAuthorization: async function (options, callback) { + callback({ + TmpSecretId: sts.data.tmpSecretId, + TmpSecretKey: sts.data.tmpSecretKey, + SecurityToken: sts.data.sessionToken, + // 寤鸿杩斿洖鏈嶅姟鍣ㄦ椂闂翠綔涓虹鍚嶇殑寮�濮嬫椂闂达紝閬垮厤瀹㈡埛绔湰鍦版椂闂村亸宸繃澶у鑷寸鍚嶉敊璇� + StartTime: sts.data.stsStartTime, // 鏃堕棿鎴筹紝鍗曚綅绉掞紝濡傦細1580000000 + ExpiredTime: sts.data.stsEndTime,// 鏃堕棿鎴筹紝鍗曚綅绉掞紝濡傦細1580000000 + ScopeLimit: true, // 缁嗙矑搴︽帶鍒舵潈闄愰渶瑕佽涓� true锛屼細闄愬埗瀵嗛挜鍙湪鐩稿悓璇锋眰鏃堕噸澶嶄娇鐢� + }); + } + }) + const fileKey = getFileKey(file.name) + const upData = await cos.uploadFile({ + Bucket: sts.data.bucket, + Region: sts.data.region, + Key: fileKey, + Body: file, // 瑕佷笂浼犵殑鏂囦欢瀵硅薄銆� + SliceSize: 1024 * 1024 * 5, + onProgress: function (progressData) { + console.log('涓婁紶杩涘害锛�', progressData); + }, + }); + console.log("涓婁紶鎴愬姛", upData) + this.$nextTick(() => { + this.uploadVideoForm.coverUrl = fileKey; + this.uploadVideoForm.showCoverUrl = sts.data.endpoint + "/" + fileKey; + }) + + } catch (e) { + console.log("涓婁紶澶辫触", upData) + } finally { + this.upLoadVideoLoading = false; + } + return false; + } + } +} +</script> + +<style scoped> +.play-text { + width: 100%; + text-align: center; + color: #2d8cf0; +} + +.play-text:hover { + cursor: pointer; +} + +.video-warp { + width: 786px; + height: 432px; +} + +.data-item { + display: flex; + align-items: center; +} + +.showCoverImg { + position: relative; +} + +.coverImgRemove { + position: absolute; + top: 15px; + right: -15px; +} +</style> -- Gitblit v1.8.0