longping
/
subject_gxj


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309
							<%--
  Created by IntelliJ IDEA.
  User: WangC
  Date: 2025/1/6
  Time: 15:50
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>项目转换统计页面</title>
    <jsp:include page="../common/common-meta-include.jsp"></jsp:include>
    <%-- <jsp:include page="../common/common-css-include.jsp"></jsp:include> --%>
    <link rel="stylesheet" type="text/css" href="${WebSite.asset}/lib/layui-v2.5.5/css/layui.css?version=${version}" media="all" />
    <link rel="stylesheet" type="text/css" href="${WebSite.asset}/lib/layui-v2.5.5/css/public.css?version=${version}" media="all" />
    <link rel="stylesheet" type="text/css" href="${WebSite.asset}/lib/layui-v2.6.5/css/layui.css?version=${version}" media="all" />
    <link rel="stylesheet" type="text/css" href="${WebSite.asset}/css/style.css?version=${version}" media="all" />

    <style>
        .table_box .pagination-box {
            display: flex;
            justify-content: center;
            width: 100%;
        }
        .layui-table-view .layui-table td >div{
            line-height: 20px !important;
            white-space: normal;
        }
    </style>
</head>
<body>
<div id="app">
    <template id="template">
        <div class="layui-layout layui-layout-admin">
            <div class="right_title">
                <span class="txt">项目转化统计</span>
                <div class="layui-collapse">
                    <div class="layui-colla-item">
                        <%--                    <h2 class="layui-colla-title">筛选</h2>--%>
                        <div class="layui-colla-content layui-show">
                            <form class="layui-form" lay-filter="searchForm">
                                <div class="layui-row">
                                    <div class="layui-col-xs6 layui-col-sm6 layui-col-md3">
                                        <div class="layui-form-item">
                                            <label class="layui-form-label">状态</label>
                                            <div class="layui-input-block">
                                                <select lay-verify="required" name="status" lay-filter="status" id="status" v-model="junit.status">
                                                    <option value="">所有</option>
                                                    <option value="2">逆转</option>
                                                    <option value="1">正转</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="layui-col-xs6 layui-col-sm6 layui-col-md4">
                                        <div class="layui-form-item">
                                            <label class="layui-form-label">月报期间</label>
                                            <div class="layui-input-block" style="width: fit-content;">
                                                <input type="text" id="startDate" name="startDate" style="float: left;width: 120px"
                                                       placeholder="请选择开始时间" autocomplete="off" class="layui-input" value="${startDate}"> -
                                                <input type="text" id="endDate" name="endDate" style="float: right;width: 120px"
                                                       placeholder="请选择结束时间" autocomplete="off" class="layui-input" value="${endDate}">
                                            </div>
                                        </div>
                                    </div>

                                    <div class="layui-col-xs6 layui-col-sm6 layui-col-md3">
                                        <button type="button" class="layui-btn layui-btn-normal" @click="search()">查询</button>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
            <div class="table_box" style="padding-top: 0;">
                <div class="table_process">
                    <table id="table1" lay-filter="test"></table>
                    <div class="pagination-box" id="pagination"></div>
                </div>
            </div>
        </div>
    </template>
</div>

<script type="text/html" id="currentTableBar">
    <div class="toolBar">
        <span lay-event="toDetail">明细</span>
    </div>
</script>

<jsp:include page="../common/common-js-include.jsp"></jsp:include>

<script type="text/javascript">
    new Vue({
        el: "#app",
        template: "#template",
        data: {
            winH: 0,
            dataList: [],
            junit: {},
            tableName: 'test',
            pageNo: 1,
            pageSize: 10
        },
        mounted: function () {
            this.init();
        },
        methods: {
            init: function () {
                layui.laydate.render({
                    elem: '#startDate',
                    theme: layDateTheme,
                    type: 'month',  // 设置为选择月份
                    format: 'yyyy-MM',  // 设置显示格式为年-月
                });
                layui.laydate.render({
                    elem: '#endDate',
                    theme: layDateTheme,
                    type: 'month',  // 设置为选择月份
                    format: 'yyyy-MM',  // 设置显示格式为年-月
                });
                this.getData();
            },
            loadPage: function (totalCount) {
                var self = this;
                layui.laypage.render({
                    elem: 'pagination',
                    count: totalCount,
                    curr: self.pageNo,
                    limit: self.pageSize,
                    layout: ['count', 'prev', 'page', 'next', 'skip'],
                    jump: function (obj, first) {
                        //首次不执行
                        if (!first) {
                            self.pageNo = obj.curr;
                            self.getData();
                        }
                    }
                });
            },
            getData: function () {
                var self = this;
                var param = layui.form.getValue("searchForm");
                param.pageNo = this.pageNo;
                param.pageSize = this.pageSize;
                App.postJson("/api/tzfx/getXmzhtjData", param, function (res) {
                    self.dataList = res.rows;
                    self.loadPage(res.total);
                    self.loadTable();
                });
            },
            search: function () {
                var param = layui.form.getValue("searchForm");
                this.pageNo = 1;
                param.pageNo = this.pageNo;
                param.pageSize = this.pageSize;
                var self = this;
                App.postJson("/api/tzfx/getXmzhtjData", param, function (res) {
                    self.dataList = res.rows;
                    self.loadPage(res.total);
                    self.loadTable();
                });
            },
            loadTable: function () {
                var self = this;
                layui.table.render({
                    elem: '#table1', // 指定原始表格元素选择器（推荐id选择器）
                    even: true,
                    cols: [[ // 设置表头
                        { type: 'numbers',  width: 80,title:'序号' },
                        {field: 'projectDate', title: '月', minWidth: 200},
                        {
                            field: 'kind',
                            title: '类型',
                            minWidth: 200,
                            templet: function (row) {
                                // 判断 kind 的值，进行转换
                                return row.kind === '1' ? '正转' : (row.kind === '2' ? '逆转' : '未知');
                            }
                        },
                        { field: 'title', title: '说明', minWidth: 200 },
                        { field: 'number', title: '数量', minWidth: 200 },
                        { title: '操作', width: 100, align: 'center', toolbar: '#currentTableBar', fixed: 'right' }
                    ]],
                    data: self.dataList,
                    done:function(res, curr, count) {
                        $('tr').css({ 'border': 'none' })
                        $(".layui-table-main tr").each(function (index, val) {
                            $($(".layui-table-fixed-l .layui-table-body tbody tr")[index]).height($(val).height());
                            $($(".layui-table-fixed-r .layui-table-body tbody tr")[index]).height($(val).height());
                        })
                    }
                });
                layui.table.on('tool(' + this.tableName + ')', function (obj) {
                    var event = obj.event;
                    self[event].call(this, obj);
                });
            },
            loadTable_1: function () {
                var self = this;
                layui.table.render({
                    elem: '#table1', // 指定原始表格元素选择器（推荐id选择器）
                    even: true,
                    cols: [[ // 设置表头
                        { type: 'numbers', fixed: 'left', align: '5%',title:'序号' , width: 44},
                        {
                            field: 'title', title: '单位名称', width: '15%', templet: function (row) {
                                if (row.title != null) {
                                    return '<span title="' + row.title + '">' + row.title + '</span>';
                                }
                                return ""
                            }
                        },
                        { field: 'status', title: '状态', width: '7%' },
                        {
                            field: 'area', title: '所在区县', width: '8%', templet: function (row) {
                                if (row.area != null) {
                                    return '<span title="' + row.area + '">' + row.area + '</span>';
                                }
                                return ""
                            }
                        },
                        { field: 'dateFound', title: '成立日期', width: '9%' },
                        { field: 'amt', title: '注册资金', width: '8%' },
                        { field: 'unitPropName', title: '单位性质', width: '8%' },
                        { field: 'unitKindName', title: '单位类型', width: '8%' },
                        { field: 'nameJur1', title: '法人', width: '7%' },
                        { field: 'simCode', title: '联系电话', width: '10%' },
                        {
                            field: 'reason', title: '退回原因', width: '10%', templet: function (row) {
                                if (row.reason != null) {
                                    return '<span title="' + row.reason + '">' + row.reason + '</span>';
                                }
                                return "";
                            }
                        },
                        { title: '操作', width: '6%', align: 'center', toolbar: '#currentTableBar2' }
                    ]],
                    data: self.dataList,
                    /*        done:function (res,curr,count){
                           $('tr').css({'background-color':'#ECEDFF','border':'none'})
                         } */
                });
                layui.table.on('tool(' + this.tableName + ')', function (obj) {
                    var event = obj.event;
                    self[event].call(this, obj);
                });
            },
            loadTable1: function () {
                var self = this;
                layui.table.render({
                    elem: '#table1', // 指定原始表格元素选择器（推荐id选择器）
                    even: true,
                    cols: [[ // 设置表头
                        { type: 'numbers', fixed: 'left', align: '5%',title:'序号' , width: 44},
                        {
                            field: 'title', title: '单位名称', width: '15%', templet: function (row) {
                                if (row.title != null) {
                                    return '<span title="' + row.title + '">' + row.title + '</span>';
                                }
                                return ""
                            }
                        },
                        { field: 'status', title: '状态', width: '7%' },
                        {
                            field: 'area', title: '所在区县', width: '8%', templet: function (row) {
                                if (row.area != null) {
                                    return '<span title="' + row.area + '">' + row.area + '</span>';
                                }
                                return ""
                            }
                        },
                        { field: 'dateFound', title: '成立日期', width: '9%' },
                        { field: 'amt', title: '注册资金', width: '8%' },
                        { field: 'unitPropName', title: '单位性质', width: '8%' },
                        { field: 'unitKindName', title: '单位类型', width: '8%' },
                        { field: 'nameJur1', title: '法人', width: '7%' },
                        { field: 'simCode', title: '联系电话', width: '10%' },
                        {
                            field: 'reason', title: '退回原因', width: '10%', templet: function (row) {
                                if (row.reason != null) {
                                    return '<span title="' + row.reason + '">' + row.reason + '</span>';
                                }
                                return "";
                            }
                        },
                        { title: '操作', width: '6%', align: 'center', toolbar: '#currentTableBar1' }
                    ]],
                    data: self.dataList,
                });
                layui.table.on('tool(' + this.tableName + ')', function (obj) {
                    var event = obj.event;
                    self[event].call(this, obj);
                });
            },
            toDetail: function (obj) {
                console.log("当前数据：",obj.data)
                App.openLayer({
                    title: "项目转换统计详情",
                    content: App.getUrl("/tjfx/xmzhtjDetail?kind=" + obj.data.kind + "&title=" + obj.data.title + "&projectDate=" + obj.data.projectDate),
                });
            }
        }
    });
</script>
</body>
</html>