Update: PageBase class中增加Tab栏标记状态设置
This commit is contained in:
@@ -357,10 +357,14 @@ html[data-bs-theme=dark] .chrome-tabs .chrome-tab.dirty .chrome-tab-close:hover
|
||||
background-color: #5f6368 !important;
|
||||
}
|
||||
|
||||
html[data-bs-theme=light] .chrome-tabs .chrome-tab.dirty .chrome-tab-close {
|
||||
background-color: #000;
|
||||
.chrome-tabs .chrome-tab.dirty .chrome-tab-close.positive {
|
||||
background-color: #ffb800;
|
||||
}
|
||||
|
||||
html[data-bs-theme=dark] .chrome-tabs .chrome-tab.dirty .chrome-tab-close {
|
||||
background-color: #fff;
|
||||
html[data-bs-theme=light] .chrome-tabs .chrome-tab.dirty .chrome-tab-close.negative {
|
||||
background-color: var(--app-light-color);
|
||||
}
|
||||
|
||||
html[data-bs-theme=dark] .chrome-tabs .chrome-tab.dirty .chrome-tab-close.negative {
|
||||
background-color: var(--app-dark-color);
|
||||
}
|
||||
@@ -85,6 +85,10 @@ class FSBoard {
|
||||
getHandler() {
|
||||
return this.#handler_;
|
||||
}
|
||||
|
||||
dispose() {
|
||||
this.#handler_ = null;
|
||||
}
|
||||
}
|
||||
|
||||
Mixly.FSBoard = FSBoard;
|
||||
|
||||
@@ -15,6 +15,7 @@ const {
|
||||
class PageBase extends Component {
|
||||
#pages_ = new Registry();
|
||||
#$tab_ = null;
|
||||
#$close_ = null;
|
||||
#dirty_ = false;
|
||||
#active_ = true;
|
||||
#inited_ = false;
|
||||
@@ -64,7 +65,9 @@ class PageBase extends Component {
|
||||
dispose() {
|
||||
this.#forward_('dispose');
|
||||
this.#pages_.reset();
|
||||
this.#$close_ = null;
|
||||
this.#$tab_ && this.#$tab_.remove();
|
||||
this.#$tab_ = null;
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
@@ -97,22 +100,25 @@ class PageBase extends Component {
|
||||
|
||||
setTab($tab) {
|
||||
this.#$tab_ = $tab;
|
||||
this.#$close_ = $tab.find('.chrome-tab-close');
|
||||
}
|
||||
|
||||
hideCloseBtn() {
|
||||
const $closeBtn = this.getTab().find('.chrome-tab-close');
|
||||
$closeBtn.css('display', 'none');
|
||||
this.#$close_.css('display', 'none');
|
||||
}
|
||||
|
||||
showCloseBtn() {
|
||||
const $closeBtn = this.getTab().find('.chrome-tab-close');
|
||||
$closeBtn.css('display', 'block');
|
||||
this.#$close_.css('display', 'block');
|
||||
}
|
||||
|
||||
getTab() {
|
||||
return this.#$tab_;
|
||||
}
|
||||
|
||||
setMarkStatus(styleClass) {
|
||||
this.#$close_.attr('class', `chrome-tab-close layui-badge-dot ${styleClass}`);
|
||||
}
|
||||
|
||||
addDirty() {
|
||||
this.#forward_('addDirty');
|
||||
const $tab = this.getTab();
|
||||
|
||||
@@ -46,7 +46,6 @@ class StatusBarAmpy extends PageBase {
|
||||
);
|
||||
}
|
||||
|
||||
#$close_ = null;
|
||||
#$fileTree_ = null;
|
||||
#$editor_ = null;
|
||||
#$openFS_ = null;
|
||||
@@ -370,9 +369,7 @@ class StatusBarAmpy extends PageBase {
|
||||
init() {
|
||||
super.init();
|
||||
this.addDirty();
|
||||
const $tab = this.getTab();
|
||||
this.#$close_ = $tab.find('.chrome-tab-close');
|
||||
this.#$close_.addClass('layui-badge-dot layui-bg-blue');
|
||||
this.setMarkStatus('negative');
|
||||
this.#editor_.init();
|
||||
this.#addEventsListener_();
|
||||
const editor = this.#editor_.getEditor();
|
||||
@@ -434,22 +431,28 @@ class StatusBarAmpy extends PageBase {
|
||||
}
|
||||
|
||||
setStatus(isChanged) {
|
||||
if (this.#changed_ === isChanged || !this.#$close_) {
|
||||
if (this.#changed_ === isChanged) {
|
||||
return;
|
||||
}
|
||||
this.#changed_ = isChanged;
|
||||
if (isChanged) {
|
||||
this.#$close_.removeClass('layui-bg-blue');
|
||||
this.#$close_.addClass('layui-bg-orange');
|
||||
this.setMarkStatus('positive');
|
||||
} else {
|
||||
this.#$close_.removeClass('layui-bg-orange');
|
||||
this.#$close_.addClass('layui-bg-blue');
|
||||
this.setMarkStatus('negative');
|
||||
}
|
||||
}
|
||||
|
||||
dispose() {
|
||||
this.#$fileTree_ = null;
|
||||
this.#$editor_ = null;
|
||||
this.#$openFS_ = null;
|
||||
this.#$editorEmpty_ = null;
|
||||
this.#editor_.dispose();
|
||||
this.#editor_ = null;
|
||||
this.#fileTree_.dispose();
|
||||
this.#fileTree_ = null;
|
||||
this.#drag_.dispose();
|
||||
this.#drag_ = null;
|
||||
super.dispose();
|
||||
}
|
||||
}
|
||||
|
||||
@@ -179,6 +179,13 @@ class Panel extends Component {
|
||||
|
||||
dispose() {
|
||||
this.#$fsSelect_.select2('destroy');
|
||||
this.#$folderInput_ = null;
|
||||
this.#$closeBtn_ = null;
|
||||
this.#$selectFolderBtn_ = null;
|
||||
this.#$downloadBtn_ = null;
|
||||
this.#$uploadBtn_ = null;
|
||||
this.#$fsSelect_ = null;
|
||||
this.#$progress_ = null;
|
||||
super.dispose();
|
||||
}
|
||||
}
|
||||
@@ -193,9 +200,8 @@ class StatusBarFS extends PageBase {
|
||||
}
|
||||
|
||||
#$btn_ = null;
|
||||
#fsBoard_ = null;
|
||||
#$close_ = null;
|
||||
#$mask_ = null;
|
||||
#fsBoard_ = null;
|
||||
#registry_ = new Registry();
|
||||
#opened_ = false;
|
||||
|
||||
@@ -221,24 +227,20 @@ class StatusBarFS extends PageBase {
|
||||
|
||||
init() {
|
||||
this.addDirty();
|
||||
const $tab = this.getTab();
|
||||
this.#$close_ = $tab.find('.chrome-tab-close');
|
||||
this.#$close_.addClass('layui-badge-dot layui-bg-blue');
|
||||
this.setMarkStatus('negative');
|
||||
}
|
||||
|
||||
setStatus(isOpened) {
|
||||
if (this.#opened_ === isOpened || !this.#$close_) {
|
||||
if (this.#opened_ === isOpened) {
|
||||
return;
|
||||
}
|
||||
this.#opened_ = isOpened;
|
||||
if (isOpened) {
|
||||
this.#$mask_.css('display', 'block');
|
||||
this.#$close_.removeClass('layui-bg-blue');
|
||||
this.#$close_.addClass('layui-bg-orange');
|
||||
this.setMarkStatus('positive');
|
||||
} else {
|
||||
this.#$mask_.css('display', 'none');
|
||||
this.#$close_.removeClass('layui-bg-orange');
|
||||
this.#$close_.addClass('layui-bg-blue');
|
||||
this.setMarkStatus('negative');
|
||||
}
|
||||
}
|
||||
|
||||
@@ -310,7 +312,12 @@ class StatusBarFS extends PageBase {
|
||||
for (let id of this.#registry_.keys()) {
|
||||
this.#registry_.getItem(id).dispose();
|
||||
}
|
||||
this.#$btn_ = null;
|
||||
this.#$mask_ = null;
|
||||
this.#fsBoard_.dispose();
|
||||
this.#fsBoard_ = null;
|
||||
this.#registry_.reset();
|
||||
this.#registry_ = null;
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
|
||||
@@ -39,7 +39,6 @@ class StatusBarLibs extends PageBase {
|
||||
}
|
||||
|
||||
#manager_ = null;
|
||||
#$close_ = null;
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
@@ -56,8 +55,7 @@ class StatusBarLibs extends PageBase {
|
||||
init() {
|
||||
this.addDirty();
|
||||
const $tab = this.getTab();
|
||||
this.#$close_ = $tab.find('.chrome-tab-close');
|
||||
this.#$close_.addClass('layui-badge-dot layui-bg-blue');
|
||||
this.setMarkStatus('negative');
|
||||
}
|
||||
|
||||
getManager() {
|
||||
@@ -78,6 +76,12 @@ class StatusBarLibs extends PageBase {
|
||||
this.#manager_.onUnmounted();
|
||||
super.onUnmounted();
|
||||
}
|
||||
|
||||
dispose() {
|
||||
this.#manager_.dispose();
|
||||
this.#manager_ = null;
|
||||
super.dispose();
|
||||
}
|
||||
}
|
||||
|
||||
Mixly.StatusBarLibs = StatusBarLibs;
|
||||
|
||||
@@ -62,9 +62,6 @@ class StatusBarSerial extends PageBase {
|
||||
}
|
||||
}
|
||||
|
||||
#$close_ = null;
|
||||
#opened_ = false;
|
||||
#valueTemp_ = '';
|
||||
#$sendInput_ = null;
|
||||
#$settingMenu_ = null;
|
||||
#$scroll_ = null;
|
||||
@@ -72,6 +69,8 @@ class StatusBarSerial extends PageBase {
|
||||
#$dtr_ = null;
|
||||
#$rts_ = null;
|
||||
#$hex_ = null;
|
||||
#opened_ = false;
|
||||
#valueTemp_ = '';
|
||||
#manager_ = null;
|
||||
#output_ = null;
|
||||
#chart_ = null;
|
||||
@@ -84,7 +83,6 @@ class StatusBarSerial extends PageBase {
|
||||
sendWith: '\r\n',
|
||||
hex: false
|
||||
};
|
||||
#dropdownMenu_ = null;
|
||||
#addTimestamp_ = false;
|
||||
#maxLine_ = 200;
|
||||
#lastUpdate_ = 0;
|
||||
@@ -426,9 +424,8 @@ class StatusBarSerial extends PageBase {
|
||||
init() {
|
||||
super.init();
|
||||
this.addDirty();
|
||||
this.setMarkStatus('negative');
|
||||
const $tab = this.getTab();
|
||||
this.#$close_ = $tab.find('.chrome-tab-close');
|
||||
this.#$close_.addClass('layui-badge-dot layui-bg-blue');
|
||||
this.#port_ = $tab.attr('data-tab-id');
|
||||
this.#serial_ = new Serial(this.getPortName());
|
||||
this.#serial_.config(this.#config_).catch(Debug.error);
|
||||
@@ -495,16 +492,14 @@ class StatusBarSerial extends PageBase {
|
||||
}
|
||||
|
||||
setStatus(isOpened) {
|
||||
if (this.isOpened() === isOpened || !this.#$close_) {
|
||||
if (this.isOpened() === isOpened) {
|
||||
return;
|
||||
}
|
||||
this.#opened_ = isOpened;
|
||||
if (isOpened) {
|
||||
this.#$close_.removeClass('layui-bg-blue');
|
||||
this.#$close_.addClass('layui-bg-orange');
|
||||
this.setMarkStatus('positive');
|
||||
} else {
|
||||
this.#$close_.removeClass('layui-bg-orange');
|
||||
this.#$close_.addClass('layui-bg-blue');
|
||||
this.setMarkStatus('negative');
|
||||
}
|
||||
this.#output_.setStatus(isOpened);
|
||||
this.#chart_.setStatus(isOpened);
|
||||
@@ -558,9 +553,17 @@ class StatusBarSerial extends PageBase {
|
||||
this.#serial_.close()
|
||||
.catch(Debug.error)
|
||||
.finally(() => {
|
||||
this.#$sendInput_ = null;
|
||||
this.#$settingMenu_ = null;
|
||||
this.#$scroll_ = null;
|
||||
this.#$timestamp_ = null;
|
||||
this.#$dtr_ = null;
|
||||
this.#$rts_ = null;
|
||||
this.#$hex_ = null;
|
||||
this.#output_ = null;
|
||||
this.#chart_ = null;
|
||||
this.#manager_.dispose();
|
||||
this.#manager_ = null;
|
||||
this.#$close_ = null;
|
||||
this.#serial_.dispose();
|
||||
this.#serial_ = null;
|
||||
super.dispose();
|
||||
|
||||
Reference in New Issue
Block a user