22 changed files with 149 additions and 971 deletions
-
2App.vue
-
7components/UserTab/UserTab.vue
-
2components/user-info/user-info.vue
-
54pages.json
-
39pages/login/login.vue
-
2pages/tabbar/examSimulation/comp/coach.vue
-
2pages/tabbar/examSimulation/index.vue
-
78pages/tabbar/mine/index.vue
-
8pages/tabbar/operateTrain/index.vue
-
2pages/tabbar/statistics/comp/examinCoach.vue
-
6pages/tabbar/statistics/index.vue
-
3pages/tabbar/student/index.vue
-
174pages/userCenter/statistics/comp/columnChart.vue
-
186pages/userCenter/statistics/comp/comp.scss
-
117pages/userCenter/statistics/comp/examinCoach.vue
-
76pages/userCenter/statistics/comp/operateCoach.vue
-
99pages/userCenter/statistics/comp/principal.vue
-
51pages/userCenter/statistics/comp/stage.vue
-
74pages/userCenter/statistics/comp/tabDate.vue
-
55pages/userCenter/statistics/comp/topUserInfo.vue
-
76pages/userCenter/statistics/index.vue
-
3store/modules/user.js
@ -1,174 +0,0 @@ |
|||||
<template> |
|
||||
<view class="charts-box"> |
|
||||
<qiun-data-charts |
|
||||
type="line" |
|
||||
:opts="opts" |
|
||||
:chartData="chartData" |
|
||||
/> |
|
||||
</view> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
export default { |
|
||||
data() { |
|
||||
return { |
|
||||
chartData: {}, |
|
||||
//这里的 opts 是图表类型 type="column" 的全部配置参数，您可以将此配置复制到 config-ucharts.js 文件中下标为 ['column'] 的节点中来覆盖全局默认参数。实际应用过程中 opts 只需传入与全局默认参数中不一致的【某一个属性】即可实现同类型的图表显示不同的样式，达到页面简洁的需求。 |
|
||||
opts: { |
|
||||
timing: "easeOut", |
|
||||
duration: 1000, |
|
||||
rotate: false, |
|
||||
rotateLock: false, |
|
||||
color: ["#1890FF","#91CB74","#FAC858","#EE6666","#73C0DE","#3CA272","#FC8452","#9A60B4","#ea7ccc"], |
|
||||
padding: [15,15,0,5], |
|
||||
fontSize: 13, |
|
||||
fontColor: "#1989FA", |
|
||||
dataLabel: true, |
|
||||
dataPointShape: true, |
|
||||
dataPointShapeType: "solid", |
|
||||
touchMoveLimit: 60, |
|
||||
enableScroll: false, |
|
||||
enableMarkLine: false, |
|
||||
legend: { |
|
||||
show: false, |
|
||||
position: "bottom", |
|
||||
float: "center", |
|
||||
padding: 5, |
|
||||
margin: 5, |
|
||||
backgroundColor: "rgba(0,0,0,0)", |
|
||||
borderColor: "rgba(0,0,0,0)", |
|
||||
borderWidth: 0, |
|
||||
fontSize: 13, |
|
||||
fontColor: "#666666", |
|
||||
lineHeight: 11, |
|
||||
hiddenColor: "#CECECE", |
|
||||
itemGap: 10 |
|
||||
}, |
|
||||
xAxis: { |
|
||||
disableGrid: true, |
|
||||
disabled: false, |
|
||||
axisLine: true, |
|
||||
axisLineColor: "#E8E9EC", |
|
||||
calibration: false, |
|
||||
fontColor: "#686B73", |
|
||||
fontSize: 12, |
|
||||
lineHeight: 20, |
|
||||
marginTop: 0, |
|
||||
rotateLabel: false, |
|
||||
rotateAngle: 45, |
|
||||
itemCount: 5, |
|
||||
boundaryGap: "center", |
|
||||
splitNumber: 5, |
|
||||
gridColor: "#CCCCCC", |
|
||||
gridType: "solid", |
|
||||
dashLength: 4, |
|
||||
gridEval: 1, |
|
||||
scrollShow: false, |
|
||||
scrollAlign: "left", |
|
||||
scrollColor: "#A6A6A6", |
|
||||
scrollBackgroundColor: "#EFEBEF", |
|
||||
title: "", |
|
||||
titleFontSize: 13, |
|
||||
titleOffsetY: 0, |
|
||||
titleOffsetX: 0, |
|
||||
titleFontColor: "#666666", |
|
||||
format: "" |
|
||||
}, |
|
||||
yAxis: { |
|
||||
data: [ |
|
||||
{ |
|
||||
min: 0 |
|
||||
} |
|
||||
], |
|
||||
disabled: true, |
|
||||
disableGrid: false, |
|
||||
splitNumber: 5, |
|
||||
gridType: "dash", |
|
||||
dashLength: 8, |
|
||||
gridColor: "#E8E9EC", |
|
||||
padding: 10, |
|
||||
showTitle: false |
|
||||
}, |
|
||||
extra: { |
|
||||
column: { |
|
||||
type: "group", |
|
||||
width: 9, |
|
||||
activeBgColor: "#000000", |
|
||||
activeBgOpacity: 0.08, |
|
||||
seriesGap: 2, |
|
||||
categoryGap: 3, |
|
||||
barBorderCircle: false, |
|
||||
linearType: "none", |
|
||||
linearOpacity: 1, |
|
||||
colorStop: 0, |
|
||||
meterBorder: 1, |
|
||||
meterFillColor: "#FFFFFF", |
|
||||
labelPosition: "outside" |
|
||||
}, |
|
||||
tooltip: { |
|
||||
showBox: false, |
|
||||
showArrow: true, |
|
||||
showCategory: false, |
|
||||
borderWidth: 0, |
|
||||
borderRadius: 0, |
|
||||
borderColor: "#000000", |
|
||||
borderOpacity: 0.7, |
|
||||
bgColor: "#000000", |
|
||||
bgOpacity: 0.7, |
|
||||
gridType: "solid", |
|
||||
dashLength: 4, |
|
||||
gridColor: "#CCCCCC", |
|
||||
boxPadding: 3, |
|
||||
fontSize: 12, |
|
||||
lineHeight: 20, |
|
||||
fontColor: "#FFFFFF", |
|
||||
legendShow: true, |
|
||||
legendShape: "auto", |
|
||||
splitLine: true, |
|
||||
horizentalLine: false, |
|
||||
xAxisLabel: false, |
|
||||
yAxisLabel: false, |
|
||||
labelBgColor: "#FFFFFF", |
|
||||
labelBgOpacity: 0.7, |
|
||||
labelFontColor: "#666666" |
|
||||
}, |
|
||||
markLine: { |
|
||||
type: "solid", |
|
||||
dashLength: 4, |
|
||||
data: [] |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
}; |
|
||||
}, |
|
||||
mounted() { |
|
||||
this.getServerData(); |
|
||||
}, |
|
||||
methods: { |
|
||||
getServerData() { |
|
||||
//模拟从服务器获取数据时的延时 |
|
||||
setTimeout(() => { |
|
||||
//模拟服务器返回数据，如果数据格式和标准格式不同，需自行按下面的格式拼接 |
|
||||
let res = { |
|
||||
categories: ["08/01","08/02","08/03","08/04","08/05","08/06"], |
|
||||
series: [ |
|
||||
{ |
|
||||
name: "目标值", |
|
||||
data: [35,16,31,33,35,36,] |
|
||||
} |
|
||||
] |
|
||||
}; |
|
||||
this.chartData = JSON.parse(JSON.stringify(res)); |
|
||||
}, 500); |
|
||||
}, |
|
||||
} |
|
||||
}; |
|
||||
</script> |
|
||||
|
|
||||
<style scoped> |
|
||||
/* 请根据实际需求修改父元素尺寸，组件自动识别宽高 */ |
|
||||
.charts-box { |
|
||||
width: 100%; |
|
||||
height: 100%; |
|
||||
} |
|
||||
</style> |
|
||||
@ -1,186 +0,0 @@ |
|||||
|
|
||||
|
|
||||
.pageBgImg { |
|
||||
width: 100%; |
|
||||
// background: url('http://192.168.1.20:81/zhili/image/20230824/30073140957f4349b6579cb0ff00d4b1.png') #F6F6F6 no-repeat; |
|
||||
// background-size: 100% 492rpx; |
|
||||
padding: 40rpx 28rpx 140rpx 28rpx; |
|
||||
.userInfo { |
|
||||
|
|
||||
.tit { |
|
||||
font-size: 48rpx; |
|
||||
color: #fff; |
|
||||
font-weight: 500; |
|
||||
} |
|
||||
|
|
||||
.userRow { |
|
||||
align-items: center; |
|
||||
margin-bottom: 20rpx; |
|
||||
.schoolIcon { |
|
||||
width: 28rpx; |
|
||||
height: 28rpx; |
|
||||
} |
|
||||
|
|
||||
.schoolName { |
|
||||
font-size: 28rpx; |
|
||||
padding: 20rpx; |
|
||||
max-width: 220rpx; |
|
||||
color: #fff; |
|
||||
} |
|
||||
|
|
||||
.tag { |
|
||||
min-width: 112rpx; |
|
||||
height: 44rpx; |
|
||||
padding: 0 20rpx; |
|
||||
background: #82AFDD; |
|
||||
border-radius: 22rpx; |
|
||||
font-size: 20rpx; |
|
||||
color: #fff; |
|
||||
line-height: 44rpx; |
|
||||
text-align: center; |
|
||||
white-space: nowrap; |
|
||||
width: fit-content; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.priceBox { |
|
||||
padding: 32rpx; |
|
||||
color: $themC; |
|
||||
.blueLab { |
|
||||
font-weight: 500; |
|
||||
font-size: 28rpx; |
|
||||
} |
|
||||
|
|
||||
.price { |
|
||||
font-size: 56rpx; |
|
||||
font-weight: 600; |
|
||||
padding: 12rpx 0 24rpx 0; |
|
||||
} |
|
||||
.toDay { |
|
||||
padding: 14rpx 0; |
|
||||
border-top: 2rpx dashed #E8E9EC; |
|
||||
border-bottom: 2rpx dashed #E8E9EC; |
|
||||
margin-bottom: 20rpx; |
|
||||
.row { |
|
||||
padding: 16rpx 0; |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
.lab { |
|
||||
color: #686B73; |
|
||||
font-size: 24rpx; |
|
||||
width: 210rpx; |
|
||||
} |
|
||||
.val { |
|
||||
font-size: 28rpx; |
|
||||
font-weight: 600; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.flex-b { |
|
||||
|
|
||||
.data { |
|
||||
font-size: 24rpx; |
|
||||
color: #363A44; |
|
||||
} |
|
||||
|
|
||||
.refresh { |
|
||||
width: 130rpx; |
|
||||
height: 60rpx; |
|
||||
background: rgba(25,137,250,0.1); |
|
||||
border-radius: 8rpx; |
|
||||
border: 2rpx solid #1989FA; |
|
||||
line-height: 60rpx; |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
justify-content: center; |
|
||||
.text { |
|
||||
font-size: 28rpx; |
|
||||
} |
|
||||
|
|
||||
.icon { |
|
||||
width: 24rpx; |
|
||||
height: 24rpx; |
|
||||
margin-left: 6rpx; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.h1 { |
|
||||
margin: 32rpx 0 24rpx 0; |
|
||||
} |
|
||||
|
|
||||
.tabs { |
|
||||
display: flex; |
|
||||
justify-content: space-between; |
|
||||
padding-bottom: 24rpx; |
|
||||
.tab { |
|
||||
width: 96rpx; |
|
||||
height: 60rpx; |
|
||||
background: rgba(25,137,250,0.1); |
|
||||
border-radius: 8rpx; |
|
||||
border: 2rpx solid #1989FA; |
|
||||
font-size: 28rpx; |
|
||||
text-align: center; |
|
||||
line-height: 60rpx; |
|
||||
color: $themC; |
|
||||
&.active { |
|
||||
color: #fff; |
|
||||
background-color: $themC; |
|
||||
} |
|
||||
&.long { |
|
||||
min-width: 336rpx; |
|
||||
width: fit-content !important; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.card { |
|
||||
margin-bottom: 20rpx; |
|
||||
.chart { |
|
||||
|
|
||||
} |
|
||||
} |
|
||||
.moreBtn { |
|
||||
width: 200rpx; |
|
||||
height: 60rpx; |
|
||||
background: #FFFFFF; |
|
||||
border-radius: 8rpx; |
|
||||
border: 2rpx solid #E8E9EC; |
|
||||
color: #ADADAD; |
|
||||
text-align: center; |
|
||||
line-height: 60rpx; |
|
||||
margin: 32rpx auto 8rpx auto; |
|
||||
} |
|
||||
} |
|
||||
.chart { |
|
||||
width:100%; |
|
||||
height: 390rpx; |
|
||||
background: #FFFFFF; |
|
||||
border-radius: 16rpx; |
|
||||
padding: 28rpx; |
|
||||
} |
|
||||
|
|
||||
.toDayServe { |
|
||||
display: flex; |
|
||||
justify-content: space-around; |
|
||||
padding: 20rpx 0; |
|
||||
.serveItem { |
|
||||
width: 33%; |
|
||||
width: 140rpx; |
|
||||
height: 146rpx; |
|
||||
background: rgba(25,137,250,0.06); |
|
||||
border-radius: 12rpx; |
|
||||
text-align: center; |
|
||||
.lab { |
|
||||
font-size: 24rpx; |
|
||||
margin: 18rpx 0 16rpx 0; |
|
||||
} |
|
||||
.val { |
|
||||
font-size: 56rpx; |
|
||||
font-weight: 600; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
@ -1,117 +0,0 @@ |
|||||
<template> |
|
||||
<view class="content"> |
|
||||
<view class="userInfo"> |
|
||||
<view class="tit">Hi,{{ vuex_userInfo.user.nickname }}</view> |
|
||||
<view class="flex userRow"> |
|
||||
<view class="schoolIcon"> |
|
||||
<image src="@/static/images/index/ic_jiaxiao.png" mode=""></image> |
|
||||
</view> |
|
||||
<view class="schoolName oneRowText">缺字段</view> |
|
||||
<view class="tag">{{identity}}</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="card priceBox"> |
|
||||
<view class="blueLab">今日待服务</view> |
|
||||
<view class="toDayServe"> |
|
||||
<view class="serveItem"> |
|
||||
<view class="lab">科目二</view> |
|
||||
<view class="val">6</view> |
|
||||
</view> |
|
||||
<view class="serveItem"> |
|
||||
<view class="lab">科目三</view> |
|
||||
<view class="val">10</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="flex-b"> |
|
||||
<view class="data">截止：2023/08/08 11:00:00</view> |
|
||||
<view class="refresh"> |
|
||||
<view class="text">刷新</view> |
|
||||
<view class="icon"> |
|
||||
<image src="@/static/images/index/ic_shuaxin.png" mode=""></image> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
|
|
||||
<view class="h1">服务次数统计</view> |
|
||||
<view class="navBox"> |
|
||||
<cardNav :navData="navData" :currentNav="currentNav" @changeNav="changeNav"></cardNav> |
|
||||
</view> |
|
||||
<view class="tab_box"> |
|
||||
<tabDate/> |
|
||||
</view> |
|
||||
|
|
||||
<view class="card"> |
|
||||
<view class="chart"> |
|
||||
<columnChart/> |
|
||||
</view> |
|
||||
</view> |
|
||||
|
|
||||
|
|
||||
<view class="h1">服务学员人数统计</view> |
|
||||
<view class="tab_box"> |
|
||||
<tabDate/> |
|
||||
</view> |
|
||||
<view class="card"> |
|
||||
<view class="chart"> |
|
||||
<columnChart/> |
|
||||
</view> |
|
||||
</view> |
|
||||
|
|
||||
<UserTab name ='统计'></UserTab> |
|
||||
|
|
||||
|
|
||||
</view> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
import stage from './stage' |
|
||||
import columnChart from './columnChart' |
|
||||
import tabDate from './tabDate' |
|
||||
export default { |
|
||||
components: { stage, columnChart, tabDate }, |
|
||||
data() { |
|
||||
return { |
|
||||
value1: '', |
|
||||
currentTab: 1, |
|
||||
currentTab2: 1, |
|
||||
showDatePicker: false, |
|
||||
navData: [ |
|
||||
{text: '全部', id: 0}, |
|
||||
{text: '科目二', id: 1}, |
|
||||
{text: '科目三', id: 2}, |
|
||||
], |
|
||||
currentNav: 1 |
|
||||
} |
|
||||
}, |
|
||||
onLoad() { |
|
||||
|
|
||||
}, |
|
||||
onShow() { |
|
||||
; |
|
||||
}, |
|
||||
methods: { |
|
||||
|
|
||||
tabClick2(num) { |
|
||||
this.currentTab2 = num |
|
||||
if(num==4) { |
|
||||
this.showDatePicker = true |
|
||||
} |
|
||||
}, |
|
||||
changeNav(num) { |
|
||||
this.currentNav = num |
|
||||
}, |
|
||||
// 2选择时间选择器里的时间 |
|
||||
selectDateClick(val) { |
|
||||
console.log(val) |
|
||||
}, |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style lang="scss" scoped> |
|
||||
@import './comp.scss'; |
|
||||
.navBox { |
|
||||
margin-bottom: 24rpx; |
|
||||
} |
|
||||
</style> |
|
||||
@ -1,76 +0,0 @@ |
|||||
<template> |
|
||||
<view class="content"> |
|
||||
<view class="userInfo"> |
|
||||
<view class="tit">Hi,大乔教练</view> |
|
||||
<view class="flex userRow"> |
|
||||
<view class="schoolIcon"> |
|
||||
<image src="@/static/images/index/ic_jiaxiao.png" mode=""></image> |
|
||||
</view> |
|
||||
<view class="schoolName oneRowText">翔力驾校</view> |
|
||||
<view class="tag">合作教练</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="card priceBox"> |
|
||||
<view class="blueLab">今日已结算金额</view> |
|
||||
<view class="price">￥36333.66</view> |
|
||||
<view class="flex-b"> |
|
||||
<view class="data">截止：2023/08/08 11:00:00</view> |
|
||||
<view class="refresh"> |
|
||||
<view class="text">刷新</view> |
|
||||
<view class="icon"> |
|
||||
<image src="@/static/images/index/ic_shuaxin.png" mode=""></image> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
|
|
||||
<view class="h1"> 结算统计</view> |
|
||||
<view class="tab_box"> |
|
||||
<tabDate/> |
|
||||
</view> |
|
||||
<view class="card"> |
|
||||
<view class="chart"> |
|
||||
<columnChart/> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="flex-b"> |
|
||||
<view class="h1">结算明细</view> |
|
||||
<moreRight text="更多"/> |
|
||||
</view> |
|
||||
<view class="record"> |
|
||||
<view class="card" v-for="(item,index) in 10" :key="index"> |
|
||||
<stage/> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="moreBtn" @click="$goPage('/pages/indexEntry/settlement/settlement')">查看更多</view> |
|
||||
<UserTab name ='统计'></UserTab> |
|
||||
</view> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
import stage from './stage' |
|
||||
import columnChart from './columnChart' |
|
||||
import tabDate from './tabDate' |
|
||||
export default { |
|
||||
components: { stage, columnChart, tabDate }, |
|
||||
data() { |
|
||||
return { |
|
||||
value1: '', |
|
||||
currentTab: 1, |
|
||||
} |
|
||||
}, |
|
||||
onLoad() { |
|
||||
|
|
||||
}, |
|
||||
methods: { |
|
||||
tabClick(num) { |
|
||||
this.currentTab = num |
|
||||
|
|
||||
}, |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style lang="scss" scoped> |
|
||||
@import './comp.scss' |
|
||||
</style> |
|
||||
@ -1,99 +0,0 @@ |
|||||
<template> |
|
||||
<view class="content"> |
|
||||
<view class="userInfo"> |
|
||||
<view class="tit">Hi,{{ vuex_userInfo.user.nickname }}</view> |
|
||||
<view class="flex userRow"> |
|
||||
<view class="schoolIcon"> |
|
||||
<image src="@/static/images/index/ic_jiaxiao.png" mode=""></image> |
|
||||
</view> |
|
||||
<view class="schoolName oneRowText">{{ vuex_userInfo.user.schoolName}}</view> |
|
||||
<view class="tag">{{ identity }}</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="card priceBox"> |
|
||||
<view class="blueLab">今日已结算金额</view> |
|
||||
<view class="price">￥36333.66</view> |
|
||||
<view class="toDay"> |
|
||||
<view class="row"> |
|
||||
<view class="lab">今日学员退款</view> |
|
||||
<view class="val">￥900</view> |
|
||||
</view> |
|
||||
<view class="row"> |
|
||||
<view class="lab">今日代收费</view> |
|
||||
<view class="val">￥900</view> |
|
||||
</view> |
|
||||
<view class="row"> |
|
||||
<view class="lab">今日学员退款</view> |
|
||||
<view class="val">￥900</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="flex-b"> |
|
||||
<view class="data">截止：2023/08/08 11:00:00</view> |
|
||||
<view class="refresh"> |
|
||||
<view class="text">刷新</view> |
|
||||
<view class="icon"> |
|
||||
<image src="@/static/images/index/ic_shuaxin.png" mode=""></image> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
|
|
||||
<view class="h1"> 收入统计</view> |
|
||||
<view class="tab_box"> |
|
||||
<tabDate/> |
|
||||
</view> |
|
||||
<view class="card"> |
|
||||
<view class="chart"> |
|
||||
<columnChart/> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="flex-b"> |
|
||||
<view class="h1">收入明细</view> |
|
||||
<moreRight text="更多"/> |
|
||||
</view> |
|
||||
<view class="record"> |
|
||||
<view class="card" v-for="(item,index) in 10" :key="index"> |
|
||||
<stage/> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="moreBtn" @click="$goPage('/pages/indexEntry/settlement/settlement')">查看更多</view> |
|
||||
<UserTab name ='统计'></UserTab> |
|
||||
</view> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
import stage from './stage' |
|
||||
import columnChart from './columnChart' |
|
||||
import tabDate from './tabDate' |
|
||||
export default { |
|
||||
components: { stage, columnChart, tabDate }, |
|
||||
data() { |
|
||||
return { |
|
||||
value1: '', |
|
||||
currentTab: 1, |
|
||||
showDatePicker: false, |
|
||||
} |
|
||||
}, |
|
||||
onLoad() { |
|
||||
|
|
||||
}, |
|
||||
methods: { |
|
||||
tabClick(num) { |
|
||||
this.currentTab = num |
|
||||
if(num==4) { |
|
||||
this.showDatePicker = true |
|
||||
} |
|
||||
}, |
|
||||
// 2选择时间选择器里的时间 |
|
||||
confirmDatePicker(val) { |
|
||||
this.showDatePicker = false |
|
||||
let date = uni.$u.date(val.value, 'yyyy-mm-dd') |
|
||||
console.log(date) |
|
||||
}, |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style lang="scss" scoped> |
|
||||
@import './comp.scss' |
|
||||
</style> |
|
||||
@ -1,51 +0,0 @@ |
|||||
<template> |
|
||||
<view class="li"> |
|
||||
<view class="name_row"> |
|
||||
<view class="name">张三三</view> |
|
||||
<view class="price">+¥1,130.86</view> |
|
||||
</view> |
|
||||
<view class="stage"> |
|
||||
<view>第一阶段</view> |
|
||||
<view>2023/08/08 10:55:21</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
</script> |
|
||||
|
|
||||
<style lang="scss" scoped> |
|
||||
.li { |
|
||||
height: 168rpx; |
|
||||
padding: 0 34rpx; |
|
||||
|
|
||||
.name_row { |
|
||||
display: flex; |
|
||||
justify-content: space-between; |
|
||||
height: 98rpx; |
|
||||
align-items: center; |
|
||||
|
|
||||
.name { |
|
||||
font-weight: 500; |
|
||||
font-size: 32rpx; |
|
||||
} |
|
||||
|
|
||||
.price { |
|
||||
font-size: 32rpx; |
|
||||
color: $themC; |
|
||||
font-weight: 500; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.stage { |
|
||||
display: flex; |
|
||||
justify-content: space-between; |
|
||||
height: 68rpx; |
|
||||
align-items: center; |
|
||||
font-size: 24rpx; |
|
||||
color: #686B73; |
|
||||
border-top: 2rpx dashed #E8E9EC; |
|
||||
; |
|
||||
} |
|
||||
} |
|
||||
</style> |
|
||||
@ -1,74 +0,0 @@ |
|||||
<template> |
|
||||
<view class="tabBox"> |
|
||||
<view class="tabs"> |
|
||||
<view class="tab" @click="tabClick(1)" :class="{active: currentTab==1}">按日</view> |
|
||||
<view class="tab" @click="tabClick(2)" :class="{active: currentTab==2}">按月</view> |
|
||||
<!-- <view class="tab" @click="tabClick(3)" :class="{active: currentTab==3}">按年</view> --> |
|
||||
<!-- <view class="tab long" @click="tabClick(4)" :class="{active: currentTab==4}">{{ customDate }}</view> --> |
|
||||
</view> |
|
||||
|
|
||||
</view> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
export default { |
|
||||
data() { |
|
||||
return { |
|
||||
currentTab: 1, |
|
||||
showDatePicker: false, |
|
||||
customDate: '自定义日期' |
|
||||
} |
|
||||
}, |
|
||||
mounted() { |
|
||||
let numDate = this.$u.utils.getCustomDay(-7) |
|
||||
console.log(numDate) |
|
||||
}, |
|
||||
methods: { |
|
||||
tabClick(num) { |
|
||||
this.currentTab = num |
|
||||
if(num==4) { |
|
||||
this.showDatePicker = true |
|
||||
} |
|
||||
}, |
|
||||
// 2选择时间选择器里的时间 |
|
||||
selectDateClick(val) { |
|
||||
if(val.date1) { |
|
||||
this.customDate = val.date1 |
|
||||
}else { |
|
||||
this.customDate = val.date2+ '至' + val.date3 |
|
||||
} |
|
||||
this.showDatePicker = false |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style lang="scss" scoped> |
|
||||
.tabs { |
|
||||
display: flex; |
|
||||
// justify-content: space-between; |
|
||||
padding-bottom: 24rpx; |
|
||||
|
|
||||
.tab { |
|
||||
width: 96rpx; |
|
||||
height: 60rpx; |
|
||||
background: rgba(25, 137, 250, 0.1); |
|
||||
border-radius: 8rpx; |
|
||||
border: 2rpx solid #1989FA; |
|
||||
font-size: 28rpx; |
|
||||
text-align: center; |
|
||||
line-height: 60rpx; |
|
||||
color: $themC; |
|
||||
margin-right: 30rpx; |
|
||||
&.active { |
|
||||
color: #fff; |
|
||||
background-color: $themC; |
|
||||
} |
|
||||
|
|
||||
&.long { |
|
||||
min-width: 336rpx; |
|
||||
width: fit-content !important; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
</style> |
|
||||
@ -1,55 +0,0 @@ |
|||||
<template> |
|
||||
<view class="userInfo"> |
|
||||
<view class="tit">Hi,{{vuex_userInfo.user.nickname}}</view> |
|
||||
<view class="flex userRow"> |
|
||||
<view class="schoolIcon"> |
|
||||
<image src="@/static/images/index/ic_jiaxiao.png" mode=""></image> |
|
||||
</view> |
|
||||
<view class="schoolName oneRowText">{{ vuex_userInfo.user.schoolName}}</view> |
|
||||
<view class="tag">{{identity}}</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
</script> |
|
||||
|
|
||||
<style lang="scss" scoped> |
|
||||
.userInfo { |
|
||||
|
|
||||
.tit { |
|
||||
font-size: 48rpx; |
|
||||
color: #fff; |
|
||||
font-weight: 500; |
|
||||
} |
|
||||
|
|
||||
.userRow { |
|
||||
align-items: center; |
|
||||
margin-bottom: 20rpx; |
|
||||
.schoolIcon { |
|
||||
width: 28rpx; |
|
||||
height: 28rpx; |
|
||||
} |
|
||||
|
|
||||
.schoolName { |
|
||||
font-size: 28rpx; |
|
||||
padding: 20rpx; |
|
||||
max-width: 420rpx; |
|
||||
color: #fff; |
|
||||
} |
|
||||
|
|
||||
.tag { |
|
||||
min-width: 112rpx; |
|
||||
height: 44rpx; |
|
||||
background: #82AFDD; |
|
||||
border-radius: 22rpx; |
|
||||
font-size: 20rpx; |
|
||||
color: #fff; |
|
||||
line-height: 44rpx; |
|
||||
text-align: center; |
|
||||
white-space: nowrap; |
|
||||
width: fit-content; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
</style> |
|
||||
@ -1,76 +0,0 @@ |
|||||
<template> |
|
||||
<view class="main"> |
|
||||
<view class="userInfo"> |
|
||||
<view class="tit">Hi,大乔教练</view> |
|
||||
<view class="flex userRow"> |
|
||||
<view class="schoolIcon"> |
|
||||
<image src="@/static/images/index/ic_jiaxiao.png" mode=""></image> |
|
||||
</view> |
|
||||
<view class="schoolName oneRowText">翔力驾校</view> |
|
||||
<view class="tag">合作教练</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="card priceBox"> |
|
||||
<view class="blueLab">今日已结算金额</view> |
|
||||
<view class="price">￥36333.66</view> |
|
||||
<view class="flex-b"> |
|
||||
<view class="data">截止：2023/08/08 11:00:00</view> |
|
||||
<view class="refresh"> |
|
||||
<view class="text">刷新</view> |
|
||||
<view class="icon"> |
|
||||
<image src="@/static/images/index/ic_shuaxin.png" mode=""></image> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
|
|
||||
<view class="h1"> 结算统计</view> |
|
||||
<view class="tab_box"> |
|
||||
<tabDate/> |
|
||||
</view> |
|
||||
<view class="card"> |
|
||||
<view class="chart"> |
|
||||
<columnChart/> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="flex-b"> |
|
||||
<view class="h1">结算明细</view> |
|
||||
<moreRight text="更多"/> |
|
||||
</view> |
|
||||
<view class="record"> |
|
||||
<view class="card" v-for="(item,index) in 10" :key="index"> |
|
||||
<stage/> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="moreBtn" @click="$goPage('/pages/indexEntry/settlement/settlement')">查看更多</view> |
|
||||
<UserTab name ='统计'></UserTab> |
|
||||
</view> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
import stage from './comp/stage' |
|
||||
import columnChart from './comp/columnChart' |
|
||||
import tabDate from './comp/tabDate' |
|
||||
export default { |
|
||||
components: { stage, columnChart, tabDate }, |
|
||||
data() { |
|
||||
return { |
|
||||
value1: '', |
|
||||
currentTab: 1, |
|
||||
} |
|
||||
}, |
|
||||
onLoad() { |
|
||||
|
|
||||
}, |
|
||||
methods: { |
|
||||
tabClick(num) { |
|
||||
this.currentTab = num |
|
||||
|
|
||||
}, |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style lang="scss" scoped> |
|
||||
@import './comp/comp.scss' |
|
||||
</style> |
|
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue