背景:
在flask-admin的模型视图(modelview 及其子类)中如果不想重构UI视图,那么就不可避免的出现默认视图无法很好满足需求的情况,如默认视图中只有“新增”,“编辑”,“选中的”三个按钮。
材料:
完整的flask-admin 开发环境
制作:
视图源码
1、在ModelView 子视图中直接添加column_extra_row_actions 的扩展实现
column_extra_row_actions = [LinkRowAction('glyphicon glyphicon-off', '/admin/aiconfig/changestatus/{row_id}'),EndpointLinkRowAction('glyphicon glyphicon-test', 'aiconfig.index_view')]
2、按钮图标直接去bootstrop 中复制替换即可使用(组件 · Bootstrap v3 中文文档 | Bootstrap 中文网)
3、 /admin/aiconfig/changestatus/{row_id} 对应的业务实现代码
@expose('/changestatus/<string:ai_id>', methods=('GET', 'POST'))def updateStatus(self, ai_id):if ai_id:return_url = request.values.get('url') or self.get_url('.index_view')model = self.get_one(ai_id)if model is None:flash(gettext('Record does not exist.'), 'error')return redirect(return_url)form = self.edit_form(obj=model)model.updated_at = datetime.today()model.status = 1 if model.status == 0 else 0if self.update_model(form, model):flash(gettext('Record was successfully saved.'), 'success')# save buttonreturn redirect(self.get_save_return_url(model, is_created=False)) else:return redirect(return_url)
注:直接写到当前视图即可
效果
经验与注意点
1、column_extra_row_actions 扩展类的EndpointLinkRowAction 实现中必填项第一个为图标,第二个为视图权限,如下:
EndpointLinkRowAction('glyphicon glyphicon-test', 'aiconfig.index_view')
注:上面代码片段中“aiconfig.index_view”中的aiconfig 为当前视图注册名,如果注册时没有定义,flask-admin 默认为modelview 的集成子类对应的模型名
admin.add_view(MyAiConfigView(db.session, name='Dify配置', category='Dify管理'))
由于本例子中注册时没有特别声明Endpoint ,所以就会取 aiconfig,为该视图对应的实体名,通过视图中定义的下面代码片段可以看到
def __init__(self, session, **kwargs):# You can pass name and other parameters if you want tosuper(MyAiConfigView, self).__init__(AiConfig, session, **kwargs)
2、第一点中提到的 aiconfig.index_view 其实可以省略为".index_view",如下代码片段,照样有效
column_extra_row_actions = [LinkRowAction('glyphicon glyphicon-off', '/admin/aiconfig/changestatus/{row_id}'),EndpointLinkRowAction('glyphicon glyphicon-test', '.index_view')]
3、column_extra_row_actions 可以通过LinkRowAction 及其子类实现新扩展按钮的url连接。
错误修改:
由于个人对column_extra_row_actions 中参数LinkRowAction和EndpointLinkRowAction理解深度不对,虽然表面效果实现,但实际是误打误撞而已,先予以修正
1、LinkRowAction 可以单独直接用于按钮事件绑定,参数比较单调主要有3个,def __init__(self, icon_class, url, title=None)。
a、icon_class = 样式定义,可直接从bootstrop 复制。
b、url :待连接的URL(相对路径)
c、title: 鼠标移入显示的tip
2、EndpointLinkRowAction 类也可以单独实现按钮功能,参数比较多def __init__(self, icon_class, endpoint, title=None, id_arg='id', url_args=None)。
a、icon_c lass = 样式定义
b、endpoint : 当前视图注册时的定义名,如果为空则取当前视图对应模型实体的名字的小写(目前的理解)
c、title:鼠标移入时显示的tip
d、id_arg : 默认值为id= 当前行的id(row.id).
e、url_args : 当前URL可以携带的更多参数,flask-admin会自动拼接到url后
3、EndpointLinkRowAction 效果:
对应代码:
4、LinkRowAction 效果
对应代码
总结:聪明的你通过效果和代码片段发现了2个的不同。
1、目前发现 EndpointLinkRowAction 无法使用类似“/a/b/c/{参数}”的访问形式
2、EndpointLinkRowAction 带有权限控制,其链接只能是基于当前视图的扩展(当前视图的下层,如某条记录的修改/删除)
3、LinkRowAction 在URL设置上更灵活,可以是外部链接。(该方法的子集照样生效)