printerList.vue 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237
  1. <template>
  2. <view class="container">
  3. <view class="list">
  4. <view class="item" v-for="(item,index) in list" :key="index">
  5. <view class="top flex flex-y-center box-pack-between">
  6. <view class="name">{{item.name}}</view>
  7. <view class="flex-y-center">
  8. <view class="del" @click="del(item.id)">删除</view>
  9. <switch :checked="item.state==1?true:false" @change="onTypeChange" :data-index="index"
  10. color="#247EFF" class="type-btn" />
  11. </view>
  12. </view>
  13. <view
  14. class="content flex flex-y-center" hover-class="nav-hover">
  15. <view class="cell flex flex-y-center">
  16. <view class="title">门店:</view>
  17. <view class="desc">{{item.store_title}}</view>
  18. </view>
  19. </view>
  20. <navigator :url="`/saomaDiancan/editPrinter/editPrinter?id=${item.id}`"
  21. class="content flex flex-y-center" hover-class="nav-hover">
  22. <view class="cell flex flex-y-center">
  23. <view class="title">打印机类型:</view>
  24. <view class="desc">{{item.type==1?'1-365':item.type==2?'易联云(型号:k4)':
  25. item.type==3?'飞鹅(型号:FP-58W)':item.type==4?'喜讯(型号:XP58IIQR)': item.type==5?'佳搏(SH584)':
  26. item.type==6?'芯烨云(XP-T58H)':item.type==7?'飞鹅(型号:FP-N20W)(仅限标签打印)':item.type==8?'商米(型号:NT211)':''
  27. }}</view>
  28. </view>
  29. <view class="cell flex flex-y-center arr-r">
  30. <view class="title">打印机位置:</view>
  31. <view class="desc">{{item.location==1?'前台':item.location==2?'后厨':item.location==3?'排队取号':item.location==4?'标签机':''}}</view>
  32. </view>
  33. </navigator>
  34. </view>
  35. <view class="no-more">没有更多内容了~</view>
  36. </view>
  37. <view class="footer-bar">
  38. <view class="content flex flex-center">
  39. <navigator :url="`/saomaDiancan/editPrinter/editPrinter?type=${type}`" class="btn">+新增设备</navigator>
  40. </view>
  41. </view>
  42. </view>
  43. </template>
  44. <script>
  45. export default {
  46. data() {
  47. return {
  48. store_id: "",
  49. list: [],
  50. page: 1,
  51. is_bottom: false,
  52. type:2
  53. }
  54. },
  55. onLoad(options) {
  56. this.type=options.type||2;
  57. this.store_id = uni.getStorageSync("store_id");
  58. },
  59. onShow() {
  60. this.getData(1)
  61. },
  62. onReachBottom() {
  63. if (!this.is_bottom) {
  64. this.getData(this.page + 1)
  65. }
  66. },
  67. methods: {
  68. del(id) {
  69. uni.showModal({
  70. title: '提示',
  71. content: '是否要删除?',
  72. showCancel: true,
  73. cancelText: '取消',
  74. confirmText: '确定',
  75. success: res => {
  76. if (res.confirm) {
  77. this.request({
  78. url: 'Smdcshop/print_delect',
  79. data: {
  80. id:id,
  81. },
  82. }).then(res => {
  83. console.log(res, "res")
  84. if (res.code === 200 || res.code === "200") {
  85. uni.showToast({
  86. title: "删除成功",
  87. icon: "none",
  88. })
  89. setTimeout(() => {
  90. this.getData(1)
  91. }, 2000)
  92. }
  93. }).catch((res) => {
  94. uni.showToast({
  95. title: res.message,
  96. icon: "none",
  97. })
  98. });
  99. }
  100. },
  101. fail: () => {},
  102. complete: () => {}
  103. });
  104. },
  105. onTypeChange(e) {
  106. console.log(e)
  107. let a = e.detail.value ? 1 : 2;
  108. this.checked(a, e.currentTarget.dataset.index);
  109. },
  110. checked(a, index) {
  111. this.request({
  112. url: 'Smdcshop/print_state',
  113. data: {
  114. is_show: a,
  115. id: this.list[index].id,
  116. },
  117. }).then(res => {
  118. if (res.code == "200") {
  119. uni.showToast({
  120. title: "修改成功",
  121. icon: "none",
  122. })
  123. }
  124. }).catch((res) => {
  125. uni.showToast({
  126. title: res.message,
  127. icon: "none",
  128. })
  129. this.$nextTick(() => {
  130. this.list[index].state = 2
  131. })
  132. });
  133. },
  134. getData(page) {
  135. if (page == 1) {
  136. this.list = []
  137. this.page = 1
  138. this.is_bottom = false
  139. }
  140. this.request({
  141. url: 'Smdcshop/print_list',
  142. data: {
  143. page,
  144. limit: 10,
  145. store_id: this.store_id,
  146. admin_id: uni.getStorageSync("admin_id"),
  147. }
  148. }).then(res => {
  149. if (res.code == 200 && res.data.length) {
  150. this.list = this.list.concat(res.data)
  151. this.page = page
  152. } else {
  153. this.is_bottom = true
  154. }
  155. })
  156. }
  157. }
  158. }
  159. </script>
  160. <style>
  161. @import url("../static/css/common.css");
  162. .del {
  163. height: 44rpx;
  164. line-height: 44rpx;
  165. padding: 0 15rpx;
  166. font-size: 24rpx;
  167. background-color: #FF5722;
  168. margin-right: 25rpx;
  169. color: #fff;
  170. border-radius: 20rpx;
  171. }
  172. page {
  173. background-color: #F4F5F7;
  174. }
  175. .list {
  176. padding: 30rpx 25rpx;
  177. }
  178. .list .item {
  179. border-radius: 8rpx;
  180. overflow: hidden;
  181. padding-left: 30rpx;
  182. border-left: 8rpx solid #247EFF;
  183. background-color: #fff;
  184. margin-bottom: 30rpx;
  185. }
  186. .list .item .top {
  187. height: 80rpx;
  188. border-bottom: 1rpx solid #f5f5f5;
  189. }
  190. .list .item .top .name {
  191. font-size: 30rpx;
  192. line-height: 80rpx;
  193. font-weight: bold;
  194. }
  195. .list .item .top .type-btn {
  196. zoom: 0.7;
  197. margin-right: 25rpx;
  198. }
  199. .list .item .content {
  200. padding: 20rpx 0 24rpx;
  201. }
  202. .list .item .content .cell {
  203. flex: none;
  204. width: 50%;
  205. box-sizing: border-box;
  206. padding-right: 30rpx;
  207. font-size: 26rpx;
  208. line-height: 37rpx;
  209. color: #666;
  210. }
  211. .list .item .content .cell .title {
  212. color: #99A0AD;
  213. }
  214. </style>