Display Chinese characters according to numbers

Display Chinese characters according to numbers

<div class="money">
  <div class="left">
    <span> total </span>
    <br>
    <span> amount of money </span>
  </div>
  <div class="nums">
    <span class="unit">{
   {payDetail.moneyArr[0]}}  Thousand </span>
    <span class="unit">{
   {payDetail.moneyArr[1]}}  Bai </span>
    <span class="unit">{
   {payDetail.moneyArr[2]}}  Ten </span>
    <span class="unit">{
   {payDetail.moneyArr[3]}}  ten thousand </span>
    <span class="unit">{
   {payDetail.moneyArr[4]}}  Thousand </span>
    <span class="unit">{
   {payDetail.moneyArr[5]}}  Bai </span>
    <span class="unit">{
   {payDetail.moneyArr[6]}}  Ten </span>
    <span class="unit">{
   {payDetail.moneyArr[7]}}  element </span>
    <span class="unit">{
   {payDetail.moneyArr[8]}}  horn </span>
    <span class="unit">{
   {payDetail.moneyArr[9]}}  branch </span>
  </div>
  <div class="right">
    ￥<span class="underline">{
   {Number(payDetail.payAmount||0).toFixed(2)}}</span> element 
  </div>
</div>

data() {
    
    return {
    
      modalShow: false,
      id: '',
      payDetail: {
    
        paymentOrderNo: '', //  Payment request No 
        payAmount: '', //  Amount due 
        accountName: '', //  title of account 
        bank: '', //  Bank of deposit 
        accountNumber: '', //  Bank account 
        billDateStart: '', //  Bill start time 
        billDateEnd: '', //  Bill end time 
        applyTime: '', //  Application time 
        applicant: '', //  Applicant 
        settlementType: '', //  Settlement method 
        remarks: '', //  remarks 
        moneyArr: []
      }
    }
  },
created() {
    
    console.log(this.$route.query)
    this.init()
  },
  methods: {
    
    async init() {
    
      let id = this.$route.query.id
      if (!id) return
      this.$Spin.show()
      try {
    
        let res = await getPaymentOrder({
     id })
        this.payDetail = res.data.result || {
    }
        this.payDetail.moneyArr = this.convertCurrency(Number(this.payDetail.payAmount)) //  This is the value we use 
      } catch (error) {
    
        console.log(error)
        this.$Message.error(' Network anomalies ')
      } finally {
    
        this.$Spin.hide()
      }
    },
    convertCurrency(money) {
    
      console.log(this.payDetail.payAmount) // egg:123456  Numeric type 
      //  The number of Chinese characters 
      var cnNums = [' zero ', ' one ', ' Ii. ', ' 3 ', ' boss ', ' wu ', ' lu ', ' Retailer, ', '  ', ' nine ']
      //  Maximum processed number 
      var maxNum = 99999999999999.99
      //  Array used after separating amounts , predefined 
      if (!money) {
     return '' }
      money = parseFloat(money)
      if (money >= maxNum) {
    
        //  Maximum processing number exceeded 
        return ''
      }
      //  Convert to string 
      money = Number(money).toFixed(2)
      let arr = Array.from(money).filter(item => item !== '.').map(item => cnNums[item])
      console.log(arr)
      let len = arr.length
      if (len < 10) {
    
        for (let i = 0; i < 10 - len; i++) {
    
          arr.unshift(' zero ')
        }
      }
      console.log(arr) //  This one can print out the Chinese numerical value 
      return arr
    },
    //  Print 
    doPrint() {
    
      window.print()
    }
  }