2025-09-16 14:37:37 +08:00
|
|
|
|
<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="所属案卷">
|
|
|
|
|
|
<el-input type="textarea" class="form-item" :value="belongName" :disabled="true"></el-input>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
<el-form-item label="文件题名" prop="contentName">
|
|
|
|
|
|
<el-input type="textarea" class="form-item" v-model="form.contentName" clearable show-word-limit
|
|
|
|
|
|
placeholder="请输入文件题名" maxlength="64" :disabled="detailStatus"></el-input>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
<el-form-item label="案卷期限" prop="term">
|
|
|
|
|
|
<el-input class="form-item" v-model="form.term" clearable show-word-limit
|
|
|
|
|
|
placeholder="请输入案卷期限" maxlength="32" :disabled="detailStatus"></el-input>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
<el-form-item label="归档责任单位" prop="unitName">
|
|
|
|
|
|
<el-input class="form-item" v-model="form.unitName" clearable show-word-limit
|
|
|
|
|
|
placeholder="请输入归档责任单位" maxlength="32" :disabled="detailStatus"></el-input>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
<el-form-item label="所属专业" prop="major">
|
|
|
|
|
|
<el-input class="form-item" v-model="form.major" clearable show-word-limit
|
|
|
|
|
|
placeholder="请输入所属专业" maxlength="32" :disabled="detailStatus"></el-input>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
<el-form-item label="档案标识代码" prop="markCode">
|
|
|
|
|
|
<el-select class="form-item" v-model="form.markCode" :disabled="detailStatus" filterable clearable
|
|
|
|
|
|
placeholder="请选择档案标识代码">
|
|
|
|
|
|
<el-option v-for="item in dict.type.mark_code" :key="item.value" :label="item.label"
|
|
|
|
|
|
:value="item.label"></el-option>
|
|
|
|
|
|
</el-select>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
<el-form-item label="文件分类标记" prop="classifyMark">
|
|
|
|
|
|
<el-select class="form-item" v-model="form.classifyMark" :disabled="detailStatus" filterable clearable>
|
|
|
|
|
|
<el-option v-for="item in classifyMarkList" :key="item.id" :label="item.name" :value="item.id"></el-option>
|
|
|
|
|
|
</el-select>
|
|
|
|
|
|
</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" v-if="!detailStatus"
|
|
|
|
|
|
@click="submitForm('ruleForm')">确认</el-button>
|
|
|
|
|
|
</span>
|
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
|
|
|
import _ from 'lodash'
|
|
|
|
|
|
import {
|
|
|
|
|
|
addArchiveRightApi,
|
|
|
|
|
|
editArchiveRightApi,
|
|
|
|
|
|
} from '@/api/archivesManagement/index.js'
|
|
|
|
|
|
import {getClassifyMarkSelApi} from '@/api/select.js'
|
|
|
|
|
|
export default {
|
|
|
|
|
|
name: "FileAddTableData",
|
2025-09-17 10:02:31 +08:00
|
|
|
|
props: ["width", "dataForm", "title", "disabled", "isAdd", "rowData","projectId"],
|
2025-09-16 14:37:37 +08:00
|
|
|
|
dicts: ['mark_code'],
|
|
|
|
|
|
data() {
|
|
|
|
|
|
return {
|
|
|
|
|
|
lDialog: this.width > 500 ? "w700" : "w500",
|
|
|
|
|
|
dialogVisible: true,
|
|
|
|
|
|
isDisabled: true,
|
|
|
|
|
|
getClassifyMarkSelApi,
|
|
|
|
|
|
classifyMarkList : [],
|
|
|
|
|
|
form: {
|
|
|
|
|
|
contentName: null,
|
|
|
|
|
|
term: null,
|
|
|
|
|
|
unitName: null,
|
|
|
|
|
|
major: null,
|
|
|
|
|
|
markCode: null,
|
|
|
|
|
|
classifyMark: null,
|
|
|
|
|
|
},
|
|
|
|
|
|
belongName:'',
|
|
|
|
|
|
loading: null,
|
|
|
|
|
|
detailStatus:false,
|
|
|
|
|
|
rules: {
|
|
|
|
|
|
contentName: [
|
|
|
|
|
|
{ required: true, message: '文件题名不能为空', trigger: 'blur' }
|
|
|
|
|
|
],
|
|
|
|
|
|
term: [
|
|
|
|
|
|
{ required: true, message: '案卷期限不能为空', trigger: 'blur' }
|
|
|
|
|
|
],
|
|
|
|
|
|
unitName: [
|
|
|
|
|
|
{ required: true, message: '归档责任单位不能为空', trigger: 'blur' }
|
|
|
|
|
|
],
|
|
|
|
|
|
major: [
|
|
|
|
|
|
{ required: true, message: '所属专业不能为空', trigger: 'blur' }
|
|
|
|
|
|
],
|
|
|
|
|
|
markCode: [
|
|
|
|
|
|
{ required: true, message: '请选择档案标识代码', trigger: 'change' }
|
|
|
|
|
|
],
|
|
|
|
|
|
classifyMark: [
|
|
|
|
|
|
{ required: true, message: '请选择文件分类标记', trigger: 'change' }
|
|
|
|
|
|
],
|
|
|
|
|
|
},
|
|
|
|
|
|
};
|
|
|
|
|
|
},
|
|
|
|
|
|
created() {
|
|
|
|
|
|
this.initFormData();
|
|
|
|
|
|
},
|
|
|
|
|
|
methods: {
|
|
|
|
|
|
/** 初始化表单数据 */
|
|
|
|
|
|
async initFormData() {
|
|
|
|
|
|
const res = await getClassifyMarkSelApi();
|
|
|
|
|
|
this.classifyMarkList = res.data;
|
|
|
|
|
|
this.belongName = this.rowData.belongName;
|
|
|
|
|
|
this.detailStatus = this.rowData.detailStatus;
|
|
|
|
|
|
if ((this.isAdd === 'edit' || this.isAdd === 'detail') && this.rowData) {
|
|
|
|
|
|
// 编辑模式：填充表单数据
|
|
|
|
|
|
this.form = {
|
|
|
|
|
|
id: this.rowData.id,
|
|
|
|
|
|
contentName: this.rowData.contentName || null,
|
|
|
|
|
|
term: this.rowData.term || null,
|
|
|
|
|
|
major: this.rowData.major || null,
|
|
|
|
|
|
unitName: this.rowData.unitName || null,
|
|
|
|
|
|
markCode: this.rowData.markCode || null,
|
|
|
|
|
|
classifyMark: this.rowData.classifyMark || null,
|
|
|
|
|
|
parentId:this.rowData.parentId || null,
|
|
|
|
|
|
level:4
|
|
|
|
|
|
};
|
|
|
|
|
|
} else {
|
|
|
|
|
|
// 新增模式：重置表单
|
|
|
|
|
|
this.form = {
|
|
|
|
|
|
contentName: null,
|
|
|
|
|
|
term: null,
|
|
|
|
|
|
unitName: null,
|
|
|
|
|
|
major: null,
|
|
|
|
|
|
markCode: null,
|
|
|
|
|
|
classifyMark: null,
|
|
|
|
|
|
parentId:this.rowData.id || null,
|
|
|
|
|
|
level:4
|
|
|
|
|
|
};
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
/*关闭弹窗 */
|
|
|
|
|
|
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 = {
|
|
|
|
|
|
contentName: null,
|
|
|
|
|
|
term: null,
|
|
|
|
|
|
unitName: null,
|
|
|
|
|
|
major: null,
|
|
|
|
|
|
markCode: null,
|
|
|
|
|
|
classifyMark: null,
|
|
|
|
|
|
parentId:null,
|
|
|
|
|
|
level:4
|
|
|
|
|
|
};
|
|
|
|
|
|
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') {
|
|
|
|
|
|
addArchiveRightApi(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 {
|
|
|
|
|
|
editArchiveRightApi(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>
|
