app-overview.html

<div id="app-overview" class="app-overview ">
    <div class="app-overview-left">
        <div class="group-operate-icon" style="margin-bottom: 5px;">
            <span class="operate-icon left-first" title="机构" ng-click="dimensionOrgShow('','orgName')"><i class="fa fa-sitemap fa-2x orgName" aria-hidden="true"></i></span><span class="operate-icon" title="事业部" ng-click="dimensionOrgShow('businessUnitID','businessUnitName')">
                <i class="fa fa-bank fa-2x businessUnitName" aria-hidden="true"></i>
            </span><span class="operate-icon" title="区域" ng-click="dimensionOrgShow('areaID','areaName')">
                <i class="material-icons areaName">place</i>
            </span><span class="operate-icon" title="机构层级" ng-click="dimensionOrgShow('structureID','structureName')">
                <i class="fa fa-mortar-board fa-2x structureName"></i>
            </span><span class="operate-icon" title="行业" ng-click="dimensionOrgShow('industryID','industryName')">
                <i class="fa fa-bars fa-2x industryName" aria-hidden="true"></i>
            </span>
        </div>
        <perfect-scrollbar class="scroller" wheel-propagation="true" wheel-speed="1" min-scrollbar-length="20">
            <!--<div ng-repeat="queryItem in queryList" ng-include="'queryTemplate'"></div>
            <span class="clear"></span>-->
            <div ui-tree data-drag-enabled="false">
                <ul ui-tree-nodes="" ng-model="orgData">
                    <li ng-repeat="item in orgData track by $index" ui-tree-node ng-include="'tree_view_template'">
                    </li>
                </ul>
            </div>
        </perfect-scrollbar>
    </div>
    <div class="app-overview-right">
        <div class="row" style="margin:20px; display:none;">
            <div class="col-lg-2 col-md-2 col-sm-2">
                <span class="textLabelHeader" translate="TotalProjectRecords"></span> <span class="textLabelHeader">{{queryResults.length}}</span> <span translate="NumberOfTaskes"></span>
            </div>
            <div class="col-lg-8 col-md-8 col-sm-8">
                <span translate="CurrentlyInProgress" class=""> </span> <i class="badge progressNumberBadges marginRight10">3</i>
                <span translate="AlreadyCompleted" class=""> </span> <i class="badge progressNumberBadges marginRight10">4</i>
                <span translate="NotYetStart" class=""> </span> <i class="badge progressNumberBadges marginRight10 ">5</i>
            </div>
            <div class="col-lg-2 col-md-2 col-sm-2">
                <div id="app-workflow-action-panel" class="pull-right">
                    <i class="fa fa-calendar  red-color" style="font-size:20px;"></i>
                    <input type="text" class="datepicker" style="border-width: 0; outline: none; width: 100px; cursor: pointer; z-index: 1000" readonly="readonly" />
                    <i class="fa fa-caret-down  red-color" style="font-size:10px;"></i>
                </div>
            </div>
        </div>
        <div style="display:none;">
            <span translate="AssignmentsList" class="textLabelHeader"></span>
            <hr />
        </div>
        <div class="new-right-header">
            <div class="head-row">
                <span class="total-projects">{{systemTitle}}</span>
                <!--<div class="overview-picker">
                    <input type="text" id="overviewDatepicker" class="datepicker vat-subheader" style="width:120px;" readonly="readonly" />
                    <i class="fa fa-calendar vat-subheader red-color" style="width:20px;"></i>
                </div>-->
                <!--<span style="background-color:red"  ng-click="loginAtms()">SuperAdmin登陆Atms_index</span>-->
            </div>
            <div class="project-staus">
                <span style="padding-right: 10px;" class="result-style">{{projectMsg}}</span>
                <span translate="OnGoing" style="padding-right:10px;"></span><span class="num-style">{{ongoingNum}}</span>
                <span translate="NotBegin" style="padding-right:10px;padding-left:20px;"></span><span class="num-style">{{notBeginNum}}</span>
                <span translate="completed" style="padding-right:10px;padding-left:20px;"></span><span class="num-style">{{completedNum}}</span>
            </div>
            <div class="task-list">
                <span translate="TaskList" class="taskMsg" ng-show="serviceTypeId !=='12'"></span>
                <span class="textLabelHeader" ng-show="serviceTypeId ==='12'">资产管理产品列表</span>
                <button class="btn btn-primary" ng-show="serviceTypeId ==='12' && !updateStatus" ng-click="updateProductList()" style="min-width: 40px; width: 50px; height: 25px; margin-left: 35px; vertical-align: text-bottom; ">维护</button>
                <button class="btn btn-primary" ng-show="serviceTypeId ==='12'" && !updatestatus" ng-click="addNewProduct()" style="min-width:40px; width:50px;height:25px;margin-left:35px;vertical-align: text-bottom; ">新增</button>
            </div>
        </div>
        <div class="new-right-body">
            <div class="right-header">
                <div class="col-lg-3 col-md-3" style="padding-left:20px;">
                    <div class="search-container">
                        <input id="txtSmartSearch" class="search-input" type="text" value="" placeholder="{{'Search' | translate}}" ng-model="searchKeyword" ng-change="smartSearch(false)" /><span ng-class="(searchKeyword!==undefined && searchKeyword.length>0)? 'glyphicon glyphicon-remove input-group-addon search-icon':'glyphicon glyphicon-search input-group-addon search-icon'" search ng-click="smartSearch(true)"></span>
                    </div>
                </div>
                <div style="overflow:hidden;display:inline-block;margin-left:30px;" ng-show="serviceTypeId ==='12' && updateStatus">
                    <button type="button" class="btn btn-in-grid" ng-show="serviceTypeId ==='12' && updateStatus" ngf-select="" ng-model="productFileName" ngf-drag-over-class="'dragover'" accept=".xls,.xlsx" ngf-multiple="false" ngf-allow-dir="false"><i class="material-icons middle">add_circle_outline</i>导入</button>
                </div>
                <!--<a href="" ng-click="toggleView('workflowView')" ng-class="{true:'active',false:'inactive'}[currentView == 'workflowView']"><i class="fa fa-tasks" aria-hidden="true"></i></a>-->
                <a href="" ng-click="toggleView('listView')" ng-class="{true:'active',false:'inactive'}[currentView == 'listView']"><i class="fa fa-list-ul" aria-hidden="true"></i></a>
                <a href="" ng-click="toggleView('cardView')" ng-class="{true:'active',false:'inactive'}[currentView == 'cardView']"><i class="fa fa-th" aria-hidden="true"></i></a>
                <div class="button-sort" ng-if="currentView == 'cardView'">
                    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                        {{ 'OrderBy' | translate }}<span class="glyphicon glyphicon-sort"></span>
                    </button>
                    <ul class="dropdown-menu">
                        <li ng-click="fileSort('year')">
                            &nbsp;&nbsp;{{ 'OrderyByYear' | translate }}&nbsp;&nbsp;
                            <i class="fa fa-sort-amount-asc" ng-if="orderYear" aria-hidden="true"></i>
                            <i class="fa fa-sort-amount-desc" ng-if="!orderYear" aria-hidden="true"></i>
                        </li>
                        <li ng-click="fileSort('name')">
                            &nbsp;&nbsp;{{ 'OrderyByName' | translate }}&nbsp;&nbsp;
                            <i class="fa fa-sort-amount-asc" ng-if="orderName" aria-hidden="true"></i>
                            <i class="fa fa-sort-amount-desc" ng-if="!orderName" aria-hidden="true"></i>
                        </li>
                        <li ng-click="fileSort('status')">
                            &nbsp;&nbsp;{{ 'OrderyByStatus' | translate }}&nbsp;&nbsp;
                            <i class="fa fa-sort-amount-asc" ng-if="orderStatus" aria-hidden="true"></i>
                            <i class="fa fa-sort-amount-desc" ng-if="!orderStatus" aria-hidden="true"></i>
                        </li>
                        <li ng-click="fileSort('type')">
                            &nbsp;&nbsp;{{ 'OrderyByServiceType' | translate }}&nbsp;&nbsp;
                            <i class="fa fa-sort-amount-asc" ng-if="orderType" aria-hidden="true"></i>
                            <i class="fa fa-sort-amount-desc" ng-if="!orderType" aria-hidden="true"></i>
                        </li>
                    </ul>
                </div>
                <div class="button-sort" ng-if="currentView == 'workflowView'">
                    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                        {{ 'OrderBy' | translate }}<span class="glyphicon glyphicon-sort"></span>
                    </button>
                    <ul class="dropdown-menu">

                        <li ng-click="doWorkflowSort('name')">
                            &nbsp;&nbsp;{{ 'OrderyByName' | translate }}&nbsp;&nbsp;
                            <i class="fa fa-sort-amount-asc" ng-if="orderName" aria-hidden="true"></i>
                            <i class="fa fa-sort-amount-desc" ng-if="!orderName" aria-hidden="true"></i>
                        </li>
                        <li ng-click="doWorkflowSort('status')">
                            &nbsp;&nbsp;{{ 'OrderyByStatus' | translate }}&nbsp;&nbsp;
                            <i class="fa fa-sort-amount-asc" ng-if="orderStatus" aria-hidden="true"></i>
                            <i class="fa fa-sort-amount-desc" ng-if="!orderStatus" aria-hidden="true"></i>
                        </li>
                    </ul>
                </div>
                <div class="overview-picker">
                    <input type="text" id="overviewDatepicker" class="datepicker vat-subheader" style="width:120px;" readonly="readonly" />
                    <i class="fa fa-calendar vat-subheader red-color" style="width:20px;"></i>
                </div>
                <span class="clear"></span>
            </div>
            <perfect-scrollbar class="scroller" style="height:104%;" ng-if="currentView == 'cardView'" wheel-propagation="true" wheel-speed="1" min-scrollbar-length="20">
                <div class="cardViewWrapper" ng-model="queryResults">
                    <div ng-repeat="result in queryResults track by $index" ng-include="'card_view_template'"> </div>
                </div>
            </perfect-scrollbar>
            <!--<div style="color:red">{{totolCount}}</div>-->
            <div class="listView" ng-if="currentView == 'listView'" dx-data-grid="gridListOptions" id="gridContainer2"></div>
            <perfect-scrollbar class="scroller" style="height:104%;" ng-if="currentView == 'workflowView'" wheel-propagation="true" wheel-speed="1" min-scrollbar-length="20">
                <app-workflow u-condition-change="conditionChange" u-filter-keyword="searchKeyword" u-sort-keyword="sortString"></app-workflow>
            </perfect-scrollbar>
        </div>
    </div>
    <script type="text/ng-template" id="queryTemplate">
        <div class="nav-wrapper">
            <div class="nav-header"><span>{{queryItem.title}}</span><span class="rightfloat"><i class="fa fa-angle-down" ng-click="toggleExpand(queryItem)" ng-show="queryItem.expand"></i><i class="fa fa-angle-up" ng-click="toggleExpand(queryItem)" ng-show="!queryItem.expand"></i></span></div>
            <div ng-if="queryItem.expand">
                <perfect-scrollbar class="scroller" wheel-propagation="true" wheel-speed="1" min-scrollbar-length="20">
                    <div class="treeview" ng-if="queryItem.type=='treeview'">
                        <div ui-tree data-drag-enabled="false" style="border:0;" ng-if="queryItem.source&&queryItem.source.length>0">
                            <ul ui-tree-nodes="" ng-model="queryItem.source">
                                <li ng-repeat="item in queryItem.source track by $index" ui-tree-node ng-include="'tree_view_template'">
                                </li>
                            </ul>
                        </div>
                    </div>
                </perfect-scrollbar>
                <!--<div class="radiobox" ng-if="queryItem.type=='radiobox'">
                    <div class="li" ng-repeat="item in queryItem.source">
                        <span ng-click="toggleRadioBox(item, queryItem.source, queryItem)" ng-class="{true:'active',false:'inactive'}[item.isSelected]">{{item.prefix}}</span>
                    </div>
                </div>

                <div class="year" ng-if="queryItem.type=='checkbox'">
                    <div class="li" ng-repeat="item in queryItem.source">
                        <input type="checkbox" style="position:static;margin-top:0;margin-left:0;" ng-model="item.isChecked" ng-click="toggleCheckBox(item, queryItem.source, queryItem)" />
                        <span>{{item.name}}</span>
                    </div>
                </div>-->
            </div>
        </div>
    </script>
    <script type="text/ng-template" id="tree_view_template">
        <div ng-if="item.subOrgs && item.subOrgs.length > 0" class="expander-container">
            <i class="fa fa-plus tree-i" aria-hidden="true" ng-click="toggle(this)" ng-class="{hidden: !collapsed}"></i>
            <i class="fa fa-minus tree-i" aria-hidden="true" ng-click="toggle(this)" ng-class="{hidden: collapsed}"></i>
        </div>
        <div ui-tree-handle>
            <input type="checkbox" ng-model="item.isChecked" ng-click="toggleItemSub(item, queryItem)" />
            <div class="tree-menu-item" ng-class="{'active':selectedItem == item}" ng-click="toggleItemSubSpan(item)" ng-bind-template="{{item.name}}" title="{{item.name}}"></div>
        </div>
        <ul ui-tree-nodes="" ng-model="item.subOrgs" ng-class="{hidden: collapsed}">
            <li ng-repeat="item in item.subOrgs" ui-tree-node ng-include="'tree_view_template'">
            </li>
        </ul>
    </script>
    <script type="text/ng-template" id="card_view_template">
        <div class="cardview pwc-float-shadow" ng-click="goToService(result)">
            <div class="cardview-header">
                <span class="org-name" title="{{result.organizationName}}">{{result.organizationName | limitString:17}}</span>
                <span ng-show="(result.taxRate>0 && result.hasWarning)">
                    <i class="fa fa-exclamation-circle" title="模型异常" style="color: orange; " aria-hidden="true"></i>
                    <i class="fa fa-exclamation-triangle" title="风险提示" style="color:pink; margin-left:8px;" aria-hidden="true"></i>
                    <i class="fa fa-question-circle" aria-hidden="true" title="报表异常" style="color:lightpink; margin-left: 8px;margin-right:16px;"></i>
                </span>
            </div>
            <div class="cardview-body">
                <div class="body-top-caption">
                    <span class="industry-name" title="{{result.serviceTypeName}}">{{result.serviceTypeName | limitString:20}}</span>
                    <span class="industry-name" title="{{result.industryName}}">{{result.industryName | limitString:20}}</span>
                    <span class="industry-name" title="{{result.regionName}}">{{result.regionName | limitString:20}}</span>
                </div>
                <div class="body-icon">
                    <img src="{{result.finalStatus}}" />
                </div>
                <div class="body-name">
                    <div class="org-name"><span>{{'TaxBurdenRatio' | translate}}: </span><span>{{result.taxRate}}%</span></div>
                    <!--<div class="org-name" ng-show="serviceTypeId ==='6'"><span>预缴额: </span><span>{{result.prepadidTaxAmount | number}}元</span></div>-->
                    <div class="org-name"><span>{{'TaxPayment' | translate}}: </span><span>{{result.taxAmount | number}}{{'Yuan' | translate}}</span></div>
                    <div class="org-name"><span>{{'ProjectPeriod' | translate}}: </span><span> {{result.periodDate}}</span></div>

                </div>
            </div>
            <!--<div class="cardview-footer">
                <span>{{result.finalstatus}}</span>
                <span ng-style="{'color':(result.color)}">{{result.projectstatusdisplay}}</span>
            </div>-->
        </div>
        <!--<div class="cardview pwc-float-shadow" ng-if="result.haveCreateProject ==false" style="cursor:default;">
            <div class="cardview-header">
                <span>{{result.serviceTypeName}}</span>
                <span style="color:#808080;font-size: 12px;">{{result.yearDisplay}}</span>
            </div>
            <div class="cardview-body">
                <div class="body-icon">
                    <span><i class="{{result.serviceIcon}} service-icon" aria-hidden="true" style="color:#808080;"></i></span>
                </div>
                <div class="body-name">
                    <div class="org-name" title="{{result.organizationName}}">{{result.organizationName | limitString:20}}</div>
                    <div class="industry-name" title="{{result.industryName}}">{{result.industryName | limitString:20}}</div>
                </div>
            </div>
            <div class="cardview-footer">
                <span>{{result.projectStatusDisplay}}<i class="fa fa-play-circle start-icon" aria-hidden="true" ng-style="{'color':(result.color)}" ng-click="goToService(result)"></i></span>
            </div>
        </div>-->
    </script>

    <script type="text/ng-template" id="addNewProduct.html">
        <div class="modal-header">
            <div class="modal-title" id="modal-title">新增产品</div>
        </div>
        <div class="modal-body" id="modal-body">
            <div class="content">
                <form name="add-product-form" id="add-product-form" class="form-horizontal">
                    <div class="form-group" style="margin-bottom:5px">
                        <label for="year" class="col-sm-3 control-label">年份</label>
                        <div class="col-sm-8 input-group">
                            <input class="form-control" name="year" id="year" ng-model="product.fYear" maxlength="50">
                        </div>
                    </div>

                    <div class="form-group" style="margin-bottom:5px">
                        <label for="setId" class="col-sm-3 control-label">产品标识</label>
                        <div class="col-sm-8 input-group">
                            <input class="form-control" name="setId" id="setId" ng-model="product.fSetId" maxlength="50">
                        </div>
                    </div>
                    <div class="form-group" style="margin-bottom:5px">
                        <label for="setCode" class="col-sm-3 control-label">产品编号</label>
                        <div class="col-sm-8 input-group">
                            <input class="form-control" name="setCode" id="setCode" ng-model="product.fSetCode" maxlength="50">
                        </div>
                    </div>
                    <div class="form-group" style="margin-bottom:5px">
                        <label for="aliaSetCode" class="col-sm-3 control-label">关联产品</label>
                        <div class="col-sm-8 input-group">
                            <div class="dx-field-value" style="width:265px">
                                <div dx-drop-down-box="treeBoxOptions">
                                    <div data-options="dxTemplate: { name: 'content' }">
                                        <div dx-tree-view="treeBoxOptions.treeView"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="form-group" style="margin-bottom:5px">
                        <label for="setName" class="col-sm-3 control-label">产品描述</label>
                        <div class="col-sm-8 input-group">
                            <input class="form-control" name="setName" id="setName" ng-model="product.fSetName" maxlength="50">
                        </div>
                    </div>

                    <div class="form-group" style="margin-bottom:5px">
                        <label for="manager" class="col-sm-3 control-label">财务主管</label>
                        <div class="col-sm-8 input-group">
                            <input class="form-control" name="manager" id="manager" ng-model="product.fManager" maxlength="50">
                        </div>
                    </div>

                    <div class="form-group" style="margin-bottom:5px">
                        <label for="startDate" class="col-sm-3 control-label">启用日期</label>
                        <div class="overview-picker">
                            <input type="text" id="productStartDate" class="datepicker vat-subheader" style="width:200px;" readonly="readonly" />
                            <i class="fa fa-calendar vat-subheader red-color" style="width:20px;"></i>
                        </div>
                    </div>
                </form>
            </div>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-primary" ng-click="modalService.newProductModal.save()">{{'Confirm' | translate }}</button>
            <button type="button" class="btn btn-third" data-dismiss="modal" ng-click="modalService.newProductModal.cancel()">{{'Cancel' | translate }}</button>
        </div>
    </script>
</div>