feat: 数据库创建支持随机密码 (#555)

frontend/src/views/database/mysql/create/index.vue

@@ -23,7 +23,11 @@
                             <el-input clearable v-model.trim="form.username" />
                         </el-form-item>
                         <el-form-item :label="$t('commons.login.password')" prop="password">
-                            <el-input type="password" clearable show-password v-model.trim="form.password" />
+                            <el-input type="password" clearable show-password v-model.trim="form.password">
+                                <template #append>
+                                    <el-button @click="random" icon="RefreshRight"></el-button>
+                                </template>
+                            </el-input>
                         </el-form-item>
 
                         <el-form-item :label="$t('database.permission')" prop="permission">
@@ -64,6 +68,7 @@ import { ElForm } from 'element-plus';
 import { addMysqlDB } from '@/api/modules/database';
 import DrawerHeader from '@/components/drawer-header/index.vue';
 import { MsgSuccess } from '@/utils/message';
+import { getRandomStr } from '@/utils/util';
 
 const loading = ref();
 const createVisiable = ref(false);
@@ -95,16 +100,20 @@ const acceptParams = (params: DialogProps): void => {
     form.mysqlName = params.mysqlName;
     form.format = 'utf8mb4';
     form.username = '';
-    form.password = '';
     form.permission = '%';
     form.permissionIPs = '';
     form.description = '';
+    random();
     createVisiable.value = true;
 };
 const handleClose = () => {
     createVisiable.value = false;
 };
 
+const random = async () => {
+    form.password = getRandomStr(16);
+};
+
 const emit = defineEmits<{ (e: 'search'): void }>();
 const onSubmit = async (formEl: FormInstance | undefined) => {
     if (!formEl) return;