From 9316ddc324abfdc877cca0d901e945161d4dde00 Mon Sep 17 00:00:00 2001
From: wanghongjun <1445693971@qq,com>
Date: Thu, 21 Mar 2024 14:30:35 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E6=90=9C=E7=B4=A2=E7=BB=93?=
 =?UTF-8?q?=E6=9E=9C=E9=A1=B5=E9=9D=A2=20=E4=BC=98=E5=8C=96=E6=90=9C?=
 =?UTF-8?q?=E7=B4=A2=E6=A1=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/search/index.vue |  62 +++--
 pages.json                  |   6 +-
 pages/goods/detail.vue      |   2 +-
 pages/goods/list.vue        | 142 ++++-------
 pages/index/index.vue       |   4 +-
 pages/search/index.vue      | 455 ++++++++++++++++++++++++------------
 6 files changed, 411 insertions(+), 260 deletions(-)

diff --git a/components/search/index.vue b/components/search/index.vue
index 3ca0fd0..7506e8d 100644
--- a/components/search/index.vue
+++ b/components/search/index.vue
@@ -1,10 +1,13 @@
 <template>
   <!-- 搜索框 -->
   <view class="search-wrapper">
-    <view class="index-search" @click="onClick">
+    <view class="index-search">
       <view class="index-cont-search t-c">
         <text class="search-icon iconfont icon-search"></text>
-        <text class="search-text">{{ tips }}</text>
+        <text class="search-text">
+          <input type="text" :placeholder="tips" v-model="searchValue">
+        </text>
+        <button class="search-text-bu" @click="onSearch">搜索</button>
       </view>
     </view>
   </view>
@@ -15,25 +18,37 @@
     props: {
       tips: {
         type: String,
-        default: '搜索标的'
+        default: '请输入店铺/标的名称关键字'
       }
     },
     data() {
-      return {}
+      return {
+        searchValue: ''
+      }
     },
 
     methods: {
       onClick() {
         this.$emit('event')
+      },
+
+      onSearch() {
+        this.$navTo('pages/search/index', { searchValue: this.searchValue })
       }
+
     }
   }
 </script>
 
 <style lang="scss" scoped>
   .search-wrapper {
-    background: #fff;
-    padding: 13rpx;
+    background: #1c223b;
+    padding: 0rpx 0rpx 0rpx 0rpx;
+    position: absolute;
+    top: 20rpx;
+    left: 19rpx;
+    width: 95%;
+    border-radius: 50rpx;
   }
 
   .index-search {
@@ -44,8 +59,8 @@
     font-size: 28rpx;
     color: #6d6d6d;
     box-sizing: border-box;
-    height: 64rpx;
-    line-height: 64rpx;
+    height: 74rpx;
+    line-height: 74rpx;
 
     .index-cont-search {
       width: 100%;
@@ -54,15 +69,32 @@
       display: flex;
       justify-content: center;
       align-items: center;
-    }
 
-    .index-cont-search .search-icon {
-      font-size: 28rpx;
-    }
+      .search-icon {
+        font-size: 34rpx;
+        margin-left: 50rpx;
+      }
 
-    .index-cont-search .search-text {
-      margin-left: 14rpx;
-    }
+      .search-text {
+        text-align: left;
+        float: left;
+        margin-left: 20rpx;
+        width: 100%;
 
+        input {
+          font-size: 20rpx;
+        }
+      }
+      .search-text-bu {
+        margin-right: 20rpx;
+        color: #ffffff;
+        background-color: #1c223b;
+        font-size: 20rpx;
+        width: 120rpx;
+        height: 50rpx;
+        text-align: center;
+        border-radius: 50rpx;
+      }
+    }
   }
 </style>
diff --git a/pages.json b/pages.json
index d12d061..676289f 100644
--- a/pages.json
+++ b/pages.json
@@ -63,7 +63,9 @@
     {
       "path": "pages/search/index",
       "style": {
-        "navigationBarTitleText": "标的搜索"
+        "navigationBarTitleText": "搜索结果",
+        "navigationBarTextStyle": "white",
+        "navigationBarBackgroundColor": "#1c223b"
       }
     },
     {
@@ -107,6 +109,8 @@
       "path": "pages/goods/list",
       "style": {
         "navigationBarTitleText": "数据店铺",
+        "navigationBarTextStyle": "white",
+        "navigationBarBackgroundColor": "#1c223b",
         "enablePullDownRefresh": true
       }
     },
diff --git a/pages/goods/detail.vue b/pages/goods/detail.vue
index 39bdcb6..2c65909 100644
--- a/pages/goods/detail.vue
+++ b/pages/goods/detail.vue
@@ -353,7 +353,7 @@
       goteshop(){
         const app = this
         let spname = this.goods.username
-        this.$navTo("pages/goods/goodsDetail?k="+spname+'&dt='+new Date().getTime())
+        this.$navTo("pages/goods/list?k="+spname+'&dt='+new Date().getTime())
       },
       // 转让
       transfer(pass_Num,pricets) {
diff --git a/pages/goods/list.vue b/pages/goods/list.vue
index e7e4172..866472a 100644
--- a/pages/goods/list.vue
+++ b/pages/goods/list.vue
@@ -2,21 +2,15 @@
   <mescroll-body ref="mescrollRef" :sticky="true" @init="mescrollInit" :down="{ native: true }" @down="downCallback" :up="upOption" @up="upCallback">
     <!-- 页面头部 -->
     <!-- 搜索 -->
-    <view class="sozone">
-      <view class="sovue">
-        <view class="search-wrapper">
-          <view class="search-input">
-            <view class="search-input-wrapper">
-              <view class="left">
-                <text class="search-icon iconfont icon-search"></text>
-              </view>
-              <view class="right">
-                <input v-model="searchValue" class="input" focus="true" placeholder="请输入搜索关键词" type="text">
-              </view>
-            </view>
-          </view>
-          <view class="search-button">
-            <view class="button" @click="onSearch">搜索</view>
+    <view class="search">
+      <view class="search-wrapper">
+        <view class="index-search">
+          <view class="index-cont-search t-c">
+            <text class="search-icon iconfont icon-search"></text>
+            <text class="search-text">
+              <input type="text" placeholder="请输入关键字" v-model="searchValue">
+            </text>
+            <button class="search-text-bu" @click="onSearch">搜索</button>
           </view>
         </view>
       </view>
@@ -263,22 +257,6 @@
         this.$navTo('pages/goods/detail', { gislicode })
       },
 
-      /**
-       * 商品搜索
-       */
-      handleSearch() {
-        const searchPageUrl = 'pages/search/index'
-        // 判断来源页面
-        let pages = getCurrentPages()
-        if (pages.length > 1 &&
-          pages[pages.length - 2].route === searchPageUrl) {
-          uni.navigateBack()
-          return
-        }
-        // 跳转到商品搜索页
-        this.$navTo(searchPageUrl)
-      }
-
     },
 
   }
@@ -287,79 +265,59 @@
 <style lang="scss" scoped>
 
   // 搜索
-  .sozone{
-    position: relative;
-    z-index: 70;
-
-    .sovue{
-      position: absolute;
-      top: -100rpx;
-      left: 4rpx;
-      width: 100%;
-    }
+  .search {
+    position: fixed;
+    float: top;
+    top: var(--window-top);
+    left: var(--window-left);
+    right: var(--window-right);
+    z-index: 19;
 
     .search-wrapper {
-      display: flex;
-      height: 84rpx;
+      background: #1c223b;
+      padding: 0rpx 20rpx 20rpx 20rpx;
     }
 
-    // 搜索输入框
-    .search-input {
-      width: 80%;
+    .index-search {
+      border-bottom: 0;
       background: #fff;
-      border-radius: 10rpx 0 0 10rpx;
-      box-sizing: border-box;
+      border-radius: 50rpx;
       overflow: hidden;
-
-      .search-input-wrapper {
-        display: flex;
-
-        .left {
-          display: flex;
-          width: 60rpx;
-          justify-content: center;
-          align-items: center;
-
-          .search-icon {
-            display: block;
-            color: #b4b4b4;
-            font-size: 28rpx;
-          }
-
-        }
-
-        .right {
-          flex: 1;
-
-          input {
-            font-size: 28rpx;
-            height: 84rpx;
-            display: flex;
-            align-items: center;
-
-            .input-placeholder {
-              color: #aba9a9;
-            }
-          }
-
-        }
-      }
-    }
-
-    // 搜索按钮
-    .search-button {
-      width: 20%;
+      font-size: 28rpx;
+      color: #6d6d6d;
       box-sizing: border-box;
+      height: 64rpx;
+      line-height: 64rpx;
 
-      .button {
-        height: 84rpx;
+      .index-cont-search {
+        width: 100%;
         font-size: 28rpx;
-        border-radius: 0 10rpx 10rpx 0;
-        background: #4399ff;
-        color: #fff;
+        background: #f7f7f7;
         display: flex;
         justify-content: center;
         align-items: center;
+
+        .search-icon {
+          font-size: 34rpx;
+          margin-left: 50rpx;
+        }
+
+        .search-text {
+          text-align: left;
+          float: left;
+          font-size: 20rpx;
+          margin-left: 20rpx;
+        }
+        .search-text-bu {
+          margin-right: 20rpx;
+          color: #ffffff;
+          background-color: #1c223b;
+          font-size: 20rpx;
+          width: 120rpx;
+          height: 50rpx;
+          text-align: center;
+          border-radius: 50rpx;
+        }
       }
     }
   }
diff --git a/pages/index/index.vue b/pages/index/index.vue
index cbee319..3b2c22e 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -2,7 +2,7 @@
   <view class="container">
 	  <!-- 搜索 -->
 	  <view class="sozone">
-	  	<Search/>
+      <search class="search" tips="请输入店铺/标的名称关键字"/>
 	  </view>
 	  <!-- 轮播图 -->
 	  <view class="lbzone">
@@ -73,7 +73,7 @@
 
 <script>
   import Banner from './components/banner'
-  import Search from './components/search'
+  import Search from '@/components/search'
   import * as Api from '@/api/page'
   import * as Gapi from '@/api/goods'
   // 滚动加载
diff --git a/pages/search/index.vue b/pages/search/index.vue
index 6ec900f..16ddbfe 100644
--- a/pages/search/index.vue
+++ b/pages/search/index.vue
@@ -1,43 +1,101 @@
 <template>
-  <view class="container">
-    <view class="search-wrapper">
-      <view class="search-input">
-        <view class="search-input-wrapper">
-          <view class="left">
+  <mescroll-body ref="mescrollRef" :sticky="true" @init="mescrollInit" :down="{ native: true }" @down="downCallback" :up="upOption" @up="upCallback">
+    <view class="search">
+      <view class="search-wrapper">
+        <view class="index-search">
+          <view class="index-cont-search t-c">
             <text class="search-icon iconfont icon-search"></text>
-          </view>
-          <view class="right">
-            <input v-model="searchValue" class="input" focus="true" placeholder="请输入您搜索的商品" type="text"></input>
+            <text class="search-text">
+              <input type="text" placeholder="请输入关键字" v-model="searchValue">
+            </text>
+            <button class="search-text-bu" @click="onSearch">搜索</button>
           </view>
         </view>
       </view>
-      <view class="search-button">
-        <view class="button" @click="onSearch">搜索</view>
-      </view>
     </view>
-    <view class="history" v-if="historySearch.length">
-      <view class="his-head">
-        <text class="title">最近搜索</text>
-        <text class="icon iconfont icon-delete" @click="clearSearch"></text>
+    <view class="item-title-tab">
+      <view class="item-title b-f" v-for="items in tab" @click="changeTab(items.key)">
+        <text :class="{'item-title-text': tabKey === items.key}">{{items.title}}</text>
       </view>
-      <view class="his-list">
-        <view class="his-item" v-for="(val, index) in historySearch" :key="index">
-          <view class="history-button" @click="handleQuick(val)">{{ val }}</view>
+    </view>
+    <view class="goods-list clearfix">
+      <view class="goods-item" v-for="(item, index) in list.data" :key="index" @click="onTargetDetail(item.goods_islicode)">
+        <!-- 单列显示 -->
+        <view class="dis-flex">
+          <!-- 图片 -->
+          <view class="goods-item_left">
+            <image class="image" :src="item.gdimg"></image>
+          </view>
+          <view class="goods-item_right">
+            <!-- 名称 -->
+            <view class="goods-name">
+              <text class="twoline-hide">{{ item.goods_name }}</text>
+            </view>
+            <view class="goods-item_desc">
+              <!-- 权益 -->
+              <view class="desc-selling_point dis-flex">
+                <text class="oneline-hide">{{ item.goods_ownership_str }}</text>
+              </view>
+              <!-- 用户 -->
+              <view class="desc-selling_point dis-flex">
+                <text class="oneline-hide">{{ item.username }}</text>
+              </view>
+              <!-- 销量 -->
+              <view class="desc-goods_sales dis-flex">
+                <text>销量：{{ item.sale_count }}</text>
+              </view>
+              <!-- 价格 -->
+              <view class="desc_footer">
+                <text class="price_x">¥{{ item.price }}</text>
+              </view>
+            </view>
+          </view>
         </view>
       </view>
     </view>
-    <!-- </view> -->
-  </view>
+  </mescroll-body>
 </template>
 
 <script>
-  const HISTORY_SEARCH = 'historySearch'
+  import MescrollBody from '@/components/mescroll-uni/mescroll-body.vue'
+  import MescrollMixin from '@/components/mescroll-uni/mescroll-mixins'
+  import * as GoodsApi from '@/api/goods'
+  import { getEmptyPaginateObj, getMoreListData } from '@/core/app'
+  //解压缩
+  import pako from '@/core/pako'
+  import { base64ToUint8Array,numberWithCommas} from '@/utils/util'
+
+  const pageSize = 2
 
   export default {
+    components: {
+      MescrollBody,
+    },
+    mixins: [MescrollMixin],
     data() {
       return {
-        historySearch: [],
-        searchValue: ''
+        searchValue: '',
+        // 上拉加载配置
+        upOption: {
+          // 首次自动执行
+          auto: true,
+          // 每页数据的数量; 默认10
+          page: { size: pageSize },
+          // 数量要大于4条才显示无更多数据
+          noMoreSize: 4,
+        },
+        tab: [
+          {
+            key: 1,
+            title: '标的',
+          },
+          {
+            key: 2,
+            title: '店铺',
+          },
+        ],
+        tabKey: 1,
+        list: getEmptyPaginateObj(), // 商品列表数据
       }
     },
 
@@ -45,183 +103,282 @@
      * 生命周期函数--监听页面加载
      */
     onLoad(options) {
-      // 获取历史搜索
-      this.historySearch = this.getHistorySearch()
+      // 记录商品ID
+      this.searchValue = options.searchValue
     },
 
     methods: {
-
-      /**
-       * 获取历史搜索
-       */
-      getHistorySearch() {
-        return uni.getStorageSync(HISTORY_SEARCH) || []
-      },
-
       /**
        * 搜索提交
        */
-      onSearch() {
-        const { searchValue } = this
-        if (searchValue) {
-          // 记录历史搜索
-          this.setHistory(searchValue)
-          // 跳转到商品列表页
-          this.$navTo('pages/goods/list', { search: searchValue })
+      async onSearch() {
+        if (this.searchValue == '') {
+          this.$error('请输入搜索关键词');
+        } else {
+          await this.getGoodsList()
+          await this.getHomeListImage()
         }
       },
-
-      /**
-       * 记录历史搜索
-       */
-      setHistory(searchValue) {
-        const data = this.getHistorySearch()
-        const index = data.indexOf(searchValue)
-        index > -1 && data.splice(index, 1)
-        data.unshift(searchValue)
-        this.historySearch = data
-        this.onUpdateStorage()
+      // 切换tab
+      async changeTab(val) {
+        this.tabKey = val
+        await this.getGoodsList()
+        await this.getHomeListImage()
       },
-
       /**
-       * 清空最近搜索记录
+       * 上拉加载的回调 (页面初始化时也会执行一次)
+       * 其中page.num:当前页 从1开始, page.size:每页数据条数,默认10
+       * @param {Object} page
        */
-      clearSearch() {
-        this.historySearch = []
-        this.onUpdateStorage()
+      async upCallback(page = 1) {
+        const app = this
+        // 设置列表数据
+        await app.getGoodsList(page.num)
+            .then(list => {
+              const curPageLen = list.data.length
+              const totalSize = list.data.total
+              app.mescroll.endBySize(curPageLen, totalSize)
+            })
+            .catch(() => app.mescroll.endErr())
+        // 标的列表
+        await app.getHomeListImage()
       },
 
       /**
-       * 更新历史搜索缓存
-       * @param {Object} data
+       * 获取标的列表
+       * @param {number} pageNo 页码
        */
-      onUpdateStorage(data) {
-        uni.setStorageSync(HISTORY_SEARCH, this.historySearch)
+      getGoodsList(pageNo = 1) {
+        const app = this
+        const param = {
+          authorization: '',
+          entrust_name: '',
+          entrust_user_name: app.options.k,
+          goods_status: '1',
+          limit: pageSize,
+          order: 'desc',
+          order_type: '',
+          page: pageNo,
+          record_type: '',
+          source_type: '',
+        }
+        if (app.searchValue != '') {
+          if (app.tabKey === 1) {
+            param.goods_name = app.searchValue
+          } else if (app.tabKey === 2) {
+            param.entrust_user_name = app.searchValue
+          }
+        }
+        return new Promise((resolve, reject) => {
+          GoodsApi.nbgoods(param)
+              .then(result => {
+                // 合并新数据
+                const newList = app.initList(result.data)
+                app.list.data = getMoreListData(newList, app.list, pageNo)
+                app.userList = newList.data[0].user
+                app.userList.stateStr = this.getUserStateStr(app.userList.state)
+                app.userList.user_islicode = newList.data[0].user_islicode
+                resolve(newList)
+              })
+              .catch(reject)
+        })
+      },
+      getUserStateStr(state){
+        let str = ''
+        if (state == "1" || state == "3" || state == "7" || state == "0") {
+          str = '认证中'
+        } else if (state == "2" || state == "4" || state == "5") {
+          str = '认证失败'
+        } else if (state == "6") {
+          str = '认证成功'
+        }
+        return str
+      },
+      // 初始化订单列表数据
+      initList(newList) {
+        newList.data.forEach(item => {
+          // 处理价格表现形式
+          item.price = numberWithCommas(item.price)
+          item.gdimg = item.goods_image === "" ? '' : pako.inflateRaw(base64ToUint8Array(item.goods_image), {to: 'string'})
+        })
+        return newList
+      },
+      async getHomeListImage() {
+        this.list.data.forEach((item, key) => {
+          if (item.goods_image === "") {
+            GoodsApi.nbgoodsImage({"id": item.id}).then(res2 => {
+              if (res2.code === 200) {
+                this.list.data[key].goods_image = res2.data.data[0].goods_image;
+                this.list.data[key].gdimg = pako.inflateRaw(base64ToUint8Array(res2.data.data[0].goods_image), {to: 'string'})
+              }
+            })
+          }
+        })
+      },
+      // 跳转商品详情页
+      onTargetDetail(gislicode) {
+        this.$navTo('pages/goods/detail', { gislicode })
       },
-
-      /**
-       * 跳转到最近搜索
-       */
-      handleQuick(search) {
-        this.$navTo('pages/goods/list', { search })
-      }
-
     }
   }
 </script>
 
 <style lang="scss" scoped>
-  .container {
-    padding: 20rpx;
-    min-height: 100vh;
-    background: #f7f7f7;
-  }
 
-  .search-wrapper {
-    display: flex;
-    height: 64rpx;
-  }
-
-  // 搜索输入框
-  .search-input {
-    width: 80%;
-    background: #fff;
-    border-radius: 10rpx 0 0 10rpx;
-    box-sizing: border-box;
-    overflow: hidden;
+  .search {
+    position: fixed;
+    float: top;
+    top: var(--window-top);
+    left: var(--window-left);
+    right: var(--window-right);
+    z-index: 19;
+
+    .search-wrapper {
+      background: #1c223b;
+      padding: 0rpx 20rpx 20rpx 20rpx;
+    }
 
-    .search-input-wrapper {
-      display: flex;
+    .index-search {
+      border-bottom: 0;
+      background: #fff;
+      border-radius: 50rpx;
+      overflow: hidden;
+      font-size: 28rpx;
+      color: #6d6d6d;
+      box-sizing: border-box;
+      height: 64rpx;
+      line-height: 64rpx;
 
-      .left {
+      .index-cont-search {
+        width: 100%;
+        font-size: 28rpx;
+        background: #f7f7f7;
         display: flex;
-        width: 60rpx;
         justify-content: center;
         align-items: center;
 
         .search-icon {
-          display: block;
-          color: #b4b4b4;
-          font-size: 28rpx;
+          font-size: 34rpx;
+          margin-left: 50rpx;
         }
 
-      }
-
-      .right {
-        flex: 1;
-
-        input {
-          font-size: 28rpx;
-          height: 64rpx;
-          display: flex;
-          align-items: center;
-
-          .input-placeholder {
-            color: #aba9a9;
-          }
+        .search-text {
+          text-align: left;
+          float: left;
+          font-size: 20rpx;
+          margin-left: 20rpx;
+        }
+        .search-text-bu {
+          margin-right: 20rpx;
+          color: #ffffff;
+          background-color: #1c223b;
+          font-size: 20rpx;
+          width: 120rpx;
+          height: 50rpx;
+          text-align: center;
+          border-radius: 50rpx;
         }
-
       }
     }
   }
 
-  // 搜索按钮
-  .search-button {
-    width: 20%;
-    box-sizing: border-box;
-
-    .button {
-      height: 64rpx;
-      font-size: 28rpx;
-      border-radius: 0 10rpx 10rpx 0;
-      background: #fa2209;
-      color: #fff;
-      display: flex;
-      justify-content: center;
-      align-items: center;
+  .item-title-tab {
+    width: 100%;
+    margin-top: 80rpx;
+    .item-title{
+      width: 20%;
+      background-color: #f7f7f7;
+      padding: 26rpx 26rpx 0rpx 26rpx;
+      font-size: 36rpx;
+      font-weight: 600;
+      display: inline-block;
+      text-align: left;
+      .item-title-text {
+        border-bottom: #000000 solid 4rpx;
+      }
     }
   }
 
+  // 单列显示
+  .goods-list {
+    width: 100%;
+    margin-top: 20rpx;
+    .goods-item {
+      width: 97%;
+      height: 280rpx;
+      margin-bottom: 12rpx;
+      margin-left: 12rpx;
+      padding: 20rpx;
+      box-sizing: border-box;
+      background: #fff;
+      line-height: 1.6;
+      border-radius: 10rpx;
+
+      &:last-child {
+        margin-bottom: 0;
+      }
+    }
 
-  // 最近搜索
-  .history {
+    .goods-item_left {
+      display: flex;
+      width: 300rpx;
+      background: #fff;
+      align-items: center;
 
-    .his-head {
-      font-size: 28rpx;
-      padding: 50rpx 0 0 0;
-      color: #777;
+      .image {
+        display: block;
+        width: 240rpx;
+        height: 240rpx;
+      }
+    }
 
-      .icon {
-        float: right;
+    .goods-item_right {
+      position: relative;
+      // width: 450rpx;
+      flex: 1;
+
+      .goods-name {
+        margin-top: 10rpx;
+        min-height: 68rpx;
+        line-height: 1.3;
+        white-space: normal;
+        color: #484848;
+        font-size: 26rpx;
+        font-weight: bold;
       }
+    }
 
+    .goods-item_desc {
+      margin-top: 8rpx;
     }
 
-    .his-list {
-      padding: 20rpx 0;
-      overflow: hidden;
+    .desc-selling_point {
+      width: 400rpx;
+      font-size: 28rpx;
+      color: #e49a3d;
+    }
 
-      .his-item {
-        width: 33.3%;
-        float: left;
-        padding: 10rpx;
-        box-sizing: border-box;
+    .desc-goods_sales {
+      color: #999;
+      font-size: 24rpx;
+    }
 
-        .history-button {
-          text-align: center;
-          padding: 14rpx;
-          line-height: 30rpx;
-          border-radius: 100rpx;
-          background: #fff;
-          font-size: 26rpx;
-          border: 1rpx solid #efefef;
-          overflow: hidden;
-          white-space: nowrap;
-          text-overflow: ellipsis;
-        }
+    .desc_footer {
+      font-size: 24rpx;
 
+      .price_x {
+        margin-right: 16rpx;
+        color: #f03c3c;
+        font-size: 30rpx;
+        font-weight: bold;
+        float: right;
+        margin-top: 40rpx;
       }
 
+      .price_y {
+        text-decoration: line-through;
+      }
     }
   }
+
 </style>