merge

游雁

2023-11-23 c408a8847d4257f7a45cac54b512a791f450b3f4

 web-pages/src/views/app/index.vue

New file
@@ -0,0 +1,66 @@
<template>
    <a-config-provider :locale="locale">
        <div
            class="app-container"
        >
            <div class="app-content" ref="app-content">
                <ui-scrollbar class="app-content-scrollbar" style="height: 100%;" :childOverWidth="false" :wrapStyle="[{ overflowX: 'hidden' }]">
                    <router-view :style="{ 'min-height': contentMinHeight + 'px' }" :contentMinHeight=" contentMinHeight" />
                </ui-scrollbar>
            </div>
        </div>
    </a-config-provider>
</template>

<script>
    import zhCN from 'ant-design-vue/lib/locale-provider/zh_CN'
    export default {
        name: 'app',
        components: {},
        props: { },
        data () {
            return {
                locale: zhCN,
                contentMinHeight: 0
            }
        },
        computed: {},
        beforeCreate () {
            const setHtmlFontSize = function () {
                const deviceWidth =
                    document.documentElement.clientWidth > 1280
                        ? document.documentElement.clientWidth <= 1920
                            ? document.documentElement.clientWidth
                            : 1920
                        : 1280
                document.getElementsByTagName('html')[0].style.cssText = 'font-size:' + deviceWidth / 100 + 'px !important'
            }
            let timerId
            if (window.addEventListener) {
                window.addEventListener(
                    'resize',
                    function () {
                        if (timerId) {
                            window.clearTimeout(timerId)
                        }
                        timerId = window.setTimeout(function () {
                            this.getContentMinHeight()
                        }, 300)
                    },
                    false
                )
            }
            setHtmlFontSize()
        },
        created () {},
        mounted () {
            this.getContentMinHeight()
        },
        methods: {
            getContentMinHeight () {
                this.contentMinHeight = this.$refs['app-content'].clientHeight
            }
        }
    }
</script>
<style src="./assets/css/index.scss" lang="scss"></style>