t-admin/uni_modules/uni-cms/components/editor/tools/video.vue

<template>
	<view>
    <toolbarTool type="button" @change="change" :tooltip="{content: '插入视频'}" :disabled="disabled" :active="active">
      <uni-icons custom-prefix="editor-icon" type="icon-video" size="24px"></uni-icons>
    </toolbarTool>
    <uni-drawer
        class="insert-image-drawer"
        v-if="drawerWidth"
        ref="insertVideoDrawer"
        mode="right"
        :width="drawerWidth"
    >
      <uni-media-library
          mode="picker"
          :selected-count="1"
          :media-tabs="['video']"
          @onInsert="onInsert"
      ></uni-media-library>
    </uni-drawer>
  </view>
</template>

<script>
import ToolbarTool from "./base.vue";

export default {
	name: "mediaVideo",
	emits: ['change'],
	components: {
		ToolbarTool
	},
  props: {
    active: Boolean,
    disabled: Boolean
  },
  data () {
    return {
      drawerWidth: null
    }
  },
  mounted () {
    const sysinfo = uni.getSystemInfoSync()
    this.drawerWidth = sysinfo.windowWidth * .8
  },
	methods: {
			change() {
				// this.$refs.insertImageDrawer.open()
				this.updateCmsVideo()
			},

			getFileInfo(path) {
				const parts = path.split('/').pop();
				const [filename, ...extParts] = parts.split('.');
				const ext = extParts.length ? extParts.pop() : '';
				return {
					name: filename,
					extname: ext
				};
			},
			formatBytes(bytes) {
				if (bytes === 0) return '0 Bytes';
				const k = 1024;
				const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];

				const i = Math.floor(Math.log(bytes) / Math.log(k));

				if (i >= sizes.length) return '> 1 TB';
				return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
			},
			async updateCmsVideo(type) {
				const that = this;
				uni.chooseVideo({
					sourceType: ['camera', 'album'],
					count: 1,
					success: async (res) => {
						console.log(res);
						if (res.tempFilePath) {
							let filePath = res.tempFilePath;
							let {
								name,
								extname
							} = that.getFileInfo(filePath)
							
							let duration = res.duration;
							
							const uniCloudStorageExtCo = uniCloud.importObject("ext-storage-co");
							console.log(`cms/video//${name}`)
							const uploadFileOptionsRes = await uniCloudStorageExtCo.getUploadFileOptions({
								cloudPath: `cms/video/${name}`
							});
							console.log(uploadFileOptionsRes)
							const uploadRes = await uniCloud.uploadFile({
								...uploadFileOptionsRes.uploadFileOptions,
								filePath: filePath,
								cloudPath: uploadFileOptionsRes.cloudPath
							});

							await uniCloud.uploadFile({
								...uploadFileOptionsRes.uploadFileOptions,
								filePath: filePath,
								cloudPath: uploadFileOptionsRes.cloudPath,
								success: async () => {
									const res = {
										cloudPath: uploadFileOptionsRes.cloudPath,
										fileID: uploadFileOptionsRes.fileID,
										fileURL: uploadFileOptionsRes.fileURL
									};
									console.log(res)
									let src = await this.getSrc(res.fileID);
									let poster = "vframe/jpg/offset/0/w/440/h/264/";
									let isUrl = this.splitUrl(src);
									let cover="";
									if (isUrl.type === "success") {
										let {
											baseUrl,
											query
										} = isUrl;
										
										cover = fileURL + "?" + poster + "/"+ query;
									} else {
										return;
									}
									const selectedMedia = {
										src: src,
										duration: duration,
										cover: cover
									}
									console.log(selectedMedia)
									this.$emit('change', {
										type: 'mediaVideo',
										value: {
										  poster: selectedMedia.cover,
										  src: selectedMedia.src,
										  duration: selectedMedia.duration
										}
									})

									console.log("上传成功", res);
								},
								fail: (err) => {
									console.log("上传失败", err);
								}
							});

						} else {
							console.log("未选中文件")
						}
					}
				});
			},
			splitUrl(url) {
			  try {
			    const urlObj = new URL(url);
			    return {
				type: "success",
			      baseUrl: urlObj.origin + urlObj.pathname, 
			      query: urlObj.search
			    };
			  } catch (error) {
			    console.error("URL 解析失败:", error);
			    return { type: "error" }; // 异常时返回空值
			  }
			},
			async getSrc(src) {
				
				if (src&&src.substring(0, 8) == "cloud://") {
					uniCloud.getTempFileURL({
						fileList: [src]
					}).then(res=>{
						return res.fileList[0].tempFileURL;
					})
				} else if (src&&src.substring(0, 8) == "qiniu://") {
					const uniCloudStorageExtCo = uniCloud.importObject("ext-storage-co");
					const res = await uniCloudStorageExtCo.getTempFileURL({src: src});
					return res.fileList[0].tempFileURL;
					
				} else {
					return src
				}
			},
    onInsert (selectedMediaList) {
      this.$refs.insertVideoDrawer.close()

      this.$emit('change', {
        type: 'mediaVideo',
        value: {
          poster: selectedMediaList[0].cover,
          src: selectedMediaList[0].src,
          duration: selectedMediaList[0].duration
        }
      })
    }
	}
}
</script>

<style scoped>
// #ifdef H5
@import '@/uni_modules/uni-cms/common/style/editor-icon.css';
// #endif
</style>