From caa658dc8a52c651b95756834d2aa43c6c00b05d Mon Sep 17 00:00:00 2001 From: Argo-Asicotech Date: Wed, 16 Nov 2022 23:51:59 +0800 Subject: [PATCH 01/26] =?UTF-8?q?chore:=20=E6=9B=B4=E6=96=B0=E8=B5=84?= =?UTF-8?q?=E6=BA=90=E6=96=87=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/BootstrapBlazor.Shared/Locales/en.json | 5 +---- src/BootstrapBlazor.Shared/Locales/zh.json | 5 +---- 2 files changed, 2 insertions(+), 8 deletions(-) diff --git a/src/BootstrapBlazor.Shared/Locales/en.json b/src/BootstrapBlazor.Shared/Locales/en.json index c909b96ef..b2190f2b2 100644 --- a/src/BootstrapBlazor.Shared/Locales/en.json +++ b/src/BootstrapBlazor.Shared/Locales/en.json @@ -349,10 +349,7 @@ "P2": "A dialog box pops up, suitable for scenarios that require more customization", "P3": "Popup title", "P4": "popup text", - "P5": "by setting", - "P6": "component", - "P7": "Parameter, whether to open the pop-up window is supported", - "P8": "Please click the back button to set and then click the popup button to test the effect", + "P5": "by setting Modal component IsKeyboard parameter, whether to open the pop-up window is supported ESC, Please click the back button to set and then click the popup button to test the effect", "P9": "Pop-ups", "P10": "Default popup", "P11": "I am the text in the pop-up window", diff --git a/src/BootstrapBlazor.Shared/Locales/zh.json b/src/BootstrapBlazor.Shared/Locales/zh.json index cbdedecce..70f84001d 100644 --- a/src/BootstrapBlazor.Shared/Locales/zh.json +++ b/src/BootstrapBlazor.Shared/Locales/zh.json @@ -350,10 +350,7 @@ "P2": "弹出一个对话框，适合需要定制性更大的场景", "P3": "弹窗标题", "P4": "弹窗正文", - "P5": "通过设置", - "P6": "组件的", - "P7": "参数，开启弹窗是否支持", - "P8": "请点击后面按钮设置后再点击 弹窗 按钮测试效果", + "P5": "通过设置 Modal 组件的 IsKeyboard 参数，开启弹窗是否支持 ESC，请点击后面按钮设置后再点击 弹窗 按钮测试效果", "P9": "弹窗", "P10": "默认弹窗", "P11": "我是弹窗内正文", -- Gitee From 3e8a9f84952ef8738831b59f7882934d2a8b809c Mon Sep 17 00:00:00 2001 From: Argo-Asicotech Date: Wed, 16 Nov 2022 23:05:42 +0800 Subject: [PATCH 02/26] =?UTF-8?q?feat:=20=E5=A2=9E=E5=8A=A0=20Modal=20?= =?UTF-8?q?=E5=8A=A8=E6=80=81=E8=84=9A=E6=9C=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/BootstrapBlazor/Components/Modal/Modal.js | 126 ------------------ .../Components/Modal/Modal.razor | 4 +- .../Components/Modal/Modal.razor.cs | 10 +- src/BootstrapBlazor/wwwroot/modules/modal.js | 97 ++++++++++++++ 4 files changed, 102 insertions(+), 135 deletions(-) delete mode 100644 src/BootstrapBlazor/Components/Modal/Modal.js create mode 100644 src/BootstrapBlazor/wwwroot/modules/modal.js diff --git a/src/BootstrapBlazor/Components/Modal/Modal.js b/src/BootstrapBlazor/Components/Modal/Modal.js deleted file mode 100644 index 8a2661630..000000000 --- a/src/BootstrapBlazor/Components/Modal/Modal.js +++ /dev/null @@ -1,126 +0,0 @@ -(function ($) { - $.extend({ - bb_modal_dialog: function (el, obj, method) { - var $el = $(el); - $el.data('bb_dotnet_invoker', { obj, method }); - - // monitor mousedown ready to drag dialog - var originX = 0; - var originY = 0; - var dialogWidth = 0; - var dialogHeight = 0; - var pt = { top: 0, left: 0 }; - if ($el.hasClass('is-draggable')) { - $el.find('.btn-maximize').click(function () { - $button = $(this); - var status = $button.attr('aria-label'); - if (status === "maximize") { - $el.css({ - "marginLeft": "auto", - "width": $el.width(), - }); - } - else { - var handler = window.setInterval(function () { - if ($el.attr('style')) { - $el.removeAttr('style'); - } - else { - window.clearInterval(handler); - } - }, 100); - } - }); - $el.css({ - "marginLeft": "auto" - }); - $el.find('.modal-header').drag( - function (e) { - originX = e.clientX || e.touches[0].clientX; - originY = e.clientY || e.touches[0].clientY; - - // 弹窗大小 - dialogWidth = $el.width(); - dialogHeight = $el.height(); - - // 偏移量 - pt.top = parseInt($el.css('marginTop').replace("px", "")); - pt.left = parseInt($el.css('marginLeft').replace("px", "")); - - $el.css({ "marginLeft": pt.left, "marginTop": pt.top }); - - // 固定大小 - $el.css("width", dialogWidth); - this.addClass('is-drag'); - }, - function (e) { - var eventX = e.clientX || e.changedTouches[0].clientX; - var eventY = e.clientY || e.changedTouches[0].clientY; - - newValX = pt.left + Math.ceil(eventX - originX); - newValY = pt.top + Math.ceil(eventY - originY); - - if (newValX <= 0) newValX = 0; - if (newValY <= 0) newValY = 0; - - if (newValX + dialogWidth < $(window).width()) { - $el.css({ "marginLeft": newValX }); - } - if (newValY + dialogHeight < $(window).height()) { - $el.css({ "marginTop": newValY }); - } - }, - function (e) { - this.removeClass('is-drag'); - } - ); - } - }, - bb_modal: function (el, obj, method, callback) { - var $el = $(el); - - if (method === 'dispose') { - $el.remove(); - } - else if (method === 'init') { - function keyHandler() { - var e = event; - if (e.key === 'Escape') { - var $dialog = $el.find('.modal-dialog'); - var invoker = $dialog.data('bb_dotnet_invoker'); - if (invoker != null) { - invoker.obj.invokeMethodAsync(invoker.method); - } - } - }; - - if ($el.closest('.swal').length === 0) { - // move self end of the body - $('body').append($el); - } - $el.on('shown.bs.modal', function () { - var keyboard = $el.attr('data-bs-keyboard') === "true"; - if (keyboard === true) { - document.addEventListener('keyup', keyHandler, false); - } - obj.invokeMethodAsync(callback); - }); - $el.on('hide.bs.modal', function () { - var keyboard = $el.attr('data-bs-keyboard') === "true"; - if (keyboard === true) { - document.removeEventListener('keyup', keyHandler, false); - } - }) - } - else { - if (method !== 'hide' && method !== 'dispose') { - var instance = bootstrap.Modal.getInstance(el); - if (instance != null) { - instance._config.keyboard = false; - } - } - $el.modal(method); - } - } - }); -})(jQuery); diff --git a/src/BootstrapBlazor/Components/Modal/Modal.razor b/src/BootstrapBlazor/Components/Modal/Modal.razor index 901ccecf1..f11914ddf 100644 --- a/src/BootstrapBlazor/Components/Modal/Modal.razor +++ b/src/BootstrapBlazor/Components/Modal/Modal.razor @@ -1,7 +1,7 @@ @namespace BootstrapBlazor.Components -@inherits BootstrapComponentBase +@inherits BootstrapModuleComponentBase -
- @if (FooterTemplate != null) - { - - @FooterTemplate(Model) - - } - else - { - if (!IsTracking) - { -
} else { - @if (FooterTemplate != null) - { - - @FooterTemplate(Model) - - } - else - { - if (!IsTracking) - { -