添加登录

src/views/list/index.vue

@@ -22,7 +22,6 @@ const selectRecommendItem = async (item: IRecommendItem) => {
   showMusic.value = true
   recommendItem.value = item
   listDetail.value = data
-  console.log(data);
 
 }
 const closeMusic = () => {
@@ -96,7 +95,7 @@ const formatDetail = computed(() => (detail: any) => {
         <div
           v-for="(item, index) in listDetail?.playlist.tracks"
           :key="item.id"
-          :class="setAnimationClass('animate__bounceInRight')"
+          :class="setAnimationClass('animate__bounceInUp')"
           :style="setAnimationDelay(index, 100)"
         >
           <SongItem :item="formatDetail(item)" />
@@ -121,6 +120,7 @@ const formatDetail = computed(() => (detail: any) => {
 
   &-list {
     @apply flex flex-wrap;
+    padding-bottom: 100px;
   }
   &-item {
     width: 200px;

src/views/login/index.vue

@@ -0,0 +1,50 @@
+<script lang="ts" setup>
+import { getQrKey, createQr, checkQr, getLoginStatus } from '@/api/login'
+import { onMounted } from '@vue/runtime-core';
+import { ref } from 'vue';
+
+const qrUrl = ref<string>()
+onMounted(() => {
+  loadLogin()
+})
+
+const loadLogin = async () => {
+  const qrKey = await getQrKey()
+  const key = qrKey.data.data.unikey
+  const { data } = await createQr(key)
+  qrUrl.value = data.data.qrimg
+  timerIsQr(key)
+}
+
+const timerIsQr = (key: string) => {
+  const timer = setInterval(async () => {
+    const { data } = await checkQr(key)
+    if (data.code === 800) {
+      clearInterval(timer)
+    }
+    if (data.code === 803) {
+      // 将token存入localStorage
+      localStorage.setItem('token', data.cookie)
+      await getLoginStatus().then(res => {
+        console.log(res);
+      })
+      clearInterval(timer)
+    }
+  }, 5000);
+}
+</script>
+
+<template>
+  <div class="login-page">
+    <div>登录</div>
+    <div>
+      <img :src="qrUrl" />
+    </div>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.login-page {
+  @apply p-4;
+}
+</style>