diff --git a/quasar.config.js b/quasar.config.js
index 10f269a..9b78c45 100644
--- a/quasar.config.js
+++ b/quasar.config.js
@@ -75,10 +75,24 @@ module.exports = configure(function (ctx) {
     // Full list of options: https://v2.quasar.dev/quasar-cli-webpack/quasar-config-js#Property%3A-devServer
     devServer: {
       server: {
-        type: "http",
+        // type: "https",
+        options: {
+          // Use ABSOLUTE paths or path.join(__dirname, 'root/relative/path')
+          // key: "/path/to/server.key",
+          // pfx: "/path/to/server.pfx",
+          // cert: "/path/to/server.crt",
+          // ca: "/path/to/ca.pem",
+          // passphrase: "webpack-dev-server", // do you need it?
+        },
       },
       port: 8080,
       open: false, // opens browser window automatically
+      client: {
+        webSocketURL: "wss://animeguitartab.site/",
+      },
+      headers: {
+        "Access-Control-Allow-Origin": "*",
+      },
       proxy: {
         "/api": {
           target: "http://localhost:5000/",
@@ -88,12 +102,12 @@ module.exports = configure(function (ctx) {
           },
         },
         "/static": {
-          target: "http://localhost:8081/",
+          target: "https://localhost:8081/",
           secure: false,
           changeOrigin: true,
-          pathRewrite: {
-            "^/static": "",
-          },
+          // pathRewrite: {
+          //   "^/static": "",
+          // },
         },
       },
     },
diff --git a/src/components/carousel.vue b/src/components/carousel.vue
index 753e47b..2ddcd49 100644
--- a/src/components/carousel.vue
+++ b/src/components/carousel.vue
@@ -1,33 +1,52 @@
 <template>
   <div class="carousel shadow-3">
-    <q-carousel animated v-model="slide" navigation infinite :autoplay="autoplay" arrows transition-prev="slide-right"
-      transition-next="slide-left" @mouseenter="autoplay = false" @mouseleave="autoplay = true">
-      <q-carousel-slide :name="1" img-src="https://s1.ax1x.com/2022/04/13/LKrfsK.jpg" />
-      <q-carousel-slide :name="2" img-src="https://s1.ax1x.com/2022/04/13/LKrfsK.jpg" />
-      <q-carousel-slide :name="3" img-src="https://s1.ax1x.com/2022/04/13/LKrfsK.jpg" />
-      <q-carousel-slide :name="4" img-src="https://s1.ax1x.com/2022/04/13/LKrfsK.jpg" />
+    <q-carousel
+      animated
+      v-model="slide"
+      navigation
+      infinite
+      :autoplay="autoplay"
+      arrows
+      transition-prev="slide-right"
+      transition-next="slide-left"
+      @mouseenter="autoplay = false"
+      @mouseleave="autoplay = true"
+    >
+      <q-carousel-slide
+        :name="1"
+        img-src="https://img2.imgtp.com/2024/04/12/BOwH8zQx.jpg"
+      />
+      <q-carousel-slide
+        :name="2"
+        img-src="https://img2.imgtp.com/2024/04/12/pC18zgX2.png"
+      />
+      <q-carousel-slide
+        :name="3"
+        img-src="https://img2.imgtp.com/2024/04/12/4eJ6LLBL.jpg"
+      />
+      <q-carousel-slide
+        :name="4"
+        img-src="https://img2.imgtp.com/2024/04/12/wMUocoa0.jpg"
+      />
     </q-carousel>
   </div>
-
 </template>
 
 <script>
-  import {
-    ref
-  } from 'vue'
+import { ref } from "vue";
 
-  export default {
-    setup() {
-      return {
-        slide: ref(1),
-        autoplay: ref(true)
-      }
-    }
-  }
+export default {
+  setup() {
+    return {
+      slide: ref(1),
+      autoplay: ref(true),
+    };
+  },
+};
 </script>
 <style lang="scss" scoped>
-  .carousel {
-    width: 60%;
-    margin-top: 50px;
-  }
+.carousel {
+  width: 60%;
+  margin-top: 50px;
+}
 </style>
diff --git a/src/components/copyright-icp.vue b/src/components/copyright-icp.vue
new file mode 100644
index 0000000..5b886ce
--- /dev/null
+++ b/src/components/copyright-icp.vue
@@ -0,0 +1,35 @@
+<template>
+  <div class="icp">
+    {{ `© ${year} ${author} `
+    }}<a href="http://beian.miit.gov.cn/" target="_blank">{{ record }}</a>
+  </div>
+</template>
+
+<script setup>
+let year = new Date().getFullYear(); // 一般都是最新的一年
+let author = ""; // 作者名
+let record = "豫ICP备2024043581号-1"; // 备案号
+</script>
+
+<style>
+.icp {
+  position: absolute;
+  bottom: 20px;
+  right: 0;
+  margin: 10px 0;
+  width: 100%;
+  height: 36px;
+  white-space: pre;
+  text-align: center;
+  color: gray;
+  z-index: 1000;
+}
+.icp > a {
+  color: gray;
+  text-decoration: none;
+}
+.icp > a:hover {
+  color: black;
+  text-decoration: none;
+}
+</style>
diff --git a/src/pages/Index.vue b/src/pages/Index.vue
index 109d18e..e6ba8fd 100644
--- a/src/pages/Index.vue
+++ b/src/pages/Index.vue
@@ -10,6 +10,7 @@
       </q-card-section>
     </q-card>
     <div style="height: 30px"></div>
+    <CopyrightIcp></CopyrightIcp>
   </q-page>
 </template>
 <script>
@@ -21,6 +22,8 @@ export default {
 import carousel from "../components/carousel.vue";
 import tabs from "../components/tabs.vue";
 import { useQuasar } from "quasar";
+import CopyrightIcp from "../components/copyright-icp.vue";
+
 const $q = useQuasar();
 $q.addressbarColor.set();
 </script>
diff --git a/src/pages/Settings.vue b/src/pages/Settings.vue
index 542a7f5..59bb47e 100644
--- a/src/pages/Settings.vue
+++ b/src/pages/Settings.vue
@@ -5,11 +5,16 @@
       <div class="q-mx-sm">
         <q-card class="my-card my-card-radius-10" v-if="finished">
           <q-card-section class="q-pa-md q-my-lg">
-            <q-img
+            <!-- <q-img
               :src="'/api/user/avator/' + userdetail.reserve_field.banner_id"
               height="250px"
               class="hvr-grow"
               @click="avatarBox = true"
+            > --><q-img
+              src="https://img2.imgtp.com/2024/04/12/4eJ6LLBL.jpg"
+              height="250px"
+              class="hvr-grow"
+              @click="avatarBox = true"
             >
               <!-- 用q-img做背景，在其字幕处显示id和头像等 -->
               <div class="text-h5 absolute-bottom">
diff --git a/src/pages/TabTest.vue b/src/pages/TabTest.vue
index eff516f..1929a2d 100644
--- a/src/pages/TabTest.vue
+++ b/src/pages/TabTest.vue
@@ -1,7 +1,15 @@
 <template>
-  <div class="row justify-center">
+  <div
+    class="row justify-center"
+    style="
+      background-image: url('/static/sakiko.jpg');
+      background-size: cover;
+      background-repeat: no-repeat;
+    "
+  >
     <div class="col-12 col-sm-11 col-md-10 col-lg-8">
-      <q-card class="my-card my-card-radius-10">
+      <!-- <div v-show="sakiko">我是要显示的图片</div> -->
+      <q-card class="my-card my-card-radius-10" style="opacity: 0.5">
         <q-card-section class="q-pa-none q-my-lg">
           <div class="q-pa-none" style="height: 100%">
             <iframe
@@ -22,15 +30,19 @@
 
 <script>
 import { onMounted } from "@vue/runtime-core";
-
+import { ref } from "vue";
 // import { RenderingResources } from "@coderline/alphatab";
 export default {
   props: ["id"],
   setup(props) {
     let TabLocation = "/api/tab_files/" + props.id;
+    const sakiko = ref(true);
 
     localStorage.setItem("file", TabLocation);
     onMounted(() => {
+      if (props.id == "a405ff85-369e-46ff-ad75-5bb3cce54d85") {
+        sakiko.value = true;
+      }
       // function setIframeHeight(iframe) {
       //   if (iframe) {
       //     var iframeWin =