/*
 * 树形(jTree)插件
 * 江鸿宾(QQ33080907)
 * 最近修改：2019.09.02
 * 本插件只用于作者参与的项目，未经许可请勿转载
 */

// select示例：<select><option value="1" data-pid="0">父类</option><option value="2" data-pid="1">子类</option></select>
// 注意：必须存在一个父类为0的节点

(function ($) {
  'use strict'

  // 追加chosen插件所用CSS
  $('head').append('<style>select.jtree + .chosen-container .chosen-results li {padding-top:1px;padding-bottom:1px}</style>')
  // 重置AmazeUI样式
  // $('head').append('<style>select.jtree + .am-selected-list li{padding-top:0;padding-bottom:0;}</style>')

  $.fn.jTreeSelect = function (options) {
    var defaults = {
      all: false,  // 是否插入[不限]选项
      parid: null  // 祖先节点ID，不传的话需要手工制定一个父类为0的节点
    }

    // 调用时的参数覆盖默认参数
    var opts = $.extend(defaults, options)

    var tree = []
    var deep = 0
    var title = ''
    var $this

    return this.each(function () {
      // 如果只有一个子节点则不应用插件
      if ($(this).children().length > 1) {
        // jQuery对象
        $this = $(this)
        // DOM对象
        var theselect = $this.get(0)

        // 追加class方便控制css
        $this.addClass('jtree')

        // 选中项的的值
        var selectid = $('option[selected]', $this).length === 0 ? '' : $('option[selected]', $this).val()

        // 存入数组
        $this.children().each(function () {
          if (opts.parid !== null) {
            tree.push($(this).val() + '|' + ($(this).val() === opts.parid.toString() ? 0 : $(this).data('pid')) + '|' + $(this).text())
          }
          else {
            tree.push($(this).val() + '|' + $(this).data('pid') + '|' + $(this).text())
          }
        })

        // 清空原有option
        $this.empty()

        // 转换为仿二维数组（0当前id，1父id，2名称，3是否兄弟节点最后一个）
        $.each(tree, function (i) { tree[i] = tree[i].split('|') })
        // console.log(tree)

        // 每一行增加一列表明该节点是否为最后一个
        $.each(tree, function (i) { tree[i][3] = islast(tree[i][0], tree[i][1]) })

        // 显示（第一个参数是DOM对象）
        showtree(0)

        // 插入[不限]选项
        if (opts.all) { $this.prepend('<option value="">[不限]</option>') }

        // 初始选中
        if (selectid !== '') {
          position(selectid)
          theselect.value = selectid
          theselect.title = title
        }
        else if (opts.all) { theselect.selectedIndex = 0 }
      }
    })


    // 显示
    function showtree(id) {
      $.each(tree, function (i) {
        if (tree[i][1].toString() === id.toString()) {
          deep++
          // 构造option的text
          var text = ''
          for (var j = deep - 2; j > 0; j--) { text += parentislast(tree[i][0], j) ? '　' : '┃' }
          if (deep > 1) { text += tree[i][3] ? '┗ ' : '┣ ' }
          text += tree[i][2]
          // 新增一项option
          $this.append('<option value="' + tree[i][0] + '" data-pid="' + tree[i][1] + '">' + text + '</option>')
          showtree(tree[i][0])
          deep--
        }
      })
    }

    // 判断当前节点是否是其父节点的最后一个
    function islast(id, pid) {
      // N表示当前节点，M表示下一个节点
      var n = 0
      var m = 0
      for (var i = 0; i < tree.length; i++) {
        if (tree[i][1] === pid) {
          if (tree[i][0] === id) { n = i }
          else { m = i }
          if (m > 0 && n > 0 && m > n) { return false }
        }
      }
      return true
    }

    // 判断当前节点的父节点是否是最后一个
    function parentislast(id, deep) {
      var i, j
      var pid = id
      for (j = deep; j > 0; j--) {
        for (i = 0; i < tree.length; i++) {
          if (tree[i][0] === pid) {
            pid = tree[i][1]
            break
          }
        }
      }
      for (i = 0; i < tree.length; i++) {
        if (tree[i][0] === pid) { return tree[i][3] }
      }
    }

    // 获取完整路径文字
    function position(id) {
      if (id) {
        $.each(tree, function (i) {
          if (tree[i][0].toString() === id.toString()) {
            if (title === '') { title = tree[i][2] }
            else { title = tree[i][2] + ' → ' + title }
            position(tree[i][1])
          }
        })
      }
    }
  }
})(jQuery)