jcyjdt_applet/pagesBasic/policyfile/detail.vue

<template>
	<view class="main">
		<uni-forms class="form" ref="form" :rules="rules" :modelValue="form" label-width='90' label-position="top">
			<uni-forms-item label="标题" required name="title">
				<uni-easyinput v-model="form.title" placeholder="请输入标题" />
			</uni-forms-item>
			<uni-forms-item label="文件" required name="file">
				<upload class='upload' :list="form.file" name="file" :count="1" @uplSuc="uplSuc" @uplDel="uplDel">
				</upload>
			</uni-forms-item>
		</uni-forms>
		<button class="button" type="primary" @click="submit('form')">提交保存</button>
	</view>
</template>

<script>
	import upload from '../../components/upload/index.vue';
	export default {
		components: {
			upload
		},
		data() {
			return {
				id: '',
				user: {},
				form: {
					file: []
				},
				// 校验规则
				rules: {
					title: {
						rules: [{
							required: true,
							errorMessage: '请输入文件标题'
						}]
					}
				}
			}
		},
		onLoad: async function(e) {
			const that = this;
			that.$set(that, `id`, e && e.id || '');
			that.searchToken();
			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);
					} else {
						uni.navigateTo({
							url: `/pages/login/index`
						})
					}
				} catch (e) {
					uni.showToast({
						title: err.errmsg,
						icon: 'error',
						duration: 2000
					});
				}
			},
			async search() {
				const that = this;
				if (that.id) {
					const res = await that.$api(`/policyfile/${that.id}`, 'GET', {}, 'freeLabel')
					if (res.errcode == '0') {
						that.$set(that, `form`, res.data)
					} else {
						uni.showToast({
							title: res.errmsg,
						});
					}
				}
			},
			// 文件上传
			uplSuc(e) {
				const that = this;
				that.$set(that.form, `${e.name}`, [...that.form[e.name], e.data]);
			},
			// 文件删除
			uplDel(e) {
				const that = this;
				let data = that.form[e.name];
				let arr = data.filter((i, index) => index != e.data.index);
				that.$set(that.form, `${e.name}`, arr)
			},
			submit(ref) {
				const that = this;
				const form = that.form;
				that.$refs[ref].validate().then(async data => {
					let res;
					if (form._id) res = await that.$api(`/policyfile/${form._id}`, 'POST', data, 'freeLabel');
					else res = await that.$api(`/policyfile`, 'POST', data, 'freeLabel');
					if (res.errcode == '0') {
						uni.showToast({
							title: '添加数据成功',
							icon: 'none'
						})
						uni.navigateBack({
							delta: 1
						})
					} else {
						uni.showToast({
							title: res.errmsg,
							icon: 'none'
						})
					}
				}).catch(err => {
					console.log('err', err);
				})
			}
		}
	}
</script>

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

		.form-item {
			display: flex;
			align-items: center;
		}

		.button {
			background-color: var(--f07CColor);
		}
	}
</style>