多维表格
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

146 lines
4.3 KiB

<script lang="ts" setup>
import { ExportTypes } from 'nocodb-sdk'
import { useToast } from 'vue-toastification'
import FileSaver from 'file-saver'
import { useNuxtApp } from '#app'
import { useProject } from '#imports'
import { ActiveViewInj, MetaInj } from '~/context'
import { extractSdkResponseErrorMsg } from '~/utils'
import MdiFlashIcon from '~icons/mdi/flash-outline'
import MdiMenuDownIcon from '~icons/mdi/menu-down'
import MdiDownloadIcon from '~icons/mdi/download-outline'
import MdiUploadIcon from '~icons/mdi/upload-outline'
import MdiHookIcon from '~icons/mdi/hook'
import MdiViewListIcon from '~icons/mdi/view-list-outline'
const sharedViewListDlg = ref(false)
// todo : replace with inject
const publicViewId = null
// TODO:: identify based on meta
const isView = ref(false)
const { isUIAllowed } = useUIPermission()
const { project } = useProject()
const { $api } = useNuxtApp()
const toast = useToast()
const meta = inject(MetaInj)
const selectedView = inject(ActiveViewInj)
const showWebhookDrawer = ref(false)
const exportCsv = async () => {
let offset = 0
let c = 1
try {
while (!isNaN(offset) && offset > -1) {
let res
if (publicViewId) {
/* res = await this.$api.public.csvExport(this.publicViewId, ExportTypes.CSV, {
responseType: 'blob',
query: {
fields:
this.queryParams &&
this.queryParams.fieldsOrder &&
this.queryParams.fieldsOrder.filter(c => this.queryParams.showFields[c]),
offset,
sortArrJson: JSON.stringify(
this.reqPayload &&
this.reqPayload.sorts &&
this.reqPayload.sorts.map(({ fk_column_id, direction }) => ({
direction,
fk_column_id,
}))
),
filterArrJson: JSON.stringify(this.reqPayload && this.reqPayload.filters),
},
headers: {
'xc-password': this.reqPayload && this.reqPayload.password,
},
});
*/
} else {
res = await $api.dbViewRow.export(
'noco',
project?.value.title as string,
meta?.value.title as string,
selectedView?.value.title as string,
ExportTypes.CSV,
{
responseType: 'blob',
query: {
offset,
},
} as any,
)
}
const { data } = res
offset = +res.headers['nc-export-offset']
const blob = new Blob([data], { type: 'text/plain;charset=utf-8' })
FileSaver.saveAs(blob, `${meta?.value.title}_exported_${c++}.csv`)
if (offset > -1) {
toast.info('Downloading more files')
} else {
toast.success('Successfully exported all table data')
}
}
} catch (e: any) {
toast.error(extractSdkResponseErrorMsg(e))
}
}
</script>
<template>
<div>
<a-dropdown>
<a-button v-t="['c:actions']" class="nc-actions-menu-btn nc-toolbar-btn">
<div class="flex gap-1 align-center">
<MdiFlashIcon class="text-grey" />
<!-- More -->
{{ $t('general.more') }}
<MdiMenuDownIcon class="text-grey" />
</div>
</a-button>
<template #overlay>
<div class="bg-white shadow">
<div>
<div class="nc-menu-item" @click="exportCsv">
<MdiDownloadIcon />
<!-- Download as CSV -->
{{ $t('activity.downloadCSV') }}
</div>
<div class="nc-menu-item" @click.stop>
<MdiUploadIcon />
<!-- Upload CSV -->
{{ $t('activity.uploadCSV') }}
</div>
<div class="nc-menu-item" @click="sharedViewListDlg = true">
<MdiViewListIcon />
<!-- Shared View List -->
{{ $t('activity.listSharedView') }}
</div>
<div class="nc-menu-item" @click="showWebhookDrawer = true">
<MdiHookIcon />
<!-- todo: i18n -->
Webhook
</div>
</div>
</div>
</template>
</a-dropdown>
<WebhookDrawer v-if="showWebhookDrawer" v-model="showWebhookDrawer" />
<a-modal v-model:visible="sharedViewListDlg" title="Shared view list" width="max(900px,60vw)" :footer="null">
<SmartsheetToolbarSharedViewList v-if="sharedViewListDlg" />
</a-modal>
</div>
</template>