代码

最新推荐文章于 2023-12-18 08:53:43 发布

找扁找轻松

最新推荐文章于 2023-12-18 08:53:43 发布

阅读量157

点赞数

分类专栏： java小菜鸟

本文链接：https://blog.csdn.net/weixin_38494588/article/details/90755617

版权

java小菜鸟专栏收录该内容

7 篇文章 0 订阅

订阅专栏

<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>WorkFlow</title>
    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
    <link rel="stylesheet" href="project_manage.css">
    <script src="https://www.imooc.com/static/lib/jquery/1.9.1/jquery.js"></script>
    <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
    <script src="query_project.js"></script>
</head>
<body style="background-color: #E2F9AA">

<!--上面导航栏-->
<div class="navbar navbar-default navbar-fixed-top" role="navigation">
    　   <div class="navbar-header">
    　        <a href="##" class="navbar-brand">WorkFlow</a>
    　   </div>
    <ul class="nav navbar-nav">
        <li class="active"><a href="../project_manage/project_manage.html">项目管理</a></li>
        <li ><a href="../schedule/schedule.html">日程</a></li>
        <li  ><a href="../task/task.html">任务管理</a></li>
        <li ><a href="../team/team.html">团队管理</a></li>
    </ul>
    <div class="btn-group" style="float: right">
        <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown"  >我是昵称
            <span class="caret"></span>
        </button>
        <ul class="dropdown-menu" role="menu">
            <li><a href="#" id="nickname">个人信息</a></li>
            <li><a href="#" id="change_password">修改密码</a></li>
            <li><a href="#" id="log_out">退出登陆</a></li>
        </ul>
    </div>
</div>

<!--项目页面主体-->
<section>
    <div>
        <div class="box" >
            <menu id="project_menu">

            </menu>
            <menu>
                <div class="menu-item">
                    <span class="menu-parent active" id="add_project">添加项目</span>
                </div>
            </menu>
        </div>

    </div>
    <!--    根据左边点击效果，刷新右边右边，同时右边使用ajax动态添加更改数据-->
    <div id="task_table" class="hidden">
        <table border="1" class="table table-bordered  table-condensed">
            <tr>
                <th>项目ID</th>
                <th>项目名称</th>
                <th>项目开始时间</th>
                <th>项目结束时间</th>
                <th>当前状态</th>
            </tr>
            <tr>
                <td id="project_id"></td>
                <td id="project_name"></td>
                <td id="start_time"></td>
                <td id="end_time"></td>
                <td id="current_state"></td>
            </tr>
        </table>
        <p>项目详情：<span id="project_brief"></span></p>
        <p>添加成员</p>
        <table border="1" class="table table-bordered  table-condensed" >
            <tr>
                <th>任务名</th>
                <th>任务负责人</th>
                <th>任务开始时间</th>
                <th>任务结束时间</th>
                <th>当前状态</th>
                <th>操作</th>
            </tr>

            <tr id="task_operation">
                <td ><input type="text" id="task_name" placeholder="任务名"></td>
                <td ><input type="text" id="task_owner" placeholder="任务负责人"></td>
                <td ><input type="date" id="task_start_time"></td>
                <td ><input type="date" id="task_end_time"></td>
                <td ></td>
                <td class="btn btn-active" id="add_task">添加</td>
            </tr>

        </table>
        <p>成员概况</p>
        <table border="1" class="table table-bordered  table-condensed" id="member_table">

        </table>
    </div>

</section>


<!--下面导航栏-->
<div class="navbar navbar-fixed-bottom" align="center" role="navigation">
    　   <p>author: Abian@BUCT</p>
</div>
<script src="../common/common.js"></script>
<script src="add_project.js"></script>
<script src="query_task.js"></script>
<script src="add_task.js"></script>
</body>
</html>

/*下侧section的样式*/
section {
    width: 90%;
    height: auto;
    border: 1px solid skyblue;
    margin: 100px auto;
    /*父盒子添加 flex*/
    display: flex;  /*伸缩布局模式*/  /*这个盒子就会拥有弹性  弹性布局（弹性盒子）*/
}
section div {
    height: 100%;
}
section div:nth-child(1) {
    /*background-color: pink;//测试布局使用*/
flex: 1;  /*子盒子添加分数 flex:1 不加单位*/
}
section div:nth-child(2) {
    /*background-color: purple;//测试布局使用*/
    margin: 0 5px;
    flex: 4;/*子盒子添加分数*/
}
/*section div:nth-child(3) {*/
/*    background-color: pink;*/
/*    flex: 4;!*子盒子添加分数*!*/
/*}*/

/*左侧导航栏*/
* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}
html,body{
    width: 100%;
    height: 100%;
}

header {
    width: 100%;
    height: 50px;
    background: #1A2940;
    color: #fff;
}
.box{
    width: 180px;
    height: 100%;
    background-color: #6a8bbc;
}

menu {
    width: 180px;
    /*height: calc(height-50);*/
    /*max-height: 100%;*/
    overflow: auto;
    background-color: #6a8bbc;

}
menu .menu-item {
    position: relative;
}
menu .menu-item > input {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    /*height: 46px;*/
    opacity: 0;
    cursor: pointer;
}
menu .menu-parent:hover{
    background: #1A2940;
}
menu .menu-parent:active{
    color: #fff;
    background-color: #5375f1;
}
menu .menu-parent:visited{
    color: #fff;
    background-color: #5375f1;
}
menu span {
    display: block;
    padding: 5px 10px;
    font-size: 16px;
    line-height: 36px;
    cursor: pointer;
}
menu span:hover {
    background: #1A2940;
    color: #fff;
}
menu span:active{
    color: #fff;
    background-color: #5375f1;
}
menu span.menu-child {
    font-size: 14px;
    text-indent: 20px;
}
menu .menu-item-list {
    max-height: 0;
    overflow: hidden;
    transition: all .3s ease;
}
menu :checked + .menu-item-list {
    max-height: 500px;
}
.tdcolor { color:red }
/*div的隐藏还是显示*/
.show {
    display: block;
}

.hidden {
    display: none;
}

function add_member() {
    var btn = document.getElementById("add_member_btn");
    btn.onclick = function () {
        var member_id = $("#member_id").val();
        var member_name = $("#member_name").val();
        // alert(user_id);
        var data = $.ajax({
            type:'get',
            url:'./php/add_member.php',
            dataType:'json',
            async : false,
            data:{
                team_id:team_id,
                member_id:member_id,
                member_name:member_name
                // user_id:user_id
            },
            success:function (data) {
                // alert("success");
            },
            error:function () {
                alert("why error");
            }
        });
    }
}

function add_task() {

    var btn = document.getElementById("add_task");

    btn.onclick = function () {
        // alert("测试");

        var task_owner = $("#task_owner").val();
        var task_name = $("#task_name").val();
        var task_start_time = $("#task_start_time").val();
        var task_end_time = $("#task_end_time").val();
        var front_node = $("#front_node").val();
        // alert(front_node)
        var task_number = task_flag;
        // alert(task_number+task_name);
        var data = $.ajax({
            type:'get',
            url:'./php/add_task.php',
            dataType:'json',
            async : false,
            data:{
                task_owner:task_owner,
                task_name:task_name,
                start_time:task_start_time,
                end_time:task_end_time,
                project_id:project_id,
                front_node:front_node,
                task_number:task_number
            },
            success:function (data) {
                // alert("插入成功")

            },

            error:function () {
                alert("错了");
            }
        });
    }
}

function add_team() {
    var btn = document.getElementById("add_team_show")
    // 左侧添加团队按钮
    btn.onclick =function () {
        // alert(110)
        document.getElementById("add_team_table").setAttribute("class","show");
        document.getElementById("show_team_detailed").setAttribute("class","hidden");
    }
    // 右侧添加团队操作
    var btn1 = document.getElementById("add_team");
    btn1.onclick =function () {

        // document.getElementById("task_table").setAttribute("class","hidden");
        var team_owner = user_id;

        var team_name = $("#team_name").val();
        var team_id = $("#team_id").val();
        var data = $.ajax({
            type:'get',
            url:'../database_php/add_team.php',
            dataType:'json',
            async : false,
            data:{
                team_id:team_id,
                team_name:team_name,
                team_owner:team_owner
            },
            success:function (data) {
                alert("成功创建团队")

            },

            error:function () {
                alert("测试");
            }
        });
    }

}

$(function(){
        project_id = "123123";
        //获取了左边的按钮，并且注册点击事件
            //将右边div设置为可见
            // var project_id = this.getAttribute("id");
            var data = $.ajax({
                type:'get',
                url:'./php/query_task_in_detailed.php',
                dataType:'json',
                async : false,
                data:{
                    project_id: project_id
                },
                success:function (data) {

                    //设置右边项目详情内容
                    var html = "";
                    task_flag = data.length+1;
                    document.getElementById("task_number").innerHTML = task_flag;
                    //x，y初始位置
                    var x = 300,y =300;

                    for (var i = 0; i<data.length;i++){

                        datas.push({name: data[i]["task_id"], x: x, y: y});
                        //第一个没有前置节点
                        if (i!=0)
                            links.push({source: data[i]["front_node"],target:data[i]["task_id"]});
                        // x+=50*data[i]["front_node"],target:data[i]["task_id"]

                        //节点相减等于-1,同一排
                        //不等于-1，不同一排
                        if (data[i]["front_node"]-data[i]["task_id"]==-1) {
                            x+=100;
                            y=300;
                        }else{
                            y+=50;
                        }

                        // alert(data[i]["front_node"]);
                        html+='<tr>' +
                            '<th >'+data[i]["task_id"]+'</th>' +
                            '<td >'+data[i]["task_name"]+'</td>' +
                            '<td >'+data[i]["user_name"]+'</td>' +
                            ' <td >'+data[i]["start_time"]+'</td>' +
                            '<td >'+data[i]["end_time"]+'</td>' +
                            '<td >'+data[i]["front_node"]+'</td>' +
                            '<td ></td>' +
                            '</tr>';

                    }
                    $("#task_table").html(html);

                    //echart作图
                    var dom = document.getElementById("container");
                    var myChart = echarts.init(dom);
                    var app = {};
                    option = null;
                    option = {
                        title: {
                            text: '任务视图'
                        },
                        tooltip: {},
                        animationDurationUpdate: 1500,
                        animationEasingUpdate: 'quinticInOut',
                        series : [
                            {
                                type: 'graph',
                                layout: 'none',
                                symbolSize: 50,
                                roam: true,
                                label: {
                                    normal: {
                                        show: true
                                    }
                                },
                                edgeSymbol: ['circle', 'arrow'],
                                edgeSymbolSize: [4, 10],
                                edgeLabel: {
                                    normal: {
                                        textStyle: {
                                            fontSize: 20
                                        }
                                    }
                                },
                                data: datas,
                                // links: [],
                                links: links,
                                lineStyle: {
                                    normal: {
                                        opacity: 0.9,
                                        width: 2,
                                        curveness: 0
                                    }
                                }
                            }
                        ]
                    };
                    // alert(datas);
                    // alert(links);
                    console.dir(links);
                    if (option && typeof option === "object") {
                        myChart.setOption(option, true);
                    }
                },
                error:function () {
                    alert("那是这里出错了");
                }
            });
});

	$server_name = "localhost";
    $user_name = "root";
    $user_password = "";
    $database_name = "workflow_ms";
    $table_name = "user_data";
    $conn = new mysqli($server_name, $user_name, $user_password, $database_name);
    $li_id_number = 0;
    // 检测连接
    if ($conn->connect_error) {
        die("Connection failed: " . $conn->connect_error);
	}

	$conn->close();

<?php
	//由user_id查询自定义表
	$team_id =$_GET["team_id"];
	$sql = "SELECT * FROM `member_data` WHERE team_id = '$team_id' ";
	
	$info_data = null;
	//连接数据库
	$server_name = "localhost";
	$user_name = "root";
	$user_password = "";
	$database_name = "workflow_ms";
	$conn = new mysqli($server_name, $user_name, $user_password, $database_name);
	$li_id_number = 0;
	// 检测连接
	if ($conn->connect_error) {
	    die("Connection failed: " . $conn->connect_error);
	}
	//        拼接完后返回该列表
	$return = array();
	$result = $conn->query($sql);
	if ($result->num_rows > 0) {
	    while ($row = $result->fetch_assoc()) {
	//               返回所有查询任务的json格式
	//        team_id	team_name	member_id	member_name	team_owner
	        $row_result = array();
	        $row_result["member_id"]=$row["member_id"];
	        $row_result["member_name"]=$row["member_name"];
	//        $row_result["team_owner"]=$row["team_owner"];
	
	        array_push($return,$row_result);
	    }
	} else {
	//            $return = json_encode("error");
	}
	$conn->close();
	echo json_encode($return);

找扁找轻松

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
代码

<!DOCTYPE HTML><html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>WorkFlow</title> <link rel="stylesheet" href...
复制链接

扫一扫