From 5ab9267c972308b7d1b250071d3d48ff98f23254 Mon Sep 17 00:00:00 2001
From: tanghaolin <1723298894@qq.com>
Date: 星期一, 28 四月 2025 10:21:30 +0800
Subject: [PATCH] 修改证书查询界面
---
src/views/CertificateQuery/EecLabel.vue | 717 ++++++++++++++++++++++++++++++++++++++++++-----------------
1 files changed, 512 insertions(+), 205 deletions(-)
diff --git a/src/views/CertificateQuery/EecLabel.vue b/src/views/CertificateQuery/EecLabel.vue
index 350ab0a..a611529 100644
--- a/src/views/CertificateQuery/EecLabel.vue
+++ b/src/views/CertificateQuery/EecLabel.vue
@@ -1,80 +1,97 @@
<template>
- <div class="flag-search-div">
- <div class="top">
- <span>鑳芥晥鏍囪瘑鏌ヨ</span>
- </div>
- <div class="flag-search-content">
- <el-card class="w100 h100" shadow="never">
- <el-form style="height: 56px; flex-shrink: 0; display: flex" :model="state.m_formData" ref="ruleFormRef"
- :inline="true" label-width="120px" class="demo-ruleForm">
- <el-form-item label="浜у搧绫诲瀷" prop="ProductType">
- <el-select class="w-180-px" v-model="state.m_formData.ProductType" placeholder="璇烽�夋嫨浜у搧绫诲瀷"
- @change="changeProductType">
- <el-option v-for="item in state.type" :key="item.tag" :value="item.tag"
- :label="item.name"></el-option>
- </el-select>
- </el-form-item>
- <el-form-item label="浜у搧鍨嬪彿" prop="ProductModel">
- <el-input class="w-180-px" v-model="state.m_formData.ProductModel"
- placeholder="璇疯緭鍏ヤ骇鍝佸瀷鍙�"></el-input>
- </el-form-item>
-
- <el-form-item label="澶囨鍙�" prop="RecordNumber">
- <el-input class="w-180-px" v-model="state.m_formData.RecordNumber"
- placeholder="璇疯緭鍏ュ妗堝彿"></el-input>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" color="#003a8f" @click="initData">鏌ヨ</el-button>
- </el-form-item>
- <el-form-item>
- <el-button type="info" @click="resertForm">閲嶇疆</el-button>
- </el-form-item>
- </el-form>
- <div class="w100" style="flex: 1; display: flex; height: calc(100% - 56px); flex-direction: column"
- v-loading="state.m_PageLoading">
- <el-table class="w100" :data="state.m_dispTableData" style="width: 100%" border :height="910"
- header-cell-class-name="table-header-cell-style" cell-class-name="custom-table-cell-style">
- <el-table-column prop="TableIndex" label="搴忓彿" align="center" width="60"> </el-table-column>
- <el-table-column prop="ModelType" label="浜у搧绫诲瀷" align="center" show-overflow-tooltip>
- </el-table-column>
- <el-table-column prop="Model" label="浜у搧鍨嬪彿" align="center" show-overflow-tooltip>
- </el-table-column>
- <el-table-column prop="RecordNumber" label="澶囨鍙�" align="center" show-overflow-tooltip>
- </el-table-column>
- <el-table-column prop="EnergyEfficiencyClass" label="鑳芥晥绛夌骇" align="center">
- <template #default="scope">
- <img height="36px" :alt="EecLevelEnum[scope.row.EnergyEfficiencyClass].name"
- :src="EecLevelEnum[scope.row.EnergyEfficiencyClass].icon" />
- </template>
- </el-table-column>
- <el-table-column prop="RecordTime" label="澶囨鏃堕棿" align="center"> </el-table-column>
- <el-table-column prop="CompanyName" label="鍘傚晢" align="center" show-overflow-tooltip>
- </el-table-column>
- <el-table-column label="鎿嶄綔" align="center" width="120px">
- <template #default="scope">
- <span class="table-detail-span" @click="clickDetail(scope.row)"
- style="margin-right: 10px">
- <svg t="1739499317499" class="detail-icon" viewBox="0 0 1024 1024" version="1.1"
- xmlns="http://www.w3.org/2000/svg" p-id="27830" width="128" height="128">
- <path
- d="M96.6656 1013.76a88.064 88.064 0 0 1-88.064-88.064V607.1296a38.4 38.4 0 0 1 47.7184-37.2736L502.6816 744.448a40.96 40.96 0 0 0 18.6368 0L967.68 569.856a38.2976 38.2976 0 0 1 46.08 27.8528 36.5568 36.5568 0 0 1 1.2288 9.4208v320.512A86.1184 86.1184 0 0 1 929.28 1013.76z"
- fill="#C2E3FF" opacity=".64" p-id="27831"></path>
- <path
- d="M815.104 14.2336H197.632A88.3712 88.3712 0 0 0 109.3632 102.4v347.3408a72.9088 72.9088 0 0 0 46.6944 68.096L480.1536 643.072a73.728 73.728 0 0 0 52.5312 0l324.096-125.2352a72.9088 72.9088 0 0 0 46.6944-68.096V102.4a88.3712 88.3712 0 0 0-88.3712-88.1664z m-469.4016 387.072a24.3712 24.3712 0 0 1-24.3712 24.3712h-38.8096a25.088 25.088 0 0 1-25.088-25.088v-38.7072A24.4736 24.4736 0 0 1 281.9072 337.92h39.424a24.4736 24.4736 0 0 1 24.3712 24.4736z m0-175.104a24.4736 24.4736 0 0 1-24.3712 24.4736h-39.424a24.4736 24.4736 0 0 1-24.4736-24.4736v-39.424a24.4736 24.4736 0 0 1 24.4736-24.3712h39.424a24.4736 24.4736 0 0 1 24.3712 24.3712z m421.4784 175.104a24.2688 24.2688 0 0 1-24.3712 24.3712H434.8928a20.48 20.48 0 0 1-20.48-20.48v-43.3152A24.4736 24.4736 0 0 1 438.6816 337.92h304.128a24.3712 24.3712 0 0 1 24.3712 24.4736z m0-175.104a24.3712 24.3712 0 0 1-24.3712 24.4736h-304.128a24.4736 24.4736 0 0 1-24.3712-24.4736v-39.424a24.4736 24.4736 0 0 1 24.3712-24.3712h304.128a24.3712 24.3712 0 0 1 24.3712 24.3712z"
- fill="#43ADFF" p-id="27832"></path>
- </svg>
- 璇︾粏</span>
- </template>
- </el-table-column>
- </el-table>
- <div class="w100" style="display: flex; justify-content: flex-end; height: 40px; flex-shrink: 0">
- <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
- :background="true" :current-page="state.m_paginationConfig.currentPage"
- :page-sizes="[10, 20, 30, 40]" :page-size="state.m_paginationConfig.pageSize"
- layout="total, sizes, prev, pager, next, jumper" :total="state.filterProductData.length" />
+ <div class="page flex-col justify-start">
+ <img class="image_1" referrerpolicy="no-referrer" src="/static/img/eec-search/eec_label_top.png" />
+ <div class="block_1 flex-col">
+ <div class="block_2 flex-col">
+ <span class="text_1">鑳芥晥澶囨鏌ヨ</span>
+ <span class="paragraph_1">鐩磋繛涓浗鑳芥晥鏍囪瘑缃戝畼鏂规暟鎹簱<br />瀹炴椂鏌ヨ璁惧鑳芥晥澶囨淇℃伅</span>
+ <div class="section_1 flex-row">
+ <div class="text-wrapper_1 flex-col">
+ <span class="text_2">鏀跨瓥鐢虫姤渚濇嵁</span>
+ </div>
+ <div class="group_1 flex-col">
+ <div class="text-wrapper_2 flex-col">
+ <span class="text_3">閲囪喘閫夊瀷鍙傝��</span>
+ </div>
+ </div>
+ <div class="group_2 flex-col">
+ <div class="text-wrapper_3 flex-col">
+ <span class="text_4">鑺傝兘鎶�鏈獙璇�</span>
+ </div>
</div>
</div>
- </el-card>
+ <div class="flex section_2 rounded-[25px]">
+ <el-input class="w-180-px h-full" v-model="state.m_formData.ProductModel"
+ :input-style="{ textAlign: 'center', fontSize: '24px' }" placeholder="璇疯緭鍏ヤ骇鍝佸瀷鍙�">
+ </el-input>
+ <el-button class="custom-search-btn" @click="initData"><el-icon :size="24" color="#fff">
+ <Search />
+ </el-icon>
+ </el-button>
+ </div>
+ <div class="section_3 flex-row gap-[30px]">
+ <el-select class="w-180-px h-full box-border py-[10px]" v-model="state.m_formData.ProductType"
+ placeholder="璇烽�夋嫨浜у搧绫诲瀷" @change="changeProductType">
+ <el-option v-for="item in state.type" :key="item.tag" :value="item.tag"
+ :label="item.name"></el-option>
+ </el-select>
+ <el-select class="w-180-px h-full box-border py-[10px]" v-model="state.selFactory"
+ placeholder="璇烽�夋嫨鍘傚晢" @change="changeFactory">
+ <el-option v-for="item in state.factoryList" :key="item.CompanyId" :value="item.CompanyId"
+ :label="item.CompanyAbbName"></el-option>
+ </el-select>
+ <el-select class="w-180-px h-full box-border py-[10px]" v-model="state.selEec" placeholder="璇烽�夋嫨鑳芥晥绛夌骇"
+ @change="changeEecLevel">
+ <el-option v-for="item in state.eec_Level" :key="item.value" :value="item.value"
+ :label="item.name"></el-option>
+ </el-select>
+ </div>
+ </div>
+ </div>
+ <div class="image_2 px-[139px] -mt-[50px] box-border">
+ <div class="w100" style="flex: 1; display: flex; flex-direction: column" v-loading="state.m_PageLoading">
+ <el-table class="w100" :data="state.m_dispTableData" stripe style="width: 100%" :height="818"
+ header-cell-class-name="table-header-cell-style" cell-class-name="custom-table-cell-style">
+ <el-table-column prop="TableIndex" label="搴忓彿" align="center" width="65"> </el-table-column>
+ <el-table-column prop="ModelType" label="浜у搧绫诲瀷" align="center" show-overflow-tooltip>
+ </el-table-column>
+ <el-table-column prop="Model" label="浜у搧鍨嬪彿" align="center" show-overflow-tooltip>
+ </el-table-column>
+ <el-table-column prop="RecordNumber" label="澶囨鍙�" align="center" show-overflow-tooltip>
+ </el-table-column>
+ <el-table-column prop="EnergyEfficiencyClass" label="鑳芥晥绛夌骇" align="center">
+ <template #default="scope">
+ <img style="height: 50px" :alt="EecLevelEnum[scope.row.EnergyEfficiencyClass].name"
+ :src="EecLevelEnum[scope.row.EnergyEfficiencyClass].icon" />
+ </template>
+ </el-table-column>
+ <el-table-column prop="RecordTime" label="澶囨鏃堕棿" align="center"> </el-table-column>
+ <el-table-column prop="CompanyName" label="鍘傚晢" align="center" show-overflow-tooltip>
+ </el-table-column>
+ <el-table-column label="鎿嶄綔" align="center" width="120px">
+ <template #default="scope">
+ <span class="table-detail-span" @click="clickDetail(scope.row)" style="margin-right: 10px">
+ <svg style="width:24px;height: 24px" t="1739499317499" class="detail-icon"
+ viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
+ p-id="27830" width="128" height="128">
+ <path
+ d="M96.6656 1013.76a88.064 88.064 0 0 1-88.064-88.064V607.1296a38.4 38.4 0 0 1 47.7184-37.2736L502.6816 744.448a40.96 40.96 0 0 0 18.6368 0L967.68 569.856a38.2976 38.2976 0 0 1 46.08 27.8528 36.5568 36.5568 0 0 1 1.2288 9.4208v320.512A86.1184 86.1184 0 0 1 929.28 1013.76z"
+ fill="#C2E3FF" opacity=".64" p-id="27831"></path>
+ <path
+ d="M815.104 14.2336H197.632A88.3712 88.3712 0 0 0 109.3632 102.4v347.3408a72.9088 72.9088 0 0 0 46.6944 68.096L480.1536 643.072a73.728 73.728 0 0 0 52.5312 0l324.096-125.2352a72.9088 72.9088 0 0 0 46.6944-68.096V102.4a88.3712 88.3712 0 0 0-88.3712-88.1664z m-469.4016 387.072a24.3712 24.3712 0 0 1-24.3712 24.3712h-38.8096a25.088 25.088 0 0 1-25.088-25.088v-38.7072A24.4736 24.4736 0 0 1 281.9072 337.92h39.424a24.4736 24.4736 0 0 1 24.3712 24.4736z m0-175.104a24.4736 24.4736 0 0 1-24.3712 24.4736h-39.424a24.4736 24.4736 0 0 1-24.4736-24.4736v-39.424a24.4736 24.4736 0 0 1 24.4736-24.3712h39.424a24.4736 24.4736 0 0 1 24.3712 24.3712z m421.4784 175.104a24.2688 24.2688 0 0 1-24.3712 24.3712H434.8928a20.48 20.48 0 0 1-20.48-20.48v-43.3152A24.4736 24.4736 0 0 1 438.6816 337.92h304.128a24.3712 24.3712 0 0 1 24.3712 24.4736z m0-175.104a24.3712 24.3712 0 0 1-24.3712 24.4736h-304.128a24.4736 24.4736 0 0 1-24.3712-24.4736v-39.424a24.4736 24.4736 0 0 1 24.3712-24.3712h304.128a24.3712 24.3712 0 0 1 24.3712 24.3712z"
+ fill="#43ADFF" p-id="27832"></path>
+ </svg>
+ 璇︾粏</span>
+ </template>
+ </el-table-column>
+ </el-table>
+ <div class="w100 flex justify-center h-[40px] shrink-[0] box-border py-[30px] z-[1] bg-[#fff]">
+ <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
+ :background="true" :current-page="state.m_paginationConfig.currentPage"
+ :page-sizes="[10, 20, 30, 40]" :page-size="state.m_paginationConfig.pageSize"
+ layout="total, sizes, prev, pager, next, jumper" :total="state.filterProductData.length" />
+ </div>
+ </div>
</div>
<el-dialog v-model="dialogVisible" title="璇︾粏" width="550" align-center>
<div v-loading="dialogLoading">
@@ -136,8 +153,9 @@
<el-form-item label="澶囨淇℃伅" prop="RecordNumber">
<div style="padding-left: 30px; background-color: rgb(243 250 255)">
<el-form label-width="200px">
- <el-form-item v-for="(item, index) in state.m_OtherDetailInfo.List" style="font-size: 15px;" class="beianxinxi" :key="index"
- :label="item.name" prop="Standard">
+ <el-form-item v-for="(item, index) in state.m_OtherDetailInfo.List"
+ style="font-size: 15px;" class="beianxinxi" :key="index" :label="item.name"
+ prop="Standard">
<span class="detail-text">{{ item.value }}</span>
</el-form-item>
</el-form>
@@ -180,9 +198,7 @@
import { ref, reactive, onMounted } from 'vue';
import { ElMessage, ElTable, ElTableColumn, ElPagination, ElForm, ElFormItem, ElDialog } from 'element-plus';
import { useRoute, useRouter } from 'vue-router';
-import EecLevel1 from '@/assets/icons/ecc1.svg';
-import EecLevel2 from '@/assets/icons/ecc2.svg';
-import EecLevel3 from '@/assets/icons/ecc3.svg';
+import { Search } from '@element-plus/icons-vue';
import axios from 'axios';
const route = useRoute();
const router = useRouter();
@@ -192,9 +208,9 @@
const dialogLoading = ref(false);
const EecLevelEnum = {
- 1: { name: '涓�绾ц兘鏁�', icon: EecLevel1 },
- 2: { name: '浜岀骇鑳芥晥', icon: EecLevel2 },
- 3: { name: '浜岀骇鑳芥晥', icon: EecLevel3 },
+ 1: { name: '涓�绾ц兘鏁�', icon: "static/img/eec-search/1.svg" },
+ 2: { name: '浜岀骇鑳芥晥', icon: "static/img/eec-search/2.svg" },
+ 3: { name: '涓夌骇鑳芥晥', icon: "static/img/eec-search/3.svg" },
};
let state = reactive({
@@ -209,7 +225,7 @@
m_paginationConfig: {
currentPage: 1,
- pageSize: 20,
+ pageSize: 10,
},
m_detailDialogInfo: {
PhysicalPicturePath: '',
@@ -233,6 +249,7 @@
RecordTime: '',
},
typeSelect: 2,
+ checkTypeList: [],//褰撳墠閫夋嫨鐨勭被鍨嬪垪琛�
// 鍒嗙被閫夐」
type: [
{ name: '娉�', tag: 1 },
@@ -241,6 +258,28 @@
{ name: '鍐锋按鏈虹粍', tag: 4 },
{ name: '鐢垫満', tag: 7 },
],
+ selEec: 0,
+ eec_Level: [
+ {
+ name: "鍏ㄩ儴",
+ value: 0,
+ },
+ {
+ name: "涓�绾ц兘鏁�",
+ value: 1,
+ },
+ {
+ name: "浜岀骇鑳芥晥",
+ value: 2,
+ },
+ {
+ name: "涓夌骇鑳芥晥",
+ value: 3,
+ }
+ ],
+ selFactory: "-99",
+ factoryIncludeType: [],
+ factoryList: [],//宸ュ巶鍒楄〃
m_PageLoading: false,
});
@@ -254,55 +293,75 @@
onMounted(() => {
initData();
+ initComanyData()
});
const initData = () => {
state.m_PageLoading = true;
axios({
method: 'get',
url: m_RequestDataObj[state.m_formData.ProductType].requestPath,
- })
- .then((res) => {
- state.m_PageLoading = false;
- let result = res.data;
- result.sort((a: any, b: any) => {
- const aPrefix = a.Model.slice(0, 3);
- const bPrefix = b.Model.slice(0, 3);
- const aContainsDP = aPrefix.includes('DP') || aPrefix.includes('DRL');
- const bContainsDP = bPrefix.includes('DP') || bPrefix.includes('DRL');
+ }).then((res) => {
+ state.m_PageLoading = false;
+ let result = res.data;
+ result.sort((a: any, b: any) => {
+ const aPrefix = a.Model.slice(0, 3);
+ const bPrefix = b.Model.slice(0, 3);
+ const aContainsDP = aPrefix.includes('DP') || aPrefix.includes('DRL');
+ const bContainsDP = bPrefix.includes('DP') || bPrefix.includes('DRL');
- if (aContainsDP && !bContainsDP) {
- return -1;
- } else if (!aContainsDP && bContainsDP) {
- return 1;
- } else {
- return 0;
- }
- });
- let arr = [];
- result.forEach((item: any, index: number) => {
- let node = {
- TableIndex: index + 1,
- Id: item.Id,
- Type: item.Type,
- ModelType: item.ModelType,
- Model: item.Model,
- CompanyName: item.CompanyName,
- 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}`,
- };
- arr.push(node);
- });
- state.allEecProduct = arr;
- filterProduct();
- })
+ if (aContainsDP && !bContainsDP) {
+ return -1;
+ } else if (!aContainsDP && bContainsDP) {
+ return 1;
+ } else {
+ return 0;
+ }
+ });
+ let arr = [];
+ result.forEach((item: any, index: number) => {
+ let node = {
+ TableIndex: index + 1,
+ Id: item.Id,
+ Type: item.Type,
+ ModelType: item.ModelType,
+ Model: item.Model,
+ CompanyName: item.CompanyName,
+ 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}`,
+ };
+ arr.push(node);
+ });
+ state.allEecProduct = arr;
+ filterProduct();
+ })
.catch((err) => {
state.m_PageLoading = false;
});
+};
+const initComanyData = () => {
+ axios({
+ method: 'get',
+ url: 'static/EecProductData/CompanyData.json',
+ })
+ .then((res) => {
+ let result = res.data;
+ state.factoryList = result.map((item: any) => {
+ return {
+ CompanyId: item.CompanyId,
+ CompanyAllName: item.CompanyAllName,
+ CompanyAbbName: item.CompanyAbbName,
+ Type: item.Type,
+ Catalog: item.CatalogIDs
+ };
+ });
+ state.factoryList.unshift({ CompanyId: '-99', CompanyAllName: '鍏ㄩ儴', CompanyAbbName: '鍏ㄩ儴', Type: [], CatalogIDs: null });
+ })
+ .catch((err) => { });
};
// 绛涢�夋煡璇㈡暟鎹�
const filterProduct = () => {
@@ -310,14 +369,31 @@
return item.Type === state.m_formData.ProductType;
});
- if (state.m_formData.RecordNumber !== '') {
- state.filterProductData = state.filterProductData.filter((item) => {
- return item.RecordNumber.indexOf(state.m_formData.RecordNumber) > -1;
- });
- }
if (state.m_formData.ProductModel !== '') {
state.filterProductData = state.filterProductData.filter((item) => {
return item.Model.indexOf(state.m_formData.ProductModel) > -1;
+ });
+ }
+
+ // 鎼滅储绛涢��
+ if (state.m_formData.ProductModel !== '') {
+ state.filterProductData = state.filterProductData.filter((item) => {
+ return item.Model.indexOf(state.m_formData.ProductModel) > -1;
+ });
+ }
+
+ // 鑳芥晥绛夌骇绛涢��
+ if (state.selEec !== 0) {
+ state.filterProductData = state.filterProductData.filter((item) => {
+ return Number(item.EnergyEfficiencyClass) === Number(state.selEec);
+ });
+ }
+ // 鍘傚晢绛涢��
+ if (state.selFactory !== '-99') {
+ state.filterProductData = state.filterProductData.filter((item) => {
+ console.log(state.factoryIncludeType,item.Type,394)
+
+ return state.factoryIncludeType.includes(item.Type);
});
}
state.m_dispTableData = getSelectPageData(state.filterProductData);
@@ -338,6 +414,15 @@
state.m_paginationConfig.currentPage = 1;
initData();
};
+const changeFactory = () => {
+ state.m_paginationConfig.currentPage = 1;
+ state.factoryIncludeType = getFactoryType(state.selFactory);
+ initData();
+}
+const changeEecLevel = () => {
+ state.m_paginationConfig.currentPage = 1;
+ initData();
+}
const clickDetail = async (row: any) => {
if (row.Id.includes('Pupm')) {
isPumpProduct.value = true;
@@ -345,7 +430,6 @@
isPumpProduct.value = false;
getProductDetail(row.Model);
}
- console.log(row);
state.m_detailDialogInfo = row;
dialogVisible.value = true;
@@ -386,15 +470,15 @@
pageSize: 10,
isOld: 0,
},
- })
- .then((res) => {
- let result = res.data.data;
- if (!result.list.length) {
- reslvoe([]);
- }
- reslvoe(result.list);
- })
- .catch((err) => { });
+ }).then((res) => {
+ let result = res.data.data;
+ if (!result.list.length) {
+ reslvoe([]);
+ }
+ reslvoe(result.list);
+ }).catch((err) => {
+
+ });
});
};
@@ -439,6 +523,16 @@
RecordTime: '',
};
};
+const getFactoryType = (factory) => {
+ let factoryType = [];
+ state.factoryList.forEach((item) => {
+ if (Number(item.CompanyId) === Number(factory)) {
+ factoryType = item.Type;
+ }
+ });
+ return factoryType;
+}
+
const resertForm = () => {
state.m_formData.ProductModel = '';
@@ -458,52 +552,288 @@
</script>
<style lang="scss" scoped>
-.flag-search-div {
- box-sizing: border-box;
- padding: 10px;
- width: 100%;
- height: 100%;
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
+@import url('@/styles/common.scss');
- .flag-search-content {
+.eec-label-page {
+ width: 100%;
+ background: linear-gradient(180deg, rgba(1, 20, 47, 0.5) 34%, rgba(175, 184, 196, 0.2809) 63%, rgba(0, 0, 0, 0) 100%), rgba(255, 255, 255, 0.4);
+
+ .eec-label-top {
width: 100%;
- // height: calc(100% - 86px);
+ height: 500px;
+ // background-image: url('static/img/eec-search/eec_label_top.png');
+ // background-size: 100% 100%;
+ // background-repeat: no-repeat;
+ // background-position: 0% 0%;
display: flex;
- flex-direction: column;
justify-content: center;
align-items: center;
+
+
+
+
+
}
}
-.detail-text {
- font-family: Microsoft YaHei;
- font-size: 16px;
- font-weight: 400;
- color: #4a4a4a;
-}
-
-.top {
- width: 100%;
- height: 150px;
- background: url(https://www.energylabel.com.cn/static/img/topbackgroundpicture.5b933b83.jpg) no-repeat;
- background-size: 100% 150px;
+.page {
+ background-color: rgba(255, 255, 255, 1);
position: relative;
+ width: 100%;
overflow: hidden;
- display: flex;
- align-items: center;
- justify-content: center;
- span {
- color: #fff;
- font-size: 36px;
+ .image_1 {
+ width: 100%;
+ height: 830px;
+ }
+
+ .image_2 {
+ width: 100%;
+ }
+
+ .block_1 {
+ position: absolute;
+ left: -1px;
+ width: 100%;
+ height: 2695px;
+ background: url(https://lanhu-oss-2537-2.lanhuapp.com/MasterDDSSlicePNGa9c0eaf63702e9546db5cd3481403d4f.png) 100% no-repeat;
+ background-size: 100% 100%;
+
+ .image_3 {
+ width: 100%;
+ height: 141px;
+ margin-top: -141px;
+ }
+
+ .block_2 {
+ position: relative;
+ width: 100%;
+ height: 2696px;
+ margin-bottom: 1px;
+
+ .text_1 {
+ text-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3);
+ width: 604px;
+ height: 141px;
+ overflow-wrap: break-word;
+ color: rgba(255, 255, 255, 1);
+ font-size: 100px;
+ font-family: Source Han Serif CN-Heavy;
+ font-weight: 900;
+ text-align: left;
+ white-space: nowrap;
+ line-height: 144px;
+ margin: 40px 0 0 1229px;
+ }
+
+ .paragraph_1 {
+ width: 600px;
+ height: 102px;
+ overflow-wrap: break-word;
+ color: rgba(226, 225, 225, 1);
+ font-size: 36px;
+ font-family: Source Han Serif CN-SemiBold;
+ font-weight: normal;
+ text-align: right;
+ line-height: 52px;
+ margin: 13px 0 0 1220px;
+ }
+
+ .section_1 {
+ width: 784px;
+ height: 67px;
+ margin: 40px 0 0 1062px;
+
+ .text-wrapper_1 {
+ box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.3);
+ background-color: rgba(216, 216, 216, 1);
+ border-radius: 15px;
+ height: 67px;
+ width: 250px;
+
+ .text_2 {
+ width: 223px;
+ height: 50px;
+ overflow-wrap: break-word;
+ color: rgba(61, 61, 61, 1);
+ font-size: 36px;
+ font-family: Source Han Serif CN-SemiBold;
+ font-weight: normal;
+ text-align: center;
+ white-space: nowrap;
+ line-height: 52px;
+ margin: 8px 0 0 14px;
+ }
+ }
+
+ .group_1 {
+ box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.3);
+ height: 67px;
+ margin-left: 16px;
+ width: 250px;
+
+ .text-wrapper_2 {
+ background-color: rgba(216, 216, 216, 1);
+ border-radius: 15px;
+ height: 67px;
+ width: 250px;
+
+ .text_3 {
+ width: 223px;
+ height: 50px;
+ overflow-wrap: break-word;
+ color: rgba(61, 61, 61, 1);
+ font-size: 36px;
+ font-family: Source Han Serif CN-SemiBold;
+ font-weight: normal;
+ text-align: center;
+ white-space: nowrap;
+ line-height: 52px;
+ margin: 8px 0 0 14px;
+ }
+ }
+ }
+
+ .group_2 {
+ box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.3);
+ height: 67px;
+ margin-left: 18px;
+ width: 250px;
+
+ .text-wrapper_3 {
+ background-color: rgba(216, 216, 216, 1);
+ border-radius: 15px;
+ height: 67px;
+ width: 250px;
+
+ .text_4 {
+ width: 223px;
+ height: 50px;
+ overflow-wrap: break-word;
+ color: rgba(61, 61, 61, 1);
+ font-size: 36px;
+ font-family: Source Han Serif CN-SemiBold;
+ font-weight: normal;
+ text-align: center;
+ white-space: nowrap;
+ line-height: 52px;
+ margin: 8px 0 0 14px;
+ }
+ }
+ }
+ }
+
+ .section_2 {
+ border-radius: 25px;
+ height: 67px;
+ width: 998px;
+ margin: 130px 0 0 462px;
+
+ .image-wrapper_1 {
+ background-color: rgba(0, 58, 142, 1);
+ height: 67px;
+ margin-left: 899px;
+ width: 100px;
+
+ .label_1 {
+ width: 47px;
+ height: 47px;
+ margin: 10px 0 0 25px;
+ }
+ }
+ }
+
+ .section_3 {
+ width: 1001px;
+ height: 70px;
+ background-size: 100% 100%;
+ margin: 40px 0 0 460px;
+
+ .text_5 {
+ width: 121px;
+ overflow-wrap: break-word;
+ color: rgba(255, 255, 255, 1);
+ font-size: 24px;
+ font-family: Source Han Sans-Bold;
+ font-weight: 700;
+ text-align: left;
+ white-space: nowrap;
+ }
+
+ .label_2 {
+ width: 24px;
+ height: 24px;
+ margin: 24px 0 0 106px;
+ }
+
+ .text_6 {
+ width: 121px;
+ height: 42px;
+ overflow-wrap: break-word;
+ color: rgba(255, 255, 255, 1);
+ font-size: 24px;
+ font-family: Source Han Sans-Bold;
+ font-weight: 700;
+ text-align: left;
+ white-space: nowrap;
+ line-height: 35px;
+ margin: 18px 0 0 101px;
+ }
+
+ .label_3 {
+ width: 24px;
+ height: 24px;
+ margin: 24px 0 0 106px;
+ }
+
+ .text_7 {
+ width: 121px;
+ height: 42px;
+ overflow-wrap: break-word;
+ color: rgba(255, 255, 255, 1);
+ font-size: 24px;
+ font-family: Source Han Sans-Bold;
+ font-weight: 700;
+ text-align: left;
+ white-space: nowrap;
+ line-height: 35px;
+ margin: 18px 0 0 101px;
+ }
+
+ .label_4 {
+ width: 24px;
+ height: 24px;
+ margin: 24px 24px 0 105px;
+ }
+
+ :deep(.el-select__wrapper) {
+ background-color: var(--theme-color);
+ height: 70px;
+ border-radius: 20px;
+ box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.3)
+ }
+
+ :deep(.el-select__placeholder) {
+ color: #fff;
+ font-size: 24px;
+ text-align: center;
+ }
+
+ :deep(.el-select__caret) {
+ color: #fff;
+ font-size: 24px;
+ }
+ }
+ }
}
}
-.w-180-px {
- width: 10rem;
+.custom-search-btn {
+ background-color: #003a8f;
+ height: 100%;
+ width: 100px;
+ border-top-right-radius: 25px;
+ border-bottom-right-radius: 25px;
}
.table-detail-span {
@@ -516,42 +846,16 @@
gap: 3px;
}
-.detail-icon {
- width: 14px;
- height: 14px;
+
+:deep(.el-input__wrapper) {
+ height: 100%;
+ border-radius: 25px;
+ border-top-right-radius: 0px;
+ border-bottom-right-radius: 0px;
}
-.custom-detail-span {
- font-family: Microsoft YaHei;
- font-weight: 400;
- font-size: 16px;
- color: #000000;
-}
-
-.close-icon-style {
- position: absolute;
- right: -15px;
- top: -15px;
- font-size: 30px;
- background-color: #196dd938;
- width: 30px;
- height: 30px;
- border-radius: 50%;
- display: inline-flex;
- justify-content: center;
- align-items: center;
- cursor: pointer;
- color: #196dd9;
-
- &:hover {
- color: #fff;
- background-color: #196dd9;
- }
-}
-.beianxinxi{
- :deep(.el-form-item__label){
- font-size: 15px;
- }
+:deep(.el-input__wrapper.is-focus) {
+ box-shadow: 0 0 0 1px var(--theme-color) inset;
}
:deep(.el-form--inline .el-form-item) {
@@ -585,7 +889,10 @@
color: #000;
font-weight: bold;
font-size: 20px;
- background-color: #f3f1f1 !important;
+ background-color: #003a8f !important;
+ color: #fff;
+ height: 98px;
+
}
:deep(.custom-table-cell-style) {
@@ -601,4 +908,4 @@
font-weight: 700;
color: #474747;
}
-</style>
+</style>
\ No newline at end of file
--
Gitblit v1.9.3