[Client] Fix bug
This commit is contained in:
parent
2e99f57cf8
commit
d4f245f51c
6 changed files with 39 additions and 39 deletions
|
@ -248,6 +248,7 @@
|
||||||
this.files = [];
|
this.files = [];
|
||||||
this.folders = [];
|
this.folders = [];
|
||||||
this.hierarchyFolders = [];
|
this.hierarchyFolders = [];
|
||||||
|
this.selectedFiles = [];
|
||||||
|
|
||||||
this.uploads = [];
|
this.uploads = [];
|
||||||
|
|
||||||
|
@ -514,8 +515,14 @@
|
||||||
this.refs.uploader.upload(file, folder);
|
this.refs.uploader.upload(file, folder);
|
||||||
};
|
};
|
||||||
|
|
||||||
this.getSelection = () => {
|
this.chooseFile = file => {
|
||||||
this.files.filter(file => file._selected);
|
if (this.selectedFiles.some(f => f.id == file.id)) {
|
||||||
|
this.selectedFiles = this.selectedFiles.filter(f => f.id != file.id);
|
||||||
|
} else {
|
||||||
|
this.selectedFiles.push(file);
|
||||||
|
}
|
||||||
|
this.update();
|
||||||
|
this.trigger('change-selection', this.selectedFiles);
|
||||||
};
|
};
|
||||||
|
|
||||||
this.newWindow = folderId => {
|
this.newWindow = folderId => {
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
<mk-drive-browser-file data-is-selected={ (file._selected || false).toString() } data-is-contextmenu-showing={ isContextmenuShowing.toString() } onclick={ onclick } oncontextmenu={ oncontextmenu } draggable="true" ondragstart={ ondragstart } ondragend={ ondragend } title={ title }>
|
<mk-drive-browser-file data-is-selected={ isSelected } data-is-contextmenu-showing={ isContextmenuShowing.toString() } onclick={ onclick } oncontextmenu={ oncontextmenu } draggable="true" ondragstart={ ondragstart } ondragend={ ondragend } title={ title }>
|
||||||
<div class="label" if={ I.avatar_id == file.id }><img src="/resources/label.svg"/>
|
<div class="label" if={ I.avatar_id == file.id }><img src="/resources/label.svg"/>
|
||||||
<p>アバター</p>
|
<p>アバター</p>
|
||||||
</div>
|
</div>
|
||||||
|
@ -38,7 +38,7 @@
|
||||||
&:after
|
&:after
|
||||||
background #0b588c
|
background #0b588c
|
||||||
|
|
||||||
&[data-is-selected='true']
|
&[data-is-selected]
|
||||||
background $theme-color
|
background $theme-color
|
||||||
|
|
||||||
&:hover
|
&:hover
|
||||||
|
@ -150,28 +150,16 @@
|
||||||
|
|
||||||
this.file = this.opts.file;
|
this.file = this.opts.file;
|
||||||
this.browser = this.parent;
|
this.browser = this.parent;
|
||||||
|
|
||||||
this.title = `${this.file.name}\n${this.file.type} ${this.bytesToSize(this.file.datasize)}`;
|
this.title = `${this.file.name}\n${this.file.type} ${this.bytesToSize(this.file.datasize)}`;
|
||||||
|
|
||||||
this.isContextmenuShowing = false;
|
this.isContextmenuShowing = false;
|
||||||
|
this.isSelected = this.browser.selectedFiles.some(f => f.id == this.file.id);
|
||||||
|
|
||||||
|
this.browser.on('change-selection', selections => {
|
||||||
|
this.isSelected = selections.some(f => f.id == this.file.id);
|
||||||
|
});
|
||||||
|
|
||||||
this.onclick = () => {
|
this.onclick = () => {
|
||||||
if (this.browser.multiple) {
|
this.browser.chooseFile(this.file);
|
||||||
if (this.file._selected != null) {
|
|
||||||
this.file._selected = !this.file._selected;
|
|
||||||
} else {
|
|
||||||
this.file._selected = true;
|
|
||||||
}
|
|
||||||
this.browser.trigger('change-selection', this.browser.getSelection());
|
|
||||||
} else {
|
|
||||||
if (this.file._selected) {
|
|
||||||
this.browser.trigger('selected', this.file);
|
|
||||||
} else {
|
|
||||||
this.browser.files.forEach(file => file._selected = false);
|
|
||||||
this.file._selected = true;
|
|
||||||
this.browser.trigger('change-selection', this.file);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
};
|
||||||
|
|
||||||
this.oncontextmenu = e => {
|
this.oncontextmenu = e => {
|
||||||
|
|
|
@ -1,13 +1,17 @@
|
||||||
<mk-select-file-from-drive-window>
|
<mk-select-file-from-drive-window>
|
||||||
<mk-window ref="window" is-modal={ true } width={ '800px' } height={ '500px' }><yield to="header">
|
<mk-window ref="window" is-modal={ true } width={ '800px' } height={ '500px' }>
|
||||||
<mk-raw content={ parent.title }></mk-raw><span class="count" if={ parent.multiple && parent.file.length > 0 }>({ parent.file.length }ファイル選択中)</span></yield>
|
<yield to="header">
|
||||||
|
<mk-raw content={ parent.title }></mk-raw>
|
||||||
|
<span class="count" if={ parent.multiple && parent.files.length > 0 }>({ parent.files.length }ファイル選択中)</span>
|
||||||
|
</yield>
|
||||||
<yield to="content">
|
<yield to="content">
|
||||||
<mk-drive-browser ref="browser" multiple={ parent.multiple }></mk-drive-browser>
|
<mk-drive-browser ref="browser" multiple={ parent.multiple }></mk-drive-browser>
|
||||||
<div>
|
<div>
|
||||||
<button class="upload" title="PCからドライブにファイルをアップロード" onclick={ parent.upload }><i class="fa fa-upload"></i></button>
|
<button class="upload" title="PCからドライブにファイルをアップロード" onclick={ parent.upload }><i class="fa fa-upload"></i></button>
|
||||||
<button class="cancel" onclick={ parent.close }>キャンセル</button>
|
<button class="cancel" onclick={ parent.close }>キャンセル</button>
|
||||||
<button class="ok" disabled={ parent.multiple && parent.file.length == 0 } onclick={ parent.ok }>決定</button>
|
<button class="ok" disabled={ parent.multiple && parent.files.length == 0 } onclick={ parent.ok }>決定</button>
|
||||||
</div></yield>
|
</div>
|
||||||
|
</yield>
|
||||||
</mk-window>
|
</mk-window>
|
||||||
<style>
|
<style>
|
||||||
:scope
|
:scope
|
||||||
|
@ -131,20 +135,21 @@
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
<script>
|
<script>
|
||||||
this.file = [];
|
this.files = [];
|
||||||
|
|
||||||
this.multiple = this.opts.multiple != null ? this.opts.multiple : false;
|
this.multiple = this.opts.multiple != null ? this.opts.multiple : false;
|
||||||
this.title = this.opts.title || '<i class="fa fa-file-o"></i>ファイルを選択';
|
this.title = this.opts.title || '<i class="fa fa-file-o"></i>ファイルを選択';
|
||||||
|
|
||||||
this.on('mount', () => {
|
this.on('mount', () => {
|
||||||
this.refs.window.refs.browser.on('selected', file => {
|
this.refs.window.refs.browser.on('selected', file => {
|
||||||
this.file = file;
|
this.files = file;
|
||||||
this.ok();
|
this.ok();
|
||||||
});
|
});
|
||||||
|
|
||||||
this.refs.window.refs.browser.on('change-selection', files => {
|
this.refs.window.refs.browser.on('change-selection', files => {
|
||||||
this.file = files;
|
this.update({
|
||||||
this.update();
|
files: files
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
this.refs.window.on('closed', () => {
|
this.refs.window.on('closed', () => {
|
||||||
|
@ -161,7 +166,7 @@
|
||||||
};
|
};
|
||||||
|
|
||||||
this.ok = () => {
|
this.ok = () => {
|
||||||
this.trigger('selected', this.file);
|
this.trigger('selected', this.files);
|
||||||
this.refs.window.close();
|
this.refs.window.close();
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -59,7 +59,7 @@
|
||||||
this.files = [];
|
this.files = [];
|
||||||
|
|
||||||
this.on('mount', () => {
|
this.on('mount', () => {
|
||||||
this.refs.browser.on('change-selected', files => {
|
this.refs.browser.on('change-selection', files => {
|
||||||
this.update({
|
this.update({
|
||||||
files: files
|
files: files
|
||||||
});
|
});
|
||||||
|
|
|
@ -358,7 +358,7 @@
|
||||||
this.selectedFiles.push(file);
|
this.selectedFiles.push(file);
|
||||||
}
|
}
|
||||||
this.update();
|
this.update();
|
||||||
this.trigger('change-selected', this.selectedFiles);
|
this.trigger('change-selection', this.selectedFiles);
|
||||||
} else {
|
} else {
|
||||||
this.cf(file);
|
this.cf(file);
|
||||||
}
|
}
|
||||||
|
|
|
@ -128,7 +128,7 @@
|
||||||
this.file = this.opts.file;
|
this.file = this.opts.file;
|
||||||
this.isSelected = this.browser.selectedFiles.some(f => f.id == this.file.id);
|
this.isSelected = this.browser.selectedFiles.some(f => f.id == this.file.id);
|
||||||
|
|
||||||
this.browser.on('change-selected', selections => {
|
this.browser.on('change-selection', selections => {
|
||||||
this.isSelected = selections.some(f => f.id == this.file.id);
|
this.isSelected = selections.some(f => f.id == this.file.id);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue