the ai video generating for KeLing is ready

web/src/views/Luma.vue

@@ -58,7 +58,7 @@
                     <img src="/images/play.svg" alt="" />
                   </button>
                 </div>
-                <el-image :src="item.cover_url" fit="cover" v-else-if="item.progress > 100" />
+                <el-image :src="item.cover_url" fit="cover" v-else-if="item.progress === 101" />
                 <generating message="正在生成视频" v-else />
               </div>
             </div>
@@ -68,10 +68,16 @@
             </div>
             <div class="right" v-if="item.progress === 100">
               <div class="tools">
-                <button class="btn btn-publish">
+                <!-- <button class="btn btn-publish">
                   <span class="text">发布</span>
                   <black-switch v-model:value="item.publish" @change="publishJob(item)" size="small" />
-                </button>
+                </button> -->
+
+                <el-tooltip content="复制提示词" placement="top">
+                  <button class="btn btn-icon copy-prompt" :data-clipboard-text="item.prompt">
+                    <i class="iconfont icon-copy"></i>
+                  </button>
+                </el-tooltip>
 
                 <el-tooltip content="下载视频" placement="top">
                   <button class="btn btn-icon" @click="download(item)" :disabled="item.downloading">
@@ -111,7 +117,7 @@
       </div>
     </el-container>
     <black-dialog v-model:show="showDialog" title="预览视频" hide-footer @cancal="showDialog = false" width="auto">
-      <video style="width: 100%; max-height: 90vh" :src="currentVideoUrl" preload="auto" :autoplay="true" loop="loop" muted="muted" v-show="showDialog">
+      <video style="max-width: 90vw; max-height: 90vh" :src="currentVideoUrl" preload="auto" :autoplay="true" loop="loop" muted="muted" v-show="showDialog">
         您的浏览器不支持视频播放
       </video>
     </black-dialog>
@@ -131,7 +137,7 @@ import { ElMessage, ElMessageBox } from "element-plus";
 import BlackSwitch from "@/components/ui/BlackSwitch.vue";
 import Generating from "@/components/ui/Generating.vue";
 import BlackDialog from "@/components/ui/BlackDialog.vue";
-
+import Clipboard from "clipboard";
 const showDialog = ref(false);
 const currentVideoUrl = ref("");
 const row = ref(1);
@@ -152,16 +158,31 @@ const page = ref(1);
 const pageSize = ref(10);
 const total = ref(0);
 const taskPulling = ref(true);
+const clipboard = ref(null);
+const pullHandler = ref(null);
 
 onMounted(() => {
   checkSession().then(() => {
     fetchData(1);
-    setInterval(() => {
+    // 设置轮询
+    pullHandler.value = setInterval(() => {
       if (taskPulling.value) {
         fetchData(1);
       }
     }, 5000);
   });
+
+  clipboard.value = new Clipboard(".copy-prompt");
+  clipboard.value.on("success", () => {
+    ElMessage.success("复制成功！");
+  });
+});
+
+onUnmounted(() => {
+  clipboard.value.destroy();
+  if (pullHandler.value) {
+    clearInterval(pullHandler.value);
+  }
 });
 
 const download = (item) => {

web/src/views/Song.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="page-song" :style="{ height: winHeight + 'px' }">
+  <div class="page-song">
     <div class="inner">
       <h2 class="title">{{ song.title }}</h2>
       <div class="row tags" v-if="song.tags">
@@ -11,15 +11,10 @@
           <el-avatar :size="32" :src="song.user?.avatar" />
         </span>
         <span class="nickname">{{ song.user?.nickname }}</span>
-        <button class="btn btn-icon" @click="play">
-          <i class="iconfont icon-play"></i> {{ song.play_times }}
-        </button>
+        <button class="btn btn-icon" @click="play"><i class="iconfont icon-play"></i> {{ song.play_times }}</button>
 
         <el-tooltip content="复制歌曲链接" placement="top">
-          <button
-            class="btn btn-icon copy-link"
-            :data-clipboard-text="getShareURL(song)"
-          >
+          <button class="btn btn-icon copy-link" :data-clipboard-text="getShareURL(song)">
             <i class="iconfont icon-share1"></i>
           </button>
         </el-tooltip>
@@ -31,18 +26,12 @@
       </div>
 
       <div class="row">
-        <textarea class="prompt" maxlength="2000" rows="18" readonly>{{
-          song.prompt
-        }}</textarea>
+        <textarea class="prompt" maxlength="2000" rows="18" readonly>{{ song.prompt }}</textarea>
       </div>
     </div>
 
     <div class="music-player" v-if="playList.length > 0">
-      <music-player
-        :songs="playList"
-        ref="playerRef"
-        @play="song.play_times += 1"
-      />
+      <music-player :songs="playList" ref="playerRef" @play="song.play_times += 1" />
     </div>
   </div>
 </template>
@@ -67,8 +56,7 @@ httpGet("/api/suno/detail", { song_id: id })
   .then((res) => {
     song.value = res.data;
     playList.value = [song.value];
-    document.title =
-      song.value?.title + " | By " + song.value?.user.nickname + " | Suno音乐";
+    document.title = song.value?.title + " | By " + song.value?.user.nickname + " | Suno音乐";
   })
   .catch((e) => {
     showMessageError("获取歌曲详情失败：" + e.message);