1.需求：需要做一个python的web项目，需求是需要从数据库下载数据展示在前台，操作员调整数据表中的数据后（需要实时显示调整反馈），调整完成再上传到数据库。
2.利用dash库编码，已实现通过pyodbc从informix下载数据并使用dash_table展示
import dash
import dash_html_components as html
import dash_bootstrap_components as dbc
import dash_core_components as dcc
import dash_table
import pandas as pd
from dash.dependencies import Input, Output, State
import pyodbc
import time
app = dash.Dash(__name__)
app.layout = dbc.Container(
[
html.H1('选择起始日期和结束日期，如果只关注某一天，请把其实日期和结束日期选为同一天：'),
html.Br(),
# dbc.InputGroupAddon("起始日期", addon_type="prepend"),
dbc.Input(
id='inputstartdate',
placeholder='请输入起始日期',
type="date",
value='2023-01-01'
),
# dbc.InputGroupAddon("结束日期", addon_type="prepend"),
dbc.Input(
id='inputenddate',
placeholder='请输入结束日期',
type="date",
value='2023-01-01'
),
dbc.Button('开始查询', id='start', n_clicks=0, color='light'),
dbc.Label(id='output1'),
dash_table.DataTable(
id='dash-table',
# data=df.to_dict('records'),
# columns=[
# {'name': column, 'id': column}
# for column in df.columns
# ],
fixed_rows={'headers': True},
page_size=15,
editable=True,
style_header={
'font-family': 'Times New Roman',
'font-weight': 'bold',
'text-align': 'center'
},
style_data={
'font-family': 'Times New Roman',
'text-align': 'center'
},
style_data_conditional=[
{
# 对选中状态下的单元格进行自定义样式
"if": {"state": "selected"},
"background-color": "#b3e5fc",
"border": "none"
},
]
)
],
style={
'margin-top': '50px'
}
)
def SelectpremiumLastYear(inputstartdate, inputenddate):
with pyodbc.connect('DSN=wz01db') as conn:
with conn.cursor() as cursor:
query = "select company,sum(premiumLastYear),sum(premium) \n" \
"from HYXT_car \n" \
"where dateyymmdd between '" + str(inputstartdate) + \
"' and" + " '" + str(inputenddate) + "' \ngroup by company"
# print(query)
cursor.execute(query)
rows = cursor.fetchall()
columnDes = cursor.description # 获取连接对象的描述信息
columnNames = [columnDes[i][0] for i in range(len(columnDes))]
df_new = pd.DataFrame([list(i) for i in rows], columns=columnNames)
df_new.columns = ['公司', '上年同期', '保费收入']
df_new['增速'] = round((df_new['保费收入'] / df_new['上年同期'] - 1) * 100, 0)
return df_new
@app.callback(
[Output('dash-table', 'data'),
Output('dash-table', 'columns')],
Input('start', 'n_clicks'),
[State('inputstartdate', 'value'),
State('inputenddate', 'value')],
prevent_initial_call=True
)
def caculatepremium(n_clicks, inputstartdate, inputenddate):
time.sleep(0.2)
if n_clicks:
df = SelectpremiumLastYear(inputstartdate, inputenddate)
else:
df = pd.DataFrame(columns=['公司', '上年同期', '保费收入', '增速'])
return df.to_dict('records'), [
{'name': column, 'id': column}
for column in df.columns
]
)
2.实现了dash实时交互
app.layout = dbc.Container(
[
html.H1('选择起始日期和结束日期，如果只关注某一天，请把其实日期和结束日期选为同一天：'),
html.Br(),
dcc.Textarea(style={'width': '30%', 'height': '20px'},
id='inputstartdate',
value='',
placeholder='请输入起始日期！'),
dcc.Textarea(style={'width': '30%', 'height': '20px'},
id='inputenddate',
value='',
placeholder='请输入结束始日期！'),
dash_table.DataTable(
id='dash-table',
data=df.to_dict('records'),
columns=[
{'name': column, 'id': column}
for column in df.columns
],
fixed_rows={'headers': True},
page_size=15,
editable=True,
style_header={
'font-family': 'Times New Roman',
'font-weight': 'bold',
'text-align': 'center'
},
style_data={
'font-family': 'Times New Roman',
'text-align': 'center'
},
style_data_conditional=[
{
# 对选中状态下的单元格进行自定义样式
"if": {"state": "selected"},
"background-color": "#b3e5fc",
"border": "none"
},
]
)
],
style={
'margin-top': '50px'
}
)
@app.callback(
Output('dash-table', 'data'),
Input('dash-table', 'data_timestamp'),
State('dash-table', 'data'))
def computeRatio(timestamp, rows):
print(rows)
for row in rows:
try:
row['增速'] = round((float(row['保费收入']) / float(row['上年同期']) - 1) * 100, 0)
except:
row['增速'] = '0'
return rows
if __name__ == '__main__':
app.run_server(debug=True
现在的问题是想要做完第一步直接做第二步，但是提示multiple outputs错误，请指点
这个你可以用相关的html去渲染你的表格。