jifuning
/
xinxi_zhongxin_app


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227
							<!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">
    <meta name="format-detection" content="telephone=no">
    <title>审批列表</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <link rel="stylesheet" href="../../css/aui.css">
    <link rel="stylesheet" href="../../css/projeck.css">
    <style media="screen">
        * {
            box-sizing: border-box;
        }

        html,
        body {
            height: 100%;
            width: 100%;
        }

        .max-container {
            width: 100vw;
            height: 100vh;
            display: flex;
            justify-content: space-between;
        }

        .left-container {
            width: 30vw;
            height: 100%;
            background: rgba(236, 240, 241, 0.8);
        }

        .right-container {
            width: 70vw;
            height: 100%;
            display: flex;
            flex-wrap: wrap;
            /*加这个属性是为了解决 flex-wrap 子标签会有很大的空隙行问题*/
            align-content:flex-start;
            overflow-y: scroll;
        }

        .department-item {
            height: 50px;
        }

        .department-item:hover {
            border-left: solid 3px #3498DB;
            background: #fff;
        }

        .department-item-child {
            margin: 0 10px;
            border-bottom: solid 1px #BDC3C7;
            color: #7F8C8D;
            text-align: center;
            line-height: 50px
        }

        .department-item-child:hover {
            color: #3498DB;
            border-bottom: none;
        }

        .grid-item-child {
            width: 25%;
            height: 100px;
            padding-top: 5px;
        }

        .grid-items {
            text-align: center;
            font-size: 16px;
        }

        .grid-items img {
            width: 40px;
            height: 40px;
            border-radius: 50%;
            margin: 0 auto;
        }

        .grid-items p {
            height: 42px;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            padding: 0 5px;
            margin-top: 10px;
        }
    </style>
</head>

<body>
    <div class="max-container">
        <div class="left-container" id="listItem">

        </div>
        <div class="right-container" id="seeApply">

        </div>
        <div class="noText hide">
            <img src="../../image/noText.png" alt="">
        </div>
    </div>
</body>

</html>
<!-- 左侧部门名称-->
<script type="text/template" id="departItem">
    {{~it:value}}
    <div class="department-item">
        <div class="department-item-child" onclick="openItem('{{=value.id}}')">
            <span>{{=value.title}}</span>
        </div>
    </div>
    {{~}}
</script>
<!-- 右侧每个部门的工单项目 -->
<script type="text/template" id="templateApply">
    {{~it:value}} {{?value.id !=5 && value.id !=6}}
    <div class="grid-item-child" onclick="openChangeFill('{{=value.id}}','{{=value.title}}')">
        <div class="grid-items">
            <img src="{{=value.icon}}">
            <p>{{=value.title}}</p>
        </div>
    </div>
    {{?}} {{~}}
</script>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/doT.min.js"></script>
<script type="text/javascript" src="../../script/zepto.js"></script>
<script src="../../script/config.js" charset="utf-8"></script>
<script type="text/javascript">
    var toast = new auiToast(),
        token, tokens, firstId
    apiready = function() {
        var info = $api.getStorage('data'),
            token = JSON.parse(info).data.access_token;
        tokens = token
            // openOrderList(token),
        departmentList(token)
    };
    // 可申请工单列表
    function openOrderList(token) {
        var headers = {
            "Authorization": "Bearer " + token
        };
        $http.fnReuestData(UrlRouter.getAll_list, headers, 'get', '', function(ret, err) {
            toast.hide()
            if (ret && ret.code == 0) {
                if (ret.data.length > 0) {
                    $apis.html(seeApply, '#templateApply', ret.data);
                    $api.addCls($api.dom('.noText'), 'hide')
                } else {
                    $apis.html(seeApply, '#templateApply', ret.data);
                    $api.removeCls($api.dom('.noText'), 'hide');
                }
            } else {
                api.toast({
                    msg: '暂无数据',
                    duration: 2000,
                    location: 'bottom'
                });
            }
        })
    }
    // 获取部门列表
    function departmentList(token) {
        var headers = {
            "Authorization": "Bearer " + token
        }
        $http.fnReuestDataNologing(UrlRouter.wordOrderList, headers, 'get', '', function(ret, err) {
            if (ret && ret.code == 0) {
                if (ret.data.length > 0) {
                    firstId = ret.data[0].id;
                    openItem(firstId);
                    $apis.html(listItem, '#departItem', ret.data);
                    // $api.css($api.dom('.department-item'), 'background: #fff');
                } else {
                    api.toast({
                        msg: '加载超时，请检查网络',
                        duration: 2000,
                        location: 'bottom'
                    });
                }
            }
        })
    }
    //applyList

    function openItem(id) {
        var headers = {
            "Authorization": "Bearer " + tokens,
        }
        let idObj = {
            id: id
        }
        $http.fnReuestDataNologing(UrlRouter.applyList, headers, 'post', idObj, function(ret, err) {
            if (ret && ret.code == 0) {
                if (ret.data.length > 0) {
                    $apis.html(seeApply, '#templateApply', ret.data);
                } else {
                    api.toast({
                        msg: '暂无数据',
                        duration: 2000,
                        location: 'bottom'
                    });
                }
            }
        })
    }
    // 填写工单
    function openChangeFill(ids, title) {
        var pageParam = {
            id: ids,
            title: title
        }
        $event.openWin('changeFill_win', 'changefillword_win', pageParam, '')
    }
</script>