iailab-plat-ui-vue3.git

houzhongjian

2024-12-05 2717813966ced88c6a1635663dd01b502158a1b8

提交 \| 用户 \| 时间
2f0aa4	1	<template>
潘	2	<Dialog v-model="dialogVisible" :title="dialogTitle" width="50%">
	3	<el-form
	4	ref="formRef"
	5	v-loading="formLoading"
	6	:model="formData"
	7	:rules="formRules"
	8	label-width="120px"
	9	>
	10	<el-row>
	11	<el-col :span="12">
6badb7	12	<el-form-item label="方案编号" prop="code">
aed420	13	<el-input v-model="formData.code" placeholder="请输入方案编号"/>
2f0aa4	14	</el-form-item>
潘	15	</el-col>
	16	<el-col :span="12">
6badb7	17	<el-form-item label="方案名称" prop="name">
aed420	18	<el-input v-model="formData.name" placeholder="请输入方案名称"/>
2f0aa4	19	</el-form-item>
潘	20	</el-col>
	21	</el-row>
	22	<el-row>
	23	<el-col :span="12">
6badb7	24	<el-form-item label="触发方式" prop="triggerMethod">
潘	25	<el-select v-model="formData.triggerMethod" placeholder="请选择">
2f0aa4	26	<el-option
aed420	27	v-for="dict in getDictOptions(DICT_TYPE.SCHE_TRIGGER_METHOD)"
2f0aa4	28	:key="dict.value"
潘	29	:label="dict.label"
	30	:value="dict.value"
	31	/>
	32	</el-select>
6badb7	33	</el-form-item>
潘	34	</el-col>
	35	<el-col :span="12">
	36	<el-form-item label="触发条件" prop="triggerCondition">
aed420	37	<el-input v-model="formData.triggerCondition" placeholder="请输入触发条件"/>
6badb7	38	</el-form-item>
潘	39	</el-col>
	40	</el-row>
	41	<el-row>
	42	<el-col :span="12">
	43	<el-form-item label="调整对象" prop="scheduleObj">
aed420	44	<el-input v-model="formData.scheduleObj" placeholder="请输入调整对象"/>
6badb7	45	</el-form-item>
潘	46	</el-col>
	47	<el-col :span="12">
	48	<el-form-item label="调整类型" prop="scheduleType">
aed420	49	<el-input v-model="formData.scheduleType" placeholder="请输入调整类型"/>
6badb7	50	</el-form-item>
潘	51	</el-col>
	52	</el-row>
	53	<el-row>
	54	<el-col :span="12">
	55	<el-form-item label="调整策略" prop="scheduleStrategy">
aed420	56	<el-input v-model="formData.scheduleStrategy" placeholder="请输入调整策略 "/>
6badb7	57	</el-form-item>
潘	58	</el-col>
	59	<el-col :span="12">
	60	<el-form-item label="调度模型" prop="modelId">
	61	<el-select v-model="formData.modelId" clearable placeholder="请选择调度模型">
2f0aa4	62	<el-option
6badb7	63	v-for="item in scheduleModelList"
潘	64	:key="item.id"
	65	:label="item.modelName"
2f0aa4	66	:value="item.id"
6badb7	67	/>
2f0aa4	68	</el-select>
潘	69
6badb7	70	</el-form-item>
潘	71	</el-col>
	72	</el-row>
	73	<el-row>
aed420	74	<el-col :span="12">
22bece	75	<el-form-item label="关联项目" prop="mpkprojectid">
aed420	76	<el-select v-model="formData.mpkprojectid" placeholder="请选择">
潘	77	<el-option
	78	v-for="item in mpkProjectList"
	79	:key="item.id"
	80	:label="item.projectName"
	81	:value="item.id"/>
	82	</el-select>
	83	</el-form-item>
	84	</el-col>
	85	</el-row>
	86	<el-row>
6badb7	87	<el-col :span="24">
潘	88	<el-form-item label="备注" prop="remark">
aed420	89	<el-input v-model="formData.remark" placeholder="请输入备注" type="textarea"
潘	90	maxlength="100"
6badb7	91	show-word-limit/>
潘	92	</el-form-item>
	93	</el-col>
	94	</el-row>
2f0aa4	95	</el-form>
潘	96	<template #footer>
	97	<el-button :disabled="formLoading" type="primary" @click="submitForm">确定</el-button>
	98	<el-button @click="dialogVisible = false">取消</el-button>
	99	</template>
	100	</Dialog>
	101	</template>
	102	<script lang="ts" setup>
aed420	103	import {DICT_TYPE, getDictOptions} from '@/utils/dict'
潘	104	import * as ScheduleSchemeApi from '@/api/model/sche/scheme'
	105	import {CommonStatusEnum} from '@/utils/constants'
	106	import * as ScheduleModelApi from "@/api/model/sche/model";
	107	import * as ProjectApi from '@/api/model/mpk/project'
2f0aa4	108
aed420	109	defineOptions({name: 'ScheduleSchemeForm'})
2f0aa4	110
aed420	111	const {t} = useI18n() // 国际化
潘	112	const message = useMessage() // 消息弹窗
	113	const dialogVisible = ref(false) // 弹窗的是否展示
	114	const dialogTitle = ref('') // 弹窗的标题
	115	const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
	116	const formType = ref('') // 表单的类型：create - 新增；update - 修改
	117	const formData = ref({
	118	id: undefined,
	119	code: undefined,
	120	name: undefined,
	121	triggerMethod: undefined,
	122	triggerCondition: undefined,
	123	scheduleObj: undefined,
	124	scheduleType: undefined,
	125	scheduleStrategy: undefined,
	126	modelId: undefined,
	127	scheduleTime: undefined,
	128	remark: undefined,
	129	status: 0,
	130	mpkprojectid: undefined,
	131	})
	132	const formRules = reactive({
	133	code: [{required: true, message: '编号不能为空', trigger: 'blur'}],
	134	name: [{required: true, message: '名称不能为空', trigger: 'blur'}],
	135	triggerMethod: [{required: true, message: '触发方式不能为空', trigger: 'blur'}],
	136	triggerCondition: [{required: true, message: '触发条件不能为空', trigger: 'blur'}],
	137	modelId: [{required: true, message: '调度模型不能为空', trigger: 'blur'}],
	138	triggerCondition: [{required: true, message: '触发条件不能为空', trigger: 'blur'}],
22bece	139	mpkprojectid: [{required: true, message: '关联项目不能为空', trigger: 'blur'}],
aed420	140	})
潘	141	const formRef = ref() // 表单 Ref
	142	const scheduleModelList = ref([] as ScheduleModelApi.ScheduleModelVO[])
	143	const mpkProjectList = ref([])
	144	const addRow = function (index, rows) {
	145	let row = JSON.parse(JSON.stringify(rows[index]))
	146	rows.splice(index, 0, row)
	147	this.orderRow(rows)
	148	}
	149
	150	const deleteRow = function (index, rows) {
	151	if (!rows \|\| rows.length === 1) {
	152	message.error('不能全部删除！')
	153	return
	154	}
	155	rows.splice(index, 1)
	156	this.orderRow(rows)
	157	}
	158
	159	const orderRow = function (rows) {
	160	let modelparamorder = 0
	161	let modelparamportorder = 0
	162	rows.forEach(function (value) {
	163	if (value.modelparamportorder !== modelparamportorder) {
	164	modelparamportorder = value.modelparamportorder
	165	modelparamorder = 1
	166	}
	167	value.modelparamorder = modelparamorder
	168	modelparamorder++
	169	})
	170	}
	171
	172	/** 打开弹窗 */
	173	const open = async (type: string, id?: number) => {
	174	dialogVisible.value = true
	175	dialogTitle.value = t('action.' + type)
	176	formType.value = type
	177	resetForm()
	178	// 修改时，设置数据
	179	if (id) {
	180	formLoading.value = true
	181	try {
	182	formData.value = await ScheduleSchemeApi.getScheduleScheme(id)
	183	} finally {
	184	formLoading.value = false
	185	}
	186	}
	187	// 加载调度模型列表
	188	scheduleModelList.value = await ScheduleModelApi.getScheduleModelList()
	189
	190	// 获取mpk项目列表
	191	mpkProjectList.value = await ProjectApi.list()
	192	}
	193	defineExpose({open}) // 提供 open 方法，用于打开弹窗
	194
	195	/** 提交表单 */
	196	const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
	197	const submitForm = async () => {
	198	// 校验表单
	199	if (!formRef) return
	200	const valid = await formRef.value.validate()
	201	if (!valid) return
	202	// 提交请求
	203	formLoading.value = true
	204	try {
	205	const data = formData.value as unknown as ScheduleSchemeApi.ScheduleSchemeVO
	206	if (formType.value === 'create') {
	207	await ScheduleSchemeApi.createScheduleScheme(data)
	208	message.success(t('common.createSuccess'))
	209	} else {
	210	await ScheduleSchemeApi.updateScheduleScheme(data)
	211	message.success(t('common.updateSuccess'))
	212	}
	213	dialogVisible.value = false
	214	// 发送操作成功的事件
	215	emit('success')
	216	} finally {
	217	formLoading.value = false
	218	}
	219	}
	220
	221	/** 重置表单 */
	222	const resetForm = () => {
	223	formData.value = {
2f0aa4	224	id: undefined,
潘	225	code: undefined,
	226	name: undefined,
	227	triggerMethod: undefined,
	228	triggerCondition: undefined,
	229	scheduleObj: undefined,
	230	scheduleType: undefined,
	231	scheduleStrategy: undefined,
	232	modelId: undefined,
	233	scheduleTime: undefined,
	234	remark: undefined,
aed420	235	status: CommonStatusEnum.ENABLE,
潘	236	mpkprojectid: undefined
2f0aa4	237	}
aed420	238	formRef.value?.resetFields()
潘	239	}
2f0aa4	240	</script>