lifeifan 7 年 前
コミット
0131a66ac8

+ 1 - 1
build/webpack.demo.dev.conf.js

@@ -18,7 +18,7 @@ module.exports = merge(baseConf, {
             ftp: {
                 host: '192.168.181.73',
                 port: 3000,
-                source: 'dist/sites/demo',
+                source: 'dist/sites',
                 target: '/var/www/html/page.jd.com/exploit/nutui2/'
             }
         })

+ 0 - 4
sites/demo/index.html

@@ -26,11 +26,7 @@
 
     //分享配置
     var shareOption = {
-<<<<<<< HEAD
       iconUrl: 'http://nutui.jd.com/img/logo_share.png',
-=======
-      iconUrl: 'http://nutui.jd.com/img/logo.png',
->>>>>>> 55dce3e80e4da8064bd69c50b4d619f7478b3e6d
       url: 'http://nutui.jd.com/demo.html#/index',
       title: '移动端Vue组件库 NutUI 2.0',
       desc: '一套京东风格的轻量级移动端Vue组件库'

ファイルの差分が大きいため隠しています
+ 7 - 6
sites/demo/view/demonav.vue


+ 8 - 8
src/packages/picker/demo.vue

@@ -2,25 +2,25 @@
     <div class="demo-list">
         <h4>基本用法</h4>
         <div>
-            <nut-cell :showIcon="true">
+            <nut-cell :showIcon="true" :isLink="true" @click.native="switchPicker('isVisible0')">
                 <span slot="title"><label>年月选择</label></span>
                 <span slot="sub-title">不联动多列~~~</span>
-                <div slot="desc" class="selected-option" @click="switchPicker('isVisible0')">{{date ? date : '请选择'}}</div>
+                <div slot="desc" class="selected-option">{{date ? date : '请选择'}}</div>
             </nut-cell>
-            <nut-cell :showIcon="true">
+            <nut-cell :showIcon="true" :isLink="true" @click.native="switchPicker('isVisible')">
                 <span slot="title"><label>城市选择</label></span>
                 <span slot="sub-title">联动~~~</span>
                 <div slot="desc" class="selected-option" >
-                    <span class="btn" @click="modifyCity">修改为指定的城市</span>
-                    <span class="show-value"  @click="switchPicker('isVisible')">{{city ? city : '请选择'}}</span>
+                    <span class="btn" @click.stop.prevent="modifyCity">修改为指定的城市</span>
+                    <span class="show-value">{{city ? city : '请选择'}}</span>
                 </div>
             </nut-cell>
-            <nut-cell :showIcon="true">
+            <nut-cell :showIcon="true" :isLink="true" @click.native="switchPicker('isVisible1')">
                 <span slot="title"><label>年选择</label></span>
                 <span slot="sub-title">单列~~~</span>
                 <div slot="desc" class="selected-option" >
-                    <span class="btn" @click="modifyYear">修改为指定的年份</span>
-                    <span class="show-value"  @click="switchPicker('isVisible1')">{{year ? year : '请选择'}}</span>
+                    <span class="btn" @click.stop.prevent="modifyYear">修改为指定的年份</span>
+                    <span class="show-value">{{year ? year : '请选择'}}</span>
                 </div>
             </nut-cell>
         </div>

+ 31 - 16
src/packages/range/demo.vue

@@ -1,5 +1,5 @@
 <template>
-    <div class="demo-list">
+    <div class="range-demo demo-list">
         <h4>基本用法</h4>
         <div>
             <nut-cell>
@@ -13,36 +13,35 @@
                     <span slot="title">{{val1[0]}},{{val1[1]}}</span>
             </nut-cell>
         </div>
-        
-        <h4>修改主题风格</h4>
+
+        <h4>显示标签文字</h4>
         <div>
-            <nut-cell>
+            <nut-cell class="my-range">
                 <span slot="title">
                 <nut-range 
-                    color="#31ccec"
-                    :rangeValues.sync="val2" 
-                    :range="[0,200]" 
-                    :showLabel="true"></nut-range></span>
+                    :rangeValues.sync="val3" 
+                    :range="[-10,10]" 
+                    :showLabelAlways="true" 
+                    :showLabel="true"
+                    :showRangeTxt="true"></nut-range></span>
             </nut-cell>
             <nut-cell>
-                    <span slot="title">{{val2[0]}},{{val2[1]}}</span>
+                    <span slot="title">{{val3[0]}},{{val3[1]}}</span>
             </nut-cell>
         </div>
         
-        <h4>显示标签文字</h4>
+        <h4>修改主题风格</h4>
         <div>
             <nut-cell>
                 <span slot="title">
                 <nut-range 
                     color="#31ccec"
-                    :rangeValues.sync="val3" 
-                    :range="[-10,10]" 
-                    :showLabelAlways="true" 
-                    :showLabel="true"
-                    :showRangeTxt="true"></nut-range></span>
+                    :rangeValues.sync="val2" 
+                    :range="[0,200]" 
+                    :showLabel="true"></nut-range></span>
             </nut-cell>
             <nut-cell>
-                    <span slot="title">{{val3[0]}},{{val3[1]}}</span>
+                    <span slot="title">{{val2[0]}},{{val2[1]}}</span>
             </nut-cell>
         </div>
     </div>
@@ -61,3 +60,19 @@ export default {
 };
 </script>
 
+<style lang="scss">
+.range-demo{
+    .nut-cell:first-child{
+        .nut-cell-title{
+            padding:0 30px;
+        }
+        &.my-range{
+           .nut-cell-title{
+                padding:0;
+            } 
+        }
+    }
+}
+</style>
+
+

+ 14 - 7
src/packages/slider/demo.vue

@@ -1,12 +1,12 @@
 <template>
-    <div class="tel-input-demo demo-list">
+    <div class="slider-demo demo-list">
         <h4>基本用法</h4>
         <div>
             <nut-cell>
                 <span slot="title"><nut-slider v-model="val1" :range="[0,10]"></nut-slider></span>
             </nut-cell>
             <nut-cell>
-                <span slot="title">Value:  {{val1}}</span>
+                <span slot="title">Value:  {{val1}}</span>
             </nut-cell>
         </div>
         <h4>拖动时展示标签</h4>
@@ -15,7 +15,7 @@
                 <span slot="title"><nut-slider v-model="val2" :range="[0,100]" :showLabel="true"></nut-slider></span>
             </nut-cell>
             <nut-cell>
-                <span slot="title">Value:  {{val2}}</span>
+                <span slot="title">Value:  {{val2}}</span>
             </nut-cell>
         </div>
         <h4>一直展示标签</h4>
@@ -24,7 +24,7 @@
                 <span slot="title"><nut-slider v-model="val3" :range="[0,100]" :showLabel="true" :showLabelAlways="true"></nut-slider></span>
             </nut-cell>
             <nut-cell>
-                <span slot="title">Value:  {{val3}}</span>
+                <span slot="title">Value:  {{val3}}</span>
             </nut-cell>
         </div>
         <h4>两端显式可选取范围</h4>
@@ -33,7 +33,7 @@
                 <span slot="title"><nut-slider v-model="val4" :range="[-50,50]" :showLabel="true" :showRangeTxt="true"></nut-slider></span>
             </nut-cell>
             <nut-cell>
-                <span slot="title">Value:  {{val4}}</span>
+                <span slot="title">Value:  {{val4}}</span>
             </nut-cell>
         </div>
         <h4>设置分段数(stage=20)</h4>
@@ -42,7 +42,7 @@
                 <span slot="title"><nut-slider v-model="val5" :range="[0,100]" :showLabel="true" :showRangeTxt="true" :stage="5"></nut-slider></span>
             </nut-cell>
             <nut-cell>
-                <span slot="title">Value:  {{val5}}</span>
+                <span slot="title">Value:  {{val5}}</span>
             </nut-cell>
         </div>
         <h4>自定义Class</h4>
@@ -51,7 +51,7 @@
                 <span slot="title"><nut-slider class="my-slider" v-model="val6" :range="[0,100]"></nut-slider></span>
             </nut-cell>
             <nut-cell>
-                <span slot="title">Value:  {{val6}}</span>
+                <span slot="title">Value:  {{val6}}</span>
             </nut-cell>
         </div>
     </div>
@@ -74,6 +74,13 @@ export default {
 </script>
 
 <style lang="scss">
+.slider-demo{
+    .nut-cell:first-child{
+        .nut-cell-title{
+            padding:0 30px;
+        }
+    }
+}
 .nut-slider.my-slider {
   .nut-slider-box {
     height: 6px;

+ 11 - 1
src/packages/tabbar/demo.vue

@@ -5,7 +5,7 @@
       <h4>带有tips的文本标签栏</h4>
       <nut-tabbar @tab-switch="tabSwitch2" type="card" :tabbarList="tabList2"></nut-tabbar>
       <h4>固定底部,可跳转页面</h4>
-  		<nut-tabbar @tab-switch="tabSwitch3" :tabbarList="tabList3" :bottom="true">  
+  		<nut-tabbar @tab-switch="tabSwitch3" :tabbarList="tabList3" :bottom="true" class="my-tabbar">  
       </nut-tabbar>
     </div>
 </template>
@@ -134,3 +134,13 @@
   }
 };
 </script>
+<style lang="scss">
+.my-tabbar{
+  padding-top:5px;
+  border-top:1px solid #f2f2f2;
+  .tips{
+    top:-5px;
+    right:10px;
+  }
+}
+</style>

+ 7 - 5
src/packages/tabbar/tabbar.scss

@@ -36,16 +36,18 @@
 	position: relative;
 	.tips{
 		position: absolute;
-		min-width: 18px;
-		min-height: 18px;
+		min-width: 14px;
+		min-height: 14px;
 		display: flex;
 		justify-content:center;
 		align-items: center;
-		padding:0px;
+		padding:0;
 		border:1px solid $border-color-active;
 		border-radius: 50%;
-		top: -12px;
-		right: 0px;
+		top: -10px;
+		right: 0;
+		background:#fff;
+		box-shadow: 0 0 0 1px #fff;
 		transform: translateX(60%);
 		font-size: $font-size-small;
 		color: $primary-color;