times.vue 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110
  1. <template name="times">
  2. <view>
  3. <view class="cu-timeline" v-for="(v,k) in fetch.times" :key="v.id">
  4. <view class="cu-time">{{v.name}}</view>
  5. <view class="cu-item" :class="v1.id == times ? 'text-blue' : ''" v-for="(v1,k1) in v.child" :key="v1.id" :style="{backgroundImage: v1.icon}">
  6. <view class="content" :style="{color:v1.color,backgroundColor:v1.bgcolor}">
  7. <view class="cu-capsule radius">
  8. <view class="cu-tag bg-cyan">{{v1.name}}</view>
  9. <view class="cu-tag line-white">
  10. <picker mode="date" :value="fetch.user_times[v1.id] && fetch.user_times[v1.id].day != 0 ? fetch.user_times[v1.id].day : v1.year + '-' + month + '-' + day" :start="v1.year+`-01-01`" :end="v1.year+`-12-31`" @change="selectDay" :data-year="v1.year" :data-name="v1.name" :data-id="v1.id">
  11. <view class="uni-input">{{fetch.user_times[v1.id] && fetch.user_times[v1.id].day != 0 ? fetch.user_times[v1.id].day : '正点'}}</view>
  12. </picker>
  13. </view>
  14. </view>
  15. <view @click="go(v1)">
  16. <view class="margin-top" v-if="v1.desc&& !v1.pic">{{v1.desc}}</view>
  17. <view class="margin-top" v-if="v1.pic && !v1.desc"><image :src="v1.pic" mode="widthFix" class="slide-image" style="height:auto"></image></view>
  18. </view>
  19. </view>
  20. </view>
  21. </view>
  22. </view>
  23. </template>
  24. <script>
  25. export default {
  26. name: "times",
  27. props: {
  28. content_id : {
  29. type : String,
  30. value : null
  31. },
  32. width : {
  33. type : String,
  34. default : '100%'
  35. },
  36. param : {},
  37. index : 0,
  38. times : 0,
  39. },
  40. data() {
  41. return {
  42. fetch : {},
  43. current : '',
  44. year : '',
  45. month : '',
  46. day : '',
  47. }
  48. },
  49. mounted() {
  50. this.fetch = this.param;
  51. this.getDate();
  52. },
  53. methods:{
  54. getDate : function(type) {
  55. const date = new Date();
  56. let year = date.getFullYear();
  57. let month = date.getMonth() + 1;
  58. let day = date.getDate();
  59. this.year = year;
  60. this.month = month > 9 ? month : '0' + month;;
  61. this.day = day > 9 ? day : '0' + day;
  62. this.current = this.year + '-' + this.month + '-' + this.day;
  63. },
  64. getData : function() {
  65. this.$emit('getTimes');
  66. },
  67. getInfo : function(t) {
  68. //触底刷新
  69. },
  70. go : function(times) {
  71. var self = this;
  72. this.Dever.alert('正在进入' + times.name);
  73. // 要拿到最新的page_id
  74. var day = this.fetch.user_times[times.id].day;
  75. if (day == '正点') {
  76. day = '';
  77. }
  78. this.Dever.post('app/collection/?l=api.getPageId', {code:this.Dever.config.code,times_id:times.id,day:day}, function(t) {
  79. self.Dever.location('dream/view?code=' + t.code);
  80. })
  81. },
  82. selectDay : function(res) {
  83. var times = {};
  84. times = res.currentTarget.dataset;
  85. if (!this.fetch.user_times[times.id]) {
  86. this.fetch.user_times[times.id] = {};
  87. this.fetch.user_times[times.id].day = '正点';
  88. }
  89. var old = this.fetch.user_times[times.id].day;
  90. this.fetch.user_times[times.id].day = res.detail.value;
  91. var current = times.year + '-' + this.month + '-' + this.day;
  92. if (this.fetch.user_times[times.id].day == current) {
  93. this.fetch.user_times[times.id].day = '正点';
  94. }
  95. if (old != res.detail.value) {
  96. this.go(times);
  97. }
  98. },
  99. },
  100. }
  101. </script>
  102. <style>
  103. .slide-image {
  104. }
  105. </style>