Compare commits
3 Commits
Author | SHA1 | Date | |
---|---|---|---|
![]() |
2367a7d1e6 | ||
![]() |
01eca7d2a3 | ||
![]() |
2f1205ae02 |
@@ -9,4 +9,4 @@ test
|
||||
.babelrc
|
||||
.travis.yml
|
||||
karma.conf.js
|
||||
webpack.config.js
|
||||
build
|
@@ -1,14 +1,9 @@
|
||||
var webpack = require('webpack');
|
||||
var path = require('path');
|
||||
|
||||
var projectRoot = path.resolve(__dirname, '../')
|
||||
|
||||
module.exports = {
|
||||
entry: './src/index.js',
|
||||
output: {
|
||||
path: path.resolve(__dirname, 'dist'),
|
||||
filename: 'vue-tree-list.min.js',
|
||||
library: 'VueTreeList',
|
||||
libraryTarget: 'umd'
|
||||
},
|
||||
module: {
|
||||
loaders: [
|
||||
{
|
||||
@@ -18,7 +13,7 @@ module.exports = {
|
||||
{
|
||||
test: /\.js$/,
|
||||
loader: 'babel',
|
||||
include: [path.join(__dirname, 'src')],
|
||||
include: [path.join(projectRoot, 'src'), path.join(projectRoot, 'dev')],
|
||||
exclude: /node_modules/
|
||||
},
|
||||
{
|
||||
@@ -40,12 +35,5 @@ module.exports = {
|
||||
browsers: ['iOS >= 7', 'Android >= 4.1']
|
||||
})
|
||||
]
|
||||
},
|
||||
plugins: [
|
||||
new webpack.optimize.UglifyJsPlugin({
|
||||
compress: {
|
||||
warnings: false
|
||||
}
|
||||
})
|
||||
]
|
||||
}
|
||||
}
|
16
build/webpack.build.conf.js
Normal file
16
build/webpack.build.conf.js
Normal file
@@ -0,0 +1,16 @@
|
||||
var webpack = require('webpack')
|
||||
var merge = require('webpack-merge')
|
||||
var baseConfig = require('./webpack.base.conf')
|
||||
var path = require('path')
|
||||
|
||||
var projectRoot = path.resolve(__dirname, '../')
|
||||
|
||||
module.exports = merge(baseConfig, {
|
||||
entry: './src/index.js',
|
||||
output: {
|
||||
path: path.resolve(projectRoot, 'dist'),
|
||||
filename: 'vue-tree-list.min.js',
|
||||
library: 'VueTreeList',
|
||||
libraryTarget: 'umd'
|
||||
}
|
||||
})
|
28
build/webpack.dev.conf.js
Normal file
28
build/webpack.dev.conf.js
Normal file
@@ -0,0 +1,28 @@
|
||||
var webpack = require('webpack')
|
||||
var merge = require('webpack-merge')
|
||||
var HtmlWebpackPlugin = require('html-webpack-plugin')
|
||||
var baseConfig = require('./webpack.base.conf')
|
||||
var path = require('path')
|
||||
|
||||
var projectRoot = path.resolve(__dirname, '../')
|
||||
|
||||
module.exports = merge(baseConfig, {
|
||||
entry: './dev/index.js',
|
||||
devServer: {
|
||||
historyApiFallback: true,
|
||||
noInfo: true,
|
||||
overlay: true,
|
||||
open: true,
|
||||
hot: true,
|
||||
inline: true
|
||||
},
|
||||
devtool: '#eval-source-map',
|
||||
plugins: [
|
||||
new HtmlWebpackPlugin({
|
||||
template: './dev/index.html',
|
||||
filename: 'index.html',
|
||||
inject: true
|
||||
}),
|
||||
new webpack.HotModuleReplacementPlugin()
|
||||
]
|
||||
})
|
84
dev/App.vue
Normal file
84
dev/App.vue
Normal file
@@ -0,0 +1,84 @@
|
||||
<template>
|
||||
<div>
|
||||
<button @click="addNode">Add Node</button>
|
||||
<vue-tree-list @click="onClick" :model="data" default-tree-node-name="new node" default-leaf-node-name="new leaf"></vue-tree-list>
|
||||
<button @click="getNewTree">Get new tree</button>
|
||||
<pre>
|
||||
{{newTree}}
|
||||
</pre>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { VueTreeList, Tree, TreeNode } from '../src'
|
||||
export default {
|
||||
components: {
|
||||
VueTreeList
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
newTree: {},
|
||||
data: new Tree([
|
||||
{
|
||||
name: 'Node 1',
|
||||
id: 1,
|
||||
pid: 0,
|
||||
dragDisabled: true,
|
||||
children: [
|
||||
{
|
||||
name: 'Node 1-2',
|
||||
id: 2,
|
||||
isLeaf: true,
|
||||
pid: 1
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Node 2',
|
||||
id: 3,
|
||||
pid: 0,
|
||||
dragDisabled: true
|
||||
},
|
||||
{
|
||||
name: 'Node 3',
|
||||
id: 4,
|
||||
pid: 0
|
||||
}
|
||||
])
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
addNode: function () {
|
||||
var node = new TreeNode({ name: 'new node', isLeaf: false })
|
||||
if (!this.data.children) this.data.children = []
|
||||
this.data.addChildren(node)
|
||||
},
|
||||
|
||||
getNewTree: function () {
|
||||
var vm = this
|
||||
function _dfs (oldNode) {
|
||||
var newNode = {}
|
||||
|
||||
for (var k in oldNode) {
|
||||
if (k !== 'children' && k !== 'parent') {
|
||||
newNode[k] = oldNode[k]
|
||||
}
|
||||
}
|
||||
|
||||
if (oldNode.children && oldNode.children.length > 0) {
|
||||
newNode.children = []
|
||||
for (var i = 0, len = oldNode.children.length; i < len; i++) {
|
||||
newNode.children.push(_dfs(oldNode.children[i]))
|
||||
}
|
||||
}
|
||||
return newNode
|
||||
}
|
||||
|
||||
vm.newTree = _dfs(vm.data)
|
||||
},
|
||||
|
||||
onClick(model) {
|
||||
console.log(model)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
11
dev/index.html
Normal file
11
dev/index.html
Normal file
@@ -0,0 +1,11 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta name="viewport" content="with=device-width,initial-scale=1.0,
|
||||
maximum-scale=1.0,minimum-scale=1.0,uses-scalable=no">
|
||||
<title>vue-date-range</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
</body>
|
||||
</html>
|
9
dev/index.js
Normal file
9
dev/index.js
Normal file
@@ -0,0 +1,9 @@
|
||||
/**
|
||||
* Created by ayou on 18/3/7.
|
||||
*/
|
||||
import Vue from 'vue'
|
||||
import App from './App.vue'
|
||||
|
||||
new Vue({
|
||||
render: h => h(App)
|
||||
}).$mount('#app')
|
1072
dist/vue-tree-list.min.js
vendored
1072
dist/vue-tree-list.min.js
vendored
File diff suppressed because one or more lines are too long
19
package.json
19
package.json
@@ -1,13 +1,14 @@
|
||||
{
|
||||
"name": "vue-tree-list",
|
||||
"version": "1.0.5",
|
||||
"version": "1.0.6",
|
||||
"description": "A vue component for tree structure. Support adding treenode/leafnode, editing node's name and dragging.",
|
||||
"main": "dist/vue-tree-list.min.js",
|
||||
"scripts": {
|
||||
"test": "karma start --single-run",
|
||||
"unit": "karma start --watch",
|
||||
"coveralls": "npm run test -- --report lcovonly && cat ./coverage/lcov.info | coveralls",
|
||||
"build": "webpack"
|
||||
"build": "webpack --config build/webpack.build.conf.js",
|
||||
"dev": "webpack-dev-server --config build/webpack.dev.conf.js"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
@@ -39,17 +40,8 @@
|
||||
"file-loader": "^0.10.1",
|
||||
"isparta": "^4.0.0",
|
||||
"isparta-loader": "^2.0.0",
|
||||
"karma": "^1.7.0",
|
||||
"karma-coverage": "^1.1.1",
|
||||
"karma-coveralls": "^1.1.2",
|
||||
"karma-mocha": "^1.3.0",
|
||||
"karma-phantomjs-launcher": "^1.0.4",
|
||||
"karma-sinon-chai": "^1.3.1",
|
||||
"karma-webpack": "^2.0.3",
|
||||
"less": "^2.7.2",
|
||||
"less-loader": "^2.2.3",
|
||||
"mocha": "^3.4.2",
|
||||
"phantomjs-prebuilt": "^2.1.14",
|
||||
"sinon": "^2.3.5",
|
||||
"sinon-chai": "^2.11.0",
|
||||
"sourcemap": "^0.1.0",
|
||||
@@ -58,6 +50,9 @@
|
||||
"vue-loader": "^11.1.3",
|
||||
"vue-style-loader": "^2.0.3",
|
||||
"vue-template-compiler": "^2.2.0",
|
||||
"webpack": "^1.13.2"
|
||||
"webpack": "^1.13.2",
|
||||
"webpack-dev-server": "1.14.0",
|
||||
"webpack-merge": "^0.14.1",
|
||||
"html-webpack-plugin": "^2.8.1"
|
||||
}
|
||||
}
|
||||
|
132
readme.md
132
readme.md
@@ -16,83 +16,77 @@ A vue component for tree structure. Support adding treenode/leafnode, editing no
|
||||
{{newTree}}
|
||||
</pre>
|
||||
...
|
||||
import { VueTreeList, Tree, TreeNode } from 'vue-tree-list'
|
||||
import { VueTreeList, Tree, TreeNode } from '../src'
|
||||
export default {
|
||||
components: {
|
||||
VueTreeList
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
isMobile: isMobile(),
|
||||
record: null,
|
||||
newTree: {},
|
||||
data: new VueTreeList.Tree([
|
||||
{
|
||||
name: 'Node 1',
|
||||
id: 1,
|
||||
pid: 0,
|
||||
dragDisabled: true,
|
||||
children: [
|
||||
{
|
||||
name: 'Node 1-2',
|
||||
id: 2,
|
||||
isLeaf: true,
|
||||
pid: 1
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Node 2',
|
||||
id: 3,
|
||||
pid: 0,
|
||||
dragDisabled: true
|
||||
},
|
||||
{
|
||||
name: 'Node 3',
|
||||
id: 4,
|
||||
pid: 0
|
||||
}
|
||||
])
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getTreeChange: function () {
|
||||
this.record = Object.assign({}, VueTreeList.Record)
|
||||
},
|
||||
|
||||
addNode: function () {
|
||||
var node = new VueTreeList.TreeNode({ name: 'new node', isLeaf: false })
|
||||
if (!this.data.children) this.data.children = []
|
||||
this.data.addChildren(node)
|
||||
},
|
||||
|
||||
getNewTree: function () {
|
||||
var vm = this
|
||||
function _dfs (oldNode) {
|
||||
var newNode = {}
|
||||
|
||||
for (var k in oldNode) {
|
||||
if (k !== 'children' && k !== 'parent') {
|
||||
newNode[k] = oldNode[k]
|
||||
components: {
|
||||
VueTreeList
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
newTree: {},
|
||||
data: new Tree([
|
||||
{
|
||||
name: 'Node 1',
|
||||
id: 1,
|
||||
pid: 0,
|
||||
dragDisabled: true,
|
||||
children: [
|
||||
{
|
||||
name: 'Node 1-2',
|
||||
id: 2,
|
||||
isLeaf: true,
|
||||
pid: 1
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Node 2',
|
||||
id: 3,
|
||||
pid: 0,
|
||||
dragDisabled: true
|
||||
},
|
||||
{
|
||||
name: 'Node 3',
|
||||
id: 4,
|
||||
pid: 0
|
||||
}
|
||||
])
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
addNode: function () {
|
||||
var node = new TreeNode({ name: 'new node', isLeaf: false })
|
||||
if (!this.data.children) this.data.children = []
|
||||
this.data.addChildren(node)
|
||||
},
|
||||
|
||||
if (oldNode.children && oldNode.children.length > 0) {
|
||||
newNode.children = []
|
||||
for (var i = 0, len = oldNode.children.length; i < len; i++) {
|
||||
newNode.children.push(_dfs(oldNode.children[i]))
|
||||
}
|
||||
getNewTree: function () {
|
||||
var vm = this
|
||||
function _dfs (oldNode) {
|
||||
var newNode = {}
|
||||
|
||||
for (var k in oldNode) {
|
||||
if (k !== 'children' && k !== 'parent') {
|
||||
newNode[k] = oldNode[k]
|
||||
}
|
||||
return newNode
|
||||
}
|
||||
|
||||
vm.newTree = _dfs(vm.data)
|
||||
},
|
||||
|
||||
onClick(model) {
|
||||
console.log(model)
|
||||
if (oldNode.children && oldNode.children.length > 0) {
|
||||
newNode.children = []
|
||||
for (var i = 0, len = oldNode.children.length; i < len; i++) {
|
||||
newNode.children.push(_dfs(oldNode.children[i]))
|
||||
}
|
||||
}
|
||||
return newNode
|
||||
}
|
||||
|
||||
vm.newTree = _dfs(vm.data)
|
||||
},
|
||||
|
||||
onClick(model) {
|
||||
console.log(model)
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
|
Reference in New Issue
Block a user