周锐 / zk-teach-applet · Commits

Go to a project

Authored by Rickie
Commit b024d3e3dfa0caf1620d5abd9db0d9e112daa6ba 1 parent 00131b77

完善

Inline Side-by-side
Showing 7 changed files with 200 additions and 142 deletions
import { request } from '../utils/request.js';
export const getDeviceList = () => {
return request({
url: '/device/list',
method: 'GET',
});
};
// 登录
export const loginApi = (data) => {
return request({
... ... @@ -59,4 +52,22 @@ export const signUpApi = (data) => {
method: 'POST',
data,
});
};
// 获取用户信息
export const userInfoApi = (data) => {
return request({
url: '/api/get-info',
method: 'GET',
data,
});
};
// 获取我的报名列表
export const userSignUpListApi = (data) => {
return request({
url: '/api/course/get-my-signup',
method: 'GET',
data,
});
};
\ No newline at end of file
... ...
... ... @@ -10,7 +10,8 @@
{
"path": "pages/my/my",
"style": {
"navigationBarTitleText": "我的"
"navigationBarTitleText": "",
"navigationStyle": "custom"
}
},
{
... ...
... ... @@ -90,16 +90,24 @@
const submit = async () => {
try {
await formRef.value.validate()
await formRef.value.validate()
uni.showLoading({
title: "提交中",
mask: true
})
const res = await addStudentsApi(state.studentInfo)
uni.hideLoading()
uni.showToast({
icon: 'success',
title: '添加成功'
})
formRef.value.resetFields()
uni.navigateBack()
} catch {}
} finally {
uni.hideLoading()
}
}
</script>
... ...
... ... @@ -122,12 +122,15 @@
const getCourseList = async () => {
try {
uni.showLoading({ title: "加载中" })
const { data } = await courseListApi({
grade: state.grade === "全部年级" ? "" : state.grade,
subject: state.accounts === "全部科目" ? "" : state.accounts
})
state.courses = data.courses
} catch {}
} finally {
uni.hideLoading()
}
}
const showGradesPop = () => {
... ...
... ... @@ -62,18 +62,26 @@
const loginHandler = async () => {
try {
await formRef.value.validate()
await formRef.value.validate()
uni.showLoading({
title: "登录中",
mask: true
})
const {
token
} = await loginApi(state.userInfo)
} = await loginApi(state.userInfo)
uni.hideLoading()
uni.showToast({
icon: 'success',
title: '登录成功'
})
uni.setStorageSync('token', token)
uni.navigateBack()
} catch {}
} finally {
uni.hideLoading()
}
}
</script>
... ...
<template>
<view class="container">
<!-- 自定义标题栏 -->
<uv-navbar leftIcon="" placeholder bgColor="/static/topBg.png">
<template v-slot:center>
<view class="uv-nav-slot">
<image src="/static/my/myTitle.png" mode="heightFix" style="height: 44rpx;"></image>
<template>
<view class="container">
 <uv-navbar leftIcon="" placeholder bgColor="rgba(255, 255, 255, 0)" />
<view class="content-box">
<view class="header">
<view class="avatar">
<image v-if="state.userInfo?.avatar" :src="state.userInfo.avatar" style="width: 100%;height: 100%;"></image>
</view>
</template>
</uv-navbar>
<view class="content-box">
<div class="content-padding">
<!-- 用户信息 -->
<view class="user-info">
<view class="center-avatar">
<view class="center-inner">
<image src="/static/my/avatar.png" style="width: 100%;height: 100%;"></image>
</view>
<view class="fm-box">
<view style="font-size: 36rpx;">
{{ state.userInfo?.nickName || "未知" }}
</view>
<view class="loginTo-btn">
登录/注册
<view class="">
{{ state.userInfo?.phonenumber ? state.userInfo?.phonenumber.slice(0, 8) + '****' : "" }}
</view>
</view>
<view class="nav-list">
<view class="nav-item">
<view style="display: flex;align-items: center;">
<uv-icon name="/static/my/student.png" :size="22"></uv-icon>
<view style="margin-left: 26rpx;color: #6a6a6a;">绑定学生</view>
</view>
<view style="background-color: #fff;padding: 20rpx 30rpx;margin-top: 60rpx;border-radius: 20rpx;font-size: 28rpx;">
<view style="display: flex;justify-content: space-between;">
<view class="">
我的孩子
</view>
<view style="display: flex;justify-content: space-between;align-items: center;color: #7175f0;">
添加<uv-icon name="arrow-right" color="#7175f0" size="14"></uv-icon>
</view>
</view>
<view style="display: grid;grid-template-columns: repeat(2, 1fr);gap: 20rpx;margin-top: 30rpx;">
<view v-for="item in state.students" style="display: flex;border: 2rpx solid #e4e9ff;padding: 10rpx;border-radius: 20rpx;">
<view style="flex-shrink: 0;width: 90rpx;height: 90rpx;border-radius: 50%;background-color: #bdceff;">
<image v-if="item.avatar" :src="item.avatar" style="width: 100%;height: 100%;"></image>
</view>
<view style="flex: 1;display: flex;flex-direction: column;justify-content: space-between;margin-left: 20rpx;">
<view class="">
{{ item.name || "未知" }}
</view>
<view style="font-size: 28rpx;">
{{ item.grade || "-" }}
</view>
</view>
<uv-icon name="arrow-right" :size="16"></uv-icon>
</view>
<view class="nav-item">
<view style="display: flex;align-items: center;">
<uv-icon name="/static/my/print.png" :size="24"></uv-icon>
<view style="margin-left: 26rpx;color: #6a6a6a;">打印记录</view>
</view>
</view>
<view style="background-color: #fff;padding: 20rpx 30rpx;border-radius: 20rpx;font-size: 28rpx;margin-top: 40rpx;">
<view style="margin-bottom: 30rpx;">
我的报名
</view>
<template v-if="state.signupList.length">
<view v-for="item in state.signupList" style="display: flex;justify-content: space-between;border-radius: 20rpx;border: 2rpx solid #bdceff;padding: 10rpx;">
<view style="background-color: #b8cfff;border-radius: 16rpx;flex-shrink: 0;width: 100rpx;height: 100rpx;">
<image v-if="item.avatar" :src="item.avatar" style="width: 100%;height: 100%;"></image>
</view>
<view style="flex: 1;display: flex;flex-direction: column;justify-content: space-between;margin-left: 20rpx;">
<view class="">
华地校区-四年级-数学-A+班
</view>
<view class="">
10-01至10-31 19:00-21：00
</view>
</view>
<uv-icon name="arrow-right" :size="16"></uv-icon>
</view>
</template>
<view v-else style="text-align: center;color: #666;padding: 30rpx 0;">
暂无报名数据
</view>
</div>
</view>
</view>
</template>
<script setup>
</script>
<style lang="scss" scoped>
.container {
background-color: #f7f8fa;
height: 100vh;
overflow-y: auto;
display: flex;
flex-direction: column;
</view>
</view>
</view>
</template>
<script setup>
import {
reactive,
onMounted
} from 'vue';
import { userInfoApi, myStudentsApi, userSignUpListApi } from "@/api/index.js"
const state = reactive({
userInfo: {},
signupList: [],
students: []
})
onMounted(() => {
getUserInfo()
getMyStudents()
getuserSignUpList()
})
const getUserInfo = async () => {
const { data } = await userInfoApi()
state.userInfo = data.user
}
.content-box {
flex: 1;
overflow-y: auto;
background-image: url('~@/static/bottomBg.png');
background-repeat: no-repeat;
background-size: 100% auto;
const getMyStudents = async () => {
const { data } = await myStudentsApi()
state.students = data.students
}
.content-padding {
padding: 0 28rpx;
const getuserSignUpList = async () => {
const { data } = await userSignUpListApi()
console.log(data)
state.signupList = data.signupList
}
</script>
<style lang="scss" scoped>
.container {
background: linear-gradient(135deg, #d4d6fe 10%, #f6f7fb 90%);
background-color: red;
height: calc(100vh - var(--tab-bar-height));
display: flex;
flex-direction: column;
}
.content-box {
flex: 1;
overflow-y: auto;
padding: 0 30rpx;
display: flex;
flex-direction: column;
}
.user-info {
width: 100%;
height: 440rpx;
background-image: url('~@/static/my/information.png');
background-repeat: no-repeat;
background-size: 100% auto;
background-position: bottom;
background-color: transparent;
position: relative;
.center-avatar {
position: absolute;
top: 20rpx;
left: 50%;
transform: translateX(-50%);
width: 34%;
aspect-ratio: 1/1;
background-color: #fff;
border-radius: 50%;
.center-inner {
width: 100%;
height: 100%;
border-radius: 50%;
overflow: hidden;
}
}
.loginTo-btn {
position: absolute;
left: 50%;
bottom: 60rpx;
transform: translateX(-50%);
color: #fff;
font-size: 44rpx;
}
.header {
display: flex;
justify-content: space-between;
padding: 0 20rpx;
}
.nav-list {
background-color: #fff;
border-radius: 12rpx;
box-shadow: 0 0 20rpx #eee;
padding: 10rpx 20rpx;
box-sizing: border-box;
margin-top: 40rpx;
.nav-item {
display: flex;
justify-content: space-between;
border-bottom: 2rpx dashed #d8d8d8;
padding: 30rpx 0;
&:last-child {
border: none;
}
}
.avatar {
flex-shrink: 0;
width: 120rpx;
height: 120rpx;
border-radius: 50%;
background-color: #c1cdff;
}
.fm-box {
margin-left: 30rpx;
flex: 1;
display: flex;
flex-direction: column;
justify-content: space-between;
padding: 6rpx 0;
}
</style>
\ No newline at end of file
... ...
... ... @@ -20,7 +20,7 @@
<view class="student-box" style="margin-top: 30rpx;display: block;">
<view class="title" style="margin-bottom: 30rpx;">
选择地区
选择校区
</view>
<view style="display: grid;grid-template-columns: repeat(3, 1fr);gap: 20rpx;">
<view v-for="item in state.selectData.schoolArr" @click="select1(item)"
... ... @@ -166,7 +166,7 @@
})
if (!state.schoolName) return uni.showToast({
icon: 'error',
title: '请选择地区'
title: '请选择校区'
})
if (!state.className) return uni.showToast({
icon: 'error',
... ... @@ -180,6 +180,7 @@
icon: 'error',
title: '请选择时段'
})
uni.showLoading({ title: "提交中", mask: true })
await signUpApi({
studentWorkNo: state.students[state.activeIndex]?.workNo,
courseId: state.courseId,
... ... @@ -194,7 +195,9 @@
title: '报名成功'
})
resetSelect()
} catch {}
} finally {
uni.hideLoading();
}
}
const resetSelect = () => {
... ... @@ -256,18 +259,23 @@
const getSelectCourseData = async () => {
if (state.courseId === null) return
const {
data
} = await getSelectApi({
courseId: state.courseId,
schoolName: state.schoolName,
className: state.className,
teacherName: state.teacherName,
courseDate: state.courseDate,
courseTime: state.courseTime
})
state.selectData = data
try {
uni.showLoading({ title: "加载中", mask: true })
const {
data
} = await getSelectApi({
courseId: state.courseId,
schoolName: state.schoolName,
className: state.className,
teacherName: state.teacherName,
courseDate: state.courseDate,
courseTime: state.courseTime
})
state.selectData = data
} finally {
uni.hideLoading()
}
}
const getMyStudents = async () => {
... ...