index.php 2.13 KB
<?php

use apps\admin\client\helpers\CssFiles;
use apps\admin\client\helpers\JsFiles;

CssFiles::register($this, 'modules/catalog/uploader/css/uploader.css');
JsFiles::register($this, 'base/1.0.0/ui/webuploader/webuploader.js');
JsFiles::register($this, 'modules/catalog/uploader/js/uploader.js');
?>

<form id="form">
    <ul class="upload-ul clearfix">
        <li class="upload-pick">
            <div class="webuploader-container clearfix" id="catalog-pics-upload"></div>
        </li>
    </ul>
    <button class="btn btn-primary">提交</button>
</form>


<script>
    $(function(){

        //上传图片
        var $uploader = $('#catalog-pics-upload').uploader({
            headers : {
                'Authorization' : $frameApp.restfule.getHeaderAuthorization()
            },
            fileNumLimit: 6,
            // 自动上传。
            auto: true,
            // 文件接收服务端。
            server: $frameApp.restfule.url('catalog/item-image/upload'),
            success:function( data ) { },
            error:function( err ) { },
            buttonText : '',
            accept: {
                title: "Images",
                extensions: 'gif,jpg,jpeg,bmp,png'
            },
            thumb:{
                width:120,
                height:90,
                quality:100,
                allowMagnify:true,
                crop:true,
                type:"image/jpeg"
            }
        });


    });

    var $form = $("#form");
    $('.btn').on('click', function(){
        $form.prop("target","_self");
    });



    // 表单提交验证
    seajs.use([
            "base/1.0.0/unit/validate/validate"
        ],
        function () {
        $form.validate({
            rules: {},

            submitHandler: function (form) {
                var l = $frameApp.loading({content: '提交中'});
                $frameApp.restfule.submit(form, 'aaaa', {
                    beforeSend : function(){
                        l.start();
                    },
                    success : function(r){
                        l.stop();

                    }
                });
            }
        });
    })
</script>