Spiegel von
https://github.com/paviliondev/discourse-custom-wizard.git
synchronisiert 2024-11-09 20:02:54 +01:00
client-side improvements
Dieser Commit ist enthalten in:
Ursprung
861ab40a5a
Commit
ee71719793
4 geänderte Dateien mit 144 neuen und 76 gelöschten Zeilen
|
@ -1,67 +1,97 @@
|
|||
import { ajax } from 'discourse/lib/ajax';
|
||||
import { default as computed } from 'ember-addons/ember-computed-decorators';
|
||||
|
||||
export default Ember.Controller.extend({
|
||||
init() {
|
||||
this._super();
|
||||
this.set('selected', Ember.A());
|
||||
this.set('filePath', Ember.A());
|
||||
this.setProperties({
|
||||
selected: Ember.A()
|
||||
});
|
||||
},
|
||||
|
||||
@computed('successIds', 'failureIds')
|
||||
logs(successIds, failureIds) {
|
||||
let logs = [];
|
||||
|
||||
if (successIds) {
|
||||
logs.push(...successIds.map(id => {
|
||||
return { id, type: 'success' };
|
||||
}));
|
||||
}
|
||||
|
||||
if (failureIds) {
|
||||
logs.push(...failureIds.map(id => {
|
||||
return { id, type: 'failure' };
|
||||
}));
|
||||
}
|
||||
|
||||
return logs;
|
||||
},
|
||||
|
||||
hasLogs: Ember.computed.notEmpty('logs'),
|
||||
|
||||
actions: {
|
||||
checkChanged(event) {
|
||||
this.set('noneSelected','')
|
||||
this.set('exportMessage', '');
|
||||
|
||||
let selected = this.get('selected');
|
||||
|
||||
if (event.target.checked) {
|
||||
selected.addObject(event.target.id)
|
||||
selected.addObject(event.target.id);
|
||||
} else if (!event.target.checked) {
|
||||
selected.removeObject(event.target.id)
|
||||
selected.removeObject(event.target.id);
|
||||
}
|
||||
this.set('selected', selected)
|
||||
|
||||
this.set('selected', selected);
|
||||
},
|
||||
|
||||
export() {
|
||||
let wizards = this.get('selected');
|
||||
let url = Discourse.BaseUrl;
|
||||
let route = '/admin/wizards/transfer/export';
|
||||
url += route + '?';
|
||||
const wizards = this.get('selected');
|
||||
|
||||
if (!wizards.length) {
|
||||
this.set('noneSelected', I18n.t("admin.wizard.transfer.export.noneSelected"))
|
||||
this.set('exportMessage', I18n.t("admin.wizard.transfer.export.none_selected"));
|
||||
} else {
|
||||
this.set('noneSelected', '')
|
||||
this.set('exportMessage', '');
|
||||
|
||||
let url = Discourse.BaseUrl;
|
||||
let route = '/admin/wizards/transfer/export';
|
||||
url += route + '?';
|
||||
|
||||
wizards.forEach((wizard) => {
|
||||
let step = 'wizards[]=' + wizard;
|
||||
step += '&';
|
||||
url += step
|
||||
url += step;
|
||||
});
|
||||
|
||||
location.href = url;
|
||||
}
|
||||
},
|
||||
|
||||
setFilePath(event) {
|
||||
this.set('noFile', '')
|
||||
this.set('importMessage', '');
|
||||
|
||||
// 512 kb is the max file size
|
||||
let maxFileSize = 512 * 1024;
|
||||
|
||||
if (event.target.files[0] === undefined) {
|
||||
this.get('filePath').length = 0
|
||||
return
|
||||
this.set('filePath', null);
|
||||
return;
|
||||
}
|
||||
|
||||
if (maxFileSize < event.target.files[0].size) {
|
||||
this.set('fileSizeError', I18n.t('admin.wizard.transfer.import.fileSizeError'))
|
||||
this.set('importMessage', I18n.t('admin.wizard.transfer.import.file_size_error'));
|
||||
} else {
|
||||
this.set('fileSizeError', '')
|
||||
// emptying the array as we allow only one file upload at a time
|
||||
this.get('filePath').length = 0
|
||||
// interestingly, this.get gives us the actual reference to the object so modifying it
|
||||
// actually modifies the actual value
|
||||
this.get('filePath').addObject(event.target.files[0])
|
||||
this.set('filePath', event.target.files[0]);
|
||||
}
|
||||
},
|
||||
|
||||
import() {
|
||||
const filePath = this.get('filePath');
|
||||
let $formData = new FormData();
|
||||
if (this.get('filePath').length) {
|
||||
this.set('noFile', '')
|
||||
$formData.append('file', this.get('filePath')[0]);
|
||||
|
||||
if (filePath) {
|
||||
$formData.append('file', filePath);
|
||||
|
||||
ajax('/admin/wizards/transfer/import', {
|
||||
type: 'POST',
|
||||
data: $formData,
|
||||
|
@ -69,14 +99,20 @@ export default Ember.Controller.extend({
|
|||
contentType: false,
|
||||
}).then(result => {
|
||||
if (result.error) {
|
||||
this.set('error', result.error)
|
||||
this.set('error', result.error);
|
||||
} else {
|
||||
this.set('success_ids', result.success)
|
||||
this.set('failure_ids', result.failed)
|
||||
this.setProperties({
|
||||
successIds: result.success,
|
||||
failureIds: result.failed,
|
||||
fileName: $('#file-url')[0].files[0].name
|
||||
});
|
||||
}
|
||||
})
|
||||
|
||||
this.set('filePath', null);
|
||||
$('#file-url').val('');
|
||||
});
|
||||
} else {
|
||||
this.set('noFile',I18n.t("admin.wizard.transfer.import.noFile"))
|
||||
this.set('importMessage', I18n.t("admin.wizard.transfer.import.no_file"));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,44 +1,61 @@
|
|||
<div class="container export">
|
||||
<h2>{{i18n 'admin.wizard.transfer.export.label'}}</h2>
|
||||
<ul class="wizard-list-select">
|
||||
{{#each model as |w|}}
|
||||
<li>
|
||||
{{input type="checkbox" id=(dasherize w.id) change=(action 'checkChanged')}}
|
||||
{{#link-to "adminWizard" (dasherize w.id)}}{{w.name}}{{/link-to}}
|
||||
</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
{{d-button id="export-button" class="btn btn-primary side" label="admin.wizard.transfer.export.label" action=(action "export")}}
|
||||
{{#if this.noneSelected}}
|
||||
<p>{{this.noneSelected}}</p>
|
||||
<h2>{{i18n 'admin.wizard.transfer.export.label'}}</h2>
|
||||
|
||||
<ul class="wizard-list-select">
|
||||
{{#each model as |w|}}
|
||||
<li>
|
||||
{{input type="checkbox"
|
||||
id=(dasherize w.id)
|
||||
change=(action 'checkChanged')}}
|
||||
{{#link-to "adminWizard" (dasherize w.id)}}
|
||||
{{w.name}}
|
||||
{{/link-to}}
|
||||
</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
|
||||
{{d-button id="export-button"
|
||||
class="btn btn-primary side"
|
||||
label="admin.wizard.transfer.export.label"
|
||||
action=(action "export")}}
|
||||
|
||||
{{#if exportMessage}}
|
||||
<div class="export-message">
|
||||
{{exportMessage}}
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
<div class="container import">
|
||||
<h2>{{i18n 'admin.wizard.transfer.import.label'}}</h2>
|
||||
{{input id='file_url' type="file" change=(action "setFilePath")}}
|
||||
{{d-button id="import-button" class="btn btn-primary side" label="admin.wizard.transfer.import.label" action=(action "import")}}
|
||||
{{#if this.noFile}}
|
||||
<p>{{this.noFile}}</p>
|
||||
{{/if}}
|
||||
<h2>{{i18n 'admin.wizard.transfer.import.label'}}</h2>
|
||||
|
||||
{{#if this.fileSizeError}}
|
||||
<p>{{this.fileSizeError}}</p>
|
||||
{{/if}}
|
||||
|
||||
{{#if this.success_ids}}
|
||||
{{#each this.success_ids as |id|}}
|
||||
<p>{{i18n "admin.wizard.transfer.import.success" id=id}}</p>
|
||||
{{/each}}
|
||||
{{/if}}
|
||||
|
||||
{{#if this.failure_ids}}
|
||||
{{#each this.failure_ids as |id|}}
|
||||
<p>{{i18n "admin.wizard.transfer.import.failure" id=id}}</p>
|
||||
{{/each}}
|
||||
<div class="controls">
|
||||
{{input id='file-url' type="file" change=(action "setFilePath")}}
|
||||
{{d-button id="import-button"
|
||||
class="btn btn-primary side"
|
||||
label="admin.wizard.transfer.import.label"
|
||||
action=(action "import")}}
|
||||
|
||||
{{#if importMessage}}
|
||||
<div class="import-message">
|
||||
{{importMessage}}
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
{{#if hasLogs}}
|
||||
<div class="import-logs">
|
||||
<div class="title">
|
||||
{{i18n 'admin.wizard.transfer.import.logs' fileName=fileName}}
|
||||
</div>
|
||||
|
||||
<ul>
|
||||
{{#each logs as |l|}}
|
||||
<li class="import-log">
|
||||
{{i18n (concat 'admin.wizard.transfer.import.' l.type) id=l.id}}
|
||||
</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
{{!-- server side error--}}
|
||||
{{#if this.error}}
|
||||
<p>{{this.error}}</p>
|
||||
{{/if}}
|
||||
|
|
|
@ -482,7 +482,12 @@
|
|||
}
|
||||
|
||||
// Tansfer tab
|
||||
#file_url {
|
||||
|
||||
.admin-wizards-transfer .admin-container .container {
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
#file-url {
|
||||
display: block;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
@ -491,11 +496,20 @@
|
|||
list-style-type: none;
|
||||
}
|
||||
|
||||
.wizard-action-buttons{
|
||||
.wizard-action-buttons {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.container{
|
||||
margin-bottom: 20px;
|
||||
.import-logs {
|
||||
margin-top: 20px;
|
||||
|
||||
.title {
|
||||
font-weight: 800;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -219,13 +219,14 @@ en:
|
|||
nav_label: "Transfer"
|
||||
export:
|
||||
label: "Export"
|
||||
noneSelected: "Please select atleast one wizard"
|
||||
none_selected: "Please select atleast one wizard"
|
||||
import:
|
||||
label: "Import"
|
||||
success: "Wizard: {{id}} saved successfully"
|
||||
failure: "Wizard: {{id}} could not be saved"
|
||||
noFile: "Please choose a file to import"
|
||||
fileSizeError: "The file size is too big"
|
||||
logs: "Import logs for {{fileName}}"
|
||||
success: 'Wizard "{{id}}" saved successfully'
|
||||
failure: 'Wizard "{{id}}" could not be saved'
|
||||
no_file: "Please choose a file to import"
|
||||
file_size_error: "The file size is too big"
|
||||
|
||||
wizard_js:
|
||||
location:
|
||||
|
|
Laden …
In neuem Issue referenzieren