first commit
1
node+vue/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
57af376b-3727-4a55-8a3f-c18b14882356
|
||||
1
node+vue/shop-bend/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
977e97ad-3d32-417a-8112-4cc8fccb6164
|
||||
58
node+vue/shop-bend/app.js
Executable file
@@ -0,0 +1,58 @@
|
||||
var createError = require('http-errors');
|
||||
var express = require('express');
|
||||
var cookieParser = require('cookie-parser');
|
||||
var logger = require('morgan');
|
||||
var config = require('./config');
|
||||
|
||||
// 导入路由
|
||||
var CartRouter = require('./routes/cart');
|
||||
var OrderRouter = require('./routes/order');
|
||||
var ShopRouter = require('./routes/shop');
|
||||
var UserRouter = require('./routes/user');
|
||||
|
||||
var app = express();
|
||||
// 跨域请求头设置
|
||||
app.all("*", function (req, res, next) {
|
||||
res.header("Access-Control-Allow-Origin", "*");
|
||||
res.header(
|
||||
"Access-Control-Allow-Headers",
|
||||
"Content-Type,token,Content-Length, Authorization, Accept,X-Requested-With"
|
||||
);
|
||||
res.header("Access-Control-Allow-Methods", "PUT,POST,GET,DELETE,OPTIONS");
|
||||
res.header("X-Powered-By", "bmy");
|
||||
if (req.method == "OPTIONS") res.sendStatus(200);
|
||||
else next();
|
||||
});
|
||||
|
||||
// 中间件设置
|
||||
app.use(logger('dev'));
|
||||
// 设置 HTTP请求的大小限制 为100mb
|
||||
app.use(express.json({
|
||||
limit: config.dev.httpSize
|
||||
}));
|
||||
app.use(express.urlencoded({ limit: config.dev.httpSize, extended: false }));
|
||||
app.use(cookieParser());
|
||||
|
||||
// 配置挂载路由
|
||||
app.use('/api/json/shop/', ShopRouter);
|
||||
app.use('/api/json/user/', UserRouter);
|
||||
app.use('/api/json/cart/', CartRouter)
|
||||
app.use('/api/json/order/', OrderRouter)
|
||||
|
||||
// 捕捉404错误
|
||||
app.use(function (req, res, next) {
|
||||
next(createError(404));
|
||||
});
|
||||
|
||||
// 错误处理
|
||||
app.use(function (err, req, res, next) {
|
||||
// set locals, only providing error in development
|
||||
res.locals.message = err.message;
|
||||
res.locals.error = req.app.get('env') === 'development' ? err : {};
|
||||
|
||||
// render the error page
|
||||
res.status(err.status || 500);
|
||||
|
||||
});
|
||||
|
||||
module.exports = app;
|
||||
1
node+vue/shop-bend/bin/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
44ccb1d1-5187-42b2-a1ef-586343d71f3c
|
||||
90
node+vue/shop-bend/bin/www
Executable file
@@ -0,0 +1,90 @@
|
||||
#!/usr/bin/env node
|
||||
|
||||
/**
|
||||
* Module dependencies.
|
||||
*/
|
||||
|
||||
var app = require('../app');
|
||||
var debug = require('debug')('shop-bend:server');
|
||||
var http = require('http');
|
||||
var config = require('./../config')
|
||||
/**
|
||||
* Get port from environment and store in Express.
|
||||
*/
|
||||
|
||||
var port = normalizePort(process.env.PORT || config.dev.port);
|
||||
app.set('port', port);
|
||||
|
||||
/**
|
||||
* Create HTTP server.
|
||||
*/
|
||||
|
||||
var server = http.createServer(app);
|
||||
|
||||
/**
|
||||
* Listen on provided port, on all network interfaces.
|
||||
*/
|
||||
|
||||
server.listen(port);
|
||||
server.on('error', onError);
|
||||
server.on('listening', onListening);
|
||||
|
||||
/**
|
||||
* Normalize a port into a number, string, or false.
|
||||
*/
|
||||
|
||||
function normalizePort(val) {
|
||||
var port = parseInt(val, 10);
|
||||
|
||||
if (isNaN(port)) {
|
||||
// named pipe
|
||||
return val;
|
||||
}
|
||||
|
||||
if (port >= 0) {
|
||||
// port number
|
||||
return port;
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
/**
|
||||
* Event listener for HTTP server "error" event.
|
||||
*/
|
||||
|
||||
function onError(error) {
|
||||
if (error.syscall !== 'listen') {
|
||||
throw error;
|
||||
}
|
||||
|
||||
var bind = typeof port === 'string'
|
||||
? 'Pipe ' + port
|
||||
: 'Port ' + port;
|
||||
|
||||
// handle specific listen errors with friendly messages
|
||||
switch (error.code) {
|
||||
case 'EACCES':
|
||||
console.error(bind + ' requires elevated privileges');
|
||||
process.exit(1);
|
||||
break;
|
||||
case 'EADDRINUSE':
|
||||
console.error(bind + ' is already in use');
|
||||
process.exit(1);
|
||||
break;
|
||||
default:
|
||||
throw error;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Event listener for HTTP server "listening" event.
|
||||
*/
|
||||
|
||||
function onListening() {
|
||||
var addr = server.address();
|
||||
var bind = typeof addr === 'string'
|
||||
? 'pipe ' + addr
|
||||
: 'port ' + addr.port;
|
||||
console.log(`Api is run this: ${config.dev.ipAddress}:${config.dev.port}`);
|
||||
}
|
||||
1
node+vue/shop-bend/cache/.pydio
vendored
Normal file
@@ -0,0 +1 @@
|
||||
c4e4d830-303d-4c00-bb1f-c77d83c90ba3
|
||||
37
node+vue/shop-bend/cache/index.js
vendored
Executable file
@@ -0,0 +1,37 @@
|
||||
const redis = require("redis");
|
||||
const config = require("../config");
|
||||
|
||||
class Redis {
|
||||
constructor() {
|
||||
// 创建redis服务
|
||||
this.client = redis.createClient(config.dev.redis.port, config.dev.redis.host);
|
||||
// 监听错误
|
||||
this.client.on("error", function (err) {
|
||||
console.log("redis 连接失败:" + err);
|
||||
});
|
||||
}
|
||||
/**
|
||||
* 设置缓存值
|
||||
* @param {*string} key 名称
|
||||
* @param {*string} value 数值
|
||||
*/
|
||||
Set(key, value) {
|
||||
this.client.set(key, JSON.stringify(value), redis.print)
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取缓存数值
|
||||
* @param {*string} key 名称
|
||||
*/
|
||||
Get(key) {
|
||||
return new Promise((resolve, reject) => {
|
||||
this.client.expire(key, config.dev.redis.timeout);
|
||||
this.client.get(key, function (error, result) {
|
||||
if (error) reject(error)
|
||||
resolve(JSON.parse(result))
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = new Redis()
|
||||
1
node+vue/shop-bend/config/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
8c41a9e9-d24a-4e24-8b98-acdc9d2838f2
|
||||
57
node+vue/shop-bend/config/index.js
Executable file
@@ -0,0 +1,57 @@
|
||||
const config = {
|
||||
dev: {
|
||||
port: 3080, // 端口配置,网站上线服务器后改这个为 80端口
|
||||
ipAddress: "http://127.0.0.1",
|
||||
httpSize: "100mb",
|
||||
api: {
|
||||
success: 200, //网络请求成功
|
||||
error: 404, // 网络请求失败
|
||||
CodeError: 500 // 服务器内部错误或者异常
|
||||
},
|
||||
// 公私钥地址
|
||||
rsa: {
|
||||
privateKey: "../config/rsa_private_key.pem",
|
||||
publicKey: "../config/rsa_public_key.pem",
|
||||
},
|
||||
// mysql 数据库连接信息
|
||||
mysql: {
|
||||
host: '127.0.0.1',
|
||||
user: 'root',
|
||||
password: 'root',
|
||||
database: 'shop'
|
||||
},
|
||||
// redis 连接配置信息
|
||||
redis: {
|
||||
host: "127.0.0.1",
|
||||
port: "6379",
|
||||
timeout: 60
|
||||
},
|
||||
// 后端各api接口的sql语句
|
||||
sql: {
|
||||
shop: {
|
||||
index: "select * from shop_commodity ORDER BY id DESC limit ?,?",
|
||||
info: "select * from shop_commodity where id = ?",
|
||||
brand: "select * from shop_commodity where commodity_brand = ?"
|
||||
},
|
||||
order: {
|
||||
addOrder: "insert into shop_order(user_id,commodity_id,order_number,order_status,order_total,order_size) value (?,?,?,?,?,?)",
|
||||
deleteCarts: "delete from shop_cart where user_id = ? and commodity_id = ?",
|
||||
selectOrder: "SELECT user_id,commodity_id,order_number,order_status,order_total,order_size, shop_commodity.* FROM shop_order ,shop_commodity WHERE shop_order.commodity_id = shop_commodity.id AND shop_order.user_id = ? AND shop_order.order_status = ? "
|
||||
},
|
||||
user: {
|
||||
add: "insert into shop_user(user_name,user_pwd,user_nicname) value (?,?,?)",
|
||||
login: "select id,user_name,user_nicname,user_icons,user_money from shop_user where user_name = ? and user_pwd = ?",
|
||||
setAddress: "UPDATE shop_user SET user_truename = ? , user_addres = ? WHERE id = ? ",
|
||||
updateMoney: "UPDATE shop_user SET user_money = ? WHERE id = ? "
|
||||
},
|
||||
cart: {
|
||||
add: "insert into shop_cart(commodity_id,user_id,cart_nums) value (?,?,1)",
|
||||
checkCart: "select * from shop_cart where commodity_id = ? and user_id = ?",
|
||||
selectCart: "SELECT shop_cart.cart_nums, shop_cart.id AS cid, shop_commodity.* FROM shop_cart ,shop_commodity WHERE shop_cart.commodity_id = shop_commodity.id AND shop_cart.user_id = ?",
|
||||
deleteCart: "delete from shop_cart where id = ?"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = config
|
||||
15
node+vue/shop-bend/config/rsa_private_key.pem
Executable file
@@ -0,0 +1,15 @@
|
||||
-----BEGIN RSA PRIVATE KEY-----
|
||||
MIICXAIBAAKBgQCzkEs/kJgaFGIAM/TQRjzUtJ9ve9enk6heGj/JbcvHVOwFYw2q
|
||||
CNUhuaFE9rYDL+CzX3+cf7inRIJCvSnC0bdGCZ+i943uSudTkqT+guv03jTzvLy2
|
||||
TD+Bp41/ToNiPWG56p1keHE0Gwsr7o0waIcWrLpFJnzyW/fOYQjboRz7nwIDAQAB
|
||||
AoGADgMCfDFSTSauBwoG3oG8mXSGxHJLf74b80vlEljJAAL2b+0s0cnip8EOfo0p
|
||||
4tHHnPekw5eL1zGXYJHWQmeO/3ymZS/nnVq1K5YRM+AtYyUMAiChIt/zWOGXPN6k
|
||||
yUARaTK/cRZNY2XPPDK0H44eLF2RDE/SObPD0BZ0u9m92aECQQDYSIrYw0klyGJe
|
||||
ePaV0+2ZtVVhDYN+eYmWHu9/T+aOIPFS5ePUonBftSfcp7pTeJZ3O/eI/4W6pdzz
|
||||
13MRseUZAkEA1ImPvtbL39A8OtciY16LgDX5O5Vkm5p5+TKRhG5B38bgnOQQHu2d
|
||||
oJKvxjEJcWDfiJ6/ThHsFHqyvViJ+cIFdwJBAIWlpe62FdA8F9UK6EzDLXIq5DxZ
|
||||
rmSL06IpMZM5G12+K4EvP26YhdoORjiKiI+l10yMiLRmOQuSDIu9GYTYqZkCQEQ5
|
||||
/Ij4ju3D/PGuif14JjP8H4u/A1LoHeufDhODCWZ6gzQaCgrDoGwhaoemyi85N8i1
|
||||
nRfErRJN6P7bYz9nxzUCQDC8yEIcgKczxFIo20k4R+CINyJTB5S6dsVW6gmpiHZK
|
||||
6+MWkDut4o/Fibwp4jm5Fh9zau597aP5Xnt8mA2LRc8=
|
||||
-----END RSA PRIVATE KEY-----
|
||||
6
node+vue/shop-bend/config/rsa_public_key.pem
Executable file
@@ -0,0 +1,6 @@
|
||||
-----BEGIN PUBLIC KEY-----
|
||||
MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQCzkEs/kJgaFGIAM/TQRjzUtJ9v
|
||||
e9enk6heGj/JbcvHVOwFYw2qCNUhuaFE9rYDL+CzX3+cf7inRIJCvSnC0bdGCZ+i
|
||||
943uSudTkqT+guv03jTzvLy2TD+Bp41/ToNiPWG56p1keHE0Gwsr7o0waIcWrLpF
|
||||
JnzyW/fOYQjboRz7nwIDAQAB
|
||||
-----END PUBLIC KEY-----
|
||||
1
node+vue/shop-bend/db/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
6e1b7194-265c-4144-a2cb-64013f9ccde9
|
||||
37
node+vue/shop-bend/db/index.js
Executable file
@@ -0,0 +1,37 @@
|
||||
/**
|
||||
* mysql 数据库连接&操作的基础类
|
||||
*/
|
||||
const mysql = require('mysql');
|
||||
const config = require("../config")
|
||||
class DB {
|
||||
constructor() {
|
||||
// 创建数据库链接
|
||||
this.db = mysql.createConnection(config.dev.mysql);
|
||||
// 链接数据库
|
||||
this.db.connect();
|
||||
}
|
||||
|
||||
/**
|
||||
* 执行数据库操作
|
||||
* @param {*string} sql 数据库语句
|
||||
* @param {*array} par sql语句的参数
|
||||
*/
|
||||
query(sql, par = []) {
|
||||
var status;
|
||||
return new Promise((resolve, reject) => {
|
||||
this.db.query(sql, par, function (error, results, fields) {
|
||||
if (error) reject(error)
|
||||
results.length == 0 ? resolve({
|
||||
status: config.dev.api.error,
|
||||
data: "没有数据..."
|
||||
}) : resolve({
|
||||
status: config.dev.api.success,
|
||||
data: results
|
||||
});
|
||||
});
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
module.exports = new DB()
|
||||
3
node+vue/shop-bend/index.http
Executable file
@@ -0,0 +1,3 @@
|
||||
GET http://127.0.0.1:3000/api/json/shop/index HTTP/1.1
|
||||
content-type: application/json
|
||||
token : "csLYAGBfv5VvkH/R623nXPvoPsVtdielryGPtLGi2VUHyeuHKlmz31aNzbKZm5IXWTA5ek/1O/4JTq11iw3gmJy/eYxdzgZQwMgHx28z/eg7VMs9s8hbN2xa7+/UdTiSjteluqs5Bwk1lMjqWosfphIOagYLU7gE1/l+z494Qxw="
|
||||
14
node+vue/shop-bend/index.js
Executable file
@@ -0,0 +1,14 @@
|
||||
/**
|
||||
* 公共依赖导入
|
||||
*/
|
||||
const express = require('express');
|
||||
const router = express.Router();
|
||||
const mysql = require("./db")
|
||||
const utils = require("./utils")
|
||||
const Ver = require("./utils/ver")
|
||||
const redis = require("./cache")
|
||||
const config = require("./config")
|
||||
|
||||
|
||||
|
||||
module.exports = { express, router, mysql, Ver, redis, config, utils }
|
||||
27
node+vue/shop-bend/package.json
Executable file
@@ -0,0 +1,27 @@
|
||||
{
|
||||
"name": "shop-bend",
|
||||
"version": "1.2.1",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "./node_modules/.bin/node-dev ./bin/www",
|
||||
"start": "pm2 start ./bin/www --watch -i max --name be",
|
||||
"restart": "pm2 restart ./bin/www",
|
||||
"stop": "pm2 stop be",
|
||||
"list": "pm2 list",
|
||||
"log": "pm2 logs"
|
||||
},
|
||||
"dependencies": {
|
||||
"cookie-parser": "~1.4.3",
|
||||
"debug": "~2.6.9",
|
||||
"express": "~4.16.0",
|
||||
"http-errors": "~1.6.2",
|
||||
"morgan": "~1.9.0",
|
||||
"node-rsa": "^1.0.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"md5": "^2.2.1",
|
||||
"mysql": "^2.16.0",
|
||||
"node-dev": "^3.1.3",
|
||||
"redis": "^2.8.0"
|
||||
}
|
||||
}
|
||||
1
node+vue/shop-bend/routes/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
e3a7d513-22f1-4c5a-9073-8bad84db8b6c
|
||||
68
node+vue/shop-bend/routes/cart.js
Executable file
@@ -0,0 +1,68 @@
|
||||
const _ = require("..");
|
||||
|
||||
/**
|
||||
* 用户收藏商品
|
||||
* userid: 用户id
|
||||
* shopid: 商品id
|
||||
* http://127.0.0.1:3000/api/json/cart/addCart
|
||||
*/
|
||||
_.router.post('/addCart', _.Ver.Verification, async (req, res, next) => {
|
||||
let params = JSON.parse(req.unparams)
|
||||
let userid = params.userid,
|
||||
shopid = params.shopid,
|
||||
list = await _.mysql.query(_.config.dev.sql.cart.add, [shopid, userid]);
|
||||
res.json({
|
||||
status: list.status,
|
||||
data: _.utils.public_encrypt(list.data)
|
||||
})
|
||||
});
|
||||
|
||||
/**
|
||||
* 检查商品是否被收藏过
|
||||
* userid: 用户id
|
||||
* shopid: 商品id
|
||||
* http://127.0.0.1:3000/api/json/cart/checkCart
|
||||
*/
|
||||
_.router.post('/checkCart', _.Ver.Verification, async (req, res, next) => {
|
||||
let params = JSON.parse(req.unparams)
|
||||
let userid = params.userid,
|
||||
shopid = params.shopid,
|
||||
list = await _.mysql.query(_.config.dev.sql.cart.checkCart, [shopid, userid]);
|
||||
res.json({
|
||||
status: list.status,
|
||||
data: _.utils.public_encrypt(list.data)
|
||||
})
|
||||
});
|
||||
|
||||
/**
|
||||
* 查找用户的购物车数据
|
||||
* userid: 用户id
|
||||
* http://127.0.0.1:3000/api/json/cart/selectCart
|
||||
*/
|
||||
_.router.post('/selectCart', _.Ver.Verification, async (req, res, next) => {
|
||||
let params = JSON.parse(req.unparams)
|
||||
let userid = params.userid,
|
||||
list = await _.mysql.query(_.config.dev.sql.cart.selectCart, [userid]);
|
||||
res.json({
|
||||
status: list.status,
|
||||
data: _.utils.public_encrypt(list.data)
|
||||
})
|
||||
});
|
||||
|
||||
|
||||
/**
|
||||
* 删除用户购物车的商品
|
||||
* cid: 购物车表的id,前端的cid字段
|
||||
* http://127.0.0.1:3000/api/json/cart/deleteCart
|
||||
*/
|
||||
_.router.post('/deleteCart', _.Ver.Verification, async (req, res, next) => {
|
||||
let params = JSON.parse(req.unparams)
|
||||
let cid = params.cid,
|
||||
list = await _.mysql.query(_.config.dev.sql.cart.deleteCart, [cid]);
|
||||
res.json({
|
||||
status: list.status,
|
||||
data: _.utils.public_encrypt(list.data)
|
||||
})
|
||||
});
|
||||
|
||||
module.exports = _.router;
|
||||
57
node+vue/shop-bend/routes/order.js
Executable file
@@ -0,0 +1,57 @@
|
||||
const _ = require("..");
|
||||
|
||||
/**
|
||||
* 提交订单
|
||||
* brand: 商品的分类(品牌)
|
||||
* http://127.0.0.1:3000/api/json/order/addOrder
|
||||
*/
|
||||
_.router.post('/addOrder', _.Ver.Verification, async (req, res, next) => {
|
||||
let params = JSON.parse((JSON.parse(req.unparams)).order),
|
||||
totals = JSON.parse(req.unparams).orderTotal,
|
||||
money = JSON.parse(req.unparams).money;
|
||||
let order_number = _.utils.Timemap()
|
||||
// 插入到订单表
|
||||
for (var i = 0; i < params.length; i++) {
|
||||
await _.mysql.query(_.config.dev.sql.order.addOrder, [params[i].uid, params[i].sid, order_number, '1', params[i].total, params[i].size]);
|
||||
}
|
||||
|
||||
// 删除购物车数据
|
||||
for (var i = 0; i < params.length; i++) {
|
||||
await _.mysql.query(_.config.dev.sql.order.deleteCarts, [params[i].uid, params[i].sid]);
|
||||
}
|
||||
|
||||
await _.mysql.query(_.config.dev.sql.user.updateMoney, [money - totals, params[0].uid]);
|
||||
|
||||
|
||||
res.json({
|
||||
status: 200,
|
||||
data: _.utils.public_encrypt([
|
||||
{
|
||||
orderNumber: order_number
|
||||
}
|
||||
])
|
||||
})
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* 查看订单状态
|
||||
* userid: 用户id
|
||||
* status: 订单状态id
|
||||
* http://127.0.0.1:3000/api/json/order/checkOrder
|
||||
*/
|
||||
_.router.post('/checkOrder', _.Ver.Verification, async (req, res, next) => {
|
||||
let params = JSON.parse(req.unparams)
|
||||
let userid = params.userid,
|
||||
status = params.status,
|
||||
list = await _.mysql.query(_.config.dev.sql.order.selectOrder, [userid, status]);
|
||||
|
||||
res.json({
|
||||
status: list.status,
|
||||
data: _.utils.public_encrypt(list.data)
|
||||
})
|
||||
});
|
||||
|
||||
module.exports = _.router;
|
||||
56
node+vue/shop-bend/routes/shop.js
Executable file
@@ -0,0 +1,56 @@
|
||||
const _ = require("..")
|
||||
|
||||
/**
|
||||
* 进入商品的详情页面
|
||||
* id: 商品的id
|
||||
* http://127.0.0.1:3000/api/json/shop/info
|
||||
*/
|
||||
_.router.get('/info', _.Ver.Verification, async (req, res, next) => {
|
||||
let id = (JSON.parse(req.unparams)).id,
|
||||
list = await _.mysql.query(_.config.dev.sql.shop.info, [id]);
|
||||
res.json({
|
||||
status: list.status,
|
||||
data: _.utils.public_encrypt(list.data)
|
||||
})
|
||||
});
|
||||
|
||||
|
||||
/**
|
||||
* 首页接口,实现分页
|
||||
* page: 前端提供, 如果用户第一次访问app,让前端加密一个空的对象
|
||||
* http://127.0.0.1:3000/api/json/shop/index
|
||||
*/
|
||||
_.router.get('/index', _.Ver.Verification, async (req, res, next) => {
|
||||
let params = JSON.parse(req.unparams),
|
||||
pages = 0,
|
||||
totalPage = 15;
|
||||
|
||||
params.hasOwnProperty("page") ? pages = params.page : pages = 0;
|
||||
let startPage = pages * totalPage
|
||||
|
||||
list = await _.mysql.query(_.config.dev.sql.shop.index, [startPage, totalPage]);
|
||||
|
||||
_.redis.Set(req.url, _.utils.public_encrypt(list.data))
|
||||
res.json({
|
||||
status: list.status,
|
||||
data: _.utils.public_encrypt(list.data)
|
||||
})
|
||||
});
|
||||
|
||||
|
||||
/**
|
||||
* 进入商品的详情页面
|
||||
* brand: 商品的分类(品牌)
|
||||
* http://127.0.0.1:3000/api/json/shop/class
|
||||
*/
|
||||
_.router.get('/class', _.Ver.Verification, async (req, res, next) => {
|
||||
let brand = (JSON.parse(req.unparams)).brand,
|
||||
list = await _.mysql.query(_.config.dev.sql.shop.brand, [brand]);
|
||||
res.json({
|
||||
status: list.status,
|
||||
data: _.utils.public_encrypt(list.data)
|
||||
})
|
||||
});
|
||||
|
||||
|
||||
module.exports = _.router;
|
||||
60
node+vue/shop-bend/routes/user.js
Executable file
@@ -0,0 +1,60 @@
|
||||
const _ = require("..")
|
||||
|
||||
|
||||
/**
|
||||
* 进入商品的详情页面
|
||||
* phone: 用户名字(手机号)
|
||||
* nickname: 昵称
|
||||
* pwd: 密码
|
||||
* http://127.0.0.1:3000/api/json/user/addUser
|
||||
*/
|
||||
_.router.post('/addUser', _.Ver.Verification, async (req, res, next) => {
|
||||
let params = JSON.parse(req.unparams)
|
||||
let phone = params.phone,
|
||||
nickname = params.nickname,
|
||||
pwd = params.pwd,
|
||||
list = await _.mysql.query(_.config.dev.sql.user.add, [phone, _.utils.md5Text(pwd), nickname]);
|
||||
res.json({
|
||||
status: list.status,
|
||||
data: _.utils.public_encrypt(list.data)
|
||||
})
|
||||
});
|
||||
|
||||
/**
|
||||
* 进入商品的详情页面
|
||||
* phone: 用户名字(手机号)
|
||||
* pwd: 密码
|
||||
* http://127.0.0.1:3000/api/json/user/login
|
||||
*/
|
||||
_.router.post('/login', _.Ver.Verification, async (req, res, next) => {
|
||||
let params = JSON.parse(req.unparams)
|
||||
let phone = params.phone,
|
||||
pwd = params.pwd,
|
||||
list = await _.mysql.query(_.config.dev.sql.user.login, [phone, _.utils.md5Text(pwd)]);
|
||||
res.json({
|
||||
status: list.status,
|
||||
data: _.utils.public_encrypt(list.data)
|
||||
})
|
||||
});
|
||||
|
||||
/**
|
||||
* 进入商品的详情页面
|
||||
* phone: 用户名字(手机号)
|
||||
* pwd: 密码
|
||||
* http://127.0.0.1:3000/api/json/user/setAddress
|
||||
*/
|
||||
_.router.post('/setAddress', _.Ver.Verification, async (req, res, next) => {
|
||||
let params = JSON.parse(req.unparams)
|
||||
let truename = params.truename,
|
||||
address = params.address,
|
||||
uid = params.uid,
|
||||
list = await _.mysql.query(_.config.dev.sql.user.setAddress, [truename, address, uid]);
|
||||
res.json({
|
||||
status: list.status,
|
||||
data: _.utils.public_encrypt(list.data)
|
||||
})
|
||||
});
|
||||
|
||||
|
||||
|
||||
module.exports = _.router;
|
||||
1
node+vue/shop-bend/utils/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
83d864a2-4667-4ed1-8e48-e4663cb53c47
|
||||
73
node+vue/shop-bend/utils/index.js
Executable file
@@ -0,0 +1,73 @@
|
||||
const fs = require("fs");
|
||||
const path = require("path");
|
||||
const config = require("../config");
|
||||
const NodeRSA = require('node-rsa');
|
||||
const md5 = require('md5');
|
||||
|
||||
class Utils {
|
||||
constructor() {
|
||||
// 私钥
|
||||
this.rsa_private_key = this.ReadFile(this.GetRsaPath(config.dev.rsa.privateKey))
|
||||
// 公钥
|
||||
this.rsa_public_key = this.ReadFile(this.GetRsaPath(config.dev.rsa.publicKey))
|
||||
}
|
||||
|
||||
/**
|
||||
* 前端 :使用RSA的私钥进行加密 rsa_private_key
|
||||
*/
|
||||
encrypt(text) {
|
||||
return (new NodeRSA(this.rsa_private_key)).encryptPrivate(text, 'base64')
|
||||
}
|
||||
|
||||
/**
|
||||
* 前端 : 使用私钥解密json数据给前端
|
||||
*/
|
||||
Private_decrypted(text) {
|
||||
return (new NodeRSA(this.rsa_private_key)).decrypt(text, 'utf8')
|
||||
}
|
||||
|
||||
/**
|
||||
* 后端 : 使用RSA的公钥进行解密 rsa_public_key
|
||||
*/
|
||||
decrypted(text) {
|
||||
return (new NodeRSA(this.rsa_public_key)).decryptPublic(text, 'utf8')
|
||||
}
|
||||
|
||||
/**
|
||||
* 后端 :使用公钥加密json数据给前端
|
||||
*/
|
||||
public_encrypt(text) {
|
||||
return (new NodeRSA(this.rsa_public_key)).encrypt(text, 'base64')
|
||||
}
|
||||
|
||||
/**
|
||||
* 同步读取文件
|
||||
* @param {*string} path 图片的地址
|
||||
*/
|
||||
ReadFile(path) {
|
||||
return fs.readFileSync(path).toString("utf-8")
|
||||
}
|
||||
/**
|
||||
* 获取RSA文件地址
|
||||
* @param {*string} url 获取公私钥文件地址
|
||||
*/
|
||||
GetRsaPath(url) {
|
||||
return path.join(__dirname, url)
|
||||
}
|
||||
/**
|
||||
* md5加密
|
||||
* @param {*string} text 需要被加密的字符串
|
||||
*/
|
||||
md5Text(text) {
|
||||
return md5(text)
|
||||
}
|
||||
|
||||
Timemap() {
|
||||
return Date.parse(new Date())
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
module.exports = new Utils()
|
||||
29
node+vue/shop-bend/utils/ver.js
Executable file
@@ -0,0 +1,29 @@
|
||||
const utils = require("./index")
|
||||
const cache = require("../cache")
|
||||
const config = require("../config")
|
||||
module.exports = {
|
||||
/**
|
||||
* 路由拦截器,拦截路由验证是否有token参数,redis中是否已经有数据缓存
|
||||
*/
|
||||
async Verification(req, res, next) {
|
||||
// 验证请求头是否包含token
|
||||
if (req.headers.hasOwnProperty("token")) {
|
||||
// 验证redis是否有缓存,没有则去获取mysq然后缓存,有直接读取缓存
|
||||
if (await cache.Get(req.url) == null) {
|
||||
req.unparams = utils.decrypted(req.headers.token)
|
||||
next()
|
||||
} else {
|
||||
res.json({
|
||||
status: config.dev.api.success,
|
||||
cache: true,
|
||||
data: await cache.Get(req.url)
|
||||
})
|
||||
}
|
||||
} else {
|
||||
res.json({
|
||||
status: config.dev.api.CodeError,
|
||||
data: "缺少必填参数,请求头token"
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
10
node+vue/shop-bend/笔记.md
Executable file
@@ -0,0 +1,10 @@
|
||||
## RSA 非对称加密
|
||||
|
||||
私钥 公钥
|
||||
|
||||
|
||||
1:前端传递参数给后端的时候,先将数据 object 转换为 "key=value&key=value" ,然后通过私钥对数据进行加密,放到请求头中token传递给后端,
|
||||
|
||||
2:后端拿到请求头通过公钥解密,重新排列数据为 object, 然后查询计算完成拿到数据,后端再用公钥加密json数据,然后返回给前端
|
||||
|
||||
3:前端通过私钥解密后端的json,渲染页面
|
||||
12
node+vue/shop-fend/.babelrc
Executable file
@@ -0,0 +1,12 @@
|
||||
{
|
||||
"presets": [
|
||||
["env", {
|
||||
"modules": false,
|
||||
"targets": {
|
||||
"browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
|
||||
}
|
||||
}],
|
||||
"stage-2"
|
||||
],
|
||||
"plugins": ["transform-vue-jsx", "transform-runtime"]
|
||||
}
|
||||
9
node+vue/shop-fend/.editorconfig
Executable file
@@ -0,0 +1,9 @@
|
||||
root = true
|
||||
|
||||
[*]
|
||||
charset = utf-8
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
end_of_line = lf
|
||||
insert_final_newline = true
|
||||
trim_trailing_whitespace = true
|
||||
4
node+vue/shop-fend/.eslintignore
Executable file
@@ -0,0 +1,4 @@
|
||||
/build/
|
||||
/config/
|
||||
/dist/
|
||||
/*.js
|
||||
29
node+vue/shop-fend/.eslintrc.js
Executable file
@@ -0,0 +1,29 @@
|
||||
// https://eslint.org/docs/user-guide/configuring
|
||||
|
||||
module.exports = {
|
||||
root: true,
|
||||
parserOptions: {
|
||||
parser: 'babel-eslint'
|
||||
},
|
||||
env: {
|
||||
browser: true,
|
||||
},
|
||||
extends: [
|
||||
// https://github.com/vuejs/eslint-plugin-vue#priority-a-essential-error-prevention
|
||||
// consider switching to `plugin:vue/strongly-recommended` or `plugin:vue/recommended` for stricter rules.
|
||||
'plugin:vue/essential',
|
||||
// https://github.com/standard/standard/blob/master/docs/RULES-en.md
|
||||
'standard'
|
||||
],
|
||||
// required to lint *.vue files
|
||||
plugins: [
|
||||
'vue'
|
||||
],
|
||||
// add your custom rules here
|
||||
rules: {
|
||||
// allow async-await
|
||||
'generator-star-spacing': 'off',
|
||||
// allow debugger during development
|
||||
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off'
|
||||
}
|
||||
}
|
||||
14
node+vue/shop-fend/.gitignore
vendored
Executable file
@@ -0,0 +1,14 @@
|
||||
.DS_Store
|
||||
node_modules/
|
||||
/dist/
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
|
||||
# Editor directories and files
|
||||
.idea
|
||||
.vscode
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
10
node+vue/shop-fend/.postcssrc.js
Executable file
@@ -0,0 +1,10 @@
|
||||
// https://github.com/michael-ciniawsky/postcss-load-config
|
||||
|
||||
module.exports = {
|
||||
"plugins": {
|
||||
"postcss-import": {},
|
||||
"postcss-url": {},
|
||||
// to edit target browsers: use "browserslist" field in package.json
|
||||
"autoprefixer": {}
|
||||
}
|
||||
}
|
||||
1
node+vue/shop-fend/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
eaece4c6-54be-40f2-95c5-7927167e35fc
|
||||
7
node+vue/shop-fend/README.md
Executable file
@@ -0,0 +1,7 @@
|
||||
# shop-fend
|
||||
|
||||
> A Vue.js project
|
||||
|
||||
- 1:将用户的收货地址信息存到 shop_user (完成)
|
||||
- 2:将用户的订单信息存到 shop_order
|
||||
- 3:减少用户表的用户余额
|
||||
1
node+vue/shop-fend/build/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
66477173-4509-445d-a5df-92e911a50af7
|
||||
41
node+vue/shop-fend/build/build.js
Executable file
@@ -0,0 +1,41 @@
|
||||
'use strict'
|
||||
require('./check-versions')()
|
||||
|
||||
process.env.NODE_ENV = 'production'
|
||||
|
||||
const ora = require('ora')
|
||||
const rm = require('rimraf')
|
||||
const path = require('path')
|
||||
const chalk = require('chalk')
|
||||
const webpack = require('webpack')
|
||||
const config = require('../config')
|
||||
const webpackConfig = require('./webpack.prod.conf')
|
||||
|
||||
const spinner = ora('building for production...')
|
||||
spinner.start()
|
||||
|
||||
rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), err => {
|
||||
if (err) throw err
|
||||
webpack(webpackConfig, (err, stats) => {
|
||||
spinner.stop()
|
||||
if (err) throw err
|
||||
process.stdout.write(stats.toString({
|
||||
colors: true,
|
||||
modules: false,
|
||||
children: false, // If you are using ts-loader, setting this to true will make TypeScript errors show up during build.
|
||||
chunks: false,
|
||||
chunkModules: false
|
||||
}) + '\n\n')
|
||||
|
||||
if (stats.hasErrors()) {
|
||||
console.log(chalk.red(' Build failed with errors.\n'))
|
||||
process.exit(1)
|
||||
}
|
||||
|
||||
console.log(chalk.cyan(' Build complete.\n'))
|
||||
console.log(chalk.yellow(
|
||||
' Tip: built files are meant to be served over an HTTP server.\n' +
|
||||
' Opening index.html over file:// won\'t work.\n'
|
||||
))
|
||||
})
|
||||
})
|
||||
54
node+vue/shop-fend/build/check-versions.js
Executable file
@@ -0,0 +1,54 @@
|
||||
'use strict'
|
||||
const chalk = require('chalk')
|
||||
const semver = require('semver')
|
||||
const packageConfig = require('../package.json')
|
||||
const shell = require('shelljs')
|
||||
|
||||
function exec (cmd) {
|
||||
return require('child_process').execSync(cmd).toString().trim()
|
||||
}
|
||||
|
||||
const versionRequirements = [
|
||||
{
|
||||
name: 'node',
|
||||
currentVersion: semver.clean(process.version),
|
||||
versionRequirement: packageConfig.engines.node
|
||||
}
|
||||
]
|
||||
|
||||
if (shell.which('npm')) {
|
||||
versionRequirements.push({
|
||||
name: 'npm',
|
||||
currentVersion: exec('npm --version'),
|
||||
versionRequirement: packageConfig.engines.npm
|
||||
})
|
||||
}
|
||||
|
||||
module.exports = function () {
|
||||
const warnings = []
|
||||
|
||||
for (let i = 0; i < versionRequirements.length; i++) {
|
||||
const mod = versionRequirements[i]
|
||||
|
||||
if (!semver.satisfies(mod.currentVersion, mod.versionRequirement)) {
|
||||
warnings.push(mod.name + ': ' +
|
||||
chalk.red(mod.currentVersion) + ' should be ' +
|
||||
chalk.green(mod.versionRequirement)
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
if (warnings.length) {
|
||||
console.log('')
|
||||
console.log(chalk.yellow('To use this template, you must update following to modules:'))
|
||||
console.log()
|
||||
|
||||
for (let i = 0; i < warnings.length; i++) {
|
||||
const warning = warnings[i]
|
||||
console.log(' ' + warning)
|
||||
}
|
||||
|
||||
console.log()
|
||||
process.exit(1)
|
||||
}
|
||||
}
|
||||
BIN
node+vue/shop-fend/build/logo.png
Executable file
|
After Width: | Height: | Size: 6.7 KiB |
101
node+vue/shop-fend/build/utils.js
Executable file
@@ -0,0 +1,101 @@
|
||||
'use strict'
|
||||
const path = require('path')
|
||||
const config = require('../config')
|
||||
const ExtractTextPlugin = require('extract-text-webpack-plugin')
|
||||
const packageConfig = require('../package.json')
|
||||
|
||||
exports.assetsPath = function (_path) {
|
||||
const assetsSubDirectory = process.env.NODE_ENV === 'production'
|
||||
? config.build.assetsSubDirectory
|
||||
: config.dev.assetsSubDirectory
|
||||
|
||||
return path.posix.join(assetsSubDirectory, _path)
|
||||
}
|
||||
|
||||
exports.cssLoaders = function (options) {
|
||||
options = options || {}
|
||||
|
||||
const cssLoader = {
|
||||
loader: 'css-loader',
|
||||
options: {
|
||||
sourceMap: options.sourceMap
|
||||
}
|
||||
}
|
||||
|
||||
const postcssLoader = {
|
||||
loader: 'postcss-loader',
|
||||
options: {
|
||||
sourceMap: options.sourceMap
|
||||
}
|
||||
}
|
||||
|
||||
// generate loader string to be used with extract text plugin
|
||||
function generateLoaders (loader, loaderOptions) {
|
||||
const loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader]
|
||||
|
||||
if (loader) {
|
||||
loaders.push({
|
||||
loader: loader + '-loader',
|
||||
options: Object.assign({}, loaderOptions, {
|
||||
sourceMap: options.sourceMap
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
// Extract CSS when that option is specified
|
||||
// (which is the case during production build)
|
||||
if (options.extract) {
|
||||
return ExtractTextPlugin.extract({
|
||||
use: loaders,
|
||||
fallback: 'vue-style-loader'
|
||||
})
|
||||
} else {
|
||||
return ['vue-style-loader'].concat(loaders)
|
||||
}
|
||||
}
|
||||
|
||||
// https://vue-loader.vuejs.org/en/configurations/extract-css.html
|
||||
return {
|
||||
css: generateLoaders(),
|
||||
postcss: generateLoaders(),
|
||||
less: generateLoaders('less'),
|
||||
sass: generateLoaders('sass', { indentedSyntax: true }),
|
||||
scss: generateLoaders('sass'),
|
||||
stylus: generateLoaders('stylus'),
|
||||
styl: generateLoaders('stylus')
|
||||
}
|
||||
}
|
||||
|
||||
// Generate loaders for standalone style files (outside of .vue)
|
||||
exports.styleLoaders = function (options) {
|
||||
const output = []
|
||||
const loaders = exports.cssLoaders(options)
|
||||
|
||||
for (const extension in loaders) {
|
||||
const loader = loaders[extension]
|
||||
output.push({
|
||||
test: new RegExp('\\.' + extension + '$'),
|
||||
use: loader
|
||||
})
|
||||
}
|
||||
|
||||
return output
|
||||
}
|
||||
|
||||
exports.createNotifierCallback = () => {
|
||||
const notifier = require('node-notifier')
|
||||
|
||||
return (severity, errors) => {
|
||||
if (severity !== 'error') return
|
||||
|
||||
const error = errors[0]
|
||||
const filename = error.file && error.file.split('!').pop()
|
||||
|
||||
notifier.notify({
|
||||
title: packageConfig.name,
|
||||
message: severity + ': ' + error.name,
|
||||
subtitle: filename || '',
|
||||
icon: path.join(__dirname, 'logo.png')
|
||||
})
|
||||
}
|
||||
}
|
||||
22
node+vue/shop-fend/build/vue-loader.conf.js
Executable file
@@ -0,0 +1,22 @@
|
||||
'use strict'
|
||||
const utils = require('./utils')
|
||||
const config = require('../config')
|
||||
const isProduction = process.env.NODE_ENV === 'production'
|
||||
const sourceMapEnabled = isProduction
|
||||
? config.build.productionSourceMap
|
||||
: config.dev.cssSourceMap
|
||||
|
||||
module.exports = {
|
||||
loaders: utils.cssLoaders({
|
||||
sourceMap: sourceMapEnabled,
|
||||
extract: isProduction
|
||||
}),
|
||||
cssSourceMap: sourceMapEnabled,
|
||||
cacheBusting: config.dev.cacheBusting,
|
||||
transformToRequire: {
|
||||
video: ['src', 'poster'],
|
||||
source: 'src',
|
||||
img: 'src',
|
||||
image: 'xlink:href'
|
||||
}
|
||||
}
|
||||
92
node+vue/shop-fend/build/webpack.base.conf.js
Executable file
@@ -0,0 +1,92 @@
|
||||
'use strict'
|
||||
const path = require('path')
|
||||
const utils = require('./utils')
|
||||
const config = require('../config')
|
||||
const vueLoaderConfig = require('./vue-loader.conf')
|
||||
|
||||
function resolve (dir) {
|
||||
return path.join(__dirname, '..', dir)
|
||||
}
|
||||
|
||||
const createLintingRule = () => ({
|
||||
test: /\.(js|vue)$/,
|
||||
loader: 'eslint-loader',
|
||||
enforce: 'pre',
|
||||
include: [resolve('src'), resolve('test')],
|
||||
options: {
|
||||
formatter: require('eslint-friendly-formatter'),
|
||||
emitWarning: !config.dev.showEslintErrorsInOverlay
|
||||
}
|
||||
})
|
||||
|
||||
module.exports = {
|
||||
context: path.resolve(__dirname, '../'),
|
||||
entry: {
|
||||
app: './src/main.js'
|
||||
},
|
||||
output: {
|
||||
path: config.build.assetsRoot,
|
||||
filename: '[name].js',
|
||||
publicPath: process.env.NODE_ENV === 'production'
|
||||
? config.build.assetsPublicPath
|
||||
: config.dev.assetsPublicPath
|
||||
},
|
||||
resolve: {
|
||||
extensions: ['.js', '.vue', '.json','.less'],
|
||||
alias: {
|
||||
'vue$': 'vue/dist/vue.esm.js',
|
||||
'@': resolve('src'),
|
||||
}
|
||||
},
|
||||
module: {
|
||||
rules: [
|
||||
...(config.dev.useEslint ? [createLintingRule()] : []),
|
||||
{
|
||||
test: /\.vue$/,
|
||||
loader: 'vue-loader',
|
||||
options: vueLoaderConfig
|
||||
},
|
||||
{
|
||||
test: /\.js$/,
|
||||
loader: 'babel-loader',
|
||||
include: [resolve('src'), resolve('test'), resolve('node_modules/webpack-dev-server/client')]
|
||||
},
|
||||
{
|
||||
test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
|
||||
loader: 'url-loader',
|
||||
options: {
|
||||
limit: 10000,
|
||||
name: utils.assetsPath('img/[name].[hash:7].[ext]')
|
||||
}
|
||||
},
|
||||
{
|
||||
test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
|
||||
loader: 'url-loader',
|
||||
options: {
|
||||
limit: 10000,
|
||||
name: utils.assetsPath('media/[name].[hash:7].[ext]')
|
||||
}
|
||||
},
|
||||
{
|
||||
test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
|
||||
loader: 'url-loader',
|
||||
options: {
|
||||
limit: 10000,
|
||||
name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
node: {
|
||||
// prevent webpack from injecting useless setImmediate polyfill because Vue
|
||||
// source contains it (although only uses it if it's native).
|
||||
setImmediate: false,
|
||||
// prevent webpack from injecting mocks to Node native modules
|
||||
// that does not make sense for the client
|
||||
dgram: 'empty',
|
||||
fs: 'empty',
|
||||
net: 'empty',
|
||||
tls: 'empty',
|
||||
child_process: 'empty'
|
||||
}
|
||||
}
|
||||
95
node+vue/shop-fend/build/webpack.dev.conf.js
Executable file
@@ -0,0 +1,95 @@
|
||||
'use strict'
|
||||
const utils = require('./utils')
|
||||
const webpack = require('webpack')
|
||||
const config = require('../config')
|
||||
const merge = require('webpack-merge')
|
||||
const path = require('path')
|
||||
const baseWebpackConfig = require('./webpack.base.conf')
|
||||
const CopyWebpackPlugin = require('copy-webpack-plugin')
|
||||
const HtmlWebpackPlugin = require('html-webpack-plugin')
|
||||
const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin')
|
||||
const portfinder = require('portfinder')
|
||||
|
||||
const HOST = process.env.HOST
|
||||
const PORT = process.env.PORT && Number(process.env.PORT)
|
||||
|
||||
const devWebpackConfig = merge(baseWebpackConfig, {
|
||||
module: {
|
||||
rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, usePostCSS: true })
|
||||
},
|
||||
// cheap-module-eval-source-map is faster for development
|
||||
devtool: config.dev.devtool,
|
||||
|
||||
// these devServer options should be customized in /config/index.js
|
||||
devServer: {
|
||||
clientLogLevel: 'warning',
|
||||
historyApiFallback: {
|
||||
rewrites: [
|
||||
{ from: /.*/, to: path.posix.join(config.dev.assetsPublicPath, 'index.html') },
|
||||
],
|
||||
},
|
||||
hot: true,
|
||||
contentBase: false, // since we use CopyWebpackPlugin.
|
||||
compress: true,
|
||||
host: HOST || config.dev.host,
|
||||
port: PORT || config.dev.port,
|
||||
open: config.dev.autoOpenBrowser,
|
||||
overlay: config.dev.errorOverlay
|
||||
? { warnings: false, errors: true }
|
||||
: false,
|
||||
publicPath: config.dev.assetsPublicPath,
|
||||
proxy: config.dev.proxyTable,
|
||||
quiet: true, // necessary for FriendlyErrorsPlugin
|
||||
watchOptions: {
|
||||
poll: config.dev.poll,
|
||||
}
|
||||
},
|
||||
plugins: [
|
||||
new webpack.DefinePlugin({
|
||||
'process.env': require('../config/dev.env')
|
||||
}),
|
||||
new webpack.HotModuleReplacementPlugin(),
|
||||
new webpack.NamedModulesPlugin(), // HMR shows correct file names in console on update.
|
||||
new webpack.NoEmitOnErrorsPlugin(),
|
||||
// https://github.com/ampedandwired/html-webpack-plugin
|
||||
new HtmlWebpackPlugin({
|
||||
filename: 'index.html',
|
||||
template: 'index.html',
|
||||
inject: true
|
||||
}),
|
||||
// copy custom static assets
|
||||
new CopyWebpackPlugin([
|
||||
{
|
||||
from: path.resolve(__dirname, '../static'),
|
||||
to: config.dev.assetsSubDirectory,
|
||||
ignore: ['.*']
|
||||
}
|
||||
])
|
||||
]
|
||||
})
|
||||
|
||||
module.exports = new Promise((resolve, reject) => {
|
||||
portfinder.basePort = process.env.PORT || config.dev.port
|
||||
portfinder.getPort((err, port) => {
|
||||
if (err) {
|
||||
reject(err)
|
||||
} else {
|
||||
// publish the new Port, necessary for e2e tests
|
||||
process.env.PORT = port
|
||||
// add port to devServer config
|
||||
devWebpackConfig.devServer.port = port
|
||||
|
||||
// Add FriendlyErrorsPlugin
|
||||
devWebpackConfig.plugins.push(new FriendlyErrorsPlugin({
|
||||
compilationSuccessInfo: {
|
||||
messages: [`Your application is running here: http://${devWebpackConfig.devServer.host}:${port}`],
|
||||
},
|
||||
onErrors: config.dev.notifyOnErrors
|
||||
? utils.createNotifierCallback()
|
||||
: undefined
|
||||
}))
|
||||
|
||||
resolve(devWebpackConfig)
|
||||
}
|
||||
})
|
||||
})
|
||||
145
node+vue/shop-fend/build/webpack.prod.conf.js
Executable file
@@ -0,0 +1,145 @@
|
||||
'use strict'
|
||||
const path = require('path')
|
||||
const utils = require('./utils')
|
||||
const webpack = require('webpack')
|
||||
const config = require('../config')
|
||||
const merge = require('webpack-merge')
|
||||
const baseWebpackConfig = require('./webpack.base.conf')
|
||||
const CopyWebpackPlugin = require('copy-webpack-plugin')
|
||||
const HtmlWebpackPlugin = require('html-webpack-plugin')
|
||||
const ExtractTextPlugin = require('extract-text-webpack-plugin')
|
||||
const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin')
|
||||
const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
|
||||
|
||||
const env = require('../config/prod.env')
|
||||
|
||||
const webpackConfig = merge(baseWebpackConfig, {
|
||||
module: {
|
||||
rules: utils.styleLoaders({
|
||||
sourceMap: config.build.productionSourceMap,
|
||||
extract: true,
|
||||
usePostCSS: true
|
||||
})
|
||||
},
|
||||
devtool: config.build.productionSourceMap ? config.build.devtool : false,
|
||||
output: {
|
||||
path: config.build.assetsRoot,
|
||||
filename: utils.assetsPath('js/[name].[chunkhash].js'),
|
||||
chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
|
||||
},
|
||||
plugins: [
|
||||
// http://vuejs.github.io/vue-loader/en/workflow/production.html
|
||||
new webpack.DefinePlugin({
|
||||
'process.env': env
|
||||
}),
|
||||
new UglifyJsPlugin({
|
||||
uglifyOptions: {
|
||||
compress: {
|
||||
warnings: false
|
||||
}
|
||||
},
|
||||
sourceMap: config.build.productionSourceMap,
|
||||
parallel: true
|
||||
}),
|
||||
// extract css into its own file
|
||||
new ExtractTextPlugin({
|
||||
filename: utils.assetsPath('css/[name].[contenthash].css'),
|
||||
// Setting the following option to `false` will not extract CSS from codesplit chunks.
|
||||
// Their CSS will instead be inserted dynamically with style-loader when the codesplit chunk has been loaded by webpack.
|
||||
// It's currently set to `true` because we are seeing that sourcemaps are included in the codesplit bundle as well when it's `false`,
|
||||
// increasing file size: https://github.com/vuejs-templates/webpack/issues/1110
|
||||
allChunks: true,
|
||||
}),
|
||||
// Compress extracted CSS. We are using this plugin so that possible
|
||||
// duplicated CSS from different components can be deduped.
|
||||
new OptimizeCSSPlugin({
|
||||
cssProcessorOptions: config.build.productionSourceMap
|
||||
? { safe: true, map: { inline: false } }
|
||||
: { safe: true }
|
||||
}),
|
||||
// generate dist index.html with correct asset hash for caching.
|
||||
// you can customize output by editing /index.html
|
||||
// see https://github.com/ampedandwired/html-webpack-plugin
|
||||
new HtmlWebpackPlugin({
|
||||
filename: config.build.index,
|
||||
template: 'index.html',
|
||||
inject: true,
|
||||
minify: {
|
||||
removeComments: true,
|
||||
collapseWhitespace: true,
|
||||
removeAttributeQuotes: true
|
||||
// more options:
|
||||
// https://github.com/kangax/html-minifier#options-quick-reference
|
||||
},
|
||||
// necessary to consistently work with multiple chunks via CommonsChunkPlugin
|
||||
chunksSortMode: 'dependency'
|
||||
}),
|
||||
// keep module.id stable when vendor modules does not change
|
||||
new webpack.HashedModuleIdsPlugin(),
|
||||
// enable scope hoisting
|
||||
new webpack.optimize.ModuleConcatenationPlugin(),
|
||||
// split vendor js into its own file
|
||||
new webpack.optimize.CommonsChunkPlugin({
|
||||
name: 'vendor',
|
||||
minChunks (module) {
|
||||
// any required modules inside node_modules are extracted to vendor
|
||||
return (
|
||||
module.resource &&
|
||||
/\.js$/.test(module.resource) &&
|
||||
module.resource.indexOf(
|
||||
path.join(__dirname, '../node_modules')
|
||||
) === 0
|
||||
)
|
||||
}
|
||||
}),
|
||||
// extract webpack runtime and module manifest to its own file in order to
|
||||
// prevent vendor hash from being updated whenever app bundle is updated
|
||||
new webpack.optimize.CommonsChunkPlugin({
|
||||
name: 'manifest',
|
||||
minChunks: Infinity
|
||||
}),
|
||||
// This instance extracts shared chunks from code splitted chunks and bundles them
|
||||
// in a separate chunk, similar to the vendor chunk
|
||||
// see: https://webpack.js.org/plugins/commons-chunk-plugin/#extra-async-commons-chunk
|
||||
new webpack.optimize.CommonsChunkPlugin({
|
||||
name: 'app',
|
||||
async: 'vendor-async',
|
||||
children: true,
|
||||
minChunks: 3
|
||||
}),
|
||||
|
||||
// copy custom static assets
|
||||
new CopyWebpackPlugin([
|
||||
{
|
||||
from: path.resolve(__dirname, '../static'),
|
||||
to: config.build.assetsSubDirectory,
|
||||
ignore: ['.*']
|
||||
}
|
||||
])
|
||||
]
|
||||
})
|
||||
|
||||
if (config.build.productionGzip) {
|
||||
const CompressionWebpackPlugin = require('compression-webpack-plugin')
|
||||
|
||||
webpackConfig.plugins.push(
|
||||
new CompressionWebpackPlugin({
|
||||
asset: '[path].gz[query]',
|
||||
algorithm: 'gzip',
|
||||
test: new RegExp(
|
||||
'\\.(' +
|
||||
config.build.productionGzipExtensions.join('|') +
|
||||
')$'
|
||||
),
|
||||
threshold: 10240,
|
||||
minRatio: 0.8
|
||||
})
|
||||
)
|
||||
}
|
||||
|
||||
if (config.build.bundleAnalyzerReport) {
|
||||
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
|
||||
webpackConfig.plugins.push(new BundleAnalyzerPlugin())
|
||||
}
|
||||
|
||||
module.exports = webpackConfig
|
||||
1
node+vue/shop-fend/config/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
069d2a3c-3a2f-416a-96d7-5de5c545ed0c
|
||||
7
node+vue/shop-fend/config/dev.env.js
Executable file
@@ -0,0 +1,7 @@
|
||||
'use strict'
|
||||
const merge = require('webpack-merge')
|
||||
const prodEnv = require('./prod.env')
|
||||
|
||||
module.exports = merge(prodEnv, {
|
||||
NODE_ENV: '"development"'
|
||||
})
|
||||
76
node+vue/shop-fend/config/index.js
Executable file
@@ -0,0 +1,76 @@
|
||||
'use strict'
|
||||
// Template version: 1.3.1
|
||||
// see http://vuejs-templates.github.io/webpack for documentation.
|
||||
|
||||
const path = require('path')
|
||||
|
||||
module.exports = {
|
||||
dev: {
|
||||
|
||||
// Paths
|
||||
assetsSubDirectory: 'static',
|
||||
assetsPublicPath: '/',
|
||||
proxyTable: {},
|
||||
|
||||
// Various Dev Server settings
|
||||
host: 'localhost', // can be overwritten by process.env.HOST
|
||||
port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
|
||||
autoOpenBrowser: false,
|
||||
errorOverlay: true,
|
||||
notifyOnErrors: true,
|
||||
poll: false, // https://webpack.js.org/configuration/dev-server/#devserver-watchoptions-
|
||||
|
||||
// Use Eslint Loader?
|
||||
// If true, your code will be linted during bundling and
|
||||
// linting errors and warnings will be shown in the console.
|
||||
useEslint: false,
|
||||
// If true, eslint errors and warnings will also be shown in the error overlay
|
||||
// in the browser.
|
||||
showEslintErrorsInOverlay: false,
|
||||
|
||||
/**
|
||||
* Source Maps
|
||||
*/
|
||||
|
||||
// https://webpack.js.org/configuration/devtool/#development
|
||||
devtool: 'cheap-module-eval-source-map',
|
||||
|
||||
// If you have problems debugging vue-files in devtools,
|
||||
// set this to false - it *may* help
|
||||
// https://vue-loader.vuejs.org/en/options.html#cachebusting
|
||||
cacheBusting: true,
|
||||
|
||||
cssSourceMap: true
|
||||
},
|
||||
|
||||
build: {
|
||||
// Template for index.html
|
||||
index: path.resolve(__dirname, '../dist/index.html'),
|
||||
|
||||
// Paths
|
||||
assetsRoot: path.resolve(__dirname, '../dist'),
|
||||
assetsSubDirectory: 'static',
|
||||
assetsPublicPath: './',
|
||||
|
||||
/**
|
||||
* Source Maps
|
||||
*/
|
||||
|
||||
productionSourceMap: false,
|
||||
// https://webpack.js.org/configuration/devtool/#production
|
||||
devtool: '#source-map',
|
||||
|
||||
// Gzip off by default as many popular static hosts such as
|
||||
// Surge or Netlify already gzip all static assets for you.
|
||||
// Before setting to `true`, make sure to:
|
||||
// npm install --save-dev compression-webpack-plugin
|
||||
productionGzip: false,
|
||||
productionGzipExtensions: ['js', 'css'],
|
||||
|
||||
// Run the build command with an extra argument to
|
||||
// View the bundle analyzer report after build finishes:
|
||||
// `npm run build --report`
|
||||
// Set to `true` or `false` to always turn it on or off
|
||||
bundleAnalyzerReport: process.env.npm_config_report
|
||||
}
|
||||
}
|
||||
4
node+vue/shop-fend/config/prod.env.js
Executable file
@@ -0,0 +1,4 @@
|
||||
'use strict'
|
||||
module.exports = {
|
||||
NODE_ENV: '"production"'
|
||||
}
|
||||
28
node+vue/shop-fend/gulpfile.js
Executable file
@@ -0,0 +1,28 @@
|
||||
const gulp = require('gulp');
|
||||
const zip = require('gulp-zip');
|
||||
const ftp = require('gulp-ftp');
|
||||
const gutil = require('gulp-util');
|
||||
|
||||
gulp.task('copy', function () {
|
||||
return gulp.src('run/*')
|
||||
.pipe(gulp.dest('dist/'))
|
||||
});
|
||||
|
||||
|
||||
|
||||
gulp.task('zip', () =>
|
||||
gulp.src('dist/**/*')
|
||||
.pipe(zip('code.zip'))
|
||||
.pipe(gulp.dest('./'))
|
||||
);
|
||||
|
||||
|
||||
gulp.task('ftp', function () {
|
||||
return gulp.src('code.zip')
|
||||
.pipe(ftp({
|
||||
host: '103.95.207.27',
|
||||
user: 'shops',
|
||||
pass: 'AWWyWBXww8'
|
||||
}))
|
||||
.pipe(gutil.noop());
|
||||
});
|
||||
19
node+vue/shop-fend/index.html
Executable file
@@ -0,0 +1,19 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<meta content="yes" name="apple-mobile-web-app-capable" />
|
||||
<meta content="black" name="apple-mobile-web-app-status-bar-style" />
|
||||
<meta content="telephone=no" name="format-detection" />
|
||||
<title>shop-fend</title>
|
||||
<script src="./static/js/ydui.flexible.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<!-- built files will be auto injected -->
|
||||
</body>
|
||||
|
||||
</html>
|
||||
11761
node+vue/shop-fend/package-lock.json
generated
Executable file
83
node+vue/shop-fend/package.json
Executable file
@@ -0,0 +1,83 @@
|
||||
{
|
||||
"name": "shop-fend",
|
||||
"version": "1.0.0",
|
||||
"description": "A Vue.js project",
|
||||
"author": "bmy",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
|
||||
"lint": "eslint --ext .js,.vue src",
|
||||
"build": "node build/build.js && npm run copy && npm run zip",
|
||||
"copy": "gulp copy",
|
||||
"zip": "gulp zip",
|
||||
"ftp": "gulp ftp"
|
||||
},
|
||||
"dependencies": {
|
||||
"vue": "^2.5.2",
|
||||
"vue-router": "^3.0.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"autoprefixer": "^7.1.2",
|
||||
"axios": "^0.18.0",
|
||||
"babel-core": "^6.22.1",
|
||||
"babel-eslint": "^8.2.1",
|
||||
"babel-helper-vue-jsx-merge-props": "^2.0.3",
|
||||
"babel-loader": "^7.1.1",
|
||||
"babel-plugin-syntax-jsx": "^6.18.0",
|
||||
"babel-plugin-transform-runtime": "^6.22.0",
|
||||
"babel-plugin-transform-vue-jsx": "^3.5.0",
|
||||
"babel-preset-env": "^1.3.2",
|
||||
"babel-preset-stage-2": "^6.22.0",
|
||||
"chalk": "^2.0.1",
|
||||
"copy-webpack-plugin": "^4.0.1",
|
||||
"css-loader": "^0.28.0",
|
||||
"eslint": "^4.15.0",
|
||||
"eslint-config-standard": "^10.2.1",
|
||||
"eslint-friendly-formatter": "^3.0.0",
|
||||
"eslint-loader": "^1.7.1",
|
||||
"eslint-plugin-import": "^2.7.0",
|
||||
"eslint-plugin-node": "^5.2.0",
|
||||
"eslint-plugin-promise": "^3.4.0",
|
||||
"eslint-plugin-standard": "^3.0.1",
|
||||
"eslint-plugin-vue": "^4.0.0",
|
||||
"extract-text-webpack-plugin": "^3.0.0",
|
||||
"file-loader": "^1.1.4",
|
||||
"friendly-errors-webpack-plugin": "^1.6.1",
|
||||
"gulp": "^3.9.1",
|
||||
"gulp-ftp": "^1.1.0",
|
||||
"gulp-util": "^3.0.8",
|
||||
"gulp-zip": "^4.2.0",
|
||||
"html-webpack-plugin": "^2.30.1",
|
||||
"node-notifier": "^5.1.2",
|
||||
"node-rsa": "^1.0.1",
|
||||
"optimize-css-assets-webpack-plugin": "^3.2.0",
|
||||
"ora": "^1.2.0",
|
||||
"portfinder": "^1.0.13",
|
||||
"postcss-import": "^11.0.0",
|
||||
"postcss-loader": "^2.0.8",
|
||||
"postcss-url": "^7.2.1",
|
||||
"rimraf": "^2.6.0",
|
||||
"semver": "^5.3.0",
|
||||
"shelljs": "^0.7.6",
|
||||
"uglifyjs-webpack-plugin": "^1.1.1",
|
||||
"url-loader": "^0.5.8",
|
||||
"vue-loader": "^13.3.0",
|
||||
"vue-style-loader": "^3.0.1",
|
||||
"vue-template-compiler": "^2.5.2",
|
||||
"vue-ydui": "^1.2.6",
|
||||
"webpack": "^3.6.0",
|
||||
"webpack-bundle-analyzer": "^2.9.0",
|
||||
"webpack-dev-server": "^2.9.1",
|
||||
"webpack-merge": "^4.1.0",
|
||||
"ydui-district": "^1.1.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 6.0.0",
|
||||
"npm": ">= 3.0.0"
|
||||
},
|
||||
"browserslist": [
|
||||
"> 1%",
|
||||
"last 2 versions",
|
||||
"not ie <= 8"
|
||||
]
|
||||
}
|
||||
1
node+vue/shop-fend/run/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
813861c9-d420-4845-a7ba-f19e9fc4d24d
|
||||
20
node+vue/shop-fend/run/package.json
Executable file
@@ -0,0 +1,20 @@
|
||||
{
|
||||
"name": "run",
|
||||
"version": "1.0.0",
|
||||
"description": "",
|
||||
"main": "server.js",
|
||||
"scripts": {
|
||||
"test": "echo \"Error: no test specified\" && exit 1",
|
||||
"start": "pm2 start server.js --watch -i max --name fend",
|
||||
"restart": "pm2 restart server.js",
|
||||
"stop": "pm2 stop fend",
|
||||
"list": "pm2 list",
|
||||
"log": "pm2 logs"
|
||||
},
|
||||
"keywords": [],
|
||||
"author": "",
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"express": "~4.16.0"
|
||||
}
|
||||
}
|
||||
8
node+vue/shop-fend/run/server.js
Executable file
@@ -0,0 +1,8 @@
|
||||
const express = require('express')
|
||||
const app = express()
|
||||
|
||||
app.use(express.static('./'))
|
||||
|
||||
app.listen(8848, () => {
|
||||
console.log('Example app listening on port 8848!')
|
||||
})
|
||||
1
node+vue/shop-fend/src/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
6bde340e-ff38-4f1b-93e4-3fe2d7114bb5
|
||||
103
node+vue/shop-fend/src/App.vue
Executable file
@@ -0,0 +1,103 @@
|
||||
<template>
|
||||
<div id="app">
|
||||
|
||||
<!-- 顶部导航 -->
|
||||
<menus :headerTitle="navbarTitle" v-if="showNavBar" ref="menus" @change="ChangeHeader"></menus>
|
||||
|
||||
<div class="content">
|
||||
<!-- 需要被缓存的组件 -->
|
||||
<keep-alive>
|
||||
<router-view v-if="$route.meta.keepAlive"/>
|
||||
</keep-alive>
|
||||
|
||||
<router-view v-if="!$route.meta.keepAlive"></router-view>
|
||||
</div>
|
||||
|
||||
<!-- 底部导航 -->
|
||||
<footers @change="ChangeHeader" ref="footer" v-if="showFooter"></footers>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// 头部导航
|
||||
import NavBarComponent from "./components/public/navbar";
|
||||
// 底部导航
|
||||
import TabBarComponent from "./components/public/tabbar";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// 标签卡标题
|
||||
navbarTitle: "我的",
|
||||
// 是否展示底部导航
|
||||
showFooter: true,
|
||||
// 是否展示顶部导航
|
||||
showNavBar: true
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
// 监听路由切换,进入对应页面执行对应隐藏操作
|
||||
$route(e) {
|
||||
switch (e.name) {
|
||||
case "info":
|
||||
this.showFooter = false;
|
||||
this.showNavBar = false;
|
||||
break;
|
||||
case "cart":
|
||||
this.showNavBar = false;
|
||||
break;
|
||||
case "me":
|
||||
this.showNavBar = false;
|
||||
break;
|
||||
case "login":
|
||||
localStorage.getItem("u") != null ? this.$router.back() : "";
|
||||
this.showNavBar = false;
|
||||
break;
|
||||
case "register":
|
||||
localStorage.getItem("u") != null ? this.$router.back() : "";
|
||||
this.showNavBar = false;
|
||||
break;
|
||||
default:
|
||||
this.showFooter = true;
|
||||
this.showNavBar = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
ChangeHeader(title) {
|
||||
this.navbarTitle = title;
|
||||
}
|
||||
},
|
||||
components: {
|
||||
menus: NavBarComponent,
|
||||
footers: TabBarComponent
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.yd-scrolltab {
|
||||
margin: 1rem 0 1.3rem 0;
|
||||
}
|
||||
.router-link-active {
|
||||
color: #ef4f4f !important;
|
||||
}
|
||||
.yd-checklist-item-icon {
|
||||
display: none !important;
|
||||
}
|
||||
.content,
|
||||
#app {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.g-fix-ios-prevent-scroll {
|
||||
overflow: auto !important;
|
||||
position: inherit !important;
|
||||
}
|
||||
.yd-preview-header > * {
|
||||
flex: none !important;
|
||||
}
|
||||
</style>
|
||||
1
node+vue/shop-fend/src/api/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
00c1c6d6-bfeb-4e7f-90f0-dbbc2c0b3537
|
||||
95
node+vue/shop-fend/src/api/index.js
Executable file
@@ -0,0 +1,95 @@
|
||||
|
||||
import Vue from 'vue'
|
||||
import axios from 'axios'
|
||||
import utils from '../lib';
|
||||
import { Toast, Loading } from 'vue-ydui/dist/lib.rem/dialog';
|
||||
|
||||
axios.defaults.baseURL = 'http://127.0.0.1:8080';
|
||||
axios.defaults.timeout = 3000;
|
||||
|
||||
|
||||
// 在前端发生给后端ajax中间进行一次拦截
|
||||
axios.interceptors.request.use(config => {
|
||||
Loading.open('数据正在路上...')
|
||||
return config;
|
||||
}, error => {
|
||||
return Promise.reject(error);
|
||||
});
|
||||
|
||||
// 在后端返回数据给前端之前拦截一下,主要做错误码的判断
|
||||
axios.interceptors.response.use(response => {
|
||||
switch (response.data.status) {
|
||||
case 200:
|
||||
Loading.close()
|
||||
return response;
|
||||
break;
|
||||
case 404:
|
||||
Toast({
|
||||
mes: '404',
|
||||
timeout: 1500,
|
||||
icon: 'error',
|
||||
})
|
||||
Loading.close()
|
||||
return response;
|
||||
break;
|
||||
default:
|
||||
Toast({
|
||||
mes: '网络请求失败',
|
||||
timeout: 1500,
|
||||
icon: 'error',
|
||||
})
|
||||
return response;
|
||||
break;
|
||||
}
|
||||
|
||||
}, error => {
|
||||
// 对响应错误做点什么
|
||||
return Promise.reject(error);
|
||||
});
|
||||
|
||||
|
||||
export default {
|
||||
/**
|
||||
* Get请求
|
||||
* @param {*object} params 请求参数
|
||||
* {
|
||||
* url: "/index", // url地址
|
||||
* par : { // 请求参数
|
||||
* }
|
||||
* }
|
||||
*/
|
||||
get(params) {
|
||||
return new Promise((resole, reject) => {
|
||||
axios.get(params.url)
|
||||
.then(success => {
|
||||
resole(success.data)
|
||||
})
|
||||
.catch(error => {
|
||||
Toast({
|
||||
mes: 'GET: 您的网络不好',
|
||||
timeout: 1500,
|
||||
icon: 'error',
|
||||
})
|
||||
});
|
||||
})
|
||||
},
|
||||
|
||||
post(params) {
|
||||
axios.defaults.headers.common['token'] = params.token;
|
||||
return new Promise((resole, reject) => {
|
||||
axios.post(params.url)
|
||||
.then(response => {
|
||||
resole(response.data);
|
||||
})
|
||||
.catch(error => {
|
||||
Loading.close()
|
||||
Toast({
|
||||
mes: 'POST: 您的网络不好',
|
||||
timeout: 1500,
|
||||
icon: 'error',
|
||||
})
|
||||
});
|
||||
})
|
||||
|
||||
}
|
||||
}
|
||||
1
node+vue/shop-fend/src/assets/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
72045ba8-e220-4ac0-8eb9-1d7b1006edf6
|
||||
1
node+vue/shop-fend/src/assets/css/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
7d74fb4a-03ab-4fb9-839b-6eb820a163c2
|
||||
106
node+vue/shop-fend/src/assets/css/cart.css
Executable file
@@ -0,0 +1,106 @@
|
||||
.cart-play {
|
||||
width: 100%;
|
||||
height: 45px;
|
||||
background: #fff;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: 48px;
|
||||
z-index: 99;
|
||||
}
|
||||
|
||||
.play-left {
|
||||
width: 60%;
|
||||
height: 100%;
|
||||
float: left;
|
||||
line-height: 45px;
|
||||
padding-left: 10px;
|
||||
}
|
||||
.play-right {
|
||||
width: 40%;
|
||||
background: #e43130;
|
||||
height: 100%;
|
||||
float: left;
|
||||
line-height: 45px;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
font-weight: 500;
|
||||
letter-spacing: 2px;
|
||||
font-size: 18px;
|
||||
}
|
||||
.demo-checklist-img {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
border: 1px solid #ececec;
|
||||
}
|
||||
.yd-flexbox-item {
|
||||
padding-left: 20px;
|
||||
}
|
||||
.yd-flexbox-item .item-name {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
color: #000;
|
||||
}
|
||||
.yd-flexbox-item .item-change {
|
||||
text-align: right;
|
||||
}
|
||||
.yd-flexbox-item .item-change .yd-spinner {
|
||||
width: 100px;
|
||||
height: 30px;
|
||||
}
|
||||
.yd-flexbox-item .item-price {
|
||||
font-size: 16px;
|
||||
color: #f00;
|
||||
}
|
||||
.total {
|
||||
width: 2rem;
|
||||
height: .6rem;
|
||||
float: left;
|
||||
margin: .1rem 0;
|
||||
}
|
||||
.numbers {
|
||||
width: 1rem;
|
||||
height: .6rem;
|
||||
line-height: .6rem;
|
||||
text-align: center;
|
||||
background: #fff;
|
||||
float: left;
|
||||
}
|
||||
.reduce,.plus{
|
||||
width: .5rem;
|
||||
height: .5rem;
|
||||
line-height: .5rem;
|
||||
text-align: center;
|
||||
float: left;
|
||||
border-radius: 100px;
|
||||
background: #fafafa;
|
||||
color: #666;
|
||||
}
|
||||
.delete {
|
||||
float: right;
|
||||
color: #8d8d8d;
|
||||
line-height: .5rem;
|
||||
}
|
||||
.action .price {
|
||||
color: red;
|
||||
float: left;
|
||||
margin-right: .1rem
|
||||
}
|
||||
.noCart {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.noCart img {
|
||||
width: 1.8rem;
|
||||
}
|
||||
.noCart p {
|
||||
font-size: .24rem;
|
||||
line-height: .38rem;
|
||||
color: #8d8d8d;
|
||||
margin-top: .24rem;
|
||||
}
|
||||
|
||||
110
node+vue/shop-fend/src/assets/css/info.css
Executable file
@@ -0,0 +1,110 @@
|
||||
.main-info {
|
||||
background: #fff;
|
||||
|
||||
}
|
||||
.info-three {
|
||||
padding: 16.667px;
|
||||
}
|
||||
.info-header h3{
|
||||
font-size: 20.8333px;
|
||||
color: rgb(60, 60, 60);
|
||||
font-weight: 500;
|
||||
line-height: 31.25px;
|
||||
}
|
||||
.header-top{
|
||||
color: rgba(0,0,0,.54)
|
||||
}
|
||||
.header-top span {
|
||||
color: rgb(255, 74, 0);
|
||||
}
|
||||
.price {
|
||||
padding-top: 10.4167px;
|
||||
font-size: 12.5px;
|
||||
color: rgba(0, 0, 0, 0.54);
|
||||
}
|
||||
.price em {
|
||||
margin-right: 8.33333px;
|
||||
font-size: 25px;
|
||||
line-height: 25px;
|
||||
color: rgb(255, 103, 0);
|
||||
text-decoration: none;
|
||||
}
|
||||
.price span {
|
||||
text-decoration: line-through;
|
||||
}
|
||||
.info-configure {
|
||||
margin-top: 23px;
|
||||
height: auto;
|
||||
}
|
||||
.configure-server {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height: 42px;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 13px;
|
||||
color: rgb(153, 153, 153);
|
||||
}
|
||||
.configure-server div:first-child{
|
||||
flex-grow: 1;
|
||||
}
|
||||
.configure-server div:last-child{
|
||||
flex-grow: 7;
|
||||
}
|
||||
.info-introduce img {
|
||||
width: 100%;
|
||||
}
|
||||
.cart-list {
|
||||
margin: 0 8.3333px 8.3333px;
|
||||
background: rgba(255, 255, 255, 0.93);
|
||||
height: 57.2px;
|
||||
-webkit-box-shadow: 0 2px 4px -1px rgba(0,0,0,.2), 0 4px 5px rgba(0,0,0,.14), 0 1px 10px rgba(0,0,0,.12);
|
||||
box-shadow: 0 2px 4px -1px rgba(0,0,0,.2), 0 4px 5px rgba(0,0,0,.14), 0 1px 10px rgba(0,0,0,.12);
|
||||
border: 1px solid #e5e5e5;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
width: 96%;
|
||||
bottom: 0;
|
||||
border-radius: 8.333px;
|
||||
display: flex;
|
||||
align-items:center;
|
||||
justify-content: space-around;
|
||||
z-index: 999;
|
||||
}
|
||||
.items-icons {
|
||||
flex-grow: 1;
|
||||
color: rgba(0,0,0,.54);
|
||||
}
|
||||
.items-big {
|
||||
flex-grow: 2;
|
||||
}
|
||||
.items-big .add-cart {
|
||||
float: right;
|
||||
margin-right: 16.667px;
|
||||
width: 2.3rem;
|
||||
}
|
||||
.header-action {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: .88rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
z-index: 99;
|
||||
padding: 0 .2rem;
|
||||
transition: all 2s
|
||||
}
|
||||
.header-action .action-left,
|
||||
.header-action .action-right{
|
||||
width: .62rem;
|
||||
height: .6rem;
|
||||
background: rgba(0, 0, 0, 0.12);
|
||||
border-radius: 100%;
|
||||
text-align: center;
|
||||
line-height: .63rem;
|
||||
}
|
||||
.white {
|
||||
background: #fff !important;
|
||||
}
|
||||
1
node+vue/shop-fend/src/assets/css/me.css
Executable file
@@ -0,0 +1 @@
|
||||
|
||||
55
node+vue/shop-fend/src/assets/css/order.css
Executable file
@@ -0,0 +1,55 @@
|
||||
.flex-layout {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 .26rem;
|
||||
margin-bottom: .2rem;
|
||||
margin-top: .2rem;
|
||||
height: .9rem;
|
||||
width: 100%;
|
||||
background: #fff;
|
||||
}
|
||||
.order-address {
|
||||
margin-top: 60px;
|
||||
background: #fff url("http://s1.mi.com/m/images/m/bd1.png") 0 0 repeat-x;
|
||||
background-size: .52rem .08rem;
|
||||
}
|
||||
.pay-list img{
|
||||
width: 23px;
|
||||
flex-grow: 1;
|
||||
margin-right: .2rem;
|
||||
}
|
||||
.pay-list p{
|
||||
flex-grow: 17;
|
||||
}
|
||||
.alipay,
|
||||
.wxpay {
|
||||
width: 12px !important;
|
||||
margin-left: .16rem;
|
||||
}
|
||||
.order-footer {
|
||||
width: 100%;
|
||||
height: 1rem;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
z-index: 99;
|
||||
}
|
||||
.footer-left,
|
||||
.footer-right {
|
||||
float: left;
|
||||
width: 50%;
|
||||
height: 1rem;
|
||||
line-height: 1rem;
|
||||
}
|
||||
.footer-left {
|
||||
background: #fff;
|
||||
text-align: center;
|
||||
}
|
||||
.footer-right {
|
||||
background: red;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
139
node+vue/shop-fend/src/assets/css/wxpay.css
Executable file
@@ -0,0 +1,139 @@
|
||||
.weixinPay {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: fixed;
|
||||
z-index: 991;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
.zhez {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
z-index: 992;
|
||||
background: #000;
|
||||
opacity: .4;
|
||||
}
|
||||
.pay-windows {
|
||||
position: absolute;
|
||||
width: 88%;
|
||||
height: 4.8rem;
|
||||
background: #f8f8f8;
|
||||
top: .5rem;
|
||||
z-index: 993;
|
||||
left: 50%;
|
||||
margin-left: -3.3rem;
|
||||
}
|
||||
.windows-title {
|
||||
width: 100%;
|
||||
height: 1.08rem;
|
||||
border-bottom: 1px solid #c9daca;
|
||||
}
|
||||
.windows-title img {
|
||||
width: .66rem;
|
||||
}
|
||||
.windows-title span {
|
||||
padding-left: .1rem;
|
||||
font-size: .32rem;
|
||||
}
|
||||
.flex-layout {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.windows-money {
|
||||
height: 1.42rem;
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
.windows-money span {
|
||||
font-size: .28rem;
|
||||
}
|
||||
.windows-money p {
|
||||
font-size: .5rem;
|
||||
}
|
||||
.windows-card{
|
||||
width: 89%;
|
||||
margin: 0 auto;
|
||||
line-height: .8rem;
|
||||
color: #636363;
|
||||
font-size: .32rem;
|
||||
padding: .1rem 0;
|
||||
overflow: hidden;
|
||||
border-bottom: .02rem solid #e6e6e6;
|
||||
border-top: .02rem solid #e6e6e6;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.windows-card img{
|
||||
width: .6rem;
|
||||
flex-grow: 1;
|
||||
}
|
||||
.windows-card p{
|
||||
flex-grow: 18;
|
||||
margin-left: .1rem;
|
||||
}
|
||||
.input ul {
|
||||
width: 89%;
|
||||
margin: .2rem auto;
|
||||
height: .8rem;
|
||||
overflow: hidden;
|
||||
border: .02rem solid #bebebe;
|
||||
display: flex;
|
||||
}
|
||||
.input ul li {
|
||||
border-right: .02rem solid #efefef;
|
||||
height: .8rem;
|
||||
width: .972rem;
|
||||
background: #fff;
|
||||
}
|
||||
.numb_box{
|
||||
position: absolute;
|
||||
z-index: 10;
|
||||
background: #f5f5f5;
|
||||
width: 100%;
|
||||
height: 4.66rem;
|
||||
bottom: 0;
|
||||
z-index: 993
|
||||
}
|
||||
.xiaq_tb {
|
||||
padding: 5px 0;
|
||||
text-align: center;
|
||||
border-top: 1px solid #dadada;
|
||||
}
|
||||
.xiaq_tb img{
|
||||
height: .2rem;
|
||||
}
|
||||
.nub_ggg {
|
||||
border: 1px solid #dadada;
|
||||
overflow: hidden;
|
||||
border-bottom: 0;
|
||||
}
|
||||
.nub_ggg li {
|
||||
width: 33.3333%;
|
||||
border-bottom: 1px solid #dadada;
|
||||
float: left;
|
||||
text-align: center;
|
||||
font-size: 22px;
|
||||
height: 1.03rem;
|
||||
line-height: 1.03rem;
|
||||
}
|
||||
.nub_ggg .zj_x {
|
||||
border-left: 1px solid #dadada;
|
||||
border-right: 1px solid #dadada;
|
||||
}
|
||||
.nub_ggg .no {
|
||||
background: #e0e0e0
|
||||
}
|
||||
.no img{
|
||||
width: 37.3px;
|
||||
height: 22.44px;
|
||||
}
|
||||
|
||||
.pwd{
|
||||
background: rgb(255, 255, 255) url("../../../static/img/dd_03.jpg") center no-repeat !important;
|
||||
background-size: 25% !important;
|
||||
}
|
||||
1
node+vue/shop-fend/src/assets/js/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
3f20de2f-540a-4bb0-8687-b1bc62421c1a
|
||||
1
node+vue/shop-fend/src/components/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
ffd1485c-02dc-4ed7-bd44-36b6f0f3a217
|
||||
1
node+vue/shop-fend/src/components/public/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
607ceb58-c47e-4bb2-a2e7-e33267a1b51f
|
||||
91
node+vue/shop-fend/src/components/public/navbar.vue
Executable file
@@ -0,0 +1,91 @@
|
||||
<template>
|
||||
<div class="v-navbar">
|
||||
<yd-search
|
||||
class="search"
|
||||
:result="result"
|
||||
fullpage
|
||||
v-model="searchKey"
|
||||
placeholder="搜索商品名称"
|
||||
:item-click="itemClickHandler"
|
||||
:on-submit="submitHandler"
|
||||
:on-cancel="cancelHandler">
|
||||
</yd-search>
|
||||
<yd-icon name="ucenter-outline" @click.native="$router.push({ name: 'me'})" color="#8d8d8d" class="me-icon"></yd-icon>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: ["headerTitle"],
|
||||
data() {
|
||||
return {
|
||||
searchKey: "",
|
||||
result: []
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
changeTitle(ti) {
|
||||
this.$emit("change", ti);
|
||||
this.$router.go(-1);
|
||||
},
|
||||
getResult(val) {
|
||||
if (!val) return [];
|
||||
return [
|
||||
"Apple",
|
||||
"Banana",
|
||||
"Orange",
|
||||
"Durian",
|
||||
"Lemon",
|
||||
"Peach",
|
||||
"Cherry",
|
||||
"Berry",
|
||||
"Core",
|
||||
"Fig",
|
||||
"Haw",
|
||||
"Melon",
|
||||
"Plum",
|
||||
"Pear",
|
||||
"Peanut",
|
||||
"Other"
|
||||
].filter(value => new RegExp(val, "i").test(value));
|
||||
},
|
||||
// 匹配结果点击事件
|
||||
itemClickHandler(item) {
|
||||
this.$dialog.toast({ mes: `搜索1:${item}` });
|
||||
},
|
||||
// 提交时触发方法
|
||||
submitHandler(value) {
|
||||
this.$dialog.toast({ mes: `搜索2:${value}` });
|
||||
},
|
||||
cancelHandler() {
|
||||
this.searchKey = "";
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
searchKey(val) {
|
||||
this.result = this.getResult(val);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.v-navbar {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
z-index: 999;
|
||||
background: #efeff4;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.search {
|
||||
flex-grow: 1;
|
||||
}
|
||||
.me-icon {
|
||||
padding-right: 8px;
|
||||
}
|
||||
</style>
|
||||
21
node+vue/shop-fend/src/components/public/swiper.vue
Executable file
@@ -0,0 +1,21 @@
|
||||
<template>
|
||||
<div class="swiper">
|
||||
<yd-slider autoplay="3000">
|
||||
<yd-slider-item v-for="(item,index) in imglist" :key="index">
|
||||
<a :href="item.href">
|
||||
<img :src="item.url">
|
||||
</a>
|
||||
</yd-slider-item>
|
||||
</yd-slider>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: ["imglist"]
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
34
node+vue/shop-fend/src/components/public/tabbar.vue
Executable file
@@ -0,0 +1,34 @@
|
||||
<template>
|
||||
<div class="tabbar">
|
||||
<yd-tabbar slot="tabbar" fixed>
|
||||
<yd-tabbar-item title="首页" link="/" @click.native="changeTitle('首页')">
|
||||
<yd-icon name="home" size=".4rem" slot="icon"></yd-icon>
|
||||
</yd-tabbar-item>
|
||||
<!-- <yd-tabbar-item title="分类" link="/class" @click.native="changeTitle('分类')">
|
||||
<yd-icon name="type" size=".4rem" slot="icon"></yd-icon>
|
||||
</yd-tabbar-item> -->
|
||||
<yd-tabbar-item title="购物车" link="/cart" @click.native="changeTitle('购物车')">
|
||||
<yd-icon name="shopcart-outline" size=".4rem" slot="icon"></yd-icon>
|
||||
</yd-tabbar-item>
|
||||
|
||||
<yd-tabbar-item title="我的" link="/me" @click.native="changeTitle('我的')">
|
||||
<yd-icon name="ucenter-outline" size=".4rem" slot="icon"></yd-icon>
|
||||
</yd-tabbar-item>
|
||||
</yd-tabbar>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
<script>
|
||||
export default {
|
||||
methods: {
|
||||
changeTitle(ti) {
|
||||
this.$emit("change", ti);
|
||||
//console.log(this.$root.$children[0].$data.navbarTitle =ti)
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
42
node+vue/shop-fend/src/components/public/user-header.vue
Executable file
@@ -0,0 +1,42 @@
|
||||
<template>
|
||||
<div class="me-header">
|
||||
<img class="user-logo" src="https://m.mi.com/static/img/avatar.76a75b8f17.png" alt="">
|
||||
<p>{{title}}</p>
|
||||
<span v-if="yue">¥{{yue}}</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
title: String,
|
||||
yue: String
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.me-header {
|
||||
width: 100%;
|
||||
height: 4.6rem;
|
||||
background: url("https://m.mi.com/static/img/bg.63c8e19851.png") center 0
|
||||
#f37d0f;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
.me-header img {
|
||||
width: 1.6rem;
|
||||
}
|
||||
.me-header p {
|
||||
color: #fff;
|
||||
margin-top: 0.4rem;
|
||||
font-size: 0.3rem;
|
||||
letter-spacing: 3px;
|
||||
}
|
||||
.me-header span {
|
||||
color: #ffd000;
|
||||
margin-top: 5px;
|
||||
}
|
||||
</style>
|
||||
166
node+vue/shop-fend/src/components/public/wxpay.vue
Executable file
@@ -0,0 +1,166 @@
|
||||
<template>
|
||||
<div class="weixinPay" v-if="wxxxpay">
|
||||
<p hidden :name="NowMoney = MoneyTotals"></p>
|
||||
<div class="pay-windows">
|
||||
<div class="windows-title flex-layout">
|
||||
<img src="../../../static/img/xx_03.jpg" @click="changFatherStatus">
|
||||
<img src="../../../static/img/jftc_03.jpg" alt="">
|
||||
<span>请输入支付密码</span>
|
||||
</div>
|
||||
<div class="windows-money flex-layout">
|
||||
<span>心机购官方直营店</span>
|
||||
<p>¥ {{MoneyTotals}}</p>
|
||||
</div>
|
||||
<div class="windows-card">
|
||||
<img src="../../../static/img/ye.png" alt="">
|
||||
<p>余额</p>
|
||||
<img src="../../../static/img/jftc_09.jpg" alt="">
|
||||
</div>
|
||||
<div class="input">
|
||||
<ul>
|
||||
<li v-for="(pwds,index) in passwordList"
|
||||
:key="index"
|
||||
:class="pwds.hasClass ? 'pwd' : '' "
|
||||
@click="hidden = true"></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="numb_box" v-if="hidden">
|
||||
<div class="xiaq_tb" @click="hidden = false">
|
||||
<img src="../../../static/img/jftc_14.jpg" alt="">
|
||||
</div>
|
||||
<ul class="nub_ggg">
|
||||
<li v-for="(item,index) in keyNumber"
|
||||
:key="index"
|
||||
:class="item.haveClass == 0 ? '' : item.haveClass == 1 ? 'zj_x' : 'no' "
|
||||
@click="item.haveClass == 2 ? '': item.haveClass == 3 ? deletePay() : submitPay() ">
|
||||
{{item.num == 'space' ? '' : item.num == 'delete' ? '' : item.num }}
|
||||
<img v-if="index == 11" :src="item.imgUrl" alt="">
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="zhez">
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
wxxxpay: false,
|
||||
MoneyTotals: Number
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
keyNumber: [
|
||||
{
|
||||
num: 1,
|
||||
haveClass: 0
|
||||
},
|
||||
{
|
||||
num: 2,
|
||||
haveClass: 1
|
||||
},
|
||||
{
|
||||
num: 3,
|
||||
haveClass: 0
|
||||
},
|
||||
{
|
||||
num: 4,
|
||||
haveClass: 0
|
||||
},
|
||||
{
|
||||
num: 5,
|
||||
haveClass: 1
|
||||
},
|
||||
{
|
||||
num: 6,
|
||||
haveClass: 0
|
||||
},
|
||||
{
|
||||
num: 7,
|
||||
haveClass: 0
|
||||
},
|
||||
{
|
||||
num: 8,
|
||||
haveClass: 1
|
||||
},
|
||||
{
|
||||
num: 9,
|
||||
haveClass: 0
|
||||
},
|
||||
{
|
||||
num: "space",
|
||||
haveClass: 2
|
||||
},
|
||||
{
|
||||
num: 0,
|
||||
haveClass: 1
|
||||
},
|
||||
{
|
||||
num: "delete",
|
||||
haveClass: 3,
|
||||
imgUrl: "../../../static/img/jftc_18.jpg"
|
||||
}
|
||||
],
|
||||
passwordList: [
|
||||
{
|
||||
setClass: "pwd",
|
||||
hasClass: false
|
||||
},
|
||||
{
|
||||
setClass: "pwd",
|
||||
hasClass: false
|
||||
},
|
||||
{
|
||||
setClass: "pwd",
|
||||
hasClass: false
|
||||
},
|
||||
{
|
||||
setClass: "pwd",
|
||||
hasClass: false
|
||||
},
|
||||
{
|
||||
setClass: "pwd",
|
||||
hasClass: false
|
||||
},
|
||||
{
|
||||
setClass: "pwd",
|
||||
hasClass: false
|
||||
}
|
||||
],
|
||||
i: 0,
|
||||
hidden: true
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
changFatherStatus() {
|
||||
this.$emit("change", false);
|
||||
},
|
||||
submitPay() {
|
||||
this.i++;
|
||||
if (this.i < 6) {
|
||||
this.passwordList[this.i - 1].hasClass = true;
|
||||
} else {
|
||||
this.passwordList[this.i - 1].hasClass = true;
|
||||
setTimeout(() => {
|
||||
this.$router.push({ name: "result" });
|
||||
}, 500);
|
||||
}
|
||||
},
|
||||
deletePay() {
|
||||
if (this.i > 0) {
|
||||
this.i--;
|
||||
this.passwordList[this.i].hasClass = false;
|
||||
this.i == 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
@import url("../../assets/css/wxpay.css");
|
||||
</style>
|
||||
1
node+vue/shop-fend/src/components/view/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
b6a8bf70-d64e-43e7-900a-7cf7dcd91db1
|
||||
106
node+vue/shop-fend/src/components/view/adduser.vue
Executable file
@@ -0,0 +1,106 @@
|
||||
<template>
|
||||
<div class="adduser">
|
||||
<v-header :title="'注册'"></v-header>
|
||||
<yd-cell-group>
|
||||
<yd-cell-item>
|
||||
<yd-input slot="right" required type="number" ref="phone" v-model="userPhone" regex="mobile" placeholder="手机号"></yd-input>
|
||||
</yd-cell-item>
|
||||
<yd-cell-item>
|
||||
<yd-input slot="right" required type="text" ref="nicname" min="3" max="10" v-model="userNicName" placeholder="昵称(3-10)"></yd-input>
|
||||
</yd-cell-item>
|
||||
<yd-cell-item>
|
||||
<yd-input slot="right" required type="password" ref="surepwd" min="6" max="20" v-model="userPwd" placeholder="密码(6-20)"></yd-input>
|
||||
</yd-cell-item>
|
||||
<yd-cell-item>
|
||||
<yd-input slot="right" required type="password" ref="surepwds" min="6" max="20" v-model="userSurePwd" placeholder="确认密码(6-20)"></yd-input>
|
||||
</yd-cell-item>
|
||||
</yd-cell-group>
|
||||
<yd-button-group>
|
||||
<yd-button size="large" type="primary" bgcolor="#f37d0f" color="#fff" shape="circle" @click.native="clickHander">注册</yd-button>
|
||||
</yd-button-group>
|
||||
|
||||
<div class="reg-tips">
|
||||
<a class="index" href="#/">首页</a>
|
||||
<a class="action" href="#/login">登录</a>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import UserHeader from "./../public/user-header";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
userPhone: null,
|
||||
userNicName: null,
|
||||
userPwd: null,
|
||||
userSurePwd: null
|
||||
};
|
||||
},
|
||||
beforeRouteEnter(to, from, next) {
|
||||
next(vm => {
|
||||
vm.$parent.$data.showFooter = false;
|
||||
vm.$parent.$data.showNavBar = false;
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
async clickHander() {
|
||||
if (
|
||||
this.$refs.phone.valid &&
|
||||
this.$refs.nicname.valid &&
|
||||
this.$refs.surepwd.valid &&
|
||||
this.$refs.surepwds.valid
|
||||
) {
|
||||
if (this.userPwd == this.userSurePwd) {
|
||||
let list = await this.$http.post({
|
||||
url: "/user/addUser",
|
||||
token: this.$utils.encrypt({
|
||||
phone: this.userPhone,
|
||||
nickname: this.userNicName,
|
||||
pwd: this.userSurePwd
|
||||
})
|
||||
});
|
||||
if (list.data.affectedRows == 1) {
|
||||
this.$dialog.toast({
|
||||
mes: "注册成功",
|
||||
timeout: 1500,
|
||||
icon: "success",
|
||||
callback: () => {
|
||||
this.$router.push({ name: "login" });
|
||||
}
|
||||
});
|
||||
}
|
||||
} else {
|
||||
this.$dialog.toast({
|
||||
mes: "密码不一致",
|
||||
timeout: 1500
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
components: {
|
||||
"v-header": UserHeader
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.reg-tips {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 21px;
|
||||
color: #919191;
|
||||
letter-spacing: 2px;
|
||||
padding: 0 12px;
|
||||
font-size: 12px;
|
||||
}
|
||||
.action {
|
||||
float: right;
|
||||
}
|
||||
.index {
|
||||
float: left;
|
||||
}
|
||||
</style>
|
||||
128
node+vue/shop-fend/src/components/view/cart.vue
Executable file
@@ -0,0 +1,128 @@
|
||||
<template>
|
||||
<div class="cart">
|
||||
<div v-if="cartList.length == 0" class="noCart">
|
||||
<img src="../../../static/img/nocart.png" alt="没有数据">
|
||||
<p>再忙 <br> 也要买点东西犒劳自己</p>
|
||||
</div>
|
||||
<div class="cart-listshop" v-else>
|
||||
<yd-checklist v-model="checklist4" :label="false">
|
||||
<yd-checklist-item v-for="(item,index) in cartList" :key="index" :val="item.cid">
|
||||
<yd-flexbox style="padding: 15px 0;">
|
||||
<img :src="item.commodity_thumbnail" class="demo-checklist-img">
|
||||
<yd-flexbox-item align="top">
|
||||
{{item.commodity_name}}<br/>
|
||||
{{item.commodity_content | SpliceString}}<br/>
|
||||
<div class="total">
|
||||
<div class="reduce" @click="reduce(index)">-</div>
|
||||
<div class="numbers">{{item.cart_nums}}</div>
|
||||
<div class="plus" @click="plus(index)">+</div>
|
||||
</div>
|
||||
<br><br><br>
|
||||
<div class="action">
|
||||
<p class="price">单价: {{item.commodity_nowprice}}</p>
|
||||
<span> 小计: {{item.commodity_nowprice * item.cart_nums}}</span>
|
||||
<span class="delete" @click="deleteShop(index,item.cid)">删除</span>
|
||||
</div>
|
||||
</yd-flexbox-item>
|
||||
</yd-flexbox>
|
||||
</yd-checklist-item>
|
||||
</yd-checklist>
|
||||
<div class="cart-play">
|
||||
<div class="play-left">
|
||||
总计:{{totalPrice}} 元
|
||||
</div>
|
||||
<div class="play-right" @click="submitOrder()">
|
||||
下单买({{cartList.length}})
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
created() {
|
||||
this.getCartList();
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
checklist4: [],
|
||||
spinner1: 0,
|
||||
cartList: []
|
||||
};
|
||||
},
|
||||
beforeRouteEnter(to, from, next) {
|
||||
next(vm => {
|
||||
vm.$parent.$data.showFooter = true;
|
||||
vm.$parent.$data.showNavBar = false;
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
submitOrder() {
|
||||
this.$utils.SetLocalstorage("data", this.cartList);
|
||||
this.$router.push({ name: "order" });
|
||||
},
|
||||
// 删除商品的操作
|
||||
async deleteShop(index, cid) {
|
||||
this.cartList.splice(index, 1);
|
||||
let deletes = await this.$http.post({
|
||||
url: "/cart/deleteCart",
|
||||
token: this.$utils.encrypt({
|
||||
cid: cid
|
||||
})
|
||||
});
|
||||
},
|
||||
// 减商品数量的操作
|
||||
reduce(index) {
|
||||
this.cartList[index].cart_nums <= 1
|
||||
? ""
|
||||
: this.cartList[index].cart_nums--;
|
||||
},
|
||||
// 加商品数量操作
|
||||
plus(index) {
|
||||
this.cartList[index].cart_nums >= this.cartList[index].commodity_stock
|
||||
? ""
|
||||
: this.cartList[index].cart_nums++;
|
||||
},
|
||||
/**
|
||||
* 获取购物车列表的数据
|
||||
*/
|
||||
async getCartList() {
|
||||
let shoplist = await this.$http.post({
|
||||
url: "/cart/selectCart",
|
||||
token: this.$utils.encrypt({ userid: this.$utils.getUserInfo().id })
|
||||
});
|
||||
shoplist.status == 200 ? (this.cartList = shoplist.data) : [];
|
||||
}
|
||||
},
|
||||
// 计算属性,计算商品的总价
|
||||
computed: {
|
||||
totalPrice() {
|
||||
let total = 0;
|
||||
for (const key in this.cartList) {
|
||||
total +=
|
||||
this.cartList[key].cart_nums * this.cartList[key].commodity_nowprice;
|
||||
}
|
||||
return total;
|
||||
}
|
||||
},
|
||||
// 过滤器,裁剪手机的介绍文字
|
||||
filters: {
|
||||
SpliceString(val) {
|
||||
return val.substring(0, 30) + "...";
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
@import url("../../assets/css/cart.css");
|
||||
.cart {
|
||||
height: 100%;
|
||||
}
|
||||
.cart-listshop {
|
||||
padding: 0 0 1.95rem 0;
|
||||
}
|
||||
</style>
|
||||
39
node+vue/shop-fend/src/components/view/class.vue
Executable file
@@ -0,0 +1,39 @@
|
||||
<template>
|
||||
<div class="class">
|
||||
<yd-scrolltab :callback="getKey">
|
||||
<yd-scrolltab-panel label="小米" icon="demo-icons-category1">
|
||||
<div style="height: 350px;background-color: gray;"></div>
|
||||
</yd-scrolltab-panel>
|
||||
|
||||
<yd-scrolltab-panel label="华为" icon="demo-icons-category2" active>
|
||||
<div style="height: 350px;background-color: blue;"></div>
|
||||
</yd-scrolltab-panel>
|
||||
|
||||
<yd-scrolltab-panel label="一加" icon="demo-icons-category3">
|
||||
<div style="height: 350px;background-color: yellow;"></div>
|
||||
</yd-scrolltab-panel>
|
||||
|
||||
<yd-scrolltab-panel label="三星" icon="demo-icons-category3">
|
||||
<div style="height: 350px;background-color: yellow;"></div>
|
||||
</yd-scrolltab-panel>
|
||||
|
||||
<yd-scrolltab-panel label="锤子" icon="demo-icons-category3">
|
||||
<div style="height: 350px;background-color: yellow;"></div>
|
||||
</yd-scrolltab-panel>
|
||||
|
||||
</yd-scrolltab>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
methods: {
|
||||
getKey(index) {
|
||||
console.log(index);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
139
node+vue/shop-fend/src/components/view/index.vue
Executable file
@@ -0,0 +1,139 @@
|
||||
<template>
|
||||
<div class="index">
|
||||
<!-- 轮播图 -->
|
||||
<swiper :imglist="swiperList"></swiper>
|
||||
<!-- 分类 -->
|
||||
<yd-grids-group :rows="3" >
|
||||
<yd-grids-item v-for="n in classList" :key="n.id" @click.native="enterInfo(n.title)">
|
||||
<img slot="icon" :src="n.url">
|
||||
<span slot="text">{{n.title}}</span>
|
||||
</yd-grids-item>
|
||||
</yd-grids-group>
|
||||
|
||||
<!-- 广告 -->
|
||||
<div class="row_shop">
|
||||
<img src="../../../static/img/ad_1.jpg" alt="">
|
||||
</div>
|
||||
|
||||
<!-- 商品列表 -->
|
||||
<yd-list theme="3">
|
||||
<yd-list-item v-for="item in shopList" :key="item.id" @click.native="EnterInfo(item.id)">
|
||||
<img slot="img" :src="item.commodity_thumbnail">
|
||||
<span slot="title">{{item.commodity_name}}</span>
|
||||
<yd-list-other slot="other">
|
||||
<div>
|
||||
<span class="demo-list-price"><em>¥</em>{{item.commodity_nowprice}}</span>
|
||||
<span class="demo-list-del-price">¥{{item.commodity_oldprice}}</span>
|
||||
</div>
|
||||
<div>销量:{{item.commodity_sales}}</div>
|
||||
</yd-list-other>
|
||||
</yd-list-item>
|
||||
</yd-list>
|
||||
|
||||
<!-- 分类的弹窗 -->
|
||||
<yd-popup v-model="showClass" position="left" width="100%">
|
||||
<yd-navbar :title="'分类 '+NavBarClassTitle" fixed>
|
||||
<router-link to="" @click.native="showClass = false" slot="left">
|
||||
<yd-navbar-back-icon></yd-navbar-back-icon>
|
||||
</router-link>
|
||||
|
||||
</yd-navbar>
|
||||
<br><br><br>
|
||||
<yd-list theme="1">
|
||||
<yd-list-item v-for="n in classShopList" :key="n.id" @click.native="EnterInfo(n.id)">
|
||||
<img slot="img" :src="n.commodity_thumbnail">
|
||||
<span slot="title">{{n.commodity_name}}</span>
|
||||
<yd-list-other slot="other">
|
||||
<div>
|
||||
<span class="demo-list-price"><em>¥</em>{{n.commodity_nowprice}}</span>
|
||||
<span class="demo-list-del-price">¥{{n.commodity_oldprice}}</span>
|
||||
</div>
|
||||
<div>销量:{{n.commodity_sales}}</div>
|
||||
</yd-list-other>
|
||||
</yd-list-item>
|
||||
</yd-list>
|
||||
</yd-popup>
|
||||
|
||||
<!-- 回到顶部 -->
|
||||
<yd-backtop></yd-backtop>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import SwiperComponent from "../public/swiper";
|
||||
export default {
|
||||
created() {
|
||||
this.getHomeData();
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
showClass: false,
|
||||
swiperList: [
|
||||
{
|
||||
id: "1",
|
||||
href: "",
|
||||
url: "../../../static/img/banner_1.jpg"
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
href: "",
|
||||
url: "../../../static/img/banner_2.jpg"
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
href: "",
|
||||
url: "../../../static/img/banner_3.jpg"
|
||||
}
|
||||
],
|
||||
classList: this.$config.pageConfig.index.classList,
|
||||
shopList: [],
|
||||
classShopList: [],
|
||||
NavBarClassTitle: null
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
// 进入详情
|
||||
EnterInfo(ids) {
|
||||
this.$router.push({ name: "info", params: { id: ids } });
|
||||
},
|
||||
// 获取首页数据
|
||||
async getHomeData() {
|
||||
let list = await this.$http.get({
|
||||
url: "/shop/index",
|
||||
body: {
|
||||
|
||||
}
|
||||
});
|
||||
this.shopList = list.data;
|
||||
},
|
||||
// 获取分类数据
|
||||
async enterInfo(type) {
|
||||
let Class = await this.$http.get({
|
||||
url: "/shop/class",
|
||||
token: this.$utils.encrypt({
|
||||
brand: type
|
||||
})
|
||||
});
|
||||
|
||||
this.classShopList = Class.data;
|
||||
this.NavBarClassTitle = type;
|
||||
this.showClass = true;
|
||||
}
|
||||
},
|
||||
components: {
|
||||
swiper: SwiperComponent
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
<style scoped>
|
||||
.index {
|
||||
padding: 1rem 0 1.3rem 0;
|
||||
}
|
||||
.row_shop img {
|
||||
width: 100%;
|
||||
height: 3rem;
|
||||
}
|
||||
</style>
|
||||
194
node+vue/shop-fend/src/components/view/info.vue
Executable file
@@ -0,0 +1,194 @@
|
||||
<template>
|
||||
<div class="info">
|
||||
<!-- 顶部商品主图轮播 -->
|
||||
<swiper :imglist="infoMain"></swiper>
|
||||
|
||||
<!-- 主要商品信息 -->
|
||||
<div class="main-info">
|
||||
<div class="info-three">
|
||||
<div class="info-header">
|
||||
<h3>{{ infoList.commodity_name }}</h3>
|
||||
<div class="header-top">
|
||||
{{infoList.commodity_content}}
|
||||
</div>
|
||||
<div class="price">
|
||||
<em>
|
||||
¥ {{ infoList.commodity_nowprice }}
|
||||
</em>
|
||||
<span>
|
||||
¥ {{ infoList.commodity_oldprice }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="info-configure">
|
||||
<div class="configure-server">
|
||||
<div>
|
||||
服务
|
||||
</div>
|
||||
<div>
|
||||
15天退货 · 运费险 · 公益宝贝
|
||||
</div>
|
||||
</div>
|
||||
<div class="configure-server">
|
||||
<div>
|
||||
参数
|
||||
</div>
|
||||
<div>
|
||||
品牌 Apple型号...
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="info-address"></div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="info-introduce">
|
||||
<img v-for="(item,index) in attachimg" :key="index" :src="item.url" alt="">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 底部商品统计购买 -->
|
||||
<div class="cart-list">
|
||||
<yd-tabbar-item title="首页" link="/" class="items-icons">
|
||||
<yd-icon name="home-outline" color="rgba(0,0,0,.54)" slot="icon" size="0.54rem"></yd-icon>
|
||||
</yd-tabbar-item>
|
||||
<yd-tabbar-item title="购物车" link="/cart" class="items-icons">
|
||||
<yd-icon name="shopcart-outline" color="rgba(0,0,0,.54)" slot="icon" size="0.54rem"></yd-icon>
|
||||
</yd-tabbar-item>
|
||||
<div class="items-big">
|
||||
<yd-button
|
||||
@click.native="isShowAddCartAction ? addCart() : '' "
|
||||
:class="[ isShowAddCartAction ? 'cartActive' : 'noActive' ,'add-cart']"
|
||||
size="small" shape="circle">
|
||||
{{ isShowAddCartAction ? '加入购物车': '购物车已存在' }}
|
||||
</yd-button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- 返回顶部 -->
|
||||
<yd-backtop></yd-backtop>
|
||||
|
||||
<div :class="actionWhite ? 'white header-action' : 'header-action' ">
|
||||
<div class="action-left" @click="$router.back()">
|
||||
<yd-navbar-back-icon size=".4rem"></yd-navbar-back-icon>
|
||||
</div>
|
||||
<div class="action-right" @click="$router.push({ name: 'cart' })">
|
||||
<yd-icon name="shopcart-outline" size=".4rem"></yd-icon>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
<script>
|
||||
import SwiperComponent from "../public/swiper";
|
||||
export default {
|
||||
created() {
|
||||
this.getShopInfo();
|
||||
this.checkCart();
|
||||
window.addEventListener("scroll", this.handleScroll);
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
shopid: this.$route.params.id,
|
||||
infoList: {},
|
||||
infoMain: [],
|
||||
userInfo: this.$utils.getUserInfo(),
|
||||
isShowAddCartAction: true,
|
||||
actionWhite: false,
|
||||
attachimg: []
|
||||
};
|
||||
},
|
||||
beforeRouteEnter(to, from, next) {
|
||||
next(vm => {
|
||||
vm.$parent.$data.showFooter = false;
|
||||
vm.$parent.$data.showNavBar = false;
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
handleScroll() {
|
||||
var scrollTop =
|
||||
window.pageYOffset ||
|
||||
document.documentElement.scrollTop ||
|
||||
document.body.scrollTop;
|
||||
if (scrollTop > 80) {
|
||||
this.actionWhite = true;
|
||||
} else {
|
||||
this.actionWhite = false;
|
||||
}
|
||||
},
|
||||
// 检车商品是否被已经收藏过了
|
||||
async checkCart() {
|
||||
let check = await this.$http.post({
|
||||
url: "/cart/checkCart",
|
||||
token: this.$utils.encrypt({
|
||||
userid: this.userInfo.id,
|
||||
shopid: this.shopid
|
||||
})
|
||||
});
|
||||
check.data.length == 1 ? (this.isShowAddCartAction = false) : "";
|
||||
},
|
||||
// 添加商品到购物车
|
||||
async addCart() {
|
||||
if (localStorage.getItem("u") == null) {
|
||||
this.$dialog.toast({
|
||||
mes: "请先登录",
|
||||
timeout: 1500,
|
||||
icon: "error",
|
||||
callback: () => {
|
||||
this.$router.push({ name: "login" });
|
||||
}
|
||||
});
|
||||
} else {
|
||||
let list = await this.$http.post({
|
||||
url: "/cart/addCart",
|
||||
token: this.$utils.encrypt({
|
||||
userid: this.userInfo.id,
|
||||
shopid: this.shopid
|
||||
})
|
||||
});
|
||||
|
||||
if (list.data.hasOwnProperty("insertId")) {
|
||||
this.$dialog.toast({
|
||||
mes: "加入购物车成功",
|
||||
timeout: 1500
|
||||
});
|
||||
this.isShowAddCartAction = false;
|
||||
}
|
||||
}
|
||||
},
|
||||
// 请求商品详情数据
|
||||
async getShopInfo() {
|
||||
let list = await this.$http.get({
|
||||
url: "/shop/info",
|
||||
token: this.$utils.encrypt({
|
||||
id: this.shopid
|
||||
})
|
||||
});
|
||||
|
||||
this.attachimg = JSON.parse(list.data[0].commodity_attachimg)
|
||||
this.infoList = list.data[0];
|
||||
this.infoMain = JSON.parse(this.infoList.commodity_main);
|
||||
}
|
||||
},
|
||||
components: {
|
||||
swiper: SwiperComponent
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
@import url("../../assets/css/info.css");
|
||||
.cartActive {
|
||||
background: #ff6700 !important;
|
||||
color: #fff !important;
|
||||
}
|
||||
.noActive {
|
||||
background: #8d8d8d !important;
|
||||
color: #616060 !important;
|
||||
}
|
||||
.content {
|
||||
padding: 0 !important;
|
||||
}
|
||||
</style>
|
||||
97
node+vue/shop-fend/src/components/view/login.vue
Executable file
@@ -0,0 +1,97 @@
|
||||
<template>
|
||||
<div class="login">
|
||||
<v-header :title="'登录'"></v-header>
|
||||
|
||||
<yd-cell-group>
|
||||
<yd-cell-item>
|
||||
<yd-input slot="right" required type="number" ref="userPhone" v-model="userName" regex="mobile" placeholder="手机号"></yd-input>
|
||||
</yd-cell-item>
|
||||
<yd-cell-item>
|
||||
<yd-input slot="right" required type="password" ref="userPwd" min="6" max="20" v-model="userPwd" placeholder="密码"></yd-input>
|
||||
</yd-cell-item>
|
||||
|
||||
</yd-cell-group>
|
||||
<yd-button-group>
|
||||
<yd-button size="large" type="primary" bgcolor="#f37d0f" color="#fff" shape="circle" @click.native="clickHander">登录</yd-button>
|
||||
</yd-button-group>
|
||||
<div class="reg-tips">
|
||||
<a class="index" href="#/">首页</a>
|
||||
<a class="action" href="#/reg">注册</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import UserHeader from "./../public/user-header";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
userName: null,
|
||||
userPwd: null
|
||||
};
|
||||
},
|
||||
beforeRouteEnter(to, from, next) {
|
||||
next(vm => {
|
||||
vm.$parent.$data.showFooter = false;
|
||||
vm.$parent.$data.showNavBar = false;
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
async clickHander() {
|
||||
//console.log(this.$refs.userPhone.valid);
|
||||
if (this.$refs.userPwd.valid && this.$refs.userPhone.valid) {
|
||||
let list = await this.$http.post({
|
||||
url: "/user/login",
|
||||
token: this.$utils.encrypt({
|
||||
phone: this.userName,
|
||||
pwd: this.userPwd
|
||||
})
|
||||
});
|
||||
|
||||
if (list.status == 404) {
|
||||
this.$dialog.toast({
|
||||
mes: "账户密码有误",
|
||||
timeout: 1500
|
||||
});
|
||||
} else {
|
||||
console.log();
|
||||
this.$dialog.toast({
|
||||
mes: "登录成功",
|
||||
timeout: 1500,
|
||||
icon: "success",
|
||||
callback: () => {
|
||||
localStorage.setItem("u", JSON.stringify(list.data[0]));
|
||||
this.$router.replace({ name: "index" });
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
components: {
|
||||
"v-header": UserHeader
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.reg-tips {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 21px;
|
||||
color: #919191;
|
||||
letter-spacing: 2px;
|
||||
padding: 0 12px;
|
||||
font-size: 12px;
|
||||
cursor: default;
|
||||
}
|
||||
.action {
|
||||
float: right;
|
||||
}
|
||||
.index {
|
||||
float: left;
|
||||
}
|
||||
</style>
|
||||
127
node+vue/shop-fend/src/components/view/me.vue
Executable file
@@ -0,0 +1,127 @@
|
||||
<template>
|
||||
<div class="me">
|
||||
|
||||
|
||||
<v-header :title="userInfo.user_nicname" :yue="userInfo.user_money"></v-header>
|
||||
|
||||
<yd-grids-group :rows="2">
|
||||
<yd-grids-item v-for="(item,index) in OrserAction" :key="index" @click.native="checkOrderStatus(index)">
|
||||
<img slot="icon" :src="item.img">
|
||||
<span slot="text">{{item.title}}</span>
|
||||
</yd-grids-item>
|
||||
</yd-grids-group>
|
||||
<br>
|
||||
<yd-accordion>
|
||||
<yd-accordion-item title="我的客服">
|
||||
<div style="padding: .24rem;">
|
||||
<p>
|
||||
在使用过程中有任何问题可以联系我们,为您提供7x24x365的专项服务。<br/>
|
||||
电话: <a href="tel:15155145354">15155145354</a>
|
||||
</p>
|
||||
</div>
|
||||
</yd-accordion-item>
|
||||
<yd-accordion-item title="帮助中心">
|
||||
<div style="padding: .24rem;">
|
||||
<h3>1: 下单后如何查找订单记录?</h3>
|
||||
<p>在我的页面,待付款,已完成中查看</p>
|
||||
<h3>2: 商品有降价活动吗</h3>
|
||||
<p>抱歉,官方直营店,没有降价哦,如果有会短信通知您。</p>
|
||||
|
||||
</div>
|
||||
</yd-accordion-item>
|
||||
<yd-accordion-item title="关于我们">
|
||||
<div style="padding: .24rem;">
|
||||
<p><em>心机购</em>是一款提供各大品牌手机直营的线上app,售后有保障,质量可靠。</p>
|
||||
</div>
|
||||
</yd-accordion-item>
|
||||
</yd-accordion>
|
||||
|
||||
<yd-button-group>
|
||||
<yd-button @click.native="logout" size="large" type="primary" bgcolor="#f37d0f" color="#fff" shape="circle">退出登录</yd-button>
|
||||
</yd-button-group>
|
||||
|
||||
<yd-popup v-model="showProp" position="left" width="100%">
|
||||
<yd-navbar title="查看订单">
|
||||
<router-link to="" slot="left" @click.native="showProp = false">
|
||||
<yd-navbar-back-icon></yd-navbar-back-icon>
|
||||
</router-link>
|
||||
</yd-navbar>
|
||||
|
||||
|
||||
<yd-list theme="4">
|
||||
<yd-list-item v-for="(item, index) in list" :key="index">
|
||||
<img slot="img" :src="item.commodity_thumbnail">
|
||||
<span slot="title">{{item.commodity_name}}</span>
|
||||
<yd-list-other slot="other">
|
||||
<div>
|
||||
<span class="demo-list-price"><em>总价: </em>{{item.order_total}}</span>
|
||||
<br>
|
||||
<span class="demo-list-del-price">购买数量: {{item.order_size}}</span>
|
||||
<br>
|
||||
<span class="demo-list-del-price">订单编号: {{item.order_number}}</span>
|
||||
</div>
|
||||
</yd-list-other>
|
||||
</yd-list-item>
|
||||
</yd-list>
|
||||
|
||||
|
||||
|
||||
</yd-popup>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import UserHeader from "./../public/user-header";
|
||||
export default {
|
||||
mounted() {},
|
||||
data() {
|
||||
return {
|
||||
userInfo: JSON.parse(localStorage.getItem("u")),
|
||||
showProp: false,
|
||||
list: [],
|
||||
OrserAction: [
|
||||
{
|
||||
title: "待付款",
|
||||
img: "../../../static/img/pay.png"
|
||||
},
|
||||
{
|
||||
title: "已完成",
|
||||
img: "../../../static/img/setting.png"
|
||||
}
|
||||
]
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
logout() {
|
||||
localStorage.removeItem("u");
|
||||
this.$router.push({ name: "index" });
|
||||
},
|
||||
async checkOrderStatus(status) {
|
||||
let OrderStatus = await this.$http.post({
|
||||
url: "/order/checkOrder",
|
||||
token: this.$utils.encrypt({
|
||||
userid: this.$utils.GetLocalstorage("u").id,
|
||||
status: status
|
||||
})
|
||||
});
|
||||
this.list = OrderStatus.data;
|
||||
this.showProp = true;
|
||||
}
|
||||
},
|
||||
beforeRouteEnter(to, from, next) {
|
||||
next(vm => {
|
||||
vm.$parent.$data.showNavBar = false;
|
||||
});
|
||||
},
|
||||
components: {
|
||||
"v-header": UserHeader
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
@import url("../../assets/css/me.css");
|
||||
.index {
|
||||
padding: 0 0 1.3rem 0;
|
||||
}
|
||||
</style>
|
||||
217
node+vue/shop-fend/src/components/view/order.vue
Executable file
@@ -0,0 +1,217 @@
|
||||
<template>
|
||||
<div class="order">
|
||||
<yd-navbar title="确认订单" fixed>
|
||||
<router-link to="" slot="left" @click.native="$router.back()">
|
||||
<yd-navbar-back-icon></yd-navbar-back-icon>
|
||||
</router-link>
|
||||
</yd-navbar>
|
||||
|
||||
<div class="order-address flex-layout" @click="OpenAddress">
|
||||
<p>添加收货地址</p>
|
||||
<yd-navbar-next-icon></yd-navbar-next-icon>
|
||||
</div>
|
||||
|
||||
|
||||
<yd-list theme="4">
|
||||
<yd-list-item v-for="(item,index) in orderList" :key="index">
|
||||
<img slot="img" :src="item.commodity_thumbnail">
|
||||
<span slot="title">{{item.commodity_name}}</span>
|
||||
<yd-list-other slot="other">
|
||||
<div>
|
||||
<span class="demo-list-price"><em>¥</em>{{item.commodity_nowprice}}</span>
|
||||
</div>
|
||||
</yd-list-other>
|
||||
</yd-list-item>
|
||||
</yd-list>
|
||||
|
||||
<div class="pay-list flex-layout" @click="isShowProp = true">
|
||||
<img src="../../../static/img/yue.png" alt="余额">
|
||||
<p>账户余额</p>
|
||||
<yd-switch v-model="defaults" disabled></yd-switch>
|
||||
</div>
|
||||
|
||||
<div class="pay-list flex-layout" @click="isShowProp = true">
|
||||
<img class="alipay" src="../../../static/img/alipay.png" alt="支付宝">
|
||||
<p>支付宝</p>
|
||||
<span>维护</span>
|
||||
</div>
|
||||
|
||||
<div class="pay-list flex-layout" @click="isShowProp = true">
|
||||
<img class="wxpay" src="../../../static/img/wxpay.png" alt="支付宝">
|
||||
<p>微信支付</p>
|
||||
<span>维护</span>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="order-footer">
|
||||
<div class="footer-left">
|
||||
共 {{orderList.length}} 件 合计: {{totalPrice}}
|
||||
</div>
|
||||
<div class="footer-right" @click="total ? showWxPay = !showWxPay : '' ">
|
||||
去付款
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<yd-popup v-model="isShowProp" position="left" width="100%">
|
||||
<yd-navbar title="添加收货地址">
|
||||
<router-link to="" slot="left" @click.native="isShowProp = false">
|
||||
<yd-navbar-back-icon></yd-navbar-back-icon>
|
||||
</router-link>
|
||||
</yd-navbar>
|
||||
|
||||
|
||||
<yd-cell-group v-if="ShowEdit">
|
||||
<yd-cell-item>
|
||||
<span slot="left">收货人:</span>
|
||||
<yd-input slot="right" required v-model="username" min="2" max="10" placeholder="真实姓名"></yd-input>
|
||||
</yd-cell-item>
|
||||
<yd-cell-item>
|
||||
<span slot="left">手机号:</span>
|
||||
<yd-input slot="right" required v-model="userphone" regex="mobile" placeholder="手机号"></yd-input>
|
||||
</yd-cell-item>
|
||||
<yd-cell-item arrow>
|
||||
<span slot="left">所在地区:</span>
|
||||
<input slot="right" type="text" @click.stop="show1 = true" v-model="model1" readonly placeholder="请选择收货地址">
|
||||
</yd-cell-item>
|
||||
<yd-cityselect v-model="show1" :callback="result1" :items="district"></yd-cityselect>
|
||||
|
||||
<yd-cell-item>
|
||||
<yd-textarea ref="address" slot="right" placeholder="详细地址" maxlength="100"></yd-textarea>
|
||||
</yd-cell-item>
|
||||
|
||||
<yd-button-group>
|
||||
<yd-button size="large" type="danger" shape="circle" @click.native="SubmitAddress()">提交信息</yd-button>
|
||||
</yd-button-group>
|
||||
|
||||
</yd-cell-group>
|
||||
|
||||
<yd-cell-group v-else>
|
||||
<yd-cell-item v-for="(item,index) in carAdd" :key="index">
|
||||
<span slot="left">{{item.username}}</span>
|
||||
<span slot="right">{{item.userphone}}</span>
|
||||
</yd-cell-item>
|
||||
</yd-cell-group>
|
||||
|
||||
|
||||
</yd-popup>
|
||||
|
||||
|
||||
|
||||
<v-wxpay :wxxxpay="showWxPay" :MoneyTotals="totalPrice" @change="changShowWxPay"></v-wxpay>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import District from "ydui-district/dist/jd_province_city_area_id";
|
||||
import wxpay from "../public/wxpay";
|
||||
export default {
|
||||
mounted() {
|
||||
if (localStorage.getItem("data") == null) {
|
||||
this.$router.push({ name: "index" });
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isShowProp: false,
|
||||
ShowEdit: true,
|
||||
defaults: true,
|
||||
username: null,
|
||||
userphone: null,
|
||||
show1: false,
|
||||
model1: "",
|
||||
district: District,
|
||||
orderList: this.$utils.GetLocalstorage("data"),
|
||||
showWxPay: false,
|
||||
carAdd:
|
||||
this.$utils.GetLocalstorage("add") == false
|
||||
? ""
|
||||
: this.$utils.GetLocalstorage("add")
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
// 改变状态
|
||||
changShowWxPay(val) {
|
||||
this.showWxPay = val;
|
||||
},
|
||||
// 打开收货地址弹窗
|
||||
OpenAddress() {
|
||||
this.isShowProp = true;
|
||||
localStorage.getItem("add") == null
|
||||
? (this.ShowEdit = true)
|
||||
: (this.ShowEdit = false);
|
||||
},
|
||||
// 提交本地保存地址
|
||||
async SubmitAddress() {
|
||||
let UserArray = [];
|
||||
UserArray.push({
|
||||
username: this.username,
|
||||
userphone: this.userphone,
|
||||
address: this.model1,
|
||||
infoAddress: this.$refs.address.mlstr
|
||||
});
|
||||
|
||||
this.$utils.SetLocalstorage("add", UserArray);
|
||||
this.carAdd = UserArray;
|
||||
this.ShowEdit = false;
|
||||
|
||||
let addressSave = await this.$http.post({
|
||||
url: "/user/setAddress",
|
||||
token: this.$utils.encrypt({
|
||||
truename: this.username,
|
||||
address: this.model1 + this.$refs.address.mlstr,
|
||||
uid: this.$utils.GetLocalstorage("u").id
|
||||
})
|
||||
});
|
||||
|
||||
console.log(addressSave);
|
||||
},
|
||||
// 获取城市地址
|
||||
result1(ret) {
|
||||
this.model1 = ret.itemName1 + " " + ret.itemName2 + " " + ret.itemName3;
|
||||
}
|
||||
},
|
||||
beforeRouteEnter(to, from, next) {
|
||||
next(vm => {
|
||||
vm.$parent.$data.showFooter = false;
|
||||
vm.$parent.$data.showNavBar = false;
|
||||
});
|
||||
},
|
||||
computed: {
|
||||
// 计算总价
|
||||
totalPrice() {
|
||||
let total = 0;
|
||||
for (const key in this.orderList) {
|
||||
total +=
|
||||
this.orderList[key].cart_nums *
|
||||
this.orderList[key].commodity_nowprice;
|
||||
}
|
||||
return total;
|
||||
},
|
||||
total() {
|
||||
let info = this.$utils.GetLocalstorage("u");
|
||||
if (this.totalPrice > info.user_money) {
|
||||
this.$dialog.toast({
|
||||
mes: "余额不足",
|
||||
timeout: 1500
|
||||
});
|
||||
return false;
|
||||
} else {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
},
|
||||
components: {
|
||||
"v-wxpay": wxpay
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
@import url("../../assets/css/order.css");
|
||||
.order {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
117
node+vue/shop-fend/src/components/view/payresult.vue
Executable file
@@ -0,0 +1,117 @@
|
||||
<template>
|
||||
<div class="payResult">
|
||||
<yd-navbar title="支付结果">
|
||||
<router-link to="" slot="left" @click.native="$router.back()">
|
||||
<yd-navbar-back-icon></yd-navbar-back-icon>
|
||||
</router-link>
|
||||
|
||||
</yd-navbar>
|
||||
<yd-flexbox direction="vertical" align="center">
|
||||
<yd-flexbox-item>
|
||||
<img class="res-logo" src="../../../static/img/success.svg" alt="">
|
||||
</yd-flexbox-item>
|
||||
<yd-flexbox-item>
|
||||
<yd-preview :buttons="btns">
|
||||
<yd-preview-header>
|
||||
<div slot="left">付款金额</div>
|
||||
<div slot="right">¥{{moneyTotal}}</div>
|
||||
</yd-preview-header>
|
||||
|
||||
<yd-preview-item>
|
||||
<div slot="left">订单编号</div>
|
||||
<div slot="right">{{orderNumbers}}</div>
|
||||
</yd-preview-item>
|
||||
</yd-preview>
|
||||
</yd-flexbox-item>
|
||||
</yd-flexbox>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
created() {
|
||||
if (localStorage.getItem("data") == null) {
|
||||
this.$router.push({ name: "index" });
|
||||
} else {
|
||||
this.setOrder();
|
||||
}
|
||||
},
|
||||
beforeRouteEnter(to, from, next) {
|
||||
next(vm => {
|
||||
vm.$parent.$data.showFooter = false;
|
||||
vm.$parent.$data.showNavBar = false;
|
||||
});
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
moneyTotal: null,
|
||||
orderNumbers: null,
|
||||
btns: [
|
||||
{
|
||||
text: "查看订单",
|
||||
click: () => {
|
||||
this.$router.push({ name: "me" });
|
||||
}
|
||||
},
|
||||
{
|
||||
color: "#F00",
|
||||
text: "跳转首页",
|
||||
click: () => {
|
||||
this.$router.push({ name: "index" });
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
async setOrder() {
|
||||
let datas = this.$utils.GetLocalstorage("data"),
|
||||
Orderlist = [],
|
||||
totals = 0;
|
||||
for (const key in datas) {
|
||||
totals +=
|
||||
parseInt(datas[key].cart_nums) *
|
||||
parseInt(datas[key].commodity_nowprice);
|
||||
|
||||
Orderlist.push({
|
||||
uid: this.$utils.GetLocalstorage("u").id,
|
||||
sid: datas[key].id,
|
||||
total: datas[key].cart_nums * datas[key].commodity_nowprice,
|
||||
size: datas[key].cart_nums
|
||||
});
|
||||
}
|
||||
|
||||
let order = await this.$http.post({
|
||||
url: "/order/addOrder",
|
||||
token: this.$utils.encrypt({
|
||||
order: JSON.stringify(Orderlist),
|
||||
orderTotal: totals,
|
||||
money: this.$utils.GetLocalstorage("u").user_money
|
||||
})
|
||||
});
|
||||
|
||||
this.moneyTotal = totals;
|
||||
|
||||
this.orderNumbers = order.data[0].orderNumber;
|
||||
|
||||
localStorage.removeItem("data");
|
||||
|
||||
this.UpdateMoney(totals);
|
||||
},
|
||||
|
||||
UpdateMoney(totals) {
|
||||
let info = this.$utils.GetLocalstorage("u");
|
||||
info.user_money -= totals;
|
||||
this.$utils.SetLocalstorage("u", info);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.res-logo {
|
||||
width: 100px;
|
||||
margin-top: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
</style>
|
||||
1
node+vue/shop-fend/src/config/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
82ced29c-b8dd-4147-a772-177756c4526f
|
||||
55
node+vue/shop-fend/src/config/index.js
Executable file
@@ -0,0 +1,55 @@
|
||||
export default {
|
||||
// 私钥
|
||||
rsa_private_key: `-----BEGIN RSA PRIVATE KEY-----
|
||||
MIICXAIBAAKBgQCzkEs/kJgaFGIAM/TQRjzUtJ9ve9enk6heGj/JbcvHVOwFYw2q
|
||||
CNUhuaFE9rYDL+CzX3+cf7inRIJCvSnC0bdGCZ+i943uSudTkqT+guv03jTzvLy2
|
||||
TD+Bp41/ToNiPWG56p1keHE0Gwsr7o0waIcWrLpFJnzyW/fOYQjboRz7nwIDAQAB
|
||||
AoGADgMCfDFSTSauBwoG3oG8mXSGxHJLf74b80vlEljJAAL2b+0s0cnip8EOfo0p
|
||||
4tHHnPekw5eL1zGXYJHWQmeO/3ymZS/nnVq1K5YRM+AtYyUMAiChIt/zWOGXPN6k
|
||||
yUARaTK/cRZNY2XPPDK0H44eLF2RDE/SObPD0BZ0u9m92aECQQDYSIrYw0klyGJe
|
||||
ePaV0+2ZtVVhDYN+eYmWHu9/T+aOIPFS5ePUonBftSfcp7pTeJZ3O/eI/4W6pdzz
|
||||
13MRseUZAkEA1ImPvtbL39A8OtciY16LgDX5O5Vkm5p5+TKRhG5B38bgnOQQHu2d
|
||||
oJKvxjEJcWDfiJ6/ThHsFHqyvViJ+cIFdwJBAIWlpe62FdA8F9UK6EzDLXIq5DxZ
|
||||
rmSL06IpMZM5G12+K4EvP26YhdoORjiKiI+l10yMiLRmOQuSDIu9GYTYqZkCQEQ5
|
||||
/Ij4ju3D/PGuif14JjP8H4u/A1LoHeufDhODCWZ6gzQaCgrDoGwhaoemyi85N8i1
|
||||
nRfErRJN6P7bYz9nxzUCQDC8yEIcgKczxFIo20k4R+CINyJTB5S6dsVW6gmpiHZK
|
||||
6+MWkDut4o/Fibwp4jm5Fh9zau597aP5Xnt8mA2LRc8=
|
||||
-----END RSA PRIVATE KEY-----`,
|
||||
// 页面的一些配置
|
||||
pageConfig: {
|
||||
index: {
|
||||
classList: [
|
||||
{
|
||||
id: "1",
|
||||
title: "小米",
|
||||
url: "http://oodwe388r.bkt.clouddn.com/xiaomi.png"
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "华为",
|
||||
url: "http://oodwe388r.bkt.clouddn.com/huawei.png"
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "苹果",
|
||||
url: "http://oodwe388r.bkt.clouddn.com/apple.jpg"
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
title: "一加",
|
||||
url: "http://oodwe388r.bkt.clouddn.com/yijia.jpg"
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
title: "三星",
|
||||
url: "http://oodwe388r.bkt.clouddn.com/sanxin.jpg"
|
||||
},
|
||||
{
|
||||
id: "6",
|
||||
title: "锤子",
|
||||
url: "http://oodwe388r.bkt.clouddn.com/chuizi.jpg"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
1
node+vue/shop-fend/src/lib/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
b52fb27d-f554-40e4-be77-669d18d20ba8
|
||||
46
node+vue/shop-fend/src/lib/index.js
Executable file
@@ -0,0 +1,46 @@
|
||||
import config from '../config'
|
||||
import NodeRSA from 'node-rsa'
|
||||
class Lib {
|
||||
constructor() {
|
||||
this.rsa_private_key = config.rsa_private_key
|
||||
}
|
||||
|
||||
/**
|
||||
* 前端: 使用RSA的私钥进行加密 rsa_private_key
|
||||
* @param {*string} text 需要加密的字符串
|
||||
*/
|
||||
encrypt(text) {
|
||||
return (new NodeRSA(this.rsa_private_key)).encryptPrivate(text, 'base64')
|
||||
}
|
||||
|
||||
/**
|
||||
* 前端: 使用私钥解密json数据给前端
|
||||
* @param {*string} text 需要解密的字符串
|
||||
*/
|
||||
privateDecrypted(text) {
|
||||
return (new NodeRSA(this.rsa_private_key)).decrypt(text, 'utf8')
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取用户信息
|
||||
*/
|
||||
getUserInfo() {
|
||||
return this.GetLocalstorage("u")
|
||||
}
|
||||
/**
|
||||
* 获取本地数据
|
||||
* @param {*string} name 名称
|
||||
*/
|
||||
GetLocalstorage(name) {
|
||||
return localStorage.getItem(name) != null ? JSON.parse(localStorage.getItem(name)) : false
|
||||
}
|
||||
/**
|
||||
* 写入本地数据
|
||||
* @param {*string} name 名称
|
||||
*/
|
||||
SetLocalstorage(name, key) {
|
||||
localStorage.setItem(name, JSON.stringify(key))
|
||||
}
|
||||
}
|
||||
|
||||
export default new Lib()
|
||||
22
node+vue/shop-fend/src/main.js
Executable file
@@ -0,0 +1,22 @@
|
||||
// The Vue build version to load with the `import` command
|
||||
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
|
||||
import Vue from 'vue'
|
||||
import App from './App'
|
||||
import router from './router'
|
||||
import YDUI from 'vue-ydui'
|
||||
import 'vue-ydui/dist/ydui.rem.css'
|
||||
import utlis from './lib'
|
||||
import axios from './api'
|
||||
import config from './config'
|
||||
Vue.config.productionTip = false
|
||||
Vue.use(YDUI)
|
||||
Vue.prototype.$utils = utlis
|
||||
Vue.prototype.$http = axios
|
||||
Vue.prototype.$config = config
|
||||
/* eslint-disable no-new */
|
||||
new Vue({
|
||||
el: '#app',
|
||||
router,
|
||||
components: { App },
|
||||
template: '<App/>'
|
||||
})
|
||||
1
node+vue/shop-fend/src/router/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
87ff3aaf-77b5-4a5f-9cf7-7197a7a1a30b
|
||||
151
node+vue/shop-fend/src/router/index.js
Executable file
@@ -0,0 +1,151 @@
|
||||
import Vue from 'vue'
|
||||
import Router from 'vue-router'
|
||||
import IndexComponents from '@/components/view/index'
|
||||
import InfoComponents from '@/components/view/info'
|
||||
import ClassComponents from '@/components/view/class'
|
||||
import CartComponents from '@/components/view/cart'
|
||||
import MeComponents from "@/components/view/me";
|
||||
|
||||
import LoginComponents from "@/components/view/login";
|
||||
import addUserComponents from "@/components/view/adduser";
|
||||
import OrderComponents from "@/components/view/order";
|
||||
import ResultComponents from "@/components/view/payresult";
|
||||
|
||||
import { Confirm, Alert, Toast, Notify, Loading } from 'vue-ydui/dist/lib.rem/dialog';
|
||||
|
||||
|
||||
Vue.use(Router)
|
||||
|
||||
const router = new Router({
|
||||
//解决拖动时多个页面互相影响的问题,当切换到新路由时,想要页面滚到顶部
|
||||
scrollBehavior(to, from, savedPosition) {
|
||||
return { x: 0, y: 0 }
|
||||
},
|
||||
routes: [
|
||||
{
|
||||
path: '/',
|
||||
name: 'index',
|
||||
component: IndexComponents,
|
||||
meta: {
|
||||
// 是否需要登录
|
||||
isLogin: false,
|
||||
// 是否需要被缓存
|
||||
keepAlive: true,
|
||||
// 页面标签卡标题
|
||||
title: "主页"
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/info/:id',
|
||||
name: 'info',
|
||||
component: InfoComponents,
|
||||
meta: {
|
||||
isLogin: false,
|
||||
keepAlive: false,
|
||||
title: "详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/class',
|
||||
name: 'class',
|
||||
component: ClassComponents,
|
||||
meta: {
|
||||
isLogin: false,
|
||||
keepAlive: false,
|
||||
title: "分类"
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/reg',
|
||||
name: 'register',
|
||||
component: addUserComponents,
|
||||
meta: {
|
||||
isLogin: false,
|
||||
keepAlive: true,
|
||||
title: "注册"
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/login',
|
||||
name: 'login',
|
||||
component: LoginComponents,
|
||||
meta: {
|
||||
isLogin: false,
|
||||
keepAlive: true,
|
||||
title: "登录"
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/cart',
|
||||
name: 'cart',
|
||||
component: CartComponents,
|
||||
meta: {
|
||||
isLogin: true,
|
||||
keepAlive: false,
|
||||
title: "购物车"
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/me',
|
||||
name: 'me',
|
||||
component: MeComponents,
|
||||
meta: {
|
||||
isLogin: true,
|
||||
keepAlive: false,
|
||||
title: "我的"
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/order',
|
||||
name: "order",
|
||||
component: OrderComponents,
|
||||
meta: {
|
||||
isLogin: true,
|
||||
keepAlive: false,
|
||||
title: "确认订单"
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/result',
|
||||
name: "result",
|
||||
component: ResultComponents,
|
||||
meta: {
|
||||
isLogin: true,
|
||||
keepAlive: false,
|
||||
title: "支付成功"
|
||||
}
|
||||
}
|
||||
]
|
||||
})
|
||||
|
||||
router.beforeEach((to, from, next) => {
|
||||
// 设置浏览器标题
|
||||
document.title = to.meta.title
|
||||
// 检查页面是否需要登录
|
||||
if (to.meta.isLogin) {
|
||||
// 检查是否已经登录
|
||||
if (localStorage.getItem("u") == null) {
|
||||
Toast({
|
||||
mes: '请先登录',
|
||||
timeout: 1700,
|
||||
icon: 'error',
|
||||
callback: () => {
|
||||
next({
|
||||
path: '/login',
|
||||
query: { redirect: to.fullPath }
|
||||
})
|
||||
}
|
||||
})
|
||||
} else {
|
||||
next()
|
||||
}
|
||||
|
||||
} else {
|
||||
next()
|
||||
}
|
||||
|
||||
|
||||
})
|
||||
|
||||
|
||||
export default router
|
||||
0
node+vue/shop-fend/static/.gitkeep
Executable file
1
node+vue/shop-fend/static/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
3b569f58-5599-477d-ac01-dfe45a263b62
|
||||
1
node+vue/shop-fend/static/img/.pydio
Normal file
@@ -0,0 +1 @@
|
||||
014a4c40-4f1d-43af-afb8-7dc4efdc655b
|
||||
BIN
node+vue/shop-fend/static/img/ad_1.jpg
Executable file
|
After Width: | Height: | Size: 25 KiB |
BIN
node+vue/shop-fend/static/img/alipay.png
Executable file
|
After Width: | Height: | Size: 983 B |
BIN
node+vue/shop-fend/static/img/banner_1.jpg
Executable file
|
After Width: | Height: | Size: 43 KiB |
BIN
node+vue/shop-fend/static/img/banner_2.jpg
Executable file
|
After Width: | Height: | Size: 39 KiB |
BIN
node+vue/shop-fend/static/img/banner_3.jpg
Executable file
|
After Width: | Height: | Size: 74 KiB |
BIN
node+vue/shop-fend/static/img/dd_03.jpg
Executable file
|
After Width: | Height: | Size: 646 B |
BIN
node+vue/shop-fend/static/img/jftc_03.jpg
Executable file
|
After Width: | Height: | Size: 4.4 KiB |
BIN
node+vue/shop-fend/static/img/jftc_09.jpg
Executable file
|
After Width: | Height: | Size: 952 B |