modified: frontend/src/pages/Databases.tsx

modified: frontend/src/pages/Settings.tsx
2025-10-07 19:59:48 +03:00
parent 713e9ba7f7
commit 65e4f5b423
2 changed files with 211 additions and 101 deletions
--- a/frontend/src/pages/Databases.tsx
+++ b/frontend/src/pages/Databases.tsx
@@ -274,12 +274,17 @@ function DatabaseModal({
            <label className="block text-sm font-medium text-gray-700 mb-1">Тип</label>
            <select
              value={formData.type}
-              onChange={(e) => setFormData({ ...formData, type: e.target.value })}
+              onChange={(e) => {
+                console.log('🔄 Database type changed to:', e.target.value);
+                setFormData({ ...formData, type: e.target.value });
+              }}
              className="input w-full"
            >
              <option value="postgresql">PostgreSQL</option>
              <option value="aql">AQL (HTTP API)</option>
            </select>
+            {/* DEBUG: AQL option should be visible above */}
+            <div className="text-xs text-gray-500 mt-1">Available types: PostgreSQL, AQL (HTTP API)</div>
          </div>

          {formData.type === 'aql' ? (
--- a/frontend/src/pages/Settings.tsx
+++ b/frontend/src/pages/Settings.tsx
@@ -351,10 +351,20 @@ function DatabasesSubTab() {
                      )}
                    </div>
                    <div className="grid grid-cols-2 gap-x-4 gap-y-1 text-sm text-gray-600 ml-8">
+                      {db.type === 'aql' ? (
+                        <>
+                          <div>Base URL: <span className="font-medium text-gray-900">{db.aql_base_url}</span></div>
+                          <div>Auth Type: <span className="font-medium text-gray-900">{db.aql_auth_type}</span></div>
+                          <div>Auth: <span className="font-medium text-gray-900">••••••••</span></div>
+                        </>
+                      ) : (
+                        <>
                          <div>Хост: <span className="font-medium text-gray-900">{db.host}:{db.port}</span></div>
                          <div>База: <span className="font-medium text-gray-900">{db.database_name}</span></div>
                          <div>Пользователь: <span className="font-medium text-gray-900">{db.username}</span></div>
                          <div>Пароль: <span className="font-medium text-gray-900">••••••••</span></div>
+                        </>
+                      )}
                    </div>
                  </div>
                  <div className="flex gap-2">
@@ -430,6 +440,11 @@ function DatabaseModal({
    password: '',
    ssl: database?.ssl || false,
    is_active: database?.is_active !== undefined ? database.is_active : true,
+    // AQL-specific fields
+    aql_base_url: database?.aql_base_url || '',
+    aql_auth_type: database?.aql_auth_type || 'basic',
+    aql_auth_value: database?.aql_auth_value || '',
+    aql_headers: database?.aql_headers || {},
  });

  const saveMutation = useMutation({
@@ -439,6 +454,10 @@ function DatabaseModal({
      if (database && !payload.password) {
        delete payload.password;
      }
+      // Для AQL: если редактируем и auth_value пустой, удаляем его
+      if (database && data.type === 'aql' && !payload.aql_auth_value) {
+        delete payload.aql_auth_value;
+      }
      return database ? dbManagementApi.update(database.id, payload) : dbManagementApi.create(payload);
    },
    onSuccess: () => {
@@ -478,7 +497,6 @@ function DatabaseModal({
            />
          </div>

-          <div className="grid grid-cols-2 gap-4">
          <div>
            <label className="block text-sm font-medium text-gray-700 mb-1">Тип</label>
            <select
@@ -487,8 +505,105 @@ function DatabaseModal({
              className="input w-full"
            >
              <option value="postgresql">PostgreSQL</option>
+              <option value="aql">AQL (HTTP API)</option>
            </select>
          </div>
+
+          {formData.type === 'aql' ? (
+            <>
+              {/* AQL Fields */}
+              <div>
+                <label className="block text-sm font-medium text-gray-700 mb-1">AQL Base URL *</label>
+                <input
+                  type="text"
+                  required
+                  value={formData.aql_base_url}
+                  onChange={(e) => setFormData({ ...formData, aql_base_url: e.target.value })}
+                  className="input w-full"
+                  placeholder="http://api.ehrdb.ncms-i.ru/api/rest/v1"
+                />
+              </div>
+
+              <div>
+                <label className="block text-sm font-medium text-gray-700 mb-1">Тип аутентификации</label>
+                <select
+                  value={formData.aql_auth_type}
+                  onChange={(e) => setFormData({ ...formData, aql_auth_type: e.target.value })}
+                  className="input w-full"
+                >
+                  <option value="basic">Basic Auth</option>
+                  <option value="bearer">Bearer Token</option>
+                  <option value="custom">Custom Header</option>
+                </select>
+              </div>
+
+              <div>
+                <label className="block text-sm font-medium text-gray-700 mb-1">
+                  {formData.aql_auth_type === 'basic' && 'Basic Auth Value (Base64)'}
+                  {formData.aql_auth_type === 'bearer' && 'Bearer Token'}
+                  {formData.aql_auth_type === 'custom' && 'Custom Authorization Value'}
+                </label>
+                <input
+                  type="password"
+                  required={!database}
+                  value={formData.aql_auth_value}
+                  onChange={(e) => setFormData({ ...formData, aql_auth_value: e.target.value })}
+                  className="input w-full"
+                  placeholder={database ? '••••••••' : 'Введите значение'}
+                />
+                {database && (
+                  <p className="text-xs text-gray-500 mt-1">Оставьте пустым, чтобы не менять</p>
+                )}
+              </div>
+
+              <div>
+                <label className="block text-sm font-medium text-gray-700 mb-1">
+                  Дополнительные заголовки (JSON)
+                  <span className="text-xs text-gray-500 ml-2">необязательно</span>
+                </label>
+                <textarea
+                  value={typeof formData.aql_headers === 'string' ? formData.aql_headers : JSON.stringify(formData.aql_headers, null, 2)}
+                  onChange={(e) => {
+                    try {
+                      const parsed = JSON.parse(e.target.value);
+                      setFormData({ ...formData, aql_headers: parsed });
+                    } catch {
+                      setFormData({ ...formData, aql_headers: e.target.value });
+                    }
+                  }}
+                  className="input w-full font-mono text-sm"
+                  rows={4}
+                  placeholder='{"x-dbrole": "KIS.EMIAS.XАПИД", "Hack-Time": "true"}'
+                />
+              </div>
+
+              <div className="flex items-center gap-4">
+                <label className="flex items-center gap-2">
+                  <input
+                    type="checkbox"
+                    checked={formData.is_active}
+                    onChange={(e) => setFormData({ ...formData, is_active: e.target.checked })}
+                    className="rounded"
+                  />
+                  <span className="text-sm text-gray-700">Активна</span>
+                </label>
+              </div>
+            </>
+          ) : (
+            <>
+              {/* PostgreSQL Fields */}
+              <div className="grid grid-cols-2 gap-4">
+                <div>
+                  <label className="block text-sm font-medium text-gray-700 mb-1">Хост</label>
+                  <input
+                    type="text"
+                    required
+                    value={formData.host}
+                    onChange={(e) => setFormData({ ...formData, host: e.target.value })}
+                    className="input w-full"
+                    placeholder="localhost"
+                  />
+                </div>
                <div>
                  <label className="block text-sm font-medium text-gray-700 mb-1">Порт</label>
                  <input
@@ -501,18 +616,6 @@ function DatabaseModal({
                </div>
              </div>

-          <div>
-            <label className="block text-sm font-medium text-gray-700 mb-1">Хост</label>
-            <input
-              type="text"
-              required
-              value={formData.host}
-              onChange={(e) => setFormData({ ...formData, host: e.target.value })}
-              className="input w-full"
-              placeholder="localhost"
-            />
-          </div>
-
              <div>
                <label className="block text-sm font-medium text-gray-700 mb-1">Имя базы данных</label>
                <input
@@ -583,6 +686,8 @@ function DatabaseModal({
                  <span className="text-sm text-gray-700">Активна</span>
                </label>
              </div>
+            </>
+          )}

          <div className="flex gap-3 pt-4 border-t border-gray-200">
            <button type="button" onClick={onClose} className="btn btn-secondary">