style: 权益详情页地址距离并入景区信息卡片,样式对齐门店详情页
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Fable 5
parent
4be46bcb79
commit
1521129d87
+22
-11
@@ -1,8 +1,9 @@
|
||||
<template>
|
||||
<view class="page">
|
||||
<view v-if="detail">
|
||||
<!-- 门店信息卡片 -->
|
||||
<!-- 门店信息卡片(信息+地址合并容器) -->
|
||||
<view class="store-card">
|
||||
<view class="store-main">
|
||||
<image class="store-img" :src="detail.shopImage" mode="aspectFill" />
|
||||
<view class="store-info">
|
||||
<text class="store-name">{{ detail.shopName }}</text>
|
||||
@@ -10,8 +11,7 @@
|
||||
<text class="store-hours">营业时间:{{ detail.businessTime }}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 地址行 -->
|
||||
<view class="divider"></view>
|
||||
<view class="address-row">
|
||||
<text class="address-text">{{ detail.address }}</text>
|
||||
<view class="distance-row" v-if="detail.distance !== null">
|
||||
@@ -19,6 +19,7 @@
|
||||
<text class="distance-text">{{ detail.distance < 1 ? Math.round(detail.distance * 1000) + 'm' : Math.round(detail.distance) + 'km' }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 选择预约日期 -->
|
||||
<view class="date-section" v-if="detail.isAppointment && detail.dates && detail.dates.length > 0">
|
||||
@@ -180,12 +181,17 @@ export default {
|
||||
}
|
||||
</style>
|
||||
<style scoped lang="less">
|
||||
/* 门店卡片 */
|
||||
/* 门店卡片(信息+地址合并容器,样式与门店详情页一致) */
|
||||
.store-card {
|
||||
display: flex;
|
||||
background-color: #ffffff;
|
||||
margin:0rpx 12px 12px 12px;
|
||||
margin: 0 12px 12px 12px;
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.store-main {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
padding: 12px;
|
||||
gap: 12px;
|
||||
}
|
||||
@@ -201,8 +207,8 @@ export default {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
gap: 6px;
|
||||
justify-content: flex-start;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.store-name {
|
||||
@@ -221,13 +227,18 @@ export default {
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
/* 地址行 */
|
||||
.divider {
|
||||
height: 1px;
|
||||
background-color: #f2f2f7;
|
||||
margin: 0 12px;
|
||||
}
|
||||
|
||||
/* 地址行(卡片内) */
|
||||
.address-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
background-color: #ffffff;
|
||||
padding: 12px 16px;
|
||||
padding: 12px;
|
||||
}
|
||||
|
||||
.address-text {
|
||||
|
||||
Reference in New Issue
Block a user