viewDetail.vue 7.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265
  1. <template>
  2. <view class="p-content">
  3. <view class="p-head" v-if="baseData">
  4. <view>
  5. <view>
  6. <text>盘点单号:</text>
  7. <text style="color: crimson;">{{baseData.checkWarehouseNo}}</text>
  8. </view>
  9. </view>
  10. <view>
  11. <view>
  12. <text>盘点类型:</text>
  13. <view>
  14. {{baseData.checkTypeDictValue}}
  15. </view>
  16. </view>
  17. <view>
  18. <text>创建人:</text>
  19. <view>
  20. {{baseData.creatorName}}
  21. </view>
  22. </view>
  23. </view>
  24. <view>
  25. <view>
  26. <text>盘点仓库:</text>
  27. <view>
  28. {{baseData.warehouseNameList||'--'}}
  29. </view>
  30. </view>
  31. </view>
  32. <view>
  33. <view>
  34. <text>创建时间:</text>
  35. <view>
  36. {{baseData.createDate}}
  37. </view>
  38. </view>
  39. </view>
  40. <view>
  41. <view>
  42. <text>审核时间:</text>
  43. <view>
  44. {{baseData.checkSuperviseTime}}
  45. </view>
  46. </view>
  47. </view>
  48. <view v-if="countData" style="justify-content: flex-start;flex-wrap: wrap;">
  49. <view>共{{countData.totalCategory||0}}款</view>
  50. <view>总数量:{{countData.stockQty||0}}</view>
  51. <view>盈亏数量:<span :style="{ color: countData.totalCheckProfitLossQty>0?'red':countData.totalCheckProfitLossQty<0?'green':'' }">{{ (countData.totalCheckProfitLossQty || countData.totalCheckProfitLossQty==0) ? Math.abs(countData.totalCheckProfitLossQty) : '--' }}</span></view>
  52. <view v-if="baseData&&baseData.state == 'FINISH'">盈亏总成本:<span :style="{ color: countData.totalCheckProfitLossCost>0?'red':countData.totalCheckProfitLossCost<0?'green':'' }">¥{{ (countData.totalCheckProfitLossCost || countData.totalCheckProfitLossCost==0) ? Number(countData.totalCheckProfitLossCost).toFixed(2) : '--' }}</span></view>
  53. </view>
  54. </view>
  55. <view class="p-body">
  56. <view class="uni-table">
  57. <!-- 表头行 -->
  58. <uni-tr>
  59. <uni-td width="30%" align="center">产品编码</uni-td>
  60. <uni-td width="22%" align="center">库存</uni-td>
  61. <uni-td width="26%" align="center">盈亏数量</uni-td>
  62. <uni-td width="22%" align="center" v-if="baseData&&baseData.state == 'FINISH'" >盈亏成本</uni-td>
  63. </uni-tr>
  64. </view>
  65. <scroll-view enable-flex scroll-y="true" class="table-scroll-body" @scrolltolower="scrolltolower">
  66. <uni-table style="width: 100%;" border :loading="loading">
  67. <!-- 表格数据行 -->
  68. <uni-tr v-for="item in detailList" :key="item.id" @click="toDetail(item)">
  69. <uni-td width="30%" align="center">{{item.productCode}}</uni-td>
  70. <uni-td width="22%" align="center">{{item.stockQty}}</uni-td>
  71. <uni-td width="26%" align="center">
  72. <span :style="{ color: item.checkProfitLossQty>0?'red':item.checkProfitLossQty<0?'green':'' }">{{ (item.checkProfitLossQty || item.checkProfitLossQty==0) ? Math.abs(item.checkProfitLossQty) : '--' }}</span>
  73. </uni-td>
  74. <uni-td width="22%" align="center" v-if="baseData&&baseData.state == 'FINISH'" >
  75. <span :style="{ color: item.checkProfitLossCost>0?'red':item.checkProfitLossCost<0?'green':'' }">¥{{ (item.checkProfitLossCost || item.checkProfitLossCost==0) ? Number(item.checkProfitLossCost).toFixed(2) : '--' }}</span>
  76. </uni-td>
  77. </uni-tr>
  78. </uni-table>
  79. </scroll-view>
  80. </view>
  81. <view class="p-footer" v-if="baseData&&baseData.state == 'WAIT_CHECK_WAREHOUSE'">
  82. <button size="mini" type="warn" @click="showModal=true"> 重盘 <text class="iconfont icon-icon-test43"></text></button>
  83. </view>
  84. <u-modal
  85. :show="showModal"
  86. title="提示"
  87. showCancelButton
  88. content='重新盘点后,盘点单状态回退到待提交。确认重新盘点吗?'
  89. @confirm="submitIn"
  90. @cancel="showModal=false"
  91. @close="showModal=false"
  92. ></u-modal>
  93. </view>
  94. </template>
  95. <script>
  96. import { playAudio } from '@/libs/tools.js'
  97. import {
  98. checkWarehouseDetailStockList,
  99. checkWarehouseDetailBySn,
  100. checkWarehouseDetailList,
  101. checkWarehouseDetailCount,
  102. checkWarehouseReInventory} from '@/config/api.js'
  103. export default {
  104. components: { },
  105. data() {
  106. return {
  107. showModal: false,
  108. checkWarehouseSn: '',
  109. checkWarehouseId: null,
  110. loading: false,
  111. detailList:[],
  112. countData: null,
  113. code:'',
  114. baseData: null,
  115. pageNo: 1,
  116. pageSize: 10,
  117. total: 0,
  118. };
  119. },
  120. onLoad(opts) {
  121. var _this = this
  122. this.checkWarehouseSn = opts.checkWarehouseSn
  123. this.checkWarehouseId = opts.id
  124. this.getDetail()
  125. this.pageInit()
  126. },
  127. onShow() {
  128. this.pageInit()
  129. },
  130. methods: {
  131. pageInit(){
  132. this.pageNo = 1
  133. this.getTotal()
  134. this.getDetailList()
  135. },
  136. // 详情
  137. getDetail(){
  138. checkWarehouseDetailBySn({sn: this.checkWarehouseSn}).then(res => {
  139. if(res.status == 200){
  140. this.baseData = res.data
  141. }
  142. })
  143. },
  144. // 已添加产品列表
  145. getDetailList(){
  146. this.loading = true
  147. uni.showLoading({
  148. title: '正在加载...',
  149. icon: 'none'
  150. })
  151. checkWarehouseDetailList({pageNo:this.pageNo,pageSize:this.pageSize,checkWarehouseSn:this.checkWarehouseSn}).then(res => {
  152. console.log(res,'已添加产品列表')
  153. if(res.status == 200){
  154. const list = res.data.list||[]
  155. this.total = res.data.count
  156. if(this.pageNo == 1){
  157. this.detailList = list
  158. }else{
  159. this.detailList = this.detailList.concat(list)
  160. }
  161. }
  162. uni.hideLoading()
  163. this.loading = false
  164. })
  165. },
  166. getTotal(){
  167. checkWarehouseDetailCount({checkWarehouseSn:this.checkWarehouseSn}).then(res => {
  168. console.log(res,'getTotal')
  169. this.countData = res.data
  170. })
  171. },
  172. // 商品详情
  173. toDetail(item) {
  174. this.$store.state.vuex_tempData = item
  175. uni.navigateTo({
  176. url:"/pages/stockPan/detail?state="+this.baseData.state
  177. })
  178. },
  179. // 重盘
  180. submitIn(){
  181. checkWarehouseReInventory({id: this.checkWarehouseId}).then(res => {
  182. if(res.status == 200){
  183. uni.navigateBack()
  184. }
  185. })
  186. },
  187. scrolltolower(e){
  188. const pageNums = Math.ceil(this.total / this.pageSize)
  189. if(this.pageNo < pageNums){
  190. this.pageNo = this.pageNo + 1
  191. this.getDetailList()
  192. }else{
  193. uni.$u.toast("没有更多数据了!")
  194. }
  195. }
  196. },
  197. }
  198. </script>
  199. <style lang="scss">
  200. $border-color:#EBEEF5;
  201. .p-content{
  202. button{
  203. line-height: 1.7;
  204. }
  205. .uni-table {
  206. position: relative;
  207. width: 100%;
  208. border-radius: 5px;
  209. background-color: #fff;
  210. /* #ifndef APP-NVUE */
  211. box-sizing: border-box;
  212. display: table;
  213. overflow-x: auto;
  214. ::v-deep .uni-table-tr:nth-child(n + 2) {
  215. &:hover {
  216. background-color: #f5f7fa;
  217. }
  218. }
  219. ::v-deep .uni-table-td{
  220. border-right: 1px $border-color solid;
  221. }
  222. /* #endif */
  223. }
  224. .table-scroll-body{
  225. height: calc(100% - 32px);
  226. width: 100%;
  227. overflow: auto;
  228. }
  229. .p-head{
  230. font-size: 32upx;
  231. color: $uni-text-color;
  232. >view{
  233. display: flex;
  234. align-items: center;
  235. padding: 15upx 20upx;
  236. border-bottom: 1px solid #eee;
  237. justify-content: space-between;
  238. > view{
  239. display: flex;
  240. padding: 0 10upx;
  241. align-items: center;
  242. }
  243. }
  244. .uni-input{
  245. border: 1px solid #eee;
  246. width: 150upx;
  247. text-align: center;
  248. }
  249. }
  250. .p-body{
  251. overflow: auto;
  252. flex-grow: 1;
  253. height: 50%;
  254. }
  255. .p-footer{
  256. padding:20upx 30upx;
  257. display: flex;
  258. > button{
  259. width: 30%;
  260. }
  261. }
  262. }
  263. </style>