AiDOPWarehouse/Admin.NET/Admin.NET.Web.Entry/wwwroot/Template/editDialog.vue.vm

<template>
	<div class="@(@Model.ClassName)-container">
		<el-dialog
		v-model="isShowDialog"
		:title="title"
		:width="700"
		draggable>
			<el-form :model="ruleForm" ref="ruleFormRef" size="default" label-width="100px" :rules="rules">
				<el-row :gutter="35">
					@foreach (var column in Model.TableField){
					if(@column.ColumnKey == "True"){
					@:<el-form-item v-show="false"><el-input v-model="ruleForm.@(@column.ColumnName)" /></el-form-item>
					}else{
					if (@column.WhetherAddUpdate == "Y"){
					if(@column.EffectType == "fk"){
					@:<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
						@:<el-form-item label="@column.ColumnComment">
							@:<el-select clearable= v-model="ruleForm.@(@column.ColumnName)" placeholder="请选择@(@column.ColumnComment)">
								@:<el-select-option v-for="(item,index) in get@(@column.FkEntityName)DropdownList" :key="index" :value="item.code">{{ item.name }}</el-select-option>
								@:</el-select>
							@:</el-form-item>
						@:</el-col>
					}else if(@column.EffectType == "Input"){
					@:<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
						@:<el-form-item label="@column.ColumnComment">
							@:<el-input v-model="ruleForm.@(@column.ColumnName)" placeholder="ruleForm.@(@column.ColumnName)" clearable/>
						@:</el-form-item>
					@:</el-col>
					}else if(@column.EffectType == "InputNumber"){
					@:<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
						@:<el-form-item label="@column.ColumnComment">
							@:<el-input-number v-model="ruleForm.@(@column.ColumnName)" placeholder="ruleForm.@(@column.ColumnName)" clearable/>
						@:</el-form-item>
					@:</el-col>
					}else if(@column.EffectType == "InputTextArea"){
					@:<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
						@:<el-form-item label="@column.ColumnComment">
							@:<el-input v-model="ruleForm.@(@column.ColumnName)" placeholder="ruleForm.@(@column.ColumnName)" type="textarea" clearable/>
						@:</el-form-item>
					@:</el-col>
					}else if(@column.EffectType == "Select"){
					@:<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
						@:<el-form-item label="@column.ColumnComment">
							@:<el-select clearable v-model="ruleForm.@(@column.ColumnName)" placeholder="请选择@(@column.ColumnComment)">
								@:<el-select-option v-for="(item,index) in getDictDataDropdownList('@(@column.DictTypeCode)')" :key="index" :value="item.value">{{ item.label }}</el-select-option>
							@:</el-select>
						@:</el-form-item>
					@:</el-col>
					}else if(@column.EffectType == "ConstSelector"){
					@:<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
						@:<el-form-item label="@column.ColumnComment">
							@:<el-select clearable="" v-model="ruleForm.@(@column.ColumnName)" placeholder="请选择@(@column.ColumnComment)">
								@:<el-select-option v-for="(item,index) in getSelectorList('@(@column.DictTypeCode)')" :key="index" :value="item.code">{{ item.name }}</el-select-option>
								@:</el-select>
							@:</el-form-item>
						@:</el-col>
					}else if(@column.EffectType == "Switch"){				
					@:<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
						@:<el-form-item label="@column.ColumnComment">
							@:<el-switch v-model="ruleForm.@(@column.ColumnName)" active-text="是" inactive-text="否" />
						@:</el-form-item>
					@:</el-col>
					}else if(@column.EffectType == "DatePicker"){
					@:<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
						@:<el-form-item label="@column.ColumnComment">
							@:<el-date-picker v-model="ruleForm.@(@column.ColumnName)" type="datetime" placeholder="@column.ColumnComment"  />
						@:</el-form-item>
					@:</el-col>
					}else if(@column.EffectType == "Upload"){
					
					}else{

					}
					}
					}
					}
						</el-row>
					</el-form>
					<template #footer>
						<span class="dialog-footer">
							<el-button @@click="cancel" size="default">取 消</el-button>
							<el-button type="primary" @@click="submit" size="default">确 定</el-button>
						</span>
					</template>
		</el-dialog>	
	</div>
</template>

<script lang="ts">
	import { ref, toRefs, reactive, onMounted, defineComponent, getCurrentInstance, onUnmounted } from 'vue';
	import { ElMessageBox, ElMessage } from 'element-plus';
	import { auth } from '/@@/utils/authFunction';
	import { formatDate } from '/@@/utils/formatTime';
	import type { FormInstance, FormRules } from 'element-plus'

	@foreach (var column in Model.TableField){
	if(@column.EffectType == "fk"){
	@:import { get@(@column.FkEntityName)Dropdown } from '/@@/api/main/@(@Model.ClassName)';
	}
	}
	@foreach (var column in Model.TableField){
	if(@column.EffectType == "Select"){
	@:import { getDictDataDropdown } from '/@@/api/system/admin';
	}
	}

	export default defineComponent({
	name: 'edit@(@Model.ClassName)',
	props: {
	title: {
	type: String,
	default: '',
	},
	},
	setup() {
	const { proxy } = getCurrentInstance() as any;
	const ruleFormRef = ref();
	const state = reactive({
	isShowDialog: false,
	ruleForm: {} as any,
	});

	const rules = reactive<FormRules>({
	@foreach (var column in Model.TableField){
		if(@column.WhetherRequired == "Y"){
			if(@column.EffectType == "Input" || @column.EffectType == "InputNumber" ||@column.EffectType == "InputTextArea"){
			@:@column.ColumnName: [{required: true, message: '请输入@(@column.ColumnComment)！', trigger: 'blur',},],
			}else if(@column.EffectType == "DatePicker" || @column.EffectType == "Select" ||@column.EffectType == "ApiTreeSelect"){
			@:@column.ColumnName: [{required: true, message: '请选择@(@column.ColumnComment)！', trigger: 'change',},],
			}
		}
	}
	});

	// 打开弹窗
	const openDialog = (row: any) => {
	state.ruleForm = row;
	state.isShowDialog = true;
	};

	// 关闭弹窗
	const closeDialog = () => {
	proxy.mittBus.emit('submitRefresh');
	state.isShowDialog = false;
	};

	// 取消
	const cancel = () => {
	state.isShowDialog = false;
	};

	// 提交
	const submit = () => {
	ruleFormRef.value.validate(async (valid: boolean) => {
	if (!valid) return;
	if (state.ruleForm.id != undefined && state.ruleForm.id > 0) {
	await update@(@Model.ClassName)(values);
	} else {
	await add@(@Model.ClassName)(state.ruleForm);
	}
	closeDialog();
	});
	};

	@foreach (var column in Model.QueryWhetherList){
	if(@column.EffectType == "fk"){
	@:const get@(@column.FkEntityName)DropdownList = await () => {
	@:let list = await get@(@column.FkEntityName)Dropdown();
	@:return list.data.result ?? [];
	@:};
	break;
	}
	}

	@foreach (var column in Model.TableField){
	if(@column.EffectType == "Select"){
	@:const getDictDataDropdownList = await (val: any) => {
	@:let list = await getDictDataDropdownList(val);
	@:return list.data.result ?? [];
	@:};
	break;
	}
	}
	return {
	@foreach (var column in Model.TableField){
	if(@column.EffectType == "fk"){
	@:get@(@column.FkEntityName)DropdownList,
	break;
	}
	}
	@foreach (var column in Model.TableField){
	if(@column.EffectType == "Select"){
	@:getDictDataDropdownList,
	break;
	}
	}
	ruleFormRef,
	openDialog,
	closeDialog,
	cancel,
	submit,
	...toRefs(state),
	rules,
	};
	}
	})

	}
</script>