получение контактов с бекенда

client/src/services/app.js

@@ -5,6 +5,8 @@ import { REST, RESTError } from './rest';
 // console.log(settings);
 
 export default class extends REST {
+  // export default class Django extends REST {
+
   static get settings() {
     return settings;
   }
@@ -237,4 +239,16 @@ export default class extends REST {
         );
       });
   }
+
+  static getSupportInfo() {
+    return this._get('radio/support_info', {}, {})
+      .then((data) => {
+        return data;
+      })
+      .catch((error) => {
+        throw new RESTError(error, 'Ошибка при получении контактов');
+      });
+  }
 }
+
+// window.django = Django;

client/src/views/contacts.vue

@@ -8,24 +8,35 @@
     />
     <h1 class="h2">Контакты</h1>
     <div class="contacts__content">
-      <div class="contacts__info">
+      <div v-if="contacts" class="contacts__info">
-        <div class="text contacts__item">
+        <div v-if="phone" class="text contacts__item">
           <span class="title">Телефон</span>
-          +7 (900) 000-00-00
+          {{ phone }}
         </div>
         <div class="text contacts__item">
           <span class="title">Почта</span>
-          it-radio@info.org
+          {{ email }}
         </div>
         <div class="text contacts__item">
           <span class="title">Адрес</span>
-          г. Челябинск, Адрес
+          {{ address }}
         </div>
-        <div class="text contacts__item">
+        <div
+          v-if="contacts.telegram_url || contacts.vk_url"
+          class="text contacts__item"
+        >
           <span class="title">Соц. сети</span>
           <div class="contacts__social">
-            <div class="contacts__social m--telegram"></div>
+            <a
-            <div class="contacts__social m--vk"></div>
+              v-if="contacts.telegram_url"
+              :href="contacts.telegram_url"
+              class="contacts__social m--telegram"
+            ></a>
+            <a
+              v-if="contacts.vk_url"
+              :href="contacts.vk_url"
+              class="contacts__social m--vk"
+            ></a>
           </div>
         </div>
       </div>
@@ -79,6 +90,7 @@
 <script>
 import AppBreadcrumbs from '@/components/app-breadcrumbs.vue';
 import SupportBlock from '@/components/support-block.vue';
+import { app } from '@/services';
 
 export default {
   name: 'contacts',
@@ -122,8 +134,40 @@ export default {
         },
       ],
       showLoaderSending: false,
+      contacts: null,
     };
   },
+  computed: {
+    email() {
+      return this.contacts.email;
+    },
+    address() {
+      // const adressParts = [];
+      // if (this.contacts.city) {
+      //   adressParts.push(`г. ${this.contacts.city}`);
+      // }
+      // if (this.contacts.street) {
+      //   adressParts.push(`ул. ${this.contacts.street}`);
+      // }
+      // if (this.contacts.house) {
+      //   adressParts.push(`д. ${this.contacts.house}`);
+      // }
+      // return adressParts.join(', ');
+      if (!this.contacts.city) false;
+      return `г. ${this.contacts.city}, ул. ${this.contacts.street}, д. ${this.contacts.house}`;
+    },
+    phone() {
+      return this.contacts?.phone;
+    },
+  },
+  created() {
+    console.log(this.contacts?.phone);
+    app.getSupportInfo().then((responce) => {
+      console.log(responce);
+      this.contacts = { ...responce };
+      console.log(this.contacts);
+    });
+  },
   methods: {
     submitHandler() {},
   },