800 lines
23 KiB
Vue
800 lines
23 KiB
Vue
|
<template>
|
|||
|
|
<view style="background-color: white; height: 100vh">
|
|||
|
|
<u-navbar title="返校预约申请"></u-navbar>
|
|||
|
|
<!-- 内容 -->
|
|||
|
|
<scroll-view
|
|||
|
|
scroll-y="true"
|
|||
|
|
style="
|
|||
|
|
height: calc(100vh - 240rpx);
|
|||
|
|
width: 100%;
|
|||
|
|
border-top: 1px solid #edf2fa;
|
|||
|
|
background-color: #fff;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
"
|
|||
|
|
>
|
|||
|
|
<!-- 基础信息 -->
|
|||
|
|
<view class="base-box">
|
|||
|
|
<view class="item-line">
|
|||
|
|
<text class="line-label"> 预约人</text>
|
|||
|
|
<text class="line-value"> {{ baseMsg.name || "-" }} </text>
|
|||
|
|
</view>
|
|||
|
|
<view class="item-line">
|
|||
|
|
<text class="line-label"> 学院专业</text>
|
|||
|
|
<text class="line-value"> {{ baseMsg.college + "-" + baseMsg.major }} </text>
|
|||
|
|
</view>
|
|||
|
|
<view class="item-line">
|
|||
|
|
<text class="line-label"> 学历层次</text>
|
|||
|
|
<text class="line-value"> {{ baseMsg.educationStr || "-" }} </text>
|
|||
|
|
</view>
|
|||
|
|
<view class="item-line">
|
|||
|
|
<text class="line-label"> 毕业年份</text>
|
|||
|
|
<text class="line-value"> {{ baseMsg.endYear || "-" }} </text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 表单 -->
|
|||
|
|
<view class="form-box">
|
|||
|
|
<!-- 返校日期 -->
|
|||
|
|
<view class="item-date" @click="dateShowFn">
|
|||
|
|
<text class="line-label must"> 返校日期</text>
|
|||
|
|
<u-input
|
|||
|
|
:custom-style="inputStyle"
|
|||
|
|
type="text"
|
|||
|
|
input-align="right"
|
|||
|
|
:border="false"
|
|||
|
|
v-model="formData.date"
|
|||
|
|
@click.native="dateShowFn"
|
|||
|
|
placeholder="请选择"
|
|||
|
|
disabled
|
|||
|
|
/>
|
|||
|
|
<view class="img">
|
|||
|
|
<image
|
|||
|
|
style="width:15rpx; height: 25rpx; margin-left: 20rpx"
|
|||
|
|
src="/static/common/img/row_right.png"
|
|||
|
|
/>
|
|||
|
|
</view>
|
|||
|
|
<!-- 点击盒子 -->
|
|||
|
|
<view class="input-mask"></view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 提示 -->
|
|||
|
|
<view class="item-tip" v-if="weekSet.length">
|
|||
|
|
<text class="line-label"> 提示：每周{{ dateTip }}暂停开放返校服务</text>
|
|||
|
|
</view>
|
|||
|
|
<!-- 车牌号 -->
|
|||
|
|
<view class="item-line" style="border: none;">
|
|||
|
|
<text class="line-label"> 车牌号</text>
|
|||
|
|
<u-input
|
|||
|
|
:custom-style="inputStyle"
|
|||
|
|
type="text"
|
|||
|
|
input-align="right"
|
|||
|
|
:border="false"
|
|||
|
|
maxlength="10"
|
|||
|
|
v-model="formData.carNumber"
|
|||
|
|
placeholder="如果车辆入校请务必填写"
|
|||
|
|
/>
|
|||
|
|
</view>
|
|||
|
|
<!-- 联系电话 -->
|
|||
|
|
<view class="item-line" style="border: none;">
|
|||
|
|
<text class="line-label must"> 联系电话</text>
|
|||
|
|
<u-input
|
|||
|
|
:custom-style="inputStyle"
|
|||
|
|
type="number"
|
|||
|
|
input-align="right"
|
|||
|
|
:border="false"
|
|||
|
|
maxlength="20"
|
|||
|
|
v-model="formData.phone"
|
|||
|
|
placeholder="请输入"
|
|||
|
|
/>
|
|||
|
|
</view>
|
|||
|
|
<!-- 随行人信息 -->
|
|||
|
|
<view class="item-line">
|
|||
|
|
<text class="line-label"> 随行人信息</text>
|
|||
|
|
<text @click="addPersonFn" style="color: #3cb5fb"> 添加随行人 </text>
|
|||
|
|
</view>
|
|||
|
|
<!-- 动态随行人 -->
|
|||
|
|
<view class="item-box">
|
|||
|
|
<view class="item-for" v-for="(x, xIndex) in sxList" :key="xIndex">
|
|||
|
|
<!-- 左侧内容 -->
|
|||
|
|
<view class="for-left">
|
|||
|
|
<view class="each">
|
|||
|
|
<text class="must"> 随行人{{ xIndex + 1 }}</text>
|
|||
|
|
<u-input
|
|||
|
|
:custom-style="eachStyle"
|
|||
|
|
type="text"
|
|||
|
|
input-align="right"
|
|||
|
|
:border="false"
|
|||
|
|
maxlength="20"
|
|||
|
|
v-model="x.name"
|
|||
|
|
placeholder="请输入"
|
|||
|
|
/>
|
|||
|
|
</view>
|
|||
|
|
<view class="each">
|
|||
|
|
<text class="must"> 手机号</text>
|
|||
|
|
<u-input
|
|||
|
|
:custom-style="eachStyle"
|
|||
|
|
type="number"
|
|||
|
|
input-align="right"
|
|||
|
|
:border="false"
|
|||
|
|
maxlength="20"
|
|||
|
|
v-model="x.phone"
|
|||
|
|
placeholder="请输入"
|
|||
|
|
/>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 右侧删除 -->
|
|||
|
|
<view class="del">
|
|||
|
|
<!-- <u-icon
|
|||
|
|
@click="delFn(xIndex)"
|
|||
|
|
name="trash"
|
|||
|
|
color="#2799f6"
|
|||
|
|
size="45"
|
|||
|
|
></u-icon> -->
|
|||
|
|
<image style="width: 32rpx;height: 32rpx;" src="/static/common/img/delete.svg" @click="delFn(xIndex)"></image>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 返校事由 -->
|
|||
|
|
<view class="item-line">
|
|||
|
|
<text class="line-label must"> 返校事由</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="item-text">
|
|||
|
|
<u-input
|
|||
|
|
type="textarea"
|
|||
|
|
height="200"
|
|||
|
|
:border="false"
|
|||
|
|
v-model="formData.retuenSchoolReason"
|
|||
|
|
placeholder="请输入"
|
|||
|
|
/>
|
|||
|
|
</view>
|
|||
|
|
<!-- 同意区域 -->
|
|||
|
|
<view class="item-agree">
|
|||
|
|
<view class="agree-left">
|
|||
|
|
<u-checkbox-group>
|
|||
|
|
<u-checkbox v-model="formData.checked"></u-checkbox>
|
|||
|
|
</u-checkbox-group>
|
|||
|
|
</view>
|
|||
|
|
<view class="agree-right">{{ desc }}</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view style="height: 50rpx"></view>
|
|||
|
|
</scroll-view>
|
|||
|
|
<!-- 按钮 -->
|
|||
|
|
<view class="btn-box">
|
|||
|
|
<u-button style="width: 80%" shape="circle" type="primary" @click="btnSubmitFn"
|
|||
|
|
>提交</u-button
|
|||
|
|
>
|
|||
|
|
</view>
|
|||
|
|
<u-top-tips ref="uTips" :navbar-height="50"></u-top-tips>
|
|||
|
|
<!-- 选择日期范围 -->
|
|||
|
|
<!-- date 单个日期范围 range 多个日期范围 min-date="" -->
|
|||
|
|
<u-calendarWeek
|
|||
|
|
max-year="2030"
|
|||
|
|
min-year="2020"
|
|||
|
|
max-date="2030"
|
|||
|
|
:min-date="minDate"
|
|||
|
|
:max-date="maxDate"
|
|||
|
|
v-model="dateShow"
|
|||
|
|
:filterWeek="weekSet"
|
|||
|
|
:filterDate="filterDate"
|
|||
|
|
mode="range"
|
|||
|
|
@change="dateChangeFn"
|
|||
|
|
></u-calendarWeek>
|
|||
|
|
<u-toast ref="uToast" />
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
// 表单
|
|||
|
|
formData: {
|
|||
|
|
carNumber: "", // 车牌号
|
|||
|
|
phone: "", // 联系电话
|
|||
|
|
checked: false, //是否同意
|
|||
|
|
retuenSchoolReason: "", //返校事由
|
|||
|
|
date: "", //返校日期
|
|||
|
|
},
|
|||
|
|
// 日期的值
|
|||
|
|
dateList: [],
|
|||
|
|
// 随行人
|
|||
|
|
sxList: [
|
|||
|
|
{
|
|||
|
|
name: "",
|
|||
|
|
phone: "",
|
|||
|
|
},
|
|||
|
|
],
|
|||
|
|
// 选择日期
|
|||
|
|
dateShow: false,
|
|||
|
|
//
|
|||
|
|
inputStyle: {
|
|||
|
|
lineHeight: "90rpx",
|
|||
|
|
height: "90rpx",
|
|||
|
|
width: "400rpx",
|
|||
|
|
},
|
|||
|
|
eachStyle: {
|
|||
|
|
lineHeight: "80rpx",
|
|||
|
|
height: "80rpx",
|
|||
|
|
width: "400rpx",
|
|||
|
|
},
|
|||
|
|
desc:
|
|||
|
|
"本人承诺进校期间,遵守国家相关规律法规和校园管理相关规定，服从工作人员的指挥和管理",
|
|||
|
|
// 基础信息
|
|||
|
|
baseMsg: {
|
|||
|
|
id: "",
|
|||
|
|
name: "", //姓名
|
|||
|
|
schoolName: "",
|
|||
|
|
schoolLogo: "",
|
|||
|
|
startYear: "", //入学年份
|
|||
|
|
college: "", //学院
|
|||
|
|
educationStr: "", //学历层次
|
|||
|
|
major: "", //专业
|
|||
|
|
endYear: "", //毕业年份
|
|||
|
|
},
|
|||
|
|
// 星期设置
|
|||
|
|
weekSet: [],
|
|||
|
|
// 已预约的日期 这里需要两个格式 2025-2-19 2025/2/19
|
|||
|
|
filterDate:[],
|
|||
|
|
// 选择日期提示
|
|||
|
|
dateTip: "",
|
|||
|
|
// 最小日期
|
|||
|
|
minDate: "",
|
|||
|
|
// 最大日期
|
|||
|
|
maxDate: "",
|
|||
|
|
};
|
|||
|
|
},
|
|||
|
|
async onLoad(e) {
|
|||
|
|
await this.getSchoolFn();
|
|||
|
|
// 获取返校设置
|
|||
|
|
this.getSetFn();
|
|||
|
|
// 获取已预约的日期
|
|||
|
|
this.getFilterDate();
|
|||
|
|
},
|
|||
|
|
created() {},
|
|||
|
|
methods: {
|
|||
|
|
async getFilterDate(){
|
|||
|
|
const req = {
|
|||
|
|
// userId: this.vuex_user.id,
|
|||
|
|
educationId: this.baseMsg.id,
|
|||
|
|
}
|
|||
|
|
// return
|
|||
|
|
const res = await this.$u.apiList.GetDateTimeReturnApi(req);
|
|||
|
|
console.log(res,'res--获取已预约日期')
|
|||
|
|
// 截取一下
|
|||
|
|
const result = res.map(x=>x.retuenSchoolTime.slice(0,10))
|
|||
|
|
// 保存一份不去0的
|
|||
|
|
this.filterDateSource = [...result];
|
|||
|
|
// 去0 [2025-2-18]
|
|||
|
|
const arr1 = result.map(x=>x.replace(/(?<=-)0/g, ''))
|
|||
|
|
// 在生成一个 [2025/02/18]
|
|||
|
|
const arr2 = arr1.map(x=>x.replaceAll('-','/'))
|
|||
|
|
// 已预约的日期
|
|||
|
|
this.filterDate = [...arr1,...arr2];
|
|||
|
|
},
|
|||
|
|
arrayToString(arr) {
|
|||
|
|
let result = "";
|
|||
|
|
const map = new Map([
|
|||
|
|
[0, "周日"],
|
|||
|
|
[1, "周一"],
|
|||
|
|
[2, "周二"],
|
|||
|
|
[3, "周三"],
|
|||
|
|
[4, "周四"],
|
|||
|
|
[5, "周五"],
|
|||
|
|
[6, "周六"],
|
|||
|
|
]);
|
|||
|
|
arr.forEach((x) => {
|
|||
|
|
if (map.has(x)) {
|
|||
|
|
result += map.get(x) + "、";
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
return arr.length ? result.slice(0, result.length - 1) : result;
|
|||
|
|
},
|
|||
|
|
//获取返校设置
|
|||
|
|
async getSetFn() {
|
|||
|
|
const req = {
|
|||
|
|
schoolId: this.baseMsg.schoolId,
|
|||
|
|
}
|
|||
|
|
const res = await this.$u.apiList.SelectInfoSetApi(req);
|
|||
|
|
console.log(res, "res--");
|
|||
|
|
let AllArr = [0, 1, 2, 3, 4, 5, 6];
|
|||
|
|
// 星期设置
|
|||
|
|
if (res.isDayOfWeek) {
|
|||
|
|
let result = res.dayOfWeek.split(",").map((x) => Number(x));
|
|||
|
|
this.weekSet = AllArr.filter((x) => {
|
|||
|
|
return !result.includes(x);
|
|||
|
|
});
|
|||
|
|
// 处理tip提示
|
|||
|
|
this.dateTip = this.arrayToString(this.weekSet);
|
|||
|
|
}
|
|||
|
|
// 限制选择日期
|
|||
|
|
// 在用户需要提前几天申请预约
|
|||
|
|
if (res.isBefore) {
|
|||
|
|
const date = new Date();
|
|||
|
|
date.setDate(date.getDate() + res.beforeDay);
|
|||
|
|
const year = date.getFullYear();
|
|||
|
|
const month = String(date.getMonth() + 1).padStart(2, "0");
|
|||
|
|
const day = String(date.getDate()).padStart(2, "0");
|
|||
|
|
this.minDate = `${year}-${month}-${day}`;
|
|||
|
|
} else {
|
|||
|
|
// 默认最小日期是今天
|
|||
|
|
const date = new Date();
|
|||
|
|
date.setDate(date.getDate());
|
|||
|
|
const year = date.getFullYear();
|
|||
|
|
const month = String(date.getMonth() + 1).padStart(2, "0");
|
|||
|
|
const day = String(date.getDate()).padStart(2, "0");
|
|||
|
|
this.minDate = `${year}-${month}-${day}`;
|
|||
|
|
}
|
|||
|
|
// 用户最大可选日期 默认180天
|
|||
|
|
const dateRes = new Date();
|
|||
|
|
// 在用户需要提前几天申请预约
|
|||
|
|
let maxDay = res.isDayOfWeek ? res.returnSchoolDays : 180
|
|||
|
|
dateRes.setDate(dateRes.getDate() + maxDay);
|
|||
|
|
const year1 = dateRes.getFullYear();
|
|||
|
|
const month1 = String(dateRes.getMonth() + 1).padStart(2, "0");
|
|||
|
|
const day1 = String(dateRes.getDate()).padStart(2, "0");
|
|||
|
|
this.maxDate = `${year1}-${month1}-${day1}`;
|
|||
|
|
},
|
|||
|
|
async getSchoolFn() {
|
|||
|
|
const req = {
|
|||
|
|
userId: this.vuex_user.id,
|
|||
|
|
};
|
|||
|
|
const res = await this.$u.apiList.MyEducations(req);
|
|||
|
|
console.log(res, "res--");
|
|||
|
|
const findRow = res.find((x) => x.isSelected === true);
|
|||
|
|
if (!findRow) {
|
|||
|
|
/* uni.showToast({
|
|||
|
|
title: "未查询到当前教育经历",
|
|||
|
|
icon: "none",
|
|||
|
|
}); */
|
|||
|
|
this.$refs.uToast.show({
|
|||
|
|
title: "未查询到当前教育经历",
|
|||
|
|
type: "error",
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
Object.assign(this.baseMsg, findRow);
|
|||
|
|
this.baseMsg.name = this.vuex_user.name;
|
|||
|
|
},
|
|||
|
|
// 添加随行人
|
|||
|
|
addPersonFn() {
|
|||
|
|
this.sxList.push({
|
|||
|
|
name: "",
|
|||
|
|
phone: "",
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
// 删除随行人
|
|||
|
|
delFn(index) {
|
|||
|
|
uni.showModal({
|
|||
|
|
// title: "提示",
|
|||
|
|
content: `确定删除随行人${index + 1}？`,
|
|||
|
|
success: (res) => {
|
|||
|
|
if (res.confirm) {
|
|||
|
|
this.sxList.splice(index, 1);
|
|||
|
|
}
|
|||
|
|
if (res.cancel) {
|
|||
|
|
// console.log('用户点击取消');
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
// 选择日期
|
|||
|
|
dateShowFn() {
|
|||
|
|
this.dateShow = true;
|
|||
|
|
},
|
|||
|
|
// 日期change
|
|||
|
|
dateChangeFn(e) {
|
|||
|
|
console.log(e, "e--");
|
|||
|
|
this.currentList = this.getDatesArray(e.startDate, e.endDate);
|
|||
|
|
console.log(JSON.parse(JSON.stringify(this.currentList)),'this.currentList--1');
|
|||
|
|
// 判断是否包含不可选中日期
|
|||
|
|
let flag = this.currentList.some(function(x){
|
|||
|
|
// 包含禁用的日期
|
|||
|
|
if (this.disArr.includes(new Date(x).getDay())) {
|
|||
|
|
return true;
|
|||
|
|
}
|
|||
|
|
// 包含已预约的日期
|
|||
|
|
if(this.selectArr.includes(x)){
|
|||
|
|
return true;
|
|||
|
|
}
|
|||
|
|
return false;
|
|||
|
|
},{
|
|||
|
|
disArr:this.weekSet, // 禁用的星期
|
|||
|
|
selectArr:this.filterDateSource // 已预约的日期
|
|||
|
|
})
|
|||
|
|
// 过滤一下禁用的星期
|
|||
|
|
// this.currentList = this.currentList.filter((x) => {
|
|||
|
|
// // 当天的星期
|
|||
|
|
// const dateWeek = new Date(x).getDay();
|
|||
|
|
// // 包含禁用的星期过滤掉
|
|||
|
|
// if (this.weekSet.includes(dateWeek)) {
|
|||
|
|
// return false;
|
|||
|
|
// }
|
|||
|
|
// return true;
|
|||
|
|
// });
|
|||
|
|
// 过滤掉已预约的日期
|
|||
|
|
// this.currentList = this.currentList.filter((x) => {
|
|||
|
|
// if(this.filterDateSource.includes(x)){
|
|||
|
|
// return false;
|
|||
|
|
// }else{
|
|||
|
|
// return true;
|
|||
|
|
// }
|
|||
|
|
// });
|
|||
|
|
if(flag){
|
|||
|
|
/* uni.showToast({
|
|||
|
|
icon:'none',
|
|||
|
|
title: `当前返校时间包含不可预约的日期，请重新选择！`,
|
|||
|
|
duration: 2000,
|
|||
|
|
}); */
|
|||
|
|
this.$refs.uToast.show({
|
|||
|
|
title: `当前返校时间包含不可预约的日期，请重新选择！`,
|
|||
|
|
type: "error",
|
|||
|
|
});
|
|||
|
|
this.dateShow = true;
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
// 显示的值
|
|||
|
|
this.formData.date = e.startDate + " ~ " + e.endDate;
|
|||
|
|
console.log(JSON.parse(JSON.stringify(this.currentList)),'this.currentList--2');
|
|||
|
|
// 处理成后端要的格式
|
|||
|
|
this.dateList = this.currentList.map((x) => {
|
|||
|
|
return {
|
|||
|
|
time: x,
|
|||
|
|
};
|
|||
|
|
});
|
|||
|
|
console.log(JSON.parse(JSON.stringify(this.dateList)),'this.dateList');
|
|||
|
|
},
|
|||
|
|
// 校验表单信息
|
|||
|
|
validate() {
|
|||
|
|
// 校验手机号的正则表达式
|
|||
|
|
const phoneReg = /^[1][3-9][0-9]{9}$/;
|
|||
|
|
return new Promise((resolve, reject) => {
|
|||
|
|
// 校验返校日期
|
|||
|
|
if (!this.formData.date) {
|
|||
|
|
// this.$tips("返校日期不能为空", "error");
|
|||
|
|
this.$refs.uToast.show({
|
|||
|
|
title: "返校日期不能为空",
|
|||
|
|
type: "error",
|
|||
|
|
});
|
|||
|
|
return reject(false);
|
|||
|
|
}
|
|||
|
|
// 校验联系电话
|
|||
|
|
if (!this.formData.phone) {
|
|||
|
|
// this.$tips("联系电话不能为空", "error");
|
|||
|
|
this.$refs.uToast.show({
|
|||
|
|
title: "联系电话不能为空",
|
|||
|
|
type: "error",
|
|||
|
|
});
|
|||
|
|
return reject(false);
|
|||
|
|
}
|
|||
|
|
if (!phoneReg.test(this.formData.phone)) {
|
|||
|
|
// this.$tips("联系电话格式不正确，请输入有效的手机号", "error");
|
|||
|
|
this.$refs.uToast.show({
|
|||
|
|
title: "联系电话格式不正确，请输入有效的手机号",
|
|||
|
|
type: "error",
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
return reject(false);
|
|||
|
|
}
|
|||
|
|
// 校验随行人信息
|
|||
|
|
if (this.sxList.length) {
|
|||
|
|
for (let i = 0; i < this.sxList.length; i++) {
|
|||
|
|
const item = this.sxList[i];
|
|||
|
|
// 校验随行人名称
|
|||
|
|
if (!item.name) {
|
|||
|
|
// this.$tips(`随行人${i + 1}的名称不能为空`, "error");
|
|||
|
|
this.$refs.uToast.show({
|
|||
|
|
title: `随行人${i + 1}的名称不能为空`,
|
|||
|
|
type: "error",
|
|||
|
|
});
|
|||
|
|
return reject(false);
|
|||
|
|
}
|
|||
|
|
// 校验随行人手机号
|
|||
|
|
if (!item.phone) {
|
|||
|
|
// this.$tips(`随行人${i + 1}的手机号不能为空`, "error");
|
|||
|
|
this.$refs.uToast.show({
|
|||
|
|
title: `随行人${i + 1}的手机号不能为空`,
|
|||
|
|
type: "error",
|
|||
|
|
});
|
|||
|
|
return reject(false);
|
|||
|
|
}
|
|||
|
|
if (!phoneReg.test(item.phone)) {
|
|||
|
|
// this.$tips(`随行人${i + 1}的手机号格式不正确，请输入有效的手机号`, "error");
|
|||
|
|
this.$refs.uToast.show({
|
|||
|
|
title: `随行人${i + 1}的手机号格式不正确，请输入有效的手机号`,
|
|||
|
|
type: "error",
|
|||
|
|
});
|
|||
|
|
return reject(false);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
// 校验返校事由
|
|||
|
|
if (!this.formData.retuenSchoolReason) {
|
|||
|
|
// this.$tips("返校事由不能为空", "error");
|
|||
|
|
this.$refs.uToast.show({
|
|||
|
|
title: "返校事由不能为空",
|
|||
|
|
type: "error",
|
|||
|
|
});
|
|||
|
|
return reject(false);
|
|||
|
|
}
|
|||
|
|
resolve(true);
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
// 日期转换数组
|
|||
|
|
getDatesArray(startDate, endDate) {
|
|||
|
|
// 将输入的字符串转换为 Date 对象
|
|||
|
|
const start = new Date(startDate);
|
|||
|
|
const end = new Date(endDate);
|
|||
|
|
|
|||
|
|
// 创建一个用于存储结果的数组
|
|||
|
|
let datesArray = [];
|
|||
|
|
|
|||
|
|
// 复制开始日期，以免修改原始对象
|
|||
|
|
let currentDate = new Date(start);
|
|||
|
|
|
|||
|
|
// 使用循环从开始日期遍历到结束日期
|
|||
|
|
while (currentDate <= end) {
|
|||
|
|
// 将当前日期添加到数组中
|
|||
|
|
// 使用 toISOString 方法去掉 T 后面的时间部分并去掉最后的 Z 和小数秒
|
|||
|
|
datesArray.push(new Date(currentDate).toISOString().split("T")[0]);
|
|||
|
|
|
|||
|
|
// 增加一天
|
|||
|
|
currentDate.setDate(currentDate.getDate() + 1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
return datesArray;
|
|||
|
|
},
|
|||
|
|
// 我要预约
|
|||
|
|
async btnSubmitFn() {
|
|||
|
|
const result = await this.validate().catch((e) => e);
|
|||
|
|
console.log(result, "result");
|
|||
|
|
if (!result) {
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
// 校验是否勾选了同意
|
|||
|
|
if (!this.formData.checked) {
|
|||
|
|
return uni.showModal({
|
|||
|
|
// title: "提示",
|
|||
|
|
content: this.desc,
|
|||
|
|
success: (res) => {
|
|||
|
|
if (res.confirm) {
|
|||
|
|
// 默认帮用户勾选上 提交
|
|||
|
|
this.formData.checked = true;
|
|||
|
|
this.submit();
|
|||
|
|
}
|
|||
|
|
if (res.cancel) {
|
|||
|
|
// console.log('用户点击取消');
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
this.submit();
|
|||
|
|
},
|
|||
|
|
// 提交的函数
|
|||
|
|
async submit() {
|
|||
|
|
// this.$tips("开发中", "success");
|
|||
|
|
const req = {
|
|||
|
|
userId: this.vuex_user.id,
|
|||
|
|
educationId: this.baseMsg.id,
|
|||
|
|
carNumber: this.formData.carNumber, //车牌号
|
|||
|
|
phone: String(this.formData.phone), //联系电话
|
|||
|
|
retuenSchoolReason: this.formData.retuenSchoolReason, //返校事由
|
|||
|
|
// 随行人
|
|||
|
|
TogetherPersonDtoList: this.sxList.map((x, xIndex) => {
|
|||
|
|
x.index = xIndex;
|
|||
|
|
x.phone = String(x.phone);
|
|||
|
|
return x;
|
|||
|
|
}),
|
|||
|
|
// 日期
|
|||
|
|
TimeList: this.dateList,
|
|||
|
|
};
|
|||
|
|
const res = await this.$u.apiList.AddReturnSchoolApi(req).catch(e=>e);
|
|||
|
|
console.log(res, "res---");
|
|||
|
|
if (res?.succeed === false) {
|
|||
|
|
/* uni.showToast({
|
|||
|
|
icon:'none',
|
|||
|
|
title: res.error || "提交失败",
|
|||
|
|
duration: 2000,
|
|||
|
|
}); */
|
|||
|
|
this.$refs.uToast.show({
|
|||
|
|
title: res.error || "提交失败",
|
|||
|
|
type: "error",
|
|||
|
|
});
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
/* uni.showToast({
|
|||
|
|
title: "提交成功",
|
|||
|
|
duration: 2000,
|
|||
|
|
}); */
|
|||
|
|
this.$refs.uToast.show({
|
|||
|
|
title: "提交成功",
|
|||
|
|
type: "success",
|
|||
|
|
});
|
|||
|
|
setTimeout(() => {
|
|||
|
|
// 返回上一页
|
|||
|
|
/* this.$u.route({
|
|||
|
|
url: "pages/my/BackSchool/BackSchool",
|
|||
|
|
}); */
|
|||
|
|
uni.navigateBack({
|
|||
|
|
delta: 1
|
|||
|
|
});
|
|||
|
|
}, 1000);
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
};
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss" scoped>
|
|||
|
|
// 必填的样式
|
|||
|
|
.must {
|
|||
|
|
position: relative;
|
|||
|
|
&::before {
|
|||
|
|
content: "*";
|
|||
|
|
color: red;
|
|||
|
|
position: absolute;
|
|||
|
|
top: -10rpx;
|
|||
|
|
right: -17rpx;
|
|||
|
|
transform: scale(0.8);
|
|||
|
|
/* 相对于父元素的左上角定位 */
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.body-box {
|
|||
|
|
max-height: calc(100vh - 250rpx);
|
|||
|
|
overflow-y: auto;
|
|||
|
|
border: 1px solid red;
|
|||
|
|
}
|
|||
|
|
// 基础信息
|
|||
|
|
.base-box {
|
|||
|
|
background-color: white;
|
|||
|
|
// 单行样式
|
|||
|
|
.item-line {
|
|||
|
|
text-align: left;
|
|||
|
|
padding-left: 30rpx;
|
|||
|
|
padding-right: 30rpx;
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
line-height: 90rpx;
|
|||
|
|
height: 90rpx;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
border-bottom: 1px solid #f1f2f6;
|
|||
|
|
.line-label {
|
|||
|
|
// font-size: 30rpx;
|
|||
|
|
color: black;
|
|||
|
|
}
|
|||
|
|
.line-value {
|
|||
|
|
// font-weight: 700;
|
|||
|
|
color: #969696;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
// 表单
|
|||
|
|
.form-box {
|
|||
|
|
margin-top: 20rpx;
|
|||
|
|
background-color: white;
|
|||
|
|
// 返校日期
|
|||
|
|
.item-date {
|
|||
|
|
padding-left: 30rpx;
|
|||
|
|
padding-right: 30rpx;
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
line-height: 90rpx;
|
|||
|
|
height: 90rpx;
|
|||
|
|
display: flex;
|
|||
|
|
position: relative;
|
|||
|
|
.input-mask {
|
|||
|
|
position: absolute;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 90rpx;
|
|||
|
|
// background-color: red;
|
|||
|
|
}
|
|||
|
|
.img {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
width: 30rpx;
|
|||
|
|
// padding-right: 30rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
// 单行样式
|
|||
|
|
.item-line {
|
|||
|
|
text-align: left;
|
|||
|
|
padding-left: 30rpx;
|
|||
|
|
padding-right: 30rpx;
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
line-height: 90rpx;
|
|||
|
|
height: 90rpx;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
border-bottom: 1px solid #f1f2f6;
|
|||
|
|
.line-label {
|
|||
|
|
// font-size: 30rpx;
|
|||
|
|
color: black;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
// 提示
|
|||
|
|
.item-tip {
|
|||
|
|
text-align: left;
|
|||
|
|
padding-left: 30rpx;
|
|||
|
|
padding-right: 30rpx;
|
|||
|
|
padding-bottom: 10rpx;
|
|||
|
|
font-size: 22rpx;
|
|||
|
|
// line-height: 90rpx;
|
|||
|
|
// height: 90rpx;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
border-bottom: 1px solid #f1f2f6;
|
|||
|
|
.line-label {
|
|||
|
|
// font-size: 30rpx;
|
|||
|
|
color: red;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 随行人样式
|
|||
|
|
|
|||
|
|
.item-for {
|
|||
|
|
background-color: #f7f6f9;
|
|||
|
|
padding-left: 30rpx;
|
|||
|
|
display: flex;
|
|||
|
|
width: 100%;
|
|||
|
|
border-bottom: 1px solid #e1e1e1 ;
|
|||
|
|
|
|||
|
|
.for-left {
|
|||
|
|
// border: 1px solid blue;
|
|||
|
|
width: calc(100% - 50rpx);
|
|||
|
|
.each {
|
|||
|
|
flex: 1;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
line-height: 80rpx;
|
|||
|
|
height: 80rpx;
|
|||
|
|
padding-right: 30rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.del {
|
|||
|
|
// border: 1px solid red;
|
|||
|
|
width: 40rpx;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
&:last-of-type{
|
|||
|
|
border-bottom: none;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 文本框
|
|||
|
|
.item-text {
|
|||
|
|
padding-left: 30rpx;
|
|||
|
|
padding-right: 30rpx;
|
|||
|
|
}
|
|||
|
|
// 同意样式
|
|||
|
|
.item-agree {
|
|||
|
|
padding-left: 30rpx;
|
|||
|
|
padding-right: 30rpx;
|
|||
|
|
display: flex;
|
|||
|
|
padding-bottom: 20rpx;
|
|||
|
|
padding-top: 20rpx;
|
|||
|
|
border-top: 1px solid #f1f2f6;
|
|||
|
|
// margin-bottom: 50rpx;
|
|||
|
|
// flex-wrap: wrap;
|
|||
|
|
.agree-left {
|
|||
|
|
width: 50rpx;
|
|||
|
|
}
|
|||
|
|
.agree-right {
|
|||
|
|
color: black;
|
|||
|
|
flex: 1;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
// 按钮
|
|||
|
|
.btn-box {
|
|||
|
|
position: fixed;
|
|||
|
|
width: 100%;
|
|||
|
|
bottom: 0;
|
|||
|
|
height: 150rpx;
|
|||
|
|
border-top: 1px solid #f1f2f6;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
}
|
|||
|
|
</style>
|