diff --git a/app/Filters/InvoiceFilters.php b/app/Filters/InvoiceFilters.php
index 1fbb7aebdc6c..c96d7507dcb2 100644
--- a/app/Filters/InvoiceFilters.php
+++ b/app/Filters/InvoiceFilters.php
@@ -53,11 +53,14 @@ class InvoiceFilters extends QueryFilters
             $this->builder->where('status_id', Invoice::STATUS_PAID);
 
         if(in_array('unpaid', $status_parameters))
-            $this->builder->whereIn('status_id', [Invoice::STATUS_SENT, Invoice::STATUS_PARTIAL]);
+            $this->builder->whereIn('status_id', [Invoice::STATUS_SENT, Invoice::STATUS_PARTIAL])
+                            ->where('due_date', '>', Carbon::now())
+                            ->orWhere('partial_due_date', '>', Carbon::now());
 
         if(in_array('overdue', $status_parameters))
             $this->builder->whereIn('status_id', [Invoice::STATUS_SENT, Invoice::STATUS_PARTIAL])
-                            ->where('due_date', '<', Carbon::now());
+                            ->where('due_date', '<', Carbon::now())
+                            ->orWhere('partial_due_date', '<', Carbon::now());
 
         return $this->builder;
     }
diff --git a/app/Http/Controllers/ClientPortal/InvoiceController.php b/app/Http/Controllers/ClientPortal/InvoiceController.php
index 6e71b2ac706f..c4fd55af3569 100644
--- a/app/Http/Controllers/ClientPortal/InvoiceController.php
+++ b/app/Http/Controllers/ClientPortal/InvoiceController.php
@@ -40,18 +40,22 @@ class InvoiceController extends Controller
      * @return \Illuminate\Http\Response
      */
     public function index(InvoiceFilters $filters, Builder $builder)
-    {//Log::error(request());
+    {//
         $invoices = Invoice::filter($filters);
 
         if (request()->ajax()) {
 
             return DataTables::of(Invoice::filter($filters))->addColumn('action', function ($invoice) {
-                    return '<a href="/client/invoices/'. $invoice->hashed_id .'/edit" class="btn btn-xs btn-primary"><i class="glyphicon glyphicon-edit"></i> Edit</a>';
+                    return '<a href="/client/invoices/'. $invoice->hashed_id .'/edit" class="btn btn-xs btn-primary"><i class="glyphicon glyphicon-edit"></i>'.ctrans('texts.view').'</a>';
                 })
                 ->addColumn('checkbox', function ($invoice){
                     return '<input type="checkbox" name="hashed_ids[]" value="'. $invoice->hashed_id .'"/>';
                 })
-                ->rawColumns(['checkbox', 'action'])
+                ->editColumn('status_id', function ($invoice){
+                    Log::error($invoice->status);
+                    return Invoice::badgeForStatus($invoice->status);
+                })
+                ->rawColumns(['checkbox', 'action', 'status_id'])
                 ->make(true);
         
         }
@@ -67,7 +71,7 @@ class InvoiceController extends Controller
             ['data' => 'amount', 'name' => 'amount', 'title' => trans('texts.total'), 'visible'=> true],
             ['data' => 'balance', 'name' => 'balance', 'title' => trans('texts.balance'), 'visible'=> true],
             ['data' => 'due_date', 'name' => 'due_date', 'title' => trans('texts.due_date'), 'visible'=> true],
-            ['data' => 'status_id', 'name' => 'status_id', 'title' => trans('texts.status'), 'visible'=> true],
+            ['data' => 'status', 'name' => 'status', 'title' => trans('texts.status'), 'visible'=> true],
             ['data' => 'action', 'name' => 'action', 'title' => '', 'searchable' => false, 'orderable' => false],
         ]);
 
diff --git a/app/Models/Invoice.php b/app/Models/Invoice.php
index 1f534d4169f2..9c35ae0f5636 100644
--- a/app/Models/Invoice.php
+++ b/app/Models/Invoice.php
@@ -18,6 +18,7 @@ use App\Utils\Traits\NumberFormatter;
 use Illuminate\Database\Eloquent\Model;
 use Illuminate\Database\Eloquent\SoftDeletes;
 use Illuminate\Support\Carbon;
+use Illuminate\Support\Facades\Log;
 
 class Invoice extends BaseModel
 {
@@ -78,6 +79,11 @@ class Invoice extends BaseModel
         'client',
     ];
 
+    protected $appends = [
+        'hashed_id',
+        'status'
+    ];
+
     const STATUS_DRAFT = 1;
     const STATUS_SENT = 2;
     const STATUS_PARTIAL = 3;
@@ -88,6 +94,23 @@ class Invoice extends BaseModel
     const STATUS_UNPAID = -2;
     const STATUS_REVERSED = -3;
 
+    
+    public function getStatusAttribute()
+    {
+
+        if($this->status_id == Invoice::STATUS_SENT && $this->due_date > Carbon::now())
+            return Invoice::STATUS_UNPAID;
+        else if($this->status_id == Invoice::STATUS_PARTIAL && $this->partial_due_date > Carbon::now())
+            return Invoice::STATUS_UNPAID;
+        else if($this->status_id == Invoice::STATUS_SENT && $this->due_date < Carbon::now())
+            return Invoice::STATUS_OVERDUE;
+        else if($this->status_id == Invoice::STATUS_PARTIAL && $this->partial_due_date < Carbon::now())
+            return Invoice::STATUS_OVERDUE;
+        else
+            return $this->status_id;
+
+    }
+    
     public function company()
     {
         return $this->belongsTo(Company::class);
@@ -172,4 +195,36 @@ class Invoice extends BaseModel
         $this->last_viewed = Carbon::now()->format('Y-m-d H:i');
     }
     
-}
+    public static function badgeForStatus(int $status)
+    {
+        switch ($status) {
+            case Invoice::STATUS_DRAFT:
+                return '<h4><span class="badge badge-light">'.ctrans('texts.draft').'</span></h4>';
+                break;
+            case Invoice::STATUS_SENT:
+                return '<h4><span class="badge badge-primary">'.ctrans('texts.sent').'</span></h4>';
+                break;
+            case Invoice::STATUS_PARTIAL:
+                return '<h4><span class="badge badge-primary">'.ctrans('texts.partial').'</span></h4>';
+                break;
+            case Invoice::STATUS_PAID:
+                return '<h4><span class="badge badge-success">'.ctrans('texts.paid').'</span></h4>';
+                break;
+            case Invoice::STATUS_CANCELLED:
+                return '<h4><span class="badge badge-secondary">'.ctrans('texts.cancelled').'</span></h4>';
+                break;
+            case Invoice::STATUS_OVERDUE:
+                return '<h4><span class="badge badge-danger">'.ctrans('texts.overdue').'</span></h4>';
+                break;
+            case Invoice::STATUS_UNPAID:
+                return '<h4><span class="badge badge-warning">'.ctrans('texts.unpaid').'</span></h4>';
+                break;      
+            case Invoice::STATUS_REVERSED:
+                return '<h4><span class="badge badge-info">'.ctrans('texts.reversed').'</span></h4>';
+                break;           
+            default:
+                # code...
+                break;
+        }
+    }
+}
\ No newline at end of file
diff --git a/resources/views/portal/default/invoices/index.blade.php b/resources/views/portal/default/invoices/index.blade.php
index 6aecf4d90b02..2b39278d1d7a 100644
--- a/resources/views/portal/default/invoices/index.blade.php
+++ b/resources/views/portal/default/invoices/index.blade.php
@@ -20,6 +20,7 @@
                         <select class="form-control" style="width: 220px;" id="statuses" name="client_status[]" multiple="multiple">
                               <option value="paid">{{ ctrans('texts.status_paid') }}</option>
                               <option value="unpaid">{{ ctrans('texts.status_unpaid') }}</option>
+                              <option value="overdue">{{ ctrans('texts.overdue') }}</option>
                         </select>
 
                     </div>
@@ -162,12 +163,16 @@ $('#statuses').select2({
     templateSelection: function(data, container) {
         if (data.id == 'paid') {
             $(container).css('color', '#fff');
-            $(container).css('background-color', '#f0ad4e');
-            $(container).css('border-color', '#eea236');
+            $(container).css('background-color', '#00c979');
+            $(container).css('border-color', '#00a161');
         } else if (data.id == 'unpaid') {
+            $(container).css('color', '#fff');
+            $(container).css('background-color', '#f0ad4e');
+            $(container).css('border-color', '#eea236');
+        } else if (data.id == 'overdue') {
             $(container).css('color', '#fff');
             $(container).css('background-color', '#d9534f');
-            $(container).css('border-color', '#d43f3a');
+            $(container).css('border-color', '#d43f3a');            
         }
         return data.text;
     }