Преглед изворни кода

优化:修改文字超出隐藏class

Martin пре 5 година
родитељ
комит
a42c99ed79

+ 2 - 2
components/page/article/index.vue

@@ -6,7 +6,7 @@
       <!-- 小图模式 -->
       <block v-if="item.show_type == 10">
         <view class="article-item__left flex-box">
-          <view class="article-item__title twolist-hidden">
+          <view class="article-item__title twoline-hide">
             <text>{{ item.title }}</text>
           </view>
           <view class="article-item__footer m-top10">
@@ -19,7 +19,7 @@
       </block>
       <!-- 大图模式 -->
       <block v-if="item.show_type == 20">
-        <view class="article-item__title twolist-hidden">
+        <view class="article-item__title twoline-hide">
           <text>{{ item.title }}</text>
         </view>
         <view class="article-item__image m-top20">

+ 4 - 4
components/page/goods/index.vue

@@ -14,13 +14,13 @@
               </view>
               <view class="goods-item_right">
                 <!-- 商品名称 -->
-                <view v-if="itemStyle.show.includes('goodsName')" class="goods-name twolist-hidden">
+                <view v-if="itemStyle.show.includes('goodsName')" class="goods-name twoline-hide">
                   <text>{{ dataItem.goods_name }}</text>
                 </view>
                 <view class="goods-item_desc">
                   <!-- 商品卖点 -->
                   <view v-if="itemStyle.show.includes('sellingPoint')" class="desc-selling_point dis-flex">
-                    <text class="onelist-hidden">{{ dataItem.selling_point }}</text>
+                    <text class="oneline-hide">{{ dataItem.selling_point }}</text>
                   </view>
                   <!-- 商品销量 -->
                   <view v-if="itemStyle.show.includes('goodsSales')" class="desc-goods_sales dis-flex">
@@ -43,11 +43,11 @@
             </view>
             <view class="detail">
               <!-- 商品标题 -->
-              <view v-if="itemStyle.show.includes('goodsName')" class="goods-name twolist-hidden">
+              <view v-if="itemStyle.show.includes('goodsName')" class="goods-name twoline-hide">
                 {{ dataItem.goods_name }}
               </view>
               <!-- 商品价格 -->
-              <view class="detail-price onelist-hidden">
+              <view class="detail-price oneline-hide">
                 <text v-if="itemStyle.show.includes('goodsPrice')" class="goods-price f-30 col-m">¥{{ dataItem.goods_price_min }}</text>
                 <text v-if="itemStyle.show.includes('linePrice') && dataItem.line_price_min > 0" class="line-price col-9 f-24">¥{{ dataItem.line_price_min }}</text>
               </view>

+ 1 - 1
components/page/navBar/index.vue

@@ -7,7 +7,7 @@
           <view class="item-image">
             <image class="image" mode="widthFix" :src="dataItem.imgUrl"></image>
           </view>
-          <view class="item-text onelist-hidden">{{ dataItem.text }}</view>
+          <view class="item-text oneline-hide">{{ dataItem.text }}</view>
         </view>
       </view>
     </view>

+ 1 - 1
components/select-region/select-region.vue

@@ -4,7 +4,7 @@
       <u-loading mode="circle"></u-loading>
     </view>
     <view v-else class="field-body" @click="handleSelect()">
-      <view class="field-value onelist-hidden">{{ valueText ? valueText: placeholder }}</view>
+      <view class="field-value oneline-hide">{{ valueText ? valueText: placeholder }}</view>
     </view>
     <u-select v-model="show" mode="mutil-column-auto" :list="options" :default-value="defaultValue" @confirm="onConfirm"></u-select>
   </view>

+ 2 - 2
pages/article/index.vue

@@ -23,7 +23,7 @@
         <!-- 小图模式 -->
         <block v-if="item.show_type == 10">
           <view class="article-item__left flex-box">
-            <view class="article-item__title twolist-hidden">
+            <view class="article-item__title twoline-hide">
               <text>{{ item.title }}</text>
             </view>
             <view class="article-item__footer m-top10">
@@ -36,7 +36,7 @@
         </block>
         <!-- 大图模式 -->
         <block v-if="item.show_type == 20">
-          <view class="article-item__title twolist-hidden">
+          <view class="article-item__title twoline-hide">
             <text>{{ item.title }}</text>
           </view>
           <view class="article-item__image m-top20">

+ 1 - 1
pages/cart/index.vue

@@ -27,7 +27,7 @@
           <image class="image" :src="item.goods.goods_image" mode="scaleToFill"></image>
         </view>
         <view class="item-content">
-          <view class="goods-title twolist-hidden"><text>{{ item.goods.goods_name }}</text></view>
+          <view class="goods-title twoline-hide"><text>{{ item.goods.goods_name }}</text></view>
           <view class="goods-props clearfix">
             <view class="goods-props-item" v-for="(props, idx) in item.goods.skuInfo.goods_props" :key="idx">
               <text>{{ props.value.name }}</text>

+ 1 - 1
pages/checkout/index.vue

@@ -40,7 +40,7 @@
           </view>
           <view class="flow-list-right flex-box">
             <!-- 商品名称 -->
-            <text class="goods-name twolist-hidden">{{ item.goods_name }}</text>
+            <text class="goods-name twoline-hide">{{ item.goods_name }}</text>
             <!-- 商品规格 -->
             <view class="goods-props clearfix">
               <view class="goods-props-item" v-for="(props, idx) in item.skuInfo.goods_props" :key="idx">

+ 1 - 1
pages/coupon/index.vue

@@ -15,7 +15,7 @@
           </view>
           <view class="split-line"></view>
           <view class="content dis-flex flex-dir-column flex-x-between">
-            <view class="title onelist-hidden">{{ item.name }}</view>
+            <view class="title oneline-hide">{{ item.name }}</view>
             <view class="bottom dis-flex flex-y-center">
               <view class="time flex-box">
                 <text v-if="item.expire_type == 10">领取{{ item.expire_day }}天内有效</text>

+ 1 - 1
pages/goods/components/Comment.vue

@@ -24,7 +24,7 @@
           </view>
         </view>
         <view class="item-content m-top20">
-          <text class="f-26 twolist-hidden">{{ item.content }}</text>
+          <text class="f-26 twoline-hide">{{ item.content }}</text>
         </view>
         <view class="comment-time">{{ item.create_time }}</view>
       </view>

+ 1 - 1
pages/goods/detail.vue

@@ -24,7 +24,7 @@
       <!-- 标题、分享 -->
       <view class="info-item info-item__name dis-flex flex-y-center">
         <view class="goods-name flex-box">
-          <text class="twolist-hidden">{{ goods.goods_name }}</text>
+          <text class="twoline-hide">{{ goods.goods_name }}</text>
         </view>
         <!-- #ifdef MP-WEIXIN -->
         <view class="goods-share__line"></view>

+ 4 - 4
pages/goods/list.vue

@@ -42,13 +42,13 @@
           </view>
           <view class="goods-item_right">
             <!-- 商品名称 -->
-            <view class="goods-name twolist-hidden">
+            <view class="goods-name twoline-hide">
               <text>{{ item.goods_name }}</text>
             </view>
             <view class="goods-item_desc">
               <!-- 商品卖点 -->
               <view class="desc-selling_point dis-flex">
-                <text class="onelist-hidden">{{ item.selling_point }}</text>
+                <text class="oneline-hide">{{ item.selling_point }}</text>
               </view>
               <!-- 商品销量 -->
               <view class="desc-goods_sales dis-flex">
@@ -70,11 +70,11 @@
           </view>
           <view class="detail">
             <!-- 商品标题 -->
-            <view class="goods-name twolist-hidden">
+            <view class="goods-name twoline-hide">
               {{ item.goods_name }}
             </view>
             <!-- 商品价格 -->
-            <view class="detail-price onelist-hidden">
+            <view class="detail-price oneline-hide">
               <text class="goods-price f-30 col-m">¥{{ item.goods_price_min }}</text>
               <text v-if="item.line_price_min > 0" class="line-price col-9 f-24">¥{{ item.line_price_min }}</text>
             </view>

+ 1 - 1
pages/order/comment/index.vue

@@ -10,7 +10,7 @@
           </view>
           <!-- 商品信息 -->
           <view class="goods-content">
-            <view class="goods-title twolist-hidden"><text>{{ item.goods_name }}</text></view>
+            <view class="goods-title twoline-hide"><text>{{ item.goods_name }}</text></view>
             <view class="goods-props clearfix">
               <view class="goods-props-item" v-for="(props, idx) in item.goods_props" :key="idx">
                 <text>{{ props.value.name }}</text>

+ 1 - 1
pages/order/detail.vue

@@ -91,7 +91,7 @@
           </view>
           <!-- 商品信息 -->
           <view class="goods-content">
-            <view class="goods-title twolist-hidden"><text>{{ goods.goods_name }}</text></view>
+            <view class="goods-title twoline-hide"><text>{{ goods.goods_name }}</text></view>
             <view class="goods-props clearfix">
               <view class="goods-props-item" v-for="(props, idx) in goods.goods_props" :key="idx">
                 <text>{{ props.value.name }}</text>

+ 1 - 1
pages/order/index.vue

@@ -27,7 +27,7 @@
               </view>
               <!-- 商品信息 -->
               <view class="goods-content">
-                <view class="goods-title twolist-hidden"><text>{{ goods.goods_name }}</text></view>
+                <view class="goods-title twoline-hide"><text>{{ goods.goods_name }}</text></view>
                 <view class="goods-props clearfix">
                   <view class="goods-props-item" v-for="(props, idx) in goods.goods_props" :key="idx">
                     <text>{{ props.value.name }}</text>

+ 1 - 1
pages/refund/apply.vue

@@ -8,7 +8,7 @@
       </view>
       <view class="right dis-flex flex-box flex-dir-column flex-x-around">
         <view class="goods-name">
-          <text class="twolist-hidden">{{ goods.goods_name }}</text>
+          <text class="twoline-hide">{{ goods.goods_name }}</text>
         </view>
         <view class="dis-flex col-9 f-24">
           <view class="flex-box">

+ 1 - 1
pages/refund/detail.vue

@@ -18,7 +18,7 @@
       </view>
       <view class="right dis-flex flex-box flex-dir-column flex-x-around">
         <view class="goods-name">
-          <text class="twolist-hidden">{{ detail.orderGoods.goods_name }}</text>
+          <text class="twoline-hide">{{ detail.orderGoods.goods_name }}</text>
         </view>
         <view class="dis-flex col-9 f-24">
           <view class="flex-box">

+ 1 - 1
pages/refund/index.vue

@@ -22,7 +22,7 @@
             </view>
             <view class="goods-right flex-box">
               <view class="goods-name">
-                <text class="twolist-hidden">{{ item.orderGoods.goods_name }}</text>
+                <text class="twoline-hide">{{ item.orderGoods.goods_name }}</text>
               </view>
               <view class="goods-props clearfix">
                 <view class="goods-props-item" v-for="(props, idx) in item.orderGoods.goods_props" :key="idx">

+ 2 - 2
utils/utils.scss

@@ -283,13 +283,13 @@
   padding-bottom: 112rpx;
 }
 
-.onelist-hidden {
+.oneline-hide {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
 
-.twolist-hidden {
+.twoline-hide {
   display: -webkit-box;
   word-break: break-all;
   text-overflow: ellipsis;