Commit ce32eeac authored by 时海鑫's avatar 时海鑫

first commit2

parent 0fc55007
const statusMap = ["下载", "编译", "文件处理", "文件上传", "完成"];
const notifyMap = ["未开启", "发送失败", "已发送"];
const typeMap = ["KELL", "IAR_EW_940", "IAR_EW_850", "IAR_PM", "GHS", "GCC"];
// 加载数据函数
function loadData(queryParams = "") {
fetch("/query_all" + queryParams) <!-- 这是刷新按钮点击时调用的接口 -->
.then(response => response.json())
.then(data => {
console.log(data); // 调试用,查看返回的数据格式
const tableBody = document.getElementById("recordTableBody");
const noRecordMsg = document.getElementById("no-record");
tableBody.innerHTML = ""; // 清空表格
if (data.status === "success" && data.data.length > 0) {
data.data.forEach(item => {
const row = document.createElement("tr");
row.innerHTML = `
<td>${item.id}</td>
<td>${item.project_name}</td>
<td>${item.project_group}</td>
<td>${item.builder}</td>
<td>${item.create_time}</td>
<td>${item.build_time}</td>
<td>${statusMap[item.status]}</td>
<td>${notifyMap[item.wechat_notify]}</td>
<td>${notifyMap[item.email_notify]}</td>
<td>${typeMap[item.build_type]}</td>
`;
tableBody.appendChild(row);
});
noRecordMsg.style.display = "none"; // 隐藏没有记录的提示
} else {
noRecordMsg.style.display = "block"; // 显示没有记录的提示
}
})
.catch(error => {
console.error("Error:", error);
alert("加载数据时发生错误,请稍后重试!");
});
}
// 搜索数据函数
function searchData(queryParams = "") {
fetch("/get_filtered_records" + queryParams) <!-- 这是搜索按钮点击时调用的接口 -->
.then(response => response.json())
.then(data => {
console.log(data); // 调试用,查看返回的数据格式
const tableBody = document.getElementById("recordTableBody");
const noRecordMsg = document.getElementById("no-record");
tableBody.innerHTML = ""; // 清空表格
if (data.status === "success" && data.data.length > 0) {
data.data.forEach(item => {
const row = document.createElement("tr");
row.innerHTML = `
<td>${item.id}</td>
<td>${item.project_name}</td>
<td>${item.project_group}</td>
<td>${item.builder}</td>
<td>${item.create_time}</td>
<td>${item.build_time}</td>
<td>${statusMap[item.status]}</td>
<td>${notifyMap[item.wechat_notify]}</td>
<td>${notifyMap[item.email_notify]}</td>
<td>${typeMap[item.build_type]}</td>
`;
tableBody.appendChild(row);
});
noRecordMsg.style.display = "none"; // 隐藏没有记录的提示
} else {
noRecordMsg.style.display = "block"; // 显示没有记录的提示
}
})
.catch(error => {
console.error("Error:", error);
alert("加载数据时发生错误,请稍后重试!");
});
}
// 获取搜索表单的查询参数
function getQueryParams() {
const projectName = document.getElementById("project_name").value.trim();
const builder = document.getElementById("builder").value.trim();
const createTime = document.getElementById("create_time").value.trim();
let queryParams = "";
if (projectName) {
queryParams += `?project_name=${encodeURIComponent(projectName)}`;
}
if (builder) {
queryParams += (queryParams ? `&` : `?`) + `builder=${encodeURIComponent(builder)}`;
}
if (createTime) {
queryParams += (queryParams ? `&` : `?`) + `create_time=${encodeURIComponent(createTime)}`;
}
return queryParams;
}
// 点击搜索按钮时触发
document.getElementById("searchBtn").addEventListener("click", function (event) {
event.preventDefault(); // 防止表单提交
const queryParams = getQueryParams(); // 获取查询参数
searchData(queryParams); // 调用 searchData 进行模糊查询
});
// 自动触发刷新
document.getElementById("refreshBtn").addEventListener("click", function () {
const queryParams = getQueryParams(); // 获取查询参数
loadData(queryParams); // 调用 loadData 刷新数据
});
window.onload = loadData(""); // 默认加载所有数据
\ No newline at end of file
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>天有为电子 - 查询记录</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
body {
background: url('https://n.sinaimg.cn/sinakd20241018s/400/w1280h720/20241018/3443-ceb0861393e44b7fd13f943574a49737.png') no-repeat center center fixed;
background-size: cover;
font-family: "Microsoft YaHei", sans-serif;
}
.query-container {
backdrop-filter: blur(12px);
background-color: rgba(255,255,255,0.1);
padding: 40px;
border-radius: 20px;
box-shadow: 0 8px 32px rgba(0,0,0,0.3);
max-width: 1200px;
margin: auto;
margin-top: 60px;
}
.query-title {
color: #fff;
margin-bottom: 30px;
text-align: center;
font-size: 28px;
font-weight: bold;
}
label, th, td {
color: #fff;
}
.form-label {
font-weight: bold;
}
.table {
background-color: rgba(255,255,255,0.2);
}
/* 设置表格的边框和布局 */
table {
width: 100%;
table-layout: fixed; /* 自动调节列宽,避免滚动条 */
border-collapse: collapse;
font-family: Arial, sans-serif;
}
th, td {
padding: 12px 15px;
text-align: left;
border-bottom: 1px solid #ddd;
white-space: nowrap; /* 不换行 */
overflow: hidden;
text-overflow: ellipsis; /* 超出显示省略号 */
}
/* 设置时间列宽 */
th:nth-child(5), td:nth-child(5), th:nth-child(6), td:nth-child(6), th:nth-child(10), td:nth-child(10) {
width: 180px; /* 设置固定列宽 */
}th:nth-child(4), td:nth-child(4), th:nth-child(2), td:nth-child(2), th:nth-child(3), td:nth-child(3) {
width: 80px; /* 设置固定列宽 */
}
th:nth-child(7), td:nth-child(7), th:nth-child(8), td:nth-child(8), th:nth-child(9), td:nth-child(9) {
width: 80px; /* 设置固定列宽 */
}th:nth-child(1), td:nth-child(1) {
width: 40px; /* 设置固定列宽 */
}
tr:hover {
background-color: #f5f5f5;
}
#no-record {
text-align: center;
padding: 20px;
font-size: 18px;
color: #ff0000;
}
</style>
</head>
<body>
<div class="query-container">
<div class="query-title">🔍 查询打包记录</div>
<form method="get" class="row g-3 mb-4" id="searchForm">
<div class="col-md-4">
<label for="project_name" class="form-label">项目名</label>
<input type="text" class="form-control" id="project_name" name="project_name"
value="{{ request.args.get('project_name', '') }}">
</div>
<div class="col-md-4">
<label for="builder" class="form-label">操作人</label>
<input type="text" class="form-control" id="builder" name="builder"
value="{{ request.args.get('builder', '') }}">
</div>
<div class="col-md-4">
<label for="create_time" class="form-label">日期</label>
<input type="text" class="form-control" id="create_time" name="create_time" placeholder="2024-08-01"
value="{{ request.args.get('create_time', '') }}">
</div>
<div class="col-12 text-end">
<button type="button" class="btn btn-secondary" id="refreshBtn">刷新</button>
<button type="submit" class="btn btn-success" id="searchBtn">搜索</button>
</div>
</form>
<div class="table-responsive">
<table class="table table-bordered table-striped align-middle text-center">
<thead>
<tr>
<th>ID</th>
<th>项目名</th>
<th>项目组</th>
<th>打包人</th>
<th>创建时间</th>
<th>打包时间</th>
<th>状态</th>
<th>微信通知</th>
<th>邮件通知</th>
<th>编译类型</th>
</tr>
</thead>
<tbody id="recordTableBody">
<!-- 数据会通过 JavaScript 动态填充 -->
</tbody>
</table>
</div>
<p id="no-record" class="text-white text-center" style="display:none;">未查询到记录</p>
</div>
<script src="{{ url_for('static', filename='main.js') }}"></script>
</body>
</html>
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>天有为电子</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
body, html {
height: 100%;
margin: 0;
font-family: "Microsoft YaHei", sans-serif;
background-image: url('https://n.sinaimg.cn/sinakd20241018s/400/w1280h720/20241018/3443-ceb0861393e44b7fd13f943574a49737.png');
background-size: cover;
background-position: center;
}
.login-container {
backdrop-filter: blur(10px);
background-color: rgba(255, 255, 255, 0.2);
border-radius: 15px;
padding: 40px;
max-width: 400px;
width: 90%;
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}
.logo {
width: 80px;
height: 80px;
object-fit: contain;
margin-bottom: 15px;
}
.company-name {
font-size: 24px;
font-weight: bold;
color: #fff;
margin-bottom: 20px;
}
</style>
</head>
<body>
<div class="d-flex justify-content-center align-items-center vh-100">
<div class="login-container text-center text-white">
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/a/ab/Logo_TV_2015.png/320px-Logo_TV_2015.png" class="logo" alt="公司LOGO">
<div class="company-name">天有为电子</div>
{% if error %}
<div class="alert alert-danger py-1">{{ error }}</div>
{% endif %}
<form method="post">
<div class="form-group mb-3">
<input type="text" class="form-control" name="username" placeholder="用户名" required>
</div>
<div class="form-group mb-4">
<input type="password" class="form-control" name="password" placeholder="密码" required>
</div>
<button type="submit" class="btn btn-primary w-100">登录</button>
</form>
</div>
</div>
<!-- 登录成功弹窗 -->
<div class="modal fade" id="loginSuccessModal" tabindex="-1" aria-labelledby="loginSuccessModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content text-center">
<div class="modal-header">
<h5 class="modal-title" id="loginSuccessModalLabel">提示</h5>
</div>
<div class="modal-body">
🎉 登录成功!即将跳转...
</div>
</div>
</div>
</div>
<!-- 脚本区域 -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script>
window.onload = function () {
{% if login_success %}
var myModal = new bootstrap.Modal(document.getElementById('loginSuccessModal'));
myModal.show();
setTimeout(function() {
window.location.href = "{{ url_for('home') }}";
}, 2000);
{% endif %}
};
</script>
</body>
</html>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment