预约时间选日历完成

wenjuan
刘佳宇 1 year ago
parent 84a81a7932
commit c8315c975c

@ -363,11 +363,11 @@ const toRouter = (url, status) => {
>
<text>{{ val.name }}</text>
<text class="ml-20rpx mr-auto text-#239EA3">{{ val.time }}</text>
<text style="font-size: 30rpx;">{{ val.time ? "重新预约" : "预约时间" }}</text>
<text class="text-30rpx">{{ val.time ? "重新预约" : "预约时间" }}</text>
</view>
<view class="mb-20rpx between">
<text>体检医生</text>
<text style="font-size: 30rpx;">{{ yytjInfo?.doctor_name || "选择医生" }}</text>
<text class="text-30rpx">{{ yytjInfo?.doctor_name || "选择医生" }}</text>
</view>
</view>
</view>

@ -10,14 +10,11 @@ import { $api, $response, $image } from "@/api";
import { onShow } from "@dcloudio/uni-app";
import { useStore } from "@/store";
const $store = useStore();
const dqDate = ref("");
const doctor_name = ref("");
let date_list = ref(false);
let time_list = ref(false);
let currentDate = ref(0);
let currentTime = ref(0);
let currentXmmcObj = ref(false); //
let buyInfo = ref({}); //
let yytjInfo = ref({}); //
let groupInfo = ref({});
@ -28,6 +25,8 @@ let nmrIndex = ref(0); // 当前选中项目索引
let time = ref(""); //
let timeIndex = ref(null); //
let status = ref(0); // 1 2
let calendarShow = ref(false); //
const rl_list = ref(false); //
const mountedAction = async () => {
uni.showLoading({
@ -47,6 +46,7 @@ onBeforeUnmount(() => {
});
const getnmrList = async () => {
//
const response = await $api("BuyInfo", buyInfo.value);
$response(response, () => {
if (buyInfo.value.group_id && response.data.group_info.length) {
@ -78,6 +78,45 @@ const getnmrList = async () => {
uni.hideLoading();
});
};
const moreTime = async (m) => {
//
const [year, month, day] = currentDate.value.split("-");
let dqmonth = m || `${year}-${month}`; //
let obj = {
hospital: buyInfo.value.hospital,
person_id: buyInfo.value.person_id,
month: dqmonth, //
use_type: buyInfo.value.group_id ? 2 : 1,
checkup_type_id: buyInfo.value.group_id
? $store.getGroupInfo()?.checkup_type_id
: $store.getCheckupTypeId()?.id,
amount: truePrice.value,
};
const response = await $api("GetMonthPlanCount", obj);
$response(response, () => {
console.log(response.data.list, "response.data.list");
let rlArr = [];
response.data.list.forEach((item) => {
let o = {
date: item.date,
info: "余号" + item.count,
};
rlArr.push(o);
});
rl_list.value = rlArr;
calendarShow.value = true;
});
};
const monthSwitch = (e) => {
let [year, month] = getToday().split("-");
if (e.year >= year && e.month >= month) {
console.log(e, "monthSwitch");
let str = `${e.year}-${e.month}`;
moreTime(str);
}
};
const getToday = () => {
//
var today = new Date();
@ -144,6 +183,22 @@ const getTjTimeList = async (val) => {
});
};
const changerl = (e) => {
//
console.log(e, "changerl");
let num = e.extraInfo.info ? e.extraInfo.info.substring(2) : 0;
if (num == 0) {
uni.$lu.toast("当前余号剩余0");
} else if (num > 0) {
uni.showLoading({
title: "加载中",
});
currentDate.value = e.fulldate;
getTjTimeList(yytjInfo.value.nmr_list[nmrIndex.value]);
calendarShow.value = false;
}
};
const getCurrentClick = (item, i) => {
console.log(item, i); //
if (item.count < 0) {
@ -369,112 +424,140 @@ onShow(() => {
</view>
</view>
<view
id="ylrl"
style="box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 0, 0, 0.04)"
class="p-16rpx pb-20rpx pt-30rpx rounded-15rpx bg-#fff mt-15rpx"
v-if="date_list"
v-if="calendarShow"
>
<view class="">
<view
class="text-30rpx text-#0E0E0E pb-34rpx font-500"
v-if="currentXmmcObj.name"
>
{{ currentXmmcObj.name || "" }}
</view>
<view class="flex">
<uni-calendar
:selected="rl_list"
:showMonth="false"
:insert="true"
:date="currentDate"
@change="changerl"
@monthSwitch="monthSwitch"
/>
</view>
<template v-else>
<view
style="box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 0, 0, 0.04)"
class="p-16rpx pb-20rpx pt-30rpx rounded-15rpx bg-#fff mt-15rpx"
v-if="date_list"
>
<view class="">
<view
class="w-15% text-center text-18rpx"
v-for="(item, index) in date_list"
:key="index"
class="text-30rpx text-#0E0E0E pb-34rpx font-500"
v-if="yytjInfo.nmr_list[nmrIndex].name"
>
{{ yytjInfo.nmr_list[nmrIndex].name }}
</view>
<view class="flex mb-30rpx items-center">
<view
@click="getCurrentClick(item, index)"
:style="
item.count < 0 ? 'background-color:#EFEFEF;color:#aaa8a8' : ''
"
:class="3 == index ? 'activeTime' : ''"
class="rounded-12rpx pt-10rpx pb-10rpx ml-10rpx mr-10rpx mb-6rpx"
class="flex-1 text-center text-18rpx"
v-for="(item, index) in date_list"
:key="index"
>
<view> {{ item.newMonthDate }} </view>
<view class="text-26rpx font-500"> {{ item.newWeek }} </view>
</view>
<view class="ma" v-if="item.count > -1">
<text class="bg-#EFEFEF rounded-10rpx h-28rpx pl-10rpx pr-10rpx"
>{{ item.count }}</text
<view
@click="getCurrentClick(item, index)"
:style="
item.count < 0
? 'background-color:#EFEFEF;color:#aaa8a8'
: ''
"
:class="3 == index ? 'activeTime' : ''"
class="rounded-12rpx pt-10rpx pb-10rpx ml-10rpx mr-10rpx mb-6rpx"
>
<view> {{ item.newMonthDate }} </view>
<view class="text-26rpx font-500"> {{ item.newWeek }} </view>
</view>
<view class="ma" v-if="item.count > -1">
<text
:class="{
'text-#239EA3 !bg-#E1F4F8': 3 == index,
}"
class="bg-#EFEFEF rounded-10rpx h-28rpx pl-10rpx pr-10rpx"
>{{ item.count }}</text
>
</view>
</view>
<view
class="flex-1 col center text-#239EA3 text-20rpx bs b-#E7E7E7 b-l-1 h-80rpx"
@click="moreTime()"
>
<uni-icons
type="calendar"
size="30"
color="#239EA3"
></uni-icons>
<text>更多</text>
</view>
</view>
<!-- <view class="w-1rpx m-20rpx bg-#E6E9E9 ml-15rpx" />
<view class="flex text-#239EA3 text-20rpx">
更多
</view> -->
</view>
<!-- <view class="w-100% h-1rpx bg-#E6E9E9 mt-18rpx" /> -->
<view
class="flex flex-wrap pt-30rpx pb-30rpx b-0 b-t-1 b-solid b-#E1ECEE"
v-if="time_list.length"
>
<view
class="w-20% text-center box-border p-20rpx"
v-for="(item, index) in time_list"
:key="index"
:class="{
'text-red': item.status == 2,
}"
@click="getCurrentTime(item, index)"
class="flex flex-wrap pt-30rpx pb-30rpx b-0 b-t-1 b-solid b-#E1ECEE"
v-if="time_list.length"
>
<view
class="text-24rpx rounded-12rpx h-54rpx flex flex-items-center flex-justify-center"
:class="timeIndex == index ? 'activeTime' : ''"
class="w-20% text-center box-border p-20rpx"
v-for="(item, index) in time_list"
:key="index"
:class="{
'text-red': item.status == 2,
}"
@click="getCurrentTime(item, index)"
>
{{ item.newTime }}
<view
class="text-24rpx rounded-12rpx h-54rpx flex flex-items-center flex-justify-center"
:class="timeIndex == index ? 'activeTime' : ''"
>
{{ item.newTime }}
</view>
</view>
</view>
</view>
</view>
</view>
<view
style="box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 0, 0, 0.04)"
class="p-30rpx pl-10rpx pr-10rpx rounded-15rpx bg-#fff mt-15rpx text-#101010 text-28rpx"
>
<view class="bg-#F7F7F7 pl-20rpx pr-20rpx pt-23rpx pb-25rpx">
<text>{{
buyInfo.group_id
? $store.getGroupInfo()?.name
: $store.getUser()?.name
}}</text>
<view
class="bg-#EFEFEF rounded-15rpx p-10rpx pb-15rpx pt-15rpx mt-20rpx"
>
<view
style="box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 0, 0, 0.04)"
class="p-30rpx pl-10rpx pr-10rpx rounded-15rpx bg-#fff mt-15rpx text-#101010 text-28rpx"
>
<view class="bg-#F7F7F7 pl-20rpx pr-20rpx pt-23rpx pb-25rpx">
<text>{{
buyInfo.group_id
? $store.getGroupInfo()?.name
: $store.getUser()?.name
}}</text>
<view
v-for="(item, index) in yytjInfo.nmr_list"
:key="index"
@click="xmmcClick(item, index)"
:class="nmrIndex == index ? 'acitvetc' : ''"
class="flex flex-justify-around p-20rpx pl-10rpx pr-10rpx rounded-15rpx"
class="bg-#EFEFEF rounded-15rpx p-10rpx pb-15rpx pt-15rpx mt-20rpx"
>
<view class="flex-1 line-clamp-1">
{{ item.name }}
</view>
<view>
{{ item.time }}
<view
v-for="(item, index) in yytjInfo.nmr_list"
:key="index"
@click="xmmcClick(item, index)"
:class="nmrIndex == index ? 'acitvetc' : ''"
class="flex flex-justify-around p-20rpx pl-10rpx pr-10rpx rounded-15rpx"
>
<view class="flex-1 line-clamp-1">
{{ item.name }}
</view>
<view>
{{ item.time }}
</view>
</view>
</view>
</view>
</view>
</view>
<view class="pb-100rpx">
<view
@click="comfrimyy"
class="text-#fff text-32rpx rounded-45rpx bg-#239EA3 mt-40rpx ma w-520rpx h-90rpx flex flex-items-center flex-justify-center"
>
确定
<view class="pb-100rpx">
<view
@click="comfrimyy"
class="text-#fff text-32rpx rounded-45rpx bg-#239EA3 mt-40rpx ma w-520rpx h-90rpx flex flex-items-center flex-justify-center"
>
确定
</view>
</view>
</view>
</template>
</view>
</view>
</template>
<style scoped>
<style scoped lang="scss">
.activeTime {
background-color: #239ea3;
color: #fff;
@ -483,4 +566,54 @@ onShow(() => {
.acitvetc {
background-color: #e0f1f2;
}
::v-deep #ylrl {
.uni-calendar__header,
.uni-calendar__weeks-day {
border: none;
}
.uni-calendar-item--checked {
background-color: transparent;
.uni-calendar-item__weeks-box-item {
background-color: #239ea3 !important;
border-radius: 12rpx;
.uni-calendar-item--extra {
color: #fff !important;
}
}
}
.uni-calendar-item--isDay {
background-color: #239ea3 !important;
border-radius: 12rpx;
color: #fff !important;
}
.uni-calendar-item--extra {
color: #239ea3;
}
.uni-calendar-item__weeks-box {
// padding: 10rpx;
box-sizing: border-box;
}
.uni-calendar-item__weeks-box-circle {
background-color: rgba(0, 0, 0, 0);
}
.uni-calendar-item--isDay-text {
color: #333;
}
.uni-calendar-item__weeks-box-text {
font-size: 26rpx;
}
.uni-calendar-item__weeks-lunar-text {
font-size: 16rpx;
}
.uni-calendar-item__weeks-box-item {
width: 100%;
}
.uni-calendar__backtoday {
display: none;
}
}
</style>

Loading…
Cancel
Save