cfy777/Situation-Awareness-Platform-Frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 首页高级搜索操作优化

Browse Source
This commit is contained in:
汪少伟
2025-03-20 13:41:02 +08:00
parent 08b7dfc450
commit 9a6f40b793
2 changed files with 80 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

83
src/components/AdvanceSearch/index.vue
View File

@@ -5,24 +5,24 @@
<d-row :gutter="16">
<d-col :span="8">
<d-form-item field="name" label="软件名称">
<d-input placeholder="请输入软件名称" v-model="formData.softwareName"/>
<d-input placeholder="请输入软件名称" v-model="formData.softwareName" />
</d-form-item>
</d-col>
<d-col :span="8">
<d-form-item field="version" label="软件版本">
<d-input v-model="formData.softwareVersion"/>
<d-input v-model="formData.softwareVersion" />
</d-form-item>
</d-col>
<d-col :span="8">
<d-form-item field="license" label="license">
<d-input placeholder="请输入license名称" v-model="formData.licenseName"/>
<d-input placeholder="请输入license名称" v-model="formData.licenseName" />
</d-form-item>
</d-col>
</d-row>
<d-row :gutter="16">
<d-col :span="8">
<d-form-item field="dependency" label="依赖软件名称">
<d-input v-model="formData.dependentSoftware"/>
<d-input v-model="formData.dependentSoftware" />
</d-form-item>
</d-col>
<d-col :span="8">
@@ -32,27 +32,30 @@
</d-col>
<d-col :span="8">
<d-form-item field="date" label="版本发布日期">
<d-range-date-picker-pro v-model="formData.dateRange" style="width: 100%;"
:placeholder="['开始日期', '结束日期']"/>
<d-range-date-picker-pro
v-model="formData.dateRange"
style="width: 100%"
:placeholder="['开始日期', '结束日期']"
/>
</d-form-item>
</d-col>
</d-row>
<d-row :gutter="16">
<d-col :span="8">
<d-form-item field="interestTag" label="兴趣标签">
<d-input v-model="formData.interestTag"/>
<d-input v-model="formData.interestTag" />
</d-form-item>
</d-col>
<d-col :span="8">
<d-form-item field="industry" label="行业">
<d-input v-model="formData.industry"/>
<d-input v-model="formData.industry" />
</d-form-item>
</d-col>
</d-row>
<slot name="operation">
<gc-form-operation style="display: flex; justify-content: center; gap: 8px;">
<d-button style="width: 96px; height: 32px;" variant="solid" @click="submitForm">搜索</d-button>
<d-button style="width: 96px; height: 32px;" @click="cancel">取消</d-button>
<gc-form-operation style="display: flex; justify-content: center; gap: 8px">
<d-button style="width: 96px; height: 32px" variant="solid" @click="submitForm">搜索</d-button>
<d-button style="width: 96px; height: 32px" @click="cancel">取消</d-button>
</gc-form-operation>
</slot>
</d-form>
@@ -60,7 +63,7 @@
</template>
<script setup lang="ts">
import { ref, defineEmits, defineProps, watch } from 'vue';
import { ref, defineEmits, defineProps, watch, onMounted } from 'vue';
import { searchLanguageList } from '@/api/jyh';
const props = defineProps({
layout: {
@@ -80,27 +83,36 @@ const props = defineProps({
dateRange: ['', '']
})
}
})
});
const emit = defineEmits(['submit', 'cancel', 'update:modelValue']);
const languageList = ref([]);
const formData = ref({...props.modelValue});
const formData = ref({ ...props.modelValue });
watch(() => props.modelValue, (newVal) => {
if (JSON.stringify(newVal) !== JSON.stringify(formData.value)) {
formData.value = {...newVal};
}
}, { deep: true });
watch(
() => props.modelValue,
(newVal) => {
if (JSON.stringify(newVal) !== JSON.stringify(formData.value)) {
formData.value = { ...newVal };
}
},
{ deep: true }
);
watch(formData, (newVal) => {
if (JSON.stringify(newVal) !== JSON.stringify(props.modelValue)) {
emit('update:modelValue', {...newVal});
}
}, { deep: true });
watch(
formData,
(newVal) => {
if (JSON.stringify(newVal) !== JSON.stringify(props.modelValue)) {
emit('update:modelValue', { ...newVal });
localStorage.setItem('searchForm', JSON.stringify(newVal));
}
},
{ deep: true }
);
const submitForm = () => {
emit('submit', formData.value);
}
};
const cancel = () => {
formData.value = {
@@ -112,20 +124,25 @@ const cancel = () => {
interestTag: '',
industry: '',
dateRange: ['', '']
}
};
emit('cancel');
emit('update:modelValue', formData.value);
}
};
const getLanguageList = async() => {
const res:any = await searchLanguageList();
const getLanguageList = async () => {
const res: any = await searchLanguageList();
if (!res.error) {
languageList.value = res.data.data;
}
}
};
getLanguageList();
onMounted(() => {
const _searchForm = localStorage.getItem('searchForm');
if (_searchForm) {
formData.value = JSON.parse(_searchForm);
}
});
</script>
<style scoped lang="scss">
</style>
<style scoped lang="scss"></style>