CRUD导出excel功能增加导出完成前按钮变灰的功能

这一段当有confirmText(确认文案)时会出现bug,后面一小节有解决方案,但这个方案按钮变灰的更快,可以更好的防止快速点两下的情况

{
  "type": "export-excel",
  "onClick": "document.getElementsByClassName(\"excel-export-btn\")[1].classList.add(\"is-disabled\") \r\n",
  "reload": "",
  "perPageAvailable": [
    10
  ],
  "name": "exportExcelBtn",
  "disabledOn": "",
  "className": "excel-export-btn",
  "label": "导出",
  "api": {
    "headers": {
      "content-type": "application/json"
    },
    "method": "post",
    "url": "/innerApp/appApi/custom/test_crud/crud",
    "adaptor": "document.getElementsByClassName(\"excel-export-btn\")[1].classList.remove(\"is-disabled\");\nreturn {\n    ...payload\n}"
  },
  "align": "right",
  "target": ""
}

上述只是一个示例,方便你拷贝文字的,具体要改的地方在这里:

undefined

额外注意,有个名字是三项关联的,要改全改,因为你page里不见得只有一个crud,一定要单独起名字

undefined

继上面改造,导出时导出按钮不仅变灰,还显示一个loading图标,且规避当有confirmText时点否按钮不还原的问题

{
    "type": "export-excel",
    "confirmText": "确定导出吗?",    
    "className": "excel-export-btn",
    "api": {
        "headers": {
            "content-type": "application/json"
        },
        "method": "post",        
        "requestAdaptor": "document.getElementsByClassName(\"excel-export-btn\")[1].children[0].classList.remove(\"hidden\");document.getElementsByClassName(\"excel-export-btn\")[1].classList.add(\"is-disabled\") \r\n return api;",
        "adaptor": "document.getElementsByClassName(\"excel-export-btn\")[1].children[0].classList.add(\"hidden\");document.getElementsByClassName(\"excel-export-btn\")[1].classList.remove(\"is-disabled\");\nreturn payload;\n",
        "url": "/innerApp/appApi/custom/test_crud/crud"
    },
    "label": "导出<%document.getElementsByClassName(\"excel-export-btn\")[1].children[0].classList.add(\"hidden\");%>",
    "align": "right",
    "loading": true
}

使用注意点:蓝色框内的名字,当同一页有两个导出按钮时,要起不同的名字,改名时同一按钮里所有蓝色框名字要一起改。

undefined


问题没有解决?请留言提问

results matching ""

    No results matching ""