You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

578 lines
14 KiB

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<view class="container">
<!-- #ifdef MP-WEIXIN -->
<privacy-popup
ref="privacyComponent"
@agree-privacy="onAgreePrivacy"
@reject-privacy="onRejectPrivacy"
></privacy-popup>
<!-- #endif -->
<view
class="container-top"
:style="{
background: 'url(' + base.imgHost('index_top_bg.png') + ') no-repeat',
}"
>
<u-navbar
:is-back="false"
:is-fixed="false"
:height="topNavHeight"
:background="topbg"
title-color="#fff"
title-size="32"
:border-bottom="false"
title="苏州科技商学院"
></u-navbar>
<view style="height: 60rpx; margin-top: 20rpx">
<view v-if="showWx" class="container-wx">
<u-icon name="close" color="#fff" @click="showWx = false"></u-icon>
<view>
点击“<text></text><text class="container-wx-big"></text
><text></text>”添加到我的小程序,下次访问更快捷
</view>
</view>
</view>
<topBanner :banner_list="banner_list"></topBanner>
</view>
<view class="container-content">
<image
:src="base.imgHost('index_bg.png')"
width="100%"
height="100%"
></image>
<view class="container-content-calendar">
<view class="container-content-calendar-content">
<CalendarWidget />
</view>
</view>
<view class="container-content-icons">
<view @click="tourl(2)">
<image :src="base.imgHost('index_icon5.png')"></image>
</view>
<!-- <view @click="tourl(3)">
<image :src="base.imgHost('index_icon6.png')"></image>
</view> -->
<view @click="tourl(1)">
<image :src="base.imgHost('index_icon7.png')"></image>
</view>
<!-- <view @click="tourl(6)">
<image :src="base.imgHost('index_icon8.png')"></image>
</view> -->
</view>
<view class="container-content-info">
<view class="container-content-info_title">
<view>资讯</view>
<view @click="tourl(4)">查看全部</view>
</view>
<view class="container-content-info_swiper">
<swiper
circular
:current="info_index"
@change="changeInfo"
next-margin="340rpx"
>
<swiper-item
v-for="(item, index) in notices_list"
:key="index"
@click="tourl(5, item.titleurl)"
>
<view class="imgwrap" :class="{ active: info_index === index }">
<image mode="aspectFill" :src="item.titlepic"></image>
</view>
<view class="title">
<view class="title-name">
{{ item.title }}
</view>
<view class="title-time">
{{ item.newstime }}
</view>
</view>
</swiper-item>
</swiper>
</view>
</view>
</view>
<tabbar :currentPage="0"></tabbar>
<!-- -->
<view class="birthday-popup" :style="{background: 'url(' + base.imgHost('bbg.png') + ') no-repeat left top','background-size': '100% 100%'}" v-if="is_birthday && !hasShowBirthday">
<view class="birthday-content">
<view class="birthday-title">Happy birthday!</view>
<view class="birthday-subtitle">亲爱的{{ vuex_user.name }}</view>
<view class="birthday-img">
<image :src="base.imgHost('btips.png')"></image>
</view>
<view class="birthday-button" @click="closeBirthdayPopup">返回首页</view>
</view>
</view>
</view>
</template>
<script>
import { ROOTPATH as baseUrl } from "@/common/config.js";
import tabbar from "@/components/tabbar/tabbar.vue";
import topBanner from "@/components/topBanner.vue";
import PrivacyPopup from "@/components/privacy-popup/privacy-popup.vue";
import CalendarWidget from "@/components/calendar-widget/calendar-widget.vue";
export default {
components: {
tabbar,
topBanner,
PrivacyPopup,
CalendarWidget,
},
data() {
return {
topNavHeight: 40,
topbg: {
backgroundColor: "transparent",
},
showWx: true,
banner_list: [],
notices_list: [],
can_appointment: false,
is_birthday: false,
hasShowBirthday: false,
};
},
onShareAppMessage() {
return {
title: "苏州科技商学院",
imageUrl: "/static/share.jpg",
};
},
onShareTimeline() {
return {
title: "苏州科技商学院",
imageUrl: "/static/share.jpg",
};
},
onLoad() {
let menuButtonObject = uni.getMenuButtonBoundingClientRect();
this.topNavHeight = menuButtonObject.height + 8;
// 检查今天是否已经显示过生日弹窗
this.hasShowBirthday = uni.getStorageSync("hasShowBirthday") || false;
let token = uni.getStorageSync("stbc1_lifeData")
? uni.getStorageSync("stbc1_lifeData").vuex_token
: "";
if (this.base.isNull(token)) {
this.getToken();
} else {
// 如果有token直接获取用户信息
this.getUser();
}
this.getNoticesList();
this.getBannerList();
},
methods: {
onAgreePrivacy() {
// 用户同意隐私政策
// 在这里添加您想要执行的代码
console.log("User agreed to the privacy policy");
// this.getToken()
},
onRejectPrivacy() {
// 用户拒绝隐私政策
// 在这里添加您想要执行的代码
// wx.exitMiniProgram();
console.log("User rejected the privacy policy");
},
changeCurrent(e) {
this.show_current_swiper = e.detail.current + 1;
},
changeInfo(e) {
this.info_index = e.detail.current;
},
async getToken() {
let that = this;
const loginResult = await new Promise((resolve, reject) => {
uni.login({
provider: "weixin",
success: (res) => {
resolve(res.code);
},
fail: (err) => {
console.error("uni.login失败:", err);
reject(err);
},
});
});
const tokenResult = await new Promise((resolve, reject) => {
this.$u.api
.login({
code: loginResult,
})
.then((res1) => {
console.log("res1", res1);
uni.setStorageSync("stbc1_lifeData", {
vuex_token: res1.token,
});
resolve(res1.token);
})
.catch((err) => {
reject(err);
console.log("login-error:", JSON.stringify(err));
});
});
await uni.request({
url: `${baseUrl}/api/mobile/user/get-user-info`,
header: {
Authorization: `Bearer ${tokenResult}`,
},
data: {},
method: "GET",
success: (result1) => {
uni.setStorageSync("stbc1_lifeData", {
vuex_token: tokenResult,
vuex_user: result1.data.user,
});
// 登录成功后检查用户生日
if (result1.data.is_birthday && !this.hasShowBirthday) {
this.is_birthday = true;
}
},
fail(err) {
console.log("uesr-error", err);
},
});
},
async getUser() {
await this.$u.api.user().then((res) => {
// if (res.user.appointment_total - res.user.pass_appointments > 0) {
// this.can_appointment = true;
// } else {
// this.can_appointment = false;
// }
// this.door_appointments = res.door_appointments ? true : false
this.$u.vuex("vuex_user", res.user);
// 检查用户是否今天生日使用接口返回的is_birthday参数
if (res.is_birthday && !this.hasShowBirthday) {
this.is_birthday = true;
}
});
},
// 关闭生日弹窗
closeBirthdayPopup() {
this.is_birthday = false;
// 标记今天已经显示过生日弹窗
uni.setStorageSync("hasShowBirthday", true);
this.hasShowBirthday = true;
},
async getBannerList() {
const res = await this.$u.api.otherBanner({
position: 1,
});
if (res.length > 0) {
this.banner_list = res.sort((a, b) => {
a.sort - b.sort;
});
} else {
this.banner_list = [{}];
}
},
async getNoticesList() {
const baseUrl = "https://www.sstbc.com";
let that = this;
// const res = await this.$u.api.courseNews({
// page: 1,
// page_size: 5,
// })
// this.notices_list = res.rows
let _arr = [];
uni.request({
url: baseUrl + "/e/extend/news.php",
data: {
page: 1,
pagesize: 5,
},
success(res) {
console.log("res", res);
if (res.statusCode === 200) {
if (res.data.rows.length > 0) {
res.data.rows.map((item) => {
item.titlepic = baseUrl + item.titlepic;
});
}
_arr = res.data.rows;
}
that.notices_list = _arr;
console.log("this.notices_list", that.notices_list);
},
fail(err) {
console.log("err", err);
},
});
},
async tourl(type, url) {
if (type === 1) {
// uni.navigateTo({
// url: '/packages/webview/index?type=1'
// })
uni.navigateTo({
url: "/packages/mycourse/index",
});
} else if (type === 2) {
uni.switchTab({
url: "/pages/course/index",
});
} else if (type === 3) {
// await this.getUser()
// if (!this.can_appointment) {
// this.base.toast("您当前没有可预约次数")
// return
// }
uni.navigateTo({
url: "/packages/booksubmit/appointment",
});
} else if (type === 4) {
uni.navigateTo({
url: "/packages/webview/index?type=2",
});
} else if (type === 5) {
// 资讯详情
uni.navigateTo({
url: "/packages/webview/index?type=3&url=" + url,
});
} else if (type === 6) {
uni.navigateTo({
url: "/packages/courseCalendar/index",
});
}
},
},
};
</script>
<style scoped lang="scss">
.container {
background-color: #fff;
width: 100%;
min-height: 100vh;
padding-bottom: 80rpx;
&-top {
width: 100%;
height: 570rpx;
// background: url("https://wx.sstbc.com/wx-icon/index_top_bg.png") no-repeat;
background-size: 100% 100%;
}
&-wx {
display: flex;
align-items: center;
color: #fff;
font-size: 24rpx;
width: 100%;
background-color: #271f8e;
padding: 15rpx 0;
height: 60rpx;
// margin-top: 20rpx;
::v-deep .u-icon {
margin: 0 30rpx;
}
text {
width: 10rpx;
height: 10rpx;
border-radius: 10rpx;
background-color: #fff;
margin: 0 5rpx;
display: inline-block;
}
&-big {
width: 20rpx !important;
height: 20rpx !important;
border-radius: 20rpx !important;
vertical-align: middle;
}
}
&-content {
width: 100%;
position: relative;
position: relative;
padding-top: 200rpx;
& > image {
width: 100%;
height: 100%;
position: absolute;
top: -40rpx;
left: 0;
}
&-icons {
display: flex;
justify-content: space-around;
align-items: center;
position: relative;
padding-bottom: 30rpx;
flex-wrap: wrap;
padding-top: 50rpx;
& > view {
font-size: 0;
}
image {
width: 325rpx;
height: 149rpx;
margin: 10rpx 0;
}
}
&-calendar {
// padding: 0 30rpx;
position: relative;
// padding-bottom: 130rpx;
&-title {
display: flex;
align-items: center;
justify-content: space-between;
width: 680rpx;
margin: 0 auto;
font-size: 28rpx;
color: #666;
margin-bottom: 30rpx;
view:first-child {
font-size: 42rpx;
color: #333;
}
}
}
&-calendar-content {
// padding: 0 30rpx;
// padding-bottom: 130rpx;
}
&-info {
position: relative;
padding-top: 80rpx;
&_title {
display: flex;
align-items: center;
justify-content: space-between;
width: 680rpx;
margin: 0 auto;
font-size: 28rpx;
color: #666;
margin-bottom: 30rpx;
view:first-child {
font-size: 42rpx;
color: #333;
}
}
&_swiper {
margin-left: 20rpx;
height: 780rpx;
swiper {
height: 100%;
swiper-item {
.imgwrap {
padding: 10rpx;
border-radius: 10rpx;
width: 390rpx;
margin-bottom: 20rpx;
image {
width: 370rpx;
height: 460rpx;
}
}
.imgwrap.active {
background-color: #fff;
}
.title {
font-size: 24rpx;
width: 390rpx;
padding: 10rpx;
&-name {
line-height: 1.5;
color: #333333;
margin-bottom: 30rpx;
}
&-time {
color: #666666;
}
}
}
}
}
}
}
}
.birthday-popup {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background-size: 100% 100%;
z-index: 9999;
display: flex;
align-items: center;
justify-content: center;
.birthday-content {
text-align: center;
padding: 0 60rpx;
max-width: 600rpx;
width: 100%;
position: absolute;
bottom: 150rpx;
left: 50%;
transform: translate(-50%,0);
}
.birthday-title {
font-size: 46rpx;
font-weight: bold;
color: #855413;
margin-bottom: 20rpx;
}
.birthday-subtitle {
font-size: 68rpx;
color: #855413;
// line-height: 1.5;
margin-bottom: 70rpx;
}
.birthday-img{
margin-bottom: 90rpx;
image{
width: 374rpx;
height: 109rpx;
}
}
.birthday-button {
background: #c89b5b;
color: white;
padding: 25rpx 60rpx;
border-radius: 50rpx;
font-size: 32rpx;
// font-weight: bold;
box-shadow: 0 10rpx 30rpx #c89b5b;
transition: all 0.3s ease;
}
}
</style>