#

whycq

2023-10-10 155f2b80f2a9b6f900c73f6e4461e9cebb7cd028

 components/y-input-btn/y-input-btn.vue

@@ -2,14 +2,18 @@
   <view>
      <view class="main">
         <y-title />
         <!-- <view class="title" :class="zBig">{{titleText}}</view> -->
         <view class="column" :class="zBig">
            <input type="text" :placeholder="placeholderText" @input="input"
             placeholder-style="font-size:22rpx" v-model="val">
                <view class="btn">
                   <button class="small-btn" size="mini" type="primary" @click="confrim">{{btnText}}</button>
            <view style="display: flex;" class="input">
               <input type="text" :placeholder="placeholderText" @input="input"
                placeholder-style="font-size:22rpx" v-model="val">
                <view class="icons" v-if="val.length" @click="clear">
                   <uni-icons type="close"></uni-icons>
                </view>
             <slot />
             </view>
             <view class="btn">
                <button class="small-btn" size="mini" type="primary" @click="confrim">{{btnText}}</button>
             </view>
          <slot />
         </view>
      </view>
   </view>
@@ -67,19 +71,38 @@
         },
         confrim() {
            this.$emit('confrim');
         },
         clear() {
            this.val = ''
            this.input()
         }
      }
   }
</script>

<style>
.main {
   .main {
      width: 96%;
      min-height: 100rpx;
      background-color: #fff;
      margin: 2%;
      border-radius: 5rpx;
      box-shadow: 0 0 10upx rgba(0, 0, 0, 0.1);
   }
   .input{
      width: 96%;
      height: 100%;
      margin-left: 2%;
      margin-right: 1%;
      border-radius: 5rpx;
      color: #606266;
      background-color: #FAFAFA;
      font-size: 28rpx;
      text-indent: 8rpx;
      /* letter-spacing: 1rpx; */
   }
   .icons {
      margin-right: 2% ;
   }
   .title {
      height: 50rpx;
@@ -96,7 +119,7 @@
   }
   input{
      display: flex;
      width: 70%;
      width: 96%;
      height: 45rpx;
      line-height: 50rpx;
      margin-left: 2%;