移交申请
This commit is contained in:
parent
a65786aa1a
commit
fdfd284434
|
|
@ -159,11 +159,12 @@ export default {
|
|||
selectedNode: {
|
||||
handler(newVal) {
|
||||
this.addBtnIsShow = !(newVal && Number(newVal.level) === 4)
|
||||
// 更新并下发默认请求参数（例如 parentId）
|
||||
// 更新并下发默认请求参数（例如 parentId、proId）
|
||||
const parentId = newVal && newVal.id ? newVal.id : 0
|
||||
this.defaultParams = { parentId }
|
||||
const proId = this.projectId
|
||||
this.defaultParams = { parentId,proId }
|
||||
if (this.$refs.tableRef) {
|
||||
this.$refs.tableRef.queryTableList({ parentId })
|
||||
this.$refs.tableRef.queryTableList({ parentId,proId })
|
||||
}
|
||||
},
|
||||
immediate: true, // 表示立即执行
|
||||
|
|
|
|||
|
|
@ -0,0 +1,211 @@
|
|||
<template>
|
||||
<!-- 小型弹窗，用于完成，删除，保存等操作 -->
|
||||
<el-dialog class="l-dialog" :class="lDialog" :title="title" :visible.sync="dialogVisible" :showClose="true"
|
||||
:closeOnClickModal="false" @close="handleClose" :append-to-body="true">
|
||||
<div>
|
||||
<el-form :model="form" :rules="rules" ref="ruleForm" label-width="110px">
|
||||
<el-form-item label="项目" prop="proId">
|
||||
<el-select class="form-item" v-model="form.proId" filterable clearable placeholder="请选择项目">
|
||||
<el-option v-for="item in proList" :key="item.id" :label="item.name"
|
||||
:value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="选择移交档案">
|
||||
<el-button plain type="primary" size="mini" icon="el-icon-plus" @click="handleAddFile">选择</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item label="接收组织" prop="deptId">
|
||||
<treeselect v-model="form.deptId" :options="treeDataList" placeholder="请选择上级节点" value-key="id"
|
||||
noChildrenText="没有数据了" noOptionsText="没有数据了" noResultsText="没有搜索结果" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button class="clear-btn" @click="handleClose" :disabled="disabled">取消</el-button>
|
||||
<el-button type="primary" class="search-btn" :disabled="disabled"
|
||||
@click="submitForm('ruleForm')">确认</el-button>
|
||||
</span>
|
||||
<FileTree v-if="fileTreeVisible" />
|
||||
</el-dialog>
|
||||
|
||||
</template>
|
||||
<script>
|
||||
import _ from 'lodash'
|
||||
import {
|
||||
saveTransferApplyApi,
|
||||
editTransferApplyApi,
|
||||
getProSelectApi
|
||||
} from '@/api/filesTransfer/apply'
|
||||
import { getDeptSelectApi } from '@/api/select'
|
||||
import Treeselect from "@riophae/vue-treeselect";
|
||||
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
|
||||
export default {
|
||||
name: "FileTree",
|
||||
props: ["width", "dataForm", "title", "disabled", "isAdd", "rowData"],
|
||||
dicts: ['data_class_type'],
|
||||
components: { Treeselect},
|
||||
data() {
|
||||
return {
|
||||
lDialog: this.width > 500 ? "w700" : "w500",
|
||||
dialogVisible: true,
|
||||
isDisabled: true,
|
||||
form: {
|
||||
proId: undefined,
|
||||
deptId: undefined,
|
||||
remark: '',
|
||||
},
|
||||
treeDataList: [],
|
||||
proList: [],
|
||||
loading: null,
|
||||
rules: {
|
||||
proId: [
|
||||
{ required: true, message: '请选择项目', trigger: 'change' }
|
||||
],
|
||||
deptId: [
|
||||
{ required: true, message: '请选择接收组织', trigger: 'change' }
|
||||
],
|
||||
},
|
||||
fileTreeVisible: false,
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.initFormData();
|
||||
},
|
||||
methods: {
|
||||
/** 初始化表单数据 */
|
||||
async initFormData() {
|
||||
await getDeptSelectApi().then(res => {
|
||||
this.treeDataList = res.data;
|
||||
});
|
||||
await getProSelectApi().then(res => {
|
||||
this.proList = res.data;
|
||||
});
|
||||
if (this.isAdd === 'edit' && this.rowData) {
|
||||
// 编辑模式：填充表单数据
|
||||
this.form = {
|
||||
id: this.rowData.id,
|
||||
proId: this.rowData.proId || undefined,
|
||||
deptId: this.rowData.deptId || undefined,
|
||||
};
|
||||
} else {
|
||||
// 新增模式：重置表单
|
||||
this.form = {
|
||||
proId: undefined,
|
||||
deptId: undefined,
|
||||
};
|
||||
}
|
||||
},
|
||||
// 选择移交档案
|
||||
handleAddFile(){
|
||||
this.fileTreeVisible = true;
|
||||
},
|
||||
/*关闭弹窗 */
|
||||
handleClose() {
|
||||
this.dialogVisible = false;
|
||||
this.$emit("closeDialog");
|
||||
setTimeout(() => {
|
||||
this.dialogVisible = true;
|
||||
});
|
||||
},
|
||||
/**确认弹窗 */
|
||||
sureBtnClick() {
|
||||
this.dialogVisible = false;
|
||||
this.$emit("closeDialog");
|
||||
setTimeout(() => {
|
||||
this.dialogVisible = true;
|
||||
});
|
||||
},
|
||||
/**重置表单*/
|
||||
reset() {
|
||||
this.form = {
|
||||
id: null,
|
||||
pid: null,
|
||||
dataTypeName: '',
|
||||
remark: '',
|
||||
};
|
||||
this.resetForm("ruleForm");
|
||||
},
|
||||
handleReuslt(res) {
|
||||
this.$modal.msgSuccess(res.msg);
|
||||
this.reset();
|
||||
this.$emit('handleQuery');
|
||||
this.handleClose();
|
||||
},
|
||||
/**验证 */
|
||||
submitForm(formName) {
|
||||
this.$refs[formName].validate(valid => {
|
||||
if (valid) {
|
||||
// 显示遮罩层
|
||||
this.loading = this.$loading({
|
||||
lock: true,
|
||||
text: "数据提交中，请稍候...",
|
||||
background: 'rgba(0,0,0,0.5)',
|
||||
target: this.$el.querySelector('.el-dialog') || document.body
|
||||
})
|
||||
let params = _.cloneDeep(this.form);
|
||||
if (this.isAdd === 'add') {
|
||||
saveTransferApplyApi(params).then(res => {
|
||||
this.loading.close();
|
||||
if (res.code === 200) {
|
||||
this.handleReuslt(res);
|
||||
} else {
|
||||
this.$modal.msgError(res.msg);
|
||||
}
|
||||
}).catch(error => {
|
||||
this.loading.close();
|
||||
// this.$modal.msgError('提交失败，请重试');
|
||||
});
|
||||
} else {
|
||||
|
||||
editTransferApplyApi(params).then(res => {
|
||||
this.loading.close();
|
||||
if (res.code === 200) {
|
||||
this.handleReuslt(res);
|
||||
} else {
|
||||
this.$modal.msgError(res.msg);
|
||||
}
|
||||
}).catch(error => {
|
||||
this.loading.close();
|
||||
// this.$modal.msgError('提交失败，请重试');
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.w700 .el-dialog {
|
||||
width: 700px;
|
||||
}
|
||||
|
||||
.w500 .el-dialog {
|
||||
width: 500px;
|
||||
}
|
||||
|
||||
.w500 .el-dialog__header,
|
||||
.w700 .el-dialog__header {
|
||||
// background: #eeeeee;
|
||||
|
||||
.el-dialog__title {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.yxq .el-range-separator {
|
||||
margin-right: 7px !important;
|
||||
}
|
||||
|
||||
.el-date-editor--daterange.el-input__inner {
|
||||
width: 260px;
|
||||
}
|
||||
|
||||
.form-item {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.select-style {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -24,7 +24,9 @@
|
|||
<el-button type="primary" class="search-btn" :disabled="disabled"
|
||||
@click="submitForm('ruleForm')">确认</el-button>
|
||||
</span>
|
||||
<!-- <FileTree v-if="fileTreeVisible" /> -->
|
||||
</el-dialog>
|
||||
|
||||
</template>
|
||||
<script>
|
||||
import _ from 'lodash'
|
||||
|
|
@ -36,11 +38,12 @@ import {
|
|||
import { getDeptSelectApi } from '@/api/select'
|
||||
import Treeselect from "@riophae/vue-treeselect";
|
||||
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
|
||||
import FileTree from '@/views/common/fileTree.vue'
|
||||
export default {
|
||||
name: "ApplyForm",
|
||||
props: ["width", "dataForm", "title", "disabled", "isAdd", "rowData"],
|
||||
dicts: ['data_class_type'],
|
||||
components: { Treeselect },
|
||||
components: { Treeselect ,FileTree},
|
||||
data() {
|
||||
return {
|
||||
lDialog: this.width > 500 ? "w700" : "w500",
|
||||
|
|
@ -62,6 +65,7 @@ export default {
|
|||
{ required: true, message: '请选择接收组织', trigger: 'change' }
|
||||
],
|
||||
},
|
||||
fileTreeVisible: false,
|
||||
};
|
||||
},
|
||||
created() {
|
||||
|
|
@ -71,7 +75,9 @@ export default {
|
|||
/** 初始化表单数据 */
|
||||
async initFormData() {
|
||||
await getDeptSelectApi().then(res => {
|
||||
this.treeDataList = res.data;
|
||||
console.log(res);
|
||||
|
||||
this.treeDataList = this.convertToVueTree(res.data);
|
||||
});
|
||||
await getProSelectApi().then(res => {
|
||||
this.proList = res.data;
|
||||
|
|
@ -93,7 +99,7 @@ export default {
|
|||
},
|
||||
// 选择移交档案
|
||||
handleAddFile(){
|
||||
|
||||
this.fileTreeVisible = true;
|
||||
},
|
||||
/*关闭弹窗 */
|
||||
handleClose() {
|
||||
|
|
@ -167,7 +173,33 @@ export default {
|
|||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
// 树数据过滤 - 支持无限层级转换
|
||||
convertToVueTree(data) {
|
||||
if (!data || !Array.isArray(data)) {
|
||||
return [];
|
||||
}
|
||||
|
||||
return data.map(item => {
|
||||
const node = {
|
||||
id: item.deptId,
|
||||
label: item.deptName,
|
||||
};
|
||||
|
||||
// 递归处理子节点
|
||||
if (item.children && Array.isArray(item.children) && item.children.length > 0) {
|
||||
const children = this.convertToVueTree(item.children);
|
||||
// 过滤掉null值（层级为3的节点）
|
||||
const filteredChildren = children.filter(child => child !== null);
|
||||
// 只有当子节点不为空时才添加 children 属性
|
||||
if (filteredChildren.length > 0) {
|
||||
node.children = filteredChildren;
|
||||
}
|
||||
}
|
||||
|
||||
return node;
|
||||
}).filter(node => node !== null); // 过滤掉null值
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Reference in New Issue