diff --git a/packages/homeServer/classify/index.css b/packages/homeServer/classify/index.css new file mode 100644 index 00000000..fb0293dc --- /dev/null +++ b/packages/homeServer/classify/index.css @@ -0,0 +1,175 @@ +.container { + height: 95vh; +} + +/* 位置和搜索样式 */ +#local { + height: 30rpx; + width: 28.08rpx; + margin-right: 17rpx; +} + +.location-search { + display: flex; + padding: 16rpx 30rpx; + /* background-color: #f5f7fb; */ + border-radius: 60rpx; + gap: 16rpx; + height: 35rpx; + margin-top: 15rpx; + align-items: center; +} + +.location { + display: flex; + align-items: center; + gap: 8rpx; + padding-right: 16rpx; +} + +.location-text { + font-size: 26rpx; + color: #333; +} + +.arrow-down { + width: 24rpx; + height: 24rpx; +} + +.search-box { + flex: 1; + display: flex; + align-items: center; + gap: 12rpx; + background-color: #f5f7fb; + border-radius: 60rpx; + padding: 15rpx 24rpx; +} + +.search-icon { + width: 25rpx; + height: 25rpx; + margin-right: 5rpx; +} + +.search-placeholder { + font-size: 26rpx; + color: #999; +} + +.main { + margin-top: 20rpx; + display: flex; + height: calc(100vh - 20rpx); +} + +.left-menu { + width: 200rpx; + height: 100%; + background-color: #f5f7fb; + border-right: 1rpx solid #eee; +} + +.menu-scroll { + height: 100%; +} + +.menu-item { + height: 100rpx; + line-height: 100rpx; + text-align: center; + font-size: 28rpx; + color: #333; + position: relative; +} + +.menu-item.active { + background-color: #fff; + color: #333; +} + +.menu-item.active::before { + content: ''; + position: absolute; + left: 0; + top: 0; + width: 8rpx; + height: 100%; +} + +.right-content { + flex: 1; + height: 100%; + padding: 20rpx; + box-sizing: border-box; +} + +.content-scroll { + height: 100%; +} + +.content-img{ + height: 200rpx; + border-radius: 20rpx; +} + +.content-section { + margin-bottom: 30rpx; +} + +.section-text{ + margin-right: 10rpx; + color: #ed3d16; +} + +.section-title { + height: 80rpx; + line-height: 80rpx; + font-size: 28rpx; + font-weight: bold; + color: #333; + border-bottom: 1rpx solid #eee; +} + +.section-content { + padding: 20rpx 0; +} + +.service-category { + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 20rpx; + padding: 20rpx; + background-color: #fff; + margin-bottom: 20rpx; +} + +.category-item { + display: flex; + flex-direction: column; + align-items: center; +} + +.category-icon { + width: 80rpx; + height: 80rpx; + margin-bottom: 12rpx; +} + +.category-name { + font-size: 24rpx; + color: #333; +} + +.content-item { + height: 150rpx; + margin-bottom: 20rpx; + background-color: #f9f9f9; + border-radius: 10rpx; + display: flex; + align-items: center; + justify-content: center; + font-size: 28rpx; + color: #666; +} \ No newline at end of file diff --git a/packages/homeServer/classify/index.vue b/packages/homeServer/classify/index.vue new file mode 100644 index 00000000..47e932fb --- /dev/null +++ b/packages/homeServer/classify/index.vue @@ -0,0 +1,155 @@ + + + + + \ No newline at end of file diff --git a/packages/homeServer/index/index.css b/packages/homeServer/index/index.css index e60cc3db..1af355ac 100644 --- a/packages/homeServer/index/index.css +++ b/packages/homeServer/index/index.css @@ -36,7 +36,6 @@ background-color: #f5f7fb; border-radius: 60rpx; gap: 16rpx; - display: flex; height: 35rpx; margin-top: 15rpx; } @@ -117,13 +116,23 @@ border-radius: 15rpx; } +.announcement-flex { + display: flex; + align-items: center; +} + .announcement-title { font-size: 28rpx; font-weight: bold; color: #FF512A; } -.hrStyle{ +.announcement-img { + width: 25rpx; + height: 30rpx; +} + +.hrStyle { margin: 0 15rpx; color: #c5c5c5; } @@ -156,68 +165,48 @@ width: 100%; } - .serverList { - display: flex; - flex-wrap: wrap; - align-items: center; - justify-content: space-between; + display: flex; + flex-wrap: wrap; + align-items: center; + justify-content: space-between; } .serverItem { - border-radius: 30rpx; - width: 208rpx; - height: 114rpx; - box-sizing: border-box; - padding-top: 11rpx; - padding-left: 13rpx; - font-weight: 600; - font-size: 26rpx; - color: #222222; - position: relative; - margin-bottom: 12rpx; + border-radius: 30rpx; + box-sizing: border-box; + font-weight: 600; + font-size: 26rpx; + color: #222222; + position: relative; + margin-bottom: 12rpx; } + .serverList_left { - display: block; - width: 260rpx; - height: 369rpx; - margin-right: 17rpx; - + display: block; + width: 260rpx; + height: 350rpx; + margin-right: 17rpx; + border-radius: 30rpx; } -.serverList_left swiper{ - height: 100%; +.serverList_left image { + height: 100%; } .serverList_right { - flex: 1; - display: flex; - flex-wrap: wrap; + width: 445rpx; + height: 350rpx; } .serverItem1 { - background: linear-gradient(139deg, #FEF4F4 0%, #FEDCD2 100%); - margin-right: 12rpx; + width: 440rpx; + height: 170rpx; } .serverItem2 { - background: #FFF4E5; -} - -.serverItem1 image { - position: absolute; - right: 12rpx; - top: 14rpx; - width: 103rpx; - height: 100rpx; -} - -.serverItem2 image { - position: absolute; - right: 6rpx; - top: 8rpx; - width: 108rpx; - height: 108rpx; + width: 440rpx; + height: 170rpx; } /* 立即联系样式 */ @@ -232,8 +221,13 @@ } .contact-icon { - width: 60rpx; - height: 60rpx; + width: 80rpx; + height: 80rpx; +} + +.contact-icon2 { + width: 50rpx; + height: 50rpx; } .contact-text { @@ -253,7 +247,7 @@ } /* */ -.interval{ +.interval { width: 100vw; height: 20rpx; background-color: #f7f6fb; @@ -282,7 +276,7 @@ .section-arrow { width: 32rpx; - height: 32rpx; + height: 32rpx; margin-right: 10rpx; } @@ -310,6 +304,11 @@ width: 60%; } +.service-info-left-top { + display: flex; + align-items: flex-end; +} + .service-info-right { width: 35%; display: flex; @@ -326,6 +325,11 @@ height: 240rpx; } +.service-image2 { + width: 35rpx; + height: 35rpx; +} + .service-badge { position: absolute; top: 20rpx; @@ -341,16 +345,17 @@ font-size: 30rpx; font-weight: bold; color: #333; - margin-bottom: 8rpx; + margin-bottom: 4rpx; + margin-right: 15rpx; } .service-tag { display: inline-block; color: #e1ca9b; font-size: 22rpx; - padding: 2rpx 16rpx; + padding: 2rpx 0; border-radius: 20rpx; - margin-bottom: 16rpx; + margin-bottom: 4rpx; } .service-desc { @@ -380,7 +385,7 @@ height: 100rpx; position: fixed; right: 33rpx; - bottom: 250rpx; + bottom: 320rpx; z-index: 10; } diff --git a/packages/homeServer/index/index.vue b/packages/homeServer/index/index.vue index a3d60d2c..7910538c 100644 --- a/packages/homeServer/index/index.vue +++ b/packages/homeServer/index/index.vue @@ -36,22 +36,34 @@ - 到家公告 + + 到家 + 公告 + + | 公告内容公告内容公告内容公告内容... - + - - + + + + - {{ item.title }} @@ -68,20 +79,29 @@ - + 立即联系
未找到您需要的服务？ - + - + 推荐热门服务 @@ -90,14 +110,20 @@ v-for="(service, index) in hotServiceList" :key="index" > - - + - {{ service.name }} - {{ service.tag }} + + {{ service.name }} + + {{ service.tag }} +
{{ service.description }} @@ -127,9 +153,7 @@ max="99" :value="value" > - + @@ -156,43 +180,59 @@ export default { serviceCategories: [ { name: "家电维修", - icon: "", + icon: "http://localhost:8080/index_top1.png", }, { name: "数码维修", - icon: "", + icon: "http://localhost:8080/index_top2.png", }, { name: "电器清洗", - icon: "", + icon: "http://localhost:8080/index_top3.png", }, { name: "洗衣洗鞋", - icon: "", + icon: "http://localhost:8080/index_top4.png", }, { name: "精细擦窗", - icon: "", + icon: "http://localhost:8080/index_top5.png", }, { name: "整理收纳", - icon: "", + icon: "http://localhost:8080/index_top6.png", }, { name: "家庭保姆", - icon: "", + icon: "http://localhost:8080/index_top7.png", }, { name: "母婴服务", - icon: "", + icon: "http://localhost:8080/index_top8.png", }, { name: "管道疏通", - icon: "", + icon: "http://localhost:8080/index_top9.png", }, { name: "家庭保洁", - icon: "", + icon: "http://localhost:8080/index_top10.png", + }, + ], + homeLeftList: [ + { + title: "", + pic_src: "http://localhost:8080/guanggao1.png", + }, + ], + homeRightList: [ + { + title: "", + pic_src: "http://localhost:8080/guanggao2.png", + }, + { + title: "", + pic_src: "http://localhost:8080/guanggao3.png", }, ], // 热门服务数据 @@ -200,7 +240,6 @@ export default { { id: 1, name: "空调清洗", - image: "", badge: "推荐", tag: "平台保障", description: "专业保洁团队，全屋深度清洁，去除顽固污渍，还您清新居所", @@ -225,16 +264,20 @@ export default { // 导航到服务详情 navigateToService(item) { uni.navigateTo({ - url: `/packages/homeServer/serverInfo/index?service=${encodeURIComponent( - JSON.stringify(item) - )}`, + url: "/packages/homeServer/classify/index", }); + // uni.navigateTo({ + // url: `/packages/homeServer/serverInfo/index?service=${encodeURIComponent( + // JSON.stringify(item) + // )}`, + // }); }, // 导航到预约页面 navigateToReservation(service) { - uni.navigateTo({ - url: `/packages/homeServer/reservation/index?id=${service.id}&name=${service.name}`, - }); + // uni.navigateTo({ + // url: `/packages/homeServer/reservation/index?id=${service.id}&name=${service.name}`, + // }); + NavgateTo("/packages/homeServer/searchInfo/index"); }, // 联系客服 contactService() { @@ -255,6 +298,11 @@ export default { duration: 300, }); }, + + // 查看公告 + lookNotice() { + NavgateTo("/packages/homeServer/noticeDetials/index"); + }, }, onLoad() { this.getCurrentLocation(); diff --git a/packages/homeServer/masterInfo/index.vue b/packages/homeServer/masterInfo/index.vue index b1ad107e..592a5e0d 100644 --- a/packages/homeServer/masterInfo/index.vue +++ b/packages/homeServer/masterInfo/index.vue @@ -1,325 +1,410 @@ \ No newline at end of file diff --git a/packages/homeServer/masterReview/index.vue b/packages/homeServer/masterReview/index.vue index 658df749..70575eb1 100644 --- a/packages/homeServer/masterReview/index.vue +++ b/packages/homeServer/masterReview/index.vue @@ -1,79 +1,90 @@ \ No newline at end of file diff --git a/packages/homeServer/search/index.css b/packages/homeServer/search/index.css index 3982efd8..2ff1eb0d 100644 --- a/packages/homeServer/search/index.css +++ b/packages/homeServer/search/index.css @@ -9,7 +9,7 @@ width: 520rpx; display: flex; align-items: center; - padding: 16rpx 20rpx; + padding: 16rpx 20rpx 16rpx 0; background-color: #fff; border-bottom: 1rpx solid #f5f5f5; } @@ -21,6 +21,7 @@ background-color: #f5f7fb; border-radius: 60rpx; padding: 14rpx 24rpx; + margin-left: 20rpx; } .search-icon { @@ -196,6 +197,11 @@ width: 60%; } +.service-info-left-top { + display: flex; + align-items: flex-end; +} + .service-info-right { width: 35%; display: flex; @@ -212,6 +218,11 @@ height: 240rpx; } +.service-image2 { + width: 35rpx; + height: 35rpx; +} + .service-badge { position: absolute; top: 20rpx; @@ -227,16 +238,17 @@ font-size: 30rpx; font-weight: bold; color: #333; - margin-bottom: 8rpx; + margin-bottom: 4rpx; + margin-right: 15rpx; } .service-tag { display: inline-block; color: #e1ca9b; font-size: 22rpx; - padding: 2rpx 16rpx; + padding: 2rpx 0; border-radius: 20rpx; - margin-bottom: 16rpx; + margin-bottom: 4rpx; } .service-desc { diff --git a/packages/homeServer/search/index.vue b/packages/homeServer/search/index.vue index a424bf1f..0dfd1bd1 100644 --- a/packages/homeServer/search/index.vue +++ b/packages/homeServer/search/index.vue @@ -2,11 +2,14 @@ - + - + - {{ service.name }} - {{ service.tag }} + + {{ service.name }} + + {{ service.tag }} +
{{ service.description }} @@ -109,16 +121,18 @@ -
+
- +
@@ -165,11 +179,11 @@ export default { created() { const history = uni.getStorageSync("searchHistory") || []; this.searchHistory = history; - window.addEventListener('scroll', this.handleScroll); + window.addEventListener("scroll", this.handleScroll); }, beforeUnmount() { - window.removeEventListener('scroll', this.handleScroll); + window.removeEventListener("scroll", this.handleScroll); }, methods: { handleScroll() { @@ -178,11 +192,11 @@ export default { scrollToTop() { uni.pageScrollTo({ scrollTop: 0, - duration: 300 + duration: 300, }); }, - upView() { - NavgateTo("/packages/homeServer/index/index"); + back() { + NavgateTo("1"); }, // 处理搜索 handleSearch() { @@ -239,9 +253,9 @@ export default { }, // 去预约 - goSubscribe(){ - NavgateTo("/packages/homeServer/serverInfo/index") - } + goSubscribe() { + NavgateTo("/packages/homeServer/searchInfo/index"); + }, }, }; diff --git a/packages/homeServer/searchInfo/index.css b/packages/homeServer/searchInfo/index.css index e69de29b..6bf52000 100644 --- a/packages/homeServer/searchInfo/index.css +++ b/packages/homeServer/searchInfo/index.css @@ -0,0 +1,419 @@ +page { + background-color: #f6f6fa; + padding: 0 !important; +} + +.container { + display: flex; + flex-direction: column; + height: 100vh; + overflow: hidden; +} + +.header { + z-index: 9; +} + +.main { + flex: 1; + box-sizing: border-box; + overflow: hidden; + overflow-y: auto; + position: relative; + padding-bottom: 160rpx; +} + +.searchBox { + display: flex; + align-items: center; + background-color: #fff; +} + +.Filter { + display: flex; + align-items: center; + background-color: #fff; +} + +.Filter_right { + width: 133rpx; + height: 110rpx; + background: #FFFFFF; + border-radius: 0rpx 0rpx 0rpx 0rpx; + font-size: 30rpx; + color: #FF370B; + display: flex; + align-items: center; + justify-content: center; +} + +.Filter_right image { + width: 26rpx; + height: 30rpx; + margin-left: 7rpx; +} + +.iptBox { + width: 431rpx; + height: 70rpx; + background: #F6F7FB; + border-radius: 100rpx 100rpx 100rpx 100rpx; + margin-left: 40rpx; + display: flex; + align-items: center; + padding-left: 30rpx; + box-sizing: border-box; +} + +.iptBox image { + width: 30rpx; + height: 30rpx; + margin-right: 16rpx; +} + +.iptBox .u-input { + padding: 0 !important; + background-color: transparent !important; + +} + +.Filter_left { + display: flex; + align-items: center; + overflow: hidden; + overflow-x: auto; + white-space: nowrap; +} + +.FilterItem { + font-size: 28rpx; + color: #222222; + display: flex; + align-items: center; + padding: 0 20rpx; + margin-right: 10rpx; +} + +.FilterItem image { + width: 24rpx; + height: 15rpx; + margin-left: 10rpx; +} + +.MasterList { + margin-top: 30rpx; + background-color: #fff; + padding: 12rpx 20rpx 20rpx 20rpx; +} + +.MasterItem { + display: flex; + align-items: center; + margin-bottom: 20rpx; + border-bottom: 1rpx solid #EBEBEB; + box-sizing: border-box; + padding-bottom: 30rpx; + padding-top: 20rpx; +} +.MasterItem:last-child{ + border-bottom: none; +} + + + +.MasterItem_right { + flex: 1; + background: #FFFFFF; + border-radius: 20rpx 20rpx 20rpx 20rpx; +} + +.MasterItem_info { + box-sizing: border-box; + display: flex; + align-items: flex-start; +} + + +.MasterItem_Info_left { + display: flex; + flex-direction: column; + justify-content: center; + width: 130rpx; + margin-right: 40rpx; +} + +.MasterItem_Info_left image { + width: 130rpx; + height: 130rpx; +} + +.state { + width: 110rpx; + height: 40rpx; + border-radius: 100rpx 100rpx 100rpx 100rpx; + display: flex; + align-items: center; + justify-content: center; + font-size: 26rpx; + color: #FFFFFF; + margin: 0 auto; + margin-top: -20rpx; + z-index: 2; + position: relative; +} + +.state1 { + background: #AECE2B; + +} + +.state2 { + background: #CECECE; +} + +.state3 { + background: #FF370B; +} + +.MasterItem_Info_right { + flex: 1; + +} + +.MasterItem_Info_right_1 { + display: flex; + align-items: center; + font-size: 36rpx; + color: #222222; + justify-content: space-between; +} + +.Medal { + width: 35rpx; + height: 40rpx; + margin-left: 6rpx; + margin-right: 28rpx; +} + +.star { + width: 22rpx; + height: 22rpx; + margin-right: 6rpx; +} + +.MasterItem_Info_right_1 span { + font-size: 26rpx; + color: #000000; +} + +.MasterItem_Info_right_2 { + font-size: 26rpx; + color: #999999; + margin-top: 8rpx; +} + +.MasterItem_Info_right_3 { + font-size: 26rpx; + display: flex; + color: #999999; + align-items: center; + margin-top: 16rpx; +} + +.MasterItem_Info_right_3 span { + color: #FF370B; + +} + +.MasterItem_Info_right_4 { + display: flex; + align-items: center; + margin-top: 16rpx; +} + +.tagItem { + width: 130rpx; + height: 40rpx; + display: flex; + align-items: center; + justify-content: center; + border-radius: 100rpx 100rpx 100rpx 100rpx; + font-size: 22rpx; + color: #555555; + margin-right: 10rpx; +} + +.tag1 { + background: rgba(255, 178, 23, 0.1); +} + +.tag2 { + background: rgba(255, 81, 42, 0.1); +} + +.tag3 { + background: rgba(175, 175, 175, 0.1); +} + +.MasterItem_Info_right_5 { + font-size: 28rpx; + color: #999999; + display: flex; + align-items: center; + margin-top: 16rpx; +} + +.MasterItem_Info_right_5 span { + color: #FF370B; +} + +.MasterItem_Info_right_6 { + display: flex; + align-items: center; + margin-top: 20rpx; +} + +.MasterItem_Info_right_6 image { + width: 110rpx; + height: 110rpx; + margin-right: 20rpx; + border-radius: 20rpx; + overflow: hidden; +} + + + +.Btn { + font-size: 36rpx; + color: #FFFFFF; + width: 600rpx; + height: 90rpx; + background: linear-gradient(91deg, #FF7658 0%, #FF370B 100%); + border-radius: 100rpx 100rpx 100rpx 100rpx; + display: flex; + align-items: center; + justify-content: center; + position: fixed; + left: 50%; + bottom: 60rpx; + transform: translateX(-50%); + z-index: 3; +} + + + +.local { + display: flex; + align-items: center; +} + +.local span { + font-weight: 700; +} + +.filterMore1 { + display: flex; + align-items: center; + overflow: hidden; + overflow-x: auto; + white-space: nowrap; + margin-top: 20rpx; +} + +.filterMoreItem { + font-size: 28rpx; + color: #222222; + display: flex; + align-items: center; + background-color: #f6f6fa; + padding: 0 20rpx; + margin-right: 10rpx; + margin-right: 20rpx; + border-radius: 20rpx; + padding: 10rpx 20rpx; +} + +.filterMore2_item { + display: flex; + align-items: center; + justify-content: space-between; + margin-bottom: 20rpx; + color: #999; +} + +.filterMore2_item_left {} + +.active2 { + color: #ff702c !important; +} + +.filterMore2_item_left2 { + color: #000; +} + + + + +.filterMore3Item { + font-size: 26rpx; + color: #555555; + width: 130rpx; + height: 50rpx; + background: #F6F7FB; + border-radius: 10rpx 10rpx 10rpx 10rpx; + display: flex; + align-items: center; + justify-content: center; + margin-right: 40rpx; + margin-bottom: 18rpx; +} + +.filterMore3Item:nth-child(4n) { + margin-right: 0; +} + +.fullscreen-black-bg { + /* position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100vh; + background-color: rgba(0, 0, 0, .4); + box-sizing: border-box; + z-index: 9; + overflow: hidden; */ +} + +.FilterMore3 { + width: 100%; + background-color: #fff; + padding: 20rpx; + box-sizing: border-box; + display: flex; + flex-wrap: wrap; +} + +.FilterMore { + width: 100%; + background-color: #fff; + padding: 20rpx; + box-sizing: border-box; +} + +.dialogBox { + position: absolute; + background-color: rgba(0, 0, 0, .4); + z-index: 8; + width: 100%; + height: 100%; +} + + +.master_info_right_left{ + display: flex; + align-items: center; +} +.master_info_right_right { + font-size: 28rpx; + color: #FF370B; +} \ No newline at end of file diff --git a/packages/homeServer/searchInfo/index.vue b/packages/homeServer/searchInfo/index.vue index dc343d9e..b44b5380 100644 --- a/packages/homeServer/searchInfo/index.vue +++ b/packages/homeServer/searchInfo/index.vue @@ -1,5 +1,176 @@ @@ -12,19 +183,29 @@ export default { data() { return { top: "", - localHeight: "" + localHeight: "", + show1: false, + show2: false, + show3: false, + show4: false, } }, methods: { - + masterInfo() { + NavgateTo("../masterInfo/index") + }, + back(){ + NavgateTo("1") + }, }, onReady() { }, - onload(options) { + onLoad(options) { const meun = menuButtonInfo(); this.top = meun.top; + // this.top = meun.height + meun.top; this.localHeight = meun.height; }, onShow() { diff --git a/packages/homeServer/serverInfo/index.vue b/packages/homeServer/serverInfo/index.vue index f0ba94d9..78c0cbb3 100644 --- a/packages/homeServer/serverInfo/index.vue +++ b/packages/homeServer/serverInfo/index.vue @@ -41,7 +41,7 @@
匹配的服务商(3)
-
+
@@ -90,6 +90,9 @@ export default { handleRangeChange(e) { this.rangeValue = e }, + selectVendor(){ + NavgateTo("../vendor/index") + }, selectMaster(){ NavgateTo("../chooseMaster/index") }, diff --git a/pages.json b/pages.json index 14c33bc7..fff47633 100644 --- a/pages.json +++ b/pages.json @@ -641,7 +641,6 @@ "style": { "navigationBarBackgroundColor": "#fff", "navigationBarTitleText": "服务详情" - } }, { @@ -685,6 +684,20 @@ "navigationBarBackgroundColor": "#fff", "navigationStyle": "custom" } + }, + { + "path": "noticeDetials/index", + "style": { + "navigationBarTitleText": "公告详情", + "navigationBarBackgroundColor": "#fff" + } + }, + { + "path": "classify/index", + "style": { + "navigationBarTitleText": "全部服务", + "navigationBarBackgroundColor": "#fff" + } } ] }