个人中心-收货地址初步逻辑

+/**
+ * [个人中心]收货地址
+ * @author: jiangmin
+ * @date: 2016/07/05
+ */
+
+'use strict';
+const mcHandler = require('../models/menu-crumb-handler');
+const addressModel = require('../models/address');
+
+/**
+ * 收货地址页面加载
+ */
+const index = (req, res) => {
+    addressModel.getAddressDataAsync('123456', 20).then(result => {
+        res.render('index', {
+            module: 'me',
+            page: 'address',
+            isMe: true,
+            content: {
+                nav: mcHandler.getMeCrumb(),
+                navigation: mcHandler.getSideMenu('收货地址'),
+                banner: 'http://placehold.it/150x120',
+                address: true,
+                data: result
+            }
+        });
+    });
+};
+
+/**
+ * 添加地址
+ */
+const addAddressData = (req) => {
+    let uid = req.body.uid;
+    let address = req.body.address;
+    let areaCode = req.body.area_code;
+    let consignee = req.body.consignee;
+    let mobile = req.body.mobile;
+    let phone = req.body.phone;
+
+    addressModel.addAddressData(uid, address, areaCode, consignee, mobile, phone);
+};
+
+/**
+ * 修改地址
+ */
+const updateAddressData = (req) => {
+    let id = req.body.id;
+    let uid = req.body.uid;
+    let address = req.body.address;
+    let areaCode = req.body.area_code;
+    let consignee = req.body.consignee;
+    let mobile = req.body.mobile;
+    let phone = req.body.phone;
+
+    addressModel.updateAddressData(id, uid, address, areaCode, consignee, mobile, phone);
+};
+
+/**
+ * 添加地址
+ */
+const delAddressData = (req) => {
+    let id = req.body.id;
+    let uid = req.body.uid;
+
+    addressModel.delAddressData(id, uid);
+};
+
+/**
+ * 添加地址
+ */
+const setDefaultAddress = (req) => {
+    let id = req.body.id;
+    let uid = req.body.uid;
+
+    addressModel.setDefaultAddress(id, uid);
+};
+
+module.exports = {
+    index,
+    addAddressData,
+    updateAddressData,
+    delAddressData,
+    setDefaultAddress
+};

+/**
+ * [个人中心]收货地址
+ * @author: jiangmin
+ * @date: 2016/07/05
+ */
+
+'use strict';
+
+const api = global.yoho.API;
+
+/**
+ * 地址列表数据
+ *
+ * @param  uid 用户ID
+ * @param  limit 分页大小参数(默认10条)
+ * @return array 地址接口返回的数据
+ */
+const getAddressDataAsync = (uid, limit) => {
+    return api.get('', {
+        method: 'app.address.gethidden',
+        uid: uid,
+        limit: limit
+    }).then(result => {
+        console.log('接口请求结果result', result);
+        if (result.code === '200') {
+            return result.data;
+        }
+        return result;
+    });
+};
+
+/**
+ * 保存地址数据
+ *
+ * @param uid 用户ID
+ * @param address 地址信息
+ * @param area_code 城市码
+ * @param consignee 收货人
+ * @param mobile 手机号码
+ * @param phone 电话号码
+ * @return array 地址接口返回的数据
+ */
+const addAddressData = (uid, address, areaCode, consignee, mobile, phone) => {
+    return api.get('', {
+        method: 'app.address.add',
+        uid: uid,
+        address: address,
+        area_code: areaCode,
+        consignee: consignee,
+        mobile: mobile,
+        phone: phone
+    }).then(result => {
+        if (result.code === '200') {
+            return result;
+        }
+    });
+};
+
+/**
+ * 修改地址数据
+ *
+ * @param id 地址id
+ * @param uid 用户ID
+ * @param address 地址信息
+ * @param area_code 城市码
+ * @param consignee 收货人
+ * @param mobile 手机号码
+ * @param phone 电话号码
+ * @return array 地址接口返回的数据
+ */
+const updateAddressData = (id, uid, address, areaCode, consignee, mobile, phone) => {
+    return api.get('', {
+        method: 'app.address.update',
+        id: id,
+        uid: uid,
+        address: address,
+        area_code: areaCode,
+        consignee: consignee,
+        mobile: mobile,
+        phone: phone
+    }).then(result => {
+        if (result.code === '200') {
+            return result;
+        }
+    });
+};
+
+/**
+ * 删除地址数据
+ *
+ * @param id 地址id
+ * @param uid 用户ID
+ * @return array 地址接口返回的数据
+ */
+const delAddressData = (id, uid) => {
+    return api.get('', {
+        method: 'app.address.del',
+        id: id,
+        uid: uid
+    }).then(result => {
+        if (result.code === '200') {
+            return result;
+        }
+    });
+};
+
+/**
+ * 设置默认地址
+ *
+ * @param id 地址id
+ * @param uid 用户ID
+ * @return array 地址接口返回的数据
+ */
+const setDefaultAddress = (id, uid) => {
+    return api.get('', {
+        method: 'app.address.setdefault',
+        id: id,
+        uid: uid
+    }).then(result => {
+        if (result.code === '200') {
+            return result;
+        }
+    });
+};
+
+module.exports = {
+    getAddressDataAsync: getAddressDataAsync,
+    addAddressData: addAddressData,
+    updateAddressData: updateAddressData,
+    delAddressData: delAddressData,
+    setDefaultAddress: setDefaultAddress
+};

@@ -11,8 +11,16 @@ const cRoot = './controllers';
 
 // 订单
 const order = require(`${cRoot}/order`);
+const address = require(`${cRoot}/address`);
 
 // 个人中心首页/订单
 router.get('/', order.index);
 
+// 个人中心首页/收货地址
+router.get('/address', address.index);
+router.post('/address/add', address.addAddressData);
+router.post('/address/update', address.updateAddressData);
+router.post('/address/del', address.delAddressData);
+router.post('/address/default', address.setDefaultAddress);
+
 module.exports = router;

+<form id="address-form" name="address-form">
+    <div class="address-page">
+        <p class="bold title">收货地址</p>
+        <span class="blue tips">新增地址 电话为选填项，其他均为必填项</span>
+        <div class="add-address-detail">
+            <div class="form-group">
+                <label class="label-name">收货人:</label>
+                <input id="consignee" class="input width-190" type="text" placeholder="请输入您的姓名" maxlength="10">
+                <span class="blue error-tips">{{> icon/error-round}}收件人不能为空</span>
+            </div>
+            <div class="form-group">
+                <label class="label-name">所在区域:</label>
+                <div id="address"></div>
+                <span class="blue error-tips">{{> icon/error-round}}所在区域不能为空</span>
+
+            </div>
+            <div class="form-group">
+                <label class="label-name">详细地址:</label>
+                <input id="addressDetail" class="input width-275" type="text" placeholder="街道名称或小区名称" maxlength="60">
+                <span class="blue error-tips">{{> icon/error-round}}详细地址不能为空</span>
+            </div>
+            <div class="form-group">
+                <label class="label-name">手机号码:</label>
+                <input id="mobile" class="input width-190" type="text" placeholder="请输入手机号码（重要必填）" maxlength="11">
+                <span class="blue error-tips">{{> icon/error-round}}手机号码不能为空</span>
+            </div>
+            <div class="form-group">
+                <label class="label-name">电话号码:</label>
+                <input id="phone" class="input width-190" type="text" placeholder="请输入电话号码（选填）">
+            </div>
+            <div class="form-group ">
+                <label class="label-name"></label>
+                <span class="iconfont radio default-address opreation">&#xe604;</span>
+                <label class="radio-lable">设置为默认收货地址</label>
+            </div>
+            <div class="form-group">
+                <span class="btn opreation" id="save-address">保存</span>
+            </div>
+        </div>
+    </div>
+</form>
+<div class="address-table">
+    <span class="blue table-title">已保存了3条地址，还能保存17条地址</span>
+    <table class="a-table">
+        <tr class="table-head">
+            <th class="width-80">收货人</th>
+            <th class="width-195">所在区域</th>
+            <th class="width-280">详细地址</th>
+            <th class="width-120">手机/电话</th>
+            <th class="width-260">操作</th>
+        </tr>
+        {{#each data}}
+            <tr class="table-body">
+                <td class="width-80">{{consignee}}</td>
+                <td class="width-195">{{address}}</td>
+                <td class="width-280">{{address}}</td>
+                <td class="width-120">{{mobile}}</td>
+                <td class="width-260">
+                    <div>
+                        <span class="blue opreation">修改</span>
+                        |
+                        <span class="blue opreation " id="del-address">删除</span>
+                        {{#if is_default}}
+                            <span class="btn set-default opreation">默认地址</span>
+                        {{else}}
+                            <span class="btn set-default opreation">设为默认</span>
+                        {{/if}}
+                    </div>
+                </td>
+            </tr>
+        {{/each}}
+    </table>
+</div>

@@ -18,7 +18,8 @@ module.exports = {
         default: '//www.yohoblk.com'
     },
     domains: {
-        api: 'http://api.yoho.yohoops.org/', // devapi.yoho.cn:58078 testapi.yoho.cn:28078 devapi.yoho.cn:58078
+        // api: 'http://api.yoho.yohoops.org/', // devapi.yoho.cn:58078 testapi.yoho.cn:28078 devapi.yoho.cn:58078
+        api: 'http://devapi.yoho.cn:58078/', // devapi.yoho.cn:58078 testapi.yoho.cn:28078 devapi.yoho.cn:58078
         service: 'http://devservice.yoho.cn:28077/', // testservice.yoho.cn:28077 devservice.yoho.cn:58077
         search: 'http://192.168.102.216:8080/yohosearch/'
     },

+/**
+ * [个人中心]收货地址
+ * @author: jiangmin
+ * @date: 2016/07/05
+ */
+
+
+var cascadingAddress = require('../plugins/cascading-address');
+var dialog = require('../plugins/dialog');
+var _confirm = dialog.Confirm;
+var $consignee = $('#consignee');
+var $addressDetail = $('#addressDetail');
+var $mobile = $('#mobile');
+var $phone = $('#phone');
+
+require('./me');
+
+// 设置收货地址
+$('.default-address').click(function() {
+    if ($(this).hasClass('checked')) {
+        $(this).removeClass('checked');
+        $(this).html('');
+    } else {
+        $(this).addClass('checked');
+        $(this).html('');
+    }
+});
+
+// 校验
+$consignee.keydown(function() {
+    $(this).next().hide();
+});
+$consignee.blur(function() {
+    if ($(this).val().trim() === '') {
+        $(this).next().show();
+    }
+});
+$addressDetail.keydown(function() {
+    $(this).next().hide();
+});
+$addressDetail.blur(function() {
+    if ($(this).val().trim() === '') {
+        $(this).next().show();
+    }
+});
+$mobile.keydown(function() {
+    $(this).next().hide();
+});
+$mobile.blur(function() {
+    if ($(this).val().trim() === '') {
+        $(this).next().show();
+    } else {
+        let reg = new RegExp(/^(0|86|17951)?(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$/);
+
+        if (!reg.test(($(this).val().trim()))) {
+            $(this).next().show();
+            $(this).next().html('手机号码格式不正确');
+        }
+    }
+});
+
+// 保存收货地址
+$('#save-address').click(function() {
+    if ($consignee.val().trim() === '') {
+        alert('name不能为空');
+    } else {
+        $.ajax({
+            type: 'POST',
+            url: '/me/address/add',
+            dataType: 'json',
+            data: {// 保存数据
+                // todo uid
+                uid: '123456',
+                consignee: $consignee.val(),
+
+                // todo 城市编码
+                area_code: '123',
+                address: $addressDetail.val(),
+                mobile: $mobile.val(),
+                phone: $phone.val()
+            },
+            success: function(data) { // 刷新下面列表数据
+                console.log('保存成功信息', data);
+            }
+        });
+    }
+
+});
+
+// 修改收货地址
+
+// 删除收货地址
+$('#del-address').click(function() {
+    new _confirm({
+        content: '您确定要删除收货地址吗？',
+        cb: function() {
+            alert('您点击了confirm确认');
+        }
+    }).show();
+});
+
+$(function() {
+    // 运行此demo
+    // 1. 安装 npm i -g json-server
+    // 2. json-server --watch mock/address.json
+    cascadingAddress({
+        el: '#address',
+        url: 'http://localhost:3000/areas/0',
+        resource: 'areas'
+    });
+});