party-bid第二张卡小结

最新推荐文章于 2018-06-14 08:04:00 发布

原创最新推荐文章于 2018-06-14 08:04:00 发布 · 605 阅读

0 ·

CC 4.0 BY-SA版权

web开发学习专栏收录该内容

9 篇文章

订阅专栏

party-bid第二张卡【活动报名】

下面我就我做第二张卡时，遇到的几个重点和难点问题的解决思路和解决办法进行总结。

1、对接收短信的格式进行处理

要求：格式要求是：“bm+姓名”，其中“bm”不分大小写，且短信内容中任意处都可以有空格。所以简单来说应该有一下几点要求

去掉空格
字符个数>2
bm开头（不区分大小写）
点好号码在同一活动报名中不重复

思路：空格处理：将短信内容中的所有空格都去掉，或者说替换为“”

开头格式判断：方法1:将短信内容前两个字符提取出来，可以将其全部转换为大小，或全部转为小写，再与BM或bm对比，进行判断；

方法2:利用正则表达式里的条件查找方法。

解决办法：

//方法1
var message = (json_message.messages[0].message).replace(/\s/g, "");           //这里json_message表示短信内容
return   (message.length>=2) && (message.substr(0,2).toUpperCase() == "BM");   </span>

replace函数有两个参数，第一个是被替换的元素，第二个是替换元素。\ 做为转意，即通常在"\"后面的字符不按原来意义解释，\s匹配任何空白字符，包括空格、制表符、换页符等等，/g代表全局匹配，该行代码的意思是用空来代替空格。

substr是JS提供的对字符串的处理方法，从索引为0的位置开始截取2个字符。注意，应该与string（a，b）区别一下，这里的a,b是将要截取的索引的起始位置和终止位置

//方法2
var message = (json_message.messages[0].message).replace(/\s/g, "");           //这里json_message表示短信内容</span>
<span style="font-size:12px;">var b=message.search(/bm/i); //再判断b是否等于0</span>

search 方法将会查找是否存在相应的匹配。如果找到一个匹配，search方法将返回这个匹配距离字符串开始的偏移位置。如果没有找到匹配，则返回 -1 。“/bm/i”为正则表达式，i是模式匹配符，ignorCase忽略大小写。

2、接收短信后页面及时刷新

要求：当有报名者成功报名后，页面会及时刷新，显示出报名信息，并给报名者回复相应的短信

思路：由于页面刷新是在活动报名页面中，那么该页面html文件对应的JS文件中肯定应该有个刷新页面的函数，而这个刷新函数是在收到正确的报名信息后被触发的，所以又需要与发送短信的model相结合

解决办法：

1)在短信处理的model中，定义如下的刷新函数

//刷新正在进行的活动报名的页面
        MessageRegister.refreshPage=function()                       //报名信息类的refreshPage刷新页面类方法
        {
         //getElementById(页面id号) :返回一个对象，这里应该是返回一个页面对象
         //也就是对应的报名页面中应该定义一个id='id_refresh_activitiesRegister'
<span style="font-size:12px;">        var page_refresh = document.getElementById('id_refresh_activitiesRegister'); 
        if (page_refresh) //如果根据id号找到对应的页面对象
        { var scope = angular.element(page_refresh).scope(); //获取对象的
          scope scope.$apply(function ()<span><span></span><span class="comment">//使用$apply()将报名页面的</span></span>thisPageRefresh()<span><span class="comment">方法包起来调用</span><span>
</span></span>         { scope.thisPageRefresh(); }); 
} };</span>

}

2)在对应的活动报名页面的controller页面中定义thisPagefresh()函数

$scope.refresh_bidDetailsPage=function()
        {
            showBidMessages();            //这里showBidMessages()是自定义的一个函数：主要功能是刷新页面绑定的短信信息/成功报名的人数
        }

3)记得在html页面中绑定id号（其实这应该是第一步）

  <ul class="list-style-2"  id="id_refresh_bidDetailsPage"> ……</ul>

3.发送短信

要求：不符合格式要求的信息，不保存不回复；符合格式要求的信息，根据活动情况进行3种回复（成功报名，活动结果，还未开始）

思路：

将目前的活动状态进行分类考虑，最多有四种状态，即

case "begin":活动正常开始中
 case "begin_activitycreate":活动开始中，用户还创建了新的活动
 case "end":活动正常结束，还没有创建新的活动
 case "end_activitycreate":活动正常结束后，用户又创建了新的活动

解决办法：

witch( 获取当前活动状态)
            {
                case "begin":
        //                        console.log('恭喜，报名成功！');
                    MessageRegister.saveRegisterMessage(json_message);     //存信息
                    MessageRegister.refreshPage();                         //刷新页面
                    native_accessor.send_sms(json_message.messages[0].phone,'恭喜，报名成功！');
                    break;
                case "begin_activitycreate":
        //                        console.log('恭喜，报名成功！');
                    MessageRegister.saveRegisterMessage(json_message);
                    MessageRegister.refreshPage();
                    native_accessor.send_sms(json_message.messages[0].phone,'恭喜，报名成功！');
                    break;
                case "end":
                    native_accessor.send_sms(json_message.messages[0].phone,'Sorry，活动报名已结束!');
        //                        console.log('Sorry，活动报名已结束!');
                    break;
                case "end_activitycreate":
                    native_accessor.send_sms(json_message.messages[0].phone,'活动尚未开始，请稍后！');
        //                      console.log('活动尚未开始，请稍后！');
                case "end_bidcreate":
                    break;
            }

注意：（1）这里console.log()模拟了短信回复;(2）只有信息正确，且活动状态为begin，begin_activitycreate时才存短信，刷新页面，其他情况不予存储；（3）回复短信利用了android的一些机制，目前还不太清楚，这里就不说了，我们只需要懂得调用这个功能函数就OK 啦。（4）回复短信最好在页面刷新之后，因为可能由于基站或者手机运行商或者手机权限的问题，回复短信一直不成功，这样可能会导致程序不会执行页面刷新函数，不方便查找问题。

4、正在进行的活动底色为黄色

首先自己定义一个css颜色样式

.begin-yellow{
    background: yellow !important
    /*!important的意思是：可能原来的css中就有颜色控制,这时候如不加此句,则颜色可能会显示不出来*/
}

然后在对应的html中，定义一个变量类，使用对象绑定，并使activity.status成为存储中的一个元素

<li ng-repeat="activity in Activities"
            ng-click="goRegister(activity.activity_name)"
            class={{showYellow(activity.activity_name)}}>
            <span class="header-left " >{{activity.activity_name}}</span>
            <span class="header-right" > > </span>
 </li>

这里showYellow（）是自定义的一个函数，它会返回一个字符串，即类选择器名称或者其他。

5.几个按钮的变化

思路：按钮的变化就是根据当前的活动状态来变化的。比如：活动报名页面的开始/结束：一共有三个状态（开始可用/结束可用/开始不可用），与活动状态就有一定的对应关系

解决办法：

<div class="header-right"  ng-switch="the_button_status">
        <!--三种状态：开始可用show_begin，开始不可用disabled_begin,结束可用show_end-->
        <button ng-switch-when="show_end"        class="btn-style btn-4 " ng-click="endRegister()">结束</button>
        <button ng-switch-when="disabled_begin"  class="btn-style btn-4 " ng-click="beginRegister()" ng-disabled="true">开始</button>
        <button ng-switch-when="show_begin"      class="btn-style btn-4 " ng-click="beginRegister()" >开始</button>
        <button ng-switch-default                class="btn-style btn-4"  ng-click="beginRegister()" >开始</button>
</div>

然后在对应的controller中，对the_button_status的状态进行控制，就OK 啦

6.点击结束后的确认提示框

 $scope.endBidDetails=function()
        {
            if(confirm('确认要结束本次竞价吗？'))
            {
                ……
            }
         }

JavaScript提供弹出对话框，有：

alert（）只接受一个字符串参数，用来给予用户提示吧；

prompt（）是一个询问框，等待用户输入结果，当用户输入完成后，点击确认会将输入的字符串返回了；如果用户点击了取消则会返回null；

confirm（）：是一个Yes/No确认框，如果回答是yes返回true，如果回答是no，则返回false。只有一个字符串参数，作为确认框的标题。

7.数据结构

每个人定义的数据结构都不一样，在做卡的过程中也会不断的重构数据结构，这里我就不讲自己的结构是怎么样的，推荐一篇博客，主要是对数据结构存储的方法进行讲解http://a904143034.iteye.com/blog/2099284

party-bid第二张卡 小结

party-bid第二张卡小结