更新v1.5

pull/8/head
kele 2022-12-07 18:42:08 +08:00
parent d4418f23c2
commit 2e55927d2e
8 changed files with 138 additions and 38 deletions

View File

@ -2,7 +2,7 @@
SHOPRO_BASE_URL = https://api.shopro.sheepjs.com
# 开发环境接口域名
SHOPRO_DEV_BASE_URL = https://dev.shopro.sheepjs.com
SHOPRO_DEV_BASE_URL = https://api.shopro.sheepjs.com
# 开发环境运行端口
SHOPRO_DEV_PORT = 3000

142
README.md
View File

@ -1,45 +1,131 @@
# shopro-uniapp
## 简介
![1](https://file.sheepjs.com/www/preview/dcloud/01.png '01.png')
![title](https://file.sheepjs.com/www/preview/dcloud/01.png)
<div align="center">
[![star](https://gitee.com/sheepjs/shopro-uniapp/badge/star.svg)](https://gitee.com/sheepjs/shopro-uniapp.git)
[![fork](https://gitee.com/sheepjs/shopro-uniapp/badge/fork.svg?theme=gvp)](https://gitee.com/sheepjs/shopro-uniapp.git)
[![version](https://img.shields.io/badge/Shopro-V1.5-brightgreen)](https://gitee.com/sheepjs/shopro-uniapp.git)
[![license](http://img.shields.io/badge/license-MIT-orange)](https://gitee.com/sheepjs/shopro-uniapp.git)
[官方网站](https://www.shopro.top/) | [H5 演示](http://shopro.sheepjs.com/) | [管理系统](https://shopro.sheepjs.com/admin/) | [问题反馈](https://gitee.com/sheepjs/shopro-uniapp/issues)
</div>
## 特性
![features](https://file.sheepjs.com/www/preview/dcloud/02.png)
# Shopro商城安装教程
整个系统共分为九大模块:
1. 首次安装需要 npm install 加载相关依赖
2. 基于uni-app需要下载hbuilderX进行编译
3. manifest.json中配置相关信息
# 技术特性
1. 支持主题色+自定义头部导航+自定义底部导航
- **支持主题色+自定义头部导航+自定义底部导航**
- **内含沉浸式头部、通用头部导航示例,支持后端自定义配置底部导航背景和样式**
- **店铺装修组件(轮播、标题栏、优惠券、商品组、宫格导航、列表导航+广告魔方+富文本、搜索栏等众多组件)**
- **内置微信公众号分享 jssdk+微信小程序分享卡片+微信 App 分享+海报分享统一封装**
- **内置微信公众号登录+微信小程序手机号登录+微信 App 开放平台登录+账号密码登录+iOS 登录统一封装**
- **内置余额支付+微信公众号 jssdk 支付+微信小程序支付+微信 App 支付+支付宝网页支付+支付宝 App 支付统一封装**
- **支持第三方 cdn 图片资源地址,并支持阿里云、腾讯云、七牛云图片缩放参数**
- **严格适配多终端场景并支持 App 审核上架**
2. 内含沉浸式头部、通用头部导航示例,支持后端自定义配置底部导航背景和样式
## 技术栈
- **前端技术栈uni-app、ES6、Vue3、Vite、Pinia;**
## 安装
```bash
# 1.克隆项目
$ git clone https://gitee.com/sheepjs/shopro-uniapp.git
```
```bash
# 2.拷贝.env.example示例配置文件 重命名为.env
$ cd shopro-uniapp
$ cp .env.example .env
```
```bash
# 3.安装依赖 (需安装nodejs环境, 使用npm国内镜像)
$ npm install --registry=https://registry.npmmirror.com
```
```bash
# 4.使用HbuilderX 运行...
```
## 体验
![系统架构](https://file.sheepjs.com/www/preview/dcloud/04.png)
客户端演示地址:[https://shopro.sheepjs.com](https://shopro.sheepjs.com)
演示账号: shopro
演示密码: a123456
管理端演示地址:[https://shopro.sheepjs.com/admin/](https://shopro.sheepjs.com/admin/)
演示账号: shopro
演示密码: 123456
_注意演示环境已屏蔽管理权限和相关操作_
3. 店铺装修组件(轮播、标题栏、优惠券、商品组、宫格导航、列表导航+广告魔方+富文本、搜索栏等众多组件)
## 项目结构
**后端结构**
```
├── pages // 页面
│ ├── index // 入口页面
│ ├── user // 用户相关
│ ├── public // 公共页面
│ ├── activity // 活动页面
│ ├── app // 积分、签到页面
│ ├── chat // 客服页面
│ ├── commission // 分销页面
│ ├── coupon // 优惠券页面
│ ├── goods // 商品页面
│ ├── order // 订单页面
│ ├── pay // 支付页面
├── sheep // 底层依赖/工具库
│ ├── api // 服务端接口
│ ├── components // 自定义功能组件
│ ├── config // 配置文件
│ ├── helper // 助手函数
│ ├── hooks // vue-hooks
│ ├── libs // 自定义依赖
│ ├── platform // 第三方平台登录、分享、支付
│ ├── request // 请求类库
│ ├── router // 自定义路由跳转
│ ├── scss // 主样式库
│ ├── store // pinia状态管理模块
│ ├── ui // 自定义UI组件
│ ├── url // cdn图片地址格式化
│ ├── validate // 通用验证器
│ ├── index.js // Shopro入口文件
├── uni_modules // dcloud第三方插件
```
4. 内置微信公众号分享jssdk+微信小程序分享卡片+微信App分享+海报分享统一封装
## 更新
### 近期计划
5. 内置微信公众号登录+微信小程序手机号登录+微信App开放平台登录+账号密码登录+iOS登录统一封装
- [ ] Typescript 重构;
### V1.5 更新简介 2022/12/07
6. 内置余额支付+微信公众号jssdk支付+微信小程序支付+微信App支付+支付宝网页支付+支付宝App支付统一封装
7. 支持第三方cdn图片资源地址并支持阿里云、腾讯云、七牛云图片缩放参数
8. 严格适配多终端场景并支持App审核上架
![1](https://file.sheepjs.com/www/preview/dcloud/02.png '02.png')
![1](https://file.sheepjs.com/www/preview/dcloud/03.png '03.png')
![1](https://file.sheepjs.com/www/preview/dcloud/04.png '04.png')
- [x] 服务保障icon 变形问题;
- [x] 确认订单 可用优惠券逻辑修改;
- [x] `su-image`组件中`customStyle`添加`width`属性;
---
**<p align="center">如果您觉得我们的开源项目很有帮助,请点击 :star: Star(https://gitee.com/sheepjs/shopro-uniapp.git) 支持 SheepJS 开源团队:heart:</p>**
---

View File

@ -27,10 +27,10 @@
</view>
</scroll-view>
</view>
<view class="ss-flex ss-row-right">
<!-- <view class="ss-flex ss-row-right">
<text class="cicon-info-o"></text>
<view class="ss-m-l-8 foot-title">举报</view>
</view>
</view> -->
</view>
</view>
<s-empty v-if="state.pagination.total === 0" text="暂无数据" icon="/static/data-empty.png" />

View File

@ -86,6 +86,9 @@
width: 36rpx;
height: 36rpx;
}
.title-box{
flex: 1;
}
.item-title {
font-size: 28rpx;

View File

@ -70,11 +70,18 @@
<!-- <view v-if="state.orderInfo.coupon_discount_fee > 0" class="order-item ss-flex ss-col-center ss-row-between"> -->
<view class="item-title">优惠券</view>
<view class="ss-flex ss-col-center" @tap="state.showCoupon = true">
<text class="item-value text-red" v-if="state.orderPayload.coupon_id != 0"
<text class="item-value text-red" v-if="state.orderPayload.coupon_id"
>-{{ state.orderInfo.coupon_discount_fee }}</text
>
<text class="item-value text-red" v-else
>{{ state.couponInfo.can_use?.length }}张可用</text
<text
class="item-value"
:class="state.couponInfo.can_use?.length > 0 ? 'text-red' : 'text-disabled'"
v-else
>{{
state.couponInfo.can_use?.length > 0
? state.couponInfo.can_use?.length + '张可用'
: '暂无可用优惠券'
}}</text
>
<text class="_icon-forward item-icon"></text>
@ -337,6 +344,9 @@
.item-value {
font-family: OPPOSANS;
}
.text-disabled {
color: #bbbbbb;
}
.item-icon {
color: $dark-9;

View File

@ -41,7 +41,7 @@
</view>
</view>
<!-- 工具 -->
<view class="modal-footer ss-flex ss-row-center ss-col-center ss-m-t-80">
<view class="modal-footer ss-flex ss-row-center ss-col-center ss-m-t-80 ss-m-b-40">
<button v-if="state.payStatus === 0" class="ss-reset-button past-due-btn">
检测支付环境中
</button>
@ -205,7 +205,7 @@
}
.ss-modal-box {
max-height: 1000rpx;
// max-height: 1000rpx;
.modal-header {
position: relative;

View File

@ -11,7 +11,7 @@
})
"
>
<view class="card-top ss-flex ss-flex-col ss-row-center ss-col-center">
<view class=" ss-flex ss-flex-col ss-row-center ss-col-center">
<view class="face-value-box ss-flex ss-col-bottom ss-m-t-50 ss-m-b-28">
<view class="value-text ss-m-r-4">{{ props.value }}</view>
<view class="value-unit"></view>
@ -174,7 +174,7 @@
// xs
.xs-coupon-card {
width: 227rpx;
height: 145px;
// height: 145px;
border-radius: 10rpx;
overflow: hidden;

View File

@ -83,6 +83,7 @@
const customStyle = computed(() => {
return {
height: (props.height || state.imgHeight) + 'rpx',
width: props.width + 'rpx',
borderRadius: props.radius ? props.radius + 'rpx' : '',
};
});