first commit
commit
d929afa146
@ -0,0 +1,8 @@
|
||||
.project
|
||||
.hbuilderx
|
||||
.mini-ide
|
||||
.idea
|
||||
unpackage
|
||||
.DS_Store
|
||||
|
||||
node_modules
|
||||
@ -0,0 +1,183 @@
|
||||
<script>
|
||||
import {
|
||||
getUpdateManager,
|
||||
setHeaderHeight
|
||||
} from "./utils/app";
|
||||
import utils from "./utils/utils.js";
|
||||
|
||||
// #ifdef MP-ALIPAY
|
||||
// 商品详情组件
|
||||
const pluginGoodsEdit = requirePlugin('theGoodsEdit')
|
||||
// #endif
|
||||
|
||||
// #ifdef MP-ALIPAY
|
||||
// 本地生活商品插件集成sop
|
||||
if (!my.canIUse('groupPurchaseoucherPlugin') && !my.isIDE) {
|
||||
// my.ap && my.ap.updateAlipayClient && my.ap.updateAlipayClient(); // 如果动态加载不可用则打开支付宝客户端升级界面
|
||||
}
|
||||
// #endif
|
||||
|
||||
export default {
|
||||
onLaunch(options) {
|
||||
// #ifdef MP-ALIPAY
|
||||
// 商品详情组件
|
||||
if (pluginGoodsEdit) {
|
||||
pluginGoodsEdit.setPlaceOrderCallback((arg) => {
|
||||
// console.log(arg, 'arg')
|
||||
uni.redirectTo({
|
||||
url: arg.outItemId ? '/subPackages/goods/goods/index?id=' + arg.outItemId :
|
||||
'/pages/index/index', // 跳转到小程序的下单页面地址
|
||||
});
|
||||
})
|
||||
}
|
||||
// #endif
|
||||
|
||||
this.initLog({
|
||||
mch_id: 0
|
||||
}) // 访问记录
|
||||
getUpdateManager();
|
||||
setHeaderHeight();
|
||||
},
|
||||
onShow(options) {
|
||||
|
||||
},
|
||||
onHide() {
|
||||
// console.log("App Hide");
|
||||
},
|
||||
methods: {}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
/*每个页面公共css */
|
||||
@import "@/uni_modules/uview-ui/index.scss";
|
||||
@import "@/static/css/common.scss";
|
||||
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
page {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: #f2f2f2;
|
||||
min-height: 100%;
|
||||
font-family: PingFang SC, Arial, 'Helvetica Neue', Helvetica, sans-serif;
|
||||
}
|
||||
|
||||
.g-price {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.fwb {
|
||||
position: relative;
|
||||
top: -2rpx;
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
line-height: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.tabbar-page {
|
||||
padding-bottom: 120rpx;
|
||||
padding-bottom: calc(constant(safe-area-inset-bottom) + 120rpx);
|
||||
padding-bottom: calc(env(safe-area-inset-bottom) + 120rpx);
|
||||
box-sizing: border-box;
|
||||
background: #f2f2f2;
|
||||
min-height: 100%;
|
||||
}
|
||||
|
||||
.m-form {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.m-form-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 10rpx 20rpx;
|
||||
|
||||
&.top {
|
||||
padding-top: 24rpx;
|
||||
align-items: start;
|
||||
}
|
||||
}
|
||||
|
||||
.m-form-label {
|
||||
min-width: 150rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.m-form-rig {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
|
||||
.m-form-inp {
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
|
||||
::v-deep {
|
||||
.u-input {
|
||||
height: 80rpx;
|
||||
}
|
||||
|
||||
.u-textarea {
|
||||
padding: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.m-form-switch {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.jcsb {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
// .m-form-textarea {
|
||||
// margin: 10rpx 0;
|
||||
// padding: 0;
|
||||
// }
|
||||
.clearfix::after {
|
||||
clear: both;
|
||||
content: " ";
|
||||
display: block;
|
||||
height: 0;
|
||||
line-height: 0;
|
||||
visibility: hidden;
|
||||
font-size: 0;
|
||||
}
|
||||
|
||||
// 隐藏库存
|
||||
.goodsPop {
|
||||
.info {
|
||||
.stock {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.empty_no {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 26rpx;
|
||||
}
|
||||
|
||||
.line-1 {
|
||||
display: -webkit-box !important;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
word-break: break-all;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical !important;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,13 @@
|
||||
const files = require.context("./modules", false, /\.js$/),
|
||||
api = {};
|
||||
|
||||
files.keys().forEach((key) => {
|
||||
const last = key.indexOf(".js"),
|
||||
name = key.slice(2, last);
|
||||
|
||||
api[name] = files(key).default;
|
||||
});
|
||||
|
||||
export default {
|
||||
...api,
|
||||
};
|
||||
@ -0,0 +1,181 @@
|
||||
import {
|
||||
request,
|
||||
uploadFile
|
||||
} from "@/utils/request";
|
||||
|
||||
export default {
|
||||
/**
|
||||
* 获取图片库
|
||||
*/
|
||||
getImages(data) {
|
||||
return request({
|
||||
url: "/common/getImages",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取商城信息
|
||||
*/
|
||||
getStoreDetail(data) {
|
||||
return request({
|
||||
url: "/store_setting/store_detail",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 上传图片视频
|
||||
*/
|
||||
upload(data) {
|
||||
return uploadFile(data);
|
||||
},
|
||||
orderCount(data) {
|
||||
return request({
|
||||
url: "/common/order-count",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取商品标签信息
|
||||
*/
|
||||
getLable(data) {
|
||||
return request({
|
||||
url: "/common/lable",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* isPhone
|
||||
*/
|
||||
isPhone(data) {
|
||||
return request({
|
||||
url: "/user/is-phone",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
|
||||
/**
|
||||
* 优惠券列表
|
||||
*/
|
||||
list(data) {
|
||||
return request({
|
||||
url: "/common/List",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
|
||||
/**
|
||||
* 获取门店列表
|
||||
* @param {String} longitude 经度
|
||||
* @param {String} latitude 纬度
|
||||
*/
|
||||
getShopList(data) {
|
||||
return request({
|
||||
url: "/common/getShopList",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 折扣信息
|
||||
*/
|
||||
discountsItem(data) {
|
||||
return request({
|
||||
url: "/common/discountsItem",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 折扣信息
|
||||
*/
|
||||
packageItem(data) {
|
||||
return request({
|
||||
url: "/common/packageItem",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 折扣信息
|
||||
*/
|
||||
redutionItem(data) {
|
||||
return request({
|
||||
url: "/common/redutionItem",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
|
||||
/**
|
||||
* wechatH5
|
||||
*/
|
||||
wechatH5(data) {
|
||||
return request({
|
||||
url: "/common/wechatH5",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
aliH5(data) {
|
||||
return request({
|
||||
url: "/common/aliH5",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
sendSms(data) {
|
||||
return request({
|
||||
url: "/common/sendSms",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
getFlashMch(data) {
|
||||
return request({
|
||||
url: "/common/FlashListMch",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
getFlashGoods(data) {
|
||||
return request({
|
||||
url: "/common/FlashListGoods",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
};
|
||||
@ -0,0 +1,39 @@
|
||||
import { request } from "@/utils/request";
|
||||
|
||||
export default {
|
||||
/**
|
||||
* 优惠券列表
|
||||
*/
|
||||
list(data) {
|
||||
return request({
|
||||
url: "/Coupon/List",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 领取优惠券
|
||||
*/
|
||||
getCoupon(data) {
|
||||
return request({
|
||||
url: "/Coupon/GetCoupon",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 已领取优惠券
|
||||
*/
|
||||
getUserCoupon(data) {
|
||||
return request({
|
||||
url: "/Coupon/GetUserCoupon",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
};
|
||||
@ -0,0 +1,16 @@
|
||||
import { request } from "@/utils/request";
|
||||
|
||||
export default {
|
||||
/**
|
||||
* 获取diy模板
|
||||
*/
|
||||
showTemplate(data) {
|
||||
return request({
|
||||
url: "/common/diy-show",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
};
|
||||
@ -0,0 +1,63 @@
|
||||
import { request } from "@/utils/request";
|
||||
|
||||
export default {
|
||||
/**
|
||||
* 获取轮播图设置
|
||||
*/
|
||||
getStoreSlideShowSetting(data) {
|
||||
return request({
|
||||
url: "/storeSetting/getStoreSlideShowSetting",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取分类导航设置
|
||||
*/
|
||||
getStoreNavSetting(data) {
|
||||
return request({
|
||||
url: "/storeSetting/GetStoreNavSetting",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取分类导航设置
|
||||
*/
|
||||
getCateGoods(data) {
|
||||
return request({
|
||||
url: "/storeSetting/GetCateGoods",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取门店分类&商品
|
||||
*/
|
||||
GetShopGoodsList(data) {
|
||||
return request({
|
||||
url: "/storeSetting/GetShopGoodsList",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取首页导航设置
|
||||
*/
|
||||
goodsClassify(data) {
|
||||
return request({
|
||||
url: "/goods/classify",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
};
|
||||
@ -0,0 +1,34 @@
|
||||
import { request } from "@/utils/request";
|
||||
|
||||
export default {
|
||||
/**
|
||||
* 当面付页面
|
||||
*/
|
||||
storeInfo(data) {
|
||||
return request({
|
||||
url: "/order/PaymentInfo",
|
||||
method: "POST",
|
||||
data,
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 当面付页面
|
||||
*/
|
||||
inpersonPaymentOrder(data) {
|
||||
return request({
|
||||
url: "/order/InpersonPaymentOrder",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
storeInfos(data) {
|
||||
return request({
|
||||
url: "/common/PaymentInfo",
|
||||
method: "POST",
|
||||
data,
|
||||
});
|
||||
},
|
||||
};
|
||||
@ -0,0 +1,33 @@
|
||||
import {
|
||||
request
|
||||
} from "@/utils/request";
|
||||
|
||||
export default {
|
||||
/**
|
||||
* 收银台页面
|
||||
* @param {String} order_no
|
||||
*/
|
||||
CheckStand(data) {
|
||||
return request({
|
||||
url: "/PayOrder/CheckStand",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 发起支付
|
||||
* @param {String} order_no
|
||||
* @param {String} pay_type // 1商城订单 2秒杀订单 3拼团订单
|
||||
* @param {String} order_type 1支付宝 2 微信 3余额 4货到付款
|
||||
*/
|
||||
OrderPayment(data) {
|
||||
return request({
|
||||
url: "/PayOrder/OrderPayment",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
};
|
||||
@ -0,0 +1,56 @@
|
||||
import { request } from "@/utils/request";
|
||||
|
||||
export default {
|
||||
/**
|
||||
* 获取列表
|
||||
* @param {String} shop_id
|
||||
*/
|
||||
getData(data) {
|
||||
return request({
|
||||
url: "/user/getPayCoupon",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
sendCoupon(data) {
|
||||
return request({
|
||||
url: "/user/sendCoupon",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
getCat(data) {
|
||||
return request({
|
||||
url: "/common/payCouponCatList",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
payCouponList(data) {
|
||||
return request({
|
||||
url: "/common/payCouponList",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
getCoupon(data) {
|
||||
return request({
|
||||
url: "/common/getPayCoupon",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
getBanner(data) {
|
||||
return request({
|
||||
url: "/common/getPayCouponBanner",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
};
|
||||
@ -0,0 +1,240 @@
|
||||
import {
|
||||
request
|
||||
} from "@/utils/request";
|
||||
export default {
|
||||
classify(data) {
|
||||
return request({
|
||||
url: "/book/client/classify/index",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
goodsList(data) {
|
||||
return request({
|
||||
url: "/book/client/goods/index",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
goodsShow(data) {
|
||||
return request({
|
||||
url: "/book/client/goods/show",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
staffList(data) {
|
||||
return request({
|
||||
url: "/book/client/common/index",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
staffShow(data) {
|
||||
return request({
|
||||
url: "/book/client/common/show",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
staffEvaluateList(data) {
|
||||
return request({
|
||||
url: "/book/client/common/evaluateList",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
getBookOrder(data) {
|
||||
return request({
|
||||
url: "/book/client/orders/getBookOrder",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
appointment_time(data) {
|
||||
return request({
|
||||
url: "/book/client/common/appointment_time",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
|
||||
PlaceOrder(data) {
|
||||
return request({
|
||||
url: "/book/client/orders/PlaceOrder",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
appointmenTime(data) {
|
||||
return request({
|
||||
url: "/book/client/common/appointment_time",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
userOrderList(data) {
|
||||
return request({
|
||||
url: "/book/client/orders/orderList",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
OrderEvaluate(data) {
|
||||
return request({
|
||||
url: "/book/client/orders/OrderEvaluate",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
orderCancel(data) {
|
||||
return request({
|
||||
url: "/book/client/orders/orderCancel",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
orderDetail(data) {
|
||||
return request({
|
||||
url: "/book/client/orders/orderDetail",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
orderDetails(data) {
|
||||
return request({
|
||||
url: "/book/client/orders/orderDetails",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
isStaff(data) {
|
||||
return request({
|
||||
url: "/book/client/staff/isStaff",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
StaffOrderList(data) {
|
||||
return request({
|
||||
url: "/book/client/orders/StaffOrderList",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
staffCenter(data) {
|
||||
return request({
|
||||
url: "/book/client/staff/staffCenter",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
takeOrder(data) {
|
||||
return request({
|
||||
url: "/book/client/orders/takeOrder",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
startOrder(data) {
|
||||
return request({
|
||||
url: "/book/client/orders/startOrder",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
completeOrder(data) {
|
||||
return request({
|
||||
url: "/book/client/orders/completeOrder",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
orderEvaluateList(data) {
|
||||
return request({
|
||||
url: "/book/client/orders/orderEvaluateList",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
goodsEvaluate(data) {
|
||||
return request({
|
||||
url: "/book/client/goods/evaluate",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
showBanner(data) {
|
||||
return request({
|
||||
url: "/book/client/index/show",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
broker(data) {
|
||||
return request({
|
||||
url: "/book/client/staff/broker",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
GetSkuList(data) {
|
||||
return request({
|
||||
url: "/book/client/orders/GetSkuList",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
noclient: true
|
||||
});
|
||||
},
|
||||
};
|
||||
@ -0,0 +1,25 @@
|
||||
import { request } from "@/utils/request";
|
||||
|
||||
export default {
|
||||
/**
|
||||
* 获取当前积分
|
||||
*/
|
||||
getIntegral() {
|
||||
return request({
|
||||
url: "/user/integral",
|
||||
method: "GET",
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取当前余额
|
||||
*/
|
||||
getBalance() {
|
||||
return request({
|
||||
url: "/user/balance",
|
||||
method: "GET",
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
};
|
||||
@ -0,0 +1,178 @@
|
||||
import {
|
||||
request
|
||||
} from "@/utils/request";
|
||||
|
||||
export default {
|
||||
// 登录
|
||||
login(data) {
|
||||
return request({
|
||||
url: "/auth/login",
|
||||
method: "POST",
|
||||
data,
|
||||
});
|
||||
},
|
||||
// 手机号注册
|
||||
regPhone(data) {
|
||||
return request({
|
||||
url: "/auth/regPhone",
|
||||
method: "POST",
|
||||
data,
|
||||
});
|
||||
},
|
||||
loginPhone(data) {
|
||||
return request({
|
||||
url: "/auth/loginPhone",
|
||||
method: "POST",
|
||||
data,
|
||||
});
|
||||
},
|
||||
// 测试登录
|
||||
testLogin(data) {
|
||||
return request({
|
||||
url: "/auth/testLogin",
|
||||
method: "POST",
|
||||
data,
|
||||
});
|
||||
},
|
||||
// 置换token
|
||||
resetToken(data) {
|
||||
return request({
|
||||
url: "/auth/resetToken",
|
||||
method: "POST",
|
||||
data,
|
||||
});
|
||||
},
|
||||
userInfo(data = {}) {
|
||||
return request({
|
||||
url: "/auth/user",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
userMobile(data = {}) {
|
||||
return request({
|
||||
url: "/user/userMobile",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
setMobile(data = {}) {
|
||||
return request({
|
||||
url: "/user/setMobile",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
setUserInfo(data = {}) {
|
||||
return request({
|
||||
url: "/user/SetUserInfo",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
UpdateUser(data = {}) {
|
||||
return request({
|
||||
url: "/user/UpdateUser",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
send(data = {}) {
|
||||
return request({
|
||||
url: "/user/send",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
bind_merge(data = {}) {
|
||||
return request({
|
||||
url: "/user/bind_merge",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
LevelInfo(data = {}) {
|
||||
return request({
|
||||
url: "/User/LevelInfo",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
GetLevelList(data = {}) {
|
||||
return request({
|
||||
url: "/User/GetLevelList",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
fix(data = {}) {
|
||||
return request({
|
||||
url: "/User/fix",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 访问记录
|
||||
*/
|
||||
log(data) {
|
||||
return request({
|
||||
url: "/user/log",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
isLogin(data = {}) {
|
||||
return request({
|
||||
url: "/auth/isLogin",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
taimiInfo(data = {}) {
|
||||
return request({
|
||||
url: "/user/taimiInfo",
|
||||
method: "GET",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
taimiSave(data = {}) {
|
||||
return request({
|
||||
url: "/user/taimiSave",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
taimiTongbu(data = {}) {
|
||||
return request({
|
||||
url: "/user/taimiTongbu",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
},
|
||||
createVip(data = {}) {
|
||||
return request({
|
||||
url: "/user/createVip",
|
||||
method: "POST",
|
||||
data,
|
||||
needLogin: true,
|
||||
});
|
||||
}
|
||||
};
|
||||
@ -0,0 +1,189 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="tabbar">
|
||||
<view :class="['item', index === select_index ? 'checked' : '']" v-for="(item, index) of tabbar" :key="index"
|
||||
@click="goUrl(item)">
|
||||
<image v-if="index === select_index" :src="item.pic_url_on" mode="aspectFill"></image>
|
||||
<image v-else :src="item.pic_url" mode="aspectFill"></image>
|
||||
<view :style="{ '--font_size': '12px' }" class="name">{{ item.name }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getTabbarIndex
|
||||
} from "@/utils/app";
|
||||
export default {
|
||||
name: 'the-tabbar',
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
select_index: 0,
|
||||
status: false,
|
||||
templateList: null,
|
||||
loading: true,
|
||||
vibrateShort: false
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
cartNum() {
|
||||
return this.$store.getters.cartNum;
|
||||
},
|
||||
tabbar() {
|
||||
const tabImage = this.$store.state.$Gimage.tab || {}
|
||||
return [
|
||||
{
|
||||
name: "首页",
|
||||
link: "pages/index/index",
|
||||
pic_url: tabImage.index,
|
||||
pic_url_on: tabImage.index_active,
|
||||
},
|
||||
{
|
||||
name: "我的",
|
||||
link: "pages/my/my",
|
||||
pic_url: tabImage.user,
|
||||
pic_url_on: tabImage.user_active,
|
||||
},
|
||||
]
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getTemplate();
|
||||
// console.log('this.$store.getters.cartNum11111111111111111', this.$store.getters.cartNum)
|
||||
},
|
||||
methods: {
|
||||
async getTemplate() {
|
||||
uni.showLoading({
|
||||
title: "请稍等",
|
||||
mask: true,
|
||||
});
|
||||
try {
|
||||
const res = await this.$api.diy.showTemplate({
|
||||
type: 2
|
||||
});
|
||||
uni.hideLoading();
|
||||
if (res.code) return uni.$u.toast(res.message);
|
||||
this.status = res.data ? res.data.data[0].status : 0;
|
||||
this.templateList = res.data.data[0];
|
||||
|
||||
if (res.data.data[0].vibrateShort) {
|
||||
this.vibrateShort = true
|
||||
}
|
||||
|
||||
this.getTabbar();
|
||||
this.loading = false
|
||||
} catch (e) {
|
||||
uni.hideLoading();
|
||||
throw new Error(e);
|
||||
}
|
||||
},
|
||||
goUrl(item) {
|
||||
// uni.setStorageSync("sharePage", item);
|
||||
|
||||
// #ifdef MP
|
||||
if (this.vibrateShort) {
|
||||
uni.vibrateShort({
|
||||
success: function () {
|
||||
console.log('success');
|
||||
}
|
||||
});
|
||||
}
|
||||
// #endif
|
||||
|
||||
uni.switchTab({
|
||||
url: `/${item.link}`,
|
||||
});
|
||||
},
|
||||
goDiyUrl(item) {
|
||||
uni.setStorageSync("sharePage", item);
|
||||
this.toLinkUrl(item.link)
|
||||
},
|
||||
getTabbar() {
|
||||
// this.select_index =
|
||||
this.getTabbarIndex();
|
||||
},
|
||||
getTabbarIndex() {
|
||||
|
||||
const routes = getCurrentPages(),
|
||||
last = routes[routes.length - 1]
|
||||
// var static_index = 0
|
||||
var that = this
|
||||
// console.log(last.$page.fullPath, 'lastlastlast')
|
||||
// console.log(this.status, 'this.status')
|
||||
|
||||
if (this.status) {
|
||||
this.templateList.list.forEach((item, index) => {
|
||||
if (last.$page.fullPath == item.link.link) {
|
||||
that.select_index = index
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.tabbar.forEach((item, index) => {
|
||||
if (last.$page.fullPath == '/' + item.link) {
|
||||
that.select_index = index
|
||||
}
|
||||
})
|
||||
}
|
||||
// return static_index;
|
||||
},
|
||||
},
|
||||
onReachBottom() { },
|
||||
onPullDownRefresh() { },
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.tabbar {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
z-index: 9;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-around;
|
||||
width: 100%;
|
||||
background: #fff;
|
||||
padding-bottom: 0;
|
||||
padding-bottom: calc(constant(safe-area-inset-bottom));
|
||||
padding-bottom: calc(env(safe-area-inset-bottom));
|
||||
box-shadow: 0 0.3125rem 1.25rem 0px rgba(166, 199, 251, 0.12);
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
width: 25%;
|
||||
height: 100rpx;
|
||||
position: relative;
|
||||
|
||||
.box {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 36rpx;
|
||||
}
|
||||
|
||||
&.checked {
|
||||
.name {
|
||||
color: #f0250e;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
image {
|
||||
display: block;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
|
||||
.name {
|
||||
height: 40rpx;
|
||||
line-height: 40rpx;
|
||||
font-size: var(--font_size);
|
||||
color: #666;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,138 @@
|
||||
<template>
|
||||
<view>
|
||||
<slot v-if="phone"></slot>
|
||||
<u-popup zIndex="9999999999" style="z-index: 9999999999;" v-else show mode="center" closeable @close="back">
|
||||
<view class="tipPopup" v-if="!phone">
|
||||
|
||||
<h3>提示</h3>
|
||||
|
||||
<u--text margin="12px 0 12px 0" text="当前账号未绑定手机号" type="info"></u--text>
|
||||
|
||||
<!-- <view class="btns">
|
||||
<view class="btn" @click="back">
|
||||
<view>
|
||||
返回
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="btn1" @click="toUrl('/subPackages/user/user-mobile')">
|
||||
<view>
|
||||
前往绑定
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
<view>
|
||||
<view class="btn1" @click="toUrl('/subPackages/user/user-mobile')">
|
||||
<view>
|
||||
前往绑定
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</u-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
phone: true
|
||||
}
|
||||
},
|
||||
created() {
|
||||
uni.$on('changePhone', res => {
|
||||
console.log(res, '接收到的参数')
|
||||
this.phone = res
|
||||
})
|
||||
|
||||
this.getInfo()
|
||||
},
|
||||
methods: {
|
||||
async getInfo() {
|
||||
const res = await this.$api.common.isPhone();
|
||||
this.phone = !!res.data
|
||||
},
|
||||
back() {
|
||||
uni.navigateBack();
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.tipPopup {
|
||||
width: 90vw;
|
||||
margin: auto;
|
||||
// border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
box-sizing: border-box;
|
||||
|
||||
padding: 36rpx;
|
||||
|
||||
background-color: #fff;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.btn {
|
||||
margin: 0 20rpx;
|
||||
margin-top: 40rpx;
|
||||
font-weight: 600;
|
||||
|
||||
view {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 22rpx;
|
||||
color: white;
|
||||
border-radius: 100px;
|
||||
background: linear-gradient(to left, #ff2c2c, #ff4e4e);
|
||||
transition: .24s;
|
||||
background-size: 1000% 1000%;
|
||||
transition: all .2s ease;
|
||||
animation: Gradient 40s linear infinite;
|
||||
|
||||
&:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn1 {
|
||||
margin: 0 20rpx;
|
||||
margin-top: 40rpx;
|
||||
font-weight: 600;
|
||||
|
||||
view {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 22rpx;
|
||||
color: white;
|
||||
border-radius: 100px;
|
||||
transition: .24s;
|
||||
background: linear-gradient(-45deg, #448bff, #44e9ff, #ee7752, #e73c7e, #23a6d5, #23d5ab);
|
||||
background: linear-gradient(to left, #ff2c2c, #ff4e4e);
|
||||
background-size: 1000% 1000%;
|
||||
transition: all .2s ease;
|
||||
animation: Gradient 40s linear infinite;
|
||||
|
||||
&:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btns {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 2fr;
|
||||
}
|
||||
|
||||
/deep/ {
|
||||
.u-fade-enter-active {
|
||||
background-color: rgba(0, 0, 0, 0.1) !important;
|
||||
filter: blur(100px);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,95 @@
|
||||
<template>
|
||||
<view class="number-step">
|
||||
<view :class="['action', value <= min ? 'disabled' : '']" @click="reduceAction">
|
||||
<text>-</text>
|
||||
</view>
|
||||
<view class="number-block">
|
||||
<input class="number-input" type="number" :value="value" @blur="numberInputChange" :disabled="disabled" />
|
||||
</view>
|
||||
<view :class="['action', disabled ? 'disabled' : '']" @click="addAction">
|
||||
<text>+</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
value: {
|
||||
type: [Number, String],
|
||||
default: 0,
|
||||
},
|
||||
min: {
|
||||
type: Number,
|
||||
default: 0,
|
||||
},
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
numberInputChange(e) {
|
||||
this.$emit("input", e.target.value);
|
||||
},
|
||||
addAction() {
|
||||
if (this.disabled) return;
|
||||
this.$emit("input", this.value + 1);
|
||||
},
|
||||
reduceAction() {
|
||||
if (this.disabled) return;
|
||||
this.$emit("input", this.value - 1);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.number-step {
|
||||
border: 1px solid #f2f2f2;
|
||||
border-radius: 10rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.action {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 60rpx;
|
||||
position: relative;
|
||||
font-weight: bold;
|
||||
|
||||
text {
|
||||
position: relative;
|
||||
top: -3rpx;
|
||||
}
|
||||
|
||||
.disabled {
|
||||
color: #cccccc;
|
||||
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
|
||||
.number-block {
|
||||
width: 70rpx;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.number-input {
|
||||
border-left: 1px solid #f2f2f2;
|
||||
border-right: 1px solid #f2f2f2;
|
||||
width: 100%;
|
||||
height: 60rpx;
|
||||
font-size: 24rpx;
|
||||
font-weight: 600;
|
||||
color: #262626;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,15 @@
|
||||
const env = {
|
||||
host: "https://saasdemo.byin.vip",
|
||||
NETWORK_TIME_OUT: 15000,
|
||||
version: "0.1",
|
||||
store_id: 1,
|
||||
mini_id: 0
|
||||
};
|
||||
// #ifdef H5
|
||||
// 生产环境
|
||||
if (process.env.NODE_ENV === 'production') {
|
||||
// TODO
|
||||
env.host = `${window.location.origin}`
|
||||
}
|
||||
// #endif
|
||||
export default env;
|
||||
@ -0,0 +1,20 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<script>
|
||||
var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') ||
|
||||
CSS.supports('top: constant(a)'))
|
||||
document.write(
|
||||
'<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
|
||||
(coverSupport ? ', viewport-fit=cover' : '') + '" />')
|
||||
</script>
|
||||
<title></title>
|
||||
<!--preload-links-->
|
||||
<!--app-context-->
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"><!--app-html--></div>
|
||||
<script type="module" src="/main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@ -0,0 +1,52 @@
|
||||
import App from "./App";
|
||||
import Vue from "vue";
|
||||
import mixin from "@/mixin/index.js";
|
||||
import utils from "@/utils/utils.js";
|
||||
import api from "@/api/index.js";
|
||||
import store from "@/store/index.js";
|
||||
import uView from "@/uni_modules/uview-ui";
|
||||
/* #ifdef H5 */
|
||||
import {
|
||||
h5init
|
||||
} from "@/utils/h5init";
|
||||
h5init()
|
||||
/* #endif */
|
||||
|
||||
const globalInformation = new Promise(async (resolve) => {
|
||||
resolve({
|
||||
image: await api.common.getImages(),
|
||||
storeDetail: await api.common.getStoreDetail(),
|
||||
})
|
||||
}).catch(e => {
|
||||
console.log(e);
|
||||
})
|
||||
|
||||
globalInformation.then(({
|
||||
image,
|
||||
storeDetail
|
||||
}) => {
|
||||
store.dispatch("setData", {
|
||||
key: "$Gimage",
|
||||
val: image.data
|
||||
})
|
||||
|
||||
store.dispatch("setData", {
|
||||
key: "$GstoreDetail",
|
||||
val: storeDetail.data
|
||||
})
|
||||
})
|
||||
|
||||
Vue.use(uView);
|
||||
Vue.mixin(mixin);
|
||||
Vue.config.productionTip = false;
|
||||
App.mpType = "app";
|
||||
|
||||
Vue.prototype.$utils = utils;
|
||||
Vue.prototype.$api = api;
|
||||
|
||||
const app = new Vue({
|
||||
store,
|
||||
...App,
|
||||
});
|
||||
|
||||
app.$mount();
|
||||
@ -0,0 +1,8 @@
|
||||
<template>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
@ -0,0 +1,3 @@
|
||||
{
|
||||
|
||||
}
|
||||
@ -0,0 +1,110 @@
|
||||
{
|
||||
"pages": [
|
||||
{
|
||||
"path": "pages/index/index",
|
||||
"style": {
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarTitleText": "首页",
|
||||
"enablePullDownRefresh": true,
|
||||
"mp-alipay": {
|
||||
"transparentTitle": "always",
|
||||
"titlePenetrate": "YES"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/my/my",
|
||||
"style": {
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarTitleText": "我的",
|
||||
"enablePullDownRefresh": true,
|
||||
"mp-alipay": {
|
||||
"transparentTitle": "always",
|
||||
"titlePenetrate": "YES"
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
"subPackages": [
|
||||
{
|
||||
"root": "subPackages/login",
|
||||
"pages": [
|
||||
// #ifndef MP
|
||||
{
|
||||
"path": "reg/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "注册"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "reg/reset",
|
||||
"style": {
|
||||
"navigationBarTitleText": "找回密码"
|
||||
}
|
||||
},
|
||||
// #endif
|
||||
{
|
||||
"path": "login/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "登录"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "forgotPassword/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "忘记密码"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "forgotPassword/nuxt",
|
||||
"style": {
|
||||
"navigationBarTitleText": "忘记密码"
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"root": "subPackages/inPersonToPay",
|
||||
"pages": [
|
||||
{
|
||||
"path": "index/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "当面付"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "result/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "支付成功"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"globalStyle": {
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarTitleText": "uni-app",
|
||||
"navigationBarBackgroundColor": "#ffffff",
|
||||
"backgroundColor": "#ffffff",
|
||||
"h5": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
"uniIdRouter": {},
|
||||
"tabBar": {
|
||||
"color": "#2E2D2D",
|
||||
"selectedColor": "#E2231A",
|
||||
"borderStyle": "black",
|
||||
"backgroundColor": "#fff",
|
||||
"list": [
|
||||
{
|
||||
"pagePath": "pages/index/index",
|
||||
"text": "首页"
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/my/my",
|
||||
"text": "我的"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,79 @@
|
||||
<template>
|
||||
<view class="tabbar-page page-box" style="position: relative;display: flex;align-items: center;">
|
||||
<view style="display: flex;flex-direction: column;align-items: center;width: 100%;">
|
||||
<view>
|
||||
<image style="width: 200rpx;height: 200rpx;border-radius: 20rpx;" :src="storeDetail.logo_url"></image>
|
||||
</view>
|
||||
<view style="margin-top: 20rpx;">
|
||||
{{ storeDetail.name }}
|
||||
</view>
|
||||
</view>
|
||||
<theTabBar></theTabBar>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import theTabBar from "@/components/the/the-tabbar";
|
||||
export default {
|
||||
mixins: [],
|
||||
components: {
|
||||
theTabBar
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
onLoad(opt) {
|
||||
uni.hideTabBar({
|
||||
animation: true,
|
||||
success: function (res) {
|
||||
console.log(res); // { "success": true}
|
||||
},
|
||||
fail: function (err) {
|
||||
console.log(err);
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
computed: {
|
||||
shareData() {
|
||||
return {
|
||||
path: "/pages/index/index",
|
||||
desc: "多彩时尚，一站式购物体验"
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
async onPullDownRefresh() {
|
||||
|
||||
},
|
||||
|
||||
//发送给朋友
|
||||
onShareAppMessage(res) {
|
||||
|
||||
},
|
||||
|
||||
onReachBottom() {
|
||||
this.on_reach_bottom = true;
|
||||
},
|
||||
onPullDownRefresh() {
|
||||
this.getTemplate();
|
||||
setTimeout(function() {
|
||||
uni.stopPullDownRefresh();
|
||||
}, 200);
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
// #ifndef H5
|
||||
.content {
|
||||
padding-top: calc(44px + var(--status-bar-height));
|
||||
}
|
||||
|
||||
// #endif
|
||||
</style>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 7.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.3 KiB |
@ -0,0 +1,772 @@
|
||||
<template>
|
||||
<view class="tabbar-page page-box" style="background-color: white;">
|
||||
<view v-if="templateInfo">
|
||||
<!-- #ifdef MP -->
|
||||
<template v-if="control.titleStyle">
|
||||
<template v-if="control.titleStyle.title_type == 0">
|
||||
<view :style="{
|
||||
paddingTop: statusBarHeight + 'px',
|
||||
height: headHeight + 'px',
|
||||
backgroundColor: control.titleStyle.title_background_color,
|
||||
backgroundImage: control.titleStyle.backgroundImage,
|
||||
fontSize: control.titleStyle.font_size / 2 + 'px',
|
||||
color: control.titleStyle.font_color,
|
||||
textAlign: 'center',
|
||||
lineHeight: headHeight + 'px',
|
||||
position: 'fixed',
|
||||
width: '100%',
|
||||
left: 0,
|
||||
top: 0,
|
||||
zIndex: 10
|
||||
}">
|
||||
{{ control.titleStyle.show_title ? control.titleStyle.name : '' }}
|
||||
</view>
|
||||
<!-- 占位高度 -->
|
||||
<view :style="{ height: statusBarHeight + headHeight + 'px' }"></view>
|
||||
</template>
|
||||
</template>
|
||||
<!-- #endif -->
|
||||
<!-- #ifndef MP-->
|
||||
<!-- <view class="status" v-if="control.titleStyle && control.titleStyle.title_type == 0"
|
||||
:style="{ backgroundColor: control.titleStyle.title_background_color }"></view>
|
||||
<view class="navTitle" v-if="control.titleStyle && control.titleStyle.title_type == 0"
|
||||
:style="{ backgroundColor: control.titleStyle.title_background_color, fontSize: control.titleStyle.font_size / 2 + 'px', color: control.titleStyle.font_color }">
|
||||
{{ control.titleStyle.name }}
|
||||
</view> -->
|
||||
<!-- #endif -->
|
||||
<!-- 用户头部 -->
|
||||
<view :class="ifMP ? '' : 'content'"></view>
|
||||
|
||||
<view style="border-radius: 0 0 40rpx 40rpx;overflow: hidden;"
|
||||
:style="{ background: control.user.userBgType == 2 ? `url(${control.user.userBgImg})` : control.user.userBgColor, }">
|
||||
<view class="user-box" style="background: transparent;">
|
||||
<view class="user-info" style="justify-content: space-between;width: 100%;"
|
||||
v-if="data.user_info && data.user_info.id">
|
||||
<view class="user-info" @click="triggerUsertoeditpop">
|
||||
<view class="user-logo">
|
||||
<u-image width="100rpx" height="100rpx" :src="data.user_info.avatar_pic"></u-image>
|
||||
</view>
|
||||
<view style="text-align: left;">
|
||||
<view style="display: flex;"
|
||||
:style="{ color: control.user.color, fontSize: control.user.font_size / 2 + 'px' }">
|
||||
{{
|
||||
data.user_info.nickname }}
|
||||
<u--text type="warning" size="12" margin="0px 0px 0px 10rpx" suffixIcon="edit-pen"
|
||||
iconStyle="color: #ff9900"></u--text>
|
||||
</view>
|
||||
<!-- <u--text type="warning" size="12" text="编辑用户信息" suffixIcon="edit-pen"
|
||||
iconStyle="color: #ff9900"></u--text> -->
|
||||
</view>
|
||||
</view>
|
||||
<!-- #ifndef MP -->
|
||||
<view style="font-size: 26rpx;height: 140rpx;">
|
||||
<view style="display: flex;align-items: center;flex-direction: column;" @click="logout">
|
||||
<u-icon name="info-circle" size="32rpx" color="#FFF"></u-icon>
|
||||
<view>
|
||||
注销
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
<view class="user-info" v-else>
|
||||
<view class="user-logo">
|
||||
<u-icon size="40" name="account-fill"></u-icon>
|
||||
</view>
|
||||
<view @click="toUrl('/subPackages/login/login/index')">
|
||||
<view :style="{ color: control.user.color, fontSize: control.user.font_size / 2 + 'px' }">
|
||||
登录/注册
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="border-radius: 20rpx 20rpx 20rpx 20rpx;overflow: hidden;" class="wallet-box"
|
||||
v-if="templateInfo.userInfo && templateInfo.userInfo.walletShow && data.user_info">
|
||||
|
||||
<view class="wallet-title">
|
||||
<u-image v-show="templateInfo.userInfo.walletImage" style="width: 16px;height: 16px;"
|
||||
class="img" width="16px" height="16px" :src="templateInfo.userInfo.walletImage"></u-image>
|
||||
{{ templateInfo.userInfo.walletName }}
|
||||
</view>
|
||||
<view class="wallet-list" v-if="templateInfo.userInfo.walletList"
|
||||
:style="{ 'grid-template-columns': `repeat(${(templateInfo.userInfo.walletList.length)} , 1fr)` }">
|
||||
<view v-for="(item, index) in templateInfo.userInfo.walletList" :key="index" class="item"
|
||||
@click="toUrl(item.link)">
|
||||
<view class="price" style="text-align: center;">
|
||||
{{ data.user_info[item.key] || 0 }}
|
||||
</view>
|
||||
<view class="text">
|
||||
<view v-show="item.pic_url" style="width: 14px;height: 14px;margin-right: 8rpx;">
|
||||
<u-image v-show="item.pic_url" class="img" width="14px" height="14px"
|
||||
:src="item.pic_url"></u-image>
|
||||
</view>
|
||||
{{ item.name }}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="!templateInfo && isTemplate">
|
||||
<view :style="{
|
||||
paddingTop: statusBarHeight + 'px',
|
||||
height: headHeight + 'px',
|
||||
backgroundColor: '#f0250e',
|
||||
fontSize: '16px',
|
||||
color: '#fff',
|
||||
textAlign: 'center',
|
||||
lineHeight: headHeight + 'px',
|
||||
position: 'fixed',
|
||||
width: '100%',
|
||||
left: 0,
|
||||
top: 0,
|
||||
zIndex: 10
|
||||
}">
|
||||
个人中心
|
||||
</view>
|
||||
<!-- 占位高度 -->
|
||||
<view :style="{ height: statusBarHeight + headHeight + 'px' }"></view>
|
||||
|
||||
<!-- 用户头部 -->
|
||||
<view class="user-box">
|
||||
<view class="user-info" v-if="data.user_info && data.user_info.id" @click="userToEditPop = true">
|
||||
<view class="user-logo">
|
||||
<u-image width="100rpx" height="100rpx" :src="data.user_info.avatar_pic"></u-image>
|
||||
</view>
|
||||
<view>
|
||||
<view>{{ data.user_info.nickname }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="user-info" v-else>
|
||||
<view class="user-logo">
|
||||
<u-icon size="40" name="account-fill"></u-icon>
|
||||
</view>
|
||||
<view @click="toUrl('/subPackages/login/login/index')">
|
||||
<view>登录/注册</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<theTabBar></theTabBar>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
||||
<script>
|
||||
import theTabBar from "@/components/the/the-tabbar";
|
||||
export default {
|
||||
mixins: [],
|
||||
components: {
|
||||
theTabBar
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
data: {
|
||||
user_info: null,
|
||||
},
|
||||
templateInfo: null,
|
||||
control: {},
|
||||
statusBarHeight: uni.getStorageSync('statusBarHeight'),
|
||||
headHeight: uni.getStorageSync('headHeight'),
|
||||
user_infoTemporary: {
|
||||
avatarUrl: "",
|
||||
nickname: "",
|
||||
},
|
||||
fileList: [],
|
||||
userToEditPop: false,
|
||||
userToEditPopA: false,
|
||||
|
||||
ifMP: false,
|
||||
isTemplate: false,
|
||||
order_count: null,
|
||||
pictureUpload: false
|
||||
};
|
||||
},
|
||||
onLoad(params) {
|
||||
uni.hideTabBar({
|
||||
animation: true,
|
||||
success: function (res) {
|
||||
console.log(res); // { "success": true}
|
||||
},
|
||||
fail: function (err) {
|
||||
console.log(err);
|
||||
}
|
||||
});
|
||||
uni.hideTabBar();
|
||||
// #ifdef MP
|
||||
this.ifMP = true;
|
||||
// #endif
|
||||
},
|
||||
onShow() {
|
||||
this.getData();
|
||||
this.getTemplate();
|
||||
this.getOrderCount()
|
||||
},
|
||||
computed: {
|
||||
storeDetail() {
|
||||
return this.$store.state.$GstoreDetail || {}
|
||||
},
|
||||
shareData() {
|
||||
return {
|
||||
path: "/pages/my/my",
|
||||
title: "我的",
|
||||
desc: "用户中心"
|
||||
}
|
||||
}
|
||||
},
|
||||
onPullDownRefresh() {
|
||||
this.getData();
|
||||
this.getTemplate();
|
||||
this.getOrderCount()
|
||||
setTimeout(function() {
|
||||
uni.stopPullDownRefresh();
|
||||
}, 200);
|
||||
},
|
||||
methods: {
|
||||
async getTemplate() {
|
||||
uni.showLoading({
|
||||
title: "请稍等",
|
||||
mask: true,
|
||||
});
|
||||
try {
|
||||
const res = await this.$api.diy.showTemplate({
|
||||
type: 3
|
||||
});
|
||||
uni.hideLoading();
|
||||
if (res.code) return uni.$u.toast(res.message);
|
||||
this.templateInfo = res.data.data[0];
|
||||
|
||||
if (this.templateInfo?.userInfo?.walletList) {
|
||||
this.templateInfo.userInfo.walletList = this.templateInfo.userInfo.walletList.filter(item =>
|
||||
item.show)
|
||||
}
|
||||
|
||||
if (this.templateInfo?.aliMembershipCardInfo) {
|
||||
this.templateInfo.aliMembershipCardInfo = this.templateInfo.aliMembershipCardInfo || {}
|
||||
}
|
||||
|
||||
this.control = res.data.data[1];
|
||||
|
||||
if (this.control.showTools === undefined) {
|
||||
this.control.showTools = true
|
||||
}
|
||||
} catch (e) {
|
||||
uni.hideLoading();
|
||||
// throw new Error(e);
|
||||
}
|
||||
this.isTemplate = true
|
||||
},
|
||||
async getData() {
|
||||
try {
|
||||
const res = await this.$api.user.userInfo();
|
||||
|
||||
if (!res.data.user_info) {
|
||||
return
|
||||
}
|
||||
|
||||
this.data.user_info = res.data.user_info;
|
||||
|
||||
if (!this.user_infoTemporary.avatarUrl) {
|
||||
this.user_infoTemporary.avatarUrl = res.data.user_info.avatar_pic
|
||||
this.user_infoTemporary.nickname = res.data.user_info.nickname
|
||||
}
|
||||
|
||||
// 第一次完善信息
|
||||
if (res.data.user_info.is_update_user === 0 && this.storeDetail.display_setting && this.storeDetail
|
||||
.display_setting.wx_user_info == 1) {
|
||||
this.userToEditPopA = true
|
||||
this.user_infoTemporary.avatarUrl = ""
|
||||
this.user_infoTemporary.nickname = ""
|
||||
}
|
||||
} catch (e) {
|
||||
// throw new Error(e);
|
||||
}
|
||||
},
|
||||
async getOrderCount() {
|
||||
try {
|
||||
const res = await this.$api.common.orderCount();
|
||||
if (res.code == 0) {
|
||||
this.order_count = res.data
|
||||
}
|
||||
} catch (e) {
|
||||
console.log(e, 'eeeee')
|
||||
// throw new Error(e);
|
||||
}
|
||||
},
|
||||
// 选择头像弹出
|
||||
triggerUsertoeditpop() {
|
||||
this.user_infoTemporary.avatarUrl = this.data.user_info.avatar_pic
|
||||
this.user_infoTemporary.nickname = this.data.user_info.nickname
|
||||
this.userToEditPop = true
|
||||
},
|
||||
// 微信选择头像
|
||||
async onChooseAvatar(e) {
|
||||
this.user_infoTemporary.avatarUrl = await this.uploadFilePromise(e.detail.avatarUrl)
|
||||
},
|
||||
// 新增图片
|
||||
async afterRead(event) {
|
||||
this.user_infoTemporary.avatarUrl = await this.uploadFilePromise(event.file.url)
|
||||
},
|
||||
|
||||
async uploadFilePromise(filePath) {
|
||||
this.pictureUpload = true
|
||||
const result = await this.$api.common.upload({
|
||||
filePath: filePath,
|
||||
name: "image",
|
||||
})
|
||||
|
||||
setTimeout(() => {
|
||||
this.pictureUpload = false
|
||||
|
||||
}, 1000);
|
||||
return result.data.url
|
||||
},
|
||||
|
||||
getNickname(e) {
|
||||
this.user_infoTemporary.nickname = e
|
||||
},
|
||||
|
||||
// 保存用户数据
|
||||
async userToEdit() {
|
||||
if (this.user_infoTemporary.nickname.trim() == "") {
|
||||
this.$u.toast("请输入昵称")
|
||||
|
||||
return
|
||||
}
|
||||
|
||||
const res = this.$api.user.UpdateUser({
|
||||
avatar_pic: this.user_infoTemporary.avatarUrl,
|
||||
nickname: this.user_infoTemporary.nickname,
|
||||
})
|
||||
|
||||
if (!res.code) {
|
||||
this.userToEditPop = false
|
||||
this.userToEditPopA = false
|
||||
this.data.user_info.avatar_pic = this.user_infoTemporary.avatarUrl
|
||||
this.data.user_info.nickname = this.user_infoTemporary.nickname
|
||||
uni.$u.toast('保存成功');
|
||||
}
|
||||
},
|
||||
logout() {
|
||||
let that = this
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '是否确认注销？',
|
||||
success(res) {
|
||||
if (res.confirm) {
|
||||
uni.removeStorageSync("token");
|
||||
uni.removeStorageSync("user_info");
|
||||
that.getData();
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.taimi-box {
|
||||
background: #1F222C;
|
||||
margin: 10rpx;
|
||||
padding: 20rpx;
|
||||
border-radius: 16rpx;
|
||||
color: #8E827A;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.taimi-icon {
|
||||
height: 70rpx;
|
||||
width: 70rpx;
|
||||
background: #595B65;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.taimi-but {
|
||||
background: #E7BD9C;
|
||||
padding: 10rpx 20rpx;
|
||||
color: #1F222C;
|
||||
font-size: 24rpx;
|
||||
border-radius: 30rpx;
|
||||
}
|
||||
}
|
||||
|
||||
// #ifndef H5
|
||||
.content {
|
||||
padding-top: calc(44px + var(--status-bar-height));
|
||||
}
|
||||
|
||||
// #endif
|
||||
|
||||
.status {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
z-index: 10;
|
||||
height: var(--status-bar-height);
|
||||
}
|
||||
|
||||
.navTitle {
|
||||
height: 44px;
|
||||
line-height: 44px;
|
||||
margin-top: var(--status-bar-height);
|
||||
text-align: center;
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.tabbar-page {
|
||||
background: #f2f2f2;
|
||||
}
|
||||
|
||||
.menu-item-box {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
grid-gap: 24rpx;
|
||||
gap: 24rpx;
|
||||
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
margin-top: 26rpx;
|
||||
|
||||
.menu-item {
|
||||
// width: 20%;
|
||||
font-size: 24rpx;
|
||||
// margin-bottom: 22rpx;
|
||||
|
||||
.menu-item-image {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-bottom: 14rpx;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
view {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.user-box {
|
||||
height: 200rpx;
|
||||
background: #f0250e;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
// align-items: center;
|
||||
padding: 10rpx 20rpx;
|
||||
background-position: top left;
|
||||
background-size: cover;
|
||||
box-shadow: 0 0.3125rem 1.25rem 20px rgba(166, 199, 251, 0.12);
|
||||
|
||||
.user-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #fff;
|
||||
font-size: 40rpx;
|
||||
|
||||
.user-logo {
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
border-radius: 50%;
|
||||
background: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-right: 20rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.order-box {
|
||||
margin: 30rpx 20rpx;
|
||||
padding: 20rpx;
|
||||
border-radius: 10rpx;
|
||||
border-radius: 20rpx;
|
||||
background: #fff;
|
||||
box-shadow: 0 0.3125rem 1.25rem 0px rgba(188, 188, 188, 0.16);
|
||||
|
||||
.order-title {
|
||||
// font-size: 28rpx;
|
||||
// font-weight: bold;
|
||||
// border-bottom: 1px solid #eee;
|
||||
// padding-bottom: 20rpx;
|
||||
// display: none;
|
||||
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
// border-bottom: 1px solid #eee;
|
||||
box-shadow: 0 0.3125rem 1.25rem 0px rgba(166, 199, 251, 0.12);
|
||||
padding-bottom: 20rpx;
|
||||
|
||||
margin: -30rpx -20rpx;
|
||||
padding: 30rpx 20rpx;
|
||||
margin-bottom: 26rpx;
|
||||
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
.more {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
|
||||
.order-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 20rpx 0;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(5, 1fr);
|
||||
grid-gap: 24rpx;
|
||||
gap: 24rpx;
|
||||
|
||||
.item {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
|
||||
.box {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.text {
|
||||
display: inline-flex;
|
||||
margin-top: 10rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.menu-box {
|
||||
padding: 20rpx;
|
||||
border-radius: 10rpx;
|
||||
background: #fff;
|
||||
margin: 30rpx 20rpx;
|
||||
box-shadow: 0 0.3125rem 1.25rem 0px rgba(188, 188, 188, 0.16);
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.menu-title {
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
// border-bottom: 1px solid #eee;
|
||||
box-shadow: 0 0.3125rem 1.25rem 0px rgba(166, 199, 251, 0.12);
|
||||
padding-bottom: 20rpx;
|
||||
|
||||
margin: -30rpx -20rpx;
|
||||
padding: 30rpx 20rpx;
|
||||
margin-bottom: 26rpx;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
/deep/ {
|
||||
.u-badge--error {
|
||||
background: linear-gradient(90deg, #ff1e00 0%, #fc754c 100%);
|
||||
}
|
||||
}
|
||||
|
||||
.userToEditPop {
|
||||
padding: 20rpx 60rpx 0rpx;
|
||||
|
||||
/deep/ {
|
||||
.u-input {
|
||||
border: 1px solid rgb(236, 236, 236) !important;
|
||||
border-radius: 100px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.avatar-wrapper {
|
||||
padding: 0;
|
||||
width: 56px !important;
|
||||
height: 56px !important;
|
||||
border-radius: 100rpx;
|
||||
margin-top: 40rpx !important;
|
||||
margin-bottom: 40rpx !important;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
|
||||
position: relative;
|
||||
|
||||
.pictureUpload {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 999;
|
||||
background: #ffffffb8;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
.weui-input {
|
||||
border-radius: 100px !important;
|
||||
border: 1px solid #ececec !important;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
display: block;
|
||||
width: 56px;
|
||||
height: 56px;
|
||||
box-shadow: 0 0.3125rem 1.25rem 20px rgba(166, 199, 251, 0.12);
|
||||
border-radius: 100px !important;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
|
||||
.userToEditPopA {
|
||||
padding: 40rpx 40rpx 30rpx;
|
||||
width: 80vw;
|
||||
box-sizing: border-box;
|
||||
|
||||
/deep/ {
|
||||
.u-input {
|
||||
border: 1px solid rgb(236, 236, 236) !important;
|
||||
border-radius: 100px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.avatar-wrapper {
|
||||
padding: 0;
|
||||
width: 56px !important;
|
||||
height: 56px !important;
|
||||
border-radius: 100rpx;
|
||||
margin-top: 40rpx !important;
|
||||
margin-bottom: 30rpx !important;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
|
||||
position: relative;
|
||||
|
||||
.pictureUpload {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 999;
|
||||
background: #ffffffb8;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
.weui-input {
|
||||
border-radius: 100px !important;
|
||||
border: 1px solid #ececec !important;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
display: block;
|
||||
width: 56px;
|
||||
height: 56px;
|
||||
box-shadow: 0 0.3125rem 1.25rem 20px rgba(166, 199, 251, 0.12);
|
||||
border-radius: 100px !important;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
width: 100%;
|
||||
padding: 42rpx 0 24rpx;
|
||||
background: #fff;
|
||||
box-sizing: border-box;
|
||||
|
||||
transition: all 1s cubic-bezier(0.075, 0.82, 0.165, 1);
|
||||
|
||||
&:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
view {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 76rpx;
|
||||
background: linear-gradient(90deg, #f22407 0%, #f84d17 100%);
|
||||
border-radius: 32px;
|
||||
font-size: 26rpx;
|
||||
font-weight: bold;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.wallet-box {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 3fr;
|
||||
background-color: white;
|
||||
height: 84px;
|
||||
box-sizing: border-box;
|
||||
padding: 18px 0;
|
||||
font-size: 24rpx;
|
||||
background: hsla(0, 0%, 100%, .4);
|
||||
|
||||
.wallet-title {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
|
||||
border-right: 1px #eee dotted;
|
||||
margin-right: 24rpx;
|
||||
}
|
||||
|
||||
.wallet-list {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
color: rgb(241, 193, 105);
|
||||
|
||||
.text {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: black;
|
||||
padding-right: 14rpx;
|
||||
}
|
||||
|
||||
.price {
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,48 @@
|
||||
.page-box {
|
||||
min-height: 100vh !important;
|
||||
}
|
||||
|
||||
.flex {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.flex-1 {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.flex-row {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.flex-col {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.justify-around {
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
.items-center {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.flex-x-between {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.flex-x-end {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.flex-x-center {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.flex-y-center {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.mx-auto {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
@ -0,0 +1,31 @@
|
||||
import Vue from "vue";
|
||||
import Vuex from "vuex";
|
||||
|
||||
Vue.use(Vuex);
|
||||
|
||||
const store = new Vuex.Store({
|
||||
state: {
|
||||
$Gimage: {},
|
||||
$GstoreDetail: {},
|
||||
// 购物车数量
|
||||
cartNum: 0,
|
||||
},
|
||||
getters: {
|
||||
cartNum: (state) => {
|
||||
return state.cartNum || 0;
|
||||
},
|
||||
},
|
||||
mutations: {
|
||||
SET: (state, { key, val }) => {
|
||||
state[key] = val
|
||||
},
|
||||
},
|
||||
actions: {
|
||||
setData({ commit }, { key, val }) {
|
||||
commit('SET', { key, val })
|
||||
}
|
||||
},
|
||||
modules: {},
|
||||
});
|
||||
|
||||
export default store;
|
||||
@ -0,0 +1,212 @@
|
||||
<template>
|
||||
<view class="list" v-if="list.length">
|
||||
<view @click="toUrl('/subPackages/goods/goods/index?id=' + e.id)" class="list-items" v-for="(e, i) of sortedItems"
|
||||
:key="i">
|
||||
<view class="list-con">
|
||||
<view class="list-img">
|
||||
<view class="tag" v-if="e.lable" :style="{ background: e.lable.bg_color }">{{ e.lable.name }}</view>
|
||||
<view class="img">
|
||||
<u-image loadingIcon="bag" showLoading bgColor="#fff" :fade="true" lazyLoad width="100%"
|
||||
height="auto" :src="e.pic_url" mode="widthFix">
|
||||
<template #loading>
|
||||
<view
|
||||
style="min-height: 200rpx;;display: flex;align-items: center;justify-content: center;">
|
||||
<u-icon name="bag"></u-icon>
|
||||
</view>
|
||||
</template>
|
||||
</u-image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list-txt">
|
||||
<view class="list-name mb">{{ e.name }}</view>
|
||||
<view v-if="e.server_project && e.server_project.length" class="list-attr">
|
||||
<u-text color="#f0250e" size="12" :lines="1" :text="e.server_project"></u-text>
|
||||
</view>
|
||||
<view class="list-txt-fd">
|
||||
<view class="list-price g-price">
|
||||
<template v-if="e.autoCouponPrice">
|
||||
<text style="font-size: 24rpx;margin-right: 6rpx;">卷后</text>
|
||||
<view>¥</view>
|
||||
<view class="fwb">{{ getPrice(e.autoCouponPrice)[0] }}</view>
|
||||
<view>.{{ getPrice(e.autoCouponPrice)[1] }}</view>
|
||||
</template>
|
||||
<template v-else>
|
||||
<view>¥</view>
|
||||
<view class="fwb">{{ getPrice(e.price_min)[0] }}</view>
|
||||
<view>.{{ getPrice(e.price_min)[1] }}</view>
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// new_list: [],
|
||||
}
|
||||
},
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
default: () => {
|
||||
return []
|
||||
}
|
||||
},
|
||||
classify: {
|
||||
type: [String, Number]
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
getPrice() {
|
||||
return (price) => {
|
||||
return price ? price.split(".") : ["0.00"];
|
||||
};
|
||||
},
|
||||
sortedItems: function () {
|
||||
let sortedArray = [];
|
||||
let columnCount = 2; // 指定横排布局的列数
|
||||
let columnIndex = 0;
|
||||
|
||||
// 根据列数将数据项分组
|
||||
let groups = this.list.reduce(function (result, item) {
|
||||
if (!result[columnIndex]) {
|
||||
result[columnIndex] = [];
|
||||
}
|
||||
result[columnIndex].push(item);
|
||||
columnIndex = (columnIndex + 1) % columnCount;
|
||||
return result;
|
||||
}, []);
|
||||
|
||||
// 按照横排布局的顺序将数据项重新排序
|
||||
for (let i = 0; i < groups.length; i++) {
|
||||
for (let j = 0; j < groups[i].length; j++) {
|
||||
sortedArray.push(groups[i][j]);
|
||||
}
|
||||
}
|
||||
return sortedArray;
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.list {
|
||||
padding: 22rpx 12rpx;
|
||||
column-count: 2;
|
||||
gap: 20rpx;
|
||||
grid-gap: 20rpx;
|
||||
column-gap: 20rpx;
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.list-items {
|
||||
margin-bottom: 20rpx;
|
||||
box-sizing: border-box;
|
||||
break-inside: avoid;
|
||||
box-shadow: 0 0.3125rem 1.25rem 0px rgba(166, 199, 251, 0.12);
|
||||
|
||||
&:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.list-item {
|
||||
padding: 12rpx;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.list-con {
|
||||
background: #fff;
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
|
||||
.list-img {
|
||||
width: 100%;
|
||||
padding: 20rpx 20rpx 0;
|
||||
overflow: hidden;
|
||||
box-sizing: border-box;
|
||||
min-height: 200rpx;
|
||||
display: flex;
|
||||
border-radius: 8rpx;
|
||||
position: relative;
|
||||
|
||||
display: flex;
|
||||
|
||||
|
||||
.tag {
|
||||
position: absolute;
|
||||
top: 20rpx;
|
||||
left: 20rpx;
|
||||
padding: 6rpx 15rpx 8rpx 10rpx;
|
||||
font-size: 20rpx;
|
||||
color: #fff;
|
||||
z-index: 2;
|
||||
border-radius: 8rpx 0 10px 0;
|
||||
}
|
||||
|
||||
.img {
|
||||
box-sizing: border-box;
|
||||
border-radius: 8rpx;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.list-txt {
|
||||
padding: 20rpx;
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
|
||||
.list-name {
|
||||
display: -webkit-box;
|
||||
margin-bottom: 10rpx;
|
||||
max-height: 80rpx;
|
||||
white-space: normal;
|
||||
text-overflow: ellipsis;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
word-break: break-all;
|
||||
overflow: hidden;
|
||||
font-size: 24rpx;
|
||||
color: #262626;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.list-txt-fd {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
justify-content: space-between;
|
||||
|
||||
.list-price {
|
||||
padding-right: 5rpx;
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
color: #f0250e;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.list-attr {
|
||||
font-size: 24rpx;
|
||||
color: #8c8c8c;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
padding-bottom: 10rpx;
|
||||
color: #f0250e;
|
||||
|
||||
text {
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,174 @@
|
||||
<template>
|
||||
<view class="page page-box">
|
||||
<view class="banner_inner"></view>
|
||||
|
||||
<view class="head">
|
||||
<u-icon name="checkmark-circle-fill" size="56" color="#fff"></u-icon>
|
||||
<view class="text">支付成功</view>
|
||||
<view class="price"><text class="iconPrice">￥</text>{{ `${price} 元` }}</view>
|
||||
</view>
|
||||
|
||||
<view class="icon">
|
||||
<image class="logo" :src="info.logo_url"></image>
|
||||
</view>
|
||||
|
||||
<!-- <view class="goodsList">
|
||||
<view class="goodsTitle">推荐商品</view>
|
||||
<twoGoods :list="goodsList"></twoGoods>
|
||||
</view> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import twoGoods from '../compontents/twoGoods.vue';
|
||||
export default {
|
||||
components: {
|
||||
twoGoods
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
price: "",
|
||||
info: {},
|
||||
goodsList: []
|
||||
}
|
||||
},
|
||||
onLoad({
|
||||
price,
|
||||
mch_id
|
||||
}) {
|
||||
this.price = price
|
||||
this.mch_id = mch_id
|
||||
this.init()
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
async init() {
|
||||
const res = await this.$api.inPersonToPay.storeInfo({
|
||||
mch_id: this.mch_id,
|
||||
})
|
||||
|
||||
this.info = {
|
||||
...res.data.store,
|
||||
...res.data.shop
|
||||
}
|
||||
},
|
||||
|
||||
async fetchData(keyword = "1") {
|
||||
const res = await this.$api.goods.searchGoodsList({
|
||||
keywords: keyword
|
||||
})
|
||||
|
||||
this.goodsList = res.data.rows
|
||||
console.log(res);
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.page {
|
||||
padding: 20rpx;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
color: hsla(0, 0%, 100%, .9);
|
||||
overflow: auto;
|
||||
|
||||
.icon {
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.head {
|
||||
z-index: 2;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: absolute;
|
||||
top: 60rpx;
|
||||
right: 0;
|
||||
left: 0;
|
||||
|
||||
.text {
|
||||
margin: 24rpx 0;
|
||||
}
|
||||
|
||||
.price {
|
||||
font-weight: 600;
|
||||
font-size: 60rpx;
|
||||
font-family: PingFang SC, Arial, 'Helvetica Neue', Helvetica, sans-serif;
|
||||
letter-spacing: 4rpx;
|
||||
|
||||
.iconPrice {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.banner_inner {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
height: 40vh;
|
||||
top: 0;
|
||||
width: 150%;
|
||||
min-width: 780px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
background: linear-gradient(60deg, #18b566 0%, #71d5a1 100%);
|
||||
border-radius: 0 0 65% 65%;
|
||||
z-index: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.logo {
|
||||
position: absolute;
|
||||
top: 40vh;
|
||||
left: 0;
|
||||
right: 0;
|
||||
transform: translateY(-50%);
|
||||
height: 180rpx;
|
||||
width: 180rpx;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-bottom: 50rpx;
|
||||
border-radius: 60rpx;
|
||||
box-shadow: 0 0.3125rem 1.25rem 0px rgba(166, 199, 251, 0.12);
|
||||
}
|
||||
|
||||
.goodsTitle {
|
||||
|
||||
position: relative;
|
||||
color: #000;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
&::after {
|
||||
content: "";
|
||||
height: 6px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 6px;
|
||||
position: absolute;
|
||||
background: linear-gradient(60deg, #ff5740 0%, rgb(252, 143, 76) 100%);
|
||||
width: 100rpx;
|
||||
margin: 0 auto;
|
||||
opacity: 0.4;
|
||||
}
|
||||
}
|
||||
|
||||
.goodsList {
|
||||
margin-top: calc(40vh + 100rpx);
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
page {
|
||||
background-color: #f8f8f8;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,321 @@
|
||||
<template>
|
||||
<view class="page page-box">
|
||||
<view class="saveThePhoneNumber">
|
||||
|
||||
<!-- <view class="mobilePhone">
|
||||
<u-input border="none" placeholder="请输入手机号" v-model="form.phone">
|
||||
<template #prefix>
|
||||
<span style="margin-right: 10rpx; font-size: 24rpx;color: #a1a1a1;font-weight: 600;">
|
||||
+86
|
||||
</span>
|
||||
</template>
|
||||
</u-input>
|
||||
</view> -->
|
||||
|
||||
|
||||
<view class="tip">
|
||||
向您绑定的手机号 199xxxx1234 发送验证码
|
||||
</view>
|
||||
|
||||
<view class="input">
|
||||
<view class="verificationCode">
|
||||
<u-input v-model="form.password" border="none" placeholder="请输入验证码"></u-input>
|
||||
</view>
|
||||
|
||||
<view class="toObtain">
|
||||
<u-code keepRunning ref="uCode" @change="codeChange" seconds="60" changeText="X秒重新获取"></u-code>
|
||||
<u-button @click="getCode" :text="tips" :disabled="!['获取验证码', '重新获取'].includes(tips)"
|
||||
:color="['获取验证码', '重新获取'].includes(tips) ? 'rgb(247, 56, 38)' : '#cccccc'"></u-button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="mobilePhone">
|
||||
<u-input border="none" placeholder="请输入新密码" v-model="form.newPassword">
|
||||
<template #prefix>
|
||||
<span style="margin-right: 10rpx; font-size: 24rpx;color: #a1a1a1;font-weight: 600;">
|
||||
新密码
|
||||
</span>
|
||||
</template>
|
||||
</u-input>
|
||||
</view>
|
||||
|
||||
<view class="mobilePhone">
|
||||
<u-input border="none" placeholder="请重新输入密码" v-model="form.phone">
|
||||
<template #prefix>
|
||||
<span style="margin-right: 10rpx; font-size: 24rpx;color: #a1a1a1;font-weight: 600;">
|
||||
确认密码
|
||||
</span>
|
||||
</template>
|
||||
</u-input>
|
||||
</view>
|
||||
|
||||
<view style="width: 100%;margin: 20rpx auto;border-radius: 18rpx;font-weight: 600;overflow: hidden;">
|
||||
<u-button color="rgb(247, 56, 38)" text="修改密码" @click="saveThePhoneNumber"></u-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
tips: "",
|
||||
form: {
|
||||
password: "",
|
||||
newPassword: "",
|
||||
code: ""
|
||||
}
|
||||
};
|
||||
},
|
||||
onLoad() { },
|
||||
onShow() {
|
||||
},
|
||||
methods: {
|
||||
|
||||
codeChange(text) {
|
||||
this.tips = text;
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取验证码并发送给指定手机号。
|
||||
* @returns {void}
|
||||
*/
|
||||
async getCode() {
|
||||
if (!/^(?:(?:\+|00)86)?1[3-9]\d{9}$/.test(this.form.phone)) {
|
||||
return uni.$u.toast('请检查手机号格式');
|
||||
}
|
||||
|
||||
if (this.form.newPassword != this.form.password) {
|
||||
return uni.$u.toast('两次输入密码不一致');
|
||||
}
|
||||
|
||||
if (this.$refs.uCode.canGetCode) {
|
||||
// 模拟向后端请求验证码
|
||||
uni.showLoading({
|
||||
title: '正在获取验证码'
|
||||
});
|
||||
|
||||
// setTimeout(() => {
|
||||
// uni.hideLoading();
|
||||
// // 这里的提示会被this.start()方法中的提示覆盖
|
||||
// uni.$u.toast('验证码已发送');
|
||||
// // 通知验证码组件内部开始倒计时
|
||||
// this.$refs.uCode.start();
|
||||
// }, 2000);
|
||||
const res = await this.$api.user.send({
|
||||
mobile: this.form.phone
|
||||
})
|
||||
|
||||
if (res.code === 0) {
|
||||
this.$refs.uCode.start();
|
||||
} else {
|
||||
uni.$u.toast(res.msg);
|
||||
}
|
||||
uni.hideLoading();
|
||||
} else {
|
||||
uni.$u.toast('倒计时结束后再发送');
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 保存手机号码并进行验证。
|
||||
* @returns {void}
|
||||
*/
|
||||
async saveThePhoneNumber() {
|
||||
// if (!/^(?:(?:\+|00)86)?1[3-9]\d{9}$/.test(this.form.phone)) {
|
||||
// return uni.$u.toast('请检查手机号格式');
|
||||
// }
|
||||
|
||||
if (this.form.code.trim() === "") {
|
||||
return uni.$u.toast('请输入验证码');
|
||||
}
|
||||
|
||||
// 执行保存手机号码的逻辑
|
||||
|
||||
const res = await this.$api.user.bind_merge({
|
||||
mobile: this.form.phone,
|
||||
sms_code: this.form.code
|
||||
})
|
||||
|
||||
if (res.code === 0) {
|
||||
uni.$u.toast('绑定成功');
|
||||
} else {
|
||||
uni.$u.toast(res.msg);
|
||||
}
|
||||
|
||||
this.getData();
|
||||
}
|
||||
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
onReachBottom() { },
|
||||
onPullDownRefresh() {
|
||||
console.log("加载");
|
||||
setTimeout(() => {
|
||||
uni.stopPullDownRefresh();
|
||||
}, 200);
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.page {
|
||||
position: relative;
|
||||
min-height: 100%;
|
||||
background: #f2f2f2;
|
||||
padding: 24rpx 0 100rpx;
|
||||
padding: 24rpx 0 calc(constant(safe-area-inset-bottom) + 100rpx);
|
||||
padding: 24rpx 0 calc(env(safe-area-inset-bottom) + 100rpx);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.m-box {
|
||||
margin-bottom: 24rpx;
|
||||
padding: 0 24rpx;
|
||||
background: #fff;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.payList {
|
||||
.item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 120rpx;
|
||||
border-top: 1px solid #f8f8f8;
|
||||
}
|
||||
|
||||
.let {
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.img {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-right: 20rpx;
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
}
|
||||
|
||||
image {
|
||||
// width: 100%;
|
||||
height: 50rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.tip {
|
||||
font-size: 22rpx;
|
||||
color: #a0a0a0;
|
||||
font-weight: bold;
|
||||
margin-bottom: 14rpx;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
|
||||
.m-tit {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 100rpx;
|
||||
font-size: 32rpx;
|
||||
color: #262626;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.payTime {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding-top: 50rpx;
|
||||
font-size: 24rpx;
|
||||
color: #8c8c8c;
|
||||
}
|
||||
|
||||
.price {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: flex-end;
|
||||
padding: 10rpx 0 30rpx;
|
||||
color: #262626;
|
||||
font-size: 80rpx;
|
||||
line-height: 1;
|
||||
font-weight: bold;
|
||||
|
||||
&:before {
|
||||
content: "¥";
|
||||
font-size: 48rpx;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep {
|
||||
.u-count-down__text {
|
||||
padding-left: 8rpx;
|
||||
color: #8c8c8c;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
padding: 12rpx 36rpx 12rpx;
|
||||
padding: 12rpx 36rpx calc(constant(safe-area-inset-bottom) + 12rpx);
|
||||
padding: 12rpx 36rpx calc(env(safe-area-inset-bottom) + 12rpx);
|
||||
background: #fff;
|
||||
|
||||
view {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 76rpx;
|
||||
background: linear-gradient(90deg, #f22407 0%, #f84d17 100%);
|
||||
border-radius: 18rpx;
|
||||
|
||||
font-size: 26rpx;
|
||||
font-weight: bold;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.saveThePhoneNumber {
|
||||
padding: 0 20rpx;
|
||||
|
||||
.mobilePhone {
|
||||
background-color: white;
|
||||
margin-bottom: 22rpx;
|
||||
border-radius: 18rpx;
|
||||
padding: 18rpx;
|
||||
}
|
||||
|
||||
.input {
|
||||
display: flex;
|
||||
margin-bottom: 20rpx;
|
||||
align-items: center;
|
||||
|
||||
.verificationCode {
|
||||
border-radius: 18rpx;
|
||||
overflow: hidden;
|
||||
background-color: white;
|
||||
flex: 1;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 18rpx;
|
||||
}
|
||||
|
||||
.toObtain {
|
||||
width: 7em;
|
||||
margin-left: 22rpx;
|
||||
border-radius: 18rpx;
|
||||
overflow: hidden;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,27 @@
|
||||
<template>
|
||||
<view>
|
||||
<logins :type="1" :wcCode="wcCode"></logins>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import logins from '@/components/login/logins.vue'
|
||||
export default {
|
||||
components: {
|
||||
logins
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
wcCode: undefined
|
||||
};
|
||||
},
|
||||
onLoad({ wxcode } = {}) {
|
||||
if (wxcode) {
|
||||
this.wcCode = wxcode
|
||||
}
|
||||
},
|
||||
methods: {},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style></style>
|
||||
@ -0,0 +1,174 @@
|
||||
<template>
|
||||
<view class="page-box">
|
||||
<u--form :model="form" ref="uForm" :rules="rules" labelWidth="180rpx">
|
||||
<u-form-item label="手机号：" prop="mobile">
|
||||
<u--input v-model="form.mobile" border="bottom" placeholder="请输入手机号"></u--input>
|
||||
</u-form-item>
|
||||
<u-form-item label="验证码：" prop="code">
|
||||
<u--input v-model="form.code" border="bottom" placeholder="请填写验证码">
|
||||
<!-- <template slot="suffix">
|
||||
<u-code :seconds="60" @end="codeEnd" @start="codeStart" @change="codeChange" ref="uCode"></u-code>
|
||||
<template v-if="is_send_sms">
|
||||
<u-button type="primary" text="获取验证码" size="mini" @click="sendSms"></u-button>
|
||||
</template>
|
||||
<template v-else>
|
||||
<u-button type="primary" :text="sms_info" size="mini"></u-button>
|
||||
</template>
|
||||
</template> -->
|
||||
</u--input>
|
||||
<view>
|
||||
<u-code :seconds="60" @end="codeEnd" @start="codeStart" @change="codeChange" ref="uCode"></u-code>
|
||||
<template v-if="is_send_sms">
|
||||
<u-button type="primary" text="获取验证码" size="mini" @click="sendSms"></u-button>
|
||||
</template>
|
||||
<template v-else>
|
||||
<u-button type="primary" :text="sms_info" size="mini"></u-button>
|
||||
</template>
|
||||
</view>
|
||||
</u-form-item>
|
||||
<u-form-item label="邀请码：" prop="parent_id">
|
||||
<u--input v-model="form.parent_id" :disabled="distributor_id > 0" border="bottom" placeholder="请输入邀请码"></u--input>
|
||||
</u-form-item>
|
||||
|
||||
<u-form-item label="密码：" prop="pwd">
|
||||
<u--input v-model="form.pwd" :password="true" border="bottom" placeholder="请输入密码"></u--input>
|
||||
</u-form-item>
|
||||
<u-form-item label="确认密码：" prop="pwd_1">
|
||||
<u--input v-model="form.pwd_1" :password="true" border="bottom" placeholder="请输入密码"></u--input>
|
||||
</u-form-item>
|
||||
</u--form>
|
||||
<view style="margin-top: 40rpx;">
|
||||
<u-button shape="circle" type="success" color="#fa3534" size="large" text="登录" @click="pwdSubmit"></u-button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
components: { },
|
||||
data() {
|
||||
return {
|
||||
is_eye: 0,
|
||||
sms_info: '60秒重新获取',
|
||||
is_send_sms: 1,
|
||||
distributor_id: '',
|
||||
form: {
|
||||
code: '',
|
||||
mobile: '',
|
||||
pwd: '',
|
||||
pwd_1: '',
|
||||
parent_id: ''
|
||||
},
|
||||
rules: {
|
||||
mobile: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入账号',
|
||||
trigger: ['blur', 'change']
|
||||
}
|
||||
],
|
||||
code: [
|
||||
{
|
||||
required: true,
|
||||
message: '请填写6位验证码',
|
||||
len: 6,
|
||||
trigger: ['blur', 'change']
|
||||
}
|
||||
],
|
||||
pwd: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入至少6位密码',
|
||||
min: 6,
|
||||
trigger: ['blur', 'change']
|
||||
}
|
||||
],
|
||||
pwd_1: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入至少6位密码',
|
||||
min: 6,
|
||||
trigger: ['blur', 'change']
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
onShow() {
|
||||
let distributor_id = uni.getStorageSync('distributor_id')
|
||||
if (distributor_id) {
|
||||
this.distributor_id = distributor_id
|
||||
this.form.parent_id = distributor_id.padStart(7, '0');
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
codeEnd() {
|
||||
console.log('codeEnd')
|
||||
this.is_send_sms = 1
|
||||
},
|
||||
codeStart() {
|
||||
|
||||
console.log('codeStart')
|
||||
this.is_send_sms = 0
|
||||
},
|
||||
codeChange(e) {
|
||||
this.sms_info = e
|
||||
},
|
||||
async sendSms() {
|
||||
uni.showLoading({
|
||||
title: '发送中'
|
||||
})
|
||||
const res = await this.$api.common.sendSms({
|
||||
mobile: this.form.mobile
|
||||
});
|
||||
uni.hideLoading()
|
||||
if (res.code) {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: res.msg
|
||||
})
|
||||
} else {
|
||||
this.is_send_sms = 0
|
||||
this.$nextTick(() => {
|
||||
this.$refs.uCode.start();
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
pwdSubmit() {
|
||||
this.$refs.uForm.validate().then(async (res) => {
|
||||
uni.showLoading({
|
||||
title: '注册中'
|
||||
})
|
||||
const res1 = await this.$api.user.regPhone(this.form);
|
||||
uni.hideLoading()
|
||||
if (res1.code) {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: res1.msg
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '注册成功'
|
||||
})
|
||||
setTimeout(() => {
|
||||
this.$utils.toUrl("/subPackages/login/login/index", "redirectTo")
|
||||
}, 2000)
|
||||
}
|
||||
}).catch(errors => {})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.page-box {
|
||||
background: #FFF;
|
||||
padding: 30rpx;
|
||||
min-height: 100vh;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,161 @@
|
||||
<template>
|
||||
<view class="page-box">
|
||||
<u--form :model="form" ref="uForm" :rules="rules" labelWidth="180rpx">
|
||||
<u-form-item label="手机号：" prop="mobile">
|
||||
<u--input v-model="form.mobile" border="bottom" placeholder="请输入手机号"></u--input>
|
||||
</u-form-item>
|
||||
<u-form-item label="验证码：" prop="code">
|
||||
<u--input v-model="form.code" border="bottom" placeholder="请填写验证码">
|
||||
<!-- <template slot="suffix">
|
||||
<u-code :seconds="60" @end="codeEnd" @start="codeStart" @change="codeChange" ref="uCode"></u-code>
|
||||
<template v-if="is_send_sms">
|
||||
<u-button type="primary" text="获取验证码" size="mini" @click="sendSms"></u-button>
|
||||
</template>
|
||||
<template v-else>
|
||||
<u-button type="primary" :text="sms_info" size="mini"></u-button>
|
||||
</template>
|
||||
</template> -->
|
||||
</u--input>
|
||||
<view>
|
||||
<u-code :seconds="60" @end="codeEnd" @start="codeStart" @change="codeChange" ref="uCode"></u-code>
|
||||
<template v-if="is_send_sms">
|
||||
<u-button type="primary" text="获取验证码" size="mini" @click="sendSms"></u-button>
|
||||
</template>
|
||||
<template v-else>
|
||||
<u-button type="primary" :text="sms_info" size="mini"></u-button>
|
||||
</template>
|
||||
</view>
|
||||
</u-form-item>
|
||||
<u-form-item label="密码：" prop="pwd">
|
||||
<u--input v-model="form.pwd" :password="true" border="bottom" placeholder="请输入密码"></u--input>
|
||||
</u-form-item>
|
||||
<u-form-item label="确认密码：" prop="pwd_1">
|
||||
<u--input v-model="form.pwd_1" :password="true" border="bottom" placeholder="请输入密码"></u--input>
|
||||
</u-form-item>
|
||||
</u--form>
|
||||
<view style="margin-top: 40rpx;">
|
||||
<u-button shape="circle" type="success" color="#fa3534" size="large" text="登录" @click="pwdSubmit"></u-button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
components: { },
|
||||
data() {
|
||||
return {
|
||||
is_eye: 0,
|
||||
sms_info: '60秒重新获取',
|
||||
is_send_sms: 1,
|
||||
form: {
|
||||
code: '',
|
||||
mobile: '',
|
||||
pwd: '',
|
||||
pwd_1: '',
|
||||
},
|
||||
rules: {
|
||||
mobile: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入账号',
|
||||
trigger: ['blur', 'change']
|
||||
}
|
||||
],
|
||||
code: [
|
||||
{
|
||||
required: true,
|
||||
message: '请填写6位验证码',
|
||||
len: 6,
|
||||
trigger: ['blur', 'change']
|
||||
}
|
||||
],
|
||||
pwd: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入至少6位密码',
|
||||
min: 6,
|
||||
trigger: ['blur', 'change']
|
||||
}
|
||||
],
|
||||
pwd_1: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入至少6位密码',
|
||||
min: 6,
|
||||
trigger: ['blur', 'change']
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
codeEnd() {
|
||||
console.log('codeEnd')
|
||||
this.is_send_sms = 1
|
||||
},
|
||||
codeStart() {
|
||||
|
||||
console.log('codeStart')
|
||||
this.is_send_sms = 0
|
||||
},
|
||||
codeChange(e) {
|
||||
this.sms_info = e
|
||||
},
|
||||
async sendSms() {
|
||||
uni.showLoading({
|
||||
title: '发送中'
|
||||
})
|
||||
const res = await this.$api.common.sendSms({
|
||||
mobile: this.form.mobile
|
||||
});
|
||||
uni.hideLoading()
|
||||
if (res.code) {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: res.msg
|
||||
})
|
||||
} else {
|
||||
this.is_send_sms = 0
|
||||
this.$nextTick(() => {
|
||||
this.$refs.uCode.start();
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
pwdSubmit() {
|
||||
this.$refs.uForm.validate().then(async (res) => {
|
||||
uni.showLoading({
|
||||
title: '重置中'
|
||||
})
|
||||
const res1 = await this.$api.user.regPhone(this.form);
|
||||
uni.hideLoading()
|
||||
if (res1.code) {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: res1.msg
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '重置成功'
|
||||
})
|
||||
setTimeout(() => {
|
||||
this.$utils.toUrl("/subPackages/login/login/index", "redirectTo")
|
||||
}, 2000)
|
||||
}
|
||||
}).catch(errors => {})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.page-box {
|
||||
background: #FFF;
|
||||
padding: 30rpx;
|
||||
min-height: 100vh;
|
||||
}
|
||||
</style>
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,150 @@
|
||||
const styles = (v ='') => v.split(';').filter(v => v && !/^[\n\s]+$/.test(v)).map(v => {
|
||||
const key = v.slice(0, v.indexOf(':'))
|
||||
const value = v.slice(v.indexOf(':')+1)
|
||||
return {
|
||||
[key
|
||||
.replace(/-([a-z])/g, function() { return arguments[1].toUpperCase()})
|
||||
.replace(/\s+/g, '')
|
||||
]: value.replace(/^\s+/, '').replace(/\s+$/, '') || ''
|
||||
}
|
||||
})
|
||||
export function parent(parent) {
|
||||
return {
|
||||
provide() {
|
||||
return {
|
||||
[parent]: this
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
el: {
|
||||
id: null,
|
||||
css: {},
|
||||
views: []
|
||||
},
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
css: {
|
||||
handler(v) {
|
||||
if(this.canvasId) {
|
||||
this.el.css = (typeof v == 'object' ? v : v && Object.assign(...styles(v))) || {}
|
||||
this.canvasWidth = this.el.css && this.el.css.width || this.canvasWidth
|
||||
this.canvasHeight = this.el.css && this.el.css.height || this.canvasHeight
|
||||
}
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
export function children(parent, options = {}) {
|
||||
const indexKey = options.indexKey || 'index'
|
||||
return {
|
||||
inject: {
|
||||
[parent]: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
el: {
|
||||
handler(v, o) {
|
||||
if(JSON.stringify(v) != JSON.stringify(o))
|
||||
this.bindRelation()
|
||||
},
|
||||
deep: true,
|
||||
immediate: true
|
||||
},
|
||||
src: {
|
||||
handler(v, o) {
|
||||
if(v != o)
|
||||
this.bindRelation()
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
text: {
|
||||
handler(v, o) {
|
||||
if(v != o) this.bindRelation()
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
css: {
|
||||
handler(v, o) {
|
||||
if(v != o)
|
||||
this.el.css = (typeof v == 'object' ? v : v && Object.assign(...styles(v))) || {}
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
replace: {
|
||||
handler(v, o) {
|
||||
if(JSON.stringify(v) != JSON.stringify(o))
|
||||
this.bindRelation()
|
||||
},
|
||||
deep: true,
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if(!this._uid) {
|
||||
this._uid = this._.uid
|
||||
}
|
||||
Object.defineProperty(this, 'parent', {
|
||||
get: () => this[parent] || [],
|
||||
})
|
||||
Object.defineProperty(this, 'index', {
|
||||
get: () => {
|
||||
this.bindRelation();
|
||||
const {parent: {el: {views=[]}={}}={}} = this
|
||||
return views.indexOf(this.el)
|
||||
},
|
||||
});
|
||||
this.el.type = this.type
|
||||
if(this.uid) {
|
||||
this.el.uid = this.uid
|
||||
}
|
||||
this.bindRelation()
|
||||
},
|
||||
// #ifdef VUE3
|
||||
beforeUnmount() {
|
||||
this.removeEl()
|
||||
},
|
||||
// #endif
|
||||
// #ifdef VUE2
|
||||
beforeDestroy() {
|
||||
this.removeEl()
|
||||
},
|
||||
// #endif
|
||||
methods: {
|
||||
removeEl() {
|
||||
if (this.parent) {
|
||||
this.parent.el.views = this.parent.el.views.filter(
|
||||
(item) => item._uid !== this._uid
|
||||
);
|
||||
}
|
||||
},
|
||||
bindRelation() {
|
||||
if(!this.el._uid) {
|
||||
this.el._uid = this._uid
|
||||
}
|
||||
if(['text','qrcode'].includes(this.type)) {
|
||||
this.el.text = this.$slots && this.$slots.default && this.$slots.default[0].text || `${this.text || ''}`.replace(/\\n/g, '\n')
|
||||
}
|
||||
if(this.type == 'image') {
|
||||
this.el.src = this.src
|
||||
}
|
||||
if (!this.parent) {
|
||||
return;
|
||||
}
|
||||
let views = this.parent.el.views || [];
|
||||
if(views.indexOf(this.el) !== -1) {
|
||||
this.parent.el.views = views.map(v => v._uid == this._uid ? this.el : v)
|
||||
} else {
|
||||
this.parent.el.views = [...views, this.el];
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// this.bindRelation()
|
||||
},
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,28 @@
|
||||
<template>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {parent, children} from '../common/relation';
|
||||
export default {
|
||||
name: 'lime-painter-image',
|
||||
mixins:[children('painter')],
|
||||
props: {
|
||||
id: String,
|
||||
css: [String, Object],
|
||||
src: String
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
type: 'image',
|
||||
el: {
|
||||
css: {},
|
||||
src: null
|
||||
},
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
@ -0,0 +1,27 @@
|
||||
<template>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {parent, children} from '../common/relation';
|
||||
export default {
|
||||
name: 'lime-painter-qrcode',
|
||||
mixins:[children('painter')],
|
||||
props: {
|
||||
id: String,
|
||||
css: [String, Object],
|
||||
text: String
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
type: 'qrcode',
|
||||
el: {
|
||||
css: {},
|
||||
text: null
|
||||
},
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
@ -0,0 +1,29 @@
|
||||
<template>
|
||||
<text style="opacity: 0;height: 0;"><slot/></text>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {parent, children} from '../common/relation';
|
||||
export default {
|
||||
name: 'lime-painter-text',
|
||||
mixins:[children('painter')],
|
||||
props: {
|
||||
uid: String,
|
||||
css: [String, Object],
|
||||
text: [String, Number],
|
||||
replace: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
type: 'text',
|
||||
el: {
|
||||
css: {},
|
||||
text: null
|
||||
},
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
@ -0,0 +1,30 @@
|
||||
<template>
|
||||
<view><slot/></view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {parent, children} from '../common/relation';
|
||||
export default {
|
||||
name: 'lime-painter-view',
|
||||
mixins:[children('painter'), parent('painter')],
|
||||
props: {
|
||||
id: String,
|
||||
css: [String, Object],
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
type: 'view',
|
||||
el: {
|
||||
css: {},
|
||||
views:[]
|
||||
},
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
@ -0,0 +1,190 @@
|
||||
// #ifdef APP-NVUE
|
||||
import { sleep, getImageInfo, isBase64, useNvue, networkReg } from './utils';
|
||||
const dom = weex.requireModule('dom')
|
||||
import { version } from '../../package.json'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
tempFilePath: [],
|
||||
isInitFile: false,
|
||||
osName: uni.getSystemInfoSync().osName
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getParentWeith() {
|
||||
return new Promise(resolve => {
|
||||
dom.getComponentRect(this.$refs.limepainter, (res) => {
|
||||
this.parentWidth = Math.ceil(res.size.width)
|
||||
this.canvasWidth = this.canvasWidth || this.parentWidth ||300
|
||||
this.canvasHeight = res.size.height || this.canvasHeight||150
|
||||
resolve(res.size)
|
||||
})
|
||||
})
|
||||
},
|
||||
onPageFinish() {
|
||||
this.webview = this.$refs.webview
|
||||
this.webview.evalJS(`init(${this.dpr})`)
|
||||
},
|
||||
onMessage(e) {
|
||||
const res = e.detail.data[0] || null;
|
||||
if (res.event) {
|
||||
if (res.event == 'inited') {
|
||||
this.inited = true
|
||||
}
|
||||
if(res.event == 'fail'){
|
||||
this.$emit('fail', res)
|
||||
}
|
||||
if (res.event == 'layoutChange') {
|
||||
const data = typeof res.data == 'string' ? JSON.parse(res.data) : res.data
|
||||
this.canvasWidth = Math.ceil(data.width);
|
||||
this.canvasHeight = Math.ceil(data.height);
|
||||
}
|
||||
if (res.event == 'progressChange') {
|
||||
this.progress = res.data * 1
|
||||
}
|
||||
if (res.event == 'file') {
|
||||
this.tempFilePath.push(res.data)
|
||||
if (this.tempFilePath.length > 7) {
|
||||
this.tempFilePath.shift()
|
||||
}
|
||||
return
|
||||
}
|
||||
if (res.event == 'success') {
|
||||
if (res.data) {
|
||||
this.tempFilePath.push(res.data)
|
||||
if (this.tempFilePath.length > 8) {
|
||||
this.tempFilePath.shift()
|
||||
}
|
||||
if (this.isCanvasToTempFilePath) {
|
||||
this.setFilePath(this.tempFilePath.join(''), {isEmit:true})
|
||||
}
|
||||
} else {
|
||||
this.$emit('fail', 'canvas no data')
|
||||
}
|
||||
return
|
||||
}
|
||||
this.$emit(res.event, JSON.parse(res.data));
|
||||
} else if (res.file) {
|
||||
this.file = res.data;
|
||||
} else{
|
||||
console.info(res[0])
|
||||
}
|
||||
},
|
||||
getWebViewInited() {
|
||||
if (this.inited) return Promise.resolve(this.inited);
|
||||
return new Promise((resolve) => {
|
||||
this.$watch(
|
||||
'inited',
|
||||
async val => {
|
||||
if (val) {
|
||||
resolve(val)
|
||||
}
|
||||
}, {
|
||||
immediate: true
|
||||
}
|
||||
);
|
||||
})
|
||||
},
|
||||
getTempFilePath() {
|
||||
if (this.tempFilePath.length == 8) return Promise.resolve(this.tempFilePath)
|
||||
return new Promise((resolve) => {
|
||||
this.$watch(
|
||||
'tempFilePath',
|
||||
async val => {
|
||||
if (val.length == 8) {
|
||||
resolve(val.join(''))
|
||||
}
|
||||
}
|
||||
);
|
||||
})
|
||||
},
|
||||
getWebViewDone() {
|
||||
if (this.progress == 1) return Promise.resolve(this.progress);
|
||||
return new Promise((resolve) => {
|
||||
this.$watch(
|
||||
'progress',
|
||||
async val => {
|
||||
if (val == 1) {
|
||||
this.$emit('done')
|
||||
this.done = true
|
||||
resolve(val)
|
||||
}
|
||||
}, {
|
||||
immediate: true
|
||||
}
|
||||
);
|
||||
})
|
||||
},
|
||||
async render(args) {
|
||||
try {
|
||||
await this.getSize(args)
|
||||
const {width} = args.css || args
|
||||
if(!width && this.parentWidth) {
|
||||
Object.assign(args, {width: this.parentWidth})
|
||||
}
|
||||
const newNode = await this.calcImage(args);
|
||||
await this.getWebViewInited()
|
||||
this.webview.evalJS(`source(${JSON.stringify(newNode)})`)
|
||||
await this.getWebViewDone()
|
||||
await sleep(this.afterDelay)
|
||||
if (this.isCanvasToTempFilePath) {
|
||||
const params = {
|
||||
fileType: this.fileType,
|
||||
quality: this.quality
|
||||
}
|
||||
this.webview.evalJS(`save(${JSON.stringify(params)})`)
|
||||
}
|
||||
return Promise.resolve()
|
||||
} catch (e) {
|
||||
this.$emit('fail', e)
|
||||
}
|
||||
},
|
||||
async calcImage(args) {
|
||||
let node = JSON.parse(JSON.stringify(args))
|
||||
const urlReg = /url\((.+)\)/
|
||||
const {backgroundImage} = node.css||{}
|
||||
const isBG = backgroundImage && urlReg.exec(backgroundImage)[1]
|
||||
const url = node.url || node.src || isBG
|
||||
if(['text', 'qrcode'].includes(node.type)) {
|
||||
return node
|
||||
}
|
||||
if ((node.type === "image" || isBG) && url && !isBase64(url) && (this.osName == 'ios' || !networkReg.test(url))) {
|
||||
let {path} = await getImageInfo(url, true)
|
||||
if (isBG) {
|
||||
node.css.backgroundImage = `url(${path})`
|
||||
} else {
|
||||
node.src = path
|
||||
}
|
||||
} else if (node.views && node.views.length) {
|
||||
for (let i = 0; i < node.views.length; i++) {
|
||||
node.views[i] = await this.calcImage(node.views[i])
|
||||
}
|
||||
}
|
||||
return node
|
||||
},
|
||||
async canvasToTempFilePath(args = {}) {
|
||||
if (!this.inited) {
|
||||
return this.$emit('fail', 'no init')
|
||||
}
|
||||
this.tempFilePath = []
|
||||
if (args.fileType == 'jpg') {
|
||||
args.fileType = 'jpeg'
|
||||
}
|
||||
this.webview.evalJS(`save(${JSON.stringify(args)})`)
|
||||
try {
|
||||
let tempFilePath = await this.getTempFilePath()
|
||||
tempFilePath = await this.setFilePath(tempFilePath, args)
|
||||
args.success({
|
||||
errMsg: "canvasToTempFilePath:ok",
|
||||
tempFilePath
|
||||
})
|
||||
} catch (e) {
|
||||
args.fail({
|
||||
error: e
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// #endif
|
||||
File diff suppressed because one or more lines are too long
@ -0,0 +1,56 @@
|
||||
export default {
|
||||
props: {
|
||||
board: Object,
|
||||
pathType: String, // 'base64'、'url'
|
||||
fileType: {
|
||||
type: String,
|
||||
default: 'png'
|
||||
},
|
||||
hidden: Boolean,
|
||||
quality: {
|
||||
type: Number,
|
||||
default: 1
|
||||
},
|
||||
css: [String, Object],
|
||||
// styles: [String, Object],
|
||||
width: [Number, String],
|
||||
height: [Number, String],
|
||||
pixelRatio: Number,
|
||||
customStyle: String,
|
||||
isCanvasToTempFilePath: Boolean,
|
||||
// useCanvasToTempFilePath: Boolean,
|
||||
sleep: {
|
||||
type: Number,
|
||||
default: 1000 / 30
|
||||
},
|
||||
beforeDelay: {
|
||||
type: Number,
|
||||
default: 100
|
||||
},
|
||||
afterDelay: {
|
||||
type: Number,
|
||||
default: 100
|
||||
},
|
||||
performance: Boolean,
|
||||
// #ifdef MP-WEIXIN || MP-TOUTIAO || MP-ALIPAY
|
||||
type: {
|
||||
type: String,
|
||||
default: '2d'
|
||||
},
|
||||
// #endif
|
||||
// #ifdef APP-NVUE
|
||||
hybrid: Boolean,
|
||||
timeout: {
|
||||
type: Number,
|
||||
default: 2000
|
||||
},
|
||||
// #endif
|
||||
// #ifdef H5 || APP-PLUS
|
||||
useCORS: Boolean,
|
||||
hidpi: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
// #endif
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,363 @@
|
||||
export const networkReg = /^(http|\/\/)/;
|
||||
export const isBase64 = (path) => /^data:image\/(\w+);base64/.test(path);
|
||||
export function sleep(delay) {
|
||||
return new Promise(resolve => setTimeout(resolve, delay))
|
||||
}
|
||||
let {platform, SDKVersion} = uni.getSystemInfoSync()
|
||||
export const isPC = /windows|mac/.test(platform)
|
||||
// 缓存图片
|
||||
let cache = {}
|
||||
export function isNumber(value) {
|
||||
return /^-?\d+(\.\d+)?$/.test(value);
|
||||
}
|
||||
export function toPx(value, baseSize, isDecimal = false) {
|
||||
// 如果是数字
|
||||
if (typeof value === 'number') {
|
||||
return value
|
||||
}
|
||||
// 如果是字符串数字
|
||||
if (isNumber(value)) {
|
||||
return value * 1
|
||||
}
|
||||
// 如果有单位
|
||||
if (typeof value === 'string') {
|
||||
const reg = /^-?([0-9]+)?([.]{1}[0-9]+){0,1}(em|rpx|px|%)$/g
|
||||
const results = reg.exec(value);
|
||||
if (!value || !results) {
|
||||
return 0;
|
||||
}
|
||||
const unit = results[3];
|
||||
value = parseFloat(value);
|
||||
let res = 0;
|
||||
if (unit === 'rpx') {
|
||||
res = uni.upx2px(value);
|
||||
} else if (unit === 'px') {
|
||||
res = value * 1;
|
||||
} else if (unit === '%') {
|
||||
res = value * toPx(baseSize) / 100;
|
||||
} else if (unit === 'em') {
|
||||
res = value * toPx(baseSize || 14);
|
||||
}
|
||||
return isDecimal ? res.toFixed(2) * 1 : Math.round(res);
|
||||
}
|
||||
return 0
|
||||
}
|
||||
|
||||
// 计算版本
|
||||
export function compareVersion(v1, v2) {
|
||||
v1 = v1.split('.')
|
||||
v2 = v2.split('.')
|
||||
const len = Math.max(v1.length, v2.length)
|
||||
while (v1.length < len) {
|
||||
v1.push('0')
|
||||
}
|
||||
while (v2.length < len) {
|
||||
v2.push('0')
|
||||
}
|
||||
for (let i = 0; i < len; i++) {
|
||||
const num1 = parseInt(v1[i], 10)
|
||||
const num2 = parseInt(v2[i], 10)
|
||||
|
||||
if (num1 > num2) {
|
||||
return 1
|
||||
} else if (num1 < num2) {
|
||||
return -1
|
||||
}
|
||||
}
|
||||
return 0
|
||||
}
|
||||
|
||||
function gte(version) {
|
||||
// #ifdef MP-ALIPAY
|
||||
SDKVersion = my.SDKVersion
|
||||
// #endif
|
||||
return compareVersion(SDKVersion, version) >= 0;
|
||||
}
|
||||
export function canIUseCanvas2d() {
|
||||
// #ifdef MP-WEIXIN
|
||||
return gte('2.9.2');
|
||||
// #endif
|
||||
// #ifdef MP-ALIPAY
|
||||
return gte('2.7.15');
|
||||
// #endif
|
||||
// #ifdef MP-TOUTIAO
|
||||
return gte('1.78.0');
|
||||
// #endif
|
||||
return false
|
||||
}
|
||||
|
||||
// #ifdef MP
|
||||
export const prefix = () => {
|
||||
// #ifdef MP-TOUTIAO
|
||||
return tt
|
||||
// #endif
|
||||
// #ifdef MP-WEIXIN
|
||||
return wx
|
||||
// #endif
|
||||
// #ifdef MP-BAIDU
|
||||
return swan
|
||||
// #endif
|
||||
// #ifdef MP-ALIPAY
|
||||
return my
|
||||
// #endif
|
||||
// #ifdef MP-QQ
|
||||
return qq
|
||||
// #endif
|
||||
// #ifdef MP-360
|
||||
return qh
|
||||
// #endif
|
||||
}
|
||||
// #endif
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* base64转路径
|
||||
* @param {Object} base64
|
||||
*/
|
||||
export function base64ToPath(base64) {
|
||||
const [, format] = /^data:image\/(\w+);base64,/.exec(base64) || [];
|
||||
|
||||
return new Promise((resolve, reject) => {
|
||||
// #ifdef MP
|
||||
const fs = uni.getFileSystemManager()
|
||||
//自定义文件名
|
||||
if (!format) {
|
||||
reject(new Error('ERROR_BASE64SRC_PARSE'))
|
||||
}
|
||||
const time = new Date().getTime();
|
||||
let pre = prefix()
|
||||
const filePath = `${pre.env.USER_DATA_PATH}/${time}.${format}`
|
||||
fs.writeFile({
|
||||
filePath,
|
||||
data: base64.split(',')[1],
|
||||
encoding: 'base64',
|
||||
success() {
|
||||
resolve(filePath)
|
||||
},
|
||||
fail(err) {
|
||||
console.error(err)
|
||||
reject(err)
|
||||
}
|
||||
})
|
||||
// #endif
|
||||
|
||||
// #ifdef H5
|
||||
// mime类型
|
||||
let mimeString = base64.split(',')[0].split(':')[1].split(';')[0];
|
||||
//base64 解码
|
||||
let byteString = atob(base64.split(',')[1]);
|
||||
//创建缓冲数组
|
||||
let arrayBuffer = new ArrayBuffer(byteString.length);
|
||||
//创建视图
|
||||
let intArray = new Uint8Array(arrayBuffer);
|
||||
for (let i = 0; i < byteString.length; i++) {
|
||||
intArray[i] = byteString.charCodeAt(i);
|
||||
}
|
||||
resolve(URL.createObjectURL(new Blob([intArray], {
|
||||
type: mimeString
|
||||
})))
|
||||
// #endif
|
||||
|
||||
// #ifdef APP-PLUS
|
||||
const bitmap = new plus.nativeObj.Bitmap('bitmap' + Date.now())
|
||||
bitmap.loadBase64Data(base64, () => {
|
||||
if (!format) {
|
||||
reject(new Error('ERROR_BASE64SRC_PARSE'))
|
||||
}
|
||||
const time = new Date().getTime();
|
||||
const filePath = `_doc/uniapp_temp/${time}.${format}`
|
||||
bitmap.save(filePath, {},
|
||||
() => {
|
||||
bitmap.clear()
|
||||
resolve(filePath)
|
||||
},
|
||||
(error) => {
|
||||
bitmap.clear()
|
||||
reject(error)
|
||||
})
|
||||
}, (error) => {
|
||||
bitmap.clear()
|
||||
reject(error)
|
||||
})
|
||||
// #endif
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 路径转base64
|
||||
* @param {Object} string
|
||||
*/
|
||||
export function pathToBase64(path) {
|
||||
if (/^data:/.test(path)) return path
|
||||
return new Promise((resolve, reject) => {
|
||||
// #ifdef H5
|
||||
let image = new Image();
|
||||
image.setAttribute("crossOrigin", 'Anonymous');
|
||||
image.onload = function() {
|
||||
let canvas = document.createElement('canvas');
|
||||
canvas.width = this.naturalWidth;
|
||||
canvas.height = this.naturalHeight;
|
||||
canvas.getContext('2d').drawImage(image, 0, 0);
|
||||
let result = canvas.toDataURL('image/png')
|
||||
resolve(result);
|
||||
canvas.height = canvas.width = 0
|
||||
}
|
||||
image.src = path + '?v=' + Math.random()
|
||||
image.onerror = (error) => {
|
||||
reject(error);
|
||||
};
|
||||
// #endif
|
||||
|
||||
// #ifdef MP
|
||||
if (uni.canIUse('getFileSystemManager')) {
|
||||
uni.getFileSystemManager().readFile({
|
||||
filePath: path,
|
||||
encoding: 'base64',
|
||||
success: (res) => {
|
||||
resolve('data:image/png;base64,' + res.data)
|
||||
},
|
||||
fail: (error) => {
|
||||
console.error({error, path})
|
||||
reject(error)
|
||||
}
|
||||
})
|
||||
}
|
||||
// #endif
|
||||
|
||||
// #ifdef APP-PLUS
|
||||
plus.io.resolveLocalFileSystemURL(getLocalFilePath(path), (entry) => {
|
||||
entry.file((file) => {
|
||||
const fileReader = new plus.io.FileReader()
|
||||
fileReader.onload = (data) => {
|
||||
resolve(data.target.result)
|
||||
}
|
||||
fileReader.onerror = (error) => {
|
||||
reject(error)
|
||||
}
|
||||
fileReader.readAsDataURL(file)
|
||||
}, reject)
|
||||
}, reject)
|
||||
// #endif
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
export function getImageInfo(path, useCORS) {
|
||||
const isCanvas2D = this && this.canvas && this.canvas.createImage
|
||||
return new Promise(async (resolve, reject) => {
|
||||
// let time = +new Date()
|
||||
let src = path.replace(/^@\//,'/')
|
||||
if (cache[path] && cache[path].errMsg) {
|
||||
resolve(cache[path])
|
||||
} else {
|
||||
try {
|
||||
// #ifdef MP || APP-PLUS
|
||||
if (isBase64(path) && (isCanvas2D ? isPC : true)) {
|
||||
src = await base64ToPath(path)
|
||||
}
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
if(useCORS) {
|
||||
src = await pathToBase64(path)
|
||||
}
|
||||
// #endif
|
||||
} catch (error) {
|
||||
reject({
|
||||
...error,
|
||||
src
|
||||
})
|
||||
}
|
||||
// #ifndef APP-NVUE
|
||||
if(isCanvas2D && !isPC) {
|
||||
const img = this.canvas.createImage()
|
||||
img.onload = function() {
|
||||
const image = {
|
||||
path: img,
|
||||
width: img.width,
|
||||
height: img.height
|
||||
}
|
||||
cache[path] = image
|
||||
resolve(cache[path])
|
||||
}
|
||||
img.onerror = function(err) {
|
||||
reject({err,path})
|
||||
}
|
||||
img.src = src
|
||||
return
|
||||
}
|
||||
// #endif
|
||||
uni.getImageInfo({
|
||||
src,
|
||||
success: (image) => {
|
||||
const localReg = /^\.|^\/(?=[^\/])/;
|
||||
// #ifdef MP-WEIXIN || MP-BAIDU || MP-QQ || MP-TOUTIAO
|
||||
image.path = localReg.test(src) ? `/${image.path}` : image.path;
|
||||
// #endif
|
||||
if(isCanvas2D) {
|
||||
const img = this.canvas.createImage()
|
||||
img.onload = function() {
|
||||
image.path = img
|
||||
cache[path] = image
|
||||
resolve(cache[path])
|
||||
}
|
||||
img.onerror = function(err) {
|
||||
reject({err,path})
|
||||
}
|
||||
img.src = src
|
||||
return
|
||||
}
|
||||
// #ifdef APP-PLUS
|
||||
// console.log('getImageInfo', +new Date() - time)
|
||||
// ios 比较严格 可能需要设置跨域
|
||||
if(uni.getSystemInfoSync().osName == 'ios' && useCORS) {
|
||||
pathToBase64(image.path).then(base64 => {
|
||||
image.path = base64
|
||||
cache[path] = image
|
||||
resolve(cache[path])
|
||||
}).catch(err => {
|
||||
console.error({err, path})
|
||||
reject({err,path})
|
||||
})
|
||||
return
|
||||
}
|
||||
// #endif
|
||||
cache[path] = image
|
||||
resolve(cache[path])
|
||||
},
|
||||
fail(err) {
|
||||
console.error({err, path})
|
||||
reject({err,path})
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
// #ifdef APP-PLUS
|
||||
const getLocalFilePath = (path) => {
|
||||
if (path.indexOf('_www') === 0 || path.indexOf('_doc') === 0 || path.indexOf('_documents') === 0 || path
|
||||
.indexOf('_downloads') === 0) {
|
||||
return path
|
||||
}
|
||||
if (path.indexOf('file://') === 0) {
|
||||
return path
|
||||
}
|
||||
if (path.indexOf('/storage/emulated/0/') === 0) {
|
||||
return path
|
||||
}
|
||||
if (path.indexOf('/') === 0) {
|
||||
const localFilePath = plus.io.convertAbsoluteFileSystem(path)
|
||||
if (localFilePath !== path) {
|
||||
return localFilePath
|
||||
} else {
|
||||
path = path.substr(1)
|
||||
}
|
||||
}
|
||||
return '_www/' + path
|
||||
}
|
||||
// #endif
|
||||
|
||||
|
||||
File diff suppressed because one or more lines are too long
@ -0,0 +1,119 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<title></title>
|
||||
<style type="text/css">
|
||||
html,
|
||||
body,
|
||||
canvas {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow-y: hidden;
|
||||
background-color: transparent;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<canvas id="lime-painter"></canvas>
|
||||
<script type="text/javascript" src="./uni.webview.1.5.3.js"></script>
|
||||
<script type="text/javascript" src="./painter.js"></script>
|
||||
<script>
|
||||
var cache = [];
|
||||
var painter = null;
|
||||
var canvas = null;
|
||||
var context = null;
|
||||
var timer = null;
|
||||
var pixelRatio = 1;
|
||||
console.log = function (...args) {
|
||||
postMessage(args);
|
||||
};
|
||||
// function stringify(key, value) {
|
||||
// if (typeof value === 'object' && value !== null) {
|
||||
// if (cache.indexOf(value) !== -1) {
|
||||
// return;
|
||||
// }
|
||||
// cache.push(value);
|
||||
// }
|
||||
// return value;
|
||||
// };
|
||||
|
||||
function emit(event, data) {
|
||||
postMessage({
|
||||
event,
|
||||
data: (typeof data !== 'object' && data !== null ? data : JSON.stringify(data))
|
||||
});
|
||||
cache = [];
|
||||
};
|
||||
function postMessage(data) {
|
||||
uni.postMessage({
|
||||
data
|
||||
});
|
||||
};
|
||||
|
||||
function init(dpr) {
|
||||
canvas = document.querySelector('#lime-painter');
|
||||
context = canvas.getContext('2d');
|
||||
pixelRatio = dpr || window.devicePixelRatio;
|
||||
painter = new Painter({
|
||||
id: 'lime-painter',
|
||||
context,
|
||||
canvas,
|
||||
pixelRatio,
|
||||
width: canvas.offsetWidth,
|
||||
height: canvas.offsetHeight,
|
||||
listen: {
|
||||
onProgress(v) {
|
||||
emit('progressChange', v);
|
||||
},
|
||||
onEffectFail(err) {
|
||||
//console.error(err)
|
||||
emit('fail', err);
|
||||
}
|
||||
}
|
||||
});
|
||||
emit('inited', true);
|
||||
};
|
||||
function save(args) {
|
||||
delete args.success;
|
||||
delete args.fail;
|
||||
clearTimeout(timer);
|
||||
timer = setTimeout(() => {
|
||||
const path = painter.save(args);
|
||||
if (typeof path == 'string') {
|
||||
const index = Math.ceil(path.length / 8);
|
||||
for (var i = 0; i < 8; i++) {
|
||||
if (i == 7) {
|
||||
emit('success', path.substr(i * index, index));
|
||||
} else {
|
||||
emit('file', path.substr(i * index, index));
|
||||
}
|
||||
};
|
||||
} else {
|
||||
// console.log('canvas no data')
|
||||
emit('fail', 'canvas no data');
|
||||
};
|
||||
}, 30);
|
||||
};
|
||||
async function source(args) {
|
||||
let size = await painter.source(args);
|
||||
emit('layoutChange', size);
|
||||
if(!canvas.height) {
|
||||
console.log('canvas no size')
|
||||
emit('fail', 'canvas no size');
|
||||
}
|
||||
painter.render().catch(err => {
|
||||
// console.error(err)
|
||||
emit('fail', err);
|
||||
});
|
||||
};
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,388 @@
|
||||
/*
|
||||
* HTML5 Parser By Sam Blowes
|
||||
*
|
||||
* Designed for HTML5 documents
|
||||
*
|
||||
* Original code by John Resig (ejohn.org)
|
||||
* http://ejohn.org/blog/pure-javascript-html-parser/
|
||||
* Original code by Erik Arvidsson, Mozilla Public License
|
||||
* http://erik.eae.net/simplehtmlparser/simplehtmlparser.js
|
||||
*
|
||||
* ----------------------------------------------------------------------------
|
||||
* License
|
||||
* ----------------------------------------------------------------------------
|
||||
*
|
||||
* This code is triple licensed using Apache Software License 2.0,
|
||||
* Mozilla Public License or GNU Public License
|
||||
*
|
||||
* ////////////////////////////////////////////////////////////////////////////
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License"); you may not
|
||||
* use this file except in compliance with the License. You may obtain a copy
|
||||
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* ////////////////////////////////////////////////////////////////////////////
|
||||
*
|
||||
* The contents of this file are subject to the Mozilla Public License
|
||||
* Version 1.1 (the "License"); you may not use this file except in
|
||||
* compliance with the License. You may obtain a copy of the License at
|
||||
* http://www.mozilla.org/MPL/
|
||||
*
|
||||
* Software distributed under the License is distributed on an "AS IS"
|
||||
* basis, WITHOUT WARRANTY OF ANY KIND, either express or implied. See the
|
||||
* License for the specific language governing rights and limitations
|
||||
* under the License.
|
||||
*
|
||||
* The Original Code is Simple HTML Parser.
|
||||
*
|
||||
* The Initial Developer of the Original Code is Erik Arvidsson.
|
||||
* Portions created by Erik Arvidssson are Copyright (C) 2004. All Rights
|
||||
* Reserved.
|
||||
*
|
||||
* ////////////////////////////////////////////////////////////////////////////
|
||||
*
|
||||
* This program is free software; you can redistribute it and/or
|
||||
* modify it under the terms of the GNU General Public License
|
||||
* as published by the Free Software Foundation; either version 2
|
||||
* of the License, or (at your option) any later version.
|
||||
*
|
||||
* This program is distributed in the hope that it will be useful,
|
||||
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
* GNU General Public License for more details.
|
||||
*
|
||||
* You should have received a copy of the GNU General Public License
|
||||
* along with this program; if not, write to the Free Software
|
||||
* Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
|
||||
*
|
||||
* ----------------------------------------------------------------------------
|
||||
* Usage
|
||||
* ----------------------------------------------------------------------------
|
||||
*
|
||||
* // Use like so:
|
||||
* HTMLParser(htmlString, {
|
||||
* start: function(tag, attrs, unary) {},
|
||||
* end: function(tag) {},
|
||||
* chars: function(text) {},
|
||||
* comment: function(text) {}
|
||||
* });
|
||||
*
|
||||
* // or to get an XML string:
|
||||
* HTMLtoXML(htmlString);
|
||||
*
|
||||
* // or to get an XML DOM Document
|
||||
* HTMLtoDOM(htmlString);
|
||||
*
|
||||
* // or to inject into an existing document/DOM node
|
||||
* HTMLtoDOM(htmlString, document);
|
||||
* HTMLtoDOM(htmlString, document.body);
|
||||
*
|
||||
*/
|
||||
// Regular Expressions for parsing tags and attributes
|
||||
var startTag = /^<([-A-Za-z0-9_]+)((?:\s+[a-zA-Z_:][-a-zA-Z0-9_:.]*(?:\s*=\s*(?:(?:"[^"]*")|(?:'[^']*')|[^>\s]+))?)*)\s*(\/?)>/;
|
||||
var endTag = /^<\/([-A-Za-z0-9_]+)[^>]*>/;
|
||||
var attr = /([a-zA-Z_:][-a-zA-Z0-9_:.]*)(?:\s*=\s*(?:(?:"((?:\\.|[^"])*)")|(?:'((?:\\.|[^'])*)')|([^>\s]+)))?/g; // Empty Elements - HTML 5
|
||||
|
||||
var empty = makeMap('area,base,basefont,br,col,frame,hr,img,input,link,meta,param,embed,command,keygen,source,track,wbr'); // Block Elements - HTML 5
|
||||
// fixed by xxx 将 ins 标签从块级名单中移除
|
||||
|
||||
var block = makeMap('a,address,article,applet,aside,audio,blockquote,button,canvas,center,dd,del,dir,div,dl,dt,fieldset,figcaption,figure,footer,form,frameset,h1,h2,h3,h4,h5,h6,header,hgroup,hr,iframe,isindex,li,map,menu,noframes,noscript,object,ol,output,p,pre,section,script,table,tbody,td,tfoot,th,thead,tr,ul,video'); // Inline Elements - HTML 5
|
||||
|
||||
var inline = makeMap('abbr,acronym,applet,b,basefont,bdo,big,br,button,cite,code,del,dfn,em,font,i,iframe,img,input,ins,kbd,label,map,object,q,s,samp,script,select,small,span,strike,strong,sub,sup,textarea,tt,u,var'); // Elements that you can, intentionally, leave open
|
||||
// (and which close themselves)
|
||||
|
||||
var closeSelf = makeMap('colgroup,dd,dt,li,options,p,td,tfoot,th,thead,tr'); // Attributes that have their values filled in disabled="disabled"
|
||||
|
||||
var fillAttrs = makeMap('checked,compact,declare,defer,disabled,ismap,multiple,nohref,noresize,noshade,nowrap,readonly,selected'); // Special Elements (can contain anything)
|
||||
|
||||
var special = makeMap('script,style');
|
||||
function HTMLParser(html, handler) {
|
||||
var index;
|
||||
var chars;
|
||||
var match;
|
||||
var stack = [];
|
||||
var last = html;
|
||||
|
||||
stack.last = function () {
|
||||
return this[this.length - 1];
|
||||
};
|
||||
|
||||
while (html) {
|
||||
chars = true; // Make sure we're not in a script or style element
|
||||
|
||||
if (!stack.last() || !special[stack.last()]) {
|
||||
// Comment
|
||||
if (html.indexOf('<!--') == 0) {
|
||||
index = html.indexOf('-->');
|
||||
|
||||
if (index >= 0) {
|
||||
if (handler.comment) {
|
||||
handler.comment(html.substring(4, index));
|
||||
}
|
||||
|
||||
html = html.substring(index + 3);
|
||||
chars = false;
|
||||
} // end tag
|
||||
|
||||
} else if (html.indexOf('</') == 0) {
|
||||
match = html.match(endTag);
|
||||
|
||||
if (match) {
|
||||
html = html.substring(match[0].length);
|
||||
match[0].replace(endTag, parseEndTag);
|
||||
chars = false;
|
||||
} // start tag
|
||||
|
||||
} else if (html.indexOf('<') == 0) {
|
||||
match = html.match(startTag);
|
||||
|
||||
if (match) {
|
||||
html = html.substring(match[0].length);
|
||||
match[0].replace(startTag, parseStartTag);
|
||||
chars = false;
|
||||
}
|
||||
}
|
||||
|
||||
if (chars) {
|
||||
index = html.indexOf('<');
|
||||
var text = index < 0 ? html : html.substring(0, index);
|
||||
html = index < 0 ? '' : html.substring(index);
|
||||
|
||||
if (handler.chars) {
|
||||
handler.chars(text);
|
||||
}
|
||||
}
|
||||
} else {
|
||||
html = html.replace(new RegExp('([\\s\\S]*?)<\/' + stack.last() + '[^>]*>'), function (all, text) {
|
||||
text = text.replace(/<!--([\s\S]*?)-->|<!\[CDATA\[([\s\S]*?)]]>/g, '$1$2');
|
||||
|
||||
if (handler.chars) {
|
||||
handler.chars(text);
|
||||
}
|
||||
|
||||
return '';
|
||||
});
|
||||
parseEndTag('', stack.last());
|
||||
}
|
||||
|
||||
if (html == last) {
|
||||
throw 'Parse Error: ' + html;
|
||||
}
|
||||
|
||||
last = html;
|
||||
} // Clean up any remaining tags
|
||||
|
||||
|
||||
parseEndTag();
|
||||
|
||||
function parseStartTag(tag, tagName, rest, unary) {
|
||||
tagName = tagName.toLowerCase();
|
||||
if (block[tagName]) {
|
||||
while (stack.last() && inline[stack.last()]) {
|
||||
parseEndTag('', stack.last());
|
||||
}
|
||||
}
|
||||
|
||||
if (closeSelf[tagName] && stack.last() == tagName) {
|
||||
parseEndTag('', tagName);
|
||||
}
|
||||
|
||||
unary = empty[tagName] || !!unary;
|
||||
|
||||
if (!unary) {
|
||||
stack.push(tagName);
|
||||
}
|
||||
|
||||
if (handler.start) {
|
||||
var attrs = [];
|
||||
rest.replace(attr, function (match, name) {
|
||||
var value = arguments[2] ? arguments[2] : arguments[3] ? arguments[3] : arguments[4] ? arguments[4] : fillAttrs[name] ? name : '';
|
||||
attrs.push({
|
||||
name: name,
|
||||
value: value,
|
||||
escaped: value.replace(/(^|[^\\])"/g, '$1\\\"') // "
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
if (handler.start) {
|
||||
handler.start(tagName, attrs, unary);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function parseEndTag(tag, tagName) {
|
||||
// If no tag name is provided, clean shop
|
||||
if (!tagName) {
|
||||
var pos = 0;
|
||||
} // Find the closest opened tag of the same type
|
||||
else {
|
||||
for (var pos = stack.length - 1; pos >= 0; pos--) {
|
||||
if (stack[pos] == tagName) {
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (pos >= 0) {
|
||||
// Close all the open elements, up the stack
|
||||
for (var i = stack.length - 1; i >= pos; i--) {
|
||||
if (handler.end) {
|
||||
handler.end(stack[i]);
|
||||
}
|
||||
} // Remove the open elements from the stack
|
||||
|
||||
|
||||
stack.length = pos;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function makeMap(str) {
|
||||
var obj = {};
|
||||
var items = str.split(',');
|
||||
|
||||
for (var i = 0; i < items.length; i++) {
|
||||
obj[items[i]] = true;
|
||||
}
|
||||
|
||||
return obj;
|
||||
}
|
||||
|
||||
function removeDOCTYPE(html) {
|
||||
return html.replace(/<\?xml.*\?>\n/, '').replace(/<!doctype.*>\n/, '').replace(/<!DOCTYPE.*>\n/, '');
|
||||
}
|
||||
|
||||
function parseAttrs(attrs) {
|
||||
return attrs.reduce(function (pre, attr) {
|
||||
var value = attr.value;
|
||||
var name = attr.name;
|
||||
if (pre[name]) {
|
||||
pre[name] = pre[name] + " " + value;
|
||||
} else {
|
||||
pre[name] = value;
|
||||
}
|
||||
|
||||
return pre;
|
||||
}, {});
|
||||
}
|
||||
function convertStyleStringToJSON(styleString) {
|
||||
var styles = styleString.split(";"); // 通过分号将样式字符串分割为多个样式声明
|
||||
var result = {};
|
||||
|
||||
styles.forEach(function(style) {
|
||||
var styleParts = style.split(":"); // 通过冒号将样式声明分割为属性和值
|
||||
var property = styleParts[0].trim();
|
||||
var value = styleParts[1] && styleParts[1].trim();
|
||||
|
||||
if (property && value) {
|
||||
result[property] = value; // 将属性和值添加到结果对象中
|
||||
}
|
||||
});
|
||||
|
||||
return result;
|
||||
}
|
||||
function parseHtml(html) {
|
||||
html = removeDOCTYPE(html);
|
||||
var stacks = [];
|
||||
var results = {
|
||||
node: 'root',
|
||||
children: []
|
||||
};
|
||||
HTMLParser(html, {
|
||||
start: function start(tag, attrs, unary) {
|
||||
var node = {
|
||||
name: tag
|
||||
};
|
||||
|
||||
if (attrs.length !== 0) {
|
||||
node.attrs = parseAttrs(attrs);
|
||||
node.styles = node.attrs.style ? convertStyleStringToJSON(node.attrs.style) : {}
|
||||
}
|
||||
|
||||
if(!node.type) {
|
||||
if(inline[node.name] && node.name !== 'img' ) {
|
||||
node.type = 'text';
|
||||
if(node.name == 'br') {
|
||||
node.text = '\n'
|
||||
} else if(node.name == 'strong'){
|
||||
node.styles.fontWeight = 'bold'
|
||||
}
|
||||
} else if(node.name == 'img'){
|
||||
node.type = 'image'
|
||||
node.src = node.attrs.src
|
||||
} else {
|
||||
node.type = 'view'
|
||||
if(['h1','h2','h3','h4','h5','h6'].includes(node.name)) {
|
||||
node.styles.fontWeight = 'bold'
|
||||
}
|
||||
}
|
||||
}
|
||||
if (unary) {
|
||||
var parent = stacks[0] || results;
|
||||
|
||||
if (!parent.children) {
|
||||
parent.children = [];
|
||||
}
|
||||
|
||||
parent.children.push(node);
|
||||
} else {
|
||||
stacks.unshift(node);
|
||||
}
|
||||
},
|
||||
end: function end(tag) {
|
||||
var node = stacks.shift();
|
||||
if (node.name !== tag) console.error('invalid state: mismatch end tag');
|
||||
if (stacks.length === 0) {
|
||||
results.children.push(node);
|
||||
} else {
|
||||
var parent = stacks[0];
|
||||
|
||||
if (!parent.children) {
|
||||
parent.children = [];
|
||||
}
|
||||
parent.children.push(node);
|
||||
}
|
||||
const isTextBox = node.children && node.children.length > 1 && node.children.every(child => {
|
||||
return ['text','image'].includes(child.type)
|
||||
})
|
||||
if(isTextBox) {
|
||||
node.type = 'textBox'
|
||||
}
|
||||
},
|
||||
chars: function chars(text) {
|
||||
var node = {
|
||||
type: 'text',
|
||||
text: text
|
||||
};
|
||||
|
||||
if (stacks.length === 0) {
|
||||
results.children.push(node);
|
||||
} else {
|
||||
var parent = stacks[0];
|
||||
|
||||
if (!parent.children) {
|
||||
parent.children = [];
|
||||
}
|
||||
|
||||
parent.children.push(node);
|
||||
}
|
||||
},
|
||||
comment: function comment(text) {
|
||||
var node = {
|
||||
node: 'comment',
|
||||
text: text
|
||||
};
|
||||
var parent = stacks[0];
|
||||
|
||||
if (!parent.children) {
|
||||
parent.children = [];
|
||||
}
|
||||
|
||||
parent.children.push(node);
|
||||
}
|
||||
});
|
||||
return results.children;
|
||||
}
|
||||
|
||||
export default parseHtml;
|
||||
@ -0,0 +1,45 @@
|
||||
// #ifdef H5
|
||||
export default {
|
||||
name: 'Keypress',
|
||||
props: {
|
||||
disable: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
const keyNames = {
|
||||
esc: ['Esc', 'Escape'],
|
||||
tab: 'Tab',
|
||||
enter: 'Enter',
|
||||
space: [' ', 'Spacebar'],
|
||||
up: ['Up', 'ArrowUp'],
|
||||
left: ['Left', 'ArrowLeft'],
|
||||
right: ['Right', 'ArrowRight'],
|
||||
down: ['Down', 'ArrowDown'],
|
||||
delete: ['Backspace', 'Delete', 'Del']
|
||||
}
|
||||
const listener = ($event) => {
|
||||
if (this.disable) {
|
||||
return
|
||||
}
|
||||
const keyName = Object.keys(keyNames).find(key => {
|
||||
const keyName = $event.key
|
||||
const value = keyNames[key]
|
||||
return value === keyName || (Array.isArray(value) && value.includes(keyName))
|
||||
})
|
||||
if (keyName) {
|
||||
// 避免和其他按键事件冲突
|
||||
setTimeout(() => {
|
||||
this.$emit(keyName, {})
|
||||
}, 0)
|
||||
}
|
||||
}
|
||||
document.addEventListener('keyup', listener)
|
||||
this.$once('hook:beforeDestroy', () => {
|
||||
document.removeEventListener('keyup', listener)
|
||||
})
|
||||
},
|
||||
render: () => {}
|
||||
}
|
||||
// #endif
|
||||
@ -0,0 +1,275 @@
|
||||
<template>
|
||||
<view class="uni-popup-dialog">
|
||||
<view class="uni-dialog-title">
|
||||
<text class="uni-dialog-title-text" :class="['uni-popup__'+dialogType]">{{titleText}}</text>
|
||||
</view>
|
||||
<view v-if="mode === 'base'" class="uni-dialog-content">
|
||||
<slot>
|
||||
<text class="uni-dialog-content-text">{{content}}</text>
|
||||
</slot>
|
||||
</view>
|
||||
<view v-else class="uni-dialog-content">
|
||||
<slot>
|
||||
<input class="uni-dialog-input" v-model="val" :type="inputType" :placeholder="placeholderText" :focus="focus" >
|
||||
</slot>
|
||||
</view>
|
||||
<view class="uni-dialog-button-group">
|
||||
<view class="uni-dialog-button" @click="closeDialog">
|
||||
<text class="uni-dialog-button-text">{{closeText}}</text>
|
||||
</view>
|
||||
<view class="uni-dialog-button uni-border-left" @click="onOk">
|
||||
<text class="uni-dialog-button-text uni-button-color">{{okText}}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import popup from '../uni-popup/popup.js'
|
||||
import {
|
||||
initVueI18n
|
||||
} from '@dcloudio/uni-i18n'
|
||||
import messages from '../uni-popup/i18n/index.js'
|
||||
const { t } = initVueI18n(messages)
|
||||
/**
|
||||
* PopUp 弹出层-对话框样式
|
||||
* @description 弹出层-对话框样式
|
||||
* @tutorial https://ext.dcloud.net.cn/plugin?id=329
|
||||
* @property {String} value input 模式下的默认值
|
||||
* @property {String} placeholder input 模式下输入提示
|
||||
* @property {String} type = [success|warning|info|error] 主题样式
|
||||
* @value success 成功
|
||||
* @value warning 提示
|
||||
* @value info 消息
|
||||
* @value error 错误
|
||||
* @property {String} mode = [base|input] 模式、
|
||||
* @value base 基础对话框
|
||||
* @value input 可输入对话框
|
||||
* @property {String} content 对话框内容
|
||||
* @property {Boolean} beforeClose 是否拦截取消事件
|
||||
* @event {Function} confirm 点击确认按钮触发
|
||||
* @event {Function} close 点击取消按钮触发
|
||||
*/
|
||||
|
||||
export default {
|
||||
name: "uniPopupDialog",
|
||||
mixins: [popup],
|
||||
emits:['confirm','close'],
|
||||
props: {
|
||||
inputType:{
|
||||
type: String,
|
||||
default: 'text'
|
||||
},
|
||||
value: {
|
||||
type: [String, Number],
|
||||
default: ''
|
||||
},
|
||||
placeholder: {
|
||||
type: [String, Number],
|
||||
default: ''
|
||||
},
|
||||
type: {
|
||||
type: String,
|
||||
default: 'error'
|
||||
},
|
||||
mode: {
|
||||
type: String,
|
||||
default: 'base'
|
||||
},
|
||||
title: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
content: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
beforeClose: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
cancelText:{
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
confirmText:{
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogType: 'error',
|
||||
focus: false,
|
||||
val: ""
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
okText() {
|
||||
return this.confirmText || t("uni-popup.ok")
|
||||
},
|
||||
closeText() {
|
||||
return this.cancelText || t("uni-popup.cancel")
|
||||
},
|
||||
placeholderText() {
|
||||
return this.placeholder || t("uni-popup.placeholder")
|
||||
},
|
||||
titleText() {
|
||||
return this.title || t("uni-popup.title")
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
type(val) {
|
||||
this.dialogType = val
|
||||
},
|
||||
mode(val) {
|
||||
if (val === 'input') {
|
||||
this.dialogType = 'info'
|
||||
}
|
||||
},
|
||||
value(val) {
|
||||
this.val = val
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// 对话框遮罩不可点击
|
||||
this.popup.disableMask()
|
||||
// this.popup.closeMask()
|
||||
if (this.mode === 'input') {
|
||||
this.dialogType = 'info'
|
||||
this.val = this.value
|
||||
} else {
|
||||
this.dialogType = this.type
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.focus = true
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 点击确认按钮
|
||||
*/
|
||||
onOk() {
|
||||
if (this.mode === 'input'){
|
||||
this.$emit('confirm', this.val)
|
||||
}else{
|
||||
this.$emit('confirm')
|
||||
}
|
||||
if(this.beforeClose) return
|
||||
this.popup.close()
|
||||
},
|
||||
/**
|
||||
* 点击取消按钮
|
||||
*/
|
||||
closeDialog() {
|
||||
this.$emit('close')
|
||||
if(this.beforeClose) return
|
||||
this.popup.close()
|
||||
},
|
||||
close(){
|
||||
this.popup.close()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" >
|
||||
.uni-popup-dialog {
|
||||
width: 300px;
|
||||
border-radius: 11px;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.uni-dialog-title {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
padding-top: 25px;
|
||||
}
|
||||
|
||||
.uni-dialog-title-text {
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.uni-dialog-content {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.uni-dialog-content-text {
|
||||
font-size: 14px;
|
||||
color: #6C6C6C;
|
||||
}
|
||||
|
||||
.uni-dialog-button-group {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
border-top-color: #f5f5f5;
|
||||
border-top-style: solid;
|
||||
border-top-width: 1px;
|
||||
}
|
||||
|
||||
.uni-dialog-button {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
|
||||
flex: 1;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 45px;
|
||||
}
|
||||
|
||||
.uni-border-left {
|
||||
border-left-color: #f0f0f0;
|
||||
border-left-style: solid;
|
||||
border-left-width: 1px;
|
||||
}
|
||||
|
||||
.uni-dialog-button-text {
|
||||
font-size: 16px;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.uni-button-color {
|
||||
color: #007aff;
|
||||
}
|
||||
|
||||
.uni-dialog-input {
|
||||
flex: 1;
|
||||
font-size: 14px;
|
||||
border: 1px #eee solid;
|
||||
height: 40px;
|
||||
padding: 0 10px;
|
||||
border-radius: 5px;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
.uni-popup__success {
|
||||
color: #4cd964;
|
||||
}
|
||||
|
||||
.uni-popup__warn {
|
||||
color: #f0ad4e;
|
||||
}
|
||||
|
||||
.uni-popup__error {
|
||||
color: #dd524d;
|
||||
}
|
||||
|
||||
.uni-popup__info {
|
||||
color: #909399;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,187 @@
|
||||
<template>
|
||||
<view class="uni-popup-share">
|
||||
<view class="uni-share-title"><text class="uni-share-title-text">{{shareTitleText}}</text></view>
|
||||
<view class="uni-share-content">
|
||||
<view class="uni-share-content-box">
|
||||
<view class="uni-share-content-item" v-for="(item,index) in bottomData" :key="index" @click.stop="select(item,index)">
|
||||
<image class="uni-share-image" :src="item.icon" mode="aspectFill"></image>
|
||||
<text class="uni-share-text">{{item.text}}</text>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<view class="uni-share-button-box">
|
||||
<button class="uni-share-button" @click="close">{{cancelText}}</button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import popup from '../uni-popup/popup.js'
|
||||
import {
|
||||
initVueI18n
|
||||
} from '@dcloudio/uni-i18n'
|
||||
import messages from '../uni-popup/i18n/index.js'
|
||||
const { t } = initVueI18n(messages)
|
||||
export default {
|
||||
name: 'UniPopupShare',
|
||||
mixins:[popup],
|
||||
emits:['select'],
|
||||
props: {
|
||||
title: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
beforeClose: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
bottomData: [{
|
||||
text: '微信',
|
||||
icon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/c2b17470-50be-11eb-b680-7980c8a877b8.png',
|
||||
name: 'wx'
|
||||
},
|
||||
{
|
||||
text: '支付宝',
|
||||
icon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/d684ae40-50be-11eb-8ff1-d5dcf8779628.png',
|
||||
name: 'wx'
|
||||
},
|
||||
{
|
||||
text: 'QQ',
|
||||
icon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/e7a79520-50be-11eb-b997-9918a5dda011.png',
|
||||
name: 'qq'
|
||||
},
|
||||
{
|
||||
text: '新浪',
|
||||
icon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/0dacdbe0-50bf-11eb-8ff1-d5dcf8779628.png',
|
||||
name: 'sina'
|
||||
},
|
||||
// {
|
||||
// text: '百度',
|
||||
// icon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/1ec6e920-50bf-11eb-8a36-ebb87efcf8c0.png',
|
||||
// name: 'copy'
|
||||
// },
|
||||
// {
|
||||
// text: '其他',
|
||||
// icon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/2e0fdfe0-50bf-11eb-b997-9918a5dda011.png',
|
||||
// name: 'more'
|
||||
// }
|
||||
]
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
computed: {
|
||||
cancelText() {
|
||||
return t("uni-popup.cancel")
|
||||
},
|
||||
shareTitleText() {
|
||||
return this.title || t("uni-popup.shareTitle")
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 选择内容
|
||||
*/
|
||||
select(item, index) {
|
||||
this.$emit('select', {
|
||||
item,
|
||||
index
|
||||
})
|
||||
this.close()
|
||||
|
||||
},
|
||||
/**
|
||||
* 关闭窗口
|
||||
*/
|
||||
close() {
|
||||
if(this.beforeClose) return
|
||||
this.popup.close()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" >
|
||||
.uni-popup-share {
|
||||
background-color: #fff;
|
||||
border-top-left-radius: 11px;
|
||||
border-top-right-radius: 11px;
|
||||
}
|
||||
.uni-share-title {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 40px;
|
||||
}
|
||||
.uni-share-title-text {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
}
|
||||
.uni-share-content {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
.uni-share-content-box {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
width: 360px;
|
||||
}
|
||||
|
||||
.uni-share-content-item {
|
||||
width: 90px;
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
padding: 10px 0;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.uni-share-content-item:active {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.uni-share-image {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.uni-share-text {
|
||||
margin-top: 10px;
|
||||
font-size: 14px;
|
||||
color: #3B4144;
|
||||
}
|
||||
|
||||
.uni-share-button-box {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
padding: 10px 15px;
|
||||
}
|
||||
|
||||
.uni-share-button {
|
||||
flex: 1;
|
||||
border-radius: 50px;
|
||||
color: #666;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.uni-share-button::after {
|
||||
border-radius: 50px;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,7 @@
|
||||
{
|
||||
"uni-popup.cancel": "cancel",
|
||||
"uni-popup.ok": "ok",
|
||||
"uni-popup.placeholder": "pleace enter",
|
||||
"uni-popup.title": "Hint",
|
||||
"uni-popup.shareTitle": "Share to"
|
||||
}
|
||||
@ -0,0 +1,8 @@
|
||||
import en from './en.json'
|
||||
import zhHans from './zh-Hans.json'
|
||||
import zhHant from './zh-Hant.json'
|
||||
export default {
|
||||
en,
|
||||
'zh-Hans': zhHans,
|
||||
'zh-Hant': zhHant
|
||||
}
|
||||
@ -0,0 +1,7 @@
|
||||
{
|
||||
"uni-popup.cancel": "取消",
|
||||
"uni-popup.ok": "确定",
|
||||
"uni-popup.placeholder": "请输入",
|
||||
"uni-popup.title": "提示",
|
||||
"uni-popup.shareTitle": "分享到"
|
||||
}
|
||||
@ -0,0 +1,7 @@
|
||||
{
|
||||
"uni-popup.cancel": "取消",
|
||||
"uni-popup.ok": "確定",
|
||||
"uni-popup.placeholder": "請輸入",
|
||||
"uni-popup.title": "提示",
|
||||
"uni-popup.shareTitle": "分享到"
|
||||
}
|
||||
@ -0,0 +1,45 @@
|
||||
// #ifdef H5
|
||||
export default {
|
||||
name: 'Keypress',
|
||||
props: {
|
||||
disable: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
const keyNames = {
|
||||
esc: ['Esc', 'Escape'],
|
||||
tab: 'Tab',
|
||||
enter: 'Enter',
|
||||
space: [' ', 'Spacebar'],
|
||||
up: ['Up', 'ArrowUp'],
|
||||
left: ['Left', 'ArrowLeft'],
|
||||
right: ['Right', 'ArrowRight'],
|
||||
down: ['Down', 'ArrowDown'],
|
||||
delete: ['Backspace', 'Delete', 'Del']
|
||||
}
|
||||
const listener = ($event) => {
|
||||
if (this.disable) {
|
||||
return
|
||||
}
|
||||
const keyName = Object.keys(keyNames).find(key => {
|
||||
const keyName = $event.key
|
||||
const value = keyNames[key]
|
||||
return value === keyName || (Array.isArray(value) && value.includes(keyName))
|
||||
})
|
||||
if (keyName) {
|
||||
// 避免和其他按键事件冲突
|
||||
setTimeout(() => {
|
||||
this.$emit(keyName, {})
|
||||
}, 0)
|
||||
}
|
||||
}
|
||||
document.addEventListener('keyup', listener)
|
||||
// this.$once('hook:beforeDestroy', () => {
|
||||
// document.removeEventListener('keyup', listener)
|
||||
// })
|
||||
},
|
||||
render: () => {}
|
||||
}
|
||||
// #endif
|
||||
@ -0,0 +1,26 @@
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.popup = this.getParent()
|
||||
},
|
||||
methods:{
|
||||
/**
|
||||
* 获取父元素实例
|
||||
*/
|
||||
getParent(name = 'uniPopup') {
|
||||
let parent = this.$parent;
|
||||
let parentName = parent.$options.name;
|
||||
while (parentName !== name) {
|
||||
parent = parent.$parent;
|
||||
if (!parent) return false
|
||||
parentName = parent.$options.name;
|
||||
}
|
||||
return parent;
|
||||
},
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,90 @@
|
||||
<template>
|
||||
<view class="popup-root" v-if="isOpen" v-show="isShow" @click="clickMask">
|
||||
<view @click.stop>
|
||||
<slot></slot>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
type CloseCallBack = ()=> void;
|
||||
let closeCallBack:CloseCallBack = () :void => {};
|
||||
export default {
|
||||
emits:["close","clickMask"],
|
||||
data() {
|
||||
return {
|
||||
isShow:false,
|
||||
isOpen:false
|
||||
}
|
||||
},
|
||||
props: {
|
||||
maskClick: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
// 设置show = true 时，如果没有 open 需要设置为 open
|
||||
isShow:{
|
||||
handler(isShow) {
|
||||
// console.log("isShow",isShow)
|
||||
if(isShow && this.isOpen == false){
|
||||
this.isOpen = true
|
||||
}
|
||||
},
|
||||
immediate:true
|
||||
},
|
||||
// 设置isOpen = true 时，如果没有 isShow 需要设置为 isShow
|
||||
isOpen:{
|
||||
handler(isOpen) {
|
||||
// console.log("isOpen",isOpen)
|
||||
if(isOpen && this.isShow == false){
|
||||
this.isShow = true
|
||||
}
|
||||
},
|
||||
immediate:true
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
open(){
|
||||
// ...funs : CloseCallBack[]
|
||||
// if(funs.length > 0){
|
||||
// closeCallBack = funs[0]
|
||||
// }
|
||||
this.isOpen = true;
|
||||
},
|
||||
clickMask(){
|
||||
if(this.maskClick == true){
|
||||
this.$emit('clickMask')
|
||||
this.close()
|
||||
}
|
||||
},
|
||||
close(): void{
|
||||
this.isOpen = false;
|
||||
this.$emit('close')
|
||||
closeCallBack()
|
||||
},
|
||||
hiden(){
|
||||
this.isShow = false
|
||||
},
|
||||
show(){
|
||||
this.isShow = true
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.popup-root {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 750rpx;
|
||||
height: 100%;
|
||||
flex: 1;
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 99;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,87 @@
|
||||
{
|
||||
"id": "uni-popup",
|
||||
"displayName": "uni-popup 弹出层",
|
||||
"version": "1.8.4",
|
||||
"description": " Popup 组件，提供常用的弹层",
|
||||
"keywords": [
|
||||
"uni-ui",
|
||||
"弹出层",
|
||||
"弹窗",
|
||||
"popup",
|
||||
"弹框"
|
||||
],
|
||||
"repository": "https://github.com/dcloudio/uni-ui",
|
||||
"engines": {
|
||||
"HBuilderX": ""
|
||||
},
|
||||
"directories": {
|
||||
"example": "../../temps/example_temps"
|
||||
},
|
||||
"dcloudext": {
|
||||
"sale": {
|
||||
"regular": {
|
||||
"price": "0.00"
|
||||
},
|
||||
"sourcecode": {
|
||||
"price": "0.00"
|
||||
}
|
||||
},
|
||||
"contact": {
|
||||
"qq": ""
|
||||
},
|
||||
"declaration": {
|
||||
"ads": "无",
|
||||
"data": "无",
|
||||
"permissions": "无"
|
||||
},
|
||||
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui",
|
||||
"type": "component-vue"
|
||||
},
|
||||
"uni_modules": {
|
||||
"dependencies": [
|
||||
"uni-scss",
|
||||
"uni-transition"
|
||||
],
|
||||
"encrypt": [],
|
||||
"platforms": {
|
||||
"cloud": {
|
||||
"tcb": "y",
|
||||
"aliyun": "y"
|
||||
},
|
||||
"client": {
|
||||
"App": {
|
||||
"app-vue": "y",
|
||||
"app-nvue": "y"
|
||||
},
|
||||
"H5-mobile": {
|
||||
"Safari": "y",
|
||||
"Android Browser": "y",
|
||||
"微信浏览器(Android)": "y",
|
||||
"QQ浏览器(Android)": "y"
|
||||
},
|
||||
"H5-pc": {
|
||||
"Chrome": "y",
|
||||
"IE": "y",
|
||||
"Edge": "y",
|
||||
"Firefox": "y",
|
||||
"Safari": "y"
|
||||
},
|
||||
"小程序": {
|
||||
"微信": "y",
|
||||
"阿里": "y",
|
||||
"百度": "y",
|
||||
"字节跳动": "y",
|
||||
"QQ": "y"
|
||||
},
|
||||
"快应用": {
|
||||
"华为": "u",
|
||||
"联盟": "u"
|
||||
},
|
||||
"Vue": {
|
||||
"vue2": "y",
|
||||
"vue3": "y"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1 @@
|
||||
@import './styles/index.scss';
|
||||
@ -0,0 +1,7 @@
|
||||
@import './setting/_variables.scss';
|
||||
@import './setting/_border.scss';
|
||||
@import './setting/_color.scss';
|
||||
@import './setting/_space.scss';
|
||||
@import './setting/_radius.scss';
|
||||
@import './setting/_text.scss';
|
||||
@import './setting/_styles.scss';
|
||||
@ -0,0 +1,3 @@
|
||||
.uni-border {
|
||||
border: 1px $uni-border-1 solid;
|
||||
}
|
||||
@ -0,0 +1,55 @@
|
||||
@mixin radius($r,$d:null ,$important: false){
|
||||
$radius-value:map-get($uni-radius, $r) if($important, !important, null);
|
||||
// Key exists within the $uni-radius variable
|
||||
@if (map-has-key($uni-radius, $r) and $d){
|
||||
@if $d == t {
|
||||
border-top-left-radius:$radius-value;
|
||||
border-top-right-radius:$radius-value;
|
||||
}@else if $d == r {
|
||||
border-top-right-radius:$radius-value;
|
||||
border-bottom-right-radius:$radius-value;
|
||||
}@else if $d == b {
|
||||
border-bottom-left-radius:$radius-value;
|
||||
border-bottom-right-radius:$radius-value;
|
||||
}@else if $d == l {
|
||||
border-top-left-radius:$radius-value;
|
||||
border-bottom-left-radius:$radius-value;
|
||||
}@else if $d == tl {
|
||||
border-top-left-radius:$radius-value;
|
||||
}@else if $d == tr {
|
||||
border-top-right-radius:$radius-value;
|
||||
}@else if $d == br {
|
||||
border-bottom-right-radius:$radius-value;
|
||||
}@else if $d == bl {
|
||||
border-bottom-left-radius:$radius-value;
|
||||
}
|
||||
}@else{
|
||||
border-radius:$radius-value;
|
||||
}
|
||||
}
|
||||
|
||||
@each $key, $child in $uni-radius {
|
||||
@if($key){
|
||||
.uni-radius-#{"" + $key} {
|
||||
@include radius($key)
|
||||
}
|
||||
}@else{
|
||||
.uni-radius {
|
||||
@include radius($key)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@each $direction in t, r, b, l,tl, tr, br, bl {
|
||||
@each $key, $child in $uni-radius {
|
||||
@if($key){
|
||||
.uni-radius-#{"" + $direction}-#{"" + $key} {
|
||||
@include radius($key,$direction,false)
|
||||
}
|
||||
}@else{
|
||||
.uni-radius-#{$direction} {
|
||||
@include radius($key,$direction,false)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,56 @@
|
||||
|
||||
@mixin fn($space,$direction,$size,$n) {
|
||||
@if $n {
|
||||
#{$space}-#{$direction}: #{$size*$uni-space-root}px
|
||||
} @else {
|
||||
#{$space}-#{$direction}: #{-$size*$uni-space-root}px
|
||||
}
|
||||
}
|
||||
@mixin get-styles($direction,$i,$space,$n){
|
||||
@if $direction == t {
|
||||
@include fn($space, top,$i,$n);
|
||||
}
|
||||
@if $direction == r {
|
||||
@include fn($space, right,$i,$n);
|
||||
}
|
||||
@if $direction == b {
|
||||
@include fn($space, bottom,$i,$n);
|
||||
}
|
||||
@if $direction == l {
|
||||
@include fn($space, left,$i,$n);
|
||||
}
|
||||
@if $direction == x {
|
||||
@include fn($space, left,$i,$n);
|
||||
@include fn($space, right,$i,$n);
|
||||
}
|
||||
@if $direction == y {
|
||||
@include fn($space, top,$i,$n);
|
||||
@include fn($space, bottom,$i,$n);
|
||||
}
|
||||
@if $direction == a {
|
||||
@if $n {
|
||||
#{$space}:#{$i*$uni-space-root}px;
|
||||
} @else {
|
||||
#{$space}:#{-$i*$uni-space-root}px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@each $orientation in m,p {
|
||||
$space: margin;
|
||||
@if $orientation == m {
|
||||
$space: margin;
|
||||
} @else {
|
||||
$space: padding;
|
||||
}
|
||||
@for $i from 0 through 16 {
|
||||
@each $direction in t, r, b, l, x, y, a {
|
||||
.uni-#{$orientation}#{$direction}-#{$i} {
|
||||
@include get-styles($direction,$i,$space,true);
|
||||
}
|
||||
.uni-#{$orientation}#{$direction}-n#{$i} {
|
||||
@include get-styles($direction,$i,$space,false);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,167 @@
|
||||
/* #ifndef APP-NVUE */
|
||||
|
||||
$-color-white:#fff;
|
||||
$-color-black:#000;
|
||||
@mixin base-style($color) {
|
||||
color: #fff;
|
||||
background-color: $color;
|
||||
border-color: mix($-color-black, $color, 8%);
|
||||
&:not([hover-class]):active {
|
||||
background: mix($-color-black, $color, 10%);
|
||||
border-color: mix($-color-black, $color, 20%);
|
||||
color: $-color-white;
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
@mixin is-color($color) {
|
||||
@include base-style($color);
|
||||
&[loading] {
|
||||
@include base-style($color);
|
||||
&::before {
|
||||
margin-right:5px;
|
||||
}
|
||||
}
|
||||
&[disabled] {
|
||||
&,
|
||||
&[loading],
|
||||
&:not([hover-class]):active {
|
||||
color: $-color-white;
|
||||
border-color: mix(darken($color,10%), $-color-white);
|
||||
background-color: mix($color, $-color-white);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@mixin base-plain-style($color) {
|
||||
color:$color;
|
||||
background-color: mix($-color-white, $color, 90%);
|
||||
border-color: mix($-color-white, $color, 70%);
|
||||
&:not([hover-class]):active {
|
||||
background: mix($-color-white, $color, 80%);
|
||||
color: $color;
|
||||
outline: none;
|
||||
border-color: mix($-color-white, $color, 50%);
|
||||
}
|
||||
}
|
||||
@mixin is-plain($color){
|
||||
&[plain] {
|
||||
@include base-plain-style($color);
|
||||
&[loading] {
|
||||
@include base-plain-style($color);
|
||||
&::before {
|
||||
margin-right:5px;
|
||||
}
|
||||
}
|
||||
&[disabled] {
|
||||
&,
|
||||
&:active {
|
||||
color: mix($-color-white, $color, 40%);
|
||||
background-color: mix($-color-white, $color, 90%);
|
||||
border-color: mix($-color-white, $color, 80%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.uni-btn {
|
||||
margin: 5px;
|
||||
color: #393939;
|
||||
border:1px solid #ccc;
|
||||
font-size: 16px;
|
||||
font-weight: 200;
|
||||
background-color: #F9F9F9;
|
||||
// TODO 暂时处理边框隐藏一边的问题
|
||||
overflow: visible;
|
||||
&::after{
|
||||
border: none;
|
||||
}
|
||||
|
||||
&:not([type]),&[type=default] {
|
||||
color: #999;
|
||||
&[loading] {
|
||||
background: none;
|
||||
&::before {
|
||||
margin-right:5px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
&[disabled]{
|
||||
color: mix($-color-white, #999, 60%);
|
||||
&,
|
||||
&[loading],
|
||||
&:active {
|
||||
color: mix($-color-white, #999, 60%);
|
||||
background-color: mix($-color-white,$-color-black , 98%);
|
||||
border-color: mix($-color-white, #999, 85%);
|
||||
}
|
||||
}
|
||||
|
||||
&[plain] {
|
||||
color: #999;
|
||||
background: none;
|
||||
border-color: $uni-border-1;
|
||||
&:not([hover-class]):active {
|
||||
background: none;
|
||||
color: mix($-color-white, $-color-black, 80%);
|
||||
border-color: mix($-color-white, $-color-black, 90%);
|
||||
outline: none;
|
||||
}
|
||||
&[disabled]{
|
||||
&,
|
||||
&[loading],
|
||||
&:active {
|
||||
background: none;
|
||||
color: mix($-color-white, #999, 60%);
|
||||
border-color: mix($-color-white, #999, 85%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:not([hover-class]):active {
|
||||
color: mix($-color-white, $-color-black, 50%);
|
||||
}
|
||||
|
||||
&[size=mini] {
|
||||
font-size: 16px;
|
||||
font-weight: 200;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
&.uni-btn-small {
|
||||
font-size: 14px;
|
||||
}
|
||||
&.uni-btn-mini {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
&.uni-btn-radius {
|
||||
border-radius: 999px;
|
||||
}
|
||||
&[type=primary] {
|
||||
@include is-color($uni-primary);
|
||||
@include is-plain($uni-primary)
|
||||
}
|
||||
&[type=success] {
|
||||
@include is-color($uni-success);
|
||||
@include is-plain($uni-success)
|
||||
}
|
||||
&[type=error] {
|
||||
@include is-color($uni-error);
|
||||
@include is-plain($uni-error)
|
||||
}
|
||||
&[type=warning] {
|
||||
@include is-color($uni-warning);
|
||||
@include is-plain($uni-warning)
|
||||
}
|
||||
&[type=info] {
|
||||
@include is-color($uni-info);
|
||||
@include is-plain($uni-info)
|
||||
}
|
||||
}
|
||||
/* #endif */
|
||||
@ -0,0 +1,24 @@
|
||||
@mixin get-styles($k,$c) {
|
||||
@if $k == size or $k == weight{
|
||||
font-#{$k}:#{$c}
|
||||
}@else{
|
||||
#{$k}:#{$c}
|
||||
}
|
||||
}
|
||||
|
||||
@each $key, $child in $uni-headings {
|
||||
/* #ifndef APP-NVUE */
|
||||
.uni-#{$key} {
|
||||
@each $k, $c in $child {
|
||||
@include get-styles($k,$c)
|
||||
}
|
||||
}
|
||||
/* #endif */
|
||||
/* #ifdef APP-NVUE */
|
||||
.container .uni-#{$key} {
|
||||
@each $k, $c in $child {
|
||||
@include get-styles($k,$c)
|
||||
}
|
||||
}
|
||||
/* #endif */
|
||||
}
|
||||
@ -0,0 +1,19 @@
|
||||
// 合并 map
|
||||
@function map-deep-merge($parent-map, $child-map){
|
||||
$result: $parent-map;
|
||||
@each $key, $child in $child-map {
|
||||
$parent-has-key: map-has-key($result, $key);
|
||||
$parent-value: map-get($result, $key);
|
||||
$parent-type: type-of($parent-value);
|
||||
$child-type: type-of($child);
|
||||
$parent-is-map: $parent-type == map;
|
||||
$child-is-map: $child-type == map;
|
||||
|
||||
@if (not $parent-has-key) or ($parent-type != $child-type) or (not ($parent-is-map and $child-is-map)){
|
||||
$result: map-merge($result, ( $key: $child ));
|
||||
}@else {
|
||||
$result: map-merge($result, ( $key: map-deep-merge($parent-value, $child) ));
|
||||
}
|
||||
}
|
||||
@return $result;
|
||||
};
|
||||
@ -0,0 +1,31 @@
|
||||
// 间距基础倍数
|
||||
$uni-space-root: 2;
|
||||
// 边框半径默认值
|
||||
$uni-radius-root:5px;
|
||||
// 主色
|
||||
$uni-primary: #2979ff;
|
||||
// 辅助色
|
||||
$uni-success: #4cd964;
|
||||
// 警告色
|
||||
$uni-warning: #f0ad4e;
|
||||
// 错误色
|
||||
$uni-error: #dd524d;
|
||||
// 描述色
|
||||
$uni-info: #909399;
|
||||
// 中性色
|
||||
$uni-main-color: #303133;
|
||||
$uni-base-color: #606266;
|
||||
$uni-secondary-color: #909399;
|
||||
$uni-extra-color: #C0C4CC;
|
||||
// 背景色
|
||||
$uni-bg-color: #f5f5f5;
|
||||
// 边框颜色
|
||||
$uni-border-1: #DCDFE6;
|
||||
$uni-border-2: #E4E7ED;
|
||||
$uni-border-3: #EBEEF5;
|
||||
$uni-border-4: #F2F6FC;
|
||||
|
||||
// 常规色
|
||||
$uni-black: #000000;
|
||||
$uni-white: #ffffff;
|
||||
$uni-transparent: rgba($color: #000000, $alpha: 0);
|
||||
@ -0,0 +1,84 @@
|
||||
{
|
||||
"id": "uni-transition",
|
||||
"displayName": "uni-transition 过渡动画",
|
||||
"version": "1.3.2",
|
||||
"description": "元素的简单过渡动画",
|
||||
"keywords": [
|
||||
"uni-ui",
|
||||
"uniui",
|
||||
"动画",
|
||||
"过渡",
|
||||
"过渡动画"
|
||||
],
|
||||
"repository": "https://github.com/dcloudio/uni-ui",
|
||||
"engines": {
|
||||
"HBuilderX": ""
|
||||
},
|
||||
"directories": {
|
||||
"example": "../../temps/example_temps"
|
||||
},
|
||||
"dcloudext": {
|
||||
"sale": {
|
||||
"regular": {
|
||||
"price": "0.00"
|
||||
},
|
||||
"sourcecode": {
|
||||
"price": "0.00"
|
||||
}
|
||||
},
|
||||
"contact": {
|
||||
"qq": ""
|
||||
},
|
||||
"declaration": {
|
||||
"ads": "无",
|
||||
"data": "无",
|
||||
"permissions": "无"
|
||||
},
|
||||
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui",
|
||||
"type": "component-vue"
|
||||
},
|
||||
"uni_modules": {
|
||||
"dependencies": ["uni-scss"],
|
||||
"encrypt": [],
|
||||
"platforms": {
|
||||
"cloud": {
|
||||
"tcb": "y",
|
||||
"aliyun": "y"
|
||||
},
|
||||
"client": {
|
||||
"App": {
|
||||
"app-vue": "y",
|
||||
"app-nvue": "y"
|
||||
},
|
||||
"H5-mobile": {
|
||||
"Safari": "y",
|
||||
"Android Browser": "y",
|
||||
"微信浏览器(Android)": "y",
|
||||
"QQ浏览器(Android)": "y"
|
||||
},
|
||||
"H5-pc": {
|
||||
"Chrome": "y",
|
||||
"IE": "y",
|
||||
"Edge": "y",
|
||||
"Firefox": "y",
|
||||
"Safari": "y"
|
||||
},
|
||||
"小程序": {
|
||||
"微信": "y",
|
||||
"阿里": "y",
|
||||
"百度": "y",
|
||||
"字节跳动": "y",
|
||||
"QQ": "y"
|
||||
},
|
||||
"快应用": {
|
||||
"华为": "u",
|
||||
"联盟": "u"
|
||||
},
|
||||
"Vue": {
|
||||
"vue2": "y",
|
||||
"vue3": "y"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue