tanghaolin
2025-02-14 8775f9f881574e8cd22e9b44a14c30711097d1fe
src/views/IndustrialSoftware.vue
@@ -92,8 +92,85 @@
                     <el-rate v-model="app.rating" disabled />
                     <span class="text-gray-400 text-sm">{{ app.date }}</span>
                  </div> -->
                     <div class="link-btn" @click="handleBuyClick(app.id)">立即购入</div>
                     <div class="flex justify-between gap-4">
                        <div class="link-btn" @click="handleBuyClick(app.id)">
                           <svg
                              t="1739504206748"
                              class="svg-size-style"
                              viewBox="0 0 1024 1024"
                              version="1.1"
                              xmlns="http://www.w3.org/2000/svg"
                              p-id="35851"
                              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="35852"
                                 class="icon-path"
                              ></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="35853"
                                 class="icon-path"
                              ></path>
                           </svg>
                           详细
                        </div>
                        <div class="link-btn" @click="handleCertificateClick(app)">
                           <svg
                              t="1739503834540"
                              class="svg-size-style"
                              viewBox="0 0 1024 1024"
                              version="1.1"
                              xmlns="http://www.w3.org/2000/svg"
                              p-id="34740"
                              width="128"
                              height="128"
                           >
                              <path
                                 d="M0 115.2m76.8 0l870.4 0q76.8 0 76.8 76.8l0 640q0 76.8-76.8 76.8l-870.4 0q-76.8 0-76.8-76.8l0-640q0-76.8 76.8-76.8Z"
                                 fill="#1989FA"
                                 opacity=".3"
                                 p-id="34741"
                                 class="icon-path"
                              ></path>
                              <path
                                 d="M563.2 396.8m25.6 0l281.6 0q25.6 0 25.6 25.6l0 0q0 25.6-25.6 25.6l-281.6 0q-25.6 0-25.6-25.6l0 0q0-25.6 25.6-25.6Z"
                                 fill="#1989FA"
                                 p-id="34742"
                                 class="icon-path"
                              ></path>
                              <path
                                 d="M563.2 512m25.6 0l281.6 0q25.6 0 25.6 25.6l0 0q0 25.6-25.6 25.6l-281.6 0q-25.6 0-25.6-25.6l0 0q0-25.6 25.6-25.6Z"
                                 fill="#1989FA"
                                 p-id="34743"
                                 class="icon-path"
                              ></path>
                              <path
                                 d="M563.2 640m25.6 0l140.8 0q25.6 0 25.6 25.6l0 0q0 25.6-25.6 25.6l-140.8 0q-25.6 0-25.6-25.6l0 0q0-25.6 25.6-25.6Z"
                                 fill="#1989FA"
                                 p-id="34744"
                                 class="icon-path"
                              ></path>
                              <path
                                 d="M294.4 422.4m-140.8 0a140.8 140.8 0 1 0 281.6 0 140.8 140.8 0 1 0-281.6 0Z"
                                 fill="#1989FA"
                                 p-id="34745"
                                 class="icon-path"
                              ></path>
                              <path
                                 d="M261.1584 611.5328l-73.0624 126.5536-88.6912-51.2 69.0432-119.5776a191.3088 191.3088 0 0 0 92.7104 44.224z m162.816-47.4496l66.9696 116.0064-88.6784 51.2-69.6832-120.6912a191.4496 191.4496 0 0 0 91.392-46.5152z"
                                 fill="#1989FA"
                                 p-id="34746"
                                 class="icon-path"
                              ></path></svg
                           >证书
                        </div>
                     </div>
                  </div>
                  <template #content>
                     <div class="goods-tip-content" style="white-space: pre-wrap">{{ app.Tip }}</div>
@@ -106,16 +183,29 @@
         <div class="flex justify-center mt-8">
            <el-pagination
               v-model:current-page="m_paginationConfig.currentPage"
               v-model:page-size="m_paginationConfig.pageSize"
               :page-sizes="[10, 50, 100, 200]"
               :page-size="12"
               :background="true"
               layout="total, sizes, prev, pager, next, jumper"
               layout="total,  prev, pager, next, jumper"
               :total="filterProductData.length"
               @size-change="handleSizeChange"
               @current-change="handleCurrentChange"
            />
         </div>
      </div>
      <el-dialog v-model="dialogVisibleCertifcate" title="" :show-close="false" align-center fullscreen>
         <div class="h-full flex justify-center">
            <div style="position: relative">
               <img :src="m_curCertificatePath" />
               <span @click="dialogVisibleCertifcate = false" class="close-icon-style"> × </span>
            </div>
         </div>
         <template #footer>
            <div class="dialog-footer">
               <!-- <el-button type="primary" @click="dialogVisible = false"> 确定 </el-button> -->
            </div>
         </template>
      </el-dialog>
   </div>
</template>
@@ -145,12 +235,15 @@
];
const m_PageLoading = ref(false);
const dialogVisibleCertifcate = ref(false);
// 选中状态
const typeSelect = ref(1);
const factorySelect = ref('-99');
const factoryIncludeType = ref(null);
const EecSelect = ref(0);
const m_curCertificatePath = ref('');
const EecLevelEnum = {
   1: { name: '一级能效', icon: EecLevel1 },
@@ -295,13 +388,17 @@
   }
   router.push(`/product/${currentProduct.Id}`);
};
const handleCertificateClick = (row: any) => {
   dialogVisibleCertifcate.value = true;
   m_curCertificatePath.value = row.CertificatePath;
};
const handleEecLevel = (tag: number) => {
   EecSelect.value = tag;
   filterProduct();
};
</script>
<style scoped>
<style lang="scss" scoped>
.w-100 {
   width: 100%;
}
@@ -398,24 +495,31 @@
}
.link-btn {
   display: inline-block;
   display: inline-flex;
   width: 100%;
   height: 32px;
   font-size: 14px;
   line-height: 30px;
   background: #fff;
   color: #e65650;
   color: #1592fc;
   border: 1px solid #e2e2e2;
   border-radius: 20px;
   text-align: center;
   margin-top: 3px;
   box-sizing: border-box;
   padding: 0 25px;
   align-items: center;
   gap: 15px;
}
.link-btn:hover {
   background: #e65650;
   background: #1592fc;
   color: #fff;
   cursor: pointer;
   .icon-path {
      fill: #fff;
   }
}
.goods-price {
@@ -538,7 +642,30 @@
   color: #fff;
   font-size: 12px;
}
.svg-size-style {
   width: 16px;
   height: 16px;
}
.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;
   }
}
:deep(.el-button--default) {
   --el-button-bg-color: transparent;
   --el-button-border-color: transparent;