From a009c0021cd72a2c7379b7b04eacd694e0cb98f2 Mon Sep 17 00:00:00 2001
From: tanghaolin <1723298894@qq.com>
Date: 星期四, 13 二月 2025 21:32:27 +0800
Subject: [PATCH] 修改能效标识查询页面
---
src/views/IndustrialSoftware.vue | 111 ++++++++++++++++++++++++++++++++++---------------------
1 files changed, 68 insertions(+), 43 deletions(-)
diff --git a/src/views/IndustrialSoftware.vue b/src/views/IndustrialSoftware.vue
index e0b787c..2c8ce45 100644
--- a/src/views/IndustrialSoftware.vue
+++ b/src/views/IndustrialSoftware.vue
@@ -3,11 +3,11 @@
style="margin-top: 20px;padding-top:15px ;">
<div class=" w-100 h-100" style="background-color: #fff;">
<!-- 椤堕儴鍒嗙被鑿滃崟 -->
- <div class=" rounded-lg shadow " style="background-color: #f6f7f9;margin-bottom: 10px;">
+ <div class="rounded-lg shadow" style="background-color: #f6f7f9; margin-bottom: 10px">
<!-- 绫诲瀷 -->
- <div class="border-b p-4 border-bottom-dashed-1 box-border" style="padding: 10px;">
+ <div class="border-b p-4 border-bottom-dashed-1 box-border" style="padding: 10px">
<div class="flex items-center">
- <span class="text-gray-500 ">绫诲瀷锛�</span>
+ <span class="text-gray-500">绫诲瀷锛�</span>
<div class="flex flex-1">
<span v-for="item in type" class="ant-tag !px-4"
:class="typeSelect === item.tag ? 'ant-tag-checked' : ''" :key="item.tag"
@@ -20,22 +20,21 @@
</div>
<!-- 鍘傚晢 -->
- <div class="border-b p-4 border-bottom-dashed-1 box-border" style="padding: 10px;">
- <div class="flex items-center ">
+ <div class="border-b p-4 border-bottom-dashed-1 box-border" style="padding: 10px">
+ <div class="flex items-center">
<span class="text-gray-500">鍘傚晢锛�</span>
<div class="flex flex-1">
- <span v-for="item in factory" :key="item.tag" class="ant-tag !px-4"
- :class="factorySelect === item.tag ? 'ant-tag-checked' : ''"
- :type="factorySelect === item.tag ? 'primary' : 'default'"
- @click="factorySelect = item.tag" size="small">
- {{ item.name }}
+ <span v-for="item in factory" :key="item.CompanyId" class="ant-tag !px-4"
+ :class="factorySelect === item.CompanyId ? 'ant-tag-checked' : ''"
+ @click="factorySelect = item.CompanyId" size="small">
+ {{ item.CompanyAbbName }}
</span>
</div>
</div>
</div>
<!-- 鑳芥晥绛夌骇 -->
- <div class="flex eec-filter-sortbar" style="background-color: #ecedee;">
+ <div class="flex eec-filter-sortbar" style="background-color: #ecedee">
<ul>
<li v-for="sort in EecClass" :key="sort.tag" size="small" @click="handleEecLevel(sort.tag)"
:type="EecSelect === sort.tag ? 'primary' : 'default'"
@@ -58,8 +57,9 @@
<div class="goods-name" :title="app.Model">{{ app.ModelType }}</div>
<div class="metertitle mb-2"><span>鍨嬪彿锛歿{ app.Model }}</span></div>
<!-- <p class="text-gray-500 text-sm mb-4 flex-1">{{ app.description }}</p> -->
- <div class="flex flex-wrap gap-2" style="">
+ <div class="flex gap-2" style="justify-content: space-between;align-items: center;">
<!-- <el-tag size="small" type="success">{{ app.CompanyName }}</el-tag> -->
+ <div class="goods-price"><span class="goods-price-selling"> 楼{{ app.Price }}</span> </div>
<div class="flex items-center eec-level-div">
<img :src="EecLevelEnum[app.EnergyEfficiencyClass].icon">
<span class="eec-numb">{{ app.EnergyEfficiencyClass }}</span>
@@ -67,13 +67,13 @@
}}</span>
</div>
</div>
- <div class="goods-price"><span class="goods-price-selling">{{ app.price }}</span> </div>
+
<!-- <div class="flex justify-between items-center">
<el-rate v-model="app.rating" disabled />
<span class="text-gray-400 text-sm">{{ app.date }}</span>
</div> -->
- <div class="link-btn">绔嬪嵆璐叆</div>
+ <div class="link-btn" @click="handleBuyClick(app.id)">绔嬪嵆璐叆</div>
</div>
<template #content>
<div class="goods-tip-content" style="white-space: pre-wrap;">{{ app.Tip }}</div>
@@ -94,10 +94,13 @@
</template>
<script setup lang="ts">
-import { ref, onMounted } from 'vue';
+import EecLevel1 from '@/assets/icons/energy_level_1.svg';
+import EecLevel2 from '@/assets/icons/energy_level_2.svg';
+import { onMounted, ref } from 'vue';
+import { useRouter } from 'vue-router';
import axios from 'axios';
-import EecLevel1 from '@/assets/icons/energy_level_1.svg'
-import EecLevel2 from '@/assets/icons/energy_level_2.svg'
+const router = useRouter();
+
// 鍒嗙被閫夐」
const type = [
{ name: "娉�", tag: 1 },
@@ -108,10 +111,7 @@
{ name: "宸ヤ笟閿呯倝", tag: 6 },
{ name: "鐢垫満", tag: 7 },
];
-const factory = [
- { name: "鍏ㄩ儴", tag: "鍏ㄩ儴" },
- { name: '鍑硥', tag: '鍑硥' },
-];
+const factory = ref([]);
const EecClass = [
{ name: "鍏ㄩ儴", tag: 0 },
{ name: "涓�绾ц兘鏁�", tag: 1 },
@@ -122,14 +122,13 @@
// 閫変腑鐘舵��
const typeSelect = ref(1);
-const factorySelect = ref('鍏ㄩ儴');
+const factorySelect = ref('-99');
const EecSelect = ref(0);
-
const EecLevelEnum = {
1: { name: '涓�绾ц兘鏁�', icon: EecLevel1 },
2: { name: '浜岀骇鑳芥晥', icon: EecLevel2 },
-}
+};
const m_RequestDataObj = {
1: { requestPath: "static/EecProductData/Pump.json" },
@@ -155,10 +154,27 @@
})
onMounted(() => {
+ initComanyData();
initData();
// filterProduct();
})
-
+const initComanyData = () => {
+ axios({
+ method: 'get',
+ url: 'static/EecProductData/CompanyData.json',
+ }).then((res) => {
+ let result = res.data;
+ factory.value = result.map((item: any) => {
+ return {
+ CompanyId: item.CompanyId,
+ CompanyAllName: item.CompanyAllName,
+ CompanyAbbName: item.CompanyAbbName,
+ Type: item.Type,
+ }
+ })
+ factory.value.unshift({ CompanyId: "-99", CompanyAllName: '鍏ㄩ儴', CompanyAbbName: '鍏ㄩ儴', Type: null })
+ }).catch((err) => { })
+}
const initData = () => {
m_PageLoading.value = true;
axios({
@@ -170,7 +186,7 @@
let arr = [];
result.forEach((item: any) => {
let node = {
- Id: item.ID,
+ Id: item.Id,
Type: item.Type,
ModelType: item.ModelType,
Model: item.Model,
@@ -178,6 +194,7 @@
RecordNumber: item.RecordNumber,
EnergyEfficiencyClass: item.EnergyEfficiencyClass,
RecordTime: item.RecordTime,
+ Price: item.Price,
PhysicalPicturePath: "/static/EecProductData/" + item.PhysicalPicturePath,
CertificatePath: `/static/EecProductData/${item.CertificatePath}`,
Tip: `澶囨鏃堕棿锛�${item.RecordTime} \n 澶囨鍙凤細${item.RecordNumber}`,
@@ -194,12 +211,13 @@
filterProductData.value = allEecProduct.value.filter((item) => {
return item.Type === typeSelect.value
})
+
if (EecSelect.value !== 0) {
filterProductData.value = filterProductData.value.filter((item) => {
return item.EnergyEfficiencyClass === EecSelect.value
})
}
- if (factorySelect.value !== '鍏ㄩ儴') {
+ if (factorySelect.value !== '-99') {
filterProductData.value = filterProductData.value.filter((item) => {
return item.CompanyName === factorySelect.value
})
@@ -209,13 +227,13 @@
}
const handleCurrentChange = (val: number) => {
m_paginationConfig.value.currentPage = val;
- let allTableData = allEecProduct.value;
+ let allTableData = filterProductData.value;
let pagingData = getSelectPageData(allTableData);
dispEecProduct.value = pagingData;
}
const handleSizeChange = (val: number) => {
m_paginationConfig.value.currentPage = val;
- let allTableData = allEecProduct.value;
+ let allTableData = filterProductData.value;
let pagingData = getSelectPageData(allTableData);
dispEecProduct.value = pagingData;
}
@@ -233,6 +251,17 @@
const changeSelectType = (tag: number) => {
typeSelect.value = tag;
initData();
+};
+
+const handleBuyClick = (productId: string) => {
+ // 鎵惧埌褰撳墠鐐瑰嚮鐨勪骇鍝�
+ const currentProduct = dispEecProduct.value.find((item) => item.id === productId);
+ if (currentProduct) {
+ console.log("馃殌 ~ currentProduct:", currentProduct)
+ // 淇濆瓨浜у搧淇℃伅鍒發ocalStorage
+ localStorage.setItem('currentProduct', JSON.stringify(currentProduct));
+ }
+ router.push(`/product/${productId}`);
};
const handleEecLevel = (tag: number) => {
EecSelect.value = tag;
@@ -262,13 +291,13 @@
box-sizing: border-box;
/* transition: border-color .1s ease; */
border-radius: 5px;
- transition: all .3s;
+ transition: all 0.3s;
margin-top: 10px;
}
.goods-warp-item:hover {
- border-color: rgba(0, 0, 0, .09);
- box-shadow: 0 2px 8px rgba(0, 0, 0, .2)
+ border-color: rgba(0, 0, 0, 0.09);
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}
.bg-grey {
@@ -292,7 +321,7 @@
}
.industrial-soft-style::after {
- content: "";
+ content: '';
position: absolute;
top: 0;
left: 0;
@@ -333,7 +362,7 @@
color: #999;
line-height: 16px;
overflow: hidden;
- text-align: left
+ text-align: left;
}
.link-btn {
@@ -358,7 +387,7 @@
}
.goods-price {
- width: 100%;
+ /* width: 100%; */
padding: 0 3px;
text-align: left;
box-sizing: border-box;
@@ -375,19 +404,19 @@
}
.goods-price .goods-price-selling {
- font-size: 14px;
+ font-size: 16px;
font-weight: 700;
color: #f74747;
}
.ant-tag {
box-sizing: border-box;
- color: rgba(0, 0, 0, .65);
+ color: rgba(0, 0, 0, 0.65);
font-size: 14px;
font-variant: tabular-nums;
line-height: 1.5;
list-style: none;
- font-feature-settings: "tnum";
+ font-feature-settings: 'tnum';
display: inline-block;
height: auto;
margin: 0 8px 0 0;
@@ -397,7 +426,7 @@
white-space: nowrap;
cursor: default;
opacity: 1;
- transition: all .3s cubic-bezier(.78, .14, .15, .86);
+ transition: all 0.3s cubic-bezier(0.78, 0.14, 0.15, 0.86);
margin-right: 24px;
font-size: 14px;
}
@@ -444,10 +473,8 @@
}
.eec-filter-currentOrder {
-
border-bottom: 4px solid #1c97b7;
color: #1c97b7;
-
}
.eec-filter-currentOrder:hover {
@@ -479,8 +506,6 @@
color: #fff;
font-size: 12px;
}
-
-
:deep(.el-button--default) {
--el-button-bg-color: transparent;
--
Gitblit v1.9.3