小程序：首页按钮功能完成；个人中心、生活物资页框架；体温上报定位权限获取失败提示信息；删除部分无用代码；

weixin-miniprogram/pages/shop/components/good-list-card.js

@@ -0,0 +1,37 @@
+// pages/shop/components/good-list-card.js
+Component({
+  // refer: https://developers.weixin.qq.com/miniprogram/dev/reference/api/Component.html
+
+  /**
+   * 组件的属性列表
+   */
+  properties: {
+    goodinfo: {
+      type: Object,
+    }
+  },
+
+  /**
+   * 组件的初始数据
+   */
+  data: {
+    displayGoodsInfo: "",
+    displayInfo: "",
+  },
+
+  observers: {
+    'goodinfo': function (goodinfo) {
+      console.log("observers -> goodinfo", goodinfo)
+      this.setData({
+        displayGoodsInfo: JSON.stringify(this.properties.goodinfo)
+      })
+    }
+  },
+
+  /**
+   * 组件的方法列表
+   */
+  methods: {
+
+  }
+})

weixin-miniprogram/pages/shop/components/good-list-card.json

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

weixin-miniprogram/pages/shop/components/good-list-card.wxml

@@ -0,0 +1,22 @@
+<!--pages/shop/components/good-list-card.wxml-->
+<view class="good-card-container">
+  <!-- <view class="good-card-image" style="background-image: url('../../../image/home.jpg');">
+  </view> -->
+  <view class="good-card-image" style="background-image: {{ 'url(' + goodinfo.picUrl + ');'}};">
+  </view>
+  <view class="good-card-info">
+    <text class="good-title line-wrap">{{ goodinfo.goodsName }}</text>
+    <view class="good-price good-price-counter">
+      <!-- 原价 -->
+      <view class="good-price-symbol">¥</view>
+      <view class="good-price-number">{{ goodinfo.counterPrice }}</view>
+    </view>
+    <view class="good-price good-price-retail">
+      <!-- 售价 -->
+      <view style="height:0.12em;" class="good-price-line"></view>
+      <view class="good-price-symbol">¥</view>
+      <view class="good-price-number">{{ goodinfo.retailPrice }}</view>
+    </view>
+    <!-- <text class="line-wrap">{{ displayGoodsInfo }}</text> -->
+  </view>
+</view>

weixin-miniprogram/pages/shop/components/good-list-card.wxss

@@ -0,0 +1,82 @@
+/* pages/shop/components/good-list-card.wxss */
+.good-card-container {
+  /* background-color: violet; */
+  overflow: hidden;
+  display: grid;
+  height: 200px;
+  grid-template-rows: auto 58px;
+}
+
+.good-card-image {
+  background-color: bisque;
+  background-position: center;
+  background-repeat: no-repeat;
+  background-size: cover;
+  overflow: hidden;
+  width: 100%;
+  height: 100%;
+}
+
+.good-card-info {
+  padding: 4.5px 6px;
+}
+
+/* 自动换行 */
+.line-wrap {
+  width: 100%;
+  word-break: break-word;
+  display: block;
+}
+
+/* 商品标题 */
+.good-title {
+  font-size: 28rpx;
+  color: #333;
+  font-weight: 400;
+  height: 36rpx;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  overflow: hidden;
+  word-break: break-word;
+  line-height: 36rpx;
+  margin: 4rpx 0;
+}
+
+/* 商品价格 */
+.good-price {
+  white-space: nowrap;
+  font-weight: 700;
+  margin: 0;
+  display: inline;
+  position: relative;
+}
+
+.good-price-counter {
+  color: #fa4126;
+  font-size: 36rpx;
+}
+
+.good-price-retail {
+  color: #bbbbbb;
+  font-size: 24rpx;
+  margin: 0 0 0 8rpx;
+}
+
+.good-price .good-price-symbol {
+  font-size: 24rpx;
+  display: inline;
+}
+
+.good-price .good-price-number {
+  display: inline;
+}
+
+.good-price .good-price-line {
+  position: absolute;
+  top: 50%;
+  left: 0;
+  right: 0;
+  transform: translateY(-50%);
+  margin: 0;
+  background-color: currentColor;
+}

weixin-miniprogram/pages/shop/shop.js

@@ -0,0 +1,122 @@
+// pages/shop/shop.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    sidebarActiveId: -1,
+    sidebarList: [
+      {
+        id: -1,
+        title: "全部分类",
+      },
+      {
+        id: 1,
+        title: "1",
+      },
+      {
+        id: 2,
+        title: "防疫物资",
+      },
+      {
+        id: 3,
+        title: "111",
+      },
+      {
+        id: 4,
+        title: "111",
+      },
+      {
+        id: 5,
+        title: "111",
+      },
+    ],
+
+    tabbarList: [
+      {
+        id: 1,
+        goodsName: "温度计",
+        counterPrice: "10.00",
+        retailPrice: "12.00",
+        picUrl: "https://cdn-we-retail.ym.tencent.com/tsr/goods/gh-2b.png?imageMogr2/thumbnail/320x320/quality/70/strip/format/webp",
+      },
+      {
+        id: 2,
+        goodsName: "医用口罩",
+        counterPrice: "100.00",
+        retailPrice: "12.50",
+        picUrl: "https://cdn-we-retail.ym.tencent.com/tsr/goods/muy-3a.png?imageMogr2/thumbnail/320x320/quality/70/strip/format/webp",
+      }
+    ]
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad(options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {
+
+  },
+
+
+  sidebarItemTap(event) {
+    // 清除原来的选中项，并设置新的选中项
+    // console.log("event.target", event.target)
+    // console.log("event.currentTarget", event.currentTarget)
+    let dataset = event.currentTarget.dataset
+    console.log("dataset", dataset)
+    this.setData({
+      sidebarActiveId: dataset.item.id,
+    })
+    return
+  }
+})

weixin-miniprogram/pages/shop/shop.json

@@ -0,0 +1,6 @@
+{
+  "usingComponents": {
+    "listcard":"./components/good-list-card"
+  },
+  "navigationBarTitleText": "生活物资"
+}

weixin-miniprogram/pages/shop/shop.wxml

@@ -0,0 +1,17 @@
+<!--pages/shop/shop.wxml-->
+<view class="container">
+  <!-- sidebar -->
+  <view class="sidebar">
+    <view class="sidebar-item {{ cate.id == sidebarActiveId ? 'active' : 'deactive' }}" wx:for="{{sidebarList}}" wx:for-item="cate" wx:key="id" bindtap="sidebarItemTap" data-item="{{cate}}" data-item2="aaa">
+      <text class="sidebar-item-text">{{ cate.title }}</text>
+    </view>
+  </view>
+
+  <!-- tabbar -->
+  <view class="tabbar">
+    <view class="tabbar-group">
+      <listcard class="tabbar-item" wx:for="{{tabbarList}}" wx:for-item="item" wx:key="id" goodinfo="{{item}}" />
+    </view>
+    <view class="no-more">没有更多啦</view>
+  </view>
+</view>

weixin-miniprogram/pages/shop/shop.wxss

@@ -0,0 +1,71 @@
+/* pages/shop/shop.wxss */
+.container {
+  /* background-color: aqua; */
+  height: 100vh;
+  margin: 0;
+  padding: 0;
+
+  display: grid;
+  grid-template-columns: 98px 1fr;
+  overflow-y: hidden;
+}
+
+.sidebar {
+  background-color: #e7e7e7;
+  display: grid;
+  grid-template-rows: repeat(auto-fill, 50px);
+  grid-auto-flow: row dense;
+  overflow-y: auto;
+}
+
+.sidebar-item {
+  background-color: #F5F5F5;
+  /* border-bottom: 1px solid rgb(121, 121, 121); */
+  height: 100%;
+  display: table;
+}
+
+.sidebar-item:last-child {
+  border-bottom: none;
+}
+
+.sidebar-item-text {
+  display: table-cell;
+  vertical-align: middle;
+  text-align: center;
+}
+
+.sidebar-item.active {
+  background-color: white;
+  font-weight: bold;
+  color: #FF764E;
+  border-left: 4px solid #FF764E;
+}
+
+.tabbar {
+  overflow-y: auto;
+}
+
+.tabbar-group {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  grid-template-rows: repeat(auto-fill, 210px);
+  grid-auto-flow: row dense;
+  place-items: center;
+  gap: 3px 10px;
+  margin: 6px;
+}
+
+.tabbar-item {
+  width: 100%;
+  display: inline-block;
+  overflow: hidden;
+  border-radius: 6px;
+  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, .2);
+}
+
+.no-more {
+  text-align: center;
+  color:grey;
+  margin: 20px;
+}