绿满眶商城微信小程序-uniapp
xiangpei
2025-07-09 da1e3dbfc622f7f581d19a56c7e4d3abe13563e1
pages/supplier/publish-goods/publishGoods.vue
@@ -1,30 +1,78 @@
<template>
   <view class="container">
      <uni-steps :options="publishSteps" :active="currentStep" active-color='#f31947'></uni-steps>
      <choose-categery v-if="currentStep===0"></choose-categery>
      <choose-categery @choose="chooseCategrey" v-show="currentStep === 0"></choose-categery>
      <goods-info @submit="submit" v-show="currentStep === 1"></goods-info>
      <view style="position: fixed;bottom: 80px;display: flex;width: calc(100% - 70rpx);">
         <button :disabled="currentStep === 0" @click="lastStep" size="mini" style="flex: 1;font-size: 32rpx;margin-right: 3rpx;" type="primary">上一步</button>
         <button :disabled="currentStep === 1" @click="nextStep" size="mini" style="flex: 1;font-size: 32rpx;margin-left: 3rpx;" type="primary">下一步</button>
      </view>
   </view>
</template>
<script>
   import chooseCategery from './chooseCategery.vue';
   import goodsInfo from './goodsInfo.vue';
   import {createGoods} from "@/api/store.js"
   export default {
      components: { chooseCategery },
      components: { chooseCategery, goodsInfo },
      data() {
         return {
            goods: {
            },
            categoryPath: '',
            currentStep:0,
            publishSteps: [{
                  title: ' 选择商品品类'
               },
               {
                  title: ' 填写商品详情'
               },
               {
                  title: ' 商品发布成功'
               }
            ],
         }
      },
      methods: {
         // 获取选择的商品分类
         chooseCategrey(categreyId) {
            this.categoryPath = categreyId + ",,"
         },
         submit(data) {
            if (! this.categoryPath) {
               uni.showToast({ title: '请选中商品分类', icon: 'none' })
               return
      }
            data['categoryPath'] = this.categoryPath
            if (data.skuList) {
               data.skuList.forEach(sku => {
                  delete sku.specValues
               })
            }
            delete data.specs
            // 发布商品
            console.log("商品数据", data);
            createGoods(data).then(res => {
               uni.showToast({ title: '商品已提交审核', icon: 'success' })
               setTimeout(() => {
                  uni.navigateBack({
                     delta: 1
                  });
               }, 2000)
            })
         },
         // 上一步
         lastStep() {
            if (this.currentStep > 0) {
               this.currentStep--
            }
         },
         // 下一步
         nextStep() {
            if (this.currentStep < 1) {
               this.currentStep++
            }
         }
      }
   }
</script>