Update pages.html

pages.html

@@ -429,157 +429,117 @@ z-index: 1000; /* Убедитесь, что кнопка находится п
 </script>
 
 <script>
-// Создаем новый тип компонента для формы
-// Создаем новый тип компонента для формы
-editor.Components.addType('custom-form', {
+// Создаем блок формы
+editor.Blocks.add('custom-form', {
+  label: 'Custom Form',
+  content: `
+    <div class="container">
+      <form id="contactForm">
+        <h4>КЛУБ-ПРАКТИК. 255 техник для психолога - 2024</h4>
+        <div class="form-group">
+          <label for="name">Имя</label>
+          <input type="text" id="name" required>
+        </div>
+        <div class="form-group">
+          <label for="email">Почта</label>
+          <input type="email" id="email" required>
+        </div>
+        <div class="form-group">
+          <label for="phone">Телефон</label>
+          <input type="tel" id="phone" required>
+        </div>
+        <div class="form-group">
+          <label for="options">Выберите тариф</label>
+          <select id="options" required>
+            <option value="" disabled selected>Тариф</option>
+            <option>БИЗНЕС - 69 970р.</option>
+            <option>PREMIUM - 89 970р.</option>
+            <option>VIP - 149 990р.</option>
+          </select>
+        </div>
+        <div class="form-check">
+          <input type="checkbox" id="newsletter" required>
+          <label for="newsletter">Согласие на email рассылку</label>
+        </div>
+        <div class="form-group">
+          <a href="#" id="privacyPolicyLink">Политика конфиденциальности</a>
+        </div>
+        <button type="submit" class="btn-primary">ПЕРЕЙТИ К ОПЛАТЕ</button>
+      </form>
+      <div id="privacyModal" class="modal">
+        <div class="modal-content">
+          <span class="close">&times;</span>
+        </div>  
+      </div>
+    </div>
+  `,
+});
+
+// Добавляем возможность настройки каждого элемента формы
+editor.DomComponents.addType('form-input', {
   model: {
     defaults: {
-      // HTML-код формы
-      content: `
-        <div class="container">
-          <form id="contactForm">
-            <h4>КЛУБ-ПРАКТИК. 255 техник для психолога - 2024</h4>
-            <div class="form-group">
-              <label for="name">Имя</label>
-              <input type="text" id="name" required>
-            </div>
-            <div class="form-group">
-              <label for="email">Почта</label>
-              <input type="email" id="email" required>
-            </div>
-            <div class="form-group">
-              <label for="phone">Телефон</label>
-              <input type="tel" id="phone" required>
-            </div>
-            <div class="form-group">
-              <label for="options">Выберите тариф</label>
-              <select id="options" required>
-                <option value="" disabled selected>Тариф</option>
-                <option>БИЗНЕС - 69 970р.</option>
-                <option>PREMIUM - 89 970р.</option>
-                <option>VIP - 149 990р.</option>
-              </select>
-            </div>
-            <div class="form-check">
-              <input type="checkbox" id="newsletter" required>
-              <label for="newsletter">Согласие на email рассылку</label>
-            </div>
-            <div class="form-group">
-              <a href="#" id="privacyPolicyLink">Политика конфиденциальности</a>
-            </div>
-            <button type="submit" class="btn-primary">ПЕРЕЙТИ К ОПЛАТЕ</button>
-          </form>
-          <div id="privacyModal" class="modal">
-            <div class="modal-content">
-              <span class="close">&times;</span>
-            </div>  
-          </div>
-        </div>
-      `,
-      // Скрипт для обработки отправки формы
-      script: function(props) {
-        const form = this.querySelector('#contactForm');
-        form.addEventListener('submit', function(event) {
-          event.preventDefault();
-          const data = new URLSearchParams();
-          data.append('name', document.getElementById('name').value);
-          data.append('email', document.getElementById('email').value);
-          data.append('phone', document.getElementById('phone').value);
-          data.append('options', document.getElementById('options').value);
-          data.append('newsletter', document.getElementById('newsletter').checked);
-          // Добавляем данные VK API
-          if (sid_user) {
-            data.append('vk_user_id', sid_user);
-          }
-          if (!props.submitUrl) {
-            console.error('Submit URL is not defined');
-            return;
-          }
-          console.log('Form Data:', data.toString()); // Выводим данные формы в консоль
-          console.log('Submit URL:', props.submitUrl); // Выводим URL в консоль
-          fetch(props.submitUrl + '&api=1&uid=' + sid_user, {
-            method: 'POST',
-            headers: {
-              'Content-Type': 'application/x-www-form-urlencoded'
-            },
-            body: data.toString()
-          })
-          .then(response => {
-            console.log('Ответ сервера:', response); // Проверка ответа сервера
-            if (!response.ok) {
-              throw new Error('Ошибка HTTP: ' + response.status);
-            }
-            return response.json();
-          })
-          .then(data => {
-            console.log('Данные от сервера:', data); // Вывод ответа сервера в консоль
-            if (data.redirect) {
-              window.location.href = data.redirect;
-            }
-          })
-          .catch(error => {
-            console.error('Error:', error);
-          });
-        });
-      },
-      // Свойства, которые будут передаваться в скрипт
-      'script-props': ['submitUrl'],
-      // Настройки для изменения URL отправки
       traits: [
         {
           type: 'text',
-          name: 'submitUrl',
-          label: 'Submit URL',
-          changeProp: true
-        }
-      ]
-    }
-  }
+          name: 'placeholder',
+          label: 'Placeholder',
+        },
+        {
+          type: 'checkbox',
+          name: 'required',
+          label: 'Required',
+        },
+      ],
+    },
+  },
 });
-// Создаем блок для компонента формы
-editor.Blocks.add('custom-form-block', {
-  label: 'Custom Form',
-  content: { type: 'custom-form' },
+
+editor.DomComponents.addType('form-select', {
+  model: {
+    defaults: {
+      traits: [
+        {
+          type: 'text',
+          name: 'options',
+          label: 'Options',
+        },
+        {
+          type: 'checkbox',
+          name: 'required',
+          label: 'Required',
+        },
+      ],
+    },
+  },
 });
-// Добавляем скрипты для интеграции с VK API
-editor.on('load', function() {
-  const script1 = document.createElement('script');
-  script1.src = 'https://unpkg.com/@vkontakte/vk-bridge/dist/browser.min.js';
-  document.head.appendChild(script1);
-  const script2 = document.createElement('script');
-  script2.src = 'https://vk.com/js/api/openapi.js?169';
-  document.head.appendChild(script2);
-  script2.onload = function() {
-    vkBridge.send('VKWebAppInit');
-    vkBridge.send("VKWebAppAllowMessagesFromGroup", {"group_id": 168704660, "key": "cc964fabb0e1d70924a92e4e8b513dbff7cc10a9"})
-    .then(data => {
-      console.log(data);
-      if (data.result == true) {
-        // Действия, если подписка подтверждена
-      } else {
-        window.location.href = "https://riverpsy.com/courses";
-      }
-    })
-    .catch(error => {
-      window.location.href = "https://riverpsy.com/courses";
-    });
-    vkBridge.send('VKWebAppGetUserInfo')
-    .then(data => {
-      console.log(data.id);
-      console.log(data.first_name);
-      console.log(data.last_name);
-      console.log(data);
-      sid_user = (data.id);
-      vk_ides = (data.id);
-      vk_photos1 = (data.photo_100);
-      hashs = (location.hash);
-      console.log(location.hash);
-      console.log(vk_photos1);
-    })
-    .catch(error => {
-      console.error('Error:', error);
-    });
-  };
+
+editor.DomComponents.addType('form-checkbox', {
+  model: {
+    defaults: {
+      traits: [
+        {
+          type: 'checkbox',
+          name: 'required',
+          label: 'Required',
+        },
+      ],
+    },
+  },
+});
+
+editor.DomComponents.addType('form-button', {
+  model: {
+    defaults: {
+      traits: [
+        {
+          type: 'text',
+          name: 'text',
+          label: 'Button Text',
+        },
+      ],
+    },
+  },
 });
     // Добавление кнопки для открытия редактора кода
     const pn = editor.Panels;