Parcourir la source

调整构建配置相关页面

reghao il y a 5 jours
Parent
commit
fbf6bf0e72

+ 24 - 15
src/views/devops/build/BuildDir.vue

@@ -15,20 +15,16 @@
           label="机器地址"
         />
         <el-table-column
-          prop="dirPath"
+          prop="opsDir"
           label="本地目录"
         />
-        <el-table-column
-          prop="mountedOn"
-          label="所属分区"
-        />
         <el-table-column
           prop="totalStr"
-          label="分区总量"
+          label="磁盘总量"
         />
         <el-table-column
           prop="availStr"
-          label="分区可用"
+          label="可用容量"
         />
         <el-table-column
           fixed="right"
@@ -38,7 +34,9 @@
           <template slot-scope="scope">
             <el-button
               size="mini"
-              @click="handleEdit(scope.$index, scope.row)"
+              type="danger"
+              icon="el-icon-delete"
+              @click="handleEraseDir(scope.row)"
             >清空</el-button>
           </template>
         </el-table-column>
@@ -48,7 +46,7 @@
 </template>
 
 <script>
-import { eraseBuildDir, getBuildDir } from '@/api/devops'
+import {eraseBuildDir, getBuildDir} from '@/api/devops'
 
 export default {
   name: 'BuildDir',
@@ -74,12 +72,23 @@ export default {
         this.$message.error(error.message)
       })
     },
-    handleEdit(index, row) {
-      eraseBuildDir().then(resp => {
-        this.getData()
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message)
+    handleEraseDir(row) {
+      this.$confirm('确定要清空构建目录中的数据?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        eraseBuildDir().then(resp => {
+          this.getData()
+          this.$message.info(resp.msg)
+        }).catch(error => {
+          this.$message.error(error.message)
+        })
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消'
+        })
       })
     }
   }

+ 19 - 0
src/views/devops/build/Compiler.vue

@@ -60,6 +60,22 @@
             >编辑</el-button>
           </template>
         </el-table-column>
+        <el-table-column
+          prop="useCount"
+          label="使用量"
+        >
+          <template slot-scope="scope">
+            <el-tag disable-transitions>
+              <span>{{ scope.row.useCount }}</span>
+            </el-tag>
+            <el-button
+              style="margin-top: 5px; margin-left: 5px"
+              size="mini"
+              type="success"
+              @click="handleUsage(scope.row)"
+            >查看</el-button>
+          </template>
+        </el-table-column>
         <el-table-column
           fixed="right"
           label="操作"
@@ -671,6 +687,9 @@ export default {
           message: '已取消'
         })
       })
+    },
+    handleUsage(row) {
+      this.$message.info('handleUsage')
     }
   }
 }

+ 68 - 9
src/views/devops/build/Packer.vue

@@ -23,14 +23,14 @@
         />
         <el-table-column
           prop="artifactPath"
-          label="构建产物路径"
+          label="编译产物路径"
         >
           <template slot="header">
             <span>
-              构建产物路径
+              编译产物路径
               <el-tooltip placement="top" effect="dark">
                 <div slot="content">
-                  构建产物所在的相对于源码根目录的路径,例如: target/app.jar 或 dist/ <br/>
+                  编译产物所在的相对于源码根目录的路径,例如: target/app.jar 或 dist/ <br/>
                   docker 打包类型的路径在 Dockerfile 中指定, 此处为 N/A
                 </div>
                 <i class="el-icon-question" style="margin-left: 5px; cursor: pointer; color: #909399;"/>
@@ -38,6 +38,47 @@
             </span>
           </template>
         </el-table-column>
+        <el-table-column
+          prop="name"
+          label="存储位置"
+        >
+          <template slot="header">
+            <span>
+              编译产物存储位置
+              <el-tooltip placement="top" effect="dark">
+                <div slot="content">
+                  编译产物经过打包处理后的存储位置, 可以为本机磁盘路径或 URL <br/>
+                  docker 打包类型的存储位置在 docker 仓库
+                </div>
+                <i class="el-icon-question" style="margin-left: 5px; cursor: pointer; color: #909399;"/>
+              </el-tooltip>
+            </span>
+          </template>
+          <template slot-scope="scope">
+            <el-button
+              style="margin-top: 5px; margin-left: 5px"
+              size="mini"
+              type="success"
+              @click="handleTargetPath(scope.row)"
+            >查看</el-button>
+          </template>
+        </el-table-column>
+        <el-table-column
+          prop="useCount"
+          label="使用量"
+        >
+          <template slot-scope="scope">
+            <el-tag disable-transitions>
+              <span>{{ scope.row.useCount }}</span>
+            </el-tag>
+            <el-button
+              style="margin-top: 5px; margin-left: 5px"
+              size="mini"
+              type="success"
+              @click="handleUsage(scope.row)"
+            >查看</el-button>
+          </template>
+        </el-table-column>
         <el-table-column
           fixed="right"
           label="操作"
@@ -118,14 +159,14 @@
                       />
                     </el-tooltip>
                   </div>
-                  <div class="form-tip">构建生成的镜像会推送到该仓库</div>
+                  <div class="form-tip">编译构建生成的镜像会推送到该仓库</div>
                 </el-form-item>
               </div>
               <div v-else-if="form.type === 'ossStatic'" class="oss-config-group">
                 <el-form-item prop="artifactPath">
                   <span slot="label">
-                    构建产物路径
-                    <el-tooltip content="构建完成后产物所在的相对路径,例如:dist/ 或 target/app.jar" placement="top">
+                    编译产物路径
+                    <el-tooltip content="编译完成后产物所在的相对路径,例如:dist/ 或 target/app.jar" placement="top">
                       <i class="el-icon-question" style="cursor: help; color: #909399;"></i>
                     </el-tooltip>
                   </span>
@@ -159,14 +200,14 @@
                       />
                     </el-tooltip>
                   </div>
-                  <div class="form-tip">构建生成的静态产物将自动上传并同步至该 OSS, 应用部署配置中会指定使用的 bucket</div>
+                  <div class="form-tip">编译生成的静态产物将自动上传并同步至该 OSS, 应用部署配置中会指定使用的 bucket</div>
                 </el-form-item>
               </div>
               <div v-else>
                 <el-form-item prop="artifactPath">
                   <span slot="label">
-                    构建产物路径
-                    <el-tooltip content="构建完成后产物所在的相对路径,例如:dist/ 或 target/app.jar" placement="top">
+                    编译产物路径
+                    <el-tooltip content="编译完成后产物所在的相对路径,例如:dist/ 或 target/app.jar" placement="top">
                       <i class="el-icon-question" style="cursor: help; color: #909399;"></i>
                     </el-tooltip>
                   </span>
@@ -199,6 +240,13 @@
       center
     >
     </el-dialog>
+    <el-dialog
+      title="存储位置"
+      append-to-body
+      :visible.sync="showTargetDialog"
+      center
+    >
+    </el-dialog>
   </el-container>
 </template>
 
@@ -242,6 +290,11 @@ export default {
       showAddOssDialog: false,
       ossForm: {
         ossEndpoint: ''
+      },
+      // **********************************************************************
+      showTargetDialog: false,
+      ossForm1: {
+        ossEndpoint: ''
       }
     }
   },
@@ -372,6 +425,12 @@ export default {
     },
     goToAddOss() {
       this.showAddOssDialog = true
+    },
+    handleUsage(row) {
+      this.$message.info('handleUsage')
+    },
+    handleTargetPath(row) {
+      this.showTargetDialog = true
     }
   }
 }

+ 32 - 8
src/views/devops/build/RepoAuth.vue

@@ -14,16 +14,16 @@
         style="width: 100%"
       >
         <el-table-column
-          prop="type"
-          label="仓库类型"
+          prop="authType"
+          label="认证类型"
         />
         <el-table-column
           prop="name"
           label="认证名字"
         />
         <el-table-column
-          prop="authType"
-          label="认证类型"
+          prop="type"
+          label="仓库类型"
         />
         <el-table-column
           prop="username"
@@ -33,6 +33,22 @@
           prop="password"
           label="密码"
         />
+        <el-table-column
+          prop="useCount"
+          label="使用量"
+        >
+          <template slot-scope="scope">
+            <el-tag disable-transitions>
+              <span>{{ scope.row.useCount }}</span>
+            </el-tag>
+            <el-button
+              style="margin-top: 5px; margin-left: 5px"
+              size="mini"
+              type="success"
+              @click="handleUsage(scope.row)"
+            >查看</el-button>
+          </template>
+        </el-table-column>
         <el-table-column
           fixed="right"
           label="操作"
@@ -262,10 +278,15 @@ export default {
     onAddRepoAuth() {
       this.$refs.form.validate((valid) => {
         if (valid) {
-          // 这里发起 API 请求
-          console.log('Final Data:', this.form)
-          this.$message.success('仓库认证配置添加成功!')
-          // 逻辑处理,如关闭弹窗或跳转列表
+          addRepoAuth(this.form).then(resp => {
+            this.$message.info(resp.msg)
+            this.$refs.form.resetFields();
+            this.getData()
+          }).catch(error => {
+            this.$message.error(error.message)
+          }).finally(() => {
+            this.showAddDialog = false
+          })
         } else {
           return false
         }
@@ -291,6 +312,9 @@ export default {
           message: '已取消'
         })
       })
+    },
+    handleUsage(row) {
+      this.$message.info('handleUsage')
     }
   }
 }

+ 28 - 3
src/views/devops/docker/DockerRegistry.vue

@@ -17,10 +17,30 @@
           prop="registryUrl"
           label="仓库地址"
         />
+        <el-table-column
+          prop="registryNamespace"
+          label="命名空间"
+        />
         <el-table-column
           prop="repoAuthName"
           label="仓库认证名"
         />
+        <el-table-column
+          prop="useCount"
+          label="使用量"
+        >
+          <template slot-scope="scope">
+            <el-tag disable-transitions>
+              <span>{{ scope.row.useCount }}</span>
+            </el-tag>
+            <el-button
+              style="margin-top: 5px; margin-left: 5px"
+              size="mini"
+              type="success"
+              @click="handleUsage(scope.row)"
+            >查看</el-button>
+          </template>
+        </el-table-column>
         <el-table-column
           fixed="right"
           label="操作"
@@ -84,11 +104,12 @@
               </el-col>
             </el-row>
           </el-form-item>
-
           <el-form-item label="仓库地址">
             <el-input v-model="form.registryUrl" style="width: 70%" placeholder="e.g. registry.cn-hangzhou.aliyuncs.com" />
           </el-form-item>
-
+          <el-form-item label="命名空间">
+            <el-input v-model="form.registryNamespace" style="width: 70%" placeholder="e.g. reghao/" />
+          </el-form-item>
           <el-form-item>
             <el-button type="primary" @click="onAddDockerRegistry">确定</el-button>
           </el-form-item>
@@ -128,7 +149,8 @@ export default {
       repoAuthNames: [],
       form: {
         repoAuthName: '',
-        registryUrl: ''
+        registryUrl: '',
+        registryNamespace: ''
       },
       // **********************************************************************
       showAddRepoAuthDialog: false,
@@ -211,6 +233,9 @@ export default {
     },
     handleAddRepoAuth() {
       this.showAddRepoAuthDialog = true
+    },
+    handleUsage(row) {
+      this.$message.info('handleUsage')
     }
   }
 }

+ 19 - 0
src/views/devops/machine/AliyunKey.vue

@@ -26,6 +26,22 @@
           prop="repoAuthName"
           label="仓库认证名字"
         />
+        <el-table-column
+          prop="useCount"
+          label="使用量"
+        >
+          <template slot-scope="scope">
+            <el-tag disable-transitions>
+              <span>{{ scope.row.useCount }}</span>
+            </el-tag>
+            <el-button
+              style="margin-top: 5px; margin-left: 5px"
+              size="mini"
+              type="success"
+              @click="handleUsage(scope.row)"
+            >查看</el-button>
+          </template>
+        </el-table-column>
         <el-table-column
           fixed="right"
           label="操作"
@@ -78,6 +94,9 @@ export default {
     },
     handleEdit(index, row) {
       this.$message.info('delete ' + row.endpoint)
+    },
+    handleUsage(row) {
+      this.$message.info('handleUsage')
     }
   }
 }