修复appui配置异常问题

src/views/roomBackground/roomBackground.vue

@@ -48,9 +48,9 @@
       class="primary"
       type="primary"
       @click="
-        partitionId = '';
-        id = '';
-        status = '';
+        inquire.partitionId = '';
+        inquire.id = '';
+        inquire.status = '';
         getData();
       "
       >重置按钮</el-button
@@ -106,7 +106,7 @@
       <el-table-column prop="url" align="center" label="图片">
         <template v-slot="scope">
           <el-image
-            v-if="scope.row.url"
+            v-if="!scope.row.url.toLowerCase().endsWith('.svga')"
             style="width: 100px; height: 100px"
             :src="scope.row.url"
             :zoom-rate="1.1"
@@ -115,7 +115,9 @@
             preview-teleported="true"
             hide-on-click-modal="true"
           />
-          <div v-else>/</div>
+          <div v-else :id="'guide' + scope.row.id" class="game-guide">
+            {{ guideFn(scope.row.id, scope.row.url) }}
+          </div>
         </template>
       </el-table-column>
       <el-table-column prop="createTime" align="center" label="创建时间" />
@@ -341,8 +343,7 @@ import {
 import { dateFormat } from "@/utils/system-helper";
 // @ts-ignore
 import { ElMessage, ElTable } from "element-plus";
-import { ref } from "vue";
-import { ElMessageBox } from "element-plus"; // 正确引入 ElM
+import SVGA from "svgaplayerweb";
 export default {
   name: "roomBackground",
   data() {
@@ -391,7 +392,7 @@ export default {
         day: "",
         sort: "",
         radio2: "1",
-        id:null,
+        id: null,
       },
     };
   },
@@ -403,6 +404,18 @@ export default {
     });
   },
   methods: {
+    guideFn(id, url) {
+      if (url.toLowerCase().endsWith(".svga")) {
+        // 获取id的dom元素
+        let player = new SVGA.Player(`#guide${id}`);
+        let parser = new SVGA.Parser();
+        parser.load(url, (videoItem) => {
+          // 你的svga文件路径
+          player.setVideoItem(videoItem);
+          player.startAnimation(); // 开始动画
+        });
+      }
+    },
     // 查询接口
     getData() {
       this.isLoading = true;
@@ -620,4 +633,17 @@ export default {
     height: 150px;
   }
 }
+.game-guide {
+  width: 100px;
+  height: 100px;
+  overflow: hidden;
+  // left: 50%;
+  // top: 50%;
+  // transform: translate(-50%,-50%);
+  canvas {
+    position: absolute;
+    left: 0;
+    top: 0;
+  }
+}
 </style>