15 changed files with 846 additions and 255 deletions
-
45components/myCheckbox/myCheckbox.vue
-
5components/myRadio/myRadio.vue
-
34components/mySelect/mySelect.vue
-
19pages.json
-
6pages/indexEntry/settlement/settlement.vue
-
96pages/recordEntry/operate/mySchedule/comp/mySchedulePopup.vue
-
239pages/recordEntry/operate/mySchedule/comp/step1.vue
-
89pages/recordEntry/operate/mySchedule/detail/detail.vue
-
2pages/recordEntry/operate/mySchedule/mould/mould.vue
-
190pages/recordEntry/operate/mySchedule/mouldEdit/mouldEdit.vue
-
313pages/recordEntry/operate/mySchedule/mySchedule.vue
-
28pages/recordEntry/operate/mySchedule/plan/plan.vue
-
31pages/tabbar/statistics/index.vue
-
4pages/userCenter/myCar/myCar.vue
-
BINstatic/images/coach/tianjia.png
@ -0,0 +1,45 @@ |
|||
<template> |
|||
<u-checkbox-group |
|||
v-model="value" |
|||
placement="row" |
|||
@change="checkboxChange" |
|||
> |
|||
<u-checkbox |
|||
:customStyle="{marginRight: '8px'}" |
|||
v-for="(item, index) in checkData" |
|||
:key="index" |
|||
:label="item.name" |
|||
:name="item.id" |
|||
> |
|||
</u-checkbox> |
|||
</u-checkbox-group> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
props: { |
|||
checkData: { |
|||
type: Array, |
|||
default: [] |
|||
} |
|||
}, |
|||
data() { |
|||
return { |
|||
value: [] |
|||
} |
|||
}, |
|||
mounted() { |
|||
this.$on('upDateCheck',(val)=>{ |
|||
this.value = val |
|||
}) |
|||
}, |
|||
methods: { |
|||
checkboxChange(val) { |
|||
this.$emit('changeCheck', val) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
</style> |
|||
@ -0,0 +1,34 @@ |
|||
<template> |
|||
<view class="mySelect"> |
|||
<view class="text hui" v-if="!value">{{ placeholder }}</view> |
|||
<view class="text" v-else>{{ value }}</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
props: { |
|||
value: { |
|||
type: String, |
|||
default: '' |
|||
}, |
|||
placeholder: { |
|||
type: String, |
|||
default: '请选择' |
|||
} |
|||
}, |
|||
data() { |
|||
return {} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.mySelect { |
|||
color: #333; |
|||
font-size: 26rpx; |
|||
.hui { |
|||
color: #ADADAD; |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,96 @@ |
|||
<template> |
|||
<view class="box"> |
|||
<view class="item"> |
|||
<view class="lab">科目类型</view> |
|||
<view class="val"> |
|||
<myRadio :radioData="radioData1"/> |
|||
</view> |
|||
</view> |
|||
<view class="item"> |
|||
<view class="lab">我的教练车</view> |
|||
<view class="val"> |
|||
<myRadio :radioData="radioData2"/> |
|||
</view> |
|||
</view> |
|||
<view class="item"> |
|||
<view class="lab">可约人数</view> |
|||
<view class="val"> |
|||
<myRadio :radioData="radioData3"/> |
|||
</view> |
|||
</view> |
|||
<view class="item"> |
|||
<view class="lab">开放范围</view> |
|||
<view class="val"> |
|||
<myRadio :radioData="radioData4"/> |
|||
</view> |
|||
</view> |
|||
<view class="btn_row"> |
|||
<view class="btnBorder btn" @click="confirmPopup(0)">取消</view> |
|||
<view class="btnBg btn" @click="confirmPopup(1)">确认</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
radioData1: [ |
|||
{name: '不限', id: 0}, |
|||
{name: '科目二', id: 1}, |
|||
{name: '科目三', id: 2}, |
|||
], |
|||
radioData2: [ |
|||
{name: '浙A66666学', id: 0}, |
|||
{name: '浙A66667学', id: 0}, |
|||
], |
|||
radioData3: [ |
|||
{name: '1人', id: 0}, |
|||
{name: '2人', id: 1}, |
|||
{name: '3人', id: 2}, |
|||
{name: '4人', id: 4}, |
|||
], |
|||
radioData4: [ |
|||
{name: '我的学员', id: 0}, |
|||
{name: '本校学员', id: 1} |
|||
] |
|||
} |
|||
}, |
|||
methods: { |
|||
confirmPopup(val) { |
|||
this.$emit('confirmPopup', val) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.box { |
|||
padding: 28rpx; |
|||
width: 638rpx; |
|||
.item { |
|||
.lab { |
|||
font-size: 30rpx; |
|||
margin-bottom: 38rpx; |
|||
} |
|||
|
|||
.val { |
|||
margin-bottom: 56rpx; |
|||
|
|||
} |
|||
} |
|||
|
|||
.btn_row { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
padding: 0 30rpx; |
|||
.btnBorder { |
|||
|
|||
} |
|||
.btn {width: 47%;} |
|||
.btnBg { |
|||
|
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
@ -1,239 +0,0 @@ |
|||
<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,89 @@ |
|||
<template> |
|||
<view class="pageBgImg"> |
|||
<topNavbar title="我的排课详情"></topNavbar> |
|||
<view class="pad"> |
|||
<view class="card"> |
|||
<view class="info"> |
|||
<view class="row"> |
|||
<view class="lab">训练科目：</view> |
|||
<view class="val">科目二</view> |
|||
</view> |
|||
<view class="row"> |
|||
<view class="lab">预约车辆：</view> |
|||
<view class="val">02号车（浙A98299）</view> |
|||
</view> |
|||
<view class="row"> |
|||
<view class="lab">开放范围：</view> |
|||
<view class="val">我的学员</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="h1">预约学员</view> |
|||
<view class="ul"> |
|||
<view class="li" v-for="(item,index) in 4" :key="index"> |
|||
<view class="name">张三三 <text> 17628378888</text></view> |
|||
<view class="time">提交预约时间：2023/08/06 09:12:33</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.pad { |
|||
.card { |
|||
padding: 0 28rpx; |
|||
.info { |
|||
padding: 20rpx 0; |
|||
.row { |
|||
display: flex; |
|||
font-size: 28rpx; |
|||
color: #333; |
|||
padding: 20rpx 0; |
|||
.lab { |
|||
width: 150rpx; |
|||
} |
|||
|
|||
.val { |
|||
|
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
.h1 { |
|||
line-height: 108rpx; |
|||
} |
|||
|
|||
.ul { |
|||
|
|||
.li { |
|||
height: 180rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
background: #FFFFFF; |
|||
border-radius: 16rpx; |
|||
justify-content: center; |
|||
margin-bottom: 20rpx; |
|||
padding: 0 28rpx; |
|||
.name { |
|||
font-size: 32rpx; |
|||
font-weight: 600; |
|||
text { |
|||
font-weight: 400; |
|||
margin-left: 10rpx; |
|||
} |
|||
} |
|||
|
|||
.time { |
|||
font-size: 28rpx; |
|||
margin-top: 24rpx; |
|||
color: #ADADAD; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,190 @@ |
|||
<template> |
|||
<view class="pageBgImg"> |
|||
<topNavbar title="添加编辑模版"></topNavbar> |
|||
<view class="pad"> |
|||
<view class="card"> |
|||
<view class="tit flex"> |
|||
<view class="lab">模板标题</view> |
|||
<view class="inputBox my"> |
|||
<u--input placeholder="请输入内容" border="none" v-model="FormData.title" ></u--input> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="card timeCon" v-for="(item,index) in FormData.tiemArr"> |
|||
<view class="deleteIcon" @click="deleteFn(item.id)"> |
|||
<u-icon name="close-circle-fill" color="#ADADAD" size="22"></u-icon> |
|||
</view> |
|||
<view class="row"> |
|||
<view class="lab">选择时间段</view> |
|||
<view class="flex"> |
|||
<view class="timeTag" > |
|||
<mySelect :value="item.startTime" @click="showTime(item,'startTime')" placeholder="开始时间"></mySelect> |
|||
</view> |
|||
<view class="line"></view> |
|||
<view class="timeTag" @click.capture="showTime(item,'endTime')"> |
|||
<mySelect :value="item.startTime" @click="showTime(item,'startTime')" placeholder="结束时间"></mySelect> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="row"> |
|||
<view class="lab">选择人数</view> |
|||
<view class="numBox"> |
|||
<u-number-box v-model="item.people" :max="10"></u-number-box> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="add" @click="addFn"> |
|||
<view class="addIcon"> |
|||
<image src="@/static/images/coach/tianjia.png" mode=""></image> |
|||
</view> |
|||
<view class="text">添加</view> |
|||
</view> |
|||
|
|||
<view class="btnBg">保存为模板</view> |
|||
</view> |
|||
|
|||
<u-datetime-picker |
|||
:show="show" |
|||
v-model="value1" |
|||
mode="time" |
|||
@confirm="confirmTime" |
|||
></u-datetime-picker> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
FormData: { |
|||
title: '', |
|||
tiemArr: [ |
|||
{startTime: '',endTime: '', people: 1, id: new Date() * 1} |
|||
] |
|||
}, |
|||
show: false, |
|||
value1: '' |
|||
} |
|||
}, |
|||
methods: { |
|||
addFn() { |
|||
let obj = {startTime: '',endTime: '', people: 1, id: new Date() * 1} |
|||
this.FormData.tiemArr.push(obj) |
|||
}, |
|||
deleteFn(id) { |
|||
let arr = this.FormData.tiemArr |
|||
if(arr.length==1) return |
|||
let index = arr.findIndex(item=>item.id==id) |
|||
if(index==-1) return |
|||
arr.splice(index, 1) |
|||
}, |
|||
confirmTime(val) { |
|||
console.log(val.value) |
|||
this.show = false |
|||
}, |
|||
showTime(item, name) { |
|||
this.show = true |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.pageBgImg { |
|||
.pad { |
|||
.card { |
|||
padding: 0 28rpx; |
|||
margin-bottom: 20rpx; |
|||
&.timeCon { |
|||
padding: 28rpx; |
|||
} |
|||
.tit { |
|||
height: 96rpx; |
|||
background: #FFFFFF; |
|||
border-radius: 16px; |
|||
.lab { |
|||
width: 172rpx; |
|||
font-weight: 500; |
|||
color: #333333; |
|||
} |
|||
|
|||
.inputBox.my { |
|||
flex: 1; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.card { |
|||
position: relative; |
|||
.deleteIcon { |
|||
position: absolute; |
|||
right: 20rpx; |
|||
top: 20rpx |
|||
} |
|||
|
|||
.row { |
|||
padding: 12rpx 0; |
|||
display: flex; |
|||
align-items: center; |
|||
.lab { |
|||
font-size: 30rpx; |
|||
width: 172rpx; |
|||
|
|||
flex-shrink: 0; |
|||
} |
|||
|
|||
.flex { |
|||
.timeTag { |
|||
// padding: 8rpx 14rpx; |
|||
background: #F8F8F8; |
|||
border-radius: 34rpx; |
|||
width: 150rpx; |
|||
text-align: center; |
|||
height: 52rpx; |
|||
line-height: 52rpx; |
|||
// width:fit-content; |
|||
input { |
|||
display: block; |
|||
width: 100%; |
|||
height: 100%; |
|||
font-size: 26rpx; |
|||
color: #333333; |
|||
} |
|||
} |
|||
|
|||
.line { |
|||
width: 26rpx; |
|||
height: 2rpx; |
|||
background: #DADADA; |
|||
margin: 0 14rpx; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
.add { |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
padding-top: 20rpx; |
|||
.addIcon { |
|||
width: 36rpx; |
|||
height: 36rpx; |
|||
} |
|||
|
|||
.text { |
|||
font-size: 28rpx; |
|||
color: $themC; |
|||
margin-left: 10rpx; |
|||
} |
|||
} |
|||
|
|||
.btnBg { |
|||
width: 396rpx; |
|||
margin: 96rpx auto 20rpx auto; |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
|
After Width: 36 | Height: 36 | Size: 689 B |
Write
Preview
Loading…
Cancel
Save
Reference in new issue