From 9400b0f01c5722042cc3f3b32548142f729f0162 Mon Sep 17 00:00:00 2001 From: java110 <928255095@qq.com> Date: Mon, 11 Jan 2021 08:51:57 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E4=BB=A3=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/admin.html | 6 +- .../bootstrap-submenu/bootstrap-submenu.css | 29 +++ public/js/bootstrap/bootstrap-submenu.js | 234 +++++++++--------- public/print.html | 5 +- 4 files changed, 152 insertions(+), 122 deletions(-) create mode 100644 public/css/plugins/bootstrap-submenu/bootstrap-submenu.css diff --git a/public/admin.html b/public/admin.html index c4b4550f4..c512491ad 100644 --- a/public/admin.html +++ b/public/admin.html @@ -18,7 +18,7 @@ - + @@ -27,8 +27,8 @@ - - + + diff --git a/public/css/plugins/bootstrap-submenu/bootstrap-submenu.css b/public/css/plugins/bootstrap-submenu/bootstrap-submenu.css new file mode 100644 index 000000000..7c6fce124 --- /dev/null +++ b/public/css/plugins/bootstrap-submenu/bootstrap-submenu.css @@ -0,0 +1,29 @@ +.dropdown-submenu.dropright .dropdown-menu { + margin-left: 1px; + } + + .dropdown-submenu.dropleft .dropdown-menu { + margin-right: 1px; + } + + [x-placement^="bottom-"] .dropdown-submenu .dropdown-menu, + .navbar .dropdown-submenu .dropdown-menu { + bottom: auto; + margin-top: calc(-0.5rem - 1px); + } + + [x-placement^="top-"] .dropdown-submenu .dropdown-menu { + top: auto; + bottom: 0; + margin-bottom: calc(-0.5rem - 1px); + } + + .dropdown-submenu.dropright > .dropdown-toggle { + display: flex; + justify-content: space-between; + align-items: center; + } + + .dropdown-submenu.dropright > .dropdown-toggle::after { + margin-right: -12px; + } \ No newline at end of file diff --git a/public/js/bootstrap/bootstrap-submenu.js b/public/js/bootstrap/bootstrap-submenu.js index 910538f03..8064e0fcc 100644 --- a/public/js/bootstrap/bootstrap-submenu.js +++ b/public/js/bootstrap/bootstrap-submenu.js @@ -1,121 +1,123 @@ (function (factory) { - if (typeof define === 'function' && define.amd) { - // AMD. Register as an anonymous module - define(['jquery'], factory); - } else if (typeof exports === 'object') { - // Node/CommonJS - module.exports = factory(require('jquery')); - } else { - // Browser globals - factory(jQuery); + if (typeof define === 'function' && define.amd) { + // AMD. Register as an anonymous module + define(['jquery'], factory); + } else if (typeof exports === 'object') { + // Node/CommonJS + module.exports = factory(require('jquery')); + } else { + // Browser globals + factory(jQuery); + } +})(function ($) { + var DropdownSubmenu = + /*#__PURE__*/ + function () { + function DropdownSubmenu(element) { + this.element = element.parentElement; + this.menuElement = this.element.querySelector('.dropdown-menu'); + this.init(); } - })(function ($) { - var DropdownSubmenu = /*#__PURE__*/function () { - function DropdownSubmenu(element) { - this.element = element.parentElement; - this.menuElement = this.element.querySelector('.dropdown-menu'); - this.init(); - } - - var _proto = DropdownSubmenu.prototype; - - _proto.init = function init() { - var _this = this; - - $(this.element).off('keydown.bs.dropdown.data-api'); - this.menuElement.addEventListener('keydown', this.itemKeydown.bind(this)); - var dropdownItemNodeList = this.menuElement.querySelectorAll('.dropdown-item'); - Array.from(dropdownItemNodeList).forEach(function (element) { - element.addEventListener('keydown', _this.handleKeydownDropdownItem.bind(_this)); - }); - $(this.menuElement).on('keydown', '.dropdown-submenu > .dropdown-item', this.handleKeydownSubmenuDropdownItem.bind(this)); - $(this.menuElement).on('click', '.dropdown-submenu > .dropdown-item', this.handleClickSubmenuDropdownItem.bind(this)); - $(this.element).on('hidden.bs.dropdown', function () { - _this.close(_this.menuElement); - }); - }; - - _proto.handleKeydownDropdownItem = function handleKeydownDropdownItem(event) { - // 27: Esc - if (event.keyCode !== 27) { - return; - } - - event.target.closest('.dropdown-menu').previousElementSibling.focus(); - event.target.closest('.dropdown-menu').classList.remove('show'); - }; - - _proto.handleKeydownSubmenuDropdownItem = function handleKeydownSubmenuDropdownItem(event) { - // 32: Spacebar - if (event.keyCode !== 32) { - return; - } // NOTE: Off vertical scrolling - - - event.preventDefault(); - this.toggle(event.target); - }; - - _proto.handleClickSubmenuDropdownItem = function handleClickSubmenuDropdownItem(event) { - event.stopPropagation(); - this.toggle(event.target); - }; - - _proto.itemKeydown = function itemKeydown(event) { - // 38: Arrow up, 40: Arrow down - if (![38, 40].includes(event.keyCode)) { - return; - } // NOTE: Off vertical scrolling - - - event.preventDefault(); - event.stopPropagation(); - var itemNodeList = this.element.querySelectorAll('.show > .dropdown-item:not(:disabled):not(.disabled), .show > .dropdown > .dropdown-item'); - var index = Array.from(itemNodeList).indexOf(event.target); - - if (event.keyCode === 38 && index !== 0) { - index--; - } else if (event.keyCode === 40 && index !== itemNodeList.length - 1) { - index++; - } else { - return; - } - - itemNodeList[index].focus(); - }; - - _proto.toggle = function toggle(element) { - var dropdownElement = element.closest('.dropdown'); - var parentMenuElement = dropdownElement.closest('.dropdown-menu'); - var menuElement = dropdownElement.querySelector('.dropdown-menu'); - var isOpen = menuElement.classList.contains('show'); - this.close(parentMenuElement); - menuElement.classList.toggle('show', !isOpen); - }; - - _proto.close = function close(menuElement) { - var menuNodeList = menuElement.querySelectorAll('.dropdown-menu.show'); - Array.from(menuNodeList).forEach(function (element) { - element.classList.remove('show'); - }); - }; - - return DropdownSubmenu; - }(); // For AMD/Node/CommonJS used elements (optional) - // http://learn.jquery.com/jquery-ui/environments/amd/ - - - $.fn.submenupicker = function (elements) { - var $elements = this instanceof $ ? this : $(elements); - return $elements.each(function () { - var data = $.data(this, 'bs.submenu'); - - if (!data) { - data = new DropdownSubmenu(this); - $.data(this, 'bs.submenu', data); - } + + var _proto = DropdownSubmenu.prototype; + + _proto.init = function init() { + var _this = this; + + $(this.element).off('keydown.bs.dropdown.data-api'); + this.menuElement.addEventListener('keydown', this.itemKeydown.bind(this)); + var dropdownItemNodeList = this.menuElement.querySelectorAll('.dropdown-item'); + Array.from(dropdownItemNodeList).forEach(function (element) { + element.addEventListener('keydown', _this.handleKeydownDropdownItem.bind(_this)); + }); + $(this.menuElement).on('keydown', '.dropdown-submenu > .dropdown-item', this.handleKeydownSubmenuDropdownItem.bind(this)); + $(this.menuElement).on('click', '.dropdown-submenu > .dropdown-item', this.handleClickSubmenuDropdownItem.bind(this)); + $(this.element).on('hidden.bs.dropdown', function () { + _this.close(_this.menuElement); }); }; - + + _proto.handleKeydownDropdownItem = function handleKeydownDropdownItem(event) { + // 27: Esc + if (event.keyCode !== 27) { + return; + } + + event.target.closest('.dropdown-menu').previousElementSibling.focus(); + event.target.closest('.dropdown-menu').classList.remove('show'); + }; + + _proto.handleKeydownSubmenuDropdownItem = function handleKeydownSubmenuDropdownItem(event) { + // 32: Spacebar + if (event.keyCode !== 32) { + return; + } // NOTE: Off vertical scrolling + + + event.preventDefault(); + this.toggle(event.target); + }; + + _proto.handleClickSubmenuDropdownItem = function handleClickSubmenuDropdownItem(event) { + event.stopPropagation(); + this.toggle(event.target); + }; + + _proto.itemKeydown = function itemKeydown(event) { + // 38: Arrow up, 40: Arrow down + if (![38, 40].includes(event.keyCode)) { + return; + } // NOTE: Off vertical scrolling + + + event.preventDefault(); + event.stopPropagation(); + var itemNodeList = this.element.querySelectorAll('.show > .dropdown-item:not(:disabled):not(.disabled), .show > .dropdown > .dropdown-item'); + var index = Array.from(itemNodeList).indexOf(event.target); + + if (event.keyCode === 38 && index !== 0) { + index--; + } else if (event.keyCode === 40 && index !== itemNodeList.length - 1) { + index++; + } else { + return; + } + + itemNodeList[index].focus(); + }; + + _proto.toggle = function toggle(element) { + var dropdownElement = element.closest('.dropdown'); + var parentMenuElement = dropdownElement.closest('.dropdown-menu'); + var menuElement = dropdownElement.querySelector('.dropdown-menu'); + var isOpen = menuElement.classList.contains('show'); + this.close(parentMenuElement); + menuElement.classList.toggle('show', !isOpen); + }; + + _proto.close = function close(menuElement) { + var menuNodeList = menuElement.querySelectorAll('.dropdown-menu.show'); + Array.from(menuNodeList).forEach(function (element) { + element.classList.remove('show'); + }); + }; + return DropdownSubmenu; - }); \ No newline at end of file + }(); // For AMD/Node/CommonJS used elements (optional) + // http://learn.jquery.com/jquery-ui/environments/amd/ + + + $.fn.submenupicker = function (elements) { + var $elements = this instanceof $ ? this : $(elements); + return $elements.each(function () { + var data = $.data(this, 'bs.submenu'); + + if (!data) { + data = new DropdownSubmenu(this); + $.data(this, 'bs.submenu', data); + } + }); + }; + + return DropdownSubmenu; +}); \ No newline at end of file diff --git a/public/print.html b/public/print.html index 13bd16ed0..7194b3201 100644 --- a/public/print.html +++ b/public/print.html @@ -17,7 +17,7 @@ - + @@ -26,8 +26,7 @@ - - +