added pdf in withdraw and deposit and fix bug

src/pages/menuPages/configuration/ZaarboxPriceKeyField.vue

@@ -0,0 +1,76 @@
+<template>
+  <a-select
+    :value="modelValue || undefined"
+    :disabled="disabled"
+    :loading="loading"
+    allow-clear
+    show-search
+    placeholder="انتخاب محصول زرباکس"
+    class="w-full"
+    option-filter-prop="label"
+    @update:value="onSelectChange"
+  >
+    <a-select-option
+      v-for="item in allOptions"
+      :key="item.key"
+      :value="item.key"
+      :label="`${item.name} ${item.key}`"
+    >
+      <div class="leading-snug">
+        <div>{{ item.name }}</div>
+        <div class="text-xs text-gray-400 direction-ltr text-right">{{ item.key }}</div>
+      </div>
+    </a-select-option>
+  </a-select>
+</template>
+
+<script setup lang="ts">
+import { computed, onMounted, ref } from 'vue'
+import { getZaarboxProducts, type ZaarboxProductOption } from '@/api/price'
+
+const props = withDefaults(
+  defineProps<{
+    modelValue: string
+    disabled?: boolean
+  }>(),
+  { disabled: false }
+)
+
+const emit = defineEmits<{ 'update:value': [value: string] }>()
+
+const loading = ref(false)
+const options = ref<ZaarboxProductOption[]>([])
+
+const allOptions = computed(() => {
+  const current = (props.modelValue ?? '').trim()
+  if (!current || options.value.some((item) => item.key === current)) {
+    return options.value
+  }
+
+  return [
+    { key: current, name: current, id: '', category: '', active: true },
+    ...options.value,
+  ]
+})
+
+onMounted(() => {
+  void loadOptions()
+})
+
+async function loadOptions() {
+  loading.value = true
+  try {
+    const response = await getZaarboxProducts()
+    options.value = response?.data?.items ?? []
+  } catch (e) {
+    console.error(e)
+    options.value = []
+  } finally {
+    loading.value = false
+  }
+}
+
+function onSelectChange(val: string | undefined) {
+  emit('update:value', val ?? '')
+}
+</script>