前后端分离计算器

前后端分离计算器
这个作业属于哪个课程	https://bbs.csdn.net/forums/ssynkqtd-05
这个作业要求在哪里	https://bbs.csdn.net/topics/617377308
这个作业的目标	实现前后端分离计算器
其他参考文献	无

git仓库链接和代码规范链接

前端：https://github.com/zhironggu/cal_adv
后端：https://github.com/zhironggu/cal_advanced

PSP表格

PSP	Personal Software Process Stages	预估耗时（分钟）	实际耗时（分钟）
Planning	计划	30	30
Estimate	估计这个任务需要多少时间	2000	3500
Development	开发	500	800
Analysis	需求分析 (包括学习新技术）	300	500
Design Spec	生成设计文档	40	60
Design Review	设计复审	20	20
Coding Standard	代码规范 (为目前的开发制定合适的规范)	20	20
Design	具体设计	60	80
Coding	具体编码	1000	1500
Code Review	代码复审	30	30
Test	测试（自我测试，修改代码，提交修改）	60	60
Reporting	报告	60	60
Test Report	测试报告	30	30
Size Measurement	计算工作量	10	10
Postmortem & Process Improvement Plan	事后总结, 并提出过程改进计划	60	60
	合计	3000	4000

成品展示

利率计算器：

video1

科学计算器：

计算过程：

video2

数据库历史记录：

video3

设计实现过程

前端：html+css+js 前端三件套。

后端：用nodejs 实现。

数据库：存历史记录以及利率表。

代码说明

1.科学计算器的运算功能

function compute(v) {
    if (v.innerText == "AC") {//清零
        willSum = "";
        idText.value = "0";

    } else if (v.innerText == "Back") {//回退
        if (idText.value.length > 0) {
            willSum = willSum.substring(0, willSum.length - 1);
            idText.value = willSum;
        }

    } else if (cheak(v.innerText) == true) {//小数点和运算符处理
        var ch;
        if (v.innerText == "X") {//乘法处理
            ch = "*";
        } else {
            ch = v.innerText
        }
        if (ch != willSum.charAt(willSum.length - 1) && !cheak(willSum.charAt(willSum.length - 1))) {
            willSum += ch;
            idText.value = willSum;
        }

    } else if (v.innerText == "=") {
        //求值
        window.eval("willSum = " + idText.value)

        idText.value = idText.value + "=" + willSum;
        willSum = "";
        axios.post("http://127.0.0.1:3000/addHistory", {"expression": idText.value}).then(res => {
            console.log(res)
        })

    } else {
        willSum += v.innerText;
        idText.value = willSum;
    }

}

2.存款计算

document.getElementById("calculate-deposit").onclick = () => {
    const amount = parseFloat(document.getElementById("amount").value);
    const time = parseFloat(document.getElementById("time").value);
    axios.get(`http://127.0.0.1:3000/getDepositInterestRate?time=${time}`)
        .then(res => {
            const rate = res.data.rate;
            const interest = amount * (rate / 100) * (time / 12);
            document.getElementById("result").textContent = `存款利息：${interest.toFixed(2)}`;
        });
};

3.贷款计算

ocument.getElementById("calculate-loan").onclick = () => {
    const amount = parseFloat(document.getElementById("amount").value);
    const time = parseFloat(document.getElementById("time").value);
    if (time < 6) {D

        alert("贷款时间不能低于6个月!")
        return;
    }
    axios.get(`http://127.0.0.1:3000/getLendingRate?time=${time}`)
        .then(res => {
            const rate = res.data.rate;
            const interest = amount * (rate / 100 / 12) * time;
            document.getElementById("result").textContent = `贷款利息：${interest.toFixed(2)}`;
        });
};

4.存款利率

router.get('/getDepositInterestRate', function (req, res) {
    let time = req.query.time;
    let sql
    if (time < 3) {
        sql = 'select * from deposit_rate where month = 0';
    } else if (time <= 6) {
        sql = 'select * from deposit_rate where month = 3';
    } else if (time <= 12) {
        sql = 'select * from deposit_rate where month = 6';
    } else if (time <= 24) {
        sql = 'select * from deposit_rate where month = 12';
    } else if (time <= 36) {
        sql = 'select * from deposit_rate where month = 24';
    } else if (time <= 60) {
        sql = 'select * from deposit_rate where month = 36';
    } else {
        sql = 'select * from deposit_rate where month = 60';
    }
    connection.query(sql, (err, result) => {
        if (err) {
            console.log(err.message);
            res.send(err.message);

        } else {
            res.send(result[0]);
        }
    })
})

5.贷款利率

router.get('/getLendingRate', function (req, res) {

    let time = req.query.time;
    let sql
    if (time > 6 && time<12) {
        sql = 'select * from lending_rate where month = 6';
    } else if (time == 12) {
        sql = 'select * from lending_rate where month = 12';
    } else if (time > 12 &&time < 36) {
        sql = 'select * from lending_rate where month = 36';
    } else if (time > 36 &&time < 60) {
        sql = 'select * from lending_rate where month = 60';
    } else  {
        sql = 'select * from lending_rate where month = -1';
    }
    connection.query(sql, (err, result) => {
        if (err) {
            console.log(err.message);
            res.send(err.message);

        } else {
            res.send(result[0]);
        }
    })
})

心路历程和收获

通过这次作业，我充分了解到了前后端开发的基本模式。我使用html，css，js来开发前端，通过nodejs实现前后端交互，学会连接数据库，受益匪浅，也让我认识到自己的不足，明确了今后的努力方向。