fix: AppButton import in owner panel and service-pricing types

src/views/app/AppOwnerView.vue

@@ -262,33 +262,17 @@
                   class="flex flex-wrap items-center gap-2"
                 >
                   <span class="font-medium text-text">{{ cls.title }}:</span>
-                  <span>
-                    {{
-                      getClassPriceForService(svc, cls.id)
-                        ? `${formatPriceToman(getClassPriceForService(svc, cls.id)!.price)} تومان`
-                        : '—'
-                    }}
-                  </span>
-                  <span v-if="getClassPriceForService(svc, cls.id)">·</span>
-                  <span v-if="getClassPriceForService(svc, cls.id)">
-                    {{
-                      formatDuration(
-                        getClassPriceForService(svc, cls.id)!.durationMinutes,
-                        svc.durationMinutes ?? svc.serviceTemplate?.defaultDurationMinutes,
-                      )
-                    }}
-                  </span>
+                  <span>{{ servicePriceLabel(svc, true, serviceClasses, cls.id) }}</span>
+                  <template v-if="getClassPriceForService(svc, cls.id)">
+                    <span>·</span>
+                    <span>{{ serviceDurationLabel(svc, true, serviceClasses, cls.id) }}</span>
+                  </template>
                 </div>
               </template>
               <div v-else class="flex flex-wrap items-center gap-2">
                 <span>{{ formatPriceToman(svc.price) }} تومان</span>
                 <span>·</span>
-                <span>{{
-                  formatDuration(
-                    svc.durationMinutes,
-                    svc.serviceTemplate?.defaultDurationMinutes,
-                  )
-                }}</span>
+                <span>{{ serviceDurationLabel(svc, false, serviceClasses) }}</span>
               </div>
             </div>
           </li>
@@ -463,13 +447,13 @@ import BusinessAvailabilityEditor from '@/components/owner/BusinessAvailabilityE
 import ServiceClassManager from '@/components/owner/ServiceClassManager.vue';
 import FormPageSkeleton from '@/components/ui/FormPageSkeleton.vue';
 import ListCardSkeleton from '@/components/ui/ListCardSkeleton.vue';
+import AppButton from '@/components/ui/AppButton.vue';
 import AppIcon from '@/components/ui/AppIcon.vue';
 import AppIconButton from '@/components/ui/AppIconButton.vue';
 import AppInput from '@/components/ui/AppInput.vue';
 import PriceInput from '@/components/ui/PriceInput.vue';
 import WebAppLayout from '@/layouts/WebAppLayout.vue';
 import {
-  formatDuration,
   formatPriceInputDisplay,
   formatPriceToman,
   parseOptionalMinutes,
@@ -478,6 +462,8 @@ import {
 import {
   activeServiceClasses,
   getClassPriceForService,
+  serviceDurationLabel,
+  servicePriceLabel,
 } from '@/utils/service-pricing';
 
 const business = ref<Business | null>(null);