图片改为接口

src/App.vue

@@ -1,28 +1,42 @@
 <script setup>
-import {ref} from 'vue'
-import {onBeforeRouteUpdate} from 'vue-router'
+import { ref,watch } from 'vue'
+import { useRouter } from 'vue-router'
 import { Close } from '@element-plus/icons-vue'
+import { getBannerList } from '@/api/auth'
 
 const wwidth=ref(window.innerWidth)
-
+const router = useRouter()
 let adSrc = ref('')
-let testSrc = new URL(`./assets/temp_ad.png`, import.meta.url).href
-let isShowAd = ref(true)
-onBeforeRouteUpdate((to,form)=>{
-    isShowAd.value = true
-})
+let isShowAd = ref(false)
+function getBanner(){
+    getBannerList().then(res=>{
+        if(res.code!==200){
+            isShowAd.value = false
+            adSrc.value = ''
+            return 
+        }
+        isShowAd.value = res.data.length>0
+        adSrc.value = res.data[0].image_url_web
+    })
+}
+getBanner()
+watch(()=>router.currentRoute.value.path,
+    (path)=>{
+        adSrc.value.length&&(isShowAd.value = true)
+    }
+)
 </script>
 
 <template>
   <div class="main-wrap">
     <router-view />
     <el-backtop :right="wwidth<700?20:100" :bottom="100" />
-    <div class="ad-wrap" v-if="isShowAd">
+    <div class="ad-wrap" v-if="adSrc.length&&isShowAd">
         <!-- <img src="@/assets/404.png"> -->
         <el-image
             style="width: 100%;overflow: visible;"
-            :src="testSrc"
-            :preview-src-list="[testSrc]"
+            :src="adSrc"
+            :preview-src-list="[adSrc]"
             fit="cover"
             :preview-teleported="true"
             />

src/api/auth.js

@@ -80,3 +80,10 @@ export const psdModify=params=>{
 export const psdMissingApi=params=>{
     return post('/auth/forgetPwd',params)
 }
+
+/**
+ * 获取广告海报列表 
+ */
+export const getBannerList=params=>{
+    return get('/public/banner',params)
+}