刘文博 / gulu-vue

Blame view

src/store/modules/details.js 3.76 KB
edit raw normal view history
3cda19af7   范牧   详情页-售后保障 
1
2
3
4
5
 
  import urlAlias from '../url'
  import request from '../request'
  
  const {
    read,
530bb7e83   范牧   重构详情页-商品介绍 
6
 
    cartList,
3cda19af7   范牧   详情页-售后保障 
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 
  } = urlAlias
  
  const state = {
    // 轮播图
    carousel: [
      '/static/img/detail/d9.png',
    ],
    // 商品基本信息
    goodsInfo: {
      name: '暂无名称',
      price: '暂无价格',
      discountPrice: undefined,
      tradeNumber: undefined,
    },
530bb7e83   范牧   重构详情页-商品介绍 
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
 
    // 商品介绍
    tag: {
      prod_tag_style: [{
        label: '青春学子风',
        value: '54',
      }],
    },
    // 规格参数
    specification: [
      { key: 'frame_width', img: '/static/img/detail/d2.png', standard: '框架宽', slength: '139mm' },
      { key: 'glass_width', img: '/static/img/detail/d3.png', standard: '镜片宽', slength: '51mm' },
      { key: 'glass_height', img: '/static/img/detail/d4.png', standard: '镜片高', slength: '45mm' },
      { key: 'nose_width', img: '/static/img/detail/d5.png', standard: '鼻架宽', slength: '19mm' },
      { key: 'leg_long', img: '/static/img/detail/d6.png', standard: '框架耳长', slength: '138mm' },
      { key: 'weight', img: '/static/img/detail/d7.png', standard: '框架重', slength: '19克（grams）' },
    ],
    // 评价
    evaluate: {
      rate: '100%',
      star: 5,
      tag: [{ name: '价格实惠' }],
    },
    // 商品详情
    more: '',
    // 购物车数目
    cartNumber: 0,
3cda19af7   范牧   详情页-售后保障 
47
48
49
 
  }
  
  const mutations = {
530bb7e83   范牧   重构详情页-商品介绍 
50
 
    INIT: (state, { carousel, goodsInfo, tag, specification, evaluate, more }) => {
3cda19af7   范牧   详情页-售后保障 
51
52
 
      state.carousel = carousel
      state.goodsInfo = goodsInfo
530bb7e83   范牧   重构详情页-商品介绍 
53
54
55
56
57
58
59
 
      state.tag = tag
      state.specification = specification
      state.evaluate = evaluate
      state.more = more
    },
    CART: (state, number) => {
      state.cartNumber = number
3cda19af7   范牧   详情页-售后保障 
60
61
62
63
 
    },
  }
  
  const actions = {
530bb7e83   范牧   重构详情页-商品介绍 
64
65
 
    // 获取详情
    details({ commit, rootState }, param) {
3cda19af7   范牧   详情页-售后保障 
66
67
68
69
 
      return new Promise((resolve, reject) => request({
        url: read,
        data: param,
        success: ({ data: { data } }) => {
530bb7e83   范牧   重构详情页-商品介绍 
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
 
          console.log('data.tag', data.tag)
          // 规格参数设置
          const specification = rootState.details.specification
          const parameter = {
            frame_width: data.frame_width,
            glass_width: data.glass_width,
            glass_height: data.glass_height,
            nose_width: data.nose_width,
            leg_long: data.leg_long,
            weight: data.weight,
          }
          for (let index = 0; index < specification.length; index++) {
            if (specification[index].key !== 'weight') {
              specification[index].slength = `${parameter[specification[index].key]}mm`
            } else {
              specification[index].slength = `${parameter[specification[index].key]}克（grams）`
            }
          }
3cda19af7   范牧   详情页-售后保障 
88
89
90
91
92
93
94
95
 
          commit('INIT', {
            carousel: data.pics,
            goodsInfo: {
              name: data.p_name,
              price: data.priceArea.Min_Price,
              discountPrice: data.priceArea.Min_Price - Number(data.priceArea.discount),
              tradeNumber: data.trade_num,
            },
530bb7e83   范牧   重构详情页-商品介绍 
96
97
98
99
100
101
102
103
 
            tag: data.tag,
            specification,
            evaluate: {
              rate: data.judgeInfo.good,
              tag: data.judge_tag,
              star: parseInt(5 * Number(data.judgeInfo.good.slice(0, -1)) / 100),
            },
            more: data.prodIntro1.replace(/\<img/gi, '<img style="max-width:100%;height:auto"'),
3cda19af7   范牧   详情页-售后保障 
104
105
106
107
108
109
110
111
 
          })
          resolve(data)
        },
        fail: (res) => {
          console.log('fail status ===>', res)
        },
      }))
    },
530bb7e83   范牧   重构详情页-商品介绍 
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
 
    // 获取购物车列表
    getCartNumber({ commit }, param) {
      return new Promise((resolve) => request({
        url: cartList,
        data: param,
        success: ({ data: { data } }) => {
          console.log('cartData', data)
          let number = 0
          for (let index = 0; index < data.length; index++) {
            number += Number(data[index].num)
          }
          commit('CART', number)
        },
      }))
    },
3cda19af7   范牧   详情页-售后保障 
127
128
129
130
131
132
133
134
 
  }
  
  export default {
    namespaced: true,
    state,
    mutations,
    actions,
  }