![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
天蓬老师Correction status：qualified
Teacher's comments：完成不错, 超出要求
Collection
Collection
将仿蜂鸟网的静态页面改写为动态页面
利用内联框架实现简单的后台人员信息的增删改查，并同步显示操作结果
通过控制器和路由来引导页面切换
页面模板：仿蜂鸟首页、人员信息管理页、人员信息增加页、更新页、查询页
控制器：首页类、人员信息管理类
核心文件：模型类、视图类、公共函数库、路由（启动器）
composer组件：nette数据库操作类
其他：入口文件、composer.json、composer.lock
入口文件
->路由（由参数判断该使用哪个控制器及哪个方法，实例化模型对象和视图对象）
->控制器（向模型类索取数据）
->模型类（查询处理数据，并返回给控制器）
->控制器（将模型数据发送给视图对象）
->视图类（获取网页模板，分配参数数据，渲染输出）
->前台展示页面（展示网页信息）
->路由（通过参数完成网页间跳转）
->后台信息管理页面
注意：项目内所有静态资源都是以入口文件为基准来确定路径
组织项目整体框架：设定项目根文件夹、设定core、view、web、子文件夹，新建一个composer.json空文件
在命令行页面运行composer install命令，生成vendor文件夹和自动加载文件
修改自动加载文件，将命名空间和公共函数库文件与文件路径形成映射，在命令行运行composer dump命令写入修改信息
安装composer组件，在命令行输入composer require nette/database安装数据库操作组件
将仿蜂鸟网模板文件拷贝至view文件夹，并在该文件夹下新建人员信息管理的相关html页面
在项目根目录下，新建入口index文件
在core文件夹中新建路由（启动器）文件和公共函数库文件
新建视图类文件
新建模型类文件
在web的子文件夹controller中建立控制器文件Index和User
项目调试
//引入自动加载文件require __DIR__.'/vendor/autoload.php';//导入启动器use core\Bootstrap;//运行启动器Bootstrap::run();
//使用命名空间namespace core;//定义启动器类class Bootstrap{ //启动方法 public static function run(){ static ::parseUrl(); } //路由方法 protected static function parseUrl(){ //过滤查询字符串 $queryString = filter_input(INPUT_SERVER,'QUERY_STRING',FILTER_SANITIZE_STRING); //将查询字符串转为数组 parse_str($queryString,$request); //判断是否有参数通过get途径传递 if(isset($_GET['c'])){ //获得控制器的类名，并将首字母大写 $controller = 'web\controller\\'.ucfirst($request['c']); //获得控制器的方法名 $action = $request['a']; //获得通过查询字符串中的参数，去掉索引为0和1的就是参数 $paparms = array_slice($request,2); //过滤掉参数数组中的空值 $paparms = array_filter($paparms); } else{ //当查询字符串中没有指定控制器类名和方法名时，默认选择主页控制器 $controller = 'web\controller\Index'; $action = 'index'; } //实例化视图对象 $view = new View; //实例化模型对象，并连接数据库 $modle = new Model('mysql:host=localhost;dbname=test','root1','root123'); //向页面输出 echo (new $controller($modle,$view))->$action(); }}//使用命名空间namespace core;//定义视图类class View{ //声明属性，用来存放模板文件名，字符串类型 private $templateFile = null; //声明属性，用来存放待分配的参数数据 private $paparms = []; //获取模板文件名，为了方便链式调用，返回值为对象实例 public function make($fileName) { $this->templateFile = $fileName; return $this; } //获取参数数据，并存入参数数组，为了方便链式调用，返回值为对象实例 public function with($name, $value) { $this->paparms[$name] = $value; return $this; } //魔术方法，可以让对象按字符串输出 public function __toString() { //使用数组键名作为变量名，使用数组键值作为变量值。针对数组中的每个元素，将在当前符号表中创建对应的一个变量 extract($this->paparms); //引入模板文件 require $this->templateFile; //返回空字符串，因为该魔术方法的返回值要求是字符串 return ''; }}//使用命名空间namespace core;//引入组件类use Nette\Database\Connection;//定义模型类class Model{ // 连接对象 protected $database; // 默认数据表名称 protected $table; // 连接数据库 public function __construct($dsn, $user, $password) { $this->database = new Connection($dsn, $user, $password); } // 设置数据表 public function table(string $table) : object { $this->table = $table; return $this; } // 多条查询 public function select($table,$where=null,$arr=null) { //判断参数数组是否为空 if(!is_null($arr)){ $datas = $this->table($table)->database ->fetchAll('SELECT * FROM ' . $this->table. $where ,$arr); } else{ $datas = $this->table($table)->database->fetchAll('SELECT * FROM ' . $this->table. $where ); } return $datas; } //删除数据 public function delete($table,$where){ $result = $this->table($table)->database ->query('DELETE FROM ' . $this->table . ' WHERE id = ?', $where); return $result->getRowCount(); } //插入数据 public function insert($table,$arr){ $this->table($table)->database->query('INSERT INTO ' . $this->table . ' ?', $arr); return $this->database->getInsertId(); } //更新数据 public function update($table,$arr,$id){ $result = $this->table($table)->database ->query(' UPDATE ' . $this->table . ' SET ', $arr, 'WHERE id = ?', $id); return $result->getRowCount(); }}//使用命名空间namespace web\controller;//定义主页类class Index{ //用依赖注入的方法，将实例化对象放在类的外部 private $modle; private $view; //初始化，通过参数获得实例化的对象 public function __construct($modle,$view) { $this->modle = $modle; $this->view = $view; } //定义主页方法 public function index(){ //获取主页动态输出的数据 $datas['mainnav'] = $this->modle->select('mainnav'); $datas['navlist'] = $this->modle->select('navlist'); $datas['newsType'] = $this->modle->select('newstype'); $datas['newsInfo'] = $this->modle->select('newsinfo'); $datas['picnav'] = $this->modle->select('picnav'); $datas['picInfo'] = $this->modle->select('picinfo'); $datas['goods'] = $this->modle->select('goodsinfo',' INNER JOIN goodsimg ON goodsinfo.gid=goodsimg.mgid'); $datas['partner'] = $this->modle->select('partner'); //通过链式调用，输出 echo $this->view->make('view/index/index.php')->with('datas',$datas); }}//使用命名空间namespace web\controller;//定义用户管理类class User{ //用依赖注入，将对象实例化放在类的外部 private $modle; private $view; //初始化 public function __construct($modle, $view) { $this->modle = $modle; $this->view = $view; } //查询所有用户数据 public function select() { $datas = $this->modle->select('new_user'); echo $this->view->make('view/user/select.php')->with('datas', $datas); } //按条件查询用户数据 public function select10() { //判断是否有post传过来的参数，有说明应该进入查询并显示的环节，没有就说明应该进入填写查询条件的环节 //这段代码主要解决按条件查询后可以实时显示的问题 if(empty($_POST['id'])&&empty($_POST['name'])&&empty($_POST['email'])){ echo $this->view->make('view/user/select10.php'); } else { $name = $_POST['name']; $email = $_POST['email']; $id = $_POST['id']; //将post的值清空，以便下次进行查询 $_POST['name'] = null; $_POST['email'] = null; $_POST['id'] = null; //将值放入数组中，以便传入查询函数 $arr = [ 'name' => $name, 'email' => $email, 'id' => $id, ]; //过滤掉数组中的空值 $arr = array_filter($arr); $datas = $this->modle->select('new_user',' WHERE ',$arr); echo $this->view->make('view/user/select11.php')->with('datas', $datas); } } //删除用户数据 public function delete() { //获取前端选择要删除的用户id， $id = $_POST['deleteUser']; //按照id逐个删除 foreach($id as $value){ $this->modle->delete('new_user', $value); } //查询删除后剩下的结果，并显示 $datas = $this->modle->select('new_user'); echo $this->view->make('view/user/select.php')->with('datas', $datas); } //增加用户数据 public function insert() { //判断是否插入有数据，如果无进入插入页面，如果有在执行插入后回到查询页面 if (empty($_POST['insertname'])) { echo $this->view->make('view/user/insertuser.php'); } else { $name = $_POST['insertname']; $email = $_POST['insertemail']; $password = $_POST['insertpassword']; $_POST['insertname'] = null; $_POST['insertemail'] = null; $_POST['insertpassword'] = null; $arr = [ 'name' => $name, 'email' => $email, 'password' => md5($password), 'regs_time' => date('Y-m-d', time()) ]; //执行数据插入 $this->modle->insert('new_user', $arr); //查询插入后的结果 $datas = $this->modle->select('new_user'); //输出显示 echo $this->view->make('view/user/select.php')->with('datas', $datas); } } //更新用户信息 public function update() { //看前端是否有post值传过来，没有就进入到更新待选页，有就进入到更新信息的填写页 if (empty($_POST['id'])) { $datas = $this->modle->select('new_user'); echo $this->view->make('view/user/update1.php')->with('datas', $datas); } else { $datas = $this->modle->select('new_user', ' WHERE id=' . $_POST['id']); echo $this->view->make('view/user/updateuser.php')->with('datas', $datas); } } //用户更新信息填写页 public function updatego() { $name = $_POST['updataname']; $email = $_POST['updataemail']; $password = $_POST['updatapassword']; $id = $_POST['id']; $_POST['updataname'] = null; $_POST['updataemail'] = null; $_POST['updatapassword'] = null; $arr = [ 'name' => $name, 'email' => $email, 'password' => md5($password), ]; $arr = array_filter($arr); //更新信息 $this->modle->update('new_user', $arr, $id); //查询更新之后的结果 $datas = $this->modle->select('new_user'); echo $this->view->make('view/user/select.php')->with('datas', $datas); } //用户信息管理首页 public function user() { echo $this->view->make('view/user/user.php'); }}<main> <!-- 首页头部导航与轮播--> <div class="index-header"> <div class="content"> <!--logo与搜索框,快速入口--> <div class="log-search"> <a href="" class="logo"><img src="view/static/images/logo.png" alt=""></a> <div class="search"> <input type="search" name="search" id="search"> <label for="search" class="iconfont icon-jinduchaxun"></label> </div> <div class="quick-entry"> <a href="" class="iconfont icon-huiyuan1"></a> <a href="" class="iconfont icon-danmu1"></a> <a href="" class="iconfont icon-fabu"></a> <a href="" class="iconfont icon-fangda"></a> <a href="" class="iconfont icon-huiyuan2"></a> <a href="" class="iconfont icon-dianzan"></a> </div> </div> <!--主导航--> <div class="main-nav"> <!--导航详情1--> <?php foreach($datas['mainnav'] as $mainNavData) :?> <!--导航详情1--> <div class="nav-detail"> <!--左侧图标与描述--> <div class="pic"> <span class="<?php echo $mainNavData['pic']?>"></span> <div> <span><?php echo mb_substr($mainNavData['name'],0,2) ?></span> <span><?php echo mb_substr($mainNavData['name'],2,2) ?></span> </div> </div> <!--右侧导航链接--> <div class="links"> <?php foreach($datas['navlist'] as $navlistData) : ?> <?php if($navlistData['nid']===$mainNavData['nid']) :?> <a href=""><?php echo $navlistData['name'] ?></a> <?php endif ?> <?php endforeach ?> </div> </div> <?php endforeach ?> </div> <!--轮播图--> <div class="slider"> <a href=""><img src="view/static/images/2.jpg" alt=""></a> <a href=""><img src="view/static/images/banner-right.jpg" alt=""></a> </div> </div> </div> <!-- 新闻资讯--> <!--引入大标题组件--> <div class="public-headline"> <span>新闻资讯</span> </div> <div class="index-news"> <!-- 左侧图片列表--> <div class="imgs"> <a href=""><img src="view/static/images/news.jpg" alt="" class="first-img"></a> <div> <a href=""><img src="view/static/images/n-2.jpg" alt=""></a> <a href="">三星Note10发布搭载挖孔前摄</a> </div> <div> <a href=""><img src="view/static/images/n-3.jpg" alt=""></a> <a href="">小米公布1亿像素手机信息</a> </div> </div> <!-- 中间与右边信息列表共用样式--> <?php foreach($datas['newsType'] as $newsTypeData) :?> <div class="list"> <a href=""><?php echo $newsTypeData['title']; ?></a> <ul> <?php foreach($datas['newsInfo'] as $newsInfoData):?> <?php if($newsInfoData['type']===$newsTypeData['nid']) :?> <li><span>[<?php echo $newsTypeData['type'];?>]</span><a href=""><?php echo $newsInfoData['title'];?></a></li> <?php endif ?> <?php endforeach?> </ul> </div> <?php endforeach ?> </div> <!--引入大标题组件--> <div class="public-headline"> <span>图片专区</span> </div> <!-- 图文列表专区--> <div class="public-image-list"> <?php foreach($datas['picnav'] as $picnavData) :?> <div class="list"> <div class="title"> <a href=""><?php echo $picnavData['name']?></a> <span>纵观摄影艺术</span> </div> <div class="img-list"> <?php $i=0; ?> <?php foreach($datas['picInfo'] as $picInfoData) :?> <?php if(($picInfoData['type']===$picnavData['pid'])&&$i<4):?> <div> <a href=""><img src="view/static/images/<?php echo $picInfoData['link']?>" alt=""></a> <a href=""><?php echo $picInfoData['info']?></a> </div> <?php $i++; ?> <?php endif;?> <?php endforeach;?> </div> </div> <?php endforeach;?> </div> <!-- 二手交易专区--> <!--引入大标题组件--> <div class="public-headline"> <span>二手交易</span> </div> <!--二手交易专区--> <div class="public-second-hand"> <!-- 标题1--> <div class="title1"> <a href="">抢好货</a> <span>0低价, 便捷,安全,快速</span> </div> <!-- 标题2--> <div class="title2"> <span>热门分类</span> <a href="">美女写真</a> <a href="">日本美女</a> <a href="">美国美女</a> <a href="">国内美女</a> <a href="">AV美女</a> </div> <!--商品展示区--> <div class="goods"> <!--左侧商品列表--> <div class="goods-list"> <!-- 商品简介--> <?php $i=0; ?> <?php foreach($datas['goods'] as $goodsData): ?> <?php $i++; ?> <?php if($i<9): ?> <div class="intro"> <a href=""><img src="view/static/images/shop/<?php echo $goodsData['imglink']?>" alt="" width="176" height="120"></a> <a href=""><?php echo $goodsData['goods_name']?></a> <div> <span>¥ <?php echo $goodsData['price']?></span> <span><?php echo $goodsData['flag']?></span> </div> </div> <?php endif ?> <?php endforeach ?> </div> <!--右侧功能快速入口--> <div class="quick-entry"> <a href=""><img src="view/static/images/ad/1.png" alt=""></a> <a href=""><img src="view/static/images/ad/2.png" alt=""></a> <a href=""><img src="view/static/images/ad/3.png" alt=""></a> <a href=""><img src="view/static/images/ad/4.png" alt=""></a> <div> <a href=""><img src="view/static/images/ad/image.png" alt=""></a> <a href=""><img src="view/static/images/ad/ad2.jpg" alt=""></a> </div> </div> </div> </div> <!-- 大标题--> <div class="public-headline"> <span>合作单位</span> </div> <!-- 合作友情链接--> <div class="index-frend-links"> <?foreach($datas['partner'] as $partnerData):?> <a href="<?php echo $partnerData['link']?>"><?php echo $partnerData['name']?></a> <?endforeach?> </div> </main>
<main> <h2>用户信息管理</h2> <div> <span> <a href="index.php?c=user&a=select10" target="userinfo">查询</a> <a href="index.php?c=user&a=update" target="userinfo">更新</a> <a href="index.php?c=user&a=select" target="userinfo">删除</a> <a href="index.php?c=user&a=insert" target="userinfo">插入</a> <a href="index.php">退出</a> </span> <iframe src="index.php?c=user&a=select" frameborder="1" name="userinfo" width="600px" height="221px"></iframe> </div></main>
<form action="index.php?c=user&a=insert" method="post"> <table border="1px" cellspacing="0"> <caption>增加用户</caption> <tr bgcolor="#faebd7"> <td align="center">姓名</td> <td align="center">邮箱</td> <td align="center">密码</td> <td align="center">操作</td> </tr> <tr> <td><input type="text" name="insertname"></td> <td><input type="email" name="insertemail"></td> <td><input type="password" name="insertpassword"></td> <td><button>确定</button></td> </tr> </table></form>
<form action="index.php?c=user&a=delete" method="post"> <table border="1px" cellspacing="0"> <tr bgcolor="#faebd7"> <th>ID</th> <th>姓名</th> <th>邮箱</th> <th>注册时间</th> <th><button>删除</button></th> </tr> <?php foreach ($datas as $data):?> <tr> <td><?php echo $data['id']; ?></td> <td><?php echo $data['name']; ?></td> <td><?php echo $data['email']; ?></td> <td><?php echo $data['regs_time']; ?></td> <td><input type="checkbox" name="deleteUser[]" value="<?php echo $data['id']; ?>"></td> </tr> <?php endforeach;?> </table></form>
1
<form action="index.php?c=user&a=update" method="post">
<table border="1px" cellspacing="0">
<tr bgcolor="#faebd7">
<th>ID</th>
<th>姓名</th>
<th>邮箱</th>
<th>注册时间</th>
<th><button>更新</button></th>
</tr>
<?php foreach ($datas as $data):?>
<tr>
<td><?php echo $data['id']; ?></td>
<td><?php echo $data['name']; ?></td>
<td><?php echo $data['email']; ?></td>
<td><?php echo $data['regs_time']; ?></td>
<td><input type="radio" name="id" value="<?php echo $data['id']; ?>"></td>
</tr>
<?php endforeach;?>
</table>
</form>
2
<form action="index.php?c=user&a=select10" method="post">
<table border="1px" cellspacing="0">
<caption>查询结果</caption>
<tr bgcolor="#faebd7">
<th>ID</th>
<th>姓名</th>
<th>邮箱</th>
<th>注册时间</th>
</tr>
<?php foreach ($datas as $data):?>
<tr>
<td><?php echo $data['id']; ?></td>
<td><?php echo $data['name']; ?></td>
<td><?php echo $data['email']; ?></td>
<td><?php echo $data['regs_time']; ?></td>
</tr>
<?php endforeach;?>
</table>
</form>
<form action="index.php?c=user&a=select10" method="post">
<table border="1px" cellspacing="0">
<caption>用户信息查询</caption>
<tr bgcolor="#faebd7">
<td align="center">ID</td>
<td align="center">姓名</td>
<td align="center">邮箱</td>
<td align="center">操作</td>
</tr>
<tr>
<td><input type="text" name="id"></td>
<td><input type="text" name="name"></td>
<td><input type="email" name="email"></td>
<td ><button>查询</button></td>
</tr>
</table>
</form>
<form action="index.php?c=user&a=updatego" method="post">
<table border="1px" cellspacing="0">
<caption>用户信息更新</caption>
<tr bgcolor="#faebd7">
<td align="center">ID</td>
<td align="center">姓名</td>
<td align="center">邮箱</td>
<td align="center">密码</td>
<td align="center">操作</td>
</tr>
<tr bgcolor="#faebd7">
<td rowspan="2">
<?php echo $_POST['id']?>
<input type="hidden" name="id" value="<?php echo $_POST['id']?>">
</td>
<?php foreach ($datas as $data):?>
<td><?php echo $data['name']; ?></td>
<td><?php echo $data['email']; ?></td>
<td>**********</td>
<?php endforeach;?>
<td rowspan="2"><button>确定</button></td>
</tr>
<tr>
<td><input type="text" name="updataname"></td>
<td><input type="email" name="updataemail"></td>
<td><input type="password" name="updatapassword"></td>
</tr>
</table>
</form>
服务容器container在这个案例中应该怎么使用
门面技术Facade在这个案例中应该怎么使用
从后台人员管理页面退出至主页的时候，主页上有时会有乱码，但刷新一下就恢复了