viewDetail.vue 7.2 KB

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