<template>
|
<win-sm :title="setting.title" @close="close" :width="'800px'">
|
<el-form v-loading="loading" ref="ruleForm" :model="formData" :rules="rules" class="demo-ruleForm" label-width="100px">
|
<el-form-item label="计划类型" prop="planTypeCode">
|
<el-select v-model="formData.planTypeCode" placeholder="" clearable style="width: 100%">
|
<el-option
|
v-for="item in options"
|
:key="item.dict_code"
|
:label="item.dict_label"
|
:value="item.dict_code">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="计划名称" prop="projectName">
|
<el-input v-model="formData.projectName" placeholder="" clearable maxlength="32" show-word-limit style="width: 100%"/>
|
</el-form-item>
|
<el-form-item label="编号" prop="projectCode">
|
<el-input v-model="formData.projectCode" placeholder="" clearable maxlength="32" show-word-limit style="width: 100%"/>
|
</el-form-item>
|
<el-form-item label="状态" prop="status">
|
<el-radio-group v-model="formData.status">
|
<el-radio :label="1" border>启用</el-radio>
|
<el-radio :label="0" border>禁用</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
<el-form-item label="备注" prop="remark">
|
<el-input
|
v-model="formData.remark"
|
type="textarea"
|
:rows="3"
|
maxlength="200"
|
show-word-limit
|
/>
|
</el-form-item>
|
</el-form>
|
<div slot="footer" align="center" class="dialog-footer">
|
<my-button name="取消" site="form" @click="close"/>
|
<my-button name="保存" site="form" @click="save"/>
|
</div>
|
</win-sm>
|
</template>
|
|
<script>
|
import winSm from '@/components/win/win-sm'
|
import myButton from '@/components/myButton/myButton'
|
import * as api from "@/api/projectConfig/buildPlan";
|
import {getDicts} from "@/api/system/dict/data";
|
|
export default {
|
name: 'edit',
|
components: {winSm, myButton},
|
props: {
|
// setting 中须至少包含控制dialog显示或隐藏的属性,其余属性可拓展
|
// 将添加/修改的大量数据及逻辑从列表页面中分离出来,避免列表页面代码过多,审查困难
|
// 若此页面须回传数据至父页面,可在引用组件时添加事件,本页面使用this.$emit('事件名',参数1,参数2...)回传数据
|
setting: {
|
type: Object,
|
default: () => {
|
}
|
}
|
},
|
data() {
|
return {
|
loading: false,
|
options: [],
|
formData: {
|
planTypeCode: '',
|
projectName: '',
|
projectCode: '',
|
status: 1,
|
remark: '',
|
},
|
rules: {
|
planTypeCode: [
|
{required: true, message: '请选择计划类型', trigger: 'blur'},
|
],
|
projectName: [
|
{required: true, message: '请输入计划名称', trigger: 'blur'},
|
],
|
projectCode: [
|
{required: true, message: '请输入编号', trigger: 'blur'},
|
]
|
}
|
}
|
},
|
created() {
|
this.loading = true
|
this.getInfo()
|
this.getPlanType()
|
},
|
methods: {
|
getPlanType() {
|
getDicts('PLAN_TYPE').then(res => {
|
this.options = res
|
})
|
},
|
getInfo() {
|
this.title = this.setting.title
|
if (this.setting.id != null) {
|
// 查询数据
|
api.getDetail({id: this.setting.id}).then(res => {
|
this.loading = false
|
this.formData = Object.assign(this.formData, res)
|
})
|
}else{
|
this.loading = false
|
}
|
},
|
close() {
|
this.formData = {
|
planTypeCode: '',
|
projectName: '',
|
projectCode: '',
|
status: 1,
|
remark: '',
|
}
|
this.$emit('close')
|
},
|
save() {
|
this.$refs.ruleForm.validate((valid) => {
|
if (valid) {
|
const params = Object.assign({}, this.formData)
|
this.loading = true
|
api[params.id?'upd':'add'](params).then(res => {
|
this.loading = false
|
if (res) {
|
this.$message.success('保存成功！')
|
this.close()
|
this.$emit('search')
|
} else {
|
this.$message.error('保存失败')
|
}
|
}).catch(()=>{
|
this.loading = false
|
})
|
} else {
|
this.$message.error('校验未通过，请检查。')
|
}
|
})
|
}
|
}
|
}
|
</script>
|
