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

browserslist

@@ -0,0 +1,3 @@
+> 1%
+Android >= 4
+iOS >= 8

config.json

@@ -245,6 +245,7 @@
       "name": "Handle",
       "chnName": "工具函数",
       "type": "filter",
+      "showDemo":false,
       "desc": "工具函数。"
     },
     {

postcss.config.js

@@ -1,7 +1,5 @@
 module.exports = {
     plugins: [
-        require('autoprefixer')({
-                            browsers: ['last 2 versions', 'Android >= 4.0','iOS >= 8.0','last 5 QQAndroid versions','last 5 UCAndroid versions']
-                        })
+        require('autoprefixer')()
     ]
 }

scripts/addComponent.js

@@ -14,7 +14,7 @@ let rl = readline.createInterface({
 
 function init() {
     inquirer.prompt([
-        {
+        { 
             type: 'input',
             name: 'name',
             message: '组件英文名(每个单词的首字母都大写，如TextBox)：',
@@ -134,7 +134,7 @@ function createView() {
         const fileName = 'viewTpl.vue';
 
         const sourceFile = path.join(__dirname, './' + fileName);
-        const destPath = path.join(__dirname, '../src/demo/', nameLc + '.vue');
+        const destPath = path.join(__dirname, '../src/view/', nameLc + '.vue');
 
         const readStream = fs.createReadStream(sourceFile);
         const writeStream = fs.createWriteStream(destPath);
@@ -149,7 +149,7 @@ function createDemo() {
         const fileName = 'demoTpl.vue';
 
         const sourceFile = path.join(__dirname, './' + fileName);
-        const destPath = path.join(__dirname, '../src/view/', nameLc + '.vue');
+        const destPath = path.join(__dirname, '../src/demo/', nameLc + '.vue');
 
         const readStream = fs.createReadStream(sourceFile);
         const writeStream = fs.createWriteStream(destPath);

src/demo.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="demo-wrapper">
     <router-view class="demo-nav" name="demonav"></router-view>
-    <keep-alive include="index">
+    <keep-alive include="index" exclude="luckycard,lazyload">
       <router-view class="demo" name="main" v-transition></router-view>
     </keep-alive>
   </div>
@@ -22,11 +22,11 @@ body{
 }
 .demo-wrapper{
   background-color:#F8F8F8;
+  min-height:100vh;
 }
 .demo{
   padding: 8px;
   padding-top: 40px;
-  min-height:100vh;
   box-sizing:border-box;
 }
 .button-primary {

src/demo/lazyload.vue

@@ -3,8 +3,6 @@
         <nut-demoheader 
         :name="$route.name"
         ></nut-demoheader>
-        <!-- DEMO区域 -->
-        <!-- <nut-switch :height="30" :width="60" @switch-on="switchOn" @switch-off="switchOff"></nut-switch> -->
         
         <!-- DEMO代码 -->
         <div 
@@ -29,6 +27,7 @@ import Vue from 'vue';
 import lazyload from '../package/lazyload/index.js';
 
 export default {
+    name:'lazyload',
     data(){
         return{
         }

src/demo/luckycard.vue

@@ -16,6 +16,7 @@
 
 <script>
 export default {
+  name:'luckycard',
   data() {
     return {
         coverImage:'../asset/img/luckycard-demo.png'

src/demo/qrcode.vue

@@ -53,7 +53,6 @@
             </table>
         </div>
     </div>
-    </div>
 </template>
 
 <script>

src/demo/select.vue

@@ -44,15 +44,27 @@ export default {
         return{
           demo1: {
             data: [
-              {"n": "北京", "s": [{"n": "海淀区"},{"n": "通州区"}]},
-              {"n": "上海", "s": [{"n": "浦东新区"},{"n": "其他区"}]},
-              {"n": "河北省", "s": [{"n": "石家庄市", "s": [{"n": "城东区"},{"n": "城西区"}]},{"n":"秦皇岛市"}]},
-              {"n": "上海", "s": [{"n": "浦东新区"},{"n": "其他区"}]},
-              {"n": "上海", "s": [{"n": "浦东新区"},{"n": "其他区"}]},
-              {"n": "上海", "s": [{"n": "浦东新区"},{"n": "其他区"}]},
-              {"n": "上海", "s": [{"n": "浦东新区"},{"n": "其他区"}]},
-              {"n": "上海", "s": [{"n": "浦东新区"},{"n": "其他区"}]},
-              {"n": "上海", "s": [{"n": "浦东新区"},{"n": "其他区"}]}
+              {
+                "n": "北京", 
+                "s": [
+                  {"n": "海淀区","s": [{"n": "城东区"},{"n": "城西区"}]},
+                  {"n": "通州区","s": [{"n": "通州东区"},{"n": "通州西区"}]}
+                ]
+              },                
+              {
+                "n": "上海", 
+                "s": [
+                  {"n": "浦东新区", "s": [{"n": "浦东东区"},{"n": "浦东西区"}]},
+                  {"n": "陆家嘴区","s": [{"n": "陆家嘴东区"},{"n": "陆家嘴西区"}]}
+                ]
+              },
+              {
+                "n": "河北省", 
+                "s": [
+                  {"n": "石家庄市", "s": [{"n": "城东区"},{"n": "城西区"}]},
+                  {"n":"秦皇岛市", "s": [{"n": "海港区"},{"n": "山海关区"}]}
+                ]
+              }
             ],
             selected: '河北省-石家庄市-城东区',
             txt: `<nut-select class="demo1-select" 

src/demo/swiper.vue

@@ -11,7 +11,7 @@
             direction="horizontal"
              ref="demo1"
              @slideChangeEnd="slideChangeEnd">
-            <div v-for="item in dataItem" class="nut-swiper-silde"><span>page{{item.name}}</span></div>
+            <div v-for="item in dataItem" class="nut-swiper-silde" :key="item.name"><span>page{{item.name}}</span></div>
 
         </nut-swiper>
 

src/demo/textbox.vue

@@ -35,7 +35,8 @@
         <p>不显示字数限制</p>
         <nut-textbox :limitShow="false" :maxNum="10" ></nut-textbox>
        
-        
+        <h6>输入回调返回文字</h6>
+        <nut-textbox  :maxNum="10" txtAreaH="2" @inputFunc="inputText" ></nut-textbox>
     </div>
 </template>
 
@@ -71,6 +72,9 @@ textBgColor="#feefef">
     methods:{
         overLength(){
             alert('字数超出');
+        },
+        inputText(val){
+           alert(val);
         }
     }
 }

src/package/datepicker/src/datepicker.vue

@@ -31,7 +31,7 @@
 					</div>
 				</div>
 				<div class="nut-datepicker-week">
-					<span v-for="week of weekArr">{{week}}</span>
+					<span v-for="week of weekArr" key="week">{{week}}</span>
 				</div>
 				<div class="nut-datepicker-days" :style="{'width': width}">
 					<div class="nut-datepicker-panel"

src/package/elevator/src/elevator.vue

@@ -4,13 +4,14 @@
             id="nut-elevator-ul"
             >
             <li 
-            v-for="(item,index) in dataArray" 
-            key="item.title"
+            v-for="item in dataArray" 
+            v-bind:key="item.title"
             class="nut-list-title" 
             >
                 <h3 class="nut-list-h" :id="item.title">{{item.title}}</h3>
                 <ul class="nut-people-list">
                     <li v-for="(list,idx) in item.list" 
+                    v-bind:key="idx"
                     class="nut-list-name" 
                     :id="list.id?list.id:'list'+item.title+idx"
                     @click="clickList(list,item)"
@@ -23,7 +24,8 @@
             @touchstart="onPointerMove($event)"
             @touchend="onPointerEnd($event)"
             >
-            <li v-for="(item,index) in dataArray" 
+            <li v-for="(item,index) in dataArray"
+            v-bind:key="index" 
             :id="'nav'+index"
             class="nut-nav-list" 
             :style="{height:navListHeight+'rem'}"

src/package/rate/src/rate.vue

@@ -4,6 +4,7 @@
             <template v-for="(value,index) in num">
                 <li 
                     @click="touchEvn(index)"
+                    v-bind:key="index"
                     :style="{backgroundImage: 'url('+(index<isActive?activeUrl:originalUrl)+')',height:picHeight+'rem',width:picWidth+'rem'}"
                     class='nut-list'>
                 </li>

src/package/select/src/dateSwiper.vue

@@ -106,7 +106,7 @@
             font-size: 0.28rem!important;
             width: 100%;
             height: 2.5rem!important;
-            padding-top: 1.4rem!important;
+            padding-top: 1.40rem!important;
         }
         .nut-swiper-silde-selected {
             color: #333!important;
@@ -133,7 +133,7 @@
     }
     .selected-bg {
         position: absolute;
-        margin-top: 1.4rem;
+        margin-top: 1.39rem;
         height: 0.7rem;
         width: 100%;
         border-top: 0.01rem solid #f0f0f0;

src/package/signature/src/signature.vue

@@ -14,7 +14,7 @@ export default {
     name:'nut-signature',
     props: {
 	    lineWidth:  {
-            type: String,
+            type: Number,
             default: 2
         },
 	    strokeStyle:   {
@@ -64,7 +64,7 @@ export default {
 	        _this.moveEventHandler=  _this.moveEventHandler.bind(_this),
 	        _this.endEventHandler= _this.endEventHandler.bind(_this)
 	        _this.$refs.canvas.addEventListener(_this.events[1], _this.moveEventHandler, false);
-	        document.addEventListener(_this.events[2], _this.endEventHandler, false);
+	        _this.$refs.canvas.addEventListener(_this.events[2], _this.endEventHandler, false);
 
 	    },
 
@@ -89,7 +89,7 @@ export default {
 
 	        let _this = this;
 	        _this.$refs.canvas.removeEventListener(_this.events[1], _this.moveEventHandler, false);
-	        document.removeEventListener(_this.events[2], _this.endEventHandler, false);
+	        _this.$refs.canvas.removeEventListener(_this.events[2], _this.endEventHandler, false);
 	    },
 
 	    clear() {

src/package/steps/src/steps.vue

@@ -1,6 +1,6 @@
 <template>
     <div class="nut-steps" :class="stepsId">
-        <div class="progress-list-box" v-for="(item,index) in stepTitleList">
+        <div class="progress-list-box" v-for="(item,index) in stepTitleList" v-bind:key="index">
             <div :class="['progress-list', {'left-border' : index !== stepTitleList.length-1}]">
                 <div class="gap no-border" v-if="index==0" :style="{height: titleTop+'rem'}"></div>
                 <div class="gap"  :style="{height: titleTop+'rem'}" v-else></div>

src/package/swiper/src/swiper.vue

@@ -2,7 +2,7 @@
     <div class="nut-swiper"
         :class="[direction,{'dragging':dragging}]"
         @touchstart="_onTouchStart($event)"
-        @mousedown="_onTouchStart($event)">
+        @mousedown="_onTouchStart($event)" @touchMove.stop>
         <div class="nut-swiper-wrap"
             :style="{
                     'transform':'translate3d('+translateX+'px,'+translateY+'px,0)',
@@ -14,7 +14,7 @@
             <slot></slot>
         </div>
         <div class="nut-swiper-pagination" v-show="paginationVisible">
-            <span class="swiper-pagination-bullet" :class="{'active':index+1 ===currentPage}" v-for="(slide,index) in slideEls" @click="paginationClickable && setPage(index+1)">
+            <span class="swiper-pagination-bullet" :class="{'active':index+1 ===currentPage}" v-for="(slide,index) in slideEls" @click="paginationClickable && setPage(index+1)" :key="index">
             </span>
         </div>
     </div>

src/package/tab/src/tab.vue

@@ -2,7 +2,9 @@
     <div class="nut-tab" :class="{'nut-tab-leftnav' : positionNavCss}">
         <template v-if="positionNav=='top'">
             <div :class="['nut-tab-title',tabType]">
-                <span v-for="(value,index) in tabTitleList" v-on:click="switchTab(index,$event)" class="nut-title-nav-list" 
+                <span v-for="(value,index) in tabTitleList"  
+                v-bind:key="index"
+                v-on:click="switchTab(index,$event)" class="nut-title-nav-list" 
                 :class="['nut-title-nav',{'nut-tab-active' : activeIndex == index}]"
                 >
                 <a :href="value.href" class="nut-tab-link" v-on:click="switchTabLink(index,$event)">
@@ -17,7 +19,9 @@
         </template>
         <template v-else-if="positionNav=='left'">
                 <div :class="['nut-tab-title-leftnav',tabType]">
-                    <span v-for="(value,index) in tabTitleList" v-on:click="switchTab(index,$event)" class="nut-title-nav-leftnav" 
+                    <span v-for="(value,index) in tabTitleList" 
+                    v-bind:key="index"
+                    v-on:click="switchTab(index,$event)" class="nut-title-nav-leftnav" 
                     :class="['nut-title-nav',{'nut-tab-active' : activeIndex == index}]"
                     >
                     <a :href="value.href" class="nut-tab-link" v-on:click="switchTabLink(index,$event)">
@@ -35,7 +39,9 @@
                     <slot></slot>
                 </div>
                 <div :class="['nut-tab-title-rightnav',tabType]">
-                    <span v-for="(value,index) in tabTitleList" v-on:click="switchTab(index,$event)" class="nut-title-nav-leftnav" 
+                    <span v-for="(value,index) in tabTitleList" 
+                    v-bind:key="index"
+                    v-on:click="switchTab(index,$event)" class="nut-title-nav-leftnav" 
                     :class="['nut-title-nav',{'nut-tab-active' : activeIndex == index}]"
                     >
                     <a :href="value.href" class="nut-tab-link" v-on:click="switchTabLink(index,$event)">
@@ -50,7 +56,9 @@
                 <slot></slot>
             </div> 
                 <div :class="['nut-tab-title-bottomnav',tabType]">
-                <span v-for="(value,index) in tabTitleList" v-on:click="switchTab(index,$event)" class="nut-title-nav-list" 
+                <span v-for="(value,index) in tabTitleList" 
+                v-bind:key="index"
+                v-on:click="switchTab(index,$event)" class="nut-title-nav-list" 
                 :class="['nut-title-nav',{'nut-tab-active' : activeIndex == index}]"
                 >
                 <a :href="value.href" class="nut-tab-link" v-on:click="switchTabLink(index,$event)">

src/package/textbox/src/textbox.vue

@@ -68,6 +68,8 @@ export default {
            	}else{
                 this.errorState = false;
            	}
+            this.$emit('inputFunc',this.textInfo);
+
         }
     }
 }

src/view/textbox.vue

@@ -41,6 +41,14 @@
 
         <h6>不显示字数限制</h6>
         <nut-codebox :code="demo8" imgUrl="../asset/img/demo/textbox7.png"></nut-codebox>
+
+        <h6>输入回调返回文字</h6>
+        <nut-textbox 
+          :maxNum="10" 
+          txtAreaH="2"  
+          @inputFunc="inputText" 
+          ></nut-textbox>
+        <nut-codebox :code="demo9" ></nut-codebox>
         
         <h5>Props</h5>
         <div class="tbl-wrapper">
@@ -116,6 +124,11 @@
               <td>输入字数超过限定字数时触发事件</td>
               <td>--</td>
             </tr>
+            <tr>
+              <td>inputText</td>
+              <td>文字输入事件回调，默认传回输入文本</td>
+              <td>--</td>
+            </tr>
           </tbody>
         </table>
         </div>
@@ -164,11 +177,22 @@ textBgColor="#feefef">
             demo8:`<nut-textbox 
 :limitShow="false">
 </nut-textbox>`,
+            demo9:` <nut-textbox :maxNum="10" txtAreaH="2" @inputFunc="inputText" ></nut-textbox>
+export default {
+  methods:{
+      inputText(val){
+           alert(val);
+      }
+  }
+}`
         }
     },
     methods:{
         overLength(){
             alert('字数超出');
+        },
+        inputText(val){
+           alert(val);
         }
     }
 }

webpack.config.js

@@ -33,11 +33,14 @@ webpackConfig.module = {
         use: ['style-loader', 'css-loader', 'postcss-loader']
     }, {
         test: /\.scss$/,
-        use: ['style-loader', 'css-loader', 'sass-loader', 'postcss-loader']
+            use: ['style-loader', 'css-loader', 'sass-loader', 'postcss-loader']
     }, {
         test: /\.vue$/,
         loader: 'vue-loader',
         options: {
+            loaders: {
+                scss: 'vue-style-loader!css-loader!sass-loader'
+            },
             postcss: [autoprefixer()]
         }
     }, {
@@ -122,7 +125,7 @@ if (isProduction) {
     webpackConfig.devServer = {
         contentBase: path.resolve(__dirname, 'dist'),
         compress: true, //gzip压缩
-        // host:'10.0.39.18',
+        //host:'10.0.39.18',
         historyApiFallback: true
     };
 }

部分使用项目.md

@@ -0,0 +1,14 @@
+|ID|项目名|时间|入口|
+|:--|:---|:---|:---|
+|1|大客户福利平台|2018.1|无固定链接|
+|2|高管考勤|2018.1|京ME-高管考勤|
+|3|京保养|2018.1|http://m-svc.jd.com/#/ 京东app-车保养-京保养|
+|4|京ME预约中心|2018.1|http://booking.jd.com/static/html/home.html 京me-预约中心|
+|5|杉德系统|2018.1|无固定链接，需要从acto.ka.jd.com进入活动管理（需有权限），查看相应动态链接|
+|6|用户之声|2018.1|京东ME-应用-用户之声|
+|7|拍拍二手|2018.1|微信小程序-拍拍二手|
+|8|调查问卷项目|2018.3|http://p.wenjuan.jd.com|
+|9|PLUS会员|2017.10|京东app-PLUS会员|
+|10|一线支援|2018.1|京东ME-应用-一线支援|
+|11|人民日报智慧党建|2018.1|人名日报app-我的中心-智慧党建|
+|12|宽带办理|2018.6|京东app-充值缴费-宽带办理|