lingling
/
media_player_client
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

调整布局

This commit is contained in:
fangxiang 2021-08-09 15:05:14 +08:00
parent e64ac15462
commit b0871b3af9
3 changed files with 44 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/App.vue
View File

@ -18,6 +18,8 @@ export default defineComponent({
window.onresize = (evt: any) =>
EventBus.getInstance().emit(EventNamesDefine.WindowResize, evt);
document.body.classList.add("overflow-hidden");
return {};
},
});

31
src/layouts/MainLayout.vue
View File

@ -5,19 +5,24 @@
<top-tool-bar />
</q-header>
<!-- drawer -->
<q-drawer
v-if="landspace"
v-model="data.show_left_drawer"
side="left"
bordered
>
<left-tool-bar />
</q-drawer>
<!-- page -->
<q-page-container>
<router-view />
<q-page-container class="col">
<div class="row">
<!-- left -->
<div v-if="landspace" class="col-2" style="border: 1px solid #bdbdbd">
<left-tool-bar />
</div>
<!-- cener content -->
<div class="col q-ma-sm">
<router-view />
</div>
<!-- left -->
<div v-if="landspace" class="col-2" style="border: 1px solid #bdbdbd">
<left-tool-bar />
</div>
</div>
</q-page-container>
<!-- fotter -->
@ -29,7 +34,7 @@
>
<div class="text-center">SX</div>
</q-footer>
<q-footer v-else elevated class="bg-white text-black" style="height: 40vh">
<q-footer v-else elevated class="bg-white text-black" style="height: 35vh">
<left-tool-bar />
</q-footer>
</q-layout>

73
src/pages/WallPage.vue
View File

@ -177,10 +177,11 @@ const _initialize = async (options: _OptionsType) => {
await Common.waitFor(100);
}
_initSignalSourceTree(options).then(() => {
await _getApplicationConfig(options);
await _initSignalSourceTree(options).then(() => {
_getWindows(options);
});
_getApplicationConfig(options);
}
};
@ -191,10 +192,6 @@ export default defineComponent({
setup() {
const $store = useStore();
const $t = useI18n();
_initialize({
$t,
$store,
});
const windows = computed({
get: () => $store.state.windows,
@ -213,31 +210,8 @@ export default defineComponent({
const wall: Ref<HTMLElement | null> = ref(null);
const item_witdh = computed({
get: () => {
if (wall.value && wall.value.parentElement) {
return wall.value.parentElement.offsetWidth / wall_cols.value;
}
return 0;
},
set: (val) => $store.commit("setWallCol", val),
});
const item_height = computed({
get: () => {
if (wall.value && wall.value.parentElement) {
const wv_scaler =
$store.state.device_screen_width /
$store.state.device_screen_height;
return (
wall.value.parentElement.offsetHeight / wv_scaler / wall_rows.value
);
}
return 0;
},
set: (val) => $store.commit("setWallCol", val),
});
let item_witdh = ref(0);
const item_height = ref(0);
const wall_width_scaler = ref(0);
const wall_height_scaler = ref(0);
@ -256,8 +230,22 @@ export default defineComponent({
}
};
const calcWallItemWH = () => {
item_witdh.value =
wall?.value?.parentElement?.offsetWidth ?? 0 / wall_cols.value;
if (wall.value && wall.value.parentElement) {
const wv_scaler =
$store.state.device_screen_width / $store.state.device_screen_height;
item_height.value =
wall.value.parentElement.offsetWidth / wv_scaler / wall_rows.value;
} else {
item_height.value = 0;
}
};
EventBus.getInstance().on(EventNamesDefine.WindowResize, () => {
calcWallVWScaler();
calcWallItemWH();
});
interface _ResponseMessage {
@ -348,23 +336,6 @@ export default defineComponent({
(item) => item.window_id == temp.window_id
);
if (window) {
// $store.commit("setWindowPropertys", [
// {
// window,
// property_name: "playing",
// value: temp.playing,
// },
// {
// window,
// property_name: "focus",
// value: temp.focus,
// },
// {
// window,
// property_name: "muted",
// value: temp.muted,
// },
// ]);
window.window_state; //
$store.commit("setWindowProperty", {
window,
@ -388,7 +359,11 @@ export default defineComponent({
}
);
onMounted(() => {
_initialize({
$t,
$store,
}).then(() => {
calcWallItemWH();
calcWallVWScaler();
});