From 4076c14a8eac96cd716522f2cb15dcda0eb4fcef Mon Sep 17 00:00:00 2001
From: 马宇豪 <978517621@qq.com>
Date: 星期三, 10 四月 2024 08:37:53 +0800
Subject: [PATCH] 新修改
---
src/views/bigScreen/index.vue | 48 ++++++++++++++++++++++++++++++++++++------------
1 files changed, 36 insertions(+), 12 deletions(-)
diff --git a/src/views/bigScreen/index.vue b/src/views/bigScreen/index.vue
index f7775c5..7a985d5 100644
--- a/src/views/bigScreen/index.vue
+++ b/src/views/bigScreen/index.vue
@@ -1,39 +1,63 @@
<template>
- <div class="system-role-container">
- 6666666
+ <div class="screen-container">
+ <screen :isFull="isScreenfull" @clickFull="clickFullscreen"></screen>
</div>
</template>
<script lang="ts">
import { toRefs, reactive, onMounted, ref, defineComponent } from 'vue';
+import screen from './components/screen.vue'
+import screenfull from 'screenfull'
+import { ElMessage, ElMessageBox } from 'element-plus';
+
// 定义接口来定义对象的类型
-interface TableData {
-
-}
interface TableDataState {
-
+ isScreenfull: boolean
}
export default defineComponent({
name: 'bigScreen',
- components: { },
+ components: { screen },
setup() {
- const roleDialogRef = ref();
const state = reactive<TableDataState>({
-
+ isScreenfull: false,
});
// 页面加载时
onMounted(() => {
+ const baseSize = 38;
+ /* 设置 rem 函数 */
+ function setRem() {
+ const scale = document.documentElement.clientWidth / 1920; /* 当前页面宽度缩放比例，可根据自己需要修改 */
+ document.documentElement.style.fontSize = baseSize * Math.min(scale, 2) + "px";/* 设置页面根节点字体大小 */
+ console.log('切换尺寸>>',document.documentElement.style.fontSize)
+ }
+ setRem();/* 初始化 rem */
+ window.onresize = () => {
+ setRem();/* 改变窗口大小时重新设置 rem */
+ console.log('执行切换')
+ }
});
- return {
- ...toRefs(state)
+
+ const clickFullscreen =() => {
+ if(!screenfull.isEnabled){
+ ElMessage.error('浏览器不支持')
+ return false
+ }
+ screenfull.toggle();
+ }
+
+ return {
+ clickFullscreen,
+ ...toRefs(state)
};
}
});
</script>
<style lang="scss" scoped>
-
+.screen-container{
+ height: calc(100vh - 144px);
+}
</style>
\ No newline at end of file
--
Gitblit v1.9.2