更新 views/devops/app 模块

src/api/devops.js

@@ -196,14 +196,87 @@ export function getBuildDeployList(queryInfo) {
   return get(devopsApi.getBuildDeployList + '/build', queryInfo)
 }
 
+export function getBuildTaskList() {
+  return get(devopsApi.getBuildDeployList + '/task')
+}
+
+export function cancelBuildTask(formData) {
+  return postForm(devopsApi.getBuildDeployList + '/cancel_task', formData)
+}
+
+export function resetBuildStat() {
+  return postForm(devopsApi.getBuildDeployList + '/reset')
+}
+
+export function cancelBuild() {
+  return postForm(devopsApi.getBuildDeployList + '/cancel')
+}
+
+export function updateApp(formData) {
+  return postForm(devopsApi.getBuildDeployList + '/build', formData)
+}
+
+export function buildApp(formData) {
+  return postForm(devopsApi.getBuildDeployList + '/build', formData)
+}
+
+export function getDeployList(queryInfo) {
+  return get(devopsApi.getBuildDeployList + '/deploy', queryInfo)
+}
+
+export function deployApp(formData) {
+  return postForm(devopsApi.getBuildDeployList + '/deploy', formData)
+}
+
+// 构建历史
+export function getBuildLogList(queryInfo) {
+  return get(devopsApi.getBuildDeployList + '/history', queryInfo)
+}
+
+export function getBuildResult(queryInfo) {
+  return get(devopsApi.getBuildDeployList + '/result', queryInfo)
+}
+
+export function getBuildConfigSnapshot(queryInfo) {
+  return get(devopsApi.getBuildDeployList + '/config', queryInfo)
+}
+
+export function getBuildConsumed(queryInfo) {
+  return get(devopsApi.getBuildDeployList + '/consumed', queryInfo)
+}
+
+export function getBuildPackageUrl(queryInfo) {
+  return get(devopsApi.getBuildDeployList + '/package_url', queryInfo)
+}
+
+export function deleteBuildLog(formData) {
+  return postForm(devopsApi.getBuildDeployList + '/delete', formData)
+}
+
 export function getAppStatList(queryInfo) {
   return get(devopsApi.getAppStatList, queryInfo)
 }
 
-export function getAppStat(appId) {
+export function getAppStatDeatil(appId) {
   return get(devopsApi.getAppStatList + '/detail?appId=' + appId)
 }
 
+export function restartAppStat(formData) {
+  return postForm(devopsApi.getAppStatList + '/restart', formData)
+}
+
+export function startAppStat(formData) {
+  return postForm(devopsApi.getAppStatList + '/start', formData)
+}
+
+export function stopAppStat(formData) {
+  return postForm(devopsApi.getAppStatList + '/stop', formData)
+}
+
+export function getAppStat(queryInfo) {
+  return get(devopsApi.getAppStatList + '/now', queryInfo)
+}
+
 export function getSiteOptionList() {
   return get(devopsApi.getSiteOptionList)
 }

src/views/devops/app/AppConfig.vue

@@ -104,7 +104,7 @@
             <el-button
               style="margin-top: 5px; margin-left: 5px"
               size="mini"
-              @click="handleEdit(scope.$index, scope.row)"
+              @click="handleDetail(scope.$index, scope.row)"
             >详情</el-button>
             <el-button
               style="margin-top: 5px; margin-left: 5px"
@@ -209,7 +209,7 @@
                 v-for="(item, index) in repoAuthList"
                 :key="index"
                 :label="item.label"
-                :value="item.value"
+                :value="item.label"
               />
             </el-select>
           </el-form-item>
@@ -219,7 +219,7 @@
                 v-for="(item, index) in compilerList"
                 :key="index"
                 :label="item.label"
-                :value="item.value"
+                :value="item.label"
               />
             </el-select>
           </el-form-item>
@@ -229,7 +229,7 @@
                 v-for="(item, index) in packerList"
                 :key="index"
                 :label="item.label"
-                :value="item.value"
+                :value="item.label"
               />
             </el-select>
           </el-form-item>
@@ -242,6 +242,47 @@
         </el-form>
       </template>
     </el-dialog>
+    <el-dialog
+      title="应用配置详情"
+      append-to-body
+      :visible.sync="showDetailDialog"
+      center
+    >
+      <template>
+        <el-form v-if="appConfigDetail !== null" :model="appConfigDetail" label-width="80px">
+          <el-form-item label="应用 ID" style="width: 70%; padding-right: 2px">
+            <el-input v-model="appConfigDetail.appId" style="width: 70%; padding-right: 2px" readonly />
+          </el-form-item>
+          <el-form-item label="应用名" style="width: 70%; padding-right: 2px">
+            <el-input v-model="appConfigDetail.appName" style="width: 70%; padding-right: 2px" readonly />
+          </el-form-item>
+          <el-form-item label="应用仓库" style="width: 70%; padding-right: 2px">
+            <el-input v-model="appConfigDetail.appRepo" style="width: 70%; padding-right: 2px" readonly />
+          </el-form-item>
+          <el-form-item label="仓库分支" style="width: 70%; padding-right: 2px">
+            <el-input v-model="appConfigDetail.repoBranch" style="width: 70%; padding-right: 2px" readonly />
+          </el-form-item>
+          <el-form-item label="应用路径" style="width: 70%; padding-right: 2px">
+            <el-input v-model="appConfigDetail.appRootPath" style="width: 70%; padding-right: 2px" readonly />
+          </el-form-item>
+          <el-form-item label="监听端口" style="width: 70%; padding-right: 2px">
+            <el-input v-model="appConfigDetail.bindPorts" style="width: 70%; padding-right: 2px" readonly />
+          </el-form-item>
+          <el-form-item label="仓库认证">
+            <el-input v-model="appConfigDetail.repoAuthConfig" style="width: 70%; padding-right: 2px" readonly />
+          </el-form-item>
+          <el-form-item label="编译工具">
+            <el-input v-model="appConfigDetail.compilerConfig" style="width: 70%; padding-right: 2px" readonly />
+          </el-form-item>
+          <el-form-item label="打包工具">
+            <el-input v-model="appConfigDetail.packerConfig" style="width: 70%; padding-right: 2px" readonly />
+          </el-form-item>
+          <el-form-item label="Dockerfile" style="width: 70%; padding-right: 2px">
+            <el-input v-model="appConfigDetail.dockerfile" type="textarea" :rows="10" style="width: 70%; padding-right: 2px" readonly />
+          </el-form-item>
+        </el-form>
+      </template>
+    </el-dialog>
     <el-dialog
       title="添加应用配置"
       append-to-body
@@ -294,7 +335,7 @@
                 v-for="(item, index) in repoAuthList"
                 :key="index"
                 :label="item.label"
-                :value="item.value"
+                :value="item.label"
               />
             </el-select>
           </el-form-item>
@@ -304,7 +345,7 @@
                 v-for="(item, index) in compilerList"
                 :key="index"
                 :label="item.label"
-                :value="item.value"
+                :value="item.label"
               />
             </el-select>
           </el-form-item>
@@ -314,7 +355,7 @@
                 v-for="(item, index) in packerList"
                 :key="index"
                 :label="item.label"
-                :value="item.value"
+                :value="item.label"
               />
             </el-select>
           </el-form-item>
@@ -513,9 +554,18 @@ export default {
       // **********************************************************************
       showEditDialog: false,
       editForm: {
-        appId: null
+        appId: null,
+        appName: null,
+        repoBranch: null,
+        repoAuthConfig: null,
+        compilerConfig: null,
+        packerConfig: null,
+        dockerfile: null
       },
       // **********************************************************************
+      showDetailDialog: false,
+      appConfigDetail: null,
+      // **********************************************************************
       showDeployConfigDialog: false,
       appDeployConfigList: [],
       showAddDeployConfigDialog: false,
@@ -614,14 +664,26 @@ export default {
       }).catch(error => {
         this.$message.error(error.message)
       }).finally(() => {
-        this.showEditDialog = false
+        this.showCopyDialog = false
       })
     },
     handleEdit(index, row) {
-      getAppConfig(row.appId).then(resp => {
+      getBuildConfig().then(resp => {
         if (resp.code === 0) {
-          this.editForm = resp.data
-          this.showEditDialog = true
+          this.repoAuthList = resp.data.repoAuthList
+          this.compilerList = resp.data.compilerList
+          this.packerList = resp.data.packerList
+
+          getAppConfig(row.appId).then(resp => {
+            if (resp.code === 0) {
+              this.editForm = resp.data
+              this.showEditDialog = true
+            } else {
+              this.$message.error(resp.msg)
+            }
+          }).catch(error => {
+            this.$message.error(error.message)
+          })
         } else {
           this.$message.error(resp.msg)
         }
@@ -632,6 +694,12 @@ export default {
     onEdit() {
       const formData = new FormData()
       formData.append('appId', this.editForm.appId)
+      formData.append('appName', this.editForm.appName)
+      formData.append('repoBranch', this.editForm.repoBranch)
+      formData.append('repoAuthConfig', this.editForm.repoAuthConfig)
+      formData.append('compilerConfig', this.editForm.compilerConfig)
+      formData.append('packerConfig', this.editForm.packerConfig)
+      formData.append('dockerfile', this.editForm.dockerfile)
       updateAppConfig(formData).then(resp => {
         if (resp.code === 0) {
           this.getData()
@@ -644,6 +712,18 @@ export default {
         this.showEditDialog = false
       })
     },
+    handleDetail(index, row) {
+      getAppConfig(row.appId).then(resp => {
+        if (resp.code === 0) {
+          this.appConfigDetail = resp.data
+          this.showDetailDialog = true
+        } else {
+          this.$message.error(resp.msg)
+        }
+      }).catch(error => {
+        this.$message.error(error.message)
+      })
+    },
     handleAdd() {
       getBuildConfig().then(resp => {
         if (resp.code === 0) {
@@ -661,6 +741,17 @@ export default {
     onAdd() {
       const formData = new FormData()
       formData.append('appId', this.addForm.appId)
+      formData.append('appName', this.addForm.appName)
+      formData.append('appType', this.addForm.appType)
+      formData.append('env', this.addForm.env)
+      formData.append('appRepo', this.addForm.appRepo)
+      formData.append('repoBranch', this.addForm.repoBranch)
+      formData.append('appRootPath', this.addForm.appRootPath)
+      formData.append('bindPorts', this.addForm.bindPorts)
+      formData.append('repoAuthConfig', this.addForm.repoAuthConfig)
+      formData.append('compilerConfig', this.addForm.compilerConfig)
+      formData.append('packerConfig', this.addForm.packerConfig)
+      formData.append('dockerfile', this.addForm.dockerfile)
       addAppConfig(formData).then(resp => {
         if (resp.code === 0) {
           this.getData()

src/views/devops/app/AppStat.vue

@@ -170,8 +170,14 @@
 </template>
 
 <script>
-import { updateVideoScope, videoInfo } from '@/api/video'
-import { getAppStat, getAppStatList, getAppTypeList, getEnvList } from '@/api/devops'
+import {
+  getAppStat,
+  getAppStatDeatil,
+  getAppStatList,
+  getEnvList,
+  restartAppStat,
+  startAppStat, stopAppStat
+} from '@/api/devops'
 
 export default {
   name: 'AppStat',
@@ -262,7 +268,7 @@ export default {
       })
     },
     handleDetail(index, row) {
-      getAppStat(row.appId).then(resp => {
+      getAppStatDeatil(row.appId).then(resp => {
         if (resp.code === 0) {
           this.appStatList = resp.data
           this.showStatDialog = true
@@ -274,16 +280,44 @@ export default {
       })
     },
     handleRestart(index, row) {
-      this.$message.info('handleRestart')
+      const formData = new FormData()
+      formData.append('appId', row.appId)
+      formData.append('machineId', row.machineId)
+      restartAppStat(formData).then(resp => {
+        this.$message.info(resp.msg)
+      }).catch(error => {
+        this.$message.error(error.message)
+      })
     },
     handleStop(index, row) {
-      this.$message.info('handleStop')
+      const formData = new FormData()
+      formData.append('appId', row.appId)
+      formData.append('machineId', row.machineId)
+      stopAppStat(formData).then(resp => {
+        this.$message.info(resp.msg)
+      }).catch(error => {
+        this.$message.error(error.message)
+      })
     },
     handleStart(index, row) {
-      this.$message.info('handleStart')
+      const formData = new FormData()
+      formData.append('appId', row.appId)
+      formData.append('machineId', row.machineId)
+      startAppStat(formData).then(resp => {
+        this.$message.info(resp.msg)
+      }).catch(error => {
+        this.$message.error(error.message)
+      })
     },
     handleGetStat(index, row) {
-      this.$message.info('handleGetStat')
+      const queryInfo = {}
+      queryInfo.appId = row.appId
+      queryInfo.machineId = row.machineId
+      getAppStat(queryInfo).then(resp => {
+        this.$message.info(resp.msg)
+      }).catch(error => {
+        this.$message.error(error.message())
+      })
     },
     onSelectChange() {
       this.currentPage = 1

src/views/devops/app/BuildDeploy.vue

@@ -53,7 +53,6 @@
         <el-table-column
           prop="repoBranch"
           label="分支"
-          :show-overflow-tooltip="true"
         />
         <el-table-column
           prop="bindPorts"
@@ -78,16 +77,27 @@
           <template slot-scope="scope">
             <el-button
               v-if="scope.row.buildResult === '构建成功'"
-              size="mini"
-              type="success"
-              @click="handleResult(scope.$index, scope.row)"
-            >成功</el-button>
+              type="text"
+            >
+              <span style="color: green">{{ scope.row.buildResult }}</span>
+            </el-button>
             <el-button
               v-else-if="scope.row.buildResult === '构建失败'"
-              size="mini"
-              type="danger"
-              @click="handleResult(scope.$index, scope.row)"
-            >失败</el-button>
+              type="text"
+              @click="handleBuildResult(scope.$index, scope.row)"
+            >
+              <span style="color: red">{{ scope.row.buildResult }}</span>
+            </el-button>
+            <el-button
+              v-else-if="scope.row.buildResult === '正在构建'"
+              type="text"
+            >
+              <span style="color: blue">{{ scope.row.buildResult }}</span>
+            </el-button>
+            <el-button
+              v-else
+              type="text"
+            >{{ scope.row.buildResult }}</el-button>
           </template>
         </el-table-column>
         <el-table-column
@@ -105,12 +115,6 @@
             <el-tag style="margin-top: 5px; margin-left: 5px" disable-transitions>
               <span>{{ scope.row.totalRunning }}</span>
             </el-tag>
-            <el-button
-              style="margin-top: 5px; margin-left: 5px"
-              size="mini"
-              type="success"
-              @click="handleNode(scope.$index, scope.row)"
-            >查看</el-button>
           </template>
         </el-table-column>
         <el-table-column
@@ -132,12 +136,12 @@
             <el-button
               style="margin-top: 5px; margin-left: 5px"
               size="mini"
-              @click="handleDeploy(scope.$index, scope.row)"
+              @click="handleDeployList(scope.$index, scope.row)"
             >部署列表</el-button>
             <el-button
               style="margin-top: 5px; margin-left: 5px"
               size="mini"
-              @click="handleBuild(scope.$index, scope.row)"
+              @click="handleBuildLog(scope.$index, scope.row)"
             >构建历史</el-button>
           </template>
         </el-table-column>
@@ -162,6 +166,207 @@
       center
     >
       <template>
+        <el-table
+          :data="buildTaskList"
+          border
+          height="480"
+          style="width: 100%"
+        >
+          <el-table-column
+            prop="appId"
+            label="应用"
+          />
+          <el-table-column
+            prop="appType"
+            label="类型"
+          />
+          <el-table-column
+            prop="env"
+            label="环境"
+          />
+          <el-table-column
+            prop="stat"
+            label="状态"
+          />
+          <el-table-column
+            fixed="right"
+            label="操作"
+            width="280"
+          >
+            <template slot-scope="scope">
+              <el-button
+                style="margin-top: 5px; margin-left: 5px"
+                size="mini"
+                @click="cancelTask(scope.$index, scope.row)"
+              >取消</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+      </template>
+    </el-dialog>
+    <el-dialog
+      title="部署列表"
+      append-to-body
+      :visible.sync="showDeployDialog"
+      width="70%"
+      center
+    >
+      <template>
+        <el-table
+          :data="deployList"
+          border
+          height="480"
+          style="width: 100%"
+        >
+          <el-table-column
+            prop="machineIpv4"
+            label="机器地址"
+          />
+          <el-table-column
+            prop="machineStatus"
+            label="机器状态"
+          />
+          <el-table-column
+            prop="commitId"
+            label="当前版本"
+          />
+          <el-table-column
+            prop="packagePath"
+            label="包路径"
+          />
+          <el-table-column
+            prop="deployBy"
+            label="部署用户"
+          />
+          <el-table-column
+            prop="deployTime"
+            label="部署时间"
+          />
+          <el-table-column
+            prop="deployResult"
+            label="部署结果"
+          />
+          <el-table-column
+            fixed="right"
+            label="操作"
+            width="280"
+          >
+            <template slot-scope="scope">
+              <el-button
+                style="margin-top: 5px; margin-left: 5px"
+                size="mini"
+                @click="handleDeployApp(scope.$index, scope.row)"
+              >部署</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+      </template>
+    </el-dialog>
+    <el-dialog
+      title="构建历史列表"
+      append-to-body
+      :visible.sync="showBuildLogDialog"
+      width="100%"
+      center
+    >
+      <template>
+        <el-table
+          :data="dataList1"
+          border
+          height="480"
+          style="width: 100%"
+        >
+          <el-table-column
+            prop="branch"
+            label="分支"
+          />
+          <el-table-column
+            prop="commitId"
+            label="版本 ID"
+          />
+          <el-table-column
+            prop="buildTime"
+            label="构建时间"
+          />
+          <el-table-column
+            prop="buildResult"
+            label="构建结果"
+          >
+            <template slot-scope="scope">
+              <el-button
+                size="mini"
+                type="success"
+                @click="handleBuildResult(scope.$index, scope.row)"
+              >查看</el-button>
+            </template>
+          </el-table-column>
+          <el-table-column
+            prop="buildBy"
+            label="部署用户"
+          />
+          <el-table-column
+            prop="packagePath"
+            label="包路径"
+          />
+          <el-table-column
+            prop="commitId"
+            label="构建配置快照"
+          >
+            <template slot-scope="scope">
+              <el-button
+                size="mini"
+                type="success"
+                @click="handleBuildConfig(scope.$index, scope.row)"
+              >查看</el-button>
+            </template>
+          </el-table-column>
+          <el-table-column
+            prop="commitTime"
+            label="构建耗时"
+          >
+            <template slot-scope="scope">
+              <el-button
+                size="mini"
+                type="success"
+                @click="handleBuildConsumed(scope.$index, scope.row)"
+              >查看</el-button>
+            </template>
+          </el-table-column>
+          <el-table-column
+            fixed="right"
+            label="操作"
+            width="280"
+          >
+            <template slot-scope="scope">
+              <el-button
+                style="margin-top: 5px; margin-left: 5px"
+                size="mini"
+                @click="handleDeployBuild(scope.$index, scope.row)"
+              >部署</el-button>
+              <el-button
+                style="margin-top: 5px; margin-left: 5px"
+                size="mini"
+                @click="handleBuildPackage(scope.$index, scope.row)"
+              >下载</el-button>
+              <el-button
+                style="margin-top: 5px; margin-left: 5px"
+                size="mini"
+                @click="handleDeleteBuildLog(scope.$index, scope.row)"
+              >删除</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <el-pagination
+          background
+          :small="screenWidth <= 768"
+          layout="prev, pager, next"
+          :page-size="pageSize1"
+          :current-page="currentPage1"
+          :total="totalSize1"
+          @current-change="handleCurrentChange1"
+          @prev-click="handleCurrentChange1"
+          @next-click="handleCurrentChange1"
+        />
       </template>
     </el-dialog>
     <el-dialog
@@ -171,33 +376,159 @@
       center
     >
       <template>
+        <span>{{ buildResult }}</span>
       </template>
     </el-dialog>
     <el-dialog
-      title="部署列表"
+      title="构建配置快照"
       append-to-body
-      :visible.sync="showDeployDialog"
-      width="70%"
+      :visible.sync="showSnapshotDialog"
       center
     >
       <template>
+        <div v-if="buildConfigSnapshot !== null">
+          <h3>仓库配置</h3>
+          <el-descriptions direction="vertical" :column="3" border>
+            <el-descriptions-item>
+              <template slot="label">
+                <i class="el-icon-mobile-phone" />
+                仓库认证
+              </template>
+              {{ buildConfigSnapshot.repoType }}
+            </el-descriptions-item>
+            <el-descriptions-item>
+              <template slot="label">
+                <i class="el-icon-location-outline" />
+                认证名字
+              </template>
+              {{ buildConfigSnapshot.repoName }}
+            </el-descriptions-item>
+            <el-descriptions-item>
+              <template slot="label">
+                <i class="el-icon-tickets" />
+                认证类型
+              </template>
+              {{ buildConfigSnapshot.repoAuthType }}
+            </el-descriptions-item>
+          </el-descriptions>
+          <h3>编译配置</h3>
+          <el-descriptions direction="vertical" :column="3" border>
+            <el-descriptions-item>
+              <template slot="label">
+                <i class="el-icon-mobile-phone" />
+                编译器类型
+              </template>
+              {{ buildConfigSnapshot.compileType }}
+            </el-descriptions-item>
+            <el-descriptions-item>
+              <template slot="label">
+                <i class="el-icon-location-outline" />
+                编译名字
+              </template>
+              {{ buildConfigSnapshot.compileName }}
+            </el-descriptions-item>
+            <el-descriptions-item>
+              <template slot="label">
+                <i class="el-icon-tickets" />
+                编译命令
+              </template>
+              {{ buildConfigSnapshot.compileScript }}
+            </el-descriptions-item>
+          </el-descriptions>
+          <h3>打包配置</h3>
+          <el-descriptions direction="vertical" :column="4" border>
+            <el-descriptions-item>
+              <template slot="label">
+                <i class="el-icon-mobile-phone" />
+                打包类型
+              </template>
+              {{ buildConfigSnapshot.packType }}
+            </el-descriptions-item>
+            <el-descriptions-item>
+              <template slot="label">
+                <i class="el-icon-location-outline" />
+                打包名字
+              </template>
+              {{ buildConfigSnapshot.packName }}
+            </el-descriptions-item>
+            <el-descriptions-item>
+              <template slot="label">
+                <i class="el-icon-tickets" />
+                打包路径
+              </template>
+              {{ buildConfigSnapshot.targetPath }}
+            </el-descriptions-item>
+            <el-descriptions-item>
+              <template slot="label">
+                <i class="el-icon-office-building" />
+                Dockerfile
+              </template>
+              {{ buildConfigSnapshot.dockerfile }}
+            </el-descriptions-item>
+          </el-descriptions>
+        </div>
       </template>
     </el-dialog>
     <el-dialog
-      title="构建历史列表"
+      title="构建耗时"
       append-to-body
-      :visible.sync="showBuildDialog"
-      width="70%"
+      :visible.sync="showConsumedDialog"
       center
     >
       <template>
+        <el-descriptions v-if="buildConsumed !== null" direction="vertical" :column="5" border>
+          <el-descriptions-item>
+            <template slot="label">
+              <i class="el-icon-mobile-phone" />
+              构建总耗时(second)
+            </template>
+            {{ buildConsumed.total }}
+          </el-descriptions-item>
+          <el-descriptions-item>
+            <template slot="label">
+              <i class="el-icon-location-outline" />
+              更新耗时(ms)
+            </template>
+            {{ buildConsumed.pullConsumed }}
+          </el-descriptions-item>
+          <el-descriptions-item>
+            <template slot="label">
+              <i class="el-icon-tickets" />
+              编译耗时(ms)
+            </template>
+            {{ buildConsumed.compileConsumed }}
+          </el-descriptions-item>
+          <el-descriptions-item>
+            <template slot="label">
+              <i class="el-icon-office-building" />
+              打包耗时(ms)
+            </template>
+            {{ buildConsumed.packConsumed }}
+          </el-descriptions-item>
+          <el-descriptions-item>
+            <template slot="label">
+              <i class="el-icon-office-building" />
+              推送耗时(ms)
+            </template>
+            {{ buildConsumed.pushConsumed }}
+          </el-descriptions-item>
+        </el-descriptions>
       </template>
     </el-dialog>
   </el-container>
 </template>
 
 <script>
-import { getBuildDeployList, getEnvList } from '@/api/devops'
+import {
+  buildApp,
+  cancelBuildTask, deleteBuildLog, deployApp, getBuildConfigSnapshot, getBuildConsumed,
+  getBuildDeployList,
+  getBuildLogList, getBuildPackageUrl, getBuildResult,
+  getBuildTaskList,
+  getDeployList,
+  getEnvList,
+  resetBuildStat, updateApp
+} from '@/api/devops'
 
 export default {
   name: 'BuildDeploy',
@@ -218,9 +549,31 @@ export default {
       dataList: [],
       // **********************************************************************
       showTaskDialog: null,
+      buildTaskList: [],
+      // **********************************************************************
+      showBuildLogDialog: false,
+      queryInfo1: {
+        appId: '',
+        pn: 1
+      },
+      currentPage1: 1,
+      pageSize1: 10,
+      totalSize1: 0,
+      dataList1: [],
       showResultDialog: false,
-      showBuildDialog: false,
-      showDeployDialog: false
+      buildResult: null,
+      showSnapshotDialog: false,
+      buildConfigSnapshot: null,
+      showConsumedDialog: false,
+      buildConsumed: null,
+      // **********************************************************************
+      showDeployDialog: false,
+      deployList: [],
+      deployForm: {
+        appId: null,
+        buildLogId: null,
+        machineId: null
+      }
     }
   },
   created() {
@@ -282,21 +635,189 @@ export default {
     },
     handleBuildTask() {
       this.showTaskDialog = true
+      getBuildTaskList().then(resp => {
+        if (resp.code === 0) {
+          this.buildTaskList = resp.data
+        } else {
+          this.$message.error(resp.msg)
+        }
+      }).catch(error => {
+        this.$message.error(error.message)
+      })
+    },
+    cancelTask(index, row) {
+      const formData = new FormData()
+      formData.append('appId', row.appId)
+      cancelBuildTask(formData).then(resp => {
+        this.$message.info(resp.msg)
+      }).catch(error => {
+        this.$message.error(error.message)
+      })
     },
     handleResetStat() {
-      this.$message.info('handleResetStat')
+      resetBuildStat().then(resp => {
+        this.$message.info(resp.msg)
+      }).catch(error => {
+        this.$message.error(error.message)
+      })
     },
-    handleBuild(index, row) {
-      this.showBuildDialog = true
+    handleBuildLog(index, row) {
+      this.queryInfo1.appId = row.appId
+      this.queryInfo1.pn = 1
+      getBuildLogList(this.queryInfo1).then(resp => {
+        if (resp.code === 0) {
+          const respData = resp.data
+          this.dataList1 = respData.list
+          this.totalSize1 = respData.totalSize
+          this.showBuildLogDialog = true
+        } else {
+          this.$message.error(resp.msg)
+        }
+      }).catch(error => {
+        this.$message.error(error.message)
+      })
+    },
+    handleCurrentChange1(pageNumber) {
+      this.queryInfo1.pn = pageNumber
+      getBuildLogList(this.queryInfo1).then(resp => {
+        if (resp.code === 0) {
+          const respData = resp.data
+          this.dataList1 = respData.list
+          this.totalSize1 = respData.totalSize
+        } else {
+          this.$message.error(resp.msg)
+        }
+      }).catch(error => {
+        this.$message.error(error.message)
+      })
+    },
+    handleBuildResult(index, row) {
+      const queryInfo = {}
+      queryInfo.buildLogId = row.buildLogId
+      getBuildResult(queryInfo).then(resp => {
+        if (resp.code === 0) {
+          this.buildResult = resp.data
+          this.showResultDialog = true
+        } else {
+          this.$message.error(resp.msg)
+        }
+      }).catch(error => {
+        this.$message.error(error.message)
+      })
+    },
+    handleBuildConfig(index, row) {
+      const queryInfo = {}
+      queryInfo.buildLogId = row.buildLogId
+      getBuildConfigSnapshot(queryInfo).then(resp => {
+        if (resp.code === 0) {
+          this.buildConfigSnapshot = resp.data
+          this.showSnapshotDialog = true
+        } else {
+          this.$message.error(resp.msg)
+        }
+      }).catch(error => {
+        this.$message.error(error.message)
+      })
+    },
+    handleBuildConsumed(index, row) {
+      const queryInfo = {}
+      queryInfo.buildLogId = row.buildLogId
+      getBuildConsumed(queryInfo).then(resp => {
+        if (resp.code === 0) {
+          this.buildConsumed = resp.data
+          this.showConsumedDialog = true
+        } else {
+          this.$message.error(resp.msg)
+        }
+      }).catch(error => {
+        this.$message.error(error.message)
+      })
+    },
+    handleBuildPackage(index, row) {
+      const queryInfo = {}
+      queryInfo.buildLogId = row.buildLogId
+      getBuildPackageUrl(queryInfo).then(resp => {
+        if (resp.code === 0) {
+          this.$message.info(resp.data)
+        } else {
+          this.$message.error(resp.msg)
+        }
+      }).catch(error => {
+        this.$message.error(error.message)
+      })
     },
-    handleDeploy(index, row) {
-      this.showDeployDialog = true
+    handleDeployBuild(index, row) {
+      const formData = new FormData()
+      formData.append('buildLogId', row.buildLogId)
+      formData.append('machineId', '')
+      deployApp(formData).then(resp => {
+        this.$message.info(resp.msg)
+      }).catch(error => {
+        this.$message.error(error.message)
+      })
+    },
+    handleDeleteBuildLog(index, row) {
+      const formData = new FormData()
+      formData.append('buildLogId', row.buildLogId)
+      deleteBuildLog(formData).then(resp => {
+        this.$message.info(resp.msg)
+      }).catch(error => {
+        this.$message.error(error.message)
+      })
     },
     handleUpdateApp(index, row) {
-      this.$message.info('handleUpdateApp')
+      const formData = new FormData()
+      formData.append('appId', row.appId)
+      updateApp(formData).then(resp => {
+        this.getData()
+        this.$message.info(resp.msg)
+      }).catch(error => {
+        this.$message.error(error.message)
+      })
     },
-    handleBuildApp() {
-      this.$message.info('handleBuildApp')
+    handleBuildApp(index, row) {
+      const formData = new FormData()
+      formData.append('appId', row.appId)
+      buildApp(formData).then(resp => {
+        this.getData()
+        this.$message.info(resp.msg)
+      }).catch(error => {
+        this.$message.error(error.message)
+      })
+    },
+    handleDeployList(index, row) {
+      const queryInfo = {}
+      queryInfo.appId = row.appId
+      this.deployForm.appId = row.appId
+      this.deployForm.buildLogId = row.buildLogId
+      getDeployList(queryInfo).then(resp => {
+        if (resp.code === 0) {
+          this.deployList = resp.data
+          this.showDeployDialog = true
+        } else {
+          this.$message.error(resp.msg)
+        }
+      }).catch(error => {
+        this.$message.error(error.message)
+      })
+    },
+    handleDeployApp(index, row) {
+      const formData = new FormData()
+      formData.append('buildLogId', this.deployForm.buildLogId)
+      formData.append('machineId', row.machineId)
+      deployApp(formData).then(resp => {
+        this.$message.info(resp.msg)
+
+        const queryInfo = {}
+        queryInfo.appId = this.deployForm.appId
+        getDeployList(queryInfo).then(resp => {
+          if (resp.code === 0) {
+            this.deployList = resp.data
+          }
+        })
+      }).catch(error => {
+        this.$message.error(error.message)
+      })
     },
     onSelectChange() {
       this.currentPage = 1
@@ -306,16 +827,6 @@ export default {
         query: this.queryInfo
       })
       this.getData()
-    },
-    handleResult() {
-      this.showResultDialog = true
-    },
-    handleNode() {
-      this.$message.info('handleNode')
-      /* this.$router.push({
-        path: '/devops/app/stat',
-        query: this.queryInfo
-      })*/
     }
   }
 }