|
|
|
|
@ -1,5 +1,6 @@
|
|
|
|
|
<script setup>
|
|
|
|
|
import DraggableButton from "@/pages/components/goHome.vue";
|
|
|
|
|
import Top from "../../../common/Top.vue";
|
|
|
|
|
/**
|
|
|
|
|
* name：
|
|
|
|
|
* user：sa0ChunLuyu
|
|
|
|
|
@ -23,6 +24,10 @@
|
|
|
|
|
// comboId 套餐ID 没有套餐ID就是个人自选项目
|
|
|
|
|
// itemIds 自选ID
|
|
|
|
|
const $props = defineProps({
|
|
|
|
|
type: {
|
|
|
|
|
type: String,
|
|
|
|
|
default: "",
|
|
|
|
|
},
|
|
|
|
|
comboId: {
|
|
|
|
|
type: String,
|
|
|
|
|
default: "",
|
|
|
|
|
@ -335,6 +340,18 @@
|
|
|
|
|
await getBuyInfo()
|
|
|
|
|
popupItemList.value.close()
|
|
|
|
|
}
|
|
|
|
|
const tabsClickFunc=(value)=>{
|
|
|
|
|
if(value==0){
|
|
|
|
|
uni.navigateTo({
|
|
|
|
|
url: "/pages/main/combo/combo"
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
if(value==1){
|
|
|
|
|
uni.navigateTo({
|
|
|
|
|
url: "/pages/main/combo/combo?tabs=1"
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
onShow(() => {
|
|
|
|
|
if (!!config_ref.value) {
|
|
|
|
|
mountedAction();
|
|
|
|
|
@ -468,89 +485,129 @@
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
</uni-popup>
|
|
|
|
|
<view class="bg-#d8edf2">
|
|
|
|
|
<uni-search-bar class="search" radius="100" placeholder="请输入关键字搜索" @clear="getAllItems()"
|
|
|
|
|
@cancel="getAllItems()" @confirm="getAllItems" />
|
|
|
|
|
</view>
|
|
|
|
|
<view class="mt-20rpx flex min-h-100%" style="background-color: #eef7f7;">
|
|
|
|
|
<view class="min-w-214rpx max-w-214rpx mr-20rpx min-h-100% text-center">
|
|
|
|
|
<view class="w-100% rounded-r-full text-#0E0E0E text-25rpx px-20rpx w-100% center h-84rpx box-border"
|
|
|
|
|
v-for="(item, index) in leftList" :key="index" :class="{
|
|
|
|
|
'bg-gradient-to-r from-#edf6f5 to-#bbdfe2': tabIndex == index,
|
|
|
|
|
}" @click="
|
|
|
|
|
() => {
|
|
|
|
|
tabIndex = index;
|
|
|
|
|
rightLeft = item.children;
|
|
|
|
|
headImg = item.head_img;
|
|
|
|
|
}
|
|
|
|
|
">
|
|
|
|
|
{{ item.title }}
|
|
|
|
|
</view>
|
|
|
|
|
<view style="height: 150rpx;"></view>
|
|
|
|
|
<view class="tjzx_main">
|
|
|
|
|
<Top v-if="$props.type=='zx'" ></Top>
|
|
|
|
|
<view class="bg-#d8edf2">
|
|
|
|
|
<uni-search-bar class="search" radius="100" placeholder="请输入关键字搜索" @clear="getAllItems()"
|
|
|
|
|
@cancel="getAllItems()" @confirm="getAllItems" />
|
|
|
|
|
</view>
|
|
|
|
|
<view class="grow min-h-100% bg-#fff pb-200rpx">
|
|
|
|
|
|
|
|
|
|
<view v-for="(item, index) in rightLeft" :key="index" :class="{
|
|
|
|
|
'!b-0': index == rightLeft.length - 1,
|
|
|
|
|
}" class="flex justify-between center py-30rpx px-20rpx b-b-1px b-b-solid b-b-#e5e5e5">
|
|
|
|
|
<view class="w-40% text-#0E0E0E text-24rpx flex items-center">
|
|
|
|
|
<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="#009fa8" type="help-filled" size="14"></uni-icons>
|
|
|
|
|
</uni-tooltip>
|
|
|
|
|
<view class="top_button_row" v-if="$props.type=='zx'">
|
|
|
|
|
<view @click="tabsClickFunc(0)" class="top_button">选择套餐</view>
|
|
|
|
|
<view @click="tabsClickFunc(1)" class="top_button">专家定制</view>
|
|
|
|
|
<view @click="tabsClickFunc(2)" class="top_button top_button_active">项目自选</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="mt-0rpx flex min-h-100%" style="background-color: #eef7f7;">
|
|
|
|
|
<view class="min-w-214rpx max-w-214rpx mr-20rpx min-h-100% text-center">
|
|
|
|
|
<view class="w-100% rounded-r-full text-#0E0E0E text-25rpx px-20rpx w-100% center h-84rpx box-border"
|
|
|
|
|
v-for="(item, index) in leftList" :key="index" :class="{
|
|
|
|
|
'bg-gradient-to-r from-#edf6f5 to-#bbdfe2': tabIndex == index,
|
|
|
|
|
}" @click="
|
|
|
|
|
() => {
|
|
|
|
|
tabIndex = index;
|
|
|
|
|
rightLeft = item.children;
|
|
|
|
|
headImg = item.head_img;
|
|
|
|
|
}
|
|
|
|
|
">
|
|
|
|
|
{{ item.title }}
|
|
|
|
|
</view>
|
|
|
|
|
<view class="w-58% items-end flex justify-between" @click="XuanZeItem(item)">
|
|
|
|
|
<text class="text-#EC3D15 text-26rpx">¥ {{ item.price }}</text>
|
|
|
|
|
<text class="text-#9e9d9d text-20rpx line-through">¥ {{ item.original_price }}</text>
|
|
|
|
|
<view :class="{
|
|
|
|
|
'!bg-#009fa8 !b-#008e99': selectIds.includes(item.id),
|
|
|
|
|
}" class="w-24rpx h-24rpx b-1 b-solid b-#c3e9eb bg-#ccecee rounded-8rpx center">
|
|
|
|
|
<image v-if="selectIds.includes(item.id)" class="w-20rpx" src="@/static/assets/select.png"
|
|
|
|
|
mode="widthFix" />
|
|
|
|
|
<view style="height: 150rpx;"></view>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="grow min-h-100% bg-#fff pb-200rpx">
|
|
|
|
|
|
|
|
|
|
<view v-for="(item, index) in rightLeft" :key="index" :class="{
|
|
|
|
|
'!b-0': index == rightLeft.length - 1,
|
|
|
|
|
}" class="flex justify-between center py-30rpx px-20rpx b-b-1px b-b-solid b-b-#e5e5e5">
|
|
|
|
|
<view class="w-40% text-#0E0E0E text-24rpx flex items-center">
|
|
|
|
|
<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="#009fa8" type="help-filled" size="14"></uni-icons>
|
|
|
|
|
</uni-tooltip>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="w-58% items-end flex justify-between" @click="XuanZeItem(item)">
|
|
|
|
|
<text class="text-#EC3D15 text-26rpx">¥ {{ item.price }}</text>
|
|
|
|
|
<text class="text-#9e9d9d text-20rpx line-through">¥ {{ item.original_price }}</text>
|
|
|
|
|
<view :class="{
|
|
|
|
|
'!bg-#009fa8 !b-#008e99': selectIds.includes(item.id),
|
|
|
|
|
}" class="w-24rpx h-24rpx b-1 b-solid b-#c3e9eb bg-#ccecee rounded-8rpx center">
|
|
|
|
|
<image v-if="selectIds.includes(item.id)" class="w-20rpx" src="@/static/assets/select.png"
|
|
|
|
|
mode="widthFix" />
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
<view style="z-index: 999;"
|
|
|
|
|
class="fixed bottom-0 left-0 w-100% h-150rpx bg-gradient-to-r from-#02b4bd to-#ABD7D7 px-20rpx py-30rpx box-border items-center flex justify-between">
|
|
|
|
|
<view style="position: relative;" class="w-110rpx h-129rpx ml-60rpx mt-5rpx" @click="openPopupItemList()">
|
|
|
|
|
<image class="w-110rpx h-129rpx" src="@/static/assets/buy/xiong.png" mode="widthFix" />
|
|
|
|
|
<view class="yuandian">
|
|
|
|
|
{{ selectIds.length }}
|
|
|
|
|
|
|
|
|
|
<view style="z-index: 999;"
|
|
|
|
|
class="fixed bottom-0 left-0 w-100% h-150rpx bg-gradient-to-r from-#02b4bd to-#ABD7D7 px-20rpx py-30rpx box-border items-center flex justify-between">
|
|
|
|
|
<view style="position: relative;" class="w-110rpx h-129rpx ml-60rpx mt-5rpx" @click="openPopupItemList()">
|
|
|
|
|
<image class="w-110rpx h-129rpx" src="@/static/assets/buy/xiong.png" mode="widthFix" />
|
|
|
|
|
<view class="yuandian">
|
|
|
|
|
{{ selectIds.length }}
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="grow" style="margin-left: 10rpx;">
|
|
|
|
|
<view class="flex items-end">
|
|
|
|
|
<text class="text-46rpx text-#e95513 ml-20rpx mr-5rpx">¥</text>
|
|
|
|
|
<text class="text-46rpx text-#e95513 mr-10rpx font-bold">{{
|
|
|
|
|
optionalPrice || 0
|
|
|
|
|
}}</text>
|
|
|
|
|
<text v-if="optionalOriginalPrice" class="text-26rpx text-#3e3a39 line-through">¥
|
|
|
|
|
{{ optionalOriginalPrice }}</text>
|
|
|
|
|
<view class="grow" style="margin-left: 10rpx;">
|
|
|
|
|
<view class="flex items-end">
|
|
|
|
|
<text class="text-46rpx text-#e95513 ml-20rpx mr-5rpx">¥</text>
|
|
|
|
|
<text class="text-46rpx text-#e95513 mr-10rpx font-bold">{{
|
|
|
|
|
optionalPrice || 0
|
|
|
|
|
}}</text>
|
|
|
|
|
<text v-if="optionalOriginalPrice" class="text-26rpx text-#3e3a39 line-through">¥
|
|
|
|
|
{{ optionalOriginalPrice }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view @click="confirm()" class="button">
|
|
|
|
|
确认项目
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view @click="confirm()" class="button">
|
|
|
|
|
确认项目
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
<style>
|
|
|
|
|
.uni-tooltip-popup {
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
<style>
|
|
|
|
|
<style scoped>
|
|
|
|
|
.search{
|
|
|
|
|
margin-top: -10rpx;
|
|
|
|
|
}
|
|
|
|
|
.tjzx_main{
|
|
|
|
|
padding-top: 20rpx;
|
|
|
|
|
background-color: #D8EEF3;
|
|
|
|
|
}
|
|
|
|
|
.top_button_row {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
padding-left: 20rpx;
|
|
|
|
|
padding-right: 20rpx;
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
.top_button {
|
|
|
|
|
color: #666;
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
padding: 6rpx 40rpx;
|
|
|
|
|
border-radius: 15rpx;
|
|
|
|
|
margin-top: -6rpx;
|
|
|
|
|
margin-bottom: 8rpx;
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
width: 140rpx;
|
|
|
|
|
text-align: center;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.top_button_active {
|
|
|
|
|
background-color: #009ea7;
|
|
|
|
|
color: #fff;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.button {
|
|
|
|
|
color: #00828e;
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
|
yanzai
10 months ago