Skip to content

Commit

Permalink
utransform data and ui updates for csv export fixes symbol#416
Browse files Browse the repository at this point in the history
  • Loading branch information
bassemmagdy committed Sep 5, 2020
1 parent 26a589b commit db43745
Show file tree
Hide file tree
Showing 12 changed files with 406 additions and 6 deletions.
45 changes: 43 additions & 2 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

6 changes: 5 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,8 @@
"animate.css": "^3.7.2",
"await-lock": "^2.0.1",
"axios": "^0.19.0",
"file-saver": "^2.0.2",
"json2csv": "^5.0.1",
"request": "^2.88.0",
"rss-parser": "^3.7.3",
"rxjs": "^6.5.2",
Expand All @@ -56,9 +58,11 @@
"vuex": "^3.0.1"
},
"devDependencies": {
"@babel/core": "^7.7.2",
"@babel/compat-data": "^7.9.6",
"@babel/core": "^7.7.2",
"@types/file-saver": "^2.0.1",
"@types/jest": "^23.3.1",
"@types/json2csv": "^5.0.1",
"@types/lodash": "^4.14.149",
"@types/node": "^9.6.50",
"@types/request": "^2.47.1",
Expand Down
5 changes: 4 additions & 1 deletion src/components/TransactionList/TransactionList.less
Original file line number Diff line number Diff line change
Expand Up @@ -89,7 +89,10 @@
text-align: right;
width: 100%;
display: block;

.download-transaction {
margin-top: 0.08rem;
margin-left: 0.3rem;
}
.ivu-page-item {
min-width: 0.31rem;
height: 0.3rem;
Expand Down
11 changes: 11 additions & 0 deletions src/components/TransactionList/TransactionList.vue
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,12 @@
/>
</div>
<div class="transaction-list-pagination-container">
<button
class="centered-button button-style validation-button left download-transaction"
@click="downloadTransaction"
>
{{ $t('button_download_qr') }}
</button>
<Page :total="totalCountItems" class="page_content" @on-change="onPageChange" />
</div>
</div>
Expand All @@ -27,6 +33,11 @@
:transaction="activePartialTransaction"
@close="onCloseCosignatureModal"
/>
<ModalTransactionExport
v-if="hasTransactionExportModal"
:visible="hasTransactionExportModal"
@close="hasTransactionExportModal = false"
/>
</div>
</template>

Expand Down
23 changes: 21 additions & 2 deletions src/components/TransactionList/TransactionListTs.ts
Original file line number Diff line number Diff line change
Expand Up @@ -29,15 +29,17 @@ import PageTitle from '@/components/PageTitle/PageTitle.vue'
import TransactionListFilters from '@/components/TransactionList/TransactionListFilters/TransactionListFilters.vue'
// @ts-ignore
import TransactionTable from '@/components/TransactionList/TransactionTable/TransactionTable.vue'
import { TransactionGroupState } from '@/store/Transaction'

// @ts-ignore
import ModalTransactionExport from '@/views/modals/ModalTransactionExport/ModalTransactionExport.vue'
import { TransactionGroup } from '@/store/Transaction'
@Component({
components: {
ModalTransactionCosignature,
ModalTransactionDetails,
PageTitle,
TransactionListFilters,
TransactionTable,
ModalTransactionExport,
},
computed: {
...mapGetters({
Expand Down Expand Up @@ -126,6 +128,12 @@ export class TransactionListTs extends Vue {
*/
public isAwaitingCosignature: boolean = false

/**
* Whether currently viewing export
* @var {boolean}
*/
public isViewingExportModal: boolean = false

public getEmptyMessage() {
return this.displayedTransactionStatus === TransactionGroupState.all
? 'no_data_transactions'
Expand Down Expand Up @@ -233,4 +241,15 @@ export class TransactionListTs extends Vue {
else if (page < 1) page = 1
this.currentPage = page
}

public get hasTransactionExportModal(): boolean {
return this.isViewingExportModal
}

public set hasTransactionExportModal(f: boolean) {
this.isViewingExportModal = f
}
public downloadTransaction() {
this.hasTransactionExportModal = true
}
}
115 changes: 115 additions & 0 deletions src/core/utils/CSVHelpers.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,115 @@
/*
* Copyright 2020 NEM Foundation (https://nem.io)
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and limitations under the License.
*
*/
import { Parser } from 'json2csv'
import FileSaver from 'file-saver'
import store from '@/store/index.ts'
import { TransactionViewFactory } from '@/core/transactions/TransactionViewFactory'
import { TransactionView } from '@/core/transactions/TransactionView'
import { AggregateTransaction, Transaction } from 'symbol-sdk'
import * as _ from 'lodash'

export class CSVHelpers {
protected static views: TransactionView<Transaction>[] = []
private static transactionsArray = []

/**
* Export to csv file
* @param data array of transactions
* returns new array with parsed aggregate transaction objects
*/
private static constructAggregateTransactionsObject(transaction: AggregateTransaction) {
let merged = {}
const result = {}
this.views = [
TransactionViewFactory.getView(store, transaction),
...transaction.innerTransactions.map((tx) => TransactionViewFactory.getView(store, tx)),
]
this.views.forEach((value) => {
let mergedRow = {}
mergedRow = value.headerItems.concat(value.detailItems)
merged = _.defaults(merged, mergedRow)
})

const mergedArray = Object.entries(merged)
for (let i = 0; i < mergedArray.length; i++) {
if (mergedArray[i][1]['key'] == 'paid_fee') {
result[mergedArray[i][1]['key']] = mergedArray[i][1]['value'].maxFee.compact().toString()
} else if (mergedArray[i][1]['key'] == 'transfer_target') {
result[mergedArray[i]['key']] = mergedArray[i][1]['value'].address
} else {
result[mergedArray[i][1]['key']] = mergedArray[i][1]['value']
}
}
return result
}

/**
* Export to csv file
* @param data array of transactions
* returns new array with parsed transaction objects
*/
private static constructTransactionsObject(transaction: Transaction) {
this.views = [TransactionViewFactory.getView(store, transaction)]
const result = {}
const value = this.views[0].headerItems.concat(this.views[0].detailItems)
for (let i = 0; i < value.length; i++) {
if (value[i].key == 'paid_fee') {
result[value[i].key] = value[i].value.maxFee.compact().toString()
} else if (value[i].key == 'transfer_target') {
result[value[i].key] = value[i].value.address
} else if (value[i].key.startsWith('Mosaic')) {
result[value[i].key] = value[i].value.amount + ' (' + value[i].value.mosaicHex + ')'
} else {
result[value[i].key] = value[i].value
}
}
return result
}

/**
* Export to csv file
* @param data array of transactions
* returns new array with parsed transaction objects
*/

private static prepareTransactions(data: []): any[] {
this.transactionsArray = []
data.forEach((transaction) => {
let result = {}
if (transaction instanceof AggregateTransaction) {
result = this.constructAggregateTransactionsObject(transaction)
} else {
result = this.constructTransactionsObject(transaction)
}
this.transactionsArray.push(result)
})
return this.transactionsArray
}

/**
* Export to csv file
* @param data The json data
* @param filename Prefix the name of the CSV file
*/
public static exportCSV(data: any, filename: string) {
const json2csvParser = new Parser()
const parsedTransactions = this.prepareTransactions(data)
const csvData = json2csvParser.parse(parsedTransactions)
const blob = new Blob(['\uFEFF' + csvData], { type: 'text/plain;charset=utf-8;' })
const exportFilename = `${filename}-${Date.now()}.csv`
return FileSaver.saveAs(blob, exportFilename)
}
}
3 changes: 3 additions & 0 deletions src/language/en-US.json
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,8 @@
"accounts_backup_title_keystore": "Download keys",
"accounts_backup_title_mnemonic": "Mnemonic passphrase",
"accounts_backup_title_qrcode": "Encrypted Mnemonic QRCode",
"accounts_backup_transactions": "Export the transaction list to a CSV file",
"accounts_backup_transactions_description": "Download all the transaction information, save it locally and view it even if you don't have an Internet connection",
"accounts_change_password_description": "Change your password",
"accounts_change_password_title": "Change Password",
"accounts_create_invoice": "Create an invoice",
Expand Down Expand Up @@ -292,6 +294,7 @@
"modal_account_unlock_title": "Unlock your account",
"modal_title_backup_mnemonic_display": "Display Mnemonic Passphrase",
"modal_title_backup_mnemonic_qrcode": "Export Mnemonic QR Code",
"modal_title_backup_transaction": "Export Transactions",
"modal_title_debug_console": "Diagnostic Console",
"modal_title_enter_account_name": "Configure your new account",
"modal_title_extend_namespace_duration": "Extend namespace duration",
Expand Down
3 changes: 3 additions & 0 deletions src/language/ja-JP.json
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,8 @@
"accounts_backup_title_keystore": "キーのダウンロード",
"accounts_backup_title_mnemonic": "ニーモニックパス語群",
"accounts_backup_title_qrcode": "ニーモニックQRコードの暗号化",
"accounts_backup_transactions": "トランザクションリストをCSVファイルにエクスポートする",
"accounts_backup_transactions_description": "すべての取引情報をダウンロードしてローカルに保存し、インターネットに接続していない場合でも表示します",
"accounts_change_password_description": "パスワードを変更",
"accounts_change_password_title": "パスワードを変更",
"accounts_create_invoice": "インボイスの作成",
Expand Down Expand Up @@ -292,6 +294,7 @@
"modal_account_unlock_title": "アカウントのアンロック",
"modal_title_backup_mnemonic_display": "ニーモニックパス語群の表示",
"modal_title_backup_mnemonic_qrcode": "ニーモニックQRコードのエクスポート",
"modal_title_backup_transaction": "輸出取引",
"modal_title_debug_console": "診断コンソール",
"modal_title_enter_account_name": "新しいアカウントを設定する",
"modal_title_extend_namespace_duration": "ネームスペース期限の延長",
Expand Down
3 changes: 3 additions & 0 deletions src/language/zh-CN.json
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,8 @@
"accounts_backup_title_mnemonic": "查看助记词",
"accounts_backup_title_qrcode": "备份助记词",
"accounts_change_password_description": "更改密码",
"accounts_backup_transactions": "将交易清单汇出至CSV档案",
"accounts_backup_transactions_description": "下载所有交易信息,保存在本地并查看,即使您没有互联网连接",
"accounts_change_password_title": "修改密码",
"accounts_create_invoice": "创建发票",
"accounts_flags_default_account": "默认钱包",
Expand Down Expand Up @@ -292,6 +294,7 @@
"modal_account_unlock_title": "解锁钱包",
"modal_title_backup_mnemonic_display": "显示助记词",
"modal_title_backup_mnemonic_qrcode": "导出助记词二维码",
"modal_title_backup_transaction": "出口交易",
"modal_title_debug_console": "诊断控制台",
"modal_title_enter_account_name": "配置新钱包",
"modal_title_extend_namespace_duration": "延长命名空间持续时间",
Expand Down
Loading

0 comments on commit db43745

Please sign in to comment.