Browse Source

写页面

master
unknown 1 year ago
parent
commit
a93032bebf
  1. 53
      pages.json
  2. 8
      pages/tabbar/mine/index.vue
  3. 98
      pages/userCenter/examinInfo/comp/examinItem.vue
  4. 69
      pages/userCenter/examinInfo/examinInfo.vue
  5. 65
      pages/userCenter/indicatorRecharge/indicatorRecharge.vue
  6. 30
      pages/userCenter/myCar/myCar.vue
  7. 130
      pages/userCenter/refund/comp/item.vue
  8. 47
      pages/userCenter/refund/refund.vue
  9. 174
      pages/userCenter/settled/settled.vue
  10. 26
      pages/userCenter/studentComment/studentComment.vue
  11. BIN
      static/images/index/telephone.png

53
pages.json

@ -169,35 +169,62 @@
"enablePullDownRefresh": false,
"backgroundTextStyle": "dark"
}
}
]
},
{
"root": "pages/userCenter",
"pages": [
},
{
"path": "settled/settled",
"style": {
"navigationBarTitleText": "待结算记录",
"navigationStyle": "custom",
"enablePullDownRefresh": false,
"backgroundTextStyle": "dark"
}
},
{
"path": "scanCode/scanCode",
"style": {
"navigationBarTitleText": "",
"navigationBarTitleText": "个人二维码",
"navigationStyle": "custom",
"enablePullDownRefresh": false,
"backgroundTextStyle": "dark"
}
}
]
},
{
"root": "pages/userCenter",
"pages": [
},
{
"path": "studentComment/studentComment",
"style": {
"navigationBarTitleText": "学员评价",
"navigationStyle": "custom",
"enablePullDownRefresh": false,
"backgroundTextStyle": "dark"
}
},
{
"path": "refund/refund",
"style": {
"navigationBarTitleText": "退款信息",
"navigationStyle": "custom",
"enablePullDownRefresh": false,
"backgroundTextStyle": "dark"
}
},
{
"path": "indicatorRecharge/indicatorRecharge",
"style": {
"navigationBarTitleText": "",
"navigationStyle": "custom",
"enablePullDownRefresh": false,
"backgroundTextStyle": "dark"
}
},
{
"path": "examinInfo/examinInfo",
"style": {
"navigationBarTitleText": "考场信息",
"navigationStyle": "custom",
"enablePullDownRefresh": false,
"backgroundTextStyle": "dark"
}
}
]
}

8
pages/tabbar/mine/index.vue

@ -26,13 +26,13 @@
data() {
return {
tabData: [
{text: '待结算记录', icon: require('../../../static/images/coach/ic_daijiesuan.png'), id: 1},
{text: '指标充值记录', icon: require('../../../static/images/coach/ic_zhibiao.png'), id: 2},
{text: '待结算记录', icon: require('../../../static/images/coach/ic_daijiesuan.png'), id: 1, url: '/pages/userCenter/settled/settled'},
{text: '指标充值记录', icon: require('../../../static/images/coach/ic_zhibiao.png'), id: 2, url: '/pages/userCenter/indicatorRecharge/indicatorRecharge'},
{text: '我的车辆', icon: require('../../../static/images/coach/ic_cheliang.png'), id: 3},
{text: '考场信息', icon: require('../../../static/images/coach/ic_changdi.png'), id: 4},
{text: '考场信息', icon: require('../../../static/images/coach/ic_changdi.png'), id: 4, url: '/pages/userCenter/examinInfo/examinInfo'},
{text: '学员评价', icon: require('../../../static/images/coach/ic_pingjia.png'), id: 5, url: '/pages/userCenter/studentComment/studentComment'},
{text: '教学数据', icon: require('../../../static/images/coach/ic_shuju.png'), id: 6},
{text: '学员退款', icon: require('../../../static/images/coach/ic_tuikuan.png'), id: 7},
{text: '学员退款', icon: require('../../../static/images/coach/ic_tuikuan.png'), id: 7, url: '/pages/userCenter/refund/refund'},
]
}
},

98
pages/userCenter/examinInfo/comp/examinItem.vue

@ -0,0 +1,98 @@
<template>
<view class="li" @click="$goPage('/pages/indexEntry/examines/detail/detail')">
<view class="flex">
<view class="cover">
<image src="@/static/images/logo.png" mode=""></image>
</view>
<view class="textCon">
<view class="name">江西海正驾校</view>
<view class="starBox">
<u-rate active-color="#1989FA" inactive-color="#1989FA" gutter="1" :size="16" :value="4" disabled></u-rate>
<view class="num">4.9</view>
</view>
<view class="modeCar">准考车型C1/C2</view>
</view>
<view class="pozPhone">
<image src="@/static/images/index/telephone.png" mode=""></image>
</view>
</view>
<view class="redBox">
<!-- <view class="icon">
<image src="@/static/images/index/ic_tongzhi.png" mode=""></image>
</view> -->
<!-- <view class="marqueeW"> -->
<u-notice-bar :text="'免费开放日免费开放日免费开放日免费开放日2023/08/08'" bgColor="#FBE8EA" color="#C12727" fontSize="12"></u-notice-bar>
<!-- </view> -->
</view>
</view>
</template>
<script>
export default {
data() {
return {
text1: '免费开放日:2023/08/08 '
}
}
}
</script>
<style lang="scss" scoped>
.flex {
position: relative;
.cover {
width: 204rpx;
height: 140rpx;
border-radius: 8rpx;
overflow: hidden;
}
.textCon {
flex: 1;
padding: 0 0 0 36rpx;
.name {
font-size: 32rpx;
font-weight: 600;
}
.starBox {
padding: 10rpx 0 20rpx 0;
}
.modeCar {
font-size: 24rpx;
color: #686B73;
}
}
.pozPhone {
position: absolute;
top: 50%;
right: 10rpx;
width: 72rpx;
height: 72rpx;
transform: translateY(-50%);
}
}
.redBox {
width: 100%;
display: flex;
background: #FBE8EA;
height: 40rpx;
align-items: center;
margin-top: 34rpx;
overflow: hidden;
.icon {
width: 40rpx;
image {
width: 28rpx;
height: 28rpx;
margin-left: auto;
}
}
.marqueeW {
width: 0;
flex: 1;
}
}
</style>

69
pages/userCenter/examinInfo/examinInfo.vue

@ -0,0 +1,69 @@
<template>
<view class="pageBgImg">
<topNavbar title="考场信息"></topNavbar>
<view class="pad">
<view class="searchBox">
<searchRow placeholder="搜索考场名称"></searchRow>
</view>
<view class="tabs">
<view class="tab" v-for="(item,index) in tabData" :key="index" :class="{active: index==1}">{{ item.text }}</view>
</view>
<view class="list">
<view class="card">
<examinItem/>
</view>
</view>
</view>
</view>
</template>
<script>
import examinItem from './comp/examinItem'
export default {
components: { examinItem },
data() {
return {
tabData: [
{text: '全部', id: 1},
{text: '理论', id: 2},
{text: '科目二', id: 3},
{text: '科目三', id: 4},
]
}
}
}
</script>
<style lang="scss" scoped>
.card {
padding: 32rpx 36rpx 26rpx 24rpx;
}
.searchBox {
padding: 20rpx 0;
}
.tabs {
display: flex;
justify-content: space-between;
height: 110rpx;
align-items: center;
.tab {
font-size: 28rpx;
color: #fff;
line-height: 110rpx;
&.active {
position: relative;
&::before {
content: '';
width: 56rpx;
height: 6rpx;
background: #FFFFFF;
border-radius: 3rpx;
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 20rpx;
}
}
}
}
</style>

65
pages/userCenter/indicatorRecharge/indicatorRecharge.vue

@ -0,0 +1,65 @@
<template>
<view class="pageBgImg">
<topNavbar title="指标充值记录"></topNavbar>
<view class="pad">
<view class="navBox">
<cardNav :navData="navData" :currentNav="currentNav" @changeNav="changeNav"></cardNav>
</view>
<view class="ul">
<view class="card" v-for="(item,index) in 10" :key="index">
<view class="num">+20</view>
<view class="date">2023/08/08 10:55:21</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
navData: [
{text: '科目二', id: 1},
{text: '科目三', id: 2},
],
currentNav: 1
}
},
methods: {
changeNav(id) {
this.currentNav = id
}
}
}
</script>
<style lang="scss" scoped>
.navBox {
padding: 24rpx 0;
}
.ul {
width: 100%;
.card {
display: flex;
width: 100%;
height: 100rpx;
align-items: center;
margin-bottom: 20rpx;
justify-content: space-between;
padding: 0 32rpx;
margin-bottom: 20rpx;
.num {
color: $themC;
font-weight: 500;
font-size: 36rpx;
&::after {
content: '个';
font-size: 24rpx;
font-weight: 400;
margin-left: 6rpx;
}
}
}
}
</style>

30
pages/userCenter/myCar/myCar.vue

@ -0,0 +1,30 @@
<template>
<view class="pageBgImg">
<topNavbar title="我的车辆"></topNavbar>
<view class="pad">
<view class="searcBox">
<searchRow placeholder="搜索车牌号"></searchRow>
</view>
<view class="card">
<view class="add">
<view class="lab">新增车辆</view>
<view class="lab">立即新增</view>
</view>
</view>
<view class="ul">
<view class="card">
<view class="li">
<view class="plate">浙A.6666</view>
<view class="name">大众朗逸</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
</script>
<style>
</style>

130
pages/userCenter/refund/comp/item.vue

@ -0,0 +1,130 @@
<template>
<!-- 考场 -->
<view class="consultItem">
<view class="top_row">
<view class="flex">
<view class="schoolName">张三三 18265468753</view>
</view>
<view class="status">
<view class="text">待处理</view>
<view class="icon">
<u-icon name="arrow-right" size="14" color="#686B73" style="margin-left: 12rpx;" ></u-icon>
</view>
</view>
</view>
<view class="target">
<view class="row">
<view class="iconImg">
<image src="@/static/images/index/radio_nor.png" mode=""></image>
</view>
<view class="name">报名时间2023/08/08</view>
</view>
<view class="row">
<view class="iconImg">
<image src="@/static/images/index/radio_nor.png" mode=""></image>
</view>
<view class="name">学驾车型C1小型汽车手动挡</view>
</view>
<view class="row">
<view class="iconImg">
<image src="@/static/images/index/radio_nor.png" mode=""></image>
</view>
<view class="name">报名班型C1一对一VIP班</view>
</view>
</view>
<view class="border_bottom">
<view class="row">
<view class="lab">申请退款金额</view>
<view class="val">8880.13</view>
</view>
<view class="btn_row">
<view class="btnBg">审核通过</view>
<view class="btnBg">审核不通过</view>
</view>
</view>
</view>
</template>
<script>
</script>
<style lang="scss" scoped>
.consultItem {
width: 100%;
.top_row {
display: flex;
width: 100%;
height: 116rpx;
border-bottom: 2rpx dashed #E8E9EC;
justify-content: space-between;
align-items: center;
.tag {
// width: 176rpx;
height: 60rpx;
background: rgba(250, 149, 25, 0.1);
border-radius: 8rpx;
text-align: center;
font-size: 28rpx;
color: #FA7919;
margin-right: 24rpx;
padding: 10rpx 18rpx;
}
.schoolName {
font-size: 28rpx;
font-weight: 550;
color: #333;
margin-left: 20rpx;
}
.status {
display: flex;
align-items: center;
.text {
font-size: 28rpx;
color: $themC;
}
}
}
.target {
padding: 20rpx 0;
}
.row {
padding: 16rpx 0;
display: flex;
align-items: center;
.iconImg {
width: 25rpx;
height: 25rpx;
}
.name {
font-size: 28rpx;
color: #333;
padding-left: 20rpx;
}
}
}
.border_bottom {
border-top: 2rpx dashed #E8E9EC;
.row {
padding: 28rpx 0;
display: flex;
align-items: center;
justify-content: space-between;
.val {
color: $themC;
}
}
.btn_row {
display: flex;
justify-content: center;
padding: 30rpx 0;
.btnBg {
width: 188rpx;
margin: 0 26rpx;
&:first-child {
width: 168rpx;
}
}
}
}
</style>

47
pages/userCenter/refund/refund.vue

@ -0,0 +1,47 @@
<template>
<view class="pageBgImg">
<topNavbar title="学员退款"></topNavbar>
<view class="pad">
<view class="navBox">
<cardNav :navData="navData" :currentNav="currentNav" @changeNav="changeNav"/>
</view>
<view class="list">
<view class="card">
<refundItem/>
</view>
</view>
</view>
</view>
</template>
<script>
import refundItem from './comp/item'
export default {
components: { refundItem },
data() {
return {
currentNav: 1,
navData: [
{text: '待审核', id: 1},
{text: '已审核', id: 2}
]
}
},
methods: {
changeNav(val) {
this.currentNav = val
console.log(val)
}
}
}
</script>
<style lang="scss" scoped>
.navBox {
padding: 24rpx 0;
}
.card {
padding: 0 28rpx;
margin-bottom: 24rpx;
}
</style>

174
pages/userCenter/settled/settled.vue

@ -0,0 +1,174 @@
<template>
<view class="pageBgImg">
<view class="searchBox">
<topNavbar title="待结算记录"></topNavbar>
</view>
<view class="pad">
<view class="searcBox">
<searchRow placeholder="搜索学员姓名、学员手机号"/>
</view>
<view class="tabs">
<view class="tab" v-for="(item,index) in tabData" :key="index" :class="{active: index==1}">{{ item.text }}</view>
</view>
<view class="total">12条记录</view>
<view class="list">
<view class="card">
<view class="top_row">
<view class="name">张三三</view>
<view class="tag">第三阶段</view>
<view class="price"><text>待结算金额</text> 1333.3</view>
</view>
<view class="row">
<view class="lab">学员确认</view>
<view class="icon">
<image src="@/static/images/index/radio_cli.png" mode=""></image>
<!-- <image src="@/static/images/index/radio_nor.png" mode=""></image> -->
</view>
<view class="right">
<view class="btnBg">确认</view>
</view>
</view>
<view class="row">
<view class="lab">教练确认</view>
<view class="icon">
<image src="@/static/images/index/radio_cli.png" mode=""></image>
<!-- <image src="@/static/images/index/radio_nor.png" mode=""></image> -->
</view>
<view class="right">
<view class="btnBg">确认</view>
</view>
</view>
<view class="row">
<view class="lab">驾校确认</view>
<view class="icon">
<image src="@/static/images/index/radio_cli.png" mode=""></image>
<!-- <image src="@/static/images/index/radio_nor.png" mode=""></image> -->
</view>
<view class="right">
2023/08/08 10:55:21
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
tabData: [
{text: '全部', id: 1},
{text: '阶段二', id: 2},
{text: '阶段三', id: 3},
{text: '阶段五', id: 4}
]
}
}
}
</script>
<style lang="scss" scoped>
.searcBox {
padding-top: 24rpx;
}
.total {
font-size: 24rpx;
color: #686B73;
line-height: 74rpx;
text-align: right;
height: 74rpx;
}
.tabs {
display: flex;
justify-content: space-between;
height: 110rpx;
align-items: center;
.tab {
font-size: 28rpx;
color: #fff;
line-height: 110rpx;
&.active {
position: relative;
&::before {
content: '';
width: 56rpx;
height: 6rpx;
background: #FFFFFF;
border-radius: 3rpx;
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 20rpx;
}
}
}
}
.list {
.card {
padding: 0 32rpx;
.top_row {
display: flex;
border-bottom: 2rpx dashed #E8E9EC;
height: 98rpx;
align-items: center;
width: 100%;
margin-bottom: 12rpx;
.name {
font-size: 32rpx;
color: #333;
}
.tag {
width: 144rpx;
height: 60rpx;
background: rgba(25,137,250,0.1);
border-radius: 8rpx;
font-size: 28rpx;
color: $themC;
text-align: center;
margin-left: 10rpx;
line-height: 60rpx;
}
.price {
color: $themC;
margin-left: auto;
font-size: 32rpx;
font-weight: 500;
text {
font-size: 24rpx;
}
}
}
.row {
display: flex;
align-items: center;
justify-content: space-between;
height: 88rpx;
.lab {
color: #686B73;
}
.icon {
width: 32rpx;
height: 32rpx;
}
.right {
color: #686B73;
width: 300rpx;
display: flex;
justify-content: flex-end;
.btnBg {
width: 130rpx;
}
}
}
}
}
</style>

26
pages/userCenter/studentComment/studentComment.vue

@ -6,7 +6,7 @@
<searchRow placeholder="搜索学员姓名"></searchRow>
</view>
<view class="tabs">
<view class="tab">全部10</view>
<view class="tab active">全部10</view>
<view class="tab">匿名1</view>
<view class="tab">有图2</view>
<view class="tab">有视频6</view>
@ -28,4 +28,28 @@
padding: 28rpx;
margin-bottom: 20rpx;
}
.tabs {
display: flex;
justify-content: space-between;
padding: 24rpx 12rpx;
.tab {
line-height: 76rpx;
font-size: 28rpx;
color: #fff;
&.active {
position: relative;
&::before {
position: absolute;
content: '';
left: 50%;
bottom: 0;
transform: translateX(-50%);
width: 56rpx;
height: 6rpx;
background: #FFFFFF;
border-radius: 3rpx;
}
}
}
}
</style>

BIN
static/images/index/telephone.png

After

Width: 72  |  Height: 72  |  Size: 1.8 KiB

Loading…
Cancel
Save