<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="shortcut icon" href="img/ic.png">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>车队信息</title>

    <!-- Bootstrap Core CSS -->
    <link href="css/bootstrap.css" rel="stylesheet">

    <!-- Custom CSS -->
    <link href="css/sb-admin.css" rel="stylesheet">

    <!-- Morris Charts CSS -->
    <link href="css/plugins/morris.css" rel="stylesheet">
    <link href="dist/css/bootstrapValidator.css" rel="stylesheet">
    <!-- Custom Fonts -->
    <link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
    <link rel="stylesheet" href="css/cdn/font_evmq6xwfabutyb9.css">
    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="js/cdn/html5shiv-3.7.0.js"></script>
    <script src="js/cdn/respond-1.4.2.min.js"></script>
    <![endif]-->
    <link rel="stylesheet" href="css/cdn/dataTables.bootstrap.css">
    <link rel="stylesheet" href="css/cdn/font_i0327076nave7b9.css">
    <link href="nuget/content/content/toastr.css" rel="stylesheet" type="text/css"/>
    <link rel="stylesheet" type="text/css" href="css/datatable.css"/>
    <link rel="stylesheet" href="layer/theme/default/layer.css">
    <style>
        #example_paginate{
            float:right;
        }
        .handle-btn{
            cursor: pointer;
            margin: 0 2px;
        }
        #wrapper {
            padding-left:0px;
        }
        .navigation{
            border-bottom: 3px solid #edebeb;
        }

        .navigation a:hover{
            color: #0F6AFC;
            border-bottom: 2px solid #01AAED;
        }
        .this{
            color: #01aaed;
            font-weight:bold;
            border-bottom: 2px solid #01AAED;
        }
        #check>tbody>tr{
            line-height: 20px;
        }

        [v-cloak] {
            display: none;
        }

        /*.td_w2{*/
            /*width: 180px;*/
        /*}*/
        .td_w1{
            width: 100px;
        }

        .t2b {
            width: 15px;
            margin: 0 auto;
            line-height: 1.6rem;
            font-size: 1.4rem;
            word-wrap: break-word;/*英文的时候需要加上这句，自动换行*/

            /*writing-mode: vertical-lr;!*从左向右 从右向左是 writing-mode: vertical-rl;*!*/
            /*writing-mode: tb-lr;!*IE浏览器的从左向右 从右向左是 writing-mode: tb-rl；*!*/
        }
    </style>
</head>
<body>
<div id="wrapper">
    <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"style="height: 67px; background-image:url(img/top.jpg);">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
        </div>
        <!-- Top Menu Items -->
        <ul class="nav navbar-right top-nav">

            <li class="dropdown">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-user"></i> <span id="userName"></span> <b class="caret"></b></a>
                <ul class="dropdown-menu">
                    <li>
                        <a href="refereePwd.html"><i class="fa fa-fw fa-gear"></i> 修改密码</a>
                    </li>
                    <li class="divider"></li>
                    <li>
                        <a href="login.html"><i class="fa fa-fw fa-power-off"></i> 退出</a>
                    </li>
                </ul>
            </li>
        </ul>
    </nav>
    <div id="page-wrapper">
        <div class="container-fluid">
            <div class="row sss">
                <nav class="navbar navbar-default" role="navigation">
                    <ul class="nav navbar-nav">
                        <li><a href="index.html">首页</a></li>
                        <li><a href="ParticipatingTeams.html">参赛车队</a></li>
                        <li class="active"><a href="javascript:;"><span class="xuanzhong">车队详情</span></a></li>
                    </ul>
                </nav>
            </div>
            <div class="row">
                <div style="width: 900px;margin: auto;">
                    <!--<div class="row text-center">-->
                        <!--<h2>{{teamsObj.teamName}}</h2>-->
                    <!--</div>-->

                    <table class="table table-bordered text-center">
                        <tbody>
                        <tr>
                            <td colspan="2" class="td_w1">车队名称</td>
                            <td colspan="3">{{teamsObj.teamName}}</td>
                            <td class="td_w1">参赛车数</td>
                            <td class="td_w1">{{teamsObj.automobileQuantity}}</td>
                            <td class="td_w1">参赛人数</td>
                            <td class="td_w1">{{teamsObj.matchesNumber}}</td>
                        </tr>
                        <tr>
                            <td colspan="2">车队组成单位</td>
                            <td colspan="7">{{teamsObj.teamOrganization}}</td>
                        </tr>
                        <tr>
                            <td colspan="2">是否参加离线测试</td>
                            <td class="td_w1">参加</td>
                            <td colspan="3"><span v-if="teamsObj.offlineTest==='Y'">√</span></td>
                            <td class="td_w1">不参加</td>
                            <td colspan="2"><span v-if="teamsObj.offlineTest==='N'">√</span></td>
                        </tr>
                        <tr>
                            <td rowspan="3" class="td_w1 t2b">负责人</td>
                            <td>姓名</td>
                            <td colspan="3">{{teamsObj.teamLeader}}</td>
                            <td>性别</td>
                            <td colspan="3">
                                <span v-if="teamsObj.gender===0">男</span>
                                <span v-if="teamsObj.gender===1">女</span>
                            </td>
                        </tr>
                        <tr>
                            <td>职务/职称</td>
                            <td colspan="3">{{teamsObj.duty}}</td>
                            <td>手机</td>
                            <td colspan="3">{{teamsObj.teamPhone}}</td>
                        </tr>
                        <tr>
                            <td>办公电话</td>
                            <td colspan="3">{{teamsObj.officePhone}}</td>
                            <td>电子邮件</td>
                            <td colspan="3">{{teamsObj.email}}</td>
                        </tr>
                        <tr>
                            <td rowspan="3" class="t2b">赛车参数</td>
                            <td>车长（毫米）</td>
                            <td  colspan="2">{{teamsObj.automobileLength}}</td>
                            <td>车宽（毫米）</td>
                            <td>{{teamsObj.automobileWidth}}</td>
                            <td colspan="2">车高（毫米）</td>
                            <td>{{teamsObj.automobileHeight}}</td>
                        </tr>
                        <tr>
                            <td>离去角（度）</td>
                            <td  colspan="2">{{teamsObj.departureAngle}}</td>
                            <td>接近角（度）</td>
                            <td>{{teamsObj.approachAngle}}</td>
                            <td colspan="2">最小离地间隙（毫米）</td>
                            <td>{{teamsObj.minGroundClearance}}</td>
                        </tr>
                        <tr>
                            <td>轮距（毫米）</td>
                            <td  colspan="2">{{teamsObj.wheelTrack}}</td>
                            <td>轴距（毫米）</td>
                            <td>{{teamsObj.wheelBase}}</td>
                            <td colspan="2">最小转弯半径（毫米）</td>
                            <td>{{teamsObj.minTurningRadius}}</td>
                        </tr>
                        <tr>
                            <td colspan="2">自主行驶最高车速</td>
                            <td colspan="3">{{teamsObj.maxSpeed}}</td>
                            <td colspan="2">自主行驶最低车速</td>
                            <td colspan="2">{{teamsObj.minSpeed}}</td>
                        </tr>
                        <tr>
                            <!--参赛车辆图片（分辨率640×480/格式JPG）-->
                            <td rowspan="2" class="t2b">参赛车辆图片</td>
                            <td colspan="4">正视图</td>
                            <td colspan="4">侧视图</td>
                        </tr>
                        <tr>
                            <td colspan="4">
                                <img style="width: 200px;cursor: pointer;" :src="getImgPath(teamsObj.frontView)" alt="" v-show-img>
                            </td>
                            <td colspan="4">
                                <img style="width: 200px;cursor: pointer;" :src="getImgPath(teamsObj.lateralView)" alt="" v-show-img>
                            </td>
                        </tr>
                        </tbody>

                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- jQuery -->
<script src="js/jquery.js"></script>
<!--layer-->
<script src="layer/layer.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="js/bootstrap.min.js"></script>
<!-- tab table-->
<script type="text/javascript" src="js/common.js" ></script>
<!-- Morris Charts JavaScript -->
<script type="text/javascript" src="js/vue/vue.js" ></script>
<script type="text/javascript" src="js/vue/vue-router.js" ></script>
<script src="js/vue/v-showImg.js"></script>
</body>
<script>

    var vue = new Vue({
        el: '#wrapper',
        data:{
            teamId: '',
            teamsObj: {}
        },
        mounted:function(){
            this.teamId = getQueryString("teamId",window.location.href); //用户传ID
            this.init();
        },
        methods:{
            init: function () {
                var _self = this;
                $.ajax({
                    type: "get",
                    url:url+'/users/'+adminId+'/teams/'+teamId,
                    async: false,
                    dataType: 'json',
                    contentType: "application/json; charset=utf-8",
                    beforeSend: function(request) {
                        request.setRequestHeader("accessToken", accessToken);
                    },
                    success: function(data) {
                        if(data.code == 1){
                            var result = data.result;
                            _self.teamsObj = result;
                        }else{
                            toastr['error'](data.description);
                        }

                    }
                });
            },
            getImgPath: function (path) {
                if(!path) return;
                var str = url + "/showImg?imgPath=" + path;
                return str;
            }
        }
    });
</script>
</html>