From bc63923d45aab0482adc4657648162bd4235ba8a Mon Sep 17 00:00:00 2001
From: grey-cat-1908 <grey.cat1908@gmail.com>
Date: Sat, 24 Aug 2024 16:17:25 +0300
Subject: [PATCH] answers textvalue base

---
 src/components/answers/TextValue.vue | 28 +++++++++++++++++++
 src/router/index.ts                  |  5 ++++
 src/views/form/Answers.vue           | 42 ++++++++++++++++++++++++++++
 3 files changed, 75 insertions(+)
 create mode 100644 src/components/answers/TextValue.vue
 create mode 100644 src/views/form/Answers.vue

diff --git a/src/components/answers/TextValue.vue b/src/components/answers/TextValue.vue
new file mode 100644
index 0000000..4f07f70
--- /dev/null
+++ b/src/components/answers/TextValue.vue
@@ -0,0 +1,28 @@
+<template>
+  <div class="text-question-component">
+    <input
+      type="text"
+      :value="modelValue"
+      readonly
+    />
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+
+const props = defineProps(['modelValue'])
+</script>
+
+<style scoped>
+.text-question-component {
+  display: flex;
+  flex-direction: column;
+  margin-bottom: 20px;
+}
+
+.error {
+  color: red;
+  margin-top: 5px;
+}
+</style>
diff --git a/src/router/index.ts b/src/router/index.ts
index 625e954..3c2edf8 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -17,6 +17,11 @@ const router = createRouter({
       path: '/form/view/:id',
       name: 'View Form',
       component: () => import('@/views/form/View.vue')
+    },
+    {
+      path: '/form/answers/:id',
+      name: 'Form Answers',
+      component: () => import('@/views/form/Answers.vue')
     }
   ],
   scrollBehavior(to) {
diff --git a/src/views/form/Answers.vue b/src/views/form/Answers.vue
new file mode 100644
index 0000000..abc4d00
--- /dev/null
+++ b/src/views/form/Answers.vue
@@ -0,0 +1,42 @@
+<script setup lang="ts">
+import { onMounted, ref } from 'vue'
+import { makeAPIRequest } from '@/utils/http'
+import FormNotFound from '@/components/FormNotFound.vue'
+import { useRoute } from 'vue-router'
+import TextValue from "@/components/answers/TextValue.vue";
+
+const route = useRoute()
+
+const data = ref([])
+const currentPageNumber = ref(0);
+const isAnswerNotFound = ref(true)
+const mode = ref(0);
+
+onMounted(async () => {
+  const formResponse = await makeAPIRequest('/answer/get', 'GET', { form_id: Number(route.params.id) }, {}, true)
+  if (!formResponse.json || formResponse.status !== 200) {
+    return
+  }
+  data.value = formResponse.json.answers
+  if (data.value.length > 0) {
+    isAnswerNotFound.value = false;
+  }
+})
+</script>
+
+<template>
+  <FormNotFound v-if="isAnswerNotFound" />
+  <div v-else>
+    <button @click="mode = 0">Отдельный пользователь</button>
+    <div class="" v-if="mode === 0">
+      <button @click="currentPageNumber = Math.max(0, currentPageNumber - 1)"><</button>
+      <button @click="currentPageNumber = Math.min(data.length - 1, currentPageNumber + 1)">></button>
+
+      <div class="" v-for="(value, index) in data[currentPageNumber].data.values">
+        <TextValue v-if="value.question_type === 1" v-model="value.value" />
+      </div>
+    </div>
+  </div>
+</template>
+
+<style scoped></style>