// 左侧树形分类
import * as sheetInterface from '@/api/modules/sheetApi.js';

export default {
  data() {
    return {};
  },
  directives: {
    drag(el, bindings) {
      el.onmousedown = function(e) {
				var init = e.clientX;
				var box = $("#box")[0]
				let total_wid = box.offsetWidth
        var left = $("#left")[0];
        var right = $("#right")[0];
        var initWidth = left.offsetWidth;
        document.onmousemove = function(e) {
          var end = e.clientX;
					if(end > 310){
            var newWidth = end - init + initWidth;
						// right.style.width = total_wid-end+80 +'px'
						right.style.width = total_wid - newWidth + 'px'
            left.style.width = newWidth + "px";
          }else{
            end = 350;
            // 最小宽度300
            left.style.width = 300 + "px";
						// right.style.width = total_wid-300-20 +'px'
          }
        };
        document.onmouseup = function() {
          document.onmousemove = document.onmouseup = null;
					e.releaseCapture && e.releaseCapture();
        };
				e.setCapture && e.setCapture();
				return false;
      };
    }
  },

  methods: {
    /* 根据unicode展开树结构并选中当前图表 重置图表配置 日期区间 */
    selectCurrentNode({ code, id, type }) {
      let deep_arr = _.cloneDeep(this.treeData);
      // 查找图表的分类父级id
      let arr = this.findParentNodeHandle(deep_arr, code).slice(1).reverse(); // 父的父的父-父的父-父
      this.defaultShowNodes = arr;
      this.select_node = code;
      this.$refs.treeRef.setCurrentKey(this.select_node);
      // // 重置筛选状态
      this.select_id = id;
    },

    // 查找树节点所有父节点
    findParentNodeHandle(arr, id) {
      // 遍历取父级code push数组
      for (let i of arr) {
        if (i.UniqueCode === id) {
          return [i.UniqueCode];
        }
        if (i.Children) {
          let node = this.findParentNodeHandle(i.Children, id);
          if (node) {
            return node.concat(i.UniqueCode);
          }
        }
      }
    },

    /* 拖动时node宽度跟随变化 */
    resetNodeStyle: _.debounce(function(node) {
			const tree = $('.target_tree')[0];
			let width = tree.offsetWidth;
			// let label_wid = width > 500 ? 'auto' : (width <= 300 && width < 360) ?  100 : 0.7*width;
			let label_wid =
				width > 500
					? 'auto'
					: width <= 260
					? 90
					: 0.7 * width;
			this.$set(node, 'Nodewidth', label_wid + 'px');
		},200),

    	/* 双击label出现input修改框 */
		editNodeLabel(data,type='') {
      if(type === 'edit-tit') {
        if([2,3].includes(this.sheetDetailInfo.Source)) return
        
        this.$set(data,'isEditTit',true)
        this.sheet_title = data.ExcelName;
        this.$nextTick(() => {
          this.$refs.sheetEditTitRef.focus();
        });
      } else {
        //目录名称可以双击修改
        if(data.ExcelInfoId) return
        this.$set(data,'isEdit',true)
        this.new_label = data.ExcelClassifyName;
        this.$nextTick(() => {
          this.$refs.editVal.focus();
        });
      }
		},

		/* input失去焦点恢复node 修改最新的值*/
		changeValue(data,type='') {
      if(type === 'edit-tit') {
        if(!this.sheet_title) return this.$message.warning('表格名称不能为空');
        data.isEditTit = false;
        data.ExcelName = this.sheet_title;
      }else {
        if(!this.new_label) return this.$message.warning('名称不能为空');
        this.$set(data,'isEdit',false)
  
        this.new_label !== data.ClassifyName && sheetInterface.classifyEdit({
          ExcelClassifyId: data.ExcelClassifyId,
          ExcelClassifyName: this.new_label
        }).then(res => {
          if(res.Ret !== 200) return
  
          this.getTreeData();
        }) 
      }
		},

    /* 拖拽完成 */
    dropOverHandle(b, a, i, e) {
      // console.log(i, a);
      // 被拖拽节点对应的 Node、结束拖拽时最后进入的节点、被拖拽节点的放置位置
      // 一/二级目录
      if ([1].includes(b.level)) this.handleMoveCatalogue(b, a, i, e);

      // 指标层
      if (b.level === 2) this.handleMoveSheet(b, a, i, e);
    },

    // 移动的为一级目录
    handleMoveCatalogue(b, a, i, e) {
      let list = a.parent.childNodes,
        targetIndex = 0,
        PrevClassifyId = 0,
        NextClassifyId = 0;

      list.forEach((item, index) => {
        if (item.data.ExcelClassifyId === b.data.ExcelClassifyId) {
          targetIndex = index;
          return;
        }
      });

      if (targetIndex === 0) {
        PrevClassifyId = 0;
        NextClassifyId = list[targetIndex + 1].data.ExcelClassifyId;
      } else if (targetIndex === list.length - 1) {
        PrevClassifyId = list[targetIndex - 1].data.ExcelClassifyId;
        NextClassifyId = 0;
      } else {
        PrevClassifyId = list[targetIndex - 1].data.ExcelClassifyId;
        NextClassifyId = list[targetIndex + 1].data.ExcelClassifyId;
      }

      sheetInterface
        .classifyMove({
          ClassifyId: b.data.ExcelClassifyId,
          PrevClassifyId: PrevClassifyId,
          NextClassifyId: NextClassifyId,
        })
        .then((res) => {
          if (res.Ret !== 200) return;
          this.$message.success("移动成功!");
          this.getTreeData();
        });
    },

    // 移动的为表格
    handleMoveSheet(b, a, i, e) {
      let PrevSheetId = 0,
        NextSheetId = 0,
        targetIndex = 0,
        list = a.parent.data.Children;
      if (i === "inner") {
        PrevSheetId = 0;
        NextSheetId =
          a.data.Children.length > 1 ? a.data.Children[1].ExcelInfoId : 0;
      } else {
        list.forEach((item, index) => {
          if (item.ExcelInfoId === b.data.ExcelInfoId) {
            targetIndex = index;
            return;
          }
        });

        if (targetIndex === 0) {
          PrevSheetId = 0;
          NextSheetId = list[targetIndex + 1].ExcelInfoId;
        } else if (targetIndex === list.length - 1) {
          PrevSheetId = list[targetIndex - 1].ExcelInfoId;
          NextSheetId = 0;
        } else {
          PrevSheetId = list[targetIndex - 1].ExcelInfoId;
          NextSheetId = list[targetIndex + 1].ExcelInfoId;
        }
      }

      sheetInterface
        .sheetMove({
          ExcelClassifyId: a.data.ExcelClassifyId,
          ExcelInfoId: b.data.ExcelInfoId,
          ClassifyId: b.data.ExcelClassifyId,
          PrevExcelInfoId: PrevSheetId,
          NextExcelInfoId: NextSheetId,
        })
        .then((res) => {
          if (res.Ret !== 200) return;
          this.$message.success("移动成功!");
          this.getTreeData();
        });

    },

    /* 拖拽覆盖添加背景色 */
    dropMouseOver(node1, node2, e) {
      if (
        (node1.level === 2 && node2.level === 1) &&
        (e.target.childNodes[0].className.includes("el-tree-node__content") ||
          e.target.className.includes("el-tree-node__content"))
      ) {
        e.target.childNodes[0].className.includes("el-tree-node__content")
          ? (e.target.childNodes[0].style.backgroundColor = "#409eff")
          : (e.target.style.backgroundColor = "#409eff");
      }
    },

    /* 拖拽离开/拖拽完成重置背景色 */
    dropMouseLeave(node1, node2, e) {
      let arrs = $(".el-tree-node__content");
      for (let a of arrs) {
        a.style.backgroundColor = "transparent";
      }
    },

    // 树节点展开
    handleNodeExpand(data) {
      // 保存当前展开的节点
      let flag = this.defaultShowNodes.some((item) => item === data.UniqueCode);

      if (!flag) {
        // 不存在则存到数组里
        this.defaultShowNodes.push(data.UniqueCode);
      }
    },

    // 树节点关闭
    handleNodeCollapse(data) {
      this.defaultShowNodes.some((item, index) => {
        if (item === data.UniqueCode) {
          // 删除关闭节点
          this.defaultShowNodes.length = index;
        }
      });
    },

    /* 判断节点是否能被拖拽 */
    canDragHandle(node) {
      let canMove = true;
      return canMove;
    },

    /* 判断节点是否能被拖入 */
    canDropHandle(draggingNode, dropNode, type) {
      let canDrop = false;
      // 移动的是一级目录
      if (draggingNode.level === 1 && dropNode.level === 1 &&type!=='inner') {
        canDrop = true;
      }

      // 二级
      if (draggingNode.level === 2) {
        if (
          (dropNode.level === 1 && type === "inner") ||
          (dropNode.level === 2 && type !== "inner")
        ) {
          canDrop = true;
        }
      }

      return canDrop;
    },
  },
};
