A predefined vars

web/src/lang/en.js

@@ -163,6 +163,7 @@ export default {
     afterDeployScriptTips: `The script that runs on the target server after deploy<br>
     For example: bash after-deploy-script.sh<br>
     If you need to restart the service, please pay attention to whether you need nohup<br>`,
+    predefinedVar: 'predefined vars',
     autoDeployTitle: 'Deploy trigger: automatically build the release project after certain conditions are met',
     autoDeployTips: `Go to the webhook page in GitLab、GitHub or Gitee <br>
     Fill in URL <span style="color: red">http(s)://domian(IP)/deploy/webhook?project_id={projectId}</span><br>

web/src/lang/zh.js

@@ -174,6 +174,7 @@ export default {
     运行方式：打包成一份脚本文件<br>
     如需重启服务，请注意是否需要nohup<br>
     检查服务器是否安装该脚本类型(默认以bash运行)`,
+    predefinedVar: '预定义变量',
     autoDeployTitle: '构建触发器：达成某种条件后自动构建发布项目',
     autoDeployTips: `前往GitLab、GitHub或Gitee的webhook（可前往谷歌查找各自webhook所在的位置）<br>
     填入连接<span style="color: red">http(s)://域名(IP)/deploy/webhook?project_id={projectId}</span><br>

web/src/views/project/index.vue

@@ -236,14 +236,35 @@
               </el-tooltip>
             </span>
             <el-form-item prop="afterDeployScript" label-width="0px">
-              <el-select v-model="formData.afterDeployScriptMode" :placeholder="$t('projectPage.scriptMode')+'(Default: bash)'" style="width:100%" @change="handleScriptModeChange">
-                <el-option
-                  v-for="(item, index) in scriptModeOption"
-                  :key="index"
-                  :label="item.label"
-                  :value="item.value"
-                />
-              </el-select>
+              <el-row type="flex">
+                <el-select v-model="formData.afterDeployScriptMode" :placeholder="$t('projectPage.scriptMode')+'(Default: bash)'" style="flex: 1" @change="handleScriptModeChange">
+                  <el-option
+                    v-for="(item, index) in scriptModeOption"
+                    :key="index"
+                    :label="item.label"
+                    :value="item.value"
+                  />
+                </el-select>
+                <el-popover
+                  placement="bottom-end"
+                  :title="$t('projectPage.predefinedVar')"
+                  width="400"
+                  trigger="hover"
+                >
+                  <el-row>
+                    <el-row>
+                      <span>${PROJECT_NAME}：</span><span>{{ formData.name !== '' ? formData.name : 'project.name' }}</span>
+                    </el-row>
+                    <el-row>
+                      <span>${PROJECT_PATH}：</span><span>{{ formData.path !== '' ? formData.path : 'project.path' }}</span>
+                    </el-row>
+                    <el-row>
+                      <span>${PROJECT_SYMLINK_PATH}：</span><span>{{ formData.symlinkPath !== '' ? formData.symlinkPath : 'project.symlink_path' }}</span>
+                    </el-row>
+                  </el-row>
+                  <el-button slot="reference">{{ $t('projectPage.predefinedVar') }}</el-button>
+                </el-popover>
+              </el-row>
             </el-form-item>
             <el-form-item prop="afterDeployScript" label-width="0px">
               <codemirror ref="afterDeployScript" v-model="formData.afterDeployScript" :options="cmOption" />
@@ -604,6 +625,7 @@ export default {
     handleCopy(data) {
       this.handleEdit(data)
       this.formData.id = 0
+      this.formProps.showServers = this.formProps.showUsers = true
     },
 
     handleRemove(data) {