diff --git a/plugins/romanah/gokbakja/models/product/columns.yaml b/plugins/romanah/gokbakja/models/product/columns.yaml
index 37b1282..b9bcb9e 100644
--- a/plugins/romanah/gokbakja/models/product/columns.yaml
+++ b/plugins/romanah/gokbakja/models/product/columns.yaml
@@ -20,3 +20,6 @@ columns:
     report:
         label: Hasabat
         type: text
+    order:
+        label: Yzygiderlilik
+        type: number
diff --git a/plugins/romanah/gokbakja/models/product/fields.yaml b/plugins/romanah/gokbakja/models/product/fields.yaml
index 297fd6f..88fe1e3 100644
--- a/plugins/romanah/gokbakja/models/product/fields.yaml
+++ b/plugins/romanah/gokbakja/models/product/fields.yaml
@@ -20,3 +20,7 @@ fields:
         span: auto
         default: simple
         type: balloon-selector
+    order:
+        label: 'Ysy giderliligi'
+        span: auto
+        type: number
diff --git a/plugins/romanah/gokbakja/updates/builder_table_update_romanah_gokbakja_product_3.php b/plugins/romanah/gokbakja/updates/builder_table_update_romanah_gokbakja_product_3.php
new file mode 100644
index 0000000..e6f559f
--- /dev/null
+++ b/plugins/romanah/gokbakja/updates/builder_table_update_romanah_gokbakja_product_3.php
@@ -0,0 +1,23 @@
+<?php namespace Romanah\Gokbakja\Updates;
+
+use Schema;
+use October\Rain\Database\Updates\Migration;
+
+class BuilderTableUpdateRomanahGokbakjaProduct3 extends Migration
+{
+    public function up()
+    {
+        Schema::table('romanah_gokbakja_product', function($table)
+        {
+            $table->integer('order')->default(0);
+        });
+    }
+    
+    public function down()
+    {
+        Schema::table('romanah_gokbakja_product', function($table)
+        {
+            $table->dropColumn('order');
+        });
+    }
+}
diff --git a/plugins/romanah/gokbakja/updates/version.yaml b/plugins/romanah/gokbakja/updates/version.yaml
index fff16e2..bc031b2 100644
--- a/plugins/romanah/gokbakja/updates/version.yaml
+++ b/plugins/romanah/gokbakja/updates/version.yaml
@@ -387,3 +387,6 @@
 1.0.130:
     - 'Updated table romanah_gokbakja_rulon_action'
     - builder_table_update_romanah_gokbakja_rulon_action_2.php
+1.0.131:
+    - 'Updated table romanah_gokbakja_product'
+    - builder_table_update_romanah_gokbakja_product_3.php
diff --git a/themes/gokbakja/pages/production/production.htm b/themes/gokbakja/pages/production/production.htm
index 65856a4..392a12e 100644
--- a/themes/gokbakja/pages/production/production.htm
+++ b/themes/gokbakja/pages/production/production.htm
@@ -12,6 +12,8 @@ noRecordsMessage = "No records found"
 detailsPage = "-"
 detailsUrlParameter = "id"
 pageNumber = "{{ :page }}"
+sortColumn = "order"
+sortDirection = "asc"
 
 [production]
 ==
@@ -62,8 +64,8 @@ function onStart(){
     {% if crudExtrudor %}
     <div class="collapse multi-collapse show" id="multiCollapseExample1">
         <div class="row">
-            <div class="col-lg" data-bs-toggle="collapse" href="#multiCollapseExample1"
-            role="button" aria-expanded="false" aria-controls="multiCollapseExample1">
+            <div class="col-lg" data-bs-toggle="collapse" href="#multiCollapseExample1" role="button"
+                aria-expanded="false" aria-controls="multiCollapseExample1">
                 <a class="card bg-success text-white-50">
                     <div class="card-body">
                         <h5 class="mb-4 text-white" id="percentage"><i class="mdi mdi-bullseye-arrow me-3"></i> 0 %</h5>
@@ -72,8 +74,8 @@ function onStart(){
                 </a>
             </div>
             {% for key, record in records %}
-            <div class="col-md-2" data-bs-toggle="collapse" href="#multiCollapseExample1"
-            role="button" aria-expanded="false" aria-controls="multiCollapseExample1">
+            <div class="col-md-2" data-bs-toggle="collapse" href="#multiCollapseExample1" role="button"
+                aria-expanded="false" aria-controls="multiCollapseExample1">
                 <a class="card bg-info text-white-50">
                     <div class="card-body">
                         <h5 class="mb-4 text-white" id="avg_percentage_{{record.id}}"><i
@@ -94,8 +96,9 @@ function onStart(){
                 <div class="card-body">
                     <div class="row">
                         <div class="col-md-6">
-                            <h3 data-bs-toggle="collapse" href="#multiCollapseExample1"
-                            role="button" aria-expanded="false" aria-controls="multiCollapseExample1" class="card-title" style="font-size: 22px;color: #1e2038;" id="headerq">Çig Mallar
+                            <h3 data-bs-toggle="collapse" href="#multiCollapseExample1" role="button"
+                                aria-expanded="false" aria-controls="multiCollapseExample1" class="card-title"
+                                style="font-size: 22px;color: #1e2038;" id="headerq">Çig Mallar
                                 Boýunça (Soňky üýtgeşme: 0 kg)</h3>
                             <div id="back_btn">
                                 <a href="#">HASABAT</a>
@@ -329,6 +332,43 @@ function onStart(){
 {% put scripts %}
 
 <script>
+
+    $(document).ready(function () {
+        var prodCount = document.getElementById('product_count').innerHTML;
+
+        for (let i = 0; i < prodCount; i++) {
+
+            $("#product_" + i).hover(function () {
+                $(this).attr("ishoveredin", 1);
+                $(this).stop(true, false).animate({
+                    width: "200px"
+                });
+            }, function () {
+                $(this).attr("ishoveredin", 0);
+                if ($(this).attr("isfocusedin") != 1)
+                    $(this).stop(true, false).animate({
+                        width: "100%"
+                    });
+            });
+
+            $("#product_" + i).focus(function () {
+                $(this).attr("isfocusedin", 1);
+                $(this).stop(true, false).animate({
+                    width: "200px"
+                });
+            });
+
+            $("#product_" + i).blur(function () {
+                $(this).attr("isfocusedin", 0);
+                $(this).stop(true, false).animate({
+                    width: "100%"
+                });
+            });
+
+        }
+
+    });
+
     function backStep1() {
         document.getElementById("step1").setAttribute("style", "display:contents");
         document.getElementById("step2").setAttribute("style", "display:none");
@@ -351,6 +391,7 @@ function onStart(){
             document.getElementById("step2").setAttribute("style", "display:contents");
 
             $("#back_btn").html(`<a href="#" onclick="backStep1();">YZA 1-nji ädime</a>`);
+
         }
 
 
diff --git a/themes/gokbakja/pages/production/report-dynamic.htm b/themes/gokbakja/pages/production/report-dynamic.htm
index 535ef16..e98110f 100644
--- a/themes/gokbakja/pages/production/report-dynamic.htm
+++ b/themes/gokbakja/pages/production/report-dynamic.htm
@@ -126,7 +126,7 @@ function onStart(){
                                 <th>Ekskruiter</th>
                                 <th>Hemmesi</th>
                                 {% for key, record in records %}
-                                <th>{{record.name}}</th>
+                                <th>{{record.code}}</th>
                                 {% endfor %}
                                 <th>Bellik</th>
                                 <!--  <th>Настройки</th> -->
@@ -147,7 +147,7 @@ function onStart(){
                                 <th>Ekskruiter</th>
                                 <th>Hemmesi</th>
                                 {% for key, record in records %}
-                                <th>{{record.name}}</th>
+                                <th>{{record.code}}</th>
                                 {% endfor %}
                                 <th>Bellik</th>
                                 <!--  <th>Настройки</th> -->