定制项目提交一波
This commit is contained in:
aixianling
114
project/oms/apps/develop/AppDeployCustom/AiLibTable.vue
Normal file
114
project/oms/apps/develop/AppDeployCustom/AiLibTable.vue
Normal file
@@ -0,0 +1,114 @@
|
||||
<template>
|
||||
<section class="AiLibTable">
|
||||
<ai-search-bar>
|
||||
<template v-if="$scopedSlots.left" #left>
|
||||
<slot name="left"/>
|
||||
</template>
|
||||
<template #right>
|
||||
<slot v-if="$scopedSlots.right" name="right"/>
|
||||
<el-input v-else placeholder="搜索应用名称" size="small" v-model="search[searchKey]" @change="page.current=1,getTableData()" clearable/>
|
||||
</template>
|
||||
</ai-search-bar>
|
||||
<ai-table :tableData="tableData" :total="page.total" :current.sync="page.current" :colConfigs="columns"
|
||||
:size.sync="page.size" border @getList="getTableData" tableSize="mini" height="430px">
|
||||
<el-table-column slot="chb" width="100px">
|
||||
<template slot-scope="{row}">
|
||||
<el-checkbox v-model="row.checked" @change="handleCheck(row)"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</ai-table>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "AiLibTable",
|
||||
model: {
|
||||
prop: "value",
|
||||
event: "change"
|
||||
},
|
||||
props: {
|
||||
value: {default: null},
|
||||
instance: Function,
|
||||
dict: Object,
|
||||
permissions: Function,
|
||||
action: {default: "/node/wechatapps/list"},
|
||||
colConfigs: {
|
||||
default: () => [
|
||||
{prop: 'label', label: "应用名称"},
|
||||
{prop: 'project', label: "项目/框架"},
|
||||
{prop: 'name', label: "模块名"},
|
||||
]
|
||||
},
|
||||
nodeKey: {default: "id"},
|
||||
searchKey: {default: "name"},
|
||||
multiple: Boolean
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
page: {total: 0, current: 1, size: 10},
|
||||
search: {},
|
||||
tableData: [],
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
columns() {
|
||||
return [
|
||||
{slot: "chb"}, ...this.colConfigs
|
||||
]
|
||||
},
|
||||
selected() {
|
||||
return [this.value].flat().filter(e => !!e) || []
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
action(v) {
|
||||
v && (this.page.current = 1, this.getTableData())
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
getTableData() {
|
||||
let {page, search, action, nodeKey} = this
|
||||
this.instance?.post(action, null, {
|
||||
params: {...page, ...search}
|
||||
}).then(res => {
|
||||
if (res?.data) {
|
||||
const list = res.data.records || res.data || []
|
||||
list.map(e => {
|
||||
if (/\/project\//.test(e.libPath)) {
|
||||
e.project = e.libPath.replace(/.*project\/([^\/]+)\/.+/, '$1')
|
||||
} else if (/\/core\//.test(e.libPath)) {
|
||||
e.project = "core"
|
||||
} else e.project = "standard"
|
||||
})
|
||||
this.tableData = list.map(e => ({...e, checked: this.selected.includes(e[nodeKey])}))
|
||||
this.page.total = res.data.total
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCheck(row) {
|
||||
const {nodeKey} = this
|
||||
if (this.multiple) {
|
||||
let selected = this.$copy(this.selected)
|
||||
if (row.checked) {
|
||||
selected.push(row[nodeKey])
|
||||
} else {
|
||||
selected = selected.filter(e => e != row[nodeKey])
|
||||
}
|
||||
this.$emit("change", selected)
|
||||
} else {
|
||||
this.$emit("change", row.checked ? row[nodeKey] : '')
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.$set(this.search, this.searchKey, "")
|
||||
this.getTableData()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.AiLibTable {
|
||||
}
|
||||
</style>
|
||||
36
project/oms/apps/develop/AppDeployCustom/AppDeployCustom.vue
Normal file
36
project/oms/apps/develop/AppDeployCustom/AppDeployCustom.vue
Normal file
@@ -0,0 +1,36 @@
|
||||
<template>
|
||||
<section class="AppDeployCustom">
|
||||
<component :is="currentPage" v-bind="$props"/>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import List from "./list";
|
||||
import Add from "./add";
|
||||
|
||||
export default {
|
||||
name: "AppDeployCustom",
|
||||
components: {Add, List},
|
||||
label: "定制项目",
|
||||
props: {
|
||||
instance: Function,
|
||||
dict: Object,
|
||||
permissions: Function
|
||||
},
|
||||
computed: {
|
||||
currentPage() {
|
||||
let {hash} = this.$route
|
||||
return hash == "#add" ? Add : List
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.dict.load('yesOrNo','systemType')
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.AppDeployCustom {
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
109
project/oms/apps/develop/AppDeployCustom/add.vue
Normal file
109
project/oms/apps/develop/AppDeployCustom/add.vue
Normal file
@@ -0,0 +1,109 @@
|
||||
<template>
|
||||
<section class="add">
|
||||
<ai-detail>
|
||||
<ai-title slot="title" :title="pageTitle" isShowBottomBorder/>
|
||||
<template #content>
|
||||
<el-form ref="AddForm" :model="form" size="small" label-width="120px" :rules="rules">
|
||||
<ai-card title="基本信息">
|
||||
<template #content>
|
||||
<el-form-item label="项目/系统名称" prop="name">
|
||||
<el-input v-model="form.name" placeholder="请输入" clearable/>
|
||||
</el-form-item>
|
||||
<el-row type="flex">
|
||||
<el-form-item label="系统类型" prop="type" class="half">
|
||||
<ai-select v-model="form.type" :selectList="dict.getDict('systemType')"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="定制项目根目录" prop="customPath" class="half">
|
||||
<el-input v-model="form.customPath" placeholder="请输入" clearable/>
|
||||
</el-form-item>
|
||||
</el-row>
|
||||
</template>
|
||||
</ai-card>
|
||||
<ai-card title="主库应用">
|
||||
<template #content>
|
||||
<ai-lib-table v-if="form.type" v-model="form.apps" :action="`/node/wechatapps/list?type=${form.type}`" multiple searchKey="name" v-bind="$props"/>
|
||||
<ai-empty v-else>请先选择系统类型</ai-empty>
|
||||
</template>
|
||||
</ai-card>
|
||||
</el-form>
|
||||
</template>
|
||||
<template #footer>
|
||||
<el-button @click="back">取消</el-button>
|
||||
<el-button type="primary" @click="submit">提交</el-button>
|
||||
</template>
|
||||
</ai-detail>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import AiLibTable from "./AiLibTable";
|
||||
|
||||
export default {
|
||||
name: "add",
|
||||
components: {AiLibTable},
|
||||
props: {
|
||||
instance: Function,
|
||||
dict: Object,
|
||||
permissions: Function
|
||||
},
|
||||
computed: {
|
||||
isEdit: v => !!v.$route.query.id,
|
||||
pageTitle: v => v.isEdit ? "编辑定制项目" : "新增定制项目",
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
form: {apps: []},
|
||||
rules: {
|
||||
name: {required: true, message: "请输入"},
|
||||
type: {required: true, message: "请选择"},
|
||||
customPath: {required: true, message: "请输入"},
|
||||
},
|
||||
mainLibApps: [],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getDetail() {
|
||||
let {id} = this.$route.query
|
||||
id && this.instance.post("/node/custom/detail", null, {
|
||||
params: {id}
|
||||
}).then(res => {
|
||||
if (res?.data) {
|
||||
this.form = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
back() {
|
||||
this.$router.push({})
|
||||
},
|
||||
submit() {
|
||||
this.$refs.AddForm.validate(v => {
|
||||
if (v) {
|
||||
this.instance.post("/node/custom/addOrUpdate", this.form).then(res => {
|
||||
if (res?.code == 0) {
|
||||
this.$message.success("提交成功!")
|
||||
this.back()
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.getDetail()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.add {
|
||||
height: 100%;
|
||||
|
||||
.half {
|
||||
width: 50%;
|
||||
|
||||
& + .half {
|
||||
margin-left: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
90
project/oms/apps/develop/AppDeployCustom/list.vue
Normal file
90
project/oms/apps/develop/AppDeployCustom/list.vue
Normal file
@@ -0,0 +1,90 @@
|
||||
<template>
|
||||
<section class="list">
|
||||
<ai-list>
|
||||
<ai-title slot="title" title="定制项目" isShowBottomBorder/>
|
||||
<template #content>
|
||||
<ai-search-bar>
|
||||
<template #left>
|
||||
<el-button type="primary" icon="iconfont iconAdd" @click="handleAdd()">添加</el-button>
|
||||
</template>
|
||||
<template #right>
|
||||
<el-input size="small" placeholder="搜索" v-model="search.name" clearable @change="page.current=1,getTableData()"/>
|
||||
</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" width="300">
|
||||
<template slot-scope="{row}">
|
||||
<el-button type="text" @click="handleAdd(row.id)">编辑</el-button>
|
||||
<el-button type="text" @click="handleAdd(row.id)">打包更新</el-button>
|
||||
<el-button type="text" @click="handleAdd(row.id)">下载</el-button>
|
||||
<el-button type="text" @click="handleDelete(row.id)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</ai-table>
|
||||
</template>
|
||||
</ai-list>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "list",
|
||||
props: {
|
||||
instance: Function,
|
||||
dict: Object,
|
||||
permissions: Function
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
search: {name: ""},
|
||||
page: {current: 1, size: 10, total: 0},
|
||||
tableData: [],
|
||||
colConfigs: [
|
||||
{prop: "name", label: "项目/系统名称"},
|
||||
{prop: "customPath", label: "产品定制内容根路径"},
|
||||
{prop: "type", label: "系统类型", dict: 'systemType'}
|
||||
],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getTableData() {
|
||||
this.instance.post("/node/custom/list", null, {
|
||||
params: {...this.page, ...this.search}
|
||||
}).then(res => {
|
||||
if (res?.data) {
|
||||
this.tableData = res.data.records
|
||||
this.page.total = res.data.total
|
||||
}
|
||||
})
|
||||
},
|
||||
handleAdd(id) {
|
||||
this.$router.push({hash: "#add", query: {id}})
|
||||
},
|
||||
handleDelete(ids) {
|
||||
this.$confirm("是否要删除?").then(() => {
|
||||
this.instance.post("/node/custom/delete", null, {
|
||||
params: {ids}
|
||||
}).then(res => {
|
||||
if (res?.code == 0) {
|
||||
this.$message.success("删除成功")
|
||||
this.getTableData()
|
||||
}
|
||||
})
|
||||
}).catch(() => 0)
|
||||
},
|
||||
handleDownload(id){
|
||||
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getTableData()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.list {
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user