hg_zlxc_h5/pages/learnDriveStep/confirmClassHour/confirmClassHour.vue

<template>
	<view class="box">
		<view class="main">
			<signature :showCanvas="showCanvas" @closeCanvas="closeCanvas" @getCanvasImg="getCanvasImg"></signature>
		</view>
	</view>
	
</template>
<script>
import signature from './signature.vue';
import carLearn from '@/api/carLearn.js'
import { APP_API, APP_HOST } from '@/site.config.js';
export default {
	components: {
		signature
	},
	data() {
		return {
		//打开canvas绘制签名
			showCanvas: true,
			//是否展示操作菜单
			completionSignPath: '' ,//签名路径
			completionSignImg:'',	//签名图片base64
			signImg:"",				//原有签名图片
			params: {
				studentId: uni.getStorageSync('studentId')||'',
				part: '',
				signUrl: ''
			}
		}
	},
	onLoad(option) {
		this.params.part = option.part
	},
	
	methods: {
		
		//隐藏canvas签名组件
		closeCanvas(e) {
			// this.showCanvas = false;
			if (e) {
				this.completionSignPath = e
				this.ossUpload();
			}
		},
		//获取图片内容
		getCanvasImg(e) {
			if (e) {
				this.completionSignImg = e
				// this.ossUpload()
			}
		},
		sign() {
			this.showCanvas = true;
		},
		//上传签名
		ossUpload() {
			let _this = this
			if(!this.completionSignPath){
				uni.showToast({
					title: '签名为空不能上传',
					icon: 'none',
					duration: 2000
				})
				return;
			}
			const _url = APP_HOST + APP_API + '/util/manage/uploadFile.do';
			console.log('来到这里了吗？')
			console.log(this.completionSignPath)
			uni.uploadFile({
				url: _url,
				filePath: this.completionSignPath,
				name: 'file',
				formData: {
					fileType: 1,
					fileSuffix: "png",
				},
				header: {
					'token' : uni.getStorageSync("Authorization") || '',
				},
				success: res => {
					// 判断是否json字符串，将其转为json格式
					let data = typeof(res.data) == 'string' ? JSON.parse(res.data) : res.data;
					if (data.code==0) {
						console.log(data.data)
						_this.params.signUrl = data.data
						_this.saveStudentPeriodSign()
					}
					console.log(res)
				},
				fail: err =>{
					console.log('err',err);
					uni.$u.toast(err.errMsg);
				}
			});
		},
		// 确认认签名
		async saveStudentPeriodSign() {
			const [err, res] = await carLearn.saveStudentPeriodSign(this.params)
			console.log('签名成功')
			console.log(res)
			if(res.data.code!=0) return this.$u.toast(res.message)
			// 锁定竖屏
			// #ifdef APP-PLUS
			plus.screen.lockOrientation("portrait-primary");
			// #endif
			this.$refs.uToast.show({
				title: '上传成功',
				type: 'success',
				url: '/pages/learnDriveStep/confirmClassHour/back'
			})
			
		},
	}
}
</script>
<style scoped lang="scss">
	.box {
		overflow: hidden;
		height: 100vh;
	}
	.main {
		width: 100%;
		height: 100%;
		background: #fff;
		  overflow-y: scroll;
		  /* 使用滚动区域代替Webview滚动 */
		  -webkit-overflow-scrolling: touch;
		  /* IOS弹性 */
		  position: relative;
		  /* 相对位置 */
		  overflow-x: hidden;
		  /* X轴滚动 */
		  -webkit-transform: translateZ(0);
		  /* 3D加速 */
		  -webkit-overflow-scrolling: touch;
	}
</style>