规格更改

src/components/CXBSkuPopup/CXBSkuPopup.vue

@@ -25,9 +25,9 @@ const props = defineProps({
       return []
     }
   },
-  isTo:{
-    type:Number,
-    required:true
+  isTo: {
+    type: Number,
+    required: true
   }
 })
 
@@ -54,25 +54,6 @@ const onConfirm = () => {
   emit(CONFIRM_EVENT)
 }
 
-//定义点击规格展示状态
-const isQr=ref(false)    //确认 加入购物车-立即购买规格出现
-const isDh=ref(false)    //兑换 立即兑换页面规格出现
-const isTwo=ref(false)   //点击大仓规格 出现双按钮
-
-//监听传入的规格
-watch(()=>props.isTo,()=>{
-  if(props.isTo as number ===1){
-    isQr.value = true
-  }
-  if(props.isTo as number ===2){
-    isQr.value = true
-  }
-  if(props.isTo as number ===3 ){
-    isTwo.value=true
-  }
-},
-{immediate:true}
-)
 
 const onCancel = () => {
   // show.value = false
@@ -102,27 +83,30 @@ const skuList = computed(() => {
 
 onMounted(() => {
   emit('selected:item', currentSku)
-  
+
 })
 
 function handleSelectedSku(skuItem: any) {
   currentSku.value = skuItem
   console.log('我是数据', currentSku.value);
- 
+
   emit('selected:item', currentSku)
 }
 function handleClose() {
   showValue.value = false
-  
+
   emit(CLOSE_EVENT)
 }
 
 function handleAddCart() {
   emit('submit')
 }
-// function handleSelectedSku(item) {
-//
-// }
+function handleBuyNow() {
+  emit('subBuy')
+}
+function handleJiaCart() {
+  emit('subAdd')
+}
 
 function handleCountChange(value) {
   emit('count-change', value)
@@ -197,23 +181,25 @@ function handleCountChange(value) {
         </div>
       </div>
 
-      <div class="px-3 pb-10" v-if="isQr" >
+      <div class="px-3 pb-10" v-if="isTo == 1">
         <FButton @click="handleAddCart" size="small" :exClass="['!bg-primary', 'rounded-full', 'text-white']" block>
           确定
         </FButton>
 
       </div>
-      <div class="px-3 pb-10" v-if="isDh" >
+      <div class="px-3 pb-10" v-if="isTo == 3">
         <FButton @click="handleAddCart" size="small" :exClass="['!bg-primary', 'rounded-full', 'text-white']" block>
           立即兑换
         </FButton>
 
       </div>
-      <div class="px-3 pb-10"  v-if="isTwo" >
-        <FButton @click="handleAddCart" size="small" :exClass="['!bg-primary', 'rounded-full', 'text-white']" block>
+      <div class="flex box_1 flex-row justify-between text-sm text-white gap-3 pr-3" v-if="isTo == 2">
+        <FButton @click="handleJiaCart" size="small"
+          :exClass="['bg-[#FFA319] rounded-full w-1/3 flex justify-center items-center h-9']" block>
           加入购物车
         </FButton>
-        <FButton @click="handleAddCart" size="small" :exClass="['!bg-primary', 'rounded-full', 'text-white']" block>
+        <FButton @click="handleBuyNow" size="small"
+          :exClass="['bg-[#F94032] rounded-full w-1/3 flex justify-center items-center h-9']" block>
           立即购买
         </FButton>
 
@@ -221,4 +207,10 @@ function handleCountChange(value) {
     </div>
 
   </FPopup>
-</template>
+</template>
+<style scoped>
+.box_1 {
+  margin-bottom: 40rpx;
+  border-top:1px solid #b6b9c0
+}
+</style>

src/components/FButton/FButton.vue

@@ -6,6 +6,8 @@ const props = defineProps(buttonProps)
 const emit = defineEmits(buttonEmits)
 
 const { disabled, clickHandler } = useButton(props, emit)
+console.log(props);
+
 </script>
 
 <template>

src/pages/store/product/detail.vue

@@ -64,7 +64,7 @@ const state = reactive({
   shareImage: '',
 })
 const detail: any = ref(null)
-const isTo= ref(0)
+const isTo= ref(3)
 let isShow = ref(false)
 onShow(() => {
   uni.showLoading({
@@ -132,7 +132,8 @@ function loadProductDetail() {
     // console.log(res);
     if (res.status === 200) {
       detail.value = res.data
-
+      console.log('我是detail',detail.value);
+      
       state.shareImage = detail.value.image
       if (res && res.mer_id && res.mer_id === '148') {
         if (detail.value && detail.value.price) {
@@ -296,6 +297,7 @@ function onSelectedSku(item :any) {
 }
 
 function handleAddCart() {
+  isTo.value=1
   state.isShowSku = true
   state.flag = 2
 
@@ -317,12 +319,14 @@ function handleCreateShopping() {
     if (res.cart_id) {
       // console.log(state.flag)
       if (state.flag == '1' || state.flag == '3') {
+        isTo.value=state.flag
+        console.log(isTo.value)
         uni.navigateTo({
           url: `/pages/order-confirm/index?cartId=${res.cart_id}&type=${state.flag}&product_id=${detail.value.product_id}`
         })
-      } else {
-        uni.$emit('cart-reload')
+      } else if(state.flag == '2') {
         isTo.value=1
+        uni.$emit('cart-reload')
         loadProductDetail()
         uni.showToast({
           title: '添加购物车成功',
@@ -352,6 +356,90 @@ function handleCreateShopping() {
 
   })
 }
+function handleBuyshow() {
+  console.log('我是detail数据',detail.value)
+  createShopping({
+    product_id: detail.value.product_id,
+    // product_attr_unique: JSON.stringify(state.currentSku),
+    product_attr_unique: state.currentSku.unique,
+    cart_num: state.cartNum,
+    is_new: (state.flag === '1' || state.flag === '3') ? '1' : '0'
+  }).then(res => {
+    console.log('resres',res)
+  
+    if (res.cart_id) {
+      uni.navigateTo({
+          url: `/pages/order-confirm/index?cartId=${res.cart_id}&type=${state.flag}&product_id=${detail.value.product_id}`
+        })
+    }
+  }).catch(error => {
+    if (error === '会员礼包不能加入购物车') {
+      return uni.showToast({
+        title: error,
+        icon: 'none'
+      })
+    } else if (error === '库存不足') {
+      return uni.showToast({
+        title: error,
+        icon: 'none'
+      })
+    }
+    else {
+      return uni.navigateTo({
+        url: '/pages/user/login/index'
+      })
+    }
+
+  })
+}
+function handleAddshow() {
+  // console.log(state.flag)
+  console.log('我是detail数据', detail.value)
+  createShopping({
+    product_id: detail.value.product_id,
+    // product_attr_unique: JSON.stringify(state.currentSku),
+    product_attr_unique: state.currentSku.unique,
+    cart_num: state.cartNum,
+    is_new: (state.flag === '1' || state.flag === '3') ? '1' : '0'
+  }).then(res => {
+    console.log('resres', res)
+
+    if (res.cart_id) {
+      // console.log(state.flag)
+      uni.$emit('cart-reload')
+        loadProductDetail()
+        uni.showToast({
+          title: '添加购物车成功',
+          icon: 'none'
+        })
+        loadCartCount()
+        state.isShowSku = false
+    }
+  }).catch(error => {
+    if (error === '会员礼包不能加入购物车') {
+      return uni.showToast({
+        title: error,
+        icon: 'none'
+      })
+    } else if (error === '库存不足') {
+      return uni.showToast({
+        title: error,
+        icon: 'none'
+      })
+    }
+    else {
+      return uni.navigateTo({
+        url: '/pages/user/login/index'
+      })
+    }
+
+  })
+}
+// 规格显示双按钮
+function handleTwobtn(){
+  isTo.value=2
+  state.isShowSku = !state.isShowSku
+}
 
 /**
  *
@@ -378,6 +466,7 @@ function handleOrderConfirm(flag: '1' | '2' | '3') {
   })
 
   state.flag = flag
+  isTo.value=flag
   state.isShowSku = true
   // if (is148Merchant.value) {
   //   state.isNew = '1'
@@ -607,7 +696,7 @@ onPageScroll((page) => {
       </div>
     </div>
 
-    <FCell arrow @tap="state.isShowSku = !state.isShowSku">
+    <FCell arrow @tap="handleTwobtn">
       <template #title>
         <div class="flex items-center" v-if="state.currentSku">
           <div class="font-bold">规格：</div>
@@ -773,13 +862,18 @@ onPageScroll((page) => {
           <div v-else @click="handleOrderConfirm('1')">立即购买</div>
         </div>
       </div>
+      <!-- <div class="flex flex-row text-sm text-white gap-2 pr-3">
+        <div class="bg-[#F94032] rounded-full w-25 flex justify-center items-center h-9">
+          <div @click="handleOrderConfirm('1')">立即抢购</div>
+        </div>
+      </div> -->
     </div>
 
 
   </div>
 
   <CXBSkuPopup v-model:show="state.isShowSku" :detail="detail" @selected:item="onSelectedSku"
-    @submit="handleCreateShopping" @count-change="handleCountChange" 
+    @submit="handleCreateShopping" @count-change="handleCountChange" @subBuy="handleBuyshow"   @subAdd="handleAddshow"
     :isTo="isTo"
     />
   <!--  <nut-sku-->

src/pages/to-coupon/to-coupon.vue

@@ -28,27 +28,27 @@ const isShow = ref(true)
 
 .block_1 {
 	width: 100%;
-	height: 9px;
+	height: 18rpx;
 	background-size: 100% 100%;
 }
 
 .image_2 {
-	width: 103px;
-	height: 103px;
+	width:206rpx;
+	height:206rpx;
 	display: block;
-	margin-top: 200px;
-	margin-bottom: 20px;
+	margin-top: 400rpx;
+	margin-bottom: 40rpx;
 }
 
 .text_3 {
-	height: 15px;
+	height: 30rpx;
 	overflow-wrap: break-word;
 	color: rgba(51, 51, 51, 1);
-	font-size: 15px;
+	font-size: 30rpx;
 	font-weight: NaN;
 	text-align: center;
 	white-space: nowrap;
-	line-height: 15px;
+	line-height: 30rpx;
 	
 }