feat: harden phase one workflows
This commit is contained in:
@@ -1,25 +1,42 @@
|
||||
<view class="page" wx:if="{{groupBuy}}">
|
||||
<view class="card">
|
||||
<view class="section-title">{{groupBuy.title}}</view>
|
||||
<view class="price">¥{{groupBuy.priceCent / 100}}</view>
|
||||
<view class="muted">{{groupBuy.description || '社区团购'}}</view>
|
||||
<view class="muted">自提点:{{groupBuy.pickupAddress}}</view>
|
||||
<view class="page detail-page" wx:if="{{groupBuy}}">
|
||||
<view class="detail-hero">
|
||||
<image wx:if="{{groupBuy.coverUrl}}" class="detail-cover" src="{{groupBuy.coverUrl}}" mode="aspectFill" />
|
||||
<view wx:else class="detail-cover media-placeholder">团</view>
|
||||
<view class="detail-info">
|
||||
<view class="tag">{{groupBuy.status}}</view>
|
||||
<view class="detail-title">{{groupBuy.title}}</view>
|
||||
<view class="detail-price">¥{{groupBuy.priceCent / 100}}</view>
|
||||
<view wx:if="{{groupBuy.originPriceCent}}" class="origin-price">原价 ¥{{groupBuy.originPriceCent / 100}}</view>
|
||||
<view class="muted">{{groupBuy.description || '社区团购'}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="card">
|
||||
<view class="muted">数量</view>
|
||||
|
||||
<view class="delivery-panel">
|
||||
<view class="panel-label">自提点</view>
|
||||
<view class="panel-value">{{groupBuy.pickupAddress}}</view>
|
||||
<view class="muted">截单 {{groupBuy.endTime}}</view>
|
||||
</view>
|
||||
|
||||
<view class="purchase-card form-card">
|
||||
<view class="card-title form-title">团购下单</view>
|
||||
<view class="field-label">数量</view>
|
||||
<input class="input" type="number" value="{{form.quantity}}" bindinput="onQuantityChange" />
|
||||
<view class="muted">提货方式</view>
|
||||
<radio-group bindchange="onMethodChange">
|
||||
|
||||
<view class="field-label">提货方式</view>
|
||||
<radio-group class="radio-grid" bindchange="onMethodChange">
|
||||
<label class="radio"><radio value="SELF_PICKUP" checked="{{form.deliveryMethod === 'SELF_PICKUP'}}" />自提</label>
|
||||
<label class="radio"><radio value="IMMEDIATE" checked="{{form.deliveryMethod === 'IMMEDIATE'}}" />配送</label>
|
||||
</radio-group>
|
||||
|
||||
<view wx:if="{{form.deliveryMethod !== 'SELF_PICKUP'}}">
|
||||
<view class="muted">收货地址</view>
|
||||
<view class="field-label">收货地址</view>
|
||||
<picker mode="selector" range="{{addresses}}" range-key="detail" value="{{addressIndex}}" bindchange="onAddressChange">
|
||||
<view class="picker">{{addresses[addressIndex] ? addresses[addressIndex].building + ' ' + addresses[addressIndex].room + ' ' + addresses[addressIndex].detail : '请选择地址'}}</view>
|
||||
</picker>
|
||||
</view>
|
||||
|
||||
<view class="field-label">备注</view>
|
||||
<textarea class="textarea" placeholder="备注" bindinput="onRemarkInput" />
|
||||
<button class="primary" loading="{{submitting}}" bindtap="submit">提交团购订单</button>
|
||||
<button class="primary action-button" loading="{{submitting}}" bindtap="submit">提交团购订单</button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@@ -1,5 +1,91 @@
|
||||
.radio {
|
||||
display: block;
|
||||
height: 60rpx;
|
||||
line-height: 60rpx;
|
||||
.detail-page {
|
||||
padding-bottom: 60rpx;
|
||||
}
|
||||
|
||||
.detail-hero {
|
||||
overflow: hidden;
|
||||
margin-bottom: 18rpx;
|
||||
background: #ffffff;
|
||||
border: 1rpx solid #e4eaf0;
|
||||
border-radius: 16rpx;
|
||||
box-shadow: 0 8rpx 24rpx rgba(20, 36, 58, 0.05);
|
||||
}
|
||||
|
||||
.detail-cover {
|
||||
width: 100%;
|
||||
height: 360rpx;
|
||||
}
|
||||
|
||||
.detail-info {
|
||||
padding: 26rpx;
|
||||
}
|
||||
|
||||
.detail-title {
|
||||
margin-top: 14rpx;
|
||||
color: #111827;
|
||||
font-size: 40rpx;
|
||||
font-weight: 900;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.detail-price {
|
||||
margin-top: 16rpx;
|
||||
color: #c2410c;
|
||||
font-size: 44rpx;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.origin-price {
|
||||
margin-bottom: 12rpx;
|
||||
color: #94a3b8;
|
||||
font-size: 24rpx;
|
||||
text-decoration: line-through;
|
||||
}
|
||||
|
||||
.delivery-panel {
|
||||
padding: 22rpx;
|
||||
margin-bottom: 18rpx;
|
||||
background: #eff6ff;
|
||||
border: 1rpx solid #bfdbfe;
|
||||
border-radius: 16rpx;
|
||||
}
|
||||
|
||||
.panel-label {
|
||||
color: #1d4ed8;
|
||||
font-size: 22rpx;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.panel-value {
|
||||
margin: 8rpx 0;
|
||||
color: #111827;
|
||||
font-size: 30rpx;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.purchase-card {
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.form-title {
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.radio-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
gap: 12rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.radio {
|
||||
min-height: 72rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 14rpx;
|
||||
color: #334155;
|
||||
background: #f8fafc;
|
||||
border: 1rpx solid #e2e8f0;
|
||||
border-radius: 14rpx;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
@@ -1,14 +1,29 @@
|
||||
<view class="page">
|
||||
<view class="section-title">今日团购</view>
|
||||
<view wx:for="{{groupBuys}}" wx:key="id" class="card" bindtap="goDetail" data-id="{{item.id}}">
|
||||
<view class="row between">
|
||||
<view>
|
||||
<view>{{item.title}}</view>
|
||||
<view class="muted">截单 {{item.endTime}}</view>
|
||||
</view>
|
||||
<view class="price">¥{{item.priceCent / 100}}</view>
|
||||
</view>
|
||||
<view class="muted">库存 {{item.stock}} / 已售 {{item.soldCount}}</view>
|
||||
<view class="page-heading">
|
||||
<view class="heading-eyebrow">社区拼单</view>
|
||||
<view class="heading-title">今日团购</view>
|
||||
<view class="heading-subtitle">集中采购,邻里共享实惠</view>
|
||||
</view>
|
||||
<view wx:if="{{!groupBuys.length && !loading}}" class="card muted">暂无团购</view>
|
||||
|
||||
<view class="group-list">
|
||||
<view wx:for="{{groupBuys}}" wx:key="id" class="group-card" bindtap="goDetail" data-id="{{item.id}}">
|
||||
<image wx:if="{{item.coverUrl}}" class="group-cover" src="{{item.coverUrl}}" mode="aspectFill" />
|
||||
<view wx:else class="group-cover media-placeholder">团</view>
|
||||
<view class="group-body">
|
||||
<view class="row between">
|
||||
<view class="card-title">{{item.title}}</view>
|
||||
<view class="price">¥{{item.priceCent / 100}}</view>
|
||||
</view>
|
||||
<view class="muted">截单 {{item.endTime}}</view>
|
||||
<view class="stock-line">
|
||||
<view class="stock-track">
|
||||
<view class="stock-fill"></view>
|
||||
</view>
|
||||
<view class="muted">库存 {{item.stock}} / 已售 {{item.soldCount}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view wx:if="{{!groupBuys.length && !loading}}" class="empty-state">暂无团购</view>
|
||||
</view>
|
||||
|
||||
@@ -1,4 +1,51 @@
|
||||
.page-heading {
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.group-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 18rpx;
|
||||
}
|
||||
|
||||
.group-card {
|
||||
overflow: hidden;
|
||||
background: #ffffff;
|
||||
border: 1rpx solid #e4eaf0;
|
||||
border-radius: 16rpx;
|
||||
box-shadow: 0 8rpx 24rpx rgba(20, 36, 58, 0.05);
|
||||
}
|
||||
|
||||
.group-cover {
|
||||
width: 100%;
|
||||
height: 280rpx;
|
||||
}
|
||||
|
||||
.group-body {
|
||||
padding: 22rpx;
|
||||
}
|
||||
|
||||
.price {
|
||||
min-width: 120rpx;
|
||||
text-align: right;
|
||||
font-size: 34rpx;
|
||||
}
|
||||
|
||||
.stock-line {
|
||||
margin-top: 18rpx;
|
||||
}
|
||||
|
||||
.stock-track {
|
||||
height: 12rpx;
|
||||
overflow: hidden;
|
||||
margin-bottom: 12rpx;
|
||||
background: #edf2f7;
|
||||
border-radius: 999rpx;
|
||||
}
|
||||
|
||||
.stock-fill {
|
||||
width: 46%;
|
||||
height: 100%;
|
||||
background: #0f766e;
|
||||
border-radius: 999rpx;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user