388 lines
9.8 KiB
Vue
388 lines
9.8 KiB
Vue
<template>
|
|
<view style="background-color: white; height: 100vh">
|
|
<u-navbar title="返校预约" :custom-back="goPageFn"></u-navbar>
|
|
<!-- tabs -->
|
|
<u-tabs-swiper
|
|
ref="uTabs"
|
|
:list="tabList"
|
|
:current="current"
|
|
:is-scroll="false"
|
|
:active-item-style="{ color: '#3CB5FB'}"
|
|
:bar-style="{ background: '#3CB5FB' }"
|
|
@change="tabsChange"
|
|
></u-tabs-swiper>
|
|
<!-- 滚动区域 -->
|
|
<scroll-view
|
|
scroll-y="true"
|
|
style="
|
|
height: calc(100vh - 320rpx);
|
|
width: 100%;
|
|
border-top: 1px solid #edf2fa;
|
|
background-color: #f1f2f6;
|
|
box-sizing: border-box;
|
|
"
|
|
@scrolltolower="onreachBottom"
|
|
>
|
|
<view
|
|
class="item"
|
|
v-for="(x, y) in schoolList"
|
|
@click="detailFn(x)"
|
|
:key="y"
|
|
>
|
|
<view class="item-line">
|
|
<text class="line-label"> 预约人：</text>
|
|
<text class="line-value"> {{ x.userName }} </text>
|
|
<!-- 待审核 -->
|
|
<text v-if="current === 0" class="line-status yellow">待审核</text>
|
|
<!-- 待核验 -->
|
|
<template v-if="current === 1">
|
|
<text class="line-status blue">待核验</text>
|
|
</template>
|
|
<!-- 已结束 -->
|
|
<template v-if="current === 2">
|
|
<text
|
|
v-if="['已核验'].includes(x.prebookStateZN)"
|
|
class="line-status green"
|
|
>已返校</text
|
|
>
|
|
<text
|
|
v-if="['未返校', '待核验'].includes(x.prebookStateZN)"
|
|
class="line-status red"
|
|
>未返校</text
|
|
>
|
|
<text
|
|
v-if="['已驳回'].includes(x.prebookStateZN)"
|
|
class="line-status red"
|
|
>已驳回</text
|
|
>
|
|
<text
|
|
v-if="['已取消'].includes(x.prebookStateZN)"
|
|
class="line-status red"
|
|
>已取消</text
|
|
>
|
|
</template>
|
|
</view>
|
|
<view class="item-line">
|
|
<text class="line-label"> 预约时间：</text>
|
|
<text class="line-value"> {{ x.retuenSchoolTime || "-" }} </text>
|
|
</view>
|
|
<view class="item-line">
|
|
<text class="line-label"> 车牌号：</text>
|
|
<text class="line-value"> {{ x.carNumber || "-" }} </text>
|
|
</view>
|
|
<view class="item-time">
|
|
<text class="line-label"> 提交时间：</text>
|
|
<text class="line-value"> {{ x.createTime || "-" }} </text>
|
|
</view>
|
|
</view>
|
|
<no-data v-if="!schoolList.length"></no-data>
|
|
</scroll-view>
|
|
<!-- 按钮 -->
|
|
<view class="btn-box">
|
|
<u-button
|
|
style="width: 90%"
|
|
shape="circle"
|
|
type="primary"
|
|
@click="applyFn"
|
|
>我要预约</u-button
|
|
>
|
|
</view>
|
|
<u-toast ref="uToast" />
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { Debounce } from "../../../common/utils.js";
|
|
import { AuditStateEnumMap, PrebookStateEnumMap } from "@/enums/index.js";
|
|
import NoData from "@/components/NoData.vue";
|
|
export default {
|
|
components: { NoData },
|
|
data() {
|
|
return {
|
|
tabList: [
|
|
{
|
|
name: "待审核",
|
|
},
|
|
{
|
|
name: "待核验",
|
|
},
|
|
{
|
|
name: "已结束",
|
|
},
|
|
],
|
|
current: 0,
|
|
// 预约列表
|
|
schoolList: [],
|
|
pageIndex: 1,
|
|
pageSize: 10,
|
|
total: 0,
|
|
// 星期设置
|
|
weekSet: [],
|
|
// 学校基础信息
|
|
baseMsg: {
|
|
id: "",
|
|
name: "", //姓名
|
|
schoolName: "",
|
|
schoolLogo: "",
|
|
startYear: "", //入学年份
|
|
college: "", //学院
|
|
educationStr: "", //学历层次
|
|
major: "", //专业
|
|
endYear: "", //毕业年份
|
|
},
|
|
};
|
|
},
|
|
async onLoad(e) {
|
|
// console.log(AuditStateEnum, "AuditStateEnum--");
|
|
// 获取用户当前学校
|
|
await this.getSchoolFn();
|
|
// 获取列表
|
|
this.getListFn();
|
|
// 获取设置
|
|
this.getSetFn();
|
|
},
|
|
created() {},
|
|
methods: {
|
|
// 获取用户当前学校
|
|
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;
|
|
}
|
|
console.log(findRow, "findRow--当前学校");
|
|
Object.assign(this.baseMsg, findRow);
|
|
},
|
|
//获取返校设置
|
|
async getSetFn() {
|
|
const req = {
|
|
schoolId: this.baseMsg.schoolId,
|
|
};
|
|
const res = await this.$u.apiList.SelectInfoSetApi(req);
|
|
console.log(res, "res--");
|
|
// 星期设置
|
|
this.weekSet = res.dayOfWeek.split(",").map((x) => Number(x));
|
|
// 是否查看二维码
|
|
this.isVerify = res.isVerify;
|
|
},
|
|
// 触底函数
|
|
onreachBottom() {
|
|
console.log("触底了");
|
|
let num = this.pageIndex * this.pageSize;
|
|
if (num >= this.total) return;
|
|
this.pageIndex++;
|
|
this.getListFn();
|
|
},
|
|
// 获取列表
|
|
async getListFn() {
|
|
const req = {
|
|
id: this.vuex_user.id,
|
|
type: this.current,
|
|
pageIndex: this.pageIndex,
|
|
pageSize: this.pageSize,
|
|
educationId: this.baseMsg.id,
|
|
};
|
|
let res = null;
|
|
// 待审核
|
|
if ([0].includes(this.current)) {
|
|
res = await this.$u.apiList.SelectReturnSchoolList_dshApi(req);
|
|
}
|
|
// 待核验，已结束
|
|
if ([1, 2].includes(this.current)) {
|
|
res = await this.$u.apiList.SelectReturnSchoolList_typeApi(req);
|
|
}
|
|
console.log(res, "res--");
|
|
this.total = res.item2;
|
|
if (res.item1.length) {
|
|
this.schoolList = [...this.schoolList, ...res.item1];
|
|
//
|
|
this.schoolList.forEach((x) => {
|
|
x.prebookStateZN = PrebookStateEnumMap.get(x.prebookState);
|
|
x.auditStateZN = AuditStateEnumMap.get(x.auditState);
|
|
// x.retuenSchoolTime = x.retuenSchoolTime.slice(0, 9);
|
|
});
|
|
console.log(
|
|
JSON.parse(JSON.stringify(this.schoolList)),
|
|
"this.schoolList"
|
|
);
|
|
}
|
|
},
|
|
goPageFn() {
|
|
/* uni.switchTab({
|
|
url: "/pages/my/my/my",
|
|
}); */
|
|
uni.navigateBack({
|
|
delta: 1
|
|
});
|
|
},
|
|
// tabschange
|
|
tabsChange(i) {
|
|
console.log(i, "i----");
|
|
if (this.current !== i) {
|
|
this.current = i;
|
|
this.schoolList = [];
|
|
this.pageIndex = 1;
|
|
this.getListFn();
|
|
}
|
|
},
|
|
// 我要预约
|
|
applyFn() {
|
|
if (!this.weekSet.length) {
|
|
/* uni.showToast({
|
|
title: "当前暂停开放返校服务",
|
|
icon: "none",
|
|
}); */
|
|
this.$refs.uToast.show({
|
|
title: "当前暂停开放返校服务",
|
|
type: "error",
|
|
});
|
|
return;
|
|
}
|
|
this.$u.route({
|
|
url: "pages/my/BackApply/BackApply",
|
|
});
|
|
},
|
|
// 查看详情
|
|
detailFn(row) {
|
|
console.log(row, "row----");
|
|
// 待审核
|
|
if ([0].includes(this.current)) {
|
|
this.$u.route({
|
|
url: `pages/my/BackDetail/BackDetail?id=${row.id}&status=待审核`,
|
|
});
|
|
}
|
|
// 待核验
|
|
if ([1].includes(this.current)) {
|
|
// 开启二维码
|
|
if (this.isVerify) {
|
|
// 核验二维码
|
|
this.$u.route({
|
|
url: `pages/my/BackCode/BackCode?id=${row.id}&status=待核验`,
|
|
});
|
|
return;
|
|
}
|
|
// 未开启二维码
|
|
this.$u.route({
|
|
url: `pages/my/BackDetail/BackDetail?id=${row.id}&status=待核验`,
|
|
});
|
|
}
|
|
// 已结束
|
|
if ([2].includes(this.current)) {
|
|
this.$u.route({
|
|
url: `pages/my/BackDetail/BackDetail?id=${row.id}&status=已结束`,
|
|
});
|
|
}
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.item {
|
|
width: calc(100% - 64rpx);
|
|
margin: 32rpx 32rpx 0;
|
|
// height: 80rpx;
|
|
text-align: center;
|
|
// border-bottom: 1px solid blue;
|
|
// margin-top: 20rpx;
|
|
padding-top: 20rpx;
|
|
padding-bottom: 20rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 24rpx;
|
|
border: 2rpx solid #F7F6F9;
|
|
// 时间
|
|
.item-time {
|
|
text-align: left;
|
|
padding-left: 30rpx;
|
|
font-size: 30rpx;
|
|
line-height: 40rpx;
|
|
margin-bottom: 20rpx;
|
|
font-size: 28rpx;
|
|
color: #969696;
|
|
.line-value {
|
|
// font-weight: 700;
|
|
color: black;
|
|
}
|
|
}
|
|
// 单行样式
|
|
.item-line {
|
|
text-align: left;
|
|
padding-left: 30rpx;
|
|
font-size: 30rpx;
|
|
// line-height: 40rpx;
|
|
margin-bottom: 20rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
.line-label {
|
|
// font-size: 30rpx;
|
|
color: #969696;
|
|
}
|
|
.line-value {
|
|
// font-weight: 700;
|
|
color: black;
|
|
}
|
|
// 状态
|
|
.line-status {
|
|
// padding-left: 20rpx;
|
|
// padding-right: 20rpx;
|
|
margin-left: 20rpx;
|
|
font-size: 24rpx;
|
|
display: inline-block;
|
|
box-sizing: border-box;
|
|
width: 104rpx;
|
|
height: 48rpx;
|
|
line-height: 48rpx;
|
|
text-align: center;
|
|
border-radius: 6rpx;
|
|
}
|
|
// 待审核
|
|
.yellow {
|
|
color: #efa643;
|
|
background-color: #fef6e7;
|
|
}
|
|
// 待核验
|
|
.blue {
|
|
color: #278eeb;
|
|
background-color: #e7f3ff;
|
|
}
|
|
// 已核验
|
|
.green {
|
|
color: #74b57f;
|
|
background-color: #ecfbf4;
|
|
}
|
|
// 未返校 已驳回 已取消
|
|
.red {
|
|
color: #d2564c;
|
|
background-color: #ffeeed;
|
|
}
|
|
}
|
|
}
|
|
.btn-box {
|
|
position: fixed;
|
|
width: 100%;
|
|
bottom: 0;
|
|
height: 150rpx;
|
|
border-top: 1px solid #f1f2f6;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background: #f1f2f6;
|
|
}
|
|
::v-deep .u-tabs-scorll-flex .u-tabs-item {
|
|
transition: all 0.1s;
|
|
font-size: 28rpx !important;
|
|
}
|
|
</style>
|