<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="UTF-8">
	<title>Title</title>
	<link rel="stylesheet" th:href="@{/css/common/base.css}" />
	<link rel="stylesheet" th:href="@{/css/common/page_new.css}" />
	<link rel="stylesheet" th:href="@{/js/plugins/bootstrapselect/css/product_list.css}" />
	<link rel="stylesheet"  th:href="@{/css/layui.css}"  media="all">
	<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
	<script src="https://unpkg.com/element-ui/lib/index.js"></script>
</head>
<style type="text/css">
	.box .search_pro .cx input{
		background: #00B983;
		width: 100px;
		height: 39px;
		color:white;
		margin-right: 10px;
		padding: 10px -1px;
	}
	.content p span input{
		background: #00B983;
		color:white;
		margin-right: 10px;
		padding: 10px 20px;
		border:1px solid #EEEEEE;
		text-indent: 5px;
	}
	.layui-table th{
		text-align: center;
	}
	button{

	}
	body .layui-layer-rim .layui-layer-btn a{
		background-color:#005ba7;
		color: white;
	}
</style>

<body>
<div class="box">
	<h2><span></span>流程列表<button  onclick="location.reload()">刷新</button></h2>
	<div class="search">
		<p class="title">条件查询</p>
		<p class="search_pro" style="padding-left: 0px;">
			<label class="layui-form-label" style="    width: 150px;">流程名称:</label>
			<input style="width: 200px" type="text" name="modelName" lay-verify="title" autocomplete="off" placeholder="请输入流程名称" class="layui-input">
			<span class="cx">
				<button style="background-color: #005ba7;margin-left: 16px;" class="layui-btn" onclick="getBargainProduct()">查询</button>
			</span>
			<button id="addMe" class="layui-btn layui-btn-radius" style="margin-left: 690px;background-color: #005ba7;" onclick="goImport()">上传文件</button></span>
		</p>




	</div>
	<div class="content">
		<p class="title list_ti"><span>流程列表</span></p>
		<table class="layui-table" lay-size="sm">

		</table>
	</div>
	<div class="footer" style="display: flex;justify-content: space-between;align-items:center;padding:10px 10px;border:1px solid #e4e4e4;font-size:14px;color:#999">
		<div style="flex-grow: 1;display: flex;justify-content: flex-end;">
			<p style="line-height:33px">共<span style="color:#d00" id="pages">0</span>页/<span style="color:#d00" id="total">0</span>条数据</p>
			<div class="pagediv" style="clear:both;"></div>
		</div>
	</div>
</div>
</body>
</html>
<script src="/js/plugins/jquery.min.js"></script>
<script src="/js/plugins/layer/layer.js"></script>
<script src="/js/layui.js"></script>
<script type="text/javascript" src="/js/plugins/page_new.js"></script>
<script type="text/javascript">
    $(function(){
        $.post(
            "/api/bpm/model/modelList",
            {
                pageSize:10,
                pageNum:1,
                teamName:"",
                status:""
            },
            function (data) {
                var size = data.data.data.pages;
                if (!data.data.data.pages){
                    size = 0;
                }
                var current = data.data.data.pageNum;
                /*分页*/
                $(".pagediv").createPage({
                    pageNum: size,//总页码
                    current: current,//当前页
                    shownum: 10,//每页显示个数
                    showPageNum: true, //显示总页数
                    showToPage: true, //显示跳转页码
                    backfun: function (page) {
                        flushHtml(page.current);
                    }
                });
            },
            'json'
        );
        flushHtml();


    });
    function flushHtml(current) {
        var pageNum = 1;
        if(current){
            pageNum = current;
        }
        var teamName = $("[name='teamName']").val();
        var status = $("[name='status']").val();
        $.post(
            "/api/bpm/model/modelList",
            {
                pageSize:10,
                pageNum:pageNum,
                teamName:teamName,
                status:status
            },
            function (data) {
                selectListAll(data.data.data);
            },'json'
        );
    }
    function selectListAll(data) {
        var pages = data.pages;
        var total = data.total;
        data = data.list;
        var content = '';
        content += '<thead><tr><th>编号</th><th>流程名称</th><th style="width: 8%">部署ID</th><th>创建时间</th><th style="width: 8%">更新时间</th><th style="width: 8%">META_INFO_</th><th style="width: 8%">版本</th><th style="width: 15%">操作</th></tr></thead>';
        if(data!=null){
            for (var i in data) {
                content += '<tbody><tr>';
                content += '<td class="product_name" style="width: 5%;">'+data[i].id+'</td>';
                content += '<td class="product_num">'+data[i].name+'</td><td class="product_num">'+data[i].deploymentId+'</td>';
                content += '<td class="product_num">'+data[i].createTime+'</td><td class="product_num">'+data[i].updateTime+'</td>';
                content += '<td class="product_num">'+data[i].metaInfo+'</td><td class="product_num">'+data[i].version+'</td>';


                content += '<td class="cao_zuo"><span style="width: 15%" onclick="toActivityDetail('+data[i].id+')">查看</span></span><span onclick="deploymentModel('+data[i].id+',\''+data[i].name+'\',\''+data[i].deploymentId+'\')">部署流程</span>' +
					'<span style="width: 15%"  onclick="deleteDeployMent('+data[i].id+',\''+data[i].name+'\')">删除</span><span style="width: 15%"  onclick="exportDeployMent('+data[i].id+')">导出</span></td></tr></tbody>';
            }
            $('#pages').text(pages);
            $('#total').text(total);
        }else{
            content+= '<div class="tipImg"><img src="/images/non.png" ><p class="tipNon">暂无数据</p></div>';
            $('#pages').text(0);
            $('#total').text(0);
        }
        $('table').html(content);
    }
    /*条件查询*/
    function getBargainProduct() {
        var name = $("[name='modelName']").val();
        $.post("/api/bpm/model/modelList",
            {
                pageSize:10,
                pageNum:1,
                modelName:name
            },function (data) {
                selectListAll(data.data.data);
                var size = data.data.data.pages;
                if (!data.data.data.pages){
                    size = 0;
                }
                /*分页*/
                $(".pagediv").createPage({
                    pageNum: size,//总页码
                    current: 1,//当前页
                    shownum: 10,//每页显示个数
                    showPageNum: true, //显示总页数
                    showToPage: true, //显示跳转页码
                    backfun: function (page) {
                        flushHtml(page.current);
                    }
                });
            },'json')
    }

    /*查看流程 */
    function toActivityDetail(id) {
        location.href="/model/createNew?newID="+id
    }


    //部署流程
	function deploymentModel(id,name,deploymentId){
        if(deploymentId=='未部署'){
            layer.open({
                id:1,
                type: 1,
                title:'确认部署',
                skin:'layui-layer-rim',
                area:['300px', '165px'],
                content: '<div style="margin-top: 22px;margin-left: 8px;">您确定部署'+name+"流程吗？</div>"
                ,
                btn:['确定','取消'],
                btn1: function (index,layero) {
                    layer.msg('文件部署中', {
                        icon: 16,
                        time : -1
                    });
                    $.post("/api/bpm/model/deploymentModel",
                        {
                            modelId:id
                        },function (data) {
                            if(data.code==200){
                                layer.msg('部署成功',{time:1000},function () {
                                    location.reload();
                                });
                            }else {
                                layer.msg('部署失败',{time:1000},function () {
                                    location.reload();
                                });
                            }
                        },'json')
                },
                btn2:function (index,layero) {
                    layer.close(index);
                }
            });

        }else {
            layer.open({
                id:1,
                type: 1,
                title:'确认部署',
                skin:'layui-layer-rim',
                area:['300px', '165px'],
                content: '<div style="margin-top: 22px;margin-left: 8px;">您确定再次部署'+name+"流程吗？</div>"
                ,
                btn:['确定','取消'],
                btn1: function (index,layero) {
                    layer.msg('文件部署中', {
                        icon: 16,
                        time : -1
                    });
                    $.post("/api/bpm/model/deploymentModel",
                        {
                            modelId:id
                        },function (data) {
                            if(data.code==200){
                                layer.msg('部署成功',{time:1000},function () {
                                    location.reload();
                                });
                            }else {
                                layer.msg('部署失败',{time:1000},function () {
                                    location.reload();
                                });
                            }
                        },'json')
                },
                btn2:function (index,layero) {
                    layer.close(index);
                }
            });

        }



	}


    /*删除流程 */
    function deleteDeployMent(id,name) {
        layer.open({
            id:1,
            type: 1,
            title:'确认删除吗',
            skin:'layui-layer-rim',
            area:['300px', '165px'],
            content: '<div style="margin-top: 22px;margin-left: 8px;">您确定删除'+name+"流程吗？</div>"
            ,
            btn:['确定','取消'],
            btn1: function (index,layero) {
                $.post("/api/bpm/model/deleteModel",
                    {
                        modelId:id
                    },function (data) {
                        if(data.code==200){
                            layer.msg('删除成功',{time:1000},function () {
                                location.reload();
                            });
                        }else {
                            layer.msg('删除失败',{time:1000},function () {
                                location.reload();
                            });
                        }
                    },'json')
            },
            btn2:function (index,layero) {
                layer.close(index);
            }
        });
    }

    /*导出流程 */
    function exportDeployMent(id) {
        layer.msg('文件导出中', {
            icon: 16,
            time : 4000
        });
        location.href="/bpm/user/exportDeployMent?modelId="+id
    }

    function getPath(obj) {
        if (obj) {
            if (window.navigator.userAgent.indexOf("MSIE") >= 1) {
                obj.select();
                return document.selection.createRange().text;
            } else if (window.navigator.userAgent.indexOf("Firefox") >= 1) {
                if (obj.files) {
                    return obj.files.item(0).getAsDataURL();
                }
                return obj.value;
            }
            return obj.value;
        }
    }

    /*上传流程 */
    function getPath(obj) {
        if (obj) {
            if (window.navigator.userAgent.indexOf("MSIE") >= 1) {
                obj.select(); return document.selection.createRange().text;
            }
            else if (window.navigator.userAgent.indexOf("Firefox") >= 1) {
                if (obj.files) {
                    return obj.files.item(0).getAsDataURL();
                }
                return obj.value;
            }
            return obj.value;
        }
    }



    function goImport(){
        layer.open({
            type: 2,
            title: '上传文件',
            closeBtn: 1,
            area: ['400px','400px'],
            shade: 0,
            btnAlign: 'c',
            content: "/web/bpm/user/imports",
        });
	}





</script>



