This is an automated email from the ASF dual-hosted git repository.
kerwin pushed a commit to branch 3.1.1-prepare
in repository https://gitbox.apache.org/repos/asf/dolphinscheduler.git
The following commit(s) were added to refs/heads/3.1.1-prepare by this push:
new 135d70da09 support to use the clearable button of components to search
(#12668)
135d70da09 is described below
commit 135d70da091ca0554f9c55dbb5702e9b91c41f6d
Author: calvin <[email protected]>
AuthorDate: Wed Nov 2 21:40:39 2022 +0800
support to use the clearable button of components to search (#12668)
---
.../src/views/projects/list/index.tsx | 10 ++++++
.../views/projects/task/definition/batch-task.tsx | 21 +++++++++++
.../views/projects/task/instance/batch-task.tsx | 42 ++++++++++++++++++++++
.../views/projects/task/instance/stream-task.tsx | 42 ++++++++++++++++++++++
.../views/projects/workflow/definition/index.tsx | 12 +++++++
.../components/process-instance-condition.tsx | 24 +++++++++++++
6 files changed, 151 insertions(+)
diff --git a/dolphinscheduler-ui/src/views/projects/list/index.tsx
b/dolphinscheduler-ui/src/views/projects/list/index.tsx
index 6af0b72bc9..51fb519af5 100644
--- a/dolphinscheduler-ui/src/views/projects/list/index.tsx
+++ b/dolphinscheduler-ui/src/views/projects/list/index.tsx
@@ -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>
diff --git
a/dolphinscheduler-ui/src/views/projects/task/definition/batch-task.tsx
b/dolphinscheduler-ui/src/views/projects/task/definition/batch-task.tsx
index 86f9f21d64..783baef0b1 100644
--- a/dolphinscheduler-ui/src/views/projects/task/definition/batch-task.tsx
+++ b/dolphinscheduler-ui/src/views/projects/task/definition/batch-task.tsx
@@ -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>
diff --git
a/dolphinscheduler-ui/src/views/projects/task/instance/batch-task.tsx
b/dolphinscheduler-ui/src/views/projects/task/instance/batch-task.tsx
index 548e9c500d..02f1aeb49a 100644
--- a/dolphinscheduler-ui/src/views/projects/task/instance/batch-task.tsx
+++ b/dolphinscheduler-ui/src/views/projects/task/instance/batch-task.tsx
@@ -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>
diff --git
a/dolphinscheduler-ui/src/views/projects/task/instance/stream-task.tsx
b/dolphinscheduler-ui/src/views/projects/task/instance/stream-task.tsx
index 5a6493af09..3cd063dc60 100644
--- a/dolphinscheduler-ui/src/views/projects/task/instance/stream-task.tsx
+++ b/dolphinscheduler-ui/src/views/projects/task/instance/stream-task.tsx
@@ -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>
diff --git
a/dolphinscheduler-ui/src/views/projects/workflow/definition/index.tsx
b/dolphinscheduler-ui/src/views/projects/workflow/definition/index.tsx
index 688c1610aa..77663545f7 100644
--- a/dolphinscheduler-ui/src/views/projects/workflow/definition/index.tsx
+++ b/dolphinscheduler-ui/src/views/projects/workflow/definition/index.tsx
@@ -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>
diff --git
a/dolphinscheduler-ui/src/views/projects/workflow/instance/components/process-instance-condition.tsx
b/dolphinscheduler-ui/src/views/projects/workflow/instance/components/process-instance-condition.tsx
index 29289712d7..7064fdb368 100644
---
a/dolphinscheduler-ui/src/views/projects/workflow/instance/components/process-instance-condition.tsx
+++
b/dolphinscheduler-ui/src/views/projects/workflow/instance/components/process-instance-condition.tsx
@@ -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}
