You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
150 lines
3.4 KiB
150 lines
3.4 KiB
<!--
|
|
@ 作者: 秦东
|
|
@ 时间: 2023-07-04 14:51:04
|
|
@ 备注: 编辑矩阵
|
|
-->
|
|
<script lang='ts' setup>
|
|
import { editMatrixInfo } from '@/api/matrixapi/type'
|
|
import { editMatrixCont } from '@/api/matrixapi/index'
|
|
|
|
const props = defineProps({
|
|
editShow:{
|
|
type:Boolean,
|
|
default:false
|
|
},
|
|
matrixcont:{
|
|
type:Object,
|
|
default(){
|
|
return {}
|
|
}
|
|
},
|
|
orgtree:{
|
|
type:Object,
|
|
default(){
|
|
return {}
|
|
}
|
|
}
|
|
});
|
|
const emits = defineEmits(["update:editShow","restlist"]); //父级元素
|
|
const editMatrixRef = ref(ElForm); //添加矩阵
|
|
const editCont = reactive<editMatrixInfo>({
|
|
id:0,
|
|
name:"",
|
|
center:"",
|
|
org:""
|
|
})
|
|
const orgTreeProps ={
|
|
children: 'child',
|
|
label: 'name',
|
|
} //行政组织树对照值
|
|
/**
|
|
* 弹窗显示控制
|
|
*/
|
|
const edit_is_Show = computed({
|
|
get: () => props.editShow,
|
|
set: (val) => {
|
|
emits("update:editShow", val);
|
|
},
|
|
});
|
|
const editLoading = ref(false)
|
|
/**
|
|
* 表单验证规则
|
|
*/
|
|
const editFormRules = reactive({
|
|
org: [{ required: true, message: "请选择归属行政组织", trigger: "blur" }],
|
|
name: [{ required: true, message: "请输入矩阵名称", trigger: "blur" }]
|
|
});
|
|
/**
|
|
* 初始化数据
|
|
*/
|
|
function initData(){
|
|
editCont.name = "";
|
|
editCont.center = "";
|
|
editCont.org = "";
|
|
editLoading.value = false;
|
|
}
|
|
/**
|
|
* 关闭弹窗
|
|
*/
|
|
function handleCloseAdd(){
|
|
emits("update:editShow", false);
|
|
initData()
|
|
}
|
|
/**
|
|
* 提交数据
|
|
*/
|
|
function submitEditMatrix(){
|
|
editLoading.value = true;
|
|
editMatrixRef.value.validate((isValid: boolean) => {
|
|
if (isValid) {
|
|
editMatrixCont(editCont)
|
|
.then(() => {
|
|
ElMessage.success("编辑成功");
|
|
handleCloseAdd();
|
|
emits('restlist');
|
|
})
|
|
.finally(() => (editLoading.value = false));
|
|
}else{
|
|
editLoading.value = false;
|
|
}
|
|
});
|
|
}
|
|
/**
|
|
* 监听数据
|
|
*/
|
|
watch(() => props.editShow,() => {
|
|
if(!props.editShow){
|
|
initData();
|
|
}else{
|
|
editCont.id = props.matrixcont.id;
|
|
editCont.name = props.matrixcont.name;
|
|
editCont.center = props.matrixcont.center;
|
|
editCont.org = props.matrixcont.org;
|
|
}
|
|
});
|
|
|
|
</script>
|
|
<template>
|
|
<el-dialog v-model="edit_is_Show" custom-class="dialog_box" title="编辑矩阵" :before-close="handleCloseAdd" width="400">
|
|
<el-form
|
|
ref="editMatrixRef"
|
|
:model="editCont"
|
|
:rules="editFormRules"
|
|
label-width="140px"
|
|
>
|
|
<el-form-item label="矩阵名称" prop="name">
|
|
<el-input v-model="editCont.name" placeholder="请输入矩阵名称" />
|
|
</el-form-item>
|
|
<el-form-item label="简介" prop="center">
|
|
<el-input
|
|
v-model="editCont.center"
|
|
:autosize="{ minRows: 2, maxRows: 4 }"
|
|
type="textarea"
|
|
placeholder="请输入矩阵简介"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="归属行政组织" prop="org">
|
|
<el-tree-select
|
|
ref="orgTreePostRef"
|
|
v-model="editCont.org"
|
|
placeholder="选择归属行政组织"
|
|
:data="props.orgtree"
|
|
node-key="id"
|
|
check-strictly
|
|
:props="orgTreeProps"
|
|
:render-after-expand="false"
|
|
class="orgTree"
|
|
/>
|
|
</el-form-item>
|
|
</el-form>
|
|
<template #footer>
|
|
<div class="dialog-footer">
|
|
<el-button type="primary" :loading="editLoading" @click="submitEditMatrix" >确 定</el-button>
|
|
<el-button @click="handleCloseAdd">取 消</el-button>
|
|
</div>
|
|
</template>
|
|
</el-dialog>
|
|
</template>
|
|
<style lang='scss' scoped>
|
|
|
|
</style>
|
|
|