更新 套餐 数据对比

wenjuan
鹿和sa0ChunLuyu 1 year ago
parent 683dba44c4
commit 0dadadc68d

@ -1,6 +1,5 @@
{ {
"pages": [ "pages": [{
{
"path": "pages/main/index/index", "path": "pages/main/index/index",
"style": { "style": {
"navigationBarTitleText": "海南现代妇女儿童医院", "navigationBarTitleText": "海南现代妇女儿童医院",
@ -157,6 +156,12 @@
"style": { "style": {
"navigationBarTitleText": "体检预约" "navigationBarTitleText": "体检预约"
} }
},
{
"path": "pages/buy/contrast/contrast",
"style": {
"navigationBarTitleText": "数据对比"
}
} }
], ],
"globalStyle": { "globalStyle": {

@ -0,0 +1,487 @@
<script setup>
/**
* name
* usersa0ChunLuyu
* date2024年9月11日 19:24:50
*/
import {
ref,
computed
} from 'vue'
import {
$api,
$response
} from '@/api'
import {
onShow
} from '@dcloudio/uni-app'
import {
useStore
} from '@/store'
const $store = useStore()
const combo_info = ref([null, null, null])
const item_info = computed(() => {
let item_map = {}
for (let i = 0; i <= 2; i++) {
if (!!combo_info.value[i]) {
for (let j = 0; j <= combo_info.value[i].items.length - 1; j++) {
let item_id = combo_info.value[i].items[j].id
if (!(item_id in item_map)) {
item_map[item_id] = {
name: combo_info.value[i].items[j].name,
value: [false, false, false]
}
}
item_map[item_id].value[i] = true
}
}
}
let data = []
for (let i in item_map) {
if (!same_item_show.value) {
data.push(item_map[i])
} else {
let count = 0;
for (let j = 0; j <= 2; j++) {
if (!combo_info.value[j]) {
count++
} else {
let item_id = combo_info.value[j].items[j].id
if (item_map[i].value[j]) {
count++
}
}
}
if (count !== 3) {
data.push(item_map[i])
}
}
}
return data
})
const base_info = computed(() => {
let data = [{
title: '体检类型',
value: ['-', '-', '-']
}, {
title: '预约人数',
value: ['-', '-', '-']
}, {
title: '项目数量',
value: ['-', '-', '-']
}, {
title: '性别婚否',
value: ['-', '-', '-']
}]
for (let i = 0; i <= 2; i++) {
if (!!combo_info.value[i]) {
data[0].value[i] = !!combo_info.value[i].checkup_type_name ? combo_info.value[i].checkup_type_name : '-'
data[1].value[i] = `${combo_info.value[i].saleCount}`
data[2].value[i] = `${combo_info.value[i].item_count}`
let sex = '通用'
if (combo_info.value[i].sex !== 0) {
if (combo_info.value[i].sex === 1) {
sex = '男通用'
} else {
sex = '女通用'
}
}
data[3].value[i] = sex
}
}
return data
})
const getComboCompare = async () => {
let combo_ids = []
for (let i in $store.combo_compare) {
if (!!$store.combo_compare[i]) {
combo_ids.push($store.combo_compare[i])
}
}
if (combo_ids.length > 0) {
uni.showLoading()
const response = await $api('ComboCompare', {
combo_ids
})
uni.hideLoading()
$response(response, () => {
combo_info.value = [null, null, null]
if (response.data.list.length > 0) {
combo_info.value[0] = response.data.list[0]
}
if (response.data.list.length > 1) {
combo_info.value[1] = response.data.list[1]
}
if (response.data.list.length > 2) {
combo_info.value[2] = response.data.list[2]
}
})
}
}
const closeComboClick = (index) => {
let combo_id = combo_info.value[index].combo_id
combo_info.value[index] = null
for (let i in $store.combo_compare) {
if (!!$store.combo_compare[Number(i)] && $store.combo_compare[Number(i)].combo_id === combo_id) {
$store.combo_compare[Number(i)] = null
}
}
}
const mountedAction = () => {
getComboCompare()
}
const config_ref = ref(null)
const configRef = (e) => {
if (!config_ref.value) {
config_ref.value = e
mountedAction()
}
}
const chooseComboClick = () => {
uni.navigateBack()
}
const toComboClick = (index) => {
if (!!combo_info.value[index]) {
let query = "?comboId=" + combo_info.value[index].combo_id;
uni.navigateTo({
url: "/pages/main/tj/tjxq" + query,
});
}
}
const same_item_show = ref(false)
const changeSwitch = () => {
same_item_show.value = !same_item_show.value
}
onShow(() => {
if (!!config_ref.value) {
mountedAction()
}
})
</script>
<template>
<view>
<view v-if="!!$store.config">
<view :ref="configRef"></view>
</view>
<view class="top_background_wrapper"></view>
<view class="combo_list_wrapper">
<view class="combo_item_wrapper" v-for="(i,k) in 3" :key="k">
<view v-if="!!combo_info[k]">
<view @click="closeComboClick(k)" class="combo_close_wrapper">
<image src="@/static/assets/contrast/close@2x.png"></image>
</view>
<view class="combo_name_wrapper">{{ combo_info[k].name }}</view>
<view class="combo_price_wrapper">¥ {{ combo_info[k].price }}</view>
<view @click="toComboClick(k)" class="combo_choose_wrapper">立即预约</view>
</view>
<view @click="chooseComboClick()" v-else>
<view class="add_icon_wrapper">
<image src="@/static/assets/contrast/add@2x.png"></image>
</view>
<view class="add_text_wrapper">添加套餐</view>
</view>
</view>
</view>
<view class="item_info_wrapper">
<view class="title_wrapper">基本信息</view>
<view class="table_wrapper">
<view class="table_line_wrapper" v-for="(i,k) in base_info" :key="k">
<view class="table_title_wrapper">{{ i.title }}</view>
<view class="table_item_wrapper" v-for="(ii,ik) in i.value" :key="ik">{{ ii }}</view>
</view>
</view>
<view class="title_line_wrapper">
<view class="title_wrapper">项目信息</view>
<view class="show_wrapper">
<view class="show_text_wrapper">隐藏相同项目</view>
<switch @change="changeSwitch" style="transform:scale(0.6)" />
</view>
</view>
<view class="table_wrapper table_large_wrapper">
<view class="table_large_line_wrapper" v-if="item_info.length === 0">
<view class="table_large_title_wrapper">
<view class="table_large_title_show_wrapper">
<view></view>
<view></view>
<view></view>
<view></view>
</view>
</view>
</view>
<view class="table_large_line_wrapper" v-for="(i,k) in item_info" :key="k">
<view class="table_large_title_wrapper">
<view class="table_large_title_show_wrapper" v-if="k === 0">
<view></view>
<view></view>
<view></view>
<view></view>
</view>
</view>
<view class="table_item_wrapper table_large_item_wrapper" v-for="(ii,ik) in i.value" :key="ik">
<view class="table_large_text_wrapper">{{ ii ? i.name : '-' }}</view>
</view>
</view>
</view>
</view>
</view>
</template>
<style scoped>
.show_text_wrapper {
font-size: 14rpx;
color: #05050580;
}
.show_wrapper {
display: flex;
align-items: center;
margin-top: 40rpx;
}
.title_line_wrapper {
display: flex;
align-items: center;
justify-content: space-between;
}
.table_large_title_wrapper {
font-weight: 400;
font-size: 20rpx;
color: #050505;
line-height: 60rpx;
text-align: center;
width: 142rpx;
text-align: center;
background: #F2F2F2;
height: 91rpx;
position: relative;
border-bottom: 1rpx solid #F2F2F2;
}
.table_large_title_show_wrapper {
position: absolute;
top: 0;
left: 0;
right: 0;
height: 100%;
height: 430rpx;
padding-top: 170rpx;
z-index: 9;
background: #F2F2F2;
}
.table_wrapper {
width: calc(142rpx + 182rpx + 182rpx + 182rpx);
margin: 27rpx auto 0;
border: 1rpx solid #E5E5E5;
border-radius: 5rpx;
}
.table_large_wrapper {
min-height: 600rpx;
}
.table_line_wrapper {
display: flex;
align-items: center;
font-weight: 400;
font-size: 20rpx;
color: #050505;
line-height: 61rpx;
border-bottom: 1rpx solid #E5E5E5;
}
.table_large_line_wrapper {
display: flex;
align-items: center;
font-weight: 400;
font-size: 20rpx;
color: #050505;
line-height: 61rpx;
}
.table_title_wrapper {
width: 142rpx;
height: 61rpx;
line-height: 61rpx;
text-align: center;
background: #F2F2F2;
}
.table_line_wrapper:last-child {
border-bottom: none;
}
.table_item_wrapper {
width: 182rpx;
height: 61rpx;
line-height: 61rpx;
text-align: center;
border-left: 1rpx solid #E5E5E5;
}
.table_large_item_wrapper {
height: 91rpx;
line-height: 30rpx;
display: flex;
align-items: center;
justify-content: center;
border-bottom: 1rpx solid #E5E5E5;
}
.table_large_line_wrapper:last-child .table_large_item_wrapper {
border-bottom: none;
}
.table_large_text_wrapper {
width: 170rpx;
margin: 0 auto;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
text-overflow: ellipsis;
word-break: break-all;
text-align: center;
}
.item_info_wrapper {
width: 730rpx;
background: #FFFFFF;
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 0, 0, 0.04);
border-radius: 5rpx;
margin: 15rpx auto 0;
overflow: hidden;
padding-bottom: 33rpx;
}
.title_wrapper {
width: 180rpx;
height: 60rpx;
background: linear-gradient(90deg, #EDF6F5 0%, #BBDFE1 99%);
border-radius: 0rpx 30rpx 30rpx 0rpx;
font-weight: bold;
font-size: 25rpx;
color: #123531;
text-align: center;
line-height: 60rpx;
margin-top: 40rpx;
margin-left: 20rpx;
overflow: hidden;
}
.combo_choose_wrapper {
width: 180rpx;
height: 54rpx;
background: #239EA3;
border-radius: 8rpx;
margin: 23rpx auto 0;
font-weight: 500;
font-size: 24rpx;
color: #F1F7F7;
line-height: 54rpx;
text-align: center;
}
.combo_price_wrapper {
font-weight: 500;
font-size: 30rpx;
color: #EC3D15;
line-height: 1;
margin-top: 8rpx;
text-align: center;
}
.combo_name_wrapper {
width: 150rpx;
font-weight: bold;
font-size: 28rpx;
color: #0E0E0E;
line-height: 40rpx;
margin: 35rpx auto 0;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
text-overflow: ellipsis;
word-break: break-all;
text-align: center;
}
.combo_close_wrapper {
position: absolute;
width: 18rpx;
height: 19rpx;
top: 7rpx;
right: 11rpx;
}
.combo_close_wrapper image {
width: 18rpx;
height: 19rpx;
display: block;
object-fit: contain;
}
.add_text_wrapper {
text-align: center;
font-weight: 500;
font-size: 24rpx;
color: #239EA3;
line-height: 1;
margin-top: 31rpx;
}
.add_icon_wrapper {
width: 91rpx;
height: 101rpx;
margin: 44rpx auto 0;
}
.add_icon_wrapper image {
width: 91rpx;
height: 101rpx;
display: block;
object-fit: contain;
}
.combo_item_wrapper {
width: 230rpx;
height: 240rpx;
background: #F7F7F7;
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 0, 0, 0.04);
border-radius: 10rpx;
position: relative;
}
.top_background_wrapper {
position: absolute;
left: 0;
right: 0;
top: 0;
height: 38rpx;
background: #239EA3;
z-index: 0;
}
.combo_list_wrapper {
position: relative;
z-index: 1;
width: 730rpx;
height: 260rpx;
background: #FFFFFF;
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 0, 0, 0.04);
border-radius: 15rpx;
margin: 0 auto;
display: flex;
align-items: center;
justify-content: space-around;
}
</style>

@ -169,6 +169,18 @@ const buyClick = async (item) => {
url: "/pages/main/tj/tjxq" + query, url: "/pages/main/tj/tjxq" + query,
}); });
}; };
const toComboCompare = async (item) => {
for(let i in $store.combo_compare){
if(!$store.combo_compare[Number(i)]){
$store.combo_compare[Number(i)] = item.combo_id;
break;
}
}
uni.navigateTo({
url: "/pages/buy/contrast/contrast"
});
};
</script> </script>
<template> <template>
<view> <view>
@ -296,7 +308,7 @@ const buyClick = async (item) => {
</view> </view>
</view> </view>
<view class="combo_button_wrapper"> <view class="combo_button_wrapper">
<view class="combo_pick_button_wrapper">对比</view> <view @click="toComboCompare(i)" class="combo_pick_button_wrapper">对比</view>
<view class="combo_buy_button_wrapper" @click="buyClick(i)" <view class="combo_buy_button_wrapper" @click="buyClick(i)"
>预约</view >预约</view
> >

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

@ -8,6 +8,7 @@ export const useStore = defineStore('counter', {
yytjInfo: {}, yytjInfo: {},
config: false, config: false,
groupInfo: {}, // 团检信息 groupInfo: {}, // 团检信息
combo_compare: [null, null, null], // 套餐对比
save: { save: {
hospital: 1, hospital: 1,
doctor: 1, doctor: 1,

Loading…
Cancel
Save