update:修改业务逻辑

src/views/promotion/xcprom.vue

@@ -1,17 +1,13 @@
 <template>
-  <div v-if="!htmlLoadFinish" class="whitccc"></div>
-  <div
-    v-if="htmlLoadFinish"
-    class="index-page"
-    :style="{ backgroundImage: 'url(' + coverImgUrl + ')' }"
-  >
+  <div class="index-page">
     <div ref="myImg">
       <img :src="img1" alt="" class="header-img" />
-      <van-notice-bar scrollable left-icon="volume-o" v-if="showNoticeBar">
-        {{ ntext.join("" + longSpace) }}
-      </van-notice-bar>
     </div>
-    <div class="transaction-view" ref="myTransactionView" :style="{backgroundColor: backgroundColor}">
+    <div
+      class="transaction-view"
+      ref="myTransactionView"
+      :style="{ backgroundColor: backgroundColor }"
+    >
       <div class="ipt-view">
         <input
           placeholder="请输入手机号码"
@@ -27,13 +23,9 @@
       <div class="ipt-view1 ipt-view">
         <input
           placeholder="请输入短信验证码"
-          type="tel"
           class="ipt1 ipt"
           maxlength="11"
-          ref="myInput"
-          v-model="mobile"
-          @input="phoneBlur"
-          v-on:focus="onInputFocus"
+          v-model="codeValue"
         />
         <div class="code">获取验证码</div>
       </div>
@@ -47,30 +39,19 @@
         <div class="view">
           <van-checkbox v-model="isCheck" checked-color="red"
             >我已阅读并同意
-            <a
-              class="agreement"
-              id="hd"
-              @click="toAgreePages('hdRule')"
+            <a class="agreement" id="hd" @click="toAgreePages('hdRule')"
               >《活动规则》</a
             >
-            <a
-              class="agreement"
-              id="ys"
-              @click="toAgreePages('ysRule')"
+            <a class="agreement" id="ys" @click="toAgreePages('ysRule')"
               >《隐私政策》</a
             >
           </van-checkbox>
         </div>
         <div>
-          <a
-            class="agreement"
-            id="hy2"
-            @click="toAgreePages('hyService')"
+          <a class="agreement" id="hy2" @click="toAgreePages('hyService')"
             >《会员服务协议》</a
           >
-          <span 
-            >{{ priceTips }}</span
-          >
+          <span>{{ priceTips }}</span>
         </div>
       </div>
     </div>
@@ -80,19 +61,6 @@
       <img :src="img4" alt="" class="rule-info" />
     </div>
   </div>
-  <van-overlay :show="overlayShow">
-    <div class="wrapper-div"><van-loading color="#1989fa" size="80" /></div>
-  </van-overlay>
-  <van-dialog
-    v-model:show="showDialogs"
-    v-if="showDialogs"
-    :title="dialogTitle"
-    show-confirm-button
-  >
-    <template #default>
-      <div v-html="richcontent" class="rich-content"></div>
-    </template>
-  </van-dialog>
   <van-dialog
     title="用户协议及隐私保护"
     style="width: 85%"
@@ -104,27 +72,16 @@
         <div class="agreement-view" style="padding: 0 30px">
           <div class="view">
             我已阅读并同意
-            <a
-              class="agreement"
-              id="hd"
-              @click="toAgreePages('hdRule')"
+            <a class="agreement" id="hd" @click="toAgreePages('hdRule')"
               >《活动规则》</a
             >
-            <a
-              class="agreement"
-              id="ys"
-              @click="toAgreePages('ysRule')"
+            <a class="agreement" id="ys" @click="toAgreePages('ysRule')"
               >《隐私政策》</a
             >
-            <a
-              class="agreement"
-              id="hy2"
-              @click="toAgreePages('hyService')"
+            <a class="agreement" id="hy2" @click="toAgreePages('hyService')"
               >《会员服务》</a
             >
-            <span 
-              >{{priceTips  }}</span
-            >
+            <span>{{ priceTips }}</span>
           </div>
         </div>
         <div class="btn-list">
@@ -146,18 +103,12 @@ import {
   resourceAreaDj,
   resourceAreaAv,
 } from "@/api/urls";
-import { isMobile, isIOS, showTel } from "@/utils/tools";
+import { isMobile, isIOS } from "@/utils/tools";
 import md5 from "js-md5";
 import { showDialog } from "vant";
 import { useRouter } from "vue-router";
-const longSpace = "\xa0".repeat(10);
 let $router = useRouter();
-let htmlLoadFinish = ref(false);
 let tipsShow = ref(false);
- let richcontent = ref("");
-let ntext = reactive([]);
-let showDialogs = ref(false);
-let dialogTitle = ref("");
 const promotionCode = ref("");
 let priceTips = ref("");
 let img1 = ref("");
@@ -165,21 +116,12 @@ let img2 = ref("");
 let img3 = ref("");
 let img4 = ref("");
 let price = ref("14");
-let promotionId = ref("");
-let payMethod = ref("");
-let periodPayDays = ref("");
-let confirmSwitch = ref("0");
-let autoSelect = ref("1");
+let codeValue = ref("");
 let callbackUrl = ref("");
 let backgroundColor = ref("");
 let mobile = ref("");
 let isCheck = ref(false);
-let overlayShow = ref(false);
-let coverImgUrl = ref("");
 let coverBtnImgUrl = ref("");
-let isTelOrder = ref(false);
-let showNoticeBar = ref(true);
-
 //同意弹窗
 const handleAgree = (type) => {
   if (type === "agree") {
@@ -197,7 +139,7 @@ const handleAgree = (type) => {
 };
 //手机号输入
 const phoneBlur = () => {
-  if (isMobile(mobile) && autoSelect.value == "1") {
+  if (isMobile(mobile)) {
     if (isCheck.value == false) {
       tipsShow.value = true;
     } else {
@@ -209,116 +151,39 @@ const phoneBlur = () => {
     }
   }
 };
-const getUrlParam = () => {
-  let url = document.location.toString();
-  let arrObj = url.split("?");
-  let params = Object.create(null);
-  if (arrObj.length > 1) {
-    arrObj = arrObj[1].split("&");
-    arrObj.forEach((item) => {
-      item = item.split("=");
-      params[item[0]] = item[1];
-    });
-  }
-  return params;
-};
 //跳转看agree等
 const toAgreePages = (types) => {
-  let typesparmes = types === "hdRule" ? 1 : types === "ysRule" ? 2 : 3;
-  if (promotionCode.value == "KXYBZU") {
-    resourceAgree({promotionId:promotionId.value, typesparmes}).then((resp) => {
-      richcontent.value = resp.data.result;
-      showDialogs.value = true;
-     dialogTitle.value =
-        types === "hdRule"
-          ? "活动规则"
-          : types === "ysRule"
-          ? "隐私政策"
-          : "会员服务";
-    });
-    return;
-  }
-  $router.push(`/agree?promotionId=${promotionId.value}&type=${typesparmes}`);
+  $router.push(`/agree?promotionId`);
 };
 const shouye = () => {
-  let param = getUrlParam();
-  yingnuoInfo({promotionCode:promotionCode.value}).then((resp) => {
+  yingnuoInfo({ promotionCode: promotionCode.value }).then((resp) => {
     if (resp.data.code == "S00000") {
       const result = resp.data.result;
       document.title = result.promotionName;
       const cdnBaseUrl = "https://prom-cdn.xtl10.fun/";
       // 图片链接
-      priceTips.value=result.showPrice
-      coverImgUrl.value = cdnBaseUrl + result.backImg;
+      priceTips.value = result.showPrice;
       img1.value = cdnBaseUrl + result.imgOne;
       img2.value = cdnBaseUrl + result.imgTwo;
       img3.value = cdnBaseUrl + result.imgThree;
       img4.value = cdnBaseUrl + result.imgFour;
-      coverBtnImgUrl.value = cdnBaseUrl + 'shangyou/ua0zbgt/1693808366023/订购202309041417304477037.png'
+      coverBtnImgUrl.value =
+        cdnBaseUrl +
+        "shangyou/ua0zbgt/1693808366023/订购202309041417304477037.png";
       // 其他属性
-      payMethod.value = result.payMethod;
       price.value = result.price;
-      backgroundColor.value=result.backgroundColor;
-      periodPayDays.value = result.periodPayDays;
-      confirmSwitch.value = result.confirmSwitch;
-      autoSelect.value = result.autoSelect;
+      backgroundColor.value = result.backgroundColor;
       callbackUrl.value = result.callbackUrl;
-   
-      promotionId.value= result.promotionId;
       mobile.value = result.tepn;
-      let isRend = true;
       if (getQueryVariable("phnumber")) {
-       const mobile = getQueryVariable("phnumber");
+        const mobile = getQueryVariable("phnumber");
         if (mobile && mobile.length > 0) {
           if (isMobile(mobile)) {
             isCheck.value = true;
-            isTelOrder.value = true;
             submitData();
-            isRend = false;
           }
         }
       }
-      if (isRend) {
-        const keyImages = [
-          { id: "coverImg", url: coverImgUrl.value },
-          { id: "img1", url: img1.value },
-          { id: "img2", url: img2.value },
-        ];
-        const otherImages = [
-          { id: "img3", url: img3.value },
-
-          { id: "img4", url: img4.value },
-        ];
-        const loadImages = (images) => {
-          return images.map((image) => {
-            return new Promise((resolve, reject) => {
-              const imgElement = document.getElementById(image.id);
-              if (imgElement && image.url) {
-                const img = new Image();
-                img.src = image.url;
-                img.onload = () => {
-                  imgElement.src = image.url;
-                  resolve(image.url);
-                };
-                img.onerror = () =>
-                  reject(new Error(`${image.url} load error`));
-              } else {
-                resolve(); // 如果没有 imgElement 或 url，则立即 resolve
-              }
-            });
-          });
-        };
-        // 先加载关键图片
-        Promise.all(loadImages(keyImages))
-          .then(() => {
-            htmlLoadFinish.value = true; // 关键图片加载完成，显示页面
-            // 后台继续加载其他图片
-            return Promise.all(loadImages(otherImages));
-          })
-          .catch((error) => {
-            console.error(error); // 处理加载错误
-          });
-      }
     }
   });
 };
@@ -332,9 +197,10 @@ const maidian = () => {
     .then((fp) => fp.get())
     .then((result) => {
       const visitorId = result.visitorId;
-      resourceAreaAv({ id: visitorId, promotionCode: promotionCode.value }).then(
-        (resp) => {}
-      );
+      resourceAreaAv({
+        id: visitorId,
+        promotionCode: promotionCode.value,
+      }).then((resp) => {});
     });
 };
 const getQueryVariable = (variable) => {
@@ -356,91 +222,15 @@ const submitOrder = () => {
     // showToast("请先阅读并同意服务条款");
   }
 };
-/*
- * changeURLStatic 修改地址栏URL参数 不跳转
- *   @param name 参数名
- *   @param value 参数值
- *
- * */
-const changeURLStatic = (name, value) => {
-  let url = location.href;
-  let url2 = "";
-  let reg = eval("/([?|&]" + name + "=)[^&]*/gi");
-  value = value.toString().replace(/(^\s*)|(\s*$)/g, ""); //移除首尾空格
-  if (!value) {
-    url2 = url.replace(reg, ""); //正则替换
-  } else {
-    if (url.match(reg)) {
-      url2 = url.replace(reg, "$1" + value); //正则替换
-    } else {
-      url2 = url + (url.indexOf("?") > -1 ? "&" : "?") + name + "=" + value; //没有参数添加参数
-    }
-  }
-  history.replaceState(null, null, url2); //替换地址栏
-};
 const submitData = async () => {
   if (!isMobile(mobile.value)) {
-    showToast("请输入正确的手机号码");
+    showToast("请输入正确的手机号");
     return;
   }
-  let ua = navigator.userAgent.toLowerCase();
-  try {
-    $refs.myInput.blur();
-  } catch {}
-  let xiayou = getQueryVariable("param");
-  let extra = getQueryVariable("extra");
-  //sim下游情况
-  if (extra != "" && xiayou != "") {
-    xiayou = '{"url" : "' + xiayou + '" , "id" : "' + extra + '"}';
+  if (!codeValue.value) {
+    showToast("请输入验证码");
+    return;
   }
-  if (callbackUrl.value == "Tammy") {
-    xiayou = window.location.search.substring(1);
-  }
-  if (callbackUrl.value == "jietingche") {
-    xiayou = getQueryVariable("jtcAdRequestId");
-  }
-  if (callbackUrl.value == "pp") {
-    xiayou = getQueryVariable("push_id");
-  }
-  let text = `mobile=${ mobile.value}promotionCode=${promotionCode.value}`
-  if (!isTelOrder.value) {
-    overlayShow.value = true;
-  }
-  let param = {
-    mobile: mobile.value,
-    promotionCode: promotionCode.value,
-    sign: md5(text),
-    extra: xiayou,
-    traceId: "323",
-  };
-  resourceAreaDj({promotionCode:promotionCode.value}).then((resp) => {});
-  proOrder(param)
-    .then((resp) => {
-      if (resp.data.code == "S00000") {
-        let jumpp = resp.data.result.payUrl;
-        if (ua.match(/MicroMessenger/i) == "micromessenger") {
-          if (payMethod.value == "0" && isIOS()) {
-            //空替换
-            jumpp = jumpp.replaceAll(
-              "https://openapi.alipay.com/gateway.do?",
-              ""
-            );
-          }
-        } else {
-          window.location.href = jumpp;
-        }
-      } else {
-        showDialog({
-          title: "提示",
-          message: resp.data.message,
-        });
-      }
-    })
-    .finally(() => {
-      setTimeout(function () {
-        overlayShow.value = false;
-      }, 1500);
-    });
 };
 //跳转
 const hrefurl = (p, payMethod, ios) => {
@@ -467,9 +257,9 @@ const hrefurl = (p, payMethod, ios) => {
     var link = document.createElement("a");
     link.href = `${
       location.protocol + "//" + location.host
-    }/static/wechatUrls.txt?payMethod=${payMethod}&url=${encodeURIComponent(
-      p
-    )}&promotionCode=${promotionCode.value}`;
+    }/static/wechatUrls.txt?url=${encodeURIComponent(p)}&promotionCode=${
+      promotionCode.value
+    }`;
     link.textContent = "点击这里下载PDF文件";
     link.download = "wechatUrls.txt";
     document.body.appendChild(link);
@@ -480,11 +270,6 @@ const hrefurl = (p, payMethod, ios) => {
 };
 onMounted(() => {
   promotionCode.value = getQueryVariable("promotionCode");
-  if (promotionCode.value != "RZpJsF") {
-    ntext = showTel();
-  } else {
-    showNoticeBar.value = false;
-  }
   maidian();
 });
 </script>
@@ -575,29 +360,25 @@ onMounted(() => {
     display: flex;
     align-items: center;
     flex-direction: column;
-    .ipt-view1{
+    .ipt-view1 {
       width: 85%;
       display: flex;
       margin-bottom: 50px !important;
-      .code{
+      .code {
         width: 40%;
         display: flex;
         align-items: center;
         justify-content: center;
         color: #fff;
         background: rgb(255, 133, 14);
-      border-top-right-radius: 65px;
-      border-bottom-right-radius: 65px;
-      height: 100%;
-      font-size: 16px;
-
-
-        
+        border-top-right-radius: 65px;
+        border-bottom-right-radius: 65px;
+        height: 100%;
+        font-size: 16px;
       }
-      .ipt1{
+      .ipt1 {
         width: 60% !important;
       }
-      
     }
     .ipt-view {
       background-color: #fff;
@@ -605,7 +386,7 @@ onMounted(() => {
       border-radius: 65px;
       display: -ms-flexbox;
       display: flex;
-      height: 54px  ;
+      height: 54px;
       margin: 15px 0px;
       width: 85%;
       .ipt {
@@ -617,7 +398,6 @@ onMounted(() => {
         border-radius: 50%;
         padding-left: 20px;
       }
-      
     }
     .trasition-btns {
       -webkit-animation: scaleBtn 2s ease-in-out infinite;
@@ -682,26 +462,26 @@ onMounted(() => {
   height: 100%;
 }
 .input_1 {
-    width: 85vw;
-    height: 7vh;
-    background-color: #fff;
-    border-radius: 7vh;
-    border: 1px solid #999;
-    display: flex;
-    align-items: center;
-    position: relative;
-    z-index: 2;
-  }
-  .codeText {
-    text-align: center;
-    font-size: 1rem;
-    padding-right: 15px;
-    background-color: rgb(255, 133, 14);
-    border-radius: 0 7vh 7vh 0;
-    height: 7vh;
-    line-height: 7vh;
-    border: 1px solid rgb(153, 153, 153);
-    color: rgb(255, 255, 255);
-    z-index: 5;
-  }
+  width: 85vw;
+  height: 7vh;
+  background-color: #fff;
+  border-radius: 7vh;
+  border: 1px solid #999;
+  display: flex;
+  align-items: center;
+  position: relative;
+  z-index: 2;
+}
+.codeText {
+  text-align: center;
+  font-size: 1rem;
+  padding-right: 15px;
+  background-color: rgb(255, 133, 14);
+  border-radius: 0 7vh 7vh 0;
+  height: 7vh;
+  line-height: 7vh;
+  border: 1px solid rgb(153, 153, 153);
+  color: rgb(255, 255, 255);
+  z-index: 5;
+}
 </style>