<template> 
 | 
    <template if:true={showSpinner}> 
 | 
        <lightning-spinner size="medium" variant="brand"></lightning-spinner> 
 | 
    </template> 
 | 
    <div style="border: 1px solid #D4D4D4;border-radius:5px;"> 
 | 
        <div style="border-top: 3px solid #51606E;;border-bottom: 1px solid #D4D4D4;padding:3px;"> 
 | 
            <p style="font-size: 19px;"><strong>库存管理</strong></p> 
 | 
        </div> 
 | 
        <div style="padding:10px;"> 
 | 
            <div style="border: 1px solid #D4D4D4;border-radius:5px;margin-bottom:7px;"> 
 | 
                <div style="border-top: 3px solid #51606E;border-bottom: 1px solid #D4D4D4;padding:3px;"> 
 | 
                    <lightning-button style="margin: 5px;" label="库存盘点" title="库存盘点" 
 | 
                        onclick={inventoryCount}></lightning-button> 
 | 
                    <lightning-button style="margin: 5px;" label="过期库存销存" title="过期库存销存" 
 | 
                        onclick={handleExpired}></lightning-button> 
 | 
                    <lightning-button style="margin: 5px;" label="拆盒" title="拆盒" onclick={removeBox}></lightning-button> 
 | 
                    <lightning-button style="margin: 5px;" label="取消拆盒" title="取消拆盒" onclick={cancelremoveBox}></lightning-button> 
 | 
                    <!-- <table> 
 | 
                        <colgroup> 
 | 
                            <col width="160px"/> 
 | 
                            <col width="100px"/> 
 | 
                            <col width="10px"/> 
 | 
                            <col width="70px"/> 
 | 
                            <col width="100px"/> 
 | 
                            <col width="10px"/> 
 | 
                            <col width="90px"/> 
 | 
                            <col width="100px"/> 
 | 
                            <col width="10px"/> 
 | 
                            <col width="85px"/> 
 | 
                            <col width="100px"/> 
 | 
                            <col width="10px"/> 
 | 
                            <col width="70px"/> 
 | 
                            <col width="100px"/> 
 | 
                        </colgroup> 
 | 
                        <tbody> 
 | 
                            <tr> 
 | 
                                <td style="width:15%;"></td> 
 | 
                                <td style="width:15%;"><lightning-button label="库存盘点" title="库存盘点" onclick={inventoryCount} ></lightning-button></td> 
 | 
                                <td></td> 
 | 
                                <td></td> 
 | 
                                <td style="width:15%"><lightning-button label="过期库存销存"  title="过期库存销存" onclick={handleExpired} ></lightning-button></td> 
 | 
                                <td></td> 
 | 
                                <td></td> 
 | 
                                <td style="width:15%;"><lightning-button label="拆盒" title="拆盒" onclick={removeBox} ></lightning-button></td> 
 | 
                                <td></td> 
 | 
                                <td></td> 
 | 
                                <td style="width:15%;"><lightning-button label="取消拆盒" title="取消拆盒" onclick={handleClick}></lightning-button></td> 
 | 
         
 | 
                            </tr> 
 | 
                        </tbody>   
 | 
                </table> --> 
 | 
                </div> 
 | 
            </div> 
 | 
  
 | 
            <div style="border: 1px solid #D4D4D4;border-radius:5px;margin-bottom:7px;"> 
 | 
                <div style="border-top: 3px solid #51606E;border-bottom: 1px solid #D4D4D4;padding:3px;"> 
 | 
                    <table> 
 | 
                        <colgroup> 
 | 
                            <col width="160px" /> 
 | 
                            <col width="100px" /> 
 | 
                            <col width="10px" /> 
 | 
                            <col width="70px" /> 
 | 
                            <col width="100px" /> 
 | 
                            <col width="10px" /> 
 | 
                            <col width="70px" /> 
 | 
                            <col width="100px" /> 
 | 
                            <col width="10px" /> 
 | 
                            <col width="90px" /> 
 | 
                            <col width="100px" /> 
 | 
                            <col width="85px" /> 
 | 
                            <col width="100px" /> 
 | 
                            <col width="10px" /> 
 | 
                            <col width="70px" /> 
 | 
                            <col width="100px" /> 
 | 
                        </colgroup> 
 | 
                        <tbody> 
 | 
                            <tr> 
 | 
                                <td style="width: 21%;"> 
 | 
                                    <lightning-input type="text" name="Name" label="消耗品名称" value={Name} 
 | 
                                        variant="label-inline" onchange={handleChange} 
 | 
                                        data-field="Name"></lightning-input> 
 | 
                                </td> 
 | 
                                <td style="width: 21%;"> 
 | 
                                    <lightning-combobox name="CategoryThree" label="第3分类" value={value} 
 | 
                                        placeholder="请选择..." options={options1} variant="label-inline" 
 | 
                                        data-field="CategoryThree" onchange={handleChange}></lightning-combobox> 
 | 
                                </td> 
 | 
                                <td style="width: 21%;"> 
 | 
                                    <lightning-combobox name="CategoryFour" label="第4分类" value={value} 
 | 
                                        placeholder="请选择..." options={options2} variant="label-inline" 
 | 
                                        data-field="CategoryFour" onchange={handleChange}></lightning-combobox> 
 | 
                                </td> 
 | 
                                <td style="width: 21%;"> 
 | 
                                    <lightning-combobox name="CategoryFive" label="第5分类" value={value} 
 | 
                                        placeholder="请选择..." options={options3} variant="label-inline" 
 | 
                                        data-field="CategoryFive" onchange={handleChange}></lightning-combobox> 
 | 
                                </td> 
 | 
                                <td style="width: 3%;"></td> 
 | 
                                <td style="width: 8%;"> 
 | 
                                    <lightning-button label="消耗品搜索" onclick={searchOrderDetail}></lightning-button> 
 | 
                                </td> 
 | 
                                <td style="width: 8%;"> 
 | 
                                    <lightning-button label="清空" onclick={clearAll}></lightning-button> 
 | 
                                </td> 
 | 
                            </tr> 
 | 
                        </tbody> 
 | 
                    </table> 
 | 
                </div> 
 | 
            </div> 
 | 
            <div style="border: 1px solid #D4D4D4;border-radius:5px;margin-bottom:7px;"> 
 | 
                <div style="border-top: 3px solid #51606E;border-bottom: 1px solid #D4D4D4;padding:3px;"> 
 | 
                    <p style="font-size: 16px;"><strong>库存详情</strong></p> 
 | 
                </div> 
 | 
                <div style="padding:10px;"> 
 | 
                    <template if:true={showTable}> 
 | 
                        <lightning-datatable  
 | 
                        key-field="id" 
 | 
                        data={data}  
 | 
                        columns={columns} 
 | 
                        default-sort-direction={defaultSortDirection} 
 | 
                        sorted-direction={sortDirection} 
 | 
                        sorted-by={sortedBy} 
 | 
                        onsort={onHandleSort}  
 | 
                        hidecheckboxcolumn = {hidecheckboxcolumn}> 
 | 
                        </lightning-datatable> 
 | 
                        <c-paginator     
 | 
                        if:true={paginationVisibility} 
 | 
                        onprevious={handlePrevious} 
 | 
                        onnext={handleNext} 
 | 
                        onpageschange={handlePageschange} 
 | 
                        onfirst={handleFirst} 
 | 
                        onlast={handleLast} 
 | 
                        page-size-options={pageSizeOptions}           
 | 
                        previous-button-disabled={previousButtonDisabled} 
 | 
                        next-button-disabled={nextButtonDisabled} 
 | 
                        record-start={recordStart} 
 | 
                        record-end={recordEnd} 
 | 
                        total-records={totalRecords} 
 | 
                    ></c-paginator> 
 | 
                    </template> 
 | 
  
 | 
  
 | 
                    <!-- <table class="list" border="0" cellpadding="0" cellspacing="0" id="example"> 
 | 
                        <thead> 
 | 
                            <tr class="headerRow"> 
 | 
                                <th>消耗品名称</th> 
 | 
                                <th>第3分类</th> 
 | 
                                <th>第4分类</th> 
 | 
                                <th>第5分类</th> 
 | 
                                <th>规格</th> 
 | 
                                <th>单位</th> 
 | 
                                <th>注册证编码号</th> 
 | 
                                <th>注册证效期</th> 
 | 
                                <th>CFDA状态</th> 
 | 
                                <th>使用期限</th> 
 | 
                                <th>有效期内库存</th> 
 | 
                                <th>过期库存</th> 
 | 
                               
 | 
                                <template if:true={hasHos}> 
 | 
                                    <th>医院特价</th> 
 | 
                                </template> 
 | 
                            </tr> 
 | 
                        </thead> 
 | 
                        <tbody> 
 | 
                            <template for:each={pageRecords} for:item="m"> 
 | 
                                <tr key={m.Prod.Name__c}> 
 | 
                                    <td align="center">{m.Prod.Name__c}</td> 
 | 
                                    <td align="center">{m.Prod.Category3__c}</td> 
 | 
                                    <td align="center">{m.Prod.Category4__c}</td> 
 | 
                                    <td align="center">{m.Prod.Category5__c}</td> 
 | 
                                    <td align="center">{m.packing_list}</td> 
 | 
                                    <td align="center">{m.BoxPiece}</td> 
 | 
                                    <td align="center">{m.approbation_No}</td> 
 | 
                                    <td align="center">{m.expiration_Date}</td> 
 | 
                                    <td align="center">{m.Prod.SFDA_Status__c}</td> 
 | 
                                    <td align="center">{m.guaranteeperiod}</td> 
 | 
                                    <td align="center">{m.limitCount}</td> 
 | 
                                    <td align="center">{m.overlimitCount}</td> 
 | 
                                    <template if:true={hasHos}> 
 | 
                                        <td> 
 | 
                                            <template if:true={m.hospitalSpecialOffer}> 
 | 
                                                √ 
 | 
                                            </template> 
 | 
                                        </td> 
 | 
                                    </template> 
 | 
                                </tr> 
 | 
                            </template> 
 | 
                        </tbody> 
 | 
                    </table> --> 
 | 
                    <!-- <div style="height: 300px;"> 
 | 
                        <lightning-datatable 
 | 
                                key-field="id" 
 | 
                                data={data} 
 | 
                                columns={columns} 
 | 
                                hide-checkbox-column 
 | 
                                default-sort-direction={defaultSortDirection} 
 | 
                                sorted-direction={sortDirection} 
 | 
                                sorted-by={sortedBy} 
 | 
                                onsort={onHandleSort}> 
 | 
                        </lightning-datatable> 
 | 
                    </div> --> 
 | 
                </div> 
 | 
            </div> 
 | 
        </div> 
 | 
  
 | 
  
 | 
    </div> 
 | 
</template> 
 |