ThinkPhp学习笔记——文章添加界面处理

*============在控制器、模块、验证器、视图下、创建文章文件和文件夹=============↓

D:\phpStudy\WWW\niwo\application\admin\controller
复制粘贴Link.php,重命名 Article.php

D:\phpStudy\WWW\niwo\application\admin\model
复制粘贴Link.php,重命名 Article.php

D:\phpStudy\WWW\niwo\application\admin\validate
复制粘贴Link.php,重命名 Article.php

D:\phpStudy\WWW\niwo\application\admin\view
复制粘贴Link文件夹,重命名 article文件夹

*============在控制器、模块、验证器、视图下、创建文章文件和文件夹=============↑

*============在控制器里,修改文章文件=============↓

D:\phpStudy\WWW\niwo\application\admin\controller\Article.php
修改内容:
<?php
namespace app\Admin\controller;
use think\Controller;.
use app\Admin\model\Article as ArticleModel;  
class Article extends Controller
{
    public function lst()
    {
        $list = ArticleModel::paginate(3);// 分页输出列表 每页显示3条数据
        $this ->assign('list',$list); // 分配到模板名称为list,值就是获取到的
        return $this->fetch();
    }
    public function add()
    {
        if(request()->isPost()){
            $data=[
                'title'=>input('title'),
                'url'=>input('url'),
                'desc'=>input('desc'),
            ];
            $validate = \think\Loader::validate('Article');
            if(!$validate->scene('add')->check($data)){
                $this->error($validate->getError()); die;
            }
            if(db('Article')->insert($data)){
                return $this->success('添加文章成功!','lst');
            }else{
                return $this->error('添加文章失败!');
            }
            return;
        }
        return $this->fetch();
    }

    public function edit(){
        $id = input('id');
        $Article = db('Article')->find($id);
        if(request()->isPost()){ // 处理表单数据(判断是否以表单提交数据->post是从表单提交数据)
            $data = [ // 接收数据以数组格式
                'id' =>input('id'),
                'title' =>input('title'),
                'url' =>input('url'),
                'desc' =>input('desc'),
            ];
            $validate = \think\Loader::validate('Article');
            if(!$validate->scene('edit')->check($data)){ // 在编辑场景验证
                $this->error($validate->getError()); die;
            }
            if(db('Article')->update($data)){ 13:56 2018/6/12// 将数据库的Article表格修改成数组$data形式
                $this->success('修改文章成功!','lst');
            }else{
                $this->error('修改文章失败!');
            }
            return;
        }
        $this->assign('Article',$Article);
       return $this->fetch();
      }
    public function del(){
        $id = input('id');
        if (db('Article')->delete(input($id))) {
            $this->success('删除文章成功!', 'lst');
        } else {
            $this->error('删除文章失败!');
        }
    }
}

*============在控制器里,修改文章文件=============↑

*============在模块里,修改文章文件=============↓

D:\phpStudy\WWW\niwo\application\admin\model\Admin.php
修改内容:
<?php
namespace app\admin\model;
use think\Model;
class Article extends Model
{




}

D:\phpStudy\WWW\niwo\application\admin\validate\Article.php
<?php
namespace app\admin\validate;
use think\Validate;
class Arcticle extends Validate
{


}

D:\phpStudy\WWW\niwo\application\admin\view\common\left.html
原内容
<a href="/admin/document/index.html">
                                    <span class="menu-text">
                                        文章列表                                    </span>
                        <i class="menu-expand"></i>
                    </a>
修改内容:
<a href="{:url('article/lst')}">
                                    <span class="menu-text">
                                        文章列表                                    </span>
                        <i class="menu-expand"></i>
                    </a>

http://127.0.0.1/niwo/public/index.php/admin
看文章列表的网址
http://127.0.0.1/niwo/public/index.php/admin/article/lst.html

*============在模块里,修改文章文件=============↑

*============在视图里,修改文章列表内容=============↓

D:\phpStudy\WWW\niwo\application\admin\view\article\lst.html
修改内容:
把“连接”全部替换成“文章”
原内容
<button type="button" tooltip="添加连接" class="btn btn-sm btn-azure btn-addon" onClick="javascript:window.location.href = '{:url('Links/add')}'"> <i class="fa fa-plus"></i> Add
                </button>
修改为:
<button type="button" tooltip="添加文章" class="btn btn-sm btn-azure btn-addon" onClick="javascript:window.location.href = '{:url('article/add')}'"> <i class="fa fa-plus"></i> Add
                </button>

D:\phpStudy\WWW\niwo\application\admin\view\article\add.html
把“连接”和“链接”全部替换成“文章”

http://127.0.0.1/niwo/public/index.php/admin/article/add.html

*============在视图里,修改文章列表内容=============↑

*============在视图里,显示 添加文章 网页=============↓

D:\phpStudy\WWW\niwo\application\admin\view\article\lst.html
修改内容:
<button type="button" tooltip="添加文章" class="btn btn-sm btn-azure btn-addon" onClick="javascript:window.location.href = '{:url('article/add')}'"> <i class="fa fa-plus"></i> Add
                </button>

D:\phpStudy\WWW\niwo\application\admin\view\article\add.html
原内容
<li>
                        <a href="#">系统</a>
                    </li>
                    <li>
                        <a href="{:url('links/lst')}">文章管理</a>
                    </li>
修改为:
<li>
                        <a href="#">系统</a>
                    </li>
                    <li>
                        <a href="{:url('article/lst')}">文章管理</a>
                    </li>

进入数据库:
http://127.0.0.1/phpmyadmin/

原内容
<div class="form-group">
                                            <label for="group_id" class="col-sm-2 control-label no-padding-right">文章地址</label>
                                            <div class="col-sm-6">
                                                <input class="form-control" id="url" placeholder="" name="url"  type="text">

                                            </div>
                                            <p class="help-block col-sm-4 red">* 必填</p>
                                        </div>

修改为:
<div class="form-group">
                                            <label for="group_id" class="col-sm-2 control-label no-padding-right">文章作者</label>
                                            <div class="col-sm-6">
                                                <input class="form-control" id="url" placeholder="" name="url"  type="text">
                                            </div>
                                        </div>
                                            <div class="form-group">
                                                <label for="group_id" class="col-sm-2 control-label no-padding-right">关键字</label>
                                                <div class="col-sm-6">
                                                    <input class="form-control" id="url" placeholder="" name="url"  type="text">
                                                </div>
                                            </div>
文章标题下面加
</div>
<p class="help-block col-sm-4 red">* 必填</p>
</div>

http://127.0.0.1/niwo/public/index.php/admin/article/add.html

*============在视图里,显示 添加文章 网页=============↑

*============在视图里,添加文章、缩略图、所属栏目是否推荐按钮 =============↓

D:\phpStudy\WWW\niwo\application\admin\view\article\add.html
添加缩略图
内容修改为:
<div class="form-group">
                                            <label for="group_id" class="col-sm-2 control-label no-padding-right">文章描述</label>
                                            <div class="col-sm-6">
                                                <textarea name = "desc" class="form-control"></textarea>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label for="group_id" class="col-sm-2 control-label no-padding-right">缩略图</label>
                                            <div class="col-sm-6">
                                                <input  id="url" placeholder="" name="url"  type="file">
                                            </div>
                                        </div>
添加所属栏目
内容修改为:
<div class="form-group">
                                            <label for="group_id" class="col-sm-2 control-label no-padding-right">缩略图</label>
                                            <div class="col-sm-6">
                                                <input  id="url" placeholder="" name="url"  type="file">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label for="group_id" class="col-sm-2 control-label no-padding-right">所属栏目</label>
                                            <div class="col-sm-6">
                                                <select>
                                                    <option>请选着栏目</option>
                                                </select>
                                            </div>
                                        </div>
http://127.0.0.1/niwo/public/index.php/admin/article/add.html

添加是否推荐

file:///C:/Users/iheyu/Desktop/beyondadmin-v1.6.0.s3/form-inputs.html

Home   Forms  Input Elements
Colored Switches下面
选择一个按钮的样式后,按F12,选择你要复制的代码,鼠标右键复制HTML
D:\phpStudy\WWW\niwo\application\admin\view\article\add.html
内容修改为:
<div class="form-group">
                                            <label for="group_id" class="col-sm-2 control-label no-padding-right">是否推荐</label>
                                            <div class="col-sm-6">
                                                <label>
                                                    <input class="checkbox-slider colored-purple" type="checkbox">
                                                    <span class="text"></span>
                                                </label>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <div class="col-sm-offset-2 col-sm-10">
                                                <button type="submit" class="btn btn-default">保存信息</button>
                                            </div>

http://127.0.0.1/niwo/public/index.php/admin/article/add.html=
默认关闭:
<input class="checkbox-slider colored-darkorange" type="checkbox">
默认打开:
<input class="checkbox-slider colored-darkorange" checked="checked"type="checkbox">

*============在视图里,添加文章、缩略图、所属栏目是否推荐按钮=============↑

*============在视图里,引入、百度编辑器、文章添加界面=============↓
D:\phpStudy\WWW\niwo\application\admin\view\article\add.html
内容修改为:
<div class="form-group">
                                            <label for="group_id" class="col-sm-2 control-label no-padding-right">是否推荐</label>
                                            <div class="col-sm-6">
                                                <label>
                                                    <input class="checkbox-slider colored-darkorange" type="checkbox">
                                                    <span class="text"></span>
                                                </label>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label for="group_id" class="col-sm-2 control-label no-padding-right">文章内容</label>
                                            <div class="col-sm-6">
                                                <label>
                                                    <textarea name = "desc" class="form-control"></textarea>
                                                </label>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <div class="ol-sm-offset-2 col-sm-10">
                                                <button type="submit" class="btn btn-default">保存信息</button>
                                            </div>

D:\phpStudy\WWW\niwo\public\static\admin
新建文本文档“ueditor”百度编辑器
C:\Users(用户)\iheyu\Desktop(桌面)\ueditor
内容复制到:
D:\phpStudy\WWW\niwo\public\static\admin\ueditor

载入方法:
1、引入
ueditor.config.js
ueditor.all.min.js
lang/zh-cn/zh-cn.js

2、编辑器显示处  id="content"(标记位置)

3、(在底部写配置文件)
<script type="text/javascript">

    //实例化编辑器
    //建议使用工厂方法getEditor创建和引用编辑器实例,如果在某个闭包下引用该编辑器,直接调用UE.getEditor('editor')就能拿到相关的实例
    UE.getEditor('content',{initialFrameWidth:1500,initialFrameHeight:400,});
    


</script>

D:\phpStudy\WWW\niwo\application\admin\view\article\add.html
1.引入
<!--Beyond styles-->
    <link id="beyond-link" href="__PUBLIC__/style/beyond.css" rel="stylesheet" type="text/css">
    <link href="__PUBLIC__/style/demo.css" rel="stylesheet">
    <link href="__PUBLIC__/style/typicons.css" rel="stylesheet">
    <link href="__PUBLIC__/style/animate.css" rel="stylesheet">
    <script type="text/javascript" src="__PUBLIC__/ueditor/ueditor.config.js"></script>
    <script type="text/javascript" src="__PUBLIC__/ueditor/ueditor.all.min.js"></script>
    <script type="text/javascript" src="__PUBLIC__/ueditor/lang/zh-cn/zh-cn.js"></script>
</head>
<body>
2.编辑器显示处  id="content"(标记位置)

<div class="form-group">
                                            <label for="group_id" class="col-sm-2 control-label no-padding-right">文章内容</label>
                                            <div class="col-sm-6">
                                                <label>
                                                    <textarea name = "desc" class="form-control"id="content"></textarea>
                                                </label>
                                            </div>
                                        </div>
3.在底部写配置文件
<!--Beyond Scripts-->
<script src="__PUBLIC__/style/beyond.js"></script>
<script type="text/javascript">

    //实例化编辑器
    //建议使用工厂方法getEditor创建和引用编辑器实例,如果在某个闭包下引用该编辑器,直接调用UE.getEditor('editor')就能拿到相关的实例
    UE.getEditor('content',{initialFrameWidth:1500,initialFrameHeight:400,});



</script>


</body></html>
content和content对应
<textarea name = "desc" class="form-control"id="content"></textarea>
UE.getEditor('content',{initialFrameWidth:1500,initialFrameHeight:400,});
百度编辑器载入成功,但错位
内容修改:
<div class="form-group">
                                            <label for="group_id" class="col-sm-2 control-label no-padding-right">文章内容</label>
                                            <div class="col-sm-6">
                                                <label>
                                                    <textarea name = "desc""id="content"></textarea>
                                                </label>
                                            </div>
					</div>

						
内容修改:
width(宽度),不能为%比!
UE.getEditor('content',{initialFrameWidth:1000,initialFrameHeight:400,});

*============在视图里,引入、百度编辑器、文章添加界面=============↑

*============在控制器里,调用、所属栏目、修改内容=============↓

D:\phpStudy\WWW\niwo\application\admin\controller\Article.php
添加内容:
if(request()->isPost()){
            $data=[
                'title'=>input('title'),
                'url'=>input('url'),
                'desc'=>input('desc'),
            ];
            $validate = \think\Loader::validate('Article');
            if(!$validate->scene('add')->check($data)){
                $this->error($validate->getError()); die;
            }
            if(db('Article')->insert($data)){
                return $this->success('添加文章成功!','lst');
            }else{
                return $this->error('添加文章失败!');
            }
            return;
        }
        $cateres=db('cate')->select(); //调用多个栏目,(是二维数组所以用$cateres,表示)
        $this->assign('cateres',$cateres); //分配到模板当中('cateres',$cateres要和得到结果对应上)
        return $this->fetch();
    }

D:\phpStudy\WWW\niwo\application\admin\view\article\add.html
修改内容:
 <div class="form-group">
                                            <label for="group_id" class="col-sm-2 control-label no-padding-right">所属栏目</label>
                                            <div class="col-sm-6">
                                                <select>
                                                    <option>请选着栏目</option>
                                                    {volist name="cateres" id="vo"}
                                                    <option value="{$vo.id}">{$vo.catename}</option>
                                                    {/volist}
                                                </select>
                                            </div>
                                        </div>  
                                    
*============在控制器里,调用、所属栏目、修改内容=============↑

文章来源: ThinkPhp学习笔记——文章添加界面处理

人吐槽 人点赞

猜你喜欢

发表评论

用户名: 密码:
验证码: 匿名发表

你可以使用这些语言

查看评论:ThinkPhp学习笔记——文章添加界面处理