im-uniapp/pages/workbench/project/add.vue

<template>
	<view class="add-project-container">
		<uni-forms ref="form" :model="form" label-width="100" class="form-box">
			<uni-forms-item label="项目名称" name="projectName" required>
				<uni-easyinput v-model="form.projectName" placeholder="请输入项目名称" />
			</uni-forms-item>
			<uni-forms-item label="项目编号" name="projectNum" required>
				<uni-easyinput v-model="form.projectNum" placeholder="请输入项目编号" />
			</uni-forms-item>
			<uni-forms-item label="项目类型" name="projectType" required>
				<oa-dict-select v-model="form.projectType" dict-type="sys_project_type" placeholder="请选择项目类型" />
			</uni-forms-item>
			<uni-forms-item label="贸易类型" name="tradeType" required>
				<uni-data-select v-model="form.tradeType" :localdata="tradeTypeList" placeholder="请选择贸易类型" />
			</uni-forms-item>
			<uni-forms-item label="代号类型" name="projectCode" required>
				<oa-dict-select v-model="form.projectCode" dict-type="sys_project_code" placeholder="请选择代号类型" />
			</uni-forms-item>
			<uni-forms-item label="优先级" name="projectGrade" required>
				<oa-dict-select v-model="form.projectGrade" dict-type="sys_sort_grade" placeholder="请选择优先级" />
			</uni-forms-item>
			<uni-forms-item label="负责人" name="functionary" required>
				<uni-easyinput v-model="form.functionary" placeholder="请输入负责人" />
			</uni-forms-item>
			<uni-forms-item label="项目地址" name="address">
				<uni-easyinput v-model="form.address" placeholder="请输入项目地址" />
			</uni-forms-item>
			<uni-forms-item label="项目总金额" name="funds" required>
				<uni-easyinput v-model="form.funds" placeholder="请输入项目总金额" type="number" />
			</uni-forms-item>
			<uni-forms-item label="交货期" name="delivery" required>
				<uni-easyinput v-model="form.delivery" placeholder="请输入交货期" />
			</uni-forms-item>
			<uni-forms-item label="项目周期" name="period" required>
				<uni-datetime-picker v-model="form.period" type="daterange" rangeSeparator="至" start-placeholder="开始日期"
					end-placeholder="结束日期" />
			</uni-forms-item>
			<uni-forms-item label="质保期" name="guarantee">
				<uni-easyinput v-model="form.guarantee" placeholder="请输入质保期" />
			</uni-forms-item>
			<uni-forms-item label="预付款" name="prePay">
				<uni-easyinput v-model="form.prePay" placeholder="请输入预付款" type="number" />
			</uni-forms-item>
			<uni-forms-item label="项目介绍" name="introduction">
				<uni-easyinput v-model="form.introduction" type="textarea" placeholder="请输入项目介绍" />
			</uni-forms-item>
			<uni-forms-item label="备注" name="remark">
				<uni-easyinput v-model="form.remark" type="textarea" placeholder="请输入备注" />
			</uni-forms-item>
			<!-- <uni-forms-item label="附件" name="accessory">
				<uni-file-picker v-model="form.accessory" file-extname=".jpg,.png,.pdf,.doc,.docx" :limit="5" />
			</uni-forms-item> -->
			<view class="form-actions">
				<button type="primary" @click="submitForm">保存</button>
			</view>
		</uni-forms>
	</view>
</template>

<script>
	import { addProject } from '@/api/oa/project';
	
export default {
	data() {
		return {
			form: {
				projectName: '',
				projectNum: '',
				projectType: '',
				tradeType: '',
				projectCode: '',
				projectGrade: '',
				functionary: '',
				address: '',
				funds: '',
				delivery: '',
				period: [],
				guarantee: '',
				prePay: '',
				introduction: '',
				remark: '',
				accessory: []
			},
			tradeTypeList: [
				{ value: 0, text: '内贸' },
				{ value: 1, text: '外贸' }
				// TODO: 替换为实际字典数据
			],
			projectGradeList: [
				{ value: 'high', text: '高' },
				{ value: 'middle', text: '中' },
				{ value: 'low', text: '低' }
			]
		}
	},
	methods: {
		submitForm() {
			// 校验并提交表单
			this.$refs.form.validate().then(res => {
				if (res) {
					// TODO: 调用新增项目API
					console.log(res);
					const payload = {
						...res,
						beginTime: res.period[0] + ' 00:00:00',
						finishTime: res.period[1] + ' 00:00:00',
						accessory: ''
					}
					addProject(payload).then(_ => {
						uni.showToast({ title: '保存成功', icon: 'success' });
						uni.navigateBack()
					})
					
				}
			}).catch(() => {
				uni.showToast({ title: '请完善信息', icon: 'none' });
			});
		}
	}
}
</script>

<style scoped>
.add-project-container {
	padding: 24rpx;
}

.form-box {
	background: #fff;
	border-radius: 16rpx;
	padding: 32rpx;
	box-shadow: 0 2rpx 12rpx #eee;
}

.form-actions {
	margin-top: 32rpx;
	text-align: center;
}
</style>