- <template>
- <div class="operate">
- <el-form ref="ruleForm" :model="form" :rules="rules" class="dialogForm" :label-width="90" :disabled="opts.type === 'view'">
- <el-row :gutter="20">
- <el-col :span="12">
- <el-form-item label="文件名称:" prop="fileName">
- <el-input v-model="form.fileName" type="text" placeholder="请输入文件名称" />
- </el-form-item>
- </el-col>
- <el-col :span="12">
- <el-form-item label="保密等级:" prop="secretLevel">
- <el-select filterable v-model="form.secretLevel" placeholder="请选择保密等级" style="width: 100%">
- <el-option v-for="dict in document_secret_level" :key="dict.value" :label="dict.label" :value="dict.value" />
- </el-select>
- </el-form-item>
- </el-col>
- </el-row>
- <el-row :gutter="20">
- <el-col :span="12">
- <el-form-item label="所属分类:" prop="typeId">
- <el-tree-select
- v-model="form.typeId"
- :data="treeData"
- node-key="id"
- :render-after-expand="true"
- :props="{ label: 'typeName', children: 'children' }"
- check-strictly
- style="width: 100%"
- class="fileTreeSel"
- />
- </el-form-item>
- </el-col>
- <el-col :span="12">
- <el-form-item label="文件标签:" prop="fileTag">
- <el-select filterable v-model="form.fileTag" placeholder="请选择文件标签" clearable style="width: 100%" multiple>
- <el-option v-for="dict in document_tag" :key="dict.value" :label="dict.label" :value="dict.value" />
- </el-select>
- </el-form-item>
- </el-col>
- </el-row>
- <el-row :gutter="20">
- <el-col :span="12">
- <el-form-item label="电子档:" prop="sysFileSaveRequestList">
- <ImageFileUpload
- v-model:saveFileArr="form.sysFileSaveRequestList"
- :limit="1"
- :isBackName="true"
- listType="text"
- :disabled="opts.type === 'view'"
- @preview="handlePreview"
- :fileType="['doc', 'xls', 'ppt', 'txt', 'pdf']"
- />
- </el-form-item>
- </el-col>
- <el-col :span="12">
- <el-form-item label="纸质原件:" prop="saveAddressId">
- <el-select filterable v-model="form.saveAddressId" placeholder="请选择纸质原件存放地址" style="width: 100%" clearable>
- <el-option v-for="item in documentSaveAddressList" :key="item.id" :label="item.addressName" :value="item.id" />
- </el-select>
- </el-form-item>
- </el-col>
- </el-row>
- <el-row :gutter="20">
- <el-col :span="8">
- <el-form-item label="电子档名称:">
- <el-input :model-value="fileInfo.name" type="text" disabled />
- </el-form-item>
- </el-col>
- <el-col :span="8">
- <el-form-item label="电子档格式:">
- <el-input :model-value="fileInfo.extension" type="text" disabled />
- </el-form-item>
- </el-col>
- <el-col :span="8">
- <el-form-item label="电子档大小:">
- <el-input :model-value="handleFileSize(fileInfo.size)" type="text" disabled />
- </el-form-item>
- </el-col>
- </el-row>
- <el-row :gutter="20">
- <el-col :span="24">
- <el-form-item label="文件描述:" prop="remark">
- <el-input v-model="form.remark" type="textarea" placeholder="请输入文件描述" resize="none" :rows="4" />
- </el-form-item>
- </el-col>
- </el-row>
- </el-form>
- </div>
- </template>
-
- <script setup>
- import { ref, reactive, onMounted, watch } from 'vue';
- import { inheritAttr } from '@/utils/v3';
- import { required } from '@/utils/validate-helper';
- import { handleFileSize } from '@/utils';
- import { getDocumentSaveAddressList, documentFileAdd, documentFileEdit, documentFileDetail } from '@/api/document/fileManagement/list';
- import { documentAccessRecordAdd } from '@/api/document/fileManagement/loanRecord';
- import { documentTypeTree } from '@/api/document/dataClassify';
- // import FileUpload from '@/components/FileUpload'
- import { getFileLIst } from '@/api/system/file';
- const methed = {
- add: documentFileAdd,
- edit: documentFileEdit,
- };
-
- const { proxy } = getCurrentInstance();
- const { document_secret_level, document_tag, document_save_type } = proxy.useDict(
- 'document_secret_level',
- 'document_tag',
- 'document_save_type'
- );
-
- const props = defineProps({
- curRow: {
- type: Object,
- default: () => ({}),
- },
- opts: {
- type: Object,
- default: () => ({}),
- },
- });
- const { curRow, opts } = props;
- const emit = defineEmits(['close']);
- const treeData = ref([]);
- const form = reactive({
- id: curRow.id || '',
- fileName: '',
- secretLevel: '',
- saveType: '',
- saveAddressId: '',
- typeId: '',
- fileTag: [],
- remark: '',
- sysFileSaveRequestList: [],
- });
- const fileInfo = ref({});
- watch(
- () => form.sysFileSaveRequestList,
- val => {
- if (val.length) {
- val[0].refType = 'document_file_attachment';
- fileInfo.value = val[0];
- } else {
- fileInfo.value = {};
- }
- nextTick(() => {
- proxy.$refs.ruleForm.validateField('sysFileSaveRequestList');
- });
- },
- { deep: true }
- );
-
- const rules = reactive({
- fileName: required('文件名称'),
- secretLevel: required('保密等级'),
- typeId: required('所属分类'),
- fileTag: required('文件标签'),
- sysFileSaveRequestList: required('电子档'),
- });
-
- const documentSaveAddressList = ref([]);
-
- const submit = () => {
- proxy.$refs.ruleForm.validate(async (valid, fields) => {
- if (valid) {
- let api = methed[opts.type];
- if (!api) return;
- let saveType = 'electronic';
- if (form.saveAddressId) {
- saveType = 'electronic,paper';
- }
- const params = {
- ...form,
- fileTag: form.fileTag.join(),
- saveType,
- };
- const res = await api(params);
- if (res?.code !== 200) return;
- proxy.$modal.msgSuccess('操作成功');
- emit('close', opts);
- } else {
- console.log('error submit!', fields);
- }
- });
- };
-
- const getDocumentSaveAddressListFn = async () => {
- const res = await getDocumentSaveAddressList();
- if (res?.code !== 200) return;
- documentSaveAddressList.value = res.data || [];
- };
-
- const getTreeData = async () => {
- const res = await documentTypeTree();
- if (res?.code !== 200) return;
- treeData.value = res.data || [];
- };
-
- const getDetail = async () => {
- const res = await documentFileDetail(curRow.id);
- if (res?.code !== 200) return;
- inheritAttr(res.data, form);
- form.fileTag = form.fileTag ? form.fileTag.split(',') : [];
- getFileInfo(res.data.id, 'document_file_attachment', data => {
- if (!data.length) return;
- const fileInfo = data[0];
- form.sysFileSaveRequestList = [{ ...fileInfo, refType: 'document_file_attachment' }];
- });
- };
-
- const getFileInfo = async (id, refType, callback) => {
- const res = await getFileLIst({ refId: id, refType });
- if (res?.code !== 200) return;
- callback && callback(res.data);
- };
-
- const handlePreview = () => {
- console.log(form.id);
- documentAccessRecordAdd({
- fileId: form.id,
- });
- };
-
- onMounted(() => {
- getDocumentSaveAddressListFn();
- getTreeData();
- if (curRow?.id) getDetail();
- });
-
- defineExpose({
- submit,
- });
- </script>
-
- <style lang="scss" scoped>
- .fileTreeSel {
- .el-tree-node__children {
- .el-tree-node__expand-icon {
- visibility: hidden;
- }
- }
- }
- </style>