начало положено

src/components/Istochnik.vue

@@ -71,19 +71,22 @@
         </button>
       </div>
     </div>
+    
+    <!-- Список источников -->
     <div class="p-4">
-      <Istochnik_one_kard
-        v-for="item in items"
-        :key="item.url"
-        :url="item.url"
-        :promt="item.promt"
-      />
+      <div 
+        v-for="source in filteredSources" 
+        :key="source.url"
+        class="mb-4"
+      >
+        <Istochnik_one_kard :source="source" />
+      </div>
     </div>
   </div>
 </template>
 
 <script setup>
-import { ref, onMounted } from "vue";
+import { ref, onMounted, computed } from "vue";
 import axios from "axios";
 import Istochnik_one_kard from "./Istochnik_one_kard.vue";
 
@@ -92,7 +95,7 @@ const newSourceUrl = ref("");
 const newSourceCategory = ref("");
 const categories = ref([]);
 const poisk = ref("");
-const items = ref([]);
+const sources = ref([]);
 
 const fetchCategories = async () => {
   try {
@@ -105,6 +108,25 @@ const fetchCategories = async () => {
   }
 };
 
+const fetchSources = async () => {
+  try {
+    const data = await axios.get(
+      "https://allowlgroup.ru/api/8001/all_sources",
+    );
+    sources.value = data.data.sources || [];
+  } catch (err) {
+    console.error("Ошибка загрузки источников:", err);
+  }
+};
+
+const filteredSources = computed(() => {
+  if (!poisk.value) return sources.value;
+  return sources.value.filter(source => 
+    source.url.toLowerCase().includes(poisk.value.toLowerCase()) ||
+    source.promt.toLowerCase().includes(poisk.value.toLowerCase())
+  );
+});
+
 const addSource = async () => {
   if (!newSourceUrl.value.trim() || !newSourceCategory.value) {
     alert("Заполните все поля");
@@ -113,12 +135,12 @@ const addSource = async () => {
 
   try {
     await axios.post("https://allowlgroup.ru/api/8001/add_sources", {
-    // await axios.post("http://127.0.0.1:8001/add_sources", {
       url: newSourceUrl.value,
       promt: newSourceCategory.value,
     });
     newSourceUrl.value = "";
     newSourceCategory.value = "";
+    fetchSources(); // Обновляем список после добавления
   } catch (err) {
     console.error("Ошибка добавления источника:", err);
     alert("Ошибка при добавлении источника");
@@ -140,5 +162,6 @@ onMounted(() => {
   });
 
   fetchCategories();
+  fetchSources();
 });
-</script>
+</script>

src/components/Istochnik_one_kard.vue

@@ -1,248 +1,84 @@
-<script setup>
-import { ref, onMounted, onBeforeUnmount } from "vue";
-import axios from "axios";
-
-// Добавляем emit для уведомления родителя об изменениях
-const emit = defineEmits(["update:viewed", "update:status"]);
-
-const props = defineProps({
-  url: String,
-  parsed_at: String,
-  title: String,
-  category: String,
-  short_text: String,
-  article_date: String,
-  original_text: String,
-  translation_text: String,
-  other: String,
-  viewed: Boolean,
-  status: Boolean,
-});
-
-// Делаем viewed и status реактивными для локального обновления
-const localViewed = ref(props.viewed);
-const localStatus = ref(props.status);
-
-// Следим за изменениями props и обновляем локальные значения
-import { watch } from "vue";
-watch(
-  () => props.viewed,
-  (val) => {
-    localViewed.value = val;
-  },
-);
-watch(
-  () => props.status,
-  (val) => {
-    localStatus.value = val;
-  },
-);
-
-// Тема
-const isDarkMode = ref(document.documentElement.classList.contains("dark"));
-
-onMounted(() => {
-  isDarkMode.value = document.documentElement.classList.contains("dark");
-  const observer = new MutationObserver(() => {
-    isDarkMode.value = document.documentElement.classList.contains("dark");
-  });
-  observer.observe(document.documentElement, {
-    attributes: true,
-    attributeFilter: ["class"],
-  });
-});
-
-// Карточка
-const isOpen = ref(false);
-const cardRef = ref(null);
-
-function toggle() {
-  isOpen.value = true;
-}
-
-function handleClickOutside(event) {
-  if (cardRef.value && !cardRef.value.contains(event.target)) {
-    isOpen.value = false;
-  }
-}
-
-// Обновляем локально + отправляем emit
-const viewed_b = async () => {
-  const newValue = !localViewed.value;
-  localViewed.value = newValue; // Локальное обновление сразу
-  emit("update:viewed", { url: props.url, viewed: newValue });
-
-  try {
-    await axios.post(
-      "https://allowlgroup.ru/api/8002/update_viewed_status",
-      null,
-      { params: { url: props.url, viewed: newValue } },
-    );
-  } catch (err) {
-    console.log(err);
-    // При ошибке откатываем локальное значение
-    localViewed.value = !newValue;
-  }
-};
-
-const status_b = async () => {
-  const newValue = !localStatus.value;
-  localStatus.value = newValue; // Локальное обновление сразу
-  emit("update:status", { url: props.url, status: newValue });
-
-  try {
-    await axios.post(
-      "https://allowlgroup.ru/api/8002/update_status_status",
-      null,
-      { params: { url: props.url, status: newValue } },
-    );
-  } catch (err) {
-    console.log(err);
-    localStatus.value = !newValue;
-  }
-};
-
-const download = async () => {
-  try {
-    const rez = await axios.get(
-      "https://allowlgroup.ru/api/8001/file_download",
-      // "http://127.0.0.1:8001/file_download",
-      {
-        params: {
-          path: props.article_date.split(" ")[0],
-          title: props.title,
-        },
-        responseType: "blob",
-      },
-    );
-    const blobUrl = window.URL.createObjectURL(
-      new Blob([rez.data], {
-        type: "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
-      }),
-    );
-    const link = document.createElement("a");
-    let filename = props.title + ".docx";
-    try {
-      const disposition = rez.headers?.["content-disposition"];
-      if (disposition) {
-        const match = disposition.match(/filename\*?=([^;\n]+)/i);
-        if (match) {
-          let name = match[1];
-          // Убираем префикс utf-8'' (case insensitive)
-          const prefix = "utf-8''";
-          if (name.toLowerCase().startsWith(prefix)) {
-            name = name.substring(prefix.length);
-          }
-          // Убираем кавычки и декодируем
-          name = decodeURIComponent(name.replace(/"/g, ""));
-          if (!name.endsWith(".docx")) name += ".docx";
-          filename = name;
-        }
-      }
-    } catch (e) {
-      /* ignore */
-    }
-    link.href = blobUrl;
-    link.setAttribute("download", filename);
-    document.body.appendChild(link);
-    link.click();
-    link.remove();
-    window.URL.revokeObjectURL(blobUrl);
-  } catch (err) {
-    console.log(err);
-  }
-};
-
-onMounted(() => {
-  document.addEventListener("click", handleClickOutside);
-});
-
-onBeforeUnmount(() => {
-  document.removeEventListener("click", handleClickOutside);
-});
-</script>
-
 <template>
   <div
-    class="bg-white dark:bg-gray-800 hover:-translate-y-2 hover:shadow-2xl rounded-xl transition pb-1 mb-3"
-    :class="{ 'opacity-50': localViewed }"
+    class="flex flex-row w-full lg:w-auto gap-2 p-2 bg-gray-50 dark:bg-gray-700 rounded-xl border border-gray-200 dark:border-gray-600"
   >
-    <div ref="cardRef" class="cursor-pointer" @click="toggle">
-      <div class="flex justify-between p-3">
-        <p>{{ article_date }}</p>
-        <a
-          :href="url"
-          class="max-w-100 text-blue-600 dark:text-gray-400 hover:text-blue-800 active:text-blue-800 underline flex"
-          style="overflow: hidden; white-space: nowrap; text-overflow: ellipsis"
-        >
-          <img src="/src/assets/href.webp" class="w-5 h-6 mr-2" />
-          {{ url }}
-        </a>
-      </div>
-
-      <div class="m-3 dark:bg-gray-900 shadow rounded-xl p-3">
-        <p>{{ title }}</p>
-      </div>
-
-      <div v-show="isOpen" class="transition-all">
-        <div class="m-3 dark:bg-gray-900 shadow rounded-xl p-3">
-          <p>{{ short_text }}</p>
-        </div>
-        <div class="m-3 dark:bg-gray-900 shadow rounded-xl p-3">
-          <p>{{ translation_text }}</p>
-        </div>
-        <div class="m-3 dark:bg-gray-900 shadow rounded-xl p-3">
-          <p>{{ category }}</p>
-        </div>
-        <div class="m-3 dark:bg-gray-900 shadow rounded-xl p-3">
-          <p>{{ original_text }}</p>
-        </div>
-      </div>
-    </div>
-    <div class="flex justify-between">
-      <div class="ml-4 mb-4">
-        <button class="cursor-pointer" @click="viewed_b">
-          <img
-            v-if="localViewed"
-            src="https://img.icons8.com/?size=100&id=IJNt9jGwqy9N&format=png&color=000000"
-            class="h-12 hover:opacity-75 active:opacity-75"
-          />
-          <img
-            v-else-if="isDarkMode"
-            src="https://img.icons8.com/?size=100&id=qliQ29ghmkZh&format=png&color=000000"
-            class="h-12 hover:opacity-75 active:opacity-75"
-          />
-          <img
-            v-else
-            src="https://img.icons8.com/?size=100&id=KDfrR4UXlVPn&format=png&color=000000"
-            class="h-12 hover:opacity-75 active:opacity-75"
-          />
-        </button>
-
-        <button class="cursor-pointer" @click="status_b">
-          <img
-            v-if="localStatus"
-            src="https://img.icons8.com/?size=100&id=fiJBCEhvIMyT&format=png&color=000000"
-            class="h-12 hover:opacity-75 active:opacity-75"
-          />
-          <img
-            v-else-if="isDarkMode"
-            src="https://img.icons8.com/?size=100&id=BmD1kkH92ppy&format=png&color=000000"
-            class="h-12 hover:opacity-75 active:opacity-75"
-          />
-          <img
-            v-else
-            src="https://img.icons8.com/?size=100&id=wVQaONwgqX8h&format=png&color=000000"
-            class="h-12 hover:opacity-75 active:opacity-75"
-          />
-        </button>
-      </div>
-      <button
-        class="hover:opacity-75 active:opacity-75 mr-10 rounded-xl cursor-pointer"
-        @click="download"
-      >
-        <img src="/src/assets/word.png" class="h-10 mb-2" />
-      </button>
-    </div>
+    <input
+      v-model="displayUrl"
+      type="text"
+      placeholder="URL источника"
+      readonly
+      class="flex-1 h-12 dark:bg-gray-900 border-slate-100 shadow rounded-xl p-3 min-w-0"
+    />
+    
+    <input
+      v-model="displayPromt"
+      type="text"
+      placeholder="Промт"
+      readonly
+      class="flex-1 h-12 dark:bg-gray-900 border-slate-100 shadow rounded-xl p-3 min-w-0"
+    />
+    
+    <button
+      @click="startParsing"
+      :disabled="isLoading"
+      class="w-20 h-12 bg-green-600 text-white px-2 rounded-xl shadow hover:bg-green-700 cursor-pointer whitespace-nowrap disabled:opacity-50 disabled:cursor-not-allowed"
+    >
+      {{ isLoading ? "..." : "Start" }}
+    </button>
   </div>
 </template>
+
+<script setup>
+import { ref, computed } from "vue";
+import axios from "axios";
+
+const props = defineProps({
+  source: {
+    type: Object,
+    required: true,
+    default: () => ({ url: "", promt: "" })
+  }
+});
+
+const emit = defineEmits(["sourceStarted"]);
+
+const isLoading = ref(false);
+
+const displayUrl = computed({
+  get: () => props.source.url || "",
+  set: (val) => {
+    // Только для чтения
+  }
+});
+
+const displayPromt = computed({
+  get: () => props.source.promt || "",
+  set: (val) => {
+    // Только для чтения
+  }
+});
+
+const startParsing = async () => {
+  if (!props.source.url) {
+    alert("URL источника не указан");
+    return;
+  }
+
+  isLoading.value = true;
+  
+  try {
+    await axios.post("https://allowlgroup.ru/api/parser_all", {
+      url: props.source.url,
+      promt: props.source.promt
+    });
+    
+    emit("sourceStarted", props.source.url);
+    alert(`Парсинг для ${props.source.url} запущен`);
+  } catch (err) {
+    console.error("Ошибка запуска парсинга:", err);
+    alert("Ошибка при запуске парсинга");
+  } finally {
+    isLoading.value = false;
+  }
+};
+</script>