mirror of
https://github.com/mealie-recipes/mealie.git
synced 2025-11-03 19:18:22 -05:00
fcc5d99d40
* add vitest * initialize lib w/ tests * move to dev dep * run tests in CI * update file names * move api folder to lib * move api and api types to same folder * update generator outpath * rm husky * i guess i _did_ need those types * reorg types * extract validators into testable components * (WIP) start composable testing * fix import type * fix linter complaint * simplify icon type def * fix linter errors (maybe?) * rename client file for sorting
62 lines
1.5 KiB
Vue
62 lines
1.5 KiB
Vue
<template>
|
|
<v-data-table
|
|
item-key="id"
|
|
:headers="headers"
|
|
:items="exports"
|
|
:items-per-page="15"
|
|
class="elevation-0"
|
|
@click:row="downloadData"
|
|
>
|
|
<template #item.expires="{ item }">
|
|
{{ getTimeToExpire(item.expires) }}
|
|
</template>
|
|
<template #item.actions="{ item }">
|
|
<BaseButton download small :download-url="`/api/recipes/bulk-actions/export/download?path=${item.path}`">
|
|
</BaseButton>
|
|
</template>
|
|
</v-data-table>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import { defineComponent, useContext } from "@nuxtjs/composition-api";
|
|
import { parseISO, formatDistanceToNow } from "date-fns";
|
|
import { GroupDataExport } from "~/lib/api/types/group";
|
|
export default defineComponent({
|
|
props: {
|
|
exports: {
|
|
type: Array as () => GroupDataExport[],
|
|
required: true,
|
|
},
|
|
},
|
|
setup() {
|
|
const { i18n } = useContext();
|
|
|
|
const headers = [
|
|
{ text: i18n.t("export.export"), value: "name" },
|
|
{ text: i18n.t("export.file-name"), value: "filename" },
|
|
{ text: i18n.t("export.size"), value: "size" },
|
|
{ text: i18n.t("export.link-expires"), value: "expires" },
|
|
{ text: "", value: "actions" },
|
|
];
|
|
|
|
function getTimeToExpire(timeString: string) {
|
|
const expiresAt = parseISO(timeString);
|
|
|
|
return formatDistanceToNow(expiresAt, {
|
|
addSuffix: false,
|
|
});
|
|
}
|
|
|
|
function downloadData(_: any) {
|
|
console.log("Downloading data...");
|
|
}
|
|
|
|
return {
|
|
downloadData,
|
|
headers,
|
|
getTimeToExpire,
|
|
};
|
|
},
|
|
});
|
|
</script>
|