|
@@ -77,13 +77,15 @@ |
|
|
<div class="row-3"> |
|
|
<div class="row-3"> |
|
|
<!-- 设备备件管理 --> |
|
|
<!-- 设备备件管理 --> |
|
|
<techy-container :title="'设备备件管理'" :icon="equipmentOrderSVG"> |
|
|
<techy-container :title="'设备备件管理'" :icon="equipmentOrderSVG"> |
|
|
<techy-table |
|
|
|
|
|
:page="1" |
|
|
|
|
|
:limit="7" |
|
|
|
|
|
:show-index="false" |
|
|
|
|
|
:table-config="sparepartsProps" |
|
|
|
|
|
:table-data="sparepartsDatalist" |
|
|
|
|
|
/> |
|
|
|
|
|
|
|
|
<div class="table-wrapper"> |
|
|
|
|
|
<techy-table |
|
|
|
|
|
:page="1" |
|
|
|
|
|
:limit="7" |
|
|
|
|
|
:show-index="false" |
|
|
|
|
|
: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: 24px; */ |
|
|
|
|
|
padding: calc(100vw / 1920 * 24); |
|
|
|
|
|
/* display: grid; |
|
|
|
|
|
grid-template-columns: 3fr 1fr; */ |
|
|
|
|
|
|
|
|
padding: calc(24px * var(--beilv)); |
|
|
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); |
|
|
|
|
|
flex: 1 3; |
|
|
|
|
|
|
|
|
/* height: calc(100% - 28px); */ |
|
|
|
|
|
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; |
|
|
|
|
|
max-width: 25%; |
|
|
|
|
|
height: calc(100% - 28px); |
|
|
|
|
|
|
|
|
width: 25%; |
|
|
|
|
|
flex: 0; |
|
|
|
|
|
/* 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 { |
|
|