111 lines
2.3 KiB
Vue
111 lines
2.3 KiB
Vue
<template>
|
|
<div class="pre-registration-form">
|
|
<el-form
|
|
ref="formRef"
|
|
:model="formData"
|
|
:rules="formRules"
|
|
label-width="auto"
|
|
label-position="top"
|
|
>
|
|
<el-form-item label="任务类型" prop="task_type">
|
|
<!-- <el-input v-model="formData.task_type" placeholder="请输入" />-->
|
|
<el-select v-model="formData.task_type" placeholder="请选择">
|
|
<el-option label="检查登录" value="check_login" />
|
|
<el-option label="招聘" value="boss_recruit" />
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="任务参数" prop="params">
|
|
<el-input v-model="formData.params" placeholder="请输入" />
|
|
</el-form-item>
|
|
</el-form>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { ElMessage } from 'element-plus'
|
|
import { deepCloneByJSON } from '@/utils/auxiliaryFunction'
|
|
|
|
const props = defineProps({
|
|
newData: {
|
|
type: Object,
|
|
default: () => ({})
|
|
}
|
|
})
|
|
|
|
const formRef = ref()
|
|
// 表单数据
|
|
const formData = reactive<any>({
|
|
task_type: '',
|
|
worker_id: '',
|
|
account_name: '',
|
|
params: ''
|
|
})
|
|
const formRules = reactive<any>({
|
|
task_type: [{ required: true, message: '请输入', trigger: 'blur' }],
|
|
params: [{ required: true, message: '请输入', trigger: 'blur' }]
|
|
})
|
|
|
|
onMounted(() => {
|
|
setFormData(props.newData)
|
|
})
|
|
|
|
const getForm = () => {
|
|
return formData
|
|
}
|
|
|
|
const setFormData = (data: any) => {
|
|
if (data && Object.keys(data).length > 0) {
|
|
const data1 = deepCloneByJSON(data)
|
|
|
|
Object.assign(formData, data1)
|
|
}
|
|
}
|
|
|
|
const submit = (): Promise<boolean> => {
|
|
return new Promise((resolve, reject) => {
|
|
formRef.value?.validate((valid: boolean) => {
|
|
if (valid) {
|
|
resolve(true)
|
|
} else {
|
|
ElMessage.error('请完善必填信息')
|
|
reject(false)
|
|
}
|
|
})
|
|
})
|
|
}
|
|
defineExpose({
|
|
submit,
|
|
getForm
|
|
})
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.pre-registration-form {
|
|
width: 100%;
|
|
padding-right: 20px;
|
|
overflow: hidden;
|
|
overflow-y: auto;
|
|
&::-webkit-scrollbar {
|
|
width: 6px;
|
|
}
|
|
|
|
&::-webkit-scrollbar-track {
|
|
background: transparent;
|
|
}
|
|
|
|
&::-webkit-scrollbar-thumb {
|
|
background: rgba(0, 0, 0, 0.3);
|
|
border-radius: 3px;
|
|
}
|
|
|
|
&::-webkit-scrollbar-thumb:hover {
|
|
background: rgba(0, 0, 0, 0.5);
|
|
}
|
|
}
|
|
.section {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 20px;
|
|
}
|
|
</style>
|