Hooke / bieyuan

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
fe5a303b 1 parent 21f045ba

fix

Inline Side-by-side
Showing 4 changed files with 53 additions and 19 deletions
<!--
* @Date: 2023-06-21 10:23:09
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2023-08-25 10:36:50
* @LastEditTime: 2023-08-25 15:07:53
* @FilePath: /bieyuan/src/views/index.vue
* @Description: 文件描述
-->
......@@ -14,7 +14,7 @@
<div @click="selectIndex(0)" :class="['today', 'item', index === 0 ? 'selected' : '']">
<div class="datetime" style="padding: 1rem 0;">
<div style="font-size: 2rem;">今天</div>
<div>{{ shortcut[0]?.date }}</div>
<div>{{ formatDateShow(shortcut[0]?.date) }}</div>
</div>
<div class="remain">
<div>剩余名额</div>
......@@ -27,7 +27,7 @@
<div @click="selectIndex(1)" :class="['tomorrow', 'item', index === 1 ? 'selected' : '']">
<div class="datetime" style="padding: 1rem 0;">
<div style="font-size: 1.5rem;">明天</div>
<div>{{ shortcut[1]?.date }}</div>
<div>{{ formatDateShow(shortcut[1]?.date) }}</div>
</div>
<div class="remain">
<div>剩余名额</div>
......@@ -40,7 +40,7 @@
<div @click="selectIndex(2)" :class="['after', 'item', index === 2 ? 'selected' : '']">
<div class="datetime" style="padding: 0.5rem 0;">
<div style="font-size: 1.25rem;">后天</div>
<div style="font-size: 0.85rem;">{{ shortcut[2]?.date }}</div>
<div style="font-size: 0.85rem;">{{ formatDateShow(shortcut[2]?.date) }}</div>
</div>
<div class="remain" style="font-size: 0.85rem; padding: 0.4rem 0;">
<div>剩余名额</div>
......@@ -72,10 +72,10 @@
<van-icon size="0.85rem" name="https://cdn.ipadbiz.cn/bieyuan/-@2x.png" />
</div>
</van-col>
<van-col span="14" style="text-align: center;">
<van-col span="12" style="text-align: center;">
<input v-model="num" type="number" class="input_num">
</van-col>
<van-col span="2" style="text-align: center;">
<van-col span="4" style="text-align: center;">
<span>人</span>
</van-col>
<van-col span="4" style="text-align: center;">
......@@ -150,13 +150,24 @@ const selectedDates = ref([]);
const index = ref(0);
const shortcut = ref([]);
watch(
() => num.value,
(val) => {
// 控制输入值为 3 位
const maxLength = 3;
if (val.toString().length > maxLength) {
num.value = num.value.toString().slice(0, maxLength);
}
}
);
const asyncData = ref();
const showMore = async () => {
show.value = true;
const { data } = await orderRestCountAPI({ start_date: dayjs().format('YYYY-MM-DD'), end_date: dayjs(maxDate.value).format('YYYY-MM-DD') });
asyncData.value = data;
asyncData.value.forEach(item => {
item.format = item.date.split('-')
item.format = item.date.split('-');
});
}
......@@ -174,6 +185,7 @@ const formatter = computed(() => {
if (year === +arr[0] && month === +arr[1] && date === +arr[2]) {
// day.topInfo = '剩余';
day.bottomInfo = item.rest_count;
day.className = 'abc'
}
});
return day;
......@@ -188,6 +200,7 @@ const onConfirm = (dates) => { // 选择日历确定回调
dates.forEach((date) => {
selectedDates.value.push(dayjs(date).format('YYYY-MM-DD'));
});
clickNext();
};
const selectIndex = (idx) => { // 保存手动点击的索引值
......@@ -236,6 +249,15 @@ const clickNext = () => { // 点击下一步按钮
}
}
const formatDateShow = (date) => {
if (date) {
const arr = date.split('-');
let month = arr[1];
let day = arr[2];
return `${month}月${day}日`;
}
}
// 最大日期默认为6个月
const getFutureDate = () => {
const currentDate = new Date();
......@@ -302,7 +324,7 @@ const isMinValue = (array, value) => { // 判断输入值是否小于数组中
.remain {
color: #93663D;
font-size: 1.15rem;
font-size: 0.85rem;
padding: 1rem 0;
div:first-child {
......@@ -374,8 +396,8 @@ const isMinValue = (array, value) => { // 判断输入值是否小于数组中
.input_num {
border: 0;
background-color: #F7F7F7;
height: 2.5rem;
width: 6.5rem;
height: 2rem;
width: 4em;
color: #976C46;
text-align: center;
font-weight: bold;
......
......@@ -19,8 +19,6 @@
</div>
</div>
<div style="height: 4rem;"></div>
<div class="bookingBox">
<van-row>
<van-col span="6" class="text">预约人数</van-col>
......@@ -31,10 +29,10 @@
<van-icon size="0.85rem" name="https://cdn.ipadbiz.cn/bieyuan/-@2x.png" />
</div>
</van-col>
<van-col span="14" style="text-align: center;">
<van-col span="12" style="text-align: center;">
<input v-model="num" type="number" class="input_num">
</van-col>
<van-col span="2" style="text-align: center;">
<van-col span="4" style="text-align: center;">
<span>人</span>
</van-col>
<van-col span="4" style="text-align: center;">
......@@ -84,7 +82,7 @@ function getDaysInMonth(year, month) {
onMounted(async () => {
const dates = $route.query.dates && JSON.parse($route.query.dates);
const { data } = await orderRestCountAPI({ dates });
const { data } = await orderRestCountAPI({ dates: dates.join(',')});
shortcut.value = data;
// 上一页选择的预约人数
num.value = $route.query.count ? +$route.query.count : 1;
......@@ -113,6 +111,17 @@ const num = ref(1);
const show = ref(false);
const selectedDates = ref([]);
watch(
() => num.value,
(val) => {
// 控制输入值为 3 位
const maxLength = 3;
if (val.toString().length > maxLength) {
num.value = num.value.toString().slice(0, maxLength);
}
}
);
const asyncData = ref();
const showMore = async () => {
show.value = true;
......@@ -151,7 +160,7 @@ const onConfirm = async (dates) => {
defaultDate.value.push(dayjs(date).toDate())
});
// 后台请求数据
const { data } = await orderRestCountAPI({ dates : selectedDates.value });
const { data } = await orderRestCountAPI({ dates : selectedDates.value.join(',') });
shortcut.value = data;
shortcut.value.forEach(item => {
item.checked = true;
......@@ -305,7 +314,7 @@ const clickNext = () => { // 点击下一步按钮
border: 0;
background-color: #F7F7F7;
height: 2.5rem;
// width: 6.5rem;
// width: 4em;
width: 70%;
color: #976C46;
text-align: center;
......
......@@ -105,6 +105,9 @@ const toggleItem = (item) => {
const show = ref(false);
const cancelApp = () => {
show.value = true;
nextTick(() => {
$('.van-popup.van-popup--center.van-dialog').css('width', '320px')
})
}
const onConfirm = async () => {
const { code } = await orderCancelAPI({ id: $route.query.id });
......
/*
* @Date: 2023-06-13 13:26:46
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2023-08-23 14:47:02
* @FilePath: /front/vite.config.js
* @LastEditTime: 2023-08-25 14:14:26
* @FilePath: /bieyuan/vite.config.js
* @Description: 文件描述
*/
import vue from '@vitejs/plugin-vue';
......