zhxg_app_v1.0/pages/comprehensive/instructor/detail.vue

<template>
	<view class="audit" v-if="detail.student">
		<view style="margin: 40rpx;">
			<uni-swiper-dot :info="swiperlist" :current="current" :dots-styles="dotStyles" field="content" mode="round">
				<swiper interval="2000" autoplay class="swiper-box" @change="change">
					<swiper-item v-for="(item ,index) in swiperlist" :key="index">
						<view class="swiper-item" @click="previewImg(swiperlist)">
							<image mode="aspectFill"  :src="item.path">
							</image>
						</view>
					</swiper-item>
				</swiper>
			</uni-swiper-dot>
		</view>
		<form>
			<view class="form-item">
				<label><text class="tip">*</text>学院</label>
				<input disabled type="text" name="deptName" v-model="detail.student.dept.deptName" />
			</view>
			<view class="form-item">
				<label><text class="tip">*</text>专业</label>
				<input disabled type="text" name="majorName" v-model="detail.student.srsMajors.majorName" />
			</view>
			<view class="form-item">
				<label><text class="tip">*</text>班级</label>
				<input disabled type="text" name="className" v-model="detail.student.srsClass.className" />
			</view>
			<view class="form-item">
				<label><text class="tip">*</text>加分学生</label>
				<input disabled type="text" name="submitterName" v-model="detail.student.name" />
			</view>
			<view class="form-item">
				<label><text class="tip">*</text>项目名称</label>
				<input disabled type="text" name="ruleName" v-model="detail.rules.ruleName" />
			</view>
			<view class="form-item">
				<label><text class="tip">*</text>描述</label>
				<input disabled type="text" name="description" v-model="detail.description" />
			</view>
			<!-- <view class="form-item">
				<label><text class="tip">*</text>是否通过</label>
					<view class="uni-px-5 uni-pb-5">
						<uni-data-checkbox v-model="valiFormData.statusCode" :localdata="statelist"></uni-data-checkbox>
					</view>
			</view> -->
			
			<!-- <view v-if="valiFormData.statusCode!=6" class="form-item">
				<label><text class="tip">*</text>未通过理由</label>
				<input type="text" v-model="valiFormData.description" />
			</view> -->
			<!-- <view class="btns">
				<button  form-type="submit" :disabled="isSubmitting">确定</button>
			</view> -->
		</form>
		
	</view>
</template>

<script>
	import {
		uploadImg,
		previewImg,
		removeImg
	} from "@/utils/uploadImg.js"
	import {
		myReview,
		listOwnProcessed,
		getDetailInfo,process
	} from '@/api/comprehensive/instructor.js';
	import {
		baseUrl
	} from "@/config.js";
	import {
		validateFormFields
	} from "@/utils/validateForm.js"
	export default {
		data() {
			return {
				valiFormData: {
					statusCode: 6,
					description:''
				},
				id: '',
				detail: {},
				isSubmitting: false, //表单提交标志位
				swiperlist: [],
				baseUrl: baseUrl,
				current: 0,
				dotStyles: {
					width: 12,
					backgroundColor: 'rgba(255, 255, 255, 0.4)',
					border: '1px rgba(255, 255, 255, 0.4) solid',
					color: '#fff',
					selectedBackgroundColor: '#1890FF',
					selectedBorder: '1px #1890FF solid'
				},
				// statelist: [{
				// 	text: '驳回',
				// 	value: 10
				// }, {
				// 	text: '通过',
				// 	value: 6
				// }, {
				// 	text: '拒绝',
				// 	value: 11
				// }],
				// processForm:{}
			}
		},
		onLoad(option) {
			var arr = JSON.parse(option.item)
			// this.processForm = arr
			this.id = arr.id
			this.getDetail()
		},
		methods: {
			change(e) {
				this.current = e.detail.current;
			},
			async getDetail() {
				let res = await getDetailInfo(this.id)
				if (res.code == 200) {
					this.detail = res.data
					var arr = res.data.material.split(",")
					for (var i = 0; i < arr.length; i++) {
						var obj = {}
						obj.path=baseUrl+arr[i]
						this.swiperlist.push(obj)
					}
				}
				console.log(res)
			},
			previewImg(imgs) {
				previewImg(imgs);
			},
		}
	}
</script>

<style lang="scss" scoped>
	.audit {
		background-color: #F5F5F7;
		padding: 10px;
		padding-bottom: 80px;

		// height: 98vh;
		.swiper-box {
			width: 100%;
			height: 600rpx;
			border-radius: 16rpx;
			.swiper-item {
				border-radius: 16rpx;
				height: 600rpx;

				image {
					width: 100%;
					height: 600rpx;
					border-radius: 16rpx;
				}
			}
		}

		.form-item {
			display: flex;
			flex-direction: column;
			padding: 22rpx 40rpx;
			background-color: white;
			margin-bottom: 20rpx;
			border-radius: 16rpx;

			.tip {
				color: red;
				font-size: 24rpx;
			}

			label {
				margin-bottom: 20rpx;
				display: inline-block;
			}

			input {
				border: 1px solid #E1E1E1;
				border-radius: 10rpx;
				height: 70rpx;
				padding-left: 30rpx;

				.input-placeholder {
					color: #b6b6b6;
				}
			}



		}
	}
</style>