132 lines
4.2 KiB
Vue
132 lines
4.2 KiB
Vue
<template>
|
||
<section class="base-info">
|
||
<ai-title title="基本信息"/>
|
||
<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="timeLimit">
|
||
<el-input v-model.trim="form.timeLimit" oninput="value=value.replace(/[^\d]/g,'')" size="small" clearable
|
||
placeholder="请输入天数" style="width: 270px;"/>
|
||
</el-form-item>
|
||
<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>
|
||
</section>
|
||
</template>
|
||
|
||
<script>
|
||
|
||
export default {
|
||
name: "baseInfo",
|
||
inject: ['config'],
|
||
props: {
|
||
instance: Function,
|
||
dict: Object,
|
||
},
|
||
data() {
|
||
const validTimeLimit = (rule, value, callback) =>{
|
||
if(!value){
|
||
return callback(new Error('请输入办结时限'));
|
||
}else {
|
||
if(+value<=0){
|
||
return callback(new Error('最小值为1'));
|
||
}
|
||
callback();
|
||
}
|
||
}
|
||
return {
|
||
form: {
|
||
processName: "",
|
||
department: "",
|
||
classificationId: "",
|
||
timeLimit: "",
|
||
needToKnow: "",
|
||
processDefStatus: "1",
|
||
},
|
||
classList: [],
|
||
rules:{
|
||
processName: [{required: true, message: '请输入事项名称', trigger: 'blur'}],
|
||
// department: [{required: true, message: '请选择所属部门', trigger: 'change'}],
|
||
classificationId: [{required: true, message: '请选择所属分类', trigger: 'change'}],
|
||
timeLimit: [{required: true,validator:validTimeLimit ,trigger: 'blur'}],
|
||
needToKnow: [{required: true, message: '请输入办理须知', trigger: 'blur'}],
|
||
processDefStatus: [{required: true, message: '请选择是否启用', trigger: 'change'}],
|
||
}
|
||
}
|
||
},
|
||
methods: {
|
||
banseInfoForm() {
|
||
return new Promise((resolve, reject) => {
|
||
this.$refs['baseInfoForm'].validate(valid => {
|
||
if (valid) {
|
||
resolve(this.form)
|
||
} else {
|
||
reject(false)
|
||
}
|
||
})
|
||
})
|
||
},
|
||
/**
|
||
* 获取分类
|
||
*/
|
||
getClassification() {
|
||
this.instance.post(`/zwspapprovalclassification/list`, null, {
|
||
current: 1,
|
||
size: 9999
|
||
}).then(res => {
|
||
if (res?.data) {
|
||
this.classList = res.data.records
|
||
}
|
||
})
|
||
}
|
||
},
|
||
created() {
|
||
this.getClassification()
|
||
if (this.config.detailObj?.id) {
|
||
Object.keys(this.form).map(e => this.form[e] = this.config.detailObj[e])
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.base-info {
|
||
.iconAudit {
|
||
font-size: 36px;
|
||
color: #3D94FB;
|
||
}
|
||
}
|
||
</style>
|