Browse Source

source: change bootstrap-fileinput to custom

Hugh Harlequin 1 year ago
parent
commit
97446f03e2
5 changed files with 31 additions and 26 deletions
  1. 1 0
      .gitignore
  2. 22 10
      index.html
  3. 0 0
      js/dist/excel-preview.min.js
  4. 6 14
      js/src/excel-preview.js
  5. 2 2
      package.json

+ 1 - 0
.gitignore

@@ -1,2 +1,3 @@
 package-lock.json
 node_modules/
+.idea/

+ 22 - 10
index.html

@@ -6,7 +6,7 @@
 	<title>Excel Preview</title>
 	<link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
 	<link rel="stylesheet" href="node_modules/bootstrap-table/dist/bootstrap-table.min.css">
-	<link href="node_modules/bootstrap-fileinput/css/fileinput.min.css"  rel="stylesheet" type="text/css" />
+	<link href="node_modules/bootstrap-fileinput/dist/css/fileinput.min.css"  rel="stylesheet" type="text/css" />
 	<link rel="stylesheet" href="css/excel-preview.css">
 </head>
 <body>
@@ -17,23 +17,35 @@
 				<input type="file" name="file" id="file" class="file">
 				<div id="excelTable"></div>
 				<div id="kartik-file-errors"></div>
-			</div>			
-		</section> 
+			</div>
+		</section>
 	</div>
-	
+
 	<script src="node_modules/jquery/dist/jquery.min.js" type="text/javascript"></script>
 	<script src="node_modules/bootstrap/dist/js/bootstrap.min.js" type="text/javascript"></script>
 	<script src="node_modules/bootstrap-table/dist/bootstrap-table.min.js" type="text/javascript"></script>
 	<script src="node_modules/bootstrap-table/dist/locale/bootstrap-table-zh-CN.min.js" type="text/javascript"></script>
 	<script src="node_modules/xlsx-style/dist/xlsx.full.min.js" type="text/javascript"></script>
-	<script src="node_modules/bootstrap-fileinput/js/fileinput.min.js" type="text/javascript"></script>
+	<script src="node_modules/bootstrap-fileinput/dist/js/fileinput.js" type="text/javascript"></script>
 	<script src="node_modules/bootstrap-fileinput/js/locales/zh.js" type="text/javascript"></script>
 
-	 <script src="js/dist/excel-preview.min.js"></script>
-<!--	<script src="js/src/util.js" type="text/javascript" ></script>-->
-<!--	<script src="js/src/excel-preview.js" type="text/javascript" ></script>-->
+<!--	 <script src="js/dist/excel-preview.min.js"></script>-->
+	<script src="js/src/util.js" type="text/javascript" ></script>
+	<script src="js/src/excel-preview.js" type="text/javascript" ></script>
 	<script type="text/javascript">
-	 	$("#excelTable").excelPreview();
+	 	$("#excelTable").excelPreview({
+			"overwriteInitial":true,
+			"initialPreviewAsData":true,
+			"browseLabel":"瀏覽 - browseLabel",
+			"cancelLabel":"取消 - cancelLabel",
+			"showRemove":false,
+			"showUpload":false,
+			"showCancel":false,
+			"dropZoneEnabled":true,
+			"fileActionSettings":{"showRemove":true,"showDrag":false},
+			"allowedFileExtensions":["xlsx","xls"],
+			"browseOnZoneClick":true,
+			"msgPlaceholder":"選擇檔案 - msgPlaceholder"});
 	</script>
 </body>
-</html>
+</html>

File diff suppressed because it is too large
+ 0 - 0
js/dist/excel-preview.min.js


+ 6 - 14
js/src/excel-preview.js

@@ -8,11 +8,11 @@
     'use strict';
 
     // Default options
-    var pluginName = "excelPreview",
+    const pluginName = "excelPreview";
 
-        defaults = {
-            height: 500
-        };
+    var defaults = {
+        height: 500
+    };
 
     // Constructor, initialise everything you need here
     var Plugin = function (element, options) {
@@ -31,16 +31,8 @@
 
         init: function () {
             var e = this;
-            $(e.element).prev('input[type=file]').fileinput({
-                language: 'zh',
-                showUpload: false,
-                dropZoneEnabled: false,
-                hideThumbnailContent: true,
-                showPreview: false,
-                allowedFileExtensions: ['xlsx'],
-                elErrorContainer: '#kartik-file-errors',
-                // showRemove: false
-            }).on('change', function (file) {
+            let input = $(e.element).prev('input[type=file]');
+            $(e.element).prev('input[type=file]').fileinput(e.settings).on('change', function (file) {
                 e.excelPreview(file);
             })
         },

+ 2 - 2
package.json

@@ -22,9 +22,9 @@
   },
   "homepage": "https://github.com/sumile-ting/excelPreview#readme",
   "dependencies": {
-    "bootstrap-fileinput": "^5.0.6",
-    "bootstrap-table": "^1.13.1",
     "bootstrap": ">=3.4.1",
+    "bootstrap-fileinput": "git+https://git.hugh2113.com/hugh/bootstrap-fileinput.git#hugh-develop",
+    "bootstrap-table": "^1.13.1",
     "jquery": ">=3.4.0",
     "xlsx": "^0.14.1",
     "xlsx-style": "^0.8.13"

Some files were not shown because too many files changed in this diff