5 changed files with 183 additions and 215 deletions
@ -1,219 +1,184 @@ |
|||||
let scaleW; |
let scaleW; |
||||
|
|
||||
function initDate(){ |
|
||||
let date = new Date(); |
|
||||
let minu = date.getMinutes()>9?date.getMinutes():"0"+date.getMinutes(); |
|
||||
let hour = date.getHours()>9?date.getHours():"0"+date.getHours(); |
|
||||
document.getElementById("timeTxt").innerText = hour+":"+minu; |
|
||||
let mouth = date.getMonth()+1>9?date.getMonth()+1:"0"+(date.getMonth()+1); |
|
||||
let day = date.getDate()>9?date.getDate() : "0"+date.getDate(); |
|
||||
document.getElementById("dateTxt").innerText = date.getFullYear()+"-"+mouth+"-"+day; |
|
||||
let week = date.getDay(); |
|
||||
let weekName = "星期一"; |
|
||||
switch(week){ |
|
||||
case 0: |
|
||||
weekName = "星期日"; |
|
||||
break; |
|
||||
case 1: |
|
||||
weekName = "星期一"; |
|
||||
break; |
|
||||
case 2: |
|
||||
weekName = "星期二"; |
|
||||
break; |
|
||||
case 3: |
|
||||
weekName = "星期三"; |
|
||||
break; |
|
||||
case 4: |
|
||||
weekName = "星期四"; |
|
||||
break; |
|
||||
case 5: |
|
||||
weekName = "星期五"; |
|
||||
break; |
|
||||
case 6: |
|
||||
weekName = "星期六"; |
|
||||
break; |
|
||||
} |
|
||||
document.getElementById("weekTxt").innerText = weekName; |
|
||||
} |
|
||||
|
|
||||
function onchangeSize(){ |
|
||||
scaleW = window.innerHeight/(1248/704); |
|
||||
document.getElementById("bg").style.width = scaleW+"px"; |
|
||||
document.getElementById("txtBg").style.width = scaleW/(1080/540)+"px"; |
|
||||
document.getElementById("overImg").style.width = scaleW+"px"; |
|
||||
document.getElementById("overImg").style.height = 261/(1080/scaleW)+"px"; |
|
||||
document.getElementById("overTop").style.width = scaleW+"px"; |
|
||||
document.getElementById("overTop").style.height = 180/(1080/scaleW)+"px"; |
|
||||
document.getElementById("txtBg").style.height = window.innerHeight/(1920/1312)+"px"; |
|
||||
document.getElementById("txtBg").style.right = scaleW/(1080/36)+"px"; |
|
||||
document.getElementById("txtBg").style.bottom = window.innerHeight/(1920/250)+"px"; |
|
||||
document.getElementById("startBnt").style.bottom = window.innerHeight/(1920/130)+"px"; |
|
||||
document.getElementById("stopBnt").style.bottom = window.innerHeight/(1920/125)+"px"; |
|
||||
} |
|
||||
|
|
||||
//设置滚动条位置
|
|
||||
function setScrollPosition() { |
|
||||
setTimeout(()=>{ |
|
||||
let h0 = document.getElementById("cont").offsetHeight; |
|
||||
let h1 = (window.innerHeight/(1920/1312)-56); |
|
||||
if(h0-h1>0){ |
|
||||
document.getElementById("txtBg").scrollTo({ |
|
||||
top: h0-h1, |
|
||||
behavior: 'smooth' |
|
||||
}); |
|
||||
|
var QMUtil = { |
||||
|
initDate: function (){ |
||||
|
let date = new Date(); |
||||
|
let minu = date.getMinutes()>9?date.getMinutes():"0"+date.getMinutes(); |
||||
|
let hour = date.getHours()>9?date.getHours():"0"+date.getHours(); |
||||
|
document.getElementById("timeTxt").innerText = hour+":"+minu; |
||||
|
let mouth = date.getMonth()+1>9?date.getMonth()+1:"0"+(date.getMonth()+1); |
||||
|
let day = date.getDate()>9?date.getDate() : "0"+date.getDate(); |
||||
|
document.getElementById("dateTxt").innerText = date.getFullYear()+"-"+mouth+"-"+day; |
||||
|
let week = date.getDay(); |
||||
|
let weekName = "星期一"; |
||||
|
switch(week){ |
||||
|
case 0: |
||||
|
weekName = "星期日"; |
||||
|
break; |
||||
|
case 1: |
||||
|
weekName = "星期一"; |
||||
|
break; |
||||
|
case 2: |
||||
|
weekName = "星期二"; |
||||
|
break; |
||||
|
case 3: |
||||
|
weekName = "星期三"; |
||||
|
break; |
||||
|
case 4: |
||||
|
weekName = "星期四"; |
||||
|
break; |
||||
|
case 5: |
||||
|
weekName = "星期五"; |
||||
|
break; |
||||
|
case 6: |
||||
|
weekName = "星期六"; |
||||
|
break; |
||||
} |
} |
||||
},200); |
|
||||
} |
|
||||
|
|
||||
function addAvdi(){ |
|
||||
let wli = document.createElement("li"); |
|
||||
wli.className = "left" |
|
||||
wli.innerHTML="<div>更多精彩内容请关注德基广场小程序</div>"; |
|
||||
document.getElementById("cont").appendChild(wli); |
|
||||
let wli2 = document.createElement("li"); |
|
||||
wli2.className = "left" |
|
||||
wli2.innerHTML='<div><img src="./assets/face.svg" width="80" /></div>'; |
|
||||
document.getElementById("cont").appendChild(wli2); |
|
||||
setScrollPosition(); |
|
||||
} |
|
||||
|
|
||||
function addredHot(){ |
|
||||
let aili = document.createElement("li"); |
|
||||
aili.className = "left" |
|
||||
aili.innerHTML="<span>小德</span>"; |
|
||||
document.getElementById("cont").appendChild(aili); |
|
||||
} |
|
||||
//活动
|
|
||||
function addBackItemAction(obj){ |
|
||||
let li = document.createElement("li"); |
|
||||
li.className = "left" |
|
||||
document.getElementById("cont").appendChild(li); |
|
||||
let div = document.createElement("div"); |
|
||||
li.appendChild(div); |
|
||||
let w = (scaleW/(1080/240)); |
|
||||
let num = (typeof obj.shopNum) == "string" ? 2:3; |
|
||||
let dip = num == 3 ? "none":""; |
|
||||
div.innerHTML = `<img src="${obj.logo}" style="border-radius: 12px;" width="110" />
|
|
||||
<div style="display: flex;flex-direction: column;width: ${w}px;padding: 0 0 0 20px;gap: 10px;"> |
|
||||
<span style="color:#000; white-space:nowrap;text-overflow: ellipsis;overflow: hidden;word-break: break-all;">${obj.name}</span> |
|
||||
<span style="color:#000; white-space:nowrap;text-overflow: ellipsis;overflow: hidden;word-break: break-all;display:${dip};">店铺编号: ${obj.shopNum}</span> |
|
||||
<span style="color:#000; overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: ${num};line-clamp: ${num};-webkit-box-orient: vertical;">${obj.intro}</span> |
|
||||
</div>`; |
|
||||
} |
|
||||
//文本
|
|
||||
function addBackItemText(msg, idName="", isTTS=true){ |
|
||||
let li = document.createElement("li"); |
|
||||
li.id = idName |
|
||||
li.className = "left" |
|
||||
document.getElementById("cont").appendChild(li); |
|
||||
let div = document.createElement("div"); |
|
||||
li.appendChild(div); |
|
||||
if(typeof msg == "string"){ |
|
||||
div.innerText = msg; |
|
||||
}else if(typeof msg.length == "number"){ |
|
||||
div.innerText = msg[0].name || "我在持续学习中..."; |
|
||||
}else{ |
|
||||
div.innerText = msg.name || "我在持续学习中..."; |
|
||||
} |
|
||||
if(isTTS){ |
|
||||
window.isHello = false; |
|
||||
window.isplayHello=false; |
|
||||
startTTS(div.innerText); |
|
||||
} |
|
||||
} |
|
||||
//单图片
|
|
||||
function addItemImg(imgUrl){ |
|
||||
let li_img = document.createElement("li"); |
|
||||
li_img.className = "left" |
|
||||
document.getElementById("cont").appendChild(li_img); |
|
||||
let w = (scaleW/(1080/535)); |
|
||||
li_img.innerHTML = `<img width="${w}" src="${imgUrl}" />`; |
|
||||
} |
|
||||
//单图片
|
|
||||
function addItemSmallImg(imgUrl){ |
|
||||
let li_img = document.createElement("li"); |
|
||||
li_img.className = "left" |
|
||||
document.getElementById("cont").appendChild(li_img); |
|
||||
let w = (scaleW/(1080/200)); |
|
||||
li_img.innerHTML = `<img width="${w}" src="${imgUrl}" />`; |
|
||||
} |
|
||||
function addItemBigImg(imgUrl, videoUrl, clickFun){ |
|
||||
let li_img = document.createElement("img"); |
|
||||
document.getElementById("cont").appendChild(li_img); |
|
||||
let w = (scaleW/(1080/535)); |
|
||||
li_img.style.width = w+"px"; |
|
||||
li_img.style.borderRadius = "20px"; |
|
||||
li_img.src = imgUrl; |
|
||||
li_img.width = w; |
|
||||
li_img.dataset.video = videoUrl; |
|
||||
if(clickFun){ |
|
||||
li_img.addEventListener("click", clickFun); |
|
||||
} |
|
||||
} |
|
||||
|
document.getElementById("weekTxt").innerText = weekName; |
||||
|
}, |
||||
|
|
||||
|
onchangeSize: function (){ |
||||
|
scaleW = window.innerHeight/(1248/704); |
||||
|
document.getElementById("bg").style.width = scaleW+"px"; |
||||
|
document.getElementById("txtBg").style.width = scaleW/(1080/540)+"px"; |
||||
|
document.getElementById("overImg").style.width = scaleW+"px"; |
||||
|
document.getElementById("overImg").style.height = 261/(1080/scaleW)+"px"; |
||||
|
document.getElementById("overTop").style.width = scaleW+"px"; |
||||
|
document.getElementById("overTop").style.height = 180/(1080/scaleW)+"px"; |
||||
|
document.getElementById("txtBg").style.height = window.innerHeight/(1920/1312)+"px"; |
||||
|
document.getElementById("txtBg").style.right = scaleW/(1080/36)+"px"; |
||||
|
document.getElementById("txtBg").style.bottom = window.innerHeight/(1920/250)+"px"; |
||||
|
document.getElementById("startBnt").style.bottom = window.innerHeight/(1920/130)+"px"; |
||||
|
document.getElementById("stopBnt").style.bottom = window.innerHeight/(1920/125)+"px"; |
||||
|
}, |
||||
|
|
||||
function addClickItemImg(div,url,popUrl,width,height,clickFun){ |
|
||||
let img = document.createElement("img"); |
|
||||
img.className = "scroll-img"; |
|
||||
img.width = width; |
|
||||
img.height = height; |
|
||||
img.src = url; |
|
||||
img.dataset.pop = popUrl; |
|
||||
if(clickFun){ |
|
||||
img.addEventListener("click", clickFun); |
|
||||
} |
|
||||
div.appendChild(img); |
|
||||
} |
|
||||
|
//设置滚动条位置
|
||||
|
setScrollPosition:function () { |
||||
|
setTimeout(()=>{ |
||||
|
let h0 = document.getElementById("cont").offsetHeight; |
||||
|
let h1 = (window.innerHeight/(1920/1312)-56); |
||||
|
if(h0-h1>0){ |
||||
|
document.getElementById("txtBg").scrollTo({ |
||||
|
top: h0-h1, |
||||
|
behavior: 'smooth' |
||||
|
}); |
||||
|
} |
||||
|
},200); |
||||
|
}, |
||||
|
|
||||
function addWrapper(){ |
|
||||
let li = document.createElement("li"); |
|
||||
document.getElementById("cont").appendChild(li); |
|
||||
li.className = "scroll-container"; |
|
||||
let wrapper = document.createElement("div"); |
|
||||
wrapper.className="scroll-wrapper"; |
|
||||
li.appendChild(wrapper); |
|
||||
return wrapper; |
|
||||
} |
|
||||
|
addAvdi:function (){ |
||||
|
let wli = document.createElement("li"); |
||||
|
wli.className = "left" |
||||
|
wli.innerHTML="<div>更多精彩内容请关注德基广场小程序</div>"; |
||||
|
document.getElementById("cont").appendChild(wli); |
||||
|
let wli2 = document.createElement("li"); |
||||
|
wli2.className = "left" |
||||
|
wli2.innerHTML='<div><img src="./assets/face.svg" width="80" /></div>'; |
||||
|
document.getElementById("cont").appendChild(wli2); |
||||
|
setScrollPosition(); |
||||
|
}, |
||||
|
|
||||
function requestNoJM (params) { |
|
||||
let xmlhttp = new XMLHttpRequest(); |
|
||||
xmlhttp.onreadystatechange = function () { |
|
||||
if (xmlhttp.readyState === 4 && xmlhttp.status === 200) { |
|
||||
let jsonObject; |
|
||||
try { |
|
||||
jsonObject = JSON.parse(xmlhttp.responseText); |
|
||||
} catch (e) { |
|
||||
params.fail(); |
|
||||
return; |
|
||||
|
addredHot:function (){ |
||||
|
let aili = document.createElement("li"); |
||||
|
aili.className = "left" |
||||
|
aili.innerHTML="<span>小德</span>"; |
||||
|
document.getElementById("cont").appendChild(aili); |
||||
|
}, |
||||
|
//活动
|
||||
|
addBackItemAction:function (obj){ |
||||
|
let li = document.createElement("li"); |
||||
|
li.className = "left" |
||||
|
document.getElementById("cont").appendChild(li); |
||||
|
let div = document.createElement("div"); |
||||
|
li.appendChild(div); |
||||
|
let w = (scaleW/(1080/240)); |
||||
|
let num = (typeof obj.shopNum) == "string" ? 2:3; |
||||
|
let dip = num == 3 ? "none":""; |
||||
|
div.innerHTML = `<img src="${obj.logo}" style="border-radius: 12px;" width="110" />
|
||||
|
<div style="display: flex;flex-direction: column;width: ${w}px;padding: 0 0 0 20px;gap: 10px;"> |
||||
|
<span style="color:#000; white-space:nowrap;text-overflow: ellipsis;overflow: hidden;word-break: break-all;">${obj.name}</span> |
||||
|
<span style="color:#000; white-space:nowrap;text-overflow: ellipsis;overflow: hidden;word-break: break-all;display:${dip};">店铺编号: ${obj.shopNum}</span> |
||||
|
<span style="color:#000; overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: ${num};line-clamp: ${num};-webkit-box-orient: vertical;">${obj.intro}</span> |
||||
|
</div>`; |
||||
|
}, |
||||
|
//文本
|
||||
|
addBackItemText:function (msg, idName="", isTTS=true){ |
||||
|
let li = document.createElement("li"); |
||||
|
li.id = idName |
||||
|
li.className = "left" |
||||
|
document.getElementById("cont").appendChild(li); |
||||
|
let div = document.createElement("div"); |
||||
|
li.appendChild(div); |
||||
|
if(typeof msg == "string"){ |
||||
|
div.innerText = msg; |
||||
|
}else if(typeof msg.length == "number"){ |
||||
|
div.innerText = msg[0].name || "我在持续学习中..."; |
||||
|
}else{ |
||||
|
div.innerText = msg.name || "我在持续学习中..."; |
||||
} |
} |
||||
if (jsonObject.code == "200") { |
|
||||
params.success(jsonObject); |
|
||||
|
if(isTTS){ |
||||
|
window.isHello = false; |
||||
|
window.isplayHello=false; |
||||
|
startTTS(div.innerText); |
||||
} |
} |
||||
} |
|
||||
if (xmlhttp.readyState === 4 && (xmlhttp.status === 404 || xmlhttp.status === 405)) { |
|
||||
params.fail(); |
|
||||
} |
|
||||
}; |
|
||||
xmlhttp.onerror = function (e) { |
|
||||
params.fail(); |
|
||||
}; |
|
||||
xmlhttp.open('GET', params.url, true); |
|
||||
xmlhttp.setRequestHeader("Content-type", "application/json"); |
|
||||
xmlhttp.send(); |
|
||||
} |
|
||||
|
}, |
||||
|
//单图片
|
||||
|
addItemImg:function (imgUrl){ |
||||
|
let li_img = document.createElement("li"); |
||||
|
li_img.className = "left" |
||||
|
document.getElementById("cont").appendChild(li_img); |
||||
|
let w = (scaleW/(1080/535)); |
||||
|
li_img.innerHTML = `<img width="${w}" src="${imgUrl}" />`; |
||||
|
}, |
||||
|
//单图片
|
||||
|
addItemSmallImg:function (imgUrl){ |
||||
|
let li_img = document.createElement("li"); |
||||
|
li_img.className = "left" |
||||
|
document.getElementById("cont").appendChild(li_img); |
||||
|
let w = (scaleW/(1080/200)); |
||||
|
li_img.innerHTML = `<img width="${w}" src="${imgUrl}" />`; |
||||
|
}, |
||||
|
addItemBigImg:function (imgUrl, videoUrl, clickFun){ |
||||
|
let li_img = document.createElement("img"); |
||||
|
document.getElementById("cont").appendChild(li_img); |
||||
|
let w = (scaleW/(1080/535)); |
||||
|
li_img.style.width = w+"px"; |
||||
|
li_img.style.borderRadius = "20px"; |
||||
|
li_img.src = imgUrl; |
||||
|
li_img.width = w; |
||||
|
li_img.dataset.video = videoUrl; |
||||
|
if(videoUrl && clickFun){ |
||||
|
li_img.addEventListener("click", clickFun); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
var config = { |
|
||||
|
addClickItemImg:function (div,url,popUrl,width,height,clickFun){ |
||||
|
let img = document.createElement("img"); |
||||
|
img.className = "scroll-img"; |
||||
|
img.width = width; |
||||
|
img.height = height; |
||||
|
img.src = url; |
||||
|
img.dataset.pop = popUrl; |
||||
|
if(popUrl && clickFun){ |
||||
|
img.addEventListener("click", clickFun); |
||||
|
} |
||||
|
div.appendChild(img); |
||||
|
}, |
||||
|
|
||||
|
addWrapper:function (){ |
||||
|
let li = document.createElement("li"); |
||||
|
document.getElementById("cont").appendChild(li); |
||||
|
li.className = "scroll-container"; |
||||
|
let wrapper = document.createElement("div"); |
||||
|
wrapper.className="scroll-wrapper"; |
||||
|
li.appendChild(wrapper); |
||||
|
return wrapper; |
||||
|
}, |
||||
|
config:{ |
||||
"APPID":"5c2055f8", |
"APPID":"5c2055f8", |
||||
"API_SECRET":"2bc7168506a38cf1a7a52fb3ba63d873", |
"API_SECRET":"2bc7168506a38cf1a7a52fb3ba63d873", |
||||
"API_KEY":"2d1e9e5604d66089bda42ff4797201c1" |
"API_KEY":"2d1e9e5604d66089bda42ff4797201c1" |
||||
} |
} |
||||
|
} |
||||
|
|
||||
export {initDate,onchangeSize,setScrollPosition,addBackItemText,addItemImg,addWrapper,addClickItemImg,addAvdi,addItemSmallImg,addItemBigImg,addredHot,addBackItemAction, config} |
|
||||
//
|
|
||||
// requestNoJM({
|
|
||||
// url: 'https://saas.1000my.com/Api/System/Login?key='+param,
|
|
||||
// success: (res) => {
|
|
||||
// console.log(res);
|
|
||||
// },
|
|
||||
// fail: () => {}
|
|
||||
// })
|
|
||||
|
export default QMUtil; |
||||
|
|||||
Loading…
Reference in new issue