integralLogsList.vue 7.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357
  1. <<<<<<< HEAD
  2. <template>
  3. <view class="page">
  4. <view class="content">
  5. <mescroll-body ref="mescrollRef" @init="mescrollInit" :up="upOption" :down="downOption" @down="downCallback" @up="upCallback">
  6. <view class="item" v-for="(item) in dataList">
  7. <view class="left">
  8. <!-- <text class="title" >
  9. 完课积分领取记录
  10. </text> -->
  11. <text class="title" >
  12. {{utils.getDictLabel2Name(typeOptions,item.logType)}}
  13. </text>
  14. <view class="time">{{item.createTime}}</view>
  15. </view>
  16. <view class="right">
  17. <text :class="item.integral>0?'money green':'money red'">{{item.integral}}</text>
  18. <text class="remark">剩余积分:{{item.balance}}</text>
  19. </view>
  20. </view>
  21. </mescroll-body>
  22. </view>
  23. </view>
  24. </template>
  25. <script>
  26. import {getDictByKey} from '@/api/common.js'
  27. import {getUserIntegralLogsList} from '@/api/integral.js'
  28. import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
  29. export default {
  30. mixins: [MescrollMixin], // 使用mixin
  31. data() {
  32. return {
  33. typeOptions:[],
  34. mescroll:null,
  35. downOption: {
  36. auto:false//不要自动加载
  37. },
  38. upOption: {
  39. onScroll:false,
  40. use: true, // 是否启用上拉加载; 默认true
  41. page: {
  42. num: 0, // 当前页码,默认0,回调之前会加1,即callback(page)会从1开始
  43. size: 10 // 每页数据的数量,默认10
  44. },
  45. noMoreSize: 10, // 配置列表的总数量要大于等于5条才显示'-- END --'的提示
  46. textNoMore:"已经到底了",
  47. empty: {
  48. icon:'https://hdtobs.obs.cn-north-4.myhuaweicloud.com/hdt/empty_icon.png',
  49. tip: '暂无数据'
  50. }
  51. },
  52. dataList: []
  53. }
  54. },
  55. onLoad() {
  56. this.getDictByKey("sys_integral_log_type");
  57. },
  58. methods: {
  59. getDictByKey(key){
  60. var data={key:key}
  61. getDictByKey(data).then(
  62. res => {
  63. if(res.code==200){
  64. this.typeOptions=res.data;
  65. }
  66. },
  67. err => {
  68. }
  69. );
  70. },
  71. mescrollInit(mescroll) {
  72. this.mescroll = mescroll;
  73. },
  74. /*下拉刷新的回调 */
  75. downCallback(mescroll) {
  76. mescroll.resetUpScroll()
  77. },
  78. upCallback(page) {
  79. //联网加载数据
  80. var that = this;
  81. var data = {
  82. pageNum: page.num,
  83. pageSize: page.size
  84. };
  85. // uni.showLoading({
  86. // title:"加载中..."
  87. // })
  88. getUserIntegralLogsList(data).then(res => {
  89. uni.hideLoading()
  90. if(res.code==200){
  91. //设置列表数据
  92. if (page.num == 1) {
  93. that.dataList = res.data.list;
  94. } else {
  95. that.dataList = that.dataList.concat(res.data.list);
  96. }
  97. that.mescroll.endBySize(res.data.list.length, res.data.total);
  98. }else{
  99. uni.showToast({
  100. icon:'none',
  101. title: "请求失败",
  102. });
  103. that.dataList = null;
  104. that.mescroll.endErr();
  105. }
  106. });
  107. },
  108. }
  109. }
  110. </script>
  111. <style lang="scss" scoped>
  112. .page{
  113. }
  114. .content{
  115. display: flex;
  116. flex-direction: column;
  117. .item{
  118. background-color: #fff;
  119. padding: 20rpx 10rpx;
  120. display: flex;
  121. align-items: flex-start;
  122. justify-content: space-between;
  123. border-top: 1rpx solid #efefef;
  124. .left{
  125. display: flex;
  126. flex-direction: column;
  127. align-items: flex-start;
  128. justify-content: flex-start;
  129. .title{
  130. font-size: 26rpx;
  131. color: #111;
  132. }
  133. .time{
  134. margin-top: 20rpx;
  135. font-size: 24rpx;
  136. color: #a5a5a5;
  137. }
  138. }
  139. .right{
  140. display: flex;
  141. flex-direction: column;
  142. align-items: flex-end;
  143. justify-content: flex-end;
  144. .money{
  145. font-size: 28rpx;
  146. font-weight: bold;
  147. color: #111;
  148. }
  149. .green{
  150. color: green;
  151. }
  152. .red{
  153. color:#ff0000;
  154. }
  155. .remark{
  156. margin-top: 20rpx;
  157. font-size: 24rpx;
  158. color: #a5a5a5;
  159. .green{
  160. color: green;
  161. }
  162. .red{
  163. color: red;
  164. }
  165. }
  166. }
  167. }
  168. }
  169. </style>
  170. =======
  171. <template>
  172. <view class="page">
  173. <view class="content">
  174. <mescroll-body ref="mescrollRef" @init="mescrollInit" :up="upOption" :down="downOption" @down="downCallback" @up="upCallback">
  175. <view class="item" v-for="(item) in dataList">
  176. <view class="left">
  177. <!-- <text class="title" >
  178. 完课积分领取记录
  179. </text> -->
  180. <text class="title" >
  181. {{utils.getDictLabel2Name(typeOptions,item.logType)}}
  182. </text>
  183. <view class="time">{{item.createTime}}</view>
  184. </view>
  185. <view class="right">
  186. <text :class="item.integral>0?'money green':'money red'">{{item.integral}}</text>
  187. <text class="remark">剩余积分:{{item.balance}}</text>
  188. </view>
  189. </view>
  190. </mescroll-body>
  191. </view>
  192. </view>
  193. </template>
  194. <script>
  195. import {getDictByKey} from '@/api/common.js'
  196. import {getUserIntegralLogsList} from '@/api/integral.js'
  197. import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
  198. export default {
  199. mixins: [MescrollMixin], // 使用mixin
  200. data() {
  201. return {
  202. typeOptions:[],
  203. mescroll:null,
  204. downOption: {
  205. auto:false//不要自动加载
  206. },
  207. upOption: {
  208. onScroll:false,
  209. use: true, // 是否启用上拉加载; 默认true
  210. page: {
  211. num: 0, // 当前页码,默认0,回调之前会加1,即callback(page)会从1开始
  212. size: 10 // 每页数据的数量,默认10
  213. },
  214. noMoreSize: 10, // 配置列表的总数量要大于等于5条才显示'-- END --'的提示
  215. textNoMore:"已经到底了",
  216. empty: {
  217. icon:'https://hdtobs.obs.cn-north-4.myhuaweicloud.com/hdt/empty_icon.png',
  218. tip: '暂无数据'
  219. }
  220. },
  221. dataList: []
  222. }
  223. },
  224. onLoad() {
  225. this.getDictByKey("sys_integral_log_type");
  226. },
  227. methods: {
  228. getDictByKey(key){
  229. var data={key:key}
  230. getDictByKey(data).then(
  231. res => {
  232. if(res.code==200){
  233. this.typeOptions=res.data;
  234. }
  235. },
  236. err => {
  237. }
  238. );
  239. },
  240. mescrollInit(mescroll) {
  241. this.mescroll = mescroll;
  242. },
  243. /*下拉刷新的回调 */
  244. downCallback(mescroll) {
  245. mescroll.resetUpScroll()
  246. },
  247. upCallback(page) {
  248. //联网加载数据
  249. var that = this;
  250. var data = {
  251. pageNum: page.num,
  252. pageSize: page.size
  253. };
  254. // uni.showLoading({
  255. // title:"加载中..."
  256. // })
  257. getUserIntegralLogsList(data).then(res => {
  258. uni.hideLoading()
  259. if(res.code==200){
  260. //设置列表数据
  261. if (page.num == 1) {
  262. that.dataList = res.data.list;
  263. } else {
  264. that.dataList = that.dataList.concat(res.data.list);
  265. }
  266. that.mescroll.endBySize(res.data.list.length, res.data.total);
  267. }else{
  268. uni.showToast({
  269. icon:'none',
  270. title: "请求失败",
  271. });
  272. that.dataList = null;
  273. that.mescroll.endErr();
  274. }
  275. });
  276. },
  277. }
  278. }
  279. </script>
  280. <style lang="scss" scoped>
  281. .page{
  282. }
  283. .content{
  284. display: flex;
  285. flex-direction: column;
  286. .item{
  287. background-color: #fff;
  288. padding: 20rpx 10rpx;
  289. display: flex;
  290. align-items: flex-start;
  291. justify-content: space-between;
  292. border-top: 1rpx solid #efefef;
  293. .left{
  294. display: flex;
  295. flex-direction: column;
  296. align-items: flex-start;
  297. justify-content: flex-start;
  298. .title{
  299. font-size: 26rpx;
  300. color: #111;
  301. }
  302. .time{
  303. margin-top: 20rpx;
  304. font-size: 24rpx;
  305. color: #a5a5a5;
  306. }
  307. }
  308. .right{
  309. display: flex;
  310. flex-direction: column;
  311. align-items: flex-end;
  312. justify-content: flex-end;
  313. .money{
  314. font-size: 28rpx;
  315. font-weight: bold;
  316. color: #111;
  317. }
  318. .green{
  319. color: green;
  320. }
  321. .red{
  322. color:#ff0000;
  323. }
  324. .remark{
  325. margin-top: 20rpx;
  326. font-size: 24rpx;
  327. color: #a5a5a5;
  328. .green{
  329. color: green;
  330. }
  331. .red{
  332. color: red;
  333. }
  334. }
  335. }
  336. }
  337. }
  338. </style>
  339. >>>>>>> db97a32e991ee7a9b5a59978a4bee9ad519591ce