|
|
@@ -0,0 +1,229 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org"
|
|
|
+ xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"
|
|
|
+ layout:decorator="main">
|
|
|
+<head>
|
|
|
+ <link rel="stylesheet" href="/static/css/applications.css" type="text/css"/>
|
|
|
+ <!-- dataTables -->
|
|
|
+ <link rel="stylesheet" type="text/css"
|
|
|
+ href="/static/AdminLTE/bower_components/datatables.net-bs/css/dataTables.bootstrap.min.css"/>
|
|
|
+ <!-- Font Awesome -->
|
|
|
+ <link rel="stylesheet" href="/static/AdminLTE/bower_components/font-awesome/css/font-awesome.min.css"/>
|
|
|
+ <!-- Ionicons -->
|
|
|
+ <link rel="stylesheet" href="/static/AdminLTE/bower_components/Ionicons/css/ionicons.min.css"/>
|
|
|
+ <!-- daterange picker -->
|
|
|
+ <link rel="stylesheet" href="/static/AdminLTE/bower_components/bootstrap-daterangepicker/daterangepicker.css"/>
|
|
|
+ <!-- bootstrap datepicker -->
|
|
|
+ <link rel="stylesheet" href="/static/AdminLTE/bower_components/bootstrap-datepicker/dist/css/bootstrap-datepicker.min.css"/>
|
|
|
+ <!-- iCheck for checkboxes and radio inputs -->
|
|
|
+ <link rel="stylesheet" href="/static/AdminLTE/plugins/iCheck/all.css"/>
|
|
|
+ <!-- Bootstrap time Picker -->
|
|
|
+ <link rel="stylesheet" href="/static/AdminLTE/plugins/timepicker/bootstrap-timepicker.min.css"/>
|
|
|
+ <!-- Select2 -->
|
|
|
+ <link rel="stylesheet" type="text/css" href="/static/AdminLTE/bower_components/select2/dist/css/select2.min.css"/>
|
|
|
+ <!-- Theme style -->
|
|
|
+ <link rel="stylesheet" href="/static/AdminLTE/dist/css/AdminLTE.min.css"/>
|
|
|
+ <!-- AdminLTE Skins. Choose a skin from the css/skins
|
|
|
+ folder instead of downloading all of them to reduce the load. -->
|
|
|
+ <link rel="stylesheet" href="/static/AdminLTE/dist/css/skins/_all-skins.min.css"/>
|
|
|
+</head>
|
|
|
+<body>
|
|
|
+<th:block layout:fragment="sidebar">
|
|
|
+ <li th:replace="/task_detail::crowdSidebar">
|
|
|
+</th:block>
|
|
|
+
|
|
|
+
|
|
|
+<th:block layout:fragment="maincontent">
|
|
|
+ <section class="content-header">
|
|
|
+ <h1>
|
|
|
+ 新建众测任务
|
|
|
+ <small>众包测试</small>
|
|
|
+ </h1>
|
|
|
+ <ol class="breadcrumb">
|
|
|
+ <li><a href="/home"><i class="fa fa-dashboard"></i> 主页</a></li>
|
|
|
+ <li><a href="/addCrowdTask">新建众测任务</a></li>
|
|
|
+ </ol>
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <!-- Main content -->
|
|
|
+ <section class="content" id="maincontent">
|
|
|
+
|
|
|
+ <div class="box box-primary" >
|
|
|
+ <div class="box-header with-border">
|
|
|
+ <h3 class="box-title">基本信息</h3>
|
|
|
+ <button class="btn btn-success pull-right" onclick="">
|
|
|
+ 生成
|
|
|
+ </button>
|
|
|
+ </div>
|
|
|
+ <!-- /.box-header -->
|
|
|
+ <div class="box-body">
|
|
|
+ <form class="form-horizontal">
|
|
|
+ <!-- text input -->
|
|
|
+ <div class="form-group">
|
|
|
+ <label class="col-sm-2 control-label">名称</label>
|
|
|
+ <div class="col-sm-4">
|
|
|
+ <input onchange="checkNull(event)" class="form-control" id="name" placeholder="请输入任务名称"/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- textarea -->
|
|
|
+ <div class="form-group">
|
|
|
+ <label class="col-sm-2 control-label">描述</label>
|
|
|
+ <div class="col-sm-6">
|
|
|
+ <textarea onchange="checkNull(event)" id="description" class="form-control" rows="3" placeholder="请输入描述信息"></textarea>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- Date and time range -->
|
|
|
+ <div class="form-group">
|
|
|
+ <label class="col-sm-2 control-label" >任务时间</label>
|
|
|
+ <div class=" col-sm-5">
|
|
|
+ <!-- <div class="input-group-addon">-->
|
|
|
+ <!-- <i class="fa fa-clock-o"></i>-->
|
|
|
+ <!-- </div>-->
|
|
|
+ <input type="text" class="form-control pull-right" id="reservationtime"/>
|
|
|
+ </div>
|
|
|
+ <!-- /.input group -->
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- select -->
|
|
|
+ <div class="form-group">
|
|
|
+ <label class="col-sm-2 control-label" >任务类型</label>
|
|
|
+ <div class=" col-sm-4">
|
|
|
+ <select class="form-control" id="testType" onchange="changeType()">
|
|
|
+ <option >移动应用</option>
|
|
|
+ <option >Web应用</option>
|
|
|
+ </select>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- text input -->
|
|
|
+ <div class="form-group" id="webUrl" style="display: none">
|
|
|
+ <label class="col-sm-2 control-label">待测网站链接</label>
|
|
|
+ <div class="col-sm-6">
|
|
|
+ <input onchange="checkNull(event)" class="form-control" id="websiteUrl" placeholder="请输入网站链接"/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="form-group" id="apkFile">
|
|
|
+ <label for="testApplication" class="col-sm-2 control-label">待测应用</label>
|
|
|
+ <div class="col-sm-10">
|
|
|
+ <input type="file" id="testApplication"/>
|
|
|
+ <!-- <p class="help-block">Example block-level help text here.</p>-->
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="form-group">
|
|
|
+ <label for="testRequirement" class="col-sm-2 control-label">测试需求</label>
|
|
|
+ <div class="col-sm-10">
|
|
|
+ <input type="file" id="testRequirement"/>
|
|
|
+ <!-- <p class="help-block">Example block-level help text here.</p>-->
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="form-group">
|
|
|
+ <label for="testRequirement" class="col-sm-2 control-label">三级页面<br><a href="http://mooctest-site.oss-cn-shanghai.aliyuncs.com/excel-template.xlsx">示例</a></label>
|
|
|
+ <div class="col-sm-10">
|
|
|
+ <input type="file" id="threePage"/>
|
|
|
+ <!-- <p class="help-block">Example block-level help text here.</p>-->
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </section>
|
|
|
+
|
|
|
+</th:block>
|
|
|
+</body>
|
|
|
+</html>
|
|
|
+<!-- jQuery 3 -->
|
|
|
+<!--<script src="/static/AdminLTE/bower_components/jquery/dist/jquery.min.js"></script>-->
|
|
|
+<!-- Bootstrap 3.3.7 -->
|
|
|
+<script src="/static/AdminLTE/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
|
|
|
+<script src="/static/AdminLTE/bower_components/datatables.net/js/jquery.dataTables.min.js"></script>
|
|
|
+<script src="/static/AdminLTE/bower_components/datatables.net-bs/js/dataTables.bootstrap.min.js"></script>
|
|
|
+<script src="/static/AdminLTE/bower_components/select2/dist/js/select2.min.js"></script>
|
|
|
+<!-- InputMask -->
|
|
|
+<script src="/static/AdminLTE/plugins/input-mask/jquery.inputmask.js"></script>
|
|
|
+<script src="/static/AdminLTE/plugins/input-mask/jquery.inputmask.date.extensions.js"></script>
|
|
|
+<script src="/static/AdminLTE/plugins/input-mask/jquery.inputmask.extensions.js"></script>
|
|
|
+<!-- date-range-picker -->
|
|
|
+<script src="/static/AdminLTE/bower_components/moment/min/moment.min.js"></script>
|
|
|
+<script src="/static/AdminLTE/bower_components/bootstrap-daterangepicker/daterangepicker.js"></script>
|
|
|
+<!-- bootstrap datepicker -->
|
|
|
+<script src="/static/AdminLTE/bower_components/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js"></script>
|
|
|
+<!-- bootstrap time picker -->
|
|
|
+<script src="/static/AdminLTE/plugins/timepicker/bootstrap-timepicker.min.js"></script>
|
|
|
+<!-- SlimScroll -->
|
|
|
+<script src="/static/AdminLTE/bower_components/jquery-slimscroll/jquery.slimscroll.min.js"></script>
|
|
|
+<!-- iCheck 1.0.1 -->
|
|
|
+<script src="/static/AdminLTE/plugins/iCheck/icheck.min.js"></script>
|
|
|
+<!-- FastClick -->
|
|
|
+<script src="/static/AdminLTE/bower_components/fastclick/lib/fastclick.js"></script>
|
|
|
+
|
|
|
+<script src="/static/AdminLTE/bower_components/datatables.net/js/jquery.dataTables.min.js"></script>
|
|
|
+<script src="/static/AdminLTE/bower_components/datatables.net-bs/js/dataTables.bootstrap.min.js"></script>
|
|
|
+<script src="/static/AdminLTE/bower_components/select2/dist/js/select2.min.js"></script>
|
|
|
+<!--<script src="/static/js/app_info.js"></script>-->
|
|
|
+<script type="text/javascript">
|
|
|
+ $(document).ready(function(){
|
|
|
+ $('#crowdSidebar').addClass('active');
|
|
|
+ $('#crowdSidebarMenu-addCrowdTask').addClass('active');
|
|
|
+ $('#reservationtime').daterangepicker({ timePicker: true, timePickerIncrement: 30, locale: { format: 'MM/DD/YYYY hh:mm A' }})
|
|
|
+ });
|
|
|
+
|
|
|
+ changeType = function () {
|
|
|
+ var type = $('#testType').val();
|
|
|
+ if(type == 'Web应用'){
|
|
|
+ $('#apkFile').css('display','none');
|
|
|
+ $('#webUrl').css('display','block');
|
|
|
+ }else{
|
|
|
+ //移动应用
|
|
|
+ $('#apkFile').css('display','block');
|
|
|
+ $('#webUrl').css('display','none');
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ addTask = function(){
|
|
|
+ //type = 0 表示添加
|
|
|
+ // type = 1 表示修改
|
|
|
+ // 遍历页面上的数据，生成json数据。
|
|
|
+ var data = new FormData();
|
|
|
+ data.append('name',$('#name').val());
|
|
|
+ data.append('description',$('#description').val());
|
|
|
+ data.append('time',$('#reservationtime').val());
|
|
|
+ data.append('type',$('#testType').val());
|
|
|
+ data.append('webUrl',$('#webUrl').val());
|
|
|
+ data.append("apk",document.getElementById('excel_file').files[0])
|
|
|
+ data.append("requirement",document.getElementById('testRequirement').files[0])
|
|
|
+ data.append("threePage",document.getElementById('threePage').files[0])
|
|
|
+ $.ajax({
|
|
|
+ url: '/addCrowdTask',
|
|
|
+ data:data,
|
|
|
+ type: 'POST',
|
|
|
+ processData: false,
|
|
|
+ contentType: false,
|
|
|
+ success: function (result) {
|
|
|
+ if(result['status'] == 'fail'){
|
|
|
+ $.notify({
|
|
|
+ message: result['message']
|
|
|
+ },{
|
|
|
+ // settings
|
|
|
+ delay: 100,
|
|
|
+ timer: 1000,
|
|
|
+ type: 'error'
|
|
|
+ });
|
|
|
+ }else if(result['status'] == 'success'){
|
|
|
+
|
|
|
+ $.notify({
|
|
|
+ message: '添加成功'
|
|
|
+ },{
|
|
|
+ // settings
|
|
|
+ delay: 100,
|
|
|
+ timer: 3000,
|
|
|
+ type: 'success'
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+</script>
|
insomniaLee