You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

2 lines
6.8 KiB

1 month ago
"use strict";(self["webpackChunkabcdf"]=self["webpackChunkabcdf"]||[]).push([[4],{9004:function(e,t,a){a.r(t),a.d(t,{default:function(){return n}});a(8111),a(116);var s=function(){var e=this,t=e._self._c;return t("div",{staticClass:"product-grid-page"},[e.showFilter?t("div",{staticClass:"filter-bar"},[t("el-select",{staticClass:"filter-select",attrs:{placeholder:"全部分类"},on:{change:e.handleCategoryChange},model:{value:e.selectedCategory,callback:function(t){e.selectedCategory=t},expression:"selectedCategory"}},e._l(e.categories,function(e){return t("el-option",{key:e.value,attrs:{label:e.label,value:e.value}})}),1),t("el-select",{staticClass:"filter-select",attrs:{placeholder:"综合排序"},on:{change:e.handleSortChange},model:{value:e.selectedSort,callback:function(t){e.selectedSort=t},expression:"selectedSort"}},[t("el-option",{attrs:{label:"综合排序",value:"default"}}),t("el-option",{attrs:{label:"销量↑",value:"sales_asc"}}),t("el-option",{attrs:{label:"销量↓",value:"sales_desc"}}),t("el-option",{attrs:{label:"价格↑",value:"price_asc"}}),t("el-option",{attrs:{label:"价格↓",value:"price_desc"}})],1)],1):e._e(),"search"==e.type?t("div",{staticClass:"result-stats"},[t("span",[e._v("全部结果 >")]),e.searchKeyword?t("span",{staticClass:"keyword"},[e._v('"'+e._s(e.searchKeyword)+'"')]):e._e(),e.selectedCategory&&e.categories.find(t=>t.value===e.selectedCategory)?t("span",{staticClass:"category"},[e._v(' "'+e._s(e.categories.find(t=>t.value===e.selectedCategory).label)+'" ')]):e._e(),t("span",[e._v("共"+e._s(e.totalProducts)+"个结果")])]):e._e(),t("div",{staticClass:"product-grid"},[e._l(e.visibleProducts,function(a,s){return t("div",{key:a.id,staticClass:"product-card",on:{click:function(t){return e.goToDetail(a.id)}}},[t("el-image",{directives:[{name:"lazy",rawName:"v-lazy",value:a.image,expression:"product.image"}],staticClass:"product-img",attrs:{alt:a.name,lazy:"",fit:"cover"}},[t("div",{staticClass:"image-placeholder",attrs:{slot:"placeholder"},slot:"placeholder"},[t("i",{staticClass:"el-icon-loading"})])]),a.tag?t("div",{staticClass:"tag",style:{backgroundColor:a.tagColor}},[e._v(" "+e._s(a.tag)+" ")]):e._e(),t("div",{staticClass:"product-info"},[t("div",{staticClass:"product-name"},[e._v(e._s(a.name))]),t("div",{staticClass:"price-row"},[t("span",{staticClass:"current-price"},[e._v("¥"+e._s(a.price.toFixed(2)))]),a.originalPrice?t("span",{staticClass:"original-price"},[e._v("¥"+e._s(a.originalPrice.toFixed(2)))]):e._e()]),a.sales>0?t("div",{staticClass:"sales-volume"},[t("i",{staticClass:"el-icon-shopping-cart"}),e._v(" 已售 "+e._s(a.sales)+" ")]):e._e(),t("el-button",{staticClass:"cart-btn",attrs:{type:"primary",size:"mini"},on:{click:function(t){return t.preventDefault(),e.addToCart(a)}}},[e._v(" 加入购物车 ")])],1)],1)}),0===e.visibleProducts.length?t("div",{staticClass:"empty-state"},[t("el-empty",{attrs:{description:"暂无符合条件的商品"}})],1):e._e()],2),e.totalProducts>0?t("div",{staticClass:"pagination-container"},[t("el-pagination",{attrs:{"current-page":e.currentPage,"page-sizes":[12,24,36],"page-size":e.pageSize,layout:"total, sizes, prev, pager, next, jumper",total:e.totalProducts},on:{"size-change":e.handleSizeChange,"current-change":e.handleCurrentChange}})],1):e._e()])},i=[],r=(a(4114),a(2489),a(3518)),c={name:"ProductGridPage",data(){return{type:"",searchKeyword:"",selectedCategory:"",selectedSort:"default",showFilter:!0,currentPage:1,pageSize:12,products:[{id:1,name:"无线蓝牙耳机 主动降噪长续航",image:"https://picsum.photos/id/101/300/300",price:359,originalPrice:499,category:"digital",tag:"限时折扣",tagColor:"#FF6B6B",sales:120},{id:2,name:"智能手表 心率监测运动计步",image:"https://picsum.photos/id/102/300/300",price:259,originalPrice:329,category:"digital",tag:"新品",tagColor:"#4ECDC4",sales:86},{id:3,name:"纯棉短袖T恤 宽松休闲",image:"https://picsum.photos/id/103/300/300",price:89,originalPrice:129,category:"life",sales:320},{id:4,name:"新鲜水果礼盒 当季混合装",image:"https://picsum.photos/id/1
//# sourceMappingURL=4.e0df9c1a.js.map