Commit 848d4670 authored by 石盼盼's avatar 石盼盼

页面

parent 32323cd2
......@@ -4,7 +4,14 @@
"pages/tabbar/class/class",
"pages/tabbar/financial/financial",
"pages/tabbar/personal/personal",
"pages/my/parents/parents"
"pages/my/parents/parents",
"pages/my/teachingArea/teachingArea",
"pages/index/classManagement/classManagement",
"pages/index/courseInstant/courseInstant",
"pages/index/classDetail/classDetail",
"pages/index/performance/performance",
"pages/index/evaluation/evaluation",
"pages/team/teamDetail/teamDetail"
],
"tabBar":{
"custom":false,
......
import { VantComponent } from '../common/component';
import { isImageFile, isVideo, chooseFile, isPromise } from './utils';
import { chooseImageProps, chooseVideoProps } from './shared';
VantComponent({
props: Object.assign(
Object.assign(
{
disabled: Boolean,
multiple: Boolean,
uploadText: String,
useBeforeRead: Boolean,
afterRead: null,
beforeRead: null,
previewSize: {
type: null,
value: 90,
},
name: {
type: [Number, String],
value: '',
},
accept: {
type: String,
value: 'image',
},
fileList: {
type: Array,
value: [],
observer: 'formatFileList',
},
maxSize: {
type: Number,
value: Number.MAX_VALUE,
},
maxCount: {
type: Number,
value: 100,
},
deletable: {
type: Boolean,
value: true,
},
showUpload: {
type: Boolean,
value: true,
},
previewImage: {
type: Boolean,
value: true,
},
previewFullImage: {
type: Boolean,
value: true,
},
imageFit: {
type: String,
value: 'scaleToFill',
},
uploadIcon: {
type: String,
value: 'photograph',
},
},
chooseImageProps
),
chooseVideoProps
),
data: {
lists: [],
isInCount: true,
},
methods: {
formatFileList() {
const { fileList = [], maxCount } = this.data;
const lists = fileList.map((item) =>
Object.assign(Object.assign({}, item), {
isImage:
typeof item.isImage === 'undefined'
? isImageFile(item)
: item.isImage,
})
);
this.setData({ lists, isInCount: lists.length < maxCount });
},
getDetail(index) {
return {
name: this.data.name,
index: index == null ? this.data.fileList.length : index,
};
},
startUpload() {
const { maxCount, multiple, accept, lists, disabled } = this.data;
if (disabled) return;
chooseFile(
Object.assign(Object.assign({}, this.data), {
maxCount: maxCount - lists.length,
})
)
.then((res) => {
let file = null;
if (isVideo(res, accept)) {
file = Object.assign({ path: res.tempFilePath }, res);
} else {
file = multiple ? res.tempFiles : res.tempFiles[0];
}
this.onBeforeRead(file);
})
.catch((error) => {
this.$emit('error', error);
});
},
onBeforeRead(file) {
const { beforeRead, useBeforeRead } = this.data;
let res = true;
if (typeof beforeRead === 'function') {
res = beforeRead(file, this.getDetail());
}
if (useBeforeRead) {
res = new Promise((resolve, reject) => {
this.$emit(
'before-read',
Object.assign(Object.assign({ file }, this.getDetail()), {
callback: (ok) => {
ok ? resolve() : reject();
},
})
);
});
}
if (!res) {
return;
}
if (isPromise(res)) {
res.then((data) => this.onAfterRead(data || file));
} else {
this.onAfterRead(file);
}
},
onAfterRead(file) {
const { maxSize } = this.data;
const oversize = Array.isArray(file)
? file.some((item) => item.size > maxSize)
: file.size > maxSize;
if (oversize) {
this.$emit('oversize', Object.assign({ file }, this.getDetail()));
return;
}
if (typeof this.data.afterRead === 'function') {
this.data.afterRead(file, this.getDetail());
}
this.$emit('after-read', Object.assign({ file }, this.getDetail()));
},
deleteItem(event) {
const { index } = event.currentTarget.dataset;
this.$emit(
'delete',
Object.assign(Object.assign({}, this.getDetail(index)), {
file: this.data.fileList[index],
})
);
},
onPreviewImage(event) {
if (!this.data.previewFullImage) return;
const { index } = event.currentTarget.dataset;
const { lists } = this.data;
const item = lists[index];
wx.previewImage({
urls: lists
.filter((item) => item.isImage)
.map((item) => item.url || item.path),
current: item.url || item.path,
fail() {
wx.showToast({ title: '预览图片失败', icon: 'none' });
},
});
},
onClickPreview(event) {
const { index } = event.currentTarget.dataset;
const item = this.data.lists[index];
this.$emit(
'click-preview',
Object.assign(Object.assign({}, item), this.getDetail(index))
);
},
},
});
{
"component": true,
"usingComponents": {
"van-icon": "../icon/index",
"van-loading": "../loading/index"
}
}
<wxs src="../wxs/utils.wxs" module="utils" />
<view class="van-uploader">
<view class="van-uploader__wrapper">
<!-- 预览样式 -->
<view
wx:if="{{ previewImage }}"
wx:for="{{ lists }}"
wx:key="index"
class="van-uploader__preview"
data-index="{{ index }}"
bindtap="onClickPreview"
>
<image
wx:if="{{ item.isImage }}"
mode="{{ imageFit }}"
src="{{ item.url || item.path }}"
alt="{{ item.name || ('图片' + index) }}"
class="van-uploader__preview-image"
style="width: {{ utils.addUnit(previewSize) }}; height: {{ utils.addUnit(previewSize) }};"
data-index="{{ index }}"
bind:tap="onPreviewImage"
/>
<view
wx:else
class="van-uploader__file"
style="width: {{ utils.addUnit(previewSize) }}; height: {{ utils.addUnit(previewSize) }};"
>
<van-icon name="description" class="van-uploader__file-icon" />
<view class="van-uploader__file-name van-ellipsis">{{ item.name || item.url || item.path }}</view>
</view>
<view
wx:if="{{ item.status === 'uploading' || item.status === 'failed' }}"
class="van-uploader__mask"
>
<van-icon wx:if="{{ item.status === 'failed' }}" name="warning-o" class="van-uploader__mask-icon" />
<van-loading wx:else class="van-uploader__loading" />
<text wx:if="{{ item.message }}" class="van-uploader__upload-text">{{ item.message }}</text>
</view>
<van-icon
wx:if="{{ deletable }}"
name="clear"
class="van-uploader__preview-delete"
data-index="{{ index }}"
bind:tap="deleteItem"
/>
</view>
<!-- 上传样式 -->
<block wx:if="{{ isInCount }}">
<view class="van-uploader__slot" bind:tap="startUpload">
<slot />
</view>
<!-- 默认上传样式 -->
<view
wx:if="{{ showUpload }}"
class="van-uploader__upload {{ disabled ? 'van-uploader__upload--disabled': ''}}"
style="width: {{ utils.addUnit(previewSize) }}; height: {{ utils.addUnit(previewSize) }};"
bind:tap="startUpload"
>
<van-icon name="{{ uploadIcon }}" class="van-uploader__upload-icon" />
<text wx:if="{{ uploadText }}" class="van-uploader__upload-text">{{ uploadText }}</text>
</view>
</block>
</view>
</view>
@import '../common/index.wxss';.van-uploader{position:relative;display:inline-block}.van-uploader__wrapper{display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap}.van-uploader__slot:empty{display:none}.van-uploader__slot:not(:empty)+.van-uploader__upload{display:none!important}.van-uploader__upload{position:relative;display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;box-sizing:border-box;width:80px;height:80px;margin:0 8px 8px 0;background-color:#f7f8fa;border-radius:8px}.van-uploader__upload:active{background-color:#f2f3f5}.van-uploader__upload-icon{color:#dcdee0;font-size:24px}.van-uploader__upload-text{margin-top:8px;color:#969799;font-size:12px}.van-uploader__upload--disabled{opacity:.5;opacity:var(--uploader-disabled-opacity,.5)}.van-uploader__preview{position:relative;margin:0 8px 8px 0;cursor:pointer}.van-uploader__preview-image{display:block;width:80px;height:80px;overflow:hidden;border-radius:8px}.van-uploader__preview-delete{position:absolute;top:-8px;right:-8px;color:#969799;font-size:18px;background-color:#fff;border-radius:100%}.van-uploader__file{display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;width:80px;height:80px;background-color:#f7f8fa;border-radius:8px}.van-uploader__file-icon{color:#646566;font-size:20px}.van-uploader__file-name{box-sizing:border-box;width:100%;margin-top:8px;padding:0 4px;color:#646566;font-size:12px;text-align:center}.van-uploader__mask{position:absolute;top:0;right:0;bottom:0;left:0;display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;color:#fff;background-color:rgba(50,50,51,.88);border-radius:8px}.van-uploader__mask-icon{font-size:22px}.van-uploader__mask-message{margin-top:6px;padding:0 4px;font-size:12px;line-height:14px}.van-uploader__loading{width:22px;height:22px;color:#fff}
\ No newline at end of file
export declare const chooseImageProps: {
sizeType: {
type: ArrayConstructor;
value: string[];
};
capture: {
type: ArrayConstructor;
value: string[];
};
};
export declare const chooseVideoProps: {
capture: {
type: ArrayConstructor;
value: string[];
};
compressed: {
type: BooleanConstructor;
value: boolean;
};
maxDuration: {
type: NumberConstructor;
value: number;
};
camera: {
type: StringConstructor;
value: string;
};
};
// props for choose image
export const chooseImageProps = {
sizeType: {
type: Array,
value: ['original', 'compressed'],
},
capture: {
type: Array,
value: ['album', 'camera'],
},
};
// props for choose video
export const chooseVideoProps = {
capture: {
type: Array,
value: ['album', 'camera'],
},
compressed: {
type: Boolean,
value: true,
},
maxDuration: {
type: Number,
value: 60,
},
camera: {
type: String,
value: 'back',
},
};
/// <reference types="miniprogram-api-typings" />
interface File {
path: string;
url: string;
size: number;
name: string;
type: string;
time: number;
image: boolean;
}
export declare function isImageFile(item: File): boolean;
export declare function isVideo(
res: any,
accept: string
): res is WechatMiniprogram.ChooseVideoSuccessCallbackResult;
export declare function chooseFile({
accept,
multiple,
capture,
compressed,
maxDuration,
sizeType,
camera,
maxCount,
}: {
accept: any;
multiple: any;
capture: any;
compressed: any;
maxDuration: any;
sizeType: any;
camera: any;
maxCount: any;
}): Promise<
| WechatMiniprogram.ChooseImageSuccessCallbackResult
| WechatMiniprogram.ChooseMediaSuccessCallbackResult
| WechatMiniprogram.ChooseVideoSuccessCallbackResult
| WechatMiniprogram.ChooseMessageFileSuccessCallbackResult
>;
export declare function isFunction(val: unknown): val is Function;
export declare function isObject(val: any): val is Record<any, any>;
export declare function isPromise<T = any>(val: unknown): val is Promise<T>;
export {};
const IMAGE_REGEXP = /\.(jpeg|jpg|gif|png|svg|webp|jfif|bmp|dpg)/i;
function isImageUrl(url) {
return IMAGE_REGEXP.test(url);
}
export function isImageFile(item) {
if (item.type) {
return item.type.indexOf('image') === 0;
}
if (item.path) {
return isImageUrl(item.path);
}
if (item.url) {
return isImageUrl(item.url);
}
return false;
}
export function isVideo(res, accept) {
return accept === 'video';
}
export function chooseFile({
accept,
multiple,
capture,
compressed,
maxDuration,
sizeType,
camera,
maxCount,
}) {
switch (accept) {
case 'image':
return new Promise((resolve, reject) => {
wx.chooseImage({
count: multiple ? Math.min(maxCount, 9) : 1,
sourceType: capture,
sizeType,
success: resolve,
fail: reject,
});
});
case 'media':
return new Promise((resolve, reject) => {
wx.chooseMedia({
count: multiple ? Math.min(maxCount, 9) : 1,
sourceType: capture,
maxDuration,
sizeType,
camera,
success: resolve,
fail: reject,
});
});
case 'video':
return new Promise((resolve, reject) => {
wx.chooseVideo({
sourceType: capture,
compressed,
maxDuration,
camera,
success: resolve,
fail: reject,
});
});
default:
return new Promise((resolve, reject) => {
wx.chooseMessageFile({
count: multiple ? maxCount : 1,
type: 'file',
success: resolve,
fail: reject,
});
});
}
}
export function isFunction(val) {
return typeof val === 'function';
}
export function isObject(val) {
return val !== null && typeof val === 'object';
}
export function isPromise(val) {
return isObject(val) && isFunction(val.then) && isFunction(val.catch);
}
// pages/index/classDetail/classDetail.js
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
goperformance:function(){
wx.navigateTo({
url: '../../index/performance/performance',
})
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
{
"usingComponents": {},
"navigationBarTitleText": "课程详情"
}
\ No newline at end of file
<view class="top flex-h flex-vc flex-hb">
<view class="time">上课时间</view>
<view class="date">
<text class="nyr">2020-10-28</text>
<text>15:00~16:00</text>
</view>
</view>
<view class="top flex-h flex-vc flex-hb">
<view class="time">课程瞬间</view>
<view class="date">
<text class="nyr">查看</text>
<text class="iconfont icongengduo"></text>
</view>
</view>
<view class="cont">
<view class="item flex-h flex-vc flex-hb">
<view class="flex-h flex-vc">
<image src="../../../images/photo.png"></image>
<view>
<view class="name">西西</view>
<view class="big_name">大名:王梓甜</view>
</view>
</view>
<view>
<view class="evaluation" catchtap="goperformance">运动评价</view>
</view>
</view>
<view class="line"></view>
<view class="item flex-h flex-vc flex-hb">
<view class="flex-h flex-vc">
<image src="../../../images/photo.png"></image>
<view>
<view class="name">西西</view>
<view class="big_name">大名:王梓甜</view>
</view>
</view>
<view>
<view class="leave">已请假</view>
</view>
</view>
<view class="line"></view>
<view class="item flex-h flex-vc flex-hb">
<view class="flex-h flex-vc">
<image src="../../../images/photo.png"></image>
<view>
<view class="name">西西</view>
<view class="big_name">大名:王梓甜</view>
</view>
</view>
<view>
<view class="evaluation">运动评价</view>
</view>
</view>
<view class="line"></view>
<view class="item flex-h flex-vc flex-hb">
<view class="flex-h flex-vc">
<image src="../../../images/photo.png"></image>
<view>
<view class="name">西西</view>
<view class="big_name">大名:王梓甜</view>
</view>
</view>
<view>
<view class="evaluation">运动评价</view>
</view>
</view>
<view class="line"></view>
</view>
\ No newline at end of file
page{
background: #F7F8FA;
}
.top{
width: 100%;
height: 110rpx;
background: #FFFFFF;
margin-top: 20rpx;
margin-bottom: 20rpx;
padding-left: 30rpx;
padding-right: 30rpx;
}
.top .time{
color: #1A1A1A;
font-size: 26rpx;
font-weight: bold;
}
.top .date{
color: #1A1A1A;
font-size: 26rpx;
}
.top .date .nyr{
margin-right: 10rpx;
}
.icongengduo{
color: #B3B3B3;
font-size: 24rpx;
}
.cont{
width: 100%;
background: #FFFFFF;
}
.cont .item{
width: 750rpx;
height: 194rpx;
background: #FFFFFF;
border-radius: 15rpx;
margin-bottom: 24rpx;
padding: 42rpx 30rpx;
}
.cont .item image{
width: 110rpx;
height: 110rpx;
border-radius: 50%;
margin-right: 30rpx;
}
.cont .item .name{
color: #1A1A1A;
font-size: 32rpx;
margin-bottom: 10rpx;
font-weight: bold;
}
.cont .leave{
width: 136rpx;
height: 48rpx;
border-radius: 24rpx;
background: #F0F0F2;
color: #000000;
font-size: 24rpx;
line-height: 48rpx;
text-align: center;
}
.cont .item .big_name{
color: #808080;
font-size: 26rpx;
}
.evaluation{
width: 136rpx;
height: 48rpx;
border-radius: 24rpx;
border:1px solid #B4BC4D;
color: #B4BC4D;
font-size: 24rpx;
line-height: 48rpx;
text-align: center;
}
.line{
width: 690rpx;
height: 1px;
background: #EBEBEB;
margin: 0 auto;
}
\ No newline at end of file
// pages/index/classManagement/classManagement.js
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
gocourseInstant:function(){
wx.navigateTo({
url: '../../index/courseInstant/courseInstant',
})
},
goevaluation:function(){
wx.navigateTo({
url: '../../index/evaluation/evaluation',
})
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
{
"usingComponents": {},
"navigationBarTitleText": "课程管理"
}
\ No newline at end of file
<view class="top flex-h flex-vc flex-hb">
<view>
<view class="time">15:00~16:00</view>
<view class="time_text">上课时间</view>
</view>
<view>
<view class="instant" catchtap="gocourseInstant">
课程瞬间
<image src="../../../images/camera.png"></image>
</view>
</view>
</view>
<view class="cont">
<view class="item flex-h flex-vc flex-hb">
<view class="flex-h flex-vc">
<image src="../../../images/photo.png"></image>
<view>
<view class="name">西西</view>
<view class="big_name">大名:王梓西</view>
</view>
</view>
<view>
<view class="sign">已签到</view>
<view class="evaluation" catchtap="goevaluation">运动评价</view>
</view>
</view>
<view class="item flex-h flex-vc flex-hb">
<view class="flex-h flex-vc">
<image src="../../../images/photo.png"></image>
<view>
<view class="name">西西</view>
<view class="big_name">大名:王梓甜</view>
</view>
</view>
<view>
<view class="sign">已签到</view>
<view class="evaluation1">已评价</view>
</view>
</view>
<view class="item flex-h flex-vc flex-hb">
<view class="flex-h flex-vc">
<image src="../../../images/photo.png"></image>
<view>
<view class="name">西西</view>
<view class="big_name">大名:王梓甜</view>
</view>
</view>
<view>
<view class="sign1">签到</view>
</view>
</view>
<view class="item flex-h flex-vc flex-hb">
<view class="flex-h flex-vc">
<image src="../../../images/photo.png"></image>
<view>
<view class="name">西西</view>
<view class="big_name">大名:王梓甜</view>
</view>
</view>
<view>
<view class="leave">已请假</view>
</view>
</view>
</view>
<view class="button">
<view class="course">课程完结</view>
</view>
\ No newline at end of file
.top{
width: 100%;
height: 220rpx;
background: #FFC600;
padding-left: 30rpx;
padding-right: 30rpx;
}
.top .time{
color: #000000;
font-size: 28rpx;
margin-bottom: 10rpx;
}
.top .time_text{
color: #846027;
font-size: 24rpx;
}
.instant{
width: 210rpx;
height: 64rpx;
background: #FFFFFF;
border-radius: 32rpx;
color: #000000;
font-size: 28rpx;
line-height: 64rpx;
text-align: center;
}
.top image{
width: 41rpx;
height: 32rpx;
/* margin-top: 32rpx; */
}
.cont{
width: 100%;
padding: 50rpx 30rpx;
}
.cont .item{
width: 690rpx;
height: 194rpx;
background: #FFFFFF;
border-radius: 15rpx;
margin-bottom: 24rpx;
padding: 42rpx 30rpx;
box-shadow: 0 10rpx 20rpx 10rpx rgba(239, 240, 241, 0.72);
}
.cont .item image{
width: 110rpx;
height: 110rpx;
border-radius: 50%;
margin-right: 30rpx;
}
.cont .item .name{
color: #1A1A1A;
font-size: 32rpx;
margin-bottom: 10rpx;
font-weight: bold;
}
.cont .item .sign{
width: 136rpx;
height: 48rpx;
border-radius: 24rpx;
background: #F0F0F2;
color: #B3B3B3;
font-size: 24rpx;
line-height: 48rpx;
text-align: center;
margin-bottom: 14rpx;
}
.cont .item .evaluation{
width: 136rpx;
height: 48rpx;
border-radius: 24rpx;
background: #B4BC4D;
color: #FFFFFF;
font-size: 24rpx;
line-height: 48rpx;
text-align: center;
}
.evaluation1{
width: 136rpx;
height: 48rpx;
border-radius: 24rpx;
background: #F0F0F2;
color: #B3B3B3;
font-size: 24rpx;
line-height: 48rpx;
text-align: center;
margin-bottom: 14rpx;
}
.sign1{
width: 136rpx;
height: 48rpx;
border-radius: 24rpx;
background: #FFC600;
color: #000000;
font-size: 24rpx;
line-height: 48rpx;
text-align: center;
margin-bottom: 14rpx;
}
.leave{
width: 136rpx;
height: 48rpx;
border-radius: 24rpx;
background: #F0F0F2;
color: #000000;
font-size: 24rpx;
line-height: 48rpx;
text-align: center;
}
.cont .item .big_name{
color: #808080;
font-size: 26rpx;
}
.button{
width: 750rpx;
height: 118rpx;
padding: 18rpx 68rpx 20rpx;
position: fixed;
bottom: 0;
}
.button .course{
width: 620rpx;
height: 80rpx;
border:none;
background: linear-gradient(-70deg, #FFC600 0%, #FFD400 100%);
border-radius: 40rpx;
color: #000000;
font-size: 30rpx;
text-align: center;
line-height: 80rpx;
}
\ No newline at end of file
// pages/index/courseInstant/courseInstant.js
Page({
data: {
fileList: [],
},
afterRead(event) {
const { file } = event.detail;
wx.uploadFile({
url: 'https://example.weixin.qq.com/upload',
filePath: file.path,
name: 'file',
formData: { user: 'test' },
success(res) {
const { fileList = [] } = this.data;
fileList.push({ ...file, url: res.data });
this.setData({ fileList });
},
});
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
{
"usingComponents": {
"van-uploader": "../../../components/vant/uploader/index"
},
"navigationBarTitleText": "课程瞬间"
}
\ No newline at end of file
<view class="video">
<view class="head">
<text class="title">拍摄运动工程</text>
<text class="up">(可上传1个视频)</text>
</view>
<van-uploader file-list="{{ fileList }}" bind:after-read="afterRead" />
</view>
<view class="video">
<view class="head">
<text class="title">记录精彩瞬间</text>
<text class="up">(最多可上传9张照片)</text>
</view>
<van-uploader file-list="{{ fileList }}" bind:after-read="afterRead" />
</view>
<view class="button">
<view class="submit">提交</view>
</view>
\ No newline at end of file
page{
background: #F7F8FA;
}
.video{
width: 750rpx;
height: 330rpx;
background: #FFFFFF;
margin-bottom: 24rpx;
padding:35rpx 30rpx;
margin-bottom: 24rpx;
}
.video .head{
margin-bottom: 30rpx;
}
.video .title{
color: #1A1A1A;
font-size: 26rpx;
font-weight: bold;
}
.video .up{
color: #B3B3B3;
font-size: 24rpx;
}
.button{
width: 750rpx;
height: 118rpx;
padding: 18rpx 68rpx 20rpx;
position: fixed;
bottom: 0;
}
.button .submit{
width: 620rpx;
height: 80rpx;
border:none;
background: linear-gradient(-70deg, #FFC600 0%, #FFD400 100%);
border-radius: 40rpx;
color: #000000;
font-size: 30rpx;
text-align: center;
line-height: 80rpx;
}
\ No newline at end of file
// pages/index/evaluation/evaluation.js
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
{
"usingComponents": {},
"navigationBarTitleText": "运动评价"
}
\ No newline at end of file
<!--pages/index/evaluation/evaluation.wxml-->
<text>pages/index/evaluation/evaluation.wxml</text>
/* pages/index/evaluation/evaluation.wxss */
\ No newline at end of file
let Charts = require('../../../utils/wxcharts-min.js');
var app = getApp();
var lineChart = null;
Page({
data: {
windowWidth: '',
windowHeight: '',
awardList: [
{
src:'/images/my/per_pic_02.png'
},
{
src:'/images/my/per_pic_02.png'
},
{
src:'/images/my/per_pic_02.png'
},
{
src:'/images/my/per_pic_02.png'
},
{
src:'/images/my/per_pic_02.png'
}
]
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
this.getRpx()
this.getCharts()
},
getRpx() {
var res = wx.getSystemInfoSync(); //试图获取屏幕宽高数据
this.setData({
windowWidth: res.windowWidth / 750 * 690 ,
windowHeight: res.windowWidth / 750 * 605
})
},
getCharts() {
lineChart = new Charts({
canvasId: 'radarCanvas',
type: 'radar',
categories: ['1', '2', '3', '4', '5', '6'],
series: [{
name: '运动表现',
data: [90, 110, 125, 95, 87, 122]
}],
width: this.data.windowWidth,
height: this.data.windowHeight,
extra: {
radar: {
max: 150
}
}
});
}
})
\ No newline at end of file
{
"usingComponents": {},
"navigationBarTitleText": "运动表现"
}
\ No newline at end of file
<view class="canvasbox">
<view class="title">运动表现</view>
<canvas canvas-id="radarCanvas" disable-scroll="true" class="canvas"></canvas>
</view>
<view class="one">
<view class="title">教练评语</view>
<view class="teacher">
<view class="flex-h flex-vc flex-hb">
<view class="teacher_left flex-v flex-hc">
<image></image>
<text>王教练</text>
</view>
<view class="teacher_right">
孩子对于运动的兴趣非常大!建议孩子多参加户外运动,对孩子视力保护比较好!
</view>
</view>
</view>
<view class="line"></view>
<view class="parents">
<view class="title">家长回复</view>
<view class="flex-h">
<image src="../../../images/photo.png"></image>
<text class="name">家长名字</text>
</view>
<view class="comments">谢谢教练~孩子非常喜欢上运动课,回到家之后也会自己进行练习,进步了很多。</view>
</view>
</view>
<view class="one">
<view class="title">收获徽章</view>
<view class="flex-h flex-hw flex-vc">
<block wx:for='{{awardList}}' wx:key='index'>
<image class="awardone" src="{{item.src}}"></image>
</block>
</view>
</view>
\ No newline at end of file
page {
background: #F7F8FA;
padding: 20rpx 30rpx 60rpx 30rpx;
}
.canvasbox {
width: 100%;
height: 605rpx;
background: #FFFFFF;
border-radius: 15rpx;
margin-bottom: 20rpx;
}
.canvasbox .canvas {
width: 100%;
height: 100%;
}
.one {
padding: 49rpx 28rpx 32rpx 28rpx;
background: #fff;
border-radius: 15rpx;
margin-bottom: 20rpx;
}
.title {
font-size: 26rpx;
font-family: PingFang SC;
font-weight: bold;
color: #1A1A1A;
margin-bottom: 20rpx;
}
/* .teacher {
padding-top: 44rpx;
} */
.line{
width: 634rpx;
height: 1px;
background: #EBEBEB;
margin: 40rpx auto;
}
.teacher_left{
font-size: 24rpx;
font-family: PingFang SC;
font-weight: 500;
color: #1A1A1A;
}
.teacher_left image {
width: 80rpx;
height: 80rpx;
border-radius: 50%;
}
.teacher_right {
padding: 20rpx;
font-size: 24rpx;
font-family: PingFang SC;
font-weight: 500;
color: #1A1A1A;
line-height: 2;
background: #FFF8F2;
border-radius: 10rpx;
position: relative;
margin-left: 24rpx;
}
.teacher_right::before {
position: absolute;
content: '';
width:0;
height:0;
border-top: 25rpx solid transparent;
border-bottom:25rpx solid transparent;
border-right:25rpx solid #FFF8F2;
left: -25rpx;
top: 50%;
margin-top: -25rpx;
}
.parents image{
width: 80rpx;
height: 80rpx;
margin-right: 22rpx;
}
.parents .name{
color: #1A1A1A;
font-size: 24rpx;
line-height: 80rpx;
}
.parents .comments{
width: 629rpx;
color: #1A1A1A;
font-size: 24rpx;
font-family: PingFang SC;
margin-top: 22rpx;
line-height: 40rpx;
}
.awardone {
width: 151rpx;
height: 151rpx;
margin-right: 89rpx;
margin-top: 42rpx;
}
.awardone:nth-child(3n) {
margin-right: 0;
}
// pages/my/teachingArea/teachingArea.js
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
{
"usingComponents": {},
"navigationBarTitleText": "教学区域"
}
\ No newline at end of file
<view class="place flex-h flex-vc">
<image src="../../../images/location.png"></image>
<view>已选城市:石家庄</view>
</view>
<view class="select">选择意向区域</view>
<view class="every flex-h flex-vc flex-hb">
<view>意向区域1</view>
<view>
<text>长安区</text>
<text class="iconfont icongengduo"></text>
</view>
</view>
<view class="line"></view>
<view class="every flex-h flex-vc flex-hb">
<view>意向区域2</view>
<view>
<text>高新区</text>
<text class="iconfont icongengduo"></text>
</view>
</view>
<view class="line"></view>
<view class="every flex-h flex-vc flex-hb">
<view>意向区域3</view>
<view>
<text>裕华区</text>
<text class="iconfont icongengduo"></text>
</view>
</view>
<view class="line"></view>
.place{
width: 100%;
height: 100rpx;
background: #FFFFFF;
border-top: 1px solid #F7F8FA;
padding-left: 30rpx;
color: #000000;
font-size: 28rpx;
}
.place image{
width: 26rpx;
height: 32rpx;
margin-right: 15rpx;
}
.select{
background:#F7F8FA ;
width: 100%;
height: 60rpx;
line-height: 60rpx;
color: #A6A6A6;
font-size: 24rpx;
padding-left: 30rpx;
}
.every{
width: 100%;
height: 110rpx;
color: #000000;
font-size: 30rpx;
padding-left: 30rpx;
padding-right: 30rpx;
}
.every .icongengduo{
color: #B3B3B3;
}
.line{
width: 690rpx;
height: 1px;
background: #EBEBEB;
margin: 0 auto;
}
\ No newline at end of file
......@@ -21,7 +21,12 @@ Page({
activeIndex: index
})
}
},
},
goteamDetail:function(){
wx.navigateTo({
url: '../../team/teamDetail/teamDetail',
})
},
/**
* 生命周期函数--监听页面初次渲染完成
......
......@@ -5,7 +5,7 @@
</view>
<view>
<view class="tabContent" wx:if="{{activeIndex == 1}}">
<view class="tab_item">
<view class="tab_item" catchtap="goteamDetail">
<view class="class-title">篮球班</view>
<view class="text column">
<text>所在区域:裕华区</text>
......@@ -14,7 +14,7 @@
</view>
<view class="goclass">我要上课</view>
</view>
<view class="tab_item">
<view class="tab_item" catchtap="goteamDetail">
<view class="class-title">篮球班</view>
<view class="text column">
<text>所在区域:裕华区</text>
......@@ -23,7 +23,7 @@
</view>
<view class="goclass">我要上课</view>
</view>
<view class="tab_item">
<view class="tab_item" catchtap="goteamDetail">
<view class="class-title">篮球班</view>
<view class="text column">
<text>所在区域:裕华区</text>
......
......@@ -51,8 +51,18 @@ Page({
},
// 日历展开与否
open() {
this.setData({
isOpen: !this.data.isOpen
})
}
this.setData({
isOpen: !this.data.isOpen
})
},
goclassManagement:function(){
wx.navigateTo({
url: '../../index/classManagement/classManagement',
})
},
goclassDetail:function(){
wx.navigateTo({
url: '../../index/classDetail/classDetail',
})
}
})
\ No newline at end of file
......@@ -10,23 +10,23 @@
</view>
</view>
</view>
<view class="cont">
<view class="cont" catchtap="goclassDetail">
<view class="top">
<view class="time_title">篮球课</view>
<view class="state">即将开课</view>
</view>
<view class="time">上课时间:2020-10-21 09:00-10:00 </view>
<view class="place">上课地点:新天际众美幼稚园</view>
<view class="manage">管理</view>
<view class="manage" catchtap="goclassManagement">管理</view>
</view>
<view class="cont">
<view class="cont" catchtap="goclassDetail">
<view class="top">
<view class="time_title">足球课</view>
<view class="inclass">上课中</view>
</view>
<view class="time">上课时间:2020-10-21 09:00-10:00 </view>
<view class="place">上课地点:新天际众美幼稚园</view>
<view class="manage">管理</view>
<view class="manage" catchtap="goclassManagement">管理</view>
</view>
<view class="cont">
<view class="top">
......
......@@ -5,12 +5,13 @@ Page({
* 页面的初始数据
*/
data: {
show:false,
emailShow: false,
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
......@@ -19,6 +20,29 @@ Page({
url: '../../my/parents/parents',
})
},
goteachingArea:function(){
wx.navigateTo({
url: '../../my/teachingArea/teachingArea',
})
},
//教学科目弹窗
tcHold: function (e) {
this.setData({
emailShow: !this.data.emailShow
})
},
goCall: function(e){
wx.showModal({
content: '确定要拨打电话吗?',
success(res) {
if (res.confirm) {
wx.makePhoneCall({
phoneNumber: '400-181-5358'
})
}
}
})
},
/**
* 生命周期函数--监听页面初次渲染完成
......
......@@ -24,14 +24,14 @@
</view>
</view>
<view class="centerNav">
<view class="every flex-h flex-vc flex-hb">
<view class="every flex-h flex-vc flex-hb" catchtap="goteachingArea">
<view class="row title">
<image src="../../../images/personal_icon_05.png"></image>
<view>教学区域</view>
</view>
<text class="iconfont icongengduo"></text>
</view>
<view class="every flex-h flex-vc flex-hb">
<view class="every flex-h flex-vc flex-hb" catchtap="tcHold">
<view class="row title">
<image src="../../../images/personal_icon_02.png"></image>
<view>教学科目</view>
......@@ -41,9 +41,26 @@
<text class="iconfont icongengduo"></text>
</view>
</view>
<van-popup show="{{ emailShow }}" closeable round bind:close="tcHold">
<view class="tc">
<view class="top">
<view class="til">请选择教学科目</view>
<view class="select">(可多选)</view>
</view>
<view class="subject flex-h flex-hw flex-ha">
<view class="active">跳绳</view>
<view>篮球</view>
<view>足球</view>
<view>轮滑</view>
<view>平衡车</view>
<view>跆拳道</view>
</view>
<view class="confirm" catchtap="confirm">确定</view>
</view>
</van-popup>
</view>
<view class="centerNav">
<view class="every flex-h flex-vc flex-hb" catchtap="goList">
<view class="every flex-h flex-vc flex-hb" catchtap="goCall">
<view class="row title">
<image src="../../../images/personal_icon_02.png"></image>
<view>联系客服</view>
......
......@@ -88,4 +88,59 @@ page {
color: #B3B3B3;
font-size: 30rpx;
margin-right: 20rpx;
}
\ No newline at end of file
}
/* 教学科目弹窗样式 */
.tc{
width: 580rpx;
height: 500rpx;
background-color: #FFFFFF;
border-radius: 10rpx;
}
.tc .top{
width: 100%;
height: 232rpx;
color: #333333;
font-size: 28rpx;
text-align: center;
padding-top: 15rpx;
}
.tc .top .til{
color: #03081A;
font-size: 34rpx;
font-weight: bold;
margin-top: 56rpx;
margin-bottom: 22rpx;
}
.tc .top .select{
color: #A6A6A6;
font-size: 24rpx;
}
.tc .subject>view{
width: 156rpx;
height: 56rpx;
background: #FFFFFF;
border: 1px solid #B4BC4D;
border-radius: 28px;
color: #B4BC4D;
text-align: center;
line-height: 56rpx;
margin-bottom: 20rpx;
}
.tc .subject>view.active{
background: linear-gradient(13deg, #AAB247 0%, #B4BC4D 100%);
color: #FFFFFF;
}
.tc .confirm{
width: 345rpx;
height: 68rpx;
background: linear-gradient(-70deg, #FFC600 0%, #FFD400 100%);
border-radius: 34px;
color: #1A1A1A;
font-size: 28rpx;
line-height: 68rpx;
text-align: center;
margin: 30rpx auto 20rpx;
}
// pages/team/teamDetail/teamDetail.js
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
goclassDetail:function(){
wx.navigateTo({
url: '../../index/classDetail/classDetail',
})
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
{
"usingComponents": {},
"navigationBarTitleText": "班级详情"
}
\ No newline at end of file
<view class="top">
<view class="course">
<view class="course_top flex-h flex-vc">
<image src="../../../images/personal_pic_01.jpg"></image>
<view>
<view class="class">足球课</view>
<text class="years">3~6岁</text>
<text>|</text>
<text class="time">4课时</text>
</view>
</view>
<view class="course_bot">
<view class="class_time">上课时间:周三 15:00-16:00</view>
<view class="class_place">上课地点:新天际建华幼儿园</view>
</view>
</view>
</view>
<view class="students">
<text>本班学员</text>
<view class="stu flex-h flex-hw">
<view class="stus column">
<image src="../../../images/photo.png"></image>
<view>西西</view>
</view>
<view class="stus column">
<image src="../../../images/photo.png"></image>
<view>西西</view>
</view>
<view class="stus column">
<image src="../../../images/photo.png"></image>
<view>西西</view>
</view>
<view class="stus column">
<image src="../../../images/photo.png"></image>
<view>西西</view>
</view>
<view class="stus column">
<image src="../../../images/photo.png"></image>
<view>西西</view>
</view>
<view class="stus column">
<image src="../../../images/photo.png"></image>
<view>西西</view>
</view>
<view class="stus column">
<image src="../../../images/photo.png"></image>
<view>西西</view>
</view>
</view>
</view>
<view class="haveclass">
<text class="title">已上课时</text>
<view class="item">
<view class="lesson">第二节课</view>
<view class="date">日期:2020-10-21</view>
<view class="number">
<text>应到:8人</text>
<text>实到:7人</text>
</view>
<view class="btn" catchtap="goclassDetail">课程详情</view>
</view>
<view class="item">
<view class="lesson">第一节课</view>
<view class="date">日期:2020-10-21</view>
<view class="number">
<text>应到:8人</text>
<text>实到:7人</text>
</view>
<view class="btn" catchtap="goclassDetail">课程详情</view>
</view>
</view>
\ No newline at end of file
page{
background: #F7F8FA;
}
.top{
width: 750rpx;
height: 568rpx;
background: #FFFFFF;
padding: 20rpx 30rpx;
margin-bottom: 20rpx;
}
.top .course{
width: 690rpx;
height: 340rpx;
background: #FFFFFF;
border-radius: 15rpx;
box-shadow: 0 10rpx 20rpx 10rpx rgba(239, 240, 241, 0.72);
padding: 35rpx 18rpx;
}
.top .course .course_top{
height: 144rpx;
margin-bottom: 52rpx;
}
.top .course .course_top image{
width: 220rpx;
height: 144rpx;
margin-right: 30rpx;
}
.top .course .course_top .class{
color: #000000;
font-size: 32rpx;
font-weight: bold;
margin-bottom: 20rpx;
}
.top .course .course_top text{
color: #B3B3B3;
font-size: 24rpx;
margin-right: 10rpx;
}
.top .course .course_bot{
color: #1A1A1A;
font-size: 24rpx;
}
.top .course .course_bot .class_time{
margin-bottom: 20rpx;
}
.students{
width: 100%;
background: #FFFFFF;
padding: 40rpx 30rpx;
margin-bottom: 20rpx;
}
.students text{
color: #1A1A1A;
font-size: 26rpx;
font-weight: bold;
margin-bottom: 32rpx;
display: block;
}
.students .stu{
text-align: center;
}
.students .stu .stus{
margin-right: 54rpx;
}
.students .stu image{
width: 80rpx;
height: 80rpx;
margin-bottom: 10rpx;
}
.haveclass{
width: 100%;
background: #FFFFFF;
padding: 40rpx 30rpx;
}
.haveclass .title{
color: #1A1A1A;
font-size: 26rpx;
font-weight: bold;
margin-bottom: 40rpx;
display: block;
}
.haveclass .item{
width: 690rpx;
height: 206rpx;
background: #FFFFFF;
border-radius: 15rpx;
box-shadow: 0 10rpx 20rpx 10rpx rgba(239, 240, 241, 0.72);
padding: 40rpx 20rpx;
margin-bottom: 24rpx;
position: relative;
}
.haveclass .item .lesson{
color: #000000;
font-size: 30rpx;
margin-bottom: 33rpx;
font-weight: bold;
}
.haveclass .item .date{
color: #999999;
font-size: 24rpx;
margin-bottom: 12rpx;
}
.haveclass .item .number{
color: #999999;
font-size: 24rpx;
}
.haveclass .item .number text{
margin-right: 10rpx;
}
.haveclass .item .btn{
width: 136rpx;
height: 48rpx;
background: #B4BC4D;
color: #FFFFFF;
font-size: 24rpx;
text-align: center;
line-height: 48rpx;
border-radius: 24rpx;
position: absolute;
bottom: 40rpx;
right: 20rpx;
}
\ No newline at end of file
......@@ -5,23 +5,30 @@
},
"setting": {
"urlCheck": true,
"scopeDataCheck": false,
"coverView": true,
"es6": true,
"enhance": false,
"postcss": true,
"compileHotReLoad": false,
"preloadBackgroundData": false,
"minified": true,
"autoAudits": false,
"newFeature": false,
"coverView": true,
"nodeModules": false,
"autoAudits": false,
"showShadowRootInWxmlPanel": true,
"scopeDataCheck": false,
"uglifyFileName": false,
"checkInvalidKey": true,
"checkSiteMap": true,
"uploadWithSourceMap": true,
"compileHotReLoad": false,
"babelSetting": {
"ignore": [],
"disablePlugins": [],
"outputPath": ""
},
"useIsolateContext": true,
"nodeModules": false,
"enhance": false,
"useCompilerModule": false,
"userConfirmedUseCompilerModuleSwitch": false,
"showShadowRootInWxmlPanel": true
"userConfirmedUseCompilerModuleSwitch": false
},
"compileType": "miniprogram",
"libVersion": "2.14.0",
......@@ -78,6 +85,55 @@
"pathName": "pages/my/parents/parents",
"query": "",
"scene": null
},
{
"id": -1,
"name": "pages/tabbar/personal/personal",
"pathName": "pages/tabbar/personal/personal",
"query": "",
"scene": null
},
{
"id": -1,
"name": "pages/my/teachingArea/teachingArea",
"pathName": "pages/my/teachingArea/teachingArea",
"query": "",
"scene": null
},
{
"id": -1,
"name": "pages/index/classManagement/classManagement",
"pathName": "pages/index/classManagement/classManagement",
"query": "",
"scene": null
},
{
"id": -1,
"name": "pages/index/courseInstant/courseInstant",
"pathName": "pages/index/courseInstant/courseInstant",
"query": "",
"scene": null
},
{
"id": 7,
"name": "pages/index/classDetail/classDetail",
"pathName": "pages/index/classDetail/classDetail",
"query": "",
"scene": null
},
{
"id": -1,
"name": "pages/team/teamDetail/teamDetail",
"pathName": "pages/team/teamDetail/teamDetail",
"query": "",
"scene": null
},
{
"id": -1,
"name": "pages/index/performance/performance",
"pathName": "pages/index/performance/performance",
"query": "",
"scene": null
}
]
}
......
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment