parent
8657990ba1
commit
cc730b8376
@ -0,0 +1,18 @@ |
|||||||
|
<script> |
||||||
|
export default { |
||||||
|
onLaunch: function () { |
||||||
|
console.log('App Launch') |
||||||
|
}, |
||||||
|
onShow: function () { |
||||||
|
console.log('App Show') |
||||||
|
}, |
||||||
|
onHide: function () { |
||||||
|
console.log('App Hide') |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss"> |
||||||
|
/*每个页面公共css */ |
||||||
|
@import "/static/iconfont/font.scss"; |
||||||
|
</style> |
||||||
@ -0,0 +1,101 @@ |
|||||||
|
[参考这里]: https://ask.dcloud.net.cn/article/35070 "参考这里" |
||||||
|
|
||||||
|
|
||||||
|
> * 遇到问题或有建议可以评论留言或者[直接提问](https://ask.dcloud.net.cn/publish/ext/?pn=商城模板&uid=518399) |
||||||
|
> * 如果觉得模板不错，<font color=#f00>给个五星鼓励鼓励</font>! |
||||||
|
|
||||||
|
###已实现页面 |
||||||
|
* tabbar |
||||||
|
* 首页(subNvue导航栏) |
||||||
|
* 分类页(vue,nvue) |
||||||
|
* 购物车页(subNvue导航栏) |
||||||
|
* 个人中心页(subNvue导航栏) |
||||||
|
* 下级页面 |
||||||
|
* 商品列表页(vue,nvue) |
||||||
|
* 商品详情页 |
||||||
|
* 订单确认页 |
||||||
|
* 个人中心页 |
||||||
|
* 登录页 |
||||||
|
* 注册页 |
||||||
|
* 重置密码页 |
||||||
|
* 我的订单页(vue,nvue) |
||||||
|
* 设置页 |
||||||
|
* 消息列表页 |
||||||
|
* 聊天页 |
||||||
|
* 我的二维码页 |
||||||
|
* 优惠券页 |
||||||
|
* 我的收藏页 |
||||||
|
* 地址管理页 |
||||||
|
* 地址编辑/新增页 |
||||||
|
* 充值页 |
||||||
|
* 订单支付页 |
||||||
|
* 支付成功页 |
||||||
|
* 评论列表 |
||||||
|
|
||||||
|
###模板说明 |
||||||
|
> * HX 2.0.3+ 版本的用户注意，模板nvue文件编译模式为**weex模式**，不支持uni-app模式(等uni-app模式完善后再支持)，也就是说，目前页面目录会同时有nvue和vue文件，APP端使用nvue文件，非APP端使用vue文件。 |
||||||
|
> * 首页、分类页左上角城市，使用了高德SDK获取城市信息，实际应用中请替换模板的高德KEY，[参考这里]。 |
||||||
|
> * 所有页面的字体图标归类到/static/iconfont/font.scss下，App.vue引入全局调用，同时目录下有ttf文件，低版本安卓如果图标不显示，可以引用ttf文件试试。 |
||||||
|
> * 模板中把表情上传到了第三方图床(仅供模板在APP和小程序中展示，请勿依赖此图床，实际使用中请自行上传到您的服务器中调用。) |
||||||
|
> * 地址编辑/新增页使用了mpvue-citypicker城市选择组件 |
||||||
|
> * 模板页面之间耦合性低，页面除字体图标外的css都独立写在页面内部，只看上了模板中某个页面，可以很方便的拿出来单独使用(记得带上字体图标/static/iconfont/font.scss)。 |
||||||
|
> * 点击昵称跳转登录/注册页面 |
||||||
|
> * 模板中的搜索功能，建议用户直接做成跳转至[搜索模板](https://ext.dcloud.net.cn/plugin?id=91)进行搜索，需要自己动手实现。 |
||||||
|
> * 模板中除了商品详情页外的图片均放在本地，如果要做小程序的，要换成远程图片避免大小限制。 |
||||||
|
> * 模板商品图片采集于淘宝，分类图片使用[iconfont @是满月啊](https://www.iconfont.cn/collections/detail?cid=10840)，工具栏图标使用[iconfont @小胖要吃肉丸变成球球](https://www.iconfont.cn/collections/detail?cid=13655)，图片均只用于案例展示，请勿用于其他用途。 |
||||||
|
> * 编译样式需要安装scss插件，HBuilderX -> 工具 -> 插件安装 -> scss/sass编译 -> 安装 |
||||||
|
> * 如果觉得模板还不错<font color=#f00>给个五星鼓励鼓励</font>! |
||||||
|
|
||||||
|
####APP端说明 |
||||||
|
> * 为了提高APP端性能，APP端部分页面配套了subNvue导航栏或nvue页面，使用模板时候需要注意 |
||||||
|
> * 使用模板中含有subNvue导航栏的页面时候，请注意配置page.json文件，模板为了兼容其他端，在vue页内也写有导航栏，在非APP端时候显示。 |
||||||
|
> * 含有nvue页面的页面目录中，会有vue和nvue两个文件，APP端使用nvue，非APP端使用vue文件。 |
||||||
|
> * 由于使用不同的页面，APP端和非APP端使用体验上有一定的差异。 |
||||||
|
> * 如果你不想要这些APP独有的元素，可以在模板中删除，vue文件也支持在APP中使用的(删除subNvue导航栏需要改动页面参数让vue页的导航栏显示在APP)。 |
||||||
|
|
||||||
|
 |
||||||
|
|
||||||
|
###版本记录 |
||||||
|
------------- |
||||||
|
* 2019-07-08 |
||||||
|
* 1. 部分页面添加subNvue导航栏(仅支持APP，具体添加页面看页面列表标注) |
||||||
|
* 2. 所有页面的字体图标归类到/static/iconfont/font.scss下，App.vue引入全局调用，目录下有ttf文件，低版本安卓如果图标不显示可以引用ttf文件试试 |
||||||
|
* 3. 修复H5端商品详情页导航栏的错位问题 感谢 <font color=#22ac38>@深蓝新创科技</font> 反馈 |
||||||
|
|
||||||
|
* 2019-06-25 |
||||||
|
* 1. 增加评论列表页(商品详情页点击评论进入) |
||||||
|
* 2. 模板编译模式改为自定义组件模式 |
||||||
|
* 3. 一些小的语法变更 |
||||||
|
|
||||||
|
* 2019-04-26 |
||||||
|
* 1. 购物车 修复全选删除不能全部删除问题(低级错误啊啊啊啊 0..0) |
||||||
|
* 2. 修复地址编辑保存按钮错位问题 |
||||||
|
* 3. 修复H5平台从订单确认页进入选择地址列表不能编辑地址问题 |
||||||
|
|
||||||
|
* 2019-04-25 |
||||||
|
* 1. 购物车 |
||||||
|
- 修复删除商品没更新selectedList问题 |
||||||
|
- 修复手动输入数量价格不更新问题 |
||||||
|
- 添加加入商品方法(说明请看代码注释) |
||||||
|
* 2. 完善购物流程(完善了从下单到支付完成的页面) |
||||||
|
* 3. 增加更多功能页面(详细请看下方“已实现页面”) |
||||||
|
|
||||||
|
* 2019-04-15 |
||||||
|
* 1. 客服聊天页 消息过长不换行问题。 |
||||||
|
* 2. 商品列表页，我的订单页 修复H5下重复进入页面顶部栏消失问题。 |
||||||
|
* 3. 登录页 安卓下，弹出键盘会把第三方登录按钮顶上来问题。 |
||||||
|
|
||||||
|
* 2019-04-12 |
||||||
|
* 1. 购物车页，修复数量没有垂直居中问题。 |
||||||
|
* 2. 客服聊天页 修复点击发送图片按钮表情不收起的情况，优化初次进入页面时图片加载和调整聊天图片尺寸，把表情上传到了第三方图床(仅供模板在APP和小程序中展示，实际使用中请自行上传到您的服务器中调用。) |
||||||
|
|
||||||
|
* 2019-04-11 |
||||||
|
* 1. 修复iOS下页面回弹导致头部抖动 |
||||||
|
* 2. 购物车页 修复删除商品时动画错误问题 |
||||||
|
* 3. 商品详情页 |
||||||
|
- 添加默认头部按钮半透明底色 |
||||||
|
- 添加商品轮播图指示器 |
||||||
|
- 添加分享弹窗(点击左下角分享) |
||||||
|
- 修复小程序下锚点不居中问题 |
||||||
|
- 调整所有弹窗动画时长 |
||||||
|
* 4. 增加页面 我的订单页,设置页,我的二维码页,消息列表页,聊天(客服)页 |
||||||
@ -0,0 +1,11 @@ |
|||||||
|
import Vue from 'vue' |
||||||
|
import App from './App' |
||||||
|
|
||||||
|
Vue.config.productionTip = false |
||||||
|
|
||||||
|
App.mpType = 'app' |
||||||
|
|
||||||
|
const app = new Vue({ |
||||||
|
...App |
||||||
|
}) |
||||||
|
app.$mount() |
||||||
@ -0,0 +1,71 @@ |
|||||||
|
{ |
||||||
|
"name" : "商城模板", |
||||||
|
"appid" : "__UNI__E807B53", |
||||||
|
"description" : "", |
||||||
|
"versionName" : "1.2.0", |
||||||
|
"versionCode" : "100", |
||||||
|
"transformPx" : false, |
||||||
|
"app-plus" : { |
||||||
|
"usingComponents" : true, //是否启用`自定义组件模式`，为true表示新的`自定义组件模式` ，否则为`template模板模式` |
||||||
|
"softinput" : { |
||||||
|
"navBar" : "none" // 是否显示软键盘上的导航条 |
||||||
|
}, |
||||||
|
/* 5+App特有相关 */ |
||||||
|
"splashscreen" : { |
||||||
|
"alwaysShowBeforeRender" : true, |
||||||
|
"waiting" : true, |
||||||
|
"autoclose" : true, |
||||||
|
"delay" : 0 |
||||||
|
}, |
||||||
|
"modules" : { |
||||||
|
"Share" : {}, |
||||||
|
"OAuth" : {} |
||||||
|
}, |
||||||
|
/* 模块配置 */ |
||||||
|
"distribute" : { |
||||||
|
"orientation" : [ "portrait-primary" ], |
||||||
|
/* 应用发布信息 */ |
||||||
|
"android" : { |
||||||
|
/* android打包配置 */ |
||||||
|
"permissions" : [ |
||||||
|
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.READ_CONTACTS\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.VIBRATE\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>", |
||||||
|
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.WRITE_CONTACTS\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.CAMERA\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.RECORD_AUDIO\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.MODIFY_AUDIO_SETTINGS\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.CALL_PHONE\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.ACCESS_COARSE_LOCATION\"/>", |
||||||
|
"<uses-feature android:name=\"android.hardware.camera\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.ACCESS_FINE_LOCATION\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>" |
||||||
|
] |
||||||
|
}, |
||||||
|
"ios" : {}, |
||||||
|
/* ios打包配置 */ |
||||||
|
"sdkConfigs" : {} |
||||||
|
} |
||||||
|
}, |
||||||
|
/* SDK配置 */ |
||||||
|
"quickapp" : {}, |
||||||
|
/* 快应用特有相关 */ |
||||||
|
"mp-weixin" : { |
||||||
|
/* 小程序特有相关 */ |
||||||
|
"appid" : "wx8d49e2f83025229d", |
||||||
|
"setting" : { |
||||||
|
"urlCheck" : true |
||||||
|
}, |
||||||
|
"permission" : {} |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,76 @@ |
|||||||
|
/** |
||||||
|
* 这里是uni-app内置的常用样式变量 |
||||||
|
* |
||||||
|
* uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量 |
||||||
|
* 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App |
||||||
|
* |
||||||
|
*/ |
||||||
|
|
||||||
|
/** |
||||||
|
* 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能 |
||||||
|
* |
||||||
|
* 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件 |
||||||
|
*/ |
||||||
|
|
||||||
|
/* 颜色变量 */ |
||||||
|
|
||||||
|
/* 行为相关颜色 */ |
||||||
|
$uni-color-primary: #007aff; |
||||||
|
$uni-color-success: #4cd964; |
||||||
|
$uni-color-warning: #f0ad4e; |
||||||
|
$uni-color-error: #dd524d; |
||||||
|
|
||||||
|
/* 文字基本颜色 */ |
||||||
|
$uni-text-color:#333;//基本色 |
||||||
|
$uni-text-color-inverse:#fff;//反色 |
||||||
|
$uni-text-color-grey:#999;//辅助灰色，如加载更多的提示信息 |
||||||
|
$uni-text-color-placeholder: #808080; |
||||||
|
$uni-text-color-disable:#c0c0c0; |
||||||
|
|
||||||
|
/* 背景颜色 */ |
||||||
|
$uni-bg-color:#ffffff; |
||||||
|
$uni-bg-color-grey:#f8f8f8; |
||||||
|
$uni-bg-color-hover:#f1f1f1;//点击状态颜色 |
||||||
|
$uni-bg-color-mask:rgba(0, 0, 0, 0.4);//遮罩颜色 |
||||||
|
|
||||||
|
/* 边框颜色 */ |
||||||
|
$uni-border-color:#c8c7cc; |
||||||
|
|
||||||
|
/* 尺寸变量 */ |
||||||
|
|
||||||
|
/* 文字尺寸 */ |
||||||
|
$uni-font-size-sm:24upx; |
||||||
|
$uni-font-size-base:28upx; |
||||||
|
$uni-font-size-lg:32upx; |
||||||
|
|
||||||
|
/* 图片尺寸 */ |
||||||
|
$uni-img-size-sm:40upx; |
||||||
|
$uni-img-size-base:52upx; |
||||||
|
$uni-img-size-lg:80upx; |
||||||
|
|
||||||
|
/* Border Radius */ |
||||||
|
$uni-border-radius-sm: 4upx; |
||||||
|
$uni-border-radius-base: 6upx; |
||||||
|
$uni-border-radius-lg: 12upx; |
||||||
|
$uni-border-radius-circle: 50%; |
||||||
|
|
||||||
|
/* 水平间距 */ |
||||||
|
$uni-spacing-row-sm: 10px; |
||||||
|
$uni-spacing-row-base: 20upx; |
||||||
|
$uni-spacing-row-lg: 30upx; |
||||||
|
|
||||||
|
/* 垂直间距 */ |
||||||
|
$uni-spacing-col-sm: 8upx; |
||||||
|
$uni-spacing-col-base: 16upx; |
||||||
|
$uni-spacing-col-lg: 24upx; |
||||||
|
|
||||||
|
/* 透明度 */ |
||||||
|
$uni-opacity-disabled: 0.3; // 组件禁用态的透明度 |
||||||
|
|
||||||
|
/* 文章场景相关 */ |
||||||
|
$uni-color-title: #2C405A; // 文章标题颜色 |
||||||
|
$uni-font-size-title:40upx; |
||||||
|
$uni-color-subtitle: #555555; // 二级标题颜色 |
||||||
|
$uni-font-size-subtitle:36upx; |
||||||
|
$uni-color-paragraph: #3F536E; // 文章段落颜色 |
||||||
|
$uni-font-size-paragraph:30upx; |
||||||
Loading…
Reference in new issue