book.vue 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125
  1. <template>
  2. <view class="container">
  3. <uni-nav-bar
  4. left-icon="back"
  5. background-color="#0279FF"
  6. color="#fff"
  7. left-text="返回"
  8. right-text="开始训练"
  9. @clickLeft="navtoBack"
  10. @clickRight="navtoTrain"></uni-nav-bar>
  11. <!-- 设置圆角 -->
  12. <view style="padding: 10px 30px 10px 30px;">
  13. <uni-search-bar :radius="100" @input="search" placeholder="搜错题"></uni-search-bar>
  14. </view>
  15. <yf-more-list url="/api/user/wrong-book/paging" :params="queryParams" ref="moreList">
  16. <template v-slot:item="{ data }">
  17. <uni-list-item
  18. :show-arrow="true"
  19. :title="data.title"
  20. :note="data.updateTime"
  21. :rightText="'错误:'+data.wrongCount+'次'"
  22. >
  23. </uni-list-item>
  24. </template>
  25. </yf-more-list>
  26. </view>
  27. </template>
  28. <script>
  29. export default {
  30. data() {
  31. return {
  32. queryParams: {
  33. examId: '',
  34. title: ''
  35. }
  36. }
  37. },
  38. onReachBottom() {
  39. // 加载数据
  40. this.$refs.moreList.loadData()
  41. },
  42. onLoad(options) {
  43. this.queryParams.examId = options.id
  44. },
  45. onShow() {
  46. if(this.$refs.moreList){
  47. this.$refs.moreList.initData()
  48. }
  49. },
  50. methods: {
  51. search(e) {
  52. this.queryParams.title = e
  53. },
  54. // 考试详情页
  55. navtoBack(){
  56. uni.navigateTo({
  57. url: '/pages/paper/index'
  58. });
  59. },
  60. // 考试详情页
  61. navtoTrain(){
  62. uni.navigateTo({
  63. url: '/pages/repo/train?repoId='+this.queryParams.examId+'&mode=0'
  64. });
  65. }
  66. }
  67. }
  68. </script>
  69. <style>
  70. .container {
  71. font-size: 14rpx;
  72. }
  73. .exam-item {
  74. display: flex;
  75. align-items: center;
  76. line-height: 30px;
  77. }
  78. .exam-item .left {
  79. text-align: left;
  80. flex-grow: 1;
  81. }
  82. .exam-item .left .desc {
  83. color: #888;
  84. }
  85. .exam-item .left .icons {
  86. font-size: 10px;
  87. display: flex;
  88. align-items: center;
  89. color: #666;
  90. }
  91. .exam-item .right {
  92. text-align: right;
  93. }
  94. .pass {
  95. color: #007AFF !important;
  96. margin-right: 5px;
  97. }
  98. .fail {
  99. color: #ff0000 !important;
  100. margin-right: 5px;
  101. }
  102. </style>