添加tailwind，.env设置，优化删除

src/App.vue

@@ -246,6 +246,13 @@ body {
     max-width: 800px;
   }
 }
+
+// button, [type='button'], [type='reset'], [type='submit']{
+//   background-color: inherit;
+// }
+button.n-button{
+  background-color: var(--n-color);
+}
 </style>
 <style lang="less" scoped>
 #wp {

src/main.js

@@ -4,6 +4,7 @@ import router from "./router";
 import store from "./store";
 import VueLazyLoad from 'vue3-lazyload'
 import svgIcon from '@/components/svgIcon.vue'
+import './tailwind.css'
 
 createApp(App)
 .use(store)

src/network/request.js

@@ -1,8 +1,10 @@
 import axios from 'axios'
+const NETEASECLOUD_API = import.meta.env.VITE_NETEASECLOUD_API;
+// console.log('NETEASECLOUD_API', NETEASECLOUD_API);
 
 export function request(config){
   const instance =  axios.create({
-    baseURL: 'http://localhost:3300',
+    baseURL: NETEASECLOUD_API,
     timeout: 5000,
   })
 

src/tailwind.css

@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

src/views/common/Search.vue

@@ -47,7 +47,7 @@ const result = ref({});
       @keydown.enter="search"
       @keyup.esc="pubsub.publish('zp.hideSearch');"
       @input="handleInput"
-      style="width: 190px"
+      style="width: 120px"
     >
       <template #prefix>
         <n-icon>

src/views/common/SongCtrl.vue

@@ -122,12 +122,14 @@ const play = async (id, im = true) => {
     });
 };
 
-const pause = () => {
+const pause = (e) => {
+  console.log('点击暂停',e);
   audioEl.value.pause();
   playing.value = false;
 };
 
-const resume = async () => {
+const resume = async (e) => {
+  console.log('点击恢复播放',e);
   if (audioEl.value.readyState) {
     //如果暂停过了10分钟，需要再次载入歌曲
     // console.log(Date.now() - lastPause);
@@ -158,10 +160,12 @@ const favorite = () => {
   // console.log(audioEl.value.currentTime);
 };
 
-const removeCurrentSong = () => {
-  pubsub.publish("zp.removeCurrPlayingSong", {
-    id: store.state.settings.songId,
-  });
+const removeCurrentSong = (e) => {
+  console.log('从播放列表中删除',e);
+  if(e?.pointerId!=-1)
+    pubsub.publish("zp.removeCurrPlayingSong", {
+      id: store.state.settings.songId,
+    });
 };
 
 let interval;

src/views/common/SongDetail.vue

@@ -205,7 +205,7 @@ export default {};
   position: absolute;
   left: 0;
   top: 0;
-  right: 296px;
+  right: 220px;
   height: 40px;
   background-color: #f9f9f9;
   padding-left: 50px;

src/views/common/SongInfo.vue

@@ -178,6 +178,10 @@ export default {};
 
     .img {
       border-radius: var(--radius);
+      width: 42px;
+      height: 42px;
+      max-width: 42px;
+      max-height: 42px;
     }
 
     .wp-icon {

src/views/discover/Recommend.vue

@@ -430,6 +430,8 @@ getPersonalizedMV()
   img {
     width: 60px;
     height: 60px;
+    max-width: 60px;
+    max-height: 60px;
     border-radius: 4px;
   }
 

src/views/videos/V.vue

@@ -2,7 +2,7 @@
 import { NButton, NSpace, NIcon } from "naive-ui";
 import PlayCircle from '@/assets/svgs/PlayCircle.svg'
 import {ref} from 'vue'
-import sparkMD from 'spark-md5'
+import sparkMD from 'spark-md5' 
 import CryptoJS from 'crypto-js';
 import md5 from 'crypto-js/md5'; 
 import sha256 from 'crypto-js/sha256'; 
@@ -111,6 +111,14 @@ const fileChange = (e) => {
     </div>
   </div>
   <input type="file" id="file" @change="fileChange">
+  
+  <div class="max-w-sm my-3 mx-auto hover:bg-purple-900  hover:text-white hover:cursor-pointer
+    border-gray-100 border px-2 py-3 
+    text-xs bg-white 
+    rounded-md shadow-md">
+    这是一个测试
+  </div>
+
 </template>
 
 <script>