@using ZXDT.CallCenter.MVCWeb.Models;
@using ZXDT.CallCenter.Model;
<link href="/Content/layui/css/layui.css" rel="stylesheet" />


<link href="/Content/css/userinfo.css" rel="stylesheet" />
<script src="/Content/js/jquery-1.8.3.min.js"></script>
<script src="/Content/layui/layui.js"></script>

<link href="/Content/css/callscreen/callscreen.css" rel="stylesheet" />
<script type="text/javascript">

    layui.use('form', function () {
        var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功

        //……

        //但是，如果你的HTML是动态生成的，自动渲染就会失效
        //因此你需要在相应的地方，执行下述方法来手动渲染，跟这类似的还有 element.init();
        form.render();
    });

    layui.use('upload', function () {
        var imgSrc = "";//图片路径
        var upload = layui.upload;
        //普通图片上传
        var uploadInst = upload.render({
            elem: '#headImg',
            url: '/SystemManage/UploadFile',
            accept: 'images',
            exts: 'jpg|png|gif|bmp|jpeg',
            before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {

                    imgSrc = result;
                });
            },
            done: function (res) {
                //如果上传失败
                if (res.code == "0") {
                    $('#headImg').attr('src', imgSrc); //图片链接（base64）

                    window.parent.$('.userAvatar').attr('src', imgSrc); //图片链接（base64）


                    layer.msg("上传成功！");
                }
                else {
                    layer.msg(res.msg);
                }
            },
            error: function () {
                ////演示失败状态，并实现重传
                //var demoText = $('#demoText');
                //demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-mini demo-reload">重试</a>');
                //demoText.find('.demo-reload').on('click', function () {
                //    uploadInst.upload();
                //});
            }
        });
    })
</script>

<div class="layui-form">
    <blockquote class="layui-elem-quote layui-text" style="font-size: larger;">
        个人信息<div style="float:right;">
           
        </div>
    </blockquote>
    <div class="leftSide">
        <img class="layui-upload-img" alt="头像" id="headImg" src="@Model.F_HomePhone" />
        <div class="classify">头像</div>

    </div>
    <div class="rightSide">
        <div class="personage" >
            @*<div style="padding-left:20px;"><i class="Hui-iconfont Hui-iconfont-root"></i> 基本信息 </div>*@
            <ul>

                <li class="layui-row">
                    <div class="layui-inline layui-col-sm6 layui-elip">
                        <em>工号</em><span> @Model.F_UserCode</span>
                    </div>

                    <div class="layui-inline layui-col-sm6 layui-elip">
                        <em>用户名</em><span> @Model.F_UserName</span>
                    </div>

                </li>
                <li class="layui-row">
                    <div class="layui-inline layui-col-sm6 layui-elip">
                        <em>性别</em><span> @Model.F_SexFlag</span>
                    </div>

                   
                    <div class="layui-inline layui-col-sm6 layui-elip">
                        <em>部门名称</em><span> @Model.F_DeptName</span>
                    </div>

                </li>
                <li class="layui-row">
                    <div class="layui-inline layui-col-sm6 layui-elip">
                        <em>电话</em><span> @Model.F_Telephone</span>
                    </div>
                    <div class="layui-inline layui-col-sm6 layui-elip">
                        <em>角色名称</em><span> @Model.F_RoleName</span>
                    </div>

                </li>

            </ul>
        </div>
     
    </div>
</div>