'; var iframe = document.createElement('iframe'); var iframeHtml = "
"; document.body.appendChild(yw_chat_window); yw_chat_window.outerHTML = windowHtml; yw_chat_window = document.getElementById('yw_chat_window'); yw_chat_window.appendChild(banner); banner.outerHTML = bannerHtml; yw_chat_window.appendChild(iframe); iframe.outerHTML = iframeHtml; var yw_chat_close = document.getElementById('yw_chat_close'); yw_chat_close.addEventListener('click', function () { yw_chat_window.style.width = '0'; }); setTimeout(function () { yw_chat_window.style.width = width + 'px'; }, 20); addMoveEvent(); }};function addMoveEvent () { var banner = document.getElementById('yw_chat_banner'); var x = 0; var y = 0; var l = 0; var t = 0; banner.addEventListener('mousedown', function (e) { x = e.clientX; y = e.clientY; l = yw_chat_window.offsetLeft; t = yw_chat_window.offsetTop; yw_isDown = true; banner.style.cursor = 'move'; }); banner.addEventListener('mouseleave', release); window.addEventListener('mousemove', function (e) { if (yw_isDown === false) { return; } var nx = e.clientX; var ny = e.clientY; var nl = nx - (x - l); var nt = ny - (y - t); nl = Math.min(Math.max(0, nl), w_inner_w - yw_chat_window.offsetWidth); nt = Math.min(Math.max(0, nt), w_inner_h - yw_chat_window.offsetHeight); yw_chat_window.style.left = nl + 'px'; yw_chat_window.style.top = nt + 'px'; }); function release () { yw_isDown = false; banner.style.cursor = 'default'; if (yw_chat_window.style.right) { yw_chat_window.style.right = w_inner_w - parseInt(yw_chat_window.style.left) - yw_chat_window.offsetWidth + 'px'; yw_chat_window.style.left = 'inherit'; } }; window.addEventListener('mouseup', release);};switch (windowStyleConfigVO_type) { case 1: case 2: yw_link.href = chat_window_url; break; case 3: yw_link.addEventListener('click', function (e) { e.preventDefault(); createChatwindow3(400, 680); }); break; case 4: yw_link.addEventListener('click', function (e) { e.preventDefault(); createChatwindowCommon(850, 700); }); break; default: break;}window.closeYWChatWindow = function () { if (windowStyleConfigVO_type === 5) { yw_chat_window.style.right = '-400px'; setTimeout(function () { document.body.removeChild(document.getElementById('yw_chat_window')); }, 300); } else { document.body.removeChild(document.getElementById('yw_chat_window')); }}
var yWindowUrl = 'https://chatrobot.xoyo.com/webchatbot/chat.html?sysNum=1578898069071&sourceId=62145';
var yRejectUrl = 'https://chatrobot.xoyo.com/chatbot/automatic/reject/1578898069071?sourceId=62145';
var ykeepAliveUrl = 'https://chatrobot.xoyo.com/chatbot/automatic/keepAlive/1578898069071?sourceId=62145';
var yTemplateRefreshUrl = 'https://chatrobot.xoyo.com/chatbot/automatic/refresh/1578898069071?sourceId=62145';
var yAcceptUrl = 'https://chatrobot.xoyo.com/chatbot/automatic/accept/1578898069071?sourceId=62145';
var yCloseUrl = 'https://chatrobot.xoyo.com/chatbot/automatic/close/1578898069071?sourceId=62145';
var sessionConfig={
title:'null',
acceptedContent:'null',
acceptedFlag:null,
auTomaticSessionFlag:false,
automaticSessionTemplateBgImg:'null',
automaticSessionTemplateHeadImg:'null',
automaticSessionTemplateType:3,
automaticSessionType:1,
content:'剑网3重制版',
dayTimes:null,
intervalTime:null,
rejectContent:'null',
rejectFlag:null,
stayTime:null
};
var yIsConfigTemplate=null;//todo;
var yTimerId=null;
var yTemplateBtn1;
window.addEventListener("message",function(event){
if(event.data) {
if(event.data.hideMini) {
var iframeDom = document.getElementById("y-iframe-3")
if(iframeDom) {
try{
iframeDom.style.display = "none"
closeWindowClick()
} catch(err) {
consle.log(err.message)
}
}
}
}
})
function createEle (){
var ele =document.createElement("div");
var str = `
![]()
title
content
no
![]()
title
content
`;
ele.innerHTML=str;
return ele
}
// 生成样式节点
function createStyle(){
var style = document.createElement('style');
var str=`.y-iframe-3{
position: fixed;
right: 20px;
bottom: 10%;
height: 100%;
z-index: 1000;
max-height: 600px;
border-radius: 15px;
display: none;
transition: width 1s ease 0s;
box-shadow: rgb(170 170 170) 0 0 10px;
}
.y-display{
position: fixed;
right: 20px;
bottom: 10%;
line-height: 1.5;
}
.y-display *{
box-sizing: border-box;
}
.y-display .y-ask-close{
position: absolute;
right: -12px;
top: -12px;
cursor:pointer;
z-index:10;
}
.y-display .ellipsis {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.y-display .btn{
padding: 0 15px;
height: 30px;
border-radius: 6px;
outline: 0;
border: 0
}
.y-display .img1{
width: 66px;
height: 66px;
border-radius: 50%;
}
.y-display .y-link{
text-decoration: none;
color: #303d54;
}
.y-display-1{
border: 1px solid lightgrey;
width: 300px;
height: 200px;
background: #fff;
padding-bottom: 0;
border-radius: 8px;
text-align: center;
display: none;
}
.y-display-1 .bg{
background: rgba(19,32,44,0.7);
border-radius: 8px 8px 0 0;
padding: 23px 14px 27px;
background-size: cover;
}
.y-display-1 .title{
font-weight: bold;
font-size: 14px;
color: #fff;
margin-top: 4px;
}
.y-display-1 .middle{
color: #8d9fb3;
font-size: 12px;
}
.y-display-1 .bottom{
margin-top: 5px;
}
.y-display-1 .link{
margin-left: 20px;
color: #303d54;
font-size: 12px;
}
.y-display-1 .message{
width:20px;
vertical-align:-6px;
}
.y-display-1 .link-icon{
margin-right: 2px;
width: 16px;
height: 16px;
vertical-align: -3.5px;
}
.y-display-1 .reject{
cursor: pointer;
color: #8d9fb3;
font-size: 12px;
}
.y-display-2{
border: 1px solid lightgrey;
position: relative;
width: 300px;
height: 120px;
background: #fff;
padding-top: 23px;
padding-right: 16px;
border-radius: 8px;
display: none;
}
.y-display-2 .img1{
float: left;
/* width: 66px;
height: 66px; */
margin-left: 15px;
margin-right: 7px;
}
.y-display-2 .title{
font-weight: bold;
font-size: 14px;
color: #303d54;
}
.y-display-2 .middle{
color: #8d9fb3;
font-size: 12px;
max-width: 194px;
}
.y-display-2 .reject{
cursor: pointer;
color: #8d9fb3;
font-size: 12px;
}
.y-display-2 .bottom{
position: relative;
bottom: -20px;
}
.y-display-2 .btn{
cursor: pointer;
background: #e8ecf0;
margin-left: 21px;
font-size: 12px;
}
.y-display-3{
border: 1px solid lightgrey;
width: 180px;
height: 162px;
background: #fff;
padding: 23px 14px;
padding-bottom: 0;
border-radius: 8px;
text-align: center;
display: none;
}
.y-display-3 .img1{
width: 66px;
height: 66px;
}
.y-display-3.title{
font-weight: bold;
font-size: 14px;
color: #303d54;
}
.y-display-3 .reject{
color: #8d9fb3;
font-size: 12px;
}
.y-display-3 .middle{
color: #8d9fb3;
font-size: 12px;
}
.y-display-3 .bottom{
margin-top: 9px;
}
.y-display-3 .btn{
cursor: auto;
background: #e8ecf0;
color: #303d54;
font-size: 12px;
margin-left: 20px;
}`;
style.innerHTML=str;
return style
}
function ySelectEle(className){
if(className){
return document.querySelector(className)
}
return
}
function yHideNode(){
ySelectEle(`.y-display`).style.display="none";
if(sessionConfig.automaticSessionTemplateType===3){
ySelectEle(`.y-display-1`).style.display='none'
}else if(sessionConfig.automaticSessionTemplateType===1){
ySelectEle(`.y-display-2`).style.display='none'
}else if(sessionConfig.automaticSessionTemplateType===2){
ySelectEle(`.y-display-3`).style.display='none'
}
};
function ySwitchClose() {
}
function yShowNode(){
// yGetNode();
ySelectEle(`.y-display`).style.display="block";
if (entranceStyleConfigVO_type == 1) {
ySelectEle(`.y-display`).style.display
}
console.log('node',sessionConfig,sessionConfig.type,sessionConfig.automaticSessionType);
if(windowStyleConfigVO_type===3&&sessionConfig.automaticSessionType===2){
ySelectEle(`.y-iframe-3`).style.display="block";
ySelectEle(`.y-iframe-3`).style.width= '400px';
// iframe地址不存在时添加链接
if (!ySelectEle(`.y-iframe-3`).src) {
ySelectEle(`.y-iframe-3`).src=yWindowUrl; // todo;
}
ySelectEle(`.y-ask-close`).style.display = 'none'
}else{
console.log('entrancePositionArray',entrancePositionArray,entrancePositionArray[entrancePositionConfigVO_position]);
if (entranceStyleConfigVO_type == 1) {
console.log('entrancePositionArray-1',entrancePositionArray,entrancePositionArray[entrancePositionConfigVO_position]);
// yw_html = "
" + "
![]()
";
} else {
// yw_html = "
" + "
![]()
";
}
if(sessionConfig.automaticSessionTemplateType===3){
ySelectEle(`.y-display-1`).style.display='block'
ySelectEle(`.y-display .y-ask-close`).style.display='inline'
}else if(sessionConfig.automaticSessionTemplateType===1){
ySelectEle(`.y-display-2`).style.display='block'
}else if(sessionConfig.automaticSessionTemplateType===2){
ySelectEle(`.y-display-3`).style.display='block'
}
if(sessionConfig.acceptedFlag){
ySelectEle(`.y-display-1 .link`).style.display='inline'
ySelectEle(`.y-display-2 .btn`).style.display='inline'
ySelectEle(`.y-display-3 .btn`).style.display='inline'
}else {
ySelectEle(`.y-display-1 .link`).style.display='none'
ySelectEle(`.y-display-2 .btn`).style.display='none'
ySelectEle(`.y-display-3 .btn`).style.display='none'
}
if(sessionConfig.rejectFlag){
ySelectEle(`.y-display-1 .reject`).style.display='inline'
ySelectEle(`.y-display-2 .reject`).style.display='inline'
ySelectEle(`.y-display-3 .reject`).style.display='inline'
ySelectEle(`.y-display .y-ask-close`).style.display='none'
}else {
ySelectEle(`.y-display-1 .reject`).style.display='none'
ySelectEle(`.y-display-2 .reject`).style.display='none'
ySelectEle(`.y-display-3 .reject`).style.display='none'
ySelectEle(`.y-display .y-ask-close`).style.display='inline'
}
}
};
var yFlag=false;
yTimerId=setInterval(()=>{
ajax(ykeepAliveUrl).then((res)=>{
var flag=true;
console.log('ykeepAliveUrl',res);
if(res&&JSON.parse(res).success){
yIsConfigTemplate=true;
if(!yFlag){
yTemplateInit();
}
yFlag=true;
}else{
yFlag=false;
}
})
},3000);
function yGetNode(){
yIframe =ySelectEle('.y-iframe-3');
yAskClose =ySelectEle('.y-ask-close');
yTemplate1 =ySelectEle('.y-display-1');
yTemplateTitle1 =ySelectEle('.y-display-1 .title');
yTemplateContent1 =ySelectEle('.y-display-1 .middle');
yTemplateReject1 =ySelectEle('.y-display-1 .reject');
yTemplateBtn1 =ySelectEle('.y-display-1 .confirm .y-link');
yTemplateImg1 =ySelectEle('.y-display-1 .img1');
yTemplateBg1 =ySelectEle('.y-display-1 .bg');
yTemplateTitle2 =ySelectEle('.y-display-2 .title');
yTemplateContent2 =ySelectEle('.y-display-2 .middle');
yTemplateReject2 =ySelectEle('.y-display-2 .reject');
yTemplateBtn2 =ySelectEle('.y-display-2 .btn .y-link');
yTemplateImg2 =ySelectEle('.y-display-2 .img1');
yTemplateTitle3 =ySelectEle('.y-display-3 .title');
yTemplateContent3 =ySelectEle('.y-display-3 .middle');
yTemplateReject3 =ySelectEle('.y-display-3 .reject');
yTemplateBtn3 =ySelectEle('.y-display-3 .btn .y-link');
yTemplateImg3 =ySelectEle('.y-display-3 .img1');
};
function fillData(){
console.log('yTemplateTitle',yTemplateTitle1,yTemplateTitle2,yTemplateTitle3);
if(yTemplateTitle1){
yTemplateTitle1.innerHTML=sessionConfig.title;
yTemplateContent1.innerHTML=sessionConfig.content;
yTemplateReject1.innerHTML=sessionConfig.rejectContent;
yTemplateBtn1.innerHTML=sessionConfig.acceptedContent;
yTemplateImg1.src=sessionConfig.automaticSessionTemplateHeadImg;
yTemplateBg1.style.backgroundImage="url("+sessionConfig.automaticSessionTemplateBgImg+")";
};
if(yTemplateTitle2){
yTemplateTitle2.innerHTML=sessionConfig.title;
yTemplateContent2.innerHTML=sessionConfig.content;
yTemplateReject2.innerHTML=sessionConfig.rejectContent;
yTemplateImg2.src=sessionConfig.automaticSessionTemplateHeadImg;
yTemplateBtn2.innerHTML=sessionConfig.acceptedContent;
};
if(yTemplateTitle3){
yTemplateTitle3.innerHTML=sessionConfig.title;
yTemplateContent3.innerHTML=sessionConfig.content;
yTemplateReject3.innerHTML=sessionConfig.rejectContent;
yTemplateImg3.src=sessionConfig.automaticSessionTemplateHeadImg;
yTemplateBtn3.innerHTML=sessionConfig.acceptedContent;
};
};
function yBtnClick(type){
// yIframe.src='http://172.23.100.126:8080/chat_mini.html?sysNum=1646807097573&sourceId=1223&lang=zh_CN';
ajax(yAcceptUrl);
yHideNode();
if(windowStyleConfigVO_type===3&&sessionConfig.automaticSessionType===1){
yIframe.style.display="block";
yIframe.style.width= '400px';
yIframe.src=yWindowUrl; // todo;
}
};
function yRejectClick(type){
yIframe.src=null;
yIframe.style.display="none";
yHideNode();
ajax(yRejectUrl);
};
function closeWindowClick(){
ajax(yCloseUrl);
}
function yTemplateInit(){
ajax(yTemplateRefreshUrl) //todo;
if(yIsConfigTemplate){
if(!ySelectEle(`.y-display`)){
document.getElementsByTagName('head')[0].appendChild(createStyle());
document.body.append(createEle());
}
yShowNode();
yGetNode();
if(windowStyleConfigVO_type===3&&sessionConfig.automaticSessionType===2){
}else if(windowStyleConfigVO_type===3&&sessionConfig.automaticSessionType===1){
yTemplateBtn1.herf='javascript:;';
yTemplateBtn2.herf='javascript:;';
yTemplateBtn3.herf='javascript:;';
fillData();
}else{
yTemplateBtn1.target="_blank";
yTemplateBtn2.target="_blank";
yTemplateBtn3.target="_blank";
yTemplateBtn1.href=yWindowUrl;
yTemplateBtn2.href=yWindowUrl;
yTemplateBtn3.href=yWindowUrl;
fillData();
}
}
};
function ajax(url){
var promise=new Promise((resolve,reject)=>{
var xhr=new XMLHttpRequest();
console.log('xhr',xhr);
xhr.onreadystatechange=()=>{
if(xhr.readyState===4 ){
if(xhr.status>=200 && (xhr.status<300||xhr.status==304)){
resolve(xhr.response);
}
}
}
xhr.withCredentials=true;
xhr.open('get',url,true);
xhr.send(null)
})
return promise
};
yTemplateInit();