BJ_ZTEITS-Developers / parking-cloud-yudao

Commit 964f8cb35bc5f1a8368142dbefab74678d1dd5a0

Authored by YunaiV
2 parents e95402ab b3cea2d4

Merge branch 'feature/1.8.0-uniapp' of https://gitee.com/zhijiantianya/ruoyi-vue… 

…-pro into feature/1.8.0-uniapp
Inline Side-by-side
Showing 4 changed files with 378 additions and 73 deletions
yudao-ui-admin/src/router/index.js
  View file @964f8cb
@@ -216,6 +216,12 @@ export const constantRoutes = [ @@ -216,6 +216,12 @@ export const constantRoutes = [
216 hidden: true, 216 hidden: true,
217 meta: { title: '订单详情' }, 217 meta: { title: '订单详情' },
218 component: (resolve) => require(['@/views/mall/trade/order/detail'], resolve) 218 component: (resolve) => require(['@/views/mall/trade/order/detail'], resolve)
  219 + },
  220 + {
  221 + path: '/mall/trade/orderrefund',
  222 + name: '退款维权',
  223 + meta: { title: '退款维权' },
  224 + component: (resolve) => require(['@/views/mall/trade/orderrefund'], resolve)
219 } 225 }
220 ] 226 ]
221 } 227 }
yudao-ui-admin/src/views/mall/trade/order/detail.vue
  View file @964f8cb
@@ -199,6 +199,16 @@ export default { @@ -199,6 +199,16 @@ export default {
199 name: 'Otic 巴拉啦小魔仙联名麦克风儿童早教家用一体卡拉OK宝宝话筒唱歌 魔仙粉', 199 name: 'Otic 巴拉啦小魔仙联名麦克风儿童早教家用一体卡拉OK宝宝话筒唱歌 魔仙粉',
200 count: 6, 200 count: 6,
201 imgUrl: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg' 201 imgUrl: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg'
  202 + },
  203 + {
  204 + name: 'Otic 巴拉啦小魔仙联名麦克风儿童早教家用一体卡拉OK宝宝话筒唱歌 魔仙粉',
  205 + count: 6,
  206 + imgUrl: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg'
  207 + },
  208 + {
  209 + name: 'Otic 巴拉啦小魔仙联名麦克风儿童早教家用一体卡拉OK宝宝话筒唱歌 魔仙粉',
  210 + count: 6,
  211 + imgUrl: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg'
202 } 212 }
203 ] 213 ]
204 }, 214 },
yudao-ui-admin/src/views/mall/trade/order/index.vue
  View file @964f8cb
@@ -63,70 +63,71 @@ @@ -63,70 +63,71 @@
63 </el-row> 63 </el-row>
64 64
65 <!-- tab切换--> 65 <!-- tab切换-->
66 - <el-radio-group v-model="activeTabName">  
67 - <el-radio-button v-for="tabPane in tabPanes" :label="tabPane.label">{{tabPane.text}}</el-radio-button>  
68 - </el-radio-group>  
69 -  
70 - <!-- table -->  
71 - <el-table :data="tableData" :show-header="false" class="order-table">  
72 - <el-table-column label="订单信息">  
73 - <template slot-scope="{ row }">  
74 - <el-row>  
75 - <el-col :span="5">  
76 - 订单号：{{row.orderNo}}  
77 - <el-popover title="支付流水号：" :content="row.payNo" ref="popover" placement="right" width="200" trigger="click"/>  
78 - <el-button type="text" v-popover:popover>更多</el-button>  
79 - </el-col>  
80 - <el-col :span="5">下单时间：{{row.time}}</el-col>  
81 - <el-col :span="4">订单来源：{{row.orderSource}}</el-col>  
82 - <el-col :span="4">支付方式：{{row.payWay}}</el-col>  
83 - <el-col :span="6" align="right" type="flex">  
84 - <el-button type="text">关闭订单</el-button>  
85 - <el-button type="text">修改地址</el-button>  
86 - <el-button type="text">调整价格</el-button>  
87 - <el-dropdown style="margin-left: 10px">  
88 - <el-button type="text">  
89 - 更多操作<i class="el-icon-arrow-down el-icon--right"></i>  
90 - </el-button>  
91 - <el-dropdown-menu slot="dropdown">  
92 - <el-dropdown-item><el-button type="text">打印发货单</el-button></el-dropdown-item>  
93 - <el-dropdown-item><el-button type="text" @click="goToDetail(row)">详情</el-button></el-dropdown-item>  
94 - <el-dropdown-item><el-button type="text">备注</el-button></el-dropdown-item>  
95 - </el-dropdown-menu>  
96 - </el-dropdown>  
97 - </el-col>  
98 - </el-row>  
99 - <!-- 订单下的商品 -->  
100 - <el-table :data="row.goods" border>  
101 - <el-table-column label="商品" prop="goods" header-align="center" width="360">  
102 - <template slot-scope="{ row, $index }">  
103 - <div class="goods-info">  
104 - <img :src="row.picture"/>  
105 - <span class="ellipsis-2" :title="row.name">{{row.name}}</span>  
106 - </div>  
107 - </template>  
108 - </el-table-column>  
109 - <el-table-column label="单价(元)/数量" prop="fee" align="center" width="115">  
110 - <template slot-scope="{ row }">  
111 - <div>{{row.price}}</div>  
112 - <div>{{row.count}}</div>  
113 - </template>  
114 - </el-table-column>  
115 - <el-table-column label="维权" prop="safeguard" align="center" width="115"/>  
116 - <el-table-column label="实付金额(元)" prop="amount" align="center" width="115"/>  
117 - <el-table-column label="买家/收货人" prop="buyer" header-align="center" width="360">  
118 - <template slot-scope="{ row }">  
119 - <div>{{row.buyer}}</div>  
120 - <div>{{row.receiver}}{{row.tel}}</div>  
121 - <div class="ellipsis-2" :title="row.address">{{row.address}}</div>  
122 - </template>  
123 - </el-table-column>  
124 - <el-table-column label="配送方式" prop="sendWay" align="center" width="115"/>  
125 - <el-table-column label="交易状态" prop="status" align="center"/>  
126 - </el-table>  
127 - </template>  
128 - </el-table-column>  
129 - </el-table> 66 + <el-tabs v-model="activeTabName" type="card">
  67 + <el-tab-pane v-for="tabPane in tabPanes" :label="tabPane.text" :name="tabPane.name">
  68 + <!-- table -->
  69 + <el-table :data="tableData" :show-header="false" class="order-table">
  70 + <el-table-column>
  71 + <template slot-scope="{ row }">
  72 + <el-row type="flex" align="middle">
  73 + <el-col :span="5">
  74 + 订单号：{{row.orderNo}}
  75 + <el-popover title="支付流水号：" :content="row.orderNo" placement="right" width="200" trigger="click">
  76 + <el-button slot="reference" type="text">更多</el-button>
  77 + </el-popover>
  78 + </el-col>
  79 + <el-col :span="5">下单时间：{{row.time}}</el-col>
  80 + <el-col :span="4">订单来源：{{row.orderSource}}</el-col>
  81 + <el-col :span="4">支付方式：{{row.payWay}}</el-col>
  82 + <el-col :span="6" align="right">
  83 + <el-button type="text">关闭订单</el-button>
  84 + <el-button type="text">修改地址</el-button>
  85 + <el-button type="text">调整价格</el-button>
  86 + <el-dropdown style="margin-left: 10px">
  87 + <el-button type="text">
  88 + 更多操作<i class="el-icon-arrow-down el-icon--right"></i>
  89 + </el-button>
  90 + <el-dropdown-menu slot="dropdown">
  91 + <el-dropdown-item><el-button type="text">打印发货单</el-button></el-dropdown-item>
  92 + <el-dropdown-item><el-button type="text" @click="goToDetail(row)">详情</el-button></el-dropdown-item>
  93 + <el-dropdown-item><el-button type="text">备注</el-button></el-dropdown-item>
  94 + </el-dropdown-menu>
  95 + </el-dropdown>
  96 + </el-col>
  97 + </el-row>
  98 + <!-- 订单下的商品 -->
  99 + <el-table :data="row.goods" border :show-header="true">
  100 + <el-table-column label="商品" prop="goods" header-align="center" width="auto" min-width="300">
  101 + <template slot-scope="{ row, $index }">
  102 + <div class="goods-info">
  103 + <img :src="row.picture"/>
  104 + <span class="ellipsis-2" :title="row.name">{{row.name}}</span>
  105 + </div>
  106 + </template>
  107 + </el-table-column>
  108 + <el-table-column label="单价(元)/数量" prop="fee" align="center" width="115">
  109 + <template slot-scope="{ row }">
  110 + <div>{{row.price}}</div>
  111 + <div>{{row.count}}</div>
  112 + </template>
  113 + </el-table-column>
  114 + <el-table-column label="维权" prop="safeguard" align="center" width="100"/>
  115 + <el-table-column label="实付金额(元)" prop="amount" align="center" width="100"/>
  116 + <el-table-column label="买家/收货人" prop="buyer" header-align="center" width="auto" min-width="300">
  117 + <template slot-scope="{ row }">
  118 + <div>{{row.buyer}}</div>
  119 + <div>{{row.receiver}}{{row.tel}}</div>
  120 + <div class="ellipsis-2" :title="row.address">{{row.address}}</div>
  121 + </template>
  122 + </el-table-column>
  123 + <el-table-column label="配送方式" prop="sendWay" align="center" width="100"/>
  124 + <el-table-column label="交易状态" prop="status" align="center" width="100"/>
  125 + </el-table>
  126 + </template>
  127 + </el-table-column>
  128 + </el-table>
  129 + </el-tab-pane>
  130 + </el-tabs>
130 </div> 131 </div>
131 </template> 132 </template>
132 133
@@ -234,14 +235,14 @@ @@ -234,14 +235,14 @@
234 }, 235 },
235 activeTabName: 'all', 236 activeTabName: 'all',
236 tabPanes: [ 237 tabPanes: [
237 - { text: '全部', label: 'all' },  
238 - { text: '待支付', label: 'toBePay' },  
239 - { text: '待发货', label: 'toBeSend' },  
240 - { text: '已发货', label: 'send' },  
241 - { text: '已收货', label: 'received' },  
242 - { text: '已完成', label: 'finished' },  
243 - { text: '已关闭', label: 'closed' },  
244 - { text: '退款中', label: 'refund' } 238 + { text: '全部', name: 'all' },
  239 + { text: '待支付', name: 'toBePay' },
  240 + { text: '待发货', name: 'toBeSend' },
  241 + { text: '已发货', name: 'send' },
  242 + { text: '已收货', name: 'received' },
  243 + { text: '已完成', name: 'finished' },
  244 + { text: '已关闭', name: 'closed' },
  245 + { text: '退款中', name: 'refund' }
245 ], 246 ],
246 tableData: [ 247 tableData: [
247 { 248 {
@@ -333,7 +334,6 @@ @@ -333,7 +334,6 @@
333 334
334 <style lang="scss" scoped> 335 <style lang="scss" scoped>
335 ::v-deep .order-table{ 336 ::v-deep .order-table{
336 - margin-top: 20px;  
337 border-bottom: none; 337 border-bottom: none;
338 &::before{ 338 &::before{
339 height: 0; 339 height: 0;
yudao-ui-admin/src/views/mall/trade/orderrefund/index.vue 0 → 100644
  View file @964f8cb
  1 +<template>
  2 + <div class="app-container">
  3 + <!-- 搜索工作栏 -->
  4 + <el-row :gutter="20">
  5 + <el-form :model="queryParams" label-width="68px" size="small">
  6 + <el-col :span="6" :xs="24">
  7 + <el-form-item label="商品名称">
  8 + <el-input v-model="queryParams.name" style="width: 240px"></el-input>
  9 + </el-form-item>
  10 + </el-col>
  11 + <el-col :span="6" :xs="24">
  12 + <el-form-item label="订单编号">
  13 + <el-input v-model="queryParams.No" style="width: 240px"></el-input>
  14 + </el-form-item>
  15 + </el-col>
  16 + <el-col :span="6" :xs="24">
  17 + <el-form-item label="退款编号">
  18 + <el-input v-model="queryParams.refundNo" style="width: 240px"></el-input>
  19 + </el-form-item>
  20 + </el-col>
  21 + <el-col :span="6" :xs="24">
  22 + <el-form-item label="退款状态">
  23 + <el-select v-model="queryParams.refundStatus" clearable style="width: 240px">
  24 + <el-option v-for="dict in dicData.refundStatus" v-bind="dict" :key="dict.value"/>
  25 + </el-select>
  26 + </el-form-item>
  27 + </el-col>
  28 + <el-col :span="6" :xs="24">
  29 + <el-form-item label="退款方式">
  30 + <el-select v-model="queryParams.refundWay" clearable style="width: 240px">
  31 + <el-option v-for="dict in dicData.refundWay" v-bind="dict" :key="dict.value"/>
  32 + </el-select>
  33 + </el-form-item>
  34 + </el-col>
  35 + <el-col :span="6" :xs="24">
  36 + <el-form-item label="维权类型">
  37 + <el-select v-model="queryParams.refundType" clearable style="width: 240px">
  38 + <el-option v-for="dict in dicData.refundType" v-bind="dict" :key="dict.value"/>
  39 + </el-select>
  40 + </el-form-item>
  41 + </el-col>
  42 + <el-col :span="6" :xs="24">
  43 + <el-form-item label="下单时间">
  44 + <el-date-picker v-model="queryParams.date" type="daterange" range-separator="至"
  45 + start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="rangePickerOptions" style="width: 240px"/>
  46 + </el-form-item>
  47 + </el-col>
  48 + <el-col :span="6" :xs="24" style="line-height: 32px">
  49 + <el-button type="primary" icon="el-icon-search" size="mini">搜索</el-button>
  50 + <el-button icon="el-icon-refresh" size="mini">重置</el-button>
  51 + <el-button icon="el-icon-document" size="mini">导出订单</el-button>
  52 + </el-col>
  53 + </el-form>
  54 + </el-row>
  55 +
  56 + <!-- tab切换-->
  57 + <el-tabs v-model="activeTabName" type="card">
  58 + <el-tab-pane v-for="tabPane in tabPanes" :label="tabPane.text" :name="tabPane.name">
  59 + <!-- table -->
  60 + <el-table :data="tableData" :show-header="false" class="table-wrapper">
  61 + <el-table-column>
  62 + <template slot-scope="{ row }">
  63 + <div class="table-header">
  64 + 退款编号：{{row.tkbh}}
  65 + <el-button type="text" style="margin-left: 10px">
  66 + 订单编号：{{row.ddbh}}
  67 + </el-button>
  68 + </div>
  69 + <!-- 订单下的商品 -->
  70 + <el-table :data="row.goods" border>
  71 + <el-table-column label="商品信息" prop="spxx" header-align="center" width="auto" min-width="300">
  72 + <div slot-scope="{ row, $index }" class="goods-info">
  73 + <img :src="row.img"/>
  74 + <span class="ellipsis-2" :title="row.name">{{row.name}}</span>
  75 + </div>
  76 + </el-table-column>
  77 + <el-table-column label="订单金额" prop="ddje" align="center" width="100"/>
  78 + <el-table-column label="买家" prop="mj" align="center" width="100"/>
  79 + <el-table-column label="退款金额" prop="tkje" align="center" width="100"/>
  80 + <el-table-column label="申请时间" prop="sqsj" align="center" width="180"/>
  81 + <el-table-column label="退款状态" prop="tkzt" align="center" width="100"/>
  82 + <el-table-column label="操作" align="center" width="100" fixed="right" >
  83 + <el-button slot-scope="{row}" type="text">详情</el-button>
  84 + </el-table-column>
  85 + </el-table>
  86 + </template>
  87 + </el-table-column>
  88 + </el-table>
  89 + </el-tab-pane>
  90 + </el-tabs>
  91 + </div>
  92 +</template>
  93 +
  94 +<script>
  95 +const dicData = {
  96 + refundStatus: [
  97 + { label: '全部', value: 'qb' },
  98 + { label: '申请维权', value: 'sqwq' },
  99 + { label: '待转账', value: 'dzz' },
  100 + { label: '维权结束', value: 'wqjs' },
  101 + { label: '买家待退货', value: 'mjdth' },
  102 + { label: '卖家待收货', value: 'mjdsh' },
  103 + { label: '卖家已收货', value: 'mjysh' },
  104 + { label: '卖家拒绝', value: 'mjjj' }
  105 + ],
  106 + refundWay: [
  107 + { label: '全部', value: 'qb' },
  108 + { label: '仅退款', value: 'jtk' },
  109 + { label: '退货退款', value: 'thtk' }
  110 + ],
  111 + refundType: [
  112 + { label: '全部', value: 'qb' },
  113 + { label: '订单退款', value: 'ddtk' },
  114 + { label: '售后退款', value: 'shtk' }
  115 + ]
  116 +}
  117 +const rangePickerOptions = {
  118 + shortcuts: [{
  119 + text: '最近一周',
  120 + onClick(picker) {
  121 + const end = new Date();
  122 + const start = new Date();
  123 + start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
  124 + picker.$emit('pick', [start, end]);
  125 + }
  126 + }, {
  127 + text: '最近一个月',
  128 + onClick(picker) {
  129 + const end = new Date();
  130 + const start = new Date();
  131 + start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
  132 + picker.$emit('pick', [start, end]);
  133 + }
  134 + }, {
  135 + text: '最近三个月',
  136 + onClick(picker) {
  137 + const end = new Date();
  138 + const start = new Date();
  139 + start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
  140 + picker.$emit('pick', [start, end]);
  141 + }
  142 + }]
  143 +}
  144 +export default {
  145 + name: "index",
  146 + data () {
  147 + return {
  148 + dicData,
  149 + rangePickerOptions,
  150 + queryParams: {},
  151 + activeTabName: 'all',
  152 + tabPanes: [
  153 + { text: '全部', name: 'all' },
  154 + { text: '申请维权', name: 'sqwq' },
  155 + { text: '待转账', name: 'dzz' },
  156 + { text: '维权结束', name: 'wqjs' },
  157 + { text: '买家待退货', name: 'mjdth' },
  158 + { text: '卖家待收货', name: 'mjdsh' },
  159 + { text: '卖家已收货', name: 'mjysh' },
  160 + { text: '卖家拒绝', name: 'mjjj' }
  161 + ],
  162 + tableData: [
  163 + {
  164 + tkbh: '20221026220424001',
  165 + ddbh: '20221026220424001',
  166 + goods: [
  167 + {
  168 + name: '颜衫短袖男polo衫夏季翻领衣服潮牌休闲上衣夏天翻领半袖男士t恤',
  169 + img: 'https://b2c-v5-yanshi.oss-cn-hangzhou.aliyuncs.com/upload/1/common/images/20220723/20220723115621165854858145027_SMALL.webp',
  170 + ddje: '199',
  171 + mj: '张三',
  172 + tkje: 460,
  173 + sqsj: '2022-11-19',
  174 + tkzt: '申请维权(仅退款)'
  175 + },
  176 + {
  177 + name: '颜衫短袖男polo衫夏季翻领衣服潮牌休闲上衣夏天翻领半袖男士t恤',
  178 + img: 'https://b2c-v5-yanshi.oss-cn-hangzhou.aliyuncs.com/upload/1/common/images/20220723/20220723115621165854858145027_SMALL.webp',
  179 + ddje: '199',
  180 + mj: '张三',
  181 + tkje: 460,
  182 + sqsj: '2022-11-19',
  183 + tkzt: '申请维权(仅退款)'
  184 + }
  185 + ]
  186 + },
  187 + {
  188 + tkbh: '20221026220424001',
  189 + ddbh: '20221026220424001',
  190 + goods: [
  191 + {
  192 + name: '颜衫短袖男polo衫夏季翻领衣服潮牌休闲上衣夏天翻领半袖男士t恤',
  193 + img: 'https://b2c-v5-yanshi.oss-cn-hangzhou.aliyuncs.com/upload/1/common/images/20220723/20220723115621165854858145027_SMALL.webp',
  194 + ddje: '199',
  195 + mj: '张三',
  196 + tkje: 460,
  197 + sqsj: '2022-11-19',
  198 + tkzt: '申请维权(仅退款)'
  199 + },
  200 + {
  201 + name: '颜衫短袖男polo衫夏季翻领衣服潮牌休闲上衣夏天翻领半袖男士t恤',
  202 + img: 'https://b2c-v5-yanshi.oss-cn-hangzhou.aliyuncs.com/upload/1/common/images/20220723/20220723115621165854858145027_SMALL.webp',
  203 + ddje: '199',
  204 + mj: '张三',
  205 + tkje: 460,
  206 + sqsj: '2022-11-19',
  207 + tkzt: '申请维权(仅退款)'
  208 + }
  209 + ]
  210 + },
  211 + {
  212 + tkbh: '20221026220424001',
  213 + ddbh: '20221026220424001',
  214 + goods: [
  215 + {
  216 + name: '颜衫短袖男polo衫夏季翻领衣服潮牌休闲上衣夏天翻领半袖男士t恤',
  217 + img: 'https://b2c-v5-yanshi.oss-cn-hangzhou.aliyuncs.com/upload/1/common/images/20220723/20220723115621165854858145027_SMALL.webp',
  218 + ddje: '199',
  219 + mj: '张三',
  220 + tkje: 460,
  221 + sqsj: '2022-11-19',
  222 + tkzt: '申请维权(仅退款)'
  223 + },
  224 + {
  225 + name: '颜衫短袖男polo衫夏季翻领衣服潮牌休闲上衣夏天翻领半袖男士t恤',
  226 + img: 'https://b2c-v5-yanshi.oss-cn-hangzhou.aliyuncs.com/upload/1/common/images/20220723/20220723115621165854858145027_SMALL.webp',
  227 + ddje: '199',
  228 + mj: '张三',
  229 + tkje: 460,
  230 + sqsj: '2022-11-19',
  231 + tkzt: '申请维权(仅退款)'
  232 + }
  233 + ]
  234 + }
  235 + ]
  236 + }
  237 + },
  238 + methods: {
  239 + goToDetail (row) {
  240 + this.$router.push({ path: '/mall/trade/order/detail', query: { orderNo: row.orderNo }})
  241 + }
  242 + }
  243 + }
  244 +</script>
  245 +
  246 +<style lang="scss" scoped>
  247 + ::v-deep .table-wrapper{
  248 + border-bottom: none;
  249 + &::before{
  250 + height: 0;
  251 + }
  252 + .table-header{
  253 + line-height: 36px;
  254 + }
  255 + .el-table__row{
  256 + .el-table__cell{
  257 + border-bottom: none;
  258 + .cell{
  259 + .el-table {
  260 + .el-table__row{
  261 + >.el-table__cell{
  262 + .goods-info{
  263 + display: flex;
  264 + img{
  265 + margin-right: 10px;
  266 + width: 60px;
  267 + height: 60px;
  268 + border: 1px solid #e2e2e2;
  269 + }
  270 + }
  271 + .ellipsis-2{
  272 + display: -webkit-box;
  273 + overflow: hidden;
  274 + text-overflow: ellipsis;
  275 + white-space: normal;
  276 + -webkit-line-clamp: 2; /* 要显示的行数 */
  277 + -webkit-box-orient: vertical;
  278 + word-break: break-all;
  279 + line-height: 22px !important;
  280 + max-height: 44px !important;
  281 + }
  282 + }
  283 + }
  284 + }
  285 + }
  286 + }
  287 + }
  288 + }
  289 +</style>