Crea rol basado en Operador y App Tipo Cargo

src/layouts/Sidebar.svelte

@@ -96,6 +96,13 @@
                 <span class="align-middle">Roles</span>
             </SideLink>
 
+            <li class="sidebar-header">Funcionarios-Contratos</li>
+
+            <SideLink to="/tipo-cargo">
+                <i class="align-middle bi bi-person-badge" />
+                <span class="align-middle">Cargos</span>
+            </SideLink>
+
         </ul>
 
     </div>

src/pages/operadores/ModalOperador.svelte

@@ -6,6 +6,18 @@
         updateOperador,
         deleteOperador,
     } from "$/services/operadores";
+    import {        
+        createRol       
+    }
+    from  "$/services/roles";
+    import {       
+        createRolOperador
+    }
+    from  "$/services/roles_operadores";
+    import {       
+        createRolyaplicacion
+    }
+    from  "$/services/roles_aplicaciones";
     import { createEventDispatcher } from "svelte";
     import TabOperador from "./TabOperador.svelte";
     import "./modal.css";
@@ -20,6 +32,7 @@
     let loading = false;
     let tab = 0;
 
+
     $: tab === 0 && begin(operador.id_operador);
     $: tab === 1 && fetchLineas()
 
@@ -35,7 +48,7 @@
     async function fetchLineas() {
         try {
             lineas = []
-            const data = await getLineas({ ordering: 'route_long_name' })
+            const data = await getLineas({ vigente:true, ordering: 'route_long_name' })
             lineas = data.filter(linea => 
             linea.id_operador === operador.id_operador || linea.id_operador === null
             );
@@ -49,14 +62,32 @@
         }
     }
 
+
     async function onSave() {
+       let formRol={}; 
         try {
             loading = true;
             if (operador.id_operador) {
                 form = await updateOperador(form);
             } else {
+                
+                formRol.nombre_rol=form.nombre_operador;
+                formRol = await createRol(formRol);
+                form.id_rol = formRol.id_rol    
                 form = await createOperador(form);                
+                formRol= await createRolOperador(form);
+
+                formRol={};
+                formRol.id_rol = form.id_rol;
+                formRol.id_aplicacion=1;
+                formRol = await createRolyaplicacion(formRol);
+
+                formRol.id_aplicacion=2;
+                formRol = await createRolyaplicacion(formRol);
+
+
             }
+            
             globalThis.toast.success("Se ha guardado el Operador");
             dispatch("refresh");
             dispatch("close");
@@ -83,6 +114,7 @@
     }
 
     async function onSaveLineas() {
+        
         try {
             loading = true;
             

src/pages/tipo_cargo/Admin.svelte

@@ -0,0 +1,122 @@
+<script>
+    import Paginate from "$/components/Paginate.svelte";
+    import { getTipoCargo } from "$/services/tipo_cargo";
+    import PageTitle from "$/components/PageTitle.svelte";
+    import ModalTipoCargo from "./ModalTipoCargo.svelte";
+    import { useLocation } from "svelte-navigator";
+    import { getPermisosPath } from "$/services/usuarios";
+
+    const limit = 15;
+    let page = 1;
+    let offset = 0;
+    let count = 0;
+    let ordering = 'descripcion'
+    let redes = []
+    let cargo= null
+    let loading = false;
+    let escritura = false;
+    let location = useLocation()
+
+    getPermisosPath($location.pathname)
+        .then(data => escritura = data.escritura)
+        .catch(error => console.log({ error }))
+
+    $: onPage(page)
+
+    async function onPage(p) {
+        try {
+            loading = true
+            offset = (p - 1) * limit;
+            const data = await getTipoCargo({ offset, limit, ordering })
+          
+            redes = data.results;
+            count = data.count;
+        } catch (error) {
+            globalThis.toast.error(error)
+        } finally {
+            loading = false;
+        }
+    }
+
+    function onEdita(item) {
+        cargo= item;
+    }
+
+    function onNuevo() {
+        cargo= {}
+    }
+
+    function onOrderBy(field) {
+        ordering = ordering === field ? '-' + field : field;
+        onPage(page)
+    }
+</script>
+
+<PageTitle {loading}>Tipos de Cargos</PageTitle>
+
+<div class="card">
+    <div class="card-header">
+        {#if escritura}
+            <button class="btn btn-primary" on:click|preventDefault={onNuevo}>
+                <i class="bi bi-plus-lg"></i> Nuevo
+            </button>
+        {/if}
+    </div>
+    <div class="card-body">
+        <div class="table-responsive">
+            <table class="table table-sm table-bordered">
+                <thead>
+                    <tr class="table-light">
+                        <th style="width: 5%">Nro</th>
+                        <th style="width: 5%">
+                            <a href={"#"} on:click|preventDefault={() => onOrderBy('id_cargo')}>ID</a>
+                            {#if ordering === 'id_cargo'}<i class="bi bi-caret-up-fill"></i>{/if}
+                            {#if ordering === '-id_cargo'}<i class="bi bi-caret-down-fill"></i>{/if}
+                        </th>
+                        <th>
+                            <a href={"#"} on:click|preventDefault={() => onOrderBy('descripcion')}>Descripcion</a>
+                            {#if ordering === 'descripcion'}<i class="bi bi-caret-up-fill"></i>{/if}
+                            {#if ordering === '-descripcion'}<i class="bi bi-caret-down-fill"></i>{/if}
+                        </th>
+                    </tr>
+                </thead>
+                <tbody>
+                    {#each redes as app, index}
+                    <tr>
+                        <td class="table-light">{offset + index + 1}</td>
+                        <td>{app.id_cargo}</td>
+                        <td><a href={"#"} on:click|preventDefault={() => onEdita(app)}>{app.descripcion}</a></td>
+                             
+                    </tr>
+                    {/each}
+                </tbody>
+            </table>
+        </div>
+    </div>
+    <div class="card-footer d-flex">
+        <a href={"#"} class="btn btn-outline-secondary me-3" on:click|preventDefault={() => onPage(page)}>
+            <i class="bi bi-arrow-repeat"></i>
+        </a>
+        <Paginate
+            forcePage={page}
+            {limit}
+            {count}
+            on:page={ev => page = ev.detail}
+        />
+    </div>
+</div>
+
+{#if cargo}
+    <ModalTipoCargo
+    {cargo}
+    {escritura}
+    on:close={() => cargo= null}
+    on:refresh={() => onPage(page)}
+    />    
+{/if}
+
+<style>
+    .table-responsive {
+        max-height: calc(100vh - 300px);
+    }
+</style>

src/pages/tipo_cargo/ModalTipoCargo.svelte

@@ -0,0 +1,94 @@
+<script>
+    import Modal from "../../components/Modal.svelte";
+    import { getTipoCargo, createTipoCargo, updateTipoCargo, deleteTipoCargo,  getTipoCargoId } from "$/services/tipo_cargo";
+    import { createEventDispatcher } from "svelte";
+    const dispatch = createEventDispatcher();
+
+    export let cargo = {};
+    export let escritura = false;
+    let form = {}
+    let loading = false;
+
+    $: begin(cargo.id_cargo)
+
+    async function begin(id) {
+        try {
+            if (!id) return;
+            form = await getTipoCargoId(id) || {}
+        } catch (error) {
+            globalThis.toast.success(error.detail || error)
+        }
+    }
+
+    async function onSave() {
+        try {
+           
+            loading = true;
+            if (cargo.id_cargo) {
+                form = await updateTipoCargo(form)
+            } else {
+                form = await createTipoCargo(form)
+            }
+            globalThis.toast.success('Se ha guardado el Tipo de Cargo')
+            dispatch('refresh')
+            dispatch('close')
+        } catch (error) {
+            if (error.detail) {
+                globalThis.toast.success(error.detail)
+            } else {
+                globalThis.toast.success(JSON.stringify(error))
+            }
+        } finally {
+            loading = false;
+        }
+    }
+
+    async function onDelete() {
+        try {
+            if (!confirm('Eliminará el registro?')) return;
+            loading = true;
+            await deleteTipoCargo(form.id_cargo)
+            globalThis.toast.success('Se ha eliminado el Tipo de Cargo')
+            dispatch('refresh')
+            dispatch('close')
+        } catch (error) {
+            globalThis.toast.error(error.detail || error)
+        } finally {
+            loading = false;
+        }
+    }
+</script>
+
+<form action="" on:submit|preventDefault={onSave}>
+    <Modal title={'Tipo de Cargo #' + (cargo.id_cargo || 'Nuevo')}
+        size="lg"
+        on:close={() => dispatch('close')}>
+        <div class={"form" + (escritura ? '' : ' disabled')}>
+            <div class="row mb-3">
+                <div class="col-md-3">ID</div>
+                <div class="col-md">
+                   
+                        <input type="number" value={form.id_cargo} disabled class="form-control">
+                   
+                </div>
+            </div>           
+            <div class="mb-3">
+                <div class="col-md-3">Descripcion</div>
+                <div class="col-md">
+                    <input type="text" bind:value={form.descripcion}   class="form-control">
+                </div>
+            </div> 
+               
+        </div>
+        <svelte:fragment slot="buttons">
+            {#if escritura}
+                <button class="btn btn-primary"type="submit" disabled={loading}>Guardar</button>
+                <button class="btn btn-danger" on:click|preventDefault={onDelete} disabled={loading}>Eliminar</button>
+            {/if}
+        </svelte:fragment>
+    </Modal>
+</form>
+
+<style>
+    .disabled { pointer-events: none !important; }
+</style>

src/routes/user.routes.js

@@ -20,6 +20,7 @@ import PageParaderos from '$/pages/paraderos/Home.svelte'
 import PageRutas from "$/pages/rutas/Home.svelte";
 import { getPermisosApp } from '$/services/usuarios'
 import { storePermisos } from '$/stores/global'
+import PageTipoCargo from '$/pages/tipo_cargo/Admin.svelte'
 
 export const routes_base = [
     { path: '/', component: PageHome, public: true },
@@ -41,6 +42,7 @@ export const routes_base = [
     { path: '/mapas/rutas', component: PageMapaRutas },
     { path: '/paraderos', component: PageParaderos },
     { path: '/rutas', component: PageRutas },
+    { path: '/tipo-cargo', component: PageTipoCargo },
     { path: '*', component: PageError, public: true },
 ];
 

src/services/tipo_cargo.js

@@ -0,0 +1,47 @@
+import { base, getToken } from './_config'
+
+export async function getTipoCargo(params) {
+    const query = !params ? '' : '?' + (new URLSearchParams(params).toString());
+    const res = await fetch(`${base}/tipo-cargo/${query}`, {
+        headers: { "Authorization": `Bearer ${getToken()}`, "Content-Type": "application/json" }
+    })
+    if (!res.ok) throw await res.json()
+    return res.json()
+}
+
+export async function getTipoCargoId(id) {
+    const res = await fetch(`${base}/tipo-cargo/${id}/`, {
+        headers: { "Authorization": `Bearer ${getToken()}`, "Content-Type": "application/json" }
+    })
+    if (!res.ok) throw await res.json()
+    return res.json()
+}
+
+export async function createTipoCargo(data) {
+    const res = await fetch(`${base}/tipo-cargo/`, {
+        method: 'POST',
+        body: JSON.stringify(data),
+        headers: { "Authorization": `Bearer ${getToken()}`, "Content-Type": "application/json" }
+    })
+    if (!res.ok) throw await res.json()
+    return res.json()
+}
+
+export async function updateTipoCargo({ id_cargo: id = null, ...data }) {
+    const res = await fetch(`${base}/tipo-cargo/${id}/`, {
+        method: 'PATCH',
+        body: JSON.stringify(data),
+        headers: { "Authorization": `Bearer ${getToken()}`, "Content-Type": "application/json" }
+    })
+    if (!res.ok) throw await res.json()
+    return res.json()
+}
+
+export async function deleteTipoCargo(id) {
+    const res = await fetch(`${base}/tipo-cargo/${id}/`, {
+        method: 'DELETE',
+        headers: { "Authorization": `Bearer ${getToken()}`, "Content-Type": "application/json" }
+    })
+    if (!res.ok) throw await res.json()
+    return res.text()
+}