performance.vue 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113
  1. <template>
  2. <view>
  3. <view class="info-wrap">
  4. <u-navbar
  5. title="我的业绩"
  6. title-color="#fff"
  7. :custom-back="customBack"
  8. :border-bottom="false"
  9. back-icon-color="#CCE8FF"
  10. :background="{background: 'none' }"></u-navbar>
  11. <view class="info">
  12. <view class="payee-no">工号:{{vuexUser.payeeNo}}</view>
  13. <!-- <view class="current-time">{{$u.timeFormat(currentTime, 'yyyy年mm月dd日 hh:MM:ss')}}</view> -->
  14. </view>
  15. </view>
  16. <!-- <view class="calendar-wrap">
  17. <u-calendar v-model="calendarShow" mode="date" @change="calendarChange"></u-calendar>
  18. </view> -->
  19. <view class="statistics">
  20. <view class="statistics-title">实收数(聚合)</view>
  21. <view class="statistics-total">
  22. <span class="number">1380.30</span>
  23. </view>
  24. <view class="statistics-item u-flex">
  25. <view class="statistics-item-cell">
  26. <view class="til">入场数</view>
  27. <view class="con">26</view>
  28. </view>
  29. <view class="statistics-item-cell">
  30. <view class="til">出场数</view>
  31. <view class="con">18</view>
  32. </view>
  33. <view class="statistics-item-cell">
  34. <view class="til">应收数</view>
  35. <view class="con">2215.00</view>
  36. </view>
  37. </view>
  38. </view>
  39. <view class="time" @click="selectTime">
  40. {{pickerYear}}年{{pickerMonth}}月<span class="dd">{{pickerDay}}</span>日
  41. <u-icon name="arrow-down-fill" color="#3D3D3D" size="28"></u-icon>
  42. </view>
  43. <u-picker v-model="pickerShow" mode="time" :params="pickerParams" @confirm="confirmTime"></u-picker>
  44. </view>
  45. </template>
  46. <script>
  47. export default{
  48. data(){
  49. return{
  50. vuexUser:'',
  51. currentTime: new Date().getTime(),
  52. calendarShow:true,
  53. pickerShow:false,
  54. pickerParams: {
  55. year: true,
  56. month: true,
  57. day: true,
  58. hour: false,
  59. minute: false,
  60. second: false
  61. },
  62. pickerYear:'',
  63. pickerMonth:'',
  64. pickerDay:'',
  65. }
  66. },
  67. onLoad(){
  68. this.vuexUser = this.$store.state.vuex_user;
  69. let date = new Date().getTime();
  70. this.pickerYear = this.$u.timeFormat(date, 'yyyy');
  71. this.pickerMonth = this.$u.timeFormat(date, 'mm');
  72. this.pickerDay = this.$u.timeFormat(date, 'dd');
  73. },
  74. onShow(){
  75. },
  76. methods:{
  77. customBack(){
  78. this.$u.route({
  79. // type:'switchTab',
  80. url: 'pages/index/index'
  81. });
  82. },
  83. calendarChange(e){
  84. console.log('e',e);
  85. this.calendarShow = true;
  86. },
  87. selectTime(){
  88. this.pickerShow = true;
  89. },
  90. confirmTime(e){
  91. console.log('confirmTime e',e);
  92. this.pickerYear = e.year;
  93. this.pickerMonth = e.month;
  94. this.pickerDay = e.day;
  95. }
  96. },
  97. computed:{
  98. theTime(){
  99. return this.pickerYear+this.pickerMonth+this.pickerDay
  100. }
  101. }
  102. }
  103. </script>
  104. <style lang="scss" scoped>
  105. @import './performance.scss'
  106. </style>