mirror of
https://github.com/ArvinLovegood/go-stock.git
synced 2025-07-19 00:00:09 +08:00
refactor(frontend):优化页面布局和滚动条
- 在 App.vue 中添加全局滚动条样式- 调整 fund.vue 和 stock.vue 中固定元素的位置和宽度 - 在 App.vue 中使用 n-scrollbar 组件包裹 RouterView
This commit is contained in:
parent
e5c4076278
commit
c28151320c
@ -8,7 +8,7 @@ import {
|
||||
WindowSetPosition,
|
||||
WindowUnfullscreen
|
||||
} from '../wailsjs/runtime'
|
||||
import {h, ref} from "vue";
|
||||
import {h, onMounted, ref} from "vue";
|
||||
import { RouterLink } from 'vue-router'
|
||||
import {darkTheme, NGradientText, NIcon, NText,} from 'naive-ui'
|
||||
import {
|
||||
@ -17,6 +17,8 @@ import {
|
||||
ExpandOutline,
|
||||
PowerOutline, LogoGithub, MoveOutline, WalletOutline, StarOutline, AlarmOutline, SparklesOutline,
|
||||
} from '@vicons/ionicons5'
|
||||
|
||||
const contentStyle = ref("")
|
||||
const content = ref('数据来源于网络,仅供参考;投资有风险,入市需谨慎')
|
||||
const isFullscreen = ref(false)
|
||||
const activeKey = ref('stock')
|
||||
@ -194,11 +196,16 @@ window.onerror = function (msg, source, lineno, colno, error) {
|
||||
});
|
||||
return true;
|
||||
};
|
||||
|
||||
onMounted(()=>{
|
||||
contentStyle.value="max-height: calc(90vh);overflow: hidden"
|
||||
})
|
||||
|
||||
</script>
|
||||
<template>
|
||||
|
||||
|
||||
<n-config-provider :theme="darkTheme" ref="containerRef">
|
||||
<n-config-provider :theme="darkTheme" ref="containerRef" >
|
||||
<n-message-provider >
|
||||
<n-notification-provider>
|
||||
<n-modal-provider>
|
||||
@ -218,17 +225,25 @@ window.onerror = function (msg, source, lineno, colno, error) {
|
||||
>
|
||||
<n-flex justify="center">
|
||||
<n-grid x-gap="12" :cols="1">
|
||||
<!--
|
||||
<n-gi style="position: relative;top:1px;z-index: 19;width: 100%" v-if="telegraph.length>0">
|
||||
<n-marquee :speed="120" >
|
||||
|
||||
</n-gi>
|
||||
-->
|
||||
|
||||
<n-gi>
|
||||
<n-marquee :speed="100" style="position: relative;top:0;z-index: 19;width: 100%" v-if="telegraph.length>0">
|
||||
<n-tag type="warning" v-for="item in telegraph" style="margin-right: 10px">
|
||||
{{item}}
|
||||
</n-tag>
|
||||
<!-- <n-text type="warning"> {{telegraph[0]}}</n-text>-->
|
||||
<!-- <n-text type="warning"> {{telegraph[0]}}</n-text>-->
|
||||
</n-marquee>
|
||||
</n-gi>
|
||||
<n-gi style="padding-bottom: 70px;padding-top: 5px">
|
||||
<n-scrollbar :style="contentStyle">
|
||||
<RouterView />
|
||||
</n-scrollbar>
|
||||
</n-gi>
|
||||
|
||||
|
||||
<n-gi style="position: fixed;bottom:0;z-index: 9;width: 100%">
|
||||
<n-card size="small">
|
||||
<n-menu style="font-size: 18px;"
|
||||
@ -240,7 +255,6 @@ window.onerror = function (msg, source, lineno, colno, error) {
|
||||
</n-card>
|
||||
</n-gi>
|
||||
</n-grid>
|
||||
|
||||
</n-flex>
|
||||
</n-watermark>
|
||||
</n-dialog-provider>
|
||||
|
@ -229,7 +229,7 @@ function blinkBorder(findId){
|
||||
<n-image :src="data.fenshiURL" />
|
||||
</n-modal>
|
||||
|
||||
<div style="position: fixed;bottom: 18px;right:0;z-index: 10;width: 480px">
|
||||
<div style="position: fixed;bottom: 18px;right:2px;z-index: 10;width: 400px">
|
||||
<n-input-group >
|
||||
<n-auto-complete v-model:value="data.name"
|
||||
:input-props="{
|
||||
|
@ -876,7 +876,7 @@ function share(code,name){
|
||||
</n-card >
|
||||
</n-gi>
|
||||
</n-grid>
|
||||
<div style="position: fixed;bottom: 18px;right:0;z-index: 10;width: 460px">
|
||||
<div style="position: fixed;bottom: 18px;right:2px;z-index: 10;width: 400px">
|
||||
<!-- <n-card :bordered="false">-->
|
||||
<n-input-group >
|
||||
<!-- <n-button type="error" @click="addBTN=!addBTN" > <n-icon :component="Search"/> <n-text v-if="addBTN">隐藏</n-text></n-button>-->
|
||||
|
Loading…
x
Reference in New Issue
Block a user