feat(work/edit): 流程申请提交

api/work.js

@@ -54,4 +54,36 @@ export function getProcessForm(user, process) {
 			}
 		}
 	})
+}
+
+// 提交流程 表单
+export function submitProcessForm(user, process, fileIds) {
+	console.log('user==[]', user);
+	console.log('process==[]', process);
+	return request({
+		url: preUrl,
+		method: 'post',
+		data: {
+			serviceId: 'bpm_20150325001FlowStart',
+			params: {
+				flow: {
+					staffId: user.useId, // user.useId
+					staffName: user.name,  // user.name
+					gxId: user.gxId, // user.gxId
+					insName: user.name + process.modelName, // user.name + modelName
+					groupId: user.groupid, // user.groupid
+					usesNames: "[]",
+					tmodelId: process.tmodelId, // process.tmodelId
+					modelId: process.modelId, // process.modelId
+					// 附件id 为空时设置值为''
+					fileIds: fileIds.length==0?'':fileIds 
+				},
+				form: {
+					formId: process.formId, // process.formId
+					formElements: process.form
+				},
+				control: '1'
+			}
+		}
+	})
 }

pages/work/edit/index.vue

@@ -1,17 +1,21 @@
 <template>
-	<view>
+	<view class="process_container">
 		<uni-card margin="10px" spacing="0">
-			<uni-forms label-position="left" :label-width="110" :border="true">
+			<uni-forms label-position="left" :label-width="125" :border="true">
 				<uni-forms-item v-for="(item, index) in formElements" :label="item.elementName" :key="index">
-					<uni-easyinput v-if="'多少小时' == item.elementName" :disabled="true" placeholder="请输入内容"
+					<uni-easyinput v-if="'多少小时' == item.elementName" :disabled="true" placeholder=""
 						:value="diffHours"></uni-easyinput>
 					<!-- 输入框 -->
-					<uni-easyinput v-else-if="'0' == item.type" :disabled="'0' == item.canEdit" placeholder="请输入内容"
-						:value="item.defaultValue"></uni-easyinput>
+					<uni-easyinput v-else-if="'0' == item.type" :disabled="'0' == item.canEdit" :placeholder="'0' == item.canEdit?'':'请输入内容'" :value="item.defaultValue"></uni-easyinput>
+					<!-- 富文本输入框 -->
+					<uni-easyinput v-else-if="'1' == item.type" :disabled="'0' == item.canEdit" :placeholder="'0' == item.canEdit?'':'请输入内容'" :value="item.defaultValue" type="textarea"></uni-easyinput>
 					<!-- 下拉框 -->
-					<!-- <uni-data-select v-else-if="'2'==item.type" :disabled="'0'==item.canEdit" placeholder="请选择内容" :value="item.defaultValue || 0" :localdata="item.typeDetail.enum"></uni-data-select> -->
-					<!-- <button @click="openPopup">打开弹窗</button> -->
-					<!-- <uni-popup ref="popup" type="bottom" border-radius="10px 10px 0 0">底部弹出 Popup 自定义圆角</uni-popup> -->
+					<picker class="picker_container" v-else-if="'2' == item.type" @change="bindPickerChange($event, item)" :value="item.defaultValue" :range="formatDict(item.typeDetail.enum)">
+						<view class="uni-input input_text">
+						<!-- 设置默认值为第一个选项 -->
+						{{ item.defaultValue ? item.defaultValue:item.defaultValue = item.typeDetail.enum[0].enumVname }}
+						</view>
+					</picker>
 					<!-- 开始时间选择器 -->
 					<uni-datetime-picker :end="endTime" @change="setTimeRange(item)"
 						v-else-if="timeFlag && '9' == item.type && '开始时间' == item.elementName" v-model="item.defaultValue"
@@ -22,24 +26,16 @@
 						v-else-if="timeFlag && '9' == item.type && '结束时间' == item.elementName" v-model="item.defaultValue"
 						:clear-icon="false" type="datetime" />
 					<!-- 其他时间选择器 -->
+					<!-- 年月日 时分秒 -->
 					<uni-datetime-picker v-else-if="'9' == item.type" v-model="item.defaultValue" type="datetime" />
+					<!-- 年月日 -->
+					<uni-datetime-picker v-else-if="'3' == item.type" v-model="item.defaultValue" type="date" />
 				</uni-forms-item>
 			</uni-forms>
 		</uni-card>
-		<uni-card margin="10px" spacing="0">
-			<uni-list-item>
-				<template v-slot:header>
-					上传附件
-				</template>
-			</uni-list-item>
-			<uni-list-item>
-				<template v-slot:body>
-					<uni-file-picker v-model="fileList" :autoUpload="false" mode="list" limit="5" file-mediatype="all"
-						title="选择文件" @select="handleSelect" @progress="handleProgress"
-						@delete="handleDelete"></uni-file-picker>
-				</template>
-			</uni-list-item>
-			<button type="default" style="background-color: #007aff;color: #ffffff;" @click="submitProcess">提交</button>
+		<uni-card title="上传附件" :extra="`${fileList.length}/5`" margin="10px" spacing="0">
+			<uni-file-picker v-model="fileList" :autoUpload="false" mode="list" limit="5" file-mediatype="all" @select="handleSelect" @progress="handleProgress" @delete="handleDelete"></uni-file-picker>
+			<button :loading="!button_state" type="default" class="submit_button" @click="submitProcess">提交</button>
 		</uni-card>
 	</view>
 </template>
@@ -48,7 +44,9 @@
 import { onMounted, reactive, ref } from 'vue'
 import { onLoad } from '@dcloudio/uni-app'
 import { useUserStore } from '@/store/user.js'
-import { getProcessInfo, getProcessForm } from '@/api/work.js'
+import $modal from '@/plugins/modal.js'
+import $tab from '@/plugins/tab.js'
+import { getProcessInfo, getProcessForm, submitProcessForm } from '@/api/work.js'
 
 let processInfo = reactive({
 	modelName: '流程申请',
@@ -93,6 +91,14 @@ function initProcessInfo() {
 			})
 	})
 }
+// 下拉框
+function bindPickerChange(e, item) {
+	const index = e.detail.value;
+	item.defaultValue = item.typeDetail.enum[index].enumVname
+}
+function formatDict(dict) {
+	return dict.map(({enumVname}) => enumVname)
+}
 
 const formElements = ref([])
 const startEleIndex = ref(0) // 开始时间
@@ -150,16 +156,52 @@ function handleDelete(e) { // 移除文件
 	fileList.value.splice(fileList.value.indexOf(e.tempFiles), 1)
 }
 
+const button_state = ref(true)
 function submitProcess() { // 提交表单
-		// const form = formElements.value.map(({tableField, defaultValue}) => {
-		// 	return { name: tableField, value: defaultValue }
-		// })
-		processInfo.form = formElements.value.map(({tableField, defaultValue}) => {
-			return { name: tableField, value: defaultValue }
-		})
-		console.log('submitProcess', processInfo)
-		console.log('fileList', fileList)
-	}
+	// 禁用提交按钮
+	button_state.value = false
+	// 保存表单数据
+	processInfo.form = formElements.value.map(({tableField, defaultValue}) => {
+		return { name: tableField, value: defaultValue }
+	})
+	console.log('submitProcessForm', processInfo.form);
+	button_state.value = true
+	// submitProcessForm(userStore.user, processInfo, fileList.value).then(res => {
+	// 	console.log('submitProcessForm', res);
+	// 	if (res.returnMsg.includes('提交失败')) {
+	// 		// 启用提交按钮
+	// 		button_state.value = true
+	// 		$modal.msgError(res.returnMsg)
+	// 	} else {
+	// 		$modal.msgSuccess(res.returnMsg)
+	// 		// 返回上一页
+	// 		$tab.navigateBack();
+	// 	}
+	// })
+}
 </script>
 
-<style lang="scss"></style>
+<style lang="scss">
+.process_container {
+	.picker_container {
+		border: 1px solid #e5e5e5;
+		background-color: #fff;
+    border-radius: 4px;
+    // box-sizing: border-box;
+		.input_text{
+			color: #333;
+			font-size: 14px;
+			line-height: 35px;
+			height: 35px;
+			padding: 0 0 0 10px;
+		}
+	}
+	.is-disabled {
+		color: #666 !important;
+	}
+	.submit_button {
+		background-color: #007aff !important;
+		color: #fff !important;
+	}
+}
+</style>