403 lines
16 KiB
HTML
403 lines
16 KiB
HTML
<html>
|
|
<head>
|
|
<link type="text/css" rel="stylesheet" href="/style-guide/css/fluig-style-guide.min.css" />
|
|
<script type="text/javascript" src="/portal/resources/js/jquery/jquery.js"></script>
|
|
<script type="text/javascript" src="/portal/resources/js/jquery/jquery-ui.min.js"></script>
|
|
<script type="text/javascript" src="/portal/resources/js/mustache/mustache-min.js"></script>
|
|
<script type="text/javascript" src="/style-guide/js/fluig-style-guide.min.js" charset="utf-8"></script>
|
|
<script type="text/javascript" src="/webdesk/vcXMLRPC.js"></script>
|
|
|
|
<style>
|
|
.transfer-shell {
|
|
max-width: 1180px;
|
|
margin: 0 auto;
|
|
padding: 20px 14px 28px;
|
|
background: #f3f6f9;
|
|
border-radius: 12px;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.transfer-status {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 8px;
|
|
margin-bottom: 12px;
|
|
}
|
|
|
|
.status-pill {
|
|
background: #e9f4ff;
|
|
color: #0d5b91;
|
|
border: 1px solid #c3def6;
|
|
padding: 6px 12px;
|
|
border-radius: 999px;
|
|
font-size: 11px;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.transfer-main-title {
|
|
margin: 0 0 16px;
|
|
color: #0f3c5c;
|
|
font-size: 20px;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.transfer-card {
|
|
background: #fff;
|
|
border: 1px solid #dde6ee;
|
|
border-radius: 12px;
|
|
padding: 18px;
|
|
margin-bottom: 14px;
|
|
box-shadow: 0 4px 14px rgba(15, 60, 92, 0.06);
|
|
}
|
|
|
|
.card-title {
|
|
margin: 0 0 14px;
|
|
color: #0f3c5c;
|
|
font-size: 13px;
|
|
font-weight: 700;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.04em;
|
|
}
|
|
|
|
.transfer-label {
|
|
display: block;
|
|
margin-bottom: 6px;
|
|
color: #45657e;
|
|
font-size: 11px;
|
|
font-weight: 700;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.03em;
|
|
}
|
|
|
|
.transfer-input {
|
|
border-radius: 8px;
|
|
border: 1px solid #cfdbe7;
|
|
min-height: 38px;
|
|
background: #fbfdff;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.table-modern th {
|
|
background: #eff5fb;
|
|
color: #36556f;
|
|
font-weight: 700;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.btn-add-row {
|
|
margin-top: 8px;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.attachment-line {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
}
|
|
|
|
.attachment-line .descAnexo {
|
|
max-width: 240px;
|
|
}
|
|
|
|
.attachment-line .inputAnexo {
|
|
flex: 1;
|
|
}
|
|
|
|
.transfer-shell .table td,
|
|
.transfer-shell .table th,
|
|
.transfer-shell .btn {
|
|
font-size: 12px;
|
|
}
|
|
|
|
/* Force override over Fluig style guide defaults */
|
|
.transfer-shell,
|
|
.transfer-shell * {
|
|
font-size: 12px !important;
|
|
}
|
|
|
|
.transfer-shell .transfer-main-title {
|
|
font-size: 18px !important;
|
|
line-height: 1.2 !important;
|
|
}
|
|
|
|
.transfer-shell .card-title {
|
|
font-size: 11px !important;
|
|
line-height: 1.2 !important;
|
|
letter-spacing: 0.02em !important;
|
|
}
|
|
|
|
.transfer-shell .transfer-label {
|
|
font-size: 10px !important;
|
|
letter-spacing: 0.02em !important;
|
|
}
|
|
|
|
.transfer-shell .status-pill {
|
|
font-size: 10px !important;
|
|
padding: 4px 10px !important;
|
|
}
|
|
|
|
.transfer-shell input.form-control,
|
|
.transfer-shell textarea.form-control,
|
|
.transfer-shell .btn {
|
|
font-size: 11px !important;
|
|
}
|
|
|
|
.transfer-shell .table th,
|
|
.transfer-shell .table td {
|
|
font-size: 11px !important;
|
|
}
|
|
|
|
.excel-import-wrap {
|
|
margin-bottom: 12px;
|
|
padding: 10px;
|
|
border: 1px dashed #cfdbe7;
|
|
border-radius: 8px;
|
|
background: #f8fbff;
|
|
}
|
|
|
|
.excel-import-actions {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
flex-wrap: wrap;
|
|
margin-top: 6px;
|
|
}
|
|
|
|
.excel-loading-overlay {
|
|
position: fixed;
|
|
inset: 0;
|
|
background: rgba(255, 255, 255, 0.65);
|
|
display: none;
|
|
align-items: center;
|
|
justify-content: center;
|
|
z-index: 9999;
|
|
}
|
|
|
|
.excel-loading-box {
|
|
min-width: 240px;
|
|
padding: 14px 16px;
|
|
border-radius: 10px;
|
|
background: #ffffff;
|
|
border: 1px solid #cfdbe7;
|
|
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
color: #27445e;
|
|
font-weight: 600;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.excel-spinner {
|
|
width: 18px;
|
|
height: 18px;
|
|
border: 2px solid #c5d9ea;
|
|
border-top-color: #1f6ea9;
|
|
border-radius: 50%;
|
|
animation: excelSpin 0.75s linear infinite;
|
|
flex: 0 0 18px;
|
|
}
|
|
|
|
@keyframes excelSpin {
|
|
to {
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="excelLoadingOverlay" class="excel-loading-overlay">
|
|
<div class="excel-loading-box">
|
|
<span class="excel-spinner"></span>
|
|
<span>Importando planilha...</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="fluig-style-guide">
|
|
<form name="form" role="form">
|
|
<div class="container-fluid transfer-shell">
|
|
<div class="transfer-status">
|
|
<span class="status-pill">Solicitação</span>
|
|
<span class="status-pill">Coleta</span>
|
|
<span class="status-pill">Entrega</span>
|
|
<span class="status-pill">Recebimento</span>
|
|
</div>
|
|
|
|
<h1 class="transfer-main-title">Formulário de Transferência de Mercadorias</h1>
|
|
|
|
<section class="transfer-card activity activity-0 activity-1 activity-4 activity-6 activity-18 activity-24 activity-31 activity-57">
|
|
<h2 class="card-title">Dados da Transferência</h2>
|
|
<div class="row">
|
|
<div class="col-md-4 col-sm-6">
|
|
<label class="transfer-label" for="requesterName">Usuário de abertura</label>
|
|
<input type="text" class="form-control transfer-input" name="requesterName" id="requesterName" readonly />
|
|
</div>
|
|
<div class="col-md-2 col-sm-6">
|
|
<label class="transfer-label" for="dataAbertura">Data</label>
|
|
<input type="text" class="form-control transfer-input" name="dataAbertura" id="dataAbertura" readonly />
|
|
</div>
|
|
<div class="col-md-6 col-sm-12">
|
|
<label class="transfer-label" for="emailSolicitante">Email solicitante</label>
|
|
<input type="text" class="form-control transfer-input" name="emailSolicitante" id="emailSolicitante" readonly />
|
|
</div>
|
|
</div>
|
|
<div class="row" style="margin-top:10px;">
|
|
<div class="col-md-6 col-sm-12">
|
|
<label class="transfer-label" for="estabelecimento">Filial origem</label>
|
|
<input type="zoom" class="form-control transfer-input" name="estabelecimento" id="estabelecimento" data-zoom="{
|
|
'displayKey':'LOJA',
|
|
'datasetId':'ds_LojasTransf',
|
|
'maximumSelectionLength':'1',
|
|
'placeholder':'Selecione a filial de origem',
|
|
'fields':[
|
|
{'field':'PDV','label':'Loja'},
|
|
{'field':'RESPONSAVEL_LOJA','label':'Gestor'}
|
|
]
|
|
}" />
|
|
</div>
|
|
<div class="col-md-6 col-sm-12">
|
|
<label class="transfer-label" for="centroCusto">Filial destino</label>
|
|
<input type="zoom" class="form-control transfer-input" name="centroCusto" id="centroCusto" data-zoom="{
|
|
'displayKey':'LOJA',
|
|
'datasetId':'ds_LojasTransf',
|
|
'maximumSelectionLength':'1',
|
|
'placeholder':'Selecione a filial de destino',
|
|
'fields':[
|
|
{'field':'PDV','label':'Loja'},
|
|
{'field':'RESPONSAVEL_LOJA','label':'Gestor'}
|
|
]
|
|
}" />
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="transfer-card activity activity-0 activity-1 activity-4 activity-6 activity-18 activity-24 activity-31 activity-57">
|
|
<h2 class="card-title">Itens da Transferência</h2>
|
|
<div class="excel-import-wrap">
|
|
<label class="transfer-label">Importar itens via Excel</label>
|
|
<small>Colunas esperadas: codigo/codigoItem e quantidade/quantidadeItem.</small>
|
|
<div class="excel-import-actions">
|
|
<button type="button" id="btnAdicionarExcel" class="btn btn-default">
|
|
<i class="fluigicon fluigicon-file-upload"></i> Importar planilha
|
|
</button>
|
|
<button type="button" id="btnRemoverExcel" class="btn btn-default" style="display:none;">
|
|
<i class="fluigicon fluigicon-trash"></i> Remover arquivo
|
|
</button>
|
|
<span id="nomeArquivoExcel">Nenhum arquivo selecionado</span>
|
|
</div>
|
|
<input type="file" id="excelUpload" name="excelUpload" accept=".xlsx,.xls" style="display:none;" />
|
|
</div>
|
|
<table tablename="tabelaItens" class="table table-striped table-modern" id="tabelaItens" noaddbutton="true" nodeletebutton="true">
|
|
<thead>
|
|
<tr>
|
|
<th style="width:70px;">#</th>
|
|
<th style="width:34%;">Código do item</th>
|
|
<th style="width:18%;">Quantidade</th>
|
|
<th>Descrição</th>
|
|
<th style="width:70px;"></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><span class="tabela_itens_id">1</span></td>
|
|
<td>
|
|
<input type="zoom" class="form-control transfer-input" name="descricao" data-zoom="{
|
|
'displayKey':'Code',
|
|
'datasetId':'ds_rgb_products',
|
|
'maximumSelectionLength':'1',
|
|
'fields':[
|
|
{'field':'Code','label':'Codigo'},
|
|
{'field':'Description','label':'Descricao'},
|
|
{'field':'descricao','label':'Descricao item'}
|
|
]
|
|
}" />
|
|
</td>
|
|
<td>
|
|
<input type="number" min="1" class="form-control transfer-input" name="quantidadeItem" />
|
|
</td>
|
|
<td>
|
|
<input type="text" class="form-control transfer-input" name="codigoItem" readonly />
|
|
</td>
|
|
<td>
|
|
<button type="button" class="btn btn-default hideButton" onclick="remove_row(this)">
|
|
<i class="fluigicon fluigicon-trash"></i>
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<button type="button" class="btn btn-primary btn-add-row hideButton" onclick="add_new_row('tabelaItens')">
|
|
<i class="fluigicon fluigicon-plus"></i> Adicionar item
|
|
</button>
|
|
</section>
|
|
|
|
<section class="transfer-card activity activity-0 activity-1 activity-4 activity-6 activity-18 activity-24 activity-31 activity-57">
|
|
<h2 class="card-title">Justificativa</h2>
|
|
<textarea class="form-control transfer-input" rows="4" name="justificativa" id="justificativa" placeholder="Descreva o motivo da transferencia"></textarea>
|
|
</section>
|
|
|
|
<section class="transfer-card activity activity-6 activity-18 activity-31 activity-57">
|
|
<h2 class="card-title">Anexos por Etapa</h2>
|
|
|
|
<div class="componentAnexo attachment-line" style="margin-bottom:10px;">
|
|
<input type="text" class="form-control descAnexo transfer-input" name="descAnexo_Nfe" value="Nota Fiscal" readonly />
|
|
<input type="text" class="form-control inputAnexo transfer-input" id="fnAnexo_Nfe" name="fnAnexo_Nfe" readonly placeholder="Nenhum anexo selecionado" />
|
|
<button type="button" class="btn btn-success btnUpFile" data-acao="upload" onclick="anexo(event)"><i class="fluigicon fluigicon-file-upload"></i></button>
|
|
<button type="button" class="btn btn-default btnViewerFile" data-acao="viewer" onclick="anexo(event)" style="display:none;"><i class="fluigicon fluigicon-eye-open"></i></button>
|
|
<button type="button" class="btn btn-default btnDownloadFile" data-acao="download" onclick="anexo(event)" style="display:none;"><i class="fluigicon fluigicon-download"></i></button>
|
|
</div>
|
|
|
|
<div class="componentAnexo attachment-line" style="margin-bottom:10px;">
|
|
<input type="text" class="form-control descAnexo transfer-input" name="descAnexo_Coleta" value="Comprovante de Coleta" readonly />
|
|
<input type="text" class="form-control inputAnexo transfer-input" id="fdAnexo_Coleta" name="fdAnexo_Coleta" readonly placeholder="Nenhum anexo selecionado" />
|
|
<button type="button" class="btn btn-success btnUpFile" data-acao="upload" onclick="anexo(event)"><i class="fluigicon fluigicon-file-upload"></i></button>
|
|
<button type="button" class="btn btn-default btnViewerFile" data-acao="viewer" onclick="anexo(event)" style="display:none;"><i class="fluigicon fluigicon-eye-open"></i></button>
|
|
<button type="button" class="btn btn-default btnDownloadFile" data-acao="download" onclick="anexo(event)" style="display:none;"><i class="fluigicon fluigicon-download"></i></button>
|
|
</div>
|
|
|
|
<div class="componentAnexo attachment-line" style="margin-bottom:10px;">
|
|
<input type="text" class="form-control descAnexo transfer-input" name="descAnexo_Entrega" value="Comprovante de Entrega" readonly />
|
|
<input type="text" class="form-control inputAnexo transfer-input" id="fdAnexo_Entrega" name="fdAnexo_Entrega" readonly placeholder="Nenhum anexo selecionado" />
|
|
<button type="button" class="btn btn-success btnUpFile" data-acao="upload" onclick="anexo(event)"><i class="fluigicon fluigicon-file-upload"></i></button>
|
|
<button type="button" class="btn btn-default btnViewerFile" data-acao="viewer" onclick="anexo(event)" style="display:none;"><i class="fluigicon fluigicon-eye-open"></i></button>
|
|
<button type="button" class="btn btn-default btnDownloadFile" data-acao="download" onclick="anexo(event)" style="display:none;"><i class="fluigicon fluigicon-download"></i></button>
|
|
</div>
|
|
|
|
<div class="componentAnexo attachment-line">
|
|
<input type="text" class="form-control descAnexo transfer-input" name="descAnexo_Recebimento" value="Comprovante de Recebimento" readonly />
|
|
<input type="text" class="form-control inputAnexo transfer-input" id="fdAnexo_recebimento" name="fdAnexo_recebimento" readonly placeholder="Nenhum anexo selecionado" />
|
|
<button type="button" class="btn btn-success btnUpFile" data-acao="upload" onclick="anexo(event)"><i class="fluigicon fluigicon-file-upload"></i></button>
|
|
<button type="button" class="btn btn-default btnViewerFile" data-acao="viewer" onclick="anexo(event)" style="display:none;"><i class="fluigicon fluigicon-eye-open"></i></button>
|
|
<button type="button" class="btn btn-default btnDownloadFile" data-acao="download" onclick="anexo(event)" style="display:none;"><i class="fluigicon fluigicon-download"></i></button>
|
|
</div>
|
|
</section>
|
|
|
|
<input type="hidden" name="WKNumProces" id="WKNumProces" value="" />
|
|
<input type="hidden" name="activity" id="activity" value="" />
|
|
<input type="hidden" name="formMode" id="formMode" value="" />
|
|
<input type="hidden" name="requesterMail" id="requesterMail" value="" />
|
|
<input type="hidden" name="requesterId" id="requesterId" value="" />
|
|
<input type="hidden" name="currentUserName" id="currentUserName" value="" />
|
|
<input type="hidden" name="currentUsermail" id="currentUsermail" value="" />
|
|
<input type="hidden" name="currentUserId" id="currentUserId" value="" />
|
|
<input type="hidden" name="gestorNome" id="gestorNome" value="" />
|
|
<input type="hidden" name="gestorEmail" id="gestorEmail" value="" />
|
|
<input type="hidden" name="gestor_cc" id="gestor_cc" value="" />
|
|
<input type="hidden" name="gestorNomeE" id="gestorNomeE" value="" />
|
|
<input type="hidden" name="gestorEmailE" id="gestorEmailE" value="" />
|
|
<input type="hidden" name="gestor_cce" id="gestor_cce" value="" />
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<script type="text/javascript" src="/portal/resources/js/xlsx.full.min.js"></script>
|
|
<script type="text/javascript">
|
|
if (typeof XLSX === "undefined") {
|
|
document.write('<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.5/xlsx.full.min.js"><\/script>');
|
|
}
|
|
</script>
|
|
<script type="text/javascript" src="./excel.js"></script>
|
|
<script type="text/javascript" src="./script.js"></script>
|
|
</body>
|
|
</html>
|