update

src/components/TaskItem.vue

@@ -1,30 +1,39 @@
 <script setup>
 import dy from "../static/images/抖音.png";
 import qrw from "../static/icons/qrw.png";
+import {numberToCharacter, toPage} from "../utils/uils.js";
+import dayjs from "dayjs";
+
+const {data} = defineProps({
+    data: {
+        type: Object,
+        default: null
+    }
+});
 </script>
 
 <template>
-    <view class="rounded-[8rpx] bg-[#fff] !p-[24rpx]">
+    <view class="rounded-[8rpx] bg-[#fff] !p-[24rpx]" @click="toPage(`/pages/taskDetails/index?id=${data.id}`)">
         <view class="!flex gap-[26rpx]">
             <image class="!size-[88rpx] rounded-[50%] overflow-hidden" mode="aspectFill" :src="dy"></image>
             <view class="!h-[88rpx] !flex flex-col justify-between">
-                <view class="title">美白祛斑洗面奶</view>
+                <view class="title">{{ data.goods_name }}</view>
                 <view class="!flex gap-[8rpx]">
-                    <view class="tag">抖音</view>
-                    <view class="tag">三连发</view>
+                    <view class="tag">{{ data.platform }}</view>
+                    <view class="tag">{{ numberToCharacter(data.fb_num - 1) }}连发</view>
                 </view>
             </view>
             <view class="!h-[88rpx] !ml-auto">
                 <view class="price">
                     <text class="unit">¥</text>
-                    8.56
+                    {{ data.real_price.toFixed(2) }}
                 </view>
-                <view class="price-info">剩余3个名额</view>
+                <view class="price-info">剩余{{ data.children_num }}个名额</view>
             </view>
         </view>
 
         <view class="!mt-[34rpx] !px-[20rpx] !py-[10rpx] bg-[#F2F3F5] info relative">
-            截止时间：08月23日 14:00
+            截止时间：{{ dayjs(data.end_time).format('MM月DD日 HH:mm') }}
             <view class="absolute top-1/2 -translate-y-1/2 right-0">
                 <image class="!w-[168rpx]" :src="qrw" mode="widthFix"></image>
             </view>