/**
     * 後臺上傳圖片
     * type 1 為小程式圖片
     */
    public function actionAdd(){
        if($_FILES  && $_FILES["image"]['name']){
            $request = Yii::$app->request;
            $root = '/mnt/tmpfile/static/';
            $source_name = $_FILES["image"]['name'];
            $image_ext  = explode('.',$source_name);
            if($request->post('type',0) == 1){
                //儲存的目錄
                $path = $root.'app/'.date('Ymd');
            }else{
                $dir_name = $request->post('dir_name',date('Ymd'));
                $path = $root.$dir_name;
            }
            if(!is_dir($path)){
                mkdir($path,0777,true);
            }
            $file_name = date('YmdHis').'.'.$image_ext[1];
            $flag = move_uploaded_file($_FILES["image"]['tmp_name'],$path.'/'.$file_name);
            if($flag){
                $img_dir =str_replace('/mnt/tmpfile',$this->host,$path);
                Yii::$app->db->createCommand()->insert($this->table_name,[
                    'name'=>$request->post('name',''),
                    'type'=>$request->post('type',1),
                    'url_big'=>$img_dir.'/'.$file_name,
                    'add_time'=>time(),
                    'source_name'=>$source_name
                ])->execute();
                $this->redirect(Url::to(['index']));
            }else{
                throw new Exception('上傳失敗~');
            }
        }
        return $this->render('add');
    }
 

    /**
     * 刪除
     * @param $id
     * @return bool or string
     */
    public function actionDel($id){
        $id = Yii::$app->request->get('id',0);
        if(!$id){
            echo  json_encode(['status'=>0,'message'=>'無該資料']);exit;
        }
        $mess = ['status'=>0,'message'=>'刪除失敗~'];
        $curInfo = Yii::$app->db->createCommand("select * from ".$this->table_name.' where id ='.$id)->queryOne();
        $image = str_replace($this->host,'/mnt/tmpfile',$curInfo['url_big']);
        $res = unlink($image);//注意，刪除的連結格式/mnt/tmpfile/20160503344/tete.png
        if($res){
             $flag = Yii::$app->db->createCommand()->delete($this->table_name,['id'=>$id])->execute();
            if($flag){
                $mess = ['status'=>1,'message'=>'刪除成功~'];
            }
        }
        echo  json_encode($mess);exit;
    }
 

<!-- 引入js-->
<script src="/js/bootstrap-fileinput.js"></script>
<!-- 引入css -->
<style>
    .btn-file {
        position: relative;
        overflow: hidden;
        vertical-align: middle;
    }
    .btn-file > input {
        position: absolute;
        top: 0;
        right: 0;
        width: 100%;
        height: 100%;
        margin: 0;
        font-size: 23px;
        cursor: pointer;
        filter: alpha(opacity=0);
        opacity: 0;

        direction: ltr;
    }
    .fileinput {
        display: inline-block;
        margin-bottom: 9px;
    }
    .fileinput .form-control {
        display: inline-block;
        padding-top: 7px;
        padding-bottom: 5px;
        margin-bottom: 0;
        vertical-align: middle;
        cursor: text;
    }
    .fileinput .thumbnail {
        display: inline-block;
        margin-bottom: 5px;
        overflow: hidden;
        text-align: center;
        vertical-align: middle;
    }
    .fileinput .thumbnail > img {
        max-height: 100%;
    }
    .fileinput .btn {
        vertical-align: middle;
    }
    .fileinput-exists .fileinput-new,
    .fileinput-new .fileinput-exists {
        display: none;
    }
    .fileinput-inline .fileinput-controls {
        display: inline;
    }
    .fileinput-filename {
        display: inline-block;
        overflow: hidden;
        vertical-align: middle;
    }
    .form-control .fileinput-filename {
        vertical-align: bottom;
    }
    .fileinput.input-group {
        display: table;
    }
    .fileinput.input-group > * {
        position: relative;
        z-index: 2;
    }
    .fileinput.input-group > .btn-file {
        z-index: 1;
    }
    .fileinput-new.input-group .btn-file,
    .fileinput-new .input-group .btn-file {
        border-radius: 0 4px 4px 0;
    }
    .fileinput-new.input-group .btn-file.btn-xs,
    .fileinput-new .input-group .btn-file.btn-xs,
    .fileinput-new.input-group .btn-file.btn-sm,
    .fileinput-new .input-group .btn-file.btn-sm {
        border-radius: 0 3px 3px 0;
    }
    .fileinput-new.input-group .btn-file.btn-lg,
    .fileinput-new .input-group .btn-file.btn-lg {
        border-radius: 0 6px 6px 0;
    }
    .form-group.has-warning .fileinput .fileinput-preview {
        color: #8a6d3b;
    }
    .form-group.has-warning .fileinput .thumbnail {
        border-color: #faebcc;
    }
    .form-group.has-error .fileinput .fileinput-preview {
        color: #a94442;
    }
    .form-group.has-error .fileinput .thumbnail {
        border-color: #ebccd1;
    }
    .form-group.has-success .fileinput .fileinput-preview {
        color: #3c763d;
    }
    .form-group.has-success .fileinput .thumbnail {
        border-color: #d6e9c6;
    }
    .input-group-addon:not(:first-child) {
        border-left: 0;
    }
</style>
<form class="form-horizontal" role="form" method="post" action="<?=Url::to(['add'])?>"  enctype='multipart/form-data' >
    <ul class="breadcrumb">
        <li><a href="#">首頁</a></li>
        <li><a href="#">系統設定</a></li>
        <li class="active">上傳圖片</li>
        <a href="<?=Url::to(['index'])?>" class="btn btn-primary btn-sm pull-right">返回</a>
    </ul>

    <div class="form-group">
        <label for="name" class="col-sm-2 control-label">名稱</label>
        <div class="col-sm-5">
            <input type="text" class="form-control" name="name" placeholder="自定義名稱">
        </div>
    </div>
    <div class="form-group">
        <label for="name" class="col-sm-2 control-label">分類</label>
        <div class="col-sm-5">
            <select name="type"  class="form-control">
                <option value="0">請選擇..</option>
                <option value="1">小程式</option>
                <option value="2">其他</option>
            </select>
        </div>
    </div>
    <div class="form-group " style="display:none;"  id="dir_name" >
        <div class="col-sm-offset-2 col-sm-10">儲存的目錄:
            <input type="text" name="dir_name" value="">
        </div>
    </div>
    <div class="form-group" id="uploadForm" enctype="multipart/form-data">
        <div class="col-sm-offset-2 col-sm-10">
            <div class="h4">圖片預覽</div>
            <div class="fileinput fileinput-new" data-provides="fileinput" id="exampleInputUpload">
                <div class="fileinput-new thumbnail" style="width: 200px;height: auto;max-height:150px;">
                    <img id="picImg" style="width: 100%;height: auto;max-height: 140px;" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9InllcyI/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTQwIiBoZWlnaHQ9IjE0MCIgdmlld0JveD0iMCAwIDE0MCAxNDAiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjwhLS0KU291cmNlIFVSTDogaG9sZGVyLmpzLzE0MHgxNDAKQ3JlYXRlZCB3aXRoIEhvbGRlci5qcyAyLjYuMC4KTGVhcm4gbW9yZSBhdCBodHRwOi8vaG9sZGVyanMuY29tCihjKSAyMDEyLTIwMTUgSXZhbiBNYWxvcGluc2t5IC0gaHR0cDovL2ltc2t5LmNvCi0tPjxkZWZzPjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+PCFbQ0RBVEFbI2hvbGRlcl8xNWViYzM4ZTYwNSB0ZXh0IHsgZmlsbDojQUFBQUFBO2ZvbnQtd2VpZ2h0OmJvbGQ7Zm9udC1mYW1pbHk6QXJpYWwsIEhlbHZldGljYSwgT3BlbiBTYW5zLCBzYW5zLXNlcmlmLCBtb25vc3BhY2U7Zm9udC1zaXplOjEwcHQgfSBdXT48L3N0eWxlPjwvZGVmcz48ZyBpZD0iaG9sZGVyXzE1ZWJjMzhlNjA1Ij48cmVjdCB3aWR0aD0iMTQwIiBoZWlnaHQ9IjE0MCIgZmlsbD0iI0VFRUVFRSIvPjxnPjx0ZXh0IHg9IjQ1IiB5PSI3NC44Ij4xNDB4MTQwPC90ZXh0PjwvZz48L2c+PC9zdmc+" alt="">
                </div>
                <div class="fileinput-preview fileinput-exists thumbnail" style="max-width: 200px; max-height: 150px;"></div>
                <div>
                        <span class="btn btn-primary btn-file">
                            <span class="fileinput-new">選擇檔案</span>
                            <span class="fileinput-exists">換一張</span>
                            <input type="file" name="image" id="picID" accept="image/gif,image/jpeg,image/x-png">
                        </span>
                    <a href="javascript:;" class="btn btn-warning fileinput-exists" data-dismiss="fileinput">移除</a>
                </div>
            </div>
        </div>
    </div>

    <div class="form-group">
        <div class="col-sm-offset-2 col-sm-10">
            <button type="submit"  class="btn btn-success">提交</button>
        </div>
    </div>
</form>

<script>
    $(".btn-success").click(function () {
        var name =  $('input[name="name"]').val();
        if(name =='' || name == undefined){
            alert('名稱不能為空..')
            return false;
        }
        $('form[role="form"]').submit();
    })
    $('select[name="type"]').change(function () {
        var value = $('select[name="type"] option:selected').val();
        if(value==2){
            $('#dir_name').attr('style','display:block;');
        }else{
            $('#dir_name').attr('style','display:none;');
        }
    })
</script>