提交 b1493b4f authored 作者: 王天霸's avatar 王天霸

Merge branch 'dev_zwn' into test

......@@ -3,39 +3,59 @@ import request from '@/utils/request'
// 查询order列表
export function listOrder(query) {
return request({
url: '/system/order/list',
url: '/system/order/getOrderList',
method: 'get',
params: query
})
}
// 查询order详细
export function getOrder (id) {
export function orderInfo (query) {
return request({
url: '/system/order/getInfo?order_id='+id,
method: 'get'
url: '/system/order/getOrderInfo',
method: 'get',
params: query
})
}
// order发货
export function sendOrder(data) {
return request({
url: '/system/order/sendOrder',
url: '/system/order/sendOrde',
method: 'post',
data: data
})
}
//查看物流
export function getExpressInfo(data){
export function expressInfoNew(params){
return request({
url: '/system/order/getExpressInfoNew',
method: 'get',
params
})
}
// 修改订单收货信息
export function orderInfoEdit(data){
return request({
url: '/system/order/orderInfoEdit',
method: 'post',
data: data
})
}
//订单备注
export function remarkOrder(data){
return request({
url: '/system/order/getExpressInfo',
url: '/system/order/remarkOrder',
method: 'post',
data: data
})
}
// 获取 所有物流信息
export function getExpressList(query) {
export function expressList(query) {
return request({
url: '/system/order/expressList',
method: 'get',
......
<template>
<section class="app-main">
<section class="app-main loadingtext">
<transition name="fade-transform" mode="out-in">
<keep-alive :include="cachedViews">
<router-view :key="key" />
......
import axios from 'axios'
import {Notification, MessageBox, Message} from 'element-ui'
import {Notification, MessageBox, Message, Loading} from 'element-ui'
import store from '@/store'
import {getToken} from '@/utils/auth'
import errorCode from '@/utils/errorCode'
let loadingRequestCount = 0
let loadingInstance
const showLoading = () => {
if (loadingRequestCount === 0) {
loadingInstance = Loading.service({ target: '.loadingtext'})
}
loadingRequestCount++
}
const hideLoading = () => {
if (loadingRequestCount <= 0) return
loadingRequestCount--
if (loadingRequestCount === 0) {
loadingInstance.close()
}
}
axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
// 创建axios实例
const service = axios.create({
......@@ -14,6 +32,8 @@ const service = axios.create({
})
// request拦截器
service.interceptors.request.use(config => {
showLoading()
// 是否需要设置 token
const isToken = (config.headers || {}).isToken === false
if (getToken() && !isToken) {
......@@ -28,6 +48,10 @@ service.interceptors.request.use(config => {
// 响应拦截器
service.interceptors.response.use(res => {
setTimeout(() => {
hideLoading()
}, 200)
// 未设置状态码则默认成功状态
const code = res.data.code || 200;
// 返回所有数据的统一处理
......@@ -90,6 +114,10 @@ service.interceptors.response.use(res => {
return res.data
}
}, error => {
setTimeout(() => {
hideLoading()
}, 200)
// --- start ---- 开发时候用这段,把错误彻底抛出来 --- start ---
let {message} = error;
if (message == 'Network Error') {
......
<template>
<div class="orderDetail">
<el-card>
<el-steps :active="orderDetail ? orderDetail.status : 1" align-center>
<el-step title="买家下单付款"></el-step>
<el-step title="商家发货"></el-step>
<el-step title="订单完成"></el-step>
</el-steps>
</el-card>
<el-card style="margin-top: 20px;">
<div class="orderList">
<div class="orderItem">
<div class="orderTitle">
<img class="icon" src="@/assets/image/order/icon1.png" alt="">
<span>订单信息</span>
</div>
<div>
<el-row class="row-title">
<el-col :span="3" class="text-r">订单编号</el-col>
<el-col :span="6" class="text-l">{{orderDetail ? orderDetail.parent_order_sn : ''}}</el-col>
</el-row>
<el-row class="row-title">
<el-col :span="3" class="text-r">下单时间</el-col>
<el-col :span="6" class="text-l">{{orderDetail ? formatter(orderDetail.addtime) : ''}}</el-col>
</el-row>
<el-row class="row-title">
<el-col :span="3" class="text-r">商品数量</el-col>
<el-col :span="6" class="text-l">{{goodsNum}}</el-col>
</el-row>
<el-row class="row-title">
<el-col :span="3" class="text-r">商品总价</el-col>
<el-col :span="6" class="text-l">{{goodsPrice}}</el-col>
</el-row>
<el-row class="row-title">
<el-col :span="3" class="text-r">运费</el-col>
<el-col :span="6" class="text-l">{{goodsFreight}}</el-col>
</el-row>
</div>
</div>
<div class="orderItem">
<div class="orderTitle" style="justify-content: space-between; width: 75%;">
<div style="display: flex; align-items: center;">
<img class="icon" src="@/assets/image/order/icon2.png" alt="">
<span>买家信息</span>
</div>
<el-button size="mini" type="primary" @click="modifyinfo" :disabled="orderDetail && orderDetail.status > 2">修改收货信息</el-button>
</div>
<div>
<el-row class="row-title">
<el-col :span="3" class="text-r">收货人姓名</el-col>
<el-col :span="6" class="text-l">{{orderDetail ? orderDetail.shipping_name : ''}}</el-col>
<el-col :span="3" class="text-r">联系电话</el-col>
<el-col :span="6" class="text-l">{{orderDetail ? orderDetail.phone : ''}}</el-col>
</el-row>
<el-row class="row-title">
<el-col :span="3" class="text-r">收货地址</el-col>
<el-col :span="6" class="text-l">{{orderDetail ? orderDetail.province + orderDetail.city + orderDetail.county + orderDetail.town + orderDetail.address : ''}}</el-col>
<el-col :span="3" class="text-r"></el-col>
<el-col :span="6" class="text-l"></el-col>
</el-row>
</div>
</div>
<div class="orderItem">
<div class="orderTitle" style="justify-content: space-between;">
<div style="display: flex; align-items: center;">
<img class="icon" src="@/assets/image/order/icon3.png" alt="">
<span>商品信息</span>
</div>
<div>
<el-button size="mini" type="primary" @click="goShipping(1)">去发货</el-button>
<el-button size="mini" @click="goShipping(2)" :disabled="orderDetail && orderDetail.status > 2">补单发货</el-button>
</div>
</div>
<el-table :data="orderDetail ? orderDetail.item : []" style="border: 1px solid #eee;" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" />
<el-table-column label="订单号" prop="order_sn"/>
<el-table-column label="商品名称">
<template slot-scope="scope">
{{scope.row.goods_list[0].title}}
</template>
</el-table-column>
<el-table-column label="商品规格">
<template slot-scope="scope">
{{scope.row.goods_list[0].goods_option_title}}
</template>
</el-table-column>
<el-table-column label="单价">
<template slot-scope="scope">
{{scope.row.goods_list[0].price}}
</template>
</el-table-column>
<el-table-column label="数量">
<template slot-scope="scope">
{{scope.row.goods_list[0].num}}
</template>
</el-table-column>
<el-table-column label="商品状态">
<template slot-scope="scope">
{{scope.row.goods_list[0].goods_status == 0 ? '未发货' : '已发货'}}
</template>
</el-table-column>
<el-table-column label="快递公司">
<template slot-scope="scope">
{{scope.row.goods_list[0].deliver_Name}}
</template>
</el-table-column>
<el-table-column label="快递单号" prop="Tel">
<template slot-scope="scope">
{{scope.row.goods_list[0].deliver_no}}
</template>
</el-table-column>
<el-table-column label="操作" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button size="mini" type="text" @click="goShipping(3, scope.row.goods_list[0].goods_id)" :disabled="scope.row.goods_list[0].goods_status > 0">{{getStatus(scope.row.goods_list[0].goods_status, scope.row.goods_list[0].is_reissue)}}</el-button>
<el-button v-if="scope.row.goods_list[0].goods_status > 0" size="mini" type="text" @click="getExpressInfoNew(scope.row.order_sn, scope.row.goods_list[0].goods_id, scope.row.goods_list[0].sku_id)">查看物流</el-button>
</template>
</el-table-column>
</el-table>
</div>
<!-- <div class="orderItem">
<div class="orderTitle">
<img class="icon" src="@/assets/image/order/icon4.png" alt="">
<span>操作历史</span>
</div>
<el-table :data="[]" style="border: 1px solid #eee; width: 75%;">
<el-table-column label="操作时间" prop="order_sn" width="300"/>
<el-table-column label="操作人" prop="order_sn" width="300"/>
<el-table-column label="操作内容" prop="order_sn"/>
</el-table>
</div> -->
<div class="orderItem">
<div class="orderTitle">
<div style="display: flex; align-items: center; width: 70%;">
<img class="icon" src="@/assets/image/order/icon5.png" alt="">
<span>订单备注</span>
</div>
<el-button size="mini" type="primary" @click="addRemark">添加备注</el-button>
</div>
<div style="width: 75%; min-height: 100px; border: 1px solid #eee; padding: 10px;">{{orderDetail ? orderDetail.remark : ''}}</div>
</div>
</div>
</el-card>
<el-dialog
title="修改买家信息"
:visible.sync="modifyinfoDialog"
width="25%"
:modal-append-to-body="false"
:close-on-click-modal="false"
:append-to-body="true"
>
<div style="margin: 0 10%">
<el-form ref="addressForm" :model="addressForm" label-width="100px">
<el-form-item label="收货人姓名:">
<el-input size="mini" v-model="addressForm.name" placeholder="请输入收货人姓名"></el-input>
</el-form-item>
<el-form-item label="联系电话:">
<el-input size="mini" v-model="addressForm.mobile" placeholder="请输入联系电话"></el-input>
</el-form-item>
<el-form-item label="收货地址:">
<el-cascader v-model="addressForm.areaList" :props='props' placeholder="请选择具体的省市区" style="width:100%"></el-cascader>
<el-input size="mini" v-model="addressForm.street_name" placeholder="请输入街道"></el-input>
<el-input size="mini" v-model="addressForm.address" placeholder="请输入收货地址"></el-input>
</el-form-item>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button size="mini" @click="modifyinfoDialog = false">取 消</el-button>
<el-button size="mini" type="primary" @click="handleModifyInfo">确 定</el-button>
</span>
</el-dialog>
<el-dialog
:title="titleInfo"
:visible.sync="goShippingDialog"
width="25%"
:modal-append-to-body="false"
:close-on-click-modal="false"
:append-to-body="true"
>
<div style="margin: 0 10%">
<el-form ref="form" label-width="100px">
<el-form-item label="快递公司:">
<el-select size="mini" v-model="expressNum" placeholder="请选择快递公司" style="width: 100%;">
<el-option
v-for="item in expressLists"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="快递单号:">
<el-input size="mini" v-model="express_sn" placeholder="请输入快递单号"></el-input>
</el-form-item>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button size="mini" @click="goShippingDialog = false">取 消</el-button>
<el-button size="mini" type="primary" @click="handleGoShipping">确 定</el-button>
</span>
</el-dialog>
<el-dialog
title="添加订单备注"
:visible.sync="addRemarkDialog"
width="25%"
:modal-append-to-body="false"
:close-on-click-modal="false"
:append-to-body="true"
>
<div style="padding: 20px 10% 1px; background: #F7F8FA;">
<el-form ref="form" label-width="100px">
<el-form-item label="添加备注:">
<el-input
type="textarea"
:rows="5"
placeholder="请输入订单备注"
v-model="remark">
</el-input>
</el-form-item>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button size="mini" @click="addRemarkDialog = false">取 消</el-button>
<el-button size="mini" type="primary" @click="getRemarkOrder">确 定</el-button>
</span>
</el-dialog>
<!-- 查看物流 -->
<el-dialog title="物流信息" width="50%" class="cutclass" :close-on-click-modal="false" :destroy-on-close="true" :visible.sync="dialogCheck" append-to-body>
<div class="logistics">
<el-timeline>
<el-timeline-item
v-for="(activity, index) in activities"
:key="index"
:icon="activity.icon"
:type="activity.type"
color="#0bbd87"
:size="activity.size"
:timestamp="formatter(activity.msgTime)">
{{activity.content}}
</el-timeline-item>
</el-timeline>
<div v-if="activities.length == 0">暂无物流信息</div>
</div>
</el-dialog>
</div>
</template>
<script>
import {orderInfo, sendOrder, expressInfoNew, remarkOrder, orderInfoEdit} from '@/api/module/order'
import {dateFormat} from '@/utils'
import {getAreaList} from '@/api/module/retreat/address'
export default {
props: {
orderDetail: {
type: Object
},
expressLists: {
type: Array
}
},
data() {
return {
expressNum: '',
express_sn: '',
remark: '',
modifyinfoDialog: false,
goShippingDialog: false,
addRemarkDialog: false,
dialogCheck: false,
titleInfo: '',
addressForm: {
name: '',
mobile: '',
address: '',
street_name: '',
areaList: [] // 省市区
},
activities: [],
multipleSelection: [],
props: {
expandTrigger: 'click',
lazy: true,
lazyLoad: this.lazyLoad,
value: "id",
label: 'name',
leaf: 'leaf'
},
goShippingNum: 0,
goods_ids: null
}
},
computed: {
goodsFreight() {
let freight = 0
if (this.orderDetail) {
this.orderDetail.item.map(item => {
freight += item.freight
})
}
return freight
},
goodsPrice() {
let price = 0
if (this.orderDetail) {
this.orderDetail.item.map(item => {
price += item.goods_list[0].price
})
}
return price
},
goodsNum() {
let goodsNum = 0
if (this.orderDetail) {
this.orderDetail.item.map(item => {
goodsNum += item.goods_list[0].num
})
}
return goodsNum
}
},
methods: {
getStatus(status, is_reissue) {
return status == 0 ? '未发货' : status == 1 && is_reissue == 1 ? '已补单' : status == 1 && is_reissue == 0 ? '已发货' : '已完成'
},
formatter(time) {
return dateFormat(time, 'Y-m-d H:i:s')
},
goShipping(val, id) {
this.goShippingNum = val
this.goods_ids = id
this.expressNum = ''
this.express_sn = ''
if (this.multipleSelection.length == 0 && val != 3) {
this.$message({
type: 'warning',
message: '请选择需要发货的商品'
})
return
}
switch(val) {
case 1:
this.titleInfo = '去发货'
this.goShippingDialog = true
break
case 2:
this.titleInfo = '补单发货'
this.goShippingDialog = true
break
case 3:
this.titleInfo = '去发货'
this.goShippingDialog = true
break
default:
break
}
},
// 订单详情
handleInfo() {
this.detailDialog = true
// let order_sn = '20200318e095e2d09354'
let order_sn = orderDetail.parent_order_sn
orderInfo({order_sn: order_sn}).then(res => {
if (res.code == 1) {
this.orderDetail = res.data
}
})
},
// 选中的表格
handleSelectionChange(val) {
this.multipleSelection = val;
},
modifyinfo() {
this.addressForm = {
name: '',
mobile: '',
address: '',
street_name: ''
}
this.modifyinfoDialog = true
},
// 修改买家信息
handleModifyInfo() {
if (!this.addressForm.name) {
this.$message({
type: 'warning',
message: '请输入收货人姓名'
})
return
}
if (!this.addressForm.mobile) {
this.$message({
type: 'warning',
message: '请输入联系电话'
})
return
}
// 手机号码格式校验
const reg = /^1[3456789]\d{9}$/;
if (!reg.test(this.addressForm.mobile)) {
this.$message({
type: 'warning',
message: '手机号码格式有误'
})
return
}
if (!this.addressForm.areaList) {
this.$message({
type: 'warning',
message: '请选择省市区'
})
return
}
if (!this.addressForm.street_name) {
this.$message({
type: 'warning',
message: '请输入街道'
})
return
}
if (!this.addressForm.address) {
this.$message({
type: 'warning',
message: '请输入收货地址'
})
return
}
let params = {
id: this.orderDetail.parent_order_sn,
shipping_name: this.addressForm.name,
mobile: this.addressForm.mobile,
street_name: this.addressForm.street_name,
address: this.addressForm.address,
province_name: this.addressForm.areaList[0],
city_name: this.addressForm.areaList[1],
district_name: this.addressForm.areaList[2]
}
orderInfoEdit(params).then(res => {
if (res.code == 1) {
this.$message({
type: 'success',
message: '修改成功'
})
this.modifyinfoDialog = false
this.handleInfo()
}
})
},
// 去发货
handleGoShipping() {
if (!this.expressNum) {
this.$message({
type: 'warning',
message: '请选择快递公司'
})
return
}
if (!this.express_sn) {
this.$message({
type: 'warning',
message: '请输入快递单号'
})
return
}
let expressName = ''
this.expressLists.map((item, index) => {
if (item.value == this.expressNum) {
expressName = item.label
}
})
let goods_ids = []
if (this.goShippingNum != 3) {
this.multipleSelection.map(item => {
goods_ids.push(item.goods_list[0].goods_id)
})
} else {
goods_ids = [this.goods_ids]
}
let params = {
order_goods_ids: goods_ids,
express_company_name: expressName,
express_sn: this.express_sn,
express_code: this.expressNum
}
sendOrder(params).then(res => {
if (res.code == 1) {
this.$message({
type: 'success',
message: '商品已发货'
})
this.goShippingDialog = false
this.handleInfo()
}
})
},
// 查看物流
getExpressInfoNew(sn, goodsId, skuId) {
this.dialogCheck = true
let params = {
order_sn: sn,
goods_id: goodsId,
sku_id: skuId
}
expressInfoNew(params).then(res => {
if (res.code == 1) {
this.activities = res.data.orderTrack
}
})
},
addRemark() {
this.remark = ''
this.addRemarkDialog = true
},
// 订单备注
getRemarkOrder() {
if (!this.remark) {
this.$message({
type: 'warning',
message: '请输入订单备注'
})
return
}
let params = {
order_id: this.orderDetail.item[0].order_sn,
remark: this.remark
}
remarkOrder(params).then(res => {
if (res.code == 1) {
this.$message({
type: 'success',
message: '添加成功'
})
this.addRemarkDialog = false
this.handleInfo()
}
})
},
// 三级联动
lazyLoad(node, resolve) {
this.getArea(node, resolve);
},
getArea(node, resolve) {
const level = node.level;
let limboNode = {};
if(level === 0) {
limboNode = {pid: 0}
}
if(level === 1) {
limboNode = { pid: node.value };
}
if(level === 2) {
limboNode = { pid: node.value };
}
getAreaList(limboNode).then(res => {
let result = {};
if (level === 0) {
result = res.data
result.forEach(item => {
item.value = item.id;
item.label = item.name;
item.children=[];
item.leaf = 0; // 可以控制 是否有下级 值为true都不行,必须等于0
})
}
if (level === 1) {
result = res.data
result.forEach(item => {
item.value = item.id;
item.label = item.name
item.children=[];
//这句代码表示当点击最后一级的时候 label后面不会转圈圈 并把相关值赋值到选择器上
item.leaf = 0
})
}
if (level === 2) {
result = res.data
result.forEach(item => {
item.value = item.id;
item.label = item.name
item.leaf = 1;
})
}
resolve(result)
})
},
}
}
</script>
<style scoped>
/deep/.el-dialog__header {
border-bottom: 1px solid #eee;
text-align: center;
}
/deep/.el-step__head.is-success {
color: #3AA0FF;
border-color: #3AA0FF;
}
/deep/.el-step__title.is-success {
color: #3AA0FF;
}
/deep/.el-col {
border: 1px solid #eee;
padding: 0 10px;
height: 38px;
display: flex;
align-items: center;
}
/deep/.el-dialog__body {
padding-bottom: 0;
}
/deep/.el-input--medium .el-input__inner {
height: 28px;
}
.orderDetail {
height: 660px;
overflow-y: auto;
}
.text-r {
justify-content: flex-end;
background: #F7F8FA;
}
.text-l {
text-align: left;
}
.orderItem {
margin-bottom: 20px;
}
.orderTitle {
font-size: 16px;
font-weight: bold;
color: #000;
margin-bottom: 20px;
display: flex;
align-items: center;
}
.icon {
height: 20px;
margin-right: 10px;
}
.row-title {
font-size: 14px;
color: #333;
}
.dialog-footer {
margin: 0 10%;
}
.logistics {
height: 600px;
overflow-y: auto;
}
</style>
\ No newline at end of file
<template>
<div class="app-container">
<el-card class="box-card">
<div slot="header" class="clearfix">
<el-form :model="queryParams" ref="queryForm" :inline="true" label-width="85px" class="queryFormInline" size="small">
<el-form-item label="付款状态" prop="payStatus">
<el-select v-model="queryParams.payStatus" placeholder="付款状态" size="small">
<el-option v-for="item in payOptions" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="发货状态" prop="goodsStatus">
<el-select v-model="queryParams.goodsStatus" placeholder="发货状态" size="small">
<el-option v-for="item in goodsOptions" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="订单状态" prop="status">
<el-select v-model="queryParams.status" placeholder="订单状态" size="small">
<el-option v-for="item in orderOptions" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="商品名字" prop="GoodsName">
<el-input
v-model="queryParams.GoodsName"
placeholder="请输商品名字"
clearable
size="small"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="订单号" prop="order_sn">
<el-input
v-model="queryParams.order_sn"
placeholder="请输订单号"
clearable
size="small"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="下单时间" prop="addTimeInterval">
<el-date-picker
size="small"
v-model="queryParams.addTimeInterval"
type="daterange"
align="left"
unlink-panels
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
:picker-options="pickerOptions"
></el-date-picker>
</el-form-item>
<el-form-item label="收货人名字" prop="shipname">
<el-input
v-model="queryParams.shipname"
placeholder="请输收货人名字"
clearable
size="small"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="手机号" prop="Tel">
<el-input
v-model="queryParams.Tel"
placeholder="请输手机号"
clearable
size="small"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
<!-- <el-button type="warning" plain icon="el-icon-download" @click="handleExport">导出订单</el-button>-->
<!-- <el-button type="primary" plain icon="el-icon-position" @click="handleDelivery">批量发货</el-button>-->
</el-form-item>
<div style="position: relative;">
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane name="first">
<div slot="label">待发货{{activeName == 'first' ? '(' + total + ')' : ''}}</div>
</el-tab-pane>
<el-tab-pane name="second">
<div slot="label">已发货{{activeName == 'second' ? '(' + total + ')' : ''}}</div>
</el-tab-pane>
<el-tab-pane label="已完成" name="third"></el-tab-pane>
<el-tab-pane label="全部订单" name="fourth"></el-tab-pane>
</el-tabs>
<div style="position: absolute; top: -5px; right: 0;">
<el-button size="mini" type="primary" icon="el-icon-download" @click="handleExport">导出订单</el-button>
<el-button size="mini" icon="el-icon-position" @click="isDeliveryOpen = true">批量发货</el-button>
</div>
</div>
<div class="form-box">
<el-form ref="form" :model="form" label-width="85px">
<el-row type="flex" class="row-bg" justify="space-around">
<el-col :span="6">
<el-form-item label="订单号:">
<el-input size="mini" v-model="form.order_sn" placeholder="请输入订单号" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="商品名称:">
<el-input size="mini" v-model="form.GoodsName" placeholder="请输入商品名称" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="收货人:">
<el-input size="mini" v-model="form.shipname" placeholder="请输入收货人" />
</el-form-item>
</el-col>
</el-row>
<el-row type="flex" class="row-bg" justify="space-around">
<el-col :span="6">
<el-form-item label="联系电话:">
<el-input size="mini" v-model="form.Tel" placeholder="请输入联系电话" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="下单时间:">
<el-date-picker
size="mini"
v-model="form.dateTime"
type="daterange"
align="left"
unlink-panels
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="6">
<el-button size="mini" type="primary" icon="el-icon-search" style="margin-left: 20px;" @click="getListOrder">搜索</el-button>
<el-button size="mini" icon="el-icon-refresh" @click="resetBtn(true)">重置</el-button>
</el-col>
</el-row>
</el-form>
</div>
<el-table v-loading="loading" :data="orderList" :height="tableHeight" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center"/>
<el-table-column label="商品名称" align="center" width="200">
<template slot-scope="scope">
<div style="display: flex;justify-content: space-around;flex-direction: row;">
<el-image
v-if="scope.row.Img!=''"
style="width: 60px; height: 50px"
:src="scope.row.Img"
fit="fill"
></el-image>
<span>{{ scope.row.GoodsName}}</span>
</div>
</template>
</el-table-column>
<el-table :data="tableData" height="520">
<el-table-column type="selection" width="55" />
<el-table-column label="订单号" align="center" prop="order_sn"/>
<el-table-column label="商品ID" align="center" prop="GoodsId"/>
<el-table-column label="规格" align="center" prop="SpecDes"/>
<el-table-column label="数量" align="center" prop="Quantity"/>
<el-table-column label="订单金额" align="center" prop="Money"/>
<el-table-column label="结算价格" align="center" prop="SellerMoney"/>
<!-- <el-table-column label="来源" align="center">-->
<!-- <template slot-scope="scope">-->
<!-- <p v-if="scope.row.Pt==0">供应链中台</p>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!--<el-table-column label="收货人姓名" align="center" prop=""/>-->
<el-table-column label="收货人信息" align="center" width="300">
<el-table-column label="下单时间" align="center" prop="Updatetime">
<template slot-scope="scope">
<div style="width:80%;margin:0 auto; text-align: left;">
<span ><i class="el-icon-user"></i> {{scope.row.Shipname}}</span>
<br/>
<span ><i class="el-icon-phone-outline"></i> {{scope.row.Tel}}</span>
<br/>
<i class="el-icon-location-information"></i>
{{scope.row.Province}}
{{scope.row.City}}
{{scope.row.Area}}
{{scope.row.Town}}
{{scope.row.Address}}
</div>
{{formatter(scope.row.Updatetime)}}
</template>
</el-table-column>
<el-table-column label="付款时间" align="center" prop="Paytime"/>
<el-table-column label="确认收货" align="center" prop="ConfirmTime"/>
<el-table-column label="数量" align="center" prop="goods_total"/>
<el-table-column label="订单金额" align="center" prop="goods_price"/>
<el-table-column label="收货人" align="center" prop="real_name"/>
<el-table-column label="联系电话" align="center" prop="mobile"/>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
v-if="scope.row.PayStatus==1 && scope.row.GoodsStatus == 0 || scope.row.GoodsStatus == 3"
size="mini"
type="text"
@click="fahuo(scope.row)"
>去发货
</el-button>
<el-divider
direction="vertical"
v-if="scope.row.PayStatus==1 && scope.row.GoodsStatus == 0 || scope.row.GoodsStatus == 3"
></el-divider>
<el-button
v-else-if="scope.row.PayStatus==1 && scope.row.GoodsStatus == 1 || scope.row.GoodsStatus == 2 && scope.row.DeliverNo"
size="mini"
type="text"
@click="handleWl(scope.row)"
v-loading="loading"
>物流
</el-button>
<el-divider
direction="vertical"
v-else-if="scope.row.PayStatus==1 && scope.row.GoodsStatus == 1 || scope.row.GoodsStatus == 2 && scope.row.DeliverNo"
></el-divider>
<el-button
size="mini"
type="text"
@click="handleUpdate(scope.row)"
>详情
@click="handleInfo(scope.row)"
>
详情
</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 详情 -->
<el-dialog :title="title" :visible.sync="open" width="70%" append-to-body class="order-details" :close-on-click-modal="false">
<el-col :span="24" class="card-box" v-loading="loading">
<el-card>
<div slot="header">
<span>订单信息</span>
</div>
<div class="el-table el-table--enable-row-hover el-table--medium">
<table cellspacing="0" style="width: 100%;">
<tbody>
<tr>
<td>
<div class="cell">订单编号</div>
</td>
<td>
<div class="cell" v-if="form.order_sn">{{form.order_sn}}</div>
</td>
<td>
<div class="cell">第三方订单号</div>
</td>
<td>
<div class="cell" v-if="form.tx_sn">{{form.tx_sn}}</div>
</td>
<td>
<div class="cell">父订单号</div>
</td>
<td>
<div class="cell" v-if="form.parent_order_sn">{{form.parent_order_sn}}</div>
</td>
</tr>
<tr>
<td>
<div class="cell">商品总价格</div>
</td>
<td>
<div class="cell" v-if="form.SellerMoney">{{form.SellerMoney}}</div>
</td>
<td>
<div class="cell">商品实付价格</div>
</td>
<td>
<div class="cell" v-if="form.Money">{{form.Money}}</div>
</td>
<td>
<div class="cell">数量</div>
</td>
<td>
<div class="cell" v-if="form.Quantity">{{form.Quantity}}</div>
</td>
</tr>
<tr>
<td>
<div class="cell">下单时间</div>
</td>
<td>
<div class="cell" v-if="form.Addtime">{{form.Addtime}}</div>
</td>
<td>
<div class="cell">付款时间</div>
</td>
<td>
<div class="cell" v-if="form.Paytime">{{form.Paytime}}</div>
</td>
</tr>
</tbody>
</table>
</div>
</el-card>
</el-col>
<el-col :span="24" class="card-box" v-loading="loading">
<el-card>
<div slot="header">
<span>商品信息</span>
</div>
<div class="el-table el-table--enable-row-hover el-table--medium">
<table cellspacing="0" style="width: 100%;">
<tbody>
<tr>
<td>
<div class="cell">商品图</div>
</td>
<td>
<div class="cell" v-if="form.Img"><img :src="form.Img" alt="" width="320" height="198"></div>
</td>
<td>
<div class="cell">商品ID</div>
</td>
<td>
<div class="cell" v-if="form.GoodsId">{{form.GoodsId}}</div>
</td>
</tr>
<tr>
<td>
<div class="cell">商品名</div>
</td>
<td>
<div class="cell" v-if="form.GoodsName">{{form.GoodsName}}</div>
</td>
<td>
<div class="cell">商品规格</div>
</td>
<td>
<div class="cell" v-if="form.SpecDes">{{form.SpecDes}}</div>
</td>
</tr>
</tbody>
</table>
</div>
</el-card>
</el-col>
<!--物流信息-->
<el-col :span="24" class="card-box" v-loading="loading">
<el-card>
<div slot="header">
<span>物流信息</span>
</div>
<div class="el-table el-table--enable-row-hover el-table--medium">
<table cellspacing="0" style="width: 100%;">
<tbody>
<tr>
<td>
<div class="cell">收货人姓名</div>
</td>
<td>
<div class="cell" v-if="form.Shipname">{{form.Shipname}}</div>
</td>
<td>
<div class="cell">收货人电话</div>
</td>
<td>
<div class="cell" v-if="form.Tel">{{form.Tel}}</div>
</td>
<td>
<div class="cell">收货人地址</div>
</td>
<td>
<div class="cell" v-if="form.Address">{{form.Address}}</div>
</td>
</tr>
<tr>
<td>
<div class="cell">快递公司</div>
</td>
<td>
<div class="cell" v-if="form.DeliverName">{{form.DeliverName}}</div>
</td>
<td>
<div class="cell">快递单号</div>
</td>
<td>
<div class="cell" v-if="form.DeliverNo">{{form.DeliverNo}}</div>
</td>
<td>
<div class="cell">发货时间</div>
</td>
<td>
<div class="cell" v-if="form.Delivertime">{{form.Delivertime}}</div>
</td>
</tr>
<tr>
<td>
<div class="cell">运费</div>
</td>
<td>
<div class="cell" v-if="form.Freight">{{form.Freight}}</div>
</td>
<td>
<div class="cell">查看物流信息</div>
</td>
<td>
<div class="cell" v-if="form.DeliverNo">
<el-button size="big" type="text" @click="handleWl(form)">点击查看</el-button>
</div>
<div class="cell" v-else>
<el-button size="big" type="text" @click="fahuo(form)">去发货</el-button>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</el-card>
</el-col>
<el-col :span="24" class="card-box" v-loading="loading">
<el-card>
<div slot="header">
<span>其他</span>
</div>
<div class="el-table el-table--enable-row-hover el-table--medium">
<table cellspacing="0" style="width: 100%;">
<tbody>
<tr>
<td>
<div class="cell">售后时长</div>
</td>
<td>
<div class="cell" v-if="form.AftersaleTime">{{form.AftersaleTime}}</div>
</td>
<td>
<div class="cell">售后过期时间</div>
</td>
<td>
<div class="cell" v-if="form.AfterSaleOverTime">{{form.AfterSaleOverTime}}</div>
</td>
</tr>
<tr>
<td>
<div class="cell">备注</div>
</td>
<td>
<div class="cell" v-if="form.Remark">{{form.Remark}}</div>
</td>
<td>
<div class="cell">用户备注</div>
</td>
<td>
<div class="cell" v-if="form.UserRemark">{{form.UserRemark}}</div>
</td>
</tr>
</tbody>
</table>
</div>
</el-card>
</el-col>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
<!-- 去发货 -->
<el-dialog :title="title2" :visible.sync="open2" width="60%" append-to-body v-loading="loading" style="height: 40%">
<el-form :model="sendGoods" ref="sendGoods" label-width="100px;">
<el-row>
<el-col :span="16" :offset="3">
<el-form-item label="快递公司" prop="deliverName">
<el-select v-model="sendGoods.deliverName" filterable clearable placeholder="请选择快递公司" @change="selectValue" style="width:70%">
<el-option v-for="item in expressList" :key="item.value" :label="item.label" size="small"
:value="item.value"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="16" :offset="3">
<el-form-item label="快递单号" prop="deliverNo">
<el-input
v-model="sendGoods.deliverNo"
placeholder="请输快递单号"
clearable
size="small"
style="width:70%"
/>
</el-form-item>
</el-col>
</el-row>
<el-row :span="24">
<el-col :span="2" :offset="21">
<el-form-item>
<el-button type="primary" @click="submitForm()">提 交</el-button>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-dialog>
<!-- 物流信息 -->
<el-dialog :title="title3" :visible.sync="open3" width="60%" append-to-body v-loading="loading">
<el-timeline :reverse="reverse" style="padding: 10px 60px;">
<el-timeline-item
v-loading="loading"
v-for="(activity, index) in expressInfo"
:key="index"
:timestamp="activity.time">
{{activity.context}}
</el-timeline-item>
</el-timeline>
</el-dialog>
<div class="footer_pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="currentPage"
:page-sizes="[20, 40, 60, 80, 100]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total">
</el-pagination>
</div>
</el-card>
<!-- 批量发货 -->
<el-dialog title="订单详情" width="85%" :close-on-click-modal="false" :destroy-on-close="true" :visible.sync="detailDialog" center :before-close="handleClose">
<div style="height:100%;">
<order-detail :order-detail="order_detail" :express-lists="expressLists"/>
</div>
</el-dialog>
<!-- 批量发货 -->
<el-dialog title="批量发货流程" :visible.sync="isDeliveryOpen" width="60%" center>
<el-steps :active="3" align-center style="width:95%;margin: 0 auto;">
<el-step title="导出发货Excel表单" description="">
......@@ -479,31 +130,13 @@
action=""
class="upload-demo"
:auto-upload="false"
:limit = '1'
:limit = "1"
accept="*/*"
:on-change = 'importExcel'
:on-remove = 'removeDevExcel'
:on-change="importExcel"
:on-remove="removeDevExcel"
ref="upload"
><el-button size="small" type="primary" >上传批量发货Excel表单</el-button>
<!-- <i slot="tip" class="el-upload__tip el-icon-info">请选取文本文件</i>-->
</el-upload>
<!-- <el-upload-->
<!-- class="upload-demo"-->
<!-- action="http://127.0.0.1:20001/Administration/MediaApiLhUploadHandler"-->
<!-- :on-preview="handlePreview"-->
<!-- :on-remove="handleRemove"-->
<!-- :before-remove="beforeRemove"-->
<!-- multiple-->
<!-- :limit="1"-->
<!-- :on-exceed="handleExceed"-->
<!-- :file-list="fileList">-->
<!-- <el-button size="small" type="primary" >上传批量发货Excel表单</el-button>-->
<!--&lt;!&ndash; <div slot="tip" class="el-upload__tip">只能上传jpg/png文件,且不超过500kb</div>&ndash;&gt;-->
<!-- </el-upload>-->
<!-- <div class="submit-dev-form">-->
<!-- <el-button type="primary">上传批量发货Excel表单</el-button>-->
<!-- </div>-->
<!-- <div class="submit-dev-excel"></div>-->
</div>
<div class="delivery-tips-con">
<p style="text-align: center">常见问题</p>
......@@ -516,211 +149,134 @@
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="cancelDelivery">取 消</el-button>
<el-button @click="isDeliveryOpen = false">取 消</el-button>
<el-button type="primary" @click="subDelivery">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import XLSX from "xlsx";
import {listOrder, getOrder, sendOrder, getExpressInfo, updateOrder, getExpressList,exportOrder,deliveryOrder} from '@/api/module/order'
import {listOrder, exportOrder, orderInfo, deliveryOrder, expressList} from '@/api/module/order'
import {dateFormat} from '@/utils'
import OrderDetail from './components/orderDetail.vue'
import XLSX from "xlsx"
export default {
name: "order",
components: {
OrderDetail
},
data() {
return {
pickerOptions: {
shortcuts: [{
text: '最近一周',
onClick(picker) {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
picker.$emit('pick', [start, end]);
}
}, {
text: '最近一个月',
onClick(picker) {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
picker.$emit('pick', [start, end]);
}
}, {
text: '最近三个月',
onClick(picker) {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
picker.$emit('pick', [start, end]);
}
}]
},
//-------------------
fullHeight: 0,
tableHeight: 0,
fullscreenLoading: false,
// 时间线正序
reverse: false,
// 遮罩层
loading: false,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
currentPage: 1,
pageSize: 20,
total: 0,
// 折扣金额表格数据
orderList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 弹出层标题2
title2: "",
// 是否显示弹出层2
open2: false,
// 是否显示弹出层
open3: false,
isDeliveryOpen: false, // 批量发货对话框
// 弹出层标题2
title3: "",
//快递公司
expressList: [],
//商品状态
goodsOptions: [
{label: "全部状态", value: -1},
{label: "未发货", value: 0},
{label: "已发货", value: 1},
{label: "已收货", value: 2},
{label: "配货中", value: 3},
{label: "拒收", value: 4},
],
//支付状态 付款状态:0:未付款,1:已付款,2申请退款,3,退款中,4已退款5退款申请失败(申请后20天内未处理)
payOptions: [
{label: "全部状态", value: -1},
{label: "未付款", value: 0},
{label: "已付款", value: 1},
{label: "申请退款", value: 2},
{label: "退款中", value: 3},
{label: "已退款", value: 4},
{label: "退款申请失败", value: 5},
],
//订单状态:0:未处理,1,已作废,2,待退货,3,已退货,4,异常订单,10已处理
orderOptions: [
{label: "全部状态", value: -1},
{label: "未处理", value: 0},
{label: "已作废", value: 1},
{label: "待退货", value: 2},
{label: "已退货", value: 3},
{label: "异常订单", value: 4},
{label: "已处理", value: 10},
],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
payStatus: null,
goodsStatus: null,
status: null,
GoodsName: null,
order_sn: null,
shipname: null,
Tel:null,
beginTime: 0,
endTime: 0,
addTimeInterval: []
},
sendGoods: {
orderSn: "",
deliverNo: "",
deliverName: "",
deliverCode: "",
activeName: 'first',
form: {
order_sn: '',
GoodsName: '',
shipname: '',
Tel: '',
dateTime: [],
},
expressInfo: [],
// 表单参数
form: {},
jsonData: [],
excelList: []
};
goodsStatus: 1,
tableData: [],
detailDialog: false,
isDeliveryOpen: false,
excelList: [],
order_detail: null,
expressLists: []
}
},
created() {
this.getList();
this.getExpress();
this.$nextTick(() => {
this.fullHeight = document.getElementsByClassName('box-card')[0].clientHeight
})
mounted() {
this.getListOrder()
this.getExpressList()
},
watch: {
fullHeight(val) {
let formHeight = document.getElementsByClassName('clearfix')[0].clientHeight
this.tableHeight = val - formHeight - 110
methods: {
formatter(time) {
return dateFormat(time, 'Y-m-d H:i:s')
},
// 保证日期初始化格式
'queryParams.addTimeInterval'() {
// select组件,clear的时候,将addTimeInterval的值,初始化为null,判断当其值为null时,赋值为数组
if(!this.queryParams.addTimeInterval && typeof(this.queryParams.addTimeInterval) !== "undefined") {
this.queryParams.addTimeInterval = [];
this.queryParams.beginTime = 0;
this.queryParams.endTime = 0;
// 重置
resetBtn(iscall) {
this.form = {
order_sn: '',
GoodsName: '',
shipname: '',
Tel: '',
dateTime: [],
}
this.currentPage = 1
this.pageSize = 20
if (iscall) {
this.getListOrder()
}
}
},
methods: {
// 获取所有物流
getExpress() {
getExpressList().then(res => {
if(res.code === 1 && res.data) {
this.expressList = res.data.expressLists;
}else {
this.$message({message: '数据出错啦!',type:'error'});
}
});
},
// 选择的物流数据
selectValue(value) {
this.sendGoods.deliverCode = value;
// tab切换
handleClick(tab, event) {
this.total = 0
switch(this.activeName) {
case 'first':
this.goodsStatus = 1
break
case 'second':
this.goodsStatus = 2
break
case 'third':
this.goodsStatus = 3
break
case 'fourth':
this.goodsStatus = ''
break
default:
break
}
this.resetBtn(false)
this.getListOrder()
},
handleClose() {
this.detailDialog = false
this.getListOrder()
},
// 获取订单列表
getListOrder() {
this.tableData = []
let params = {
page: this.currentPage,
limit: this.pageSize,
status: this.goodsStatus,
start_time: new Date(this.form.dateTime[0]).getTime() / 1000 || '',
end_time: new Date(this.form.dateTime[1]).getTime() / 1000 || '',
order_sn: this.form.order_sn,
goods_name: this.form.GoodsName,
real_name: this.form.shipname,
mobile: this.form.Tel,
}
listOrder(params).then(res => {
if (res.code == 1) {
this.total = res.data.count || 0
this.tableData = res.data.data
}
})
},
//物流
handleWl: function (row) {
this.loading = true;
this.sendGoods.deliverCode = row.DeliverCode;
this.sendGoods.deliverName = row.DeliverName;
this.sendGoods.deliverNo = row.DeliverNo;
this.sendGoods.orderSn = row.order_sn;
getExpressInfo(this.sendGoods).then(res => {
this.loading = false;
// 订单导出
handleExport(row) {
let query = {page: 1, limit: 100}
exportOrder(query).then(res => {
if(res.code === 1) {
this.open3 = true;
this.title3 = "物流信息";
this.expressInfo = res.data.data;
}else {
let msg = res.msg || '数据出错了';
this.$message({type: 'error',message: msg});
const link = document.createElement('a');
link.href = res.data;
//link.download = '订单.xls'; //下载的文件名
link.style.display = 'none';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}
});
},
//发货
fahuo: function (row) {
const order_sn = row.order_sn
this.sendGoods.orderSn = order_sn
this.open2 = true;
this.title2 = "去发货";
},
// 批量发货
handleDelivery(){
this.isDeliveryOpen = true;
},
// 上传批量发货Excel表单前
importExcel(file, fileList) {
//this.excelList = fileList;
this.excelList = [];
let _this = this;
_this.file2Xce(file).then(item => {
......@@ -729,14 +285,17 @@
// [{sheetName: sheet1, sheet: sheetData }]
if (item[0] && item[0].sheet && item[0].sheet.length) {
//_this.tableData = item[0].sheet //把数据塞到表格预览
console.log(743,item[0].sheet);
this.excelList = item[0].sheet
// this.excelList = item[0].sheet
item[0].sheet.map((item, index) => {
this.excelList.push({
id: item['编号ID'],
express_name: item['物流公司'],
express_sn: item['物流单号']
})
})
}
}
})
.catch(error => {
loading.close();
})
},
/**
* 解析文件
......@@ -764,163 +323,6 @@
},
removeDevExcel(file, fileList) {
this.excelList = [];
//console.log(781,this.excelList);
},
// ---------
// tableToExcel(list){
// // 列标题,逗号隔开,每一个逗号就是隔开一个单元格
// let title = `订单编号,第三方订单号,goodsFee,goodsStatus,orderStatus,goodsId,name,price,skuName\n`;
// //增加\t为了不让表格显示科学计数法或者其他格式
// for(let i = 0 ; i < list.length ; i++ ){
// for(let item in list[i]){
// title += `${list[i][item] + '\t'},`;
// }
// title += '\n';
// }
// //encodeURIComponent解决中文乱码
// let uri = 'data:text/csv;charset=utf-8,\ufeff' + encodeURIComponent(title);
// //通过创建a标签实现
// var link = document.createElement("a");
// link.href = uri;
// //对下载的文件命名
// link.download = "json数据表.csv";
// document.body.appendChild(link);
// link.click();
// document.body.removeChild(link);
// } ,
// --------------
// 订单导出
handleExport(row) {
const rowIds = this.ids;
let query = {page: 1, limit: 100}
exportOrder(query).then(res => {
if(res.code === 1) {
const link = document.createElement('a');
link.href = res.data;
//link.download = '订单.xls'; //下载的文件名
link.style.display = 'none';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}
});
// return
// this.$confirm('是否确认导出所选择的订单的数据?','警告',{
// confirmButtonText: '确定',
// cancelButtonText: '取消',
// type: 'warning'
// }).then(async()=> {
// this.loading = true;
// let delResult = await exportOrder(ids);
// this.loading = false;
// if(delResult.code === 1) {
// this.$message({type: 'success',message: delResult.msg});
// }
// if(delResult.code === 0) {
// this.$message({type: 'error',message: delResult.msg});
// }
// }).catch(()=> {});
},
dateIfAddZero: function (time) {
return time < 10 ? '0' + time : time
},
/** 查询折扣金额列表 */
getList() {
this.loading = true;
listOrder(this.queryParams).then(response => {
this.from = response.data.list;
this.orderList = response.data.list;
this.total = response.data.total;
this.loading = false;
});
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
if(this.queryParams.addTimeInterval.length === 2) {
this.queryParams.beginTime = new Date(this.queryParams.addTimeInterval[0]).getTime() / 1000;
this.queryParams.endTime = new Date(this.queryParams.addTimeInterval[1]).getTime() / 1000;
}
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.queryParams.beginTime = 0;
this.queryParams.endTime = 0;
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.order_sn)
this.single = selection.length !== 1
this.multiple = !selection.length
},
/** 详情按钮操作 */
handleUpdate(row) {
this.reset();
this.loading = true
const order_sn = row.order_sn || this.ids
getOrder(order_sn).then(response => {
//console.log("请求原始数据:",response);
this.loading = false
this.form = response.data.parms;
this.form.Delivertime = dateFormat(response.data.parms.Delivertime * 1000, "Y-m-d H:i:s");
this.form.Addtime = dateFormat(response.data.parms.Addtime * 1000, "Y-m-d H:i:s");
this.expressList = response.data.expressLists;
this.open = true;
this.title = "订单详情";
});
},
/** 发货按钮 */
submitForm() {
this.$refs["sendGoods"].validate(valid => {
if (valid) {
sendOrder(this.sendGoods).then(response => {
if (response.code == 1) {
this.msgSuccess("发货成功");
this.open2 = false;
this.open = false;
this.getList();
}
});
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const order_sns = row.order_sn || this.ids;
this.$confirm('是否确认删除折扣金额编号为"' + order_sns + '"的数据项?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function () {
return delOrder(order_sns);
}).then(() => {
this.getList();
this.msgSuccess("删除成功");
}).catch(function () {
});
},
// 取消批量发货
cancelDelivery() {
this.isDeliveryOpen = false;
this.excelList = [];
},
// 提交导入数据
subDelivery() {
......@@ -928,11 +330,8 @@
this.$message({type:'warning',message:'请先上传填写好的表格数据'});
return
}
if(this.excelList.length > 0 && this.excelList[0].id && this.excelList[0].express_name &&
this.excelList[0].express_sn && this.excelList[0].express_code) {
if(this.excelList.length > 0 && this.excelList[0].id && this.excelList[0].express_name && this.excelList[0].express_sn) {
deliveryOrder(this.excelList).then(res=> {
//console.log(954,res)
if(res.code === 1) {
this.isDeliveryOpen = false;
this.$message({type:'success',message:'批量发货成功'});
......@@ -945,50 +344,63 @@
}else {
this.$message({type:'error',message:'导入表格数据有误'});
}
},
// 订单详情
handleInfo(row) {
this.detailDialog = true
// let order_sn = '20200318e095e2d09354'
let order_sn = row.parent_order_sn
orderInfo({order_sn: order_sn}).then(res => {
if (res.code == 1) {
this.order_detail = res.data
}
})
},
// 获取物流信息
getExpressList() {
expressList().then(res => {
if (res.code == 1) {
this.expressLists = res.data.expressLists
}
})
},
handleSizeChange(val) {
this.pageSize = val
this.getListOrder()
},
handleCurrentChange(val) {
this.currentPage = val
this.getListOrder()
}
} //methods结束
}
};
</script>
<style scoped lang="scss" type="text/stylus">
.order-details{
/deep/.el-dialog {
height: 80%;
overflow: hidden;
}
/deep/.el-dialog__body {
height: calc(100% - 120px);
overflow-x: hidden;
overflow-y: scroll;
}
}
/deep/.queryFormInline {
.el-form-item:nth-child(1) {
margin-bottom: 10px ;
}
}
.delivery-tips-con,.delivery-data-con {
width: 80%;
margin: 5px auto;
}
.delivery-data-con {
height: 100px;
margin: 40px auto;
}
.upload-demo {
text-align : center;
}
//.submit-dev-form {
// text-align : center;
//}
//.submit-dev-excel {
// overflow-x:hidden;
// overflow-y:scroll;
//}
.delivery-tips-con {
font-size: 12px;
}
/deep/.el-step__title.is-finish {
color: #333
}
</style>
<style scoped>
/deep/.el-range-editor.el-input__inner {
width: 100%;
}
.form-box {
background-color: #F7F8FA;
margin-bottom: 20px;
padding-top: 22px;
}
.footer_pagination {
text-align: right;
margin-top: 15px;
}
.delivery-tips-con,.delivery-data-con {
width: 80%;
margin: 5px auto;
font-weight: bold;
}
.delivery-data-con {
height: 100px;
margin: 20px auto;
}
.upload-demo {
text-align : center;
}
</style>
\ No newline at end of file
<template>
<div class="app-container">
<el-card class="box-card">
<div slot="header" class="clearfix">
<el-form :model="queryParams" ref="queryForm" :inline="true" label-width="85px" class="queryFormInline" size="small">
<el-form-item label="付款状态" prop="payStatus">
<el-select v-model="queryParams.payStatus" placeholder="付款状态" size="small">
<el-option v-for="item in payOptions" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="发货状态" prop="goodsStatus">
<el-select v-model="queryParams.goodsStatus" placeholder="发货状态" size="small">
<el-option v-for="item in goodsOptions" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="订单状态" prop="status">
<el-select v-model="queryParams.status" placeholder="订单状态" size="small">
<el-option v-for="item in orderOptions" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="商品名字" prop="GoodsName">
<el-input
v-model="queryParams.GoodsName"
placeholder="请输商品名字"
clearable
size="small"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="订单号" prop="order_sn">
<el-input
v-model="queryParams.order_sn"
placeholder="请输订单号"
clearable
size="small"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="下单时间" prop="addTimeInterval">
<el-date-picker
size="small"
v-model="queryParams.addTimeInterval"
type="daterange"
align="left"
unlink-panels
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
:picker-options="pickerOptions"
></el-date-picker>
</el-form-item>
<el-form-item label="收货人名字" prop="shipname">
<el-input
v-model="queryParams.shipname"
placeholder="请输收货人名字"
clearable
size="small"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="手机号" prop="Tel">
<el-input
v-model="queryParams.Tel"
placeholder="请输手机号"
clearable
size="small"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
<el-button type="warning" plain icon="el-icon-download" @click="handleExport">导出订单</el-button>
<el-button type="primary" plain icon="el-icon-position" @click="handleDelivery">批量发货</el-button>
</el-form-item>
</el-form>
</div>
<el-table v-loading="loading" :data="orderList" :height="tableHeight" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center"/>
<el-table-column label="商品名称" align="center" width="200">
<template slot-scope="scope">
<div style="display: flex;justify-content: space-around;flex-direction: row;">
<el-image
v-if="scope.row.Img!=''"
style="width: 60px; height: 50px"
:src="scope.row.Img"
fit="fill"
></el-image>
<span>{{ scope.row.GoodsName}}</span>
</div>
</template>
</el-table-column>
<el-table-column label="订单号" align="center" prop="order_sn"/>
<el-table-column label="商品ID" align="center" prop="GoodsId"/>
<el-table-column label="规格" align="center" prop="SpecDes"/>
<el-table-column label="数量" align="center" prop="Quantity"/>
<el-table-column label="订单金额" align="center" prop="Money"/>
<el-table-column label="结算价格" align="center" prop="SellerMoney"/>
<!-- <el-table-column label="来源" align="center">-->
<!-- <template slot-scope="scope">-->
<!-- <p v-if="scope.row.Pt==0">供应链中台</p>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!--<el-table-column label="收货人姓名" align="center" prop=""/>-->
<el-table-column label="收货人信息" align="center" width="300">
<template slot-scope="scope">
<div style="width:80%;margin:0 auto; text-align: left;">
<span ><i class="el-icon-user"></i> {{scope.row.Shipname}}</span>
<br/>
<span ><i class="el-icon-phone-outline"></i> {{scope.row.Tel}}</span>
<br/>
<i class="el-icon-location-information"></i>
{{scope.row.Province}}
{{scope.row.City}}
{{scope.row.Area}}
{{scope.row.Town}}
{{scope.row.Address}}
</div>
</template>
</el-table-column>
<el-table-column label="付款时间" align="center" prop="Paytime"/>
<el-table-column label="确认收货" align="center" prop="ConfirmTime"/>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
v-if="scope.row.PayStatus==1 && scope.row.GoodsStatus == 0 || scope.row.GoodsStatus == 3"
size="mini"
type="text"
@click="fahuo(scope.row)"
>去发货
</el-button>
<el-divider
direction="vertical"
v-if="scope.row.PayStatus==1 && scope.row.GoodsStatus == 0 || scope.row.GoodsStatus == 3"
></el-divider>
<el-button
v-else-if="scope.row.PayStatus==1 && scope.row.GoodsStatus == 1 || scope.row.GoodsStatus == 2 && scope.row.DeliverNo"
size="mini"
type="text"
@click="handleWl(scope.row)"
v-loading="loading"
>物流
</el-button>
<el-divider
direction="vertical"
v-else-if="scope.row.PayStatus==1 && scope.row.GoodsStatus == 1 || scope.row.GoodsStatus == 2 && scope.row.DeliverNo"
></el-divider>
<el-button
size="mini"
type="text"
@click="handleUpdate(scope.row)"
>详情
</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 详情 -->
<el-dialog :title="title" :visible.sync="open" width="70%" append-to-body class="order-details" :close-on-click-modal="false">
<el-col :span="24" class="card-box" v-loading="loading">
<el-card>
<div slot="header">
<span>订单信息</span>
</div>
<div class="el-table el-table--enable-row-hover el-table--medium">
<table cellspacing="0" style="width: 100%;">
<tbody>
<tr>
<td>
<div class="cell">订单编号</div>
</td>
<td>
<div class="cell" v-if="form.order_sn">{{form.order_sn}}</div>
</td>
<td>
<div class="cell">第三方订单号</div>
</td>
<td>
<div class="cell" v-if="form.tx_sn">{{form.tx_sn}}</div>
</td>
<td>
<div class="cell">父订单号</div>
</td>
<td>
<div class="cell" v-if="form.parent_order_sn">{{form.parent_order_sn}}</div>
</td>
</tr>
<tr>
<td>
<div class="cell">商品总价格</div>
</td>
<td>
<div class="cell" v-if="form.SellerMoney">{{form.SellerMoney}}</div>
</td>
<td>
<div class="cell">商品实付价格</div>
</td>
<td>
<div class="cell" v-if="form.Money">{{form.Money}}</div>
</td>
<td>
<div class="cell">数量</div>
</td>
<td>
<div class="cell" v-if="form.Quantity">{{form.Quantity}}</div>
</td>
</tr>
<tr>
<td>
<div class="cell">下单时间</div>
</td>
<td>
<div class="cell" v-if="form.Addtime">{{form.Addtime}}</div>
</td>
<td>
<div class="cell">付款时间</div>
</td>
<td>
<div class="cell" v-if="form.Paytime">{{form.Paytime}}</div>
</td>
</tr>
</tbody>
</table>
</div>
</el-card>
</el-col>
<el-col :span="24" class="card-box" v-loading="loading">
<el-card>
<div slot="header">
<span>商品信息</span>
</div>
<div class="el-table el-table--enable-row-hover el-table--medium">
<table cellspacing="0" style="width: 100%;">
<tbody>
<tr>
<td>
<div class="cell">商品图</div>
</td>
<td>
<div class="cell" v-if="form.Img"><img :src="form.Img" alt="" width="320" height="198"></div>
</td>
<td>
<div class="cell">商品ID</div>
</td>
<td>
<div class="cell" v-if="form.GoodsId">{{form.GoodsId}}</div>
</td>
</tr>
<tr>
<td>
<div class="cell">商品名</div>
</td>
<td>
<div class="cell" v-if="form.GoodsName">{{form.GoodsName}}</div>
</td>
<td>
<div class="cell">商品规格</div>
</td>
<td>
<div class="cell" v-if="form.SpecDes">{{form.SpecDes}}</div>
</td>
</tr>
</tbody>
</table>
</div>
</el-card>
</el-col>
<!--物流信息-->
<el-col :span="24" class="card-box" v-loading="loading">
<el-card>
<div slot="header">
<span>物流信息</span>
</div>
<div class="el-table el-table--enable-row-hover el-table--medium">
<table cellspacing="0" style="width: 100%;">
<tbody>
<tr>
<td>
<div class="cell">收货人姓名</div>
</td>
<td>
<div class="cell" v-if="form.Shipname">{{form.Shipname}}</div>
</td>
<td>
<div class="cell">收货人电话</div>
</td>
<td>
<div class="cell" v-if="form.Tel">{{form.Tel}}</div>
</td>
<td>
<div class="cell">收货人地址</div>
</td>
<td>
<div class="cell" v-if="form.Address">{{form.Address}}</div>
</td>
</tr>
<tr>
<td>
<div class="cell">快递公司</div>
</td>
<td>
<div class="cell" v-if="form.DeliverName">{{form.DeliverName}}</div>
</td>
<td>
<div class="cell">快递单号</div>
</td>
<td>
<div class="cell" v-if="form.DeliverNo">{{form.DeliverNo}}</div>
</td>
<td>
<div class="cell">发货时间</div>
</td>
<td>
<div class="cell" v-if="form.Delivertime">{{form.Delivertime}}</div>
</td>
</tr>
<tr>
<td>
<div class="cell">运费</div>
</td>
<td>
<div class="cell" v-if="form.Freight">{{form.Freight}}</div>
</td>
<td>
<div class="cell">查看物流信息</div>
</td>
<td>
<div class="cell" v-if="form.DeliverNo">
<el-button size="big" type="text" @click="handleWl(form)">点击查看</el-button>
</div>
<div class="cell" v-else>
<el-button size="big" type="text" @click="fahuo(form)">去发货</el-button>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</el-card>
</el-col>
<el-col :span="24" class="card-box" v-loading="loading">
<el-card>
<div slot="header">
<span>其他</span>
</div>
<div class="el-table el-table--enable-row-hover el-table--medium">
<table cellspacing="0" style="width: 100%;">
<tbody>
<tr>
<td>
<div class="cell">售后时长</div>
</td>
<td>
<div class="cell" v-if="form.AftersaleTime">{{form.AftersaleTime}}</div>
</td>
<td>
<div class="cell">售后过期时间</div>
</td>
<td>
<div class="cell" v-if="form.AfterSaleOverTime">{{form.AfterSaleOverTime}}</div>
</td>
</tr>
<tr>
<td>
<div class="cell">备注</div>
</td>
<td>
<div class="cell" v-if="form.Remark">{{form.Remark}}</div>
</td>
<td>
<div class="cell">用户备注</div>
</td>
<td>
<div class="cell" v-if="form.UserRemark">{{form.UserRemark}}</div>
</td>
</tr>
</tbody>
</table>
</div>
</el-card>
</el-col>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
<!-- 去发货 -->
<el-dialog :title="title2" :visible.sync="open2" width="60%" append-to-body v-loading="loading" style="height: 40%">
<el-form :model="sendGoods" ref="sendGoods" label-width="100px;">
<el-row>
<el-col :span="16" :offset="3">
<el-form-item label="快递公司" prop="deliverName">
<el-select v-model="sendGoods.deliverName" filterable clearable placeholder="请选择快递公司" @change="selectValue" style="width:70%">
<el-option v-for="item in expressList" :key="item.value" :label="item.label" size="small"
:value="item.value"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="16" :offset="3">
<el-form-item label="快递单号" prop="deliverNo">
<el-input
v-model="sendGoods.deliverNo"
placeholder="请输快递单号"
clearable
size="small"
style="width:70%"
/>
</el-form-item>
</el-col>
</el-row>
<el-row :span="24">
<el-col :span="2" :offset="21">
<el-form-item>
<el-button type="primary" @click="submitForm()">提 交</el-button>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-dialog>
<!-- 物流信息 -->
<el-dialog :title="title3" :visible.sync="open3" width="60%" append-to-body v-loading="loading">
<el-timeline :reverse="reverse" style="padding: 10px 60px;">
<el-timeline-item
v-loading="loading"
v-for="(activity, index) in expressInfo"
:key="index"
:timestamp="activity.time">
{{activity.context}}
</el-timeline-item>
</el-timeline>
</el-dialog>
</el-card>
<!-- 批量发货 -->
<el-dialog title="批量发货流程" :visible.sync="isDeliveryOpen" width="60%" center>
<el-steps :active="3" align-center style="width:95%;margin: 0 auto;">
<el-step title="导出发货Excel表单" description="">
<template slot="icon">
<img style="width: 30px;" src="../../../assets/image/dev1.png">
</template>
</el-step>
<el-step title="按模板填写快递信息" description="">
<template slot="icon">
<img style="width: 30px;" src="../../../assets/image/dev2.png">
</template>
</el-step>
<el-step title="上传发货单模板并提交" description="">
<template slot="icon">
<img style="width: 30px;" src="../../../assets/image/dev3.png">
</template>
</el-step>
</el-steps>
<div class="delivery-data-con">
<el-upload
action=""
class="upload-demo"
:auto-upload="false"
:limit = '1'
accept="*/*"
:on-change = 'importExcel'
:on-remove = 'removeDevExcel'
ref="upload"
><el-button size="small" type="primary" >上传批量发货Excel表单</el-button>
<!-- <i slot="tip" class="el-upload__tip el-icon-info">请选取文本文件</i>-->
</el-upload>
<!-- <el-upload-->
<!-- class="upload-demo"-->
<!-- action="http://127.0.0.1:20001/Administration/MediaApiLhUploadHandler"-->
<!-- :on-preview="handlePreview"-->
<!-- :on-remove="handleRemove"-->
<!-- :before-remove="beforeRemove"-->
<!-- multiple-->
<!-- :limit="1"-->
<!-- :on-exceed="handleExceed"-->
<!-- :file-list="fileList">-->
<!-- <el-button size="small" type="primary" >上传批量发货Excel表单</el-button>-->
<!--&lt;!&ndash; <div slot="tip" class="el-upload__tip">只能上传jpg/png文件,且不超过500kb</div>&ndash;&gt;-->
<!-- </el-upload>-->
<!-- <div class="submit-dev-form">-->
<!-- <el-button type="primary">上传批量发货Excel表单</el-button>-->
<!-- </div>-->
<!-- <div class="submit-dev-excel"></div>-->
</div>
<div class="delivery-tips-con">
<p style="text-align: center">常见问题</p>
<p>1、批量发货规则</p>
<p>必须正确填写了“快递公司 快递单号”才会导入并更改订单状态为已发货!</p>
<p>2、如何获取一个批量发货的excel文件?</p>
<p>在商户后台左侧菜单的 “订单中心” 》“订单列表”里面可以将订单导出为Excel格式的文件,您可以在这里自由导出订单</p>
<p>3、导出excel文件后,批量发货需要输入什么信息?</p>
<p>在我们的导出的excel文件中,打开里面有“快递单号 快递公司”。 您可以在将正确的快递发货单号,快递公司填入对应的列里面,和对应的订单号一对应。然后保存提交,就可以用于批量发货了</p>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="cancelDelivery">取 消</el-button>
<el-button type="primary" @click="subDelivery">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import XLSX from "xlsx";
import {listOrder, getOrder, sendOrder, getExpressInfo, updateOrder, getExpressList,exportOrder,deliveryOrder} from '@/api/module/order'
import {dateFormat} from '@/utils'
export default {
name: "order",
data() {
return {
pickerOptions: {
shortcuts: [{
text: '最近一周',
onClick(picker) {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
picker.$emit('pick', [start, end]);
}
}, {
text: '最近一个月',
onClick(picker) {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
picker.$emit('pick', [start, end]);
}
}, {
text: '最近三个月',
onClick(picker) {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
picker.$emit('pick', [start, end]);
}
}]
},
//-------------------
fullHeight: 0,
tableHeight: 0,
fullscreenLoading: false,
// 时间线正序
reverse: false,
// 遮罩层
loading: false,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 折扣金额表格数据
orderList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 弹出层标题2
title2: "",
// 是否显示弹出层2
open2: false,
// 是否显示弹出层
open3: false,
isDeliveryOpen: false, // 批量发货对话框
// 弹出层标题2
title3: "",
//快递公司
expressList: [],
//商品状态
goodsOptions: [
{label: "全部状态", value: -1},
{label: "未发货", value: 0},
{label: "已发货", value: 1},
{label: "已收货", value: 2},
{label: "配货中", value: 3},
{label: "拒收", value: 4},
],
//支付状态 付款状态:0:未付款,1:已付款,2申请退款,3,退款中,4已退款5退款申请失败(申请后20天内未处理)
payOptions: [
{label: "全部状态", value: -1},
{label: "未付款", value: 0},
{label: "已付款", value: 1},
{label: "申请退款", value: 2},
{label: "退款中", value: 3},
{label: "已退款", value: 4},
{label: "退款申请失败", value: 5},
],
//订单状态:0:未处理,1,已作废,2,待退货,3,已退货,4,异常订单,10已处理
orderOptions: [
{label: "全部状态", value: -1},
{label: "未处理", value: 0},
{label: "已作废", value: 1},
{label: "待退货", value: 2},
{label: "已退货", value: 3},
{label: "异常订单", value: 4},
{label: "已处理", value: 10},
],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
payStatus: null,
goodsStatus: null,
status: null,
GoodsName: null,
order_sn: null,
shipname: null,
Tel:null,
beginTime: 0,
endTime: 0,
addTimeInterval: []
},
sendGoods: {
orderSn: "",
deliverNo: "",
deliverName: "",
deliverCode: "",
},
expressInfo: [],
// 表单参数
form: {},
jsonData: [],
excelList: []
};
},
created() {
this.getList();
this.getExpress();
this.$nextTick(() => {
this.fullHeight = document.getElementsByClassName('box-card')[0].clientHeight
})
},
watch: {
fullHeight(val) {
let formHeight = document.getElementsByClassName('clearfix')[0].clientHeight
this.tableHeight = val - formHeight - 110
},
// 保证日期初始化格式
'queryParams.addTimeInterval'() {
// select组件,clear的时候,将addTimeInterval的值,初始化为null,判断当其值为null时,赋值为数组
if(!this.queryParams.addTimeInterval && typeof(this.queryParams.addTimeInterval) !== "undefined") {
this.queryParams.addTimeInterval = [];
this.queryParams.beginTime = 0;
this.queryParams.endTime = 0;
}
}
},
methods: {
// 获取所有物流
getExpress() {
getExpressList().then(res => {
if(res.code === 1 && res.data) {
this.expressList = res.data.expressLists;
}else {
this.$message({message: '数据出错啦!',type:'error'});
}
});
},
// 选择的物流数据
selectValue(value) {
this.sendGoods.deliverCode = value;
},
//物流
handleWl: function (row) {
this.loading = true;
this.sendGoods.deliverCode = row.DeliverCode;
this.sendGoods.deliverName = row.DeliverName;
this.sendGoods.deliverNo = row.DeliverNo;
this.sendGoods.orderSn = row.order_sn;
getExpressInfo(this.sendGoods).then(res => {
this.loading = false;
if(res.code === 1) {
this.open3 = true;
this.title3 = "物流信息";
this.expressInfo = res.data.data;
}else {
let msg = res.msg || '数据出错了';
this.$message({type: 'error',message: msg});
}
});
},
//发货
fahuo: function (row) {
const order_sn = row.order_sn
this.sendGoods.orderSn = order_sn
this.open2 = true;
this.title2 = "去发货";
},
// 批量发货
handleDelivery(){
this.isDeliveryOpen = true;
},
// 上传批量发货Excel表单前
importExcel(file, fileList) {
//this.excelList = fileList;
this.excelList = [];
let _this = this;
_this.file2Xce(file).then(item => {
if (item && item.length > 0) {
// xlsxJson就是解析出来的json数据,数据格式如下
// [{sheetName: sheet1, sheet: sheetData }]
if (item[0] && item[0].sheet && item[0].sheet.length) {
//_this.tableData = item[0].sheet //把数据塞到表格预览
console.log(743,item[0].sheet);
this.excelList = item[0].sheet
}
}
})
.catch(error => {
loading.close();
})
},
/**
* 解析文件
* @param {Object} file
*/
file2Xce(file) {
return new Promise(function(resolve, reject) {
const reader = new FileReader();
reader.onload = function(e) {
const data = e.target.result;
this.wb = XLSX.read(data, {
type: "binary"
});
const result = [];
this.wb.SheetNames.forEach(sheetName => {
result.push({
sheetName: sheetName,
sheet: XLSX.utils.sheet_to_json(this.wb.Sheets[sheetName])
});
});
resolve(result);
};
reader.readAsBinaryString(file.raw);
});
},
removeDevExcel(file, fileList) {
this.excelList = [];
//console.log(781,this.excelList);
},
// ---------
// tableToExcel(list){
// // 列标题,逗号隔开,每一个逗号就是隔开一个单元格
// let title = `订单编号,第三方订单号,goodsFee,goodsStatus,orderStatus,goodsId,name,price,skuName\n`;
// //增加\t为了不让表格显示科学计数法或者其他格式
// for(let i = 0 ; i < list.length ; i++ ){
// for(let item in list[i]){
// title += `${list[i][item] + '\t'},`;
// }
// title += '\n';
// }
// //encodeURIComponent解决中文乱码
// let uri = 'data:text/csv;charset=utf-8,\ufeff' + encodeURIComponent(title);
// //通过创建a标签实现
// var link = document.createElement("a");
// link.href = uri;
// //对下载的文件命名
// link.download = "json数据表.csv";
// document.body.appendChild(link);
// link.click();
// document.body.removeChild(link);
// } ,
// --------------
// 订单导出
handleExport(row) {
const rowIds = this.ids;
let query = {page: 1, limit: 100}
exportOrder(query).then(res => {
if(res.code === 1) {
const link = document.createElement('a');
link.href = res.data;
//link.download = '订单.xls'; //下载的文件名
link.style.display = 'none';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}
});
// return
// this.$confirm('是否确认导出所选择的订单的数据?','警告',{
// confirmButtonText: '确定',
// cancelButtonText: '取消',
// type: 'warning'
// }).then(async()=> {
// this.loading = true;
// let delResult = await exportOrder(ids);
// this.loading = false;
// if(delResult.code === 1) {
// this.$message({type: 'success',message: delResult.msg});
// }
// if(delResult.code === 0) {
// this.$message({type: 'error',message: delResult.msg});
// }
// }).catch(()=> {});
},
dateIfAddZero: function (time) {
return time < 10 ? '0' + time : time
},
/** 查询折扣金额列表 */
getList() {
this.loading = true;
listOrder(this.queryParams).then(response => {
this.from = response.data.list;
this.orderList = response.data.list;
this.total = response.data.total;
this.loading = false;
});
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
if(this.queryParams.addTimeInterval.length === 2) {
this.queryParams.beginTime = new Date(this.queryParams.addTimeInterval[0]).getTime() / 1000;
this.queryParams.endTime = new Date(this.queryParams.addTimeInterval[1]).getTime() / 1000;
}
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.queryParams.beginTime = 0;
this.queryParams.endTime = 0;
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.order_sn)
this.single = selection.length !== 1
this.multiple = !selection.length
},
/** 详情按钮操作 */
handleUpdate(row) {
this.reset();
this.loading = true
const order_sn = row.order_sn || this.ids
getOrder(order_sn).then(response => {
//console.log("请求原始数据:",response);
this.loading = false
this.form = response.data.parms;
this.form.Delivertime = dateFormat(response.data.parms.Delivertime * 1000, "Y-m-d H:i:s");
this.form.Addtime = dateFormat(response.data.parms.Addtime * 1000, "Y-m-d H:i:s");
this.expressList = response.data.expressLists;
this.open = true;
this.title = "订单详情";
});
},
/** 发货按钮 */
submitForm() {
this.$refs["sendGoods"].validate(valid => {
if (valid) {
sendOrder(this.sendGoods).then(response => {
if (response.code == 1) {
this.msgSuccess("发货成功");
this.open2 = false;
this.open = false;
this.getList();
}
});
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const order_sns = row.order_sn || this.ids;
this.$confirm('是否确认删除折扣金额编号为"' + order_sns + '"的数据项?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function () {
return delOrder(order_sns);
}).then(() => {
this.getList();
this.msgSuccess("删除成功");
}).catch(function () {
});
},
// 取消批量发货
cancelDelivery() {
this.isDeliveryOpen = false;
this.excelList = [];
},
// 提交导入数据
subDelivery() {
if(this.excelList.length === 0) {
this.$message({type:'warning',message:'请先上传填写好的表格数据'});
return
}
if(this.excelList.length > 0 && this.excelList[0].id && this.excelList[0].express_name &&
this.excelList[0].express_sn && this.excelList[0].express_code) {
deliveryOrder(this.excelList).then(res=> {
//console.log(954,res)
if(res.code === 1) {
this.isDeliveryOpen = false;
this.$message({type:'success',message:'批量发货成功'});
this.getList();
}else {
let msg = res.message || '批量发货失败'
this.$message({type:'error',message:msg});
}
});
}else {
this.$message({type:'error',message:'导入表格数据有误'});
}
}
} //methods结束
};
</script>
<style scoped lang="scss" type="text/stylus">
.order-details{
/deep/.el-dialog {
height: 80%;
overflow: hidden;
}
/deep/.el-dialog__body {
height: calc(100% - 120px);
overflow-x: hidden;
overflow-y: scroll;
}
}
/deep/.queryFormInline {
.el-form-item:nth-child(1) {
margin-bottom: 10px ;
}
}
.delivery-tips-con,.delivery-data-con {
width: 80%;
margin: 5px auto;
}
.delivery-data-con {
height: 100px;
margin: 40px auto;
}
.upload-demo {
text-align : center;
}
//.submit-dev-form {
// text-align : center;
//}
//.submit-dev-excel {
// overflow-x:hidden;
// overflow-y:scroll;
//}
.delivery-tips-con {
font-size: 12px;
}
/deep/.el-step__title.is-finish {
color: #333
}
</style>
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论