fangwenqiao
/
JiangxiMiniProgram
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

写页面

master
unknown 1 year ago
parent
aea68af91a
commit
959e889144
21 changed files with 1340 additions and 20 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 36
      pages.json
  2. 53
      pages/mineEntry/carLearnHours/carLearnHours.vue
  3. 90
      pages/mineEntry/myAppointment/comp/comp.scss
  4. 55
      pages/mineEntry/myAppointment/comp/examin.vue
  5. 51
      pages/mineEntry/myAppointment/comp/imitate.vue
  6. 54
      pages/mineEntry/myAppointment/comp/opera.vue
  7. 58
      pages/mineEntry/myAppointment/detail/detail.vue
  8. 49
      pages/mineEntry/myAppointment/detail/examin.vue
  9. 51
      pages/mineEntry/myAppointment/detail/imitate.vue
  10. 51
      pages/mineEntry/myAppointment/detail/opera.vue
  11. 133
      pages/mineEntry/myAppointment/myAppointment.vue
  12. 109
      pages/mineEntry/myOrder/comp/comp.scss
  13. 58
      pages/mineEntry/myOrder/comp/opera.vue
  14. 103
      pages/mineEntry/myOrder/detail/comp/refundInfo.vue
  15. 148
      pages/mineEntry/myOrder/detail/detail.vue
  16. 118
      pages/mineEntry/myOrder/myOrder.vue
  17. 141
      pages/mineEntry/schoolTransfer/schoolTransfer.vue
  18. 2
      pages/tabbar/mine/index.vue
  19. BIN
      static/images/bigImg/carlearTimeBg.png
  20. BIN
      static/images/userCenter/btn_yinhangkax.png
  21. BIN
      static/images/userCenter/warn.png

36
pages.json
View File

@ -311,6 +311,42 @@
}
},
{
"path": "myAppointment/myAppointment",
"style": {
"navigationBarTitleText": "我的预约",
"navigationStyle": "custom",
"enablePullDownRefresh": false,
"backgroundTextStyle": "dark"
}
},
{
"path": "myAppointment/detail/detail",
"style": {
"navigationBarTitleText": "预约详情",
"navigationStyle": "custom",
"enablePullDownRefresh": false,
"backgroundTextStyle": "dark"
}
},
{
"path": "myOrder/detail/detail",
"style": {
"navigationBarTitleText": "订单详情",
"navigationStyle": "custom",
"enablePullDownRefresh": false,
"backgroundTextStyle": "dark"
}
},
{
"path": "myOrder/myOrder",
"style": {
"navigationBarTitleText": "我的订单",
"navigationStyle": "custom",
"enablePullDownRefresh": false,
"backgroundTextStyle": "dark"
}
},
{
"path": "carLearProgress/carLearProgress",
"style": {
"navigationBarTitleText": "学车进度",

53
pages/mineEntry/carLearnHours/carLearnHours.vue
View File

@ -2,24 +2,24 @@
<view class="pageBgImg">
<topNavbar title="学车学时"></topNavbar>
<view class="pad">
<view class="box">
<view class="h2">模拟器</view>
<view class="box" v-for="(item,index) in list" :key="index">
<view class="h2">{{ item.text }}</view>
<view class="con">
<view class="item_row">
<view class="item">
<view class="lab">总学时</view>
<view class="val">100分钟</view>
<view class="val">{{ item.total }}分钟</view>
</view>
<view class="item">
<view class="lab">已完成</view>
<view class="val">90分钟</view>
<view class="val">{{ item.time }}分钟</view>
</view>
</view>
</view>
<view class="chain left">
<view class="chain left" v-if="index!=0">
<image src="@/static/images/index/chain.png" mode=""></image>
</view>
<view class="chain right">
<view class="chain right" v-if="index!=0">
<image src="@/static/images/index/chain.png" mode=""></image>
</view>
</view>
@ -28,42 +28,54 @@
</template>
<script>
export default {
data() {
return {
list: [
{total: 1024, time: 236, text: '模拟器'},
{total: 1024, time: 236, text: '科目一'},
{total: 1024, time: 236, text: '科目二'},
{total: 1024, time: 236, text: '科目三'},
]
}
}
}
</script>
<style lang="scss" scoped>
.pad {
marginp: 20rpx 0;
}
.box {
width: 100%;
height: 400rpx;
background: #FFFFFF;
box-shadow: inset 0px 2px 6px 0px rgba(255,255,255,0.5);
border-radius: 16px;
border: 4rpx solid #A6E2FF;
// border-image: linear-gradient(134deg, rgba(166, 226, 255, 1), rgba(114, 199, 247, 1), rgba(208, 228, 255, 1)) 4 4;
border-radius: 16rpx;
margin-bottom: 20rpx;
padding: 0 16rpx 52rpx 16rpx;
overflow: hidden;
background: url('http://192.168.1.20:81/zhili/image/20230822/ca8f14281ac9412987b23ad43bfb50a1.png') no-repeat;
background-size: 100% 400rpx;
position: relative;
.h2 {
width: 489rpx;
height: 75rpx;
line-height: 70rpx;
margin: 0 auto;
text-align: center;
background-color: #A6E2FF;
// background-color: #A6E2FF;
color: #fff;
font-size: 32rpx;
font-weight: 600;
}
.con {
background-color: #F3F8FE;
height: 256rpx;
background: linear-gradient(180deg, #99C2F4 0%, #3A89EB 100%);
border-radius: 16rpx;
width: 100%;
.item_row {
display: flex;
width: 100%;
height: 100%;
height: 256rpx;
align-items: center;
.item {
flex: 1;
text-align: center;
display: flex;
flex-direction: column;
@ -74,9 +86,10 @@
}
.val {
margin-top: 26rpx;
margin-top: 20rpx;
font-size: 40rpx;
color: $themC;
font-weight: 500;
}
}
}
@ -86,7 +99,7 @@
width: 28rpx;
height: 100rpx;
position: absolute;
top: -34rpx;
top: -56rpx;
&.left {
left: 60rpx;
}

90
pages/mineEntry/myAppointment/comp/comp.scss
View File

@ -0,0 +1,90 @@
.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;
color: #333;
margin-left: 20rpx;
}
.status {
display: flex;
align-items: center;
.text {
font-size: 28rpx;
color: $themC;
}
}
}
.target {
border-bottom: 2rpx dashed #E8E9EC;
}
.row {
display: flex;
justify-content: space-between;
padding: 24rpx 0;
.leftLab {
display: flex;
align-items: center;
.icon {
width: 30rpx;
height: 30rpx;
}
.lab {
margin-left: 10rpx;
font-size: 28rpx;
color: #ADADAD;
}
}
.name {
font-size: 28rpx;
color: #333;
}
}
.border_bottom {
border-top: 2rpx dashed #E8E9EC;
padding: 30rpx 10rpx 16rpx 0;
.dateBox {
.date {
font-size: 28rpx;
color: #ADADAD;
margin-bottom: 16rpx;
}
}
.btnBg {
width: 212rpx;
margin: 30rpx auto;
}
}
}

55
pages/mineEntry/myAppointment/comp/examin.vue
View File

@ -0,0 +1,55 @@
<template>
<!-- 模拟器 -->
<view class="consultItem">
<view class="top_row">
<view class="flex">
<view class="tag">科目三考场模拟</view>
<view class="schoolName">xx考场</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="leftLab">
<view class="icon">
<image src="@/static/images/index/edit.png" mode=""></image>
</view>
<view class="lab">所选车型</view>
</view>
<view class="name">C1</view>
</view>
<view class="row">
<view class="leftLab">
<view class="icon">
<image src="@/static/images/index/edit.png" mode=""></image>
</view>
<view class="lab">预约时间</view>
</view>
<view class="name">2023/08/08 10:00:00</view>
</view>
</view>
<view class="border_bottom">
<view class="dateBox">
<view class="date">完成时间：2022-01-04</view>
<!-- <view class="date">处理时间：2022-01-04</view> -->
</view>
<view class="btnBg">去评价</view>
</view>
</view>
</template>
<script>
</script>
<style lang="scss" scoped>
@import './comp.scss';
.tag {
background: rgba(144,12,12,0.1)!important;
color: #FF7070 !important;
}
</style>

51
pages/mineEntry/myAppointment/comp/imitate.vue
View File

@ -0,0 +1,51 @@
<template>
<!-- 模拟器 -->
<view class="consultItem">
<view class="top_row">
<view class="flex">
<view class="tag">模拟器</view>
<view class="schoolName">xx模拟驾驶馆</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="leftLab">
<view class="icon">
<image src="@/static/images/index/edit.png" mode=""></image>
</view>
<view class="lab">模拟器编号</view>
</view>
<view class="name">000001</view>
</view>
<view class="row">
<view class="leftLab">
<view class="icon">
<image src="@/static/images/index/edit.png" mode=""></image>
</view>
<view class="lab">预约时间</view>
</view>
<view class="name">2023/08/08 10:00:00</view>
</view>
</view>
<view class="border_bottom">
<view class="dateBox">
<view class="date">完成时间：2022-01-04</view>
<!-- <view class="date">处理时间：2022-01-04</view> -->
</view>
<view class="btnBg">去评价</view>
</view>
</view>
</template>
<script>
</script>
<style lang="scss" scoped>
@import './comp.scss';
</style>

54
pages/mineEntry/myAppointment/comp/opera.vue
View File

@ -0,0 +1,54 @@
<template>
<!-- 模拟器 -->
<view class="consultItem">
<view class="top_row">
<view class="flex">
<view class="tag">科目二实操</view>
<view class="schoolName">xx模拟驾驶馆</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="leftLab">
<view class="icon">
<image src="@/static/images/index/edit.png" mode=""></image>
</view>
<view class="lab">所选择车辆</view>
</view>
<view class="name">000001</view>
</view>
<view class="row">
<view class="leftLab">
<view class="icon">
<image src="@/static/images/index/edit.png" mode=""></image>
</view>
<view class="lab">预约时间</view>
</view>
<view class="name">2023/08/08 10:00:00</view>
</view>
</view>
<view class="border_bottom">
<view class="dateBox">
<view class="date">完成时间：2022-01-04</view>
</view>
<!-- <view class="btnBg">去评价</view> -->
</view>
</view>
</template>
<script>
</script>
<style lang="scss" scoped>
@import './comp.scss';
.tag {
background: rgba(144,12,64,0.1) !important;
color: #F158B9 !important;
}
</style>

58
pages/mineEntry/myAppointment/detail/detail.vue
View File

@ -0,0 +1,58 @@
<template>
<view class="pageBgImg">
<topNavbar title="预约详情"></topNavbar>
<!-- 详情 -->
<view class="pad">
<view class="card">
<imitate v-if="type==1"/>
<opera v-else-if="type==2"/>
<examin v-else-if="type==3"/>
</view>
<view class="btnBox">
<view class="btnBg">去评价</view>
<view class="btnBorder">取消预约</view>
<view class="btnBorder">申请退款</view>
</view>
</view>
</view>
</template>
<script>
import imitate from './imitate'
import opera from './opera'
import examin from './examin'
export default {
components: { imitate, opera, examin},
data() {
return {
type: 1
}
}
}
</script>
<style lang="scss" scoped>
.card {
padding: 24rpx;
}
.btnBox {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-top: 76rpx;
.btnBg {
width: 212rpx;
margin-bottom: 40rpx;
}
.btnBorder {
width: 396rpx;
border: 2rpx solid #E8E9EC;
background-color: #fff;
color: #ADADAD;
margin-bottom: 40rpx;
}
}
</style>

49
pages/mineEntry/myAppointment/detail/examin.vue
View File

@ -0,0 +1,49 @@
<template>
<!-- 模拟器 -->
<view class="consultItem">
<view class="top_row">
<view class="flex">
<view class="tag">科目三考场模拟</view>
<view class="schoolName">xx考场</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="leftLab">
<view class="icon">
<image src="@/static/images/index/edit.png" mode=""></image>
</view>
<view class="lab">所选车型</view>
</view>
<view class="name">C1</view>
</view>
<view class="row">
<view class="leftLab">
<view class="icon">
<image src="@/static/images/index/edit.png" mode=""></image>
</view>
<view class="lab">预约时间</view>
</view>
<view class="name">2023/08/08 10:00:00</view>
</view>
</view>
<view class="border_bottom">
<view class="dateBox">
<view class="date">提交预约时间：2022-01-04</view>
</view>
</view>
</view>
</template>
<script>
</script>
<style lang="scss" scoped>
@import '../comp/comp.scss';
</style>

51
pages/mineEntry/myAppointment/detail/imitate.vue
View File

@ -0,0 +1,51 @@
<template>
<!-- 模拟器 -->
<view class="consultItem">
<view class="top_row">
<view class="flex">
<view class="tag">模拟器</view>
<view class="schoolName">xx模拟驾驶馆</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="leftLab">
<view class="icon">
<image src="@/static/images/index/edit.png" mode=""></image>
</view>
<view class="lab">模拟器编号</view>
</view>
<view class="name">000001</view>
</view>
<view class="row">
<view class="leftLab">
<view class="icon">
<image src="@/static/images/index/edit.png" mode=""></image>
</view>
<view class="lab">预约时间</view>
</view>
<view class="name">2023/08/08 10:00:00</view>
</view>
</view>
<view class="border_bottom">
<view class="dateBox">
<view class="date">提交预约时间：2022-01-04</view>
<view class="date">完成时间：2022-01-04</view>
<view class="date">核销人员：某某一号考场</view>
</view>
</view>
</view>
</template>
<script>
</script>
<style lang="scss" scoped>
@import '../comp/comp.scss';
</style>

51
pages/mineEntry/myAppointment/detail/opera.vue
View File

@ -0,0 +1,51 @@
<template>
<!-- 模拟器 -->
<view class="consultItem">
<view class="top_row">
<view class="flex">
<view class="tag">科目二实操</view>
<view class="schoolName">xx模拟驾驶馆</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="leftLab">
<view class="icon">
<image src="@/static/images/index/edit.png" mode=""></image>
</view>
<view class="lab">所选择车辆</view>
</view>
<view class="name">000001</view>
</view>
<view class="row">
<view class="leftLab">
<view class="icon">
<image src="@/static/images/index/edit.png" mode=""></image>
</view>
<view class="lab">预约时间</view>
</view>
<view class="name">2023/08/08 10:00:00</view>
</view>
</view>
<view class="border_bottom">
<view class="dateBox">
<view class="date">提交预约时间：2022-01-04</view>
<view class="date">完成时间：2022-01-04</view>
<view class="data">核销来源：计时机器001</view>
</view>
</view>
</view>
</template>
<script>
</script>
<style lang="scss" scoped>
@import '../comp/comp.scss';
</style>

133
pages/mineEntry/myAppointment/myAppointment.vue
View File

@ -0,0 +1,133 @@
<template>
<view class="pageBgImg">
<topNavbar title="我的预约"></topNavbar>
<view class="pad">
<view class="searcBox">
<searchRow placeholder="搜索考场名称、车牌号"/>
</view>
<view class="tabs">
<view class="tab" v-for="(item,index) in tabList" :key="index" :class="{active: currentTab==item.id}" @click="changeTab(item)">{{ item.text }}</view>
</view>
<view class="navs">
<view class="nav" v-for="(item,index) in navList" :key="index" :class="{active: currentNav==item.id}" @click="changeNav(item)">{{ item.text }}</view>
</view>
<view class="recordTotal">100条记录</view>
<view class="tabCon" v-show="currentTab==1">
<view class="card" v-for="(item,index) in 10" :key="index" @click="$goPage('/pages/mineEntry/myAppointment/detail/detail')">
<imitate></imitate>
</view>
</view>
<view class="tabCon" v-if="currentTab==2">
<view class="card" v-for="(item,index) in 10" :key="index" @click="$goPage('/pages/mineEntry/myAppointment/detail/detail')">
<opera></opera>
</view>
</view>
<view class="tabCon" v-if="currentTab==3">
<view class="card" v-for="(item,index) in 10" :key="index" @click="$goPage('/pages/mineEntry/myAppointment/detail/detail')">
<examin></examin>
</view>
</view>
</view>
</view>
</template>
<script>
import imitate from './comp/imitate'
import opera from './comp/opera'
import examin from './comp/examin'
export default {
components: { imitate, opera, examin},
data() {
return {
tabList: [
{text: '模拟器',id: 1},
{text: '实操训练',id: 2},
{text: '考场模拟',id: 3},
],
navList: [
{text: '全部', id: 0},
{text: '已完成', id: 1},
{text: '待完成', id: 2},
{text: '已取消', id: 3},
{text: '已过期', id: 4},
],
currentTab: 1,
currentNav: 0,
}
},
methods: {
changeTab(item) {
this.currentTab = item.id
},
changeNav(item) {
this.currentNav = item.id
},
}
}
</script>
<style lang="scss" scoped>
.searcBox {
margin: 20rpx 0;
}
.card {
padding: 0 24rpx;
margin-bottom: 20rpx;
}
.tabs {
display: flex;
width: 100%;
height: 72rpx;
background: #FFFFFF;
border-radius: 16rpx;
margin-top: 20rpx;
.tab {
flex: 1;
text-align: center;
line-height: 72rpx;
color: #ADADAD;
&.active {
background: rgba(25,137,250,0.1);
border-radius: 16rpx;
border: 2rpx solid #1989FA;
color: $themC;
font-weight: 600;
}
}
}
.navs {
display: flex;
justify-content: space-between;
color: #fff;
font-size: 28rpx;
padding: 24rpx 0 40rpx 0;
color: $themC;
.nav {
&.active {
font-weight: 500;
position: relative;
&::before {
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: -20rpx;
content: '';
width: 56rpx;
height: 6rpx;
background: $themC;
border-radius: 3rpx;
}
}
}
}
.recordTotal {
font-size: 24rpx;
padding: 0rpx 0 28rpx 0;
text-align: right;
}
</style>

109
pages/mineEntry/myOrder/comp/comp.scss
View File

@ -0,0 +1,109 @@
.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;
color: #333;
margin-left: 20rpx;
}
.status {
display: flex;
align-items: center;
.text {
font-size: 28rpx;
color: $themC;
}
}
}
.target {
border-bottom: 2rpx dashed #E8E9EC;
}
.row {
display: flex;
justify-content: space-between;
padding: 24rpx 0;
.leftLab {
display: flex;
align-items: center;
.icon {
width: 30rpx;
height: 30rpx;
}
.lab {
margin-left: 10rpx;
font-size: 28rpx;
color: #ADADAD;
}
}
.name {
font-size: 28rpx;
color: #333;
}
}
.border_bottom {
border-top: 2rpx dashed #E8E9EC;
padding: 10rpx 10rpx 16rpx 0;
.dateBox {
.date {
font-size: 28rpx;
color: #ADADAD;
margin-bottom: 16rpx;
}
}
.btnBg {
width: 212rpx;
margin: 30rpx auto;
}
}
}
.rows {
display: flex;
justify-content: space-between;
padding: 16rpx 0;
font-size: 28rpx;
color: #ADADAD;
.label {
&.hui {
color: #686B73;
}
}
.value {
&.blue {
color: $themC;
font-weight: 500;
}
}
}

58
pages/mineEntry/myOrder/comp/opera.vue
View File

@ -0,0 +1,58 @@
<template>
<!-- 模拟器 -->
<view class="consultItem">
<view class="top_row">
<view class="flex">
<view class="tag">学费</view>
<view class="schoolName">xx模拟驾驶馆</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="leftLab">
<view class="icon">
<image src="@/static/images/index/edit.png" mode=""></image>
</view>
<view class="lab">学驾车型</view>
</view>
<view class="name">000001</view>
</view>
<view class="row">
<view class="leftLab">
<view class="icon">
<image src="@/static/images/index/edit.png" mode=""></image>
</view>
<view class="lab">所选班型</view>
</view>
<view class="name">2023/08/08 10:00:00</view>
</view>
</view>
<view class="border_bottom">
<!-- <view class="dateBox">
<view class="date">完成时间：2022-01-04</view>
</view> -->
<!-- <view class="btnBg">去评价</view> -->
<view class="rows">
<view class="label">培训费总价</view>
<view class="value">￥2000.02</view>
</view>
<view class="rows">
<view class="label hui">实际支付</view>
<view class="value blue">￥2000.02</view>
</view>
</view>
</view>
</template>
<script>
</script>
<style lang="scss" scoped>
@import './comp.scss';
</style>

103
pages/mineEntry/myOrder/detail/comp/refundInfo.vue
View File

@ -0,0 +1,103 @@
<template>
<view class="refundInfo">
<view class="h1">退款申请</view>
<view class="card">
<view class="row">
<view class="lab">退款原因</view>
<view class="val">个人原因</view>
</view>
<view class="row">
<view class="lab">退款金额</view>
<view class="val">￥100.00</view>
</view>
<view class="border_bottom">
<view class="date">申请时间：2023/08/06 09:12:33</view>
<view class="date">退款完成时间：2023/08/10 09:12:33</view>
</view>
</view>
<view class="h1">收款信息</view>
<view class="card">
<view class="row">
<view class="lab">持卡人</view>
<view class="value">张三</view>
</view>
<view class="row">
<view class="lab">手机号</view>
<view class="value">
<view class="flex-b">
<view class="phone">18267103167</view>
<view class="blue">已验证</view>
</view>
</view>
</view>
<view class="row">
<view class="lab">卡号</view>
<view class="value">79879465454148</view>
</view>
<view class="row">
<view class="lab">开户行</view>
<view class="value">招商银行</view>
</view>
</view>
</view>
</template>
<script>
</script>
<style lang="scss" scoped>
.refundInfo {
width: 100%;
.h1 {
line-height: 96rpx;
}
.card {
padding: 12rpx 28rpx;
.row {
display: flex;
font-size: 28rpx;
padding: 16rpx 0;
.lab {
font-weight: 500;
width: 164rpx;
}
.val {
&.blue {
color: $themC;
font-weight: 500;
}
}
}
.border_bottom {
margin-top: 16rpx;
padding-bottom: 12rpx;
border-top: 2rpx solid #E8E9EC;
.date {
padding: 14rpx 0;
color: #ADADAD;
}
}
}
.row {
.lab {
}
.value {
color: #333;
display: flex;
flex: 1;
.flex-b { width: 100%;}
.blue {
color: $themC;
font-weight: 500;
}
}
}
}
</style>

148
pages/mineEntry/myOrder/detail/detail.vue
View File

@ -0,0 +1,148 @@
<template>
<view class="pageBgImg">
<topNavbar title="订单详情"></topNavbar>
<view class="pad">
<view class="card">
<view class="consultItem">
<view class="top_row">
<view class="flex">
<view class="tag">学费</view>
<view class="schoolName">xx模拟驾驶馆</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="leftLab">
<view class="icon">
<image src="@/static/images/index/edit.png" mode=""></image>
</view>
<view class="lab">学驾车型</view>
</view>
<view class="name">C1</view>
</view>
<view class="row">
<view class="leftLab">
<view class="icon">
<image src="@/static/images/index/edit.png" mode=""></image>
</view>
<view class="lab">所选班型</view>
</view>
<view class="name">C2自动挡一对一VIP班</view>
</view>
<view class="row">
<view class="leftLab">
<view class="icon">
<image src="@/static/images/index/edit.png" mode=""></image>
</view>
<view class="lab">驾校类型</view>
</view>
<view class="name">合作驾校</view>
</view>
<view class="row">
<view class="leftLab">
<view class="icon">
<image src="@/static/images/index/edit.png" mode=""></image>
</view>
<view class="lab">支付形式</view>
</view>
<view class="name">全额支付</view>
</view>
<view class="row">
<view class="leftLab">
<view class="icon">
<image src="@/static/images/index/edit.png" mode=""></image>
</view>
<view class="lab">支付方式</view>
</view>
<view class="name">微信支付</view>
</view>
<view class="row">
<view class="leftLab">
<view class="icon">
<image src="@/static/images/index/edit.png" mode=""></image>
</view>
<view class="lab">支付时间</view>
</view>
<view class="name">2023/08/08 10:00:00</view>
</view>
</view>
<view class="border_bottom">
<view class="rows">
<view class="label">培训费总价</view>
<!-- <view class="value">￥2000.02</view> -->
</view>
<view class="rows">
<view class="label hui">学驾培训费</view>
<view class="value hui">￥2000.02</view>
</view>
<view class="rows">
<view class="flex">
<view class="label hui">代收费</view>
<view class="feeIcon">
<image src="@/static/images/index/edit.png" mode=""></image>
</view>
</view>
<view class="value hui">￥2000.02</view>
</view>
</view>
<view class="border_bottom">
<view class="rows">
<view class="label hui">实际支付</view>
<view class="value hui">￥2000.02</view>
</view>
<view class="rows">
<view class="label hui">已支付定金</view>
<view class="value blue">￥1000.02</view>
</view>
<view class="rows">
<view class="label hui">待支付尾款</view>
<view class="value blue">￥2000.02</view>
</view>
<view class="refundBtn">申请退款</view>
</view>
</view>
</view>
<refundInfo/>
</view>
</view>
</template>
<script>
import refundInfo from './comp/refundInfo.vue'
export default {
components: { refundInfo }
}
</script>
<style lang="scss" scoped>
@import '../comp/comp.scss';
.feeIcon {
width: 28rpx;
height: 28rpx;
margin-left: 12rpx;
}
.card {
padding: 20rpx;
}
.pad {
padding-bottom: 60rpx;
}
.refundBtn {
width: 200rpx;
height: 72rpx;
background: #FFFFFF;
border-radius: 8rpx;
border: 2rpx solid #E8E9EC;
line-height: 72rpx;
margin: 24rpx 0 0 0;
font-size: 28rpx;
color: #ADADAD;
text-align: center;
}
</style>

118
pages/mineEntry/myOrder/myOrder.vue
View File

@ -0,0 +1,118 @@
<template>
<view class="pageBgImg">
<topNavbar title="我的订单"></topNavbar>
<view class="pad">
<view class="searcBox">
<searchRow placeholder="搜索"/>
</view>
<view class="tabs">
<view class="tab" v-for="(item,index) in tabList" :key="index" :class="{active: currentTab==item.id}" @click="changeTab(item)">{{ item.text }}</view>
</view>
<view class="navs">
<view class="nav" v-for="(item,index) in navList" :key="index" :class="{active: currentNav==item.id}" @click="changeNav(item)">{{ item.text }}</view>
</view>
<view class="recordTotal">100条记录</view>
<view class="tabCon">
<view class="card" v-for="(item,index) in 10" :key="index" @click="$goPage('/pages/mineEntry/myOrder/detail/detail')">
<opera></opera>
</view>
</view>
</view>
</view>
</template>
<script>
import opera from './comp/opera'
export default {
components: { opera },
data() {
return {
tabList: [
{text: '已付',id: 1},
{text: '待付',id: 2},
{text: '退款',id: 3},
],
navList: [
{text: '全部', id: 0},
{text: '学费', id: 1},
{text: '考场模拟费', id: 2}
],
currentTab: 1,
currentNav: 0,
}
},
methods: {
changeTab(item) {
this.currentTab = item.id
},
changeNav(item) {
this.currentNav = item.id
},
}
}
</script>
<style lang="scss" scoped>
.searcBox {
margin: 20rpx 0;
}
.card {
padding: 0 24rpx;
margin-bottom: 20rpx;
}
.tabs {
display: flex;
width: 100%;
height: 72rpx;
background: #FFFFFF;
border-radius: 16rpx;
margin-top: 20rpx;
.tab {
flex: 1;
text-align: center;
line-height: 72rpx;
color: #ADADAD;
&.active {
background: rgba(25,137,250,0.1);
border-radius: 16rpx;
border: 2rpx solid #1989FA;
color: $themC;
font-weight: 600;
}
}
}
.navs {
display: flex;
justify-content: space-between;
color: #fff;
font-size: 28rpx;
padding: 24rpx 30rpx 40rpx 30rpx;
color: $themC;
.nav {
&.active {
font-weight: 500;
position: relative;
&::before {
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: -20rpx;
content: '';
width: 56rpx;
height: 6rpx;
background: $themC;
border-radius: 3rpx;
}
}
}
}
.recordTotal {
font-size: 24rpx;
padding: 0rpx 0 28rpx 0;
text-align: right;
}
</style>

141
pages/mineEntry/schoolTransfer/schoolTransfer.vue
View File

@ -0,0 +1,141 @@
<template>
<view class="pageBgImg">
<view class="card">
<view class="tpsBox">
<view class="row">
<view class="icon">
<image src="@/static/images/userCenter/warn.png" mode=""></image>
</view>
<view class="tps">请与教练协商，确认达成一致后填写协商好的退款金额</view>
</view>
</view>
</view>
<view class="card2">
<view class="row">
<view class="lab">退款原因</view>
<view class="val">申请同城转校</view>
<view class="icon">
<u-icon name="arrow-right"></u-icon>
</view>
</view>
<view class="row">
<view class="lab"></view>
<view class="val">此操作容易造成您已有学时丢失，请谨慎！</view>
</view>
<view class="row">
<view class="lab">退款金额</view>
<view class="val">
<u--input placeholder="请输入手机号" border="none" clearable type="number" maxlength="11" v-model="FormData.phone"></u--input>
</view>
</view>
<view class="tpsHui">退款金额不可超过¥2000.00</view>
</view>
<view class="h1">收款信息</view>
<view class="card">
<view class="row">
<view class="lab">持卡人</view>
<view class="val">
<u--input placeholder="请输入" border="none" clearable type="number" maxlength="11" v-model="FormData.phone"></u--input>
</view>
</view>
<view class="row">
<view class="lab">手机号</view>
<view class="val">
<view class="flex-b">
<view class="inputBox">
<u--input placeholder="请输入" border="none" clearable type="number" maxlength="11" v-model="FormData.phone"></u--input>
</view>
<view class="code">获取验证码</view>
</view>
</view>
</view>
<view class="row">
<view class="lab">验证码</view>
<view class="val">
<u--input placeholder="请输入" border="none" clearable type="number" maxlength="11" v-model="FormData.phone"></u--input>
</view>
</view>
<view class="row">
<view class="lab">卡号</view>
<view class="val">
<view class="flex-b">
<view class="inputBox">
<u--input placeholder="请输入" border="none" clearable type="number" maxlength="11" v-model="FormData.phone"></u--input>
</view>
<view class="scan">
<image src="@/static/images/userCenter/btn_yinhangkax.png" mode=""></image>
</view>
</view>
</view>
</view>
<view class="row">
<view class="lab">开户行</view>
<view class="val">
<u--input placeholder="请输入" border="none" clearable type="number" maxlength="11" v-model="FormData.phone"></u--input>
</view>
</view>
</view>
<view class="btnBg">提交</view>
</view>
</template>
<script>
export default {
data() {
return {
FormData: {
}
}
}
}
</script>
<style lang="scss" scoped>
.card {
.tpsBox {
.row {
.icon {
img {
}
}
.tps {
}
}
}
}
.card2 {
.row {
.lab {
}
.val {
}
.icon {
u-icon {
}
}
}
.tpsHui {
}
}
.h1 {
}
.btnBg {
}
</style>

2
pages/tabbar/mine/index.vue
View File

@ -72,10 +72,12 @@
{
text: '我的预约',
icon: require('../../../static/images/userCenter/ic_yuyue.png'),
url: '/pages/mineEntry/myAppointment/myAppointment'
},
{
text: '我的订单',
icon: require('../../../static/images/userCenter/ic_dingdan.png'),
url: '/pages/mineEntry/myOrder/myOrder'
},
{
text: '学车数据',

BIN
static/images/bigImg/carlearTimeBg.png
View File

Side by Side

After

Width: 686  |  Height: 400  |  Size: 29 KiB

BIN
static/images/userCenter/btn_yinhangkax.png
View File

Side by Side

After

Width: 44  |  Height: 44  |  Size: 698 B

BIN
static/images/userCenter/warn.png
View File

Side by Side

After

Width: 36  |  Height: 36  |  Size: 1.0 KiB

Write Preview
Loading…
Cancel
Save