classify.vue 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186
  1. <template>
  2. <view class="container-classify">
  3. <navbar :config="config" backColor="#666666"></navbar>
  4. <view class="main">
  5. <view class="item" v-for="item in list" :key="item.id">
  6. <view class="label">{{item.name}}</view>
  7. <view class="tools">
  8. <view class="btn edit" @click="edit(item)">
  9. <view class="iconfont3 icon">&#xe63a;</view>编辑
  10. </view>
  11. <view class="btn del" @click="del(item)">
  12. <view class="iconfont3 icon">&#xe8b6;</view>删除
  13. </view>
  14. </view>
  15. </view>
  16. <noData v-if="list.length<=0"></noData>
  17. </view>
  18. <view class="footer">
  19. <view class="btn" @click="addClassify">新增分类</view>
  20. </view>
  21. </view>
  22. </template>
  23. <script>
  24. import noData from "@/components/noData/nodata.vue";
  25. export default {
  26. components: {
  27. noData
  28. },
  29. data() {
  30. return {
  31. config: {
  32. back: true,
  33. title: '分类管理',
  34. color: '#1A1A1A',
  35. backgroundColor: [1, "#fff"],
  36. statusBarFontColor: '#1A1A1A',
  37. leftSlot: true
  38. },
  39. list: []
  40. }
  41. },
  42. onLoad() {},
  43. onShow() {
  44. this.getClassify()
  45. },
  46. methods: {
  47. // 获取店铺信息
  48. getShopInfo() {
  49. this.$http.get('/yxt/shop/my-shop', {
  50. union_business: true
  51. }).then(res => {
  52. if (res.code == 200 && res.data) {
  53. }
  54. })
  55. },
  56. // 获取商品分类
  57. getClassify() {
  58. this.$http.get('/offlinetype/goods/my_list', {
  59. isGoods: 1
  60. }).then(res => {
  61. if (res.code == 200) {
  62. if (res.list.length > 0) {
  63. this.list = res.list
  64. }
  65. }
  66. })
  67. },
  68. addClassify() {
  69. uni.navigateTo({
  70. url: `/pages/workbench/goods/addClassify`
  71. })
  72. },
  73. edit(item) {
  74. uni.navigateTo({
  75. url: `/pages/workbench/goods/addClassify?id=${item.id}&label=${item.name}`
  76. })
  77. },
  78. del(item) {
  79. uni.showModal({
  80. title: '提示',
  81. content: '确定删除此分类?',
  82. success: (res) => {
  83. if (res.confirm) {
  84. this.$http.delete(`/offlinetype/goods/delete/${item.id}`).then(res => {
  85. if (res.code == 200) {
  86. this.$mUtil.toast('删除成功')
  87. this.getClassify()
  88. }
  89. })
  90. console.log('用户点击确定');
  91. } else if (res.cancel) {
  92. console.log('用户点击取消');
  93. }
  94. }
  95. });
  96. }
  97. }
  98. }
  99. </script>
  100. <style lang="scss" scoped>
  101. .container-classify {
  102. .main {
  103. padding: 0 60rpx 200rpx;
  104. .item {
  105. width: 100%;
  106. height: 95rpx;
  107. display: flex;
  108. justify-content: space-between;
  109. align-items: center;
  110. font-size: 28rpx;
  111. font-family: PingFang SC, PingFang SC-Regular;
  112. font-weight: 400;
  113. text-align: left;
  114. color: #1a1a1a;
  115. border-bottom: 1rpx solid #f1f1f1;
  116. .label {
  117. flex: 1;
  118. overflow: hidden;
  119. text-overflow: ellipsis;
  120. white-space: nowrap;
  121. }
  122. .tools {
  123. display: flex;
  124. align-items: center;
  125. font-size: 24rpx;
  126. color: #FA6138;
  127. flex-shrink: 0;
  128. .btn {
  129. display: flex;
  130. align-items: center;
  131. .icon {
  132. margin-right: 8rpx;
  133. font-size: 30rpx;
  134. }
  135. }
  136. .del {
  137. color: #FF6600;
  138. margin-left: 30rpx;
  139. }
  140. }
  141. }
  142. }
  143. .footer {
  144. width: 100%;
  145. padding: 30rpx 60rpx;
  146. position: fixed;
  147. bottom: 0;
  148. display: flex;
  149. align-items: center;
  150. justify-content: space-between;
  151. background-color: #fff;
  152. .btn {
  153. width: 100%;
  154. color: #fff;
  155. text-align: center;
  156. line-height: 85rpx;
  157. border: 1rpx solid #3775F6;
  158. border-radius: 44rpx;
  159. background-color: #FA6138;
  160. font-size: 28rpx;
  161. font-family: PingFang SC, PingFang SC-Regular;
  162. font-weight: 400;
  163. text-align: center;
  164. }
  165. .online-btn {
  166. color: #FA6138;
  167. border: 1rpx solid #3775F6;
  168. background-color: #e7eefc;
  169. }
  170. }
  171. }
  172. </style>