1
|
<template>
|
1
|
<template>
|
2
|
<div class="layout">
|
2
|
<div class="layout">
|
3
|
- <LayoutHeader class="layout-header" :show-back="true" :key="productId">
|
3
|
+ <LayoutHeader class="layout-header" :show-back="true" :title="title" ref="header">
|
4
|
<transition name="fade">
|
4
|
<transition name="fade">
|
5
|
<img-size v-show="headThumbnailVisible" class="title-thumbnail" :src="imageList && imageList[0] && imageList[0].image_url" :width="300" :height="300"/>
|
5
|
<img-size v-show="headThumbnailVisible" class="title-thumbnail" :src="imageList && imageList[0] && imageList[0].image_url" :width="300" :height="300"/>
|
6
|
</transition>
|
6
|
</transition>
|
|
@@ -180,9 +180,21 @@ export default { |
|
@@ -180,9 +180,21 @@ export default { |
180
|
sizeList() {
|
180
|
sizeList() {
|
181
|
return get(this.productDetail, 'goods_list[0].size_list', null);
|
181
|
return get(this.productDetail, 'goods_list[0].size_list', null);
|
182
|
},
|
182
|
},
|
|
|
183
|
+ title() {
|
|
|
184
|
+ return get(this.productDetail, 'product_name', '商品详情');
|
|
|
185
|
+ },
|
|
|
186
|
+ },
|
|
|
187
|
+ watch: {
|
|
|
188
|
+ title: {
|
|
|
189
|
+ handler() {
|
|
|
190
|
+ this.setTitle();
|
|
|
191
|
+ },
|
|
|
192
|
+ immediate: true,
|
|
|
193
|
+ },
|
183
|
},
|
194
|
},
|
184
|
mounted() {
|
195
|
mounted() {
|
185
|
this.imageHideThreadhold = -window.innerWidth * 0.693;
|
196
|
this.imageHideThreadhold = -window.innerWidth * 0.693;
|
|
|
197
|
+
|
186
|
},
|
198
|
},
|
187
|
activated() {
|
199
|
activated() {
|
188
|
if (this.productId !== this.productDetail.product_id) {
|
200
|
if (this.productId !== this.productDetail.product_id) {
|
|
@@ -191,6 +203,15 @@ export default { |
|
@@ -191,6 +203,15 @@ export default { |
191
|
},
|
203
|
},
|
192
|
methods: {
|
204
|
methods: {
|
193
|
...mapActions(['fetchProductInfo', 'fetchTop3', 'fetchFav', 'toggleFav', 'updateTradeInfo', 'getSelectedTradeProduct', 'payment']),
|
205
|
...mapActions(['fetchProductInfo', 'fetchTop3', 'fetchFav', 'toggleFav', 'updateTradeInfo', 'getSelectedTradeProduct', 'payment']),
|
|
|
206
|
+ setTitle() {
|
|
|
207
|
+ if (this.productId === this.productDetail.product_id) {
|
|
|
208
|
+ if (this.$refs.header && this.$refs.header.setTitle) {
|
|
|
209
|
+ this.$refs.header.setTitle(this.title);
|
|
|
210
|
+ } else if (document) {
|
|
|
211
|
+ document.title = this.title;
|
|
|
212
|
+ }
|
|
|
213
|
+ }
|
|
|
214
|
+ },
|
194
|
refresh() {
|
215
|
refresh() {
|
195
|
this.$refs.slide.refresh();
|
216
|
this.$refs.slide.refresh();
|
196
|
this.headThumbnailVisible = false;
|
217
|
this.headThumbnailVisible = false;
|
|
@@ -248,7 +269,7 @@ export default { |
|
@@ -248,7 +269,7 @@ export default { |
248
|
return;
|
269
|
return;
|
249
|
}
|
270
|
}
|
250
|
|
271
|
|
251
|
- this.toggleFav({ productId: this.productId, isFav }).then(() => {
|
272
|
+ this.toggleFav({productId: this.productId, isFav}).then(() => {
|
252
|
const txt = isFav ? '收藏成功' : '取消收藏成功';
|
273
|
const txt = isFav ? '收藏成功' : '取消收藏成功';
|
253
|
|
274
|
|
254
|
this.$createToast({
|
275
|
this.$createToast({
|