删除过滤栏保存过滤条件的相关功能
This commit is contained in:
parent
17c9a52f94
commit
e042093af4
@ -158,54 +158,15 @@
|
||||
>
|
||||
<i class="fa fa-times"></i>
|
||||
</button>
|
||||
<button
|
||||
class="action-btn save-btn"
|
||||
@click="showSaveDialog = true"
|
||||
:title="t('保存当前过滤条件')"
|
||||
>
|
||||
<i class="fa fa-bookmark"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 保存过滤条件对话框 -->
|
||||
<n-modal v-model:show="showSaveDialog">
|
||||
<n-card
|
||||
style="width: 400px"
|
||||
:title="t('保存筛选条件')"
|
||||
:bordered="false"
|
||||
size="huge"
|
||||
role="dialog"
|
||||
aria-modal="true"
|
||||
>
|
||||
<n-form :model="saveForm" ref="saveFormRef">
|
||||
<n-form-item :label="t('过滤器名称')" path="name">
|
||||
<n-input
|
||||
v-model:value="saveForm.name"
|
||||
:placeholder="t('请输入过滤器名称')"
|
||||
size="small"
|
||||
/>
|
||||
</n-form-item>
|
||||
</n-form>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<n-button @click="showSaveDialog = false" size="small">
|
||||
{{ t('取消') }}
|
||||
</n-button>
|
||||
<n-button type="primary" @click="saveFilter" size="small">
|
||||
{{ t('保存') }}
|
||||
</n-button>
|
||||
</div>
|
||||
</template>
|
||||
</n-card>
|
||||
</n-modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, computed, watch, onMounted, onUnmounted } from 'vue'
|
||||
import { NInput, NSelect, NInputNumber, NDatePicker, NModal, NCard, NForm, NFormItem, NButton, useMessage } from 'naive-ui'
|
||||
import { NInput, NSelect, NInputNumber, NDatePicker } from 'naive-ui'
|
||||
import { t } from '@/shared/i18n'
|
||||
import axios from 'axios'
|
||||
import { get_session_api_headers } from '@/shared/api/auth'
|
||||
@ -233,11 +194,6 @@ interface Emits {
|
||||
const props = defineProps<Props>()
|
||||
const emit = defineEmits<Emits>()
|
||||
|
||||
const message = useMessage()
|
||||
const showSaveDialog = ref(false)
|
||||
const saveForm = ref({ name: '' })
|
||||
const saveFormRef = ref()
|
||||
|
||||
// 过滤条件
|
||||
const filters = ref<Record<string, any>>({ ...props.modelValue })
|
||||
|
||||
@ -326,23 +282,6 @@ function clearAllFilters() {
|
||||
onFilterChange()
|
||||
}
|
||||
|
||||
// 保存过滤条件
|
||||
function saveFilter() {
|
||||
if (!saveForm.value.name.trim()) {
|
||||
message.warning(t('请输入过滤器名称'))
|
||||
return
|
||||
}
|
||||
|
||||
// 这里可以保存到本地存储或发送到服务器
|
||||
const savedFilters = JSON.parse(localStorage.getItem('savedFilters') || '{}')
|
||||
savedFilters[saveForm.value.name] = { ...filters.value }
|
||||
localStorage.setItem('savedFilters', JSON.stringify(savedFilters))
|
||||
|
||||
message.success(t('过滤条件已保存'))
|
||||
showSaveDialog.value = false
|
||||
saveForm.value.name = ''
|
||||
}
|
||||
|
||||
// 初始化Link字段的下拉状态
|
||||
function initLinkDropdownState(fieldName: string) {
|
||||
if (!linkDropdownStates.value[fieldName]) {
|
||||
@ -740,18 +679,6 @@ watch(() => filterableFields.value, (fields) => {
|
||||
color: #dc2626;
|
||||
}
|
||||
|
||||
.save-btn:hover {
|
||||
background: #f0f9ff;
|
||||
border-color: #93c5fd;
|
||||
color: #2563eb;
|
||||
}
|
||||
|
||||
.dialog-footer {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
/* 响应式设计 */
|
||||
@media (max-width: 768px) {
|
||||
.filter-row {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user