Euraxluo opened a new issue, #21032:
URL: https://github.com/apache/echarts/issues/21032
### Version
5.6.0
### Link to Minimal Reproduction
-
### Steps to Reproduce
```html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>库存分配可视化 - ECharts版本</title>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/echarts/5.6.0/echarts.min.js"></script>
<style>
body {
font-family: 'Microsoft YaHei', Arial, sans-serif;
margin: 20px;
background-color: #f5f5f5;
}
.container {
max-width: 1400px;
margin: 0 auto;
background: white;
border-radius: 10px;
box-shadow: 0 4px 6px rgba(0,0,0,0.1);
padding: 20px;
}
.input-area {
margin: 20px 0;
background: #f8f9fa;
padding: 20px;
border-radius: 8px;
}
textarea {
width: 100%;
height: 200px;
margin: 10px 0;
border: 1px solid #ddd;
border-radius: 4px;
padding: 10px;
font-family: 'Courier New', monospace;
font-size: 12px;
}
.button {
padding: 12px 24px;
background: linear-gradient(45deg, #4CAF50, #45a049);
color: white;
border: none;
cursor: pointer;
border-radius: 6px;
font-size: 16px;
transition: all 0.3s ease;
}
.button:hover {
background: linear-gradient(45deg, #45a049, #4CAF50);
transform: translateY(-2px);
box-shadow: 0 4px 8px rgba(0,0,0,0.2);
}
#visualization {
margin-top: 20px;
height: 600px;
border: 1px solid #e0e0e0;
border-radius: 8px;
background: white;
}
.metrics {
display: flex;
flex-wrap: wrap;
gap: 16px;
margin-bottom: 20px;
}
.metric {
background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
padding: 15px 25px;
border-radius: 10px;
min-width: 180px;
font-size: 1.1em;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
transition: transform 0.3s ease;
}
.metric:hover {
transform: translateY(-3px);
}
.metric.success {
background: linear-gradient(135deg, #d4edda 0%, #a8d8a8 100%);
}
.metric.warning {
background: linear-gradient(135deg, #fff3cd 0%, #ffd93d 100%);
}
.metric.danger {
background: linear-gradient(135deg, #f8d7da 0%, #f5c6cb 100%);
}
table {
width: 100%;
border-collapse: collapse;
margin: 10px 0;
box-shadow: 0 2px 4px rgba(0,0,0,0.05);
border-radius: 8px;
overflow: hidden;
}
th, td {
border: 1px solid #ddd;
padding: 12px;
text-align: left;
}
th {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
font-weight: bold;
}
tr:nth-child(even) {
background-color: #f8f9fa;
}
tr:hover {
background-color: #e3f2fd;
}
h1 {
color: #2c3e50;
text-align: center;
margin-bottom: 30px;
font-size: 2.5em;
}
h3 {
color: #34495e;
border-left: 4px solid #3498db;
padding-left: 15px;
margin-top: 30px;
}
</style>
</head>
<body>
<div class="container">
<h1>📦 库存分配可视化系统</h1>
<div class="input-area">
<h3>🔧 输入分配结果JSON:</h3>
<textarea id="jsonInput"
placeholder="请粘贴AllocationResponse的JSON数据..."></textarea>
<button class="button" onclick="visualize()">🚀 生成可视化</button>
<div style="margin-top: 15px; background: #f0f8ff; padding:
15px; border-radius: 8px; border: 1px solid #d1e6ff;">
<h3 style="margin-top: 0;">📊 Sankey图布局调整</h3>
<div style="display: flex; flex-wrap: wrap; gap: 15px;">
<div style="flex: 1; min-width: 200px;">
<label for="nodeAlign">节点对齐方式:</label>
<select id="nodeAlign" style="width: 100%; padding:
8px; margin-top: 5px; border-radius: 4px; border: 1px solid #ccc;">
<option value="left">左对齐</option>
<option value="right" selected>右对齐</option>
<option value="justify">两端对齐</option>
</select>
</div>
<div style="flex: 1; min-width: 200px;">
<label for="layoutOrientation">布局方向:</label>
<select id="layoutOrientation" style="width: 100%;
padding: 8px; margin-top: 5px; border-radius: 4px; border: 1px solid #ccc;">
<option value="horizontal" selected>水平</option>
<option value="vertical">垂直</option>
</select>
</div>
<div style="flex: 1; min-width: 200px;">
<label for="iterations">布局迭代次数 (32-128):</label>
<input type="number" id="iterations" value="64"
min="32" max="128" step="8" style="width: 100%; padding: 8px; margin-top: 5px;
border-radius: 4px; border: 1px solid #ccc;">
</div>
</div>
<div style="margin-top: 10px; display: flex; flex-wrap:
wrap; gap: 15px;">
<div style="flex: 1; min-width: 200px;">
<label for="waveFilter">波次筛选 (多选):</label>
<select id="waveFilter" multiple style="width: 100%;
padding: 8px; margin-top: 5px; border-radius: 4px; border: 1px solid #ccc;
height: 100px;">
</select>
</div>
<div style="flex: 1; min-width: 200px;">
<label for="locationFilter">库位筛选 (多选):</label>
<select id="locationFilter" multiple style="width:
100%; padding: 8px; margin-top: 5px; border-radius: 4px; border: 1px solid
#ccc; height: 100px;">
</select>
</div>
</div>
<div style="display: flex; justify-content: center;
margin-top: 10px; gap: 15px;">
<button class="button" style="background:
linear-gradient(45deg, #3498db, #2980b9);"
onclick="updateLayout()">更新布局</button>
<button class="button" style="background:
linear-gradient(45deg, #9b59b6, #8e44ad);"
onclick="applyFilters()">应用筛选</button>
<button class="button" style="background:
linear-gradient(45deg, #e74c3c, #c0392b);"
onclick="resetFilters()">重置筛选</button>
</div>
</div>
</div>
<div id="metrics"></div>
<div id="visualization"></div>
<div id="tables"></div>
</div>
<script>
// 全局变量
let myChart = null;
let originalSankeyData = null; // 存储原始数据
// 示例数据
const sampleData = {
"emptyLocations": 1,
"multiUseLocations": 0,
"skuLevelData": {
"allPackages": [{"packageId": 1, "requestNum": 10, "skuId":
1001}],
"capacityByPriority": {1001: {0: 8}},
"locationsByPriority": {1001: {0: 1}},
"packageWaveMap": {"1": "WAVE_001"},
"skuLocationsByPriority": {
1001: {
0: [{"availableQty": 8, "locationId": 1, "priority":
0, "skuId": 1001}]
}
},
"skuTotalDemand": {1001: 10},
"totalCapacity": {1001: 8},
"totalLocations": {1001: 1},
"waveDemand": {"WAVE_001": 10},
"waveLocations": {"WAVE_001": [1]},
"wavePackages": {"WAVE_001": [1]}
},
"totalAllocated": 8,
"waveInfoRespList": [{
"packageInfoList": [{
"locationInfoList": [
{"locationId": 1, "packageId": 1, "allocatedQty": 8}
],
"packageId": 1,
"status": "1"
}],
"totalAllocated": 8,
"waveCode": "WAVE_001"
}]
};
// 页面加载完成时加载示例数据
window.onload = function() {
document.getElementById('jsonInput').value =
JSON.stringify(sampleData, null, 2);
visualize();
};
// 主入口函数
function visualize() {
const jsonData = document.getElementById('jsonInput').value;
if (!jsonData) {
alert('请输入JSON数据');
return;
}
try {
// 修复 JSON 中的数字键问题
const fixedJson = jsonData.replace(/([\{,]\s*)(\d+)(\s*:)/g,
'$1"$2"$3');
const data = JSON.parse(fixedJson);
// 填充过滤选择器
populateFilters(data);
// 1. 统计卡片
renderMetrics(data);
// 2. ECharts Sankey图
renderEChartsSankey(data);
// 3. 表格
renderTables(data);
} catch (e) {
alert('JSON格式错误或数据处理失败:' + e.message);
console.error('JSON解析错误:', e);
console.error('原始JSON:', jsonData);
}
}
// 填充筛选选择器
function populateFilters(data) {
const waveFilter = document.getElementById('waveFilter');
const locationFilter = document.getElementById('locationFilter');
// 清空现有选项
waveFilter.innerHTML = '';
locationFilter.innerHTML = '';
const skuData = data.skuLevelData || {};
const waves = Object.keys(skuData.waveDemand || {});
const locationSet = new Set();
// 收集所有的库位ID
for (const waveInfo of (data.waveInfoRespList || [])) {
for (const pkg of (waveInfo.packageInfoList || [])) {
for (const loc of (pkg.locationInfoList || [])) {
locationSet.add(loc.locationId);
}
}
}
// 按照数字大小排序的函数
const sortNumeric = (a, b) => {
// 提取数字部分
const numA = parseInt(a.replace(/\D/g, '')) || 0;
const numB = parseInt(b.replace(/\D/g, '')) || 0;
return numA - numB;
};
// 添加波次选项
waves.sort(sortNumeric).forEach(wave => {
const option = document.createElement('option');
option.value = wave;
option.textContent = wave;
waveFilter.appendChild(option);
});
// 添加库位选项
Array.from(locationSet).sort((a, b) => a - b).forEach(locId => {
const option = document.createElement('option');
option.value = locId;
option.textContent = `库位-${locId}`;
locationFilter.appendChild(option);
});
}
// 应用筛选
function applyFilters() {
const chartDom = document.getElementById('visualization');
if (!myChart || !originalSankeyData) {
return;
}
// 获取选中的波次和库位
const waveFilter = document.getElementById('waveFilter');
const locationFilter = document.getElementById('locationFilter');
const selectedWaves =
Array.from(waveFilter.selectedOptions).map(opt => opt.value);
const selectedLocations =
Array.from(locationFilter.selectedOptions).map(opt => parseInt(opt.value));
// 如果没有选择任何筛选条件,则保留所有数据
if (selectedWaves.length === 0 && selectedLocations.length ===
0) {
resetFilters();
return;
}
// 深拷贝原始数据
const { nodes, links } =
JSON.parse(JSON.stringify(originalSankeyData));
// 筛选链接
const filteredLinks = links.filter(link => {
// 波次筛选
if (selectedWaves.length > 0) {
const isWaveSource = selectedWaves.some(wave =>
link.source.includes(`波次-${wave}`));
if (isWaveSource) {
return true;
}
}
// 库位筛选
if (selectedLocations.length > 0) {
const isLocSource = selectedLocations.some(loc =>
link.source.includes(`库位-${loc}`));
const isLocTarget = selectedLocations.some(loc =>
link.target.includes(`库位-${loc}`));
if (isLocSource || isLocTarget) {
return true;
}
}
return selectedWaves.length === 0 &&
selectedLocations.length === 0;
});
// 获取过滤后的链接中涉及的所有节点名称
const remainingNodeNames = new Set();
filteredLinks.forEach(link => {
remainingNodeNames.add(link.source);
remainingNodeNames.add(link.target);
});
// 筛选节点
const filteredNodes = nodes.filter(node =>
remainingNodeNames.has(node.name));
// 更新图表
myChart.setOption({
series: [{
data: filteredNodes,
links: filteredLinks
}]
});
}
// 重置筛选
function resetFilters() {
// 清除选中状态
document.getElementById('waveFilter').selectedIndex = -1;
document.getElementById('locationFilter').selectedIndex = -1;
// 如果有原始数据和图表,恢复完整数据
if (originalSankeyData && myChart) {
myChart.setOption({
series: [{
data: originalSankeyData.nodes,
links: originalSankeyData.links
}]
});
}
}
// 统计卡片渲染
function renderMetrics(data) {
const totalAllocated = data.totalAllocated || 0;
const emptyLocations = data.emptyLocations || 0;
const multiUseLocations = data.multiUseLocations || 0;
const skuData = data.skuLevelData || {};
const totalDemand = Object.values(skuData.skuTotalDemand ||
{}).reduce((a, b) => a + b, 0);
const totalCapacity = Object.values(skuData.totalCapacity ||
{}).reduce((a, b) => a + b, 0);
const totalLocations = Object.values(skuData.totalLocations ||
{}).reduce((a, b) => a + b, 0);
const totalPackages = (skuData.allPackages || []).length;
const totalWaves = Object.keys(skuData.waveDemand || {}).length;
const allocationRate = totalDemand > 0 ? (totalAllocated /
totalDemand * 100).toFixed(2) : 0;
const capacityUtilization = totalCapacity > 0 ? (totalAllocated
/ totalCapacity * 100).toFixed(2) : 0;
let html = `
<div class="metrics">
<div class="metric success"><strong>📊 分配总量:</strong>
${totalAllocated}</div>
<div class="metric success"><strong>🎯 总需求:</strong>
${totalDemand}</div>
<div class="metric success"><strong>📈 分配率:</strong>
${allocationRate}%</div>
<div class="metric"><strong>📦 总容量:</strong>
${totalCapacity}</div>
<div class="metric"><strong>⚡ 容量利用率:</strong>
${capacityUtilization}%</div>
<div class="metric"><strong>🏢 总库位数:</strong>
${totalLocations}</div>
<div class="metric warning"><strong>🗂️ 清空库位数:</strong>
${emptyLocations}</div>
<div class="metric warning"><strong>🔄 多波次库位数:</strong>
${multiUseLocations}</div>
<div class="metric"><strong>📋 总包裹数:</strong>
${totalPackages}</div>
<div class="metric"><strong>🌊 总波次数:</strong>
${totalWaves}</div>
</div>
`;
document.getElementById('metrics').innerHTML = html;
}
// ECharts Sankey图渲染
function renderEChartsSankey(data) {
const chartDom = document.getElementById('visualization');
if (myChart) {
myChart.dispose();
}
myChart = echarts.init(chartDom);
// 构建节点和链接数据
const { nodes, links } = buildSankeyData(data);
// 保存原始数据
originalSankeyData = { nodes: JSON.parse(JSON.stringify(nodes)),
links: JSON.parse(JSON.stringify(links)) };
// 获取用户布局参数
const nodeAlign = document.getElementById('nodeAlign').value;
const layoutOrientation =
document.getElementById('layoutOrientation').value;
const iterations =
parseInt(document.getElementById('iterations').value) || 64;
const option = {
title: {
text: '库存分配流向图',
left: 'center',
textStyle: {
fontSize: 20,
fontWeight: 'bold',
color: '#2c3e50'
}
},
tooltip: {
trigger: 'item',
triggerOn: 'mousemove',
backgroundColor: 'rgba(50, 50, 50, 0.9)',
textStyle: {
color: '#fff'
},
formatter: function(params) {
if (params.dataType === 'node') {
return params.data.tooltip || params.data.name;
} else if (params.dataType === 'edge') {
return `${params.data.source} →
${params.data.target}<br/>分配量: ${params.data.value}`;
}
}
},
animation: true,
animationDuration: 1000,
animationEasing: 'cubicInOut',
series: [{
type: 'sankey',
data: nodes,
links: links,
emphasis: {
focus: 'adjacency'
},
orient: layoutOrientation,
levels: [
{
depth: 0,
itemStyle: {
color: '#ff7f7f'
},
lineStyle: {
color: 'source',
opacity: 0.6
}
},
{
depth: 1,
itemStyle: {
color: '#87ceeb'
},
lineStyle: {
color: 'source',
opacity: 0.6
}
},
{
depth: 2,
itemStyle: {
color: '#98fb98'
},
lineStyle: {
color: 'source',
opacity: 0.6
}
}
],
lineStyle: {
curveness: 0.5,
opacity: 0.7,
color: 'gradient'
},
itemStyle: {
borderWidth: 1,
borderColor: '#aaa',
borderType: 'solid'
},
label: {
fontSize: 12,
fontWeight: 'bold'
},
nodeAlign: nodeAlign,
nodeGap: 30,
nodeWidth: 25,
layoutIterations: iterations
}]
};
myChart.setOption(option);
// 响应式调整
window.addEventListener('resize', function() {
if (myChart) {
myChart.resize();
}
});
}
// 构建Sankey数据
function buildSankeyData(data) {
const nodes = [];
const links = [];
const nodeMap = new Map();
const skuData = data.skuLevelData || {};
const locationPriorityMap = new Map();
const locationAvailableQtyMap = new Map();
const waveDemandMap = new Map();
const packageRequestMap = new Map();
const packageWaveMap = new Map();
// 预处理数据
for (const [wave, demand] of Object.entries(skuData.waveDemand
|| {})) {
waveDemandMap.set(wave, demand);
}
for (const pkg of (skuData.allPackages || [])) {
packageRequestMap.set(pkg.packageId, pkg.requestNum);
}
for (const [pkgId, wave] of
Object.entries(skuData.packageWaveMap || {})) {
packageWaveMap.set(parseInt(pkgId), wave);
}
for (const [skuId, priorityMap] of
Object.entries(skuData.skuLocationsByPriority || {})) {
for (const [priority, locations] of
Object.entries(priorityMap)) {
for (const loc of locations) {
locationPriorityMap.set(loc.locationId,
parseInt(priority));
locationAvailableQtyMap.set(loc.locationId,
loc.availableQty);
}
}
}
// 添加节点的辅助函数
function addNode(name, tooltip) {
if (!nodeMap.has(name)) {
nodeMap.set(name, nodes.length);
nodes.push({ name: name, tooltip: tooltip });
}
return nodeMap.get(name);
}
// 构建节点和链接
const waveLocLinks = new Map();
const locPkgLinks = new Map();
(data.waveInfoRespList || []).forEach(wave => {
const waveLabel = `波次-${wave.waveCode}`;
const waveDemand = waveDemandMap.get(wave.waveCode) || 0;
const waveTooltip = `波次: ${wave.waveCode}<br/>需求量:
${waveDemand}`;
addNode(waveLabel, waveTooltip);
(wave.packageInfoList || []).forEach(pkg => {
(pkg.locationInfoList || []).forEach(loc => {
const locationLabel = `库位-${loc.locationId}`;
const priority =
locationPriorityMap.get(loc.locationId) || -1;
const availableQty =
locationAvailableQtyMap.get(loc.locationId) || 0;
const locationTooltip = `库位:
${loc.locationId}<br/>优先级: ${priority}<br/>可用量: ${availableQty}`;
addNode(locationLabel, locationTooltip);
const packageLabel = `包裹-${loc.packageId}`;
const requestNum =
packageRequestMap.get(loc.packageId) || 0;
const packageWave =
packageWaveMap.get(loc.packageId);
const packageTooltip = `包裹:
${loc.packageId}<br/>需求量: ${requestNum}<br/>所属波次: ${packageWave}`;
addNode(packageLabel, packageTooltip);
const qty = loc.allocatedQty || 0;
// 波次到库位的链接
const waveIdx = nodeMap.get(waveLabel);
const locationIdx = nodeMap.get(locationLabel);
const waveLocKey = `${waveIdx}_${locationIdx}`;
waveLocLinks.set(waveLocKey,
(waveLocLinks.get(waveLocKey) || 0) + qty);
// 库位到包裹的链接
const packageIdx = nodeMap.get(packageLabel);
const locPkgKey = `${locationIdx}_${packageIdx}`;
locPkgLinks.set(locPkgKey,
(locPkgLinks.get(locPkgKey) || 0) + qty);
});
});
});
// 添加波次到库位的链接
for (const [key, qty] of waveLocLinks.entries()) {
const [src, tgt] = key.split('_').map(Number);
links.push({
source: nodes[src].name,
target: nodes[tgt].name,
value: qty
});
}
// 添加库位到包裹的链接
for (const [key, qty] of locPkgLinks.entries()) {
const [src, tgt] = key.split('_').map(Number);
links.push({
source: nodes[src].name,
target: nodes[tgt].name,
value: qty
});
}
// 优化节点顺序,减少边交叉
sortSankey(nodes, links);
return { nodes, links };
}
// 优化Sankey图节点顺序,减少边交叉
function sortSankey(nodes, links) {
// 按照节点类型和连接情况排序
const nodeTypes = new Map();
const nodeConnections = new Map();
// 计算每个节点的连接数和类型
nodes.forEach((node, index) => {
const name = node.name;
if (name.startsWith('波次-')) {
nodeTypes.set(name, 0); // 波次类型
} else if (name.startsWith('库位-')) {
nodeTypes.set(name, 1); // 库位类型
} else if (name.startsWith('包裹-')) {
nodeTypes.set(name, 2); // 包裹类型
}
nodeConnections.set(name, 0);
});
// 计算连接数
links.forEach(link => {
nodeConnections.set(link.source,
(nodeConnections.get(link.source) || 0) + link.value);
nodeConnections.set(link.target,
(nodeConnections.get(link.target) || 0) + link.value);
});
// 按类型和连接数排序节点
nodes.sort((a, b) => {
const typeA = nodeTypes.get(a.name);
const typeB = nodeTypes.get(b.name);
// 首先按类型排序
if (typeA !== typeB) {
return typeA - typeB;
}
// 同类型按连接数降序排序
const connA = nodeConnections.get(a.name) || 0;
const connB = nodeConnections.get(b.name) || 0;
return connB - connA;
});
}
// 表格渲染
function renderTables(data) {
const skuData = data.skuLevelData || {};
let html = '';
const locationPriorityMap = new Map();
const locationAvailableQtyMap = new Map();
for (const [skuId, priorityMap] of
Object.entries(skuData.skuLocationsByPriority || {})) {
for (const [priority, locations] of
Object.entries(priorityMap)) {
for (const loc of locations) {
locationPriorityMap.set(loc.locationId,
parseInt(priority));
locationAvailableQtyMap.set(loc.locationId,
loc.availableQty);
}
}
}
// 1. SKU级别统计表格
html += `<h3>📈 SKU级别统计</h3>
<table>
<tr>
<th>SKU ID</th>
<th>总需求</th>
<th>总容量</th>
<th>总库位数</th>
<th>分配率</th>
<th>优先级0库位数</th>
<th>优先级1库位数</th>
</tr>`;
for (const [skuId, demand] of
Object.entries(skuData.skuTotalDemand || {})) {
const capacity = skuData.totalCapacity?.[skuId] || 0;
const locations = skuData.totalLocations?.[skuId] || 0;
const allocationRate = demand > 0 ? (capacity / demand *
100).toFixed(2) : 0;
const priority0Locations =
skuData.locationsByPriority?.[skuId]?.[0] || 0;
const priority1Locations =
skuData.locationsByPriority?.[skuId]?.[1] || 0;
html += `<tr>
<td>${skuId}</td>
<td>${demand}</td>
<td>${capacity}</td>
<td>${locations}</td>
<td>${allocationRate}%</td>
<td>${priority0Locations}</td>
<td>${priority1Locations}</td>
</tr>`;
}
html += `</table>`;
// 2. 波次统计表格
html += `<h3>🌊 波次统计</h3>
<table>
<tr>
<th>波次</th>
<th>需求数量</th>
<th>包裹数量</th>
<th>使用库位数</th>
</tr>`;
for (const [wave, demand] of Object.entries(skuData.waveDemand
|| {})) {
const packages = skuData.wavePackages?.[wave]?.length || 0;
const locations = skuData.waveLocations?.[wave]?.length || 0;
html += `<tr>
<td>${wave}</td>
<td>${demand}</td>
<td>${packages}</td>
<td>${locations}</td>
</tr>`;
}
html += `</table>`;
// 3. 库位分配统计表格
html += `<h3>🏢 库位分配统计</h3>
<table>
<tr>
<th>库位ID</th>
<th>优先级</th>
<th>可用容量</th>
<th>分配总量</th>
<th>被使用次数</th>
<th>涉及包裹数</th>
<th>涉及波次数</th>
<th>是否多波次</th>
</tr>`;
const locationStats = {};
(data.waveInfoRespList || []).forEach(wave => {
(wave.packageInfoList || []).forEach(pkg => {
(pkg.locationInfoList || []).forEach(loc => {
const locId = loc.locationId;
if (!locationStats[locId]) {
locationStats[locId] = {
total: 0,
count: 0,
packages: new Set(),
waves: new Set(),
priority: locationPriorityMap.get(locId) ||
-1,
availableQty:
locationAvailableQtyMap.get(locId) || 0
};
}
locationStats[locId].total += (loc.allocatedQty ||
0);
locationStats[locId].count += 1;
locationStats[locId].packages.add(loc.packageId);
locationStats[locId].waves.add(wave.waveCode);
});
});
});
for (const locId in locationStats) {
const stat = locationStats[locId];
const isMultiWave = stat.waves.size > 1 ? '✅ 是' : '❌ 否';
html += `<tr>
<td>${locId}</td>
<td>${stat.priority}</td>
<td>${stat.availableQty}</td>
<td>${stat.total}</td>
<td>${stat.count}</td>
<td>${stat.packages.size}</td>
<td>${stat.waves.size}</td>
<td>${isMultiWave}</td>
</tr>`;
}
html += `</table>`;
document.getElementById('tables').innerHTML = html;
}
function updateLayout() {
const nodeAlign = document.getElementById('nodeAlign').value;
const layoutOrientation =
document.getElementById('layoutOrientation').value;
const iterations = document.getElementById('iterations').value;
const chartDom = document.getElementById('visualization');
const chart = echarts.getInstanceByDom(chartDom);
if (chart) {
chart.setOption({
series: [{
type: 'sankey',
data: chart.getOption().series[0].data,
links: chart.getOption().series[0].links,
emphasis: {
focus: 'adjacency'
},
orient: layoutOrientation,
levels: [
{
depth: 0,
itemStyle: {
color: '#ff7f7f'
},
lineStyle: {
color: 'source',
opacity: 0.6
}
},
{
depth: 1,
itemStyle: {
color: '#87ceeb'
},
lineStyle: {
color: 'source',
opacity: 0.6
}
},
{
depth: 2,
itemStyle: {
color: '#98fb98'
},
lineStyle: {
color: 'source',
opacity: 0.6
}
}
],
lineStyle: {
curveness: 0.5,
opacity: 0.7,
color: 'gradient'
},
itemStyle: {
borderWidth: 1,
borderColor: '#aaa',
borderType: 'solid'
},
label: {
fontSize: 12,
fontWeight: 'bold'
},
nodeAlign: nodeAlign,
nodeGap: 30,
nodeWidth: 25,
layoutIterations: iterations
}]
});
}
}
</script>
</body>
</html>
```
```json
{"emptyLocations":2,"multiUseLocations":0,"skuLevelData":{"allPackages":[{"packageId":789929,"requestNum":2,"skuId":816324},{"packageId":789930,"requestNum":2,"skuId":816324},{"packageId":789938,"requestNum":2,"skuId":816324},{"packageId":789939,"requestNum":2,"skuId":816324},{"packageId":789946,"requestNum":2,"skuId":816324},{"packageId":789949,"requestNum":2,"skuId":816324},{"packageId":789955,"requestNum":2,"skuId":816324},{"packageId":789956,"requestNum":2,"skuId":816324},{"packageId":789965,"requestNum":2,"skuId":816324},{"packageId":789967,"requestNum":2,"skuId":816324},{"packageId":789975,"requestNum":2,"skuId":816324},{"packageId":789977,"requestNum":2,"skuId":816324},{"packageId":789985,"requestNum":2,"skuId":816324},{"packageId":789988,"requestNum":2,"skuId":816324},{"packageId":789998,"requestNum":2,"skuId":816324},{"packageId":790004,"requestNum":2,"skuId":816324},{"packageId":790006,"requestNum":2,"skuId":816324},{"packageId":790014,"requestNum":2,"skuId":816324},{"pa
ckageId":790015,"requestNum":2,"skuId":816324},{"packageId":790022,"requestNum":2,"skuId":816324},{"packageId":790023,"requestNum":2,"skuId":816324},{"packageId":790030,"requestNum":2,"skuId":816324},{"packageId":790031,"requestNum":2,"skuId":816324},{"packageId":790037,"requestNum":2,"skuId":816324},{"packageId":790039,"requestNum":2,"skuId":816324},{"packageId":790047,"requestNum":2,"skuId":816324},{"packageId":790048,"requestNum":2,"skuId":816324},{"packageId":790055,"requestNum":2,"skuId":816324},{"packageId":790064,"requestNum":2,"skuId":816324},{"packageId":790065,"requestNum":2,"skuId":816324},{"packageId":790073,"requestNum":2,"skuId":816324},{"packageId":790076,"requestNum":2,"skuId":816324},{"packageId":790083,"requestNum":2,"skuId":816324},{"packageId":790084,"requestNum":2,"skuId":816324},{"packageId":790095,"requestNum":2,"skuId":816324},{"packageId":790097,"requestNum":2,"skuId":816324},{"packageId":790104,"requestNum":2,"skuId":816324},{"packageId":790105,"requestNum"
:2,"skuId":816324},{"packageId":790112,"requestNum":2,"skuId":816324},{"packageId":790113,"requestNum":2,"skuId":816324},{"packageId":790121,"requestNum":2,"skuId":816324},{"packageId":790122,"requestNum":2,"skuId":816324},{"packageId":790130,"requestNum":2,"skuId":816324},{"packageId":790132,"requestNum":2,"skuId":816324},{"packageId":790141,"requestNum":2,"skuId":816324},{"packageId":790143,"requestNum":2,"skuId":816324},{"packageId":790152,"requestNum":2,"skuId":816324},{"packageId":790153,"requestNum":2,"skuId":816324},{"packageId":790161,"requestNum":2,"skuId":816324},{"packageId":790163,"requestNum":2,"skuId":816324},{"packageId":790170,"requestNum":2,"skuId":816324},{"packageId":790178,"requestNum":2,"skuId":816324},{"packageId":790179,"requestNum":2,"skuId":816324},{"packageId":790187,"requestNum":2,"skuId":816324},{"packageId":790189,"requestNum":2,"skuId":816324},{"packageId":790196,"requestNum":2,"skuId":816324},{"packageId":790197,"requestNum":2,"skuId":816324},{"package
Id":790203,"requestNum":2,"skuId":816324},{"packageId":790204,"requestNum":2,"skuId":816324},{"packageId":790212,"requestNum":2,"skuId":816324},{"packageId":790213,"requestNum":2,"skuId":816324},{"packageId":790219,"requestNum":2,"skuId":816324},{"packageId":790220,"requestNum":2,"skuId":816324},{"packageId":790227,"requestNum":2,"skuId":816324},{"packageId":790228,"requestNum":2,"skuId":816324},{"packageId":790237,"requestNum":2,"skuId":816324},{"packageId":790238,"requestNum":2,"skuId":816324},{"packageId":790246,"requestNum":2,"skuId":816324},{"packageId":790249,"requestNum":2,"skuId":816324},{"packageId":790256,"requestNum":2,"skuId":816324},{"packageId":790258,"requestNum":2,"skuId":816324},{"packageId":790262,"requestNum":2,"skuId":816324},{"packageId":790269,"requestNum":2,"skuId":816324},{"packageId":790271,"requestNum":2,"skuId":816324},{"packageId":790277,"requestNum":2,"skuId":816324},{"packageId":790278,"requestNum":2,"skuId":816324},{"packageId":790285,"requestNum":2,"s
kuId":816324},{"packageId":790286,"requestNum":2,"skuId":816324},{"packageId":790292,"requestNum":2,"skuId":816324},{"packageId":790293,"requestNum":2,"skuId":816324},{"packageId":790300,"requestNum":2,"skuId":816324},{"packageId":790302,"requestNum":2,"skuId":816324},{"packageId":790308,"requestNum":2,"skuId":816324},{"packageId":790310,"requestNum":2,"skuId":816324},{"packageId":790318,"requestNum":2,"skuId":816324},{"packageId":790319,"requestNum":2,"skuId":816324},{"packageId":790326,"requestNum":2,"skuId":816324},{"packageId":790327,"requestNum":2,"skuId":816324},{"packageId":790334,"requestNum":2,"skuId":816324},{"packageId":790342,"requestNum":2,"skuId":816324},{"packageId":790344,"requestNum":2,"skuId":816324},{"packageId":790349,"requestNum":2,"skuId":816324},{"packageId":790351,"requestNum":2,"skuId":816324},{"packageId":790357,"requestNum":2,"skuId":816324},{"packageId":790358,"requestNum":2,"skuId":816324},{"packageId":790363,"requestNum":2,"skuId":816324},{"packageId":7
90365,"requestNum":2,"skuId":816324},{"packageId":790371,"requestNum":2,"skuId":816324},{"packageId":790377,"requestNum":2,"skuId":816324},{"packageId":790379,"requestNum":2,"skuId":816324},{"packageId":790386,"requestNum":2,"skuId":816324},{"packageId":790388,"requestNum":2,"skuId":816324},{"packageId":790394,"requestNum":2,"skuId":816324},{"packageId":790396,"requestNum":2,"skuId":816324},{"packageId":790401,"requestNum":2,"skuId":816324},{"packageId":790406,"requestNum":2,"skuId":816324},{"packageId":790407,"requestNum":2,"skuId":816324},{"packageId":790413,"requestNum":2,"skuId":816324},{"packageId":790415,"requestNum":2,"skuId":816324},{"packageId":790420,"requestNum":2,"skuId":816324},{"packageId":790421,"requestNum":2,"skuId":816324},{"packageId":790428,"requestNum":2,"skuId":816324},{"packageId":832476,"requestNum":2,"skuId":816324},{"packageId":832478,"requestNum":2,"skuId":816324},{"packageId":832479,"requestNum":2,"skuId":816324},{"packageId":832482,"requestNum":2,"skuId"
:816324},{"packageId":832483,"requestNum":2,"skuId":816324}],"capacityByPriority":{816324:{0:104,2:112}},"locationsByPriority":{816324:{0:1,2:1}},"packageWaveMap":{790285:"3f33bf8ffc4a4f1fb2221f954cf641cb",790030:"794739d5e6d94924be7b48e45cd17a5d",790286:"3f33bf8ffc4a4f1fb2221f954cf641cb",790031:"794739d5e6d94924be7b48e45cd17a5d",790277:"3f33bf8ffc4a4f1fb2221f954cf641cb",790022:"794739d5e6d94924be7b48e45cd17a5d",790278:"3f33bf8ffc4a4f1fb2221f954cf641cb",790023:"794739d5e6d94924be7b48e45cd17a5d",790300:"3f33bf8ffc4a4f1fb2221f954cf641cb",790302:"3f33bf8ffc4a4f1fb2221f954cf641cb",790047:"794739d5e6d94924be7b48e45cd17a5d",790292:"3f33bf8ffc4a4f1fb2221f954cf641cb",790037:"794739d5e6d94924be7b48e45cd17a5d",790293:"3f33bf8ffc4a4f1fb2221f954cf641cb",790039:"794739d5e6d94924be7b48e45cd17a5d",790318:"3f33bf8ffc4a4f1fb2221f954cf641cb",790319:"3f33bf8ffc4a4f1fb2221f954cf641cb",790308:"3f33bf8ffc4a4f1fb2221f954cf641cb",790310:"3f33bf8ffc4a4f1fb2221f954cf641cb",790055:"794739d5e6d94924be7b48e45cd
17a5d",790048:"794739d5e6d94924be7b48e45cd17a5d",790076:"794739d5e6d94924be7b48e45cd17a5d",790334:"3f33bf8ffc4a4f1fb2221f954cf641cb",790073:"794739d5e6d94924be7b48e45cd17a5d",790326:"3f33bf8ffc4a4f1fb2221f954cf641cb",790327:"3f33bf8ffc4a4f1fb2221f954cf641cb",790064:"794739d5e6d94924be7b48e45cd17a5d",790065:"794739d5e6d94924be7b48e45cd17a5d",790349:"3f33bf8ffc4a4f1fb2221f954cf641cb",790095:"794739d5e6d94924be7b48e45cd17a5d",790351:"3f33bf8ffc4a4f1fb2221f954cf641cb",790344:"3f33bf8ffc4a4f1fb2221f954cf641cb",790084:"794739d5e6d94924be7b48e45cd17a5d",790342:"3f33bf8ffc4a4f1fb2221f954cf641cb",790083:"794739d5e6d94924be7b48e45cd17a5d",790365:"3f33bf8ffc4a4f1fb2221f954cf641cb",790104:"794739d5e6d94924be7b48e45cd17a5d",790105:"794739d5e6d94924be7b48e45cd17a5d",790363:"3f33bf8ffc4a4f1fb2221f954cf641cb",790357:"3f33bf8ffc4a4f1fb2221f954cf641cb",790358:"3f33bf8ffc4a4f1fb2221f954cf641cb",790097:"794739d5e6d94924be7b48e45cd17a5d",790121:"794739d5e6d94924be7b48e45cd17a5d",790377:"3f33bf8ffc4a4f1f
b2221f954cf641cb",790122:"794739d5e6d94924be7b48e45cd17a5d",790379:"3f33bf8ffc4a4f1fb2221f954cf641cb",790112:"794739d5e6d94924be7b48e45cd17a5d",790113:"794739d5e6d94924be7b48e45cd17a5d",790371:"3f33bf8ffc4a4f1fb2221f954cf641cb",790396:"3f33bf8ffc4a4f1fb2221f954cf641cb",790141:"794739d5e6d94924be7b48e45cd17a5d",790143:"794739d5e6d94924be7b48e45cd17a5d",790394:"3f33bf8ffc4a4f1fb2221f954cf641cb",790132:"794739d5e6d94924be7b48e45cd17a5d",790388:"3f33bf8ffc4a4f1fb2221f954cf641cb",790130:"794739d5e6d94924be7b48e45cd17a5d",790386:"3f33bf8ffc4a4f1fb2221f954cf641cb",790413:"3f33bf8ffc4a4f1fb2221f954cf641cb",790415:"3f33bf8ffc4a4f1fb2221f954cf641cb",790152:"794739d5e6d94924be7b48e45cd17a5d",790153:"794739d5e6d94924be7b48e45cd17a5d",790406:"3f33bf8ffc4a4f1fb2221f954cf641cb",790407:"3f33bf8ffc4a4f1fb2221f954cf641cb",790401:"3f33bf8ffc4a4f1fb2221f954cf641cb",790428:"3f33bf8ffc4a4f1fb2221f954cf641cb",790170:"794739d5e6d94924be7b48e45cd17a5d",790420:"3f33bf8ffc4a4f1fb2221f954cf641cb",790421:"3f33b
f8ffc4a4f1fb2221f954cf641cb",790161:"794739d5e6d94924be7b48e45cd17a5d",790163:"794739d5e6d94924be7b48e45cd17a5d",790189:"794739d5e6d94924be7b48e45cd17a5d",789929:"794739d5e6d94924be7b48e45cd17a5d",789930:"794739d5e6d94924be7b48e45cd17a5d",790187:"794739d5e6d94924be7b48e45cd17a5d",790178:"794739d5e6d94924be7b48e45cd17a5d",790179:"794739d5e6d94924be7b48e45cd17a5d",790204:"3f33bf8ffc4a4f1fb2221f954cf641cb",789949:"794739d5e6d94924be7b48e45cd17a5d",789946:"794739d5e6d94924be7b48e45cd17a5d",790203:"3f33bf8ffc4a4f1fb2221f954cf641cb",790196:"794739d5e6d94924be7b48e45cd17a5d",790197:"3f33bf8ffc4a4f1fb2221f954cf641cb",789938:"794739d5e6d94924be7b48e45cd17a5d",789939:"794739d5e6d94924be7b48e45cd17a5d",790220:"3f33bf8ffc4a4f1fb2221f954cf641cb",789965:"794739d5e6d94924be7b48e45cd17a5d",789967:"794739d5e6d94924be7b48e45cd17a5d",790219:"3f33bf8ffc4a4f1fb2221f954cf641cb",789956:"794739d5e6d94924be7b48e45cd17a5d",790212:"3f33bf8ffc4a4f1fb2221f954cf641cb",790213:"3f33bf8ffc4a4f1fb2221f954cf641cb",78
9955:"794739d5e6d94924be7b48e45cd17a5d",832476:"f9d94bece9f841fb9b9c3c1a25f31c8a",790237:"3f33bf8ffc4a4f1fb2221f954cf641cb",790238:"3f33bf8ffc4a4f1fb2221f954cf641cb",832478:"f9d94bece9f841fb9b9c3c1a25f31c8a",832479:"f9d94bece9f841fb9b9c3c1a25f31c8a",789977:"794739d5e6d94924be7b48e45cd17a5d",790228:"3f33bf8ffc4a4f1fb2221f954cf641cb",789975:"794739d5e6d94924be7b48e45cd17a5d",790227:"3f33bf8ffc4a4f1fb2221f954cf641cb",789998:"794739d5e6d94924be7b48e45cd17a5d",790249:"3f33bf8ffc4a4f1fb2221f954cf641cb",789988:"794739d5e6d94924be7b48e45cd17a5d",790246:"3f33bf8ffc4a4f1fb2221f954cf641cb",789985:"794739d5e6d94924be7b48e45cd17a5d",832482:"f9d94bece9f841fb9b9c3c1a25f31c8a",832483:"f9d94bece9f841fb9b9c3c1a25f31c8a",790269:"3f33bf8ffc4a4f1fb2221f954cf641cb",790014:"794739d5e6d94924be7b48e45cd17a5d",790015:"794739d5e6d94924be7b48e45cd17a5d",790271:"3f33bf8ffc4a4f1fb2221f954cf641cb",790004:"794739d5e6d94924be7b48e45cd17a5d",790006:"794739d5e6d94924be7b48e45cd17a5d",790262:"3f33bf8ffc4a4f1fb2221f954
cf641cb",790256:"3f33bf8ffc4a4f1fb2221f954cf641cb",790258:"3f33bf8ffc4a4f1fb2221f954cf641cb"},"skuLocationsByPriority":{816324:{0:[{"availableQty":104,"locationId":318654,"priority":0,"skuId":816324}],2:[{"availableQty":112,"locationId":318653,"priority":2,"skuId":816324}]}},"skuTotalDemand":{816324:234},"totalCapacity":{816324:216},"totalLocations":{816324:2},"waveDemand":{"794739d5e6d94924be7b48e45cd17a5d":112,"f9d94bece9f841fb9b9c3c1a25f31c8a":10,"3f33bf8ffc4a4f1fb2221f954cf641cb":112},"waveLocations":{"f9d94bece9f841fb9b9c3c1a25f31c8a":[318654,318653],"794739d5e6d94924be7b48e45cd17a5d":[318654,318653],"3f33bf8ffc4a4f1fb2221f954cf641cb":[318654,318653]},"wavePackages":{"794739d5e6d94924be7b48e45cd17a5d":[789929,789930,789938,789939,789946,789949,789955,789956,789965,789967,789975,789977,789985,789988,789998,790004,790006,790014,790015,790022,790023,790030,790031,790037,790039,790047,790048,790055,790064,790065,790073,790076,790083,790084,790095,790097,790104,790105,790112,790113,
790121,790122,790130,790132,790141,790143,790152,790153,790161,790163,790170,790178,790179,790187,790189,790196],"f9d94bece9f841fb9b9c3c1a25f31c8a":[832476,832478,832479,832482,832483],"3f33bf8ffc4a4f1fb2221f954cf641cb":[790197,790203,790204,790212,790213,790219,790220,790227,790228,790237,790238,790246,790249,790256,790258,790262,790269,790271,790277,790278,790285,790286,790292,790293,790300,790302,790308,790310,790318,790319,790326,790327,790334,790342,790344,790349,790351,790357,790358,790363,790365,790371,790377,790379,790386,790388,790394,790396,790401,790406,790407,790413,790415,790420,790421,790428]}},"totalAllocated":216,"waveInfoRespList":[{"packageInfoList":[{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":789929,"skuId":816324}],"packageId":789929,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":789930,"skuId":816324}],"packageId":789930,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"pack
ageId":789938,"skuId":816324}],"packageId":789938,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":789939,"skuId":816324}],"packageId":789939,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":789946,"skuId":816324}],"packageId":789946,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":789949,"skuId":816324}],"packageId":789949,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":789955,"skuId":816324}],"packageId":789955,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":789956,"skuId":816324}],"packageId":789956,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":789965,"skuId":816324}],"packageId":789965,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":789967,"skuId":816324}],"packageId":789967,"status":"1"},{"locationInfoList":[{"allocatedQty":
2,"locationId":318653,"packageId":789975,"skuId":816324}],"packageId":789975,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":789977,"skuId":816324}],"packageId":789977,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":789985,"skuId":816324}],"packageId":789985,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":789988,"skuId":816324}],"packageId":789988,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":789998,"skuId":816324}],"packageId":789998,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790004,"skuId":816324}],"packageId":790004,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790006,"skuId":816324}],"packageId":790006,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790014,"skuId":816324}],"packageId":790014,"status":"1"},{"location
InfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790015,"skuId":816324}],"packageId":790015,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790022,"skuId":816324}],"packageId":790022,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790023,"skuId":816324}],"packageId":790023,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790030,"skuId":816324}],"packageId":790030,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790031,"skuId":816324}],"packageId":790031,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790037,"skuId":816324}],"packageId":790037,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790039,"skuId":816324}],"packageId":790039,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790047,"skuId":816324}],"packageId":7900
47,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790048,"skuId":816324}],"packageId":790048,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790055,"skuId":816324}],"packageId":790055,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790064,"skuId":816324}],"packageId":790064,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790065,"skuId":816324}],"packageId":790065,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790073,"skuId":816324}],"packageId":790073,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790076,"skuId":816324}],"packageId":790076,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790083,"skuId":816324}],"packageId":790083,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790084,"skuId
":816324}],"packageId":790084,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790095,"skuId":816324}],"packageId":790095,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790097,"skuId":816324}],"packageId":790097,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790104,"skuId":816324}],"packageId":790104,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790105,"skuId":816324}],"packageId":790105,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790112,"skuId":816324}],"packageId":790112,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790113,"skuId":816324}],"packageId":790113,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790121,"skuId":816324}],"packageId":790121,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":31865
3,"packageId":790122,"skuId":816324}],"packageId":790122,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790130,"skuId":816324}],"packageId":790130,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790132,"skuId":816324}],"packageId":790132,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790141,"skuId":816324}],"packageId":790141,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790143,"skuId":816324}],"packageId":790143,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790152,"skuId":816324}],"packageId":790152,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790153,"skuId":816324}],"packageId":790153,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790161,"skuId":816324}],"packageId":790161,"status":"1"},{"locationInfoList":[{"allocat
edQty":2,"locationId":318653,"packageId":790163,"skuId":816324}],"packageId":790163,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790170,"skuId":816324}],"packageId":790170,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790178,"skuId":816324}],"packageId":790178,"status":"1"},{"locationInfoList":[],"packageId":790179,"status":"2"},{"locationInfoList":[],"packageId":790187,"status":"2"},{"locationInfoList":[],"packageId":790189,"status":"2"},{"locationInfoList":[],"packageId":790196,"status":"2"}],"totalAllocated":104,"waveCode":"794739d5e6d94924be7b48e45cd17a5d"},{"packageInfoList":[{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790197,"skuId":816324}],"packageId":790197,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790203,"skuId":816324}],"packageId":790203,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790
204,"skuId":816324}],"packageId":790204,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790212,"skuId":816324}],"packageId":790212,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790213,"skuId":816324}],"packageId":790213,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790219,"skuId":816324}],"packageId":790219,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790220,"skuId":816324}],"packageId":790220,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790227,"skuId":816324}],"packageId":790227,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790228,"skuId":816324}],"packageId":790228,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790237,"skuId":816324}],"packageId":790237,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locatio
nId":318654,"packageId":790238,"skuId":816324}],"packageId":790238,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790246,"skuId":816324}],"packageId":790246,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790249,"skuId":816324}],"packageId":790249,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790256,"skuId":816324}],"packageId":790256,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790258,"skuId":816324}],"packageId":790258,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790262,"skuId":816324}],"packageId":790262,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790269,"skuId":816324}],"packageId":790269,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790271,"skuId":816324}],"packageId":790271,"status":"1"},{"locationInfoList":
[{"allocatedQty":2,"locationId":318654,"packageId":790277,"skuId":816324}],"packageId":790277,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790278,"skuId":816324}],"packageId":790278,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790285,"skuId":816324}],"packageId":790285,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790286,"skuId":816324}],"packageId":790286,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790292,"skuId":816324}],"packageId":790292,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790293,"skuId":816324}],"packageId":790293,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790300,"skuId":816324}],"packageId":790300,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790302,"skuId":816324}],"packageId":790302,"status
":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790308,"skuId":816324}],"packageId":790308,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790310,"skuId":816324}],"packageId":790310,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790318,"skuId":816324}],"packageId":790318,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790319,"skuId":816324}],"packageId":790319,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790326,"skuId":816324}],"packageId":790326,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790327,"skuId":816324}],"packageId":790327,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790334,"skuId":816324}],"packageId":790334,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790342,"skuId":816324}]
,"packageId":790342,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790344,"skuId":816324}],"packageId":790344,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790349,"skuId":816324}],"packageId":790349,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790351,"skuId":816324}],"packageId":790351,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790357,"skuId":816324}],"packageId":790357,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790358,"skuId":816324}],"packageId":790358,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790363,"skuId":816324}],"packageId":790363,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790365,"skuId":816324}],"packageId":790365,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"package
Id":790371,"skuId":816324}],"packageId":790371,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790377,"skuId":816324}],"packageId":790377,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790379,"skuId":816324}],"packageId":790379,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790386,"skuId":816324}],"packageId":790386,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790388,"skuId":816324}],"packageId":790388,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790394,"skuId":816324}],"packageId":790394,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790396,"skuId":816324}],"packageId":790396,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790401,"skuId":816324}],"packageId":790401,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"
locationId":318654,"packageId":790406,"skuId":816324}],"packageId":790406,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790407,"skuId":816324}],"packageId":790407,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318654,"packageId":790413,"skuId":816324}],"packageId":790413,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790415,"skuId":816324}],"packageId":790415,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790420,"skuId":816324}],"packageId":790420,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790421,"skuId":816324}],"packageId":790421,"status":"1"},{"locationInfoList":[{"allocatedQty":2,"locationId":318653,"packageId":790428,"skuId":816324}],"packageId":790428,"status":"1"}],"totalAllocated":112,"waveCode":"3f33bf8ffc4a4f1fb2221f954cf641cb"},{"packageInfoList":[],"totalAllocated":0,"waveCode":"f9d94bece9f841fb9b9
c3c1a25f31c8a"}]}
```
### Current Behavior
<img width="706" alt="Image"
src="https://github.com/user-attachments/assets/6e128675-716d-4b33-be14-09bcc9098e7f"
/>
### Expected Behavior
<img width="1250" alt="Image"
src="https://github.com/user-attachments/assets/5da69c94-ac71-4b3a-9a27-1aa8a286c796"
/>
### Environment
```markdown
- OS: OSX
- Browser: Chrome
- Framework: CDN use with htm&js
```
### Any additional comments?
_No response_
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]