#
whycq
2023-11-07 e7cb9cf85f5f1c0db0833dbbd9ad3f4ed09b3598
components/y-input/y-input.vue
@@ -1,10 +1,15 @@
<template>
   <view>
      <view class="main">
         <view class="title" :class="zBig">{{titleText}}</view>
         <y-title :title="titleText"/>
         <view :class="zBig">
            <input type="text" :placeholder="placeholderText" @input="input"
             placeholder-style="font-size:22rpx" v-model="val">
            <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>
            </view>
         </view>
      </view>
   </view>
@@ -42,9 +47,6 @@
         placeholderText() {
            return this.placeholder 
         },
         // val() {
         //    return this.inputVal || t("uni-popup.inputVal")
         // }
      },
      data() {
         return {
@@ -65,7 +67,12 @@
      methods: {
         input() {
            this.$emit('input',this.val);
         },
         clear() {
            this.val = ''
            this.input()
         }
      }
   }
</script>
@@ -79,15 +86,18 @@
      border-radius: 5rpx;
      box-shadow: 0 0 10upx rgba(0, 0, 0, 0.1);
   }
   .title {
      height: 50rpx;
      line-height: 55rpx;
      font-size: 32rpx;
      font-weight: bold;
      font-family: Arial, Helvetica, sans-serif;
      text-indent: 1em;
      letter-spacing: 8rpx;
      color: #303133;
   .input{
      width: 96%;
      height: 100%;
      margin-left: 2%;
      margin-right: 1%;
      border-radius: 5rpx;
      color: #606266;
      /* border: 1px solid #EBEDF0; */
      background-color: #FAFAFA;
      font-size: 28rpx;
      text-indent: 8rpx;
      /* letter-spacing: 1rpx; */
   }
   input{
      width: 96%;
@@ -98,11 +108,14 @@
      border-radius: 5rpx;
      color: #606266;
      /* border: 1px solid #EBEDF0; */
      background-color: #FAFAFA;
      /* background-color: #FAFAFA; */
      font-size: 28rpx;
      text-indent: 8rpx;
      /* letter-spacing: 1rpx; */
   }
   .icons {
      margin-right: 2% ;
   }
   .big {
      height: 80rpx;
      line-height: 80rpx;