初始化
This commit is contained in:
aixianling
219
packages/processManagement/mattersConfig/components/guidance.vue
Normal file
219
packages/processManagement/mattersConfig/components/guidance.vue
Normal file
@@ -0,0 +1,219 @@
|
||||
<template>
|
||||
<div class="guidance">
|
||||
<ai-detail>
|
||||
<ai-title slot="title" :title="detailTitle" isShowBack isShowBottomBorder @onBackClick="handleBack"/>
|
||||
<template #content>
|
||||
<ai-card title="基本信息">
|
||||
<template #content>
|
||||
<el-form :model="form" :rules="rules" ref="baseInfoForm" label-suffix="：" label-width="100px">
|
||||
<el-form-item label="事项名称" prop="processName">
|
||||
<el-input v-model.trim="form.processName" size="small" clearable placeholder="请输入事项名称" :maxlength="30"
|
||||
show-word-limit/>
|
||||
</el-form-item>
|
||||
<el-row type="type" justify="space-between" :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="所属部门" prop="department">
|
||||
<el-select placeholder="请选择" size="small" v-model="form.department" clearable style="width: 100%;">
|
||||
<el-option
|
||||
v-for="(item,i) in dict.getDict('hbDepartment')" :key="i"
|
||||
:label="item.dictName"
|
||||
:value="item.dictValue">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="所属分类" prop="classificationId">
|
||||
<el-select placeholder="请选择" size="small" v-model="form.classificationId" clearable
|
||||
style="width: 100%;">
|
||||
<el-option
|
||||
v-for="(item,i) in classList" :key="i"
|
||||
:label="item.name"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item label="办理须知" prop="needToKnow">
|
||||
<ai-editor v-model.trim="form.needToKnow" :instance="instance"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="是否启用" prop="processDefStatus">
|
||||
<el-switch
|
||||
v-model="form.processDefStatus"
|
||||
active-color="#5088FF"
|
||||
inactive-color="#D0D4DC" active-value="1" inactive-value="0">
|
||||
</el-switch>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</template>
|
||||
</ai-card>
|
||||
</template>
|
||||
<template #footer>
|
||||
<el-button class="btn" @click="handleBack">取消</el-button>
|
||||
<el-button class="btn" type="primary" @click="save">保存</el-button>
|
||||
</template>
|
||||
</ai-detail>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
name: "addConfig",
|
||||
props: {
|
||||
instance: Function,
|
||||
dict: Object,
|
||||
row: Object,
|
||||
processType: String
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
form: {
|
||||
processName: "",
|
||||
department: "",
|
||||
classificationId: "",
|
||||
needToKnow: "",
|
||||
processDefStatus: "1",
|
||||
},
|
||||
classList: [],
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
rules() {
|
||||
return {
|
||||
processName: [{required: true, message: '请输入事项名称', trigger: 'blur'}],
|
||||
department: [{required: true, message: '请选择所属部门', trigger: 'change'}],
|
||||
classificationId: [{required: true, message: '请选择所属分类', trigger: 'change'}],
|
||||
needToKnow: [{required: true, message: '请输入办理须知', trigger: 'blur'}],
|
||||
processDefStatus: [{required: true, message: '请选择是否启用', trigger: 'change'}],
|
||||
}
|
||||
},
|
||||
detailTitle() {
|
||||
return this.row?.id ? "编辑办事指南" : "添加办事指南"
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 获取分类
|
||||
*/
|
||||
getClassification() {
|
||||
this.instance.post(`/app/zwspapprovalclassification/list`, null, {
|
||||
params: {
|
||||
current: 1,
|
||||
status: 1,
|
||||
size: 9999
|
||||
}
|
||||
}).then(res => {
|
||||
if (res?.data) {
|
||||
this.classList = res.data.records
|
||||
}
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 保存
|
||||
*/
|
||||
save() {
|
||||
this.$refs["baseInfoForm"].validate(valid => {
|
||||
if (valid) {
|
||||
this.instance.post(`/app/approval-process-def/add-update`, {
|
||||
...this.form,
|
||||
id: this.row.id,
|
||||
processType: this.processType
|
||||
}).then(res => {
|
||||
if (res.code == 0) {
|
||||
this.$message.success("保存成功")
|
||||
this.$router.push({query: {}})
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
getDetail(id) {
|
||||
this.instance.post(`/app/approval-process-def/info-id`, null, {params: {id}}).then(res => {
|
||||
if (res?.data) {
|
||||
Object.keys(this.form).map(e => this.form[e] = res.data[e])
|
||||
}
|
||||
})
|
||||
},
|
||||
handleBack() {
|
||||
this.$router.push({query: {}})
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getClassification()
|
||||
if (this.row?.id) {
|
||||
this.getDetail(this.row?.id)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.add-config {
|
||||
height: 100%;
|
||||
|
||||
.step {
|
||||
width: 100%;
|
||||
height: 72px;
|
||||
font-size: 14px;
|
||||
|
||||
.el-steps {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 72px;
|
||||
padding: 0 calc(50% - 380px);
|
||||
|
||||
|
||||
::v-deep .el-step {
|
||||
font-weight: bold;
|
||||
|
||||
::v-deep .el-step__icon {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
background: #fff;
|
||||
|
||||
.iconfont {
|
||||
font-size: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .el-step__main {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.el-step__arrow {
|
||||
background: #D0D4DC;
|
||||
margin: 0 8px;
|
||||
height: 2px;
|
||||
|
||||
&:before, &:after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.is-process {
|
||||
color: #2266FF;
|
||||
}
|
||||
|
||||
.is-wait {
|
||||
color: #666;
|
||||
border-color: #D0D4DC;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.btn {
|
||||
width: 92px;
|
||||
height: 32px;
|
||||
|
||||
&:nth-child(2) {
|
||||
margin-left: 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user