上传附件

This commit is contained in:
‘huanghaiixia’
2025-12-02 17:48:17 +08:00
parent 3232319675
commit 3e48f2b050
8 changed files with 595 additions and 142 deletions

View File

@ -157,43 +157,6 @@
}
closeModal();
emit('success', selectedValues.value);
// try {
// const values = await validate();
// let data = getDataSource();
// data.sort((a, b) => {
// return a.sortNum - b.sortNum;
// });
// values.formatJson = JSON.stringify(data);
// setModalProps({ confirmLoading: true });
// if (values.formatJson === '[]') {
// notification.warning({
// message: t('提示'),
// description: t('编码规则不能为空')
// });
// return;
// }
// // TODO custom api
// if (!unref(isUpdate)) {
// //false 新增
// await addCodeRule(values);
// notification.success({
// message: t('提示'),
// description: t('新增成功')
// }); //提示消息
// } else {
// values.id = rowId.value;
// await editCodeRule(values);
// notification.success({
// message: t('提示'),
// description: t('修改成功!')
// }); //提示消息
// }
// closeModal();
// emit('success');
// } finally {
// setModalProps({ confirmLoading: false });
// }
}

View File

@ -28,7 +28,7 @@
</a-col>
<a-col :span="24">
<a-form-item label="上传附件" name="fileList" :label-col="{ span: 4 }" :wrapper-col="{ span: 24 }">
<Upload v-model:value="formState.filePath" @change="changeUplod" ref="uploadRef" :multiple="true" :maxSize="200" :accept="accept"></Upload>
<UploadNew :file-list="formState.fileList" @change="changeUplod" :multiple="true" :maxSize="200" :accept="accept" />
<div style="color: #ccc; font-size: 12px">{{ fileTip }}</div>
</a-form-item>
@ -41,11 +41,11 @@
<script setup lang="ts">
import { ref, onMounted, computed, unref,reactive } from 'vue';
import { BasicModal, useModalInner } from '/@/components/Modal';
import { Form } from 'ant-design-vue';
import { Form, message } from 'ant-design-vue';
import { useI18n } from '/@/hooks/web/useI18n';
import type { Rule } from 'ant-design-vue/es/form';
import { useMessage } from '/@/hooks/web/useMessage';
import Upload from '/@/components/Form/src/components/Upload.vue';
import UploadNew from '/@/components/Form/src/components/UploadNew.vue';
import { getDocCpList } from '/@/api/sales/Customer';
import type { FormInstance } from 'ant-design-vue';
import dayjs from 'dayjs';
@ -65,6 +65,7 @@ let formState = reactive({
docTypeCode: '',
fileList: []
});
const list = ref()
const rules = {
docTypeCode: [{ required: true, message: "该项为必填项", trigger: 'change' }],
};
@ -74,10 +75,12 @@ const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data
setModalProps({ confirmLoading: false });
isUpdate.value = !!data?.isUpdate;
isDisable.value = data?.btnType == 'view' ? true : false
list.value = data.list
if (unref(isUpdate)) {
let dateFrom = data.record?.dateFrom ? dayjs(data.record?.dateFrom) : null
let dateTo = data.record?.dateTo ? dayjs(data.record?.dateTo) : null
Object.assign(formState, {...data.record,dateFrom, dateTo})
formState.filePath = formState.fileList[0]?.xjrFileId
}
});
@ -112,21 +115,26 @@ const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data
try {
await formRef.value.validate();
// 验证通过,提交表单
let arr = uploadRef.value.getValue() || []
let obj = {
...formState,
dateFrom: formState.dateFrom ? dayjs(formState.dateFrom).format('YYYY-MM-DD') : '',
dateTo: formState.dateTo ? dayjs(formState.dateTo).format('YYYY-MM-DD') : '',
fileList: arr.map(v => {
fileList: formState.fileList.map(v => {
return {
fileOrg: v.name,
filePath: v.url,
filesize: v.fileSize
fileSize: v.fileSize,
xjrFileId: v.folderId
}
})
}
console.log(obj,543, uploadRef.value.getValue())
formState.filePath = ''
let idx =list.value.findIndex(v => v.docTypeCode == obj.docTypeCode)
if (idx > -1) {
message.warn('证书已存在')
formRef.value.resetFields();
closeModal();
return
}
emit('success', obj);
notification.success({
message: t('操作'),

View File

@ -219,6 +219,12 @@
<a-button v-if="!isDisable" type="primary" style="margin-bottom: 10px;" @click="handleAdd('certificate')">新增证书</a-button>
<a-table :columns="columnsCertificate" :data-source="dataCertificate" >
<template #bodyCell="{ column, record, index }">
<template v-if="column.dataIndex === 'dateFrom'">
{{ record.dateFrom ? dayjs(record.dateFrom).format('YYYY-MM-DD') : ''}}
</template>
<template v-if="column.dataIndex === 'dateTo'">
{{ record.dateTo ? dayjs(record.dateTo).format('YYYY-MM-DD') : ''}}
</template>
<template v-if="column.dataIndex === 'docTypeCode'">
{{ (optionSelect.docCpList.find(v=>v.code == record.docTypeCode) || {}).fullName }}
</template>
@ -278,20 +284,7 @@
<span style="font-size: 12px;font-weight: normal;">上传公司财报等附件</span>
</div>
</template>
<a-upload
v-if="!isDisable"
:multiple="true"
:showUploadList="false"
name="file"
:action="data.action"
:headers="data.headers"
@change="handleChangeFile"
>
<a-button>
<upload-outlined></upload-outlined>
上传
</a-button>
</a-upload>
<UploadNew v-if="!isDisable" style="margin-bottom: 10px;" :file-list="dataFile" :showUploadList="false" :btnTip="btnTip" @change="changeUplod" :multiple="true"/>
<a-table :columns="columnsFile" :data-source="dataFile" >
<template #bodyCell="{ column,record,index, text }">
<template v-if="column.dataIndex === 'fileOrg'">
@ -334,10 +327,8 @@
import { addLngCustomer,updateLngCustomer,getLngCustomer } from '/@/api/sales/Customer';
import dayjs from 'dayjs';
import { getAppEnvConfig } from '/@/utils/env';
import { getToken } from '/@/utils/auth';
import { uploadSrc, uploadBlobApi } from '/@/api/sys/upload';
import { message } from 'ant-design-vue';
import UploadNew from '/@/components/Form/src/components/UploadNew.vue';
const formType = ref('2'); // 0 新建 1 修改 2 查看
const formRef = ref();
@ -364,12 +355,6 @@
const curIdx = ref(null)
const { notification } = useMessage();
const { t } = useI18n();
const data = reactive({
info: {},
action: '',
headers: { Authorization: '' },
photoUrl: '',
});
const formState = reactive({
valid: 'Y',
approCode: 'WTJ',
@ -381,6 +366,7 @@
}
]
});
const btnTip = '上传'
const [registerCertificate, { openModal:openModalCertificate }] = useModal();
const [registerContact, { openModal:openModalContact }] = useModal();
@ -440,7 +426,7 @@
]);
const dataCertificate= reactive([]);
const dataBank= reactive([]);
const dataFile = reactive([]);
const dataFile = ref([]);
const dataContact= reactive([]);
let optionSelect= reactive({
natureCodeList: [],
@ -486,12 +472,11 @@
if (pageId.value) {
getList(pageId.value)
}
data.action = getAppEnvConfig().VITE_GLOB_API_URL + uploadSrc;
data.headers.Authorization = `Bearer ${getToken()}`;
});
async function getList(id) {
spinning.value = true
try {
let data = await getLngCustomer(id)
spinning.value = false
Object.assign(formState, {...data})
@ -499,7 +484,12 @@
Object.assign(dataBank, formState.lngCustomerBankList || [])
Object.assign(dataCertificate, formState.lngCustomerDocList || [])
Object.assign(dataContact, formState.lngCustomerContactList || [])
Object.assign(dataFile, formState.lngFileUploadList || [])
Object.assign(dataFile.value, formState.lngFileUploadList || [])
formState.dateEntry = formState.dateEntry ? dayjs(formState.dateEntry) : null
formState.dateEstab = formState.dateEstab ? dayjs(formState.dateEstab) : null
} catch (error) {
spinning.value = false
}
}
async function getOption() {
optionSelect.natureCodeList = await getDictionary('LNG_ENT_PR')
@ -527,7 +517,7 @@
const handleAdd = (val)=> {
curIdx.value = null
if (val ==='certificate') {
openModalCertificate(true,{isUpdate: false});
openModalCertificate(true,{isUpdate: false, list: dataCertificate});
}
if (val ==='contact'){
openModalContact(true, {});
@ -544,7 +534,7 @@
// 证书
if (type == 'certificate') {
if (btn == 'edit' || btn == 'view') {
openModalCertificate(true, {record: record,isUpdate: true, btnType: btn});
openModalCertificate(true, {record: record,isUpdate: true, btnType: btn, list: dataCertificate});
}
if (btn == 'delete') {
dataCertificate.splice(index, 1)
@ -586,19 +576,19 @@
// 附件
if (type == 'file') {
if (btn == 'delete') {
dataFile.splice(index, 1)
dataFile.value.splice(index, 1)
}
if (btn == 'up') {
if (index === 0) {
return
}
dataFile[index] = dataFile.splice(index-1, 1, dataFile[index])[0];
dataFile.value[index] = dataFile.value.splice(index-1, 1, dataFile.value[index])[0];
}
if (btn == 'down') {
if (index === dataFile.length - 1) {
if (index === dataFile.value.length - 1) {
return
}
dataFile[index] = dataFile.splice(index+1, 1, dataFile[index])[0];
dataFile.value[index] = dataFile.value.splice(index+1, 1, dataFile.value[index])[0];
}
}
}
@ -627,36 +617,16 @@
}
dataBank.push(val)
}
function handleChangeFile(info) {
console.log(info, 'info', info.file.status)
if (info.file.status !== 'uploading') {
}
if (info.file.status === 'done') {
if (info.file && info.file.response && info.file.response.code == 0) {
message.success(t(`{name}上传成功!`, { name: info.file.name }));
// 存储原始URL到info.fileUrl用于提交改了
data.info.fileUrl = info.file.response.data.fileUrl;
data.fileName = info.file.response.data.fileName;
// 显示使用fileUrlFixed如果有否则使用fileUrl (改了)
data.photoUrl = info.file.response.data.fileUrlFixed || info.file.response.data.fileUrl;
let obj = {
fileOrg: data.fileName,
filePath: data.photoUrl,
filesize: info?.file?.response?.data?.fileSize
}
dataFile.push(obj)
} else {
message.error(t('上传照片失败'));
}
} else if (info.file.status === 'error') {
message.error(t(`{name}上传失败.`, { name: info.file.name }));
}
function changeUplod (val) {
dataFile.value = []
val.forEach(v => {
v.fileOrg = v.fileOrg || v.fileName,
v.filePath = v.filePath || v.fileUrl,
v.fileSize = v.fileSize
dataFile.value.push(v)
})
console.log(val, 532, dataFile.value)
}
function close() {
tabStore.closeTab(currentRoute.value, router);
}
@ -698,7 +668,7 @@
}
}),
lngCustomerContactList: dataContact,
lngFileUploadList: dataFile
lngFileUploadList: dataFile.value
}
spinning.value = true;
@ -711,11 +681,11 @@
data?.cuCode && (formState.cuCode = data.cuCode)
notification.success({
message: 'Tip',
description: !data?.id ? t('新增成功!') : t('修改成功!')
description: data?.id ? t('新增成功!') : t('修改成功!')
}); //提示消息
}
// formRef.value.resetFields();
return data
return data?.id ? data : formState
// setTimeout(() => {
// bus.emit(FORM_LIST_MODIFIED, { path: formPath });
// close();

View File

@ -179,14 +179,27 @@
}
});
} else {
router.push({
path: '/form/Customer/' + record.id + '/viewForm',
query: {
formPath: 'sales/Customer',
formName: formName,
formId:currentRoute.value.meta.formId
}
});
if (schemaIdComputedRef.value) {
router.push({
path: '/flow/' + schemaIdComputedRef.value + '/0/createFlow',
query: {
formPath: 'sales/Customer',
formName: formName,
formId:currentRoute.value.meta.formId,
type:'edit',
id: record.id,
disabled: 1,
}
});
}
// router.push({
// path: '/form/Customer/' + record.id + '/viewForm',
// query: {
// formPath: 'sales/Customer',
// formName: formName,
// formId:currentRoute.value.meta.formId
// }
// });
}
}
@ -231,7 +244,7 @@
});
} else {
router.push({
path: '/form/Customer/' + record.id + '/createFormCustomer',
path: '/form/Customer/' + record.id + '/createForm',
query: {
formPath: 'sales/Customer',
formName: formName,

View File

@ -10,16 +10,16 @@
</slot>
关闭
</a-button>
<a-button :disabled="data.submitLoading" type="primary" @click="saveLaunch">
<a-button v-if="!disabled" :disabled="data.submitLoading" type="primary" @click="saveLaunch">
<slot name="icon">
<send-outlined />
</slot>
提交
</a-button>
<a-button v-if="customFormConfig.codeList.includes(curPageCode)" @click="onSave">
<a-button v-if="customFormConfig.codeList.includes(curPageCode)&&!disabled" @click="onSave">
<slot name="icon"><save-outlined /></slot>保存
</a-button>
<a-button v-else :disabled="data.submitLoading" @click="saveDraft">
<a-button v-if="!customFormConfig.codeList.includes(curPageCode)&&!disabled" :disabled="data.submitLoading" @click="saveDraft">
<slot name="icon">
<clock-circle-outlined />
</slot>
@ -32,7 +32,7 @@
</slot>
流程图
</a-button>
<div v-if="customFormConfig.codeList.includes(curPageCode)">
<div v-if="customFormConfig.codeList.includes(curPageCode)&&!disabled">
<a-button>
<slot name="icon"><download-outlined /></slot>下载模板
</a-button>
@ -43,7 +43,7 @@
</a-space>
</div>
<div class="flow-content">
<component v-if="customFormConfig.codeList.includes(curPageCode)" :is="componentName" ref="formInformation" />
<component v-if="customFormConfig.codeList.includes(curPageCode)" :is="componentName" :disabled="disabled" ref="formInformation" />
<FormInformation v-else :key="randKey" ref="formInformation" :disabled="false" :formAssignmentData="data.formAssignmentData" :formInfos="data.formInfos" :opinions="data.opinions" :opinionsComponents="data.opinionsComponents" />
</div>
</div>
@ -98,6 +98,7 @@
let pageMode = 'new';
const showFlowChart = ref(false);
const disableSubmit = ref(false);
const disabled = ref(currentRoute.query?.disabled)
const mainFormModels = ref();
let randKey = ref('randkey'); // 强制表单重新渲染
let approvalData = reactive({
@ -157,7 +158,9 @@
onMounted(async () => {
try {
// 发起流程
loading.value = true
let res = await getStartProcessInfo(rSchemaId);
loading.value = false
const title = res?.schemaInfo?.name;
if (title) {
const tabPrefix = pageMode === 'new' ? '新建' : '草稿';
@ -165,7 +168,9 @@
}
curPageCode.value = res?.schemaInfo?.code
initProcessData(res);
} catch (error) {}
} catch (error) {
loading.value = false
}
randKey.value = Math.random() + '';
// 这里的顺序不能变 表单不渲染的时候 设置表单初值没用
await nextTick();