sap库存页面调整

master
FCD 1 week ago
parent 573911dbff
commit f67b0062b5

@ -14,25 +14,21 @@
</u-form>
<!-- 列表 -->
<view class="scroll">
<view v-for="item in sapStockList" :key="item.id">
<u-form style="margin-top: 10rpx" class="form2">
<view>
<lj-list-row label="物料编码:" :value="removeLeadingZeros(item.matnr)" />
<lj-list-row label="物料名称:" :value="item.maktx" />
<lj-list-row label="非限制库存:" :value="removeLastZeros(item.clabs)" />
<lj-list-row label="冻结库存:" :value="removeLastZeros(item.cspem)" />
</view>
</u-form>
</view>
</view>
<scroll-view id="list" scroll-y="true" :style="{ height: listHeight + 'px' }" @scrolltolower="onScrollToLower" :lower-threshold="50">
<!-- 列表 -->
<u-form class="list">
<view class="list-item" v-for="item in sapStockList" :key="item.id">
<lj-list-row label="物料编码:" :value="removeLeadingZeros(item.matnr)" />
<lj-list-row label="物料名称:" :value="item.maktx" />
<lj-list-row label="非限制库存:" :value="removeLastZeros(item.clabs)" />
<lj-list-row label="冻结库存:" :value="removeLastZeros(item.cspem)" />
</view>
</u-form>
</scroll-view>
<!-- 按钮 -->
<view class="bottom-bar">
<view id="button" class="bottom-bar">
<u-row class="button-bar">
<view style="position: absolute; bottom: 120rpx; width: 90%">
<lj-pagination :total="total" :currentPage="queryParams.pageNum" @change="changePage"></lj-pagination>
</view>
<u-col :span="12">
<u-button type="primary" @click="search"></u-button>
</u-col>
@ -48,22 +44,16 @@ import { Component } from 'vue-property-decorator';
import jPicker from '@/components/J-Picker/jPicker.vue';
import LjRowList from '@/components/lanju/lj-list-row/index.vue';
import LjListRow from '@/components/lanju/lj-list-row/index.vue';
import model from './model';
import { getSapStockList } from './model';
import { removeLeadingZeros } from '@/utils/tool';
import ljPagination from '@/components/lanju/lj-pagination/index.vue';
interface QueryParamsPo {
matnr: string;
maktx: string;
pdaSearch: '1';
pageNum: 1;
pageSize: 10;
}
interface SapStockPo {
materialCode: string;
materialDesc: string;
storageAmount: string;
pdaSearch: string;
pageNum: number;
pageSize: number;
}
@Component({
@ -76,11 +66,10 @@ interface SapStockPo {
PageHead,
},
})
export default class sapStockPo extends BasePage implements SapStockPo {
export default class sapStockPo extends BasePage {
materialCode: string;
materialDesc: string;
storageAmount: string;
model = model;
queryParams: QueryParamsPo = {
matnr: undefined,
maktx: undefined,
@ -90,7 +79,32 @@ export default class sapStockPo extends BasePage implements SapStockPo {
};
sapStockList: any[] = [];
total = 0;
listHeight = 500;
onReady() {
//
this.$nextTick(() => {
let buttonTop = 0;
//
const query = uni.createSelectorQuery().in(this);
query
.select('#button')
.boundingClientRect((data) => {
//
buttonTop = data.top;
})
.exec();
//
query
.select('#list')
.boundingClientRect((data) => {
//
const listTop = data.top;
//
this.listHeight = buttonTop - listTop - 10;
})
.exec();
});
}
async search() {
this.queryParams.pageNum = 1;
this.getList();
@ -106,10 +120,11 @@ export default class sapStockPo extends BasePage implements SapStockPo {
this.getList();
}
async getList() {
await this.model.getSapStockList(this.queryParams);
this.sapStockList = this.model.rows;
this.total = this.model.total;
getList() {
getSapStockList(this.queryParams).then((res) => {
this.sapStockList = res.rows;
this.total = res.total;
});
}
removeLastZeros(data: any) {
@ -118,6 +133,16 @@ export default class sapStockPo extends BasePage implements SapStockPo {
}
return data;
}
//
onScrollToLower() {
if (this.total === this.sapStockList.length) {
return;
}
this.queryParams.pageNum = this.queryParams.pageNum + 1;
getSapStockList(this.queryParams).then((res) => {
this.sapStockList = this.sapStockList.concat(res.rows);
});
}
}
</script>
@ -134,16 +159,26 @@ export default class sapStockPo extends BasePage implements SapStockPo {
}
}
.scroll {
height: 100%;
overflow: scroll;
.list {
background-color: #fff;
margin-top: 20rpx;
padding: 20rpx 20rpx 25rpx;
border-radius: 10rpx;
box-shadow: 0 0 20rpx 0 rgba(128, 128, 128, 0.2);
color: #8d8989;
.form2 {
background-color: #fff;
padding: 20rpx 20rpx 25rpx;
border-radius: 10rpx;
box-shadow: 0 0 20rpx 0 rgba(128, 128, 128, 0.2);
color: #8d8989;
.list-item {
padding: 20rpx;
}
/* 奇数行背景色 */
.list-item:nth-child(odd) {
background-color: #ffffff;
}
/* 偶数行背景色 */
.list-item:nth-child(even) {
background-color: #f5f5f5;
}
}

@ -1,33 +1,8 @@
import { getModule, Module, MutationAction, VuexModule } from 'vuex-module-decorators';
import store from '@/store';
import http from '@/utils/request';
import { url } from '@/utils/url';
@Module({
namespaced: true,
dynamic: true,
store,
name: 'page.raw.sapStockPo',
})
export class sapStockPo extends VuexModule {
WlList = [];
rows: any = [];
total = 0;
@MutationAction
async getSapStockList(data: any): Promise<{ rows: any; total: number }> {
const result: any = await http.get(url.lanjuwms.raw.SapStockPo.getSapStockList, {
params: data,
});
let rows: any;
let total: number;
if (result.total > 0) {
rows = result.rows;
total = result.total;
} else {
rows = [];
total = 0;
}
return { rows, total };
}
}
export default getModule(sapStockPo);
export function getSapStockList(data: any): Promise<any> {
return http.get(url.lanjuwms.raw.SapStockPo.getSapStockList, {
params: data,
});
}

Loading…
Cancel
Save