From 91a89dcc51915aee741e90f4a93dde3753b1f9cd Mon Sep 17 00:00:00 2001
From: hellolujian <jian.lu@globalfreepay.com>
Date: Fri, 24 Aug 2018 17:45:43 +0800
Subject: [PATCH] =?UTF-8?q?[fix]=E5=95=86=E6=88=B7=E5=8F=B7=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=E9=A1=B5=E9=9D=A2=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../payment/merchantid/merchant_id_manager.js | 64 ++++++++++++++++---
 .../templates/merchant_id_manage.html         |  4 +-
 .../templates/no_trade_sub_merchant_id.html   | 55 ++++++++++++----
 3 files changed, 98 insertions(+), 25 deletions(-)

diff --git a/src/main/ui/static/payment/merchantid/merchant_id_manager.js b/src/main/ui/static/payment/merchantid/merchant_id_manager.js
index fea7a0443..a882aa33e 100644
--- a/src/main/ui/static/payment/merchantid/merchant_id_manager.js
+++ b/src/main/ui/static/payment/merchantid/merchant_id_manager.js
@@ -23,20 +23,20 @@ define(['angular', 'static/commons/commons', 'uiBootstrap', 'uiRouter', 'ngBootS
 
         // 前端渲染的end索引
         $scope.endIndexMap = {};
-        // 初始化索引是60
-        const initEndIndex = 60;
+        // 初始化索引是30
+        $scope.initEndIndex = 30;
         $scope.loadClient = function () {
              $http.get('/sys/merchant_id').then(function (resp) {
                  $scope.clientsMap = resp.data;
                  $scope.client_loading = false;
 
                  // 加入对应项的end索引值
-                 // 如果数据小于60，索引值为数据长度
-                 // 否则设置为60
+                 // 如果数据小于initEndIndex，索引值为数据长度
+                 // 否则设置为initEndIndex
                  for (var key in $scope.clientsMap) {
-                     $scope.endIndexMap[key] = initEndIndex;
+                     $scope.endIndexMap[key] = $scope.initEndIndex;
                      var length = $scope.clientsMap[key].length;
-                     if (length <= initEndIndex)
+                     if (length <= $scope.initEndIndex)
                          $scope.endIndexMap[key] = length;
 
                  }
@@ -46,12 +46,12 @@ define(['angular', 'static/commons/commons', 'uiBootstrap', 'uiRouter', 'ngBootS
 
         /**
          * 点击更多加载
-         * 判断加60后的索引是否超出数组长度
+         * 判断加initEndIndex后的索引是否超出数组长度
          * @param key
          */
         $scope.more = function(key) {
 
-            var endIndex = $scope.endIndexMap[key] + initEndIndex;
+            var endIndex = $scope.endIndexMap[key] + $scope.initEndIndex;
             $scope.endIndexMap[key] = endIndex;
 
             if (endIndex > $scope.clientsMap[key].length) {
@@ -65,9 +65,9 @@ define(['angular', 'static/commons/commons', 'uiBootstrap', 'uiRouter', 'ngBootS
          * @param key
          */
         $scope.packup = function(key) {
-            $scope.endIndexMap[key] = initEndIndex;
+            $scope.endIndexMap[key] = $scope.initEndIndex;
             var length = $scope.clientsMap[key].length;
-            if (length <= initEndIndex)
+            if (length <= $scope.initEndIndex)
                 $scope.endIndexMap[key] = length;
         };
 
@@ -87,12 +87,27 @@ define(['angular', 'static/commons/commons', 'uiBootstrap', 'uiRouter', 'ngBootS
         $scope.params = {};
         $scope.isCollapsed = true;
 
+        // 前端渲染的end索引
+        $scope.endIndexMap = {};
+        // 初始化索引是30
+        $scope.initEndIndex = 30;
+
         $scope.loadNotTradeClient = function () {
             $scope.disable_button = true;
             $http.get('/sys/merchant_id/trade').then(function (resp) {
                 $scope.notTradeClientsMap = resp.data.merchant_id_map;
                 $scope.refresh_time = resp.data.refresh_time;
                 $scope.disable_button = false;
+
+                // 加入对应项的end索引值
+                // 如果数据小于initEndIndex，索引值为数据长度
+                // 否则设置为initEndIndex
+                for (var key in $scope.notTradeClientsMap) {
+                    $scope.endIndexMap[key] = $scope.initEndIndex;
+                    var length = $scope.notTradeClientsMap[key].length;
+                    if (length <= $scope.initEndIndex)
+                        $scope.endIndexMap[key] = length;
+                }
             });
         };
         $scope.loadNotTradeClient();
@@ -116,6 +131,35 @@ define(['angular', 'static/commons/commons', 'uiBootstrap', 'uiRouter', 'ngBootS
                 size: 'sm'
             })
         };
+
+        /**
+         * 点击更多加载
+         * 判断加initEndIndex后的索引是否超出数组长度
+         * @param key
+         */
+        $scope.more = function(key) {
+
+            var endIndex = $scope.endIndexMap[key] + $scope.initEndIndex;
+            $scope.endIndexMap[key] = endIndex;
+
+            if (endIndex > $scope.notTradeClientsMap[key].length) {
+                $scope.endIndexMap[key] = $scope.notTradeClientsMap[key].length;
+            }
+
+        };
+
+        /**
+         * 收起
+         * @param key
+         */
+        $scope.packup = function(key) {
+
+            $scope.endIndexMap[key] = $scope.initEndIndex;
+
+            var length = $scope.notTradeClientsMap[key].length;
+            if (length <= $scope.initEndIndex)
+                $scope.endIndexMap[key] = length;
+        };
     }]);
     app.controller('showClientsCtrl', ['$scope', '$http','qrJson', function ($scope, $http,qrJson) {
         $scope.qrJson = qrJson.data;
diff --git a/src/main/ui/static/payment/merchantid/templates/merchant_id_manage.html b/src/main/ui/static/payment/merchantid/templates/merchant_id_manage.html
index 608e5bc56..8fb25455d 100644
--- a/src/main/ui/static/payment/merchantid/templates/merchant_id_manage.html
+++ b/src/main/ui/static/payment/merchantid/templates/merchant_id_manage.html
@@ -156,7 +156,7 @@
                                         </a>
                                         -->
 
-                                        <a ng-if="clients.length > 60"
+                                        <a ng-if="clients.length > initEndIndex"
                                            class="list-group-item col-sm-12 col-xs-12 text-center" >
                                             <span class="small-box-footer cursor"
                                                   ng-click="more(key)"
@@ -165,7 +165,7 @@
                                             </span>
                                             <span class="small-box-footer cursor pull-right"
                                                   ng-click="packup(key)"
-                                                  ng-if="endIndexMap[key] > 60">
+                                                  ng-if="endIndexMap[key] > initEndIndex">
                                                 收起 <i class="fa fa-arrow-circle-up"></i>
                                             </span>
                                         </a>
diff --git a/src/main/ui/static/payment/merchantid/templates/no_trade_sub_merchant_id.html b/src/main/ui/static/payment/merchantid/templates/no_trade_sub_merchant_id.html
index ed0bcf80d..925e83c5c 100644
--- a/src/main/ui/static/payment/merchantid/templates/no_trade_sub_merchant_id.html
+++ b/src/main/ui/static/payment/merchantid/templates/no_trade_sub_merchant_id.html
@@ -15,26 +15,55 @@
             <loadingbar ng-if="disable_button"></loadingbar>
             <div>
                 <div class="list-group col-sm-12 col-xs-12"
-                     ng-repeat="(key,clients) in notTradeClientsMap">
+                     ng-repeat="(key, clients) in notTradeClientsMap">
+                    <!--
                     <a class="list-group-item active col-sm-12 col-xs-12">
                         {{key|choose_merchant_id}}
                         <span ng-show="clients.length>59" class="small-box-footer cursor pull-right" ng-click="isCollapsed = !isCollapsed">更多 <i class="fa fa-arrow-circle-right" ng-class="{'i-rotate_90':!isCollapsed}"></i></span>
                     </a>
+                    -->
                     <a class="list-group-item col-sm-2 col-xs-6 cursor"
-                       ng-repeat="client in clients | orderBy:'client_count':true"
-                       ng-click="showClient(client.sub_merchant_id)" ng-if="$index<60">
-                                        <span>{{client.sub_merchant_id}}&nbsp;<i class="fa fa-clock-o text-danger"
-                                                                                 title="Temp Sub Merchant ID"
-                                                                                 ng-if="client.temp_sub_merchant"></i></span>
-                        <span class="badge" aria-hidden="true" title="show detail">{{client.client_count}}</span>
+                       ng-repeat="client in clients.slice(0, endIndexMap[key]) | orderBy:'client_count':true"
+                       ng-click="showClient(client.sub_merchant_id)">
+                        <span>{{client.sub_merchant_id}}&nbsp;
+                            <i class="fa fa-clock-o text-danger"
+                               title="Temp Sub Merchant ID"
+                               ng-if="client.temp_sub_merchant">
+                            </i>
+                        </span>
+                        <span class="badge" aria-hidden="true" title="show detail">
+                            {{client.client_count}}
+                        </span>
                     </a>
-                    <a class="list-group-item col-sm-2 col-xs-6 cursor" ng-hide="isCollapsed"
+                    <!--
+                    <a class="list-group-item col-sm-2 col-xs-6 cursor"
+                       ng-hide="isCollapsed"
                        ng-repeat="client in clients | orderBy:'client_count':true"
-                       ng-click="showClient(client.sub_merchant_id)" ng-if="$index>59">
-                                        <span>{{client.sub_merchant_id}}&nbsp;<i class="fa fa-clock-o text-danger"
-                                                                                 title="Temp Sub Merchant ID"
-                                                                                 ng-if="client.temp_sub_merchant"></i></span>
-                        <span class="badge" aria-hidden="true" title="show detail">{{client.client_count}}</span>
+                       ng-click="showClient(client.sub_merchant_id)"
+                       ng-if="$index>59">
+                        <span>{{client.sub_merchant_id}}&nbsp;
+                            <i class="fa fa-clock-o text-danger"
+                               title="Temp Sub Merchant ID"
+                               ng-if="client.temp_sub_merchant">
+                            </i>
+                        </span>
+                        <span class="badge" aria-hidden="true" title="show detail">
+                            {{client.client_count}}
+                        </span>
+                    </a>
+                    -->
+                    <a ng-if="clients.length > initEndIndex"
+                       class="list-group-item col-sm-12 col-xs-12 text-center" >
+                        <span class="small-box-footer cursor"
+                              ng-click="more(key)"
+                              ng-if="endIndexMap[key] < clients.length">
+                            更多 <i class="fa fa-arrow-circle-down"></i>
+                        </span>
+                        <span class="small-box-footer cursor pull-right"
+                              ng-click="packup(key)"
+                              ng-if="endIndexMap[key] > initEndIndex">
+                            收起 <i class="fa fa-arrow-circle-up"></i>
+                        </span>
                     </a>
                 </div>
             </div>