动态壁纸无法正常加载

src/layout/background/BackgroundPage.tsx

@@ -27,7 +27,7 @@ export default defineComponent(() => {
       <div class="px-4">
         <div class="h-[180px]">
           {layout.background.video && layout.background.type !== 'own' ? (
-            <video class="w-full h-full" src={layout.background.video} autoplay={false} controls />
+            <video class="w-full h-full" src={layout.background.video} loop autoplay={false} controls />
           ) : (
             <div
               class="w-full h-full bg-center bg-no-repeat bg-cover"

src/layout/background/CustomWallpaper.tsx

@@ -64,7 +64,7 @@ export default defineComponent(() => {
               tempBackground.value ? 'bg-black/50 hidden group-hover:flex' : 'flex'
             )}
           >
-            <img alt="123" src={new URL('/tab/icons/uploadImg.png', import.meta.url).href}></img>
+            <img alt="123" src={'/tab/icons/uploadImg.png'}></img>
             <span
               class={clsx('text-[15px]  ', tempBackground.value ? 'text-[#fff]' : 'text-[#333]')}
             >

src/layout/background/useResource.ts

@@ -98,7 +98,13 @@ export default function useResource(tag: Ref<string>, type: string) {
           if (!res) return
           const item = res.find((item) => item.tag === val)
           if (!item) return
+          console.log(item);
+          
           const url = URL.createObjectURL(item.file)
+          console.log('本地资源');
+          console.log(url);
+          
+          
           resource.image = item.type === 'image' ? url : ''
           resource.video = item.type === 'video' ? url : ''
           resource.brief = url

src/layout/grid/WelcomePage.tsx

@@ -5,6 +5,9 @@ import startUseImg from '~/icons/welcome/startUse.png'
 import useLayoutStore from '../useLayoutStore'
 import request from '@/utils/request'
 import useStatisticStore from '@/utils/useStatisticStore'
+import { v4 as uuid } from 'uuid'
+import { uploadLocal } from '@/utils/upload'
+import { videoArr } from '@/config'
 export const DefaultPageSetting = [
   {
     name: '游戏',
@@ -47,7 +50,7 @@ export default defineComponent(() => {
       useStatisticStore().send({
         widget: 'WELCOME',
         action: 'OPEN',
-        space: 'TAB',
+        space: 'TAB'
       })
     }
   })
@@ -58,7 +61,7 @@ export default defineComponent(() => {
           {show.value && (
             <div
               class="w-full h-screen bg-white "
-              onClick={() => { }}
+              onClick={() => {}}
               style={{
                 backgroundImage: `url('${DefaultPageSetting[selectMode.value].backgroundUrl}')`,
                 backgroundSize: '100% 100%',
@@ -66,7 +69,7 @@ export default defineComponent(() => {
                 backgroundRepeat: 'no-repeat'
               }}
             >
-              <div class="w-full h-screen bg-black/60 " onClick={() => { }}></div>
+              <div class="w-full h-screen bg-black/60 " onClick={() => {}}></div>
             </div>
           )}
         </Transition>
@@ -93,10 +96,10 @@ export default defineComponent(() => {
                       }
                       onClick={() => {
                         selectMode.value = idx
-
                       }}
                       style={{
-                        transform: `translate(${idx === selectMode.value ? 80 : (((selectMode.value === 2 && idx === 0) || (selectMode.value + 1 === idx)) ? 219 : -52)}px) scale(${idx === selectMode.value ? 1 : 0.85
+                        transform: `translate(${idx === selectMode.value ? 80 : (selectMode.value === 2 && idx === 0) || selectMode.value + 1 === idx ? 219 : -52}px) scale(${
+                          idx === selectMode.value ? 1 : 0.85
                         })`,
                         backgroundImage: `url('${DivBgImg}')`,
                         backgroundSize: '100% 100%',
@@ -135,13 +138,36 @@ export default defineComponent(() => {
                   if (!res) return
                   layout.state.dir = res.dir
                   layout.state.content = res.content
+                  layout.state.content.forEach(async (val) => {
+                    const res = await fetch(val.background).then((res) => res.blob())
 
+                    if (res) {
+                      const affix = val.background.split('.').pop()
+                      if (!affix) return
+
+                      console.log(`background${uuid()}.${affix}`);
+                      console.log(`${res.type}`);
+                      
+                      
+                      const file = new File([res], `${uuid()}.${affix}`, {
+                        type: `${res.type}`
+                      })
+                      uploadLocal(file).then((res2) => {
+                        val.background = res2
+                      })
+                    }
+                  })
                 })
                 layout.state.current = selectMode.value as 0 | 1 | 2
                 useStatisticStore().send({
-                  widget: selectMode.value === 0 ? "WELCOME_GAME" : selectMode.value === 1 ? "WELCOME_WORK" : "WELCOME_RELAX",
+                  widget:
+                    selectMode.value === 0
+                      ? 'WELCOME_GAME'
+                      : selectMode.value === 1
+                        ? 'WELCOME_WORK'
+                        : 'WELCOME_RELAX',
                   action: 'CLICK',
-                  space: 'TAB',
+                  space: 'TAB'
                 })
               }}
               style={{

src/layout/grid/index.tsx

@@ -51,6 +51,9 @@ export default defineComponent(() => {
           layout.isCompact = false
         }
       }}
+      onDblclick={() => {
+        layout.state.simple = !layout.state.simple
+      }}
       onDragover={(e) => e.preventDefault()}
       onDrop={() => {
         // 处理移入

src/utils/upload.ts

@@ -41,7 +41,7 @@ export async function uploadLocal(file: File) {
   list.push({
     tag: id,
     file: file,
-    type: 'image'
+    type: file.type.split('/')[0] === 'video'? 'video' : 'image'  
   })
   await db.setItem('localList', list)
   return id