Skip to content

Y
yudao-cloud
提交 74d05557 authored 作者: YunaiV's avatar YunaiV
浏览文件
操作

移除 user-mobile 项目，迁移到单独的工程

上级 6d1a47af
隐藏空白字符变更
内嵌 并排
正在显示 包含 0 行增加 和 8583 行删除
mobile-web/.editorconfig deleted 100644 → 0
浏览文件 @ 6d1a47af
# http://editorconfig.org
root = true
[*]
indent_style = space
indent_size = 2
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true
[*.md]
trim_trailing_whitespace = false
[Makefile]
indent_style = tab
mobile-web/.gitignore deleted 100644 → 0
浏览文件 @ 6d1a47af
.DS_Store
node_modules
/dist
dist
# local env files
.env.local
.env.*.local
# Log files
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# Editor directories and files
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw*
mobile-web/README.md deleted 100644 → 0
浏览文件 @ 6d1a47af
# vue 商城
> TODO
\ No newline at end of file
mobile-web/README_INDEX.md deleted 100644 → 0
浏览文件 @ 6d1a47af
## 基于Vue实现开箱即用移动端商城的单页应用
>这是开箱即用移动端商城的框架。只需要后端返回标准接口数据，前端配置接口地址等信息，标准商城的页面不需要做任何调整。
## 特性
- 开箱即用，集成后台接口格式，前端可做二次开发以实现自有业务
- 首页是由图片广告、图文导航、商品、公告、搜索、文本、标题、辅助空白、辅助线、方格等组件根据后端接口数据动态渲染，可根据后端返回的数据渲染出N种首页效果
- 定制主题
## 手机预览
可以手机扫码以下二维码访问手机端 demo：
![](./docs/static/qrcode.png)
![](./docs/static/show1.jpg)
![](./docs/static/show2.jpg)
![](./docs/static/show3.jpg)
## 技术栈
- vue
- [vue cli 3](https://cli.vuejs.org/zh/guide/installation.html)
- [vant](https://github.com/youzan/vant)
- less
- [vue-router](https://router.vuejs.org/zh/installation.html)
- [axios](https://github.com/axios/axios)
- [babel-plugin-import](https://github.com/ant-design/babel-plugin-import)
## 快速上手
```
# 安装 Vue Cli 3
npm install -g @vue/cli
npm install
npm run dev
npm run build
```
调整src/config/env.js的配置信息
```
baseUrl: 域名地址
dataSources：数据源(local=本地)
```
## 进度
- [x] 界面样式
- [ ] 数据通过接口绑定
- [ ] 定制主题
- [ ] 代码重构优化
## 页面
```
- 首页
- 分类
- 商品
- 详情
- 列表
- 购物车
- 提交订单
- 会员
- 会员中心
- 账户管理
- 订单
- 列表
- 详情
- 追踪
- 售后
- 申请
- 列表
- 详情
- 进度详情
- 我的优惠券
- 我的收藏
- 收货地址
- 列表
- 编辑
- 手机登录
- 手机注册
```
mobile-web/babel.config.js deleted 100644 → 0
浏览文件 @ 6d1a47af
module.exports = {
presets: ['@vue/app'],
plugins: [
[
'import',
{ libraryName: 'vant', libraryDirectory: 'es', style: true },
'vant'
]
]
};
mobile-web/package.json deleted 100644 → 0
浏览文件 @ 6d1a47af
{
"name": "shop-vue",
"version": "0.1.0",
"private": true,
"scripts": {
"start": "npm run serve",
"serve": "vue-cli-service serve",
"build": "NODE_ENV=production vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"axios": "^0.18.0",
"moment": "^2.24.0",
"pingpp-js": "^2.2.13",
"vant": "^1.3.1",
"vue": "^2.5.17",
"vue-router": "^3.0.1",
"vuex": "^3.1.0"
},
"devDependencies": {
"@vue/cli-plugin-babel": "^3.4.1",
"@vue/cli-plugin-eslint": "^3.4.1",
"@vue/cli-service": "^3.6.0",
"babel-plugin-import": "^1.8.0",
"less": "^3.8.1",
"less-loader": "^4.1.0",
"vue-lazyload": "^1.2.6",
"vue-template-compiler": "^2.5.17"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/essential",
"eslint:recommended"
],
"rules": {},
"parserOptions": {
"parser": "babel-eslint"
}
},
"postcss": {
"plugins": {
"autoprefixer": {}
}
},
"browserslist": [
"Android >= 4.0",
"iOS >= 7"
]
}
mobile-web/public/index.html deleted 100644 → 0
浏览文件 @ 6d1a47af
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no, viewport-fit=cover">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
</head>
<body>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
mobile-web/server/README.md deleted 100644 → 0
浏览文件 @ 6d1a47af
# 使用说明
### 第一步
```
npm install
```
### 第二步
复制文件到 server 目录
```
cp -rf dist server
```
### 第三步
```
node server.prod
```
mobile-web/server/config/chalk.config.js deleted 100644 → 0
浏览文件 @ 6d1a47af
//
// 粉笔：
// 输出不同颜色的提示信息
const chalk = require('chalk');
module.exports = {
chalkError: chalk.red,
chalkSuccess: chalk.green,
chalkWarning: chalk.yellow,
chalkProcessing: chalk.blue,
};
mobile-web/server/config/proxy.prod.config.js deleted 100644 → 0
浏览文件 @ 6d1a47af
module.exports = {
'/admin-api -> http://180.167.213.26:18083/': {
changeOrigin: true,
pathRewrite: {},
},
'/server/api -> https://preview.pro.ant.design/': {
changeOrigin: true,
pathRewrite: { '^/server': '' },
},
};
mobile-web/server/package.json deleted 100644 → 0
浏览文件 @ 6d1a47af
{
"name": "browser-work-server",
"description": "node server",
"dependencies": {
"express": "^4.16.3",
"object-assign": "4.1.1",
"chalk": "2.4.1",
"http-proxy-middleware": "^0.18.0"
}
}
mobile-web/server/pm2.json deleted 100644 → 0
浏览文件 @ 6d1a47af
{
"name": "mobile-web",
"script": "./server.prod.js",
"instances": "1",
"env": {
"NODE_ENV": "development"
},
"env_production": {
"NODE_ENV": "production"
}
}
mobile-web/server/server.prod.js deleted 100644 → 0
浏览文件 @ 6d1a47af
const path = require('path');
const express = require('express');
const { chalkSuccess } = require('./config/chalk.config');
const proxyConfig = require('./config/proxy.prod.config');
const proxyBuild = require('./utils/proxy.build');
// create app server
const app = express();
const port = 3100;
// host proxy
app.use(proxyBuild(proxyConfig));
// use index.html
app.use(express.static(path.join(__dirname, 'dist/css')));
app.use(express.static(path.join(__dirname, 'dist/js')));
app.use(express.static(path.join(__dirname, 'dist')));
app.use((req, res) => {
res.sendFile(path.join(__dirname, 'dist', 'index.html'));
});
app.listen(port, error => {
if (error) {
console.error(error);
} else {
console.info(
chalkSuccess(
'==> 🌎 Listening on port %s. ' + 'Open up http://localhost:%s/ in your browser.'
),
port,
port
);
}
});
mobile-web/server/shell.sh deleted 100644 → 0
浏览文件 @ 6d1a47af
# 安装依赖包
cd mobile-web
npm install
# 开始构建
#npm run build
# 创建 app 运行目录
rm -rf app
mkdir app
# 复制配置文件
cp -rf server app/
# npm 构建项目
npm run build
# 复制文件到 server 努力
cp -rf dist app/server
# 复制文件到 project 目录执行
if [ ! -d "/work2/project/mobile-web/server/dist" ]; then
mkdir -pv /work2/project/mobile-web/server/dist
else
rm -rf /work2/project/mobile-web/server/dist
fi
cp -rf app/server /work2/project/mobile-web
# 安装 server 依赖项
cd /work2/project/mobile-web/server
npm install
# 启动服务
pm2 restart pm2.json
mobile-web/server/utils/proxy.build.js deleted 100644 → 0
浏览文件 @ 6d1a47af
const proxy = require('http-proxy-middleware');
const ObjectAssign = require('object-assign');
const { chalkError, chalkSuccess } = require('../config/chalk.config');
/**
*
* key :
* [0]: /api
* [1]: target url
*
* 预计写法：
* 1、 /api -> baidu.com : { }
* 2、 /user : function() { return {} }
*
* @param config
*/
module.exports = function(config) {
console.info(chalkSuccess('build proxy.%s.config 配置!'), process.env.NODE_ENV);
const proxys = [];
if (!config) {
console.log(chalkError('proxy.%s.config 没有配置!'), process.env.NODE_ENV);
}
for (const key in config) {
if (/->/.test(key)) {
const keys = key.toString().split('->');
const source = keys[0].trim();
const target = keys[1].trim();
if (typeof config !== 'object') {
console.log(
chalkError('%s: proxy.%s.config 初始化失败 config 类型为 object!'),
key,
process.env.NODE_ENV
);
break;
}
proxys.push(proxy(source, ObjectAssign({ target }, config[key])));
}
}
return proxys;
};
mobile-web/src/App.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div id="app">
<router-view/>
</div>
</template>
<script>
import './assets/style/common.css';
export default {
name: 'app'
}
</script>
mobile-web/src/api/order.js deleted 100644 → 0
浏览文件 @ 6d1a47af
import request from "../config/request";
// order
export function createOrder(params) {
return request({
headers: {
'Content-Type': 'application/json',
},
url: '/order-api/users/order/create_order',
method: 'post',
data: {
...params,
},
});
}
export function getOrderPage(params) {
return request({
url: '/order-api/users/order/order_page',
method: 'get',
params: {
...params,
}
});
}
export function confirmReceiving(orderId) {
return request({
url: '/order-api/users/order/confirm_receiving',
method: 'post',
params: {
orderId,
}
});
}
export function getOrderConfirmCreateOrder(skuId, quantity, couponCardId) {
return request({
url: '/order-api/users/order/confirm_create_order',
method: 'get',
params: {
skuId,
quantity,
couponCardId,
}
});
}
export function getOrderInfo(orderId) {
return request({
url: '/order-api/users/order/info',
method: 'get',
params: {
orderId,
}
});
}
// Cart
export function createOrderFromCart(userAddressId, couponCardId, remark) {
return request({
url: '/order-api/users/order/create_order_from_cart',
method: 'post',
params: {
userAddressId,
remark,
couponCardId,
}
});
}
export function addCart(skuId, quantity) {
return request({
url: '/order-api/users/cart/add',
method: 'post',
params: {
skuId,
quantity,
}
});
}
export function countCart() {
return request({
url: '/order-api/users/cart/count',
method: 'get',
params: {
}
});
}
export function listCart() {
return request({
url: '/order-api/users/cart/list',
method: 'get',
params: {
}
});
}
export function updateCartSelected(skuIds, selected) {
return request({
url: '/order-api/users/cart/update_selected',
method: 'post',
params: {
skuIds: skuIds.join(','),
selected,
}
});
}
export function getCartConfirmCreateOrder(couponCardId) {
return request({
url: '/order-api/users/cart/confirm_create_order',
method: 'get',
params: {
couponCardId
}
});
}
export function getCartCalcSkuPrice(skuId) {
return request({
url: '/order-api/users/cart/calc_sku_price',
method: 'get',
params: {
skuId,
}
});
}
// 物流信息
export function getOrderLogisticsInfo(params) {
return request({
url: '/order-api/users/order_logistics/info_order',
method: 'get',
params: {
...params,
}
});
}
export function getLogisticsInfo(logisticsId) {
return request({
url: '/order-api/users/order_logistics/info',
method: 'GET',
params: {
logisticsId,
},
});
}
// 退货信息
export function getOrderReturnReason() {
return request({
url: '/order-api/users/order_return/reason',
method: 'GET',
});
}
export function orderReturnApply(params) {
return request({
headers: {
'Content-Type': 'application/json',
},
url: '/order-api/users/order_return/apply',
method: 'POST',
data: {
...params,
},
});
}
export function getOrderReturnInfo(orderId) {
return request({
url: '/order-api/users/order_return/info',
method: 'GET',
params: {
orderId,
},
});
}
mobile-web/src/api/page.js deleted 100644 → 0
浏览文件 @ 6d1a47af
import request from "../config/request";
export function GetPage() {
return request({
url: '/Page/GetPage',
method: 'get',
})
}
export function getProduct(id) {
return request({
url: '/Page/Product',
method: 'get',
params: { id }
})
}
\ No newline at end of file
mobile-web/src/api/pay.js deleted 100644 → 0
浏览文件 @ 6d1a47af
import request from "../config/request";
export function getTransaction(appId, orderId) {
return request({
url: '/pay-api/users/transaction/get',
method: 'get',
params: {
appId,
orderId
}
});
}
export function submitTransaction(appId, orderId, payChannel) {
return request({
url: '/pay-api/users/transaction/submit',
method: 'post',
params: {
appId,
orderId,
payChannel
}
});
}
mobile-web/src/api/product.js deleted 100644 → 0
浏览文件 @ 6d1a47af
import request from "../config/request";
export function getProductCategoryList(pid) {
return request({
url: '/product-api/users/category/list',
method: 'get',
params: {
pid
}
});
}
export function getProductSpuPage(cid, pageNo, pageSize) {
return request({
url: '/product-api/users/spu/page',
method: 'get',
params: {
cid,
pageNo: pageNo || 1,
pageSize: pageSize || 10,
}
});
}
export function getProductSpuInfo(id) {
return request({
url: '/product-api/users/spu/info',
method: 'get',
params: {
id,
}
});
}
export function collectionSpu(spuId,hasCollectionType) {
return request({
url: '/product-api/users/spu/collection/'+spuId+'/' + hasCollectionType,
method: 'post'
});
}
mobile-web/src/api/promotion.js deleted 100644 → 0
浏览文件 @ 6d1a47af
import request from "../config/request";
// Banner
export function getBannerList() {
return request({
url: '/promotion-api/users/banner/list',
method: 'get',
});
}
// Product Recommend
export function getProductRecommendList() {
return request({
url: '/promotion-api/users/product_recommend/list',
method: 'get',
params: {
}
});
}
// Coupon Template
export function getCouponTemplate(id) {
return request({
url: '/promotion-api/users/coupon/template/get',
method: 'get',
params: {
id,
}
});
}
export function doAddCouponCard(templateId) {
return request({
url: '/promotion-api/users/coupon/card/add',
method: 'post',
params: {
templateId,
}
});
}
// Coupon Card
export function getCouponPage(status, pageNo, pageSize) {
return request({
url: '/promotion-api/users/coupon/card/page',
method: 'get',
params: {
status,
pageNo,
pageSize
}
});
}
mobile-web/src/api/search.js deleted 100644 → 0
浏览文件 @ 6d1a47af
import request from "../config/request";
export function getProductPage({cid, keyword, pageNo, pageSize, sortField, sortOrder}) {
return request({
url: '/search-api/users/product/page',
method: 'get',
params: {
cid,
keyword,
pageNo: pageNo || 1,
pageSize: pageSize || 10,
sortField: sortField,
sortOrder: sortOrder,
}
});
}
export function getProductCondition({keyword}) {
return request({
url: '/search-api/users/product/condition',
method: 'get',
params: {
keyword,
}
});
}
mobile-web/src/api/user.js deleted 100644 → 0
浏览文件 @ 6d1a47af
import request from "../config/request";
export function GetFavoritePage(pageNo,pageSize){
return request({
url: '/user-api/users/favorite/page',
method: 'get',
params: { pageNo,pageSize }
})
}
export function DelFavorite(spuId){
return request({
url: '/user-api/users/favorite/remove',
method: 'DELETE',
params: { spuId }
})
}
export function hasUserSpuFavorite(spuId){
return request({
url: '/user-api/users/favorite/hasUserFavorite',
method: 'get',
params: {spuId}
})
}
export function GetCoupon(data){
return request({
url: '/User/GetCoupon',
method: 'Post',
params: { data }
})
}
export function ExchangeCoupon(code){
return request({
url: '/User/ExchangeCoupon',
method: 'Post',
params: { code:code }
})
}
export function getUserInfo() {
return request({
url: '/user-api/users/user/info',
method: 'get',
});
}
export function doUserUpdateNickname(nickname) {
return request({
url: '/user-api/users/user/update_nickname',
method: 'post',
params: {
nickname,
}
});
}
export function doPassportMobileRegister(mobile, code) {
return request({
url: '/user-api/users/passport/mobile/register',
method: 'post',
params: {
mobile,
code,
}
});
}
export function doPassportMobileSendRegisterCode(mobile) {
return request({
url: '/user-api/users/passport/mobile/send_register_code',
method: 'post',
params: {
mobile,
}
});
}
// -------------------------- address
export function GetAddressList(){
return request({
url: '/user-api/users/address/list',
method: 'get',
})
}
export function GetAddressById(id){
return request({
url: '/user-api/users/address/address',
method: 'get',
params: { id }
})
}
export function GetDefaultAddress(){
return request({
url: '/user-api/users/address/default_address',
method: 'get',
})
}
export function UpdateAddress(data){
return request({
url: '/user-api/users/address/update',
method: 'PUT',
params: data
})
}
export function SaveAddress(data){
return request({
url: '/user-api/users/address/add',
method: 'POST',
params: data
})
}
export function DelAddress(data){
return request({
url: '/user-api/users/address/remove',
method: 'DELETE',
params: data
})
}
mobile-web/src/assets/style/common.css deleted 100644 → 0
浏览文件 @ 6d1a47af
body {
margin: 0px;
padding: 0px;
color: rgb(34, 34, 34);
font-family: Helvetica, "Hiragino Sans GB", "Microsoft YaHei", Simsun, "Droid Sans Fallback", sans-serif;
text-decoration: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
background-color: #ffffff;
}
/* 处理 pc 最大尺寸 */
#app {
/*border-left: 1px solid #ccc2bf;*/
/*border-right: 1px solid #ccc2bf;*/
}
@media screen and (min-width: 769px) {
#app, .van-goods-action, .van-overflow-hidden {
max-width: 600px!important;
margin: 0 auto;
}
.van-tabbar, .van-submit-bar {
max-width: 600px!important;
position:fixed;
margin:auto;
left:0;
right:0;
}
}
.wap-wrap {
font-size: 0.32rem;
width: 100%;
}
#maxWidth {
display: flex;
flex: 1;
}
body, div, dl, dt, dd, ol, ul, li, h1, h2, h3, h4, h5, h6, h7, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
margin: 0px;
padding: 0px;
}
ul {
list-style: none;
}
li {
list-style: none;
}
img {
border: 0px currentColor;
vertical-align: top;
}
ol {
list-style: none;
margin: 0px;
padding: 0px;
}
a {
color: rgb(0, 0, 0);
text-decoration: none;
}
mobile-web/src/assets/style/index.css deleted 100644 → 0
浏览文件 @ 6d1a47af

.tt-header, #ttkey {max-width:640px;}
/*倒计时begin*/
.countdown {
text-align: center;
height: 42px;
line-height: 42px;
font-size: 12px;
background-size: cover;
background-position: 50%;
background-repeat: no-repeat;
}
.fontweight_300 {
font-weight: 300;
}
.countdown b {
color: red;
}
.countdown b {
margin: 5px;
font-size: 16px;
font-weight: 300
}
/*倒计时end*/
/*魔方begin*/
.cap-cube {
width: 100%;
position: relative;
}
.cap-cube__item {
float: left;
background-repeat: no-repeat;
background-size: cover;
background-position: 50%;
overflow: hidden;
}
.cap-cube__table-image--invisible {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
opacity: 0;
}
/*魔方end*/
/*图片广告begin*/
.swiper-container {
width: 100%;
height: 100%;
}
.swiper-slide img {
width: 100%;
}
.cap-image-ad__content {
position: relative;
}
.cap-image-ad__content .image-wrapper {
position: relative;
}
.cap-image-ad__image {
width: 100%;
}
.swiper-slide {
text-align: center;
font-size: 18px;
background: #fff;
/* Center slide text vertically */
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
}
.cap-image-ad__slide {
width: 100%;
overflow-x: scroll;
overflow-y: hidden;
-webkit-overflow-scrolling: touch;
white-space: nowrap;
}
.cap-image-ad__slide .image-wrapper {
display: inline-block;
height: 100%;
position: relative;
}
.cap-image-ad__slide .cap-image-ad__image {
height: 100%;
width: 100%;
margin-right: 0;
margin-left: 0;
}
/*图片广告end*/
/*图文导航begin*/
h3 {
margin: 0;
padding: 0;
border: 0;
font: inherit;
font-size: 100%;
vertical-align: baseline;
}
a {
text-decoration: none;
color: #000;
}
.cap-image-ad__image-nav {
white-space: nowrap;
-webkit-overflow-scrolling: touch;
background-color: #fff;
font-size: 0;
}
.cap-image-ad__image-nav .image-wrapper {
display: inline-block;
vertical-align: middle;
}
.cap-image-ad__link--image-nav {
font-size: 0;
}
.cap-image-ad__link {
display: block;
position: relative;
height: 100%;
}
.cap-image-ad__image-nav .cap-image-ad__image {
background-size: cover;
background-position: 50%;
}
.cap-image-ad__image-nav .cap-image-ad__nav-title {
padding-bottom: 9px;
height: 33px;
line-height: 24px;
}
.cap-image-ad__nav-title {
font-size: 12px;
height: 20px;
line-height: 20px;
width: 100%;
padding-left: 5px;
padding-right: 5px;
font-weight: inherit;
}
.cap-image-ad__nav-title, .cap-image-ad__title {
text-align: center;
overflow: hidden;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.cap-image-ad__text-nav .text-nav-wrapper {
display: inline-block;
padding: 15px 0;
}
.cap-image-ad__text-nav .cap-image-ad__nav-title {
position: relative;
height: 12px;
line-height: 12px;
font-size: 12px;
text-align: center;
}
/*图文导航end*/
/*商品begin*/
body, div, dl, dt, dd, ol, ul, li, h1, h2, h3, h4, h5, h6, h7, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
margin: 0px;
padding: 0px;
}
ol, ul {
margin: 0;
padding: 0;
list-style: none;
}
.cap-goods-list__item--big {
margin: 15px;
}
.cap-goods-list__item {
display: block;
position: relative;
min-height: 100px;
color: #333;
background-color: #fff;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.cap-goods-list__item.simple {
background-color: inherit;
}
.cap-goods-list__container--big .cap-goods-list__wrapper:first-child .cap-goods-list__item, .cap-goods-list__container--list .cap-goods-list__wrapper:first-child .cap-goods-list__item {
margin-top: 5px;
}
.cap-goods-list__item--big.cap-goods-list__item--ratio-1-1 .cap-goods-list__photo, .cap-goods-list__item--big.cap-goods-list__item--ratio-3-2 .cap-goods-list__photo {
min-height: 0;
height: 0;
}
.cap-goods-list__item--big.cap-goods-list__item--ratio-3-2 .cap-goods-list__photo {
padding-top: 100%;
}
.cap-goods-list__item--big.cap-goods-list__item--ratio-1-1 .cap-goods-list__img, .cap-goods-list__item--big.cap-goods-list__item--ratio-3-2 .cap-goods-list__img {
position: absolute;
}
.cap-goods-list__img, .cap-goods-list__photo--soldout:after {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
width: 100%;
}
.cap-goods-list__img {
vertical-align: bottom;
height: auto;
}
.cap-goods-list__item--big .cap-goods-list__img {
position: relative;
display: block;
}
.cap-goods-list__item--padding .cap-goods-list__img {
width: 100%;
height: auto;
}
.cap-goods-list__photo {
text-align: center;
overflow: hidden;
position: relative;
min-height: 100px;
max-height: 500px;
z-index: 0;
}
.cap-goods-list__info {
position: relative;
overflow: hidden;
}
.cap-goods-list__item--big .cap-goods-list__info {
padding: 10px;
}
.cap-goods-list__item.simple .cap-goods-list__info.has-price, .cap-goods-list__item.simple .cap-goods-list__info.has-title {
text-align: center;
}
.cap-goods-list__info .title {
font-size: 14px;
line-height: 18px;
overflow: hidden;
word-break: break-all;
font-weight: initial;
}
.cap-goods-list__item--big .cap-goods-list__info .title {
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.cap-goods-list__item.simple .cap-goods-list__info .title {
height: 36px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.cap-goods-list__item.simple .cap-goods-list__info.has-title.has-price .title, .cap-goods-list__item.simple .cap-goods-list__info.has-title.has-subtitle .title {
margin-bottom: 6px;
}
.cap-goods-list__info .sale-info {
color: #e50f3d;
font-size: 16px;
line-height: 1;
}
.has-title.has-price.has-btn .sale-info {
position: absolute;
bottom: 10px;
left: 10px;
}
.cap-goods-list__info.has-title.has-price.has-btn {
padding-bottom: 36px;
}
.has-title.has-price.has-btn .title {
height: 36px;
}
.card .cap-goods-list__buy-btn-wrapper {
right: 10px;
bottom: 10px;
}
.title {
color: #333;
text-align: left;
}
/*小图样式*/
.cap-goods-list__container--small {
overflow: hidden;
padding: 0 12px;
}
.cap-goods-list__container--small .cap-goods-list__wrapper {
float: left;
width: 50%;
}
.cap-goods-list__item.simple {
background-color: inherit;
}
.cap-goods-list__item--small {
margin: 3px;
}
.cap-goods-list__item--small .cap-goods-list__photo {
min-height: 0;
padding-top: 100%;
height: 0;
}
.cap-goods-list__item--small .cap-goods-list__info.has-price .sale-info {
line-height: 1;
}
/*一大两小样式*/
.cap-goods-list__container--hybrid, .cap-goods-list__container--waterfall {
overflow: hidden;
padding: 0 12px;
}
.cap-goods-list__container--hybrid .cap-goods-list__wrapper--hybrid-big {
width: 100%;
}
.cap-goods-list__item--hybrid-big {
margin: 5px 3px;
}
.cap-goods-list__container--hybrid .cap-goods-list__wrapper--hybrid-small {
width: 50%;
}
.cap-goods-list__container--hybrid .cap-goods-list__wrapper {
float: left;
overflow: hidden;
}
/*详细列表样式*/
.cap-goods-list__container--list.cap-goods-list__container--simple {
padding-left: 15px;
background-color: #fff;
position: relative;
}
.cap-goods-list__container--list.cap-goods-list__container--simple .cap-goods-list__wrapper {
padding: 10px 15px 10px 0;
position: relative;
}
.cap-goods-list__item.simple.cap-goods-list__item--list {
min-height: auto;
}
.cap-goods-list__item.simple.cap-goods-list__item--list .cap-goods-list__photo {
margin-right: 15px;
width: 98px;
height: 98px;
min-height: auto;
}
.cap-goods-list__item--list .cap-goods-list__photo {
float: left;
}
.cap-goods-list__item.simple.cap-goods-list__item--list .cap-goods-list__info {
margin-left: 113px;
height: 98px;
text-align: left;
}
.cap-goods-list__info {
position: relative;
overflow: hidden;
}
.cap-goods-list__item.simple.cap-goods-list__item--list .cap-goods-list__info .title {
height: auto;
max-height: 36px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.cap-goods-list__item.simple.cap-goods-list__item--list .cap-goods-list__info .sale-info {
bottom: 0;
}
.cap-goods-list__item--list.cap-goods-list__item--btn1 .cap-goods-list__info .sale-info {
line-height: 24px;
}
.cap-goods-list__item--list .cap-goods-list__info .sale-info {
position: absolute;
left: 0;
bottom: 10px;
}
.cap-goods-list__item.simple.cap-goods-list__item--list .cap-goods-list__buy-btn-wrapper {
right: 5px;
bottom: 0;
}
.cap-goods-list__buy-btn-wrapper {
position: absolute;
}
.cap-goods-list__buy-btn-wrapper .cap-goods-list__buy-btn-4 {
font-size: 14px;
line-height: 24px;
height: 26px;
border-color: #f44;
color: #f44;
min-width: 48px;
cursor: pointer;
border-radius: 2px;
border: 1px solid;
background-color: #fff;
}
.cap-goods-list__container--list.cap-goods-list__container--simple .cap-goods-list__wrapper:after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 200%;
height: 200%;
-webkit-transform: scale(.5);
-moz-transform: scale(.5);
-ms-transform: scale(.5);
transform: scale(.5);
-webkit-transform-origin: 0 0;
-moz-transform-origin: 0 0;
-ms-transform-origin: 0 0;
transform-origin: 0 0;
pointer-events: none;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
border: 0 solid #e5e5e5;
border-bottom-width: 1px;
}
.cap-goods-list__item--list.card2:after, .cap-goods-list__item--list.card:after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 200%;
height: 200%;
-webkit-transform: scale(.5);
-moz-transform: scale(.5);
-ms-transform: scale(.5);
transform: scale(.5);
-webkit-transform-origin: 0 0;
-moz-transform-origin: 0 0;
-ms-transform-origin: 0 0;
transform-origin: 0 0;
pointer-events: none;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
border: 1px solid #e5e5e5;
}
.cap-goods-list__item--list.card2 .cap-goods-list__photo, .cap-goods-list__item--list.card .cap-goods-list__photo {
margin-right: 10px;
width: 118px;
height: 118px;
min-height: auto;
}
.cap-goods-list__item--list.card, .cap-goods-list__item--list.card2 {
min-height: auto;
margin: 15px;
}
.cap-goods-list__item--list.card2 .cap-goods-list__info, .cap-goods-list__item--list.card .cap-goods-list__info {
margin-left: 128px;
height: 118px;
margin-right: 10px;
}
.cap-goods-list__item--list.card2 .cap-goods-list__info .title, .cap-goods-list__item--list.card .cap-goods-list__info .title {
padding-top: 10px;
}
.cap-goods-list__item--list .cap-goods-list__info .title {
padding-top: 2px;
margin-bottom: 12px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.cap-goods-list__item--list.cap-goods-list__item--btn4 .cap-goods-list__info .sale-info {
line-height: 26px;
}
.cap-goods-list__item--list.card2 .cap-goods-list__buy-btn-wrapper, .cap-goods-list__item--list.card .cap-goods-list__buy-btn-wrapper {
right: 15px;
bottom: 10px;
}
.cap-goods-list__item--list .cap-goods-list__info.has-title.has-price.has-btn {
padding-bottom: 0;
}
/*一行三个样式*/
.cap-goods-list__container--three {
padding: 0 12px;
}
.cap-goods-list__item--three {
margin: 5px 3px;
}
.cap-goods-list__item--three .cap-goods-list__photo {
min-height: 0;
padding-top: 100%;
height: 0;
}
.cap-goods-list__container--three .cap-goods-list__wrapper {
float: left;
width: 33.33%;
}
.simple.cap-goods-list__item--three .cap-goods-list__info .sale-info {
font-size: 14px;
}
/*横向滑动样式*/
.cap-goods-list__container--three.nowrap {
overflow-x: auto;
overflow-y: hidden;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-overflow-scrolling: touch;
padding-bottom: 10px;
margin-bottom: -10px;
}
.cap-goods-list__container--three.nowrap .cap-goods-list__wrapper {
-webkit-box-flex: 0;
-webkit-flex: 0 0 30%;
-moz-box-flex: 0;
-ms-flex: 0 0 30%;
flex: 0 0 30%;
width: 30%;
float: none;
}
/*商品end*/
/*标题begin*/
.cap-title {
padding: 10px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
overflow: hidden;
word-break: break-all;
position: relative;
background: #F9F9F9;
}
.cap-title__main {
margin: 0;
font-size: 18px;
line-height: 22px;
}
.cap-title__sub {
font-size: 11px;
color: #8c8c8c;
margin: 5px 0 0;
}
/*标题end*/
/*商品搜索begin*/
.search-box, .search-box__view {
width: 100%;
height: 50px;
}
.search-box__view {
padding: 0 15px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-transition: top .3s linear;
-moz-transition: top .3s linear;
transition: top .3s linear;
}
.search {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-flex: 1;
-webkit-flex: 1;
-moz-box-flex: 1;
-ms-flex: 1;
flex: 1;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
position: relative;
}
.search .cell {
-webkit-box-flex: 1;
-webkit-flex: 1;
-moz-box-flex: 1;
-ms-flex: 1;
flex: 1;
padding: 0 10px;
height: 40px;
background: transparent;
}
.cell {
width: 100%;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
padding: 10px 15px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
line-height: 24px;
position: relative;
background-color: #fff;
color: #333;
font-size: 14px;
overflow: hidden;
}
.field .cell__value {
position: relative;
}
.cell__value--alone {
text-align: left;
}
.cell__value {
overflow: hidden;
text-align: right;
vertical-align: middle;
}
.cell__title, .cell__value {
-webkit-box-flex: 1;
-webkit-flex: 1;
-moz-box-flex: 1;
-ms-flex: 1;
flex: 1;
}
.field__body {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.field__control {
border: 0;
margin: 0;
padding: 0;
width: 100%;
resize: none;
display: block;
line-height: normal;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background-color: transparent;
}
.search .icon-search {
position: relative;
display: inline-block;
font-size: inherit;
text-rendering: auto;
color: #666;
font-size: 16px;
margin-left: 10px;
}
.search__filed {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
-webkit-flex: 1;
-moz-box-flex: 1;
-ms-flex: 1;
flex: 1;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
border-radius: 4px;
}
.search__filed--center {
-webkit-box-pack: center;
-webkit-justify-content: center;
-moz-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.search__filed--center .cell {
-webkit-box-flex: 0;
-webkit-flex: none;
-moz-box-flex: 0;
-ms-flex: none;
flex: none;
}
.search .cell__value .field__control {
background: transparent;
font-size: 12px;
}
.search .field__body {
-webkit-box-flex: 1;
-webkit-flex: 1;
-moz-box-flex: 1;
-ms-flex: 1;
flex: 1;
}
.search .cell__value {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.search__filed--circle {
border-radius: 20px;
overflow: hidden;
}
/*商品搜索end*/
/*公告begin*/
.notice-bar__left-icon {
height: 18px;
min-width: 20px;
padding-top: 1px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.notice-bar__wrap {
-webkit-box-flex: 1;
-webkit-flex: 1;
-moz-box-flex: 1;
-ms-flex: 1;
flex: 1;
height: 18px;
overflow: hidden;
position: relative;
}
.notice-bar__content {
position: absolute;
white-space: nowrap;
}
.notice-bar {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
color: #f60;
padding: 9px 15px;
font-size: 12px;
line-height: 1.5;
position: relative;
background-color: #fff7cc;
}
.notice-bar__left-icon img {
width: 16px;
height: 16px;
vertical-align: baseline;
}
/*公告end*/
\ No newline at end of file
mobile-web/src/components/common/productcard.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<router-link :to="'/product/' + product.id">
<van-cell-group class="additional">
<van-card
:title="product.name"
:desc="product.sellPoint"
:num="(iscard?null:product.quantity)"
style="background:#fff"
>
<template slot="thumb">
<img :src="product.picUrls && product.picUrls ? product.picUrls[0] : ''"/>
</template>
<template slot="tags">
<p class="price" v-if="product.buyPrice || product.price">
￥<span>{{product.buyPrice ? product.buyPrice / 100.00 : product.price / 100.00}}</span>
<van-tag v-if="product.promotionActivityTitle" plain type="danger">
{{ product.promotionActivityTitle }}
</van-tag>
</p>
<!-- TODO 芋艿 暂时去掉 -->
<!-- <van-stepper v-if="iscard" v-model="product.quantity" :max="product.max" :min="product.min"/>-->
</template>
</van-card>
<!-- TODO 芋艿，暂时去掉赠品 -->
<!--<van-cell v-for="(gift,j) in product.gift" :key="j" :value="'x'+gift.quantity" >-->
<!--<template slot="title">-->
<!--<van-tag type="danger" v-if="j==0" >赠品</van-tag>-->
<!--<span class="van-cell-text" :style="(j>0?'margin-left: 35px;':'')" >{{gift.title}}</span>-->
<!--</template>-->
<!--</van-cell>-->
<slot/>
</van-cell-group>
</router-link>
</template>
<script>
export default {
name: 'product-card',
props: {
product: Object,
iscard: {
type: Boolean,
default: false
},
}
}
</script>
<style lang="less">
.additional {
.van-cell {
padding: 0 15px;
font-size: 12px;
}
.van-cell:not(:last-child)::after {
border: 0;
}
.van-card__title {
font-size: 14px;
}
.van-cell__title {
flex: 10;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.van-tag {
line-height: 12px;
margin-right: 5px;
}
.price {
color: #e93b3d;
font-size: 10px;
overflow: hidden;
height: 18px;
span {
font-size: 16px;
margin-right: 5px;
}
.van-tag {
font-size: 12px;
}
}
.van-stepper {
position: absolute;
bottom: 5px;
right: 5px;
&__plus {
width: 30px;
}
&__minus {
width: 30px;
}
}
.image_tag {
position: absolute;
bottom: 0;
width: 90px;
height: 20px;
line-height: 20px;
font-size: 10px;
color: #fff;
text-align: center;
background-color: rgba(0, 0, 0, .7);
}
}
.additional::after {
border-color: #f7f7f7;
}
</style>
mobile-web/src/components/footer/navigate.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div style="height:50px;">
<van-tabbar v-model="active">
<van-tabbar-item icon="wap-home" to="/home">首页</van-tabbar-item>
<van-tabbar-item icon="wap-nav" to="/category" >分类</van-tabbar-item>
<van-tabbar-item icon="cart" to="/cart" >购物车</van-tabbar-item>
<van-tabbar-item icon="contact" to="/user/index">我的</van-tabbar-item>
</van-tabbar>
</div>
</template>
<script>
import { Tabbar, TabbarItem } from "vant";
export default {
name:'navigate',
components:{
[Tabbar.name]: Tabbar,
[TabbarItem.name]: TabbarItem,
},
data() {
return {
active: 0,
};
},
created() {
// TODO 芋艿，可能不太优雅
let path = this.$route.path;
switch (path) {
case '/home':
this.active = 0;
break;
case '/category':
this.active = 1;
break;
case '/cart':
this.active = 2;
break;
case '/user/index':
this.active = 3;
break;
}
}
}
</script>
mobile-web/src/components/header/nav.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<van-nav-bar
:title="title"
left-text=""
left-arrow
@click-left="onBack"
/>
</template>
<script>
import { NavBar } from 'vant';
export default {
name:'headerNav',
components:{
[NavBar.name]: NavBar,
},
props:{
title:String,
},
methods: {
onBack() {
history.back();
},
}
}
</script>
<style>
</style>
mobile-web/src/components/page/cube.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div class="cap-cube" style="font-size:100%;width:100%;">
<div v-for="(item,index) in data.images" :key="index" class="cap-cube__item" :style="'width:'+item.imgwidth+'rem;'+item.style">
<a :href="item.link">
<img :src="item.src+'?w=375'" :style="'width:'+item.imgwidth+'rem;'" />
</a>
</div>
<div style="clear:both;"></div>
</div>
</template>
<script>
export default {
name: "cube",
props: {
data: Object
},
created: function() {
var gap = this.data.imagegap;
var margin = gap / 2;
var width = 375;
var max = 0;
switch (this.data.type) {
case "1":
max = 2;
width = (width - margin * 2) / 2;
break;
case "2":
max = 3;
width = (width - margin * 4) / 3;
break;
case "3":
max = 4;
width = (width - margin * 6) / 4;
break;
case "4":
max = 4;
width = (width - margin * 2) / 2;
break;
case "5":
max = 3;
width = (width - margin * 2) / 2;
break;
case "6":
max = 3;
width = (width - margin * 2) / 2;
break;
case "7":
max = 4;
width = (width - margin * 2) / 2;
break;
}
margin = margin / 50;
width = width / 50;
var imagelist = [];
for (var i = 0; i < max; i++) {
var imgwidth = width;
var item = this.data.imagelist[i];
var style = "";
switch (this.data.type) {
case "1":
{
if (i == 0) {
style = "margin-right:" + margin + "rem;";
} else {
style = "margin-left:" + margin + "rem;";
}
}
break;
case "2":
{
if (i == 0) {
style = "margin-right:" + margin + "rem;";
} else if (i == 1) {
style = "margin:0 " + margin + "rem;";
} else {
style = "margin-left:" + margin + "rem;";
}
}
break;
case "3":
{
if (i == 0) {
style = "margin-right:" + margin + "rem;";
} else if (i == 1 || i == 2) {
style = "margin:0 " + margin + "rem;";
} else {
style = "margin-left:" + margin + "rem;";
}
}
break;
case "4":
{
if (i == 0) {
style =
"margin-right:" +
margin +
"rem;margin-bottom:" +
margin +
"rem;";
} else if (i == 1) {
style =
"margin-left:" +
margin +
"rem;margin-bottom:" +
margin +
"rem;";
} else if (i == 2) {
style =
"margin-right:" + margin + "rem;margin-top:" + margin + "rem;";
} else {
style =
"margin-left:" + margin + "rem;margin-top:" + margin + "rem;";
}
}
break;
case "5":
{
if (i == 0) {
style = "margin-right:" + margin + "rem;";
} else if (i == 1) {
style =
"margin-left:" +
margin +
"rem;margin-bottom:" +
margin +
"rem;";
} else {
style =
"margin-left:" + margin + "rem;margin-top:" + margin + "rem;";
}
}
break;
case "6":
{
if (i == 0) {
imgwidth = width * 2;
style = "margin-bottom:" + margin + "rem;";
} else if (i == 1) {
style =
"margin-right:" + margin + "rem;margin-top:" + margin + "rem;";
} else {
style =
"margin-left:" + margin + "rem;margin-top:" + margin + "rem;";
}
}
break;
case "7":
{
if (i == 0) {
style = "margin-right:" + margin + "rem;";
} else if (i == 1) {
style =
"margin-right:" + margin + "rem;margin-top:" + margin + "rem;";
} else if (i == 2) {
imgwidth = width / 2 - margin;
style =
"margin-left:" +
margin +
"rem;margin-top:" +
margin +
"rem;margin-right:" +
margin +
"rem";
} else {
imgwidth = width / 2 - margin;
style =
"margin-left:" + margin + "rem;margin-top:" + margin + "rem;";
}
}
break;
}
item.style = style;
item.imgwidth = imgwidth;
imagelist.push(item);
}
this.data.images = imagelist;
},
computed: {}
};
</script>
mobile-web/src/components/page/imageAd.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div>
<van-swipe :autoplay="3000" v-if="data.type=='1'" :style="'height:'+height+'px'" >
<van-swipe-item v-for="(image,index) in data.imagelist" :key="index" >
<a :href="image.url">
<img v-lazy="image.src+''" style="width: 100%;" />
</a>
</van-swipe-item>
</van-swipe>
<ul v-if="data.type=='2'">
<li v-for="(image,index) in data.imagelist" :key="index" class="cap-image-ad__content" :style="'margin:'+data.imagegap+'px 0px;'">
<div class="image-wrapper">
<a :href="image.url">
<img alt="" class="cap-image-ad__image" v-lazy="image.src+''" />
</a>
</div>
</li>
</ul>
<div v-if="data.type=='3'||data.type=='4'||data.type=='5'" class='cap-image-ad__image-nav' style='overflow-x:scroll;' >
<div v-for="(item,index) in data.imagelist" :key="index" class="image-wrapper" :style="'width:'+(data.type=='3'?'80':(data.type=='4'?'40':'20'))+'%;margin-right:'+data.imagegap+'px;'">
<a :href="item.link" class="cap-image-ad__link cap-image-ad__link--image-nav" >
<div class="cap-image-ad__image">
<img :src="item.src+'?w=640'" style="width: 100%; " />
</div>
</a>
</div>
</div>
</div>
</template>
<script>
// TODO 芋艿，准备废弃。
export default {
name:'imageAd',
components:{
},
props:{
data:Object
},
data(){
return{
height:0
}
},
created(){
if(this.data.imagelist.length==0||this.data.type!='1'){
return;
}
var that=this;
var image =this.data.imagelist[0];
let img = new Image()
img.src = image.src;
var width= window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
img.onload = function () {
that.height= Math.ceil(img.height/img.width * width);
}
}
}
</script>
<style>
</style>
mobile-web/src/components/page/imageText.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div :class='(data.type == "1" ? "cap-image-ad__image-nav" : "cap-image-ad__slide cap-image-ad__text-nav")' :style='"overflow-x:"+(data.showtype == "1" ? "hidden" : "scroll")+"; background-color:"+data.backgroundcolor' >
<div v-if="data.type == '1'" v-for="(item,index) in data.imagelist" :key="index" class="image-wrapper" :style="'width:'+ data.width+'%; margin-right: 0px;'">
<a :href="item.link" class="cap-image-ad__link cap-image-ad__link--image-nav" :style="'color:'+data.color">
<div class="cap-image-ad__image">
<img v-lazy="item.src+'?w=320'" style="width: 100%; " />
</div>
<h3 v-if="item.title!=''" class="cap-image-ad__nav-title">{{item.title}}</h3>
</a>
</div>
<a v-if="data.type=='2'" v-for="(item,index) in data.imagelist" :key="index" :href="item.link" class="text-nav-wrapper" :style="'width:'+data.width+'%; color: '+data.color+'; background-color: '+data.backgroundcolor"><h3 class="cap-image-ad__nav-title">{{item.title}}</h3></a>
</div>
</template>
<script>
export default {
name:'imageText',
props:{
data:Object
},
created:function(){
var width = 0;
if (this.data.showtype == "1") {
width = 100 / this.data.imagelist.length;
}
else {
width = (100 * 0.95) / (this.data.shownumber - 1);
}
this.data.width=width;
}
}
</script>
<style>
</style>
mobile-web/src/components/page/line.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div :style="divstyle" ><div :style="linestyle"></div></div>
</template>
<script>
export default {
name: 'page-line',
props: {
data: Object,
},
computed:{
divstyle(){
return{
height:"30px",
position:'relative',
margin:'0px '+this.data.margintype+'px'
};
},
linestyle(){
return{
position:'absolute',
top:'14px',
width:'100%',
borderTop:'1px '+(this.data.type==undefined?'solid':this.data.type)+" "+(this.data.color==undefined?'#000':this.data.color),
};
}
}
};
</script>
mobile-web/src/components/page/notice.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<NoticeBar
:text="data.value"
:background="data.background"
:color="data.color"
/>
</template>
<script>
import { NoticeBar } from "vant";
export default {
name:'notice',
components:{
NoticeBar
},
props:{
data:Object
},
computed:{
}
}
</script>
<style>
</style>
mobile-web/src/components/page/product.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div>
<ul
:class="'cap-goods-list__container cap-goods-list__container--'+data.classname+' cap-goods-list__container--'+data.ParameterDictionary.showtype+' '+(data.ParameterDictionary.type=='6'?'nowrap':'')">
<li v-if="productlist.length==0" style="width:100%;height:150px;border:0px;">
<div style="width:100%;height:150px;"></div>
</li>
<li v-for="(item,index) in productlist" :key="index"
:class="'cap-goods-list__wrapper '+(data.ParameterDictionary.type=='3'?(index%3==0?'cap-goods-list__wrapper--hybrid-big ':'cap-goods-list__wrapper--hybrid-small '):'')">
<router-link
:class="'cap-goods-list__item cap-goods-list__item--'+data.classname+' '+data.ParameterDictionary.showtype+' '+data.aclass"
:to="'/product/'+item.id">
<div class="cap-goods-list__photo">
<img class="cap-goods-list__img lazy lazyload"
v-lazy="item.imageURL+'?w='+((data.ParameterDictionary.type=='1'||data.ParameterDictionary.type=='3')?'750':'375')"/>
</div>
<div
:class="'cap-goods-list__info has-title has-price '+(data.ParameterDictionary.showtype == 'card'?'has-btn':'')">
<h3 class="title">{{item.title}}</h3>
<p class="sale-info">
<span class="sale-price">¥ {{item.price}}</span>
</p>
</div>
<div v-if="data.ParameterDictionary.showtype == 'card'"
class="cap-goods-list__buy-btn-wrapper cap-goods-list__buy-btn-wrapper--4">
<button
class="cap-goods-list__buy-btn-4 van-button van-button--default van-button--small">
{{data.ParameterDictionary.buttonvalue}}
</button>
</div>
</router-link>
</li>
</ul>
<div style="clear:both;"></div>
</div>
</template>
<script>
import {getProduct} from "../../api/page.js";
export default {
name: 'product',
data() {
return {
productlist: []
}
},
props: {
data: Object
},
created: function () {
var id = this.data.PageSectionId;
var data = this.data;
var classname = "big";
var aclass = "";
switch (data.ParameterDictionary.type) {
case "1":
aclass = "cap-goods-list__item--btn1 cap-goods-list__item--ratio-3-2 cap-goods-list__item--whitespace";
break;
case "2":
classname = "small";
aclass = "cap-goods-list__item--btn1 cap-goods-list__item--padding";
break;
case "3":
classname = "hybrid";
aclass = "cap-goods-list__item--big cap-goods-list__item--hybrid-big cap-goods-list__item--btn1 cap-goods-list__item--padding";
break;
case "4":
classname = "list";
aclass = "cap-goods-list__item--btn4 cap-goods-list__item--padding";
break;
case "5":
classname = "three";
aclass = "cap-goods-list__item--btn4 cap-goods-list__item--padding";
break;
case "6":
classname = "three";
break;
}
data.classname = classname;
data.aclass = aclass;
getProduct(id).then(response => {
this.productlist = response;
})
}
}
</script>
<style>
</style>
mobile-web/src/components/page/search.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div class="search-box" :style="boxstyle" >
<div class="search-box__view" :style="boxviewstyle">
<div class="search">
<div :class="'search__filed search__filed--'+data.textalign+' search__filed--'+(data.boxtype=='2'?'circle':'rect')" :style="'background-color:'+(data.boxcolor==undefined?'#ffffff':data.boxcolor)+';'">
<van-icon name="search" class="icon-search" size="14px" :color="data.color" />
<div class="cell field" :style="data.textalign=='left'?'':'width: 80px;'">
<div class="cell__value cell__value--alone">
<div class="field__body">
<input type="search" :placeholder="data.keyword==''||data.keyword==undefined?'商品搜索':data.keyword" class="field__control" />
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
name:'search',
components:{
},
props:{
data:Object
},
created:function(){
if(this.data.position=='fixed'){
this.$emit('settopheight', 50);
}
},
computed:{
boxstyle(){
if(this.data.position=='fixed'){
return{
position:'fixed',
top: 0,
zIndex: 10,
}
}else{
return{}
}
},
boxviewstyle(){
return{
background: (this.data.backgroundcolor==undefined?"#f9f9f9":this.data.backgroundcolor),
paddingRight: '15px',
top:'0px' ,
}
},
}
}
</script>
<style>
</style>
mobile-web/src/components/page/text.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div :style="style">{{data.value}}</div>
</template>
<script>
export default {
name:'page-text',
props:{
data:Object
},
computed:{
style(){
return{
position:'relative',
padding: '10px',
fontSize:(this.data.fontsize==undefined?'10':this.data.fontsize)+'px',
color:(this.data.color==undefined?'#000':this.data.color),
background:this.data.backgroundcolor,
textAlign:this.data.textalign,
}
}
}
}
</script>
mobile-web/src/components/page/title.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<a :href="data.link">
<div v-if="data.type == '1'" class="cap-title cap-title--normal" :style="'background-color:'+data.backgroundcolor+'; text-align:'+data.textalign+';color:'+data.color">
<h2 class="cap-title__main">{{data.title}}</h2>
<p v-if="data.subtitle!=undefined&&data.subtitle!=''" class="cap-title__sub"><span class="cap-title__sub-title">{{data.subtitle}}</span></p>
</div>
<div v-if="data.type == '2'" class="title" :style="'background:'+data.backgroundcolor+';text-align:'+data.textalign">
<span :style="data.color==''?'':'border-bottom: 1px solid '+data.color+';color:'+data.color+';'">{{data.title}}</span>
</div>
</a>
</template>
<script>
export default {
name:'page-title',
props:{
data:Object
},
computed:{
}
}
</script>
<style>
</style>
mobile-web/src/components/page/whitespace.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div :style="style"></div>
</template>
<script>
export default {
name: 'whitespace',
props: {
data: Object,
},
computed: {
style() {
return {
height: (this.data.height==undefined?'30':this.data.height)+"px",
};
}
}
};
</script>
mobile-web/src/components/search/searchtop.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div>
<van-nav-bar left-arrow class="product-serach"
@click-left="onBack"
>
<van-search
v-model="value"
placeholder="请输入搜索关键词"
background="#fff"
show-action
@search="onSearchClick"
slot="title"
>
<div slot="action" @click="onSearchClick">搜索</div>
</van-search>
</van-nav-bar>
</div>
</template>
<script>
import { Search } from "vant";
export default {
name:'searchtop',
components:{
[Search.name]:Search,
},
props: {
keyword: String,
// onSearch: Function,
},
data(){
return{
value: this.keyword,
}
},
methods:{
onSearchClick() {
// this.props.onSearch(this.keyword);
this.$emit('onSearch', this.value);
},
onBack() {
history.back();
},
}
}
</script>
<style lang="less">
.product-serach{
.van-search{
padding: 7px 0;
background: #fff;
.van-cell{
background: rgb(242, 242, 242);
margin-right: 10px;
}
.van-search__action{
background: #e93b3d;
color: #fff;
}
}
.van-nav-bar__title{
margin: 0;
max-width: 100%;
padding-left: 40px;
padding-right: 20px;
}
}
</style>
mobile-web/src/config/components.js deleted 100644 → 0
浏览文件 @ 6d1a47af
import headerNav from '../components/header/nav';
import navigate from '../components/footer/navigate.vue'
import productcard from '../components/common/productcard.vue'
import {
Tag,
Col,
Icon,
Cell,
CellGroup,
Swipe,
Toast,
SwipeItem,
GoodsAction,
GoodsActionBigBtn,
GoodsActionMiniBtn,
Actionsheet,
Sku,
Card,Button,SwipeCell,Dialog,Tab, Tabs,Row,Checkbox, CheckboxGroup, SubmitBar,NavBar,Tabbar, TabbarItem,Panel,List,Step, Steps,Field ,
Badge, BadgeGroup,Popup,Stepper,RadioGroup, Radio,Picker,Uploader,Info
} from 'vant';
const components=[
Tag,
Col,
Icon,
Cell,
CellGroup,
Swipe,
SwipeItem,
GoodsAction,
GoodsActionBigBtn,
GoodsActionMiniBtn,
Actionsheet,
Sku,
Card,
Button,
SwipeCell ,
Dialog ,
headerNav,
Tab, Tabs,Toast,Row,Checkbox, CheckboxGroup, SubmitBar,NavBar ,Tabbar, TabbarItem,navigate,Panel,List ,Step, Steps,Field ,
Badge, BadgeGroup,Popup,productcard,Stepper,RadioGroup, Radio,Picker,Uploader,Info
]
export default (Vue)=>{
components.forEach(Component => {
Vue.component(Component.name, Component)
});
}
mobile-web/src/config/env.js deleted 100644 → 0
浏览文件 @ 6d1a47af
/**
* 配置编译环境和线上环境之间的切换
*
* baseUrl: 域名地址
* routerMode: 路由模式
* dataSources：数据源
*/
let baseUrl = '';
let routerMode = 'hash';
let dataSources='local';//local=本地，其他值代表非本地
if (!process.env.NODE_ENV || process.env.NODE_ENV == 'development') {
baseUrl='http://127.0.0.1';
}else if(process.env.NODE_ENV == 'production'){
baseUrl = 'http://180.167.213.26:18099';
dataSources='production';
}
// baseUrl = 'http://127.0.0.1';
// baseUrl = 'http://180.167.213.26:18099';
dataSources = 'remote';
// dataSources = 'local';
export {
baseUrl,
routerMode,
dataSources,
}
mobile-web/src/config/rem.js deleted 100644 → 0
浏览文件 @ 6d1a47af
(function(d, w) {
const doc = d.documentElement;
function rem() {
const width = Math.min(doc.getBoundingClientRect().width, 768);
doc.style.fontSize = width / 7.5 + 'px';
}
rem();
w.addEventListener('resize', rem);
})(document, window);
\ No newline at end of file
mobile-web/src/config/request.js deleted 100644 → 0
浏览文件 @ 6d1a47af
import axios from 'axios'
import {baseUrl, dataSources} from './env';
import datas from '../data/data';
import { getAccessToken, getRefreshToken } from '../utils/cache.js';
import { Dialog } from 'vant';
import {setLoginToken} from "../utils/cache";
const serviceRouter = function(requestUrl) {
function getConfig() {
const configDev = {
'/order-api': {
prefix: '/order-api',
target: 'http://127.0.0.1:18088/order-api',
},
'/user-api': {
prefix: '/user-api',
target: 'http://127.0.0.1:18082/user-api',
},
'/product-api': {
prefix: '/product-api',
target: 'http://127.0.0.1:18081/product-api',
},
'/promotion-api': {
prefix: '/promotion-api',
target: 'http://127.0.0.1:18085/promotion-api',
},
'/pay-api': {
prefix: '/pay-api',
target: 'http://127.0.0.1:18084/pay-api',
},
'/search-api': {
prefix: '/search-api',
target: 'http://127.0.0.1:18086/search-api',
},
};
const configProd = {
'/order-api': {
prefix: '/order-api',
target: 'http://api.shop.iocoder.cn/order-api',
},
'/user-api': {
prefix: '/user-api',
target: 'http://api.shop.iocoder.cn/user-api',
},
'/product-api': {
prefix: '/product-api',
target: 'http://api.shop.iocoder.cn/product-api',
},
'/promotion-api': {
prefix: '/promotion-api',
target: 'http://api.shop.iocoder.cn/promotion-api',
},
'/pay-api': {
prefix: '/pay-api',
target: 'http://api.shop.iocoder.cn/pay-api',
},
'/search-api': {
prefix: '/search-api',
target: 'http://api.shop.iocoder.cn/search-api',
},
};
if (process.env.NODE_ENV == 'development') {
return configDev;
} else {
return configProd
}
}
// function doCreateServer(config) {
// // 获取请求配置文件
// const createServer = {};
// for (const configKey in config) {
// const serverPrefix = configKey;
// const {target} = config[configKey];
// // 创建服务
// createServer[serverPrefix] = axios.create({
// baseURL: target, // api 的 base_url
// timeout: 5000, // request timeout
// headers: {
// 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
// }
// });
// }
// }
const config = getConfig();
// TODO 芋艿，临时加下。
// const createServer = doCreateServer(config);
const indexOf = requestUrl.indexOf("/", 1);
const _urlPrefix = requestUrl.substring(0, indexOf);
if (!config[_urlPrefix]) {
// throw new Error(`服务路由，未找到可用服务! ${requestUrl}`);
console.error(`服务路由，未找到可用服务! ${requestUrl}`)
return ''
}
// if (!createServer[_urlPrefix]) {
// throw new Error("服务路由，未找到可用服务!");
// }
// const { target } = config[_urlPrefix];
// const requestServer = createServer[_urlPrefix];
// const targetRequestUrl = _requestUrl.replace(_urlPrefix, target)
// return createServer;
return config[_urlPrefix];
};
const service = axios.create({
// baseURL: baseUrl, // api 的 base_url
timeout: 30000, // request timeout
headers: {
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
}
});
const servicef = function (parameter) {
// debugger;
if (dataSources == 'local') {
//定义回调函数和axios一致
const promist = new Promise(function (resolve, reject) {
var data = datas[parameter.url];
if (typeof data == 'string') {
data = JSON.parse(data);
}
resolve(data);
});
return promist;
}
// 设置 access token
// debugger;
// if (getAccessToken()) {
// parameter.headers = {
// ...parameter.headers,
// 'Authorization': `Bearer ${getAccessToken()}`,
// };
// }
// debugger;
return service(parameter);
};
service.interceptors.request.use(
config => {
// 记录下原始请求的地址
config.originUrl = config.url;
// Do something before request is sent
// if (store.getters.token) {
// // 让每个请求携带token-- ['X-Token']为自定义key 请根据实际情况自行修改
// config.headers['X-Token'] = getToken()
// }
// 切换地址
const { target, prefix } = serviceRouter(config.url)
let url = config.url = config.url.replace(`${prefix}`, target);
// TODO 芋艿，这些 url 不用增加认证 token 。可能这么写，有点脏，后面看看咋优化下。
if (url.indexOf('user-api/users/passport/mobile/send_register_code') !== -1
|| url.indexOf('user-api/users/passport/mobile/register') !== -1
|| url.indexOf('user-api/users/passport/refresh_token') !== -1) {
return config;
}
// debugger;
if (getAccessToken()) {
config.headers['Authorization'] = `Bearer ${getAccessToken()}`;
}
return config
},
error => {
// Do something with request error
console.log(error) // for debug
Promise.reject(error)
}
);
function refreshToken(lastResponse) {
// TODO 芋艿，可能会存在多个异步 callback 的情况。
let refreshToken = getRefreshToken();
return servicef({
url: '/user-api/users/passport/refresh_token',
method: 'post',
params: {
refreshToken
}
}).then(data => {
// 设置新的 accessToken
setLoginToken(data.accessToken, data.refreshToken);
// 重新发起请求
let config = lastResponse.config;
return servicef({
url: config.originUrl,
method: config.method,
params: {
...config.params,
}
});
});
}
// response interceptor
service.interceptors.response.use(
//response => response,
/**
* 下面的注释为通过在response里，自定义code来标示请求状态
* 当code返回如下情况则说明权限有问题，登出并返回到登录页
* 如想通过 xmlhttprequest 来状态码标识 逻辑可写在下面error中
* 以下代码均为样例，请结合自生需求加以修改，若不需要，则可删除
*/
response => {
// debugger;
const res = response.data;
const code = res.code;
if (code !== 0) {
// // 50008:非法的token; 50012:其他客户端登录了; 50014:Token 过期了;
// if (res.code === 50008 || res.code === 50012 || res.code === 50014) {
// // 请自行在引入 MessageBox
// // import { Message, MessageBox } from 'element-ui'
// MessageBox.confirm('你已被登出，可以取消继续留在该页面，或者重新登录', '确定登出', {
// confirmButtonText: '重新登录',
// cancelButtonText: '取消',
// type: 'warning'
// }).then(() => {
// store.dispatch('FedLogOut').then(() => {
// location.reload() // 为了重新实例化vue-router对象 避免bug
// })
// })
// }
// TODO token 过期
// TODO 需要拿 refresh token 置换
if (code === 1002001011 // 访问令牌不存在
|| code === 1002001013 // 访问令牌已失效
|| code === 1002001017 // 刷新令牌不存在
|| code === 1002001018 // 刷新令牌已过期
|| code === 1002001019) { // 刷新令牌已失效
Dialog.confirm({
title: '系统提示',
message: res.message,
confirmButtonText: '重新登陆',
beforeClose: function (action, done) {
done();
if (action === 'confirm') {
// debugger;
// this.$router.push({ path: '/login' })
// TODO 跳转到登陆页.不是很优雅
location.replace('/#login');
location.reload();
}
}
});
} else if (code === 1002001012) { // 访问令牌已过期
return refreshToken(response);
} else {
Dialog.alert({
title: '系统提示',
message: res.message,
});
}
return Promise.reject('error')
} else {
// if (typeof response.data.Tag == 'string') {
// return JSON.parse(response.data.Tag);
// } else {
// return response.data.Tag;
// }
// debugger;
return res.data;
}
},
error => {
Dialog.alert({
title: '系统提示',
message: error,
});
console.error(`请求失败`, error);
throw new Error(error);
// return Promise.reject(error)
}
);
export default servicef
mobile-web/src/config/router.js deleted 100644 → 0
浏览文件 @ 6d1a47af
import Vue from 'vue';
import Router from 'vue-router';
import { getAccessToken } from '../utils/cache';
Vue.use(Router);
const routes = [
{
path: '*',
redirect: '/home'
},
{
name: 'home',
component: () => import('../page/index'),
meta: {
title: '首页'
}
},
{
path: '/login',
component: () => import('../page/account/phonelogin'),
meta: {
title: '登录'
}
},
// {
// path: '/login/password',
// component: () => import('../page/account/password'),
// meta: {
// title: '登录'
// }
// },
// {
// path: '/login/phone',
// component: () => import('../page/account/phonelogin'),
// meta: {
// title: '手机号登录'
// }
// },
// {
// path: '/login/register',
// component: () => import('../page/account/register'),
// meta: {
// title: '注册'
// }
// },
{
path: '/user/index',
component: () => import('../page/user/index'),
name: 'user',
meta: {
title: '会员中心'
}
},
{
path: '/user/info',
component: () => import('../page/user/info/detail'),
name: 'user',
meta: {
title: '个人信息',
requireAuth: true,
}
},
{
path: '/user/address',
component: () => import('../page/user/address/list'),
meta: {
title: '我的地址',
requireAuth: true,
}
},
{
path: '/user/address/edit',
component: () => import('../page/user/address/edit'),
meta: {
title: '修改地址',
requireAuth: true,
}
},
{
path: '/user/favorite',
component: () => import('../page/user/favorite/list'),
meta: {
title: '我的收藏',
requireAuth: true,
}
},
{
path: '/user/coupon',
component: () => import('../page/coupon/list'),
meta: {
title: '我的优惠券',
requireAuth: true,
}
},
{
path: '/user/order',
component: () => import('../page/user/order/list'),
meta: {
title: '我的订单'
},
},
{
path: '/user/order/:id',
component: () => import('../page/user/order/list'),
meta: {
title: '我的订单',
requireAuth: true,
}
},
{
path: '/user/order/info/:id',
component: () => import('../page/user/order/info'),
meta: {
title: '我的订单',
requireAuth: true,
}
},
{
path: '/user/order/logistics/:id',
component: () => import('../page/user/order/logistics'),
meta: {
title: '订单追踪',
requireAuth: true,
}
},
{
path: '/user/aftersale',
component: () => import('../page/user/aftersale/list'),
meta: {
title: '售后'
}
},
{
path: '/user/aftersale/apply/:orderId',
component: () => import('../page/user/aftersale/apply'),
meta: {
title: '申请售后'
}
},
{
path: '/user/aftersale/detail/:orderId',
component: () => import('../page/user/aftersale/detail'),
meta: {
title: '服务单详情'
}
},
{
path: '/user/aftersale/track/:id/:serviceNumber',
component: () => import('../page/user/aftersale/track'),
meta: {
title: '进度详情'
}
},
{
name: '/product/search',
path: '/product/search',
component: () => import('../page/product/search'),
meta: {
title: '商品搜索'
}
},
{
path: '/product/:id',
component: () => import('../page/product/detail'),
meta: {
title: '商品详情'
}
},
{
path: '/products/list',
component: () => import('../page/product/list'),
meta: {
title: '商品列表'
}
},
{
name: 'cart',
component: () => import('../page/cart/index'),
meta: {
title: '购物车',
requireAuth: true,
}
},
{
path: '/order',
component: () => import('../page/shipping/order'),
meta: {
title: '确认订单',
requireAuth: true,
}
},
{
name: 'category',
component: () => import('../page/category/index'),
meta: {
title: '分类'
}
},
{
path: '/coupon/fetch',
component: () => import('../page/coupon/fetch'),
meta: {
title: '优惠劵领取'
}
},
{
path: '/pay',
component: () => import('../page/pay/index'),
meta: {
title: '收银台',
requireAuth: true,
}
}
];
// add route path
routes.forEach(route => {
route.path = route.path || '/' + (route.name || '');
});
const router = new Router({ routes });
router.beforeEach((to, from, next) => {
// 判断是否需要认证
const requireAuth = to.meta && to.meta.requireAuth;
if (requireAuth) {
if (!getAccessToken()) { // 未登陆
next({
path: '/login',
query: {redirect: to.fullPath} // 将跳转的路由path作为参数，登录成功后跳转到该路由
});
return;
}
}
// 处理标题
const title = to.meta && to.meta.title;
if (title) {
document.title = title;
}
// 继续路由
next();
});
export {
router
};
mobile-web/src/data/area.js deleted 100644 → 0
浏览文件 @ 6d1a47af
This source diff could not be displayed because it is too large. You can view the blob instead.
mobile-web/src/data/data.js deleted 100644 → 0
浏览文件 @ 6d1a47af
import success from './common/success.json'
import GetPage from './page/GetPage.json'
import PageProduct from './page/Product.json'
import GetUserIndex from './user/GetUserIndex.json'
import GetFavorite from './user/GetFavorite.json'
import GetAddressList from './user/GetAddressList.json'
import GetAddressById from './user/GetAddressById.json'
import GetCoupon from './user/GetCoupon.json'
export default {
'/Page/GetPage':GetPage,
'/Page/Product':PageProduct,
'/User/GetUserIndex':GetUserIndex,
'/User/GetFavorite':GetFavorite,
'/User/DelFavorite':success,
'/User/GetAddressList':GetAddressList,
'/User/GetAddressById':GetAddressById,
'/User/SaveAddress':success,
'/User/DelAddress':success,
'/User/GetCoupon':GetCoupon,
'/User/ExchangeCoupon':success,
}
\ No newline at end of file
mobile-web/src/data/page/GetPage.json deleted 100644 → 0
浏览文件 @ 6d1a47af
{
"PageId": 11,
"Name": "仿考拉",
"BackgroundColor": "",
"Sections": [
{
"PageSectionId": 2511,
"Code": "Search",
"ParameterDictionary": {
"keyword": "搜索商品",
"position": "fixed",
"backgroundcolor": "#f9f9f9",
"color": "#999999",
"textalign": "center",
"boxcolor": "#ffffff",
"boxtype": "2"
}
},
{
"PageSectionId": 2512,
"Code": "ImageAd",
"ParameterDictionary": {
"type": "1",
"imagegap": "0",
"shownumber": "4",
"imagelist": [
{
"link": "/#/search?categoryid=12",
"src": "https://haitao.nos.netease.com/6BXWTT4KF3v2CCD1KVT1809182052_960_480.jpg"
},
{
"link": "/#/product/4",
"src": "https://haitao.nosdn2.127.net/ThUbIr9WnE7TbTwTapp-kvAiT1809190053_960_480.jpg"
},
{
"link": "/#/product/4",
"src": "https://haitao.nos.netease.com/f3kJUUtkrDbsiU1LtopkHcBGgT1809182243_960_480.jpg"
},
{
"link": "/#/product/4",
"src": "https://haitao.nosdn2.127.net/EWQ1UI83HQ03U2TLaeShRtEhK19n7175ceTT1809191639_960_480.jpg"
}
]
}
},
{
"PageSectionId": 2513,
"Code": "ImageAd",
"ParameterDictionary": {
"type": "2",
"imagegap": "0",
"shownumber": "4",
"imagelist": [
{
"link": "",
"linkname": "",
"src": "https://haitao.nos.netease.com/gr4TfN5hhFhFg1CaUgya1mdkPDLpE4WTT1806271501_1125_144.png",
"title": ""
}
]
}
},
{
"PageSectionId": 2514,
"Code": "ImageText",
"ParameterDictionary": {
"type": "1",
"showtype": "1",
"shownumber": "4",
"color": "",
"backgroundcolor": "",
"imagelist": [
{
"link": "",
"src": "https://haitao.nos.netease.com/gefNTDIqyQsSAEtSpy222T1808221621_192_220.jpg",
"title": ""
},
{
"link": "",
"src": "https://haitao.nosdn2.127.net/NVSMWxQKvHyakuP6WruN3T1809031519_192_220.jpg",
"title": ""
},
{
"link": "",
"src": "https://haitao.nosdn1.127.net/2dWeQg9FCfC8whIZWhac4T1809031520_192_220.jpg",
"title": ""
},
{
"link": "",
"src": "https://haitao.nosdn1.127.net/kZZ6h45lVQhRZLOJPHJd1T1808171739_192_220.jpg",
"title": ""
},
{
"link": "",
"src": "https://haitao.nosdn1.127.net/VNeftDVe3h9rgEq7MtfDT1809061111_192_220.jpg",
"title": ""
}
]
}
},
{
"PageSectionId": 2515,
"Code": "ImageText",
"ParameterDictionary": {
"type": "1",
"showtype": "1",
"shownumber": "4",
"color": "",
"backgroundcolor": "",
"imagelist": [
{
"link": "",
"src": "https://haitao.nosdn2.127.net/GvpaR0ThVvgBkgT7Vf0yxk2T1809181557_192_220.jpg",
"title": ""
},
{
"link": "",
"src": "https://haitao.nos.netease.com/EqTdbMtyfOtDzr0DtcTD90hr2T1809031521_192_220.jpg",
"title": ""
},
{
"link": "",
"src": "https://haitao.nosdn2.127.net/Bkbtx8pB7u6B5S9OCU4Eir2f1T1808171744_192_220.jpg",
"title": ""
},
{
"link": "",
"src": "https://haitao.nosdn2.127.net/PnANhp9RpFloeI9VhfPXg8T1808171745_192_220.png",
"title": ""
},
{
"link": "",
"src": "https://haitao.nos.netease.com/HT4D5CRc3ZZRsuRkeCnTT1808171746_192_220.jpg",
"title": ""
}
]
}
},
{
"PageSectionId": 2516,
"Code": "ImageAd",
"ParameterDictionary": {
"type": "2",
"imagegap": "0",
"shownumber": "4",
"imagelist": [
{
"link": "",
"linkname": "",
"src": "https://haitao.nosdn1.127.net/rzvfEZzFfvTgcrpb08mQgM8w5BpTwC_02T1809190045_960_251.gif",
"title": ""
}
]
}
},
{
"PageSectionId": 2517,
"Code": "Cube",
"ParameterDictionary": {
"type": "5",
"imagegap": "0",
"imagelist": [
{
"link": "",
"src": "https://haitao.nosdn2.127.net/UgGLMbgT8N2UfcbFeTw41p6TpSBEVC_03T1809190112_480_480.gif",
"title": ""
},
{
"link": "",
"src": "https://haitao.nos.netease.com/qOKOCqh4eAamM9PDxgl7tKEz8g-04-1T1809181138_480_240.jpg",
"title": ""
},
{
"link": "",
"src": "https://haitao.nos.netease.com/APF1FTPcSWKGBg42uc064xW5kR_05T1809182215_480_240.jpg",
"title": ""
}
]
}
},
{
"PageSectionId": 2519,
"Code": "Cube",
"ParameterDictionary": {
"type": "1",
"imagegap": "0",
"imagelist": [
{
"link": "",
"src": "https://haitao.nos.netease.com/b65wuwPeNGKwoKeccKhkqD6R1m_01T1809182202_480_355.gif",
"title": ""
},
{
"link": "",
"src": "https://haitao.nos.netease.com/saDSBpfhpS27uHOrPOAHH7ErSv_02T1809182202_480_355.gif",
"title": ""
}
]
}
},
{
"PageSectionId": 2520,
"Code": "Cube",
"ParameterDictionary": {
"type": "4",
"imagegap": "0",
"imagelist": [
{
"link": "",
"linkname": "",
"src": "https://haitao.nosdn1.127.net/QlMddWV2hDkmMUtU919dmtkwCvQKFWTT0qf-206BcFSZ7F_19T1809191525_480_228.jpg",
"title": ""
},
{
"link": "",
"linkname": "",
"src": "https://haitao.nos.netease.com/yUAxhIA12tWlsl5v919lN6CEX6A84TTy6No-20VLH2mLet_20T1809191525_480_228.jpg",
"title": ""
},
{
"link": "",
"src": "https://haitao.nos.netease.com/7Ukzzw7E0rcAv06O919w4K3DWhs0nGV5HsN-191LuUSSQQ_33T1809191353_480_305.jpg",
"title": ""
},
{
"link": "",
"linkname": "",
"src": "https://haitao.nosdn1.127.net/TcWBRJmHKdW7t7oy919fSHnqbHeHcB7U3EN-191akaZTSf_34T1809191354_480_305.jpg",
"title": ""
}
]
}
},
{
"PageSectionId": 2521,
"Code": "ImageAd",
"ParameterDictionary": {
"type": "2",
"imagegap": "0",
"shownumber": "4",
"imagelist": [
{
"link": "",
"src": "https://haitao.nosdn2.127.net/8v8Qd4gikpeGTMgcjingxuan_huodong111T170101801048_960_190.png",
"title": ""
},
{
"link": "",
"src": "https://haitao.nosdn1.127.net/hx0gzgVHpyeT41gmk9kURttb-960-480-7ZhaNcOET1809182240_960_480.jpg",
"title": ""
}
]
}
},
{
"PageSectionId": 2521,
"Code": "ImageAd",
"ParameterDictionary": {
"type": "2",
"imagegap": "0",
"shownumber": "4",
"imagelist": [
{
"link": "",
"src": "https://haitao.nosdn1.127.net/61556274-32ef-44bf-84af-b3d4485ac157.png",
"title": ""
}
]
}
},
{
"PageSectionId": 2522,
"Code": "Product",
"ParameterDictionary": {
"type": "2",
"source": "1",
"showsort": "0",
"shownumber": "6",
"tag": "0",
"showtype": "simple",
"buttonvalue": "购买",
"productids": "4,1,3",
"productcategoryid": "",
"producttagid": ""
}
}
]
}
\ No newline at end of file
mobile-web/src/data/page/Product.json deleted 100644 → 0
浏览文件 @ 6d1a47af
[
{
"id": 4,
"title": "Naturie imju 薏仁美白保湿防晒化妆水 500毫升 我是大美人强推 ",
"price": "55.00",
"imageURL": "https://haitao.nos.netease.com/50c2fafd909f489e9ebd3418cd90a1711533208260850jkcgm1fq10072.jpg"
},
{
"id": 1,
"title": "Ryo 吕 棕吕（原黄吕）防脱固发滋养 洗发水*2+护发素*1 500毫升/瓶",
"price": "105.00",
"imageURL": "https://haitao.nosdn2.127.net/bc977ba46ed74158b6b3386eaf27f7f81530241584513jizebvc810863.jpg"
},
{
"id": 3,
"title": "【维持泌尿健康】Swisse 高浓度蔓越莓 30粒/瓶 2瓶",
"price": "158.00",
"imageURL": "https://haitao.nosdn1.127.net/onlineic1jqd6p10155.jpg"
},
{
"id": 5,
"title": "【真正的有机糙米】EARTH'S BEST 有机纯米粉 227克",
"price": "35.00",
"imageURL": "https://haitao.nos.netease.com/31f78c55a2114eb5a287b38b6475e5fd1513067124727jb3d3lcr19243.jpg"
},
{
"id": 6,
"title": "SK-II 嫩肤清莹露 160毫升",
"price": "358.00",
"imageURL": "https://haitao.nosdn2.127.net/insm5qxq58_800_800.jpg"
},
{
"id": 7,
"title": "【领券立减100】SK-II小灯泡30ml套装 (小灯泡30ml+神仙水10ml+清莹露10ml+精华霜2.5g)",
"price": "1286.00",
"imageURL": "https://pop.nosdn.127.net/d336d1f7-670d-40b6-ab58-921012c6b176"
},
{
"id": 8,
"title": "Apple 苹果 iPhone X 64GB 移动联通4G手机 港版",
"price": "6799.00",
"imageURL": "https://pop.nosdn.127.net/7936968b-3db1-441d-822b-e9616d01c0f6"
},
{
"id": 9,
"title": "【不伤宝宝初生牙龈】HAPPY BABY 禧贝婴幼儿温和有机磨牙饼干 香蕉甘薯 48克/盒",
"price": "56.00",
"imageURL": "https://haitao.nos.netease.com/485c149f5ceb4d6a837a67910236048715354385972231.jpg"
},
{
"id": 10,
"title": "Dior 迪奥 粉漾魅惑变色润唇膏 04#橘色 3.5克",
"price": "179.00",
"imageURL": "https://haitao.nosdn2.127.net/ix7gkb6581_800_800.jpg"
},
{
"id": 10,
"title": "ÍpsΛ 茵芙莎 流金岁月美肤水 200毫升",
"price": "328.00",
"imageURL": "https://haitao.nosdn2.127.net/0938e26c883f451b9387b9daf6b5ed9d1537025125829jm3l2par10687.jpg"
}
]
\ No newline at end of file
mobile-web/src/data/sku.js deleted 100644 → 0
浏览文件 @ 6d1a47af
export default {
kdt_id: 55,
user_id: 4674509,
offline_id: 0,
activity_alias: '',
sku: {
tree: [
{
k: '颜色',
k_id: '1',
v: [
{
id: '30349',
name: '天蓝色',
imgUrl:
'https://img.yzcdn.cn/upload_files/2017/02/21/FjKTOxjVgnUuPmHJRdunvYky9OHP.jpg!100x100.jpg'
}
],
k_s: 's1',
count: 2
},
{
k: '尺寸',
k_id: '2',
v: [
{
id: '1193',
name: '1'
},
{
id: '1194',
name: '2'
}
],
k_s: 's2',
count: 2
}
],
list: [
{
id: 2259,
price: 100,
discount: 100,
code: '',
s1: '1215',
s2: '1193',
s3: '0',
s4: '0',
s5: '0',
extend: null,
kdt_id: 55,
discount_price: 0,
stock_num: 110,
stock_mode: 0,
is_sell: null,
combin_sku: false,
goods_id: 946755
},
{
id: 2260,
price: 100,
discount: 100,
code: '',
s1: '1215',
s2: '1194',
s3: '0',
s4: '0',
s5: '0',
extend: null,
kdt_id: 55,
discount_price: 0,
stock_num: 0,
stock_mode: 0,
is_sell: null,
combin_sku: false,
goods_id: 946755
},
{
id: 2257,
price: 100,
discount: 100,
code: '',
s1: '30349',
s2: '1193',
s3: '0',
s4: '0',
s5: '0',
extend: null,
kdt_id: 55,
discount_price: 0,
stock_num: 111,
stock_mode: 0,
is_sell: null,
combin_sku: false,
goods_id: 946755
},
{
id: 2258,
price: 100,
discount: 100,
code: '',
s1: '30349',
s2: '1194',
s3: '0',
s4: '0',
s5: '0',
extend: null,
kdt_id: 55,
discount_price: 0,
stock_num: 6,
stock_mode: 0,
is_sell: null,
combin_sku: false,
goods_id: 946755
}
],
price: '1.00',
market_price:'10.00',
stock_num: 227,
collection_id: 2261,
collection_price: 0,
none_sku: false,
sold_num: 0,
min_price: '1.00',
max_price: '1.00',
messages: [
],
hide_stock: false
},
goods_id: '946755',
alias: '2oml0r0n5vytj',
quota: 15,
is_virtual: '0',
quota_used: 0,
goods_info: {
title: '测试商品',
picture:
'https://img.yzcdn.cn/upload_files/2017/03/16/Fs_OMbSFPa183sBwvG_94llUYiLa.jpeg?imageView2/2/w/100/h/100/q/75/format/jpg',
price: 1,
origin: ''
}
};
\ No newline at end of file
mobile-web/src/data/user/GetAddressById.json deleted 100644 → 0
浏览文件 @ 6d1a47af
{
"id": "2",
"name": "李四",
"tel": "13108826530",
"areaCode": "712899",
"addressDetail": "浙江省杭州市拱墅区莫干山路 50 号",
"isDefault": false
}
\ No newline at end of file
mobile-web/src/data/user/GetAddressList.json deleted 100644 → 0
浏览文件 @ 6d1a47af
[
{
"id": "1",
"name": "张三",
"tel": "13000000000",
"address": "浙江省杭州市西湖区文三路 138 号东方通信大厦 7 楼 501 室"
},
{
"id": "2",
"name": "李四",
"tel": "1310000000",
"address": "浙江省杭州市拱墅区莫干山路 50 号"
}
]
\ No newline at end of file
mobile-web/src/data/user/GetCoupon.json deleted 100644 → 0
浏览文件 @ 6d1a47af
{
"TotalPage":5,
"List":[
{
"Id":12,
"Name":"仅可购买自营图书文娱商品",
"BeginDate":"2018.09.05",
"EndDate":"2018.09.28",
"Condition":"满199元可用",
"SignPosition":"right",
"Coupon":"75",
"Sign":"折",
"Info":"限品类：仅可购买自营图书文娱商品"
},
{
"Id":13,
"Name":"全品类（特例商品除外）",
"BeginDate":"2018.09.05",
"EndDate":"2018.09.28",
"Condition":"满200元可用",
"SignPosition":"left",
"Coupon":"10",
"Sign":"￥",
"Info":""
},
{
"Id":14,
"Name":"运费券：京东部分自营商品",
"BeginDate":"2018.09.05",
"EndDate":"2018.09.28",
"Condition":"部分特殊商品运费除外",
"SignPosition":"left",
"Coupon":"6",
"Sign":"￥",
"Info":"1、运费券仅可用于抵减京东自营商品订单运费，即用户下单结算时，可选择该优惠券按券面值抵减每笔结算订单中的运费；2、虚拟商品及部分特殊购物流程不可用，特殊流程如秒杀等；"
}
]
}
\ No newline at end of file
mobile-web/src/data/user/GetFavorite.json deleted 100644 → 0
浏览文件 @ 6d1a47af
{
"TotalPage":5,
"list":[
{
"id":12,
"imageURL":"https://pop.nosdn.127.net/19e33c9b-6c22-4a4b-96da-1cb7afb32712",
"title":"BEYOND博洋家纺 床上套件 秋冬保暖纯棉床单被套 双人被罩 磨毛全棉印花床品四件套",
"price":"499"
},
{
"id":13,
"imageURL":"https://pop.nosdn.127.net/19e33c9b-6c22-4a4b-96da-1cb7afb32712",
"title":"BEYOND博洋家纺 床上套件 秋冬保暖纯棉床单被套 双人被罩 磨毛全棉印花床品四件套",
"price":"499"
},
{
"id":14,
"imageURL":"https://pop.nosdn.127.net/19e33c9b-6c22-4a4b-96da-1cb7afb32712",
"title":"BEYOND博洋家纺 床上套件 秋冬保暖纯棉床单被套 双人被罩 磨毛全棉印花床品四件套",
"price":"499"
},
{
"id":15,
"imageURL":"https://pop.nosdn.127.net/19e33c9b-6c22-4a4b-96da-1cb7afb32712",
"title":"BEYOND博洋家纺 床上套件 秋冬保暖纯棉床单被套 双人被罩 磨毛全棉印花床品四件套",
"price":"499"
},
{
"id":16,
"imageURL":"https://pop.nosdn.127.net/19e33c9b-6c22-4a4b-96da-1cb7afb32712",
"title":"BEYOND博洋家纺 床上套件 秋冬保暖纯棉床单被套 双人被罩 磨毛全棉印花床品四件套",
"price":"499"
}
]
}
\ No newline at end of file
mobile-web/src/data/user/GetUserIndex.json deleted 100644 → 0
浏览文件 @ 6d1a47af
{
"UserName":"Yrin",
"Avatar":"http://haitao.nos.netease.com/ZnB0PM5xDzXZ2FeVlmT170102401021_150_150.png",
"UnPayTotal":1,
"UnRecieveTotal":2,
"AfterSaleTotal":3
}
\ No newline at end of file
mobile-web/src/main.js deleted 100644 → 0
浏览文件 @ 6d1a47af
import Vue from 'vue';
import { router } from './config/router';
import './config/rem';
import App from './App.vue';
import VueLazyload from 'vue-lazyload'
import components from './config/components.js';
import { Dialog } from 'vant';
import { CouponCell, CouponList } from 'vant';
import { formatDate } from './utils/date.js';
Vue.use(components);
Vue.use(VueLazyload);
Vue.use(Dialog);
Vue.use(CouponCell).use(CouponList);
new Vue({
router,
el: '#app',
render: h => h(App)
});
Vue.filter('formatDate', function(date, pattern) {
if (date) {
return formatDate(date, pattern);
}
});
mobile-web/src/page/account/login.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div>
<div class="m-logo" style="background:url(//haitao.nos.netease.com/f866dd18-12f0-4bb2-be6d-5cac85cf2627.png) center 73px no-repeat;background-size:161px; text-align: center;
padding: 130px 0 0;
margin: 15px 0;"></div>
<div style="margin:0 10px;font-size: 14px;">
<router-link to="/login/phone">
<van-button size="large" style="font-size: 14px;height: 42px;line-height: 42px;margin-bottom: 15px;">手机号登录</van-button>
</router-link>
<router-link to="/login/password">
<van-button size="large" style="font-size: 14px;height: 42px;line-height: 42px;margin-bottom: 15px;">密码登录</van-button>
</router-link>
<router-link to="/login/register">
<van-button size="large" type="primary" style="font-size: 14px;height: 42px;line-height: 42px;">手机号一键注册</van-button>
</router-link>
</div>
<div class="m-thirdpart">
<p class="tit"><span class="txt">或用以下方式登录</span></p>
<div class="lnk">
<van-icon name="wechat" color="#1AAD16" />
<van-icon name="alipay" color="#7dcbeb"/>
</div>
</div>
</div>
</template>
<script>
export default {
}
</script>
<style lang="less">
.m-thirdpart{
padding: 40px 20px 50px;
font-size: 12px;
.tit{
position: relative;
width: 215px;
margin: 0 auto;
border-bottom: 1px solid #eee;
}
.txt{
position: absolute;
left: 50%;
top: -12px;
margin: 0 0 0 -57px;
width: 114px;
background: #fff;
text-align: center;
color: #999;
font-size: 12px;
line-height: 26px;
}
.lnk{
position: relative;
padding: 27px 0 0;
width: 280px;
margin: 0 auto;
text-align: center;
.van-icon{
font-size: 31px;
margin: 0 29px;
}
}
}
</style>
mobile-web/src/page/account/password.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div>
<headerNav title="登录"/>
<div style="background:url(https://haitao.nos.netease.com/f866dd18-12f0-4bb2-be6d-5cac85cf2627.png) center 18px no-repeat;background-size:161px;">
<div style="padding-top: 70px;">
<van-cell-group>
<van-field
placeholder="请输入手机号"
/>
<van-field
type="password"
placeholder="请输入密码"
/>
</van-cell-group>
<div style="margin: 10px;">
<van-button size="large" type="primary" style="height: 45px;line-height:45px;">登录</van-button>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
}
</script>
<style>
</style>
mobile-web/src/page/account/phonelogin.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div>
<headerNav title="手机号登录"/>
<div>
<div style="padding-top: 70px;">
<van-cell-group>
<van-field
placeholder="请输入手机号"
@input="inputMobile"
/>
<van-field
center
placeholder="请输入短信验证码"
@input="inputCode"
>
<van-button slot="button" size="small" type="primary" @click="sendCode">发送验证码</van-button>
</van-field>
</van-cell-group>
<div style="margin: 10px;">
<van-button size="large" type="primary" style="height: 45px;line-height:45px;" @click="submit">登录</van-button>
</div>
<van-panel title="友情提示">
<van-cell>1. 新注册的手机号验证后自动创建账户</van-cell>
<van-cell>2. 默认验证码是 9999</van-cell>
</van-panel>
</div>
</div>
</div>
</template>
<script>
import { doPassportMobileSendRegisterCode, doPassportMobileRegister } from '../../api/user';
import { Dialog } from 'vant';
import { setLoginToken } from '../../utils/cache';
export default {
data() {
return {
mobile: '',
code: '',
}
},
methods: {
inputMobile: function (value) {
this.mobile = value;
},
inputCode: function (value) {
this.code = value;
},
sendCode: function() {
if (!this.mobile || this.mobile.length !== 11) {
Dialog.alert({
title: '系统提示',
message: '手机号码不正确',
});
return;
}
let response = doPassportMobileSendRegisterCode(this.mobile);
response.then(data => {
Dialog.alert({
title: '系统提示',
message: '发送验证码成功',
});
});
},
submit: function () {
let that = this;
let response = doPassportMobileRegister(this.mobile, this.code);
response.then(data => {
setLoginToken(data.token.accessToken, data.token.refreshToken);
Dialog.alert({
title: '系统提示',
message: '登陆成功',
beforeClose: function (action, done) {
done();
// TODO 芋艿，简单的 callback 后续完善
let redirect = that.$route.query.redirect || '/user/index';
that.$router.push(redirect);
}
});
});
}
}
}
</script>
<style>
</style>
mobile-web/src/page/account/register.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div>
<headerNav title="注册"/>
<div style="background:url(https://haitao.nos.netease.com/f866dd18-12f0-4bb2-be6d-5cac85cf2627.png) center 18px no-repeat;background-size:161px;">
<div style="padding-top: 70px;">
<van-cell-group>
<van-field
placeholder="请输入手机号"
/>
<van-field
center
clearable
placeholder="请输入短信验证码"
>
<van-button slot="button" size="small" type="primary">发送验证码</van-button>
</van-field>
<van-field
type="password"
placeholder="请输入密码"
/>
</van-cell-group>
<div style="margin: 10px;">
<van-button size="large" type="primary" style="height: 45px;line-height:45px;">注册</van-button>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
}
</script>
<style>
</style>
mobile-web/src/page/activity/index.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div>
<page/>
</div>
</template>
<script>
import page from './page/page.vue'
export default {
components:{
page
}
}
</script>
<style>
</style>
mobile-web/src/page/cart/index.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div class="card">
<headerNav title="购物车"/>
<van-cell value="编辑商品" class="head">
<template slot="title">
<van-checkbox v-model="checkedAll" @change="onSelectAll" >全选</van-checkbox>
</template>
</van-cell>
<van-checkbox-group class="card-goods" v-model="checkedItemIds" @change="onItemSelectedChange">
<div class="promotion-group">
<!-- <div v-for="(item,index) in goods" :key="index" class="card-goods__item">-->
<!-- <van-checkbox :name="item.id" />-->
<!-- <product-card :product='item' :iscard='false' >-->
<!-- </product-card>-->
<!-- </div>-->
<div v-for="(itemGroup, i) in itemGroups" class="card-goods__item">
<van-cell >
<template v-if="itemGroup.activity" slot="title">
<van-tag type="danger">满减送</van-tag>
<span class="van-cell-text" > {{ formatFullPrivilegeText(itemGroup.activity) }} </span>
</template>
</van-cell>
<div class="card" v-for="(item, j) in itemGroup.items" :key="j">
<van-checkbox :key="item.id" :name="item.id" v-model="item.selected" style="position: relative;top: 40px;" />
<product-card :product='convertProduct(item)'/>
<van-cell title="优惠信息">
{{ formatTimeLimitedDiscountText(item.activity) }}
</van-cell>
</div>
<div style="height:15px;"></div>
</div>
</div>
<!-- <div class="promotion-group">-->
<!-- <van-cell is-link class="head">-->
<!-- <template slot="title">-->
<!-- <van-checkbox v-model="checkedAll" >京东自营</van-checkbox>-->
<!-- </template>-->
<!-- </van-cell>-->
<!-- </div>-->
</van-checkbox-group>
<div style="height:50px;"></div>
<van-submit-bar
:tip="this.formatItemGroupDiscountPriceText()"
:price="fee.presentTotal"
:disabled="!checkedItemIds || !checkedItemIds.length"
:button-text="submitBarText"
@submit="onSubmit"
>
<template slot>
<van-checkbox v-model="checkedAll" @click="onSelectAll">全选</van-checkbox>
</template>
</van-submit-bar>
</div>
</template>
<script>
import {listCart, updateCartSelected} from "../../api/order";
export default {
components: {
},
data() {
return {
itemGroups: [],
fee: {
originalTotal: undefined,
discountTotal: undefined,
postageTotal: undefined,
presentTotal: undefined,
},
checkedItemIds: undefined, // 通过计算得出
oldCheckedItemIds: undefined, // 因为 vue 是双向绑定，用于解决 change 的时候，拿不到老值
checkedAll: undefined, // 通过计算得出
}
},
computed: {
submitBarText() {
const count = this.checkedItemIds ? this.checkedItemIds.length : 0;
return '结算' + (count ? `(${count})` : '');
},
},
methods: {
formatFullPrivilegeText(activity) {
if (!activity) {
return '';
}
let text = '';
let fullPrivilege = activity.fullPrivilege;
for (let i in fullPrivilege.privileges) {
let privilege = fullPrivilege.privileges[i];
if (i > 0) {
text += ';';
}
if (fullPrivilege.cycled) {
text += '每';
}
if (privilege.meetType === 1) {
text += '满 ' + privilege.meetValue / 100.0 + ' 元,';
} else if (privilege.meetType === 2) {
text += '满 ' + privilege.meetValue + ' 件,';
}
if (privilege.preferentialType === 1) {
text += '减 ' + privilege.preferentialValue / 100.0 + ' 元';
} else if (privilege.preferentialType === 2) {
text += '打 ' + privilege.preferentialValue / 10.0 + ' 折';
}
}
return text;
},
formatTimeLimitedDiscountText(activity) {
if (!activity) {
return '';
}
let text = '';
let timeLimitedDiscount = activity.timeLimitedDiscount.items[0];
if (timeLimitedDiscount.preferentialType === 1) {
text += '减 ' + timeLimitedDiscount.preferentialValue / 100.0 + ' 元';
} else if (timeLimitedDiscount.preferentialType === 2) {
text += '打 ' + timeLimitedDiscount.preferentialValue / 10.0 + ' 折';
}
if (activity.timeLimitedDiscount.quota > 0) {
text += '【限购 ' + activity.timeLimitedDiscount.quota + ' 件】';
}
return text;
},
formatItemGroupDiscountPriceText() {
// let price = 0;
// for (let i in this.itemGroups) {
// let itemGroup = this.itemGroups[i];
// price += itemGroup.activityDiscountTotal || 0;
// }
return this.fee.discountTotal > 0 ? '立减 ' + this.fee.discountTotal / 100.0 + ' 元' : '';
},
calCheckedItemIds() {
// debugger;
let itemIds = [];
let checkedAll = true;
for (let i in this.itemGroups) {
let items = this.itemGroups[i].items;
for (let j in items) {
if (items[j].selected) {
itemIds.push(items[j].id);
} else {
checkedAll = false;
}
}
}
// 赋值给 checkedItemIds、oldCheckedItemIds、checkedAll
this.checkedItemIds = itemIds;
this.oldCheckedItemIds = itemIds;
this.checkedAll = checkedAll;
},
getItemIds() {
let itemIds = [];
for (let i in this.itemGroups) {
let items = this.itemGroups[i].items;
for (let j in items) {
itemIds.push(items[j].id);
}
}
return itemIds;
},
handleData(data) {
this.itemGroups = data.itemGroups;
this.fee = data.fee;
// 计算 checkedItemIds + checkedAll
this.calCheckedItemIds();
},
onItemSelectedChange(newVal) { // TODO 芋艿，后续研究下。这样的处理方式，很奇怪。
if (!this.checkedItemIds) {
return;
}
let selected;
let diffItemIds;
if (newVal.length > this.oldCheckedItemIds.length) { // 新增
selected = true;
let that = this;
diffItemIds = [...newVal].filter(function(val) {
return that.oldCheckedItemIds.indexOf(val) < 0; // 找不到
});
} else if (newVal.length < this.oldCheckedItemIds.length) { // 减少
selected = false;
diffItemIds = [...this.oldCheckedItemIds].filter(function(val) {
return newVal.indexOf(val) < 0; // 找不到
});
} else {
return;
}
updateCartSelected(diffItemIds, selected).then(data => {
this.handleData(data);
})
// debugger;
},
onSelectAll(newVal) {
if (this.checkedAll === undefined) {
return;
}
// debugger;
// updateCartSelected(this.getItemIds(), newVal).then(data => {
// this.handleData(data);
// })
if (newVal) {
this.onItemSelectedChange(this.getItemIds());
} else {
// alert('有 bug ，后续修复');
// this.onItemSelectedChange(this.getItemIds());
// TODO 芋艿，暂时有 bug 。后续修复
}
},
onSubmit() {
this.$router.push('/order?from=cart')
},
convertProduct(item) {
// debugger;
return {
...item.spu,
quantity: item.buyQuantity,
price: item.buyPrice || item.price,
sku: {
...item,
spu: undefined,
},
selected: item.selected,
};
}
},
mounted() {
// 获得购物车列表
listCart().then(data => {
this.handleData(data);
});
}
};
</script>
<style lang="less">
.card-goods {
font-size: 12px;
&__item {
position: relative;
.van-checkbox{
width: 20px;
height: 20px;
top: 40px;
left: 5px;
z-index: 1;
position: absolute;
}
.additional{
width: 100%;
padding-left: 15px;
box-sizing: border-box;
}
}
}
.head{
padding-left: 5px;
border-bottom: 1px solid #eee;
}
.card{
background: #f7f7f7;
.van-submit-bar__bar {
border-top: 1px solid #f7f7f7;
.van-checkbox{
padding-left: 5px;
}
}
.promotion{
.van-tag {
line-height: 12px;
margin-right: 5px;
}
.van-cell__title{
flex: 4;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
.promotion-group{
margin-top: 10px;
box-shadow: 5px 5px 5px #e5e5e5;
}
}
</style>
mobile-web/src/page/category/index.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div>
<van-search
v-model="keyword"
placeholder="请输入搜索关键词"
show-action
@search="onSearch"
>
<div slot="action" @click="onSearch">搜索</div>
</van-search>
<van-badge-group :active-key="activeKey" class="tab" :style="'height:'+fullHeight+'px'">
<!--<van-badge title="热门推荐" @click="onClick" />-->
<!--<van-badge title="手机数码" @click="onClick" />-->
<!--<van-badge title="家用电器" @click="onClick" />-->
<!--<van-badge title="电脑办公" @click="onClick" />-->
<!--<van-badge title="美妆护肤" @click="onClick" />-->
<!--<van-badge title="个护清洁" @click="onClick" />-->
<!--<van-badge title="汽车用品" @click="onClick" />-->
<!--<van-badge title="男装" @click="onClick" />-->
<!--<van-badge title="男鞋" @click="onClick" />-->
<!--<van-badge title="女装" @click="onClick" />-->
<!--<van-badge title="女鞋" @click="onClick" />-->
<!--<van-badge title="母婴童装" @click="onClick" />-->
<!--<van-badge title="图书音像" @click="onClick" />-->
<!--<van-badge title="运动户外" @click="onClick" />-->
<van-badge v-for="category in rootCategories" :title="category.name" @click="onClick" />
</van-badge-group>
<div class="content" :style="'width:'+fullWidth+'px;height:'+(fullHeight-7)+'px'" >
<!-- TODO 营销活动，暂时注释掉 -->
<!--<img src="https://img11.360buyimg.com/mcoss/jfs/t1/1072/23/3672/95463/5b9a0813E175891fa/e38fc2f7c2ddfec2.jpg" />-->
<!-- TODO 常用分类，暂时注释掉 -->
<!--<div class="category-div">-->
<!--<h4>常用分类</h4>-->
<!--<ul >-->
<!--<li>-->
<!--<router-link to="/search?keyword=xxxx">-->
<!--<img src="//img12.360buyimg.com/focus/jfs/t11824/150/2263801190/3392/8e69e1b3/5a167b8cNdcf71ae5.jpg">-->
<!--<span>蓝牙耳机</span>-->
<!--</router-link>-->
<!--</li>-->
<!--<li>-->
<!--<a >-->
<!--<img src="//img20.360buyimg.com/focus/jfs/t13759/194/897734755/2493/1305d4c4/5a1692ebN8ae73077.jpg">-->
<!--<span>iPhone</span>-->
<!--</a>-->
<!--</li>-->
<!--<div style="clear:both"></div>-->
<!--</ul>-->
<!--</div>-->
<div class="category-div">
<!--<h4>热门分类</h4>-->
<ul>
<li v-for="category in childCategories">
<router-link :to="'/products/list?title=' + activeCategory.name + '&cidFirst=' + activeCategory.id + '&cidSecond=' + category.id">
<img :src="category.picUrl" />
<span>{{ category.name }}</span>
</router-link>
</li>
<div style="clear:both">
</div>
</ul>
</div>
</div>
<navigate />
</div>
</template>
<script>
import { Search } from "vant";
// import { GetAddressById } from '../../api/user';
import { getProductCategoryList } from '../../api/product';
export default {
name: "userindex",
components: {
[Search.name]: Search
},
data() {
return {
keyword: "",
rootCategories: [],
childCategories: [],
activeKey: 0,
activeCategory: {}, // 选中的分类
fullHeight: document.documentElement.clientHeight - 93,
fullWidth: document.documentElement.clientWidth - 99
};
},
methods: {
onSearch() {
// debugger;
// GetAddressById(1);
// console.log(this.value);
this.$router.push(
{name: '/product/search', params: {keyword: this.keyword}}
)
},
onClick(key) {
// debugger;
// GetAddressById(1);
// 设置 activeKey
this.activeKey = key;
// 读取子节点的分类
if (this.rootCategories.length > key) {
this.activeCategory = this.rootCategories[key];
let response = getProductCategoryList(this.activeCategory.id);
response.then(data => {
this.childCategories = data;
});
}
}
},
mounted() {
let response = getProductCategoryList(0);
response.then(data => {
// console.log(data);
// debugger;
// 设置根节点的分类
this.rootCategories = data;
// 获得首个根节点的分类
if (data && data.length > 0) {
this.activeCategory = data[0];
let response = getProductCategoryList(data[0].id);
response.then(data => {
this.childCategories = data;
});
}
});
}
};
</script>
<style lang="less">
.tab {
float: left;
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
min-height: 100%;
.van-badge {
padding: 15px 12px 15px 9px;
}
.van-badge:not(:last-child)::after {
height: 199%;
}
}
.content {
float: left;
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
min-height: 100%;
margin: 7px 7px 0;
font-size: 12px;
img {
width: 100%;
}
.category-div {
margin: 19px 0px 0;
h4 {
font-size: 14px;
color: #333;
}
ul{
margin-top: 10px;
}
li {
width: 32.8%;
float: left;
text-align: center;
img {
width: 60px;
height: 60px;
}
span{
font-size: 12px;
height: 36px;
color: #686868;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
display: box;
display: -webkit-box;
display: -moz-box;
display: -ms-box;
display: -o-box;
line-clamp: 2;
-webkit-line-clamp: 2;
-moz-line-clamp: 2;
-ms-line-clamp: 2;
-o-line-clamp: 2;
box-orient: vertical;
-webkit-box-orient: vertical;
-ms-box-orient: vertical;
-o-box-orient: vertical;
word-break: break-all;
box-align: center;
-webkit-box-align: center;
-moz-box-align: center;
-ms-box-align: center;
-o-box-align: center;
box-pack: center;
-webkit-box-pack: center;
-moz-box-pack: center;
-ms-box-pack: center;
-o-box-pack: center;
z-index: 2;
position: relative;
}
}
}
}
</style>
mobile-web/src/page/coupon/fetch.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div>
<van-cell-group>
<van-cell title="优惠劵编号" :value="couponTemplate.id" />
<van-cell title="优惠劵名" :value="couponTemplate.title"/>
</van-cell-group>
<van-button slot="button" size="small" type="primary" @click="onFetchClick">领取优惠劵</van-button>
</div>
</template>
<script>
import { getCouponTemplate, doAddCouponCard } from '../../api/promotion';
import { Dialog } from 'vant';
import { setLoginToken } from '../../utils/cache';
export default {
data() {
return {
couponTemplate: {
}
}
},
mounted() {
let id = this.$route.query.id;
let response = getCouponTemplate(id);
response.then(data => {
this.couponTemplate = data;
});
},
methods: {
onFetchClick: function () {
let that = this;
let id = this.$route.query.id;
let response = doAddCouponCard(id);
response.then(data => {
Dialog.alert({
title: '系统提示',
message: '领取成功',
beforeClose: function (action, done) {
// 关闭弹窗
done();
// 跳转到我的优惠劵
that.$router.push('/user/coupon');
}
});
});
}
}
}
</script>
mobile-web/src/page/coupon/list.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div>
<headerNav title="我的优惠券"/>
<van-cell-group>
<van-field
center
clearable
placeholder="请输入优惠码"
v-model="couponCode"
>
<van-button slot="button" size="small" type="primary" :loading="exchangeLoading" @click="onExchange">兑换</van-button>
</van-field>
</van-cell-group>
<van-tabs >
<van-tab title="未使用">
<ul>
<van-list
v-model="unusedData.loading"
:finished="unusedData.finished"
@load="onLoad"
>
<li v-for="(item,index) in unusedData.list" :key="index" :class="'couponitem '+(item.show?'show':'') ">
<div class="couponTop">
<div class="cpnamount">
<div class="amountWrap">
<div class="amount" v-if="item.preferentialType === 1">
<span class="amountSign" >￥</span>
<span class="amountNum">{{item.priceOff / 100}}</span>
</div>
<div class="amount" v-else="item.preferentialType === 2">
<span class="amountNum">{{item.percentOff / 10.0}}</span>
<span class="amountSign">折</span>
</div>
<div class="condition">
<span>满 {{item.priceAvailable / 100.0}} 元可用</span>
</div>
</div>
</div>
<div class="couponInfoWrap">
<div class="cpninfo">
<div class="detail">
<span class="name">{{item.title}}</span></div>
</div>
<div class="validity">
<span>{{item.validStartTime | formatDate('yyyy-MM-dd')}}
~ {{item.validEndTime | formatDate('yyyy-MM-dd')}}</span>
</div>
<van-button type="danger" size="mini">立即使用</van-button>
</div>
</div>
<!-- <div class="couponMid " v-if="item.Info!=''">-->
<!-- <span>详细信息</span>-->
<!-- <van-icon name="arrow" class="down" @click="onShowInfo(item.Id,index)" />-->
<!-- </div>-->
<!-- <div class="info" v-if="item.Info!=''" >-->
<!-- <div class="text">-->
<!-- {{item.Info}}-->
<!-- </div>-->
<!-- </div>-->
<!-- todo 芋艿，后续做优化。指定哪些商品 / 分类可用 -->
<div class="info" v-if="item.Info!=''" >
<div class="text">
{{item.Info}}
</div>
</div>
</li>
</van-list>
</ul>
</van-tab>
<van-tab title="使用记录">
<ul class="gray" >
<van-list
v-model="usedData.loading"
:finished="usedData.finished"
@load="onLoadUse"
>
<li v-for="(item,index) in usedData.list" :key="index" class="couponitem">
<div class="couponTop">
<div class="cpnamount">
<div class="amountWrap">
<div class="amount" v-if="item.preferentialType === 1">
<span class="amountSign" >￥</span>
<span class="amountNum">{{item.priceOff / 100}}</span>
</div>
<div class="amount" v-else="item.preferentialType === 2">
<span class="amountNum">{{item.percentOff / 10.0}}</span>
<span class="amountSign">折</span>
</div>
<div class="condition">
<span>满 {{item.priceAvailable}} 元可用</span>
</div>
</div>
</div>
<div class="couponInfoWrap">
<div class="cpninfo">
<div class="detail">
<span class="name">{{item.title}}</span></div>
</div>
<div class="validity">
<span>{{item.validStartTime | formatDate('yyyy-MM-dd')}}
~ {{item.validEndTime | formatDate('yyyy-MM-dd')}}</span>
</div>
</div>
</div>
</li>
</van-list>
</ul>
</van-tab>
<van-tab title="已过期">
<ul class="gray" >
<van-list
v-model="expireData.loading"
:finished="expireData.finished"
@load="onLoadEnd"
>
<li v-for="(item,index) in expireData.list" :key="index" class="couponitem">
<div class="couponTop">
<div class="cpnamount">
<div class="amountWrap">
<div class="amount" v-if="item.preferentialType === 1">
<span class="amountSign" >￥</span>
<span class="amountNum">{{item.priceOff / 100}}</span>
</div>
<div class="amount" v-else="item.preferentialType === 2">
<span class="amountNum">{{item.percentOff / 10.0}}</span>
<span class="amountSign">折</span>
</div>
<div class="condition">
<span>满 {{item.priceAvailable}} 元可用</span>
</div>
</div>
</div>
<div class="couponInfoWrap">
<div class="cpninfo">
<div class="detail">
<span class="name">{{item.title}}</span></div>
</div>
<div class="validity">
<span>{{item.validStartTime | formatDate('yyyy-MM-dd')}}
~ {{item.validEndTime | formatDate('yyyy-MM-dd')}}</span>
</div>
</div>
</div>
</li>
</van-list>
</ul>
</van-tab>
</van-tabs>
</div>
</template>
<script>
import { ExchangeCoupon } from "../../api/user.js";
import { getCouponPage } from "../../api/promotion.js";
export default {
components: {
},
data() {
return {
// loading:false,
// finished:false,
// list:[],
// page:0,
//
//
// useLoading:false,
// useFinished:false,
// useList:[],
// usePage:0,
//
//
// endLoading:false,
// endFinished:false,
// endList:[],
// endPage:0,
couponCode:'',
exchangeLoading:false,
unusedData: {
page: 0,
pageSize: 10,
list: [],
loading: false,
finished: false,
},
usedData: {
page: 0,
pageSize: 10,
list: [],
loading: false,
finished: false,
},
expireData: {
page: 0,
pageSize: 10,
list: [],
loading: false,
finished: false,
},
};
},
computed: {
},
methods: {
onLoad() {
// 进入下一页
let page = this.unusedData.page + 1;
getCouponPage(1, page, this.unusedData.pageSize).then(data => {
// debugger;
// 设置下页面
this.unusedData.page = page;
// 数据保存到 list 中
this.unusedData.list.push(...data.list);
// 判断页数
if (this.unusedData.list.length >= data.total) {
this.unusedData.finished = true;
}
// 标记不在加载中
this.unusedData.loading = false;
});
// GetCoupon({page:this.page}).then(response=>{
// response.List.forEach(item => {
// item.show=false;
// this.list.push(item);
// });
// this.loading = false;
// if(response.TotalPage<=this.page){
// this.finished = true;
// }
//
// })
},
// onShowInfo(id,index){
// this.list.forEach((item,itemIndex) => {
// if(index==itemIndex){
// item.show=!item.show;
// return;
// }
// });
// },
onLoadUse() {
// 进入下一页
let page = this.usedData.page + 1;
getCouponPage(2, page, this.usedData.pageSize).then(data => {
// debugger;
// 设置下页面
this.usedData.page = page;
// 数据保存到 list 中
this.usedData.list.push(...data.list);
// 判断页数
if (this.usedData.list.length >= data.total) {
this.usedData.finished = true;
}
// 标记不在加载中
this.usedData.loading = false;
});
},
onLoadEnd() {
// 进入下一页
let page = this.expireData.page + 1;
getCouponPage(3, page, this.expireData.pageSize).then(data => {
// debugger;
// 设置下页面
this.expireData.page = page;
// 数据保存到 list 中
this.expireData.list.push(...data.list);
// 判断页数
if (this.expireData.list.length >= data.total) {
this.expireData.finished = true;
}
// 标记不在加载中
this.expireData.loading = false;
});
},
onExchange(){
if(this.exchangeLoading){
return;
}
this.exchangeLoading=true;
ExchangeCoupon(this.couponCode).then(response=>{
this.$toast('兑换成功');
this.exchangeLoading=false;
this.$router.go(0);
})
}
}
};
</script>
<style lang="less">
.couponitem {
padding: 0 10px;
margin-top: 10px;
position: relative;
font-size: 12px;
.couponTop {
background-color: #fcebeb;
border-left: 1px solid #f3d4d4;
border-right: 1px solid #f3d4d4;
border-bottom: 1px dashed #f3d4d4;
border-radius: 8px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
.cpnamount {
position: relative;
height: 90px;
width: 34.08%;
text-align: center;
float: left;
border-right: 1px dashed #f3d4d4;
}
.amountWrap {
width: 100%;
position: absolute;
top: 50%;
-webkit-transform: translate(0, -50%);
transform: translate(0, -50%);
.amount {
font-size: 15px;
.amountSign {
margin-right: 3px;
}
.amountNum {
font-size: 39px;
line-height: 1;
font-weight: bold;
}
}
}
}
.couponInfoWrap {
position: relative;
margin-left: 37.465%;
height: 90px;
.cpninfo {
position: absolute;
top: 26px;
-webkit-transform: translate(0, -50%);
transform: translate(0, -50%);
width: 100%;
.detail {
padding-right: 15px;
word-break: break-all;
.name {
font-size: 13px;
color: #000;
}
}
}
.validity {
position: absolute;
bottom: 16px;
font-size: 10px;
}
button{
right: 16px;
position: absolute;
bottom: 16px;
}
}
.couponMid {
position: relative;
height: 31px;
line-height: 31px;
padding-left: 16px;
font-size: 12px;
background-color: #fcebeb;
border-left: 1px solid #f3d4d4;
border-right: 1px solid #f3d4d4;
border-bottom: 1px solid #f3d4d4;
border-radius: 8px;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
i{
right: 16px;
position: absolute;
top: 8px;
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
}
.info{
display: none;
background-color: #fcebeb;
border-left: 1px solid #f3d4d4;
border-right: 1px solid #f3d4d4;
border-bottom: 1px solid #f3d4d4;
border-bottom-left-radius: 8px;
border-bottom-right-radius: 8px;
padding: 10px 25px 12px 15px;
font-size: 12px;
}
}
.show{
.couponMid {
border-bottom: 1px dashed #f3d4d4;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
i{
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg);
}
}
.info{
display: block;
}
}
.gray{
-webkit-filter: grayscale(100%);filter:progid:DXImageTransform.Microsoft.BasicImage(graysale=1);
}
</style>
mobile-web/src/page/eventBus.js deleted 100644 → 0
浏览文件 @ 6d1a47af
import Vue from 'vue'
/**
* 定义空的vue实例，作为 eventbus实现非父子组件之间的通信(vue2.x中去掉了broadcast)
*/
export default new Vue({});
mobile-web/src/page/index.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div>
<page/>
<navigate />
</div>
</template>
<script>
import navigate from '../components/footer/navigate.vue'
import page from './page/index.vue'
export default {
components:{
page,
navigate
}
}
</script>
<style>
</style>
\ No newline at end of file
mobile-web/src/page/page/index.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div :style="'background-color:'+((page.BackgroundColor==undefined||page.BackgroundColor=='')?'#fff':page.BackgroundColor)">
<!-- <div :style="'height:'+topheight+'px'" ></div>-->
<!-- TODO 搜索框 -->
<!-- <search v-if="item.Code=='Search'" :data="item.ParameterDictionary" v-on:settopheight="settopheight($event)" ></search>-->
<van-search
v-model="keyword"
placeholder="请输入搜索关键词"
show-action
@search="onSearch">
<div slot="action" @click="onSearch">搜索</div>
</van-search>
<van-swipe :autoplay="3000" indicator-color="white" :height="160">
<van-swipe-item v-for="(banner, index) in banners" :key="index" >
<a :href="banner.url">
<img :src="banner.picUrl" height="100%" width="100%" >
</a>
</van-swipe-item>
</van-swipe>
<van-row style="text-align: center">
<van-col span="8">
<router-link to="/category">
<van-icon name="http://static.iocoder.cn/icons8-medium-priority-45.png"/>
<div style="font-size:12px;margin-top: -10px;">分类</div>
</router-link>
</van-col>
<van-col span="8">
<router-link to="/category">
<van-icon name="http://static.iocoder.cn/icons8-sun-45.png" />
<div style="font-size:12px;margin-top: -10px;">热卖</div>
</router-link>
</van-col>
<van-col span="8">
<router-link to="/category">
<van-icon name="http://static.iocoder.cn/icons8-new-45.png" />
<div style="font-size:12px;margin-top: -10px;">新品</div>
</router-link>
</van-col>
</van-row>
<van-panel title="新品推荐" >
<!-- <product :data="productRecommends['1']" ></product>-->
<div style="height: 70px;" v-for="(product,i) in productRecommends['1']" :key="i">
<product-card :product='product' @click="showProduct(product)" />
</div>
</van-panel>
<van-panel title="热卖推荐">
<div style="height: 70px;" v-for="(product,i) in productRecommends['2']" :key="i">
<product-card :product='product' @click="showProduct(product)" />
</div>
</van-panel>
</div>
</template>
<script>
import "../../assets/style/index.css";
import whitespace from "../../components/page/whitespace.vue";
import pageLine from "../../components/page/line.vue";
import pageText from "../../components/page/text.vue";
import notice from "../../components/page/notice.vue";
// import search from "../../components/page/search.vue";
import pageTitle from "../../components/page/title.vue";
import cube from "../../components/page/cube.vue";
import imageAd from "../../components/page/imageAd.vue";
import imageText from "../../components/page/imageText.vue";
import product from "../../components/page/product.vue";
import {getBannerList, getProductRecommendList} from '../../api/promotion.js';
import {Search} from "vant";
export default {
name:"page",
components:{
whitespace,
pageLine,
pageText,
notice,
// search,
pageTitle,
cube,
[imageAd.name]:imageAd,
imageText,
product,
[Search.name]: Search
},
data:function(){
return{
topheight:0,
page:{},
keyword: '', // 搜索关键词
banners: [], // Banner 列表
productRecommends: [], // 推荐商品列表
}
},
created:function(){
// GetPage().then(response=>{
// this.page=response;
// });
},
mounted: function() {
// 加载 Banner
{
let response = getBannerList();
response.then(data => {
this.banners = data;
});
}
// 加载 getProductRecommendList
{
let response = getProductRecommendList();
response.then(data => {
this.productRecommends = data;
});
}
},
methods:{
// onBannerClick: function(event, index) {
// debugger;
// console.log(event);
// },
// settopheight:function(value){
// this.topheight=value;
// },
showProduct(product){
this.$router.push('/product/'+product.id);
},
onSearch: function () {
// debugger;
this.$router.push(
{name: '/product/search', params: {keyword: this.keyword}}
)
}
}
}
</script>
mobile-web/src/page/pay/index.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div>
<headerNav title="收银台"/>
<van-cell-group>
<van-cell title="订单商品名" :value="transaction.orderSubject" />
<van-cell title="价格" :value="transaction.price / 100.0" />
</van-cell-group>
<van-button slot="button" size="small" type="primary" @click="submit(9999)">模拟支付</van-button>
</div>
</template>
<script>
import { getTransaction, submitTransaction } from '../../api/pay';
import pingpp from 'pingpp-js';
import { Dialog } from 'vant';
export default {
data() {
return {
appId: this.$route.query.appId,
orderId: this.$route.query.orderId,
returnUrl: this.$route.query.returnUrl,
transaction: {},
}
},
mounted() {
let response = getTransaction(this.appId, this.orderId);
response.then(data => {
this.transaction = data;
});
},
methods: {
submit(payChannel) {
let that = this;
submitTransaction(this.appId, this.orderId, payChannel).then(data => {
pingpp.createPayment(data.invokeResponse, function(result, err) {
if (result === 'success') {
Dialog.alert({
title: '系统提示',
message: '支付成功',
beforeClose: function (action, done) {
// 关闭弹窗
done();
// 跳转到我的优惠劵
that.$router.push(decodeURI(that.returnUrl));
}
});
} else {
// console.log(err.msg);
// console.log(err.extra);
Dialog.alert({
title: '系统提示',
message: '支付失败：' + err.msg,
});
}
});
});
}
}
}
</script>
mobile-web/src/page/product/detail.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div class="goods">
<headerNav title="商品详情"/>
<van-swipe class="goods-swipe" :autoplay="3000">
<van-swipe-item v-for="thumb in spu.picUrls" :key="thumb">
<img :src="thumb">
</van-swipe-item>
</van-swipe>
<!-- TODO 这里需要优化下，芋艿 -->
<van-cell-group>
<van-cell>
<div v-if="calSkuPriceResult.originalPrice && calSkuPriceResult.originalPrice !== calSkuPriceResult.buyPrice">
<span class="goods-price">{{ formatPrice(calSkuPriceResult.buyPrice) }}</span>
<span class="goods-market-price">{{ formatPrice(calSkuPriceResult.originalPrice) }}</span>
</div>
<div v-else>
<span class="goods-price">{{ formatPrice(initialSku.price) }}</span>
</div>
<div class="goods-title">{{ spu.name }}</div>
<div class="goods-subtit">{{spu.sellPoint}}</div>
</van-cell>
<!--<van-cell @click="onClickShowTag" class="goods-tag" >-->
<!--<template slot="title" style="font-size:10px;">-->
<!--<img src="https://haitao.nos.netease.com/ba8a4c2fdaa54f82a45261293c116af61419663676663i46n3jlh10028.png"/>-->
<!--<span >挪威品牌</span>-->
<!--<img src="https://haitao.nosdn2.127.net/13bd59e6e29a4f06b278c586629e690d.png" />-->
<!--<span >跨境商品</span>-->
<!--<van-icon name="passed" color="red" />-->
<!--<span >次日达</span>-->
<!--<van-icon name="passed" color="red" />-->
<!--<span >自提</span>-->
<!--<van-icon name="passed" color="red" />-->
<!--<span >闪电退款</span>-->
<!--<van-icon name="passed" color="red" />-->
<!--<span >前海保税仓</span>-->
<!--<van-icon name="passed" color="red" />-->
<!--<span >七天无理由退货（拆封后不支持）</span>-->
<!--</template>-->
<!--</van-cell> -->
</van-cell-group>
<!--<van-cell-group class="goods-cell-group">-->
<!--<van-cell is-link @click="showPromotion" >-->
<!--<template slot="title">-->
<!--<span style="margin-right: 10px;">领券</span>-->
<!--<van-tag type="danger" mark style="margin-right: 5px;">满180减30</van-tag>-->
<!--<van-tag type="danger" mark style="margin-right: 5px;">满300减100</van-tag>-->
<!--</template>-->
<!--</van-cell>-->
<!---->
<!--<van-cell is-link @click="showPromotion" >-->
<!--<template slot="title">-->
<!--<span style="margin-right: 10px;">促销</span>-->
<!--<van-tag type="danger" style="margin-right: 5px;">多买优惠</van-tag>-->
<!--<van-tag type="danger" style="margin-right: 5px;">满减</van-tag>-->
<!--<van-tag type="danger" style="margin-right: 5px;">限购</van-tag>-->
<!--</template>-->
<!--</van-cell>-->
<!--</van-cell-group>-->
<van-cell-group class="goods-cell-group">
<van-cell is-link @click="showSku">
<template slot="title">
<span style="margin-right: 10px;">已选</span>
<span>{{ formatSkuText(initialSku) }}</span>
</template>
</van-cell>
</van-cell-group>
<!-- <van-cell is-link @click="sorry">-->
<!-- <template slot="title">-->
<!-- <van-tag type="danger">多买优惠</van-tag>-->
<!-- <span> 满2件，总价打9折</span>-->
<!-- </template>-->
<!-- </van-cell>-->
<!-- TODO 芋艿，后续【限时折扣】需要改下样式 -->
<van-cell v-if="calSkuPriceResult.timeLimitedDiscount" is-link @click="sorry">
<template slot="title">
<van-tag type="danger">限时折扣</van-tag>
<span> {{ formatTimeLimitedDiscountText(calSkuPriceResult.timeLimitedDiscount) }} </span>
</template>
</van-cell>
<van-cell v-if="calSkuPriceResult.fullPrivilege" is-link @click="sorry">
<template slot="title">
<van-tag type="danger">满减送</van-tag>
<span> {{ formatFullPrivilegeText(calSkuPriceResult.fullPrivilege) }} </span>
</template>
</van-cell>
<div class="goods-info">
<p class="goods-info-title">图文详情</p>
<div v-html="spu.description"></div>
</div>
<van-goods-action>
<van-goods-action-mini-btn icon="like-o" :class="{active:hasCollectionType === 1 }" @click="onFavoriteClicked">
收藏
</van-goods-action-mini-btn>
<van-goods-action-mini-btn icon="cart" :info="cartCount > 0 ? cartCount : undefined" @click="onClickCart">
购物车
</van-goods-action-mini-btn>
<van-goods-action-big-btn @click="showSku">
加入购物车
</van-goods-action-big-btn>
<van-goods-action-big-btn primary @click="showSku">
立即购买
</van-goods-action-big-btn>
</van-goods-action>
<!--<van-actionsheet v-model="showTag" title="服务说明" style="font-size:14px;">-->
<!---->
<!--<van-cell>-->
<!--<template slot="title">-->
<!--<van-icon name="passed" color="red" style="margin-right: 10px;" />-->
<!--<span >次日达</span>-->
<!--<div style="margin-left: 24px;font-size:10px;color:#7d7d7d;">指定时间前下单，次日送达</div>-->
<!--</template>-->
<!--</van-cell>-->
<!--<van-cell>-->
<!--<template slot="title">-->
<!--<van-icon name="passed" color="red" style="margin-right: 10px;" />-->
<!--<span >自提</span>-->
<!--<div style="margin-left: 24px;font-size:10px;color:#7d7d7d;">我们提供多种自提服务，包括自提点、自助提货柜、移动自提车等服务</div>-->
<!--</template>-->
<!--</van-cell>-->
<!--<van-cell>-->
<!--<template slot="title">-->
<!--<van-icon name="passed" color="red" style="margin-right: 10px;" />-->
<!--<span >闪电退款</span>-->
<!--<div style="margin-left: 24px;font-size:10px;color:#7d7d7d;">签收7天内退货的，提供先退款后退货服务。</div>-->
<!--</template>-->
<!--</van-cell>-->
<!--<van-cell>-->
<!--<template slot="title">-->
<!--<van-icon name="passed" color="red" style="margin-right: 10px;" />-->
<!--<span >七天无理由退货（拆封后不支持）</span>-->
<!--<div style="margin-left: 24px;font-size:10px;color:#7d7d7d;">七天无理由退货（拆封后不支持）</div>-->
<!--</template>-->
<!--</van-cell>-->
<!--<van-cell>-->
<!--<template slot="title">-->
<!--<van-icon name="passed" color="red" style="margin-right: 10px;" />-->
<!--<span >前海保税仓</span>-->
<!--<div style="margin-left: 24px;font-size:10px;color:#7d7d7d;">本商品由前海保税仓发货</div>-->
<!--</template>-->
<!--</van-cell>-->
<!--</van-actionsheet>-->
<van-sku
v-model="showBase"
:sku="vanSku"
:initial-sku="initialSku"
:goods="vanSpu"
:goods-id="spu.id"
:hide-stock="hideStock"
:close-on-click-overlay="closeOnClickOverlay"
@stepper-change="stepperChange"
@sku-selected="skuSelected"
@buy-clicked="onBuyClicked"
@add-cart="onAddCartClicked"
/>
<!--:quota="skuData.quota"-->
</div>
</template>
<script>
// import skuData from '../../data/sku';
import {getProductSpuInfo,collectionSpu} from '../../api/product';
import {addCart, countCart, getCartCalcSkuPrice} from '../../api/order';
import {hasUserSpuFavorite} from '../../api/user';
import {Dialog} from 'vant';
import {checkLogin} from "../../utils/cache";
export default {
components: {},
data() {
// this.skuData = skuData;
return {
spu: {}, // 商品信息
vanSku: {
tree: [], // 规格数组
list: [], // sku 数组
},
// TODO 后面，要加 sku 的 title 和 picture
vanSpu: {
title: '',
picture: '',
},
initialSku: { // 选中的 sku
// 具体规格
// price 价格
// quantity 选中的数量
},
attrValueMap: new Map(), // 规格值的映射
showBase: false, // 是否显示 sku 弹层
closeOnClickOverlay: true, // 是否在点击蒙层后关闭
hideStock: true, // 是否显示商品剩余库存
cartCount: 0,
calSkuPriceResult: {
},
hasCollectionType:0
};
},
methods: {
formatPrice(data) {
return '¥' + (data / 100).toFixed(2);
},
formatSkuText(data) { // 渲染已选择的 sku 的文本
let text = '';
for (let prop in data) {
if (prop.indexOf('attr_') === 0) {
text = text + this.attrValueMap.get(data[prop]) + ' ';
}
}
text = text + 'x ' + data.quantity + ' 件';
return text;
},
formatTimeLimitedDiscountText(activity) {
let text = '';
let timeLimitedDiscount = activity.timeLimitedDiscount.items[0];
if (timeLimitedDiscount.preferentialType === 1) {
text += '减 ' + timeLimitedDiscount.preferentialValue / 100.0 + ' 元';
} else if (timeLimitedDiscount.preferentialType === 2) {
text += '打 ' + timeLimitedDiscount.preferentialValue / 10.0 + ' 折';
}
if (activity.timeLimitedDiscount.quota > 0) {
text += '【限购 ' + activity.timeLimitedDiscount.quota + ' 件】';
}
return text;
},
formatFullPrivilegeText(activity) {
let text = '';
let fullPrivilege = activity.fullPrivilege;
for (let i in fullPrivilege.privileges) {
let privilege = fullPrivilege.privileges[i];
if (i > 0) {
text += ';';
}
if (fullPrivilege.cycled) {
text += '每';
}
if (privilege.meetType === 1) {
text += '满 ' + privilege.meetValue / 100.0 + ' 元,';
} else if (privilege.meetType === 2) {
text += '满 ' + privilege.meetValue + ' 件,';
}
if (privilege.preferentialType === 1) {
text += '减 ' + privilege.preferentialValue / 100.0 + ' 元';
} else if (privilege.preferentialType === 2) {
text += '打 ' + privilege.preferentialValue / 10.0 + ' 折';
}
}
return text;
},
stepperChange(value) { // 选择 sku 数量时
this.initialSku.quantity = value;
},
skuSelected({skuValue, selectedSku, selectedSkuComb}) { // 选择 sku
// TODO 芋艿，需要改下，禁用用户取消选中。
// console.log(skuValue);
// console.log(selectedSku);
// console.log(selectedSkuComb);
this.initialSku = {
...selectedSkuComb,
quantity: 1,
};
// 执行 sku 价格计算
this.doCalcSkuPrice(this.initialSku.id)
},
doCalcSkuPrice(skuId) {
getCartCalcSkuPrice(skuId).then(data => {
this.calSkuPriceResult = data;
// 修改 vanSku.list 里匹配的 sku 的价格（目的，将优惠价赋值到其上）
for (let i in this.vanSku.list) {
let sku = this.vanSku.list[i];
if (sku.id === skuId) {
sku.price = data.buyPrice;
break;
}
}
});
},
initHasUserSpuFavorite(spuId){
if (!checkLogin()) {
this.hasCollectionType = 0;
return;
}
//初始化验证商品收藏
hasUserSpuFavorite(spuId).then(data => {
let hasCollection = data;
// alert("是否收藏==" + hasCollection);
if (hasCollection) {
this.hasCollectionType = 1;
}
});
},
onClickCart() {
this.$router.push('/cart');
},
sorry() {
Toast('暂无后续逻辑~');
},
showPromotion() {
this.show = true;
},
showSku() { // 展示 sku 选择
this.showBase = true;
},
onClickShowTag() {
this.showTag = true;
},
onFavoriteClicked(){
if (!checkLogin()) {
Dialog.alert({
title: '系统提示',
message: '未登陆用户，暂时不支持使用购物车',
});
return;
}
let id = this.$route.params.id; // 商品编号
let hasCollectionType = 1; // 收藏类型 默认收藏
hasUserSpuFavorite(id).then(data => {
let hasCollection = data;
// alert("是否收藏==" + hasCollection);
if (hasCollection){
hasCollectionType = 2;
}
// alert("hasCollectionType==" + hasCollectionType);
collectionSpu(id,hasCollectionType).then(data =>{
let v = data;
this.hasCollectionType = hasCollectionType;
// if (hasCollectionType == 1 && v){
// // alert("商品已收藏");
// this.hasCollectionType = hasCollectionType;
// }else if (hasCollectionType == 2 && v){
// // alert("商品已取消");
// this.hasCollectionType = hasCollectionType;
// }
})
});
},
onBuyClicked(data) {
const { selectedNum } = data;
this.$router.push({
path:'/order',
query:{
goodsId: data.id,
skuId: data.selectedSkuComb.id,
quantity: selectedNum,
}
});
},
onAddCartClicked(data) {
if (!checkLogin()) {
Dialog.alert({
title: '系统提示',
message: '未登陆用户，暂时不支持使用购物车',
});
return;
}
const { selectedNum } = data;
// debugger;
addCart(data.selectedSkuComb.id,selectedNum).then(data => {
// 修改购物车数量
this.cartCount = data;
// 提示
Dialog.alert({
title: '系统提示',
message: '添加购物车成功',
});
});
},
},
mounted() {
// 获得商品数据
let id = this.$route.params.id; // 商品编号
getProductSpuInfo(id).then(data => {
// 设置 spu
this.spu = data;
// 初始化 vanSku
let vanSku = {
tree: [],
list: [],
};
for (let i = 0; i < data.skus.length; i++) {
let sku = data.skus[i];
// list 商品 sku 信息
let skuVO = {
id: sku.id, // skuId，下单时后端需要
price: sku.price, // 价格（单位分）
stock_num: sku.quantity // 当前 sku 组合对应的库存
};
for (let j = 0; j < sku.attrs.length; j++) {
let attr = sku.attrs[j];
skuVO['attr_' + attr.attrId] = attr.attrValueId;
}
vanSku.list.push(skuVO);
// tree 规格
for (let j = 0; j < sku.attrs.length; j++) {
let attr = sku.attrs[j];
let attrVO;
for (let k = 0; k < vanSku.tree.length; k++) {
if (attr.attrName === vanSku.tree[k].k) {
attrVO = vanSku.tree[k];
break;
}
}
if (!attrVO) { // 未找到，则初始化该规格
attrVO = {
k: attr.attrName, // skuKeyName：规格类目名称
v: [],
k_s: 'attr_' + attr.attrId,
};
vanSku.tree.push(attrVO);
}
let attrValueFound = false; // 如果规格值已经存在，则不再添加
for (let k = 0; k < attrVO.v.length; k++) {
if (attr.attrValueId === attrVO.v[k].id) {
attrValueFound = true;
break;
}
}
if (!attrValueFound) {
attrVO.v.push({
id: attr.attrValueId, // skuValueId：规格值 id
name: attr.attrValueName, // skuValueName：规格值名称
});
}
// 初始化 attrValueMap
this.attrValueMap.set(attr.attrValueId, attr.attrValueName);
}
}
// debugger;
this.vanSku = vanSku;
// 初始化
// TODO 芋艿，需要处理下第一个有效的 sku
this.initialSku = vanSku.list[0];
this.initialSku.quantity = 1;
// 执行 sku 价格计算
this.doCalcSkuPrice(this.initialSku.id);
this.initHasUserSpuFavorite(id);
});
// 获得购物车数量
if (checkLogin()) {
countCart().then(data => {
this.cartCount = data;
})
}
}
};
</script>
<style lang="less">
.goods {
.active {
color: #f44;
}
padding-bottom: 50px;
&-swipe {
img {
width: 7.5rem;
height: 7.5rem;
display: block;
}
}
&-tag {
font-size: 12px;
border-top: 1px solid #e5e5e5;
span {
margin-right: 10px;
}
i {
color: red;
margin-right: 3px;
}
img {
width: 12px;
margin-right: 3px;
margin-top: 6px;
}
}
&-title {
line-height: 18px;
padding-top: 10px;
margin-bottom: 6px;
font-size: 14px;
color: #333;
font-weight: 700;
border-top: 1px solid #f0f0f0;
}
&-subtit {
font-size: 13px;
color: #333;
line-height: 21px;
}
&-price {
color: #f44;
font-size: 20px;
}
&-market-price {
text-decoration: line-through;
margin-left: 8px;
font-size: 13px;
color: #999;
}
&-cell-group {
margin: 15px 0;
.van-cell__value {
color: #999;
}
}
&-info-title {
height: 44px;
line-height: 44px;
text-align: center;
font-size: 14px;
font-weight: 700;
margin: 10px;
border-top: 1px solid #e5e5e5;
}
&-info p {
margin: 0;
padding: 0;
margin-block-end: 0;
margin-block-start: 0;
display: grid;
}
&-info img {
width: 100%;
}
}
</style>
mobile-web/src/page/product/list.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div class="product-list">
<van-nav-bar :title="rootCategory.name" left-text="返回" left-arrow
@click-left="onBack">
</van-nav-bar>
<van-tabs v-model="active" @click="onCategoryClick">
<van-tab v-for="category in childCategories" :title="category.name" />
</van-tabs>
<!-- <div v-for="(product,i) in products" :key="i">-->
<!-- <product-card :product='product' @click="showProduct(product)" />-->
<!-- </div>-->
<van-list
v-model="loading"
:finished="finished"
finished-text="没有更多了"
@load="onLoad"
>
<div v-for="(product,i) in products" :key="i">
<product-card :product='product' @click="showProduct(product)" />
</div>
</van-list>
</div>
</template>
<script>
import { getProductCategoryList, getProductSpuPage } from '../../api/product';
import {getProductPage} from "../../api/search";
export default {
data() {
return {
rootCategory: {
id: parseInt(this.$route.query.cidFirst),
name: this.$route.query.title,
},
childCategory: {
id: parseInt(this.$route.query.cidSecond),
},
childCategories: [],
active: -1,
products: [],
page: 0,
pageSize: 10,
loading: false,
finished: false,
};
},
methods: {
onBack() {
history.back();
},
onCategoryClick(key) {
// 设置激活的 key
this.active = key;
// 加载商品
this.products = [];
// 加载商品
this.loadProductList(this.childCategories[key].id, 1);
},
loadProductList(categoryId, page) {
this.childCategory.id = categoryId;
getProductPage({
pageNo: page,
pageSize: this.pageSize,
cid: this.childCategory.id,
}).then(data => {
this.handleData(page, data);
});
},
onLoad() {
// debugger;
// 进入下一页
let page = this.page + 1;
// 加载商品
this.loadProductList(this.childCategory.id, page);
},
handleData(page, data) {
this.loading = true;
// 设置下页面
this.page = page;
// 数据保存到 list 中
this.products.push(...data.list);
// 判断页数
if (this.products.length >= data.total) {
this.finished = true;
}
// 标记不在加载中
this.loading = false;
},
},
mounted() {
let response = getProductCategoryList(this.rootCategory.id);
response.then(data => {
// console.log(data);
// debugger;
// 设置根节点的分类
this.childCategories = data;
// 设置激活的分类
// debugger;
for (let i = 0; i < data.length; i++) {
if (data[i].id === this.childCategory.id) {
this.active = i;
break;
}
}
// 加载商品列表
// this.loadProductList(this.childCategory.id);
});
}
};
</script>
<style lang="less">
.product-list{
.additional .price{
position: absolute;
bottom: 6px;
height: 34px;
}
}
</style>
mobile-web/src/page/product/search.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div class="product-list">
<searchtop :keyword="keyword" @onSearch="onSearch" />
<div class="filterbar">
<ul :class="filterSort?'show':''">
<li :class="filterIndex===0?'selected':''" v-on:click="onFilterBar(0)"><span>{{filterIndex==11?'价格最低':(filterIndex==12?'价格最高':'综合')}}</span><van-icon name="arrow" class="down" /></li>
<li :class="filterIndex===1?'selected':''" v-on:click="onFilterBar(1)"><span>销量</span></li>
<li :class="filterIndex===2?'selected':''" v-on:click="onFilterBar(2)"><span>上新</span></li>
<li :class="filterIndex===3?'selected':''" v-on:click="onFilterBar(3)"><span>筛选</span></li>
</ul>
<div :class="'item_options '+(filterSort?'show':'')">
<ul>
<li :class="filterIndex==10?'selected':''" v-on:click="onFilterBar(10)">综合</li>
<li :class="filterIndex==11?'selected':''" v-on:click="onFilterBar(11)">价格降序</li>
<li :class="filterIndex==12?'selected':''" v-on:click="onFilterBar(12)">价格最高</li>
</ul>
</div>
<div :class="'item_options '+(filterShow?'show':'')">
<ul>
<li v-for="category in categories" :class="category.id === categoryId ?'selected':''" v-on:click="onCategoryClick(category.id)">
{{ category.name }}
</li>
</ul>
</div>
<!-- <van-popup v-model="filterShow" position="right" class="filterlayer" >-->
<!-- <div class="filterInner" style="overflow-y: scroll;max-height: 100%;">-->
<!-- <ul>-->
<!-- <li>-->
<!-- <van-cell title="清洁类型" is-link arrow-direction="down" />-->
<!-- </li>-->
<!-- <div style="clear: both;"></div>-->
<!-- <div class="tags_selection">-->
<!-- <div class="option">-->
<!-- <a href="javascript:void 0;">牙龈护理111</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">抛光</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">清洁</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">正畸专用</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">敏感</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">亮白</a>-->
<!-- </div>-->
<!-- <div style="clear: both;"></div>-->
<!-- </div>-->
<!-- </ul>-->
<!-- <ul>-->
<!-- <li>-->
<!-- <van-cell title="清洁类型" is-link arrow-direction="down" />-->
<!-- </li>-->
<!-- <div style="clear: both;"></div>-->
<!-- <div class="tags_selection">-->
<!-- <div class="option">-->
<!-- <a href="javascript:void 0;">牙龈护理111</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">抛光</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">清洁</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">正畸专用</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">敏感</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">亮白</a>-->
<!-- </div>-->
<!-- <div style="clear: both;"></div>-->
<!-- </div>-->
<!-- </ul>-->
<!-- <ul>-->
<!-- <li>-->
<!-- <van-cell title="清洁类型" is-link arrow-direction="down" />-->
<!-- </li>-->
<!-- <div style="clear: both;"></div>-->
<!-- <div class="tags_selection">-->
<!-- <div class="option">-->
<!-- <a href="javascript:void 0;">牙龈护理111</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">抛光</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">清洁</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">正畸专用</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">敏感</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">亮白</a>-->
<!-- </div>-->
<!-- <div style="clear: both;"></div>-->
<!-- </div>-->
<!-- </ul>-->
<!-- <ul>-->
<!-- <li>-->
<!-- <van-cell title="清洁类型" is-link arrow-direction="down" />-->
<!-- </li>-->
<!-- <div style="clear: both;"></div>-->
<!-- <div class="tags_selection">-->
<!-- <div class="option">-->
<!-- <a href="javascript:void 0;">牙龈护理111</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">抛光</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">清洁</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">正畸专用</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">敏感</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">亮白</a>-->
<!-- </div>-->
<!-- <div style="clear: both;"></div>-->
<!-- </div>-->
<!-- </ul>-->
<!-- <ul>-->
<!-- <li>-->
<!-- <van-cell title="清洁类型" is-link arrow-direction="down" />-->
<!-- </li>-->
<!-- <div style="clear: both;"></div>-->
<!-- <div class="tags_selection">-->
<!-- <div class="option">-->
<!-- <a href="javascript:void 0;">牙龈护理111</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">抛光</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">清洁</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">正畸专用</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">敏感</a>-->
<!-- </div>-->
<!-- <div class="option ">-->
<!-- <a href="javascript:void 0;">亮白</a>-->
<!-- </div>-->
<!-- <div style="clear: both;"></div>-->
<!-- </div>-->
<!-- </ul>-->
<!-- <div style="clear: both;"></div>-->
<!-- <van-button size="large" style="height: 40px;margin-bottom: 15px;line-height: 40px;">清楚选项</van-button>-->
<!-- <div style="height:50px;"></div>-->
<!-- </div>-->
<!-- <div class="filterlayer_bottom_buttons">-->
<!-- <span class="filterlayer_bottom_button cancel">取消</span>-->
<!-- <span class="filterlayer_bottom_button confirm">确认</span>-->
<!-- </div>-->
<!-- </van-popup>-->
</div>
<van-list
v-model="loading"
:finished="finished"
finished-text="没有更多了"
@load="onLoad"
>
<div v-for="(product,i) in products" :key="i">
<product-card :product='product' @click="showProduct(product)" />
</div>
</van-list>
</div>
</template>
<script>
import searchtop from "../../components/search/searchtop";
import {getProductCondition, getProductPage} from "../../api/search";
export default {
components: {
searchtop
},
data() {
return {
page: 0,
pageSize: 10,
loading: false,
finished: false,
keyword: this.$route.params.keyword,
filterIndex: 0,
filterSort: false, // 是否展示几个【排序】
filterShow: false, // 是否展示【筛选】
sortField: undefined,
sortOrder: undefined,
products:[], // 搜索出的商品
categories: [], // 筛选的分类
categoryId: undefined, // 选中的分类编号
};
},
methods: {
onFilterBar(value) {
if (value === 0) {
this.filterSort = !this.filterSort;
this.filterShow = false;
} else if (value === 3) {
this.filterShow = !this.filterShow;
} else {
// 如果非合法 10、11、12
if (value !== 10
&& value !== 11
&& value !== 12) {
alert('暂不支持');
return;
}
// 设置 filterSort 和 filterIndex 属性
this.filterSort = false;
this.filterIndex = value;
// 标记加载中
this.loading = true;
// 根据 value 的值，设置 sortField、sortOrder
switch (value) {
case 10:
this.sortField = undefined;
this.sortOrder = undefined;
break;
case 11:
this.sortField = 'buyPrice';
this.sortOrder = 'desc';
break;
case 12:
this.sortField = 'buyPrice';
this.sortOrder = 'asc';
break;
}
// 根据排序，重新搜索
let page = 1;
getProductPage({
pageNo: page,
pageSize: this.pageSize,
keyword: this.keyword,
sortField: this.sortField,
sortOrder: this.sortOrder,
}).then(data => {
this.products = [];
this.handleData(page, data);
});
}
},
onCategoryClick(value) {
// 设置分类编号
this.categoryId = value;
// 隐藏弹出
this.filterShow = false;
// 根据分类，重新搜索
let page = 1;
getProductPage({
pageNo: page,
pageSize: this.pageSize,
keyword: this.keyword,
sortField: this.sortField,
sortOrder: this.sortOrder,
cid: this.categoryId,
}).then(data => {
this.products = [];
this.handleData(page, data);
});
},
showProduct(product){
this.$router.push('/product/'+product.id);
},
onSearch(keyword) {
this.loading = true;
// 设置 keyword
this.keyword = keyword;
// 重置其它字段
this.filterIndex = 0;
this.filterSort = false;
this.filterShow = false;
this.sortField = undefined;
this.sortOrder = undefined;
this.categoryId = undefined;
// 查询
let page = 1;
getProductPage({
pageNo: page,
pageSize: this.pageSize,
keyword: keyword,
}).then(data => {
this.products = [];
this.handleData(page, data);
this.loadSearchCondition();
});
},
onLoad() {
// debugger;
// 进入下一页
let page = this.page + 1;
getProductPage({
pageNo: page,
pageSize: this.pageSize,
keyword: this.keyword,
}).then(data => {
this.handleData(page, data);
this.loadSearchCondition();
});
},
handleData(page, data) {
this.loading = true;
// 设置下页面
this.page = page;
// 数据保存到 list 中
this.products.push(...data.list);
// 判断页数
if (this.products.length >= data.total) {
this.finished = true;
}
// 标记不在加载中
this.loading = false;
},
loadSearchCondition() {
getProductCondition({
keyword: this.keyword,
}).then(data => {
this.categories = data.categories;
});
}
},
mounted() {
}
};
</script>
<style lang="less">
.product-list{
.additional .price{
position: absolute;
bottom: 6px;
height: 34px;
}
}
.filterbar {
font-size: 14px;
position: relative;
ul {
width: 100%;
height: 40px;
}
li {
color: #999;
width: 25%;
float: left;
text-align: center;
height: 40px;
line-height: 40px;
border-bottom: 1px solid #eee;
i {
font-size: 12px;
margin-left: 2px;
}
.down {
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
}
.selected {
color: #e93b3d;
}
.show {
.down {
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg);
}
}
.item_options {
width: 100%;
position: absolute;
top: 41px;
background: #fff;
display: none;
z-index: 1;
li {
width: 100%;
text-align: left;
padding-left: 10px;
}
}
.item_options.show {
display: block;
}
.filterlayer {
width: 85%;
height: 100%;
background-color: #f7f7f7;
&_bottom {
&_buttons {
display: -webkit-box;
display: -webkit-flex;
display: flex;
z-index: 10;
position: absolute;
bottom: 0;
left: 0;
right: 0;
.cancel {
color: #333;
background-color: #fff;
box-shadow: 0 -1px 2px 0 rgba(0, 0, 0, 0.07);
}
.confirm {
color: #fff;
background-color: #e93b3d;
}
}
&_button {
-webkit-box-flex: 1;
-webkit-flex: 1;
flex: 1;
font-size: 16px;
height: 49px;
line-height: 49px;
text-align: center;
}
}
ul {
height: auto;
background: #fff;
margin-bottom: 15px;
}
li {
width: 100%;
text-align: left;
height: auto;
line-height: initial;
.van-cell{
font-size: 16px;
}
.big {
height: 25px;
max-width: 250px;
overflow: hidden;
font-size: 16px;
color: #333;
text-overflow: ellipsis;
margin-left: 10px;
}
}
.filterInner{
overflow-y: scroll;
max-height: 100%;
.van-button{
height: 40px;
margin-bottom: 15px;
line-height: 40px;
}
}
.tags_selection {
font-size: 14px;
text-align: center;
background-color: #fff;
position: relative;
margin: 0;
padding: 10px 0 0 10px;
.option {
box-sizing: border-box;
float: left;
width: 33.33%;
padding-right: 10px;
height: 30px;
line-height: 30px;
margin-bottom: 10px;
a {
position: relative;
display: block;
padding: 0 5px;
color: #666;
background-color: #f7f7f7;
border-radius: 4px;
overflow: hidden;
text-overflow: ellipsis;
height: 30px;
}
}
}
}
}
</style>
mobile-web/src/page/shipping/order.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div class="order">
<headerNav title="确认订单"/>
<van-cell
center
:border="false"
class="contact-card"
is-link
to="/user/address?id=2"
>
<template v-if="type === 'add'">
<strong>选择地址</strong>
</template>
<template v-else>
<strong>{{addressData.name}} {{addressData.mobile}}</strong>
<div>{{addressData.address}}</div>
</template>
</van-cell>
<div style="height:15px;"></div>
<!-- <div class="card" v-for="(product,i) in products" :key="i">-->
<!-- <product-card :product='product'/>-->
<!-- </div>-->
<div v-for="(itemGroup, i) in itemGroups" >
<div class="card" v-for="(item, j) in itemGroup.items" :key="j">
<product-card :product='convertProduct(item)'/>
</div>
<div style="height:15px;"></div>
</div>
<div style="height:15px;"></div>
<van-cell-group>
<van-field
label="留言"
type="textarea"
placeholder="请输入留言"
rows="1"
autosize
/>
</van-cell-group>
<div style="height:15px;"></div>
<!-- 优惠券单元格 -->
<van-coupon-cell
:coupons="coupons"
:chosen-coupon="chosenCoupon"
@click="showCouponPopup = true"
/>
<!-- 优惠券列表 -->
<van-popup v-model="showCouponPopup" position="bottom">
<van-coupon-list
:coupons="coupons"
:chosen-coupon="chosenCoupon"
:disabled-coupons="disabledCoupons"
@change="onCouponChange"
@exchange="onCouponExchange"
/>
</van-popup>
<div style="height:15px;"></div>
<van-cell-group class="total">
<van-cell title="商品总额" :value="fee.buyTotal / 100.0"/>
<van-cell title="运费" :value="+ fee.postageTotal / 100.0"/>
<van-cell title="折扣" :value="- fee.discountTotal / 100.0"/>
<van-cell title="实付金额" :value="fee.presentTotal / 100.0" style="font-weight: 700;"/>
</van-cell-group>
<div style="height:50px;"></div>
<van-submit-bar
:price="fee.presentTotal"
button-text="提交订单"
label='实付金额：'
@submit="onSubmit"
/>
</div>
</template>
<script>
import {
createOrder,
getOrderConfirmCreateOrder,
getCartConfirmCreateOrder,
createOrderFromCart
} from '../../api/order';
import {GetDefaultAddress} from '../../api/user';
import orderStore from '../../store/order';
import { Dialog } from 'vant';
export default {
data() {
return {
from: 'direct_order', // 目前有两个来源。direct_order：直接下单; card: 购物车下单。
// 如下两个参数，在直接下单时使用
skuId: this.$route.query.skuId,
quantity: this.$route.query.quantity,
type: "add",
addressData: {
},
// 商品 + 促销相关
itemGroups: [],
fee: {
originalTotal: undefined,
discountTotal: undefined,
postageTotal: undefined,
presentTotal: undefined,
},
// products: [], // 应该没用了
// 优惠劵相关
showCouponPopup: false,
coupons: [],
disabledCoupons: [],
chosenCoupon: -1,
};
},
methods: {
onCouponChange(index) {
// debugger;
let couponCardId = this.coupons[index].id;
if (this.from === 'direct_order') {
getOrderConfirmCreateOrder(this.skuId, this.quantity, couponCardId).then(data => {
// this.itemGroups = data.itemGroups;
this.fee = data.fee;
this.coupons[index].value = data.couponCardDiscountTotal; // 修改优惠劵减免的金额
})
} else if (this.from === 'cart') {
getCartConfirmCreateOrder(couponCardId).then(data => {
// this.itemGroups = data.itemGroups;
this.fee = data.fee;
this.coupons[index].value = data.couponCardDiscountTotal; // 修改优惠劵减免的金额
})
}
this.chosenCoupon = index;
this.showCouponPopup = false;
},
onCouponExchange(a, b, c) {
Dialog.alert({
title: '系统提示',
message: '暂未开发', // TODO 芋艿
});
},
onSubmit() {
const userAddressId = this.addressData.id;
if (!userAddressId) {
Dialog.alert({
title: '系统提示',
message: '请选择收获地址',
});
return;
}
const remark = '';
const couponCardId = this.chosenCoupon >= 0 ? this.coupons[this.chosenCoupon].id : undefined;
if (this.from === 'direct_order') {
const { skuId, quantity } = this.$route.query;
const orderItems = [{
skuId,
quantity,
couponCardId,
}];
createOrder({
orderItems,
userAddressId,
couponCardId,
remark,
}).then(result => {
if (result) {
// const { orderNo } = result;
// this.$router.push({ //核心语句
// path:`/order/success`, //跳转的路径
// query:{ //路由传参时push和query搭配使用 ，作用时传递参数
// ...result,
// }
// });
this.$router.push('/pay?appId=POd4RC6a&orderId=' + result.id + '&returnUrl=' + encodeURI('/user/order/info/' + result.id));
}
});
} else if (this.from === 'cart') {
createOrderFromCart(userAddressId, couponCardId, remark).then(result => {
if (result) {
// const { orderNo } = result;
// this.$router.push({ //核心语句
// path:`/order/success`, //跳转的路径
// query:{ //路由传参时push和query搭配使用 ，作用时传递参数
// ...result,
// }
// });
this.$router.push('/pay?appId=POd4RC6a&orderId=' + result.id + '&returnUrl=' + encodeURI('/user/order/info/' + result.id));
}
});
}
},
convertProduct(item) {
return {
...item.spu,
quantity: item.buyQuantity,
price: item.buyPrice || item.price,
sku: {
...item,
spu: undefined,
}
};
},
convertCouponList(cards) {
let newCards = [];
for (let i in cards) {
let card = cards[i];
newCards.push({
id: card.id,
name: card.title,
condition: '满 ' + card.priceAvailable / 100.0 + ' 元可用',
startAt: card.validStartTime / 1000,
endAt: card.validEndTime / 1000,
// description: '述信息，优惠券可用时展示',
reason: card.unavailableReason,
value: 0,
valueDesc: card.preferentialType === 1 ? card.priceOff / 100 : card.percentOff / 10.0,
unitDesc: card.preferentialType === 1 ? '元' : '折'
})
}
return newCards;
}
},
mounted: function() {
if (this.$store.state.addressData.name) {
this.type = 'add1';
} else {
this.type = 'add';
}
this.addressData = this.$store.state.addressData;
// 加载商品信息
// debugger;
if (this.from === 'direct_order') {
getOrderConfirmCreateOrder(this.skuId, this.quantity).then(data => {
this.itemGroups = data.itemGroups;
this.fee = data.fee;
// 获得优惠劵列表
this.coupons = this.convertCouponList(data.couponCards.filter(function (element) {
return element.available;
}));
this.disabledCoupons = this.convertCouponList(data.couponCards.filter(function (element) {
return !element.available;
}));
})
} else if (this.from === 'cart') {
getCartConfirmCreateOrder().then(data => {
this.itemGroups = data.itemGroups;
this.fee = data.fee;
// 获得优惠劵列表
this.coupons = this.convertCouponList(data.couponCards.filter(function (element) {
return element.available;
}));
this.disabledCoupons = this.convertCouponList(data.couponCards.filter(function (element) {
return !element.available;
}));
})
}
},
created() {
// 加载地址
GetDefaultAddress().then((result) => {
if (!this.addressData.name && result) {
this.type = 'add1';
this.addressData = result;
}
})
// 处理来源
if (this.$route.query.from === 'cart') {
this.from = this.$route.query.from;
}
},
store: orderStore,
};
</script>
<style lang="less">
.order {
font-size: 14px;
background: #f7f7f7;
.contact-card::before {
content: "";
left: 0;
right: 0;
bottom: 0;
height: 2px;
position: absolute;
background: -webkit-repeating-linear-gradient(
135deg,
#ff6c6c 0,
#ff6c6c 20%,
transparent 0,
transparent 25%,
#3283fa 0,
#3283fa 45%,
transparent 0,
transparent 50%
);
background: repeating-linear-gradient(
-45deg,
#ff6c6c 0,
#ff6c6c 20%,
transparent 0,
transparent 25%,
#3283fa 0,
#3283fa 45%,
transparent 0,
transparent 50%
);
background-size: 80px;
}
.total {
.van-cell__value {
color: red;
}
}
.van-submit-bar__bar {
border-top: 1px solid #f7f7f7;
}
.additional {
.van-cell {
padding: 0 15px;
font-size: 12px;
}
.van-cell__title {
flex: 11;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.van-tag {
line-height: 12px;
margin-right: 5px;
}
.price {
color: #e93b3d;
font-size: 10px;
span {
font-size: 16px;
}
}
}
}
</style>
mobile-web/src/page/user/address/edit.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div>
<headerNav title="修改地址"/>
<van-address-edit
:area-list="areaList"
:showDelete="showDelete"
show-set-default
@save="onSave"
@delete="onDelete"
:addressInfo="info"
/>
</div>
</template>
<script>
import areaList from '../../../data/area';
import {GetAddressById, SaveAddress, UpdateAddress, DelAddress} from "../../../api/user.js";
import {AddressEdit} from 'vant';
export default {
components: {
[AddressEdit.name]: AddressEdit,
},
data() {
return {
areaList,
showDelete: false,
info: {
},
}
},
methods: {
onSave(data) {
const params = {
...data,
address: data.addressDetail,
areaNo: data.areaCode,
city: data.city,
county: data.county,
country: data.country,
mobile: data.tel,
name: data.name,
hasDefault: data.isDefault ? 2 : 1,
};
if (data.id) {
UpdateAddress(params).then(response => {
this.$toast('更新成功');
this.$router.go(-1);
})
} else {
SaveAddress(params).then(response => {
this.$toast('保存成功');
this.$router.go(-1);
})
}
},
onDelete(data) {
const params = {
id: data.id,
};
DelAddress(params).then(response => {
this.$toast('删除成功');
this.$router.go(-1);
})
},
},
created: function () {
const id = this.$route.query.id;
if (id > 0) {
this.showDelete = true;
GetAddressById(id).then(response => {
this.info = {
...response,
addressDetail: response.address,
tel: response.mobile,
areaCode: response.areaNo,
isDefault: 0,
};
})
}
}
}
</script>
<style>
.van-picker__toolbar {
font-size: 16px;
}
</style>
mobile-web/src/page/user/address/list.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div>
<headerNav title="我的地址"/>
<van-address-list
v-model="chosenAddressId"
:class="isSelect?'':'hideselect'"
:list="list"
@add="onAdd"
@edit="onEdit"
@select="onSelect"
/>
</div>
</template>
<script>
import {GetAddressList} from "../../../api/user.js";
import { AddressList } from 'vant';
import eventBus from '../../eventBus';
import orderStore from '../../../store/order'
export default {
components: {
[AddressList.name]: AddressList,
},
data() {
return {
chosenAddressId: -1,
isSelect: false,
list: [],
}
},
methods: {
onAdd() {
this.$router.push('/user/address/edit')
},
onEdit(item, index) {
this.$router.push('/user/address/edit?id=' + item.id);
},
onSelect(item, index) {
if (!this.isSelect) {
return;
}
this.$store.commit('changeAddressData', {
...item
});
this.$router.go(-1);
}
},
created: function () {
this.chosenAddressId = this.$route.query.id;
this.isSelect = this.$route.query.id > 0;
GetAddressList().then(response => {
this.list = response.map(item => {
if (item.hasDefault == 2) {
this.chosenAddressId = item.id;
}
// convert data
return {
...item,
tel: item.mobile,
}
});
})
},
store: orderStore,
}
</script>
<style lang="less">
.hideselect {
.van-radio__input {
display: none;
}
}
</style>
mobile-web/src/page/user/aftersale/apply.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div style="font-size:12px;">
<headerNav title="申请售后"/>
<van-radio-group v-model="servicetype">
<van-cell-group>
<van-cell title="服务类型"/>
<van-cell title="退货/退款" clickable @click="servicetype = '1'">
<van-radio name="1"/>
</van-cell>
<van-cell title="退款" clickable @click="servicetype = '2'">
<van-radio name="2"/>
</van-cell>
</van-cell-group>
</van-radio-group>
<div style="margin-top: 10px;">
<product-card v-for="(product,i) in products" :key="i" :product='product'
iscard></product-card>
</div>
<van-cell-group style="margin-top: 10px;">
<van-cell title="申请原因" :label="remark" is-link @click="onClickShowPicker"/>
<van-field label="退款金额" placeholder="请输入金额" v-model="amount"
:error-message="'可退金额:'+maxamount" type='number'/>
<van-field
label="问题描述"
type="textarea"
v-model="describe"
placeholder="请您在此描述问题"
rows="3"
autosize
/>
<!--<van-cell class="uploader" style="font-size: 16px;">-->
<!--<van-uploader :after-read="onRead" accept="image/gif, image/jpeg" multiple>-->
<!--<van-icon name="photograph"/>-->
<!--</van-uploader>-->
<!--<div v-for="(image,i) in images" :key="image" class="uploader-image">-->
<!--<img :src="image"/>-->
<!--<van-icon name="close" @click="removeImage(i,image)"/>-->
<!--</div>-->
<!--</van-cell>-->
</van-cell-group>
<!--<van-cell-group style="margin-top: 10px;">-->
<!--<van-field label="联系人"/>-->
<!--<van-field label="联系电话"/>-->
<!--</van-cell-group>-->
<van-button @click="handleSubmit" size="large" type="primary" style="margin-top: 10px;">提交</van-button>
<!--<van-actionsheet v-model="showPicker">-->
<!--<van-picker show-toolbar-->
<!--title="申请原因" :columns="columns" @cancel="onCancel" @confirm="onConfirm"/>-->
<!--</van-actionsheet>-->
</div>
</template>
<script>
import {Toast} from 'vant';
import moment from 'moment';
import {getOrderInfo, getOrderReturnReason, orderReturnApply} from '../../../api/order';
export default {
data() {
return {
servicetype: '1',
showPicker: false,
remark: '不想要了',
describe: '',
amount: '50.50',
maxamount: '50.50',
images: [],
columnsData: [],
columns: ['我不想要了', '退运费', '少件/漏发', '未按约定时间发货', '发错货', '质量问题', '商品与页面描述不符', '商品损坏', '缺少件'],
products: [
{
id: 1,
imageURL:
"https://img10.360buyimg.com/mobilecms/s88x88_jfs/t17572/12/840082281/351445/e1828c58/5aab8dbbNedb77d88.jpg",
title: "良品铺子 肉肉聚汇猪肉脯 猪蹄卤 辣味小吃520g",
desc: "0.670kg/件，肉肉聚汇520g",
quantity: 2,
price: '50.5',
max: 2,
min: 0,
},
]
}
},
methods: {
onClickShowPicker() {
this.showPicker = true;
},
onCancel() {
this.showPicker = false;
},
onConfirm(value, index) {
this.remark = value;
this.showPicker = false;
},
onRead(file) {
if (file.length == undefined) {
this.images.push(file.content);
} else {
file.forEach(item => {
this.images.push(item.content);
});
}
},
removeImage(index, image) {
this.images.splice(index, 1);
},
handleSubmit() {
const {orderId} = this.$route.params;
const filterData = this.columnsData.filter(data => {
if (data.displayName == this.remark) {
return data;
}
});
const params = {
orderId,
returnType: this.servicetype,
reason: filterData[0].id,
describe: this.describe,
}
orderReturnApply(params).then(res => {
Toast('操作成功');
this.$router.go(-1);
})
},
},
mounted() {
const {orderId} = this.$route.params;
this.orderId = orderId;
getOrderInfo(orderId).then(res => {
const {buyPrice, discountPrice, orderItems} = res;
// 退还金额
const maxAmount = buyPrice - discountPrice / 100
this.amount = maxAmount;
this.maxamount = maxAmount;
this.products = orderItems.map(item => {
return {
...item,
picUrls: [item.skuImage],
}
});
});
// 获取订单 退款原因
getOrderReturnReason().then(res => {
this.columnsData = res;
this.columns = res.map(item => {
return item.displayName;
})
// 默认选中
this.remark = this.columns[0]
})
}
}
</script>
<style lang="less">
.uploader {
font-size: 16px;
.van-uploader {
float: left;
}
&-image {
margin-left: 10px;
position: relative;
height: 50px;
width: 50px;
border: 1px solid #e5e7ea;
float: left;
margin-top: 5px;
img {
width: 50px;
}
i {
position: absolute;
top: -6px;
right: -6px;
font-size: 8px;
}
}
}
</style>
mobile-web/src/page/user/aftersale/detail.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div>
<headerNav title="服务单详情"/>
<div v-if="serviceType === 1">
<van-steps :active="active">
<van-step>提交申请</van-step>
<van-step>客服审核</van-step>
<van-step>客户确认</van-step>
<van-step>仓库收货</van-step>
<van-step>完成</van-step>
</van-steps>
<van-cell class="logistics"
:to="`/user/aftersale/track/${lastLogisticsInfo.id}/${serviceNumber}`"
:title="lastLogisticsDetail.logisticsInformation"
:label="lastLogisticsDetail.logisticsTimeText" is-link/>
</div>
<div v-if="serviceType === 2">
<van-steps v-if="serviceType === 2" :active="active">
<van-step>提交申请</van-step>
<van-step>客服审核</van-step>
<van-step>客户确认</van-step>
<van-step>仓库收货</van-step>
<van-step>完成</van-step>
</van-steps>
</div>
<div style="height:15px;"></div>
<div v-for="(product,i) in products" :key="i">
<product-card :product='product'/>
</div>
<div style="height:15px;"></div>
<van-cell-group>
<van-cell title="服务单号" :value="serviceNumber"/>
<van-cell title="申请时间" :value="applyTime"/>
<van-cell title="服务类型" :value="serviceTypeText"/>
<van-cell title="退款金额" :value="refundPrice / 100"/>
</van-cell-group>
<div style="height:15px;"></div>
<!-- 暂时没有 -->
<!--<van-cell-group>-->
<!--<van-cell title="联系人" value="张三"/>-->
<!--<van-cell title="联系电话" value="138****6514"/>-->
<!--</van-cell-group>-->
</div>
</template>
<script>
import moment from 'moment';
import { getOrderReturnInfo } from '../../../api/order';
export default {
data() {
return {
active: 0,
serviceNumber: -1,
applyTime: '-1',
serviceType: '',
serviceTypeText: '',
refundPrice: 0,
lastLogisticsInfo: {},
lastLogisticsDetail: {},
products: [
{
imageURL: 'https://pop.nosdn.127.net/19e33c9b-6c22-4a4b-96da-1cb7afb32712',
title: 'BEYOND博洋家纺 床上套件 秋冬保暖纯棉床单被套 双人被罩 磨毛全棉印花床品四件套',
price: '499',
quantity: 2
},
]
}
},
mounted() {
const { orderId } = this.$route.params;
getOrderReturnInfo(orderId).then(res => {
console.log('getOrderReturnInfo success', res)
const { returnInfo, orderItems, lastLogisticsInfo } = res;
this.lastLogisticsInfo = lastLogisticsInfo
if (lastLogisticsInfo && lastLogisticsInfo.lastLogisticsDetail) {
const lastLogisticsDetail = lastLogisticsInfo.lastLogisticsDetail;
this.lastLogisticsDetail = {
...lastLogisticsDetail,
logisticsTimeText: moment(lastLogisticsDetail.logisticsTime).format("YYYY-MM-DD HH:mm"),
}
}
this.serviceType = returnInfo.serviceType
this.serviceTypeText = returnInfo.serviceTypeText
this.serviceNumber = returnInfo.serviceNumber
this.applyTime = moment(returnInfo.createTime).format("YYYY-MM-DD HH:mm")
this.refundPrice = returnInfo.refundPrice
this.products = orderItems.map(item => {
return {
...item,
title: item.skuName,
picUrls: [item.skuImage],
price: item.presentTotal,
}
})
})
},
}
</script>
<style>
</style>
mobile-web/src/page/user/aftersale/list.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div class="aftersale">
<headerNav title="售后"/>
<van-tabs >
<van-tab title="售后申请">
<van-panel v-for="(order,index) in orders" :key="index" :title="'订单号：'+order.ordercode" style="margin-top:10px;">
<div>
<product-card v-for="(product,i) in order.products" :key="i" :product='product' >
<div class="van-panel_product_footer">
<van-button size="small" type="danger" tag="a" :href="'#/user/aftersale/apply?id='+product.id" >申请售后</van-button>
</div>
</product-card>
</div>
</van-panel>
</van-tab>
<van-tab title="申请记录">
<van-panel v-for="(order,index) in orders" :key="index" :title="'服务单号：'+order.ordercode" style="margin-top:10px;">
<div>
<product-card v-for="(product,i) in order.products" :key="i" :product='product'/>
</div>
<div>
<van-cell title="已完成" :to="'/user/aftersale/detail?ordercode='+order.ordercode" is-link label="服务已完成，感谢您对京东的支持" style="background-color: #f8f8f8;" />
</div>
</van-panel>
</van-tab>
</van-tabs>
</div>
</template>
<script>
export default {
data(){
return{
orders:[
{
ordercode:'79340944225',
products: [
{
id:1,
imageURL:
"https://img10.360buyimg.com/N2/jfs/t21733/218/377678809/177209/1b98ae56/5b0b96e1Nc0e37080.jpg",
title: "子初婴儿手口柔湿巾90片*3包 新生儿纸巾 宝宝婴儿湿巾",
quantity: 2
},
]
},
{
ordercode:'79341094465',
products: [
{
id:1,
imageURL:
"https://img10.360buyimg.com/mobilecms/s88x88_jfs/t22720/128/1410375403/319576/8dbd859f/5b5e69b3Nf4f0e9e7.jpg",
title: "元朗 鸡蛋卷 饼干糕点 中秋礼盒 广东特产680g",
desc: "1.320kg/件",
quantity: 1,
},
]
},
{
ordercode:'79341094462',
products: [
{
id:1,
imageURL:
"https://img10.360buyimg.com/mobilecms/s88x88_jfs/t17572/12/840082281/351445/e1828c58/5aab8dbbNedb77d88.jpg",
title: "良品铺子 肉肉聚汇猪肉脯 猪蹄卤 辣味小吃520g",
desc: "0.670kg/件，肉肉聚汇520g",
quantity: 2
},
{
id:1,
imageURL:
"https://img10.360buyimg.com/mobilecms/s88x88_jfs/t22720/128/1410375403/319576/8dbd859f/5b5e69b3Nf4f0e9e7.jpg",
title: "元朗 鸡蛋卷 饼干糕点 中秋礼盒 广东特产680g",
desc: "1.320kg/件",
quantity: 1,
},
]
},
],
}
}
}
</script>
<style lang="less">
.aftersale{
font-size:12px;background: #f0f2f5;
.van-panel{
margin-top: 10px;
&_product_footer{
text-align: right;padding: 0 10px 15px;
}
}
}
</style>
mobile-web/src/page/user/aftersale/track.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div style="background: #f7f7f7;">
<headerNav title="进度详情"/>
<van-cell-group>
<van-cell title="服务单号" :value="serviceNumber"/>
</van-cell-group>
<van-steps direction="vertical" :active="0" active-color="#f60" style="margin-top: 15px;">
<van-step v-for="(item, itemIndex) in details" :key="detailIndex">
<h3>{{item.logisticsInformation}}</h3>
<p>{{item.logisticsTimeText}}</p>
</van-step>
</van-steps>
</div>
</template>
<script>
import moment from 'moment';
import { getLogisticsInfo } from '../../../api/order';
export default {
data() {
return {
serviceNumber: '',
details: [],
}
},
mounted() {
console.log(this.$route.params)
const { id, serviceNumber } = this.$route.params;
this.serviceNumber = serviceNumber
getLogisticsInfo(id).then(res => {
const { details } = res;
this.details = details.map(item => {
return {
...item,
logisticsTimeText: moment(item.logisticsTime).format("YYYY-MM-DD HH:mm")
}
})
})
},
}
</script>
<style>
</style>
mobile-web/src/page/user/favorite/list.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div>
<headerNav title="我的收藏"/>
<van-list
v-model="loading"
:finished="finished"
@load="onLoad"
>
<div v-for="(item,index) in list" :key="index">
<van-swipe-cell :right-width="65" :on-close="onClose(item)">
<van-card
:price="formatPrice(item.price)"
:desc="item.sellPoint"
:title="item.spuName"
:thumb="item.spuImage"
@click="skipProductSpuInfo(item.spuId)"
>
</van-card>
<template slot="right">
<van-button square type="danger" text="删除"/>
</template>
</van-swipe-cell>
</div>
</van-list>
</div>
</template>
<script>
import {GetFavoritePage, DelFavorite} from "../../../api/user.js";
export default {
data() {
return {
loading: false,
finished: false,
list: [],
page: 0,
pageSize: 10
}
},
methods: {
formatPrice(data) {
return (data / 100).toFixed(2);
},
skipProductSpuInfo(data) {
// return getProductSpuInfo(data);
this.$router.push('/product/'+data);
},
onClose(item) {
return function (clickPosition, instance) {
switch (clickPosition) {
case 'left':
case 'cell':
case 'outside':
instance.close();
break;
case 'right':
this.$dialog.confirm({
message: '确定删除吗？'
}).then(() => {
DelFavorite(item.spuId).then(response => {
this.$toast('删除成功');
this.$router.go(0);
})
instance.close();
}).catch(() => {
// on cancel
});
break;
}
}
},
onLoad() {
let pageNo = this.page + 1;
GetFavoritePage(pageNo, this.pageSize).then(response => {
this.page = pageNo;
this.list.push(...response.list);
// response.list.forEach(item => {
// this.list.push(item);
// });
this.loading = false;
if (this.list.length >= response.total) {
this.finished = true;
}
})
}
},
}
</script>
<style lang="less">
.van-swipe-cell {
&__left,
&__right {
color: #FFFFFF;
font-size: 15px;
width: 65px;
height: 100px;
display: inline-block;
text-align: center;
line-height: 100px;
background-color: #F44;
}
}
</style>
mobile-web/src/page/user/index.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div>
<div class="user-profile">
<div class="user-profile-avatar">
<a href="/#/user/info">
<img :src="user && user.avatar ? user.avatar : 'http://static.iocoder.cn/1553652151601.jpg?imageView2/2/w/308/h/210/interlace/1/q/100'">
</a>
</div>
<div class="user-profile-username">
<a href="/#/user/info">
<span class="m-nick">{{user ? user.nickname : '未登陆'}}</span>
</a>
</div>
</div>
<van-cell-group class="user-group">
<van-cell title="我的订单" value="查看全部订单" is-link to="/user/order"/>
<van-row class="user-links">
<router-link to="/user/order/1">
<van-col span="6">
<van-icon name="pending-payment">
<van-info :info="data.UnPayTotal" />
</van-icon>
<div>待付款</div>
</van-col>
</router-link>
<router-link to="/user/order/2">
<van-col span="6">
<van-icon name="logistics">
<van-info :info="data.UnRecieveTotal" />
</van-icon>
<div>待发货</div>
</van-col>
</router-link>
<router-link to="/user/order/2">
<van-col span="6">
<van-icon name="point-gift">
</van-icon>
<div>已完成</div>
</van-col>
</router-link>
<router-link to="/user/aftersale">
<van-col span="6">
<van-icon name="after-sale" >
<van-info :info="data.AfterSaleTotal" />
</van-icon>
<div>售后</div>
</van-col>
</router-link>
</van-row>
</van-cell-group>
<van-cell-group class="user-group">
<van-cell title="我的服务" />
<van-row class="user-links">
<router-link to="/user/coupon">
<van-col span="6">
<van-icon name="coupon" />
<div>我的优惠券</div>
</van-col>
</router-link>
<router-link to="/user/favorite">
<van-col span="6">
<van-icon name="like-o" />
<div>我的收藏</div>
</van-col>
</router-link>
<router-link to="/user/address">
<van-col span="6" >
<van-icon name="location"/>
<div>收货地址</div>
</van-col>
</router-link>
</van-row>
</van-cell-group>
<van-cell-group>
<van-cell v-if="user" title="退出登录" @click="logout" />
<van-cell v-else title="登陆" is-link to="/login" />
</van-cell-group>
<navigate />
</div>
</template>
<script>
// import { GetUserIndex } from "../../api/user.js";
import { getAccessToken, clearLoginToken } from '../../utils/cache.js';
import { getUserInfo } from '../../api/user.js';
export default {
data(){
return{
data: {},
user: undefined,
}
},
components: {
},
methods: {
logout: function () {
// 清空本地 token
clearLoginToken();
// TODO 芋艿，后面最好处理下 token
// 跳转到登陆
this.$router.push('/login');
}
},
created:function(){
// GetUserIndex().then(response=>{
// this.data=response;
// });
},
mounted() {
if (getAccessToken()) { // 存在
let response = getUserInfo();
response.then(data => {
this.user = data;
});
}
}
};
</script>
<style lang="less">
.user {
&-profile {
text-align: center;
display: block;
width: 100%;
height: 141px;
background-color: #f1f5fa;
background-repeat: no-repeat;
background-size: 100% 100%;
img{
width: 100%;
}
&-avatar{
padding-top: 23px;
padding-bottom: 5px;
img{
width: 65px;
height: 65px;
border-radius: 50%;
overflow: hidden;
}
}
&-username{
font-size: 20px;
}
}
&-group {
margin-bottom: .3rem;
.van-cell__value{
color: #999;
font-size: 12px;
}
}
&-links {
padding: 15px 0;
font-size: 12px;
text-align: center;
background-color: #fff;
.van-icon {
position: relative;
width: 24px;
font-size: 24px;
}
}
}
</style>
\ No newline at end of file
mobile-web/src/page/user/info/detail.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div>
<headerNav title="个人信息"/>
<van-cell-group title="基础资料">
<!--<van-cell title="修改个人信息" is-link />-->
<!--<van-cell title="修改登录密码" is-link />-->
<!--<van-cell title="修改绑定手机" is-link />-->
<!--<van-cell title="关联账号" is-link />-->
<!--<van-cell title="切换账号" is-link to="/login" />-->
<van-cell title="昵称" :value="user.nickname" @click="onShowNicknameDialog" />
<van-cell title="头像" @click="onShowAvatarDialog" >
<img width="24px" :src="user.avatar" >
</van-cell>
</van-cell-group>
<van-cell-group title="密保资料">
<van-cell title="手机号" :value="user.mobile" />
</van-cell-group>
<!-- 昵称修改弹出 -->
<van-dialog
v-model="showNicknameDialog"
:before-close="onShowNicknameDialogClose"
show-cancel-button
>
<van-field
:value="user.nickname"
label="昵称"
placeholder="请输入昵称"
@input="inputNickname"
/>
</van-dialog>
<!---->
</div>
</template>
<script>
import { getUserInfo, doUserUpdateNickname } from '../../../api/user.js';
import { Dialog } from 'vant';
export default {
data() {
return {
user: {},
showNicknameDialog: false,
updateNickname: undefined,
};
},
methods: {
onShowNicknameDialog: function () {
this.showNicknameDialog = true;
this.updateNickname = this.user.nickname;
},
inputNickname: function (value) {
this.updateNickname = value;
},
onShowNicknameDialogClose: function (action, done) {
if (action === 'confirm') {
let that = this;
let response = doUserUpdateNickname(this.updateNickname);
response.then(data => {
// 修改
that.user.nickname = that.updateNickname;
// 关闭弹窗
done();
});
} else {
done();
}
},
onShowAvatarDialog: function () {
// TODO 芋艿，头像上传
alert('头像上传暂未开发');
}
},
mounted() {
let response = getUserInfo();
response.then(data => {
this.user = data;
});
}
}
</script>
<style>
</style>
mobile-web/src/page/user/order/info.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div style="background: #f7f7f7;">
<headerNav title="订单详情"/>
<van-steps :active="active">
<van-step>提交订单</van-step>
<van-step>配送中</van-step>
<van-step>交易完成</van-step>
</van-steps>
<van-cell v-if="orderInfo.status >= 2 "
class="logistics"
:to="`/user/order/logistics/${orderInfo.id}`"
:title="latestLogisticsDetail.logisticsInformation"
:label="latestLogisticsDetail.logisticsTimeText"
icon="logistics"
is-link
/>
<div style="height:15px;"></div>
<van-cell-group>
<van-cell
center
:border="false"
>
<template>
<div>{{recipient.name}} {{recipient.mobile}}</div>
<div>{{recipient.address}}</div>
</template>
</van-cell>
</van-cell-group>
<div style="height:15px;"></div>
<div v-for="(product,i) in products" :key="i">
<product-card :product='product'/>
</div>
<div style="height:15px;"></div>
<van-cell-group>
<van-cell title="订单编号" :value="orderInfo.orderNo"/>
<van-cell title="下单时间" :value="orderInfo.createTimeText"/>
<van-cell title="订单状态" :value="orderInfo.statusText"/>
</van-cell-group>
<div style="height:15px;"></div>
<van-cell-group class="total">
<van-cell title="商品总额" :value="orderInfo.buyPrice / 100.0"/>
<van-cell title="运费" :value="'+' + orderInfo.logisticsPrice / 100.0"/>
<van-cell title="折扣" :value="- orderInfo.discountPrice / 100.0"/>
<van-cell title="实付金额" :value="orderInfo.presentPrice / 100.0" style="font-weight: 700;"/>
</van-cell-group>
<div class="footer">
<div class="munu">
<router-link v-if="orderInfo.hasOrderReturn === -1 " :to="'/user/aftersale/apply/'+orderId">
<van-button size="small">申请售后</van-button>
</router-link>
<router-link v-if="orderInfo.hasOrderReturn !== -1" :to="'/user/aftersale/detail/'+orderId">
<van-button size="small">查看进度</van-button>
</router-link>
<van-button v-if="orderInfo.status === 3 " size="small" v-on:click="clickConfirmReceiving(orderId)">确认收货</van-button>
<van-button v-if="orderInfo.status === 1 " size="small" type="danger" @click="goPay(orderInfo.id)">支付</van-button>
</div>
</div>
</div>
</template>
<script>
import moment from 'moment';
import { getOrderInfo, confirmReceiving } from '../../../api/order';
export default {
data() {
return {
active: 0,
orderId: 0,
orderInfo: {},
recipient: {},
latestLogisticsDetail: {},
products: [
{
imageURL: 'https://pop.nosdn.127.net/19e33c9b-6c22-4a4b-96da-1cb7afb32712',
title: 'BEYOND博洋家纺 床上套件 秋冬保暖纯棉床单被套 双人被罩 磨毛全棉印花床品四件套',
price: '499',
quantity: 2
},
]
}
},
methods: {
clickConfirmReceiving(orderId) {
confirmReceiving(orderId).then(res => {
this.queryOrderPage(this.queryParams)
})
},
goPay(itemId) {
this.$router.push('/pay?appId=POd4RC6a&orderId=' + itemId + '&returnUrl=' + encodeURI('/user/order/info/' + itemId));
},
},
mounted() {
const { id } = this.$route.params;
this.orderId = id;
getOrderInfo(id).then(res => {
const { status, recipient, latestLogisticsDetail, orderItems} = res;
// 提交订单、配送中、交易成功
if ([1, 2].indexOf(status) !== -1) {
this.active = 0
} else if (status === 3) {
this.active = 1
} else if (status >= 4) {
this.active = 2
}
// 收件人信息
this.recipient = recipient;
// 订单info
this.orderInfo = {
...res,
createTimeText: moment(res.createTime).format("YYYY-MM-DD HH:mm"),
};
// 最新物流信息
let logisticsTimeText = '';
if (latestLogisticsDetail) {
logisticsTimeText = moment(latestLogisticsDetail.logisticsTime).format("YYYY-MM-DD HH:mm");
}
this.latestLogisticsDetail = {
...latestLogisticsDetail,
logisticsTimeText: logisticsTimeText,
}
this.products = orderItems.map(item => {
return {
...item,
picUrls: [item.skuImage],
}
})
})
}
}
</script>
<style lang="less">
.logistics {
margin-top: 15px;
i {
line-height: 60px;
font-size: 20px;
}
.van-cell__title span {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.van-cell__label {
color: #999;
}
}
.total {
.van-cell__value {
color: red;
}
}
.footer {
height: 50px;
.munu {
position: fixed;
height: 49px;
border-top: 1px solid #e5e5e5;
bottom: 0;
background: #fff;
width: 100%;
line-height: 24px;
text-align: right;
.van-button {
margin-right: 10px;
}
}
}
</style>
mobile-web/src/page/user/order/list.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div>
<headerNav title="我的订单"/>
<van-tabs v-model="active" @change="onTabChange">
<van-tab title="全部"></van-tab>
<van-tab title="待付款"></van-tab>
<van-tab title="待收货"></van-tab>
<van-tab title="已完成"></van-tab>
<van-tab title="已取消"></van-tab>
</van-tabs>
<div v-for="(item,index) in list" :key="index">
<van-cell-group class="order-item">
<van-panel :title="'订单：'+item.ordercode" :status="['', '代付款', '待发货', '待收货', '已完成', '已关闭'][item.state]">
<div slot="header">
<van-cell class="title" :title="'订单：'+item.ordercode" :value="item.state"
:to="'/user/order/info/'+item.orderid"/>
</div>
<div>
<router-link :to="'/user/order/info/'+item.orderid">
<div v-if="item.products.length==1" v-for="(product,i) in item.products" :key="i">
<product-card :product='product'/>
</div>
<div v-if="item.products.length > 0" class="more">
<div class="item" v-for="(product,i) in item.products" :key="i">
<div class="products-item">
<img :src="product.imageURL"/>
<span class="product-title">{{product.title}}</span>
<!--<span class="product-title">￥{{product.price / 100}} x{{product.quantity}}</span>-->
</div>
</div>
</div>
</router-link>
</div>
<div slot="footer" class="footer">
<span class="total">总价：{{item.presentPrice / 100}} 元</span>
<router-link :to="'/user/order/logistics/'+item.orderid">
<van-button v-if="[3,4,5].indexOf(item.status) != -1" size="small">查看物流</van-button>
</router-link>
<van-button v-if="item.status === 3 " size="small" v-on:click="clickConfirmReceiving(item)">确认收货</van-button>
<van-button v-if="item.status === 1 " size="small" type="danger" @click="goPay(item.orderid)">
支付
</van-button>
<router-link :to="'/user/aftersale/apply/'+item.orderid">
<van-button v-if="item.status !== 1 && item.status !== 5" size="small" type="danger">
申请售后
</van-button>
</router-link>
</div>
</van-panel>
</van-cell-group>
</div>
</div>
</template>
<script>
import {getOrderPage, confirmReceiving} from '../../../api/order';
export default {
components: {},
data() {
return {
active: 0,
list: [],
row: {},
}
},
methods: {
goPay(itemId) {
this.$router.push('/pay?appId=POd4RC6a&orderId=' + itemId + '&returnUrl=' + encodeURI('/user/order/info/' + itemId));
},
onTabChange(index) {
// status 和 tab index 对应的关系
const statusArray = [null, 1, 3, 4, 5];
// if (index === 0) {
// // 全部
// } else if (index === 1) {
// // 待付款 1
// } else if (index === 2) {
// // 待收货 3
// } else if (index === 3) {
// // 已完成 4
// } else if (index === 4) {
// // 取消 5
// }
this.queryOrderPage({
status: statusArray[index],
})
},
queryOrderPage(params) {
this.queryParams = params;
const statusArray = ['', '待付款', '待发货', '待收货', '已完成', '已关闭']
getOrderPage({
pageNo: 0,
pageSize: 10,
...params,
}).then(data => {
const {orders} = data;
const list = orders.map(order => {
const {orderItems} = order;
const products = orderItems.map(order => {
return {
imageURL: order.skuImage,
title: order.skuName,
price: order.price,
quantity: order.quantity,
};
});
return {
orderid: order.id,
ordercode: order.orderNo,
state: `${statusArray[order.status]}`,
status: order.status,
products,
presentPrice: order.presentPrice,
};
});
this.list = list;
// console.log('list', list)
});
},
clickConfirmReceiving({ orderid }) {
confirmReceiving(orderid).then(res => {
this.queryOrderPage(this.queryParams)
})
},
},
mounted() {
this.queryOrderPage()
},
}
</script>
<style lang="less">
.order-item {
margin-bottom: 10px;
font-size: 12px;
.title {
border-bottom: 1px solid #e5e5e5;
.van-cell__title {
flex: 2;
}
.van-cell__value {
color: red;
}
}
.van-panel__footer {
text-align: right;
border-bottom: 1px solid #e5e5e5;
}
.footer {
display: block;
height: 30px;
}
.van-button {
margin-left: 5px;
}
.total {
position: absolute;
top: 17px;
left: 15px;
font-size: 13px;
}
.more {
overflow-x: scroll;
white-space: nowrap;
-webkit-overflow-scrolling: touch;
margin: 5px 0 5px 15px;
.item {
width: 90px;
height: 90px;
margin-right: 10px;
display: inline-block;
img {
width: 100%;
}
}
}
.products-item {
/*display: flex;*/
/*flex-direction: row;*/
.product-title {
justify-items: center;
margin: 10px;
}
}
}
</style>
mobile-web/src/page/user/order/logistics.vue deleted 100644 → 0
浏览文件 @ 6d1a47af
<template>
<div style="background: #f7f7f7;">
<headerNav title="订单追踪"/>
<van-cell-group>
<van-cell title="订单编号" value="18081609422771742"/>
</van-cell-group>
<van-tabs>
<van-tab v-for="(item, index) in logistics" :key="index" :title="'包裹' + (index + 1)">
<van-cell-group>
<van-cell title="快递方式" :value="item.logisticsText"/>
<van-cell title="快递单号" :value="item.logisticsNo"/>
</van-cell-group>
<van-steps direction="vertical" :active="0" active-color="#f60" style="margin-top: 15px;">
<van-step v-for="(detail, detailIndex) in item.details" :key="detailIndex">
<h3>{{detail.logisticsInformation}}</h3>
<p>{{detail.logisticsTimeText}}</p>
</van-step>
</van-steps>
</van-tab>
</van-tabs>
</div>
</template>
<script>
import { getOrderLogisticsInfo } from '../../../api/order';
export default {
data() {
return {
orderId: '',
orderNo: '',
logistics: [],
}
},
mounted() {
const { id } = this.$route.params;
getOrderLogisticsInfo({
orderId: id,
}).then(res => {
const { orderId, orderNo, logistics } = res;
this.orderId = orderId;
this.orderNo = orderNo;
this.logistics = logistics;
})
},
}
</script>
<style>
</style>
mobile-web/src/store/order.js deleted 100644 → 0
浏览文件 @ 6d1a47af
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex);
// 挂载
export default new Vuex.Store({
state: {
addressData: {
},
},
mutations: {
changeAddressData: function (state, payload) {
state.addressData = payload;
}
},
actions: {
},
getters: {
}
});
mobile-web/src/utils/cache.js deleted 100644 → 0
浏览文件 @ 6d1a47af
/* eslint-disable */
// localStorage 操作
const cacheKeys = {
ACCESS_TOKEN: 'accessToken',
REFRESH_TOKEN: 'refreshToken',
};
///
/// 设置 loginToken，分为 accessToken 和 refreshToken
export function checkLogin() {
let accessToken = getAccessToken();
return accessToken && accessToken.length > 0;
}
export function setLoginToken(accessToken, refreshToken) {
setLocalStorage(cacheKeys.ACCESS_TOKEN, accessToken);
setLocalStorage(cacheKeys.REFRESH_TOKEN, refreshToken);
}
export function getLoginToken() {
const res = {};
res[cacheKeys.ACCESS_TOKEN] = getLocalStorage(cacheKeys.ACCESS_TOKEN);
res[cacheKeys.REFRESH_TOKEN] = getLocalStorage(cacheKeys.REFRESH_TOKEN);
return res;
}
export function clearLoginToken() {
removeLocalStorage(cacheKeys.ACCESS_TOKEN);
removeLocalStorage(cacheKeys.REFRESH_TOKEN);
}
export function getAccessToken() {
return getLocalStorage(cacheKeys.ACCESS_TOKEN);
}
export function getRefreshToken() {
return getLocalStorage(cacheKeys.REFRESH_TOKEN);
}
///
/// 设置 localStorage 公共方法
function setLocalStorage(key, value) {
try {
localStorage.setItem(key, value);
} catch (e) {
throw new Error(`localStorage 设置错误! ${e}`);
}
}
function getLocalStorage(key) {
try {
return localStorage.getItem(key);
} catch (e) {
throw new Error(`localStorage 获取错误! ${e}`);
}
}
function removeLocalStorage(key) {
try {
localStorage.removeItem(key);
} catch (e) {
throw new Error(`localStorage 设置错误! ${e}`);
}
}
mobile-web/src/utils/date.js deleted 100644 → 0
浏览文件 @ 6d1a47af
// TODO 临时代码
export function formatDate(date, pattern) {
if (!(date instanceof Date)) {
date = new Date(date);
}
if (pattern === 'yyyy-MM-dd') {
let d = date.getDate();
let m = date.getMonth() + 1; //Month from 0 to 11
let y = date.getFullYear();
return '' + y + '-' + (m <= 9 ? '0' + m : m) + '-' + (d <= 9 ? '0' + d : d);
} else {
return '暂不支持';
}
}
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论