From 5b59e152bf50c554a4f72603abc6d2694adad520 Mon Sep 17 00:00:00 2001
From: wyy <3234929097@qq.com>
Date: Fri, 17 Nov 2023 16:40:44 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E5=88=86=E7=B1=BB=E5=95=86?=
 =?UTF-8?q?=E5=93=81=EF=BC=8C=E8=B4=AD=E7=89=A9=E8=BD=A6=EF=BC=8C=E6=88=91?=
 =?UTF-8?q?=E7=9A=84=EF=BC=8C=E7=99=BB=E5=BD=95=E6=B3=A8=E5=86=8C=E9=A1=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages.json                           |   9 +
 src/pages/accountLogin/accountLogin.scss | 124 +++++++
 src/pages/accountLogin/accountLogin.vue  | 174 ++++++++++
 src/pages/basket/basket.scss             | 368 +++++++++++++++++++++
 src/pages/basket/basket.vue              | 401 ++++++++++++++++++++++-
 src/pages/category/category.scss         | 226 +++++++++++++
 src/pages/category/category.vue          | 171 +++++++++-
 src/pages/index/index.scss               |   2 +-
 src/pages/index/index.vue                |  40 ++-
 src/pages/register/register.scss         | 124 +++++++
 src/pages/register/register.vue          | 166 ++++++++++
 src/pages/sub-category/sub-category.scss | 109 ++++++
 src/pages/sub-category/sub-category.vue  | 178 ++++++++++
 src/pages/user/user.scss                 | 222 +++++++++++++
 src/pages/user/user.vue                  | 374 ++++++++++++++++++++-
 src/utils/http.js                        |  48 ++-
 16 files changed, 2697 insertions(+), 39 deletions(-)
 create mode 100644 src/pages/accountLogin/accountLogin.scss
 create mode 100644 src/pages/accountLogin/accountLogin.vue
 create mode 100644 src/pages/register/register.scss
 create mode 100644 src/pages/register/register.vue
 create mode 100644 src/pages/sub-category/sub-category.scss
 create mode 100644 src/pages/sub-category/sub-category.vue

diff --git a/src/pages.json b/src/pages.json
index 3c42d9d..4216f97 100644
--- a/src/pages.json
+++ b/src/pages.json
@@ -33,6 +33,15 @@
         "navigationBarTitleText": "分类商品",
         "navigationBarTextStyle": "black"
       }
+    },
+    {
+      "path": "pages/sub-category/sub-category"
+    },
+    {
+      "path": "pages/accountLogin/accountLogin"
+    },
+    {
+      "path": "pages/register/register"
     }
   ],
   "tabBar": {
diff --git a/src/pages/accountLogin/accountLogin.scss b/src/pages/accountLogin/accountLogin.scss
new file mode 100644
index 0000000..fdbdd26
--- /dev/null
+++ b/src/pages/accountLogin/accountLogin.scss
@@ -0,0 +1,124 @@
+.con {
+  background: #fff;
+  height: 100%;
+  margin-top: 50px;
+}
+image {
+  display: block;
+  width: 150rpx;
+  height: 150rpx;
+  margin: auto;
+  border-radius: 50%;
+  width: 150rpx;
+  height: 150rpx;
+  margin-bottom: 8%;
+}
+.login-form {
+  width: 90%;
+  margin: 0 auto;
+  margin-bottom: 20%;
+}
+.authorized-btn {
+  width: 90%;
+  margin: 0 auto;
+  text-align: center;
+  background-color: #0ab906;
+  border: 1rpx solid #0ab906;
+  color: #fff;
+  border-radius: 6rpx;
+  font-size: 26rpx;
+  padding: 8rpx;
+  margin-top: 80rpx;
+  border: 1rpx solid #0ab906;
+  border-radius: 6rpx;
+  font-size: 26rpx;
+  padding: 8rpx;
+  margin-top: 80rpx;
+}
+.to-idx-btn {
+  width: 90%;
+  margin: 0 auto;
+  text-align: center;
+  background-color: #eeeeee;
+  color: #333;
+  border-radius: 6rpx;
+  font-size: 26rpx;
+  padding: 8rpx;
+  margin-top: 30rpx;
+  border-radius: 6rpx;
+  font-size: 26rpx;
+  padding: 8rpx;
+  margin-top: 30rpx;
+}
+.form-title {
+  width: 100%;
+  margin-bottom: 50rpx;
+  font-size: 32rpx;
+  text-align: center;
+  color: #00a0e9;
+  margin-bottom: 50rpx;
+  font-size: 32rpx;
+}
+.item {
+  display: block;
+  margin-bottom: 30rpx;
+  margin-bottom: 30rpx;
+}
+.account {
+  display: flex;
+  background: #f8f8f8;
+  padding: 15rpx;
+  box-sizing: border-box;
+  font-size: 26rpx;
+  align-items: center;
+  input {
+    padding-left: 20rpx;
+    width: 75%;
+    padding-left: 20rpx;
+  }
+}
+button {
+  &::after {
+    border: 0 !important;
+  }
+}
+.operate {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.to-register {
+  font-size: 28rpx;
+  color: #00AAFF;
+  font-size: 28rpx;
+}
+.error {
+  .error-text {
+    display: block;
+    width: 100%;
+    font-size: 28rpx;
+    color: #e43130;
+    text-align: left;
+    margin-top: 10rpx;
+    font-size: 28rpx;
+    margin-top: 10rpx;
+    .warning-icon {
+      display: inline-block;
+      color: #fff;
+      width: 26rpx;
+      height: 26rpx;
+      line-height: 26rpx;
+      background: #e43130;
+      border-radius: 50%;
+      text-align: center;
+      margin-right: 12rpx;
+      font-size: 22rpx;
+      width: 26rpx;
+      height: 26rpx;
+      line-height: 26rpx;
+      margin-right: 12rpx;
+      font-size: 22rpx;
+    }
+  }
+}
diff --git a/src/pages/accountLogin/accountLogin.vue b/src/pages/accountLogin/accountLogin.vue
new file mode 100644
index 0000000..f1058d1
--- /dev/null
+++ b/src/pages/accountLogin/accountLogin.vue
@@ -0,0 +1,174 @@
+<template>
+  <view class="con">
+    <image src="@/static/logo.png" />
+    <!-- 登录 -->
+    <view class="login-form">
+      <view :class="['item',errorTips==1? 'error':'']">
+        <view class="account">
+          <text class="input-item">
+            账号
+          </text>
+          <input
+            type="text"
+            data-type="account"
+            placeholder-class="inp-palcehoder"
+            placeholder="请输入用户名"
+            @input="getInputVal"
+          >
+        </view>
+        <view
+          v-if="errorTips==1"
+          class="error-text"
+        >
+          <text class="warning-icon">
+            !
+          </text>
+          请输入账号！
+        </view>
+      </view>
+      <view :class="['item',errorTips==2? 'error':'']">
+        <view class="account">
+          <text class="input-item">
+            密码
+          </text>
+          <input
+            type="password"
+            data-type="password"
+            placeholder-class="inp-palcehoder"
+            placeholder="请输入密码"
+            @input="getInputVal"
+          >
+        </view>
+        <view
+          v-if="errorTips==2"
+          class="error-text"
+        >
+          <text class="warning-icon">
+            !
+          </text>
+          请输入密码！
+        </view>
+      </view>
+      <view class="operate">
+        <view
+          class="to-register"
+          @tap="toRegitser"
+        >
+          还没有账号？
+          <text>去注册></text>
+        </view>
+      </view>
+    </view>
+
+    <view>
+      <button
+        class="authorized-btn"
+        @tap="login"
+      >
+        登录
+      </button>
+      <button
+        class="to-idx-btn"
+        @tap="toIndex"
+      >
+        回到首页
+      </button>
+    </view>
+  </view>
+</template>
+
+<script setup>
+import { encrypt } from '@/utils/crypto.js'
+
+/**
+ * 生命周期函数--监听页面显示
+ */
+onShow(() => {
+  // 头部导航标题
+  uni.setNavigationBarTitle({
+    title: '用户登录'
+  })
+})
+
+const principal = ref('') // 账号
+const errorTips = ref(0) // 错误提示
+watch(
+  () => principal.value,
+  () => {
+    errorTips.value = 0
+  }
+)
+
+const credentials = ref('') // 密码
+/**
+ * 输入框的值
+ */
+const getInputVal = (e) => {
+  const type = e.currentTarget.dataset.type
+  if (type == 'account') {
+    principal.value = e.detail.value
+  } else if (type == 'password') {
+    credentials.value = e.detail.value
+  }
+}
+
+/**
+ * 登录
+ */
+const login = () => {
+  if (principal.value.length == 0) {
+    errorTips.value = 1
+  } else if (credentials.value.length == 0) {
+    errorTips.value = 2
+  } else {
+    errorTips.value = 0
+    // #ifdef H5 || APP-PLUS
+    http.request({
+      url: '/login',
+      method: 'post',
+      data: {
+        userName: principal.value,
+        passWord: encrypt(credentials.value)
+      }
+    })
+      .then(({ data }) => {
+        http.loginSuccess(data, () => {
+          uni.showToast({
+            title: '登录成功',
+            icon: 'none',
+            complete: () => {
+              setTimeout(() => {
+                wx.switchTab({
+                  url: '/pages/index/index'
+                })
+              }, 1000)
+            }
+          })
+        })
+      })
+    // #endif
+  }
+}
+
+/**
+ * 去注册
+ */
+const toRegitser = () => {
+  uni.navigateTo({
+    url: '/pages/register/register'
+  })
+}
+
+/**
+ * 回到首页
+ */
+const toIndex = () => {
+  wx.switchTab({
+    url: '/pages/index/index'
+  })
+}
+</script>
+
+<style scoped lang="scss">
+@import "./accountLogin.scss";
+</style>
diff --git a/src/pages/basket/basket.scss b/src/pages/basket/basket.scss
index e69de29..af6b160 100644
--- a/src/pages/basket/basket.scss
+++ b/src/pages/basket/basket.scss
@@ -0,0 +1,368 @@
+.container {
+  width: 100%;
+  background: #f4f4f4;
+  padding-bottom: 118rpx;
+}
+container {
+  .prod-list {
+    width: 100%;
+    background: #f8f8f8;
+  }
+}
+.prod-list {
+  .prod-block {
+    background: #fff;
+    margin-top: 15rpx;
+    .discount-tips {
+      padding: 20rpx 0 20rpx 20rpx;
+      border-bottom: 2rpx solid #f4f4f4;
+      height: 40rpx;
+      line-height: 40rpx;
+      .text-block {
+        padding: 3rpx 5rpx;
+        border-radius: 8rpx;
+        font-size: 22rpx;
+        color: #eb2444;
+        border: 2rpx solid #eb2444;
+      }
+      .text-list {
+        font-size: 24rpx;
+        margin-left: 10rpx;
+      }
+    }
+  }
+  .item {
+    background: #fff;
+    display: flex;
+    align-items: center;
+    padding: 20rpx;
+    .prodinfo {
+      position: relative;
+      color: #999;
+      width: 100%;
+      &::after {
+        content: '';
+        background-color: #f4f4f4;
+        left: 0;
+        height: 1px;
+        transform-origin: 50% 100% 0;
+        bottom: -20rpx;
+        position: absolute;
+        display: block;
+        width: 642rpx;
+        padding-left: 20rpx;
+      }
+      .pic {
+        text-align: center;
+        width: 180rpx;
+        height: 180rpx;
+        line-height: 180rpx;
+        font-size: 0;
+      }
+    }
+    &:last-child {
+      .prodinfo {
+        &::after {
+          height: 0;
+        }
+      }
+    }
+    .staus {
+      text-align: center;
+      background: rgb(196, 192, 192);
+      font-size: 20rpx;
+      width: 50rpx;
+      color: #fff;
+    }
+    .opt {
+      font-size: 28rpx;
+      margin-left: 20rpx;
+      width: 100%;
+    }
+    .pic {
+      image {
+        max-width: 100%;
+        max-height: 100%;
+        vertical-align: middle;
+      }
+    }
+  }
+  .lose-efficacy {
+    .discount-tips {
+      padding: 20rpx 0;
+      border-bottom: 2rpx solid #ddd;
+      height: 50rpx;
+      line-height: 50rpx;
+      margin-left: 20rpx;
+      .text-list {
+        font-size: 30rpx;
+        margin-left: 10rpx;
+      }
+    }
+  }
+}
+.prodinfo {
+  display: flex;
+  margin-left: 20rpx;
+  .opt {
+    .prod-name {
+      color: #333;
+      max-height: 72rpx;
+      line-height: 36rpx;
+      display: -webkit-box;
+      word-break: break-all;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      -webkit-line-clamp: 2;
+      -webkit-box-orient: vertical;
+    }
+    .prod-info-text {
+      color: #999;
+      display: inline-block;
+      -webkit-line-clamp: 1;
+      height: 48rpx;
+      line-height: 48rpx;
+      background: #f9f9f9;
+      padding: 0 10rpx 0 10rpx;
+      border-radius: 4rpx;
+      margin: 10rpx 0 0rpx 0;
+      overflow: hidden;
+      font-size: 24rpx;
+      position: relative;
+      font-family: arial;
+    }
+    .prod-info-text.empty-n {
+      padding: 0;
+    }
+    .price-count {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      .price {
+        color: #eb2444;
+      }
+    }
+  }
+}
+.prod-info-text {
+  &:before {
+    border-top: 5px solid #aaa;
+  }
+  &:after {
+    border-top: 5px solid #f9f9f9;
+    top: 9px;
+  }
+}
+.lose-efficacy {
+  .prodinfo {
+    .opt {
+      .price-count {
+        .price {
+          color: #999;
+        }
+      }
+    }
+  }
+  margin-top: 20rpx;
+  background: #fff;
+  .item {
+    background: #f8f8f9;
+  }
+  .discount-tips {
+    .empty-prod {
+      color: #777;
+      font-size: 26rpx;
+      border: 2rpx solid #999;
+      padding: 0 10rpx;
+      border-radius: 8rpx;
+      float: right;
+      margin-right: 20rpx;
+    }
+  }
+}
+.m-numSelector {
+  .minus {
+    float: left;
+    box-sizing: border-box;
+    height: 56rpx;
+    border: 2rpx solid #d9d9d9;
+    position: relative;
+    width: 56rpx;
+    border-right: 0;
+    border-top-left-radius: 4rpx;
+    border-bottom-left-radius: 4rpx;
+    &::before {
+      position: absolute;
+      top: 0;
+      left: 0;
+      right: 0;
+      bottom: 0;
+      margin: auto;
+      content: ' ';
+      width: 22rpx;
+      height: 3rpx;
+      background-color: #7f7f7f;
+    }
+  }
+  input {
+    float: left;
+    box-sizing: border-box;
+    height: 56rpx;
+    border: 2rpx solid #d9d9d9;
+    width: 56rpx;
+    text-align: center;
+    color: #333;
+  }
+  .plus {
+    float: left;
+    box-sizing: border-box;
+    height: 56rpx;
+    border: 2rpx solid #d9d9d9;
+    position: relative;
+    width: 56rpx;
+    border-left: 0;
+    border-top-right-radius: 4rpx;
+    border-bottom-right-radius: 4rpx;
+    &::before {
+      position: absolute;
+      top: 0;
+      left: 0;
+      right: 0;
+      bottom: 0;
+      margin: auto;
+      content: ' ';
+      width: 22rpx;
+      height: 3rpx;
+      background-color: #7f7f7f;
+    }
+    &::after {
+      position: absolute;
+      top: 0;
+      left: 0;
+      right: 0;
+      bottom: 0;
+      margin: auto;
+      content: ' ';
+      width: 22rpx;
+      height: 3rpx;
+      background-color: #7f7f7f;
+      transform: rotate(90deg);
+    }
+  }
+  float: right;
+  &:not(.disabled) {
+    .minus {
+      &:not(.disabled) {
+        &:active {
+          background-color: #f4f4f4;
+        }
+      }
+    }
+    .plus {
+      &:not(.disabled) {
+        &:active {
+          background-color: #f4f4f4;
+        }
+      }
+    }
+  }
+}
+checkbox {
+  .wx-checkbox-input {
+    border-radius: 50%;
+    width: 35rpx;
+    height: 35rpx;
+  }
+  .wx-checkbox-input.wx-checkbox-input-checked {
+    background: #eb2444;
+    border-color: #eb2444;
+    &::before {
+      text-align: center;
+      font-size: 22rpx;
+      color: #fff;
+      background: transparent;
+      transform: translate(-50%, -50%) scale(1);
+      -webkit-transform: translate(-50%, -50%) scale(1);
+    }
+  }
+}
+.empty {
+  font-size: 26rpx;
+  color: #aaa;
+  padding-top: 200rpx;
+  .txt {
+    text-align: center;
+    margin-top: 30rpx;
+  }
+  .img {
+    margin-top: 80rpx;
+    text-align: center;
+    image {
+      width: 80rpx;
+      height: 80rpx;
+    }
+  }
+}
+.price-count {
+  .disable-price {
+    color: #999;
+  }
+}
+.cart-footer {
+  position: fixed;
+  bottom: calc(90rpx + env(safe-area-inset-bottom));
+  left: 0;
+  width: 100%;
+  display: flex;
+  flex-direction: row nowrap;
+  height: 98rpx;
+  border-top: 2rpx solid #f4f4f4;
+  z-index: 999;
+  .btn {
+    position: relative;
+    display: flex;
+    flex-grow: 1;
+    justify-content: center;
+    align-items: center;
+    width: 0;
+    background-color: #fafafa;
+    background: rgba(255,255,255,0.95);
+    font-size: 28rpx;
+    .total-msg {
+      font-size: 20rpx;
+    }
+  }
+  .btn.total {
+    display: flex;
+    flex-flow: column;
+    align-items: flex-start;
+    width: 300rpx;
+    .price {
+      color: #eb2444;
+      font-size: 30rpx;
+    }
+  }
+  .btn.del {
+    color: #eb2444;
+    width: 70rpx;
+    font-size: 22rpx;
+    text-align: left;
+    display: block;
+    line-height: 102rpx;
+  }
+  .btn.all {
+    width: 150rpx;
+    font-size: 26rpx;
+    label {
+      display: flex;
+      flex-grow: 1;
+      justify-content: center;
+      align-items: center;
+    }
+  }
+  .btn.settle {
+    width: 200rpx;
+    background: #eb2444;
+    color: #fff;
+  }
+}
diff --git a/src/pages/basket/basket.vue b/src/pages/basket/basket.vue
index d2fd13a..06af999 100644
--- a/src/pages/basket/basket.vue
+++ b/src/pages/basket/basket.vue
@@ -1,5 +1,402 @@
 <template>
-  <view>
-    购物车
+  <view class="container">
+    <view class="prod-list">
+      <block
+        v-for="(item, scIndex) in shopCartItemDiscounts"
+        :key="scIndex"
+      >
+        <view class="prod-block">
+          <view
+            v-if="item.chooseDiscountItemDto"
+            class="discount-tips"
+          >
+            <text class="text-block">
+              {{ wxs.parseDiscount(item.chooseDiscountItemDto.discountRule) }}
+            </text>
+            <text class="text-list">
+              {{
+                wxs.parseDiscountMsg(item.chooseDiscountItemDto.discountRule, item.chooseDiscountItemDto.needAmount, item.chooseDiscountItemDto.discount)
+              }}
+            </text>
+          </view>
+          <block
+            v-for="(prod, index) in item.shopCartItems"
+            :key="index"
+          >
+            <view class="item">
+              <view class="btn">
+                <label>
+                  <checkbox
+                    :data-scindex="scIndex"
+                    :data-index="index"
+                    :value="prod.prodId"
+                    :checked="prod.checked"
+                    color="#105c3e"
+                    @tap="onSelectedItem"
+                  />
+                </label>
+              </view>
+              <view class="prodinfo">
+                <view class="pic">
+                  <image :src="prod.pic" />
+                </view>
+                <view class="opt">
+                  <view class="prod-name">
+                    {{ prod.prodName }}
+                  </view>
+                  <text :class="'prod-info-text ' + (prod.skuName?'':'empty-n')">
+                    {{ prod.skuName }}
+                  </text>
+                  <view class="price-count">
+                    <view class="price">
+                      <text class="symbol">
+                        ￥
+                      </text>
+                      <text class="big-num">
+                        {{ wxs.parsePrice(prod.price)[0] }}
+                      </text>
+                      <text class="small-num">
+                        .{{ wxs.parsePrice(prod.price)[1] }}
+                      </text>
+                    </view>
+                    <view class="m-numSelector">
+                      <view
+                        class="minus"
+                        :data-scindex="scIndex"
+                        :data-index="index"
+                        @tap="onCountMinus"
+                      />
+                      <input
+                        type="number"
+                        :value="prod.prodCount"
+                        disabled
+                      >
+                      <view
+                        class="plus"
+                        :data-scindex="scIndex"
+                        :data-index="index"
+                        @tap="onCountPlus"
+                      />
+                    </view>
+                  </view>
+                </view>
+              </view>
+            </view>
+          </block>
+        </view>
+      </block>
+    </view>
+
+    <view
+      v-if="!shopCartItemDiscounts.length"
+      class="empty"
+    >
+      <view class="img">
+        <image src="@/static/images/tabbar/basket.png" />
+      </view>
+      <view class="txt">
+        您还没有添加任何商品哦~
+      </view>
+    </view>
+
+    <!-- 底部按钮 -->
+    <view
+      v-if="shopCartItemDiscounts.length>0"
+      class="cart-footer"
+    >
+      <view class="btn all">
+        <label @tap="onSelAll">
+          <checkbox
+            :checked="allChecked"
+            color="#f7d731;"
+          />
+          全选</label>
+      </view>
+      <view
+        class="btn del"
+        @tap="onDelBasket"
+      >
+        <text>删除</text>
+      </view>
+      <view class="btn total">
+        <view class="finally">
+          <text>合计:</text>
+          <view class="price">
+            <text class="symbol">
+              ￥
+            </text>
+            <text class="big-num">
+              {{ wxs.parsePrice(finalMoney)[0] }}
+            </text>
+            <text class="small-num">
+              .{{ wxs.parsePrice(finalMoney)[1] }}
+            </text>
+          </view>
+        </view>
+        <view
+          v-if="subtractMoney>0"
+          class="total-msg"
+        >
+          总额:￥{{ wxs.toPrice(totalMoney) }} 立减:￥{{ wxs.toPrice(subtractMoney) }}
+        </view>
+      </view>
+      <view
+        class="btn settle"
+        @tap="toFirmOrder"
+      >
+        <text>结算</text>
+      </view>
+    </view>
+    <!-- end 底部按钮 -->
   </view>
 </template>
+
+<script setup>
+const wxs = number()
+/**
+ * 生命周期函数--监听页面显示
+ */
+onShow(() => {
+  loadBasketData()
+  http.getCartCount() // 重新计算购物车总数量
+})
+
+const allChecked = ref(false)
+const shopCartItemDiscounts = ref([])
+const loadBasketData = () => {
+  uni.showLoading() // 加载购物车
+  http.request({
+    url: '/p/shopCart/info',
+    method: 'POST',
+    data: {}
+  })
+    .then(({ data }) => {
+      if (data.length > 0) {
+      // 默认不选中
+        const shopCartItemDiscountsParam = data[0].shopCartItemDiscounts
+        shopCartItemDiscountsParam.forEach(shopCartItemDiscount => {
+          shopCartItemDiscount.shopCartItems.forEach(shopCartItem => {
+            shopCartItem.checked = false
+          })
+        })
+        shopCartItemDiscounts.value = shopCartItemDiscountsParam
+        allChecked.value = false
+      } else {
+        shopCartItemDiscounts.value = []
+      }
+      calTotalPrice() // 计算总价
+      uni.hideLoading()
+    })
+}
+
+/**
+ * 去结算
+ */
+const toFirmOrder = () => {
+  const shopCartItemDiscountsParam = shopCartItemDiscounts.value
+  const basketIds = []
+  shopCartItemDiscountsParam.forEach(shopCartItemDiscount => {
+    shopCartItemDiscount.shopCartItems.forEach(shopCartItem => {
+      if (shopCartItem.checked) {
+        basketIds.push(shopCartItem.basketId)
+      }
+    })
+  })
+
+  if (!basketIds.length) {
+    uni.showToast({
+      title: '请选择商品',
+      icon: 'none'
+    })
+    return
+  }
+
+  uni.setStorageSync('basketIds', JSON.stringify(basketIds))
+  uni.navigateTo({
+    url: '/pages/submit-order/submit-order?orderEntry=0'
+  })
+}
+
+/**
+ * 全选
+ */
+const onSelAll = () => {
+  let allCheckedParam = allChecked.value
+  allCheckedParam = !allCheckedParam // 改变状态
+  const shopCartItemDiscountsParam = shopCartItemDiscounts.value
+  for (let i = 0; i < shopCartItemDiscountsParam.length; i++) {
+    const cItems = shopCartItemDiscountsParam[i].shopCartItems
+    for (let j = 0; j < cItems.length; j++) {
+      cItems[j].checked = allCheckedParam
+    }
+  }
+  allChecked.value = allCheckedParam
+  shopCartItemDiscounts.value = shopCartItemDiscountsParam
+  calTotalPrice() // 计算总价
+}
+
+/**
+ * 每一项的选择事件
+ * +
+ */
+const onSelectedItem = (e) => {
+  const index = e.currentTarget.dataset.index // 获取data- 传进来的index
+  const scindex = e.currentTarget.dataset.scindex
+  const shopCartItemDiscountsParam = shopCartItemDiscounts.value // 获取购物车列表
+  const checked = shopCartItemDiscountsParam[scindex].shopCartItems[index].checked // 获取当前商品的选中状态
+  shopCartItemDiscountsParam[scindex].shopCartItems[index].checked = !checked // 改变状态
+  shopCartItemDiscounts.value = shopCartItemDiscountsParam
+  checkAllSelected() // 检查全选状态
+  calTotalPrice() // 计算总价
+}
+
+/**
+ * 检查全选状态
+ */
+const checkAllSelected = () => {
+  let allCheckedParam = true
+  const shopCartItemDiscountsParam = shopCartItemDiscounts.value
+  let flag = false
+  for (let i = 0; i < shopCartItemDiscountsParam.length; i++) {
+    const cItems = shopCartItemDiscountsParam[i].shopCartItems
+    for (let j = 0; j < cItems.length; j++) {
+      if (!cItems[j].checked) {
+        allCheckedParam = !allCheckedParam
+        flag = true
+        break
+      }
+    }
+    if (flag) break
+  }
+  allChecked.value = allCheckedParam
+}
+
+const totalMoney = ref(0)
+const subtractMoney = ref(0)
+const finalMoney = ref(0)
+/**
+ * 计算购物车总额
+ */
+const calTotalPrice = () => {
+  const shopCartItemDiscountsParam = shopCartItemDiscounts.value
+  const shopCartIds = []
+  for (let i = 0; i < shopCartItemDiscountsParam.length; i++) {
+    const cItems = shopCartItemDiscountsParam[i].shopCartItems
+    for (let j = 0; j < cItems.length; j++) {
+      if (cItems[j].checked) {
+        shopCartIds.push(cItems[j].basketId)
+      }
+    }
+  }
+  uni.showLoading()
+  http.request({
+    url: '/p/shopCart/totalPay',
+    method: 'POST',
+    data: shopCartIds
+  })
+    .then(({ data }) => {
+      finalMoney.value = data.finalMoney
+      totalMoney.value = data.totalMoney
+      subtractMoney.value = data.subtractMoney
+      uni.hideLoading()
+    })
+}
+
+/**
+ * 减少数量
+ */
+const onCountMinus = (e) => {
+  const index = e.currentTarget.dataset.index
+  const scindex = e.currentTarget.dataset.scindex
+  const shopCartItemDiscountsParam = shopCartItemDiscounts.value
+  const prodCount = shopCartItemDiscountsParam[scindex].shopCartItems[index].prodCount
+  if (prodCount > 1) {
+    updateCount(shopCartItemDiscountsParam, scindex, index, -1)
+  }
+}
+
+/**
+ * 增加数量
+ */
+const onCountPlus = (e) => {
+  const index = e.currentTarget.dataset.index
+  const scindex = e.currentTarget.dataset.scindex
+  const shopCartItemDiscountsParam = shopCartItemDiscounts.value
+  updateCount(shopCartItemDiscountsParam, scindex, index, 1)
+}
+
+/**
+ * 改变购物车数量接口
+ */
+const updateCount = (shopCartItemDiscountsParam, scindex, index, prodCount) => {
+  uni.showLoading({
+    mask: true
+  })
+  http.request({
+    url: '/p/shopCart/changeItem',
+    method: 'POST',
+    data: {
+      count: prodCount,
+      prodId: shopCartItemDiscountsParam[scindex].shopCartItems[index].prodId,
+      skuId: shopCartItemDiscountsParam[scindex].shopCartItems[index].skuId,
+      shopId: 1
+    }
+  })
+    .then(() => {
+      shopCartItemDiscountsParam[scindex].shopCartItems[index].prodCount += prodCount
+      shopCartItemDiscounts.value = shopCartItemDiscountsParam
+      calTotalPrice() // 计算总价
+      uni.hideLoading()
+      http.getCartCount() // 重新计算购物车总数量
+    })
+}
+
+/**
+ * 删除购物车商品
+ */
+const onDelBasket = () => {
+  const shopCartItemDiscountsParam = shopCartItemDiscounts.value
+  const basketIds = []
+  for (let i = 0; i < shopCartItemDiscountsParam.length; i++) {
+    const cItems = shopCartItemDiscountsParam[i].shopCartItems
+    for (let j = 0; j < cItems.length; j++) {
+      if (cItems[j].checked) {
+        basketIds.push(cItems[j].basketId)
+      }
+    }
+  }
+  if (!basketIds.length) {
+    uni.showToast({
+      title: '请选择商品',
+      icon: 'none'
+    })
+  } else {
+    uni.showModal({
+      title: '',
+      content: '确认要删除选中的商品吗？',
+      confirmColor: '#eb2444',
+      success (res) {
+        if (res.confirm) {
+          uni.showLoading({
+            mask: true
+          })
+          http.request({
+            url: '/p/shopCart/deleteItem',
+            method: 'DELETE',
+            data: basketIds
+          })
+            .then(() => {
+              uni.hideLoading()
+              loadBasketData()
+            })
+        }
+      }
+
+    })
+  }
+}
+</script>
+
+<style scoped lang="scss">
+@import "./basket.scss";
+</style>
diff --git a/src/pages/category/category.scss b/src/pages/category/category.scss
index e69de29..80c5d93 100644
--- a/src/pages/category/category.scss
+++ b/src/pages/category/category.scss
@@ -0,0 +1,226 @@
+.container {
+  display: flex;
+  flex-direction: row;
+  height: 100%;
+}
+.main {
+  position: fixed;
+  display: flex;
+  overflow: hidden;
+  margin-top: 100rpx;
+  height: calc(100% - 100rpx);
+}
+.search-bar {
+  width: 100%;
+  position: fixed;
+  top: 0;
+  left: 0;
+  color: #777;
+  background: #fff;
+  box-shadow: 0 2rpx 6rpx rgba(0, 0, 0, 0.07);
+  z-index: 3;
+  padding: 20rpx 0;
+  .arrow {
+    width: 20rpx;
+    height: 20rpx;
+    border-bottom: 2rpx solid #777;
+    border-left: 2rpx solid #777;
+    transform: rotate(45deg);
+    position: absolute;
+    left: 30rpx;
+    top: 41rpx;
+  }
+  .search-box {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 60rpx;
+    background: #f7f7f7;
+    z-index: 999;
+    width: 92%;
+    border-radius: 50rpx;
+    text-align: center;
+    margin: auto;
+    .search-img {
+      width: 32rpx;
+      height: 32rpx;
+      margin-right: 10rpx;
+    }
+  }
+  .search-hint {
+    font-size: 28rpx;
+    position: absolute;
+    right: 30rpx;
+    top: 32rpx;
+  }
+}
+.sear-input {
+  font-size: 28rpx;
+}
+.leftmenu {
+  width: 200rpx;
+  height: 100%;
+  box-sizing: border-box;
+  background-color: #f5f6f7;
+  overflow: scroll;
+  z-index: 2;
+  .ca-empty {
+    padding-top: 400rpx;
+    text-align: center;
+    color: #aaa;
+    font-size: 24rpx;
+  }
+}
+.menu-item {
+  line-height: 90rpx;
+  height: 90rpx;
+  text-align: center;
+  border-bottom: 2rpx silid #e3e3e3;
+  position: relative;
+  color: #777;
+  font-size: 28rpx;
+  text.tips-num {
+    position: absolute;
+    top: 20rpx;
+    right: 15rpx;
+    border-radius: 15rpx;
+    width: 30rpx;
+    height: 30rpx;
+    background: red;
+    color: #fff;
+    font-size: 25rpx;
+    line-height: 30rpx;
+  }
+}
+.menu-item.active {
+  color: #eb2444;
+  font-size: 28rpx;
+  font-weight: bold;
+  position: relative;
+  background: #fff;
+  &:before {
+    position: absolute;
+    left: 0;
+    content: "";
+    width: 8rpx;
+    height: 32rpx;
+    top: 29rpx;
+    background: #eb2444;
+  }
+}
+.rightcontent {
+  width: 550rpx;
+  height: 100%;
+  box-sizing: border-box;
+  background-color: #fff;
+  z-index: 1;
+  .adver-map {
+    width: auto;
+    box-sizing: border-box;
+    overflow: hidden;
+    position: relative;
+    margin: 30rpx 20rpx 0;
+    .item-a {
+      display: block;
+      font-size: 0;
+      width: 100%;
+      image {
+        max-width: 100%;
+      }
+    }
+  }
+  .cont-item {
+    padding: 0 20rpx 20rpx 20rpx;
+    padding-bottom: 94rpx;
+    .show-item {
+      .more-prod-pic {
+        text-align: center;
+        width: 150rpx;
+        height: 150rpx;
+        line-height: 150rpx;
+        font-size: 0;
+        .more-pic {
+          max-width: 100%;
+          max-height: 100%;
+          border-radius: 8rpx;
+          vertical-align: middle;
+        }
+      }
+      position: relative;
+      display: flex;
+      justify-content: flex-start;
+      padding: 20rpx 0;
+      &::after {
+        content: '';
+        background-color: #f4f4f4;
+        left: 0;
+        height: 1px;
+        transform-origin: 50% 100% 0;
+        bottom: 0;
+        position: absolute;
+        display: block;
+        width: 510rpx;
+        padding-left: 20rpx;
+      }
+      .prod-text-right {
+        margin-left: 20rpx;
+        width: 75%;
+        .cate-prod-info {
+          font-size: 22rpx;
+          color: #999;
+          margin: 10rpx 0 20rpx 0;
+          display: -webkit-box;
+          -webkit-box-orient: vertical;
+          -webkit-line-clamp: 1;
+          overflow: hidden;
+        }
+        .prod-text.more {
+          margin: 0;
+          font-size: 28rpx;
+          display: -webkit-box;
+          word-break: break-all;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          display: -webkit-box;
+          -webkit-line-clamp: 1;
+          -webkit-box-orient: vertical;
+          color: #000;
+        }
+        .prod-price.more {
+          font-size: 28rpx;
+          color: #eb2444;
+          font-family: arial;
+        }
+      }
+    }
+  }
+}
+.th-cate-con {
+  display: flex;
+  flex-wrap: wrap;
+}
+.sub-category {
+  width: 33.33%;
+  display: flex;
+  flex-direction: column;
+  padding: 30rpx;
+  box-sizing: border-box;
+  align-items: center;
+}
+.sub-category-item {
+  >.more-pic {
+    width: 120rpx;
+    height: 120rpx;
+    padding-bottom: 10rpx;
+  }
+  text {
+    font-size: 25rpx;
+    word-break: break-word;
+  }
+}
+.cont-item.empty {
+  display: block;
+  font-size: 24rpx;
+  color: #aaa;
+  text-align: center;
+}
diff --git a/src/pages/category/category.vue b/src/pages/category/category.vue
index 5992dc0..21ce88a 100644
--- a/src/pages/category/category.vue
+++ b/src/pages/category/category.vue
@@ -1,5 +1,172 @@
 <template>
-  <view>
-    分类
+  <view class="container">
+    <!-- 头部搜索区 -->
+    <view class="search-bar">
+      <view
+        class="search-box"
+        @tap="toSearchPage"
+      >
+        <image
+          src="/static/images/icon/search.png"
+          class="search-img"
+        />
+        <text class="sear-input">
+          搜索您想要的商品
+        </text>
+      </view>
+    </view>
+    <!-- 滚动内容区 -->
+    <view class="main">
+      <!-- 左侧菜单start -->
+      <scroll-view
+        scroll-y="true"
+        class="leftmenu"
+      >
+        <block
+          v-for="(item, index) in categoryList"
+          :key="index"
+        >
+          <view
+            :class="'menu-item ' + (selIndex==index?'active':'') + ' '"
+            :data-index="index"
+            :data-id="item.categoryId"
+            @tap="onMenuTab"
+          >
+            {{ item.categoryName }}
+          </view>
+        </block>
+        <view
+          v-if="!categoryList || !categoryList.length"
+          class="ca-empty"
+        >
+          {{ categoryList && categoryList.length ? '该分类下暂无商品' : '暂无商品' }}
+        </view>
+      </scroll-view>
+      <!-- 左侧菜单end -->
+
+      <!-- 右侧内容start -->
+      <scroll-view
+        scroll-y="true"
+        class="rightcontent"
+      >
+        <view class="adver-map">
+          <view class="item-a">
+            <image
+              :src="categoryImg"
+              mode="widthFix"
+            />
+          </view>
+        </view>
+        <!-- 子分类 -->
+        <view
+          v-if="subCategoryList.length"
+          class="th-cate-con"
+        >
+          <block
+            v-for="(thCateItem, index) in subCategoryList"
+            :key="index"
+          >
+            <view class="sub-category">
+              <view
+                class="sub-category-item"
+                :data-categoryid="thCateItem.categoryId"
+                :data-parentid="thCateItem.parentId"
+                @tap="toCatePage"
+              >
+                <image
+                  :src="thCateItem.pic"
+                  class="more-pic"
+                  mode="widthFix"
+                />
+                <text>{{ thCateItem.categoryName }}</text>
+              </view>
+            </view>
+          </block>
+        </view>
+        <view
+          v-else
+          class="cont-item empty"
+        >
+          该分类下暂无子分类~
+        </view>
+      </scroll-view>
+      <!-- 右侧内容end -->
+    </view>
   </view>
 </template>
+
+<script setup>
+const categoryList = ref([])
+const subCategoryList = ref([])
+const categoryImg = ref('')
+const parentId = ref('')
+/**
+ * 生命周期函数--监听页面加载
+ */
+onLoad(() => {
+  // 加载分类列表
+  http.request({
+    url: '/category/categoryInfo',
+    method: 'GET',
+    data: {
+      parentId: ''
+    }
+  })
+    .then(({ data }) => {
+      categoryImg.value = data[0].pic
+      categoryList.value = data
+      getProdList(data[0].categoryId)
+      parentId.value = categoryList.value[0].categoryId
+    })
+})
+
+const selIndex = ref(0)
+/**
+ * 分类点击事件
+ */
+const onMenuTab = (e) => {
+  const index = e.currentTarget.dataset.index
+  getProdList(categoryList.value[index].categoryId)
+  parentId.value = categoryList.value[index].categoryId
+  categoryImg.value = categoryList.value[index].pic
+  selIndex.value = index
+}
+
+/**
+ * 跳转搜索页
+ */
+const toSearchPage = () => {
+  uni.navigateTo({
+    url: '/pages/search-page/search-page'
+  })
+}
+
+const getProdList = (categoryId) => {
+  // 加载分类列表
+  http.request({
+    url: '/category/categoryInfo',
+    method: 'GET',
+    data: {
+      parentId: categoryId
+    }
+  })
+    .then(({ data }) => {
+      subCategoryList.value = data
+    })
+}
+
+/**
+ * 跳转子分类商品页面
+ */
+const toCatePage = (e) => {
+  const { parentid, categoryid } = e.currentTarget.dataset
+  uni.navigateTo({
+    url: `/pages/sub-category/sub-category?parentId=${parentid}&categoryId=${categoryid}`
+  })
+}
+
+</script>
+
+<style scoped lang="scss">
+@import "./category.scss";
+</style>
diff --git a/src/pages/index/index.scss b/src/pages/index/index.scss
index 4331c2b..bc6bbbc 100644
--- a/src/pages/index/index.scss
+++ b/src/pages/index/index.scss
@@ -359,7 +359,7 @@ swiper-item {
       position: relative;
       display: flex;
       padding: 20rpx;
-      justify-content: start;
+      justify-content: flex-start;
       border-top: 2rpx solid #f4f4f4;
       .prod-text-right {
         margin-left: 30rpx;
diff --git a/src/pages/index/index.vue b/src/pages/index/index.vue
index c761a25..70a8c77 100644
--- a/src/pages/index/index.vue
+++ b/src/pages/index/index.vue
@@ -445,10 +445,11 @@ const getIndexImgs = () => {
     url: '/indexImgs',
     method: 'GET',
     data: {}
-  }).then(({ data }) => {
-    indexImgs.value = data
-    seq.value = data
   })
+    .then(({ data }) => {
+      indexImgs.value = data
+      seq.value = data
+    })
 }
 
 const getNoticeList = () => {
@@ -457,9 +458,10 @@ const getNoticeList = () => {
     url: '/shop/notice/topNoticeList',
     method: 'GET',
     data: {}
-  }).then(({ data }) => {
-    news.value = data
   })
+    .then(({ data }) => {
+      news.value = data
+    })
 }
 
 /**
@@ -470,14 +472,15 @@ const getTag = () => {
     url: '/prod/tag/prodTagList',
     method: 'GET',
     data: {}
-  }).then(({ data }) => {
-    taglist.value = data
-    for (let i = 0; i < data.length; i++) {
-      updata.value = false
-      updata.value = true
-      getTagProd(data[i].id, i)
-    }
   })
+    .then(({ data }) => {
+      taglist.value = data
+      for (let i = 0; i < data.length; i++) {
+        updata.value = false
+        updata.value = true
+        getTagProd(data[i].id, i)
+      }
+    })
 }
 
 const getTagProd = (id, index) => {
@@ -488,13 +491,14 @@ const getTagProd = (id, index) => {
       tagId: id,
       size: 6
     }
-  }).then(({ data }) => {
-    updata.value = false
-    updata.value = true
-    const taglistParam = taglist.value
-    taglistParam[index].prods = data.records
-    taglist.value = taglistParam
   })
+    .then(({ data }) => {
+      updata.value = false
+      updata.value = true
+      const taglistParam = taglist.value
+      taglistParam[index].prods = data.records
+      taglist.value = taglistParam
+    })
 }
 </script>
 
diff --git a/src/pages/register/register.scss b/src/pages/register/register.scss
new file mode 100644
index 0000000..fdbdd26
--- /dev/null
+++ b/src/pages/register/register.scss
@@ -0,0 +1,124 @@
+.con {
+  background: #fff;
+  height: 100%;
+  margin-top: 50px;
+}
+image {
+  display: block;
+  width: 150rpx;
+  height: 150rpx;
+  margin: auto;
+  border-radius: 50%;
+  width: 150rpx;
+  height: 150rpx;
+  margin-bottom: 8%;
+}
+.login-form {
+  width: 90%;
+  margin: 0 auto;
+  margin-bottom: 20%;
+}
+.authorized-btn {
+  width: 90%;
+  margin: 0 auto;
+  text-align: center;
+  background-color: #0ab906;
+  border: 1rpx solid #0ab906;
+  color: #fff;
+  border-radius: 6rpx;
+  font-size: 26rpx;
+  padding: 8rpx;
+  margin-top: 80rpx;
+  border: 1rpx solid #0ab906;
+  border-radius: 6rpx;
+  font-size: 26rpx;
+  padding: 8rpx;
+  margin-top: 80rpx;
+}
+.to-idx-btn {
+  width: 90%;
+  margin: 0 auto;
+  text-align: center;
+  background-color: #eeeeee;
+  color: #333;
+  border-radius: 6rpx;
+  font-size: 26rpx;
+  padding: 8rpx;
+  margin-top: 30rpx;
+  border-radius: 6rpx;
+  font-size: 26rpx;
+  padding: 8rpx;
+  margin-top: 30rpx;
+}
+.form-title {
+  width: 100%;
+  margin-bottom: 50rpx;
+  font-size: 32rpx;
+  text-align: center;
+  color: #00a0e9;
+  margin-bottom: 50rpx;
+  font-size: 32rpx;
+}
+.item {
+  display: block;
+  margin-bottom: 30rpx;
+  margin-bottom: 30rpx;
+}
+.account {
+  display: flex;
+  background: #f8f8f8;
+  padding: 15rpx;
+  box-sizing: border-box;
+  font-size: 26rpx;
+  align-items: center;
+  input {
+    padding-left: 20rpx;
+    width: 75%;
+    padding-left: 20rpx;
+  }
+}
+button {
+  &::after {
+    border: 0 !important;
+  }
+}
+.operate {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.to-register {
+  font-size: 28rpx;
+  color: #00AAFF;
+  font-size: 28rpx;
+}
+.error {
+  .error-text {
+    display: block;
+    width: 100%;
+    font-size: 28rpx;
+    color: #e43130;
+    text-align: left;
+    margin-top: 10rpx;
+    font-size: 28rpx;
+    margin-top: 10rpx;
+    .warning-icon {
+      display: inline-block;
+      color: #fff;
+      width: 26rpx;
+      height: 26rpx;
+      line-height: 26rpx;
+      background: #e43130;
+      border-radius: 50%;
+      text-align: center;
+      margin-right: 12rpx;
+      font-size: 22rpx;
+      width: 26rpx;
+      height: 26rpx;
+      line-height: 26rpx;
+      margin-right: 12rpx;
+      font-size: 22rpx;
+    }
+  }
+}
diff --git a/src/pages/register/register.vue b/src/pages/register/register.vue
new file mode 100644
index 0000000..c03c8f3
--- /dev/null
+++ b/src/pages/register/register.vue
@@ -0,0 +1,166 @@
+<template>
+  <view class="register">
+    <view class="con">
+      <image src="@/static/logo.png" />
+      <!-- 登录 -->
+      <view class="login-form">
+        <view :class="['item',errorTips==1? 'error':'']">
+          <view class="account">
+            <text class="input-item">
+              账号
+            </text>
+            <input
+              type="text"
+              data-type="account"
+              placeholder-class="inp-palcehoder"
+              placeholder="请输入账号名称"
+              @input="getInputVal"
+            >
+          </view>
+          <view
+            v-if="errorTips==1"
+            class="error-text"
+          >
+            <text class="warning-icon">
+              !
+            </text>
+            请输入账号！
+          </view>
+        </view>
+        <view :class="['item',errorTips==2? 'error':'']">
+          <view class="account">
+            <text class="input-item">
+              密码
+            </text>
+            <input
+              type="password"
+              data-type="password"
+              placeholder-class="inp-palcehoder"
+              placeholder="请输入密码"
+              @input="getInputVal"
+            >
+          </view>
+          <view
+            v-if="errorTips==2"
+            class="error-text"
+          >
+            <text class="warning-icon">
+              !
+            </text>
+            请输入密码！
+          </view>
+        </view>
+        <view class="operate">
+          <view
+            class="to-register"
+            @tap="toLogin"
+          >
+            已有账号？
+            <text>去登录></text>
+          </view>
+        </view>
+      </view>
+
+      <view>
+        <button
+          class="authorized-btn"
+          @tap="toRegister"
+        >
+          注册
+        </button>
+        <button
+          class="to-idx-btn"
+          @tap="toIndex"
+        >
+          回到首页
+        </button>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+import { encrypt } from '@/utils/crypto.js'
+
+/**
+ * 生命周期函数--监听页面显示
+ */
+onShow(() => {
+  // 头部导航标题
+  uni.setNavigationBarTitle({
+    title: '用户注册'
+  })
+})
+
+const principal = ref('') // 账号
+const credentials = ref('') // 密码
+/**
+ * 输入框的值
+ */
+const getInputVal = (e) => {
+  const type = e.currentTarget.dataset.type
+  if (type == 'account') {
+    principal.value = e.detail.value
+  } else if (type == 'password') {
+    credentials.value = e.detail.value
+  }
+}
+
+const errorTips = ref(0) // 输入错误提示:  1账号输入  2密码输入
+/**
+ * 注册
+ */
+const toRegister = () => {
+  if (principal.value.length == 0) {
+    errorTips.value = 1
+  } else if (credentials.value.length == 0) {
+    errorTips.value = 2
+  } else {
+    errorTips.value = 0
+
+    uni.showLoading()
+    http.request({
+      url: '/user/register',
+      method: 'post',
+      data: {
+        userName: principal.value,
+        passWord: encrypt(credentials.value)
+      }
+    })
+      .then(() => {
+        uni.hideLoading()
+        uni.showToast({
+          title: '注册成功，请登录',
+          icon: 'none',
+          duration: 1500
+        })
+        setTimeout(() => {
+          uni.navigateTo({
+            url: '/pages/accountLogin/accountLogin'
+          })
+        }, 1800)
+      })
+  }
+}
+/**
+ * 去登陆
+ */
+const toLogin = () => {
+  uni.navigateTo({
+    url: '/pages/accountLogin/accountLogin'
+  })
+}
+
+/**
+ * 回到首页
+ */
+const toIndex = () => {
+  uni.switchTab({
+    url: '/pages/index/index'
+  })
+}
+</script>
+
+<style lang="scss" scoped>
+@import "./register.scss";
+</style>
diff --git a/src/pages/sub-category/sub-category.scss b/src/pages/sub-category/sub-category.scss
new file mode 100644
index 0000000..0fcaced
--- /dev/null
+++ b/src/pages/sub-category/sub-category.scss
@@ -0,0 +1,109 @@
+.container {
+  background: #f4f4f4;
+}
+.category-tit {
+  width: 100%;
+  white-space: nowrap;
+  position: fixed;
+  top: 0px;
+  z-index: 999;
+  background-color: #fff;
+  border-bottom: 2rpx solid #f4f4f4;
+  font-size: 30rpx;
+  .category-item {
+    display: inline-block;
+    padding: 20rpx 10rpx;
+    margin: 0 20rpx;
+    box-sizing: border-box;
+    font-size: 28rpx;
+  }
+}
+.prod-item {
+  margin-top: 100rpx;
+}
+.on {
+  border-bottom: 4rpx solid #e43130;
+  color: #e43130;
+}
+::-webkit-scrollbar {
+  width: 0;
+  height: 0;
+  color: transparent;
+}
+.empty {
+  margin-top: 200rpx;
+}
+.prod-items {
+  width: 345rpx;
+  display: inline-block;
+  background: #fff;
+  padding-bottom: 20rpx;
+  box-sizing: border-box;
+  box-shadow: 0rpx 6rpx 8rpx rgba(58,134,185,0.2);
+  &:nth-child(2n-1) {
+    margin: 20rpx 10rpx 10rpx 20rpx;
+  }
+  &:nth-child(2n) {
+    margin: 20rpx 20rpx 10rpx 10rpx;
+  }
+  .hot-imagecont {
+    .hotsaleimg {
+      width: 341rpx;
+      height: 341rpx;
+    }
+    font-size: 0;
+    text-align: center;
+  }
+  .hot-text {
+    .hotprod-text {
+      font-size: 28rpx;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+    margin-top: 20rpx;
+    padding: 0 10rpx;
+    .prod-info {
+      font-size: 22rpx;
+      color: #999;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+    .prod-text-info {
+      position: relative;
+      height: 70rpx;
+      line-height: 70rpx;
+      font-family: Arial;
+      .hotprod-price {
+        display: inline;
+        font-size: 26rpx;
+        color: #eb2444;
+      }
+      .basket-img {
+        width: 50rpx;
+        height: 50rpx;
+        position: absolute;
+        right: 0;
+        bottom: 7rpx;
+        padding: 8rpx;
+      }
+    }
+  }
+}
+.more-prod {
+  .prod-text-right {
+    .prod-info {
+      font-size: 22rpx;
+      color: #999;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+  }
+}
+.empty-wrap {
+  color: #aaa;
+  text-align: center;
+  margin-top: 400rpx;
+}
diff --git a/src/pages/sub-category/sub-category.vue b/src/pages/sub-category/sub-category.vue
new file mode 100644
index 0000000..1ee1618
--- /dev/null
+++ b/src/pages/sub-category/sub-category.vue
@@ -0,0 +1,178 @@
+<template>
+  <view class="Mall4j container">
+    <!-- 顶部子分类tab -->
+    <scroll-view
+      scroll-x="true"
+      class="category-tit"
+      :scroll-into-view="intoView"
+      :scroll-with-animation="true"
+    >
+      <block
+        v-for="(item, index) in subCategoryList"
+        :key="index"
+      >
+        <view
+          :id="'sw' + item.categoryId"
+          :class="'category-item ' + (item.categoryId==categoryId? 'on':'')"
+          :data-id="item.categoryId"
+          @tap="onSubCategoryTap"
+        >
+          {{ item.categoryName }}
+        </view>
+      </block>
+    </scroll-view>
+    <!-- 商品列表 -->
+    <view
+      v-if="prodList.length"
+      class="prod-item"
+    >
+      <block
+        v-for="(prod, key) in prodList"
+        :key="key"
+      >
+        <view
+          class="prod-items"
+          :data-prodid="prod.prodId"
+          @tap="toProdPage"
+        >
+          <view class="hot-imagecont">
+            <image
+              :src="prod.pic"
+              class="hotsaleimg"
+            />
+          </view>
+          <view class="hot-text">
+            <view class="hotprod-text">
+              {{ prod.prodName }}
+            </view>
+            <view class="prod-info">
+              {{ prod.brief }}
+            </view>
+            <view class="prod-text-info">
+              <view class="price">
+                <text class="symbol">
+                  ￥
+                </text>
+                <text class="big-num">
+                  {{ wxs.parsePrice(prod.price)[0] }}
+                </text>
+                <text class="small-num">
+                  .{{ wxs.parsePrice(prod.price)[1] }}
+                </text>
+              </view>
+            </view>
+          </view>
+        </view>
+      </block>
+    </view>
+    <view
+      v-else
+      class="empty-wrap"
+    >
+      暂无商品数据~
+    </view>
+  </view>
+</template>
+
+<script setup>
+const wxs = number()
+
+const parentId = ref('')
+const categoryId = ref(0)
+/**
+ * 生命周期函数--监听页面加载
+ */
+onLoad((options) => {
+  parentId.value = options.parentId
+  categoryId.value = options.categoryId
+  getSubCategory()
+  getProdList()
+})
+
+const current = ref(1)
+const pages = ref(0)
+/**
+ * 页面上拉触底事件的处理函数
+ */
+onReachBottom(() => {
+  if (current.value < pages.value) {
+    current.value = current.value + 1
+    getProdList()
+  }
+})
+
+const intoView = ref('')
+const subCategoryList = ref([])
+/**
+ * 获取顶栏子分类数据
+ */
+const getSubCategory = () => {
+  http.request({
+    url: '/category/categoryInfo',
+    method: 'GET',
+    data: {
+      parentId: parentId.value
+    }
+  })
+    .then(({ data }) => {
+      subCategoryList.value = data
+      nextTick(() => {
+        intoView.value = 'sw' + categoryId.value
+      })
+    })
+}
+
+const prodList = ref([])
+const isLoaded = ref(false) // 列表是否加载完毕
+/**
+ * 根据分类id获取商品列表数据
+ */
+const getProdList = () => {
+  isLoaded.value = false
+
+  http.request({
+    url: '/prod/pageProd',
+    method: 'GET',
+    data: {
+      categoryId: categoryId.value,
+      current: current.value,
+      size: 10,
+      sort: 0,
+      isAllProdType: true
+    }
+  })
+    .then(({ data }) => {
+      isLoaded.value = true
+      prodList.value = data.current == 1 ? data.records : prodList.value.concat(data.records)
+      current.value = data.current
+      pages.value = data.pages
+    })
+}
+
+/**
+ * 切换顶部分类
+ */
+const onSubCategoryTap = (e) => {
+  categoryId.value = e.currentTarget.dataset.id
+  current.value = 1
+  pages.value = 0
+  intoView.value = 'sw' + e.currentTarget.dataset.id
+  getProdList()
+}
+
+/**
+ * 跳转商品下详情
+ */
+const toProdPage = (e) => {
+  const prodid = e.currentTarget.dataset.prodid
+  if (prodid) {
+    uni.navigateTo({
+      url: '/pages/prod/prod?prodid=' + prodid
+    })
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import "./sub-category.scss";
+</style>
diff --git a/src/pages/user/user.scss b/src/pages/user/user.scss
index e69de29..c5e82dc 100644
--- a/src/pages/user/user.scss
+++ b/src/pages/user/user.scss
@@ -0,0 +1,222 @@
+.container {
+  background-color: #f7f7f7;
+  padding-bottom: 60rpx;
+}
+.userinfo {
+  position: relative;
+  width: 100%;
+  background: #fff;
+  text-align: center;
+  padding: 30rpx 0;
+  .userinfo-con {
+    width: 240rpx;
+    margin: auto;
+    .userinfo-avatar {
+      overflow: hidden;
+      display: block;
+      width: 160rpx;
+      height: 160rpx;
+      border-radius: 50%;
+      box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.2);
+      margin: auto;
+      image {
+        width: 160rpx;
+        height: 160rpx;
+      }
+    }
+    .userinfo-name {
+      font-size: 30rpx;
+      font-weight: bold;
+      margin-top: 20rpx;
+      overflow: hidden;
+      display: -webkit-box;
+      -webkit-line-clamp: 1;
+      -webkit-box-orient: vertical;
+      text-overflow: ellipsis;
+      word-break: break-all;
+    }
+  }
+}
+.userinfo-none {
+  display: flex;
+  padding: 30rpx;
+  background: #fff;
+  align-items: center;
+  .default-pic {
+    padding-right: 30rpx;
+    image {
+      width: 160rpx;
+      height: 160rpx;
+    }
+  }
+}
+.none-login {
+  button {
+    background: #fff;
+    &::after {
+      border: 0;
+    }
+  }
+  .unlogin {
+    font-size: 30rpx;
+    text-align: left;
+    padding: 0;
+  }
+  .click-login {
+    font-size: 26rpx;
+    color: #777;
+    text-align: left;
+    padding: 0;
+  }
+}
+.binding-phone {
+  position: relative;
+  background: #fff;
+  height: 80rpx;
+  line-height: 80rpx;
+  padding: 0 30rpx;
+  border-top: 2rpx solid #f7f7f7;
+  border-bottom: 2rpx solid #f7f7f7;
+  .show-tip {
+    font-size: 26rpx;
+  }
+  .gotobinding {
+    border-radius: 8rpx;
+    font-size: 28rpx;
+    color: #e24b4b;
+    font-weight: bold;
+  }
+}
+.list-cont {
+  width: 100%;
+  background: #f7f7f7;
+  margin-top: 20rpx;
+  .total-order {
+    background: #fff;
+    .order-tit {
+      display: flex;
+      justify-content: space-between;
+      height: 80rpx;
+      line-height: 80rpx;
+      font-size: 30rpx;
+      border-bottom: 1px solid #f7f7f7;
+      padding: 0 30rpx;
+      .checkmore {
+        font-size: 22rpx;
+        color: #80848f;
+        display: flex;
+        align-items: center;
+      }
+    }
+    .procedure {
+      display: flex;
+      justify-content: space-around;
+      align-items: center;
+      font-size: 25rpx;
+      height: 160rpx;
+      .items {
+        position: relative;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        image {
+          width: 70rpx;
+          height: 70rpx;
+          margin-bottom: 20rpx;
+        }
+        .num-badge {
+          position: absolute;
+          top: -15rpx;
+          right: -12rpx;
+          color: #eb2444;
+          border: 3rpx solid #eb2444;
+          border-radius: 50rpx;
+          background: #fff;
+          min-width: 30rpx;
+          height: 30rpx;
+          line-height: 30rpx;
+          text-align: center;
+          padding: 2rpx;
+          display: block;
+        }
+      }
+    }
+  }
+  .my-menu {
+    background-color: #fff;
+    margin-top: 20rpx;
+    .memu-item {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      height: 100rpx;
+      border-bottom: 2rpx solid #f7f7f7;
+      padding: 0 30rpx;
+      &:nth-child(1) {
+        border-top: 2rpx solid #f7f7f7;
+      }
+      &:last-child {
+        border-bottom: none;
+      }
+      text {
+        font-size: 28rpx;
+      }
+      image {
+        width: 50rpx;
+        height: 50rpx;
+        margin-right: 20rpx;
+      }
+      .i-name {
+        display: flex;
+        align-items: center;
+      }
+    }
+  }
+}
+.arrowhead {
+  width: 15rpx;
+  height: 15rpx;
+  border-top: 2rpx solid #999;
+  border-right: 2rpx solid #999;
+  transform: rotate(45deg);
+  margin-left: 10rpx;
+}
+.prod-col {
+  margin-top: 20rpx;
+  background: #fff;
+  display: flex;
+  justify-content: space-around;
+  padding: 30rpx 0 10rpx 0;
+  font-size: 12px;
+  .col-item {
+    text-align: center;
+    .num {
+      font-size: 16px;
+      font-weight: 700;
+      color: #3a86b9;
+    }
+    .tit {
+      line-height: 34px;
+    }
+  }
+}
+.log-out {
+  padding: 20rpx;
+  text-align: center;
+  margin-top: 20rpx;
+}
+.log-out-n {
+  font-size: 30rpx;
+  margin: auto;
+  width: 200rpx;
+  padding: 20rpx;
+  border-radius: 10rpx;
+  background: #e43130;
+  color: #ffffff;
+}
+button.memu-btn.memu-item {
+  background-color: #fff;
+  &:after {
+    border: 0;
+  }
+}
diff --git a/src/pages/user/user.vue b/src/pages/user/user.vue
index 640653c..a439e9b 100644
--- a/src/pages/user/user.vue
+++ b/src/pages/user/user.vue
@@ -1,5 +1,375 @@
 <template>
-  <view>
-    我的
+  <view class="container">
+    <!-- 用户信息 -->
+    <view
+      v-if="isAuthInfo"
+      class="userinfo"
+    >
+      <view class="userinfo-con">
+        <view class="userinfo-avatar">
+          <image
+            :src="
+              loginResult.pic
+                ?
+                  (loginResult.pic.indexOf('http') === -1 ? picDomain + loginResult.pic : loginResult.pic)
+                :
+                  '@/static/images/icon/head04.png'
+            "
+          />
+        </view>
+        <view class="userinfo-name">
+          <view>{{ loginResult.nickName ? loginResult.nickName : "用户昵称" }}</view>
+        </view>
+      </view>
+    </view>
+
+    <view
+      v-if="!isAuthInfo"
+      class="userinfo-none"
+    >
+      <view
+        class="default-pic"
+        @tap="toLogin"
+      >
+        <image src="@/static/images/icon/head04.png" />
+      </view>
+      <view
+        class="none-login"
+        @tap="toLogin"
+      >
+        <button class="unlogin">
+          未登录
+        </button>
+        <button class="click-login">
+          点击登录账号
+        </button>
+      </view>
+    </view>
+    <!-- end 用户信息 -->
+
+    <view class="list-cont">
+      <!-- 订单状态 -->
+      <view class="total-order">
+        <view class="order-tit">
+          <text style="font-weight:bold">
+            我的订单
+          </text>
+          <view
+            class="checkmore"
+            data-sts="0"
+            @tap="toOrderListPage"
+          >
+            <text>查看全部</text>
+            <text class="arrowhead" />
+          </view>
+        </view>
+        <view class="procedure">
+          <view
+            class="items"
+            data-sts="1"
+            @tap="toOrderListPage"
+          >
+            <image src="@/static/images/icon/toPay.png" />
+            <text>待支付</text>
+            <text
+              v-if="orderAmount.unPay>0"
+              class="num-badge"
+            >
+              {{ orderAmount.unPay }}
+            </text>
+          </view>
+          <view
+            class="items"
+            data-sts="2"
+            @tap="toOrderListPage"
+          >
+            <image src="@/static/images/icon/toDelivery.png" />
+            <text>待发货</text>
+            <text
+              v-if="orderAmount.payed>0"
+              class="num-badge"
+            >
+              {{ orderAmount.payed }}
+            </text>
+          </view>
+          <view
+            class="items"
+            data-sts="3"
+            @tap="toOrderListPage"
+          >
+            <image src="@/static/images/icon/toTake.png" />
+            <text>待收货</text>
+            <text
+              v-if="orderAmount.consignment>0"
+              class="num-badge"
+            >
+              {{ orderAmount.consignment }}
+            </text>
+          </view>
+          <view
+            class="items"
+            data-sts="5"
+            @tap="toOrderListPage"
+          >
+            <image src="@/static/images/icon/toComment.png" />
+            <text>已完成</text>
+          </view>
+        </view>
+      </view>
+      <!--end 订单状态 -->
+
+      <view class="prod-col">
+        <view
+          class="col-item"
+          @tap="myCollectionHandle"
+        >
+          <view
+            v-if="loginResult"
+            class="num"
+          >
+            {{ collectionCount }}
+          </view>
+          <view
+            v-else
+            class="num"
+          >
+            --
+          </view>
+          <view class="tit">
+            我的收藏
+          </view>
+        </view>
+        <view
+          class="col-item"
+          @tap="handleTips"
+        >
+          <view
+            v-if="loginResult"
+            class="num"
+          >
+            5
+          </view>
+          <view
+            v-else
+            class="num"
+          >
+            --
+          </view>
+          <view class="tit">
+            我的消息
+          </view>
+        </view>
+        <view
+          class="col-item"
+          @tap="handleTips"
+        >
+          <view
+            v-if="loginResult"
+            class="num"
+          >
+            3
+          </view>
+          <view
+            v-else
+            class="num"
+          >
+            --
+          </view>
+          <view class="tit">
+            我的足迹
+          </view>
+        </view>
+      </view>
+
+      <view class="my-menu">
+        <view
+          class="memu-item"
+          @tap="toDistCenter"
+        >
+          <view class="i-name">
+            <image src="@/static/images/icon/promotion.png" />
+            <text>分销中心</text>
+          </view>
+          <view class="arrowhead" />
+        </view>
+        <view
+          class="memu-item"
+          @tap="toCouponCenter"
+        >
+          <view class="i-name">
+            <image src="@/static/images/icon/getCoupon.png" />
+            <text>领券中心</text>
+          </view>
+          <view class="arrowhead" />
+        </view>
+        <view
+          class="memu-item"
+          @tap="toMyCouponPage"
+        >
+          <view class="i-name">
+            <image src="@/static/images/icon/myCoupon.png" />
+            <text>我的优惠券</text>
+          </view>
+          <view class="arrowhead" />
+        </view>
+        <view
+          class="memu-item"
+          @tap="toAddressList"
+        >
+          <view class="i-name">
+            <image src="@/static/images/icon/myAddr.png" />
+            <text>收货地址</text>
+          </view>
+          <view class="arrowhead" />
+        </view>
+      </view>
+      <!--end 列表项 -->
+
+      <view
+        v-if="isAuthInfo"
+        class="log-out"
+        @tap="logout"
+      >
+        <view class="log-out-n">
+          <text>退出登录</text>
+        </view>
+      </view>
+    </view>
   </view>
 </template>
+
+<script setup>
+const picDomain = import.meta.env.VITE_APP_RESOURCES_URL
+
+const isAuthInfo = ref(false)
+const loginResult = ref('')
+const orderAmount = ref('')
+/**
+ * 生命周期函数--监听页面显示
+ */
+onShow(() => {
+  loginResult.value = uni.getStorageSync('loginResult')
+  isAuthInfo.value = !!loginResult.value
+  // 加载订单数字
+  if (isAuthInfo.value) {
+    uni.showLoading()
+    http.request({
+      url: '/p/myOrder/orderCount',
+      method: 'GET',
+      data: {}
+    })
+      .then(({ data }) => {
+        uni.hideLoading()
+        orderAmount.value = data
+      })
+    showCollectionCount()
+  }
+})
+
+const toDistCenter = () => {
+  uni.showToast({
+    icon: 'none',
+    title: '该功能未开源'
+  })
+}
+const toCouponCenter = () => {
+  uni.showToast({
+    icon: 'none',
+    title: '该功能未开源'
+  })
+}
+const toMyCouponPage = () => {
+  uni.showToast({
+    icon: 'none',
+    title: '该功能未开源'
+  })
+}
+const handleTips = () => {
+  uni.showToast({
+    icon: 'none',
+    title: '该功能未开源'
+  })
+}
+const toAddressList = () => {
+  uni.navigateTo({
+    url: '/pages/delivery-address/delivery-address'
+  })
+}
+
+const toOrderListPage = (e) => {
+  const sts = e.currentTarget.dataset.sts
+  uni.navigateTo({
+    url: '/pages/orderList/orderList?sts=' + sts
+  })
+}
+
+const collectionCount = ref(0)
+/**
+ * 查询所有的收藏量
+ */
+const showCollectionCount = () => {
+  uni.showLoading()
+  http.request({
+    url: '/p/user/collection/count',
+    method: 'GET',
+    data: {}
+  })
+    .then(({ data }) => {
+      uni.hideLoading()
+      collectionCount.value = data
+    })
+}
+
+/**
+ * 我的收藏跳转
+ */
+const myCollectionHandle = () => {
+  let url = '/pages/prod-classify/prod-classify?sts=5'
+  const id = 0
+  const title = '我的收藏商品'
+  if (id) {
+    url += '&tagid=' + id + '&title=' + title
+  }
+  uni.navigateTo({
+    url
+  })
+}
+
+/**
+ * 去登陆
+ */
+const toLogin = () => {
+  uni.navigateTo({
+    url: '/pages/accountLogin/accountLogin'
+  })
+}
+
+/**
+ * 退出登录
+ */
+const logout = () => {
+  http.request({
+    url: '/logOut',
+    method: 'post'
+  })
+    .then(() => {
+      util.removeTabBadge()
+      uni.removeStorageSync('loginResult')
+      uni.removeStorageSync('token')
+      uni.showToast({
+        title: '退出成功',
+        icon: 'none'
+      })
+      orderAmount.value = ''
+      setTimeout(() => {
+        uni.switchTab({
+          url: '/pages/index/index'
+        })
+      }, 1000)
+    })
+}
+</script>
+
+<style scoped lang="scss">
+@use './user.scss';
+</style>
diff --git a/src/utils/http.js b/src/utils/http.js
index 9978328..8a2fe3e 100644
--- a/src/utils/http.js
+++ b/src/utils/http.js
@@ -108,7 +108,7 @@ const http = {
     })
   },
   getCartCount: () => {
-    if (!uni.getStorageSync('token')) {
+    if (!uni.getStorageSync('Token')) {
       util.removeTabBadge()
       return
     }
@@ -117,20 +117,40 @@ const http = {
       method: 'GET',
       dontTrunLogin: true,
       data: {}
-    }).then(({ data }) => {
-      if (data > 0) {
-        wx.setTabBarBadge({
-          index: 2,
-          text: data + ''
-        })
-        getApp().globalData.totalCartCount = data
-      } else {
-        wx.removeTabBarBadge({
-          index: 2
-        })
-        getApp().globalData.totalCartCount = 0
-      }
     })
+      .then(({ data }) => {
+        if (data > 0) {
+          uni.setTabBarBadge({
+            index: 2,
+            text: data + ''
+          })
+          getApp().globalData.totalCartCount = data
+        } else {
+          uni.removeTabBarBadge({
+            index: 2
+          })
+          getApp().globalData.totalCartCount = 0
+        }
+      })
+  },
+  /**
+   * 登录成功后执行
+   * @param {Object} result  登录成功返回的数据
+   * @param {Object} fn 登录成功后的回调
+   */
+  loginSuccess: (result, fn) => {
+  // 保存登陆信息
+    wx.setStorageSync('loginResult', result)
+    // 保存成功登录标识,token过期判断
+    wx.setStorageSync('hadLogin', true)
+    const expiresTimeStamp = result.expiresIn * 1000 / 2 + new Date().getTime()
+    // 缓存token的过期时间
+    uni.setStorageSync('expiresTimeStamp', expiresTimeStamp)
+
+    wx.setStorageSync('Token', result.accessToken) // 把token存入缓存，请求接口数据时要用
+    if (fn) {
+      fn()
+    }
   }
 }
 export default http