init commit
This commit is contained in:
@ -0,0 +1,462 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<div class="main">
|
||||
<div class="query" ref="query">
|
||||
<el-form :model="queryParams" ref="queryParams" :inline="true" label-width="100px">
|
||||
<el-form-item>
|
||||
<el-input
|
||||
v-model="queryParams.materialBar"
|
||||
placeholder="最小包装条码"
|
||||
clearable
|
||||
size="small"
|
||||
style="width: 230px"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input
|
||||
v-model="queryParams.boxBar"
|
||||
placeholder="箱条码"
|
||||
clearable
|
||||
size="small"
|
||||
style="width: 230px;"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input
|
||||
v-model="queryParams.materialCode"
|
||||
placeholder="物料编码"
|
||||
clearable
|
||||
size="small"
|
||||
style="width: 230px;"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input
|
||||
v-model="queryParams.materialName"
|
||||
placeholder="物料名称"
|
||||
clearable
|
||||
size="small"
|
||||
style="width: 230px;"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="Query">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
<el-button
|
||||
type="primary"
|
||||
:icon="showMore==true?'el-icon-arrow-up':'el-icon-arrow-down'"
|
||||
size="mini"
|
||||
@click="showMoreChange"
|
||||
></el-button>
|
||||
</el-form-item>
|
||||
|
||||
|
||||
<div v-show="showMore">
|
||||
<el-form-item>
|
||||
<el-input
|
||||
v-model="queryParams.billNumber"
|
||||
placeholder="单据编号"
|
||||
clearable
|
||||
size="small"
|
||||
style="width: 230px"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
|
||||
<el-date-picker
|
||||
v-model="queryParams.createdDt"
|
||||
type="datetime"
|
||||
size="small"
|
||||
format="yyyy-MM-dd HH:mm:ss"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
style="width: 230px"
|
||||
placeholder="创建时间开始">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-date-picker
|
||||
v-model="queryParams.createdDt2"
|
||||
type="datetime"
|
||||
size="small"
|
||||
format="yyyy-MM-dd HH:mm:ss"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
style="width: 230px"
|
||||
placeholder="创建时间结束">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select style="width: 230px" collapse-tags v-model="queryParams.warehouseCode" :multiple="true"
|
||||
placeholder="库区">
|
||||
<el-option
|
||||
v-for="item in warehouseOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<div>
|
||||
<el-form-item>
|
||||
<el-select style="width: 230px" collapse-tags v-model="queryParams.locationCode" :multiple="true"
|
||||
placeholder="库位">
|
||||
<el-option
|
||||
v-for="item in locationOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input
|
||||
v-model="queryParams.supplierName"
|
||||
placeholder="供应商名称"
|
||||
clearable
|
||||
size="small"
|
||||
style="width: 230px"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input
|
||||
v-model="queryParams.batchNumber"
|
||||
placeholder="批次"
|
||||
clearable
|
||||
size="small"
|
||||
style="width: 230px"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select style="width: 230px" collapse-tags v-model="queryParams.dictFreeze"
|
||||
placeholder="冻结状态">
|
||||
<el-option
|
||||
v-for="item in this.$dictType.getFreezeTypeArray()"
|
||||
:key="item.key"
|
||||
:label="item.text"
|
||||
:value="item.key">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</div>
|
||||
<div>
|
||||
<el-form-item>
|
||||
<el-select style="width: 230px" collapse-tags v-model="queryParams.isFil"
|
||||
placeholder="是否筛选">
|
||||
<el-option
|
||||
v-for="item in filOption"
|
||||
:key="item.key"
|
||||
:label="item.text"
|
||||
:value="item.key">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
<el-divider></el-divider>
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-popover
|
||||
style="float: right"
|
||||
placement="bottom-end"
|
||||
title="自定义显示列"
|
||||
width="250"
|
||||
@show="initPopover"
|
||||
trigger="hover">
|
||||
<headConfig ref="test" @fathers="fathers" :propThis="propThis"></headConfig>
|
||||
<el-button size="mini" type="primary" class="el-icon-caret-bottom" slot="reference">自定义列</el-button>
|
||||
</el-popover>
|
||||
</el-row>
|
||||
<el-table
|
||||
@header-dragend="headerDragend"
|
||||
v-loading="loading"
|
||||
highlight-current-row
|
||||
@current-change="handleCurrentChange"
|
||||
:data="tableData"
|
||||
border
|
||||
:row-class-name="tableRowClassName"
|
||||
v-if="indexShow"
|
||||
:height="tableHeight"
|
||||
class="tableStyle"
|
||||
style="width: 100%">
|
||||
<el-table-column
|
||||
type="index"
|
||||
align="center"
|
||||
label="序号"
|
||||
width="50">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
v-for="(item, index) in realList"
|
||||
:prop="item.tableProp"
|
||||
:key="index"
|
||||
:align="item.align"
|
||||
header-align="center"
|
||||
:min-width="item.width"
|
||||
:label="item.tableTitle"
|
||||
:show-overflow-tooltip="item.show_overflow_tooltip"
|
||||
>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-pagination
|
||||
style="margin-top: 10px"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange2"
|
||||
:current-page="currentPage"
|
||||
:page-sizes="[10, 20, 50, 100,200,500,1000]"
|
||||
:page-size="pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="total">
|
||||
</el-pagination>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'MaterialExpireTime',
|
||||
data() {
|
||||
return{
|
||||
pageQty:0,
|
||||
pageQtySummer:0,
|
||||
indexShow:false,
|
||||
showMore:false,
|
||||
currentRow:null,
|
||||
List:[],
|
||||
warehouseOptions:[],
|
||||
locationOptions:[],
|
||||
realList:[],
|
||||
isAdd:null,
|
||||
total:null,
|
||||
pageSize:50,
|
||||
buttonEnable:true,
|
||||
tableHeight:0,
|
||||
currentPage:1,
|
||||
propThis:this,
|
||||
tableData:[],
|
||||
filOption:[{key:'Y',text:'是'},{key:'N',text:'否'}],
|
||||
queryParams:{
|
||||
|
||||
},
|
||||
loading:false,
|
||||
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.tableHeight = window.innerHeight - this.$refs.query.offsetHeight - 250
|
||||
})
|
||||
this.getList()
|
||||
const params={
|
||||
tableName:'list'
|
||||
}
|
||||
this.$headerConfig.getRealList(params).then(data=>{
|
||||
console.log("开始输出真正表格")
|
||||
if(data.data.data!==null){
|
||||
let temp = JSON.parse(data.data.data)
|
||||
this.realList = temp.headerList
|
||||
this.List = temp.List
|
||||
}else {
|
||||
this.List = this.$headerConfig.getList("list")
|
||||
this.realList = this.List
|
||||
let temp ={
|
||||
headerList:this.realList,
|
||||
List:this.List
|
||||
}
|
||||
const params={
|
||||
tableName:"list",
|
||||
configure:JSON.stringify(temp)
|
||||
}
|
||||
this.$headerConfig.updateRealList(params).then(value=>{
|
||||
console.log(value)
|
||||
})
|
||||
}
|
||||
this.indexShow = true
|
||||
})
|
||||
},
|
||||
methods:{
|
||||
headerDragend(newWidth, oldWidth, column, event){
|
||||
// realList
|
||||
this.realList.forEach(value => {
|
||||
if (column.property == value.tableProp) {
|
||||
value.width=newWidth
|
||||
}
|
||||
})
|
||||
this.$refs.test.init();
|
||||
setTimeout( ()=>{
|
||||
this.$refs.test.show();
|
||||
}, 1000);
|
||||
},
|
||||
tableRowClassName({row, rowIndex}) {
|
||||
if(row.bzyxqType===2){
|
||||
return 'alert'
|
||||
}
|
||||
if(row.bzyxqType===1){
|
||||
return 'warn'
|
||||
}
|
||||
if(row.bzyxqType===0){
|
||||
return 'normal'
|
||||
}
|
||||
},
|
||||
|
||||
showMoreChange() {
|
||||
if (!this.showMore) {
|
||||
this.tableHeight = this.tableHeight - 70
|
||||
} else {
|
||||
this.tableHeight = this.tableHeight + 70
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
this.showMore = !this.showMore
|
||||
})
|
||||
},
|
||||
|
||||
getList() {
|
||||
this.loading = true
|
||||
const params = {
|
||||
pageSize:this.pageSize,
|
||||
pageNo:this.currentPage,
|
||||
boxBar:this.queryParams.boxBar,
|
||||
dictBilltype:this.queryParams.dictBilltype,
|
||||
dictStatus:this.queryParams.dictStatus,
|
||||
locationCodes:this.queryParams.locationCode,
|
||||
materialBar:this.queryParams.materialBar,
|
||||
materialCode:this.queryParams.materialCode,
|
||||
materialName:this.queryParams.materialName,
|
||||
srcBillNumber:this.queryParams.srcBillNumber,
|
||||
supplierName:this.queryParams.supplierName,
|
||||
batchNumber:this.queryParams.batchNumber,
|
||||
warehouseCodes:this.queryParams.warehouseCode,
|
||||
createdDt:this.queryParams.createdDt,
|
||||
createdDt2:this.queryParams.createdDt2,
|
||||
dictFreeze:this.queryParams.dictFreeze,
|
||||
isFil:this.queryParams.isFil,
|
||||
}
|
||||
this.$stock.getListExpireTime(params).then(data=>{
|
||||
this.tableData = data.data.data.data
|
||||
this.tableData.forEach(value=>{
|
||||
value.dictBillTypeShow = this.$dictType.getInputBillType(value.dictBilltype)
|
||||
value.dictFreezeShow = this.$dictType.getFreezeType(value.dictFreeze)
|
||||
if(value.isFil==='Y'){
|
||||
value.filShow = '是'
|
||||
}else {
|
||||
value.filShow = '否'
|
||||
}
|
||||
|
||||
console.log(parseInt(value.bzyxq)<30)
|
||||
|
||||
if(parseInt(value.bzyxq)<30){
|
||||
value.bzyxqType = 2
|
||||
}else if(parseInt(value.bzyxq)<90){
|
||||
value.bzyxqType = 1
|
||||
}else{
|
||||
value.bzyxqType = 0
|
||||
}
|
||||
|
||||
|
||||
value.bzyxq =value.bzyxq+'天'
|
||||
})
|
||||
|
||||
this.total = data.data.data.recordsTotal
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
initPopover() {
|
||||
const params={
|
||||
tableName:'list'
|
||||
}
|
||||
this.$headerConfig.getRealList(params).then(data=>{
|
||||
console.log("开始输出真正表格")
|
||||
let temp = JSON.parse(data.data.data)
|
||||
console.log(temp)
|
||||
this.realList =temp.headerList
|
||||
console.log(this.realList)
|
||||
this.$refs.test.init()
|
||||
})
|
||||
|
||||
},
|
||||
fathers(data) {
|
||||
|
||||
this.List = data.configure.List
|
||||
data.configure.List.forEach(value=>{
|
||||
this.realList.forEach(real=>{
|
||||
if (value.tableProp == real.tableProp) {
|
||||
value.width=real.width;
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
data.configure.headerList.forEach(value=>{
|
||||
this.realList.forEach(real=>{
|
||||
if (value.tableProp == real.tableProp) {
|
||||
value.width=real.width;
|
||||
}
|
||||
})
|
||||
})
|
||||
if (data.configure.headerList.length <= 0) {
|
||||
return;
|
||||
}
|
||||
const params={
|
||||
tableName:"list",
|
||||
configure:JSON.stringify(data.configure)
|
||||
}
|
||||
|
||||
this.realList = data.configure.headerList;
|
||||
|
||||
this.$headerConfig.updateRealList(params).then(value=>{
|
||||
console.log(value)
|
||||
})
|
||||
},
|
||||
handleCurrentChange2(val) {
|
||||
// this.currentRow = val;
|
||||
console.log(val)
|
||||
this.currentPage = val;
|
||||
this.getList()
|
||||
},
|
||||
handleSizeChange(val){
|
||||
this.pageSize = val;
|
||||
this.getList();
|
||||
},
|
||||
handleCurrentChange(val){
|
||||
this.buttonEnable = false
|
||||
this.currentRow = val;
|
||||
},
|
||||
Query() {
|
||||
this.currentPage = 1
|
||||
this.getList()
|
||||
},
|
||||
resetQuery() {
|
||||
this.queryParams = {}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
>>> .el-link.el-link--default {
|
||||
color: white;
|
||||
}
|
||||
|
||||
>>> .el-form-item {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.el-divider {
|
||||
margin-top: 0px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
>>>.el-table .warn {
|
||||
background: #ffc556;
|
||||
}
|
||||
|
||||
>>>.el-table .normal {
|
||||
background: #11bc4a;
|
||||
}
|
||||
|
||||
>>>.el-table .alert {
|
||||
background: #ff5d58;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user