viewDetail.vue 3.8 KB

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