From f65e18ea3d68bb413a9f0cd845dc0ef3f620441e Mon Sep 17 00:00:00 2001
From: BAKEYi <16298417+bakeyi@user.noreply.gitee.com>
Date: Tue, 2 Jun 2026 10:26:55 +0800
Subject: [PATCH] =?UTF-8?q?=E8=90=A5=E4=B8=9A=E6=97=B6=E9=97=B4=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/shop/business-time.vue | 567 +++++++++++++++++++++++++++++------
 1 file changed, 482 insertions(+), 85 deletions(-)

diff --git a/pages/shop/business-time.vue b/pages/shop/business-time.vue
index ed88f68..905b550 100644
--- a/pages/shop/business-time.vue
+++ b/pages/shop/business-time.vue
@@ -1,31 +1,99 @@
 <template>
   <view class="service-time-page">
-    <!-- 顶部导航栏 -->
-    <custom-navbar title="营业时间" :showBack="true"></custom-navbar>
+    <custom-navbar title="营业设置" :showBack="true"></custom-navbar>
     
-    <!-- 内容区域 -->
     <view class="content">
-      <!--营业时间卡片 -->
-      <view class="section-card">
-        <view class="section-header">
-          <view class="title-bar"></view>
-          <text class="section-title">营业时间</text>
+      
+      <view class="setting-row">
+        <text class="setting-label">当前接单状态</text>
+        <view class="custom-switch" :class="{ 'is-on': isOpenStore }" @click="toggleStatus">
+          <text class="switch-text text-on">接单中</text>
+          <text class="switch-text text-off">不接单</text>
+          <view class="switch-dot"></view>
+        </view>
+      </view>
+
+      <view class="service-time-card">
+        <view class="card-header-flex" @click="isExpandTime = !isExpandTime">
+          <text class="header-title">{{ isExpandTime ? '服务时间' : '设置服务时间' }}</text>
+          <image class="arrow-icon" :class="{ 'rotated': isExpandTime }" src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/6cfe4592-e9c6-45b6-ac45-625bc361aded.png"></image>
         </view>
         
-        <!-- 时间显示 -->
-        <view class="time-display-section">
-          <view class = "time-value-box">
-          <text class="time-value">营业时间</text>
-          <text class="time-value2">{{ currentTime }}</text>
+        <view class="time-content" v-if="isExpandTime">
+          <view class="time-blocks-container">
+            <view class="t-block">
+              <text class="t-time">{{ formatTime(startTime) }}</text>
+              <text class="t-label">开始时间</text>
+            </view>
+            <text class="t-separator">至</text>
+            <view class="t-block">
+              <text class="t-time">{{ formatTime(endTime) }}</text>
+              <text class="t-label">结束时间</text>
+            </view>
           </view>
-          <view class="change-button" @click="showTimePicker" v-if="!showBottomActions && !showTimePickerFlag">
-            <text class="change-text">信息变更 </text>
-            <image class="arrow-right" src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/b87d4918-4282-4f51-931c-292435ba5d36" mode="aspectFit"></image>
+          
+          <view class="modify-btn-outline" @click="showTimePicker" v-if="!showBottomActions && !showTimePickerFlag">
+            <image class="edit-icon" src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/d67adcda-d334-440f-87d4-d709983b0101.png"></image>
+            <text>修改服务时间</text>
+          </view>
+        </view>
+      </view>
+
+      <view class="setup-modal-mask" v-if="showSetupModal" catchtouchmove="true">
+        <view class="setup-modal-content">
+          <image class="modal-bg" src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/ac2cb4aa-a7c5-4776-98f4-b77e9c0cfa85.png"></image>
+          
+          <view class="modal-header">
+            <text>温馨提示</text>
+          </view>
+
+          <view class="modal-body">
+            <text class="modal-subtitle">发布服务请完善以下资料：</text>
+            
+            <view class="missing-list">
+              <view class="missing-item" v-if="!hasBusinessTime">
+                <view class="item-left">
+                  <image class="item-icon" src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/21b26b44-5e36-4291-8900-705a3d5bfa90.png"></image>
+                  <view class="item-texts">
+                    <text class="item-title">营业时间未配置</text>
+                    <text class="item-desc">请完善店铺的营业时间</text>
+                  </view>
+                </view>
+                <view class="item-right orange" @tap="goToBusinessTime">去配置</view>
+              </view>
+
+              <view class="missing-item" v-if="!hasServiceSkill">
+                <view class="item-left">
+                  <image class="item-icon" src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/21b26b44-5e36-4291-8900-705a3d5bfa90.png"></image>
+                  <view class="item-texts">
+                    <text class="item-title">服务技能未配置</text>
+                    <text class="item-desc">请完善服务技能</text>
+                  </view>
+                </view>
+                <view class="item-right orange" @tap="goToServiceSkill">去配置</view>
+              </view>
+
+              <view class="missing-item" v-if="!isCertified">
+                <view class="item-left">
+                  <image class="item-icon" :src="isUnderReview ? 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/25c444be-a66e-45d6-b50d-922149ff059f.png' : 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/21b26b44-5e36-4291-8900-705a3d5bfa90.png'"></image>
+                  <view class="item-texts">
+                    <text class="item-title" :class="{'blue-text': isUnderReview}">{{ isUnderReview ? '资质认证中' : '资质未认证' }}</text>
+                    <text class="item-desc">请完成资质认证</text>
+                  </view>
+                </view>
+                <view class="item-right" :class="isUnderReview ? 'grey' : 'light-green'" @tap="goToAuth">
+                  {{ isUnderReview ? '查看进度' : '去认证' }}
+                </view>
+              </view>
+            </view>
+          </view>
+
+          <view class="modal-footer">
+            <view class="btn-know" @tap="closeSetupModal">知道了</view>
           </view>
         </view>
       </view>
 
-      <!-- 营业时间选择器（五列选择器） -->
       <view class="popup" :class="{ show: showTimePickerFlag }">
         <view class="popup-mask" @click="hideTimePicker"></view>
         <view class="popup-content">
@@ -78,7 +146,6 @@
         </view>
       </view>
 
-      <!-- 底部操作按钮（在选择时间后显示） -->
       <view class="bottom-actions" v-if="showBottomActions">
         <view class="action-buttons">
           <button class="btn-cancel-large" @click="cancelChange">取消</button>
@@ -115,14 +182,62 @@ export default {
       endTime: {
         hour: '21',
         minute: '00'
+      },
+
+      // 以下为首页同步过来的弹窗与状态判定数据
+      userInfo: {},
+      authDetails: null,
+      sjId: null,
+      showSetupModal: false,
+      isExpandTime: false, // 控制服务时间卡片的折叠（false）与展开（true）
+      isLogin: true // 默认已登录
+    }
+  },
+  computed: {
+    // 依据后端详情判断是否真实处于审核中
+    isUnderReview() {
+      if (!this.isLogin) return false;
+      if (this.authDetails && Object.keys(this.authDetails).length > 0) {
+        return true; 
       }
+      return false; 
+    },
+    // 判断是否具备接单的大前提条件
+    canOpenStore() {
+      return this.hasBusinessTime && this.hasServiceSkill && this.isCertified;
+    },
+    // 判定服务技能
+    hasServiceSkill() {
+      const fromUser = this.userInfo && Array.isArray(this.userInfo.servers_kill) && this.userInfo.servers_kill.length > 0;
+      const fromAuth = this.authDetails && Array.isArray(this.authDetails.servers_kill) && this.authDetails.servers_kill.length > 0;
+      return this.isLogin && (fromUser || fromAuth);
+    },
+    // 当前开关状态显示
+    isOpenStore() {
+      if (!this.canOpenStore) {
+        return false; 
+      }
+      return this.userInfo.order_taking == 1; 
+    },
+    isSettled() {
+      if (!this.isLogin || typeof this.userInfo.id_type === 'undefined') return false;
+      return this.userInfo.id_type !== 0; 
+    },
+    isCertified() {
+      if (!this.isLogin || typeof this.userInfo.id_type === 'undefined') return false;
+      return this.userInfo.id_type > 0;
+    },
+    hasBusinessTime() {
+      const timeFromUser = this.userInfo && this.userInfo.business_time;
+      const timeFromAuth = this.authDetails && this.authDetails.business_time;
+      return this.isLogin && !!(timeFromUser || timeFromAuth);
     }
   },
   onLoad() {
     this.loadCurrentTime();
   },
   methods: {
-    // 加载当前营业时间
+    // 加载当前营业时间 (合并了首页获取用户信息的逻辑)
     async loadCurrentTime() {
       try {
         const res = await request.post('/sj/user/getuser', {
@@ -131,6 +246,10 @@ export default {
         console.log('获取用户信息响应:', res)
 
         if (res.state === 1 && res.data) {
+          // 同步给页面 userInfo 对象，以驱动计算属性与弹窗开关
+          this.userInfo = res.data;
+          this.sjId = res.data.id;
+          
           // 检查营业时间字段
           if (res.data.business_time) {
             this.currentTime = res.data.business_time
@@ -144,6 +263,11 @@ export default {
             this.originalTime = '09:00-21:00'
             this.parseTimeString('09:00-21:00')
           }
+
+          // 如果已经开启入驻，顺便拉取一下详情用于判定服务技能等
+          if (this.isSettled) {
+            this.fetchAuthDetails();
+          }
         } else {
           throw new Error(res.msg || '获取用户信息失败')
         }
@@ -161,6 +285,80 @@ export default {
       }
     },
 
+    // 弹窗路由：获取入驻详情
+    fetchAuthDetails() {
+      request.post("/sj/userSjAuth/details", {
+        type: 1, 
+        id_type: '1' 
+      }).then(res => {
+        if (res.code == 200 && res.data) {
+          this.authDetails = res.data;
+        }
+      });
+    },
+
+    // 弹窗路由：关闭弹窗
+    closeSetupModal() {
+      this.showSetupModal = false;
+    },
+    // 弹窗路由：去配置营业时间
+    goToBusinessTime() {
+      this.showSetupModal = false;
+      uni.showToast({ title: '您当前正在营业时间页面', icon: 'none' });
+    },
+    // 弹窗路由：去配置服务技能
+    goToServiceSkill() {
+      this.showSetupModal = false;
+      uni.navigateTo({ url: '/pages/shop/service-skills' });
+    },
+    // 弹窗路由：去认证
+    goToAuth() {
+      this.showSetupModal = false;
+      if (this.isUnderReview) {
+        uni.navigateTo({ url: '/pages/ruzhu/submitres' });
+      } else {
+        this.navigateToForm();
+      }
+    },
+    // 提取公共的【去填表】路由
+    navigateToForm() {
+      if (this.isSettled) {
+        uni.navigateTo({ url: '/pages/ruzhu/ruzhu?step=3' });
+      } else {
+        uni.navigateTo({ url: '/pages/ruzhu/ruzhu' });
+      }
+    },
+
+    // 核心切换逻辑：营业中 / 休息中
+    toggleStatus() {
+      const currentStatus = this.userInfo.order_taking;
+      const isCurrentlyResting = currentStatus != 1; // 当前不是营业中即为休息中
+
+      // 强力拦截：在休息中且三大件没配全，想要接单时直接拦截弹窗
+      if (isCurrentlyResting && !this.canOpenStore) {
+        this.showSetupModal = true;
+        return;
+      }
+
+      // 准备切换的新状态
+      let newStatus = currentStatus == 1 ? 2 : 1;
+      
+      uni.showLoading({ title: '切换中...', mask: true });
+
+      request.post("/sj/sjordertaking", {
+        order_taking: newStatus,
+        sjid: this.sjId 
+      }).then((res) => {
+        uni.hideLoading();
+        this.userInfo.order_taking = newStatus; // 本地状态切换
+        this.loadCurrentTime(); // 重新拉取确认最新数据
+        uni.showToast({ title: newStatus == 1 ? '已开启接单' : '已停止接单', icon: 'none' });
+      }).catch(() => {
+        uni.hideLoading();
+        uni.showToast({ title: '网络异常，切换失败', icon: 'none' });
+      });
+    },
+
     // 解析时间字符串到开始和结束时间
     parseTimeString(timeStr) {
       const times = timeStr.split('-')
@@ -261,6 +459,7 @@ export default {
     cancelChange() {
       // 恢复原来的时间
       this.currentTime = this.originalTime
+      this.parseTimeString(this.originalTime) // 同步将方块内的时间退回
       this.showBottomActions = false
       this.tempTime = ''
     },
@@ -322,7 +521,6 @@ export default {
       }
     },
 
-
     // 验证时间合理性
     validateTime(startTime, endTime) {
       const start = new Date(`2000/01/01 ${startTime.hour}:${startTime.minute}`)
@@ -340,84 +538,281 @@ export default {
 }
 
 .content {
-  padding: 20rpx;
+  padding: 40rpx 24rpx 24rpx 24rpx;
 }
 
-.section-card {
-  background: white;
-  border-radius: 20rpx;
-  padding: 22rpx;
-  margin-bottom: 20rpx;
-}
-
-.section-header {
-  display: flex;
-  align-items: center;
-  margin-bottom: 20rpx;
-}
-
-.section-title {
-  font-family: PingFangSC, PingFang SC;
-  font-weight: 500;
-  font-size: 32rpx;
-  color: #1D2129;
-  line-height: 48rpx;
-  text-align: left;
-  font-style: normal;
-}
-
-.title-bar {
-  width: 6rpx;
-  height: 30rpx;
-  background-color: #E8101E;
-  margin-right: 10rpx;
-  border-radius: 5rpx;
-}
-
-.time-display-section {
+/* 接单状态开关行样式 (依据设计图定制) */
+.setting-row {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  padding: 20rpx 0 10rpx 0 ;
+  background: #fff;
+  border-radius: 20rpx;
+  padding: 18rpx 24rpx;
+  margin-bottom: 34rpx;
 }
-
-.time-value-box {
-  font-family: PingFangSC, PingFang SC;
-  font-weight: 400;
-  font-size: 28rpx;
-  color: #333333;
-  line-height: 40rpx;
-  text-align: left;
-  font-style: normal;
-  margin-left: 16rpx;
-} 
-
-.time-value {
-  margin-right: 15rpx;
-}
-.time-value2 {
+.setting-label {
+  font-size: 30rpx;
+  color: #333;
   font-weight: 500;
 }
-
-.change-button {
+.custom-switch {
+  width: 140rpx;
+  height: 56rpx;
+  border-radius: 28rpx;
+  background-color: #D3D3D3;
+  position: relative;
   display: flex;
   align-items: center;
+  transition: background-color 0.3s;
+  box-sizing: border-box;
+  
+  &.is-on {
+    background-color: #FF4767;
+  }
+  
+  .switch-text {
+    font-size: 24rpx;
+    color: #FFFFFF;
+    position: absolute;
+    transition: opacity 0.3s;
+    font-weight: 500;
+  }
+  .text-on {
+    left: 12rpx;
+    opacity: 0;
+  }
+  .text-off {
+    right: 12rpx;
+    opacity: 1;
+  }
+  &.is-on .text-on { opacity: 1; }
+  &.is-on .text-off { opacity: 0; }
+  
+  .switch-dot {
+    width: 48rpx;
+    height: 48rpx;
+    background-color: #FFFFFF;
+    border-radius: 50%;
+    position: absolute;
+    left: 4rpx;
+    transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1);
+    box-shadow: 0 2rpx 6rpx rgba(0,0,0,0.15);
+  }
+  &.is-on .switch-dot {
+    transform: translateX(84rpx);
+  }
 }
 
-.change-text {
-  font-family: PingFangSC, PingFang SC;
+/* 展开折叠服务时间卡片样式 */
+.service-time-card {
+  background: #fff;
+  border-radius: 20rpx;
+  padding: 24rpx 24rpx;
+}
+.card-header-flex {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+.header-title {
+  font-size: 30rpx;
+  color: #333;
+  font-weight: 500;
+  transition: all 0.3s ease-in-out;
+}
+.arrow-icon {
+  width: 16rpx;
+  height: 9rpx;
+  transition: transform 0.3s;
+  transform: rotate(-360deg); /* 默认朝下 */
+}
+.arrow-icon.rotated {
+  transform: rotate(180deg); /* 展开朝上 */
+}
+.time-blocks-container {
+  margin-top: 40rpx;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.t-block {
+  width: 280rpx;
+  height: 150rpx;
+  background: #F5F5F5 ;
+  border-radius: 16rpx;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}
+.t-time {
+  font-size: 42rpx;
+  color: #333;
+  font-weight: 500;
+}
+.t-label {
+  font-size: 24rpx;
+  color: #999;
+  margin-top: 12rpx;
+}
+.t-separator {
   font-weight: 400;
   font-size: 28rpx;
-  color: #E8101E;
+  color: #999999;
   line-height: 40rpx;
-  text-align: left;
-  font-style: normal;
+}
+.modify-btn-outline {
+  margin-top: 50rpx;
+  height: 78rpx;
+  border-radius: 43rpx;
+  border: 1rpx solid #FF4767;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: #FF4767;
+  font-size: 28rpx;
+  margin-bottom: 10rpx;
+}
+.edit-icon {
+  width: 30rpx;
+  height: 30rpx;
+  margin-right: 12rpx;
 }
 
-.arrow-right {
-  margin-left: 10rpx;
-  width: 11rpx;
-  height: 22rpx;
+/* ============ 提示弹窗样式 (完全一致) ============ */
+.setup-modal-mask {
+  position: fixed;
+  top: 0; left: 0; right: 0; bottom: 0;
+  background: rgba(0, 0, 0, 0.5);
+  z-index: 9999;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  
+  .setup-modal-content {
+    width: 630rpx;
+    height: 775rpx;
+    background: #FFFFFF;
+    border-radius: 32rpx;
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    
+    .modal-bg {
+      position: absolute;
+      top: 0; left: 0;
+      width: 630rpx;
+      height: 265rpx;
+      z-index: 0;
+    }
+    
+    .modal-header {
+      position: relative;
+      z-index: 1;
+      height: 150rpx;
+      display: flex;
+      align-items: flex-end;
+      justify-content: center;
+      padding-bottom: 20rpx;
+      
+      text {
+        font-size: 36rpx;
+        font-weight: bold;
+        color: #333333;
+        letter-spacing: 2rpx;
+      }
+    }
+    
+    .modal-body {
+      position: relative;
+      z-index: 1;
+      flex: 1;
+      padding: 24rpx 40rpx;
+      
+      .modal-subtitle {
+        font-size: 28rpx;
+        color: #333333;
+        margin-bottom: 40rpx;
+        display: block;
+      }
+      
+      .missing-list {
+        display: flex;
+        flex-direction: column;
+        gap: 46rpx;
+        
+        .missing-item {
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          
+          .item-left {
+            display: flex;
+            align-items: flex-start;
+            
+            .item-icon {
+              width: 32rpx;
+              height: 32rpx;
+              margin-right: 16rpx;
+              flex-shrink: 0;
+              margin-top: 6rpx;
+            }
+            
+            .item-texts {
+              display: flex;
+              flex-direction: column;
+              
+              .item-title {
+                font-size: 30rpx;
+                color: #333333;
+                font-weight: 500;
+                margin-bottom: 8rpx;
+                
+                &.blue-text {
+                  color: #2b85e4;
+                }
+              }
+              
+              .item-desc {
+                font-size: 24rpx;
+                color: #999999;
+              }
+            }
+          }
+          
+          .item-right {
+            font-size: 26rpx;
+            font-weight: 400;
+            margin-top: -45rpx;
+            
+            &.orange { color: #FF7B00; }
+            &.grey { color: #999999; }
+            &.light-green { color: #18b566; }
+          }
+        }
+      }
+    }
+    
+    .modal-footer {
+      position: relative;
+      z-index: 1;
+      padding: 0 50rpx 50rpx;
+      
+      .btn-know {
+        width: 100%;
+        height: 88rpx;
+        background: #FF4767;
+        border-radius: 44rpx;
+        color: #FFFFFF;
+        font-size: 32rpx;
+        font-weight: 500;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+      }
+    }
+  }
 }
 
 /* 五列选择器样式 */
@@ -474,7 +869,7 @@ export default {
 
 .confirm-text {
   font-size: 32rpx;
-  color: #E8101E;
+  color: #FF4767;
   font-weight: 500;
 }
 
@@ -511,8 +906,10 @@ export default {
 }
 
 .time-label {
+  font-weight: 400;
   font-size: 26rpx;
   color: #999999;
+  line-height: 37rpx;
   margin-top: 8rpx;
 }
 
@@ -524,7 +921,7 @@ export default {
 }
 
 .time-block.active .time-value-picker {
-  color: #E8101E;
+  color: #FF4767;
 }
 
 .time-separator {
@@ -570,7 +967,7 @@ export default {
   border: none;
   width: 290rpx;
   height: 86rpx;
-  background: linear-gradient( 180deg, #F52540 0%, #E8101E 100%, #E8101E 100%);
+  background: linear-gradient(135deg, #FF4767, #FF6B8A);
   border-radius: 43rpx;
 }
 
@@ -590,7 +987,7 @@ export default {
 }
 
 .btn-confirm-large {
-  background: #E8101E;
+  background: linear-gradient(135deg, #FF4767, #FF6B8A);
   color: white;
 }
 </style>
\ No newline at end of file