reservoirlist.js 11.3 KB
define(['jquery', 'bootstrap', 'backend', 'table', 'form', 'template', 'echarts', 'echarts-theme'], function ($, undefined, Backend, Table, Form, Template, Echarts) {

    var Controller = {
        index: function () {
            // 初始化表格参数配置
            Table.api.init({
                extend: {
                    index_url: 'reservoir/reservoirlist/index' + location.search,
                    add_url: 'reservoir/reservoirlist/add',
                    edit_url: 'reservoir/reservoirlist/edit',
                    del_url: 'reservoir/reservoirlist/del',
                    multi_url: 'reservoir/reservoirlist/multi',
                    import_url: 'reservoir/reservoirlist/import',
                    table: 'reservoir_list',
                }
            });

            var table = $("#table");

            // 初始化表格
            table.bootstrapTable({
                url: $.fn.bootstrapTable.defaults.extend.index_url,
                pk: 'id',
                sortName: 'id',
                fixedColumns:true,//固定列代码
                fixedRightNumber:1,//固定右侧第1列
                fixedNumber:2,//固定左侧2列
                columns: [
                    [
                        {checkbox: true},
                        {field: 'id', title: __('Id')},
                        {field: 'inspectiondepart.depart_name', title: __('Depart_name'),operate:false, formatter: Table.api.formatter.label},
                        {field: 'name', title: __('Name'), operate: 'LIKE'},
                        {field: 'thumbnail_images', title: __('Thumbnail_images'), operate: false, events: Table.api.events.image, formatter: Table.api.formatter.images},
                        {field: 'general_view_picture', title: __('General_view_picture'), operate: false, events: Table.api.events.image, formatter: Table.api.formatter.image},
                        {field: 'rain_bg_image', title: __('Rain_bg_image'), operate: false, events: Table.api.events.image, formatter: Table.api.formatter.image},
                        //{field: 'desc', title: __('Desc'), operate: 'LIKE'},
                        {field: 'address', title: __('Address'), operate: 'LIKE'},
                        //{field: 'reservoirprovince.name', title: __('Province_id'), operate: 'LIKE'},
                        //{field: 'reservoirstate.name', title: __('State_id'), operate: 'LIKE'},
                        //{field: 'reservoircounty.name', title: __('County_id'), operate: 'LIKE'},
                        // {field: 'lat', title: __('Lat'), operate: 'LIKE'},
                        // {field: 'lng', title: __('Lng'), operate: 'LIKE'},
                        // {field: 'user_id', title: __('User_id')},
                        // {field: 'user_mobile', title: __('User_mobile'), operate: 'LIKE'},
                        // {field: 'province_id', title: __('Province_id')},
                        // {field: 'state_id', title: __('State_id')},
                        // {field: 'county_id', title: __('County_id')},
                        {field: 'under', title: __('Under'), operate:'BETWEEN'},
                        {field: 'normal_water_level', title: __('Normal_water_level'), operate: 'LIKE'},
                        //{field: 'warning_water_level', title: __('Warning_water_level'), operate: 'LIKE'},
                        {field: 'dead_water_level', title: __('Dead_water_level'), operate: 'LIKE'},
                        {field: 'buildtime', title: __('Buildtime'), operate:'RANGE', addclass:'datetimerange', autocomplete:false, formatter: Table.api.formatter.datetime},
                        {field: 'completetime', title: __('Completetime'), operate:'RANGE', addclass:'datetimerange', autocomplete:false, formatter: Table.api.formatter.datetime},
                        {field: 'reconstructiontime', title: __('Reconstructiontime'), operate:'RANGE', addclass:'datetimerange', autocomplete:false, formatter: Table.api.formatter.datetime},
                        {field: 'construction_unit', title: __('Construction_unit'), operate: 'LIKE'},
                        {field: 'design_unit', title: __('Design_unit'), operate: 'LIKE'},
                        {field: 'probation_unit', title: __('Probation_unit'), operate: 'LIKE'},
                        {field: 'investment', title: __('Investment'), operate:'BETWEEN'},
                        {field: 'reservoir_level', title: __('Reservoir_level'), operate: 'LIKE'},

                        //{field: 'main_function', title: __('Main_function'), operate: 'LIKE'},
                        // {field: 'user.username', title: __('User.username'), operate: 'LIKE'},
                        // {field: 'reservoircounty.name', title: __('Reservoircounty.name'), operate: 'LIKE'},
                        // {field: 'reservoirstate.name', title: __('Reservoirstate.name'), operate: 'LIKE'},
                        // {field: 'reservoirprovince.name', title: __('Reservoirprovince.name'), operate: 'LIKE'},
                        {
                            field: 'operate',
                            title: __('Operate'),
                            table: table,
                            events: Table.api.events.operate,
                            buttons:[
                                {
                                    name: 'provincial_office_token',
                                    text:"省平台参数配置",
                                    title: function (row) {
                                        return "("+row.name +")省平台配置"
                                    },
                                    extend:'data-area=["65%","65%"]',
                                    classname: 'btn btn-xs btn-info btn-dialog',
                                    icon: 'fa fa-facebook-official',
                                    url: 'reservoir_provincial_office_token/detail?reservoir_id={id}'
                                },

                                {
                                    name: 'capacityof_echarts',
                                    text:"库容曲线图",
                                    title: function (row) {
                                        return "("+row.name +")库容曲线图"
                                    },
                                    extend:'data-area=["94%","94%"]',
                                    classname: 'btn btn-xs btn-warning btn-dialog',
                                    icon: 'fa fa-line-chart',
                                    url: 'reservoir/reservoirlist/capacityof?reservoir_id={id}'
                                }
                            ],
                            formatter: Table.api.formatter.operate
                        }
                    ]
                ]
            });



            // 为表格绑定事件
            Table.api.bindevent(table);

            $('#table').on('click',".jump",function(e){
                var that = this;
                var options = $.extend({}, $(that).data() || {});
                var row = {};
                if (typeof options.tableId !== 'undefined') {
                    var index = parseInt(options.rowIndex);
                    var data = $("#" + options.tableId).bootstrapTable('getData');
                    row = typeof data[index] !== 'undefined' ? data[index] : {};
                }
                window.open(window.location.protocol+'//'+window.location.hostname+'/dist/#/?id='+row.id);
                return false;
            })
        },
        add: function () {
            $("#c-province_id").on("change",function(){
                $("#c-state_id").selectPageClear();
            });
            $("#c-state_id").on("change",function(){
                $("#c-county_id").selectPageClear();
            });
            $("#c-state_id").data("params", function (obj) {
                return {custom: {province_id: $("#c-province_id").val()}};
            });
            $("#c-county_id").data("params", function (obj) {
                return {custom: {state_id: $("#c-state_id").val()}};
            });
            Controller.api.bindevent();
        },
        edit: function () {
            $("#c-province_id").on("change",function(){
                $("#c-state_id").selectPageClear();
            });
            $("#c-state_id").on("change",function(){
                $("#c-county_id").selectPageClear();
            });
            $("#c-state_id").data("params", function (obj) {
                return {custom: {province_id: $("#c-province_id").val()}};
            });
            $("#c-county_id").data("params", function (obj) {
                return {custom: {state_id: $("#c-state_id").val()}};
            });
            Controller.api.bindevent();
        },
        capacityof:function(){
            //这句话在多选项卡统计表时必须存在,否则会导致影响的图表宽度不正确
            $(document).on("click", ".charts-custom a[data-toggle=\"tab\"]", function () {
                var that = this;
                setTimeout(function () {
                    var id = $(that).attr("href");
                    var chart = Echarts.getInstanceByDom($(id)[0]);
                    chart.resize();
                }, 0);
            });
            // 基于准备好的dom,初始化echarts实例
            var lineChart = Echarts.init(document.getElementById('line-chart'), 'walden');

            // 指定图表的配置项和数据
            var option = {
                xAxis: {
                    name:"水位/m",
                    type: 'category',
                    data: Config.warterdata //['周一', '周二', '周三', '周四', '周五', '周六', '周日']
                },
                tooltip: {
                    show: true,
                    trigger: 'axis',
                    axisPointer: {
                        type: 'line',
                        axis: 'auto',
                        snap: true // 坐标轴指示器是否自动吸附到点上
                    },
                    renderMode: 'html',
                    backgroundColor: 'rgba(255,255,255,0.7)',
                    borderColor: '#333',
                    borderWidth: 0,
                    padding: 5,
                    textStyle: {
                        color: '#333',
                        fontStyle: 'normal',
                        fontWeight: 'normal',
                        fontFamily: 'sans-serif',
                        fontSize: 12
                    },
                    extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);',
                    confine: false,
                    formatter: function(arg) {
                        return "水位:"+arg[0].name+'m'+ '<br />'+ '库容:' + arg[0].data + '万立方米'
                    }
                },
                yAxis: {
                    name:"库容/万方",
                    type: 'value'
                },
                series: [{
                    data: Config.capacityOf, //[49, 92, 61, 134, 90, 130, 120],
                    type: 'line',
                    smooth: true
                }]
            };

            // 使用刚指定的配置项和数据显示图表。
            lineChart.setOption(option);

            Controller.api.bindevent();
        },
        api: {
            bindevent: function () {
                Form.api.bindevent($("form[role=form]"));
            }
        }
    };
    return Controller;
});