达人下单

src/views/badge/preview.vue

@@ -50,7 +50,8 @@
     </div>
     <div class="info-section">
       <div class="info-item">
-        <div class="info-title">{{ prodId == 7 ? '人物立体徽章' : '宠物立体徽章' }}</div>
+        <div class="info-title" v-if="orderStat.type_id == 1">{{ prodId == 7 ? '人物立体徽章' : '宠物立体徽章' }}</div>
+        <div class="info-title" v-if="orderStat.type_id == 2">{{ prodId == 7 ? '人物浮雕相框' : '宠物浮雕相框' }}</div>
         <div class="info-content">产品类型</div>
       </div>
       <div class="info-item">
@@ -91,16 +92,38 @@
     <div class="order-section" v-if="trialCode == false && imageUrl">
       <div class="order-title">订购数量</div>
       <block v-for="item in sizeList" :key="item.id">
-        <div class="order-item" v-show="item.shape_id == shapeId">
-          <span class="order-size">{{ item.size }}</span>
-          <span class="order-free">(剩余兑换：{{ item.remaining }})</span>
-          <div class="order-ctrl">
-            <van-stepper v-model="item.count" :min="0" :max="item.remaining" @change="changeValue" />
+        <block v-if="orderStat.use_type == 1">
+          <div class="order-item" v-show="item.shape_id == shapeId">
+            <span class="order-size">{{ item.size }}</span>
+            <span class="order-free">(剩余兑换：{{ item.remaining }})</span>
+            <div class="order-ctrl">
+              <van-stepper v-model="item.count" :min="0" :max="item.remaining" @change="changeValue" />
+            </div>
           </div>
-        </div>
+        </block>
+        <block v-if="orderStat.use_type == 2">
+          <div class="order-item">
+            <span class="order-size">{{ item.size }}</span>
+            <span class="order-free">(剩余兑换：{{ item.remaining }})</span>
+            <div class="order-ctrl">
+              <van-stepper v-model="item.count" :min="0" :max="item.remaining" @change="changeValue" />
+            </div>
+          </div>
+        </block>
       </block>
     </div>
-    <div style="height: 110px;"></div>
+    <div class="address-box" v-if="orderStat.use_type == 2 && imageUrl">
+      <div class="order-title" style="padding: 0 16px;">收货地址</div>
+      <div class="address-item">
+        <van-address-edit
+          :area-list="areaList"
+          @change="nameTelChange"
+          @change-area="changeArea"
+          @change-detail="onChangeDetail"
+        />
+      </div>
+    </div>
+    <div style="height: 130px;"></div>
     <div class="confirm-box">
       <div class="action-section">
         <button v-if="trialCode == false" @click="sureReload" :disabled="flag < 1" class="action-btn"><img class="action-img" src="@/assets/badge/reload.png" alt=""> 再次生成</button>
@@ -144,9 +167,10 @@
 <script setup lang="ts">
 import { onMounted, ref, onUnmounted } from 'vue';
 import { useRouter, useRoute } from 'vue-router';
-import { showSuccessToast, showToast, showNotify, showConfirmDialog  } from 'vant';
+import { showSuccessToast, showToast, showNotify, showConfirmDialog, AddressEdit, Area } from 'vant';
 import { localStorage } from '@/utils/local-storage'
 import * as badgeApi from '@/api/badge'
+import { areaList } from '@/utils/area'
 const router = useRouter();
 const value = ref(0);
 const showReload = ref(false)
@@ -259,22 +283,59 @@ const getSizeList = () => {
   badgeApi.getOrderPrice({}).then((res: any) => {
     console.log('getSizeList', res);
     sizeList.value = res
-    sizeList.value.forEach((item: any) => {
-      if (item.shape_item) {
-        if (!shapeList.value.some(shape => shape.id === item.shape_id)) {
-          shapeList.value.push(item.shape_item)
+    if (orderStat.value.use_type == 1) {
+      sizeList.value.forEach((item: any) => {
+        if (item.shape_item) {
+          if (!shapeList.value.some(shape => shape.id === item.shape_id)) {
+            shapeList.value.push(item.shape_item)
+          }
+        } else {
+          showToast('该链接异常，请联系客服')
+          return
         }
-      } else {
-        showToast('该链接异常，请联系客服')
-        return
+      })
+      if (shapeList.value.length > 0) {
+        shapeChange(shapeList.value[0])
       }
-    })
-    if (shapeList.value.length > 0) {
-      shapeChange(shapeList.value[0])
+    } else {
+      getShapeList()
     }
   })
 }
 
+const contact_name = ref('')
+const contact_mobile = ref('')
+const province_id = ref(0)
+const city_id = ref(0)
+const county_id = ref(0)
+const province_name = ref('')
+const city_name = ref('')
+const county_name = ref('')
+const address = ref('')
+const nameTelChange = (res: any) => {
+  console.log('nameTelChange', res)
+  if (res.key == 'name') {
+    contact_name.value = res.value
+  } else {
+    contact_mobile.value = res.value
+  }
+}
+
+const changeArea = (value: any) => {
+  console.log('changeArea', value)
+  province_id.value = value[0].value
+  city_id.value = value[1].value
+  county_id.value = value[2].value
+  province_name.value = value[0].text
+  city_name.value = value[1].text
+  county_name.value = value[2].text
+}
+
+const onChangeDetail = (value: any) => {
+  console.log('onChangeDetail', value)
+  address.value = value
+}
+
 const payAmount = ref(0)
 const changeValue = (value: number) => {
   console.log(value) 
@@ -286,8 +347,24 @@ const loading = ref(false)
 const confirm = () => {
   if (loading.value) return
   console.log('confirm')
-  if (payAmount.value <= 0) {
-    showToast('请先选择下单数量')
+  // if (payAmount.value <= 0) {
+  //   showToast('请先选择下单数量')
+  //   return
+  // }
+  if (orderStat.value.use_type == 2 && !contact_name.value) {
+    showToast('请先填写收货人信息')
+    return
+  }
+  if (orderStat.value.use_type == 2 && !contact_mobile.value) {
+    showToast('请先填写收货人手机号')
+    return
+  }
+  if (orderStat.value.use_type == 2 && !province_id.value) {
+    showToast('请先选择地区')
+    return
+  }
+  if (orderStat.value.use_type == 2 && !address.value) {
+    showToast('请先填写详细地址')
     return
   }
   getPosition()
@@ -307,6 +384,19 @@ const confirm = () => {
       shape_id: shapeId.value,
       custom_text: shapeText.value
     }
+    if (orderStat.value.use_type == 2) {
+      parms.province_id = province_id.value
+      parms.city_id = city_id.value
+      parms.county_id = county_id.value
+      parms.province_name = province_name.value
+      parms.city_name = city_name.value
+      parms.county_name = county_name.value
+      parms.address = address.value
+      parms.contact_name = contact_name.value
+      parms.contact_mobile = contact_mobile.value
+      parms.addr_id = 0
+      parms.country_id = 45
+    }
     badgeApi.creatOrder(parms).then((res: any) => {
       console.log('creatOrder', res)
       showSuccessToast({
@@ -502,7 +592,8 @@ const custom_switch = ref(0)
 const limitCount = ref(10)
 const getShapeList = () => {
   badgeApi.getShapeList({
-    prod_id: prodId.value
+    prod_id: prodId.value,
+    type_id: orderStat.value.type_id
   }).then((res: any) => {
     console.log('getShapeList', res)
     shapeList.value = res.list
@@ -630,7 +721,6 @@ const getTrialCode = () => {
     trialCode.value = true
   } else {
     getOrderStat()
-    getSizeList()
   }
 }
 
@@ -639,6 +729,7 @@ const getOrderStat = () => {
   badgeApi.getOrderStat({}).then((res: any) => {
     console.log('getOrderStat', res)
     orderStat.value = res
+    getSizeList()
   })
 }
 
@@ -1231,4 +1322,7 @@ onUnmounted(() => {
 .shape-item-image-round {
   border-radius: 50%;
 }
+.van-address-edit {
+  padding: 0!important;
+}
 </style>