fe / yohoblk-wap · Commits

Go to a project

Authored by 沈志敏
Commit 0302abb9641023d15681bb1c9195cdd1a13fb1c1 1 parent dd14ffeb

完善物流信息

Inline Side-by-side
Showing 6 changed files with 96 additions and 36 deletions
@@ -40,9 +40,11 @@ const refund = { @@ -40,9 +40,11 @@ const refund = {
40 }).catch(next); 40 }).catch(next);
41 }, 41 },
42 saveLogistics(req, res, next) { 42 saveLogistics(req, res, next) {
43 - const company = req.body.company; 43 + const company_id = req.body.company_id;
  44 + const company_name = req.body.company_name;
44 const num = req.body.num; 45 const num = req.body.num;
45 46
  47 + // todo 调用保存物流信息接口
46 res.json({ 48 res.json({
47 code: 200 49 code: 200
48 }); 50 });
1 <div class="logistics-page" id="logistics"> 1 <div class="logistics-page" id="logistics">
2 - <components :is="currentView" :company="company" keep-alive></components> 2 + <components :is="currentView" :company_id="company_id" :company_name="company_name" keep-alive></components>
3 </div> 3 </div>
@@ -8,7 +8,8 @@ Vue.use(infiniteScroll); @@ -8,7 +8,8 @@ Vue.use(infiniteScroll);
8 new Vue({ 8 new Vue({
9 el: '#logistics', 9 el: '#logistics',
10 data: { 10 data: {
11 - company: '', 11 + company_id: '',
  12 + company_name: '',
12 currentView: 'logistics', 13 currentView: 'logistics',
13 }, 14 },
14 components: { 15 components: {
@@ -18,7 +19,8 @@ new Vue({ @@ -18,7 +19,8 @@ new Vue({
18 events: { 19 events: {
19 changeView: function(obj) { 20 changeView: function(obj) {
20 this.currentView = obj.view; 21 this.currentView = obj.view;
21 - this.company = obj.company; 22 + this.company_id = obj.company_id;
  23 + this.company_name = obj.company_name;
22 } 24 }
23 } 25 }
24 }); 26 });
1 .logistics-page { 1 .logistics-page {
2 width: 100%; 2 width: 100%;
3 - background: #f0f0f0;  
4 3
5 .edit-logistics-page { 4 .edit-logistics-page {
6 width: 100%; 5 width: 100%;
@@ -14,7 +13,6 @@ @@ -14,7 +13,6 @@
14 background: #fff; 13 background: #fff;
15 font-size: 30px; 14 font-size: 30px;
16 line-height: 88px; 15 line-height: 88px;
17 - border-bottom: 1px solid #e0e0e0;  
18 16
19 label { 17 label {
20 display: block; 18 display: block;
@@ -50,6 +48,7 @@ @@ -50,6 +48,7 @@
50 -webkit-appearance: none; 48 -webkit-appearance: none;
51 } 49 }
52 50
  51 +
53 .num { 52 .num {
54 width: 440px; 53 width: 440px;
55 text-align: right; 54 text-align: right;
@@ -80,26 +79,50 @@ @@ -80,26 +79,50 @@
80 79
81 .search-input { 80 .search-input {
82 position: relative; 81 position: relative;
83 - padding: 14px 22px;  
84 - background: #f8f8f8;  
85 -  
86 - .icon {  
87 - position: absolute;  
88 - font-size: 24px;  
89 - top: 26px;  
90 - left: 36px;  
91 - color: #b2b2b2;  
92 - } 82 + text-align: center;
  83 + padding: 16px 16px;
  84 + border-bottom: 1px solid #e6e6e6;
93 85
94 input { 86 input {
95 height: 56px; 87 height: 56px;
96 - width: 378px;  
97 - border-radius: 28px;  
98 - padding: 0 52px;  
99 - font-size: 24px;  
100 - background: #fff; 88 + width: 100%;
  89 + padding-left: 15px;
  90 + border-radius: 20px;
  91 + font-size: 36px;
  92 + color: #b0b0b0;
  93 + background: #eee;
101 border: none; 94 border: none;
102 } 95 }
  96 +
  97 + input::-webkit-input-placeholder { /* WebKit browsers */
  98 + text-align: center;
  99 + }
  100 + input:-ms-input-placeholder { /* Internet Explorer 10+ */
  101 + text-align: center;
  102 + }
  103 + }
  104 +
  105 + .company-data {
  106 + color: #000;
  107 + margin-left: 30px;
  108 +
  109 + .company-item {
  110 +
  111 + h2 {
  112 + height: 50px;
  113 + line-height: 50px;
  114 + font-size: 30px;
  115 + border-bottom: 1px solid #f3f3f3;
  116 + }
  117 +
  118 + span {
  119 + display: block;
  120 + height: 90px;
  121 + line-height: 90px;
  122 + font-size: 30px;
  123 + border-bottom: 1px solid #f3f3f3;
  124 + }
  125 + }
103 } 126 }
104 } 127 }
105 } 128 }
1 <template> 1 <template>
2 <div class="companylist-page"> 2 <div class="companylist-page">
3 <div class="search-input"> 3 <div class="search-input">
4 - <input class="buriedpoint icon" type="text" placeholder="&#xe608;搜索快递公司"> 4 + <input class="icon" type="text" placeholder="&#xe608; 搜索快递公司" v-model="inputname" @input="search">
  5 + </div>
  6 + <div class="company-data">
  7 + <div class="company-item" v-for="item in showData">
  8 + <h2>{{ $key }}</h2>
  9 + <span v-for="val in item" track-by="id" @click="select(val.id, val.company_name)">{{val.company_name}}</span>
  10 + </div>
5 </div> 11 </div>
6 - <ul class="search-associate"></ul>  
7 </div> 12 </div>
8 </template> 13 </template>
9 14
10 <script> 15 <script>
  16 + const $ = require('yoho-jquery');
  17 +
11 module.exports = { 18 module.exports = {
12 data() { 19 data() {
13 return { 20 return {
14 - companyData: {}, 21 + inputname: '',
  22 + data: {},
  23 + showData: {}
15 }; 24 };
16 }, 25 },
17 methods: { 26 methods: {
18 - submit: function(){  
19 - console.log(this.num); 27 + search: function() {
  28 + var inputname = this.inputname;
  29 + if (!inputname) {
  30 + this.showData = this.data;
  31 + return;
  32 + }
  33 +
  34 + var filter = {};
  35 + for (var k in this.data) {
  36 + this.data[k].forEach(function(d){
  37 + if (d.company_name.indexOf(inputname) > -1) {
  38 + if (!filter[k]) filter[k] = [];
  39 + filter[k].push(d);
  40 + }
  41 + })
  42 + }
  43 + this.showData = filter;
  44 + },
  45 + select: function(company_id, company_name) {
20 this.$dispatch('changeView', { 46 this.$dispatch('changeView', {
21 view: 'logistics', 47 view: 'logistics',
22 - company: "aaaf啊啊啊" 48 + company_id: company_id,
  49 + company_name: company_name
23 }); 50 });
  51 +
  52 + // 重置列表
  53 + this.inputname = '';
  54 + this.showData = this.data;
24 } 55 }
25 }, 56 },
26 activate: function(done) { 57 activate: function(done) {
  58 + let _this = this;
27 $.ajax({ 59 $.ajax({
28 url: '/home/refund/companylist' 60 url: '/home/refund/companylist'
29 }).then(function(res) { 61 }).then(function(res) {
@@ -31,9 +63,9 @@ @@ -31,9 +63,9 @@
31 res = {}; 63 res = {};
32 } 64 }
33 if (res.code === 200) { 65 if (res.code === 200) {
34 - 66 + _this.data = res.data;
  67 + _this.showData = res.data;
35 } 68 }
36 -  
37 done(); 69 done();
38 }).fail(function() { 70 }).fail(function() {
39 tip('网络错误'); 71 tip('网络错误');
@@ -2,12 +2,12 @@ @@ -2,12 +2,12 @@
2 <div class="edit-logistics-page"> 2 <div class="edit-logistics-page">
3 <form class="edit-logistics"> 3 <form class="edit-logistics">
4 <label @click="companylist"> 4 <label @click="companylist">
5 - 选择快递公司<input class="company-val" type="text" name="company" value="{{company}}" readonly> 5 + 选择快递公司<input class="company-val" type="text" value="{{company_name}}" readonly>
6 <span class="icon icon-right"></span> 6 <span class="icon icon-right"></span>
7 </label> 7 </label>
8 <label> 8 <label>
9 快递单号 9 快递单号
10 - <input class="num" type="number" name="num" v-model='num'> 10 + <input class="num" type="number" v-model='num'>
11 </label> 11 </label>
12 </form> 12 </form>
13 <div class="submit" @click="submit">确认</div> 13 <div class="submit" @click="submit">确认</div>
@@ -19,7 +19,7 @@ @@ -19,7 +19,7 @@
19 const tip = require('common/tip'); 19 const tip = require('common/tip');
20 20
21 module.exports = { 21 module.exports = {
22 - props: ['company'], 22 + props: ['company_id', 'company_name'],
23 data() { 23 data() {
24 return { 24 return {
25 num: '', 25 num: '',
@@ -32,11 +32,11 @@ @@ -32,11 +32,11 @@
32 }); 32 });
33 }, 33 },
34 submit: function(){ 34 submit: function(){
35 - if (!this.company) { 35 + if (!this.company_name) {
36 tip("请选择快递公司"); 36 tip("请选择快递公司");
37 return false; 37 return false;
38 } 38 }
39 - if (!/^[0-9]*$/.test(this.num)) { 39 + if (!this.num || !/^[0-9]*$/.test(this.num)) {
40 tip("请输入正确的快递单号"); 40 tip("请输入正确的快递单号");
41 return false; 41 return false;
42 } 42 }
@@ -45,8 +45,9 @@ @@ -45,8 +45,9 @@
45 method: 'POST', 45 method: 'POST',
46 url: '/home/save-logistics', 46 url: '/home/save-logistics',
47 data: { 47 data: {
48 - company: company,  
49 - num: num 48 + company_id: this.company_id,
  49 + company_name: this.company_name,
  50 + num: this.num
50 } 51 }
51 }).then(function(res) { 52 }).then(function(res) {
52 if ($.type(res) !== 'object') { 53 if ($.type(res) !== 'object') {