5 changed files with 411 additions and 304 deletions
@ -1,26 +1,245 @@ |
|||||
<template> |
<template> |
||||
<div class="isPadForTransferLibJobPage"> |
<div class="isPadForTransferLibJobPage padListPage"> |
||||
|
<!-- 搜索头部 --> |
||||
<div class="padListHeader"> |
<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> |
||||
</div> |
</div> |
||||
</template> |
</template> |
||||
|
|
||||
<script> |
<script> |
||||
export default { |
import { getPageList } from "@/api/wms-api"; |
||||
name: 'isPadForTransferLibJob', |
import currenDescriptions from "@/components/currenDescriptions" |
||||
data () { |
export default { |
||||
return {} |
name: 'isPadForTransferLibJob', |
||||
|
components: { currenDescriptions }, |
||||
|
data () { |
||||
|
return { |
||||
|
searchFormData:{ |
||||
|
number:"" |
||||
}, |
}, |
||||
methods: {} |
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> |
</script> |
||||
<style lang="scss" scoped> |
<style lang="scss" scoped> |
||||
.isPadForTransferLibJobPage{ |
@import "@/styles/padMain.scss"; |
||||
background:#fff; |
|
||||
margin:15px; |
|
||||
height:calc(100% - 30px); |
|
||||
min-width:800px; |
|
||||
overflow:auto; |
|
||||
} |
|
||||
</style> |
</style> |
||||
Loading…
Reference in new issue