Skip to content

T
thinkApp
Commit 696bbd93 authored by 黄奎's avatar 黄奎
Browse files
Options

页面修改

parent 7caa1d8c
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 438 additions and 367 deletions
src/components/index/JobComponents.vue
View file @ 696bbd93
This diff is collapsed.
src/components/index/commentsComponents.vue
View file @ 696bbd93
<template> <template>
<view class="CommentsComponents-box"> <view class="CommentsComponents-box">
<view class="CommentsComponents activeOne flex"> <view class="CommentsComponents activeOne flex">
<view class="CommentsComponents-time-box flex">
<view class="CommentsComponents-time-box flex"> <view class="CommentsComponents-time">
<view class="CommentsComponents-time"> <view>{{jobData.CreateTime}}</view>
<view>05/25 17:13</view> </view>
</view> <view class="CommentsComponents-line">
<view class="CommentsComponents-line"> <view class="CommentsComponents-point"></view>
<view class="CommentsComponents-point"></view> </view>
</view> </view>
</view> <view class="CommentsComponents-center-box">
<view class="CommentsComponents-center-box"> <view class="CommentsComponents-center-line"></view>
<view class="CommentsComponents-center-line"></view> <view class="CommentsComponents-center flex">
<view class="CommentsComponents-center flex"> <view class="CommentsComponents-left flex">
<view class="CommentsComponents-left flex"> <van-image width="38rpx" height="38rpx" fit="cover" class="operation-img" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1653464014000_713.png" />
<van-image width="38rpx" height="38rpx" fit="cover" class="operation-img" <view class="operation-name">{{jobData.Title}}</view>
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1653464014000_713.png"/> </view>
<view class="operation-name">周老师的评语</view> <view class="CommentsComponents-right">
</view> {{jobData.DataObj.Comment}}
<view class="CommentsComponents-right"> </view>
你是个做事小心翼翼，感情细腻丰富的女孩 </view>
，每次看你认真的样子老师都很感动。你也是幸运的，周 </view>
边有很多人都在关爱着你，所以，对他们，尤其是父母，记得不要 </view>
太莽撞，不要太任性，要学着体谅，学着换位思考
，学着懂事。另外，今后要多运动、多锻炼，有健康才能成就美好未来！
</view>
</view>
</view>
</view>
</view> </view>
</template> </template>
<script> <script>
...@@ -40,12 +34,9 @@ ...@@ -40,12 +34,9 @@
} from "vue"; } from "vue";
export default { export default {
props: { props: ["jobData"],
},
components: {}, components: {},
setup() { setup() {
let data = reactive({ let data = reactive({
obj: { obj: {
Name: '', Name: '',
...@@ -61,95 +52,111 @@ ...@@ -61,95 +52,111 @@
}; };
</script> </script>
<style scoped> <style scoped>
.CommentsComponents-right{ .CommentsComponents-right {
color: #FFFFFF; color: #FFFFFF;
font-size: 20rpx; font-size: 20rpx;
line-height: 35rpx; line-height: 35rpx;
letter-spacing: 1rpx; letter-spacing: 1rpx;
} }
.CommentsComponents.activeThree .operation-name{
color: #282828; .CommentsComponents.activeThree .operation-name {
} color: #282828;
.CommentsComponents.activeTwo .operation-name{ }
color: #282828;
} .CommentsComponents.activeTwo .operation-name {
.CommentsComponents.activeOne .operation-name{ color: #282828;
color: #FFFFFF; }
}
.operation-name{ .CommentsComponents.activeOne .operation-name {
font-size: 26rpx; color: #FFFFFF;
letter-spacing: 1px; }
font-weight: 500;
flex-grow: 1; .operation-name {
} font-size: 26rpx;
.operation-img{ letter-spacing: 1px;
margin-right: 12rpx; font-weight: 500;
border-radius: 50%; flex-grow: 1;
flex-shrink: 0; }
}
.CommentsComponents-left{ .operation-img {
flex: 1; margin-right: 12rpx;
flex-grow: 1; border-radius: 50%;
margin-top: -5rpx; flex-shrink: 0;
margin-bottom: 10rpx; }
}
.CommentsComponents-center{ .CommentsComponents-left {
flex-direction: column; flex: 1;
} flex-grow: 1;
.CommentsComponents-center-line{ margin-top: -5rpx;
width: 4rpx; margin-bottom: 10rpx;
height: 23rpx; }
background: #FEFEFE;
position: absolute; .CommentsComponents-center {
left: 0; flex-direction: column;
top: 33rpx; }
}
.CommentsComponents.activeOne .CommentsComponents-center-box{ .CommentsComponents-center-line {
background: #52C1CA; width: 4rpx;
} height: 23rpx;
.CommentsComponents-center-box{ background: #FEFEFE;
flex-grow: 1; position: absolute;
position: relative; left: 0;
border-radius: 30rpx; top: 33rpx;
padding: 31rpx 18rpx 21rpx 24rpx; }
margin-bottom: 50rpx;
} .CommentsComponents.activeOne .CommentsComponents-center-box {
.CommentsComponents.activeOne .CommentsComponents-point{ background: #52C1CA;
background: #1E7BF5; }
box-shadow: 0px 0px 12px 0px rgba(30, 123, 245, 0.46);
} .CommentsComponents-center-box {
.CommentsComponents-point{ flex-grow: 1;
width: 19rpx; position: relative;
height: 19rpx; border-radius: 30rpx;
position: absolute; padding: 31rpx 18rpx 21rpx 24rpx;
top: 20rpx; margin-bottom: 50rpx;
left: -13rpx; }
border-radius: 50%;
border: 3px solid #FFFFFF; .CommentsComponents.activeOne .CommentsComponents-point {
box-shadow: 0px 0px 12px 0px rgba(255, 255, 255, 0.46); background: #1E7BF5;
} box-shadow: 0px 0px 12px 0px rgba(30, 123, 245, 0.46);
.CommentsComponents-line{ }
width: 4rpx;
height: 100%; .CommentsComponents-point {
background: #F1F1F1; width: 19rpx;
margin-left: 46rpx; height: 19rpx;
margin-right: 46rpx; position: absolute;
position: relative; top: 20rpx;
} left: -13rpx;
.CommentsComponents-time{ border-radius: 50%;
width: 61rpx; border: 3px solid #FFFFFF;
height: 55rpx; box-shadow: 0px 0px 12px 0px rgba(255, 255, 255, 0.46);
color: #CCC8C6; }
font-size: 20rpx;
border-radius: 20rpx; .CommentsComponents-line {
padding: 14rpx 13rpx; width: 4rpx;
background: #F6F6F6; height: 100%;
} background: #F1F1F1;
.CommentsComponents{ margin-left: 46rpx;
justify-content: space-between; margin-right: 46rpx;
padding: 0 50rpx; position: relative;
} }
.CommentsComponents-box{
background: #FFFFFF; .CommentsComponents-time {
} width: 61rpx;
height: 55rpx;
color: #CCC8C6;
font-size: 20rpx;
border-radius: 20rpx;
padding: 14rpx 13rpx;
background: #F6F6F6;
}
.CommentsComponents {
justify-content: space-between;
padding: 0 50rpx;
}
.CommentsComponents-box {
background: #FFFFFF;
}
</style> </style>
src/components/index/course-card.vue
View file @ 696bbd93
...@@ -49,7 +49,7 @@ ...@@ -49,7 +49,7 @@
上课进度 {{item.CompleteNum}}/{{item.TotalClassNum}} 上课进度 {{item.CompleteNum}}/{{item.TotalClassNum}}
</view> </view>
<view style="text-align: right;"> <view style="text-align: right;">
<van-button @click="hideExchangeBoxHandler" color="#C91727" round size="mini" custom-style="color:#FFF;font-size: 24rpx;padding-left:16rpx;padding-right:10px;"> <van-button @click="hideExchangeBoxHandler(item)" color="#C91727" round size="mini" custom-style="color:#FFF;font-size: 24rpx;padding-left:16rpx;padding-right:10px;">
选择课程 选择课程
</van-button> </van-button>
</view> </view>
...@@ -80,13 +80,15 @@ ...@@ -80,13 +80,15 @@
setup(props, context) { setup(props, context) {
let data = reactive({ let data = reactive({
statusBarHeight: 24, statusBarHeight: 24,
showItems: false showItems: false,
}); });
let methods = { let methods = {
exchangeItemHandler() { exchangeItemHandler() {
data.showItems = true data.showItems = true
}, },
hideExchangeBoxHandler() { hideExchangeBoxHandler(item) {
this.$parent.getStuHomeWorkAndExam(item.courseId);
data.showItems = false data.showItems = false
} }
} }
......
src/pages/index/index.vue
View file @ 696bbd93
...@@ -3,12 +3,11 @@ ...@@ -3,12 +3,11 @@
<navbar class="navbarSticky" bg="#F6F6F6"> <navbar class="navbarSticky" bg="#F6F6F6">
<view class="index-header-box"> <view class="index-header-box">
<view class="index-header-img"> <view class="index-header-img">
<van-image width="100%" height="100%" fit="cover" class="img" <van-image width="100%" height="100%" fit="cover" class="img" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1653464014000_713.png" />
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1653464014000_713.png" />
</view> </view>
<view class="index-header-tetx"> <view class="index-header-tetx">
<view class="index-header-title"> <view class="index-header-title">
welcome welcome
</view> </view>
<view class="index-header-name">{{userData.AccountName}}</view> <view class="index-header-name">{{userData.AccountName}}</view>
</view> </view>
...@@ -23,12 +22,15 @@ ...@@ -23,12 +22,15 @@
<course-card :stuCourseList="stuCourseList"></course-card> <course-card :stuCourseList="stuCourseList"></course-card>
<view class="index-student-title flex"> <view class="index-student-title flex">
<text>考情详情</text> <text>考情详情</text>
<view>(共53条)</view> <view>(共{{workList!=null&&workList.length>0?workList.length:0}}条)</view>
</view> </view>
<view class="index-student-information"> <view class="index-student-information">
<JobComponents></JobComponents> <template v-for="(item,index) in workList">
<examComponents></examComponents> <JobComponents v-if="item.ResultType==1" :jobData="item"></JobComponents>
<commentsComponents></commentsComponents> <examComponents v-if="item.ResultType==2">></examComponents>
<commentsComponents v-if="item.ResultType==3" :jobData="item"></commentsComponents>
</template>
</view> </view>
</view> </view>
</template> </template>
...@@ -51,9 +53,9 @@ ...@@ -51,9 +53,9 @@
nextTick, nextTick,
} from "vue"; } from "vue";
import { import {
getSweepCode getSweepCode
} from '../../api/index.js' } from '../../api/index.js'
import { import {
getImageColor getImageColor
} from '../../utils/index.js' } from '../../utils/index.js'
...@@ -75,8 +77,13 @@ ...@@ -75,8 +77,13 @@
proxy proxy
} = getCurrentInstance(); } = getCurrentInstance();
let data = reactive({ let data = reactive({
stuCourseList: [],//学员课程列表 stuCourseList: [], //学员课程列表
userData: {},//用户信息 userData: {}, //用户信息
//学员作业和考试查询参数
workMsg: {
courseId: 0,
},
workList: [],//学员作业、考试、评语数据
}); });
let methods = { let methods = {
...@@ -90,7 +97,7 @@ ...@@ -90,7 +97,7 @@
url: '/pages/timetable/timeTable', url: '/pages/timetable/timeTable',
}) })
}, },
base64_decode(data) { base64_decode(data) {
var b64 = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/="; var b64 = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
var o1, var o1,
...@@ -130,11 +137,24 @@ ...@@ -130,11 +137,24 @@
return dec; return dec;
}, },
//获取学员课程列表 //获取学员课程列表
getStuCourse() { getStuCourse() {
proxy.$request("/Stu/GetStuCourse", {}).then(res => { proxy.$request("/Stu/GetStuCourse", {}).then(res => {
data.stuCourseList = res.Data; let tempArray = res.Data;
//console.log("data.stuCourseList",this.stuCourseList) data.stuCourseList = tempArray;
if (tempArray && tempArray.length > 0) {
this.getStuHomeWorkAndExam(tempArray[0].courseId)
}
})
},
//获取学员作业、考试、评语
getStuHomeWorkAndExam(courseId) {
console.log("courseId", courseId)
this.workMsg.courseId = courseId;
data.workList = [];
proxy.$request("/Stu/GetStuWork", this.workMsg).then(res => {
console.log("res.Data", res.Data)
data.workList = res.Data;
}) })
}, },
async getColor(src, index, y) { async getColor(src, index, y) {
...@@ -179,35 +199,41 @@ ...@@ -179,35 +199,41 @@
</script> </script>
<style scoped> <style scoped>
.index-student-title view{ .index-student-title view {
font-size: 25rpx; font-size: 25rpx;
color: #ABABAB; color: #ABABAB;
margin-left: 20rpx; margin-left: 20rpx;
padding: 13rpx 0 0 0; padding: 13rpx 0 0 0;
} }
.index-student-title text{
.index-student-title text {
font-size: 36rpx; font-size: 36rpx;
font-weight: 800; font-weight: 800;
color: #282828; color: #282828;
} }
.index-student-title{
.index-student-title {
padding: 0 50rpx 45rpx; padding: 0 50rpx 45rpx;
} }
.index-student-information{
.index-student-information {
min-height: 500rpx; min-height: 500rpx;
background: rgba(255,255,255,.7); background: rgba(255, 255, 255, .7);
border-radius: 50rpx 50rpx 0 0; border-radius: 50rpx 50rpx 0 0;
padding: 71rpx 0 0 0; padding: 71rpx 0 0 0;
} }
.index-header-name{
.index-header-name {
font-size: 30rpx; font-size: 30rpx;
color: #474747; color: #474747;
} }
.index-header-tetx{
.index-header-tetx {
color: #D0D0D0; color: #D0D0D0;
font-size: 24rpx; font-size: 24rpx;
} }
.index-header-img .img{
.index-header-img .img {
display: block; display: block;
border: 2rpx solid rgba(164, 164, 164, 0.32); border: 2rpx solid rgba(164, 164, 164, 0.32);
border-radius: 50%; border-radius: 50%;
...@@ -217,7 +243,8 @@ ...@@ -217,7 +243,8 @@
box-sizing: border-box; box-sizing: border-box;
margin: 4rpx; margin: 4rpx;
} }
.index-header-img{
.index-header-img {
width: 68rpx; width: 68rpx;
height: 68rpx; height: 68rpx;
border-radius: 50%; border-radius: 50%;
...@@ -226,6 +253,7 @@ ...@@ -226,6 +253,7 @@
margin-right: 20rpx; margin-right: 20rpx;
background: #FFFFFF; background: #FFFFFF;
} }
.indexpage { .indexpage {
min-height: 100vh; min-height: 100vh;
background-color: #f6f6f6; background-color: #f6f6f6;
...@@ -235,26 +263,29 @@ ...@@ -235,26 +263,29 @@
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 100% auto; background-size: 100% auto;
} }
.index-header-box{
.index-header-box {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
padding:0rpx 42rpx ; padding: 0rpx 42rpx;
} }
.index-header-box .index-header-title{
.index-header-box .index-header-title {
font-size: 24rpx; font-size: 24rpx;
font-weight: 400; font-weight: 400;
color: #B8B8B8; color: #B8B8B8;
} }
.index-header-box .index-header-name{
.index-header-box .index-header-name {
font-size: 30rpx; font-size: 30rpx;
font-weight: 800; font-weight: 800;
color: #282828; color: #282828;
} }
.navbarSticky { .navbarSticky {
display: sticky; display: sticky;
top: 0; top: 0;
z-index: 9; z-index: 9;
} }
</style> </style>
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