rouble sign

app.vue

@@ -27,13 +27,18 @@ const reviews = (pagesData.value as ApiPagesType[]).find(el => el.slug == 'clien
 const delivery = (pagesData.value as ApiPagesType[]).find(el => el.slug == 'delivery')
 const advantages = (pagesData.value as ApiPagesType[]).find(el => el.slug == 'advantages')
 
+const roubleSign = new Intl.NumberFormat('ru-RU', {
+    style: 'currency',
+    currency: 'RUB',
+});
+
 const aboutText = computed(() => marked.parse(about?.content || ''))
 const deliveryText = computed(() => delivery?.content.split('[col]').map(el => marked.parse(el || '')))
 const advantagesText = computed(() =>
   advantages?.content.split('[col]').map(el => {
     let c = el || ''
     Object.entries(calculatorData.value || {}).map(item => {
-      c = c.replaceAll(`[${item[0]}]`, item[1])
+      c = c.replaceAll(`[${item[0]}]`, roubleSign.format(item[1]))
     })
     return marked.parse(c)
   }

components/modal.vue

@@ -4,13 +4,16 @@ const apiBase = config.public.apiBase
 
 const isModalOpen = useState('modal_open', () => false)
 const toggleModal = () => {
-    modal_phone.value = ''
+    modal_data.phone = undefined
-    modal_name.value = ''
+    modal_data.name = undefined
     isModalOpen.value = !isModalOpen.value
 }
-const modal_phone = ref()
+
-const modal_name = ref()
+const modal_data = reactive({
-const model_form = reactive({
+    phone: undefined,
+    name: undefined
+})
+const modal_form = reactive({
     disabled: true,
     errors: [],
 })
@@ -27,11 +30,11 @@ const validate = () => {
     const email_regex = /^[\w-\.]+@([\w-]+\.)+[\w-]{2,4}$/
 
     if (modal_phone.value.length < 3) {
-        model_form.disabled = true
+        modal_form.disabled = true
         return
     }
     if (phone_regexp.test(modal_phone.value) || email_regex.test(modal_phone.value)) {
-        model_form.disabled = false
+        modal_form.disabled = false
         return
     }
 }
@@ -55,10 +58,10 @@ const submit = (e: any) => {
         <div class="modal">
             <h2>Оставьте контакты для связи </h2>
             <form @submit.prevent="submit">
-                <input type="text" placeholder="Ваше имя" v-model="modal_name" @keyup="validate" />
+                <input type="text" placeholder="Ваше имя" v-model="modal_data.name" @keyup="validate" />
-                <input type="phone" placeholder="Номер телефона или e-mail" v-model="modal_phone" @keypress="validateInput" @keyup="validate" />
+                <input type="phone" placeholder="Номер телефона или e-mail" v-model="modal_data.phone" @keypress="validateInput" @keyup="validate" />
                 <div class="flex gap-4">
-                    <button class="not-prose" :disabled="model_form.disabled" type="submit">Отправить</button>
+                    <button class="not-prose" :disabled="modal_form.disabled" type="submit">Отправить</button>
                     <button class="not-prose" type="reset" @click="toggleModal">Отмена</button>
                 </div>
             </form>