新增下拉按钮图标

README.md

@@ -81,7 +81,7 @@ npm run pack
 该问题解决顺序如下：
 
 1. 尝试更新到最新版本
-2. 尝试切换其他歌曲，若全部歌曲都无法试听与下载
+2. 尝试切换其他歌曲（或直接搜索该歌曲），若全部歌曲都无法试听与下载则进行下一步
 3. 尝试切换网络（比如切到移动网络）
 4. 若还不行请到这个链接查看详情：<https://github.com/lyswhut/lx-music-desktop/issues/5>
 

publish/changeLog.md

@@ -2,6 +2,7 @@
 
 - 新增强迫症设置-离开搜索界面时是否清空搜索框
 - 设置-关于板块新增常见问题链接
+- 歌单左上角的分类按钮添加一个**向下图标**，方便识别该按钮为下拉框（该按钮可选择歌单类型，请自行尝试）
 
 ### 优化
 

src/renderer/components/core/Icons.vue

@@ -66,5 +66,8 @@ svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/19
       path(fill='currentColor' d='m240 346.5c0 8.269531 6.730469 15 15 15s15-6.730469 15-15v-15.25h-15c-7.960938 0-15 6.324219-15 15.25zm0 0')
       path(fill='currentColor' d='m295 150.5c-30.328125 0-55-24.746094-55-55.167969v-95.332031h-185c-30.328125 0-55 24.746094-55 55.167969v401.667969c0 30.417968 24.671875 55.164062 55 55.164062h280c30.328125 0 55-24.746094 55-55.167969v-306.332031zm5 196c0 24.8125-20.1875 45-45 45s-45-20.1875-45-45c0-25.507812 20.53125-45.25 45-45.25h15v-56.144531l-90 22.59375v108.925781c0 24.8125-20.1875 45-45 45s-45-20.1875-45-45c0-25.507812 20.53125-45.25 45-45.25h15v-75.375c0-6.878906 4.675781-12.875 11.347656-14.546875l120-30.125c9.46875-2.382813 18.652344 4.796875 18.652344 14.546875zm0 0')
       path(fill='currentColor' d='m120 376.625c0 8.269531 6.730469 15 15 15s15-6.730469 15-15v-15.25h-15c-7.960938 0-15 6.324219-15 15.25zm0 0')
+    g#icon-down
+      // 0 0 451.847 451.847
+      path(fill='currentColor' d='M225.923,354.706c-8.098,0-16.195-3.092-22.369-9.263L9.27,151.157c-12.359-12.359-12.359-32.397,0-44.751c12.354-12.354,32.388-12.354,44.748,0l171.905,171.915l171.906-171.909c12.359-12.354,32.391-12.354,44.744,0c12.365,12.354,12.365,32.392,0,44.751L248.292,345.449C242.115,351.621,234.018,354.706,225.923,354.706z')
 </template>
 

src/renderer/components/material/TagList.vue

@@ -1,6 +1,10 @@
 <template lang="pug">
   div(:class="$style.tagList")
-    div(:class="$style.label" ref="dom_btn" @click="handleShow") {{value.name}}
+    div(:class="$style.label" ref="dom_btn" @click="handleShow")
+      span {{value.name}}
+      div(:class="[$style.icon, show ? $style.active : '']")
+        svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 451.847 451.847' space='preserve')
+          use(xlink:href='#icon-down')
     div.scroll(:class="$style.list" @click.stop ref="dom_list" :style="listStyle")
       div(:class="$style.tag" @click="handleClick(null)") 默认
       dl(v-for="type in list")
@@ -9,7 +13,7 @@
 </template>
 
 <script>
-// import { isChildren } from '../../utils'
+import { isChildren } from '../../utils'
 export default {
   props: {
     list: {
@@ -58,7 +62,7 @@ export default {
   methods: {
     handleHide(e) {
       // if (e && e.target.parentNode != this.$refs.dom_list && this.show) return this.show = false
-      if (e && e.target == this.$refs.dom_btn) return
+      if (e && (e.target == this.$refs.dom_btn || isChildren(this.$refs.dom_btn, e.target))) return
       setTimeout(() => {
         this.show = false
       }, 50)
@@ -103,6 +107,26 @@ export default {
   color: @color-btn;
   cursor: pointer;
 
+  display: flex;
+
+  span {
+    flex: auto;
+  }
+  .icon {
+    flex: none;
+    margin-left: 7px;
+    svg {
+      width: 1em;
+      transition: transform .2s ease;
+      transform: rotate(0);
+    }
+    &.active {
+      svg{
+        transform: rotate(180deg);
+      }
+    }
+  }
+
   &:hover {
     background-color: @color-theme_2-hover;
   }