Skip to content

H
hls-easy-ui
Commit be768efe authored by 24776's avatar 24776
Browse files
Options

s

parent 180619c9
Hide whitespace changes
Inline Side-by-side
Showing with 114 additions and 65 deletions
config/index.js
View file @ be768efe
......@@ -23,7 +23,7 @@ module.exports = {
proxyTable: {},
// Various Dev Server settings
host: 'localhost', // can be overwritten by process.env.HOST
host: '192.168.137.1', // can be overwritten by process.env.HOST
port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
autoOpenBrowser: false,
errorOverlay: true,
......
packages/components/HContent/index.vue
View file @ be768efe
......@@ -31,75 +31,83 @@ export default {
topHeight: '0', // content距离顶部的高度
contentsHeight: '0', // 内容区域本来高度
isResize: false, // 默认屏幕高度是否已获取
distance: 0,
final: 0,
fontSize: Number(window.document.documentElement.style.fontSize.replace('px', '')),
winHeight: window.innerHeight,
winWidth: window.innerWidth,
}
},
watch: {
'showHeight': function () {
if (detectOS() !== 'ios') {
if (this.docmHeight >= this.showHeight) {
// 软键盘弹出的事件处理
let activeElement = document.activeElement
let offsetTop = activeElement.offsetTop
let offsetParent = activeElement.offsetParent
let viewTop = offsetParent.clientHeight
this.topHeight = this.$el.offsetTop
if (activeElement === document.body) {
return
}
while (offsetParent !== document.body) {
offsetTop += offsetParent.offsetTop
offsetParent = offsetParent.offsetParent
}
offsetTop = this.docmHeight - offsetTop - viewTop < 0 ? offsetTop - this.topHeight - viewTop : 0
if (offsetTop > 0) {
this.$el.style.transition = 'all .2s cubic-bezier(0.165, 0.84, 0.44, 1) 0s'
this.$el.style.transform = 'translate(0px, -' + offsetTop + 'px) scale(1) translateZ(0px)'
this.$el.style.height = parseInt(this.contentsHeight) + offsetTop + 'px'
}
} else {
// 软键盘收起的事件处理
this.$el.style.height = parseInt(this.contentsHeight) + 'px'
this.$el.style.transform = 'translate(0px, 0px) scale(1) translateZ(0px)'
}
}
},
},
mounted () {
if (this.calContent) {
this.contentHeight()
}
this.contentsHeight = this.$el.style.height.slice(0, this.$el.style.height.length - 2)
this.topHeight = this.$el.offsetTop + 40
if (detectOS() === 'ios') {
document.body.addEventListener('focusin', () => {
// 软键盘弹出的事件处理
let keyboardHeight = this.getKeyBoardHeight()
let activeElement = document.activeElement
let offsetTop = activeElement.offsetTop
let offsetParent = activeElement.offsetParent
if (activeElement === document.body) {
return
}
while (offsetParent !== document.body) {
offsetTop += offsetParent.offsetTop
offsetParent = offsetParent.offsetParent
}
offsetTop = (innerHeight - offsetTop) < keyboardHeight ? (keyboardHeight - (innerHeight - offsetTop)) : 0
if (offsetTop > 0) {
this.$el.style.transition = 'all .2s cubic-bezier(0.165, 0.84, 0.44, 1) 0s'
this.$el.style.transform = 'translate(0px, -' + offsetTop + 'px) scale(1) translateZ(0px)'
this.$el.style.height = parseInt(this.contentsHeight) + offsetTop + 'px'
}
})
document.body.addEventListener('focusout', () => {
// if (detectOS() === 'ios') {
// document.body.addEventListener('focusin', () => {
document.body.addEventListener('touchstart', (e) => {
let keyboardHeight = this.getKeyBoardHeight()
if (e.target.localName === 'input' || e.target.localName === 'textarea') {
let pointY = e.touches[0].pageY
console.log(pointY)
this.distance = (innerHeight - pointY) < keyboardHeight ? (keyboardHeight - (innerHeight - pointY)) : 0
// if (this.distance) {
// this.$el.style.transition = 'all .2s cubic-bezier(0.165, 0.84, 0.44, 1) 0s'
// this.$el.style.transform = 'translate(0px, -' + this.distance + 'px) scale(1) translateZ(0px)'
// // this.$el.style.paddingBottom = (distance + 20) + 'px'
// this.$el.style.height = parseInt(this.contentsHeight) + this.distance + 'px'
}
// }
// 软键盘弹出的事件处理
// })
})
document.body.addEventListener('focusin', () => {
// this.final = this.final + this.distance
console.log('final:' + this.final)
this.$el.style.transition = 'all .2s cubic-bezier(0.165, 0.84, 0.44, 1) 0s'
this.$el.style.transform = 'translate(0px, -' + this.distance + 'px) scale(1) translateZ(0px)'
// this.$el.style.height = parseInt(this.contentsHeight) + this.distance + 'px'
// this.$el.scrollTop = this.final
})
document.body.addEventListener('focusout', () => {
// 软键盘收起的事件处理
this.$el.style.height = parseInt(this.contentsHeight) + 'px'
this.$el.style.transform = 'translate(0px, 0px) scale(1) translateZ(0px)'
})
}
this.$el.style.height = parseInt(this.contentsHeight) + 'px'
this.$el.style.transform = 'translate(0px, 0px) scale(1) translateZ(0px)'
})
// document.body.addEventListener('focusin', () => {
// // 软键盘弹出的事件处理
// let keyboardHeight = this.getKeyBoardHeight()
// let activeElement = document.activeElement
// let offsetTop = activeElement.offsetTop
// let i = 0
// console.log(offsetTop, 11)
// let offsetParent = activeElement.offsetParent
// if (activeElement === document.body) {
// return
// }
// while (offsetParent !== document.body) {
// i++
// offsetTop += offsetParent.offsetTop
// console.log(offsetParent, i)
// console.log(offsetParent.offsetTop, 'offsetParent', i)
// offsetParent = offsetParent.offsetParent
// console.log(offsetTop, i, 'top')
// }
// // console.log(this.$el)
// // console.log(this.$el.offsetTop, 'top')
// // console.log(this.$el.style.height)
// // console.log(innerHeight - offsetTop)
// offsetTop = (innerHeight - offsetTop) < keyboardHeight ? (keyboardHeight - (innerHeight - offsetTop)) : 0
// console.log(offsetTop)
// if (offsetTop > 0) {
// this.$el.style.transition = 'all .2s cubic-bezier(0.165, 0.84, 0.44, 1) 0s'
// this.$el.style.transform = 'translate(0px, -' + offsetTop + 'px) scale(1) translateZ(0px)'
// this.$el.style.height = parseInt(this.contentsHeight) + offsetTop + 'px'
// }
// })
// }
// 当视图窗口大小发生改变时
window.onresize = () => {
......@@ -179,7 +187,7 @@ export default {
}
return 400
} else {
return 275
return 325
}
},
},
......
src/pages/fileTest.vue
View file @ be768efe
......@@ -71,7 +71,7 @@ export default {
* @param index
*/
deletePic (file, index) {
debugger
// debugger
},
/**
* 可选
......
src/pages/hlsPopup.vue
View file @ be768efe
......@@ -239,13 +239,13 @@
<h2 class="item-title">Modal</h2>
<h-button class="button-class" type="primary" @click.native="showModal">Modal</h-button>
</h-content>
<!--
<bottom-tab :show-divider="true">
<tab-button cusClass="button-exit" @click.native="showConfirm"><img
src="../assets/image/warning@2x.png">退出
</tab-button>
<tab-button :disable="true" @click.native="showSuccess">登陆</tab-button>
</bottom-tab>
</bottom-tab> -->
<!-- <number-keyboard
:show="true"
title="数字键盘"
......
src/pages/home.vue
View file @ be768efe
......@@ -10,11 +10,52 @@
<tab-item>Vue</tab-item>
<tab-item>APP</tab-item>
</s-tab>
<s-tab>
<tab-item>Vue</tab-item>
<tab-item>APP</tab-item>
</s-tab>
<div style="backgroundColor:red;height:50px"/>
<h-content >
<list-item>
<item>
<section slot="name">姓名</section>
<input slot="content" type="text">
</item>
<item>
<section slot="name">年龄</section>
<input slot="content" type="text">
</item>
<item>
<section slot="name">性别</section>
<input slot="content" type="text">
</item>
<item>
<section slot="name">出生日前</section>
<input slot="content" type="text">
</item>
<item>
<section slot="name">体重</section>
<section slot="content">111111</section>
</item>
<item>
<section slot="name">身高</section>
<section slot="content">111111</section>
</item>
<item>
<section slot="name">血型</section>
<section slot="content">111111</section>
</item>
<item>
<section slot="name">胸围</section>
<input slot="content" type="text">
</item>
<item>
<section slot="name">腰围</section>
<input slot="content" type="text">
</item>
<item>
<section slot="name">tun</section>
<input slot="content" type="text">
</item>
</list-item>
<list-item>
<item>
<section slot="name">姓名</section>
......
www.zip
View file @ be768efe
No preview for this file type
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment