Rebuild welcomes to es6 and fix some errors

assets/js/template.js

@@ -106,7 +106,7 @@ function _scripts (scripts, callback) {
 }
 
 function _themeUpdate (_data) {
-  const data = _data.replace('<template>', '').replace('</template>', '')
+  const data = _data
 
   if (/bootstrap3.html$/.test(location.pathname)) {
     return data.replace(/btn-secondary/g, 'btn-default')
@@ -151,25 +151,33 @@ function _beautifySource (data) {
   let lines = data.split('\n')
   const scriptStart = lines.indexOf('<script>')
   const scriptEnd = lines.indexOf('</script>', scriptStart)
-  let strings = lines.slice(scriptStart + 1, scriptEnd)
+  const strings = lines.slice(scriptStart + 1, scriptEnd)
+    .map(s => s.trim())
+  const templateStart = lines.indexOf('<template>')
+  const templateEnd = lines.indexOf('</template>', scriptStart)
+  const templates = lines.slice(templateStart + 1, templateEnd)
+    .map(s => s.replace(/^ {2}/, ''))
 
-  strings = $.map(strings, function (s) {
-    return $.trim(s)
-  })
   /* eslint-disable no-control-regex */
   const obj = eval(`(${strings.join('').replace(/[^\u0000-\u007E]/g, '')
     .replace(/^init\((.*)\)$/, '$1')})`)
 
   let result = []
+  const addEmptyLine = () => {
+    if (result[result.length - 1] !== '') {
+      result.push('')
+    }
+  }
 
   result = result.concat($.map(obj.links, _getLink))
-  result.push('')
+  addEmptyLine()
   result = result.concat($.map(obj.scripts, function (script) {
     return _getScript(script, true)
   }))
-  lines = result.concat(lines.slice(scriptEnd + 1))
+  addEmptyLine()
+  lines = result.concat(templates, lines.slice(templateEnd + 1))
 
-  const mountedStart = lines.indexOf('  function mounted() {')
+  const mountedStart = lines.indexOf('  function mounted () {')
   const mountedEnd = lines.indexOf('  }', mountedStart)
 
   lines[mountedStart] = '  $(function() {'
@@ -205,7 +213,9 @@ $(function () {
           $('#source').text(_beautifySource(data))
           window.hljs.highlightAll()
         } else {
-          $('#example').html(data.replace(/ data-toggle="table"/g, ' data-toggle="bootstrap-table"'))
+          $('#example').html(data
+            .replace('<template>', '').replace('</template>', '')
+            .replace(/ data-toggle="table"/g, ' data-toggle="bootstrap-table"'))
         }
       },
       error () {

crud/index.html

@@ -77,7 +77,7 @@ <h5 class="modal-title"></h5>
       stargazers_count: 0,
       forks_count: 0,
       description: ''
-  } // default row value
+    } // default row value
 
     $modal.data('id', row.id)
     $modal.find('.modal-title').text(title)
@@ -90,7 +90,7 @@ <h5 class="modal-title"></h5>
   }
 
   function showAlert (title, type) {
-    $alert.attr('class', `alert alert-${type}` || 'success')
+    $alert.attr('class', `alert alert-${type || 'success'}`)
       .html(`<i class="glyphicon glyphicon-check"></i> ${title}`).show()
     setTimeout(function () {
       $alert.hide()
@@ -128,12 +128,10 @@ <h5 class="modal-title"></h5>
           field: 'action',
           title: 'Action',
           align: 'center',
-          formatter: function actionFormatter (value) {
-            return [
-              '<a class="update mr10" href="javascript:" title="Update Item"><i class="fa fa-edit"></i></a>',
-              '<a class="remove" href="javascript:" title="Delete Item"><i class="fa fa-remove"></i></a>'
-            ].join('')
-          },
+          formatter: () => [
+            '<a class="update mr10" href="javascript:" title="Update Item"><i class="fa fa-edit"></i></a>',
+            '<a class="remove" href="javascript:" title="Delete Item"><i class="fa fa-remove"></i></a>'
+          ].join(''),
           events: {
             'click .update' (e, value, row) {
               showModal($(e.currentTarget).attr('title'), row)

eslint.config.js

@@ -1,4 +1,5 @@
 import eslintConfig from 'bootstrap-table/eslint.config.js'
+import html from 'eslint-plugin-html'
 import vue from 'eslint-plugin-vue'
 
 const globals = eslintConfig[eslintConfig.length - 1].languageOptions.globals
@@ -14,6 +15,10 @@ export default [
       'webpack-starter/'
     ]
   },
+  {
+    files: ['**/*.html'],
+    plugins: { html }
+  },
   ...eslintConfig,
   ...vue.configs['flat/recommended'],
   {

extensions/custom-view.html

@@ -215,7 +215,7 @@ <h3 class="mb-0">%SNIPPETS%</h3>
     })
   }
 
-  function customViewFormatter (data) {
+  window.customViewFormatter = data => {
     const template = $('#profileTemplate').html()
     let view = ''
 

extensions/fixed-columns.html

@@ -90,7 +90,7 @@
         checkbox: true,
         valign: 'middle'
       }
-  ]
+    ]
     const data = []
 
     for (i = 0; i < cells; i++) {

extensions/treegrid.html

@@ -64,7 +64,7 @@
     })
   }
 
-  function typeFormatter (value, row, index) {
+  window.typeFormatter = value => {
     if (value === 'menu') {
       return '菜单'
     }
@@ -77,7 +77,7 @@
     return '-'
   }
 
-  function statusFormatter (value, row, index) {
+  window.statusFormatter = value => {
     if (value === 1) {
       return '<span class="label label-success">正常</span>'
     }

issues/1167.html

@@ -51,9 +51,9 @@
 </template>
 
 <script>
-  var $table = $('#table')
+  const $table = $('#table')
 
-  function mounted() {
+  function mounted () {
     $('#checkAll').click(function () {
       $table.bootstrapTable('togglePagination').bootstrapTable('checkAll').bootstrapTable('togglePagination')
     })

issues/137.html

@@ -37,8 +37,9 @@
 </template>
 
 <script>
-  var $table = $('#table')
-  function mounted() {
+  const $table = $('#table')
+
+  function mounted () {
     $table.bootstrapTable({
       data: [
         {
@@ -49,7 +50,7 @@
       ]
     })
     $('#button').click(function () {
-      $table.bootstrapTable('refresh', {url: 'json/data1.json'})
+      $table.bootstrapTable('refresh', { url: 'json/data1.json' })
     })
   }
 </script>

issues/152.html

@@ -65,15 +65,15 @@
 </template>
 
 <script>
-  function queryParams(params) {
+  window.queryParams = params => {
     params.your_param1 = 1 // add param1
     params.your_param2 = 2 // add param2
     // console.log(JSON.stringify(params));
     // {"limit":10,"offset":0,"order":"asc","your_param1":1,"your_param2":2}
     return params
   }
 
-  function postQueryParams(params) {
+  window.postQueryParams = params => {
     params.your_param1 = 1 // add param1
     params.your_param2 = 2 // add param2
     return params // body data

issues/177.html

@@ -12,31 +12,31 @@
 </template>
 
 <script>
-  var data = [
+  const data = [
     {
-      'firstName': 'zhixin',
-      'lastName': 'wen',
-      'field1': 'field1',
-      'field2': 'field2',
-      'field3': 'field3'
+      firstName: 'zhixin',
+      lastName: 'wen',
+      field1: 'field1',
+      field2: 'field2',
+      field3: 'field3'
     }
   ]
 
-  function mounted() {
+  function mounted () {
     $('#table').bootstrapTable({
-      data: data,
+      data,
       columns: [
         {
           field: 'fullName',
           title: 'Full Name',
-          formatter: function (value, row) {
+          formatter (value, row) {
             return [row.firstName, row.lastName].join(' ')
           }
         },
         {
           field: 'field',
           title: 'Field',
-          formatter: function (value, row) {
+          formatter (value, row) {
             return [row.field1, row.field2, row.field3].join('+')
           }
         }

issues/188.html

@@ -36,7 +36,7 @@
 </template>
 
 <script>
-  function mounted() {
+  function mounted () {
     $('#table').bootstrapTable()
   }
 </script>

issues/220.html

@@ -44,9 +44,9 @@
 </template>
 
 <script>
-  var $table = $('#table')
+  const $table = $('#table')
 
-  function mounted() {
+  function mounted () {
     $('#button').click(function () {
       $table.bootstrapTable('hideColumn', 'state')
     })

issues/221.html

@@ -33,8 +33,9 @@
 </template>
 
 <script>
-  function cellStyle(value, row, index) {
-    var classes = ['active', 'success', 'info', 'warning', 'danger']
+  window.cellStyle = (value, row, index) => {
+    const classes = ['active', 'success', 'info', 'warning', 'danger']
+
     if (index % 2 === 0 && index / 2 < classes.length) {
       return {
         css: {

issues/2619.html

@@ -57,7 +57,7 @@
 </template>
 
 <script>
-  function stateFormatter(value, row, index) {
+  window.stateFormatter = (value, row, index) => {
     if (index === 2) {
       return { disabled: true }
     }

issues/283.html

@@ -8,48 +8,48 @@
 </script>
 
 <script>
-  var $table = $('#table')
+  const $table = $('#table')
 
-  function buildTable($el, cells, rows) {
-    var i
-    var j
-    var row
-    var columns = []
-    var data = []
+  function buildTable ($el, cells, rows) {
+    let i
+    let j
+    let row
+    const columns = []
+    const data = []
 
     for (i = 0; i < cells; i++) {
       columns.push({
-        field: 'field' + i,
-        title: 'Cell' + i
+        field: `field${i}`,
+        title: `Cell${i}`
       })
     }
     for (i = 0; i < rows; i++) {
       row = {}
       for (j = 0; j < cells; j++) {
-        row['field' + j] = 'Row-' + i + '-' + j
+        row[`field${j}`] = `Row-${i}-${j}`
       }
       data.push(row)
     }
     $el.bootstrapTable('destroy').bootstrapTable({
-      columns: columns,
-      data: data
+      columns,
+      data
     })
   }
 
-  function mounted() {
+  function mounted () {
     buildTable($('#table'), 10, 50)
 
-    var $d = $('#d')
-    var width = $d.width()
+    const $d = $('#d')
+    let width = $d.width()
 
-    $('#b').click(function() {
+    $('#b').click(function () {
       width += 100
-      $d.css('width', width + 'px')
+      $d.css('width', `${width}px`)
       $table.bootstrapTable('resetView')
     })
-    $('#s').click(function() {
+    $('#s').click(function () {
       width -= 100
-      $d.css('width', width + 'px')
+      $d.css('width', `${width}px`)
       $table.bootstrapTable('resetView')
     })
   }

issues/3345.html

@@ -54,9 +54,9 @@
 </template>
 
 <script>
-  var checkAll = false
+  let checkAll = false
 
-  function mounted() {
+  function mounted () {
     $('#checkAll').click(function () {
       checkAll = true
       $('#table').bootstrapTable('checkAll')
@@ -67,7 +67,7 @@
     })
   }
 
-  function responseHandler(res) {
+  window.responseHandler = res => {
     res.rows.forEach(function (item) {
       item.state = checkAll
     })

issues/371.html

@@ -47,7 +47,7 @@
 </template>
 
 <script>
-  function mounted() {
+  function mounted () {
     $('form').submit(function (event) {
       event.preventDefault()
       alert($(this).serialize())

issues/3784.html

@@ -14,9 +14,9 @@
 </script>
 
 <script>
-  var ps
+  let ps
 
-  function mounted() {
+  function mounted () {
     $('#table').on('post-body.bs.table', function () {
       if (ps) ps.destroy()
       ps = new window.PerfectScrollbar('.fixed-table-body')