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.
74 lines
1.6 KiB
74 lines
1.6 KiB
|
|
<template>
|
|
<div class="components-input-demo-presuffix">
|
|
<a-input @click="openModal" placeholder="corn表达式" v-model:value="cron" @change="handleOK">
|
|
<template #prefix>
|
|
<a-icon type="schedule" title="corn控件" />
|
|
</template>
|
|
<template #suffix>
|
|
<a-icon v-if="cron" type="close-circle" @click="handleEmpty" title="清空" />
|
|
</template>
|
|
</a-input>
|
|
<JCronModal ref="innerVueCron" :data="cron" @ok="handleOK"></JCronModal>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import JCronModal from './cron-antd.vue';
|
|
export default {
|
|
name: 'vCron',
|
|
components: {
|
|
JCronModal,
|
|
},
|
|
props: {
|
|
value: {
|
|
required: false,
|
|
type: String,
|
|
default: () => {
|
|
return '0 * * * * ? *';
|
|
},
|
|
},
|
|
},
|
|
data() {
|
|
return {
|
|
cron: this.value,
|
|
};
|
|
},
|
|
watch: {
|
|
value(val) {
|
|
this.cron = val;
|
|
},
|
|
},
|
|
methods: {
|
|
openModal() {
|
|
this.$refs.innerVueCron.show();
|
|
},
|
|
handleOK(val) {
|
|
if(typeof(val) !== 'string') return ;
|
|
this.cron = val;
|
|
this.$emit('change', this.cron);
|
|
//this.$emit("change", Object.assign({}, this.cron));
|
|
},
|
|
handleEmpty() {
|
|
this.handleOK('');
|
|
},
|
|
},
|
|
model: {
|
|
prop: 'value',
|
|
event: 'change',
|
|
},
|
|
};
|
|
</script>
|
|
<style scoped>
|
|
.components-input-demo-presuffix .anticon-close-circle {
|
|
cursor: pointer;
|
|
color: #ccc;
|
|
transition: color 0.3s;
|
|
font-size: 12px;
|
|
}
|
|
.components-input-demo-presuffix .anticon-close-circle:hover {
|
|
color: #f5222d;
|
|
}
|
|
.components-input-demo-presuffix .anticon-close-circle:active {
|
|
color: #666;
|
|
}
|
|
</style>
|