jws-frontend/src/components/04_product-service/PriceDataComponent.vue

<script setup lang="ts">
const serviceCharge = defineModel<number>('serviceCharge');
const agentPrice = defineModel<number>('agentPrice');
const price = defineModel<number>('price');

defineProps<{
  dense?: boolean;
  outlined?: boolean;
  readonly?: boolean;
  separator?: boolean;
  isType?: boolean;
}>();
</script>

<template>
  <div class="col-3 app-text-muted">• {{ $t('priceeInformation') }}</div>
  <div class="col-9 row q-col-gutter-md">
    <q-input
      :dense="dense"
      :outlined="!readonly"
      :readonly="readonly"
      :borderless="readonly"
      hide-bottom-space
      class="col-4"
      :label="$t('salePrice')"
      v-model="price"
    />

    <q-input
      :dense="dense"
      :outlined="!readonly"
      :readonly="readonly"
      :borderless="readonly"
      hide-bottom-space
      class="col-4"
      :label="$t('agentPrice')"
      v-model="agentPrice"
    />

    <q-input
      :dense="dense"
      :outlined="!readonly"
      :readonly="readonly"
      :borderless="readonly"
      hide-bottom-space
      class="col-4"
      :label="$t('processingPrice')"
      v-model="serviceCharge"
    />
  </div>
</template>

<style scoped></style>