组建优化

packages/common/scripts/filter.js

@@ -2,11 +2,12 @@ export default (Vue) => {
   Vue.filter('currency', function (val) {
     if (!val) return '0.00'
 
-    var intPart = parseInt(Number(val)) // 获取整数部分
+    // var intPart = parseInt(Number(val)) // 获取整数部分
+    var value2Array = (val + '').split('.')
+    var intPart = value2Array.length === 2 ? value2Array[0] : val
     var intPartFormat = intPart.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') // 将整数部分逢三一断
 
     var floatPart = '.00' // 预定义小数部分
-    var value2Array = (val + '').split('.')
 
     // =2表示数据有小数位
     if (value2Array.length === 2) {

packages/common/styles/hField.less

@@ -6,6 +6,7 @@
   background-color: #fff;
   position: relative;
   line-height: 24px;
+  min-height: 45px;
 
   &:after {
     .setBottomLine();

packages/components/CurrencyInput/index.vue

@@ -71,9 +71,9 @@ export default {
       if (currencyInput && value !== currencyInput.value) {
         currencyInput.value = value
       }
-      let uncurrency = this.$options.filter['uncurrency']
-      this.currencyValue = uncurrency(value)
-      this.$emit('input', this.currencyValue)
+      // let uncurrency = this.$options.filter['uncurrency']
+      // this.currencyValue = uncurrency(value)
+      this.$emit('input', value)
     },
     onFocus (event) {
       if (this.readonly || this.disabled) {

packages/components/DateField/index.vue

@@ -86,7 +86,7 @@ export default {
     },
     itemHeight: {
       type: Number,
-      default: 45,
+      default: null,
     },
     showIcon: {
       type: Boolean,

packages/components/Field/index.vue

@@ -15,7 +15,7 @@
     <div :style="{'flex':proportion[1] }" class="field-value">
       <div :class="{'field-control-error':hasError}" class="field-body">
         <input
-          v-if="type!=='number' && type!=='textarea'"
+          v-if="type!=='number' && type!=='textarea' && type!=='txt'"
           ref="fieldInput"
           v-bind="$attrs"
           :readonly="readonly" :disabled="disabled" :placeholder="placehold" :value="value"
@@ -39,14 +39,14 @@
           @input="onInput($event.target.value)"
           @focus="onFocus"
           @blur="onBlur"/>
+        <div v-if="type==='txt'" class="field-control">{{ value }}</div>
         <i v-if="showCancel" class="field-icon field-right-icon icon ion-close-circled" @touchstart="cleanValue"/>
         <div v-if="showRightIcon" class="field-icon field-right-icon" @click="onClickRightIcon">
           <img v-if="!hasRightIcon" :src="rightIcon">
           <slot name="right-icon"/>
         </div>
       </div>
-      <div v-if="wordLimit && maxlength" class="field-word-limit"><span class="field-word-num">{{ count }}</span>/{{
-      maxlength }}
+      <div v-if="wordLimit && maxlength" class="field-word-limit"><span class="field-word-num">{{ count }}</span>/{{ maxlength }}
       </div>
     </div>
   </div>
@@ -90,7 +90,7 @@ export default {
     },
     itemHeight: {
       type: Number,
-      default: 45,
+      default: null,
     },
     label: {
       type: String,
@@ -273,8 +273,8 @@ export default {
       if (required && error) {
         this.hasError = !isDef(fieldInput.value)
         /* if (isString(error)) {
-          this.placehold = error
-        } */
+            this.placehold = error
+          } */
       }
     },
 

packages/components/HContent/index.vue

@@ -10,7 +10,6 @@
 </template>
 
 <script>
-import { detectOS } from '../../common/utils/index'
 export default {
   name: 'HContent',
   props: {
@@ -21,14 +20,17 @@ export default {
   },
   data () {
     return {
-      // fontSize: Number(window.document.documentElement.style.fontSize.replace('px', '')),
-      winHeight: window.innerHeight,
-      winWidth: window.innerWidth,
+      orientation: 'portrait',
     }
   },
   mounted () {
     if (this.calContent) {
-      this.contentHeight()
+      this.resizeHeight()
+    }
+  },
+  update () {
+    if (this.calContent) {
+      this.resizeHeight()
     }
   },
   methods: {
@@ -43,14 +45,13 @@ export default {
           if (elHeight && part.test(elHeight)) {
             headerHeight += Number(elHeight.replace('px', ''))
           }
-          if ($el._prevClass && $el._prevClass.indexOf('h-header') === 0) {
-            if (detectOS() === 'ios' && vm.winWidth === 375 && vm.winHeight === 812) {
-              headerHeight += 40
-            } else if (detectOS() === 'ios' && vm.winWidth === 414 && vm.winHeight === 896) {
-              headerHeight += 40
-            } else if (detectOS() === 'ios') {
-              headerHeight += 20
-            }
+          let paddingTopHeight = window.getComputedStyle($el).paddingTop
+          let paddingBottomHeight = window.getComputedStyle($el).paddingBottom
+          if (paddingTopHeight && part.test(paddingTopHeight)) {
+            headerHeight += Number(paddingTopHeight.replace('px', ''))
+          }
+          if (paddingBottomHeight && part.test(paddingBottomHeight)) {
+            headerHeight += Number(paddingBottomHeight.replace('px', ''))
           }
           $el = $el.previousElementSibling
         }
@@ -60,25 +61,24 @@ export default {
     },
     getNextElementHeight () {
       let vm = this
-      let nextElement = this.$el.nextElementSibling
+      let nextElement = vm.$el.nextElementSibling
       let nextHeight = 0
       do {
         if (nextElement) {
-          let elHeight = window.getComputedStyle(nextElement).height
-          let part = /^\d+(\.\d+)?px$/
-          if (elHeight && part.test(elHeight)) {
-            nextHeight += Number(elHeight.replace('px', ''))
-          }
-          if (nextElement._prevClass && nextElement._prevClass.indexOf('h-bottom-tab') === 0) {
-            let height = nextElement.clientHeight
-            if (detectOS() === 'ios' && height > Math.ceil(vm.fontSize * 0.88)) {
-              nextHeight += 0
-            } else {
-              if (detectOS() === 'ios' && vm.winWidth === 375 && vm.winHeight === 812) {
-                nextHeight += 34
-              } else if (detectOS() === 'ios' && vm.winWidth === 414 && vm.winHeight === 896) {
-                nextHeight += 34
-              }
+          let position = window.getComputedStyle(nextElement).position
+          if (position === 'fixed') {
+            let elHeight = window.getComputedStyle(nextElement).height
+            let part = /^\d+(\.\d+)?px$/
+            if (elHeight && part.test(elHeight)) {
+              nextHeight += Number(elHeight.replace('px', ''))
+            }
+            let paddingTopHeight = window.getComputedStyle(nextElement).paddingTop
+            let paddingBottomHeight = window.getComputedStyle(nextElement).paddingBottom
+            if (paddingTopHeight && part.test(paddingTopHeight)) {
+              nextHeight += Number(paddingTopHeight.replace('px', ''))
+            }
+            if (paddingBottomHeight && part.test(paddingBottomHeight)) {
+              nextHeight += Number(paddingBottomHeight.replace('px', ''))
             }
           }
           nextElement = nextElement.nextElementSibling
@@ -86,12 +86,22 @@ export default {
       } while (nextElement)
       return nextHeight
     },
-    contentHeight () {
+    resizeHeight () {
       let vm = this
-      const headerHeight = vm.getHeaderHeight()
-      const nextHeight = vm.getNextElementHeight()
-      let content = vm.$el
-      content.style.height = (window.innerHeight - nextHeight - headerHeight) + 'px'
+      this.$nextTick(() => {
+        const headerHeight = vm.getHeaderHeight()
+        const nextHeight = vm.getNextElementHeight()
+        let windowHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight
+        let windowWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth
+
+        if (windowWidth > windowHeight) {
+          this.orientation = 'landscape'
+        } else {
+          this.orientation = 'portrait'
+        }
+        let content = vm.$el
+        content.style.height = windowHeight - headerHeight + nextHeight + 'px'
+      })
     },
   },
 }

packages/components/Scroll/index.vue

@@ -247,14 +247,13 @@ export default {
           if (elHeight && part.test(elHeight)) {
             headerHeight += Number(elHeight.replace('px', ''))
           }
-          if ($el._prevClass && $el._prevClass.indexOf('h-header') === 0) {
-            if (detectOS() === 'ios' && vm.winWidth === 375 && vm.winHeight === 812) {
-              headerHeight += 40
-            } else if (detectOS() === 'ios' && vm.winWidth === 414 && vm.winHeight === 896) {
-              headerHeight += 40
-            } else if (detectOS() === 'ios') {
-              headerHeight += 20
-            }
+          let paddingTopHeight = window.getComputedStyle($el).paddingTop
+          let paddingBottomHeight = window.getComputedStyle($el).paddingBottom
+          if (paddingTopHeight && part.test(paddingTopHeight)) {
+            headerHeight += Number(paddingTopHeight.replace('px', ''))
+          }
+          if (paddingBottomHeight && part.test(paddingBottomHeight)) {
+            headerHeight += Number(paddingBottomHeight.replace('px', ''))
           }
           $el = $el.previousElementSibling
         }
@@ -264,25 +263,24 @@ export default {
     },
     getNextElementHeight () {
       let vm = this
-      let nextElement = this.$el.nextElementSibling
+      let nextElement = vm.$el.nextElementSibling
       let nextHeight = 0
       do {
         if (nextElement) {
-          let elHeight = window.getComputedStyle(nextElement).height
-          let part = /^\d+(\.\d+)?px$/
-          if (elHeight && part.test(elHeight)) {
-            nextHeight += Number(elHeight.replace('px', ''))
-          }
-          if (nextElement._prevClass && nextElement._prevClass.indexOf('h-bottom-tab') === 0) {
-            let height = nextElement.clientHeight
-            if (detectOS() === 'ios' && height > Math.ceil(vm.fontSize * 0.88)) {
-              nextHeight += 0
-            } else {
-              if (detectOS() === 'ios' && vm.winWidth === 375 && vm.winHeight === 812) {
-                nextHeight += 34
-              } else if (detectOS() === 'ios' && vm.winWidth === 414 && vm.winHeight === 896) {
-                nextHeight += 34
-              }
+          let position = window.getComputedStyle(nextElement).position
+          if (position === 'fixed') {
+            let elHeight = window.getComputedStyle(nextElement).height
+            let part = /^\d+(\.\d+)?px$/
+            if (elHeight && part.test(elHeight)) {
+              nextHeight += Number(elHeight.replace('px', ''))
+            }
+            let paddingTopHeight = window.getComputedStyle(nextElement).paddingTop
+            let paddingBottomHeight = window.getComputedStyle(nextElement).paddingBottom
+            if (paddingTopHeight && part.test(paddingTopHeight)) {
+              nextHeight += Number(paddingTopHeight.replace('px', ''))
+            }
+            if (paddingBottomHeight && part.test(paddingBottomHeight)) {
+              nextHeight += Number(paddingBottomHeight.replace('px', ''))
             }
           }
           nextElement = nextElement.nextElementSibling
@@ -475,7 +473,7 @@ export default {
     width 100%
     overflow hidden !important
     box-sizing border-box
-    position absolute !important
+    position absolute
     top 0
     height 100%
 

packages/components/Select/SelectField.vue

@@ -93,7 +93,7 @@ export default {
     },
     itemHeight: {
       type: Number,
-      default: 45,
+      default: null,
     },
     inputAlign: {
       type: String,

src/pages/Field/demo.vue

@@ -92,6 +92,7 @@
         <i slot="left-icon" class="field-icon field-left-icon icon ion-android-favorite"/>
         <i slot="right-icon" class="field-icon field-right-icon icon ion-android-arrow-forward"/>
       </h-field>
+      <h-field v-model="homeAddress" type="txt" label="家庭地址"/>
     </h-content>
   </h-view>
 </template>

src/pages/hlsPopup.vue

@@ -259,7 +259,7 @@
               @input="onInput"
               @delete="onDelete"/>-->
 
-    <h-modal ref="modal" v-model="showModalValue" position="bottom" class="sign-modal">
+    <h-modal ref="modal" v-model="showModalValue" position="top" class="sign-modal">
       <h-view>
         <h-header style="height: 43px !important;padding-top:0px">
           <template #left>