[fix]商户号管理页面优化

master
hellolujian 6 years ago
parent 0fe6d492f4
commit 91a89dcc51

@ -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;

@ -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>

@ -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>

Loading…
Cancel
Save