feat: Node.js 运行环境增加自定义启动命令 (#2677)

Refs https://github.com/1Panel-dev/1Panel/issues/2559

backend/app/service/runtime.go

@@ -332,6 +332,24 @@ func (r *RuntimeService) Update(req request.RuntimeUpdate) error {
 				}
 			}
 		}
+
+		appDetail, err := appDetailRepo.GetFirst(commonRepo.WithByID(runtime.AppDetailID))
+		if err != nil {
+			return err
+		}
+		app, err := appRepo.GetFirst(commonRepo.WithByID(appDetail.AppId))
+		if err != nil {
+			return err
+		}
+		fileOp := files.NewFileOp()
+		appVersionDir := path.Join(constant.AppResourceDir, app.Resource, app.Key, appDetail.Version)
+		if !fileOp.Stat(appVersionDir) || appDetail.Update {
+			if err := downloadApp(app, appDetail, nil); err != nil {
+				return err
+			}
+			_ = fileOp.Rename(path.Join(runtime.GetPath(), "run.sh"), path.Join(runtime.GetPath(), "run.sh.bak"))
+			_ = fileOp.CopyFile(path.Join(appVersionDir, "run.sh"), runtime.GetPath())
+		}
 	}
 
 	projectDir := path.Join(constant.RuntimeDir, runtime.Type, runtime.Name)

frontend/src/lang/modules/en.ts

@@ -1828,6 +1828,8 @@ const message = {
         module: 'Module',
         nodeOperatorHelper:
             'Is {0} {1} module? The operation may cause abnormality in the operating environment, please confirm before proceeding',
+        customScript: 'Custom startup command',
+        customScriptHelper: 'Please fill in the complete startup command, for example: npm run start',
     },
     process: {
         pid: 'Process ID',

frontend/src/lang/modules/tw.ts

@@ -1724,6 +1724,8 @@ const message = {
         moduleManager: '模塊管理',
         module: '模塊',
         nodeOperatorHelper: '是否{0} {1} 模組？ 操作可能導致運轉環境異常，請確認後操作',
+        customScript: '自訂啟動指令',
+        customScriptHelper: '請填寫完整的啟動指令，例如：npm run start',
     },
     process: {
         pid: '進程ID',

frontend/src/lang/modules/zh.ts

@@ -1724,6 +1724,8 @@ const message = {
         moduleManager: '模块管理',
         module: '模块',
         nodeOperatorHelper: '是否{0} {1} 模块？操作可能导致运行环境异常，请确认后操作',
+        customScript: '自定义启动命令',
+        customScriptHelper: '请填写完整的启动命令，例如：npm run start',
     },
     process: {
         pid: '进程ID',

frontend/src/views/website/runtime/node/operate/index.vue

@@ -65,22 +65,45 @@
                             </template>
                         </el-input>
                     </el-form-item>
-                    <el-form-item :label="$t('runtime.runScript')" prop="params.EXEC_SCRIPT">
+                    <el-row :gutter="20">
-                        <el-select v-model="runtime.params['EXEC_SCRIPT']">
+                        <el-col :span="18">
-                            <el-option
+                            <el-form-item :label="$t('runtime.runScript')" prop="params.EXEC_SCRIPT">
-                                v-for="(script, index) in scripts"
+                                <el-select
-                                :key="index"
+                                    v-model="runtime.params['EXEC_SCRIPT']"
-                                :label="script.name + ' 【 ' + script.script + ' 】'"
+                                    v-if="runtime.params['CUSTOM_SCRIPT'] == '0'"
-                                :value="script.name"
+                                >
-                            >
+                                    <el-option
-                                <el-row :gutter="10">
+                                        v-for="(script, index) in scripts"
-                                    <el-col :span="4">{{ script.name }}</el-col>
+                                        :key="index"
-                                    <el-col :span="10">{{ ' 【 ' + script.script + ' 】' }}</el-col>
+                                        :label="script.name + ' 【 ' + script.script + ' 】'"
-                                </el-row>
+                                        :value="script.name"
-                            </el-option>
+                                    >
-                        </el-select>
+                                        <el-row :gutter="10">
-                        <span class="input-help">{{ $t('runtime.runScriptHelper') }}</span>
+                                            <el-col :span="4">{{ script.name }}</el-col>
-                    </el-form-item>
+                                            <el-col :span="10">{{ ' 【 ' + script.script + ' 】' }}</el-col>
+                                        </el-row>
+                                    </el-option>
+                                </el-select>
+                                <el-input v-else v-model="runtime.params['EXEC_SCRIPT']"></el-input>
+                                <span class="input-help" v-if="runtime.params['CUSTOM_SCRIPT'] == '0'">
+                                    {{ $t('runtime.runScriptHelper') }}
+                                </span>
+                                <span class="input-help" v-else>
+                                    {{ $t('runtime.customScriptHelper') }}
+                                </span>
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="6">
+                            <el-form-item :label="$t('runtime.customScript')" prop="params.CUSTOM_SCRIPT">
+                                <el-switch
+                                    v-model="runtime.params['CUSTOM_SCRIPT']"
+                                    :active-value="'1'"
+                                    :inactive-value="'0'"
+                                    @change="changeScriptType"
+                                />
+                            </el-form-item>
+                        </el-col>
+                    </el-row>
                     <el-row :gutter="20">
                         <el-col :span="9">
                             <el-form-item :label="$t('runtime.appPort')" prop="params.NODE_APP_PORT">
@@ -94,13 +117,13 @@
                                 <span class="input-help">{{ $t('runtime.externalPortHelper') }}</span>
                             </el-form-item>
                         </el-col>
-
                         <el-col :span="6">
                             <el-form-item :label="$t('app.allowPort')" prop="params.HOST_IP">
-                                <el-select v-model="runtime.params['HOST_IP']">
+                                <el-switch
-                                    <el-option :label="$t('runtime.open')" value="0.0.0.0"></el-option>
+                                    v-model="runtime.params['HOST_IP']"
-                                    <el-option :label="$t('runtime.close')" value="127.0.0.1"></el-option>
+                                    :active-value="'0.0.0.0'"
-                                </el-select>
+                                    :inactive-value="'127.0.0.1'"
+                                />
                             </el-form-item>
                         </el-col>
                     </el-row>
@@ -178,6 +201,7 @@ const initData = (type: string) => ({
     params: {
         PACKAGE_MANAGER: 'npm',
         HOST_IP: '0.0.0.0',
+        CUSTOM_SCRIPT: '0',
     },
     type: type,
     resource: 'appstore',
@@ -193,12 +217,14 @@ const rules = ref<any>({
     codeDir: [Rules.requiredInput],
     port: [Rules.requiredInput, Rules.paramPort, checkNumberRange(1, 65535)],
     source: [Rules.requiredSelect],
+
     params: {
         NODE_APP_PORT: [Rules.requiredInput, Rules.paramPort, checkNumberRange(1, 65535)],
         PACKAGE_MANAGER: [Rules.requiredSelect],
         HOST_IP: [Rules.requiredSelect],
         EXEC_SCRIPT: [Rules.requiredSelect],
         CONTAINER_NAME: [Rules.requiredInput, Rules.containerName],
+        CUSTOM_SCRIPT: [Rules.requiredInput],
     },
 });
 const scripts = ref<Runtime.NodeScripts[]>([]);
@@ -250,6 +276,13 @@ const getPath = (codeDir: string) => {
     getScripts();
 };
 
+const changeScriptType = () => {
+    runtime.params['EXEC_SCRIPT'] = '';
+    if (runtime.params['CUSTOM_SCRIPT'] == '0') {
+        getScripts();
+    }
+};
+
 const getScripts = () => {
     GetNodeScripts({ codeDir: runtime.codeDir }).then((res) => {
         scripts.value = res.data;
@@ -359,10 +392,11 @@ const getRuntime = async (id: number) => {
             port: data.port,
         });
         editParams.value = data.appParams;
-        if (mode.value == 'edit') {
+        searchApp(data.appID);
-            searchApp(data.appID);
+        if (data.params['CUSTOM_SCRIPT'] == '0') {
+            getScripts();
         }
-        getScripts();
+        open.value = true;
     } catch (error) {}
 };
 
@@ -372,10 +406,10 @@ const acceptParams = async (props: OperateRrops) => {
     if (props.mode === 'create') {
         Object.assign(runtime, initData(props.type));
         searchApp(null);
+        open.value = true;
     } else {
         getRuntime(props.id);
     }
-    open.value = true;
 };
 
 defineExpose({