|
@@ -0,0 +1,375 @@
|
|
|
|
+<template>
|
|
|
|
+ <view class="">
|
|
|
|
+ <view class="page">
|
|
|
|
+ <navBar :backType="navBarTitle" :title="navBarTitle?navBarTitle:'详情'" :back="true" color="black"
|
|
|
|
+ background="white" />
|
|
|
|
+ <view class="topImg">
|
|
|
|
+ <u-swiper type='img' radius="0rpx 0rpx 0rpx 40rpx" :list="bannerList" keyName="image" indicator
|
|
|
|
+ indicatorMode="line" :autoplay="true" height="850rpx" imgMode="heightFix" circular
|
|
|
|
+ @change="bannerChange">
|
|
|
|
+ <view slot="indicator">
|
|
|
|
+ </view>
|
|
|
|
+ </u-swiper>
|
|
|
|
+
|
|
|
|
+ <view class="indicatorBox1">
|
|
|
|
+ <view class="indicator1">
|
|
|
|
+ <view class="indicator1__dot1" style="" v-for="(item, index) in bannerList" :key="index"
|
|
|
|
+ :class="[index === currentNum ?'indicator1__dot1--active1':'']">
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ <view class="cen">
|
|
|
|
+ <image class="water" src="/static/index/water.png" mode=""></image>
|
|
|
|
+ <image class="halfC" src="/static/index/halfCircle_275.png" mode=""></image>
|
|
|
|
+ <image class="love" :src="lovePic" mode="" @click="handleCol"></image>
|
|
|
|
+ <view class="txtBox">
|
|
|
|
+ <view class="left">
|
|
|
|
+ {{content.name}}
|
|
|
|
+ </view>
|
|
|
|
+ <view class="right">
|
|
|
|
+ {{totalCount}}人已收藏
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ <!-- <view class="parmasBox" v-for="(item,index) in parmsList" v-if="navBarTitle">
|
|
|
|
+ <view class="con">
|
|
|
|
+ <view class="title">
|
|
|
|
+ {{item.title}}
|
|
|
|
+ </view>
|
|
|
|
+ <view class="list">
|
|
|
|
+ <view class="item" v-for="(item1,index1) in item.list" :class="[index1==ids[index]?'act':'']"
|
|
|
|
+ @click="">
|
|
|
|
+ {{item1.data}}
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ </view> -->
|
|
|
|
+ <view class="parmasBox" v-for="(item,index) in parmsList">
|
|
|
|
+ <view class="con">
|
|
|
|
+ <view class="title">
|
|
|
|
+ {{item.title}}
|
|
|
|
+ </view>
|
|
|
|
+ <view class="list">
|
|
|
|
+ <view class="item" v-for="(item1,index1) in item.list" :class="[item1.isSelect?'act':'']"
|
|
|
|
+ @click="handleSel(item.list,index1,item[index],index)">
|
|
|
|
+ {{item1.data}}
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+ <view class="parmasBox" style="border-bottom: none;">
|
|
|
|
+ <view class="con" @click="handleOpenOrClose(1)">
|
|
|
|
+ <view class="title1">
|
|
|
|
+ <view class="txt">
|
|
|
|
+ 商品描述
|
|
|
|
+ </view>
|
|
|
|
+ <image class="add" :src="addOrLessIcon1" mode="" :style="{height:addOrLessIcon1=='/static/index/shortLine.png'
|
|
|
|
+ ?'2rpx':'22rpx'}"></image>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="des" v-if="show1">
|
|
|
|
+ <u-parse :content="content1"></u-parse>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="bot">
|
|
|
|
+ <view class="left">
|
|
|
|
+ <view class="price">
|
|
|
|
+ ¥{{totalPrice.toFixed(2)}}
|
|
|
|
+ </view>
|
|
|
|
+ <image src="/static/index/arrDown.png" mode=""></image>
|
|
|
|
+ </view>
|
|
|
|
+ <button open-type="share" class="right">
|
|
|
|
+ 一键下单
|
|
|
|
+ </button>
|
|
|
|
+ <!-- <view class="right" @click="testShare">
|
|
|
|
+ 分享
|
|
|
|
+ </view> -->
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+</template>
|
|
|
|
+
|
|
|
|
+<script>
|
|
|
|
+ import {
|
|
|
|
+ addCollReq,
|
|
|
|
+ cancelCollReq,
|
|
|
|
+ getGoodsPriceReq,
|
|
|
|
+ getMyGoodsDetailReq,
|
|
|
|
+ } from '@/api/test/index.js'
|
|
|
|
+
|
|
|
|
+ export default {
|
|
|
|
+ components: {
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+ data() {
|
|
|
|
+ return {
|
|
|
|
+ currIndex1: 0,
|
|
|
|
+
|
|
|
|
+ currentNum: 0,
|
|
|
|
+ show1: false,
|
|
|
|
+ addOrLessIcon1: '/static/index/add.png',
|
|
|
|
+
|
|
|
|
+ lovePic: '',
|
|
|
|
+
|
|
|
|
+ content: null,
|
|
|
|
+
|
|
|
|
+ picBase: this.$picBase,
|
|
|
|
+ bannerList: [],
|
|
|
|
+ parmsList: [],
|
|
|
|
+ content1: '',
|
|
|
|
+
|
|
|
|
+ parmsObj: {},
|
|
|
|
+
|
|
|
|
+ checkFullSel1: [],
|
|
|
|
+ checkFullSel: 0,
|
|
|
|
+ totalPrice: 0,
|
|
|
|
+
|
|
|
|
+ totalCount: 0,
|
|
|
|
+
|
|
|
|
+ navBarTitle: '',
|
|
|
|
+ ids: [],
|
|
|
|
+ cutdownRatio: 1
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ async onLoad(o) {
|
|
|
|
+ // o.id = 20
|
|
|
|
+ if (o.id) {
|
|
|
|
+ // this.ids = JSON.parse(o.ids)
|
|
|
|
+ this.navBarTitle = '首页'
|
|
|
|
+ let res = await getMyGoodsDetailReq({
|
|
|
|
+ id: o.id
|
|
|
|
+ })
|
|
|
|
+ if (res.code == 0) {
|
|
|
|
+ console.log('回显商城详情返回值: ', res);
|
|
|
|
+ this.content = res.data
|
|
|
|
+ this.bannerList = res.data.images
|
|
|
|
+ this.parmsList = res.data.skuParams
|
|
|
|
+ this.totalCount = res.data.collect_total_count
|
|
|
|
+
|
|
|
|
+ this.content1 = res.data.content
|
|
|
|
+ if (this.content.isCollect) {
|
|
|
|
+ this.lovePic = "/static/mall/love.png"
|
|
|
|
+ } else {
|
|
|
|
+ this.lovePic = "/static/mall/no_love.png"
|
|
|
|
+ }
|
|
|
|
+ this.parmsList.forEach((item, index) => {
|
|
|
|
+ this.parmsObj[item.title] = null
|
|
|
|
+ this.checkFullSel1.push(0)
|
|
|
|
+
|
|
|
|
+ })
|
|
|
|
+
|
|
|
|
+ } else {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ title: res.message,
|
|
|
|
+ icon: 'none'
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ } else {
|
|
|
|
+ let res = await getMyGoodsDetailReq({
|
|
|
|
+ id: getApp().mallItem.id
|
|
|
|
+ })
|
|
|
|
+ if (res.code == 0) {
|
|
|
|
+ console.log('进入详情返回值', res);
|
|
|
|
+ this.content = res.data
|
|
|
|
+ this.bannerList = res.data.images
|
|
|
|
+ this.parmsList = res.data.skuParams
|
|
|
|
+ this.totalCount = res.data.collect_total_count
|
|
|
|
+
|
|
|
|
+ this.content1 = res.data.content
|
|
|
|
+ if (this.content.isCollect) {
|
|
|
|
+ this.lovePic = "/static/mall/love.png"
|
|
|
|
+ } else {
|
|
|
|
+ this.lovePic = "/static/mall/no_love.png"
|
|
|
|
+ }
|
|
|
|
+ this.parmsList.forEach((item, index) => {
|
|
|
|
+ this.parmsObj[item.title] = null
|
|
|
|
+ this.checkFullSel1.push(0)
|
|
|
|
+
|
|
|
|
+ })
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ } else {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ title: res.message,
|
|
|
|
+ icon: 'none'
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ // this.content = getApp().mallItem
|
|
|
|
+ // this.bannerList = getApp().mallItem.images
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ // this.parmsList = getApp().mallItem.skuParams
|
|
|
|
+ // this.totalCount = this.content.collect_total_count
|
|
|
|
+
|
|
|
|
+ // this.parmsList.forEach((item, index) => {
|
|
|
|
+ // this.parmsObj[item.title] = null
|
|
|
|
+ // this.checkFullSel1.push(0)
|
|
|
|
+
|
|
|
|
+ // })
|
|
|
|
+
|
|
|
|
+ // this.content1 = getApp().mallItem.content
|
|
|
|
+
|
|
|
|
+ // if (this.content.isCollect) {
|
|
|
|
+ // this.lovePic = "/static/mall/love.png"
|
|
|
|
+ // } else {
|
|
|
|
+ // this.lovePic = "/static/mall/no_love.png"
|
|
|
|
+ // }
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ watch: {
|
|
|
|
+ checkFullSel: {
|
|
|
|
+ async handler(n, o) {
|
|
|
|
+ let res = this.checkFullSel1.every((item, index) => {
|
|
|
|
+ return item == 1
|
|
|
|
+ })
|
|
|
|
+ if (res) {
|
|
|
|
+ let parms = []
|
|
|
|
+ Object.keys(this.parmsObj).forEach((item4, index8) => {
|
|
|
|
+ parms.push(this.parmsObj[item4])
|
|
|
|
+ })
|
|
|
|
+ console.log(parms);
|
|
|
|
+ let res = await getGoodsPriceReq({
|
|
|
|
+ goods_id: this.content.id,
|
|
|
|
+ stock: parms
|
|
|
|
+ })
|
|
|
|
+ if (res.code == 0) {
|
|
|
|
+ console.log(res);
|
|
|
|
+
|
|
|
|
+ this.totalPrice = res.data * this.cutdownRatio
|
|
|
|
+ } else {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ title: res.message,
|
|
|
|
+ icon: 'none'
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ onShow() {
|
|
|
|
+ this.cutdownRatio = this.$getCutDown()
|
|
|
|
+ },
|
|
|
|
+ onShareAppMessage(params) {
|
|
|
|
+ let ids = []
|
|
|
|
+ this.parmsList.forEach((item, index) => {
|
|
|
|
+ item.list.forEach((item1, index1) => {
|
|
|
|
+ if (item1.isSelect) {
|
|
|
|
+ ids.push(index1)
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ })
|
|
|
|
+ console.log('选中的二维iindex数组', ids);
|
|
|
|
+ if (params.from === 'button' || params.from === 'menu') {
|
|
|
|
+ return {
|
|
|
|
+ title: this.content.name,
|
|
|
|
+ imageUrl: this.$picBase + this.content.cover,
|
|
|
|
+ path: '/pages/mall/detail/index?id=' + this.content.id + '&ids=' + JSON.stringify(ids),
|
|
|
|
+ mpId: this.$appId,
|
|
|
|
+ type: this.$shareType,
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ testShare() {
|
|
|
|
+ console.log('parmsList', this.parmsList);
|
|
|
|
+ let ids = []
|
|
|
|
+ this.parmsList.forEach((item, index) => {
|
|
|
|
+ item.list.forEach((item1, index1) => {
|
|
|
|
+ if (item1.isSelect) {
|
|
|
|
+ ids.push(index1)
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ })
|
|
|
|
+
|
|
|
|
+ console.log('选中的二维iindex数组', ids);
|
|
|
|
+ },
|
|
|
|
+ handleSel(item, index1, outer, pindex) {
|
|
|
|
+ console.log('this.checkFullSel1', this.checkFullSel1);
|
|
|
|
+
|
|
|
|
+ this.checkFullSel = Date.now()
|
|
|
|
+ item.forEach(async (item2, index) => {
|
|
|
|
+ item2.isSelect = 0
|
|
|
|
+ if (index == index1) {
|
|
|
|
+ item[index1].isSelect = 1
|
|
|
|
+
|
|
|
|
+ this.parmsObj[item[index1].title] = {
|
|
|
|
+ classify: item[index1].title,
|
|
|
|
+ value: item[index1].data
|
|
|
|
+ }
|
|
|
|
+ this.checkFullSel1[pindex] = 1
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ console.log('this.parmsObj', this.parmsObj);
|
|
|
|
+ },
|
|
|
|
+ bannerChange(e) {
|
|
|
|
+ this.currentNum = e.current
|
|
|
|
+ },
|
|
|
|
+ async handleCol() {
|
|
|
|
+ if (this.lovePic == "/static/mall/no_love.png") {
|
|
|
|
+ let res = await addCollReq({
|
|
|
|
+ id: this.content.id,
|
|
|
|
+ })
|
|
|
|
+ if (res.code == 0) {
|
|
|
|
+ console.log('添加收藏返回值: ', res);
|
|
|
|
+ this.$toast('收藏成功')
|
|
|
|
+ this.totalCount += 1
|
|
|
|
+ if (this.lovePic == "/static/mall/love.png") {
|
|
|
|
+ this.lovePic = "/static/mall/no_love.png"
|
|
|
|
+ } else {
|
|
|
|
+ this.lovePic = "/static/mall/love.png"
|
|
|
|
+ }
|
|
|
|
+ } else {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ title: res.message,
|
|
|
|
+ icon: 'none'
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ } else {
|
|
|
|
+ let res = await cancelCollReq({
|
|
|
|
+ id: this.content.id,
|
|
|
|
+ })
|
|
|
|
+ if (res.code == 0) {
|
|
|
|
+ console.log('取消收藏返回值: ', res);
|
|
|
|
+ this.$toast('取消收藏成功')
|
|
|
|
+ this.totalCount -= 1
|
|
|
|
+ if (this.lovePic == "/static/mall/love.png") {
|
|
|
|
+ this.lovePic = "/static/mall/no_love.png"
|
|
|
|
+ } else {
|
|
|
|
+ this.lovePic = "/static/mall/love.png"
|
|
|
|
+ }
|
|
|
|
+ } else {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ title: res.message,
|
|
|
|
+ icon: 'none'
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ handleOpenOrClose(i) {
|
|
|
|
+ if (this['addOrLessIcon' + i] == '/static/index/shortLine.png') {
|
|
|
|
+ this['addOrLessIcon' + i] = '/static/index/add.png'
|
|
|
|
+ this['show' + i] = false
|
|
|
|
+ } else if (this['addOrLessIcon' + i] == '/static/index/add.png') {
|
|
|
|
+ this['addOrLessIcon' + i] = '/static/index/shortLine.png'
|
|
|
|
+ this['show' + i] = true
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+</script>
|
|
|
|
+
|
|
|
|
+<style lang="scss" scoped>
|
|
|
|
+ @import "./index.scss";
|
|
|
|
+</style>
|