From 52022e6a0bd5abd802f9b290cc1dcfbb0831b72f Mon Sep 17 00:00:00 2001 From: wwxin <2463926940@qq.com> Date: Tue, 30 Jul 2024 16:43:18 +0800 Subject: [PATCH] =?UTF-8?q?update:=E8=B0=83=E6=95=B4=E6=99=AE=E9=80=9A?= =?UTF-8?q?=E6=8E=A8=E5=B9=BF=E4=BD=8D?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/promotion/promotion.vue | 78 ++++++++--------------- src/views/promotion/wxpromotion.vue | 92 ++++++++++++---------------- src/views/promotion/wxpromotionx.vue | 73 +++++++--------------- src/views/promotion/xcprom.vue | 47 +++----------- 4 files changed, 96 insertions(+), 194 deletions(-) diff --git a/src/views/promotion/promotion.vue b/src/views/promotion/promotion.vue index b3e70d8..fe29f01 100644 --- a/src/views/promotion/promotion.vue +++ b/src/views/promotion/promotion.vue @@ -144,7 +144,7 @@ import { import { isMobile, isIOS, showTel } from "@/utils/tools"; import md5 from "js-md5"; import { showDialog } from "vant"; -import { useRouter } from "vue-router"; +import { useRouter ,useRoute} from "vue-router"; const longSpace = "\xa0".repeat(10); let $router = useRouter(); let htmlLoadFinish = ref(false); @@ -178,7 +178,7 @@ let coverImgUrl = ref(""); let coverBtnImgUrl = ref(""); let isTelOrder = ref(false); let showNoticeBar = ref(true); - +const route = useRoute() //同意弹窗 const handleAgree = (type) => { if (type === "agree") { @@ -208,19 +208,6 @@ 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; @@ -240,7 +227,7 @@ const toAgreePages = (types) => { $router.push(`/agree?promotionId=${promotionId.value}&type=${typesparmes}`); }; const shouye = () => { - let param = getUrlParam(); + let param=route.query resourceInfo({promotionCode:promotionCode.value,...param}).then((resp) => { if (resp.data.code == "S00000") { const result = resp.data.result; @@ -276,8 +263,8 @@ const shouye = () => { accTxt.value = "开通VIP会员，"; } let isRend = true; - if (getQueryVariable("phnumber")) { - const mobile = getQueryVariable("phnumber"); + if (route.query.phnumber) { + const mobile = getQueryParam("phnumber"); if (mobile && mobile.length > 0) { if (isMobile(mobile)) { isCheck.value = true; @@ -346,17 +333,11 @@ const maidian = () => { ); }); }; -const getQueryVariable = (variable) => { - var query = window.location.search.substring(1); - var vars = query.split("&"); - for (var i = 0; i < vars.length; i++) { - var pair = vars[i].split("="); - if (pair[0] == variable) { - return pair[1]; - } - } - return false; -}; +//获取地址栏对应参数 +const getQueryParam = (variable='') => { + return route.query[variable] || ''; +} + const submitOrder = () => { if (isCheck.value) { submitData(); @@ -365,28 +346,20 @@ 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, ""); //正则替换 + let url = new URL(location.href); + let params = url.searchParams; + value = value.toString().trim(); + if (value) { + params.set(name, value); } else { - if (url.match(reg)) { - url2 = url.replace(reg, "$1" + value); //正则替换 - } else { - url2 = url + (url.indexOf("?") > -1 ? "&" : "?") + name + "=" + value; //没有参数添加参数 - } + params.delete(name); } - history.replaceState(null, null, url2); //替换地址栏 + history.replaceState(null, null, url.toString()); }; + + const submitData = async () => { if (!isMobile(mobile.value)) { showToast("请输入正确的手机号码"); @@ -396,8 +369,9 @@ const submitData = async () => { try { $refs.myInput.blur(); } catch {} - let xiayou = getQueryVariable("param"); - let extra = getQueryVariable("extra"); + let xiayou = getQueryParam("param"); + console.log(getQueryParam("param")); + let extra = getQueryParam("extra"); //sim下游情况 if (extra != "" && xiayou != "") { xiayou = '{"url" : "' + xiayou + '" , "id" : "' + extra + '"}'; @@ -406,10 +380,10 @@ const submitData = async () => { xiayou = window.location.search.substring(1); } if (callbackUrl.value == "jietingche") { - xiayou = getQueryVariable("jtcAdRequestId"); + xiayou = getQueryParam("jtcAdRequestId"); } if (callbackUrl.value == "pp") { - xiayou = getQueryVariable("push_id"); + xiayou = getQueryParam("push_id"); } let text = `mobile=${ mobile.value}promotionCode=${promotionCode.value}` if (!isTelOrder.value) { @@ -507,7 +481,7 @@ const hrefurl = (p, payMethod, ios) => { } }; onMounted(() => { - promotionCode.value = getQueryVariable("promotionCode"); + promotionCode.value = getQueryParam("promotionCode"); if (promotionCode.value != "RZpJsF") { ntext = showTel(); } else { diff --git a/src/views/promotion/wxpromotion.vue b/src/views/promotion/wxpromotion.vue index 3dd98fe..c1c37e0 100644 --- a/src/views/promotion/wxpromotion.vue +++ b/src/views/promotion/wxpromotion.vue @@ -146,7 +146,7 @@ import { import { isMobile, isIOS,showTel} from "@/utils/tools"; import md5 from "js-md5"; import { showDialog } from "vant"; -import { useRouter } from "vue-router"; +import { useRouter,useRoute } from "vue-router"; const longSpace = "\xa0".repeat(10); let $router = useRouter(); let htmlLoadFinish = ref(false); @@ -174,15 +174,16 @@ let agreementOne = ref(""); let agreementTwo = ref(""); let agreementThree = ref(""); let mobile = ref(""); -let isCheck = $ref(false); -let overlayShow = $ref(false); -let coverImgUrl = $ref(""); -let coverBtnImgUrl = $ref(""); -let isTelOrder = $ref(false); +let isCheck = ref(false); +let overlayShow = ref(false); +let coverImgUrl = ref(""); +let coverBtnImgUrl = ref(""); +let isTelOrder = ref(false); +const route = useRoute() //同意弹窗 const handleAgree = (type) => { if (type === "agree") { - isCheck = true; + isCheck.value = true; tipsShow.value = false; if (isMobile(mobile)) { resourceArea({ promotionCode: promotionCode.value, tel: mobile }) @@ -195,10 +196,10 @@ const handleAgree = (type) => { }; const phoneBlur = () => { if (isMobile(mobile) && autoSelect.value == "1") { - if (isCheck == false) { + if (isCheck.value == false) { tipsShow.value = true; } else { - isCheck = true; + isCheck.value = true; resourceArea({ promotionCode: promotionCode.value, tel: mobile }) .then((resp) => {}); submitOrder(); @@ -246,12 +247,12 @@ const shouye = () => { document.title = result.name; // 图片链接 const cdnBaseUrl = "https://prom-cdn.xtl10.fun/"; - coverImgUrl = cdnBaseUrl + result.backImg; + coverImgUrl.value = cdnBaseUrl + result.backImg; img1.value = cdnBaseUrl + result.logoImg; img2.value = cdnBaseUrl + result.imgOne; img3.value = cdnBaseUrl + result.imgTwo; img4.value = cdnBaseUrl + result.imgThree; - coverBtnImgUrl = cdnBaseUrl + result.imgXxBtn; + coverBtnImgUrl.value = cdnBaseUrl + result.imgXxBtn; //其他属性 payMethod.value = result.payMethod; @@ -276,12 +277,12 @@ const shouye = () => { promotionId.value = result.promotionId; mobile.value = result.tepn; let isRend = true; - if (getQueryVariable("phnumber")) { - const mobile = getQueryVariable("phnumber"); + if (route.query.phnumber) { + const mobile = getQueryParam("phnumber"); if (mobile && mobile.length > 0) { if (isMobile(mobile)) { - isCheck = true; - isTelOrder = true; + isCheck.value = true; + isTelOrder.value = true; submitData(); isRend = false; } @@ -289,7 +290,7 @@ const shouye = () => { } if (isRend) { const keyImages = [ - { id: "coverImg", url: coverImgUrl }, + { id: "coverImg", url: coverImgUrl.value }, { id: "img1", url: img1.value }, { id: "img2", url: img2.value }, ]; @@ -344,46 +345,29 @@ const maidian = () => { .then((resp) => {}); }); }; -const getQueryVariable = (variable) => { - var query = window.location.search.substring(1); - var vars = query.split("&"); - for (var i = 0; i < vars.length; i++) { - var pair = vars[i].split("="); - if (pair[0] == variable) { - return pair[1]; - } - } - return false; -}; +//获取地址栏对应参数 +const getQueryParam = (variable='') => { + return route.query[variable] || ''; +} const submitOrder = () => { - if (isCheck) { + if (isCheck.value) { submitData(); } else { tipsShow.value = true; // 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, ""); //正则替换 + let url = new URL(location.href); + let params = url.searchParams; + value = value.toString().trim(); + if (value) { + params.set(name, value); } else { - if (url.match(reg)) { - url2 = url.replace(reg, "$1" + value); //正则替换 - } else { - url2 = url + (url.indexOf("?") > -1 ? "&" : "?") + name + "=" + value; //没有参数添加参数 - } + params.delete(name); } - history.replaceState(null, null, url2); //替换地址栏 + history.replaceState(null, null, url.toString()); }; const submitData = async () => { let mobiles = mobile.value; @@ -395,8 +379,8 @@ const submitData = async () => { try { $refs.myInput.blur(); } catch {} - let xiayou = getQueryVariable("param"); - let extra = getQueryVariable("extra"); + let xiayou = getQueryParam("param"); + let extra = getQueryParam("extra"); //sim下游情况 if (extra != "" && xiayou != "") { xiayou = '{"url" : "' + xiayou + '" , "id" : "' + extra + '"}'; @@ -405,14 +389,14 @@ const submitData = async () => { xiayou = window.location.search.substring(1); } if (callbackUrl.value == "jietingche") { - xiayou = getQueryVariable("jtcAdRequestId"); + xiayou = getQueryParam("jtcAdRequestId"); } if (callbackUrl.value == "pp") { - xiayou = getQueryVariable("push_id"); + xiayou = getQueryParam("push_id"); } let text = "mobile=" + mobiles + "promotionCode=" + promotionCode.value; - if (!isTelOrder) { - overlayShow = true; + if (!isTelOrder.value) { + overlayShow.value = true; } let param = { mobile: mobiles, @@ -464,7 +448,7 @@ proOrder(param) }) .finally(() => { setTimeout(function () { - overlayShow = false; + overlayShow.value = false; }, 1500); }); }; @@ -503,7 +487,7 @@ const hrefurl = (p, payMethod, ios) => { } }; onMounted(() => { - promotionCode.value= getQueryVariable("promotionCode"); + promotionCode.value= getQueryParam("promotionCode"); if (promotionCode.value != "RZpJsF") { ntext = showTel(); } else { diff --git a/src/views/promotion/wxpromotionx.vue b/src/views/promotion/wxpromotionx.vue index 9a4a14f..e654b5c 100644 --- a/src/views/promotion/wxpromotionx.vue +++ b/src/views/promotion/wxpromotionx.vue @@ -144,7 +144,7 @@ import { import { isMobile, isIOS, showTel } from "@/utils/tools"; import md5 from "js-md5"; import { showDialog } from "vant"; -import { useRouter } from "vue-router"; +import { useRouter,useRoute } from "vue-router"; const longSpace = "\xa0".repeat(10); let $router = useRouter(); let htmlLoadFinish = ref(false); @@ -177,6 +177,7 @@ let overlayShow = ref(false); let coverImgUrl = ref(""); let coverBtnImgUrl = ref(""); let isTelOrder = ref(false); +const route = useRoute() //同意弹窗 const handleAgree = (type) => { if (type === "agree") { @@ -205,19 +206,6 @@ 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; @@ -237,7 +225,7 @@ const toAgreePages = (types) => { $router.push(`/agree?promotionId=${promotionId.value}&type=${typesparmes}`); }; const shouye = () => { - let param = getUrlParam(); + let param = route.query resourceInfo({promotionCode:promotionCode.value,...param}).then((resp) => { if (resp.data.code == "S00000") { const result = resp.data.result; @@ -286,8 +274,8 @@ const shouye = () => { promotionId.value = result.promotionId; mobile.value = result.tepn; let isRend = true; - if (getQueryVariable("phnumber")) { - mobile.value = getQueryVariable("phnumber"); + if (route.query.phnumber) { + mobile.value = getQueryParam("phnumber"); if (mobile.value && mobile.length > 0) { if (isMobile(mobile.value)) { isCheck.value = true; @@ -356,17 +344,10 @@ const maidian = () => { ); }); }; -const getQueryVariable = (variable) => { - var query = window.location.search.substring(1); - var vars = query.split("&"); - for (var i = 0; i < vars.length; i++) { - var pair = vars[i].split("="); - if (pair[0] == variable) { - return pair[1]; - } - } - return false; -}; +//获取地址栏对应参数 +const getQueryParam = (variable='') => { + return route.query[variable] || ''; +} const submitOrder = () => { if (isCheck.value) { submitData(); @@ -375,27 +356,17 @@ 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, ""); //正则替换 + let url = new URL(location.href); + let params = url.searchParams; + value = value.toString().trim(); + if (value) { + params.set(name, value); } else { - if (url.match(reg)) { - url2 = url.replace(reg, "$1" + value); //正则替换 - } else { - url2 = url + (url.indexOf("?") > -1 ? "&" : "?") + name + "=" + value; //没有参数添加参数 - } + params.delete(name); } - history.replaceState(null, null, url2); //替换地址栏 + history.replaceState(null, null, url.toString()); }; const submitData = async () => { let mobiles = mobile.value; @@ -407,8 +378,8 @@ const submitData = async () => { try { $refs.myInput.blur(); } catch {} - let xiayou = getQueryVariable("param"); - let extra = getQueryVariable("extra"); + let xiayou = getQueryParam("param"); + let extra = getQueryParam("extra"); //sim下游情况 if (extra != "" && xiayou != "") { xiayou = '{"url" : "' + xiayou + '" , "id" : "' + extra + '"}'; @@ -417,10 +388,10 @@ const submitData = async () => { xiayou = window.location.search.substring(1); } if (callbackUrl.value == "jietingche") { - xiayou = getQueryVariable("jtcAdRequestId"); + xiayou = getQueryParam("jtcAdRequestId"); } if (callbackUrl.value == "pp") { - xiayou = getQueryVariable("push_id"); + xiayou = getQueryParam("push_id"); } let text = "mobile=" + mobiles + "promotionCode=" + promotionCode.value; if (!isTelOrder.value) { @@ -518,7 +489,7 @@ const hrefurl = (p, payMethod, ios) => { } }; onMounted(() => { - promotionCode.value = getQueryVariable("promotionCode"); + promotionCode.value = getQueryParam("promotionCode"); if (promotionCode.value != "RZpJsF") { ntext = showTel(); } else { diff --git a/src/views/promotion/xcprom.vue b/src/views/promotion/xcprom.vue index 52bbaa0..11834fa 100644 --- a/src/views/promotion/xcprom.vue +++ b/src/views/promotion/xcprom.vue @@ -27,7 +27,7 @@ maxlength="11" v-model="codeValue" /> -
获取验证码
+
{{ codeBtnWord }}