38 lines
812 B
Svelte
38 lines
812 B
Svelte
|
<script>
|
||
|
|
import CalculatorDisplay from './CalculatorDisplay.svelte';
|
||
|
|
import CalculatorKeyboard from './CalculatorKeyboard.svelte';
|
||
|
|
|
||
|
|
let currentInput = '';
|
||
|
|
let result = '0';
|
||
|
|
|
||
|
|
function handleKeyPress(key) {
|
||
|
|
if (key === 'C') {
|
||
|
|
currentInput = '';
|
||
|
|
result = '0';
|
||
|
|
} else if (key === '=') {
|
||
|
|
try {
|
||
|
|
result = eval(currentInput);
|
||
|
|
} catch {
|
||
|
|
result = 'Error';
|
||
|
|
}
|
||
|
|
} else {
|
||
|
|
currentInput += key;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<main>
|
||
|
|
<CalculatorDisplay displayValue={currentInput || result} />
|
||
|
|
<CalculatorKeyboard onKeyPress={handleKeyPress} />
|
||
|
|
</main>
|
||
|
|
|
||
|
|
<style lang="scss">
|
||
|
|
main {
|
||
|
|
max-width: 400px;
|
||
|
|
margin: 0 auto;
|
||
|
|
background-color: #f5f5f5;
|
||
|
|
padding: 20px;
|
||
|
|
border-radius: 10px;
|
||
|
|
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
|
||
|
|
}
|
||
|
|
</style>
|