feat: mysql 和 redis 增加连接信息提示 (#687)

backend/app/dto/response/app.go

@@ -59,6 +59,7 @@ type AppInstalledDTO struct {
 type DatabaseConn struct {
 	Password    string `json:"password"`
 	ServiceName string `json:"serviceName"`
+	Port        int64  `json:"port"`
 }
 
 type AppService struct {

backend/app/service/app_install.go

@@ -141,6 +141,7 @@ func (a *AppInstallService) LoadConnInfo(key string) (response.DatabaseConn, err
 	}
 	data.Password = app.Password
 	data.ServiceName = app.ServiceName
+	data.Port = app.Port
 	return data, nil
 }
 

frontend/src/api/interface/app.ts

@@ -130,6 +130,7 @@ export namespace App {
     export interface DatabaseConnInfo {
         password: string;
         serviceName: string;
+        port: number;
     }
     export interface AppInstallResource {
         type: string;

frontend/src/lang/modules/en.ts

@@ -422,6 +422,12 @@ const message = {
         rdbHelper2: 'The data',
         rdbHelper3: 'Meeting either condition triggers RDB persistence',
         rdbInfo: 'Ensure that the value in the rule list ranges from 1 to 100000',
+
+        containerConn: 'Container connection address',
+        containerConnHelper: 'PHP runtime environment/container-installed applications use this connection address',
+        remoteConn: 'External connection address',
+        remoteConnHelper2: 'Use this address for non-container or external connections',
+        localIP: 'Local IP',
     },
     container: {
         createContainer: 'Create container',
@@ -1174,6 +1180,8 @@ const message = {
         runDir: 'Run Directory',
         runDirHelper:
             'Some programs need to specify a secondary directory as the running directory, such as ThinkPHP5, Laravel',
+        runUserHelper:
+            'For websites deployed through the PHP runtime environment, all files, folder owners, and user groups under the index and subdirectories need to be set to 1000, command: chown -R 1000:1000 index',
     },
     php: {
         short_open_tag: 'Short tag support',

frontend/src/lang/modules/zh.ts

@@ -431,6 +431,12 @@ const message = {
         rdbHelper2: '条数据',
         rdbHelper3: '符合任意一个条件将会触发RDB持久化',
         rdbInfo: '请确认规则列表中值在 1-100000 之间',
+
+        containerConn: '容器连接地址',
+        containerConnHelper: 'PHP 运行环境/容器安装的应用使用此连接地址',
+        remoteConn: '外部连接地址',
+        remoteConnHelper2: '非容器或外部连接使用此地址',
+        localIP: '本机 IP',
     },
     container: {
         createContainer: '创建容器',
@@ -1165,6 +1171,8 @@ const message = {
         rewriteHelper: '若设置伪静态后，网站无法正常访问，请尝试设置回default',
         runDir: '运行目录',
         runDirHelper: '部分程序需要指定二级目录作为运行目录，如ThinkPHP5，Laravel',
+        runUserHelper:
+            '通过 PHP 运行环境部署的网站，需要将 index 和子目录下的所有文件、文件夹所有者和用户组设置为 1000，命令：chown -R 1000:1000 index',
     },
     php: {
         short_open_tag: '短标签支持',

frontend/src/views/database/mysql/root-password/index.vue

@@ -9,7 +9,7 @@
                     <el-form-item :label="$t('database.rootPassword')" :rules="Rules.requiredInput" prop="password">
                         <el-input type="password" show-password clearable v-model="form.password">
                             <template #append>
-                                <el-button @click="copy" icon="DocumentCopy"></el-button>
+                                <el-button @click="copy(form.password)" icon="DocumentCopy"></el-button>
                                 <el-button style="margin-left: 1px" @click="random" icon="RefreshRight"></el-button>
                             </template>
                         </el-input>
@@ -18,6 +18,19 @@
                         <el-tag>{{ form.serviceName }}</el-tag>
                         <span class="input-help">{{ $t('database.serviceNameHelper') }}</span>
                     </el-form-item>
+                    <el-form-item :label="$t('database.containerConn')">
+                        <el-tag>
+                            {{ form.serviceName + ':3306' }}
+                        </el-tag>
+                        <el-button @click="copy(form.serviceName + ':3306')" icon="DocumentCopy" link></el-button>
+                        <span class="input-help">
+                            {{ $t('database.containerConnHelper') }}
+                        </span>
+                    </el-form-item>
+                    <el-form-item :label="$t('database.remoteConn')">
+                        <el-tag>{{ $t('database.localIP') + ':' + form.port }}</el-tag>
+                        <span class="input-help">{{ $t('database.remoteConnHelper2') }}</span>
+                    </el-form-item>
                 </el-col>
             </el-row>
         </el-form>
@@ -56,6 +69,7 @@ const dialogVisiable = ref(false);
 const form = ref<App.DatabaseConnInfo>({
     password: '',
     serviceName: '',
+    port: 0,
 });
 
 const confirmDialogRef = ref();
@@ -73,9 +87,9 @@ const random = async () => {
     form.value.password = getRandomStr(16);
 };
 
-const copy = async () => {
+const copy = async (value: string) => {
     let input = document.createElement('input');
-    input.value = form.value.password;
+    input.value = value;
     document.body.appendChild(input);
     input.select();
     document.execCommand('Copy');

frontend/src/views/database/redis/password/index.vue

@@ -9,7 +9,7 @@
                     <el-form-item :label="$t('database.requirepass')" :rules="Rules.requiredInput" prop="password">
                         <el-input type="password" show-password clearable v-model="form.password">
                             <template #append>
-                                <el-button @click="copy" icon="DocumentCopy"></el-button>
+                                <el-button @click="copy(form.password)" icon="DocumentCopy"></el-button>
                                 <el-button style="margin-left: 1px" @click="random" icon="RefreshRight"></el-button>
                             </template>
                         </el-input>
@@ -18,6 +18,19 @@
                         <el-tag>{{ form.serviceName }}</el-tag>
                         <span class="input-help">{{ $t('database.serviceNameHelper') }}</span>
                     </el-form-item>
+                    <el-form-item :label="$t('database.containerConn')">
+                        <el-tag>
+                            {{ form.serviceName + ':6379' }}
+                        </el-tag>
+                        <el-button @click="copy(form.serviceName + ':6379')" icon="DocumentCopy" link></el-button>
+                        <span class="input-help">
+                            {{ $t('database.containerConnHelper') }}
+                        </span>
+                    </el-form-item>
+                    <el-form-item :label="$t('database.remoteConn')">
+                        <el-tag>{{ $t('database.localIP') + ':' + form.port }}</el-tag>
+                        <span class="input-help">{{ $t('database.remoteConnHelper2') }}</span>
+                    </el-form-item>
                 </el-col>
             </el-row>
         </el-form>
@@ -56,6 +69,7 @@ const dialogVisiable = ref(false);
 const form = ref<App.DatabaseConnInfo>({
     password: '',
     serviceName: '',
+    port: 0,
 });
 
 const confirmDialogRef = ref();
@@ -78,9 +92,9 @@ const random = async () => {
     form.value.password = getRandomStr(16);
 };
 
-const copy = async () => {
+const copy = async (value: string) => {
     let input = document.createElement('input');
-    input.value = form.value.password;
+    input.value = value;
     document.body.appendChild(input);
     input.select();
     document.execCommand('Copy');

frontend/src/views/website/website/config/basic/site-folder/index.vue

@@ -13,7 +13,12 @@
                     </el-descriptions-item>
                 </el-descriptions>
                 <br />
-
+                <el-alert :closable="false">
+                    <template #default>
+                        <span class="warnHelper">{{ $t('website.runUserHelper') }}</span>
+                    </template>
+                </el-alert>
+                <br />
                 <el-descriptions :title="$t('website.folderTitle')" :column="1" border>
                     <el-descriptions-item label="waf">{{ $t('website.wafFolder') }}</el-descriptions-item>
                     <el-descriptions-item label="ssl">{{ $t('website.sslFolder') }}</el-descriptions-item>
@@ -42,7 +47,7 @@
                 <el-form-item>
                     <el-alert :closable="false">
                         <template #default>
-                            <span style="white-space: pre-line">{{ $t('website.runDirHelper') }}</span>
+                            <span class="warnHelper">{{ $t('website.runDirHelper') }}</span>
                         </template>
                     </el-alert>
                 </el-form-item>
@@ -152,3 +157,10 @@ onMounted(() => {
     search();
 });
 </script>
+
+<style scoped>
+.warnHelper {
+    white-space: pre-line;
+    display: block;
+}
+</style>