robot.nvue 6.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308
  1. <template>
  2. <view class="page-news">
  3. <view class="listview">
  4. <view class="robot">
  5. <robot-list :dataList="dataList"></robot-list>
  6. </view>
  7. <view>
  8. <view class="loading-more">
  9. <view class="creatView" v-if="isNoData">
  10. <image class="imsa" src="../../../static/nodata.png" mode=""></image>
  11. <text class="c-te">暂无消息</text>
  12. </view>
  13. </view>
  14. </view>
  15. </view>
  16. </view>
  17. </template>
  18. <script>
  19. import uniList from '@/components/uni-list.vue';
  20. import uniCell from '@/components/uni-cell.vue';
  21. import uniRefresh from '@/components/uni-refresh.vue';
  22. import uniLoadMore from '@/components/uni-load-more.vue';
  23. import robotList from '@/components/dl-product-class/index.nvue'
  24. import {
  25. getRobotList,
  26. } from '@/common/api.js'
  27. export default {
  28. components: {
  29. uniList,
  30. uniCell,
  31. uniRefresh,
  32. robotList,
  33. uniLoadMore,
  34. tabClick: false, // true 表示是两次点击中的第一次点了 tabBar
  35. },
  36. props: {
  37. nid: {
  38. type: [Number, String],
  39. default: ''
  40. },
  41. },
  42. data() {
  43. return {
  44. searchContent: "",
  45. dataList: [],
  46. navigateFlag: false,
  47. pulling: false,
  48. refreshing: false,
  49. refreshFlag: false,
  50. refreshText: "",
  51. isLoading: false,
  52. isNoData: false,
  53. pulling: false,
  54. angle: 0,
  55. loadingMoreText: {
  56. contentdown: '',
  57. contentrefresh: '',
  58. contentnomore: ''
  59. },
  60. requestParams: {},
  61. refreshIcon: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAB5QTFRFcHBw3Nzct7e39vb2ycnJioqK7e3tpqam29vb////D8oK7wAAAAp0Uk5T////////////ALLMLM8AAABxSURBVHja7JVBDoAgDASrjqj//7CJBi90iyYeOHTPMwmFZrHjYyyFYYUy1bwUZqtJIYVxhf1a6u0R7iUvWsCcrEtwJHp8MwMdvh2amHduiZD3rpWId9+BgPd7Cc2LIkPyqvlQvKxKBJ//Qwq/CacAAwDUv0a0YuKhzgAAAABJRU5ErkJggg=="
  62. }
  63. },
  64. created() {
  65. console.log(545454545454566666666666)
  66. this.pullTimer = null;
  67. this.loadData()
  68. },
  69. methods: {
  70. loadData(refresh) {
  71. if (this.isLoading) {
  72. return;
  73. }
  74. this.isLoading = true;
  75. this.isNoData = false;
  76. getRobotList({
  77. }, (e) => {
  78. this.isLoading = false;
  79. if (refresh) {
  80. this.refreshing = false;
  81. this.refreshFlag = false;
  82. this.refreshText = "已刷新";
  83. if (this.pullTimer) {
  84. clearTimeout(this.pullTimer);
  85. }
  86. this.pullTimer = setTimeout(() => {
  87. this.pulling = false;
  88. }, 1000);
  89. }
  90. }).then(result => {
  91. console.log(result)
  92. let data_list = result;
  93. let namelist = []
  94. let arr = []
  95. try{
  96. data_list.map((item,index) =>{
  97. if(!namelist.includes(item.usePlace)){
  98. namelist.push(item.usePlace)
  99. arr[index] = {
  100. name:item.usePlace,
  101. list:[
  102. {
  103. ...item
  104. }
  105. ]
  106. }
  107. }
  108. else{
  109. let ind = namelist.indexOf(item.usePlace)
  110. arr[ind].list.push(item)
  111. }
  112. })
  113. }catch(e){
  114. console.log(e)
  115. }
  116. console.log(arr)
  117. console.log(88888888888888)
  118. /* function removeByValue(arr, val) {
  119. for(var i = 0; i < arr.length; i++) {
  120. if(arr[i] == val) {
  121. arr.splice(i, 1);
  122. removeByValue(arr, null)
  123. break;
  124. }
  125. }
  126. } */
  127. var ind = -1;
  128. function removeByName(){
  129. for(var i = 0; i < arr.length; i++) {
  130. if(arr[i] == null) {
  131. ind = i;
  132. break;
  133. }
  134. }
  135. if(ind!=-1){
  136. arr.splice(ind, 1); ind = -1;
  137. removeByName();
  138. }
  139. }
  140. removeByName();
  141. this.dataList = arr;
  142. console.log(this.dataList)
  143. if (this.dataList.length == 0) {
  144. this.isNoData = true
  145. }
  146. this.isLoading = false;
  147. }).catch(e => {
  148. })
  149. },
  150. clear() {
  151. this.dataList = [];
  152. },
  153. refreshData() {
  154. console.log(88888888888888)
  155. if (this.isLoading) {
  156. return;
  157. }
  158. this.pulling = true;
  159. this.refreshing = true;
  160. this.refreshText = "正在刷新...";
  161. this.clear()
  162. this.loadData(true);
  163. },
  164. onrefresh(e) {
  165. console.log(e)
  166. this.isNoData = false
  167. this.refreshData();
  168. },
  169. onpullingdown(e) {
  170. if (this.refreshing) {
  171. return;
  172. }
  173. this.pulling = false;
  174. if (Math.abs(e.pullingDistance) > Math.abs(e.viewHeight)) {
  175. this.refreshFlag = true;
  176. this.refreshText = "释放立即刷新";
  177. } else {
  178. this.refreshFlag = false;
  179. this.refreshText = "下拉可以刷新";
  180. }
  181. },
  182. }
  183. }
  184. </script>
  185. <style scoped >
  186. .creatView {
  187. display: flex;
  188. justify-content: center;
  189. align-items: center;
  190. flex-direction: column;
  191. }
  192. .c-te{
  193. color: #0581FD;
  194. padding:30rpx;
  195. font-size: 30rpx;
  196. }
  197. .imsa {
  198. margin-top:260rpx;
  199. width: 387rpx;
  200. height: 200rpx;
  201. }
  202. .no-data {
  203. flex: 1;
  204. position: absolute;
  205. left: 0;
  206. top: 0;
  207. right: 0;
  208. bottom: 0;
  209. z-index: 10;
  210. }
  211. .page-news {
  212. flex: 1;
  213. flex-direction: column;
  214. position: absolute;
  215. left: 0;
  216. top: 0;
  217. right: 0;
  218. bottom: 0;
  219. }
  220. .listview {
  221. position: absolute;
  222. left: 0;
  223. background-color: #F9F9F9;
  224. top: 0;
  225. right: 0;
  226. bottom: 0;
  227. /* #ifndef APP-NVUE */
  228. display: flex;
  229. flex-direction: column;
  230. /* #endif */
  231. /* #ifndef MP-ALIPAY */
  232. flex-direction: column;
  233. /* #endif */
  234. }
  235. .robot{
  236. position: absolute;
  237. left: 0;
  238. background-color: #F9F9F9;
  239. top: 0rpx;
  240. right: 0;
  241. bottom: 0;
  242. }
  243. .refresh {
  244. justify-content: center;
  245. }
  246. .refresh-view {
  247. /* #ifndef APP-NVUE */
  248. display: flex;
  249. /* #endif */
  250. width: 750rpx;
  251. height: 64px;
  252. flex-direction: row;
  253. flex-wrap: nowrap;
  254. align-items: center;
  255. justify-content: center;
  256. }
  257. .refresh-icon {
  258. width: 32px;
  259. height: 32px;
  260. transition-duration: .5s;
  261. transition-property: transform;
  262. transform: rotate(0deg);
  263. transform-origin: 15px 15px;
  264. }
  265. .refresh-icon-active {
  266. transform: rotate(180deg);
  267. }
  268. .loading-icon {
  269. width: 28px;
  270. height: 28px;
  271. margin-right: 5px;
  272. color: gray;
  273. }
  274. .loading-text {
  275. margin-left: 2px;
  276. font-size: 16px;
  277. color: #999999;
  278. }
  279. .loading-more {
  280. align-items: center;
  281. justify-content: center;
  282. padding-top: 14px;
  283. padding-bottom: 14px;
  284. text-align: center;
  285. }
  286. .loading-more-text {
  287. font-size: 28upx;
  288. color: #999;
  289. }
  290. </style>