cxyy-applet/pagesMy/match/add.vue

<template>
	<view class="container main">
		<view class="one">
			<uni-forms ref="baseForm" :rules="rules" :modelValue="form" label-width="80px">
				<uni-forms-item label="流程" required name="matchPath">
					<uni-data-select v-model="form.matchPath" :localdata="matchPathList"
						@change="matchPathChange"></uni-data-select>
				</uni-forms-item>
				<uni-forms-item label="选手" required name="sign">
					<uni-data-select v-model="form.sign" :localdata="signList" @change="signChange"></uni-data-select>
				</uni-forms-item>
				<uni-forms-item label="分数" required name="score">
					<uni-easyinput v-model="form.score" placeholder="请输入分数" />
				</uni-forms-item>
			</uni-forms>
			<view class="button">
				<button type="primary" @click="submit('baseForm')">保存</button>
			</view>
		</view>
	</view>
</template>

<script>
	import moment from 'moment';
	export default {
		data() {
			return {
				id: "",
				match: "",
				user: {},
				form: {
					sign: "",
					score: "",
				},
				matchPath: '',
				matchPathList: [],
				signList: [],
				// 校验规则
				rules: {
					sign: {
						rules: [{
							required: true,
							errorMessage: '选手不能为空'
						}]
					},
					score: {
						rules: [{
							required: true,
							errorMessage: '分数不能为空'
						}]
					},
				},
			}
		},
		onLoad: async function(e) {
			const that = this;
			that.$set(that, `id`, e && e.id || '');
			that.$set(that, `match`, e && e.match || '');
			that.$set(that.form, `matchPath`, e && e.matchPath || '');
			that.$set(that, `matchPath`, e && e.matchPath || '');
			await that.searchToken();
			await that.searchOther();
			await that.search();
		},
		methods: {
			// 用户信息
			searchToken() {
				const that = this;
				try {
					const res = uni.getStorageSync('token');
					if (res) {
						const user = that.$jwt(res);
						that.$set(that, `user`, user);
					}
				} catch (e) {}
			},
			async searchOther() {
				const that = this;
				let res;
				// 查询流程
				res = await that.$api(`/matchPath`, 'GET', {
					match: that.match,
					is_use: '0',
				})
				if (res.errcode == '0') {
					for (let val of res.data) {
						val.text = val.name
						val.value = val.id
					}
					that.$set(that, `matchPathList`, res.data)
				}
				// 查询选手
				res = await that.$api(`/sign`, 'GET', {
					match: that.match,
					status: '1',
				})
				if (res.errcode == '0') {
					for (let val of res.data) {
						val.text = val.name
						val.value = val.id
					}
					that.$set(that, `signList`, res.data)
				}
			},
			// 查询
			async search() {
				const that = this;
				if (that.id) {
					let res;
					res = await that.$api(`/score/${that.id}`, 'GET', {})
					if (res.errcode == '0') {
						that.$set(that, `form`, res.data)
					} else {
						uni.showToast({
							title: res.errmsg,
						});
					}
				} else {
					that.$set(that, `form`, {
						matchPath: that.matchPath
					})
				}
			},
			// 选择流程
			matchPathChange(e) {
				const that = this;
				let data = that.matchPathList.find(i => i.id == e);;
				if (data) {
					that.$set(that.form, `matchPath`, data.id)
				}
			},
			// 选择选手
			signChange(e) {
				const that = this;
				let data = that.signList.find(i => i.id == e);;
				if (data) {
					that.$set(that.form, `sign`, data.id)
				}
			},
			// 保存
			submit(ref) {
				const that = this;
				that.$refs[ref].validate().then(async res => {
					let arr;
					const data = {
						match: that.match,
						time: moment().format('YYYY-MM-DD'),
					}
					if (that.id) {
						arr = await that.$api(`/score/${that.id}`, 'POST', {
							...res,
							...data
						})
					} else {
						arr = await that.$api(`/score`, 'POST', {
							...res,
							...data
						})
					}
					if (arr.errcode == '0') {
						uni.showModal({
							content: "维护成功！",
							showCancel: false
						});
						uni.navigateBack({
							delta: 1
						})
					} else {
						uni.showToast({
							title: arr.errmsg,
						});
					}
				}).catch(err => {
					console.log('err', err);
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.main {
		padding: 0 3vw;

		.one {
			.button_remark {
				margin: 2vw 0;
				text-indent: 10px;
				color: var(--fF0Color);
				font-size: var(--font12Size);
			}

			.button {
				margin: 2vw 0 0 0;

				button {
					background-color: var(--f3CColor);
					font-size: var(--font14Size);
					border-radius: 2vw;
				}
			}
		}
	}
</style>