Update: PageBase class中增加Tab栏标记状态设置

This commit is contained in:
王立帮
2024-12-13 16:02:46 +08:00
parent 09e18d6aac
commit 77a72e4a3d
7 changed files with 73 additions and 42 deletions

View File

@@ -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);
}

View File

@@ -85,6 +85,10 @@ class FSBoard {
getHandler() {
return this.#handler_;
}
dispose() {
this.#handler_ = null;
}
}
Mixly.FSBoard = FSBoard;

View File

@@ -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();

View File

@@ -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();
}
}

View File

@@ -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();
}

View File

@@ -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;

View File

@@ -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();