From 6823b7e4d73fbd052ed0228ca056dc2641b0650a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=88=98=E6=B4=AA=E6=B4=AA?= <2498601771@qq.com>
Date: Tue, 2 Jul 2024 18:13:04 +0800
Subject: [PATCH] =?UTF-8?q?CN-1663=20fix:=201=E3=80=81=E7=94=A8=E6=88=B7--?=
 =?UTF-8?q?=E6=96=B0=E5=BB=BA/=E7=BC=96=E8=BE=91=EF=BC=8C=E6=B7=BB?=
 =?UTF-8?q?=E5=8A=A0=E5=AF=86=E7=A0=81=E5=BC=BA=E5=BA=A6=E6=8F=90=E7=A4=BA?=
 =?UTF-8?q?=EF=BC=9B2=E3=80=81=E4=BF=AE=E5=A4=8D&=E7=AC=A6=E5=8F=B7?=
 =?UTF-8?q?=E5=9C=A8=E7=95=8C=E9=9D=A2=E6=98=BE=E7=A4=BA=E5=BC=82=E5=B8=B8?=
 =?UTF-8?q?=E7=9A=84=E9=97=AE=E9=A2=98=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/css/common/right-box-common.scss   | 14 ++++
 src/components/rightBox/settings/UserBox.vue  | 70 +++++++++++++++++--
 .../table/administration/I18nTable.vue        |  7 +-
 src/mixins/data-list.js                       |  5 +-
 src/utils/tools.js                            |  7 ++
 5 files changed, 95 insertions(+), 8 deletions(-)

diff --git a/src/assets/css/common/right-box-common.scss b/src/assets/css/common/right-box-common.scss
index 1a9c970a..c0f78639 100644
--- a/src/assets/css/common/right-box-common.scss
+++ b/src/assets/css/common/right-box-common.scss
@@ -145,6 +145,20 @@ $border-radius-small: 2px;
         width: calc(50% - 10px);
       }
     }
+
+    .my-progress {
+      margin-bottom: 6px;
+
+      .el-progress-bar__innerText {
+        color: rgba(0,0,0,0) !important;
+      }
+    }
+
+    .password-hint {
+      color: var(--el-color-info);
+      font-size: 12px;
+      margin-bottom: 12px;
+    }
   }
 
   .right-box__footer {
diff --git a/src/components/rightBox/settings/UserBox.vue b/src/components/rightBox/settings/UserBox.vue
index b1f5b5ad..18f35f11 100644
--- a/src/components/rightBox/settings/UserBox.vue
+++ b/src/components/rightBox/settings/UserBox.vue
@@ -23,12 +23,20 @@
           </el-form-item>
           <!--password-->
           <el-form-item :label="$t('config.user.pin')" prop="pin">
-            <el-input id="account-input-password" v-model="editObject.pin"  maxlength="64" placeholder=""
-                      show-word-limit type="password" @blur="pinBlur" autocomplete="new-password"></el-input>
+            <el-input id="account-input-password" v-model="editObject.pin"  maxlength="16" placeholder=""
+                      show-word-limit type="password" show-password @blur="pinBlur" @input="pinInput" autocomplete="new-password"></el-input>
           </el-form-item>
+          <!--密码强度-->
+          <el-progress
+              :text-inside="true"
+              class="my-progress"
+              :percentage="percentage"
+              :color="customColors" />
+          <!--密码提示-->
+          <div class="password-hint">{{ handleSpecialCode($t('validate.passwordHint')) }}</div>
           <!--pinChange-->
           <el-form-item :label="$t('config.user.confirmPin')" label-width="200px" prop="pinChange">
-            <el-input id="account-input-pinChange" v-model="editObject.pinChange"  maxlength="64" placeholder=""
+            <el-input id="account-input-pinChange" v-model="editObject.pinChange"  maxlength="16" placeholder=""
                       show-word-limit type="password"></el-input>
           </el-form-item>
           <!--email-->
@@ -104,6 +112,7 @@ import axios from 'axios'
 import _ from 'lodash'
 import { themeData, langData, storageKey } from '@/utils/constants'
 import { api } from '@/utils/api'
+import { handleSpecialCode } from '@/utils/tools'
 
 export default {
   name: 'UserBox',
@@ -114,8 +123,8 @@ export default {
       const isValid = value.match(reg) // 返回匹配到的值
       if (value && value.length < 8) {
         callback(new Error(this.$t('validate.atLeastEight')))
-      } else if (!isValid) {
-        callback(new Error(this.$t('validate.passwordError')))
+      } else if (!isValid || this.passwordLevel(this.editObject.pin) === 1) {
+        callback(new Error(handleSpecialCode(this.$t('validate.passwordError'))))
       } else {
         callback()
       }
@@ -197,7 +206,14 @@ export default {
       },
       roleData: [],
       themeData,
-      langData
+      langData,
+      percentage: 0, // 密码强度
+      customColors: [ // 密码强度颜色指标
+        { color: '#d32423', percentage: 26 },
+        { color: '#fdbf12', percentage: 51 },
+        { color: '#99c708', percentage: 76 },
+        { color: '#099407', percentage: 100 }
+      ]
     }
   },
   setup () {
@@ -206,6 +222,7 @@ export default {
     this.getRoleData()
   },
   methods: {
+    handleSpecialCode,
     isCurrentUser (username) {
       return localStorage.getItem(storageKey.username) === username
     },
@@ -284,6 +301,47 @@ export default {
           this.roleData = _.get(response, 'data.data.list', [])
         }
       })
+    },
+    pinInput () {
+      if (this.editObject?.pin.length < 8) {
+        this.percentage = 25
+      } else if (this.editObject?.pin.length < 10) {
+        this.percentage = this.passwordLevel(this.editObject.pin) > 1 ? 2 * 25 : this.passwordLevel(this.editObject.pin) * 25
+      } else if (this.editObject?.pin.length < 12) {
+        this.percentage = this.passwordLevel(this.editObject.pin) === 4 ? 3 * 25 : this.passwordLevel(this.editObject.pin) * 25
+      } else {
+        this.percentage = this.passwordLevel(this.editObject.pin) * 25
+      }
+    },
+    passwordLevel (I) {
+      let H = 0
+      for (let a = 0; a < I.length; a++) {
+        H |= this.CharMode(I.charCodeAt(a))
+      }
+      return this.bitTotal(H)
+    },
+    CharMode (H) {
+      if (H >= 48 && H <= 57) { // 数字
+        return 1
+      }
+      if (H >= 65 && H <= 90) { // 大写
+        return 2
+      }
+      if (H >= 97 && H <= 122) { // 小写
+        return 4
+      } else {
+        return 8
+      }
+    },
+    bitTotal (H) {
+      let I = 0
+      for (let j = 0; j < 4; j++) {
+        if (H & 1) {
+          I++
+        }
+        H >>>= 1
+      }
+      return I
     }
   },
   watch: {
diff --git a/src/components/table/administration/I18nTable.vue b/src/components/table/administration/I18nTable.vue
index 5ba08983..8a1fcdb1 100644
--- a/src/components/table/administration/I18nTable.vue
+++ b/src/components/table/administration/I18nTable.vue
@@ -32,7 +32,8 @@
         <div class="col-resize-area"></div>
       </template>
       <template #default="scope" :column="item">
-        <span>{{scope.row[item.prop] || '-'}}</span>
+        <span v-if="item.prop === 'value'">{{handleSpecialCode(scope.row[item.prop]) || '-'}}</span>
+        <span v-else>{{scope.row[item.prop] || '-'}}</span>
       </template>
     </el-table-column><template v-slot:empty >
     <div class="table-no-data" v-if="isNoData">
@@ -45,6 +46,7 @@
 <script>
 import table from '@/mixins/table'
 import { api } from '@/utils/api'
+import { handleSpecialCode } from '@/utils/tools'
 
 export default {
   name: 'I18nTable',
@@ -91,6 +93,9 @@ export default {
         }
       ]
     }
+  },
+  methods: {
+    handleSpecialCode
   }
 }
 </script>
diff --git a/src/mixins/data-list.js b/src/mixins/data-list.js
index 18e2244f..3fb259f0 100644
--- a/src/mixins/data-list.js
+++ b/src/mixins/data-list.js
@@ -1,4 +1,4 @@
-import { tableSort } from '@/utils/tools'
+import { handleSpecialCode, tableSort } from '@/utils/tools'
 import { defaultPageSize, fromRoute, position, storageKey, dbTableColumnCustomizeConfigPre, dbTableColumnCustomizeConfig } from '@/utils/constants'
 import _ from 'lodash'
 import { ref } from 'vue'
@@ -242,6 +242,9 @@ export default {
         axios.get(`${this.url}/${this.batchDeleteObjs[0].id}`).then(response => {
           if (response.status === 200) {
             this.object = response.data.data
+            if (this.url === '/sys/i18n') {
+              this.object.value = handleSpecialCode(this.object.value)
+            }
             this.rightBox.show = true
           }
         })
diff --git a/src/utils/tools.js b/src/utils/tools.js
index 46256abd..18af7dcc 100644
--- a/src/utils/tools.js
+++ b/src/utils/tools.js
@@ -1584,3 +1584,10 @@ const tagValueHandler = (value) => {
 export const headerCellClass = (row) => {
   return 'my-header-cell-class'
 }
+
+/**
+ * & 被转译为&amp; 将转义后的值转为 &
+ */
+export const handleSpecialCode = (str) => {
+  return str.indexOf('&amp;') > -1 ? str.replaceAll('&amp;', '&') : str
+}