Skip to content

T
thinkApp
Commit fc8f6f8e authored by youjie's avatar youjie
Browse files
Options

no message

parent acbf7c79
Show whitespace changes
Inline Side-by-side
Showing with 928 additions and 7 deletions
src/components/setComments/commentDetails.vue 0 → 100644
View file @ fc8f6f8e
<template>
<view class="commentDetailsList-box">
<view class="commentDetailsList-add" @click="goAdd">
<van-icon name="plus" /><text>增加评论</text> </view>
<view class="index-student-information">
<view class="commentDetailsList-content">
<view class="commentDetailsList-list">
<view class="commentDetailsList-cross" @click="deleteRules">
<van-icon name="cross" />
</view>
<view class="commentDetailsList-img flex">
<view>学员1</view>
<view class="flex">
<text>可见</text>
<van-image @click="editRules" class="img" width="31rpx" height="30rpx" fit="cover" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1653980151000_180.png" />
</view>
<view class="Wire"></view>
</view>
<view class="commentDetailsList-comment">
这位学员很优秀，平时课上的问题都能积极回
答，正确率非常高。这次考试得分也很高，希望再接再厉
</view>
</view>
</view>
<view class="noData">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1653902791000_806.png" mode="widthFix"></image>
<view>暂无评论规则数据</view>
</view>
</view>
<commentDetailsPopu ref="getcommentPopup"></commentDetailsPopu>
</view>
</template>
<script>
import commentDetailsPopu from '@/components/setComments/commentDetailsPopu'
import {
ref,
reactive,
toRefs,
onMounted,
getCurrentInstance,
inject,
watch
} from "vue";
import navbar from '../../components/navbar.vue'
export default {
props: ["CourseCommentTimesList"],
emits: ['refreshData'],
components: {
navbar,
commentDetailsPopu
},
setup(props, context) {
let { refs } = getCurrentInstance();
let {
proxy
} = getCurrentInstance();
let data = reactive({
optionsList: [{
text: '可见',
value: 1
},
{
text: '部分可见',
value: 2
},
{
text: '不可见',
value: 3
},
],
dataList: [],
show:false
});
let methods = {
goAdd(){
uni.navigateTo({
url: '/pages/setComments/addComment'
})
},
back() {
uni.navigateBack({
delta: 1
})
},
addRules(){//添加规则
data.show = true
refs.getcommentPopup.$vm.showFun()
},
editRules(){//编辑规则
data.show = true
refs.getcommentPopup.$vm.showFun()
},
deleteRules (){//删除规则
uni.showModal({
title: '提示',
content: '将删除该评价,是否继续',
success: function (res) {
if (res.confirm) {
console.log('---')
} else if (res.cancel) {
uni.showToast({
title:'已取消',
icon:'none',
duration: 500
})
}
}
});
},
clickOptionsShow(item) {
item.optionsShow = !item.optionsShow;
},
clickoptions(item,subItem) {
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 {
...toRefs(data),
...methods
};
},
onLoad(option) {
},
};
</script>
<style scoped>
.noData {
text-align: center;
flex: 1;
width: 100%;
}
.noData image {
width: 200rpx;
margin-bottom: 40rpx;
}
.noData view {
font-size: 24rpx;
color: #cecece;
text-align: center;
}
.Wire{
width: 4rpx;
height: 23rpx;
background: #282828;
position: absolute;
left: 0;
top: 47rpx;
}
.commentDetailsList-comment{
font-size: 26rpx;
font-weight: 400;
color: #5E5E5E;
line-height: 48rpx;
letter-spacing: 1rpx;
}
.commentDetailsList-img .img{
margin-top: 8rpx;
flex-shrink: 0;
}
.commentDetailsList-img view:first-child{
flex-grow: 1;
margin-right: 15rpx;
}
.commentDetailsList-img text{
background: #FCEEEF;
border-radius: 25rpx;
font-size: 24rpx;
font-weight: 500;
color: #CE8086;
padding: 10rpx 25rpx;
margin-right: 33rpx;
}
.commentDetailsList-img{
justify-content: space-between;
align-items: center;
align-items: center;
font-size: 26rpx;
font-weight: 500;
color: #282828;
margin-bottom: 34rpx;
letter-spacing: 1rpx;
}
.commentDetailsList-cross{
position: absolute;
right: -12rpx;
top: -12rpx;
width: 44rpx;
height: 44rpx;
background: #FFFFFF;
box-shadow: 0rpx 0rpx 21rpx 0rpx rgba(165, 165, 165, 0.34);
border-radius: 10rpx;
font-size: 26rpx;
color: #D9868D;
text-align: center;
line-height: 44rpx;
}
.commentDetailsList-list{
position: relative;
background: #FFFFFF;
padding: 31rpx 40rpx 37rpx 22rpx;
box-shadow: 0rpx 6rpx 29rpx 0rpx rgba(76, 76, 76, 0.09);
border-radius: 30rpx;
}
.commentDetailsList-title .img{
flex-shrink: 0;
display: inline-block;
margin-top: 5rpx;
}
.commentDetailsList-title text{
font-size: 40rpx;
font-weight: bold;
color: #282828;
margin-left: 29rpx;
letter-spacing: 1rpx;
}
.commentDetailsList-title{
align-items: center;
margin-bottom: 35rpx;
}
.commentDetailsList-Evaluation view text:first-child{
border-right: 1px solid #E5E5E5;
padding: 0 16rpx 0 0;
}
.commentDetailsList-Evaluation view text:last-child{
margin-left: 16rpx;
}
.commentDetailsList-Evaluation view text{
display: inline-block;
letter-spacing: 1rpx;
}
.commentDetailsList-Evaluation view{
float: right;
margin-top: 25rpx;
margin-bottom: 27rpx;
font-size: 24rpx;
font-weight: 500;
color: #CE8086;
}
.commentDetailsList-Evaluation{
height: 85rpx;
border-top: 1rpx solid #E5E5E5;
}
.commentDetailsList-source{
font-size: 20rpx;
color: #C2BCBA;
font-weight: 500;
justify-content: space-between;
padding: 26rpx 0 25rpx 0;
}
.point{
width: 8rpx;
height: 8rpx;
background: #E64150;
border-radius: 50%;
}
.commentDetailsList-options-title,.commentDetailsList-options-text{
font-size: 24rpx;
font-weight: 500;
color: #CE8086;
text-align: center;
font-weight: bold;
}
.commentDetailsList-options-text text{
padding: 5rpx 0;
}
.commentDetailsList-options-text{
flex-direction: column;
margin-top: 10rpx;
position: absolute;
left: 0;
right: 0;
top: 35rpx;
background: #FCEEEF;
padding: 20rpx 0 20rpx 0;
border-radius: 0 0 25rpx 25rpx;
}
.commentDetailsList-options-title text{
margin-right: 10rpx;
margin-left: 10rpx;
}
.commentDetailsList-options-title{
justify-content: center;
align-items: center;
}
.commentDetailsList-options{
flex-grow: 1;
border-radius: 25rpx;
background: #FCEEEF;
flex-direction: column;
padding: 14rpx 17rpx 15rpx 17rpx;
letter-spacing: 1rpx;
position: relative;
}
.commentDetailsList-title-right{
width: 190rpx;
flex-shrink: 0;
}
.commentDetailsList-title-left{
letter-spacing: 1rpx;
flex-grow: 1;
color: #282828;
font-size: 26rpx;
font-weight: bold;
margin-right: 20rpx;
}
.center-line{
position: absolute;
left: 0;
top: 30rpx;
width: 4rpx;
height: 23rpx;
background: #282828;
}
.commentDetailsList-content{
}
.commentDetailsList-add van-icon{
font-size: 25rpx;
margin-right: 20rpx;
}
.commentDetailsList-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;
border-radius: 50rpx 50rpx 0 0;
padding: 71rpx 50rpx 30rpx 50rpx;
flex-direction: column;
}
</style>
src/components/setComments/commentDetailsPopu.vue 0 → 100644
View file @ fc8f6f8e
<template>
<view class="commentPopup-box">
<van-popup :show="show" :round="true" @close="closepopup">
<view class="commentPopup-box">
<van-icon class="commentPopup-closure" name="cross" @click="closepopup"/>
<view class="commentPopup-title">修改评语</view>
<view class="commentPopup-content">
<textarea placeholder="请填写评语内容"></textarea>
</view>
<view class="commentPopup-save flex">
<view @click="save">确认</view>
</view>
</view>
</van-popup>
</view>
</template>
<script>
import {
ref,
reactive,
toRefs,
onMounted,
getCurrentInstance,
inject,
watch
} from "vue";
import { uploadFile } from "@/utils/index";
export default {
props: {
},
components: {},
setup(props,ctx) {
// 双滑块模式时，值必须是数组
const value = ref([10, 50]);
let {
proxy
} = getCurrentInstance();
let data = reactive({
valueNum: ref([0, 0]),
show: false,
loading: false,
});
let methods = {
showFun(){
data.show = true
},
closepopup(){
data.show = false
},
onChange(value){
console.log(value)
// data.valueNum = value
// console.log(data.valueNum)
},
save(){
data.show = false
}
};
let that = methods;
return {
...toRefs(data),
value,
...methods
};
},
onLoad(){
},
onShow() {
}
};
</script>
<style scoped>
.custom-button {
width: 26rpx;
color: #fff;
font-size: 20rpx;
line-height: 36rpx;
text-align: center;
background-color: #ee0a24;
border-radius: 100rpx;
}
.commentPopup-content{
background: #F7F7F7;
border-radius: 30rpx;
min-height: 152rpx;
padding: 37rpx 43rpx;
}
.commentPopup-save view{
background: #C91727;
font-size: 30rpx;
font-weight: bold;
letter-spacing: 1rpx;
width: 260rpx;
line-height: 88rpx;
border-radius: 44rpx;
text-align: center;
color: #FFFFFF;
}
.commentPopup-save{
justify-content: center;
margin-top: 40rpx;
}
.commentPopup-box .noData{
text-align: center;
flex:1;
width: 100%;
}
.commentPopup-box .noData image{
width:200rpx;
margin-bottom: 40rpx;
}
.commentPopup-box .noData view{
font-size: 24rpx;
color: #cecece;
text-align: center;
}
.commentPopup-name{
background-color: #F7F7F7;
text-align: center;
border: 1px solid #F7F7F7;
height: 88rpx;
line-height: 88rpx;
padding: 0 10rpx;
border-radius: 44rpx;
font-size: 30rpx;
letter-spacing: 1rpx;
}
.commentPopup-title{
width: 100%;
text-align: center;
font-size: 30rpx;
font-weight: 500;
margin-bottom: 73rpx;
letter-spacing: 1rpx;
}
.commentPopup-closure{
position: absolute;
right: 31rpx;
top: 31rpx;
color: #282828;
font-size: 38rpx;
}
.commentPopup-box{
position: relative;
width: 548rpx;
padding: 48rpx 55rpx 60rpx 55rpx;
}
.commentPopup-box{
}
</style>
src/components/setComments/setComments.vue
View file @ fc8f6f8e
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<view class="setComments-box"> <view class="setComments-box">
<view class="setComments-add"> <view class="setComments-add">
<van-icon name="plus" /><text>创建评价</text> </view> <van-icon name="plus" /><text>创建评价</text> </view>
<view class="index-student-information"> <view class="index-student-information" v-if="dataList.length>0">
<view class="setComments-content-box"> <view class="setComments-content-box">
<template v-for="(item,index) in dataList"> <template v-for="(item,index) in dataList">
<view class="setComments-content"> <view class="setComments-content">
...@@ -30,7 +30,10 @@ ...@@ -30,7 +30,10 @@
</view> </view>
</view> </view>
</template> </template>
</view>
<view class="noData" v-esle>
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1653902791000_806.png" mode="widthFix"></image>
<view>暂无评价规则数据</view>
</view> </view>
</view> </view>
</view> </view>
...@@ -118,6 +121,22 @@ ...@@ -118,6 +121,22 @@
}; };
</script> </script>
<style scoped> <style scoped>
.noData {
text-align: center;
flex: 1;
width: 100%;
}
.noData image {
width: 200rpx;
margin-bottom: 40rpx;
}
.noData view {
font-size: 24rpx;
color: #cecece;
text-align: center;
}
.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;
......
src/pages.json
View file @ fc8f6f8e
...@@ -56,6 +56,16 @@ ...@@ -56,6 +56,16 @@
"style": { "style": {
"navigationStyle": "custom" "navigationStyle": "custom"
} }
},{
"path": "pages/setComments/commentDetails",
"style": {
"navigationStyle": "custom"
}
},{
"path": "pages/setComments/addComment",
"style": {
"navigationStyle": "custom"
}
} }
], ],
......
src/pages/setComments/addComment.vue 0 → 100644
View file @ fc8f6f8e
<template>
<view class="addComment-index-box">
<navbar class="navbarSticky" bg="#F6F6F6">
<view class="addComment-header-box flex">
<van-icon class="addComment-header-left" name="arrow-left" @click="back" />
<text class="addComment-header-title">新增评论</text>
</view>
</navbar>
<view class="addComment-content">
<!-- <setComments :CourseCommentTimesList="courseTimeList" @refreshData="getCourseCommentTimes"></setComments> -->
</view>
</view>
</template>
<script>
import setComments from '@/components/setComments/setComments'
import {
reactive,
toRefs,
onMounted,
getCurrentInstance,
inject
} from "vue";
import navbar from '../../components/navbar.vue'
export default {
props: {
},
components: {
navbar,
setComments
},
setup() {
let {
proxy
} = getCurrentInstance();
let data = reactive({
value: 1,
optionsList: [{
text: '部分可见',
value: 0
},
{
text: '可见不可见',
value: 1
},
{
text: '活动商品',
value: 2
},
],
radioList: [{
name: '使用默认配置',
id: 1,
checked: true
},
{
name: '自定义评价',
id: 2
}
],
checked: '1',
Msg: {
CourseId: '',
},
courseTimeList: [], //课程自动生成评论次数
courseRule: {}, //课程评价规则
});
let methods = {
back() {
uni.navigateBack({
delta: 1
})
},
radioChange(e) {
console.log("打印国家名称", e.target.value)
},
//获取课程评论次数列表
getCourseCommentTimes() {
proxy.$request("/Teacher/GetCourseCommentTimes", data.Msg).then(res => {
if (res) {
data.courseTimeList = res.Data;
}
})
},
//获取课程评价规则信息
getCourseRule() {
proxy.$request("/Teacher/GetCourseComment", data.Msg).then(res => {
if (res) {
data.courseRule = res.Data;
}
})
},
goRules() {
uni.navigateTo({
url: '/pages/setComments/commentRulesList?CourseId=' + data.Msg.CourseId
})
}
};
return {
...toRefs(data),
...methods
};
},
onLoad(option) {
this.Msg.CourseId = option.CourseId;
this.getCourseRule();
this.getCourseCommentTimes();
},
};
</script>
<style scoped>
.addComment-header-box{
padding: 20rpx 42rpx;
flex-direction: row;
align-items: center;
}
.addComment-header-title{
font-size: 32rpx;
font-weight: 500;
color: #282828;
flex:1;
text-align: center;
padding-right: 40rpx;
}
.addComment-header-left{
font-size: 40rpx;
position: relative;
z-index: 3;
}
.navbarSticky {
display: sticky;
top: 0;
z-index: 9;
}
</style>
src/pages/setComments/commentDetails.vue 0 → 100644
View file @ fc8f6f8e
<template>
<view class="commentDetails-index-box">
<navbar class="navbarSticky" bg="#F6F6F6">
<view class="commentDetails-header-box flex">
<van-icon class="commentDetails-header-left" name="arrow-left" @click="back" />
<text class="commentDetails-header-title">评价详情</text>
</view>
</navbar>
<view class="commentDetails-index-content">
<view class="commentDetails-index-setType flex">
<view class="commentDetails-setType-text flex">
<view>
第一次评价
</view>
<view class="flex">
<text>部分可见</text>
</view>
</view>
<view class="commentDetails-setType-time flex" @click="goRules">
<view>
来源:
</view>
<view>
时间:
</view>
</view>
</view>
<commentDetails :CourseCommentTimesList="courseTimeList" @refreshData="getCourseCommentTimes"></commentDetails>
</view>
</view>
</template>
<script>
import commentDetails from '@/components/setComments/commentDetails'
import {
reactive,
toRefs,
onMounted,
getCurrentInstance,
inject
} from "vue";
import navbar from '../../components/navbar.vue'
export default {
props: {
},
components: {
navbar,
commentDetails
},
setup() {
let {
proxy
} = getCurrentInstance();
let data = reactive({
value: 1,
optionsList: [{
text: '部分可见',
value: 0
},
{
text: '可见不可见',
value: 1
},
{
text: '活动商品',
value: 2
},
],
radioList: [{
name: '使用默认配置',
id: 1,
checked: true
},
{
name: '自定义评价',
id: 2
}
],
checked: '1',
Msg: {
CourseId: '',
},
courseTimeList: [], //课程自动生成评论次数
courseRule: {}, //课程评价规则
});
let methods = {
back() {
uni.navigateBack({
delta: 1
})
},
radioChange(e) {
console.log("打印国家名称", e.target.value)
},
//获取课程评论次数列表
getCourseCommentTimes() {
proxy.$request("/Teacher/GetCourseCommentTimes", data.Msg).then(res => {
if (res) {
data.courseTimeList = res.Data;
}
})
},
//获取课程评价规则信息
getCourseRule() {
proxy.$request("/Teacher/GetCourseComment", data.Msg).then(res => {
if (res) {
data.courseRule = res.Data;
}
})
},
goRules() {
uni.navigateTo({
url: '/pages/setComments/commentRulesList?CourseId=' + data.Msg.CourseId
})
}
};
return {
...toRefs(data),
...methods
};
},
onLoad(option) {
this.Msg.CourseId = option.CourseId;
this.getCourseRule();
this.getCourseCommentTimes();
},
};
</script>
<style scoped>
.commentDetails-setType-time{
justify-content: space-between;
font-size: 24rpx;
font-weight: 500;
color: #AFAFAF;
line-height: 42rpx;
margin-top: 40rpx;
}
.commentDetails-setType-text view:last-child{
flex-shrink: 0;
margin-left: 15rpx;
}
.commentDetails-setType-text view:last-child text {
color: #D9868D;
background: #F5DEE0;
border-radius: 25rpx;
width: 150rpx;
height: 50rpx;
line-height: 50rpx;
text-align: center;
letter-spacing: 1rpx;
font-size: 24rpx;
}
.commentDetails-setType-text view:first-child {
font-size: 30rpx;
font-weight: bold;
color: #282828;
}
.commentDetails-setType-text{
justify-content: space-between;
}
.commentDetails-index-setType {
background: #FCEEEF;
box-shadow: 0rpx 6rpx 52rpx 0rpx rgba(230, 65, 80, 0.19);
border-radius: 50rpx;
margin: 55rpx 50rpx 50rpx 50rpx;
padding: 33rpx 50rpx;
flex-direction: column;
}
.commentDetails-index-box {
background: #F6F6F6;
}
.commentDetails-index-header-title {
font-size: 32rpx;
font-weight: 500;
color: #282828;
flex: 1;
text-align: center;
padding-right: 40rpx;
}
.commentDetails-header-box{
padding: 20rpx 42rpx;
flex-direction: row;
align-items: center;
}
.commentDetails-header-title{
font-size: 32rpx;
font-weight: 500;
color: #282828;
flex:1;
text-align: center;
padding-right: 40rpx;
}
.commentDetails-header-left{
font-size: 40rpx;
position: relative;
z-index: 3;
}
.navbarSticky {
display: sticky;
top: 0;
z-index: 9;
}
</style>
src/pages/setComments/setComments.vue
View file @ fc8f6f8e
<template> <template>
<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-header-box flex">
<van-icon class="setComments-index-header-left" name="arrow-left" @click="back" /> <van-icon class="setComments-header-left" name="arrow-left" @click="back" />
<text class="setComments-index-header-title">设置评语</text> <text class="setComments-header-title">设置评语</text>
</view> </view>
</navbar> </navbar>
<view class="setComments-index-content"> <view class="setComments-index-content">
...@@ -136,6 +136,24 @@ ...@@ -136,6 +136,24 @@
}; };
</script> </script>
<style scoped> <style scoped>
.setComments-header-box{
padding: 20rpx 42rpx;
flex-direction: row;
align-items: center;
}
.setComments-header-title{
font-size: 32rpx;
font-weight: 500;
color: #282828;
flex:1;
text-align: center;
padding-right: 40rpx;
}
.setComments-header-left{
font-size: 40rpx;
position: relative;
z-index: 3;
}
.setComments-setType-right view text { .setComments-setType-right view text {
margin-right: 11rpx; margin-right: 11rpx;
} }
...@@ -188,8 +206,8 @@ ...@@ -188,8 +206,8 @@
.setComments-index-setType { .setComments-index-setType {
background: #FCEEEF; background: #FCEEEF;
box-shadow: 0px 6px 52px 0px rgba(230, 65, 80, 0.19); box-shadow: 0rpx 6rpx 52rpx 0rpx rgba(230, 65, 80, 0.19);
border-radius: 50px; border-radius: 50rpx;
margin: 55rpx 50rpx 50rpx 50rpx; margin: 55rpx 50rpx 50rpx 50rpx;
padding: 33rpx 50rpx; padding: 33rpx 50rpx;
} }
......
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