You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
256 lines
8.4 KiB
256 lines
8.4 KiB
<template> |
|
<div class="container_box"> |
|
<el-form :inline="true" :model="queryForm" class="demo-form-inline" size="small"> |
|
<el-form-item label="运单编号"> |
|
<el-input v-model="queryForm.courierNumber" placeholder="运单编号" clearable></el-input> |
|
</el-form-item> |
|
<el-form-item label="派件时间"> |
|
<el-date-picker @change="changeSearchDate" v-model="queryForm.dateRange" type="daterange" range-separator="至" |
|
start-placeholder="开始日期" end-placeholder="结束日期"> |
|
</el-date-picker> |
|
</el-form-item> |
|
<el-form-item label="快递类型"> |
|
<el-select v-model="queryForm.expressType" placeholder="快递类型"> |
|
<el-option label="全部" value=""></el-option> |
|
<el-option :key="value" v-for="(key, value) in expressTypeList" :label="value" :value="value"></el-option> |
|
</el-select> |
|
</el-form-item> |
|
<el-form-item> |
|
<el-button type="primary" @click="onSubmit">搜 索</el-button> |
|
</el-form-item> |
|
<el-form-item> |
|
<el-upload ref="upload" class="upload-demo" :on-change="UploadChange" action="http://192.168.1.38:8210/send" :show-file-list="false" |
|
:before-upload="handleBeforeUpload" :on-success="uploadSuccess" :on-error="uploadError" :limit="1"> |
|
<el-button size="small" v-loading.fullscreen.lock="importLoading">导 入</el-button> |
|
</el-upload> |
|
</el-form-item> |
|
</el-form> |
|
<el-table :data="expressData" size="small" border style="width: 100%" v-loading="loading"> |
|
<!-- <el-table-column prop="orderTime" label="下单时间" width="180"> |
|
<template slot-scope="scope"> |
|
{{ dateFormatter(scope.row.orderTime) }} |
|
</template> |
|
</el-table-column> --> |
|
<el-table-column prop="courierNumber" label="运单编号"> |
|
<template slot-scope="scope"> |
|
<el-button @click="queryExpressDetail(scope.row)" type="text">{{ scope.row.courierNumber }}</el-button> |
|
</template> |
|
</el-table-column> |
|
<el-table-column prop="expressType" label="快递类型"> |
|
</el-table-column> |
|
<el-table-column prop="deliveryTime" label="派件时间"> |
|
<template slot-scope="scope"> |
|
{{ dateFormatter(scope.row.deliveryTime) }} |
|
</template> |
|
</el-table-column> |
|
<el-table-column prop="receiptStatus" label="签收标识"> |
|
</el-table-column> |
|
<el-table-column prop="expressPlace" label="签收网点"> |
|
</el-table-column> |
|
<el-table-column prop="endTime" label="签收时间"> |
|
<template slot-scope="scope"> |
|
{{ scope.row.endTime ? dateFormatter(scope.row.endTime) : "" }} |
|
</template> |
|
</el-table-column> |
|
<el-table-column prop="placeOfOrigin" label="发件地"> |
|
</el-table-column> |
|
<el-table-column prop="destination" label="收件地"> |
|
</el-table-column> |
|
<!-- <el-table-column prop="addressee" label="收件人"> |
|
</el-table-column> |
|
<el-table-column prop="cellphoneNumber" label="收件人手机号"> |
|
</el-table-column> --> |
|
</el-table> |
|
<div style="margin-top:20px;"> |
|
<el-pagination background :page-sizes="[10, 20, 50]" @size-change="handleSizeChange" |
|
@current-change="handleCurrentChange" :current-page="pagination.page" |
|
layout="total, sizes,prev, pager, next, jumper" :total="total"> |
|
</el-pagination> |
|
</div> |
|
<!-- 快递100物流跟踪记录 --> |
|
<el-dialog title="物流进度" :visible.sync="dialogVisible" :close-on-click-moda="false"> |
|
<div style="height:400px;overflow-y:auto;font-size:12px;line-height:18px;text-align:left;"> |
|
<div style="display:flex;margin-bottom:10px;" v-for="(item, index) in expressRecord" :key="'record' + index"> |
|
<div style="width:120px;">{{ item.ftime }}</div> |
|
<div style="flex:1;">{{ item.context }}</div> |
|
</div> |
|
</div> |
|
<div slot="footer" class="dialog-footer" style="text-align:center;"> |
|
<el-button size="small" @click="dialogVisible = false">关 闭</el-button> |
|
</div> |
|
</el-dialog> |
|
</div> |
|
</template> |
|
|
|
<script> |
|
import { queryExpressList, queryExpressDetail } from "@/api/sjApi"; |
|
import { dateFormat } from "@/util/date"; |
|
import md5 from "js-md5"; |
|
export default { |
|
data() { |
|
return { |
|
queryForm: { |
|
courierNumber: '', |
|
expressType: '', |
|
dateRange: '', |
|
}, |
|
pagination: { |
|
page: 1, |
|
size: 10 |
|
}, |
|
total: 0, |
|
expressData: [],//快递列表 |
|
expressTypeList: { |
|
'圆通速递': 'yuantong', |
|
'韵达快递': 'yunda', |
|
'中通快递': 'zhongtong', |
|
'申通快递': 'shentong', |
|
'极兔速递': 'jtexpress', |
|
'邮政快递包裹': 'youzhengguonei', |
|
'顺丰速运': 'shunfeng', |
|
'EMS': 'ems', |
|
'京东物流': 'jd', |
|
},//快递类型 |
|
dialogVisible: false, |
|
expressRecord: [], //快递跟踪记录 |
|
loading: false, |
|
importLoading: false,//导入loading |
|
}; |
|
}, |
|
mounted() { |
|
this.queryList(); |
|
}, |
|
methods: { |
|
//日期范围 |
|
changeSearchDate(date) { |
|
if (date == null) { |
|
this.queryForm.dateRange = ''; |
|
} |
|
}, |
|
//快递列表 |
|
queryList() { |
|
let param = JSON.parse(JSON.stringify(this.queryForm)); |
|
if (this.queryForm.dateRange) { |
|
param.startTime = dateFormat(new Date(this.queryForm.dateRange[0]), 'yyyy-MM-dd hh:mm:ss'); |
|
param.endTime = dateFormat(new Date(this.queryForm.dateRange[1]), 'yyyy-MM-dd') + ' 23:59:59'; |
|
} |
|
param.page = this.pagination.page; |
|
param.size = this.pagination.size; |
|
let _param = {}; |
|
Object.keys(param).map(item => { |
|
if (param[item] && item) { |
|
_param[item] = param[item]; |
|
} |
|
}) |
|
this.loading = true; |
|
try { |
|
queryExpressList(_param).then(res => { |
|
this.loading = false; |
|
if (res.code == 200) { |
|
this.total = res.total; |
|
this.expressData = res.data; |
|
} |
|
}, err => { |
|
this.loading = false; |
|
}) |
|
} catch (error) { |
|
this.loading = false; |
|
} |
|
}, |
|
//分页 |
|
handleSizeChange(val) { |
|
//改变size 重新查询 |
|
this.pagination.size = val; |
|
this.pagination.page = 1; |
|
this.queryList(); |
|
}, |
|
handleCurrentChange(val) { |
|
this.pagination.page = val; |
|
this.queryList(); |
|
}, |
|
//搜索查询 |
|
onSubmit() { |
|
this.pagination.page = 1; |
|
this.queryList(); |
|
}, |
|
//excel导入 |
|
handleBeforeUpload(file) { |
|
const isLt10M = file.size / 1024 / 1024 < 10; |
|
if (!isLt10M) { |
|
this.$message.error('导入文件不能超过 10MB!'); |
|
} else { |
|
this.importLoading = true; |
|
} |
|
return isLt10M; |
|
}, |
|
UploadChange(file, fileList) { |
|
setTimeout(() => { |
|
this.importLoading = false; |
|
this.$refs.upload.clearFiles(); |
|
this.$refs.upload.abort(); |
|
}, 1000 * 60 * 1);//三分钟之后关闭加载 |
|
}, |
|
uploadSuccess(response, file, fileList) { |
|
this.importLoading = false; |
|
if (response.code == 200) { |
|
this.$message.success('导入成功'); |
|
this.$refs.upload.clearFiles(); |
|
this.pagination.page = 1; |
|
this.queryList(); |
|
} |
|
}, |
|
uploadError(err, file, fileList) { |
|
this.importLoading = false; |
|
console.log('导入失败', err) |
|
}, |
|
//快递100 |
|
queryExpressDetail(row) { |
|
let param = { |
|
customer: "15A684C85BB850280B92FC3F5FBD4585", |
|
sign: "", |
|
param: JSON.stringify({ |
|
"com": this.expressTypeList[row.expressType], |
|
"num": row.courierNumber, |
|
"phone": row.cellphoneNumber, |
|
"from": "", |
|
"to": "", |
|
"resultv2": "4", |
|
"show": "0", |
|
"order": "desc" |
|
}) |
|
} |
|
param.sign = md5(param.param + 'vERvNXiK9181' + param.customer).toUpperCase(); |
|
queryExpressDetail(param).then(res => { |
|
this.expressRecord = res.data; |
|
this.dialogVisible = true; |
|
}) |
|
}, |
|
//日期格式化 |
|
dateFormatter(date) { |
|
return dateFormat(new Date(date), 'yyyy/MM/dd hh:mm:ss') |
|
} |
|
}, |
|
}; |
|
</script> |
|
|
|
<style lang="scss" scoped> |
|
.container_box { |
|
font-size: 12px; |
|
height: 100%; |
|
background: #fff; |
|
padding: 20px; |
|
|
|
.demo-form-inline { |
|
text-align: left; |
|
|
|
.el-form-item { |
|
margin-bottom: 20px !important; |
|
} |
|
} |
|
|
|
::v-deep .el-form-item__label { |
|
float: left; |
|
font-size: 12px; |
|
} |
|
} |
|
</style>
|
|
|