viewDetail.vue 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154
  1. <template>
  2. <view class="p-content1">
  3. <view class="p-head" v-if="detailData">
  4. <view>
  5. <view>
  6. <text>连锁调出单号:</text>
  7. <text style="color: crimson;">{{detailData.allocationLinkageOutNo}}</text>
  8. </view>
  9. </view>
  10. <view>
  11. <view>
  12. <text>调往对象:</text>
  13. <view>
  14. {{detailData.putTenantName||'--'}}
  15. </view>
  16. </view>
  17. </view>
  18. <view>
  19. <view>
  20. <text>调拨类型:</text>
  21. <view>
  22. {{detailData.allocationTypeDictValue||'--'}}
  23. </view>
  24. </view>
  25. </view>
  26. <view>
  27. <view>
  28. <text>业务状态:</text>
  29. <view>
  30. {{detailData.stateDictValue||'--'}}
  31. </view>
  32. </view>
  33. </view>
  34. <view>
  35. <view>
  36. <text>财务状态:</text>
  37. <view>
  38. {{detailData.settleStateDictValue||'--'}}
  39. </view>
  40. </view>
  41. </view>
  42. <view>
  43. <view>
  44. <text>备注:</text>
  45. <view>
  46. {{detailData.remark||'--'}}
  47. </view>
  48. </view>
  49. </view>
  50. <view v-if="productTotal" style="justify-content: flex-start;flex-wrap: wrap;">
  51. <view>总款数:{{productTotal.productTotalCategory||0}}</view>
  52. <view>总数量:{{productTotal.productTotalQty||0}}</view>
  53. <view>总成本:¥{{productTotal.productTotalCost||0}}</view>
  54. </view>
  55. </view>
  56. <view class="p-body">
  57. <uni-table style="width: 100%;" border emptyText="暂无数据" :loading="loading" >
  58. <!-- 表头行 -->
  59. <uni-tr>
  60. <uni-td align="center">产品编码</uni-td>
  61. <uni-td align="center">产品名称</uni-td>
  62. <uni-td align="center">调出数量</uni-td>
  63. <uni-td align="center">成本价</uni-td>
  64. </uni-tr>
  65. <!-- 表格数据行 -->
  66. <uni-tr v-for="item in detailList" :key="item.id">
  67. <uni-td width="30%" align="center">{{item.dealerProductEntity.code}}</uni-td>
  68. <uni-td width="30%" align="center">{{item.dealerProductEntity.name}}</uni-td>
  69. <uni-td width="20%" align="center">{{item.outQty}}</uni-td>
  70. <uni-td width="20%" align="center"><u--text mode="price" :text="item.outCost"></u--text></uni-td>
  71. </uni-tr>
  72. </uni-table>
  73. </view>
  74. </view>
  75. </template>
  76. <script>
  77. import { allocLinkageOutDetail, allocLinkageOutDetailCount, allocLinkageOutDetailList } from '@/config/api.js'
  78. export default {
  79. data() {
  80. return {
  81. loading: false,
  82. detailData: null,
  83. productTotal: null,
  84. detailList:[],
  85. code:'',
  86. allocationLinkageOutSn: null,
  87. };
  88. },
  89. onLoad(opts) {
  90. this.allocationLinkageOutSn = opts.allocationLinkageOutSn
  91. this.getDetail()
  92. this.getCount()
  93. this.getDetailList()
  94. },
  95. methods: {
  96. // 详情
  97. getDetail(){
  98. allocLinkageOutDetail({sn: this.allocationLinkageOutSn}).then(res => {
  99. if(res.status == 200){
  100. this.detailData = res.data
  101. }
  102. })
  103. },
  104. // 合计
  105. getCount(){
  106. allocLinkageOutDetailCount({allocationLinkageOutSn: this.allocationLinkageOutSn}).then(res => {
  107. if(res.status == 200){
  108. this.productTotal = res.data
  109. }
  110. })
  111. },
  112. // 产品明细列表
  113. getDetailList(){
  114. allocLinkageOutDetailList({pageNo:1,pageSize:1000,allocationLinkageOutSn:this.allocationLinkageOutSn}).then(res => {
  115. if(res.status == 200){
  116. this.detailList = res.data.list
  117. }
  118. })
  119. },
  120. },
  121. }
  122. </script>
  123. <style lang="scss">
  124. .p-content1{
  125. .p-head{
  126. font-size: 32upx;
  127. color: $uni-text-color;
  128. >view{
  129. display: flex;
  130. align-items: center;
  131. padding: 10upx 20upx;
  132. border-bottom: 1px solid #eee;
  133. > view{
  134. display: flex;
  135. padding: 0 10upx;
  136. align-items: center;
  137. }
  138. }
  139. }
  140. .p-body{
  141. overflow: auto;
  142. }
  143. .p-footer{
  144. padding:20upx 30upx;
  145. display: flex;
  146. > button{
  147. width: 30%;
  148. }
  149. }
  150. }
  151. </style>