修改上传文件组件
This commit is contained in:
@@ -293,16 +293,25 @@
|
||||
// moment(date).format('YYYY-MM-DD')
|
||||
},
|
||||
clickButtonToUpload(current) {
|
||||
this.$refs.uploadFile.perentHandleFunc()
|
||||
this.$refs.uploadFile.visible = true
|
||||
this.uploadName = current
|
||||
getAction('sys/common/getFileInfos', { connectId: this.formInline[current] }).then((res) => {
|
||||
if (res.success) {
|
||||
this.$refs.uploadFile.perentHandleFunc(res.result)
|
||||
} else {
|
||||
this.$refs.uploadFile.perentHandleFunc()
|
||||
}
|
||||
})
|
||||
},
|
||||
/** 上传文件的回调 */
|
||||
uploadSuccess(data) {
|
||||
console.log(data)
|
||||
let attIdList = []
|
||||
data.map(item => {
|
||||
attIdList.push(item.id || data.name)
|
||||
})
|
||||
if (data && data.length > 0) {
|
||||
data.map(item => {
|
||||
attIdList.push(item.id || data.name)
|
||||
})
|
||||
}
|
||||
/** 赋值给当前对应的表单文件 */
|
||||
this.formInline[this.uploadName] = attIdList.join(',')
|
||||
this.formInline = { ...this.formInline }
|
||||
|
||||
@@ -66,8 +66,8 @@
|
||||
columns: [],
|
||||
selectedRowKeys: [],
|
||||
dataSource: [],
|
||||
pageNo: '1',
|
||||
pageSize: '10',
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
total: 0,
|
||||
searchParmes: {},
|
||||
loading: false
|
||||
@@ -102,7 +102,7 @@
|
||||
})
|
||||
})
|
||||
let width
|
||||
if (this.OperationList.length > 0){
|
||||
if (this.OperationList.length > 0) {
|
||||
width = this.OperationList.length * 55
|
||||
}
|
||||
if (this.showAction) {
|
||||
@@ -118,10 +118,12 @@
|
||||
})
|
||||
},
|
||||
getTableList() {
|
||||
let pageNo = JSON.parse(JSON.stringify(this.pageNo))
|
||||
let pageSize = JSON.parse(JSON.stringify(this.pageSize))
|
||||
let params = {
|
||||
...this.searchParmes,
|
||||
pageNo: this.pageNo,
|
||||
pageSize: this.pageSize
|
||||
pageNo: pageNo + '',
|
||||
pageSize: pageSize + ''
|
||||
}
|
||||
this.loading = true
|
||||
postAction(this.url.tableList, params).then((res) => {
|
||||
@@ -133,11 +135,11 @@
|
||||
})
|
||||
},
|
||||
onChange(page, pageSize) {
|
||||
this.pageNo = page+''
|
||||
this.pageNo = page
|
||||
this.getTableList()
|
||||
},
|
||||
SizeChange(page, pageSize) {
|
||||
this.pageSize = pageSize+''
|
||||
this.pageSize = pageSize
|
||||
this.getTableList()
|
||||
},
|
||||
onSelectChange() {
|
||||
|
||||
@@ -50,7 +50,6 @@
|
||||
methods:{
|
||||
perentHandleFunc(data){
|
||||
this.myfileList = data
|
||||
this.fileList = data
|
||||
if (data && data.length > 0){
|
||||
this.myfileList.forEach((res)=>{
|
||||
res.name = res.fileName
|
||||
@@ -58,7 +57,6 @@
|
||||
})
|
||||
}else {
|
||||
this.myfileList = []
|
||||
this.fileList = []
|
||||
}
|
||||
},
|
||||
beforeUpload(file) {
|
||||
|
||||
@@ -1,279 +1,190 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<div class="doc-detail">
|
||||
<div class="doc-detail-wrap">
|
||||
<div class="doc-detail-header">
|
||||
<div class="doc-detail-title">
|
||||
GB 27999-2019 《乘用车燃料消耗量评价方法及指标》 标准详情
|
||||
<div class="doc-detail">
|
||||
<div class="doc-detail-wrap">
|
||||
<div class="doc-detail-header">
|
||||
<div class="doc-detail-title">
|
||||
<a-icon type="home" style="margin-right: 4px"/>
|
||||
GB 27999-2019 《乘用车燃料消耗量评价方法及指标》 标准详情
|
||||
</div>
|
||||
<div class="doc-detail-right">
|
||||
<a-button class="doc-detail-btn" type="primary">更新log</a-button>
|
||||
<a-button class="doc-detail-btn" type="primary">文档拆分</a-button>
|
||||
<a-button class="doc-detail-btn" type="primary">文档翻译</a-button>
|
||||
<a-button class="doc-detail-btn" type="primary">文档对比</a-button>
|
||||
<a-button class="doc-detail-btn" type="primary">知识问答库</a-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="doc-detail-right">
|
||||
<a-button class="doc-detail-btn" type="primary">更新log</a-button>
|
||||
<a-button class="doc-detail-btn" type="primary">文档拆分</a-button>
|
||||
<a-button class="doc-detail-btn" type="primary">文档翻译</a-button>
|
||||
<a-button class="doc-detail-btn" type="primary">文档对比</a-button>
|
||||
<a-button class="doc-detail-btn" type="primary">知识问答库</a-button>
|
||||
<div class="content">
|
||||
<div class="header-text">
|
||||
基本信息
|
||||
</div>
|
||||
<div class="content-text">
|
||||
<div class="text-field" v-for="(item,index) in 19" :key="index">
|
||||
<span class="text-field-left" v-if="index == 1">标注实施日期</span>
|
||||
<span class="text-field-left" v-else>编号</span>
|
||||
<span class="text-field-right">GB 27999-8019</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="header-text">
|
||||
文本信息
|
||||
</div>
|
||||
<div class="TextInformation">
|
||||
<div class="TextInformationContent" v-for="item in 10">
|
||||
<span class="TextInformationContentLeft">
|
||||
测试程序
|
||||
</span>
|
||||
<span class="TextInformationContentcontent">
|
||||
123456.pdf
|
||||
</span>
|
||||
<span class="TextInformationContentright">
|
||||
<a-icon type="vertical-align-bottom"/>
|
||||
下载
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="header-text">
|
||||
文本信息
|
||||
</div>
|
||||
<div class="TextInformation">
|
||||
<div class="TextInformationContent" v-for="item in 3">
|
||||
<span class="TextInformationContentLeft">
|
||||
测试程序
|
||||
</span>
|
||||
<span class="TextInformationContentcontent">
|
||||
123456.pdf
|
||||
</span>
|
||||
<span class="TextInformationContentright">
|
||||
<a-icon type="vertical-align-bottom"/>
|
||||
下载
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<a-divider orientation="left">
|
||||
基本信息
|
||||
</a-divider>
|
||||
<div class="doc-detail-info">
|
||||
<div class="doc-info-wrap">
|
||||
<div class="doc-info-content">
|
||||
<div class="doc-info-key">
|
||||
编号
|
||||
</div>
|
||||
<div class="doc-info-value">
|
||||
GB 279999-2019
|
||||
</div>
|
||||
</div>
|
||||
<div class="doc-info-content">
|
||||
<div class="doc-info-key">
|
||||
编号
|
||||
</div>
|
||||
<div class="doc-info-value">
|
||||
GB 279999-2019
|
||||
</div>
|
||||
</div>
|
||||
<div class="doc-info-content doc-info-right">
|
||||
<div class="doc-info-key">
|
||||
编号
|
||||
</div>
|
||||
<div class="doc-info-value">
|
||||
GB 279999-2019
|
||||
</div>
|
||||
</div>
|
||||
<div class="doc-info-content doc-info-bottom">
|
||||
<div class="doc-info-key">
|
||||
编号
|
||||
</div>
|
||||
<div class="doc-info-value">
|
||||
GB 279999-2019
|
||||
</div>
|
||||
</div>
|
||||
<div class="doc-info-content doc-info-bottom">
|
||||
<div class="doc-info-key">
|
||||
编号
|
||||
</div>
|
||||
<div class="doc-info-value">
|
||||
GB 279999-2019
|
||||
</div>
|
||||
</div>
|
||||
<div class="doc-info-content doc-info-bottom doc-info-right">
|
||||
<div class="doc-info-key">
|
||||
|
||||
</div>
|
||||
<div class="doc-info-value">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<a-divider orientation="left">
|
||||
文本信息
|
||||
</a-divider>
|
||||
<div class="doc-detail-text">
|
||||
<div class="doc-text-wrap">
|
||||
<div class="doc-text-content">
|
||||
<div class="doc-text-key">
|
||||
测试程序
|
||||
</div>
|
||||
<div class="doc-text-value">
|
||||
<div class="doc-text-left">
|
||||
<a href="javascript:;">FMVSS 114中文.pdf</a>
|
||||
</div>
|
||||
<div class="doc-text-right">
|
||||
<a-button type="primary">标准分解单</a-button>
|
||||
<a-icon type="download" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="doc-text-content doc-text-content-bottom">
|
||||
<div class="doc-text-key">
|
||||
测试程序1
|
||||
</div>
|
||||
<div class="doc-text-value">
|
||||
<div class="doc-text-left">
|
||||
<a href="javascript:;">FMVSS 114中文11111.pdf</a>
|
||||
</div>
|
||||
<div class="doc-text-right">
|
||||
<a-button type="primary">标准分解单</a-button>
|
||||
<a-icon type="download" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<a-divider orientation="left">
|
||||
关联信息
|
||||
</a-divider>
|
||||
<div class="doc-detail-relation">
|
||||
<div class="doc-relation-wrap">
|
||||
<div class="doc-relation-content">
|
||||
<div class="doc-relation-key">
|
||||
代替标准
|
||||
</div>
|
||||
<div class="doc-relation-value">
|
||||
<a href="javascript:;">GB 27999-2019</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="doc-relation-content doc-relation-content-bottom">
|
||||
<div class="doc-relation-key">
|
||||
代替标准
|
||||
</div>
|
||||
<div class="doc-relation-value">
|
||||
<a href="javascript:;">GB 27999-2019</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a-card>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.doc-detail{
|
||||
.doc-detail {
|
||||
padding: 20px;
|
||||
.doc-detail-wrap{
|
||||
.doc-detail-header{
|
||||
|
||||
.doc-detail-wrap {
|
||||
.doc-detail-header {
|
||||
height: 50px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
border-bottom:1px #9e9e9e solid ;
|
||||
.doc-detail-title{
|
||||
display:inline-block;
|
||||
text-overflow:ellipsis;
|
||||
white-space:nowrap;
|
||||
overflow:hidden;
|
||||
border-bottom: 2px #eff1f3 solid;
|
||||
|
||||
.doc-detail-title {
|
||||
display: inline-block;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
}
|
||||
.doc-detail-right{
|
||||
|
||||
.doc-detail-right {
|
||||
min-width: 500px;
|
||||
.doc-detail-btn{
|
||||
|
||||
.doc-detail-btn {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.doc-detail-info{
|
||||
.doc-info-wrap{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
.doc-info-content {
|
||||
width: 33.33333%;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
text-align: center;
|
||||
border: 1px solid #ccc;
|
||||
border-right: none;
|
||||
border-bottom: none;
|
||||
.doc-info-key {
|
||||
border-right:1px solid #ccc;
|
||||
width: 50%;
|
||||
display:inline-block;
|
||||
text-overflow:ellipsis;
|
||||
white-space:nowrap;
|
||||
overflow:hidden;
|
||||
background: #c6e6f5;
|
||||
}
|
||||
.doc-info-value {
|
||||
width: 50%;
|
||||
display:inline-block;
|
||||
text-overflow:ellipsis;
|
||||
white-space:nowrap;
|
||||
overflow:hidden;
|
||||
}
|
||||
}
|
||||
.doc-info-right{
|
||||
border-right: 1px solid #ccc;
|
||||
}
|
||||
.doc-info-bottom{
|
||||
border-bottom: 1px solid #ccc;
|
||||
}
|
||||
}
|
||||
}
|
||||
.doc-detail-text{
|
||||
.doc-text-wrap{
|
||||
.doc-text-content {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
text-align: center;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
border: 1px solid #ccc;
|
||||
border-bottom: none;
|
||||
.doc-text-key {
|
||||
width: 16.666665%;
|
||||
border-right: 1px solid #ccc;
|
||||
display: inline-block;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
background: #c6e6f5;
|
||||
}
|
||||
|
||||
.doc-text-value {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.doc-text-left{
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
.doc-text-right{
|
||||
min-width: 150px;
|
||||
button{
|
||||
margin-right: 10px;
|
||||
}
|
||||
.anticon-download{
|
||||
color: #1890FF;
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.header-text {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
}
|
||||
|
||||
.content-text {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.text-field {
|
||||
width: 33%;
|
||||
margin-bottom: 8px;
|
||||
|
||||
.text-field-left {
|
||||
width: 160px;
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
color: #6f7385;
|
||||
}
|
||||
.doc-text-content-bottom{
|
||||
border-bottom: 1px solid #ccc;
|
||||
|
||||
.text-field-right {
|
||||
width: calc(100% - 200px);
|
||||
display: inline-block;
|
||||
font-size: 17px;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
color: #040b29;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
}
|
||||
.doc-detail-relation{
|
||||
.doc-relation-wrap{
|
||||
.doc-relation-content {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
border: 1px solid #ccc;
|
||||
border-bottom: none;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
|
||||
.TextInformation {
|
||||
height: auto;
|
||||
|
||||
.TextInformationContent {
|
||||
height: 50px;
|
||||
border-top: 1.6px #eff1f3 solid;
|
||||
border-right: 1.6px #eff1f3 solid;
|
||||
.TextInformationContentLeft {
|
||||
width: 310px;
|
||||
height: 50px;
|
||||
border: 1.6px #eff1f3 solid;
|
||||
display: inline-block;
|
||||
background: #f7f7f8;
|
||||
text-align: center;
|
||||
.doc-relation-key {
|
||||
width: 16.666665%;
|
||||
border-right: 1px solid #ccc;
|
||||
display: inline-block;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
background: #c6e6f5;
|
||||
}
|
||||
.doc-relation-value {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
color: #040b29;
|
||||
line-height: 50px;
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
.doc-relation-content-bottom{
|
||||
border-bottom: 1px solid #ccc;
|
||||
.TextInformationContentcontent {
|
||||
width: calc(100% - 410px);
|
||||
line-height: 50px;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
color: #67bbc3;
|
||||
font-size: 15px;
|
||||
font-weight: 500;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.TextInformationContentright {
|
||||
width: 100px;
|
||||
display: inline-block;
|
||||
line-height: 50px;
|
||||
color: #67bbc3;
|
||||
font-size: 15px;
|
||||
font-weight: 500;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
.TextInformationContent:last-child{
|
||||
border-bottom: 1.6px #eff1f3 solid;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user