开发公用header组件，开发询盘类型页面 10%

src/assets/css/common.scss

@@ -8,7 +8,7 @@ button {
 }
 .pages {
     min-height: 100vh;
-	background: linear-gradient(to top, #e4ecff 40%,#fff 60%);
+	background: linear-gradient(to bottom, #e4ecff 40%,#f3f5fb 60%);
 	font-size: 26rpx;
 }
 .tabbar-pages {
@@ -18,7 +18,7 @@ button {
 	/* #ifdef APP */
 	min-height: 100vh;
 	/* #endif */
-	background: linear-gradient(to top, #e4ecff 40%,#fff 60%);
+	background: linear-gradient(to bottom, #e4ecff 40%,#fff 60%);
 	font-size: 26rpx;
 }
 .text-ellipsis {

src/components/custom-header.vue

@@ -0,0 +1,25 @@
+<template>
+    <view class="custom-header">
+    	{{props.title}}
+    </view>
+</template>
+
+<script setup>
+	import { ref } from 'vue';
+	
+	const props = defineProps({
+		title: String
+	})
+	
+</script>
+
+<style lang="scss" scoped>
+.custom-header {
+	width: 100%;
+	position: fixed;
+	top: var(--status-bar-height);
+	text-align: center;
+	color: #0d0e0e;
+	font-size: 32rpx;
+}
+</style>

src/main.js

@@ -5,6 +5,7 @@ import { createI18n } from 'vue-i18n';
 import zh from './locale/zh.json';
 import en from './locale/en.json';
 import ConfirmPopup from '@/components/comfirm-popup.vue'; // 全局统一的操作弹窗
+import CustomHeader from "@/components/custom-header.vue";
 
 uni.$showTost = function (title='加载失败！',duration=1500,mask=false) {
 	// 变成异步代码，处理一些特殊页面 必须等待消息提示结束后在做操作
@@ -38,6 +39,7 @@ export function createApp() {
 	app.use(i18n)
 	app.use(createPinia());
 	app.component('ConfirmPopup', ConfirmPopup)
+	app.component('CustomHeader', CustomHeader)
 	return {
 		app,
 	};

src/pages/inquiry/index.vue

@@ -1,6 +1,10 @@
 <template>
     <view class="pages">
-    	询盘栏目
+    	<CustomHeader title="Contact Us"></CustomHeader>
+		
+		<view class="company-information">
+			
+		</view>
     </view>
 </template>
 
@@ -8,8 +12,11 @@
 	import { onLoad } from '@dcloudio/uni-app';
 	import { ref } from 'vue';
 	
+	console.log(uni.getSystemInfoSync())
 </script>
 
 <style lang="scss" scoped>
-	
+.pages {
+	padding: 25rpx;
+}
 </style>