unknown
1 year ago
10 changed files with 756 additions and 6 deletions
-
45components/myRadio/myRadio.vue
-
46pages.json
-
239pages/recordEntry/operate/mySchedule/comp/step1.vue
-
71pages/recordEntry/operate/mySchedule/mould/mould.vue
-
18pages/recordEntry/operate/mySchedule/mySchedule.vue
-
139pages/recordEntry/operate/mySchedule/plan/plan.vue
-
4pages/tabbar/mine/index.vue
-
2pages/tabbar/operateTrain/index.vue
-
42pages/userCenter/myCar/myCar.vue
-
156pages/userCenter/teachingData/teachingData.vue
@ -0,0 +1,45 @@ |
|||
<template> |
|||
<view class="radioBox"> |
|||
<u-radio-group |
|||
v-model="value" |
|||
placement="row" |
|||
size="14" |
|||
> |
|||
<u-radio |
|||
:customStyle="{marginLeft: '8px'}" |
|||
v-for="(item, index) in radioData" |
|||
:key="index" |
|||
:label="item.name" |
|||
:name="item.id" |
|||
labelSize="14" |
|||
@change="changeRadio" |
|||
> |
|||
</u-radio> |
|||
</u-radio-group> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
props: { |
|||
radioData: { |
|||
type: Array, |
|||
default: [] |
|||
} |
|||
}, |
|||
data() { |
|||
return { |
|||
value: '' |
|||
} |
|||
}, |
|||
methods: { |
|||
changeRadio(val) { |
|||
// console.log(this.value) |
|||
this.$emit('changeRadio', val) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
</style> |
@ -0,0 +1,239 @@ |
|||
<template> |
|||
<view class="step1"> |
|||
<view class="card"> |
|||
<view class="dateBox"> |
|||
<view class="month-row"> |
|||
<view class="month">2032.08</view> |
|||
<view class="arrow"> |
|||
<u-icon name="arrow-down" :size="12" :color="'#1989FA'"></u-icon> |
|||
</view> |
|||
</view> |
|||
<view class="date_row"> |
|||
<view class="icon left"> |
|||
<u-icon name="arrow-left" :size="12" :color="'#fff'"></u-icon> |
|||
</view> |
|||
<view class="dateArr"> |
|||
<view class="date" v-for="(item,index) in dateArr" :key="index" :class="{active: index==1}"> |
|||
<view class="week">{{ item.week }}</view> |
|||
<view class="num">{{ item.num }}</view> |
|||
</view> |
|||
</view> |
|||
<view class="icon right"> |
|||
<u-icon name="arrow-right" :size="12" :color="'#fff'"></u-icon> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="card"> |
|||
<view class="timeCon"> |
|||
<view class="h2">上午</view> |
|||
<view class="time_box"> |
|||
<view class="time_item"> |
|||
<view class="lab">已过期</view> |
|||
<view class="time">06:00-07:00</view> |
|||
</view> |
|||
<view class="time_item"> |
|||
<view class="lab">已约满</view> |
|||
<view class="time">06:00-07:00</view> |
|||
</view> |
|||
<view class="time_item"> |
|||
<view class="lab">可预约</view> |
|||
<view class="time">06:00-07:00</view> |
|||
</view> |
|||
</view> |
|||
<view class="h2">下午</view> |
|||
<view class="time_box"> |
|||
<view class="time_item"> |
|||
<view class="lab">已过期</view> |
|||
<view class="time">06:00-07:00</view> |
|||
</view> |
|||
<view class="time_item"> |
|||
<view class="lab">已约满</view> |
|||
<view class="time">06:00-07:00</view> |
|||
</view> |
|||
<view class="time_item"> |
|||
<view class="lab"> |
|||
<view class="text">4/4</view> |
|||
<view class="icon right"> |
|||
<u-icon name="arrow-right" :size="12" :color="'#fff'"></u-icon> |
|||
</view> |
|||
</view> |
|||
<view class="time">06:00-07:00</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="btn_row"> |
|||
<view class="btnBorder btn" @click="changeStep(1)">管理排课计划</view> |
|||
<view class="btnBg btn" @click="changeStep(2)">编辑排课信息</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
dateArr: [ |
|||
{week: '一', num: '08'}, |
|||
{week: '二', num: '09'}, |
|||
{week: '三', num: '10'}, |
|||
{week: '四', num: '11'}, |
|||
{week: '五', num: '12'}, |
|||
] |
|||
} |
|||
}, |
|||
methods: { |
|||
changeStep(val) { |
|||
if(val==1) { |
|||
this.$goPage('/pages/recordEntry/operate/mySchedule/plan/plan') |
|||
} |
|||
// this.$emit('changeStep', val) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.card { |
|||
width: 100%; |
|||
margin-bottom: 24rpx; |
|||
overflow: hidden; |
|||
.dateBox { |
|||
padding: 36rpx 0 40rpx 0; |
|||
.month-row { |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
margin-bottom: 36rpx; |
|||
.month { |
|||
font-size: 32rpx; |
|||
color: $themC; |
|||
} |
|||
|
|||
.arrow { |
|||
margin-left: 6rpx; |
|||
} |
|||
} |
|||
|
|||
.date_row { |
|||
width: 100%; |
|||
height: 100rpx; |
|||
position: relative; |
|||
.icon { |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
background: rgba(51,51,51,0.18); |
|||
backdrop-filter: blur(4rpx); |
|||
position: absolute; |
|||
top: 50%; |
|||
transform: translateY(-50%); |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
border-radius: 50%; |
|||
&.left { |
|||
left: 16rpx; |
|||
} |
|||
&.right { |
|||
right: 16rpx; |
|||
} |
|||
} |
|||
|
|||
.dateArr { |
|||
display: flex; |
|||
padding: 0 70rpx; |
|||
justify-content: space-between; |
|||
.date { |
|||
width: 74rpx; |
|||
height: 100rpx; |
|||
border-radius: 16rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
justify-content: center; |
|||
font-size: 28rpx; |
|||
color: #333; |
|||
&.active { |
|||
background: rgba(25,137,250,0.1); |
|||
border: 2rpx solid #1989FA; |
|||
color: $themC; |
|||
} |
|||
.week { |
|||
|
|||
} |
|||
|
|||
.num { |
|||
margin-top: 4rpx; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
.card { |
|||
.timeCon { |
|||
padding: 0 24rpx 40rpx 24rpx; |
|||
} |
|||
.h2 { |
|||
line-height: 90rpx; |
|||
font-weight: 500; |
|||
color: #333; |
|||
} |
|||
|
|||
.time_box { |
|||
display: flex; |
|||
flex-wrap: wrap; |
|||
justify-content: space-between; |
|||
.time_item { |
|||
width: 30%; |
|||
height: 120rpx; |
|||
background: #F8F8F8; |
|||
border-radius: 12rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
justify-content: center; |
|||
align-items: center; |
|||
border-radius: 12rpx; |
|||
color: #333; |
|||
&.active { |
|||
background: rgba(25,137,250,0.1); |
|||
border: 2rpx solid #1989FA; |
|||
color: $themC; |
|||
} |
|||
&.disable { |
|||
opacity: 0.5; |
|||
} |
|||
.lab { |
|||
font-size: 28rpx; |
|||
font-weight: 500; |
|||
display: flex; |
|||
align-items: center; |
|||
margin-bottom: 6rpx; |
|||
.icon { |
|||
margin-left: 10rpx; |
|||
background: rgba(51,51,51,0.18); |
|||
border-radius: 50%; |
|||
padding: 4rpx; |
|||
} |
|||
} |
|||
|
|||
.time { |
|||
font-size: 24rpx; |
|||
margin-top: 4rpx; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
.btn_row { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
.btn { |
|||
width: 47%; |
|||
} |
|||
} |
|||
</style> |
@ -0,0 +1,71 @@ |
|||
<template> |
|||
<view class="pageBgImg"> |
|||
<topNavbar title="模板"></topNavbar> |
|||
<view class="pad"> |
|||
<view class="card"> |
|||
<view class="tit_row"> |
|||
<view class="tit">模板标题</view> |
|||
<view class="manage">管理</view> |
|||
</view> |
|||
<view class="ul"> |
|||
<view class="li lab"> |
|||
<view class="text">时间段</view> |
|||
<view class="text">最多人数</view> |
|||
</view> |
|||
<view class="li" v-for="(item,index) in list" :key="index"> |
|||
<view class="text">{{ item.time}}</view> |
|||
<view class="text">{{ item.num }}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
list: [ |
|||
{time: '7:00-8:00', num: '4人'}, |
|||
{time: '7:00-8:00', num: '4人'}, |
|||
{time: '7:00-8:00', num: '4人'}, |
|||
{time: '7:00-8:00', num: '4人'}, |
|||
] |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.card { |
|||
padding: 0 28rpx; |
|||
margin-bottom: 24rpx; |
|||
.tit_row { |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
border-bottom: 2rpx solid #E8E9EC; |
|||
height: 96rpx; |
|||
font-weight: 500; |
|||
.manage { |
|||
color: $themC; |
|||
} |
|||
} |
|||
.ul { |
|||
padding-bottom: 20rpx; |
|||
.li { |
|||
padding: 12rpx; |
|||
display: flex; |
|||
color: #333; |
|||
&.lab { |
|||
color: #ADADAD; |
|||
} |
|||
.text { |
|||
flex: 1; |
|||
text-align: center; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</style> |
@ -0,0 +1,18 @@ |
|||
<template> |
|||
<view class="pageBgImg"> |
|||
<topNavbar title="我的排课"></topNavbar> |
|||
<view class="pad"> |
|||
<step1></step1> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import step1 from './comp/step1' |
|||
export default { |
|||
components: { step1 } |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
</style> |
@ -0,0 +1,139 @@ |
|||
<template> |
|||
<view class="pageBgImg"> |
|||
<topNavbar title="排课计划"></topNavbar> |
|||
<view class="pad"> |
|||
<view class="card"> |
|||
<view class="row"> |
|||
<view class="lab">计划日期</view> |
|||
<view class="rightCon"> |
|||
<view class="inputBox"> |
|||
<input type="text" v-model="form.input1" placeholder="请选择"> |
|||
</view> |
|||
<view class="icon"> |
|||
<u-icon name="arrow-right" :size="12" :color="'#696B72'"></u-icon> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="row"> |
|||
<view class="lab">选择开课时间段</view> |
|||
<view class="rightCon" @click="$goPage('/pages/recordEntry/operate/mySchedule/mould/mould')"> |
|||
<view class="inputBox"> |
|||
<input type="text" v-model="form.input1" placeholder="请选择"> |
|||
</view> |
|||
<view class="icon"> |
|||
<u-icon name="arrow-right" :size="12" :color="'#696B72'"></u-icon> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="row"> |
|||
<view class="lab">训练科目</view> |
|||
<view class="rightCon"> |
|||
<myRadio @changeRadio="changeRadio" :radioData="radiolist1"></myRadio> |
|||
</view> |
|||
</view> |
|||
<view class="row"> |
|||
<view class="lab">教练车</view> |
|||
<view class="rightCon"> |
|||
<myRadio @changeRadio="changeRadio" :radioData="radiolist2"></myRadio> |
|||
</view> |
|||
</view> |
|||
<view class="row"> |
|||
<view class="lab">开放范围</view> |
|||
<view class="rightCon"> |
|||
<myRadio @changeRadio="changeRadio" :radioData="radiolist3"></myRadio> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="btnBg">确认发布</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
form: { |
|||
radio1: 1 |
|||
}, |
|||
radiolist1: [{ |
|||
name: '科目二', |
|||
id: 1, |
|||
disabled: false |
|||
}, |
|||
{ |
|||
name: '科目三', |
|||
id: 2, |
|||
disabled: false |
|||
}, |
|||
], |
|||
radiolist2: [{ |
|||
name: '浙A8888', |
|||
id: 1, |
|||
disabled: false |
|||
}, |
|||
{ |
|||
name: '浙A8889', |
|||
id: 2, |
|||
disabled: false |
|||
}, |
|||
], |
|||
radiolist3: [{ |
|||
name: '我的学员', |
|||
id: 1, |
|||
disabled: false |
|||
}, |
|||
{ |
|||
name: '所有学员', |
|||
id: 2, |
|||
disabled: false |
|||
}, |
|||
] |
|||
} |
|||
}, |
|||
methods: { |
|||
changeRadio(val) { |
|||
console.log(val) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.card { |
|||
padding: 10rpx 28rpx; |
|||
|
|||
.row { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
padding: 26rpx 0; |
|||
|
|||
.lab { |
|||
font-weight: 500; |
|||
} |
|||
} |
|||
} |
|||
.btnBg { |
|||
width: 396rpx; |
|||
margin: 120rpx auto 0 auto; |
|||
} |
|||
.rightCon { |
|||
display: flex; |
|||
align-items: center; |
|||
|
|||
.icon { |
|||
margin-left: 10rpx; |
|||
} |
|||
|
|||
.inputBox { |
|||
flex: 1; |
|||
|
|||
input { |
|||
text-align: right; |
|||
font-size: 28rpx; |
|||
color: #333; |
|||
} |
|||
} |
|||
} |
|||
</style> |
@ -0,0 +1,156 @@ |
|||
<template> |
|||
<view class="teachingDataBg"> |
|||
<topNavbar title=""></topNavbar> |
|||
<view class="topText"> |
|||
<view class="h3">专属您的</view> |
|||
<view class="h4">教学数据</view> |
|||
</view> |
|||
<view class="pad"> |
|||
<view class="card"> |
|||
<view class="top_row"> |
|||
<view class="topItem"> |
|||
<view class="lab">历史服务学员</view> |
|||
<view class="val">100人</view> |
|||
</view> |
|||
<view class="topItem"> |
|||
<view class="lab">结业人数</view> |
|||
<view class="val">130人</view> |
|||
</view> |
|||
<view class="topItem"> |
|||
<view class="lab">服务中人数</view> |
|||
<view class="val">13人</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="title"> |
|||
<view class="txt">结业率高达</view> |
|||
<view class="num">90%</view> |
|||
</view> |
|||
<view class="ul"> |
|||
<view class="li"> |
|||
<view class="lab">科目一平均通过时间</view> |
|||
<view class="val">12天</view> |
|||
</view> |
|||
<view class="li"> |
|||
<view class="lab">科目二平均通过时间</view> |
|||
<view class="val">12天</view> |
|||
</view> |
|||
<view class="li"> |
|||
<view class="lab">科目三平均通过时间</view> |
|||
<view class="val">12天</view> |
|||
</view> |
|||
<view class="li"> |
|||
<view class="lab">科目四平均通过时间</view> |
|||
<view class="val">12天</view> |
|||
</view> |
|||
</view> |
|||
<view class="title"> |
|||
<view class="txt">平均拿证时间</view> |
|||
<view class="num">47天</view> |
|||
</view> |
|||
<view class="btnBorder">立即分享</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.teachingDataBg { |
|||
width: 100%; |
|||
background: url('http://192.168.1.20:81/zhili/image/20230818/409dca21dfec44eb8477e056ee23e437.png') #f6f6f6 no-repeat; |
|||
background-size: 100% 544rpx; |
|||
min-height: 100vh; |
|||
font-size: 28rpx; |
|||
padding-bottom: 40rpx; |
|||
.topText { |
|||
padding: 56rpx 34rpx 84rpx 34rpx; |
|||
color: #fff; |
|||
font-weight: 600; |
|||
|
|||
.h3 { |
|||
font-size: 42rpx; |
|||
} |
|||
|
|||
.h4 { |
|||
font-size: 64rpx; |
|||
} |
|||
} |
|||
.card { |
|||
.top_row { |
|||
display: flex; |
|||
height: 214rpx; |
|||
margin-bottom: 14rpx; |
|||
.topItem { |
|||
flex: 1; |
|||
text-align: center; |
|||
.lab { |
|||
font-size: 28rpx; |
|||
color: #333; |
|||
margin: 48rpx 0 24rpx 0; |
|||
} |
|||
|
|||
.val { |
|||
color: $themC; |
|||
font-size: 40rpx; |
|||
font-weight: 500; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
.title { |
|||
display: flex; |
|||
align-items: center; |
|||
width: 100%; |
|||
height: 98rpx; |
|||
background: linear-gradient(188deg, #F6F6F6 0%, #80C1F6 100%, #80C1F6 100%); |
|||
margin-bottom: 40rpx; |
|||
color: #FFFFFF; |
|||
.txt { |
|||
font-weight: 500; |
|||
line-height: 56px; |
|||
text-shadow: 0px 4px 6px #1274D6; |
|||
font-size: 40rpx; |
|||
margin: 0 40rpx 0 28rpx; |
|||
font-weight: 500; |
|||
} |
|||
|
|||
.num { |
|||
font-size: 72rpx; |
|||
text-shadow: 0px 4px 8px #084787; |
|||
} |
|||
} |
|||
|
|||
.ul { |
|||
display: flex; |
|||
flex-wrap: wrap; |
|||
justify-content: space-between; |
|||
padding: 0 28rpx; |
|||
.li { |
|||
width: 49%; |
|||
text-align: center; |
|||
margin-bottom: 20rpx; |
|||
background: #fff; |
|||
border-radius: 16rpx; |
|||
height: 196rpx; |
|||
.lab { |
|||
font-size: 28rpx; |
|||
margin: 36rpx 0 26rpx 0; |
|||
} |
|||
|
|||
.val { |
|||
font-size: 40rpx; |
|||
color: $themC; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.btnBorder { |
|||
width: 396rpx; |
|||
margin: 79rpx auto; |
|||
} |
|||
} |
|||
</style> |
Write
Preview
Loading…
Cancel
Save
Reference in new issue