jws-frontend/src/pages/08_request-list/FormIssue.vue
2024-11-26 16:19:31 +07:00

61 lines
1.4 KiB
Vue

<script setup lang="ts">
import { ref } from 'vue';
import { MainButton } from 'components/button';
import SelectInput from 'src/components/shared/SelectInput.vue';
defineProps<{
readonly?: boolean;
}>();
const templateForm = defineModel<string>();
const templateFormOption = ref<
{ label: string; labelEN: string; value: string }[]
>([]);
</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"
incremental
v-model="templateForm"
class="full-width"
:readonly
:option="templateFormOption"
:label="$t('quotation.templateForm')"
:option-label="$i18n.locale === 'eng' ? 'labelEN' : 'label'"
/>
<MainButton
outlined
icon="mdi-play-box-outline"
color="207 96% 32%"
class="full-width"
style="grid-column: span 1"
>
{{ $t('general.view', { msg: $t('general.example') }) }}
</MainButton>
<MainButton
solid
icon="mdi-pencil-outline"
color="207 96% 32%"
class="full-width"
style="grid-column: span 1"
>
{{ $t('general.designForm') }}
</MainButton>
</div>
</template>
<style scoped>
.template-container {
display: grid;
grid-template-columns: repeat(9, 1fr);
}
</style>