手机端视频生成页面调整完成

web/src/views/mobile/pages/ImageDall.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="mobile-sd">
-    <van-form @submit="generate">
+    <van-form>
       <van-cell-group class="px-3 pt-3 pb-4">
         <div>
           <van-field
@@ -74,12 +74,16 @@
           placeholder="请在此输入绘画提示词，系统会自动翻译中文提示词，高手请直接输入英文提示词"
         />
 
-        <div class="text-line pt-6">
-          <el-tag>绘图消耗{{ dallPower }}算力，当前算力：{{ power }}</el-tag>
-        </div>
-
-        <div class="text-line">
-          <van-button round block type="primary" native-type="submit"> 立即生成 </van-button>
+        <div class="sticky bottom-4 bg-white rounded-xl p-4 shadow-sm">
+          <button
+            @click="generate"
+            :disabled="loading"
+            class="w-full py-3 bg-gradient-to-r from-blue-500 to-purple-600 text-white font-semibold rounded-xl disabled:from-gray-400 disabled:to-gray-400 disabled:cursor-not-allowed hover:from-blue-600 hover:to-purple-700 transition-all duration-200 flex items-center justify-center space-x-2"
+          >
+            <i v-if="loading" class="iconfont icon-loading animate-spin"></i>
+            <i v-else class="iconfont icon-chuangzuo"></i>
+            <span>{{ loading ? '创作中...' : '立即生成' }}({{ dallPower }}算力)</span>
+          </button>
         </div>
       </van-cell-group>
     </van-form>

web/src/views/mobile/pages/ImageMj.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="mobile-mj">
-    <van-form @submit="generate">
+    <van-form>
       <div class="text-line">图片比例</div>
       <div class="text-line">
         <van-row :gutter="10">
@@ -191,16 +191,16 @@
         </van-collapse>
       </div>
 
-      <div class="text-line pt-6">
-        <el-tag
-          >绘图消耗{{ mjPower }}算力，U/V 操作消耗{{ mjActionPower }}算力，当前算力：{{
-            power
-          }}</el-tag
+      <div class="sticky bottom-4 bg-white rounded-xl p-4 shadow-sm">
+        <button
+          @click="generate"
+          :disabled="loading"
+          class="w-full py-3 bg-gradient-to-r from-blue-500 to-purple-600 text-white font-semibold rounded-xl disabled:from-gray-400 disabled:to-gray-400 disabled:cursor-not-allowed hover:from-blue-600 hover:to-purple-700 transition-all duration-200 flex items-center justify-center space-x-2"
         >
-      </div>
-
-      <div class="text-line">
-        <van-button round block type="primary" native-type="submit"> 立即生成 </van-button>
+          <i v-if="loading" class="iconfont icon-loading animate-spin"></i>
+          <i v-else class="iconfont icon-chuangzuo"></i>
+          <span>{{ loading ? '创作中...' : '立即生成' }}({{ mjPower }}算力)</span>
+        </button>
       </div>
     </van-form>
 
@@ -735,5 +735,5 @@ const tabChange = (tab) => {
 </script>
 
 <style lang="scss">
-@use '../../../assets/css/mobile/image-mj.scss' as *;
+@use '@/assets/css/mobile/image-mj.scss' as *;
 </style>

web/src/views/mobile/pages/ImageSd.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="mobile-sd">
-    <van-form @submit="generate">
+    <van-form>
       <van-cell-group class="px-3 pt-3 pb-4">
         <div>
           <van-field
@@ -130,12 +130,16 @@
           </van-collapse-item>
         </van-collapse>
 
-        <div class="text-line pt-6">
-          <el-tag>绘图消耗{{ sdPower }}算力，当前算力：{{ power }}</el-tag>
-        </div>
-
-        <div class="text-line">
-          <van-button round block type="primary" native-type="submit"> 立即生成 </van-button>
+        <div class="sticky bottom-4 bg-white rounded-xl p-4 shadow-sm">
+          <button
+            @click="generate"
+            :disabled="loading"
+            class="w-full py-3 bg-gradient-to-r from-blue-500 to-purple-600 text-white font-semibold rounded-xl disabled:from-gray-400 disabled:to-gray-400 disabled:cursor-not-allowed hover:from-blue-600 hover:to-purple-700 transition-all duration-200 flex items-center justify-center space-x-2"
+          >
+            <i v-if="loading" class="iconfont icon-loading animate-spin"></i>
+            <i v-else class="iconfont icon-chuangzuo"></i>
+            <span>{{ loading ? '创作中...' : '立即生成' }}({{ sdPower }}算力)</span>
+          </button>
         </div>
       </van-cell-group>
     </van-form>
@@ -563,5 +567,5 @@ const showInfo = (message) => {
 </script>
 
 <style lang="scss" scoped>
-@use '../../../assets/css/mobile/image-sd.scss' as *;
+@use '@/assets/css/mobile/image-sd.scss' as *;
 </style>