From e786d182e0cbaf1159b415c8eb06bbb470e7c82f Mon Sep 17 00:00:00 2001
From: productdevbook <hi@productdevbook.com>
Date: Wed, 13 Dec 2023 08:27:59 +0300
Subject: [PATCH] feat(examples): add CSV export functionality

---
 examples/p-json2csv/app.vue | 34 +++++++++++++++++++++++++++++++++-
 1 file changed, 33 insertions(+), 1 deletion(-)

diff --git a/examples/p-json2csv/app.vue b/examples/p-json2csv/app.vue
index a495b757..26ecab47 100644
--- a/examples/p-json2csv/app.vue
+++ b/examples/p-json2csv/app.vue
@@ -1,5 +1,37 @@
+<script setup lang="ts">
+async function exportCSV() {
+  await useFetch('/api/csvDownload', {
+    method: 'get',
+    onResponse({ response }) {
+      download(response._data, 'form.csv')
+    },
+  })
+}
+
+function download(data: any, filename: string) {
+  const defaultMimeType = 'application/octet-stream'
+  const blob = new Blob([data], { type: defaultMimeType })
+  const blobURL = window.URL.createObjectURL(blob)
+
+  const tempLink = document.createElement('a')
+  tempLink.style.display = 'none'
+  tempLink.href = blobURL
+  tempLink.setAttribute('download', filename)
+
+  if (typeof tempLink.download === 'undefined')
+    tempLink.setAttribute('target', '_blank')
+
+  document.body.appendChild(tempLink)
+  tempLink.click()
+  document.body.removeChild(tempLink)
+  window.URL.revokeObjectURL(blobURL)
+}
+</script>
+
 <template>
   <div>
-    <NuxtWelcome />
+    <button @click="exportCSV">
+      Download CSV
+    </button>
   </div>
 </template>