get tsv export from tools page

frontend/lib/api/classes/reports.ts

@@ -0,0 +1,27 @@
+import { BaseAPI, route } from "../base";
+
+export class ReportsAPI extends BaseAPI {
+  async billOfMaterials(): Promise<void> {
+    const { data: stream, error } = await this.http.get<ReadableStream>({ url: route("/reporting/bill-of-materials") });
+
+    if (error) {
+      return;
+    }
+
+    const reader = stream.getReader();
+    let data = "";
+    while (true) {
+      const { done, value } = await reader.read();
+      if (done) {
+        break;
+      }
+      data += new TextDecoder("utf-8").decode(value);
+    }
+
+    const blob = new Blob([data], { type: "text/tsv" });
+    const link = document.createElement("a");
+    link.href = window.URL.createObjectURL(blob);
+    link.download = "bill-of-materials.tsv";
+    link.click();
+  }
+}

frontend/lib/api/user.ts

@@ -7,6 +7,7 @@ import { UserApi } from "./classes/users";
 import { ActionsAPI } from "./classes/actions";
 import { StatsAPI } from "./classes/stats";
 import { AssetsApi } from "./classes/assets";
+import { ReportsAPI } from "./classes/reports";
 import { Requests } from "~~/lib/requests";
 
 export class UserClient extends BaseAPI {
@@ -18,6 +19,7 @@ export class UserClient extends BaseAPI {
   actions: ActionsAPI;
   stats: StatsAPI;
   assets: AssetsApi;
+  reports: ReportsAPI;
 
   constructor(requests: Requests, attachmentToken: string) {
     super(requests, attachmentToken);
@@ -30,6 +32,7 @@ export class UserClient extends BaseAPI {
     this.actions = new ActionsAPI(requests);
     this.stats = new StatsAPI(requests);
     this.assets = new AssetsApi(requests);
+    this.reports = new ReportsAPI(requests);
 
     Object.freeze(this);
   }

frontend/pages/tools.vue

@@ -2,6 +2,32 @@
   <div>
     <AppImportDialog v-model="modals.import" />
     <BaseContainer class="flex flex-col gap-4 mb-6">
+      <BaseCard>
+        <template #title>
+          <BaseSectionHeader>
+            <Icon name="mdi-file-chart" class="mr-2 -mt-1" />
+            <span> Reports </span>
+            <template #description> Generate different reports for your inventory. </template>
+          </BaseSectionHeader>
+        </template>
+        <div class="border-t px-6 pb-3 border-gray-300 divide-gray-300 divide-y">
+          <DetailAction @action="navigateTo('/reports/label-generator')">
+            <template #title>Asset ID Labels</template>
+            Generates a printable PDF of labels for a range of Asset ID. These are not specific to your inventory so
+            your are able to print labels ahead of time and apply them to your inventory when you receive them.
+            <template #button>
+              Label Generator
+              <Icon name="mdi-arrow-right" class="ml-2" />
+            </template>
+          </DetailAction>
+          <DetailAction @action="getBillOfMaterials()">
+            <template #title>Bill of Materials</template>
+            Generates a TSV (Tab Separated Values) file that can be imported into a spreadsheet program. This is a
+            summary of your inventory with basic item and pricing information
+            <template #button> Generate BOM </template>
+          </DetailAction>
+        </div>
+      </BaseCard>
       <BaseCard>
         <template #title>
           <BaseSectionHeader>
@@ -12,38 +38,18 @@
               new instance of Homebox.
             </template>
           </BaseSectionHeader>
-          <div class="border-t border-gray-300 divide-gray-300 divide-y">
-            <DetailAction @action="modals.import = true">
-              <template #title>Import Inventory</template>
-              Imports the standard CSV format for Homebox. This will <b>not</b> overwrite any existing items in your
-              inventory. It will only add new items.
-            </DetailAction>
-            <!-- <DetailAction>
-              <template #title>Export Inventory</template>
-              Exports the standard CSV format for Homebox. This will export all items in your inventory.
-            </DetailAction> -->
-          </div>
-        </template>
-      </BaseCard>
-      <BaseCard>
-        <template #title>
-          <BaseSectionHeader>
-            <Icon name="mdi-file-chart" class="mr-2 -mt-1" />
-            <span> Reports </span>
-            <template #description> Generate different reports for your inventory. </template>
-          </BaseSectionHeader>
-          <div class="border-t border-gray-300 divide-gray-300 divide-y">
-            <DetailAction @action="navigateTo('/reports/label-generator')">
-              <template #title>Asset ID Labels</template>
-              Generates a printable PDF of labels for a range of Asset ID. These are not specific to your invetory so
-              your are able to print labels ahead of time and apply them to your inventory when you receive them.
-              <template #button>
-                Label Generator
-                <Icon name="mdi-arrow-right" class="ml-2" />
-              </template>
-            </DetailAction>
-          </div>
         </template>
+        <div class="border-t px-6 pb-3 border-gray-300 divide-gray-300 divide-y">
+          <DetailAction @action="modals.import = true">
+            <template #title>Import Inventory</template>
+            Imports the standard CSV format for Homebox. This will <b>not</b> overwrite any existing items in your
+            inventory. It will only add new items.
+          </DetailAction>
+          <!-- <DetailAction>
+            <template #title>Export Inventory</template>
+            Exports the standard CSV format for Homebox. This will export all items in your inventory.
+          </DetailAction> -->
+        </div>
       </BaseCard>
       <BaseCard>
         <template #title>
@@ -54,24 +60,24 @@
               Apply Actions to your inventory in bulk. These are irreversible actions. <b>Be careful</b>
             </template>
           </BaseSectionHeader>
-          <div class="border-t border-gray-300 divide-gray-300 divide-y">
-            <DetailAction @action="ensureAssetIDs">
-              <template #title>Ensure Asset IDs</template>
-              Ensures that all items in your inventory have a valid asset_id field. This is done by finding the highest
-              current asset_id field in the database and applying the next value to each item that has an unset asset_id
-              field. This is done in order of the created_at field.
-            </DetailAction>
-            <DetailAction @click="resetItemDateTimes">
-              <template #title> Zero Item Date Times</template>
-              Resets the time value for all date time fields in your inventory to the beginning of the date. This is to
-              fix a bug that was introduced early on in the development of the site that caused the time value to be
-              stored with the time which caused issues with date fields displaying accurate values.
-              <a class="link" href="https://github.com/hay-kot/homebox/issues/236" target="_blank">
-                See Github Issue #236 for more details
-              </a>
-            </DetailAction>
-          </div>
         </template>
+        <div class="border-t px-6 pb-3 border-gray-300 divide-gray-300 divide-y">
+          <DetailAction @action="ensureAssetIDs">
+            <template #title>Ensure Asset IDs</template>
+            Ensures that all items in your inventory have a valid asset_id field. This is done by finding the highest
+            current asset_id field in the database and applying the next value to each item that has an unset asset_id
+            field. This is done in order of the created_at field.
+          </DetailAction>
+          <DetailAction @click="resetItemDateTimes">
+            <template #title> Zero Item Date Times</template>
+            Resets the time value for all date time fields in your inventory to the beginning of the date. This is to
+            fix a bug that was introduced early on in the development of the site that caused the time value to be
+            stored with the time which caused issues with date fields displaying accurate values.
+            <a class="link" href="https://github.com/hay-kot/homebox/issues/236" target="_blank">
+              See Github Issue #236 for more details
+            </a>
+          </DetailAction>
+        </div>
       </BaseCard>
     </BaseContainer>
   </div>
@@ -96,6 +102,10 @@
   const confirm = useConfirm();
   const notify = useNotifier();
 
+  async function getBillOfMaterials() {
+    await api.reports.billOfMaterials();
+  }
+
   async function ensureAssetIDs() {
     const { isCanceled } = await confirm.open(
       "Are you sure you want to ensure all assets have an ID? This can take a while and cannot be undone."