@{
    //图片路径
    var ImgPath = PageData["ImgPath"] == null ? "" : PageData["ImgPath"] as string;

    //图片的ID名称
    var ImgID = PageData["ImgID"];

    //是否 裁切
    var IsThumbnails = PageData["IsThumbnails"] == null ? true : false;

    //截取后的缩略图的宽
    var ThumbnailsWidth = PageData["ThumbnailsWidth"];

    //截取后的缩略图的高
    var ThumbnailsHeight = PageData["ThumbnailsHeight"];

    //用于替换图片路径
    System.Text.RegularExpressions.Regex reg = new System.Text.RegularExpressions.Regex("http://(\\w)+.cnxox.com");

    //是否多图
    var ImgIsMultiple = PageData["ImgIsMultiple"];
}

<script type="text/plain" id="j_ueditorupload_@(ImgID)" style="height:5px;display:none;">
</script>

<script>

    //http://imgs.bzw315.com/upload/2017/4/30/636291716882548167.png
    //实例化编辑器
    var o_ueditorupload_@(ImgID) = UE.getEditor('j_ueditorupload_@(ImgID)',
    {
        autoHeightEnabled: false
    });

    o_ueditorupload_@(ImgID).ready(function () {
        o_ueditorupload_@(ImgID).hide();//隐藏编辑器

        //监听图片上传
        o_ueditorupload_@(ImgID).addListener('beforeInsertImage', function (t, arg) {
            var url = GetImgs(arg[0].src);
            $("#@(ImgID)").val(url);
            $("#@(ImgID)_Show").attr("src", url);
            ImageAttributes_@(ImgID)();
            //alert('这是图片地址：' + arg[0].src);
        });

        /* 文件上传监听
         * 需要在ueditor.all.min.js文件中找到
         * d.execCommand("insertHtml",l)
         * 之后插入d.fireEvent('afterUpfile',b)
         */
        //o_ueditorupload_@(ImgID).addListener('afterUpfile', function (t, arg) {
        //    alert('这是文件地址：' + arg[0].url);
        //});
    });

    //弹出图片上传的对话框
    function upImage_@(ImgID)() {
        var myImage = o_ueditorupload_@(ImgID).getDialog("insertimage");
        myImage.open();
    }

    //弹出文件上传的对话框
    function upFiles_@(ImgID)() {
        var myFiles = o_ueditorupload_@(ImgID).getDialog("attachment");
        myFiles.open();
    }

    //************************************************************************************

    //显示图片信息
    function ImageAttributes_@(ImgID)() {
        var img = new Image();
        img.src = $("#@(ImgID)_Show").attr("src");
        img.onload = function () {
            var size = "";
            if (img.fileSize != null && img.fileSize != null) {
                size = img.fileSize + " KB";
            }
            $("#imghtml@(ImgID)").html('<span style=\'color:#f00\'>' + img.width + '</span>×<span style=\'color:#f00\'>' + img.height + "</span>" + size); // + img.fileSize + " KB"
        };
    }

    //预览
    function ImagePreview@(ImgID)(id) {
        var path = $('#' + id).val();
        if (path != "") {
            window.open(path, "", "fullscreen=1")
        }
        else {
            alert("请先上传文件！");
        }
    }

    //裁剪默认缩略图
    function EditImg_@(ImgID)() {
        var imgName = $("#@(ImgID)").val();
        var newImgName = new String(imgName);
        var newImg = encodeURIComponent(newImgName);
        var url = '';
        if ('356' > 0) {
            url = "/manage/default/ImgEdit/?id=@(ImgID)&imgname=" + newImg + "&width=" + $("#Width_@(ImgID)").numberspinner('getValue') + "&height=" + $("#Height_@(ImgID)").numberspinner('getValue');
        } else {
            var img = new Image();
            img.src = imgName;
            url = "/manage/default/ImgEdit2/?imgname=" + newImg + "&width=" + img.width + "&height=" + img.height;
        }
        dialogWin = openWindow("#form-window-image", "裁剪图片", url, "icon-add").dialog('open');
    }

    //默认图裁剪完成进行设置图片路径
    function SetLogoNewValue_@(ImgID)(url) {
        if (url.indexOf("http://") < 0 && url.indexOf("https://") < 0) {
            // url = "http://www.xuexiaoruanjian.com" + url;
            url = url;
        }
        $('#@(ImgID)').val(url);
        $("#@(ImgID)_Show").attr("src", url);
        ImageAttributes_@(ImgID)();
    }

    //关闭窗体
    function close() {
        if (grid != null) { grid.datagrid("clearSelections"); }
        if (arraylistWin != null) { arraylistWin.dialog('close'); }
        if (dialogWin != null) { dialogWin.dialog('close'); }
    }

    $(function () {
        ImageAttributes_@(ImgID)();
    });

</script>
<div class="imgs-item">
    <img src="@(Url.Domain_Static(ImgPath))" id="@(ImgID)_Show" @*class="screenshot"*@ style="max-height:200px; max-width:550px;">
    <div id="imghtml@(ImgID)"></div>
</div>
<div>
    <input class="easyui-validatebox textbox w550" id="@(ImgID)" name="@(ImgID)" type="text" value="@(ImgPath)" style="@(PageData["Style"])">
    <a href="javascript:;" class="easyui-linkbutton" onclick="upImage_@(ImgID)();" data-options="iconCls:'icon-pictures'">图片上传</a>
    <a href="javascript:;" class="easyui-linkbutton" onclick="ImagePreview@(ImgID)('@(ImgID)');">预览</a>
    @if (IsThumbnails)
    {
        <text>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <input class="easyui-numberspinner textbox w60" id="Width_@(ImgID)" type="text" value="@(ThumbnailsWidth)"> ×
            <input class="easyui-numberspinner textbox w60" id="Height_@(ImgID)" type="text" value="@(ThumbnailsHeight)">
            &nbsp;&nbsp;
            <a href="javascript:;" class="easyui-linkbutton" onclick="EditImg_@(ImgID)();" data-options="iconCls:'icon-filecut'">裁剪</a>

            <div id="form-window-image" title="编辑/添加" class="easyui-window" data-options="modal:true,closed:true" style="width: 88%; height: 88%; padding: 6px;"></div>
        </text>
    }
</div>
<style type="text/css">
    .imgs-item {
        list-style-type: none;
        display: inline-block;
        padding: 5px;
        border: 1px dashed #ccc;
        margin-top: 4px;
        background: #fafafa;
        color: #444;
        text-align: center;
        margin-bottom:10px;
        min-width:80px;
        min-height:80px;
    }
</style>