jifuning
/
xinxi_zhongxin_app


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570
							<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>个人中心</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../../css/style.css" />
    <link rel="stylesheet" type="text/css" href="../../css/aui.css" />
    <link rel="stylesheet" href="../../css/projeck.css">
    <style>
        .personal_header_color {
            width: 100%;
            height: 57.5px;
            background: #009FE8;
        }

        .personal_details_message {
            display: flex;
            align-items: center;
            justify-content: space-between;
            margin: -34px 14px 0 14px;
            background: rgba(255, 255, 255, 1);
            box-shadow: 0px 0px 3px 3px rgba(0, 0, 0, 0.05);
            border-radius: 2px;
            padding: 6px 6px 9px 8px;
        }

        .left_avatar_personal_info {
            display: flex;
            align-items: center;
        }

        .avatar_container img {
            width: 55px;
            height: 55px;
            border-radius: 100%;
            box-shadow: 0px 0px 4px 4px rgba(0, 0, 0, 0.1);
        }

        .details_info {
            margin-left: 12px;
        }

        .details_info .info_header {
            display: flex;
            align-items: center;
        }

        .info_header_name {
            font-size: 17px;
            font-weight: 700;
        }

        .info_section_footer {
            font-size: 13px;
        }

        .info_header .name {
            color: #232627;
            font-size: 18px;
            font-weight: 500;
        }

        .info_header .qrcode_img img {
            width: 18px;
            height: 18px;
            margin-left: 5px;
        }

        .right_handle_arrow img {
            width: 14px;
            height: 14px
        }

        .icon_items {
            margin: 0 16px 23px 16px;
        }

        .icon_items ul {
            display: flex;
            flex-wrap: wrap;
        }

        .icon_items ul li {
            width: 33%;
            text-align: center;
        }

        .icon_items ul li {
            display: flex;
            flex-flow: column;
            justify-content: center;
            align-items: center;
            padding-top: 23px;
            color: #232627;
            font-size: 14px;
        }

        .icon_items ul li div:last-child {
            margin-top: 6px;
        }
        /*.icon_items ul li:last-child {
            padding-top: 6px;
        }*/

        .icon_items ul li img {
            width: 43px;
            height: 43px;
        }

        .line {
            height: 4px;
            background: rgba(0, 159, 232, 1);
            margin: 0 14px;
        }

        .handle_list_item {
            margin: 0 15px 0 23px;
        }

        .handle_list_item ul li {
            height: 45px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            border-bottom: solid 1px #F5F5F5
        }

        .handle_list_item ul li:last-child {
            border-bottom: none
        }

        .handle_list_item ul li div:first-child {
            display: flex;
            align-items: center;
        }

        .handle_list_item ul li div:first-child span {
            display: block;
            margin-left: 6px;
        }

        .handle_list_item ul li div:first-child img {
            width: 18px;
            height: 18px;
        }

        .filter_gray_img {
            -webkit-filter: grayscale(100%);
            -moz-filter: grayscale(100%);
            -ms-filter: grayscale(100%);
            -o-filter: grayscale(100%);
            filter: grayscale(100%);
            filter: gray;
        }
    </style>
</head>

<body style="background-color:#fff;">
    <div class="api_layout">
        <div class="personal_header_color"></div>
        <div class="personal_details_message" onclick="handleOpenPersonalQrCode()">
            <div class="left_avatar_personal_info">
                <!-- http://jiewei-icon.oss-cn-beijing.aliyuncs.com/icon/default-avatar.png -->
                <div class="avatar_container" onclick="openPersonal()"><img id="avatar_img" src="" alt=""></div>
                <div class="details_info">
                    <div class="info_header">
                        <div class="info_header_name"></div>
                        <div class="qrcode_img" onclick="handleOpenPersonQrCode()"><img src="../../image/qrCodeImg.png" alt=""></div>
                    </div>
                    <div class="info_section_footer"></div>
                </div>
            </div>
            <div class="right_handle_arrow"><img src="../../image/more.png" alt=""></div>
        </div>
        <div class="icon_items">
            <ul>
                <li class="message_alert" onclick="openNewsList()">
                    <div><img src="../../icon/messagealert.png" alt=""></div>
                    <div>消息提醒</div>
                </li>
                <li>
                    <div><img style="filter: grayscale(100%);filter: gray;" src="../../icon/Collection.png" alt=""></div>
                    <div>收藏</div>
                </li>
                <li onclick="openExamine()">
                    <div><img src="../../icon/Workorderapproval.png" alt=""></div>
                    <div>工单审核</div>
                </li>
                <li>
                    <div><img class="filter_gray_img" src="../../icon/Learningintegra.png" alt=""></div>
                    <div>学习积分</div>
                </li>
                <li>
                    <div><img class="filter_gray_img" src="../../icon/Integralmall.png" alt=""></div>
                    <div>积分商城</div>
                </li>
                <li>
                    <div><img class="filter_gray_img" src="../../icon/LearningReport.png" alt=""></div>
                    <div>学习报表</div>
                </li>
                <li>
                    <div><img class="filter_gray_img" src="../../icon/Personalcloudisk.png" alt=""></div>
                    <div>个人云盘</div>
                </li>
                <li onclick="handleUserExplain()">
                    <div><img src="../../icon/Usermanual.png" alt=""></div>
                    <div>使用手册</div>
                </li>
                <li onclick="handleServicePhone()">
                    <div><img src="../../icon/Servicephone.png" alt=""></div>
                    <div>服务电话</div>
                </li>
                <li onclick="handleFeedback()">
                    <div><img src="../../icon/Suggestionfeedback.png" alt=""></div>
                    <div>建议反馈</div>
                </li>
                <li onclick="handleDownQrcode()">
                    <div><img src="../../icon/downQrcode.png" alt=""></div>
                    <div>下载二维码</div>
                </li>
            </ul>
        </div>
        <div class="line"></div>
        <div class="handle_list_item">
            <ul>
                <li onclick="openForget()">
                    <div>
                        <img src="../../icon/ChangePassword.png" alt="">
                        <span>修改密码</span>
                    </div>
                    <div class="right_handle_arrow">
                        <img src="../../image/more.png" alt="">
                    </div>
                </li>
                <li>
                    <div>
                        <img src="../../icon/Signout.png" alt="">
                        <span>退出登录</span>
                    </div>
                    <div class="right_handle_arrow">
                        <img src="../../image/more.png" alt="">
                    </div>
                </li>
                <li onclick="handleUpdateTitle()">
                    <div>
                        <img src="../../icon/Updatelog.png" alt="">
                        <span>更新日志</span>
                    </div>
                    <div class="right_handle_arrow">
                        <img src="../../image/more.png" alt="">
                    </div>
                </li>
            </ul>
        </div>
    </div>
</body>

</html>
<script type="text/javascript" src="../../script/api.js"></script>
<!-- <script src="../../script/aui-toast.js" charset="utf-8"></script> -->
<!-- <script src="../../script/fastclick.min.js" charset="utf-8"></script> -->
<script src="../../script/config.js" charset="utf-8"></script>
<script type="text/javascript">
    var token, uuid, headers, personalName = '',
        staff_num = '';
    var toast = new auiToast();
    apiready = function() {
        var info = $api.getStorage('data'),
            user = JSON.parse(info).data.user;
        token = JSON.parse(info).data.access_token;
        uuid = JSON.parse(info).data.user.staff_num;
        headers = {
            "Authorization": "Bearer " + token
        };
        newsNum()
            // 个人信息
        $http.fnReuestData(UrlRouter.userInfoApi, headers, 'post', '', personalCenterInfo);
        api.addEventListener({
            name: 'userInfo'
        }, function(ret, err) {
            $http.fnReuestData(UrlRouter.userInfoApi, headers, 'post', '', personalCenterInfo);
        });
        api.addEventListener({
            name: 'myNews'
        }, function(ret, err) {
            newsNum()
        });
    };
    // 个人信息展示
    function personalCenterInfo(ret, err) {
        if (ret) {
            toast.hide();
            if (ret.code === 0) {
                var ret = ret.data;
                var image = 'http://jiewei-icon.oss-cn-beijing.aliyuncs.com/icon/default-avatar.png';
                // var bindPhone = $api.dom('.api_phoneBind_wrap');
                var head_img = $api.byId('avatar_img'),
                    name = $api.dom('.info_header_name'),
                    api_dep = $api.dom('.info_section_footer');
                personalName = ret.name;
                staff_num = ret.staff_num;
                ret.name == null ? $api.html(name, '无') : $api.html(name, ret.name);
                ret.section_fullname == null ? $api.html(api_dep, '无') : $api.html(api_dep, ret.section_fullname);
                ret.avatar == null ? head_img.src = image : head_img.src = ret.avatar;
            } else if (ret.code === 401) {
                api.alert({
                    title: '提示',
                    msg: '登录过期，重新登录',
                }, function(ret, err) {
                    var index = ret.buttonIndex;
                    if (index == 1) {
                        api.setStatusBarStyle({
                            color: 'rgba(0,0,0,0)',
                            style: 'light'
                        });
                        api.closeWin({
                            name: 'index'
                        });
                    }
                });
            }
        } else {
            toast.hide();
            api.toast({
                msg: '网络错误',
                duration: 2000,
                location: 'bottom'
            });
        }
    }
    // 打开个人中心二维码
    function handleOpenPersonQrCode() {

    }

    // 打开二维码页面详情
    function handleOpenPersonalQrCode() {
        let title = `${staff_num}-${personalName}`;
        $http.requestData(`${UrlRouter.getPagebyNOAndName}?title=${title}`, 'get', '')
            .then(ret => {
                if (ret.data.id) {
                    $event.openWin('browseQrcode_win', '../browseQrcode/browseQrcode_win', {
                        pageId: ret.data.id,
                        title: '人员详情'
                    }, '');
                }
            })
            .catch(err => {
                // console.log(JSON.stringify(err));
            })
    }

    function handleUpdateTitle() {
      $event.openWin('browseQrcode_win','../browseQrcode/browseQrcode_win',{pageId:'cd7591c847134956b5b2307f4f52e6a8',title:'更新日志'},'');
    }
    // 修改密码
    function openForget() {
        $event.openTabLayout('forget', '../forgetBind/forgetPass', '修改密码', '');
    }
    // 绑定手机号
    function openBind() {
        $event.openTabLayout('bindPhone', '../forgetBind/bindPhone', '绑定手机号', '');
    }
    // 下载二维码
    function handleDownQrcode() {
        $event.openTabLayout('qrcodeShare', '../browseQrcode/qrcodeShare', '二维码下载', '');
    }
    // 我的审核
    function openExamine() {
        $event.openWin('examineMy_win','../wordorder/examineMy_win','','');
        //$event.openWin('wordorder_win','../wordorder/wordorder_win','','')
        //$event.openTabLayout('wordorderDetails', '../wordorder/wordorderDetails', '工单审核', '');
    }
    // 服务电话
    function handleServicePhone() {
        api.call({
            type: 'tel_prompt',
            number: '18152480670'
        });
    }
    // 使用说明
    function handleUserExplain() {
      $event.openWin('browseQrcode_win','../browseQrcode/browseQrcode_win',{pageId:'156c601a10be43bc8f32e83f0664821b',title:'使用说明'},'');
    }

    function handleFeedback() {
      $event.openWin('browseQrcode_win','../browseQrcode/browseQrcode_win',{pageId:'eeeaada3989343f39decda742082909b',title:'意见反馈'},'');
    }
    // // 我的审核openExamineDetails
    // function openExamineDetails() {
    //   $event.openTabLayout('wordorderDetails','../wordorder/wordorderDetails','我的审核','');
    // }
    // //我的工单
    // function openMyWordOder() {
    //   $event.openWin('myWordeOrder_win','../wordorder/myWordeOrder_win','','');
    // }
    // //我的流程
    // function openMyWordOderList() {
    //   $event.openTabLayout('wordorderProcess','../wordorder/wordOrderProcess','工单流程','');
    // }
    // // 打开详情
    function openPersonal() {
        $event.openWin('personal', '../personalData/personal', '', '');
    }
    // //消息列表
    function openNewsList() {
        $event.openWin('newsList', '../news/news_win', '', '');
    }
    // 清除缓存
    // function clearCache() {
    //     $event.openWin('clearCache','clearCache','','');
    // }
    // 上传头像
    var headImg;

    function actionSheetFun() {
        api.actionSheet({
            title: '选择',
            cancelTitle: '取消',
            buttons: ['相机', '相册']
        }, function(ret, err) {
            if (ret.buttonIndex != 3) {
                var type = 'camera';
                if (ret.buttonIndex == 1) {
                    type = 'camera';
                } else {
                    type = 'album';
                }
                api.getPicture({
                    sourceType: type
                }, function(ret, err) {
                    if (ret) {
                        photoTailoring(ret.data);
                        headImg = ret.data;
                    }
                });
            }
        });
    }

    function uploadUrl(imgUrl) {
        var upload_avater = $api.byId('head_img');
        upload_avater.style.backgroundImage = 'url(' + imgUrl + ')';
    }

    function uploadHead(imgUrl) {
        toast.loading({
            title: "加载中",
            duration: 2000
        });
        api.ajax({
            url: urlphp + 'api/user/avatar/upload',
            method: 'post',
            headers: {
                "Authorization": "Bearer " + token,
            },
            data: {
                files: {
                    avatar: imgUrl
                }
            }
        }, function(ret, err) {
            if (ret) {
                toast.hide();
                if (ret.code === 0) {
                    api.toast({
                        msg: '上传成功',
                        duration: 2000,
                        location: 'top'
                    });
                } else {
                    api.toast({
                        msg: '上传失败',
                        duration: 2000,
                        location: 'top'
                    });
                }
            } else {
                toast.hide();
                api.toast({
                    msg: '网络错误',
                    duration: 2000,
                    location: 'top'
                });
            }
        });

    }
    // 退出
    function signOut() {
        api.confirm({
            title: '提示',
            msg: '退出登录？',
            buttons: ['确定', '取消']
        }, function(ret, err) {
            var index = ret.buttonIndex;
            if (index == 1) {
                api.setStatusBarStyle({
                    color: 'rgba(0,0,0,0)',
                    style: 'light'
                });
                $api.clearStorage();
                api.closeWin({
                    name: 'index'
                });
            }
        });
    }
    // 照片裁剪
    function photoTailoring(imgPath) {
        var systemType = api.systemType;
        if (systemType == 'ios') {
            api.openFrame({
                name: 'tailoring',
                url: 'tailoring.html',
                rect: {
                    x: 0,
                    y: 0,
                    w: api.winWidth,
                    h: api.winHeight
                },
                pageParam: {
                    tailoring: imgPath
                },
                bounces: false,
                bgColor: 'rgba(0,0,0,0)',
                vScrollBarEnabled: false,
                hScrollBarEnabled: false,
            });
        } else if (systemType == 'android') {
            var imageCrop = api.require('imageCrop');
            imageCrop.clipPhoto({
                imgPath: imgPath,
                height: api.winHeight,
                width: api.winWidth
            }, function(ret, err) {
                if (ret) {
                    uploadUrl(ret.imgPath);
                    uploadHead(ret.imgPath);
                }
            });
        }
    }
    //工单
    function openWordOrder() {
        // $event.openWin('wordorder_win','../wordorder/wordorder_win','','')
        // $event.openTabLayout('wordOrder','wordorder_frame','工单列表','')
    }
    // 消息总数
    function newsNum() {
        $http.fnReuestDataNologing(UrlRouter.getNewsNum, headers, 'get', '', function(ret, err) {
            if (ret.code === 0) {
                if (ret.data.unread_num === 0) {
                    $api.css($api.dom('.news_num'), 'display:none');
                    $api.html($api.dom('.news_num'), '');
                } else if (ret.data.unread_num > 99 || ret.data.unread_num == 99) {
                    $api.css($api.dom('.news_num'), 'display:block');
                    $api.html($api.dom('.news_num'), 99);
                } else {
                    $api.css($api.dom('.news_num'), 'display:block');
                    $api.html($api.dom('.news_num'), ret.data.unread_num);
                }
            }
        })
    }
</script>