Skip to content

Commit

Permalink
made ImportResults into reusable component
Browse files Browse the repository at this point in the history
Signed-off-by: Elizabeth Danzberger <lizzy7128@tutanota.de>
  • Loading branch information
elzody committed Mar 4, 2024
1 parent 0ead9c1 commit 5879a1b
Show file tree
Hide file tree
Showing 5 changed files with 99 additions and 89 deletions.
4 changes: 2 additions & 2 deletions lib/AppInfo/Application.php
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@
use OCA\Analytics\Datasource\DatasourceEvent;
use OCA\Tables\Capabilities;
use OCA\Tables\Listener\AnalyticsDatasourceListener;
use OCA\Tables\Listener\LoadAdditionalListener;
use OCA\Tables\Listener\TablesReferenceListener;
use OCA\Tables\Listener\UserDeletedListener;
use OCA\Tables\Reference\ContentReferenceProvider;
Expand All @@ -22,9 +23,8 @@
use OCP\Server;
use OCP\User\Events\BeforeUserDeletedEvent;
use Psr\Container\ContainerExceptionInterface;
use Psr\Container\NotFoundExceptionInterface;

use OCA\Tables\Listener\LoadAdditionalListener;
use Psr\Container\NotFoundExceptionInterface;

class Application extends App implements IBootstrap {
public const APP_ID = 'tables';
Expand Down
13 changes: 6 additions & 7 deletions lib/Listener/LoadAdditionalListener.php
Original file line number Diff line number Diff line change
Expand Up @@ -10,12 +10,11 @@

/** @template-implements IEventListener<LoadAdditionalScriptsEvent> */
class LoadAdditionalListener implements IEventListener {
public function handle(Event $event): void {
if (!($event instanceof LoadAdditionalScriptsEvent)) {
return;
}
public function handle(Event $event): void {
if (!($event instanceof LoadAdditionalScriptsEvent)) {
return;
}

Util::addScript(Application::APP_ID, 'tables-files', 'files');
}
Util::addScript(Application::APP_ID, 'tables-files', 'files');
}
}

2 changes: 1 addition & 1 deletion src/file-actions.js
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ const fileAction = new FileAction({
},

exec: async (file) => {
spawnDialog(FileActionImport, { t, file })
spawnDialog(FileActionImport, { file })
return null
},
})
Expand Down
53 changes: 37 additions & 16 deletions src/modules/modals/FileActionImport.vue
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<template>
<NcModal :show="modal">
<NcModal v-if="!importResults">
<div class="modal__content">
<h2>{{ t('tables', 'Import file into Tables') }}</h2>

Expand Down Expand Up @@ -80,14 +80,37 @@
</div>
</div>
</NcModal>

<NcDialog v-else
:name="t('tables', 'Import successful')"
:open.sync="showResultsDialog"
size="small">
<template #actions>
<NcButton :aria-label="t('tables', 'Close')" @click="closeResultsDialog()">
{{ t('tables', 'Close') }}
</NcButton>
</template>

<ImportResults :results="importResults" />
</NcDialog>
</template>

<script>
import { NcModal, NcButton, NcSelect, NcCheckboxRadioSwitch, NcEmojiPicker, NcLoadingIcon } from '@nextcloud/vue'
import {
NcModal,
NcDialog,
NcButton,
NcSelect,
NcCheckboxRadioSwitch,
NcEmojiPicker,
NcLoadingIcon,
} from '@nextcloud/vue'
import { generateUrl } from '@nextcloud/router'
import { Node } from '@nextcloud/files'
import { showError, showSuccess, spawnDialog } from '@nextcloud/dialogs'
import { showError } from '@nextcloud/dialogs'
import axios from '@nextcloud/axios'
import { translate as t } from '@nextcloud/l10n'
import RowFormWrapper from '../../shared/components/ncTable/partials/rowTypePartials/RowFormWrapper.vue'
import ImportResults from './ImportResults.vue'
Expand All @@ -97,6 +120,8 @@ export default {
components: {
NcModal,
NcButton,
NcDialog,
ImportResults,
NcLoadingIcon,
NcSelect,
NcCheckboxRadioSwitch,
Expand All @@ -105,10 +130,6 @@ export default {
},
props: {
t: {
type: Function,
default: null,
},
file: {
type: Node,
default: null,
Expand All @@ -117,18 +138,21 @@ export default {
data() {
return {
modal: true,
importAsNew: true,
createMissingColumns: true,
loadingTables: false,
importingFile: false,
newTable: {
emoji: '🔧',
title: this.file.basename,
},
importResults: null,
existingTables: [],
selectedTable: null,
importResults: null,
showResultsDialog: true,
}
},
Expand Down Expand Up @@ -162,12 +186,16 @@ export default {
},
methods: {
t,
selectIcon(icon) {
this.newTable.emoji = icon
},
setNewTableTitle(title) {
this.newTable.title = title.srcElement.value
},
closeResultsDialog() {
this.showResultsDialog = false
},
async importFile() {
this.importingFile = true
Expand All @@ -176,8 +204,6 @@ export default {
if (!this.importResults) {
showError(t('tables', 'Could not create table'))
} else {
showSuccess(t('tables', 'Created table "{emoji} {table}"', { emoji: this.newTable.emoji, table: this.newTable.title }))
}
} else {
if (!this.selectedTable) {
Expand All @@ -189,15 +215,10 @@ export default {
if (!this.importResults) {
showError(t('tables', 'Could not import data to table'))
} else {
showSuccess(t('tables', 'Imported to table "{table}"', { table: this.selectedTable.label }))
}
}
this.importingFile = false
this.modal = false
spawnDialog(ImportResults, { t, results: this.importResults })
},
},
}
Expand Down
116 changes: 53 additions & 63 deletions src/modules/modals/ImportResults.vue
Original file line number Diff line number Diff line change
@@ -1,90 +1,80 @@
<template>
<NcDialog :name="t('tables', 'Result')" :open.sync="show" size="small">
<template #actions>
<NcButton :aria-label="t('tables', 'Close')" @click="hideDialog">
{{ t('tables', 'Close') }}
</NcButton>
</template>
<table class="file_import__results">
<caption>
{{ t('tables', 'Result') }}
</caption>

<table class="import_modal__results">
<tbody>
<tr>
<td>{{ t('tables', 'Found columns') }}</td>
<td>{{ results.found_columns_count }}</td>
</tr>
<tbody>
<tr>
<td>{{ t('tables', 'Found columns') }}</td>
<td>{{ results.found_columns_count }}</td>
</tr>

<tr>
<td>{{ t('tables', 'Matching columns') }}</td>
<td>{{ results.matching_columns_count }}</td>
</tr>
<tr>
<td>{{ t('tables', 'Matching columns') }}</td>
<td>{{ results.matching_columns_count }}</td>
</tr>

<tr>
<td>{{ t('tables', 'Created columns') }}</td>
<td>{{ results.created_columns_count }}</td>
</tr>
<tr>
<td>{{ t('tables', 'Created columns') }}</td>
<td>{{ results.created_columns_count }}</td>
</tr>

<tr>
<td>{{ t('tables', 'Inserted rows') }}</td>
<td>{{ results.inserted_rows_count }}</td>
</tr>
<tr>
<td>{{ t('tables', 'Inserted rows') }}</td>
<td>{{ results.inserted_rows_count }}</td>
</tr>

<tr>
<td>{{ t('tables', 'Value parsing errors') }}</td>
<td>{{ results.errors_parsing_count }}</td>
</tr>
<tr>
<td>{{ t('tables', 'Value parsing errors') }}</td>
<td>{{ results.errors_parsing_count }}</td>
</tr>

<tr>
<td>{{ t('tables', 'Row creation errors') }}</td>
<td>{{ results.errors_count }}</td>
</tr>
</tbody>
</table>
</NcDialog>
<tr>
<td>{{ t('tables', 'Row creation errors') }}</td>
<td>{{ results.errors_count }}</td>
</tr>
</tbody>
</table>
</template>

<script>
import { NcDialog, NcButton } from '@nextcloud/vue'
import { translate as t } from '@nextcloud/l10n'
export default {
name: 'ImportResults',
components: {
NcDialog,
NcButton,
},
props: {
t: {
type: Function,
default: null,
},
results: {
found_columns_count: 0,
matching_columns_count: 0,
created_columns_count: 0,
inserted_rows_count: 0,
errors_parsing_count: 0,
errors_count: 0,
type: Object,
default() {
return {
found_columns_count: 0,
matching_columns_count: 0,
created_columns_count: 0,
inserted_rows_count: 0,
errors_parsing_count: 0,
errors_count: 0,
}
},
},
},
data() {
return {
show: true,
}
},
methods: {
hideDialog() {
this.show = false
},
t,
},
}
</script>

<style scoped>
.import_modal__results {
width: 100%;
margin-bottom: 10px;
.file_import__results {
margin: auto;
min-width: 350px;
max-width: 600px;
& caption {
font-weight: bold;
margin: calc(var(--default-grid-baseline) * 2) auto;
}
}
</style>

0 comments on commit 5879a1b

Please sign in to comment.