目录

App.vue

@@ -17,4 +17,5 @@
 <style lang="scss">
 	/*每个页面公共css */
 	@import "@/uni_modules/uview-plus/index.scss";
+	@import '@/static/css/app.scss'
 </style>

main.js

@@ -1,6 +1,7 @@
 import App from './App'
 import uviewPlus from '@/uni_modules/uview-plus'
 import request from './config/request.js'
+import { goPage } from '@/utils/utils.js'
 // // #ifndef VUE3
 // import Vue from 'vue'
 // import './uni.promisify.adaptor'
@@ -16,6 +17,7 @@ import request from './config/request.js'
 import { createSSRApp } from 'vue'
 export function createApp() {
   const app = createSSRApp(App)
+  app.config.globalProperties.$goPage = goPage
   app.use(uviewPlus)
   request(app)
   return {

pages.json

@@ -3,13 +3,38 @@
 		{
 			"path": "pages/index/index",
 			"style": {
-				"navigationBarTitleText": "uni-app"
+				"navigationBarTitleText": "",
+				"navigationStyle": "custom"
 			}
 		}
 	],
+	"subPackages": [
+		{
+			"root": "pages/exercises",
+			"pages": [
+				{
+					"path": "chapter/chapter",
+					"style": {
+						"navigationBarTitleText": "章节练习",
+						"enablePullDownRefresh": false,
+						"backgroundTextStyle": "dark" 
+					}
+				},
+				{
+					"path": "brushQuestions/brushQuestions",
+					"style": {
+						"navigationBarTitleText": "刷题",
+						"enablePullDownRefresh": false,
+						"backgroundTextStyle": "dark" ,
+						"navigationStyle": "custom"
+					}
+				}
+			]
+		}
+	],
 	"globalStyle": {
 		"navigationBarTextStyle": "black",
-		"navigationBarTitleText": "uni-app",
+		"navigationBarTitleText": "习题题库",
 		"navigationBarBackgroundColor": "#F8F8F8",
 		"backgroundColor": "#F8F8F8"
 	},

pages/exercises/brushQuestions/brushQuestions.vue

@@ -0,0 +1,25 @@
+<template>
+	<view class="content">
+		<up-navbar leftText=" " title="" :safeAreaInsetTop="false" :autoBack="true">
+			<template #center>
+				<view class="u-nav-slot flex">
+					<view class="btn">答题模式</view>
+					<view class="btn">背题模式</view>
+				</view>
+			</template>
+		</up-navbar>
+	</view>
+</template>
+
+<script>
+	// 观到一念，不要在注重这些行为的表达，觉得我应该这样做好一点那样做好一点，其实心里怎么想的才是最重要的
+	// 当你接纳允许的时候自动又想起来了，
+</script>
+
+<style lang="scss" scoped>
+	.u-nav-slot {
+		.btn {
+			
+		}
+	}
+</style>

pages/exercises/chapter/chapter.vue

@@ -0,0 +1,81 @@
+<template>
+	<view class="content">
+		<view class="ul padding">
+			<view class="li" v-for="(item,index) in 7" :key="index" @click="goPage(index)">
+				<view class="num" :style="{background: colorArr[index]}">{{index+1}}</view>
+				<view class="rightTxt">
+					<view class="h1">安全行车常识</view>
+					<view class="flex">
+						<view class="proccess">
+							<up-line-progress :percentage="80" height="8" activeColor="#3776FF" :showText="false"></up-line-progress>
+						</view>
+						<view class="rate">60/260</view>
+						<view class="rate">正确率 100%</view>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				colorArr: ['#3776FF', '#64C76C', '#8484FF', '#F05C1C', '#FDD650', '#6FD568', '#52C1D0']
+			}
+		},
+		methods: {
+			goPage(index) {
+				console.log(index)
+				this.$goPage('/pages/exercises/brushQuestions/brushQuestions')
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		width: 100%;
+	  .ul {
+		  width: 100%;
+	    .li {
+			width: 100%;
+			display: flex;
+			padding: 30rpx 0;
+			border-bottom: 1px solid #F4F4F4;
+			.num {
+				height: 34rpx;
+				width: 34rpx;
+				// padding: 10rpx 10rpx;
+				text-align: center;
+				background: #3776FF;
+				border-radius: 50%;
+				font-size: 24rpx;
+				color: #fff;
+				line-height: 34rpx;
+				margin-top: 8rpx;
+			}
+			.h1 {
+				font-size: 32rpx;
+				color: #333;
+				margin-bottom: 20rpx;
+			}
+			.rightTxt {
+				padding-left: 20rpx;
+			}
+	      .flex {
+			.proccess {
+				margin-right: 20rpx;
+				width: 120rpx;
+			}
+			.rate {
+				font-size: 24rpx;
+				color: #CCCCCC;
+				margin-right: 30rpx;
+			}
+	      }
+	    }
+	  }
+	}
+</style>

pages/index/index.vue

@@ -1,6 +1,7 @@
 <template>
 	<view class="content">
-		题库
+		<up-button type="primary" text="点我啊" @click="$goPage('/pages/exercises/chapter/chapter')"></up-button>
+		<!-- <u-view>点我啊</u-view> -->
 	</view>
 </template>
 

static/css/app.scss

@@ -0,0 +1,44 @@
+
+
+page {
+	background-color: #fff;
+	font-size: 32rpx;
+	font-family: -apple-system-font, Helvetica Neue, Helvetica, sans-serif;
+}
+view {
+	box-sizing: border-box;
+}
+
+.oneRowText {
+	white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
+}
+.towRowText {
+	display: -webkit-box;
+	overflow: hidden;
+	white-space: normal;
+	text-overflow: ellipsis;
+	word-wrap: break-word;
+	-webkit-line-clamp: 2;
+	-webkit-box-orient: vertical
+}
+
+.flex {
+	display: flex;
+	align-items: center;
+}
+.flex-b {
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+}
+.flex-c {
+	display: flex;
+	justify-content: center;
+	align-items: center;
+}
+
+.padding {
+	padding: 0 20px;
+}

utils/utils.js

@@ -0,0 +1,8 @@
+
+export let goPage = (url, params={}, type='navigateTo')=> {
+		uni.$u.route({
+			url,
+			params,
+			type
+		})
+	}