仅用了一天开发了这样的app，再也不用担心排队的问题了

昨天约朋友们去我最喜欢的一家餐厅吃饭，到了地点发现人都排到门口了，可是又不想换其他餐厅，就等了一个小时后才大快朵颐。

吃完后和朋友聊到怎么才能在就餐高峰期间还能抢到一席之地，有的说飞奔着过去，有的说找人少的餐厅，有的说如果能在线预约就好了，听到这里灵机一动，对呀，如果有这样一款app可以提前预约座位顺便菜也一起点好，只要人一到马上菜上齐，不用排队也不为焦急等菜而一直喝水。这位朋友的想法我点个赞！

但是预约也是有条件的，开始就餐时间（比如下午5点）的前半个小时之内是不允许预约的，餐厅详情内有选座功能，可以选到自己心仪的座位，和买电影票选座有异曲同工之处。预约成功后预约的就餐时间内未准时到达的情况下餐厅将保留15分钟，超过15分钟会自动扣除预约费且不保留座位。如有特殊情况取消预约则扣除预约费的10%（视餐厅而定）。

大概想到了这些，心动不如行动我和朋友们马上试着开发这样一款app（成熟度不是很高，时间仓促有的功能还没来得及实现）。

用户客户端包括登录、主页面、餐厅详情、预约、我的6个页面

​

客户端是用爱码哥平台开发的，基于imag.js技术。

看看实现“我的”页面的代码

<?xml version="1.0" encoding="utf-8"?><imag>    <script>        <![CDATA[        $page.onload = function(){            $http.get("http://www.imagapp.com/project/imag/imag-mh0504/data/mine.json",function(data){                var data = JSON.parse(data).data;                var info = data.info;                $('order').text = info.order;                $('points').text = info.points;                $('collection').text = info.collection;                $('coupom').text = info.coupom;            var listJson = {items:[]};                //当前订单                var present = data.present;               var item0Json = {                   template:0,                   widgets:{                        present_icon:{src:present.icon},                        present_name:{text:present.name},                        present_number:{text:present.number+'人'},                        present_park:{text:present.park},                        present_time:{text:present.time},                        present_smoke:{text:present.smoke}                   }               }                listJson.items.push(item0Json);                //过往订单                var past = data.past;                for(i = 0;i<past.length;i++){                    if(past[i].remark!=""&&past[i].remark!=null){var item1Json = {template:1,widgets:{past_icon:{src:past[i].icon},past_name:{text:past[i].name},past_number:{text:past[i].number+'人'},past_park:{text:past[i].park},past_time:{text:past[i].time}}}listJson.items.push(item1Json);                        var item2Json = {                            template:2,                            widgets:{                                past_remark:{text:past[i].remark}                            }                        }                    listJson.items.push(item2Json);                    }else{var item3Json = {template:3,widgets:{past_icon:{src:past[i].icon},past_name:{text:past[i].name},past_number:{text:past[i].number+'人'},past_park:{text:past[i].park},past_time:{text:past[i].time}}}listJson.items.push(item3Json);}                }                $('list').update(listJson);            })        }        ]]>    </script>    <page screen="full" style="background:background.jpg">        <content dragable="false">            <list type="transparent">                <item style="padding:0"><col><row>                <button style="margin:20 10;align:left;background:title_back.png" onclick="$page.close(0)"></button>                </row></col></item>                <item style="margin:0 30;padding:0">                    <col>                        <row><label style="color:#ffffff;font-size:21">Queue</label></row>                        <row><label style="color:#ffffff;font-size:16;margin-top:25">我不是在吃，就是在去吃的路上。</label></row>                    </col>                </item>                <item style="padding:0;margin:64 7 0">                    <col>                        <row><label style="align:center;color:#ffffff;font-size:11">订单</label></row>                        <row><label id="order" style="align:center;color:#ffffff;font-size:10;margin-top:2"/></row>                    </col>                    <col>                        <row><label style="align:center;color:#ffffff;font-size:11">积分</label></row>                        <row><label id="points" style="align:center;color:#ffffff;font-size:10;margin-top:2"/></row>                    </col>                    <col>                        <row><label style="align:center;color:#ffffff;font-size:11">收藏</label></row>                        <row><label id="collection" style="align:center;color:#ffffff;font-size:10;margin-top:2"/></row>                    </col>                    <col>                        <row><label style="align:center;color:#ffffff;font-size:11">优惠</label></row>                        <row><label id="coupom" style="align:center;color:#ffffff;font-size:10;margin-top:2"/></row>                    </col>                </item>            </list>            <list type="transparent" reuse="true" id="list" style="margin:0 11 21">                <item style="padding:0 21 21;margin:20 0 0;background:#ee791b;col-width:71,*;corner-radius:4">                    <col><row><icon reusekey="present_icon" style="height:61;width:61;align:left"/></row></col>                    <col>                        <row><label reusekey="present_name" style="color:#ffffff;font-size:14;font-weight:bold"/></row>                        <row style="margin:5 0">                            <label style="color:#ffffff;font-size:10">预约人数：</label>                            <label reusekey="present_number" style="color:#ffffff;font-size:10"/>                            <label reusekey="present_park" style="color:#ffffff;font-size:10"/>                            <label style="color:#ffffff;font-size:10;align:right" onclick="$page.open('carte.xml')">在线点餐</label>                        </row>                        <row>                            <label style="color:#ffffff;font-size:10">预约时间：</label>                            <label reusekey="present_time" style="color:#ffffff;font-size:10"/>                            <label reusekey="present_smoke" style="color:#ffffff;font-size:10;align:right"/>                        </row>                    </col>                </item>                <item style="padding:0 21 11;margin:21 0 0;background:#ffffff;col-width:71,*;corner-radius:4 0">                    <col><row><icon reusekey="past_icon" style="height:61;width:61;align:left"/></row></col>                    <col>                        <row><label reusekey="past_name" style="color:#707070;font-size:14;font-weight:bold"/></row>                        <row style="margin:5 0">                            <label style="color:#707070;font-size:10">预约人数：</label>                            <label reusekey="past_number" style="color:#707070;font-size:10"/>                            <label reusekey="past_park" style="color:#707070;font-size:10"/>                        </row>                        <row>                            <label style="color:#707070;font-size:10">预约时间：</label>                            <label reusekey="past_time" style="color:#707070;font-size:10"/>                            <label style="color:#707070;font-size:10;align:right">评价</label>                        </row>                    </col>                </item>                <item style="padding:0 21;background:#ffffff;corner-radius:0 4">                    <row style="background:#eeeeed;height:1"></row>                    <row><label reusekey="past_remark" style="color:#707070;font-size:10;align:center;margin:10 0"/></row>                </item>                <item style="padding:0 21 11;margin:21 0 0;background:#ffffff;col-width:71,*;corner-radius:4">                    <col><row><icon reusekey="past_icon" style="height:61;width:61;align:left"/></row></col>                    <col>                        <row><label reusekey="past_name" style="color:#707070;font-size:14;font-weight:bold"/></row>                        <row style="margin:5 0">                            <label style="color:#707070;font-size:10">预约人数：</label>                            <label reusekey="past_number" style="color:#707070;font-size:10"/>                            <label reusekey="past_park" style="color:#707070;font-size:10"/>                        </row>                        <row>                            <label style="color:#707070;font-size:10">预约时间：</label>                            <label reusekey="past_time" style="color:#707070;font-size:10"/>                            <label style="color:#707070;font-size:10;align:right">评价</label>                        </row>                    </col>                </item>            </list>        </content>    </page></imag>

代码量很少对不对（小伙伴表示惊呆了！）

我和两个朋友用了不到一天的时间就开发出了这样的app，是不是很快速！

可以 客户端下载安装地址 体验一下（这仅仅只是个demo，不具有任何商业用途及推广） 

或扫描二维码：

ps:仅Android系统可用