产品详情页添加输入错误提示

components/store/CommodityInfo.vue

@@ -65,9 +65,9 @@
                 <div :class="fragment.canSub ? ' input-group-addon operate':'input-group-addon'" @click="fragment.canSub ?subNum():''" :style="!fragment.canSub ?'cursor: not-allowed;':''">-</div>
                 <input type="text" class="form-control" placeholder="数量" v-model="fragment.num" @change="inputNum()"style="padding: 0;min-width: 100px;text-align: center;"/>
                 <div :class="fragment.canAdd ?'input-group-addon operate':'input-group-addon'" @click="fragment.canAdd ?addNum():''" :style="!fragment.canAdd ?'cursor: not-allowed;':''">+</div>
-             <!--   <div class="input-group-addon operate" @click="subNum()">-</div>
-                <input type="text" class="form-control" placeholder="数量" v-model="fragment.num" @change="inputNum()"style="padding: 0;min-width: 100px;text-align: center;"/>
-                <div class="input-group-addon operate" @click="addNum()">+</div>-->
+                <!--   <div class="input-group-addon operate" @click="subNum()">-</div>
+                   <input type="text" class="form-control" placeholder="数量" v-model="fragment.num" @change="inputNum()"style="padding: 0;min-width: 100px;text-align: center;"/>
+                   <div class="input-group-addon operate" @click="addNum()">+</div>-->
               </div>
               ×
               <!--<div class="select">
@@ -125,426 +125,435 @@
   </div>
 </template>
 <script>
-function initFragment (commodity) {
-  if (!commodity) {
-    return {}
-  }
-  let fragment = {}
-  let prices = commodity.prices[0]
-  fragment.num = commodity.minBuyQty
-  fragment.prices = prices
-
-  if (commodity.currencyName !== 'USD') {
-    fragment.currency = 'RMB'
-  } else {
-    fragment.currency = 'USD'
-  }
-
-  if (fragment.currency !== 'USD') {
-    fragment.price = prices.rMBPrice
-  } else {
-    fragment.price = prices.uSDPrice
-  }
-  fragment.canAdd = true
-  fragment.canSub = false
-  return fragment
-}
-function getFragment (commodity, fragment) {
-  // 判断是否小于第一分段的起订量
-  if (commodity.prices[0].start > fragment.num) {
-    fragment.num = commodity.prices[0].start
-  }
-  // 获取分段的信息
-  let prices = commodity.prices
-  for (let i = 0; i < prices.length; i++) {
-    if (fragment.num <= prices[i].end) {
-      fragment.prices = prices[i]
-      break
+  function initFragment (commodity) {
+    if (!commodity) {
+      return {}
+    }
+    let fragment = {}
+    let prices = commodity.prices[0]
+    fragment.num = commodity.minBuyQty
+    fragment.prices = prices
+
+    if (commodity.currencyName !== 'USD') {
+      fragment.currency = 'RMB'
+    } else {
+      fragment.currency = 'USD'
     }
+
+    if (fragment.currency !== 'USD') {
+      fragment.price = prices.rMBPrice
+    } else {
+      fragment.price = prices.uSDPrice
+    }
+    fragment.canAdd = true
+    fragment.canSub = false
+    return fragment
   }
-}
-
-export default {
-  name: 'commodity-info',
-  data () {
-    return {
-      fragment: {
-        currency: 'RMB',
-        num: 0,
-        price: 0,
-        canAdd: true,
-        canSub: true}
+  function getFragment (commodity, fragment) {
+    // 判断是否小于第一分段的起订量
+    if (commodity.prices[0].start > fragment.num) {
+      fragment.num = commodity.prices[0].start
     }
-  },
-  filters: {
-    currency: function (num) {
-      if (typeof num === 'number' && num > 0) {
-        if (num <= 0.000001) {
-          num = 0.000001
-        } else {
-          if (num.toString().indexOf('.') === -1) {
-            num += '.00'
+    // 获取分段的信息
+    let prices = commodity.prices
+    for (let i = 0; i < prices.length; i++) {
+      if (fragment.num <= prices[i].end) {
+        fragment.prices = prices[i]
+        break
+      }
+    }
+  }
+
+  export default {
+    name: 'commodity-info',
+    data () {
+      return {
+        fragment: {
+          currency: 'RMB',
+          num: 0,
+          price: 0,
+          canAdd: true,
+          canSub: true}
+      }
+    },
+    filters: {
+      currency: function (num) {
+        if (typeof num === 'number' && num > 0) {
+          if (num <= 0.000001) {
+            num = 0.000001
           } else {
-            let inputStr = num.toString()
-            let arr = inputStr.split('.')
-            let floatNum = arr[1]
-            if (floatNum.length > 6) {
-              num = inputStr.substring(0, arr[0].length + 7)
-              if (Number(floatNum.charAt(6)) > 4) {
-                num = (Number(num) * 1000000 + 1) / 1000000
+            if (num.toString().indexOf('.') === -1) {
+              num += '.00'
+            } else {
+              let inputStr = num.toString()
+              let arr = inputStr.split('.')
+              let floatNum = arr[1]
+              if (floatNum.length > 6) {
+                num = inputStr.substring(0, arr[0].length + 7)
+                if (Number(floatNum.charAt(6)) > 4) {
+                  num = (Number(num) * 1000000 + 1) / 1000000
+                }
+              } else if (floatNum.length === 1) {
+                num = num + '0'
               }
-            } else if (floatNum.length === 1) {
-              num = num + '0'
             }
           }
         }
+        return num
       }
-      return num
-    }
-  },
-  computed: {
-    storeInfo () {
-      return this.$store.state.shop.storeInfo.store.data
-    },
-    commodity () {
-      let commodity = this.$store.state.shop.storeInfo.commodity.data
-      this.fragment = initFragment(commodity)
-      return commodity
-    },
-    component () {
-      return this.$store.state.shop.storeInfo.component.data
     },
-    calculate () {
-      this.fragment.total = this.fragment.price * this.fragment.num
-      return Math.ceil(this.fragment.total * Math.pow(10, 6)) / Math.pow(10, 6)
-    },
-    user () {
-      return this.$store.state.option.user
-    }
-  },
-  mounted () {
-    this.$nextTick(() => {
-      this.loadSaveHistory()
-    })
-  },
-  methods: {
-    loadSaveHistory () {
-      if (this.user.logged) {
-        this.$store.dispatch('shop/saveHistory', {id: this.commodity.batchCode})
+    computed: {
+      storeInfo () {
+        return this.$store.state.shop.storeInfo.store.data
+      },
+      commodity () {
+        let commodity = this.$store.state.shop.storeInfo.commodity.data
+        this.fragment = initFragment(commodity)
+        return commodity
+      },
+      component () {
+        return this.$store.state.shop.storeInfo.component.data
+      },
+      calculate () {
+        this.fragment.total = this.fragment.price * this.fragment.num
+        return Math.ceil(this.fragment.total * Math.pow(10, 6)) / Math.pow(10, 6)
+      },
+      user () {
+        return this.$store.state.option.user
       }
     },
-    changeCurrency () {
-      if (this.fragment.currency === 'RMB') {
-        this.fragment.price = this.fragment.prices.rMBPrice
-      } else if (this.fragment.currency === 'USD') {
-        this.fragment.price = this.fragment.prices.uSDPrice
-      }
+    mounted () {
+      this.$nextTick(() => {
+        this.loadSaveHistory()
+      })
     },
-    changeNum: function (newNum) {
-      let pack = this.commodity.perQty || this.commodity.minPackQty
-      let buy = this.commodity.minBuyQty
-      let reserve = this.commodity.reserve
-      newNum = parseInt(newNum)
-      if (newNum < buy) {
-        this.$message.error('该商品最少购买' + buy + '件')
-        this.fragment.num = buy
-        this.fragment.canSub = false
-        if (this.fragment.num > reserve) {
-          this.$message.error('库存不足')
-          this.fragment.num = reserve - (reserve % pack)
-          this.fragment.canAdd = false
-        } else {
-          if (reserve - this.fragment.num - pack < 0) {
-            this.fragment.canAdd = false
-          } else {
-            this.fragment.canAdd = true
-          }
+    methods: {
+      loadSaveHistory () {
+        if (this.user.logged) {
+          this.$store.dispatch('shop/saveHistory', {id: this.commodity.batchCode})
         }
-      } else {
-        if (newNum - buy - pack < 0) {
-          this.fragment.canSub = false
-        } else {
-          this.fragment.canSub = true
+      },
+      changeCurrency () {
+        if (this.fragment.currency === 'RMB') {
+          this.fragment.price = this.fragment.prices.rMBPrice
+        } else if (this.fragment.currency === 'USD') {
+          this.fragment.price = this.fragment.prices.uSDPrice
         }
-    //    console.log(newNum) 2222
-        if (newNum % pack === 0) {
-          this.fragment.num = newNum
-        } else {
-          this.fragment.num = (Math.floor(newNum / pack) + 1) * pack
-        }
-        if (this.fragment.num > reserve) {
-          this.$message.error('库存不足')
-          this.fragment.num = reserve - (reserve % pack)
-          this.fragment.canAdd = false
-        } else {
-          if (reserve - this.fragment.num - pack < 0) {
+      },
+      changeNum: function (newNum) {
+        let pack = this.commodity.perQty || this.commodity.minPackQty
+        let buy = this.commodity.minBuyQty
+        let reserve = this.commodity.reserve
+        let breakUp = this.commodity.breakUp
+        newNum = parseInt(newNum)
+        if (breakUp) {
+          if (newNum < buy) {
+            this.$message.error('最小起订量为' + buy)
+            this.fragment.num = buy
+            this.fragment.canSub = false
+          } else if (newNum > reserve) {
+            this.$message.error('库存不足')
+            this.fragment.num = reserve
             this.fragment.canAdd = false
+          }
+        } else {
+          if (newNum < buy) {
+            this.$message.error('最小起订量为' + buy)
+            this.fragment.num = buy
+            this.fragment.canSub = false
+            if (newNum > reserve) {
+              this.$message.error('库存不足')
+              this.fragment.num = reserve - (reserve % pack)
+              this.fragment.canAdd = false
+            }
           } else {
-            this.fragment.canAdd = true
+            if (newNum - buy - pack < 0) {
+              this.fragment.canSub = false
+            } else {
+              this.fragment.canSub = true
+            }
+            if (newNum > reserve) {
+              this.$message.error('库存不足')
+              this.fragment.num = reserve - (reserve % pack)
+              this.fragment.canAdd = false
+            } else {
+              let remainder = newNum % pack
+              if (remainder !== 0) {
+                console.log(this.fragment.num)
+                this.$message.error('不支持拆包且包装量为' + pack)
+                // 这个直接赋值的，应该给这个值进行判断(Math.floor(newNum / pack) + 1) * pack
+                let res = (Math.floor(newNum / pack) + 1) * pack
+                this.fragment.num = res > reserve ? Math.floor(newNum / pack) * pack : res
+                if (reserve - this.fragment.num - pack < 0) {
+                  this.fragment.canAdd = false
+                } else {
+                  this.fragment.canAdd = true
+                }
+              }
+            }
           }
         }
-      }
-    },
-    subNum () {
-      let pack = this.commodity.perQty || this.commodity.minPackQty
-      let newNum = this.fragment.num - pack
-      this.changeNum(newNum)
-      getFragment(this.commodity, this.fragment)
-    },
-    addNum () {
-      let pack = this.commodity.perQty || this.commodity.minPackQty
-      let newNum = this.fragment.num + pack
-      this.changeNum(newNum)
-      getFragment(this.commodity, this.fragment)
-    },
-    inputNum () {
-      if ((/^[\d]*$/).test(this.fragment.num)) {
-        this.changeNum(this.fragment.num)
+      },
+      subNum () {
+        let pack = this.commodity.perQty || this.commodity.minPackQty
+        let newNum = this.fragment.num - pack
+        this.changeNum(newNum)
         getFragment(this.commodity, this.fragment)
-      } else {
-        this.$message.error('请输入整数')
-        this.fragment.num = this.commodity.minBuyQty
-      }
-    },
-    buyNow: function (isBuy, item) {
-      if (!this.$store.state.option.user.logged) {
-        this.$http.get('/login/page', {params: {returnUrl: window.location.href}}).then(response => {
-          if (response.data) {
-            window.location.href = response.data.content + '&baseUrl=' + encodeURIComponent(window.location.protocol + '//' + window.location.host + response.data.baseUrl)
-          }
-        })
-      } else {
-        if (item) {
-          if (isBuy) {
-            this.$http.post('trade/order/buyNow', [{
-              uuid: item.uuid,
-              batchCode: item.batchCode,
-              number: this.fragment.num,
-              storeid: item.storeid,
-              storeUuid: item.storeid,
-              currencyName: item.currencyName,
-              minPackQty: item.minPackQty
-            }])
-              .then(response => {
-                //        window.location.href = '/user#/order/pay/' + this.enidfilter(response.data.orderid)
-                if (response.data.success) {
-                  if (response.data.message) {
-                    this.$message({
-                      message: response.data.message,
-                      type: 'success'
-                    })
-                    let _self = this
-                    window.setTimeout(function () {
-                      window.location.href = '/user#/order/pay/' + _self.enidfilter(response.data.data.orderid)
-                    }, 1000)
+      },
+      addNum () {
+        let pack = this.commodity.perQty || this.commodity.minPackQty
+        let newNum = this.fragment.num + pack
+        this.changeNum(newNum)
+        getFragment(this.commodity, this.fragment)
+      },
+      inputNum () {
+        if ((/^[\d]*$/).test(this.fragment.num)) {
+          this.changeNum(this.fragment.num)
+          getFragment(this.commodity, this.fragment)
+        } else {
+          this.$message.error('请输入整数')
+          this.fragment.num = this.commodity.minBuyQty
+        }
+      },
+      buyNow: function (isBuy, item) {
+        if (!this.$store.state.option.user.logged) {
+          this.$http.get('/login/page', {params: {returnUrl: window.location.href}}).then(response => {
+            if (response.data) {
+              window.location.href = response.data.content + '&baseUrl=' + encodeURIComponent(window.location.protocol + '//' + window.location.host + response.data.baseUrl)
+            }
+          })
+        } else {
+          if (item) {
+            if (isBuy) {
+              this.$http.post('trade/order/buyNow', [{
+                uuid: item.uuid,
+                batchCode: item.batchCode,
+                number: this.fragment.num,
+                storeid: item.storeid,
+                storeUuid: item.storeid,
+                currencyName: item.currencyName,
+                minPackQty: item.minPackQty
+              }])
+                .then(response => {
+                  //        window.location.href = '/user#/order/pay/' + this.enidfilter(response.data.orderid)
+                  if (response.data.success) {
+                    if (response.data.message) {
+                      this.$message({
+                        message: response.data.message,
+                        type: 'success'
+                      })
+                      let _self = this
+                      window.setTimeout(function () {
+                        window.location.href = '/user#/order/pay/' + _self.enidfilter(response.data.data.orderid)
+                      }, 1000)
+                    } else {
+                      window.location.href = '/user#/order/pay/' + this.enidfilter(response.data.data.orderid)
+                    }
                   } else {
-                    window.location.href = '/user#/order/pay/' + this.enidfilter(response.data.data.orderid)
+                    if (response.data.data && response.data.data.unvailable === 1) {
+                      this.$message.error('产品信息已失效，请刷新界面')
+                    } else {
+                      this.$message.error(response.data.message)
+                    }
                   }
-                } else {
-                  if (response.data.data && response.data.data.unvailable === 1) {
-                    this.$message.error('产品信息已失效，请刷新界面')
-                  } else {
-                    this.$message.error(response.data.message)
+                }, err => {
+                  console.log(err)
+                  if (item.minBuyQty > item.reserve) {
+                    this.$message.error('商品' + item.code + '的库存已经不满足起订量')
                   }
-                }
-              }, err => {
-                console.log(err)
-                if (item.minBuyQty > item.reserve) {
-                  this.$message.error('商品' + item.code + '的库存已经不满足起订量')
-                }
+                })
+            } else {
+              // this.$store.dispatch('user/addCar', {uuid: item.uuid, batchCode: item.batchCode, number: item.minBuyQty})
+              this.$http.post('trade/cart/add', {
+                uuid: item.uuid,
+                batchCode: item.batchCode,
+                number: this.fragment.num,
+                storeid: item.storeid,
+                storeUuid: item.storeid,
+                currencyName: item.currencyName,
+                minPackQty: item.minPackQty
               })
-          } else {
-            // this.$store.dispatch('user/addCar', {uuid: item.uuid, batchCode: item.batchCode, number: item.minBuyQty})
-            this.$http.post('trade/cart/add', {
-              uuid: item.uuid,
-              batchCode: item.batchCode,
-              number: this.fragment.num,
-              storeid: item.storeid,
-              storeUuid: item.storeid,
-              currencyName: item.currencyName,
-              minPackQty: item.minPackQty
-            })
-              .then(response => {
-                if (response.data.success) {
-                  if (response.data.message) {
-                    this.$message({
-                      message: '添加购物车成功，但商品信息有更新',
-                      type: 'success'
-                    })
+                .then(response => {
+                  if (response.data.success) {
+                    if (response.data.message) {
+                      this.$message({
+                        message: '添加购物车成功，但商品信息有更新',
+                        type: 'success'
+                      })
+                    } else {
+                      this.$message({
+                        message: '添加购物车成功',
+                        type: 'success'
+                      })
+                    }
                   } else {
-                    this.$message({
-                      message: '添加购物车成功',
-                      type: 'success'
-                    })
+                    if (response.data.code === 2) {
+                      this.$message.error(response.data.message + '，请刷新页面')
+                    } else {
+                      this.$message.error(response.data.message)
+                    }
                   }
-                } else {
-                  if (response.data.code === 2) {
-                    this.$message.error(response.data.message + '，请刷新页面')
-                  } else {
-                    this.$message.error(response.data.message)
-                  }
-                }
-              })
+                })
+            }
           }
         }
-      }
-      // window.location.href = 'user#/order/pay/' + this.enidfilter(this.buy_info.orderid)
-    },
-    enidfilter: function (str) {
-      if (str) {
-        let encryptStr = '' // 最终返回的加密后的字符串
-        // 产生三位随机数
-        let num = ''
-        for (let i = 0; i < 3; i++) {
-          num += Math.floor(Math.random() * 10)
-        }
-        encryptStr += num // 产生3位随机数
-
-        // 16位加密
-        let tempspit = ''
-        let strspit = str.toString().toLowerCase()
-        if (strspit.match(/^[-+]?\d*$/) === null) { // 非整数字符，对每一个字符都转换成16进制，然后拼接
-          /**
-           * Unicode汉字、英文字母、数字的unicode范围
-           *汉字：[0x4e00,0x9fa5]（或十进制[19968,40869]）
-           *数字：[0x30,0x39]（或十进制[48, 57]）
-           *小写字母：[0x61,0x7a]（或十进制[97, 122]）
-           *大写字母：[0x41,0x5a]（或十进制[65, 90]
-           * 'a'的Unicode编码：'&#97;',charCodeAt()的值是97
-           * '码'的Unicode编码：'\u7801', new String('码').charCodeAt()的值是30721，30721的16进制表示是7801
-           */
-          let s = strspit.split('')
-          for (let i = 0; i < s.length; i++) {
-            s[i] = s[i].charCodeAt() // 先转换成Unicode编码
-            s[i] = s[i].toString(16)
-            // 因为在服务器是每两位当做一个字符进行解析的，所以这里每个字符的Unicode编码范围必须在0——255之间。数字和大小写满足该要求，特殊字符则不一定，如果后续有特殊字符的要求，需要重写编码器和解码器
-            if (s[i].length === 1) {
-              s[i] = '0' + s[i]
+        // window.location.href = 'user#/order/pay/' + this.enidfilter(this.buy_info.orderid)
+      },
+      enidfilter: function (str) {
+        if (str) {
+          let encryptStr = '' // 最终返回的加密后的字符串
+          // 产生三位随机数
+          let num = ''
+          for (let i = 0; i < 3; i++) {
+            num += Math.floor(Math.random() * 10)
+          }
+          encryptStr += num // 产生3位随机数
+
+          // 16位加密
+          let tempspit = ''
+          let strspit = str.toString().toLowerCase()
+          if (strspit.match(/^[-+]?\d*$/) === null) { // 非整数字符，对每一个字符都转换成16进制，然后拼接
+            /**
+             * Unicode汉字、英文字母、数字的unicode范围
+             *汉字：[0x4e00,0x9fa5]（或十进制[19968,40869]）
+             *数字：[0x30,0x39]（或十进制[48, 57]）
+             *小写字母：[0x61,0x7a]（或十进制[97, 122]）
+             *大写字母：[0x41,0x5a]（或十进制[65, 90]
+             * 'a'的Unicode编码：'&#97;',charCodeAt()的值是97
+             * '码'的Unicode编码：'\u7801', new String('码').charCodeAt()的值是30721，30721的16进制表示是7801
+             */
+            let s = strspit.split('')
+            for (let i = 0; i < s.length; i++) {
+              s[i] = s[i].charCodeAt() // 先转换成Unicode编码
+              s[i] = s[i].toString(16)
+              // 因为在服务器是每两位当做一个字符进行解析的，所以这里每个字符的Unicode编码范围必须在0——255之间。数字和大小写满足该要求，特殊字符则不一定，如果后续有特殊字符的要求，需要重写编码器和解码器
+              if (s[i].length === 1) {
+                s[i] = '0' + s[i]
+              }
+              tempspit = tempspit + s[i]
             }
-            tempspit = tempspit + s[i]
+            tempspit = tempspit + '{' + 1 // 1代表字符
+          } else { // 数字直接转换成16进制
+            strspit = parseInt(strspit)
+              .toString(16)
+            tempspit = strspit + '{' + 0 // 0代表纯数字
           }
-          tempspit = tempspit + '{' + 1 // 1代表字符
-        } else { // 数字直接转换成16进制
-          strspit = parseInt(strspit)
-            .toString(16)
-          tempspit = strspit + '{' + 0 // 0代表纯数字
-        }
 
-        let temp = tempspit.split('{') // 对要加密的字符转换成16进制
-        let numLength = temp[0].length // 转换后的字符长度
-        numLength = numLength.toString(16) // 字符长度换算成16进制
-        if (numLength.length === 1) { // 如果是1，补一个0
-          numLength = '0' + numLength
-        } else if (numLength.length > 3) { // 转换后的16进制字符长度如果大于2位数，则返回，不支持
-          return ''
-        }
-        encryptStr += numLength
-        if (temp[1] === '0') {
-          encryptStr += 0
-        } else if (temp[1] === '1') {
-          encryptStr += 1
-        }
-        encryptStr += temp[0]
-        if (encryptStr.length < 20) { // 如果小于20位，补上随机数
-          // 产生三位随机数
-          let numtwo = ''
-          for (let i = 0; i < 20 - encryptStr.length; i++) {
-            numtwo += Math.floor(Math.random() * 10)
+          let temp = tempspit.split('{') // 对要加密的字符转换成16进制
+          let numLength = temp[0].length // 转换后的字符长度
+          numLength = numLength.toString(16) // 字符长度换算成16进制
+          if (numLength.length === 1) { // 如果是1，补一个0
+            numLength = '0' + numLength
+          } else if (numLength.length > 3) { // 转换后的16进制字符长度如果大于2位数，则返回，不支持
+            return ''
           }
-          let ran = numtwo // 产生3位随机数
-          encryptStr += ran
-        }
-        return encryptStr
-      }
-    },
-    toAttach: function (url) {
-      if (url === '1') {
-        this.$http.get('/login/page', {params: {returnUrl: window.location.href}}).then(response => {
-          if (response.data) {
-            window.location.href = response.data.content + '&baseUrl=' + encodeURIComponent(window.location.protocol + '//' + window.location.host + response.data.baseUrl)
+          encryptStr += numLength
+          if (temp[1] === '0') {
+            encryptStr += 0
+          } else if (temp[1] === '1') {
+            encryptStr += 1
+          }
+          encryptStr += temp[0]
+          if (encryptStr.length < 20) { // 如果小于20位，补上随机数
+            // 产生三位随机数
+            let numtwo = ''
+            for (let i = 0; i < 20 - encryptStr.length; i++) {
+              numtwo += Math.floor(Math.random() * 10)
+            }
+            let ran = numtwo // 产生3位随机数
+            encryptStr += ran
           }
-        })
-      } else {
-        window.open(url)
+          return encryptStr
+        }
+      },
+      toAttach: function (url) {
+        if (url === '1') {
+          this.$http.get('/login/page', {params: {returnUrl: window.location.href}}).then(response => {
+            if (response.data) {
+              window.location.href = response.data.content + '&baseUrl=' + encodeURIComponent(window.location.protocol + '//' + window.location.host + response.data.baseUrl)
+            }
+          })
+        } else {
+          window.open(url)
+        }
       }
     }
   }
-}
 </script>
 <style scoped>
   .container.commodity {
-		width: 1190px;
-		padding-left: 0;
-		padding-right: 0;
-	}
-	.commodity .commodity-detail {
-		width: 100%;
-		display: inline-block;
-		font-size: 0;
-	}
-
-	.commodity-detail .img{
-		float: left;
-		width: 258px;
-		height: 320px;
-	}
-
-	.commodity-detail .img img {
-		border: 1px solid #D6D3CE;
-	}
-
-	.commodity-detail .img  .box {
-		height: 62px;
-	}
-
-	.commodity-detail .content {
-		width: 932px;
-		float: left;
-		font-size: 14px;
-	}
-
-	.commodity-detail .content {
-		padding-left: 20px;
-	}
-
-	.commodity-detail .content .code {
-		font-size: 24px;
-		color: rgb(50, 50, 50);
-		font-weight: 600;
-		border-bottom: 1px solid #D6D3CE;
-		line-height: 40px;
-	}
-
-	.commodity-detail .content .com-info {
-		font-size: 14px;
-		line-height: 26px;
-	}
-
-	.input-group .input-group-operate {
-		padding: 6px 12px;
-		font-size: 14px;
-		font-weight: 400;
-		line-height: 1;
-		color: #555;
-		text-align: center;
-		background-color: #eee;
-		border: 1px solid #ccc;
-		border-radius: 4px;
-	}
-
-	.input-group .input-group-operate:last-child {
-		border-bottom-left-radius: 0;
-		border-top-left-radius: 0;
-	}
-
-	.input-group .input-group-operate:first-child {
-		border-bottom-right-radius: 0;
-		border-top-right-radius: 0;
-	}
-
-	.content .com-info .name {
-		letter-spacing: 15px;
-	}
+    width: 1190px;
+    padding-left: 0;
+    padding-right: 0;
+  }
+  .commodity .commodity-detail {
+    width: 100%;
+    display: inline-block;
+    font-size: 0;
+  }
+
+  .commodity-detail .img{
+    float: left;
+    width: 258px;
+    height: 320px;
+  }
+
+  .commodity-detail .img img {
+    border: 1px solid #D6D3CE;
+  }
+
+  .commodity-detail .img  .box {
+    height: 62px;
+  }
+
+  .commodity-detail .content {
+    width: 932px;
+    float: left;
+    font-size: 14px;
+  }
+
+  .commodity-detail .content {
+    padding-left: 20px;
+  }
+
+  .commodity-detail .content .code {
+    font-size: 24px;
+    color: rgb(50, 50, 50);
+    font-weight: 600;
+    border-bottom: 1px solid #D6D3CE;
+    line-height: 40px;
+  }
+
+  .commodity-detail .content .com-info {
+    font-size: 14px;
+    line-height: 26px;
+  }
+
+  .input-group .input-group-operate {
+    padding: 6px 12px;
+    font-size: 14px;
+    font-weight: 400;
+    line-height: 1;
+    color: #555;
+    text-align: center;
+    background-color: #eee;
+    border: 1px solid #ccc;
+    border-radius: 4px;
+  }
+
+  .input-group .input-group-operate:last-child {
+    border-bottom-left-radius: 0;
+    border-top-left-radius: 0;
+  }
+
+  .input-group .input-group-operate:first-child {
+    border-bottom-right-radius: 0;
+    border-top-right-radius: 0;
+  }
+
+  .content .com-info .name {
+    letter-spacing: 15px;
+  }
   .content .com-info a{
     color: #1162a4;
   }
@@ -552,109 +561,109 @@ export default {
     color: #23527c;
   }
   .commodity-info-detail {
-		float: left;
-		padding-top: 10px;
-		width: 582px;
-	}
-
-	.price-block {
-		float: right;
-		width: 330px;
-		margin-top: 10px;
-		height: 220px;
-	}
-
-	.commodity-price {
-		line-height: 30px;
-		text-align: center;
-		border: 1px solid #D6D3CE;
-	}
-
-	.commodity-price .title {
-		background-color: #f7f7f7;
-		border-bottom: 1px solid #D6D3CE;
-	}
-
-	.commodity-price .head {
-		border-bottom: 1px solid #D6D3CE;
-	}
-
-	.commodity-price .fragment {
-		display: inline-block;
-		width: 70px;
-	}
-
-	.commodity-price .price {
-		width: 123px;
-		display: inline-block;
-	}
-
-	.com-info div.select {
-		display: inline-block;
+    float: left;
+    padding-top: 10px;
+    width: 582px;
+  }
+
+  .price-block {
+    float: right;
+    width: 330px;
+    margin-top: 10px;
+    height: 220px;
+  }
+
+  .commodity-price {
+    line-height: 30px;
+    text-align: center;
+    border: 1px solid #D6D3CE;
+  }
+
+  .commodity-price .title {
+    background-color: #f7f7f7;
+    border-bottom: 1px solid #D6D3CE;
+  }
+
+  .commodity-price .head {
+    border-bottom: 1px solid #D6D3CE;
+  }
+
+  .commodity-price .fragment {
+    display: inline-block;
+    width: 70px;
+  }
+
+  .commodity-price .price {
+    width: 123px;
+    display: inline-block;
+  }
+
+  .com-info div.select {
+    display: inline-block;
     font-weight: 600;
     color: red;
     font-size: 14px;
-	}
+  }
   .com-info div.select .tax {
     font-weight: normal;
     color: black;
     font-size: 12px;
   }
-	.com-info .operate {
-		cursor: pointer;
-	}
+  .com-info .operate {
+    cursor: pointer;
+  }
 
-	.com-info .operate:hover, .com-info .operate:link {
-		background-color: #00B83F;
-		color: white;
-	}
+  .com-info .operate:hover, .com-info .operate:link {
+    background-color: #00B83F;
+    color: white;
+  }
 
-	.com-info .money {
-		font-weight: 600;
-		color: red;
+  .com-info .money {
+    font-weight: 600;
+    color: red;
     font-size: 14px;
-	}
-
-	.com-info select {
-		border-radius: 4px;
-		width: 120px!important;
-	}
-
-	ul.list-inline {
-		margin: 0px;
-	}
-
-	.commodity-price ul.list-inline li {
-		padding-left: 0px;
-		padding-right: 0px;
-		border-bottom: 1px dashed #D6D3CE;
-	}
-
-	.commodity-price .table {
-		margin-bottom: 0px;
-	}
-
-	.commodity-price ul>li:last-child {
-		border-bottom: none;
-	}
-
-	div.button {
-		padding-top: 20px;
-		float: left;
-	}
-
-	button.btn-now {
-		border: 1px solid #3D76C6;
-		color: #3D76C6;
-		margin-left: 30px;
-	}
-
-	.com-info .delivery {
-		display: inline;
-	}
-	#commodity-info-fragment{
-		margin-bottom: 20px;
-	}
+  }
+
+  .com-info select {
+    border-radius: 4px;
+    width: 120px!important;
+  }
+
+  ul.list-inline {
+    margin: 0px;
+  }
+
+  .commodity-price ul.list-inline li {
+    padding-left: 0px;
+    padding-right: 0px;
+    border-bottom: 1px dashed #D6D3CE;
+  }
+
+  .commodity-price .table {
+    margin-bottom: 0px;
+  }
+
+  .commodity-price ul>li:last-child {
+    border-bottom: none;
+  }
+
+  div.button {
+    padding-top: 20px;
+    float: left;
+  }
+
+  button.btn-now {
+    border: 1px solid #3D76C6;
+    color: #3D76C6;
+    margin-left: 30px;
+  }
+
+  .com-info .delivery {
+    display: inline;
+  }
+  #commodity-info-fragment{
+    margin-bottom: 20px;
+  }
 
   .commodity-detail .content .com-info .div-sell {
     font-size: 12px;