update

src/pages/taskDetails/components/TaskDetails.vue

@@ -10,7 +10,7 @@ import XImage from "../../../components/XImage.vue";
         <view class="title">
             案例概览
         </view>
-        <view class="block">
+        <view class="block items-center">
             <view class="block-title">任务案例:</view>
             <view class="block-info w-full overflow-hidden">
                 <view class="text-[#165DFF] !flex items-center gap-[10rpx]">
@@ -26,13 +26,18 @@ import XImage from "../../../components/XImage.vue";
             </view>
         </view>
         <view class="block">
-            <view class="block-title">评论区案例:</view>
+            <view class="block-title">素材案例:</view>
             <view class="block-info !grid grid-cols-3 gap-[20rpx]">
                 <x-image class="!size-[160rpx]" :src="fmt" mode="aspectFill" :draggable="false"></x-image>
                 <x-image class="!size-[160rpx]" :src="fmt" mode="aspectFill" :draggable="false"></x-image>
                 <x-image class="!size-[160rpx]" :src="fmt" mode="aspectFill" :draggable="false"></x-image>
             </view>
         </view>
+        <view class="block">
+            <view class="block-title">评论区案例:</view>
+            <view>
+            </view>
+        </view>
     </view>
 </template>
 
@@ -62,5 +67,13 @@ import XImage from "../../../components/XImage.vue";
         text-align: left;
         width: 130rpx;
     }
+
+    .block-info {
+        color: rgb(78, 89, 105);
+        font-size: 24rpx;
+        font-weight: 500;
+        line-height: 140%;
+        letter-spacing: 0;
+    }
 }
 </style>

src/pages/taskDetails/index.vue

@@ -5,6 +5,8 @@ import {ref, onMounted, defineAsyncComponent} from 'vue';
 import {onLoad} from "@dcloudio/uni-app";
 import XLink from "../../components/XLink.vue";
 import XNoticeBar from "../../components/XNoticeBar.vue";
+import XImage from "../../components/XImage.vue";
+import fmt from "../../static/images/fmt.png";
 
 const details = ref(null);
 const mainDetailsRef = ref();
@@ -105,6 +107,67 @@ onMounted(() => {
                 </Suspense>
             </view>
         </view>
+
+        <view class="rounded-[16rpx] bg-[#fff] main-details overflow-hidden !p-[24rpx]">
+            <view class="w-full">
+                <view class="title">
+                    发布要求
+                </view>
+                <view class="block items-center">
+                    <view class="block-title">发布平台:</view>
+                    <view class="block-info">
+                        抖音
+                    </view>
+                </view>
+                <view class="block items-center">
+                    <view class="block-title">发布方式:</view>
+                    <view class="block-info">
+                        三连发/每次相同
+                    </view>
+                </view>
+                <view class="block items-center">
+                    <view class="block-title">每次间隔时长:</view>
+                    <view class="block-info">
+                        10分钟
+                    </view>
+                </view>
+                <view class="block">
+                    <view class="block-title">特殊要求:</view>
+                    <view class="block-info gap-[20rpx]">
+                        <view>请使用抖音扫码下图，收藏音乐，发布时使用</view>
+                        <view class="!grid grid-cols-3 !mt-[12rpx]">
+                            <x-image class="!size-[96rpx]" :src="fmt" mode="aspectFill" :draggable="false"></x-image>
+                        </view>
+                    </view>
+                </view>
+            </view>
+        </view>
+
+        <view class="rounded-[16rpx] bg-[#fff] main-details overflow-hidden !p-[24rpx]">
+            <view class="w-full">
+                <view class="title">
+                    回填要求
+                </view>
+                <view class="block flex-col">
+                    <view class="block-title">第1次回填:</view>
+                    <view class="block-info">
+                        10分钟
+                    </view>
+                </view>
+                <view class="block flex-col">
+                    <view class="block-title">第2次回填:</view>
+                    <view class="block-info">
+                        10分钟
+                    </view>
+                </view>
+                <view class="block flex-col">
+                    <view class="block-title">第3次回填:</view>
+                    <view class="block-info">
+                        10分钟
+                    </view>
+                </view>
+            </view>
+        </view>
     </view>
 </template>
 
@@ -113,6 +176,41 @@ page {
     background-color: #6AA1FF;
 }
 
+.block {
+    display: flex;
+    gap: 20rpx;
+    margin-bottom: 20rpx;
+
+    .block-title {
+        flex-shrink: 0;
+        color: rgb(134, 144, 156);
+        font-size: 24rpx;
+        font-weight: 500;
+        line-height: 140%;
+        letter-spacing: 0;
+        text-align: left;
+        width: 160rpx;
+    }
+
+    .block-info {
+        color: rgb(78, 89, 105);
+        font-size: 24rpx;
+        font-weight: 500;
+        line-height: 140%;
+        letter-spacing: 0;
+    }
+}
+
+.title {
+    color: rgb(29, 33, 41);
+    font-size: 28rpx;
+    font-weight: 500;
+    line-height: 140%;
+    letter-spacing: 0;
+    text-align: left;
+    margin-bottom: 32rpx;
+}
+
 .main-details {
     :deep(.tui-tabs-view) {
         width: 100% !important;