Skip to content

Commit 48c5b13

Browse files
NightCatSamaNightCatSama
committed
modify some bug
1 parent 351d364 commit 48c5b13

17 files changed

+139
-47
lines changed

‎.babelrc

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"presets": ["es2015"],
3+
"plugins": ["transform-runtime"],
4+
"comments": false
5+
}

‎.gitignore

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
node_modules/
2+
npm-debug.log

‎LICENSE

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
The MIT License (MIT)
2+
3+
Copyright (c) 2016 NightCatSama.
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

‎LICENSE.md

-23
This file was deleted.

‎README.md

+5-5
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
# vue-slider-component
22
Can use the slider in vue1.x and vue2.x
33

4-
[demo](https://nightcatsama.github.io/vue-slider-component/example/)
4+
[Live Demo](https://nightcatsama.github.io/vue-slider-component/example/)
55

66
## Install
77
```
@@ -110,9 +110,9 @@ new Vue({
110110
| class-name | String | null | the custom class |
111111
| styles | Object | null | the custom styles |
112112
| direction | String | horizontal | set the direction of the component, optional value: ['horizontal', 'vertical'] |
113-
| eventType | String | 'auto' | the event type, optional value: ['auto', 'touch', 'mouse', 'none'] |
114-
| width | Number[,String(in horizontal)] | 150 | width of the component |
115-
| height | Number[,String(in vertical)] | 4 | height of the component |
113+
| eventType | String | auto | the event type, optional value: ['auto', 'touch', 'mouse', 'none'] |
114+
| width | Number[,String(in horizontal)] | 150 | width of the component |
115+
| height | Number[,String(in vertical)] | 4 | height of the component |
116116
| dotSize | Number | 15 | size of the sliders |
117117
| min | Number | 0 | the minimum value |
118118
| max | Number | 100 | the maximum value |
@@ -122,7 +122,7 @@ new Vue({
122122
| disabled | Boolean | false | whether to disable components |
123123
| piecewise | Boolean | false | display of the piecewise |
124124
| tooltip | String,Boolean| false | control the tooltip, optional value: ['hover', 'always', false] |
125-
| tooltipDir | String | top or left | set the direction of the tooltip, optional value: ['top', 'bottom', 'left', 'right'] |
125+
| tooltipDir | String | top(in horizontal)or left(in vertical) | set the direction of the tooltip, optional value: ['top', 'bottom', 'left', 'right'] |
126126
| val | Number,Array | 0 | initial value (if the value for the array open range model) |
127127
| data | Array | null | the custom data |
128128

‎dist/index.js

+1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎example/src/App.vue

-1
Original file line numberDiff line numberDiff line change
@@ -273,7 +273,6 @@ export default {
273273
callback(name, val) {
274274
let obj = this.demo[name]
275275
obj.val = val
276-
console.log(`喵喵喵 => ${val}`)
277276
},
278277
/* ------------------------------- */
279278
setDisabled(name) {

‎example/src/index.js

+4-2
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,4 @@
1-
import vue2Slider from './vue2-slider.vue'
2-
export default vue2Slider
1+
import vueSlider from './vue2-slider';
2+
3+
export default vueSlider
4+

‎example/src/vue-slider.vue

+5-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<template>
22
<span>
33
<template v-if="isMoblie">
4-
<div v-el:wrap :class="['vue-slider-wrap', flowDirection, className, { 'vue-slider-disabled': (isDisabled && this.eventType !== 'none') }]" v-show="show" :style="[( styles || {} ), wrapStyles]" @click="wrapClick">
4+
<div v-el:wrap :class="['vue-slider-wrap', flowDirection, className, disabledClass]" v-show="show" :style="[( styles || {} ), wrapStyles]" @click="wrapClick">
55
<div v-el:elem class="vue-slider" :style="elemStyles">
66
<template v-if="isRange">
77
<div v-el:dot0 :data-rangeValue="value[0]" :class="[ tooltipStatus, `vue-slider-tooltip-${tooltipDirection}`, 'vue-slider-dot']" :style="dotStyles" @touchstart="moveStart(0)"></div>
@@ -23,7 +23,7 @@
2323
</div>
2424
</template>
2525
<template v-else>
26-
<div v-el:wrap :class="['vue-slider-wrap', flowDirection, className, { 'vue-slider-disabled': (isDisabled && this.eventType !== 'none') }]" v-show="show" :style="[( styles || {} ), wrapStyles]" @click="wrapClick">
26+
<div v-el:wrap :class="['vue-slider-wrap', flowDirection, className, disabledClass]" v-show="show" :style="[( styles || {} ), wrapStyles]" @click="wrapClick">
2727
<div v-el:elem class="vue-slider" :style="elemStyles">
2828
<template v-if="isRange">
2929
<div v-el:dot0 :data-rangeValue="value[0]" :class="[ tooltipStatus, `vue-slider-tooltip-${tooltipDirection}`, 'vue-slider-dot']" :style="dotStyles" @mousedown="moveStart(0)"></div>
@@ -152,6 +152,9 @@ export default {
152152
isDisabled: function() {
153153
return this.eventType === 'none' ? true : this.disabled
154154
},
155+
disabledClass: function() {
156+
return this.disabled ? 'vue-slider-disabled' : ''
157+
},
155158
isRange: function() {
156159
return Array.isArray(this.val)
157160
},

‎example/src/vue2-slider.vue

+6-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<template>
22
<span>
33
<template v-if="isMoblie">
4-
<div ref="wrap" :class="['vue-slider-wrap', flowDirection, className, { 'vue-slider-disabled': (isDisabled && this.eventType !== 'none') }]" v-show="show" :style="[( styles || {} ), wrapStyles]" @click="wrapClick">
4+
<div ref="wrap" :class="['vue-slider-wrap', flowDirection, className, disabledClass]" v-show="show" :style="[( styles || {} ), wrapStyles]" @click="wrapClick">
55
<div ref="elem" class="vue-slider" :style="elemStyles">
66
<template v-if="isRange">
77
<div ref="dot0" :data-rangeValue="value[0]" :class="[ tooltipStatus, `vue-slider-tooltip-${tooltipDirection}`, 'vue-slider-dot']" :style="dotStyles" @touchstart="moveStart(0)"></div>
@@ -23,7 +23,7 @@
2323
</div>
2424
</template>
2525
<template v-else>
26-
<div ref="wrap" :class="['vue-slider-wrap', flowDirection, className, { 'vue-slider-disabled': (isDisabled && this.eventType !== 'none') }]" v-show="show" :style="[( styles || {} ), wrapStyles]" @click="wrapClick">
26+
<div ref="wrap" :class="['vue-slider-wrap', flowDirection, className, disabledClass]" v-show="show" :style="[( styles || {} ), wrapStyles]" @click="wrapClick">
2727
<div ref="elem" class="vue-slider" :style="elemStyles">
2828
<template v-if="isRange">
2929
<div ref="dot0" :data-rangeValue="value[0]" :class="[ tooltipStatus, `vue-slider-tooltip-${tooltipDirection}`, 'vue-slider-dot']" :style="dotStyles" @mousedown="moveStart(0)"></div>
@@ -46,6 +46,7 @@
4646
</template>
4747
</span>
4848
</template>
49+
4950
<script>
5051
export default {
5152
data() {
@@ -152,6 +153,9 @@ export default {
152153
isDisabled: function() {
153154
return this.eventType === 'none' ? true : this.disabled
154155
},
156+
disabledClass: function() {
157+
return this.disabled ? 'vue-slider-disabled' : ''
158+
},
155159
isRange: function() {
156160
return Array.isArray(this.val)
157161
},

‎example/webpack.config.js

+3
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,9 @@ module.exports = {
88
publicPath: '/dist/',
99
filename: 'build.js'
1010
},
11+
resolve: {
12+
extensions: [ '', '.js', '.vue' ]
13+
},
1114
resolveLoader: {
1215
root: path.join(__dirname, 'node_modules'),
1316
},

‎index.js

-2
This file was deleted.

‎package.json

+29-6
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,41 @@
11
{
22
"name": "vue-slider-component",
3-
"version": "1.0.9",
3+
"version": "1.1.0",
44
"description": "Can use the Slider component in vue1.x and vue2.x",
5-
"main": "index.js",
6-
"scripts": {
7-
},
5+
"keywords": [
6+
"vue",
7+
"vue-component",
8+
"vue-slider-component"
9+
],
10+
"main": "./dist/index.js",
811
"repository": {
912
"type": "git",
1013
"url": "git+https://github.com/NightCatSama/vue-slider-component.git"
1114
},
1215
"author": "NightCatSama <[email protected]>",
13-
"license": "ISC",
16+
"licenses": "MIT",
1417
"bugs": {
1518
"url": "https://github.com/NightCatSama/vue-slider-component/issues"
1619
},
17-
"homepage": "https://github.com/NightCatSama/vue-slider-component#readme"
20+
"homepage": "https://github.com/NightCatSama/vue-slider-component#readme",
21+
"scripts": {
22+
"build": "rm -rf ./dist && webpack --config ./webpack.config.js"
23+
},
24+
"devDependencies": {
25+
"babel-core": "^6.10.4",
26+
"babel-loader": "^6.2.4",
27+
"babel-plugin-transform-runtime": "^6.9.0",
28+
"babel-preset-es2015": "^6.9.0",
29+
"babel-preset-stage-2": "^6.11.0",
30+
"babel-runtime": "^6.9.2",
31+
"css-loader": "^0.23.1",
32+
"style-loader": "^0.13.1",
33+
"vue-html-loader": "^1.2.3",
34+
"vue-loader": "^8.5.3",
35+
"vue-style-loader": "^1.0.0",
36+
"webpack": "^1.13.1"
37+
},
38+
"dependencies": {
39+
"vue": "^1.0.26"
40+
}
1841
}

‎src/index.js

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
import vueSlider from './vue2-slider';
2+
3+
export default vueSlider
4+

‎vue-slider.vue renamed to ‎src/vue-slider.vue

+5-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<template>
22
<span>
33
<template v-if="isMoblie">
4-
<div v-el:wrap :class="['vue-slider-wrap', flowDirection, className, { 'vue-slider-disabled': (isDisabled && this.eventType !== 'none') }]" v-show="show" :style="[( styles || {} ), wrapStyles]" @click="wrapClick">
4+
<div v-el:wrap :class="['vue-slider-wrap', flowDirection, className, disabledClass]" v-show="show" :style="[( styles || {} ), wrapStyles]" @click="wrapClick">
55
<div v-el:elem class="vue-slider" :style="elemStyles">
66
<template v-if="isRange">
77
<div v-el:dot0 :data-rangeValue="value[0]" :class="[ tooltipStatus, `vue-slider-tooltip-${tooltipDirection}`, 'vue-slider-dot']" :style="dotStyles" @touchstart="moveStart(0)"></div>
@@ -23,7 +23,7 @@
2323
</div>
2424
</template>
2525
<template v-else>
26-
<div v-el:wrap :class="['vue-slider-wrap', flowDirection, className, { 'vue-slider-disabled': (isDisabled && this.eventType !== 'none') }]" v-show="show" :style="[( styles || {} ), wrapStyles]" @click="wrapClick">
26+
<div v-el:wrap :class="['vue-slider-wrap', flowDirection, className, disabledClass]" v-show="show" :style="[( styles || {} ), wrapStyles]" @click="wrapClick">
2727
<div v-el:elem class="vue-slider" :style="elemStyles">
2828
<template v-if="isRange">
2929
<div v-el:dot0 :data-rangeValue="value[0]" :class="[ tooltipStatus, `vue-slider-tooltip-${tooltipDirection}`, 'vue-slider-dot']" :style="dotStyles" @mousedown="moveStart(0)"></div>
@@ -152,6 +152,9 @@ export default {
152152
isDisabled: function() {
153153
return this.eventType === 'none' ? true : this.disabled
154154
},
155+
disabledClass: function() {
156+
return this.disabled ? 'vue-slider-disabled' : ''
157+
},
155158
isRange: function() {
156159
return Array.isArray(this.val)
157160
},

‎vue2-slider.vue renamed to ‎src/vue2-slider.vue

+6-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<template>
22
<span>
33
<template v-if="isMoblie">
4-
<div ref="wrap" :class="['vue-slider-wrap', flowDirection, className, { 'vue-slider-disabled': (isDisabled && this.eventType !== 'none') }]" v-show="show" :style="[( styles || {} ), wrapStyles]" @click="wrapClick">
4+
<div ref="wrap" :class="['vue-slider-wrap', flowDirection, className, disabledClass]" v-show="show" :style="[( styles || {} ), wrapStyles]" @click="wrapClick">
55
<div ref="elem" class="vue-slider" :style="elemStyles">
66
<template v-if="isRange">
77
<div ref="dot0" :data-rangeValue="value[0]" :class="[ tooltipStatus, `vue-slider-tooltip-${tooltipDirection}`, 'vue-slider-dot']" :style="dotStyles" @touchstart="moveStart(0)"></div>
@@ -23,7 +23,7 @@
2323
</div>
2424
</template>
2525
<template v-else>
26-
<div ref="wrap" :class="['vue-slider-wrap', flowDirection, className, { 'vue-slider-disabled': (isDisabled && this.eventType !== 'none') }]" v-show="show" :style="[( styles || {} ), wrapStyles]" @click="wrapClick">
26+
<div ref="wrap" :class="['vue-slider-wrap', flowDirection, className, disabledClass]" v-show="show" :style="[( styles || {} ), wrapStyles]" @click="wrapClick">
2727
<div ref="elem" class="vue-slider" :style="elemStyles">
2828
<template v-if="isRange">
2929
<div ref="dot0" :data-rangeValue="value[0]" :class="[ tooltipStatus, `vue-slider-tooltip-${tooltipDirection}`, 'vue-slider-dot']" :style="dotStyles" @mousedown="moveStart(0)"></div>
@@ -46,6 +46,7 @@
4646
</template>
4747
</span>
4848
</template>
49+
4950
<script>
5051
export default {
5152
data() {
@@ -152,6 +153,9 @@ export default {
152153
isDisabled: function() {
153154
return this.eventType === 'none' ? true : this.disabled
154155
},
156+
disabledClass: function() {
157+
return this.disabled ? 'vue-slider-disabled' : ''
158+
},
155159
isRange: function() {
156160
return Array.isArray(this.val)
157161
},

‎webpack.config.js

+43
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
const webpack = require('webpack')
2+
3+
module.exports = {
4+
entry: './src/index.js',
5+
output: {
6+
path: './dist/',
7+
filename: 'index.js',
8+
library: 'vue-slider-component',
9+
libraryTarget: 'umd',
10+
umdNamedDefine: true
11+
},
12+
resolve: {
13+
extensions: [ '', '.js', '.vue' ]
14+
},
15+
module: {
16+
loaders: [
17+
{
18+
test: /\.js$/,
19+
loader: 'babel',
20+
include: __dirname,
21+
exclude: /node_modules/
22+
},
23+
{
24+
test: /\.vue$/,
25+
loader: 'vue'
26+
},
27+
{
28+
test: /\.css$/,
29+
loader: 'style!css'
30+
}
31+
]
32+
},
33+
plugins: [
34+
new webpack.optimize.UglifyJsPlugin( {
35+
minimize : true,
36+
sourceMap : false,
37+
mangle: true,
38+
compress: {
39+
warnings: false
40+
}
41+
} )
42+
]
43+
}

0 commit comments

Comments
 (0)