From 5b37b343e5d4c637e5ab6818c8cca8abbf0a186b Mon Sep 17 00:00:00 2001
From: xioayue <xc@xyiege.com>
Date: Thu, 22 Jun 2023 19:15:44 +0800
Subject: [PATCH] =?UTF-8?q?css=E6=8E=A7=E5=88=B6vue=E7=9A=84=E8=83=8C?=
 =?UTF-8?q?=E6=99=AF=E5=9B=BE=E7=89=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue                        |  77 +++++++++++++----------------
 src/assets/ty/{bg.jpg => tybg.jpg} | Bin
 src/assets/wh/{bg.jpg => whbg.jpg} | Bin
 src/router/index.js                |  10 ----
 src/views/cultrue/index.vue        |  19 +++++--
 src/views/index.vue                |  13 ++++-
 src/views/test.vue                 |   0
 src/views/ty/index.vue             |  42 ++++++++++------
 8 files changed, 87 insertions(+), 74 deletions(-)
 rename src/assets/ty/{bg.jpg => tybg.jpg} (100%)
 rename src/assets/wh/{bg.jpg => whbg.jpg} (100%)
 create mode 100644 src/views/test.vue

diff --git a/src/App.vue b/src/App.vue
index c58e9d7..43c7ec5 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,7 +1,6 @@
 <template>
   <div id="app">
-    <dv-full-screen-container class="btgym" :style="{ backgroundImage:'url('+bgimg+')' }">
-
+    <dv-full-screen-container class="btgym">
       <!-- 顶部信息 -->
       <div class="topnav">
         <div class="toptxt">
@@ -9,9 +8,7 @@
             累计进馆人数：3,435,123万人
           </div>
           <img class="topImg" src="@/assets/index/top_title.png" />
-          <div style="margin-right: 2%" class="topTitle">
-            星期四 16:33:33
-          </div>
+          <div style="margin-right: 2%" class="topTitle">星期四 16:33:33</div>
         </div>
         <div class="links">
           <router-link to="/ty">体育</router-link>
@@ -28,28 +25,24 @@
 </template>
 
 <script>
-import ty from '@/views/ty/index'
-export default ({
-  components:{
-    ty
-  },
-  data(){
-    return{
-       //bgimg: require("@/assets/index/bg.jpg")
-       bgimg:"",
-    }
+//https://www.jianshu.com/p/574b85349d40
+export default {
+  data() {
+    return {
+      //
+      
+    };
   },
-  created(){
-    
+  created() {
     // console.log(this.$route)
-    // this.bgimg = this.$route.params.img
   },
-  mounted(){
-   // console.log("app vue")
-   // console.log(this.$route.meta)
-    // this.bgimg = this.$route.meta.img
-  }
-})
+  mounted() {
+//
+  },
+  methods: {
+    //
+  },
+};
 </script>
 
 
@@ -63,11 +56,10 @@ body {
 .btgym {
   width: 100vw;
   height: 100vh;
-  // position: relative;
-  // background-image: url("assets/g_bg.jpg");
-  // background-image: var(--bg);
-  // background-size: 100%;
-  // background-repeat: no-repeat;
+  position: relative;
+  // background-image: url("assets/index/bg.jpg");
+  background-size: 100%;
+  background-repeat: no-repeat;
 
   .topnav {
     width: 100%;
@@ -123,28 +115,28 @@ body {
         margin-top: 12px;
       }
       // 总览
-      a:nth-child(2){
+      a:nth-child(2) {
         margin-top: 22px;
-        background-image:url('assets/index/zl.png');
+        background-image: url("assets/index/zl.png");
       }
-      a:nth-child(1){
-        background-image: url('assets/index/ty.png');
+      a:nth-child(1) {
+        background-image: url("assets/index/ty.png");
       }
-      a:nth-child(3){
-        background-image: url('assets/index/wh.png');
+      a:nth-child(3) {
+        background-image: url("assets/index/wh.png");
       }
 
-      a.router-link-exact-active{
+      a.router-link-exact-active {
         color: #fff;
       }
-      a.router-link-exact-active:nth-child(1){
-        background-image: url('assets/index/ty_active.png');
+      a.router-link-exact-active:nth-child(1) {
+        background-image: url("assets/index/ty_active.png");
       }
-      a.router-link-exact-active:nth-child(2){
-        background-image: url('assets/index/zl_active.png');
+      a.router-link-exact-active:nth-child(2) {
+        background-image: url("assets/index/zl_active.png");
       }
-      a.router-link-exact-active:nth-child(3){
-        background-image: url('assets/index/wh_active.png');
+      a.router-link-exact-active:nth-child(3) {
+        background-image: url("assets/index/wh_active.png");
       }
     }
   }
@@ -160,5 +152,4 @@ body {
     left: 0;
   }
 }
-
 </style>
diff --git a/src/assets/ty/bg.jpg b/src/assets/ty/tybg.jpg
similarity index 100%
rename from src/assets/ty/bg.jpg
rename to src/assets/ty/tybg.jpg
diff --git a/src/assets/wh/bg.jpg b/src/assets/wh/whbg.jpg
similarity index 100%
rename from src/assets/wh/bg.jpg
rename to src/assets/wh/whbg.jpg
diff --git a/src/router/index.js b/src/router/index.js
index 85b5a0b..b5313d3 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -9,10 +9,6 @@ const routes = [
   path: '/',
   name: 'index',
   component: () => import('../views/index.vue'),
-  meta:{
-    img:require("../assets/index/bg.jpg")
-  }
-
 },
 
 // 文化
@@ -20,9 +16,6 @@ const routes = [
   path: '/cultrue',
   name: 'cultrue',
   component: ()=>import("../views/cultrue/index.vue"),
-  meta:{
-    img:require("@/assets/wh/bg.jpg")
-  }
 },
 
 
@@ -31,9 +24,6 @@ const routes = [
   path: '/ty',
   name: 'ty',
   component: ()=>import("../views/ty/index.vue"),
-  meta:{
-    img:require("@/assets/ty/bg.jpg")
-  }
 }
 
 ]
diff --git a/src/views/cultrue/index.vue b/src/views/cultrue/index.vue
index a0a02cd..d0d0f1e 100644
--- a/src/views/cultrue/index.vue
+++ b/src/views/cultrue/index.vue
@@ -11,11 +11,24 @@ export default{
         }
     },
     mounted(){
-        console.log("wh vue")
-        console.log(this.$route.meta)
+        // console.log("wh vue")
+        // console.log(this.$route.meta)
     },
     methods:{
 
     }
 }
-</script>
\ No newline at end of file
+</script>
+<style>
+/* div#dv-full-screen-container{
+    background-image: none !important;
+} */
+.btgym::before{
+  background-image: none !important;
+  content: "";
+}
+.btgym{
+    clear: both;
+    background-image:url('../../assets/wh/whbg.jpg') !important;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/index.vue b/src/views/index.vue
index 276e9b9..c29e17b 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -13,8 +13,17 @@ export default{
         }
     },
     mounted(){
-       console.log("index.vue")
-       console.log(this.$route.meta)
+    //    console.log("index.vue")
     }
 }
 </script>
+<style>
+.btgym::before{
+  background-image: none !important;
+  content: "";
+}
+.btgym{
+    clear: both;
+    background-image:url('../assets/index/bg.jpg') !important;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/test.vue b/src/views/test.vue
new file mode 100644
index 0000000..e69de29
diff --git a/src/views/ty/index.vue b/src/views/ty/index.vue
index ffca894..5e82bab 100644
--- a/src/views/ty/index.vue
+++ b/src/views/ty/index.vue
@@ -1,21 +1,31 @@
 <template>
-    <div id="ty"></div>
+  <div id="ty"></div>
 </template>
 <script>
-export default{
-    data(){
-        return{
+export default {
+  data() {
+    return {};
+  },
 
-        }
-    },
-    mounted(){
-        console.log("ty vue")
-        console.log(this.$route.meta)
-        let bgurl = this.$route.meta
-        this.$emit("bgimg",bgurl)
-    },
-    methods:{
-
-    }
-}
+  mounted() {
+    // console.log("ty vue");
+    // console.log(this.$route.meta);
+    // let bgurl = this.$route.meta;
+    // this.$emit("bgimg", bgurl);
+  },
+  beforeDestroy(){
+    // console.log("des index");
+  },
+  methods: {},
+};
 </script>
+<style>
+div.btgym::before{
+  background-image: none !important;
+  content: "";
+}
+div.btgym{
+    clear: both;
+    background-image:url('../../assets/ty/tybg.jpg') !important;
+}
+</style>