Gao xiaosong
5 years ago
commit
397082cdaf
1117 changed files with 105700 additions and 0 deletions
@ -0,0 +1,18 @@ |
|||||||
|
<script> |
||||||
|
export default { |
||||||
|
onLaunch: function() { |
||||||
|
console.log('App Launch') |
||||||
|
}, |
||||||
|
onShow: function() { |
||||||
|
console.log('App Show') |
||||||
|
}, |
||||||
|
onHide: function() { |
||||||
|
|
||||||
|
console.log('App Hide') |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style> |
||||||
|
/*每个页面公共css */ |
||||||
|
</style> |
@ -0,0 +1,153 @@ |
|||||||
|
import request from "@/utils/request"; |
||||||
|
|
||||||
|
/** |
||||||
|
* 拼团列表 |
||||||
|
*/ |
||||||
|
export function getCombinationList(data) { |
||||||
|
return request.get("/combination/list", data, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 拼团产品详情 |
||||||
|
* @param {*} id |
||||||
|
*/ |
||||||
|
export function getCombinationDetail(id) { |
||||||
|
return request.get("/combination/detail/" + id, {}, { login: true }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 拼团 开团 |
||||||
|
* @param {*} id |
||||||
|
*/ |
||||||
|
export function getCombinationPink(id) { |
||||||
|
return request.get("/combination/pink/" + id); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 拼团 取消开团 |
||||||
|
*/ |
||||||
|
export function getCombinationRemove(data) { |
||||||
|
return request.post("/combination/remove", data); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 拼团海报 |
||||||
|
* @param {*} id |
||||||
|
*/ |
||||||
|
export function getCombinationPoster(data) { |
||||||
|
return request.post("/combination/poster", data); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 秒杀列表配置 |
||||||
|
*/ |
||||||
|
export function getSeckillConfig() { |
||||||
|
return request.get("/seckill/index", {}, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 秒杀列表 |
||||||
|
*/ |
||||||
|
export function getSeckillList(time, data) { |
||||||
|
return request.get("/seckill/list/" + time, data, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 秒杀产品详情 |
||||||
|
*/ |
||||||
|
export function getSeckillDetail(id) { |
||||||
|
return request.get("/seckill/detail/" + id, {}, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 砍价列表 |
||||||
|
* @param {*} data |
||||||
|
*/ |
||||||
|
export function getBargainList(data) { |
||||||
|
return request.get("/bargain/list", data, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 砍价产品详情 |
||||||
|
*/ |
||||||
|
export function getBargainDetail(id) { |
||||||
|
return request.get("/bargain/detail/" + id); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 砍价 观看/分享/参与次数 |
||||||
|
*/ |
||||||
|
export function getBargainShare(data) { |
||||||
|
return request.post("/bargain/share", data); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 砍价开启 |
||||||
|
* @param {*} data |
||||||
|
*/ |
||||||
|
export function getBargainStart(data) { |
||||||
|
return request.post("/bargain/start", data); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 砍价 帮助好友砍价 |
||||||
|
* @param {*} data |
||||||
|
*/ |
||||||
|
export function getBargainHelp(data) { |
||||||
|
return request.post("/bargain/help", data); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 砍价 砍掉金额 |
||||||
|
* @param {*} data |
||||||
|
*/ |
||||||
|
export function getBargainHelpPrice(data) { |
||||||
|
return request.post("/bargain/help/price", data); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 砍价 砍价帮总人数、剩余金额、进度条、已经砍掉的价格 |
||||||
|
* @param {*} data |
||||||
|
*/ |
||||||
|
export function getBargainHelpCount(data) { |
||||||
|
return request.post("/bargain/help/count", data); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 砍价 开启砍价用户信息 |
||||||
|
* @param {*} data |
||||||
|
*/ |
||||||
|
export function getBargainStartUser(data) { |
||||||
|
return request.post("/bargain/start/user", data); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 砍价 砍价帮 |
||||||
|
* @param {*} data |
||||||
|
*/ |
||||||
|
export function getBargainHelpList(data) { |
||||||
|
return request.post("/bargain/help/list", data); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 砍价海报 |
||||||
|
* @param {*} data |
||||||
|
*/ |
||||||
|
export function getBargainPoster(data) { |
||||||
|
return request.post("/bargain/poster", data); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 砍价列表(已参与) |
||||||
|
* @param {*} data |
||||||
|
*/ |
||||||
|
export function getBargainUserList(data) { |
||||||
|
return request.get("/bargain/user/list", data); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 砍价取消 |
||||||
|
*/ |
||||||
|
export function getBargainUserCancel(data) { |
||||||
|
return request.post("/bargain/user/cancel", data); |
||||||
|
} |
@ -0,0 +1,73 @@ |
|||||||
|
import request from "@/utils/request"; |
||||||
|
|
||||||
|
/** |
||||||
|
* 统计数据 |
||||||
|
*/ |
||||||
|
export function getStatisticsInfo() { |
||||||
|
return request.get("/admin/order/statistics", {}, { login: true }); |
||||||
|
} |
||||||
|
/** |
||||||
|
* 订单月统计 |
||||||
|
*/ |
||||||
|
export function getStatisticsMonth(where) { |
||||||
|
return request.get("/admin/order/data", where, { login: true }); |
||||||
|
} |
||||||
|
/** |
||||||
|
* 订单月统计 |
||||||
|
*/ |
||||||
|
export function getAdminOrderList(where) { |
||||||
|
return request.get("/admin/order/list", where, { login: true }); |
||||||
|
} |
||||||
|
/** |
||||||
|
* 订单改价 |
||||||
|
*/ |
||||||
|
export function setAdminOrderPrice(data) { |
||||||
|
return request.post("/admin/order/price", data, { login: true }); |
||||||
|
} |
||||||
|
/** |
||||||
|
* 订单备注 |
||||||
|
*/ |
||||||
|
export function setAdminOrderRemark(data) { |
||||||
|
return request.post("/admin/order/remark", data, { login: true }); |
||||||
|
} |
||||||
|
/** |
||||||
|
* 订单详情 |
||||||
|
*/ |
||||||
|
export function getAdminOrderDetail(orderId) { |
||||||
|
return request.get("/admin/order/detail/" + orderId, {}, { login: true }); |
||||||
|
} |
||||||
|
/** |
||||||
|
* 订单发货信息获取 |
||||||
|
*/ |
||||||
|
export function getAdminOrderDelivery(orderId) { |
||||||
|
return request.get( |
||||||
|
"/admin/order/detail/" + orderId, |
||||||
|
{}, |
||||||
|
{ login: true } |
||||||
|
); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 订单发货保存 |
||||||
|
*/ |
||||||
|
export function setAdminOrderDelivery(data) { |
||||||
|
return request.post("/admin/order/delivery/keep", data, { login: true }); |
||||||
|
} |
||||||
|
/** |
||||||
|
* 订单统计图 |
||||||
|
*/ |
||||||
|
export function getStatisticsTime(data) { |
||||||
|
return request.get("/admin/order/time", data, { login: true }); |
||||||
|
} |
||||||
|
/** |
||||||
|
* 线下付款订单确认付款 |
||||||
|
*/ |
||||||
|
export function setOfflinePay(data) { |
||||||
|
return request.post("/admin/order/offline", data, { login: true }); |
||||||
|
} |
||||||
|
/** |
||||||
|
* 订单确认退款 |
||||||
|
*/ |
||||||
|
export function setOrderRefund(data) { |
||||||
|
return request.post("/admin/order/refund", data, { login: true }); |
||||||
|
} |
@ -0,0 +1,129 @@ |
|||||||
|
/* |
||||||
|
* 订单确认 |
||||||
|
* */ |
||||||
|
import request from "@/utils/request"; |
||||||
|
|
||||||
|
/** |
||||||
|
* 通过购物车 id 获取订单信息 |
||||||
|
* @param cartId |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function postOrderConfirm(cartId) { |
||||||
|
return request.post("/order/confirm", { cartId }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 计算订单金额 |
||||||
|
* @param key |
||||||
|
* @param data |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function postOrderComputed(key, data) { |
||||||
|
return request.post("/order/computed/" + key, data); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 获取指定金额可用优惠券 |
||||||
|
* @param price |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function getOrderCoupon(price) { |
||||||
|
return request.get("/coupons/order/" + (parseFloat(price) || 0)); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 生成订单 |
||||||
|
* @param key |
||||||
|
* @param data |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function createOrder(key, data) { |
||||||
|
return request.post("/order/create/" + key, data || {}); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 订单统计数据 |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function getOrderData() { |
||||||
|
return request.get("/order/data"); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 订单列表 |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function getOrderList(data) { |
||||||
|
return request.get("/order/list", data); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 取消订单 |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function cancelOrder(id) { |
||||||
|
return request.post("/order/cancel", { id }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 订单详情 |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function orderDetail(id) { |
||||||
|
return request.get("/order/detail/" + id); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 退款理由 |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function getRefundReason() { |
||||||
|
return request.get("/order/refund/reason"); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 提交退款 |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function postOrderRefund(data) { |
||||||
|
return request.post("/order/refund/verify", data); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 确认收货 |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function takeOrder(uni) { |
||||||
|
return request.post("/order/take", { uni }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 删除订单 |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function delOrder(uni) { |
||||||
|
return request.post("/order/del", { uni }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 订单查询物流信息 |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function express(params) { |
||||||
|
return request.post("order/express",params); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 订单查询物流信息 |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function payOrder(uni, paytype, from) { |
||||||
|
return request.post("order/pay", { uni, paytype, from }); |
||||||
|
} |
||||||
|
/** |
||||||
|
* 订单核销 |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function orderVerific(verify_code, is_confirm) { |
||||||
|
return request.post("order/order_verific", { verify_code, is_confirm }); |
||||||
|
} |
@ -0,0 +1,100 @@ |
|||||||
|
import request from "@/utils/request"; |
||||||
|
|
||||||
|
/** |
||||||
|
* 首页 |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function getHomeData() { |
||||||
|
return request.get("index", {}, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 文章 轮播列表 |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function getArticleBanner() { |
||||||
|
return request.get("/article/banner/list", {}, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 文章分类列表 |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function getArticleCategory() { |
||||||
|
return request.get("/article/category/list", {}, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 文章 热门列表 |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function getArticleHotList() { |
||||||
|
return request.get("/article/hot/list", {}, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 文章列表 |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function getArticleList(q) { |
||||||
|
return request.get("/article/list/", q, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 分享 |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function getShare() { |
||||||
|
return request.get("/share", {}, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 文章详情 |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function getArticleDetails(id) { |
||||||
|
return request.get("/article/details/" + id, {}, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 获取微信sdk配置 |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function getWechatConfig() { |
||||||
|
// return request.get(
|
||||||
|
// "/wechat/config",
|
||||||
|
// { url: document.location.href },
|
||||||
|
// { login: false }
|
||||||
|
// );
|
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 获取微信sdk配置 |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function wechatAuth(code, spread, login_type) { |
||||||
|
return request.get( |
||||||
|
"/wechat/auth", |
||||||
|
{ code, spread, login_type }, |
||||||
|
{ login: false } |
||||||
|
); |
||||||
|
} |
||||||
|
/** |
||||||
|
* 获取快递公司 |
||||||
|
* @returns {*} |
||||||
|
*/ |
||||||
|
export function getLogistics() { |
||||||
|
return request.get("/logistics", {}, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 获取图片base64 |
||||||
|
* @retins {*} |
||||||
|
* */ |
||||||
|
export function imageBase64(image, code) { |
||||||
|
return request.post( |
||||||
|
"/image_base64", |
||||||
|
{ image: image, code: code }, |
||||||
|
{ login: false } |
||||||
|
); |
||||||
|
} |
@ -0,0 +1,131 @@ |
|||||||
|
import request from "@/utils/request"; |
||||||
|
|
||||||
|
/* |
||||||
|
* 商品分类 |
||||||
|
* */ |
||||||
|
export function getCategory() { |
||||||
|
return request.get("/category", {}, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 商品详情 |
||||||
|
* */ |
||||||
|
export function getProductDetail(id) { |
||||||
|
return request.get("/product/detail/" + id, {}, { login: true }); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 商品分销二维码 |
||||||
|
* */ |
||||||
|
export function getProductCode(id) { |
||||||
|
return request.get("/product/code/" + id, {}, { login: true }); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 商品列表 |
||||||
|
* */ |
||||||
|
export function getProducts(q) { |
||||||
|
return request.get("/products", q, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 购物车数量 |
||||||
|
* */ |
||||||
|
export function getCartNum() { |
||||||
|
return request.get("/cart/count"); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 添加收藏 |
||||||
|
* */ |
||||||
|
export function toCollect(id, category) { |
||||||
|
return request.get("/collect/add/" + id + "/" + category); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 为你推荐 |
||||||
|
* */ |
||||||
|
export function getHostProducts(page, limit) { |
||||||
|
return request.get( |
||||||
|
"/product/hot", |
||||||
|
{ page: page, limit: limit }, |
||||||
|
{ login: false } |
||||||
|
); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 精品、热门、首发列表 |
||||||
|
* */ |
||||||
|
export function getGroomList(type) { |
||||||
|
return request.get("/groom/list/" + type, {}, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 购物车 添加 |
||||||
|
* */ |
||||||
|
export function postCartAdd(data) { |
||||||
|
return request.post("/cart/add", data); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 购物车列表 |
||||||
|
* */ |
||||||
|
export function getCartList() { |
||||||
|
return request.get("/cart/list"); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 购物车 删除 |
||||||
|
* */ |
||||||
|
export function postCartDel(ids) { |
||||||
|
return request.post("/cart/del", { ids }); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 购物车 获取数量 |
||||||
|
* */ |
||||||
|
export function getCartCount(data) { |
||||||
|
return request.get("/cart/count", data); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 购物车 修改商品数量 |
||||||
|
* */ |
||||||
|
export function changeCartNum(id, number) { |
||||||
|
return request.post("/cart/num", { id, number }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 搜索推荐关键字 |
||||||
|
*/ |
||||||
|
export function getSearchKeyword() { |
||||||
|
return request.get("/search/keyword", {}, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 产品评论列表 |
||||||
|
*/ |
||||||
|
export function getReplyList(id, q) { |
||||||
|
return request.get("/reply/list/" + id, q, { login: true }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 产品评价数量和好评度 |
||||||
|
*/ |
||||||
|
export function getReplyConfig(id) { |
||||||
|
return request.get("/reply/config/" + id, {}, { login: true }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 评价页面获取单个产品详情 |
||||||
|
*/ |
||||||
|
export function postOrderProduct(unique) { |
||||||
|
return request.post("/order/product", { unique }, { login: true }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 提交评价页面; |
||||||
|
*/ |
||||||
|
export function postOrderComment(data) { |
||||||
|
return request.post("/order/comment", data, { login: true }); |
||||||
|
} |
@ -0,0 +1,363 @@ |
|||||||
|
import request from "@/utils/request"; |
||||||
|
|
||||||
|
/** |
||||||
|
* 省市区 |
||||||
|
*/ |
||||||
|
export function district(data) { |
||||||
|
return request.get("/citys", data, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 用户登录 |
||||||
|
* @param data object 用户账号密码 |
||||||
|
*/ |
||||||
|
export function login(data) { |
||||||
|
return request.post("/login", data, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 用户手机号登录 |
||||||
|
* @param data object 用户手机号 也只能 |
||||||
|
*/ |
||||||
|
export function loginMobile(data) { |
||||||
|
return request.post("/login/mobile", data, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 用户发送验证码 |
||||||
|
* @param data object 用户手机号 |
||||||
|
*/ |
||||||
|
export function registerVerify(data) { |
||||||
|
return request.post("/register/verify", data, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 用户手机号注册 |
||||||
|
* @param data object 用户手机号 验证码 密码 |
||||||
|
*/ |
||||||
|
export function register(data) { |
||||||
|
return request.post("/register", data, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 用户手机号修改密码 |
||||||
|
* @param data object 用户手机号 验证码 密码 |
||||||
|
*/ |
||||||
|
export function registerReset(data) { |
||||||
|
return request.post("/register/reset", data, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 领取优惠券列表 |
||||||
|
* */ |
||||||
|
export function getCoupon(q) { |
||||||
|
return request.get("/coupons", q, { login: true }); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 点击领取优惠券 |
||||||
|
* */ |
||||||
|
export function getCouponReceive(id) { |
||||||
|
return request.post("/coupon/receive", { couponId: id }, { login: true }); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 批量领取优惠券 |
||||||
|
* */ |
||||||
|
export function couponReceiveBatch(couponId) { |
||||||
|
return request.post("/coupon/receive/batch", { couponId }); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 我的优惠券 |
||||||
|
* */ |
||||||
|
export function getCouponsUser(type) { |
||||||
|
return request.get("/coupons/user/" + type); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 个人中心 |
||||||
|
* */ |
||||||
|
export function getUser() { |
||||||
|
return request.get("/user"); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 用户信息 |
||||||
|
* */ |
||||||
|
export function getUserInfo() { |
||||||
|
|
||||||
|
return request.get("/userinfo", { login: true }); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 小程序登陆 |
||||||
|
* */ |
||||||
|
export function wxappAuth(data) { |
||||||
|
|
||||||
|
return request.post("/wxapp/auth", data, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 个人中心(功能列表) |
||||||
|
* */ |
||||||
|
export function getMenuUser() { |
||||||
|
return request.get("/menu/user"); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 地址列表 |
||||||
|
* */ |
||||||
|
export function getAddressList(data) { |
||||||
|
return request.get("/address/list", data || {}); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 删除地址 |
||||||
|
* */ |
||||||
|
export function getAddressRemove(id) { |
||||||
|
return request.post("/address/del", { id: id }); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 设置默认地址 |
||||||
|
* */ |
||||||
|
export function getAddressDefaultSet(id) { |
||||||
|
return request.post("/address/default/set", { id: id }); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 获取默认地址 |
||||||
|
* */ |
||||||
|
export function getAddressDefault() { |
||||||
|
return request.get("/address/default"); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 获取单个地址 |
||||||
|
* */ |
||||||
|
export function getAddress(id) { |
||||||
|
return request.get("/address/detail/" + id); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 修改 添加地址 |
||||||
|
* */ |
||||||
|
export function postAddress(data) { |
||||||
|
return request.post("/address/edit", data); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 获取收藏产品 |
||||||
|
* */ |
||||||
|
export function getCollectUser(page, limit) { |
||||||
|
return request.get("/collect/user", { page: page, limit: limit }); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 删除收藏产品 |
||||||
|
* */ |
||||||
|
export function getCollectDel(id, category) { |
||||||
|
return request.post("/collect/del", { id: id, category: category }); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 批量收藏产品 |
||||||
|
* */ |
||||||
|
export function postCollectAll(data) { |
||||||
|
return request.post("/collect/all", data); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 添加收藏产品 |
||||||
|
* */ |
||||||
|
export function getCollectAdd(id, category) { |
||||||
|
return request.post("collect/add", { id: id, category: category }); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 签到配置 |
||||||
|
* */ |
||||||
|
export function getSignConfig() { |
||||||
|
return request.get("/sign/config"); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 签到里的签到列表 |
||||||
|
* */ |
||||||
|
export function getSignList(page, limit) { |
||||||
|
return request.get("/sign/list", { page: page, limit: limit }); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 签到列表 |
||||||
|
* */ |
||||||
|
export function getSignMonth(page, limit) { |
||||||
|
return request.get("/sign/month", { page: page, limit: limit }); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 签到用户信息 |
||||||
|
* */ |
||||||
|
export function postSignUser(sign) { |
||||||
|
return request.post("/sign/user", sign); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 签到 |
||||||
|
* */ |
||||||
|
export function postSignIntegral(sign) { |
||||||
|
return request.post("/sign/integral", sign); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 推广数据 |
||||||
|
* */ |
||||||
|
export function getSpreadInfo() { |
||||||
|
return request.get("/commission"); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 推广人列表 |
||||||
|
* */ |
||||||
|
export function getSpreadUser(screen) { |
||||||
|
return request.post("/spread/people", screen); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 推广人订单 |
||||||
|
* */ |
||||||
|
export function getSpreadOrder(where) { |
||||||
|
return request.post("/spread/order", where); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 资金明细(types|0=全部,1=消费,2=充值,3=返佣,4=提现) |
||||||
|
* */ |
||||||
|
export function getCommissionInfo(q, types) { |
||||||
|
return request.get("/spread/commission/" + types, q); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 积分记录 |
||||||
|
* */ |
||||||
|
export function getIntegralList(q) { |
||||||
|
return request.get("/integral/list", q); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 提现银行 |
||||||
|
* */ |
||||||
|
export function getBank() { |
||||||
|
return request.get("/extract/bank"); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 提现申请 |
||||||
|
* */ |
||||||
|
export function postCashInfo(cash) { |
||||||
|
return request.post("/extract/cash", cash); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 会员中心 |
||||||
|
* */ |
||||||
|
export function getVipInfo() { |
||||||
|
return request.get("/user/level/grade"); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 会员等级任务 |
||||||
|
* */ |
||||||
|
export function getVipTask(id) { |
||||||
|
return request.get("/user/level/task/" + id); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 资金统计 |
||||||
|
* */ |
||||||
|
export function getBalance() { |
||||||
|
return request.get("/user/balance"); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 活动状态 |
||||||
|
* */ |
||||||
|
export function getActivityStatus() { |
||||||
|
return request.get("/user/activity", {}, { login: false }); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 活动状态 |
||||||
|
* */ |
||||||
|
export function getSpreadImg() { |
||||||
|
return request.get("/spread/banner"); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 用户修改信息 |
||||||
|
* */ |
||||||
|
export function postUserEdit(data) { |
||||||
|
return request.post("/user/edit", data); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 用户修改信息 |
||||||
|
* */ |
||||||
|
export function getChatRecord(to_uid, data) { |
||||||
|
return request.get("user/service/record/" + to_uid, data); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 用户修改信息 |
||||||
|
* */ |
||||||
|
export function serviceList() { |
||||||
|
return request.get("user/service/list"); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 公众号充值 |
||||||
|
* */ |
||||||
|
export function rechargeWechat(data) { |
||||||
|
return request.post("/recharge/wechat", data); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 退出登录 |
||||||
|
* */ |
||||||
|
export function getLogout() { |
||||||
|
return request.post("/auth/logout"); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* 绑定手机号 |
||||||
|
* */ |
||||||
|
export function bindingPhone(data) { |
||||||
|
return request.post("wxapp/binding", data); |
||||||
|
} |
||||||
|
|
||||||
|
/* |
||||||
|
* h5切换公众号登陆 |
||||||
|
* */ |
||||||
|
export function switchH5Login() { |
||||||
|
return request.post("switch_h5", { from: "wechat" }); |
||||||
|
} |
||||||
|
/* |
||||||
|
* 获取推广人排行 |
||||||
|
* */ |
||||||
|
export function getRankList(q) { |
||||||
|
return request.get("rank", q); |
||||||
|
} |
||||||
|
/* |
||||||
|
* 获取佣金排名 |
||||||
|
* */ |
||||||
|
export function getBrokerageRank(q) { |
||||||
|
return request.get("brokerage_rank", q); |
||||||
|
} |
||||||
|
|
||||||
|
/** |
||||||
|
* 检测会员等级 |
||||||
|
*/ |
||||||
|
export function setDetection() { |
||||||
|
return request.get("user/level/detection"); |
||||||
|
} |
@ -0,0 +1,180 @@ |
|||||||
|
@charset "UTF-8"; |
||||||
|
/** |
||||||
|
*相关初始化 |
||||||
|
*/ |
||||||
|
.font-color-red { |
||||||
|
color: #73CBB6 !important; |
||||||
|
} |
||||||
|
.bg-color-red { |
||||||
|
background-color: #73CBB6 !important; |
||||||
|
} |
||||||
|
.icon-color { |
||||||
|
color: #73CBB6; |
||||||
|
} |
||||||
|
.cart-color { |
||||||
|
color: #73CBB6 !important; |
||||||
|
border: 1px solid #73CBB6 !important; |
||||||
|
} |
||||||
|
/* padding20 */ |
||||||
|
.padding20 { |
||||||
|
padding: 0.2rem; |
||||||
|
} |
||||||
|
/* pad20 */ |
||||||
|
.pad20 { |
||||||
|
padding: 0 0.2rem; |
||||||
|
} |
||||||
|
/* padding30 */ |
||||||
|
.padding30 { |
||||||
|
padding: 0.3rem; |
||||||
|
} |
||||||
|
/*pad30 */ |
||||||
|
.pad30 { |
||||||
|
padding: 0 0.3rem; |
||||||
|
} |
||||||
|
/* layout */ |
||||||
|
.acea-row { |
||||||
|
display: flex; |
||||||
|
flex-wrap: wrap; |
||||||
|
/* 辅助类 */ |
||||||
|
} |
||||||
|
.acea-row.row-middle { |
||||||
|
align-items: center; |
||||||
|
} |
||||||
|
.acea-row.row-top { |
||||||
|
align-items: flex-start; |
||||||
|
} |
||||||
|
.acea-row.row-bottom { |
||||||
|
align-items: flex-end; |
||||||
|
} |
||||||
|
.acea-row.row-center { |
||||||
|
justify-content: center; |
||||||
|
} |
||||||
|
.acea-row.row-right { |
||||||
|
justify-content: flex-end; |
||||||
|
} |
||||||
|
.acea-row.row-left { |
||||||
|
justify-content: flex-start; |
||||||
|
} |
||||||
|
.acea-row.row-between { |
||||||
|
justify-content: space-between; |
||||||
|
} |
||||||
|
.acea-row.row-around { |
||||||
|
justify-content: space-around; |
||||||
|
} |
||||||
|
.acea-row.row-column-around { |
||||||
|
flex-direction: column; |
||||||
|
justify-content: space-around; |
||||||
|
} |
||||||
|
.acea-row.row-column { |
||||||
|
flex-direction: column; |
||||||
|
} |
||||||
|
.acea-row.row-column-between { |
||||||
|
flex-direction: column; |
||||||
|
justify-content: space-between; |
||||||
|
} |
||||||
|
/* 上下左右垂直居中 */ |
||||||
|
.acea-row.row-center-wrapper { |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
} |
||||||
|
/* 上下两边居中对齐 */ |
||||||
|
.acea-row.row-between-wrapper { |
||||||
|
align-items: center; |
||||||
|
justify-content: space-between; |
||||||
|
} |
||||||
|
|
||||||
|
/* 轮播图 */ |
||||||
|
.slider-banner { |
||||||
|
position: relative; |
||||||
|
width: 100%; |
||||||
|
/* height:750rpx; */ |
||||||
|
overflow: hidden; |
||||||
|
} |
||||||
|
.slider-banner{ |
||||||
|
|
||||||
|
} |
||||||
|
.slider-banner .swiper-container { |
||||||
|
height: 100%; |
||||||
|
} |
||||||
|
.slider-banner img { |
||||||
|
display: block; |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
} |
||||||
|
.start { |
||||||
|
width: 1.22rem; |
||||||
|
height: 0.3rem; |
||||||
|
background-image: url("https://h5.dayouqiantu.cn/static/images/start.png"); |
||||||
|
background-repeat: no-repeat; |
||||||
|
background-size: 1.22rem auto; |
||||||
|
} |
||||||
|
.start.star5 { |
||||||
|
background-position: 0 0.03rem; |
||||||
|
} |
||||||
|
.start.star4 { |
||||||
|
background-position: 0 -0.3rem; |
||||||
|
} |
||||||
|
.start.star3 { |
||||||
|
background-position: 0 -0.7rem; |
||||||
|
} |
||||||
|
.start.star2 { |
||||||
|
background-position: 0 -1.05rem; |
||||||
|
} |
||||||
|
.start.star1 { |
||||||
|
background-position: 0 -1.4rem; |
||||||
|
} |
||||||
|
.start.star0 { |
||||||
|
background-position: 0 -1.75rem; |
||||||
|
} |
||||||
|
/* 单选框和多选框 */ |
||||||
|
.checkbox-wrapper { |
||||||
|
position: relative; |
||||||
|
} |
||||||
|
.checkbox-wrapper input { |
||||||
|
display: none; |
||||||
|
} |
||||||
|
.checkbox-wrapper .icon { |
||||||
|
position: absolute; |
||||||
|
left: 0; |
||||||
|
top: 50%; |
||||||
|
display: inline-block; |
||||||
|
width: 18px; |
||||||
|
height: 18px; |
||||||
|
border: 1px solid #cccccc; |
||||||
|
border-radius: 50%; |
||||||
|
transform: translate(0, -50%); |
||||||
|
} |
||||||
|
.checkbox-wrapper input:checked + .icon { |
||||||
|
background-color: #e93323; |
||||||
|
border-color: #e93323; |
||||||
|
background-image: url("https://h5.dayouqiantu.cn/static/images/enter.png"); |
||||||
|
background-size: 0.21rem 0.15rem; |
||||||
|
background-repeat: no-repeat; |
||||||
|
background-position: center center; |
||||||
|
} |
||||||
|
.Loads { |
||||||
|
height: 0.8rem; |
||||||
|
font-size: 0.25rem; |
||||||
|
color: #000; |
||||||
|
} |
||||||
|
.Loads .iconfont { |
||||||
|
font-size: 0.3rem; |
||||||
|
margin-right: 0.1rem; |
||||||
|
height: 0.32rem; |
||||||
|
line-height: 0.32rem; |
||||||
|
} |
||||||
|
/*加载动画*/ |
||||||
|
@keyframes load { |
||||||
|
from { |
||||||
|
transform: rotate(0deg); |
||||||
|
} |
||||||
|
to { |
||||||
|
transform: rotate(360deg); |
||||||
|
} |
||||||
|
} |
||||||
|
.loadingpic { |
||||||
|
animation: load 3s linear 1s infinite; |
||||||
|
} |
||||||
|
.loading { |
||||||
|
animation: load linear 1s infinite; |
||||||
|
} |
@ -0,0 +1,43 @@ |
|||||||
|
input{line-height: normal; box-sizing:border-box;} |
||||||
|
@font-face { |
||||||
|
font-family: 'GuildfordProBook 5'; |
||||||
|
src: url('https://h5.dayouqiantu.cn/static/iconfont/GuildfordProBook5.otf'); |
||||||
|
} |
||||||
|
[v-cloak] { |
||||||
|
display: none; |
||||||
|
} |
||||||
|
.iconfont{ |
||||||
|
font-size: .36rem; |
||||||
|
} |
||||||
|
/* 一像素边框 */ |
||||||
|
@media (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5) { |
||||||
|
.border-1px::after { |
||||||
|
transform: scaleY(0.7); |
||||||
|
} |
||||||
|
.border-1px::before { |
||||||
|
transform: scaleY(0.7); |
||||||
|
} |
||||||
|
} |
||||||
|
@media (-webkit-min-device-pixel-ratio: 2), (min-device-pixel-ratio: 2) { |
||||||
|
.border-1px::after { |
||||||
|
transform: scaleY(0.5); |
||||||
|
} |
||||||
|
.border-1px::before { |
||||||
|
transform: scaleY(0.5); |
||||||
|
} |
||||||
|
} |
||||||
|
@media (-webkit-min-device-pixel-ratio: 3), (min-device-pixel-ratio: 3) { |
||||||
|
.border-1px::after { |
||||||
|
transform: scaleY(0.33); |
||||||
|
} |
||||||
|
.border-1px::before { |
||||||
|
transform: scaleY(0.33); |
||||||
|
} |
||||||
|
} |
||||||
|
.line1{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width: 100%;} |
||||||
|
.line2{word-break:break-all;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;} |
||||||
|
.mask{position:fixed;top:0;left:0;right:0;bottom:0;z-index:55;background-color:rgba(0,0,0,0.5);} |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
File diff suppressed because one or more lines are too long
After Width: | Height: | Size: 5.9 KiB |
After Width: | Height: | Size: 5.5 KiB |
After Width: | Height: | Size: 48 KiB |
After Width: | Height: | Size: 1.9 KiB |
@ -0,0 +1,77 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
<div class="address-window" :class="value === true ? 'on' : ''"> |
||||||
|
<div class="title"> |
||||||
|
选择地址 |
||||||
|
<span class="iconfont icon-guanbi" @click="closeAddress"></span> |
||||||
|
</div> |
||||||
|
<div class="list" v-if="addressList.length"> |
||||||
|
<div |
||||||
|
class="item acea-row row-between-wrapper" |
||||||
|
:class="item.id === checked ? 'font-color-red' : ''" |
||||||
|
v-for="(item, addressIndex) in addressList" |
||||||
|
@click="tapAddress(addressIndex)" |
||||||
|
:key="addressIndex" |
||||||
|
> |
||||||
|
<span class="iconfont icon-ditu" :class="item.id === checked ? 'font-color-red' : ''"></span> |
||||||
|
<div class="addressTxt"> |
||||||
|
<div class="name" :class="item.id === checked ? 'font-color-red' : ''"> |
||||||
|
{{ item.realName }} |
||||||
|
<span class="phone">{{ item.phone }}</span> |
||||||
|
</div> |
||||||
|
<div class="line1"> |
||||||
|
{{ item.province }}{{ item.city }}{{ item.district |
||||||
|
}}{{ item.detail }} |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<span class="iconfont icon-complete" :class="item.id === checked ? 'font-color-red' : ''"></span> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="pictrue" v-if="addressList.length < 1"> |
||||||
|
<img :src="$VUE_APP_RESOURCES_URL+'/images/noAddress.png'" class="image" /> |
||||||
|
</div> |
||||||
|
<div class="addressBnt bg-color-red" @click="goAddressPages">新加地址</div> |
||||||
|
</div> |
||||||
|
<div class="mask" @touchmove.prevent :hidden="value === false" @click="closeAddress"></div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
import { getAddressList } from "@/api/user"; |
||||||
|
|
||||||
|
export default { |
||||||
|
name: "AddressWindow", |
||||||
|
props: { |
||||||
|
value: Boolean, |
||||||
|
checked: Number |
||||||
|
}, |
||||||
|
data: function() { |
||||||
|
return { |
||||||
|
addressList: [], |
||||||
|
current: 0, |
||||||
|
cartId: 0, |
||||||
|
pinkId: 0, |
||||||
|
couponId: 0 |
||||||
|
}; |
||||||
|
}, |
||||||
|
mounted: function() {}, |
||||||
|
methods: { |
||||||
|
getAddressList: function() { |
||||||
|
let that = this; |
||||||
|
getAddressList().then(res => { |
||||||
|
that.addressList = res.data; |
||||||
|
}); |
||||||
|
}, |
||||||
|
closeAddress() { |
||||||
|
this.$emit("input", false); |
||||||
|
}, |
||||||
|
goAddressPages: function() { |
||||||
|
this.$yrouter.push({ path: "/pages/user/address/AddAddress/main" }); |
||||||
|
this.$emit("redirect"); |
||||||
|
}, |
||||||
|
tapAddress: function(index) { |
||||||
|
this.$emit("checked", this.addressList[index]); |
||||||
|
this.$emit("input", false); |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
@ -0,0 +1,106 @@ |
|||||||
|
<template> |
||||||
|
<div class="time"> |
||||||
|
{{ tipText }} |
||||||
|
<span class="styleAll" v-if="isDay === true">{{ day }}</span> |
||||||
|
<span class="timeTxt">{{ dayText }}</span> |
||||||
|
<span class="styleAll">{{ hour }}</span> |
||||||
|
<span class="timeTxt">{{ hourText }}</span> |
||||||
|
<span class="styleAll">{{ minute }}</span> |
||||||
|
<span class="timeTxt">{{ minuteText }}</span> |
||||||
|
<span class="styleAll">{{ second }}</span> |
||||||
|
<span class="timeTxt">{{ secondText }}</span> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
export default { |
||||||
|
name: "CountDown", |
||||||
|
props: { |
||||||
|
//距离开始提示文字 |
||||||
|
tipText: { |
||||||
|
type: String, |
||||||
|
default: "倒计时" |
||||||
|
}, |
||||||
|
dayText: { |
||||||
|
type: String, |
||||||
|
default: "天" |
||||||
|
}, |
||||||
|
hourText: { |
||||||
|
type: String, |
||||||
|
default: "时" |
||||||
|
}, |
||||||
|
minuteText: { |
||||||
|
type: String, |
||||||
|
default: "分" |
||||||
|
}, |
||||||
|
secondText: { |
||||||
|
type: String, |
||||||
|
default: "秒" |
||||||
|
}, |
||||||
|
datatime: { |
||||||
|
type: Number, |
||||||
|
default: 0 |
||||||
|
}, |
||||||
|
isDay: { |
||||||
|
type: Boolean, |
||||||
|
default: true |
||||||
|
} |
||||||
|
}, |
||||||
|
data: function() { |
||||||
|
return { |
||||||
|
day: "00", |
||||||
|
hour: "00", |
||||||
|
minute: "00", |
||||||
|
second: "00" |
||||||
|
}; |
||||||
|
}, |
||||||
|
created: function() { |
||||||
|
// this.show_time(); |
||||||
|
}, |
||||||
|
mounted: function() { |
||||||
|
this.show_time(); |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
show_time: function() { |
||||||
|
let that = this; |
||||||
|
this.runTime(); |
||||||
|
setInterval(this.runTime, 1000); |
||||||
|
}, |
||||||
|
runTime() { |
||||||
|
let that = this; |
||||||
|
//时间函数 |
||||||
|
let intDiff = that.datatime - Date.parse(new Date()) / 1000; //获取数据中的时间戳的时间差; |
||||||
|
let day = 0, |
||||||
|
hour = 0, |
||||||
|
minute = 0, |
||||||
|
second = 0; |
||||||
|
if (intDiff > 0) { |
||||||
|
//转换时间 |
||||||
|
if (that.isDay === true) { |
||||||
|
day = Math.floor(intDiff / (60 * 60 * 24)); |
||||||
|
} else { |
||||||
|
day = 0; |
||||||
|
} |
||||||
|
hour = Math.floor(intDiff / (60 * 60)) - day * 24; |
||||||
|
minute = Math.floor(intDiff / 60) - day * 24 * 60 - hour * 60; |
||||||
|
second = |
||||||
|
Math.floor(intDiff) - |
||||||
|
day * 24 * 60 * 60 - |
||||||
|
hour * 60 * 60 - |
||||||
|
minute * 60; |
||||||
|
if (hour <= 9) hour = "0" + hour; |
||||||
|
if (minute <= 9) minute = "0" + minute; |
||||||
|
if (second <= 9) second = "0" + second; |
||||||
|
that.day = day; |
||||||
|
that.hour = hour; |
||||||
|
that.minute = minute; |
||||||
|
that.second = second; |
||||||
|
} else { |
||||||
|
that.day = "00"; |
||||||
|
that.hour = "00"; |
||||||
|
that.minute = "00"; |
||||||
|
that.second = "00"; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
@ -0,0 +1,117 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
<div class="coupon-list-window" :class="value === true ? 'on' : ''"> |
||||||
|
<div class="title"> |
||||||
|
优惠券 |
||||||
|
<span class="iconfont icon-guanbi" @click="close"></span> |
||||||
|
</div> |
||||||
|
<div v-if="couponList.length > 0"> |
||||||
|
<div class="coupon-list"> |
||||||
|
<div |
||||||
|
class="item acea-row row-center-wrapper" |
||||||
|
v-for="coupon in couponList" |
||||||
|
:key="coupon.id" |
||||||
|
@click="click(coupon)" |
||||||
|
> |
||||||
|
<div class="money"> |
||||||
|
¥ |
||||||
|
<span class="num">{{ coupon.couponPrice }}</span> |
||||||
|
</div> |
||||||
|
<div class="text"> |
||||||
|
<div class="condition line1">{{ coupon.couponTitle }}</div> |
||||||
|
<div class="data acea-row row-between-wrapper"> |
||||||
|
<div v-if="coupon.endTime === 0">不限时</div> |
||||||
|
<div v-else><data-format-t :data="coupon.addTime"></data-format-t> - <data-format-t :data="coupon.endTime"></data-format-t></div> |
||||||
|
<div |
||||||
|
class="iconfont icon-xuanzhong1 font-color-red" |
||||||
|
v-if="checked === coupon.id" |
||||||
|
></div> |
||||||
|
<div class="iconfont icon-weixuanzhong" v-else></div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="couponNo bg-color-red" @click="couponNo">不使用优惠券</div> |
||||||
|
</div> |
||||||
|
<div v-if="!couponList.length && loaded"> |
||||||
|
<div class="pictrue"> |
||||||
|
<img :src="$VUE_APP_RESOURCES_URL+'/images/noCoupon.png'" class="image" /> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div |
||||||
|
class="mask" |
||||||
|
@touchmove.prevent |
||||||
|
:hidden="value === false" |
||||||
|
@click="close" |
||||||
|
></div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<style scoped> |
||||||
|
.coupon-list-window .iconfont { |
||||||
|
font-size: 0.4rem; |
||||||
|
} |
||||||
|
.couponNo { |
||||||
|
font-size: 0.3rem; |
||||||
|
font-weight: bold; |
||||||
|
color: #fff; |
||||||
|
width: 6.9rem; |
||||||
|
height: 0.86rem; |
||||||
|
border-radius: 0.43rem; |
||||||
|
text-align: center; |
||||||
|
line-height: 0.86rem; |
||||||
|
margin: 0.6rem auto; |
||||||
|
} |
||||||
|
</style> |
||||||
|
<script> |
||||||
|
import { getOrderCoupon } from "@/api/order"; |
||||||
|
import DataFormatT from "@/components/DataFormatT"; |
||||||
|
|
||||||
|
export default { |
||||||
|
name: "CouponListWindow", |
||||||
|
components: { |
||||||
|
DataFormatT |
||||||
|
}, |
||||||
|
props: { |
||||||
|
value: Boolean, |
||||||
|
checked: Number, |
||||||
|
price: { |
||||||
|
type: [Number, String], |
||||||
|
default: undefined |
||||||
|
} |
||||||
|
}, |
||||||
|
data: function() { |
||||||
|
return { |
||||||
|
couponList: [], |
||||||
|
loaded: false |
||||||
|
}; |
||||||
|
}, |
||||||
|
watch: { |
||||||
|
price(n) { |
||||||
|
if (n === undefined || n == null) return; |
||||||
|
this.getCoupon(); |
||||||
|
} |
||||||
|
}, |
||||||
|
mounted: function() {}, |
||||||
|
methods: { |
||||||
|
close: function() { |
||||||
|
this.$emit("input", false); |
||||||
|
this.$emit("close"); |
||||||
|
}, |
||||||
|
getCoupon() { |
||||||
|
getOrderCoupon(this.price).then(res => { |
||||||
|
this.couponList = res.data; |
||||||
|
this.loaded = true; |
||||||
|
}); |
||||||
|
}, |
||||||
|
click(coupon) { |
||||||
|
this.$emit("checked", coupon); |
||||||
|
this.$emit("input", false); |
||||||
|
}, |
||||||
|
couponNo: function() { |
||||||
|
this.$emit("checked", null); |
||||||
|
this.$emit("input", false); |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
@ -0,0 +1,78 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
<div class="coupon-list-window" :class="coupon.coupon === true ? 'on' : ''"> |
||||||
|
<div class="title"> |
||||||
|
优惠券<span class="iconfont icon-guanbi" @click="close"></span> |
||||||
|
</div> |
||||||
|
<div class="coupon-list" v-if="coupon.list.length > 0"> |
||||||
|
<div |
||||||
|
class="item acea-row row-center-wrapper" |
||||||
|
v-for="(item, couponpopIndex) in coupon.list" |
||||||
|
:key="couponpopIndex" |
||||||
|
@click="getCouponUser(couponpopIndex, item.id)" |
||||||
|
> |
||||||
|
<div class="money"> |
||||||
|
¥<span class="num">{{ item.coupon_price }}</span> |
||||||
|
</div> |
||||||
|
<div class="text"> |
||||||
|
<div class="condition line1"> |
||||||
|
购物满{{ item.use_min_price }}元可用 |
||||||
|
</div> |
||||||
|
<div class="data acea-row row-between-wrapper"> |
||||||
|
<div v-if="item.end_time === 0">不限时</div> |
||||||
|
<div v-else>{{ item.start_time }}-{{ item.end_time }}</div> |
||||||
|
<div |
||||||
|
class="bnt acea-row row-center-wrapper" |
||||||
|
:class="!item.is_use ? 'bg-color-red' : 'gray'" |
||||||
|
> |
||||||
|
{{ !item.is_use ? "立即领取" : "已领取" }} |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<!--无优惠券--> |
||||||
|
<div class="pictrue" v-else> |
||||||
|
<img :src="$VUE_APP_RESOURCES_URL+'/images/noCoupon.png'" class="image" /> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div |
||||||
|
class="mask" |
||||||
|
@touchmove.prevent |
||||||
|
:hidden="coupon.coupon === false" |
||||||
|
@click="close" |
||||||
|
></div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
import { getCouponReceive } from "@/api/user"; |
||||||
|
export default { |
||||||
|
name: "CouponPop", |
||||||
|
props: { |
||||||
|
coupon: { |
||||||
|
type: Object, |
||||||
|
default: () => {} |
||||||
|
} |
||||||
|
}, |
||||||
|
data: function() { |
||||||
|
return {}; |
||||||
|
}, |
||||||
|
mounted: function() {}, |
||||||
|
methods: { |
||||||
|
close: function() { |
||||||
|
this.$emit("changeFun", { action: "changecoupon", value: false }); //$emit():注册事件; |
||||||
|
}, |
||||||
|
getCouponUser: function(index, id) { |
||||||
|
let that = this, |
||||||
|
list = that.coupon.list; |
||||||
|
if (list[index].is_use === true) return; |
||||||
|
getCouponReceive(id).then(function() { |
||||||
|
that.$dialog.toast({ mes: "已领取" }); |
||||||
|
that.$set(list[index], "is_use", true); |
||||||
|
that.$emit("changefun", { action: "currentcoupon", value: index }); |
||||||
|
that.$emit("changeFun", { action: "changecoupon", value: false }); |
||||||
|
}); |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
@ -0,0 +1,80 @@ |
|||||||
|
<template> |
||||||
|
<div v-if="couponList.length > 0"> |
||||||
|
<div class="coupon-window" :class="value ? 'on' : ''"> |
||||||
|
<div class="couponWinList"> |
||||||
|
<div |
||||||
|
class="item acea-row row-between-wrapper" |
||||||
|
v-for="(item, couponwindiwIndex) in couponList" |
||||||
|
:key="couponwindiwIndex" |
||||||
|
> |
||||||
|
<div class="money font-color-red"> |
||||||
|
¥<span class="num">{{ item.coupon_price }}</span> |
||||||
|
</div> |
||||||
|
<div class="text"> |
||||||
|
<div class="name"> |
||||||
|
购物买{{ item.use_min_price }}减{{ item.coupon_price }} |
||||||
|
</div> |
||||||
|
<div v-if="item.end_time"> |
||||||
|
{{ item.start_time }}-{{ item.end_time }} |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div style="height:1.2rem"></div> |
||||||
|
</div> |
||||||
|
<div class="lid"> |
||||||
|
<div class="bnt font-color-red" @click="checked">立即领取</div> |
||||||
|
<div class="iconfont icon-guanbi3" @click="close"></div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="mask" @touchmove.prevent :hidden="!value"></div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
import { mapGetters } from "vuex"; |
||||||
|
import toLogin from "@/libs/login"; |
||||||
|
import { couponReceiveBatch } from "@/api/user"; |
||||||
|
|
||||||
|
export default { |
||||||
|
name: "CouponWindow", |
||||||
|
props: { |
||||||
|
couponList: { |
||||||
|
type: Array, |
||||||
|
default: () => [] |
||||||
|
} |
||||||
|
}, |
||||||
|
computed: mapGetters(["isLogin"]), |
||||||
|
data: function() { |
||||||
|
return { |
||||||
|
value: true |
||||||
|
}; |
||||||
|
}, |
||||||
|
mounted: function() {}, |
||||||
|
methods: { |
||||||
|
checked() { |
||||||
|
const isLogin = this.isLogin; |
||||||
|
if (!isLogin) return toLogin(); |
||||||
|
|
||||||
|
const ids = this.couponList.reduce((initial, coupon) => { |
||||||
|
initial.push(coupon.id); |
||||||
|
return initial; |
||||||
|
}, []); |
||||||
|
couponReceiveBatch(ids) |
||||||
|
.then(() => { |
||||||
|
this.$emit("success"); |
||||||
|
this.$dialog.toast({ mes: "领取成功" }); |
||||||
|
}) |
||||||
|
.catch(() => { |
||||||
|
this.$dialog.toast({ mes: "已领取" }); |
||||||
|
}); |
||||||
|
if (isLogin) { |
||||||
|
this.value = false; |
||||||
|
this.$emit("checked"); |
||||||
|
} |
||||||
|
}, |
||||||
|
close: function() { |
||||||
|
this.value = false; |
||||||
|
this.$emit("close"); |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
@ -0,0 +1,24 @@ |
|||||||
|
<template> |
||||||
|
<span>{{time}}</span> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
import { dataFormat } from "@/utils"; |
||||||
|
|
||||||
|
export default { |
||||||
|
name: "DataFormat", |
||||||
|
props: ["data"], |
||||||
|
data: function() { |
||||||
|
return { |
||||||
|
time: "" |
||||||
|
}; |
||||||
|
}, |
||||||
|
mounted() { |
||||||
|
this.time = dataFormat(this.data); |
||||||
|
}, |
||||||
|
watch: { |
||||||
|
"$props.data"(props) { |
||||||
|
this.time = dataFormat(this.data); |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
@ -0,0 +1,24 @@ |
|||||||
|
<template> |
||||||
|
<span>{{time}}</span> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
import { dataFormatT } from "@/utils"; |
||||||
|
|
||||||
|
export default { |
||||||
|
name: "DataFormatT", |
||||||
|
props: ["data"], |
||||||
|
data: function() { |
||||||
|
return { |
||||||
|
time: "" |
||||||
|
}; |
||||||
|
}, |
||||||
|
mounted() { |
||||||
|
this.time = dataFormatT(this.data); |
||||||
|
}, |
||||||
|
watch: { |
||||||
|
"$props.data"(props) { |
||||||
|
this.time = dataFormatT(this.data); |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
@ -0,0 +1,78 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
<div v-if="isIpx" class="iphonex-footer-bg"></div> |
||||||
|
<div v-else class="footer-bg"></div> |
||||||
|
<div id="footer" :class="[isIpx ? 'iphonex-footer' : '', 'acea-row row-middle'] "> |
||||||
|
<div |
||||||
|
@click="changeTabtar(footerIndex)" |
||||||
|
class="item" |
||||||
|
:class="{ on: footerIndex == tabtarIndex }" |
||||||
|
v-for="(item, footerIndex) in footerList" |
||||||
|
:key="footerIndex" |
||||||
|
> |
||||||
|
<div |
||||||
|
class="iconfont" |
||||||
|
:class="item.icon1 + ' ' + (footerIndex == tabtarIndex ? item.icon2 : '')" |
||||||
|
></div> |
||||||
|
<div>{{ item.name }}</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
import { mapState, mapMutations, mapActions } from "vuex"; |
||||||
|
export default { |
||||||
|
name: "Footer", |
||||||
|
props: {}, |
||||||
|
data: function() { |
||||||
|
return { |
||||||
|
footerList: [ |
||||||
|
{ |
||||||
|
name: "首页", |
||||||
|
icon1: "icon-shouye-xianxing", |
||||||
|
icon2: "icon-shouye", |
||||||
|
url: "/pages/home/main" |
||||||
|
}, |
||||||
|
{ |
||||||
|
name: "分类", |
||||||
|
icon1: "icon-yingyongchengxu-xianxing", |
||||||
|
icon2: "icon-yingyongchengxu", |
||||||
|
url: "/pages/shop/GoodsClass/main" |
||||||
|
}, |
||||||
|
{ |
||||||
|
name: "购物车", |
||||||
|
icon1: "icon-caigou-xianxing", |
||||||
|
icon2: "icon-caigou", |
||||||
|
url: "/pages/shop/ShoppingCart/main" |
||||||
|
}, |
||||||
|
{ |
||||||
|
name: "我的", |
||||||
|
icon1: "icon-yonghu-xianxing", |
||||||
|
icon2: "icon-yonghu", |
||||||
|
url: "/pages/user/User/main" |
||||||
|
} |
||||||
|
], |
||||||
|
isIpx: false |
||||||
|
}; |
||||||
|
}, |
||||||
|
computed: { |
||||||
|
...mapState(["tabtarIndex"]) |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
...mapActions(["changeTabtar"]) |
||||||
|
}, |
||||||
|
mounted() { |
||||||
|
let that = this; |
||||||
|
this.changeTabtar(this.$yroute.query.type); |
||||||
|
wx.getSystemInfo({ |
||||||
|
success: function(res) { |
||||||
|
console.log(res); |
||||||
|
var name = "iPhone X"; |
||||||
|
if (res.model.indexOf(name) > -1) { |
||||||
|
that.isIpx = true; |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
@ -0,0 +1,52 @@ |
|||||||
|
<template> |
||||||
|
<div class="goodList"> |
||||||
|
<div |
||||||
|
@click="$yrouter.push({ path: '/pages/shop/GoodsCon/index',query:{id:item.id} })" |
||||||
|
class="item acea-row row-between-wrapper" |
||||||
|
v-for="(item, goodlistIndex) in goodList" |
||||||
|
:key="goodlistIndex" |
||||||
|
> |
||||||
|
<div class="pictrue"> |
||||||
|
<img :src="item.image" class="image" /> |
||||||
|
<img :src="$VUE_APP_RESOURCES_URL+'/images/one.png'" class="numPic" v-if="isSort === true && index === 0" /> |
||||||
|
<img :src="$VUE_APP_RESOURCES_URL+'/images/two.png'" class="numPic" v-if="isSort === true && index === 1" /> |
||||||
|
<img :src="$VUE_APP_RESOURCES_URL+'/images/three.png'" class="numPic" v-if="isSort === true && index === 2" /> |
||||||
|
</div> |
||||||
|
<div class="underline"> |
||||||
|
<div class="text"> |
||||||
|
<div class="line1">{{ item.storeName }}</div> |
||||||
|
<div class="money font-color-red"> |
||||||
|
¥ |
||||||
|
<span class="num">{{ item.price }}</span> |
||||||
|
</div> |
||||||
|
<div class="vip-money acea-row row-middle"> |
||||||
|
<div class="vip"> |
||||||
|
¥{{ item.otPrice || 0 |
||||||
|
}} |
||||||
|
</div> |
||||||
|
<span class="num">已售{{ item.sales }}{{ item.unitName }}</span> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="iconfont icon-gouwuche cart-color acea-row row-center-wrapper"></div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
export default { |
||||||
|
name: "GoodList", |
||||||
|
props: { |
||||||
|
goodList: { |
||||||
|
type: Array, |
||||||
|
default: () => [] |
||||||
|
}, |
||||||
|
isSort: { |
||||||
|
type: Boolean, |
||||||
|
default: true |
||||||
|
} |
||||||
|
}, |
||||||
|
data: function() { |
||||||
|
return {}; |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
@ -0,0 +1,69 @@ |
|||||||
|
<template> |
||||||
|
<div |
||||||
|
class="home" |
||||||
|
:style="{ top: top + 'px' }" |
||||||
|
style="position:fixed;" |
||||||
|
id="right-nav" |
||||||
|
@touchmove="touchmove($event)" |
||||||
|
> |
||||||
|
<div class="homeCon bg-color-red1" :class="homeActive === true ? 'on' : ''"> |
||||||
|
<div |
||||||
|
@click="$yrouter.switchTab('/pages/home/index')" |
||||||
|
class="iconfont icon-shouye-xianxing " |
||||||
|
style="color: green;" |
||||||
|
></div> |
||||||
|
<div |
||||||
|
@click="$yrouter.switchTab('/pages/shop/ShoppingCart/index')" |
||||||
|
class="iconfont icon-caigou-xianxing" |
||||||
|
style="color: green;" |
||||||
|
></div> |
||||||
|
<!--<div @click="$yrouter.push('/pages/user/User/index'" class="iconfont icon-yonghu1"></div>--> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
import { mapGetters } from "vuex"; |
||||||
|
export default { |
||||||
|
name: "Home", |
||||||
|
props: {}, |
||||||
|
data: function() { |
||||||
|
return { |
||||||
|
top: "", |
||||||
|
homeActive: true |
||||||
|
}; |
||||||
|
}, |
||||||
|
computed: mapGetters(["homeActive"]), |
||||||
|
methods: { |
||||||
|
touchmove(event) { |
||||||
|
// event.preventDefault(); |
||||||
|
// let top = |
||||||
|
// event.touches[0].pageY - |
||||||
|
// (document.documentElement.scrollTop || document.body.scrollTop) - |
||||||
|
// this.$el.clientHeight; |
||||||
|
|
||||||
|
// if (top > 390) top = 390; |
||||||
|
// else if (top < 55) top = 55; |
||||||
|
this.top = 55; |
||||||
|
}, |
||||||
|
open: function() { |
||||||
|
this.homeActive |
||||||
|
? this.$store.commit("CLOSE_HOME") |
||||||
|
: this.$store.commit("OPEN_HOME"); |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
<style scoped> |
||||||
|
.mystyl { |
||||||
|
display: inline-block; |
||||||
|
width: 0.64rem; |
||||||
|
height: 0.64rem; |
||||||
|
margin-top: 0.12rem; |
||||||
|
box-sizing: border-box; |
||||||
|
border: 1px solid #e1e1e1; |
||||||
|
border-radius: 50%; |
||||||
|
background-size: 1.24rem auto; |
||||||
|
background-repeat: no-repeat; |
||||||
|
background-color: rgba(255, 255, 255, 0.9); |
||||||
|
} |
||||||
|
</style> |
@ -0,0 +1,27 @@ |
|||||||
|
<template> |
||||||
|
<div |
||||||
|
class="Loads acea-row row-center-wrapper" |
||||||
|
v-if="loading || !loaded" |
||||||
|
style="margin-top: .2rem;" |
||||||
|
> |
||||||
|
<template v-if="loading"> |
||||||
|
<div |
||||||
|
class="iconfont icon-jiazai loading acea-row row-center-wrapper" |
||||||
|
></div> |
||||||
|
正在加载中 |
||||||
|
</template> |
||||||
|
<template v-else> |
||||||
|
上拉加载更多 |
||||||
|
</template> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
name: "Loading", |
||||||
|
props: { |
||||||
|
loaded: Boolean, |
||||||
|
loading: Boolean |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
@ -0,0 +1,45 @@ |
|||||||
|
<template> |
||||||
|
<div class="orderGoods"> |
||||||
|
<div class="total">共{{ cartInfo.length }}件商品</div> |
||||||
|
<div class="goodWrapper"> |
||||||
|
<div class="item acea-row row-between-wrapper" v-for="cart in cartInfo" :key="cart.id"> |
||||||
|
<div class="pictrue"> |
||||||
|
<img :src="cart.productInfo.image" class="image" /> |
||||||
|
</div> |
||||||
|
<div class="text"> |
||||||
|
<div class="acea-row row-between-wrapper"> |
||||||
|
<div class="name line1">{{ cart.productInfo.storeName }}</div> |
||||||
|
<div class="num">x {{ cart.cartNum }}</div> |
||||||
|
</div> |
||||||
|
<div |
||||||
|
class="attr line1" |
||||||
|
v-if="cart.productInfo.attrInfo" |
||||||
|
>{{ cart.productInfo.attrInfo.suk }}</div> |
||||||
|
<div class="money font-color-red">¥{{ cart.truePrice }}</div> |
||||||
|
<div |
||||||
|
class="evaluate" |
||||||
|
v-if="evaluate == 3" |
||||||
|
@click="$yrouter.push({ path: '/pages/shop/GoodsEvaluate/index',query:{id:cart.unique} })" |
||||||
|
>评价</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
export default { |
||||||
|
name: "OrderGoods", |
||||||
|
props: { |
||||||
|
evaluate: Number, |
||||||
|
cartInfo: { |
||||||
|
type: Array, |
||||||
|
default: () => [] |
||||||
|
} |
||||||
|
}, |
||||||
|
data: function() { |
||||||
|
return {}; |
||||||
|
}, |
||||||
|
mounted: function() {}, |
||||||
|
methods: {} |
||||||
|
}; |
||||||
|
</script> |
@ -0,0 +1,202 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
<div class="payment" :class="value === true ? 'on' : ''"> |
||||||
|
<div class="title acea-row row-center-wrapper"> |
||||||
|
选择付款方式<span class="iconfont icon-guanbi" @click="close"></span> |
||||||
|
</div> |
||||||
|
<div |
||||||
|
class="item acea-row row-between-wrapper" |
||||||
|
v-if="types.indexOf('weixin') !== -1" |
||||||
|
@click="checked('weixin')" |
||||||
|
> |
||||||
|
<div class="left acea-row row-between-wrapper"> |
||||||
|
<div class="iconfont icon-weixinzhifu"></div> |
||||||
|
<div class="text"> |
||||||
|
<div class="name">微信支付</div> |
||||||
|
<div class="info">使用微信快捷支付</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="iconfont icon-xiangyou"></div> |
||||||
|
</div> |
||||||
|
<!-- <div |
||||||
|
class="item acea-row row-between-wrapper" |
||||||
|
v-if="types.indexOf('alipay') !== -1" |
||||||
|
@click="checked('alipay')" |
||||||
|
> |
||||||
|
<div class="left acea-row row-between-wrapper"> |
||||||
|
<div class="iconfont icon-zhifubao"></div> |
||||||
|
<div class="text"> |
||||||
|
<div class="name">支付宝支付</div> |
||||||
|
<div class="info">使用线上支付宝支付</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="iconfont icon-xiangyou"></div> |
||||||
|
</div> --> |
||||||
|
<div |
||||||
|
class="item acea-row row-between-wrapper" |
||||||
|
v-if="types.indexOf('yue') !== -1" |
||||||
|
@click="checked('yue')" |
||||||
|
> |
||||||
|
<div class="left acea-row row-between-wrapper"> |
||||||
|
<div class="iconfont icon-yuezhifu"></div> |
||||||
|
<div class="text"> |
||||||
|
<div class="name">余额支付</div> |
||||||
|
<div class="info"> |
||||||
|
当前可用余额:<span class="money">{{ balance }}</span> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="iconfont icon-xiangyou"></div> |
||||||
|
</div> |
||||||
|
<!-- <div |
||||||
|
class="item acea-row row-between-wrapper" |
||||||
|
v-if="types.indexOf('offline') !== -1" |
||||||
|
@click="checked('offline')" |
||||||
|
> |
||||||
|
<div class="left acea-row row-between-wrapper"> |
||||||
|
<div class="iconfont icon-yuezhifu1"></div> |
||||||
|
<div class="text"> |
||||||
|
<div class="name">线下支付</div> |
||||||
|
<div class="info">选择线下付款方式</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="iconfont icon-xiangyou"></div> |
||||||
|
</div> --> |
||||||
|
</div> |
||||||
|
<div class="mask" v-show="value" @click="close"></div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
export default { |
||||||
|
name: "Payment", |
||||||
|
props: { |
||||||
|
value: { |
||||||
|
type: Boolean, |
||||||
|
default: false |
||||||
|
}, |
||||||
|
balance: { |
||||||
|
type: [Number, String], |
||||||
|
default: 0 |
||||||
|
}, |
||||||
|
types: { |
||||||
|
type: Array, |
||||||
|
default: () => ["weixin", "alipay", "yue", "offline"] |
||||||
|
} |
||||||
|
}, |
||||||
|
data: function() { |
||||||
|
return {}; |
||||||
|
}, |
||||||
|
mounted: function() {}, |
||||||
|
methods: { |
||||||
|
checked: function(type) { |
||||||
|
this.$emit("checked", type); |
||||||
|
this.close(); |
||||||
|
}, |
||||||
|
close: function() { |
||||||
|
this.$emit("input", false); |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
<style scoped> |
||||||
|
.payment { |
||||||
|
position: fixed; |
||||||
|
bottom: 0; |
||||||
|
left: 0; |
||||||
|
width: 100%; |
||||||
|
border-radius: 0.16rem 0.16rem 0 0; |
||||||
|
background-color: #fff; |
||||||
|
padding-bottom: 0.6rem; |
||||||
|
z-index: 99; |
||||||
|
transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9); |
||||||
|
-webkit-transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9); |
||||||
|
-moz-transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9); |
||||||
|
-o-transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9); |
||||||
|
transform: translate3d(0, 100%, 0); |
||||||
|
-webkit-transform: translate3d(0, 100%, 0); |
||||||
|
-ms-transform: translate3d(0, 100%, 0); |
||||||
|
-moz-transform: translate3d(0, 100%, 0); |
||||||
|
-o-transform: translate3d(0, 100%, 0); |
||||||
|
} |
||||||
|
|
||||||
|
.payment.on { |
||||||
|
transform: translate3d(0, 0, 0); |
||||||
|
-webkit-transform: translate3d(0, 0, 0); |
||||||
|
-ms-transform: translate3d(0, 0, 0); |
||||||
|
-moz-transform: translate3d(0, 0, 0); |
||||||
|
-o-transform: translate3d(0, 0, 0); |
||||||
|
} |
||||||
|
|
||||||
|
.payment .title { |
||||||
|
text-align: center; |
||||||
|
height: 1.23rem; |
||||||
|
font-size: 0.32rem; |
||||||
|
color: #282828; |
||||||
|
font-weight: bold; |
||||||
|
padding-right: 0.3rem; |
||||||
|
margin-left: 0.3rem; |
||||||
|
position: relative; |
||||||
|
border-bottom: 0.01rem solid #eee; |
||||||
|
} |
||||||
|
|
||||||
|
.payment .title .iconfont { |
||||||
|
position: absolute; |
||||||
|
right: 0.3rem; |
||||||
|
top: 50%; |
||||||
|
transform: translateY(-50%); |
||||||
|
font-size: 0.43rem; |
||||||
|
color: #8a8a8a; |
||||||
|
font-weight: normal; |
||||||
|
} |
||||||
|
|
||||||
|
.payment .item { |
||||||
|
border-bottom: 0.01rem solid #eee; |
||||||
|
height: 1.3rem; |
||||||
|
margin-left: 0.3rem; |
||||||
|
padding-right: 0.3rem; |
||||||
|
} |
||||||
|
|
||||||
|
.payment .item .left { |
||||||
|
width: 6.1rem; |
||||||
|
} |
||||||
|
|
||||||
|
.payment .item .left .text { |
||||||
|
width: 5.4rem; |
||||||
|
} |
||||||
|
|
||||||
|
.payment .item .left .text .name { |
||||||
|
font-size: 0.32rem; |
||||||
|
color: #282828; |
||||||
|
} |
||||||
|
|
||||||
|
.payment .item .left .text .info { |
||||||
|
font-size: 0.24rem; |
||||||
|
color: #999; |
||||||
|
} |
||||||
|
|
||||||
|
.payment .item .left .text .info .money { |
||||||
|
color: #ff9900; |
||||||
|
} |
||||||
|
|
||||||
|
.payment .item .left .iconfont { |
||||||
|
font-size: 0.45rem; |
||||||
|
color: #09bb07; |
||||||
|
} |
||||||
|
|
||||||
|
.payment .item .left .iconfont.icon-zhifubao { |
||||||
|
color: #00aaea; |
||||||
|
} |
||||||
|
|
||||||
|
.payment .item .left .iconfont.icon-yuezhifu { |
||||||
|
color: #ff9900; |
||||||
|
} |
||||||
|
|
||||||
|
.payment .item .left .iconfont.icon-yuezhifu1 { |
||||||
|
color: #eb6623; |
||||||
|
} |
||||||
|
|
||||||
|
.payment .item .iconfont { |
||||||
|
font-size: 0.3rem; |
||||||
|
color: #999; |
||||||
|
} |
||||||
|
</style> |
@ -0,0 +1,133 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
<div class="priceChange" :class="change === true ? 'on' : ''"> |
||||||
|
<div class="priceTitle"> |
||||||
|
<span v-if="status==0"> |
||||||
|
<span v-if="orderInfo.refundStatus == 1">立即退款</span> |
||||||
|
<span v-if="orderInfo.refundStatus != 1">一键改价</span> |
||||||
|
</span> |
||||||
|
<span v-if="status!=0">订单备注</span> |
||||||
|
<span class="iconfont icon-guanbi" @click="close"></span> |
||||||
|
</div> |
||||||
|
<div class="listChange" v-if="status == 0"> |
||||||
|
<div class="item acea-row row-between-wrapper" v-if="orderInfo.refundStatus === 0"> |
||||||
|
<div>商品总价(¥)</div> |
||||||
|
<div class="money"> |
||||||
|
{{ orderInfo.totalPrice }} |
||||||
|
<span class="iconfont icon-suozi"></span> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="item acea-row row-between-wrapper" v-if="orderInfo.refundStatus === 0"> |
||||||
|
<div>原始邮费(¥)</div> |
||||||
|
<div class="money"> |
||||||
|
{{ orderInfo.payPostage }} |
||||||
|
<span class="iconfont icon-suozi"></span> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="item acea-row row-between-wrapper" v-if="orderInfo.refundStatus === 0"> |
||||||
|
<div>实际支付(¥)</div> |
||||||
|
<div class="money"> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
v-model="price" |
||||||
|
:class="focus === true ? 'on' : ''" |
||||||
|
@focus="priceChange" |
||||||
|
/> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="item acea-row row-between-wrapper" v-if="orderInfo.refundStatus === 1"> |
||||||
|
<div>实际支付(¥)</div> |
||||||
|
<div class="money"> |
||||||
|
{{ orderInfo.payPrice }} |
||||||
|
<span class="iconfont icon-suozi"></span> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="item acea-row row-between-wrapper" v-if="orderInfo.refundStatus === 1"> |
||||||
|
<div>退款金额(¥)</div> |
||||||
|
<div class="money"> |
||||||
|
<input |
||||||
|
type="text" |
||||||
|
v-model="refund_price" |
||||||
|
:class="focus === true ? 'on' : ''" |
||||||
|
@focus="priceChange" |
||||||
|
/> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="listChange" v-else> |
||||||
|
<textarea |
||||||
|
:placeholder="'请填写备注信息...'" |
||||||
|
v-model="remark" |
||||||
|
></textarea> |
||||||
|
</div> |
||||||
|
<div class="modify" @click="save">{{ orderInfo.refundStatus === 0 ? "立即修改" : "确认退款" }}</div> |
||||||
|
<div class="modify1" @click="refuse" v-if="orderInfo.refundStatus === 1">拒绝退款</div> |
||||||
|
</div> |
||||||
|
<div class="mask" @touchmove.prevent v-show="change === true"></div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<style scoped> |
||||||
|
.priceChange .listChange textarea { |
||||||
|
border: 1px solid #eee; |
||||||
|
width: 100%; |
||||||
|
height: 2rem; |
||||||
|
margin-top: 0.5rem; |
||||||
|
border-radius: 0.1rem; |
||||||
|
color: #333; |
||||||
|
padding: 0.2rem; |
||||||
|
} |
||||||
|
</style> |
||||||
|
<script> |
||||||
|
export default { |
||||||
|
name: "PriceChange", |
||||||
|
components: {}, |
||||||
|
props: { |
||||||
|
change: Boolean, |
||||||
|
orderInfo: Object, |
||||||
|
status: String |
||||||
|
}, |
||||||
|
data: function() { |
||||||
|
return { |
||||||
|
focus: false, |
||||||
|
price: 0, |
||||||
|
refund_price: 0, |
||||||
|
remark: "" |
||||||
|
}; |
||||||
|
}, |
||||||
|
watch: { |
||||||
|
orderInfo: function() { |
||||||
|
this.price = this.orderInfo.payPrice; |
||||||
|
this.refund_price = this.orderInfo.payPrice; |
||||||
|
this.remark = ""; |
||||||
|
} |
||||||
|
}, |
||||||
|
mounted: function() {}, |
||||||
|
methods: { |
||||||
|
priceChange: function() { |
||||||
|
this.focus = true; |
||||||
|
}, |
||||||
|
close: function() { |
||||||
|
this.price = this.orderInfo.payPrice; |
||||||
|
this.$emit("closechange", false); |
||||||
|
}, |
||||||
|
save: function() { |
||||||
|
let that = this; |
||||||
|
that.$emit("savePrice", { |
||||||
|
price: that.price, |
||||||
|
refund_price: that.refund_price, |
||||||
|
type: 1, |
||||||
|
remark: that.remark |
||||||
|
}); |
||||||
|
}, |
||||||
|
refuse: function() { |
||||||
|
let that = this; |
||||||
|
that.$emit("savePrice", { |
||||||
|
price: that.price, |
||||||
|
refund_price: that.refund_price, |
||||||
|
type: 2, |
||||||
|
remark: that.remark |
||||||
|
}); |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
@ -0,0 +1,61 @@ |
|||||||
|
<template> |
||||||
|
<div class="slider-banner product-bg"> |
||||||
|
<swiper class="swiper-wrapper" @change="handleChange" v-if="imgUrls.length > 0"> |
||||||
|
<block v-for="(item, imgUrlsIndex) in imgUrls" :key="imgUrlsIndex"> |
||||||
|
<swiper-item> |
||||||
|
<img :src="item" class="slide-image" /> |
||||||
|
</swiper-item> |
||||||
|
</block> |
||||||
|
</swiper> |
||||||
|
<!-- <swiper class="swiper-wrapper" :options="ProductConSwiper" v-if="imgUrls.length > 0"> |
||||||
|
<swiperSlide class="swiper-slide" v-for="item in imgUrls" :key="item" ref="goodSwiper"> |
||||||
|
<img :src="item" class="slide-image" /> |
||||||
|
</swiperSlide> |
||||||
|
</swiper>--> |
||||||
|
<div class="pages">{{ currents || 1 }}/{{ imgUrls.length || 1 }}</div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
// import { swiper, swiperSlide } from "vue-awesome-swiper"; |
||||||
|
|
||||||
|
export default { |
||||||
|
name: "ProductConSwiper", |
||||||
|
components: { |
||||||
|
// swiper, |
||||||
|
// swiperSlide |
||||||
|
}, |
||||||
|
props: { |
||||||
|
imgUrls: { |
||||||
|
type: Array, |
||||||
|
default: () => [] |
||||||
|
} |
||||||
|
}, |
||||||
|
data: function() { |
||||||
|
let that = this; |
||||||
|
return { |
||||||
|
currents: 1, |
||||||
|
ProductConSwiper: { |
||||||
|
autoplay: { |
||||||
|
disableOnInteraction: false, |
||||||
|
delay: 2000 |
||||||
|
}, |
||||||
|
loop: true, |
||||||
|
speed: 1000, |
||||||
|
observer: true, |
||||||
|
observeParents: true, |
||||||
|
on: { |
||||||
|
slideChangeTransitionStart: function() { |
||||||
|
that.currents = this.realIndex + 1; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
}, |
||||||
|
mounted: function() {}, |
||||||
|
methods: { |
||||||
|
handleChange(event) { |
||||||
|
this.currents = event.mp.detail.current + 1; |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
@ -0,0 +1,113 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
<div class="product-window" :class="attr.cartAttr === true ? 'on' : ''"> |
||||||
|
<div class="textpic acea-row row-between-wrapper"> |
||||||
|
<div class="pictrue"> |
||||||
|
<img :src="attr.productSelect.image" class="image" /> |
||||||
|
</div> |
||||||
|
<div class="text"> |
||||||
|
<div class="line1">{{ attr.productSelect.store_name }}</div> |
||||||
|
<div class="money font-color-red"> |
||||||
|
¥ |
||||||
|
<span class="num">{{ attr.productSelect.price }}</span> |
||||||
|
<span class="stock">库存: {{ attr.productSelect.stock }}</span> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="iconfont icon-guanbi" @click="closeAttr"></div> |
||||||
|
</div> |
||||||
|
<div class="productWinList"> |
||||||
|
<div class="item" v-for="(item, indexw) in attr.productAttr" :key="indexw"> |
||||||
|
<div class="title">{{ item.attrName }}</div> |
||||||
|
<div class="listn acea-row row-middle"> |
||||||
|
<div |
||||||
|
class="itemn" |
||||||
|
:class="item.index == indexn ? 'on' : ''" |
||||||
|
v-for="(itemn, indexn) in item.attrValue" |
||||||
|
@click="tapAttr(indexw, indexn)" |
||||||
|
:key="indexn" |
||||||
|
>{{ itemn.attr }}</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="cart"> |
||||||
|
<div class="title">数量</div> |
||||||
|
<div class="carnum acea-row row-left"> |
||||||
|
<div class="item reduce" :class="cartNum <= 1 ? 'on' : ''" @click="CartNumDes">-</div> |
||||||
|
<div class="item num">{{ cartNum }}</div> |
||||||
|
<div |
||||||
|
class="item plus" |
||||||
|
:class=" |
||||||
|
cartNum >= attr.productSelect.stock |
||||||
|
? 'on' |
||||||
|
: '' |
||||||
|
" |
||||||
|
@click="CartNumAdd" |
||||||
|
>+</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="mask" @touchmove.prevent :hidden="attr.cartAttr === false" @click="closeAttr"></div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
export default { |
||||||
|
name: "ProductWindow", |
||||||
|
props: { |
||||||
|
attr: { |
||||||
|
type: Object, |
||||||
|
default: () => {} |
||||||
|
}, |
||||||
|
cartNum: { |
||||||
|
type: String, |
||||||
|
default: () => 1 |
||||||
|
} |
||||||
|
}, |
||||||
|
data: function() { |
||||||
|
return {}; |
||||||
|
}, |
||||||
|
watch: { |
||||||
|
attr:function(ne){ |
||||||
|
console.log(ne) |
||||||
|
} |
||||||
|
}, |
||||||
|
mounted: function() { |
||||||
|
console.log(this.attr) |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
closeAttr: function() { |
||||||
|
this.$emit("changeFun", { action: "changeattr", value: false }); |
||||||
|
}, |
||||||
|
CartNumDes: function() { |
||||||
|
this.$emit("changeFun", { action: "ChangeCartNum", value: false }); |
||||||
|
}, |
||||||
|
CartNumAdd: function() { |
||||||
|
this.$emit("changeFun", { action: "ChangeCartNum", value: 1 }); |
||||||
|
}, |
||||||
|
tapAttr: function(indexw, indexn) { |
||||||
|
let that = this; |
||||||
|
console.log(that.attr.productAttr); |
||||||
|
console.log(that.attr.productAttr[indexw], indexw, indexn); |
||||||
|
that.attr.productAttr[indexw].index = indexn; |
||||||
|
let value = that |
||||||
|
.getCheckedValue() |
||||||
|
.sort() |
||||||
|
.join(","); |
||||||
|
console.log(value); |
||||||
|
that.$emit("changeFun", { action: "ChangeAttr", value: value }); |
||||||
|
}, |
||||||
|
//获取被选中属性; |
||||||
|
getCheckedValue: function() { |
||||||
|
let productAttr = this.attr.productAttr; |
||||||
|
let value = []; |
||||||
|
for (let i = 0; i < productAttr.length; i++) { |
||||||
|
for (let j = 0; j < productAttr[i].attrValueArr.length; j++) { |
||||||
|
if (productAttr[i].index === j) { |
||||||
|
value.push(productAttr[i].attrValueArr[j]); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
return value; |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
@ -0,0 +1,41 @@ |
|||||||
|
<template> |
||||||
|
<div class="promotionGood" v-if="benefit.length > 0"> |
||||||
|
<div |
||||||
|
@click="$yrouter.push({ path: '/pages/shop/GoodsCon/index',query:{id:item.id} })" |
||||||
|
class="item acea-row row-between-wrapper" |
||||||
|
v-for="(item, promotionGoodIndex) in benefit" |
||||||
|
:key="promotionGoodIndex" |
||||||
|
> |
||||||
|
<div class="pictrue"> |
||||||
|
<img :src="item.image" class="image" /> |
||||||
|
</div> |
||||||
|
<div class="text"> |
||||||
|
<div class="name line1">{{ item.storeName }}</div> |
||||||
|
<div class="sp-money acea-row"> |
||||||
|
<div class="moneyCon"> |
||||||
|
促销价: ¥ |
||||||
|
<span class="num">{{ item.price }}</span> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="acea-row row-between-wrapper"> |
||||||
|
<div class="money">日常价:¥{{ item.otPrice }}</div> |
||||||
|
<div>仅剩:{{ item.stock }}{{ item.unitName }}</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
export default { |
||||||
|
name: "PromotionGood", |
||||||
|
props: { |
||||||
|
benefit: { |
||||||
|
type: Array, |
||||||
|
default: () => [] |
||||||
|
} |
||||||
|
}, |
||||||
|
data: function() { |
||||||
|
return {}; |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
@ -0,0 +1,69 @@ |
|||||||
|
<template> |
||||||
|
<div class="recommend" ref="container"> |
||||||
|
<div class="title acea-row row-center-wrapper"> |
||||||
|
<span class="iconfont icon-zhuangshixian"></span> |
||||||
|
<span class="name">为你推荐</span> |
||||||
|
<span class="iconfont icon-zhuangshixian lefticon"></span> |
||||||
|
</div> |
||||||
|
<div class="recommendList acea-row row-between-wrapper"> |
||||||
|
<div |
||||||
|
@click="$yrouter.push({ path: '/pages/shop/GoodsCon/index',query:{id:item.id} })" |
||||||
|
class="item" |
||||||
|
v-for="(item, recommendIndex) in hostProduct" |
||||||
|
:key="recommendIndex" |
||||||
|
> |
||||||
|
<div class="pictrue"> |
||||||
|
<img :src="item.image" class="image" /> |
||||||
|
</div> |
||||||
|
<div class="name line1">{{ item.storeName }}</div> |
||||||
|
<div class="money font-color-red"> |
||||||
|
¥ |
||||||
|
<span class="num">{{ item.price }}</span> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<Loading :loaded="loadend" :loading="loading"></Loading> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
import { getHostProducts } from "@/api/store"; |
||||||
|
import Loading from "@/components/Loading"; |
||||||
|
export default { |
||||||
|
name: "Recommend", |
||||||
|
props: {}, |
||||||
|
components: { |
||||||
|
Loading |
||||||
|
}, |
||||||
|
data: function() { |
||||||
|
return { |
||||||
|
hostProduct: [], |
||||||
|
page: 1, |
||||||
|
limit: 20, |
||||||
|
loadTitle: "", |
||||||
|
loading: false, |
||||||
|
loadend: false |
||||||
|
}; |
||||||
|
}, |
||||||
|
mounted: function() { |
||||||
|
this.hostProducts(); |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
hostProducts: function() { |
||||||
|
let that = this; |
||||||
|
if (that.loading) return; //阻止下次请求(false可以进行请求); |
||||||
|
if (that.loadend) return; //阻止结束当前请求(false可以进行请求); |
||||||
|
that.loading = true; |
||||||
|
getHostProducts(that.page, that.limit).then(res => { |
||||||
|
that.loading = false; |
||||||
|
//apply();js将一个数组插入另一个数组; |
||||||
|
that.hostProduct.push.apply(that.hostProduct, res.data); |
||||||
|
that.loadend = res.data.length < that.limit; //判断所有数据是否加载完成; |
||||||
|
that.page = that.page + 1; |
||||||
|
}); |
||||||
|
} |
||||||
|
}, |
||||||
|
onReachBottom() { |
||||||
|
!this.loading && this.hostProducts(); |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
@ -0,0 +1,40 @@ |
|||||||
|
<template> |
||||||
|
<div v-if="shareInfoStatus" class="poster-first"> |
||||||
|
<div class="mask-share"> |
||||||
|
<img :src="$VUE_APP_RESOURCES_URL+'/images/share-info.png'" @click="shareInfoClose" /> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<style scoped> |
||||||
|
.poster-first { |
||||||
|
overscroll-behavior: contain; |
||||||
|
} |
||||||
|
.mask-share { |
||||||
|
position: fixed; |
||||||
|
top: 0; |
||||||
|
left: 0; |
||||||
|
right: 0; |
||||||
|
bottom: 0; |
||||||
|
z-index: 999; |
||||||
|
} |
||||||
|
.mask-share img { |
||||||
|
width: 100%; |
||||||
|
} |
||||||
|
</style> |
||||||
|
<script> |
||||||
|
export default { |
||||||
|
name: "ShareInfo", |
||||||
|
props: { |
||||||
|
shareInfoStatus: Boolean |
||||||
|
}, |
||||||
|
data: function() { |
||||||
|
return {}; |
||||||
|
}, |
||||||
|
mounted: function() {}, |
||||||
|
methods: { |
||||||
|
shareInfoClose: function() { |
||||||
|
this.$emit("setShareInfoStatus"); |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
@ -0,0 +1,43 @@ |
|||||||
|
<template> |
||||||
|
<div class="sharing-packets" :class="state === true ? 'on' : ''"> |
||||||
|
<div |
||||||
|
class="iconfont icon-guanbi acea-row row-center-wrapper" |
||||||
|
@click="closeShare" |
||||||
|
></div> |
||||||
|
<div class="line"></div> |
||||||
|
<div class="sharing-con" @click="goShare"> |
||||||
|
<img :src="$VUE_APP_RESOURCES_URL+'/images/red-packets.png'" class="image" /> |
||||||
|
<div class="text font-color-red"> |
||||||
|
<div>会员分享返</div> |
||||||
|
<div class="money"><span class="label">¥</span>{{ priceName }}</div> |
||||||
|
<div class="tip">下单即返佣金</div> |
||||||
|
<div class="shareBut">立即分享</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
export default { |
||||||
|
name: "ShareRedPackets", |
||||||
|
props: { |
||||||
|
priceName: { |
||||||
|
type: [String, Number], |
||||||
|
default: "" |
||||||
|
} |
||||||
|
}, |
||||||
|
data: function() { |
||||||
|
return { |
||||||
|
state: false |
||||||
|
}; |
||||||
|
}, |
||||||
|
mounted: function() {}, |
||||||
|
methods: { |
||||||
|
goShare: function() { |
||||||
|
this.$emit("changeFun", { action: "shareCode", value: false }); |
||||||
|
}, |
||||||
|
closeShare: function() { |
||||||
|
this.state = true; |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
@ -0,0 +1,171 @@ |
|||||||
|
<template> |
||||||
|
<div v-if="posterImageStatus" class="poster-first"> |
||||||
|
<canvas style="width:747px;height:1326px" canvas-id="myCanvas"></canvas> |
||||||
|
<!-- <div class="poster-pop" v-show="!canvasStatus"> |
||||||
|
<img |
||||||
|
:src="$VUE_APP_RESOURCES_URL+'/images/poster-close.png'" |
||||||
|
class="close" |
||||||
|
@click="posterImageClose" |
||||||
|
/> |
||||||
|
<div class="canvas" ref="poster"> |
||||||
|
<img class="image" :src="posterData.image" alt="商品图片" /> |
||||||
|
<div class="text black"> |
||||||
|
<span v-text="posterData.title"></span> |
||||||
|
</div> |
||||||
|
<div class="text rad"> |
||||||
|
<span v-text="'¥' + posterData.price"></span> |
||||||
|
</div> |
||||||
|
<div class="code"> |
||||||
|
<div class="code-img"> |
||||||
|
<img :src="posterData.code" show-menu-by-longpress mode="widthFix" alt="二维码" /> |
||||||
|
</div> |
||||||
|
<div class="code-text"> |
||||||
|
<span>长按识别二维码 立即购买</span> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="save-poster" @click="savePosterPath">生成图片</div> |
||||||
|
</div> --> |
||||||
|
<div class="poster-pop" v-show="canvasStatus"> |
||||||
|
<img |
||||||
|
:src="$VUE_APP_RESOURCES_URL+'/images/poster-close.png'" |
||||||
|
class="close" |
||||||
|
@click="posterImageClose" |
||||||
|
mode="widthFix" |
||||||
|
/> |
||||||
|
<img :src="posterImage" alt="tp" class="poster-image" show-menu-by-longpress mode="widthFix" /> |
||||||
|
<div class="keep">长按图片可以保存到手机</div> |
||||||
|
</div> |
||||||
|
<div class="mask"></div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<style scoped> |
||||||
|
.poster-first { |
||||||
|
overscroll-behavior: contain; |
||||||
|
} |
||||||
|
.poster-pop { |
||||||
|
width: 4.5rem; |
||||||
|
height: 8rem; |
||||||
|
position: fixed; |
||||||
|
left: 50%; |
||||||
|
transform: translateX(-50%); |
||||||
|
z-index: 99; |
||||||
|
top: 50%; |
||||||
|
margin-top: -4.6rem; |
||||||
|
} |
||||||
|
.poster-pop .canvas { |
||||||
|
background-color: #ffffff; |
||||||
|
height: 8rem; |
||||||
|
} |
||||||
|
.poster-pop .poster-image { |
||||||
|
width: 100%; |
||||||
|
height: auto; |
||||||
|
} |
||||||
|
.poster-pop .canvas .image { |
||||||
|
width: 4.5rem; |
||||||
|
height: 4.5rem; |
||||||
|
display: block; |
||||||
|
} |
||||||
|
.poster-pop .canvas .text { |
||||||
|
text-align: center; |
||||||
|
color: #000000; |
||||||
|
margin-top: 0.32rem; |
||||||
|
} |
||||||
|
.poster-pop .canvas .text.black { |
||||||
|
height: 0.68rem; |
||||||
|
} |
||||||
|
.poster-pop .canvas .text.rad { |
||||||
|
color: #ff0000; |
||||||
|
} |
||||||
|
.poster-pop .canvas .code { |
||||||
|
height: 1.4rem; |
||||||
|
display: flex; |
||||||
|
} |
||||||
|
.poster-pop .canvas .code .code-img { |
||||||
|
width: 33%; |
||||||
|
padding: 0.06rem; |
||||||
|
} |
||||||
|
.poster-pop .canvas .code .code-img img { |
||||||
|
width: 100%; |
||||||
|
} |
||||||
|
.poster-pop .canvas .code .code-text { |
||||||
|
width: 60%; |
||||||
|
font-size: 0.12rem; |
||||||
|
line-height: 1.64rem; |
||||||
|
} |
||||||
|
.poster-pop .close { |
||||||
|
width: 0.46rem; |
||||||
|
height: 0.75rem; |
||||||
|
position: fixed; |
||||||
|
right: 0; |
||||||
|
top: -0.73rem; |
||||||
|
display: block; |
||||||
|
} |
||||||
|
.poster-pop .save-poster { |
||||||
|
background-color: #df2d0a; |
||||||
|
font-size: 0.22rem; |
||||||
|
color: #fff; |
||||||
|
text-align: center; |
||||||
|
height: 0.76rem; |
||||||
|
line-height: 0.76rem; |
||||||
|
width: 100%; |
||||||
|
margin-top: -0.04rem; |
||||||
|
} |
||||||
|
.poster-pop .keep { |
||||||
|
color: #fff; |
||||||
|
text-align: center; |
||||||
|
font-size: 0.25rem; |
||||||
|
margin-top: 0.1rem; |
||||||
|
} |
||||||
|
.mask { |
||||||
|
position: fixed; |
||||||
|
top: 0; |
||||||
|
left: 0; |
||||||
|
right: 0; |
||||||
|
bottom: 0; |
||||||
|
background-color: rgba(0, 0, 0, 0.6); |
||||||
|
z-index: 9; |
||||||
|
} |
||||||
|
</style> |
||||||
|
<script> |
||||||
|
// import html2canvas from "html2canvas"; |
||||||
|
import { PosterCanvas } from "@/utils"; |
||||||
|
|
||||||
|
export default { |
||||||
|
name: "StorePoster", |
||||||
|
props: { |
||||||
|
posterImageStatus: Boolean, |
||||||
|
posterData: Object |
||||||
|
}, |
||||||
|
data: function() { |
||||||
|
return { |
||||||
|
canvasStatus: false, |
||||||
|
posterImage: "" |
||||||
|
}; |
||||||
|
}, |
||||||
|
watch: { |
||||||
|
posterImageStatus: function() { |
||||||
|
var that = this; |
||||||
|
if (that.posterImageStatus === true) { |
||||||
|
that.$nextTick(function() { |
||||||
|
that.savePosterPath(); |
||||||
|
}); |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
mounted: function() {}, |
||||||
|
methods: { |
||||||
|
posterImageClose: function() { |
||||||
|
this.posterImageStatus = false; |
||||||
|
this.canvasStatus = false; |
||||||
|
this.$emit("setPosterImageStatus"); |
||||||
|
}, |
||||||
|
savePosterPath: function() { |
||||||
|
PosterCanvas(this.posterData, posterImage => { |
||||||
|
this.canvasStatus = true; |
||||||
|
this.posterImage = posterImage; |
||||||
|
}); |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
@ -0,0 +1,146 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
<div class="switchWindow" :class="switchActive === true ? 'on' : ''"> |
||||||
|
<!-- @/assets/images/public.png --> |
||||||
|
<div class="pictrue"> |
||||||
|
<img v-if="login_type === 'h5'" :src="$VUE_APP_RESOURCES_URL+'/images/h5.png'" /> |
||||||
|
<img :src="$VUE_APP_RESOURCES_URL+'/images/h5.png'" alt="" v-else /> |
||||||
|
</div> |
||||||
|
<!-- 是否选择切换到小程序账户? --> |
||||||
|
<div class="info"> |
||||||
|
是否选择切换到<span class="font-color" v-if="login_type === 'h5'" |
||||||
|
>微信账号</span |
||||||
|
> |
||||||
|
<span class="font-color" v-else>手机用户</span>? |
||||||
|
</div> |
||||||
|
<div class="switchBnt" @click="switchH5">切换</div> |
||||||
|
<div class="switchBnt cancelBnt" @click="switchClose">取消</div> |
||||||
|
</div> |
||||||
|
<div |
||||||
|
class="mask" |
||||||
|
@touchmove.prevent |
||||||
|
v-show="switchActive === true" |
||||||
|
@click="switchClose" |
||||||
|
></div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<style> |
||||||
|
.switchWindow { |
||||||
|
width: 5.6rem; |
||||||
|
border-radius: 0.2rem; |
||||||
|
-webkit-border-radius: 0.2rem; |
||||||
|
background-color: #fff; |
||||||
|
position: fixed; |
||||||
|
top: 50%; |
||||||
|
left: 50%; |
||||||
|
margin-left: -2.8rem; |
||||||
|
margin-top: -3rem; |
||||||
|
z-index: 99; |
||||||
|
padding: 0.5rem 0.3rem 0.4rem 0.3rem; |
||||||
|
text-align: center; |
||||||
|
box-sizing: border-box; |
||||||
|
-webkit-box-sizing: border-box; |
||||||
|
transition: all 0.3s ease-in-out 0s; |
||||||
|
-webkit-transition: all 0.3s ease-in-out 0s; |
||||||
|
-moz-transition: all 0.3s ease-in-out 0s; |
||||||
|
-o-transition: all 0.3s ease-in-out 0s; |
||||||
|
opacity: 0; |
||||||
|
transform: scale(0); |
||||||
|
} |
||||||
|
.switchWindow.on { |
||||||
|
opacity: 1; |
||||||
|
transform: scale(1); |
||||||
|
-webkit-transform: scale(1); |
||||||
|
-ms-transform: scale(1); |
||||||
|
-moz-transform: scale(1); |
||||||
|
-o-transform: scale(1); |
||||||
|
} |
||||||
|
.switchWindow .pictrue { |
||||||
|
width: 2.36rem; |
||||||
|
height: 2.36rem; |
||||||
|
margin: 0 auto; |
||||||
|
} |
||||||
|
.switchWindow .pictrue img { |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
display: block; |
||||||
|
} |
||||||
|
.switchWindow .info { |
||||||
|
font-size: 0.32rem; |
||||||
|
color: #282828; |
||||||
|
margin-top: 0.44rem; |
||||||
|
font-weight: bold; |
||||||
|
} |
||||||
|
.switchWindow .switchBnt { |
||||||
|
font-size: 0.32rem; |
||||||
|
color: #fff; |
||||||
|
width: 3.6rem; |
||||||
|
height: 0.82rem; |
||||||
|
border-radius: 0.41rem; |
||||||
|
-webkit-border-radius: 0.41rem; |
||||||
|
margin: 0.57rem auto 0 auto; |
||||||
|
line-height: 0.82rem; |
||||||
|
background-image: linear-gradient(to right, #f67a38 0%, #f11b09 100%); |
||||||
|
background-image: -webkit-linear-gradient(to right, #f67a38 0%, #f11b09 100%); |
||||||
|
background-image: -moz-linear-gradient(to right, #f67a38 0%, #f11b09 100%); |
||||||
|
} |
||||||
|
.switchWindow .switchBnt.cancelBnt { |
||||||
|
background-color: #fff; |
||||||
|
color: #999; |
||||||
|
background-image: none; |
||||||
|
margin-top: 0.1rem; |
||||||
|
} |
||||||
|
</style> |
||||||
|
<script> |
||||||
|
import { switchH5Login } from "@/api/user"; |
||||||
|
import cookie from "@/utils/store/cookie"; |
||||||
|
import store from "@//store"; |
||||||
|
import dayjs from "dayjs"; |
||||||
|
|
||||||
|
export default { |
||||||
|
name: "SwitchWindow", |
||||||
|
props: { |
||||||
|
switchActive: { |
||||||
|
type: Boolean, |
||||||
|
default: false |
||||||
|
}, |
||||||
|
login_type: { |
||||||
|
type: String, |
||||||
|
default: "" |
||||||
|
} |
||||||
|
}, |
||||||
|
data: function() { |
||||||
|
return {}; |
||||||
|
}, |
||||||
|
mounted: function() {}, |
||||||
|
methods: { |
||||||
|
switchClose: function() { |
||||||
|
this.$emit("changeswitch", false); //$emit():注册事件; |
||||||
|
}, |
||||||
|
switchH5() { |
||||||
|
let that = this; |
||||||
|
wx.showLoading({title: '正在切换中'}) |
||||||
|
if (that.login_type === "h5") { |
||||||
|
cookie.set("loginType", "wechat", 60); |
||||||
|
wx.hideLoading() |
||||||
|
this.$store.commit("LOGOUT"); |
||||||
|
this.$emit("changeswitch", false); |
||||||
|
location.reload(); |
||||||
|
} else { |
||||||
|
switchH5Login() |
||||||
|
.then(({ data }) => { |
||||||
|
wx.hideLoading() |
||||||
|
const expires_time = dayjs(data.expires_time); |
||||||
|
store.commit("LOGIN", data.token, expires_time); |
||||||
|
this.$emit("changeswitch", false); |
||||||
|
location.reload(); |
||||||
|
}) |
||||||
|
.catch(err => { |
||||||
|
wx.hideLoading() |
||||||
|
return that.$dialog.toast({ mes: err }); |
||||||
|
}); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
@ -0,0 +1,43 @@ |
|||||||
|
<template> |
||||||
|
<div class="evaluateWtapper"> |
||||||
|
<div class="evaluateItem" v-for="(item, evaluateWtapperIndex) in reply" :key="evaluateWtapperIndex"> |
||||||
|
<div class="pic-text acea-row row-middle"> |
||||||
|
<div class="pictrue"> |
||||||
|
<img :src="item.avatar" class="image" /> |
||||||
|
</div> |
||||||
|
<div class="acea-row row-middle"> |
||||||
|
<div class="name line1">{{ item.nickname }}</div> |
||||||
|
<div class="start" :class="'star' + item.star"></div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="time">{{ item.add_time }} {{ item.suk }}</div> |
||||||
|
<div class="evaluate-infor">{{ item.comment }}</div> |
||||||
|
<div class="imgList acea-row"> |
||||||
|
<div class="pictrue" v-for="(itemn, eq) in item.picturesArr" :key="eq"> |
||||||
|
<img :src="itemn" class="image" /> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<!--<div class="reply" v-if="item.merchant_reply_content">--> |
||||||
|
<!--<span class="font-color-red">店小二</span>:{{--> |
||||||
|
<!--item.merchant_reply_content--> |
||||||
|
<!--}}--> |
||||||
|
<!--</div>--> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
export default { |
||||||
|
name: "UserEvaluation", |
||||||
|
props: { |
||||||
|
reply: { |
||||||
|
type: Array, |
||||||
|
default: () => [] |
||||||
|
} |
||||||
|
}, |
||||||
|
data: function() { |
||||||
|
return {}; |
||||||
|
}, |
||||||
|
mounted: function() {}, |
||||||
|
methods: {} |
||||||
|
}; |
||||||
|
</script> |
@ -0,0 +1,128 @@ |
|||||||
|
<template> |
||||||
|
<div v-show="iShidden === false"> |
||||||
|
<div class="WriteOff"> |
||||||
|
<div class="pictrue"><img :src="orderInfo.image" /></div> |
||||||
|
<div class="num acea-row row-center-wrapper"> |
||||||
|
{{ orderInfo.order_id }} |
||||||
|
</div> |
||||||
|
<div class="tip">确定要核销此订单吗?</div> |
||||||
|
<div class="sure" @click="confirm">确定核销</div> |
||||||
|
<div class="sure cancel" @click="cancel">取消</div> |
||||||
|
</div> |
||||||
|
<div class="mask" @touchmove.prevent></div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<style scoped> |
||||||
|
.WriteOff { |
||||||
|
width: 5.6rem; |
||||||
|
height: 8rem; |
||||||
|
background-color: #fff; |
||||||
|
border-radius: 0.2rem; |
||||||
|
position: fixed; |
||||||
|
top: 50%; |
||||||
|
left: 50%; |
||||||
|
margin-top: -4rem; |
||||||
|
margin-left: -2.8rem; |
||||||
|
z-index: 99; |
||||||
|
padding-top: 0.55rem; |
||||||
|
} |
||||||
|
.WriteOff .pictrue { |
||||||
|
width: 3.4rem; |
||||||
|
height: 3.4rem; |
||||||
|
margin: 0 auto; |
||||||
|
} |
||||||
|
.WriteOff .pictrue img { |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
display: block; |
||||||
|
border-radius: 0.1rem; |
||||||
|
} |
||||||
|
.WriteOff .num { |
||||||
|
font-size: 0.3rem; |
||||||
|
color: #666; |
||||||
|
margin: 0.28rem 0 0.3rem 0; |
||||||
|
} |
||||||
|
.WriteOff .num .see { |
||||||
|
font-size: 0.16rem; |
||||||
|
color: #fff; |
||||||
|
border-radius: 0.04rem; |
||||||
|
background-color: #c68937; |
||||||
|
padding-left: 0.05rem; |
||||||
|
margin-left: 0.12rem; |
||||||
|
} |
||||||
|
.WriteOff .num .see .iconfont { |
||||||
|
font-size: 0.15rem; |
||||||
|
} |
||||||
|
.WriteOff .tip { |
||||||
|
font-size: 0.36rem; |
||||||
|
color: #282828; |
||||||
|
text-align: center; |
||||||
|
border-top: 1px dashed #ccc; |
||||||
|
padding-top: 0.4rem; |
||||||
|
position: relative; |
||||||
|
} |
||||||
|
.WriteOff .tip:after { |
||||||
|
content: ""; |
||||||
|
position: absolute; |
||||||
|
width: 0.25rem; |
||||||
|
height: 0.25rem; |
||||||
|
border-radius: 50%; |
||||||
|
background-color: #7f7f7f; |
||||||
|
right: -0.125rem; |
||||||
|
top: -0.125rem; |
||||||
|
} |
||||||
|
.WriteOff .tip:before { |
||||||
|
content: ""; |
||||||
|
position: absolute; |
||||||
|
width: 0.25rem; |
||||||
|
height: 0.25rem; |
||||||
|
border-radius: 50%; |
||||||
|
background-color: #7f7f7f; |
||||||
|
left: -0.125rem; |
||||||
|
top: -0.125rem; |
||||||
|
} |
||||||
|
.WriteOff .sure { |
||||||
|
font-size: 0.32rem; |
||||||
|
color: #fff; |
||||||
|
text-align: center; |
||||||
|
line-height: 0.82rem; |
||||||
|
height: 0.82rem; |
||||||
|
width: 4.6rem; |
||||||
|
border-radius: 0.41rem; |
||||||
|
margin: 0.4rem auto 0 auto; |
||||||
|
background-image: linear-gradient(to right, #f67a38 0%, #f11b09 100%); |
||||||
|
background-image: -webkit-linear-gradient(to right, #f67a38 0%, #f11b09 100%); |
||||||
|
background-image: -moz-linear-gradient(to right, #f67a38 0%, #f11b09 100%); |
||||||
|
} |
||||||
|
.WriteOff .sure.cancel { |
||||||
|
background-image: none; |
||||||
|
color: #999; |
||||||
|
margin-top: 0.1rem; |
||||||
|
} |
||||||
|
</style> |
||||||
|
<script> |
||||||
|
export default { |
||||||
|
name: "WriteOff", |
||||||
|
props: { |
||||||
|
iShidden: { |
||||||
|
type: Boolean, |
||||||
|
default: true |
||||||
|
}, |
||||||
|
orderInfo: { |
||||||
|
type: Object |
||||||
|
} |
||||||
|
}, |
||||||
|
data: function() { |
||||||
|
return {}; |
||||||
|
}, |
||||||
|
mounted: function() {}, |
||||||
|
methods: { |
||||||
|
cancel: function() { |
||||||
|
this.$emit("cancel", true); |
||||||
|
}, |
||||||
|
confirm: function() { |
||||||
|
this.$emit("confirm", true); |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
@ -0,0 +1,3 @@ |
|||||||
|
|
||||||
|
export const VUE_APP_API_URL = 'https://h5api.dayouqiantu.cn/api'; |
||||||
|
export const VUE_APP_RESOURCES_URL = 'https://h5.dayouqiantu.cn/static'; |
@ -0,0 +1,51 @@ |
|||||||
|
import $store from "@//store"; |
||||||
|
import { VUE_APP_WS_URL } from "@/utils"; |
||||||
|
|
||||||
|
const Socket = function() { |
||||||
|
this.ws = new WebSocket(VUE_APP_WS_URL); |
||||||
|
this.ws.onopen = this.onOpen.bind(this); |
||||||
|
this.ws.onerror = this.onError.bind(this); |
||||||
|
this.ws.onmessage = this.onMessage.bind(this); |
||||||
|
this.ws.onclose = this.onClose.bind(this); |
||||||
|
}; |
||||||
|
|
||||||
|
Socket.prototype = { |
||||||
|
vm(vm) { |
||||||
|
this.vm = vm; |
||||||
|
}, |
||||||
|
close() { |
||||||
|
clearInterval(this.timer); |
||||||
|
this.ws.close(); |
||||||
|
}, |
||||||
|
onOpen: function() { |
||||||
|
this.init(); |
||||||
|
this.send({ |
||||||
|
type: "login", |
||||||
|
data: $store.state.token |
||||||
|
}); |
||||||
|
this.vm.$emit("socket_open"); |
||||||
|
}, |
||||||
|
init: function() { |
||||||
|
var that = this; |
||||||
|
this.timer = setInterval(function() { |
||||||
|
that.send({ type: "ping" }); |
||||||
|
}, 10000); |
||||||
|
}, |
||||||
|
send: function(data) { |
||||||
|
return this.ws.send(JSON.stringify(data)); |
||||||
|
}, |
||||||
|
onMessage: function(res) { |
||||||
|
const { type, data = {} } = JSON.parse(res.data); |
||||||
|
this.vm.$emit(type, data); |
||||||
|
}, |
||||||
|
onClose: function() { |
||||||
|
clearInterval(this.timer); |
||||||
|
}, |
||||||
|
onError: function(e) { |
||||||
|
this.vm.$emit("socket_error", e); |
||||||
|
} |
||||||
|
}; |
||||||
|
|
||||||
|
Socket.prototype.constructor = Socket; |
||||||
|
|
||||||
|
export default Socket; |
@ -0,0 +1,32 @@ |
|||||||
|
// import router from "../router";
|
||||||
|
import store from "../store"; |
||||||
|
import cookie from "@/utils/store/cookie"; |
||||||
|
import { isWeixin, login, getCurrentPageUrl, getCurrentPageUrlWithArgs, parseQuery, replace, handleQrCode } from "@/utils"; |
||||||
|
|
||||||
|
export default function toLogin(push, backUrl) { |
||||||
|
store.commit("LOGOUT"); |
||||||
|
if (store.getters.isAuthorization) { |
||||||
|
login() |
||||||
|
return |
||||||
|
} |
||||||
|
if (store.getters.isAuthorizationPage || getCurrentPageUrl() == '/pages/user/Login/index') { |
||||||
|
return |
||||||
|
} |
||||||
|
|
||||||
|
// 判断是不是扫描的砍价海报进来的
|
||||||
|
if (getCurrentPageUrl() == 'pages/activity/DargainDetails/index' && handleQrCode()) { |
||||||
|
let url = handleQrCode(); |
||||||
|
if (url) { |
||||||
|
console.log(222222222) |
||||||
|
replace({ path: '/pages/user/Login/index', query: { redirect: `/${getCurrentPageUrl()}`, id: url.bargainId, partake: url.uid } }) |
||||||
|
} else { |
||||||
|
replace({ path: '/pages/user/Login/index', query: { redirect: `/${getCurrentPageUrl()}`, ...parseQuery() } }) |
||||||
|
} |
||||||
|
} else { |
||||||
|
console.log(222222222) |
||||||
|
replace({ path: '/pages/user/Login/index', query: { redirect: `/${getCurrentPageUrl()}`, ...parseQuery() } }) |
||||||
|
} |
||||||
|
store.commit("UPDATE_AUTHORIZATION", false); |
||||||
|
store.commit("UPDATE_AUTHORIZATIONPAGE", true); |
||||||
|
} |
||||||
|
|
@ -0,0 +1,107 @@ |
|||||||
|
import { cancelOrder, takeOrder, delOrder, payOrder } from "@/api/order"; |
||||||
|
import dialog from "@/utils/dialog"; |
||||||
|
import { weappPay } from "@/libs/wechat"; |
||||||
|
|
||||||
|
export function cancelOrderHandle(orderId) { |
||||||
|
return new Promise((resolve, reject) => { |
||||||
|
wx.showModal({ |
||||||
|
title: '提示', |
||||||
|
content: '确认取消该订单?', |
||||||
|
success(res) { |
||||||
|
if (res.confirm) { |
||||||
|
cancelOrder(orderId) |
||||||
|
.then(res => { |
||||||
|
wx.showToast({ |
||||||
|
title: '取消成功', icon: 'success', duration: 2000 |
||||||
|
}); |
||||||
|
resolve(res); |
||||||
|
}) |
||||||
|
.catch(err => { |
||||||
|
wx.showToast({ |
||||||
|
title: '取消失败', icon: 'none', duration: 2000 |
||||||
|
}); |
||||||
|
reject(err); |
||||||
|
}); |
||||||
|
} else if (res.cancel) { |
||||||
|
} |
||||||
|
} |
||||||
|
}) |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
export function takeOrderHandle(orderId) { |
||||||
|
return new Promise((resolve, reject) => { |
||||||
|
takeOrder(orderId) |
||||||
|
.then(res => { |
||||||
|
wx.showToast({ |
||||||
|
title: '收货成功', icon: 'success', duration: 2000 |
||||||
|
}); |
||||||
|
resolve(res); |
||||||
|
}) |
||||||
|
.catch(err => { |
||||||
|
wx.showToast({ |
||||||
|
title: '收货失败', icon: 'none', duration: 2000 |
||||||
|
}); |
||||||
|
reject(err); |
||||||
|
}); |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
export function delOrderHandle(orderId) { |
||||||
|
return new Promise((resolve, reject) => { |
||||||
|
dialog.confirm({ |
||||||
|
mes: "确认删除该订单?", |
||||||
|
opts() { |
||||||
|
delOrder(orderId) |
||||||
|
.then(res => { |
||||||
|
wx.showToast({ |
||||||
|
title: '删除成功', icon: 'success', duration: 2000 |
||||||
|
}); |
||||||
|
resolve(res); |
||||||
|
}) |
||||||
|
.catch(err => { |
||||||
|
wx.showToast({ |
||||||
|
title: '删除失败', icon: 'none', duration: 2000 |
||||||
|
}); |
||||||
|
reject(err); |
||||||
|
}); |
||||||
|
} |
||||||
|
}); |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
export function payOrderHandle(orderId, type, from) { |
||||||
|
return new Promise((resolve, reject) => { |
||||||
|
wx.showLoading({ title: '加载中' }) |
||||||
|
payOrder(orderId, type, from) |
||||||
|
.then(res => { |
||||||
|
const data = res.data; |
||||||
|
wx.hideLoading() |
||||||
|
switch (data.status) { |
||||||
|
case "WECHAT_H5_PAY": |
||||||
|
location.replace(data.result.jsConfig.mweb_url); |
||||||
|
reject(data); |
||||||
|
break; |
||||||
|
case "ORDER_EXIST": |
||||||
|
case "EXTEND_ORDER": |
||||||
|
case "PAY_ERROR": |
||||||
|
case "PAY_DEFICIENCY": |
||||||
|
dialog.toast({ mes: res.msg }); |
||||||
|
reject(data); |
||||||
|
break; |
||||||
|
case "SUCCESS": |
||||||
|
wx.showToast({ title: res.msg, icon: 'none', duration: 2000 }); |
||||||
|
resolve(data); |
||||||
|
break; |
||||||
|
case "WECHAT_PAY": |
||||||
|
weappPay(data.result.jsConfig).then(res => { |
||||||
|
resolve(data); |
||||||
|
}); |
||||||
|
} |
||||||
|
}) |
||||||
|
.catch(err => { |
||||||
|
wx.hideLoading() |
||||||
|
dialog.toast({ mes: "订单支付失败" }); |
||||||
|
}); |
||||||
|
}); |
||||||
|
} |
@ -0,0 +1,20 @@ |
|||||||
|
// 支付模块
|
||||||
|
export const weappPay = (option) => { |
||||||
|
return new Promise((resolve, reject) => { |
||||||
|
// 吊起微信支付
|
||||||
|
wx.requestPayment({ |
||||||
|
...option, |
||||||
|
timeStamp: option.timeStamp + '', |
||||||
|
success: (success) => { |
||||||
|
wx.showToast({ |
||||||
|
title: '支付成功', icon: 'success', duration: 2000 |
||||||
|
}); |
||||||
|
resolve(success) |
||||||
|
}, |
||||||
|
fail: (error) => { |
||||||
|
wx.showToast({ title: '支付失败', icon: 'none', duration: 2000 }); |
||||||
|
reject(error) |
||||||
|
} |
||||||
|
}) |
||||||
|
}) |
||||||
|
} |
@ -0,0 +1,92 @@ |
|||||||
|
import Vue from 'vue' |
||||||
|
import App from './App' |
||||||
|
|
||||||
|
// import router from "./router";
|
||||||
|
import store from "./store"; |
||||||
|
import animate from "animate.css"; |
||||||
|
import schema from "async-validator"; |
||||||
|
import dialog from "./utils/dialog"; |
||||||
|
import cookie from "@/utils/store/cookie"; |
||||||
|
|
||||||
|
// import "@/assets/iconfont/iconfont";
|
||||||
|
import "@/assets/iconfont/iconfont.css"; |
||||||
|
// import "@/assets/js/media_750";
|
||||||
|
// import "vue-ydui/dist/ydui.base.css";
|
||||||
|
import "@/assets/css/base.css"; |
||||||
|
import "@/assets/css/reset.css"; |
||||||
|
import "@/assets/css/style.css"; |
||||||
|
|
||||||
|
import { |
||||||
|
parseRoute, |
||||||
|
_router |
||||||
|
} from "@/utils"; |
||||||
|
import { |
||||||
|
VUE_APP_RESOURCES_URL, |
||||||
|
VUE_APP_API_URL |
||||||
|
} from "@/config"; |
||||||
|
|
||||||
|
Vue.use(animate); |
||||||
|
Vue.config.productionTip = false; |
||||||
|
Vue.config.devtools = process.env.NODE_ENV !== "production"; |
||||||
|
|
||||||
|
Vue.prototype.$validator = function(rule) { |
||||||
|
return new schema(rule); |
||||||
|
}; |
||||||
|
|
||||||
|
Vue.prototype.$dialog = dialog; |
||||||
|
|
||||||
|
const CACHE_KEY = "clear_0.0.1"; |
||||||
|
|
||||||
|
if (!cookie.has(CACHE_KEY)) { |
||||||
|
cookie.clearAll(); |
||||||
|
cookie.set(CACHE_KEY, 1); |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
Vue.config.productionTip = false |
||||||
|
App.mpType = 'app' |
||||||
|
Vue.prototype.$store = store |
||||||
|
|
||||||
|
const app = new Vue(App) |
||||||
|
|
||||||
|
Vue.mixin({ |
||||||
|
onLoad() { |
||||||
|
const { |
||||||
|
$mp |
||||||
|
} = this.$root |
||||||
|
this._route = parseRoute($mp) |
||||||
|
// this.$VUE_APP_RESOURCES_URL = VUE_APP_RESOURCES_URL;
|
||||||
|
this._data.$VUE_APP_RESOURCES_URL = VUE_APP_RESOURCES_URL; |
||||||
|
}, |
||||||
|
onShow() { |
||||||
|
_router.app = this |
||||||
|
_router.currentRoute = this._route |
||||||
|
} |
||||||
|
}) |
||||||
|
|
||||||
|
Object.defineProperty(Vue.prototype, '$yrouter', { |
||||||
|
get() { |
||||||
|
return _router |
||||||
|
} |
||||||
|
}) |
||||||
|
|
||||||
|
Object.defineProperty(Vue.prototype, '$yroute', { |
||||||
|
get() { |
||||||
|
return this._route |
||||||
|
} |
||||||
|
}) |
||||||
|
|
||||||
|
Object.defineProperty(Vue.prototype, '$VUE_APP_RESOURCES_URL', { |
||||||
|
get() { |
||||||
|
return VUE_APP_RESOURCES_URL |
||||||
|
} |
||||||
|
}) |
||||||
|
|
||||||
|
Object.defineProperty(Vue.prototype, '$VUE_APP_API_URL', { |
||||||
|
get() { |
||||||
|
return VUE_APP_API_URL |
||||||
|
} |
||||||
|
}) |
||||||
|
|
||||||
|
|
||||||
|
app.$mount() |
@ -0,0 +1,75 @@ |
|||||||
|
{ |
||||||
|
"name" : "yshopmall_uni", |
||||||
|
"appid" : "", |
||||||
|
"description" : "", |
||||||
|
"versionName" : "1.0.0", |
||||||
|
"versionCode" : "100", |
||||||
|
"transformPx" : false, |
||||||
|
/* 5+App特有相关 */ |
||||||
|
"app-plus" : { |
||||||
|
"usingComponents" : true, |
||||||
|
"nvueCompiler" : "uni-app", |
||||||
|
"compilerVersion" : 3, |
||||||
|
"splashscreen" : { |
||||||
|
"alwaysShowBeforeRender" : true, |
||||||
|
"waiting" : true, |
||||||
|
"autoclose" : true, |
||||||
|
"delay" : 0 |
||||||
|
}, |
||||||
|
/* 模块配置 */ |
||||||
|
"modules" : {}, |
||||||
|
/* 应用发布信息 */ |
||||||
|
"distribute" : { |
||||||
|
/* android打包配置 */ |
||||||
|
"android" : { |
||||||
|
"permissions" : [ |
||||||
|
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.READ_CONTACTS\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.VIBRATE\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>", |
||||||
|
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.WRITE_CONTACTS\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.CAMERA\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.RECORD_AUDIO\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.MODIFY_AUDIO_SETTINGS\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.CALL_PHONE\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.ACCESS_COARSE_LOCATION\"/>", |
||||||
|
"<uses-feature android:name=\"android.hardware.camera\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.ACCESS_FINE_LOCATION\"/>", |
||||||
|
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>" |
||||||
|
] |
||||||
|
}, |
||||||
|
/* ios打包配置 */ |
||||||
|
"ios" : {}, |
||||||
|
/* SDK配置 */ |
||||||
|
"sdkConfigs" : {} |
||||||
|
} |
||||||
|
}, |
||||||
|
/* 快应用特有相关 */ |
||||||
|
"quickapp" : {}, |
||||||
|
/* 小程序特有相关 */ |
||||||
|
"mp-weixin" : { |
||||||
|
"appid" : "", |
||||||
|
"setting" : { |
||||||
|
"urlCheck" : false |
||||||
|
}, |
||||||
|
"usingComponents" : true |
||||||
|
}, |
||||||
|
"mp-alipay" : { |
||||||
|
"usingComponents" : true |
||||||
|
}, |
||||||
|
"mp-baidu" : { |
||||||
|
"usingComponents" : true |
||||||
|
}, |
||||||
|
"mp-toutiao" : { |
||||||
|
"usingComponents" : true |
||||||
|
} |
||||||
|
} |
@ -0,0 +1,27 @@ |
|||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
disabled: false, |
||||||
|
text: "获取验证码" |
||||||
|
}; |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
sendCode() { |
||||||
|
if (this.disabled) return; |
||||||
|
this.disabled = true; |
||||||
|
let n = 60; |
||||||
|
this.text = "剩余 " + n + "s"; |
||||||
|
const run = setInterval(() => { |
||||||
|
n = n - 1; |
||||||
|
if (n < 0) { |
||||||
|
clearInterval(run); |
||||||
|
} |
||||||
|
this.text = "剩余 " + n + "s"; |
||||||
|
if (this.text < "剩余 " + 0 + "s") { |
||||||
|
this.disabled = false; |
||||||
|
this.text = "重新获取"; |
||||||
|
} |
||||||
|
}, 1000); |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
@ -0,0 +1,12 @@ |
|||||||
|
# editorconfig.org |
||||||
|
root = true |
||||||
|
|
||||||
|
[*] |
||||||
|
charset = utf-8 |
||||||
|
end_of_line = lf |
||||||
|
indent_size = 2 |
||||||
|
indent_style = space |
||||||
|
insert_final_newline = true |
||||||
|
max_line_length = 100 |
||||||
|
tab_width = 2 |
||||||
|
trim_trailing_whitespace = true |
@ -0,0 +1 @@ |
|||||||
|
animate.min.css |
@ -0,0 +1,6 @@ |
|||||||
|
language: node_js |
||||||
|
node_js: |
||||||
|
- "10" |
||||||
|
before_script: |
||||||
|
- npm install -g gulp |
||||||
|
script: gulp |
@ -0,0 +1,76 @@ |
|||||||
|
# Contributor Covenant Code of Conduct |
||||||
|
|
||||||
|
## Our Pledge |
||||||
|
|
||||||
|
In the interest of fostering an open and welcoming environment, we as |
||||||
|
contributors and maintainers pledge to making participation in our project and |
||||||
|
our community a harassment-free experience for everyone, regardless of age, body |
||||||
|
size, disability, ethnicity, sex characteristics, gender identity and expression, |
||||||
|
level of experience, education, socio-economic status, nationality, personal |
||||||
|
appearance, race, religion, or sexual identity and orientation. |
||||||
|
|
||||||
|
## Our Standards |
||||||
|
|
||||||
|
Examples of behavior that contributes to creating a positive environment |
||||||
|
include: |
||||||
|
|
||||||
|
* Using welcoming and inclusive language |
||||||
|
* Being respectful of differing viewpoints and experiences |
||||||
|
* Gracefully accepting constructive criticism |
||||||
|
* Focusing on what is best for the community |
||||||
|
* Showing empathy towards other community members |
||||||
|
|
||||||
|
Examples of unacceptable behavior by participants include: |
||||||
|
|
||||||
|
* The use of sexualized language or imagery and unwelcome sexual attention or |
||||||
|
advances |
||||||
|
* Trolling, insulting/derogatory comments, and personal or political attacks |
||||||
|
* Public or private harassment |
||||||
|
* Publishing others' private information, such as a physical or electronic |
||||||
|
address, without explicit permission |
||||||
|
* Other conduct which could reasonably be considered inappropriate in a |
||||||
|
professional setting |
||||||
|
|
||||||
|
## Our Responsibilities |
||||||
|
|
||||||
|
Project maintainers are responsible for clarifying the standards of acceptable |
||||||
|
behavior and are expected to take appropriate and fair corrective action in |
||||||
|
response to any instances of unacceptable behavior. |
||||||
|
|
||||||
|
Project maintainers have the right and responsibility to remove, edit, or |
||||||
|
reject comments, commits, code, wiki edits, issues, and other contributions |
||||||
|
that are not aligned to this Code of Conduct, or to ban temporarily or |
||||||
|
permanently any contributor for other behaviors that they deem inappropriate, |
||||||
|
threatening, offensive, or harmful. |
||||||
|
|
||||||
|
## Scope |
||||||
|
|
||||||
|
This Code of Conduct applies both within project spaces and in public spaces |
||||||
|
when an individual is representing the project or its community. Examples of |
||||||
|
representing a project or community include using an official project e-mail |
||||||
|
address, posting via an official social media account, or acting as an appointed |
||||||
|
representative at an online or offline event. Representation of a project may be |
||||||
|
further defined and clarified by project maintainers. |
||||||
|
|
||||||
|
## Enforcement |
||||||
|
|
||||||
|
Instances of abusive, harassing, or otherwise unacceptable behavior may be |
||||||
|
reported by contacting the project team at callmeelton@gmail.com. All |
||||||
|
complaints will be reviewed and investigated and will result in a response that |
||||||
|
is deemed necessary and appropriate to the circumstances. The project team is |
||||||
|
obligated to maintain confidentiality with regard to the reporter of an incident. |
||||||
|
Further details of specific enforcement policies may be posted separately. |
||||||
|
|
||||||
|
Project maintainers who do not follow or enforce the Code of Conduct in good |
||||||
|
faith may face temporary or permanent repercussions as determined by other |
||||||
|
members of the project's leadership. |
||||||
|
|
||||||
|
## Attribution |
||||||
|
|
||||||
|
This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4, |
||||||
|
available at https://www.contributor-covenant.org/version/1/4/code-of-conduct.html |
||||||
|
|
||||||
|
[homepage]: https://www.contributor-covenant.org |
||||||
|
|
||||||
|
For answers to common questions about this code of conduct, see |
||||||
|
https://www.contributor-covenant.org/faq |
@ -0,0 +1,21 @@ |
|||||||
|
The MIT License (MIT) |
||||||
|
|
||||||
|
Copyright (c) 2019 Daniel Eden |
||||||
|
|
||||||
|
Permission is hereby granted, free of charge, to any person obtaining a copy |
||||||
|
of this software and associated documentation files (the "Software"), to deal |
||||||
|
in the Software without restriction, including without limitation the rights |
||||||
|
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell |
||||||
|
copies of the Software, and to permit persons to whom the Software is |
||||||
|
furnished to do so, subject to the following conditions: |
||||||
|
|
||||||
|
The above copyright notice and this permission notice shall be included in all |
||||||
|
copies or substantial portions of the Software. |
||||||
|
|
||||||
|
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR |
||||||
|
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, |
||||||
|
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE |
||||||
|
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER |
||||||
|
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, |
||||||
|
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE |
||||||
|
SOFTWARE. |
@ -0,0 +1,211 @@ |
|||||||
|
# Animate.css [![GitHub release](https://img.shields.io/github/release/daneden/animate.css.svg)](https://github.com/daneden/animate.css/releases) [![CDNJS](https://img.shields.io/cdnjs/v/animate.css.svg)](https://cdnjs.com/libraries/animate.css) [![Build Status](https://travis-ci.com/daneden/animate.css.svg?branch=master)](https://travis-ci.com/daneden/animate.css) [![devDependencies Status](https://david-dm.org/daneden/animate.css/dev-status.svg)](https://david-dm.org/daneden/animate.css?type=dev) [![chat](https://img.shields.io/badge/chat-gitter-green.svg)](https://gitter.im/animate-css/Lobby) [![npm version](https://badge.fury.io/js/animate.css.svg)](https://www.npmjs.com/package/animate.css) |
||||||
|
|
||||||
|
_Just-add-water CSS animation_ |
||||||
|
|
||||||
|
`animate.css` is a bunch of cool, fun, and cross-browser animations for you to use in your projects. Great for emphasis, home pages, sliders, and general just-add-water-awesomeness. |
||||||
|
|
||||||
|
|
||||||
|
## Installation |
||||||
|
|
||||||
|
Install via npm: |
||||||
|
|
||||||
|
```bash |
||||||
|
$ npm install animate.css --save |
||||||
|
``` |
||||||
|
|
||||||
|
or yarn: |
||||||
|
|
||||||
|
```bash |
||||||
|
$ yarn add animate.css |
||||||
|
``` |
||||||
|
|
||||||
|
|
||||||
|
## Usage |
||||||
|
|
||||||
|
To use animate.css in your website, simply drop the stylesheet into your document's `<head>`, and add the class `animated` to an element, along with any of the animation names. That's it! You've got a CSS animated element. Super! |
||||||
|
|
||||||
|
```html |
||||||
|
<head> |
||||||
|
<link rel="stylesheet" href="animate.min.css"> |
||||||
|
</head> |
||||||
|
``` |
||||||
|
|
||||||
|
or use a CDN hosted version by [CDNJS](https://cdnjs.com/libraries/animate.css) |
||||||
|
|
||||||
|
```html |
||||||
|
<head> |
||||||
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.0/animate.min.css"> |
||||||
|
</head> |
||||||
|
``` |
||||||
|
|
||||||
|
|
||||||
|
### Animations |
||||||
|
|
||||||
|
To animate an element, add the class `animated` to an element. You can include the class `infinite` for an infinite loop. Finally you need to add one of the following classes to the element: |
||||||
|
|
||||||
|
| Class Name | | | | |
||||||
|
| ----------------- | ------------------ | ------------------- | -------------------- | |
||||||
|
| `bounce` | `flash` | `pulse` | `rubberBand` | |
||||||
|
| `shake` | `headShake` | `swing` | `tada` | |
||||||
|
| `wobble` | `jello` | `bounceIn` | `bounceInDown` | |
||||||
|
| `bounceInLeft` | `bounceInRight` | `bounceInUp` | `bounceOut` | |
||||||
|
| `bounceOutDown` | `bounceOutLeft` | `bounceOutRight` | `bounceOutUp` | |
||||||
|
| `fadeIn` | `fadeInDown` | `fadeInDownBig` | `fadeInLeft` | |
||||||
|
| `fadeInLeftBig` | `fadeInRight` | `fadeInRightBig` | `fadeInUp` | |
||||||
|
| `fadeInUpBig` | `fadeOut` | `fadeOutDown` | `fadeOutDownBig` | |
||||||
|
| `fadeOutLeft` | `fadeOutLeftBig` | `fadeOutRight` | `fadeOutRightBig` | |
||||||
|
| `fadeOutUp` | `fadeOutUpBig` | `flipInX` | `flipInY` | |
||||||
|
| `flipOutX` | `flipOutY` | `lightSpeedIn` | `lightSpeedOut` | |
||||||
|
| `rotateIn` | `rotateInDownLeft` | `rotateInDownRight` | `rotateInUpLeft` | |
||||||
|
| `rotateInUpRight` | `rotateOut` | `rotateOutDownLeft` | `rotateOutDownRight` | |
||||||
|
| `rotateOutUpLeft` | `rotateOutUpRight` | `hinge` | `jackInTheBox` | |
||||||
|
| `rollIn` | `rollOut` | `zoomIn` | `zoomInDown` | |
||||||
|
| `zoomInLeft` | `zoomInRight` | `zoomInUp` | `zoomOut` | |
||||||
|
| `zoomOutDown` | `zoomOutLeft` | `zoomOutRight` | `zoomOutUp` | |
||||||
|
| `slideInDown` | `slideInLeft` | `slideInRight` | `slideInUp` | |
||||||
|
| `slideOutDown` | `slideOutLeft` | `slideOutRight` | `slideOutUp` | |
||||||
|
| `heartBeat` | |
||||||
|
|
||||||
|
Full example: |
||||||
|
|
||||||
|
```html |
||||||
|
<h1 class="animated infinite bounce delay-2s">Example</h1> |
||||||
|
``` |
||||||
|
|
||||||
|
[Check out all the animations here!](https://daneden.github.io/animate.css/) |
||||||
|
|
||||||
|
It's possible to change the duration of your animations, add a delay or change the number of times that it plays: |
||||||
|
|
||||||
|
```css |
||||||
|
.yourElement { |
||||||
|
animation-duration: 3s; |
||||||
|
animation-delay: 2s; |
||||||
|
animation-iteration-count: infinite; |
||||||
|
} |
||||||
|
``` |
||||||
|
|
||||||
|
## Usage with Javascript |
||||||
|
|
||||||
|
You can do a whole bunch of other stuff with animate.css when you combine it with Javascript. A simple example: |
||||||
|
|
||||||
|
```javascript |
||||||
|
const element = document.querySelector('.my-element') |
||||||
|
element.classList.add('animated', 'bounceOutLeft') |
||||||
|
``` |
||||||
|
|
||||||
|
You can also detect when an animation ends: |
||||||
|
|
||||||
|
```javascript |
||||||
|
const element = document.querySelector('.my-element') |
||||||
|
element.classList.add('animated', 'bounceOutLeft') |
||||||
|
|
||||||
|
element.addEventListener('animationend', function() { doSomething() }) |
||||||
|
``` |
||||||
|
|
||||||
|
You can use this simple function to add and remove the animations: |
||||||
|
|
||||||
|
```javascript |
||||||
|
function animateCSS(element, animationName, callback) { |
||||||
|
const node = document.querySelector(element) |
||||||
|
node.classList.add('animated', animationName) |
||||||
|
|
||||||
|
function handleAnimationEnd() { |
||||||
|
node.classList.remove('animated', animationName) |
||||||
|
node.removeEventListener('animationend', handleAnimationEnd) |
||||||
|
|
||||||
|
if (typeof callback === 'function') callback() |
||||||
|
} |
||||||
|
|
||||||
|
node.addEventListener('animationend', handleAnimationEnd) |
||||||
|
} |
||||||
|
``` |
||||||
|
|
||||||
|
And use it like this: |
||||||
|
|
||||||
|
```javascript |
||||||
|
animateCSS('.my-element', 'bounce') |
||||||
|
|
||||||
|
// or |
||||||
|
animateCSS('.my-element', 'bounce', function() { |
||||||
|
// Do something after animation |
||||||
|
}) |
||||||
|
``` |
||||||
|
|
||||||
|
Notice that the examples are using ES6's `const` declaration, dropping support for IE10 and some aging browsers. If you prefer, switch the `const` to `var` declarations and IE10 and some old browsers will get support (they still have to provide [classList](https://developer.mozilla.org/en-US/docs/Web/API/Element/classList) support, so do your [research](https://caniuse.com/#feat=classlist)). |
||||||
|
|
||||||
|
## Setting _Delay_ and _Speed_ |
||||||
|
|
||||||
|
### Delay Class |
||||||
|
|
||||||
|
It's possible to add delays directly on the element's class attribute, just like this: |
||||||
|
|
||||||
|
```html |
||||||
|
<div class="animated bounce delay-2s">Example</div> |
||||||
|
``` |
||||||
|
|
||||||
|
| Class Name | Delay Time | |
||||||
|
| ---------- | ---------- | |
||||||
|
| `delay-2s` | `2s` | |
||||||
|
| `delay-3s` | `3s` | |
||||||
|
| `delay-4s` | `4s` | |
||||||
|
| `delay-5s` | `5s` | |
||||||
|
|
||||||
|
> _**Note**: The default delays are from 1 second to 5 seconds only. If you need custom delays, add it directly to your own CSS code._ |
||||||
|
|
||||||
|
### Slow, Slower, Fast, and Faster Class |
||||||
|
|
||||||
|
It's possible to control the speed of the animation by adding these classes, as a sample below: |
||||||
|
|
||||||
|
```html |
||||||
|
<div class="animated bounce faster">Example</div> |
||||||
|
``` |
||||||
|
|
||||||
|
| Class Name | Speed Time | |
||||||
|
| ---------- | ---------- | |
||||||
|
| `slow` | `2s` | |
||||||
|
| `slower` | `3s` | |
||||||
|
| `fast` | `800ms` | |
||||||
|
| `faster` | `500ms` | |
||||||
|
|
||||||
|
> _**Note**: The `animated` class has a default speed of `1s`. If you need custom duration, add it directly to your own CSS code._ |
||||||
|
|
||||||
|
## Custom Builds |
||||||
|
|
||||||
|
Animate.css is powered by [gulp.js](http://gulpjs.com/), which means you can create custom builds pretty easily. First of all, you’ll need Gulp and all other dependencies: |
||||||
|
|
||||||
|
```sh |
||||||
|
$ cd path/to/animate.css/ |
||||||
|
$ sudo npm install |
||||||
|
``` |
||||||
|
|
||||||
|
Next, run `gulp` to compile your custom builds. For example, if you want only some of the “attention seekers”, simply edit the `animate-config.json` file to select only the animations you want to use. |
||||||
|
|
||||||
|
```javascript |
||||||
|
"attention_seekers": { |
||||||
|
"bounce": true, |
||||||
|
"flash": false, |
||||||
|
"pulse": false, |
||||||
|
"shake": true, |
||||||
|
"headShake": true, |
||||||
|
"swing": true, |
||||||
|
"tada": true, |
||||||
|
"wobble": true, |
||||||
|
"jello":true |
||||||
|
} |
||||||
|
``` |
||||||
|
|
||||||
|
## Accessibility |
||||||
|
|
||||||
|
Animate.css supports the [`prefers-reduced-motion` media query](https://webkit.org/blog/7551/responsive-design-for-motion/) so that users with motion sensitivity can opt out of animations. On supported platforms (currently Firefox, OSX Safari and iOS Safari), users can select "reduce motion" on their operating system preferences and it will turn off CSS transitions for them without any further work required. |
||||||
|
|
||||||
|
## License |
||||||
|
|
||||||
|
Animate.css is licensed under the MIT license. (http://opensource.org/licenses/MIT) |
||||||
|
|
||||||
|
## Code of Conduct |
||||||
|
|
||||||
|
This project and everyone participating in it is governed by the [Contributor Covenant Code of Conduct](CODE_OF_CONDUCT.md). By participating, you are expected to uphold this code. Please report unacceptable behavior to [callmeelton@gmail.com](mailto:callmeelton@gmail.com). |
||||||
|
|
||||||
|
## Contributing |
||||||
|
|
||||||
|
Pull requests are the way to go here. We only have two rules for submitting a pull request: match the naming convention (camelCase, categorised [fades, bounces, etc]) and let us see a demo of submitted animations in a [pen](http://codepen.io). That **last one is important**. |
@ -0,0 +1,121 @@ |
|||||||
|
{ |
||||||
|
"attention_seekers": { |
||||||
|
"bounce": true, |
||||||
|
"flash": true, |
||||||
|
"pulse": true, |
||||||
|
"rubberBand": true, |
||||||
|
"shake": true, |
||||||
|
"headShake": true, |
||||||
|
"swing": true, |
||||||
|
"tada": true, |
||||||
|
"wobble": true, |
||||||
|
"jello": true, |
||||||
|
"heartBeat": true |
||||||
|
}, |
||||||
|
|
||||||
|
"bouncing_entrances": { |
||||||
|
"bounceIn": true, |
||||||
|
"bounceInDown": true, |
||||||
|
"bounceInLeft": true, |
||||||
|
"bounceInRight": true, |
||||||
|
"bounceInUp": true |
||||||
|
}, |
||||||
|
|
||||||
|
"bouncing_exits": { |
||||||
|
"bounceOut": true, |
||||||
|
"bounceOutDown": true, |
||||||
|
"bounceOutLeft": true, |
||||||
|
"bounceOutRight": true, |
||||||
|
"bounceOutUp": true |
||||||
|
}, |
||||||
|
|
||||||
|
"fading_entrances": { |
||||||
|
"fadeIn": true, |
||||||
|
"fadeInDown": true, |
||||||
|
"fadeInDownBig": true, |
||||||
|
"fadeInLeft": true, |
||||||
|
"fadeInLeftBig": true, |
||||||
|
"fadeInRight": true, |
||||||
|
"fadeInRightBig": true, |
||||||
|
"fadeInUp": true, |
||||||
|
"fadeInUpBig": true |
||||||
|
}, |
||||||
|
|
||||||
|
"fading_exits": { |
||||||
|
"fadeOut": true, |
||||||
|
"fadeOutDown": true, |
||||||
|
"fadeOutDownBig": true, |
||||||
|
"fadeOutLeft": true, |
||||||
|
"fadeOutLeftBig": true, |
||||||
|
"fadeOutRight": true, |
||||||
|
"fadeOutRightBig": true, |
||||||
|
"fadeOutUp": true, |
||||||
|
"fadeOutUpBig": true |
||||||
|
}, |
||||||
|
|
||||||
|
"flippers": { |
||||||
|
"flip": true, |
||||||
|
"flipInX": true, |
||||||
|
"flipInY": true, |
||||||
|
"flipOutX": true, |
||||||
|
"flipOutY": true |
||||||
|
}, |
||||||
|
|
||||||
|
"lightspeed": { |
||||||
|
"lightSpeedIn": true, |
||||||
|
"lightSpeedOut": true |
||||||
|
}, |
||||||
|
|
||||||
|
"rotating_entrances": { |
||||||
|
"rotateIn": true, |
||||||
|
"rotateInDownLeft": true, |
||||||
|
"rotateInDownRight": true, |
||||||
|
"rotateInUpLeft": true, |
||||||
|
"rotateInUpRight": true |
||||||
|
}, |
||||||
|
|
||||||
|
"rotating_exits": { |
||||||
|
"rotateOut": true, |
||||||
|
"rotateOutDownLeft": true, |
||||||
|
"rotateOutDownRight": true, |
||||||
|
"rotateOutUpLeft": true, |
||||||
|
"rotateOutUpRight": true |
||||||
|
}, |
||||||
|
|
||||||
|
"specials": { |
||||||
|
"hinge": true, |
||||||
|
"jackInTheBox": true, |
||||||
|
"rollIn": true, |
||||||
|
"rollOut": true |
||||||
|
}, |
||||||
|
|
||||||
|
"zooming_entrances": { |
||||||
|
"zoomIn": true, |
||||||
|
"zoomInDown": true, |
||||||
|
"zoomInLeft": true, |
||||||
|
"zoomInRight": true, |
||||||
|
"zoomInUp": true |
||||||
|
}, |
||||||
|
|
||||||
|
"zooming_exits": { |
||||||
|
"zoomOut": true, |
||||||
|
"zoomOutDown": true, |
||||||
|
"zoomOutLeft": true, |
||||||
|
"zoomOutRight": true, |
||||||
|
"zoomOutUp": true |
||||||
|
}, |
||||||
|
|
||||||
|
"sliding_entrances": { |
||||||
|
"slideInDown": true, |
||||||
|
"slideInLeft": true, |
||||||
|
"slideInRight": true, |
||||||
|
"slideInUp": true |
||||||
|
}, |
||||||
|
|
||||||
|
"sliding_exits": { |
||||||
|
"slideOutDown": true, |
||||||
|
"slideOutLeft": true, |
||||||
|
"slideOutRight": true, |
||||||
|
"slideOutUp": true |
||||||
|
} |
||||||
|
} |
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
@ -0,0 +1,5 @@ |
|||||||
|
{ |
||||||
|
"name": "animate.css", |
||||||
|
"main": "./animate.css", |
||||||
|
"ignore": [".*", "*.yml", "Gemfile", "Gemfile.lock", "*.md"] |
||||||
|
} |
@ -0,0 +1,107 @@ |
|||||||
|
// Utilities
|
||||||
|
var autoprefixer = require('autoprefixer'); |
||||||
|
var cssnano = require('cssnano'); |
||||||
|
var fs = require('fs'); |
||||||
|
|
||||||
|
// Gulp
|
||||||
|
var gulp = require('gulp'); |
||||||
|
|
||||||
|
// Gulp plugins
|
||||||
|
var concat = require('gulp-concat'); |
||||||
|
var gutil = require('gulp-util'); |
||||||
|
var header = require('gulp-header'); |
||||||
|
var postcss = require('gulp-postcss'); |
||||||
|
var rename = require('gulp-rename'); |
||||||
|
var runSequence = require('run-sequence'); |
||||||
|
|
||||||
|
// Misc/global vars
|
||||||
|
var pkg = JSON.parse(fs.readFileSync('package.json')); |
||||||
|
var activatedAnimations = activateAnimations(); |
||||||
|
|
||||||
|
// Task options
|
||||||
|
var opts = { |
||||||
|
destPath: './', |
||||||
|
concatName: 'animate.css', |
||||||
|
|
||||||
|
autoprefixer: { |
||||||
|
browsers: ['> 1%', 'last 2 versions', 'Firefox ESR'], |
||||||
|
cascade: false, |
||||||
|
}, |
||||||
|
|
||||||
|
minRename: { |
||||||
|
suffix: '.min', |
||||||
|
}, |
||||||
|
|
||||||
|
banner: [ |
||||||
|
'@charset "UTF-8";\n', |
||||||
|
'/*!', |
||||||
|
' * <%= name %> -<%= homepage %>', |
||||||
|
' * Version - <%= version %>', |
||||||
|
' * Licensed under the MIT license - http://opensource.org/licenses/MIT', |
||||||
|
' *', |
||||||
|
' * Copyright (c) <%= new Date().getFullYear() %> <%= author.name %>', |
||||||
|
' */\n\n', |
||||||
|
].join('\n'), |
||||||
|
}; |
||||||
|
|
||||||
|
// ----------------------------
|
||||||
|
// Gulp task definitions
|
||||||
|
// ----------------------------
|
||||||
|
|
||||||
|
gulp.task('createCSS', function() { |
||||||
|
return gulp |
||||||
|
.src(activatedAnimations) |
||||||
|
.pipe(concat(opts.concatName)) |
||||||
|
.pipe(postcss([autoprefixer(opts.autoprefixer)])) |
||||||
|
.pipe(gulp.dest(opts.destPath)) |
||||||
|
.pipe(postcss([cssnano({reduceIdents: {keyframes: false}})])) |
||||||
|
.pipe(rename(opts.minRename)) |
||||||
|
.pipe(gulp.dest(opts.destPath)); |
||||||
|
}); |
||||||
|
|
||||||
|
gulp.task('addHeader', function() { |
||||||
|
return gulp |
||||||
|
.src('*.css') |
||||||
|
.pipe(header(opts.banner, pkg)) |
||||||
|
.pipe(gulp.dest(opts.destPath)); |
||||||
|
}); |
||||||
|
|
||||||
|
gulp.task('default', gulp.series('createCSS', 'addHeader')); |
||||||
|
|
||||||
|
// ----------------------------
|
||||||
|
// Helpers/functions
|
||||||
|
// ----------------------------
|
||||||
|
|
||||||
|
// Read the config file and return an array of the animations to be activated
|
||||||
|
function activateAnimations() { |
||||||
|
var categories = JSON.parse(fs.readFileSync('animate-config.json')), |
||||||
|
category, |
||||||
|
files, |
||||||
|
file, |
||||||
|
target = [], |
||||||
|
count = 0; |
||||||
|
|
||||||
|
for (category in categories) { |
||||||
|
if (categories.hasOwnProperty(category)) { |
||||||
|
files = categories[category]; |
||||||
|
|
||||||
|
for (file in files) { |
||||||
|
if (files[file]) { |
||||||
|
// marked as true
|
||||||
|
target.push('source/' + category + '/' + file + '.css'); |
||||||
|
count += 1; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
// prepend base CSS
|
||||||
|
target.push('source/_base.css'); |
||||||
|
|
||||||
|
if (!count) { |
||||||
|
gutil.log('No animations activated.'); |
||||||
|
} else { |
||||||
|
gutil.log(count + (count > 1 ? ' animations' : ' animation') + ' activated.'); |
||||||
|
} |
||||||
|
|
||||||
|
return target; |
||||||
|
} |
@ -0,0 +1,88 @@ |
|||||||
|
{ |
||||||
|
"_from": "animate.css", |
||||||
|
"_id": "animate.css@3.7.2", |
||||||
|
"_inBundle": false, |
||||||
|
"_integrity": "sha1-5z4NUOkssc/vFZfZs4qUgQIOCOo=", |
||||||
|
"_location": "/animate.css", |
||||||
|
"_phantomChildren": {}, |
||||||
|
"_requested": { |
||||||
|
"type": "tag", |
||||||
|
"registry": true, |
||||||
|
"raw": "animate.css", |
||||||
|
"name": "animate.css", |
||||||
|
"escapedName": "animate.css", |
||||||
|
"rawSpec": "", |
||||||
|
"saveSpec": null, |
||||||
|
"fetchSpec": "latest" |
||||||
|
}, |
||||||
|
"_requiredBy": [ |
||||||
|
"#USER", |
||||||
|
"/" |
||||||
|
], |
||||||
|
"_resolved": "https://registry.npm.taobao.org/animate.css/download/animate.css-3.7.2.tgz", |
||||||
|
"_shasum": "e73e0d50e92cb1cfef1597d9b38a9481020e08ea", |
||||||
|
"_spec": "animate.css", |
||||||
|
"_where": "/Users/piao/Documents/Project/yshopmall_uni", |
||||||
|
"author": { |
||||||
|
"name": "Daniel Eden" |
||||||
|
}, |
||||||
|
"bugs": { |
||||||
|
"url": "https://github.com/daneden/animate.css/issues" |
||||||
|
}, |
||||||
|
"bundleDependencies": false, |
||||||
|
"deprecated": false, |
||||||
|
"description": "_Just-add-water CSS animation_", |
||||||
|
"devDependencies": { |
||||||
|
"autoprefixer": "^9.0.1", |
||||||
|
"cssnano": "^4.0.3", |
||||||
|
"eslint": "^5.2.0", |
||||||
|
"gulp": "^4.0.0", |
||||||
|
"gulp-concat": "^2.6.1", |
||||||
|
"gulp-header": "^2.0.1", |
||||||
|
"gulp-postcss": "^8.0.0", |
||||||
|
"gulp-rename": "^1.2.2", |
||||||
|
"gulp-util": "^3.0.8", |
||||||
|
"husky": "^1.2.0", |
||||||
|
"lint-staged": "^8.1.0", |
||||||
|
"prettier": "^1.10.2", |
||||||
|
"run-sequence": "^2.2.1" |
||||||
|
}, |
||||||
|
"homepage": "https://daneden.github.io/animate.css/", |
||||||
|
"jspm": { |
||||||
|
"main": "animate.css!", |
||||||
|
"format": "global", |
||||||
|
"directories": { |
||||||
|
"lib": "./" |
||||||
|
} |
||||||
|
}, |
||||||
|
"license": "MIT", |
||||||
|
"lint-staged": { |
||||||
|
"*.{js,json,md,css}": [ |
||||||
|
"prettier --write", |
||||||
|
"git add" |
||||||
|
] |
||||||
|
}, |
||||||
|
"main": "animate.css", |
||||||
|
"name": "animate.css", |
||||||
|
"prettier": { |
||||||
|
"bracketSpacing": false, |
||||||
|
"proseWrap": "never", |
||||||
|
"singleQuote": true, |
||||||
|
"trailingComma": "all" |
||||||
|
}, |
||||||
|
"repository": { |
||||||
|
"type": "git", |
||||||
|
"url": "git+https://github.com/daneden/animate.css.git" |
||||||
|
}, |
||||||
|
"scripts": { |
||||||
|
"gulp": "./node_modules/gulp/bin/gulp.js", |
||||||
|
"precommit": "lint-staged", |
||||||
|
"prettier": "prettier --write \"**/*.{js,json,md,css}\"", |
||||||
|
"start": "gulp" |
||||||
|
}, |
||||||
|
"spm": { |
||||||
|
"main": "./animate.css" |
||||||
|
}, |
||||||
|
"style": "./animate.css", |
||||||
|
"version": "3.7.2" |
||||||
|
} |
@ -0,0 +1,52 @@ |
|||||||
|
.animated { |
||||||
|
animation-duration: 1s; |
||||||
|
animation-fill-mode: both; |
||||||
|
} |
||||||
|
|
||||||
|
.animated.infinite { |
||||||
|
animation-iteration-count: infinite; |
||||||
|
} |
||||||
|
|
||||||
|
.animated.delay-1s { |
||||||
|
animation-delay: 1s; |
||||||
|
} |
||||||
|
|
||||||
|
.animated.delay-2s { |
||||||
|
animation-delay: 2s; |
||||||
|
} |
||||||
|
|
||||||
|
.animated.delay-3s { |
||||||
|
animation-delay: 3s; |
||||||
|
} |
||||||
|
|
||||||
|
.animated.delay-4s { |
||||||
|
animation-delay: 4s; |
||||||
|
} |
||||||
|
|
||||||
|
.animated.delay-5s { |
||||||
|
animation-delay: 5s; |
||||||
|
} |
||||||
|
|
||||||
|
.animated.fast { |
||||||
|
animation-duration: 800ms; |
||||||
|
} |
||||||
|
|
||||||
|
.animated.faster { |
||||||
|
animation-duration: 500ms; |
||||||
|
} |
||||||
|
|
||||||
|
.animated.slow { |
||||||
|
animation-duration: 2s; |
||||||
|
} |
||||||
|
|
||||||
|
.animated.slower { |
||||||
|
animation-duration: 3s; |
||||||
|
} |
||||||
|
|
||||||
|
@media (print), (prefers-reduced-motion: reduce) { |
||||||
|
.animated { |
||||||
|
animation-duration: 1ms !important; |
||||||
|
transition-duration: 1ms !important; |
||||||
|
animation-iteration-count: 1 !important; |
||||||
|
} |
||||||
|
} |
@ -0,0 +1,4 @@ |
|||||||
|
.animated { |
||||||
|
--animate-duration: 1s; |
||||||
|
--animate-delay: 1s; |
||||||
|
} |
@ -0,0 +1,30 @@ |
|||||||
|
@keyframes bounce { |
||||||
|
from, |
||||||
|
20%, |
||||||
|
53%, |
||||||
|
80%, |
||||||
|
to { |
||||||
|
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); |
||||||
|
transform: translate3d(0, 0, 0); |
||||||
|
} |
||||||
|
|
||||||
|
40%, |
||||||
|
43% { |
||||||
|
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); |
||||||
|
transform: translate3d(0, -30px, 0); |
||||||
|
} |
||||||
|
|
||||||
|
70% { |
||||||
|
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); |
||||||
|
transform: translate3d(0, -15px, 0); |
||||||
|
} |
||||||
|
|
||||||
|
90% { |
||||||
|
transform: translate3d(0, -4px, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.bounce { |
||||||
|
animation-name: bounce; |
||||||
|
transform-origin: center bottom; |
||||||
|
} |
@ -0,0 +1,16 @@ |
|||||||
|
@keyframes flash { |
||||||
|
from, |
||||||
|
50%, |
||||||
|
to { |
||||||
|
opacity: 1; |
||||||
|
} |
||||||
|
|
||||||
|
25%, |
||||||
|
75% { |
||||||
|
opacity: 0; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.flash { |
||||||
|
animation-name: flash; |
||||||
|
} |
@ -0,0 +1,30 @@ |
|||||||
|
@keyframes headShake { |
||||||
|
0% { |
||||||
|
transform: translateX(0); |
||||||
|
} |
||||||
|
|
||||||
|
6.5% { |
||||||
|
transform: translateX(-6px) rotateY(-9deg); |
||||||
|
} |
||||||
|
|
||||||
|
18.5% { |
||||||
|
transform: translateX(5px) rotateY(7deg); |
||||||
|
} |
||||||
|
|
||||||
|
31.5% { |
||||||
|
transform: translateX(-3px) rotateY(-5deg); |
||||||
|
} |
||||||
|
|
||||||
|
43.5% { |
||||||
|
transform: translateX(2px) rotateY(3deg); |
||||||
|
} |
||||||
|
|
||||||
|
50% { |
||||||
|
transform: translateX(0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.headShake { |
||||||
|
animation-timing-function: ease-in-out; |
||||||
|
animation-name: headShake; |
||||||
|
} |
@ -0,0 +1,27 @@ |
|||||||
|
@keyframes heartBeat { |
||||||
|
0% { |
||||||
|
transform: scale(1); |
||||||
|
} |
||||||
|
|
||||||
|
14% { |
||||||
|
transform: scale(1.3); |
||||||
|
} |
||||||
|
|
||||||
|
28% { |
||||||
|
transform: scale(1); |
||||||
|
} |
||||||
|
|
||||||
|
42% { |
||||||
|
transform: scale(1.3); |
||||||
|
} |
||||||
|
|
||||||
|
70% { |
||||||
|
transform: scale(1); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.heartBeat { |
||||||
|
animation-name: heartBeat; |
||||||
|
animation-duration: 1.3s; |
||||||
|
animation-timing-function: ease-in-out; |
||||||
|
} |
@ -0,0 +1,40 @@ |
|||||||
|
@keyframes jello { |
||||||
|
from, |
||||||
|
11.1%, |
||||||
|
to { |
||||||
|
transform: translate3d(0, 0, 0); |
||||||
|
} |
||||||
|
|
||||||
|
22.2% { |
||||||
|
transform: skewX(-12.5deg) skewY(-12.5deg); |
||||||
|
} |
||||||
|
|
||||||
|
33.3% { |
||||||
|
transform: skewX(6.25deg) skewY(6.25deg); |
||||||
|
} |
||||||
|
|
||||||
|
44.4% { |
||||||
|
transform: skewX(-3.125deg) skewY(-3.125deg); |
||||||
|
} |
||||||
|
|
||||||
|
55.5% { |
||||||
|
transform: skewX(1.5625deg) skewY(1.5625deg); |
||||||
|
} |
||||||
|
|
||||||
|
66.6% { |
||||||
|
transform: skewX(-0.78125deg) skewY(-0.78125deg); |
||||||
|
} |
||||||
|
|
||||||
|
77.7% { |
||||||
|
transform: skewX(0.390625deg) skewY(0.390625deg); |
||||||
|
} |
||||||
|
|
||||||
|
88.8% { |
||||||
|
transform: skewX(-0.1953125deg) skewY(-0.1953125deg); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.jello { |
||||||
|
animation-name: jello; |
||||||
|
transform-origin: center; |
||||||
|
} |
@ -0,0 +1,19 @@ |
|||||||
|
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ |
||||||
|
|
||||||
|
@keyframes pulse { |
||||||
|
from { |
||||||
|
transform: scale3d(1, 1, 1); |
||||||
|
} |
||||||
|
|
||||||
|
50% { |
||||||
|
transform: scale3d(1.05, 1.05, 1.05); |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
transform: scale3d(1, 1, 1); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.pulse { |
||||||
|
animation-name: pulse; |
||||||
|
} |
@ -0,0 +1,33 @@ |
|||||||
|
@keyframes rubberBand { |
||||||
|
from { |
||||||
|
transform: scale3d(1, 1, 1); |
||||||
|
} |
||||||
|
|
||||||
|
30% { |
||||||
|
transform: scale3d(1.25, 0.75, 1); |
||||||
|
} |
||||||
|
|
||||||
|
40% { |
||||||
|
transform: scale3d(0.75, 1.25, 1); |
||||||
|
} |
||||||
|
|
||||||
|
50% { |
||||||
|
transform: scale3d(1.15, 0.85, 1); |
||||||
|
} |
||||||
|
|
||||||
|
65% { |
||||||
|
transform: scale3d(0.95, 1.05, 1); |
||||||
|
} |
||||||
|
|
||||||
|
75% { |
||||||
|
transform: scale3d(1.05, 0.95, 1); |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
transform: scale3d(1, 1, 1); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.rubberBand { |
||||||
|
animation-name: rubberBand; |
||||||
|
} |
@ -0,0 +1,25 @@ |
|||||||
|
@keyframes shake { |
||||||
|
from, |
||||||
|
to { |
||||||
|
transform: translate3d(0, 0, 0); |
||||||
|
} |
||||||
|
|
||||||
|
10%, |
||||||
|
30%, |
||||||
|
50%, |
||||||
|
70%, |
||||||
|
90% { |
||||||
|
transform: translate3d(-10px, 0, 0); |
||||||
|
} |
||||||
|
|
||||||
|
20%, |
||||||
|
40%, |
||||||
|
60%, |
||||||
|
80% { |
||||||
|
transform: translate3d(10px, 0, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.shake { |
||||||
|
animation-name: shake; |
||||||
|
} |
@ -0,0 +1,26 @@ |
|||||||
|
@keyframes swing { |
||||||
|
20% { |
||||||
|
transform: rotate3d(0, 0, 1, 15deg); |
||||||
|
} |
||||||
|
|
||||||
|
40% { |
||||||
|
transform: rotate3d(0, 0, 1, -10deg); |
||||||
|
} |
||||||
|
|
||||||
|
60% { |
||||||
|
transform: rotate3d(0, 0, 1, 5deg); |
||||||
|
} |
||||||
|
|
||||||
|
80% { |
||||||
|
transform: rotate3d(0, 0, 1, -5deg); |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
transform: rotate3d(0, 0, 1, 0deg); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.swing { |
||||||
|
transform-origin: top center; |
||||||
|
animation-name: swing; |
||||||
|
} |
@ -0,0 +1,31 @@ |
|||||||
|
@keyframes tada { |
||||||
|
from { |
||||||
|
transform: scale3d(1, 1, 1); |
||||||
|
} |
||||||
|
|
||||||
|
10%, |
||||||
|
20% { |
||||||
|
transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); |
||||||
|
} |
||||||
|
|
||||||
|
30%, |
||||||
|
50%, |
||||||
|
70%, |
||||||
|
90% { |
||||||
|
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); |
||||||
|
} |
||||||
|
|
||||||
|
40%, |
||||||
|
60%, |
||||||
|
80% { |
||||||
|
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
transform: scale3d(1, 1, 1); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.tada { |
||||||
|
animation-name: tada; |
||||||
|
} |
@ -0,0 +1,35 @@ |
|||||||
|
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ |
||||||
|
|
||||||
|
@keyframes wobble { |
||||||
|
from { |
||||||
|
transform: translate3d(0, 0, 0); |
||||||
|
} |
||||||
|
|
||||||
|
15% { |
||||||
|
transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); |
||||||
|
} |
||||||
|
|
||||||
|
30% { |
||||||
|
transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); |
||||||
|
} |
||||||
|
|
||||||
|
45% { |
||||||
|
transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); |
||||||
|
} |
||||||
|
|
||||||
|
60% { |
||||||
|
transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); |
||||||
|
} |
||||||
|
|
||||||
|
75% { |
||||||
|
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
transform: translate3d(0, 0, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.wobble { |
||||||
|
animation-name: wobble; |
||||||
|
} |
@ -0,0 +1,42 @@ |
|||||||
|
@keyframes bounceIn { |
||||||
|
from, |
||||||
|
20%, |
||||||
|
40%, |
||||||
|
60%, |
||||||
|
80%, |
||||||
|
to { |
||||||
|
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); |
||||||
|
} |
||||||
|
|
||||||
|
0% { |
||||||
|
opacity: 0; |
||||||
|
transform: scale3d(0.3, 0.3, 0.3); |
||||||
|
} |
||||||
|
|
||||||
|
20% { |
||||||
|
transform: scale3d(1.1, 1.1, 1.1); |
||||||
|
} |
||||||
|
|
||||||
|
40% { |
||||||
|
transform: scale3d(0.9, 0.9, 0.9); |
||||||
|
} |
||||||
|
|
||||||
|
60% { |
||||||
|
opacity: 1; |
||||||
|
transform: scale3d(1.03, 1.03, 1.03); |
||||||
|
} |
||||||
|
|
||||||
|
80% { |
||||||
|
transform: scale3d(0.97, 0.97, 0.97); |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 1; |
||||||
|
transform: scale3d(1, 1, 1); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.bounceIn { |
||||||
|
animation-duration: 0.75s; |
||||||
|
animation-name: bounceIn; |
||||||
|
} |
@ -0,0 +1,35 @@ |
|||||||
|
@keyframes bounceInDown { |
||||||
|
from, |
||||||
|
60%, |
||||||
|
75%, |
||||||
|
90%, |
||||||
|
to { |
||||||
|
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); |
||||||
|
} |
||||||
|
|
||||||
|
0% { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(0, -3000px, 0); |
||||||
|
} |
||||||
|
|
||||||
|
60% { |
||||||
|
opacity: 1; |
||||||
|
transform: translate3d(0, 25px, 0); |
||||||
|
} |
||||||
|
|
||||||
|
75% { |
||||||
|
transform: translate3d(0, -10px, 0); |
||||||
|
} |
||||||
|
|
||||||
|
90% { |
||||||
|
transform: translate3d(0, 5px, 0); |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
transform: translate3d(0, 0, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.bounceInDown { |
||||||
|
animation-name: bounceInDown; |
||||||
|
} |
@ -0,0 +1,35 @@ |
|||||||
|
@keyframes bounceInLeft { |
||||||
|
from, |
||||||
|
60%, |
||||||
|
75%, |
||||||
|
90%, |
||||||
|
to { |
||||||
|
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); |
||||||
|
} |
||||||
|
|
||||||
|
0% { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(-3000px, 0, 0); |
||||||
|
} |
||||||
|
|
||||||
|
60% { |
||||||
|
opacity: 1; |
||||||
|
transform: translate3d(25px, 0, 0); |
||||||
|
} |
||||||
|
|
||||||
|
75% { |
||||||
|
transform: translate3d(-10px, 0, 0); |
||||||
|
} |
||||||
|
|
||||||
|
90% { |
||||||
|
transform: translate3d(5px, 0, 0); |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
transform: translate3d(0, 0, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.bounceInLeft { |
||||||
|
animation-name: bounceInLeft; |
||||||
|
} |
@ -0,0 +1,35 @@ |
|||||||
|
@keyframes bounceInRight { |
||||||
|
from, |
||||||
|
60%, |
||||||
|
75%, |
||||||
|
90%, |
||||||
|
to { |
||||||
|
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); |
||||||
|
} |
||||||
|
|
||||||
|
from { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(3000px, 0, 0); |
||||||
|
} |
||||||
|
|
||||||
|
60% { |
||||||
|
opacity: 1; |
||||||
|
transform: translate3d(-25px, 0, 0); |
||||||
|
} |
||||||
|
|
||||||
|
75% { |
||||||
|
transform: translate3d(10px, 0, 0); |
||||||
|
} |
||||||
|
|
||||||
|
90% { |
||||||
|
transform: translate3d(-5px, 0, 0); |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
transform: translate3d(0, 0, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.bounceInRight { |
||||||
|
animation-name: bounceInRight; |
||||||
|
} |
@ -0,0 +1,35 @@ |
|||||||
|
@keyframes bounceInUp { |
||||||
|
from, |
||||||
|
60%, |
||||||
|
75%, |
||||||
|
90%, |
||||||
|
to { |
||||||
|
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); |
||||||
|
} |
||||||
|
|
||||||
|
from { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(0, 3000px, 0); |
||||||
|
} |
||||||
|
|
||||||
|
60% { |
||||||
|
opacity: 1; |
||||||
|
transform: translate3d(0, -20px, 0); |
||||||
|
} |
||||||
|
|
||||||
|
75% { |
||||||
|
transform: translate3d(0, 10px, 0); |
||||||
|
} |
||||||
|
|
||||||
|
90% { |
||||||
|
transform: translate3d(0, -5px, 0); |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
transform: translate3d(0, 0, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.bounceInUp { |
||||||
|
animation-name: bounceInUp; |
||||||
|
} |
@ -0,0 +1,21 @@ |
|||||||
|
@keyframes bounceOut { |
||||||
|
20% { |
||||||
|
transform: scale3d(0.9, 0.9, 0.9); |
||||||
|
} |
||||||
|
|
||||||
|
50%, |
||||||
|
55% { |
||||||
|
opacity: 1; |
||||||
|
transform: scale3d(1.1, 1.1, 1.1); |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 0; |
||||||
|
transform: scale3d(0.3, 0.3, 0.3); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.bounceOut { |
||||||
|
animation-duration: 0.75s; |
||||||
|
animation-name: bounceOut; |
||||||
|
} |
@ -0,0 +1,20 @@ |
|||||||
|
@keyframes bounceOutDown { |
||||||
|
20% { |
||||||
|
transform: translate3d(0, 10px, 0); |
||||||
|
} |
||||||
|
|
||||||
|
40%, |
||||||
|
45% { |
||||||
|
opacity: 1; |
||||||
|
transform: translate3d(0, -20px, 0); |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(0, 2000px, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.bounceOutDown { |
||||||
|
animation-name: bounceOutDown; |
||||||
|
} |
@ -0,0 +1,15 @@ |
|||||||
|
@keyframes bounceOutLeft { |
||||||
|
20% { |
||||||
|
opacity: 1; |
||||||
|
transform: translate3d(20px, 0, 0); |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(-2000px, 0, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.bounceOutLeft { |
||||||
|
animation-name: bounceOutLeft; |
||||||
|
} |
@ -0,0 +1,15 @@ |
|||||||
|
@keyframes bounceOutRight { |
||||||
|
20% { |
||||||
|
opacity: 1; |
||||||
|
transform: translate3d(-20px, 0, 0); |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(2000px, 0, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.bounceOutRight { |
||||||
|
animation-name: bounceOutRight; |
||||||
|
} |
@ -0,0 +1,20 @@ |
|||||||
|
@keyframes bounceOutUp { |
||||||
|
20% { |
||||||
|
transform: translate3d(0, -10px, 0); |
||||||
|
} |
||||||
|
|
||||||
|
40%, |
||||||
|
45% { |
||||||
|
opacity: 1; |
||||||
|
transform: translate3d(0, 20px, 0); |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(0, -2000px, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.bounceOutUp { |
||||||
|
animation-name: bounceOutUp; |
||||||
|
} |
@ -0,0 +1,13 @@ |
|||||||
|
@keyframes fadeIn { |
||||||
|
from { |
||||||
|
opacity: 0; |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 1; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.fadeIn { |
||||||
|
animation-name: fadeIn; |
||||||
|
} |
@ -0,0 +1,15 @@ |
|||||||
|
@keyframes fadeInDown { |
||||||
|
from { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(0, -100%, 0); |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 1; |
||||||
|
transform: translate3d(0, 0, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.fadeInDown { |
||||||
|
animation-name: fadeInDown; |
||||||
|
} |
@ -0,0 +1,15 @@ |
|||||||
|
@keyframes fadeInDownBig { |
||||||
|
from { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(0, -2000px, 0); |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 1; |
||||||
|
transform: translate3d(0, 0, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.fadeInDownBig { |
||||||
|
animation-name: fadeInDownBig; |
||||||
|
} |
@ -0,0 +1,15 @@ |
|||||||
|
@keyframes fadeInLeft { |
||||||
|
from { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(-100%, 0, 0); |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 1; |
||||||
|
transform: translate3d(0, 0, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.fadeInLeft { |
||||||
|
animation-name: fadeInLeft; |
||||||
|
} |
@ -0,0 +1,15 @@ |
|||||||
|
@keyframes fadeInLeftBig { |
||||||
|
from { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(-2000px, 0, 0); |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 1; |
||||||
|
transform: translate3d(0, 0, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.fadeInLeftBig { |
||||||
|
animation-name: fadeInLeftBig; |
||||||
|
} |
@ -0,0 +1,15 @@ |
|||||||
|
@keyframes fadeInRight { |
||||||
|
from { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(100%, 0, 0); |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 1; |
||||||
|
transform: translate3d(0, 0, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.fadeInRight { |
||||||
|
animation-name: fadeInRight; |
||||||
|
} |
@ -0,0 +1,15 @@ |
|||||||
|
@keyframes fadeInRightBig { |
||||||
|
from { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(2000px, 0, 0); |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 1; |
||||||
|
transform: translate3d(0, 0, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.fadeInRightBig { |
||||||
|
animation-name: fadeInRightBig; |
||||||
|
} |
@ -0,0 +1,15 @@ |
|||||||
|
@keyframes fadeInUp { |
||||||
|
from { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(0, 100%, 0); |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 1; |
||||||
|
transform: translate3d(0, 0, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.fadeInUp { |
||||||
|
animation-name: fadeInUp; |
||||||
|
} |
@ -0,0 +1,15 @@ |
|||||||
|
@keyframes fadeInUpBig { |
||||||
|
from { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(0, 2000px, 0); |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 1; |
||||||
|
transform: translate3d(0, 0, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.fadeInUpBig { |
||||||
|
animation-name: fadeInUpBig; |
||||||
|
} |
@ -0,0 +1,13 @@ |
|||||||
|
@keyframes fadeOut { |
||||||
|
from { |
||||||
|
opacity: 1; |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 0; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.fadeOut { |
||||||
|
animation-name: fadeOut; |
||||||
|
} |
@ -0,0 +1,14 @@ |
|||||||
|
@keyframes fadeOutDown { |
||||||
|
from { |
||||||
|
opacity: 1; |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(0, 100%, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.fadeOutDown { |
||||||
|
animation-name: fadeOutDown; |
||||||
|
} |
@ -0,0 +1,14 @@ |
|||||||
|
@keyframes fadeOutDownBig { |
||||||
|
from { |
||||||
|
opacity: 1; |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(0, 2000px, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.fadeOutDownBig { |
||||||
|
animation-name: fadeOutDownBig; |
||||||
|
} |
@ -0,0 +1,14 @@ |
|||||||
|
@keyframes fadeOutLeft { |
||||||
|
from { |
||||||
|
opacity: 1; |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(-100%, 0, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.fadeOutLeft { |
||||||
|
animation-name: fadeOutLeft; |
||||||
|
} |
@ -0,0 +1,14 @@ |
|||||||
|
@keyframes fadeOutLeftBig { |
||||||
|
from { |
||||||
|
opacity: 1; |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(-2000px, 0, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.fadeOutLeftBig { |
||||||
|
animation-name: fadeOutLeftBig; |
||||||
|
} |
@ -0,0 +1,14 @@ |
|||||||
|
@keyframes fadeOutRight { |
||||||
|
from { |
||||||
|
opacity: 1; |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(100%, 0, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.fadeOutRight { |
||||||
|
animation-name: fadeOutRight; |
||||||
|
} |
@ -0,0 +1,14 @@ |
|||||||
|
@keyframes fadeOutRightBig { |
||||||
|
from { |
||||||
|
opacity: 1; |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(2000px, 0, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.fadeOutRightBig { |
||||||
|
animation-name: fadeOutRightBig; |
||||||
|
} |
@ -0,0 +1,14 @@ |
|||||||
|
@keyframes fadeOutUp { |
||||||
|
from { |
||||||
|
opacity: 1; |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(0, -100%, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.fadeOutUp { |
||||||
|
animation-name: fadeOutUp; |
||||||
|
} |
@ -0,0 +1,14 @@ |
|||||||
|
@keyframes fadeOutUpBig { |
||||||
|
from { |
||||||
|
opacity: 1; |
||||||
|
} |
||||||
|
|
||||||
|
to { |
||||||
|
opacity: 0; |
||||||
|
transform: translate3d(0, -2000px, 0); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.fadeOutUpBig { |
||||||
|
animation-name: fadeOutUpBig; |
||||||
|
} |
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in new issue