fix: isolate customer service chats and reload bank details

web/src/mobile/views/FormView.vue

@@ -60,10 +60,6 @@
         <div><span>银行名</span><strong>{{ account.bank_name }}</strong></div>
         <div><span>银行账户</span><strong>{{ account.account_no }}</strong></div>
         <div v-if="account.digital_rmb_code"><span>人民币编码</span><strong>{{ account.digital_rmb_code }}</strong></div>
-        <div v-if="safeImage(account.alipay_qr_url) || safeImage(account.wechat_qr_url)" class="m-bound-account-qr">
-          <figure v-if="safeImage(account.alipay_qr_url)"><img :src="safeImage(account.alipay_qr_url)" alt="支付宝收款码" /><figcaption>支付宝收款码</figcaption></figure>
-          <figure v-if="safeImage(account.wechat_qr_url)"><img :src="safeImage(account.wechat_qr_url)" alt="微信收款码" /><figcaption>微信收款码</figcaption></figure>
-        </div>
       </div>
     </section>
     <form class="m-plain-form m-bank-form" @submit.prevent="saveBank">
@@ -238,7 +234,7 @@
 </template>
 
 <script setup lang="ts">
-  import { computed, onMounted, reactive, ref } from 'vue';
+  import { computed, reactive, ref, watch } from 'vue';
   import { useRoute, useRouter } from 'vue-router';
   import {
     CardOutline,
@@ -286,6 +282,7 @@
     masked: boolean;
   }
   const paymentAccounts = ref<PaymentAccountDetail[]>([]);
+  let paymentAccountsLoadVersion = 0;
   const content = ref<any>();
   const resetPassword = ref('');
   const bank = reactive({
@@ -348,10 +345,14 @@
     }
   }
   async function loadPaymentAccounts() {
+    const version = ++paymentAccountsLoadVersion;
+    error.value = '';
+    paymentAccounts.value = [];
     try {
-      paymentAccounts.value = await request<PaymentAccountDetail[]>({ url: '/v1/payment-accounts/details' });
+      const accounts = await request<PaymentAccountDetail[]>({ url: '/v1/payment-accounts/details' });
+      if (version === paymentAccountsLoadVersion && formType.value === 'bank') paymentAccounts.value = accounts;
     } catch (err) {
-      error.value = errorText(err);
+      if (version === paymentAccountsLoadVersion && formType.value === 'bank') error.value = errorText(err);
     }
   }
   async function saveBank() {
@@ -509,9 +510,16 @@
       loading.value = false;
     }
   }
-  onMounted(() => {
-    if (formType.value === 'profile') loadProfile();
-    else if (formType.value === 'bank') loadPaymentAccounts();
-    else if (formType.value === 'content') loadContent();
-  });
+  watch(
+    () => [formType.value, String(route.params.key || '')],
+    ([type]) => {
+      paymentAccountsLoadVersion += 1;
+      error.value = '';
+      if (type !== 'content') content.value = undefined;
+      if (type === 'profile') void loadProfile();
+      else if (type === 'bank') void loadPaymentAccounts();
+      else if (type === 'content') void loadContent();
+    },
+    { immediate: true }
+  );
 </script>