117 lines
2.9 KiB
Vue
117 lines
2.9 KiB
Vue
<script setup lang="ts">
|
|
import { ref, watch } from "vue";
|
|
import { QForm, useQuasar } from "quasar";
|
|
|
|
/** impotrComponents */
|
|
import DialogHeader from "@/components/DialogHeader.vue";
|
|
|
|
/** impotrStores */
|
|
import { useCounterMixin } from "@/stores/mixin";
|
|
|
|
const mixin = useCounterMixin();
|
|
const { dialogConfirm } = mixin;
|
|
|
|
const $q = useQuasar();
|
|
|
|
const title = ref<string>("");
|
|
const amount = ref<number>();
|
|
|
|
const props = defineProps({
|
|
modal: Boolean,
|
|
save: {
|
|
type: Function,
|
|
default: () => console.log("not function"),
|
|
},
|
|
close: {
|
|
type: Function,
|
|
default: () => console.log("not function"),
|
|
},
|
|
insigniadata: {
|
|
type: Object,
|
|
default: [],
|
|
},
|
|
actionType: {
|
|
type: String,
|
|
},
|
|
});
|
|
|
|
/** function closePopup*/
|
|
function closeModal() {
|
|
props.close();
|
|
}
|
|
|
|
/** function ยืนยันการบันทึก*/
|
|
const clickSave = () => {
|
|
dialogConfirm($q, () => {
|
|
if (props.actionType === "insignia") {
|
|
props.save(
|
|
props.insigniadata.id,
|
|
props.insigniadata.insigniaId,
|
|
amount.value,
|
|
props.insigniadata.year
|
|
);
|
|
} else {
|
|
props.save(props.insigniadata.id, amount.value);
|
|
}
|
|
});
|
|
};
|
|
|
|
watch(props, () => {
|
|
if (props.modal === true) {
|
|
amount.value = props.insigniadata.total;
|
|
if (props.actionType === "insignia") {
|
|
title.value = props.insigniadata.insignia;
|
|
} else title.value = props.insigniadata.organization;
|
|
}
|
|
});
|
|
</script>
|
|
<template>
|
|
<q-dialog v-model="props.modal" persistent>
|
|
<q-card style="width: 800px">
|
|
<DialogHeader tittle="แก้ไขการจัดสรรเครื่องราชฯ" :close="closeModal" />
|
|
<q-separator />
|
|
|
|
<q-form ref="myForm">
|
|
<div class="q-pa-md bg-grey-1">
|
|
<div
|
|
class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"
|
|
>
|
|
<div class="col-xs-12 col-sm-6">
|
|
<q-input
|
|
hide-bottom-space
|
|
outlined
|
|
class="inputgreen"
|
|
v-model="title"
|
|
dense
|
|
lazy-rules
|
|
type="text"
|
|
label="เครื่องราชฯ"
|
|
disable
|
|
/>
|
|
</div>
|
|
<div class="col-xs-12 col-sm-6">
|
|
<q-input
|
|
hide-bottom-space
|
|
outlined
|
|
class="inputgreen"
|
|
v-model="amount"
|
|
dense
|
|
lazy-rules
|
|
type="number"
|
|
label="จำนวน"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</q-form>
|
|
<q-separator />
|
|
<div class="row justify-end q-py-sm">
|
|
<div class="q-px-md">
|
|
<q-btn label="บันทึก" @click="clickSave" color="public" />
|
|
</div>
|
|
</div>
|
|
</q-card>
|
|
</q-dialog>
|
|
</template>
|
|
|
|
<style lang="scss" scoped></style>
|