This commit is contained in:
yanran200730
2023-04-07 11:44:15 +08:00
3 changed files with 189 additions and 261 deletions

View File

@@ -1,21 +1,6 @@
<template> <template>
<section class="matters-config"> <section class="matters-config">
<ai-list v-if="!showDetail"> <component :is="currentPage" v-bind="$props"/>
<template #title>
<ai-title title="事项配置" :isShowBottomBorder="false"></ai-title>
</template>
<template slot="tabs">
<el-tabs class="tabs-page" v-model="currIndex">
<el-tab-pane v-for="(tab,i) in tabs" :key="i" :label="tab.label" :name="String(i)">
<component :is="tab.comp" v-if="currIndex==i" :ref="currIndex" :instance="instance" :dict="dict"
:permissions="permissions" @goPage="goPage" :tab="currentTab"/>
</el-tab-pane>
</el-tabs>
</template>
</ai-list>
<component v-else :is="currentComp" :instance="instance" :dict="dict"
:processType="currentTab.value" :row="row"></component>
</section> </section>
</template> </template>
@@ -27,43 +12,20 @@ import guidance from "./components/guidance";
export default { export default {
name: "AppMattersConfig", name: "AppMattersConfig",
label: '事项配置', label: '事项配置',
components: {addConfig,guidance}, components: {addConfig, guidance},
props: { props: {
instance: Function, instance: Function,
dict: Object, dict: Object,
permissions: Function permissions: Function
}, },
data() {
return {
currIndex: "0",
row: {},
currentComp: "",
}
},
computed: { computed: {
tabs() { currentPage() {
return [ const {hash} = this.$route
{label: "网上办事", name: "configList", value: "0", comp: configList, detail: addConfig, permission: ""}, return hash == "#add" ? addConfig : hash == "#guidance" ? guidance : configList
{label: "办事指南", name: "configList", value: "2", comp: configList, detail: guidance, permission: ""},
]
}, },
currentTab() {
return this.tabs?.[this.currIndex] || {}
},
showDetail() {
return !!this.$route.query?.id || !!this.$route.query?.processType
}
},
methods: {
goPage(params) {
this.row = params.row
this.currentComp = params.comp
this.$router.push({query: {processType: this.currentTab.value}})
}
}, },
created() { created() {
this.$router.push({query: {}}); this.dict.load("hbDepartment", 'sex', 'nation', 'marital', 'native_place', 'education', 'candidateApproverType', 'scopeCandidates', 'nodeType')
this.$dict.load("hbDepartment", 'sex', 'nation', 'marital', 'native_place', 'education', 'candidateApproverType', 'scopeCandidates', 'nodeType')
} }
} }
</script> </script>

View File

@@ -27,6 +27,7 @@
</template> </template>
<script> <script>
import {mapActions} from "vuex";
import {applyForm, attachmentMaterial, baseInfo, processApproval} from './index' import {applyForm, attachmentMaterial, baseInfo, processApproval} from './index'
export default { export default {
@@ -39,8 +40,6 @@ export default {
props: { props: {
instance: Function, instance: Function,
dict: Object, dict: Object,
row: Object,
processType: String
}, },
components: {baseInfo, applyForm, attachmentMaterial, processApproval}, components: {baseInfo, applyForm, attachmentMaterial, processApproval},
data() { data() {
@@ -69,11 +68,11 @@ export default {
{title: '审批流程', activeIndex: 3} {title: '审批流程', activeIndex: 3}
] ]
}, },
detailTitle() { detailTitle: v => v.detailObj?.id ? "编辑事项" : "添加事项",
return this.detailObj?.id ? "编辑事项" : "添加事项" processType: v => v.$route.hash == "#add" ? 0 : 2
}
}, },
methods: { methods: {
...mapActions(['closePage']),
/** /**
* 上一步 * 上一步
* */ * */
@@ -110,7 +109,6 @@ export default {
handleBaseInfo() { handleBaseInfo() {
this.$refs['baseInfo'].banseInfoForm().then(res => { this.$refs['baseInfo'].banseInfoForm().then(res => {
if (res) { if (res) {
// this.$refs['applyForm'].getFormList()
this.baseInfo = res this.baseInfo = res
this.activeStep++ this.activeStep++
} }
@@ -121,6 +119,7 @@ export default {
*/ */
save() { save() {
this.$refs['processApproval'].handleProcessApproval().then(res => { this.$refs['processApproval'].handleProcessApproval().then(res => {
const {processType} = this
this.instance.post(`/app/approval-process-def/add-update`, { this.instance.post(`/app/approval-process-def/add-update`, {
...this.detailObj, ...this.detailObj,
...this.baseInfo, ...this.baseInfo,
@@ -132,18 +131,19 @@ export default {
tableType: 0, tableType: 0,
processAnnexDefs: this.annexs.map(e => ({...e, mustFill: Number(e.mustFill)})), processAnnexDefs: this.annexs.map(e => ({...e, mustFill: Number(e.mustFill)})),
processNodeList: res.processNodeList, processNodeList: res.processNodeList,
processType: this.processType processType
}).then(res => { }).then(res => {
if (res.code == 0) { if (res.code == 0) {
this.$message.success("保存成功") this.$message.success("保存成功")
this.$router.push({query:{}}) this.handleBack()
} }
}) })
}).catch(err => { }).catch(err => {
console.error(err); console.error(err);
}) })
}, },
getDetail(id) { getDetail() {
const {id} = this.$route.query
this.instance.post(`/app/approval-process-def/info-id`, null, {params: {id}}).then(res => { this.instance.post(`/app/approval-process-def/info-id`, null, {params: {id}}).then(res => {
if (res?.data) { if (res?.data) {
this.detailObj = res.data this.detailObj = res.data
@@ -163,12 +163,11 @@ export default {
}, },
handleBack() { handleBack() {
this.$router.push({query: {}}) this.$router.push({query: {}})
this.closePage()
} }
}, },
created() { created() {
if (this.row?.id) { this.getDetail()
this.getDetail(this.row?.id)
}
} }
} }
</script> </script>
@@ -178,11 +177,11 @@ export default {
height: 100%; height: 100%;
&.formLayout { &.formLayout {
:deep( .ai-detail__content--wrapper ){ :deep( .ai-detail__content--wrapper ) {
max-width: 100%; max-width: 100%;
height: calc(100%)!important; height: calc(100%) !important;
padding: 0!important; padding: 0 !important;
overflow: hidden!important; overflow: hidden !important;
} }
} }
@@ -198,10 +197,10 @@ export default {
padding: 0 calc(50% - 380px); padding: 0 calc(50% - 380px);
:deep( .el-step ){ :deep( .el-step ) {
font-weight: bold; font-weight: bold;
:deep( .el-step__icon ){ :deep( .el-step__icon ) {
width: 24px; width: 24px;
height: 24px; height: 24px;
background: #fff; background: #fff;
@@ -211,7 +210,7 @@ export default {
} }
} }
:deep( .el-step__main ){ :deep( .el-step__main ) {
display: flex; display: flex;
align-items: center; align-items: center;

View File

@@ -1,214 +1,181 @@
<template> <template>
<div class="config-list"> <div class="config-list">
<ai-list isTabs> <ai-list>
<template #content> <ai-title slot="title" title="事项配置"/>
<ai-search-bar> <template #tabs>
<template #left> <el-tabs v-model="curTab">
<el-select v-model="search.department" placeholder="请选择所属部门" @change="page.current=1,getList()" <el-tab-pane v-for="tab in tabs" :key="tab.name" v-bind="tab" lazy>
size="small" clearable> <ai-card class="mar-t16" panel v-if="curTab==tab.name">
<el-option <ai-search-bar>
v-for="(item,i) in dict.getDict('hbDepartment')" :key="i" <template #left>
:label="item.dictName" <ai-select v-model="search.department" placeholder="请选择所属部门" @change="page.current=1,getList()" dict="hbDepartment"/>
:value="item.dictValue"> <ai-select v-model="search.department" placeholder="请选择所属分类" @change="page.current=1,getList()" :selectList="classList"
</el-option> :prop="{label:'name'}"/>
</el-select> </template>
<el-select v-model="search.classificationId" placeholder="请选择所属分类" @change="page.current=1,getList()" <template #right>
size="small" clearable> <el-input
<el-option v-model="search.processName"
v-for="(item,i) in classList" :key="i" size="small"
:label="item.name" placeholder="事项名称/创建人"
:value="item.id"> @clear="search={},page.current=1,getList()"
</el-option> v-throttle="() => {page.current = 1, getList()}"
</el-select> clearable
</template> suffix-icon="iconfont iconSearch"/>
<template #right> </template>
<el-input </ai-search-bar>
v-model="search.processName" <ai-search-bar>
size="small" <template #left>
placeholder="事项名称/创建人" <el-button type="primary" icon="iconfont iconAdd" @click="goPage()">添加{{ curTab == 'add' ? '事项' : '办事指南' }}</el-button>
@clear="search={},page.current=1,getList()" </template>
v-throttle="() => {page.current = 1, getList()}" </ai-search-bar>
clearable <ai-table
suffix-icon="iconfont iconSearch"/> :tableData="tableData"
</template> :col-configs="colConfigs"
</ai-search-bar> :header-cell-style="{fontWeight:'bold',color:'#333'}"
<ai-search-bar> :total="page.total"
<template #left> :current.sync="page.current"
<el-button type="primary" icon="iconfont iconAdd" @click="goPage(tab.value==0 ? 'addConfig':'guidance')">添加{{tab.value==0?'事项':'办事指南'}}</el-button> :size.sync="page.size"
</template> :dict="dict"
</ai-search-bar> @getList="getList">
<ai-table <el-table-column label="是否启用" slot="processDefStatus" align="center" width="150">
:tableData="tableData" <template v-slot="{row}">
:col-configs="colConfigs" <el-switch
:header-cell-style="{fontWeight:'bold',color:'#333'}" v-model="row.processDefStatus"
:total="page.total" @change="onChange(row)" active-value="1" inactive-value="0"
:current.sync="page.current" active-color="#5088FF"
:size.sync="page.size" inactive-color="#D0D4DC">
@getList="getList"> </el-switch>
<el-table-column label="是否启用" slot="processDefStatus" align="center" width="150"> </template>
<template v-slot="{row}"> </el-table-column>
<el-switch <el-table-column label="操作" slot="options" align="center" width="150">
v-model="row.processDefStatus" <template v-slot="{row}">
@change="onChange(row)" active-value="1" inactive-value="0" <div class="table-options">
active-color="#5088FF" <el-button type="text" title="编辑" @click="goPage(row.id)">编辑</el-button>
inactive-color="#D0D4DC"> <el-button type="text" title="删除" @click="delInfo(row)">删除</el-button>
</el-switch> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" slot="options" align="center" width="150"> </ai-table>
<template v-slot="{row}"> </ai-card>
<div class="table-options"> </el-tab-pane>
<el-button type="text" title="编辑" @click="goPage(tab.value==0 ? 'addConfig':'guidance',row)">编辑</el-button> </el-tabs>
<el-button type="text" title="删除" @click="delInfo(row)">删除</el-button>
</div>
</template>
</el-table-column>
</ai-table>
</template> </template>
</ai-list> </ai-list>
</div> </div>
</template> </template>
<script> <script>
import day from 'dayjs' import {confirm} from "dui/lib/js/decorator";
export default { export default {
name: "configList", name: "configList",
props: { props: {
instance: Function, instance: Function,
dict: Object, dict: Object,
permissions: Function, permissions: Function,
tab: Object, tab: Object,
},
data() {
return {
search: {
department: "",
classificationId: "",
processName: "",
},
page: {current: 1, size: 10},
total: 0,
row: {},
tableData: [],
classList: [],
curTab: "add",
tabs: [
{label: "网上办事", value: "0", name: "add"},
{label: "办事指南", value: "2", name: "guidance"},
]
}
},
computed: {
currentTab: v => v.tabs.find(e => e.name == v.curTab),
colConfigs() {
return [
{prop: 'processName', align: 'left', label: '事项名称'},
{prop: 'department', align: 'left', label: '所属部门', dict: "hbDepartment"},
{prop: 'classificationName', align: 'center', label: '所属分类',},
{prop: 'timeLimit', align: 'center', label: '办结时限(日)',},
{prop: 'createUserName', align: 'center', label: '创建人',},
{prop: 'createTime', align: 'center', label: '最后修改时间', format: 'YYYY-MM-DD HH:mm'},
{slot: 'processDefStatus', align: 'center', label: '是否启用',},
{slot: 'options', align: 'center', label: '操作',},
].filter(e => this.curTab == 'add' ? true : (e.prop != "timeLimit"))
}, },
data() { },
return { methods: {
search: { goPage(id) {
department: "", this.$router.push({query: {id}, hash: `#${this.curTab}`})
classificationId: "", },
processName: "", /**
* 获取分类
*/
getClassification() {
this.instance.post(`/app/zwspapprovalclassification/list`, null, {
params: {
current: 1,
status: 1,
size: 9999
}
}).then(res => {
if (res && res.data) {
this.classList = res.data.records
}
})
},
@confirm("是否删除?")
delInfo({id}) {
this.instance.post(`/app/approval-process-def/delete?id=${id}`).then(res => {
if (res.code == 0) {
this.$message.success("删除成功")
this.getList()
}
})
},
/**
* 启用,停用
*/
onChange({id, processDefStatus}) {
this.instance.post(`/app/approval-process-def/enable-disable`, null, {
params: {id}
}).then(res => {
if (res.code == 0) {
this.$message.success(processDefStatus == 0 ? "不启用" : "已启用")
this.getList()
}
})
},
getList() {
this.instance.post(`/app/approval-process-def/list`, null, {
params: {
...this.page,
...this.search,
processType: this.currentTab.value
}, },
page: {current: 1, size: 10}, }).then(res => {
total: 0, if (res?.data) {
row: {}, this.tableData = res.data.records
tableData: [], this.page.total = res.data.total;
classList: [], }
} })
}, },
computed: { },
colConfigs() { mounted() {
return [ this.getList()
{ this.getClassification()
prop: 'processName', },
align: 'left', }
label: '事项名称',
},
{
prop: 'department',
align: 'left',
label: '所属部门',
render: (h, {row}) => [ < span > {this.dict.getLabel('hbDepartment', row.department)} < /span>]
},
{
prop: 'classificationName',
align: 'center',
label: '所属分类',
},
{
prop: 'timeLimit',
align: 'center',
label: '办结时限(日)',
},
{
prop: 'createUserName',
align: 'center',
label: '创建人',
},
{
prop: 'createTime',
align: 'center',
label: '最后修改时间',
render: (h, {row}) => [ < span > {day(row.createTime
).
format("YYYY-MM-DD HH:mm")
}<
/span>]
},
{slot: 'processDefStatus', align:'center', label:'是否启用',},
{ slot: 'options',align:'center',label:'操作',},
].filter(e=>this.tab.value==0 ? true : (e.prop!="timeLimit"))
},
},
methods: {
goPage(comp, row = {}) {
this.$emit("goPage", {comp, row})
},
/**
* 获取分类
*/
getClassification() {
this.instance.post(`/app/zwspapprovalclassification/list`, null, {
params:{
current: 1,
status: 1,
size: 9999
}
}).then(res => {
if (res && res.data) {
this.classList = res.data.records
}
})
},
/**
* 删除
* */
delInfo({id}) {
this.$confirm("是否删除").then(() => {
this.instance.post(`/app/approval-process-def/delete?id=${id}`).then(res => {
if (res.code == 0) {
this.$message.success("删除成功")
this.getList()
}
})
})
},
/**
* 启用,停用
*/
onChange({id, processDefStatus}) {
this.instance.post(`/app/approval-process-def/enable-disable`, null, {
params: {id}
}).then(res => {
if (res.code == 0) {
this.$message.success(processDefStatus == 0 ? "不启用" : "已启用")
this.getList()
}
})
},
getList() {
this.instance.post(`/app/approval-process-def/list`, null, {
params: {
...this.page,
...this.search,
processType: this.tab.value
},
}).then(res => {
if (res?.data) {
this.tableData = res.data.records
this.page.total = res.data.total;
}
})
},
},
mounted() {
this.getList()
this.getClassification()
},
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.config-list { .config-list {
height: 100%; height: 100%;
} }
</style> </style>