no message

src/global-text-processor.js

@@ -1,37 +1,142 @@
-function isNumberRegex(value) {
-  return /^-?\d+(\.\d+)?$/.test(value)
+import axios from 'axios'
+import { delayPerform } from 'js-perform-lock'
+
+function isNumberRegex(str) {
+  const pureNumberRegex = /^\d+$/
+  const floatNumberRegex = /^\d*\.\d+$/
+  const timeRegexHHMM = /^([01]\d|2[0-3]):([0-5]\d)$/
+  const timeRegexHHMMSS = /^([01]\d|2[0-3]):([0-5]\d):([0-5]\d)$/
+  const timeRegex = /^\d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2}$/
+  const pureLetterRegex = /^[A-Za-z]+$/
+  const letterAndDigitRegex = /^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]+$/
+  const letterAndPunctuationRegex = /^(?=.*[A-Za-z])(?=.*[\p{P}\p{S}])[\p{L}\p{P}\p{S}]+$/u
+  const digitAndPunctuationRegex = /^(?=.*\d)(?=.*[\p{P}\p{S}])[\d\p{P}\p{S}]+$/u
+  if (pureNumberRegex.test(str)) {
+    return true
+  } else if (floatNumberRegex.test(str)) {
+    return true
+  } else if (timeRegexHHMM.test(str)) {
+    return true
+  } else if (timeRegexHHMMSS.test(str)) {
+    return true
+  } else if (pureLetterRegex.test(str)) {
+    return true
+  } else if (letterAndDigitRegex.test(str)) {
+    return true
+  } else if (letterAndPunctuationRegex.test(str)) {
+    return true
+  } else if (digitAndPunctuationRegex.test(str)) {
+    return true
+  } else if (timeRegex.test(str)) {
+    return true
+  } else {
+    return false
+  }
 }
 
+var deferredReplacement = (function () {
+  var keywords = []
+  var zhixingfun = []
+  var index = 0
+  var index2 = 0
+
+  function pushNewText(data) {
+    return new Promise(function (r, j) {
+      axios
+        .post('https://jiasm.zfire.top/translate/api/v1/common/translationOfText', data)
+        .then(response => {
+          if (response.data.code === 0) {
+            var obj = {}
+            response.data.data.map(val => {
+              obj[val[0]] = val[1]
+            })
+            window.Vue_Translation_Of_Text_Data = { ...(window.Vue_Translation_Of_Text_Data || {}), ...obj }
+            r({ ...obj })
+          }
+        })
+        .catch(j)
+    })
+  }
+
+  const d = new delayPerform(250).refactor(function (/**可接收参数**/) {
+    let len = index
+    let len2 = index2
+    pushNewText({
+      keywords: [...keywords],
+      targetLanguage: window?.Vue_Translation_Of_Text_Type
+    }).then(data => {
+      for (var i = 0; i < len2; i++) {
+        zhixingfun[i]()
+      }
+      keywords.splice(0, len)
+      zhixingfun.splice(0, len2)
+      index -= len
+      index2 -= len2
+    })
+  })
+
+  return function (text, cb) {
+    d()
+    if (!keywords.includes(text)) {
+      index++
+      keywords.push(text)
+    }
+    index2++
+    zhixingfun.push(cb)
+  }
+})()
+
 export default {
   install(Vue) {
     Vue.mixin({
-      // updated() {
-      //   this.$nextTick(() => {
-      //     this.processTextNodes(this.$el)
-      //   })
-      // },
+      updated() {
+        this.$nextTick(() => {
+          this.processTextNodes(this.$el)
+        })
+      },
       methods: {
         processTextNodes(el) {
           // 遍历子节点并处理文本内容
           if (el.nodeType === Node.ELEMENT_NODE) {
             // 跳过 table-body中的td 元素
-            if (el.nodeName.toLowerCase() === 'td') {
-              return
-            }
+            // if (el.nodeName.toLowerCase() === 'td') {
+            //   return
+            // }
             Array.from(el.childNodes).forEach(child => {
               if (child.nodeType === Node.TEXT_NODE) {
-                const text = child.textContent.trim()
-                if (text && !isNumberRegex(text)) {
+                let text = child.textContent
+                let _child = child
+                if (text && !isNumberRegex(text.trim())) {
                   try {
-                    child.textContent = '⏳' //this.$i18n.t(text)
+                    if (window?.Vue_Translation_Of_Text_Data?.[text.trim()]) {
+                      child.textContent = window?.Vue_Translation_Of_Text_Data?.[text.trim()]
+                    } else if (text.trim()) {
+                      deferredReplacement(text.trim(), function () {
+                        if (window.Vue_Translation_Of_Text_Data[text.trim()]) {
+                          _child.textContent = window.Vue_Translation_Of_Text_Data[text.trim()]
+                        }
+                      })
+                    }
                   } catch (error) {}
                 }
               } else if (child.nodeName === 'INPUT' || child.nodeName === 'TEXTAREA' || child.nodeName === 'SELECT') {
                 // 修改输入框和下拉框的 placeholder 内容
-                const placeholder = child.getAttribute('placeholder')
-                if (placeholder && !isNumberRegex(placeholder)) {
+                let placeholder = child.getAttribute('placeholder')
+                let _child = child
+                if (placeholder && !isNumberRegex(placeholder.trim())) {
                   try {
-                    child.setAttribute('placeholder', '⏳') //this.$i18n.t(placeholder)
+                    if (window?.Vue_Translation_Of_Text_Data?.[placeholder.trim() + '']) {
+                      child.setAttribute('placeholder', window?.Vue_Translation_Of_Text_Data?.[placeholder.trim() + ''])
+                    } else if (placeholder.trim() + '') {
+                      deferredReplacement(placeholder.trim() + '', function () {
+                        if (window?.Vue_Translation_Of_Text_Data?.[placeholder.trim() + '']) {
+                          _child.setAttribute(
+                            'placeholder',
+                            window?.Vue_Translation_Of_Text_Data?.[placeholder.trim() + '']
+                          )
+                        }
+                      })
+                    }
                   } catch (error) {}
                 }
               }

src/layout/components/Navbar.vue

@@ -56,6 +56,24 @@
         <el-dropdown class="user-container" trigger="click">
           <div class="user right-menu-item hover-effect">
             <div class="flex">
+              {{ Vue_Translation_Of_Text_Type }}
+            </div>
+          </div>
+          <el-dropdown-menu slot="dropdown" class="user-dropdown">
+            <el-dropdown-item divided @click.native="setYUYAN('zh')">
+              <span style="display: block">中文</span>
+            </el-dropdown-item>
+            <el-dropdown-item divided @click.native="setYUYAN('en')">
+              <span style="display: block">英文</span>
+            </el-dropdown-item>
+            <el-dropdown-item divided @click.native="setYUYAN('ar')">
+              <span style="display: block">阿拉伯文</span>
+            </el-dropdown-item>
+          </el-dropdown-menu>
+        </el-dropdown>
+        <el-dropdown class="user-container" trigger="click">
+          <div class="user right-menu-item hover-effect">
+            <div class="flex">
               <i class="el-icon-user-solid" />
               <span :class="name.length > 5 ? 'ellipsis' : ''">{{ name }}</span>
             </div>
@@ -257,6 +275,7 @@ export default {
   },
   data() {
     return {
+      Vue_Translation_Of_Text_Type: window?.Vue_Translation_Of_Text_Type || 'zh',
       pathurl: '',
       visible: false,
       noticeCount: 0,
@@ -388,6 +407,12 @@ export default {
     this.$store.commit('app/SET_L1_PATH', this.path)
   },
   methods: {
+    setYUYAN(type) {
+      window.localStorage.setItem('Vue_Translation_Of_Text_Type', type)
+      setTimeout(() => {
+        location.reload(true)
+      }, 200)
+    },
     goBigViews() {
       this.$router.push({
         name: 'bigViews'

src/main.js

@@ -7,17 +7,6 @@ import Vue from 'vue'
 import 'normalize.css/normalize.css' // A modern alternative to CSS resets
 // import './plugins/jquery.hiwprint.js'
 
-// import VueI18n from 'vue-i18n'
-import GlobalTextProcessor from './global-text-processor' // 导入插件
-
-// Vue.use(VueI18n)
-Vue.use(GlobalTextProcessor) // 注册插件
-
-// const i18n = new VueI18n({
-//   locale: 'ar'
-//   // messages
-// })
-
 import ElementUI from '@zjlib/element-ui2'
 import '@zjlib/element-ui2/lib/theme-chalk/index.css'
 import VueQuillEditor from 'vue-quill-editor'
@@ -214,10 +203,42 @@ Object.keys(directives).forEach(key => {
 
 Vue.config.productionTip = false
 
-new Vue({
-  el: '#app',
-  router,
-  store,
-  // i18n,
-  render: h => h(App)
-})
+// 解决翻译
+import GlobalTextProcessor from './global-text-processor' // 导入插件
+const axios = require('axios')
+const urls = {
+  ar: 'https://zf-mall-test.oss-cn-shenzhen.aliyuncs.com/translationFile/auto_TO_ar.json',
+  en: 'https://zf-mall-test.oss-cn-shenzhen.aliyuncs.com/translationFile/auto_TO_en.json'
+}
+
+window.Vue_Translation_Of_Text_Type = window.localStorage.getItem('Vue_Translation_Of_Text_Type')
+
+if (window?.Vue_Translation_Of_Text_Type && urls[window?.Vue_Translation_Of_Text_Type]) {
+  Vue.use(GlobalTextProcessor) // 注册插件
+  axios
+    .get(urls[window?.Vue_Translation_Of_Text_Type])
+    .then(response => {
+      window.Vue_Translation_Of_Text_Data = { ...(window.Vue_Translation_Of_Text_Data || {}), ...response.data }
+      new Vue({
+        el: '#app',
+        router,
+        store,
+        render: h => h(App)
+      })
+    })
+    .catch(error => {
+      new Vue({
+        el: '#app',
+        router,
+        store,
+        render: h => h(App)
+      })
+    })
+} else {
+  new Vue({
+    el: '#app',
+    router,
+    store,
+    render: h => h(App)
+  })
+}