no message

src/components/setComments/commentDetailsPopu.vue

+<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

@@ -2,7 +2,7 @@
 	<view class="setComments-box">
 		<view class="setComments-add">
 			<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">
 				<template v-for="(item,index) in dataList">
 					<view class="setComments-content">
@@ -30,7 +30,10 @@
 						</view>
 					</view>
 				</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>
@@ -118,6 +121,22 @@
 	};
 </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;
+	}
     .setComments-Evaluation view text:first-child{
         border-right: 1px solid #E5E5E5;
         padding: 0 16rpx 0 0;

src/pages.json

@@ -56,6 +56,16 @@
 		"style": {
 			"navigationStyle": "custom"
 		}
+	},{
+		"path": "pages/setComments/commentDetails",
+		"style": {
+			"navigationStyle": "custom"
+		}
+	},{
+		"path": "pages/setComments/addComment",
+		"style": {
+			"navigationStyle": "custom"
+		}
 	}
       
     ],

src/pages/setComments/addComment.vue

+<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

+<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

 <template>
 	<view class="setComments-index-box">
 		<navbar class="navbarSticky" bg="#F6F6F6">
-			<view class="setComments-index-header-box flex">
-				<van-icon class="setComments-index-header-left" name="arrow-left" @click="back" />
-				<text class="setComments-index-header-title">设置评语</text>
+			<view class="setComments-header-box flex">
+				<van-icon class="setComments-header-left" name="arrow-left" @click="back" />
+				<text class="setComments-header-title">设置评语</text>
 			</view>
 		</navbar>
 		<view class="setComments-index-content">
@@ -136,6 +136,24 @@
 	};
 </script>
 <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 {
 		margin-right: 11rpx;
 	}
@@ -188,8 +206,8 @@
 
 	.setComments-index-setType {
 		background: #FCEEEF;
-		box-shadow: 0px 6px 52px 0px rgba(230, 65, 80, 0.19);
-		border-radius: 50px;
+		box-shadow: 0rpx 6rpx 52rpx 0rpx rgba(230, 65, 80, 0.19);
+		border-radius: 50rpx;
 		margin: 55rpx 50rpx 50rpx 50rpx;
 		padding: 33rpx 50rpx;
 	}