Proyectos de Subversion LeadersLinked - Backend

Rev

Rev 4904 | Rev 4906 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
4814 stevensc 1 
import axios from 'axios'
4841 stevensc 2 
import React, { useEffect, useState } from 'react'
4799 stevensc 3 
 
4827 stevensc 4 
const CompanySizesView = ({ urlsVar }) => {
4814 stevensc 5 
 
4841 stevensc 6 
    const { linkTable, linkAdd, linkEdit, linkDelete } = urlsVar
4905 stevensc 7 
    const [companyData, setCompanyData] = useState({});
4881 stevensc 8 
    const [search, setSearch] = useState('');
9 
    const [dataLength, setDataLength] = useState(10);
10 
    const [page, setPage] = useState(1);
11 
    const lengthValues = ["10", "25", "50", "100"]
4827 stevensc 12 
 
4841 stevensc 13 
    const getData = () => {
4881 stevensc 14 
        axios.get(
15 
            linkTable,
16 
            {
17 
                params: {
18 
                    page: page,
4904 stevensc 19 
                    length: dataLength
4881 stevensc 20 
                }
21 
            })
4841 stevensc 22 
            .then(({ data }) => {
23 
                if (data.success) {
24 
                    setCompanyData(data.data)
4830 stevensc 25 
 
4841 stevensc 26 
                    return data.data
27 
                }
28 
            })
29 
            .catch((err) => console.log(err))
4814 stevensc 30 
    }
31 
 
4827 stevensc 32 
    useEffect(() => {
4841 stevensc 33 
        getData()
4881 stevensc 34 
        console.log(companyData)
35 
    }, [search, dataLength, page]);
4814 stevensc 36 
 
4799 stevensc 37 
    return (
4881 stevensc 38 
        <section className="content">
39 
            <section className="content-header">
40 
                <div className="container-fluid">
41 
                    <div className="row mb-2">
42 
                        <div className="col-sm-12">
43 
                            <h1>Tamaños de empresa</h1>
44 
                        </div>
45 
                    </div>
46 
                </div>
47 
            </section>
48 
            <section className="content">
49 
                <div className="container-fluid">
50 
                    <div className="row">
51 
                        <div className="col-12">
52 
                            <div className="card">
53 
                                <div className="card-body">
4895 stevensc 54 
                                    <div className="dataTables_wrapper dt-bootstrap4 no-footer">
4881 stevensc 55 
                                        <div className="row">
56 
                                            <div className="col-sm-12 col-md-6">
57 
                                                <div className="dataTables_length" id="gridTable_length">
58 
                                                    <label>
59 
                                                        Mostrar
60 
                                                        <select
61 
                                                            className="custom-select custom-select-sm form-control form-control-sm"
62 
                                                            onChange={(e) => setDataLength(e.target.value)}
63 
                                                        >
64 
                                                            {
65 
                                                                lengthValues.map((value, index) => (
66 
                                                                    <option key={index} value={value}>{value}</option>
67 
                                                                ))
68 
                                                            }
69 
                                                        </select>
70 
                                                        registros
71 
                                                    </label>
72 
                                                </div>
73 
                                            </div>
74 
                                            <div className="col-sm-12 col-md-6">
4895 stevensc 75 
                                                <div className="dataTables_filter">
4881 stevensc 76 
                                                    <label>
77 
                                                        Buscar
78 
                                                        <input
79 
                                                            type="search"
80 
                                                            className="form-control form-control-sm" placeholder=""
81 
                                                            onChange={(e) => setSearch(e.target.value)}
82 
                                                        />
83 
                                                    </label>
84 
                                                </div>
85 
                                            </div>
86 
                                        </div>
4905 stevensc 87 
                                        <div className="row">
4891 stevensc 88 
                                            <div className="col-sm-12">
4890 stevensc 89 
                                                <table
4891 stevensc 90 
                                                    className="table table-hover dataTable no-footer dtr-inline" role="grid"
4890 stevensc 91 
                                                    aria-describedby="gridTable_info"
92 
                                                >
93 
                                                    <thead>
94 
                                                        <tr role="row">
95 
                                                            <th
4891 stevensc 96 
                                                                className="text-vertical-middle sorting sorting_asc"
4895 stevensc 97 
                                                                aria-sort="ascending"
4890 stevensc 98 
                                                            >
99 
                                                                Nombre
100 
                                                            </th>
4895 stevensc 101 
                                                            <th
4891 stevensc 102 
                                                                className="text-right text-vertical-middle sorting"
4895 stevensc 103 
                                                                aria-sort="ascending"
4890 stevensc 104 
                                                            >
105 
                                                                Mínimo
4895 stevensc 106 
                                                            </th>
4890 stevensc 107 
                                                        </tr>
108 
                                                    </thead>
4901 stevensc 109 
                                                    <tbody>
110 
                                                        {
111 
                                                            companyData.items
112 
                                                            &&
113 
                                                            companyData.items.map((item, index) => (
114 
                                                                <tr key={item.id}>
115 
                                                                    <td
116 
                                                                        className="text-vertical-middle sorting_1 dtr-control">
117 
                                                                        {item.name}
118 
                                                                    </td>
119 
                                                                    <td
120 
                                                                        className="text-vertical-middle sorting_1 dtr-control">
121 
                                                                        {item.minimum_no_of_employee}
122 
                                                                    </td>
123 
                                                                    <td className=" text-right text-vertical-middle">
124 
                                                                        {item.maximum_no_of_employee}
125 
                                                                    </td>
126 
                                                                    <td className=" text-center">
127 
                                                                        {
128 
                                                                            item.status === 'a'
129 
                                                                                ? <i className='fa fa-check' />
130 
                                                                                : <i className='fa fa-xmark' />
131 
                                                                        }
132 
                                                                    </td>
133 
                                                                    <td>
134 
                                                                        <button className="btn btn-primary btn-edit">
135 
                                                                            <a href={item.actions.link_delete}>
136 
                                                                                <i className="fa fa-pencil" />
137 
                                                                                Editar
138 
                                                                            </a>
139 
                                                                        </button>
140 
                                                                        <button className="btn btn-danger btn-delete">
141 
                                                                            <a href={item.actions.link_edit}>
142 
                                                                                <i className="fa fa-trash" />
143 
                                                                                Borrar
144 
                                                                            </a>
145 
                                                                        </button>
146 
                                                                    </td>
147 
                                                                </tr>
148 
                                                            ))
149 
                                                        }
150 
                                                    </tbody>
4890 stevensc 151 
                                                </table>
152 
                                            </div>
4905 stevensc 153 
                                        </div>
4881 stevensc 154 
                                    </div>
155 
                                </div>
156 
                            </div>
157 
                        </div>
158 
                    </div>
159 
                </div>
160 
            </section>
161 
        </section>
4799 stevensc 162 
    )
163 
}
164 
 
165 
export default CompanySizesView