一次性链接

2025-06-23 10:00:03 +08:00
1 parent d8316cf49d
commit e08c168e4e
@@ -5,6 +5,8 @@ import "vue-cropper-h5/dist/style.css"
 import { showLoadingToast, showToast, closeToast, showFailToast, showSuccessToast } from 'vant';
 import * as badgeApi from '@/api/badge'
 import { onMounted, ref } from 'vue';
+import { localStorage } from '@/utils/local-storage'
+import CryptoJS from 'crypto-js'

 const show = ref(false)
 const imgShow = ref(false)
@@ -77,7 +79,7 @@ function goToPreview() {
    showToast('请先上传背景照片')
    return
  }
-  if (orderStat.remain_count <= 0) {
+  if (orderStat.value.remain_count <= 0) {
    showToast('剩余次数不足')
    return
  }
@@ -100,6 +102,9 @@ function getBlob(data) {
  }
  imgurl.value = data;
 }
+function getFile(data) {
+  console.log('getFile', data)
+}
 const pictureBg = ref(null)
 function getBgbase64Data(data) {
  pictureBg.value = data;
@@ -126,7 +131,6 @@ const getPid = async () => {
    loadingType: 'spinner',
    duration: 0,
  })
-  // kindId.value = checkId.value == 0 ? getRandomNumber() : checkId.value
  const params = {
    extend_value: isBgShow.value ? -1 : 0,
    kind_id: checkId.value,
@@ -202,6 +206,7 @@ const sendToOss = async (src: string, url: string) => {
    console.log('图片上传成功--------', response)
    
    if (--pendingUploads.value === 0 && !isAnotherAPICalled.value) {
+      isAnotherAPICalled.value = true
      const params = {
        pid: pid.value,
        kind_id: checkId.value,
@@ -277,7 +282,7 @@ const getKindList = () => {
      message: err.message,
      duration: 2000,
    })
-  }).finally((err) => {
+  }).finally(() => {
    
  })
 }
@@ -295,7 +300,7 @@ const getSundryList = () => {
      message: err.message,
      duration: 2000,
    })
-  }).finally((err) => {
+  }).finally(() => {
    
  })
 }
@@ -314,23 +319,78 @@ const getList = () => {
      message: err.message,
      duration: 2000,
    })
-  }).finally((err) => {
+  }).finally(() => {
    
  })
 }
+const trialCode = ref(false)
+const trialCodeValue = ref('')
+const getTrialCode = () => {
+  const value = localStorage.get('trialCode')
+  if (value) {
+    trialCode.value = true
+    trialCodeValue.value = value
+  } else {
+    getOrderStat()
+    getSizeList()
+  }
+}
+const mobile = ref('')
+const userId = ref('')
+const onBlur = async () => {
+  console.log(mobile.value);
+  if (!mobile.value) {
+    showToast('请输入手机号');
+    return;
+  }
+  const mobileReg = /^1[3-9]\d{9}$/;
+  if (!mobileReg.test(mobile.value)) {
+    showToast('请输入正确的手机号');
+    return;
+  }
+  await badgeApi.trialPhone({
+    phone: mobile.value
+  }).then((res: any) => {
+    const timestamp = Date.now()
+    const payload = JSON.stringify({ userId: res, timestamp })
+    userId.value = Encrypt(payload)
+    localStorage.set('userId', userId.value)
+  }).catch((err) => {
+    showToast({
+      message: err.message,
+      duration: 2000,
+    })
+  }).finally(() => {
+    
+  })
+}
+const key = CryptoJS.enc.Utf8.parse("123abcdefpua2025");
+const iv = CryptoJS.enc.Utf8.parse('DYgjCEIMVrj2W9xN');
+function Encrypt(word: string): string {  
+   let srcs = CryptoJS.enc.Utf8.parse(word);
+   let encrypted = CryptoJS.AES.encrypt(srcs, key, {
+    iv: iv, mode: CryptoJS.mode.CBC, padding: CryptoJS.pad.Pkcs7 });
+   return encrypted.ciphertext.toString();
+
+}
+function handleBeforeUnload(_event: BeforeUnloadEvent) {
+  localStorage.remove('code')
+  localStorage.remove('trialCode')
+  localStorage.remove('userId')
+}
 onMounted(() => {
  getKindList()
  getSundryList()
  getList()
-  getOrderStat()
-  getSizeList()
  openApp()
+  getTrialCode()
+  window.addEventListener('beforeunload', handleBeforeUnload);
 })
 </script>

 <template>
  <div class="photo-upload-page">
-    <div class="badge-size">
+    <div class="badge-size" v-if="trialCode == false">
      <div class="size-title">
        剩余兑换数量
      </div>
@@ -343,17 +403,9 @@ onMounted(() => {
            （剩余兑换：{{ item.remaining }}）
          </div>
        </div>
-        <!-- <div class="size-item">
-          <div class="size-text">
-            5cm
-          </div>
-          <div class="size-count">
-            （剩余兑换：2）
-          </div>
-        </div> -->
      </div>
    </div>
-    <div class="badge-info">
+    <div class="badge-info" v-if="trialCode == false">
      <div class="badge-item" @click="goToRecord">
        <div class="badge-title">
          设计图集
@@ -371,8 +423,22 @@ onMounted(() => {
        </div>
      </div>
    </div>
+    <div class="badge-phone" v-if="trialCode == true">
+      <van-field
+        label="手机号码"
+        type="number"
+        v-model="mobile"
+        placeholder="请输入手机号"
+        required
+        maxlength="11"
+        :rules="[{ required: true, message: '请输入手机号' }]"
+        @blur="onBlur"
+        @confirm="onBlur"
+      />
+      <p style="font-size: 12px; color: #000; margin-left: 16px;">注：需要先输入手机号才可体验徽章设计</p>
+    </div>
    <div style="height: 8px;background: #F2F2F2;" />
-    <div class="step-container">
+    <div class="step-container" v-if="trialCode == false">
      <div class="step-item active">
        <div class="step-num">
          1
@@ -498,7 +564,8 @@ onMounted(() => {
    <div class="design-action-bar">
      <div class="design-left">
        <img class="design-leaf-icon" width="18" height="18" src="@/assets/badge/leaf.png" alt="">
-        <span class="design-remaining">剩余{{ orderStat.remain_count || 0 }}次</span>
+        <span v-if="trialCode == false" class="design-remaining">剩余{{ orderStat.remain_count || 0 }}次</span>
+        <span v-if="trialCode == true" class="design-remaining">体验1次</span>
      </div>
      <button class="design-btn" @click="goToPreview">
        <span>开始设计</span>
@@ -56,7 +56,7 @@
    <div style="padding: 0 16px;">
      <van-divider />
    </div>
-    <div class="order-section">
+    <div class="order-section" v-if="trialCode == false">
      <div class="order-title">订购数量</div>
      <div class="order-item" v-for="item in sizeList" :key="item.id">
        <span class="order-size">{{ item.size }}</span>
@@ -76,9 +76,9 @@
    <div style="height: 110px;"></div>
    <div class="confirm-box">
      <div class="action-section">
-        <button @click="reload" :disabled="flag < 2" class="action-btn"><img class="action-img" src="@/assets/badge/reload.png" alt=""> 再次生成</button>
-        <button @click="compare" :disabled="flag < 2" class="action-btn"><img class="action-img" src="@/assets/badge/duibi.png" alt=""> 前后对比</button>
-        <button @click="save" :disabled="flag < 2" class="action-btn"><img class="action-img" src="@/assets/badge/down.png" alt=""> 保存图片</button>
+        <button v-if="trialCode == false" @click="reload" :disabled="flag < 2" class="action-btn"><img class="action-img" src="@/assets/badge/reload.png" alt=""> 再次生成</button>
+        <button v-if="trialCode == false" @click="compare" :disabled="flag < 2" class="action-btn"><img class="action-img" src="@/assets/badge/duibi.png" alt=""> 前后对比</button>
+        <button v-if="trialCode == false" @click="save" :disabled="flag < 2" class="action-btn"><img class="action-img" src="@/assets/badge/down.png" alt=""> 保存图片</button>
      </div>
      <div class="btn-box">
        <button @click="confirm" :disabled="flag < 2" class="confirm-btn">确认选择</button>
@@ -426,6 +426,7 @@ const getImageList = () => {
      imageUrl.value = data.list[0].origin_url
      imageList.value = data.list
      key.value = data.list[0].key
+      localStorage.remove('userId')
    }
  }).catch((err) => {
    clearInterval(progressTimer.value)
@@ -438,6 +439,18 @@ const getImageList = () => {
    
  })
 }
+const trialCode = ref(false)
+const getTrialCode = () => {
+  const value = localStorage.get('trialCode')
+  if (value) {
+    trialCode.value = true
+  }
+}
+function handleBeforeUnload(_event: BeforeUnloadEvent) {
+  localStorage.remove('code')
+  localStorage.remove('trialCode')
+  localStorage.remove('userId')
+}

 const pid = ref(0)
 const route = useRoute()
@@ -450,6 +463,8 @@ onMounted(() => {
  progressList()
  getSizeList()
  getCompareImage()
+  getTrialCode()
+  window.addEventListener('beforeunload', handleBeforeUnload);
  timer.value = setInterval(() => {
    getImageList()
  }, 10000)