codeList.vue 6.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298
  1. <template>
  2. <view class="content">
  3. <no-none v-if='list.length<=0'></no-none>
  4. <block v-else>
  5. <navigator @click="bindDetail(index)" style="margin-top: 30rpx;" class="item" v-for="(item,index) of list" :key='index'>
  6. <view class="border-b item-title flex-y-center">
  7. <!-- <view class="item-type flex-center" :class="item.is_merge==1?'item-type-one':item.tikpush_type==1?'item-type-two':'item-type-three'">
  8. {{item.is_merge==1?'多码合一':item.tikpush_type==1?'某音':'视频号'}}
  9. </view> -->
  10. <text>{{item.nick_name}}</text>
  11. </view>
  12. <view class="item-bottom flex-y-center">
  13. <image @click="previewImg(item.url_code_path)" class="item-bottom-left"
  14. :src="URL+item.url_code_path" mode=""></image>
  15. <view class="flex-grow-1">
  16. <view class="box-pack-between item-bottom-right">
  17. <text><text class="item-bottom-number">发布次数</text>:{{item.transmit_num}}</text>
  18. </view>
  19. <view class="box-pack-between item-bottom-right flex-y-center">
  20. <text><text class="item-bottom-number">创建时间</text>:{{item.create_time}} </text>
  21. <text class="iconfont icongengduo"></text>
  22. </view>
  23. </view>
  24. </view>
  25. </navigator>
  26. </block>
  27. <view style="height: 75px;"></view>
  28. <navigator style="margin-bottom:0" url='./codeAdd' class="bottom-bar flex-center">
  29. <button formType="submit" class="flex-center ft28">+新增营销码</button>
  30. </navigator>
  31. </view>
  32. </template>
  33. <script>
  34. export default {
  35. data() {
  36. return {
  37. defaultIndex: 0,
  38. list: [],
  39. page: 1,
  40. $test: this.$test.$test,
  41. URL: getApp().globalData.URL,
  42. is_load: false
  43. }
  44. },
  45. onLoad() {
  46. uni.setNavigationBarTitle({
  47. title: `${this.$test.$test}列表`
  48. })
  49. },
  50. onShow() {
  51. this.page = 1;
  52. this.list = [];
  53. this.http();
  54. },
  55. onReachBottom(e) {
  56. if (!this.is_load) {
  57. this.page = this.page + 1;
  58. this.http();
  59. }
  60. },
  61. methods: {
  62. enit(id) {
  63. uni.navigateTo({
  64. url: "./add?id=" + id
  65. })
  66. },
  67. previewImg(logourl) {
  68. let URL = this.URL + logourl;
  69. uni.previewImage({
  70. urls: [URL]
  71. });
  72. },
  73. bindDetail(index) {
  74. // uni.setStorageSync("shake-key", this.list[index])
  75. uni.navigateTo({
  76. url: "./codeAdd"
  77. })
  78. },
  79. del(id, index) {
  80. uni.showModal({
  81. title: '提示',
  82. content: '是否要删除?',
  83. showCancel: true,
  84. cancelText: '取消',
  85. confirmText: '确定',
  86. success: res => {
  87. if (res.confirm) {
  88. this.request({
  89. url: 'tag/delete',
  90. data: {
  91. id: id,
  92. },
  93. }).then(res => {
  94. console.log(res, "res")
  95. if (res.code === 200 || res.code === "200") {
  96. this.list.splice(index, 1);
  97. }
  98. }).catch(() => {
  99. uni.showToast({
  100. title: res.message,
  101. icon: "none",
  102. })
  103. });
  104. }
  105. },
  106. fail: () => {},
  107. complete: () => {}
  108. });
  109. },
  110. http() {
  111. let url = "tikpush/lists";
  112. this.request({
  113. url,
  114. data: {
  115. token: uni.getStorageSync("token"),
  116. page: this.page,
  117. limit: 10,
  118. },
  119. showLoading:true,
  120. }).then(res => {
  121. console.log(res, "res")
  122. if (res.code === "200") {
  123. this.list = this.list.concat(res.data.list);
  124. if (res.data.list.length == 0) {
  125. this.is_load = true
  126. } else {
  127. this.is_load = false
  128. }
  129. }
  130. });
  131. },
  132. del(id, index) {
  133. uni.showModal({
  134. title: '提示',
  135. content: '是否要删除?',
  136. showCancel: true,
  137. cancelText: '取消',
  138. confirmText: '确定',
  139. success: res => {
  140. if (res.confirm) {
  141. this.request({
  142. url: "tikpush/del",
  143. data: {
  144. id: id,
  145. },
  146. }).then(res => {
  147. console.log(res, "res")
  148. if (res.code === 200 || res.code === "200") {
  149. this.list.splice(index, 1);
  150. }
  151. }).catch(() => {
  152. uni.showToast({
  153. title: res.message,
  154. icon: "none",
  155. })
  156. });
  157. }
  158. },
  159. fail: () => {},
  160. complete: () => {}
  161. });
  162. },
  163. },
  164. }
  165. </script>
  166. <style lang="scss">
  167. page {
  168. background: #F5F7FA;
  169. }
  170. .item {
  171. width: 690rpx;
  172. background: #ffffff;
  173. margin: 0 auto;
  174. padding: 0rpx 24rpx;
  175. opacity: 1;
  176. border-radius: 8rpx;
  177. box-shadow: 0rpx 6rpx 10rpx 0rpx rgba(213, 213, 213, 0.04);
  178. .item-title {
  179. opacity: 1;
  180. font-size: 28rpx;
  181. font-family: PingFang SC, PingFang SC-Medium;
  182. font-weight: 500;
  183. color: #333333;
  184. padding: 24rpx 0;
  185. .item-type {
  186. margin-right: 16rpx;
  187. // width: 78rpx;
  188. height: 36rpx;
  189. font-size: 21rpx;
  190. opacity: 1;
  191. border-radius: 4rpx;
  192. color: #FFFFFF;
  193. border-bottom: 1rpx solid #F1F1F1;
  194. padding: 0 13rpx;
  195. }
  196. .item-type-one{
  197. background: linear-gradient(134deg, #FF8C1A 2%, #FF8C1A 98%);
  198. }
  199. .item-type-two{
  200. background: linear-gradient(135deg,#4992ff 2%, #61a8fc 97%);
  201. }
  202. .item-type-three{
  203. background: linear-gradient(134deg, #febe07 2%, #ffcc3e 98%);
  204. }
  205. }
  206. .item-bottom {
  207. font-size: 26rpx;
  208. padding: 20rpx 0 24rpx 0;
  209. color: #666666;
  210. .item-bottom-left {
  211. width: 90rpx;
  212. height: 90rpx;
  213. margin-right: 24rpx;
  214. min-width: 90rpx;
  215. margin-bottom: 16rpx;
  216. }
  217. .item-bottom-right {
  218. margin-bottom: 16rpx;
  219. .item-bottom-number {
  220. color: #99A0AD;
  221. }
  222. }
  223. }
  224. }
  225. .color-ffa {
  226. color: #3387FF;
  227. }
  228. .icongengduo {
  229. color: #999;
  230. font-size: 24rpx;
  231. }
  232. .bottom-bar {
  233. position: fixed;
  234. bottom: 0px;
  235. width: 100%;
  236. z-index: 1000;
  237. background: #FFFFFF;
  238. padding: 30rpx 0;
  239. }
  240. .bottom-bar button {
  241. width: 690rpx;
  242. height: 98rpx;
  243. opacity: 1;
  244. background: linear-gradient(315deg, #3387ff 2%, #569bff 99%);
  245. border-radius: 8rpx;
  246. box-shadow: 0rpx 0rpx 8rpx 0rpx rgba(51, 135, 255, 0.20);
  247. margin: 0 auto;
  248. opacity: 1;
  249. font-size: 36rpx;
  250. font-family: PingFang SC, PingFang SC-Medium;
  251. font-weight: 500;
  252. color: #ffffff;
  253. }
  254. .label {
  255. min-width: 70rpx;
  256. height: 44rpx;
  257. /* line-height: 44rpx; */
  258. padding: 0 10rpx;
  259. color: #FFFFFF;
  260. font-size: 24rpx;
  261. background-color: #1E9FFF;
  262. margin-left: 20rpx;
  263. border-radius: 5rpx;
  264. }
  265. </style>