Skip to content

Great Teamwork
Great Teamwork

_milo / Great Teamwork

通知 13
Star 0
Fork 0
Great Teamwork
Great Teamwork
提交 2a65c334 编写于 作者: Y yyt
浏览文件
操作

运动模块累计排名、主页面、准备界面布局完成

上级 356c2535
隐藏空白更改
内联 并排
Showing with 284 addition and 44 deletion
teamwork/pages.json
浏览文件 @ 2a65c334
......@@ -39,15 +39,7 @@
"style": {
"navigationStyle": "custom"
}
},
{
"path": "pages/sport/ready",
"style": {
"navigationStyle": "custom"
}
},
{
}, {
"path": "pages/login/login",
"style": {
"navigationStyle": "custom"
......@@ -67,6 +59,11 @@
"style": {
"navigationStyle": "custom"
}
}, {
"path": "pages/sport/ready",
"style": {
"navigationStyle": "custom"
}
}, {
"path": "pages/sport/test",
"style": {
......@@ -77,6 +74,11 @@
"style": {
"navigationStyle": "custom"
}
}, {
"path": "pages/sport/start",
"style": {
"navigationStyle": "custom"
}
}, {
"path": "pages/discover/discover-detail",
"style": {
......
teamwork/pages/sport/main.vue
浏览文件 @ 2a65c334
<template>
<view>
<view class="content">
<view class="type-select">
<uni-data-select custom-class="type" v-model="type" :localdata="range" :clear="false"
@change="change"></uni-data-select>
</view>
<view class="ranking">
<view class="distance">
<p>累计{{type}}</p>
<p>{{distance}}公里</p>
<view class="accumulate">
<view class="block1">
<ul>
<li>累计{{type}}</li>
</ul>
<view class="dis">
<view class="distance">{{distance}}</view>
<view class="km">公里</view>
</view>
</view>
<view class="rank" @click="click">
<p>累计排名</p>
<p>{{rank}}</p>
<view class="block2" @click="click">
<ul>
<li>本校累计排名</li>
</ul>
<view class="rank">{{rank}}</view>
</view>
</view>
<image class="start-button" src="/static/sport/stop.png" @click="start"></image>
......@@ -49,7 +56,7 @@
console.log(res);
});
},
click(){
click() {
uni.navigateTo({
url: './ranking'
});
......@@ -65,21 +72,99 @@
<style scoped>
.content {
background-color: #edeef0;
display: flex;
flex-direction: column;
position: absolute;
width: 100%;
height: 100%;
}
.type-select {
width: 30%;
padding: 30px;
margin-top: 60px;
margin-left: 30px;
color: #f1992d;
/* background-color: #f1992d; */
}
.accumulate {
margin: 10px;
margin-top: 40px;
}
.block1 {
background-color: white;
padding: 10px;
margin: 2%;
width: 40%;
height: 110px;
border-radius: 10px;
float: left;
}
.block2 {
background-color: white;
padding: 10px;
margin: 2%;
width: 40%;
height: 110px;
border-radius: 10px;
float: right;
}
li {
cursor: pointer;
color: #8A8A8C;
font-weight: bold;
list-style-position: outside;
font-size: 18px;
text-indent: -10px;
margin-top: 10px;
margin-left: -15px;
}
li::marker {
font-size: 25px;
color: #f1992d;
}
.dis{
margin-left: 5px;
margin-top: 16px;
}
.ranking {
margin: 20px;
.distance {
font-size: 30px;
font-weight: bold;
margin-top: 12px;
margin-left: 5px;
display: inline;
}
.km {
font-weight: bold;
margin-left: 5px;
margin-top: 2px;
display: inline;
}
.rank {
font-size: 45px;
font-weight: bold;
color: #f1992d;
opacity: 80%;
margin-top: 10px;
margin-left: 55px;
}
.start-button {
display: flex;
justify-content: center;
margin-left: 30%;
width: 300rpx;
height: 300rpx;
margin: 0 auto;
margin-top: 170px;
}
</style>
\ No newline at end of file
teamwork/pages/sport/ranking.vue
浏览文件 @ 2a65c334
<template>
<view>
<image class="returnBack" src="/static/login/returnBack.png" @click="goBack()"></image>
<view class="top">
<image class="back" src="/static/login/returnBack.png" @click="goBack()"></image>
<view class="title">累计排名</view>
<span class="empty"></span>
</view>
<view class="userList" v-for="(item,index) in userList" :key="index">
<view class="rank">{{item.rank}}</view>
<image class="icon" :src="item.icon"></image>
<view class="username">{{item.username}}</view>
<view class="distance">{{item.distance}}km</view>
</view>
<view class="my">
<view class="rank">{{rank}}</view>
<image class="icon" :src="icon"></image>
<!-- <view class="info"> -->
<view class="username">{{username}}</view>
<view class="distance">{{distance}}km</view>
<!-- </view> -->
</view>
</view>
</template>
<script>
export default {
data() {
return {}
return {
rank: 1,
icon: '/static/sport/icon.jpg',
username: "不会取名字",
distance: 99.99,
userList: [{
rank: 1,
icon: '/static/sport/icon.jpg',
username: "不会取名字",
distance: 99.99
},{
rank: 2,
icon: '/static/sport/icon.jpg',
username: "不会取名字",
distance: 12.12
}]
}
},
methods: {
goBack() {
uni.navigateTo({
url: '/pages/sport/main'
uni.reLaunch({
url: '/pages/sport/main',
animationType: 'pop-in',
animationDuration: 300
});
}
}
......@@ -28,4 +63,90 @@
margin-left: 20rpx;
margin-right: auto;
}
.top {
width: 100%;
height: 50px;
background-color: #EDEEF0;
text-align: center;
}
.back {
width: 40px;
height: 30px;
margin-top: 10px;
margin-bottom: 10px;
float: left;
margin-left: 10px;
}
.empty {
width: 40px;
height: 30px;
margin-top: 10px;
margin-bottom: 10px;
float: right;
margin-right: 10px;
}
.title {
font-size: 20px;
margin-top: 10px;
font-weight: bold;
color: #f1992d;
display: inline-block;
}
.userList{
margin-top: 10px;
}
.my{
position: absolute;
bottom: 0px;
background-color: #EDEEF0;
width: 100%;
height: 55px;
padding: 5px 0;
}
.rank{
position: relative;
bottom: 15px;
left: 20px;
display: inline;
font-size: 20px;
font-weight: bold;
}
.icon{
position: relative;
top:2px;
left: 38px;
width: 50px;
height: 50px;
border-radius: 50%;
}
/* .info{
position: relative;
float: left;
}
.username{
float: ;
} */
.username{
display: inline;
position: relative;
font-size: 17px;
font-weight: bold;
bottom: 25px;
left: 48px;
color: #7F7F7F;
}
.distance{
display: inline;
position: relative;
font-size: 14px;
font-weight: bold;
bottom: 5px;
left: -36px;
}
</style>
\ No newline at end of file
teamwork/pages/sport/ready.vue
浏览文件 @ 2a65c334
<template>
<view class="content">
<!-- <image class="returnBack" src="/static/login/returnBack.png" @click="goBack()"></image> -->
<map id="myMap" style="width: 100%; height: 800px;" :latitude="latitude" :longitude="longitude"
:markers="markers" :polyline="polyline" show-location="true"></map>
<map id="myMap" style="width: 100%; height: 780px;" :latitude="latitude" :longitude="longitude"
:markers="markers" :polyline="polyline" show-location="true" :scale="16">
<cover-image class="returnBack" src="/static/login/returnBack.png" @click="goBack()"></cover-image>
<cover-image class="start-button" src="/static/sport/stop.png" @click="start"></cover-image>
</map>
</view>
</template>
......@@ -30,15 +32,23 @@
rotate: 0,
width: 10, //宽
height: 20, //高
title: '开始位置', //标注点名
title: '开始位置' //标注点名
}]
}
},
methods: {
goBack() {
// 关闭所有页面，打开到应用内的某个页面。
uni.reLaunch({
url: '/pages/sport/main',
animationType: 'pop-in',
animationDuration: 300
})
},
start() {
uni.navigateTo({
url: '/pages/sport/main'
url: './start'
});
},
// 位置授权
......@@ -70,12 +80,12 @@
id: 1,
latitude: res.latitude,
longitude: res.longitude,
iconPath: '/static/sport/location.png',
iconPath: '/static/sport/location.png'
}]
this.polyline[0].points.push({
latitude: that.latitude,
longitude: that.longitude
})
// this.polyline[0].points.push({
// latitude: that.latitude,
// longitude: that.longitude
// })
// that.circles = [{ //在地图上显示圆
// latitude: res.latitude,
// longitude: res.longitude,
......@@ -137,12 +147,12 @@
margin-right: auto;
}
.page-section-gap {
box-sizing: border-box;
/* padding: 0 30rpx; */
}
.page-body-button {
margin-bottom: 30rpx;
.start-button {
display: flex;
justify-content: center;
width: 300rpx;
height: 300rpx;
margin: 0 auto;
margin-top: 125%;
}
</style>
\ No newline at end of file
teamwork/pages/sport/start.vue 0 → 100644
浏览文件 @ 2a65c334
<template>
<view>
</view>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
}
}
</script>
<style>
</style>
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或