2

sucede que tengo mi plantilla index.blade.php en el cual cargo el listado de artículos, me gustaría que el estado Inactivo aparezca de color rojo, no tengo ni idea de como hacerlo soy novato en laravel y php, de echo me incline por este framework para evitar hacer tanto código php gracias a las plantillas blade..

supongo que debo implementar un if algo así como

if (estado.equals("Inactivo")){}

pero no tengo la mas minima idea espero me puedan ayudar

introducir la descripción de la imagen aquí

Adjunto el archivo index.balde.php

@extends('layouts.admin')
@section('contenido')
<div class="row">
  <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
    <h3>Listado de articulos <a href="almacen/articulo/create"><button type="button" name="button" class="btn btn-success">nuevo</button></a></h3>
    @include('almacen.articulo.serch')
  </div>
</div>
<div class="row">
  <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
    <div class="table-responsive">
      <table class="table table-bordered table-condensed table-striped table-hover">
        <thead>
          <th>ID</th>
          <th>Nombre</th>
          <th>Codigo</th>
          <th>Categoria</th>
          <th>Stock</th>
          <th>Imagen</th>
          <th>Estado</th>
          <th>Opciónes</th>
        </thead>
        @foreach($articulos as $art)
        <tr>
          <td>{{$art->idarticulo}}</td>
          <td>{{$art->nombre}}</td>
          <td>{{$art->codigo}}</td>
          <td>{{$art->categoria}}</td>
          <td>{{$art->stock}}</td>
          <td>
            <img src="{{asset('/imagenes/articulos/'.$art->imagen)}}" alt="{{$art->nombre}}" width="100px" height="100px" class="img-thumbnail" />
          </td>
          <td>{{$art->estado}}</td>
          <td>
            <button type="button" name="button">Editar</button>
          </td>
        </tr>
        @endforeach
      </table>

    </div>

  </div>

</div>


@endsection

3 respuestas 3

2

Tomando en cuenta la respuesta anterior seria algo diferente ya que tendrías que poner de color toda la linea, yo haría algo mas o menos así:

@extends('layouts.admin')

@section('contenido')
<div class="row">
  <div class="col-md-6 col-xs-12">
    <h3>Listado de articulos <a href="almacen/articulo/create"><button type="button" name="button" class="btn btn-success">nuevo</button></a></h3>
    @include('almacen.articulo.serch')
  </div>
</div>
<div class="row">
  <div class="col-xs-12">
    <div class="table-responsive">
      <table class="table table-bordered table-condensed table-striped table-hover">
        <thead>
          <th>ID</th>
          <th>Nombre</th>
          <th>Codigo</th>
          <th>Categoria</th>
          <th>Stock</th>
          <th>Imagen</th>
          <th>Estado</th>
          <th>Opciónes</th>
        </thead>
        @foreach($articulos as $art)
        //Utilizaria los estilos de bootstrap que ya nos da por defecto
        <tr class="@if($art->estado == 'Inactivo') table-danger @endif">
          <td>{{$art->idarticulo}}</td>
          <td>{{$art->nombre}}</td>
          <td>{{$art->codigo}}</td>
          <td>{{$art->categoria}}</td>
          <td>{{$art->stock}}</td>
          <td>
            <img src="{{asset('/imagenes/articulos/'.$art->imagen)}}" alt="{{$art->nombre}}" width="100px" height="100px" class="img-thumbnail" />
          </td>
          <td>{{$art->estado}}</td>
          <td>
            <button type="button" name="button">Editar</button>
          </td>
        </tr>
        @endforeach
      </table>
    </div>  
  </div>
</div>
@endsection

Con la clase table-danger de bootstrap empleara el color rojo que necesitas sin necesidad crear un css.

1
  • La pregunta dice: "que el estado inactivo aparezca de color rojo", no dice que la línea completa sea de color rojo.
    – Shaz
    Commented el 27 oct. 2016 a las 0:57
1

Amigos gracias por comentar teniendo en cuenta sus códigos resolví mi inquietud de la siguiente manera.

   @foreach($articulos as $art)
        <tr>
          <td>{{$art->idarticulo}}</td>
          <td>{{$art->nombre}}</td>
          <td>{{$art->codigo}}</td>
          <td>{{$art->categoria}}</td>
          <td>{{$art->stock}}</td>
          <td>
            <img src="{{asset('/imagenes/articulos/'.$art->imagen)}}" alt="{{$art->nombre}}" width="100px" height="100px" class="img-thumbnail" />
          </td>
          <td>
            @if($art->estado == 'Inactivo')
            <span class="text-danger">{{$art->estado}}</span>
            @else
            <span class="text-success">{{$art->estado}}</span>
            @endif
          </td>
          <td>
            <button type="button" name="button">Editar</button>
          </td>
        </tr>
        @endforeach

De esta manera obtengo Inactivo en color rojo y Activo en color verde, un abrazo.

0

Si lo que quieres es utilizar blade, tan solo debes usar su condicional @if ... @endif para agregar una clase al contenedor del texto "Inactivo" y cambias el color en tu archivo css.

index.blade.php

@extends('layouts.admin')

@section('contenido')
<div class="row">
  <div class="col-md-6 col-xs-12">
    <h3>Listado de articulos <a href="almacen/articulo/create"><button type="button" name="button" class="btn btn-success">nuevo</button></a></h3>
    @include('almacen.articulo.serch')
  </div>
</div>
<div class="row">
  <div class="col-xs-12">
    <div class="table-responsive">
      <table class="table table-bordered table-condensed table-striped table-hover">
        <thead>
          <th>ID</th>
          <th>Nombre</th>
          <th>Codigo</th>
          <th>Categoria</th>
          <th>Stock</th>
          <th>Imagen</th>
          <th>Estado</th>
          <th>Opciónes</th>
        </thead>
        @foreach($articulos as $art)
        <tr>
          <td>{{$art->idarticulo}}</td>
          <td>{{$art->nombre}}</td>
          <td>{{$art->codigo}}</td>
          <td>{{$art->categoria}}</td>
          <td>{{$art->stock}}</td>
          <td>
            <img src="{{asset('/imagenes/articulos/'.$art->imagen)}}" alt="{{$art->nombre}}" width="100px" height="100px" class="img-thumbnail" />
          </td>
          <td class="@if($art->estado == 'Inactivo') inactivo @endif">{{$art->estado}}</td>
          <td>
            <button type="button" name="button">Editar</button>
          </td>
        </tr>
        @endforeach
      </table>
    </div>  
  </div>
</div>
@endsection

y en tu archivo de css sería algo así

td.inactivo {
  color: red;
}

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.