|
|
@@ -0,0 +1,400 @@
|
|
|
+<template>
|
|
|
+ <cwg-popup v-model:visible="visible" type="center" :mask-click="false" :showFooters="true" :showClose="false">
|
|
|
+ <view class="popup-content">
|
|
|
+ <view class="info-section">
|
|
|
+ <cwg-label-line-value :label="t('Custom.Deposit.Title1')" :value="login" v-if="login" />
|
|
|
+ <cwg-label-line-value :label="t('Custom.Deposit.Title2')"
|
|
|
+ :value="locale == 'cn' ? channelData.name : channelData.enName" v-if="channelData.code" />
|
|
|
+ <cwg-label-line-value :label="t('news_add_field.Label.Title4')" :value="selectCodes" v-if="code" />
|
|
|
+ <cwg-label-line-value :label="t('Custom.Deposit.Title3')" :value="params.amount + ' ' + channelData.currency"
|
|
|
+ v-if="params.amount" />
|
|
|
+ <cwg-label-line-value :label="t('Label.Name')" :value="userName" v-if="channelData.confirmName" />
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="form-section" v-if="(channelData.confirmAreaCode || channelData.confirmPhone)">
|
|
|
+ <uni-forms ref="formRef" :model="formData" :rules="rules" label-position="top">
|
|
|
+ <uni-forms-item :label="t('placeholder.phone')"
|
|
|
+ v-if="channelData.confirmAreaCode && channelData.confirmPhone">
|
|
|
+ <view class="phone-input-group">
|
|
|
+ <view class="area-code-input">
|
|
|
+ <input type="text" v-model="formData.confirmAreaCode" placeholder="+86" />
|
|
|
+ </view>
|
|
|
+ <view class="phone-separator">-</view>
|
|
|
+ <view class="phone-input">
|
|
|
+ <input type="tel" v-model="formData.confirmPhone" placeholder="{{ t('placeholder.phone') }}" />
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item :label="t('placeholder.phone')" v-else-if="channelData.confirmPhone">
|
|
|
+ <input type="tel" v-model="formData.confirmPhone" placeholder="{{ t('placeholder.phone') }}" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item :label="t('placeholder.phone')" v-else-if="channelData.confirmAreaCode">
|
|
|
+ <input type="text" v-model="formData.confirmAreaCode" placeholder="{{ t('placeholder.phone') }}" />
|
|
|
+ </uni-forms-item>
|
|
|
+ </uni-forms>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="merchant-info">
|
|
|
+ <view v-if="locale === 'cn'">
|
|
|
+ <view>商户:CWG Markets Ltd</view>
|
|
|
+ <view>指定独立代表和/或分销商</view>
|
|
|
+ <view>注册地址:瓦努阿图,波特维拉,Govant大厦,Kumul公路1276号,1楼</view>
|
|
|
+ <view>CWG Markets Ltd 负责与本网站相关的营销、分销和客户支持服务。</view>
|
|
|
+ </view>
|
|
|
+ <!-- Traditional Chinese -->
|
|
|
+ <view v-else-if="locale === 'zhHant'">
|
|
|
+ <view>商戶:CWG Markets Ltd</view>
|
|
|
+ <view>指定獨立代表和/或分銷商</view>
|
|
|
+ <view>註冊地址:瓦努阿圖,波特維拉,Govant大廈,Kumul公路1276號,1樓</view>
|
|
|
+ <view>CWG Markets Ltd 負責與本網站相關的行銷、分銷和客戶支援服務。</view>
|
|
|
+ </view>
|
|
|
+ <!-- English -->
|
|
|
+ <view v-else-if="locale === 'en'">
|
|
|
+ <view>Merchant: CWG Markets Ltd</view>
|
|
|
+ <view>Appointed Independent Representative and/or Distributor</view>
|
|
|
+ <view>Registered Address: 1276 Kumul Highway, Govant Building, 1st Floor, Port Vila, Vanuatu</view>
|
|
|
+ <view>CWG Markets Ltd is responsible for marketing, distribution, and customer support services related to
|
|
|
+ this
|
|
|
+ website.</view>
|
|
|
+ </view>
|
|
|
+ <!-- Vietnamese -->
|
|
|
+ <view v-else-if="locale === 'vn'">
|
|
|
+ <view>Người bán: CWG Markets Ltd</view>
|
|
|
+ <view>Đại diện độc lập được bổ nhiệm và/hoặc nhà phân phối</view>
|
|
|
+ <view>Địa chỉ đăng ký: 1276 Kumul Highway, Tòa nhà Govant, Tầng 1, Port Vila, Vanuatu</view>
|
|
|
+ <view>CWG Markets Ltd chịu trách nhiệm về tiếp thị, phân phối và dịch vụ hỗ trợ khách hàng liên quan đến trang
|
|
|
+ web này.</view>
|
|
|
+ </view>
|
|
|
+ <!-- Thai -->
|
|
|
+ <view v-else-if="locale === 'th'">
|
|
|
+ <view>พาณิชย์: CWG Markets Ltd</view>
|
|
|
+ <view>ตัวแทนอิสระและ/หรือตัวแทนจำหน่ายที่ได้รับการแต่งตั้ง</view>
|
|
|
+ <view>ที่อยู่ที่จดทะเบียน: 1276 Kumul Highway, Govant Building, ชั้น 1, Port Vila, Vanuatu</view>
|
|
|
+ <view>CWG Markets Ltd รับผิดชอบการตลาด การจัดจำหน่าย และบริการสนับสนุนลูกค้าที่เกี่ยวข้องกับเว็บไซต์นี้</view>
|
|
|
+ </view>
|
|
|
+ <!-- Arabic -->
|
|
|
+ <view v-else-if="locale === 'ar'">
|
|
|
+ <view>التاجر: CWG Markets Ltd</view>
|
|
|
+ <view>الممثل المستقل المعين و/أو الموزع</view>
|
|
|
+ <view>العنوان المسجل: 1276 كوميول هايوي، مبنى جوفانت، الطابق الأول، بورت فيلا، فانواتو</view>
|
|
|
+ <view>تتحمل شركة CWG Markets Ltd مسؤولية التسويق والتوزيع وخدمات دعم العملاء المتعلقة بهذا الموقع.</view>
|
|
|
+ </view>
|
|
|
+ <!-- German -->
|
|
|
+ <view v-else-if="locale === 'de'">
|
|
|
+ <view>Händler: CWG Markets Ltd</view>
|
|
|
+ <view>Bestellter unabhängiger Vertreter und/oder Distributor</view>
|
|
|
+ <view>Registrierte Adresse: 1276 Kumul Highway, Govant Building, 1. Etage, Port Vila, Vanuatu</view>
|
|
|
+ <view>CWG Markets Ltd ist verantwortlich für Marketing, Vertrieb und Kundenservice im Zusammenhang mit dieser
|
|
|
+ Website.</view>
|
|
|
+ </view>
|
|
|
+ <!-- Spanish -->
|
|
|
+ <view v-else-if="locale === 'es'">
|
|
|
+ <view>Comerciante: CWG Markets Ltd</view>
|
|
|
+ <view>Representante independiente y/o distribuidor designado</view>
|
|
|
+ <view>Dirección registrada: 1276 Kumul Highway, Govant Building, 1er Piso, Port Vila, Vanuatu</view>
|
|
|
+ <view>CWG Markets Ltd es responsable de marketing, distribución y servicios de atención al cliente
|
|
|
+ relacionados
|
|
|
+ con este sitio web.</view>
|
|
|
+ </view>
|
|
|
+ <!-- Indonesian -->
|
|
|
+ <view v-else-if="locale === 'id'">
|
|
|
+ <view>Pedagang: CWG Markets Ltd</view>
|
|
|
+ <view>Perwakilan Independen yang Ditunjuk dan/atau Distributor</view>
|
|
|
+ <view>Alamat Terdaftar: 1276 Kumul Highway, Gedung Govant, Lantai 1, Port Vila, Vanuatu</view>
|
|
|
+ <view>CWG Markets Ltd bertanggung jawab atas pemasaran, distribusi, dan layanan dukungan pelanggan terkait
|
|
|
+ dengan situs web ini.</view>
|
|
|
+ </view>
|
|
|
+ <!-- Malaysian -->
|
|
|
+ <view v-else-if="locale === 'ms'">
|
|
|
+ <view>Pedagang: CWG Markets Ltd</view>
|
|
|
+ <view>Wakil Bebas yang Ditetapkan dan/atau Pengedar</view>
|
|
|
+ <view>Alamat Didaftarkan: 1276 Kumul Highway, Bangunan Govant, Tingkat 1, Port Vila, Vanuatu</view>
|
|
|
+ <view>CWG Markets Ltd bertanggungjawab ke atas pemasaran, pengedaran, dan perkhidmatan sokongan pelanggan yang
|
|
|
+ berkaitan dengan laman web ini.</view>
|
|
|
+ </view>
|
|
|
+ <!-- Korean -->
|
|
|
+ <view v-else-if="locale === 'ko'">
|
|
|
+ <view>상인: CWG Markets Ltd</view>
|
|
|
+ <view>지정된 독립 대표자 및/또는 유통업체</view>
|
|
|
+ <view>등록된 주소: 1276 Kumul Highway, Govant Building, 1층, Port Vila, Vanuatu</view>
|
|
|
+ <view>CWG Markets Ltd는 이 웹사이트와 관련된 마케팅, 배급 및 고객 지원 서비스를 담당합니다.</view>
|
|
|
+ </view>
|
|
|
+ <!-- Brazilian Portuguese -->
|
|
|
+ <view v-else-if="locale === 'pt'">
|
|
|
+ <view>Mercante: CWG Markets Ltd</view>
|
|
|
+ <view>Representante Independente nomeado e/ou Distribuidor</view>
|
|
|
+ <view>Endereço Registrado: 1276 Kumul Highway, Govant Building, 1º Andar, Port Vila, Vanuatu</view>
|
|
|
+ <view>CWG Markets Ltd é responsável pelo marketing, distribuição e serviços de atendimento ao cliente
|
|
|
+ relacionados a este site.</view>
|
|
|
+ </view>
|
|
|
+ <!-- Persian -->
|
|
|
+ <view v-else-if="locale === 'fa'">
|
|
|
+ <view>تاجر: CWG Markets Ltd</view>
|
|
|
+ <view>نماینده مستقل و/یا توزیعکننده منصوب</view>
|
|
|
+ <view>آدرس ثبتشده: 1276 Kumul Highway, ساختمان Govant, طبقه اول، Port Vila، وانواتو</view>
|
|
|
+ <view>CWG Markets Ltd مسئول بازاریابی، توزیع و خدمات پشتیبانی مشتریان مرتبط با این وبسایت است.</view>
|
|
|
+ </view>
|
|
|
+ <!-- Turkish -->
|
|
|
+ <view v-else-if="locale === 'tr'">
|
|
|
+ <view>Tüccar: CWG Markets Ltd</view>
|
|
|
+ <view>Atanmış Bağımsız Temsilci ve/veya Distribütör</view>
|
|
|
+ <view>Kayıtlı Adres: 1276 Kumul Highway, Govant Building, 1. Kat, Port Vila, Vanuatu</view>
|
|
|
+ <view>CWG Markets Ltd, bu web sitesiyle ilgili pazarlama, dağıtım ve müşteri destek hizmetlerinden sorumludur.
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- Fallback to English -->
|
|
|
+ <view v-else>
|
|
|
+ <view>Merchant: CWG Markets Ltd</view>
|
|
|
+ <view>Appointed Independent Representative and/or Distributor</view>
|
|
|
+ <view>Registered Address: 1276 Kumul Highway, Govant Building, 1st Floor, Port Vila, Vanuatu</view>
|
|
|
+ <view>CWG Markets Ltd is responsible for marketing, distribution, and customer support services related to
|
|
|
+ this
|
|
|
+ website.</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <template #footer>
|
|
|
+ <button @click="cancel">{{ t('Btn.Cancel') }}</button>
|
|
|
+ <button type="primary" @click="submit">{{ t('Btn.Confirm') }}</button>
|
|
|
+ </template>
|
|
|
+ </cwg-popup>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { ref, computed } from 'vue';
|
|
|
+import { useI18n } from 'vue-i18n';
|
|
|
+
|
|
|
+const props = defineProps({
|
|
|
+ visible: { type: Boolean, default: false },
|
|
|
+ login: String,
|
|
|
+ channelData: Object,
|
|
|
+ code: String,
|
|
|
+ selectCodes: String,
|
|
|
+ params: Object,
|
|
|
+ userName: String,
|
|
|
+ // 其他可能需要的 props
|
|
|
+});
|
|
|
+const emit = defineEmits(['update:visible', 'confirm', 'cancel']);
|
|
|
+
|
|
|
+const { t, locale } = useI18n();
|
|
|
+const visible = computed({
|
|
|
+ get: () => props.visible,
|
|
|
+ set: (val) => emit('update:visible', val)
|
|
|
+});
|
|
|
+
|
|
|
+const formData = ref({
|
|
|
+ confirmAreaCode: '',
|
|
|
+ confirmPhone: ''
|
|
|
+});
|
|
|
+
|
|
|
+const rules = ref({
|
|
|
+ confirmAreaCode: {
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ errorMessage: t('vaildate.select.empty')
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ confirmPhone: {
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ errorMessage: t('vaildate.select.empty')
|
|
|
+ },
|
|
|
+ {
|
|
|
+ pattern: /^1[3-9]\d{9}$/,
|
|
|
+ errorMessage: t('vaildate.phone.format')
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+});
|
|
|
+
|
|
|
+const formRef = ref(null);
|
|
|
+
|
|
|
+const cancel = () => {
|
|
|
+ visible.value = false;
|
|
|
+ emit('cancel');
|
|
|
+};
|
|
|
+
|
|
|
+const submit = async () => {
|
|
|
+ if (formRef.value) {
|
|
|
+ try {
|
|
|
+ await formRef.value.validate();
|
|
|
+ visible.value = false;
|
|
|
+ emit('confirm', formData.value);
|
|
|
+ } catch (error) {
|
|
|
+ console.error('Form validation failed:', error);
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ visible.value = false;
|
|
|
+ emit('confirm', formData.value);
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+@import "@/uni.scss";
|
|
|
+
|
|
|
+.popup-content {
|
|
|
+ .info-section {
|
|
|
+ margin-bottom: px2rpx(24);
|
|
|
+ padding: px2rpx(20);
|
|
|
+ background-color: #f8f9fa;
|
|
|
+ border-radius: px2rpx(8);
|
|
|
+ border: 1px solid #e9ecef;
|
|
|
+
|
|
|
+ :deep(.cwg-label-line-value) {
|
|
|
+ margin-bottom: px2rpx(12);
|
|
|
+
|
|
|
+ &:last-child {
|
|
|
+ margin-bottom: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .form-section {
|
|
|
+ margin-bottom: px2rpx(24);
|
|
|
+ padding: px2rpx(20);
|
|
|
+ background-color: #ffffff;
|
|
|
+ border-radius: px2rpx(8);
|
|
|
+ border: 1px solid #e9ecef;
|
|
|
+
|
|
|
+ :deep(.uni-forms) {
|
|
|
+ width: 100%;
|
|
|
+
|
|
|
+ :deep(.uni-forms-item) {
|
|
|
+ margin-bottom: px2rpx(16);
|
|
|
+
|
|
|
+ :deep(.uni-forms-item__label) {
|
|
|
+ font-size: px2rpx(14);
|
|
|
+ color: #606266;
|
|
|
+ margin-bottom: px2rpx(8);
|
|
|
+ }
|
|
|
+
|
|
|
+ :deep(.uni-forms-item__error) {
|
|
|
+ font-size: px2rpx(12);
|
|
|
+ color: #f56c6c;
|
|
|
+ margin-top: px2rpx(4);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .phone-input-group {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ gap: px2rpx(12);
|
|
|
+
|
|
|
+ .area-code-input {
|
|
|
+ flex: 0 0 px2rpx(100);
|
|
|
+
|
|
|
+ input {
|
|
|
+ width: 100%;
|
|
|
+ height: px2rpx(40);
|
|
|
+ padding: 0 px2rpx(12);
|
|
|
+ border: 1px solid #dcdfe6;
|
|
|
+ border-radius: px2rpx(4);
|
|
|
+ font-size: px2rpx(14);
|
|
|
+ transition: border-color 0.3s;
|
|
|
+
|
|
|
+ &:focus {
|
|
|
+ outline: none;
|
|
|
+ border-color: #409eff;
|
|
|
+ box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.2);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .phone-separator {
|
|
|
+ font-size: px2rpx(16);
|
|
|
+ color: #909399;
|
|
|
+ user-select: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ .phone-input {
|
|
|
+ flex: 1;
|
|
|
+
|
|
|
+ input {
|
|
|
+ width: 100%;
|
|
|
+ height: px2rpx(40);
|
|
|
+ padding: 0 px2rpx(12);
|
|
|
+ border: 1px solid #dcdfe6;
|
|
|
+ border-radius: px2rpx(4);
|
|
|
+ font-size: px2rpx(14);
|
|
|
+ transition: border-color 0.3s;
|
|
|
+
|
|
|
+ &:focus {
|
|
|
+ outline: none;
|
|
|
+ border-color: #409eff;
|
|
|
+ box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.2);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ input {
|
|
|
+ width: 100%;
|
|
|
+ height: px2rpx(40);
|
|
|
+ padding: 0 px2rpx(12);
|
|
|
+ border: 1px solid #dcdfe6;
|
|
|
+ border-radius: px2rpx(4);
|
|
|
+ font-size: px2rpx(14);
|
|
|
+ transition: border-color 0.3s;
|
|
|
+
|
|
|
+ &:focus {
|
|
|
+ outline: none;
|
|
|
+ border-color: #409eff;
|
|
|
+ box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.2);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .merchant-info {
|
|
|
+ padding: px2rpx(16);
|
|
|
+ background-color: #f5f7fa;
|
|
|
+ border-radius: px2rpx(8);
|
|
|
+ font-size: px2rpx(13);
|
|
|
+ line-height: 1.6;
|
|
|
+ text-align: left;
|
|
|
+ color: #606266;
|
|
|
+
|
|
|
+ view {
|
|
|
+ margin-bottom: px2rpx(8);
|
|
|
+
|
|
|
+ &:last-child {
|
|
|
+ margin-bottom: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media (max-width: 768px) {
|
|
|
+ .popup-content {
|
|
|
+
|
|
|
+ .info-section,
|
|
|
+ .form-section {
|
|
|
+ padding: px2rpx(16);
|
|
|
+ }
|
|
|
+
|
|
|
+ .form-section {
|
|
|
+ .phone-input-group {
|
|
|
+ gap: px2rpx(8);
|
|
|
+
|
|
|
+ .area-code-input {
|
|
|
+ flex: 0 0 px2rpx(80);
|
|
|
+ }
|
|
|
+
|
|
|
+ input {
|
|
|
+ height: px2rpx(36);
|
|
|
+ font-size: px2rpx(13);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .merchant-info {
|
|
|
+ padding: px2rpx(12);
|
|
|
+ font-size: px2rpx(12);
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|