Authored by zhangxiaoru

editorial

@@ -9,7 +9,7 @@ @@ -9,7 +9,7 @@
9 <div class="footer"> 9 <div class="footer">
10 <span class="desc pay-notice left">{{../username}}如果<span class="blue">2小时</span>内您无法完成付款,系统会将您的订单取消</span> 10 <span class="desc pay-notice left">{{../username}}如果<span class="blue">2小时</span>内您无法完成付款,系统会将您的订单取消</span>
11 <span id="order-detail-ctrl" class="right order-detail-ctrl"> 11 <span id="order-detail-ctrl" class="right order-detail-ctrl">
12 - <em>展开详情</em> 12 + <em>收起详情</em>
13 <i class="iconfont down">&#xe616;</i> 13 <i class="iconfont down">&#xe616;</i>
14 <i class="iconfont up">&#xe617;</i> 14 <i class="iconfont up">&#xe617;</i>
15 </span> 15 </span>
@@ -2,6 +2,8 @@ var dialog = require('../../plugins/dialog'); @@ -2,6 +2,8 @@ var dialog = require('../../plugins/dialog');
2 var _dialog = dialog.Dialog; 2 var _dialog = dialog.Dialog;
3 var _alert = dialog.Alert; 3 var _alert = dialog.Alert;
4 4
  5 +var validate = require('../../me/order/validation');
  6 +
5 7
6 require('../../common/foreach-polyfill'); 8 require('../../common/foreach-polyfill');
7 9
@@ -29,10 +31,26 @@ function getTpl(data) { @@ -29,10 +31,26 @@ function getTpl(data) {
29 } 31 }
30 32
31 // 取消订单 33 // 取消订单
32 -function cancelOrder(code, onCancel) { 34 +function cancelOrder(code, onCancel, w) {
33 var $checked = $('.reason .row .checked'); 35 var $checked = $('.reason .row .checked');
34 var reason = $checked.next('.reason-text').text(); 36 var reason = $checked.next('.reason-text').text();
35 var reasonId = $checked.parent().data('value'); 37 var reasonId = $checked.parent().data('value');
  38 + var pass = true;
  39 +
  40 + if (reason === '其它' || reason === '其他') {
  41 + reason = $checked.siblings('.input').val();
  42 +
  43 + pass = validate.start('#other-reason', {
  44 + maxLength: 50,
  45 + errMsg: '原因最多50个字符'
  46 + });
  47 + }
  48 +
  49 + if (!pass) {
  50 + return false;
  51 + }
  52 +
  53 + w.close();
36 54
37 $.ajax({ 55 $.ajax({
38 url: '/me/cancelOrder', 56 url: '/me/cancelOrder',
@@ -82,8 +100,7 @@ function showDiaglog(tpl, code, onCancel) { @@ -82,8 +100,7 @@ function showDiaglog(tpl, code, onCancel) {
82 btnClass: ['confirm'], 100 btnClass: ['confirm'],
83 name: '确定并取消订单', 101 name: '确定并取消订单',
84 cb: function() { 102 cb: function() {
85 - cancelOrder(code, onCancel);  
86 - tip.close(); 103 + cancelOrder(code, onCancel, tip);
87 } 104 }
88 }, 105 },
89 { 106 {
@@ -104,7 +121,7 @@ function showDiaglog(tpl, code, onCancel) { @@ -104,7 +121,7 @@ function showDiaglog(tpl, code, onCancel) {
104 var $ele = $(ele); 121 var $ele = $(ele);
105 var $input = $('.cancel-dialog .reason input'); 122 var $input = $('.cancel-dialog .reason input');
106 123
107 - if (checked && $ele.parent('.other').length) { 124 + if (checked && $ele.hasClass('other')) {
108 $input.prop('disabled', false); 125 $input.prop('disabled', false);
109 $input.focus(); 126 $input.focus();
110 } else { 127 } else {
@@ -131,6 +148,13 @@ function getCancelReason(code, onCancel) { @@ -131,6 +148,13 @@ function getCancelReason(code, onCancel) {
131 if (idx === 0) { 148 if (idx === 0) {
132 d[0].checked = true; 149 d[0].checked = true;
133 } 150 }
  151 +
  152 + d.forEach(function(r) {
  153 + if (r.reason === '其他' || r.reason === '其它') {
  154 + r.isOther = true;
  155 + }
  156 + });
  157 +
134 reasons.push({ 158 reasons.push({
135 subReasons: d 159 subReasons: d
136 }); 160 });
@@ -57,7 +57,7 @@ @@ -57,7 +57,7 @@
57 } 57 }
58 58
59 &.cancel-dialog { 59 &.cancel-dialog {
60 - min-width: 490px; 60 + min-width: 660px;
61 61
62 * { 62 * {
63 text-align: left; 63 text-align: left;
@@ -79,22 +79,32 @@ @@ -79,22 +79,32 @@
79 79
80 .tip-item { 80 .tip-item {
81 height: $space; 81 height: $space;
  82 + margin-bottom: $smallSpace;
82 line-height: $space; 83 line-height: $space;
83 font-size: $normalSize; 84 font-size: $normalSize;
  85 + }
  86 +
  87 + .radio {
  88 + color: #ccc !important;
84 89
  90 + &.checked {
  91 + color: #1b1b1b !important;
  92 + }
85 } 93 }
86 94
87 .row { 95 .row {
88 height: $bigSpace; 96 height: $bigSpace;
89 line-height: $bigSpace; 97 line-height: $bigSpace;
90 98
91 - &.other { 99 + .other {
  100 + width: 90%;
  101 +
92 p { 102 p {
93 width: 20%; 103 width: 20%;
94 } 104 }
95 input { 105 input {
96 height: 25px; 106 height: 25px;
97 - width: 30%; 107 + width: 50%;
98 padding: 5px; 108 padding: 5px;
99 } 109 }
100 } 110 }
@@ -129,7 +129,7 @@ $hoverColor: #379ed6; @@ -129,7 +129,7 @@ $hoverColor: #379ed6;
129 } 129 }
130 130
131 .pro-name > a { 131 .pro-name > a {
132 - height: 100%; 132 + height: 36px;
133 display: block; 133 display: block;
134 line-height: 18px; 134 line-height: 18px;
135 } 135 }
@@ -4,10 +4,19 @@ @@ -4,10 +4,19 @@
4 {{# reasons}} 4 {{# reasons}}
5 <div class="row"> 5 <div class="row">
6 {{# subReasons}} 6 {{# subReasons}}
7 - <p data-value="{{id}}"> 7 + {{#if isOther}}
  8 + <br>
  9 + {{/if}}
  10 + <p data-value="{{id}}" {{#if isOther}}class="other"{{/if}}>
8 <span class="iconfont raido {{#if checked}}checked{{/if}}">{{#if checked}}&#xe603;{{^}}&#xe604;{{/if}}</span> 11 <span class="iconfont raido {{#if checked}}checked{{/if}}">{{#if checked}}&#xe603;{{^}}&#xe604;{{/if}}</span>
9 <span class="reason-text">{{reason}}</span> 12 <span class="reason-text">{{reason}}</span>
  13 + {{#if isOther}}
  14 + <input type="text" class="input" id="other-reason" placeholder="50个字符以内">
  15 + {{/if}}
10 </p> 16 </p>
  17 + {{#if isOther}}
  18 + <br>
  19 + {{/if}}
11 {{/ subReasons}} 20 {{/ subReasons}}
12 </div> 21 </div>
13 {{/ reasons}} 22 {{/ reasons}}