添加中文姓名转英文姓名

src/views/register.vue

@@ -22,7 +22,8 @@
               <el-input v-model="registerForm.username"> </el-input>
             </el-form-item>
             <el-form-item label="密码:" prop="password">
-              <el-input v-model="registerForm.password" type="password" auto-complete="off" show-password="true"> </el-input>
+              <el-input v-model="registerForm.password" type="password" auto-complete="off" show-password="true">
+              </el-input>
             </el-form-item>
             <el-form-item label="是否有邮箱:" prop="isHasEmail">
               <el-radio-group v-model="registerForm.isHasEmail">
@@ -34,7 +35,7 @@
               <el-input v-model="registerForm.email"> </el-input>
             </el-form-item>
             <el-form-item label="中文姓名:" prop="nickName">
-              <el-input v-model="registerForm.nickName"> </el-input>
+              <el-input v-model="registerForm.nickName" @keyup.enter="convertToEnglishName"> </el-input>
             </el-form-item>
             <el-form-item label="英文姓名:" prop="englishName">
               <el-input v-model="registerForm.englishName"> </el-input>
@@ -184,6 +185,49 @@ const filterDisabledDept = (deptList) => {
   })
 }
 
+// 中文姓名转英文姓名
+const convertToEnglishName = () => {
+  if (!registerForm.value.nickName.trim()) {
+    registerForm.value.englishName = '';
+    return;
+  }
+
+  // 去除前后空格
+  let name = form.value.nickName.trim();
+
+  // 检查是否是复姓
+  let isCompound = false;
+  let surnameParts = [];
+
+  for (const sn of compoundSurnames) {
+    if (name.startsWith(sn)) {
+      isCompound = true;
+      surnameParts = [sn];
+      name = name.slice(sn.length);
+      break;
+    }
+  }
+
+  // 如果不是复姓，则取第一个字作为姓
+  if (!isCompound && name.length > 0) {
+    surnameParts = [name[0]];
+    name = name.slice(1);
+  }
+
+  // 处理剩余的名字部分
+  const givenNameParts = name.split('');
+
+  // 构建英文姓氏 (全部大写)
+  const engSurname = surnameParts.join('').toUpperCase();
+
+  // 构建英文名字 (每个字首字母大写)
+  const engGivenName = givenNameParts
+    .map(char => char.charAt(0).toUpperCase() + char.slice(1).toLowerCase())
+    .join('');
+
+  // 组合结果
+  registerForm.value.englishName = `${engSurname} ${engGivenName}`;
+};
 
 const handleRegister = () => {
   proxy.$refs.registerRef.validate(valid => {

src/views/system/user/index.vue

@@ -177,7 +177,8 @@
           </el-col>
           <el-col :span="12">
             <el-form-item label="中文姓名" prop="nickName">
-              <el-input v-model="form.nickName" placeholder="请输入中文姓名" maxlength="30" />
+              <el-input v-model="form.nickName" placeholder="请输入中文姓名" maxlength="30"
+                @keyup.enter="convertToEnglishName" />
             </el-form-item>
           </el-col>
         </el-row>
@@ -375,7 +376,13 @@ const columns = ref([
   { key: 5, label: `状态`, visible: true },
   { key: 6, label: `创建时间`, visible: true }
 ])
-
+// 常见的复姓列表
+const compoundSurnames = [
+  '欧阳', '太史', '端木', '上官', '司马',
+  '东方', '公孙', '尉迟', '公羊', '澹台',
+  '宗政', '濮阳', '闾丘', '子车', '亓官',
+  '南宫', '墨夷', '恰喇', '阏氏', '竺联'
+];
 const validateRoles = (rule, value, callback) => {
   console.log('选择值', value)
   const forbiddenRoles = ['3', '4', '5']
@@ -696,6 +703,50 @@ function submitForm() {
   })
 }
 
+// 中文姓名转英文姓名
+const convertToEnglishName = () => {
+  if (!form.value.nickName.trim()) {
+    form.value.englishName = '';
+    return;
+  }
+
+  // 去除前后空格
+  let name = form.value.nickName.trim();
+
+  // 检查是否是复姓
+  let isCompound = false;
+  let surnameParts = [];
+
+  for (const sn of compoundSurnames) {
+    if (name.startsWith(sn)) {
+      isCompound = true;
+      surnameParts = [sn];
+      name = name.slice(sn.length);
+      break;
+    }
+  }
+
+  // 如果不是复姓，则取第一个字作为姓
+  if (!isCompound && name.length > 0) {
+    surnameParts = [name[0]];
+    name = name.slice(1);
+  }
+
+  // 处理剩余的名字部分
+  const givenNameParts = name.split('');
+
+  // 构建英文姓氏 (全部大写)
+  const engSurname = surnameParts.join('').toUpperCase();
+
+  // 构建英文名字 (每个字首字母大写)
+  const engGivenName = givenNameParts
+    .map(char => char.charAt(0).toUpperCase() + char.slice(1).toLowerCase())
+    .join('');
+
+  // 组合结果
+  form.value.englishName = `${engSurname} ${engGivenName}`;
+};
+
 onMounted(() => {
   getDeptTree()
   getBusDependencyData();