diff --git a/resources/js/pages/admin/master/products/form/ProductForm.vue b/resources/js/pages/admin/master/products/form/ProductForm.vue
index 1fc00b7..af3be18 100644
--- a/resources/js/pages/admin/master/products/form/ProductForm.vue
+++ b/resources/js/pages/admin/master/products/form/ProductForm.vue
@@ -16,7 +16,7 @@ import ProductVariantSection from './ProductVariantSection.vue';
 
 
 const { hasRole } = useCan();
-const showPrices = !hasRole('admin-bahan-baku');
+const showPrices = computed(() => !hasRole('admin-bahan-baku'));
 
 const props = withDefaults(
     defineProps<{
@@ -216,7 +216,7 @@ function buildFormData(): FormData {
         formData.append(`variants[${index}][stock]`, String(Number.parseInt(String(variant.stock), 10) || 0));
         formData.append(`variants[${index}][retail_stock]`, String(Number.parseInt(String(variant.retail_stock), 10) || 0));
 
-        if (variant.prices && showPrices) {
+        if (variant.prices && showPrices.value) {
             Object.entries(variant.prices as Record<string, string>).forEach(([type, value]) => {
                 formData.append(`variants[${index}][prices][${type}]`, String(Number.parseInt(value, 10) || 0));
             });
@@ -275,7 +275,7 @@ function submit() {
 
             <ProductVariantSection v-for="(variant, index) in variants" :key="variant.client_id"
                 v-show="shouldShowVariant(variant, index)" :form="form" :variant="variant" :index="index"
-                :can-remove="variants.length > 1" :has-copied-prices="!!copiedPrices"
+                :can-remove="variants.length > 1" :has-copied-prices="!!copiedPrices" :show-prices="showPrices"
                 :variant-errors="(clientId, field) => variantErrors(form, clientId, field)"
                 @remove="confirmRemoveVariant(variant.client_id)"
                 @update:name="setVariantField(variant.client_id, 'name', $event)"