3

tj

2025-05-22 14764dd7679369a650ad1d60be62aacc863755a1

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
<template>
    <view>
        <view class="school" :style="{
            'padding-top': (StatusBar) + 'px'
            , height: CustomBar + 'rpx', 'line-height': CustomBar + 'rpx'
        }"></view>
        <!-- 自定义导航栏 -->
        <view class="custom-navbar">
            <view class="navbar-content">
                <!-- 左侧图标 + 标题 -->
                <view class="left">
                    <u-icon name="/static/images/tabbar/line-Film.png" size="40" color="#fff" />
                    <text class="title">光影旅程</text>
                </view>
 
                <!-- 右侧按钮 -->
                <view class="right">
                    <!-- <u-button type="info" class="login-btn" size="mini" @click="goLogin">
                        <u-icon name="/static/images/tabbar/user.png" size="30" />
                        登录
                    </u-button> -->
                    <view class="login-view" @click="goLogin">
                        <u-icon name="/static/images/tabbar/user.png" size="30" />
                        <text class="login-text">登录</text>
                    </view>
 
 
                    <u-icon name="list" size="40" color="#fff" @click="openMenu" />
                </view>
            </view>
        </view>
    </view>
</template>
 
<script>
export default {
    data() {
        return {
            CustomBar: uni.getStorageSync('CustomBar'),
            StatusBar: uni.getStorageSync('StatusBar'),
            statusBarHeight: 20 // 默认值
        };
    },
    onLoad() {
        const sys = uni.getSystemSetting();
        this.statusBarHeight = sys.statusBarHeight || 20;
    },
    methods: {
        goLogin() {
            uni.navigateTo({
                url: '/pages/login/login'
            });
        },
        openMenu() {
            console.log('打开菜单');
        }
    }
};
</script>
 
<style scoped>
.page {
    background-color: #000;
    color: #fff;
    /* min-height: 100vh; */
}
 
.custom-navbar {
    background-color: #111;
    padding: 6rpx 20rpx;
}
 
.navbar-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 44px;
}
 
.left {
    display: flex;
    align-items: center;
}
 
.left .title {
    font-size: 17px;
    font-weight: bold;
    margin-left: 15rpx;
    color: #fff;
    letter-spacing: 4rpx;
}
 
.right {
    display: flex;
    align-items: center;
    gap: 16rpx;
}
 
.login-btn {
    background-color: #eee;
    color: #000;
    font-size: 14px;
    padding: 0 12rpx;
}
 
.login-view {
    display: flex;
    align-items: center;
    padding: 8rpx 16rpx;
    background-color: #fff;
    border-radius: 10rpx;
    color: #333;
}
 
.login-text {
    margin-left: 10rpx;
    font-size: 28rpx;
    font-weight: bold;
}
</style>