在PhpStorm中实现显示文章管理界面

最新推荐文章于 2021-03-17 05:07:33 发布

iheyu

最新推荐文章于 2021-03-17 05:07:33 发布

阅读量735

点赞数

分类专栏： thinkphp 数据库文章标签：创建数据库和表创建Article文件夹添加修改样式页面跳转

本文链接：https://blog.csdn.net/iheyu/article/details/89791158

版权

thinkphp 同时被 2 个专栏收录

53 篇文章 1 订阅

订阅专栏

数据库

7 篇文章 0 订阅

订阅专栏

1.http://localhost/phpMyAdmin/—>选择youhe数据库—>新建articlev2表;

//==========创建articlev2表==========↓
新建数据表
名字:
articlev2
字段数: 
6
//==========创建articlev2表==========↑

//==========编辑articlev2表的字段信息==========↓
编辑字段信息：

名字 输入
id
类型 选择
MEDIUMINT
索引 选择
PRIMARY
A_I(自增)
勾选
文章id
 
名字 输入
title
类型 选择
VARCHAR
长度/值 输入
60
注释 输入
文章标题
 
 
名字 输入
content
类型 选择
VARCHAR
长度/值 输入
255
注释 输入
文章内容

名字 输入
publish
类型 选择
INT
长度/值 输入
10
默认 输入
定义
0
注释 输入
文章发布
未发布0/已发布1)

名字 输入
pubdate
类型 选择
DATE
注释 输入
发布时间

名字 输入
addtime
类型 选择
DATE
注释 输入
添加时间

存储引擎 选择
MyISAM
 
点击 保存
//==========编辑articlev2表的字段信息==========↑

2.PhpStorm—>admin—>controller—>创建Article.php文件
D:\phpStudy\WWW\demo\application\admin\controller\Article.php
修改内容：
<?php
namespace app\admin\controller;
use think\Controller;
class Article extends Base
{
    public function lst()
    {
//        $artres= \think\Db::name('article')->alias('a')->join('cate c','c.id = a.cateid','LEFT')->field('a.id,a.title,a.pic,a.click,a.time,c.catename')->paginate(3);

        $artres= \think\Db::name('articlev2')->select();
        $this->assign('artres',$artres);
        return $this->fetch();
    }

    public function add()
    {
        if(request()->isPost()){
            $data=[
                'title'=>input('title'),
                'keywords'=>input('keywords'),
                'desc'=>input('desc'),
                'cateid'=>input('cateid'),
                'content'=>input('content'),
                'time'=>time(),
            ];
            if($_FILES['pic']['tmp_name']){
                // 获取表单上传文件 例如上传了001.jpg
                $file = request()->file('pic');
                // 移动到框架应用根目录/public/uploads/ 目录下
                // echo ROOT_PATH ;  die;
                $info = $file->move(ROOT_PATH . 'public' . DS . '/static/uploads');
                // var_dump($info); die;
                if($info){
                    // 成功上传后 获取上传信息
                    $data['pic']='/static/uploads/'.date('Ymd').'/'.$info->getFilename();
                    // 输出 42a79759f284b767dfcb2a0197904287.jpg
                    // echo $info->getFilename();  die;
                }else{
                    // 上传失败获取错误信息
                    return $this->error($file->getError());
                }
            }
            $validate = \think\Loader::validate('article');
//            dump($validate);
            if($validate->check($data)){
                $db= \think\Db::name('article')->insert($data);
                if($db){
                    return $this->success('添加文章成功！','lst');
                }else{
                    return $this->error('添加文章失败！');
                }
            }else{
                return $this->error($validate->getError());
            }

            return;
        }
        $cateres=db('cate')->select();
        $this->assign('cateres',$cateres);
        return $this->fetch();
    }


    public function edit()
    {
        if(request()->isPost()){
            $data=[
                'id'=>input('id'),
                'title'=>input('title'),

                'desc'=>input('desc'),
                'cateid'=>input('cateid'),
                'content'=>input('content'),
            ];
            if($_FILES['pic']['tmp_name']){
                // 获取表单上传文件 例如上传了001.jpg
                $file = request()->file('pic');
                // 移动到框架应用根目录/public/uploads/ 目录下
                // echo ROOT_PATH ;  die;
                $info = $file->move(ROOT_PATH . 'public' . DS . '/static/uploads');
                // var_dump($info); die;
                if($info){
                    // 成功上传后 获取上传信息
                    $data['pic']='/static/uploads/'.date('Ymd').'/'.$info->getFilename();
                    // 输出 42a79759f284b767dfcb2a0197904287.jpg
                    // echo $info->getFilename();  die;
                }else{
                    // 上传失败获取错误信息
                    return $this->error($file->getError());
                }
            }
            $validate = \think\Loader::validate('articlev2');
            if($validate->check($data)){
                $db= \think\Db::name('articlev2')->update($data);
                if($db){
                    return $this->success('修改文章成功！','lst');
                }else{
                    return $this->error('修改文章失败！');
                }
            }else{
                return $this->error($validate->getError());
            }

            return;
        }
        $arts= \think\Db::name('articlev2')->find(input('id'));//要查询数据
        dump($arts);
        $cateres=db('cate')->select();
        $this->assign('cateres',$cateres);
        $this->assign('arts',$arts);
        return $this->fetch();
    }

    public function del(){
        if(db('articlev2')->delete(input('id'))){
            return $this->success('删除文章成功！','lst');
        }else{
            return $this->error('删除文章失败！');
        }
    }


}

3.PhpStorm—>admin—>controller—>创建Article.php文件—>创建Base.php文件
D:\phpStudy\WWW\demo\application\admin\controller\Base.php
内容：
<?php
namespace app\admin\controller;
use think\Controller;
class Base extends Controller
{
    public function _initialize()
    {
        if(!session('id')){
             $this->error('请先登录系统！',url('Login/index'));
        }
    }
    

}

4.D:\phpStudy\WWW\demo\application\admin\view\Article\lst.html
修改内容：
<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <title>后台管理</title>
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/static/admin/css/common.css"/>
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/static/admin/css/main.css"/>
    <script type="text/javascript" 

src="__PUBLIC__/static/admin/js/libs/modernizr.min.js"></script>
</head>
<style type="text/css">
    ul.pagination  li{
        float: left;
    }
    div.list-page{
        width: 400px;
        margin: 0 auto;
        text-align: center;
    }
</style>
<body>

<div class="container clearfix">

    <!--/sidebar-->
    <div class="main-wrap">

        <div class="crumb-wrap">
            <div class="crumb-list"><i class="icon-font"></i><a href="__PUBLIC__/admin">首页

</a><span class="crumb-step">&gt;</span><span class="crumb-name">文章管理</span></div>
        </div>
        <div class="result-wrap">
            <form name="myform" id="myform" method="post">
                <div class="result-title">
                    <div class="result-list">
                        <a href="{:url('add')}"><i class="icon-font"></i>新增文章</a>
                    </div>
                </div>
                <div class="result-content">
                    <table class="result-tab" width="100%">
                        <tr>
                            <th width="3%">ID</th>
                            <th>文章标题</th>
                            <th>内容</th>
                            <th>发布</th>
                            <th>发布时间</th>
                            <th>添加时间</th>
                            <th>操作</th>
                        </tr>
                        {volist name="artres" id="vo"}
                        <tr>
                            <td>{$vo.id}</td>
                            <td>{$vo.title}</td>
                            <td>{$vo.content}</td>
                            <td>
                                {if $vo.publish eq 0}
                            <td>未发布</td>
                                {else /}
                            <td>已发布</td>
                                {/if}
                            </td>
                            <td>{$vo.pubdate}</td>
                            <td>{$vo.addtime}</td>
                            <td>
                                <a class="link-update" href="{:url('edit',array('id'=>$vo

['id']))}">修改</a>
                                <a class="link-del" onclick="return confirm('你确定要删除该文章吗

？');" href="{:url('del',array('id'=>$vo['id']))}">删除</a>
                            </td>
                        </tr>
                        {/volist}
                    </table>
                </div>
            </form>
        </div>
    </div>
    <!--/main-->
</div>
</body>
</html>

5.D:\phpStudy\WWW\demo\application\admin\view\Article\add.html
修改内容：
<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <title>后台管理</title>
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/static/admin/css/common.css"/>
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/static/admin/css/main.css"/>
    <script type="text/javascript" 

src="__PUBLIC__/static/admin/js/libs/modernizr.min.js"></script>
    <script type="text/javascript" 

src="__PUBLIC__/static/admin/ueditor/ueditor.config.js"></script>
    <script type="text/javascript" 

src="__PUBLIC__/static/admin/ueditor/ueditor.all.min.js"></script>
    <script type="text/javascript" src="__PUBLIC__/static/admin/ueditor/lang/zh-cn/zh-

cn.js"></script>
</head>
<body>

<div class="container clearfix">
    <!--/sidebar-->
    <div class="main-wrap">

        <div class="crumb-wrap">
            <div class="crumb-list"><i class="icon-font"></i><a 

href="__PUBLIC__/admin/design/">首页</a><span class="crumb-step">&gt;</span><a class="crumb-name" 

href="__PUBLIC__/admin/design/">文章管理</a><span class="crumb-step">&gt;</span><span>新增文章

</span></div>
        </div>
        <div class="result-wrap">
            <div class="result-content">
                <form action="" method="post" id="myform" name="myform" enctype="multipart/form-

data">
                    <table class="insert-tab" width="100%">
                        <tbody>
                            <tr>
                                <th width="10%"><i class="require-red">*</i>文章标题：</th>
                                <td>
                                    <input class="common-text required" id="title" name="title" 

size="50" value="" type="text">
                                </td>
                            </tr>
                            <tr>
                                <th>关键词：</th>
                                <td><input class="common-text" name="keywords" size="50" value="" 

type="text"></td>
                            </tr>
                            <tr>
                                <th>描述：</th>
                                <td><textarea name="desc" class="common-textarea" id="desc" 

cols="20" style="width: 50%;" rows="5"></textarea></td>
                            </tr>
                            <tr>
                                <th>所属栏目：</th>
                                <td>
                                    <select name="cateid">
                                        {volist name="cateres" id="vo"}
                                            <option value="{$vo.id}">{$vo.catename}</option>
                                        {/volist}
                                    </select>
                                </td>
                            </tr>
                            <tr>
                                <th>缩略图：</th>
                                <td><input type="file" name="pic" /></td>
                            </tr>
                            <tr>
                                <th>内容：</th>
                                <td><textarea name="content" class="common-textarea" id="content" 

cols="30" style="width: 98%;" rows="10"></textarea></td>
                            </tr>
                            <tr>
                                <th></th>
                                <td>
                                    <input class="btn btn-primary btn6 mr10" value="提交" 

type="submit">
                                    <input class="btn btn6" onclick="history.go(-1)" value="返回" 

type="button">
                                </td>
                            </tr>
                        </tbody></table>
                </form>
            </div>
        </div>

    </div>
    <!--/main-->
</div>
<script type="text/javascript">

    //实例化编辑器
    //建议使用工厂方法getEditor创建和引用编辑器实例，如果在某个闭包下引用该编辑器，直接调用

UE.getEditor('editor')就能拿到相关的实例
    UE.getEditor('content',{initialFrameWidth:1500,initialFrameHeight:400,});
    


</script>
</body>
</html>

6.D:\phpStudy\WWW\demo\application\admin\view\Article\edit.html
修改内容：
<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <title>后台管理</title>
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/static/admin/css/common.css"/>
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/static/admin/css/main.css"/>
    <script type="text/javascript" 

src="__PUBLIC__/static/admin/js/libs/modernizr.min.js"></script>
    <script type="text/javascript" 

src="__PUBLIC__/static/admin/ueditor/ueditor.config.js"></script>
    <script type="text/javascript" 

src="__PUBLIC__/static/admin/ueditor/ueditor.all.min.js"></script>
    <script type="text/javascript" src="__PUBLIC__/static/admin/ueditor/lang/zh-cn/zh-

cn.js"></script>
</head>
<body>

<div class="container clearfix">

    <!--/sidebar-->
    <div class="main-wrap">

        <div class="crumb-wrap">
            <div class="crumb-list"><i class="icon-font"></i><a 

href="__PUBLIC__/admin/design/">首页</a><span class="crumb-step">&gt;</span><a class="crumb-name" 

href="__PUBLIC__/admin/design/">文章管理</a><span class="crumb-step">&gt;</span><span>修改文章

</span></div>
        </div>
        <div class="result-wrap">
            <div class="result-content">
                <form action="" method="post" id="myform" name="myform" enctype="multipart/form-

data">
                    <input type="hidden" name="id" value="{$arts.id}">
                    <table class="insert-tab" width="100%">
                        <tbody>
                            <tr>
                                <th width="10%"><i class="require-red">*</i>文章标题：</th>
                                <td>
                                    <input class="common-text required" id="title" name="title" 

size="50" value="{$arts.title}" type="text">
                                </td>
                            </tr>


                            <tr>
                                <th>内容：</th>
                                <td><textarea name="content" class="common-textarea" id="content" 

cols="30" style="width: 98%;" rows="10">
                                    <?php echo htmlspecialchars_decode($arts['content']);?>
                                    
                                </textarea></td>
                            </tr>
                            <tr>
                                <th></th>
                                <td>
                                    <input class="btn btn-primary btn6 mr10" value="提交" 

type="submit">
                                    <input class="btn btn6" onclick="history.go(-1)" value="返回" 

type="button">
                                </td>
                            </tr>
                        </tbody></table>
                </form>
            </div>
        </div>

    </div>
    <!--/main-->
</div>
<script type="text/javascript">

    //实例化编辑器
    //建议使用工厂方法getEditor创建和引用编辑器实例，如果在某个闭包下引用该编辑器，直接调用

UE.getEditor('editor')就能拿到相关的实例
    UE.getEditor('content',{initialFrameWidth:1500,initialFrameHeight:400,});
    


</script>
</body>
</html>

没有格式的文章管理表
http://www.iheyu.com/demo/public/index.php/admin/article/lst.html

添加样式：
先在PhpStorm中做好备份(把原lst.html内容复制粘贴到lst1.html中)
D:\phpStudy\WWW\demo\application\admin\view\Article\lst1.html

7.DreamWarecs6中—>先做好文章管理表—>拆分—>把代码复制到PhpStorm中
D:\phpStudy\WWW\demo\application\admin\view\Article\lst.html
内容：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body>
<p align="center">文章管理
</p>
<div align="center">
  <table width="618" border="1">
    <tr>
      <td width="27">id</td>
      <td width="102">标题</td>
      <td width="117">内容</td>
      <td width="51">发布</td>
      <td width="84">发布时间</td>
      <td width="86">添加时间</td>
      <td width="105">操作</td>
    </tr>
    <tr>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td><form id="form1" name="form1" method="post" action="">
        <div align="center">
          <input type="submit" name="delete" id="delete" value="删除" />
            <input type="submit" name="edit" id="edit" value="修改" />
        </div>
      </form></td>
    </tr>
  </table>
</div>
<p align="center">&nbsp;</p>
</body>
</html>

页面有样式没有添加的管理员，不对！
http://www.iheyu.com/demo/public/index.php/admin/article/lst.html

8.D:\phpStudy\WWW\demo\application\admin\view\Article\lst.html
修改内容：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
</head>

<body>
<p align="center">文章管理
</p>
<div align="center">
    <table width="618" border="1">
        <tr>
            <td width="27">id</td>
            <td width="102">标题</td>
            <td width="117">内容</td>
            <td width="70">发布</td>
            <td width="100">发布时间</td>
            <td width="100">添加时间</td>
            <td width="105">操作</td>
        </tr>
        {volist name="artres" id="vo"}
        <tr>
            <td>{$vo.id}</td>
            <td>{$vo.title}</td>
            <td>{$vo.content}</td>
            <td>
                {if $vo.publish eq 0}
            未发布
            {else /}
            已发布
            {/if}
            </td>
            <td>{$vo.pubdate}</td>
            <td>{$vo.addtime}</td>
            <td><form id="form1" name="form1" method="post" action="">
                <div align="center">
                    <a class="link-update" href="{:url('edit',array('id'=>$vo['id']))}">修改</a>
                    <a class="link-del" onclick="return confirm('你确定要删除该文章吗？');" href="{:url('del',array('id'=>$vo['id']))}">删除</a>
                </div>
            </form></td>
        </tr>
        {/volist}
    </table>
</div>
<p align="center">&nbsp;</p>
</body>
</html>

****************************************************************************************************************************
未定义变量: vo(bug)
D:\phpStudy\WWW\demo\application\admin\view\Article\lst.html
{volist name="artres" id="vo"}
        <tr>
            <td>{$vo.id}</td>
            <td>{$vo.title}</td>
            <td>{$vo.content}</td>
            <td>
                {if $vo.publish eq 0}
                未发布
                {else /}
                已发布
                {/if}
            </td>
            <td>{$vo.pubdate}</td>
            <td>{$vo.addtime}</td>
            <td><form id="form1" name="form1" method="post" action="">
                <div align="center">
                    <input type="submit" name="delete" id="delete" value="删除" />
                    <input type="submit" name="edit" id="edit" value="修改" />
                </div>
            </form></td>
        </tr>
        {/volist}
    </table>
</div>
<p align="center">&nbsp;</p>
</body>
</html>
http://www.iheyu.com/demo2/public/index.php/admin/article/lst.html
***************************************************************************************************************************

***************************************************************************************************************************
未定义数组索引: publish(BUG)
C:\phpStudy\PHPTutorial\WWW\nihao\application\admin\controller\Article.php
打印文章数据：dump($artres);
<?php
namespace app\admin\controller;
use think\Controller;
class Article extends Base
{
    public function lst()
    {
//        $artres= \think\Db::name('article')->alias('a')->join('cate c','c.id = a.cateid','LEFT')->field('a.id,a.title,a.pic,a.click,a.time,c.catename')->paginate(3);
        $artres= \think\Db::name('articlevc')->select();
        $this->assign('artres',$artres);
        dump($artres);
        return $this->fetch();
    }
	
http://localhost/phpMyAdmin/
数据库—>要改的"articlevc"表—>结构—>修改publish字段(去掉前面的空格)

*****************************************************************************
http://www.iheyu.com/nihao/public/admin/article/lst.html

但是，在浏览器里面操作下面的"修改"和“删除”是按键没反应的！
9.D:\phpStudy\WWW\demo\application\admin\view\Article\lst.html
<td><form id="form1" name="form1" method="post" action="">
                <div align="center">
                    <a class="link-update" href="{:url('edit',array('id'=>$vo['id']))}">修改</a>
                    <a class="link-del" onclick="return confirm('你确定要删除该文章吗？');" href="{:url('del',array('id'=>$vo['id']))}">删除</a>
                </div>
            </form></td>
        </tr>
        {/volist}

把"修改"和“删除”样式改了，可以删除”了！
http://www.iheyu.com/demo/public/index.php/admin/article/lst.html

登录界面跳转到文章界面
D:\phpStudy\WWW\demo\application\admin\controller\Login.php
内容修改：
<?php
namespace app\admin\controller;
use think\Controller;
use app\admin\model\Login as Log;
class Login extends Controller
{
    public function index()
    {
        // $linkres= \think\Db::name('link')->paginate(3);
    	// $this->assign('linkres',$linkres);
        if(request()->isPost()){
            $login=new Log;
            $status=$login->login(input('username'),input('password'));
            if($status==1){
//                return $this->success('登录成功，正在跳转！','Index/index');
                return $this->success('登录成功，正在跳转！','Article/lst');
            }elseif($status==2){
                return $this->error('账号或者密码错误!');
            }else{
                 return $this->error('用户不存在!');
            }
        }
        return $this->fetch('login');
    }

    public function logout(){
        session(null);
        return $this->success('退出成功！',url('index'));
    }


 
}

http://www.iheyu.com/demo/public/index.php/admin/article/lst.html