87 lines
2 KiB
Vue
87 lines
2 KiB
Vue
<script setup lang="ts">
|
|
import { ref } from 'vue';
|
|
import { MainButton } from 'components/button';
|
|
import SelectInput from 'src/components/shared/SelectInput.vue';
|
|
import { onMounted } from 'vue';
|
|
import { api } from 'src/boot/axios';
|
|
import { baseUrl } from 'src/stores/utils';
|
|
|
|
const prop = defineProps<{
|
|
readonly?: boolean;
|
|
requestWorkId: string;
|
|
}>();
|
|
const templateForm = defineModel<string>();
|
|
const templateFormOption = ref<
|
|
{ label: string; labelEN: string; value: string }[]
|
|
>([]);
|
|
|
|
onMounted(async () => {
|
|
const { data: docTemplate, status } = await api.get<string[]>(
|
|
'/doc-template',
|
|
{ params: { templateGroup: 'Request' } },
|
|
);
|
|
|
|
if (status < 400) {
|
|
templateFormOption.value = docTemplate.map((v) => ({
|
|
label: v,
|
|
labelEN: v,
|
|
value: v,
|
|
}));
|
|
}
|
|
});
|
|
|
|
async function formDownload() {
|
|
const res = await fetch(
|
|
baseUrl +
|
|
'/doc-template/' +
|
|
templateForm.value +
|
|
`?templateGroup=Request&data=request-work&dataId=${prop.requestWorkId}`,
|
|
);
|
|
const blob = await res.blob();
|
|
|
|
const a = document.createElement('a');
|
|
a.download = templateForm.value;
|
|
a.href = window.URL.createObjectURL(blob);
|
|
a.click();
|
|
a.remove();
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div
|
|
class="surface-1 q-pa-md"
|
|
:class="{
|
|
['template-container']: $q.screen.gt.sm,
|
|
['column']: !$q.screen.gt.sm,
|
|
}"
|
|
style="gap: var(--size-2)"
|
|
>
|
|
<SelectInput
|
|
id="quotation-branch"
|
|
style="grid-column: span 2"
|
|
v-model="templateForm"
|
|
class="full-width"
|
|
:readonly
|
|
:option="templateFormOption"
|
|
:label="$t('quotation.templateForm')"
|
|
:option-label="$i18n.locale === 'eng' ? 'labelEN' : 'label'"
|
|
/>
|
|
<MainButton
|
|
solid
|
|
icon="mdi-pencil-outline"
|
|
color="207 96% 32%"
|
|
class="full-width"
|
|
style="grid-column: span 1"
|
|
@click="formDownload"
|
|
>
|
|
{{ $t('general.designForm') }}
|
|
</MainButton>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.template-container {
|
|
display: grid;
|
|
grid-template-columns: repeat(9, 1fr);
|
|
}
|
|
</style>
|