feat: 右侧浮窗组件重写 — 4 种模块 + JS 动态渲染
All checks were successful
continuous-integration/drone/push Build is passing
All checks were successful
continuous-integration/drone/push Build is passing
新增文件: - css/float-widget.css: 浮窗按钮/弹出面板/QQ列表/二维码样式 - js/float-widget.js: 4 种模块渲染 + 回到顶部 + 后台数据接口 修改文件: - header.html: 引入新 CSS/JS - public/header.html: 替换旧 aside-tools 为 float-widget 容器 模块类型: 1. QQ客服: hover 弹出 QQ 号列表+在线时间 2. 在线客服: 点击新标签页跳转 3. 群聊: hover 弹出二维码 4. 公众号: hover 弹出二维码 数据来源: window.__FLOAT_WIDGET_DATA__ (后台注入) 或 JS 内 demo 数据
This commit is contained in:
@@ -219,85 +219,10 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 侧边 -->
|
||||
<!-- 回到顶部按钮 - 独立在侧边工具栏上方 -->
|
||||
<div class="back-top-wrapper" id="backTop">
|
||||
<img src="/web/BlackFruit-web/assets/img/header/up.png" alt="回到顶部">
|
||||
</div>
|
||||
|
||||
<div class="aside-tools">
|
||||
<div class="tools-list">
|
||||
{if ( isset($data.side_floating_window) ) }
|
||||
{foreach $data.side_floating_window as $key=>$value}
|
||||
<div class="tools-item">
|
||||
<img src="{$value.icon}" alt="">
|
||||
<div class="tools-box">
|
||||
<div class="tools-box-s">
|
||||
<h5>{$value.name}</h5>
|
||||
{$value.content|raw}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/foreach}
|
||||
{else /}
|
||||
<div class="tools-item">
|
||||
<img src="/web/BlackFruit-web/assets/img/index/phone.png" alt="">
|
||||
<div class="tools-box">
|
||||
<div class="tools-box-s">
|
||||
<h5>电话咨询</h5>
|
||||
<p>7*24h不间断服务</p>
|
||||
<p class="com-contact-tel">{$data.enterprise_telephone|default=''}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tools-item">
|
||||
<img src="/web/BlackFruit-web/assets/img/index/listen.png" alt="">
|
||||
<div class="tools-box">
|
||||
<div class="tools-box-s">
|
||||
<h5>在线客服</h5>
|
||||
<p>工作日 09:00-18:00</p>
|
||||
<a href="{$data.online_customer_service_link|default='javascript:;'}" class="line-server-btn" target="_blank">
|
||||
<div class="button">立即查询</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tools-item">
|
||||
<img src="/web/BlackFruit-web/assets/img/index/worl-order.png" alt="">
|
||||
<div class="tools-box">
|
||||
<div class="tools-box-s">
|
||||
<h5>提交工单</h5>
|
||||
<p>专业工程师快速响应</p>
|
||||
<a href="/plugin/27/ticket.htm">
|
||||
<div class="button">立即提交</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tools-item">
|
||||
<img src="/web/BlackFruit-web/assets/img/index/message.png" alt="">
|
||||
<div class="tools-box">
|
||||
<div class="tools-box-s">
|
||||
<h5>意见反馈</h5>
|
||||
<p>您的意见是我们不断前进的动力</p>
|
||||
<a href="/feedback.html">
|
||||
<div class="button">立即反馈</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tools-item">
|
||||
<img src="/web/BlackFruit-web/assets/img/index/cart.png" alt="">
|
||||
<div class="tools-box">
|
||||
<div class="tools-box-s">
|
||||
<h5>购物车</h5>
|
||||
<p>从这里开始,打造云端专属空间</p>
|
||||
<a href="/cart/shoppingCar.htm">
|
||||
<div class="button">前往购物车</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
<!-- 右侧浮窗 — 由 float-widget.js 动态渲染 -->
|
||||
{if ( isset($data.side_floating_window) && !empty($data.side_floating_window) ) }
|
||||
<script>
|
||||
window.__FLOAT_WIDGET_DATA__ = {:json_encode($data['side_floating_window'])};
|
||||
</script>
|
||||
{/if}
|
||||
<div class="float-widget"></div>
|
||||
Reference in New Issue
Block a user