mirror of
https://gitee.com/dolphinscheduler/DolphinScheduler.git
synced 2024-12-03 04:39:00 +08:00
[Feature][UI] Adjust the style of the interface settings. (#12531)
This commit is contained in:
parent
138eab6eb3
commit
1794cea4fa
@ -16,76 +16,77 @@
|
||||
*/
|
||||
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { NForm, NFormItem, NSelect } from "naive-ui";
|
||||
import { defineComponent } from "vue";
|
||||
import { NSelect, NSpace } from 'naive-ui'
|
||||
import { defineComponent } from 'vue'
|
||||
import { useLogTimerStore } from '@/store/logTimer/logTimer'
|
||||
|
||||
import Card from '@/components/card'
|
||||
|
||||
// Update LogTimer store when select value is updated
|
||||
const handleUpdateValue = (logTimer: number) => {
|
||||
const logTimerStore = useLogTimerStore()
|
||||
logTimerStore.setLogTimer(logTimer)
|
||||
const logTimerStore = useLogTimerStore()
|
||||
logTimerStore.setLogTimer(logTimer)
|
||||
}
|
||||
|
||||
const setting = defineComponent({
|
||||
name: 'ui-setting',
|
||||
setup() {
|
||||
const logTimerStore = useLogTimerStore()
|
||||
const defaultLogTimer = logTimerStore.getLogTimer;
|
||||
name: 'ui-setting',
|
||||
setup() {
|
||||
const logTimerStore = useLogTimerStore()
|
||||
const defaultLogTimer = logTimerStore.getLogTimer
|
||||
|
||||
const logTimerMap = {
|
||||
0: "Off",
|
||||
10: '10 Seconds',
|
||||
30: '30 Seconds',
|
||||
60: '1 Minute',
|
||||
300: '5 Minutes',
|
||||
1800: '30 Minutes'
|
||||
} as any
|
||||
const logTimerMap = {
|
||||
0: 'Off',
|
||||
10: '10 Seconds',
|
||||
30: '30 Seconds',
|
||||
60: '1 Minute',
|
||||
300: '5 Minutes',
|
||||
1800: '30 Minutes'
|
||||
} as any
|
||||
|
||||
const logTimerOptions = [
|
||||
{
|
||||
label: "Off",
|
||||
value: 0,
|
||||
},
|
||||
{
|
||||
label: "10 Seconds",
|
||||
value: 10,
|
||||
},
|
||||
{
|
||||
label: "30 Seconds",
|
||||
value: 30,
|
||||
},
|
||||
{
|
||||
label: "1 Minute",
|
||||
value: 60,
|
||||
},
|
||||
{
|
||||
label: "5 Minutes",
|
||||
value: 300,
|
||||
},
|
||||
{
|
||||
label: "30 Minutes",
|
||||
value: 1800,
|
||||
},
|
||||
]
|
||||
return {defaultLogTimer, logTimerMap, logTimerOptions}
|
||||
},
|
||||
render() {
|
||||
const { t } = useI18n()
|
||||
const logTimerOptions = [
|
||||
{
|
||||
label: 'Off',
|
||||
value: 0
|
||||
},
|
||||
{
|
||||
label: '10 Seconds',
|
||||
value: 10
|
||||
},
|
||||
{
|
||||
label: '30 Seconds',
|
||||
value: 30
|
||||
},
|
||||
{
|
||||
label: '1 Minute',
|
||||
value: 60
|
||||
},
|
||||
{
|
||||
label: '5 Minutes',
|
||||
value: 300
|
||||
},
|
||||
{
|
||||
label: '30 Minutes',
|
||||
value: 1800
|
||||
}
|
||||
]
|
||||
return { defaultLogTimer, logTimerMap, logTimerOptions }
|
||||
},
|
||||
render() {
|
||||
const { t } = useI18n()
|
||||
|
||||
return (
|
||||
<>
|
||||
<NForm>
|
||||
<NFormItem label={t('ui_setting.log.refresh_time')}>
|
||||
<NSelect
|
||||
default-value={this.logTimerMap[this.defaultLogTimer]}
|
||||
options={this.logTimerOptions}
|
||||
onUpdateValue={handleUpdateValue}
|
||||
/>
|
||||
</NFormItem>
|
||||
</NForm>
|
||||
</>
|
||||
)
|
||||
}
|
||||
return (
|
||||
<Card style={{ marginLeft: '25%', width: '50%' }} title={t('menu.ui_setting')}>
|
||||
<NSpace align='center' justify='space-between'>
|
||||
<span>{t('ui_setting.log.refresh_time')}</span>
|
||||
<NSelect
|
||||
style={{ width: '200px' }}
|
||||
default-value={this.logTimerMap[this.defaultLogTimer]}
|
||||
options={this.logTimerOptions}
|
||||
onUpdateValue={handleUpdateValue}
|
||||
/>
|
||||
</NSpace>
|
||||
</Card>
|
||||
)
|
||||
}
|
||||
})
|
||||
|
||||
export default setting
|
||||
export default setting
|
||||
|
Loading…
Reference in New Issue
Block a user