达人下单

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,15 @@ const options = ref({
   info: true
 })
 
+onMounted(() => {
+  watch(
+    () => prodId.value,
+    () => {
+      getSundryList()
+    }
+  )
+})
+
 // 判断是否是APP
 const openApp = () => {
   const ua = navigator.userAgent;
@@ -286,12 +309,14 @@ 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
+        }
+      })
+    }
   })
 }
 
@@ -1201,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>