1.增加推荐套餐弹窗，未完成

2.创建自选详情页面

h5/pages.json

@@ -71,6 +71,14 @@
 			"style": {
 				"navigationBarTitleText": "支付完成"
 			}
+		},
+		{
+			"path": "pages/main/optionalProject/optionalDetails",
+			"style": {
+				"navigationBarTitleText": "自选项目详情",
+				"navigationBarBackgroundColor": "#D8EDF2",
+				"navigationBarTextStyle": "black"
+			}
 		}
 	],
 	"globalStyle": {

h5/pages/main/optionalProject/optionalDetails.vue

@@ -0,0 +1,49 @@
+<script setup>
+	/**
+	 * name：
+	 * user：sa0ChunLuyu
+	 * date：2024年9月11日 19:24:50
+	 */
+	import {
+		ref
+	} from 'vue'
+	import {
+		$api,
+		$response
+	} from '@/api'
+	import {
+		onShow
+	} from '@dcloudio/uni-app'
+	import {
+		useStore
+	} from '@/store'
+	const $store = useStore()
+
+	const mountedAction = () => {
+
+	}
+
+	const config_ref = ref(null)
+	const configRef = (e) => {
+		if (!config_ref.value) {
+			config_ref.value = e
+			mountedAction()
+		}
+	}
+
+	onShow(() => {
+		if (!!config_ref.value) {
+			mountedAction()
+		}
+	})
+</script>
+<template>
+	<view>
+		<view v-if="!!$store.config">
+			<view :ref="configRef"></view>
+		</view>
+	</view>
+</template>
+<style scoped>
+
+</style>

h5/pages/main/optionalProject/optionalProject.vue

@@ -10,10 +10,6 @@ import { onShow } from "@dcloudio/uni-app";
 import { useStore } from "@/store";
 
 const $props = defineProps({
-  hospital: {
-    type: String,
-    default: "",
-  },
   comboId: {
     type: String,
     default: "",
@@ -38,6 +34,22 @@ let optionalOriginalPrice = ref(0); //自选原始价格
 let totalPrice = ref(0); // 总折扣价格
 let totalOriginalPrice = ref(0); // 总原始价格
 let total = ref(0); // 总项目数
+let comboId = ref(0); // 套餐id
+let recommendPackageList = ref([]); // 推荐套餐列表
+let popup = ref(null);
+
+const getComboRecommend = async () => {
+  const response = await $api("ComboRecommend", {
+    person_id: $store.save_info.user_id || 1,
+    item_ids: selectIds.value,
+  });
+  $response(response, () => {
+    recommendPackageList.value = response.data.combos;
+    if (recommendPackageList.value.length) {
+      popup.value.open("center");
+    }
+  });
+};
 
 const getAllItems = async (e) => {
   // 获取全部项目
@@ -56,11 +68,15 @@ const getAllItems = async (e) => {
 };
 
 const getBuyInfo = async () => {
-  const response = await $api("BuyInfo", {
+  // 获取购买信息
+  let obj = {
     item_ids: selectIds.value,
-    hospital: $props.hospital,
+    hospital: $store.save_info.hospital,
-    combo_id: $props.comboId,
+  };
-  });
+  if (comboId.value) {
+    obj.combo_id = comboId.value;
+  }
+  const response = await $api("BuyInfo", obj);
   $response(response, () => {
     packagePrice.value = response.data.combo_info.price;
     packageOriginalPrice.value = response.data.combo_info.original_price;
@@ -74,8 +90,12 @@ const getBuyInfo = async () => {
 
 const mountedAction = () => {
   selectIds.value = $props.itemIds?.split(",") || [];
+  comboId.value = Number($props.comboId);
   getAllItems(); // 获取全部项目
-  getBuyInfo(); // 获取购买信息
+  getComboRecommend();
+  if (comboId.value) {
+    getBuyInfo(); // 获取购买信息
+  }
 };
 
 const config_ref = ref(null);
@@ -98,6 +118,17 @@ onShow(() => {
       <view :ref="configRef"></view>
     </view>
   </view>
+  <uni-popup ref="popup">
+    <view class="bg-#fff rounded-15rpx w-95vw px-20rpx box-border">
+      <view class="center relative pt-47rpx pb-32rpx text-36rpx">
+        <text class="line-height-[1]">推荐套餐</text>
+        <uni-icons @click="popup.close()" type="closeempty" color="#A6A6A6" size="26" class="absolute right-40rpx top-30rpx"></uni-icons>
+      </view>
+      <view v-for="(item, index) in recommendPackageList" :key="index">
+        <image :src="$image(item.cover)" mode="widthFix" />
+      </view>
+    </view>
+  </uni-popup>
   <view class="bg-#d8edf2">
     <uni-search-bar
       class="search"
@@ -118,15 +149,17 @@ onShow(() => {
           'bg-gradient-to-r from-#edf6f5 to-#bbdfe2': tabIndex == index,
         }"
         @click="
-          (tabIndex = index),
+          () => {
-            (rightLeft = item.children),
+            tabIndex = index;
-            (headImg = item.head_img)
+            rightLeft = item.children;
+            headImg = item.head_img;
+          }
         "
       >
         {{ item.title }}
       </view>
     </view>
-    <view class="grow h-100% bg-#fff">
+    <view class="grow h-100% bg-#fff pb-200rpx">
       <image class="w-full" mode="widthFix" :src="$image(headImg)"></image>
       <view
         v-for="(item, index) in rightLeft"
@@ -135,19 +168,35 @@ onShow(() => {
           '!b-0': index == rightLeft.length - 1,
         }"
         class="flex justify-between center py-30rpx px-20rpx b-b-1px b-b-solid b-b-#e5e5e5"
-        @click="
-          () => {
-            if (selectIds.includes(item.id)) {
-              selectIds.splice(selectIds.indexOf(item.id), 1);
-            } else {
-              selectIds.push(item.id);
-            }
-            getBuyInfo();
-          }
-        "
       >
-        <text class="w-40% text-#0E0E0E text-25rpx">{{ item.title }}</text>
+        <view class="w-40% text-#0E0E0E text-25rpx flex items-center">
-        <view class="w-58% items-end flex justify-between">
+          <text>{{ item.title }}</text>
+          <uni-tooltip>
+            <!-- 定义插槽，插槽名为 content -->
+            <template v-slot:content>
+              <!-- 在这里编写自定义的 HTML 或组件 -->
+              <view class="w-30vw">
+                <text>{{ item.desc }}</text>
+              </view>
+            </template>
+
+            <!-- 触发提示的按钮 -->
+            <uni-icons color="#239ea4" type="help-filled" size="14"></uni-icons>
+          </uni-tooltip>
+        </view>
+        <view
+          class="w-58% items-end flex justify-between"
+          @click="
+            () => {
+              if (selectIds.includes(item.id)) {
+                selectIds.splice(selectIds.indexOf(item.id), 1);
+              } else {
+                selectIds.push(item.id);
+              }
+              getBuyInfo();
+            }
+          "
+        >
           <text class="text-#EC3D15 text-26rpx">¥ {{ item.price }}</text>
           <text class="text-#9e9d9d text-20rpx line-through"
             >¥ {{ item.original_price }}</text
@@ -178,7 +227,7 @@ onShow(() => {
       您需付费 \n{{ total }}个项目
     </text>
     <view class="grow">
-      <view class="flex items-end">
+      <view class="flex items-end" v-if="comboId != 0">
         <text class="text-18rpx text-#878787">套餐价格</text>
         <text class="text-21rpx text-#ED6907 mx-20rpx"
           >¥ {{ packagePrice }}</text
@@ -209,14 +258,38 @@ onShow(() => {
     </view>
     <button
       type="primary"
+      @click="
+        async () => {
+          if (comboId) {
+            // 增加自选
+            uni.navigateBack({ delta: 1 });
+          } else {
+            // 自选
+            if (!selectIds.value.length) {
+              uni.$lu.toast('请选择项目');
+              return;
+            }
+            if (selectIds.value.length <= 1) {
+              // 少量自选跳转自选详情
+              uni.navigateTo('/pages/main/optionalProject/optionalDetails');
+              return;
+            }
+            if (selectIds.value.length > 1) {
+              // 多个自选触发推荐套餐
+              getComboRecommend();
+              return;
+            }
+          }
+        }
+      "
       class="text-#F8F8F8 w-240rpx h-hull rounded-full !bg-#239EA3 !mx-0 text-30rpx"
     >
       确定
     </button>
   </view>
 </template>
-<style scoped>
+<style>
-.search > .uni-searchbar__box {
+.uni-tooltip-popup {
-  justify-content: flex-start !important;
+  background-color: #fff;
 }
 </style>