9 changed files with 846 additions and 122 deletions
@ -0,0 +1,245 @@ |
|||
<template> |
|||
<div class="isPadForTransferLibJobPage padListPage"> |
|||
<!-- 搜索头部 --> |
|||
<div class="padListHeader"> |
|||
<div class="leftSearchHeader"> |
|||
<el-form :inline="true" :model="searchFormData" :size="'mini'"> |
|||
<el-form-item |
|||
v-for="(item,index) in searchForm" |
|||
:key="index" |
|||
:label="item.label" |
|||
> |
|||
<!-- input --> |
|||
<el-input |
|||
v-if="item.type == 'input'" |
|||
v-model="searchFormData[item.prop]" |
|||
:placeholder="item.label" |
|||
clearable |
|||
></el-input> |
|||
<!-- select --> |
|||
<el-select |
|||
v-if="item.type == 'select'" |
|||
v-model="searchFormData[item.prop]" |
|||
:placeholder="item.label" |
|||
> |
|||
<el-option |
|||
v-for="(opItem,opIndex) in item.options" |
|||
:key="opIndex" |
|||
:label="opItem.label" |
|||
:value="opItem.value" |
|||
></el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item> |
|||
<el-button type="primary" @click="searchHandle">查询</el-button> |
|||
<el-button |
|||
v-for="(btnItem,btnIndex) in headerButton" |
|||
:key="btnIndex" |
|||
:type="btnItem.type" |
|||
@click="headerButtonClick(btnItem,btnIndex)" |
|||
>{{ btnItem.label }}</el-button> |
|||
</el-form-item> |
|||
</el-form> |
|||
</div> |
|||
<el-button circle icon="el-icon-upload2" type="primary" class="pageToTop" @click="pageToTopHandle"></el-button> |
|||
</div> |
|||
<!-- 列表 --> |
|||
<div class="padListCard" v-show="padListPager.totalCount" id="padListCard"> |
|||
<div |
|||
class="padListRow" |
|||
v-for="(item,index) in padListData" |
|||
:key="index" |
|||
> |
|||
<!-- 主表 --> |
|||
<div class="mainDataBox"> |
|||
<curren-descriptions |
|||
:column="5" |
|||
:tabsDesTions="padMainColumn" |
|||
:propsData="item" |
|||
:labelStyle="{'margin-right':'5px'}" |
|||
></curren-descriptions> |
|||
</div> |
|||
<!-- 子表 todo：封装时候确定是否为子表直接显示数据--> |
|||
<div class="detailDataBox"> |
|||
<curren-descriptions |
|||
:column="4" |
|||
:tabsDesTions="padDeatilColumn" |
|||
:propsData="item.details[0]" |
|||
:labelStyle="{'margin-right':'5px'}" |
|||
></curren-descriptions> |
|||
</div> |
|||
<!-- 按钮 --> |
|||
<div class="listRowButtonBox"> |
|||
<el-button |
|||
v-for="(btnItem,btnIndex) in listRowButton" |
|||
:key="btnIndex" |
|||
:type="btnItem.type" |
|||
@click="headerButtonClick(btnItem,btnIndex)" |
|||
:size="'mini'" |
|||
>{{ btnItem.label }}</el-button> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<!-- 无数据 --> |
|||
<el-empty v-show="!padListPager.totalCount || padListPager.totalCount<=0" description="暂无数据"></el-empty> |
|||
<!-- 页脚 --> |
|||
<div class="padListPager" v-if="padListPager.totalCount"> |
|||
<div v-loading="padListLoading" element-loading-text="拼命加载中">{{padListPager.currentPage}}/{{padListPager.totalPage}}</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { getPageList } from "@/api/wms-api"; |
|||
import currenDescriptions from "@/components/currenDescriptions" |
|||
export default { |
|||
name: 'padListPage_jt', |
|||
components: { currenDescriptions }, |
|||
data () { |
|||
return { |
|||
searchFormData:{ |
|||
number:"" |
|||
}, |
|||
searchForm:[ |
|||
{label:'任务单号',prop:'number',type:'input'}, |
|||
], |
|||
headerButton:[ |
|||
{ |
|||
type: 'warning', |
|||
label: '查看待执行数据', |
|||
name: "showCanHandle", |
|||
}, |
|||
{ |
|||
type: 'success', |
|||
label: '查看所有数据', |
|||
name: "showAllData", |
|||
}, |
|||
], |
|||
padListLoading:false, |
|||
padListData:[], |
|||
padMainColumn:[ |
|||
{label:'任务单号',prop:'number'}, |
|||
{label:'申请单号',prop:'requestNumber'}, |
|||
{ label: "状态", prop: "jobStatus",type: "filter", filters: "jobStatus" }, |
|||
{ label: "创建时间", prop: 'creationTime', type: "dateTime" }, |
|||
], |
|||
padDeatilColumn:[ |
|||
{label:'物品代码',prop:'itemCode'}, |
|||
{label:'物品名称',prop:'itemName'}, |
|||
{label:'物料描述1',prop:'itemDesc1'}, |
|||
{label:'物料描述2',prop:'itemDesc2'}, |
|||
{label:'数量',prop:'recommendToQty'}, |
|||
], |
|||
listRowButton:[ |
|||
{ |
|||
type: 'primary', |
|||
label: '查看余额', |
|||
name: "showCanHandle", |
|||
}, |
|||
{ |
|||
type: 'success', |
|||
label: '完成库移', |
|||
name: "showAllData", |
|||
}, |
|||
], |
|||
padListPager:{ |
|||
totalCount:null,//总条数 |
|||
pageSize:10,//当前页显示条数 |
|||
currentPage:0,//当前页 |
|||
totalPage:null,//总页 |
|||
}, |
|||
searchFilters:[] |
|||
} |
|||
}, |
|||
mounted(){ |
|||
this.getPadList() |
|||
let _this = this |
|||
document.getElementById("padListCard").addEventListener('scroll', function() { |
|||
_this.handleScroll() |
|||
}); |
|||
}, |
|||
methods: { |
|||
pageToTopHandle(){ |
|||
document.getElementById("padListCard").scrollTop = 0 |
|||
}, |
|||
handleScroll(){ |
|||
let windowHeight = document.getElementById("padListCard").clientHeight; |
|||
let scrollHeight = document.getElementById("padListCard").scrollHeight; |
|||
let scrollTop = document.getElementById("padListCard").scrollTop; |
|||
if (scrollTop + windowHeight >= scrollHeight - 30) { |
|||
let page = Number(JSON.stringify(this.padListPager.currentPage + 1)) |
|||
if(Number(page) > Number(this.padListPager.totalPage))return |
|||
console.log('翻页') |
|||
this.getPadList(page); |
|||
} |
|||
}, |
|||
intSearchFilters(){ |
|||
let _filters = [] |
|||
this.searchForm.forEach(item => { |
|||
if(this.searchFormData[item.prop]){ |
|||
_filters.push( |
|||
{ |
|||
logic: 'And', |
|||
column: item.prop, |
|||
action: item.action || "==", |
|||
value: this.searchFormData[item.prop] |
|||
} |
|||
) |
|||
} |
|||
}); |
|||
return _filters |
|||
}, |
|||
getPadList(page=1){ |
|||
if(this.padListLoading)return |
|||
console.log('请求页数',page) |
|||
if(page != 1 && (Number(page) > Number(this.padListPager.totalPage)))return |
|||
if(page == 1){this.padListData = []} |
|||
let params = { |
|||
sorting: null, |
|||
maxResultCount: this.padListPager.pageSize, |
|||
skipCount: this.padListPager.pageSize * (Number(page) - 1), |
|||
condition: { |
|||
filters: this.intSearchFilters() |
|||
} |
|||
} |
|||
this.padListLoading = true |
|||
getPageList(params,'wms/store/transfer-lib-job',true).then(res => { |
|||
this.padListData = [ |
|||
...this.padListData, |
|||
...res.items, |
|||
]; |
|||
this.padListPager.totalCount = res.totalCount |
|||
this.padListPager.totalPage = Math.ceil(res.totalCount / this.padListPager.pageSize) |
|||
this.padListLoading = false |
|||
this.padListPager.currentPage = page |
|||
}).catch(err => { |
|||
this.padListLoading = false |
|||
console.log(err) |
|||
}) |
|||
}, |
|||
// 查询按钮操作 |
|||
searchHandle(){ |
|||
this.getPadList() |
|||
}, |
|||
// 其他按钮点击事件 |
|||
headerButtonClick(item,index){ |
|||
if(val.name == 'showCanHandle'){ |
|||
this.PageListParams.condition.filters.push({ |
|||
logic:"And", |
|||
column:"jobStatus", |
|||
action:"In", |
|||
value: JSON.stringify([1,2,4,30]) |
|||
}) |
|||
this.paging(); |
|||
} |
|||
else if(val.name == 'showAllData'){ |
|||
this.PageListParams.condition.filters = this.PageListParams.condition.filters.filter(obj => obj.column != 'jobStatus'); |
|||
this.paging(); |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style lang="scss" scoped> |
|||
@import "@/styles/padMain.scss"; |
|||
</style> |
|||
Loading…
Reference in new issue