Files
mosr-web/src/views/project-management/filing/upload.vue

395 lines
9.3 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<baseTitle title="项目基本信息"></baseTitle>
<fvForm :schema="schema" @getInstance="(e)=>baseForm = e" label-position="left" label-width="left"></fvForm>
<baseTitle :title="getName()+'-上传附件'"></baseTitle>
<el-card style="width: 100%;margin: 15px 0">
<file-upload @getFile="getFile" />
<fvTable style="width: 100%;max-height: 300px;" v-if="showTable" height="300" :tableConfig="tableConfig"
:data="fileList" :isSettingCol="false" :pagination="false">
<template #empty>
<el-empty :image-size="90" description="暂无数据" style="padding: 0"/>
</template>
</fvTable>
</el-card>
<div class="oper-page-btn">
<el-button color="#DED0B2" @click="handleSubmit">提交</el-button>
</div>
</template>
<script setup lang="jsx">
import {ElNotification} from "element-plus";
import {useTagsView} from '@/stores/tagsview.js'
import {uploadFileList} from "@/api/project-manage/attachment";
import {computed, ref} from "vue";
import {getBaseInfoApi} from "@/components/steps/api";
import {useCacheStore} from '@/stores/cache.js'
import {toThousands} from '@/utils/changePrice.js'
const cacheStore = useCacheStore()
const tagsViewStore = useTagsView()
const route = useRoute()
const router = useRouter()
const fileList = ref([])
const formData = ref({
tagName:''
})
const baseFormData = ref([])
const schema = computed(() => {
return [
{
label: '承办单位',
prop: 'affiliatedCompany',
colProps: {
span: 6
}
},
{
label: '项目名称',
prop: 'projectName',
colProps: {
span: 6
}
},
{
label: '开始时间',
prop: 'startTime',
colProps: {
span: 6
}
},
{
label: '结束时间',
prop: 'endTime',
colProps: {
span: 6
}
},
{
label: '项目类型',
prop: 'projectType',
colProps: {
span: 6
},
component: () => (
<div>
{
baseFormData.value?.projectType ?
<span>{filterDict(cacheStore.getDict('project_type'), baseFormData.value?.projectType)}</span>
: <span>{'--'}</span>
}
</div>
)
},
{
label: '研发主体',
prop: 'rdSubject',
colProps: {
span: 6
},
component: () => (
<div>
{
baseFormData.value?.rdSubject ?
<span>{filterDict(cacheStore.getDict('rd_subject'), baseFormData.value?.rdSubject)}</span>
: <span>{'--'}</span>
}
</div>
)
},
{
label: '出资类型',
prop: 'investmentType',
colProps: {
span: 6
},
component: () => (
<div>
{
baseFormData.value?.investmentType ?
<span>{filterDict(cacheStore.getDict('invest_type'), baseFormData.value?.investmentType)}</span>
: <span>{'--'}</span>
}
</div>
)
},
{
label: '所属业务板块',
prop: 'businessSegment',
colProps: {
span: 6
},
component: () => (
<div>
{
baseFormData.value?.businessSegment ?
<span>{filterDict(cacheStore.getDict('business_segment'), baseFormData.value?.businessSegment)}</span>
: <span>{'--'}</span>
}
</div>
)
},
{
label: '标准制定',
prop: 'technicalStandard',
colProps: {
span: 6
},
component: () => (
<div>
{
baseFormData.value?.technicalStandard ?
<span>{filterDict(cacheStore.getDict('technical_standard'), baseFormData.value?.technicalStandard)}</span>
: <span>{'--'}</span>
}
</div>
)
},
{
label: '项目影响',
prop: 'projectImpact',
colProps: {
span: 6
},
component: () => (
<div>
{
baseFormData.value?.projectImpact ?
<span>{filterDict(cacheStore.getDict('project_impact'), baseFormData.value?.projectImpact)}</span>
: <span>{'--'}</span>
}
</div>
)
},
{
label: '经费预算(元)',
prop: 'economicEstimate',
colProps: {
span: 6
},
component: () => (
<div>
{
baseFormData.value?.economicEstimate ?
<span>{ toThousands(baseFormData.value?.economicEstimate )}</span>
: <span>{'--'}</span>
}
</div>
)
},
{
label: '产学研联合',
prop: 'industryUniversityResearch',
colProps: {
span: 6
},
component: () => (
<div>
{
baseFormData.value?.industryUniversityResearch ?
<span>{filterDict(cacheStore.getDict('industry_university'), baseFormData.value?.industryUniversityResearch)}</span>
: <span>{'--'}</span>
}
</div>
)
},
{
label: '开展政府申报',
prop: 'governmentDeclaration',
colProps: {
span: 6
},
component: () => (
<div>
{
baseFormData.value?.governmentDeclaration ?
<span>{filterDict(cacheStore.getDict('government_declaration'), baseFormData.value?.governmentDeclaration)}</span>
: <span>{'--'}</span>
}
</div>
)
},
{
label: '所属专项资金项目',
prop: 'specialFund',
colProps: {
span: 6
}
},
{
label: '申请总部专项资金(元)',
prop: 'specialFundAmount',
colProps: {
span: 6
}
},
{
label: '部门分管领导',
prop: 'optionalChargeLeadership',
colProps: {
span: 6
}
}
]
})
const baseForm = ref()
const tableConfig = reactive({
columns: [
{
prop: 'index',
type: 'index',
label: '序号',
align: 'center',
width: '80',
},
{
prop: 'originalFileName',
label: '附件名称',
align: 'center',
},
{
prop: 'tag',
label: '标签',
align: 'center'
},
{
prop: 'size',
label: '文件大小',
align: 'center',
currentRender: ({row, index}) => (parseInt(row.size / 1024) + 'KB')
},
{
prop: 'oper',
label: '操作',
align: 'center',
currentRender: ({row, index}) => {
return (
<div>
<el-button type="primary" link onClick={() => handleDownload(row)}>下载</el-button>
</div>
)
}
}
]
})
const showTable = ref(true)
const name = ref(router.currentRoute.value.name)
const rules = reactive({
tagName: [{required: true, message: '请输入标签名称', trigger: 'blur'}],
})
//匹配字典值,返回对应值的字典标签
const filterDict = (data, value) => {
if (data === undefined || value === undefined) return;
let label = ''
let result = []
if (value instanceof Array) {
value.forEach(item1 => {
data.find(item => {
if (item.value == item1) {
result.push(item.label)
}
})
})
label = result.map(item => item).join('')
} else {
if (data instanceof Array) {
data.find(item => {
if (item.value == value) {
label = item.label
}
})
}
}
return label
}
const getBaseInfo = async () => {
try {
const {code, data} = await getBaseInfoApi(route.query.id)
baseForm.value.setValues(data)
baseFormData.value = data
} catch {
}
}
getBaseInfo()
const getName=()=>{
switch (route.query.name) {
case '00':
return '需求征集'
case '10':
return '需求上报'
case '20':
return '项目立项'
case '40':
return '项目实施'
case '50':
return '项目归档'
}
}
const compositeParam = (item) => {
return {
fileId: item.id,
size: item.size,
originalFileName: item.originalFilename,
fileType: item.fileType,
url: item.url,
newFile: true,
tag: getName(),
}
}
const getFile = (val) => {
showTable.value = false
let fileObj = compositeParam(val)
fileList.value.push(fileObj)
nextTick(() => {
showTable.value = true
})
}
const getFileParam = (item) => {
return {
fileId: item.fileId,
tag:item.tag
}
}
const handleSubmit = async () => {
let files = []
fileList.value.forEach(item => {
files.push(getFileParam(item))
})
let params = {
fileList: files,
targetState:route.query.name,
projectId: route.query.id,
}
let res = await uploadFileList(params)
ElNotification({
title: '提示',
message: res.msg,
type: res.code === 1000 ? 'success' : 'error'
})
if (res.code === 1000) {
tagsViewStore.delVisitedViews(router.currentRoute.value.path)
await router.push({
name: 'Filing/attachment',
query:{
id: route.query.id,
name:route.query.name,
requirementId:route.query.requirementId
}
})
}
}
onActivated(()=>{
fileList.value=[]
})
</script>
<style scoped>
:deep(.el-table--fit ){
height: 300px!important;
}
</style>