徐浩 / zzxyt-uniapp · 提交

转到一个项目

作者 mxd
提交 9f48b93540661ec19bcd936e9c46c675d67963f9 1 个父辈 fdf901a1

考勤积分

内嵌 并排对比
正在显示 3 个修改的文件 包含 105 行增加 和 71 行删除
@@ -461,7 +461,8 @@ @@ -461,7 +461,8 @@
461 "path": "tch_kq/tch_kq", 461 "path": "tch_kq/tch_kq",
462 "style": { 462 "style": {
463 "navigationBarTitleText": "考勤积分", 463 "navigationBarTitleText": "考勤积分",
464 - "enablePullDownRefresh": false 464 + "enablePullDownRefresh": false,
  465 + "navigationStyle": "custom"
465 } 466 }
466 467
467 }, { 468 }, {
1 <template> 1 <template>
2 <view class="wrap_box"> 2 <view class="wrap_box">
3 - <!-- <uParse v-if="datas" :content="datas"></uParse> -->  
4 - <view class="kq_box">  
5 - <view class="kq_bg dis_flex aic ju_c">  
6 - <image class="kq_bgimg" src="/static/images/tbbj.png" mode="widthFix"></image>  
7 - <view class="">  
8 - <text>{{allnum}}</text>分 3 + <CustomReturn title="考勤积分" color="#fff" :bgColor="bgColor">
  4 +
  5 + </CustomReturn>
  6 + <view class="bg-img">
  7 + <image src="/static/imagesV2/tch_index/bg1.png" mode="aspectFill"></image>
  8 + </view>
  9 +
  10 + <PaddingTopB>
  11 + <view class="main">
  12 + <view class="head">
  13 + <view class="head-label">
  14 + 班级考勤积分（分）
  15 + </view>
  16 + <view class="head-content">
  17 + {{allnum}}
  18 + </view>
  19 + </view>
  20 +
  21 + <view class="list">
  22 + <view class="item" v-for="(item,index) in datas" :key="index">
  23 + <view class="item-cell">
  24 + <view class="title">
  25 + {{item.title}}
  26 + </view>
  27 + <view class="value">
  28 + -{{item.class_num}}
9 </view> 29 </view>
10 </view> 30 </view>
11 - <view class="kq_list_box">  
12 - <view class="kq_list">  
13 - <view v-for="(item,index) in datas" class="kq_li">  
14 - <view class="kq_li_d1 dis_flex aic ju_b">  
15 - <view class="">{{item.title}}</view>  
16 - <view class="kq_li_num">-{{item.class_num}}</view> 31 + <view class="item-cell">
  32 + <view class="name">
  33 + 学员:{{item.uid}}
17 </view> 34 </view>
18 - <view class="kq_li_d2 dis_flex aic ju_b">  
19 - <view class="user_name oh1">学员:{{item.uid}}</view>  
20 - <view class="kq_li_num">{{item.deduct_time}}</view>  
21 - </view> </view> 35 + <view>
  36 + {{item.deduct_time}}
22 </view> 37 </view>
23 </view> 38 </view>
24 </view> 39 </view>
  40 + </view>
  41 +
  42 + </view>
  43 +
25 44
26 - <!-- 阻止滑动 -->  
27 - <!-- <view @touchmove.stop.prevent='test'></view> --> 45 + </PaddingTopB>
28 </view> 46 </view>
29 </template> 47 </template>
30 48
@@ -34,10 +52,17 @@ @@ -34,10 +52,17 @@
34 mapState, 52 mapState,
35 mapMutations 53 mapMutations
36 } from 'vuex' 54 } from 'vuex'
  55 + import CustomReturn from "@/components/CustomReturn/index.vue"
  56 + import PaddingTopB from "@/components/PaddingTopB/index.vue"
37 var that 57 var that
38 export default { 58 export default {
  59 + components: {
  60 + CustomReturn,
  61 + PaddingTopB
  62 + },
39 data() { 63 data() {
40 return { 64 return {
  65 + bgColor: 'transparent',
41 options:'', 66 options:'',
42 datas:'', 67 datas:'',
43 allnum:'', 68 allnum:'',
@@ -47,6 +72,13 @@ @@ -47,6 +72,13 @@
47 computed: { 72 computed: {
48 ...mapState(['hasLogin', 'forcedLogin', 'userName', 'userinfo','nowtime']), 73 ...mapState(['hasLogin', 'forcedLogin', 'userName', 'userinfo','nowtime']),
49 }, 74 },
  75 + onPageScroll(e) {
  76 + if(e.scrollTop > 0 ) {
  77 + this.bgColor = '#3384fc'
  78 + }else {
  79 + this.bgColor = 'transparent'
  80 + }
  81 + },
50 onLoad(e) { 82 onLoad(e) {
51 that=this 83 that=this
52 that.options=e||{} 84 that.options=e||{}
@@ -168,71 +200,72 @@ @@ -168,71 +200,72 @@
168 // #ifdef H5 200 // #ifdef H5
169 min-height: calc(100vh - 44px); 201 min-height: calc(100vh - 44px);
170 // #endif 202 // #endif
171 - background: #F8F8F8; 203 + background: #f3f4f6;
172 } 204 }
173 -.kq_box{  
174 - width: 100%;  
175 - position: relative;  
176 - .kq_bg{  
177 - position: relative;  
178 - width: 100%;  
179 - height: 250rpx;  
180 - font-size: 32rpx;  
181 - color: #fff;  
182 - .kq_bgimg{ 205 +.bg-img {
  206 + height: 504rpx;
183 position: absolute; 207 position: absolute;
184 - top: 0;  
185 - z-index: 1;  
186 width: 100%; 208 width: 100%;
187 - height: 250rpx;  
188 - font-size: 32rpx;  
189 - color: #fff;  
190 -  
191 - 209 +}
  210 +.main {
  211 + width: 100%;
  212 + padding: 25rpx;
  213 + box-sizing: border-box;
  214 +}
  215 +.head {
  216 + font-family: PingFang SC;
  217 + color: #FFFFFF;
  218 + margin-top: 50rpx;
  219 + &-label {
  220 + font-size: 30rpx;
  221 + font-weight: 500;
192 } 222 }
193 - view{  
194 - position: relative;  
195 - top: -40rpx;  
196 - z-index: 2;  
197 - text{  
198 - font-size: 72rpx; 223 + &-content {
  224 + font-size: 60rpx;
199 font-weight: bold; 225 font-weight: bold;
200 - }  
201 - } 226 + margin-top: 20rpx;
202 } 227 }
203 } 228 }
204 -.kq_list_box{  
205 - width: 100%;  
206 - padding: 30rpx;  
207 - .kq_list{  
208 - width: 100%;  
209 - background: #fff;  
210 - border-radius: 10rpx;  
211 - .kq_li{  
212 - width: 100%;  
213 - padding: 28rpx;  
214 - min-height: 150rpx; 229 +
  230 +.list {
  231 + padding: 0 30rpx;
  232 + border-radius: 20rpx;
  233 + background-color: #fff;
  234 + margin-top: 30rpx;
  235 + .item {
  236 + border-bottom: 1px solid #FAFBFA;
  237 + padding: 30rpx 0;
  238 + &:last-child {
  239 + border: 0;
  240 + }
  241 + &-cell {
215 display: flex; 242 display: flex;
216 - flex-direction: column; 243 + align-items: center;
  244 + font-family: PingFang SC;
217 justify-content: space-between; 245 justify-content: space-between;
218 - &+.kq_li{  
219 - border-top: 1px solid #f8f8f8; 246 + margin-bottom: 20rpx;
  247 + &:last-child {
  248 + margin-bottom: 0;
220 } 249 }
221 - .kq_li_d1{  
222 - font-size: 32rpx;  
223 - color: #545D71;  
224 - .user_name{  
225 - max-width: 330rpx;  
226 - line-height: 36rpx;  
227 - height: 36rpx; 250 + .title {
  251 + font-size: 30rpx;
  252 + font-weight: 500;
  253 + color: #323232;
228 } 254 }
229 - .kq_li_num{  
230 - color: #FF9000; 255 + .value {
  256 + font-size: 30rpx;
  257 + font-weight: 500;
  258 + color: #FC5101;
231 } 259 }
  260 + .name {
  261 + font-size: 26rpx;
  262 + font-weight: 500;
  263 + color: #979797;
232 } 264 }
233 - .kq_li_d2{  
234 - font-size: 28rpx;  
235 - color: #A9B1C0; 265 + .time {
  266 + font-size: 24rpx;
  267 + font-weight: 400;
  268 + color: #979797;
236 } 269 }
237 } 270 }
238 } 271 }