From d42e21bae779386546fb617c75b67fe410ac67bd Mon Sep 17 00:00:00 2001
From: nquidox <nquidox@gmail.com>
Date: Sat, 6 Dec 2025 19:13:22 +0300
Subject: [PATCH 1/3] factor out origins colors

---
 src/components/ChartBlock.vue |  6 +--
 src/services/colors.js        |  4 ++
 src/views/ZeroPricesView.vue  | 77 +++++++----------------------------
 3 files changed, 19 insertions(+), 68 deletions(-)
 create mode 100644 src/services/colors.js

diff --git a/src/components/ChartBlock.vue b/src/components/ChartBlock.vue
index 96a5243..11bd874 100644
--- a/src/components/ChartBlock.vue
+++ b/src/components/ChartBlock.vue
@@ -13,6 +13,7 @@ import {
 } from 'chart.js'
 import { Line } from 'vue-chartjs'
 import 'chartjs-adapter-date-fns'
+import { originColors } from '@/services/colors.js'
 
 ChartJS.register(
   Title,
@@ -33,11 +34,6 @@ const props = defineProps({
   },
 })
 
-const originColors = {
-  surugaya: '#2d3081',
-  mandarake: '#924646',
-}
-
 const chartData = ref({
   datasets: [],
 })
diff --git a/src/services/colors.js b/src/services/colors.js
new file mode 100644
index 0000000..c337f2a
--- /dev/null
+++ b/src/services/colors.js
@@ -0,0 +1,4 @@
+export const originColors = {
+  surugaya: '#2d3081',
+  mandarake: '#924646',
+};
diff --git a/src/views/ZeroPricesView.vue b/src/views/ZeroPricesView.vue
index 6e5820e..82d41a5 100644
--- a/src/views/ZeroPricesView.vue
+++ b/src/views/ZeroPricesView.vue
@@ -1,69 +1,20 @@
 <script setup>
-import { onMounted, ref } from 'vue'
-import { useZeroPrices } from '@/api/zeroPrices.js'
-import ZeroPriceCard from '@/views/ZeroPricesView/ZeroPriceCard.vue'
-import ZeroPricesToolbar from '@/views/ZeroPricesView/ZeroPricesToolbar.vue'
-
-const { getZeroPrices } = useZeroPrices()
-
-const zeroPrices = ref([])
-const toDelete = ref([])
-
-const handleToggle = ({ id, merch_uuid, checked }) => {
-  if (checked) {
-    toDelete.value.push({ id, merch_uuid });
-  } else {
-    toDelete.value = toDelete.value.filter(item => item.id !== id);
-  }
-}
-
-const handleSelectAll = () => {
-  toDelete.value = zeroPrices.value.map(item => ({
-    id: item.id,
-    merch_uuid: item.merch_uuid
-  }))
-}
-
-const fetchZeroPrices = async () => {
-  try {
-    const response = await getZeroPrices()
-    zeroPrices.value = Array.isArray(response.data) ? response.data : []
-  } catch (error) {
-    console.error(error)
-  }
-}
-
-const handleDeleted = () => {
-  toDelete.value = []
-  fetchZeroPrices()
-}
-
-onMounted(() => {
-  fetchZeroPrices()
-})
+  import ScrollToTopButton from '@/components/ScrollToTopButton.vue'
+  import TargetZeroesTab from '@/views/ZeroPricesView/TargetZeroesTab.vue'
+  import PeriodSelectTab from '@/views/ZeroPricesView/PeriodSelectTab.vue'
 </script>
 
 <template>
-  <div v-if="zeroPrices.length === 0">
-    <n-h2 class="text-center">Zero prices</n-h2>
-    <n-h3 class="text-center">No data</n-h3>
-  </div>
-  <div v-else>
-    <div class="sticky-search-container">
-      <ZeroPricesToolbar
-        :selected="toDelete"
-        @deleted="handleDeleted"
-        @selectAll="handleSelectAll"
-      />
-    </div>
-    <div v-for="item in zeroPrices" :key="item.created_at">
-      <ZeroPriceCard
-        :zero-price="item"
-        @toggle="handleToggle"
-        :checked="toDelete.some(t => t.id === item.id)"
-      />
-    </div>
-  </div>
+  <n-tabs type="line" animated>
+    <n-tab-pane name="Target zeroes" tab="Target zeroes">
+      <TargetZeroesTab />
+    </n-tab-pane>
+    <n-tab-pane name="Period select" tab="Period select">
+      <PeriodSelectTab />
+    </n-tab-pane>
+  </n-tabs>
+  <ScrollToTopButton />
 </template>
 
-<style scoped></style>
+<style scoped>
+</style>

From 5639f8031c7a081084756a88034e84239ce8bd23 Mon Sep 17 00:00:00 2001
From: nquidox <nquidox@gmail.com>
Date: Sat, 6 Dec 2025 19:13:48 +0300
Subject: [PATCH 2/3] zero prices period select + delete, tabs refactor

---
 src/api/zeroPrices.js                        | 15 ++++-
 src/views/ZeroPricesView/PeriodSelectTab.vue | 54 +++++++++++++++
 src/views/ZeroPricesView/TargetZeroesTab.vue | 71 ++++++++++++++++++++
 src/views/ZeroPricesView/ZeroPriceCard.vue   | 21 +++++-
 4 files changed, 159 insertions(+), 2 deletions(-)
 create mode 100644 src/views/ZeroPricesView/PeriodSelectTab.vue
 create mode 100644 src/views/ZeroPricesView/TargetZeroesTab.vue

diff --git a/src/api/zeroPrices.js b/src/api/zeroPrices.js
index c69efd1..a7db41a 100644
--- a/src/api/zeroPrices.js
+++ b/src/api/zeroPrices.js
@@ -15,13 +15,26 @@ export const useZeroPrices = () => {
       await apiClient.delete('/merch/zeroprices', list)
     }
     catch (error) {
-      console.log('Delete zero prices error: ', error)
+      console.log('Delete target zero prices error: ', error)
       throw error
     }
   }
 
+  const deleteZeroPricesPeriod = async (start, end) => {
+    const params = new URLSearchParams({ start, end }).toString()
+    const url = `/merch/zeroprices/period${params ? `?${params}` : ''}`
+    const response = await apiClient.delete(url)
+
+    if (response.status === 200) {
+      return response
+    } else {
+      console.log('Delete period select zero prices error: ', response)
+    }
+  }
+
   return {
     getZeroPrices,
     deleteZeroPrices,
+    deleteZeroPricesPeriod,
   }
 }
diff --git a/src/views/ZeroPricesView/PeriodSelectTab.vue b/src/views/ZeroPricesView/PeriodSelectTab.vue
new file mode 100644
index 0000000..4239f15
--- /dev/null
+++ b/src/views/ZeroPricesView/PeriodSelectTab.vue
@@ -0,0 +1,54 @@
+<script setup>
+import { ref, onMounted, computed } from 'vue'
+import { useZeroPrices } from '@/api/zeroPrices.js'
+
+const range = ref(null)
+
+const setTodayRange = () => {
+  const now = new Date()
+  const start = new Date(now.getFullYear(), now.getMonth(), now.getDate())
+  const end = new Date(start.getTime() + 24 * 60 * 60 * 1000)
+
+  range.value = [start.getTime(), end.getTime()]
+}
+
+onMounted(() => {
+  setTodayRange()
+})
+
+const toRFCtime = (timestamp) => {
+  return new Date(timestamp).toISOString()
+}
+
+const { deleteZeroPricesPeriod } = useZeroPrices()
+
+const deleteEnabled = computed(() => {
+  return range.value === null
+})
+
+const deletePeriod = async () => {
+  if (range.value !== null) {
+    const start = toRFCtime(range.value[0])
+    const end = toRFCtime(range.value[1])
+    await deleteZeroPricesPeriod(start, end)
+  } else {
+    console.log('Delete period select zero prices error')
+  }
+}
+
+
+</script>
+
+<template>
+  <n-date-picker
+    v-model:value="range"
+    type="datetimerange"
+    format="HH:mm:ss dd-MM-yyyy"
+    clearable
+  />
+  <div class="button-container-center">
+    <n-button class="center-button w360" type="error" :disabled="deleteEnabled" @click="deletePeriod">Delete</n-button>
+  </div>
+</template>
+
+<style scoped></style>
diff --git a/src/views/ZeroPricesView/TargetZeroesTab.vue b/src/views/ZeroPricesView/TargetZeroesTab.vue
new file mode 100644
index 0000000..ba71ba5
--- /dev/null
+++ b/src/views/ZeroPricesView/TargetZeroesTab.vue
@@ -0,0 +1,71 @@
+<script setup>
+import { onMounted, ref } from 'vue'
+import { useZeroPrices } from '@/api/zeroPrices.js'
+import ZeroPriceCard from '@/views/ZeroPricesView/ZeroPriceCard.vue'
+import ZeroPricesToolbar from '@/views/ZeroPricesView/ZeroPricesToolbar.vue'
+
+const { getZeroPrices } = useZeroPrices()
+
+const zeroPrices = ref([])
+const toDelete = ref([])
+
+const handleToggle = ({ id, merch_uuid, checked }) => {
+  if (checked) {
+    toDelete.value.push({ id, merch_uuid });
+  } else {
+    toDelete.value = toDelete.value.filter(item => item.id !== id);
+  }
+}
+
+const handleSelectAll = () => {
+  toDelete.value = zeroPrices.value.map(item => ({
+    id: item.id,
+    merch_uuid: item.merch_uuid
+  }))
+}
+
+const fetchZeroPrices = async () => {
+  try {
+    const response = await getZeroPrices()
+    zeroPrices.value = Array.isArray(response.data) ? response.data : []
+  } catch (error) {
+    console.error(error)
+  }
+}
+
+const handleDeleted = () => {
+  toDelete.value = []
+  fetchZeroPrices()
+}
+
+onMounted(() => {
+  fetchZeroPrices()
+})
+</script>
+
+<template>
+  <div v-if="zeroPrices.length === 0">
+    <n-h2 class="text-center">Zero prices</n-h2>
+    <n-h3 class="text-center">No data</n-h3>
+  </div>
+  <div v-else>
+    <div class="sticky-search-container">
+      <ZeroPricesToolbar
+        :selected="toDelete"
+        @deleted="handleDeleted"
+        @selectAll="handleSelectAll"
+      />
+    </div>
+    <div v-for="item in zeroPrices" :key="item.created_at">
+      <ZeroPriceCard
+        :zero-price="item"
+        @toggle="handleToggle"
+        :checked="toDelete.some(t => t.id === item.id)"
+      />
+    </div>
+  </div>
+</template>
+
+<style scoped>
+
+</style>
diff --git a/src/views/ZeroPricesView/ZeroPriceCard.vue b/src/views/ZeroPricesView/ZeroPriceCard.vue
index 44236ee..32bd31f 100644
--- a/src/views/ZeroPricesView/ZeroPriceCard.vue
+++ b/src/views/ZeroPricesView/ZeroPriceCard.vue
@@ -1,4 +1,7 @@
 <script setup>
+import { computed } from 'vue'
+import { originColors } from '@/services/colors.js'
+
 const props = defineProps({
   zeroPrice: {
     type: Object,
@@ -19,6 +22,10 @@ const handleCheckboxChange = (newValue) => {
     checked: newValue,
   })
 }
+
+const currentOriginColor = computed(() => {
+  return originColors[props.zeroPrice.origin] || '#fff';
+});
 </script>
 
 <template>
@@ -31,7 +38,12 @@ const handleCheckboxChange = (newValue) => {
       </n-gi>
       <n-gi><strong>Name:</strong> {{ props.zeroPrice.name }}</n-gi>
       <n-gi><strong>Created:</strong> {{ props.zeroPrice.created_at }}</n-gi>
-      <n-gi><strong>Origin:</strong> {{ props.zeroPrice.origin }}</n-gi>
+      <n-gi
+        ><strong>Origin:</strong>
+        <span class="bordered" :style="{ borderColor: currentOriginColor }">
+          {{ props.zeroPrice.origin }}
+        </span>
+      </n-gi>
     </n-grid>
   </div>
 </template>
@@ -49,4 +61,11 @@ const handleCheckboxChange = (newValue) => {
   gap: 12px;
   border: 1px solid #e0e0e0;
 }
+
+.bordered {
+  border: 1px solid;
+  border-radius: 4px;
+  padding: 2px;
+  margin: 3px;
+}
 </style>

From 2e9d1d33b7008637d1ba471de93ec8a19918eb58 Mon Sep 17 00:00:00 2001
From: nquidox <nquidox@gmail.com>
Date: Mon, 15 Dec 2025 21:03:27 +0300
Subject: [PATCH 3/3] origin added + refactor

---
 src/components/CopyToClipboard.vue    |  2 +-
 src/main.js                           |  1 +
 src/services/colors.js                |  1 +
 src/views/ChartsView.vue              |  2 +-
 src/views/DetailsView.vue             | 88 ++-------------------------
 src/views/DetailsView/EditLink.vue    | 17 +++++-
 src/views/DetailsView/OriginBlock.vue | 62 +++++++++++++++++++
 7 files changed, 86 insertions(+), 87 deletions(-)
 create mode 100644 src/views/DetailsView/OriginBlock.vue

diff --git a/src/components/CopyToClipboard.vue b/src/components/CopyToClipboard.vue
index 0100e5f..c8cebd7 100644
--- a/src/components/CopyToClipboard.vue
+++ b/src/components/CopyToClipboard.vue
@@ -6,7 +6,7 @@ const message = useMessage()
 const props = defineProps({
   text: {
     type: String,
-    required: true,
+    default: '',
   },
 })
 
diff --git a/src/main.js b/src/main.js
index ee40f96..6561fbf 100644
--- a/src/main.js
+++ b/src/main.js
@@ -11,6 +11,7 @@ export const BASE_URL = 'https://api.nqws.ru/api/v2'
 // export const BASE_URL = 'http://localhost:9090/api/v2'
 
 export const BASE_MANDARAKE_LINK = 'https://order.mandarake.co.jp/order/listPage/list?soldOut=1&keyword='
+export const BASE_AMIAMI_LINK = 'https://slist.amiami.jp/top/search/list?s_cate_tag=1&submit_btn=&s_st_list_preorder_available=1&s_st_list_backorder_available=1&s_st_list_newitem_available=1&s_st_condition_flg=1&pagemax=60&s_keywords='
 // export const IMAGE_STORAGE_URL = 'http://localhost:9280'
 export const IMAGE_STORAGE_URL = 'https://images.nqws.ru'
 
diff --git a/src/services/colors.js b/src/services/colors.js
index c337f2a..26e0b5e 100644
--- a/src/services/colors.js
+++ b/src/services/colors.js
@@ -1,4 +1,5 @@
 export const originColors = {
   surugaya: '#2d3081',
   mandarake: '#924646',
+  amiami: '#F27024',
 };
diff --git a/src/views/ChartsView.vue b/src/views/ChartsView.vue
index d86e6d4..9eaa92c 100644
--- a/src/views/ChartsView.vue
+++ b/src/views/ChartsView.vue
@@ -33,7 +33,7 @@ const fetchPrices = async (days = 7) => {
 }
 
 onMounted(() => {
-  fetchPrices(7)
+  fetchPrices()
 })
 
 function handleSelectDays(days) {
diff --git a/src/views/DetailsView.vue b/src/views/DetailsView.vue
index 7a2e53d..5d7050b 100644
--- a/src/views/DetailsView.vue
+++ b/src/views/DetailsView.vue
@@ -5,10 +5,9 @@ import router from '@/router/index.js'
 import PeriodSelector from '@/components/PeriodSelector.vue'
 import ChartBlock from '@/components/ChartBlock.vue'
 import { useChartsApi } from '@/api/charts.js'
-import EditLink from '@/views/DetailsView/EditLink.vue'
-import CopyToClipboard from '@/components/CopyToClipboard.vue'
 import DetailsViewImages from '@/views/DetailsView/DetailsViewImages.vue'
 import AttachLabel from '@/views/DetailsView/AttachLabel.vue'
+import OriginBlock from '@/views/DetailsView/OriginBlock.vue'
 
 const { getMerchDetails, deleteMerch } = useMerchApi()
 const { getDistinctPrices } = useChartsApi()
@@ -20,11 +19,6 @@ const props = defineProps({
   },
 })
 
-const editing = ref({
-  surugaya: false,
-  mandarake: false,
-})
-
 const merchDetails = ref(null)
 const loading = ref(true)
 const error = ref(null)
@@ -35,7 +29,7 @@ const fetchMerch = async () => {
     merchDetails.value = response.data
 
     if (!response.status === 400) {
-      router.push({ name: 'collection' })
+      await router.push({ name: 'collection' })
     }
   } catch (err) {
     error.value = err.message
@@ -58,7 +52,7 @@ const confirmDelete = async () => {
     console.log(error)
   }
   showModal.value = false
-  router.push({ name: 'collection' })
+  await router.push({ name: 'collection' })
 }
 
 const prices = ref(null)
@@ -72,7 +66,7 @@ const fetchPrices = async (days = 7) => {
     const response = await getDistinctPrices(props.merch_uuid, days)
 
     if (response.status === 400) {
-      router.push({ name: 'collection' })
+      await router.push({ name: 'collection' })
       return
     }
 
@@ -84,11 +78,6 @@ const fetchPrices = async (days = 7) => {
   }
 }
 
-function handleLinkUpdate(origin, newLink) {
-  merchDetails.value[`origin_${origin}`].link = newLink
-  editing.value[origin] = false
-}
-
 function handleSelectDays(days) {
   fetchPrices(days)
 }
@@ -120,75 +109,10 @@ onMounted(() => {
       <ChartBlock :charts-data="prices" />
     </div>
 
-    <!-- Surugaya -->
-    <CopyToClipboard :text="merchDetails.origin_surugaya?.link">
-      <n-divider title-placement="left">Surugaya</n-divider>
-    </CopyToClipboard>
-    <div v-if="!editing.surugaya">
-      <template v-if="merchDetails.origin_surugaya?.link">
-        <a
-          :href="merchDetails.origin_surugaya.link"
-          target="_blank"
-          rel="noopener"
-          class="default-color"
-        >
-          {{ merchDetails.origin_surugaya.link }}
-        </a>
-        <n-button type="primary" style="margin-left: 8px" @click="editing.surugaya = true">
-          Edit link
-        </n-button>
-      </template>
-      <template v-else>
-        <span class="default-color underline link-like-text" @click="editing.surugaya = true"
-          >Add link</span
-        >
-      </template>
+    <div v-for="item in merchDetails.origins" :key="item">
+      <OriginBlock :merch_details="merchDetails" :merch_data="item" />
     </div>
 
-    <EditLink
-      v-else
-      :merch-uuid="merch_uuid"
-      origin="surugaya"
-      :name="merchDetails.name"
-      :model-value="merchDetails.origin_surugaya?.link || ''"
-      @update:model-value="handleLinkUpdate('surugaya', $event)"
-      @cancel-edit="editing.surugaya = false"
-    />
-
-    <!-- Mandarake -->
-    <CopyToClipboard :text="merchDetails.origin_mandarake?.link">
-      <n-divider title-placement="left">Mandarake</n-divider>
-    </CopyToClipboard>
-    <div v-if="!editing.mandarake">
-      <template v-if="merchDetails.origin_mandarake?.link">
-        <a
-          :href="merchDetails.origin_mandarake.link"
-          target="_blank"
-          rel="noopener"
-          class="default-color"
-        >
-          {{ merchDetails.origin_mandarake.link }}
-        </a>
-        <n-button type="primary" style="margin-left: 8px" @click="editing.mandarake = true">
-          Edit link
-        </n-button>
-      </template>
-      <template v-else>
-        <span class="default-color underline link-like-text" @click="editing.mandarake = true"
-          >Add link</span
-        >
-      </template>
-    </div>
-
-    <EditLink
-      v-else
-      :merch-uuid="merch_uuid"
-      origin="mandarake"
-      :name="merchDetails.name"
-      :model-value="merchDetails.origin_mandarake?.link || ''"
-      @update:model-value="handleLinkUpdate('mandarake', $event)"
-      @cancel-edit="editing.mandarake = false"
-    />
   </n-card>
   <div v-else>Not found</div>
 
diff --git a/src/views/DetailsView/EditLink.vue b/src/views/DetailsView/EditLink.vue
index 0053bf0..027d87e 100644
--- a/src/views/DetailsView/EditLink.vue
+++ b/src/views/DetailsView/EditLink.vue
@@ -1,7 +1,7 @@
 <script setup>
 import { ref, nextTick } from 'vue'
 import { useMerchApi } from '@/api/merch.js'
-import { BASE_MANDARAKE_LINK } from '@/main.js'
+import { BASE_AMIAMI_LINK, BASE_MANDARAKE_LINK } from '@/main.js'
 
 const { updateMerch } = useMerchApi()
 
@@ -101,18 +101,29 @@ const cancel = () => {
   emit('cancel-edit')
 }
 
-const insertAutoCompletedLink = () => {
+const insertMandarakeLink = () => {
   tempValue.value = BASE_MANDARAKE_LINK+props.name
 }
 
+const insertAmiamiLink = () => {
+  tempValue.value = BASE_AMIAMI_LINK+props.name
+}
+
 </script>
 
 <template>
   <div v-if="props.origin === 'mandarake'" class="button-container-center mb-10">
-    <n-button type="warning" class="center-button" @click="insertAutoCompletedLink"
+    <n-button type="warning" class="center-button" @click="insertMandarakeLink"
       >Insert auto-completed link</n-button
     >
   </div>
+
+  <div v-if="props.origin === 'amiami'" class="button-container-center mb-10">
+    <n-button type="warning" class="center-button" @click="insertAmiamiLink"
+    >Insert auto-completed link</n-button
+    >
+  </div>
+
   <div class="editing-area">
     <n-input
       v-model:value="tempValue"
diff --git a/src/views/DetailsView/OriginBlock.vue b/src/views/DetailsView/OriginBlock.vue
new file mode 100644
index 0000000..fabf2a6
--- /dev/null
+++ b/src/views/DetailsView/OriginBlock.vue
@@ -0,0 +1,62 @@
+<script setup>
+import { computed, ref } from 'vue'
+import CopyToClipboard from '@/components/CopyToClipboard.vue'
+import EditLink from '@/views/DetailsView/EditLink.vue'
+
+const props = defineProps({
+  merch_data: {
+    type: Object,
+    required: true,
+  },
+  merch_details: {
+    type: Object,
+    required: true,
+  }
+})
+
+const editing = ref(false)
+
+const formattedName = computed(() => {
+  const name = props.merch_data?.name
+  if (!name) return ''
+  return name.charAt(0).toUpperCase() + name.slice(1)
+})
+
+function handleLinkUpdate(origin, newLink) {
+  props.merch_data.link = newLink
+  editing.value = false
+}
+
+</script>
+
+<template>
+  <CopyToClipboard :text="merch_data.link">
+    <n-divider title-placement="left">{{ formattedName }}</n-divider>
+  </CopyToClipboard>
+  <div v-if="!editing">
+    <template v-if="merch_data.link">
+      <a :href="merch_data.link" target="_blank" rel="noopener" class="default-color">
+        {{ merch_data.link }}
+      </a>
+      <n-button type="primary" style="margin-left: 8px" @click="editing = true">
+        Edit link
+      </n-button>
+    </template>
+    <template v-else>
+      <span class="default-color underline link-like-text" @click="editing = true"> Add link </span>
+    </template>
+  </div>
+
+  <EditLink
+    v-else
+    :merch-uuid="merch_details.merch_uuid"
+    :origin="merch_data.name"
+    :name="merch_details.name"
+    :model-value="merch_data.link"
+    @update:model-value="handleLinkUpdate(merch_data.name, $event)"
+    @cancel-edit="editing=false"
+  />
+
+</template>
+
+<style scoped></style>