Merge branch 'master' into lzm_web

components.d.ts

@@ -22,6 +22,7 @@ declare module '@vue/runtime-core' {
     Tensorflow: typeof import('./src/components/arFrame/tensorflow.vue')['default']
     VanActionSheet: typeof import('vant/es')['ActionSheet']
     VanAddressEdit: typeof import('vant/es')['AddressEdit']
+    VanArea: typeof import('vant/es')['Area']
     VanDivider: typeof import('vant/es')['Divider']
     VanField: typeof import('vant/es')['Field']
     VanIcon: typeof import('vant/es')['Icon']

index.html

@@ -12,4 +12,9 @@
     <div id="app"></div>
     <script type="module" src="/src/main.ts"></script>
   </body>
+  <style>
+    .address-item .van-address-edit__buttons {
+      display: none!important;
+    }
+  </style>
 </html>

src/views/badge/index.vue

@@ -11,12 +11,15 @@
             {{ orderStat.order_no }}
           </div>
         </div>
-        <div class="order-type-item" v-if="orderStat.prod_id">
+        <div class="order-type-item" v-if="prodId">
           <div class="order-type-item-title">
             产品类型
           </div>
-          <div class="order-type-item-title">
-            {{ orderStat.prod_id == 7 ? '人物立体徽章' : '宠物立体徽章'}}
+          <div class="order-type-item-title" v-if="orderStat.type_id == 1">
+            {{ prodId == 7 ? '人物立体徽章' : '宠物立体徽章'}}
+          </div>
+          <div class="order-type-item-title" v-if="orderStat.type_id == 2">
+            {{ prodId == 7 ? '人物浮雕相框' : '宠物浮雕相框'}}
           </div>
         </div>
       </div>
@@ -105,6 +108,17 @@
         </div>
       </div>
     </div>
+    <div class="tag-change-box" v-if="orderStat.use_type == 2">
+      <div class="tag-change-item">
+        <div class="tag-change-item-title" :class="{ tagActive: prodId == 7 }" @click="prodId = 7">
+          人物主体
+        </div>
+        <div class="tag-change-item-title" :class="{ tagActive: prodId == 8 }" @click="prodId = 8">
+          宠物主体
+        </div>
+      </div>
+      <div style="font-size: 12px; color: #888; text-align: center;">注：不同主体的照片检测标准不同</div>
+    </div>
     <div class="step-line" v-if="prop == '3D真人肖像'">
       <div class="step-line-item">
         <div class="step-line-item-title">
@@ -158,7 +172,7 @@
     </div>
     <div style="font-size: 12px; color: red; margin-top: 16px; text-align: center;" v-if="prodId == 7">温馨提示：请上传只有{{ prop == '3D真人肖像' ? '1' : '1-3' }}人的照片</div>
     <div style="font-size: 12px; color: red; margin-top: 16px; text-align: center;" v-if="prodId == 8">温馨提示：请上传只有1-3只宠物的照片</div>
-    <div style="height: 90px;"></div>
+    <div style="height: 120px;"></div>
     <div class="design-action-bar">
       <div class="design-left">
         <img class="design-leaf-icon" width="18" height="18" src="@/assets/badge/leaf.png" alt="">
@@ -251,6 +265,16 @@ const options = ref({
   info: true
 })
 
+onMounted(() => {
+  watch(
+    () => prodId.value,
+    () => {
+      getSundryList()
+    }
+  )
+})
+
+// 判断是否是APP
 const openApp = () => {
   const ua = navigator.userAgent;
   const isIOS = /iPhone|iPad|iPod/i.test(ua);
@@ -270,26 +294,33 @@ const openApp = () => {
 const imgurl = ref('')
 const imgBgUrl = ref('')
 const remaining = ref(0)
+
+// 跳转设计图集
 function goToRecord() {
   router.push('/badge/record')
 }
+// 跳转我的订单
 function goToMyOrder() {
   router.push('/badge/myOrder')
 }
 
+// 获取兑换数量
 const sizeList = ref([])
 const getSizeList = () => {
   badgeApi.getOrderPrice({}).then((res: any) => {
     sizeList.value = res
-    sizeList.value.forEach((item: any) => {
-      if (item.shape_item == null || item.shape_item == undefined || item.shape_item == '' || !item.shape_item) {
-        showToast('该链接异常，请联系客服')
-        return
-      }
-    })
+    if (orderStat.value.use_type == 1) {
+      sizeList.value.forEach((item: any) => {
+        if (item.shape_item == null || item.shape_item == undefined || item.shape_item == '' || !item.shape_item) {
+          showToast('该链接异常，请联系客服')
+          return
+        }
+      })
+    }
   })
 }
 
+// 获取首页显示的数量和类型
 const orderStat = ref({})
 const prodId = ref(7)
 const prop = ref('')
@@ -304,6 +335,7 @@ const getOrderStat = () => {
 
 const isLoading = ref(false)
 
+// 生成图片
 function goToPreview() {
   if (isLoading.value) {
     return
@@ -324,6 +356,8 @@ function goToPreview() {
     getPid()
   }
 }
+
+// 一次性体验链接
 const trialPhone = async () => {
   if (!mobile.value) {
     showToast('请输入手机号');
@@ -432,6 +466,7 @@ const getUploadUrl = () => {
   })
 }
 
+// 人脸识别上传
 const sendFaceToOss = async (src: string, url: string, path: string) => {
   try {
     const response = await fetch(url, {
@@ -577,6 +612,7 @@ const sendToOss = async (src: string, url: string) => {
     console.log("uploadImage----err", err)
   }
 }
+// 创建日志
 const createLog = () => {
   const params = {
     pid: pid.value,
@@ -612,6 +648,7 @@ const createLog = () => {
   })
 }
 
+// 获取首页图片上传指南图片
 const sundryList = ref([])
 const getSundryList = () => {
   badgeApi.getSundryList({
@@ -631,6 +668,7 @@ const getSundryList = () => {
   })
 }
 
+// 判断是否是一次性体验链接
 const trialCode = ref(false)
 const trialCodeValue = ref('')
 const getTrialCode = () => {
@@ -643,6 +681,8 @@ const getTrialCode = () => {
     getSizeList()
   }
 }
+
+// 手机号输入框
 const mobile = ref('')
 const userId = ref('')
 const onBlur = async () => {
@@ -1186,4 +1226,35 @@ onMounted(() => {
   background: #50cf54;
   color: #fff;
 }
+.tag-change-box {
+  margin: 0 auto;
+}
+.tag-change-item {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 12px;
+  padding: 10px 0;
+}
+.tag-change-item-title {
+  font-size: 14px;
+  color: #333;
+  background: #E5E5E5;
+  width: 120px;
+  height: 32px;
+  text-align: center;
+  line-height: 32px;
+}
+.tag-change-item-title:first-child {
+  border-top-left-radius: 16px;
+  border-bottom-left-radius: 16px;
+}
+.tag-change-item-title:last-child {
+  border-top-right-radius: 16px;
+  border-bottom-right-radius: 16px;
+}
+.tag-change-item-title.tagActive {
+  background: #50CF54;
+  color: #fff;
+}
 </style>

src/views/badge/preview.vue

@@ -36,21 +36,22 @@
         </div>
         <div class="shape-text" :style="shapeTextStyle" v-if="shapeText">{{shapeText}}</div>
       </div>
-      <div class="image-list-box" v-if="imageList.length > 1">
-        <div class="image-list-item" v-for="item in imageList" :key="item.key">
-          <img v-if="item.status == 1" class="image-list-item-img" :class="{ imgActive: item.key == imgKey }" :src="item.origin_url" alt="" @click="changeImage(item)">
-          <div v-else-if="item.status == 0" class="image-list-item-loading">
-            设计中
-          </div>
-          <div v-else-if="item.status == 2" class="image-list-item-loading">
-            设计失败
-          </div>
+    </div>
+    <div class="image-list-box" v-if="imageList.length > 1">
+      <div class="image-list-item" v-for="item in imageList" :key="item.key">
+        <img v-if="item.status == 1" class="image-list-item-img" :class="{ imgActive: item.key == imgKey }" :src="item.origin_url" alt="" @click="changeImage(item)">
+        <div v-else-if="item.status == 0" class="image-list-item-loading">
+          设计中
+        </div>
+        <div v-else-if="item.status == 2" class="image-list-item-loading">
+          设计失败
         </div>
       </div>
     </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">
@@ -70,7 +71,7 @@
         <block v-for="item in shapeList" :key="item.id">
           <div class="shape-item" @click="shapeChange(item)">
             <div class="shape-item-list">
-              <img class="shape-item-image" :src="item.cover_path || imageUrl"/>
+              <img class="shape-item-image" :class="{ 'shape-item-image-round': item.id == 1 || item.id == 2 }" :src="item.cover_path || imageUrl"/>
               <van-icon v-if="item.id == shapeId" class="shape-icon" color="#15CF5F" name="checked" size="18px" />
             </div>
             <div class="shape-item-text">{{item.name}}</div>
@@ -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>
@@ -117,7 +140,7 @@
     <div style="padding: 16px;">
       <div style="display: flex; align-items: center; justify-content: center; gap: 20px;">
         <div style="text-align: center;">
-          <img :src="compareList.origin_path" alt="原图" style="width: 120px; height: 120px; border-radius: 8px;">
+          <img :src="compareList.origin_path" alt="原图" style="max-width: 120px; max-height: 120px; border-radius: 8px;">
         </div>
         <div style="font-size: 24px; color: #333;">
           <van-icon name="arrow" size="20px" />
@@ -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,20 +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) {
-        shapeList.value.push(item.shape_item)
-      } else {
-        showToast('该链接异常，请联系客服')
-        return
+    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
+        }
+      })
+      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) 
@@ -284,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()
@@ -305,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({
@@ -500,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
@@ -628,7 +721,6 @@ const getTrialCode = () => {
     trialCode.value = true
   } else {
     getOrderStat()
-    getSizeList()
   }
 }
 
@@ -637,6 +729,7 @@ const getOrderStat = () => {
   badgeApi.getOrderStat({}).then((res: any) => {
     console.log('getOrderStat', res)
     orderStat.value = res
+    getSizeList()
   })
 }
 
@@ -1226,4 +1319,10 @@ onUnmounted(() => {
   font-family: chinese;
   overflow: hidden;
 }
+.shape-item-image-round {
+  border-radius: 50%;
+}
+.van-address-edit {
+  padding: 0!important;
+}
 </style>