Commit 4c4778f1 authored by 黄奎's avatar 黄奎

页面修改

parent 8bc49d23
...@@ -55,7 +55,8 @@ ...@@ -55,7 +55,8 @@
toRefs, toRefs,
onMounted, onMounted,
getCurrentInstance, getCurrentInstance,
inject inject,
watch
} from "vue"; } from "vue";
export default { export default {
...@@ -64,7 +65,6 @@ ...@@ -64,7 +65,6 @@
}, },
components: {}, components: {},
setup(props) { setup(props) {
let data = reactive({ let data = reactive({
dataList: props.dataList dataList: props.dataList
}); });
......
<template> <template>
<view class="setComments-box"> <view class="setComments-box">
<view class="setComments-add"><van-icon name="plus" /><text>创建评价</text> </view> <view class="setComments-add">
<view class="index-student-information"> <van-icon name="plus" /><text>创建评价</text> </view>
<view class="setComments-content-box"> <view class="index-student-information">
<view class="setComments-content"> <view class="setComments-content-box">
<view class="center-line"></view> <template v-for="(item,index) in dataList">
<view class="setComments-title flex"> <view class="setComments-content">
<text class="setComments-title-left">第一次评价</text> <view class="center-line"></view>
<view class="setComments-title-right"> <view class="setComments-title flex">
<view class="setComments-options flex"> <text class="setComments-title-left">{{item.Times}}次评价</text>
<view class="setComments-options-title flex" @click="clickOptionsShow"> <view class="setComments-title-right">
<view class="point"></view> <view class="setComments-options flex">
<text>{{optionsObj.text?optionsObj.text:'选择'}}</text> <view class="setComments-options-title flex" @click="clickOptionsShow(item)">
<van-icon :name="optionsShow?'arrow-down':'arrow'" /> <view class="point"></view>
</view> <text>{{item.ShowTypeStr}}</text>
<view v-if="optionsShow" class="setComments-options-text flex"> <van-icon :name="item.optionsShow?'arrow-down':'arrow'" />
<text </view>
v-for="(item,index) in optionsList" <view v-if="item.optionsShow" class="setComments-options-text flex">
:key="index" <text v-for="(subItem,index) in optionsList" :key="index" @click="clickoptions(item,subItem)">
@click="clickoptions(item)"> {{subItem.text}}
{{item.text}} </text>
</text> </view>
</view> </view>
</view> </view>
</view> </view>
</view> <view class="setComments-source flex">
<view class="setComments-source flex"> <text>来源:{{item.CreateTypeStr}}</text>
<text>来源: 5555</text> <view>时间:{{item.CreateTime}}</view>
<view>时间:2022-05-30</view> </view>
</view> </view>
<view class="setComments-Evaluation"> </template>
<view>
<text>学员评价</text> </view>
<text>评价规则</text> </view>
</view>
</view>
</view>
</view>
</view>
</view> </view>
</template> </template>
<script> <script>
...@@ -46,198 +41,229 @@ ...@@ -46,198 +41,229 @@
toRefs, toRefs,
onMounted, onMounted,
getCurrentInstance, getCurrentInstance,
inject inject,
watch
} from "vue"; } from "vue";
import navbar from '../../components/navbar.vue' import navbar from '../../components/navbar.vue'
export default { export default {
props: { props: ["CourseCommentTimesList"],
emits: ['refreshData'],
},
components: { components: {
navbar, navbar,
}, },
setup() { setup(props, context) {
let { let {
proxy proxy
} = getCurrentInstance(); } = getCurrentInstance();
let data = reactive({ let data = reactive({
optionsObj:{ optionsList: [{
text:'', text: '可见',
value:'' value: 1
}, },
optionsShow:false, {
optionsList:[ text: '部分可见',
{ text: '部分可见', value: 0 }, value: 2
{ text: '可见', value: 1 }, },
{ text: '不可见', value: 2 }, {
], text: '不可见',
radioList:[ value: 3
{name:'使用默认配置',id:1,checked:true}, },
{name:'自定义评价',id:2} ],
], dataList: [],
checked:'1',
obj:{},
Msg: {
HomeWorkId: '',
},
showPhone: false,
showLogin: true, //多次点击
HomeWorkId:'',
jobDetails: {},
dataList:[],
pageState:'more'
}); });
let methods = { let methods = {
back(){ back() {
uni.navigateBack({ uni.navigateBack({
delta: 1 delta: 1
}) })
}, },
clickOptionsShow(){ clickOptionsShow(item) {
data.optionsShow=!data.optionsShow item.optionsShow = !item.optionsShow;
}, },
clickoptions(item){ clickoptions(item,subItem) {
data.optionsObj = item
data.optionsShow = false let showTypeMsg = {
} CourseId: item.CourseId,
} Times: item.Times,
ShowType: subItem.value
};
proxy.$request("/Teacher/SetStuCommentShowTypeByTimes", showTypeMsg).then(res => {
if (res) {
}
})
item.optionsShow = false;
//调用父组件方法
context.emit('refreshData');
}
};
//监听属性数组
watch(() => props["CourseCommentTimesList"], (newValue, oldValue) => {
if (newValue != oldValue && newValue && newValue.length > 0) {
data.dataList = newValue;
}
}, {
deep: true,
});
return { return {
...toRefs(data), ...toRefs(data),
...methods ...methods
}; };
}, },
onLoad(option) { onLoad(option) {
this.Msg.HomeWorkId = option.HomeWorkId
},
},
}; };
</script> </script>
<style scoped> <style scoped>
.setComments-Evaluation view text:first-child{ .setComments-Evaluation view text:first-child {
border-right: 1px solid #E5E5E5; border-right: 1px solid #E5E5E5;
padding: 0 16rpx 0 0; padding: 0 16rpx 0 0;
} }
.setComments-Evaluation view text:last-child{
margin-left: 16rpx; .setComments-Evaluation view text:last-child {
} margin-left: 16rpx;
.setComments-Evaluation view text{ }
display: inline-block;
letter-spacing: 1rpx; .setComments-Evaluation view text {
} display: inline-block;
.setComments-Evaluation view{ letter-spacing: 1rpx;
float: right; }
margin-top: 25rpx;
margin-bottom: 27rpx; .setComments-Evaluation view {
font-size: 24rpx; float: right;
font-weight: 500; margin-top: 25rpx;
color: #CE8086; margin-bottom: 27rpx;
} font-size: 24rpx;
.setComments-Evaluation{ font-weight: 500;
height: 85rpx; color: #CE8086;
border-top: 1rpx solid #E5E5E5; }
}
.setComments-source{ .setComments-Evaluation {
font-size: 20rpx; height: 85rpx;
color: #C2BCBA; border-top: 1rpx solid #E5E5E5;
font-weight: 500; }
justify-content: space-between;
padding: 26rpx 0 25rpx 0; .setComments-source {
} font-size: 20rpx;
.point{ color: #C2BCBA;
width: 8rpx; font-weight: 500;
height: 8rpx; justify-content: space-between;
background: #E64150; padding: 26rpx 0 25rpx 0;
border-radius: 50%; }
}
.setComments-options-title,.setComments-options-text{ .point {
font-size: 24rpx; width: 8rpx;
font-weight: 500; height: 8rpx;
color: #CE8086; background: #E64150;
text-align: center; border-radius: 50%;
font-weight: bold; }
}
.setComments-options-text text{ .setComments-options-title,
padding: 5rpx 0; .setComments-options-text {
} font-size: 24rpx;
.setComments-options-text{ font-weight: 500;
flex-direction: column; color: #CE8086;
margin-top: 10rpx; text-align: center;
position: absolute; font-weight: bold;
left: 0; }
right: 0;
top: 35rpx; .setComments-options-text text {
background: #FCEEEF; padding: 5rpx 0;
padding: 20rpx 0 20rpx 0; }
border-radius: 0 0 25rpx 25rpx;
} .setComments-options-text {
.setComments-options-title text{ flex-direction: column;
margin-right: 10rpx; margin-top: 10rpx;
margin-left: 10rpx; position: absolute;
} left: 0;
.setComments-options-title{ right: 0;
justify-content: center; top: 35rpx;
align-items: center; background: #FCEEEF;
} padding: 20rpx 0 20rpx 0;
.setComments-options{ border-radius: 0 0 25rpx 25rpx;
flex-grow: 1; }
border-radius: 25rpx;
background: #FCEEEF; .setComments-options-title text {
flex-direction: column; margin-right: 10rpx;
padding: 14rpx 17rpx 15rpx 17rpx; margin-left: 10rpx;
letter-spacing: 1rpx; }
position: relative;
} .setComments-options-title {
.setComments-title-right{ justify-content: center;
width: 190rpx; align-items: center;
flex-shrink: 0; }
}
.setComments-title-left{ .setComments-options {
letter-spacing: 1rpx; flex-grow: 1;
flex-grow: 1; border-radius: 25rpx;
color: #282828; background: #FCEEEF;
font-size: 26rpx; flex-direction: column;
font-weight: bold; padding: 14rpx 17rpx 15rpx 17rpx;
margin-right: 20rpx; letter-spacing: 1rpx;
} position: relative;
.center-line{ }
position: absolute;
left: 0; .setComments-title-right {
top: 30rpx; width: 190rpx;
width: 4rpx; flex-shrink: 0;
height: 23rpx; }
background: #282828;
} .setComments-title-left {
.setComments-content{ letter-spacing: 1rpx;
position: relative; flex-grow: 1;
background: #FFFFFF; color: #282828;
padding: 21rpx 27rpx 0 22rpx; font-size: 26rpx;
box-shadow: 0px 6px 29px 0px rgba(76, 76, 76, 0.09); font-weight: bold;
border-radius: 30px; margin-right: 20rpx;
} }
.setComments-content-box{
padding: 0 50rpx; .center-line {
} position: absolute;
.setComments-add van-icon{ left: 0;
font-size: 25rpx; top: 30rpx;
margin-right: 20rpx; width: 4rpx;
} height: 23rpx;
.setComments-add{ background: #282828;
width: 190rpx; }
margin: auto;
border-radius: 27rpx; .setComments-content {
border: 1rpx solid #FB6087; position: relative;
color: #FB6087; background: #FFFFFF;
font-size: 24rpx; padding: 21rpx 27rpx 0 22rpx;
letter-spacing: 1rpx; box-shadow: 0px 6px 29px 0px rgba(76, 76, 76, 0.09);
padding: 10rpx 0; border-radius: 30px;
margin-bottom: 47rpx; }
text-align: center;
} .setComments-content-box {
.index-student-information{ padding: 0 50rpx;
min-height: 800rpx; }
.setComments-add van-icon {
font-size: 25rpx;
margin-right: 20rpx;
}
.setComments-add {
width: 190rpx;
margin: auto;
border-radius: 27rpx;
border: 1rpx solid #FB6087;
color: #FB6087;
font-size: 24rpx;
letter-spacing: 1rpx;
padding: 10rpx 0;
margin-bottom: 47rpx;
text-align: center;
}
.index-student-information {
min-height: 800rpx;
background: #FFFFFF; background: #FFFFFF;
border-radius: 50rpx 50rpx 0 0; border-radius: 50rpx 50rpx 0 0;
padding: 71rpx 0 30rpx 0; padding: 71rpx 0 30rpx 0;
flex-direction: column; flex-direction: column;
} }
</style> </style>
...@@ -43,7 +43,7 @@ ...@@ -43,7 +43,7 @@
> >
<operation v-if="tabNme=='作业情况'" :dataList="homeWorks"></operation> <operation v-if="tabNme=='作业情况'" :dataList="homeWorks"></operation>
<studentList @selected="selectStuHandler" v-if="tabNme=='学生列表'" :dataList="students"></studentList> <studentList @selected="selectStuHandler" v-if="tabNme=='学生列表'" :dataList="students"></studentList>
<examList v-if="tabNme=='考试信息'" :dataList="exams" :CourseId="currentCourseId"></examList> <examList v-if="tabNme=='考试信息'" :dataList="exams"></examList>
</scroll-view> </scroll-view>
<Loadmore :state="pageState" /> <Loadmore :state="pageState" />
</view> </view>
...@@ -113,7 +113,7 @@ ...@@ -113,7 +113,7 @@
homeWorks:[], homeWorks:[],
exams:[], exams:[],
pageState: "more", pageState: "more",
currentCourseId:0, currentCourseId:189666293,
userData:{}, userData:{},
loading:false loading:false
}); });
...@@ -138,9 +138,9 @@ ...@@ -138,9 +138,9 @@
}, },
changeCourseHandler(id){ changeCourseHandler(id){
console.log(id,'........................') console.log(id,'........................')
data.Msg.CourseId=id data.Msg.courseId=189666293
data.OperationMsg.courseId=id data.OperationMsg.courseId=189666293
data.currentCourseId=id data.currentCourseId=189666293
methods.getCourseStuList() methods.getCourseStuList()
methods.getExamPageList() methods.getExamPageList()
methods.getCourseHomeWorkList() methods.getCourseHomeWorkList()
......
...@@ -2,38 +2,36 @@ ...@@ -2,38 +2,36 @@
<view class="setComments-index-box"> <view class="setComments-index-box">
<navbar class="navbarSticky" bg="#F6F6F6"> <navbar class="navbarSticky" bg="#F6F6F6">
<view class="setComments-index-header-box flex"> <view class="setComments-index-header-box flex">
<van-icon class="setComments-index-header-left" name="arrow-left" @click="back"/> <van-icon class="setComments-index-header-left" name="arrow-left" @click="back" />
<text class="setComments-index-header-title">设置评语</text> <text class="setComments-index-header-title">设置评语</text>
</view> </view>
</navbar> </navbar>
<view class="setComments-index-content"> <view class="setComments-index-content">
<view class="setComments-index-setType flex"> <view class="setComments-index-setType flex">
<view class="setComments-setType-left flex"> <view class="setComments-setType-left flex">
<view> <view>
<van-image class="img" width="29rpx" height="29rpx" fit="cover" <van-image class="img" width="29rpx" height="29rpx" fit="cover" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1653977710000_475.png" />
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1653977710000_475.png" /> </view>
</view> <view class="setComments-setType-text flex">
<view class="setComments-setType-text flex"> <text>自定义评价</text>
<text>自定义评价</text> <view>从自动评价规则进入修改</view>
<view>从自动评价规则进入修改</view> </view>
</view>
</view>
</view> <view class="setComments-setType-right flex">
<view class="setComments-setType-right flex"> <view>
<view> <text>自动评价规则</text>
<text>自动评价规则</text> <van-image class="img" width="14rpx" height="13rpx" fit="cover" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1653977684000_601.png" />
<van-image class="img" width="14rpx" height="13rpx" fit="cover" </view>
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1653977684000_601.png" />
</view> </view>
</view>
</view> <setComments :CourseCommentTimesList="courseTimeList" @refreshData="getCourseCommentTimes"></setComments>
</view> </view>
<setComments></setComments>
</view>
</view> </view>
</template> </template>
<script> <script>
import setComments from '@/components/setComments/setComments' import setComments from '@/components/setComments/setComments'
import { import {
reactive, reactive,
toRefs, toRefs,
...@@ -44,122 +42,150 @@ ...@@ -44,122 +42,150 @@
import navbar from '../../components/navbar.vue' import navbar from '../../components/navbar.vue'
export default { export default {
props: { props: {
}, },
components: { components: {
navbar, navbar,
setComments setComments
}, },
setup() { setup() {
let { let {
proxy proxy
} = getCurrentInstance(); } = getCurrentInstance();
let data = reactive({ let data = reactive({
value:1, value: 1,
optionsList:[ optionsList: [{
{ text: '部分可见', value: 0 }, text: '部分可见',
{ text: '可见不可见', value: 1 }, value: 0
{ text: '活动商品', value: 2 }, },
], {
radioList:[ text: '可见不可见',
{name:'使用默认配置',id:1,checked:true}, value: 1
{name:'自定义评价',id:2} },
], {
checked:'1', text: '活动商品',
obj:{}, value: 2
},
],
radioList: [{
name: '使用默认配置',
id: 1,
checked: true
},
{
name: '自定义评价',
id: 2
}
],
checked: '1',
Msg: { Msg: {
HomeWorkId: '', CourseId: '',
}, },
showPhone: false, courseTimeList: [], //课程自动生成评论次数
showLogin: true, //多次点击
HomeWorkId:'',
jobDetails: {},
dataList:[],
pageState:'more'
}); });
let methods = { let methods = {
back(){ back() {
uni.navigateBack({ uni.navigateBack({
delta: 1 delta: 1
}) })
}, },
radioChange (e){ radioChange(e) {
console.log("打印国家名称",e.target.value) console.log("打印国家名称", e.target.value)
} },
} //获取课程评论次数列表
getCourseCommentTimes() {
proxy.$request("/Teacher/GetCourseCommentTimes", data.Msg).then(res => {
if (res) {
data.courseTimeList = res.Data;
}
})
}
}
return { return {
...toRefs(data), ...toRefs(data),
...methods ...methods
}; };
}, },
onLoad(option) { onLoad(option) {
this.Msg.HomeWorkId = option.HomeWorkId this.Msg.CourseId = option.CourseId;
this.getCourseCommentTimes();
}, },
}; };
</script> </script>
<style scoped> <style scoped>
.setComments-setType-right view text{ .setComments-setType-right view text {
margin-right: 11rpx; margin-right: 11rpx;
} }
.setComments-setType-right view{
color: #D9868D; .setComments-setType-right view {
background: #F5DEE0; color: #D9868D;
border-radius: 25rpx; background: #F5DEE0;
width: 200rpx; border-radius: 25rpx;
height: 50rpx; width: 200rpx;
line-height: 50rpx; height: 50rpx;
text-align: center; line-height: 50rpx;
letter-spacing: 1rpx; text-align: center;
} letter-spacing: 1rpx;
.setComments-setType-right{ }
flex-shrink: 0;
font-size: 24rpx; .setComments-setType-right {
font-weight: 500; flex-shrink: 0;
font-size: 24rpx;
} font-weight: 500;
.setComments-setType-text view{
font-size: 24rpx; }
color: #AFAFAF;
font-weight: 400; .setComments-setType-text view {
margin-top: 15rpx; font-size: 24rpx;
} color: #AFAFAF;
.setComments-setType-text text{ font-weight: 400;
font-size: 30rpx; margin-top: 15rpx;
font-weight: bold; }
color: #282828;
} .setComments-setType-text text {
.setComments-setType-text{ font-size: 30rpx;
flex-direction: column; font-weight: bold;
margin-left: 26rpx; color: #282828;
letter-spacing: 1rpx; }
}
.setComments-setType-left view:first-child{ .setComments-setType-text {
flex-shrink: 0; flex-direction: column;
} margin-left: 26rpx;
.setComments-setType-left{ letter-spacing: 1rpx;
flex-grow: 1; }
margin-right: 32rpx;
} .setComments-setType-left view:first-child {
.setComments-index-setType{ flex-shrink: 0;
background: #FCEEEF; }
box-shadow: 0px 6px 52px 0px rgba(230, 65, 80, 0.19);
border-radius: 50px; .setComments-setType-left {
margin: 55rpx 50rpx 50rpx 50rpx; flex-grow: 1;
padding: 33rpx 50rpx; margin-right: 32rpx;
} }
.setComments-index-box{
background: #F6F6F6; .setComments-index-setType {
} background: #FCEEEF;
.setComments-index-header-title{ box-shadow: 0px 6px 52px 0px rgba(230, 65, 80, 0.19);
font-size: 32rpx; border-radius: 50px;
font-weight: 500; margin: 55rpx 50rpx 50rpx 50rpx;
color: #282828; padding: 33rpx 50rpx;
flex:1; }
text-align: center;
padding-right: 40rpx; .setComments-index-box {
} background: #F6F6F6;
.navbarSticky { }
.setComments-index-header-title {
font-size: 32rpx;
font-weight: 500;
color: #282828;
flex: 1;
text-align: center;
padding-right: 40rpx;
}
.navbarSticky {
display: sticky; display: sticky;
top: 0; top: 0;
z-index: 9; z-index: 9;
......
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