|
|
@@ -62,105 +62,155 @@
|
|
|
<el-dialog
|
|
|
title="订单详情"
|
|
|
:visible.sync="detailModalVisible"
|
|
|
- width="80%"
|
|
|
- z-index = "999"
|
|
|
- size="75%"
|
|
|
+ width="85%"
|
|
|
+ top="5vh"
|
|
|
+ class="clean-dialog"
|
|
|
>
|
|
|
-
|
|
|
- <div>
|
|
|
- <el-table style="height: 680px" v-loading="detailLoading" :data="orderDetails" border>
|
|
|
- <el-table-column label="订单号" align="center" prop="orderCode" width="200px" />
|
|
|
- <el-table-column label="所属公司" align="center" prop="companyName" />
|
|
|
- <el-table-column label="所属员工" align="center" prop="companyUserNickName" />
|
|
|
- <el-table-column label="用户昵称" align="center" prop="nickname" width="150px" >
|
|
|
- <template slot-scope="scope">
|
|
|
- <span>{{scope.row.nickname}} </span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="收件人" align="center" prop="realName" width="150px" >
|
|
|
- <template slot-scope="scope">
|
|
|
- <span>{{scope.row.realName}} </span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <!-- <el-table-column label="商品" align="center" width="300px" >
|
|
|
- <template slot-scope="scope">
|
|
|
- <div v-for="(item, index) in scope.row.items" class="items" >
|
|
|
- <img class="pic" :src="JSON.parse(item.jsonInfo).image" />
|
|
|
- <div class="goods-content">
|
|
|
- <div class="goods-title">{{ JSON.parse(item.jsonInfo).productName}}</div>
|
|
|
- <div class="sku">{{ JSON.parse(item.jsonInfo).sku}}</div>
|
|
|
- <div class="price">￥{{JSON.parse(item.jsonInfo).price}}×{{item.num}}</div>
|
|
|
- </div>
|
|
|
-
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-table-column> -->
|
|
|
- <el-table-column label="订单金额" align="center" prop="totalPrice" >
|
|
|
- <template slot-scope="scope">
|
|
|
- <span v-if="scope.row.totalPrice!=null">{{scope.row.totalPrice.toFixed(2)}}</span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="应付金额" align="center" prop="payPrice" >
|
|
|
- <template slot-scope="scope">
|
|
|
- <span v-if="scope.row.payPrice!=null">{{scope.row.payPrice.toFixed(2)}}</span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="下单时间" align="center" prop="createTime" />
|
|
|
- <!-- <el-table-column label="支付状态" align="center" prop="paid" /> -->
|
|
|
- <el-table-column label="支付时间" align="center" prop="payTime" width="180">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="支付方式" align="center" prop="payType" >
|
|
|
+ <div class="clean-container">
|
|
|
+ <el-table
|
|
|
+ :data="orderDetails"
|
|
|
+ border
|
|
|
+ style="width: 100%"
|
|
|
+ v-loading="detailLoading"
|
|
|
+ height="70vh"
|
|
|
+ class="clean-table"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ label="订单号"
|
|
|
+ align="center"
|
|
|
+ prop="orderCode"
|
|
|
+ width="180"
|
|
|
+ header-align="center"
|
|
|
+ />
|
|
|
+ <el-table-column
|
|
|
+ label="所属公司"
|
|
|
+ align="center"
|
|
|
+ prop="companyName"
|
|
|
+ header-align="center"
|
|
|
+ show-overflow-tooltip
|
|
|
+ />
|
|
|
+ <el-table-column
|
|
|
+ label="用户/收件人"
|
|
|
+ align="center"
|
|
|
+ header-align="center"
|
|
|
+ width="150"
|
|
|
+ >
|
|
|
<template slot-scope="scope">
|
|
|
- <el-tag prop="payType" v-for="(item, index) in payTypeOptions" v-if="scope.row.payType==item.dictValue">{{item.dictLabel}}</el-tag>
|
|
|
+ <div class="compact-cell">
|
|
|
+ <div>{{ scope.row.nickname || '-' }}</div>
|
|
|
+ <div class="secondary-text">{{ scope.row.realName || '-' }}</div>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="订单类型" align="center" prop="orderType" >
|
|
|
+ <el-table-column
|
|
|
+ label="金额(元)"
|
|
|
+ align="center"
|
|
|
+ header-align="center"
|
|
|
+ width="150"
|
|
|
+ >
|
|
|
<template slot-scope="scope">
|
|
|
- <el-tag prop="status" v-for="(item, index) in orderTypeOptions" v-if="scope.row.orderType==item.dictValue">{{item.dictLabel}}</el-tag>
|
|
|
+ <div class="compact-cell">
|
|
|
+ <div>总价: {{ scope.row.totalPrice ? scope.row.totalPrice.toFixed(2) : '0.00' }}</div>
|
|
|
+ <div>实付: {{ scope.row.payPrice ? scope.row.payPrice.toFixed(2) : '0.00' }}</div>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="状态" align="center" prop="status" >
|
|
|
+ <el-table-column
|
|
|
+ label="时间"
|
|
|
+ align="center"
|
|
|
+ header-align="center"
|
|
|
+ width="220"
|
|
|
+ >
|
|
|
<template slot-scope="scope">
|
|
|
- <el-tag prop="status" v-for="(item, index) in statusOptions" v-if="scope.row.status==item.dictValue">{{item.dictLabel}}</el-tag>
|
|
|
+ <div class="compact-cell">
|
|
|
+ <div>{{ scope.row.createTime }}</div>
|
|
|
+ <div class="secondary-text">{{ scope.row.payTime || '未支付' }}</div>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="物流状态" align="center" prop="deliveryStatus" >
|
|
|
+ <el-table-column
|
|
|
+ label="支付/类型"
|
|
|
+ align="center"
|
|
|
+ header-align="center"
|
|
|
+ width="150"
|
|
|
+ >
|
|
|
<template slot-scope="scope">
|
|
|
- <el-tag prop="status" v-for="(item, index) in deliveryStatusOptions" v-if="scope.row.deliveryStatus==item.dictValue">{{item.dictLabel}}</el-tag>
|
|
|
+ <div class="compact-cell">
|
|
|
+ <el-tag
|
|
|
+ size="small"
|
|
|
+ style="display:block;margin:0 auto 4px;width:fit-content"
|
|
|
+ v-for="item in payTypeOptions"
|
|
|
+ v-if="scope.row.payType==item.dictValue"
|
|
|
+ >{{item.dictLabel}}</el-tag>
|
|
|
+ <el-tag
|
|
|
+ size="small"
|
|
|
+ style="display:block;margin:0 auto;width:fit-content"
|
|
|
+ v-for="item in orderTypeOptions"
|
|
|
+ v-if="scope.row.orderType==item.dictValue"
|
|
|
+ >{{item.dictLabel}}</el-tag>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="物流结算状态" align="center" prop="deliveryPayStatus" >
|
|
|
+ <el-table-column
|
|
|
+ label="状态"
|
|
|
+ align="center"
|
|
|
+ header-align="center"
|
|
|
+ width="150"
|
|
|
+ >
|
|
|
<template slot-scope="scope">
|
|
|
- <el-tag prop="status" v-for="(item, index) in deliveryPayStatusOptions" v-if="scope.row.deliveryPayStatus==item.dictValue">{{item.dictLabel}}</el-tag>
|
|
|
+ <div class="compact-cell">
|
|
|
+ <el-tag
|
|
|
+ size="small"
|
|
|
+ style="display:block;margin:0 auto 4px;width:fit-content"
|
|
|
+ v-for="item in statusOptions"
|
|
|
+ v-if="scope.row.status==item.dictValue"
|
|
|
+ >{{item.dictLabel}}</el-tag>
|
|
|
+ <el-tag
|
|
|
+ size="small"
|
|
|
+ style="display:block;margin:0 auto;width:fit-content"
|
|
|
+ v-for="item in deliveryStatusOptions"
|
|
|
+ v-if="scope.row.deliveryStatus==item.dictValue"
|
|
|
+ >{{item.dictLabel}}</el-tag>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="操作" fixed="right" width="80px" align="center" class-name="small-padding fixed-width">
|
|
|
+ <el-table-column
|
|
|
+ label="操作"
|
|
|
+ fixed="right"
|
|
|
+ width="90"
|
|
|
+ align="center"
|
|
|
+ header-align="center"
|
|
|
+ >
|
|
|
<template slot-scope="scope">
|
|
|
<el-button
|
|
|
size="mini"
|
|
|
type="text"
|
|
|
+ style="color:#409EFF;padding:5px 0"
|
|
|
@click="handleDetails(scope.row)"
|
|
|
v-hasPermi="['store:storeOrder:query']"
|
|
|
- >查看</el-button>
|
|
|
+ >详情</el-button>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
- <pagination
|
|
|
- v-show="pagination.total>0"
|
|
|
- :total="pagination.total"
|
|
|
- :page.sync="pagination.currentPage"
|
|
|
- :limit.sync="pagination.pageSize"
|
|
|
- @pagination="fetchOrderDetails"
|
|
|
- />
|
|
|
- <el-drawer
|
|
|
- z-index = "999"
|
|
|
- size="75%"
|
|
|
- :title="show.title" :visible.sync="show.open"
|
|
|
- >
|
|
|
- <product-order ref="order" />
|
|
|
- </el-drawer>
|
|
|
+
|
|
|
+ <div style="margin-top:15px;text-align:center">
|
|
|
+ <pagination
|
|
|
+ v-show="pagination.total>0"
|
|
|
+ :total="pagination.total"
|
|
|
+ :page.sync="pagination.currentPage"
|
|
|
+ :limit.sync="pagination.pageSize"
|
|
|
+ @pagination="fetchOrderDetails"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
</div>
|
|
|
|
|
|
+ <el-drawer
|
|
|
+ :title="show.title"
|
|
|
+ :visible.sync="show.open"
|
|
|
+ size="65%"
|
|
|
+ >
|
|
|
+ <product-order ref="order" />
|
|
|
+ </el-drawer>
|
|
|
</el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
@@ -348,8 +398,7 @@ export default {
|
|
|
this.detailLoading = true;
|
|
|
try {
|
|
|
const params = {
|
|
|
- beginTime: this.formatDate(this.dateRange[0], 'yyyy-MM-dd'),
|
|
|
- endTime: this.formatDate(this.dateRange[1], 'yyyy-MM-dd'),
|
|
|
+ createTimeRange: this.formatDate(this.dateRange[0], 'yyyy-MM-dd')+"--"+this.formatDate(this.dateRange[1], 'yyyy-MM-dd'),
|
|
|
pageNum: this.pagination.currentPage,
|
|
|
pageSize: this.pagination.pageSize,
|
|
|
paid:1
|
|
|
@@ -418,10 +467,6 @@ export default {
|
|
|
margin-bottom: 10px;
|
|
|
}
|
|
|
|
|
|
-.statistic-compare {
|
|
|
- font-size: 12px;
|
|
|
- color: #666;
|
|
|
-}
|
|
|
|
|
|
.statistic-compare .up {
|
|
|
color: #f56c6c;
|
|
|
@@ -432,9 +477,18 @@ export default {
|
|
|
color: #67c23a;
|
|
|
margin-left: 5px;
|
|
|
}
|
|
|
-
|
|
|
-.pagination-container {
|
|
|
- margin-top: 20px;
|
|
|
- text-align: right;
|
|
|
+.clean-dialog {
|
|
|
+ border-radius: 8px;
|
|
|
+}
|
|
|
+.clean-table .el-table__header th {
|
|
|
+ background-color: #f8f8f9;
|
|
|
+}
|
|
|
+.compact-cell {
|
|
|
+ padding: 4px 0;
|
|
|
+ line-height: 1.4;
|
|
|
+}
|
|
|
+.secondary-text {
|
|
|
+ color: #909399;
|
|
|
+ font-size: 0.9em;
|
|
|
}
|
|
|
</style>
|
