natas_hw
/
dolphinscheduler0701
0
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

support to use the clearable button of components to search (#12668)

This commit is contained in:
calvin 2022-11-02 21:40:39 +08:00 committed by zhuangchong
parent 0c3ab4335e
commit 135d70da09
6 changed files with 151 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
dolphinscheduler-ui/src/views/projects/list/index.tsx
View File

@ -60,6 +60,14 @@ const list = defineComponent({
requestData()
}
const onClearSearch = () => {
variables.page = 1
getTableData({
pageSize: variables.pageSize,
pageNo: variables.page
})
}
const onCancelModal = () => {
variables.showModalRef = false
}
@ -93,6 +101,7 @@ const list = defineComponent({
handleSearch,
onCancelModal,
onConfirmModal,
onClearSearch,
handleChangePageSize,
trim
}
@ -118,6 +127,7 @@ const list = defineComponent({
v-model={[this.searchVal, 'value']}
placeholder={t('project.list.project_tips')}
clearable
onClear={this.onClearSearch}
/>
<NButton size='small' type='primary' onClick={this.handleSearch}>
<NIcon>

21
dolphinscheduler-ui/src/views/projects/task/definition/batch-task.tsx
View File

@ -75,6 +75,21 @@ const BatchTaskDefinition = defineComponent({
requestData()
}
const onClearSearchTaskName = () => {
variables.searchTaskName = null
onSearch()
}
const onClearSearchWorkflowName = () => {
variables.searchWorkflowName = null
onSearch()
}
const onClearSearchTaskType = () => {
variables.taskType = null
onSearch()
}
const onRefresh = () => {
variables.showVersionModalRef = false
variables.showMoveModalRef = false
@ -110,6 +125,9 @@ const BatchTaskDefinition = defineComponent({
...toRefs(variables),
...toRefs(task),
onSearch,
onClearSearchTaskName,
onClearSearchWorkflowName,
onClearSearchTaskType,
requestData,
onUpdatePageSize,
onRefresh,
@ -145,6 +163,7 @@ const BatchTaskDefinition = defineComponent({
clearable
v-model={[this.searchTaskName, 'value']}
placeholder={t('project.task.task_name')}
onClear={this.onClearSearchTaskName}
/>
<NInput
allowInput={this.trim}
@ -152,6 +171,7 @@ const BatchTaskDefinition = defineComponent({
clearable
v-model={[this.searchWorkflowName, 'value']}
placeholder={t('project.task.workflow_name')}
onClear={this.onClearSearchWorkflowName}
/>
<NSelect
v-model={[this.taskType, 'value']}
@ -162,6 +182,7 @@ const BatchTaskDefinition = defineComponent({
placeholder={t('project.task.task_type')}
style={{ width: '180px' }}
clearable
onClear={this.onClearSearchTaskType}
/>
<NButton size='small' type='primary' onClick={onSearch}>
<NIcon>

42
dolphinscheduler-ui/src/views/projects/task/instance/batch-task.tsx
View File

@ -70,6 +70,36 @@ const BatchTaskInstance = defineComponent({
requestTableData()
}
const onClearSearchTaskName = () => {
variables.searchVal = ''
onSearch()
}
const onClearSearchProcessInstanceName = () => {
variables.processInstanceName = null
onSearch()
}
const onClearSearchExecutorName = () => {
variables.executorName = null
onSearch()
}
const onClearSearchHost = () => {
variables.host = null
onSearch()
}
const onClearSearchStateType = () => {
variables.stateType = null
onSearch()
}
const onClearSearchTime = () => {
variables.datePickerRange = null
onSearch()
}
const onConfirmModal = () => {
variables.showModalRef = false
}
@ -135,6 +165,12 @@ const BatchTaskInstance = defineComponent({
requestTableData,
onUpdatePageSize,
onSearch,
onClearSearchTaskName,
onClearSearchProcessInstanceName,
onClearSearchExecutorName,
onClearSearchHost,
onClearSearchStateType,
onClearSearchTime,
onConfirmModal,
refreshLogs,
trim
@ -161,6 +197,7 @@ const BatchTaskInstance = defineComponent({
size='small'
placeholder={t('project.task.task_name')}
clearable
onClear={this.onClearSearchTaskName}
/>
<NInput
allowInput={this.trim}
@ -168,6 +205,7 @@ const BatchTaskInstance = defineComponent({
size='small'
placeholder={t('project.task.workflow_instance')}
clearable
onClear={this.onClearSearchProcessInstanceName}
/>
<NInput
allowInput={this.trim}
@ -175,6 +213,7 @@ const BatchTaskInstance = defineComponent({
size='small'
placeholder={t('project.task.executor')}
clearable
onClear={this.onClearSearchExecutorName}
/>
<NInput
allowInput={this.trim}
@ -182,6 +221,7 @@ const BatchTaskInstance = defineComponent({
size='small'
placeholder={t('project.task.host')}
clearable
onClear={this.onClearSearchHost}
/>
<NSelect
v-model={[this.stateType, 'value']}
@ -190,6 +230,7 @@ const BatchTaskInstance = defineComponent({
placeholder={t('project.task.state')}
style={{ width: '180px' }}
clearable
onClear={this.onClearSearchStateType}
/>
<NDatePicker
v-model={[this.datePickerRange, 'value']}
@ -198,6 +239,7 @@ const BatchTaskInstance = defineComponent({
start-placeholder={t('project.task.start_time')}
end-placeholder={t('project.task.end_time')}
clearable
onClear={this.onClearSearchTime}
/>
<NButton size='small' type='primary' onClick={onSearch}>
<NIcon>

42
dolphinscheduler-ui/src/views/projects/task/instance/stream-task.tsx
View File

@ -58,6 +58,36 @@ const BatchTaskInstance = defineComponent({
getTableData()
}
const onClearSearchTaskName = () => {
variables.searchVal = null
onSearch()
}
const onClearSearchWorkFlowName = () => {
variables.processDefinitionName = null
onSearch()
}
const onClearSearchExecutorName = () => {
variables.executorName = null
onSearch()
}
const onClearSearchHost = () => {
variables.host = null
onSearch()
}
const onClearSearchStateType = () => {
variables.stateType = null
onSearch()
}
const onClearSearchTime = () => {
variables.datePickerRange = null
onSearch()
}
const onConfirmModal = () => {
variables.showModalRef = false
}
@ -130,6 +160,12 @@ const BatchTaskInstance = defineComponent({
getTableData,
onUpdatePageSize,
onSearch,
onClearSearchTaskName,
onClearSearchWorkFlowName,
onClearSearchExecutorName,
onClearSearchHost,
onClearSearchStateType,
onClearSearchTime,
onConfirmModal,
refreshLogs,
trim
@ -156,6 +192,7 @@ const BatchTaskInstance = defineComponent({
size='small'
placeholder={t('project.task.task_name')}
clearable
onClear={this.onClearSearchTaskName}
/>
<NInput
allowInput={this.trim}
@ -163,6 +200,7 @@ const BatchTaskInstance = defineComponent({
size='small'
placeholder={t('project.task.workflow_name')}
clearable
onClear={this.onClearSearchWorkFlowName}
/>
<NInput
allowInput={this.trim}
@ -170,6 +208,7 @@ const BatchTaskInstance = defineComponent({
size='small'
placeholder={t('project.task.executor')}
clearable
onClear={this.onClearSearchExecutorName}
/>
<NInput
allowInput={this.trim}
@ -177,6 +216,7 @@ const BatchTaskInstance = defineComponent({
size='small'
placeholder={t('project.task.host')}
clearable
onClear={this.onClearSearchHost}
/>
<NSelect
v-model={[this.stateType, 'value']}
@ -185,6 +225,7 @@ const BatchTaskInstance = defineComponent({
placeholder={t('project.task.state')}
style={{ width: '180px' }}
clearable
onClear={this.onClearSearchStateType}
/>
<NDatePicker
v-model={[this.datePickerRange, 'value']}
@ -193,6 +234,7 @@ const BatchTaskInstance = defineComponent({
start-placeholder={t('project.task.start_time')}
end-placeholder={t('project.task.end_time')}
clearable
onClear={this.onClearSearchTime}
/>
<NButton size='small' type='primary' onClick={onSearch}>
<NIcon>

12
dolphinscheduler-ui/src/views/projects/workflow/definition/index.tsx
View File

@ -82,6 +82,15 @@ export default defineComponent({
requestData()
}
const onClearSearch = () => {
variables.page = 1
getTableData({
pageSize: variables.pageSize,
pageNo: variables.page,
searchVal: ''
})
}
const handleChangePageSize = () => {
variables.page = 1
requestData()
@ -106,6 +115,7 @@ export default defineComponent({
return {
requestData,
handleSearch,
onClearSearch,
handleUpdateList,
createDefinition,
handleChangePageSize,
@ -149,6 +159,8 @@ export default defineComponent({
size='small'
placeholder={t('resource.function.enter_keyword_tips')}
v-model={[this.searchVal, 'value']}
clearable
onClear={this.onClearSearch}
/>
<NButton type='primary' size='small' onClick={this.handleSearch}>
<NIcon>

24
dolphinscheduler-ui/src/views/projects/workflow/instance/components/process-instance-condition.tsx
View File

@ -56,6 +56,21 @@ export default defineComponent({
})
}
const onClearSearchVal = () => {
searchValRef.value = ''
handleSearch()
}
const onClearSearchHost = () => {
hostRef.value = ''
handleSearch()
}
const onClearSearchExecutor = () => {
executorNameRef.value = ''
handleSearch()
}
const trim = getCurrentInstance()?.appContext.config.globalProperties.trim
return {
@ -65,6 +80,9 @@ export default defineComponent({
stateTypeRef,
startEndTimeRef,
handleSearch,
onClearSearchVal,
onClearSearchExecutor,
onClearSearchHost,
trim
}
},
@ -79,18 +97,24 @@ export default defineComponent({
size='small'
v-model:value={this.searchValRef}
placeholder={t('project.workflow.name')}
clearable
onClear={this.onClearSearchVal}
/>
<NInput
allowInput={this.trim}
size='small'
v-model:value={this.executorNameRef}
placeholder={t('project.workflow.executor')}
clearable
onClear={this.onClearSearchExecutor}
/>
<NInput
allowInput={this.trim}
size='small'
v-model:value={this.hostRef}
placeholder={t('project.workflow.host')}
clearable
onClear={this.onClearSearchHost}
/>
<NSelect
options={options}