|
@@ -0,0 +1,386 @@
|
|
|
+<template>
|
|
|
+ <view class="page" :style="{'min-height':h+'px', 'padding-top':mt+'px'}">
|
|
|
+ <cus-header title='库存记录' bgColor='transparent'></cus-header>
|
|
|
+ <image class="topbg" :src="imgBase+'storage/home_bg.png'" mode="widthFix"></image>
|
|
|
+ <div class="search">
|
|
|
+ <u--input
|
|
|
+ placeholder="请输入商品名称"
|
|
|
+ border="none"
|
|
|
+ prefixIcon="search"
|
|
|
+ prefixIconStyle="font-size: 24px;color: #86909C"
|
|
|
+ v-model="params.itemName"
|
|
|
+ ></u--input>
|
|
|
+ <div class="btn" @tap="search">搜索</div>
|
|
|
+ </div>
|
|
|
+ <div class="type">
|
|
|
+ <template v-if="typeList.length">
|
|
|
+ <div class="pre" v-for="(item,index) in typeList" :key="index" :style="{'width':'calc(100% / '+typeList.length+')'}"
|
|
|
+ @tap="changeType(item.dictValue)" :class="{'active':params.orderType===item.dictValue}">
|
|
|
+ {{item.dictLabel}}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ <div class="select">
|
|
|
+ <div class="left">选择仓库</div>
|
|
|
+ <div class="right" @tap="selectWarehouse">
|
|
|
+ <text v-if="warehouseName">{{warehouseName}} ></text>
|
|
|
+ <text class="tip" v-else>请选择仓库 ></text>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="list" :style="{'height':'calc(100vh - '+(mt+175)+'px)'}">
|
|
|
+ <template v-if="list.length">
|
|
|
+ <u-list @scrolltolower="scrolltolower">
|
|
|
+ <u-list-item v-for="(good, index) in list" :key="good.id">
|
|
|
+ <div class="item">
|
|
|
+ <div class="top">
|
|
|
+ <div class="name">{{good.item.itemName}}</div>
|
|
|
+ <div class="ktype" @tap="toDetail(good.id)">
|
|
|
+ <div class="box" :class="typeClass[good.orderType]||'mr'">{{typeCfg[good.orderType]||''}}</div>
|
|
|
+ <span>></span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="info">
|
|
|
+ <div class="iitem">
|
|
|
+ <div class="pre pre1">
|
|
|
+ 操作时间:<span>{{good.createDate||''}}</span>
|
|
|
+ </div>
|
|
|
+ <div class="pre">
|
|
|
+ 数量:<span class="jc"><span v-if="good.quantity>0">+</span>{{good.quantity||0}}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="iitem">
|
|
|
+ <div class="pre pre1">
|
|
|
+ 操作前:<span class="jc">{{good.beforeQuantity||0}}</span>
|
|
|
+ </div>
|
|
|
+ <div class="pre">
|
|
|
+ 操作后:<span class="jc">{{good.afterQuantity||0}}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="iitem">
|
|
|
+ <div class="pre pre1">
|
|
|
+ 规格信息:<span v-if="good.itemSku.skuCode">{{good.itemSku.skuCode+'/'}}</span>
|
|
|
+ <span v-if="good.itemSku.skuName">{{good.itemSku.skuName||''}}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </u-list-item>
|
|
|
+ </u-list>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <page-empty height="100vh"></page-empty>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ <u-picker title="仓库" :show="warehouseShow" :columns="warehouseList" keyName="warehouseName"
|
|
|
+ @cancel="warehouseShow=false" @confirm="warehouseConfirm">
|
|
|
+ </u-picker>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ data(){
|
|
|
+ return {
|
|
|
+ params:{
|
|
|
+ page:1,
|
|
|
+ limit:10,
|
|
|
+ orderType:'',
|
|
|
+ itemName:'',
|
|
|
+ warehouseId:'',
|
|
|
+ },
|
|
|
+ typeList:[],
|
|
|
+ typeCfg:{},
|
|
|
+ typeClass:{
|
|
|
+ 1:'rk',
|
|
|
+ 2:'ck',
|
|
|
+ 3:'yk',
|
|
|
+ 4:'pk'
|
|
|
+ },
|
|
|
+ list:[],
|
|
|
+ warehouseName:'',
|
|
|
+ warehouseShow:false,
|
|
|
+ warehouseList:[],
|
|
|
+ isOver:false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async onLoad() {
|
|
|
+ await this.getStorageType();
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ async getStorageType(){
|
|
|
+ let res = await this.$api.get('/sys/dict/data/getListByType/wms_inventory_history_type');
|
|
|
+ if(res.data.code===0){
|
|
|
+ this.typeList = res.data.data;
|
|
|
+ res.data.data.forEach(d=>{
|
|
|
+ this.typeCfg[d.dictValue] = d.dictLabel;
|
|
|
+ })
|
|
|
+ this.typeList.unshift({dictValue:'',dictLabel:'全部'})
|
|
|
+ }else this.$showToast(res.data.msg)
|
|
|
+ },
|
|
|
+ changeType(type){
|
|
|
+ this.params.orderType = type;
|
|
|
+ this.initList();
|
|
|
+ },
|
|
|
+ initList(){
|
|
|
+ this.params.page = 1;
|
|
|
+ this.list = [];
|
|
|
+ this.isOver = false;
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ selectWarehouse(){
|
|
|
+ this.warehouseShow = true;
|
|
|
+ this.$nextTick(()=>{
|
|
|
+ this.$api.get('/wms/warehouse/page').then(res=>{
|
|
|
+ if(res.data.code===0){
|
|
|
+ this.warehouseList = [res.data.data.list];
|
|
|
+ }else this.$showToast(res.data.msg)
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ warehouseConfirm(e){
|
|
|
+ this.params.warehouseId = e.value[0].id;
|
|
|
+ this.warehouseName = e.value[0].warehouseName;
|
|
|
+ this.warehouseShow = false;
|
|
|
+ this.initList();
|
|
|
+ },
|
|
|
+ getList(){
|
|
|
+ this.$api.get('/wms/inventoryhistory/page',this.params).then(res=>{
|
|
|
+ if(res.data.code===0){
|
|
|
+ if(this.list.length<res.data.data.total){
|
|
|
+ this.params.page++;
|
|
|
+ this.list = [...this.list,...res.data.data.list];
|
|
|
+ }else this.isOver = true
|
|
|
+ }else this.$showModal(res.data.msg)
|
|
|
+ });
|
|
|
+ },
|
|
|
+ search(){
|
|
|
+ this.initList();
|
|
|
+ },
|
|
|
+ initList(){
|
|
|
+ this.params.page = 1;
|
|
|
+ this.list = [];
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ scrolltolower(){
|
|
|
+ if(this.isOver) return
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ toDetail(id){
|
|
|
+ uni.navigateTo({
|
|
|
+ url:'/pagesStorage/storageRecord/detail?id='+id
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="less">
|
|
|
+ .page{
|
|
|
+ padding: 0 24rpx 20rpx;
|
|
|
+ background: #F4F8FB;
|
|
|
+ box-sizing: border-box;
|
|
|
+
|
|
|
+ .topbg{
|
|
|
+ width: 100%;
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ z-index: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .search{
|
|
|
+ width: 100%;
|
|
|
+ height: 84rpx;
|
|
|
+ padding: 6rpx 6rpx 6rpx 30rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 40rpx;
|
|
|
+ border: 1rpx solid #198CFF;
|
|
|
+ position: relative;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ .btn{
|
|
|
+ width: 118rpx;
|
|
|
+ height: 68rpx;
|
|
|
+ background: #198CFF;
|
|
|
+ border-radius: 40rpx;
|
|
|
+ border: 1rpx solid #198CFF;
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #FFFFFF;
|
|
|
+ line-height: 68rpx;
|
|
|
+ text-align: center;
|
|
|
+ letter-spacing: 2rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .type{
|
|
|
+ width: 100%;
|
|
|
+ height: 80rpx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 16rpx;
|
|
|
+ display: flex;
|
|
|
+ position: relative;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ .pre{
|
|
|
+ height: 100%;
|
|
|
+ position: relative;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #1D2129;
|
|
|
+ &.active{
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #198CFF;
|
|
|
+ &::after{
|
|
|
+ content: '';
|
|
|
+ width: 40rpx;
|
|
|
+ height: 6rpx;
|
|
|
+ background: #198CFF;
|
|
|
+ border-radius: 3rpx;
|
|
|
+ position: absolute;
|
|
|
+ left: 50%;
|
|
|
+ margin-left: -20rpx;
|
|
|
+ bottom: 3rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .select{
|
|
|
+ width: 100%;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 16rpx;
|
|
|
+ padding: 24rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ position: relative;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ .left{
|
|
|
+ font-family: PingFang-SC, PingFang-SC;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 30rpx;
|
|
|
+ color: #1D2129;
|
|
|
+ line-height: 42rpx;
|
|
|
+ }
|
|
|
+ .right{
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 30rpx;
|
|
|
+ color: #4E5969;
|
|
|
+ line-height: 42rpx;
|
|
|
+ text-align: right;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .list{
|
|
|
+ width: 100%;
|
|
|
+ padding: 0 24rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ position: relative;
|
|
|
+ border-radius: 16rpx 16rpx 0rpx 0rpx;
|
|
|
+ ::v-deep .u-list{
|
|
|
+ width: 100%;
|
|
|
+ height: 100% !important;
|
|
|
+ }
|
|
|
+ ::v-deep .u-list-item{
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ .item{
|
|
|
+ width: 100%;
|
|
|
+ padding: 36rpx 0;
|
|
|
+ box-sizing: border-box;
|
|
|
+ box-shadow: inset 0rpx -1rpx 0rpx 0rpx #ECECEC;
|
|
|
+ .top{
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ .name{
|
|
|
+ font-family: PingFang-SC, PingFang-SC;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 30rpx;
|
|
|
+ color: #1D2129;
|
|
|
+ line-height: 30rpx;
|
|
|
+ text-align: left;
|
|
|
+ }
|
|
|
+ .ktype{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ .box{
|
|
|
+ height: 40rpx;
|
|
|
+ border-radius: 6rpx;
|
|
|
+ padding: 0 12rpx;
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #FFFFFF;
|
|
|
+ line-height: 40rpx;
|
|
|
+ &.rk{
|
|
|
+ background: #14CC8C;
|
|
|
+ }
|
|
|
+ &.ck{
|
|
|
+ background: #FF817C;
|
|
|
+ }
|
|
|
+ &.yk{
|
|
|
+ background: #FEA34C;
|
|
|
+ }
|
|
|
+ &.pk{
|
|
|
+ background: #98A1FE;
|
|
|
+ }
|
|
|
+ &.mr{
|
|
|
+ background: lightgray;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ span{
|
|
|
+ font-size: 36rpx;
|
|
|
+ color: #86909C;
|
|
|
+ margin-left: 23rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .info{
|
|
|
+ width: 100%;
|
|
|
+ .iitem{
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ .pre{
|
|
|
+ margin-top: 24rpx;
|
|
|
+ width: 250rpx;
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #86909C;
|
|
|
+ line-height: 24rpx;
|
|
|
+ text-align: right;
|
|
|
+ padding-right: 40rpx;
|
|
|
+ span{
|
|
|
+ color: #4E5969;
|
|
|
+ &.jc{
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 26rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ &.pre1{
|
|
|
+ width: calc(100% - 250rpx);
|
|
|
+ text-align: left;
|
|
|
+ padding-right: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|