新增部署发布模块

This commit is contained in:
aixianling
2022-03-30 19:20:44 +08:00
parent 395bc26bb1
commit 5478611712
3 changed files with 141 additions and 2 deletions

View File

@@ -0,0 +1,129 @@
<template>
<section class="AppDeploy">
<ai-list>
<ai-title slot="title" title="部署发布" isShowBottomBorder/>
<template #content>
<ai-search-bar>
<template #left>
<el-button type="primary" icon="iconfont iconAdd" @click="dialog=true">增加</el-button>
</template>
</ai-search-bar>
<ai-table :tableData="tableData" :total="page.total" :current.sync="page.current" :size.sync="page.size"
@getList="getTableData" :col-configs="colConfigs" :dict="dict">
<el-table-column slot="options" label="操作" fixed="right" align="center">
<template slot-scope="{row}">
<el-button type="text" @click="handleEdit(row)">编辑</el-button>
<el-button type="text" @click="handleDelete(row.id)">删除</el-button>
<el-button type="text" @click="handleDownload(row)">下载部署包</el-button>
<el-button v-if="row.target" type="text" @click="handleDownload(row)">部署</el-button>
</template>
</el-table-column>
</ai-table>
</template>
</ai-list>
<ai-dialog :visible.sync="dialog" title="部署任务设置" width="600px" @close="form={}" @onConfirm="submit">
<el-form ref="DialogForm" :model="form" size="small" label-width="100px" :rules="rules">
<!-- 首页封面 -->
<el-form-item label="项目/系统" prop="name">
<el-input v-model="form.name" clearable placeholder="请输入"/>
</el-form-item>
<el-form-item label="git" prop="git">
<el-input v-model="form.git" clearable placeholder="请输入"/>
</el-form-item>
<el-form-item label="生产环境" prop="target">
<el-input v-model="form.target" clearable placeholder="请输入"/>
</el-form-item>
</el-form>
</ai-dialog>
</section>
</template>
<script>
import {mapState} from "vuex";
export default {
name: "AppDeploy",
label: "部署发布",
props: {
instance: Function,
dict: Object,
permissions: Function
},
computed: {
...mapState(['user'])
},
data() {
return {
search: {name: ""},
page: {current: 1, size: 10, total: 0},
tableData: [],
colConfigs: [
{label: "项目/系统名称", prop: "name"},
{label: "git", prop: "git"},
{label: "生产服务器", prop: "target", width: 100},
{slot: "options"}
],
dialog: false,
form: {},
rules: {
name: {required: true, message: "请输入项目/系统名称"},
git: {required: true, message: "请输入git"},
}
}
},
methods: {
getTableData() {
this.instance.post("/node/autodeploy/list", null, {
params: {...this.page, ...this.search}
}).then(res => {
if (res?.data) {
this.tableData = res.data?.records
this.page.total = res.data.total
}
})
},
handleDownload(row) {
},
handleEdit(row) {
this.form = JSON.parse(JSON.stringify(row))
this.dialog = true
},
submit() {
this.$refs.DialogForm.validate(v => {
if (v) {
this.instance.post("/node/autodeploy/addOrUpdate", this.form).then(res => {
if (res?.code == 0) {
this.$message.success("提交成功")
this.getTableData()
this.dialog = false
}
})
}
})
},
handleDelete(ids) {
this.$confirm("是否要删除该项目/系统?").then(() => {
this.instance.post("/node/autodeploy/delete", null, {
params: {ids}
}).then(res => {
if (res?.code == 0) {
this.$message.success("删除成功")
this.getTableData()
}
})
}).catch(() => 0)
}
},
created() {
this.getTableData()
this.search.areaId = this.user.info.areaId
}
}
</script>
<style lang="scss" scoped>
.AppDeploy {
height: 100%;
}
</style>