Showing
8 changed files
with
52 additions
and
10 deletions
749 Bytes
static/img/me/suggest-sfa29b6dcbe.png
0 → 100644
1.75 KB
static/img/me/suggest/sub_del.png
0 → 100644
2.18 KB
| @@ -13,15 +13,21 @@ var diaLog = require('./dialog'); | @@ -13,15 +13,21 @@ var diaLog = require('./dialog'); | ||
| 13 | 13 | ||
| 14 | var $uploadImgList = $('.upload-img-list'), | 14 | var $uploadImgList = $('.upload-img-list'), |
| 15 | headerNavHammer, | 15 | headerNavHammer, |
| 16 | + formHammer, | ||
| 16 | imgTpl, | 17 | imgTpl, |
| 17 | imgTemplate, | 18 | imgTemplate, |
| 18 | $likeBtn = $('.suggest-item .like-btn'), | 19 | $likeBtn = $('.suggest-item .like-btn'), |
| 19 | - $disLikeBtn = $('.suggest-item .dislike-btn'); | 20 | + $disLikeBtn = $('.suggest-item .dislike-btn'), |
| 21 | + $imgAdd = $('.img-add'), | ||
| 22 | + imgStr = ''; | ||
| 20 | 23 | ||
| 21 | require('./jquery.uploadifive'); | 24 | require('./jquery.uploadifive'); |
| 22 | 25 | ||
| 23 | imgTpl = '{{# imgList}}' + | 26 | imgTpl = '{{# imgList}}' + |
| 24 | - '<li><img src="{{imgUrl}}" /></li>' + | 27 | + '<li>' + |
| 28 | + '<img src="{{imgUrl}}" />' + | ||
| 29 | + '<span class="upload-img-remove"></span>' + | ||
| 30 | + '</li>' + | ||
| 25 | '{{/ imgList}}'; | 31 | '{{/ imgList}}'; |
| 26 | 32 | ||
| 27 | imgTemplate = Handlebars.compile(imgTpl); | 33 | imgTemplate = Handlebars.compile(imgTpl); |
| @@ -34,13 +40,16 @@ $('#upload-img').uploadifive({ | @@ -34,13 +40,16 @@ $('#upload-img').uploadifive({ | ||
| 34 | fileSizeLimit: 1024, | 40 | fileSizeLimit: 1024, |
| 35 | height: '100%', | 41 | height: '100%', |
| 36 | width: '100%', | 42 | width: '100%', |
| 43 | + queueSizeLimit: 1, | ||
| 37 | 44 | ||
| 38 | onAddQueueItem: function(files) { | 45 | onAddQueueItem: function(files) { |
| 39 | 46 | ||
| 40 | //TODO | 47 | //TODO |
| 41 | }, | 48 | }, |
| 42 | onUploadComplete: function(file, data) { | 49 | onUploadComplete: function(file, data) { |
| 50 | + imgStr = JSON.parse(data).imgList[0].imgRelUrl; | ||
| 43 | $uploadImgList.html(imgTemplate(JSON.parse(data))); | 51 | $uploadImgList.html(imgTemplate(JSON.parse(data))); |
| 52 | + $imgAdd.hide(); | ||
| 44 | } | 53 | } |
| 45 | }); | 54 | }); |
| 46 | 55 | ||
| @@ -56,7 +65,8 @@ headerNavHammer.on('tap', function(e) { | @@ -56,7 +65,8 @@ headerNavHammer.on('tap', function(e) { | ||
| 56 | method: 'post', | 65 | method: 'post', |
| 57 | url: '/home/savesuggest', | 66 | url: '/home/savesuggest', |
| 58 | data: { | 67 | data: { |
| 59 | - content: suggestText | 68 | + content: suggestText, |
| 69 | + image: imgStr | ||
| 60 | } | 70 | } |
| 61 | }).then(function(data) { | 71 | }).then(function(data) { |
| 62 | if (data.code === 200) { | 72 | if (data.code === 200) { |
| @@ -72,6 +82,19 @@ headerNavHammer.on('tap', function(e) { | @@ -72,6 +82,19 @@ headerNavHammer.on('tap', function(e) { | ||
| 72 | } | 82 | } |
| 73 | }); | 83 | }); |
| 74 | 84 | ||
| 85 | +formHammer = new Hammer(document.getElementById('img-form')); | ||
| 86 | + | ||
| 87 | +formHammer.on('tap', function(e) { | ||
| 88 | + if ($(e.target).hasClass('upload-img-remove')) { | ||
| 89 | + $uploadImgList.html(''); | ||
| 90 | + imgStr = ''; | ||
| 91 | + setTimeout(function() { | ||
| 92 | + $imgAdd.show(); | ||
| 93 | + }, 50); | ||
| 94 | + | ||
| 95 | + } | ||
| 96 | +}); | ||
| 97 | + | ||
| 75 | // 点赞与取消点赞 | 98 | // 点赞与取消点赞 |
| 76 | // suggestContentHammer = new Hammer(document.getElementById('suggest-content')); | 99 | // suggestContentHammer = new Hammer(document.getElementById('suggest-content')); |
| 77 | 100 |
| @@ -158,6 +158,7 @@ $suggest: sprite-map("me/suggest/*.png",$spacing: 5px); | @@ -158,6 +158,7 @@ $suggest: sprite-map("me/suggest/*.png",$spacing: 5px); | ||
| 158 | 158 | ||
| 159 | .img-form { | 159 | .img-form { |
| 160 | padding: 0 pxToRem(30px); | 160 | padding: 0 pxToRem(30px); |
| 161 | + float: left; | ||
| 161 | 162 | ||
| 162 | .upload-img-list { | 163 | .upload-img-list { |
| 163 | float: left; | 164 | float: left; |
| @@ -166,9 +167,11 @@ $suggest: sprite-map("me/suggest/*.png",$spacing: 5px); | @@ -166,9 +167,11 @@ $suggest: sprite-map("me/suggest/*.png",$spacing: 5px); | ||
| 166 | display: block; | 167 | display: block; |
| 167 | width: pxToRem(130px); | 168 | width: pxToRem(130px); |
| 168 | height: pxToRem(130px); | 169 | height: pxToRem(130px); |
| 169 | - overflow: hidden; | ||
| 170 | float: left; | 170 | float: left; |
| 171 | margin-right: pxToRem(30px); | 171 | margin-right: pxToRem(30px); |
| 172 | + background: image_url('loading.gif') center center no-repeat; | ||
| 173 | + @include background-size(50px); | ||
| 174 | + position: relative; | ||
| 172 | 175 | ||
| 173 | > img { | 176 | > img { |
| 174 | display: block; | 177 | display: block; |
| @@ -176,6 +179,21 @@ $suggest: sprite-map("me/suggest/*.png",$spacing: 5px); | @@ -176,6 +179,21 @@ $suggest: sprite-map("me/suggest/*.png",$spacing: 5px); | ||
| 176 | height: 100%; | 179 | height: 100%; |
| 177 | overflow: hidden; | 180 | overflow: hidden; |
| 178 | } | 181 | } |
| 182 | + | ||
| 183 | + > span { | ||
| 184 | + $width: pxToRem(image_width(sprite-file($suggest, sub_del))); | ||
| 185 | + $height: pxToRem(image_height(sprite-file($suggest, sub_del))); | ||
| 186 | + display: block; | ||
| 187 | + | ||
| 188 | + @include rem-sprite($suggest, sub_del); | ||
| 189 | + width: $width; | ||
| 190 | + height: $height; | ||
| 191 | + | ||
| 192 | + position: absolute; | ||
| 193 | + top: -($height/2); | ||
| 194 | + right: -($width/2); | ||
| 195 | + | ||
| 196 | + } | ||
| 179 | } | 197 | } |
| 180 | } | 198 | } |
| 181 | 199 |
| @@ -10,6 +10,7 @@ | @@ -10,6 +10,7 @@ | ||
| 10 | <ul class="fav-product-list"> | 10 | <ul class="fav-product-list"> |
| 11 | {{# hasFavProduct}} | 11 | {{# hasFavProduct}} |
| 12 | <li data-id="{{fav_id}}"> | 12 | <li data-id="{{fav_id}}"> |
| 13 | + <a href="{{link}}"> | ||
| 13 | <div class="fav-img-box"> | 14 | <div class="fav-img-box"> |
| 14 | <img src="{{imgUrl}}" alt=""/> | 15 | <img src="{{imgUrl}}" alt=""/> |
| 15 | </div> | 16 | </div> |
| @@ -21,7 +22,6 @@ | @@ -21,7 +22,6 @@ | ||
| 21 | {{/ discountPrice}} | 22 | {{/ discountPrice}} |
| 22 | <span class="fav-price {{# discountPrice}}price-underline{{/ discountPrice}}">{{price}}</span> | 23 | <span class="fav-price {{# discountPrice}}price-underline{{/ discountPrice}}">{{price}}</span> |
| 23 | </div> | 24 | </div> |
| 24 | - | ||
| 25 | {{# savePrice}} | 25 | {{# savePrice}} |
| 26 | <div class="save-price save-price-number"> | 26 | <div class="save-price save-price-number"> |
| 27 | 比收藏时降价了<span>{{.}}</span> | 27 | 比收藏时降价了<span>{{.}}</span> |
| @@ -39,13 +39,14 @@ | @@ -39,13 +39,14 @@ | ||
| 39 | {{/ savePrice}} | 39 | {{/ savePrice}} |
| 40 | 40 | ||
| 41 | </div> | 41 | </div> |
| 42 | + </a> | ||
| 42 | </li> | 43 | </li> |
| 43 | {{/ hasFavProduct}} | 44 | {{/ hasFavProduct}} |
| 44 | </ul> | 45 | </ul> |
| 45 | 46 | ||
| 46 | {{^ hasFavProduct}} | 47 | {{^ hasFavProduct}} |
| 47 | <span class="fav-null">您暂无收藏任何商品</span> | 48 | <span class="fav-null">您暂无收藏任何商品</span> |
| 48 | - <a class="go-shopping" href="#">随便逛逛</a> | 49 | + <a class="go-shopping" href="{{productUrl}}">随便逛逛</a> |
| 49 | {{/ hasFavProduct}} | 50 | {{/ hasFavProduct}} |
| 50 | </div> | 51 | </div> |
| 51 | <div class="fav-type"> | 52 | <div class="fav-type"> |
| @@ -89,7 +90,7 @@ | @@ -89,7 +90,7 @@ | ||
| 89 | 90 | ||
| 90 | {{^ hasFavBrand}} | 91 | {{^ hasFavBrand}} |
| 91 | <span class="fav-null">您暂无收藏任何品牌</span> | 92 | <span class="fav-null">您暂无收藏任何品牌</span> |
| 92 | - <a class="go-shopping" href="#">随便逛逛</a> | 93 | + <a class="go-shopping" href="{{brandUrl}}">随便逛逛</a> |
| 93 | {{/ hasFavBrand}} | 94 | {{/ hasFavBrand}} |
| 94 | </div> | 95 | </div> |
| 95 | </div> | 96 | </div> |
| @@ -31,7 +31,7 @@ | @@ -31,7 +31,7 @@ | ||
| 31 | </div> | 31 | </div> |
| 32 | {{/ suggestContent}} | 32 | {{/ suggestContent}} |
| 33 | </div> | 33 | </div> |
| 34 | - <a class="create-new-suggest" href="#"> | 34 | + <a class="create-new-suggest" href="./suggestSub"> |
| 35 | 反馈问题<span>（功能意见，界面意见）</span> | 35 | 反馈问题<span>（功能意见，界面意见）</span> |
| 36 | </a> | 36 | </a> |
| 37 | {{/ suggest}} | 37 | {{/ suggest}} |
| @@ -3,10 +3,10 @@ | @@ -3,10 +3,10 @@ | ||
| 3 | {{# suggestSub}} | 3 | {{# suggestSub}} |
| 4 | <div class="suggest-sub-form"> | 4 | <div class="suggest-sub-form"> |
| 5 | <textarea name="" id="suggest-textarea" placeholder="请输入意见反馈，我们会以消息形式回复您的建议或意见，改进产品体验，谢谢！"></textarea> | 5 | <textarea name="" id="suggest-textarea" placeholder="请输入意见反馈，我们会以消息形式回复您的建议或意见，改进产品体验，谢谢！"></textarea> |
| 6 | - <div class="img-form"> | 6 | + <div id="img-form" class="img-form"> |
| 7 | <ul class="upload-img-list"></ul> | 7 | <ul class="upload-img-list"></ul> |
| 8 | <span class="img-add"> | 8 | <span class="img-add"> |
| 9 | - <input id="upload-img" type="file" multiple /> | 9 | + <input id="upload-img" type="file" /> |
| 10 | </span> | 10 | </span> |
| 11 | </div> | 11 | </div> |
| 12 | </div> | 12 | </div> |
-
Please register or login to post a comment