<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="cmp_errDescr.ascx.cs" Inherits="NKC_WF.WebUserControls.cmp_errDescr" %>

<asp:HiddenField runat="server" ID="hfErrType" />
<asp:HiddenField runat="server" ID="hfDescription" Value='[{"Src":"a","OrderExtCode":"b.c","MODEL":"d","FRAME_QTY":2,"MRP_PART":"e","QTY":4},{"Src":"A","OrderExtCode":"B.C","MODEL":"D","FRAME_QTY":2,"MRP_PART":"E","QTY":2}]' />

<div runat="server" id="divError" visible='<%# !$"{hfErrType.Value}".StartsWith("K.") %>'>
    <asp:Label ID="DescriptionLabel" runat="server"><%: hfDescription.Value %></asp:Label>
</div>

<div id="divKitError" runat="server" visible='<%# $"{hfErrType.Value}".StartsWith("K.") %>'>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/json2html/1.4.0/json2html.min.js"></script>
    <script>

        // http://json2html.com/

        let data = $get('<%= hfDescription.ClientID %>').value;
        //console.log(data);

        //let template = { '<>': 'div', 'html': '<b>${Src}</b> file | Order: ${OrderExtCode} | Model: ${MODEL} | Mrp_Part: ${MRP_PART} | Frame_Qty/Qty: ${FRAME_QTY}/${QTY}' };

        let headerTemplate = {
            '<>': 'div', 'class': 'table-secondary row mx-0', 'html': [
                { '<>': 'div', 'class': 'col', 'html': 'SRC' },
                { '<>': 'div', 'class': 'col', 'html': 'ORDER' },
                { '<>': 'div', 'class': 'col', 'html': 'MODEL' },
                { '<>': 'div', 'class': 'col', 'html': 'MRP PART' },
                { '<>': 'div', 'class': 'col', 'html': 'FRAME QTY' },
                { '<>': 'div', 'class': 'col', 'html': 'QTY' }
            ]
        };

        let template = {
            '<>': 'div', 'class': 'row mx-0', 'html': [
                { '<>': 'div', 'class': 'col', 'html': '${Src}' },
                { '<>': 'div', 'class': 'col', 'html': '${OrderExtCode}' },
                { '<>': 'div', 'class': 'col', 'html': '${MODEL}' },
                { '<>': 'div', 'class': 'col', 'html': '${MRP_PART}' },
                { '<>': 'div', 'class': 'col', 'html': '${FRAME_QTY}' },
                { '<>': 'div', 'class': 'col', 'html': '${QTY}' }
            ]
        };

        //native javascript
        document.write(json2html.transform(null, headerTemplate));
        document.write(json2html.transform(data, template));

    </script>
    <hr />
    <div class="small">
        <i><%: traduci("Err.K.01.note") %></i>
    </div>
</div>
