建立一个mysql数据库存储drug1 drug2及interaction 在pycharm中使用layui建立一个查询两种药物相互作用结果信息的界面,两种药品信息有下拉框且内容来自drug1和drug2y,点击查询按钮跳转显示interaction
时间: 2024-06-09 17:04:40 浏览: 193
好的,这个任务可以分为以下几个步骤:
1. 创建MySQL数据库并设计数据表
2. 在Python中连接数据库并进行数据查询
3. 使用Layui创建查询界面
4. 在界面中使用下拉框选择药品并进行查询
5. 显示查询结果
下面我会一步步为你介绍具体实现方法。
## 1. 创建MySQL数据库并设计数据表
首先,我们需要在MySQL中创建一个名为`drug_interaction`的数据库,然后创建一个名为`interaction`的数据表,用于存储药品相互作用信息。该表需要包含以下三个字段:
- `id`:自增长的主键
- `drug1`:药品1的名称
- `drug2`:药品2的名称
- `interaction`:药品相互作用的描述信息
可以使用如下的SQL语句创建该表:
```sql
CREATE TABLE `interaction` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`drug1` varchar(50) NOT NULL,
`drug2` varchar(50) NOT NULL,
`interaction` varchar(200) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
```
## 2. 在Python中连接数据库并进行数据查询
接下来,我们需要在Python中使用`mysql-connector-python`库连接MySQL数据库,并进行数据查询。首先,需要先安装该库:
```
pip install mysql-connector-python
```
然后,可以使用如下的Python代码连接数据库并查询数据:
```python
import mysql.connector
# 连接数据库
cnx = mysql.connector.connect(user='root', password='password',
host='localhost',
database='drug_interaction')
# 执行查询
cursor = cnx.cursor()
query = ("SELECT interaction FROM interaction WHERE drug1 = %s AND drug2 = %s")
params = ('drug1', 'drug2')
cursor.execute(query, params)
# 处理查询结果
for (interaction,) in cursor:
print(interaction)
# 关闭数据库连接
cursor.close()
cnx.close()
```
其中,`user`、`password`、`host`和`database`参数需要根据实际情况进行修改。`query`变量中的`%s`是占位符,后面的`params`变量将会替换这些占位符。
## 3. 使用Layui创建查询界面
接下来,我们需要使用Layui创建查询界面。Layui是一个轻量级的前端UI框架,可以帮助我们快速搭建美观的Web界面。可以在[Layui官网](https://www.layui.com/)下载最新版本的Layui。
在Layui中,我们可以使用HTML和JavaScript创建界面。下面是一个简单的HTML模板,用于展示两个下拉框和一个查询按钮:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>药品相互作用查询</title>
<link rel="stylesheet" href="layui/css/layui.css">
</head>
<body>
<div class="layui-container">
<div class="layui-row">
<div class="layui-col-md4">
<div class="layui-form-item">
<label class="layui-form-label">药品1</label>
<div class="layui-input-block">
<select name="drug1" lay-verify="required" lay-search>
<option value="">请选择药品1</option>
<option value="drug1-1">药品1-1</option>
<option value="drug1-2">药品1-2</option>
<option value="drug1-3">药品1-3</option>
</select>
</div>
</div>
</div>
<div class="layui-col-md4">
<div class="layui-form-item">
<label class="layui-form-label">药品2</label>
<div class="layui-input-block">
<select name="drug2" lay-verify="required" lay-search>
<option value="">请选择药品2</option>
<option value="drug2-1">药品2-1</option>
<option value="drug2-2">药品2-2</option>
<option value="drug2-3">药品2-3</option>
</select>
</div>
</div>
</div>
<div class="layui-col-md4">
<div class="layui-form-item">
<div class="layui-input-block">
<button class="layui-btn layui-btn-normal" lay-submit lay-filter="query">查询</button>
</div>
</div>
</div>
</div>
</div>
<script src="layui/layui.js"></script>
<script>
layui.use(['form', 'jquery'], function () {
var $ = layui.jquery;
var form = layui.form;
// 监听查询按钮的点击事件
form.on('submit(query)', function (data) {
var drug1 = data.field.drug1;
var drug2 = data.field.drug2;
// TODO: 发送查询请求并显示结果
return false;
});
});
</script>
</body>
</html>
```
在这个模板中,我们使用了`layui-form`和`layui-col-*`等类来实现响应式布局。下拉框和查询按钮的样式也是使用Layui提供的类来设置的。
## 4. 在界面中使用下拉框选择药品并进行查询
当用户选择了两个药品后,点击查询按钮时,我们需要发送一个AJAX请求到后端Python程序,进行数据查询。在查询完成后,我们还需要将结果显示在界面中。
下面是一个示例的AJAX请求代码:
```javascript
$.ajax({
url: '/query',
type: 'POST',
data: {drug1: drug1, drug2: drug2},
dataType: 'json',
success: function (data) {
if (data.success) {
// TODO: 处理查询结果并显示
} else {
layer.msg('查询失败:' + data.message);
}
},
error: function () {
layer.msg('查询失败:网络错误');
}
});
```
在这个代码中,我们使用了JQuery库发送了一个POST请求到`/query`路径,并将药品1和药品2的名称作为参数发送到后端。`dataType`参数指定了后端返回的数据类型为JSON格式。在请求成功后,我们可以通过`data.success`属性来判断查询是否成功,如果成功,可以通过`data.result`属性获取查询结果。
## 5. 显示查询结果
最后,我们需要将查询结果显示在界面中。可以在查询结果的下面添加一个`<div>`元素,用于显示查询结果。下面是一个简单的示例代码:
```html
<div class="layui-container">
<div class="layui-row">
<div class="layui-col-md12">
<div class="layui-card">
<div class="layui-card-header">查询结果</div>
<div class="layui-card-body">
<div id="result"></div>
</div>
</div>
</div>
</div>
</div>
<script>
// 显示查询结果
function showResult(result) {
var $result = $('#result');
$result.empty();
if (result.length === 0) {
$result.html('<p>暂无数据</p>');
} else {
for (var i = 0; i < result.length; i++) {
var $p = $('<p>').text(result[i]);
$result.append($p);
}
}
}
</script>
```
在这个代码中,我们使用了`layui-card`和`layui-card-header`等Layui提供的类来设置查询结果的样式。在`showResult()`函数中,我们首先清空了查询结果的内容,然后根据查询结果的数量来显示查询结果。如果查询结果为空,则显示“暂无数据”提示。
至此,我们已经完成了这个任务的所有步骤。下面是完整的Python代码:
阅读全文