root/xl-mobile
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
多啦C梦
2025-03-27 16:35:46 +08:00
parent 15b26ab2d9
commit 505af229fc
3 changed files with 112 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
src/components/TaskCard.vue
View File

@@ -4,8 +4,17 @@ import qrw from "../static/icons/qrw.png";
</script>
<template>
<view class="rounded-[8rpx] bg-[#fff] !p-[24rpx]">
<view class="!flex gap-[26rpx]">
<view class="rounded-[8rpx] bg-[#fff] !p-[24rpx] overflow-hidden task-card">
<view class="!pb-[20rpx] !flex justify-between" style="border-bottom: 1px solid #E5E6EB">
<view style="font-size: 28rpx">
任务编号：DF1212
</view>
<view style="font-size: 24rpx">
<Text class="text-[#165DFF]">08-13-09:54</Text>后可开始回填
</view>
</view>
<view class="!flex gap-[26rpx] !pt-[20rpx]">
<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>
@@ -14,34 +23,37 @@ import qrw from "../static/icons/qrw.png";
<view class="tag">三连发</view>
</view>
</view>
<view class="!h-[88rpx] !ml-auto">
<view class="!h-[88rpx] !ml-auto !flex items-center gap-[6rpx]">
<view class="price-info">待确认</view>
<view class="price">
<text class="unit">¥</text>
8.56
</view>
<view class="price-info">剩余3个名额</view>
</view>
</view>
<view class="!mt-[34rpx] !px-[20rpx] !py-[10rpx] bg-[#F2F3F5] info relative">
截止时间：08月23日 14:00
<view class="absolute top-1/2 -translate-y-1/2 right-0">
<image class="!w-[168rpx]" :src="qrw" mode="widthFix"></image>
<view class="!flex gap-[8rpx] justify-between">
<view>领取账号:</view>
<view>酷酷猛吃</view>
</view>
<view class="!flex gap-[8rpx] justify-between">
<view>领取时间:</view>
<view>2024-08-06 14:10</view>
</view>
</view>
</view>
</template>
<style lang="scss" scoped>
.qrw {
.task-card {
box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.1);
}
.info {
color: rgb(78, 89, 105);
font-size: 12px;
font-weight: 500;
line-height: 140%;
color: #000;
font-size: 24rpx;
font-weight: 300;
letter-spacing: 0;
text-align: left;
}

6
src/components/XDropdownList.vue
View File

@@ -20,7 +20,7 @@ const show = ref(false);
</view>
<transition name="fade">
<view v-if="show" class="absolute top-[calc(100%+10rpx)] min-w-full bg-[#fff] rounded-[8rpx]">
<view v-if="show" class="absolute top-[calc(100%+10rpx)] min-w-full bg-[#fff] rounded-[8rpx] x-dropdown-card">
<slot name="menu"></slot>
</view>
</transition>
@@ -35,6 +35,10 @@ const show = ref(false);
</template>
<style lang="scss" scoped>
.x-dropdown-card {
box-shadow: 0px 2px 20px 5px rgba(0, 0, 0, 0.2);
}
.fade-enter-active,
.fade-leave-active {
transition: opacity 300ms;