w-front-end / select_good · Commits

Commit f295e829b39abc375f6b65e1b438ab2c17941d90

Authored by zhiyangdu
1 parent d9bf55ae

积分数超过1万显示"万"

Inline Side-by-side
Showing 1 changed file with 107 additions and 88 deletions
src/components/goodsItem_8/goodsItem_8.vue
  View file @f295e82
1 1 <template>
2   - <div class="goods-item-8-box" :class="'style-' + sty" v-if="item" @click="jump(item)">
3   - <div class="main-box">
4   - <div class="left-box">
5   - <div class="img-box">
6   - <img v-lazy="item.simg + SIGN.SMALL" class="simg" />
7   - </div>
8   - <slot name="flag"></slot>
9   - </div>
10   - <div class="content-box">
11   - <div class="top-box">
12   - <div class="title">{{item.title}}</div>
13   - <!-- <div class="sub-title" v-if="sty == '2'">已售出&nbsp;{{item.num}}&nbsp;件</div> -->
14   - <!-- <div class="sub-title" v-else>{{item.ads}}</div> -->
15   - <div class="sub-title" v-if="item.ads && sty != '2'">{{item.ads}}</div>
16   - <div class="icon-stock-is-tight-box" v-if="sty == '1' && item.gift_num <= 10 && item.num == '1' && item.stock != '0'">
17   - <img src="static/img/icon_stock_is_tight.png" class="icon-stock-is-tight-img" />
18   - </div>
19   - </div>
20   - <div class="bottom-box">
21   - <div class="price-box">
  2 + <div class="goods-item-8-box"
  3 + :class="'style-' + sty"
  4 + v-if="item"
  5 + @click="jump(item)">
  6 + <div class="main-box">
  7 + <div class="left-box">
  8 + <div class="img-box">
  9 + <img v-lazy="item.simg + SIGN.SMALL"
  10 + class="simg" />
  11 + </div>
  12 + <slot name="flag"></slot>
  13 + </div>
  14 + <div class="content-box">
  15 + <div class="top-box">
  16 + <div class="title">{{item.title}}</div>
  17 + <!-- <div class="sub-title" v-if="sty == '2'">已售出&nbsp;{{item.num}}&nbsp;件</div> -->
  18 + <!-- <div class="sub-title" v-else>{{item.ads}}</div> -->
  19 + <div class="sub-title"
  20 + v-if="item.ads && sty != '2'">{{item.ads}}</div>
  21 + <div class="icon-stock-is-tight-box"
  22 + v-if="sty == '1' && item.gift_num <= 10 && item.num == '1' && item.stock != '0'">
  23 + <img src="static/img/icon_stock_is_tight.png"
  24 + class="icon-stock-is-tight-img" />
  25 + </div>
  26 + </div>
  27 + <div class="bottom-box">
  28 + <div class="price-box">
22 29 <!-- shop_type==1为积分实物商品展示积分加价格 -->
23   - <div v-if="isIntegral" class="integer">{{item.num}}积分 + &nbsp;</div>
24   - <div v-else class="symbol">¥&nbsp;</div>
25   - <div class="integer">{{item.price}}</div>
  30 + <div v-if="isIntegral"
  31 + class="integer">{{parseInt(item.num)>9999 ? this.formatDecimal((parseInt(item.num) / 10000), 0) + "万" : item.num}}积分 + &nbsp;</div>
  32 + <div v-else
  33 + class="symbol">¥&nbsp;</div>
  34 + <div class="integer">{{item.price}}</div>
26 35 <div class="symbol">元</div>
27   - <div class="decimal"></div>
28   - <div class="prices" v-if="sty && item.prices && parseFloat(item.prices) > 0 && parseFloat(item.prices) > parseFloat(item.price)">¥{{item.prices}}</div>
29   - </div>
30   - <div class="icon-box" @click.stop.prevent="primary(item)">
31   - <img src="static/img/icon_list_arrow_right.png" class="icon-img" v-if="sty == 2" />
32   - <div class="btn btn-disabled" v-else-if="sty == '1' && discountType == '2'">已结束</div>
33   - <div class="btn btn-disabled" v-else-if="sty == '1' && (item.num == '2' || (item.num == '1' && item.stock == '0'))">已抢光</div>
34   -
35   - <!-- 限购几件，不能再加入购物车展示效果，灰度图片 -->
36   - <img src="static/img/icon_shopping_cart.png" class="icon-img" v-else-if="item.stock == '0'" />
37   -
38   - <img src="static/img/icon_shopping_cart_active.png" class="icon-img" v-else />
39   - </div>
40   - </div>
41   - </div>
42   - </div>
43   - </div>
  36 + <div class="decimal"></div>
  37 + <div class="prices"
  38 + v-if="sty && item.prices && parseFloat(item.prices) > 0 && parseFloat(item.prices) > parseFloat(item.price)">¥{{item.prices}}</div>
  39 + </div>
  40 + <div class="icon-box"
  41 + @click.stop.prevent="primary(item)">
  42 + <img src="static/img/icon_list_arrow_right.png"
  43 + class="icon-img"
  44 + v-if="sty == 2" />
  45 + <div class="btn btn-disabled"
  46 + v-else-if="sty == '1' && discountType == '2'">已结束</div>
  47 + <div class="btn btn-disabled"
  48 + v-else-if="sty == '1' && (item.num == '2' || (item.num == '1' && item.stock == '0'))">已抢光</div>
  49 +
  50 + <!-- 限购几件，不能再加入购物车展示效果，灰度图片 -->
  51 + <img src="static/img/icon_shopping_cart.png"
  52 + class="icon-img"
  53 + v-else-if="item.stock == '0'" />
  54 +
  55 + <img src="static/img/icon_shopping_cart_active.png"
  56 + class="icon-img"
  57 + v-else />
  58 + </div>
  59 + </div>
  60 + </div>
  61 + </div>
  62 + </div>
44 63 </template>
45 64  
46 65 <script>
47   - export default {
48   - data: function () {
49   - return {
  66 +export default {
  67 + data: function () {
  68 + return {
50 69  
51   - }
52   - },
53   - props: ["item", "sty", "discountType", "isIntegral"],
54   - computed: {
  70 + }
  71 + },
  72 + props: ["item", "sty", "discountType", "isIntegral"],
  73 + computed: {
55 74  
56   - /**
57   - * 获取输入数字的整数部分
58   - */
59   - getInteger() {
60   - return (number) => {
61   - return parseInt(number);
62   - }
63   - },
  75 + /**
  76 + * 获取输入数字的整数部分
  77 + */
  78 + getInteger () {
  79 + return (number) => {
  80 + return parseInt(number);
  81 + }
  82 + },
64 83  
65   - /**
66   - * 获取输入数字的小数部分
67   - */
68   - getDecimal() {
69   - return (number) => {
  84 + /**
  85 + * 获取输入数字的小数部分
  86 + */
  87 + getDecimal () {
  88 + return (number) => {
70 89  
71   - // 拆分数字
72   - let numberArr = number.toString().split(".");
  90 + // 拆分数字
  91 + let numberArr = number.toString().split(".");
73 92  
74   - // 判断是否有效数部分
75   - if (numberArr.length === 2) {
76   - return numberArr[1];
77   - } else {
78   - return "00";
79   - }
80   - }
81   - }
82   - },
83   - methods: {
  93 + // 判断是否有效数部分
  94 + if (numberArr.length === 2) {
  95 + return numberArr[1];
  96 + } else {
  97 + return "00";
  98 + }
  99 + }
  100 + }
  101 + },
  102 + methods: {
84 103  
85   - /**
86   - * 点击跳转
87   - * @param {object} item [数据对象]
88   - */
89   - jump(item) {
90   - this.$emit("jump", item);
91   - },
  104 + /**
  105 + * 点击跳转
  106 + * @param {object} item [数据对象]
  107 + */
  108 + jump (item) {
  109 + this.$emit("jump", item);
  110 + },
92 111  
93   - /**
94   - * 主按钮点击事件
95   - * @param {object} item [数据对象]
96   - */
97   - primary(item) {
98   - this.$emit("primary", item);
99   - }
100   - }
  112 + /**
  113 + * 主按钮点击事件
  114 + * @param {object} item [数据对象]
  115 + */
  116 + primary (item) {
  117 + this.$emit("primary", item);
101 118 }
  119 + }
  120 +}
102 121 </script>
103 122  
104 123 <!-- Add "scoped" attribute to limit CSS to this component only -->
105 124 <style rel="stylesheet/less" lang="less" scoped>
106   - @import './goodsItem_8';
  125 +@import './goodsItem_8';
107 126 </style>
... ...