From 7a0073cd62ca8a55c6952d8cffba9e5ab24fd45f Mon Sep 17 00:00:00 2001
From: linxi <957440651@qq.com>
Date: Thu, 30 Oct 2025 18:40:13 +0800
Subject: [PATCH] =?UTF-8?q?Feat:=20=E7=AE=A1=E5=AE=B6=E8=AF=A6=E6=83=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 api/qianxian.js                         |   15 +-
 pages.json                              |    7 +
 pkg_product/views/housekeeperDetail.vue | 1406 +++++++++++++++++++++++
 pkg_product/views/sojoumStore.vue       |   65 +-
 4 files changed, 1477 insertions(+), 16 deletions(-)
 create mode 100644 pkg_product/views/housekeeperDetail.vue

diff --git a/api/qianxian.js b/api/qianxian.js
index 83dfb1b..01b8303 100644
--- a/api/qianxian.js
+++ b/api/qianxian.js
@@ -141,12 +141,12 @@ export function postJiaLouZan(data) {
 
 // 旅居资讯查看
 export function postJiaLouNewsView(data) {
-    return request.post('/countyFamous/news/view', data, {login: true})  
+    return request.post('/travel/news/view', data, {login: true})  
 }
 
 // 旅居资讯点赞
 export function postJiaLouNewsZan(data) {
-    return request.post('/countyFamous/news/zan', data, {login: true})
+    return request.post('/travel/news/zan', data, {login: true})
 }
 
 // 分享旅居
@@ -238,3 +238,14 @@ export function createJiaLouOrder(params) {
 export function createJiaLouOrderPay(params) {
     return request.post('/travel/travelGroupOrder/create/' + params.key, params, {login: true})  
 }
+
+
+/**
+ * 旅居资讯列表
+ * merId int 旅居管家商户ID
+page int 页码
+limit int 每页条数
+ */
+export function getJiaLouNewsList(params) {
+    return request.get('/travel/news', params, {login: true})
+}
diff --git a/pages.json b/pages.json
index ced98e4..1afc0ea 100644
--- a/pages.json
+++ b/pages.json
@@ -726,6 +726,13 @@
             "navigationStyle": "custom"
           }
         },
+        {
+          "path": "views/housekeeperDetail",
+          "style": {
+            "navigationBarTitleText": "",
+            "navigationStyle": "custom"
+          }
+        },
         {
           "path": "views/groupBuyDetails",
           "style": {
diff --git a/pkg_product/views/housekeeperDetail.vue b/pkg_product/views/housekeeperDetail.vue
new file mode 100644
index 0000000..c686fcf
--- /dev/null
+++ b/pkg_product/views/housekeeperDetail.vue
@@ -0,0 +1,1406 @@
+<template>
+  <view class="housekeeper-detail">
+    <!-- 导航栏 -->
+    <hx-navbar
+      :fixed="true"
+      :background-color="[0,[0,0,0,0],[0,0,0,0]]"
+      :pageScroll.sync="scrollData"
+      statusBarFontColor="#ffffff"
+      barPlaceholder="hidden"
+      transparent="auto"
+      color='#ffffff'
+      title="管家详情"
+    />
+
+    <!-- 管家基本信息区 -->
+    <view class="housekeeper-header">
+      <view class="header-bg">
+        <image 
+          :src="housekeeperInfo.backgroundImage || defaultBg" 
+          class="bg-image"
+          mode="aspectFill"
+        />
+        <view class="bg-overlay"></view>
+      </view>
+      
+      <view class="header-content">
+        <!-- 专业标签 -->
+        <view class="tags-section">
+          <view class="section-title">TA能帮你</view>
+          <view class="tags-grid">
+            <view 
+              v-for="(tag, index) in housekeeperInfo.tags || defaultTags"
+              :key="index"
+              class="tag-item"
+            >
+              <image :src="tag.icon" class="tag-icon" />
+              <text class="tag-text">{{ tag.text }}</text>
+            </view>
+          </view>
+        </view>
+
+        <!-- 金牌管家认证 -->
+        <view class="certification-section" v-if="housekeeperInfo.isGoldHousekeeper">
+          <view class="cert-header">
+            <image src="/static/images/gold-badge.png" class="cert-icon" />
+            <text class="cert-title">金牌管家</text>
+          </view>
+          <view class="cert-content">
+            <text class="cert-desc">高品质服务，助力顺畅沟通</text>
+            <view class="cert-features">
+              <text class="feature">安全守护·接急应证</text>
+              <text class="feature">皮对突发装况</text>
+            </view>
+          </view>
+          <view class="cert-stats">
+            <text class="stat">出行天数：C1驾照(5年驾龄)，提供途径改变或小众自驾路线规划</text>
+          </view>
+        </view>
+      </view>
+    </view>
+
+    <!-- 服务项目列表 -->
+    <view class="services-section">
+      <view class="section-header">
+        <text class="section-title">服务项目</text>
+        <text class="section-subtitle">精选优质服务，满足您的需求</text>
+      </view>
+      
+      <view class="services-list">
+        <view 
+          v-for="(service, index) in serviceList"
+          :key="index"
+          class="service-item"
+          @click="selectService(service)"
+        >
+          <view class="service-content">
+            <view class="service-header">
+              <text class="service-name">{{ service.name }}</text>
+              <view class="service-price">
+                <text class="price-symbol">￥</text>
+                <text class="price-amount">{{ service.price }}</text>
+                <text class="price-unit">/{{ service.unit }}</text>
+              </view>
+            </view>
+            
+            <view class="service-desc">{{ service.description }}</view>
+            
+            <view class="service-features">
+              <view 
+                v-for="(feature, fIndex) in service.features"
+                :key="fIndex"
+                class="feature-tag"
+              >
+                {{ feature }}
+              </view>
+            </view>
+            
+            <view class="service-meta">
+              <text class="duration">服务时长：{{ service.duration }}</text>
+              <text class="booking-count">已预约{{ service.bookingCount }}次</text>
+            </view>
+          </view>
+          
+          <view class="service-action">
+            <view class="book-btn" @click.stop="bookService(service)">
+              立即预约
+            </view>
+          </view>
+        </view>
+      </view>
+    </view>
+
+  </view>
+</template>
+
+<script>
+export default {
+  name: 'HousekeeperDetail',
+  data() {
+    return {
+      scrollData: {
+        scrollTop: 0,
+        lastScrollTop: 0,
+        showBackToTop: false,
+        navbarVisible: true
+      },
+      
+      // 性能优化相关
+      reviewsLoading: false,
+      hasMoreReviews: true,
+      
+      housekeeperId: '',
+      
+      // 默认数据
+      defaultBg: '/static/images/housekeeper-bg.jpg',
+      defaultAvatar: '/static/images/default-avatar.png',
+      defaultTags: [
+        { icon: '/static/images/tag-schedule.png', text: '设计行程' },
+        { icon: '/static/images/tag-food.png', text: '推荐美食' },
+        { icon: '/static/images/tag-guide.png', text: '游玩向导' },
+        { icon: '/static/images/tag-custom.png', text: '预定门票' },
+        { icon: '/static/images/tag-recommend.png', text: '特色推荐' },
+        { icon: '/static/images/tag-culture.png', text: '文化讲解' },
+        { icon: '/static/images/tag-private.png', text: '私人定制' },
+        { icon: '/static/images/tag-memory.png', text: '记忆保存' }
+      ],
+      
+      // 管家信息
+      housekeeperInfo: {
+        id: 1,
+        name: '甄美丽',
+        title: '旅居管家',
+        avatar: '/static/images/housekeeper-avatar.jpg',
+        backgroundImage: '/static/images/housekeeper-bg.jpg',
+        rating: 5.0,
+        serviceYears: 3,
+        isOnline: true,
+        isGoldHousekeeper: true,
+        isFavorite: false,
+        description: '擅长行程规划，专注带来深度体验乡村旅游，农耕体验、古村探秘、山野徒步、农家美食，量身规划沉浸式乡村旅程。',
+        tags: [
+          { icon: '/static/images/tag-schedule.png', text: '设计行程' },
+          { icon: '/static/images/tag-food.png', text: '推荐美食' },
+          { icon: '/static/images/tag-guide.png', text: '游玩向导' },
+          { icon: '/static/images/tag-custom.png', text: '预定门票' }
+        ]
+      },
+      
+      // 服务列表
+      serviceList: [
+        {
+          id: 1,
+          name: '一日游规划',
+          price: 299,
+          unit: '天',
+          duration: '8小时',
+          bookingCount: 128,
+          description: '专业定制一日游行程，包含景点推荐、路线规划、美食指南',
+          features: ['个性化定制', '全程陪同', '拍照服务']
+        },
+        {
+          id: 2,
+          name: '多日游策划',
+          price: 199,
+          unit: '天',
+          duration: '全天',
+          bookingCount: 86,
+          description: '深度多日游策划，涵盖住宿、交通、景点的全方位安排',
+          features: ['行程规划', '住宿推荐', '交通安排']
+        },
+        {
+          id: 3,
+          name: '美食探店',
+          price: 158,
+          unit: '次',
+          duration: '3小时',
+          bookingCount: 203,
+          description: '带您探索当地特色美食，品尝地道农家菜和特色小吃',
+          features: ['美食推荐', '预约订座', '文化讲解']
+        }
+      ],
+      
+      // 评价列表
+      reviewsList: [
+        {
+          id: 1,
+          username: '张**',
+          userAvatar: '/static/images/user1.jpg',
+          rating: 5,
+          date: '2024-01-15',
+          content: '甄美丽管家服务非常专业，行程安排得很合理，带我们体验了很多当地特色，强烈推荐！',
+          images: ['/static/images/review1.jpg', '/static/images/review2.jpg']
+        },
+        {
+          id: 2,
+          username: '李**',
+          userAvatar: '/static/images/user2.jpg',
+          rating: 5,
+          date: '2024-01-10',
+          content: '第一次体验管家服务，超出预期！美丽很贴心，帮我们安排了很多有趣的活动。',
+          images: []
+        },
+        {
+          id: 3,
+          username: '王**',
+          userAvatar: '/static/images/user3.jpg',
+          rating: 4,
+          date: '2024-01-08',
+          content: '服务态度很好，对当地很熟悉，推荐的美食都很棒，下次还会选择她的服务。',
+          images: ['/static/images/review3.jpg']
+        }
+      ],
+      
+      // 预约表单
+      showBookingForm: false,
+      showDatePicker: false,
+      selectedService: {},
+      bookingForm: {
+        date: '',
+        time: '',
+        phone: '',
+        requirements: ''
+      },
+      formErrors: {
+        date: '',
+        time: '',
+        phone: ''
+      },
+      availableTimeSlots: [
+        { label: '09:00', value: '09:00', disabled: false },
+        { label: '10:00', value: '10:00', disabled: false },
+        { label: '11:00', value: '11:00', disabled: false },
+        { label: '14:00', value: '14:00', disabled: false },
+        { label: '15:00', value: '15:00', disabled: false },
+        { label: '16:00', value: '16:00', disabled: false },
+        { label: '17:00', value: '17:00', disabled: false },
+        { label: '18:00', value: '18:00', disabled: false }
+      ]
+    }
+  },
+  
+  computed: {
+    displayReviews() {
+      return this.reviewsList.slice(0, 3)
+    },
+    
+    // 表单是否有效
+    isFormValid() {
+      return this.bookingForm.date && 
+             this.bookingForm.time && 
+             this.bookingForm.phone && 
+             this.isValidPhone(this.bookingForm.phone) &&
+             !this.formErrors.date &&
+             !this.formErrors.time &&
+             !this.formErrors.phone
+    },
+    
+    // 最小日期（今天）
+    minDate() {
+      return new Date().toISOString().split('T')[0]
+    },
+    
+    // 最大日期（30天后）
+    maxDate() {
+      const date = new Date()
+      date.setDate(date.getDate() + 30)
+      return date.toISOString().split('T')[0]
+    }
+  },
+  
+  onLoad(options) {
+    this.housekeeperId = options.id || '1'
+    this.loadHousekeeperDetail()
+    
+    // 预加载关键资源
+    this.$nextTick(() => {
+      this.preloadResources()
+    })
+    
+  },
+  
+  onUnload() {
+    // 移除事件监听
+    uni.$off('openBooking')
+  },
+  
+  onPageScroll(e) {
+    // 使用优化的滚动处理
+    // this.optimizedScrollHandler()(e)
+  },
+  
+  onReachBottom() {
+    // 触底加载更多评价
+    this.loadMoreReviews()
+  },
+  
+  methods: {
+    // 加载管家详情
+    async loadHousekeeperDetail() {
+      try {
+        uni.showLoading({ title: '加载中...' })
+        // 这里调用API获取管家详情
+        // const res = await getHousekeeperDetail(this.housekeeperId)
+        // this.housekeeperInfo = res.data
+        // this.serviceList = res.data.services
+        // this.reviewsList = res.data.reviews
+      } catch (error) {
+        uni.showToast({ title: '加载失败', icon: 'error' })
+      } finally {
+        uni.hideLoading()
+      }
+    },
+    
+    // 选择服务
+    selectService(service) {
+      this.selectedService = service
+      this.showBookingForm = true
+    },
+    
+    // 预约服务
+    bookService(service) {
+      this.selectService(service)
+    },
+    
+    // 快速预约
+    quickBook() {
+      if (this.serviceList.length > 0) {
+        this.selectService(this.serviceList[0])
+      }
+    },
+    
+    // 关闭预约表单
+    closeBookingForm() {
+      this.showBookingForm = false
+      this.resetBookingForm()
+    },
+    
+    // 重置预约表单
+    resetBookingForm() {
+      this.bookingForm = {
+        date: '',
+        time: '',
+        phone: '',
+        requirements: ''
+      }
+      this.formErrors = {
+        date: '',
+        time: '',
+        phone: ''
+      }
+    },
+    
+    // 弹窗状态变化
+    onPopupChange(e) {
+      if (!e.show) {
+        this.closeBookingForm()
+      }
+    },
+    
+    // 日期变化
+    onDateChange(value) {
+      this.bookingForm.date = value
+      this.formErrors.date = ''
+      this.showDatePicker = false
+      this.updateAvailableTimeSlots()
+    },
+    
+    // 选择时间段
+    selectTimeSlot(slot) {
+      if (slot.disabled) return
+      
+      this.bookingForm.time = slot.value
+      this.formErrors.time = ''
+    },
+    
+    // 更新可用时间段
+    updateAvailableTimeSlots() {
+      const selectedDate = new Date(this.bookingForm.date)
+      const today = new Date()
+      const isToday = selectedDate.toDateString() === today.toDateString()
+      
+      if (isToday) {
+        const currentHour = today.getHours()
+        this.availableTimeSlots.forEach(slot => {
+          const slotHour = parseInt(slot.value.split(':')[0])
+          slot.disabled = slotHour <= currentHour
+        })
+      } else {
+        this.availableTimeSlots.forEach(slot => {
+          slot.disabled = false
+        })
+      }
+    },
+    
+    // 验证手机号
+    validatePhone() {
+      if (!this.bookingForm.phone) {
+        this.formErrors.phone = '请输入联系电话'
+      } else if (!this.isValidPhone(this.bookingForm.phone)) {
+        this.formErrors.phone = '请输入正确的手机号'
+      } else {
+        this.formErrors.phone = ''
+      }
+    },
+    
+    // 检查手机号格式
+    isValidPhone(phone) {
+      return /^1[3-9]\d{9}$/.test(phone)
+    },
+    
+    // 提交预约
+    async submitBooking() {
+      // 如果表单无效，不允许提交
+      if (!this.isFormValid) {
+        this.validateForm()
+        return
+      }
+      
+      try {
+        uni.showLoading({ title: '提交中...' })
+        
+        const bookingData = {
+          housekeeperId: this.housekeeperId,
+          serviceId: this.selectedService.id,
+          serviceName: this.selectedService.name,
+          date: this.bookingForm.date,
+          time: this.bookingForm.time,
+          phone: this.bookingForm.phone,
+          requirements: this.bookingForm.requirements,
+          totalPrice: this.selectedService.price
+        }
+        
+        // 调用预约API
+        // const result = await this.$api.housekeeper.submitBooking(bookingData)
+        
+        // 模拟API调用
+        await new Promise(resolve => setTimeout(resolve, 1000))
+        
+        uni.showToast({ title: '预约成功', icon: 'success' })
+        this.closeBookingForm()
+        
+        // 跳转到订单页面
+        setTimeout(() => {
+          uni.navigateTo({ url: '/pages/order/MyOrder/index' })
+        }, 1500)
+        
+      } catch (error) {
+        console.error('预约失败:', error)
+        uni.showToast({ title: '预约失败，请重试', icon: 'error' })
+      } finally {
+        uni.hideLoading()
+      }
+    },
+    
+    // 验证整个表单
+    validateForm() {
+      let hasError = false
+      
+      if (!this.bookingForm.date) {
+        this.formErrors.date = '请选择预约日期'
+        hasError = true
+      }
+      
+      if (!this.bookingForm.time) {
+        this.formErrors.time = '请选择预约时间'
+        hasError = true
+      }
+      
+      if (!this.bookingForm.phone) {
+        this.formErrors.phone = '请输入联系电话'
+        hasError = true
+      } else if (!this.isValidPhone(this.bookingForm.phone)) {
+        this.formErrors.phone = '请输入正确的手机号'
+        hasError = true
+      }
+      
+      if (hasError) {
+        uni.showToast({ title: '请完善表单信息', icon: 'none' })
+      }
+      
+      return !hasError
+    },
+    
+    // 联系管家
+    contactHousekeeper() {
+      // 跳转到聊天页面或拨打电话
+      uni.navigateTo({ 
+        url: `/pages/chat/index?housekeeperId=${this.housekeeperId}` 
+      })
+    },
+    
+    // 收藏管家
+    async favoriteHousekeeper() {
+      try {
+        // 调用收藏API
+        // await toggleFavoriteHousekeeper(this.housekeeperId)
+        
+        this.housekeeperInfo.isFavorite = !this.housekeeperInfo.isFavorite
+        const message = this.housekeeperInfo.isFavorite ? '收藏成功' : '取消收藏'
+        uni.showToast({ title: message, icon: 'success' })
+        
+      } catch (error) {
+        uni.showToast({ title: '操作失败', icon: 'error' })
+      }
+    },
+    
+    // 查看更多评价
+    viewMoreReviews() {
+      uni.navigateTo({ 
+        url: `/pages/reviews/index?housekeeperId=${this.housekeeperId}` 
+      })
+    },
+    
+    // 预览图片
+    previewImage(images, current) {
+      uni.previewImage({
+        urls: images,
+        current: current
+      })
+    },
+    
+    // 图片懒加载
+    onImageLoad(e) {
+      // 图片加载成功后的处理
+      console.log('图片加载成功:', e)
+    },
+    
+    onImageError(e) {
+      // 图片加载失败的处理
+      console.log('图片加载失败:', e)
+      // 可以设置默认图片
+    },
+    
+    // 节流函数 - 用于滚动事件优化
+    throttle(func, delay) {
+      let timeoutId
+      let lastExecTime = 0
+      return function (...args) {
+        const currentTime = Date.now()
+        
+        if (currentTime - lastExecTime > delay) {
+          func.apply(this, args)
+          lastExecTime = currentTime
+        } else {
+          clearTimeout(timeoutId)
+          timeoutId = setTimeout(() => {
+            func.apply(this, args)
+            lastExecTime = Date.now()
+          }, delay - (currentTime - lastExecTime))
+        }
+      }
+    },
+    
+    // 防抖函数 - 用于搜索等输入优化
+    debounce(func, delay) {
+      let timeoutId
+      return function (...args) {
+        clearTimeout(timeoutId)
+        timeoutId = setTimeout(() => func.apply(this, args), delay)
+      }
+    },
+    
+    // 优化的滚动处理
+    optimizedScrollHandler() {
+      return this.throttle((e) => {
+        this.scrollData.scrollTop = e.detail.scrollTop
+        
+        // 当滚动到一定位置时显示返回顶部按钮
+        this.scrollData.showBackToTop = e.detail.scrollTop > 500
+        
+        // 滚动时隐藏/显示导航栏
+        if (e.detail.scrollTop > this.scrollData.lastScrollTop) {
+          // 向下滚动
+          this.scrollData.navbarVisible = false
+        } else {
+          // 向上滚动
+          this.scrollData.navbarVisible = true
+        }
+        this.scrollData.lastScrollTop = e.detail.scrollTop
+      }, 16) // 约60fps
+    },
+    
+    // 返回顶部
+    backToTop() {
+      uni.pageScrollTo({
+        scrollTop: 0,
+        duration: 300
+      })
+    },
+    
+    // 预加载关键资源
+    preloadResources() {
+      // 预加载管家头像
+      if (this.housekeeperInfo.avatar) {
+        const img = new Image()
+        img.src = this.housekeeperInfo.avatar
+      }
+      
+      // 预加载服务图片
+      this.serviceList.forEach(service => {
+        if (service.image) {
+          const img = new Image()
+          img.src = service.image
+        }
+      })
+    },
+    
+    // 数据分页加载
+    async loadMoreReviews() {
+      if (this.reviewsLoading || !this.hasMoreReviews) return
+      
+      this.reviewsLoading = true
+      
+      try {
+        // 模拟API调用
+        await new Promise(resolve => setTimeout(resolve, 1000))
+        
+        const newReviews = [
+          // 模拟新的评价数据
+          {
+            id: Date.now(),
+            user: {
+              name: '新用户',
+              avatar: '/static/images/default-avatar.png'
+            },
+            rating: 5,
+            content: '新加载的评价内容...',
+            date: '2024-01-20',
+            images: []
+          }
+        ]
+        
+        this.reviewsList.push(...newReviews)
+        
+        // 检查是否还有更多数据
+        this.hasMoreReviews = this.reviewsList.length < 50 // 假设最多50条评价
+        
+      } catch (error) {
+        console.error('加载更多评价失败:', error)
+        uni.showToast({ title: '加载失败', icon: 'error' })
+      } finally {
+        this.reviewsLoading = false
+      }
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.housekeeper-detail {
+  background: #f5f5f5;
+  min-height: 100vh;
+  padding-bottom: 120rpx;
+}
+
+// 管家头部信息区
+.housekeeper-header {
+  position: relative;
+  background: #fff;
+  
+  .header-bg {
+    position: relative;
+    overflow: hidden;
+    height: 791rpx;
+    border-radius: 0 0 200rpx 200rpx;
+    .bg-image {
+      width: 100%;
+      height: 100%;
+    }
+    
+    .bg-overlay {
+      position: absolute;
+      top: 0;
+      left: 0;
+      right: 0;
+      bottom: 0;
+      background: linear-gradient(180deg, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0.6) 100%);
+    }
+  }
+  
+  .header-content {
+    position: relative;
+    margin-top: -120rpx;
+    padding: 0 32rpx 40rpx;
+    z-index: 2;
+  }
+}
+
+// 管家基本信息
+.housekeeper-info {
+  display: flex;
+  margin-bottom: 40rpx;
+  
+  .avatar-section {
+    position: relative;
+    margin-right: 24rpx;
+    
+    .avatar {
+      width: 120rpx;
+      height: 120rpx;
+      border-radius: 60rpx;
+      border: 4rpx solid #fff;
+      box-shadow: 0 4rpx 12rpx rgba(0,0,0,0.15);
+    }
+    
+    .online-status {
+      position: absolute;
+      bottom: 8rpx;
+      right: 8rpx;
+      width: 24rpx;
+      height: 24rpx;
+      background: #fff;
+      border-radius: 12rpx;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      
+      .status-dot {
+        width: 12rpx;
+        height: 12rpx;
+        background: #52c41a;
+        border-radius: 6rpx;
+      }
+    }
+  }
+  
+  .info-section {
+    flex: 1;
+    
+    .name-row {
+      display: flex;
+      align-items: center;
+      margin-bottom: 16rpx;
+      
+      .name {
+        font-size: 36rpx;
+        font-weight: bold;
+        color: #fff;
+        margin-right: 16rpx;
+      }
+      
+      .title-badge {
+        background: rgba(255,255,255,0.9);
+        padding: 6rpx 16rpx;
+        border-radius: 20rpx;
+        
+        .title {
+          font-size: 24rpx;
+          color: #333;
+        }
+      }
+    }
+    
+    .rating-row {
+      display: flex;
+      align-items: center;
+      margin-bottom: 16rpx;
+      
+      .stars {
+        display: flex;
+        margin-right: 12rpx;
+        
+        .star {
+          font-size: 28rpx;
+          color: #ddd;
+          
+          &.active {
+            color: #ffd700;
+          }
+        }
+      }
+      
+      .rating-text {
+        font-size: 28rpx;
+        color: #fff;
+        margin-right: 16rpx;
+      }
+      
+      .service-years {
+        font-size: 24rpx;
+        color: rgba(255,255,255,0.8);
+      }
+    }
+    
+    .description {
+      font-size: 28rpx;
+      line-height: 40rpx;
+      color: rgba(255,255,255,0.9);
+    }
+  }
+}
+
+// 专业标签区
+.tags-section {
+  margin-bottom: 40rpx;
+  
+  .section-title {
+    font-size: 32rpx;
+    font-weight: bold;
+    color: #333;
+    margin-bottom: 24rpx;
+  }
+  
+  .tags-grid {
+    display: grid;
+    grid-template-columns: repeat(4, 1fr);
+    gap: 24rpx;
+    
+    .tag-item {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      padding: 20rpx;
+      background: #fff;
+      border-radius: 16rpx;
+      box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.06);
+      
+      .tag-icon {
+        width: 48rpx;
+        height: 48rpx;
+        margin-bottom: 12rpx;
+      }
+      
+      .tag-text {
+        font-size: 24rpx;
+        color: #333;
+        text-align: center;
+      }
+    }
+  }
+}
+
+// 金牌管家认证
+.certification-section {
+  background: linear-gradient(135deg, #fff8e1 0%, #fff3c4 100%);
+  border-radius: 20rpx;
+  padding: 24rpx;
+  border: 2rpx solid #ffd700;
+  
+  .cert-header {
+    display: flex;
+    align-items: center;
+    margin-bottom: 16rpx;
+    
+    .cert-icon {
+      width: 32rpx;
+      height: 32rpx;
+      margin-right: 12rpx;
+    }
+    
+    .cert-title {
+      font-size: 28rpx;
+      font-weight: bold;
+      color: #d4a017;
+    }
+  }
+  
+  .cert-content {
+    margin-bottom: 16rpx;
+    
+    .cert-desc {
+      font-size: 26rpx;
+      color: #666;
+      margin-bottom: 12rpx;
+    }
+    
+    .cert-features {
+      display: flex;
+      gap: 16rpx;
+      
+      .feature {
+        font-size: 24rpx;
+        color: #999;
+      }
+    }
+  }
+  
+  .cert-stats {
+    .stat {
+      font-size: 24rpx;
+      color: #666;
+      line-height: 32rpx;
+    }
+  }
+}
+
+// 服务项目区
+.services-section {
+  margin: 24rpx 32rpx;
+  
+  .section-header {
+    margin-bottom: 24rpx;
+    
+    .section-title {
+      font-size: 36rpx;
+      font-weight: bold;
+      color: #333;
+      margin-bottom: 8rpx;
+    }
+    
+    .section-subtitle {
+      font-size: 26rpx;
+      color: #666;
+    }
+  }
+  
+  .services-list {
+    .service-item {
+      background: #fff;
+      border-radius: 20rpx;
+      padding: 32rpx;
+      margin-bottom: 24rpx;
+      box-shadow: 0 4rpx 12rpx rgba(0,0,0,0.08);
+      
+      .service-content {
+        .service-header {
+          display: flex;
+          justify-content: space-between;
+          align-items: flex-start;
+          margin-bottom: 16rpx;
+          
+          .service-name {
+            font-size: 32rpx;
+            font-weight: bold;
+            color: #333;
+          }
+          
+          .service-price {
+            display: flex;
+            align-items: baseline;
+            color: #ff4757;
+            
+            .price-symbol {
+              font-size: 24rpx;
+            }
+            
+            .price-amount {
+              font-size: 36rpx;
+              font-weight: bold;
+            }
+            
+            .price-unit {
+              font-size: 24rpx;
+              margin-left: 4rpx;
+            }
+          }
+        }
+        
+        .service-desc {
+          font-size: 28rpx;
+          color: #666;
+          line-height: 40rpx;
+          margin-bottom: 16rpx;
+        }
+        
+        .service-features {
+          display: flex;
+          gap: 12rpx;
+          margin-bottom: 16rpx;
+          
+          .feature-tag {
+            background: #f0f9ff;
+            color: #0ea5e9;
+            padding: 6rpx 16rpx;
+            border-radius: 20rpx;
+            font-size: 24rpx;
+          }
+        }
+        
+        .service-meta {
+          display: flex;
+          justify-content: space-between;
+          font-size: 24rpx;
+          color: #999;
+        }
+      }
+      
+      .service-action {
+        margin-top: 24rpx;
+        
+        .book-btn {
+          background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+          color: #fff;
+          text-align: center;
+          padding: 20rpx;
+          border-radius: 50rpx;
+          font-size: 28rpx;
+          font-weight: bold;
+        }
+      }
+    }
+  }
+}
+
+// 用户评价区
+.reviews-section {
+  margin: 24rpx 32rpx;
+  
+  .section-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 24rpx;
+    
+    .section-title {
+      font-size: 36rpx;
+      font-weight: bold;
+      color: #333;
+    }
+    
+    .view-more {
+      display: flex;
+      align-items: center;
+      color: #666;
+      font-size: 26rpx;
+      
+      .arrow {
+        margin-left: 8rpx;
+        font-size: 20rpx;
+      }
+    }
+  }
+  
+  .reviews-list {
+    .review-item {
+      background: #fff;
+      border-radius: 16rpx;
+      padding: 24rpx;
+      margin-bottom: 16rpx;
+      
+      .review-header {
+        display: flex;
+        align-items: center;
+        margin-bottom: 16rpx;
+        
+        .user-avatar {
+          width: 60rpx;
+          height: 60rpx;
+          border-radius: 30rpx;
+          margin-right: 16rpx;
+        }
+        
+        .user-info {
+          flex: 1;
+          
+          .username {
+            font-size: 28rpx;
+            color: #333;
+            margin-bottom: 8rpx;
+          }
+          
+          .review-rating {
+            display: flex;
+            
+            .star {
+              font-size: 20rpx;
+              color: #ddd;
+              
+              &.active {
+                color: #ffd700;
+              }
+            }
+          }
+        }
+        
+        .review-date {
+          font-size: 24rpx;
+          color: #999;
+        }
+      }
+      
+      .review-content {
+        font-size: 28rpx;
+        line-height: 40rpx;
+        color: #333;
+        margin-bottom: 16rpx;
+      }
+      
+      .review-images {
+        display: flex;
+        gap: 12rpx;
+        
+        .review-img {
+          width: 120rpx;
+          height: 120rpx;
+          border-radius: 8rpx;
+        }
+      }
+    }
+  }
+}
+
+// 预约表单
+.booking-form {
+  background: #fff;
+  border-radius: 20rpx 20rpx 0 0;
+  max-height: 80vh;
+  
+  .form-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 32rpx;
+    border-bottom: 1rpx solid #f0f0f0;
+    
+    .form-title {
+      font-size: 32rpx;
+      font-weight: bold;
+      color: #333;
+    }
+    
+    .close-btn {
+      font-size: 48rpx;
+      color: #999;
+      line-height: 1;
+    }
+  }
+  
+  .form-content {
+    padding: 32rpx;
+    max-height: 60vh;
+    overflow-y: auto;
+    
+    .selected-service {
+      background: #f8f9fa;
+      padding: 24rpx;
+      border-radius: 16rpx;
+      margin-bottom: 32rpx;
+      
+      .service-name {
+        font-size: 28rpx;
+        font-weight: bold;
+        color: #333;
+        margin-bottom: 8rpx;
+      }
+      
+      .service-price {
+        font-size: 32rpx;
+        color: #ff4757;
+        font-weight: bold;
+      }
+    }
+    
+    .form-group {
+      margin-bottom: 32rpx;
+      
+      .label {
+        display: block;
+        font-size: 28rpx;
+        color: #333;
+        margin-bottom: 16rpx;
+      }
+      
+      .input-field {
+        width: 100%;
+        padding: 24rpx;
+        border: 1rpx solid #e0e0e0;
+        border-radius: 12rpx;
+        font-size: 28rpx;
+        background: #fff;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        
+        &.error {
+          border-color: #ff4757;
+        }
+        
+        .arrow {
+          color: #999;
+        }
+      }
+      
+      .textarea-field {
+        width: 100%;
+        min-height: 120rpx;
+        padding: 24rpx;
+        border: 1rpx solid #e0e0e0;
+        border-radius: 12rpx;
+        font-size: 28rpx;
+        background: #fff;
+        resize: none;
+        
+        &.error {
+          border-color: #ff4757;
+        }
+      }
+      
+      .error-message {
+        color: #ff4757;
+        font-size: 24rpx;
+        margin-top: 8rpx;
+      }
+      
+      .char-counter {
+        text-align: right;
+        font-size: 24rpx;
+        color: #999;
+        margin-top: 8rpx;
+      }
+      
+      // 时间选择器
+      .time-slots {
+        display: grid;
+        grid-template-columns: repeat(3, 1fr);
+        gap: 16rpx;
+        margin-top: 16rpx;
+        
+        .time-slot {
+          padding: 20rpx;
+          border: 1rpx solid #e0e0e0;
+          border-radius: 12rpx;
+          text-align: center;
+          font-size: 26rpx;
+          color: #333;
+          background: #fff;
+          transition: all 0.3s;
+          
+          &.selected {
+            background: #667eea;
+            color: #fff;
+            border-color: #667eea;
+          }
+          
+          &.disabled {
+            background: #f5f5f5;
+            color: #ccc;
+            border-color: #f0f0f0;
+          }
+        }
+      }
+      
+      // 总价显示
+      .total-price {
+        background: #f8f9fa;
+        padding: 24rpx;
+        border-radius: 12rpx;
+        margin-top: 16rpx;
+        
+        .price-label {
+          font-size: 26rpx;
+          color: #666;
+          margin-bottom: 8rpx;
+        }
+        
+        .price-amount {
+          font-size: 36rpx;
+          font-weight: bold;
+          color: #ff4757;
+        }
+      }
+    }
+  }
+  
+  .form-footer {
+    padding: 32rpx;
+    border-top: 1rpx solid #f0f0f0;
+    
+    .submit-btn {
+      background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+      color: #fff;
+      text-align: center;
+      padding: 24rpx;
+      border-radius: 50rpx;
+      font-size: 32rpx;
+      font-weight: bold;
+      transition: all 0.3s;
+      
+      &.disabled {
+        background: #f0f0f0;
+        color: #ccc;
+        cursor: not-allowed;
+      }
+    }
+  }
+}
+
+// 返回顶部按钮
+.back-to-top {
+  position: fixed;
+  right: 30rpx;
+  bottom: 200rpx;
+  width: 80rpx;
+  height: 80rpx;
+  background: rgba(0, 0, 0, 0.6);
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 999;
+  transition: all 0.3s ease;
+  
+  .back-icon {
+    color: #ffffff;
+    font-size: 32rpx;
+    font-weight: bold;
+  }
+  
+  &:active {
+    transform: scale(0.9);
+  }
+}
+
+// 加载更多样式
+.loading-more,
+.load-more,
+.no-more {
+  padding: 40rpx 0;
+  text-align: center;
+  
+  .loading-text,
+  .load-more-text,
+  .no-more-text {
+    font-size: 28rpx;
+    color: #999999;
+  }
+}
+
+.load-more {
+  cursor: pointer;
+  
+  .load-more-text {
+    color: #007AFF;
+  }
+  
+  &:active {
+    opacity: 0.7;
+  }
+}
+
+// 底部操作栏
+.bottom-actions {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background: #fff;
+  padding: 20rpx 32rpx;
+  padding-bottom: calc(20rpx + env(safe-area-inset-bottom));
+  border-top: 1rpx solid #f0f0f0;
+  display: flex;
+  align-items: center;
+  gap: 24rpx;
+  z-index: 100;
+  
+  .action-item {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    
+    .action-icon {
+      width: 48rpx;
+      height: 48rpx;
+      margin-bottom: 8rpx;
+    }
+    
+    .action-text {
+      font-size: 24rpx;
+      color: #666;
+    }
+  }
+  
+  .primary-action {
+    flex: 1;
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    color: #fff;
+    text-align: center;
+    padding: 24rpx;
+    border-radius: 50rpx;
+    font-size: 32rpx;
+    font-weight: bold;
+  }
+}
+
+// 响应式适配
+@media screen and (min-width: 768px) {
+  .housekeeper-detail {
+    max-width: 750rpx;
+    margin: 0 auto;
+  }
+  
+  .tags-grid {
+    grid-template-columns: repeat(8, 1fr);
+  }
+}
+</style>
\ No newline at end of file
diff --git a/pkg_product/views/sojoumStore.vue b/pkg_product/views/sojoumStore.vue
index 4fa277f..5135579 100644
--- a/pkg_product/views/sojoumStore.vue
+++ b/pkg_product/views/sojoumStore.vue
@@ -100,7 +100,7 @@
                       'background-image': item.isTop ? ('url(' + webUrl + '/page/hotel/info-top-bg.png)') : 'none'
                     }"
                     class="info-item-header"
-                    @click="infoClick(item)">
+                    >
                     <view class="name">
                       {{ item.title }}
                     </view>
@@ -272,19 +272,22 @@
         <!-- 管家 -->
          <view v-if="activeIndex === 4" class="v12-pa-3" style="background: #F5F5F5;">
           <view v-for="(item, index) in jiaLouStewardArr" :key="index" class="steward-item">
-            <view class="st-card">
+            <view class="st-card" @click="goHousekeeperDetail(item)">
               <view class="st-left">
-                <view class="portrait-card">
+                <view class="portrait-card" >
+                  <image :src="item.mainImage" class="mainImage-wap" mode="aspectFill" />
                   <image :src="item.avatar" class="avatar" mode="aspectFill" />
-                  <view class="role-badge">旅居管家</view>
-                  <view class="name-badge">{{ item.name }}</view>
+                  <view class="gg-box">
+                    <view class="v12-font-bold gg">旅居管家</view>
+                    <view class="v12-font-bold v12-white-text">{{ item.name }}</view>
+                  </view>
                 </view>
               </view>
               <view class="st-right">
                 <view class="star">
-                  <image src="/static/images/start.png" class="star-icon" />
+                  <image :src="webUrl + '/home/管家角标.png'" class="star-icon" />
                 </view>
-                <view class="desc more-t">
+                <view class="desc more-t v12-font-bold">
                   {{ item.desc }}
                 </view>
                 <view class="tag-list">
@@ -334,7 +337,8 @@ import {
   postJiaLouZan,
   postJiaLouShare,
   getJiaLouProductList,
-  getJiaLouStewardList
+  getJiaLouStewardList,
+  getJiaLouNewsList
 } from '@/api/qianxian'
 import imgBox from '@/components/imageTypeSet/imagebox.vue'
 export default {
@@ -406,6 +410,12 @@ export default {
     }
   },
   methods: {
+    // 跳转管家详情
+    goHousekeeperDetail(item) {
+      uni.navigateTo({
+        url: '/pkg_product/views/housekeeperDetail?id=' + item.id
+      })
+    },
     getJiaLouStewardList() {
       uni.showLoading({
         title: '加载中',
@@ -539,9 +549,9 @@ export default {
       const params = {
         page: 1,
         limit: 9999,
-        sojournId: this.id
+        merId: this.id
       }
-      getJiaLouNews(params).then(res => {
+      getJiaLouNewsList(params).then(res => {
         this.infoArray = res.data.records || []
         this.isLoadInfoListSuccess = true
       })
@@ -578,7 +588,7 @@ export default {
     },
     likeInfoItemHandle(item) {
       const params = {
-        countyFamousNewsId: item.id
+        travelGroupNewsId: item.id
       }
       postJiaLouNewsZan(params).then(res => {
         const {success} = res
@@ -620,7 +630,7 @@ export default {
       }
       if(this.videoPlayers.filter(id => id === playerId).length > 1) return
       const params = {
-        countyFamousNewsId: item.id
+        travelGroupNewsId: item.id
       }
       postJiaLouNewsView(params).then(res => {
         const {success} = res
@@ -1229,6 +1239,7 @@ export default {
   align-items: center;
   justify-content: center;
   flex-direction: column;
+  overflow: hidden;
 }
 .avatar {
   width: 180rpx;
@@ -1280,11 +1291,37 @@ export default {
 }
 .tag {
   padding: 6rpx 16rpx;
-  border: 2rpx solid #E95959;
-  color: #E95959;
+  border: 2rpx solid #C52733;
+  color: #C52733;
   border-radius: 100rpx;
   font-size: 24rpx;
   margin-right: 16rpx;
   margin-top: 12rpx;
 }
+.mainImage-wap{
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  left: 0;
+  top: 0;
+  // transform: translate(-50%, -50%);
+}
+.gg-box{
+  border: 2rpx solid #FADE9F;
+  border-radius: 22rpx;
+  position: absolute;
+  width: 160rpx;
+  bottom: 12rpx;
+  left: 0;
+  right: 0;
+  margin: auto;
+  text-align: center;
+}
+.gg{
+  border-radius: 120rpx;
+  background: #FADE9F;
+  padding: 6rpx 5rpx;
+  margin-bottom: 12rpx;
+  color: #333;
+}
 </style>
\ No newline at end of file