|
|
@@ -10,7 +10,7 @@
|
|
|
</div>
|
|
|
<div class="tui-pro-titbox">
|
|
|
<div class="tui-pro-title app-size-32">{{ data.goodsName }}</div>
|
|
|
- <button open-type="share" class="tui-share-btn tui-share-position">
|
|
|
+ <button open-type="share" class="tui-share-btn tui-share-position" @click="shareFn">
|
|
|
<app-tag type="gray" tui-tag-class="tui-tag-share tui-size" shape="circleLeft" size="small">
|
|
|
<div class="flex-center">
|
|
|
<i class="iconfont iconfenxiang"></i>
|
|
|
@@ -54,89 +54,135 @@
|
|
|
<buy-foot @buy="showPopup" />
|
|
|
<!-- login -->
|
|
|
<go-login :show.sync="loginShow" />
|
|
|
+ <!-- 分享 -->
|
|
|
+ <app-share-mask :show="showShare" text="即可分享商品" @click="hideShare" />
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import AppImg from '@/components/app-img'
|
|
|
-import AppSwiper from '@/components/app-swiper'
|
|
|
-import AppTag from '@/components/module/app-tag.vue'
|
|
|
-import AppTrademark from '@/components/module/app-trademark'
|
|
|
-import BuyFoot from './components/buy-foot.vue'
|
|
|
-import SelPopup from './components/sel-popup.vue'
|
|
|
-import GoLogin from '@/pages/home/components/go-login.vue'
|
|
|
-// api
|
|
|
-import { getDetail } from '@/api/goods'
|
|
|
-export default {
|
|
|
- name: 'goods-detail',
|
|
|
- components: {
|
|
|
- AppSwiper,
|
|
|
- AppTag,
|
|
|
- AppTrademark,
|
|
|
- BuyFoot,
|
|
|
- SelPopup,
|
|
|
- AppImg,
|
|
|
- GoLogin
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- data: {},
|
|
|
- imgList: [],
|
|
|
- buyNum: 1,
|
|
|
- popupShow: false,
|
|
|
- loginShow: false
|
|
|
- }
|
|
|
- },
|
|
|
- onLoad(option) {
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- // this.$util.getCheckLogin().then(res => {
|
|
|
- // if (!res) return false
|
|
|
- // this.init()
|
|
|
- // })
|
|
|
- },
|
|
|
- computed: {
|
|
|
- // imgNormal() {
|
|
|
- // if (!this.$util.isEmpty(this.data)) {
|
|
|
- // return this.data.imgList[0]
|
|
|
- // } else {
|
|
|
- // return ''
|
|
|
- // }
|
|
|
- // }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- init() {
|
|
|
- this._getDetail()
|
|
|
+ import AppImg from '@/components/app-img'
|
|
|
+ import AppSwiper from '@/components/app-swiper'
|
|
|
+ import AppTag from '@/components/module/app-tag.vue'
|
|
|
+ import AppTrademark from '@/components/module/app-trademark'
|
|
|
+ import BuyFoot from './components/buy-foot.vue'
|
|
|
+ import SelPopup from './components/sel-popup.vue'
|
|
|
+ import GoLogin from '@/pages/home/components/go-login.vue'
|
|
|
+ import AppShareMask from '@/components/module/app-share-mask'
|
|
|
+ import { share } from '@/mixins'
|
|
|
+ // api
|
|
|
+ import { getDetail } from '@/api/goods'
|
|
|
+ export default {
|
|
|
+ name: 'goods-detail',
|
|
|
+ mixins: [share],
|
|
|
+ components: {
|
|
|
+ AppSwiper,
|
|
|
+ AppTag,
|
|
|
+ AppTrademark,
|
|
|
+ BuyFoot,
|
|
|
+ SelPopup,
|
|
|
+ AppImg,
|
|
|
+ GoLogin,
|
|
|
+ AppShareMask
|
|
|
},
|
|
|
- _getDetail() {
|
|
|
- getDetail({ id: this.option.id }).then(res => {
|
|
|
- if (this.$util.isEmpty(res.data)) return false
|
|
|
- this.data = res.data
|
|
|
- let newArr = []
|
|
|
- for (let i in res.data.imgList) {
|
|
|
- newArr.push({
|
|
|
- img: res.data.imgList[i]
|
|
|
- })
|
|
|
- }
|
|
|
- this.imgList = newArr
|
|
|
- })
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ data: {},
|
|
|
+ imgList: [],
|
|
|
+ buyNum: 1,
|
|
|
+ popupShow: false,
|
|
|
+ loginShow: false,
|
|
|
+ // share
|
|
|
+ showShare: false
|
|
|
+ }
|
|
|
},
|
|
|
- // 更换数量
|
|
|
- changeNum(e) {
|
|
|
- this.buyNum = e.value
|
|
|
+ onLoad(option) {},
|
|
|
+ mounted() {
|
|
|
+ // this.$util.getCheckLogin().then(res => {
|
|
|
+ // if (!res) return false
|
|
|
+ // this.init()
|
|
|
+ // })
|
|
|
},
|
|
|
- showPopup() {
|
|
|
- if (this.$util.isLogin()) {
|
|
|
- this.popupShow = true
|
|
|
- } else {
|
|
|
- this.loginShow = true
|
|
|
- }
|
|
|
+ computed: {
|
|
|
+ // imgNormal() {
|
|
|
+ // if (!this.$util.isEmpty(this.data)) {
|
|
|
+ // return this.data.imgList[0]
|
|
|
+ // } else {
|
|
|
+ // return ''
|
|
|
+ // }
|
|
|
+ // }
|
|
|
},
|
|
|
- hidePopup() {
|
|
|
- this.popupShow = false
|
|
|
+ methods: {
|
|
|
+ init() {
|
|
|
+ // #ifdef H5
|
|
|
+ // 微信二次分享
|
|
|
+ let href = window.location.href
|
|
|
+ if (href.indexOf('from=singlemessage') > 0) {
|
|
|
+ location.href = `${this.$constant.formal}/#/pages/interest/invite${this.$util.parse(this.option)}`
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ // #endif
|
|
|
+
|
|
|
+ this._getDetail().then(() => {
|
|
|
+ // 设置分享
|
|
|
+ let shareParams = {
|
|
|
+ title: `${this.data.goodsName}`, // 分享标题
|
|
|
+ desc: '这束花不错推荐给你', // 分享内容
|
|
|
+ imgUrl: this.data.smallImgList[0],
|
|
|
+ // #ifdef H5
|
|
|
+ pagePath: `${window.location.protocol}//m.${this.$constant.firstHost}.com/#/pages/goods/detail?id=${this.data.id}`,
|
|
|
+ // #endif
|
|
|
+ // #ifndef H5
|
|
|
+ pagePath: `/pages/goods/detail?id=${this.data.id}`
|
|
|
+ // #endif
|
|
|
+ }
|
|
|
+ this.jweixinFn(shareParams)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ async _getDetail() {
|
|
|
+ await getDetail({ id: this.option.id }).then(res => {
|
|
|
+ if (this.$util.isEmpty(res.data)) return false
|
|
|
+ let newArr = []
|
|
|
+ for (let i in res.data.imgList) {
|
|
|
+ newArr.push({
|
|
|
+ img: res.data.imgList[i]
|
|
|
+ })
|
|
|
+ }
|
|
|
+ this.imgList = newArr
|
|
|
+ // 格式化数据
|
|
|
+ let goodsStyleList = []
|
|
|
+ for (let i in res.data.goodsStyleList) {
|
|
|
+ goodsStyleList.push(res.data.goodsStyleList[i])
|
|
|
+ }
|
|
|
+ res.data.stock = res.data.stock ? parseInt(res.data.stock) : 0
|
|
|
+ res.data.goodsStyleList = goodsStyleList
|
|
|
+
|
|
|
+ this.data = res.data
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 更换数量
|
|
|
+ changeNum(e) {
|
|
|
+ this.buyNum = e.value
|
|
|
+ },
|
|
|
+ showPopup() {
|
|
|
+ if (this.$util.isLogin()) {
|
|
|
+ this.popupShow = true
|
|
|
+ } else {
|
|
|
+ this.loginShow = true
|
|
|
+ }
|
|
|
+ },
|
|
|
+ hidePopup() {
|
|
|
+ this.popupShow = false
|
|
|
+ },
|
|
|
+ // 分享
|
|
|
+ shareFn() {
|
|
|
+ console.log('asdfasdf')
|
|
|
+ this.showShare = true
|
|
|
+ },
|
|
|
+ hideShare() {
|
|
|
+ this.showShare = false
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
-}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|