|
|
@@ -12,6 +12,35 @@
|
|
|
<div class="d-flex jc-center body-box">
|
|
|
<dv-scroll-board class="dv-scr-board" :config="config" ref="scroll-board" />
|
|
|
</div>
|
|
|
+ <div class="photo-box">
|
|
|
+ <div>
|
|
|
+ <div>
|
|
|
+ <img src="" alt="">
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <p>姓名</p>
|
|
|
+ <p>组装人数</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <div>
|
|
|
+ <img src="" alt="">
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <p>姓名</p>
|
|
|
+ <p>组装人数</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <div>
|
|
|
+ <img src="" alt="">
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <p>姓名</p>
|
|
|
+ <p>组装人数</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
@@ -24,7 +53,7 @@ export default {
|
|
|
header: ['线别', '投入','产出','老化','不良','良率%','待维修','已维修'],
|
|
|
data: [
|
|
|
],
|
|
|
- rowNum: 7, //表格行数
|
|
|
+ rowNum: 1, //表格行数
|
|
|
headerHeight: 35,
|
|
|
headerBGC: '#0f1325', //表头
|
|
|
oddRowBGC: '#0f1325', //奇数行
|
|
|
@@ -118,7 +147,45 @@ $box-width: 640px;
|
|
|
overflow: hidden;
|
|
|
.dv-scr-board {
|
|
|
width: 600px;
|
|
|
- height: 340px;
|
|
|
+ height: 60px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .photo-box{
|
|
|
+ width: 100%;
|
|
|
+ height: 280px;
|
|
|
+ margin-top: 15px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+
|
|
|
+ >div{
|
|
|
+ width: 30%;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ >div:first-child{
|
|
|
+ flex: 1;
|
|
|
+ background-color: red;
|
|
|
+ border-radius: 5px 5px 0 0;
|
|
|
+ >img{
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ >div:nth-child(2){
|
|
|
+ width: 100%;
|
|
|
+ height: 60px;
|
|
|
+ text-align: center;
|
|
|
+ >p:first-child{
|
|
|
+ font-size: 22px;
|
|
|
+ color: #fff;
|
|
|
+ line-height: 40px;
|
|
|
+ }
|
|
|
+ >p{
|
|
|
+ line-height: 20px;
|
|
|
+ font-size: 18px;
|
|
|
+ color: #33cea0;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|