修改ui
This commit is contained in:
parent
fa75a2b89f
commit
8ecf281f08
@ -9,7 +9,7 @@
|
|||||||
<chart-container class="bar-chart-base">
|
<chart-container class="bar-chart-base">
|
||||||
<div class="legend">
|
<div class="legend">
|
||||||
<span v-for="item in legend" :key="item.label" class="legend-item"
|
<span v-for="item in legend" :key="item.label" class="legend-item"
|
||||||
:style="{ fontSize: isFullscreen ? '0.58vw' : '0.54vw' }">{{ item.label }}</span>
|
:style="{ fontSize: isFullscreen ? '0.72vw' : '0.7vw' }">{{ item.label }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div ref="chart" style="height:94%;width:100%"></div>
|
<div ref="chart" style="height:94%;width:100%"></div>
|
||||||
</chart-container>
|
</chart-container>
|
||||||
|
@ -73,6 +73,7 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
|
||||||
.copilot-container {
|
.copilot-container {
|
||||||
height: 0;
|
height: 0;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
@ -142,8 +143,8 @@ export default {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
// width: 16px;
|
// width: 16px;
|
||||||
// height: 16px;
|
// height: 16px;
|
||||||
width: 0.95vw;
|
width: 0.7vw;
|
||||||
height: 0.95vw;
|
height: 0.7vw;
|
||||||
}
|
}
|
||||||
|
|
||||||
.corner.tl {
|
.corner.tl {
|
||||||
|
@ -75,8 +75,8 @@ button {
|
|||||||
.copilot-btn::after {
|
.copilot-btn::after {
|
||||||
content: "";
|
content: "";
|
||||||
position: absolute;
|
position: absolute;
|
||||||
width: 16px;
|
width: 0.7vw;
|
||||||
height: 16px;
|
height: 0.7vw;
|
||||||
top: 0;
|
top: 0;
|
||||||
background: transparent;
|
background: transparent;
|
||||||
border-style: solid;
|
border-style: solid;
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
<!--
|
<!--
|
||||||
* @Author: zhp
|
* @Author: zhp
|
||||||
* @Date: 2024-07-09 15:15:00
|
* @Date: 2024-07-09 15:15:00
|
||||||
* @LastEditTime: 2024-07-09 15:36:49
|
* @LastEditTime: 2024-07-19 16:11:37
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
@ -73,6 +73,7 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
|
||||||
.copilot-container {
|
.copilot-container {
|
||||||
height: 0;
|
height: 0;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
@ -146,8 +147,8 @@ export default {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
// width: 16px;
|
// width: 16px;
|
||||||
// height: 16px;
|
// height: 16px;
|
||||||
width: 0.95vw;
|
width: 0.7vw;
|
||||||
height: 0.95vw;
|
height: 0.7vw;
|
||||||
}
|
}
|
||||||
|
|
||||||
.corner.tl {
|
.corner.tl {
|
||||||
|
@ -74,6 +74,7 @@ export default {
|
|||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
|
||||||
|
|
||||||
.copilot-container {
|
.copilot-container {
|
||||||
height: 0;
|
height: 0;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
@ -147,8 +148,8 @@ export default {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
// width: 16px;
|
// width: 16px;
|
||||||
// height: 16px;
|
// height: 16px;
|
||||||
width: 0.95vw;
|
width: 0.7vw;
|
||||||
height: 0.95vw;
|
height: 0.7vw;
|
||||||
}
|
}
|
||||||
|
|
||||||
.corner.tl {
|
.corner.tl {
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
<!--
|
<!--
|
||||||
* @Author: zhp
|
* @Author: zhp
|
||||||
* @Date: 2024-05-23 15:49:14
|
* @Date: 2024-05-23 15:49:14
|
||||||
* @LastEditTime: 2024-07-18 15:43:56
|
* @LastEditTime: 2024-07-19 16:08:27
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
@ -10,7 +10,7 @@
|
|||||||
<chart-container class="bar-chart-base">
|
<chart-container class="bar-chart-base">
|
||||||
<div class="legend">
|
<div class="legend">
|
||||||
<span v-for="item in legend" :key="item.label" class="legend-item"
|
<span v-for="item in legend" :key="item.label" class="legend-item"
|
||||||
:style="{ fontSize: isFullscreen ? '0.58vw' : '0.54vw' }">{{ item.label }}</span>
|
:style="{ fontSize: isFullscreen ? '0.72vw' : '0.7vw' }">{{ item.label }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div ref="ftoChart" style="height:94%;width:100%"></div>
|
<div ref="ftoChart" style="height:94%;width:100%"></div>
|
||||||
</chart-container>
|
</chart-container>
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
<!--
|
<!--
|
||||||
* @Author: zhp
|
* @Author: zhp
|
||||||
* @Date: 2024-06-05 09:43:51
|
* @Date: 2024-06-05 09:43:51
|
||||||
* @LastEditTime: 2024-07-09 15:35:19
|
* @LastEditTime: 2024-07-19 16:11:59
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
@ -73,6 +73,7 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
|
||||||
.copilot-container {
|
.copilot-container {
|
||||||
height: 0;
|
height: 0;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
@ -144,8 +145,8 @@ export default {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
// width: 16px;
|
// width: 16px;
|
||||||
// height: 16px;
|
// height: 16px;
|
||||||
width: 0.95vw;
|
width: 0.7vw;
|
||||||
height: 0.95vw;
|
height: 0.7vw;
|
||||||
}
|
}
|
||||||
|
|
||||||
.corner.tl {
|
.corner.tl {
|
||||||
|
@ -74,6 +74,7 @@ export default {
|
|||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
|
||||||
|
|
||||||
.copilot-container {
|
.copilot-container {
|
||||||
height: 0;
|
height: 0;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
@ -147,8 +148,8 @@ export default {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
// width: 16px;
|
// width: 16px;
|
||||||
// height: 16px;
|
// height: 16px;
|
||||||
width: 0.95vw;
|
width: 0.7vw;
|
||||||
height: 0.95vw;
|
height: 0.7vw;
|
||||||
}
|
}
|
||||||
|
|
||||||
.corner.tl {
|
.corner.tl {
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
<!--
|
<!--
|
||||||
* @Author: zhp
|
* @Author: zhp
|
||||||
* @Date: 2024-06-05 09:48:37
|
* @Date: 2024-06-05 09:48:37
|
||||||
* @LastEditTime: 2024-07-09 15:35:04
|
* @LastEditTime: 2024-07-19 16:14:07
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
@ -100,6 +100,7 @@ export default {
|
|||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
|
||||||
|
|
||||||
.copilot-container {
|
.copilot-container {
|
||||||
height: 0;
|
height: 0;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
@ -171,8 +172,8 @@ export default {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
// width: 16px;
|
// width: 16px;
|
||||||
// height: 16px;
|
// height: 16px;
|
||||||
width: 0.95vw;
|
width: 0.7vw;
|
||||||
height: 0.95vw;
|
height: 0.7vw;
|
||||||
}
|
}
|
||||||
|
|
||||||
.corner.tl {
|
.corner.tl {
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
<!--
|
<!--
|
||||||
* @Author: zhp
|
* @Author: zhp
|
||||||
* @Date: 2024-05-07 13:22:43
|
* @Date: 2024-05-07 13:22:43
|
||||||
* @LastEditTime: 2024-07-19 15:26:53
|
* @LastEditTime: 2024-07-19 16:10:10
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
@ -9,7 +9,7 @@
|
|||||||
<chart-container class="bar-chart-base">
|
<chart-container class="bar-chart-base">
|
||||||
<div class="legend">
|
<div class="legend">
|
||||||
<span v-for="(item,index) in legend" :key="index" class="legend-item"
|
<span v-for="(item,index) in legend" :key="index" class="legend-item"
|
||||||
:style="{ fontSize: isFullscreen ? '0.58vw' : '0.54vw' }">{{ item.label }}</span>
|
:style="{ fontSize: isFullscreen ? '0.72vw' : '0.7vw' }">{{ item.label }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div ref="oeeChart" style="height:94%;width:100%"></div>
|
<div ref="oeeChart" style="height:94%;width:100%"></div>
|
||||||
</chart-container>
|
</chart-container>
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
<!--
|
<!--
|
||||||
* @Author: zhp
|
* @Author: zhp
|
||||||
* @Date: 2024-05-23 15:50:44
|
* @Date: 2024-05-23 15:50:44
|
||||||
* @LastEditTime: 2024-07-19 15:29:15
|
* @LastEditTime: 2024-07-19 16:10:19
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
@ -9,7 +9,7 @@
|
|||||||
<chart-container class="bar-chart-base">
|
<chart-container class="bar-chart-base">
|
||||||
<div class="legend">
|
<div class="legend">
|
||||||
<span v-for="(item,index) in legend" :key="index" class="legend-item"
|
<span v-for="(item,index) in legend" :key="index" class="legend-item"
|
||||||
:style="{ fontSize: isFullscreen ? '0.58vw' : '0.54vw' }">{{ item.label }}</span>
|
:style="{ fontSize: isFullscreen ? '0.72vw' : '0.7vw' }">{{ item.label }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div ref="oeeChart" style="height:94%;width:100%"></div>
|
<div ref="oeeChart" style="height:94%;width:100%"></div>
|
||||||
</chart-container>
|
</chart-container>
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
<!--
|
<!--
|
||||||
* @Author: zhp
|
* @Author: zhp
|
||||||
* @Date: 2024-06-05 09:36:07
|
* @Date: 2024-06-05 09:36:07
|
||||||
* @LastEditTime: 2024-07-09 16:54:24
|
* @LastEditTime: 2024-07-19 16:16:02
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
@ -81,6 +81,7 @@ export default {
|
|||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
|
||||||
|
|
||||||
.copilot-container {
|
.copilot-container {
|
||||||
height: 0;
|
height: 0;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
@ -152,8 +153,8 @@ export default {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
// width: 16px;
|
// width: 16px;
|
||||||
// height: 16px;
|
// height: 16px;
|
||||||
width: 0.95vw;
|
width: 0.7vw;
|
||||||
height: 0.95vw;
|
height: 0.7vw;
|
||||||
}
|
}
|
||||||
|
|
||||||
.corner.tl {
|
.corner.tl {
|
||||||
|
@ -79,6 +79,7 @@ export default {
|
|||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
|
||||||
|
|
||||||
.copilot-container {
|
.copilot-container {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
@ -147,8 +148,8 @@ export default {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
// width: 16px;
|
// width: 16px;
|
||||||
// height: 16px;
|
// height: 16px;
|
||||||
width: 0.95vw;
|
width: 0.7vw;
|
||||||
height: 0.95vw;
|
height: 0.7vw;
|
||||||
}
|
}
|
||||||
|
|
||||||
.corner.tl {
|
.corner.tl {
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
<!--
|
<!--
|
||||||
* @Author: zhp
|
* @Author: zhp
|
||||||
* @Date: 2024-05-20 13:32:59
|
* @Date: 2024-05-20 13:32:59
|
||||||
* @LastEditTime: 2024-07-18 15:27:38
|
* @LastEditTime: 2024-07-19 16:05:46
|
||||||
* @LastEditors: zhp
|
* @LastEditors: zhp
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
@ -306,6 +306,7 @@ function calculateItems(period, valueTuple, than) {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
|
||||||
.double-ring-chart {
|
.double-ring-chart {
|
||||||
height: 98%;
|
height: 98%;
|
||||||
display: flex;
|
display: flex;
|
||||||
@ -331,6 +332,7 @@ function calculateItems(period, valueTuple, than) {
|
|||||||
|
|
||||||
.legend-item {
|
.legend-item {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
/* font-size:16px; */
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: flex-start;
|
align-items: flex-start;
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user