diff --git a/src/components/CommodityCard/CommodityCard.vue b/src/components/CommodityCard/CommodityCard.vue
index 7cce3d2..3ade7d2 100644
--- a/src/components/CommodityCard/CommodityCard.vue
+++ b/src/components/CommodityCard/CommodityCard.vue
@@ -3,11 +3,13 @@
     class="card"
     @tap="toGoods(goods.id?goods.id:goods.pid,goods.sk_id)"
   >
-		<easy-loadimage mode="widthFix"
-			:scroll-top="scrollTop"
-			:image-src="goods.imgurl?goods.imgurl:goods.pic"
-			:viewHeight="viewHeight"></easy-loadimage>
-<!-- 	<image
+    <easy-loadimage
+      mode="widthFix"
+      :scroll-top="scrollTop"
+      :image-src="goods.imgurl?goods.imgurl:goods.pic"
+      :viewHeight="viewHeight"
+    ></easy-loadimage>
+    <!-- 	<image
       mode="widthFix"
       :src="goods.imgurl?goods.imgurl:goods.pic"
     ></image> -->
@@ -29,7 +31,7 @@
 import easyLoadimage from '@/components/EasyLoadimage/EasyLoadimage.vue'
 // const MockData = require('@/static/easy-loadimage/mock-data.json')
 export default {
-  components:{easyLoadimage},
+  components: { easyLoadimage },
   props: {
     /**
     * 商品数据
@@ -44,22 +46,22 @@ export default {
       trade_num: String,
       goodType: String,
     },
-	scrollTop:Number,
-	viewHeight:Number,
+    scrollTop: Number,
+    viewHeight: Number,
   },
   created () {
   },
   data () {
     return {
-	  
+
     }
   },
 
   methods: {
     toGoods (id, skId) {
-      console.log('---', '../frameDetail/frameDetail?pid=' + id + '&sk_id=' + skId)
+      console.log('---', '../details/details?pid=' + id + '&sk_id=' + skId)
       uni.navigateTo({
-        url: '../frameDetail/frameDetail?pid=' + id + '&sk_id=' + skId,
+        url: '../details/details?pid=' + id + '&sk_id=' + skId,
         success: res => {},
         fail: () => {},
         complete: () => {},
@@ -70,7 +72,6 @@ export default {
 </script>
 
 <style lang="scss">
-
 image {
   width: 100%;
   height: 120rpx;
diff --git a/src/pages/details/details.vue b/src/pages/details/details.vue
index c983aff..21343af 100644
--- a/src/pages/details/details.vue
+++ b/src/pages/details/details.vue
@@ -168,14 +168,16 @@
       </view>
     </view>
     <!-- 参数选择 -->
-    <!-- <BottomSheet
-      :isCart="isCart"
-      @addCart="addCart"
-      :pid="pid"
-      :goodInfo="goodInfo"
-      :isShowBottom="isShowBottom"
-      @closeBottom="closeBottom"
-    ></BottomSheet> -->
+    <template v-if="isShowBottom">
+      <BottomSheet
+        :isCart="isCart"
+        @addCart="addCart"
+        :pid="pid"
+        :goodInfo="goodInfo"
+        :isShowBottom="isShowBottom"
+        @closeBottom="closeBottom"
+      ></BottomSheet>
+    </template>
     <!-- 分享 -->
     <template>
       <uni-popup
@@ -203,13 +205,13 @@ import Introduce from './components/Introduce' // 商品介绍基本信息组件
 import AfterSails from './components/AfterSails' // 售后保障组件
 import uniPopupShare from '@/components/uni-popup/uni-popup-share.vue' // 分享组件
 import uniPopupPost from '@/components/uni-popup/uni-popup-post.vue' // 分享组件
-// import BottomSheet from '@/components/BottomSheet/BottomSheet.vue' // 参数选择组件
+import BottomSheet from '@/components/BottomSheet/BottomSheet.vue' // 参数选择组件
 
 export default {
   components: {
     Introduce,
     AfterSails,
-    // BottomSheet,
+    BottomSheet,
     uniPopupShare,
     uniPopupPost,
   },
@@ -225,6 +227,8 @@ export default {
         '售后保障',
       ],
       showPostImg: false, // 是否展示分享海报
+      isShowBottom: false, // 是否展示参数选择
+      isCart: 1, // 参数选择 按钮判断
     }
   },
   onLoad({ pid = this.pid, sk_id: skId }) {
@@ -239,6 +243,10 @@ export default {
   },
   computed: {
     // 获取轮播图数据
+    goodInfo() {
+      return this.$store.state.details.goodInfo
+    },
+    // 获取轮播图数据
     carousel() {
       return this.$store.state.details.carousel
     },
@@ -282,6 +290,10 @@ export default {
         pid,
         sk_id: skId,
       })
+      store.dispatch('read/fetch', {
+        pid,
+        sk_id: skId,
+      })
     },
     // 获取购物车数目
     getCartNum() {
@@ -390,6 +402,43 @@ export default {
         this.$refs.uniPopupPost.open()
       })
     },
+    // 参数选择弹窗开关
+    showBottom(isCart) {
+      this.isCart = isCart
+      this.isShowBottom = true
+    },
+    closeBottom() {
+      this.isShowBottom = false
+    },
+    // 前往购物车
+    toCart() {
+      uni.switchTab({
+        url: '/pages/cart/cart',
+        success: res => {},
+        fail: (error) => { console.log('跳转购物车失败======>', error) },
+        complete: () => { console.log('toCart') },
+      })
+    },
+    // 加入购物车
+    addCart (mpId, num, checkedSKU, skId) {
+      this.addCartList.mp_id = mpId
+      this.addCartList.sk_id = skId
+      this.addCartList.num = num
+      this.addCartList.checkedSKU = checkedSKU
+      console.log('添加购物车的参数', this.addCartList)
+      store.dispatch('cart/addCart', this.addCartList).then((res) => {
+        if (res.code === 1) {
+          uni.showToast({
+            title: '添加成功~',
+            icon: 'success',
+          })
+        }
+        // 再次请求购物车接口，实现实时更新
+        store.dispatch('cart/getCartList', {
+          uid: this.$store.state.user.userInfo.uid,
+        })
+      })
+    },
   },
 }
 </script>
diff --git a/src/store/modules/details.js b/src/store/modules/details.js
index 4b250d8..845bf27 100644
--- a/src/store/modules/details.js
+++ b/src/store/modules/details.js
@@ -8,6 +8,8 @@ const {
 } = urlAlias
 
 const state = {
+  // 为配合参数选择框
+  goodInfo: {},
   // 轮播图
   carousel: [
     '/static/img/detail/d9.png',
@@ -51,7 +53,8 @@ const state = {
 }
 
 const mutations = {
-  INIT: (state, { carousel, goodsInfo, tag, specification, evaluate, more, skuList }) => {
+  INIT: (state, { goodInfo, carousel, goodsInfo, tag, specification, evaluate, more, skuList }) => {
+    state.goodInfo = goodInfo
     state.carousel = carousel
     state.goodsInfo = goodsInfo
     state.tag = tag
@@ -95,6 +98,7 @@ const actions = {
         }
 
         commit('INIT', {
+          goodInfo: data,
           skuList: data.skuList,
           carousel: data.pics,
           goodsInfo: {