deepChartVueApp/pages/customStockList/customStockList.vue

<!-- 自选股页面 -->
<template>
	<view class="container">
		<!-- 自定义导航栏 -->
		<view class="custom-navbar">
			<view class="navbar-content">
				<view class="navbar-left">
					<view class="back-btn" @click="goBack">
						<image class="back-icon" src="https://d31zlh4on95l9h.cloudfront.net/images/e5c501fd23303533622fadce8dedd6a0.png" mode="aspectFit"></image>
					</view>
				</view>
				<view class="navbar-center">
					<text class="navbar-title">我的自选</text>
				</view>
				<view class="navbar-right">
					<image 
						class="navbar-btn" 
						src="https://d31zlh4on95l9h.cloudfront.net/images/ba5c8a2eda065274e868bcd9b2d7d914.png"
						@click="onFirstButtonClick"
						mode="aspectFit"
					></image>
					<image 
						class="navbar-btn" 
						src="https://d31zlh4on95l9h.cloudfront.net/images/a4ae8952aeae90dac6d2b4c221c65fa9.png"
						@click="onSecondButtonClick"
						mode="aspectFit"
					></image>
				</view>
			</view>
		</view>
		
		<!-- 页面内容 -->
		<view class="page-content">
			
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			// 返回上一页
			goBack() {
				uni.navigateBack()
			},
			
			// 第一个按钮点击事件
			onFirstButtonClick() {
				console.log('第一个按钮被点击')
				// 这里可以添加具体的功能逻辑
			},
			
			// 第二个按钮点击事件
			onSecondButtonClick() {
				console.log('第二个按钮被点击')
				// 这里可以添加具体的功能逻辑
			}
		}
	}
</script>

<style>
.container {
	width: 100%;
	height: 100vh;
	background-color: #f5f5f5;
}

/* 自定义导航栏 */
.custom-navbar {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 999;
	background-color: #ffffff;
	border-bottom: 1px solid #e5e5e5;
}

.navbar-content {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 44px;
	padding: 0 15px;
	/* 适配状态栏高度 */
	padding-top: var(--status-bar-height, 20px);
	min-height: calc(44px + var(--status-bar-height, 20px));
}

.navbar-left {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
}

.back-btn {
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.back-icon {
	width: 24px;
	height: 24px;
}

.navbar-center {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
}

.navbar-title {
	font-size: 18px;
	font-weight: 500;
	color: #333333;
}

.navbar-right {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	gap: 10px;
}

.navbar-btn {
	width: 24px;
	height: 24px;
}

/* 页面内容 */
.page-content {
	padding-top: calc(44px + var(--status-bar-height, 20px) + 1px);
	min-height: calc(100vh - 44px - var(--status-bar-height, 20px) - 1px);
}
</style>