Merge branch 'v2-dev' of https://github.com/jdf2e/nutui into v2-dev

.gitignore

@@ -21,3 +21,4 @@ lib/plugin/cli/dist_cli/
 lib/plugin/cli/site/doc/view/
 lib/plugin/cli/site/doc/page/
 yarn.lock
+/test_script

.huskyrc

@@ -1,5 +0,0 @@
-{
-  "hooks": {
-    "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
-  }
-}

README-zh_CN.md

@@ -61,9 +61,9 @@ https://nutui.jd.com
 
 NutUI 已经投入了我们的生产环境中使用，业界也在广泛地使用。
 
-<img src="https://raw.githubusercontent.com/richard1015/nutui-user-cases/master/user-cases.jpg" />
+<img src="https://raw.githubusercontent.com/jdf2e/nutui-user-cases/master/user-cases.jpg" />
 
-[征集更多优秀案例](https://github.com/richard1015/nutui-user-cases)
+[征集更多优秀案例](https://github.com/jdf2e/nutui-user-cases)
 
 ## 开源协议
 

README.md

@@ -61,9 +61,9 @@ Documents：[2.X](https://nutui.jd.com/default.html#/start) | [1.X](https://nutu
 
 NutUI has been put into use in our production environment and is widely used in developing countries at the same time.
 
-<img src="https://raw.githubusercontent.com/richard1015/nutui-user-cases/master/user-cases.jpg" />
+<img src="https://raw.githubusercontent.com/jdf2e/nutui-user-cases/master/user-cases.jpg" />
 
-[Call for more excellent cases](https://github.com/richard1015/nutui-user-cases)
+[Call for more excellent cases](https://github.com/jdf2e/nutui-user-cases)
 
 ## Open Source LICENSE
 

package.json

@@ -17,28 +17,20 @@
     "build:site": "nutui-cli build-site",
     "clean": "nutui-cli clean",
     "add": "nutui-cli add",
-    "lint": "nutui-cli lint",
     "test": "cross-env NODE_ENV=test nyc mocha-webpack --webpack-config node_modules/@nutui/cli/dist_cli/webpack/test.config.js  --require node_modules/@nutui/cli/dist_cli/test/setup.js src/packages/*/__test__/**.spec.js",
     "coveralls": "cat ./coverage/lcov.info | coveralls",
     "test:watch": "npm run test --watch",
-    "prettier:check": "prettier -l src/**/*.{ts,js,vue,scss}",
     "prettier:fix": "prettier --write src/**/*.{ts,js,vue,scss}"
   },
+  "husky": {
+    "hooks": {
+      "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
+    }
+  },
   "repository": {
     "type": "git",
     "url": "https://github.com/jdf2e/nutui.git"
   },
-  "eslintConfig": {
-    "root": true,
-    "extends": [
-      "./eslint-config.js"
-    ]
-  },
-  "stylelint": {
-    "extends": [
-      "./stylelint-config.js"
-    ]
-  },
   "keywords": [
     "nutui",
     "nutui2",
@@ -56,8 +48,7 @@
     "@babel/plugin-transform-runtime": "^7.9.6",
     "@commitlint/cli": "^8.0.0",
     "@commitlint/config-conventional": "^8.0.0",
-    "@nutui/cli": "^0.1.9",
-    "@vue/composition-api": "^0.5.0",
+    "@nutui/cli": "^0.2.1",
     "babel-plugin-istanbul": "^6.0.0",
     "gsap": "^3.2.6",
     "husky": "^3.0.0",
@@ -88,4 +79,4 @@
     "instrument": false,
     "sourceMap": false
   }
-}
+}

src/packages/leftslip/demo.vue

@@ -58,6 +58,14 @@
         >
       </nut-leftslip>
     </div>
+    <p>禁止滑动</p>
+    <div>
+      <button class="btn" @click="disabledHandle">{{isDisable ? '开启滑动' : '禁止滑动'}}</button>
+      <nut-leftslip :disabled="isDisable">
+        <div slot="slip-main" class="slip-main">左滑触发删除</div>
+        <div slot="slipbtns" class="slipbtns"><a href="javascript:;">删除</a></div>
+      </nut-leftslip>
+    </div>
   </div>
 </template>
 
@@ -77,7 +85,8 @@ export default {
         { id: 'add8', addr: '北京市大兴区亦庄经济开发中心京东大厦B座8', tel: '159****8888' }
       ],
       rightWidth: 80,
-      pageWidth: null
+      pageWidth: null,
+      isDisable: false
     };
   },
   methods: {
@@ -90,6 +99,9 @@ export default {
     },
     oneDel(par) {
       par.remove();
+    },
+    disabledHandle(){
+      this.isDisable = !this.isDisable 
     }
   },
   mounted() {
@@ -164,4 +176,13 @@ export default {
     }
   }
 }
+.btn{
+  margin: 10px 0;
+  background: #fff;
+  border: 1px solid #ff5722;
+  color: #ff5722;
+  outline: none;
+  border-radius: 4px;
+  padding: 5px;
+}
 </style>

src/packages/leftslip/doc.md

@@ -116,6 +116,25 @@ export default {
 };
 ```
 
+###  禁止滑动
+```html
+<div>
+    <button class="btn" @click="disabledHandle">{{isDisable ? '开启滑动' : '禁止滑动'}}</button>
+    <nut-leftslip :disabled="isDisable">
+        <div slot="slip-main" class="slip-main">左滑触发删除</div>
+        <div slot="slipbtns" class="slipbtns"><a href="javascript:;">删除</a></div>
+    </nut-leftslip>
+</div>
+```
+
+```javascript
+    disabledHandle(){
+        this.isDisable = !this.isDisable 
+    }
+
+```
+
+
 ## slot
 
 | 字段           | 说明                 | 类型    | 默认值 |
@@ -128,5 +147,6 @@ export default {
 | 字段 | 说明 | 类型 | 默认值
 |----- | ----- | ----- | ----- 
 | rightWidth | 右侧按钮区域超出一行时的默认宽度，默认占整个宽度的80% | Number | 0.8
+|  disabled  | 禁止滑动操作 | Boolean | false
 
 

src/packages/leftslip/leftslip.vue

@@ -24,6 +24,10 @@ export default {
     rightWidth: {
       type: [Number, String],
       default: '0.8'
+    },
+    disabled:{
+      type: Boolean,
+      default: false
     }
   },
   data() {
@@ -87,6 +91,7 @@ export default {
       });
     },
     touchStart(e) {
+      if(this.disabled) return false
       let parentElement = e.currentTarget.parentElement;
       let slip = [];
       slip = document.getElementsByClassName('leftslip-open');
@@ -104,13 +109,13 @@ export default {
     },
 
     touchMove(e) {
+      if(this.disabled) return false
       let parentElement = e.currentTarget.parentElement;
 
       let disX = e.touches[0].pageX - this.startX; // >0 右滑，<0 左滑
       let disY = e.touches[0].pageY - this.startY;
-
       if (e.touches.length == 1) {
-        if (Math.abs(disY) < 15) {
+        if (Math.abs(disY) < 5) {
           // console.log(disX, disY)
           if (disX > 0 || (disX > 0 && this.startLeft >= 0)) {
             //禁止右滑
@@ -122,6 +127,7 @@ export default {
       }
     },
     touchEnd(e) {
+      if(this.disabled) return false
       let parentElement = e.currentTarget.parentElement;
       const disX = e.changedTouches[0].pageX - this.startX; // >0 右滑，<0 左滑
       let distance;

src/packages/searchbar/searchbar.scss

@@ -8,6 +8,7 @@
     margin-right: 10px;
     background-color: $light-color;
     border-radius: 20px;
+    overflow: hidden;
     form {
       display: flex;
       align-items: center;

src/packages/switch/demo.vue

@@ -56,6 +56,15 @@
         <span slot="title"><nut-switch :active="true" class="my-switch"></nut-switch></span>
       </nut-cell>
     </div>
+        <h4>内嵌文字标签</h4>
+    <div>
+      <nut-cell>
+        <span slot="title"><nut-switch :active="true" label="ON|OFF"></nut-switch></span>
+      </nut-cell>
+           <nut-cell>
+        <span slot="title"><nut-switch :active="false" label="通过|拒绝"></nut-switch></span>
+      </nut-cell>
+    </div>
   </div>
 </template>
 

src/packages/switch/doc.md

@@ -80,7 +80,14 @@ export default {
 >
 </nut-switch>
 ```
-
+## 内嵌文字
+```html
+<nut-switch 
+  :active="true"  
+  :label="开|关"
+>
+</nut-switch>
+```
 
 ## Prop
 
@@ -88,4 +95,5 @@ export default {
 |----- | ----- | ----- | -----
 | active | 开关状态 | Boolean | false
 | size | 尺寸，可选值small/base/large | String | base
-| disabled | 是否禁用 | Boolean | false
+| disabled | 是否禁用 | Boolean | false
+| label | 内嵌文字标签，竖线分开，如ON\|OFF 或 开\|关 | String  | 

src/packages/switch/switch.scss

@@ -1,12 +1,25 @@
 .nut-switch {
   position: relative;
-  display: inline-block;
+  width: auto;
+  display: inline-block !important;
   background: #fff;
   border-radius: 1000px;
   vertical-align: bottom;
   box-sizing: content-box;
   border: 2px $border-style-base $border-color-base;
   transition: all $transition-duration $animation-timing-fun;
+  .nut-switch-label {
+    position:relative;
+    width:auto;
+    left:0;
+    margin-left:22px;
+    display: inline-block !important;
+    padding:0 2px 0 2px  !important;
+    text-align:center !important;
+    color:#999 !important;
+    font-style:normal !important;
+    font-size:12px;
+  }
   .nut-switch-btn {
     position: absolute;
     left: 0;
@@ -15,9 +28,16 @@
     border-radius: 50%;
     box-sizing: border-box;
     transition: all $transition-duration $animation-timing-fun;
+
   }
   &.nut-switch-active {
     border-color: $border-color-active;
+   .nut-switch-label {
+    left:0;
+    margin-left:0px;
+    color:red !important;
+    margin-right:22px;
+   }
     .nut-switch-btn {
       background-color: $primary-color;
     }
@@ -29,42 +49,51 @@
 
 .nut-switch-small {
   height: 14px;
-  width: 32px;
+  min-width: 36px;
+  .nut-switch-label {
+    font-size: 10px;
+    top:-4px;
+    margin-left:-25px;
+  }
   .nut-switch-btn {
     height: 14px;
     width: 14px;
   }
   &.nut-switch-active {
     .nut-switch-btn {
-      left: 18px;
+      left: 100%;
+      margin-left:-15px;
     }
   }
 }
 
 .nut-switch-base {
   height: 20px;
-  width: 46px;
+  min-width: 46px;
   .nut-switch-btn {
     height: 20px;
-    width: 20px;
+    width: 22px;
   }
   &.nut-switch-active {
     .nut-switch-btn {
-      left: 26px;
+      left: 100%;
+      margin-left:-21px;
     }
   }
 }
 
 .nut-switch-large {
   height: 28px;
-  width: 58px;
+  min-width: 58px;
+  font-size: 14px;
   .nut-switch-btn {
     height: 28px;
-    width: 28px;
+    min-width: 28px;
   }
   &.nut-switch-active {
     .nut-switch-btn {
-      left: 30px;
+      left: 100%;
+      margin-left:-28px;
     }
   }
 }

src/packages/switch/switch.vue

@@ -1,6 +1,9 @@
 <template>
   <div class="nut-switch" :class="[{ 'nut-switch-active': isActive }, 'nut-switch-' + size, { 'nut-switch-disabled': disabled }]" @click="toggle">
-    <div class="nut-switch-btn"></div>
+    <div class="nut-switch-btn">
+    </div>
+      <div class="nut-switch-label" v-if="isActive">{{arrLabel[0]}}</div>
+      <div class="nut-switch-label" v-else>{{arrLabel[1]}}</div>
   </div>
 </template>
 <script>
@@ -18,11 +21,16 @@ export default {
     disabled: {
       type: Boolean,
       default: false
+    },
+    label:{
+      type: String,
+      default: ""
     }
   },
   data() {
     return {
-      isActive: false
+      isActive: false,
+      arrLabel : ( this.label||'').split('|')
     };
   },
   created() {

src/packages/tabbar/tabbar.vue

@@ -3,7 +3,7 @@
     <a
       class="tabbar-nav"
       v-for="(value, index) in tabList"
-      :class="[{ curr: index == currIndex }, type]"
+      :class="[{ 'curr': index == currIndex }, type]"
       :key="value.tabTitle"
       v-on:click="switchTabs(value, index)"
       :href="value.href"
@@ -44,15 +44,26 @@ export default {
       tabList: this.tabbarList
     };
   },
+  mounted(){
+    this.initBar();
+  },
   watch: {
     tabbarList: {
       handler(value) {
         this.tabList = value;
+        this.initBar();
       },
       deep: true
     }
   },
   methods: {
+    initBar(){
+      this.tabList.forEach((item,index)=>{
+        if(item.curr){
+            this.currIndex = index;
+        }
+      })
+    },
     switchTabs: function(value, index) {
       this.currIndex = index;
       this.$emit('tab-switch', value, index);

src/packages/video/demo.vue

@@ -119,7 +119,7 @@ export default {
 
 <style lang="scss" scoped>
 .nut-video {
-  height: 200px;
+  /* height: 200px; */
 }
 
 button {

src/packages/video/video.vue

@@ -7,7 +7,8 @@
       :autoplay="options.autoplay"
       :loop="options.loop"
       :poster="options.poster"
-      :controls="options.controls"
+	    :controls="options.controls"
+	    :preload="options.preload"
       @error="handleError"
     >
       <source v-for="source in sources" :src="source.src" :type="source.type" :key="source.src" />
@@ -66,7 +67,8 @@ export default {
           muted: false, //是否静音
           disabled: false, //禁止操作
           playsinline: false, //行内展示
-          touchPlay: false
+          touchPlay: false,
+		      preload:''
         };
       },
       required: true
@@ -136,7 +138,7 @@ export default {
         this.state.isMuted = val.muted ? val.muted : false;
       },
       immediate: true
-    }
+    },
     // model: {
     //     handler(val) {
     //         if (val) {
@@ -160,7 +162,7 @@ export default {
     init() {
       this.videoElm = this.$el.getElementsByTagName('video')[0];
       if (this.options.autoplay) {
-        this.play();
+        this.videoElm.play();
       }
 
       if (this.options.touchPlay) {
@@ -197,7 +199,7 @@ export default {
       // 播放器位置
       this.player.$player = $player;
       this.progressBar.progressElm = $progress;
-      this.player.pos = $player.getBoundingClientRect();
+      // this.player.pos = $player.getBoundingClientRect();
       this.progressBar.pos = $progress.getBoundingClientRect();
       this.videoSet.progress.width = Math.round($progress.getBoundingClientRect().width);
     },