Thinkphp 文件上传

1、路由

Route::rule('fileUpload/:dir','index/FileUpload/index');

2、页面主要内容

 $('#exampleModal').on('show.bs.modal', function (event) {
            var button = $(event.relatedTarget)
            var imgpath = button.data('imgpath')
            var title = button.data('imgtitle')
            var info = button.data('productinfo')
            var productid = button.data('productid')


            if (productid === undefined) {
                window.alert("productid 未定义");
            }

            var modal = $(this)
            modal.find('.modal-title').text(title)
            //单图
            //modal.find('.modal-body img').attr('src',imgpath)                     
            modal.find('.modal-footer .info').text(info)

            //设置当前 productid
            modal.find('#productid').attr('value', productid)

            //设置上传表单productid
            modal.find('#productid').attr('value', productid)

            //清空元素
            modal.find('.carousel-indicators').empty()
            modal.find('.carousel-inner').empty()

            var productid = $('#productid').attr('value');
            var formData = new FormData();
            formData.append('productid', productid);
            formData.append('refresh', 1);

            $.ajax({
                type: 'post',
                cache: false,
                url: '/index.php/fileUpload/product',
                data: formData,
                processData: false,  // 不处理数据
                contentType: false,   // 不设置内容类型
                dataType: "json",
                success: function (data) {
                    if (data['status'] == 1) {
                        var modal = $('#exampleModal')
                        var images = data['images']// button.data('images')

                        var init = true;

                        //重新添加图片
                        for (var key in images) {
                            if (init) {
                                modal.find('.carousel-indicators').append("<li data-target=\"#carouselExampleIndicators\" data-slide-to=\"" + key + "\" class=\"active\"></li>")
                                modal.find('.carousel-inner').append(" <div class=\"carousel-item active\"> <center><img class=\"ProductImages\" src=\"" + images[key]['file_path'] + "\"/></center> </div>")
                                init = false;
                            } else {
                                modal.find('.carousel-indicators').append("<li data-target=\"#carouselExampleIndicators\" data-slide-to=\"" + key + "\"></li>")
                                modal.find('.carousel-inner').append(" <div class=\"carousel-item\"> <center><img class=\"ProductImages\" src=\"" + images[key]['file_path'] + "\"/></center> </div>")
                            }
                        }
                    } else {
                        alert("更新出错")
                    }
                },
                error: function (data) {
                    alert('更新出错');
                }
            })
        })

        $('#submit').on('click', function (event) {
            var formData = new FormData();
            formData.append('image', $('#file')[0].files[0]);
            formData.append('productid', $('#productid').attr('value'));
            formData.append('refresh', 0);
            $.ajax({
                type: 'post',
                cache: false,
                url: '/index.php/fileUpload/product',
                data: formData,
                processData: false,  // 不处理数据
                contentType: false,   // 不设置内容类型
                dataType: "json",
                success: function (data) {
                    if (data['status'] == 1) {
                        var modal = $('#exampleModal')
                        var images = data['images']// button.data('images')

                        //清空元素
                        modal.find('.carousel-indicators').empty()
                        modal.find('.carousel-inner').empty()

                        //重新添加图片
                        for (var key in images) {
                            //确保刚上传的文件被激活
                            if (key == (images.length - 1)) {
                                modal.find('.carousel-indicators').append("<li data-target=\"#carouselExampleIndicators\" data-slide-to=\"" + key + "\" class=\"active\"></li>")
                                modal.find('.carousel-inner').append(" <div class=\"carousel-item active\"> <center><img class=\"ProductImages\" src=\"" + images[key]['file_path'] + "\"/></center> </div>")
                            } else {
                                modal.find('.carousel-indicators').append("<li data-target=\"#carouselExampleIndicators\" data-slide-to=\"" + key + "\"></li>")
                                modal.find('.carousel-inner').append(" <div class=\"carousel-item\"> <center><img class=\"ProductImages\" src=\"" + images[key]['file_path'] + "\"/></center> </div>")
                            }
                        }

                        // alert('上传完成!')
                    } else {
                        alert('上传错误')
                    }
                },
                error: function (data) {
                    alert('上传错误');
                }
            })
        })
    })
//...
    <div class="ProductPreview">
        {notempty name='$product.qrcode.file_path')}
        <img src="{$product.qrcode.file_path}" data-toggle="modal" data-target="#exampleModal" data-imgpath="{$product.qrcode.file_path}"
            data-imgtitle="{$product.name}" data-productinfo="{$product.type.name} / {$product.model}" data-images="{$product.images}"
            data-productid="{$product.id}">
        </a>
        {else/}
        <img data-toggle="modal" data-target="#exampleModal" data-imgpath="{$product.qrcode.file_path}" data-imgtitle="{$product.name}"
            data-productinfo="{$product.type.name} / {$product.model}" data-images="{$product.images}" data-productid="{$product.id}">
        </a>
        {/notempty}
    </div>
//...
<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLongTitle">Modal title</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <!-- 单图 -->
                <!--
                    <center><img src="" style="width:auto;height:auto;max-height:300px;max-width:100%;" /></center>
                -->

                <!-- 多图 -->

                <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
                    <ol class="carousel-indicators">
                        <!--
                        <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
                        <li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
                        <li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
                        -->
                    </ol>
                    <div class="carousel-inner">
                        <!-- 原案例 -->
                        <!--
                          <div class="carousel-item active">
                            <img class="d-block w-100" src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22800%22%20height%3D%22400%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20800%20400%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_164b27b1eb7%20text%20%7B%20fill%3A%23555%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A40pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_164b27b1eb7%22%3E%3Crect%20width%3D%22800%22%20height%3D%22400%22%20fill%3D%22%23777%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22285.921875%22%20y%3D%22217.7%22%3EFirst%20slide%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E" alt="First slide">
                          </div>
                          <div class="carousel-item">
                            <img class="d-block w-100" src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22800%22%20height%3D%22400%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20800%20400%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_164b27b1eb7%20text%20%7B%20fill%3A%23555%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A40pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_164b27b1eb7%22%3E%3Crect%20width%3D%22800%22%20height%3D%22400%22%20fill%3D%22%23777%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22285.921875%22%20y%3D%22217.7%22%3EFirst%20slide%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E" alt="Second slide">
                          </div>
                          <div class="carousel-item">
                            <img class="d-block w-100" src="data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22800%22%20height%3D%22400%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20800%20400%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_164b27b1eb7%20text%20%7B%20fill%3A%23555%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A40pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_164b27b1eb7%22%3E%3Crect%20width%3D%22800%22%20height%3D%22400%22%20fill%3D%22%23777%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22285.921875%22%20y%3D%22217.7%22%3EFirst%20slide%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E" alt="Third slide">
                          </div>
                          -->
                    </div>
                    <a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
                        <span class="PrevIcon" aria-hidden="true"></span>
                        <span class="sr-only">Previous</span>
                    </a>
                    <a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
                        <span class="NextIcon" aria-hidden="true"></span>
                        <span class="sr-only">Next</span>
                    </a>
                </div>
                <center>

                    <form id="uploadForm" enctype="multipart/form-data">
                        <div class="input-group">
                            <input type="file" name="image" class="form-control" id="file" />
                            <div class="input-group-prepend">
                                <div class="input-group-text" id="btnGroupAddon">
                                    <input type="button" value="上传" id="submit" />
                                    <input type="hidden" name="productid" id="productid" value="" />
                                </div>
                            </div>

                        </div>

                        <br>

                    </form>

                </center>
            </div>

            <div class="modal-footer">

                <h6 class="info">info</h6>
            </div>
        </div>
    </div>
</div>

3、后台

<?php
namespace app\index\controller;

use think\Controller;
use think\Request;
use think\File;

use app\index\model\ProductModel;
use app\index\model\ExtraProductModel;

class FileUploadController extends Controller
{
    public function index($dir){        
        $id=request()->param('productid');
        $refresh=request()->param('refresh');

        $result;
      
        if($refresh==1){
            $product=ProductModel::where('id', $id)->find();
            $images=$product->images;
            
            $result['status']=1;
            $result['images']=$images;       
        }else{
            $file =request()->file('image');
        // 移动到框架应用根目录/public/uploads/ 目录下
             if($file){
            $info = $file->move(UPLOAD_PATH.$dir);
            if($info){               
                $extraProduct =new ExtraProductModel();
                $extraProduct->name=$info->getFilename();
                $extraProduct->file_path='/upload/'.$dir.'/'.$info->getSaveName();
                $extraProduct->product_id=$id;
                $extraProduct->save();
               
                $product=ProductModel::where('id', $id)->find();
                $images=$product->images;
                
                $result['status']=1;
                $result['images']=$images;                
            }else{
                $result['status']=0;
            }
        }else{
            $result['status']=0;
        }
    }
        return $result;
    }
}

 

ThinkPHP 笔记

1、查看版本号

\thinkphp\library\think\App.php

2、模板输出

目录结构

index.php 内容

<?php
namespace app\index\controller;

use think\Controller;

class Index extends Controller
{
    public function index(){              
       return $this->fetch();          
    }
}

2.1、模板 比较标签

{lt name="product.total_count" value="$product.min_count"}    
    <div class="ProductCountLow">
        库存不足:{$product.total_count}/{$product.min_count}
    </div>
{/lt}

{egt name="product.total_count" value="$product.min_count"}    
    <div class="ProductCount">
        库存:{$product.total_count}
    </div>
{/egt}

2.2、输出关联对象

public function unit(){
   return $this->belongsTo("CateProductUnitModel")->field("id","name");
}
{$product.unit.name}

 

3、路由

以下路由定义匹配,当访问 http://domain.com/index.php/product时,转到 http://domain.com/index.php/index/Product/index。写链接时别忘了index.php

Route::rule('product','index/Product/index');

4、常量问题

参考:https://blog.csdn.net/yiyuwu7069/article/details/78466400

5、文件上传