Procházet zdrojové kódy

feat(work/edit): 表单填写数据类型限定

wangpx před 1 rokem
rodič
revize
32fcf526ab
1 změnil soubory, kde provedl 119 přidání a 30 odebrání
  1. 119 30
      pages/work/edit/index.vue

+ 119 - 30
pages/work/edit/index.vue

@@ -8,8 +8,11 @@
 						<uni-forms-item v-if="'0' != elem.canEdit" :label="elem.elementName" :key="index">
 							<uni-easyinput v-if="'多少小时' == elem.elementName" :disabled="true" placeholder=""
 								v-model="diffHours"></uni-easyinput>
+							<uni-easyinput v-else-if="elem.bddzText" :disabled="true" placeholder=""
+								v-model="diffHours"></uni-easyinput>
 							<!-- 输入框 -->
 							<uni-easyinput v-else-if="'0' == elem.type" :disabled="'0' == elem.canEdit"
+								:type="fieldTypeDict[elem.fieldType] || 'text'"
 								:placeholder="'0' == elem.canEdit ? '' : '请输入内容'"
 								v-model="elem.defaultValue"></uni-easyinput>
 							<!-- 富文本输入框 -->
@@ -31,13 +34,14 @@
 								v-else-if="timeFlag && '9' == elem.type && '开始时间' == elem.elementName"
 								v-model="elem.defaultValue" :clear-icon="false" type="datetime" />
 							<!-- 结束时间选择器 -->
-							<uni-datetime-picker :start="startTime" @change="setTimeRange(elem)" :disabled="disableEndTime"
-								:placeholder="disableEndTime ? '请先确认开始时间' : '确认结束时间'"
+							<uni-datetime-picker :start="startTime" @change="setTimeRange(elem)"
+								:disabled="disableEndTime" :placeholder="disableEndTime ? '请先确认开始时间' : '确认结束时间'"
 								v-else-if="timeFlag && '9' == elem.type && '结束时间' == elem.elementName"
 								v-model="elem.defaultValue" :clear-icon="false" type="datetime" />
 							<!-- 其他时间选择器 -->
 							<!-- 年月日 时分秒 -->
-							<uni-datetime-picker v-else-if="'9' == elem.type" v-model="elem.defaultValue" type="datetime" />
+							<uni-datetime-picker v-else-if="'9' == elem.type" v-model="elem.defaultValue"
+								type="datetime" />
 							<!-- 年月日 -->
 							<uni-datetime-picker v-else-if="'3' == elem.type" v-model="elem.defaultValue" type="date" />
 						</uni-forms-item>
@@ -45,14 +49,20 @@
 				</uni-forms>
 			</view>
 		</uni-card>
+		<!-- 重复表单 -->
 		<view v-if="repeatingForm.elementItem.length > 0" class="repeating_table">
 			<uni-card v-for="(table, tableIndex) in repeatingForm.elements" spacing="0" :key="tableIndex">
 				<uni-forms label-position="left" :label-width="125" :border="true">
 					<uni-forms-item v-for="(elem, itemIndex) in table"
 						:label="repeatingForm.elementItem[itemIndex].elementName.slice(3)" :key="itemIndex">
+						<!-- 自定义关联变量 -->
+						<!-- <uni-easyinput v-if="repeatingForm.elementItem[itemIndex].bddzText" :disabled="true"
+							:placeholder="''" :value="computedrepeatingFormItemValue(elem, table)"></uni-easyinput> -->
 						<uni-easyinput v-if="repeatingForm.elementItem[itemIndex].bddzText" :disabled="true"
-							:placeholder="''" :value="computedrepeatingFormItemValue(elem, table)"></uni-easyinput>
-						<uni-easyinput v-else placeholder="请输入内容" v-model="elem.value"></uni-easyinput>
+							:placeholder="''"
+							:value="calculateResult(repeatingForm.elementItem[itemIndex], table, elem)"></uni-easyinput>
+						<uni-easyinput v-else placeholder="请输入内容" v-model="elem.defaultValue"
+							:type="fieldTypeDict[repeatingForm.elementItem[itemIndex].fieldType.value] || 'text'"></uni-easyinput>
 					</uni-forms-item>
 				</uni-forms>
 				<view class="repeating_table_button_container">
@@ -76,7 +86,8 @@
 		</uni-card>
 		<view class="submit_button_container">
 			<uni-card spacing="0" padding="0">
-				<button :disabled="!button_state" :loading="!button_state" type="primary" class="submit_button" @click="submitProcess">提交</button>
+				<button :disabled="!button_state" :loading="!button_state" type="primary" class="submit_button"
+					@click="submitProcess">提交</button>
 			</uni-card>
 		</view>
 	</view>
@@ -91,7 +102,10 @@ import $modal from '@/plugins/modal.js'
 import $tab from '@/plugins/tab.js'
 import { convertToChineseCurrency } from '@/utils/ygoa.js'
 import { getProcessInfo, getProcessForm, submitProcessForm, uploadFile } from '@/api/work.js'
-
+const fieldTypeDict = ref({
+	'0': 'text',
+	'1': 'number'
+})
 let processInfo = reactive({
 	modelName: '流程申请',
 	control: '',
@@ -164,15 +178,19 @@ const repeatingForm = ref({
 })
 const startEleIndex = ref(0) // 开始时间
 const endEleIndex = ref(0) // 结束时间
+// 新增重复表表单
 function addrepeatingFormItem(index) {
+	parseCalculation(repeatingForm.value.elementItem)
 	const table = repeatingForm.value.elementItem.map(({ tableField, bddzText }) => {
 		const item = {
 			name: tableField,
-			value: ""
+			defaultValue: ""
 		}
 		if (bddzText != '') {
 			const mulItem = bddzText.split('*')
+			// 保存关联数据索引
 			item['bddzText'] = mulItem.map(item => {
+				// item['operation '].operands = mulItem.map(item => {
 				return repeatingForm.value.elementItem.findIndex(({ elementName }) => item == elementName)
 			})
 		}
@@ -180,6 +198,80 @@ function addrepeatingFormItem(index) {
 	})
 	repeatingForm.value.elements.splice(index + 1, 0, table)
 }
+// 保存自定义变量运算信息
+function parseCalculation(items) {
+	items.forEach((item, index) => {
+		if (item.bddzText) {
+			const tokens = item.bddzText.match(/[^\*\+\-\/\(\)\s]+|[\*\+\-\/\(\)]/g);
+			if (tokens) {
+				const calculation = { operators: [], variables: [] };
+
+				tokens.forEach(token => {
+					if (/[\*\+\-\/]/.test(token)) {
+						calculation.operators.push(token); // 保存运算符
+					} else if (/[a-zA-Z]+/.test(token)) {
+						// 保存变量的索引
+						const variableIndex = items.findIndex(i => i.elementName === token);
+						if (variableIndex !== -1) {
+							calculation.variables.push(variableIndex);
+						}
+					}
+				});
+
+				// 保存到当前项
+				item.calculation = calculation;
+			}
+		}
+	});
+	return items
+}
+// 计算自定义变量值
+function calculateResult(item, items, valueItem) {
+    // 运算符和变量索引
+    const calculation = item.calculation;
+    let result = 0;
+
+    if (calculation) {
+        // 先处理乘法和除法
+        let operators = [...calculation.operators];
+        let variables = [...calculation.variables];
+
+        // 获取数值(这里使用defaultValue作为值)
+        variables = variables.map(index => items[index].defaultValue);
+
+        let mediateResults = [...variables];
+        console.log('mediateResults (before operations): ', mediateResults);
+
+        // 处理乘法和除法运算
+        for (let i = 0; i < operators.length; i++) {
+            if (operators[i] === "*" || operators[i] === "/") {
+                if (operators[i] === "*") {
+                    mediateResults[i + 1] = mediateResults[i] * mediateResults[i + 1];
+                } else if (operators[i] === "/") {
+                    mediateResults[i + 1] = mediateResults[i] / mediateResults[i + 1];
+                }
+                mediateResults[i] = 0; // 将已计算过的变量清零,防止重复使用
+            }
+        }
+
+        // 再进行加法和减法计算
+        result = mediateResults[0]; // 第一个变量的值
+        console.log('mediateResults (after multiplication/division): ', mediateResults);
+        
+        for (let i = 1; i < mediateResults.length; i++) {
+            if (operators[i - 1] === "+") {
+                result += parseFloat(mediateResults[i]);
+            } else if (operators[i - 1] === "-") {
+                result -= parseFloat(mediateResults[i]);
+            }
+        }
+    }
+
+    // 将计算结果存储到valueItem
+    valueItem.defaultValue = result;
+    return result;
+}
+// 删除重复表表单
 function delrepeatingFormItem(index) {
 	console.log("delrepeatingFormItem: " + index);
 	$modal.confirm('', '确认删除该重复表数据')
@@ -190,9 +282,9 @@ function delrepeatingFormItem(index) {
 function computedrepeatingFormItemValue(item, table) {
 	let res = 1
 	item.bddzText.forEach(itemIndex => {
-		res = res * table[itemIndex].value
+		res = res * table[itemIndex].defaultValue
 	})
-	item.value = res
+	item.defaultValue = res
 	console.log('convertToChineseCurrency', convertToChineseCurrency(res));
 	return res
 }
@@ -228,25 +320,24 @@ function setTimeRange(e) {
 }
 
 const fileList = ref([]) // 文件列表
-const fileSeqs = ref([]) // 文件上传返回 seq 列表
-const filePicker = ref(null)
-// TODO 中间数组缓存将要上传的文件列表 保存上传顺序 上传成功后保存seq后再添加入 实际文件列表渲染
+const fileSeqs = ref([])
 async function handleFileSelect(files) { // 新增文件
-	console.log('handleFileSelect', files.tempFiles)
+	// console.log('handleFileSelect', files.tempFiles)
 	files.tempFiles.forEach(file => {
 		const data = {
 			name: file.name,
 			filePath: file.path,
 		}
-		uploadFile(data) // TODO 改为同步
+		uploadFile(data)
 			.then(res => {
-				fileSeqs.value.push(res.returnParams)
 				file.seq = res.returnParams
+				fileSeqs.value.push({ 'seq': res.returnParams, 'path': file.path })
 				fileList.value.push(file)
+				// console.log('handleFileSelect fileList: ',fileList);
 				// file.seq = res.returnParams
 			})
 			.catch(err => {
-				$modal.msgError('文件' + data.name + '上传失败,请重新上传')
+				$modal.msgError('文件' + data.name + '上传失败,请删除重新上传')
 				switch (err) {
 					case -201:
 						console.log('文件上传失败 未找到该文件');
@@ -255,10 +346,9 @@ async function handleFileSelect(files) { // 新增文件
 						console.log('文件上传失败 返回值不是JSON字符串');
 						break;
 				}
-				// files.tempFiles.filter(item => item.path == file.path)
 			})
 	})
-	console.log('UploadFiles', files.tempFiles);
+	// console.log('UploadFiles', files.tempFiles);
 
 }
 function handleFileProgress(file, progress) {
@@ -271,11 +361,9 @@ function handleFileSuccess(file, res) {
 function handleFileFail(file, err) {
 	// console.log('handleFileFail', file, err);
 }
-function handleFileDelete(file, index) { // 移除文件
-	console.log('handleDelete', file, index)
-	console.log('index', file)
-	fileList.value.splice(fileList.value.indexOf(file.tempFiles), 1)
-	fileSeqs.value.splice(index, 1)
+function handleFileDelete(file) { // 移除文件
+	// console.log('handleDelete', file)
+	fileSeqs.value.splice(fileSeqs.value.findIndex(({ path }) => path == file.tempFilePath))
 }
 
 const button_state = ref(true)
@@ -287,17 +375,16 @@ function submitProcess() { // 提交表单
 		return { name: tableField, value: defaultValue }
 	})
 	repeatingForm.value.elements.forEach((item, index) => {
-		const newItem = item.map(({ name, value }) => {
+		const newItem = item.map(({ name, defaultValue }) => {
 			return {
 				name: name + '_' + (index + 1),
-				value
+				value: defaultValue
 			}
 		})
 		processInfo.form.push(...newItem)
 	})
-	// return
-	submitProcessForm(userStore.user, processInfo, fileSeqs.value).then(res => {
-		console.log('submitProcessForm', res);
+	const seqs = fileSeqs.value.map(({ seq }) => seq)
+	submitProcessForm(userStore.user, processInfo, seqs).then(res => {
 		if (res.returnMsg.includes('提交失败')) {
 			// 启用提交按钮
 			button_state.value = true
@@ -318,6 +405,7 @@ function submitProcess() { // 提交表单
 <style lang="scss">
 .process_container {
 	position: relative;
+
 	.main_container {
 		min-height: 50vh;
 	}
@@ -365,11 +453,12 @@ function submitProcess() { // 提交表单
 		color: #666 !important;
 	}
 
-	.submit_button_container{
+	.submit_button_container {
 		position: sticky;
 		z-index: 10;
 		width: 100%;
 		bottom: 10px;
+
 		.submit_button {
 			background-color: #007aff !important;
 			color: #fff !important;