fix : 修复新增专项资金/需求征集排版

This commit is contained in:
2024-08-12 22:37:31 +08:00
parent 95a2161ab3
commit e643d9ef86
2 changed files with 142 additions and 82 deletions

View File

@@ -1,35 +1,43 @@
<template>
<div v-loading="loading" class="add-block">
<baseTitle title="专项资金信息录入"></baseTitle>
<el-form :model="formData" inline class="query-form" ref="fundForm" :rules="rules">
<el-form-item label="专项资金名称" prop="name">
<el-input v-model="formData.name" placeholder="请输入专项资金名称" clearable></el-input>
</el-form-item>
<el-form-item label="金额(元)" prop="fundAmount">
<el-input-number v-model="formData.fundAmount" placeholder="请输入金额" :controls="false"/>
</el-form-item>
<el-form :model="formData" ref="fundForm" :rules="rules" label-width="135" style="margin-left: 5px;margin-bottom: -18px">
<el-row gutter="30">
<el-col :span="6" >
<el-form-item label="专项资金名称" prop="name">
<el-input v-model="formData.name" placeholder="请输入专项资金名称" clearable></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="金额(元)" prop="fundAmount" label-width="100">
<el-input-number v-model="formData.fundAmount" placeholder="请输入金额" :controls="false"/>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="专项资金情况说明" prop="introduce">
<el-input
v-model="formData.introduce"
style="width:100%"
:rows="5"
type="textarea"
placeholder="请输入专项资金情况说明"
/>
</el-form-item>
</el-col>
</el-row>
</el-form>
<baseTitle title="介绍"></baseTitle>
<el-input
v-model="formData.introduce"
style="width:100%"
:rows="5"
type="textarea"
placeholder="请输入介绍"
/>
<div style="display: flex;align-items: center">
<baseTitle title="申请文件" style="margin-right: 10px"></baseTitle>
<file-upload @getFile="getFile"/>
</div>
<baseTitle title="附件文件" style="margin-right: 10px"></baseTitle>
<file-upload @getFile="getFile"/>
<fvTable style="width: 100%;max-height: 162px;" v-if="showTable"
:tableConfig="tableConfig" height="162" :data="formData.files"
:tableConfig="tableConfig" height="162" :data="formData.files"
:isSettingCol="false" :pagination="false">
<template #empty>
<el-empty :image-size="55" description="暂无数据" style="padding: 0"/>
</template>
</fvTable>
<div class="approval-record">
<div class="approval-title" >
<div class="approval-title">
<baseTitle title="审批记录"></baseTitle>
<div class="diagram">
<div class="base-title">流程图</div>
@@ -39,8 +47,9 @@
/>
</div>
</div>
<el-empty :image-size="100" description="暂无审批记录" v-if="processDiagramViewer&& !opentionData?.operationList&&!changeDiagram"/>
<!-- <process-diagram-viewer mode="view" v-if="processDiagramViewer&&changeDiagram"/>-->
<el-empty :image-size="100" description="暂无审批记录"
v-if="processDiagramViewer&& !opentionData?.operationList&&!changeDiagram"/>
<!-- <process-diagram-viewer mode="view" v-if="processDiagramViewer&&changeDiagram"/>-->
<div class="process">
<operation-render
v-if="processDiagramViewer&& opentionData?.operationList && opentionData?.operationList.length > 0&&!changeDiagram"
@@ -54,7 +63,8 @@
<el-button color="#DED0B2" v-else @click="handleResubmit">重新提交</el-button>
<el-button @click="handleBack">返回</el-button>
</div>
<file-preview ref="filePreviewRef" v-if="filePreviewShow" :fileName="filePreviewParam.fileName" :fileUrl="filePreviewParam.fileUrl"
<file-preview ref="filePreviewRef" v-if="filePreviewShow" :fileName="filePreviewParam.fileName"
:fileUrl="filePreviewParam.fileUrl"
:fileType="filePreviewParam.fileType"/>
</div>
</template>
@@ -63,7 +73,7 @@
import OperationRender from '@/views/workflow/common/OperationRender.vue'
import ProcessDiagramViewer from '@/views/workflow/common/ProcessDiagramViewer.vue';
import {ElNotification} from "element-plus";
import {addFund, resubmitFund, getFundDetail,getFundDetailProcess, getFundProcess} from "@/api/special-fund";
import {addFund, resubmitFund, getFundDetail, getFundDetailProcess, getFundProcess} from "@/api/special-fund";
import {useRouter} from "vue-router";
import {useTagsView} from '@/stores/tagsview.js'
import {useProcessStore} from '@/stores/processStore.js';
@@ -100,7 +110,8 @@ const tableConfig = reactive({
label: '文件名',
align: 'center',
showOverflowTooltip: false,
currentRender: ({row, index}) => (<div style="color: #2a99ff;cursor: pointer;" onClick={()=>clickToPreview(row)}>{row.originalFileName}</div>)
currentRender: ({row, index}) => (
<div style="color: #2a99ff;cursor: pointer;" onClick={() => clickToPreview(row)}>{row.originalFileName}</div>)
},
{
prop: 'tag',
@@ -133,9 +144,9 @@ const tableConfig = reactive({
})
const routerName = ref(router.currentRoute.value.name)
const rules = reactive({
name: [{required: true, message: '请输入专项资金名称', trigger: 'blur'}],
fundAmount: [{required: true, message: '请输入金额', trigger: 'blur'}],
introduce: [{required: true, message: '请输入介绍', trigger: 'blur'}],
name: [{required: true, message: '请输入专项资金名称', trigger: ['blur', 'change']}],
fundAmount: [{required: true, message: '请输入金额', trigger: ['blur', 'change']}],
introduce: [{required: true, message: '请输入专项资金情况说明', trigger: ['blur', 'change']}],
})
const filePreviewParam = ref({
@@ -144,14 +155,14 @@ const filePreviewParam = ref({
fileType: 'pdf'
})
const filePreviewShow = ref(false)
const clickToPreview=(row)=>{
const clickToPreview = (row) => {
filePreviewShow.value = false
filePreviewParam.value = {
fileUrl: row.url,
fileName: row.originalFileName,
fileType: row.fileType
}
nextTick(()=>{
nextTick(() => {
filePreviewShow.value = true
})
}
@@ -322,8 +333,34 @@ onMounted(async () => {
:deep(.el-table--fit ) {
height: 300px !important;
}
.add-block{
padding: 0 30px 30px 15px;
.add-block {
padding: 0 40px;
}
:deep(.el-input-number) {
width: 88%;
.el-input__wrapper{
padding: 1px 11px!important;
}
.el-input__inner {
text-align: left;
}
}
:deep(.el-table__header) {
.is-leaf:first-child {
.cell {
margin-left: -20px !important;
}
}
}
:deep(.el-table__body) {
.el-table__cell:first-child {
.cell {
margin-left: -10px !important;
}
}
}
</style>