angularjs實現一鍵短信(單純的前端操作)

一鍵短信

1. angularjs實現發短信功能
   後端會給接口和字段，短信內容你也不用管
   1.1 在按鈕的地方，添加一個點擊事件，事件裏面傳入後端給的字段

      <button class="btn btn-primary "  ng-click="detail.sendMessage(detail.id,detail.ag_num )">一鍵短信</button>

1.2在js裏面寫發送短信的方法：
這裏的字段id，ag_num 有可能不在同一個接口幾面，取的時候要注意

 this.sendMessage = (id, ag_num) => {
      this.$http.post('/aws/send_message/', { id: this.id, ag_num: this.advisorCallInfo.ag_num }).then(res => {
        this.toastr.success('一鍵短信成功');
      }, (err) => {
        this.toastr.error('一鍵短信失敗', '😣');
      });
    };

寫發短信，其實就是調接口，傳參數。其他的後端來做
服務報200，url正確，payload裏面有後端給的數據，就成功了

1.3最後說一點：本地代碼和給你接口的後端要一致，測試代碼的接口和給你接口的後端也要一致，不然就算代碼寫對，後端也不會接到你的請求
終於----------沒有那麼簡單
產品考慮角度：
顧問萬一錯誤按下發短信，導致會騷然用戶
如果已經發送過短信，那麼就不能再給用戶發短信
實現
2.1: 後端給了兩個接口，這次的邏輯，是要先判斷是否已經發送過短信
接口一：接口一會返回一個code值，如果code值爲0，那麼可以發短信
發完短信，走第二個接口，第二個接口就是剛開始的需求
具體實現起來要注意：
3.1:post和get傳參不一樣
3.2:指行的時機(這個要和後端溝通好)
3.3:有時候會報請求4，5錯誤，在自己傳參正確的情況下，問一下後端
附上代碼，供參考

this.sendMessageUibModal = sendMsg => {
      this.$uibModal.open({
        templateUrl: addOneMessageModalTml,
        bindToController: true,
        windowClass: 'add_one_success',
        controller: ($uibModalInstance, $scope, pa) => {
          'ngInject';
          $scope.pa = pa;
          $scope.sendEnd = () => {
            this.$http.post('/aws/send_message/', { id: this.id, ag_num: this.advisorCallInfo.ag_num }).then(() => {
              this.toastr.success('一鍵短信成功');
              $uibModalInstance.close();
            }, (err) => {
              this.toastr.error('一鍵短信失敗', '😣');
            });
          };
        },
        resolve: {
          pa: () => sendMsg
        }
      });
    }
    this.sendMessage = () => {
      // 先判斷
      this.$http.get(`/aws/send_message/?id=${ this.id }&ag_num=${ this.advisorCallInfo.ag_num }&template=SMS_162446224`).then(data => {
        this.sendMsg = data.data.msg;
        if (data.data.code === 1) {
          this.toastr.info('已經發送過短信給該用戶。針對同一客戶,只能發送一次短信哦～～');
        } else if (data.data.code === 0) {
          this.sendMessageUibModal(this.sendMsg);
        }
      });
    };

一下是短信模版

<div class="modal-header">
  <h4 class="modal-title" style="text-align: center">
    短信發送內容
  </h4>
</div>
<div class="modal-body">
  <p>
    <span>{{ pa }}</span>
  </p>
</div>
<div class="modal-footer">
  <button type="button" class="btn btn-primary btn-o" ng-click="sendEnd()" style="background: #3487e2">發送</button>
  <button type="button" class="btn btn-default btn-default" ng-click="$dismiss();">取消</button>
</div>