feat(frontend): 新增网页挂载在非根路径下的处理 close #222

Signed-off-by: Myon <[email protected]>

frontend/src/api/BaseApi.js

@@ -1,7 +1,8 @@
 import { createRequest } from 'src/utils/http';
 
 class BaseApi {
-  BaseUrl = process.env.BACKEND_URL;
+  // 如果没设置baseUrl，则默认使用当前相对路径
+  BaseUrl = process.env.BACKEND_URL || new URL(window.location.href).pathname.replace(/\/$/, '');
 
   http(url, ...option) {
     return createRequest(`${this.BaseUrl}${url}`, ...option);

frontend/src/pages/access/login/LoginBgArea.vue

@@ -19,7 +19,7 @@
 
 <style scoped>
 .area {
-  background-image: url(/images/sprinkle.svg), linear-gradient(to left, #8f94fb, #4e54c8);
+  /* webpackIgnore: true */ background-image: url(../images/sprinkle.svg), linear-gradient(to left, #8f94fb, #4e54c8);
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;

frontend/src/pages/setup/SelectMediaServerForm.vue

@@ -16,7 +16,7 @@
         </q-item-section>
         <q-item-section>
           <q-item-label>
-            <img src="/images/emby-logo.png" style="height: 30px;">
+            <img src="images/emby-logo.png" style="height: 30px;">
           </q-item-label>
         </q-item-section>
       </q-item>
@@ -27,7 +27,7 @@
         </q-item-section>
         <q-item-section>
           <q-item-label>
-            <img src="/images/jellyfin-logo.svg" style="height: 30px;">
+            <img src="images/jellyfin-logo.svg" style="height: 30px;">
           </q-item-label>
         </q-item-section>
       </q-item>
@@ -38,7 +38,7 @@
         </q-item-section>
         <q-item-section>
           <q-item-label>
-            <img src="/images/plex-logo.svg" style="height: 20px;">
+            <img src="images/plex-logo.svg" style="height: 20px;">
           </q-item-label>
         </q-item-section>
       </q-item>