"use strict";(self["webpackChunkabcdf"]=self["webpackChunkabcdf"]||[]).push([[198],{8198:function(e,t,i){i.r(t),i.d(t,{default:function(){return n}});var a=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:"选择分类"},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:"排序方式"},model:{value:e.selectedSort,callback:function(t){e.selectedSort=t},expression:"selectedSort"}},e._l(e.sortOptions,function(e){return t("el-option",{key:e.value,attrs:{label:e.label,value:e.value}})}),1),t("el-input",{staticClass:"search-input",attrs:{placeholder:"搜索商品",clearable:""},nativeOn:{keyup:function(t){return!t.type.indexOf("key")&&e._k(t.keyCode,"enter",13,t.key,"Enter")?null:e.handleSearch.apply(null,arguments)}},model:{value:e.searchKeyword,callback:function(t){e.searchKeyword=t},expression:"searchKeyword"}},[t("i",{staticClass:"el-icon-search",staticStyle:{"line-height":"3"},attrs:{slot:"suffix"},on:{click:e.handleSearch},slot:"suffix"})])],1):e._e(),t("div",{staticClass:"product-grid"},[e._l(e.visibleProducts,function(i,a){return t("div",{key:a,staticClass:"product-card",on:{click:function(t){return e.goToDetail(i.id)}}},[t("el-image",{directives:[{name:"lazy",rawName:"v-lazy",value:i.image,expression:"product.image"}],staticClass:"product-img",attrs:{alt:i.name,lazy:"",fit:"cover"}},[t("div",{staticClass:"image-placeholder",attrs:{slot:"placeholder"},slot:"placeholder"},[t("i",{staticClass:"el-icon-loading"})])]),i.tag?t("div",{staticClass:"tag",style:{backgroundColor:i.tagColor}},[e._v(" "+e._s(i.tag)+" ")]):e._e(),t("div",{staticClass:"product-info"},[t("div",{staticClass:"product-name"},[e._v(e._s(i.name))]),t("div",{staticClass:"price-row"},[t("span",{staticClass:"current-price"},[e._v("¥"+e._s(i.price))]),i.originalPrice?t("span",{staticClass:"original-price"},[e._v("¥"+e._s(i.originalPrice))]):e._e()]),t("el-button",{staticClass:"cart-btn",attrs:{type:"primary",size:"mini"},on:{click:function(t){return t.preventDefault(),e.addToCart(i)}}},[e._v(" 加入购物车 ")])],1)],1)}),0===e.visibleProducts.length?t("div",{staticClass:"empty-state"},[t("el-empty",{attrs:{description:"暂无商品"}})],1):e._e()],2),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)])},r=[],s=(i(4114),i(8111),i(2489),{name:"ProductGridPage",data(){return{selectedCategory:"",selectedSort:"",searchKeyword:"",showFilter:!0,currentPage:1,pageSize:12,products:[{id:1,name:"产品名称产品名称1",image:"https://picsum.photos/id/101/200/200",price:359,originalPrice:499,tag:"限时折扣",tagColor:"#FF6B6B"},{id:2,name:"产品名称产品名称",image:"https://picsum.photos/id/102/200/200",price:259,originalPrice:329,tag:"新品",tagColor:"#4ECDC4"},{id:3,name:"产品名称产品名称",image:"https://picsum.photos/id/103/200/200",price:159,originalPrice:229,tag:"爆款",tagColor:"#FFD166"},{id:4,name:"产品名称产品名称",image:"https://picsum.photos/id/104/200/200",price:215,originalPrice:299,tag:"推荐",tagColor:"#06D6A0"},{id:5,name:"产品名称产品名称",image:"https://picsum.photos/id/105/200/200",price:299,originalPrice:399,tag:"限时折扣",tagColor:"#FF6B6B"},{id:6,name:"产品名称产品名称",image:"https://picsum.photos/id/106/200/200",price:159,originalPrice:229,tag:"新品",tagColor:"#4ECDC4"},{id:7,name:"产品名称产品名称",image:"https://picsum.photos/id/107/200/200",price:229,originalPrice:329,tag:"爆款",tagColor:"#FFD166"},{id:8,name:"产品名称产品名称",image:"https://picsum.photos/id/108/200/200",price:289,originalPrice:399,tag:"推荐",tagColor:"#06D6A0"},{id:9,name:"产品名称产品名称",image:"https://picsum.photos/id/109/200/200",price:359,originalPrice:499,tag:"限时折扣",tagColor:"#FF6B6B"},{id:10,name:"产品名称产品名称",image:"https://picsum.photos/id/110/200/200",price:159,originalPrice:229,tag:"新品",tagColor:"#4ECDC4"},{id:11,name:"产品名称产品名称",image:"https://picsum.photos/id/111/200/200",price:259,originalPrice:329,tag:"爆款",tagColor:"#FFD166"},{id:12,name:"产品名称产品名称",image:"https://picsum.photos/id/112/200/200",price:299,originalPrice:399,tag:"推荐",tagColor:"#06D6A0"},{id:13,name:"产品名称产品名称",image:"https://picsum.photos/id/113/200/200",price:359,originalPrice:499,tag:"限时折扣",tagColor:"#FF6B6B"},{id:14,name:"产品名称产品名称",image:"https://picsum.photos/id/114/200/200",price:159,originalPrice:229,tag:"新品",tagColor:"#4ECDC4"},{id:15,name:"产品名称产品名称",image:"https://picsum.photos/id/115/200/200",price:259,originalPrice:329,tag:"爆款",tagColor:"#FFD166"},{id:16,name:"产品名称产品名称",image:"https://picsum.photos/id/116/200/200",price:299,originalPrice:399,tag:"推荐",tagColor:"#06D6A0"},{id:17,name:"产品名称产品名称",image:"https://picsum.photos/id/117/200/200",price:359,originalPrice:499,tag:"限时折扣",tagColor:"#FF6B6B"},{id:18,name:"产品名称产品名称",image:"https://picsum.photos/id/118/200/200",price:159,originalPrice:229,tag:"新品",tagColor:"#4ECDC4"},{id:19,name:"产品名称产品名称",image:"https://picsum.photos/id/119/200/200",price:259,originalPrice:329,tag:"爆款",tagColor:"#FFD166"},{id:20,name:"产品名称产品名称",image:"https://picsum.photos/id/120/200/200",price:299,originalPrice:399,tag:"推荐",tagColor:"#06D6A0"}],currentPage:1,pageSize:12,categories:[{label:"全部",value:""},{label:"美食",value:"food"},{label:"生活",value:"life"},{label:"数码",value:"digital"}],sortOptions:[{label:"默认排序",value:""},{label:"价格 ascending",value:"price_asc"},{label:"价格 descending",value:"price_desc"}]}},computed:{filteredProducts(){return this.products.filter(e=>{const t=!this.selectedCategory||e.category===this.selectedCategory,i=!this.searchKeyword||e.name.includes(this.searchKeyword);return t&&i})},sortedProducts(){return"price_asc"===this.selectedSort?this.filteredProducts.sort((e,t)=>e.price-t.price):"price_desc"===this.selectedSort?this.filteredProducts.sort((e,t)=>t.price-e.price):this.filteredProducts},visibleProducts(){const e=(this.currentPage-1)*this.pageSize,t=e+this.pageSize;return this.sortedProducts.slice(e,t)},totalProducts(){return this.sortedProducts.length}},methods:{handleSearch(){this.currentPage=1},handleSizeChange(e){this.pageSize=e,this.currentPage=1},handleCurrentChange(e){this.currentPage=e},addToCart(e){this.$message.success(`${e.name} 已加入购物车`)},goToDetail(e){this.$router.push(`/product/${e}`)}}}),o=s,c=i(1656),l=(0,c.A)(o,a,r,!1,null,"7212ada1",null),n=l.exports}}]);
//# sourceMappingURL=198.45ac7378.js.map