bannerList.vue 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205
  1. <template>
  2. <view class="container">
  3. <view class="list">
  4. <view @click="detail(item.id)" class="item" style="border-left:none;padding: 0 30rpx;" v-for="(item,index) in list" :key="index">
  5. <view class="top flex flex-y-center box-pack-between">
  6. <view class="flex-y-center">
  7. <view class="name">{{item.name}}</view>
  8. </view>
  9. <view class="flex-y-center">
  10. <view class="ft26" style="color: #FF5722;margin-right: 20rpx;">
  11. {{item.type_id==1?'支付后显示':'首页'}}
  12. </view>
  13. <view class="del" @click.stop="del(item.id)">删除</view>
  14. </view>
  15. </view>
  16. <view class="content flex flex-y-center" hover-class="nav-hover">
  17. <image mode="aspectFit" class="content-icon" :src="URL+item.thumb"></image>
  18. </view>
  19. </view>
  20. <view class="no-more">没有更多内容了~</view>
  21. </view>
  22. <view class="footer-bar">
  23. <view class="content flex flex-center">
  24. <navigator url="./bannerAdd" class="btn">+新增广告</navigator>
  25. </view>
  26. </view>
  27. </view>
  28. </template>
  29. <script>
  30. export default {
  31. data() {
  32. return {
  33. store_id: "",
  34. list: [],
  35. page: 1,
  36. is_bottom: false,
  37. URL:getApp().globalData.URL
  38. }
  39. },
  40. onLoad(options) {
  41. this.store_id = uni.getStorageSync("store_id");
  42. },
  43. onShow() {
  44. this.getData(1)
  45. },
  46. onReachBottom() {
  47. if (!this.is_bottom) {
  48. this.getData(this.page + 1)
  49. }
  50. },
  51. methods: {
  52. banner_index(){
  53. },
  54. detail(id) {
  55. uni.navigateTo({
  56. url: `./bannerAdd?id=${id}`
  57. })
  58. },
  59. del(id) {
  60. uni.showModal({
  61. title: '提示',
  62. content: '是否要删除?',
  63. showCancel: true,
  64. cancelText: '取消',
  65. confirmText: '确定',
  66. success: res => {
  67. if (res.confirm) {
  68. this.request({
  69. url: 'Smdcshop/banner_delect',
  70. data: {
  71. id: id,
  72. },
  73. }).then(res => {
  74. console.log(res, "res")
  75. if (res.code === 200 || res.code === "200") {
  76. uni.showToast({
  77. title: "删除成功",
  78. icon: "none",
  79. })
  80. setTimeout(() => {
  81. this.getData(1)
  82. }, 2000)
  83. }
  84. }).catch((res) => {
  85. uni.showToast({
  86. title: res.message,
  87. icon: "none",
  88. })
  89. });
  90. }
  91. },
  92. fail: () => {},
  93. complete: () => {}
  94. });
  95. },
  96. getData(page) {
  97. if (page == 1) {
  98. this.list = []
  99. this.page = 1
  100. this.is_bottom = false
  101. }
  102. this.request({
  103. url: 'Smdcshop/banner_index',
  104. data: {
  105. page,
  106. limit: 10,
  107. admin_id: uni.getStorageSync("admin_id")
  108. }
  109. }).then(res => {
  110. if (res.code == 200 && res.data.length) {
  111. this.list = this.list.concat(res.data)
  112. this.page = page
  113. } else {
  114. this.is_bottom = true
  115. }
  116. })
  117. }
  118. }
  119. }
  120. </script>
  121. <style>
  122. @import url("./static/css/common.css");
  123. .content-icon {
  124. width: 100%;
  125. height: 400rpx;
  126. }
  127. .del {
  128. height: 44rpx;
  129. line-height: 44rpx;
  130. padding: 0 15rpx;
  131. font-size: 24rpx;
  132. background-color: #FF5722;
  133. /* margin-right: 25rpx; */
  134. color: #fff;
  135. border-radius: 4rpx;
  136. }
  137. page {
  138. background-color: #F4F5F7;
  139. }
  140. .list {
  141. padding: 30rpx 25rpx;
  142. }
  143. .list .item {
  144. border-radius: 8rpx;
  145. overflow: hidden;
  146. padding-left: 30rpx;
  147. border-left: 8rpx solid #247EFF;
  148. background-color: #fff;
  149. margin-bottom: 30rpx;
  150. }
  151. .list .item .top {
  152. /* height: 80rpx; */
  153. border-bottom: 1rpx solid #f5f5f5;
  154. padding: 20rpx 0;
  155. }
  156. .list .item .top .name {
  157. font-size: 30rpx;
  158. /* line-height: 80rpx; */
  159. font-weight: bold;
  160. max-width: 389rpx;
  161. }
  162. .list .item .top .type-btn {
  163. zoom: 0.7;
  164. margin-right: 25rpx;
  165. }
  166. .list .item .content {
  167. padding: 20rpx 0 24rpx;
  168. }
  169. .list .item .content .cell {
  170. flex: none;
  171. width: 50%;
  172. box-sizing: border-box;
  173. padding-right: 30rpx;
  174. font-size: 26rpx;
  175. line-height: 37rpx;
  176. color: #666;
  177. }
  178. .list .item .content .cell .title {
  179. color: #99A0AD;
  180. }
  181. </style>