zoujing/YGChatCS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 组件的点击事件的热区优化

Browse Source
This commit is contained in:
zoujing
2025-08-10 20:44:40 +08:00
parent 59a4f5827f
commit 16b8885eb1
5 changed files with 121 additions and 113 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
pages/module/booking/QuickBookingContentList.vue
View File

@@ -2,30 +2,32 @@
<view class="container">
<ModuleTitle :title="commodityDTO.title" />
<view class="container-scroll">
<view class="mk-card-item" v-for="(item, index) in commodityDTO.commodityList" :key="`${item.commodityId}-${index}`">
<!-- <view class="card-badge">超值推荐</view> -->
<image class="card-img" :src="item.commodityIcon" mode="aspectFill" />
<view class="card-content">
<view class="card-title-column">
<text class="card-title">{{ item.commodityName }}</text>
<view class="card-tags" v-for="(tag) in item.commodityTradeRuleList" :key="tag">
<text class="card-tag">{{ tag }}</text>
</view>
</view>
<template v-for="(serviceItem, index) in item.commodityServices" :key="serviceItem.serviceTitle">
<view v-if="index < 3" class="card-desc">· {{ serviceItem.serviceTitle }}</view>
</template>
<view class="card-bottom-row">
<view class="card-price-row">
<text class="card-price-fu">￥</text>
<text class="card-price">{{ item.commodityPrice }}</text>
<text class="card-unit">/人</text>
</view>
<view v-for="(item, index) in commodityDTO.commodityList" :key="`${item.commodityId}-${index}`">
<view class="mk-card-item" @click="placeOrderHandle(item)">
<!-- <view class="card-badge">超值推荐</view> -->
<image class="card-img" :src="item.commodityIcon" mode="aspectFill" />
<view class="card-content">
<view class="card-title-column">
<text class="card-title">{{ item.commodityName }}</text>
<view class="card-tags" v-for="(tag) in item.commodityTradeRuleList" :key="tag">
<text class="card-tag">{{ tag }}</text>
</view>
</view>
<template v-for="(serviceItem, index) in item.commodityServices" :key="serviceItem.serviceTitle">
<view v-if="index < 3" class="card-desc">· {{ serviceItem.serviceTitle }}</view>
</template>
<view class="card-bottom-row">
<view class="card-price-row">
<text class="card-price-fu">￥</text>
<text class="card-price">{{ item.commodityPrice }}</text>
<text class="card-unit">/人</text>
</view>
<text class="card-btn" @click="placeOrderHandle(item)">下单</text>
</view>
</view>
</view>
<text class="card-btn">下单</text>
</view>
</view>
</view>
</view>
</view>
</view>
</template>

1
pages/module/detail/DetailCardCompontent.vue
View File

@@ -30,6 +30,7 @@
<style scoped lang="scss">
.container {
width: 100%;
padding: 12px 0;
}
</style>

49
pages/module/detail/DetailCardGoodsContentList.vue
View File

@@ -2,29 +2,30 @@
<view class="container">
<ModuleTitle title="相关商品" />
<view class="container-scroll">
<view class="mk-card-item" v-for="(item, index) in commodityList" :key="`${item.commodityId}-${index}`">
<image class="card-img" :src="item.commodityPhoto" mode="aspectFill" />
<view class="card-content">
<view class="card-title-column">
<text class="card-title">{{ item.commodityName }}</text>
<view class="card-tags" v-for="(tag) in item.commodityTradeRuleList" :key="tag">
<text class="card-tag">{{ tag }}</text>
</view>
</view>
<template v-for="(serviceItem, index) in item.commodityServices" :key="serviceItem.serviceTitle">
<view v-if="index < 3" class="card-desc">· {{ serviceItem.serviceTitle }}</view>
</template>
<view class="card-bottom-row">
<view class="card-price-row">
<text class="card-price-fu">￥</text>
<text class="card-price">{{ item.specificationPrice }}</text>
<text class="card-unit">/人</text>
</view>
<text class="card-btn" @click="placeOrderHandle(item)">下单</text>
</view>
</view>
</view>
<view v-for="(item, index) in commodityList" :key="`${item.commodityId}-${index}`">
<view class="mk-card-item" @click="placeOrderHandle(item)">
<image class="card-img" :src="item.commodityPhoto" mode="aspectFill" />
<view class="card-content">
<view class="card-title-column">
<text class="card-title">{{ item.commodityName }}</text>
<view class="card-tags" v-for="(tag) in item.commodityTradeRuleList" :key="tag">
<text class="card-tag">{{ tag }}</text>
</view>
</view>
<template v-for="(serviceItem, index) in item.commodityServices" :key="serviceItem.serviceTitle">
<view v-if="index < 3" class="card-desc">· {{ serviceItem.serviceTitle }}</view>
</template>
<view class="card-bottom-row">
<view class="card-price-row">
<text class="card-price-fu">￥</text>
<text class="card-price">{{ item.specificationPrice }}</text>
<text class="card-unit">/人</text>
</view>
<text class="card-btn">下单</text>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
@@ -50,7 +51,7 @@
<style lang="scss" scoped>
.container {
margin-bottom: 8px 0;
margin: 6px 0 0;
.container-scroll {
display: flex;

10
pages/module/discovery/DiscoveryCradContentList.vue
View File

@@ -2,10 +2,12 @@
<view class="container">
<ModuleTitle :title="recommendTheme.themeName" />
<view class="container-scroll">
<view class="mk-card-item" v-for="(item, index) in recommendTheme.recommendPostsList" :key="index" @click="sendReply(item)">
<image :src="item.coverPhoto" mode="widthFix"></image>
<text>{{ item.topic }}</text>
</view>
<view v-for="(item, index) in recommendTheme.recommendPostsList" :key="index">
<view class="mk-card-item" @click="sendReply(item)">
<image :src="item.coverPhoto" mode="widthFix"></image>
<text>{{ item.topic }}</text>
</view>
</view>
</view>
</view>
</template>

14
pages/module/recommend/RecommendPostsList.vue
View File

@@ -2,12 +2,14 @@
<view class="container">
<ModuleTitle :title="recommendTheme.themeName" />
<view class="container-scroll">
<view class="mk-card-item" v-for="(item, index) in recommendTheme.recommendPostsList" :key="index" @click="sendReply(item)">
<image :src="item.coverPhoto" mode="aspectFill"></image>
<view class="overlay-gradient">
<text class="overlay-text">{{ item.topic }}</text>
</view>
</view>
<view v-for="(item, index) in recommendTheme.recommendPostsList" :key="index">
<view class="mk-card-item" @click="sendReply(item)">
<image :src="item.coverPhoto" mode="aspectFill"></image>
<view class="overlay-gradient">
<text class="overlay-text">{{ item.topic }}</text>
</view>
</view>
</view>
</view>
</view>
</template>