You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

105 lines
2.3 KiB

<script setup lang="tsx">
import { Form, FormSchema } from '@/components/Form'
import { useForm } from '@/hooks/web/useForm'
import { PropType,ref,reactive, watch } from 'vue'
import { useValidator } from '@/hooks/web/useValidator'
import { ElDialog } from 'element-plus'ss
import {vue3CronPlus} from '@/views/vue3-cron-plus/index'
const { required } = useValidator()
const props = defineProps({
currentRow: {
type: Object as PropType<any>,
default: () => null
}
})
let showCron = ref(false);
let NewCornData = "";//当前最新的corn语句的定义
const formSchema = reactive<FormSchema[]>([
{
field: 'cron',
label: '定时器信息',
component: 'Input',
colProps: {
span: 24
},
componentProps:{
value:"",
on:{
click:()=>{
NewCornData = formSchema[0].value;
showCron.value = true;
}
}
}
},
])
const rules = reactive({
cron:[required()],
})
const { formRegister, formMethods } = useForm()
const { setValues,getFormData, getElFormExpose } = formMethods
const submit = async () => {
const elForm = await getElFormExpose()
const valid = await elForm?.validate().catch((err) => {
console.log(err)
})
if (valid) {
const formData = await getFormData();
formData.cron = formSchema[0].value;
return formData
}
}
watch(
() => props.currentRow,
(currentRow) => {
if (!currentRow) return
setValues(currentRow)
},
{
deep: true,
immediate: true
}
)
//修改定时器的信息
const changeCron = (corn)=>{
formSchema[0].value = corn.toString();
formSchema[0].componentProps.value = corn.toString();
if(formSchema[0].value != '[object Event]'){
NewCornData = formSchema[0].value
}
}
const closeDialog = ()=>{
if(NewCornData != formSchema[0].value){
formSchema[0].value = NewCornData;
formSchema[0].componentProps.value = NewCornData;
}
showCron.value = false;
}
defineExpose({
submit
})
</script>
<template>
<Form :rules="rules" @register="formRegister" :schema="formSchema" />
<ElDialog v-model="showCron">
<vue3CronPlus
i18n="cn"
@change="changeCron"
@close="closeDialog"
max-height="300px"
/>
</ElDialog>
</template>
<style scoped>
.vue3-cron-plus-container>>>.language{
top:40px !important;
}
</style>