修改前端样式效果

mobile-web/src/page/product/detail.vue

@@ -292,6 +292,20 @@
           }
         });
       },
+        initHasUserSpuFavorite(spuId){
+            if (!checkLogin()) {
+                this.hasCollectionType = 0;
+                return;
+            }
+            //初始化验证商品收藏
+            hasUserSpuFavorite(spuId).then(data => {
+                let hasCollection = data;
+                // alert("是否收藏==" + hasCollection);
+                if (hasCollection) {
+                    this.hasCollectionType = 1;
+                }
+            });
+        },
 
       onClickCart() {
         this.$router.push('/cart');
@@ -430,6 +444,7 @@
             // 初始化 attrValueMap
             this.attrValueMap.set(attr.attrValueId, attr.attrValueName);
           }
+
         }
         // debugger;
         this.vanSku = vanSku;
@@ -439,6 +454,9 @@
         this.initialSku.quantity = 1;
         // 执行 sku 价格计算
         this.doCalcSkuPrice(this.initialSku.id);
+
+        this.initHasUserSpuFavorite(id);
+
       });
       // 获得购物车数量
       if (checkLogin()) {
@@ -453,7 +471,7 @@
 <style lang="less">
   .goods {
       .active {
-          color: #e50f3d;
+          color: #f44;
       }
     padding-bottom: 50px;
 

mobile-web/src/page/user/favorite/list.vue

 <template>
-<div>
-    <headerNav title="我的收藏"/>
-    <van-list
-        v-model="loading"
-        :finished="finished"
-        @load="onLoad"
+    <div>
+        <headerNav title="我的收藏"/>
+        <van-list
+                v-model="loading"
+                :finished="finished"
+                @load="onLoad"
         >
-        <div v-for="(item,index) in list" :key="index">
-<!--            <van-swipe-cell :right-width="65" :on-close="onClose(item)">-->
-<!--                <product-card :product='item' />-->
-<!--                    <span>{{item.spuName}}</span>-->
-<!--                    <span slot="right" >删除</span>-->
-<!--                </van-swipe-cell>-->
-            <van-card
-                    :price="formatPrice(item.price)"
-                    :desc="item.sellPoint"
-                    :title="item.spuName"
-                    :thumb="item.spuImage"
-            />
-        </div>
-    </van-list>
-</div>
+            <div v-for="(item,index) in list" :key="index">
+                <van-swipe-cell :right-width="65" :on-close="onClose(item)">
+                    <van-card
+                            :price="formatPrice(item.price)"
+                            :desc="item.sellPoint"
+                            :title="item.spuName"
+                            :thumb="item.spuImage"
+                            @click="skipProductSpuInfo(item.spuId)"
+                    >
+                    </van-card>
+                    <template slot="right">
+                        <van-button square type="danger" text="删除"/>
+                    </template>
+
+                </van-swipe-cell>
+            </div>
+        </van-list>
+    </div>
 </template>
 
 <script>
-    // import { Card } from 'vant';
-import { GetFavoritePage ,DelFavorite} from "../../../api/user.js";
-
-// Vue.use(Card);
-export default {
-    data(){
-        return{
-            loading:false,
-            finished:false,
-            list:[],
-            page:0,
-            pageSize:10
-        }
-    },
-    methods:{
-        formatPrice(data) {
-            return (data / 100).toFixed(2);
+    import {GetFavoritePage, DelFavorite} from "../../../api/user.js";
+    export default {
+        data() {
+            return {
+                loading: false,
+                finished: false,
+                list: [],
+                page: 0,
+                pageSize: 10
+            }
         },
-        onClose(item){
-            return function(clickPosition, instance) {
-                switch (clickPosition) {
-                    case 'left':
-                    case 'cell':
-                    case 'outside':
-                    instance.close();
-                    break;
-                    case 'right':
-                        this.$dialog.confirm({
-                            message: '确定删除吗？'
-                        }).then(() => {
-                            DelFavorite(item.spuId).then(response=>{
-                                this.$toast('删除成功');
-                                this.$router.go(0);
-                            })
+        methods: {
+            formatPrice(data) {
+                return (data / 100).toFixed(2);
+            },
+            skipProductSpuInfo(data) {
+                // return getProductSpuInfo(data);
+                this.$router.push('/product/'+data);
+            },
+            onClose(item) {
+                return function (clickPosition, instance) {
+                    switch (clickPosition) {
+                        case 'left':
+                        case 'cell':
+                        case 'outside':
                             instance.close();
-                        }).catch(() => {
-                        // on cancel
-                        });
-                    break;
+                            break;
+                        case 'right':
+                            this.$dialog.confirm({
+                                message: '确定删除吗？'
+                            }).then(() => {
+                                DelFavorite(item.spuId).then(response => {
+                                    this.$toast('删除成功');
+                                    this.$router.go(0);
+                                })
+                                instance.close();
+                            }).catch(() => {
+                                // on cancel
+                            });
+                            break;
+                    }
                 }
+            },
+            onLoad() {
+                let pageNo = this.page + 1;
+                GetFavoritePage(pageNo, this.pageSize).then(response => {
+                    this.page = pageNo;
+                    this.list.push(...response.list);
+                    // response.list.forEach(item => {
+                    //     this.list.push(item);
+                    // });
+                    this.loading = false;
+                    if (this.list.length >= response.total) {
+                        this.finished = true;
+                    }
+
+                })
             }
         },
-        onLoad() {
-            let pageNo = this.page + 1;
-            GetFavoritePage(pageNo,this.pageSize).then(response=>{
-                this.page = pageNo;
-                this.list.push(...response.list);
-                // response.list.forEach(item => {
-                //     this.list.push(item);
-                // });
-                this.loading = false;
-                if(this.list.length >= response.total){
-                    this.finished = true;
-                }
-
-            })
-        }
-    },
-}
+    }
 </script>
 
 <style lang="less">
-.van-swipe-cell{
-    &__left,
-    &__right {
-      color: #FFFFFF;
-      font-size: 15px;
-      width: 65px;
-      height: 100px;
-      display: inline-block;
-      text-align: center;
-      line-height: 100px;
-      background-color: #F44;
+    .van-swipe-cell {
+        &__left,
+        &__right {
+            color: #FFFFFF;
+            font-size: 15px;
+            width: 65px;
+            height: 100px;
+            display: inline-block;
+            text-align: center;
+            line-height: 100px;
+            background-color: #F44;
+        }
     }
-}
 </style>