From d7e88de7070d99e6a7283e49d1ae4abc5416347a Mon Sep 17 00:00:00 2001
From: hzj <1304805162@qq.com>
Date: Thu, 27 Nov 2025 18:03:48 +0800
Subject: [PATCH] =?UTF-8?q?feat(=E5=85=85=E5=80=BC=E4=BB=A3=E7=90=86?=
 =?UTF-8?q?=E9=A1=B5):=20=E6=96=B0=E5=A2=9E=E6=AF=8F=E6=9C=88=E4=B8=80?=
 =?UTF-8?q?=E5=8F=B7=E2=80=9C=E9=80=89=E6=8B=A9=E7=94=A8=E6=88=B7=E8=BD=AC?=
 =?UTF-8?q?=E8=B4=A6=E9=87=91=E9=A2=9D=E9=99=90=E5=88=B6=E2=80=9D=E6=8C=89?=
 =?UTF-8?q?=E9=92=AE=E5=8A=9F=E8=83=BD=EF=BC=8C=E8=AE=A1=E6=97=B6=E8=AE=BE?=
 =?UTF-8?q?=E7=BD=AE=E4=B8=BA=E6=AF=8F1h=E6=A3=80=E6=9F=A5=E4=B8=80?=
 =?UTF-8?q?=E6=AC=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/RechargeAgency/index.vue | 272 ++++++++++++++++++++++++++++-
 1 file changed, 264 insertions(+), 8 deletions(-)

diff --git a/src/views/RechargeAgency/index.vue b/src/views/RechargeAgency/index.vue
index a4ba30b..f3c85ea 100644
--- a/src/views/RechargeAgency/index.vue
+++ b/src/views/RechargeAgency/index.vue
@@ -34,10 +34,16 @@
             src="../../assets/icon/identity/coinSeller.png"
             alt=""
             height="20px"
-            style="margin-left: 10px"
+            style="display: block; margin-left: 10px"
           />
         </div>
-        <img @click="goToRecords" src="../../assets/icon/records.png" height="20px" alt="" />
+        <img
+          @click="goToRecords"
+          src="../../assets/icon/records.png"
+          height="20px"
+          alt=""
+          style="display: block; object-fit: cover"
+        />
       </div>
 
       <!-- 用户信息卡片 -->
@@ -82,6 +88,55 @@
         </div>
       </div>
 
+      <!-- 设置最小接收金额 -->
+      <div
+        style="
+          background-color: white;
+          padding: 16px;
+          border-radius: 12px;
+          margin-bottom: 16px;
+          box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+
+          display: flex;
+          flex-direction: column;
+          gap: 10px;
+        "
+      >
+        <div style="display: flex; justify-content: space-between; align-items: center; gap: 4px">
+          <div style="font-weight: 600">Minimum amount of transfers accepted:</div>
+          <img
+            src="../../assets/icon/help.png"
+            height="20px"
+            alt=""
+            style="display: block; object-fit: cover"
+            @click="showHelpTip = true"
+          />
+        </div>
+        <div style="display: flex; justify-content: space-around; align-items: center; gap: 10px">
+          <div
+            v-for="amountItem in AmountList"
+            style="
+              flex: 1;
+              min-width: 0;
+              align-self: stretch;
+
+              border-radius: 12px;
+              box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.25);
+
+              padding: 10px;
+
+              display: flex;
+              justify-content: center;
+              align-items: center;
+            "
+            :style="amountStyle(amountItem)"
+            @click="selectAmount(amountItem)"
+          >
+            <div style="font-weight: 700">{{ amountItem.type }}</div>
+          </div>
+        </div>
+      </div>
+
       <!-- 用户搜索部分 -->
       <div class="user-section">
         <div style="margin-bottom: 12px; font-weight: 600; color: #333">
@@ -163,19 +218,119 @@
         </div>
       </div>
     </div>
+
+    <!-- 遮罩层 -->
+    <maskLayer :maskLayerShow="maskLayerShow" @click="closedPopup">
+      <div
+        style="
+          width: 100%;
+          height: 100%;
+          display: flex;
+          justify-content: center;
+          align-items: center;
+        "
+      >
+        <!-- 帮助提示弹窗 -->
+        <div
+          v-if="showHelpTip"
+          style="
+            width: 80%;
+            border-radius: 12px;
+            background: #fff;
+            padding: 20px;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            gap: 8px;
+          "
+          @click.stop
+        >
+          <div style="position: relative; width: 100%">
+            <div style="text-align: center; color: rgba(0, 0, 0, 0.8); font-weight: 800">
+              {{ t('tips') }}
+            </div>
+
+            <!-- 关闭按钮 -->
+            <div style="position: absolute; top: 0; right: 0" @click="closedPopup">X</div>
+          </div>
+          <div style="color: rgba(0, 0, 0, 0.5); font-weight: 600; text-align: center">
+            Recharge agents can choose the minimumamount they can accept from user transfers,which
+            can be modifed on the frst of eachmonth. (For example, if a recharge agentchanges to
+            only accept transfers of $10 or more,users with single transfers below $10 will not
+            beable to transfer funds to that recharge agent.)
+          </div>
+        </div>
+
+        <!-- 设置转账确认弹窗 -->
+        <div
+          v-if="showTransfersTip"
+          style="
+            width: 80%;
+            border-radius: 12px;
+            background: #fff;
+            padding: 20px;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            gap: 8px;
+          "
+          @click.stop
+        >
+          <div style="color: rgba(0, 0, 0, 0.8); font-weight: 800">{{ t('tips') }}</div>
+          <div style="color: rgba(0, 0, 0, 0.5); font-weight: 600; text-align: center">
+            Are you sure you want to select this transfer amount limit?
+          </div>
+          <div
+            style="width: 100%; display: flex; justify-content: space-around; align-items: center"
+          >
+            <div
+              style="
+                padding: 12px 20px;
+                border-radius: 12px;
+                border: 1px solid #e6e6e6;
+                color: rgba(0, 0, 0, 0.4);
+                font-weight: 800;
+              "
+              @click="Cancel"
+            >
+              {{ t('cancel') }}
+            </div>
+            <div
+              style="
+                padding: 12px 20px;
+                border-radius: 12px;
+                background: linear-gradient(
+                  152deg,
+                  rgba(198, 112, 255, 0.6) 7.01%,
+                  rgba(119, 38, 255, 0.6) 92.99%
+                );
+                color: rgba(255, 255, 255, 0.8);
+                font-weight: 800;
+              "
+              @click="Confirm"
+            >
+              {{ t('confirm') }}
+            </div>
+          </div>
+        </div>
+      </div>
+    </maskLayer>
   </div>
 </template>
 
 <script setup>
-import { ref, computed } from 'vue'
-import { useI18n } from 'vue-i18n'
+import { ref, computed, onMounted, onUnmounted } from 'vue'
 import { useRouter } from 'vue-router'
-import GeneralHeader from '@/components/GeneralHeader.vue'
+import { useI18n } from 'vue-i18n'
+import { setDocumentDirection } from '@/locales/i18n'
 import { getSelectedUser } from '@/utils/coinSellerStore.js'
-import { checkFreightDealer, getFreightBalance, freightRecharge } from '@/api/wallet.js'
 import { showError, showSuccess } from '@/utils/toast.js'
 import { usePageInitializationWithConfig } from '@/utils/pageConfig.js'
-import { setDocumentDirection } from '@/locales/i18n'
+
+import { checkFreightDealer, getFreightBalance, freightRecharge } from '@/api/wallet.js'
+
+import GeneralHeader from '@/components/GeneralHeader.vue'
+import maskLayer from '@/components/MaskLayer.vue'
 
 const { t, locale } = useI18n()
 const router = useRouter()
@@ -191,12 +346,97 @@ const checkingAccess = ref(true)
 const coinsAmount = ref('0')
 const loadingBalance = ref(false)
 
+const AmountList = ref([
+  {
+    id: 1,
+    type: '>$0',
+    selectedStatus: true,
+  },
+  {
+    id: 2,
+    type: '>=$10',
+    selectedStatus: false,
+  },
+  {
+    id: 3,
+    type: '>=$20',
+    selectedStatus: false,
+  },
+  {
+    id: 4,
+    type: '>=$50',
+    selectedStatus: false,
+  },
+])
+const selectedAmount = ref({})
+// 是否为每月一号
+const isFirstDay = ref(false)
+
+// 更新是否为每月一号
+const updateIsFirstDay = () => {
+  const today = new Date()
+  isFirstDay.value = today.getDate() === 1
+}
+
+// 选项样式
+const amountStyle = (amountItem) => {
+  if (amountItem.selectedStatus) {
+    return 'border: 1px solid #7726ff;background: #fff;'
+  } else if (isFirstDay.value) {
+    return 'border: 1px solid transparent;background: transparent;'
+  } else {
+    return 'border: 1px solid transparent;background: rgba(0, 0, 0, 0.2);'
+  }
+}
+
+// 弹窗提示
+const showHelpTip = ref(false) //帮助提示弹窗
+const showTransfersTip = ref(false) //设置转账确认弹窗
+const maskLayerShow = computed(() => {
+  return showHelpTip.value || showTransfersTip.value
+})
+
 // 选中的用户
 const selectedUser = ref({
   id: '',
   name: '',
 })
 
+// 关闭弹窗
+const closedPopup = () => {
+  showHelpTip.value = false
+  showTransfersTip.value = false
+}
+
+// 选择限制转账金额
+const selectAmount = (amountItem) => {
+  // 非每月一号
+  if (!isFirstDay.value || amountItem.selectedStatus) return
+
+  console.log('选择限制转账金额', amountItem)
+  selectedAmount.value = amountItem //设置选中的金额
+  showTransfersTip.value = true //展示确认弹窗
+}
+
+// 取消选择
+const Cancel = () => {
+  console.log('取消选择')
+
+  selectedAmount.value = {} //清空选中的金额
+  closedPopup()
+}
+
+// 确认选择
+const Confirm = () => {
+  console.log('确认选择')
+
+  // 发送接口
+  try {
+  } catch (error) {}
+
+  closedPopup()
+}
+
 // 校验销售商权限
 const checkDealerAccess = async () => {
   try {
@@ -242,7 +482,7 @@ const fetchFreightBalance = async () => {
 const defaultAvatarUrl = (e) => {
   console.log('头像资源出错')
   e.target.onerror = null //防止循环
-  e.target.src = new URL('/src/assets/images/WeeklyStar/defaultAvatar.png', import.meta.url).href
+  e.target.src = new URL('/src/assets/icon/defaultAvatar.png', import.meta.url).href
 }
 
 // 初始化用户信息
@@ -337,6 +577,22 @@ const { userInfo } = usePageInitializationWithConfig('COIN_SELLER', {
     initializeUser()
   },
 })
+
+// 定时检查（可选）
+let dayCheckInterval = null
+
+onMounted(() => {
+  // 初始化
+  updateIsFirstDay()
+  // 每小时检查一次是否进入新一天
+  dayCheckInterval = setInterval(updateIsFirstDay, 60 * 60 * 1000)
+})
+
+onUnmounted(() => {
+  if (dayCheckInterval) {
+    clearInterval(dayCheckInterval)
+  }
+})
 </script>
 
 <style scoped>