3065

api/goods.js

@@ -0,0 +1,26 @@
+const {request} = require("../request/index")
+
+// 商品列表
+export const getAnnounce = function(data) {
+    return request({
+        url: '/goods/index',
+        method: 'GET',
+        data
+    })
+}
+// 商铺信息
+export const storeInfo = function(data) {
+    return request({
+        url: '/goods/merchantInfo',
+        method: 'GET',
+        data
+    })
+}
+// 兑换
+export const exchange = function (data) {
+    return request({
+        url: '/goods/exchange',
+        method: 'POST',
+        data
+    })
+}

components/GoodsInfo/index.js

@@ -0,0 +1,36 @@
+// components/GoodsInfo/index.js
+Component({
+    /**
+     * 组件的属性列表
+     */
+    properties: {
+        dataSource:{
+            type:Object,
+            value:{},
+        }
+    },
+
+    /**
+     * 组件的初始数据
+     */
+    data: {
+        detail: {},
+        coverImage: ''
+    },
+    observers: {
+        'dataSource'(value) {
+            if(value) {
+               let detail = this.data.detail
+               detail = {...value}
+               detail.coverImage = value.goodsImage.split(',')[0]
+               this.setData({ detail })
+            }
+        }
+    },
+    /**
+     * 组件的方法列表
+     */
+    methods: {
+
+    }
+})

components/GoodsInfo/index.json

@@ -0,0 +1,4 @@
+{
+    "component": true,
+    "usingComponents": {}
+}

components/GoodsInfo/index.wxml

@@ -0,0 +1,11 @@
+<!--components/GoodsInfo/index.wxml-->
+<view class="info_container">
+    <image class="goods_image" src="{{detail.coverImage}}"></image>
+    <view class="goods_info">
+        <view class="goods_desc">{{detail.goodsName}}</view>
+        <view class="goods_points">
+            <text style="color: #FC8202;font-size: 38rpx;">{{detail.goodsPoints}}</text>
+            <text> 积分</text>
+        </view>
+    </view>
+</view>

components/GoodsInfo/index.wxss

@@ -0,0 +1,37 @@
+/* components/GoodsInfo/index.wxss */
+.info_container {
+    width: 100%;
+    max-height: 400rpx;
+    padding: 27rpx 20rpx;
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+    align-items: center;
+    background-color: #ffffff;
+    overflow: hidden;
+}
+.goods_image {
+    width: 245rpx;
+    height: 212rpx;
+    flex-shrink: 0;
+}
+.goods_info {
+    width: 100%;
+    margin-top: 30rpx;
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+    align-items: flex-start;
+}
+.goods_desc {
+    width: 100%;
+    font-size: 30rpx;
+    font-weight: bold;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
+}
+.goods_points {
+    margin-top: 10rpx;
+    font-size: 28rpx;
+}

package_A/pages/goods-page/index.js

@@ -0,0 +1,60 @@
+// package_A/pages/goods-page/index.js
+import {getUserData} from '../../../api/login.js'
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+        list: [],
+        // 列表数据筛选条件
+        params: {
+            goodsName: ''
+        },
+        goodsName: '',
+        current: "/goods/index",
+        // 用户信息
+        userInfo: {}
+    },
+    onShow() {
+        this.getUserInfo()
+    },
+
+    // 获取
+    getUserInfo() {
+        const params = {}
+        params.tenantId = wx.getStorageSync('tenant').tenantId
+        params.openid = wx.getStorageSync('openid')
+        getUserData(params).then(success=> {
+            const userInfo = success.data
+            wx.setStorage({
+                key: 'userInfo',
+                data:userInfo
+            })
+            this.setData({userInfo})
+        })
+    },
+
+     /* 输入商品名称搜索 */
+     search(e) {
+        let params = this.data.params
+        params.goodsName = this.data.goodsName
+        this.setData({ params })
+    },
+    /* 更新数据 */
+    updateList(e) {
+        let list = this.data.list.concat(e.detail || [])
+        this.setData({ list })
+    },
+    /* 重置数据 */
+    resetList() {
+        this.setData({ list: [] })
+    },
+      /* 跳转至详情页 */
+      showDetail(e) {
+        let data = e.currentTarget.dataset.item
+        wx.navigateTo({
+          url: '/package_A/pages/goods-detail/index?data='+ encodeURIComponent(JSON.stringify(data)),
+        })
+    }
+})

package_A/pages/goods-page/index.json

@@ -0,0 +1,8 @@
+{
+    "usingComponents": {
+        "list": "../../../components/List/index",
+        "GoodsInfo": "../../../components/GoodsInfo/index"
+    },
+    "navigationBarTitleText": "积分商城",
+    "navigationBarBackgroundColor": "#D9E6FE"
+}

package_A/pages/goods-page/index.wxml

@@ -0,0 +1,22 @@
+<!--package_A/pages/goods-page/index.wxml-->
+<view class="store_container">
+    <!-- 积分展示 -->
+    <view class="store_head">
+        <view class="head_left">
+            <text style="font-size:30rpx;margin-bottom: 15rpx;">我的积分</text>
+            <text style="font-size: 82rpx;font-weight: bold;">{{userInfo.mallPoints}}</text>
+        </view>
+        <image class="head_img" src="../../img/store_bg.png"></image>
+    </view>
+    <!-- 搜索 -->
+    <view class="search_box">
+        <input class="goods_search" type="text" placeholder="请输入搜索的商品名称" model:value="{{goodsName}}" placeholder-class="placeholder-style" bindconfirm="search" bindblur="search"/>
+        <image class="search_icon" src="../../img/search.png"></image>
+    </view>
+    <!-- 列表 -->
+    <list id="list" class="goods_list" url="{{current}}" bind:update-list="updateList" list="{{list}}" bind:reset-list="resetList" params="{{params}}">
+        <view class="goods_item" data-item="{{item}}" bindtap="showDetail" wx:for="{{list}}" wx:key="index">
+            <GoodsInfo dataSource="{{item}}"></GoodsInfo>
+        </view>
+    </list>
+</view>

package_A/pages/goods-page/index.wxss

@@ -0,0 +1,69 @@
+/* package_A/pages/goods-page/index.wxss */
+.store_container {
+    width: 100%;
+    min-height: 100vh;
+    padding: 30rpx;
+    background: linear-gradient(0deg, #F2F6F9 30%, #D9E6FE);
+}
+.store_head {
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
+.head_left {
+    height: 100%;
+    padding: 0 0 40rpx 20rpx;
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-end;
+    align-items: flex-start;
+}
+.head_img {
+    width: 326rpx;
+    height: 259rpx;
+}
+.search_box {
+    width: 100%;
+    margin-top: 15rpx;
+    padding: 15rpx 25rpx;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    border: 1rpx solid #959595;
+    border-radius: 32rpx;
+}
+.goods_search {
+    flex: 1;
+    font-size: 30rpx;
+}
+.placeholder-style {
+    font-size: 30rpx;
+    color: #A6A6A6;
+}
+.search_icon{
+    height: 34rpx;
+    width: 34rpx;
+    margin-left: 10rpx;
+}
+/* 列表样式 */
+.goods_list {
+    width: 100%;
+    height: calc(100vh - 400rpx);
+    margin-top: 30rpx;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-between;
+    align-content: flex-start;
+}
+.goods_item {
+    width: 48%;
+    max-height: 400rpx;
+    margin-bottom: 30rpx;
+}
+scroll-view {
+    display: flex !important;
+    flex-wrap: wrap !important;
+    justify-content: space-between !important; 
+    align-content: flex-start !important;
+}