feat: Support copy artist and album URL (#708)

src/views/album.vue

@@ -116,9 +116,14 @@
     <ContextMenu ref="albumMenu">
       <!-- <div class="item">{{ $t('contextMenu.addToQueue') }}</div> -->
       <div class="item" @click="likeAlbum(true)">{{
-        dynamicDetail.isSub ? '从音乐库删除' : '保存到音乐库'
+        dynamicDetail.isSub
+          ? $t('contextMenu.removeFromLibrary')
+          : $t('contextMenu.saveToLibrary')
+      }}</div>
+      <div class="item">{{ $t('contextMenu.addToPlaylist') }}</div>
+      <div class="item" @click="copyUrl(album.id)">{{
+        $t('contextMenu.copyUrl')
       }}</div>
-      <div class="item">添加到歌单</div>
     </ContextMenu>
   </div>
 </template>
@@ -128,6 +133,7 @@ import { mapMutations, mapActions, mapState } from 'vuex';
 import { getArtistAlbum } from '@/api/artist';
 import { getTrackDetail } from '@/api/track';
 import { getAlbum, albumDynamicDetail, likeAAlbum } from '@/api/album';
+import locale from '@/locale';
 import { splitSoundtrackAlbumTitle, splitAlbumTitle } from '@/utils/common';
 import NProgress from 'nprogress';
 import { isAccountLoggedIn } from '@/utils/auth';
@@ -267,9 +273,6 @@ export default {
         this.dynamicDetail = data;
       });
     },
-    openMenu(e) {
-      this.$refs.albumMenu.openMenu(e);
-    },
     toggleFullDescription() {
       this.showFullDescription = !this.showFullDescription;
       if (this.showFullDescription) {
@@ -278,6 +281,19 @@ export default {
         enableScrolling();
       }
     },
+    openMenu(e) {
+      this.$refs.albumMenu.openMenu(e);
+    },
+    copyUrl(id) {
+      let showToast = this.showToast;
+      this.$copyText('https://music.163.com/#/album?id=' + id)
+        .then(function () {
+          showToast(locale.t('toast.copied'));
+        })
+        .catch(error => {
+          showToast(`${locale.t('toast.copyFailed')}${error}`);
+        });
+    },
   },
 };
 </script>

src/views/artist.vue

@@ -31,6 +31,14 @@
             <span v-if="artist.followed">{{ $t('artist.following') }}</span>
             <span v-else>{{ $t('artist.follow') }}</span>
           </ButtonTwoTone>
+          <ButtonTwoTone
+            icon-class="more"
+            :icon-button="true"
+            :horizontal-padding="0"
+            color="grey"
+            @click.native="openMenu"
+          >
+          </ButtonTwoTone>
         </div>
       </div>
     </div>
@@ -156,6 +164,12 @@
         {{ artist.briefDesc }}
       </p>
     </Modal>
+
+    <ContextMenu ref="artistMenu">
+      <div class="item" @click="copyUrl(artist.id)">{{
+        $t('contextMenu.copyUrl')
+      }}</div>
+    </ContextMenu>
   </div>
 </template>
 
@@ -168,11 +182,13 @@ import {
   followAArtist,
   similarArtists,
 } from '@/api/artist';
+import locale from '@/locale';
 import { isAccountLoggedIn } from '@/utils/auth';
 import { disableScrolling, enableScrolling } from '@/utils/ui';
 import NProgress from 'nprogress';
 
 import ButtonTwoTone from '@/components/ButtonTwoTone.vue';
+import ContextMenu from '@/components/ContextMenu.vue';
 import TrackList from '@/components/TrackList.vue';
 import CoverRow from '@/components/CoverRow.vue';
 import Cover from '@/components/Cover.vue';
@@ -181,7 +197,15 @@ import Modal from '@/components/Modal.vue';
 
 export default {
   name: 'Artist',
-  components: { Cover, ButtonTwoTone, TrackList, CoverRow, MvRow, Modal },
+  components: {
+    Cover,
+    ButtonTwoTone,
+    TrackList,
+    CoverRow,
+    MvRow,
+    Modal,
+    ContextMenu,
+  },
   beforeRouteUpdate(to, from, next) {
     NProgress.start();
     this.artist.img1v1Url =
@@ -247,7 +271,7 @@ export default {
   },
   methods: {
     ...mapMutations(['appendTrackToPlayerList']),
-    ...mapActions(['playFirstTrackOnList', 'playTrackOnListByID']),
+    ...mapActions(['playFirstTrackOnList', 'playTrackOnListByID', 'showToast']),
     loadData(id, next = undefined) {
       getArtist(id).then(data => {
         this.artist = data.artist;
@@ -312,6 +336,19 @@ export default {
         enableScrolling();
       }
     },
+    openMenu(e) {
+      this.$refs.artistMenu.openMenu(e);
+    },
+    copyUrl(id) {
+      let showToast = this.showToast;
+      this.$copyText('https://music.163.com/#/artist?id=' + id)
+        .then(function () {
+          showToast(locale.t('toast.copied'));
+        })
+        .catch(error => {
+          showToast(`${locale.t('toast.copyFailed')}${error}`);
+        });
+    },
   },
 };
 </script>