526互联

12.15

发布时间 2023-12-18 13:10:29作者: 七安。
AGENT/agent.html 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>房产经纪人页面</title>
    <style>
        .form {
            width: 600px;
            margin: 0 auto;
            /*border: 1px solid red;*/
        }

        .form table {
            margin: 0 auto;
        }

        .form table tr td {
            width: 100px;
            height: 30px;
            border: 1px solid #000;
            text-align: center;
        }

        button {
            display: block;
            margin-top: 10px;
            padding: 10px;
            background-color: #007bff;
            color: #fff;
            border: none;
            border-radius: 3px;
            cursor: pointer;
        }
    </style>
</head>
<body>
<h1 style="text-align: center">房产经纪人系统</h1>
<div class="form">
    <table border="1px" cellspacing="0" width="600px">
        <tr>
            <th>编号</th>
            <th>功能</th>
        </tr>
        <tr>
            <td>1</td>
            <td>
                <button id="select">查看个人信息</button>
            </td>
        </tr>
        <tr>
            <td>2</td>
            <td>
                <button id="select2">浏览房产信息</button>
            </td>
        </tr>
        <tr>
            <td>3</td>
            <td>
                <button id="add">增加房产经纪人</button>
            </td>
        </tr>
        <tr>
            <td>4</td>
            <td>
                <button id="update">修改信息</button>
            </td>
        </tr>
        <tr>
            <td>5</td>
            <td>
                <button id="select1">查询信息</button>
            </td>
        </tr>
        <tr>
            <td>6</td>
            <td>
                <button id="reset">重置密码</button>
            </td>
        </tr>
    </table>
</div>
</body>
<script>
    var urlParams = new URLSearchParams(window.location.search);
    var username = urlParams.get('username');
    console.log(username);
    document.getElementById("select").addEventListener("click", function () {
        window.location.href = "../selectID.html?username=" + username;
    });
    document.getElementById('select2').addEventListener('click', function () {
        window.location.href = "../CUSTOMER/select2.html";
    });
    document.getElementById("add").addEventListener("click", function () {
        window.location.href = "addAgent.html";
    });
    document.getElementById('update').addEventListener('click', function () {
        window.location.href = "update.html";
    });
    document.getElementById("select1").addEventListener("click", function () {
        window.location.href = "select.html";
    });
    document.getElementById("reset").addEventListener("click", function () {
        window.location.href = "../updatePassword.html?username=" + username;
    });
</script>
</html>

CUSTOMER/customer.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>顾客页面</title>
    <style>
        .form {
            width: 600px;
            margin: 0 auto;
            /*border: 1px solid red;*/
        }

        .form table {
            margin: 0 auto;
        }

        .form table tr td {
            width: 100px;
            height: 30px;
            border: 1px solid #000;
            text-align: center;
        }

        button {
            display: block;
            margin-top: 10px;
            padding: 10px;
            background-color: #007bff;
            color: #fff;
            border: none;
            border-radius: 3px;
            cursor: pointer;
        }
    </style>
</head>
<body>
<h1 style="text-align: center">顾客系统</h1>
<div class="form">
    <table border="1px" cellspacing="0" width="600px">
        <tr>
            <th>编号</th>
            <th>功能</th>
        </tr>
        <tr>
            <td>1</td>
            <td>
                <button id="select">查看个人信息</button>
            </td>
        </tr>
        <tr>
            <td>2</td>
            <td>
                <button id="select2">浏览房产信息</button>
            </td>
        </tr>
        <tr>
            <td>4</td>
            <td>
                <button id="update">修改信息</button>
            </td>
        </tr>
        <tr>
            <td>5</td>
            <td>
                <button id="select1">查询信息</button>
            </td>
        </tr>
        <tr>
            <td>6</td>
            <td>
                <button id="reset">重置密码</button>
            </td>
        </tr>
    </table>
</div>
</body>
<script>
    var urlParams = new URLSearchParams(window.location.search);
    var username = urlParams.get('username');
    console.log(username);
    document.getElementById("select").addEventListener("click", function () {
        window.location.href = "../selectID.html?username=" + username;
    });
    document.getElementById("select2").addEventListener("click", function () {
        window.location.href = "select2.html?username=" + username;
    });
    document.getElementById('update').addEventListener('click', function () {
        window.location.href = "update.html";
    });
    document.getElementById("select1").addEventListener("click", function () {
        window.location.href = "select.html";
    });
    document.getElementById("reset").addEventListener("click", function () {
        window.location.href = "../updatePassword.html?username=" + username;
    });
</script>
</html>

CUSTOMER/register.HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>顾客注册</title>
    <style>
        button {
            display: block;
            margin-top: 10px;
            padding: 10px;
            background-color: #007bff;
            color: #fff;
            border: none;
            border-radius: 3px;
            cursor: pointer;
        }

        .centered-form {
            text-align: center;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            height: 100vh;
        }

        .bordered-form {
            border: 2px solid #000; /* 边框样式 */
            padding: 20px; /* 可选的内边距 */
            background-color: #f0f0f0; /* 可选的背景颜色 */
        }
    </style>
</head>
<body>
<div class="centered-form">
    <div class="bordered-form">
        <h1>学生注册</h1>
        <form id="register">

            <label for="id">顾客ID:</label><input type="text" id="id">
            <br>
            <label for="StuName">姓名:</label><input type="text" id="StuName">
            <br>
            <label>性别:</label>
            <div id="sex">
                <label><input type="radio" name="sex" value="男"> 男</label>
                <label><input type="radio" name="sex" value="女"> 女</label>
            </div>
            <label for="Phone">手机号:</label><input type="text" id="Phone">
            <br>
            <label for="IdNumber">身份证号:</label><input type="text" id="IdNumber">
            <br>
            <label for="Position">住址:</label>
            <input type="text" id="Position"
                   pattern="[\u4e00-\u9fa5]{2,4}(?:省|自治区|市)?[\u4e00-\u9fa5]{2,4}(?:市|自治州)?[\u4e00-\u9fa5]{2,4}(?:区|县|市|旗)?[\u4e00-\u9fa5]{2,20}(?:街道|镇)?[\u4e00-\u9fa5]{2,20}(?:小区)?[\u4e00-\u9fa5\d]{1,10}(?:号楼)?[\u4e00-\u9fa5\d]{1,10}(?:单元)?[\u4e00-\u9fa5\d]{1,10}(?:门牌)?">
            <span>家庭住址（地址格式：XX省XX市XX区（县）XX街道XX小区XX号楼XX单元XXX门牌）</span>
            <div class="centered-buttons">
                <button type="submit" style="display: block; margin: 0 auto;">注册</button>
            </div>
        </form>
    </div>
</div>
</body>
<script>
    document.getElementById('register').addEventListener('submit', function (event) {
        event.preventDefault();
        const id = document.getElementById('id');
        const StuName = document.getElementById('StuName');
        const sex = document.querySelectorAll('input[name="sex"]');
        let s;
        sex.forEach(radio => {
            if (radio.checked) {
                s = radio.value;
                alert(s);
            }
        });
        const Phone = document.getElementById('Phone');
        const IdNumber = document.getElementById('IdNumber');
        const Position = document.getElementById('Position');
        console.log(id.value + StuName.value + s + Phone.value + " " + IdNumber.value + " " + Position.value);
        const requestUrl = 'http://localhost:8080/user/add';
        fetch(requestUrl, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify(
                {
                    id: id.value,
                    name: StuName.value,
                    sex: s,
                    phone: Phone.value,
                    idNumber: IdNumber.value,
                    position: Position.value,
                    state: 0
                })
        })
            .then(res => res.json())
            .then(data => {
                if (data.msg === 'success') {
                    alert("添加成功,请等待审核");
                    console.log(data);
                } else {
                    alert("添加失败  " + data.msg);
                }
            })
            .catch(error => {
                alert("请求失败，请重试");
                console.error(error);
            });
    })
</script>
</html>

CUSTOMER/select2.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>浏览房产信息</title>
    <style>
        .reSet {
            background-color: #4CAF50;
            color: white;
            border: none;
            padding: 10px 20px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 16px;
            margin: 4px 2px;
            cursor: pointer;
        }

        .form {
            width: 600px;
            margin: 0 auto;
            /*border: 1px solid red;*/
        }

        .form table {
            margin: 0 auto;
        }

        .form table tr td {
            width: 100px;
            height: 30px;
            border: 1px solid #000;
            text-align: center;
        }

        button {
            display: block;
            margin-top: 10px;
            padding: 10px;
            background-color: #007bff;
            color: #fff;
            border: none;
            border-radius: 3px;
            cursor: pointer;
        }

        .centered-form {
            text-align: center;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            height: 100vh;
        }

        .bordered-form {
            border: 2px solid #000; /* 边框样式 */
            padding: 20px; /* 可选的内边距 */
            background-color: #f0f0f0; /* 可选的背景颜色 */
        }
    </style>
</head>
<body>
<div class="centered-form">
    <div class="bordered-form">
        <div class="form">
            <div id="container">

            </div>
        </div>
    </div>
</div>
</body>
<script>
    var urlParams = new URLSearchParams(window.location.search);
    var username = urlParams.get('username');
    console.log(username);
    const url = `http://localhost:8080/user/selectUsers/${username}`;
    fetch(url, {
        method: 'GET',
        headers: {
            'Content-Type': 'application/json'
        }
    })
        .then(res => res.json())
        .then(data => {
            if (data.msg === 'success') {
                console.log(data);
                if (data.data.position === '系统管理员') {
                    deal1();
                } else if (data.data.position === '顾客') {
                    deal2("在售");
                } else if (data.data.position === '房产经纪') {
                    deal3(username);
                }
                alert("登陆成功");
            } else {
                alert("登录失败");
                console.log(data);
            }
        })
        .catch(error => {
            alert("请求失败");
            console.error(error);
        });
</script>
<script>
    function deal1() {
        const requestUrl = `http://localhost:8080/user/selectHouse`;
        fetch(requestUrl,
            {
                method: 'GET',
                headers: {
                    'Content-Type': 'application/json'
                },
            })
            .then(response => response.json())
            .then(data => {
                if (data.msg === 'success') {
                    console.log(data);
                    generateTable(data.data);
                } else {
                    alert("房产不存在");
                }
            })
            .catch(error => {
                alert("请求失败，请重试");
                console.error(error);
            });
    }

    function deal2(type) {
        const requestUrl = `http://localhost:8080/user/selectHouse2/${type}`;
        fetch(requestUrl,
            {
                method: 'GET',
                headers: {
                    'Content-Type': 'application/json'
                },
            })
            .then(response => response.json())
            .then(data => {
                if (data.msg === 'success') {
                    console.log(data);
                    generateTable(data.data);
                } else {
                    alert("房产不存在");
                }
            })
            .catch(error => {
                alert("请求失败，请重试");
                console.error(error);
            });
    }

    function deal3(username) {
        const requestUrl = `http://localhost:8080/user/selectHouse3/${username}`;
        fetch(requestUrl,
            {
                method: 'GET',
                headers: {
                    'Content-Type': 'application/json'
                },
            })
            .then(response => response.json())
            .then(data => {
                if (data.msg === 'success') {
                    console.log(data);
                    generateTable(data.data);
                } else {
                    alert("房产不存在");
                }
            })
            .catch(error => {
                alert("请求失败，请重试");
                console.error(error);
            });
    }
</script>
<script>
    const requestUrl = `http://localhost:8080/user/selectHouse`;
    fetch(requestUrl,
        {
            method: 'GET',
            headers: {
                'Content-Type': 'application/json'
            },
        })
        .then(response => response.json())
        .then(data => {
            if (data.msg === 'success') {
                console.log(data);
                generateTable(data.data);
            } else {
                alert("房产不存在");
            }
        })
        .catch(error => {
            alert("请求失败，请重试");
            console.error(error);
        });
</script>
<script>
    function generateTable(data) {
        const tableContainer = document.getElementById("container");
        // 清空 tableContainer 中的所有子节点
        while (tableContainer.hasChildNodes()) {
            tableContainer.removeChild(tableContainer.firstChild);
        }
        const table = document.createElement("table");
        const tableBody = document.createElement("tbody");
        let row = document.createElement("tr");
        row.innerHTML = '<td>编号</td><td>户型</td><td>地址</td><td>年份</td><td>建造面积</td><td>销售报价</td><td>销售状态</td><td>房产经纪人ID</td><td>顾客ID</td>';
        tableBody.appendChild(row);
        // 查询方式是按姓名查询或多条查询
        for (let i = 0; i < data.length; i++) {
            row = document.createElement("tr");
            row.innerHTML = `<td>${data[i].id}</td>${data[i].type}<td>${data[i].position}</td><td>${data[i].year}</td><td>${data[i].area}</td><td>${data[i].much}</td><td>${data[i].state}</td><td>${data[i].agentID}</td><td>${data[i].userID}</td>`;
            tableBody.appendChild(row);
            table.appendChild(tableBody);
            tableContainer.appendChild(table);
        }
    }
</script>
</html>