select_file_modal.ejs 1.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940
  1. <div class="modal fade" id="select-file" data-backdrop="static">
  2. <div class="modal-dialog" role="document">
  3. <div class="modal-content">
  4. <div class="modal-header">
  5. <h5 class="modal-title">选择文件</h5>
  6. </div>
  7. <div class="modal-body">
  8. <p><span id="sf-hint">请选择.xls和.xlsx 文件</span><a class="ml-2" id="sf-template">示例</a></p></p>
  9. <div class="form-group">
  10. <label for="sf-file">选择文件</label><i class="fa fa-spinner fa-pulse fa-lg fa-fw text-primary" id="select-excel-loading" style="display: none;"></i>
  11. <input type="file" class="form-control-file" id="sf-file" accept="*.json" name="file">
  12. </div>
  13. </div>
  14. <div class="modal-footer">
  15. <button type="button" class="btn btn-secondary btn-sm" data-dismiss="modal">关闭</button>
  16. <button type="button" class="btn btn-primary btn-sm" id="sf-ok">确认</button>
  17. </div>
  18. </div>
  19. </div>
  20. </div>
  21. <script>
  22. const selectFile = function(setting) {
  23. if (!setting || !setting.fileType || !setting.select) return;
  24. if (setting.template) {
  25. $('#sf-template').attr('href', setting.template).show();
  26. } else {
  27. $('#sf-template').hide();
  28. }
  29. $('#sf-hint').text(setting.hint || `请选择${setting.fileType}文件`);
  30. $('#sf-file').val('');
  31. $('#sf-ok').off('click');
  32. $('#sf-file').attr('accept', setting.fileType);
  33. $('#select-file').modal('show');
  34. $('#sf-ok').on("click", function () {
  35. setting.select(document.getElementById('sf-file').files[0]);
  36. $('#select-file').modal('hide');
  37. });
  38. };
  39. </script>