driverSchool/pagesA/evaluateAdd/index.vue

<template>
	<view class="page flex-col">
		<view style="width: 100%;background: #f4f5f6;box-sizing: border-box;padding-top: 88px;">
			<headers titles="评价详情">
				<uni-icons type="left" color="#000000" size="22px"></uni-icons>
			</headers>
		</view>
		<view class="section_2 flex-col">
			<view class="box_2 flex-col">
				<view class="block_3 flex-row">
					<view class="text-group_1 flex-col justify-between">
						<text class="text_2" v-if="show">{{ subjectArr[info.subject - 1] }}{{ title}}</text>
						<text class="text_2" v-else>{{ info.busiName }}{{ title}}</text>
						<text class="text_3">{{ info.time }}</text>
					</view>
				</view>
				<view class="block_4 flex-row justify-between">
					<view class="text-wrapper_1 flex-col">
						<text class="text_4" v-if="show">{{ subjectArr[info.subject - 1] }}</text>
						<text class="text_4" v-else>{{ info.busiName.slice(0, 3) }}</text>
					</view>
					<view class="text-wrapper_2 flex-col">
						<text class="text_5">{{ info.courseType }}</text>
					</view>
				</view>
				<view class="block_5 flex-row">
					<view class="image-text_1 flex-row justify-between">
						<image class="label_2" referrerpolicy="no-referrer"
							src="/static/lanhu_pingjiabiaodan/FigmaDDSSlicePNG9781bf564ae15eee66e88c90622422db.png" />
						<text class="text-group_2">{{ info.coachName }}</text>
					</view>
					<view style="display: flex; align-items: center;">
						<u-rate active-color="#EAA140" v-model="info.rate" allowHalf inactive-color="#b2b2b2"
							@change="changeRate" :readonly="!show"></u-rate>
						<text style="margin-left: 5rpx;color:#E1A652;">{{ info.rate }}</text>
					</view>
				</view>
			</view>
		</view>
		<view class="section_4 flex-col">
			<text class="text_7">服务评价</text>
			<view class="text-wrapper_3 flex-col">
				<u--textarea v-model="info.serviceContent" :disabled="!show" autoHeight
					placeholder="请输入内容"></u--textarea>
			</view>
			<text class="text_9">技术评价</text>
			<view class="text-wrapper_4 flex-col">
				<u--textarea v-model="info.teachContent" :disabled="!show" autoHeight placeholder="请输入内容"></u--textarea>
			</view>
		</view>
		<view class="bottom_" v-if="show">

			<view class="text-wrapper_5 flex-col" style="display: flex; justify-content: center; align-items: center; width: 80%;"
				@click="submit">
				<view style="background-color: #044EF2; padding: 20rpx 80rpx;text-align: center; border-radius: 20px; width: 85%;">
					<text style="color: white; font-weight: 600; font-size: 32rpx;">确认评价</text>
				</view>
			</view>
		</view>
	</view>
</template>
<script>
	import headers from "@/components/header/headers.vue";
	import request from "@/utils/request";
	import UInput from "@/uni_modules/uview-ui/components/u--input/u--input.vue";
	import {
		getLocalUserInfo
	} from "@/utils/auth";
	import {
		login
	} from "../../api/login";

	export default {
		components: {
			UInput,
			headers
		},
		data() {
			return {
				constants: {},
				show: false,
				title: '',
				// 评价信息
				info: {
					rate: 0.0,
					evaluateType: 0,
					busiId: '',
					tenantId: '',
					subject: 0,
					busiName: '',
				},
				subjectArr: ['科目一', '科目二', '科目三', '科目四'],
			};
		},
		onLoad(options) {
			const data = JSON.parse(options.data);
			console.log('data',data)
			// 判断新增还是查看
			if (options.controls) {
				this.show = true
				Object.assign(this.info, data);
				this.info.id = null
				//设置默认评分
				this.info.rate = 0.0
				if (options.type === 'xunlian') {
					this.title = '训练'
					//评价类型为训练
					this.info.evaluateType = 0
					//业务id
					this.info.busiId = data.id
					this.info.time = data.trainDay
				} else if (options.type === 'kaoshi') {
					this.title = '考试'
					//评价类型为考试
					this.info.evaluateType = 1
          this.info.busiId = data.batchItemId
				}
        this.info.createTime = undefined
        this.info.updataTime = undefined
        this.info.creator = undefined
        this.info.updater = undefined
			} else {
				Object.assign(this.info, data);
			}
		},
		methods: {
			changeRate() {},
			submit() {
				// 判断评分、评价不能为空
				if (this.info.rate === 0.0 || this.info.serviceEvaluate === '' || this.info.technologyEvaluate === '') {
					uni.showToast({
						title: '请填写完整评价信息',
						icon: 'none',
						duration: 2000
					})
					return
				}
				//获取userId
				const user = getLocalUserInfo();
				this.info.userId = user.id
				this.info.userName = user.nickname

				request({
					url: '/app-api/feed-back',
					method: 'post',
					data: this.info,
				}).then(res => {
					uni.showToast({
						title: '评价成功',
						icon: 'none',
						duration: 2000
					})
					setTimeout(() => {
						//触发刷新事件
						uni.$emit('refresh');
						uni.navigateBack()
					}, 2000)
				})
			}
		}
	};
</script>
<style lang='scss'>
	@import '../common/common.scss';
	@import './assets/style/index.rpx.scss';

	.bottom_ {
		//固定在底部
		position: fixed;
		bottom: 1rpx;
		width: 100%;
		background: white;
		padding: 15rpx 0;
		display: flex;
		justify-content: center;
		
		/* 新增：水平居中 */
	}
  .text-group_2 {
    display: inline-block;
    max-width: 4em; /* 一个汉字大概占1em，3em就是三个字 */
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
</style>