Frans 7 years ago
parent
commit
9a40f9ea56

+ 2 - 2
sites/demo/app.js

@@ -4,6 +4,7 @@ import "core-js/modules/es6.array.iterator";
 import Vue from 'vue';
 import App from './App.vue';
 import router from './router';
+import Conf from '../../src/config.json';
 import NutUI from '../../src/nutui';
 // import en from '../../src/locales/lang/en-US';
 // import demoEN from './lang/en-US';
@@ -49,8 +50,7 @@ const app = new Vue({
   template: '<App/>'
 })
 
-//Vue.prototype.NUTCONF = Conf;
-
+Vue.prototype.NUTCONF = Conf;
 
 let pageLoading = app.$toast.loading();
 

+ 12 - 12
src/packages/datepicker/demo.vue

@@ -2,46 +2,46 @@
     <div class="demo-list">
         <h4>基本用法</h4>
         <div>
-            <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="show-value"  @click="switchPicker('isVisible')">{{date ? date : '请选择日期'}}</span>
+                    <span class="show-value">{{date ? date : '请选择日期'}}</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="show-value"  @click="switchPicker('isVisible1')">{{date1 ? date1 : '请选择日期'}}</span>
+                    <span class="show-value">{{date1 ? date1 : '请选择日期'}}</span>
                 </div>
             </nut-cell>
-            <nut-cell :showIcon="true">
+            <nut-cell :showIcon="true" :isLink="true" @click.native="switchPicker('isVisible2')">
                 <span slot="title"><label>日期时间选择</label></span>
                 <span slot="sub-title">有默认值,限制开始结束时间~~~</span>
                 <div slot="desc" class="selected-option" >
-                    <span class="show-value"  @click="switchPicker('isVisible2')">{{datetime ? datetime : '请选择'}}</span>
+                    <span class="show-value">{{datetime ? datetime : '请选择'}}</span>
                 </div>
             </nut-cell>
-            <nut-cell :showIcon="true">
+            <nut-cell :showIcon="true" :isLink="true" @click.native="switchPicker('isVisible3')">
                 <span slot="title"><label>时间选择</label></span>
                 <span slot="sub-title">12小时制~~~</span>
                 <div slot="desc" class="selected-option" >
-                    <span class="show-value"  @click="switchPicker('isVisible3')">{{time ? `${time} ${amOrPm}` : '请选择时间'}}</span>
+                    <span class="show-value">{{time ? `${time} ${amOrPm}` : '请选择时间'}}</span>
                 </div>
             </nut-cell>
-            <nut-cell :showIcon="true">
+            <nut-cell :showIcon="true" :isLink="true" @click.native="switchPicker('isVisible4')">
                 <span slot="title"><label>时间选择</label></span>
                 <span slot="sub-title">限制开始结束小时~~~</span>
                 <div slot="desc" class="selected-option" >
-                    <span class="show-value"  @click="switchPicker('isVisible4')">{{time1 ? time1 : '请选择时间'}}</span>
+                    <span class="show-value">{{time1 ? time1 : '请选择时间'}}</span>
                 </div>
             </nut-cell>
-            <nut-cell :showIcon="true">
+            <nut-cell :showIcon="true" :isLink="true" @click.native="switchPicker('isVisible5')">
                 <span slot="title"><label>时间选择</label></span>
                 <span slot="sub-title">分钟数递增步长设置~~~</span>
                 <div slot="desc" class="selected-option" >
-                    <span class="show-value"  @click="switchPicker('isVisible5')">{{time2 ? time2 : '请选择时间'}}</span>
+                    <span class="show-value">{{time2 ? time2 : '请选择时间'}}</span>
                 </div>
             </nut-cell>
         </div>

+ 3 - 3
src/packages/dialog/demo.vue

@@ -89,9 +89,9 @@ export default {
     },
     showDialog5: function() {
       const options = {
-        okBtnTxt: 'qwe',
-        title: "自定义Dialog标题",
-        content: "小屏或移动端浏览效果最佳",
+        okBtnTxt: '好 的',
+        title: "事件",
+        content: "点击按钮触发事件",
         closeBtn:true,
         onOkBtn(event) {
           alert("okBtn");

+ 3 - 0
src/packages/dialog/dialog.scss

@@ -159,6 +159,9 @@ body.dialog-open {
         color: $primary-color;
         border-top: 1px solid $light-color;
     }
+    &:active{
+        opacity: .7;
+    }
 }
 
 .nut-dialog-ok {

+ 0 - 1
src/packages/radio/radio.vue

@@ -42,7 +42,6 @@ export default {
     return {}
   },
   mounted(){
-    
   },
   methods: {
     changeEvt(event) {

+ 3 - 1
src/packages/radiogroup/demo.vue

@@ -1,6 +1,8 @@
 <template>
     <div>
-      <nut-radiogroup :groupData="myData">
+      <nut-radiogroup>
+          <nut-radio label="禁用">备选项1</nut-radio>
+          <nut-radio label="禁用2">备选项2</nut-radio>
       </nut-radiogroup>
     </div>
 </template>

+ 3 - 1
src/packages/radiogroup/radiogroup.vue

@@ -1,6 +1,7 @@
 <template>
     <div class="nut-radiogroup">
-        <nut-radio v-for="rdo in gData" :key="rdo.id" :label="rdo.label">{{rdo.text}}</nut-radio>
+        <slot></slot>
+        <!-- <nut-radio v-for="rdo in gData" :key="rdo.id" :label="rdo.label">{{rdo.text}}</nut-radio> -->
     </div>
 </template>
 <script>
@@ -22,6 +23,7 @@ export default {
     methods: {
     },
     mounted(){
+        console.log(1234,this);
     }
 }
 </script>

+ 1 - 1
src/packages/toast/_toast.js

@@ -15,7 +15,7 @@ function _showToast() {
 
 function _getInstance(obj) {
   let opt = {
-        id:null,
+        id:"default",
         msg: "",
         visible: false,
         duration: 2000, //显示时间(毫秒)

+ 18 - 18
src/packages/toast/demo.vue

@@ -2,57 +2,57 @@
     <div class="demo-list">
         <h4>基本用法</h4>
         <div>
-            <nut-cell :showIcon="true" @click.native="textToast1('我只传了文案一个参数')">
+            <nut-cell :showIcon="true" :isLink="true" @click.native="textToast1('我只传了文案一个参数')">
                 <span slot="title"><label>只传文案</label></span>
             </nut-cell>
-            <nut-cell :showIcon="true" @click.native="textToast2('我传了文案和显示时长两个参数,多行文字默认居中展示',5000)">
+            <nut-cell :showIcon="true" :isLink="true" @click.native="textToast2('我传了文案和显示时长两个参数,多行文字默认居中展示',5000)">
                 <span slot="title"><label>设置显示时长</label></span>
             </nut-cell>
-            <nut-cell :showIcon="true" @click.native="sucToast('操作成功')">
+            <nut-cell :showIcon="true" :isLink="true" @click.native="sucToast('操作成功')">
                 <span slot="title"><label>Success</label></span>
             </nut-cell>
-            <nut-cell :showIcon="true" @click.native="failToast('操作失败')">
+            <nut-cell :showIcon="true" :isLink="true" @click.native="failToast('操作失败')">
                 <span slot="title"><label>Fail</label></span>
             </nut-cell>
-            <nut-cell :showIcon="true" @click.native="warnToast('操作警告')">
+            <nut-cell :showIcon="true" :isLink="true" @click.native="warnToast('操作警告')">
                 <span slot="title"><label>Warn</label></span>
             </nut-cell>
         </div>
         <h4>加载提示</h4>
         <div>
-            <nut-cell :showIcon="true" @click.native="showLoading()">
+            <nut-cell :showIcon="true" :isLink="true" @click.native="showLoading()">
                 <span slot="title"><label>Loading</label></span>
                 <span slot="desc">默认不自动消失</span>
             </nut-cell>
-            <nut-cell :showIcon="true" @click.native="hideLoading()">
+            <nut-cell :showIcon="true" :isLink="true" @click.native="hideLoading()">
                 <span slot="title"><label>隐藏Loading</label></span>
                 <span slot="desc">点击手动隐藏上面的Loading</span>
             </nut-cell>
-            <nut-cell :showIcon="true" @click.native="showLoading2()">
+            <nut-cell :showIcon="true" :isLink="true" @click.native="showLoading2()">
                 <span slot="title"><label>Loading</label></span>
                 <span slot="desc">带文案+自动消失</span>
             </nut-cell>
         </div>
         <h4>自定义样式</h4>
         <div>
-            <nut-cell :showIcon="true" @click.native="cusBgToast('我修改了背景色和透明度')">
+            <nut-cell :showIcon="true" :isLink="true" @click.native="cusBgToast('我修改了背景色和透明度')">
                 <span slot="title"><label>自定义背景色和透明度</label></span>
             </nut-cell>
-            <nut-cell :showIcon="true" @click.native="cusClassToast('我增加了一个名为 my-class 自定义class')">
+            <nut-cell :showIcon="true" :isLink="true" @click.native="cusClassToast('我有一个名为 my-class 自定义class')">
                 <span slot="title"><label>自定义class</label></span>
             </nut-cell>
-            <nut-cell :showIcon="true" @click.native="cusIconToast('自定义Icon')">
+            <nut-cell :showIcon="true" :isLink="true" @click.native="cusIconToast('自定义Icon')">
                 <span slot="title"><label>自定义Icon</label></span>
             </nut-cell>
         </div>
-        <h4>共享实例</h4>
-        <p>id相同时,将共享一个实例,新的内容和设置将取代旧的,二者不能同时出现。loading类型默认拥有相同id,即共享一个实例,其他类型默认不共享。</p>
+        <h4>共享实例</h4>
+        <p>如果不指定id,多个Toast默认将共享一个实例(loading类型与其他类型实例不共享),新的内容和设置将取代旧的,多个Toast不能同时出现。如果不需要共享实例,可以给其设置id。例如,以下两个栗子分别设置了不同id,它们可以同时出现。</p>
         <div>
-            <nut-cell :showIcon="true" @click.native="idToast1('我设置了id为123')">
+            <nut-cell :showIcon="true" :isLink="true" @click.native="idToast1('我设置了id为123')">
                 <span slot="title"><label>我设置了id为123</label></span>
             </nut-cell>
-            <nut-cell :showIcon="true" @click.native="idToast2('我也设置了id,值也是123')">
-                <span slot="title"><label>我也设置了id,值也是123</label></span>
+            <nut-cell :showIcon="true" :isLink="true" @click.native="idToast2('我设置了id为321')">
+                <span slot="title"><label>我设置了id为321</label></span>
             </nut-cell>
         </div>
     </div>
@@ -96,7 +96,7 @@ export default {
       this.loading2 = this.$toast.loading('加载中...',{duration:3000});
     },
     cusBgToast(msg){
-      this.$toast.text(msg,{bgColor:'rgba(50, 50, 50, 0.9)'});
+      this.$toast.text(msg,{bgColor:'rgba(50, 50, 50, 0.6)'});
     },
     cusClassToast(msg) {
       this.$toast.text(msg,{customClass:'my-class'});
@@ -108,7 +108,7 @@ export default {
       this.$toast.success(msg,{id:123});
     },
     idToast2(msg){
-      this.$toast.text(msg,{id:123,duration:4000});
+      this.$toast.text(msg,{id:321,duration:4000});
     }
   }
 };

+ 3 - 3
src/packages/toast/doc.md

@@ -76,16 +76,16 @@ this.$toast.loading('加载中...',{
 
 ## 共享实例
 
-id相同时,将共享一个实例,新的内容和设置将取代旧的,二者不能同时出现。loading类型默认拥有相同id,即共享一个实例,其他类型默认不共享
+Toast的id如果相同,将共享一个实例。如果不设置id,多个Toast将拥有相同的id默认值,它们将共享一个实例(loading类型与其他类型实例不共享),新的内容和设置将取代旧的,多个Toast不能同时出现。如果不需要共享实例,可以给其设置id
 
 ```javascript
-//二者id相同,共享一个实例
+//二者id不同,不会共享一个实例
 this.$toast.success(msg,{
     id:123
 });
 
 this.$toast.text(msg,{
-    id:123,
+    id:321,
     duration:4000
 });
 ```