82 lines
2.1 KiB
Vue
82 lines
2.1 KiB
Vue
<script setup>
|
|
const props = defineProps({
|
|
variant: Object,
|
|
});
|
|
|
|
const { $empty, $insertapi } = useNuxtApp();
|
|
const emit = defineEmits(["created"]);
|
|
const isLoading = ref(false);
|
|
const body = ref({
|
|
imei: null,
|
|
variant: props.variant.id,
|
|
});
|
|
|
|
async function submit() {
|
|
isLoading.value = true;
|
|
const res = await $insertapi("IMEI", body.value);
|
|
isLoading.value = false;
|
|
if (res !== "error") {
|
|
emit("created");
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<form class="fixed-grid has-12-cols">
|
|
<div class="grid">
|
|
<div class="cell is-col-span-4">
|
|
<div class="field">
|
|
<label class="label">Variant</label>
|
|
<SearchBox
|
|
v-bind="{
|
|
api: 'Product_Variant',
|
|
field: 'code',
|
|
column: ['code'],
|
|
optionid: variant.id,
|
|
disabled: true,
|
|
first: true,
|
|
placeholder: 'Variant',
|
|
}"
|
|
@option="body.variant = $event?.id ?? $event"
|
|
/>
|
|
</div>
|
|
</div>
|
|
<div class="cell is-col-span-6">
|
|
<div class="field">
|
|
<label class="label">IMEI</label>
|
|
<div class="control">
|
|
<input
|
|
v-model.trim="body.imei"
|
|
type="text"
|
|
class="input"
|
|
placeholder="IMEI"
|
|
maxlength="15"
|
|
/>
|
|
</div>
|
|
<p class="help is-info">15 chữ số</p>
|
|
</div>
|
|
</div>
|
|
<div class="cell is-col-span-2">
|
|
<div class="field">
|
|
<div class="control">
|
|
<label class="label is-invisible">Submit</label>
|
|
<button
|
|
:class="['button is-primary is-fullwidth', isLoading && 'is-loading']"
|
|
:disabled="$empty(body.imei) || body.imei.length !== 15"
|
|
@click.prevent="submit"
|
|
>
|
|
<span class="icon">
|
|
<Icon
|
|
name="material-symbols:add-rounded"
|
|
:size="18"
|
|
/>
|
|
</span>
|
|
<span>Thêm</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</template>
|