import { formatMessage } from '@/utils/localeUtils.js';
|
import { ref } from 'vue';
|
|
export default function useTableSearch() {
|
const searchText = ref('');
|
const searchedColumn = ref('');
|
|
const handleSearch = (selectedKeys, confirm, dataIndex) => {
|
confirm();
|
searchText.value = selectedKeys[0];
|
searchedColumn.value = dataIndex;
|
};
|
|
const handleReset = (clearFilters) => {
|
clearFilters({
|
confirm: true,
|
});
|
searchText.value = '';
|
};
|
|
function handleResizeColumn(w, col) {
|
col.width = w;
|
}
|
|
const getColumnSearchProps = (dataIndex) => ({
|
filterDropdown: ({ setSelectedKeys, selectedKeys, confirm, clearFilters }) => (
|
<div style="padding: 8px">
|
<a-input
|
v-model:value={selectedKeys[0]}
|
placeholder={formatMessage('common.search.placeholder','请搜索')}
|
style="width: 188px; margin-bottom: 8px; display: block;"
|
onChange={(e) => setSelectedKeys(e.target.value ? [e.target.value] : [])}
|
onPressEnter={() => handleSearch(selectedKeys, confirm, dataIndex)}
|
/>
|
<a-button
|
type="primary"
|
onClick={() => handleSearch(selectedKeys, confirm, dataIndex)}
|
size="small"
|
style="width: 90px; margin-right: 8px"
|
>
|
{formatMessage('common.search','搜索')}
|
</a-button>
|
<a-button onClick={() => handleReset(clearFilters)} size="small" style="width: 90px">
|
{formatMessage('common.reset','重置')}
|
</a-button>
|
</div>
|
),
|
onFilter: (value, record) =>
|
record[dataIndex]
|
? record[dataIndex].toString().toLowerCase().includes(value.toLowerCase())
|
: '',
|
resizable: true,
|
});
|
|
return {
|
searchText,
|
searchedColumn,
|
getColumnSearchProps,
|
handleResizeColumn,
|
};
|
}
|
|
