101 lines
4.5 KiB
HTML
101 lines
4.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Power BI Measure Call Graph</title>
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/style.css') }}">
|
|
<!-- D3.js for visualization -->
|
|
<script src="https://d3js.org/d3.v7.min.js"></script>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<header>
|
|
<h1>Power BI Measure Call Graph</h1>
|
|
</header>
|
|
|
|
<div class="connection-panel">
|
|
<h2>Connect to Analysis Services</h2>
|
|
<div class="connection-form">
|
|
<div class="form-group">
|
|
<label for="server">Server:</label>
|
|
<input type="text" id="server" placeholder="localhost">
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="database">Database:</label>
|
|
<input type="text" id="database" placeholder="AdventureWorks">
|
|
</div>
|
|
</div>
|
|
<button id="connect-btn">Connect</button>
|
|
<div id="connection-status"></div>
|
|
</div>
|
|
|
|
<div class="main-content">
|
|
<div class="visualization-container">
|
|
<div class="controls">
|
|
<button id="reset-btn">Reset View</button>
|
|
<div class="search-box">
|
|
<input type="text" id="search-input" placeholder="Search measures...">
|
|
</div>
|
|
</div>
|
|
<div id="graph-container"></div>
|
|
<div id="graph-container-detail">
|
|
<h3>Selected Measure Details</h3>
|
|
<button id="reset-detail-btn" class="reset-btn" title="Reset view">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M3 12a9 9 0 1 0 18 0 9 9 0 0 0-18 0z"></path>
|
|
<path d="M17 12H7"></path>
|
|
<path d="M12 17V7"></path>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
setTimeout(function() {
|
|
const resetDetailBtn = document.getElementById('reset-detail-btn');
|
|
if (resetDetailBtn) {
|
|
resetDetailBtn.click();
|
|
}
|
|
}, 800);
|
|
|
|
// 添加一个MutationObserver来监视图表内容变化
|
|
const detailContainer = document.getElementById('graph-container-detail');
|
|
if (detailContainer) {
|
|
const observer = new MutationObserver(function(mutations) {
|
|
const hasContentChanges = mutations.some(mutation =>
|
|
mutation.type === 'childList' &&
|
|
(mutation.addedNodes.length > 0 || mutation.removedNodes.length > 0)
|
|
);
|
|
|
|
if (hasContentChanges) {
|
|
setTimeout(function() {
|
|
const resetDetailBtn = document.getElementById('reset-detail-btn');
|
|
if (resetDetailBtn) {
|
|
resetDetailBtn.click();
|
|
}
|
|
}, 500);
|
|
}
|
|
});
|
|
|
|
observer.observe(detailContainer, {
|
|
childList: true,
|
|
subtree: true
|
|
});
|
|
}
|
|
});
|
|
</script>
|
|
</div>
|
|
|
|
<div class="measure-details">
|
|
<h2>Measure Details</h2>
|
|
<div id="measure-name"></div>
|
|
<pre id="measure-expression"></pre>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="{{ url_for('static', filename='js/graph.js') }}"></script>
|
|
<script src="{{ url_for('static', filename='js/app.js') }}"></script>
|
|
</body>
|
|
</html>
|