fix: 样式修复

src/packages/dialog/dialog.vue

@@ -6,18 +6,21 @@
       v-model="curVisible"
       :lock-scroll="lockBgScroll"
       :overlayStyle='{backgroundColor:maskBgStyle}'
-      class="nut-dialog"
+      class="nut-dialog-wrapper"
       @click="clickCover"
     >
       <div class="nut-dialog-box" v-show="curVisible" @click="modalClick">
-        <div class="nut-dialog" @click.stop>
-          <a href="javascript:;" v-if="closeBtn" @click="closeBtnClick" class="nut-dialog-close"></a>
-          <template v-if="type === 'image'">
+        <template v-if="type === 'image'">
+          <div class="nut-dialog-image-wrapper" @click.stop>
             <a href="javascript:;" @click="imageLinkClick" class="nut-dialog-link">
               <img :src="imgSrc" class="nut-dialog-image" alt />
             </a>
-          </template>
-          <template v-else>
+              <a href="javascript:;" v-if="closeBtn" @click="closeBtnClick" class="nut-dialog-close"></a>
+          </div>
+        </template>
+         
+        <template v-else>
+             <div class="nut-dialog" @click.stop>
             <div class="nut-dialog-body">
               <span class="nut-dialog-title" v-html="title" v-if="title"></span>
               <div class="nut-dialog-content" v-if="$slots.default" :style="{ textAlign }">
@@ -52,8 +55,9 @@
                   </div>
               </template>
             </div>
-          </template>
-        </div>
+             </div>
+        </template>
+       
       </div>
     </nut-popup>
   </transition>

src/packages/dialog/doc.md

@@ -21,19 +21,19 @@ this.$dialog({
         content: "小屏或移动端浏览效果最佳",
         closeBtn:true,  //显式右上角关闭按钮
         onOkBtn(event) {  //确定按钮点击事件
-          alert("okBtn");
+           this.$toast.text("okBtn");
           this.close(); //关闭对话框
         },
         onCancelBtn(event) {  //取消按钮点击事件，默认行为关闭对话框
-          alert("cancelBtn");
+           this.$toast.text("cancelBtn");
           //return false;  //阻止默认“关闭对话框”的行为
         },
         onCloseBtn(event) { //右上角关闭按钮点击事件
-          alert("closeBtn");
+           this.$toast.text("closeBtn");
           //return false;  //阻止默认“关闭对话框”的行为
         },
         closeCallback(target) {
-          alert("will close");  //对话框关闭回调函数，无论通过何种方式关闭都会触发
+           this.$toast.text("will close");  //对话框关闭回调函数，无论通过何种方式关闭都会触发
         }
 });
         
@@ -53,14 +53,10 @@ this.$dialog({
           name: '主要操作2',
           value: 1,
           disabled:false,
-        },{
-          name: '主要操作3',
-          value:2,
-          disabled:false,
         }],
         chooseBtn(item,index){
           console.log(index)
-          alert(`我点击了第${index + 1}个按钮`)
+           this.$toast.text(`我点击了第${index + 1}个按钮`)
           this.close()
         },    
       });

src/packages/field/demo.vue

@@ -2,15 +2,15 @@
   <div class="textinput-demo">
     <h4>标准样式</h4>
     <div class="filed-demo"> 
-      <nut-field label="标题内容：" placeholder="请输入内容" v-model="val" />
+      <nut-field label="标题内容" placeholder="请输入内容" v-model="val" />
     </div>
     <h4>文字左对齐，且不展示 清除 按钮</h4>
     <div class="filed-demo">
-      <nut-field :disableClear="true" v-model="val2"  label="文本左对齐：" textAlign="left" placeholder="请输入内容" />  
+      <nut-field :disableClear="true" v-model="val2"  label="文本左对齐" textAlign="left" placeholder="请输入内容" />  
     </div> 
      <h4>标题超出长度限制</h4>
     <div class="filed-demo">
-      <nut-field  v-model="val2"  label="标题长度超出超出超出范围：" textAlign="right" placeholder="请输入内容" /> 
+      <nut-field  v-model="val2"  label="标题长度超出超出超出范围" textAlign="right" placeholder="请输入内容" /> 
     </div> 
      <h4>数字</h4>
     <div class="filed-demo">
@@ -59,7 +59,7 @@ export default {
   data() {
     return {
       val: '',
-      val2: '这里文本内容',
+      val2: '',
       val3: '',
       val4: '',
       val5: '12345678985',
@@ -127,8 +127,7 @@ h4{
 }
 .filed-demo{
   width: 100vw;
-  box-sizing: border-box;
-  overflow: hidden;
+  box-sizing: border-box; 
   background-color: #fff;
   padding: 5px 20px 5px 20px ;
   	.get-code {

src/packages/field/field.scss

@@ -2,14 +2,14 @@
     display: flex;
     box-sizing: border-box;
     position: relative;
-    overflow: hidden;
     .nut-require {
         color: #ee0a24;
         margin-right: 5px;
+        margin-top: 10px;
     }
     .nut-field-label {
         display: inline-block;
-        margin-right: 20px;
+        margin-right: 24px;
         max-width: 120px;
         overflow: hidden;
         font-size: 16px;
@@ -39,7 +39,7 @@
     }
     .nut-text-core {
         flex: 1;
-        padding: 5px 15px 5px 0;
+        padding: 4px 15px 5px 0;
         appearance: none;
         font-size: 14px;
         box-sizing: border-box;
@@ -69,6 +69,7 @@
         span {
             float: right;
             margin-right: 15px;
+            color: #969696;
         }
     }
     .nut-textinput-clear {
@@ -90,7 +91,7 @@
         border-bottom: 1px solid red;
         box-sizing: border-box;
         position: absolute;
-        bottom: 0;
+        bottom: -3px;
     }
     .input-error {
         color: red;

src/packages/field/field.vue

@@ -134,6 +134,7 @@ export default {
       const txtLength = data.length;
       this.txtNum = txtLength;
       if (txtLength > this.maxLength*1) {
+        this.$toast.text(`最多可输入${this.maxLength}字`)
         this.$emit('errorFunc');
       } else {
       }