From aba8ad9da397f4c1146bc3aa90fc90bc99fffdb3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=BD=AD=E5=BF=97=E4=BA=AE?= Date: Tue, 9 May 2017 11:34:29 +0800 Subject: [PATCH 01/22] tijiao --- ranger/README.md | 0 ranger/channel.js | 5 + ranger/index.vue | 448 ++++++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 453 insertions(+) create mode 100644 ranger/README.md create mode 100644 ranger/channel.js create mode 100644 ranger/index.vue diff --git a/ranger/README.md b/ranger/README.md new file mode 100644 index 0000000..e69de29 diff --git a/ranger/channel.js b/ranger/channel.js new file mode 100644 index 0000000..b2e667b --- /dev/null +++ b/ranger/channel.js @@ -0,0 +1,5 @@ +import Vue from 'vue' +import Draggable from '../draggable' +var vm = new Vue(); +Vue.directive('draggable', Draggable) +export default vm; \ No newline at end of file diff --git a/ranger/index.vue b/ranger/index.vue new file mode 100644 index 0000000..659ae27 --- /dev/null +++ b/ranger/index.vue @@ -0,0 +1,448 @@ + + + \ No newline at end of file From fe0f02af40087c99ad0e8a7b45f47970de7e35ed Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=BD=AD=E5=BF=97=E4=BA=AE?= Date: Tue, 9 May 2017 13:40:24 +0800 Subject: [PATCH 02/22] tijiao --- ranger/index.vue | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/ranger/index.vue b/ranger/index.vue index 659ae27..5e4871a 100644 --- a/ranger/index.vue +++ b/ranger/index.vue @@ -414,6 +414,12 @@ /* 父元素改变状态值 */ setValue (val) { var _$ = this + if (val.some((v) => { + return v < _$.range[0] || v > _$.range[1] + })) { + throw new Error('val必须在range范围之内') + return + } _$.value = val; _$.setting = true if (_$.sliderNum === 1) { From fc5a26c2762c44fabbf651b9fd57d721da224d45 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=BD=AD=E5=BF=97=E4=BA=AE?= Date: Tue, 9 May 2017 16:24:55 +0800 Subject: [PATCH 03/22] tijao --- ranger/index.vue | 142 ++++++++++++----------------------------------- 1 file changed, 36 insertions(+), 106 deletions(-) diff --git a/ranger/index.vue b/ranger/index.vue index 5e4871a..68944d7 100644 --- a/ranger/index.vue +++ b/ranger/index.vue @@ -108,7 +108,9 @@ } .set-trans { - transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1) + transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1) 0ms; + -webkit-transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1) 0ms; + -moz-transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1) 0ms; } \ No newline at end of file From eda3190172f72b39b0cebdb5cfd898dac13ae6ab Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=BD=AD=E5=BF=97=E4=BA=AE?= Date: Fri, 9 Jun 2017 13:43:17 +0800 Subject: [PATCH 13/22] tijiao --- iosselect/index.js | 15 ++++ iosselect/select.vue | 167 ++++++++++++++++++++++++++++++++++++++ iosselect/selectRender.js | 33 ++++++++ 3 files changed, 215 insertions(+) create mode 100644 iosselect/index.js create mode 100644 iosselect/select.vue create mode 100644 iosselect/selectRender.js diff --git a/iosselect/index.js b/iosselect/index.js new file mode 100644 index 0000000..139ca63 --- /dev/null +++ b/iosselect/index.js @@ -0,0 +1,15 @@ +/** + * Created by EX-pengzhiliang001 on 2017-06-08. + */ +import SelectRender from './selectRender' + +export default { + bind(el, binding) { + console.log(el, binding, 92929) + el.addEventListener('click', () => { + console.log(1312313) + let re = new SelectRender() + re.show() + }) + } +} \ No newline at end of file diff --git a/iosselect/select.vue b/iosselect/select.vue new file mode 100644 index 0000000..a8d186b --- /dev/null +++ b/iosselect/select.vue @@ -0,0 +1,167 @@ + + + \ No newline at end of file diff --git a/iosselect/selectRender.js b/iosselect/selectRender.js new file mode 100644 index 0000000..f1407cb --- /dev/null +++ b/iosselect/selectRender.js @@ -0,0 +1,33 @@ +/** + * Created by EX-pengzhiliang001 on 2017-06-08. + */ +import Vue from 'vue' +import select from './select' + +export default class SelectRender { + constructor() { + this._vm = null + } + + show () { + if (!document.querySelector('[vmui-select]')) { + this.createElement('vmui-select') + } + let Select = Vue.extend(select) + new Select({ + propsData:{ + + } + }).$mount('[vmui-select]') + } + + hide () { + + } + + createElement(attr, tag) { + let $d = document.createElement(tag || 'div') + $d.setAttribute(attr, '') + document.body.appendChild($d); + } +} From 5844304313dc1f89c299668391174213c73d2cec Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=BD=AD=E5=BF=97=E4=BA=AE?= Date: Tue, 13 Jun 2017 18:06:18 +0800 Subject: [PATCH 14/22] tijiao --- iosselect/index.js | 2 +- iosselect/select.vue | 167 +++++++++++++++++++++++++------------- iosselect/selectRender.js | 39 ++++++++- 3 files changed, 149 insertions(+), 59 deletions(-) diff --git a/iosselect/index.js b/iosselect/index.js index 139ca63..092f836 100644 --- a/iosselect/index.js +++ b/iosselect/index.js @@ -8,7 +8,7 @@ export default { console.log(el, binding, 92929) el.addEventListener('click', () => { console.log(1312313) - let re = new SelectRender() + let re = new SelectRender(el, binding) re.show() }) } diff --git a/iosselect/select.vue b/iosselect/select.vue index a8d186b..080b066 100644 --- a/iosselect/select.vue +++ b/iosselect/select.vue @@ -3,12 +3,13 @@
-

取消

-

确定

+

取消

+

确定

  • - +
    • {{it.label}} @@ -59,9 +60,10 @@ } .vmui-select-label-list li{ line-height:35px; + height:35px; text-align: center; font-size: 13px; - /*opacity: 0.1;*/ + opacity: 0.3; } @@ -69,56 +71,29 @@ import Scroll from '../scroll' import Overlay from '../overlay' const LINEHEIGHT = 35 + + export default { mixins: [Overlay], props: { selectList: { type: Array, default() { - return [ - [ - {label: '1', value: 1}, - {label: '2', value: 2}, - {label: '3', value: 3}, - {label: '4', value: 4}, - {label: '5', value: 5}, - {label: '6', value: 6}, - {label: '7', value: 7}, - {label: '8', value: 8}, - {label: '9', value: 8}, - {label: '10', value: 10}, - {label: '11', value: 11}, - {label: '11', value: 11}, - {label: '11', value: 11}, - {label: '11', value: 11}, - {label: '11', value: 11}, - {label: '11', value: 11}, - {label: '11', value: 11}, - {label: '11', value: 11}, - {label: '11', value: 11}, - {label: '11', value: 11}, - {label: '11', value: 11}, - {label: '11', value: 11}, - {label: '11', value: 11}, - {label: '11', value: 11}, - {label: '11', value: 11}, - {label: '11', value: 11}, - ], - [ - {label: '1', value: 1}, - {label: '2', value: 2}, - {label: '3', value: 3}, - {label: '4', value: 4}, - {label: '5', value: 5}, - {label: '6', value: 6}, - {label: '7', value: 7}, - {label: '8', value: 8}, - {label: '9', value: 8}, - {label: '10', value: 10}, - {label: '11', value: 11}, - ] - ] + return [] } + }, + + bindEl: { + type: null + }, + + connect: { + type: String, + default: '/' + }, + + onSure: { + type: Function } }, @@ -129,8 +104,9 @@ data () { return { - activeIndex: 0, - scrollIndex: 0 + activeIndex: [], + scrollIndex: 0, + val: [] } }, @@ -141,27 +117,108 @@ width () { return 100 / this.selectList.length - } + }, + +// val() { +// let [va, l] = [[], this.activeIndex.length] +// for (let i = 0; i < l; i++) { +// va[i] = this.selectList[i][this.activeIndex] +// } +// console.log(va, 9898) +//// va[this.scrollIndex] = this.selectList[this.scrollIndex][this.activeIndex] +// return va +// } + }, + + destroyed() { + document.body.removeChild(document.querySelector('[vmui-select]')) }, mounted() { document.getElementsByTagName('body')[0].style.overflow = 'hidden' + let l = this.selectList.length + for (let i = 0; i < l; i++) { + this.activeIndex.push(2) + } + + this._getVal() + setInterval(() => { + this._renderList() + }, 50) + }, methods: { - scrollStop(pos, index) { - console.log(pos) + _renderList() { + this.activeIndex.forEach((v1, k1) => { + let $list = this.$refs['scroll' + k1] + let $lis = $list[0].$el.querySelectorAll('li') + + $lis.forEach((v, k) => { + if(v1 === k) { + v.style.opacity = 1 + } else if(Math.abs(v1 - k) === 1){ + v.style.opacity = 0.6 + } else { + v.style.opacity = 0.3 + } + }) + }) + }, + + _getVal(){ + let l = this.activeIndex.length + for (let i = 0; i < l; i++) { + this.val[i] = this.selectList[i][this.activeIndex[i]] + } + }, + + _scrolling() { +// this._renderList() + }, + + _scrollStop(pos, index) { let topi + if (Math.abs(pos) % LINEHEIGHT > LINEHEIGHT / 2) { topi = Math.ceil( Math.abs(pos) / LINEHEIGHT ) } else { topi = Math.floor( Math.abs(pos) / LINEHEIGHT ) } - this.activeIndex = topi + 3 - console.log(this.$refs['scroll' + index],index,this.activeIndex,topi * LINEHEIGHT, 9992) + + this.activeIndex[index] = topi + 2 this.$refs['scroll' + index][0].scrollTo('-' + topi * LINEHEIGHT) -// Scroll.scrollTo(topi * LINEHEIGHT) + + this._getVal() + }, + + + _hideSelect() { + this.$destroy() + }, + + _showVal() { + + let val = [] + + this.val.forEach((v, k) => { + val.push(v.label) + }) + + if (this.bindEl.tagName === 'INPUT' ) { + if (['number','text'].indexOf(this.bindEl.getAttribute('type')) > -1) { + this.bindEl.setAttribute('value', val.join(this.connect)) + } else { + return + } + } else { + this.bindEl.innerHTML = val.join(this.connect) + } + + this.onSure(this.val) + this.$destroy() } + } } \ No newline at end of file diff --git a/iosselect/selectRender.js b/iosselect/selectRender.js index f1407cb..eee7b1f 100644 --- a/iosselect/selectRender.js +++ b/iosselect/selectRender.js @@ -5,24 +5,55 @@ import Vue from 'vue' import select from './select' export default class SelectRender { - constructor() { + constructor(el, binding) { this._vm = null + this.el = el + this._options = binding.value } show () { + console.log(this._options.selectList, 64646) + this._options.selectList = this._options.selectList.map((v, k) => { + console.log(v!='', 812312) + // return v != '' + v = v.filter((v1, k) => { + return v1 != '' + }) + return v + }) + console.log(this._options.selectList, 1111) + + let handleSelectList = () => { + this._options.selectList.forEach((v, k) => { + this._options.selectList[k].unshift({}, {}) + this._options.selectList[k].push({}, {}) + }) + } + + handleSelectList() + + console.log(this._options.selectList, 88888) + if (!document.querySelector('[vmui-select]')) { this.createElement('vmui-select') } let Select = Vue.extend(select) new Select({ propsData:{ - + bindEl: this.el, + selectList: this._options.selectList || [], + onSure: this._options.onSure || () => {}, + connect: this._options.connect || '/' } }).$mount('[vmui-select]') + + handleSelectList = null + } hide () { - + this._options = null + this._vm.$destroy() } createElement(attr, tag) { @@ -30,4 +61,6 @@ export default class SelectRender { $d.setAttribute(attr, '') document.body.appendChild($d); } + + } From a319439aa9ac033e6091b25177157cd1d100dbc7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=BD=AD=E5=BF=97=E4=BA=AE?= Date: Wed, 14 Jun 2017 17:48:05 +0800 Subject: [PATCH 15/22] tijaio --- iosselect/index.js | 18 ++++++++++++++++-- iosselect/select.vue | 36 +++++++++++++++++++++++++++--------- iosselect/selectRender.js | 27 +++++++++++++++++---------- 3 files changed, 60 insertions(+), 21 deletions(-) diff --git a/iosselect/index.js b/iosselect/index.js index 092f836..45eaef8 100644 --- a/iosselect/index.js +++ b/iosselect/index.js @@ -4,12 +4,26 @@ import SelectRender from './selectRender' export default { + update() { + console.log(9876543) + }, + bind(el, binding) { - console.log(el, binding, 92929) + // console.log(el, binding, 92929) + el.addEventListener('click', () => { - console.log(1312313) + // setInterval(() => { + // console.log(binding.value.set(binding.value.selectList), 888) + // }, 50) + + setTimeout(() => { + console.log(binding) + }, 5000) + let re = new SelectRender(el, binding) + re.show() + }) } } \ No newline at end of file diff --git a/iosselect/select.vue b/iosselect/select.vue index 080b066..b043dc0 100644 --- a/iosselect/select.vue +++ b/iosselect/select.vue @@ -9,7 +9,7 @@
      • + @drag:end="_scrollStop($event,index)" :ref="'scroll' + index">
        • {{it.label}} @@ -94,6 +94,10 @@ onSure: { type: Function + }, + + loopEvent: { + type: Function } }, @@ -142,9 +146,8 @@ } this._getVal() - setInterval(() => { - this._renderList() - }, 50) + this._renderList() + this._renderListVal() }, @@ -173,10 +176,6 @@ } }, - _scrolling() { -// this._renderList() - }, - _scrollStop(pos, index) { let topi @@ -187,9 +186,10 @@ } this.activeIndex[index] = topi + 2 - this.$refs['scroll' + index][0].scrollTo('-' + topi * LINEHEIGHT) +// this.$refs['scroll' + index][0].scrollTo('-' + topi * LINEHEIGHT) this._getVal() + this._renderList() }, @@ -217,6 +217,24 @@ this.onSure(this.val) this.$destroy() + }, + + _renderListVal() { + // if (this._options.isLoopEvent) { + // setInterval(() => { + // console.log(this._options.selectList) + // }, 50) + // } + if (this.loopEvent){ + let count = 20 + let t = setInterval(() => { +// this.$set(this.selectList,1, this.loopEvent(count)) + this.selectList[1] = this.loopEvent(count) + this.$forceUpdate() + count++ +// console.log(this.selectList, 64646) + }, 5000) + } } } diff --git a/iosselect/selectRender.js b/iosselect/selectRender.js index eee7b1f..a37f51d 100644 --- a/iosselect/selectRender.js +++ b/iosselect/selectRender.js @@ -12,16 +12,19 @@ export default class SelectRender { } show () { - console.log(this._options.selectList, 64646) + // if (this._options.loop) { + // setInterval(() => { + // + // }, 50) + // } + + this._options.selectList = this._options.selectList.map((v, k) => { - console.log(v!='', 812312) - // return v != '' v = v.filter((v1, k) => { - return v1 != '' + return Object.keys(v1).length != 0 }) return v }) - console.log(this._options.selectList, 1111) let handleSelectList = () => { this._options.selectList.forEach((v, k) => { @@ -32,27 +35,29 @@ export default class SelectRender { handleSelectList() - console.log(this._options.selectList, 88888) - if (!document.querySelector('[vmui-select]')) { this.createElement('vmui-select') } let Select = Vue.extend(select) - new Select({ + this._vm = new Select({ propsData:{ bindEl: this.el, selectList: this._options.selectList || [], onSure: this._options.onSure || () => {}, - connect: this._options.connect || '/' + connect: this._options.connect || '/', + loopEvent: this._options.loopEvent || () => {} } }).$mount('[vmui-select]') - handleSelectList = null + // handleSelectList = null + return this } hide () { this._options = null + console.log(this._options, 444) + clearInterval(this._options.interVal) this._vm.$destroy() } @@ -63,4 +68,6 @@ export default class SelectRender { } + + } From bb36b4d68c313d6906c8cc7c141cebae4e75f563 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=BD=AD=E5=BF=97=E4=BA=AE?= Date: Thu, 15 Jun 2017 11:49:21 +0800 Subject: [PATCH 16/22] tijiao --- .../components/iosselect}/index.js | 0 .../components/iosselect}/select.vue | 46 +++++++++++++----- .../components/iosselect}/selectRender.js | 47 +++++++++---------- 3 files changed, 55 insertions(+), 38 deletions(-) rename {iosselect => src/components/iosselect}/index.js (100%) rename {iosselect => src/components/iosselect}/select.vue (86%) rename {iosselect => src/components/iosselect}/selectRender.js (64%) diff --git a/iosselect/index.js b/src/components/iosselect/index.js similarity index 100% rename from iosselect/index.js rename to src/components/iosselect/index.js diff --git a/iosselect/select.vue b/src/components/iosselect/select.vue similarity index 86% rename from iosselect/select.vue rename to src/components/iosselect/select.vue index b043dc0..bf93d7d 100644 --- a/iosselect/select.vue +++ b/src/components/iosselect/select.vue @@ -6,7 +6,7 @@

          取消

          确定

          -
            +
            • @@ -32,6 +32,14 @@ background: rgba(0,0,0,0.5); z-index:100 } + .vmui-select-list{ + width:100%; + height: 175px; + overflow: hidden; + } + .vmui-select-list > li{ + float: left; + } .vmui-select{ width:100%; background: #fff; @@ -138,6 +146,10 @@ document.body.removeChild(document.querySelector('[vmui-select]')) }, + beforeMount() { + this._addNullForList() + }, + mounted() { document.getElementsByTagName('body')[0].style.overflow = 'hidden' let l = this.selectList.length @@ -148,7 +160,6 @@ this._getVal() this._renderList() this._renderListVal() - }, methods: { @@ -169,6 +180,24 @@ }) }, + _removeNullForList() { + this.selectList = this.selectList.map((v, k) => { + v = v.filter((v1, k) => { + return Object.keys(v1).length != 0 + }) + return v + }) + }, + + _addNullForList() { + this._removeNullForList() + + this.selectList.forEach((v, k) => { + this.selectList[k].unshift({}, {}) + this.selectList[k].push({}, {}) + }) + }, + _getVal(){ let l = this.activeIndex.length for (let i = 0; i < l; i++) { @@ -220,20 +249,13 @@ }, _renderListVal() { - // if (this._options.isLoopEvent) { - // setInterval(() => { - // console.log(this._options.selectList) - // }, 50) - // } if (this.loopEvent){ let count = 20 let t = setInterval(() => { -// this.$set(this.selectList,1, this.loopEvent(count)) - this.selectList[1] = this.loopEvent(count) - this.$forceUpdate() + this.$set(this.selectList,1, this.loopEvent(count)) + this._addNullForList() count++ -// console.log(this.selectList, 64646) - }, 5000) + }, 50) } } diff --git a/iosselect/selectRender.js b/src/components/iosselect/selectRender.js similarity index 64% rename from iosselect/selectRender.js rename to src/components/iosselect/selectRender.js index a37f51d..2c96d9c 100644 --- a/iosselect/selectRender.js +++ b/src/components/iosselect/selectRender.js @@ -7,33 +7,27 @@ import select from './select' export default class SelectRender { constructor(el, binding) { this._vm = null - this.el = el + this._el = el this._options = binding.value } show () { - // if (this._options.loop) { - // setInterval(() => { + + // this._options.selectList = this._options.selectList.map((v, k) => { + // v = v.filter((v1, k) => { + // return Object.keys(v1).length != 0 + // }) + // return v + // }) // - // }, 50) + // let handleSelectList = () => { + // this._options.selectList.forEach((v, k) => { + // this._options.selectList[k].unshift({}, {}) + // this._options.selectList[k].push({}, {}) + // }) // } - - this._options.selectList = this._options.selectList.map((v, k) => { - v = v.filter((v1, k) => { - return Object.keys(v1).length != 0 - }) - return v - }) - - let handleSelectList = () => { - this._options.selectList.forEach((v, k) => { - this._options.selectList[k].unshift({}, {}) - this._options.selectList[k].push({}, {}) - }) - } - - handleSelectList() + // handleSelectList() if (!document.querySelector('[vmui-select]')) { this.createElement('vmui-select') @@ -41,7 +35,7 @@ export default class SelectRender { let Select = Vue.extend(select) this._vm = new Select({ propsData:{ - bindEl: this.el, + bindEl: this._el, selectList: this._options.selectList || [], onSure: this._options.onSure || () => {}, connect: this._options.connect || '/', @@ -55,10 +49,9 @@ export default class SelectRender { } hide () { - this._options = null - console.log(this._options, 444) clearInterval(this._options.interVal) this._vm.$destroy() + this.destroy() } createElement(attr, tag) { @@ -67,7 +60,9 @@ export default class SelectRender { document.body.appendChild($d); } - - - + destroy() { + this._options = null + this._vm = null + this._el = null + } } From e80bf85111fd81690244ac2dc4dc15d7cb4a2468 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=BD=AD=E5=BF=97=E4=BA=AE?= Date: Thu, 15 Jun 2017 18:11:04 +0800 Subject: [PATCH 17/22] =?UTF-8?q?datepicker=20iosselect=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/datepicker/index.vue | 130 +++++++++++++++++++++++ src/components/iosselect/index.js | 19 ---- src/components/iosselect/select.vue | 63 +++++++---- src/components/iosselect/selectRender.js | 21 +--- 4 files changed, 174 insertions(+), 59 deletions(-) create mode 100644 src/components/datepicker/index.vue diff --git a/src/components/datepicker/index.vue b/src/components/datepicker/index.vue new file mode 100644 index 0000000..5f69205 --- /dev/null +++ b/src/components/datepicker/index.vue @@ -0,0 +1,130 @@ + + + + + \ No newline at end of file diff --git a/src/components/iosselect/index.js b/src/components/iosselect/index.js index 45eaef8..9e747d3 100644 --- a/src/components/iosselect/index.js +++ b/src/components/iosselect/index.js @@ -1,29 +1,10 @@ -/** - * Created by EX-pengzhiliang001 on 2017-06-08. - */ import SelectRender from './selectRender' export default { - update() { - console.log(9876543) - }, - bind(el, binding) { - // console.log(el, binding, 92929) - el.addEventListener('click', () => { - // setInterval(() => { - // console.log(binding.value.set(binding.value.selectList), 888) - // }, 50) - - setTimeout(() => { - console.log(binding) - }, 5000) - let re = new SelectRender(el, binding) - re.show() - }) } } \ No newline at end of file diff --git a/src/components/iosselect/select.vue b/src/components/iosselect/select.vue index bf93d7d..967a155 100644 --- a/src/components/iosselect/select.vue +++ b/src/components/iosselect/select.vue @@ -8,7 +8,7 @@
              • -
                • @@ -104,8 +104,13 @@ type: Function }, - loopEvent: { - type: Function + connectEvents: { + type: Array + }, + + autoFill: { + type: Boolean, + default: true } }, @@ -117,7 +122,7 @@ data () { return { activeIndex: [], - scrollIndex: 0, +// scrollIndex: 0, val: [] } }, @@ -158,8 +163,9 @@ } this._getVal() - this._renderList() this._renderListVal() + this._renderList() + }, methods: { @@ -205,7 +211,7 @@ } }, - _scrollStop(pos, index) { + _scrolling(pos, index) { let topi if (Math.abs(pos) % LINEHEIGHT > LINEHEIGHT / 2) { @@ -215,12 +221,17 @@ } this.activeIndex[index] = topi + 2 -// this.$refs['scroll' + index][0].scrollTo('-' + topi * LINEHEIGHT) + this.$refs['scroll' + index][0].scrollTo('-' + topi * LINEHEIGHT) this._getVal() this._renderList() }, + _scrollStop(pos, index) { + this._scrolling(pos, index) + this._renderListVal(index) + }, + _hideSelect() { this.$destroy() @@ -234,28 +245,38 @@ val.push(v.label) }) - if (this.bindEl.tagName === 'INPUT' ) { - if (['number','text'].indexOf(this.bindEl.getAttribute('type')) > -1) { - this.bindEl.setAttribute('value', val.join(this.connect)) + if (this.autoFill) { + if (this.bindEl.tagName === 'INPUT' ) { + if (['number','text'].indexOf(this.bindEl.getAttribute('type')) > -1) { + this.bindEl.setAttribute('value', val.join(this.connect)) + } else { + return + } } else { - return + this.bindEl.innerHTML = val.join(this.connect) } - } else { - this.bindEl.innerHTML = val.join(this.connect) } this.onSure(this.val) this.$destroy() }, - _renderListVal() { - if (this.loopEvent){ - let count = 20 - let t = setInterval(() => { - this.$set(this.selectList,1, this.loopEvent(count)) - this._addNullForList() - count++ - }, 50) + _setList(list, i) { + this.$set(this.selectList, i, list) + this._addNullForList() + }, + + _renderListVal(index) { + if (this.connectEvents && this.connectEvents instanceof Array){ + this.connectEvents.forEach((v, k) => { + if (v.connectPrev == index) { + try { + v.callback(this.val, v.connectPrev, v.connectNext, this._setList) + } catch (e) { + return false + } + } else return + }) } } diff --git a/src/components/iosselect/selectRender.js b/src/components/iosselect/selectRender.js index 2c96d9c..62789d4 100644 --- a/src/components/iosselect/selectRender.js +++ b/src/components/iosselect/selectRender.js @@ -13,22 +13,6 @@ export default class SelectRender { show () { - // this._options.selectList = this._options.selectList.map((v, k) => { - // v = v.filter((v1, k) => { - // return Object.keys(v1).length != 0 - // }) - // return v - // }) - // - // let handleSelectList = () => { - // this._options.selectList.forEach((v, k) => { - // this._options.selectList[k].unshift({}, {}) - // this._options.selectList[k].push({}, {}) - // }) - // } - - // handleSelectList() - if (!document.querySelector('[vmui-select]')) { this.createElement('vmui-select') } @@ -39,12 +23,11 @@ export default class SelectRender { selectList: this._options.selectList || [], onSure: this._options.onSure || () => {}, connect: this._options.connect || '/', - loopEvent: this._options.loopEvent || () => {} + connectEvents: this._options.connectEvents || null, + autoFill: this._options.autoFill } }).$mount('[vmui-select]') - // handleSelectList = null - return this } From 35bbd599f0a744ae4f4a991e664207242f3f1d19 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=BD=AD=E5=BF=97=E4=BA=AE?= Date: Fri, 16 Jun 2017 10:40:39 +0800 Subject: [PATCH 18/22] tijiao --- src/components/datepicker/index.vue | 53 +++++++++++++--------- src/components/iosselect/select.vue | 56 ++++++++++++++---------- src/components/iosselect/selectRender.js | 12 ++--- 3 files changed, 69 insertions(+), 52 deletions(-) diff --git a/src/components/datepicker/index.vue b/src/components/datepicker/index.vue index 5f69205..33d6dea 100644 --- a/src/components/datepicker/index.vue +++ b/src/components/datepicker/index.vue @@ -3,11 +3,12 @@
                  - +
                  @@ -16,11 +17,20 @@ \ No newline at end of file diff --git a/src/components/iosselect/select.vue b/src/components/iosselect/select.vue index 967a155..98ad044 100644 --- a/src/components/iosselect/select.vue +++ b/src/components/iosselect/select.vue @@ -111,6 +111,14 @@ autoFill: { type: Boolean, default: true + }, + + initValue: { + type: Array + }, + + hideEvent: { + type: Function } }, @@ -122,7 +130,6 @@ data () { return { activeIndex: [], -// scrollIndex: 0, val: [] } }, @@ -134,21 +141,12 @@ width () { return 100 / this.selectList.length - }, - -// val() { -// let [va, l] = [[], this.activeIndex.length] -// for (let i = 0; i < l; i++) { -// va[i] = this.selectList[i][this.activeIndex] -// } -// console.log(va, 9898) -//// va[this.scrollIndex] = this.selectList[this.scrollIndex][this.activeIndex] -// return va -// } + } }, destroyed() { document.body.removeChild(document.querySelector('[vmui-select]')) + this.hideEvent() }, beforeMount() { @@ -162,10 +160,7 @@ this.activeIndex.push(2) } - this._getVal() - this._renderListVal() - this._renderList() - + this._initValRender()._getVal()._renderListVal()._renderList() }, methods: { @@ -173,6 +168,7 @@ this.activeIndex.forEach((v1, k1) => { let $list = this.$refs['scroll' + k1] let $lis = $list[0].$el.querySelectorAll('li') + $list[0].scrollTo('-' + (v1 - 2) * LINEHEIGHT) $lis.forEach((v, k) => { if(v1 === k) { @@ -184,6 +180,21 @@ } }) }) + return this + }, + + _initValRender() { + let _self = this + + _self.initValue.forEach((v, k) => { + _self.selectList[k].forEach((v1, k1) => { + if(v1.value == v) { + _self.activeIndex[k] = k1 + } + }) + }) + + return _self }, _removeNullForList() { @@ -209,6 +220,7 @@ for (let i = 0; i < l; i++) { this.val[i] = this.selectList[i][this.activeIndex[i]] } + return this }, _scrolling(pos, index) { @@ -221,10 +233,8 @@ } this.activeIndex[index] = topi + 2 - this.$refs['scroll' + index][0].scrollTo('-' + topi * LINEHEIGHT) - this._getVal() - this._renderList() + this._getVal()._renderList() }, _scrollStop(pos, index) { @@ -238,7 +248,6 @@ }, _showVal() { - let val = [] this.val.forEach((v, k) => { @@ -269,15 +278,16 @@ _renderListVal(index) { if (this.connectEvents && this.connectEvents instanceof Array){ this.connectEvents.forEach((v, k) => { - if (v.connectPrev == index) { + if (v.connectDouble[0] == index) { try { - v.callback(this.val, v.connectPrev, v.connectNext, this._setList) + v.callback(this.val, v.connectDouble, this._setList) } catch (e) { return false } - } else return + } else return this }) } + return this } } diff --git a/src/components/iosselect/selectRender.js b/src/components/iosselect/selectRender.js index 62789d4..b0fcf5a 100644 --- a/src/components/iosselect/selectRender.js +++ b/src/components/iosselect/selectRender.js @@ -12,10 +12,10 @@ export default class SelectRender { } show () { - if (!document.querySelector('[vmui-select]')) { this.createElement('vmui-select') } + let Select = Vue.extend(select) this._vm = new Select({ propsData:{ @@ -24,19 +24,15 @@ export default class SelectRender { onSure: this._options.onSure || () => {}, connect: this._options.connect || '/', connectEvents: this._options.connectEvents || null, - autoFill: this._options.autoFill + autoFill: this._options.autoFill, + initValue: this._options.val, + hideEvent: this.destroy } }).$mount('[vmui-select]') return this } - hide () { - clearInterval(this._options.interVal) - this._vm.$destroy() - this.destroy() - } - createElement(attr, tag) { let $d = document.createElement(tag || 'div') $d.setAttribute(attr, '') From 5ab43688ad44b89222fdd6da26c1ea32ab2d81fd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=BD=AD=E5=BF=97=E4=BA=AE?= Date: Fri, 16 Jun 2017 10:49:09 +0800 Subject: [PATCH 19/22] tijiao --- src/components/iosselect/select.vue | 108 ++++++++++++----------- src/components/iosselect/selectRender.js | 2 +- 2 files changed, 56 insertions(+), 54 deletions(-) diff --git a/src/components/iosselect/select.vue b/src/components/iosselect/select.vue index 98ad044..6c01a2d 100644 --- a/src/components/iosselect/select.vue +++ b/src/components/iosselect/select.vue @@ -22,59 +22,7 @@
- \ No newline at end of file + + + \ No newline at end of file diff --git a/src/components/iosselect/selectRender.js b/src/components/iosselect/selectRender.js index b0fcf5a..07b4790 100644 --- a/src/components/iosselect/selectRender.js +++ b/src/components/iosselect/selectRender.js @@ -15,7 +15,7 @@ export default class SelectRender { if (!document.querySelector('[vmui-select]')) { this.createElement('vmui-select') } - + let Select = Vue.extend(select) this._vm = new Select({ propsData:{ From 3a0918b83fdb33b6e230653812f35580a2e638ce Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=BD=AD=E5=BF=97=E4=BA=AE?= Date: Fri, 16 Jun 2017 10:53:16 +0800 Subject: [PATCH 20/22] dateopicker,iosselect --- src/components/datepicker/index.vue | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/datepicker/index.vue b/src/components/datepicker/index.vue index 33d6dea..99c35e8 100644 --- a/src/components/datepicker/index.vue +++ b/src/components/datepicker/index.vue @@ -11,7 +11,6 @@ - From 2265cf810f55ee28ba5f8c6c8ceb19d93015b207 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=BD=AD=E5=BF=97=E4=BA=AE?= Date: Fri, 16 Jun 2017 13:27:57 +0800 Subject: [PATCH 21/22] tijiao --- src/components/datepicker/index.vue | 2 +- src/directives/iosselect/index.js | 10 + src/directives/iosselect/select.vue | 297 +++++++++++++++++++++++ src/directives/iosselect/selectRender.js | 47 ++++ 4 files changed, 355 insertions(+), 1 deletion(-) create mode 100644 src/directives/iosselect/index.js create mode 100644 src/directives/iosselect/select.vue create mode 100644 src/directives/iosselect/selectRender.js diff --git a/src/components/datepicker/index.vue b/src/components/datepicker/index.vue index 99c35e8..1c41f86 100644 --- a/src/components/datepicker/index.vue +++ b/src/components/datepicker/index.vue @@ -15,7 +15,7 @@ + + \ No newline at end of file diff --git a/src/directives/iosselect/selectRender.js b/src/directives/iosselect/selectRender.js new file mode 100644 index 0000000..07b4790 --- /dev/null +++ b/src/directives/iosselect/selectRender.js @@ -0,0 +1,47 @@ +/** + * Created by EX-pengzhiliang001 on 2017-06-08. + */ +import Vue from 'vue' +import select from './select' + +export default class SelectRender { + constructor(el, binding) { + this._vm = null + this._el = el + this._options = binding.value + } + + show () { + if (!document.querySelector('[vmui-select]')) { + this.createElement('vmui-select') + } + + let Select = Vue.extend(select) + this._vm = new Select({ + propsData:{ + bindEl: this._el, + selectList: this._options.selectList || [], + onSure: this._options.onSure || () => {}, + connect: this._options.connect || '/', + connectEvents: this._options.connectEvents || null, + autoFill: this._options.autoFill, + initValue: this._options.val, + hideEvent: this.destroy + } + }).$mount('[vmui-select]') + + return this + } + + createElement(attr, tag) { + let $d = document.createElement(tag || 'div') + $d.setAttribute(attr, '') + document.body.appendChild($d); + } + + destroy() { + this._options = null + this._vm = null + this._el = null + } +} From 0de591725f6900f6881f7539f5f06c773e031ae2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=BD=AD=E5=BF=97=E4=BA=AE?= Date: Fri, 16 Jun 2017 13:30:50 +0800 Subject: [PATCH 22/22] tijiao --- src/components/iosselect/index.js | 10 - src/components/iosselect/select.vue | 297 ----------------------- src/components/iosselect/selectRender.js | 47 ---- 3 files changed, 354 deletions(-) delete mode 100644 src/components/iosselect/index.js delete mode 100644 src/components/iosselect/select.vue delete mode 100644 src/components/iosselect/selectRender.js diff --git a/src/components/iosselect/index.js b/src/components/iosselect/index.js deleted file mode 100644 index 9e747d3..0000000 --- a/src/components/iosselect/index.js +++ /dev/null @@ -1,10 +0,0 @@ -import SelectRender from './selectRender' - -export default { - bind(el, binding) { - el.addEventListener('click', () => { - let re = new SelectRender(el, binding) - re.show() - }) - } -} \ No newline at end of file diff --git a/src/components/iosselect/select.vue b/src/components/iosselect/select.vue deleted file mode 100644 index 6c01a2d..0000000 --- a/src/components/iosselect/select.vue +++ /dev/null @@ -1,297 +0,0 @@ - - - - - \ No newline at end of file diff --git a/src/components/iosselect/selectRender.js b/src/components/iosselect/selectRender.js deleted file mode 100644 index 07b4790..0000000 --- a/src/components/iosselect/selectRender.js +++ /dev/null @@ -1,47 +0,0 @@ -/** - * Created by EX-pengzhiliang001 on 2017-06-08. - */ -import Vue from 'vue' -import select from './select' - -export default class SelectRender { - constructor(el, binding) { - this._vm = null - this._el = el - this._options = binding.value - } - - show () { - if (!document.querySelector('[vmui-select]')) { - this.createElement('vmui-select') - } - - let Select = Vue.extend(select) - this._vm = new Select({ - propsData:{ - bindEl: this._el, - selectList: this._options.selectList || [], - onSure: this._options.onSure || () => {}, - connect: this._options.connect || '/', - connectEvents: this._options.connectEvents || null, - autoFill: this._options.autoFill, - initValue: this._options.val, - hideEvent: this.destroy - } - }).$mount('[vmui-select]') - - return this - } - - createElement(attr, tag) { - let $d = document.createElement(tag || 'div') - $d.setAttribute(attr, '') - document.body.appendChild($d); - } - - destroy() { - this._options = null - this._vm = null - this._el = null - } -}