增加新功能 layer dialog

demo/admin.py

@@ -2,8 +2,10 @@ import datetime
 
 from django.contrib import admin, messages
 from django.db import transaction
+from django.http import JsonResponse
 from django.urls import reverse
 
+from simpleui.admin import AjaxAdmin
 from .models import *
 from import_export import resources
 from import_export.admin import ImportExportModelAdmin, ImportExportActionModelAdmin
@@ -77,7 +79,7 @@ class ProxyResource(resources.ModelResource):
 
 
 @admin.register(Employe)
-class EmployeAdmin(ImportExportActionModelAdmin):
+class EmployeAdmin(ImportExportActionModelAdmin,AjaxAdmin):
     resource_class = ProxyResource
     list_display = ('id', 'name', 'gender', 'phone', 'birthday', 'department', 'enable', 'create_time')
     # search_fields = ('name', 'enable', 'idCard', 'department')
@@ -97,7 +99,7 @@ class EmployeAdmin(ImportExportActionModelAdmin):
                  (u'其他信息', {
                      'classes': ('123',),
                      'fields': ['birthday', 'department', 'enable']})]
-
+    save_on_top = True
     @transaction.atomic
     def test(self, request, queryset):
         messages.add_message(request, messages.SUCCESS, '啥也没有~')
@@ -107,7 +109,56 @@ class EmployeAdmin(ImportExportActionModelAdmin):
     test.confirm = '您确定要点击测试按钮吗？'
 
     # 增加自定义按钮
-    actions = [test, 'make_copy', 'custom_button']
+    actions = [test, 'make_copy', 'custom_button','layer_input']
+
+    def layer_input(self, request, queryset):
+        # 这里的queryset 会有数据过滤，只包含选中的数据
+
+        post = request.POST
+        # 这里获取到数据后，可以做些业务处理
+        # post中的_action 是方法名
+        # post中 _selected 是选中的数据，逗号分割
+
+        return JsonResponse(data={
+            'status': 'success',
+            'msg': '处理成功！'
+        })
+
+    layer_input.short_description = '弹出对话框输入'
+    layer_input.type = 'success'
+    layer_input.icon = 'el-icon-s-promotion'
+
+    # 指定一个输入参数，应该是一个数组
+
+    # 指定为弹出层，这个参数最关键
+    layer_input.layer = {
+        # 弹出层中的输入框配置
+
+        # 这里指定对话框的标题
+        'title': '弹出层输入框',
+        # 提示信息
+        'tips': '这个弹出对话框是需要在admin中进行定义，数据新增编辑等功能，需要自己来实现。',
+        # 确认按钮显示文本
+        'confirm_button': '确认提交',
+        # 取消按钮显示文本
+        'cancel_button': '取消',
+
+        # 弹出层对话框的宽度，默认50%
+        'width': '40%',
+
+        # 表单中 label的宽度，对应element-ui的 label-width，默认80px
+        'labelWidth': "80px",
+        'params': [{
+            # 这里的type 对应el-input的原生input属性，默认为input
+            'type': 'input',
+            # key 对应post参数中的key
+            'key': 'name',
+            # 显示的文本
+            'label': '名称',
+            # 为空校验，默认为False
+            'require': True
+        }]
+    }
 
     def custom_button(self, request, queryset):
         pass

finance/admin.py

 from django.contrib import admin
+from django.http import JsonResponse
+
 from finance.models import *
 
 from import_export import resources
 from import_export.admin import ImportExportModelAdmin, ImportExportActionModelAdmin
 
+from simpleui.admin import AjaxAdmin
+
 
 class ProxyResource(resources.ModelResource):
     class Meta:
@@ -14,9 +18,144 @@ class ProxyResource(resources.ModelResource):
 @admin.register(Record)
 # class RecordAdmin(admin.ModelAdmin):
 # class RecordAdmin(ImportExportModelAdmin):
-class RecordAdmin(ImportExportActionModelAdmin):
-
+class RecordAdmin(ImportExportActionModelAdmin, AjaxAdmin):
     resource_class = ProxyResource
 
     list_display = ('id', 'name', 'type', 'money', 'create_date')
     list_per_page = 10
+
+    actions = ('layer_input',)
+
+    def layer_input(self, request, queryset):
+        # 这里的queryset 会有数据过滤，只包含选中的数据
+
+        post = request.POST
+        # 这里获取到数据后，可以做些业务处理
+        # post中的_action 是方法名
+        # post中 _selected 是选中的数据，逗号分割
+        if not post.get('_selected'):
+            return JsonResponse(data={
+                'status': 'error',
+                'msg': '请先选中数据！'
+            })
+        else:
+            return JsonResponse(data={
+                'status': 'success',
+                'msg': '处理成功！'
+            })
+
+    layer_input.short_description = '弹出对话框输入'
+    layer_input.type = 'success'
+    layer_input.icon = 'el-icon-s-promotion'
+
+    # 指定一个输入参数，应该是一个数组
+
+    # 指定为弹出层，这个参数最关键
+    layer_input.layer = {
+        # 弹出层中的输入框配置
+
+        # 这里指定对话框的标题
+        'title': '弹出层输入框',
+        # 提示信息
+        'tips': '这个弹出对话框是需要在admin中进行定义，数据新增编辑等功能，需要自己来实现。',
+        # 确认按钮显示文本
+        'confirm_button': '确认提交',
+        # 取消按钮显示文本
+        'cancel_button': '取消',
+
+        # 弹出层对话框的宽度，默认50%
+        'width': '40%',
+
+        # 表单中 label的宽度，对应element-ui的 label-width，默认80px
+        'labelWidth': "80px",
+        'params': [{
+            # 这里的type 对应el-input的原生input属性，默认为input
+            'type': 'input',
+            # key 对应post参数中的key
+            'key': 'name',
+            # 显示的文本
+            'label': '名称',
+            # 为空校验，默认为False
+            'require': True
+        }, {
+            'type': 'select',
+            'key': 'type',
+            'label': '类型',
+            'width': '200px',
+            # size对应elementui的size，取值为：medium / small / mini
+            'size': 'small',
+            # value字段可以指定默认值
+            'value': '0',
+            'options': [{
+                'key': '0',
+                'label': '收入'
+            }, {
+                'key': '1',
+                'label': '支出'
+            }]
+        }, {
+            'type': 'number',
+            'key': 'money',
+            'label': '金额',
+            # 设置默认值
+            'value': 1000
+        }, {
+            'type': 'date',
+            'key': 'date',
+            'label': '日期',
+        }, {
+            'type': 'datetime',
+            'key': 'datetime',
+            'label': '时间',
+        }, {
+            'type': 'rate',
+            'key': 'star',
+            'label': '评价等级'
+        }, {
+            'type': 'color',
+            'key': 'color',
+            'label': '颜色'
+        }, {
+            'type': 'slider',
+            'key': 'slider',
+            'label': '滑块'
+        }, {
+            'type': 'switch',
+            'key': 'switch',
+            'label': 'switch开关'
+        }, {
+            'type': 'input_number',
+            'key': 'input_number',
+            'label': 'input number'
+        }, {
+            'type': 'checkbox',
+            'key': 'checkbox',
+            # 必须指定默认值
+            'value': [],
+            'label': '复选框',
+            'options': [{
+                'key': '0',
+                'label': '收入'
+            }, {
+                'key': '1',
+                'label': '支出'
+            }, {
+                'key': '2',
+                'label': '收益'
+            }]
+        }, {
+            'type': 'radio',
+            'key': 'radio',
+            'label': '单选框',
+            'options': [{
+                'key': '0',
+                'label': '收入'
+            }, {
+                'key': '1',
+                'label': '支出'
+            }, {
+                'key': '2',
+                'label': '收益'
+            }]
+        }]
+    }