作者 guosheng
1 个管道 的构建 通过 耗费 5 秒

个人中心我的订单退款、取消、付款流程调试

@@ -9,6 +9,7 @@ use app\admin\model\Vipdesc; @@ -9,6 +9,7 @@ use app\admin\model\Vipdesc;
9 use app\common\controller\Frontend; 9 use app\common\controller\Frontend;
10 use app\index\model\Goodscollect; 10 use app\index\model\Goodscollect;
11 use app\index\model\OrderInfo; 11 use app\index\model\OrderInfo;
  12 +use app\index\model\OrderRefund;
12 use app\index\model\Price; 13 use app\index\model\Price;
13 use app\index\model\Store; 14 use app\index\model\Store;
14 use app\index\model\Storecollect; 15 use app\index\model\Storecollect;
@@ -104,6 +105,10 @@ class Member extends Frontend @@ -104,6 +105,10 @@ class Member extends Frontend
104 '4' => '待评价', 105 '4' => '待评价',
105 '5' => '售后', 106 '5' => '售后',
106 '6' => '已完成', 107 '6' => '已完成',
  108 + '7' => '已取消',
  109 + '8' => '退款中',
  110 + '9' => '已退款',
  111 + '10' => '已删除',
107 ]; 112 ];
108 foreach ($list as $k=>$v) { 113 foreach ($list as $k=>$v) {
109 $order[$k]['store_name'] = $store_model->where('id',$v['store_id'])->value('name'); 114 $order[$k]['store_name'] = $store_model->where('id',$v['store_id'])->value('name');
@@ -157,10 +162,137 @@ class Member extends Frontend @@ -157,10 +162,137 @@ class Member extends Frontend
157 case '8': 162 case '8':
158 $operate = '<button type="button" class="btn operateBtn operateBtnGrey detail">查看订单</button>'; 163 $operate = '<button type="button" class="btn operateBtn operateBtnGrey detail">查看订单</button>';
159 break; 164 break;
  165 + case '9':
  166 + $operate = '<button type="button" class="btn operateBtn operateBtnGrey detail">查看订单</button>';
  167 + break;
  168 + case '10':
  169 + $operate = '<button type="button" class="btn operateBtn operateBtnGrey detail">查看订单</button>';
  170 + break;
160 } 171 }
161 return $operate; 172 return $operate;
162 } 173 }
163 174
  175 + // 付款
  176 + public function topay() {
  177 + if($this->request->isAjax()) {
  178 + $param = $this->request->param();
  179 + $order_detail_model = new \app\index\model\OrderDetail();
  180 + $where = [
  181 + 'id' => $param['order_id']
  182 + ];
  183 + $order = $order_detail_model
  184 + ->where($where)
  185 + ->find();
  186 + if(!$order) {
  187 + $this->error('订单不存在');
  188 + }
  189 + if($order['status'] != 1) {
  190 + $this->error('当前订单状态无法付款');
  191 + }
  192 + $return = [
  193 + 'pay_type' => $order['pay_type'],
  194 + 'order_id'=>$param['order_id'],
  195 + 'url'=>url("index/order/pay",array('order_id'=>$param['order_id']),false,true)
  196 + ];
  197 + $this->success('SUCCESS','',$return);
  198 + }
  199 + }
  200 +
  201 + // 取消订单
  202 + public function cancel_submit() {
  203 + if($this->request->isAjax()) {
  204 + $param = $this->request->param();
  205 + $order_detail_model = new \app\index\model\OrderDetail();
  206 + $where = [
  207 + 'id' => $param['order_id']
  208 + ];
  209 + $order = $order_detail_model
  210 + ->where($where)
  211 + ->find();
  212 + if(!$order) {
  213 + $this->error('订单不存在');
  214 + }
  215 + if($order['status'] != 1) {
  216 + $this->error('当前订单状态无法取消');
  217 + }
  218 + // 修改订单状态
  219 + $result_order = $order_detail_model->save(['status'=>7],['id'=>$param['order_id']]);
  220 + if(!$result_order) {
  221 + $this->error('订单取消失败');
  222 + }
  223 + $this->success('订单取消成功');
  224 + }
  225 + }
  226 +
  227 + // 退款
  228 + public function refund() {
  229 + $order_id = $this->request->param('order_id');
  230 + $order_detail_model = new \app\index\model\OrderDetail();
  231 + $order_info_model = new OrderInfo();
  232 + $store_model = new Store();
  233 + $where = [
  234 + 'id' => $order_id
  235 + ];
  236 + $order = $order_detail_model
  237 + ->where($where)
  238 + ->find();
  239 + $status = [
  240 + '1' => '待支付',
  241 + '2' => '待发货',
  242 + '3' => '待收货',
  243 + '4' => '待评价',
  244 + '5' => '售后',
  245 + '6' => '已完成',
  246 + '7' => '已取消',
  247 + '8' => '退款中',
  248 + '9' => '已退款',
  249 + '10' => '已删除',
  250 + ];
  251 + $order['store_name'] = $store_model->where('id',$order['store_id'])->value('name');
  252 + $order['goods'] = $order_info_model->where('order_id',$order['id'])->select();
  253 + $order['status'] = $status[$order['status']];
  254 + $this->view->assign('order',$order);
  255 + return $this->view->fetch();
  256 + }
  257 +
  258 + // 提交退款申请
  259 + public function refund_submit() {
  260 + if($this->request->isAjax()) {
  261 + $param = $this->request->param();
  262 + $order_detail_model = new \app\index\model\OrderDetail();
  263 + $where = [
  264 + 'id' => $param['order_id']
  265 + ];
  266 + $order = $order_detail_model
  267 + ->where($where)
  268 + ->find();
  269 + if(!$order) {
  270 + $this->error('订单不存在');
  271 + }
  272 + if(!in_array($order['status'],['2','3'])) {
  273 + $this->error('当前订单状态无法退款');
  274 + }
  275 + Db::startTrans();
  276 + // 记录退款申请
  277 + $order_refund_model = new OrderRefund();
  278 + $insert = [
  279 + 'order_id' => $param['order_id'],
  280 + 'user_id' => $this->auth->id,
  281 + 'content' => $param['content'],
  282 + 'images' => $param['images']
  283 + ];
  284 + $result_refund = $order_refund_model->isUpdate(false)->save($insert);
  285 + // 修改订单状态
  286 + $result_order = $order_detail_model->save(['status'=>8],['id'=>$param['order_id']]);
  287 + if(!$result_refund || !$result_order) {
  288 + Db::rollback();
  289 + $this->error('退款申请失败');
  290 + }
  291 + Db::commit();
  292 + $this->success('退款申请成功');
  293 + }
  294 + }
  295 +
164 // 我的会员 296 // 我的会员
165 public function member() 297 public function member()
166 { 298 {
  1 +<?php
  2 +
  3 +
  4 +namespace app\index\model;
  5 +
  6 +
  7 +use think\Model;
  8 +
  9 +class OrderRefund extends Model
  10 +{
  11 +
  12 + // 自动写入时间戳字段
  13 + protected $autoWriteTimestamp = 'int';
  14 +
  15 + // 定义时间戳字段名
  16 + protected $createTime = 'createtime';
  17 + protected $updateTime = 'updatetime';
  18 +}
@@ -713,6 +713,97 @@ @@ -713,6 +713,97 @@
713 left: 0; 713 left: 0;
714 } 714 }
715 </style> 715 </style>
  716 + <style>
  717 + #payModal{
  718 + display: none;
  719 + }
  720 + .modal-box {
  721 + width: 716px;
  722 + height: 438px;
  723 + top: 25%;
  724 + left: 50%;
  725 + transform: translateX(-50%);
  726 + z-index: 666;
  727 + overflow: hidden;
  728 + position: fixed;
  729 + border: 6px solid #bbb;
  730 + background-color: #fff;
  731 + -webkit-animation: scale-in both cubic-bezier(.4, 0, 0, 1.5) .3s;
  732 + animation: scale-in both cubic-bezier(.4, 0, 0, 1.5) .3s;
  733 + }
  734 + .modal-left {
  735 + float: left;
  736 + width: 333px;
  737 + padding: 20px 50px 25px 45px;
  738 + }
  739 + #payModal .modal-qrcode {
  740 + width: 210px;
  741 + height: 210px;
  742 + display: block;
  743 + margin: 0 auto 20px;
  744 + }
  745 + .icon-qrcode {
  746 + width: 16px;
  747 + height: 16px;
  748 + margin-right: 3px;
  749 + position: relative;
  750 + display: inline-block;
  751 + vertical-align: middle;
  752 + background-position: 0 -88px;
  753 + }
  754 + .modal-left .icon {
  755 + font-size: 0;
  756 + background-image: url(https://mpay.meituan.com/resource/cashier/img/icon-common@2x.rcJBe.png);
  757 + background-size: 168px;
  758 + }
  759 + #payModal .modal-info {
  760 + color: #f80;
  761 + font-size: 12px;
  762 + padding: 13px 0;
  763 + text-align: center;
  764 + background-color: #f7f7f7;
  765 + }
  766 + .modal-right {
  767 + float: left;
  768 + }
  769 + #payModal p{
  770 + font-size: 18px;
  771 + text-align: center;
  772 + line-height: 32px;
  773 + margin-bottom: 16px;
  774 + }
  775 + #payModal .orange {
  776 + color: #f80;
  777 + }
  778 + #payModal .modal-qr{
  779 + padding-top: 20px;
  780 + border: 1px solid #ddd;
  781 + }
  782 + .icon-clock {
  783 + width: 12px;
  784 + height: 12px;
  785 + margin-right: 5px;
  786 + }
  787 + .icon-close {
  788 + top: 13px;
  789 + right: 13px;
  790 + width: 13px;
  791 + height: 13px;
  792 + z-index: 5;
  793 + cursor: pointer;
  794 + position: absolute;
  795 + background-position: -17px -88px;
  796 + }
  797 + .modal-right .icon {
  798 + font-size: 0;
  799 + background-image: url(https://mpay.meituan.com/resource/cashier/img/icon-common@2x.rcJBe.png);
  800 + background-size: 168px;
  801 + }
  802 + #payModal .model-right img {
  803 + width: 371px;
  804 + height: 438px;
  805 + }
  806 + </style>
716 </head> 807 </head>
717 <body> 808 <body>
718 <!--公共头部--> 809 <!--公共头部-->
@@ -1473,6 +1564,34 @@ @@ -1473,6 +1564,34 @@
1473 </div> 1564 </div>
1474 </div> 1565 </div>
1475 {include file="public/footer"} 1566 {include file="public/footer"}
  1567 +<!--begin:提示弹层-->
  1568 +<div class="toast">提示框</div>
  1569 +<div class="bg"></div>
  1570 +<!--支付窗口-->
  1571 +<div id="payModal">
  1572 + <div class="modal-box">
  1573 + <div class="modal-left">
  1574 + <p>
  1575 + <span>请使用 </span>
  1576 + <span class="orange">微信 </span>
  1577 + <i class="icon icon-qrcode"></i>
  1578 + <span class="orange"> 扫一扫</span><br>扫描二维码支付
  1579 + </p>
  1580 + <div class="modal-qr">
  1581 + <img class="modal-qrcode"
  1582 + src=""
  1583 + alt="您的浏览器版本太低, 请升级您的浏览器">
  1584 + <div class="modal-info">
  1585 + <img class="icon-clock" src="__CDN__/assets/store/images/clock.png">
  1586 + <span>二维码有效时长为2小时, 请尽快支付</span>
  1587 + </div>
  1588 + </div>
  1589 + </div>
  1590 + <div class="modal-right"><i class="icon icon-close"></i><img
  1591 + src="https://mpay.meituan.com/resource/cashier/img/weixin-qrcode.1xf1oN.jpg" alt="微信扫码">
  1592 + </div>
  1593 + </div>
  1594 +</div>
1476 <script> 1595 <script>
1477 var status = 0; 1596 var status = 0;
1478 var id = 'allOrder'; 1597 var id = 'allOrder';
@@ -1612,7 +1731,39 @@ @@ -1612,7 +1731,39 @@
1612 }); 1731 });
1613 } 1732 }
1614 1733
1615 - //付款 1734 + // 付款
  1735 + $('.order_inform').on('click','.topay',function () {
  1736 + var order_id = $(this).parent().data('order_id');
  1737 + var data = {
  1738 + order_id: order_id
  1739 + };
  1740 + $.ajax({
  1741 + type: "post",
  1742 + url: "{:url('topay')}",
  1743 + data: data,
  1744 + dataType: "json",
  1745 + success: function (e) {
  1746 + if(e.code == 1) {
  1747 + if(e.data.pay_type == 1){
  1748 + //微信支付
  1749 + order_id = e.data.order_id;
  1750 + $('#payModal').show();
  1751 + $('.modal-left .modal-qrcode').attr('src',e.data.url);
  1752 + }else if(e.data.pay_type == 2){
  1753 + //支付宝支付
  1754 + order_id = e.data.order_id;
  1755 + window.open(e.data.url);
  1756 + }
  1757 + } else {
  1758 + toast(e.msg);
  1759 + }
  1760 + },
  1761 + error: function (e) {
  1762 + console.log(e);
  1763 + toast('网络错误,请重试');
  1764 + }
  1765 + });
  1766 + });
1616 function payment() { 1767 function payment() {
1617 $.message({ 1768 $.message({
1618 message: '此处调用付款方法', 1769 message: '此处调用付款方法',
@@ -1626,11 +1777,50 @@ @@ -1626,11 +1777,50 @@
1626 } 1777 }
1627 1778
1628 //取消订单 1779 //取消订单
1629 - function cancelOrder() {  
1630 - $.message({  
1631 - message: '此处调用取消订单方法',  
1632 - type: 'success' 1780 + $('.order_inform').on('click','.cancel',function () {
  1781 + var order_id = $(this).parent().data('order_id');
  1782 + var data = {
  1783 + order_id: order_id
  1784 + };
  1785 + $.ajax({
  1786 + type: "post",
  1787 + url: "{:url('cancel_submit')}",
  1788 + data: data,
  1789 + dataType: "json",
  1790 + success: function (e) {
  1791 + if(e.code == 1) {
  1792 + toast(e.msg,1000,1);
  1793 + } else {
  1794 + toast(e.msg);
  1795 + }
  1796 + },
  1797 + error: function (e) {
  1798 + console.log(e);
  1799 + toast('网络错误,请重试');
  1800 + }
1633 }); 1801 });
  1802 + });
  1803 +
  1804 + // 退款
  1805 + $('.order_inform').on('click','.refund',function () {
  1806 + var order_id = $(this).parent().data('order_id');
  1807 + var base_url = "{:url('refund')}";
  1808 + var base_arr = base_url.split('.');
  1809 + var url = base_arr[0] + '/order_id/' + order_id + '.' + base_arr[1];
  1810 + window.location.href = url;
  1811 + });
  1812 + //提示弹层
  1813 + function toast(msg='玩命加载中~',time=2000, reload = 0){
  1814 + $('.toast').text(msg);
  1815 + $('.toast').fadeToggle();
  1816 + $('.bg').show();
  1817 + setTimeout(function(){
  1818 + $('.toast').fadeToggle();
  1819 + $('.bg').hide();
  1820 + if(reload == 1) {
  1821 + location.reload();
  1822 + }
  1823 + },time);
1634 } 1824 }
1635 </script> 1825 </script>
1636 </body> 1826 </body>
  1 +<!DOCTYPE html>
  2 +<html lang="zh">
  3 +<head>
  4 + <meta charset="UTF-8">
  5 + <title>退款</title>
  6 + {include file="public/head"}
  7 + <style>
  8 + li{
  9 + list-style-type: none;
  10 + }
  11 + ul{
  12 + margin: 0;
  13 + }
  14 + .clear{
  15 + clear: both;
  16 + }
  17 + /*菜单样式*/
  18 + .content{
  19 + width: 100%;
  20 + font-size: 0;
  21 + background:rgba(249,249,249,1);
  22 + }
  23 + .content .navBarBox{
  24 + width: 100%;
  25 + height: 50px;
  26 + background: rgba(0,159,142,1);
  27 + }
  28 + .content .navBarBox ul{
  29 + width: 1200px;
  30 + height: 100%;
  31 + margin: 0 auto;
  32 + padding: 0;
  33 + font-size: 16px;
  34 + font-family: PingFangSC-Semibold;
  35 + color:rgba(255,255,255,1);
  36 + }
  37 + .content .navBarBox ul li{
  38 + width: 144px;
  39 + height: 100%;
  40 + line-height: 50px;
  41 + list-style-type: none;
  42 + float: left;
  43 + }
  44 + .content .navBarBox ul li a{
  45 + color: rgba(255,255,255,1);
  46 + }
  47 + .content .titleImgContent{
  48 + width: 100%;
  49 + height: 146px;
  50 + }
  51 + .content .titleImgContent img{
  52 + width: 100%;
  53 + height: 100%;
  54 + }
  55 + /*主要内容*/
  56 + .contentBox{
  57 + width: 100%;
  58 + background-color: #FFFFFF;
  59 + margin-top: 12px;
  60 + }
  61 + .contentMain{
  62 + margin: auto;
  63 + width: 1200px;
  64 + }
  65 + .contentTop{
  66 + padding: 20px 0 28px;
  67 + }
  68 + .titleText{
  69 + padding-left: 17px;
  70 + height:22px;
  71 + line-height:22px;
  72 + font-size:16px;
  73 + font-family:PingFang SC;
  74 + font-weight:800;
  75 + color:rgba(0,159,142,1);
  76 + vertical-align: middle;
  77 + }
  78 + .titleLine{
  79 + line-height: 20px;
  80 + display: inline-block;
  81 + width: 6px;
  82 + height:20px;
  83 + background:rgba(0,159,142,1);
  84 + opacity:1;
  85 + border-radius:2px;
  86 + vertical-align: middle;
  87 + }
  88 + .contentList{
  89 + background:rgba(249,249,249,1);
  90 + border-radius:8px;
  91 + margin-bottom: 12px;
  92 + }
  93 + /*商品信息*/
  94 + .detailHeader {
  95 + padding: 0 30px;
  96 + height: 60px;
  97 + line-height: 60px;
  98 + border-bottom: 1px solid rgba(238,238,238,1);
  99 + font-size:14px;
  100 + font-family:PingFang SC;
  101 + font-weight:500;
  102 + color:rgba(61,68,77,1)
  103 + }
  104 + .detailHeader li{
  105 + float: left;
  106 + }
  107 + .storeName{
  108 + padding-right: 40px;
  109 + font-weight:500;
  110 + }
  111 + .orderNum{
  112 + width: 227px;
  113 + }
  114 + .orderTime{
  115 + width: 218px;
  116 + }
  117 +
  118 + .orderNumTime{
  119 + font-weight:400;
  120 + padding: 0 40px;
  121 + overflow: hidden;/*超出部分隐藏*/
  122 + text-overflow:ellipsis;/* 超出部分显示省略号 */
  123 + white-space: nowrap;/*规定段落中的文本不进行换行 */
  124 + }
  125 + .detailTitle{
  126 + font-size:16px;
  127 + font-family:PingFang SC;
  128 + font-weight:500;
  129 + color:rgba(61,68,77,1);
  130 + width: 162px;
  131 + text-align: center;
  132 + vertical-align: middle;
  133 + }
  134 + .detailContent li{
  135 + display: inline-block;
  136 + }
  137 + .detailContent{
  138 + padding: 0 30px;
  139 + }
  140 + .goodsDesc {
  141 + width: 652px;
  142 + padding: 24px 24px 24px 0;
  143 + }
  144 + .goodsPic{
  145 + width: 72px;
  146 + height: 72px;
  147 + }
  148 + .goodsName{
  149 + margin-left: 15px;
  150 + font-weight:500;
  151 + color:rgba(91,94,99,1);
  152 + vertical-align: middle;
  153 + font-size:14px;
  154 + font-family:PingFang SC;
  155 + display: inline-block;
  156 + width: 196px;
  157 + }
  158 + /*退款原因*/
  159 + .refundReason{
  160 + height: 183px;
  161 + padding: 25px 30px;
  162 + }
  163 + .refundReasonLabel{
  164 + font-size:14px;
  165 + font-family:PingFang SC;
  166 + font-weight:500;
  167 + color:rgba(61,68,77,1);
  168 + }
  169 + .refundReasonTextarea{
  170 + padding: 6px 0;
  171 + border: 0!important;
  172 + box-shadow: none!important;
  173 + background-color: transparent!important;
  174 + resize: none;
  175 + }
  176 + /*输入框中placeholer文字颜色*/
  177 + .refundReasonTextarea::-webkit-input-placeholder { /* WebKit browsers */
  178 + font-size:14px;
  179 + font-family:PingFang SC;
  180 + font-weight:500;
  181 + color:rgba(140,145,152,1)
  182 + }
  183 + .refundReasonTextarea:-moz-placeholder{ /* Mozilla Firefox 4 to 18 */
  184 + font-size:14px;
  185 + font-family:PingFang SC;
  186 + font-weight:500;
  187 + color:rgba(140,145,152,1)
  188 + }
  189 + .refundReasonTextarea::-moz-placeholder{ /* Mozilla Firefox 19+ */
  190 + font-size:14px;
  191 + font-family:PingFang SC;
  192 + font-weight:500;
  193 + color:rgba(140,145,152,1)
  194 + }
  195 + .refundReasonTextarea:-ms-input-placeholder { /* Internet Explorer 10+ */
  196 + font-size:14px;
  197 + font-family:PingFang SC;
  198 + font-weight:500;
  199 + color:rgba(140,145,152,1)
  200 + }
  201 + /*按钮样式*/
  202 + .refundBtn{
  203 + margin: 28px 0 98px;
  204 + background-color:rgba(0,159,142,1);
  205 + color: #fff;
  206 + width: 170px;
  207 + height: 52px;
  208 + font-size:16px;
  209 + font-family:PingFang SC;
  210 + font-weight:500;
  211 + color:rgba(255,255,255,1);
  212 + border: 0;
  213 + }
  214 + .refundBtn:hover,.refundBtn:visited,.refundBtn:focus{
  215 + color: #fff;
  216 + color:rgba(255,255,255,1);
  217 + border: 0;
  218 + }
  219 +
  220 + </style>
  221 + <style>
  222 + .box {
  223 + display: flex;
  224 + }
  225 + .imgClick {
  226 + width: 150px!important;
  227 + height: 96px!important;
  228 + font-size: 0;
  229 + position: relative;
  230 + background: url(/assets/store/images/idCardBoxFileupload.png) no-repeat;
  231 + }
  232 + .imgClick input {
  233 + width: 150px;
  234 + height: 96px;
  235 + opacity: 0;
  236 + position: absolute;
  237 + top: 0;
  238 + left: 0;
  239 + }
  240 + .images{
  241 + display: flex;
  242 + align-items: center;
  243 + flex-wrap: wrap;
  244 + padding-left:0!important;
  245 + padding-right: 0!important;
  246 + }
  247 + .imagesItem{
  248 + width:150px!important;
  249 + height:96px!important;
  250 + font-size: 0;
  251 + display:flex;
  252 + align-items: center;
  253 + position: relative;
  254 + padding: 0 10px 0 0!important;
  255 + }
  256 + .imagesItem img{
  257 + width:100%;
  258 + height:100%;
  259 + }
  260 + .closeImage{
  261 + position: absolute;
  262 + top: -5px;
  263 + right: 5px;
  264 + width: 18px!important;
  265 + height: 18px!important;
  266 + background: rgba(197, 197, 197, 1);
  267 + border-radius: 50%;
  268 + padding: 0!important;
  269 + font-size: 16px;
  270 + text-align: center;
  271 + line-height: 18px;
  272 + color: #efefef;
  273 + font-style: normal;
  274 + cursor: pointer;
  275 + z-index: 777;
  276 + }
  277 + </style>
  278 +</head>
  279 +<body>
  280 +{include file="public/header"}
  281 +<!--主要内容-->
  282 +<div class="content">
  283 + {include file="public/nav"}
  284 + <!--主要内容-->
  285 + <div class="contentBox">
  286 + <div class="contentMain">
  287 + <div class="contentTop">
  288 + <span class="titleLine"></span>
  289 + <span class="titleText">
  290 + 退款申请
  291 + </span>
  292 + </div>
  293 + <!--商品信息-->
  294 + <div class="contentList">
  295 + <ul class="detailHeader">
  296 + <li class="storeName">
  297 + {$order.store_name}
  298 + </li>
  299 + <li class="orderNumTime orderNum">
  300 + 订单号:{$order.num}
  301 + </li>
  302 + <li class="orderNumTime orderTime">
  303 + {$order.createtime}
  304 + </li>
  305 + <li class="detailTitle">
  306 + 数量
  307 + </li>
  308 + <li class="detailTitle">
  309 + 金额
  310 + </li>
  311 + <li class="detailTitle">
  312 + 订单状态
  313 + </li>
  314 + <div class="clear">
  315 +
  316 + </div>
  317 + </ul>
  318 + {volist name="order.goods" id="vo"}
  319 + <ul class="detailContent">
  320 + <li class="goodsDesc">
  321 + <img class="goodsPic" src="{$vo.goods_image}" alt="">
  322 + <span class="goodsName">{$vo.goodsname}</span>
  323 + </li>
  324 + <li class="detailTitle">
  325 + ×{$vo.number}
  326 + </li>
  327 + <li class="detailTitle">
  328 + ¥{$vo.goods_price}
  329 + </li>
  330 + <li class="detailTitle">
  331 + {$order.status}
  332 + </li>
  333 + <div class="clear">
  334 +
  335 + </div>
  336 + </ul>
  337 + {/volist}
  338 + </div>
  339 + <!--退款原因-->
  340 + <div class="contentList refundReason">
  341 + <p class="refundReasonLabel">退款原因</p>
  342 + <textarea rows="5" class="form-control refundReasonTextarea" placeholder="请输入退款原因"></textarea>
  343 + </div>
  344 + <!--上传凭证-->
  345 + <div class="contentList">
  346 + <div class="detailHeader">
  347 + 上传凭证
  348 + </div>
  349 + <div class="detailContent">
  350 + <div class="box">
  351 + <div class="images"></div>
  352 + <div class="imgClick">
  353 + <input type="file" name="file" multiple id="refundBox"/>
  354 + </div>
  355 + </div>
  356 + </div>
  357 + </div>
  358 + <button type="button" class="btn refundBtn">提交申请</button>
  359 + </div>
  360 + </div>
  361 +</div>
  362 +{include file="public/footer"}
  363 +<!--begin:提示弹层-->
  364 +<div class="toast">提示框</div>
  365 +<div class="bg"></div>
  366 +<script>
  367 + var img = [];
  368 + //上传手持身份证照片
  369 + $('body').on('change', '#refundBox', function () {
  370 + var self = $(this);
  371 + var filePath = self.val();
  372 + var fileFormat = filePath.substring(filePath.lastIndexOf(".")).toLowerCase();
  373 + console.log(filePath);
  374 + // 检查是否是图片
  375 + if (filePath == '') {
  376 + toast('未选择任何图片');
  377 + return false;
  378 + }
  379 + if (!fileFormat.match(/.png|.jpg|.jpeg/)) {
  380 + toast('上传错误,文件格式必须为:png/jpg/jpeg');
  381 + return false;
  382 + }
  383 + var files = this.files;
  384 + upload(files,self);
  385 + });
  386 + //上传图片
  387 + function upload(files,self){
  388 + $(files).each(function (key, file) {
  389 + console.log(file);
  390 + var formdata = new FormData();
  391 + formdata.append("file", file);
  392 + $.ajax({
  393 + url: "{:url('api/common/upload')}",
  394 + type: "POST",
  395 + data: formdata,
  396 + cache: false,
  397 + processData: false, // 不处理发送的数据,因为data值是Formdata对象,不需要对数据做处理
  398 + contentType: false, // 不设置Content-type请求头
  399 + success: function (res) {
  400 + console.log(res);
  401 + if (res.code == 1) {
  402 + var html = '<div class="imagesItem">\n' +
  403 + ' <img src="'+res.data.url+'" alt="">\n' +
  404 + ' <div class="closeImage">×</div>\n' +
  405 + ' </div>';
  406 + img.push(res.data.url);
  407 + self.parent().prev().append(html);
  408 + // idCardImgFileArr.push(res.data.url);
  409 + }
  410 + },
  411 + error: function(res){
  412 + toast('与服务器断开连接');
  413 + }
  414 + });
  415 + });
  416 + }
  417 + //删除图片
  418 + $('.images').on('click', '.closeImage', function () {
  419 + $(this).parent().remove();
  420 + var src = $(this).prev().attr('src');
  421 + var pos = $.inArray(src,img);
  422 + img.splice(pos,1);
  423 + console.log(img);
  424 + });
  425 + // 提交退款申请
  426 + $('.refundBtn').click(function () {
  427 + var content = $('.refundReasonTextarea').val();
  428 + var images = img.join(',');
  429 + if(content.length == 0) {
  430 + toast('请填写退款原因');
  431 + }
  432 + if(img.length == 0) {
  433 + toast('请上传凭证');
  434 + }
  435 + var data = {
  436 + order_id: "{$order.id}",
  437 + content: content,
  438 + images: images
  439 + };
  440 + $.ajax({
  441 + type: "post",
  442 + url: "{:url('refund_submit')}",
  443 + data: data,
  444 + dataType: "json",
  445 + success: function (e) {
  446 + if(e.code == 1) {
  447 + toast(e.msg);
  448 + } else {
  449 + toast(e.msg);
  450 + }
  451 + },
  452 + error: function (e) {
  453 + console.log(e);
  454 + toast('网络错误,请重试');
  455 + }
  456 + });
  457 + });
  458 + //提示弹层
  459 + function toast(msg='玩命加载中~',time=2000, location = 0){
  460 + $('.toast').text(msg);
  461 + $('.toast').fadeToggle();
  462 + $('.bg').show();
  463 + setTimeout(function(){
  464 + $('.toast').fadeToggle();
  465 + $('.bg').hide();
  466 + if(location == 1) {
  467 + history.back(-1);
  468 + }
  469 + },time);
  470 + }
  471 +</script>
  472 +</body>
  473 +</html>
@@ -698,15 +698,6 @@ @@ -698,15 +698,6 @@
698 支付宝 698 支付宝
699 </div> 699 </div>
700 </li> 700 </li>
701 - <li onclick="changePayMode(this,'yunPay')">  
702 - <div class="imgBox">  
703 - <img class="checkImg" src="__CDN__/assets/store/images/radioUnSelect.png" alt="img">  
704 - </div>  
705 - <div class="contentBox">  
706 - <img src="__CDN__/assets/store/images/yunshanfu.png" alt="img">  
707 - 云闪付  
708 - </div>  
709 - </li>  
710 </ul> 701 </ul>
711 </div> 702 </div>
712 703