聊天界面

talkview/src/js/controller/smsController.js

@@ -7,6 +7,7 @@ angular.module('appMessage').controller('SmsController', ['$scope', '$state', '$
     $scope.nowDate = $filter("date")($scope.now, "yyyy/MM/dd HH:mm:ss");
     $scope.selectDate = $scope.nowDate;
     $scope.checkId = false;
+    $scope.counts = 0;
 
     $scope.disable = function($event) {
         var dataForm = $($event.currentTarget.previousElementSibling.children);
@@ -27,4 +28,17 @@ angular.module('appMessage').controller('SmsController', ['$scope', '$state', '$
         activeClick.removeClass("hid");
     };
 
+    $scope.mobSet = function() {
+        var mobLen = $scope.inputMob.length;
+        if (mobLen < 12)
+            $scope.counts = 0;
+        else
+            $scope.counts = Math.floor($scope.inputMob.length / 11);
+        mobLen = mobLen - $scope.counts;
+        console.log(mobLen);
+        if (mobLen % 11 == 0 && mobLen !== 0) {
+            $scope.inputMob = $scope.inputMob + ','
+            $scope.counts = Math.floor($scope.inputMob.length / 11);
+        }
+    };
 }]);

talkview/src/less/app.main.less

@@ -40,21 +40,32 @@
 .media-body {
     width: 2500px;
     font-family: "微软雅黑","宋体";
-    font-size: 13px;
+    font-size: 12px;
     vertical-align: top;
     zoom: 1;
     p{
-        cursor:pointer;
+        cursor:default;
+        margin-bottom: -5px;
+        .glyphicon-ok {
+            color: green;
+            margin-left: 10px;
+            margin-top: 1px;
+        }
+        .glyphicon-remove {
+            color: #E35850;
+            margin-left: 10px;
+            margin-top: 2px;
+        }
     }
-    p>strong {
+    p>span {
+        margin-top: 1px;
         float: left;
         margin-left: 5px;
         color: #007FE0;
-    }
-    p>small {
-        margin-left: 4px;
-        font-size: 10px;
-        vertical-align: bottom;
+        >span {
+            font-weight: 700px;
+            margin: 0px 7px 0px 3px;
+        }
     }
 }
 

talkview/src/templates/smsSend.html

@@ -22,10 +22,28 @@
     <div id="sms-mob">
         <div class="input-group">
             <span class="input-group-addon" id="basic-addon3">手机号码</span>
-            <input type="text" class="form-control" id="basic-url" aria-describedby="basic-addon3">
+            <input type="text" class="form-control" id="basic-url" aria-describedby="basic-addon3" placeholder="请输入接收短信的手机号码，多个号码之间以逗号隔开. . ." ng-model="inputMob" ng-change="mobSet()">
         </div>
     </div>
     <div id="sms-media">
+        <div class="feed-element">
+            <div class="media-body ">
+                <p><span class="glyphicon glyphicon-menu-right"><span>短信群发</span>16:28:40</span><span class="glyphicon glyphicon-ok"></span>
+                </p>
+                <div class="well m-l-xs m-t-xs fit-content">
+                    <span class="text-message">手动建开发技术的发是打发是否阿萨德发按时大家阿萨德发 圣诞节法律考试及地方akjsdklfajs 按时大奖是离开的房间阿萨德发是对方可爱上了对方快递费阿斯顿发阿萨德发啊阿萨德f</span>
+                </div>
+            </div>
+        </div>
+        <div class="feed-element">
+            <div class="media-body ">
+                <p><span class="glyphicon glyphicon-menu-right"><span>15906422850</span>16:28:50</span><span class="glyphicon glyphicon-remove"></span>
+                </p>
+                <div class="well m-l-xs m-t-xs fit-content">
+                    <span class="text-message">手动建开发技术的发是打发是否阿萨德发按时大家阿萨德发 圣诞节法律考试及地方akjsdklfajs 按时大奖是离开的房间阿萨德发是对方可爱上了对方快递费阿斯顿发阿萨德发啊阿萨德f</span>
+                </div>
+            </div>
+        </div>
     </div>
     <div id="sms-inbox">
         <div id="sms-input" contenteditable="true">