mirror of
https://gitee.com/ulthon/ulthon_information.git
synced 2026-07-01 18:22:49 +08:00
fix(phone-image): 移除不存在的layui dropdown依赖,改用纯JS下拉菜单
layui 2.x没有内置dropdown模块,导致整个页面JS回调不执行。 - layui.use依赖从['form','layer','dropdown']改为['form','layer'] - 用纯jQuery实现toggle下拉菜单替代dropdown.render() - 添加more-dropdown-menu CSS hover样式
This commit is contained in:
@@ -713,6 +713,11 @@ body > .page-header-right .layui-btn:not(.layui-btn-primary):not(.layui-btn-norm
|
|||||||
color: var(--pi-color-accent);
|
color: var(--pi-color-accent);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.more-dropdown-menu li:hover {
|
||||||
|
background: rgba(24, 144, 255, 0.06);
|
||||||
|
color: var(--pi-color-accent);
|
||||||
|
}
|
||||||
|
|
||||||
/* --- 主布局两栏 --- */
|
/* --- 主布局两栏 --- */
|
||||||
.main-layout {
|
.main-layout {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|||||||
@@ -117,9 +117,15 @@
|
|||||||
class="layui-icon layui-icon-ok"></i> 保存</button>
|
class="layui-icon layui-icon-ok"></i> 保存</button>
|
||||||
<button type="button" class="layui-btn layui-btn-sm" id="btn-generate"><i
|
<button type="button" class="layui-btn layui-btn-sm" id="btn-generate"><i
|
||||||
class="layui-icon layui-icon-picture"></i> 生成并保存</button>
|
class="layui-icon layui-icon-picture"></i> 生成并保存</button>
|
||||||
<div class="layui-btn-group" style="margin:0;">
|
<div class="more-dropdown-wrapper" style="position:relative;display:inline-block;">
|
||||||
<button type="button" class="layui-btn layui-btn-sm layui-btn-primary" id="btn-more"><i
|
<button type="button" class="layui-btn layui-btn-sm layui-btn-primary" id="btn-more"><i
|
||||||
class="layui-icon layui-icon-more"></i></button>
|
class="layui-icon layui-icon-more"></i></button>
|
||||||
|
<ul class="more-dropdown-menu" id="more-dropdown-menu" style="display:none;position:absolute;right:0;top:100%;margin-top:4px;background:#fff;border:1px solid #e8e8e8;border-radius:4px;box-shadow:0 2px 8px rgba(0,0,0,0.12);z-index:9999;min-width:130px;padding:4px 0;list-style:none;">
|
||||||
|
<li data-action="history" style="padding:8px 16px;cursor:pointer;font-size:13px;white-space:nowrap;">历史记录</li>
|
||||||
|
<li data-action="rerender" style="padding:8px 16px;cursor:pointer;font-size:13px;white-space:nowrap;">重新生成</li>
|
||||||
|
<li data-action="download" style="padding:8px 16px;cursor:pointer;font-size:13px;white-space:nowrap;">打包下载</li>
|
||||||
|
<li data-action="exportLong" style="padding:8px 16px;cursor:pointer;font-size:13px;white-space:nowrap;">导出长图</li>
|
||||||
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -143,10 +149,9 @@
|
|||||||
<script src="/static/lib/html2canvas/html2canvas.js"></script>
|
<script src="/static/lib/html2canvas/html2canvas.js"></script>
|
||||||
<script src="/static/js/phone-image.js"></script>
|
<script src="/static/js/phone-image.js"></script>
|
||||||
<script>
|
<script>
|
||||||
layui.use(['form', 'layer', 'dropdown'], function () {
|
layui.use(['form', 'layer'], function () {
|
||||||
var form = layui.form;
|
var form = layui.form;
|
||||||
var layer = layui.layer;
|
var layer = layui.layer;
|
||||||
var dropdown = layui.dropdown;
|
|
||||||
|
|
||||||
var lastOutputId = null;
|
var lastOutputId = null;
|
||||||
var downloadBaseUrl = '{:url("post/downloadPostOutputZip", ["id" => 0])}';
|
var downloadBaseUrl = '{:url("post/downloadPostOutputZip", ["id" => 0])}';
|
||||||
@@ -350,17 +355,16 @@
|
|||||||
}, 300);
|
}, 300);
|
||||||
}
|
}
|
||||||
|
|
||||||
// ========== 更多下拉菜单 ==========
|
// ========== 更多下拉菜单(纯JS实现) ==========
|
||||||
dropdown.render({
|
var $menu = $('#more-dropdown-menu');
|
||||||
elem: '#btn-more',
|
$('#btn-more').on('click', function(e) {
|
||||||
data: [
|
e.stopPropagation();
|
||||||
{ title: '历史记录', id: 'history' },
|
$menu.toggle();
|
||||||
{ title: '重新生成', id: 'rerender' },
|
});
|
||||||
{ title: '打包下载', id: 'download' },
|
$menu.on('click', 'li', function() {
|
||||||
{ title: '导出长图', id: 'exportLong' }
|
var action = $(this).data('action');
|
||||||
],
|
$menu.hide();
|
||||||
click: function (data) {
|
switch (action) {
|
||||||
switch (data.id) {
|
|
||||||
case 'history':
|
case 'history':
|
||||||
$('#btn-history').trigger('click');
|
$('#btn-history').trigger('click');
|
||||||
break;
|
break;
|
||||||
@@ -374,8 +378,10 @@
|
|||||||
$('#btn-export-long-hidden').trigger('click');
|
$('#btn-export-long-hidden').trigger('click');
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
},
|
});
|
||||||
align: 'right'
|
// 点击外部关闭
|
||||||
|
$(document).on('click', function() {
|
||||||
|
$menu.hide();
|
||||||
});
|
});
|
||||||
|
|
||||||
// ========== 自动保存相关函数 ==========
|
// ========== 自动保存相关函数 ==========
|
||||||
|
|||||||
Reference in New Issue
Block a user