2023-02-11 13:21:06 +08:00
|
|
|
import './index.less';
|
2023-02-22 23:07:06 +08:00
|
|
|
import $ from 'jquery';
|
2023-02-22 17:20:03 +08:00
|
|
|
import '@backset/ui/src/components/Tooltip/index.less';
|
2023-02-22 23:07:06 +08:00
|
|
|
// import '@backset/ui/src/components/Dropdown/index.scss';
|
2023-02-11 13:21:06 +08:00
|
|
|
|
2023-02-22 23:07:06 +08:00
|
|
|
$('select[data-menu]').each(function () {
|
|
|
|
let select = $(this);
|
|
|
|
let options = select.find('option');
|
|
|
|
let menu = $('<div />').addClass('bs-select-menu');
|
|
|
|
let button = $('<div />').addClass('button');
|
|
|
|
let list = $('<ul />');
|
|
|
|
$('<em />').prependTo(button);
|
|
|
|
|
|
|
|
options.each(function (i) {
|
|
|
|
let option = $(this);
|
|
|
|
list.append($('<li />').text(option.text()));
|
|
|
|
});
|
|
|
|
|
|
|
|
menu.css('--t', select.find(':selected').index() * -36.5 + 'px');
|
|
|
|
|
|
|
|
select.wrap(menu);
|
|
|
|
|
|
|
|
button.append(list).insertAfter(select);
|
|
|
|
|
|
|
|
list.clone().insertAfter(button);
|
|
|
|
});
|
|
|
|
|
|
|
|
$(document).on('click', '.bs-select-menu', function (e) {
|
|
|
|
let menu = $(this);
|
|
|
|
if (!menu.hasClass('open')) menu.addClass('open');
|
|
|
|
});
|
|
|
|
|
|
|
|
$(document).on('click', '.bs-select-menu > ul > li', function (e) {
|
|
|
|
let li = $(this);
|
|
|
|
let menu = li.parent().parent();
|
|
|
|
let select = menu.children('select');
|
|
|
|
let selected = select.find('option:selected');
|
|
|
|
let index = li.index();
|
|
|
|
|
|
|
|
menu.css('--t', index * -36.5 + 'px');
|
|
|
|
selected.removeAttr('selected');
|
|
|
|
select.find('option').eq(index).attr('selected', 'selected');
|
|
|
|
|
|
|
|
menu.addClass(index > selected.index() ? 'tilt-down' : 'tilt-up');
|
|
|
|
|
|
|
|
setTimeout(() => {
|
|
|
|
menu.removeClass('open tilt-up tilt-down');
|
|
|
|
}, 500);
|
|
|
|
});
|
|
|
|
|
|
|
|
$(document).on('click', function (e: any) {
|
|
|
|
e.stopPropagation();
|
|
|
|
if ($('.bs-select-menu').has(e.target).length === 0) {
|
|
|
|
$('.bs-select-menu').removeClass('open');
|
|
|
|
}
|
2023-02-22 17:20:03 +08:00
|
|
|
});
|