国际化

src/api/system/user.ts

@@ -0,0 +1,29 @@
+import { http } from '@/utils/http/axios';
+
+
+
+
+
+const baseUrl = '/api'
+
+/**
+ * @description: getLoansInfo
+ */
+export function getDefaultLocal() {
+  // zh_CN 中文
+  // gu_IN 印度
+  const language = localStorage.getItem('lang')
+  let lang = 'zh_CN'
+  if (language === 'zh') {
+    lang = 'zh_CN'
+  } else if (language === 'id') {
+    lang = 'gu_IN'
+  }
+  return http.request({
+    url: `${baseUrl}/app/home/loans/defaultLocal`,
+    method: 'GET',
+    params: {
+      lang
+    }
+  });
+}

src/lang/en_us.js

@@ -1,7 +0,0 @@
-
-// en_us.js文件
-export default {
-  app: {
-    hello: 'Hello，World!'
-  }
-}

src/lang/id_ID.ts

@@ -0,0 +1,140 @@
+// id_ID.ts文件
+export default {
+  app: {
+    home: 'Beranda',
+    serveList: 'Dompet',
+    message: 'Customer Service',
+    my: 'Ku',
+    yuan: 'Yuan',
+    second: 'Detik',
+    month: 'Bulan',
+    prompt: 'Prompt',
+    tips: 'Catatan Hangat',
+    enterLogout: 'Anda Yakin Ingin Keluar Dari Login?',
+    enterWithdrawal: 'Anda Yakin Ingin Meng withdraw?',
+    withdrawal: 'Penarikan',
+    info: 'Informasi',
+    success: 'Sukses',
+    withdrawalAmount: 'Jumlah Penarikan',
+    pleaseWithdrawalAmount: 'Jumlah Penarikan',
+    submit: 'Kirim',
+    submittedSuccessfully: 'Berhasil Dikirim',
+    submitApplication: 'Kirim Permohonan',
+    bankCardAbnormality: 'Gangguan Kartu Bank',
+    receivedSuccessfully: 'Berhasil Diterima',
+    phoneNumber: 'Nomor Telepon',
+    verificationCode: 'Kode Verifikasi',
+    confirm: 'Konfirmasi',
+    enter: 'Silahkan Masukkan',
+    select: 'Silahkan Pilih',
+    send: 'Kirim',
+    login: 'Masuk',
+    account: 'Akun',
+    logout: 'Keluar',
+    register: 'Daftar',
+    password: 'Kata Sandi',
+    forgotPassword: 'Lupa Kata Sandi',
+    passwordPlaceholder: 'Silahkan Tetapkan Kata Sandi 6-16 Digit',
+    passwordPlaceholder1: 'Silahkan Masukkan Ulang Kata Sandi',
+    next: 'Lanjut',
+    update: 'Perbarui',
+    noData: 'Tidak Ada Data',
+    none: 'Tidak Ada',
+    contract: 'Kontrak',
+    loan: 'Pinjaman',
+    totalLoan: 'Jumlah Pinjaman',
+    complete: 'Lengkap',
+    noComplete: 'Tidak Lengkap',
+    signature: 'Tanda Tangan',
+    identityInformation: 'Informasi Identitas',
+    information: 'Informasi',
+    signatureInformation: 'Informasi Tanda Tangan',
+    receivingBank: 'Bank Penerima',
+    rwmljndzlxx: 'Jangan Lupakan Informasi Anda',
+    upPNGorJPG: 'Silahkan Unggah Gambar JPG Atau PNG',
+  },
+  home: {
+    productDetails: 'Detail Produk',
+    minimumDailyInterestRate: 'Suku Bunga Harian Terendah',
+    borrowingLimit: 'Limit Pinjaman',
+    installmentPeriod: 'Periode Bayar',
+    optional: 'Opsional',
+    applicationAmount: 'Jumlah Permintaan',
+    loanTerm: 'Tenor Pinjaman',
+    repaymentPerInstallment: 'Pembayaran Setiap Installment',
+    dailyInterestRate: 'Suku Bunga Harian',
+    totalInterest: 'Suku Bunga Total',
+    successfulBorrowing: 'Pinjaman Berhasil',
+    enterAgreement: 'Saya Sudah Membaca Dan Setuju',
+    authAgreement: 'Perjanjian Otorisasi',
+    serviceAgreement: 'Ketentuan Layanan Platform',
+    lawAgreement: 'Ketentuan Hukum',
+    loansAgreement: 'Perjanjian Pinjaman',
+    immediateBorrowing: 'Pinjaman Segera',
+    pleaseFillInYourPersonalInformationFirst: 'Silahkan Isi Informasi Pribadi Anda Dulu',
+    pleaseEnterAgreement: 'Silahkan Baca Dan Setujui Perjanjian Yang Berkaitan',
+  },
+  my: {
+    userInfo: 'Informasi Saya',
+    loan: 'Pinjaman Saya',
+    repayment: 'Pembayaran Saya',
+    legalLiability: 'Kewajiban Hukum',
+    uploadPassword: 'Ubah Kata Sandi',
+    logout: 'Logout',
+    language: 'tukar bahasa',
+  },
+  serveList: {
+    loan: 'Pinjaman Saya',
+    balance: 'Saldo Akun',
+    amountToBeRepaid: 'Jumlah Yang Harus Dibayar',
+    immediateWithdrawal: 'Pinjaman Segera',
+    financialSecurity: 'Keamanan Dana Dilindungi Oleh Bank',
+  },
+  borrowInfo: {
+    applicationTime: 'Waktu Permohonan',
+    loanDetails: 'Detail Pinjaman',
+    loanInfo: 'Informasi Pinjaman',
+    loanNo: 'Nomor Pinjaman',
+    loanAmount: 'Jumlah Pinjaman',
+    loanCycle: 'Sikl Pinjaman',
+    withdrawalBank: 'Bank Penarikan',
+    repaymentPerInstallment: 'Pembayaran Setiap Installment',
+    describe: 'Deskripsi',
+    receivingAccount: 'Akun Penerima',
+    usageOfLoan: 'Manfaatkan Pinjaman',
+  },
+  loans: {
+    enterSubmitApplication: 'Anda Yakin Ingin Mengajukan Pinjaman?',
+  },
+  userInfo: {
+    realPrompt: 'Isi informasi yang valid dan asli, persetujuan akan dilanjutkan.',
+    idCardPrompt: 'Dibutuhkan ID pribadi sendiri dan isinya harus jelas bisa dibaca',
+    photographPrompt: 'Silahkan pastikan ijin fotografi sudah diaktifkan',
+    name: 'Nama',
+    idCard: 'Nomor ID',
+    idCardUp1: 'Klik Unggah Sisi Wajah ID',
+    idCardUp2: 'Klik Unggah Sisi Militer ID',
+    idCardUp3: 'Klik Unggah Foto tangan Ditekan ID',
+    shootingRequirements: 'Persyaratan Fotografi',
+    standardShooting: 'Fotografi Standard',
+    missingBorder: 'Kuas Erat Hilang',
+    outOfFocus: 'Foto Gragil',
+    flashStrongly: 'Cahaya Cepat Gemetar Kuat',
+    unitName: 'Nama Unit',
+    position: 'Jabatan',
+    workTelephone: 'Telepon Unit',
+    workingAge: 'Usia Bekerja',
+    monthlyPay: 'Gaji Bulanan',
+    unitAddress: 'Alamat Unit',
+    addressInfo: 'Informasi Alamat',
+    currentResidentialAddress: 'Alamat Tinggal Saat Ini',
+    directFamilyContactPerson: 'Kontak Dari Keluarga Dekat',
+    relationship: 'Hubungan',
+    parents: 'Ortu',
+    spouse: 'Suami/Istri',
+    children: 'Anak-anak',
+    grandparents: 'Dari Orang Tua Kandung',
+    bankOfDeposit: 'Bank Penyedia Rekening',
+    bankCard: 'Nomor Kartu Bank',
+  }
+}

src/lang/index.js

@@ -1,36 +0,0 @@
-import Vue from 'vue'
-import VueI18n from 'vue-i18n'
-import {Locale} from 'vant'
-import enUS from 'vant/lib/locale/lang/en-US'
-import zhCN from 'vant/lib/locale/lang/zh-CN'
-import enLocale from './en_us'
-import zhLocale from './zh_cn'
-
-Vue.use(VueI18n)
-
-const messages = {
-  en: {
-    ...enUS,
-    ...enLocale
-  },
-  zh: {
-    ...zhCN,
-    ...zhLocale
-  }
-}
-
-const i18n = new VueI18n({
-  locale: 'zh',  // 设置默认语言
-  messages: messages // 设置资源文件对象
-})
-
-// 更新vant组件库本身的语言变化，支持国际化
-function vantLocales (lang) {
-  if (lang === 'en') {
-    Locale.use(lang, enUS)
-  } else if (lang === 'zh') {
-    Locale.use(lang, zhCN)
-  }
-}
-
-export {i18n, vantLocales}

src/lang/index.ts

@@ -0,0 +1,40 @@
+import { createI18n } from 'vue-i18n';
+import {Locale} from 'vant'
+import zhCN from 'vant/lib/locale/lang/zh-CN'
+import idId from 'vant/lib/locale/lang/id-ID'
+import zhLocale from './zh_cn'
+import idLocale from './id_ID'
+import type { App } from 'vue';
+
+
+const messages = {
+  zh: {
+    ...zhCN,
+    ...zhLocale
+  },
+  id: {
+    ...idId,
+    ...idLocale
+  }
+}
+
+const language = (navigator.language || 'zh').toLocaleLowerCase(); // 这是获取浏览器的语言
+
+console.log('当前的环境语言是：', language)
+console.log('当前的后台语言是：', localStorage.getItem('lang'))
+const i18n = createI18n({
+  allowComposition: true,
+  locale: localStorage.getItem('lang') || language.split('-')[0] || 'zh',  // 设置默认语言
+  fallbackLocale: 'zh', // 设置备用语言
+  messages: messages // 设置资源文件对象
+})
+
+// 更新vant组件库本身的语言变化，支持国际化
+export function vantLocales (app: App<Element>) {
+  app.use(i18n)
+  if (language === 'zh') {
+    Locale.use(language, zhCN)
+  } else if (language === 'id') {
+    Locale.use(language, idId)
+  }
+}

src/lang/zh_cn.js

@@ -1,6 +0,0 @@
-// zh_cn.js文件
-export default {
-  app: {
-    hello: '你好，世界！'
-  }
-}

src/lang/zh_cn.ts

@@ -0,0 +1,153 @@
+// zh_cn.js文件
+export default {
+  app: {
+    home: '首页',
+    serveList: '钱包',
+    message: '客服',
+    my: '我的',
+    yuan: '元',
+    second: '秒',
+    month: '个月',
+    prompt: '提示',
+    tips: '温馨提示',
+    enterLogout: '您确定要退出登录吗',
+    enterWithdrawal: '您确定要提现吗',
+    withdrawal: '提现',
+    info: '信息',
+    success: '成功',
+    withdrawalAmount: '提现金额',
+    pleaseWithdrawalAmount: '提现金额',
+    submit: '提交',
+    submittedSuccessfully: '提交成功',
+    submitApplication: '提交申请',
+    bankCardAbnormality: '银行卡异常',
+    receivedSuccessfully: '到账成功',
+    phoneNumber: '手机号码',
+    verificationCode: '验证码',
+    confirm: '确认',
+    enter: '请输入',
+    select: '请选择',
+    send: '发送',
+    login: '登录',
+    account: '账号',
+    logout: '登出',
+    register: '注册',
+    password: '密码',
+    forgotPassword: '忘记密码',
+    passwordPlaceholder: '请设置6-16位密码',
+    passwordPlaceholder1: '请再次输入密码',
+    next: '下一步',
+    update: '修改',
+    noData: '暂无数据',
+    none: '暂无',
+    contract: '合同',
+    loan: '贷款',
+    totalLoan: '贷款总额',
+    complete: '完整',
+    noComplete: '不完整',
+    signature: '签名',
+    identityInformation: '身份信息',
+    information: '资料信息',
+    signatureInformation: '签名信息',
+    receivingBank: '收款银行卡',
+    rwmljndzlxx: '让我们了解您的资料信息',
+    upPNGOrJPG: '请上传 jpg 或者 png 格式图片',
+  },
+  home: {
+    productDetails: '产品详情',
+    minimumDailyInterestRate: '最低日息',
+    borrowingLimit: '借款额度',
+    installmentPeriod: '分期期限',
+    optional: '可选',
+    applicationAmount: '申请金额',
+    loanTerm: '借款期限',
+    repaymentPerInstallment: '每期还款',
+    dailyInterestRate: '日利率',
+    totalInterest: '总利息',
+    successfulBorrowing: '成功借款',
+    enterAgreement: '我已阅读并同意',
+    authAgreement: '委托授权协议',
+    serviceAgreement: '平台服务协议',
+    lawAgreement: '法律协议',
+    loansAgreement: '借款协议',
+    immediateBorrowing: '立即借款',
+    pleaseFillInYourPersonalInformationFirst: '请先填写个人资料',
+    pleaseEnterAgreement: '请阅读并同意相关协议',
+  },
+  my: {
+    userInfo: '我的资料',
+    loan: '我的借款',
+    repayment: '我的还款',
+    legalLiability: '法律责任',
+    uploadPassword: '修改密码',
+    logout: '退出登录',
+    language: '切换语言',
+  },
+  serveList: {
+    loan: '我的贷款',
+    balance: '账户余额',
+    amountToBeRepaid: '待还款金额',
+    immediateWithdrawal: '立即借款',
+    financialSecurity: '账户资金安全由银行保障',
+  },
+  borrowInfo: {
+    applicationTime: '申请时间',
+    loanDetails: '贷款详情',
+    loanInfo: '借款信息',
+    loanNo: '贷款编号',
+    loanAmount: '借款金额',
+    loanCycle: '贷款周期',
+    withdrawalBank: '提现银行',
+    repaymentPerInstallment: '每期还款',
+    describe: '描述',
+    receivingAccount: '收款帐户',
+    usageOfLoan: '借款用途',
+  },
+  loans: {
+    enterSubmitApplication: '您确定要申请贷款吗'
+  },
+  userInfo: {
+    realPrompt: '填写真实有效的信息，审核才会通过哦',
+    idCardPrompt: '需本人身份证，且内容清晰可辨',
+    photographPrompt: '请您确认拍照权限已开启',
+    name: '姓名',
+    idCard: '身份证号',
+    idCardUp1: '点击上传身份证人像面',
+    idCardUp2: '点击上传身份证国徽面',
+    idCardUp3: '点击上传手持身份证照',
+    shootingRequirements: '拍摄要求',
+    standardShooting: '标准拍摄',
+    missingBorder: '边框缺失',
+    outOfFocus: '照片模糊',
+    flashStrongly: '闪光强烈',
+    unitName: '单位名称',
+    position: '职位',
+    workTelephone: '单位电话',
+    workingAge: '工作年龄',
+    monthlyPay: '月薪',
+    unitAddress: '单位地址',
+    addressInfo: '详细地址',
+    currentResidentialAddress: '现居住地址',
+    directFamilyContactPerson: '直系亲属联系人',
+    relationship: '关系',
+    parents: '父母',
+    spouse: '配偶',
+    children: '子女',
+    grandparents: '祖父母',
+    bankOfDeposit: '开户银行',
+    bankCard: '银行卡号',
+  }
+}
+
+
+
+
+
+
+
+
+
+
+
+
+

src/main.ts

@@ -1,20 +1,29 @@
 import './array.prototype.d.ts';
 import './date.prototype.d.ts';
 import './string.prototype.d.ts';
+// 导入资源文件
 import { createApp } from 'vue'
 import App from './App.vue'
 import router from "./router";
 import {setupStore} from "@/store";
 import {setupCustomComponents} from "@/plugins/customComponents";
+import {vantLocales} from './lang'
 // 2. 引入组件样式
 import 'vant/lib/index.css';
 import 'vant/es/toast/style'
 
 const app = createApp(App)
+
+// app.use(i18n)
+
+
 app.use(router)
 
 app.mount('#app')
 
 setupStore(app)
 
+// vant-ui组件国际化
+vantLocales(app)
+
 setupCustomComponents(app)

src/views/agreement/agreement.vue

@@ -11,8 +11,10 @@ import {getAgreement} from "@/api";
 import {onMounted, ref} from "vue";
 import {useRoute} from "vue-router";
 import {px2vw} from "@/utils";
+import { useI18n } from 'vue-i18n';
 
 const route = useRoute()
+const { t } = useI18n()
 const agreement = ref('')
 
 const _getSystemConfigOne = (key) => {
@@ -21,10 +23,10 @@ const _getSystemConfigOne = (key) => {
     })
 }
 const tittleMap = {
-  loansAgreement: '借款协议',
+  loansAgreement: t('home.loansAgreement'),
-  serviceAgreement: '平台服务协议',
+  serviceAgreement: t('home.serviceAgreement'),
-  authAgreement: '委托授权协议',
+  authAgreement: t('home.authAgreement'),
-  lawAgreement: '法律协议',
+  lawAgreement: t('home.lawAgreement'),
 }
 
 onMounted(() => {

src/views/borrowInfo/index.vue

@@ -3,7 +3,7 @@
   <div class="content">
     <j-gap height="120" background="#F9BF3A" opacity="0"/>
     <div class="action">
-      <view class="tt">申请时间 {{ new Date(borrowInfo.createTime).format('yyyy-MM-dd hh:mm:ss') }}</view>
+      <view class="tt">{{ $t('borrowInfo.applicationTime') }} {{ new Date(borrowInfo.createTime).format('yyyy-MM-dd hh:mm:ss') }}</view>
 
 
       <view class="footer-content">
@@ -13,7 +13,7 @@
           </van-steps>
         </view>
         <view class="footer-content-2">
-          <view class="footer-content-2-tit gray_color">温馨提示</view>
+          <view class="footer-content-2-tit gray_color">{{ $t('app.tips') }}</view>
           <view class="footer-content-2-content" :style="{color: stepBorrow.borrowNameStyle || '#e84a10'}">
             {{ stepBorrow.borrowRemark }}
           </view>
@@ -23,15 +23,15 @@
 
     <div class="action">
       <view class="tt">
-        <view>贷款详情</view>
+        <view>{{ $t('borrowInfo.loanDetails') }}</view>
       </view>
-      <van-cell title="贷款编号" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="borrowInfo.tradeNo" />
+      <van-cell :title="$t('borrowInfo.loanNo')" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="borrowInfo.tradeNo" />
-      <van-cell title="借款金额" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="toRoundMark(borrowInfo.totalLoanMoney)" />
+      <van-cell :title="$t('borrowInfo.loanAmount')" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="toRoundMark(borrowInfo.totalLoanMoney)" />
 <!--      <van-cell title="借款期限" title-style="color: #8997ae;" style="&#45;&#45;van-cell-value-color: #000" :value="borrowInfo.totalMonth + '个月'" />-->
-      <van-cell title="贷款周期" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="borrowInfo.totalMonth + '个月'" />
+      <van-cell :title="$t('borrowInfo.loanCycle')" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="borrowInfo.totalMonth + $t('app.month')" />
-      <van-cell title="提现银行" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="borrowInfo.bankType" />
+      <van-cell :title="$t('borrowInfo.withdrawalBank')" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="borrowInfo.bankType" />
-      <van-cell title="每期还款" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="toRoundMark(borrowInfo.avgRepayment)" />
+      <van-cell :title="$t('borrowInfo.repaymentPerInstallment')" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="toRoundMark(borrowInfo.avgRepayment)" />
-      <van-cell title="描述" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="borrowInfo.noteRemark" />
+      <van-cell :title="$t('borrowInfo.describe')" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="borrowInfo.noteRemark" />
 
 
 
@@ -46,16 +46,18 @@ import {getBorrowInfo, getUserInfo} from "@/api";
 import {resetData} from "@/utils/dataUtil";
 import {useRoute} from "vue-router";
 import {toRoundMark} from "@/utils";
+import { useI18n } from 'vue-i18n';
 
 const route = useRoute()
 const active = ref(0);
+const { t } = useI18n()
 
 const stepBorrow = reactive({
   "borrowNameStyle": "",
   "borrowRemark": "",
   "borrowStep": [
     {
-      "name": "提交成功",
+      "name": t('app.submittedSuccessfully'),
       "over": true
     },
     {
@@ -63,7 +65,7 @@ const stepBorrow = reactive({
       "over": true
     },
     {
-      "name": "到账成功",
+      "name": t('app.receivedSuccessfully'),
       "over": false
     }
   ]

src/views/forget/index.vue

@@ -8,8 +8,8 @@
       v-model="loginData.phoneNumber"
       v-if="flag === '1'"
       class="login-btn"
-      label="手机号码"
+      :label="$t('app.phoneNumber')"
-      placeholder="请输入手机号码"
+      :placeholder="$t('app.enter') + $t('app.phoneNumber')"
       label-align="top"
       style="background: #12332100"
       type="tel"
@@ -19,8 +19,8 @@
       v-model="loginData.code"
       class="login-btn"
       v-if="flag === '1'"
-      label="验证码"
+      :label="$t('app.verificationCode')"
-      placeholder="请输入验证码"
+      :placeholder="$t('app.enter') + $t('app.verificationCode')"
       label-align="top"
       style="background: #12332100"
       type="number"
@@ -29,10 +29,10 @@
         <div class="password-btn">
           <van-count-down v-show="countDownFlag" ref="countDown" :auto-start="false" :time="time" @finish="onFinish">
             <template #default="timeData">
-              <span class="block">{{ timeData.seconds }}秒</span>
+              <span class="block">{{ timeData.seconds }}{{ $t('app.second') }}</span>
             </template>
           </van-count-down>
-          <div v-show="!countDownFlag" style="color: #bc7c1c" @click="start">发送验证码</div>
+          <div v-show="!countDownFlag" style="color: #bc7c1c" @click="start">{{ $t('app.send') }}{{ $t('app.verificationCode') }}</div>
         </div>
       </template>
     </van-field>
@@ -41,9 +41,9 @@
       v-model="loginData.password"
       class="login-btn"
       v-if="flag === '2'"
-      label="登录密码"
+      :label="$t('app.login') + $t('app.password')"
       label-align="top"
-      placeholder="请设置6-16位密码"
+      :placeholder="$t('app.passwordPlaceholder')"
       style="background: #12332100"
       type="password"
     />
@@ -52,9 +52,9 @@
       v-model="loginData.confirmPassword"
       class="login-btn"
       v-if="flag === '2'"
-      label="确认密码"
+      :label="$t('app.confirm') + $t('app.password')"
       label-align="top"
-      placeholder="请再次输入密码"
+      :placeholder="$t('app.passwordPlaceholder1')"
       style="background: #12332100"
       type="password"
     />
@@ -67,7 +67,7 @@
       v-if="flag === '1'"
       @click.stop="next"
     >
-      下一步
+      {{ $t('app.next') }}
     </van-button>
 
     <van-button
@@ -78,7 +78,7 @@
       v-if="flag === '2'"
       @click.stop="updatePwdBtn"
     >
-      确认修改
+      {{ $t('app.confirm') }}{{ $t('app.update') }}
     </van-button>
 
 
@@ -89,6 +89,7 @@
 import {reactive, ref} from "vue";
 import {sendSmsForget, updatePwd} from "@/api/login";
 import {showToast} from "vant";
+import { useI18n } from 'vue-i18n';
 
 const loginData = reactive({
   phone: null,
@@ -100,6 +101,7 @@ const loginData = reactive({
 })
 
 const flag = ref('1')
+const { t } = useI18n()
 
 
 const time = ref(60 * 1000);
@@ -118,7 +120,7 @@ const start = () => {
       onFinish()
     })
   } else {
-    showToast('请输入手机号')
+    showToast(t('app.enter') + t('app.phoneNumber'))
   }
 };
 

src/views/index/home/index.vue

@@ -12,20 +12,20 @@
     <div :style="{padding: '0 ' + px2vw(30) + ' ' + px2vw(20)}">
 
       <div class="product">
-        <div class="product-title">产品详情</div>
+        <div class="product-title">{{$t('home.productDetails')}}</div>
 
         <div class="product-content">
           <div class="product-content-label">
-            <div>最低日息</div>
+            <div>{{$t('home.minimumDailyInterestRate')}}</div>
             <div><span>{{ calLoan.loanRate }}%</span></div>
           </div>
           <div class="product-content-label">
-            <div>借款额度</div>
+            <div>{{$t('home.borrowingLimit')}}</div>
             <div><span>¥{{ loans.loansMinAccount }}-{{ loans.loansMaxAccount }}</span></div>
           </div>
           <div class="product-content-label">
-            <div>分期期限</div>
+            <div>{{$t('home.installmentPeriod')}}</div>
-            <div><span>可选{{ loans.loansMonth.replaceAll(',', '/') }}</span></div>
+            <div><span>{{$t('home.optional')}}{{ loans.loansMonth.replaceAll(',', '/') }}</span></div>
           </div>
         </div>
 
@@ -33,7 +33,7 @@
 
 
       <div class="apply">
-        <div class="apply-title yellow_color">申请金额(元)</div>
+        <div class="apply-title yellow_color">{{$t('home.applicationAmount')}}({{$t('app.yuan')}})</div>
 
         <div class="apply-money">{{ strip }}</div>
 
@@ -52,10 +52,10 @@
         </div>
 
         <div class="apply-jkqx">
-          <div class="apply-jkqx-title">借款期限</div>
+          <div class="apply-jkqx-title">{{$t('home.loanTerm')}}</div>
           <div class="apply-jkqx-item-box">
             <div v-for="lm in loans.loansMonthList" :key="lm" class="apply-jkqx-item" :class="{'checked': lm === lmChecked}" @click="lmChecked = lm">
-              {{ lm }}个月
+              {{ lm }}{{$t('app.month')}}
             </div>
           </div>
         </div>
@@ -63,9 +63,9 @@
         <j-gap height="2" background="#fff"/>
 
         <div class="apply-mqhk">
-          <div>每期还款</div>
+          <div>{{ $t('home.repaymentPerInstallment') }}</div>
           <div>¥{{ calLoan.avgRepayment }}</div>
-          <div>(日利率{{ calLoan.loanRate }}% 总利息¥{{ calLoan.totalInterest }})</div>
+          <div>({{ $t('home.dailyInterestRate') }}{{ calLoan.loanRate }}% {{ $t('home.totalInterest') }}¥{{ calLoan.totalInterest }})</div>
         </div>
 
       </div>
@@ -75,17 +75,17 @@
       <van-icon :name="getAssetsImages('home/xlb.png')" size="30"/>
       <div>{{ loansUser.time }}</div>
       <div style="color: #ec6401">{{ loansUser.phone }}</div>
-      <div>成功借款</div>
+      <div>{{ $t('home.successfulBorrowing') }}</div>
       <div style="color: #BC7C1C; font-weight: 600;">¥{{ loansUser.amount }}</div>
     </div>
 
 
     <div class="xieyi">
       <van-checkbox v-model="checked" :icon-size="px2vw(28)" style="align-items: baseline" checked-color="linear-gradient(to right, #F9D88D, #D2A64C)">
-        我已阅读并同意
+        {{ $t('home.enterAgreement') }}
-        <span class="yellow_color1" @click.stop="go('authAgreement')">《委托授权协议》</span>
+        <span class="yellow_color1" @click.stop="go('authAgreement')">《{{ $t('home.authAgreement') }}》</span>
-        <span class="yellow_color1" @click.stop="go('serviceAgreement')">《平台服务协议》</span>
+        <span class="yellow_color1" @click.stop="go('serviceAgreement')">《{{ $t('home.serviceAgreement') }}》</span>
-        <span class="yellow_color1" @click.stop="go('loansAgreement')">《借款协议》</span>
+        <span class="yellow_color1" @click.stop="go('loansAgreement')">《{{ $t('home.loansAgreement') }}》</span>
       </van-checkbox>
     </div>
 
@@ -97,7 +97,7 @@
         style="width: 100%; "
         @click.stop="immediateBorrowing"
       >
-        立即借款
+        {{ $t('home.immediateBorrowing') }}
       </van-button>
     </div>
 
@@ -115,10 +115,11 @@ import {resetData} from "@/utils/dataUtil";
 import {watch} from "vue-demi";
 import {showToast} from "vant";
 import JGap from "@/components/JGap/JGap.vue";
+import { useI18n } from 'vue-i18n';
 
 const user = useUserStore()
 const router = useRouter()
-
+const { t } = useI18n()
 const bannerList = [
   {
     bannerUrl: getAssetsImages('home/banner_home.png')
@@ -159,14 +160,14 @@ const immediateBorrowing = () => {
         }
       })
     } else {
-      showToast('请先填写个人资料')
+      showToast(t('home.pleaseFillInYourPersonalInformationFirst'))
       router.push({
         path: '/userInfo'
       })
     }
     return
   }
-  showToast('请阅读并同意相关协议')
+  showToast(t('home.pleaseEnterAgreement'))
 }
 
 const loans = reactive({

src/views/index/index.vue

@@ -6,7 +6,7 @@
 
     <van-tabbar route v-model="active" active-color="#F9BF3A">
       <van-tabbar-item v-for="tabBar in tabBarList" :key="tabBar.name" :replace="tabBar.replace" :to="tabBar.to">
-        <span>{{ tabBar.text }}</span>
+        <span>{{ $t(tabBar.text) }}</span>
         <template #icon="props">
           <van-icon :color="props.active ? '' : 'rgb(229, 229, 229)'" :name="props.active ? tabBar.active : tabBar.inactive" />
         </template>
@@ -16,16 +16,16 @@
 </template>
 
 <script setup lang="ts">
-import {ref} from "vue";
+import { reactive, ref } from 'vue';
-import JGap from "@/components/JGap/JGap.vue";
 import {getAssetsImages} from "@/utils";
-import {useBackgroundHook} from "@/hooks/useBackgroundHook";
+import { useI18n } from 'vue-i18n';
 
-const tabBarList = [
+const { t } = useI18n()
+const tabBarList = reactive([
   {
     to: '/home',
     name: 'home',
-    text: '首页',
+    text: 'app.home',
     replace: true,
     active: getAssetsImages('tabBar/home-active.png'),
     inactive: getAssetsImages('tabBar/home-inactive.png')
@@ -33,7 +33,7 @@ const tabBarList = [
   {
     to: '/serveList',
     name: 'serveList',
-    text: '钱包',
+    text: 'app.serveList',
     replace: true,
     active: getAssetsImages('tabBar/artificer-active.png'),
     inactive: getAssetsImages('tabBar/artificer-inactive.png')
@@ -41,7 +41,7 @@ const tabBarList = [
   {
     to: '/message',
     name: 'message',
-    text: '客服',
+    text: 'app.message',
     replace: true,
     active: 'chat',
     inactive: 'chat'
@@ -49,17 +49,15 @@ const tabBarList = [
   {
     to: '/my',
     name: 'my',
-    text: '我的',
+    text: 'app.my',
     replace: true,
     active: getAssetsImages('tabBar/my-active.png'),
     inactive: getAssetsImages('tabBar/my-inactive.png')
   }
-]
+])
 
 const active = ref(0)
 
-// const {setBodyBackground} = useBackgroundHook()
-// setBodyBackground()
 </script>
 
 

src/views/index/my/index.vue

@@ -9,21 +9,21 @@
   <div class="content">
 
     <div class="action">
-      <van-cell title="我的资料" is-link to="userInfo" >
+      <van-cell :title="$t('my.userInfo')" is-link to="userInfo" >
         <template #icon>
           <div style="display: flex; justify-content: center; align-items: center; padding-right: 5px">
             <van-icon :name="getAssetsImages('my/my_info.png')" />
           </div>
         </template>
       </van-cell>
-      <van-cell title="我的借款" is-link to="myLoan" >
+      <van-cell :title="$t('my.loan')" is-link to="myLoan" >
         <template #icon>
           <div style="display: flex; justify-content: center; align-items: center; padding-right: 5px">
             <van-icon :name="getAssetsImages('my/my_info1.png')" />
           </div>
         </template>
       </van-cell>
-      <van-cell title="我的还款" is-link to="myRepayment" >
+      <van-cell :title="$t('my.repayment')" is-link to="myRepayment" >
         <template #icon>
           <div style="display: flex; justify-content: center; align-items: center; padding-right: 5px">
             <van-icon :name="getAssetsImages('my/my_info2.png')" />
@@ -37,7 +37,7 @@
 <!--          </div>-->
 <!--        </template>-->
 <!--      </van-cell>-->
-      <van-cell title="法律责任" is-link @click="go('/agreement', 'lawAgreement')" >
+      <van-cell :title="$t('my.legalLiability')" is-link @click="go('/agreement', 'lawAgreement')" >
         <template #icon>
           <div style="display: flex; justify-content: center; align-items: center; padding-right: 5px">
             <van-icon :name="getAssetsImages('my/my_info4.png')" />
@@ -60,14 +60,21 @@
 <!--      </van-cell>-->
     </div>
     <div class="action">
-      <van-cell title="修改密码" is-link to="uploadPassword" >
+      <van-cell :title="$t('my.uploadPassword')" is-link to="uploadPassword" >
         <template #icon>
           <div style="display: flex; justify-content: center; align-items: center; padding-right: 5px">
             <van-icon :name="getAssetsImages('my/my_info5.png')" />
           </div>
         </template>
       </van-cell>
-      <van-cell title="退出登录" is-link @click="logout" >
+      <van-cell :title="$t('my.language')" is-link @click="checkLanguage()" >
+        <template #icon>
+          <div style="display: flex; justify-content: center; align-items: center; padding-right: 5px">
+            <van-icon name="chat-o" />
+          </div>
+        </template>
+      </van-cell>
+      <van-cell :title="$t('my.logout')" is-link @click="logout" >
         <template #icon>
           <div style="display: flex; justify-content: center; align-items: center; padding-right: 5px">
             <van-icon :name="getAssetsImages('my/my_info66.png')" />
@@ -86,17 +93,20 @@ import {useRouter} from "vue-router";
 import {onMounted, reactive, ref} from "vue";
 import {getCustomerInfo} from "@/api";
 import {resetData} from "@/utils/dataUtil";
+import { useI18n } from 'vue-i18n';
+import { getDefaultLocal } from '@/api/system/user';
 
 const userStore = useUserStore()
 const router = useRouter()
+const { t } = useI18n()
 
 const headerImage = ref('https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg')
 
 const logout = () => {
 
   showConfirmDialog({
-    title: '提示',
+    title: t('app.prompt'),
-    message: '您确定要退出登录吗',
+    message: t('app.enterLogout'),
     width: '500px'
   })
     .then(() => {
@@ -121,6 +131,17 @@ const go = (url, key) => {
   })
 }
 
+const checkLanguage = () => {
+  getDefaultLocal().then(res => {
+    console.log('res', res)
+    if (res === 'gu_IN') {
+      localStorage.setItem('lang', 'id')
+    } else {
+      localStorage.setItem('lang', 'zh')
+    }
+    location.reload()
+  })
+}
 
 
 const customerInfo = reactive({

src/views/index/serveList/index.vue

@@ -4,16 +4,16 @@
     <view class="bg-1">
       <view class="bg-1-1">
         <div class="header-head" :style="{'--bg-image': `url(${headerImage}) no-repeat`}"></div>
-        <view class="bg-1-1-text">我的贷款：{{toRoundMark(customerInfo.borrowAccount)}}</view>
+        <view class="bg-1-1-text">{{$t('serveList.loan')}}：{{toRoundMark(customerInfo.borrowAccount)}}</view>
       </view>
 
       <view class="accountBalance" style="border-bottom: 1px #fff dashed;">
-        <view class="yellow_color">账户余额（元）</view>
+        <view class="yellow_color">{{$t('serveList.balance')}}（{{$t('app.yuan')}}）</view>
         <view class="money">{{ toRoundMark(customerInfo.account) }}</view>
       </view>
 
       <view class="accountBalance">
-        <view class="yellow_color">待还款金额（元）</view>
+        <view class="yellow_color">{{$t('serveList.amountToBeRepaid')}}（{{$t('app.yuan')}}）</view>
         <view class="money">{{ toRoundMark(customerInfo.repaymentAccount) }}</view>
       </view>
 
@@ -25,7 +25,7 @@
           style="color: #e6a600;width: 80%"
           @click.stop="withdrawalBtn"
         >
-          立即提现
+          {{$t('serveList.immediateWithdrawal')}}
         </van-button>
       </view>
     </view>
@@ -33,7 +33,7 @@
     <view class="footer">
       <view class="footer-t gray_color ">
         <van-icon :name="getAssetsImages('common/yhd.png')" size="18"/>
-        账户资金安全由银行保障
+        {{$t('serveList.financialSecurity')}}
       </view>
 
       <view class="footer-content">
@@ -43,7 +43,7 @@
           </van-steps>
         </view>
         <view class="footer-content-2">
-          <view class="footer-content-2-tit gray_color">温馨提示</view>
+          <view class="footer-content-2-tit gray_color">{{$t('app.tips')}}</view>
           <view class="footer-content-2-content" :style="{color: stepBorrow.borrowNameStyle || '#e84a10'}">
             {{ stepBorrow.borrowRemark }}
           </view>
@@ -51,8 +51,8 @@
       </view>
     </view>
   </div>
-  <van-dialog :width="px2vw(650)" v-model:show="withdrawalShow" title="提现" show-cancel-button @confirm="saveUserInfoBtn">
+  <van-dialog :width="px2vw(650)" v-model:show="withdrawalShow" :title="$t('app.withdrawalAmount')" show-cancel-button @confirm="saveUserInfoBtn">
-    <van-field v-model="withdrawAmount" type="number" label="提现金额" placeholder="请输入你的提现金额"/>
+    <van-field v-model="withdrawAmount" type="number" :label="$t('app.withdrawalAmount')" :placeholder="$t('app.pleaseWithdrawalAmount')"/>
   </van-dialog>
 </template>
 
@@ -64,10 +64,12 @@ import {useRouter} from "vue-router";
 import {getBorrowWithdraw, getCustomerInfo, getStepBorrow} from "@/api";
 import {resetData} from "@/utils/dataUtil";
 import {getAssetsImages, px2vw, toRoundMark} from "../../../utils";
+import { useI18n } from 'vue-i18n';
 
 
 const router = useRouter()
 const userStore = useUserStore()
+const { t } = useI18n()
 
 const withdrawalShow = ref(false);
 const withdrawAmount = ref(0);
@@ -112,15 +114,15 @@ const stepBorrow = reactive({
   "borrowRemark": "",
   "borrowStep": [
     {
-      "name": "提交成功",
+      "name": t('app.submittedSuccessfully'),
       "over": true
     },
     {
-      "name": "银行卡异常",
+      "name": t('app.bankCardAbnormality'),
       "over": true
     },
     {
-      "name": "到账成功",
+      "name": t('app.receivedSuccessfully'),
       "over": false
     }
   ]
@@ -157,7 +159,7 @@ const saveUserInfoBtn = () => {
   // })
   //   .then(() => {
       getBorrowWithdraw({withdrawAmount: withdrawAmount.value}).then(res => {
-        showToast('提现成功')
+        showToast(t('app.withdrawal') + t('app.success'))
         router.push({
           path: '/serveList'
         })

src/views/loans/info/index.vue

@@ -4,30 +4,30 @@
     <j-gap height="120" background="#F9BF3A" opacity="0"/>
     <div class="action">
       <view class="tt">
-        确认借款信息
+        {{ $t('app.confirm') }}{{ $t('borrowInfo.loanInfo') }}
       </view>
-      <van-cell title="借款金额" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="toRoundMark(loansInfo.totalLoanMoney)" />
+      <van-cell :title="$t('borrowInfo.loanAmount')" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="toRoundMark(loansInfo.totalLoanMoney)" />
-      <van-cell title="借款期限" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="loansInfo.totalMonth + '个月'" />
+      <van-cell :title="$t('home.loanTerm')" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="loansInfo.totalMonth + '个月'" />
-      <van-cell title="到账银行" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="userInfo.bankType" />
+      <van-cell :title="$t('borrowInfo.withdrawalBank')" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="userInfo.bankType" />
-      <van-cell title="收款账号" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="backCardNumDesensitization(userInfo.backCardNum)" />
+      <van-cell :title="$t('borrowInfo.receivingAccount')" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="backCardNumDesensitization(userInfo.backCardNum)" />
     </div>
 
     <div class="action">
       <view class="tt">
-        借款用途
+        {{ $t('borrowInfo.usageOfLoan') }}
       </view>
       <van-field
         v-model="loansInfo.noteRemark"
         rows="5"
         autosize
         type="textarea"
-        placeholder="请输入你的借款用途"
+        :placeholder="$t('app.enter') + $t('borrowInfo.usageOfLoan')"
       />
     </div>
     <div class="xieyi">
       <van-checkbox v-model="checked" :icon-size="px2vw(28)" style="align-items: baseline" checked-color="linear-gradient(to right, #F9D88D, #D2A64C)">
-        我已阅读并同意
+        {{ $t('home.enterAgreement') }}
-        <span class="yellow_color1" @click.stop="go('loansAgreement')">《借款协议》</span>
+        <span class="yellow_color1" @click.stop="go('loansAgreement')">《{{ $t('home.loansAgreement') }}》</span>
       </van-checkbox>
     </div>
 
@@ -40,7 +40,7 @@
         @click.stop="saveUserInfoBtn"
         :disabled="!checked"
       >
-        提交申请
+        {{ $t('app.submitApplication') }}
       </van-button>
     </div>
   </div>
@@ -54,10 +54,12 @@ import {useUserStore} from "@/store/modules/user";
 import {getUserInfo, startBorrow} from "@/api";
 import {resetData} from "@/utils/dataUtil";
 import {showConfirmDialog, showToast} from "vant";
+import { useI18n } from 'vue-i18n';
 
 const useUser = useUserStore()
 const router = useRouter()
 const route = useRoute()
+const { t } = useI18n()
 
 const loansInfo = reactive({
   "customerId": useUser.getUserInfo.id,
@@ -81,13 +83,13 @@ const go = (key) => {
 const saveUserInfoBtn = () => {
 
   showConfirmDialog({
-    title: '提示',
+    title: t('app.prompt'),
-    message: '您确定要申请贷款吗',
+    message: t('loans.enterSubmitApplication'),
     width: '500px'
   })
     .then(() => {
       startBorrow(loansInfo).then(res => {
-        showToast('申请成功')
+        showToast(t('app.submittedSuccessfully'))
         router.push({
           path: '/serveList'
         })

src/views/loans/info1/index.vue

@@ -4,21 +4,21 @@
     <j-gap height="120" background="#F9BF3A" opacity="0"/>
     <div class="action">
       <view class="tt">
-        确认提现信息
+        {{ $t('app.confirm') }}{{ $t('app.withdrawal') }}{{ $t('app.info') }}
       </view>
-      <van-cell title="到账银行" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="userInfo.bankType" />
+      <van-cell :title="$t('borrowInfo.withdrawalBank')" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="userInfo.bankType" />
-      <van-cell title="收款账号" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="backCardNumDesensitization(userInfo.backCardNum)" />
+      <van-cell :title="$t('borrowInfo.receivingAccount')" title-style="color: #8997ae;" style="--van-cell-value-color: #000" :value="backCardNumDesensitization(userInfo.backCardNum)" />
     </div>
 
     <div class="action">
       <view class="tt">
-        提现金额
+        {{ $t('app.withdrawalAmount') }}
       </view>
       <van-field
         v-model="withdrawAmount"
-        label="金额"
+        :label="$t('app.withdrawalAmount')"
         type="number"
-        placeholder="请输入你的提现金额"
+        :placeholder="$t('app.enter') + $t('app.withdrawalAmount')"
       />
     </div>
 <!--    <div class="xieyi">-->
@@ -37,7 +37,7 @@
         @click.stop="saveUserInfoBtn"
         :disabled="!withdrawAmount || withdrawAmount == 0"
       >
-        提现
+        {{ $t('app.withdrawal') }}
       </van-button>
     </div>
   </div>
@@ -50,10 +50,12 @@ import {useUserStore} from "@/store/modules/user";
 import {getBorrowWithdraw, getUserInfo} from "@/api";
 import {resetData} from "@/utils/dataUtil";
 import {showConfirmDialog, showToast} from "vant";
+import { useI18n } from 'vue-i18n';
 
 const useUser = useUserStore()
 const router = useRouter()
 const route = useRoute()
+const { t } = useI18n()
 
 
 const withdrawAmount = ref()
@@ -72,13 +74,13 @@ const go = (key) => {
 const saveUserInfoBtn = () => {
 
   showConfirmDialog({
-    title: '提示',
+    title: t('app.prompt'),
-    message: '您确定要提现吗',
+    message: t('app.enterWithdrawal'),
     width: '500px'
   })
     .then(() => {
       getBorrowWithdraw({withdrawAmount: withdrawAmount.value}).then(res => {
-        showToast('提现成功')
+        showToast(t('app.prompt') + t('app.success'))
         router.push({
           path: '/serveList'
         })

src/views/login/index.vue

@@ -3,15 +3,15 @@
   <div class="content">
     <j-gap height="50" background="#F9BF3A" opacity="0"/>
     <div class="slogan">
-      <div class="slogan-1">登录</div>
+      <div class="slogan-1">{{ $t(('app.login')) }}</div>
     </div>
     <div class="input-box">
       <!-- 输入手机号，调起手机号键盘 -->
       <van-field
           v-model="loginData.mobile"
-          label="账号"
+          :label="$t('app.account')"
           class="login-btn"
-          placeholder="请输入账号"
+          :placeholder="$t('app.enter') + $t('app.account')"
           label-align="top"
           type="tel"
       />
@@ -19,8 +19,8 @@
       <!-- 允许输入数字，调起带符号的纯数字键盘 -->
       <van-field
           v-model="loginData.password"
-          label="密码"
+          :label="$t('app.password')"
-          placeholder="请输入密码"
+          :placeholder="$t('app.enter') + $t('app.password')"
           class="login-btn"
           label-align="top"
           type="password"
@@ -33,12 +33,12 @@
         style="width: 100%; margin: 20px 0"
         @click.stop="loginBtn"
       >
-        登录
+        {{ $t('app.login') }}
       </van-button>
 
       <view class="op">
-        <view @click="goRegister" class="register">注册账号</view>
+        <view @click="goRegister" class="register">{{ $t('app.register') }}{{ $t('app.account') }}</view>
-        <view @click="goForget" class="forget">忘记密码</view>
+        <view @click="goForget" class="forget">{{ $t('app.forgotPassword') }}</view>
       </view>
 
     </div>

src/views/my/contract/index.vue

@@ -2,7 +2,7 @@
   <div>
     <j-nav-bar />
     <div class="contract" v-if="contractHtml" v-html="contractHtml"></div>
-    <div v-else class="noData">暂无合同</div>
+    <div v-else class="noData">{{ $t('app.none') + $t('app.contract') }}</div>
   </div>
 </template>
 
@@ -11,8 +11,10 @@ import {onMounted, ref} from 'vue'
 import {getContract} from "@/api";
 import {showToast} from "vant";
 import {useRoute} from "vue-router";
+import { useI18n } from 'vue-i18n';
 
 const route = useRoute()
+const { t } = useI18n()
 
 const contractHtml = ref('')
 
@@ -24,7 +26,7 @@ const _getContract = () => {
       contractHtml.value = res
     })
   } else {
-    showToast('暂无合同')
+    showToast(t('app.none') + t('app.contract'))
   }
 }
 

src/views/my/myLoan/index.vue

@@ -10,19 +10,19 @@
       >
 
         <view class="j-item" v-for="item in borrowList" :key="item.id" @click="goInfo(item.tradeNo)">
-          <view class="j-item-t">贷款编号：{{item.tradeNo}}</view>
+          <view class="j-item-t">{{ $t('borrowInfo.loanNo') }}：{{item.tradeNo}}</view>
 
           <view style="display: flex; justify-content: space-between">
 
             <view class="j-item-c">
-              <view>贷款总额：{{ item.totalLoanMoney }}元</view>
+              <view>{{ $t('app.totalLoan') }}：{{ item.totalLoanMoney }}{{ $t('app.yuan') }}</view>
-              <view class="yellow_color1">每期还款：{{ item.avgRepayment }}*{{ item.totalMonth }}</view>
+              <view class="yellow_color1">{{ $t('home.repaymentPerInstallment') }}：{{ item.avgRepayment }}*{{ item.totalMonth }}</view>
-              <view>贷款申请日期：{{ new Date(item.createTime).format('yyyy-MM-dd hh:mm:ss') }}</view>
+              <view>{{ $t('borrowInfo.applicationTime') }}：{{ new Date(item.createTime).format('yyyy-MM-dd hh:mm:ss') }}</view>
             </view>
 
             <view :style="{paddingRight: px2vw(20)}" @click.stop="toContract(item.tradeNo)" style="display: flex; justify-content: center; align-items: center; flex-flow: column">
               <van-icon size="50" name="orders-o" />
-              合同
+              {{ $t('app.contract') }}
             </view>
           </view>
         </view>

src/views/my/myRepayment/index.vue

@@ -10,12 +10,12 @@
       >
 
         <view class="j-item" v-for="item in borrowList" :key="item.id" @click="goInfo(item.tradeNo)">
-          <view class="j-item-t">贷款编号：{{item.tradeNo}}</view>
+          <view class="j-item-t">{{ $t('borrowInfo.loanNo') }}：{{item.tradeNo}}</view>
 
           <view class="j-item-c">
-            <view>贷款总额：{{ item.totalLoanMoney }}元</view>
+            <view>{{ $t('app.totalLoan') }}：{{ item.totalLoanMoney }}{{ $t('app.yuan') }}</view>
-            <view class="yellow_color1">每期还款：{{ item.avgRepayment }}*{{ item.totalMonth }}</view>
+            <view class="yellow_color1">{{ $t('home.repaymentPerInstallment') }}：{{ item.avgRepayment }}*{{ item.totalMonth }}</view>
-            <view>贷款申请日期：{{ new Date(item.createTime).format('yyyy-MM-dd hh:mm:ss') }}</view>
+            <view>{{ $t('borrowInfo.applicationTime') }}：{{ new Date(item.createTime).format('yyyy-MM-dd hh:mm:ss') }}</view>
           </view>
         </view>
 

src/views/my/signature/index.vue

@@ -2,7 +2,7 @@
   <div>
     <j-nav-bar v-if="!useEdit" />
     <van-signature v-if="!useEdit" @submit="onSubmit" @clear="onClear" />
-    <div class="my-signature">我的签名：</div>
+    <div class="my-signature">{{ $t('app.my') + $t('app.signature') }}：</div>
     <van-image class="my-signature-image" v-if="userInfo.signature" :src="userInfo.signature" />
   </div>
 </template>

src/views/my/userInfo/index.vue

@@ -3,10 +3,10 @@
   <div class="content">
     <j-gap height="120" background="#F9BF3A" opacity="0"/>
     <van-cell-group inset>
-      <van-cell :style="{ padding: px2vw(40) + ' ' + px2vw(35)}" title="我的资料" is-link to="userInfo1" :value="userInfo.cardFlag ? '完整' : '不完整'">
+      <van-cell :style="{ padding: px2vw(40) + ' ' + px2vw(35)}" title="我的资料" is-link to="userInfo1" :value="userInfo.cardFlag ? $t('app.complete') : $t('app.noComplete')">
         <template #title>
-          <div class="t">身份信息</div>
+          <div class="t">{{ $t('app.identityInformation') }}</div>
-          <div class="t2">*让我们了解您的资料信息</div>
+          <div class="t2">*{{ $t('app.rwmljndzlxx') }}</div>
         </template>
         <template #icon>
           <div style="display: flex; justify-content: center; align-items: center; padding-right: 12px">
@@ -15,10 +15,10 @@
         </template>
       </van-cell>
 
-      <van-cell :style="{ padding: px2vw(40) + ' ' + px2vw(35)}" title="我的借款" is-link to="userInfo2" :value="userInfo.infoFlag ? '完整' : '不完整'">
+      <van-cell :style="{ padding: px2vw(40) + ' ' + px2vw(35)}" title="我的借款" is-link to="userInfo2" :value="userInfo.infoFlag ? $t('app.complete') : $t('app.noComplete')">
         <template #title>
-          <div class="t">资料信息</div>
+          <div class="t">{{ $t('app.information') }}</div>
-          <div class="t2">*让我们了解您的资料信息</div>
+          <div class="t2">*{{ $t('app.rwmljndzlxx') }}</div>
         </template>
         <template #icon>
           <div style="display: flex; justify-content: center; align-items: center; padding-right: 12px">
@@ -27,10 +27,10 @@
         </template>
       </van-cell>
 
-      <van-cell :style="{ padding: px2vw(40) + ' ' + px2vw(35)}" title="我的还款" is-link to="userInfo3" :value="userInfo.bankFlag ? '完整' : '不完整'">
+      <van-cell :style="{ padding: px2vw(40) + ' ' + px2vw(35)}" title="我的还款" is-link to="userInfo3" :value="userInfo.bankFlag ? $t('app.complete') : $t('app.noComplete')">
         <template #title>
-          <div class="t">收款银行卡</div>
+          <div class="t">{{ $t('app.receivingBank') }}</div>
-          <div class="t2">*让我们了解您的资料信息</div>
+          <div class="t2">*{{ $t('app.rwmljndzlxx') }}</div>
         </template>
         <template #icon>
           <div style="display: flex; justify-content: center; align-items: center; padding-right: 12px">
@@ -38,10 +38,10 @@
           </div>
         </template>
       </van-cell>
-      <van-cell v-if="userInfo.allowSignature" :style="{ padding: px2vw(40) + ' ' + px2vw(35)}" title="我的借款" is-link to="signature" :value="userInfo.signatureFlag ? '完整' : '不完整'" >
+      <van-cell v-if="userInfo.allowSignature" :style="{ padding: px2vw(40) + ' ' + px2vw(35)}" :title="$t('my.loan')" is-link to="signature" :value="userInfo.signatureFlag ? $t('app.complete') : $t('app.noComplete')" >
         <template #title>
-          <div class="t">签名信息</div>
+          <div class="t">{{ $t('app.signatureInformation') }}</div>
-          <div class="t2">*让我们了解您的资料信息</div>
+          <div class="t2">*{{ $t('app.rwmljndzlxx') }}</div>
         </template>
         <template #icon>
           <div style="display: flex; justify-content: center; align-items: center; padding-right: 12px">
@@ -59,7 +59,7 @@
         style="width: 100%; "
         @click.stop="goHome"
       >
-        立即借款
+        {{ $t('home.immediateBorrowing') }}
       </van-button>
     </div>
   </div>

src/views/my/userInfo1/index.vue

@@ -4,9 +4,23 @@
     <div class="content">
       <j-gap height="120" background="#F9BF3A" opacity="0"/>
       <div class="action">
-        <view class="tt">填写真实有效的信息，审核才会通过哦~</view>
+        <view class="tt">{{ $t('userInfo.realPrompt') }}~</view>
-        <van-field required v-model="userInfo.realName" type="text" label="姓名" placeholder="请输入真实姓名" :rules="[{ required: true, message: '请输入真实姓名' }]"/>
+        <van-field
-        <van-field required v-model="userInfo.cardNum" type="text" label="身份证号" placeholder="请输入真实身份证号" :rules="[{ required: true, message: '请输入真实身份证号' }]"/>
+          required
+          v-model="userInfo.realName"
+          type="text"
+          :label="$t('userInfo.name')"
+          :placeholder="$t('userInfo.enter') + $t('userInfo.name')"
+          :rules="[{ required: true, message: $t('userInfo.enter') + $t('userInfo.name') }]"
+        />
+        <van-field
+          required
+          v-model="userInfo.cardNum"
+          type="text"
+          :label="$t('userInfo.idCard')"
+          :placeholder="$t('userInfo.enter') + $t('userInfo.idCard')"
+          :rules="[{ required: true, message: $t('userInfo.enter') + $t('userInfo.idCard') }]"
+        />
 <!--        <van-field required label="身份证号" placeholder="请输入真实身份证号" v-model="userInfo.cardNum" readonly clickable @touchstart.stop="idCardKeyboardShow = true" :rules="[{ required: true, message: '请输入真实身份证号' }]"/>-->
 
 <!--        <van-number-keyboard-->
@@ -20,49 +34,55 @@
 
       <div class="action">
         <view class="tt">
-          <view>*需本人身份证，且内容清晰可辨</view>
+          <view>*{{ $t('userInfo.idCardPrompt') }}</view>
-          <view>请您确认拍照权限已开启</view>
+          <view>{{ $t('userInfo.photographPrompt') }}</view>
         </view>
 
         <view class="action-content">
 
           <view class="action-content-item">
-            <van-uploader :rules="[{ required: true, message: '点击上传身份证人像面' }]" required :after-read="afterReadIdFront" :before-read="beforeRead" :max-count="1">
+            <van-uploader
+              :rules="[{ required: true, message: $t('userInfo.idCardUp1') }]"
+              required
+              :after-read="afterReadIdFront"
+              :before-read="beforeRead"
+              :max-count="1"
+            >
               <div class="id-card-box">
                 <van-image v-if="userInfo.cardBackPicture" :height="px2vw(156)" :src="userInfo.cardBackPicture"
                            :width="px2vw(236)"/>
                 <van-image v-if="!userInfo.cardBackPicture" :height="px2vw(156)" :src="getAssetsImages('my/idcard1.png')"
                            :width="px2vw(236)"/>
                 <div :style="{fontSize: px2vw(26)}" style="color: #858B9C; width: 100%; text-align: center; padding-top: 10px">
-                  点击上传身份证人像面
+                  {{ $t('userInfo.idCardUp1') }}
                 </div>
               </div>
             </van-uploader>
           </view>
 
           <view class="action-content-item">
-            <van-uploader :rules="[{ required: true, message: '点击上传身份证国徽面' }]" required :after-read="afterReadIdBack" :before-read="beforeRead" :max-count="1">
+            <van-uploader :rules="[{ required: true, message: $t('userInfo.idCardUp2') }]" required :after-read="afterReadIdBack" :before-read="beforeRead" :max-count="1">
               <div class="id-card-box">
                 <van-image v-if="userInfo.cardFrontPicture" :height="px2vw(156)" :src="userInfo.cardFrontPicture"
                            :width="px2vw(236)"/>
                 <van-image v-if="!userInfo.cardFrontPicture" :height="px2vw(156)" :src="getAssetsImages('my/idcard1.png')"
                            :width="px2vw(236)"/>
                 <div :style="{fontSize: px2vw(26)}" style="color: #858B9C; width: 100%; text-align: center; padding-top: 10px">
-                  点击上传身份证国徽面
+                  {{ $t('userInfo.idCardUp2') }}
                 </div>
               </div>
             </van-uploader>
           </view>
 
           <view class="action-content-item">
-            <van-uploader :rules="[{ required: true, message: '点击上传手持身份证照' }]" required :after-read="afterReadAvatar" :before-read="beforeRead" :max-count="1">
+            <van-uploader :rules="[{ required: true, message: $t('userInfo.idCardUp3' }]" required :after-read="afterReadAvatar" :before-read="beforeRead" :max-count="1">
               <div class="id-card-box">
                 <van-image v-if="userInfo.handCardPicture" :height="px2vw(156)" :src="userInfo.handCardPicture"
                            :width="px2vw(236)"/>
                 <van-image v-if="!userInfo.handCardPicture" :height="px2vw(156)" :src="getAssetsImages('my/idcard1.png')"
                            :width="px2vw(236)"/>
                 <div :style="{fontSize: px2vw(26)}" style="color: #858B9C; width: 100%; text-align: center; padding-top: 10px">
-                  点击上传手持身份证照
+                  {{ $t('userInfo.idCardUp3') }}
                 </div>
               </div>
             </van-uploader>
@@ -70,23 +90,23 @@
 
 
           <view style="width: 100%; padding: 20px 0">
-            <view>拍摄要求</view>
+            <view>{{ $t('userInfo.shootingRequirements') }}</view>
             <view style="display: flex; justify-content: space-between; align-items: center">
               <view style="display: flex; justify-content: center; align-items: center; flex-flow: column">
                 <van-image :height="px2vw(92)" :width="px2vw(148)" :src="getAssetsImages('my/idcard2.png')"/>
-                <view class="gray_color font-22">√标准拍摄</view>
+                <view class="gray_color font-22">√{{ $t('userInfo.standardShooting') }}</view>
               </view>
               <view style="display: flex; justify-content: center; align-items: center; flex-flow: column">
                 <van-image :height="px2vw(92)" :width="px2vw(148)" :src="getAssetsImages('my/idcard3.png')"/>
-                <view class="gray_color font-22">×边框缺失</view>
+                <view class="gray_color font-22">×{{ $t('userInfo.missingBorder') }}</view>
               </view>
               <view style="display: flex; justify-content: center; align-items: center; flex-flow: column">
                 <van-image :height="px2vw(92)" :width="px2vw(148)" :src="getAssetsImages('my/idcard4.png')"/>
-                <view class="gray_color font-22">×照片模糊</view>
+                <view class="gray_color font-22">×{{ $t('userInfo.outOfFocus') }}</view>
               </view>
               <view style="display: flex; justify-content: center; align-items: center; flex-flow: column">
                 <van-image :height="px2vw(92)" :width="px2vw(148)" :src="getAssetsImages('my/idcard5.png')"/>
-                <view class="gray_color font-22">×闪光强烈</view>
+                <view class="gray_color font-22">×{{ $t('userInfo.flashStrongly') }}</view>
               </view>
             </view>
           </view>
@@ -105,7 +125,7 @@
         native-type="submit"
         :disabled="!useEdit || !(userInfo.realName && userInfo.cardNum)"
       >
-        提交
+        {{ $t('app.submit') }}
       </van-button>
     </div>
   </van-form>
@@ -119,8 +139,10 @@ import {getAssetsImages, px2vw} from "@/utils";
 import {showToast} from "vant";
 import {useRouter} from "vue-router";
 import {useUpload} from "@/hooks/useUpload";
+import { useI18n } from 'vue-i18n';
 
 const idCardKeyboardShow = ref(false)
+const { t } = useI18n()
 
 const userInfo = reactive({
   backCardNum: '',
@@ -163,7 +185,7 @@ const _getBorrowPage = () => {
 
 const beforeRead = (file) => {
   if (file.type !== 'image/jpeg' && file.type !== 'image/png') {
-    showToast('请上传 jpg 或者 png 格式图片');
+    showToast(t('app.upPNGOrJPG'));
     return false;
   }
   return true;

src/views/my/userInfo2/index.vue

@@ -1,37 +1,78 @@
 <template>
-  <j-nav-bar color="#FFF" nav-bar-background="#f9bf3a" :placeholder="false"/>
+  <j-nav-bar color="#FFF" nav-bar-background="#f9bf3a" :placeholder="false" />
 
   <van-form @submit="saveUserInfoBtn">
     <div class="content">
-      <j-gap height="120" background="#F9BF3A" opacity="0"/>
+      <j-gap height="120" background="#F9BF3A" opacity="0" />
       <div class="action">
-        <view class="tt">填写真实有效的信息，审核才会通过哦~</view>
+        <view class="tt">{{ $t('userInfo.realPrompt') }}~</view>
-<!--        <van-field required v-model="userInfo.realName" type="text" label="姓名" placeholder="请输入真实姓名" :rules="[{ required: true, message: '请输入真实姓名' }]"/>-->
+        <!--        <van-field required v-model="userInfo.realName" type="text" label="姓名" placeholder="请输入真实姓名" :rules="[{ required: true, message: '请输入真实姓名' }]"/>-->
-        <van-field required v-model="userInfo.companyName" type="text" label="单位名称" placeholder="请输入单位名称" :rules="[{ required: true, message: '请输入单位名称' }]"/>
+        <van-field
-        <van-field required v-model="userInfo.companyTitle" type="text" label="职位" placeholder="请输入职位" :rules="[{ required: true, message: '请输入职位' }]"/>
+          required
-        <van-field required v-model="userInfo.companyPhone" type="tel" label="单位电话" placeholder="号码加区号（非必填）" :rules="[{ required: true, message: '号码加区号' }]"/>
+          v-model="userInfo.companyName"
-        <van-field required v-model="userInfo.companyYear" type="number" label="工作年龄" placeholder="请输入工龄" :rules="[{ required: true, message: '请输入工龄' }]"/>
+          type="text"
-        <van-field required v-model="userInfo.incomeWan" type="number" label="月薪" placeholder="请输入月薪" :rules="[{ required: true, message: '请输入月薪' }]"/>
+          :label="$t('userInfo.unitName')"
+          :placeholder="$t('app.enter') + $t('userInfo.unitName')"
+          :rules="[{ required: true, message: $t('app.enter') + $t('userInfo.unitName') }]"
+        />
+        <van-field
+          required
+          v-model="userInfo.companyTitle"
+          type="text"
+          :label="$t('userInfo.position')"
+          :placeholder="$t('app.enter') + $t('userInfo.position')"
+          :rules="[{ required: true, message: $t('app.enter') + $t('userInfo.position') }]"
+        />
+        <van-field
+          required
+          v-model="userInfo.companyPhone"
+          type="tel"
+          :label="$t('userInfo.workTelephone')"
+          :placeholder="$t('app.enter') + $t('userInfo.workTelephone')"
+          :rules="[{ required: true, message: $t('app.enter') + $t('userInfo.workTelephone') }]"
+          />
+        <van-field
+          required
+          v-model="userInfo.companyYear"
+          type="number"
+          :label="$t('userInfo.workingAge')"
+          :placeholder="$t('app.enter') + $t('userInfo.workingAge')"
+          :rules="[{ required: true, message: $t('app.enter') + $t('userInfo.workingAge') }]"
+        />
+        <van-field
+          required v-model="userInfo.incomeWan"
+          type="number"
+          :label="$t('userInfo.monthlyPay')"
+          :placeholder="$t('app.enter') + $t('userInfo.monthlyPay')"
+          :rules="[{ required: true, message: $t('app.enter') + $t('userInfo.monthlyPay') }]"
+        />
         <van-field
           v-model="userInfo.companyAddress"
           is-link
           required
           readonly
-          :rules="[{ required: true, message: '请选择省市区' }]"
+          :label="$t('userInfo.unitAddress')"
-          label="单位地址"
+          :placeholder="$t('app.select') + $t('userInfo.unitAddress')"
-          placeholder="请选择省市区"
+          :rules="[{ required: true, message: $t('app.select') + $t('userInfo.unitAddress') }]"
           @click="companyAddressShow = true"
         />
         <van-popup v-model:show="companyAddressShow" round position="bottom">
           <van-cascader
             v-model="cascaderValue"
-            title="请选择所在地区"
+            :title="$t('app.select') + $t('userInfo.unitAddress')"
             :options="options"
             @close="companyAddressShow = false"
             @finish="onFinish"
           />
         </van-popup>
-        <van-field required v-model="userInfo.companyAddressInfo" type="text" label="详细地址" placeholder="请输入详细地址" :rules="[{ required: true, message: '请输入详细地址' }]"/>
+        <van-field
+          required
+          v-model="userInfo.companyAddressInfo"
+          type="text"
+          :label="$t('userInfo.addressInfo')"
+          :placeholder="$t('app.enter') + $t('userInfo.addressInfo')"
+          :rules="[{ required: true, message: $t('app.enter') + $t('userInfo.addressInfo') }]"
+        />
 
 
         <van-field
@@ -39,38 +80,58 @@
           is-link
           required
           readonly
-          :rules="[{ required: true, message: '请选择所在地区' }]"
+          :label="$t('userInfo.currentResidentialAddress')"
-          label="现居住地址"
+          :placeholder="$t('app.select') + $t('userInfo.currentResidentialAddress')"
-          placeholder="请选择所在地区"
+          :rules="[{ required: true, message: $t('app.select') + $t('userInfo.currentResidentialAddress') }]"
           @click="customerAddressShow = true"
         />
         <van-popup v-model:show="customerAddressShow" round position="bottom">
           <van-cascader
             v-model="customerAddressValue"
-            title="请选择所在地区"
+            :title="$t('app.select') + $t('userInfo.currentResidentialAddress')"
             :options="options"
             @close="customerAddressShow = false"
             @finish="onCustomerAddressFinish"
           />
         </van-popup>
-        <van-field required v-model="userInfo.customerAddressInfo" type="text" label="详细地址" placeholder="例：东北石油大学启智寝室楼2A603" :rules="[{ required: true, message: '请输入详细地址' }]"/>
+        <van-field
+          required
+          v-model="userInfo.customerAddressInfo"
+          type="text"
+          :label="$t('userInfo.addressInfo')"
+          :placeholder="$t('app.enter') + $t('userInfo.addressInfo')"
+          :rules="[{ required: true, message: $t('app.enter') + $t('userInfo.addressInfo') }]"
+        />
       </div>
 
       <div class="action">
         <view class="tt">
-          直系亲属联系人
+          {{ $t('userInfo.directFamilyContactPerson') }}
         </view>
 
-        <van-field required v-model="userInfo.kinsfolkName" type="text" label="姓名" placeholder="请输入真实姓名" :rules="[{ required: true, message: '请输入真实姓名' }]"/>
+        <van-field
-        <van-field required v-model="userInfo.kinsfolkPhone" type="tel" label="手机号码" placeholder="请输入手机号码" :rules="[{ required: true, message: '请输入手机号码' }]"/>
+          required
+          v-model="userInfo.kinsfolkName"
+          type="text"
+          :label="$t('userInfo.name')"
+          :placeholder="$t('userInfo.enter') + $t('userInfo.name')"
+          :rules="[{ required: true, message: $t('userInfo.enter') + $t('userInfo.name') }]"
+        />
+        <van-field
+          required v-model="userInfo.kinsfolkPhone"
+          type="tel"
+          :label="$t('app.phoneNumber')"
+          :placeholder="$t('app.enter') + $t('app.phoneNumber')"
+          :rules="[{ required: true, message: $t('app.enter') + $t('app.phoneNumber') }]"
+        />
         <van-field
           v-model="userInfo.kinsfolkRefText"
           is-link
-          :rules="[{ required: true, message: '请选择关系' }]"
+          :rules="[{ required: true, message: $t('app.select') + $t('userInfo.relationship') }]"
           required
           readonly
-          label="关系"
+          :label="$t('userInfo.relationship')"
-          placeholder="请选择关系"
+          :placeholder="$t('app.select') + $t('userInfo.relationship')"
           @click="showPicker = true"
         />
         <van-popup v-model:show="showPicker" round position="bottom">
@@ -93,29 +154,31 @@
         native-type="submit"
         :disabled="!useEdit"
       >
-        提交
+        {{ $t('app.submit') }}
       </van-button>
     </div>
   </van-form>
 </template>
 
 <script lang="ts" setup>
-import {onMounted, reactive, ref} from "vue";
+import { onMounted, reactive, ref } from 'vue';
-import {getBorrowPage, getUserInfo, updateCustomerCard} from "@/api";
+import { getBorrowPage, getUserInfo, updateCustomerCard } from '@/api';
-import {resetData} from "@/utils/dataUtil";
+import { resetData } from '@/utils/dataUtil';
-import {showToast} from "vant";
+import { useRouter } from 'vue-router';
-import {useRouter} from "vue-router";
+import { useCascaderAreaData } from '@vant/area-data';
-import {useCascaderAreaData} from "@vant/area-data";
+import { useI18n } from 'vue-i18n';
 
-const companyAddressShow = ref(false)
+const { t } = useI18n()
-const customerAddressShow = ref(false)
+
+const companyAddressShow = ref(false);
+const customerAddressShow = ref(false);
 const cascaderValue = ref('');
 const customerAddressValue = ref('');
 const columns = [
-  { text: '父母', value: '1' },
+  { text: t('userInfo.parents'), value: '1' },
-  { text: '配偶', value: '2' },
+  { text: t('userInfo.spouse'), value: '2' },
-  { text: '子女', value: '3' },
+  { text: t('userInfo.children'), value: '3' },
-  { text: '祖父母', value: '4' },
+  { text: t('userInfo.grandparents'), value: '4' }
 ];
 const userInfo = reactive({
   backCardNum: '',
@@ -139,28 +202,28 @@ const userInfo = reactive({
   kinsfolkRef: '',
   kinsfolkRefText: '',
   realName: ''
-})
+});
 const _getUserInfo = () => {
   getUserInfo().then(res => {
-    resetData(userInfo, res)
+    resetData(userInfo, res);
     columns.forEach(c => {
       if (c.value == userInfo.kinsfolkRef) {
-        userInfo.kinsfolkRefText = c.text
+        userInfo.kinsfolkRefText = c.text;
       }
-    })
+    });
-  })
+  });
-}
+};
 
 const borrowPage = {
   pageNum: 0,
-  pageSize: 3,
+  pageSize: 3
-}
+};
-const useEdit = ref(true)
+const useEdit = ref(true);
 const _getBorrowPage = () => {
   getBorrowPage(borrowPage).then(res => {
     useEdit.value = res.length === 0;
-  })
+  });
-}
+};
 
 const options = useCascaderAreaData();
 const onFinish = ({ selectedOptions }) => {
@@ -183,21 +246,18 @@ const onConfirm = ({ selectedOptions }) => {
 };
 
 
-
+const router = useRouter();
-
-const router = useRouter()
 const saveUserInfoBtn = (values) => {
   updateCustomerCard(userInfo).then(res => {
-    router.back()
+    router.back();
-  })
+  });
-}
+};
-
 
 
 onMounted(() => {
-  _getUserInfo()
+  _getUserInfo();
-  _getBorrowPage()
+  _getBorrowPage();
-})
+});
 
 </script>
 
@@ -215,6 +275,7 @@ onMounted(() => {
     display: flex;
     flex-flow: column;
     box-shadow: 0 0 1vw 0px #e0e0e0;
+
     &-content {
       display: flex;
       flex-flow: column;
@@ -249,6 +310,7 @@ onMounted(() => {
       color: #738aa4;
       padding: 20px 0;
     }
+
     //
   }
 

src/views/my/userInfo3/index.vue

@@ -6,12 +6,12 @@
     <div class="content">
       <j-gap background="#F9BF3A" height="120" opacity="0"/>
       <div class="action">
-        <view class="tt">填写真实有效的信息，审核才会通过哦~</view>
+        <view class="tt">{{ $t('userInfo.realPrompt') }}~</view>
         <van-field
           v-model="userInfo.bankType"
-          :rules="[{ required: true, message: '请选择开户银行' }]"
+          :label="$t('userInfo.bankOfDeposit')"
-          label="开户银行"
+          :placeholder="$t('app.enter') + $t('userInfo.bankOfDeposit')"
-          placeholder="请输入开户银行"
+          :rules="[{ required: true, message: $t('app.enter') + $t('userInfo.bankOfDeposit') }]"
           :disabled="!useEdit"
           required
         />
@@ -22,8 +22,17 @@
             @confirm="onConfirm"
           />
         </van-popup>-->
-        <van-field :disabled="!useEdit" @paste="pasteField" @copy="copyField" v-model="userInfo.backCardNum" :rules="[{ required: true, message: '请输入银行卡号' }]" label="银行卡号" placeholder="请输入银行卡号" required
+        <van-field
-                   type="digit"/>
+          :disabled="!useEdit"
+          @paste="pasteField"
+          @copy="copyField"
+          v-model="userInfo.backCardNum"
+          :label="$t('userInfo.bankCard')"
+          :placeholder="$t('app.enter') + $t('userInfo.bankCard')"
+          :rules="[{ required: true, message: $t('app.enter') + $t('userInfo.bankCard') }]"
+          required
+          type="digit"
+        />
 
       </div>
 
@@ -37,7 +46,7 @@
         style="width: 100%; "
         v-if="useEdit"
       >
-        提交
+        {{ $t('app.submit') }}
       </van-button>
     </div>
   </van-form>

src/views/register/index.vue

@@ -4,7 +4,7 @@
   <div class="content">
     <j-gap height="50" background="#F9BF3A" opacity="0"/>
     <div class="slogan">
-      <div class="slogan-1">注册</div>
+      <div class="slogan-1">{{ $t('app.register') }}</div>
     </div>
 
 
@@ -13,16 +13,16 @@
       <van-field
         v-model="loginData.phoneNumber"
         class="login-btn"
-        label="手机号码"
+        :label="$t('app.phoneNumber')"
-        placeholder="请输入手机号码"
+        :placeholder="$t('app.enter') + $t('app.phoneNumber')"
         type="tel"
       />
 
       <van-field
         v-model="loginData.code"
         class="login-btn"
-        label="验证码"
+        :label="$t('app.verificationCode')"
-        placeholder="请输入验证码"
+        :placeholder="$t('app.enter') + $t('app.verificationCode')"
         type="number"
       >
         <template #button>
@@ -32,7 +32,7 @@
                 <span class="block">{{ timeData.seconds }}秒</span>
               </template>
             </van-count-down>
-            <div v-show="!countDownFlag" style="color: #bc7c1c" @click="start">发送验证码</div>
+            <div v-show="!countDownFlag" style="color: #bc7c1c" @click="start">{{ $t('app.send') + $t('app.verificationCode') }}</div>
           </div>
         </template>
       </van-field>
@@ -41,8 +41,8 @@
       <van-field
         v-model="loginData.password"
         class="login-btn"
-        label="登录密码"
+        :label="$t('app.login') + $t('app.password')"
-        placeholder="请设置6-16位密码"
+        :placeholder="$t('app.passwordPlaceholder')"
         type="text"
       />
 
@@ -55,11 +55,11 @@
       style="width: 100%; margin: 20px 0"
       @click.stop="registerBtn"
     >
-      注册
+      {{ $t('app.register') }}
     </van-button>
 
     <view class="op">
-      <view class="register" @click="goLogin">登录</view>
+      <view class="register" @click="goLogin">{{ $t('app.login') }}</view>
     </view>
 
   </div>
@@ -71,9 +71,12 @@ import {showToast} from "vant";
 import {useRouter} from "vue-router";
 import {register, sendSmsRegister} from "@/api/login";
 import {useUserStore} from "@/store/modules/user";
+import { useI18n } from 'vue-i18n';
 
 const router = useRouter()
 const userStore = useUserStore()
+const { t } = useI18n()
+
 
 const loginData = reactive({
   phone: null,
@@ -100,7 +103,7 @@ const start = () => {
       onFinish()
     })
   } else {
-    showToast('请输入手机号')
+    showToast(t('app.enter') + t('app.phoneNumber'))
   }
 };
 

src/views/uploadPassword/index.vue

@@ -10,8 +10,8 @@
         v-model="loginData.phoneNumber"
         disabled
         class="login-btn"
-        label="手机号码"
+        :label="$t('app.phoneNumber')"
-        placeholder="请输入手机号码"
+        :placeholder="$t('app.enter') + $t('app.phoneNumber')"
         label-align="top"
         style="background: #12332100"
         type="tel"
@@ -20,8 +20,8 @@
       <van-field
         v-model="loginData.code"
         class="login-btn"
-        label="验证码"
+        :label="$t('app.verificationCode')"
-        placeholder="请输入验证码"
+        :placeholder="$t('app.enter') + $t('app.verificationCode')"
         label-align="top"
         style="background: #12332100"
         type="number"
@@ -33,7 +33,7 @@
                 <span class="block">{{ timeData.seconds }}秒</span>
               </template>
             </van-count-down>
-            <div v-show="!countDownFlag" style="color: #bc7c1c" @click="start">发送验证码</div>
+            <div v-show="!countDownFlag" style="color: #bc7c1c" @click="start">{{ $t('app.send') + $t('app.verificationCode') }}</div>
           </div>
         </template>
       </van-field>
@@ -41,9 +41,9 @@
       <van-field
         v-model="loginData.password"
         class="login-btn"
-        label="登录密码"
         label-align="top"
-        placeholder="请设置6-16位密码"
+        :label="$t('app.login') + $t('app.password')"
+        :placeholder="$t('app.passwordPlaceholder')"
         style="background: #12332100"
         type="password"
       />
@@ -51,9 +51,9 @@
       <van-field
         v-model="loginData.confirmPassword"
         class="login-btn"
-        label="确认密码"
         label-align="top"
-        placeholder="请再次输入密码"
+        :label="$t('app.confirm') + $t('app.password')"
+        :placeholder="$t('app.passwordPlaceholder1')"
         style="background: #12332100"
         type="password"
       />
@@ -68,7 +68,7 @@
           style="width: 100%; margin: 20px 0"
           @click.stop="updatePwdBtn"
         >
-          确认修改
+          {{ $t('app.confirm') + $t('app.update') }}
         </van-button>
       </view>
     </view>
@@ -83,7 +83,9 @@ import {sendSmsForget, updatePwd} from "@/api/login";
 import {showToast} from "vant";
 import {getCustomerInfo} from "@/api";
 import {resetData} from "@/utils/dataUtil";
+import { useI18n } from 'vue-i18n';
 
+const { t } = useI18n()
 const loginData = reactive({
   phone: null,
   phoneNumber: '',
@@ -112,7 +114,7 @@ const start = () => {
       onFinish()
     })
   } else {
-    showToast('请输入手机号')
+    showToast(t('app.enter') + t('app.phoneNumber'))
   }
 };
 
@@ -127,7 +129,7 @@ const updatePwdBtn = () => {
     password: loginData.password
   }).then(res => {
     console.log(res)
-    showToast('修改成功')
+    showToast(t('app.update') + t('app.success'))
   })
 }
 const customerInfo = reactive({