list.vue 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221
  1. <template>
  2. <view class="phone-list-page">
  3. <view class="icon-title-bjcolor-navBar-box">
  4. <view @click="goUpPage" class="nav-bar-icon"></view>
  5. <text class="nav-bar-title">成绩</text>
  6. </view>
  7. <!-- 课程列表 -->
  8. <scroll-view scroll-y="true" refresher-enabled="true" :refresher-triggered="data.loading"
  9. :refresher-threshold="50" refresher-background="transparent" @refresherrefresh="onRefresh" @scrolltolower="onScrolltolower"
  10. class="phone-scroll-view">
  11. <uni-list class="admin-list-box">
  12. <uni-list-item v-for="item in data.list" class="admin-list-item-box">
  13. <template v-slot:body>
  14. <view class="item-card-row">
  15. <!-- 数量 -->
  16. <view class="ks-item-top">
  17. <view class="ks-name">{{item.zyName}}</view>
  18. <view class="ks-zyLevelName">{{item.zyLevelName}}</view>
  19. </view>
  20. <!-- 时间 -->
  21. <view class="ks-totalTm">
  22. <icon class="phone-time-icon" />{{item.answerStartTime}} - {{item.answerEndTime}}
  23. </view>
  24. <!-- 分数 -->
  25. <view class="ks-score-content">
  26. <view class="ks-score">
  27. <icon class="phone-zongfen-icon" />总分:<text>{{item.ksScore}}</text>
  28. </view>
  29. <view class="ks-okScore cj-okScore">
  30. <icon class="phone-jigefen-icon" />及格分:<text>{{item.okScore}}</text>
  31. </view>
  32. <view class="ks-getScore">
  33. <icon class="phone-defen-icon" />得分:<text>{{item.userScore}}</text>
  34. </view>
  35. </view>
  36. <button @click="checkKecheng(item)" type="primary" size="mini"
  37. class="item-view-btn">查看内容</button>
  38. </view>
  39. </template>
  40. </uni-list-item>
  41. <uni-load-more :status="data.state" @click="getMore(0)" :contentText="data.contentText"></uni-load-more>
  42. </uni-list>
  43. </scroll-view>
  44. <!-- 页面底端 -->
  45. <customTabbarClientVue></customTabbarClientVue>
  46. </view>
  47. </template>
  48. <script setup>
  49. import customTabbarClientVue from "@/components/custom-tabbar/custom-tabbar-client.vue";
  50. import {
  51. ref,
  52. reactive
  53. } from "vue";
  54. import {
  55. onLoad
  56. } from "@dcloudio/uni-app";
  57. import * as kaoshiApi from "@/api/kaoshi.js"
  58. import {
  59. formatDuration
  60. } from "@/utils/common.js"
  61. const data = reactive({
  62. list: [], // 考试列表
  63. loading: false,
  64. page: 0,
  65. size: 10,
  66. state: 'more',
  67. contentText: {
  68. contentdown: '查看更多',
  69. contentrefresh: '加载中',
  70. contentnomore: '没有更多'
  71. },
  72. from: ''
  73. })
  74. function goUpPage() {
  75. const pages = getCurrentPages();
  76. if (pages.length > 1) {
  77. uni.navigateBack()
  78. } else {
  79. /* if (data.from == 'my') {
  80. uni.navigateTo({
  81. url: '/pages/client/my/index'
  82. })
  83. } else if (data.from == 'kaoshi') {
  84. uni.navigateTo({
  85. url: '/pages/client/Kaoshi/list'
  86. })
  87. } else if (data.from == 'shouye'){
  88. uni.navigateTo({
  89. url: '/pages/client/ShouYe/shouye'
  90. })
  91. } else {
  92. uni.navigateTo({
  93. url: '/pages/client/ShouYe/shouye'
  94. })
  95. } */
  96. history.back();
  97. }
  98. }
  99. function onScrolltolower() {
  100. getMore()
  101. }
  102. function handleSearch() {
  103. data.page = 0;
  104. refreshData();
  105. }
  106. function checkKecheng(item) {
  107. uni.navigateTo({
  108. url: `/pages/client/Chengji/ksScoreShijuan?hisId=${item.hisId}&from=chengjiList`
  109. })
  110. }
  111. function onRefresh() {
  112. data.page = 0;
  113. data.list = [];
  114. data.loading = true;
  115. refreshData();
  116. }
  117. function refreshData() {
  118. const opt = {
  119. page: 1,
  120. size: 10, // 固定查询10条
  121. }
  122. data.list = [];
  123. // 数学
  124. data.state = 'loading';
  125. data.page++;
  126. opt.page = data.page;
  127. kaoshiApi.getClientKsChengjiList(opt).then(res => {
  128. data.list = data.list.concat(res.data.data);
  129. data.loading = false;
  130. if (res.data.total > data.list.length) {
  131. data.state = 'more';
  132. data.loading = false;
  133. } else {
  134. data.state = 'no-more';
  135. data.loading = false;
  136. }
  137. }).catch(err => {
  138. data.state = 'more';
  139. data.loading = false;
  140. })
  141. }
  142. function getMore() {
  143. const opt = {
  144. page: 1,
  145. size: 10, // 固定查询10条
  146. }
  147. if (data.state == 'no-more') return;
  148. data.state = 'loading';
  149. data.page++;
  150. opt.page = data.page;
  151. kaoshiApi.getClientKsChengjiList(opt).then(res => {
  152. data.list = data.list.concat(res.data.data);
  153. data.loading = false;
  154. if (res.data.total > data.list.length) {
  155. data.state = 'more';
  156. data.loading = false;
  157. } else {
  158. data.state = 'no-more';
  159. data.loading = false;
  160. }
  161. }).catch(err => {
  162. data.state = 'more';
  163. data.loading = false;
  164. })
  165. }
  166. onLoad((options) => {
  167. data.from = options.from;
  168. getMore()
  169. })
  170. </script>
  171. <style lang="scss" scoped>
  172. .phone-kecheng-page {
  173. background-color: #ccc;
  174. box-sizing: border-box;
  175. }
  176. .phone-search-content {
  177. position: relative;
  178. background-color: #fff;
  179. height: 42px;
  180. .search-input {
  181. height: 42px;
  182. line-height: 40px;
  183. border-radius: 20px;
  184. border: 1px solid #ccc;
  185. padding: 0 70px 0 20px;
  186. }
  187. .search-icon {
  188. position: absolute;
  189. right: 5px;
  190. top: 4px;
  191. padding: 6px;
  192. background-color: #ccc;
  193. border-radius: 20px;
  194. width: 50px;
  195. text-align: center;
  196. }
  197. }
  198. </style>