fix bug

2026-07-12 22:24:26 +03:30
parent 4b59444e7d
commit 50f6d7f7e5
4 changed files with 229 additions and 25 deletions
@@ -0,0 +1,136 @@
+<template>
+  <div class="partner-urls-field">
+    <div
+      v-for="(row, index) in rows"
+      :key="index"
+      class="partner-urls-field__row"
+    >
+      <span class="partner-urls-field__index">{{ index + 1 }}</span>
+
+      <a-input
+        :value="row.url"
+        :disabled="disabled"
+        allow-clear
+        dir="ltr"
+        class="partner-urls-field__url"
+        :placeholder="index === 0 ? 'آدرس اصلی، مثلاً https://price.zaarbox.ir/api/free' : 'آدرس جایگزین (اختیاری)'"
+        @update:value="(val) => updateRow(index, String(val ?? ''))"
+      />
+
+      <a-button
+        type="text"
+        danger
+        :disabled="disabled || rows.length <= 1"
+        aria-label="حذف"
+        @click="removeRow(index)"
+      >
+        حذف
+      </a-button>
+    </div>
+
+    <a-button
+      v-if="rows.length < MAX"
+      type="dashed"
+      block
+      :disabled="disabled"
+      class="partner-urls-field__add"
+      @click="addRow"
+    >
+      افزودن آدرس سرور
+    </a-button>
+
+    <p class="partner-urls-field__hint">
+      اگر آدرس اول پاسخ ندهد، به‌ترتیب سراغ آدرس‌های بعدی می‌رود. حداکثر {{ MAX }} آدرس.
+    </p>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, watch } from 'vue'
+import {
+  formatPartnerServerUrls,
+  parsePartnerServerUrlsDraft,
+  PARTNER_SERVER_URLS_MAX,
+  type PartnerUrlRow,
+} from './settingTypes'
+
+const props = withDefaults(
+  defineProps<{
+    modelValue: string
+    disabled?: boolean
+  }>(),
+  { disabled: false },
+)
+
+const emit = defineEmits<{ 'update:value': [value: string] }>()
+
+const MAX = PARTNER_SERVER_URLS_MAX
+
+const rows = ref<PartnerUrlRow[]>(parsePartnerServerUrlsDraft(props.modelValue))
+let skipExternalSync = false
+
+watch(
+  () => props.modelValue,
+  (value) => {
+    if (skipExternalSync) {
+      skipExternalSync = false
+      return
+    }
+    rows.value = parsePartnerServerUrlsDraft(value)
+  },
+)
+
+function commit(nextRows: PartnerUrlRow[]) {
+  rows.value = nextRows
+  skipExternalSync = true
+  emit('update:value', formatPartnerServerUrls(nextRows))
+}
+
+function updateRow(index: number, url: string) {
+  const next = rows.value.map((row, i) => (i === index ? { ...row, url } : row))
+  commit(next)
+}
+
+function addRow() {
+  if (rows.value.length >= MAX) return
+  commit([...rows.value, { url: '' }])
+}
+
+function removeRow(index: number) {
+  const next = rows.value.filter((_, i) => i !== index)
+  commit(next.length > 0 ? next : [{ url: '' }])
+}
+</script>
+
+<style scoped>
+.partner-urls-field {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+
+.partner-urls-field__row {
+  display: grid;
+  grid-template-columns: 24px 1fr auto;
+  gap: 8px;
+  align-items: center;
+}
+
+.partner-urls-field__index {
+  text-align: center;
+  font-size: 12px;
+  color: #6b7280;
+}
+
+.partner-urls-field__hint {
+  margin: 0;
+  font-size: 12px;
+  color: #6b7280;
+}
+
+@media (max-width: 640px) {
+  .partner-urls-field__row {
+    grid-template-columns: 20px 1fr auto;
+  }
+}
+</style>