|
|
<template>
|
|
|
<section>
|
|
|
<!--工具条-->
|
|
|
<el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
|
|
|
<el-form :inline="true" :model="filters">
|
|
|
<el-form-item>
|
|
|
<el-input v-model="filters.billno" placeholder="主单号"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
<el-input v-model="filters.flightNo" placeholder="航班号"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
<el-date-picker
|
|
|
v-model="filters.flightDate"
|
|
|
type="date"
|
|
|
value-format="yyyy-MM-dd"
|
|
|
placeholder="选择航班日期">
|
|
|
</el-date-picker>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
<el-button type="primary" v-on:click="getList()">查询</el-button>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
<el-button type="primary" @click="handleAdd()">新增</el-button>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
</el-col>
|
|
|
|
|
|
<el-table :data="expressDate"
|
|
|
style="width: 100%"
|
|
|
row-key="id"
|
|
|
border
|
|
|
v-loading="listLoading"
|
|
|
lazy
|
|
|
:load="load"
|
|
|
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
|
|
|
@selection-change="handleSelectionChange">
|
|
|
<el-table-column type="selection" width="55">
|
|
|
</el-table-column>
|
|
|
<el-table-column prop="date" label="日期" width="180">
|
|
|
</el-table-column>
|
|
|
<el-table-column prop="name" label="姓名" width="180">
|
|
|
</el-table-column>
|
|
|
<el-table-column prop="address" label="地址">
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
<el-col :span="24" class="toolbar">
|
|
|
<el-pagination
|
|
|
@size-change="handleSizeChange"
|
|
|
@current-change="handleCurrentChange"
|
|
|
background
|
|
|
:current-page="currentPage4"
|
|
|
:page-sizes="[100, 200, 300, 400]"
|
|
|
:page-size="100"
|
|
|
layout="total, sizes, prev, pager, next, jumper"
|
|
|
:total="400">
|
|
|
</el-pagination>
|
|
|
</el-col>
|
|
|
</section>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import {getExpressList} from '../../api/express/express'
|
|
|
import {getList} from "../../api/security/security";
|
|
|
export default {
|
|
|
name: "express",
|
|
|
data() {
|
|
|
return {
|
|
|
expressDate: [{
|
|
|
id: 1,
|
|
|
date: '2016-05-02',
|
|
|
name: '王小虎',
|
|
|
address: '上海市普陀区金沙江路 1518 弄'
|
|
|
}, {
|
|
|
id: 2,
|
|
|
date: '2016-05-04',
|
|
|
name: '王小虎',
|
|
|
address: '上海市普陀区金沙江路 1517 弄'
|
|
|
}, {
|
|
|
id: 3,
|
|
|
date: '2016-05-01',
|
|
|
name: '王小虎',
|
|
|
address: '上海市普陀区金沙江路 1519 弄',
|
|
|
hasChildren: true
|
|
|
}, {
|
|
|
id: 4,
|
|
|
date: '2016-05-03',
|
|
|
name: '王小虎',
|
|
|
address: '上海市普陀区金沙江路 1516 弄'
|
|
|
}],
|
|
|
multipleSelection: [],
|
|
|
currentPage4: 1,
|
|
|
filters:{
|
|
|
billno: '',
|
|
|
flightNo: '',
|
|
|
flightDate: '',
|
|
|
},
|
|
|
pageNum: 0,
|
|
|
pageSize: 0,
|
|
|
total: 0,
|
|
|
listLoading: false,
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
|
|
|
getList(){
|
|
|
let para = {
|
|
|
pageNum: this.pageNum,
|
|
|
pageSize: this.pageSize,
|
|
|
billno: this.filters.billno,
|
|
|
flightNo: this.filters.flightNo,
|
|
|
flightDate: this.filters.flightDate,
|
|
|
|
|
|
}
|
|
|
this.listLoading = true;
|
|
|
getExpressList(para).then((res) => {
|
|
|
this.total = res.data.data.total;
|
|
|
this.expressDate = res.data.data.list;
|
|
|
this.listLoading = false;
|
|
|
}).catch((error) => {
|
|
|
this.listLoading = false;
|
|
|
});
|
|
|
},
|
|
|
|
|
|
// 分单懒加载
|
|
|
load(tree, treeNode, resolve) {
|
|
|
setTimeout(() => {
|
|
|
resolve([
|
|
|
{
|
|
|
id: 31,
|
|
|
date: '2016-05-01',
|
|
|
name: '王小虎',
|
|
|
address: '上海市普陀区金沙江路 1519 弄'
|
|
|
}, {
|
|
|
id: 32,
|
|
|
date: '2016-05-01',
|
|
|
name: '王小虎',
|
|
|
address: '上海市普陀区金沙江路 1519 弄'
|
|
|
}
|
|
|
])
|
|
|
}, 1000)
|
|
|
},
|
|
|
// 多选单选
|
|
|
handleSelectionChange(val) {
|
|
|
this.multipleSelection = val;
|
|
|
},
|
|
|
// 分页
|
|
|
handleSizeChange(val) {
|
|
|
console.log(`每页 ${val} 条`);
|
|
|
},
|
|
|
handleCurrentChange(val) {
|
|
|
console.log(`当前页: ${val}`);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style scoped>
|
|
|
|
|
|
</style> |
|
|
\ No newline at end of file |
...
|
...
|
|