gypsy-crm-frontend-vu/pages/customer/components/VietnamNoticePopup.vue

<template>
    <cwg-popup v-model:visible="visible" type="center" :mask-click="false" :showFooters="true">
        <view class="popup-content">
            <view class="des1">
                <view><text class="bold">Quý khách hàng thân mến!</text></view>
                <view>Trước khi giao dịch, chúng tôi xin nhắc quý khách hàng rằng:</view>
                <view>1.Dựa trên sự điều chỉnh đối với hệ thống kiểm soát rủi ro của ngân hàng, quý khách vui lòng nạp
                    bằng tài khoản chính chủ; kênh nạp tiền có thể không được hỗ trợ, hoặc hạn mức giao dịch có thể
                    không chính xác khi quý khách nạp tiền (đặc biệt là vào ngoài giờ hành chính tại địa phương của
                    bạn). Vì vậy quý khách nên sắp xếp vị thế giao dịch của mình và khoảng thời gian nạp tiền sao cho
                    hợp lý để tránh những tổn thất không đáng có do bất kỳ sự chậm trễ nào trong việc nạp tiền.</view>
                <view>2.Vì có những rủi ro nhất định trong giao dịch, quý khách nên đầu tư phù hợp với kinh nghiệm giao
                    dịch và thu nhập của mình, thay vì sử dụng tiền vay từ người khác.</view>
                <view>Không bao giờ tiết lộ thông tin tài khoản cá nhân cho bất kì cá nhân, tổ chức nào. CWG sẽ không
                    bao giờ yêu cầu bất kỳ thông tin cá nhân nào từ quý khách qua điện thoại hoặc email, cũng như không
                    cung cấp bất kỳ lời khuyên đầu tư nào.</view>
                <view>Trong trường hợp có bất kỳ vấn đề gì với khoản tiền nạp của quý khách, vui lòng liên hệ với trung
                    tâm dịch vụ khách hàng chính thức của chúng tôi bất kỳ lúc nào.</view>
                <view><text class="bold">Trân trọng,</text></view>
            </view>
        </view>
        <template #footer>
            <button hover-class="" type="primary" @click="close">{{ t('Btn.Confirm') }}</button>
        </template>
    </cwg-popup>
</template>

<script setup>
import { computed } from 'vue';
import { useI18n } from 'vue-i18n';

const props = defineProps({
    visible: { type: Boolean, default: false }
});
console.log(props, 1212);

const emit = defineEmits(['update:visible']);

const { t } = useI18n();
const visible = computed({
    get: () => props.visible,
    set: (val) => emit('update:visible', val)
});
const close = () => { visible.value = false; };
</script>

<style lang="scss" scoped>
@import "@/uni.scss";

.popup-content {
    padding: px2rpx(20);

    color: var(--bs-emphasis-color);

    .des1 {
        font-size: px2rpx(16);
        line-height: 1.8;
        margin: px2rpx(20) 0 px2rpx(30);
        text-align: left;
        max-width: 100%;
        font-family: "Manrope";

        view {
            margin-bottom: px2rpx(20);
            font-family: "Manrope";

            &:last-child {
                margin-bottom: 0;
            }
        }

        .bold {
            font-family: "Manrope";
            font-weight: bold;
        }
    }
}
</style>