## XMall-Front
### 基于Vue开发的XMall商城前台页面
### [宣传视频](https://www.bilibili.com/video/av23121122/)
- 作者亲自制作 [点我观看](https://www.bilibili.com/video/av23121122/)
### 项目已部署,在线Demo
- 前台商城:http://xmall.exrick.cn/
- 后台管理系统:http://xmadmin.exrick.cn/
### 感谢 [yucccc](https://github.com/yucccc) 的开源 [vue-mall](https://github.com/yucccc/vue-mall) 项目提供前端页面及框架支持
### 后端全部重新开发接口,实现后台系统管理,后端接口项目请跳转至 [xmall](https://github.com/Exrick/xmall) 项目仓库查看
### 新增与优化
- [x] 优化页脚、增加商品搜索框组件
- [x] 优化登录注册界面
- [x] 新增搜索页面,实现高亮分页搜索
- [x] 新增捐赠页面,捐赠列表显示
- [x] 全部商品页面实现分页
- [x] 优化订单详情,实现查看订单进度,可对订单进行处理
- [x] 实现生成订单接口、优化地址管理编辑选择
- [x] 实现查看个人订单分页
- [x] 接入[XPay个人免签收款支付系统](https://github.com/Exrick/xpay)
- [x] 首页升级!重构首页,后台可配置,包括3D轮播图
- [x] 新增分类查看品牌周边等
- [极验验证码移除文档](https://github.com/Exrick/xmall/wiki/%E6%9E%81%E9%AA%8C%E7%A7%BB%E9%99%A4%E6%96%87%E6%A1%A3)
![](https://i.loli.net/2018/07/21/5b52e192366a0.jpg "首页")
![](https://i.loli.net/2018/07/22/5b5447c0f2b69.jpg "页脚")
![](https://i.loli.net/2018/07/22/5b5447e84edd9.jpg "搜索框组件")
![](https://i.loli.net/2018/07/22/5b5448040ff95.jpg "搜索结果")
![](https://i.loli.net/2018/07/22/5b54489e41551.jpg "分页")
![](https://i.loli.net/2018/07/22/5b54482cca360.jpg "订单详情")
![](https://i.loli.net/2018/07/22/5b5448494d6b6.jpg "订单进度")
![](https://i.loli.net/2018/07/22/5b54486109ade.jpg "登录界面")
### 所用技术
- Vue 2.x
- Vuex
- Vue Router
- [Element UI](http://element.eleme.io/#/zh-CN)
- ES6
- webpack
- axios
- Node.js
- 第三方SDK
- ~~[极验Test-button人机验证码](http://www.geetest.com/Test-button.html)~~ 因其收费详见[极验验证码移除文档](https://github.com/Exrick/xmall/wiki/%E6%9E%81%E9%AA%8C%E7%A7%BB%E9%99%A4%E6%96%87%E6%A1%A3)
- 第三方插件
- [hotjar](https://github.com/Exrick/xmall/blob/master/study/hotjar.md):一体化分析和反馈
- ~~[搜狐畅言评论插件](http://changyan.kuaizhan.com/)~~ 垃圾广告评论插件 现已更换 [Gitment](https://github.com/imsun/gitment)
### 本地开发运行
- 启动后端 [xmall](https://github.com/Exrick/xmall) 项目后,在 `config/index.js` 中修改你的后端接口地址配置
- Gitment评论配置见 [Gitment](https://github.com/imsun/gitment) 使用到的页面为 `thanks.vue`
- `index.html` 中复制粘贴替换你的 [hotjar](https://github.com/Exrick/xmall/blob/master/study/hotjar.md) 代码
- 在项目根文件夹下先后执行命令 `npm install` 、 `npm run dev`
- 商城前台端口默认9999 http://localhost:9999
## 部署
- 先后执行命令 `npm install` 、 `npm run build` 将打包生成的 `dist` 静态文件放置服务器中,若使用Nginx等涉及跨域请配置路由代理
### 技术疑问交流
- QQ交流群 `475743731(付费)`,可获取各项目详细图文文档、疑问解答 [![](http://pub.idqqimg.com/wpa/images/group.png)](http://shang.qq.com/wpa/qunwpa?idkey=7b60cec12ba93ebed7568b0a63f22e6e034c0d1df33125ac43ed753342ec6ce7)
- 免费交流群 `562962309` [![](http://pub.idqqimg.com/wpa/images/group.png)](http://shang.qq.com/wpa/qunwpa?idkey=52f6003e230b26addeed0ba6cf343fcf3ba5d97829d17f5b8fa5b151dba7e842)
- 个人博客:[http://blog.exrick.cn](http://blog.exrick.cn)
### 开源协议
- 请遵循原作者MIT开源协议
### 作者其他项目推荐
- [XMall微信小程序APP前端 现已开源!](https://github.com/Exrick/xmall-weapp)
[![[email protected]](https://s2.ax1x.com/2019/10/06/ucEsBD.md.png)](https://www.bilibili.com/video/av70226175)
- [X-Boot前后端分离开发平台](https://github.com/Exrick/x-boot)
![](https://i.loli.net/2020/03/13/rQGAWv1h8VMeIdi.png)
- [XPay个人免签收款支付系统](https://github.com/Exrick/xpay) 无需挂机App 自动回调
- 个人机器学习笔记
- [Machine-Learning](https://github.com/Exrick/Machine-Learning)
### [捐赠](http://xmall.exrick.cn)
没有合适的资源?快使用搜索试试~ 我知道了~
基于Vue开发的XMall商城前台页面 PC端.zip
共141个文件
png:41个
vue:36个
js:28个
需积分: 5 0 下载量 193 浏览量
2024-04-29
20:54:27
上传
评论
收藏 1.8MB ZIP 举报
温馨提示
基于Vue开发的XMall商城前台页面 PC端.zip
资源推荐
资源详情
资源评论
收起资源包目录
基于Vue开发的XMall商城前台页面 PC端.zip (141个子文件)
.babelrc 445B
iconfont.css 5KB
.editorconfig 147B
iconfont.eot 4KB
.eslintignore 23B
load.gif 124KB
.gitignore 145B
.gitkeep 0B
index.html 2KB
QQ截图20171022223650.jpg 75KB
QQ截图20171114233321.jpg 69KB
QQ截图20171022222841.jpg 68KB
QQ截图20171022190036.jpg 68KB
页脚.jpg 65KB
QQ截图20171022190107.jpg 65KB
QQ截图20171109215656.jpg 58KB
QQ截图20171022183906.jpg 57KB
con-bg_04f25dbf8e.jpg 35KB
[email protected] 11KB
3.c565d4ee71bdb3ac0105.js 382KB
7.0814cc986a8375eb2381.js 31KB
app.e28b119acf7c187f0fbf.js 20KB
gt.js 9KB
webpack.prod.conf.js 4KB
index.js 3KB
mutations.js 3KB
goods.js 2KB
dev-server.js 2KB
webpack.base.conf.js 2KB
utils.js 2KB
main.js 2KB
index.js 2KB
index.js 1KB
check-versions.js 1KB
webpack.dev.conf.js 1KB
build.js 953B
.eslintrc.js 700B
public.js 591B
index.js 563B
storage.js 480B
mutation-types.js 330B
vue-loader.conf.js 307B
dev-client.js 245B
.postcssrc.js 196B
dev.env.js 139B
prod.env.js 48B
action.js 18B
package-lock.json 295KB
package.json 2KB
README.md 4KB
[email protected] 123KB
小程序.png 121KB
xboot.png 89KB
[email protected] 49KB
1.00.png 41KB
5.00.png 41KB
10.00.png 41KB
0.10.png 41KB
custom.png 39KB
qqpay.png 26KB
error.png 22KB
0.10.png 21KB
custom.png 21KB
1.00.png 21KB
5.00.png 21KB
custom.png 21KB
1.00.png 21KB
10.00.png 21KB
10.00.png 21KB
5.00.png 20KB
0.10.png 20KB
[email protected] 19KB
no-search.png 19KB
no-data.png 16KB
[email protected] 16KB
M.png 7KB
smartisan_4ada7fecea.png 7KB
wechat-explain.png 7KB
smile.png 7KB
red.png 6KB
user-avatar.png 6KB
bg_9b9dcb65ff.png 6KB
support.png 5KB
qr.png 4KB
other-login.png 3KB
checkbox-new_631a56a4f6.png 2KB
cart-empty-new.png 2KB
dialog-gray-bg.png 2KB
[email protected] 202KB
reset.scss 1KB
common.scss 981B
mixin.scss 137B
theme.scss 130B
index.scss 62B
iconfont.svg 15KB
search.svg 3KB
共 141 条
- 1
- 2
资源评论
普通的一个普通猿
- 粉丝: 1462
- 资源: 1761
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功