p49726105
/
ambition
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
ambition/public/pages/project_select.html

266 lines
11 KiB
HTML
Raw Normal View History

上传部分原型代码
2016-12-08 10:10:37 +08:00
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Ambition-敏捷项目开发管理工具</title>
<!-- Tell the browser to be responsive to screen width -->
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<!-- Font Awesome -->
<link rel="stylesheet" href="../plugins/font-awesome/css/font-awesome.css">
<!-- Theme style -->
<link rel="stylesheet" href="../dist/css/AdminLTE.min.css">
<!-- Bootstrap 3.3.5 -->
<link rel="stylesheet" href="../bootstrap/css/bootstrap.min.css">
<!-- AdminLTE Skins. We have chosen the skin-blue for this starter
page. However, you can choose any other skin. Make sure you
apply the skin class to the body tag so the changes take effect.
-->
<link rel="stylesheet" href="../dist/css/skins/skin-green.min.css">
<!-- date picker -->
<link rel="stylesheet" href="../dist/css/datepicker.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="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<style>
.project-enter {
position: absolute;
top: 30px;
right: 17px;
}
hr {
flex: 1 1 auto;
width: 90%;
height: 1px;
border: 0;
margin: 32px 0 0 5px;
background-image: linear-gradient(to right, rgba(0, 0, 0, .50) 0, rgba(0, 0, 0, 0) 100%);
background-repeat: repeat-x;
display: block;
float: left;
}
.content-title {
width: 7%;
float: left;
}
.title-wrapper {
margin-bottom: 30px;
}
</style>
</head>
<body class="hold-transition skin-green sidebar-mini" style="overflow-x:hidden;">
<div class="wrapper">
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper" style="margin-left:0px;">
<section class="content-header">
<b>Ambition-敏捷项目开发管理工具</b>
</h1>
</section>
<!-- header section -->
<!-- Content Header (Page header) -->
<section class="content">
<div class="row">
<!-- col -->
<div class="col-lg-10 col-lg-offset-1 title-wrapper">
<div class="content-title">
<h3>项目选择</h3>
</div>
<hr>
</div>
<!-- col -->
<div class="col-lg-8 col-lg-offset-2">
展示项目列表接口
2016-12-29 16:11:27 +08:00
<div id="cy_container" class="row">
<div id="cy_template" class="col-lg-4" style="display:none;">
上传部分原型代码
2016-12-08 10:10:37 +08:00
<div class="box box-widget widget-user">
<!-- Add the bg color to the header using any of the bg-* classes -->
展示项目列表接口
2016-12-29 16:11:27 +08:00
<div id="cy_template_bg" class="widget-user-header bg-yellow">
上传部分原型代码
2016-12-08 10:10:37 +08:00
<!-- /.widget-user-image -->
展示项目列表接口
2016-12-29 16:11:27 +08:00
<h3 id="cy_template_name" class="widget-user-username">网吧五连座</h3>
<h5 id="cy_template_content" class="widget-user-desc">Ruby开发项目</h5>
进入项目按钮更改
2016-12-30 00:23:12 +08:00
<button id="cy_template_enterbtn" class="btn btn-default pull-right project-enter">
上传部分原型代码
2016-12-08 10:10:37 +08:00
<i class="fa fa-sign-in"></i>
进入项目按钮更改
2016-12-30 00:23:12 +08:00
</button>
上传部分原型代码
2016-12-08 10:10:37 +08:00
</div>
<div class="box-footer no-padding">
<ul class="nav nav-stacked">
展示项目列表接口
2016-12-29 16:11:27 +08:00
<li><a href="#">任务数 <span id="cy_template_mission_count" class="pull-right badge bg-blue">31</span></a></li>
<li><a href="#">参与人数 <span id="cy_template_users_count" class="pull-right badge bg-aqua">5</span></a></li>
<li><a href="#">通知数 <span id="cy_template_shares_count" class="pull-right badge bg-green">12</span></a></li>
上传部分原型代码
2016-12-08 10:10:37 +08:00
</ul>
</div>
</div>
<!-- /.widget-user -->
</div>
<!-- col -->
展示项目列表接口
2016-12-29 16:11:27 +08:00
上传部分原型代码
2016-12-08 10:10:37 +08:00
<div class="col-lg-4" style="height:242px;width:252px;margin-left:15px;background-color:white">
<!-- Add the bg color to the header using any of the bg-* classes -->
<!-- /.widget-user-image -->
<center>
<i class="fa fa-fw fa-plus-square" style="font-size:45px;display:block;margin-top:30%"></i>
<button class="btn btn-default btn-lg" data-toggle="modal" data-target="#myModal" style="margin-top:10%">
新建项目
</button>
</center>
<!-- 模态框（Modal） -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close"
data-dismiss="modal" aria-hidden="true">
&times;
</button>
<h4 class="modal-title" id="myModalLabel">
新建项目
</h4>
</div>
<div class="modal-body">
<form role="form">
<div class="box-body">
<div class="form-group">
<label for="exampleName">项目名称</label>
<input type="email" class="form-control" id="exampleName">
</div>
<div class="form-group">
<label for="exampleTextarea">项目简介</label>
<textarea class="form-control" id="exampleTextarea" rows="3"></textarea>
</div>
</div><!-- /.box-body -->
</form>
</div>
展示项目列表接口
2016-12-29 16:11:27 +08:00
<div id="creat_project" class="modal-footer">
上传部分原型代码
2016-12-08 10:10:37 +08:00
<button type="button" class="btn btn-primary">
创建
</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal -->
</div>
<!-- /.widget-user -->
<!-- col -->
</div>
<!-- row -->
</div>
<!-- col -->
</div>
<!-- row -->
</section>
<!-- content section -->
</div>
<!-- content-wrapper -->
</div>
<!-- ./wrapper -->
<center><strong>Copyright &copy; 2016 <a href="#">Lucio Yang</a>.</strong> All rights reserved.</center>
<!-- jQuery 2.1.4 -->
<script src="../plugins/jQuery/jQuery-2.1.4.min.js"></script>
<!-- Bootstrap 3.3.5 -->
<script src="../bootstrap/js/bootstrap.min.js"></script>
<!-- AdminLTE App -->
<script src="../dist/js/app.min.js"></script>
<!-- AdminLTE for demo purposes -->
<script src="../dist/js/demo.js"></script>
展示项目列表接口
2016-12-29 16:11:27 +08:00
<script>
创建项目按钮
2016-12-29 22:04:00 +08:00
展示项目列表接口
2016-12-29 16:11:27 +08:00
$(document).ready(function(){
htmlobj=$.ajax(
{
type:"GET",
dataType:"json",
url:"/projects.json",
statusCode: {
项目详情修改
2017-01-01 16:31:47 +08:00
200: function() {// 请求成功
var bg_color = ["bg-yellow","bg-blue","bg-purple","bg-red"];
var jstr = htmlobj.responseText;
var robj = eval('('+jstr+')');
console.log(jstr);
if(robj["code"]==0){
var data = robj["data"];
for(var i=data.length-1;i>=0;--i){
var template = $("#cy_template");
var tp = template.clone("true");
var id = data[i]["id"];
tp.find("#cy_template_name").html(data[i]["name"]);
tp.find("#cy_template_content").html(data[i]["content"]);
tp.find("#cy_template_mission_count").html(data[i]["mission_count"]);
tp.find("#cy_template_users_count").html(data[i]["users_count"]);
tp.find("#cy_template_shares_count").html(data[i]["shares_count"]);
tp.find("#cy_template_enterbtn").attr("onclick","cy_enter("+id+");");
展示项目列表接口
2016-12-29 16:11:27 +08:00
项目详情修改
2017-01-01 16:31:47 +08:00
tp.find("#cy_template_name").attr("id","cy_name_"+id);
tp.find("#cy_template_content").attr("id","cy_content_"+id);
tp.find("#cy_template_mission_count").attr("id","cy_mission_count_"+id);
tp.find("#cy_template_users_count").attr("id","cy_users_count_"+id);
tp.find("#cy_template_shares_count").attr("id","cy_shares_count_"+id);
tp.find("#cy_template_enterbtn").attr("id","cy_enter_"+id);
展示项目列表接口
2016-12-29 16:11:27 +08:00
项目详情修改
2017-01-01 16:31:47 +08:00
tp.find("#cy_template_bg").attr("class","widget-user-header "+bg_color[Math.floor(Math.random()*4)]);
tp.find("#cy_template_bg").attr("id","cy_bg_"+id);
展示项目列表接口
2016-12-29 16:11:27 +08:00
项目详情修改
2017-01-01 16:31:47 +08:00
tp.attr("id","cy_project_"+id);
tp.css("display","block");
展示项目列表接口
2016-12-29 16:11:27 +08:00
项目详情修改
2017-01-01 16:31:47 +08:00
$("#cy_container").prepend(tp);
展示项目列表接口
2016-12-29 16:11:27 +08:00
}
项目详情修改
2017-01-01 16:31:47 +08:00
}
else{
//todo
}
},
401:function(){// 未授权
alert("用户名或密码错误！");
}
}
展示项目列表接口
2016-12-29 16:11:27 +08:00
});
});
创建项目按钮
2016-12-29 22:04:00 +08:00
$("#creat_project").click(function(){
项目创建和项目列表接口修复
2017-01-01 19:23:26 +08:00
var pName=$("#exampleName").val();
var pContent=$("#exampleTextarea").val();
创建项目按钮
2016-12-29 22:04:00 +08:00
$.ajax({
type:"post",
dataType:"json",
url:"/projects.json",
data:{
项目创建和项目列表接口修复
2017-01-01 19:23:26 +08:00
"project[name]":pName,
"project[content]":pContent
创建项目按钮
2016-12-29 22:04:00 +08:00
},
statusCode: {
项目创建和项目列表接口修复
2017-01-01 19:23:26 +08:00
201: function() {// 请求成功
创建项目按钮
2016-12-29 22:04:00 +08:00
alert("创建成功！");
window.location.reload();
},
401:function(){// 未授权
alert("未登录！");
window.location.href="login.html";
项目创建和项目列表接口修复
2017-01-01 19:23:26 +08:00
},
422:function(){
alert("项目名重复！");
创建项目按钮
2016-12-29 22:04:00 +08:00
}
}
});
});
项目详情修改
2017-01-01 16:31:47 +08:00
function cy_enter(id){
console.log(id);
window.location.href="../index.html?projectid="+id;
}
展示项目列表接口
2016-12-29 16:11:27 +08:00
</script>
上传部分原型代码
2016-12-08 10:10:37 +08:00
</body>
</html>