api

.env.development

@@ -0,0 +1,3 @@
+ENV = 'development'
+
+VUE_APP_BASE_API = 'http://local.party-rank.host'

.env.production

@@ -0,0 +1,3 @@
+ENV = 'production'
+
+VUE_APP_BASE_API = 'http://www.xbzt.cc'

src/components/rank.vue

@@ -6,16 +6,19 @@
 			</view>
 		</view>
 		<view class="table-body">
-			<view v-for="(item, index) in list" :key="index" class="table-tr">
+			<block v-if="list.length > 0">
-				<view class="table-td">{{ index + 1 }}</view>
+				<view v-for="item in list" :key="item.id" class="table-tr">
-				<view class="table-td">
+					<view class="table-td">{{ item.rank }}</view>
-					<view class="avatar">
+					<view class="table-td">
-						<image src="https://via.placeholder.com/64x64.png?text=A">
+						<view class="avatar">
+							<image src="https://via.placeholder.com/64x64.png?text=A">
+						</view>
+						<view class="name">{{ item.name }}</view>
 					</view>
-					<view class="name">{{ item.name }}</view>
+					<view class="table-td">{{ item.score }}</view>
 				</view>
-				<view class="table-td">{{ item.score }}</view>
+			</block>
-			</view>
+			<u-empty v-else mode="list" />
 		</view>
 	</view>
 </template>
@@ -52,6 +55,9 @@
 		justify-content: space-between;
 		padding: 15rpx 0;
 	}
+	.table-body .table-tr {
+		border-bottom: 1px solid #e5e5e5;
+	}
 	.avatar ::v-deep uni-image {
 		border-radius: 30rpx;
 		width: 64rpx;

src/main.js

@@ -11,4 +11,9 @@ App.mpType = 'app'
 const app = new Vue({
   ...App
 })
+
+require('@/utils/request.js')()
+
+Vue.prototype.$ajax = uni.$u.http
+
 app.$mount()

src/pages/article/detail.vue

@@ -1,9 +1,14 @@
 <template>
 	<view class="page">
-		<view class="title">文章标题文章标题文章标题文章标题文章标题文章标题文章标题文章标题文章标题文章标题文章标题文章标题文章标题文章标题文章标题文章标题文章标题文章标题</view>
+		<view v-if="noData" class="full">
-		<view class="content">
+			<u-empty mode="data" />
-			<rich-text :nodes="content" />
 		</view>
+		<block v-else>
+			<view class="title">{{ title }}</view>
+			<view class="content">
+				<rich-text :nodes="content" />
+			</view>
+		</block>
 	</view>
 </template>
 
@@ -11,20 +16,56 @@
 	export default {
 		data() {
 			return {
-				content: '<p>1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111</p>'
+				noData: false,
+				title: '',
+				content: ''
+			}
+		},
+		onLoad(e) {
+			// 共性指标
+			if (e.type == 'common') {
+				uni.setNavigationBarTitle({
+					title: '共性指标'
+				})
+				this.$ajax.get('/api/article/common', { custom: { loading: true } }).then(res => {
+					if (res.status == 0 && res.data) {
+						this.title = res.data.title
+						this.content = res.data.content
+					} else {
+						this.noData = true
+					}
+				})
+			}
+			// 进阶指标
+			else if (e.type == 'cate') {
+				uni.setNavigationBarTitle({
+					title: '进阶指标'
+				})
+				this.$ajax.get('/api/article/cate', { custom: { loading: true } }).then(res => {
+					if (res.status == 0 && res.data) {
+						this.title = res.data.title
+						this.content = res.data.content
+						if (res.data.party_cate) {
+							uni.setNavigationBarTitle({
+								title: res.data.party_cate.name
+							})
+						}
+					} else {
+						this.noData = true
+					}
+				})
 			}
 		}
 	}
 </script>
 
 <style scoped>
-	.page {
-		padding: 20rpx;
-	}
 	.title {
 		font-size: 36rpx;
 		font-weight: bold;
 		text-align: center;
+		padding: 20rpx 0;
+		background-color: white;
 	}
 	.content {
 		margin-top: 30rpx;
@@ -34,4 +75,11 @@
 		width: 100%;
 		line-height: 1.6;
 	}
+	.full {
+		position: absolute;
+		width: 100%;
+		height: 100%;
+		display: flex;
+		justify-content: center;
+	}
 </style>

src/pages/auth/login.vue

@@ -26,10 +26,15 @@
 		data() {
 			return {
 				username: '',
-				password: ''
+				password: '',
+				redirect: ''
+			}
+		},
+		onLoad(e) {
+			if (e.redirect) {
+				this.redirect = e.redirect
 			}
 		},
-		onLoad() {},
 		methods: {
 			submit() {
 				if (!this.username) {
@@ -38,12 +43,22 @@
 						title: '账号必填'
 					})
 				}
-				if (!this.username) {
+				if (!this.password) {
 					return uni.showToast({
 						icon: 'error',
 						title: '密码必填'
 					})
 				}
+
+				this.$ajax.post('/api/login', { username: this.username, password: this.password }).then(res => {
+					if (res.status == 0) {
+						const token = res.data.token
+						uni.setStorageSync('party_rank_auth_token', token)
+						uni.reLaunch({
+							url: '/pages/index/index'
+						})
+					}
+				})
 			}
 		}
 	}

src/pages/feedback/add.vue

@@ -24,13 +24,26 @@
 						icon: 'error'
 					})
 				}
+				this.$ajax.post('/api/feedback', { content: this.content }, { custom: { loading: true } }).then(res => {
+					if (res.status == 0) {
+						this.content = ''
+						uni.showToast({
+							title: '提交成功',
+							icon: 'succsss'
+						})
+					}
+				})
 			}
 		}
 	}
 </script>
 
 <style>
+	.page {
+		background-color: white;
+	}
 	.form {
+		
 		padding: 20rpx;
 		margin-top: 150rpx;
 	}

src/pages/index/index.vue

@@ -2,17 +2,17 @@
 	<view class="page">
 		<swiper class="swiper" autoplay circular>
 			<swiper-item v-for="item in banners" :key="item.id">
-				<image :src="item.image" style="height: 300rpx;width: 100%;" />
+				<image :src="item.picture" style="height: 300rpx;width: 100%;" />
 			</swiper-item>
 		</swiper>
 		<view class="app-content">
-			<view class="item" @click="navigateArticle">
+			<view class="item" @click="commonArticle('common')">
 				<view class="icon">
 					<image src="../../static/images/form-active.png" />
 				</view>
 				<view class="title">共性指标</view>
 			</view>
-			<view class="item" @click="navigateArticle">
+			<view class="item" @click="authArticle">
 				<view class="icon">
 					<image src="../../static/images/form-active.png" />
 				</view>
@@ -28,19 +28,19 @@
 		<view class="rank">
 			<view class="header">
 				<text class="title">五星党员</text>
-				<text class="tool" @click="userRank">更多</text>
+				<text class="tool" @click="userRank('user')">更多</text>
 			</view>
 			<view class="body">
-				<rank :header="header" :list="list" />
+				<rank :header="header" :list="userList" />
 			</view>
 		</view>
 		<view class="rank">
 			<view class="header">
-				<text class="title">五星党员</text>
+				<text class="title">五星党支部</text>
-				<text class="tool">更多</text>
+				<text class="tool" @click="userRank('cate')">更多</text>
 			</view>
 			<view class="body">
-				<rank :header="header" :list="list" />
+				<rank :header="header1" :list="cateList" />
 			</view>
 		</view>
 	</view>
@@ -48,14 +48,15 @@
 
 <script>
 	import Rank from '../../components/rank.vue'
+	import { isLogin } from '../../utils/index'
 	export default {
 		components: { Rank },
 		data() {
 			return {
 				header: ['排名', '党员', '得分'],
-				list: [
+				header1: ['排名', '支部', '得分'],
-					{ name: '党员1', score: 100 }
+				userList: [],
-				],
+				cateList: [],
 				banners: [
 					{id: 1, 'image': 'https://via.placeholder.com/800x300.png?text=1'},
 					{id: 2, 'image': 'https://via.placeholder.com/800x300.png?text=2'},
@@ -64,19 +65,55 @@
 			}
 		},
 		onLoad() {
-
+			this.init()
 		},
 		methods: {
-			userRank() {
+			async init() {
+				uni.showLoading()
+				let res
+				res = await this.$ajax.get('/api/banner', { params: { key: 'banner_1' }})
+				if (res.status == 0) {
+					this.banners = res.data
+				}
+				res = await this.$ajax.get('/api/rank', { params: { type: 'user', limit: 20 } })
+				if (res.status == 0) {
+					this.userList = res.data
+				}
+				res = await this.$ajax.get('/api/rank', { params: { type: 'cate', limit: 5 } })
+				if (res.status == 0) {
+					this.cateList = res.data
+				}
+				uni.hideLoading()
+			},
+			userRank(type) {
 				uni.navigateTo({
-					url: '/pages/score/user-rank'
+					url: `/pages/score/user-rank?type=${type}`
 				})
 			},
-			navigateArticle() {
+			commonArticle() {
 				uni.navigateTo({
-					url: '/pages/article/detail'
+					url: `/pages/article/detail?type=common`
 				})
 			},
+			authArticle() {
+				// 验证是否登录
+				if (isLogin()) {
+					uni.navigateTo({
+						url: `/pages/article/detail?type=cate`
+					})
+				} else {
+					uni.showModal({
+						title: '请先登录',
+						success: (res) => {
+							if (res.confirm) {
+								uni.navigateTo({
+									url: '/pages/auth/login'
+								})
+							}
+						}
+					})
+				}
+			},
 			feedback() {
 				uni.navigateTo({
 					url: '/pages/feedback/add'

src/pages/score/user-rank.vue

@@ -2,9 +2,12 @@
 	<view class="page">
 		<view class="title">
 			<view class="name1">
-				<picker mode="selector" :range="dates" @change="changeDate">{{ date }}</picker>
+				<picker mode="selector" :range="dates" @change="changeDate">{{ date }}<u-icon name="arrow-down-fill" /></picker>
 			</view>
 		</view>
+		<view v-if="user.show" class="me">
+			我的得分: <text class="waring">{{ user.score }}</text>, 我的排名: <text class="waring">{{ user.rank }}</text>
+		</view>
 		<view class="rank">
 			<rank :header="header" :list="list" />
 		</view>
@@ -13,22 +16,76 @@
 
 <script>
 	import Rank from '../../components/rank.vue'
+	import { isLogin } from '../../utils/index'
 	export default {
 		components: { Rank },
 		data() {
 			return {
+				type: 'user',
 				header: ['排名', '党员', '得分'],
-				list: [
+				list: [],
-					{ name: '党员1', score: 100 },
+				date: '当前',
-					{ name: '党员2', score: 200 },
+				index: 0,
-				],
+				dates: ['当前'],
-				date: '请选择期数',
+				user: {
-				dates: ['2023-1', '2023-2', '2023-3']
+					show: false,
+					score: '-',
+					rank: '-'
+				}
 			}
 		},
+		onLoad(e) {
+			if (e.type) {
+				this.type = e.type
+				this.header = ['排名', this.type == 'user' ? '党员' : '支部', '得分'];
+			}
+			this.user.show = isLogin()
+			this.init()
+			this.load()
+		},
 		methods: {
+			init() {
+				this.$ajax.get('/api/rank/dates', { params: { type: this.type } }).then(res => {
+					if (res.status == 0) {
+						this.dates = ['当前'].concat(res.data)
+					}
+				})
+			},
+			load() {
+				let url = '/api/rank'
+				let params = { type: this.type }
+				if (this.index > 0) {
+					url  = '/api/rank/list'
+					params.sn = this.dates[this.index]
+				}
+				this.$ajax.get(url, { params, custom: {loading: true} }).then(res => {
+					if (res.status == 0) {
+						this.list = res.data
+					}
+				})
+				this.loadUser()
+			},
+			loadUser() {
+				if (!this.user.show) {
+					return;
+				}
+				let url = '/api/rank/current'
+				let params = { type: this.type }
+				if (this.index > 0) {
+					url  = '/api/rank/current-list'
+					params.sn = this.dates[this.index]
+				}
+				this.$ajax.get(url, { params }).then(res => {
+					if (res.status == 0) {
+						this.user.rank = res.data.rank
+						this.user.score = res.data.score
+					}
+				})
+			},
 			changeDate(e) {
-				this.date = this.dates[e.detail.value]
+				this.index = e.detail.value
+				this.date = this.dates[this.index]
+				this.load()
 			}
 		}
 	}
@@ -48,4 +105,28 @@
 		border-radius: 10rpx;
 		box-sizing: border-box;
 	}
+	.name1 {
+		display: flex;
+		width: 100%;
+    	justify-content: center;
+	}
+	.name1 ::v-deep .u-icon {
+		margin-left: 10rpx;
+		display: inline-block;
+	}
+
+	.me {
+		background-color: white;
+		text-align: center;
+		margin: 15rpx 0;
+		padding: 10rpx 0;
+	}
+	.me .waring {
+		font-size: 40rpx;
+		color: #f0ad4e;
+	}
+	::v-deep uni-picker {
+		width: 100%;
+    	text-align: center;
+	}
 </style>

src/static/css/base.css

@@ -1,3 +1,6 @@
+::v-deep uni-page-wrapper {
+	background-color: #efefef;
+}
 .page {
 	background-color: #efefef;
 	/* position: absolute;

src/utils/index.js

@@ -0,0 +1,3 @@
+export function isLogin() {
+    return !!uni.getStorageSync('party_rank_auth_token')
+}

src/utils/request.js

@@ -0,0 +1,58 @@
+// http 网络请求
+
+module.exports = () => {
+    // 全局配置
+    uni.$u.http.setConfig((config) => {
+        config.baseURL = process.env.VUE_APP_BASE_API
+		config.custom = {
+			toast: true,
+			loading: false
+		}
+        return config
+    })
+
+    // 请求拦截
+    uni.$u.http.interceptors.request.use(
+        (config) => {
+            const token = uni.getStorageSync('party_rank_auth_token')
+            if (token) {
+                config.header['Authorization'] = `Bearer ${token}`
+            }
+            config.header['Accept'] = 'application/json'
+			if (config.custom.loading) {
+				uni.showLoading()
+			}
+            return config
+        },
+        config => {
+            return Promise.reject(config)
+        }
+    )
+
+    // 响应拦截
+    uni.$u.http.interceptors.response.use(
+        (response) => {
+            uni.hideLoading()
+
+            const res = response.data
+            if (response.config.custom.toast && res.status != 0 && res.doNotDisplayToast != 1) {
+                uni.showModal({
+                    title: res.msg,
+                    showCancel: false
+                })
+            }
+            if (res.code == 401) {
+                uni.reLaunch({
+                    url: '/pages/auth/login'
+                })
+            }
+
+            return res
+        },
+        (response) => {
+            uni.hideLoading()
+            return Promise.reject(response)
+        }
+    )
+}
+