update 设备管理布局
This commit is contained in:
parent
96e407d531
commit
472ac0a19f
@ -77,13 +77,15 @@
|
|||||||
<div class="row-3">
|
<div class="row-3">
|
||||||
<!-- 设备备件管理 -->
|
<!-- 设备备件管理 -->
|
||||||
<techy-container :title="'设备备件管理'" :icon="equipmentOrderSVG">
|
<techy-container :title="'设备备件管理'" :icon="equipmentOrderSVG">
|
||||||
<techy-table
|
<div class="table-wrapper">
|
||||||
:page="1"
|
<techy-table
|
||||||
:limit="7"
|
:page="1"
|
||||||
:show-index="false"
|
:limit="7"
|
||||||
:table-config="sparepartsProps"
|
:show-index="false"
|
||||||
:table-data="sparepartsDatalist"
|
:table-config="sparepartsProps"
|
||||||
/>
|
:table-data="sparepartsDatalist"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</techy-container>
|
</techy-container>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -292,26 +294,14 @@ export default {
|
|||||||
sparepartsProps,
|
sparepartsProps,
|
||||||
sparepartsDatalist,
|
sparepartsDatalist,
|
||||||
rightSideProps,
|
rightSideProps,
|
||||||
rightSideDatalist,
|
rightSideDatalist
|
||||||
// refreshKey: 0
|
// refreshKey: 0
|
||||||
scale: 1
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
...mapGetters(['sidebar'])
|
...mapGetters(['sidebar'])
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
this.$nextTick(() => {
|
|
||||||
this.scale = this.$refs['cockpit-container-equipment'].offsetWidth / 1920
|
|
||||||
this.$refs['cockpit-container-equipment'].style.setProperty('--scale', this.scale)
|
|
||||||
|
|
||||||
this.$watch(() => this.$refs['cockpit-container-equipment'].offsetWidth, function(v, o) {
|
|
||||||
console.log('resize ... ref..')
|
|
||||||
this.scale = this.$refs['cockpit-container-equipment'].offsetWidth / 1920
|
|
||||||
this.$refs['cockpit-container-equipment'].style.setProperty('--scale', this.scale)
|
|
||||||
})
|
|
||||||
})
|
|
||||||
},
|
},
|
||||||
|
mounted() {},
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
changeFullScreen() {
|
changeFullScreen() {
|
||||||
@ -342,8 +332,6 @@ export default {
|
|||||||
|
|
||||||
.visual-container {
|
.visual-container {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
min-width: 1280px;
|
|
||||||
/* height: calc(100vh - 128px); */
|
|
||||||
background: url('./assets/bg.png') no-repeat;
|
background: url('./assets/bg.png') no-repeat;
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
@ -353,27 +341,28 @@ export default {
|
|||||||
.techy-body {
|
.techy-body {
|
||||||
height: calc(100vh - 64px);
|
height: calc(100vh - 64px);
|
||||||
width: 100%;
|
width: 100%;
|
||||||
/* overflow: hidden; */
|
padding: calc(24px * var(--beilv));
|
||||||
/* padding: 24px; */
|
|
||||||
padding: calc(100vw / 1920 * 24);
|
|
||||||
/* display: grid;
|
|
||||||
grid-template-columns: 3fr 1fr; */
|
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: calc(100vw / 1920 * 16);
|
gap: calc(16px * var(--beilv));
|
||||||
}
|
}
|
||||||
|
|
||||||
.tech-body__col-1 {
|
.tech-body__col-1 {
|
||||||
height: calc(100% - 28px);
|
/* height: calc(100% - 28px); */
|
||||||
flex: 1 3;
|
height: 100%;
|
||||||
|
flex: 1;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: calc(100vw / 1920 * 16);
|
gap: calc(16px * var(--beilv));
|
||||||
|
width: 70%;
|
||||||
|
background-color: #aaaa;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tech-body__col-2 {
|
.tech-body__col-2 {
|
||||||
flex: 1 1;
|
width: 25%;
|
||||||
max-width: 25%;
|
flex: 0;
|
||||||
height: calc(100% - 28px);
|
/* height: calc(100% - 28px); */
|
||||||
|
height: 100%;
|
||||||
|
background-color: #cccc;
|
||||||
}
|
}
|
||||||
|
|
||||||
.techy-container__inner {
|
.techy-container__inner {
|
||||||
@ -388,18 +377,40 @@ export default {
|
|||||||
flex: 1 1;
|
flex: 1 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.row-1,
|
||||||
|
.row-2,
|
||||||
|
.row-3 {
|
||||||
|
height: 30%;
|
||||||
|
}
|
||||||
|
|
||||||
.row-1 {
|
.row-1 {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: calc(100vw / 1920 * 16);
|
gap: calc(100vw / 1920 * 16);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.row-2 {
|
||||||
|
flex: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.row-3 {
|
||||||
|
flex: 0;
|
||||||
|
}
|
||||||
|
|
||||||
.equipment-exception {
|
.equipment-exception {
|
||||||
flex: 3 1;
|
min-width: 20%;
|
||||||
|
flex: 3;
|
||||||
}
|
}
|
||||||
|
|
||||||
.equipment-alarm {
|
.equipment-alarm {
|
||||||
flex: 2 1;
|
min-width: 20%;
|
||||||
|
flex: 2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table-wrapper {
|
||||||
|
height: calc(100% - 3vh);
|
||||||
|
overflow: scroll;
|
||||||
|
background-color: #f003;
|
||||||
}
|
}
|
||||||
|
|
||||||
.grid {
|
.grid {
|
||||||
|
Loading…
Reference in New Issue
Block a user