fe / xianyu-ufo-app-web · Commits

Go to a project

Authored by huzhiming
Commit f1ab390a2c3d01275a33f2456926c1c959e57bc7 1 parent 11528d58

feat(second): 详情按钮已售出、全新xx省xx回显、后端字段名不一致容错

Inline Side-by-side
Showing 4 changed files with 84 additions and 31 deletions
@@ -6,12 +6,20 @@ @@ -6,12 +6,20 @@
6 * @后台人员: 6 * @后台人员:
7 * @version: v1.0.0 7 * @version: v1.0.0
8 * @path: 页面访问路径及参数说明 8 * @path: 页面访问路径及参数说明
9 - * @调用示例说明：  
10 9
  10 +@调用示例：
  11 +import FilterList from './components/filter-list';
  12 +<FilterList
  13 + :visible.sync="filterModalVisible"
  14 + :storage_id="storage_id"
  15 + @submit="handleFilterSubmit"
  16 +></FilterList>
  17 +components: {
  18 + FilterList,
  19 +}
11 !--> 20 !-->
12 <template> 21 <template>
13 22
14 -<!-- <LayoutApp :show-back="true" title="筛选"> -->  
15 <div 23 <div
16 class="container" 24 class="container"
17 v-show="visible" 25 v-show="visible"
@@ -73,10 +81,9 @@ @@ -73,10 +81,9 @@
73 >确定</div> 81 >确定</div>
74 </div> 82 </div>
75 </div> 83 </div>
76 -<!-- </LayoutApp> -->  
77 </template> 84 </template>
78 <script> 85 <script>
79 -import { mapState, mapActions, createNamespacedHelpers } from 'vuex'; 86 +import { mapState, mapActions } from 'vuex';
80 87
81 // const filterData = [ 88 // const filterData = [
82 // { 89 // {
@@ -125,7 +132,7 @@ export default { @@ -125,7 +132,7 @@ export default {
125 data () { 132 data () {
126 return { 133 return {
127 selected: { 134 selected: {
128 - // second_type: null // 注意：null是默认值 135 + // second_type: null // 注意：null是默认值, 点击对应item 会根据 filterData[x].filterId值 动态创建此对象
129 } 136 }
130 }; 137 };
131 }, 138 },
@@ -180,19 +187,10 @@ export default { @@ -180,19 +187,10 @@ export default {
180 */ 187 */
181 submit() { 188 submit() {
182 if (Object.keys(this.selected).length!==0) { 189 if (Object.keys(this.selected).length!==0) {
183 - this.$emit('update:visible', !this.visible);  
184 this.$emit('submit', this.selected); 190 this.$emit('submit', this.selected);
185 } 191 }
  192 + this.$emit('update:visible', !this.visible);
186 } 193 }
187 -  
188 - // yas (param) {  
189 - // this.$store.dispatch('reportYas', {  
190 - // params: {  
191 - // param,  
192 - // appop: 'XY_UFO_PRD_LIST_SCREEN_C'  
193 - // }  
194 - // });  
195 - // }  
196 } 194 }
197 }; 195 };
198 </script> 196 </script>
@@ -32,16 +32,16 @@ @@ -32,16 +32,16 @@
32 </cube-slide> 32 </cube-slide>
33 <div class="primary"> 33 <div class="primary">
34 <div> 34 <div>
35 - <p class="price">¥{{info.price}}</p> 35 + <p class="price">¥{{info.price}} <span>全新¥{{info.newProductPrice}}</span><span class="red"> 省¥{{info.savePrice}}</span></p>
36 <p class="size">{{info.sizeName}}</p> 36 <p class="size">{{info.sizeName}}</p>
37 </div> 37 </div>
38 - <p class="name">{{info.productName}} {{info.colorName}} {{info.describeInfo}}</p> 38 + <p class="name">{{info.productName}} {{info.colorName}} {{info.productCode}}</p>
39 </div> 39 </div>
40 <div class="other-info"> 40 <div class="other-info">
41 <p>{{info.gender}} {{info.brandName}}</p> 41 <p>{{info.gender}} {{info.brandName}}</p>
42 <p>状况：{{ info.shoeQualityDesc }}</p> 42 <p>状况：{{ info.shoeQualityDesc }}</p>
43 <p>鞋盒：{{ info.shoeBoxDesc }}</p> 43 <p>鞋盒：{{ info.shoeBoxDesc }}</p>
44 - <p>售出时间：{{ info.soldTime }}</p> 44 + <p v-show="info.soldTime">售出时间：{{ info.soldTime }}</p>
45 <p>{{ info.describeInfo }}</p> 45 <p>{{ info.describeInfo }}</p>
46 </div> 46 </div>
47 <div class="extra-card" @click="$router.push({name: 'ProductDetail', params: { productId: info.productId } })"> 47 <div class="extra-card" @click="$router.push({name: 'ProductDetail', params: { productId: info.productId } })">
@@ -54,7 +54,8 @@ @@ -54,7 +54,8 @@
54 </div> 54 </div>
55 </LayoutScroll> 55 </LayoutScroll>
56 <div class="fixed-footer"> 56 <div class="fixed-footer">
57 - <cube-button class="buy active" @click="buy">购买 <span class="price">¥{{info.price}}</span></cube-button> 57 + <cube-button v-if="info.status===1" class="active" @click="buy">购买 <span class="price">¥{{info.price}}</span></cube-button>
  58 + <cube-button v-else class="disable">商品已售出</cube-button>
58 </div> 59 </div>
59 </LayoutApp> 60 </LayoutApp>
60 </template> 61 </template>
@@ -94,7 +95,12 @@ export default { @@ -94,7 +95,12 @@ export default {
94 name: 'UfoSecondProductDetail', 95 name: 'UfoSecondProductDetail',
95 mixins: [], 96 mixins: [],
96 props: { 97 props: {
97 - skup: Number 98 + skup: Number,
  99 + yasParams: {
  100 + TAB_ID: '',
  101 + TAB_NAME: '',
  102 + PRD_ID: '',
  103 + }
98 }, 104 },
99 // 服务端渲染函数 105 // 服务端渲染函数
100 asyncData({store, router}) { 106 asyncData({store, router}) {
@@ -112,11 +118,11 @@ export default { @@ -112,11 +118,11 @@ export default {
112 created() {}, 118 created() {},
113 mounted() {}, 119 mounted() {},
114 activated() { 120 activated() {
115 - // console.log('mounted', this.info); 121 + console.log(this.info);
  122 +
116 this.fetchDetailById({ skup: this.skup }) 123 this.fetchDetailById({ skup: this.skup })
117 this.refresh(); 124 this.refresh();
118 125
119 -  
120 /* 126 /*
121 [二手商品详情页打开时] 127 [二手商品详情页打开时]
122 1.FP_NAME：来源页面名称；eg：XY_UFO... 128 1.FP_NAME：来源页面名称；eg：XY_UFO...
@@ -126,16 +132,18 @@ export default { @@ -126,16 +132,18 @@ export default {
126 5.PRD_ID：商品id； 132 5.PRD_ID：商品id；
127 6.PRD_TYPE：1-二手，2-全新瑕疵； 133 6.PRD_TYPE：1-二手，2-全新瑕疵；
128 */ 134 */
  135 + // let { TAB_ID, TAB_NAME, PRD_ID } = this.yasParams;
  136 +
129 this.$store.dispatch('reportYas', { 137 this.$store.dispatch('reportYas', {
130 params: { 138 params: {
131 appop: 'XY_UFO_PRD_DT_INFO', 139 appop: 'XY_UFO_PRD_DT_INFO',
132 param:{ 140 param:{
133 FP_NAME: `XY_UFO${this.$route.name}`, 141 FP_NAME: `XY_UFO${this.$route.name}`,
134 FP_PARAM: this.skup, 142 FP_PARAM: this.skup,
135 - TAB_ID: '',  
136 - TAB_NAME: '',  
137 - PRD_ID: this.$route.query.pid,  
138 - PRD_TYPE: this.info.describeInfo 143 + TAB_ID: this.yasParams?.TAB_ID,
  144 + TAB_NAME: this.yasParams?.TAB_NAME,
  145 + PRD_ID: this.yasParams?.PRD_ID,
  146 + PRD_TYPE: this.info.sechondHandTypeName == '全新瑕疵' ? 2 :1
139 } 147 }
140 } 148 }
141 }); 149 });
@@ -168,9 +176,9 @@ export default { @@ -168,9 +176,9 @@ export default {
168 appop: 'XY_UFO_PRD_DT_BUY_SEL_C', 176 appop: 'XY_UFO_PRD_DT_BUY_SEL_C',
169 param:{ 177 param:{
170 P_NAME: `XY_UFO${this.$route.name}`, 178 P_NAME: `XY_UFO${this.$route.name}`,
171 - PRD_ID: this.$route.query.pid, 179 + PRD_ID: this.yasParams?.pid,
172 PRD_SIZE: this.info.sizeName, 180 PRD_SIZE: this.info.sizeName,
173 - ORD_TYPE: this.info.describeInfo 181 + ORD_TYPE: this.info.sechondHandTypeName == '全新瑕疵' ? 2 :1
174 } 182 }
175 } 183 }
176 }); 184 });
@@ -190,7 +198,7 @@ export default { @@ -190,7 +198,7 @@ export default {
190 PRD_ID: this.info.productId, 198 PRD_ID: this.info.productId,
191 PRD_SKU: this.skup, 199 PRD_SKU: this.skup,
192 PRD_SIZE: this.info.size_name, 200 PRD_SIZE: this.info.size_name,
193 - ORD_TYPE: this.info.sechondHandTypeName === '二手' ? 5 : 6, 201 + ORD_TYPE: this.info.sechondHandTypeName == '全新瑕疵' ? 2 :1
194 }, 202 },
195 }, 203 },
196 }); 204 });
@@ -282,6 +290,13 @@ export default { @@ -282,6 +290,13 @@ export default {
282 font-size: 36px; 290 font-size: 36px;
283 letter-spacing: 2px; 291 letter-spacing: 2px;
284 } 292 }
  293 + & > span {
  294 + font-size: 24px;
  295 + color: #000;
  296 + &.red {
  297 + color: #D0021B;
  298 + }
  299 + }
285 } 300 }
286 .size { 301 .size {
287 font-size: 32px; 302 font-size: 32px;
@@ -365,6 +380,12 @@ export default { @@ -365,6 +380,12 @@ export default {
365 letter-spacing: 2px; 380 letter-spacing: 2px;
366 } 381 }
367 } 382 }
  383 + .disable {
  384 + background: #ddd;
  385 + color: #999;
  386 + border-color: #ddd;
  387 + font-size: 32px;
  388 + }
368 } 389 }
369 390
370 </style> 391 </style>
@@ -4,6 +4,7 @@ export default [{ @@ -4,6 +4,7 @@ export default [{
4 component: () => import(/* webpackChunkName: "second" */ './detail'), 4 component: () => import(/* webpackChunkName: "second" */ './detail'),
5 props({params}) { 5 props({params}) {
6 return { 6 return {
  7 + ...params,
7 skup: parseInt(params.skup, 10), 8 skup: parseInt(params.skup, 10),
8 }; 9 };
9 }, 10 },
@@ -43,7 +43,7 @@ @@ -43,7 +43,7 @@
43 v-if="productList.length" 43 v-if="productList.length"
44 class="product-list" 44 class="product-list"
45 > 45 >
46 - <SecondList :list="productList"></SecondList> 46 + <SecondList :list="productList" :yasParams="yasParams"></SecondList>
47 </LayoutScroll> 47 </LayoutScroll>
48 <!-- <EmptyList class="empty-wrapper product-list" :tip="`暂无数据`" v-show="productList.isEmpty" /> --> 48 <!-- <EmptyList class="empty-wrapper product-list" :tip="`暂无数据`" v-show="productList.isEmpty" /> -->
49 </LayoutApp> 49 </LayoutApp>
@@ -137,6 +137,7 @@ export default { @@ -137,6 +137,7 @@ export default {
137 } 137 }
138 if (type==='shaixuanConfirm') { 138 if (type==='shaixuanConfirm') {
139 queryOptions.second_type = sort; 139 queryOptions.second_type = sort;
  140 + console.log(queryOptions.second_type);
140 } 141 }
141 142
142 this.$set(this.queryOptions, 'sort', queryOptions.sort); 143 this.$set(this.queryOptions, 'sort', queryOptions.sort);
@@ -202,7 +203,7 @@ export default { @@ -202,7 +203,7 @@ export default {
202 */ 203 */
203 204
204 let yasParam = { 205 let yasParam = {
205 - // P_NAME: `XY_UFO${this.$route.name}`, 206 + P_NAME: `XY_UFO${this.$route.name}`,
206 TYPE_ID: 5, 207 TYPE_ID: 5,
207 P_PARAM: this.$route.query.pid, 208 P_PARAM: this.$route.query.pid,
208 TAB_ID: null, 209 TAB_ID: null,
@@ -236,6 +237,38 @@ export default { @@ -236,6 +237,38 @@ export default {
236 ...mapState('product', ["selectedProductInfo"]), 237 ...mapState('product', ["selectedProductInfo"]),
237 computePageTitle() { 238 computePageTitle() {
238 return this.selectedProductInfo.product.product_name 239 return this.selectedProductInfo.product.product_name
  240 + },
  241 + yasParams() {
  242 + /*
  243 + 1.P_NAME：页面名称，XY_UFO...
  244 + 2.TYPE_ID：列表页入口类型，1-搜索结果页，2-系列，3-品牌，4-商品池；5-二手；
  245 + 3.P_PARAM：列表入口页面参数，搜索关键词，系列ID，品牌ID，商品池ID；
  246 + 4.TAB_ID：tab切id，2-价格，4-推荐；
  247 + 5.TAB_NAME：tab切名称，价格，推荐；
  248 + 6.I_INDEX：曝光顺序；
  249 + 7.PRD_ID：商品id；
  250 + 8.PRD_TYPE：1-二手，2-全新瑕疵；
  251 + */
  252 + let _yasParams = {
  253 + P_NAME: `XY_UFO${this.$route.name}`,
  254 + TYPE_ID: 5,
  255 + P_PARAM: null,
  256 + TAB_ID: null,
  257 + TAB_NAME: null,
  258 + I_INDEX: null,
  259 + PRD_ID: this.$route.query.pid,
  260 + PRD_TYPE: this.queryOptions.second_type===5 ? 2 : 1
  261 + }
  262 +
  263 + if (this.queryOptions.sort===null) {
  264 + _yasParams.TAB_ID = 5
  265 + _yasParams.TAB_NAME = '推荐'
  266 + } else {
  267 + _yasParams.TAB_ID = 2
  268 + _yasParams.TAB_NAME = '价格'
  269 + }
  270 +
  271 + return _yasParams;
239 } 272 }
240 }, 273 },
241 watch: {}, 274 watch: {},