DashoTemplates/星河数字化/业务部门_业务部门项目回款情况.html

642 lines
39 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en">
<head>
<title>数字化管理系统</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<!-- 网站图标 -->
<link rel="icon" href="../assets//images/favicon.svg" type="image/x-icon">
<!-- 必备CSS -->
<link rel="stylesheet" href="../assets//fonts/fontawesome/css/fontawesome-all.min.css">
<link rel="stylesheet" href="../assets//plugins/animation/css/animate.min.css">
<link rel="stylesheet" href="../assets//plugins/prism/css/prism.min.css">
<!-- 自定义CSS -->
<link rel="stylesheet" href="../assets//css/style.css">
<!-- 内部CSS -->
<style>
.pcoded-navbar .pcoded-inner-navbar > li.active > a,
.pcoded-navbar .pcoded-inner-navbar > li.pcoded-trigger > a {
background: transparent;
}
.pcoded-navbar.menu-light .pcoded-inner-navbar > li.active > a,
.pcoded-navbar.menu-light .pcoded-inner-navbar > li.pcoded-trigger > a,
.pcoded-navbar .pcoded-inner-navbar > li.active > a,
.pcoded-navbar .pcoded-inner-navbar > li > a.active {
background: #fff;
color: #19BCBF;
position: relative;
font-weight: 600;
}
.pcoded-navbar .pcoded-inner-navbar > li.active > a,
.pcoded-navbar .pcoded-inner-navbar > li > a.active > .pcoded-micon {
color: #19BCBF;
}
.pcoded-navbar .pcoded-inner-navbar > li > a.active:after {
content: "";
background-color: #19BCBF;
z-index: 1027;
position: absolute;
left: 0;
top: 0px;
width: 3px;
height: 100%;
}
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
background: linear-gradient(-45deg, #19BCBF, #149698);
box-shadow: none;
}
pre[class*=language-] > code {
border-left: 5px solid #2196f3;
}
.nav-pills {
padding: 15px 25px;
}
.nav-pills > li i {
display: inline-block;
font-size: 15px;
padding: 0px 0;
}
#gulp pre[class*=language-].line-numbers.line-numbers code {
padding-left: 1.5em;
}
.img-block img {
width: 120px;
margin-right: 8px;
margin-bottom: 8px;
}
.pcoded-navbar .pcoded-inner-navbar > li > a.active:after {
background: linear-gradient(-45deg, #19BCBF, #149698);
}
</style>
</head>
<body class="">
<!-- [ 预加载 ] 开始 -->
<div class="loader-bg">
<div class="loader-track">
<div class="loader-fill"></div>
</div>
</div>
<!-- [ 预加载 ] 结束 -->
<!-- [ 导航菜单 ] 开始 -->
<nav class="pcoded-navbar menupos-fixed menu-dark menu-item-icon-style6 ">
<div class="navbar-wrapper ">
<div class="navbar-brand header-logo">
<a href="index.html" class="b-brand">
<img src="../assets/images/logo.svg" alt="logo" class="logo images">
<img src="../assets/images/logo-icon.svg" alt="logo" class="logo-thumb images">
</a>
<a class="mobile-menu" id="mobile-collapse" href="#!"><span></span></a>
</div>
<div class="navbar-content scroll-div" id="layout-sidenav">
<ul class="nav pcoded-inner-navbar sidenav-inner">
<li class="nav-item pcoded-menu-caption">
<label>视图数据</label>
</li>
<li data-username="" class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link"><span class="pcoded-micon"><i
class="feather icon-home"></i></span><span class="pcoded-mtext">董事会、总经办</span></a>
<ul class="pcoded-submenu">
<li class=""><a href="董事会、总经办_公司整体经营情况表.html" class="">整体经营情况表</a></li>
<li class=""><a href="董事会、总经办_公司整体收入情况.html" class="">整体收入情况</a></li>
<li class=""><a href="董事会、总经办_公司应收账款情况.html" class="">应收账款情况</a></li>
<li class=""><a href="董事会、总经办_公司应收账款明细.html" class="">应收账款明细</a></li>
<li class=""><a href="董事会、总经办_公司人员情况.html" class="">人员情况</a></li>
<li class=""><a href="董事会、总经办_公司员工业绩及提成情况.html" class="">员工业绩及提成情况</a></li>
<li class=""><a href="董事会、总经办_公司员工出勤情况.html" class="">员工出勤情况</a></li>
<li class=""><a href="董事会、总经办_公司项目台账.html" class="">项目台账</a></li>
</ul>
</li>
<li data-username="" class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link"><span class="pcoded-micon"><i
class="feather icon-home"></i></span><span class="pcoded-mtext">业务部门</span></a>
<ul class="pcoded-submenu">
<li class=""><a href="业务部门_业务部门年度总体经营指标.html" class="">年度总体经营指标</a></li>
<li class=""><a href="业务部门_业务部门收入情况.html" class="">收入情况</a></li>
<li class=""><a href="业务部门_业务部门成本情况.html" class="">成本情况</a></li>
<li class=""><a href="业务部门_业务部门利润情况.html" class="">利润情况</a></li>
<li class=""><a href="业务部门_业务部门项目进度.html" class="">项目进度</a></li>
<li class=""><a href="业务部门_业务部门项目结算情况.html" class="">项目结算情况</a></li>
<li class=""><a href="业务部门_业务部门项目回款情况.html" class="">项目回款情况</a></li>
<li class=""><a href="业务部门_业务部门收入结构天信、星河、星海.html" class="">收入结构</a></li>
<li class=""><a href="业务部门_业务部门利润结构天信、星河、星海.html" class="">利润结构</a></li>
<li class=""><a href="业务部门_业务部门项目经理收入完成及提成情况天信、星河、星海.html" class="">项目经理收入完成及提成情况</a></li>
<li class=""><a href="业务部门_业务部门出勤情况天信、星河、星海.html" class="">出勤情况</a></li>
</ul>
</li>
<li data-username="" class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link"><span class="pcoded-micon"><i
class="feather icon-home"></i></span><span class="pcoded-mtext">中后台</span></a>
<ul class="pcoded-submenu">
<li class=""><a href="中后台_各部门费用情况.html" class="">各部门费用情况</a></li>
</ul>
</li>
<li data-username="" class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link"><span class="pcoded-micon"><i
class="feather icon-home"></i></span><span class="pcoded-mtext">财务部</span></a>
<ul class="pcoded-submenu">
<li class=""><a href="财务部_各一级部门经营情况.html" class="">各一级部门经营情况</a></li>
</ul>
</li>
<li class="nav-item pcoded-menu-caption">
<label>基础数据</label>
</li>
<li data-username="" class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link"><span class="pcoded-micon"><i
class="feather icon-box"></i></span><span class="pcoded-mtext">业绩管理</span></a>
<ul class="pcoded-submenu">
<li class=""><a href="业绩管理_集团经营目标.html" class="">集团经营目标表</a></li>
<li class=""><a href="业绩管理_员工业绩目标.html" class="">员工业绩目标表</a></li>
</ul>
</li>
<li data-username="" class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link"><span class="pcoded-micon"><i
class="feather icon-box"></i></span><span class="pcoded-mtext">组织管理</span></a>
<ul class="pcoded-submenu">
<li class=""><a href="组织管理_公司主体信息登记表.html" class="">公司主体信息登记表</a></li>
<!-- <li class=""><a href="组织管理_公司银行账户.html" class="">公司银行账户表</a></li>-->
<li class=""><a href="组织管理_一级部门表.html" class="">一级部门表</a></li>
<li class=""><a href="组织管理_二级部门表.html" class="">二级部门表</a></li>
</ul>
</li>
<li data-username="" class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link"><span class="pcoded-micon"><i
class="feather icon-box"></i></span><span class="pcoded-mtext">人力资源管理</span></a>
<ul class="pcoded-submenu">
<li class=""><a href="人力资源管理_人员基本信息.html" class="">人员基本信息表</a></li>
<li class=""><a href="人力资源管理_员工考勤记录.html" class="">员工考勤记录表</a></li>
<li class=""><a href="人力资源管理_年假使用记录.html" class="">年假使用记录</a></li>
<li class=""><a href="人力资源管理_职务表.html" class="">岗位表</a></li>
<li class=""><a href="人力资源管理_职级表.html" class="">职级表</a></li>
</ul>
</li>
<li data-username="" class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link"><span class="pcoded-micon"><i
class="feather icon-box"></i></span><span class="pcoded-mtext">财会管理</span></a>
<ul class="pcoded-submenu">
<li class=""><a href="财会管理_费用类型表.html" class="">费用类型表</a></li>
<li class=""><a href="财会管理_费用明细表.html" class="">费用明细表</a></li>
<li class=""><a href="财会管理_集团年度预算表.html" class="">集团年度预算表</a></li>
<li class=""><a href="财会管理_人工费用明细表.html" class="">人工费明细表</a></li>
<li class=""><a href="财会管理_报销明细表.html" class="">报销明细表</a></li>
<li class=""><a href="财会管理_奖金类别表.html" class="">奖金类别表</a></li>
<li class=""><a href="财会管理_奖金分配表.html" class="">奖金分配表</a></li>
<li class=""><a href="财会管理_纳税记录表.html" class="">纳税记录表</a></li>
<li class=""><a href="财会管理_电子发票台账.html" class="">电子发票台账</a></li>
<li class=""><a href="财会管理_开票记录.html" class="">开票记录</a></li>
<li class=""><a href="财会管理_回款记录表.html" class="">回款记录表</a></li>
<li class=""><a href="财会管理_员工提成情况表.html" class="">员工提成情况表</a></li>
<li class=""><a href="财会管理_员工绩效情况表.html" class="">员工绩效情况表</a></li>
</ul>
</li>
<li data-username="" class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link"><span class="pcoded-micon"><i
class="feather icon-box"></i></span><span class="pcoded-mtext">资源管理</span></a>
<ul class="pcoded-submenu">
<li class=""><a href="资源管理_消耗品类别管理表.html" class="">消耗品类别管理表</a></li>
<li class=""><a href="资源管理_消耗品库存表.html" class="">消耗品库存表</a></li>
<li class=""><a href="资源管理_公司手机号使用登记表.html" class="">公司手机号使用登记表</a></li>
<li class=""><a href="资源管理_商务车使用登记表.html" class="">商务车使用登记表</a></li>
<li class=""><a href="资源管理_会员账号登记表.html" class="">会员账号登记表</a></li>
<li class=""><a href="资源管理_储值卡登记表.html" class="">储值卡登记表</a></li>
</ul>
</li>
<li data-username="" class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link"><span class="pcoded-micon"><i
class="feather icon-box"></i></span><span class="pcoded-mtext">运营管理</span></a>
<ul class="pcoded-submenu">
<li class=""><a href="运营管理_新媒体账号登记.html" class="">新媒体账号登记</a></li>
<li class=""><a href="运营管理_账号运营管理记录.html" class="">账号运营管理记录</a></li>
<li class=""><a href="运营管理_网站登记.html" class="">网站登记</a></li>
<li class=""><a href="运营管理_网站运维记录.html" class="">网站运维记录</a></li>
</ul>
</li>
<li data-username="" class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link"><span class="pcoded-micon"><i
class="feather icon-box"></i></span><span class="pcoded-mtext">合规管理</span></a>
<ul class="pcoded-submenu">
<li class=""><a href="合规管理_用印登记表.html" class="">用印登记表</a></li>
<li class=""><a href="合规管理_印章证件借用登记表.html" class="">印章证件借用登记表</a></li>
<li class=""><a href="合规管理_合同管理台账.html" class="">合同管理台账</a></li>
<li class=""><a href="合规管理_公司制度表.html" class="">公司制度表</a></li>
</ul>
</li>
<li data-username="" class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link"><span class="pcoded-micon"><i
class="feather icon-box"></i></span><span class="pcoded-mtext">营销管理</span></a>
<ul class="pcoded-submenu">
<li class=""><a href="营销管理_项目资源表.html" class="">项目资源表</a></li>
<li class=""><a href="营销管理_客户表.html" class="">客户表</a></li>
</ul>
</li>
<li data-username="" class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link"><span class="pcoded-micon"><i
class="feather icon-box"></i></span><span class="pcoded-mtext">资产管理</span></a>
<ul class="pcoded-submenu">
<li class=""><a href="资产管理_固定资产清单表.html" class="">固定资产清单表</a></li>
<li class=""><a href="资产管理_无形资产清单表.html" class="">无形资产清单表</a></li>
</ul>
</li>
<li data-username="" class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link"><span class="pcoded-micon"><i
class="feather icon-box"></i></span><span class="pcoded-mtext">项目管理</span></a>
<ul class="pcoded-submenu">
<li class=""><a href="项目管理_项目台账.html" class="">项目台账</a></li>
<li class=""><a href="项目管理_项目组员收入结算表.html" class="">项目组员收入结算表</a></li>
</ul>
</li>
<li class="nav-item pcoded-menu-caption">
<label>系统设置</label>
</li>
<li data-username="" class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link"><span class="pcoded-micon"><i
class="feather icon-lock"></i></span><span class="pcoded-mtext">权限设置</span></a>
<ul class="pcoded-submenu" style="display: none;">
<li class=""><a href="权限设置_数据表权限.html" class="" target="_blank">数据表权限</a></li>
</ul>
</li>
</ul>
</div>
</div>
</nav>
<!-- [ 导航菜单 ] 结束 -->
<!-- [ 页眉 ] 开始 -->
<header class="navbar pcoded-header navbar-expand-lg navbar-light headerpos-fixed">
<!-- 移动端 [ 页眉 ] 开始 -->
<div class="m-header">
<a class="mobile-menu" id="mobile-collapse1" href="#!"><span></span></a>
<a href="index.html" class="b-brand">
<img src="../assets/images/logo.svg" alt="" class="logo images">
<img src="../assets/images/logo-icon.svg" alt="" class="logo-thumb images">
</a>
</div>
<!-- 移动端 [ 页眉 ] 结束 -->
<!-- 移动端 [ 菜单 ] 开始 -->
<a class="mobile-menu" id="mobile-header" href="#!">
<i class="feather icon-more-horizontal"></i>
</a>
<!-- 移动端 [ 菜单 ] 结束 -->
<!-- PC端 [ 页眉 ] 开始 -->
<div class="collapse navbar-collapse">
<a href="#!" class="mob-toggler"></a>
<!-- [ 搜索 ] 开始 -->
<ul class="navbar-nav me-auto">
<li class="nav-item">
<div class="main-search open">
<div class="input-group">
<input type="text" id="m-search" class="form-control" placeholder="Search . . .">
<a href="#!" class="input-group-append search-close"><i
class="feather icon-x input-group-text"></i></a>
<span class="ms-1 input-group-append search-btn btn btn-primary">
<i class="feather icon-search input-group-text"></i>
</span>
</div>
</div>
</li>
</ul>
<!-- [ 搜索 ] 结束 -->
<!-- [ 通知&设置 ] 开始 -->
<ul class="navbar-nav ms-auto">
<!-- [ 通知 ] 开始 -->
<li>
<div class="dropdown">
<a class="dropdown-toggle" href="#" data-bs-toggle="dropdown" aria-expanded="false"><i
class="icon feather icon-bell"></i></a>
<div class="dropdown-menu dropdown-menu-end notification">
<div class="noti-head">
<h6 class="d-inline-block m-b-0">通知</h6>
<div class="float-end">
<!-- <a href="#!" class="m-r-10">标记为已读</a>-->
<!-- <a href="#!">清除所有</a>-->
</div>
</div>
<ul class="noti-body">
<li class="n-title">
<p class="m-b-0">最新</p>
</li>
<li class="notification">
<div class="d-flex">
<img class="img-radius" src="../assets/images/user/setting.png" alt="Profile Image">
<div class="flex-grow-1">
<p><strong>系统通知</strong><span class="n-time text-muted"><i
class="icon feather icon-clock m-r-10"></i>5 分钟前</span></p>
<p>更新报销明细</p>
</div>
</div>
</li>
<li class="n-title">
<p class="m-b-0">更早</p>
</li>
<li class="notification">
<div class="d-flex">
<img class="img-radius" src="../assets/images/user/setting.png" alt="Profile Image">
<div class="flex-grow-1">
<p><strong>系统通知</strong><span class="n-time text-muted"><i
class="icon feather icon-clock m-r-10"></i>10 min</span></p>
<p>5月员工生日</p>
</div>
</div>
</li>
<li class="notification">
<div class="d-flex">
<img class="img-radius" src="../assets/images/user/setting.png" alt="Profile Image">
<div class="flex-grow-1">
<p><strong>系统通知</strong><span class="n-time text-muted"><i
class="icon feather icon-clock m-r-10"></i>12 min</span></p>
<p>A4纸库存不足</p>
</div>
</div>
</li>
</ul>
<div class="noti-footer">
<a href="#!">查看所有</a>
</div>
</div>
</div>
</li>
<!-- [ 通知 ] 结束 -->
<!-- [ 设置 ] 开始 -->
<li>
<div class="dropdown drp-user">
<a href="#" class="dropdown-toggle" data-bs-toggle="dropdown"><i
class="icon feather icon-settings"></i></a>
<div class="dropdown-menu dropdown-menu-end profile-notification">
<div class="pro-head">
<img src="../assets/images/user/avatar-2.jpg" class="img-radius"
alt="User-Profile-Image">
<span>
<span class="text-muted">张三</span>
<span class="h6">zhangsan@mail.com</span>
</span>
</div>
<ul class="pro-body">
<li><a href="#!" class="dropdown-item"><i class="feather icon-user"></i>个人资料</a></li>
<li><a href="#!" class="dropdown-item"><i class="feather icon-power text-danger"></i>退出登录</a>
</li>
</ul>
</div>
</div>
</li>
</ul>
<!-- [ 通知&设置 ] 结束 -->
</div>
<!-- PC端 [ 页眉 ] 结束 -->
</header>
<!-- [ 页眉 ] 结束 -->
<!-- [ 主内容页 ] 开始 -->
<section class="pcoded-main-container">
<div class="pcoded-wrapper">
<div class="pcoded-content">
<div class="pcoded-inner-content">
<div class="main-body">
<div class="page-wrapper">
<!-- [ 面包屑 ] 开始 -->
<div class="page-header">
<div class="page-block">
<div class="row align-items-center">
<div class="col-md-12">
<div class="page-header-title">
<h5 class="m-b-10">业务部门项目回款情况</h5>
</div>
<ul class="breadcrumb">
<li class="breadcrumb-item"><a href="#!"><i
class="feather icon-home"></i></a></li>
<li class="breadcrumb-item"><a href="#!">业务部门</a></li>
<li class="breadcrumb-item"><a href="#!">业务部门项目回款情况</a></li>
</ul>
</div>
</div>
</div>
</div>
<!-- [ 面包屑 ] 结束 -->
<!-- [ 主内容 ] 开始 -->
<div class="row mb-3">
<div class="col-md-12">
<div class="card">
<div class="card-body">
<div class="row">
<div class="col-md-10">
<!-- 筛选查询表单 -->
<form id="filter-form">
<div class="row">
<div class="col-md-2">
<label class="form-label" for="depart">一级部门</label>
<select class="form-control" id="depart">
<option>部门1</option>
<option>部门2</option>
<option>部门3</option>
<option>部门4</option>
<option>部门5</option>
</select>
</div>
<div class="col-md-2">
<label class="form-label" for="year">项目名称</label>
<input class="form-control" id="name" type="text"/>
</div>
<div class="col-md-2 mt-4 d-flex align-items-end">
<button type="submit" class="btn btn-primary">查询</button>
</div>
</div>
</form>
</div>
<div class="col-md-2 mt-4 text-end">
<button class="btn btn-outline-danger"
data-bs-toggle="modal"
data-bs-target="#downloadModal">导出
</button>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row mb-3">
<div class="col-sm-12">
<div class="card">
<div class="card-body table-border-style">
<div class="table-responsive">
<table class="table">
<thead class="text-center">
<tr>
<th>#</th>
<th>一级部门</th>
<th>项目名称</th>
<th>项目类型</th>
<th>负责人</th>
<th>价税合计金额(元)</th>
<th>回款金额(元)</th>
<th>待回款金额(元)</th>
<th>应收净收入(元)</th>
<th>实收净收入(元)</th>
<th>待收净收入(元)</th>
</tr>
</thead>
<tbody class="text-center" style="color: white;">
<tr>
<td>1</td>
<td>市场部</td> <!-- 一级部门 -->
<td>市场推广活动</td> <!-- 项目名称 -->
<td>营销</td> <!-- 项目类型 -->
<td>李雷</td> <!-- 负责人 -->
<td>200,000</td> <!-- 价税合计金额(元) -->
<td>150,000</td> <!-- 回款金额(元) -->
<td>50,000</td> <!-- 待回款金额(元) -->
<td>180,000</td> <!-- 应收净收入(元) -->
<td>140,000</td> <!-- 实收净收入(元) -->
<td>40,000</td> <!-- 待收净收入 -->
</tr>
<tr>
<td>2</td>
<td>市场部</td> <!-- 一级部门 -->
<td>市场推广活动</td> <!-- 项目名称 -->
<td>营销</td> <!-- 项目类型 -->
<td>李雷</td> <!-- 负责人 -->
<td>200,000</td> <!-- 价税合计金额(元) -->
<td>150,000</td> <!-- 回款金额(元) -->
<td>50,000</td> <!-- 待回款金额(元) -->
<td>180,000</td> <!-- 应收净收入(元) -->
<td>140,000</td> <!-- 实收净收入(元) -->
<td>40,000</td> <!-- 待收净收入 -->
</tr>
<tr>
<td>3</td>
<td>市场部</td> <!-- 一级部门 -->
<td>市场推广活动</td> <!-- 项目名称 -->
<td>营销</td> <!-- 项目类型 -->
<td>李雷</td> <!-- 负责人 -->
<td>200,000</td> <!-- 价税合计金额(元) -->
<td>150,000</td> <!-- 回款金额(元) -->
<td>50,000</td> <!-- 待回款金额(元) -->
<td>180,000</td> <!-- 应收净收入(元) -->
<td>140,000</td> <!-- 实收净收入(元) -->
<td>40,000</td> <!-- 待收净收入 -->
</tr>
<tr>
<td>4</td>
<td>市场部</td> <!-- 一级部门 -->
<td>市场推广活动</td> <!-- 项目名称 -->
<td>营销</td> <!-- 项目类型 -->
<td>李雷</td> <!-- 负责人 -->
<td>200,000</td> <!-- 价税合计金额(元) -->
<td>150,000</td> <!-- 回款金额(元) -->
<td>50,000</td> <!-- 待回款金额(元) -->
<td>180,000</td> <!-- 应收净收入(元) -->
<td>140,000</td> <!-- 实收净收入(元) -->
<td>40,000</td> <!-- 待收净收入 -->
</tr>
<!-- 您可以添加更多的行,作为其他项目的财务数据 -->
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<div class="row mb-3 justify-content-end">
<!-- [ 数量统计 ] 开始 -->
<div class="col-sm-12 col-md-5">
<div class="dataTables_info" id="single-select_info" role="status" aria-live="polite">
显示第 1 到第 10 项,共 57 项
</div>
</div>
<!-- [ 数量统计 ] 结束 -->
<!-- [ 分页 ] 开始 -->
<div class="col-sm-12 col-md-7">
<div class="dataTables_paginate paging_simple_numbers" id="single-select_paginate">
<ul class="pagination justify-content-end">
<li class="paginate_button page-item previous disabled"
id="single-select_previous">
<a href="#" aria-controls="single-select" data-dt-idx="0" tabindex="0"
class="page-link">上一页</a>
</li>
<li class="paginate_button page-item active">
<a href="#" aria-controls="single-select" data-dt-idx="1" tabindex="0"
class="page-link">1</a>
</li>
<li class="paginate_button page-item ">
<a href="#" aria-controls="single-select" data-dt-idx="2" tabindex="0"
class="page-link">2</a>
</li>
<li class="paginate_button page-item ">
<a href="#" aria-controls="single-select" data-dt-idx="3" tabindex="0"
class="page-link">3</a>
</li>
<li class="paginate_button page-item ">
<a href="#" aria-controls="single-select" data-dt-idx="4" tabindex="0"
class="page-link">4</a>
</li>
<li class="paginate_button page-item ">
<a href="#" aria-controls="single-select" data-dt-idx="5" tabindex="0"
class="page-link">5</a>
</li>
<li class="paginate_button page-item ">
<a href="#" aria-controls="single-select" data-dt-idx="6" tabindex="0"
class="page-link">6</a>
</li>
<li class="paginate_button page-item next" id="single-select_next">
<a href="#" aria-controls="single-select" data-dt-idx="7" tabindex="0"
class="page-link">下一页</a>
</li>
</ul>
</div>
</div>
<!-- [ 分页 ] 结束 -->
</div>
<!-- [ 主内容 ] 结束 -->
</div>
</div>
</div>
</div>
</div>
</section>
<!-- [ 主内容页 ] 结束 -->
</body>
<!-- 必备 Js -->
<script src="../assets/js/vendor-all.min.js"></script>
<script src="../assets/plugins/bootstrap/js/popper.min.js"></script>
<script src="../assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="../assets/js/pcoded.min.js"></script>
</html>