1

src/assets/style/index.css

@@ -185,7 +185,7 @@ body {
   }
   
   .chapter {
-    background-image: url(../img/webp/chapterunit/chapter-bg.webp);
+    background-image: url(./img/webp/chapterunit/chapter-bg.webp);
   }
   .chapter .box {
     display: -webkit-box;
@@ -230,7 +230,7 @@ body {
   }
   
   .unit {
-    background-image: url(../img/webp/chapterunit/unit-bg.webp);
+    background-image: url(./img/webp/chapterunit/unit-bg.webp);
   }
   .unit .box {
     padding-top: 15vh;
@@ -288,7 +288,7 @@ body {
   }
   #fullPage-nav li a.active span {
     background: none;
-    background: url(../img/webp/navicon-active.webp) no-repeat center/contain;
+    background: url(./img/webp/navicon-active.webp) no-repeat center/contain;
   }
   #fullPage-nav li:after {
     content: "";
@@ -298,14 +298,14 @@ body {
     width: 100%;
     margin-left: -0.15rem;
     height: 0.2rem;
-    background: url(../img/webp/nav-bg.webp) no-repeat center/auto 100%;
+    background: url(./img/webp/nav-bg.webp) no-repeat center/auto 100%;
   }
   #fullPage-nav li:last-child:after {
     display: none;
   }
   #fullPage-nav span {
     border: 0;
-    background: url(../img/webp/navicon.webp) no-repeat center/contain;
+    background: url(./img/webp/navicon.webp) no-repeat center/contain;
     width: 0.3rem;
     height: 0.3rem;
     top: 0;
@@ -313,7 +313,7 @@ body {
   }
   
   .section-erweima {
-    background-image: url(../img/webp/ewm-bg.webp);
+    background-image: url(./img/webp/ewm-bg.webp);
   }
   .section-erweima .box {
     height: 100%;
@@ -337,7 +337,7 @@ body {
     height: 6.375rem;
     margin-bottom: 1.5rem;
     display: block;
-    background: url(../img/webp/section1/logo.webp) no-repeat center/cover;
+    background: url(./img/webp/section1/logo.webp) no-repeat center/cover;
   }
   .section-erweima .ewmlist {
     margin-top: 8vh;
@@ -374,7 +374,7 @@ body {
     width: 1.625rem;
     height: 1.625rem;
     display: inline-block;
-    background: url(../img/webp/xnzt-btn.webp) no-repeat center/contain;
+    background: url(./img/webp/xnzt-btn.webp) no-repeat center/contain;
   }
   .section-erweima .infoicon {
     margin-top: 7vh;
@@ -701,7 +701,7 @@ body {
     top: 0;
     width: 100vw;
     height: 100vh;
-    background: url(../img/webp/ewm-bg.webp) no-repeat center/cover;
+    background: url(./img/webp/ewm-bg.webp) no-repeat center/cover;
     z-index: 999;
     display: -webkit-box;
     display: -ms-flexbox;
@@ -749,7 +749,7 @@ body {
     left: 0;
     width: 100%;
     height: 100%;
-    background: url(../img/webp/section1/section1-title.webp) no-repeat center/contain;
+    background: url(./img/webp/section1/section1-title.webp) no-repeat center/contain;
   }
   
   .wapbody .section-loading p {
@@ -779,7 +779,7 @@ body {
   .wapbody .section-loading .section1-wwbox .title2 {
     background-position: top;
     background-size: 80% auto;
-    background-image: url(../img/webp/wap/section1/section1-title.webp);
+    background-image: url(./img/webp/wap/section1/section1-title.webp);
   }
   
   .dialoghide {

src/assets/style/reset.css

@@ -670,7 +670,7 @@
   }
   
   .wwfirst {
-    background: url(../img/webp/wwfirst-bg.webp) no-repeat center/cover;
+    background: url(./img/webp/wwfirst-bg.webp) no-repeat center/cover;
   }
   .wwfirst > .box .wwbox img {
     width: 100%;
@@ -718,7 +718,7 @@
   .wsicon .inner {
     width: 4rem;
     height: 4rem;
-    background: url(../img/webp/wsicon-sec.webp) no-repeat center/contain;
+    background: url(./img/webp/wsicon-sec.webp) no-repeat center/contain;
     -webkit-animation: 2s linear 0s infinite normal none running PnBGOBaC;
     animation: 2s linear 0s infinite normal none running PnBGOBaC;
   }

src/pages/section10.vue

@@ -10,10 +10,10 @@
             </div>
           </div>
           <div class="wwmap hide">
-            <img src="./img/webp/map/sec1/map-yzl.webp" alt="">
+            <img src="/img/map/map-yzl.webp" alt="">
           </div>
           <div class="wwbox fadeIn">
-            <img src="./img/webp/yuzhulong-1.webp" alt="" style="transform: translateY(-14.0489px) translateX(35.7064px);">
+            <img src="/img/webp/yuzhulong-1.webp" alt="" style="transform: translateY(-14.0489px) translateX(35.7064px);">
           </div>
 
           <div class="wwinfobox">

src/pages/section11.vue

@@ -10,10 +10,10 @@
             </div>
           </div>
           <div class="wwmap hide">
-            <img src="./img/webp/map/sec1/map-kfb.webp" alt="">
+            <img src="/img/map/map-kfb.webp" alt="">
           </div>
           <div class="wwbox fadeIn">
-            <img src="./img/webp/kefubi-1.webp" alt="" style="transform: translateY(-13.9422px) translateX(38.5963px);">
+            <img src="/img/webp/kefubi-1.webp" alt="" style="transform: translateY(-13.9422px) translateX(38.5963px);">
             <div class="intro dialogbtn dialogintro kfbdialog">
               <div class="point"></div>
               <div class="inner" dataname="kfbdialog"></div>

src/pages/section12.vue

@@ -10,10 +10,10 @@
             </div>
           </div>
           <div class="wwmap hide">
-            <img src="./img/webp/map/sec1/map-kffsjz.webp" alt="">
+            <img src="/img/map/map-kffsjz.webp" alt="">
           </div>
           <div class="wwbox fadeIn wwbox-big">
-            <img src="./img/webp/kefufushijiezong-1.webp" alt="" style="transform: translateY(-14.0709px) translateX(20.9817px);">
+            <img src="/img/webp/kefufushijiezong-1.webp" alt="" style="transform: translateY(-14.0709px) translateX(20.9817px);">
           </div>
 
           <div class="wwinfobox">

src/pages/section13.vue

@@ -10,11 +10,11 @@
             </div>
           </div>
           <div class="wwmap hide">
-            <img src="./img/webp/map/sec1/map-ysm.webp" alt="">
+            <img src="/img/map/map-ysm.webp" alt="">
           </div>
           <div class="wwbox fadeIn">
-            <img src="./img/webp/yushenmian-1.webp" alt="" class="ww" style="transform: translateY(-14.1525px) translateX(30.0183px);">
-            <img src="./img/webp/yushenmian-line1.webp" alt="" class="line" style="transform: translateY(-14.1525px) translateX(30.0183px);">
+            <img src="/img/webp/yushenmian-1.webp" alt="" class="ww" style="transform: translateY(-14.1525px) translateX(30.0183px);">
+            <img src="/img/webp/yushenmian-line1.webp" alt="" class="line" style="transform: translateY(-14.1525px) translateX(30.0183px);">
           </div>
 
           <div class="wwinfobox bottom">

src/pages/section16.vue

@@ -9,10 +9,10 @@
             </div>
           </div>
           <div class="wwmap hide">
-            <img src="./img/webp/map/sec2/map-yz.webp" alt="">
+            <img src="/img/map/map-yz.webp" alt="">
           </div>
           <div class="wwbox fadeIn wwbox-big">
-            <img src="./img/webp/yazhang-1.webp" alt="" style="transform: translateY(-14.0615px) translateX(41.3028px);">
+            <img src="/img/webp/yazhang-1.webp" alt="" style="transform: translateY(-14.0615px) translateX(41.3028px);">
           </div>
 
           <div class="wwinfobox">

src/pages/section17.vue

@@ -9,10 +9,10 @@
             </div>
           </div>
           <div class="wwmap hide">
-            <img src="./img/webp/map/sec2/map-yg.webp" alt="">
+            <img src="/img/map/map-yg.webp" alt="">
           </div>
           <div class="wwbox fadeIn wwbox-big">
-            <img class="yuge-img" src="./img/webp/yuge-1.webp" alt="" style="transform: translateY(-14.2624px) translateX(40.7982px);">
+            <img class="yuge-img" src="/img/webp/yuge-1.webp" alt="" style="transform: translateY(-14.2624px) translateX(40.7982px);">
           </div>
 
           <div class="wwinfobox">

src/pages/section18.vue

@@ -10,10 +10,10 @@
             </div>
           </div>
           <div class="wwmap hide">
-            <img src="./img/webp/map/sec2/map-whlp.webp" alt="">
+            <img src="/img/map/map-whlp.webp" alt="">
           </div>
           <div class="wwbox fadeIn wwbox-big">
-            <img src="./img/webp/wuhuanglianpei-1.webp" alt="" style="transform: translateY(-13.8072px) translateX(35.6147px);">
+            <img src="/img/webp/wuhuanglianpei-1.webp" alt="" style="transform: translateY(-13.8072px) translateX(35.6147px);">
           </div>
 
           <div class="wwinfobox">

src/pages/section20.vue

@@ -9,10 +9,10 @@
             </div>
           </div>
           <div class="wwmap hide">
-            <img src="./img/webp/map/sec2/map-swczyp.webp" alt="">
+            <img src="/img/map/map-swczyp.webp" alt="">
           </div>
           <div class="wwbox fadeIn wwbox-big">
-            <img src="./img/webp/yuzupei-1.webp" alt="" style="transform: translateY(-14.3879px) translateX(41.4404px);">
+            <img src="/img/webp/yuzupei-1.webp" alt="" style="transform: translateY(-14.3879px) translateX(41.4404px);">
             <div class="intro dialogbtn dialogintro yzpdialog1">
               <div class="point"></div>
               <div class="inner" dataname="yzpdialog1"></div>

src/pages/section21.vue

@@ -6,10 +6,10 @@
             <div class="wwintro1">东汉</div>
           </div>
           <div class="wwmap hide">
-            <img src="./img/webp/map/sec2/map-tdxryds.webp" alt="">
+            <img src="/img/map/map-tdxryds.webp" alt="">
           </div>
           <div class="wwbox fadeIn dialogimgbg">
-            <img src="./img/webp/tdxryds-1.webp" alt="" style="transform: translateY(-14.2467px) translateX(39.3303px);">
+            <img src="/img/webp/tdxryds-1.webp" alt="" style="transform: translateY(-14.2467px) translateX(39.3303px);">
             <div class="intro dialogbtn dialogbtn-top">
               <div class="point"></div>
               <div class="inner" dataname="tdyddialog1"></div>

src/pages/section22.vue

@@ -9,10 +9,10 @@
             </div>
           </div>
           <div class="wwmap hide">
-            <img src="./img/webp/map/sec2/map-yzun.webp" alt="">
+            <img src="/img/map/map-yzun.webp" alt="">
           </div>
           <div class="wwbox fadeIn yuzun-1">
-            <img src="./img/webp/yuzun-1.webp" alt="" style="transform: translateY(-14.1682px) translateX(41.3486px);">
+            <img src="/img/webp/yuzun-1.webp" alt="" style="transform: translateY(-14.1682px) translateX(41.3486px);">
           </div>
 
           <div class="wwinfobox">

src/pages/section25.vue

@@ -1,15 +1,15 @@
 <template>
-  <div class="section unit">
+  <div class="section wwfirst">
     <div class="box">
           <div class="wwintrobox wwintrobox1">
             <div class="wwtitle">玉梁金宝钿带</div>
             <div class="wwintro1">北朝至唐早期</div>
           </div>
           <div class="wwmap hide">
-            <img src="./img/webp/map/sec3/map-yljbxd.webp" alt="">
+            <img src="/img/map/map-yljbxd.webp" alt="">
           </div>
           <div class="wwbox fadeIn">
-            <img src="./img/webp/yljbdd-1.webp" alt="" style="transform: translateY(-13.9579px) translateX(40.2477px);">
+            <img src="/img/webp/yljbdd-1.webp" alt="" style="transform: translateY(-13.9579px) translateX(40.2477px);">
           </div>
           <div class="wwinfobox">
             <div class="wwinfo">陕西省考古研究院藏</div>

src/pages/section26.vue

@@ -0,0 +1,37 @@
+<template>
+  <div class="section wwfirst">
+    <div class="box">
+          <div class="wwintrobox wwintrobox1">
+            <div class="wwtitle">玉梁金宝钿带</div>
+            <div class="wwintro1">北朝至唐早期</div>
+          </div>
+          <div class="wwmap hide">
+            <img src="./img/map/map-yljbxd.webp" alt="">
+          </div>
+          <div class="wwbox fadeIn">
+            <img src="./img/webp/yljbdd-1.webp" alt="" style="transform: translateY(-14.1839px) translateX(31.3486px);">
+          </div>
+          <div class="wwinfobox">
+            <div class="wwinfo">陕西省考古研究院藏</div>
+            <div class="wwinfo">
+              1991年陕西省长安区南里王村<br>贞观元年（627）窦皦墓出土
+            </div>
+          </div>
+        </div>
+  </div>
+</template>
+
+<script setup></script>
+
+<style lang="scss" scoped>
+@import "/src/assets/style/index.css";
+.section {
+  position: relative;
+  position: relative;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  background: no-repeat center/cover;
+  justify-content: flex-start;
+}
+</style>

src/pages/section27.vue

@@ -0,0 +1,40 @@
+<template>
+  <div class="section wwfirst">
+    <div class="box">
+          <div class="wwintrobox wwintrobox1">
+            <div class="wwtitle">春水图玉绦环钩</div>
+            <div class="wwintro1">元</div>
+            <div class="introiconbox">
+              <div class="introicon" dataname="csydgdialog"></div>
+            </div>
+          </div>
+          <div class="wwmap hide">
+            <img src="./img/map/map-cstydhg.webp" alt="">
+          </div>
+          <div class="wwbox fadeIn">
+            <img src="./img/webp/cstythg-1.webp" alt="" style="transform: translateY(-13.8292px) translateX(30.7064px);">
+          </div>
+          <div class="wwinfobox bottom">
+            <div class="wwinfo">无锡博物院藏</div>
+            <div class="wwinfo">
+              1960年江苏省无锡市锡山区延祐七年（1320年）钱裕墓出土
+            </div>
+          </div>
+        </div>
+  </div>
+</template>
+
+<script setup></script>
+
+<style lang="scss" scoped>
+@import "/src/assets/style/index.css";
+.section {
+  position: relative;
+  position: relative;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  background: no-repeat center/cover;
+  justify-content: flex-start;
+}
+</style>

src/pages/section28.vue

@@ -0,0 +1,47 @@
+<template>
+  <div class="section wwfirst">
+    <div class="box">
+          <div class="wwintrobox wwintrobox1">
+            <div class="wwtitle">嵌宝玉兔耳环</div>
+            <div class="wwintro1">明</div>
+            <div class="wwintro2">公元1368-1644年</div>
+          </div>
+          <div class="wwmap hide">
+            <img src="./img/map/map-qbyteh.webp" alt="">
+          </div>
+          <div class="wwbox fadeIn dialogimgbg wwbox-big">
+            <img src="./img/webp/qbyteh-1.webp" alt="" style="transform: translateY(-14.1086px) translateX(22.8165px);">
+            <div class="intro dialogbtn ytehdialog1">
+              <div class="point"></div>
+              <div class="inner" dataname="qbytdialog1"></div>
+            </div>
+            <div class="intro dialogbtn ytehdialog2">
+              <div class="point"></div>
+              <div class="inner" dataname="qbytdialog2"></div>
+            </div>
+          </div>
+          <div class="wwinfobox">
+            <div class="wwinfo">明十三陵博物馆藏</div>
+            <div class="wwinfo">
+              通长5.8厘米，环径2.5厘米，兔高2.4厘米，重5.5克<br>
+              1958年北京市昌平区十三陵定陵出土
+            </div>
+          </div>
+        </div>
+  </div>
+</template>
+
+<script setup></script>
+
+<style lang="scss" scoped>
+@import "/src/assets/style/index.css";
+.section {
+  position: relative;
+  position: relative;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  background: no-repeat center/cover;
+  justify-content: flex-start;
+}
+</style>

src/pages/section29.vue

@@ -0,0 +1,40 @@
+<template>
+  <div class="section wwfirst">
+    <div class="box">
+          <div class="wwintrobox wwintrobox1">
+            <div class="wwtitle" style="margin-left: -3rem">“太上皇帝之宝”</div>
+            <div class="wwintro1">清</div>
+            <div class="wwintro2">公元1644-1911年</div>
+            <div class="introiconbox">
+              <div class="introicon" dataname="tshdialog"></div>
+            </div>
+          </div>
+          <div class="wwmap hide">
+            <img src="./img/map/map-tshdzb.webp" alt="">
+          </div>
+          <div class="wwbox fadeIn">
+            <img src="./img/webp/tshdzb-1.webp" alt="" style="transform: translateY(-14.0144px) translateX(31.3028px);">
+          </div>
+
+          <div class="wwinfobox">
+            <div class="wwinfo">故宫博物院藏</div>
+            <div class="wwinfo">印面边长6.3厘米，钮高2.8厘米，通高5.7厘米</div>
+          </div>
+        </div>
+  </div>
+</template>
+
+<script setup></script>
+
+<style lang="scss" scoped>
+@import "/src/assets/style/index.css";
+.section {
+  position: relative;
+  position: relative;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  background: no-repeat center/cover;
+  justify-content: flex-start;
+}
+</style>

src/pages/section30.vue

@@ -0,0 +1,34 @@
+<template>
+  <div class="section chapter">
+    <div class="box">
+          <div class="chapter-title">尾篇</div>
+          <div class="chapter-intro">
+            <p style="text-indent: 0">玉<br>代表了华夏儿女恒久以来的品格</p>
+            <p style="text-indent: 0">
+              玉器<br>
+              凝聚着中华民族“礼”与“德”
+            </p>
+            <p style="text-indent: 0">
+              玉文明<br>
+              她润泽和涵养着中华文明的血脉<br>
+              生机勃勃、绵延不绝……
+            </p>
+          </div>
+        </div>
+  </div>
+</template>
+
+<script setup></script>
+
+<style lang="scss" scoped>
+@import "/src/assets/style/index.css";
+.section {
+  position: relative;
+  position: relative;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  background: no-repeat center/cover;
+  justify-content: flex-start;
+}
+</style>

src/pages/section31.vue

@@ -0,0 +1,44 @@
+<template>
+  <div class="section section-erweima">
+    <div class="box">
+          <div class="logo"></div>
+          <ul class="ewmlist">
+            <li>
+              <img src="./img/webp/ewm-yy.webp" alt="">
+              <p>预约参观请扫码</p>
+            </li>
+            <li>
+              <img src="./img/webp/ewm-yrzh.webp" alt="">
+              <p>虚拟展厅二维码</p>
+            </li>
+            <li>
+              <img src="./img/webp/ewm-wx.webp" alt="">
+              <p>微信公众号</p>
+            </li>
+          </ul>
+          <a href="https://www.4dkankan.com/spg.html?m=KJ-gxWk43iHKVm&amp;lang=zh" target="_blank" class="btn">虚拟展厅<i></i></a>
+          <div class="infoicon" onclick="showCuratorialInfo()"></div>
+          <div class="curatorialinfo active">
+            <p>《玉润中华》展览策展人：左骏</p>
+            <p>线上展览策展团队：</p>
+            <p>南京博物院：张莅坤　刘佳　杨海涛</p>
+            <p>武汉数文科技有限公司团队设计制作</p>
+          </div>
+        </div>
+  </div>
+</template>
+
+<script setup></script>
+
+<style lang="scss" scoped>
+@import "/src/assets/style/index.css";
+.section {
+  position: relative;
+  position: relative;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  background: no-repeat center/cover;
+  justify-content: flex-start;
+}
+</style>

src/pages/section4.vue

@@ -30,7 +30,7 @@
 }
 .chapter {
   justify-content: flex-start;
-  background-image: url(../img/webp/chapterunit/chapter-bg.webp);
+  background-image: url(./img/webp/chapterunit/chapter-bg.webp);
   .box {
     display: -webkit-box;
     display: -ms-flexbox;

src/pages/section5.vue

@@ -30,7 +30,7 @@
 }
 
 .unit {
-  background-image: url(../img/webp/chapterunit/unit-bg.webp);
+  background-image: url(./img/webp/chapterunit/unit-bg.webp);
 }
 .unit .box {
   padding-top: 15vh;

src/pages/section9.vue

@@ -10,10 +10,10 @@
             </div>
           </div>
           <div class="wwmap hide">
-            <img src="./img/webp/map/sec1/map-yl.webp" alt="">
+            <img src="/img/map/map-yl.webp" alt="">
           </div>
           <div class="wwbox fadeIn">
-            <img src="./img/webp/yulong-1.webp" alt="" style="transform: translateY(-14.1211px) translateX(46.1193px);">
+            <img src="/img/webp/yulong-1.webp" alt="" style="transform: translateY(-14.1211px) translateX(46.1193px);">
           </div>
 
           <div class="wwinfobox">

src/view/index.vue

@@ -10,18 +10,28 @@
   <section7 />
   <section8 />
   <section9 />
-  <div class="section fp-noscroll">
-    Section 2
-  </div>
-  <div class="section">
-    Section 3
-  </div>
-  <div class="section">
-    Section 4
-  </div>
-  <div class="section">
-    Section 5
-  </div>
+  <section10 />
+  <section11 />
+  <section12 />
+  <section13 />
+  <section14 />
+  <section15 />
+  <section16 />
+  <section17 />
+  <section18 />
+  <section19 />
+  <section20 />
+  <section21 />
+  <section22 />
+  <section23 />
+  <section24 />
+  <section25 />
+  <section26 />
+  <section27 />
+  <section28 />
+  <section29 />
+  <section30 />
+  <section31 />
 </template>
 <script setup>
 import { ref } from "vue";
@@ -36,6 +46,28 @@ import Section6 from "../pages/section6.vue";
 import Section7 from "../pages/section7.vue";
 import Section8 from "../pages/section8.vue";
 import Section9 from "../pages/section9.vue";
+import Section10 from "../pages/section10.vue";
+import Section11 from "../pages/section11.vue";
+import Section12 from "../pages/section12.vue";
+import Section13 from "../pages/section13.vue";
+import Section14 from "../pages/section14.vue";
+import Section15 from "../pages/section15.vue";
+import Section16 from "../pages/section16.vue";
+import Section17 from "../pages/section17.vue";
+import Section18 from "../pages/section18.vue";
+import Section19 from "../pages/section19.vue";
+import Section20 from "../pages/section20.vue";
+import Section21 from "../pages/section21.vue";
+import Section22 from "../pages/section22.vue";
+import Section23 from "../pages/section23.vue";
+import Section24 from "../pages/section24.vue";
+import Section25 from "../pages/section25.vue";
+import Section26 from "../pages/section26.vue";
+import Section27 from "../pages/section27.vue";
+import Section28 from "../pages/section28.vue";
+import Section29 from "../pages/section29.vue";
+import Section30 from "../pages/section30.vue";
+import Section31 from "../pages/section31.vue";
 defineOptions({
   name: "View",
 });