Feat/upload video

.gitignore

@@ -47,3 +47,4 @@ Thumbs.db
 
 # Other
 *.local
+GEMINI.md

src/common/api/dir.ts

@@ -1,7 +1,8 @@
 import { store } from '@/stores'
-import { getFileSuffix, isImage, createManagementImageObject } from '@/utils'
+import { getFileSuffix, isImage, createManagementImageObject, isVideo } from '@/utils'
 import request from '@/utils/request'
 import { UserConfigInfoModel } from '@/common/model'
+import { createManagementVideoObject } from '@/utils/video-utils'
 
 /**
  * 获取指定路径 Path 下的目录列表
@@ -65,9 +66,17 @@ export const getRepoPathContent = (userConfigInfo: UserConfigInfoModel, path: st
 
       setTimeout(() => {
         res
-          .filter((v: any) => v.type === 'file' && isImage(getFileSuffix(v.name)))
+          .filter((v: any) => {
+            const suffix = getFileSuffix(v.name)
+            return v.type === 'file' && (isImage(suffix) || isVideo(suffix))
+          })
           .forEach((x: any) => {
-            store.dispatch('DIR_IMAGE_LIST_ADD_IMAGE', createManagementImageObject(x, path))
+            const suffix = getFileSuffix(x.name)
+            if (isImage(suffix)) {
+              store.dispatch('DIR_IMAGE_LIST_ADD_IMAGE', createManagementImageObject(x, path))
+            } else if (isVideo(suffix)) {
+              store.dispatch('DIR_IMAGE_LIST_ADD_VIDEO', createManagementVideoObject(x, path))
+            }
           })
       }, 120)
 

src/common/constant/init.ts

@@ -5,6 +5,8 @@ export const INIT_REPO_BARNCH = 'master'
 export const GH_PAGES = 'gh-pages'
 export const PICX_UPLOAD_IMG_DESC = 'Upload image via PicX (https://github.com/XPoet/picx)'
 export const PICX_UPLOAD_IMGS_DESC = 'Upload images via PicX (https://github.com/XPoet/picx)'
+export const PICX_UPLOAD_VIDEO_DESC = 'Upload video via PicX (https://github.com/XPoet/picx)'
+export const PICX_UPLOAD_VIDEOS_DESC = 'Upload videos via PicX (https://github.com/XPoet/picx)'
 export const PICX_DEL_IMG_DESC = 'Delete image via PicX (https://github.com/XPoet/picx)'
 export const PICX_INIT_SETTINGS_MSG = 'Init settings via PicX (https://github.com/XPoet/picx)'
 export const PICX_UPDATE_SETTINGS_MSG = 'Update settings via PicX (https://github.com/XPoet/picx)'

src/common/constant/settings.ts

@@ -8,6 +8,11 @@ export const NEW_DIR_COUNT_MAX: number = 5
  */
 export const IMG_UPLOAD_MAX_SIZE: number = 30 // MB
 
+/**
+ * 允许上传视频的最大尺寸
+ */
+export const VIDEO_UPLOAD_MAX_SIZE: number = 100 // MB
+
 /**
  * 图片重命名最大长度
  */

src/common/directive/contextmenu.ts

@@ -22,9 +22,9 @@ const contextmenuDirective: Directive = {
       e.preventDefault()
       e.stopPropagation()
 
-      const { type, dir, img } = binding.value
+      const { type, dir, img, video } = binding.value
 
-      store.commit('SET_UPLOAD_AREA_STATE', { activeInfo: { dir, type, img } })
+      store.commit('SET_UPLOAD_AREA_STATE', { activeInfo: { dir, type, img, video } })
 
       const viewDir = computed(() => store.getters.getUserViewDir).value
 

src/common/directive/types.ts

@@ -6,5 +6,7 @@ export enum ContextmenuEnum {
   // eslint-disable-next-line no-unused-vars
   img,
   // eslint-disable-next-line no-unused-vars
-  uploadArea
+  uploadArea,
+  // eslint-disable-next-line no-unused-vars
+  video = 4
 }

src/common/model/index.ts

@@ -3,3 +3,4 @@ export * from './user-config'
 export * from './user-settings'
 export * from './vite-config'
 export * from './tool'
+export * from './video'

src/common/model/tool.ts

@@ -12,6 +12,13 @@ export interface ImageHandleResult {
   file: File
 }
 
+export interface VideoHandleResult {
+  uuid: string
+  objectURL: string
+  file: File
+  base64: string
+}
+
 export interface ImgProcessStateModel {
   uuid: string
   originalName: string

src/common/model/video.ts

@@ -0,0 +1,63 @@
+/**
+ * Uploaded video object Model
+ */
+export interface UploadedVideoModel {
+  type: string
+  uuid: string
+  sha: string
+  dir: string
+  path: string
+  name: string
+  size: number
+  deleting: boolean
+  checked: boolean
+  active?: boolean
+  deployed?: boolean
+}
+
+/**
+ * Upload list video object Model
+ */
+export interface UploadVideoModel {
+  uuid: string
+
+  base64: {
+    originalBase64: string
+    watermarkBase64: string | null
+    compressBase64: string | null
+  }
+
+  objectURL: string
+
+  fileInfo: {
+    originalFile: File | null
+    compressFile: File | null
+    watermarkFile: File | null
+  }
+
+  filename: {
+    name: string
+    initName: string // initial name
+    final: string // final name
+    suffix: string // suffix
+    isRename: boolean // whether to rename
+    newName: string // new name
+    isAddHash: boolean // whether to add hash
+    hash: string // hash
+    isAddPrefix: boolean // whether to add prefix
+    prefix: string // prefix
+  }
+
+  uploadStatus: {
+    progress: 0 | 100
+    uploading: boolean
+  }
+
+  uploadedVideo?: UploadedVideoModel
+
+  reUploadInfo?: {
+    isReUpload: boolean
+    path: string
+    dir: string
+  }
+}

src/components.d.ts

@@ -115,10 +115,11 @@ declare module '@vue/runtime-core' {
     SiteCount: typeof import('./components/site-count/site-count.vue')['default']
     UserAvatar: typeof import('./components/user-avatar/user-avatar.vue')['default']
     UserAvatarV2: typeof import('./components/user-avatar-v2/user-avatar-v2.vue')['default']
+    VideoPreview: typeof import('./components/video-preview/video-preview.vue')['default']
     WatermarkConfigBox: typeof import('./components/watermark-config-box/watermark-config-box.vue')['default']
     WatermarkTool: typeof import('./components/tools/watermark-tool/watermark-tool.vue')['default']
   }
   export interface ComponentCustomProperties {
     vLoading: typeof import('element-plus/es')['ElLoadingDirective']
   }
-}
+}