zoukankan      html  css  js  c++  java
  • 表格加滚动条,首列固定

    <div class="box box-default">
    <div class="row">
    <div class="col-md-12">
    <div class="col-md-12" style="overflow:scroll;overflow-x: scroll;overflow-y: scroll;max-height:540px;">
    <table class="table table-condensed table-bordered table-hover" style="2250px;min-2250px;">
    <thead>
    <tr>
    <th width="80" style="vertical-align:middle; position:sticky; left:0px; z-index:999; background-color:white;" class="text-center">姓名</th>
    <th width="150" style="vertical-align:middle; position:sticky; left:80px; z-index:999; background-color:white;" class="text-center">身份证号码</th>
    <th width="50" style="vertical-align:middle" class="text-center">性别</th>
    <th width="50" style="vertical-align:middle" class="text-center">
    <input type="checkbox" icheck ng-model="vm.checkedAll" ng-change="vm.selectAll()">
    </th>
    <th width="200" style="vertical-align:middle" class="text-center">所在单位</th>
    <th width="400" style="vertical-align:middle" class="text-center">所属协议</th>
    <th width="80" style="vertical-align:middle" class="text-center">人员状态</th>
    <th width="100" style="vertical-align:middle" class="text-center">入职时间</th>
    <th width="80" style="vertical-align:middle" class="text-center">社保月缴</th>
    <th width="100" style="vertical-align:middle" class="text-center">公积金月缴</th>
    <th width="60" style="vertical-align:middle" class="text-center">合同</th>
    <th width="60" style="vertical-align:middle" class="text-center">商业险</th>
    <th width="80" style="vertical-align:middle" class="text-center">客服</th>
    <th width="530" colspan="2" style="vertical-align:middle" class="text-center">操作</th>
    </tr>
    </thead>
    <tbody ng-repeat="item in vm.gridOptions.data" style="border-top:none;">
    <tr ng-repeat="itemitem in item.employeeCompanies||{}">
    <td rowspan="{{item.employeeCompanies.length}}" ng-show="$index==0" style="vertical-align:middle; position:sticky; left:0px; z-index:999; background-color:white;" class="text-center">
    @*{{item.realName}}*@
    <a show-employee="{{item.id}}" href="javascript:void(0);" title="{{item.realName}}">{{item.realName}}</a>
    </td>
    <td rowspan="{{item.employeeCompanies.length}}" ng-show="$index==0" style="vertical-align:middle; position:sticky; left:80px; z-index:999; background-color:white;" class="text-center">{{item.identityCard}}</td>
    <td rowspan="{{item.employeeCompanies.length}}" ng-show="$index==0" style="vertical-align:middle" class="text-center">{{item.sexText}}</td>
    <td style="vertical-align:middle" class="text-center">
    <input type="checkbox" icheck ng-model="itemitem.checked" ng-change="vm.selectParentOne(itemitem)">
    </td>
    <td style="vertical-align:middle" class="text-center">{{itemitem.companyName}}</td>
    <td style="vertical-align:middle" class="text-center">{{itemitem.agreementNameText}}[{{itemitem.agreementCode}}]<span ng-show="itemitem.agreementTitle">({{itemitem.agreementTitle}})</span></td>
    <td style="vertical-align:middle" class="text-center" ng-class="itemitem.jobStatusText=='在职'? 'text-success':'text-danger'">{{itemitem.jobStatusText}}</td>
    <td style="vertical-align:middle" class="text-center">{{itemitem.entryTimeText}}</td>
    <td style="vertical-align:middle" class="text-center" ng-class="itemitem.isSocialsecurityText=='缴纳'? 'text-success':'text-danger'">{{itemitem.isSocialsecurityText}}</td>
    <td style="vertical-align:middle" class="text-center" ng-class="itemitem.isProvidentfundText=='缴纳'? 'text-success':'text-danger'">{{itemitem.isProvidentfundText}}</td>
    @*<td style="vertical-align:middle" class="text-center" ng-class="itemitem.isContractText=='未签'? 'text-danger':'text-success'">{{itemitem.isContractText}}</td>*@


    <td style="vertical-align:middle" class="text-center" ng-class="itemitem.isContractText=='未签'? 'text-danger':'text-success'">
    <span ng-if="itemitem.isContract1==true" class="text-success">{{itemitem.isContractText}}</span>
    <span ng-if="itemitem.isContract1==false" class="text-danger">无</span>
    </td>

    <td style="vertical-align:middle" class="text-center" ng-class="itemitem.isCommercesText=='不缴纳'? 'text-danger':'text-success'">{{itemitem.isCommercesText}}</td>
    <td style="vertical-align:middle" class="text-center">{{itemitem.customerServiceName}}</td>
    <td style="vertical-align:middle; 200px;" class="text-center">
    <div class="ui-grid-cell-contents">
    <div class="btn-group">
    @*<a ng-if="itemitem.jobStatusText=='在职' && itemitem.isDepartureButton!=true" class="btn btn-xs btn-default" ng-click="vm.departureEntity(itemitem)" href="" title="离职"><i class="fa fa-fw fa-edit"></i>离职</a>*@
    <a ng-if="itemitem.isDepartureButton!=true" class="btn btn-xs btn-default" ng-click="vm.departureEntity(item, itemitem)" href="" title="离职"><i class="fa fa-fw fa-edit"></i>离职</a>
    <a class="btn btn-xs btn-default" ng-click="vm.employeeCompany(itemitem.employeeId,itemitem)" href="" title="修改人员单位信息"><i class="fa fa-fw fa-edit"></i>修改人员单位</a>
    <div class="btn-group dropdown" uib-dropdown="" dropdown-append-to-body>
    <button class="btn btn-xs btn-default" uib-dropdown-toggle="">更多<span class="caret"></span></button>
    <ul uib-dropdown-menu class="dropdown-menu-right ui-grid-dropdown">
    <li ng-if="vm.permissions.socialsecurityCustomerServiceRead"><a ng-click="vm.toSocialsecurity(1,1,1,item,itemitem)" href=""><i class="fa fa-fw fa-list"></i>社保管理(客服简洁)</a></li>
    <li ng-if="vm.permissions.socialsecurityCustomerServiceRead"><a ng-click="vm.toSocialsecurity(1,1,2,item,itemitem)" href=""><i class="fa fa-fw fa-list"></i>社保管理(客服详细)</a></li>
    <li ng-if="vm.permissions.socialsecurityDeclarerRead"><a ng-click="vm.toSocialsecurity(1,2,1,item,itemitem)" href=""><i class="fa fa-fw fa-list"></i>社保管理(申报简洁)</a></li>
    <li ng-if="vm.permissions.socialsecurityDeclarerRead"><a ng-click="vm.toSocialsecurity(1,2,2,item,itemitem)" href=""><i class="fa fa-fw fa-list"></i>社保管理(申报详细)</a></li>
    <li ng-if="vm.permissions.socialsecuritySaleManRead"><a ng-click="vm.toSocialsecurity(1,1,1,item,itemitem)" href=""><i class="fa fa-fw fa-list"></i>社保管理(业务简洁)</a></li>
    <li ng-if="vm.permissions.socialsecuritySaleManRead"><a ng-click="vm.toSocialsecurity(1,1,2,item,itemitem)" href=""><i class="fa fa-fw fa-list"></i>社保管理(业务详细)</a></li>
    <li ng-if="vm.permissions.providentfundCustomerServiceRead"><a ng-click="vm.toSocialsecurity(2,1,0,item,itemitem)" href=""><i class="fa fa-fw fa-list"></i>公积金管理(客服)</a></li>
    <li ng-if="vm.permissions.providentfundDeclarerRead"><a ng-click="vm.toSocialsecurity(2,2,0,item,itemitem)" href=""><i class="fa fa-fw fa-list"></i>公积金管理(申报)</a></li>
    <li ng-if="vm.permissions.providentfundSaleManRead"><a ng-click="vm.toSocialsecurity(2,1,0,item,itemitem)" href=""><i class="fa fa-fw fa-list"></i>公积金管理(业务)</a></li>
    <li><a ng-if="vm.permissions.contractRead" ng-click="vm.toContract(item,itemitem)" href=""><i class="fa fa-fw fa-list"></i>合同</a></li>
    <li ng-if="vm.permissions.createAccount&&!itemitem.isPersonalAgentAccount"><a ng-click="vm.createPersonalAgentAccount(itemitem)" href=""><i class="fa fa-fw fa-plus"></i>创建个代账户</a></li>
    <li ng-if="vm.permissions.applyOcptInjury"><a ng-click="vm.createOrEditOcptInjury(itemitem.employeeId,itemitem)" href=""><i class="fa fa-fw fa-edit"></i>申请工伤</a></li>
    </ul>
    </div>
    </div>
    </div>
    </td>
    <td style="vertical-align:middle; 400px;" class="text-center" rowspan="{{item.employeeCompanies.length}}" ng-show="$index==0">
    <div class="ui-grid-cell-contents">
    <div class="btn-group">
    <a class="btn btn-xs btn-default" ng-click="vm.editEntity(itemitem)" href="" title="修改"><i class="fa fa-fw fa-edit"></i>修改人员信息</a>
    <a class="btn btn-xs btn-default" ng-click="vm.checkEdit(itemitem.employeeId)" href="" title="查看修改记录"><i class="fa fa-fw fa-file-text-o"></i>查看修改记录</a>
    <a class="btn btn-xs btn-default" ng-click="vm.recordEMC(itemitem.employeeId)" href="" title="人员单位记录"><i class="fa fa-fw fa-file-text-o"></i>人员单位记录</a>
    <a ng-if="vm.permissions.addCompany" class="btn btn-xs btn-default" ng-click="vm.employeeCompany(item.id,null)" href="" title="添加单位"><i class="fa fa-fw fa-edit"></i>添加单位</a>
    </div>
    </div>
    </td>
    </tr>
    </tbody>
    </table>
    </div>
    <pager total-count="vm.totalCount"
    page-size="vm.requestParams.maxResultCount"
    skip-count="vm.requestParams.skipCount"
    page-changed="vm.getGridData()"></pager>
    </div>
    </div>
    </div>

  • 相关阅读:
    servlet类中ServletConfig及ServletContext
    jsp及servlet中获取项目路径的一些方法
    EL表达式的一些知识
    python——字符太长,换行需要三个引号。
    python——转义字符
    python——函数缺省参数的使用
    python——字典
    python——if、elif、else的使用
    python——对列表使用的函数方法
    python-创建数字列表
  • 原文地址:https://www.cnblogs.com/luoxiaoxiao102/p/13265870.html
Copyright © 2011-2022 走看看