WholeProcessPlatform/frontend/src/views/system/map/components/StationManagement/StationManagementSearch.vue

70 lines
1.5 KiB
Vue
Raw Normal View History

<template>
<div class="station-management-search">
<BasicSearch
ref="basicSearchRef"
:searchList="searchList"
:initial-values="initSearchData"
@reset="handleReset"
@finish="onSearchFinish"
@values-change="onValuesChange"
>
<template #actions>
<a-tooltip title="新增电站">
<a-button @click="props.handleAdd" type="primary">
新增电站
</a-button>
</a-tooltip>
</template>
</BasicSearch>
</div>
</template>
<script lang="ts" setup>
import { ref, computed, onMounted } from 'vue';
import BasicSearch from '@/components/BasicSearch/index.vue';
interface Props {
handleAdd: () => void;
}
const props = defineProps<Props>();
const emit = defineEmits<{
(e: 'reset', values: any): void;
(e: 'searchFinish', values: any): void;
}>();
const initSearchData = {
stationName: ''
};
const searchData = ref<any>({ ...initSearchData });
const searchList: any = computed(() => [
{
type: 'Input',
name: 'stationName',
label: '电站名称',
fieldProps: {
allowClear: true
}
}
]);
const onSearchFinish = (values: any) => {
emit('searchFinish', values);
};
const onValuesChange = (changedValues: any, allValues: any) => {
searchData.value = { ...searchData.value, ...allValues };
};
const handleReset = () => {
emit('reset', initSearchData);
};
onMounted(() => {
emit('searchFinish', initSearchData);
});
</script>
<style lang="scss"></style>