音乐按钮

src/views/gui/menu.vue

@@ -49,6 +49,7 @@
                 title=""
                 :src="require('@/assets/images/icon/pause.png')"
                 data-original-title="暂停"
+                :style="{opacity: '1',}"
               />
             </a>
           </div>
@@ -197,6 +198,35 @@
           <a>{[{ TERMS }]}</a>
         </div> -->
 
+        <!-- 音乐 -->
+        <div
+          id="volume"
+          class="ui-icon wide"
+          title="音乐"
+        >
+          <a>
+            <img
+              id="openMusic"
+              style="display: block"
+              @click="switchBGM(true)"
+              src="../../assets/images/icon/music-muted.png"
+              alt=""
+              title="打开音乐"
+            />
+            <img
+              id="closeMusic"
+              style="display: none"
+              @click="switchBGM(false)"
+              :style="{
+                opacity: '1',
+              }"
+              src="../../assets/images/icon/music.png"
+              alt=""
+              title="关闭音乐"
+            />
+          </a>
+        </div>
+
         <!-- 全屏 -->
         <div
           id="gui-fullscreen"
@@ -206,7 +236,7 @@
           title="全屏"
         >
           <a>
-            <img title="全屏" :src="require('@/assets/img/full.png')" />
+            <img title="全屏" :src="require('@/assets/images/icon/full.png')" />
           </a>
         </div>
 
@@ -222,7 +252,7 @@
           <a>
             <img
               title="关闭全屏"
-              :src="require('@/assets/img/fullAc.png')"
+              :src="require('@/assets/images/icon/fullAc.png')"
             />
           </a>
         </div>
@@ -271,7 +301,7 @@
               id="openMusic"
               style="display: block"
               @click="switchBGM(true)"
-              src="../../assets/img/musicAc.png"
+              src="../../assets/images/icon/music-muted.png"
               alt=""
               title="打开音乐"
             />
@@ -279,7 +309,7 @@
               id="closeMusic"
               style="display: none"
               @click="switchBGM(false)"
-              src="../../assets/img/music.png"
+              src="../../assets/images/icon/music.png"
               alt=""
               title="关闭音乐"
             />
@@ -294,7 +324,7 @@
           title="全屏"
         >
           <a>
-            <img title="全屏" :src="require('@/assets/img/full.png')" />
+            <img title="全屏" :src="require('@/assets/images/icon/full.png')" />
           </a>
         </div>
         <div
@@ -308,7 +338,7 @@
           <a>
             <img
               title="关闭全屏"
-              :src="require('@/assets/img/fullAc.png')"
+              :src="require('@/assets/images/icon/fullAc.png')"
               style="width: 50px"
             />
           </a>
@@ -341,7 +371,7 @@ export default {
   components: { Share, MapNav, Antique, Hotspot },
   data() {
     return {
-      isGuide: true,
+      isGuide: false,
       // 右侧菜单数据
       smBtn: false,
       meanInd: null,
@@ -541,7 +571,6 @@ export default {
 // ----------end of 吴忠项目独有的右侧菜单-------------
 
 @wh: 50px;
-@margin: 5px;
 // ----------左下方菜单--------------
 .pinBottom.left {
   > div {
@@ -550,7 +579,7 @@ export default {
       padding: 0;
       #play,
       #pause {
-        margin-right: @margin;
+        margin-right: 5px;
         img {
           width: @wh;
           height: @wh;
@@ -559,7 +588,7 @@ export default {
       }
       #gui-modes-map {
         > div {
-          margin-right: @margin;
+          margin-right: 5px;
           > img {
             width: @wh;
             height: @wh;
@@ -586,7 +615,7 @@ export default {
   .ui-icon {
     width: @wh;
     height: @wh;
-    margin-left: @margin;
+    margin-left: 30px;
     margin-right: initial;
     background: none;
     border: none;