在线客服

{macro file(x)}
{var expired = !!(new Date().getTime() > x.content.expire)}
<div class="arrow"></div>
<div class="file-wrap {if !!expired}z-expired{/if}">
<div class="file-bd">
<div class="file-left">
<i class="u-icon-${x.content.name|spliceSuffix}"></i>
</div>
<div class="file-right">
<div class="hd">
<p class="name">${x.content.name}</p>
</div>
<div class="bd">
{if !isLeft}
{if x.state == 1}
<span class="progress-size size">${x|fileProgressFormat}</span>
<div class="progress-bar">
{var width = x.progressObj ? x.progressObj.percentage / 100 * 78 : 0}
<div class="inner" style="width: ${width + "px"}"></div>
</div>
{if x.uploadObj}
<i class="abort" data-action="abortFileTrans" data-id="${x.id}"></i>
{/if}
{else}
<span class="size">${x.content.size|fileSizeFormat}</span>
{if !!expired}
<span class="info">已失效</span>
{/if}
{/if}
{else}
<span class="size">${x.content.size|fileSizeFormat}</span>
{if !expired}
<a class="download" data-action="download" data-url="${x.content.url|formatDownloadUrl}" data-name="${x.content.name}">下载</a>
{else}
<span class="info">已失效</span>
{/if}
{/if}
</div>
</div>
</div>
<div class="file-ft">
{if x.state == -1}
<span class="error">网络连接失败</span>
<a class="resend" data-action="resend" data-id="${x.id}">重试</a>
{/if}
</div>
</div>
{/macro}
{macro thirdOrderList(x)}
{var tpl = x.content.template}
<div class="${tpl.id}">
{if tpl.id == "order_list"}
<div class="crm-thirdorder-bd">
<div class="tlt">${tpl.label|default:""|escape|filterHref}</div>
<ul class="list">
{list tpl.list as item}
<li class="item">
<div class="shop">
<i class="icon u-icon-shop"></i>
<span class="name" title="${item.s_name}">${item.s_name}</span>
<span class="status" title="${item.s_status}">${item.s_status}</span>
</div>
<ul class="inner-list">
{list item.goods as good}
<li class="good-item inner-item" data-action="thirdorderList" data-params="${good.params}" data-id="${x.id}" data-target="${good.target}" data-orderindex="${item_index}" data-goodindex="${good_index}" data-status="${good.p_status}" data-img="${good.p_img}" data-name="${good.p_name}" data-stock="${good.p_stock}" data-price="${good.p_price}" data-count="${good.p_count}">
<div class="bd">
<div class="left">
<img class="img" src="${good.p_img}">
</div>
<div class="mid">
<p class="name" title="${good.p_name}">${good.p_name}</p>
<p class="stock">${good.p_stock}</p>
</div>
<div class="right">
<p class="money">${good.p_price}</p>
<p class="count">${good.p_count}</p>
<p class="status">${good.p_status}</p>
</div>
</div>
</li>
{/list}
</ul>
</li>
{/list}
</ul>
{if tpl.action}
<div class="ft" data-action="moreOrder" data-id="${x.id}">
<a>${tpl.action.label}</a>
</div>
{/if}
</div>
{elseif tpl.id == "qiyu_template_goods"}
<div class="crm-thirdorder-bd">
<div class="good-item">
<div class="bd">
<div class="left">
<img class="img" src="${tpl.p_img}">
</div>
<div class="mid">
<p class="name" title="${tpl.p_name}">${tpl.p_name}</p>
<p class="stock">${tpl.p_stock}</p>
</div>
<div class="right">
<p class="money">${tpl.p_price}</p>
<p class="count">${tpl.p_count}</p>
<p class="status">${tpl.p_status}</p>
</div>
</div>
</div>
</div>
{elseif tpl.id == "order_detail"}
<div class="crm-thirdorder-bd">
<div class="tlt">${tpl.label|default:""|escape|filterHref}</div>
<ul class="list">
<li class="item">
<div class="item-tlt">
<i class="icon u-icon-status"></i>
<span>${tpl.status}</span>
</div>
</li>
<li class="item">
<div class="item-tlt">
<i class="icon u-icon-address"></i>
<span>${tpl.user_name}</span>
</div>
<ul class="inner-list">
<li class="inner-item">
<span>${tpl.address}</span>
</li>
</ul>
</li>
<li class="item">
<div class="item-tlt">
<i class="icon u-icon-date"></i>
<span>${tpl.orderNo}</span>
</div>
<ul class="inner-list">
{list tpl.date as dateItem}
<li class="inner-item">
<span>${dateItem}</span>
</li>
{/list}
</ul>
</li>
</ul>
</div>
{elseif tpl.id == "order_logistic"}
<div class="crm-thirdorder-bd">
<div class="tlt">${tpl.label|default:""|escape|filterHref}</div>
<div class="info">${tpl.title.label}</div>
<ul class="list">
{list tpl.list as item}
<li>
<div class="left">
<span class="dot"></span>
</div>
<div class="right">
<p class="content">${item.logistic}</p>
<p class="time">${item.timestamp}</p>
</div>
</li>
{/list}
</ul>
{if tpl.action}
<div class="ft">
<a href="${tpl.action.target}" target="_blank">${tpl.action.p_name}</a>
</div>
{/if}
</div>
{elseif tpl.id == "order_status"}
<div class="crm-thirdorder-bd">
<div class="tlt">${tpl.label|default:""|escape|filterHref}</div>
<div class="info">${tpl.title}</div>
<ul class="list">
{list tpl.list as item}
<li class="item">
<button type="button" class="service-action" data-action="thirdorderStatus" data-target="${item.target}" data-params="${item.params}" data-label="${item.valid_operation}">${item.valid_operation}</button>
</li>
{/list}
</ul>
</div>
{elseif tpl.id == "refund_detail"}
<div class="crm-thirdorder-bd">
<div class="tlt">${tpl.label|default:""|escape|filterHref}</div>
<div class="bd">
<div class="state state-${tpl.state.type}">
<i class="icon u-icon-${tpl.state.type}"></i>
<span>${tpl.state.name}</span>
</div>
<ul class="list">
{list tpl.list as item}
<li class="item">
<p>${item}</p>
</li>
{/list}
</ul>
</div>
</div>
{elseif tpl.id == "action_list"}
<div class="crm-thirdorder-bd">
<div class="tlt">${tpl.label|default:""|escape|filterHref}</div>
<ul class="list">
{list tpl.list as item}
<li class="item">
{if item.type == "url"}
<a class="service-action" href="${item.target}" target="_blank">${item.p_name}</a>
{else}
<button type="button" class="service-action" data-action="thirdorderService" data-target="${item.target}" data-params="${item.params}" data-label="${item.p_name}">${item.p_name}</button>
{/if}
</li>
{/list}
</ul>
</div>
{elseif tpl.id == "active_page"}
<div class="crm-thirdorder-bd">
<img src="${tpl.img}" alt="">
<p class="content">${tpl.content}</p>
{if tpl.action}
<div class="active-action">
<a href="${tpl.action.url}" target="_blank">${tpl.action.label}</a>
</div>
{/if}
</div>
{elseif tpl.id == "error_msg"}
<div class="crm-thirdorder-bd">
<p data-action="richContentDelegate">
${tpl.label}
</p>
</div>
{elseif tpl.id == "bot_form"}
<div class="crm-thirdorder-bd">
<p data-action="richContentDelegate">
${tpl.label}
</p>
</div>
{if !tpl.submitted}
<div class="crm-thirdorder-ft">
<div class="bot-form-action" data-action="showBotForm" data-id="${x.id}" data-sid="${x.sessionId || x.sid}">
<span>填写表单</span>
</div>
</div>
{/if}
{elseif tpl.id == "qiyu_template_botForm"}
<div class="crm-thirdorder-bd">
<ul class="list">
{list tpl.forms as item}
<li class="item">
<label>${item.label}</label>
{if item.value}
{if item.type == "image"}
<div class="preview" data-action="pictureHref" data-href=${item.value.url}>
<div class="left">
<i class="cover"></i>
</div>
<div class="right">
<div title="${item.value.name}" class="name">${item.value.name}</div>
<div class="size">${item.value.size|fileSizeFormat}</div>
</div>
</div>
{else}
<p>${item.value}</p>
{/if}
{/if}
</li>
{/list}
</ul>
</div>
{elseif tpl.id == "static_union"}
<div class="crm-thirdorder-bd">
<ul class="list">
{list tpl.unions as item}
<li class="item item_${item.type}">
{var detail = item.detail}
{if item.type == "image"}
<img data-action="pictureHref" data-href="${detail.url}" src="${detail.url}" alt="">
{elseif item.type == "text"}
<p class="content">${detail.label|escape}</p>
{elseif item.type == "link"}
<div class="link">
{if detail.type == "block"}
<button type="button" data-action="thirdorderService" data-target="${detail.target}" data-params="${detail.params}" data-label="${detail.label}">${detail.label}</button>
{elseif detail.type == "url"}
<a href="${detail.target}" target="_blank">${detail.label}</a>
{/if}
</div>
{elseif item.type == "richText"}
<div class="bot-rich" data-action="richContentDelegate">${detail.label|default:""|text2portrait}</div>
{/if}
</li>
{/list}
</ul>
</div>
{elseif tpl.id == "card_layout"}
<div class="crm-thirdorder-bd">
<div class="tlt">${tpl.label|default:""|escape}</div>
<div class="bd m-card-layout">
<ul class="group-list">
{list tpl.list as group}
{if group.action.type == "block"}
<li class="group-item" data-action="selectBotCard" data-target="${group.action.target}" data-params="${group.action.params}" data-label="${group.action.label}" data-type="block">
{elseif group.action.type == "popup"}
<li class="group-item" data-action="selectBotCard" data-target="${group.action.target}" data-params="${group.action.params}" data-label="${group.action.label}" data-type="popup">
{elseif group.action.type == "url"}
<li class="group-item" data-action="openlink" href="${group.action.target}">
{else}
<li class="group-item">
{/if}
<ul class="tr-list">
{list group.list as tr}
<li class="tr-item">
<ul class="td-list">
{list tr as td}
<li class="td-item" style="${td.style}">
<div class="inner" style="${td.innerStyle}">
{if td.type == "text"}
<span>${td.value}</span>
{elseif td.type == "image"}
<img src="${td.value}" alt="">
{else}
<span>[暂不支持的消息类型]</span>
{/if}
</div>
</li>
{/list}
</ul>
</li>
{/list}
</ul>
</li>
{/list}
</ul>
</div>
{if tpl.action}
<div class="ft">
{if tpl.action.type == "block"}
<a data-action="thirdorderService" data-target="${tpl.action.target}" data-params="${tpl.action.params}" data-label="${tpl.action.label}">${tpl.action.label}</button>
{elseif tpl.action.type == "url"}
<a href="${tpl.action.target}" target="_blank">${tpl.action.label}</a>
{elseif tpl.action.type == "float"}
<a data-action="moreBotCard" data-id="${x.id}">${tpl.action.label}</a>
{/if}
</div>
{/if}
</div>
{elseif tpl.id == "detail_view"}
<div class="crm-thirdorder-bd">
<div class="bd m-card-layout">
<ul class="group-list">
<li class="group-item">
<ul class="tr-list">
{list tpl.thumbnail.list as tr}
<li class="tr-item">
<ul class="td-list">
{list tr as td}
<li class="td-item" style="${td.style}">
<div class="inner" style="${td.innerStyle}">
{if td.type == "text"}
<span>${td.value}</span>
{elseif td.type == "image"}
<img src="${td.value}" alt="">
{else}
<span>[暂不支持的消息类型]</span>
{/if}
</div>
</li>
{/list}
</ul>
</li>
{/list}
</ul>
</li>
</ul>
</div>
{if tpl.thumbnail.action}
<div class="ft">
{if tpl.thumbnail.action.type == "block"}
<a data-action="thirdorderService" data-target="${tpl.thumbnail.action.target}" data-params="${tpl.thumbnail.action.params}" data-label="${tpl.thumbnail.action.label}">${tpl.thumbnail.action.label}</button>
{elseif tpl.thumbnail.action.type == "url"}
<a href="${tpl.thumbnail.action.target}" target="_blank">${tpl.thumbnail.action.label}</a>
{else if tpl.thumbnail.action.type == "float"}
<a data-action="botCardDetail" data-id="${x.id}">${tpl.thumbnail.action.label}</a>
{/if}
</div>
{/if}
</div>
{else}
<div class="crm-thirdorder-bd">
<p class="default-content">${tpl.label|default:"未知消息类型"}</p>
</div>
{/if}
</div>
<div class="arrow"></div>
{/macro}
{list beg..end as y}
{var x=xlist[y]}
{if x.type == "custom"}
{elseif x.type=="eval-show"}
<div id="${x.id|seed}" class="m-comment m-comment-evaTip">
<div class="comment_box">
{if x.isval}
<div class="comment_cnt">${x.messageThanks|default:"你对我们的服务评价为："}: <span class="bolder">${x.content}</span>。非常感谢！</div>
{else}
<div class="comment_tlt">${x.messageInvite|default:"感谢您的咨询，请对我们的服务做出评价"}</div>
<a class="u-btn comment_btn j-flagcomment" data-action="comment" data-sid="${x.sid}" data-mid="${x.id}" data-type="${x.category}">评价</a>
{/if}
</div>
</div>
{elseif x.type == "shunt"}
<div class="msg msg_left f-cb j-sel-shunt">
<i class="u-icon-avater">{if x.from.portrait}<img src="${x.from.portrait|imgclip}" />{else}<img src="${"res/default/portrait@2x.png"|imgfilter}"/>{/if}</i>
<div class="qa-list msg_wrapper {if x.disabled}disabled{/if}">
<div class="arrow"></div>
<div class="p">
<div class="qa_label">${x.label|default:""|escape|filterHref}</div>
<ul class="list">
{list x.list as y}
<li>
<span class="dot"></span>
<a class="shunt_child" href="#" data-id="${y.id}" data-action="selShunt" data-type="${y.type}" data-entryid="${y.entryid}">${y.label}</a>
</li>
{/list}
</ul>
</div>
</div>
</div>
{elseif x.type == "cnotify"}
<div class="u-msg u-msg-2 u-msg-4">
<h3>${x.content}</h3>
</div>
{elseif x.type == "sys"}
<div class="info">
<h2>${x.content}</h2>
</div>
{elseif x.type == "tip"}
<div class="info">
<h2>${x.content}</h2>
</div>
{elseif x.type == "productinfo" && x.show != 1 && x.showCustomMsg != 1}
{elseif x.type == "push-msg"}
<div class="msg msg_left f-cb j-sel-shunt">
<i class="u-icon-avater">{if x.from.portrait}<img src="${x.from.portrait|imgclip}" />{else}<img src="${"res/default/portrait@2x.png"|imgfilter}"/>{/if}</i>
<div class="text">
<div class="arrow"></div>
<p>${x.content}</p>
</div>
</div>
{elseif x.type == "messageSplit"}
<div class="msg-split info">
<span>${x.content}</span>
</div>
{elseif x.type == "historySplit"}
<div class="history-split j-history-split"></div>
{else}
{var isLeft = !x.fromUser}
<div id="${x.id|seed}" class="msg {if isLeft}msg_left{else}msg_right{/if} f-cb">
{if xlist[y-1]}
{if (y==0 || (x.time - xlist[y-1].time) >= (5*60*1000)) && !x.state}
<div class="date">
<span>${x.time|timeformat:(y==0?y:xlist[y-1].time)}</span>
<div class = "line"></div>
</div>
{/if}
{/if}
<div class="msg_main {if x.ext.auditResult}z-trashed{/if}">
{if !isLeft}
<i class="u-icon-avater visitor"><img src="${config.path.sdk}res/skin/default/ico-kefu@2x.png"/></i>
{elseif x.from.portrait}
<i class="u-icon-avater"><img src="${x.from.portrait|imgfilter}" /></i>
{elseif ext.isRobot}
<i class="u-icon-avater"><img src="${"res/default/robot_portrait@2x.png"|imgfilter}"/></i>
{else}
<i class="u-icon-avater"><img src="${"res/default/portrait@2x.png"|imgfilter}"/></i>
{/if}
<div class="${x.type} msg_wrapper">
{if x.type=="image"}
<img data-group="ysf" data-action="pictureHref" data-href="${x.content.url}" src="${x.content.url}" {if x.content.thumb}data-thumb="${x.content.thumb}"{/if} />
<div class="arrow"></div>
{elseif x.type=="audio"}
<div class="audio-wrap" data-action="audio" data-id="${x.id}" style="width:${x.content.dur|d2w}px;">
<div class="arrow"></div>
<i class="icon"></i>
<div class="length"><span>${x.content.dur|duration}</span></div>
</div>
{elseif x.type == "file"}
${file(x)}
{elseif x.type=="qa-list" || x.type=="qa"}
<div class="p">
{if x.type=="qa-list"}
<div class="qa_label" data-action="richContentDelegate">${x.label|default:""|text2portrait}</div>
<ul class="list">
{list x.list as qa}
<li>
<span class="dot"></span>
<a class="robot_child" href="#" data-id="${qa.id}" data-action="selRobot">${qa.question}</a>
</li>
{/list}
</ul>
{else}
<div class="qa_label" data-action="richContentDelegate">${x.content|default:""|text2portrait}</div>
{/if}
{if KNOWLEDGE_STATISTICS}
{if x.evaluation}
<div class="qa_eval_wrapper">
<div class="qa_eval">
<div class="eval-up eval-robot-answer {if x.evaluation==2}z-sel{/if}" data-action="evalRobotAnswer" data-id="${x.id}" data-sid="${x.sessionId || x.sid}" data-idclient="${x.msgIdClient}" data-evaluation="2">
<i class="icon-eval-up"></i>
<span>有用</span>
</div>
<div class="eval-down eval-robot-answer {if x.evaluation==3}z-sel{/if}" data-action="evalRobotAnswer" data-id="${x.id}" data-sid="${x.sessionId || x.sid}" data-idclient="${x.msgIdClient}" data-evaluation="3">
<i class="icon-eval-down"></i>
<span>没用</span>
</div>
</div>
{if x.evaluation_reason && x.evaluation==3}
<div class="qa_eval_box">
<div class="qa_eval_content {if !x.evalcontent}f-dn{/if} {if x.ishistory}history{/if}" data-action="changeEvalContent" data-id="${x.id}" data-sid="${x.sessionId || x.sid}" data-idclient="${x.msgIdClient}" data-evalcontent="${encodeURIComponent(x.evalcontent)}" data-evalguide="${encodeURIComponent(x.evaluation_guide)}">${x.evalcontent|escapeWithoutSpace|trim|text2portrait}</div>
<div data-id="${x.id}" data-sid="${x.sessionId || x.sid}" data-idclient="${x.msgIdClient}" class="qa_eval_guide {if (x.ishistory || x.evalcontent)}f-dn{/if}" data-evalguide="${encodeURIComponent(x.evaluation_guide)}" data-action="changeEvalContent">
${x.evaluation_guide}
</div>
</div>
{/if}
</div>
{/if}
{/if}
</div>
<div class="arrow"></div>
{elseif x.type == "crm-thirdorder"}
${thirdOrderList(x)}
{elseif x.type == "productinfo" && (x.show == 1 || x.showCustomMsg == 1)}
<div class="product-wrap">
{if x.url}<a class="pdLink" data-action="productHref" data-href="${x.url|urlFormat}">{/if}
<div class="product_right">
<img src="${x.picture|urlFormat}" height="100" width="100" alt="商品图片">
</div>
{if x.showCustomMsg}
<div class="product_left {if x.orderId}product_left_hasmark{/if}">
<h2 class="tlt" title="${x.title|escape}">${x.title|escape}</h2>
<div class="desc" title="${x.desc|escape}">${x.desc|escape}</div>
<div class="note-custom-msg" title="${x.price|escape}">{if x.orderId}<span class="tlt-sku">${x.orderSku}</span><span class="tlt-statu">${x.orderStatus}</span>{else}<span>${x.price|escape}</span>{/if}</div>
</div>
{if x.orderId}
<div class="product_mark">
{if x.payMoney}<h2 class="tlt-money">${x.payMoney}</h2>{/if}
{if x.orderCount}<h2 class="tlt-count">${x.orderCount}</h2>{/if}
</div>
{/if}
{else}
<div class="product_left">
<h2 class="tlt" title="${x.title|default:""}">${x.title|default:""}</h2>
<p class="desc" title="${x.desc|default:""}">${x.desc|default:""}</p>
<p class="note" title="${x.note|default:""}">${x.note|default:""}</p>
</div>
{/if}
{if x.url}</a>{/if}
{if x.orderId}
<div class="orderInfo">
<span class="tlt-id">订单编号：${x.orderId}</span>
{if x.orderTime}<span class="tlt-time">下单时间：${x.orderTime}</span>{/if}
</div>
{/if}
{if x.activity}
<div class="activity">
<a href="${x.activityHref}" class="activity_link" target="_blank">${x.activity}</a>
</div>
{/if}
{if x.showCustomMsg}
{if x.product && x.product.tags && x.product.tags.length}
<div class="product-tags">
{list x.product.tags as it}
<a href="${it.url}" target="_blank" class="tags-link">${it.label}</a>
{/list}
</div>
{/if}
{/if}
<div class="arrow"></div>
</div>
{elseif x.type=="rich"}
<div class="p" data-action="richContentDelegate">${x.content|default:""|text2portrait}</div>
<div class="arrow"></div>
{else}
<p>${x.richContent|default:x.content|filterTagA|escapeWithoutSpace|complete|text2portrait}</p>
<div class="arrow"></div>
{/if}
{if x.state === -1}
<i data-id="${x.id}" data-action="resend" class= "j-resend u-icon u-icon-failure"></i>
{elseif x.state === 1}
<i data-id="${x.id}" class= "j-resend u-icon u-icon-loading"></i>
{/if}
</div>
</div>
{if x.ext && x.ext.auditResult && !isLeft}
<div class="trash-word">${x.ext|formatTrashWords}</div>
{/if}
</div>
{/if}
{/list}

<div class="m-leavemessage {if qiyuInfoSwitch}hasLogo{/if}">
<form class="m-form" id="leaveForm" onsubmit="return false;">
<p class="message">${leaveInfo|default:"当前客服不在线，如需帮助请留言"}</p>
<div class="formcnt">
{if leaveType == 0 || leaveType == 1 || leaveType == 2}
<div class="formitm">
<label for="lab" class="lab">手机<span class="u-required">  *</span></label>
<div class="ipts">
<input class="u-ipt" type="text" name="mobile" maxlength="11" />
<div class="z-error j-errmsg"></div>
</div>
</div>
{/if}
{if leaveType == 0 || leaveType == 1 || leaveType == 3}
<div class="formitm">
<label for="lab" class="lab">邮箱<span class="u-required">  *</span></label>
<div class="ipts">
<input class="u-ipt" type="text" name="email" maxlength="61" />
<div class="z-error j-errmsg"></div>
</div>
</div>
{/if}
<div class="formitm lastItem">
<label for="lab" class="lab">留言<span class="u-required">  *</span></label>
<div class="ipts">
<textarea class="u-textarea" name="content" maxlength="4000"></textarea>
</div>
</div>
<div class="btns">
<button class="u-btn" type="button" data-action="leaveMsg" name="leaveBtn">发送</button>
</div>
</div>
</form>
{if qiyuInfoSwitch }
<div class="g-td bottom" data-action="toqiyu" data-log="fk-lt" >
<img class="taillogo" src="https://qiyukf.nosdn.127.net/sdk/res/img/tailLogo@2x_51a85b19099da606135ca68d814c5d6e.png" alt="网易七鱼提供服务支持">
</div>
{/if}
</div>