Merge branch 'master' of git.huaml.com:zhh/front-end

mallApp/src/components/app-delivery.vue

@@ -47,30 +47,26 @@
       </tui-list-cell>
     </div>
 
-    <div class="module-com gift-wrap input-line-wrap">
+    <div class="module-com">
 
-      <tui-list-cell class="line-cell" :hover="false" v-show="showCardInfo">
+      <tui-list-cell class="line-cell" :hover="false">
         <div class="tui-title">贺卡内容</div>
-        <input v-model="form.cardInfo" placeholder-class="phcolor" placeholder-style="color:#ccc" class="tui-input" name="cardInfo" style="width:100%;" placeholder="请填写" />
+        <textarea v-model="form.cardInfo" placeholder-class="phcolor" placeholder-style="color:#ccc" class="tui-input textarea-input" name="cardInfo" placeholder="请填写" :adjust-position="false" :cursor-spacing="0" :auto-height="false" :disable-default-padding="true" :show-confirm-bar="false" />
 
       </tui-list-cell>
 
       <tui-list-cell class="line-cell" :hover="false">
-        <div class="none-name-delivery flex-center" style="padding-left:0upx;">
-          <div class="tui-title">匿名派送</div>
-            <checkbox-group @change="anonymityChange">
-                <checkbox class="ljd-checkbox" value="1" id="noneNameText" ></checkbox>
-                <label for="noneNameText" class="none-name-text">需要请勾选</label>
-            </checkbox-group>
+        <div class="tui-title">派送方式</div>
+        <div class="delivery-mode-wrapper">
+          <switch :checked="form.anonymity == 1" @change="anonymityChange" color="#ff6b35" />
+          <span v-if="form.anonymity == 0" class="mode-text normal">不匿名</span>
+          <span v-else class="mode-text anonymous">要匿名</span>
         </div>
       </tui-list-cell>
-      <!-- </block> -->
-    </div>
-    <!-- 备注 -->
-    <div class="module-com remark-wrap">
+
       <tui-list-cell class="line-cell" :hover="false">
         <div class="tui-title">备注内容</div>
-        <input v-model="form.remark" placeholder-class="phcolor" placeholder-style="color:#ccc" class="tui-input" name="remark" placeholder="选填，不需要贺卡这里备注" />
+        <textarea v-model="form.remark" placeholder-class="phcolor" placeholder-style="color:#ccc" class="tui-input textarea-input" name="remark" placeholder="选填，不要贺卡这里备注" :adjust-position="false" :cursor-spacing="0" :auto-height="false" :disable-default-padding="true" :show-confirm-bar="false" />
       </tui-list-cell>
     </div>
     <!-- 省市联动 -->
@@ -105,7 +101,6 @@ export default {
     return {
       region: [],
       showRegion: false,
-      showCardInfo:true,
       form: {
         receiveUserName: "", // 收花人姓名；到店自提的姓名
         receiveMobile: "", // 收花人手机；到店自提的电话；
@@ -181,7 +176,7 @@ export default {
       this.$emit("countFreight")
     },
     anonymityChange(e) {
-      this.form.anonymity = e.detail.value == 1 ? 1 : 0;
+      this.form.anonymity = e.detail.value ? 1 : 0;
     },
     // 省市联动
     openAddres() {
@@ -255,17 +250,91 @@ export default {
     }
   }
 
-  // 匿名派送
-  .none-name-delivery {
-    // padding-left: 30upx;
-    // padding: 26upx 30upx;
-    // margin-top: 40upx;
-    margin-bottom: 20upx;
-    background-color: #fff;
-    .none-name-text {
-      margin-left: 14upx;
-      color: $fontColor2;
+  // 派送方式选择器样式
+  .delivery-mode-wrapper {
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+    
+    .mode-text {
+      font-size: 40upx;
+      margin-left: 10upx;
+      transition: color 0.3s ease;
+      &.normal {
+        // 不匿名 - 使用页面常规颜色
+        color: #666666;
+      }
+      
+      &.anonymous {
+        // 匿名 - 使用显眼颜色
+        color: #ff6b35;
+        font-weight: bold;
+      }
     }
+    
+    switch {
+      transform: scale(0.8);
+    }
+  }
+
+  // textarea样式 - 彻底解决input文字浮动问题
+  .textarea-input {
+    /* 重置textarea默认样式，使其表现像input */
+    resize: none !important;
+    overflow: hidden !important;
+    border: none !important;
+    outline: none !important;
+    background: transparent !important;
+    padding: 0 !important;
+    margin: 0 !important;
+    
+    /* 固定高度和行高，防止浮动 */
+    height: 44upx !important;
+    max-height: 44upx !important;
+    min-height: 44upx !important;
+    line-height: 44upx !important;
+    
+    /* 字体样式保持一致 */
+    font-size: 28upx !important;
+    font-family: inherit !important;
+    color: inherit !important;
+    
+    /* 文字单行显示，模拟input行为 */
+    white-space: nowrap !important;
+    text-overflow: ellipsis !important;
+    word-wrap: normal !important;
+    word-break: keep-all !important;
+    
+    /* 垂直对齐 */
+    vertical-align: middle !important;
+    text-align: left !important;
+    
+    /* 微信小程序特殊处理 */
+    /* #ifdef MP-WEIXIN */
+    /* 禁用textarea的多行特性 */
+    overflow-y: hidden !important;
+    scrollbar-width: none !important;
+    /* 固定位置，防止键盘影响 */
+    position: relative !important;
+    z-index: 1 !important;
+    /* 禁用文字大小自动调整 */
+    -webkit-text-size-adjust: none !important;
+    text-size-adjust: none !important;
+    /* 强制使用系统字体 */
+    font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, sans-serif !important;
+    /* #endif */
+    
+    /* H5环境优化 */
+    /* #ifdef H5 */
+    box-sizing: border-box !important;
+    -webkit-appearance: none !important;
+    appearance: none !important;
+    /* #endif */
+    
+    /* APP环境优化 */
+    /* #ifdef APP-PLUS */
+    box-sizing: border-box !important;
+    /* #endif */
   }
 }
 </style>