PHP8.1.21版本已发布
vue8.1.21版本已发布
jquery8.1.21版本已发布
首页
课程
路径
文章
PHP培训
精品课
下载
最新更新

博客列表 > PHP实战: 实现数据的分页显示和编辑,删除功能.(基于ajax无刷新, 源码)

PHP实战: 实现数据的分页显示和编辑,删除功能.(基于ajax无刷新, 源码)

zl的php学习博客
zl的php学习博客 原创
2021年02月28日 16:12:04 1106浏览

PS: 本次提交的是一个文件夹,由于博客不能提交文件夹,所以我按照文件目录直接贴的代码.

效果展示

效果图

目录结构

内容

<span id="1">job</span>

<span id="1.1">config</span>

<span id="1.1.1">config.php</span>
  1. <?php
  3. return [
  4.     'type' => 'mysql',
  5.     'host' => '127.0.0.1',
  6.     'dbname' => 'phpedu',
  7.     'port' => '3306',
  8.     'charset' => 'utf8mb4',
  9.     'username' => 'admin',
  10.     'password' => '123456'
  11. ];
<span id="1.1.2">connect.php</span>
  1. <?php
  3. function connect()
  4. {
  5.     $config = require __DIR__ . '/config.php';
  7.     extract($config);
  9.     // 'mysql:host=127.0.0.1;dbname=phpedu;port=3306;charset=utf8mb4';
  10.     $dsn = sprintf('%s:host=%s;dbname=%s;port=%s;charset=%s', $type, $host, $dbname, $port, $charset);
  12.     try {
  13.         $pdo = new PDO($dsn, $username, $password);
  14.         $pdo->setAttribute(PDO::ATTR_DEFAULT_FETCH_MODE, PDO::FETCH_ASSOC);
  15.         return $pdo;
  16.     } catch (PDOException $e) {
  17.         die('连接失败: ' . $e->getMessage());
  18.     }
  19. }

<span id="1.2">controller</span>

<span id="1.2.1">handle.php</span>
  1. <?php
  3. $handle = $_GET['handle'] ?? $_POST['handle'] ?? 'select';
  5. //var_dump($_POST);
  6. //echo $handle;
  7. //die();
  8. switch ($handle) {
  9.     case 'select':
  10.         require __DIR__ . '/select.php';
  11.         break;
  12.     case 'update':
  13.         require __DIR__ . '/update.php';
  14.         break;
  15.     case 'delete':
  16.         require __DIR__ . '/delete.php';
  17.         break;
  18. }
<span id="1.2.2">delete.php</span>
  1. <?php
  3. require dirname(__DIR__) . '../config/connect.php';
  6. $sid = $_POST['sid'];
  7. if (empty($sid)) {
  8.     echo json_encode(['message' => '请求参数为null', 'code' => -20001]);
  9. } else {
  10.     $pdo = connect();
  12.     $sql = "DELETE FROM `staffs` where sid=?";
  13.     $stmt = $pdo->prepare($sql);
  14.     $stmt->execute([$sid]);
  16.     if ($stmt->rowCount()) {
  17.         echo json_encode(['message' => '删除成功', 'code' => 0]);
  18.     } else {
  19.         echo json_encode(['message' => '删除失败', 'code' => -20001]);
  20.     }
  21. }
<span id="1.2.3">select.php</span>
  1. <?php
  3. //function select($page = 1): string
  4. //{
  5. require dirname(__DIR__) . '../config/connect.php';
  7. $page = $_GET['p'] ?? 1;
  8. $limit = 10;
  9. $offset = ($page - 1) * $limit;
  11. $pdo = connect();
  13. // 获取分页数据
  14. $sql = "SELECT sid, name, gender, age, birthday, salary, create_d, update_d FROM `staffs` LIMIT ? OFFSET ?;";
  15. $stmt = $pdo->prepare($sql);
  16. $stmt->bindParam(1, $limit, PDO::PARAM_INT);
  17. $stmt->bindParam(2, $offset, PDO::PARAM_INT);
  18. $stmt->execute();
  19. $limitData = $stmt->fetchAll();
  20. // 获取总数据
  21. $sql = "SELECT ceil(count(1)/{$limit}) countPage FROM `staffs`;";
  22. $stmt = $pdo->prepare($sql);
  23. $stmt->execute();
  24. $countPage = $stmt->fetch();
  25. //var_dump($stmt->fetchAll(PDO::FETCH_ASSOC));
  26. echo json_encode(['page' => $page, 'countPage' => $countPage['countPage'], 'data' => $limitData]);
  27. //}
<span id="1.2.4">update.php</span>
  1. <?php
  3. require dirname(__DIR__) . '../config/connect.php';
  5. $sid = $_POST['sid'];
  6. $name = $_POST['name'];
  7. $gender = $_POST['gender'];
  8. $age = $_POST['age'];
  9. $birthday = $_POST['birthday'];
  10. $salary = $_POST['salary'];
  12. //var_dump($_POST, $salary);
  14. //die();
  15. if (empty($sid) || empty($name) || empty($gender) || empty($age) || empty($birthday) || empty($salary)) {
  16.     echo json_encode(['message' => '请求参数为null', 'code' => -20001]);
  17. } else {
  18.     $pdo = connect();
  20.     $sql = <<< SQL
  21.         UPDATE `staffs` 
  22.         SET name = ?, gender = ?, age = ?, birthday = ?, salary = ? 
  23.         WHERE sid = ?;
  24.     SQL;
  25.     $stmt = $pdo->prepare($sql);
  26.     $stmt->execute([$name, $gender, $age, $birthday, $salary, $sid]);
  28.     if ($stmt->rowCount()) {
  29.         echo json_encode(['message' => '修改成功', 'code' => 0]);
  30.     } else {
  31.         echo json_encode(['message' => '修改失败', 'code' => -20002, 'data' => print_r($_POST, true)]);
  32.     }
  33. }

<span id="1.3">pure-css3-icons</span>

<span id="1.3.1">icono.min.css</span>

  1. .icono-areaChart,.icono-barChart,.icono-book,.icono-book:after,.icono-book:before,.icono-bookmarkEmpty,.icono-bookmarkEmpty:before,.icono-camera,.icono-chain:after,.icono-chain:before,.icono-clock,.icono-commentEmpty,.icono-creditCard,.icono-crop,.icono-crop:before,.icono-display,.icono-document,.icono-eye,.icono-file,.icono-flag:after,.icono-flag:before,.icono-folder,.icono-forbidden,.icono-frown,.icono-frown:after,.icono-headphone,.icono-heart,.icono-heart:after,.icono-heart:before,.icono-home,.icono-home:after,.icono-home:before,.icono-imac,.icono-imacBold,.icono-image,.icono-infinity:after,.icono-infinity:before,.icono-iphone,.icono-iphoneBold,.icono-keyboard,.icono-macbook:before,.icono-macbookBold:before,.icono-mail,.icono-mail:before,.icono-market,.icono-market:after,.icono-meh,.icono-meh:after,.icono-microphone,.icono-microphone:before,.icono-mouse,.icono-mouse:before,.icono-nexus,.icono-paperClip,.icono-paperClip:after,.icono-paperClip:before,.icono-piano,.icono-pin,.icono-pin:before,.icono-power,.icono-rename,.icono-ruler,.icono-search,.icono-signIn,.icono-signIn:before,.icono-signOut,.icono-signOut:before,.icono-smile,.icono-smile:after,.icono-stroke,.icono-sync,.icono-tag,.icono-tag:after,.icono-terminal,.icono-trash,.icono-user,.icono-user:before,.icono-video,.icono-volumeHigh:after,.icono-volumeHigh:before,.icono-volumeLow:before,.icono-volumeMedium:before,.icono-youtube,.icono-youtube:before,[class*=icono-check][class*=Circle],[class*=icono-][class*=Circle],[class*=icono-][class*=Square]{border:2px solid}.icono-chain:after,.icono-chain:before,.icono-downArrow:before,.icono-dropper:before,.icono-flickr:after,.icono-flickr:before,.icono-indent:before,.icono-leftArrow:before,.icono-list:before,.icono-outdent:before,.icono-paperClip:before,.icono-rename:before,.icono-rightArrow:before,.icono-upArrow:before,.icono-video:before,.icono-volumeDecrease:after,.icono-volumeDecrease:before,.icono-volumeHigh:after,.icono-volumeHigh:before,.icono-volumeIncrease:after,.icono-volumeIncrease:before,.icono-volumeLow:before,.icono-volumeMedium:before,.icono-volumeMute:after,.icono-volumeMute:before,.stickCenterV{position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.icono-cup:after,.icono-display:after,.icono-display:before,.icono-imac:after,.icono-imacBold:after,.icono-imacBold:before,.icono-iphone:after,.icono-iphone:before,.icono-macbook:before,.icono-macbookBold:before,.icono-market:after,.icono-microphone:after,.icono-microphone:before,.icono-mouse:after,.icono-mouse:before,.icono-search:before,.icono-sitemap:after,.icono-sitemap:before,.icono-tag:after,.icono-textAlignCenter[class*=icono-textAlign]:after,.icono-textAlignCenter[class*=icono-textAlign]:before,.icono-trash:before,.icono-user:before,.stickCenterH,[class*=icono-exclamation]:after{position:absolute;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.icono-camera:before,.icono-clock:after,.icono-clock:before,.icono-document:after,.icono-eye:before,.icono-forbidden:before,.icono-gear:before,.icono-gplus:after,.icono-instagram:before,.icono-keyboard:before,.icono-pin:before,.icono-video:after,.icono-youtube:after,.stickCenter,[class*=icono-check]:before,[class*=icono-plus]:after,[class*=icono-plus]:before,[class*=icono-cross]:after,[class*=icono-cross]:before{position:absolute;left:50%;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.spin[class*=spin]{-webkit-animation:loading-spinner 2s infinite linear;animation:loading-spinner 2s infinite linear}@-webkit-keyframes loading-spinner{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes loading-spinner{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.icono-icono{width:13px;height:4px;box-shadow:inset 0 0 0 32px,0 16px,17px -18px;-webkit-transform:skew(0,30deg);transform:skew(0,30deg);margin:11px 19px 19px 2px}.icono-icono:before{position:absolute;width:13px;height:4px;box-shadow:inset 0 0 0 32px,0 16px,-17px -17px;right:-17px;top:-10px;-webkit-transform:skew(0,-48deg);transform:skew(0,-48deg)}.icono-icono:after{position:absolute;width:22px;height:15px;left:0;top:-5px;border:4px solid;border-top-color:transparent;border-bottom:none;-webkit-transform:skew(0,-30deg) scaleY(.6);transform:skew(0,-30deg) scaleY(.6)}.icono-home{width:22px;height:16px;border-top:none;margin:15px 6px 3px}.icono-home:before{width:18px;height:18px;-webkit-transform:rotate(45deg);transform:rotate(45deg);position:absolute;left:-2px;top:-7px;border-right-color:transparent;border-bottom-color:transparent}.icono-home:after{width:6px;height:10px;bottom:0;position:absolute;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);border-width:1px;border-bottom:none}.icono-mail{width:28px;height:18px;overflow:hidden;margin:8px 3px}.icono-mail:before{position:absolute;width:25px;height:25px;-webkit-transform:rotate(50deg) skew(-10deg,-20deg);transform:rotate(50deg) skew(-10deg,-20deg);top:-20px;left:-3px}.icono-rss{width:22px;height:22px;overflow:hidden;margin:6px}.icono-rss:after,.icono-rss:before{position:absolute;border-radius:50%}.icono-rss:before{width:6px;height:6px;box-shadow:0 0 32px inset;left:0;bottom:0}.icono-rss:after{width:27px;height:27px;right:15%;top:15%;border:4px solid transparent;box-shadow:inset 0 0 0 2px,0 0 0 2px}.icono-file:before,.icono-heart,.icono-power{border-top-color:transparent}.icono-file:before,.icono-heart:before,.icono-reset:before,.icono-sync,.icono-sync:after,.icono-sync:before{border-right-color:transparent}.icono-document:before,.icono-heart:after,.icono-reset:before{border-bottom-color:transparent}.icono-bars,.icono-hamburger{width:20px;height:2px;box-shadow:inset 0 0 0 32px,0 -6px,0 6px;margin:16px 7px}.icono-power:before,[class*=icono-check]:after,[class*=icono-check]:before,[class*=icono-plus]:after,[class*=icono-plus]:before,[class*=icono-cross]:after,[class*=icono-cross]:before{box-shadow:inset 0 0 0 32px}[class*=icono-plus],[class*=icono-cross]{width:30px;height:30px;margin:2px}[class*=icono-check]:before,[class*=icono-plus]:before,[class*=icono-cross]:before{width:20px;height:2px}[class*=icono-plus]:after,[class*=icono-cross]:after{height:20px;width:2px}[class*=Circle][class*=icono-check]:before,[class*=icono-plus][class*=Circle]:before,[class*=icono-cross][class*=Circle]:before{width:18px}[class*=icono-plus][class*=Circle]:after,[class*=icono-cross][class*=Circle]:after{height:18px}.icono-cross,.icono-crossCircle{-webkit-transform:rotate(45deg);transform:rotate(45deg)}[class*=icono-check]{width:28px;height:28px;margin:3px 0 3px 6px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}[class*=icono-check]:after{position:absolute;height:12px;width:2px;left:4px;bottom:14px}[class*=icono-check][class*=Circle]{border-radius:50%;width:30px;height:30px;margin:2px}[class*=icono-check][class*=Circle]:before{width:14px;top:15px;left:14px}[class*=icono-check][class*=Circle]:after{height:8px;left:7px;bottom:10px}.icono-power{width:22px;height:22px;border-radius:50%;margin:6px}.icono-power:before{position:absolute;top:-15%;left:8px;width:2px;height:60%}.icono-heart{width:20px;height:20px;border-left-color:transparent;-webkit-transform:rotate(45deg);transform:rotate(45deg);border-radius:4px 0;margin:9px 7px 5px}.icono-heart:after,.icono-heart:before{position:absolute}.icono-heart:before{width:8px;height:14px;left:-10px;bottom:-2px;border-radius:20px 0 0 20px}.icono-heart:after{width:14px;height:8px;right:-2px;top:-10px;border-radius:20px 20px 0 0}.icono-infinity{width:32px;height:16px;margin:9px 1px}.icono-infinity:after,.icono-infinity:before{width:10px;height:10px;position:absolute;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.icono-infinity:before{left:0;border-radius:32px 0 32px 32px}.icono-infinity:after{right:1px;border-radius:32px 32px 32px 0}.icono-flag{width:22px;height:25px;border-left:3px solid;margin:5px 6px 4px}.icono-flag:after,.icono-flag:before{position:absolute;width:9px;height:8px}.icono-flag:before{left:-2px;top:1px;border-radius:0 2px 0 0;border-right-width:3px}.icono-flag:after{width:5px;left:9px;top:4px;border-left-width:3px;border-radius:2px 2px 0}.icono-file{width:26px;height:32px;border-radius:0 12px 0 0;margin:1px 4px}.icono-file:before{position:absolute;top:-2px;right:-2px;border-style:solid;width:0;height:0;border-width:5px}.icono-document{width:26px;height:32px;border-radius:0 0 0 10px;margin:1px 4px}.icono-document:before{position:absolute;width:0;height:0;left:-3px;bottom:-3px;border-width:5px;border-style:solid;border-left-color:transparent}.icono-folder:after,.icono-folder:before{left:-12px;position:absolute;border-style:solid}.icono-document:after{width:13px;height:2px;box-shadow:inset 0 0 0 32px,0 -5px 0 0,0 5px 0 0}.icono-folder{width:18px;height:22px;border-left-width:0;border-radius:0 3px 3px 0;margin:8px 2px 4px 14px}.icono-folder:before{width:12px;height:20px;bottom:-2px;border-width:0 0 2px 2px;border-radius:0 0 0 3px}.icono-folder:after{width:10px;height:5px;top:-7px;border-width:2px 2px 0;border-radius:3px 3px 0 0}.icono-pin{width:26px;height:26px;border-radius:50% 50% 50% 0;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);margin:1px 4px 7px}.icono-pin:before{position:absolute;width:6px;height:6px;border-radius:50%}.icono-frown,.icono-meh,.icono-smile{border-radius:50%;height:30px;width:30px;margin:2px}.icono-frown:before,.icono-meh:before,.icono-smile:before{border-radius:50%;box-shadow:8px 0 0 0,0 0 0 2px inset;height:4px;width:4px;left:7px;position:absolute;top:27%}.icono-frown:after,.icono-meh:after,.icono-smile:after{border-radius:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);border-top-color:transparent;border-left-color:transparent;border-right-color:transparent;height:16px;left:50%;position:absolute;top:6%;width:16px}.icono-eye{border-radius:80% 20%;-webkit-transform:rotate(45deg);transform:rotate(45deg);border-width:2px 1px 1px 2px;height:28px;width:28px;margin:3px}.icono-eye:before{border-radius:50%;box-shadow:0 -3px 0 3px inset;height:11px;width:11px}.icono-sliders{height:30px;width:30px;margin:2px}.icono-sliders:after,.icono-sliders:before{-webkit-transform:translateX(-50%);transform:translateX(-50%);left:50%;position:absolute}.icono-sliders:before{width:8px;height:7px;border-radius:2px;top:67%;box-shadow:inset 0 0 0 32px,10px -10px,-10px -14px}.icono-sliders:after{position:absolute;width:2px;height:100%;box-shadow:inset 0 0 0 32px,10px 0,-10px 0}.icono-share{height:9px;width:9px;border-radius:50%;box-shadow:inset 0 0 0 32px,22px -11px 0 0,22px 11px 0 0;margin:12px 24px 13px 1px}.icono-reset,.icono-sync{border-radius:50%;margin:4px;border-left-color:transparent}.icono-share:after,.icono-share:before{position:absolute;width:24px;height:2px;box-shadow:inset 0 0 0 32px;left:0}.icono-share:before{top:-2px;-webkit-transform:rotate(-25deg);transform:rotate(-25deg)}.icono-share:after{top:9px;-webkit-transform:rotate(25deg);transform:rotate(25deg)}.icono-sync{width:26px;height:26px}.icono-sync:after,.icono-sync:before{position:absolute;width:0;height:0;border-width:6px;border-style:solid;border-bottom-color:transparent;border-left-color:transparent}.icono-sync:before{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);right:-7px;top:0}.icono-sync:after{-webkit-transform:rotate(135deg);transform:rotate(135deg);left:-7px;bottom:0}.icono-reset{width:26px;height:26px;border-width:2px;border-style:solid}.icono-reset:before{position:absolute;width:0;height:0;left:-7px;bottom:0;border-width:6px;border-style:solid;border-left-color:transparent;-webkit-transform:rotate(135deg);transform:rotate(135deg)}.icono-gear{width:32px;height:32px;border:3px dotted;border-radius:50%;margin:1px}.icono-gear:before{width:22px;height:22px;box-shadow:0 0 0 3px,0 0 0 2px inset;border-radius:50%;border:6px solid transparent;box-sizing:border-box}.icono-signIn:before,.icono-signOut:before{position:absolute;top:7px;border-bottom:none;-webkit-transform:rotate(45deg)}.icono-signIn{width:18px;height:32px;border-left:none;border-radius:0 3px 3px 0;margin:1px 8px}.icono-signIn:before{width:11px;height:11px;left:-10px;border-left:none;transform:rotate(45deg);border-radius:0 4px 0 0}.icono-signOut{width:18px;height:32px;border-right:none;border-radius:3px 0 0 3px;margin:1px 8px}.icono-signOut:before{width:11px;height:11px;right:-2px;border-left:none;transform:rotate(45deg);border-radius:0 4px 0 0}.icono-support{width:26px;height:26px;border:5px solid transparent;box-shadow:0 0 0 2px inset,0 0 0 2px;border-radius:50%;margin:4px}.icono-dropper,.icono-youtube:after,.icono-youtube:before{border-top-color:transparent;border-bottom-color:transparent}.icono-support:after,.icono-support:before{width:7px;height:7px;top:-3px;box-shadow:inset 0 0 0 32px,21px 0 0 0;position:absolute}.icono-support:before{left:-3px;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.icono-support:after{right:-3px;-webkit-transform:rotate(135deg);transform:rotate(135deg)}.icono-dropper{width:40px;height:14px;border-width:3px;border-style:solid;border-right:none;border-left-color:transparent;box-shadow:-9px 0 0 2px inset,0 0 0 2px inset;border-radius:50% 6px 6px 50%;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);margin:12px -2px 8px -4px}.icono-rename:before,.icono-youtube{border-right-color:transparent;border-left-color:transparent}.icono-dropper:before{width:4px;height:14px;right:10px;box-shadow:inset 0 0 0 32px}.icono-tiles{width:4px;height:4px;box-shadow:0 -8px 0,-8px -8px 0,8px -8px 0,0 0 0 32px inset,-8px 0 0,8px 0 0,0 8px 0,-8px 8px 0,8px 8px 0;margin:15px}.icono-list,.icono-list:before{height:4px;box-shadow:inset 0 0 0 32px,0 -8px 0 0,0 8px 0 0}.icono-list{width:4px;margin:15px 26px 15px 4px}.icono-list:before{width:18px;left:8px}.icono-chain{width:16px;height:2px;box-shadow:inset 0 0 0 32px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);margin:16px 9px}.icono-chain:after,.icono-chain:before{width:12px;height:8px;border-radius:4px}.icono-chain:before{right:-10px}.icono-chain:after{left:-10px}.icono-youtube{border-radius:10px;width:32px;height:22px;margin:6px 1px}.icono-youtube:before{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:6px/3px}.icono-youtube:after{width:0;height:0;border-width:4px 0 4px 8px;border-style:solid}.icono-rename{width:26px;height:10px;border-color:transparent;border-width:3px;box-shadow:0 0 0 1px,11px 0 0 0 inset;margin:12px 4px}.icono-rename:before{width:1px;height:18px;left:9px;border-width:2px 4px;border-style:solid;box-shadow:0 0 0 1px inset}.icono-search{width:22px;height:22px;border-radius:50%;-webkit-transform:rotate(45deg);transform:rotate(45deg);margin:4px 4px 8px 8px}.icono-search:before{width:4px;height:11px;box-shadow:inset 0 0 0 32px;top:19px;border-radius:0 0 1px 1px}.icono-book,.icono-book:before{border-top:none;border-radius:0 0 0 6px}.icono-book{width:26px;height:22px;margin:10px 4px 2px}.icono-book:after,.icono-book:before{width:24px;left:-2px;position:absolute;box-sizing:border-box}.icono-book:before{height:7px;border-right:none;top:-5px}.icono-book:after{height:8px;top:-8px;border-bottom:none;border-radius:6px 0 0}.icono-forbidden{width:28px;height:28px;border-width:3px;border-radius:50%;margin:3px;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.icono-forbidden:before{width:24px;height:4px;box-shadow:inset 0 0 0 32px}.icono-trash{width:22px;height:22px;border-radius:0 0 3px 3px;border-top:none;margin:9px 6px 3px}.icono-trash:before{width:8px;height:2px;top:-6px;box-shadow:inset 0 0 0 32px,-10px 2px 0 0,-6px 2px 0 0,0 2px 0 0,6px 2px 0 0,10px 2px 0 0}.icono-keyboard{width:32px;height:22px;border-radius:3px;margin:6px 1px}.icono-keyboard:before{width:2px;height:2px;box-shadow:-2px -4px 0,-6px -4px 0,-10px -4px 0,2px -4px 0,6px -4px 0,8px -4px 0,10px -4px 0,-4px 0 0,-8px 0 0,-10px 0 0,inset 0 0 0 32px,4px 0 0,8px 0 0,10px 0 0,4px 4px 0,2px 4px 0,0 4px 0,-2px 4px 0,-6px 4px 0,-10px 4px 0,6px 4px 0,10px 4px 0}.icono-mouse{width:23px;height:32px;border-radius:11px 11px 12px 12px;margin:1px 5px 1px 6px}.icono-mouse:before{width:1px;height:6px;border-radius:2px;border-color:transparent;border-width:1px;top:5px;box-shadow:0 0 0 1px,0 0 0 2px inset}.icono-mouse:after{width:1px;height:4px;top:0;box-shadow:inset 0 0 0 32px,0 13px 0 0}.icono-user{width:32px;height:14px;border-radius:64px 64px 0 0/64px;margin:18px 1px 2px}.icono-user:before{width:12px;height:12px;top:-20px;border-radius:50%}.icono-crop{width:21px;height:21px;border-left:none;border-bottom:none;margin:9px 9px 4px 4px}.icono-crop:before{position:absolute;width:21px;height:21px;top:-7px;right:-7px;border-top:none;border-right:none;box-sizing:border-box}.icono-imac,.icono-iphone,.icono-macbook:before{border-color:transparent}.icono-crop:after{width:27px;height:1px;position:absolute;top:0;right:0;bottom:12px;left:2px;margin:auto;box-shadow:inset 0 0 0 32px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.icono-image:before,.icono-tag{-webkit-transform:rotate(45deg)}.icono-display{width:26px;height:22px;margin:4px 4px 8px}.icono-display:before{width:4px;height:3px;bottom:-5px;box-shadow:inset 0 0 0 32px}.icono-display:after{width:14px;height:2px;bottom:-6px;box-shadow:inset 0 0 0 32px}.icono-imac{width:28px;height:24px;border-width:2px 2px 6px;border-radius:3px;box-shadow:0 0 0 1px,0 0 0 1px inset;margin:3px 3px 7px}.icono-imac:after,.icono-imac:before,.icono-imacBold:after,.icono-imacBold:before{box-shadow:inset 0 0 0 32px}.icono-imac:before{position:absolute;height:4px;right:-3px;left:-3px;bottom:-6px;border-radius:0 0 3px 3px}.icono-imac:after{width:9px;height:7px;bottom:-12px;border-radius:32px 32px 0 0/64px}.icono-imacBold{width:28px;height:22px;border-radius:4px;margin:4px 3px 8px}.icono-imacBold:before{width:9px;height:7px;bottom:-6px;border-radius:32px 32px 0 0/64px}.icono-imacBold:after{width:24px;height:3px;bottom:0}.icono-iphone{width:19px;height:31px;border-radius:3px;border-width:5px 1px;box-shadow:0 0 0 1px,0 0 0 1px inset;margin:2px 8px 1px 7px}.icono-iphone:after,.icono-iphone:before,.icono-macbook{box-shadow:inset 0 0 0 32px}.icono-iphone:before{width:3px;height:1px;top:-3px}.icono-iphone:after{width:3px;height:3px;bottom:-4px;border-radius:50%}.icono-iphoneBold{width:20px;height:32px;margin:1px 7px;border-radius:4px;border-width:5px 2px}.icono-macbook{width:32px;height:2px;border-radius:0 0 32px 32px/3px;margin:25px 1px 7px}.icono-macbook:before{width:20px;height:14px;bottom:2px;border-width:3px 1px 1px;border-radius:3px 3px 0 0;box-shadow:0 0 0 1px,0 0 0 1px inset}.icono-macbookBold{width:32px;height:2px;box-shadow:inset 0 0 0 32px;margin:25px 1px 7px}.icono-macbookBold:before{width:20px;height:14px;bottom:2px;border-width:3px 2px 1px;border-radius:3px 3px 0 0}.icono-image{width:30px;height:26px;border-radius:3px;overflow:hidden;margin:4px 2px}.icono-image:before{position:absolute;width:20px;height:20px;left:-2px;top:14px;transform:rotate(45deg);box-shadow:inset 0 0 0 32px,10px -6px 0 0}.icono-image:after{position:absolute;width:4px;height:4px;border-radius:50%;box-shadow:inset 0 0 0 32px;top:5px;right:5px}.icono-headphone{width:30px;height:27px;border-bottom-color:transparent;border-radius:32px/32px 32px 16px 16px;margin:2px 2px 5px}.icono-headphone:before{position:absolute;width:4px;height:12px;left:1px;bottom:-4px;border-radius:5px;box-shadow:inset 0 0 0 32px,20px 0 0 0}.icono-music{width:18px;height:6px;-webkit-transform:skewY(-15deg);transform:skewY(-15deg);box-shadow:inset 0 0 0 32px;border-radius:2px 2px 0 0;margin:4px 5px 24px 11px}.icono-music:after,.icono-music:before{box-shadow:inset 0 0 0 32px,16px 0 0 0;position:absolute}.icono-music:before{width:2px;height:16px;left:0;top:4px}.icono-music:after{width:10px;height:8px;left:-8px;top:17px;border-radius:50%}.icono-video{width:20px;height:20px;margin:7px}.icono-video:before{width:3px;height:3px;left:-8px;box-shadow:inset 0 0 0 32px,0 -8px 0 0,0 8px 0 0,29px 0 0 0,29px -8px 0 0,29px 8px 0 0}.icono-video:after{width:0;height:0;border-width:4px 0 4px 6px;border-style:solid;border-top-color:transparent;border-bottom-color:transparent}.icono-nexus{width:21px;height:32px;border-width:3px 1px;border-radius:16px/3px;margin:1px 7px 1px 6px}.icono-microphone{width:22px;height:15px;border-width:0 2px 2px;border-radius:20px/0 0 20px 20px;margin:12px 6px 7px}.icono-microphone:before{width:10px;height:18px;top:-11px;border-radius:20px}.icono-microphone:after{width:2px;height:2px;bottom:-4px;box-shadow:inset 0 0 0 32px,0 2px,0 4px,-2px 4px,-4px 4px,-6px 4px,2px 4px,4px 4px,6px 4px}.icono-asterisk,.icono-asterisk:after,.icono-asterisk:before{width:4px;height:20px;box-shadow:inset 0 0 0 32px;border-radius:1px;margin:7px 15px}.icono-paperClip,.icono-paperClip:before{border-radius:0 16px 16px 0;border-left:none}.icono-asterisk:after,.icono-asterisk:before{position:absolute;margin:0;left:0;top:0}.icono-asterisk:before{-webkit-transform:rotate(-58deg);transform:rotate(-58deg)}.icono-asterisk:after{-webkit-transform:rotate(58deg);transform:rotate(58deg)}.icono-terminal{width:28px;height:24px;margin:5px 3px}.icono-terminal:before{width:5px;height:5px;position:absolute;top:50%;-webkit-transform:translateY(-50%) rotate(45deg);transform:translateY(-50%) rotate(45deg);left:3px;border-width:2px 2px 0 0;border-style:solid}.icono-terminal:after{position:absolute;width:5px;height:0;border-bottom:2px solid;right:6px;bottom:4px}.icono-paperClip{width:24px;height:18px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);margin:5px 0 11px 10px}.icono-paperClip:before{width:18px;height:6px;right:2px}.icono-paperClip:after{position:absolute;width:12px;height:10px;left:-12px;top:-2px;border-right:none;border-radius:16px 0 0 16px}.icono-market{width:32px;height:12px;border-top:none;margin:19px 1px 3px}.icono-market:before{width:6px;height:13px;position:absolute;top:-15px;left:-5px;border-radius:0 0 10px 10px;border-left:none;box-shadow:inset 0 0 0 32px,8px 0 0,16px 0 0,24px 0 0,32px 0 0}.icono-market:after{width:6px;height:6px;bottom:-2px}.icono-clock{width:26px;height:26px;border-radius:50%;margin:4px}.icono-clock:after,.icono-clock:before{top:35%;box-shadow:inset 0 0 0 32px;border-radius:2px}.icono-clock:before{width:2px;height:9px}.icono-clock:after{width:6px;height:2px;-webkit-transform-origin:left center;transform-origin:left center;-webkit-transform:rotate(45deg) translate(1px,2px);transform:rotate(45deg) translate(1px,2px)}[class*=icono-textAlign]{width:28px;height:22px;margin:6px 3px}[class*=icono-textAlign]:after,[class*=icono-textAlign]:before{position:absolute;height:2px;box-shadow:inset 0 0 0 32px,0 8px 0 0,0 16px 0 0;right:0}[class*=icono-textAlign]:before{width:28px;top:0}[class*=icono-textAlign]:after{width:18px;top:4px}[class*=icono-textAlign].icono-textAlignLeft:after,[class*=icono-textAlign].icono-textAlignLeft:before{left:0}[class*=icono-exclamation]{overflow:visible;width:30px;border-bottom:2px solid;border-radius:0 0 4px 4px;margin:26px 2px 6px}[class*=icono-exclamation]:before{position:absolute;width:26px;height:26px;left:1px;top:-14px;border-width:2px 0 0 2px;border-style:solid;border-radius:4px 0;-webkit-transform:rotate(45deg) skew(12deg,12deg);transform:rotate(45deg) skew(12deg,12deg)}[class*=icono-exclamation]:after{width:4px;height:3px;top:-14px;box-shadow:inset 0 0 0 32px,0 3px,0 8px}[class*=icono-exclamation][class*=Circle]{height:30px;margin:2px}[class*=icono-exclamation][class*=Circle]:before{display:none}[class*=icono-exclamation][class*=Circle]:after{box-shadow:inset 0 0 0 32px,0 3px,0 5px,0 10px;top:6px}.icono-frown:after{-webkit-transform:translateX(-50%) rotate(180deg);transform:translateX(-50%) rotate(180deg);-webkit-transform-origin:center 85%;transform-origin:center 85%}.icono-meh:after{top:0;width:12px;border-left-width:0;border-right-width:0;border-radius:0}.icono-indent,.icono-outdent{width:20px;height:16px;border-width:4px 0 4px 8px;border-style:solid;border-color:transparent;box-shadow:0 -2px,0 2px,inset 0 2px,inset 0 -2px;margin:9px 7px}.icono-indent:before,.icono-outdent:before{left:-8px;border:5px solid;border-top-color:transparent;border-bottom-color:transparent;border-right-width:0}.icono-outdent:before{border-left-width:0;border-right-width:5px}.icono-locationArrow{width:32px;height:32px;margin:1px}.icono-locationArrow:before{position:absolute;left:7px;top:16px;border-width:6px 0 6px 6px;border-style:solid;border-left-color:transparent;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.icono-locationArrow:after{position:absolute;top:10px;left:2px;border-width:10px;border-style:solid;border-bottom-color:transparent;border-left-color:transparent;-webkit-transform:skew(-30deg,-30deg);transform:skew(-30deg,-30deg)}.icono-comment:before,.icono-commentEmpty:before{-webkit-transform:rotate(-45deg);position:absolute}.icono-commentEmpty{width:30px;height:22px;border-radius:4px 4px 7px 7px;border-bottom-color:transparent;margin:5px 2px 7px}.icono-commentEmpty:before{width:6px;height:6px;border-width:0 0 2px 2px;border-style:solid;transform:rotate(-45deg);bottom:-4px;left:6px}.icono-commentEmpty:after{position:absolute;width:8px;height:2px;border-width:0 12px 0 6px;border-style:solid;bottom:0;left:0}.icono-comment{width:30px;height:20px;box-shadow:inset 0 0 0 32px;border-radius:4px;margin:5px 2px 9px}.icono-comment:before{width:8px;height:8px;box-shadow:inset 0 0 0 32px;transform:rotate(-45deg);bottom:-4px;left:6px}.icono-areaChart,.icono-barChart{width:30px;height:22px;margin:4px 0 8px 4px;overflow:hidden}.icono-areaChart{border-top-width:0;border-right-width:0;border-color:transparent;box-shadow:-2px 2px}.icono-areaChart:before{position:absolute;left:0;bottom:7px;border:6px solid transparent;border-bottom-color:currentColor;box-shadow:0 7px}.icono-areaChart:after{position:absolute;left:11px;bottom:4px;border-width:0 6px 13px;border-style:solid;border-color:transparent transparent currentColor;box-shadow:0 4px}.icono-barChart{border-top-width:0;border-right-width:0;border-color:transparent;box-shadow:-2px 2px}.icono-barChart:before{position:absolute;left:0;bottom:0;width:4px;height:15px;box-shadow:inset 0 -8px 0 0,6px 0,12px 7px,18px 5px}.icono-pieChart{width:0;height:0;border:15px solid;border-right-color:transparent;border-radius:50%;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);margin:2px}.icono-pieChart:before{position:absolute;width:0;height:0;left:-11px;top:-14px;border:14px solid;border-left-color:transparent;border-bottom-color:transparent;border-top-color:transparent;border-radius:50%}.icono-bookmark{width:0;height:0;border:9px solid;border-bottom-color:transparent;box-shadow:0 -4px;border-radius:3px 3px 0 0;margin:10px 8px 6px}.icono-bookmarkEmpty{width:18px;height:22px;border-bottom:none;border-radius:3px 3px 2px 2px;overflow:hidden;margin:6px 8px}.icono-bookmarkEmpty:before{position:absolute;width:12px;height:12px;bottom:0;left:0;border-right:none;border-bottom:none;-webkit-transform:rotate(45deg) translate(35%,35%);transform:rotate(45deg) translate(35%,35%)}.icono-filter{width:0;height:0;border:10px solid;border-bottom:none;border-left-color:transparent;border-right-color:transparent;padding:3px;box-shadow:inset 0 7px;margin:9px 4px}.icono-volume,.icono-volumeDecrease,.icono-volumeHigh,.icono-volumeIncrease,.icono-volumeLow,.icono-volumeMedium,.icono-volumeMute{width:0;height:0;border:7px solid;border-left:none;border-top-color:transparent;border-bottom-color:transparent;padding:6px 3px;box-shadow:inset 4px 0;margin:4px 10px 4px 11px}.icono-volumeHigh,.icono-volumeLow,.icono-volumeMedium{margin:4px 14px 4px 7px}.icono-volumeHigh:after,.icono-volumeHigh:before,.icono-volumeLow:before,.icono-volumeMedium:before{width:15px;height:15px;position:absolute;border-radius:50%;border-top-color:transparent;border-bottom-color:transparent;border-left-color:transparent;left:2px}.icono-volumeHigh,.icono-volumeMedium{margin:4px 16px 4px 5px}.icono-volumeHigh:before,.icono-volumeMedium:before{border-style:double;border-width:6px;left:-2px}.icono-volumeHigh{margin:4px 18px 4px 3px}.icono-volumeHigh:after{width:32px;height:32px;left:-7px}.icono-volumeDecrease,.icono-volumeIncrease,.icono-volumeMute{margin:4px 16px 4px 5px}.icono-volumeDecrease:after,.icono-volumeDecrease:before,.icono-volumeIncrease:after,.icono-volumeIncrease:before,.icono-volumeMute:after,.icono-volumeMute:before{box-shadow:inset 0 0 0 32px}.icono-volumeDecrease:before,.icono-volumeIncrease:before,.icono-volumeMute:before{width:10px;height:2px;left:17px}.icono-volumeIncrease:after,.icono-volumeMute:after{height:10px;width:2px;left:21px}.icono-volumeMute:after,.icono-volumeMute:before{-webkit-transform:translateY(-50%) rotate(45deg);transform:translateY(-50%) rotate(45deg)}.icono-tag{width:18px;height:24px;border-radius:6px 6px 4px 4px;border-top:none;transform:rotate(45deg);margin:5px 8px}.icono-tag:before{position:absolute;top:-4px;left:1px;width:10px;height:10px;border-width:2px 0 0 2px;border-style:solid;-webkit-transform:rotate(45deg);transform:rotate(45deg);border-radius:5px 0 0}.icono-tag:after{top:1px;width:3px;height:3px;border-radius:50%}.icono-calendar{width:32px;height:28px;border-width:4px 2px 2px;border-style:solid;border-radius:4px;margin:5px 1px 1px}.icono-calendar:before{position:absolute;width:4px;height:4px;top:3px;left:3px;box-shadow:inset 0 0 0 32px,6px 0,12px 0,18px 0,0 6px,6px 6px,12px 6px,18px 6px,0 12px,6px 12px,12px 12px,18px 12px}.icono-calendar:after{position:absolute;width:4px;height:8px;box-shadow:inset 0 0 0 32px,16px 0;border-radius:4px;top:-8px;left:4px}.icono-camera{width:32px;height:24px;border-radius:4px;margin:5px 1px}.icono-camera:before{width:10px;height:10px;border:1px solid transparent;box-shadow:inset 0 0 0 1px,0 0 0 2px;border-radius:50%}.icono-camera:after{position:absolute;width:4px;height:2px;right:2px;top:2px;box-shadow:inset 0 0 0 32px}.icono-piano{width:31px;height:22px;margin:6px 1px}.icono-piano:before{position:absolute;left:4px;top:0;width:1px;height:100%;box-shadow:-1px 0,3px 0,7px 0,11px 0,15px 0,19px 0}.icono-piano:after{position:absolute;width:3px;height:13px;left:4px;top:0;box-shadow:inset 1px 0,inset -1px 0,-2px 0,2px 0,10px 0,14px 0,18px 0}.icono-ruler{width:27px;height:12px;margin:11px 4px 11px 3px}.icono-ruler:before{position:absolute;width:1px;height:4px;box-shadow:inset 0 0 0 32px,6px 0,12px 0;left:5px;top:0}.icono-ruler:after{position:absolute;width:1px;height:2px;box-shadow:inset 0 0 0 32px,2px 0,6px 0,8px 0,12px 0,14px 0,18px 0,20px 0;left:1px;top:0}.icono-facebook{width:9px;height:26px;box-shadow:inset 2px 4px 0 0;border-left:3px solid;border-radius:5px 0 0;margin:4px 11px 4px 14px}.icono-facebook:before{position:absolute;top:9px;left:-6px;width:11px;height:0;border-top:4px solid;border-right:1px solid transparent}.icono-twitter{width:14px;height:23px;border-radius:0 0 0 8px;box-shadow:-6px 2px 0 0;margin:4px 7px 7px 13px}.icono-twitter:before{position:absolute;bottom:-2px;left:-6px;width:17px;height:6px;border-radius:0 0 0 8px;box-shadow:inset 4px -6px,0 -11px}.icono-twitter:after{position:absolute;width:6px;height:6px;box-shadow:inset 0 0 0 32px,13px 8px,13px 19px;border-radius:50%;left:-6px}.icono-gplus{width:10px;height:2px;box-shadow:inset 0 0 0 32px;margin:14px 4px 18px 20px}.icono-gplus:before{position:absolute;top:-5px;right:10px;content:"g"!important;font-family:georgia;font-size:32px;text-indent:0;line-height:0}.icono-gplus:after{width:2px;height:10px;box-shadow:inset 0 0 0 32px}.icono-linkedIn{width:5px;height:16px;box-shadow:inset 0 0 0 32px,8px 0;margin:12px 24px 6px 5px}.icono-linkedIn:before{position:absolute;width:5px;height:5px;box-shadow:inset 0 0 0 32px;top:-7px;left:0;border-radius:50%}.icono-linkedIn:after{position:absolute;width:12px;height:16px;border-right:1px solid;left:11px;bottom:0;border-radius:8px 5px 0 0/11px 5px 0 0;box-shadow:inset -4px 4px}.icono-instagram{width:26px;height:26px;box-shadow:inset 0 0 0 2px;border-radius:4px;margin:4px}.icono-instagram:before{width:10px;height:10px;border-radius:50%;box-shadow:0 0 0 3px}.icono-instagram:after{position:absolute;width:5px;height:5px;border-radius:1px;right:3px;top:3px;box-shadow:0 0 0 2px,1px 1px 0 2px,-5px -1px 0 1px,-10px -1px 0 1px,-16px 1px 0 2px}.icono-flickr{width:24px;height:24px;overflow:hidden;border-radius:4px;margin:5px}.icono-flickr:after,.icono-flickr:before{width:7px;height:7px;border-radius:50%}.icono-flickr:before{left:4px;box-shadow:0 0 0 1px,0 -10px 0 6px,0 10px 0 6px,-4px 0 0 3px}.icono-flickr:after{right:4px;box-shadow:0 0 0 1px,0 -10px 0 6px,0 10px 0 6px,4px 0 0 3px}.icono-delicious{width:24px;height:24px;overflow:hidden;border-radius:4px;box-shadow:inset 0 0 0 2px;margin:5px}.icono-delicious:before{position:absolute;width:12px;height:12px;box-shadow:inset 0 0 0 32px,12px -12px 0 0;left:0;bottom:0}.icono-codepen{width:2px;height:10px;box-shadow:inset 0 0 0 32px,0 15px,-11px 7px,11px 7px;margin:4px 16px 20px}.icono-codepen:after,.icono-codepen:before{top:3px;width:11px;height:4px;position:absolute}.icono-codepen:before{right:2px;-webkit-transform:skew(0,-35deg) scaleY(.6);transform:skew(0,-35deg) scaleY(.6);box-shadow:inset 0 0 0 32px,0 13px,11px 26px,12px 39px}.icono-codepen:after{left:2px;-webkit-transform:skew(0,35deg) scaleY(.6);transform:skew(0,35deg) scaleY(.6);box-shadow:inset 0 0 0 32px,0 13px,-11px 26px,-12px 39px}.icono-blogger{width:24px;height:14px;border-radius:0 0 7px 7px;margin:14px 5px 6px}.icono-blogger,.icono-blogger:before{border-width:6px;border-style:solid}.icono-blogger:before{position:absolute;width:8px;height:2px;left:-6px;top:-15px;border-radius:6px 6px 0 0}.icono-disqus{width:31px;height:31px;box-shadow:inset 0 0 0 32px;border-radius:50%;margin:1px 1px 2px 2px}.icono-disqus:before{position:absolute;width:0;height:0;border:5px solid transparent;border-top:10px solid;-webkit-transform:rotate(50deg);transform:rotate(50deg);left:-5px;top:20px}.icono-dribbble{width:26px;height:26px;border-radius:50%;box-shadow:inset 0 0 0 2px;overflow:hidden;position:relative;background-image:radial-gradient(50% 100%,transparent 0,transparent 9px,currentColor 10px,currentColor 11px,transparent 12px);background-repeat:no-repeat;background-position:-8px center;-webkit-transform:rotate(-25deg);transform:rotate(-25deg);margin:4px}.icono-dribbble:after,.icono-dribbble:before{position:absolute;border-radius:50%;border:2px solid;width:40px;height:30px}.icono-dribbble:after{top:14px;left:-7px;width:32px}.icono-dribbble:before{left:-6px;top:-23px}.icono-creditCard{width:32px;height:24px;border-radius:3px;margin:5px 1px}.icono-creditCard:before{position:absolute;top:4px;width:100%;height:6px;box-shadow:inset 0 0 0 32px}.icono-creditCard:after{left:3px;bottom:3px;position:absolute;width:4px;height:2px;box-shadow:inset 0 0 0 32px,6px 0}.icono-cup{width:22px;height:16px;box-shadow:inset 0 0 0 32px;border-radius:0 0 5px 5px;margin:6px 6px 12px}.icono-cup:before{position:absolute;right:-3px;top:4px;width:5px;height:5px;border-radius:50%;box-shadow:0 0 0 2px}.icono-cup:after{bottom:-5px;width:26px;height:3px;border-radius:0 0 3px 3px;box-shadow:inset 0 0 0 32px}.icono-play{width:0;height:0;border-width:10px 0 10px 16px;border-style:solid;border-top-color:transparent;border-bottom-color:transparent;margin:7px 9px}.icono-pause{width:6px;height:20px;margin:7px 20px 7px 8px;box-shadow:inset 0 0 0 32px,12px 0 0 0}.icono-stop{width:0;height:0;border:10px solid;margin:7px}.icono-rewind{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.icono-forward,.icono-rewind{width:0;height:0;border:10px solid transparent;border-left:10px solid;margin:7px}.icono-forward:before,.icono-rewind:before{position:absolute;left:0;top:-10px;width:0;height:0;border:10px solid transparent;border-left:10px solid}.icono-next,.icono-previous{width:0;height:0;border:10px solid transparent;border-left:10px solid;border-right:none;margin:7px 14px 7px 10px;box-shadow:4px 0}.icono-previous{-webkit-transform:rotate(180deg);transform:rotate(180deg);margin:7px 10px 7px 14px}.icono-caretDown,.icono-caretDownCircle,.icono-caretDownSquare,.icono-caretLeft,.icono-caretLeftCircle,.icono-caretLeftSquare,.icono-caretRight,.icono-caretRightCircle,.icono-caretRightSquare,.icono-caretUp,.icono-caretUpCircle,.icono-caretUpSquare{width:12px;height:20px;margin:7px 11px}.icono-caretDown:after,.icono-caretDown:before,.icono-caretDownCircle:after,.icono-caretDownCircle:before,.icono-caretDownSquare:after,.icono-caretDownSquare:before,.icono-caretLeft:after,.icono-caretLeft:before,.icono-caretLeftCircle:after,.icono-caretLeftCircle:before,.icono-caretLeftSquare:after,.icono-caretLeftSquare:before,.icono-caretRight:after,.icono-caretRight:before,.icono-caretRightCircle:after,.icono-caretRightCircle:before,.icono-caretRightSquare:after,.icono-caretRightSquare:before,.icono-caretUp:after,.icono-caretUp:before,.icono-caretUpCircle:after,.icono-caretUpCircle:before,.icono-caretUpSquare:after,.icono-caretUpSquare:before{width:14px;height:2px;position:absolute;top:0;bottom:0;margin:auto 0;right:2px;box-shadow:inset 0 0 0 32px;-webkit-transform-origin:right;transform-origin:right}.icono-caretDown:before,.icono-caretDownCircle:before,.icono-caretDownSquare:before,.icono-caretLeft:before,.icono-caretLeftCircle:before,.icono-caretLeftSquare:before,.icono-caretRight:before,.icono-caretRightCircle:before,.icono-caretRightSquare:before,.icono-caretUp:before,.icono-caretUpCircle:before,.icono-caretUpSquare:before{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.icono-caretDown:after,.icono-caretDownCircle:after,.icono-caretDownSquare:after,.icono-caretLeft:after,.icono-caretLeftCircle:after,.icono-caretLeftSquare:after,.icono-caretRight:after,.icono-caretRightCircle:after,.icono-caretRightSquare:after,.icono-caretUp:after,.icono-caretUpCircle:after,.icono-caretUpSquare:after{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.icono-caretLeft,.icono-caretLeftCircle,.icono-caretLeftSquare{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.icono-caretUp,.icono-caretUpCircle,.icono-caretUpSquare{-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}.icono-caretDown,.icono-caretDownCircle,.icono-caretDownSquare{-webkit-transform:rotate(90deg);transform:rotate(90deg)}[class*=icono-caret][class*=Circle]:after,[class*=icono-caret][class*=Circle]:before,[class*=icono-caret][class*=Square]:after,[class*=icono-caret][class*=Square]:before{width:11px;right:8px}.icono-downArrow,.icono-leftArrow,.icono-rightArrow,.icono-upArrow{width:16px;height:4px;margin:15px 9px;box-shadow:inset 0 0 0 2px;-webkit-transform:translateX(-3px);transform:translateX(-3px)}.icono-moon,.icono-sun{width:22px;height:22px;margin:6px}.icono-downArrow:before,.icono-leftArrow:before,.icono-rightArrow:before,.icono-upArrow:before{border-style:solid;border-width:8px 0 8px 8px;border-color:transparent;border-left-color:inherit;left:100%;right:auto}.icono-leftArrow{-webkit-transform:translateX(3px) rotate(180deg);transform:translateX(3px) rotate(180deg)}.icono-upArrow{-webkit-transform:translateY(3px) rotate(-90deg);transform:translateY(3px) rotate(-90deg)}.icono-downArrow{-webkit-transform:translateY(-3px) rotate(90deg);transform:translateY(-3px) rotate(90deg)}.icono-sun{border:2px solid;border-radius:50%;box-shadow:-15px 0 0 -9px,15px 0 0 -9px,0 -15px 0 -9px,0 15px 0 -9px,11px 11px 0 -9px,-11px -11px 0 -9px,11px -11px 0 -9px,-11px 11px 0 -9px}.icono-moon{border-radius:50%;overflow:hidden}.icono-moon:before{position:absolute;width:20px;height:20px;top:-2px;left:6px;border-radius:50%;box-shadow:0 0 0 32px}.icono-cart{width:22px;height:0;border-width:14px 6px 0 2px;border-style:solid;border-right-color:transparent;border-left-color:transparent;margin:9px 3px 11px 9px}.icono-cart:before{position:absolute;width:4px;height:4px;border-radius:50%;box-shadow:inset 0 0 0 32px,13px 0,-4px -20px 0 1px;top:2px;left:-3px}.icono-sitemap{width:24px;height:2px;box-shadow:0 -5px;margin:21px 5px 11px}.icono-sitemap:before{width:6px;height:6px;border-radius:2px;box-shadow:inset 0 0 0 32px,11px 0,-11px 0,0 -14px 0 1px}.icono-sitemap:after{width:2px;height:10px;box-shadow:0 -7px,11px -5px,-11px -5px}.icono-circle{width:22px;height:22px;border:2px solid;border-radius:50%;margin:6px}.icono-ellipsis{width:4px;height:4px;box-shadow:0 -8px 0,0 0 0 32px inset,0 8px 0;margin:15px}.icono-spinner{width:22px;height:22px;border-radius:50%;box-shadow:-16px 0 0 -9px,-11px -11px 0 -9px,0 -16px 0 -9px,11px -11px 0 -8px,16px 0 0 -7px,11px 11px 0 -7px,0 16px 0 -7px,-11px 11px 0 -7px;margin:7px}.icono-bluetooth{width:3px;height:26px;box-shadow:inset 0 0 0 32px;margin:4px 15px 4px 16px}.icono-bluetooth:after,.icono-bluetooth:before{position:absolute;width:18px;height:8px;border-width:3px 3px 3px 0;border-style:solid;border-top-color:transparent;top:2px;left:-13px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.icono-bluetooth:after{top:10px;-webkit-transform:rotate(45deg) rotateX(180deg);transform:rotate(45deg) rotateX(180deg)}[class*=icono-]{display:inline-block;vertical-align:middle;position:relative;font-style:normal;color:currentColor;text-align:left;text-indent:-9999px;direction:ltr}[class*=icono-]:after,[class*=icono-]:before{content:'';pointer-events:none}[class*=icono-][class*=Circle]{border-radius:50%;width:30px;height:30px;margin:2px}[class*=icono-][class*=Square]{border-radius:4px;width:30px;height:30px;margin:2px}[class*=icono-],[class*=icono-] *{box-sizing:border-box}

<span id="1.4">event.js</span>

  1. let userData = {};
  2. let delUser = {};
  3. let editUser = {};
  4. /**
  5.  * 分页跳转的方法
  6.  * @param e: 被点击元素的上级元素
  7.  */
  8. document.querySelector('.paging').addEventListener('click', function (e) {
  9.     e.preventDefault();
  10.     console.log(e, e.target, this);
  11.     if (e.target === this) return;
  12.     // window.location.href = e.target.href;
  13.     myAjax(e.target.href.split('?')[1].split('=')[1])
  14. })
  16. /**
  17.  * 打开编辑用户的弹出窗的方法
  18.  * @param sid: 被编辑的用户的id
  19.  */
  20. function edit(sid) {
  21.     editUser = userData.data.filter(item => parseInt(item.sid) === parseInt(sid))[0];
  22.     document.querySelector('.masking').style.display = 'block';
  23.     document.querySelector('.edit-confirm').style.display = 'block';
  25.     console.log(editUser)
  26.     const form = document.querySelector('.edit-form');
  27.     let html = `<form>
  28.                       <label for="name">姓名: </label>
  29.                       <input type="text" name="name" id="name" value="${editUser.name}">
  30.                       <label for="${editUser.gender}">性别: </label>
  31.                       <div>`;
  32.     if (editUser.gender === 'male') {
  33.         html += `<input type="radio" name="gender" value="male" id="male" checked /><label for="male">男</label>
  34.                  <input type="radio" name="gender" value="female" id="female" /><label for="female">女</label>`
  35.     } else {
  36.         html += `<input type="radio" name="gender" value="male" id="male" /><label for="male">男</label>
  37.                  <input type="radio" name="gender" value="female" id="female" checked /><label for="female">女</label>`
  38.     }
  39.     html += `</div>
  40.                   <label for="age">年龄: </label>
  41. <!--              <input type="text" name="age" id="age" value="${editUser.age}">-->
  42.                   <input type="number" name="age" id="age" value="${editUser.age}" min="0" max="100" onkeypress="return (/[\\d]/.test(String.fromCharCode(event.keyCode)))" style="ime-mode: disabled">
  43.                   <label for="birthday">生日: </label>
  44.                   <input type="date" name="birthday" id="birthday" value="${editUser.birthday}">
  45.                   <label for="salary">工资: </label>
  46.                   <input type="text" name="salary" id="salary" value="${editUser.salary}" min="0">
  47.               </form>`;
  48.     form.innerHTML = html;
  49. }
  51. /**
  52.  * 关闭编辑用户的弹出窗的方法
  53.  */
  54. function editMaskingClose() {
  55.     document.querySelector('.masking').style.display = 'none';
  56.     document.querySelector('.edit-confirm').style.display = 'none';
  57. }
  59. /**
  60.  * 编辑的方法
  61.  * @param sid
  62.  */
  63. function editMaskingConfirm() {
  64.     const form = document.forms[0];
  65.     console.log(form.salary.value, parseFloat(form.salary.value));
  66.     if (/^[0-9]+.?[0-9]*$/.test(form.salary.value)) {
  67.         const xhr = new XMLHttpRequest();
  69.         const formData = new FormData();
  70.         formData.append('handle', 'update');
  71.         formData.append('sid', editUser.sid);
  72.         formData.append('name', form.name.value);
  73.         formData.append('gender', form.gender.value);
  74.         formData.append('age', parseInt(form.age.value));
  75.         formData.append('birthday', form.birthday.value);
  76.         formData.append('salary', parseFloat(form.salary.value));
  78.         xhr.open('POST', './Controller/handle.php?handle=update');
  79.         xhr.onload = (xhr) => {
  80.             const data = JSON.parse(xhr.target.response);
  81.             alert(data.code + ':' + data.message);
  82.             editMaskingClose();
  83.             if (data.code === 0) {
  84.                 myAjax(parseInt(userData.page));
  85.             }
  86.         }
  88.         xhr.send(formData);
  89.     } else {
  90.         alert('请输入正确的内容: 数字,小数');
  91.         form.salary.focus();
  92.     }
  93. }
  95. /**
  96.  * 打开是否删除用户的提示
  97.  * @param sid: 要删除的用户的id
  98.  */
  99. function del(sid) {
  100.     delUser = userData.data.filter(item => parseInt(item.sid) === parseInt(sid))[0];
  101.     document.querySelector('.masking').style.display = 'block';
  102.     document.querySelector('.del-confirm').style.display = 'block';
  103. }
  105. /**
  106.  * 关闭是否删除用户的提示
  107.  */
  108. function delMaskingClose() {
  109.     document.querySelector('.masking').style.display = 'none';
  110.     document.querySelector('.del-confirm').style.display = 'none';
  111. }
  113. /**
  114.  * 确定删除用户的方法
  115.  */
  116. function delMaskingConfirm() {
  117.     const xhr = new XMLHttpRequest();
  119.     const formData = new FormData();
  120.     formData.append('handle', 'delete');
  121.     formData.append('sid', delUser.sid);
  123.     xhr.open('POST', './Controller/handle.php?handle=delete');
  124.     xhr.onload = (xhr) => {
  125.         const data = JSON.parse(xhr.target.response);
  126.         alert(data.code + ':' + data.message);
  127.         delMaskingClose();
  128.         if (data.code === 0) {
  129.             myAjax(parseInt(userData.page));
  130.         }
  131.     }
  133.     xhr.send(formData);
  134. }
  137. /**
  138.  * 页面完成初始化后,自动调用的方法
  139.  */
  140. window.onload = function () {
  141.     myAjax();
  142. };
  144. /**
  145.  * 获取用户数据的方法
  146.  * @param page:当前页
  147.  */
  148. function myAjax(page = 1) {
  149.     const xhr = new XMLHttpRequest();
  150.     xhr.open('GET', './Controller/handle.php?handle=select&p=' + page);
  151.     xhr.onload = (xhr) => {
  152.         // console.log(JSON.parse(xhr.target.response));
  153.         userData = JSON.parse(xhr.target.response);
  154.         let tbodyDom = document.querySelector('.tbody');
  155.         tbodyDom.innerHTML = '';
  156.         const flag = new DocumentFragment();
  157.         for (let i = 0; i < userData.data.length; i++) {
  158.             const tr = document.createElement('tr');
  159.             tr.innerHTML = "<td>" + userData.data[i].sid + "</td>" +
  160.                 "<td>" + userData.data[i].name + "</td>" +
  161.                 "<td>" + userData.data[i].gender + "</td>" +
  162.                 "<td>" + userData.data[i].age + "</td>" +
  163.                 "<td>" + userData.data[i].birthday + "</td>" +
  164.                 "<td>" + userData.data[i].salary + "</td>" +
  165.                 "<td>" + userData.data[i].create_d + "</td>" +
  166.                 "<td>" + userData.data[i].update_d + "</td>" +
  167.                 "<td><button onclick='edit(" + userData.data[i].sid + ")'>编辑</button>" +
  168.                 "<button onclick='del(" + userData.data[i].sid + ")'>删除</button></td>";
  169.             flag.appendChild(tr);
  170.         }
  171.         tbodyDom.appendChild(flag);
  172.         paging(parseInt(userData.page), parseInt(userData.countPage));
  173.     }
  174.     xhr.send();
  175. }
  177. /**
  178.  * js动态添加分页组件的方法
  179.  * @param page:当前页
  180.  * @param countPage:总页
  181.  */
  182. function paging(page, countPage) {
  183.     let paging = document.querySelector('.paging');
  184.     paging.innerHTML = '';
  185.     const flag = new DocumentFragment();
  187.     let a = ac(1, '首页');
  188.     flag.appendChild(a);
  189.     a = ac(page - 1 <= 0 ? 1 : page - 1, '上一页');
  190.     flag.appendChild(a);
  192.     /*if (page - 5 === 0  && page + 5 <= countPage){
  194.     }else
  195.     */
  196.     if (page >= 7) {
  197.         a = document.createElement('a');
  198.         a.textContent = '...';
  199.         a.style.pointerEvents = 'none';
  200.         a.onclick = () => {return false};
  201.         flag.appendChild(a);
  203.         const p = page + 5 < countPage ? page + 5 : countPage;
  204.         for (let i = page - 5; i <= p; i++) {
  205.             const a = document.createElement('a');
  206.             a.textContent = i;
  207.             a.href = '/index.php?p=' + i;
  208.             a.className = i === page ? 'active' : '';
  209.             flag.appendChild(a);
  210.         }
  211.         if (page + 5 <= countPage) {
  212.             a = document.createElement('a');
  213.             a.textContent = '...';
  214.             a.style.pointerEvents = 'none';
  215.             a.onclick = () => {return false};
  216.             flag.appendChild(a);
  217.         }
  218.     } else {
  219.         for (let i = 1; i <= 8; i++) {
  220.             a = document.createElement('a');
  221.             a.textContent = i;
  222.             a.href = '/index.php?p=' + i;
  223.             a.className = i === page ? 'active' : '';
  224.             flag.appendChild(a);
  225.         }
  226.         a = document.createElement('a');
  227.         a.textContent = '...';
  228.         a.style.pointerEvents = 'none';
  229.         a.onclick = () => {return false};
  230.         flag.appendChild(a);
  231.     }
  233.     a = ac(page + 1 > countPage ? countPage : page + 1, '下一页');
  234.     flag.appendChild(a);
  235.     a = ac(countPage, '尾页');
  236.     flag.appendChild(a);
  238.     paging.appendChild(flag);
  239. }
  241. /**
  242.  * 生成分页按钮的方法
  243.  * @param p: 分页按钮的url参数
  244.  * @param text: 分页按钮的内容
  245.  */
  246. function ac(p, text) {
  247.     const a = document.createElement('a');
  248.     a.textContent = text;
  249.     a.href = '/index.php?p=' + p;
  250.     return a;
  251. }

<span id="1.5">style.css</span>

  1. * {
  2.     margin: 0;
  3.     padding: 0;
  4.     box-sizing: border-box;
  5.     color: #555555;
  6. }
  8. body {
  9.     display: flex;
  10.     flex-direction: column;
  11.     align-items: center;
  12. }
  14. /*禁掉input[type=number]的箭头*/
  15. input::-webkit-outer-spin-button,
  16. input::-webkit-inner-spin-button {
  17.     -webkit-appearance: none;
  18. }
  19. input[type="number"] {
  20.     -moz-appearance: textfield;
  21. }
  23. /*表格样式*/
  24. table {
  25.     width: 90%;
  26.     border: 1px solid;
  27.     border-collapse: collapse;
  28.     text-align: center;
  29. }
  31. table caption {
  32.     font-size: 1.2rem;
  33.     margin: 10px;
  34. }
  35. table td,
  36. table th {
  37.     border: 1px solid;
  38.     padding: 5px;
  39. }
  41. table tr:hover {
  42.     background-color: #eeeeee;
  43. }
  45. table thead tr:only-of-type {
  46.     background-color: lightcyan;
  47. }
  49. table button {
  50.     width: 56px;
  51.     height: 26px;
  52. }
  53. table button:last-of-type {
  54.     color: red;
  55. }
  56. table button {
  57.     cursor: pointer;
  58.     margin: 0 3px;
  59. }
  60. /*分页条样式*/
  61. body > p {
  62.     display: flex;
  63. }
  65. p > a {
  66.     text-decoration: none;
  67.     color: #555555;
  68.     border: 1px solid #888888;
  69.     padding: 5px 10px;
  70.     margin: 10px 2px;
  71. }
  73. .active {
  74.     background-color: seagreen;
  75.     color: white;
  76.     border: 1px solid seagreen;
  77. }
  79. .paging {
  80.     display: flex;
  81.     margin-top: 2em;
  82. }
  83. .paging > a {
  84.     text-decoration: none;
  85.     color: #555555;
  86.     border: 1px solid #888888;
  87.     padding: 5px 10px;
  88.     margin: 10px 2px;
  89. }
  90. .masking {
  91.     position: fixed;
  92.     top: 0;
  93.     right: 0;
  94.     bottom: 0;
  95.     left: 0;
  96.     background-color: rgba(0, 0, 0, .5);
  97.     display: none;
  98. }
  99. .masking .del-confirm {
  100.     width: 400px;
  101.     height: 300px;
  102.     background-color: #f4eded;
  103.     border-radius: 1em;
  104.     position: absolute;
  105.     margin: auto;
  106.     top: 0;
  107.     right: 0;
  108.     bottom: 0;
  109.     left: 0;
  110.     display: none;
  111. }
  112. .masking .edit-confirm {
  113.     width: 600px;
  114.     height: 400px;
  115.     background-color: #f4eded;
  116.     border-radius: 1em;
  117.     position: absolute;
  118.     margin: auto;
  119.     top: 0;
  120.     right: 0;
  121.     bottom: 0;
  122.     left: 0;
  123.     display: none;
  124. }
  125. .masking header,
  126. .masking footer {
  127.     display: flex;
  128.     justify-content: space-between;
  129.     align-items: center;
  130.     padding: 8px 16px;
  131.     border-bottom: 1px solid #3a3a3a;
  132. }
  133. .masking header button,
  134. .masking footer button {
  135.     background-color: transparent;
  136.     border: none;
  137.     height: 34px;
  138.     width: 50px;
  139.     cursor: pointer;
  140. }
  141. .masking masking-body {
  142.     height: calc(100% - 100px);
  143.     display: block;
  144.     padding: 16px;
  145. }
  146. .masking footer {
  147.     justify-content: center;
  148.     border-top: 1px solid #3a3a3a;
  149. }
  150. .masking footer button {
  151.     border: 1px solid #0d8aa5;
  152.     margin: 0 32px;
  153. }
  155. .masking .edit-confirm form {
  156.     display: grid;
  157.     grid-template-columns: 4em 1fr;
  158.     grid-template-rows: repeat(5, 2em);
  159.     gap: 1em 0;
  160. }
  161. .masking .edit-confirm form > label {
  162.     place-self: center;
  163. }
  165. .masking .edit-confirm form > input,
  166. .masking .edit-confirm form > div {
  167.     padding: 0 .5em;
  168.     line-height: 2em;
  169. }

<span id="1.6">index.php</span>

  1. <?php
  2. //require './Controller/handle.php';
  3. ?>
  4. <!DOCTYPE html>
  5. <html lang="en">
  7.     <head>
  8.         <meta charset="UTF-8">
  9.         <title>分页</title>
  10.         <link rel="stylesheet" href="./style.css">
  11.         <link rel="stylesheet" href="./pure-css3-icons/icono.min.css">
  12.     </head>
  14.     <body>
  15.         <table>
  16.             <caption>信息管理</caption>
  17.             <thead>
  18.             <tr>
  19.                 <th>序号</th>
  20.                 <th>姓名</th>
  21.                 <th>性别</th>
  22.                 <th>年龄</th>
  23.                 <th>生日</th>
  24.                 <th>工资</th>
  25.                 <th>添加时间</th>
  26.                 <th>修改时间</th>
  27.                 <th>操作</th>
  28.             </tr>
  29.             </thead>
  30.             <tbody class="tbody"></tbody>
  31.         </table>
  32.         <div class="paging"></div>
  34.         <div class="masking">
  35.             <div class="del-confirm">
  36.                 <header>
  37.                     <h3>警告</h3>
  38.                     <button onclick="delMaskingClose()"><i class="icono-cross"></i></button>
  39.                 </header>
  40.                 <masking-body>
  41.                     确定删除
  42.                 </masking-body>
  43.                 <footer>
  44.                     <button onclick="delMaskingClose()">取消</button>
  45.                     <button onclick="delMaskingConfirm()">确定</button>
  46.                 </footer>
  47.             </div>
  48.             <div class="edit-confirm">
  49.                 <header>
  50.                     <h3>编辑</h3>
  51.                     <button onclick="editMaskingClose()"><i class="icono-cross"></i></button>
  52.                 </header>
  53.                 <masking-body class="edit-form">
  54.                 </masking-body>
  55.                 <footer>
  56.                     <button onclick="editMaskingClose()">取消</button>
  57.                     <button onclick="editMaskingConfirm()">确定</button>
  58.                 </footer>
  59.             </div>
  60.         </div>
  61.         <script src="./event.js"></script>
  62.     </body>
  64. </html>

<span id="1.7">数据表</span>

  1. /*
  2. Navicat MySQL Data Transfer
  4. Source Server         : php_test
  5. Source Server Version : 50726
  6. Source Host           : localhost:3306
  7. Source Database       : phpedu
  9. Target Server Type    : MYSQL
  10. Target Server Version : 50726
  11. File Encoding         : 65001
  13. Date: 2021-02-27 16:11:15
  14. */
  16. SET FOREIGN_KEY_CHECKS=0;
  18. -- ----------------------------
  19. -- Table structure for staffs
  20. -- ----------------------------
  21. DROP TABLE IF EXISTS `staffs`;
  22. CREATE TABLE `staffs` (
  23.   `sid` int(10) unsigned NOT NULL AUTO_INCREMENT,
  24.   `name` varchar(150) COLLATE utf8mb4_unicode_ci NOT NULL COMMENT '姓名',
  25.   `gender` enum('male','female') COLLATE utf8mb4_unicode_ci NOT NULL COMMENT '性别',
  26.   `age` int(10) unsigned NOT NULL DEFAULT '0' COMMENT '年龄',
  27.   `birthday` date NOT NULL COMMENT '生日',
  28.   `salary` float(10,2) unsigned NOT NULL DEFAULT '3000.00' COMMENT '工资',
  29.   `create_d` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP COMMENT '创建日期',
  30.   `update_d` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP COMMENT '更新日期',
  31.   PRIMARY KEY (`sid`)
  32. ) ENGINE=InnoDB AUTO_INCREMENT=199 DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;
  34. -- ----------------------------
  35. -- Records of staffs
  36. -- ----------------------------
  37. INSERT INTO `staffs` VALUES ('3', 'wanger', 'female', '29', '1992-01-01', '9000.00', '2021-02-25 14:33:00', '2021-02-25 14:40:21');
  38. INSERT INTO `staffs` VALUES ('4', '张三1', 'male', '30', '1991-03-01', '9000.00', '2021-02-25 14:33:00', '2021-02-25 15:29:20');
  39. INSERT INTO `staffs` VALUES ('5', '张三2', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:33:00', '2021-02-25 14:40:21');
  40. INSERT INTO `staffs` VALUES ('6', '张三3', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:33:00', '2021-02-25 14:40:21');
  41. INSERT INTO `staffs` VALUES ('7', '张三4', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:33:00', '2021-02-25 14:40:21');
  42. INSERT INTO `staffs` VALUES ('8', '张三5', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:33:00', '2021-02-25 14:40:21');
  43. INSERT INTO `staffs` VALUES ('9', '张三6', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:33:00', '2021-02-25 14:40:21');
  44. INSERT INTO `staffs` VALUES ('10', '张三7', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:33:00', '2021-02-27 15:34:10');
  45. INSERT INTO `staffs` VALUES ('11', '张三.131', 'male', '30', '1097-01-01', '1900111.50', '2021-02-25 14:34:56', '2021-02-27 15:41:40');
  46. INSERT INTO `staffs` VALUES ('13', 'wanger', 'female', '29', '1992-01-01', '12141.00', '2021-02-25 14:34:56', '2021-02-27 15:35:06');
  47. INSERT INTO `staffs` VALUES ('14', '张三1', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:34:56', '2021-02-25 14:40:21');
  48. INSERT INTO `staffs` VALUES ('15', '张三2', 'male', '30', '1991-01-01', '242343.98', '2021-02-25 14:34:56', '2021-02-27 15:46:02');
  49. INSERT INTO `staffs` VALUES ('16', '张三3', 'male', '30', '1991-01-01', '9000.90', '2021-02-25 14:34:56', '2021-02-27 15:46:08');
  50. INSERT INTO `staffs` VALUES ('17', '张三4', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:34:56', '2021-02-25 14:40:21');
  51. INSERT INTO `staffs` VALUES ('18', '张三5', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:34:56', '2021-02-25 14:40:21');
  52. INSERT INTO `staffs` VALUES ('19', '张三6', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:34:56', '2021-02-25 14:40:21');
  53. INSERT INTO `staffs` VALUES ('20', '张三7', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:34:56', '2021-02-25 14:40:21');
  54. INSERT INTO `staffs` VALUES ('26', '张三', 'male', '30', '1991-01-01', '19000.00', '2021-02-25 14:35:26', '2021-02-25 14:41:10');
  55. INSERT INTO `staffs` VALUES ('27', '李四', 'male', '30', '1991-01-02', '9000.00', '2021-02-25 14:35:26', '2021-02-25 14:40:21');
  56. INSERT INTO `staffs` VALUES ('28', 'wanger', 'female', '29', '1992-01-01', '9000.00', '2021-02-25 14:35:26', '2021-02-25 14:40:21');
  57. INSERT INTO `staffs` VALUES ('29', '张三1', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:26', '2021-02-25 14:40:21');
  58. INSERT INTO `staffs` VALUES ('30', '张三2', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:26', '2021-02-25 14:40:21');
  59. INSERT INTO `staffs` VALUES ('31', '张三3', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:26', '2021-02-25 14:40:21');
  60. INSERT INTO `staffs` VALUES ('32', '张三4', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:26', '2021-02-25 14:40:21');
  61. INSERT INTO `staffs` VALUES ('33', '张三5', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:26', '2021-02-25 14:40:21');
  62. INSERT INTO `staffs` VALUES ('34', '张三6', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:26', '2021-02-25 14:40:21');
  63. INSERT INTO `staffs` VALUES ('35', '张三7', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:26', '2021-02-25 14:40:21');
  64. INSERT INTO `staffs` VALUES ('36', '张三', 'male', '30', '1991-01-01', '19000.00', '2021-02-25 14:35:26', '2021-02-25 14:41:10');
  65. INSERT INTO `staffs` VALUES ('37', '李四', 'male', '30', '1991-01-02', '9000.00', '2021-02-25 14:35:26', '2021-02-25 14:40:21');
  66. INSERT INTO `staffs` VALUES ('38', 'wanger', 'female', '29', '1992-01-01', '9000.00', '2021-02-25 14:35:26', '2021-02-25 14:40:21');
  67. INSERT INTO `staffs` VALUES ('39', '张三1', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:26', '2021-02-25 14:40:21');
  68. INSERT INTO `staffs` VALUES ('40', '张三2', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:26', '2021-02-25 14:40:21');
  69. INSERT INTO `staffs` VALUES ('41', '张三3', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:26', '2021-02-25 14:40:21');
  70. INSERT INTO `staffs` VALUES ('42', '张三4', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:26', '2021-02-25 14:40:21');
  71. INSERT INTO `staffs` VALUES ('43', '张三5', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:26', '2021-02-25 14:40:21');
  72. INSERT INTO `staffs` VALUES ('44', '张三6', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:26', '2021-02-25 14:40:21');
  73. INSERT INTO `staffs` VALUES ('45', '张三7', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:26', '2021-02-25 14:40:21');
  74. INSERT INTO `staffs` VALUES ('57', '张三', 'male', '30', '1991-01-01', '19000.00', '2021-02-25 14:35:29', '2021-02-25 14:41:10');
  75. INSERT INTO `staffs` VALUES ('58', '李四', 'male', '30', '1991-01-02', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  76. INSERT INTO `staffs` VALUES ('59', 'wanger', 'female', '29', '1992-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  77. INSERT INTO `staffs` VALUES ('60', '张三1', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  78. INSERT INTO `staffs` VALUES ('61', '张三2', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  79. INSERT INTO `staffs` VALUES ('62', '张三3', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  80. INSERT INTO `staffs` VALUES ('63', '张三4', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  81. INSERT INTO `staffs` VALUES ('64', '张三5', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  82. INSERT INTO `staffs` VALUES ('65', '张三6', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  83. INSERT INTO `staffs` VALUES ('66', '张三7', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  84. INSERT INTO `staffs` VALUES ('67', '张三', 'male', '30', '1991-01-01', '19000.00', '2021-02-25 14:35:29', '2021-02-25 14:41:10');
  85. INSERT INTO `staffs` VALUES ('68', '李四', 'male', '30', '1991-01-02', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  86. INSERT INTO `staffs` VALUES ('69', 'wanger', 'female', '29', '1992-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  87. INSERT INTO `staffs` VALUES ('70', '张三1', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  88. INSERT INTO `staffs` VALUES ('71', '张三2', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  89. INSERT INTO `staffs` VALUES ('72', '张三3', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  90. INSERT INTO `staffs` VALUES ('73', '张三4', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  91. INSERT INTO `staffs` VALUES ('74', '张三5', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  92. INSERT INTO `staffs` VALUES ('75', '张三6', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  93. INSERT INTO `staffs` VALUES ('76', '张三7', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  94. INSERT INTO `staffs` VALUES ('77', '张三', 'male', '30', '1991-01-01', '19000.00', '2021-02-25 14:35:29', '2021-02-25 14:41:10');
  95. INSERT INTO `staffs` VALUES ('78', '李四', 'male', '30', '1991-01-02', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  96. INSERT INTO `staffs` VALUES ('79', 'wanger', 'female', '29', '1992-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  97. INSERT INTO `staffs` VALUES ('80', '张三1', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  98. INSERT INTO `staffs` VALUES ('81', '张三2', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  99. INSERT INTO `staffs` VALUES ('82', '张三3', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  100. INSERT INTO `staffs` VALUES ('83', '张三4', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  101. INSERT INTO `staffs` VALUES ('84', '张三5', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  102. INSERT INTO `staffs` VALUES ('85', '张三6', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  103. INSERT INTO `staffs` VALUES ('86', '张三7', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  104. INSERT INTO `staffs` VALUES ('87', '张三', 'male', '30', '1991-01-01', '19000.00', '2021-02-25 14:35:29', '2021-02-25 14:41:10');
  105. INSERT INTO `staffs` VALUES ('88', '李四', 'male', '30', '1991-01-02', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  106. INSERT INTO `staffs` VALUES ('89', 'wanger', 'female', '29', '1992-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  107. INSERT INTO `staffs` VALUES ('90', '张三1', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  108. INSERT INTO `staffs` VALUES ('91', '张三2', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  109. INSERT INTO `staffs` VALUES ('92', '张三3', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  110. INSERT INTO `staffs` VALUES ('93', '张三4', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  111. INSERT INTO `staffs` VALUES ('94', '张三5', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  112. INSERT INTO `staffs` VALUES ('95', '张三6', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  113. INSERT INTO `staffs` VALUES ('96', '张三7', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:29', '2021-02-25 14:40:21');
  114. INSERT INTO `staffs` VALUES ('120', '张三', 'male', '30', '1991-01-01', '19000.00', '2021-02-25 14:35:31', '2021-02-25 14:41:10');
  115. INSERT INTO `staffs` VALUES ('121', '李四', 'male', '30', '1991-01-02', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  116. INSERT INTO `staffs` VALUES ('122', 'wanger', 'female', '29', '1992-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  117. INSERT INTO `staffs` VALUES ('123', '张三1', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  118. INSERT INTO `staffs` VALUES ('124', '张三2', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  119. INSERT INTO `staffs` VALUES ('125', '张三3', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  120. INSERT INTO `staffs` VALUES ('126', '张三4', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  121. INSERT INTO `staffs` VALUES ('127', '张三5', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  122. INSERT INTO `staffs` VALUES ('128', '张三6', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  123. INSERT INTO `staffs` VALUES ('129', '张三7', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  124. INSERT INTO `staffs` VALUES ('130', '张三', 'male', '30', '1991-01-01', '19000.00', '2021-02-25 14:35:31', '2021-02-25 14:41:10');
  125. INSERT INTO `staffs` VALUES ('131', '李四', 'male', '30', '1991-01-02', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  126. INSERT INTO `staffs` VALUES ('132', 'wanger', 'female', '29', '1992-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  127. INSERT INTO `staffs` VALUES ('133', '张三1', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  128. INSERT INTO `staffs` VALUES ('134', '张三2', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  129. INSERT INTO `staffs` VALUES ('135', '张三3', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  130. INSERT INTO `staffs` VALUES ('136', '张三4', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  131. INSERT INTO `staffs` VALUES ('137', '张三5', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  132. INSERT INTO `staffs` VALUES ('138', '张三6', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  133. INSERT INTO `staffs` VALUES ('139', '张三7', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  134. INSERT INTO `staffs` VALUES ('140', '张三', 'male', '30', '1991-01-01', '19000.00', '2021-02-25 14:35:31', '2021-02-25 14:41:10');
  135. INSERT INTO `staffs` VALUES ('141', '李四', 'male', '30', '1991-01-02', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  136. INSERT INTO `staffs` VALUES ('142', 'wanger', 'female', '29', '1992-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  137. INSERT INTO `staffs` VALUES ('143', '张三1', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  138. INSERT INTO `staffs` VALUES ('144', '张三2', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  139. INSERT INTO `staffs` VALUES ('145', '张三3', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  140. INSERT INTO `staffs` VALUES ('146', '张三4', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  141. INSERT INTO `staffs` VALUES ('147', '张三5', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  142. INSERT INTO `staffs` VALUES ('148', '张三6', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  143. INSERT INTO `staffs` VALUES ('149', '张三7', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  144. INSERT INTO `staffs` VALUES ('150', '张三', 'male', '30', '1991-01-01', '19000.00', '2021-02-25 14:35:31', '2021-02-25 14:41:10');
  145. INSERT INTO `staffs` VALUES ('151', '李四', 'male', '30', '1991-01-02', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  146. INSERT INTO `staffs` VALUES ('152', 'wanger', 'female', '29', '1992-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  147. INSERT INTO `staffs` VALUES ('153', '张三1', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  148. INSERT INTO `staffs` VALUES ('154', '张三2', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  149. INSERT INTO `staffs` VALUES ('155', '张三3', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  150. INSERT INTO `staffs` VALUES ('156', '张三4', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  151. INSERT INTO `staffs` VALUES ('157', '张三5', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  152. INSERT INTO `staffs` VALUES ('158', '张三6', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  153. INSERT INTO `staffs` VALUES ('159', '张三7', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  154. INSERT INTO `staffs` VALUES ('160', '张三', 'male', '30', '1991-01-01', '19000.00', '2021-02-25 14:35:31', '2021-02-25 14:41:10');
  155. INSERT INTO `staffs` VALUES ('161', '李四', 'male', '30', '1991-01-02', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  156. INSERT INTO `staffs` VALUES ('162', 'wanger', 'female', '29', '1992-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  157. INSERT INTO `staffs` VALUES ('163', '张三1', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  158. INSERT INTO `staffs` VALUES ('164', '张三2', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  159. INSERT INTO `staffs` VALUES ('165', '张三3', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  160. INSERT INTO `staffs` VALUES ('166', '张三4', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  161. INSERT INTO `staffs` VALUES ('167', '张三5', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  162. INSERT INTO `staffs` VALUES ('168', '张三6', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  163. INSERT INTO `staffs` VALUES ('169', '张三7', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  164. INSERT INTO `staffs` VALUES ('170', '张三', 'male', '30', '1991-01-01', '19000.00', '2021-02-25 14:35:31', '2021-02-25 14:41:10');
  165. INSERT INTO `staffs` VALUES ('171', '李四', 'male', '30', '1991-01-02', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  166. INSERT INTO `staffs` VALUES ('172', 'wanger', 'female', '29', '1992-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  167. INSERT INTO `staffs` VALUES ('173', '张三1', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  168. INSERT INTO `staffs` VALUES ('174', '张三2', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  169. INSERT INTO `staffs` VALUES ('175', '张三3', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  170. INSERT INTO `staffs` VALUES ('176', '张三4', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  171. INSERT INTO `staffs` VALUES ('177', '张三5', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  172. INSERT INTO `staffs` VALUES ('178', '张三6', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  173. INSERT INTO `staffs` VALUES ('179', '张三7', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  174. INSERT INTO `staffs` VALUES ('180', '张三', 'male', '30', '1991-01-01', '19000.00', '2021-02-25 14:35:31', '2021-02-25 14:41:10');
  175. INSERT INTO `staffs` VALUES ('181', '李四', 'male', '30', '1991-01-02', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  176. INSERT INTO `staffs` VALUES ('182', 'wanger', 'female', '29', '1992-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  177. INSERT INTO `staffs` VALUES ('183', '张三1', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  178. INSERT INTO `staffs` VALUES ('184', '张三2', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  179. INSERT INTO `staffs` VALUES ('185', '张三3', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  180. INSERT INTO `staffs` VALUES ('186', '张三4', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  181. INSERT INTO `staffs` VALUES ('187', '张三5', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  182. INSERT INTO `staffs` VALUES ('188', '张三6', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  183. INSERT INTO `staffs` VALUES ('189', '张三7', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  184. INSERT INTO `staffs` VALUES ('190', '张三', 'male', '30', '1991-01-01', '19000.00', '2021-02-25 14:35:31', '2021-02-25 14:41:10');
  185. INSERT INTO `staffs` VALUES ('191', '李四', 'male', '30', '1991-01-02', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  186. INSERT INTO `staffs` VALUES ('192', 'wanger', 'female', '29', '1992-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  187. INSERT INTO `staffs` VALUES ('193', '张三1', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  188. INSERT INTO `staffs` VALUES ('194', '张三2', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  189. INSERT INTO `staffs` VALUES ('195', '张三3', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  190. INSERT INTO `staffs` VALUES ('196', '张三4', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  191. INSERT INTO `staffs` VALUES ('197', '张三5', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');
  192. INSERT INTO `staffs` VALUES ('198', '张三6', 'male', '30', '1991-01-01', '9000.00', '2021-02-25 14:35:31', '2021-02-25 14:40:21');

[1]:
[1]: “效果图”

上一条： js：值传递引用传递、结构赋值、流程控制 下一条： 如何找到笔记本因为剪切时中断，文件不见了的文件
声明：本文内容转载自脚本之家，由网友自发贡献，版权归原作者所有，如您发现涉嫌抄袭侵权，请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言，请遵守新闻评论服务协议

相关文章

查看更多
热门课程