feat: 加入查看子表单 50%

src/api/flow/formtemplate.ts

@@ -43,9 +43,9 @@ function formTemplateDeleteApi(data: any): AxiosPromise {
 	})
 }
 
-function formTemplateDetailApi(): AxiosPromise {
+function formTemplateDetailApi(id: any): AxiosPromise {
 	return request({
-		url: api.getOneDetail,
+		url: `${api.getOneDetail}?id=${id}`,
 		method: 'get'
 	})
 }

src/components/scWorkflow/nodes/approver.vue

@@ -146,9 +146,9 @@
 										<div class="tags-list inline">
 											<el-tag v-for="(user, index) in form.actionUrl" :key="user.id" closable @close="delFormTemplate(index)">{{ user.name }}</el-tag>
 										</div>
-										<div class="tags-list inline" v-if="form.actionUrl.length">
-											<el-link @click.stop="showFormEv" :underline="false">
-												查看表单<el-icon class="el-icon--right"><View /></el-icon>
+										<div v-if="form.actionUrl.length" class="tags-list inline">
+											<el-link :underline="false" @click.stop="showFormEv">
+												表单预览<el-icon class="el-icon--right"><View /></el-icon>
 											</el-link>
 										</div>
 									</div>
@@ -195,10 +195,14 @@
 				</el-footer>
 			</el-container>
 		</el-drawer>
+
+		<!-- 预览子表单 -->
+		<form-detail ref="formDetail" v-model="visibleFormDetail" v-if="visibleFormDetail" :template-id="templateId"></form-detail>
 	</div>
 </template>
 
 <script>
+import FormDetail from './formDetail'
 import addNode from './addNode'
 // import { Plus } from '@element-plus/icons-vue'
 import { mapState } from 'pinia' //引入映射函数
@@ -216,7 +220,8 @@ import {
 import { ElMessage } from 'element-plus'
 export default {
 	components: {
-		addNode
+		addNode,
+		FormDetail
 	},
 	inject: ['select'],
 	props: {
@@ -239,7 +244,9 @@ export default {
 			selectModeOptions,
 			examineModeOptions,
 			directorModeOptions,
-			approveSelfOptions
+			approveSelfOptions,
+			visibleFormDetail: false,
+			templateId: ''
 		}
 	},
 	computed: {
@@ -391,7 +398,8 @@ export default {
 			}*/
 		},
 		showFormEv() {
-
+			this.templateId = this.form.actionUrl[0].id
+			this.visibleFormDetail = !this.visibleFormDetail
 		}
 	}
 }

src/components/scWorkflow/nodes/formDetail.vue

@@ -0,0 +1,71 @@
+<template>
+	<el-dialog v-model="visibleDialog" title="表单详情" @close="handleCancel" style="z-index: 99">
+		<div>
+			<er-form-preview ref="EReditorRef" :file-upload-u-r-i="uploadFileApi" :is-show-complete-button="false" />
+		</div>
+	</el-dialog>
+</template>
+
+<script setup>
+import { computed, ref } from 'vue'
+import formTemplate from '@/api/flow/formtemplate'
+import { erFormPreview } from '@ER/formEditor'
+
+// 同步值
+const $myEmit = defineEmits(['update:modelValue'])
+
+const myProps = defineProps({
+	modelValue: {
+		type: Boolean,
+		default: false
+	},
+	templateId: {
+		type: String,
+		default: null
+	}
+})
+
+const formOptions = ref({})
+const EReditorRef = ref()
+const { VITE_APP_BASE_API } = import.meta.env
+const uploadFileApi = ref(`${VITE_APP_BASE_API}/v1/oss/upload`)
+
+const handleCancel = () => {
+	$myEmit('update:modelValue', false)
+}
+
+const getMessageInfoDetail = async () => {
+	const { templateId } = myProps
+	const res = await formTemplate.formTemplateDetailApi(templateId)
+	// EReditorRef.value.setData(newFormStructure, formData)
+	console.log(res)
+	// formOptions.value = res.content
+}
+
+getMessageInfoDetail()
+
+// computed
+const visibleDialog = computed({
+	get() {
+		return myProps.modelValue
+	},
+	set(val) {
+		$myEmit('update:modelValue', val)
+	}
+})
+</script>
+
+<style scoped lang="scss">
+.content-title {
+	overflow: hidden;
+	color: #000000d9;
+	font-weight: 500;
+	font-size: 16px;
+	white-space: nowrap;
+	text-overflow: ellipsis;
+	margin-bottom: 20px;
+	&.mbt20 {
+		margin-top: 20px;
+	}
+}
+</style>