add electronic file page
This commit is contained in:
parent
fcdfc2b6c8
commit
077ed3fdc1
|
@ -0,0 +1,101 @@
|
|||
<template>
|
||||
<div id="electronic-file">
|
||||
<ef-header />
|
||||
|
||||
<border-box-1 class="content">
|
||||
<border-box-3 class="left">
|
||||
this is left
|
||||
</border-box-3>
|
||||
|
||||
<div class="right">
|
||||
<div class="right-top">
|
||||
<border-box-3 class="right-top-left">
|
||||
this is right top left
|
||||
</border-box-3>
|
||||
|
||||
<div class="right-top-right">
|
||||
<border-box-3 class="right-top-right-one">
|
||||
this is right top right one
|
||||
</border-box-3>
|
||||
|
||||
<border-box-4 class="right-top-right-two">
|
||||
this is right top right two
|
||||
</border-box-4>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<border-box-4 class="right-bottom">
|
||||
this is right bottom
|
||||
</border-box-4>
|
||||
|
||||
</div>
|
||||
|
||||
</border-box-1>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import efHeader from './header'
|
||||
|
||||
export default {
|
||||
name: 'ElectronicFile',
|
||||
components: {
|
||||
efHeader
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
#electronic-file {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
.content {
|
||||
height: calc(~"100% - 80px");
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.left {
|
||||
width: 22%;
|
||||
}
|
||||
|
||||
.right {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.right-top {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: 65%;
|
||||
}
|
||||
|
||||
.right-top-left {
|
||||
width: 65%;
|
||||
}
|
||||
|
||||
.right-top-right {
|
||||
flex: 1;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.right-top-right-one, .right-top-right-two {
|
||||
height: 50%;
|
||||
}
|
||||
|
||||
.right-top-right-one {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.right-top-right-two {
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.right-bottom {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
</style>
|
Loading…
Reference in New Issue