record.vue 6.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307
  1. <template>
  2. <view class="container">
  3. <view class="main">
  4. <view class="flex-y-center main-home" @click="choice" :data-url='item.url' :data-id='item.id'
  5. :data-index="index" v-for="(item,index) in list" :key="item.id">
  6. <view class="main-icon">
  7. <i class="iconfont iconxuanzhong" v-if="item.checked"></i>
  8. <i class="iconfont iconweixuanzhong" v-else style="color:#bfbfbf"></i>
  9. </view>
  10. <view :data-index='index' class="item flex-row">
  11. <image src="../../static/images/icon_game.png" mode="aspectFit" class="type-img" v-if="item.type == 7"></image>
  12. <image src="../../static/images/icon_6.png" mode="aspectFit" class="type-img" v-if="item.type == 4"></image>
  13. <image src="../../static/images/icon_5.png" mode="aspectFit" class="type-img" v-if="item.type == 3"></image>
  14. <image src="../../static/images/icon_2.png" mode="aspectFit" class="type-img" v-if="item.type == 2"></image>
  15. <image src="../../static/images/icon_4.png" mode="aspectFit" class="type-img" v-if="item.type == 1"></image>
  16. <image src="../../static/images/icon_7.png" mode="aspectFit" class="type-img" v-if="item.type == 6"></image>
  17. <view class="info">
  18. <view class="title text-1" v-if="item.description">{{item.description}}</view>
  19. <view class="desc flex-row-between">
  20. <view class="time content">{{item.url}}</view>
  21. </view>
  22. </view>
  23. </view>
  24. </view>
  25. </view>
  26. <view class="hg90">
  27. </view>
  28. <view class="bottom-bars flex-center">
  29. <button @click="save" class="flex-center ft28">立即提交</button>
  30. </view>
  31. </view>
  32. </template>
  33. <script>
  34. export default {
  35. data() {
  36. return {
  37. list: [],
  38. page: 1,
  39. checked:-1,
  40. }
  41. },
  42. onLoad(e) {
  43. this.type=e.type;
  44. uni.setNavigationBarTitle({
  45. title:`${this.$test.$test}列表`
  46. })
  47. this.page = 1;
  48. this.list = [];
  49. this.funeng_list();
  50. },
  51. onShow() {
  52. },
  53. onReachBottom(e) {
  54. this.funeng_list()
  55. },
  56. methods: {
  57. choice(e) {
  58. let index= e.currentTarget.dataset.index;
  59. // var url= e.currentTarget.dataset.url;
  60. this.list[index].checked=!this.list[index].checked;
  61. // var pages = getCurrentPages();
  62. // var currPage = pages[pages.length - 1]; //当前页面
  63. // var prevPage = pages[pages.length - 2]; //上一个页面
  64. // //可以打印prevPage看看
  65. // console.log(prevPage)
  66. // //h5的写法
  67. // // #ifdef H5
  68. // prevPage.save_url=url;
  69. // prevPage.id=id;
  70. // // #endif
  71. // // #ifdef MP-WEIXIN
  72. // //小程序的写法 具体要怎么写可以打印一下prevPage看一下
  73. // prevPage.$vm.save_url=url;
  74. // prevPage.$vm.id=id;
  75. // // #endif
  76. // uni.navigateBack();
  77. },
  78. save(e){
  79. let arr = this.list,way_id = [];
  80. for (let i of this.list) {
  81. if(i.checked){
  82. way_id.push({id:i.id})
  83. }
  84. }
  85. this.request({
  86. url:"funeng/addExchangePool",
  87. data:{
  88. arr:way_id,
  89. type:this.type,
  90. token: uni.getStorageSync("token"),
  91. },
  92. }).then(res => {
  93. console.log(res, "res")
  94. if (res.code === '200') {
  95. uni.showToast({
  96. title: "添加成功",
  97. icon: 'none'
  98. })
  99. setTimeout(()=>{
  100. uni.navigateBack()
  101. },2000)
  102. }
  103. }).catch((res) => {
  104. uni.showToast({
  105. title: res.message,
  106. icon: 'none'
  107. })
  108. });
  109. },
  110. viewRecords(e) {
  111. var index = e.currentTarget.dataset.index,
  112. card_num = this.list[index].card_num,
  113. type = this.list[index].type;
  114. uni.navigateTo({
  115. url: "../viewRecords/viewRecords?card_num=" + card_num + '&type=' + type
  116. })
  117. },
  118. funeng_list() {
  119. this.request({
  120. url: "user/funeng_list",
  121. data: {
  122. page: this.page,
  123. token: uni.getStorageSync("token"),
  124. type:this.type,
  125. },
  126. }).then(res => {
  127. console.log(res, "res")
  128. if (res.code === '200') {
  129. for(var i of res.data){
  130. i.checked=false;
  131. }
  132. this.list = this.list.concat(res.data);
  133. this.page = this.page + 1;
  134. }
  135. })
  136. },
  137. }
  138. }
  139. </script>
  140. <style>
  141. page {
  142. background: #F9F9F9;
  143. }
  144. .content {
  145. word-wrap: break-word;
  146. word-break: break-all;
  147. }
  148. .iconxuanzhong {
  149. color: #007AFF;
  150. }
  151. .header {
  152. width: 100%;
  153. height: 198rpx;
  154. position: relative;
  155. }
  156. .header .bg-img {
  157. display: block;
  158. position: absolute;
  159. left: 0;
  160. top: 0;
  161. z-index: -1;
  162. width: 100%;
  163. height: 198rpx;
  164. }
  165. .header .info {
  166. width: 100%;
  167. height: 100%;
  168. display: flex;
  169. flex-flow: row nowrap;
  170. justify-content: center;
  171. align-items: center;
  172. }
  173. .header .info .num {
  174. font-size: 70rpx;
  175. font-weight: 700;
  176. font-family: DIN Alternate, DIN Alternate-Bold;
  177. color: #fff;
  178. line-height: 1;
  179. }
  180. .header .info .desc {
  181. font-size: 32rpx;
  182. line-height: 1;
  183. color: #fff;
  184. margin-top: 39rpx;
  185. }
  186. .main {
  187. background-color: #F9F9F9;
  188. border-radius: 20rpx 20rpx 0 0;
  189. margin-top: 20rpx;
  190. padding: 20rpx 40rpx 0;
  191. }
  192. .main .page-title {
  193. padding: 28rpx 0 40rpx;
  194. }
  195. .main .page-title .title {
  196. font-size: 36rpx;
  197. color: #262626;
  198. line-height: 50rpx;
  199. font-weight: 600;
  200. }
  201. .main .item {
  202. background-color: #fff;
  203. border-radius: 8rpx;
  204. padding: 20rpx 32rpx 20rpx 34rpx;
  205. width: 606rpx;
  206. }
  207. .main-home {
  208. margin-bottom: 40rpx;
  209. }
  210. .main .item .type-img {
  211. display: block;
  212. flex: none;
  213. width: 40rpx;
  214. height: 40rpx;
  215. margin-right: 26rpx;
  216. }
  217. .main .item .info {
  218. flex: auto;
  219. }
  220. .main .item .info .title {
  221. /* width: 538rpx; */
  222. font-size: 30rpx;
  223. font-weight: 500;
  224. color: #323232;
  225. line-height: 42rpx;
  226. margin-bottom: 16rpx;
  227. }
  228. .main .item .info .desc {
  229. /* margin-top: 16rpx; */
  230. }
  231. .main .item .info .num {
  232. font-size: 28rpx;
  233. font-weight: 400;
  234. color: #3387FF;
  235. line-height: 40rpx;
  236. }
  237. .main .item .info .time {
  238. font-size: 28rpx;
  239. font-weight: 400;
  240. color: #999;
  241. line-height: 40rpx;
  242. }
  243. .main-icon {
  244. margin-right: 33rpx;
  245. }
  246. .main-icon .iconfont{
  247. font-size: 38rpx;
  248. }
  249. .hg90{
  250. height: 90rpx;
  251. }
  252. .bottom-bars {
  253. width: 100%;
  254. /* padding: 30rpx 0; */
  255. position: fixed;
  256. bottom: 0rpx;
  257. }
  258. .bottom-bars button {
  259. text-align: center;
  260. width: 690rpx;
  261. height: 90rpx;
  262. background: linear-gradient(132deg, rgb(64, 158, 255) 0%, rgb(64, 158, 255) 100%);
  263. box-shadow: 0px 2rpx 12rpx rgb(64, 158, 255);
  264. opacity: 1;
  265. color: #fff;
  266. }
  267. </style>