UI fejlesztés

2025-03-30 22:48:57 +02:00
parent 8566889cf9
commit d7c198acfa
3 changed files with 49 additions and 2 deletions
@@ -61,7 +61,27 @@
        </tfoot>
    </table>
 </div>
+<style>
+    .box {
+        display: inline-block;
+        width: 25px;
+        height: 25px;
+        margin: 1px;
+        text-align: center;
+        line-height: 25px;
+        font-size: 15px;
+        border: 1px solid black;
+        border-radius: 3px;
+    }

+    .yellow-box {
+        background-color: yellow;
+    }
+
+    .red-box {
+        background-color: red;
+    }
+</style>
@section Scripts {
    <script>

@@ -75,7 +95,30 @@
                    { data: "id" },
                    { data: "rowIndex" },
                    { data: "operationDescription" },
-                    { data: "answerType" },
+                    {
+                            data: "answerType",
+                            searchable: false,
+                            sortable: false,
+                            render: function ( data, type, row ) {
+                                if (data === 'SI-N') {
+                                    return '<div class="text-center"><div class="box yellow-box">I</div><div class="box">N</div></div>';
+                                }
+                                if (data === 'I-SN') {
+                                    return '<div class="text-center"><div class="box">I</div><div class="box yellow-box">N</div></div>';
+                                }
+                                if (data === 'PI-N') {
+                                    return '<div class="text-center"><div class="box red-box">I</div><div class="box">N</div></div>';
+                                }
+                                if (data === 'I-PN') {
+                                    return '<div class="text-center"><div class="box">I</div><div class="box red-box">N</div></div>';
+                                }
+                                if (data==='P'){
+                                    return '<div class="text-center"><i class="fas fa-camera fa-2x"></i></div>';
+                                }
+                                return data;
+                            }
+
+                    },
                    { data: null, render: function (data, type, row) {
                         return renderActionButtons(row.id);
                    }}