@extends('layouts.master_app')
@section('title') Nueva categoría @endsection

@section('css')
@endsection

@section('content')
	<!--begin::Toolbar-->
	<div class="toolbar py-2" id="kt_toolbar">
		<!--begin::Container-->
		<div id="kt_toolbar_container" class="container-fluid d-flex align-items-center">
			<!--begin::Page title-->
			<div class="flex-grow-1 flex-shrink-0 me-5">
				<!--begin::Page title-->
				<div data-kt-swapper="true" data-kt-swapper-mode="prepend" data-kt-swapper-parent="{default: '#kt_content_container', 'lg': '#kt_toolbar_container'}" class="page-title d-flex align-items-center flex-wrap me-3 mb-5 mb-lg-0">
					<!--begin::Title-->
					<h1 class="d-flex align-items-center text-dark fw-bold my-1 fs-3">Productos
					<!--begin::Separator-->
					<span class="h-20px border-gray-200 border-start ms-3 mx-2"></span>
					<!--end::Separator-->
					<!--begin::Description-->
					<small class="text-muted fs-7 fw-semibold my-1 ms-1">Importar</small>
					<!--end::Description--></h1>
					<!--end::Title-->
				</div>
				<!--end::Page title-->
			</div>
			<!--end::Page title-->
			<!--begin::Action group-->
			<div class="d-flex align-items-center flex-wrap">
				<!--begin::Wrapper-->
				<div class="flex-shrink-0 me-2">
					
				</div>
				<!--end::Wrapper-->
				<!--begin::Wrapper-->
				<div class="d-flex align-items-center">
					
				</div>
				<!--end::Wrapper-->
			</div>
			<!--end::Action group-->
		</div>
		<!--end::Container-->
	</div>
	<!--end::Toolbar-->
	
	<div class="content d-flex flex-column flex-column-fluid" id="kt_content" ng-controller="productsController">
		<!--begin::Container-->
		<div id="kt_content_container" class="container-xxl">
            <!--begin::Card-->
			<div class="card">
				<!--begin::Card header-->
				<div class="card-header border-0 pt-6">
					<!--begin::Card title-->
					<div class="card-title">
						<!--begin::Search-->
						<div class="d-flex align-items-center position-relative my-1">
                            <input id="file" type="file" uploader-model="file" class="form-control form-control" onchange="angular.element(this).scope().fileUploaded(this)" accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"  />
                            <a type="button" class="btn btn-primary btn-sm mb-2" ng-click="uploadExcel()" class="btn btn-primary" ng-show="excel" ng-disabled="upload_excel" >
                                Vista Previa
                            </a>
                            <button class="btn btn-info btn-block" ng-click="importCompanyProducts()" ng-show="company_products.length != null" ng-disabled="loading_company_products">
                                <span ng-show="!loading_company_products">Importar</span>
                                <span ng-show="loading_company_products"><i class="fa fa-circle-o-notch fa-spin" aria-hidden="true"></i>Importando</span> 
                            </button>	
						</div>
						<!--end::Search-->
					</div>
					
				</div>
				<!--end::Card header-->
				<!--begin::Card body-->
				<div class="card-body py-4">
					@include('partials.success')
					<!--begin::Table-->
					<table class="table align-middle table-row-dashed fs-6 gy-5" id="kt_table_users">
						<!--begin::Table head-->
						<thead>
							<!--begin::Table row-->
							<tr class="text-start text-muted fw-bold fs-7 text-uppercase gs-0">
								<th class="w-10px pe-2"></th>
								<th class="min-w-125px">ID</th>
								<th class="min-w-125px">Marca</th>
								<th class="min-w-125px">Código</th>
								<th class="min-w-125px">Nombre</th>
								<th class="min-w-125px">Descripción</th>
                                <th class="min-w-125px">Costo</th>
                                <th class="min-w-125px">Margen</th>
								<th class="text-end min-w-100px">Moneda</th>
							</tr>
							<!--end::Table row-->
						</thead>
						<!--end::Table head-->
						<!--begin::Table body-->
						<tbody class="text-gray-600 fw-semibold">
							<!--begin::Table row-->
							<tr ng-repeat="item in company_products">
								<td></td>
                                <td>@{{item.id}}</td>
								<td class="d-flex align-items-center">@{{item.marca}}</td>
								<td>@{{item.codigo}}</td>
                                <td>@{{item.nombre}}</td>
                                <td>@{{item.descripcion}}</td>
                                <td>@{{item.costo}}</td>
                                <td>@{{item.margen}}</td>
                                <td>@{{item.moneda}}</td>
							</tr>
							<!--end::Table row-->
					
						</tbody>
						<!--end::Table body-->
					</table>
					<!--end::Table-->
				</div>
				<!--end::Card body-->
			</div>
			<!--end::Card-->
			
		</div>
		<!--end::Container-->
	</div>
@endsection

@section('js')
@endsection