修改神秘贵州展厅设计图为虚拟展厅

src/icons/svg/360.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1666058274042" class="icon" viewBox="0 0 2688 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3695" xmlns:xlink="http://www.w3.org/1999/xlink" width="126" height="48"><path d="M1774.421333 219.477333c19.541333 0 32.384 4.885333 38.485334 14.656 1.237333 2.453333 7.338667 12.842667 18.346666 31.168a18660.266667 18660.266667 0 0 0 51.328 86.186667h-98.986666l-25.685334-49.514667c-7.338667-13.44-18.346667-20.16-33.002666-20.16h-163.157334l-21.994666 45.824c-4.906667 14.677333-15.893333 22.613333-33.002667 23.829334h-67.84l44.010667-102.656c8.533333-19.562667 21.973333-29.333333 40.32-29.333334h251.178666zM1446.250667 659.477333v-60.501333h172.330666v-21.994667c0-20.778667-11.605333-31.168-34.837333-31.168h-130.154667v-62.336h164.992v-23.829333c0-22.016-11.605333-33.002667-34.837333-33.002667h-131.989333v-62.336h416.149333v62.336H1704.746667v56.832h161.344v62.336H1704.746667v53.162667h170.496v20.16c0 26.88-13.44 40.32-40.32 40.32h-388.693334z m821.333333-440c40.32 0 61.098667 18.944 62.336 56.832v109.994667h-163.178667v16.512h181.504v47.658667H1908.266667v-47.658667h183.338666c0-11.008-11.008-16.512-33.002666-16.512H1930.24v-109.994667c0-37.888 20.181333-56.832 60.501333-56.832h276.842667z m-284.16 245.653334h302.506667c32.981333 0 49.493333 14.677333 49.493333 44.010666v62.336h-159.509333v88h-78.826667v-58.666666c0-19.562667-12.842667-29.333333-38.506667-29.333334H1930.24v-62.336c0-29.333333 17.728-44.010667 53.184-44.010666z m238.314667 42.176H1999.914667v23.829333h254.826666v-5.504c0-12.202667-10.986667-18.325333-33.002666-18.325333z m5.504 78.826666h62.336c13.44 1.237333 23.232 6.72 29.333333 16.512l23.829333 54.997334h-82.496l-33.002666-71.509334z m-196.16 0l-23.829334 69.674667h-82.496l27.498667-69.674667h78.826667z m188.821333-265.813333H2005.418667v20.16h249.322666v-5.504c0-11.008-11.605333-15.893333-34.837333-14.677333z m-536.746667 536.149333h-1434.88c-116.522667 0-210.944-94.997333-210.944-212.053333v-23.04c0-117.077333 94.442667-212.074667 210.965334-212.074667a26.666667 26.666667 0 0 1 0 53.333334c-86.997333 0-157.632 71.04-157.632 158.72v23.061333c0 87.68 70.613333 158.72 157.632 158.72h1434.837333V720.426667l218.816 109.397333-218.816 109.418667v-82.752z m322.261334-570.986666h249.322666v-7.338667c0-9.770667-11.605333-14.677333-34.837333-14.677333H2005.418667v22.016z m-1406.72 204.032v74.026666c-1.344 39.978667-24.682667 60.650667-70.016 61.973334h-189.994667v-67.989334h179.989333V497.493333c-3.989333-25.322667-21.973333-39.317333-53.973333-41.984H378.666667v-72h139.989333v-56c-3.989333-26.666667-22.656-41.344-56-44.010666h-123.989333V211.52h181.994666c50.666667 1.344 76.672 25.344 77.994667 72v69.994667c0 29.333333-15.317333 52.010667-45.994667 68.010666 29.333333 11.989333 44.672 34.666667 45.994667 67.989334z m328.789333-37.973334v99.989334c-2.666667 46.656-30.677333 71.317333-84.010667 73.984h-120c-49.322667-1.322667-74.666667-25.984-75.989333-73.984V305.493333c0-62.656 31.338667-93.994667 93.994667-93.994666h170.005333v72H727.466667v85.994666h117.994666c53.333333 1.344 80.661333 28.672 82.005334 82.005334z m-80 105.984v-72c-2.666667-26.666667-20.672-41.344-53.994667-44.010666H727.466667v116.010666h120zM1242.282667 305.493333v224c-1.322667 62.677333-34.005333 94.677333-98.005334 96h-80c-62.656-2.666667-95.317333-32.64-97.984-89.984V309.525333c2.666667-62.677333 35.989333-95.338667 99.989334-98.005333h77.994666c61.333333 4.010667 94.016 35.328 98.005334 93.994667z m-80 216v-203.989333c-1.322667-21.333333-13.333333-32.661333-35.989334-34.005333h-46.016c-21.333333 1.344-32.64 12.672-33.984 34.005333v205.994667c1.322667 21.333333 12.650667 32.661333 33.984 34.005333h44.010667c24-1.344 36.672-13.333333 37.994667-36.010667z m148.906666-299.562666a92.309333 92.309333 0 1 1 0-184.618667 92.309333 92.309333 0 0 1 0 184.618667z m0-53.333334a38.976 38.976 0 1 0 0-77.952 38.976 38.976 0 0 0 0 77.952zM2120.746667 856.469333a26.666667 26.666667 0 0 1 0-53.333333h320.469333c86.122667 0 156.117333-70.997333 156.117333-158.72v-23.04c0-87.744-70.016-158.741333-156.117333-158.741333a26.666667 26.666667 0 1 1 0-53.333334c115.733333 0 209.450667 95.04 209.450667 212.053334v23.061333c0 117.013333-93.696 212.053333-209.450667 212.053333H2120.746667z" p-id="3696"></path></svg>
\ No newline at end of file

src/views/boutique/components/SMGZ.vue

@@ -211,14 +211,20 @@
           <div class="img-container wow animate__animated animate__fadeInLeft">
             <img src="@/assets/imgs/boutique/smgz/5_guide/pic1.png" alt="" />
           </div>
-          <div class="img-container wow animate__animated animate__fadeInRight">
+          <!-- <div class="img-container wow animate__animated animate__fadeInRight">
             <img src="@/assets/imgs/boutique/smgz/5_guide/pic2.png" alt="" />
+          </div> -->
+          <div class="guide-content-vr">
+            <div class="img-container" @click="handleToVR">
+              <img src="@/assets/imgs/boutique/smgz/5_guide/vr.png" alt="" />
+              <div class="modal">
+                <svg-icon icon-class="360"></svg-icon>
+              </div>
+            </div>
           </div>
         </div>
-        <div class="vr">
-          <div class="img-container"></div>
-        </div>
-        <!-- <div
+
+        <div
           class="
             guide-content-3d-imgs
             wow
@@ -226,8 +232,7 @@
           "
         >
           <img src="@/assets/imgs/boutique/smgz/5_guide/pic3.png" alt="" />
-        </div> -->
-        
+        </div>
       </div>
     </div>
 
@@ -789,6 +794,7 @@ export default {
       .guide-content-imgs {
         display: flex;
         justify-content: center;
+        align-items: center;
         .img-container {
           width: 800px;
           height: 596px;
@@ -799,6 +805,44 @@ export default {
           }
         }
       }
+
+      .guide-content-vr {
+        height: 600px;
+        display: flex;
+        padding-top: 20px;
+        .img-container {
+          width: 800px;
+          height: 520px;
+          position: relative;
+          cursor: pointer;
+          overflow: hidden;
+          &:hover {
+            img {
+              transform: scale(1.1);
+            }
+          }
+          img {
+            width: 100%;
+            height: 520px;
+            transition: all ease 0.5s;
+          }
+          .modal {
+            position: absolute;
+            left: 0;
+            top: 0;
+            width: 100%;
+            height: 520px;
+            background: rgba(0, 0, 0, 0.4);
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            .svg-icon {
+              font-size: 150px;
+              color: #fff;
+            }
+          }
+        }
+      }
       .guide-content-3d-imgs {
         margin-bottom: 70px;
         width: 90%;