|
|
@@ -1,176 +1,155 @@
|
|
|
<template>
|
|
|
<div class="app-container">
|
|
|
<!-- 订单信息 -->
|
|
|
- <div class="info">
|
|
|
- <div class="info-title">订单信息</div>
|
|
|
- <div class="info-item">
|
|
|
- <div class="info-item-content">
|
|
|
- <div class="info-item-content-one">
|
|
|
- <div class="title">订单编号：</div>
|
|
|
- <div class="txt">{{ info.orderId }}</div>
|
|
|
- </div>
|
|
|
- <div class="info-item-content-one">
|
|
|
- <div class="title">订单类型：</div>
|
|
|
- <div class="txt">经销商订单</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="info-item-content">
|
|
|
- <div class="info-item-content-one">
|
|
|
- <div class="title">下单时间：</div>
|
|
|
- <div class="txt">{{ parseTime(info.createdTime) }}</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ <el-row :gutter="10">
|
|
|
+ <el-col :span="22" offset="1">
|
|
|
+ <div class="info-title">订单信息</div>
|
|
|
+ <el-col :span="8" offset="1" :xs="{span: 24, offset: 0}">
|
|
|
+ <div class="title">订单编号：{{ info.orderId }}</div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="7" :xs="{span: 24, offset: 0}">
|
|
|
+ <div class="title">订单类型：经销商订单</div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8" :xs="{span: 24, offset: 0}">
|
|
|
+ <div class="title">下单时间：{{ parseTime(info.createdTime) }}</div>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
<!-- 卖家信息 -->
|
|
|
- <div class="info">
|
|
|
- <div class="info-title">买家信息</div>
|
|
|
- <div class="info-item">
|
|
|
- <div class="info-item-content">
|
|
|
- <div class="info-item-content-one">
|
|
|
- <div class="title">经销商：</div>
|
|
|
- <div class="txt">{{ info.channel && info.channel.name }}</div>
|
|
|
- </div>
|
|
|
- <div class="info-item-content-one">
|
|
|
- <div class="title">上级渠道：</div>
|
|
|
- <div class="txt">{{ info.channel && info.channel.parentName }}</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="info-item-content">
|
|
|
- <div class="info-item-content-one">
|
|
|
- <div class="title">收货人：</div>
|
|
|
- <div class="txt">{{ info.receiver || "--" }}</div>
|
|
|
- </div>
|
|
|
- <div class="info-item-content-one">
|
|
|
- <div class="title">联系电话：</div>
|
|
|
- <div class="txt">{{ info.tel || "--" }}</div>
|
|
|
+ <el-row :gutter="10" >
|
|
|
+ <el-col :span="22" offset="1">
|
|
|
+ <div class="info-title">买家信息</div>
|
|
|
+ <el-col :span="8" offset="1" :xs="{span: 24, offset: 0}">
|
|
|
+ <div class="title">经销商：{{ info.channel && info.channel.name }}</div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="7" :xs="{span: 24, offset: 0}">
|
|
|
+ <div class="title">上级渠道：{{ info.channel && info.channel.parentName }}</div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8" :xs="{span: 24, offset: 0}">
|
|
|
+ <div class="title">收货人：{{ info.receiver || "--" }}</div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8" offset="1" :xs="{span: 24, offset: 0}">
|
|
|
+ <div class="title">联系电话：{{ info.tel || "--" }}</div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="7" :xs="{span: 24, offset: 0}">
|
|
|
+ <div class="title">收货地址：{{
|
|
|
+ `${info.province || "--"}${info.city || "--"}${
|
|
|
+ info.area || "--"
|
|
|
+ }${info.address || "--"}`
|
|
|
+ }}
|
|
|
</div>
|
|
|
- <div class="info-item-content-one">
|
|
|
- <div class="title">收货地址：</div>
|
|
|
- <div class="">
|
|
|
- {{
|
|
|
- `${info.province || "--"}${info.city || "--"}${
|
|
|
- info.area || "--"
|
|
|
- }${info.address || "--"}`
|
|
|
- }}
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
<!-- 买家留言 -->
|
|
|
- <div class="info">
|
|
|
- <div class="info-title">备注信息</div>
|
|
|
- <div class="info-item">
|
|
|
- <div class="info-item-content">
|
|
|
- <div class="info-item-content-one">
|
|
|
- <div class="title">买家留言：</div>
|
|
|
- <div class="txt">{{ info.memo || "--" }}</div>
|
|
|
+ <el-row :gutter="10">
|
|
|
+ <el-col :span="22" offset="1">
|
|
|
+ <div class="info-title">备注信息</div>
|
|
|
+ <el-col :span="8" offset="1" :xs="{span: 24, offset: 0}">
|
|
|
+ <div class="title">买家留言：{{ info.memo || "--" }}</div>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <!-- 订单状态 -->
|
|
|
+ <el-row :gutter="10">
|
|
|
+ <el-col :span="22" offset="1">
|
|
|
+ <div class="info-title">订单状态</div>
|
|
|
+
|
|
|
+ <el-col :span="8" offset="1" :xs="{span: 24, offset: 0}">
|
|
|
+ <div class="title">订单状态：{{ status.value == 2 ? "已发货" : (status.desc || "--") }}</div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="7" :xs="{span: 18, offset: 0}">
|
|
|
+ <div class="title" v-if="status.value === 2 || status.value === 3">
|
|
|
+ 发货时间：{{ parseTime(info.deliveryTime) || "--" }}
|
|
|
</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- 订单状态 -->
|
|
|
- <div class="info">
|
|
|
- <div class="info-title">订单状态</div>
|
|
|
- <div class="info-item">
|
|
|
- <div class="info-item-content">
|
|
|
- <div class="info-item-content-one">
|
|
|
- <div class="title">订单状态：</div>
|
|
|
- <div class="txt" v-if="status.value == 2">已发货</div>
|
|
|
- <div class="txt" v-else>{{ status.desc || "--" }}</div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8" :xs="{span: 4, offset: 0}">
|
|
|
+ <div class="edit-express" v-if="status.value === 2" @click="editExpress">修改</div>
|
|
|
+ </el-col>
|
|
|
+ <el-button
|
|
|
+ v-if="status.value === 1"
|
|
|
+ v-hasPermi="['business:ticket:on']"
|
|
|
+ type="primary"
|
|
|
+ @click="toGoods()"
|
|
|
+ >发货
|
|
|
+ </el-button
|
|
|
+ >
|
|
|
+ <el-col :span="8" offset="1" :xs="{span: 24, offset: 0}">
|
|
|
+ <div class="title" v-if="status.value === 2 || status.value === 3">配送方式：{{ "快递发货" || "--" }}</div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="7" :xs="{span: 24, offset: 0}">
|
|
|
+ <div class="title" v-if="status.value === 2 || status.value === 3">
|
|
|
+ 快递公司：{{ (delivery && delivery.companyName) || "--" }}
|
|
|
</div>
|
|
|
- <div class="info-item-content-one" v-if="status.value === 2 || status.value === 3">
|
|
|
- <div class="title">发货时间：</div>
|
|
|
- <div class="txt">{{ parseTime(info.deliveryTime) || "--" }}</div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="7" :xs="{span: 24, offset: 0}">
|
|
|
+ <div class="title" v-if="status.value === 2 || status.value === 3">快递单号：{{
|
|
|
+ info.deliveryFlowId || "--"
|
|
|
+ }}
|
|
|
</div>
|
|
|
- <div class="info-item-content-one" v-if="status.value === 2">
|
|
|
- <div class="edit-express" @click="editExpress">修改</div>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <br>
|
|
|
+ <el-row :gutter="10">
|
|
|
+ <el-col :span="22" offset="1">
|
|
|
+ <!-- 商品信息 -->
|
|
|
+ <div class="info">
|
|
|
+ <div class="info-title">商品信息</div>
|
|
|
+ <div class="info-table">
|
|
|
+ <el-table :data="list">
|
|
|
+ <el-table-column label="商品信息">
|
|
|
+ <div slot-scope="{ row }" class="flex">
|
|
|
+ <el-image
|
|
|
+ style="width: 100px; height: 100px"
|
|
|
+ :src="row.picUrl"
|
|
|
+ :preview-src-list="[row.picUrl]"
|
|
|
+ />
|
|
|
+ <div class="txt">{{ row.title }}</div>
|
|
|
+ </div>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="单价(元)">
|
|
|
+ <template slot-scope="{ row }">
|
|
|
+ <div>{{ $numberFormat(row.pkgSalePrice) }}</div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="数量" prop="orderNum">
|
|
|
+ <template slot-scope="{ row }">
|
|
|
+ <div>{{ row.orderNum }}包</div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="小计(元)">
|
|
|
+ <template slot-scope="{ row }">
|
|
|
+ <div>{{ $numberFormat(row.pkgSalePrice * row.orderNum) }}</div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ v-if="status.value === 2 || status.value === 3"
|
|
|
+ label="附加信息"
|
|
|
+ min-width="150"
|
|
|
+ >
|
|
|
+ <template slot-scope="{ row }">
|
|
|
+ <div>
|
|
|
+ 序列号：
|
|
|
+ <div v-for="(item, index) in row.detailList" :key="index">
|
|
|
+ {{ item.startSn }} 至 {{ item.endSn }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- <div class="info-item-content">
|
|
|
- <el-button
|
|
|
- v-if="status.value === 1"
|
|
|
- v-hasPermi="['business:ticket:on']"
|
|
|
- type="primary"
|
|
|
- @click="toGoods()"
|
|
|
- >发货</el-button
|
|
|
- >
|
|
|
- <div class="info-item-content-one" v-if="status.value === 2 || status.value === 3">
|
|
|
- <div class="title">配送方式：</div>
|
|
|
- <div class="txt">
|
|
|
-<!-- {{ info.deliveryType || "--" }}-->
|
|
|
- {{ "快递发货" || "--" }}
|
|
|
+ <div class="info-amt">
|
|
|
+ <div class="info-amt-price">
|
|
|
+ <span>运费：</span>{{ $numberFormat(info.freightAmt) }}元
|
|
|
</div>
|
|
|
- </div>
|
|
|
- <div class="info-item-content-one" v-if="status.value === 2 || status.value === 3">
|
|
|
- <div class="title">快递公司：</div>
|
|
|
- <div class="txt">
|
|
|
- {{ (delivery && delivery.companyName) || "--" }}
|
|
|
+ <div class="info-amt-price">
|
|
|
+ <span>共计金额：</span>{{ $numberFormat(info.payAmt) }}元
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="info-item-content-one" v-if="status.value === 2 || status.value === 3">
|
|
|
- <div class="title">快递单号：</div>
|
|
|
- <div class="txt">{{ info.deliveryFlowId || "--" }}</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- 商品信息 -->
|
|
|
- <div class="info">
|
|
|
- <div class="info-title">商品信息</div>
|
|
|
- <div class="info-table">
|
|
|
- <el-table :data="list">
|
|
|
- <el-table-column label="商品信息">
|
|
|
- <div slot-scope="{ row }" class="flex">
|
|
|
- <el-image
|
|
|
- style="width: 100px; height: 100px"
|
|
|
- :src="row.picUrl"
|
|
|
- :preview-src-list="[row.picUrl]"
|
|
|
- />
|
|
|
- <div class="txt">{{ row.title }}</div>
|
|
|
- </div>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="单价(元)">
|
|
|
- <template slot-scope="{ row }">
|
|
|
- <div>{{ $numberFormat(row.pkgSalePrice) }}</div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="数量" prop="orderNum">
|
|
|
- <template slot-scope="{ row }">
|
|
|
- <div>{{ row.orderNum }}包</div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="小计(元)">
|
|
|
- <template slot-scope="{ row }">
|
|
|
- <div>{{ $numberFormat(row.pkgSalePrice * row.orderNum) }}</div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- v-if="status.value === 2 || status.value === 3"
|
|
|
- label="附加信息"
|
|
|
- min-width="150"
|
|
|
- >
|
|
|
- <template slot-scope="{ row }">
|
|
|
- <div>
|
|
|
- 序列号：
|
|
|
- <div v-for="(item, index) in row.detailList" :key="index">
|
|
|
- {{ item.startSn }} 至 {{ item.endSn }}
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- </div>
|
|
|
- <div class="info-amt">
|
|
|
- <div class="info-amt-price">
|
|
|
- <span>运费：</span>{{ $numberFormat(info.freightAmt) }}元
|
|
|
- </div>
|
|
|
- <div class="info-amt-price">
|
|
|
- <span>共计金额：</span>{{ $numberFormat(info.payAmt) }}元
|
|
|
</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
|
|
|
<!-- 发货 -->
|
|
|
<send-goods
|
|
|
@@ -188,14 +167,16 @@
|
|
|
@close="close"
|
|
|
/>
|
|
|
|
|
|
+
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
-import { orderDetail, boxList } from "@/api/business/order";
|
|
|
-import { publicFileGetUrl } from "@/api/common";
|
|
|
-import { accMul } from "@/utils/util";
|
|
|
+import {orderDetail, boxList} from "@/api/business/order";
|
|
|
+import {publicFileGetUrl} from "@/api/common";
|
|
|
+import {accMul} from "@/utils/util";
|
|
|
import SendGoods from "./components/SendGoods";
|
|
|
import ExpressEdit from "./components/ExpressEdit";
|
|
|
+
|
|
|
export default {
|
|
|
name: "ChannelDetail",
|
|
|
components: {
|
|
|
@@ -238,14 +219,14 @@ export default {
|
|
|
methods: {
|
|
|
// 盲票组列表
|
|
|
getChannelList(row) {
|
|
|
- boxList({ orderId: this.orderId }).then((res) => {
|
|
|
+ boxList({orderId: this.orderId}).then((res) => {
|
|
|
this.boxData = res.data;
|
|
|
});
|
|
|
},
|
|
|
|
|
|
// 订单详情
|
|
|
getDetail() {
|
|
|
- orderDetail({ orderId: this.orderId }).then((res) => {
|
|
|
+ orderDetail({orderId: this.orderId}).then((res) => {
|
|
|
if (res.code == 0) {
|
|
|
this.info = res.data;
|
|
|
this.status = JSON.parse(res.data.status);
|
|
|
@@ -279,15 +260,26 @@ export default {
|
|
|
};
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
+.title {
|
|
|
+ line-height: 30px;
|
|
|
+}
|
|
|
+.edit-express {
|
|
|
+ color: #409eff;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
.info {
|
|
|
margin-bottom: 10px;
|
|
|
+
|
|
|
&-title {
|
|
|
font-size: 14px;
|
|
|
margin-bottom: 10px;
|
|
|
font-weight: bold;
|
|
|
}
|
|
|
+
|
|
|
&-item {
|
|
|
padding-left: 50px;
|
|
|
+
|
|
|
&-content {
|
|
|
display: flex;
|
|
|
|
|
|
@@ -297,7 +289,7 @@ export default {
|
|
|
|
|
|
.title {
|
|
|
line-height: 22px;
|
|
|
- width: 100px;
|
|
|
+ //width: 100px;
|
|
|
}
|
|
|
|
|
|
.edit-express {
|
|
|
@@ -307,13 +299,15 @@ export default {
|
|
|
|
|
|
.txt {
|
|
|
line-height: 22px;
|
|
|
- width: 200px;
|
|
|
+ //width: 200px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
&-amt {
|
|
|
margin-top: 10px;
|
|
|
+
|
|
|
&-price {
|
|
|
span {
|
|
|
display: inline-block;
|
|
|
@@ -323,9 +317,11 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
.flex {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
+
|
|
|
.txt {
|
|
|
margin-left: 20px;
|
|
|
}
|
