|
|
@ -2,66 +2,31 @@ |
|
|
|
<div> |
|
|
|
<el-tabs type="border-card"> |
|
|
|
<el-tab-pane label="秒" v-if="shouldHide('second')"> |
|
|
|
<CrontabSecond |
|
|
|
@update="updateCrontabValue" |
|
|
|
:check="checkNumber" |
|
|
|
:cron="crontabValueObj" |
|
|
|
ref="cronsecond" |
|
|
|
/> |
|
|
|
<CrontabSecond @update="updateCrontabValue" :check="checkNumber" :cron="crontabValueObj" ref="cronsecond" /> |
|
|
|
</el-tab-pane> |
|
|
|
|
|
|
|
<el-tab-pane label="分钟" v-if="shouldHide('min')"> |
|
|
|
<CrontabMin |
|
|
|
@update="updateCrontabValue" |
|
|
|
:check="checkNumber" |
|
|
|
:cron="crontabValueObj" |
|
|
|
ref="cronmin" |
|
|
|
/> |
|
|
|
<CrontabMin @update="updateCrontabValue" :check="checkNumber" :cron="crontabValueObj" ref="cronmin" /> |
|
|
|
</el-tab-pane> |
|
|
|
|
|
|
|
<el-tab-pane label="小时" v-if="shouldHide('hour')"> |
|
|
|
<CrontabHour |
|
|
|
@update="updateCrontabValue" |
|
|
|
:check="checkNumber" |
|
|
|
:cron="crontabValueObj" |
|
|
|
ref="cronhour" |
|
|
|
/> |
|
|
|
<CrontabHour @update="updateCrontabValue" :check="checkNumber" :cron="crontabValueObj" ref="cronhour" /> |
|
|
|
</el-tab-pane> |
|
|
|
|
|
|
|
<el-tab-pane label="日" v-if="shouldHide('day')"> |
|
|
|
<CrontabDay |
|
|
|
@update="updateCrontabValue" |
|
|
|
:check="checkNumber" |
|
|
|
:cron="crontabValueObj" |
|
|
|
ref="cronday" |
|
|
|
/> |
|
|
|
<CrontabDay @update="updateCrontabValue" :check="checkNumber" :cron="crontabValueObj" ref="cronday" /> |
|
|
|
</el-tab-pane> |
|
|
|
|
|
|
|
<el-tab-pane label="月" v-if="shouldHide('month')"> |
|
|
|
<CrontabMonth |
|
|
|
@update="updateCrontabValue" |
|
|
|
:check="checkNumber" |
|
|
|
:cron="crontabValueObj" |
|
|
|
ref="cronmonth" |
|
|
|
/> |
|
|
|
<CrontabMonth @update="updateCrontabValue" :check="checkNumber" :cron="crontabValueObj" ref="cronmonth" /> |
|
|
|
</el-tab-pane> |
|
|
|
|
|
|
|
<el-tab-pane label="周" v-if="shouldHide('week')"> |
|
|
|
<CrontabWeek |
|
|
|
@update="updateCrontabValue" |
|
|
|
:check="checkNumber" |
|
|
|
:cron="crontabValueObj" |
|
|
|
ref="cronweek" |
|
|
|
/> |
|
|
|
<CrontabWeek @update="updateCrontabValue" :check="checkNumber" :cron="crontabValueObj" ref="cronweek" /> |
|
|
|
</el-tab-pane> |
|
|
|
|
|
|
|
<el-tab-pane label="年" v-if="shouldHide('year')"> |
|
|
|
<CrontabYear |
|
|
|
@update="updateCrontabValue" |
|
|
|
:check="checkNumber" |
|
|
|
:cron="crontabValueObj" |
|
|
|
ref="cronyear" |
|
|
|
/> |
|
|
|
<CrontabYear @update="updateCrontabValue" :check="checkNumber" :cron="crontabValueObj" ref="cronyear" /> |
|
|
|
</el-tab-pane> |
|
|
|
</el-tabs> |
|
|
|
|
|
|
@ -70,33 +35,33 @@ |
|
|
|
<p class="title">时间表达式</p> |
|
|
|
<table> |
|
|
|
<thead> |
|
|
|
<th v-for="item of tabTitles" width="40" :key="item">{{item}}</th> |
|
|
|
<th v-for="item of tabTitles" width="40" :key="item">{{ item }}</th> |
|
|
|
<th>Cron 表达式</th> |
|
|
|
</thead> |
|
|
|
<tbody> |
|
|
|
<td> |
|
|
|
<span>{{crontabValueObj.second}}</span> |
|
|
|
<span>{{ crontabValueObj.second }}</span> |
|
|
|
</td> |
|
|
|
<td> |
|
|
|
<span>{{crontabValueObj.min}}</span> |
|
|
|
<span>{{ crontabValueObj.min }}</span> |
|
|
|
</td> |
|
|
|
<td> |
|
|
|
<span>{{crontabValueObj.hour}}</span> |
|
|
|
<span>{{ crontabValueObj.hour }}</span> |
|
|
|
</td> |
|
|
|
<td> |
|
|
|
<span>{{crontabValueObj.day}}</span> |
|
|
|
<span>{{ crontabValueObj.day }}</span> |
|
|
|
</td> |
|
|
|
<td> |
|
|
|
<span>{{crontabValueObj.month}}</span> |
|
|
|
<span>{{ crontabValueObj.month }}</span> |
|
|
|
</td> |
|
|
|
<td> |
|
|
|
<span>{{crontabValueObj.week}}</span> |
|
|
|
<span>{{ crontabValueObj.week }}</span> |
|
|
|
</td> |
|
|
|
<td> |
|
|
|
<span>{{crontabValueObj.year}}</span> |
|
|
|
<span>{{ crontabValueObj.year }}</span> |
|
|
|
</td> |
|
|
|
<td> |
|
|
|
<span>{{crontabValueString}}</span> |
|
|
|
<span>{{ crontabValueString }}</span> |
|
|
|
</td> |
|
|
|
</tbody> |
|
|
|
</table> |
|
|
@ -329,7 +294,7 @@ export default { |
|
|
|
}, |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
crontabValueString: function() { |
|
|
|
crontabValueString: function () { |
|
|
|
let obj = this.crontabValueObj; |
|
|
|
let str = |
|
|
|
obj.second + |
|
|
@ -363,7 +328,7 @@ export default { |
|
|
|
// 隐藏部分组件 |
|
|
|
}, |
|
|
|
}, |
|
|
|
mounted: function() { |
|
|
|
mounted: function () { |
|
|
|
this.resolveExp(); |
|
|
|
}, |
|
|
|
}; |
|
|
@ -373,6 +338,7 @@ export default { |
|
|
|
text-align: center; |
|
|
|
margin-top: 20px; |
|
|
|
} |
|
|
|
|
|
|
|
.popup-main { |
|
|
|
position: relative; |
|
|
|
margin: 10px auto; |
|
|
@ -381,12 +347,14 @@ export default { |
|
|
|
font-size: 12px; |
|
|
|
overflow: hidden; |
|
|
|
} |
|
|
|
|
|
|
|
.popup-title { |
|
|
|
overflow: hidden; |
|
|
|
line-height: 34px; |
|
|
|
padding-top: 6px; |
|
|
|
background: #f2f2f2; |
|
|
|
} |
|
|
|
|
|
|
|
.popup-result { |
|
|
|
box-sizing: border-box; |
|
|
|
line-height: 24px; |
|
|
@ -395,6 +363,7 @@ export default { |
|
|
|
border: 1px solid #ccc; |
|
|
|
position: relative; |
|
|
|
} |
|
|
|
|
|
|
|
.popup-result .title { |
|
|
|
position: absolute; |
|
|
|
top: -28px; |
|
|
@ -406,11 +375,13 @@ export default { |
|
|
|
line-height: 30px; |
|
|
|
background: #fff; |
|
|
|
} |
|
|
|
|
|
|
|
.popup-result table { |
|
|
|
text-align: center; |
|
|
|
width: 100%; |
|
|
|
margin: 0 auto; |
|
|
|
} |
|
|
|
|
|
|
|
.popup-result table span { |
|
|
|
display: block; |
|
|
|
width: 100%; |
|
|
@ -421,6 +392,7 @@ export default { |
|
|
|
overflow: hidden; |
|
|
|
border: 1px solid #e8e8e8; |
|
|
|
} |
|
|
|
|
|
|
|
.popup-result-scroll { |
|
|
|
font-size: 12px; |
|
|
|
line-height: 24px; |
|
|
|