detail.vue 1.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. <template>
  2. <view>
  3. <view class="status_bar">
  4. <!-- 这里是状态栏 -->
  5. </view>
  6. <uni-nav-bar shadow left-icon="left" title="入库明细" @clickLeft="back" />
  7. <view v-for="item in dataList" :key="item.id">
  8. <uni-card :is-shadow="false" margin="5px" @click='goPage(item)'>
  9. <template v-slot:title>
  10. <uni-list>
  11. <uni-list-item :title="'入库单号'+item.code" showArrow />
  12. </uni-list>
  13. </template>
  14. <view class="card-content">
  15. <text>提单号:{{item.no}}</text>
  16. <text>件数:{{item.qty}}</text>
  17. <text>货物名称:{{item.goodsName}}</text>
  18. <text>库区:{{item.stock}}</text>
  19. </view>
  20. </uni-card>
  21. </view>
  22. </view>
  23. </template>
  24. <script>
  25. export default {
  26. data() {
  27. return {
  28. dataList: [{
  29. id: 1,
  30. code: "111",
  31. no: 'QD-1',
  32. name: '客户1',
  33. date: '2020-01-01',
  34. goodsName: '货物1',
  35. qty: '2',
  36. stock: '库区1'
  37. },
  38. {
  39. id: 2,
  40. code: "222",
  41. no: 'QD-2',
  42. name: '客户2',
  43. date: '2020-01-02',
  44. goodsName: '货物2',
  45. qty: '3',
  46. stock: '库区2'
  47. }
  48. ]
  49. };
  50. },
  51. methods: {
  52. back() {
  53. uni.navigateBack({
  54. delta: 1
  55. })
  56. },
  57. search() {
  58. uni.showToast({
  59. title: '搜索'
  60. })
  61. },
  62. goPage(row) {
  63. uni.navigateTo({
  64. url: '../addTags',
  65. });
  66. }
  67. }
  68. }
  69. </script>
  70. <style lang="scss" scoped>
  71. .status_bar {
  72. height: var(--status-bar-height);
  73. width: 100%;
  74. background-color: rgb(52, 120, 243);
  75. }
  76. .card-content {
  77. display: flex;
  78. flex-direction: column;
  79. text: {
  80. color: #000000
  81. }
  82. }
  83. </style>