From 5bb223d6c8b2f10e503013c713b6faff1456bf55 Mon Sep 17 00:00:00 2001 From: wangqifan Date: Wed, 2 Apr 2025 21:51:36 +0800 Subject: [PATCH] =?UTF-8?q?=E5=89=8D=E5=8F=B0=E5=8C=BA=E5=9F=9F=E6=94=B9?= =?UTF-8?q?=E6=88=90=E8=BE=93=E5=85=A5=E9=80=89=E6=8B=A9=E6=A1=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/views/AwsSearchDiscount.vue | 31 +++++++++++++++++++----- frontend/src/views/InstanceSearch.vue | 23 ++++++++++++++++-- frontend/src/views/PriceCalculator.vue | 22 +++++++++++++++-- 3 files changed, 66 insertions(+), 10 deletions(-) diff --git a/frontend/src/views/AwsSearchDiscount.vue b/frontend/src/views/AwsSearchDiscount.vue index 53ac071..c42cee1 100644 --- a/frontend/src/views/AwsSearchDiscount.vue +++ b/frontend/src/views/AwsSearchDiscount.vue @@ -54,9 +54,16 @@ - + @@ -435,6 +442,7 @@ yearly_discount: 0.85 // 默认60%，即6折 }, regions: [], + filteredRegions: [], // 添加筛选后的区域列表 searchResults: [], selectedInstance: null, comparisonList: [], // 用于存储要比较的实例 @@ -450,6 +458,7 @@ try { // 使用API服务获取区域列表 this.regions = await apiService.getRegions() + this.filteredRegions = [...this.regions] // 初始化筛选后的区域列表 // 如果数据加载成功，默认选择第一个区域 if (this.regions && this.regions.length > 0) { @@ -457,7 +466,7 @@ } // 从本地存储加载之前保存的对比列表 - const savedComparison = localStorage.getItem('instance_comparison') + const savedComparison = localStorage.getItem('instance_comparison_discount') if (savedComparison) { this.comparisonList = JSON.parse(savedComparison) } @@ -467,6 +476,16 @@ } }, methods: { + filterRegions(query) { + if (query) { + this.filteredRegions = this.regions.filter(region => { + return region.name.toLowerCase().includes(query.toLowerCase()) || + region.code.toLowerCase().includes(query.toLowerCase()) + }) + } else { + this.filteredRegions = [...this.regions] + } + }, async searchInstances() { if (!this.form.cpu_cores && !this.form.memory_gb && !this.form.disk_gb) { this.$message.warning('请至少指定一项配置要求') @@ -540,7 +559,7 @@ this.$message.success('已添加到对比列表') // 保存到本地存储 - localStorage.setItem('instance_comparison', JSON.stringify(this.comparisonList)) + localStorage.setItem('instance_comparison_discount', JSON.stringify(this.comparisonList)) // 滚动到对比列表区域 setTimeout(() => { @@ -552,12 +571,12 @@ }, removeFromComparison(index) { this.comparisonList.splice(index, 1) - localStorage.setItem('instance_comparison', JSON.stringify(this.comparisonList)) + localStorage.setItem('instance_comparison_discount', JSON.stringify(this.comparisonList)) this.$message.success('已从对比列表中移除') }, clearComparison() { this.comparisonList = [] - localStorage.removeItem('instance_comparison') + localStorage.removeItem('instance_comparison_discount') this.$message.success('已清空对比列表') }, exportComparison() { diff --git a/frontend/src/views/InstanceSearch.vue b/frontend/src/views/InstanceSearch.vue index f353778..ac34523 100644 --- a/frontend/src/views/InstanceSearch.vue +++ b/frontend/src/views/InstanceSearch.vue @@ -54,9 +54,16 @@ - + @@ -389,6 +396,7 @@ export default { operating_system: 'Linux' // 默认Linux }, regions: [], + filteredRegions: [], // 添加筛选后的区域列表 searchResults: [], selectedInstance: null, comparisonList: [], // 用于存储要比较的实例 @@ -404,6 +412,7 @@ export default { try { // 使用API服务获取区域列表 this.regions = await apiService.getRegions() + this.filteredRegions = [...this.regions] // 初始化筛选后的区域列表 // 如果数据加载成功，默认选择第一个区域 if (this.regions && this.regions.length > 0) { @@ -421,6 +430,16 @@ export default { } }, methods: { + filterRegions(query) { + if (query) { + this.filteredRegions = this.regions.filter(region => { + return region.name.toLowerCase().includes(query.toLowerCase()) || + region.code.toLowerCase().includes(query.toLowerCase()) + }) + } else { + this.filteredRegions = [...this.regions] + } + }, async searchInstances() { if (!this.form.cpu_cores && !this.form.memory_gb && !this.form.disk_gb) { this.$message.warning('请至少指定一项配置要求') diff --git a/frontend/src/views/PriceCalculator.vue b/frontend/src/views/PriceCalculator.vue index 92f2885..fc2b7a3 100644 --- a/frontend/src/views/PriceCalculator.vue +++ b/frontend/src/views/PriceCalculator.vue @@ -26,9 +26,16 @@ - + @@ -160,6 +167,7 @@ export default { }, instanceTypes: [], regions: [], + filteredRegions: [], priceResult: null } }, @@ -172,12 +180,22 @@ export default { this.instanceTypes = instanceTypes this.regions = regions.map(region => region.code) + this.filteredRegions = [...this.regions] // 初始化筛选后的区域列表 } catch (error) { console.error('Error fetching data:', error) this.$message.error('获取数据失败') } }, methods: { + filterRegions(query) { + if (query) { + this.filteredRegions = this.regions.filter(region => { + return region.toLowerCase().includes(query.toLowerCase()) + }) + } else { + this.filteredRegions = [...this.regions] + } + }, async calculatePrice() { try { this.priceResult = await apiService.calculatePrice(this.form)