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
14 KiB
2 lines
14 KiB
"use strict";(self["webpackChunkabcdf"]=self["webpackChunkabcdf"]||[]).push([[581],{3581:function(t,e,i){i.r(e),i.d(e,{default:function(){return g}});var s=function(){var t=this,e=t._self._c;return e("div",[e("div",{staticClass:"product-detail-container"},[e("div",{staticClass:"left-section"},[e("el-carousel",{ref:"carousel",staticClass:"product-carousel",attrs:{height:"500px","indicator-position":"none"},on:{change:t.handleCarouselChange}},t._l(t.productImages,function(t,i){return e("el-carousel-item",{key:i},[e("img",{staticClass:"carousel-img",attrs:{src:t,alt:`商品图片${i+1}`}})])}),1),e("div",{staticClass:"hint-text"},[t._v(" 温馨提示：以上图片仅供参考，若图片与实物有所不同，则以实物为准。 ")]),e("div",{staticClass:"image-indicators"},t._l(t.productImages,function(i,s){return e("div",{key:s,staticClass:"indicator-item",class:{active:t.activeIndex===s},on:{click:function(e){return t.handleIndicatorClick(s)}}},[e("img",{staticClass:"indicator-img",attrs:{src:i,alt:`缩略图${s+1}`}})])}),0)],1),e("div",{staticClass:"right-section"},[e("h2",{staticClass:"product-title"},[t._v(" "+t._s(t.productTitle)+" "),e("span",{staticClass:"product-count"},[t._v("["+t._s(t.productCount)+"]")])]),e("div",{staticClass:"product-tags"},[e("el-tag",{attrs:{type:"info",size:"mini"}},[t._v("[产品标签]")]),e("span",{staticClass:"subtitle"},[t._v(t._s(t.productSubtitle))])],1),e("div",{staticClass:"price-info"},[e("span",{staticClass:"price-label"},[t._v("售价")]),e("span",{staticClass:"price-amount"},[t._v("¥"+t._s(t.productPrice))]),e("span",{staticClass:"sales-volume"},[t._v("已售 "+t._s(t.salesVolume)+"万")])]),e("div",{staticClass:"product-attr"},[e("div",{staticClass:"attr-item"},[e("span",{staticClass:"attr-label"},[t._v("起订量")]),e("span",{staticClass:"attr-value"},[t._v(t._s(t.moq))])]),e("div",{staticClass:"attr-item"},[e("span",{staticClass:"attr-label"},[t._v("收货方式")]),e("span",{staticClass:"attr-value"},[t._v(t._s(t.deliveryMethod))])]),e("div",{staticClass:"attr-item spec-group"},[e("span",{staticClass:"attr-label"},[t._v("商品规格")]),e("div",{staticClass:"custom-radio-group"},t._l(t.productSpecs,function(i,s){return e("label",{key:s,staticClass:"custom-radio",class:{"is-checked":t.selectedSpec===i},on:{click:function(e){t.selectedSpec=i}}},[e("span",{staticClass:"radio-text"},[t._v(t._s(i))])])}),0)]),e("div",{staticClass:"attr-item"},[e("span",{staticClass:"attr-label"},[t._v("发货地")]),e("span",{staticClass:"attr-value"},[t._v(t._s(t.origin))])]),e("div",{staticClass:"attr-item"},[e("span",{staticClass:"attr-label"},[t._v("其他")]),e("span",{staticClass:"attr-value"},[t._v(t._s(t.otherInfo))])]),e("div",{staticClass:"attr-item"},[e("span",{staticClass:"attr-label"},[t._v("配送范围")]),e("span",{staticClass:"attr-value"},[t._v(t._s(t.deliveryRange))])])]),e("div",{staticClass:"quantity-control"},[e("el-button",{attrs:{icon:"el-icon-minus",circle:""},on:{click:t.decreaseQuantity}}),e("span",{staticClass:"quantity-value"},[t._v(t._s(t.quantity))]),e("el-button",{attrs:{icon:"el-icon-plus",circle:""},on:{click:t.increaseQuantity}}),e("el-button",{staticClass:"buy-btn",attrs:{type:"primary"}},[t._v("一口价购买")]),e("el-button",{staticClass:"cart-btn",attrs:{type:"success"}},[t._v("加入购物车")]),e("el-button",{staticClass:"bargain-btn",attrs:{type:"info"}},[t._v("议价")]),e("el-button",{staticClass:"share-btn",attrs:{icon:"el-icon-share",circle:""},on:{click:t.handleShare}})],1)])]),e("div",{staticClass:"product-bottom"},[e("div",{staticClass:"hot-recommend-sidebar"},[e("div",{staticClass:"hot-title"},[t._v("热销推荐")]),t._l(t.hotRecommendData,function(i,s){return e("div",{key:s,staticClass:"product-item"},[e("img",{directives:[{name:"lazy",rawName:"v-lazy",value:i.imgUrl,expression:"item.imgUrl"}],attrs:{alt:""}}),e("div",{staticClass:"product-name"},[t._v(t._s(i.title))]),e("div",{staticClass:"product-price"},[t._v("￥"+t._s(i.price))])])})],2),e("div",{staticClass:"product-right"},[e("div",{staticClass:"product-tabs"},[e("span",{class:["tab-item",{active:!t.tabIndex}],on:{click:function(e){t.tabIndex=0}}},[t._v("商品详情")]),e("span",{class:["tab-item",{active:t.tabIndex}],on:{click:function(e){t.tabIndex=1}}},[t._v("商品评价(125)")])]),e("div",{directives:[{name:"show",rawName:"v-show",value:!t.tabIndex,expression:"!tabIndex"}],staticClass:"product-detail-main"}),e("Evaluate",{directives:[{name:"show",rawName:"v-show",value:t.tabIndex,expression:"tabIndex"}]})],1)])])},a=[],r=function(){var t=this,e=t._self._c;return e("div",{staticClass:"product-review-section"},[e("div",{staticClass:"review-header"},[e("div",{staticClass:"rating-box"},[e("div",{staticClass:"rating-score"},[t._v(t._s(t.averageScore)+" 分")]),e("div",{staticClass:"rating-text"},[t._v("综合评分 (共 "+t._s(t.totalReviews)+" 条)")])]),e("div",{staticClass:"filter-tabs"},[e("div",{staticClass:"tab-item",class:{active:"all"===t.activeFilter},on:{click:function(e){return t.handleFilterChange("all")}}},[t._v(" 全部("+t._s(t.totalReviews)+") ")]),e("div",{staticClass:"tab-item",class:{active:"image"===t.activeFilter},on:{click:function(e){return t.handleFilterChange("image")}}},[t._v(" 有图("+t._s(t.hasImageCount)+") ")]),e("div",{staticClass:"tab-item",class:{active:"good"===t.activeFilter},on:{click:function(e){return t.handleFilterChange("good")}}},[t._v(" 好评("+t._s(t.goodReviewsCount)+") ")]),e("div",{staticClass:"tab-item",class:{active:"medium"===t.activeFilter},on:{click:function(e){return t.handleFilterChange("medium")}}},[t._v(" 中评("+t._s(t.mediumReviewsCount)+") ")]),e("div",{staticClass:"tab-item",class:{active:"bad"===t.activeFilter},on:{click:function(e){return t.handleFilterChange("bad")}}},[t._v(" 差评("+t._s(t.badReviewsCount)+") ")])])]),e("div",{staticClass:"review-list"},[t._l(t.currentPageReviews,function(i,s){return e("div",{key:i.id,staticClass:"review-item"},[e("div",{staticClass:"user-info"},[e("img",{staticClass:"avatar",attrs:{src:i.avatar,alt:i.userName+"的头像"}}),e("div",{staticClass:"user-name"},[t._v(t._s(i.userName))]),e("div",{staticClass:"rating-stars"},t._l(5,function(s){return e("span",{key:s},[t._v(" "+t._s(s<=i.rating?"★":"☆")+" ")])}),0)]),e("div",{staticClass:"review-content",class:{empty:!i.content}},[t._v(" "+t._s(i.content||"该用户没有填写评价内容")+" ")]),i.images&&i.images.length?e("div",{staticClass:"review-images"},t._l(i.images,function(s,a){return e("img",{key:a,attrs:{src:s,alt:`${i.userName}的评价图片${a+1}`},on:{click:function(e){return t.openPreview(i.images,a)}}})}),0):t._e(),e("div",{staticClass:"review-time"},[t._v(t._s(i.time))])])}),0===t.filteredReviews.length?e("div",{staticClass:"empty-state"},[e("el-empty",{attrs:{description:"暂无符合条件的评价"}})],1):t._e()],2),t.filteredReviews.length>0?e("div",{staticClass:"pagination-container"},[e("el-pagination",{attrs:{"current-page":t.currentPage,"page-sizes":[5,10,20],"page-size":t.pageSize,layout:"total, sizes, prev, pager, next, jumper",total:t.filteredReviews.length},on:{"size-change":t.handleSizeChange,"current-change":t.handleCurrentChange}})],1):t._e(),e("el-dialog",{attrs:{visible:t.previewVisible,modal:!0,title:`查看图片 ${t.previewIndex+1}/${t.previewImages.length}`,width:"80%",height:"80%","custom-class":"image-preview-dialog","close-on-click-modal":!0},on:{"update:visible":function(e){t.previewVisible=e}}},[e("div",{staticClass:"preview-container"},[e("el-button",{staticClass:"preview-btn prev-btn",attrs:{icon:"el-icon-arrow-left",circle:"",disabled:0===t.previewIndex},on:{click:function(e){return t.changePreview("prev")}}}),e("div",{staticClass:"preview-img-wrapper"},[e("img",{staticClass:"preview-img",attrs:{src:t.previewImages[t.previewIndex],alt:`预览图片 ${t.previewIndex+1}`}})]),e("el-button",{staticClass:"preview-btn next-btn",attrs:{icon:"el-icon-arrow-right",circle:"",disabled:t.previewIndex===t.previewImages.length-1},on:{click:function(e){return t.changePreview("next")}}})],1)])],1)},n=[],c=(i(8111),i(2489),i(8237),i(9143)),l={name:"ProductReviews",components:{ElEmpty:c.Empty,ElPagination:c.Pagination},data(){return{activeFilter:"all",currentPage:1,pageSize:10,reviews:[{id:1,userName:"张**",avatar:"https://picsum.photos/id/64/40/40",rating:5,content:"商品质量很好，超出预期，非常满意的一次购物体验！包装很用心，完全没有损坏，会回购的。",images:["https://picsum.photos/id/26/80/80","https://picsum.photos/id/292/80/80"],time:"2023-10-15 14:30:22"},{id:2,userName:"李**",avatar:"https://picsum.photos/id/65/40/40",rating:4,content:"总体不错，就是物流有点慢，其他都还好，给个四星吧",images:[],time:"2023-10-14 09:15:47"},{id:3,userName:"王**",avatar:"https://picsum.photos/id/66/40/40",rating:5,content:"",images:["https://picsum.photos/id/431/80/80"],time:"2023-10-13 20:45:11"},{id:4,userName:"赵**",avatar:"https://picsum.photos/id/67/40/40",rating:2,content:"不太满意，和描述的有点差距，希望商家能改进",images:[],time:"2023-10-12 16:20:33"},{id:5,userName:"陈**",avatar:"https://picsum.photos/id/68/40/40",rating:5,content:"第二次购买了，品质一如既往的好，推荐给大家！",images:["https://picsum.photos/id/102/80/80","https://picsum.photos/id/103/80/80","https://picsum.photos/id/104/80/80"],time:"2023-10-11 11:05:59"},{id:6,userName:"刘**",avatar:"https://picsum.photos/id/69/40/40",rating:3,content:"一般般吧，没有特别惊艳的地方，价格还算合理",images:[],time:"2023-10-10 18:30:15"},{id:7,userName:"黄**",avatar:"https://picsum.photos/id/70/40/40",rating:5,content:"包装精美，送礼自用都合适，性价比很高",images:["https://picsum.photos/id/105/80/80"],time:"2023-10-09 08:45:27"},{id:8,userName:"周**",avatar:"https://picsum.photos/id/71/40/40",rating:4,content:"东西不错，物流很快，客服态度也好",images:["https://picsum.photos/id/106/80/80"],time:"2023-10-08 15:22:10"},{id:9,userName:"吴**",avatar:"https://picsum.photos/id/72/40/40",rating:5,content:"非常满意，推荐购买！",images:[],time:"2023-10-07 10:15:33"},{id:10,userName:"郑**",avatar:"https://picsum.photos/id/73/40/40",rating:1,content:"很差的购物体验，不会再买了",images:[],time:"2023-10-06 19:40:25"},{id:11,userName:"孙**",avatar:"https://picsum.photos/id/74/40/40",rating:5,content:"质量很好，和图片描述一致，值得购买",images:["https://picsum.photos/id/107/80/80","https://picsum.photos/id/108/80/80"],time:"2023-10-05 09:20:18"},{id:12,userName:"徐**",avatar:"https://picsum.photos/id/75/40/40",rating:4,content:"不错的商品，推荐给朋友了",images:[],time:"2023-10-04 16:50:47"},{id:13,userName:"马**",avatar:"https://picsum.photos/id/76/40/40",rating:5,content:"很好用，已经回购多次",images:["https://picsum.photos/id/109/80/80"],time:"2023-10-03 14:30:55"},{id:14,userName:"朱**",avatar:"https://picsum.photos/id/77/40/40",rating:3,content:"还行吧，没有想象中好",images:[],time:"2023-10-02 11:15:32"},{id:15,userName:"胡**",avatar:"https://picsum.photos/id/78/40/40",rating:5,content:"非常满意的一次购物，五星推荐！",images:["https://picsum.photos/id/110/80/80","https://picsum.photos/id/111/80/80"],time:"2023-10-01 08:40:17"}],previewVisible:!1,previewImages:[],previewIndex:0}},computed:{totalReviews(){return this.reviews.length},hasImageCount(){return this.reviews.filter(t=>t.images&&t.images.length).length},goodReviewsCount(){return this.reviews.filter(t=>t.rating>=4).length},mediumReviewsCount(){return this.reviews.filter(t=>3===t.rating).length},badReviewsCount(){return this.reviews.filter(t=>t.rating<=2).length},averageScore(){const t=this.reviews.reduce((t,e)=>t+e.rating,0);return(t/this.totalReviews).toFixed(1)},filteredReviews(){let t=[...this.reviews];switch(this.activeFilter){case"image":t=t.filter(t=>t.images&&t.images.length);break;case"good":t=t.filter(t=>t.rating>=4);break;case"medium":t=t.filter(t=>3===t.rating);break;case"bad":t=t.filter(t=>t.rating<=2);break;default:break}return t},currentPageReviews(){const t=(this.currentPage-1)*this.pageSize,e=t+this.pageSize;return this.filteredReviews.slice(t,e)}},methods:{handleFilterChange(t){this.activeFilter=t,this.currentPage=1},handleSizeChange(t){this.pageSize=t,this.currentPage=1},handleCurrentChange(t){this.currentPage=t,document.querySelector(".review-list").scrollIntoView({behavior:"smooth"})},openPreview(t,e){this.previewImages=t,this.previewIndex=e,this.previewVisible=!0},changePreview(t){"prev"===t&&this.previewIndex>0?this.previewIndex--:"next"===t&&this.previewIndex<this.previewImages.length-1&&this.previewIndex++,this.$nextTick(()=>{document.querySelector(".el-dialog__title").textContent=`查看图片 ${this.previewIndex+1}/${this.previewImages.length}`})}}},o=l,d=i(1656),p=(0,d.A)(o,r,n,!1,null,"3412a0b2",null),u=p.exports,v={name:"ProductDetail",components:{Evaluate:u},data(){return{productImages:["https://picsum.photos/id/102/500/500","https://picsum.photos/id/103/500/500","https://picsum.photos/id/104/500/500","https://picsum.photos/id/105/500/500"],activeIndex:0,productTitle:"面包",productCount:"52个",productSubtitle:"副标题",productPrice:509,salesVolume:1.22,moq:1,deliveryMethod:"邮寄",productSpecs:["规格一","规格二","规格三","规格四","规格五"],selectedSpec:"规格一",origin:"江苏省苏州市吴中区",otherInfo:"下单填写留言，即免费赠送精美贺卡！",deliveryRange:"全国（可配送至全国1000多个城市，苏州市区内免配送费）",quantity:1,hotRecommendData:[{id:1,imgUrl:"https://picsum.photos/id/103/500/500",title:"北欧花艺素雅仿真花",price:359},{id:2,imgUrl:"https://picsum.photos/id/103/500/500",title:"生日玫瑰鲜花",price:359},{id:3,imgUrl:"https://picsum.photos/id/103/500/500",title:"香雪兰小苍兰鲜花",price:359},{id:4,imgUrl:"https://picsum.photos/id/103/500/500",title:"现代创意简约仿真花艺",price:359}],tabIndex:0}},methods:{handleCarouselChange(t){this.activeIndex=t},handleIndicatorClick(t){this.activeIndex=t,this.$nextTick(()=>{this.$refs.carousel&&this.$refs.carousel.setActiveItem(t)})},decreaseQuantity(){this.quantity>1&&this.quantity--},increaseQuantity(){this.quantity++},handleShare(){this.$message.info("分享功能待实现")}},mounted(){this.$refs.carousel||console.warn("轮播组件未正确加载，请检查ref属性是否设置")}},m=v,h=(0,d.A)(m,s,a,!1,null,"61588775",null),g=h.exports}}]);
|
|
//# sourceMappingURL=581.b9f47383.js.map
|