var toolbar_partners = [
    {view: "button", id: "cmd_new_partner", label: "Nuevo", type: "iconButton",
        autowidth: true, icon: "user-plus"},
    {view: "button", id: "cmd_edit_partner", label: "Editar", type: "iconButton",
        autowidth: true, icon: "user"},
    {view: "button", id: "cmd_delete_partner", label: "Eliminar", type: "iconButton",
        autowidth: true, icon: "user-times"},
];


webix.ui.datafilter.rowCount = webix.extend({
    refresh:function(master, node, value){
            node.firstChild.innerHTML = master.count();
    }
}, webix.ui.datafilter.summColumn)

var grid_partners_cols = [
    { id:'index', header:'#', adjust:'data', css:'right', footer:{content:'rowCount'}},
    { id:"id", header:"Clave", width: 75, sort: "int", css: 'right', footer:'Clientes'},
    { id:"cia", header: ["CIA", {content: "textFilter"}], width: 100, sort:"string" },
    { id:"rfc", header: ["RFC", {content: "textFilter"}], width: 150, sort:"string" },
    { id:"name", header: ["Razón Social", {content: "textFilter"}], fillspace:true, sort:"string"},
];


var grid_partners = {
    view: "datatable",
    id: "grid_partners",
    select: "row",
    adjust: true,
    footer: true,
    resizeColumn: true,
    headermenu: true,
    columns: grid_partners_cols,
    on:{
        'data->onStoreUpdated':function(){
            this.data.each(function(obj, i){
                obj.index = i+1;
            })
        }
    },
    //~ onClick:{
        //~ cmd_edit_parter: cmd_edit_partner_click,
    //~ },
}


var controls_fiscales = [
    {cols:[{view:"text", id: "cia", name: "cia", label: "CIA", width: 300, required: true, invalidMessage: "CIA inválido", attributes: {maxlength: 11}},{}]},
    {cols:[{view:"text", id: "rfc", name: "rfc", label: "RFC", width: 300, required: true, invalidMessage: "RFC inválido", attributes: {maxlength: 13}},{}]},
    {view:"text", id: "name", name: "name", label: "Razón Social", required: true, invalidMessage: "La Razón Social es requerida"},
    {view:"text", id: "street", name: "street", label: "Calle"},
    {cols:[{view:"text", id: "num_ext", name: "num_ext", width: 300, label: "No Exterior"},{}]},
    {cols:[{view:"text", id: "num_int", name: "num_int", width: 300, label: "No Interior"},{}]},
    {cols:[{view:"search", id: "postal_code", name: "postal_code", width: 300, label: "C.P.", attributes: {maxlength: 5}},{}]},
    {view:"text", id: "colonia", name: "colonia", label: "Colonia"},
    {view:"text", id: "municipio", name: "municipio", label: "Municipio"},
    {view:"search", id: "state", name: "state", label: "Estado"},
    {view:"text", id:"country", name:"country", label: "País", value: "México"},
    {template:"Contacto", type:"section"},
    {view:"text", id: "contact", name: "contact", label: "Nombre"},
    {view:"text", id: "email", name: "email", label: "Correo"},
    {view:"text", id: "phone", name: "phone", label: "Teléfono"},
]


var controls_partner = [
    {
        view: "tabview",
        tabbar: {options: ["Datos Fiscales"]}, animate: true,
        cells: [
            {id: "Datos Fiscales", rows: controls_fiscales},
        ]
    },
    {rows: [
        { template:"", type: "section" },
        { margin: 10, cols: [{},
            {view: "button", id: "cmd_save_partner", label: "Guardar" , type: "form", autowidth: true, align:"center"},
            {view: "button", id: "cmd_cancel_partner", label: "Cancelar" , type: "danger", autowidth: true, align:"center"},
            {}]
        },
    ]}
];


var form_partner = {
    type: "space",
    cols: [{
        view: "form",
        id: "form_partner",
        //~ width: 600,
        complexData: true,
        elements: controls_partner,
        elementsConfig: {
            labelWidth: 130,
            labelAlign: "right"
        },
        autoheight: true,
        rules: {
            cia: function(value){ return value.trim() != ""; },
            name: function(value){ return value.trim() != ""; },
            rfc: validate_rfc,
        }
    }]
};


var multi_partners = {
    id: "multi_partners",
    animate: true,
    cells:[
        {id: "partners_home", rows:[
            {view:"toolbar", elements: toolbar_partners},
            grid_partners,
        ]},
        {id: "partners_new", rows:[form_partner, {}]}
    ]
};


var app_partners = {
    id: "app_partners",
    rows:[
        {view: "template", id: "th_partner", type: "header", template:"Administración de Clientes" },
        multi_partners
    ]
};