From 98291a4ab871ed9e5088dbf28da9e12c4e01d175 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=82=9D=E5=86=9B=E5=8D=8E?= Date: Sat, 8 Mar 2025 23:54:59 +0800 Subject: [PATCH] =?UTF-8?q?=E6=A0=B7=E5=BC=8F=E8=B0=83=E6=95=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- pages.json | 4 +- pages/cart/cart.vue | 10 +-- pages/cart/style.scss | 116 +++++++++---------------- pages/classify/classify.vue | 5 +- pages/classify/style.scss | 18 ++-- pages/index/index.vue | 15 +--- pages/index/style.scss | 86 ++++++++++++------ pages/sidedish/sidedish.vue | 2 +- pages/sidedish/style.scss | 8 +- pages/user/style.scss | 2 +- shopProDetail/detail/detail.vue | 33 +++++-- shopProDetail/detail/style.scss | 57 +++++++++++- static/{index => }/location.png | Bin static/{index => }/location_active.png | Bin store/counter.js | 9 +- 15 files changed, 212 insertions(+), 153 deletions(-) rename static/{index => }/location.png (100%) rename static/{index => }/location_active.png (100%) diff --git a/pages.json b/pages.json index 271bfee..1cd587c 100644 --- a/pages.json +++ b/pages.json @@ -20,7 +20,7 @@ { "path": "pages/sidedish/sidedish", "style": { - "navigationBarTitleText": "帮你配", + "navigationBarTitleText": "帮您配", "navigationBarBackgroundColor": "#F6F6F6", "enablePullDownRefresh": true } @@ -63,7 +63,7 @@ }, { "pagePath": "pages/sidedish/sidedish", - "text": "帮你配", + "text": "帮您配", "iconPath": "static/tabBar/sidedish.png", "selectedIconPath": "static/tabBar/sidedish_active.png" }, diff --git a/pages/cart/cart.vue b/pages/cart/cart.vue index 64cd2e7..afbd02f 100644 --- a/pages/cart/cart.vue +++ b/pages/cart/cart.vue @@ -2,11 +2,7 @@ - - - 上海体育中心 - - + 东方体育中心 购物车 @@ -308,10 +304,8 @@ import { useCounterStore } from '@/store/counter'; // 引入 Pinia Store import { storeToRefs } from 'pinia';//实现解构付值 import { onLoad,onShow,onPullDownRefresh,onReachBottom } from "@dcloudio/uni-app" const counterStore = useCounterStore(); // 使用 Store -const statusHeight = ref(uni.getMenuButtonBoundingClientRect()['height']) -const headerHeight = ref(uni.getSystemInfoSync()['statusBarHeight']) //使用pinia：storeToRefs方法包裹(保持响应式更新，不使用视图无法更新) -//const { count,doubleCount } = storeToRefs(counterStore); +const {statusHeight,headerHeight } = storeToRefs(counterStore); const goDetail= ()=>{ uni.navigateTo({ url:`/shopProDetail/detail/detail` diff --git a/pages/cart/style.scss b/pages/cart/style.scss index c604302..344eb7b 100644 --- a/pages/cart/style.scss +++ b/pages/cart/style.scss @@ -14,26 +14,48 @@ page{ display: flex; align-items: center; height: 45px; - .location_img{ - width: 18px; - height: 18px; - margin: 0px 2px 0px 10px; - } + position: relative; .location_title{ font-size: 28rpx; - color: #333333; + color: #FFFFFF; font-weight: 500; + vertical-align: middle; + display: inline-block; } - .location_arrow_down{ - width: 0; - height: 0; - border-left: 10rpx solid transparent; - border-right: 10rpx solid transparent; - border-top: 11rpx solid #333333; - margin-left: 2px; - margin-top: 1px; + } + .head_location::before{ + content: ""; + vertical-align: middle; + display: inline-block; + width: 21px; + height: 21px; + background-image: url('../../static/location.png'); + background-size: cover; + margin: 0px 2px 0px 10px; + } + .head_location::after{ + vertical-align: middle; + display: inline-block; + content: ""; + width: 0; + height: 0; + border-left: 10rpx solid transparent; + border-right: 10rpx solid transparent; + border-top: 11rpx solid #FFFFFF; + margin-left: 3px; + margin-top: 1.5px; + } + .head_location_active{ + .location_title{ + color: #000000; } } + .head_location_active::before{ + background-image: url('../../static/location_active.png'); + } + .head_location_active::after{ + border-top: 11rpx solid #000000; + } .head_ul{ display: flex; align-items: center; @@ -122,58 +144,6 @@ page{ font-size: 24rpx; color: #FF2D41; } - - } - .cart_scroll{ - width: 620rpx; - display: flex; - overflow: hidden; - white-space: nowrap; - .cart_scroll_ul{ - .cart_scroll_li{ - width: 180rpx; - display: inline-block; - margin-right: 20rpx; - .cart_scroll_img{ - background: #FFFFFF; - border-radius: 4rpx; - border: 1rpx solid #F3F3F3; - width: 180rpx; - height: 180rpx; - overflow: hidden; - .cart_scroll_img_url{ - width: 180rpx; - height: 180rpx; - display: block; - } - } - .cart_scroll_title{ - color: #333333; - font-size: 26rpx; - font-weight: 500; - white-space: break-spaces; - text-overflow: ellipsis; - -webkit-box-orient: vertical; - display: -webkit-box; - -webkit-line-clamp: 2; - overflow: hidden; - overflow-wrap: break-word; - margin-top: 20rpx; - } - .cart_scroll_price{ - font-size: 34rpx; - color: #FF0000; - font-weight: 500; - margin-top: 20rpx; - } - .cart_scroll_market_name{ - color: #999999; - font-size: 28rpx; - text-decoration: line-through; - font-weight: 400; - } - } - } } } .cart_items{ @@ -212,7 +182,7 @@ page{ .cart_scroll_img{ background: #FFFFFF; border-radius: 10rpx; - border: 1rpx solid #F3F3F3; + // border: 1rpx solid #F3F3F3; width: 180rpx; height: 180rpx; overflow: hidden; @@ -328,10 +298,6 @@ page{ } } } - - - - } .user_title{ display: flex; @@ -369,7 +335,7 @@ page{ } // 商品区域样式 .shop_view{ - margin-top: 48rpx; + margin-top: 10rpx; padding: 13rpx 20rpx 0rpx 20rpx; display: flex; justify-content: space-between; @@ -535,7 +501,7 @@ page{ margin-right: 15rpx; } .footer_price{ - font-size: 43rpx; + font-size: 38rpx; color: #FF0000; display: inline-block; font-weight: 500; @@ -561,10 +527,6 @@ page{ } } } - - - - .price::before { content: '¥'; font-size: 24rpx; diff --git a/pages/classify/classify.vue b/pages/classify/classify.vue index 2922413..773ac55 100644 --- a/pages/classify/classify.vue +++ b/pages/classify/classify.vue @@ -3,7 +3,6 @@ - @@ -185,9 +184,7 @@ import { storeToRefs } from 'pinia';//实现解构付值 import { onLoad,onShow,onPullDownRefresh,onReachBottom } from "@dcloudio/uni-app" const counterStore = useCounterStore(); // 使用 Store //使用pinia：storeToRefs方法包裹(保持响应式更新，不使用视图无法更新) -//const { count,doubleCount } = storeToRefs(counterStore); -const statusHeight = ref(uni.getMenuButtonBoundingClientRect()['height']) -const headerHeight = ref(uni.getSystemInfoSync()['statusBarHeight']) +const {statusHeight,headerHeight } = storeToRefs(counterStore); const ScrollLeft = ref(0); const goDetail= ()=>{ uni.navigateTo({ diff --git a/pages/classify/style.scss b/pages/classify/style.scss index e58cc19..ea2e985 100644 --- a/pages/classify/style.scss +++ b/pages/classify/style.scss @@ -21,17 +21,21 @@ page{ font-size: 28rpx; color: #000000; justify-content: space-between; - .head_search_img{ - width: 23px; - height: 23px; - margin-left: 13px; - display: block; - } .head_search_input{ width: 500rpx; height: 100%; margin-left: 10px; - font-size: 26rpx; + font-size: 28rpx; + display: flex; + align-items: center; + } + .head_search_input::before{ + content: ""; + background-image: url('../../static/search_img.png'); + background-size: cover; + width: 20px; + height: 20px; + margin-right: 13rpx; } } .head_class{ diff --git a/pages/index/index.vue b/pages/index/index.vue index 12a9134..7afb3e4 100644 --- a/pages/index/index.vue +++ b/pages/index/index.vue @@ -2,15 +2,9 @@ - - - 未获取到定位 - - - - + 东方体育中心 + - 搜索 @@ -302,11 +296,10 @@ import { storeToRefs } from 'pinia';//实现解构付值 import { onLoad,onShow,onPullDownRefresh,onReachBottom } from "@dcloudio/uni-app" const counterStore = useCounterStore(); // 使用 Store //使用pinia：storeToRefs方法包裹(保持响应式更新，不使用视图无法更新) -// const { count,doubleCount } = storeToRefs(counterStore); +const {statusHeight,headerHeight } = storeToRefs(counterStore); //使用pinia：方法还是从原来的counterStore中解构赋值 const { clickSType } = counterStore; -const statusHeight = ref(uni.getMenuButtonBoundingClientRect()['height']) -const headerHeight = ref(uni.getSystemInfoSync()['statusBarHeight']) + const goDetail= ()=>{ uni.navigateTo({ url:`/shopProDetail/detail/detail` diff --git a/pages/index/style.scss b/pages/index/style.scss index b868c09..04ec004 100644 --- a/pages/index/style.scss +++ b/pages/index/style.scss @@ -20,26 +20,48 @@ page{ display: flex; align-items: center; height: 45px; - .location_img{ - width: 18px; - height: 18px; - margin: 0px 2px 0px 10px; - } + position: relative; .location_title{ + vertical-align: middle; + display: inline-block; font-size: 28rpx; color: #FFFFFF; font-weight: 500; } - .location_arrow_down{ - width: 0; - height: 0; - border-left: 10rpx solid transparent; - border-right: 10rpx solid transparent; - border-top: 11rpx solid #FFFFFF; - margin-left: 2px; - margin-top: 1px; + } + .head_location::before{ + content: ""; + vertical-align: middle; + display: inline-block; + width: 21px; + height: 21px; + background-image: url('../../static/location.png'); + background-size: cover; + margin: 0px 2px 0px 10px; + } + .head_location::after{ + vertical-align: middle; + display: inline-block; + content: ""; + width: 0; + height: 0; + border-left: 10rpx solid transparent; + border-right: 10rpx solid transparent; + border-top: 11rpx solid #FFFFFF; + margin-left: 3px; + margin-top: 1.5px; + } + .head_location_active{ + .location_title{ + color: #000000; } } + .head_location_active::before{ + background-image: url('../../static/location_active.png'); + } + .head_location_active::after{ + border-top: 11rpx solid #000000; + } .head_search{ margin:0rpx 10px 0rpx 10px;; display: flex; @@ -50,22 +72,21 @@ page{ font-size: 28rpx; color: #000000; justify-content: space-between; - .head_search_img{ - width: 20px; - height: 20px; - margin-left: 13px; - display: block; - } .head_search_input{ - width: 500rpx; + width: 560rpx; height: 100%; margin-left: 10px; - font-size: 26rpx; + font-size: 28rpx; + display: flex; + align-items: center; } - .head_search_border{ - height: 15px; - width: 1px; - background-color: #D9D9D9; + .head_search_input::before{ + content: ""; + background-image: url('../../static/search_img.png'); + background-size: cover; + width: 20px; + height: 20px; + margin-right: 13rpx; } .head_search_btn{ width: 120rpx; @@ -74,6 +95,19 @@ page{ align-items: center; justify-content: center; } + .head_search_btn::before{ + content: ""; + width: 1rpx; + height: 60%; + background-color:#D9D9D9; + margin-right: 20rpx; + } + .head_search_btn::after{ + content: ""; + width: 1rpx; + height: 60%; + margin-left: 20rpx; + } } } // 推荐区域样式 @@ -439,7 +473,7 @@ page{ .footer_cont_m{ margin-left: 25rpx; .footer_cont_m_price{ - font-size: 43rpx; + font-size: 38rpx; color: #FF0000; font-weight: 500; } diff --git a/pages/sidedish/sidedish.vue b/pages/sidedish/sidedish.vue index 4750217..5c57f9c 100644 --- a/pages/sidedish/sidedish.vue +++ b/pages/sidedish/sidedish.vue @@ -24,7 +24,7 @@ - 鲜花人气帮 + 鲜花人气榜 diff --git a/pages/sidedish/style.scss b/pages/sidedish/style.scss index 7d58c6e..08414a4 100644 --- a/pages/sidedish/style.scss +++ b/pages/sidedish/style.scss @@ -67,8 +67,8 @@ page{ display: flex; align-items: center; .content_head_img{ - width: 38rpx; - height: 38rpx; + width: 32rpx; + height: 32rpx; display: block; margin-right: 10rpx; } @@ -155,10 +155,10 @@ page{ margin-top: 10rpx; .content_shop_item_l{ .content_shop_item_price{ - font-size: 32rpx; + font-size: 28rpx; color: #FF0000; font-weight: 500; - line-height: 38rpx; + line-height: 35rpx; } .content_shop_market{ font-size: 23rpx; diff --git a/pages/user/style.scss b/pages/user/style.scss index 2d24a25..49f41ec 100644 --- a/pages/user/style.scss +++ b/pages/user/style.scss @@ -184,7 +184,7 @@ page{ } // 商品区域样式 .shop_view{ - margin-top: 48rpx; + margin-top: 10rpx; padding: 13rpx 20rpx 0rpx 20rpx; display: flex; justify-content: space-between; diff --git a/shopProDetail/detail/detail.vue b/shopProDetail/detail/detail.vue index 1d064fe..abdb0bf 100644 --- a/shopProDetail/detail/detail.vue +++ b/shopProDetail/detail/detail.vue @@ -1,5 +1,10 @@