帮我用HTML和python写一个web程序 HTML实现如下功能:标题是“一键通系统”,副标题是“零一技术 × 华为云服务”,居中对齐,加粗。有三个输入框和一个输出框,三个输入框的名称分别是“密保号码”“手机号一”“手机号二”,输出框的名称是“中转号码”,输出框只用来输出,不能填写任何内容。输入框和输出框的大小一样。还有一个“提交按钮”,用于提交数据。三个输入框是必填的,不填写完整不允许提交,并提醒。运用你的能力将这个页面设计的好看。 Python实现如下功能: 第一步,读取HTML页面“密保号码”输入的内容,和data.csv中的的数据做比对,如果“密保号码”的内容在第一列,则对变量time赋值数字5,如果“密保号码”的内容在第二列,则对变量time赋值数字10,如果“密保号码”的内容在第三列,则对变量time赋值数字30,如果“密保号码”的内容在第四列,则对变量time赋值数字60,如果在这四列中都不存在,则在输出框中输出“密保号码错误”,并终止程序执行。 第二步,读取手机号码一和手机号码二,分别赋值给phone1和phone2。 第三步,将time,phone1和phone2合并输出到输出框中。 第四步:将第一步读取到的“密保号码”放在log.csv中,并记录存入的时间。 并一步一步教我怎么实现HTML和python的连接并运行这个web程序,文件夹怎么设置,各个文件怎么放。
时间: 2024-03-20 09:42:22 浏览: 54
Python通过GUI图形库wxPython连接oracle数据库实现系统登录、跳转主界面功能(源代码下载)
好的,我会一步一步地教您如何实现这个web程序。
首先,我们需要创建一个文件夹来存放我们的文件。我们可以创建一个名为“onekey”的文件夹,并在里面创建两个文件:一个名为“index.html”的HTML文件和一个名为“app.py”的Python文件。
接下来,我们来编写HTML文件的代码:
```HTML
<!DOCTYPE html>
<html>
<head>
<title>一键通系统</title>
<meta charset="UTF-8">
<style>
body {
background-color: #f2f2f2;
font-family: Arial, sans-serif;
}
h1, h2 {
text-align: center;
font-weight: bold;
}
h1 {
font-size: 36px;
margin-top: 50px;
}
h2 {
font-size: 24px;
margin-bottom: 50px;
}
form {
margin: 0 auto;
width: 50%;
background-color: #fff;
border-radius: 10px;
padding: 20px;
box-shadow: 0px 0px 10px #ccc;
}
label {
display: block;
margin-bottom: 10px;
font-size: 18px;
}
input[type="text"] {
width: 100%;
padding: 10px;
border-radius: 5px;
border: 1px solid #ccc;
margin-bottom: 20px;
font-size: 16px;
}
input[type="submit"] {
background-color: #4CAF50;
color: #fff;
border: none;
border-radius: 5px;
padding: 10px 20px;
font-size: 16px;
cursor: pointer;
}
input[type="submit"]:hover {
background-color: #3e8e41;
}
.output {
margin-top: 50px;
padding: 20px;
background-color: #fff;
border-radius: 10px;
box-shadow: 0px 0px 10px #ccc;
font-size: 18px;
text-align: center;
}
</style>
</head>
<body>
<h1>一键通系统</h1>
<h2>零一技术 × 华为云服务</h2>
<form action="/submit" method="POST">
<label for="secret">密保号码 *</label>
<input type="text" id="secret" name="secret" required>
<label for="phone1">手机号一 *</label>
<input type="text" id="phone1" name="phone1" required>
<label for="phone2">手机号二 *</label>
<input type="text" id="phone2" name="phone2" required>
<input type="submit" value="提交">
</form>
<div class="output">
<label for="result">中转号码</label>
<input type="text" id="result" name="result" readonly>
</div>
</body>
</html>
```
在这个HTML文件中,我们定义了一个标题为“一键通系统”,副标题为“零一技术 × 华为云服务”的页面。在表单中,我们定义了三个输入框:密保号码、手机号一和手机号二,以及一个用于提交数据的提交按钮。我们还定义了一个输出框来显示中转号码。
接下来,我们来编写Python文件的代码:
```python
from flask import Flask, render_template, request
import csv
import datetime
app = Flask(__name__)
@app.route("/")
def index():
return render_template("index.html")
@app.route("/submit", methods=["POST"])
def submit():
secret = request.form.get("secret")
phone1 = request.form.get("phone1")
phone2 = request.form.get("phone2")
time = None
with open("data.csv", newline="") as f:
reader = csv.reader(f)
for row in reader:
if secret == row[0]:
time = 5
break
elif secret == row[1]:
time = 10
break
elif secret == row[2]:
time = 30
break
elif secret == row[3]:
time = 60
break
else:
return "密保号码错误"
result = str(time) + phone1 + phone2
with open("log.csv", "a", newline="") as f:
writer = csv.writer(f)
writer.writerow([secret, datetime.datetime.now()])
return render_template("index.html", result=result)
if __name__ == "__main__":
app.run(debug=True)
```
在这个Python文件中,我们使用Flask框架来实现web应用。我们定义了两个路由:一个是主页的路由,一个是提交数据的路由。在提交数据的路由中,我们首先读取表单中用户输入的密保号码、手机号一和手机号二,然后打开“data.csv”文件并与其中的数据进行比对来确定time的值。如果密保号码不存在于文件中,则返回“密保号码错误”。如果密保号码存在于文件中,则将time、phone1和phone2合并为一个字符串,存储在result变量中。最后,我们将密保号码和当前时间记录在“log.csv”文件中,并通过render_template()函数将结果返回到HTML页面中。
最后,我们需要安装Flask库来运行这个web应用。我们可以在终端中输入以下命令来安装Flask:
```
pip install Flask
```
安装完成后,我们可以在终端中进入“onekey”文件夹,并输入以下命令来运行web应用:
```
python app.py
```
运行成功后,我们可以在浏览器中输入“http://127.0.0.1:5000/”来访问我们的web应用。
希望这个教程能够帮助您完成这个web应用。
阅读全文