From 87a645078b29407bc569368674ae9361808a7fdb Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=B5=B5=E6=AF=85?= <1335909236@qq.com> Date: Sat, 9 Aug 2025 17:08:11 +0800 Subject: [PATCH] =?UTF-8?q?=E5=B0=8F=E7=A8=8B=E5=BA=8F=E9=A6=96=E9=A1=B5?= =?UTF-8?q?=E4=BC=98=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- api/v2Home.js | 3 +- packages/localLife/index/index.vue | 4 +- pages/index/index.css | 425 +++++++++++++++++++++++- pages/index/index.vue | 506 +++++++++++++++++++++++++++-- 4 files changed, 896 insertions(+), 42 deletions(-) diff --git a/api/v2Home.js b/api/v2Home.js index 4cd47d0a..5831e864 100644 --- a/api/v2Home.js +++ b/api/v2Home.js @@ -1,5 +1,6 @@ export const apiArr = { - getCateList: "/api/v2/wechat/merchant-cate-crud/list", //小区房源列表 + getCateList: "/api/v2/wechat/merchant-cate-crud/list", //商家分类列表 + getMerchantList: "/api/v2/wechat/merchant-info-crud/page", //商家列表 getHomeBanner: "/api/v2/wechat/home-banner-region-crud/page", //获取首页banner及其广告 getButtonNum:"/api/v2/wechat/nav-display-crud/info",//获取首页button的行数 数量 getHomeButton:"/api/v2/wechat/home-button-region-crud/page", //获取首页button diff --git a/packages/localLife/index/index.vue b/packages/localLife/index/index.vue index 26345e97..45c74146 100644 --- a/packages/localLife/index/index.vue +++ b/packages/localLife/index/index.vue @@ -95,13 +95,13 @@ class="merchangtItem_tag" v-if="item.refund_property_fee_ratio" > - 买单反物业费 + 买单返物业费
- 买单反积分 + 买单返积分
diff --git a/pages/index/index.css b/pages/index/index.css index fac62716..f8f53c61 100644 --- a/pages/index/index.css +++ b/pages/index/index.css @@ -1,4 +1,3 @@ - .container { background-color: #f9f9f9; } @@ -101,8 +100,8 @@ page { } .icon-box image { - width: 70rpx; - height: 70rpx; + width: 90rpx; + height: 90rpx; } .function-item text { @@ -204,6 +203,57 @@ page { height: 100%; } +/* 广告横幅 */ +.serverList1 { + width: 100%; + height: 450rpx; + display: flex; + flex-wrap: wrap; + align-items: center; + justify-content: space-between; + background-color: #fff; + margin-top: 20rpx; + padding: 15rpx; +} + +.serverList1_left { + display: block; + width: 330rpx; + height: 450rpx; + margin-right: 17rpx; +} + +.serverList1_left image { + height: 450rpx; + width: 330rpx; + object-fit: cover; + border-radius: 20rpx; +} + +.serverList1_right { + width: 400rpx; + height: 450rpx; +} + +.serverItemRight1 { + width: 365rpx; + height: 220rpx; +} + +.serverItemRight1 image { + border-radius: 20rpx; +} + +.serverItemRight2 { + width: 365rpx; + height: 220rpx; + margin-top: 10rpx; +} + +.serverItemRight2 image { + border-radius: 20rpx; +} + .Tit { display: flex; align-items: center; @@ -384,4 +434,373 @@ page { color: #999999; margin: 65rpx auto; text-align: center; +} + +/* 分类标签栏样式 */ +.category-tabs { + background-color: #fff; + border-radius: 10rpx; + margin-top: 20rpx; + box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05); + overflow: hidden; + position: relative; +} + +.tabs-container { + display: flex; + padding: 0 20rpx; + position: relative; + align-items: center; +} + +.tabs-scroll { + height: 50rpx; + display: flex; + overflow-x: auto; + padding: 20rpx 0; + scrollbar-width: none; + -ms-overflow-style: none; +} + +.tabs-scroll::-webkit-scrollbar { + display: none; +} + +.tab-item { + padding: 0 20rpx; + margin-right: 20rpx; + font-size: 20rpx; + color: #333; + background-color: #ededed; + height: 50rpx; + line-height: 50rpx; + white-space: nowrap; + border-radius: 10rpx; +} + +.tab-item.activeTab { + color: #ff6700; + background-color: #fff3e0; +} + +.dropdown-btn { + width: 50rpx; + height: 50rpx; + display: flex; + align-items: center; + justify-content: center; + margin-left: 10rpx; +} + +.dropdown-icon { + width: 50rpx; + height: 50rpx; + align-items: center; + transition: transform 0.3s ease; +} + +.dropdown-icon.active { + transform: rotate(180deg); +} + +/* 下拉分类列表样式 */ +.category-dropdown { + background-color: #fff; + border-radius: 0 0 10rpx 10rpx; + box-shadow: 0 5rpx 15rpx rgba(0, 0, 0, 0.1); + padding: 20rpx; + /* position: absolute; */ + z-index: 99; + width: 95%; + left: 0; + top: 88rpx; +} + +.dropdown-title { + font-size: 28rpx; + font-weight: bold; + color: #333; + margin-bottom: 20rpx; + padding-bottom: 15rpx; + border-bottom: 1rpx solid #eee; +} + +.review-btn { + width: 80rpx; + height: 50rpx; + background-color: #ff6700; + color: #fff; + font-size: 26rpx; + text-align: center; + line-height: 50rpx; + border-radius: 8rpx; + margin-right: 10rpx; + align-self: center; +} + +.category-grid { + display: grid; + grid-template-columns: repeat(4, 1fr); + gap: 20rpx; +} + +.category-grid-item { + padding: 20rpx; + text-align: center; + font-size: 24rpx; + color: #666; + background-color: #f5f5f5; + border-radius: 8rpx; +} + +.category-grid-item.activeTab { + color: #ff6700; + background-color: #fff3e0; + font-weight: bold; +} + +/* 店铺列表样式 */ +.store-list-container { + background-color: #fff; + border-radius: 10rpx; + padding: 20rpx; + box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05); + position: relative; +} + +.overlay { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-color: rgba(0, 0, 0, 0.5); + z-index: 98; +} + + +.store-item { + display: flex; + padding: 20rpx 0; + border-bottom: 1rpx solid #f0f0f0; +} + +.store-item:last-child { + border-bottom: none; +} + +.store-image { + width: 180rpx; + height: 180rpx; + border-radius: 10rpx; + margin-right: 20rpx; + overflow: hidden; +} + +.store-image image { + width: 100%; + height: 100%; + object-fit: cover; +} + +.store-info { + flex: 1; + display: flex; + flex-direction: column; + justify-content: space-between; +} + +.store-name { + font-size: 32rpx; + color: #333; + font-weight: bold; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.store-rating { + display: flex; + align-items: center; + margin: 10rpx 0; +} + +.star-icon { + width: 24rpx; + height: 24rpx; + margin-right: 5rpx; +} + +.rating-text { + font-size: 26rpx; + color: #ffb400; + margin-left: 5rpx; +} + +.store-tags { + display: flex; + flex-wrap: wrap; + margin-bottom: 10rpx; +} + +.tag { + background-color: #f5f5f5; + color: #666; + font-size: 24rpx; + padding: 5rpx 15rpx; + border-radius: 15rpx; + margin-right: 10rpx; + margin-bottom: 10rpx; +} + +.store-address { + font-size: 26rpx; + color: #999; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + display: flex; + align-items: center; +} + +.address-icon { + width: 24rpx; + height: 24rpx; + margin-right: 5rpx; +} + +.store-distance { + font-size: 26rpx; + color: #999; + margin-top: 5rpx; + display: flex; + align-items: center; +} + +.distance-icon { + width: 24rpx; + height: 24rpx; + margin-right: 5rpx; +} + +.merchantList { + padding: 0 20rpx; + width: 100%; + box-sizing: border-box; +} + +.merchantItem { + display: flex; + padding-top: 30px; + padding-bottom: 30rpx; + border-bottom: 1rpx solid #EBEBEB; + ; +} + +.merchantItem_left { + width: 180rpx; + height: 180rpx; + border-radius: 20rpx 20rpx 20rpx 20rpx; + overflow: hidden; + margin-right: 24rpx; +} + +.merchantItem_left image { + width: 100%; + height: 100%; +} + +.merchantItem_right { + flex: 1; +} + +.merchantItem_right_tit { + display: flex; + align-items: center; + justify-content: space-between; +} + +.merchantItem_right_tit_left { + font-size: 30rpx; + color: #222222; +} + +.merchantItem_right_tit_right { + font-size: 24rpx; + color: #555555; +} + +.merchantItem_right_con { + margin-top: 14rpx; + display: flex; + align-items: center; + justify-content: space-between; +} + +.merchangtItem_tag { + font-size: 22rpx; + color: #555555; + padding: 5rpx 12rpx; + white-space: nowrap; + background: rgba(255, 81, 42, 0.1); + border-radius: 100rpx 100rpx 100rpx 100rpx; + display: inline-block; + margin-top: 20rpx; + margin-right: 10rpx; +} + +.startList { + display: flex; + align-items: center; +} + +.startList image { + width: 22rpx; + height: 22rpx; + margin-right: 3rpx; +} + +.merchantItem_right_con_right { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + font-size: 26rpx; + color: #000000; + +} + +.merchantItem_right_con_right image { + width: 32rpx; + height: 28.59rpx; + margin-bottom: 6rpx; +} + +.merchantItem_right_add { + font-size: 24rpx; + color: #999999; + margin-top: 14rpx; +} + +/* 加载更多样式 */ +.loading { + display: inline-block; + width: 30rpx; + height: 30rpx; + border: 3rpx solid #f3f3f3; + border-top: 3rpx solid #3498db; + border-radius: 50%; + animation: spin 1s linear infinite; + margin-right: 10rpx; + vertical-align: middle; +} + +@keyframes spin { + 0% { + transform: rotate(0deg); + } + + 100% { + transform: rotate(360deg); + } } \ No newline at end of file diff --git a/pages/index/index.vue b/pages/index/index.vue index e7c5e977..7060079e 100644 --- a/pages/index/index.vue +++ b/pages/index/index.vue @@ -10,24 +10,23 @@ - - +
- +
店铺管理
- +
- +
供应商订单
- +
物业管理
@@ -72,6 +71,20 @@
+ + + + + + + + + + + + + 定位错误 未知区域 @@ -79,7 +92,6 @@ 公积金补贴商户 - @@ -88,8 +100,6 @@ - - @@ -98,13 +108,124 @@ - 商户申请入驻 + - + + + + + + + {{ item.cate_name }} + + + + + + + + + + + 商品分类 + + + {{ item.cate_name }} + + + + + + +
+
+
+ +
+
+
+
+ {{ item.merchant_name }} +
+
+ {{ item.distances }} +
+
+
+
+
+ +
+
+ 买单返物业费 +
+
+ 买单返积分 +
+
+
+ + 点评 +
+
+
+ {{ item.comAddress }} +
+
+
+
+ 下拉加载后续10条,共计{{ bottomTotal }}条
@@ -114,7 +235,8 @@