home.vue 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191
  1. <template>
  2. <view class="home-wrap">
  3. <view class="home-title">
  4. <view class="title-bac">
  5. <view class="roomt">
  6. <span class="rom-spn">当前所在仓库</span>
  7. <span class="quit-spn"></span>
  8. </view>
  9. <view class="rom-set">
  10. <view class="park"></view>
  11. <view class="houseName">{{houseName}}</view>
  12. <view class="down"></view>
  13. </view>
  14. </view>
  15. </view>
  16. </view>
  17. </template>
  18. <script>
  19. import {
  20. listData
  21. } from "./list.js";
  22. import {
  23. mapState,
  24. mapMutations,
  25. mapActions
  26. } from 'vuex';
  27. export default {
  28. components: {
  29. },
  30. mounted() {
  31. // this.getDataList({
  32. // type: "NotOut"
  33. // });
  34. },
  35. computed: {
  36. ...mapState(['groundData'])
  37. },
  38. data() {
  39. return {
  40. listData: listData,
  41. houseName: "一号仓库",
  42. appData: [{
  43. iconUrl: "../../static/shangjia.png",
  44. name: "上架确认",
  45. bgColor: "#6163AF",
  46. path: "/pages/grounding/grounding"
  47. },
  48. {
  49. iconUrl: "../../static/jianhuo.png",
  50. name: "出库拣货",
  51. bgColor: "#3789EA",
  52. path: "/pages/outbound/outbound"
  53. },
  54. {
  55. iconUrl: "../../static/pandian.png",
  56. name: "库存盘点",
  57. bgColor: "#2CE4BF",
  58. path: "/pages/Inventory/Inventory"
  59. },
  60. {
  61. iconUrl: "../../static/jiansuo.png",
  62. name: "商品检索",
  63. bgColor: "#FFB867",
  64. path: "/pages/query/query"
  65. },
  66. {
  67. iconUrl: "../../static/xiaohao.svg",
  68. name: "商品消耗",
  69. bgColor: "#94BE5B",
  70. path: "/pages/consume/consume"
  71. },
  72. ]
  73. }
  74. },
  75. onLoad() {
  76. },
  77. methods: {
  78. ...mapActions(['getGroundData']),
  79. //跳转更多页面
  80. moreView() {
  81. uni.navigateTo({
  82. url: '/pages/grounding/grounding',
  83. success: function(res) {}
  84. });
  85. },
  86. dateChange(slectd) {
  87. this.getDataList({
  88. type: slectd[0][0].value
  89. });
  90. },
  91. // 获取数据
  92. getDataList(data) {
  93. this.getGroundData(data);
  94. }
  95. }
  96. }
  97. </script>
  98. <style lang="scss" scoped>
  99. .home-wrap {
  100. width: 100%;
  101. height: 100%;
  102. overflow-y: auto;
  103. .home-title {
  104. width: 100%;
  105. height: auto;
  106. .title-bac {
  107. width: 100%;
  108. height: 392rpx;
  109. border-radius: 0rpx 0rpx 40rpx 40rpx;
  110. background: linear-gradient(180deg, rgba(1, 169, 146, 1) 0%, rgba(1, 176, 164, 0.54) 46%, rgba(2, 181, 176, 0.24) 100%, rgba(2, 185, 185, 0) 100%);
  111. padding: 20rpx;
  112. box-sizing: border-box;
  113. .roomt {
  114. width: 100%;
  115. height: 70rpx;
  116. display: flex;
  117. align-items: center;
  118. justify-content: space-between;
  119. .rom-spn {
  120. color: rgba(255, 255, 255, 0.9);
  121. font-size: 36rpx;
  122. text-align: left;
  123. font-family: PingFangSC-bold;
  124. }
  125. .quit-spn {
  126. width: 48rpx;
  127. height: 48rpx;
  128. background: url('../../static/logout.svg');
  129. background-size: 100% 100%;
  130. }
  131. }
  132. .rom-set {
  133. width: 100%;
  134. height: 50rpx;
  135. display: flex;
  136. align-items: center;
  137. .park {
  138. width: 40rpx;
  139. height: 40rpx;
  140. background: url('../../static/iconPark.svg');
  141. background-size: 100% 100%;
  142. }
  143. .houseName {
  144. color: rgba(255, 255, 255, 0.9);
  145. font-size: 36rpx;
  146. text-align: left;
  147. font-family: OPPOSans-medium;
  148. margin-left:20rpx;
  149. }
  150. .down {
  151. width: 40rpx;
  152. height: 40rpx;
  153. background: url('../../static/down.svg');
  154. background-size: 100% 100%;
  155. margin-left:20rpx;
  156. }
  157. }
  158. }
  159. }
  160. }
  161. uni-page-body {
  162. width: 100%;
  163. height: 100%;
  164. }
  165. uni-page-wrapper {
  166. width: 100%;
  167. height: 100%;
  168. }
  169. uni-page {
  170. width: 100%;
  171. height: 100%;
  172. }
  173. </style>