Sfoglia il codice sorgente

feat: 音响图片更换、点击文案切换

anxiaoxia 2 mesi fa
parent
commit
0435a1865e

+ 5 - 0
src/assets/taiguv1/svg/speaker_close_icon.svg

@@ -0,0 +1,5 @@
+<svg width="31" height="30" viewBox="0 0 31 30" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M25.8164 11.9902C26.5139 12.8336 26.8717 13.907 26.8197 15.0003C26.8717 16.0935 26.5139 17.1669 25.8164 18.0103" stroke="white" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M10.7667 10.9873H7.75669C6.66371 10.9873 5.75 11.901 5.75 12.994V17.0073C5.75 18.1003 6.66371 19.014 7.75669 19.014H10.7667L18.6129 24.6528C19.9078 25.5487 21.7684 24.6054 21.8035 23.0273V6.97386C21.8411 5.39492 20.092 4.44999 18.7935 5.34844L10.7667 10.9873Z" stroke="white" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M5.10352 4.64648L26.1035 25.6465" stroke="white" stroke-linecap="round"/>
+</svg>

+ 4 - 0
src/assets/taiguv1/svg/speaker_icon.svg

@@ -0,0 +1,4 @@
+<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M25.0664 11.9902C25.7639 12.8336 26.1217 13.907 26.0697 15.0003C26.1217 16.0935 25.7639 17.1669 25.0664 18.0103" stroke="#8E0003" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M10.0167 10.9873H7.00669C5.91371 10.9873 5 11.901 5 12.994V17.0073C5 18.1003 5.91371 19.014 7.00669 19.014H10.0167L17.8629 24.6528C19.1578 25.5487 21.0184 24.6054 21.0535 23.0273V6.97386C21.0911 5.39492 19.342 4.44999 18.0435 5.34844L10.0167 10.9873Z" stroke="#001428" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

+ 15 - 17
src/views/envmonitor/taiguv1/components/Volumn/index.vue

@@ -2,9 +2,7 @@
   <div class="volumn-box" :class="isOpen ? 'active' : ''">
     <div class="top">
       <img
-        :src="
-          parseImgUrl('taiguv1/envmonitor', isOpen ? 'active/volumn.png' : 'volumn.svg')
-        "
+        :src="isOpen ? speakerIcon : speakerCloseIcon"
         alt=""
       />
       <div class="top-right">
@@ -20,7 +18,7 @@
       <div class="volumn-info">
         <div class="left">
           <div class="text">音量</div>
-          <div class="status">已关闭</div>
+          <div class="status">{{ isOpen ? "播放中" : "已关闭" }}</div>
         </div>
         <div class="temp" v-if="isOpen">{{ volumnData.volumnTemp }}</div>
       </div>
@@ -42,21 +40,19 @@
 </template>
 
 <script>
+import speakerCloseIcon from "@/assets/taiguv1/svg/speaker_close_icon.svg";
+import speakerIcon from "@/assets/taiguv1/svg/speaker_icon.svg";
+import { fix, parseImgUrl } from "@/utils";
+import { swiper } from "@/utils/swiper";
+import { Dialog, Loading, Switch } from "vant";
 import {
-  defineComponent,
-  onMounted,
-  reactive,
-  toRefs,
-  computed,
-  watch,
-  onUnmounted,
-  onBeforeMount,
-  onBeforeUnmount,
-  nextTick,
+    defineComponent,
+    nextTick,
+    onBeforeUnmount,
+    onMounted,
+    reactive,
+    toRefs
 } from "vue";
-import { Switch, Dialog, Loading, Toast } from "vant";
-import { parseImgUrl, fix } from "@/utils";
-import { swiper } from "@/utils/swiper";
 
 export default defineComponent({
   components: {
@@ -67,6 +63,8 @@ export default defineComponent({
   setup(props, contx) {
     const proxyData = reactive({
       parseImgUrl: parseImgUrl,
+      speakerIcon: speakerIcon,
+      speakerCloseIcon: speakerCloseIcon,
       isOpen: false,
       volumnData: {
         minTempSet: 0,