|
|
@@ -84,25 +84,39 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="boxswai" style="width:74%;padding-left:0px;padding-right:0px;">
|
|
|
- <!-- <div class="basic-info">
|
|
|
+ <div class="basic-info">
|
|
|
<div class="info-title">清表基础信息</div>
|
|
|
<div class="info-content">
|
|
|
- <div>上传信息：张三 2025-12-03 17:30:30</div>
|
|
|
- <div>
|
|
|
+ <div class="info-name-time">上传信息：张三 2025-12-03 17:30:30</div>
|
|
|
+ <div class="info-table">
|
|
|
元素表：ZJ1001隧道总体质量检验表
|
|
|
- <div class="">
|
|
|
- <i @click="copyText('元素表：ZJ1001隧道总体质量检验表')" class="el-icon-document-copy"
|
|
|
- style="padding-left: 6px;color: #2550A2;cursor:pointer;"></i>
|
|
|
+ <div class="copy-icon">
|
|
|
+ <i @click="copyText('元素表：ZJ1001隧道总体质量检验表')" class="el-icon-document-copy" style="color: #2550A2;"></i>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="project">
|
|
|
- <div>使用项目：</div>
|
|
|
- <div></div>
|
|
|
+ <div class="info-project">
|
|
|
+ <div class="project-title">使用项目：</div>
|
|
|
+ <div class="project-content">
|
|
|
+ <div class="project-item" v-for="(item, index) in [
|
|
|
+ '甬台温高速公路（G15沈阳至海口国家高速公路）改扩建工程临海青岭至温岭大溪岭段',
|
|
|
+ 2,
|
|
|
+ '甬台温高速公路（G15沈阳至海口国家高速公路）改扩建工程临海青岭至温岭大溪岭段',
|
|
|
+ '甬台温高速公路（G15沈阳至海口国家高速公路）改扩建工程临海青岭至温岭大溪岭段',
|
|
|
+ '甬台温高速公路（G15沈阳至海口国家高速公路）改扩建工程临海青岭至温岭大溪岭段',
|
|
|
+ '甬台温高速公路（G15沈阳至海口国家高速公路）改扩建工程临海青岭至温岭大溪岭段',
|
|
|
+ '甬台温高速公路（G15沈阳至海口国家高速公路）改扩建工程临海青岭至温岭大溪岭段',
|
|
|
+ '甬台温高速公路（G15沈阳至海口国家高速公路）改扩建工程临海青岭至温岭大溪岭段',
|
|
|
+ '甬台温高速公路（G15沈阳至海口国家高速公路）改扩建工程临海青岭至温岭大溪岭段',
|
|
|
+ ]" :key="index">
|
|
|
+ {{ item }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
</div>
|
|
|
</div>
|
|
|
- </div> -->
|
|
|
- <!-- <div class="boxnei excel-box"> -->
|
|
|
- <div class="boxnei">
|
|
|
+ </div>
|
|
|
+ <div class="boxnei excel-box">
|
|
|
+ <!-- <div class="boxnei"> -->
|
|
|
<div class="marleft10" style="height:100%;
|
|
|
display: flex;flex-direction: column;">
|
|
|
<!-- 上传、删除、下载操作栏 -->
|
|
|
@@ -1256,6 +1270,8 @@ export default {
|
|
|
height: 100%;
|
|
|
box-sizing: border-box;
|
|
|
padding-bottom: 10px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
}
|
|
|
|
|
|
.text-hover {
|
|
|
@@ -1267,14 +1283,86 @@ export default {
|
|
|
background-color: #fff;
|
|
|
margin-bottom: 10px;
|
|
|
padding: 6px 10px;
|
|
|
- height: 60px;
|
|
|
+ max-height: 96px;
|
|
|
box-sizing: border-box;
|
|
|
border: 1px solid #ebeef5;
|
|
|
border-radius: 4px;
|
|
|
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.2);
|
|
|
+ font-size: 14px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+
|
|
|
+ .info-title {
|
|
|
+ font-weight: 600;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ padding-bottom: 6px;
|
|
|
+
|
|
|
+ &::before {
|
|
|
+ content: "";
|
|
|
+ display: block;
|
|
|
+ width: 3px;
|
|
|
+ height: 12px;
|
|
|
+ background-color: #3F9EFF;
|
|
|
+ margin-right: 8px;
|
|
|
+ border-radius: 4px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .info-content {
|
|
|
+ display: flex;
|
|
|
+ margin-left: 10px;
|
|
|
+ padding-top: 4px;
|
|
|
+ flex: 1;
|
|
|
+ overflow: hidden;
|
|
|
+
|
|
|
+ .info-name-time {
|
|
|
+ margin-right: 20px;
|
|
|
+ flex-shrink: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .info-table {
|
|
|
+ position: relative;
|
|
|
+ margin-right: 36px;
|
|
|
+ flex-shrink: 0;
|
|
|
+
|
|
|
+ .copy-icon {
|
|
|
+ position: absolute;
|
|
|
+ top: -8px;
|
|
|
+ right: -16px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .info-project {
|
|
|
+ display: flex;
|
|
|
+ height: 100%;
|
|
|
+
|
|
|
+ .project-title {
|
|
|
+ flex-shrink: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .project-content {
|
|
|
+ flex: 1;
|
|
|
+ overflow-y: auto;
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ gap: 6px 10px;
|
|
|
+ height: 100%;
|
|
|
+
|
|
|
+ .project-item {
|
|
|
+ color: #1F2937;
|
|
|
+ background-color: #DFDFDF;
|
|
|
+ border-radius: 15px;
|
|
|
+ padding: 4px 14px;
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
.excel-box {
|
|
|
- height: calc(100% - 70px) !important;
|
|
|
+ flex: 1 !important;
|
|
|
}
|
|
|
</style>
|
