首次git
|
@ -0,0 +1,11 @@
|
|||
{ // launch.json 配置了启动调试时相关设置,configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
|
||||
// launchtype项可配置值为local或remote, local代表前端连本地云函数,remote代表前端连云端云函数
|
||||
"version": "0.0",
|
||||
"configurations": [{
|
||||
"type": "uniCloud",
|
||||
"default": {
|
||||
"launchtype": "local"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,69 @@
|
|||
<script>
|
||||
import toolAll from '@/jsFile/tools.js';
|
||||
export default {
|
||||
globalData: {
|
||||
statusBarHeight: 0, //状态栏高度
|
||||
navigationBarHeight: 44, //这里先默认为44,ios 导航栏高度值,安卓和ios有点差别哦
|
||||
},
|
||||
onLaunch: function() {
|
||||
// console.log('App Launch');
|
||||
let that = this;
|
||||
uni.getSystemInfo({
|
||||
success(res) {
|
||||
that.globalData.statusBarHeight = res.statusBarHeight;
|
||||
if (res.platform == 'ios') {
|
||||
// console.log('ios',that.globalData.statusBarHeight);
|
||||
that.globalData.navigationBarHeight == 44;
|
||||
} else if (res.platform == 'android') {
|
||||
// console.log('android',that.globalData.statusBarHeight);
|
||||
that.globalData.navigationBarHeight = 48;
|
||||
} else {
|
||||
// console.log('其他',that.globalData.statusBarHeight);
|
||||
that.globalData.navigationBarHeight = 44;
|
||||
}
|
||||
}
|
||||
})
|
||||
// 给底部tab加角标
|
||||
// setTimeout(() => {
|
||||
// uni.setTabBarBadge({
|
||||
// index: 1,
|
||||
// text: '31'
|
||||
// });
|
||||
// uni.showTabBarRedDot({
|
||||
// index: 3
|
||||
// });
|
||||
// }, 1000);
|
||||
|
||||
},
|
||||
onShow: function() {
|
||||
// wx.checkSession({ //检测当前用户的session_key是否过期
|
||||
// success: function() { //session_key 未过期,并且在本生命周期一直有效
|
||||
// if(uni.getStorageSync('token')!=''){
|
||||
toolAll.tools.guoq()
|
||||
// }
|
||||
// },fail() {
|
||||
// toolAll.tools.showToast('您目前是游客,请授权登录')
|
||||
// setTimeout(()=>{
|
||||
// uni.navigateTo({
|
||||
// url:'/pages/login/login'
|
||||
// })
|
||||
// },1000)
|
||||
// }
|
||||
// })
|
||||
console.log('App Show');
|
||||
},
|
||||
onHide: function() {
|
||||
// console.log('App Hide');
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/*每个页面公共css */
|
||||
@import url("./commons/dengrui.css");
|
||||
@import url("./commons/animate.min.css");
|
||||
|
||||
page {
|
||||
background-color: #F5F5F5;
|
||||
}
|
||||
</style>
|
|
@ -0,0 +1,307 @@
|
|||
.width100{width: 100%;}
|
||||
.width94{width: 94%;}
|
||||
.width60{width: 60%;}
|
||||
|
||||
.margin40{margin: 40rpx;}
|
||||
.margin30{margin: 30rpx;}
|
||||
.margin20{margin: 20rpx;}
|
||||
.margin10{margin: 10rpx;}
|
||||
.margin-zy10{margin-left: 10rpx;margin-right: 10rpx;}
|
||||
.margin-zy16{margin-left: 16rpx;margin-right: 16rpx;}
|
||||
.margin-zy20{margin-left: 20rpx;margin-right: 20rpx;}
|
||||
.margin-zy30{margin-left: 30rpx;margin-right: 30rpx;}
|
||||
.margin-zy40{margin-left: 40rpx;margin-right: 40rpx;}
|
||||
|
||||
.margin-sx10{margin-top: 10rpx;margin-bottom: 10rpx;}
|
||||
.margin-sx16{margin-top: 16rpx;margin-bottom: 16rpx;}
|
||||
.margin-sx20{margin-top: 20rpx;margin-bottom: 20rpx;}
|
||||
.margin-sx26{margin-top: 26rpx;margin-bottom: 26rpx;}
|
||||
.margin-sx40{margin-top: 30rpx;margin-bottom: 40rpx;}
|
||||
.margin-s10{margin-top: 10rpx;}
|
||||
.margin-s20{margin-top: 20rpx;}
|
||||
.margin-s30{margin-top: 30rpx;}
|
||||
.margin-s40{margin-top: 40rpx;}
|
||||
.margin-s90p{margin-top: 90px;}
|
||||
.margin-sf30{margin-top: -30rpx;}
|
||||
|
||||
|
||||
.margin-x10{margin-bottom: 10rpx;}
|
||||
.margin-x20{margin-bottom: 20rpx;}
|
||||
|
||||
.margin-z10{margin-left: 10rpx;}
|
||||
.margin-z20{margin-left: 20rpx;}
|
||||
|
||||
.margin-y10{margin-right: 10rpx;}
|
||||
.margin-y20{margin-right: 20rpx;}
|
||||
.margin-y30{margin-right: 30rpx;}
|
||||
|
||||
|
||||
.padding10{padding: 10rpx;}
|
||||
.padding20{padding: 20rpx;}
|
||||
.padding-zy40{padding-left: 40rpx;padding-right: 40rpx;}
|
||||
.padding-zy30{padding-left: 30rpx;padding-right: 30rpx;}
|
||||
.padding-zy20{padding-left: 20rpx;padding-right: 20rpx;}
|
||||
.padding-zy10{padding-left: 10rpx;padding-right: 10rpx;}
|
||||
.padding-sx10{padding-top: 10rpx;padding-bottom: 10rpx;}
|
||||
.padding-sx20{padding-top: 20rpx;padding-bottom: 20rpx;}
|
||||
.padding-sx30{padding-top: 30rpx;padding-bottom: 30rpx;}
|
||||
.padding-sx40{padding-top: 40rpx;padding-bottom: 40rpx;}
|
||||
.padding-s20{padding-top: 20rpx;}
|
||||
.padding-s30{padding-top: 30rpx;}
|
||||
.padding-s40{padding-top: 40rpx;}
|
||||
.padding-s10{padding-top: 10rpx;}
|
||||
.padding-x40{padding-bottom: 40rpx;}
|
||||
.padding-x30{padding-bottom: 30rpx;}
|
||||
.padding-x20{padding-bottom: 20rpx;}
|
||||
.padding-z20{padding-left: 20rpx;}
|
||||
.padding-y20{padding-right: 20rpx;}
|
||||
.padding-x120{padding-bottom: 120rpx;}
|
||||
|
||||
|
||||
.fon36{font-size: 36rpx;}
|
||||
.fon32{font-size: 32rpx;}
|
||||
.fon30{font-size: 30rpx;}
|
||||
.fon28{font-size: 28rpx;}
|
||||
.fon26{font-size: 26rpx;}
|
||||
.fon24{font-size: 24rpx;}
|
||||
|
||||
|
||||
|
||||
.searchRadius{border-radius: 32.5rpx;}
|
||||
.radius10{border-radius: 10rpx;}
|
||||
.radius16{border-radius: 16rpx;}
|
||||
.radius20{border-radius: 20rpx;}
|
||||
.btnradius{border-radius: 30.5rpx;}
|
||||
.searchpradius{border-radius: 26.5rpx;}
|
||||
|
||||
.dis{display: flex;}
|
||||
.disac{display: flex;align-items: center;}
|
||||
.disbc{display: flex;justify-content: center;}
|
||||
.disba{display: flex;justify-content: space-between;align-items: center;}
|
||||
.disbcac{display: flex;justify-content: center;align-items: center;}
|
||||
.disaa{display: flex;justify-content: space-around;align-items: center;}
|
||||
.discc{display: flex;justify-content: center;flex-direction: column;align-items: center;}
|
||||
.dissss{display: flex;justify-content: flex-end;flex-direction: column;}
|
||||
.flw{flex-wrap: wrap;}
|
||||
.jcend{justify-content: flex-end;}
|
||||
.titlec{display: flex;align-items: center;justify-content: center;width: 88%;}
|
||||
.tab-title{font-size: 40rpx;margin-top: -10rpx;}
|
||||
.flexs{flex-shrink: 0;}
|
||||
.disn{display: none;}
|
||||
|
||||
|
||||
|
||||
|
||||
.colorh{color: #000000;}
|
||||
.colorb{color: #FFFFFF;}
|
||||
.colorz{color: #1c4593;}
|
||||
.color6{color: #666666;}
|
||||
.color9{color: #999999;}
|
||||
.color26{color: #262626;}
|
||||
.color33{color: #333333;}
|
||||
.color35{color: #35548b;}
|
||||
.colorf78{color: #ff7800;}
|
||||
.colorf6{color: #f65741;}
|
||||
.cloor16{color: #164396;}
|
||||
.bold{font-weight: bold;}
|
||||
|
||||
|
||||
.bacb{background-color: #FFFFFF;}
|
||||
|
||||
|
||||
.textc{text-align: center;}
|
||||
.textr{text-align: right;}
|
||||
|
||||
|
||||
.posi-tzy{position: fixed;top: 0;left: 0;right: 0;}
|
||||
.posi-bzy{position: fixed;bottom: 0;left: 0;right: 0;z-index: 1;}
|
||||
.posir{position: relative;}
|
||||
.posia{position: absolute;}
|
||||
|
||||
|
||||
.zIn2{z-index: 2;}
|
||||
.zIn3{z-index: 3;}
|
||||
.zIn4{z-index: 4;}
|
||||
.zIn5{z-index: 5;}
|
||||
|
||||
|
||||
/* 首页 */
|
||||
.reba{width:80rpx;height:30rpx;}
|
||||
.zIn1{z-index: 1;}
|
||||
.zIn-1{z-index: -1;}
|
||||
.tiao{width: 325rpx;height: 13rpx;border-radius: 6rpx;background-color: #35548b;margin-top: -10rpx;}
|
||||
.rebox{height: 342rpx;background-color: #FFFFFF;}
|
||||
.reboxre{height: 342rpx;}
|
||||
.reimg{width: 340rpx;height: 280rpx;}
|
||||
|
||||
|
||||
|
||||
/* 暂无 */
|
||||
.zanwu{position: fixed;top: 50%;transform: translateY(-50%); color: #999;font-weight: bold;font-size: 36rpx;z-index: 5;left: 20rpx;right: 20rpx;text-align: center;}
|
||||
|
||||
.tab-back{width: 21rpx;height: 37rpx;}
|
||||
.tab-input-box{background-color: #f5f5f5;height: 54rpx;padding: 0 10rpx;margin-left: 20rpx;width:400rpx;}
|
||||
.tab-input-box>image,.searcht{width: 26rpx;height: 26rpx;}
|
||||
/* .ptwo-input-box{width: 612rpx;height: 66rpx;background-color: #FFFFFF;z-index: 1;} */
|
||||
/* .xiaox{width: 40rpx;height: 39rpx;z-index: 1;} */
|
||||
.ptwo-input-box{width: 100%;height: 66rpx;background-color: #FFFFFF;z-index: 1;}
|
||||
.xiaox{width: 40rpx;height: 39rpx;z-index: 1;margin-left: 8%;}
|
||||
.searchpla{color:#c6c6c6;}
|
||||
.tab-input-box>input{font-size: 26rpx;padding-left: 10rpx;}
|
||||
|
||||
.pptwo-box{padding-top: 160rpx;}
|
||||
.ptwo-box{padding-top: 140rpx;}
|
||||
.mtwo-box10{margin-top: 100rpx;}
|
||||
.mtwo-box18{margin-top: 180rpx;}
|
||||
.marb-box10{margin-bottom: 100rpx;}
|
||||
.marb-box12{margin-bottom: 120rpx;}
|
||||
|
||||
|
||||
|
||||
.banner-box{height: 330rpx;}
|
||||
.gimg{width: 24rpx;height: 24rpx;}
|
||||
.gtitle{color: #1c4593;font-weight: bold;}
|
||||
|
||||
.rebtn{background-color: #1c4593;width: 242rpx;height: 62rpx;line-height: 62rpx;}
|
||||
|
||||
|
||||
/* 分类、列表 */
|
||||
.pactive{color: #35548b;font-weight: bold;font-size: 30rpx;}
|
||||
.pmo{font-size: 28rpx;color: #333333;}
|
||||
.pxian{height: 30rpx;width: 2rpx;background-color: #b3b3b3;margin: 0 30rpx;}
|
||||
.catebox>view:last-child{padding-right: 20rpx;}
|
||||
.catebox>view:last-child>view{display: none;}
|
||||
.pche{width: 33rpx;height: 33rpx;border-radius: 100%;}
|
||||
.proimg{width: 262rpx;height: 262rpx;}
|
||||
/* .pimg{width: 262rpx;height: 262rpx;} */
|
||||
.pimg{width: 100%;height: 285rpx;}
|
||||
|
||||
|
||||
/* 产品页 */
|
||||
.ascedesc{width:18rpx;height:11rpx;}
|
||||
.ascedesc:last-child{margin-top: 4rpx;}
|
||||
.pro{border: 1rpx solid #F65741;width: auto;padding: 4rpx 16rpx;}
|
||||
.borbot{border-bottom: 1rpx solid rgba(240,240,240,.9);}
|
||||
.borbot:last-child{border-bottom: none;}
|
||||
.dangShai{background-color: #e4ebf7;font-size: 28rpx;font-weight: bold;}
|
||||
.progc{width: 54rpx;height: 54rpx;}
|
||||
.catebold{color: #1c4594;font-weight: bold;}
|
||||
/* 购物车 */
|
||||
.gouwcimg{width: 202rpx;height: 202rpx;}
|
||||
.xuanz{background-color: #f5f5f5;width: 30%;padding: 10rpx 30rpx;border-radius: 40rpx;}
|
||||
.gouwcxian{width: 80rpx;height: 2rpx;background-color: #d4d4d4;}
|
||||
.gouwchh{width: 40rpx;height: 32rpx;}
|
||||
.gouwcb-box{height: 56px;background-color: #FFFFFF;z-index: 100000;line-height: 56px;}
|
||||
.gouwcbtn{background-color: #FF7800;height: 90rpx;line-height: 90rpx;border-radius: 60rpx;width: 36%;border: none;margin-right: 0rpx;}
|
||||
.deladd{padding: 0!important;width: 100rpx!important; height: 40rpx!important;line-height: 40rpx!important;border-radius: none!important;text-align: center!important;position: inherit!important;background-color: #FFFFFF!important;}
|
||||
.deladd:after{content: none!important;}
|
||||
button:after{content: none!important;}
|
||||
.kongk{background-color: #F5F5F5;text-align: center;font-size: 36rpx;font-weight: bold;color: #999999;padding: 220rpx 0;}
|
||||
.navBarH{height: 90rpx;}
|
||||
/* 我的页面 */
|
||||
.posiall{position: fixed; top: 0;left: 0;right: 0;bottom: 0;}
|
||||
.myhead{width: 130rpx;height: 130rpx;border-radius: 100%;}
|
||||
.myxiaoimg{width: 37rpx;height: 37rpx;}
|
||||
.myxiaoc{top: -26rpx;right: -16rpx;width: 20px;height: 20px;border-radius: 100%;background-color: #FF7800;transform: scale(.8);}
|
||||
.myphone{color: #1c4593;background-color: #FFFFFF;width: 170rpx;height: 50rpx;border-radius: 26rpx;}
|
||||
|
||||
.mygong{width: 54rpx;height: 54rpx;}
|
||||
.flw .discc:nth-child(2) .mygong{width: 53rpx;height: 53rpx;}
|
||||
.flw .discc:nth-child(3) .mygong{width: 53rpx;height: 59rpx;}
|
||||
.flw .discc:nth-child(4) .mygong{width: 49rpx;height: 59rpx;}
|
||||
.flw .discc:nth-child(5) .mygong{width: 53rpx;height: 57rpx;}
|
||||
|
||||
/* 底部首页、客服、加入购物车、立即购买 */
|
||||
.bottosimg{width: 40rpx;height: 40rpx;}
|
||||
.bottokimg{width: 38rpx;height: 38rpx;}
|
||||
.bottoc{margin-top: 6rpx;color: #414141;}
|
||||
.bottoj{border: 1rpx solid #FF7800;color: #FF7800;background-color: #FFFFFF;padding: 20rpx 0;width: 220rpx;border-radius: 40rpx;font-size: 30rpx;}
|
||||
.bottol{background-color: #FF7800;color: #FFFFFF;padding: 20rpx 0;border-radius: 40rpx;font-size: 30rpx;width: 220rpx;}
|
||||
|
||||
/* 详情 */
|
||||
.guigactive{color: #1c4594;border: 1rpx solid #1c4594;}
|
||||
.guigmo{border: 1rpx solid #f3f3f3;}
|
||||
|
||||
/* 公告列表 */
|
||||
.noticesitem-img{width: 12rpx;height: 12rpx;background-color: #333333;transform: rotate(45deg);margin-top: 18rpx;}
|
||||
|
||||
/* 立即提现 */
|
||||
.comebtn{color: #FFFFFF;background-color: #164396;height: 77rpx;line-height: 77rpx;font-size: 32rpx;position: inherit;}
|
||||
.comebtn:after{content: none!important;}
|
||||
|
||||
/* 个人资料 */
|
||||
.youj{width: 14rpx;height: 28rpx;}
|
||||
|
||||
/* 订单确认 */
|
||||
.btnaddress{border-radius: 8rpx;padding: 6rpx 10rpx;}
|
||||
.lanh{height: 5rpx;width: 100%;bottom: 0;left: 0;right: 0;}
|
||||
.btntj{width: 298rpx;border-radius: 42.5rpx;background-color: #ff7800;border: 1px solid #FF7800;color: #FFFFFF;margin-right: 0;}
|
||||
.close-box{width: 38rpx;height: 38rpx;border-radius: 100%;background-color: rgba(0,0,0,.15);position: relative;display: flex;justify-content: center;align-items: center;}
|
||||
.close-box>view{width: 2rpx;height: 20rpx;background-color: #666666;position: absolute;}
|
||||
|
||||
/* 评价 */
|
||||
.pimg-box{height: 159rpx;width: 159rpx;border: 1rpx dashed #FFFFFF;}
|
||||
.pimg-box:nth-child(4n){margin-right: 0;}
|
||||
|
||||
/* 商务合作页面 */
|
||||
.businessInput{height: 78rpx;width: 100%;}
|
||||
.business-box{border: 1rpx solid #dcdcdc;border-radius: 10rpx;height: 78rpx;}
|
||||
.businessbtn{width: 70%;margin-top: 60rpx; font-size: 30rpx;height: 86rpx;background-color: #1c4594!important;border-radius: 42.5rpx;color: #FFFFFF!important;line-height: 86rpx;}
|
||||
|
||||
|
||||
/* 我的订单页 */
|
||||
.myorderbtn{width: 150rpx;height: 60rpx;border-radius: 30rpx;border: 1rpx solid #999999;text-align: center;line-height: 60rpx;font-size: 26rpx;margin-left: 20rpx;}
|
||||
.confrimbtn{border: 1rpx solid #FF7800;color: #FF7800;}
|
||||
.goodsImg{width: 160rpx;height: 160rpx;border-radius: 6rpx;}
|
||||
|
||||
|
||||
/* 地址列表页 */
|
||||
.addbtn{background-color: #1c4594;width: 100%;height: 82rpx;line-height: 82rpx;border-radius: 42.5rpx;text-align: center;}
|
||||
|
||||
|
||||
|
||||
.clips1{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;word-break:break-all;}
|
||||
.clips2{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;word-break:break-all;}
|
||||
.clips3{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;word-break:break-all;}
|
||||
|
||||
|
||||
/* 订单提交页 */
|
||||
.konga{background-color: #F5F5F5;text-align: center;font-size: 36rpx;font-weight: bold;color: #999999;margin: 90rpx 0;}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
.share{width: 69rpx;height: 69rpx;position: fixed;right: 20rpx;bottom: 290rpx;}
|
||||
|
||||
.ptab{position: fixed;left: 0;right: 0;padding: 0 20rpx 20rpx 20rpx;}
|
||||
.plist{margin-top: 210rpx;margin-bottom: 20rpx;}
|
||||
.searchlist{margin-bottom: 20rpx;}
|
||||
.pchoose{position: fixed;right: 0;bottom: 0;width: 180rpx;}
|
||||
.switch-qiu{margin-top: 4rpx;}
|
||||
.tan-box{position: fixed;top: 50%;left: 50%;transform: translate(-50%,-50%);z-index: 101;border-radius: 30rpx;background-color: #FFFFFF;}
|
||||
.orderRight{position: absolute;right: 10rpx;text-align: right;}
|
||||
.orderRights{margin-top: 35rpx;}
|
||||
.mybei{height: 860px!important;}
|
||||
@media screen and (width:320px) {
|
||||
.plist{margin-top: 240rpx;}
|
||||
.mybei{height: 700px!important;}
|
||||
.ptwo-box{padding-top: 150rpx;}
|
||||
.ordertop{top: 150rpx;}
|
||||
.switch-qiu{margin-top: 8rpx;}
|
||||
}
|
||||
@media screen and (width:375px) {
|
||||
.ordertop{top: 170rpx;}
|
||||
.plist {margin-top: 220rpx;}
|
||||
.tan-box{top: 50%;transform: translate(-50%,-50%);}
|
||||
|
||||
}
|
||||
@media screen and (width:414px) {
|
||||
.ordertop{top: 170rpx;}
|
||||
.plist {margin-top: 220rpx;}
|
||||
.tan-box{top: 50%;transform: translate(-50%,-50%);}
|
||||
.mybei{height: 840px!important;}
|
||||
}
|
|
@ -0,0 +1,411 @@
|
|||
<template>
|
||||
<view :class="modal?'show-qrcode':'hide-qrcode'">
|
||||
<view class="box-qrcode" :style="{'margin-left': marginLeft + 'px'}" @longtap="longtapCode">
|
||||
<!-- style="width: 550rpx;height: 550rpx;" -->
|
||||
|
||||
<canvas class="canvas-qrcode" :style="style_w_h" :canvas-id="qrcode_id">
|
||||
|
||||
<!-- #ifndef MP -->
|
||||
<view v-if="modal&&is_themeImg" :style="style_w_h" class="box-img-qrcode">
|
||||
<image :style="style_w_h_img" mode="scaleToFill" :src="themeImg"></image>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
|
||||
</canvas>
|
||||
|
||||
<!-- <image mode="scaleToFill" :src="imagePath"></image> -->
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
var qr_we = require("./qrcode_wx.js");
|
||||
const qrCode = require('./weapp-qrcode.js')
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
isAndroid : false ,
|
||||
show: true,
|
||||
imagePath: '',
|
||||
// qrcode_id: 'qrcode_id',
|
||||
marginLeft: 0,
|
||||
//一般的安卓app只需加30就能显示全
|
||||
//苹果app的不加就能显示全,加了就要弄margin-left
|
||||
//有些安卓app显示不全
|
||||
add_num : 30 ,
|
||||
add_num_key : 'rectify_code_key',
|
||||
}
|
||||
},
|
||||
props: {
|
||||
modal: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
url: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
height: {
|
||||
type: Number,
|
||||
default: 260
|
||||
},
|
||||
width: {
|
||||
type: Number,
|
||||
default: 260
|
||||
},
|
||||
themeColor: {
|
||||
type: String,
|
||||
default: '#333333',
|
||||
},
|
||||
qrcode_id: {
|
||||
type: String,
|
||||
default: 'qrcode_id',
|
||||
},
|
||||
is_themeImg: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
themeImg: {
|
||||
type: String,
|
||||
default: 'https://cdn.pixabay.com/photo/2016/11/29/13/24/balloons-1869816__340.jpg',
|
||||
},
|
||||
h_w_img: {
|
||||
type: Number,
|
||||
default: 30
|
||||
},
|
||||
|
||||
|
||||
},
|
||||
watch:{
|
||||
|
||||
},
|
||||
computed: {
|
||||
style_w_h() {
|
||||
return this.set_style_w_h();
|
||||
},
|
||||
style_w_h_img() {
|
||||
let that = this;
|
||||
var height = parseInt(that.h_w_img);
|
||||
var width = parseInt(that.h_w_img);
|
||||
var style = '';
|
||||
if (height > 0) {
|
||||
style = `height:${height*2}rpx;`;
|
||||
}
|
||||
if (width > 0) {
|
||||
style += `width:${width*2}rpx;z-index: 2;`;
|
||||
}
|
||||
|
||||
return style;
|
||||
},
|
||||
},
|
||||
created: function() {
|
||||
let that = this;
|
||||
try {
|
||||
//app苹果二维码不居中
|
||||
//#ifndef MP
|
||||
let isAndroid = false ;
|
||||
const res = uni.getSystemInfoSync();
|
||||
if(res.platform == 'android'){
|
||||
isAndroid = true ;
|
||||
}else{
|
||||
isAndroid = false ;
|
||||
}
|
||||
|
||||
|
||||
if (!isAndroid) {
|
||||
that.marginLeft = 46;
|
||||
}
|
||||
|
||||
that.isAndroid = isAndroid ;
|
||||
try {
|
||||
const add_num = uni.getStorageSync(that.add_num_key);
|
||||
if (add_num) {
|
||||
that.add_num = add_num;
|
||||
}
|
||||
|
||||
} catch (e) {
|
||||
// error
|
||||
|
||||
}
|
||||
// #endif
|
||||
|
||||
} catch (e) {
|
||||
// error
|
||||
}
|
||||
|
||||
//#ifdef MP
|
||||
//that.marginLeft = 40;
|
||||
// #endif
|
||||
|
||||
},
|
||||
methods: {
|
||||
set_style_w_h(){
|
||||
|
||||
let that = this;
|
||||
var height = parseInt(that.height);
|
||||
var width = parseInt(that.width);
|
||||
var style = '';
|
||||
var height = height*2 ;
|
||||
var width = width*2 ;
|
||||
|
||||
//#ifndef MP
|
||||
var add = that.add_num ;
|
||||
|
||||
height += add;
|
||||
width += add;
|
||||
// #endif
|
||||
|
||||
if (height > 0) {
|
||||
style = `height:${height}rpx;`;
|
||||
}
|
||||
if (width > 0) {
|
||||
style += `width:${width}rpx;`;
|
||||
}
|
||||
|
||||
return style;
|
||||
},
|
||||
hideQrcode() {
|
||||
this.$emit("hideQrcode")
|
||||
},
|
||||
// 二维码生成工具
|
||||
crtQrCode() {
|
||||
let that = this;
|
||||
//#ifndef MP
|
||||
new qrCode(that.qrcode_id, {
|
||||
text: this.url,
|
||||
width: that.width,
|
||||
height: that.height,
|
||||
colorDark: that.themeColor,//#333333
|
||||
colorLight: "#FFFFFF",
|
||||
correctLevel: qrCode.CorrectLevel.H,
|
||||
})
|
||||
// #endif
|
||||
//#ifdef MP
|
||||
that.createQrCode(this.url, that.qrcode_id, that.width, that.height,that.themeColor,that.is_themeImg,that.themeImg,that.h_w_img);
|
||||
// #endif
|
||||
|
||||
//that.createQrCode(this.url, that.qrcode_id, that.width, that.height);
|
||||
},
|
||||
//#ifdef MP
|
||||
|
||||
createQrCode: function(url, canvasId, cavW, cavH,cavColor,haveImg,imgurl,imgsize) {
|
||||
//调用插件中的draw方法,绘制二维码图片
|
||||
qr_we.api.draw(url, canvasId, cavW, cavH,cavColor,haveImg,imgurl,imgsize, this, this.canvasToTempImage);
|
||||
// setTimeout(() => { this.canvasToTempImage();},100);
|
||||
|
||||
},
|
||||
|
||||
// #endif
|
||||
//获取临时缓存照片路径,存入data中
|
||||
canvasToTempImage: function() {
|
||||
var that = this;
|
||||
},
|
||||
saveImage: function() {
|
||||
var that = this;
|
||||
uni.canvasToTempFilePath({
|
||||
canvasId: that.qrcode_id,
|
||||
success: function(res) {
|
||||
var tempFilePath = res.tempFilePath;
|
||||
// console.log(tempFilePath);
|
||||
that.imagePath = tempFilePath;
|
||||
|
||||
//保存到相册
|
||||
// uni.saveFile({
|
||||
// tempFilePath: tempFilePath,
|
||||
// success: function (res2) {
|
||||
// var savedFilePath = res2.savedFilePath;
|
||||
|
||||
|
||||
// }
|
||||
// });
|
||||
uni.saveImageToPhotosAlbum({
|
||||
filePath : tempFilePath ,
|
||||
success: function (res3) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '保存成功',
|
||||
confirmText: '确定',
|
||||
showCancel: false,
|
||||
confirmColor: '#33CCCC',
|
||||
success(res4) {
|
||||
|
||||
}
|
||||
})
|
||||
},
|
||||
});
|
||||
},
|
||||
fail: function(res) {
|
||||
// console.log(res);
|
||||
}
|
||||
}, that);
|
||||
},
|
||||
//微信小程序支持:长按二维码,提示是否保存相册
|
||||
//安卓APP长按校正二维码
|
||||
longtapCode(){
|
||||
var that = this;
|
||||
|
||||
//#ifndef MP
|
||||
uni.showModal({
|
||||
title: '校正二维码',
|
||||
content: '二维码是否异常',
|
||||
confirmText: '确定',
|
||||
confirmColor: '#33CCCC',
|
||||
success(res) {
|
||||
if (res.confirm) {
|
||||
that.rectify_code();
|
||||
}
|
||||
}
|
||||
})
|
||||
// #endif
|
||||
|
||||
//#ifdef MP-WEIXIN
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '是否保存到相册',
|
||||
confirmText: '确定',
|
||||
confirmColor: '#33CCCC',
|
||||
success(res) {
|
||||
if (res.confirm) {
|
||||
that.saveImage();
|
||||
}
|
||||
}
|
||||
})
|
||||
// #endif
|
||||
},
|
||||
//安卓有些手机不正常,长按可选择矫正
|
||||
rectify_code(){
|
||||
var that = this;
|
||||
let add_num = that.add_num ;
|
||||
add_num += 30 ;
|
||||
that.add_num = add_num;
|
||||
that.crtQrCode();//重新生成才会立即覆盖
|
||||
try {
|
||||
//第一次长按校正设置了就不用在设置
|
||||
uni.setStorage({
|
||||
key: that.add_num_key,
|
||||
data: add_num,
|
||||
success: function() {
|
||||
|
||||
}
|
||||
});
|
||||
} catch (e) {
|
||||
// error
|
||||
|
||||
}
|
||||
},
|
||||
},
|
||||
mounted() {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
// .qrcode-box {
|
||||
// position: fixed;
|
||||
// left: 0;
|
||||
// top: 0;
|
||||
// right: 0;
|
||||
// bottom: 0;
|
||||
// height: 100vh;
|
||||
// width: 100vw;
|
||||
// background-color: rgba(59, 59, 59, 0.6);
|
||||
// // opacity: 0.8;
|
||||
// text-align: center;
|
||||
// display: flex;
|
||||
// align-items: center;
|
||||
// display: none;
|
||||
|
||||
// .qrcode-item {
|
||||
// flex: 1;
|
||||
// position: relative;
|
||||
// text-align: center;
|
||||
|
||||
// .item-box {
|
||||
// width: 90%;
|
||||
// margin: auto;
|
||||
// display: inline-block;
|
||||
// margin-top: 30%;
|
||||
// padding-bottom: 30rpx;
|
||||
|
||||
// // animation: show 0.7s;
|
||||
// .title {
|
||||
// font-size: 46rpx;
|
||||
// text-align: center;
|
||||
// margin-bottom: 24rpx;
|
||||
// }
|
||||
|
||||
// .canvas {
|
||||
// margin: auto;
|
||||
// display: inline-block;
|
||||
// margin: auto;
|
||||
// }
|
||||
|
||||
// background-color: #FFFFFF;
|
||||
// }
|
||||
|
||||
// }
|
||||
// }
|
||||
.box-qrcode{
|
||||
text-align: center;
|
||||
position: relative;
|
||||
.box-img-qrcode{
|
||||
position: absolute;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 2;
|
||||
}
|
||||
}
|
||||
image{
|
||||
width: 60upx;
|
||||
height: 60upx;
|
||||
border-radius: 50%;
|
||||
|
||||
}
|
||||
.canvas-qrcode {
|
||||
|
||||
margin: auto;
|
||||
display: inline-block;
|
||||
float: left;
|
||||
}
|
||||
|
||||
|
||||
.opacity-qrcode {
|
||||
opacity: 0;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.show-qrcode {
|
||||
display: block;
|
||||
animation: fade 0.7s;
|
||||
|
||||
// -moz-animation: fade 0.5s; /* Firefox */
|
||||
// -webkit-animation: fade 0.5s; /* Safari 和 Chrome */
|
||||
// -o-animation: fade 0.5s;
|
||||
}
|
||||
|
||||
.hide-qrcode {
|
||||
animation: hide 0.7s;
|
||||
}
|
||||
|
||||
@keyframes fade {
|
||||
from {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes hide {
|
||||
from {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -0,0 +1,872 @@
|
|||
!(function() {
|
||||
|
||||
// alignment pattern
|
||||
var adelta = [
|
||||
0, 11, 15, 19, 23, 27, 31,
|
||||
16, 18, 20, 22, 24, 26, 28, 20, 22, 24, 24, 26, 28, 28, 22, 24, 24,
|
||||
26, 26, 28, 28, 24, 24, 26, 26, 26, 28, 28, 24, 26, 26, 26, 28, 28
|
||||
];
|
||||
|
||||
// version block
|
||||
var vpat = [
|
||||
0xc94, 0x5bc, 0xa99, 0x4d3, 0xbf6, 0x762, 0x847, 0x60d,
|
||||
0x928, 0xb78, 0x45d, 0xa17, 0x532, 0x9a6, 0x683, 0x8c9,
|
||||
0x7ec, 0xec4, 0x1e1, 0xfab, 0x08e, 0xc1a, 0x33f, 0xd75,
|
||||
0x250, 0x9d5, 0x6f0, 0x8ba, 0x79f, 0xb0b, 0x42e, 0xa64,
|
||||
0x541, 0xc69
|
||||
];
|
||||
|
||||
// final format bits with mask: level << 3 | mask
|
||||
var fmtword = [
|
||||
0x77c4, 0x72f3, 0x7daa, 0x789d, 0x662f, 0x6318, 0x6c41, 0x6976, //L
|
||||
0x5412, 0x5125, 0x5e7c, 0x5b4b, 0x45f9, 0x40ce, 0x4f97, 0x4aa0, //M
|
||||
0x355f, 0x3068, 0x3f31, 0x3a06, 0x24b4, 0x2183, 0x2eda, 0x2bed, //Q
|
||||
0x1689, 0x13be, 0x1ce7, 0x19d0, 0x0762, 0x0255, 0x0d0c, 0x083b //H
|
||||
];
|
||||
|
||||
// 4 per version: number of blocks 1,2; data width; ecc width
|
||||
var eccblocks = [
|
||||
1, 0, 19, 7, 1, 0, 16, 10, 1, 0, 13, 13, 1, 0, 9, 17,
|
||||
1, 0, 34, 10, 1, 0, 28, 16, 1, 0, 22, 22, 1, 0, 16, 28,
|
||||
1, 0, 55, 15, 1, 0, 44, 26, 2, 0, 17, 18, 2, 0, 13, 22,
|
||||
1, 0, 80, 20, 2, 0, 32, 18, 2, 0, 24, 26, 4, 0, 9, 16,
|
||||
1, 0, 108, 26, 2, 0, 43, 24, 2, 2, 15, 18, 2, 2, 11, 22,
|
||||
2, 0, 68, 18, 4, 0, 27, 16, 4, 0, 19, 24, 4, 0, 15, 28,
|
||||
2, 0, 78, 20, 4, 0, 31, 18, 2, 4, 14, 18, 4, 1, 13, 26,
|
||||
2, 0, 97, 24, 2, 2, 38, 22, 4, 2, 18, 22, 4, 2, 14, 26,
|
||||
2, 0, 116, 30, 3, 2, 36, 22, 4, 4, 16, 20, 4, 4, 12, 24,
|
||||
2, 2, 68, 18, 4, 1, 43, 26, 6, 2, 19, 24, 6, 2, 15, 28,
|
||||
4, 0, 81, 20, 1, 4, 50, 30, 4, 4, 22, 28, 3, 8, 12, 24,
|
||||
2, 2, 92, 24, 6, 2, 36, 22, 4, 6, 20, 26, 7, 4, 14, 28,
|
||||
4, 0, 107, 26, 8, 1, 37, 22, 8, 4, 20, 24, 12, 4, 11, 22,
|
||||
3, 1, 115, 30, 4, 5, 40, 24, 11, 5, 16, 20, 11, 5, 12, 24,
|
||||
5, 1, 87, 22, 5, 5, 41, 24, 5, 7, 24, 30, 11, 7, 12, 24,
|
||||
5, 1, 98, 24, 7, 3, 45, 28, 15, 2, 19, 24, 3, 13, 15, 30,
|
||||
1, 5, 107, 28, 10, 1, 46, 28, 1, 15, 22, 28, 2, 17, 14, 28,
|
||||
5, 1, 120, 30, 9, 4, 43, 26, 17, 1, 22, 28, 2, 19, 14, 28,
|
||||
3, 4, 113, 28, 3, 11, 44, 26, 17, 4, 21, 26, 9, 16, 13, 26,
|
||||
3, 5, 107, 28, 3, 13, 41, 26, 15, 5, 24, 30, 15, 10, 15, 28,
|
||||
4, 4, 116, 28, 17, 0, 42, 26, 17, 6, 22, 28, 19, 6, 16, 30,
|
||||
2, 7, 111, 28, 17, 0, 46, 28, 7, 16, 24, 30, 34, 0, 13, 24,
|
||||
4, 5, 121, 30, 4, 14, 47, 28, 11, 14, 24, 30, 16, 14, 15, 30,
|
||||
6, 4, 117, 30, 6, 14, 45, 28, 11, 16, 24, 30, 30, 2, 16, 30,
|
||||
8, 4, 106, 26, 8, 13, 47, 28, 7, 22, 24, 30, 22, 13, 15, 30,
|
||||
10, 2, 114, 28, 19, 4, 46, 28, 28, 6, 22, 28, 33, 4, 16, 30,
|
||||
8, 4, 122, 30, 22, 3, 45, 28, 8, 26, 23, 30, 12, 28, 15, 30,
|
||||
3, 10, 117, 30, 3, 23, 45, 28, 4, 31, 24, 30, 11, 31, 15, 30,
|
||||
7, 7, 116, 30, 21, 7, 45, 28, 1, 37, 23, 30, 19, 26, 15, 30,
|
||||
5, 10, 115, 30, 19, 10, 47, 28, 15, 25, 24, 30, 23, 25, 15, 30,
|
||||
13, 3, 115, 30, 2, 29, 46, 28, 42, 1, 24, 30, 23, 28, 15, 30,
|
||||
17, 0, 115, 30, 10, 23, 46, 28, 10, 35, 24, 30, 19, 35, 15, 30,
|
||||
17, 1, 115, 30, 14, 21, 46, 28, 29, 19, 24, 30, 11, 46, 15, 30,
|
||||
13, 6, 115, 30, 14, 23, 46, 28, 44, 7, 24, 30, 59, 1, 16, 30,
|
||||
12, 7, 121, 30, 12, 26, 47, 28, 39, 14, 24, 30, 22, 41, 15, 30,
|
||||
6, 14, 121, 30, 6, 34, 47, 28, 46, 10, 24, 30, 2, 64, 15, 30,
|
||||
17, 4, 122, 30, 29, 14, 46, 28, 49, 10, 24, 30, 24, 46, 15, 30,
|
||||
4, 18, 122, 30, 13, 32, 46, 28, 48, 14, 24, 30, 42, 32, 15, 30,
|
||||
20, 4, 117, 30, 40, 7, 47, 28, 43, 22, 24, 30, 10, 67, 15, 30,
|
||||
19, 6, 118, 30, 18, 31, 47, 28, 34, 34, 24, 30, 20, 61, 15, 30
|
||||
];
|
||||
|
||||
// Galois field log table
|
||||
var glog = [
|
||||
0xff, 0x00, 0x01, 0x19, 0x02, 0x32, 0x1a, 0xc6, 0x03, 0xdf, 0x33, 0xee, 0x1b, 0x68, 0xc7, 0x4b,
|
||||
0x04, 0x64, 0xe0, 0x0e, 0x34, 0x8d, 0xef, 0x81, 0x1c, 0xc1, 0x69, 0xf8, 0xc8, 0x08, 0x4c, 0x71,
|
||||
0x05, 0x8a, 0x65, 0x2f, 0xe1, 0x24, 0x0f, 0x21, 0x35, 0x93, 0x8e, 0xda, 0xf0, 0x12, 0x82, 0x45,
|
||||
0x1d, 0xb5, 0xc2, 0x7d, 0x6a, 0x27, 0xf9, 0xb9, 0xc9, 0x9a, 0x09, 0x78, 0x4d, 0xe4, 0x72, 0xa6,
|
||||
0x06, 0xbf, 0x8b, 0x62, 0x66, 0xdd, 0x30, 0xfd, 0xe2, 0x98, 0x25, 0xb3, 0x10, 0x91, 0x22, 0x88,
|
||||
0x36, 0xd0, 0x94, 0xce, 0x8f, 0x96, 0xdb, 0xbd, 0xf1, 0xd2, 0x13, 0x5c, 0x83, 0x38, 0x46, 0x40,
|
||||
0x1e, 0x42, 0xb6, 0xa3, 0xc3, 0x48, 0x7e, 0x6e, 0x6b, 0x3a, 0x28, 0x54, 0xfa, 0x85, 0xba, 0x3d,
|
||||
0xca, 0x5e, 0x9b, 0x9f, 0x0a, 0x15, 0x79, 0x2b, 0x4e, 0xd4, 0xe5, 0xac, 0x73, 0xf3, 0xa7, 0x57,
|
||||
0x07, 0x70, 0xc0, 0xf7, 0x8c, 0x80, 0x63, 0x0d, 0x67, 0x4a, 0xde, 0xed, 0x31, 0xc5, 0xfe, 0x18,
|
||||
0xe3, 0xa5, 0x99, 0x77, 0x26, 0xb8, 0xb4, 0x7c, 0x11, 0x44, 0x92, 0xd9, 0x23, 0x20, 0x89, 0x2e,
|
||||
0x37, 0x3f, 0xd1, 0x5b, 0x95, 0xbc, 0xcf, 0xcd, 0x90, 0x87, 0x97, 0xb2, 0xdc, 0xfc, 0xbe, 0x61,
|
||||
0xf2, 0x56, 0xd3, 0xab, 0x14, 0x2a, 0x5d, 0x9e, 0x84, 0x3c, 0x39, 0x53, 0x47, 0x6d, 0x41, 0xa2,
|
||||
0x1f, 0x2d, 0x43, 0xd8, 0xb7, 0x7b, 0xa4, 0x76, 0xc4, 0x17, 0x49, 0xec, 0x7f, 0x0c, 0x6f, 0xf6,
|
||||
0x6c, 0xa1, 0x3b, 0x52, 0x29, 0x9d, 0x55, 0xaa, 0xfb, 0x60, 0x86, 0xb1, 0xbb, 0xcc, 0x3e, 0x5a,
|
||||
0xcb, 0x59, 0x5f, 0xb0, 0x9c, 0xa9, 0xa0, 0x51, 0x0b, 0xf5, 0x16, 0xeb, 0x7a, 0x75, 0x2c, 0xd7,
|
||||
0x4f, 0xae, 0xd5, 0xe9, 0xe6, 0xe7, 0xad, 0xe8, 0x74, 0xd6, 0xf4, 0xea, 0xa8, 0x50, 0x58, 0xaf
|
||||
];
|
||||
|
||||
// Galios field exponent table
|
||||
var gexp = [
|
||||
0x01, 0x02, 0x04, 0x08, 0x10, 0x20, 0x40, 0x80, 0x1d, 0x3a, 0x74, 0xe8, 0xcd, 0x87, 0x13, 0x26,
|
||||
0x4c, 0x98, 0x2d, 0x5a, 0xb4, 0x75, 0xea, 0xc9, 0x8f, 0x03, 0x06, 0x0c, 0x18, 0x30, 0x60, 0xc0,
|
||||
0x9d, 0x27, 0x4e, 0x9c, 0x25, 0x4a, 0x94, 0x35, 0x6a, 0xd4, 0xb5, 0x77, 0xee, 0xc1, 0x9f, 0x23,
|
||||
0x46, 0x8c, 0x05, 0x0a, 0x14, 0x28, 0x50, 0xa0, 0x5d, 0xba, 0x69, 0xd2, 0xb9, 0x6f, 0xde, 0xa1,
|
||||
0x5f, 0xbe, 0x61, 0xc2, 0x99, 0x2f, 0x5e, 0xbc, 0x65, 0xca, 0x89, 0x0f, 0x1e, 0x3c, 0x78, 0xf0,
|
||||
0xfd, 0xe7, 0xd3, 0xbb, 0x6b, 0xd6, 0xb1, 0x7f, 0xfe, 0xe1, 0xdf, 0xa3, 0x5b, 0xb6, 0x71, 0xe2,
|
||||
0xd9, 0xaf, 0x43, 0x86, 0x11, 0x22, 0x44, 0x88, 0x0d, 0x1a, 0x34, 0x68, 0xd0, 0xbd, 0x67, 0xce,
|
||||
0x81, 0x1f, 0x3e, 0x7c, 0xf8, 0xed, 0xc7, 0x93, 0x3b, 0x76, 0xec, 0xc5, 0x97, 0x33, 0x66, 0xcc,
|
||||
0x85, 0x17, 0x2e, 0x5c, 0xb8, 0x6d, 0xda, 0xa9, 0x4f, 0x9e, 0x21, 0x42, 0x84, 0x15, 0x2a, 0x54,
|
||||
0xa8, 0x4d, 0x9a, 0x29, 0x52, 0xa4, 0x55, 0xaa, 0x49, 0x92, 0x39, 0x72, 0xe4, 0xd5, 0xb7, 0x73,
|
||||
0xe6, 0xd1, 0xbf, 0x63, 0xc6, 0x91, 0x3f, 0x7e, 0xfc, 0xe5, 0xd7, 0xb3, 0x7b, 0xf6, 0xf1, 0xff,
|
||||
0xe3, 0xdb, 0xab, 0x4b, 0x96, 0x31, 0x62, 0xc4, 0x95, 0x37, 0x6e, 0xdc, 0xa5, 0x57, 0xae, 0x41,
|
||||
0x82, 0x19, 0x32, 0x64, 0xc8, 0x8d, 0x07, 0x0e, 0x1c, 0x38, 0x70, 0xe0, 0xdd, 0xa7, 0x53, 0xa6,
|
||||
0x51, 0xa2, 0x59, 0xb2, 0x79, 0xf2, 0xf9, 0xef, 0xc3, 0x9b, 0x2b, 0x56, 0xac, 0x45, 0x8a, 0x09,
|
||||
0x12, 0x24, 0x48, 0x90, 0x3d, 0x7a, 0xf4, 0xf5, 0xf7, 0xf3, 0xfb, 0xeb, 0xcb, 0x8b, 0x0b, 0x16,
|
||||
0x2c, 0x58, 0xb0, 0x7d, 0xfa, 0xe9, 0xcf, 0x83, 0x1b, 0x36, 0x6c, 0xd8, 0xad, 0x47, 0x8e, 0x00
|
||||
];
|
||||
|
||||
// Working buffers:
|
||||
// data input and ecc append, image working buffer, fixed part of image, run lengths for badness
|
||||
var strinbuf = [],
|
||||
eccbuf = [],
|
||||
qrframe = [],
|
||||
framask = [],
|
||||
rlens = [];
|
||||
// Control values - width is based on version, last 4 are from table.
|
||||
var version, width, neccblk1, neccblk2, datablkw, eccblkwid;
|
||||
var ecclevel = 2;
|
||||
// set bit to indicate cell in qrframe is immutable. symmetric around diagonal
|
||||
function setmask(x, y) {
|
||||
var bt;
|
||||
if (x > y) {
|
||||
bt = x;
|
||||
x = y;
|
||||
y = bt;
|
||||
}
|
||||
// y*y = 1+3+5...
|
||||
bt = y;
|
||||
bt *= y;
|
||||
bt += y;
|
||||
bt >>= 1;
|
||||
bt += x;
|
||||
framask[bt] = 1;
|
||||
}
|
||||
|
||||
// enter alignment pattern - black to qrframe, white to mask (later black frame merged to mask)
|
||||
function putalign(x, y) {
|
||||
var j;
|
||||
|
||||
qrframe[x + width * y] = 1;
|
||||
for (j = -2; j < 2; j++) {
|
||||
qrframe[(x + j) + width * (y - 2)] = 1;
|
||||
qrframe[(x - 2) + width * (y + j + 1)] = 1;
|
||||
qrframe[(x + 2) + width * (y + j)] = 1;
|
||||
qrframe[(x + j + 1) + width * (y + 2)] = 1;
|
||||
}
|
||||
for (j = 0; j < 2; j++) {
|
||||
setmask(x - 1, y + j);
|
||||
setmask(x + 1, y - j);
|
||||
setmask(x - j, y - 1);
|
||||
setmask(x + j, y + 1);
|
||||
}
|
||||
}
|
||||
|
||||
//========================================================================
|
||||
// Reed Solomon error correction
|
||||
// exponentiation mod N
|
||||
function modnn(x) {
|
||||
while (x >= 255) {
|
||||
x -= 255;
|
||||
x = (x >> 8) + (x & 255);
|
||||
}
|
||||
return x;
|
||||
}
|
||||
|
||||
var genpoly = [];
|
||||
|
||||
// Calculate and append ECC data to data block. Block is in strinbuf, indexes to buffers given.
|
||||
function appendrs(data, dlen, ecbuf, eclen) {
|
||||
var i, j, fb;
|
||||
|
||||
for (i = 0; i < eclen; i++)
|
||||
strinbuf[ecbuf + i] = 0;
|
||||
for (i = 0; i < dlen; i++) {
|
||||
fb = glog[strinbuf[data + i] ^ strinbuf[ecbuf]];
|
||||
if (fb != 255) /* fb term is non-zero */
|
||||
for (j = 1; j < eclen; j++)
|
||||
strinbuf[ecbuf + j - 1] = strinbuf[ecbuf + j] ^ gexp[modnn(fb + genpoly[eclen - j])];
|
||||
else
|
||||
for (j = ecbuf; j < ecbuf + eclen; j++)
|
||||
strinbuf[j] = strinbuf[j + 1];
|
||||
strinbuf[ecbuf + eclen - 1] = fb == 255 ? 0 : gexp[modnn(fb + genpoly[0])];
|
||||
}
|
||||
}
|
||||
|
||||
//========================================================================
|
||||
// Frame data insert following the path rules
|
||||
|
||||
// check mask - since symmetrical use half.
|
||||
function ismasked(x, y) {
|
||||
var bt;
|
||||
if (x > y) {
|
||||
bt = x;
|
||||
x = y;
|
||||
y = bt;
|
||||
}
|
||||
bt = y;
|
||||
bt += y * y;
|
||||
bt >>= 1;
|
||||
bt += x;
|
||||
return framask[bt];
|
||||
}
|
||||
|
||||
//========================================================================
|
||||
// Apply the selected mask out of the 8.
|
||||
function applymask(m) {
|
||||
var x, y, r3x, r3y;
|
||||
|
||||
switch (m) {
|
||||
case 0:
|
||||
for (y = 0; y < width; y++)
|
||||
for (x = 0; x < width; x++)
|
||||
if (!((x + y) & 1) && !ismasked(x, y))
|
||||
qrframe[x + y * width] ^= 1;
|
||||
break;
|
||||
case 1:
|
||||
for (y = 0; y < width; y++)
|
||||
for (x = 0; x < width; x++)
|
||||
if (!(y & 1) && !ismasked(x, y))
|
||||
qrframe[x + y * width] ^= 1;
|
||||
break;
|
||||
case 2:
|
||||
for (y = 0; y < width; y++)
|
||||
for (r3x = 0, x = 0; x < width; x++, r3x++) {
|
||||
if (r3x == 3)
|
||||
r3x = 0;
|
||||
if (!r3x && !ismasked(x, y))
|
||||
qrframe[x + y * width] ^= 1;
|
||||
}
|
||||
break;
|
||||
case 3:
|
||||
for (r3y = 0, y = 0; y < width; y++, r3y++) {
|
||||
if (r3y == 3)
|
||||
r3y = 0;
|
||||
for (r3x = r3y, x = 0; x < width; x++, r3x++) {
|
||||
if (r3x == 3)
|
||||
r3x = 0;
|
||||
if (!r3x && !ismasked(x, y))
|
||||
qrframe[x + y * width] ^= 1;
|
||||
}
|
||||
}
|
||||
break;
|
||||
case 4:
|
||||
for (y = 0; y < width; y++)
|
||||
for (r3x = 0, r3y = ((y >> 1) & 1), x = 0; x < width; x++, r3x++) {
|
||||
if (r3x == 3) {
|
||||
r3x = 0;
|
||||
r3y = !r3y;
|
||||
}
|
||||
if (!r3y && !ismasked(x, y))
|
||||
qrframe[x + y * width] ^= 1;
|
||||
}
|
||||
break;
|
||||
case 5:
|
||||
for (r3y = 0, y = 0; y < width; y++, r3y++) {
|
||||
if (r3y == 3)
|
||||
r3y = 0;
|
||||
for (r3x = 0, x = 0; x < width; x++, r3x++) {
|
||||
if (r3x == 3)
|
||||
r3x = 0;
|
||||
if (!((x & y & 1) + !(!r3x | !r3y)) && !ismasked(x, y))
|
||||
qrframe[x + y * width] ^= 1;
|
||||
}
|
||||
}
|
||||
break;
|
||||
case 6:
|
||||
for (r3y = 0, y = 0; y < width; y++, r3y++) {
|
||||
if (r3y == 3)
|
||||
r3y = 0;
|
||||
for (r3x = 0, x = 0; x < width; x++, r3x++) {
|
||||
if (r3x == 3)
|
||||
r3x = 0;
|
||||
if (!(((x & y & 1) + (r3x && (r3x == r3y))) & 1) && !ismasked(x, y))
|
||||
qrframe[x + y * width] ^= 1;
|
||||
}
|
||||
}
|
||||
break;
|
||||
case 7:
|
||||
for (r3y = 0, y = 0; y < width; y++, r3y++) {
|
||||
if (r3y == 3)
|
||||
r3y = 0;
|
||||
for (r3x = 0, x = 0; x < width; x++, r3x++) {
|
||||
if (r3x == 3)
|
||||
r3x = 0;
|
||||
if (!(((r3x && (r3x == r3y)) + ((x + y) & 1)) & 1) && !ismasked(x, y))
|
||||
qrframe[x + y * width] ^= 1;
|
||||
}
|
||||
}
|
||||
break;
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
// Badness coefficients.
|
||||
var N1 = 3,
|
||||
N2 = 3,
|
||||
N3 = 40,
|
||||
N4 = 10;
|
||||
|
||||
// Using the table of the length of each run, calculate the amount of bad image
|
||||
// - long runs or those that look like finders; called twice, once each for X and Y
|
||||
function badruns(length) {
|
||||
var i;
|
||||
var runsbad = 0;
|
||||
for (i = 0; i <= length; i++)
|
||||
if (rlens[i] >= 5)
|
||||
runsbad += N1 + rlens[i] - 5;
|
||||
// BwBBBwB as in finder
|
||||
for (i = 3; i < length - 1; i += 2)
|
||||
if (rlens[i - 2] == rlens[i + 2] &&
|
||||
rlens[i + 2] == rlens[i - 1] &&
|
||||
rlens[i - 1] == rlens[i + 1] &&
|
||||
rlens[i - 1] * 3 == rlens[i]
|
||||
// white around the black pattern? Not part of spec
|
||||
&&
|
||||
(rlens[i - 3] == 0 // beginning
|
||||
||
|
||||
i + 3 > length // end
|
||||
||
|
||||
rlens[i - 3] * 3 >= rlens[i] * 4 || rlens[i + 3] * 3 >= rlens[i] * 4)
|
||||
)
|
||||
runsbad += N3;
|
||||
return runsbad;
|
||||
}
|
||||
|
||||
// Calculate how bad the masked image is - blocks, imbalance, runs, or finders.
|
||||
function badcheck() {
|
||||
var x, y, h, b, b1;
|
||||
var thisbad = 0;
|
||||
var bw = 0;
|
||||
|
||||
// blocks of same color.
|
||||
for (y = 0; y < width - 1; y++)
|
||||
for (x = 0; x < width - 1; x++)
|
||||
if ((qrframe[x + width * y] && qrframe[(x + 1) + width * y] &&
|
||||
qrframe[x + width * (y + 1)] && qrframe[(x + 1) + width * (y + 1)]) // all black
|
||||
||
|
||||
!(qrframe[x + width * y] || qrframe[(x + 1) + width * y] ||
|
||||
qrframe[x + width * (y + 1)] || qrframe[(x + 1) + width * (y + 1)])) // all white
|
||||
thisbad += N2;
|
||||
|
||||
// X runs
|
||||
for (y = 0; y < width; y++) {
|
||||
rlens[0] = 0;
|
||||
for (h = b = x = 0; x < width; x++) {
|
||||
if ((b1 = qrframe[x + width * y]) == b)
|
||||
rlens[h]++;
|
||||
else
|
||||
rlens[++h] = 1;
|
||||
b = b1;
|
||||
bw += b ? 1 : -1;
|
||||
}
|
||||
thisbad += badruns(h);
|
||||
}
|
||||
|
||||
// black/white imbalance
|
||||
if (bw < 0)
|
||||
bw = -bw;
|
||||
|
||||
var big = bw;
|
||||
var count = 0;
|
||||
big += big << 2;
|
||||
big <<= 1;
|
||||
while (big > width * width)
|
||||
big -= width * width, count++;
|
||||
thisbad += count * N4;
|
||||
|
||||
// Y runs
|
||||
for (x = 0; x < width; x++) {
|
||||
rlens[0] = 0;
|
||||
for (h = b = y = 0; y < width; y++) {
|
||||
if ((b1 = qrframe[x + width * y]) == b)
|
||||
rlens[h]++;
|
||||
else
|
||||
rlens[++h] = 1;
|
||||
b = b1;
|
||||
}
|
||||
thisbad += badruns(h);
|
||||
}
|
||||
return thisbad;
|
||||
}
|
||||
|
||||
function genframe(instring) {
|
||||
var x, y, k, t, v, i, j, m;
|
||||
|
||||
// find the smallest version that fits the string
|
||||
t = instring.length;
|
||||
version = 0;
|
||||
do {
|
||||
version++;
|
||||
k = (ecclevel - 1) * 4 + (version - 1) * 16;
|
||||
neccblk1 = eccblocks[k++];
|
||||
neccblk2 = eccblocks[k++];
|
||||
datablkw = eccblocks[k++];
|
||||
eccblkwid = eccblocks[k];
|
||||
k = datablkw * (neccblk1 + neccblk2) + neccblk2 - 3 + (version <= 9);
|
||||
if (t <= k)
|
||||
break;
|
||||
} while (version < 40);
|
||||
|
||||
// FIXME - insure that it fits insted of being truncated
|
||||
width = 17 + 4 * version;
|
||||
|
||||
// allocate, clear and setup data structures
|
||||
v = datablkw + (datablkw + eccblkwid) * (neccblk1 + neccblk2) + neccblk2;
|
||||
for (t = 0; t < v; t++)
|
||||
eccbuf[t] = 0;
|
||||
strinbuf = instring.slice(0);
|
||||
|
||||
for (t = 0; t < width * width; t++)
|
||||
qrframe[t] = 0;
|
||||
|
||||
for (t = 0; t < (width * (width + 1) + 1) / 2; t++)
|
||||
framask[t] = 0;
|
||||
|
||||
// insert finders - black to frame, white to mask
|
||||
for (t = 0; t < 3; t++) {
|
||||
k = 0;
|
||||
y = 0;
|
||||
if (t == 1)
|
||||
k = (width - 7);
|
||||
if (t == 2)
|
||||
y = (width - 7);
|
||||
qrframe[(y + 3) + width * (k + 3)] = 1;
|
||||
for (x = 0; x < 6; x++) {
|
||||
qrframe[(y + x) + width * k] = 1;
|
||||
qrframe[y + width * (k + x + 1)] = 1;
|
||||
qrframe[(y + 6) + width * (k + x)] = 1;
|
||||
qrframe[(y + x + 1) + width * (k + 6)] = 1;
|
||||
}
|
||||
for (x = 1; x < 5; x++) {
|
||||
setmask(y + x, k + 1);
|
||||
setmask(y + 1, k + x + 1);
|
||||
setmask(y + 5, k + x);
|
||||
setmask(y + x + 1, k + 5);
|
||||
}
|
||||
for (x = 2; x < 4; x++) {
|
||||
qrframe[(y + x) + width * (k + 2)] = 1;
|
||||
qrframe[(y + 2) + width * (k + x + 1)] = 1;
|
||||
qrframe[(y + 4) + width * (k + x)] = 1;
|
||||
qrframe[(y + x + 1) + width * (k + 4)] = 1;
|
||||
}
|
||||
}
|
||||
|
||||
// alignment blocks
|
||||
if (version > 1) {
|
||||
t = adelta[version];
|
||||
y = width - 7;
|
||||
for (;;) {
|
||||
x = width - 7;
|
||||
while (x > t - 3) {
|
||||
putalign(x, y);
|
||||
if (x < t)
|
||||
break;
|
||||
x -= t;
|
||||
}
|
||||
if (y <= t + 9)
|
||||
break;
|
||||
y -= t;
|
||||
putalign(6, y);
|
||||
putalign(y, 6);
|
||||
}
|
||||
}
|
||||
|
||||
// single black
|
||||
qrframe[8 + width * (width - 8)] = 1;
|
||||
|
||||
// timing gap - mask only
|
||||
for (y = 0; y < 7; y++) {
|
||||
setmask(7, y);
|
||||
setmask(width - 8, y);
|
||||
setmask(7, y + width - 7);
|
||||
}
|
||||
for (x = 0; x < 8; x++) {
|
||||
setmask(x, 7);
|
||||
setmask(x + width - 8, 7);
|
||||
setmask(x, width - 8);
|
||||
}
|
||||
|
||||
// reserve mask-format area
|
||||
for (x = 0; x < 9; x++)
|
||||
setmask(x, 8);
|
||||
for (x = 0; x < 8; x++) {
|
||||
setmask(x + width - 8, 8);
|
||||
setmask(8, x);
|
||||
}
|
||||
for (y = 0; y < 7; y++)
|
||||
setmask(8, y + width - 7);
|
||||
|
||||
// timing row/col
|
||||
for (x = 0; x < width - 14; x++)
|
||||
if (x & 1) {
|
||||
setmask(8 + x, 6);
|
||||
setmask(6, 8 + x);
|
||||
}
|
||||
else {
|
||||
qrframe[(8 + x) + width * 6] = 1;
|
||||
qrframe[6 + width * (8 + x)] = 1;
|
||||
}
|
||||
|
||||
// version block
|
||||
if (version > 6) {
|
||||
t = vpat[version - 7];
|
||||
k = 17;
|
||||
for (x = 0; x < 6; x++)
|
||||
for (y = 0; y < 3; y++, k--)
|
||||
if (1 & (k > 11 ? version >> (k - 12) : t >> k)) {
|
||||
qrframe[(5 - x) + width * (2 - y + width - 11)] = 1;
|
||||
qrframe[(2 - y + width - 11) + width * (5 - x)] = 1;
|
||||
}
|
||||
else {
|
||||
setmask(5 - x, 2 - y + width - 11);
|
||||
setmask(2 - y + width - 11, 5 - x);
|
||||
}
|
||||
}
|
||||
|
||||
// sync mask bits - only set above for white spaces, so add in black bits
|
||||
for (y = 0; y < width; y++)
|
||||
for (x = 0; x <= y; x++)
|
||||
if (qrframe[x + width * y])
|
||||
setmask(x, y);
|
||||
|
||||
// convert string to bitstream
|
||||
// 8 bit data to QR-coded 8 bit data (numeric or alphanum, or kanji not supported)
|
||||
v = strinbuf.length;
|
||||
|
||||
// string to array
|
||||
for (i = 0; i < v; i++)
|
||||
eccbuf[i] = strinbuf.charCodeAt(i);
|
||||
strinbuf = eccbuf.slice(0);
|
||||
|
||||
// calculate max string length
|
||||
x = datablkw * (neccblk1 + neccblk2) + neccblk2;
|
||||
if (v >= x - 2) {
|
||||
v = x - 2;
|
||||
if (version > 9)
|
||||
v--;
|
||||
}
|
||||
|
||||
// shift and repack to insert length prefix
|
||||
i = v;
|
||||
if (version > 9) {
|
||||
strinbuf[i + 2] = 0;
|
||||
strinbuf[i + 3] = 0;
|
||||
while (i--) {
|
||||
t = strinbuf[i];
|
||||
strinbuf[i + 3] |= 255 & (t << 4);
|
||||
strinbuf[i + 2] = t >> 4;
|
||||
}
|
||||
strinbuf[2] |= 255 & (v << 4);
|
||||
strinbuf[1] = v >> 4;
|
||||
strinbuf[0] = 0x40 | (v >> 12);
|
||||
} else {
|
||||
strinbuf[i + 1] = 0;
|
||||
strinbuf[i + 2] = 0;
|
||||
while (i--) {
|
||||
t = strinbuf[i];
|
||||
strinbuf[i + 2] |= 255 & (t << 4);
|
||||
strinbuf[i + 1] = t >> 4;
|
||||
}
|
||||
strinbuf[1] |= 255 & (v << 4);
|
||||
strinbuf[0] = 0x40 | (v >> 4);
|
||||
}
|
||||
// fill to end with pad pattern
|
||||
i = v + 3 - (version < 10);
|
||||
while (i < x) {
|
||||
strinbuf[i++] = 0xec;
|
||||
// buffer has room if (i == x) break;
|
||||
strinbuf[i++] = 0x11;
|
||||
}
|
||||
|
||||
// calculate and append ECC
|
||||
|
||||
// calculate generator polynomial
|
||||
genpoly[0] = 1;
|
||||
for (i = 0; i < eccblkwid; i++) {
|
||||
genpoly[i + 1] = 1;
|
||||
for (j = i; j > 0; j--)
|
||||
genpoly[j] = genpoly[j] ?
|
||||
genpoly[j - 1] ^ gexp[modnn(glog[genpoly[j]] + i)] : genpoly[j - 1];
|
||||
genpoly[0] = gexp[modnn(glog[genpoly[0]] + i)];
|
||||
}
|
||||
for (i = 0; i <= eccblkwid; i++)
|
||||
genpoly[i] = glog[genpoly[i]]; // use logs for genpoly[] to save calc step
|
||||
|
||||
// append ecc to data buffer
|
||||
k = x;
|
||||
y = 0;
|
||||
for (i = 0; i < neccblk1; i++) {
|
||||
appendrs(y, datablkw, k, eccblkwid);
|
||||
y += datablkw;
|
||||
k += eccblkwid;
|
||||
}
|
||||
for (i = 0; i < neccblk2; i++) {
|
||||
appendrs(y, datablkw + 1, k, eccblkwid);
|
||||
y += datablkw + 1;
|
||||
k += eccblkwid;
|
||||
}
|
||||
// interleave blocks
|
||||
y = 0;
|
||||
for (i = 0; i < datablkw; i++) {
|
||||
for (j = 0; j < neccblk1; j++)
|
||||
eccbuf[y++] = strinbuf[i + j * datablkw];
|
||||
for (j = 0; j < neccblk2; j++)
|
||||
eccbuf[y++] = strinbuf[(neccblk1 * datablkw) + i + (j * (datablkw + 1))];
|
||||
}
|
||||
for (j = 0; j < neccblk2; j++)
|
||||
eccbuf[y++] = strinbuf[(neccblk1 * datablkw) + i + (j * (datablkw + 1))];
|
||||
for (i = 0; i < eccblkwid; i++)
|
||||
for (j = 0; j < neccblk1 + neccblk2; j++)
|
||||
eccbuf[y++] = strinbuf[x + i + j * eccblkwid];
|
||||
strinbuf = eccbuf;
|
||||
|
||||
// pack bits into frame avoiding masked area.
|
||||
x = y = width - 1;
|
||||
k = v = 1; // up, minus
|
||||
/* inteleaved data and ecc codes */
|
||||
m = (datablkw + eccblkwid) * (neccblk1 + neccblk2) + neccblk2;
|
||||
for (i = 0; i < m; i++) {
|
||||
t = strinbuf[i];
|
||||
for (j = 0; j < 8; j++, t <<= 1) {
|
||||
if (0x80 & t)
|
||||
qrframe[x + width * y] = 1;
|
||||
do { // find next fill position
|
||||
if (v)
|
||||
x--;
|
||||
else {
|
||||
x++;
|
||||
if (k) {
|
||||
if (y != 0)
|
||||
y--;
|
||||
else {
|
||||
x -= 2;
|
||||
k = !k;
|
||||
if (x == 6) {
|
||||
x--;
|
||||
y = 9;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
if (y != width - 1)
|
||||
y++;
|
||||
else {
|
||||
x -= 2;
|
||||
k = !k;
|
||||
if (x == 6) {
|
||||
x--;
|
||||
y -= 8;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
v = !v;
|
||||
} while (ismasked(x, y));
|
||||
}
|
||||
}
|
||||
|
||||
// save pre-mask copy of frame
|
||||
strinbuf = qrframe.slice(0);
|
||||
t = 0; // best
|
||||
y = 30000; // demerit
|
||||
// for instead of while since in original arduino code
|
||||
// if an early mask was "good enough" it wouldn't try for a better one
|
||||
// since they get more complex and take longer.
|
||||
for (k = 0; k < 8; k++) {
|
||||
applymask(k); // returns black-white imbalance
|
||||
x = badcheck();
|
||||
if (x < y) { // current mask better than previous best?
|
||||
y = x;
|
||||
t = k;
|
||||
}
|
||||
if (t == 7)
|
||||
break; // don't increment i to a void redoing mask
|
||||
qrframe = strinbuf.slice(0); // reset for next pass
|
||||
}
|
||||
if (t != k) // redo best mask - none good enough, last wasn't t
|
||||
applymask(t);
|
||||
|
||||
// add in final mask/ecclevel bytes
|
||||
y = fmtword[t + ((ecclevel - 1) << 3)];
|
||||
// low byte
|
||||
for (k = 0; k < 8; k++, y >>= 1)
|
||||
if (y & 1) {
|
||||
qrframe[(width - 1 - k) + width * 8] = 1;
|
||||
if (k < 6)
|
||||
qrframe[8 + width * k] = 1;
|
||||
else
|
||||
qrframe[8 + width * (k + 1)] = 1;
|
||||
}
|
||||
// high byte
|
||||
for (k = 0; k < 7; k++, y >>= 1)
|
||||
if (y & 1) {
|
||||
qrframe[8 + width * (width - 7 + k)] = 1;
|
||||
if (k)
|
||||
qrframe[(6 - k) + width * 8] = 1;
|
||||
else
|
||||
qrframe[7 + width * 8] = 1;
|
||||
}
|
||||
return qrframe;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
var _canvas = null;
|
||||
|
||||
var api = {
|
||||
|
||||
get ecclevel() {
|
||||
return ecclevel;
|
||||
},
|
||||
|
||||
set ecclevel(val) {
|
||||
ecclevel = val;
|
||||
},
|
||||
|
||||
get size() {
|
||||
return _size;
|
||||
},
|
||||
|
||||
set size(val) {
|
||||
_size = val
|
||||
},
|
||||
|
||||
get canvas() {
|
||||
return _canvas;
|
||||
},
|
||||
|
||||
set canvas(el) {
|
||||
_canvas = el;
|
||||
},
|
||||
|
||||
getFrame: function(string) {
|
||||
return genframe(string);
|
||||
},
|
||||
//这里的utf16to8(str)是对Text中的字符串进行转码,让其支持中文
|
||||
utf16to8: function(str) {
|
||||
var out, i, len, c;
|
||||
|
||||
out = "";
|
||||
len = str.length;
|
||||
for (i = 0; i < len; i++) {
|
||||
c = str.charCodeAt(i);
|
||||
if ((c >= 0x0001) && (c <= 0x007F)) {
|
||||
out += str.charAt(i);
|
||||
} else if (c > 0x07FF) {
|
||||
out += String.fromCharCode(0xE0 | ((c >> 12) & 0x0F));
|
||||
out += String.fromCharCode(0x80 | ((c >> 6) & 0x3F));
|
||||
out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));
|
||||
} else {
|
||||
out += String.fromCharCode(0xC0 | ((c >> 6) & 0x1F));
|
||||
out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));
|
||||
}
|
||||
}
|
||||
return out;
|
||||
},
|
||||
/**
|
||||
* 新增$this参数,传入组件的this,兼容在组件中生成
|
||||
*/
|
||||
draw: function(str, canvas, cavW, cavH, cavColor, haveImg, imageUrl, imageSize, $this, cb = function() {}, ecc) {
|
||||
var that = this;
|
||||
ecclevel = ecc || ecclevel;
|
||||
canvas = canvas || _canvas;
|
||||
if (!canvas) {
|
||||
console.warn('No canvas provided to draw QR code in!')
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
let pre_background = "#ffffff";
|
||||
var size = Math.min(cavW, cavH);
|
||||
str = that.utf16to8(str); //增加中文显示
|
||||
|
||||
var frame = that.getFrame(str);
|
||||
// 组件中生成qrcode需要绑定this
|
||||
var ctx = uni.createCanvasContext(canvas, $this);
|
||||
var px = Math.round(size / (width ));
|
||||
|
||||
var roundedSize = px * (width);
|
||||
// var px = 1 ;
|
||||
// var roundedSize = px * (width + 8) ;
|
||||
|
||||
//var roundedSize = 0 ;
|
||||
//var offset = Math.floor((size - roundedSize) / 2);
|
||||
var offset = 0 ;
|
||||
size = roundedSize;
|
||||
//ctx.clearRect(0, 0, cavW, cavW);
|
||||
ctx.setFillStyle(pre_background)
|
||||
ctx.fillRect(0, 0, cavW, cavW);
|
||||
ctx.setFillStyle(cavColor);
|
||||
for (var i = 0; i < width; i++) {
|
||||
for (var j = 0; j < width; j++) {
|
||||
if (frame[j * width + i]) {
|
||||
ctx.fillRect(px * ( i) + offset, px * ( j) + offset, px, px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//画图片
|
||||
if (haveImg) {
|
||||
try {
|
||||
var x = Number(((cavW - imageSize - 14) / 2).toFixed(2));
|
||||
var y = Number(((cavH - imageSize -14) / 2).toFixed(2));
|
||||
drawRoundedRect(ctx, x, y, imageSize, imageSize, imageSize / 2, 6, true, true)
|
||||
|
||||
let isNetImg = false;
|
||||
|
||||
isNetImg = imageUrl.substr(0, 4) == 'http' ? true : false;
|
||||
|
||||
if (isNetImg) {
|
||||
//网络图片下载到本地
|
||||
uni.getImageInfo({
|
||||
src: imageUrl,
|
||||
success: function(res) {
|
||||
ctx.drawImage(res.path, x, y, imageSize, imageSize);
|
||||
//--增加绘制完成回调
|
||||
ctx.draw(false, function() {
|
||||
cb();
|
||||
})
|
||||
}
|
||||
})
|
||||
} else {
|
||||
ctx.drawImage(imageUrl, x, y, imageSize, imageSize);
|
||||
//--增加绘制完成回调
|
||||
ctx.draw(false, function() {
|
||||
cb();
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// 画圆角矩形
|
||||
function drawRoundedRect(ctxi, x, y, width, height, r, lineWidth, fill, stroke) {
|
||||
ctxi.setLineWidth(lineWidth);
|
||||
ctxi.setFillStyle(pre_background);
|
||||
ctxi.setStrokeStyle(pre_background);
|
||||
ctxi.beginPath(); // draw top and top right corner
|
||||
ctxi.moveTo(x + r, y);
|
||||
ctxi.arcTo(x + width, y, x + width, y + r, r); // draw right side and bottom right corner
|
||||
ctxi.arcTo(x + width, y + height, x + width - r, y + height, r); // draw bottom and bottom left corner
|
||||
ctxi.arcTo(x, y + height, x, y + height - r, r); // draw left and top left corner
|
||||
ctxi.arcTo(x, y, x + r, y, r);
|
||||
ctxi.closePath();
|
||||
if (fill) {
|
||||
ctxi.fill();
|
||||
}
|
||||
if (stroke) {
|
||||
ctxi.stroke();
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
//TODO handle the exception
|
||||
}
|
||||
|
||||
} else {
|
||||
//--增加绘制完成回调
|
||||
ctx.draw(false, function() {
|
||||
cb();
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
module.exports = {
|
||||
api
|
||||
}
|
||||
})();
|
|
@ -0,0 +1,424 @@
|
|||
//Core code comes from https://github.com/davidshimjs/qrcodejs
|
||||
|
||||
var QRCode;
|
||||
|
||||
(function () {
|
||||
/**
|
||||
* Get the type by string length
|
||||
*
|
||||
* @private
|
||||
* @param {String} sText
|
||||
* @param {Number} nCorrectLevel
|
||||
* @return {Number} type
|
||||
*/
|
||||
function _getTypeNumber(sText, nCorrectLevel) {
|
||||
var nType = 1;
|
||||
var length = _getUTF8Length(sText);
|
||||
|
||||
for (var i = 0, len = QRCodeLimitLength.length; i <= len; i++) {
|
||||
var nLimit = 0;
|
||||
|
||||
switch (nCorrectLevel) {
|
||||
case QRErrorCorrectLevel.L:
|
||||
nLimit = QRCodeLimitLength[i][0];
|
||||
break;
|
||||
case QRErrorCorrectLevel.M:
|
||||
nLimit = QRCodeLimitLength[i][1];
|
||||
break;
|
||||
case QRErrorCorrectLevel.Q:
|
||||
nLimit = QRCodeLimitLength[i][2];
|
||||
break;
|
||||
case QRErrorCorrectLevel.H:
|
||||
nLimit = QRCodeLimitLength[i][3];
|
||||
break;
|
||||
}
|
||||
|
||||
if (length <= nLimit) {
|
||||
break;
|
||||
} else {
|
||||
nType++;
|
||||
}
|
||||
}
|
||||
|
||||
if (nType > QRCodeLimitLength.length) {
|
||||
throw new Error("Too long data");
|
||||
}
|
||||
|
||||
return nType;
|
||||
}
|
||||
|
||||
function _getUTF8Length(sText) {
|
||||
var replacedText = encodeURI(sText).toString().replace(/\%[0-9a-fA-F]{2}/g, 'a');
|
||||
return replacedText.length + (replacedText.length != sText ? 3 : 0);
|
||||
}
|
||||
|
||||
function QR8bitByte(data) {
|
||||
this.mode = QRMode.MODE_8BIT_BYTE;
|
||||
this.data = data;
|
||||
this.parsedData = [];
|
||||
|
||||
// Added to support UTF-8 Characters
|
||||
for (var i = 0, l = this.data.length; i < l; i++) {
|
||||
var byteArray = [];
|
||||
var code = this.data.charCodeAt(i);
|
||||
|
||||
if (code > 0x10000) {
|
||||
byteArray[0] = 0xF0 | ((code & 0x1C0000) >>> 18);
|
||||
byteArray[1] = 0x80 | ((code & 0x3F000) >>> 12);
|
||||
byteArray[2] = 0x80 | ((code & 0xFC0) >>> 6);
|
||||
byteArray[3] = 0x80 | (code & 0x3F);
|
||||
} else if (code > 0x800) {
|
||||
byteArray[0] = 0xE0 | ((code & 0xF000) >>> 12);
|
||||
byteArray[1] = 0x80 | ((code & 0xFC0) >>> 6);
|
||||
byteArray[2] = 0x80 | (code & 0x3F);
|
||||
} else if (code > 0x80) {
|
||||
byteArray[0] = 0xC0 | ((code & 0x7C0) >>> 6);
|
||||
byteArray[1] = 0x80 | (code & 0x3F);
|
||||
} else {
|
||||
byteArray[0] = code;
|
||||
}
|
||||
|
||||
this.parsedData.push(byteArray);
|
||||
}
|
||||
|
||||
this.parsedData = Array.prototype.concat.apply([], this.parsedData);
|
||||
|
||||
if (this.parsedData.length != this.data.length) {
|
||||
this.parsedData.unshift(191);
|
||||
this.parsedData.unshift(187);
|
||||
this.parsedData.unshift(239);
|
||||
}
|
||||
}
|
||||
|
||||
QR8bitByte.prototype = {
|
||||
getLength: function (buffer) {
|
||||
return this.parsedData.length;
|
||||
},
|
||||
write: function (buffer) {
|
||||
for (var i = 0, l = this.parsedData.length; i < l; i++) {
|
||||
buffer.put(this.parsedData[i], 8);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
// QRCodeModel
|
||||
function QRCodeModel(typeNumber, errorCorrectLevel) {
|
||||
this.typeNumber = typeNumber;
|
||||
this.errorCorrectLevel = errorCorrectLevel;
|
||||
this.modules = null;
|
||||
this.moduleCount = 0;
|
||||
this.dataCache = null;
|
||||
this.dataList = [];
|
||||
}
|
||||
QRCodeModel.prototype = {
|
||||
addData: function (data) { var newData = new QR8bitByte(data); this.dataList.push(newData); this.dataCache = null; }, isDark: function (row, col) {
|
||||
if (row < 0 || this.moduleCount <= row || col < 0 || this.moduleCount <= col) { throw new Error(row + "," + col); }
|
||||
return this.modules[row][col];
|
||||
}, getModuleCount: function () { return this.moduleCount; }, make: function () { this.makeImpl(false, this.getBestMaskPattern()); }, makeImpl: function (test, maskPattern) {
|
||||
this.moduleCount = this.typeNumber * 4 + 17; this.modules = new Array(this.moduleCount); for (var row = 0; row < this.moduleCount; row++) { this.modules[row] = new Array(this.moduleCount); for (var col = 0; col < this.moduleCount; col++) { this.modules[row][col] = null; } }
|
||||
this.setupPositionProbePattern(0, 0); this.setupPositionProbePattern(this.moduleCount - 7, 0); this.setupPositionProbePattern(0, this.moduleCount - 7); this.setupPositionAdjustPattern(); this.setupTimingPattern(); this.setupTypeInfo(test, maskPattern); if (this.typeNumber >= 7) { this.setupTypeNumber(test); }
|
||||
if (this.dataCache == null) { this.dataCache = QRCodeModel.createData(this.typeNumber, this.errorCorrectLevel, this.dataList); }
|
||||
this.mapData(this.dataCache, maskPattern);
|
||||
}, setupPositionProbePattern: function (row, col) { for (var r = -1; r <= 7; r++) { if (row + r <= -1 || this.moduleCount <= row + r) continue; for (var c = -1; c <= 7; c++) { if (col + c <= -1 || this.moduleCount <= col + c) continue; if ((0 <= r && r <= 6 && (c == 0 || c == 6)) || (0 <= c && c <= 6 && (r == 0 || r == 6)) || (2 <= r && r <= 4 && 2 <= c && c <= 4)) { this.modules[row + r][col + c] = true; } else { this.modules[row + r][col + c] = false; } } } }, getBestMaskPattern: function () {
|
||||
var minLostPoint = 0; var pattern = 0; for (var i = 0; i < 8; i++) { this.makeImpl(true, i); var lostPoint = QRUtil.getLostPoint(this); if (i == 0 || minLostPoint > lostPoint) { minLostPoint = lostPoint; pattern = i; } }
|
||||
return pattern;
|
||||
}, createMovieClip: function (target_mc, instance_name, depth) {
|
||||
var qr_mc = target_mc.createEmptyMovieClip(instance_name, depth); var cs = 1; this.make(); for (var row = 0; row < this.modules.length; row++) { var y = row * cs; for (var col = 0; col < this.modules[row].length; col++) { var x = col * cs; var dark = this.modules[row][col]; if (dark) { qr_mc.beginFill(0, 100); qr_mc.moveTo(x, y); qr_mc.lineTo(x + cs, y); qr_mc.lineTo(x + cs, y + cs); qr_mc.lineTo(x, y + cs); qr_mc.endFill(); } } }
|
||||
return qr_mc;
|
||||
}, setupTimingPattern: function () {
|
||||
for (var r = 8; r < this.moduleCount - 8; r++) {
|
||||
if (this.modules[r][6] != null) { continue; }
|
||||
this.modules[r][6] = (r % 2 == 0);
|
||||
}
|
||||
for (var c = 8; c < this.moduleCount - 8; c++) {
|
||||
if (this.modules[6][c] != null) { continue; }
|
||||
this.modules[6][c] = (c % 2 == 0);
|
||||
}
|
||||
}, setupPositionAdjustPattern: function () {
|
||||
var pos = QRUtil.getPatternPosition(this.typeNumber); for (var i = 0; i < pos.length; i++) {
|
||||
for (var j = 0; j < pos.length; j++) {
|
||||
var row = pos[i]; var col = pos[j]; if (this.modules[row][col] != null) { continue; }
|
||||
for (var r = -2; r <= 2; r++) { for (var c = -2; c <= 2; c++) { if (r == -2 || r == 2 || c == -2 || c == 2 || (r == 0 && c == 0)) { this.modules[row + r][col + c] = true; } else { this.modules[row + r][col + c] = false; } } }
|
||||
}
|
||||
}
|
||||
}, setupTypeNumber: function (test) {
|
||||
var bits = QRUtil.getBCHTypeNumber(this.typeNumber); for (var i = 0; i < 18; i++) { var mod = (!test && ((bits >> i) & 1) == 1); this.modules[Math.floor(i / 3)][i % 3 + this.moduleCount - 8 - 3] = mod; }
|
||||
for (var i = 0; i < 18; i++) { var mod = (!test && ((bits >> i) & 1) == 1); this.modules[i % 3 + this.moduleCount - 8 - 3][Math.floor(i / 3)] = mod; }
|
||||
}, setupTypeInfo: function (test, maskPattern) {
|
||||
var data = (this.errorCorrectLevel << 3) | maskPattern; var bits = QRUtil.getBCHTypeInfo(data); for (var i = 0; i < 15; i++) { var mod = (!test && ((bits >> i) & 1) == 1); if (i < 6) { this.modules[i][8] = mod; } else if (i < 8) { this.modules[i + 1][8] = mod; } else { this.modules[this.moduleCount - 15 + i][8] = mod; } }
|
||||
for (var i = 0; i < 15; i++) { var mod = (!test && ((bits >> i) & 1) == 1); if (i < 8) { this.modules[8][this.moduleCount - i - 1] = mod; } else if (i < 9) { this.modules[8][15 - i - 1 + 1] = mod; } else { this.modules[8][15 - i - 1] = mod; } }
|
||||
this.modules[this.moduleCount - 8][8] = (!test);
|
||||
}, mapData: function (data, maskPattern) {
|
||||
var inc = -1; var row = this.moduleCount - 1; var bitIndex = 7; var byteIndex = 0; for (var col = this.moduleCount - 1; col > 0; col -= 2) {
|
||||
if (col == 6) col--; while (true) {
|
||||
for (var c = 0; c < 2; c++) {
|
||||
if (this.modules[row][col - c] == null) {
|
||||
var dark = false; if (byteIndex < data.length) { dark = (((data[byteIndex] >>> bitIndex) & 1) == 1); }
|
||||
var mask = QRUtil.getMask(maskPattern, row, col - c); if (mask) { dark = !dark; }
|
||||
this.modules[row][col - c] = dark; bitIndex--; if (bitIndex == -1) { byteIndex++; bitIndex = 7; }
|
||||
}
|
||||
}
|
||||
row += inc; if (row < 0 || this.moduleCount <= row) { row -= inc; inc = -inc; break; }
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
QRCodeModel.PAD0 = 0xEC;
|
||||
QRCodeModel.PAD1 = 0x11;
|
||||
QRCodeModel.createData = function (typeNumber, errorCorrectLevel, dataList) {
|
||||
var rsBlocks = QRRSBlock.getRSBlocks(typeNumber, errorCorrectLevel); var buffer = new QRBitBuffer(); for (var i = 0; i < dataList.length; i++) { var data = dataList[i]; buffer.put(data.mode, 4); buffer.put(data.getLength(), QRUtil.getLengthInBits(data.mode, typeNumber)); data.write(buffer); }
|
||||
var totalDataCount = 0; for (var i = 0; i < rsBlocks.length; i++) { totalDataCount += rsBlocks[i].dataCount; }
|
||||
if (buffer.getLengthInBits() > totalDataCount * 8) {
|
||||
throw new Error("code length overflow. ("
|
||||
+ buffer.getLengthInBits()
|
||||
+ ">"
|
||||
+ totalDataCount * 8
|
||||
+ ")");
|
||||
}
|
||||
if (buffer.getLengthInBits() + 4 <= totalDataCount * 8) { buffer.put(0, 4); }
|
||||
while (buffer.getLengthInBits() % 8 != 0) { buffer.putBit(false); }
|
||||
while (true) {
|
||||
if (buffer.getLengthInBits() >= totalDataCount * 8) { break; }
|
||||
buffer.put(QRCodeModel.PAD0, 8); if (buffer.getLengthInBits() >= totalDataCount * 8) { break; }
|
||||
buffer.put(QRCodeModel.PAD1, 8);
|
||||
}
|
||||
return QRCodeModel.createBytes(buffer, rsBlocks);
|
||||
};
|
||||
QRCodeModel.createBytes = function (buffer, rsBlocks) {
|
||||
var offset = 0; var maxDcCount = 0; var maxEcCount = 0; var dcdata = new Array(rsBlocks.length); var ecdata = new Array(rsBlocks.length); for (var r = 0; r < rsBlocks.length; r++) {
|
||||
var dcCount = rsBlocks[r].dataCount; var ecCount = rsBlocks[r].totalCount - dcCount; maxDcCount = Math.max(maxDcCount, dcCount); maxEcCount = Math.max(maxEcCount, ecCount); dcdata[r] = new Array(dcCount); for (var i = 0; i < dcdata[r].length; i++) { dcdata[r][i] = 0xff & buffer.buffer[i + offset]; }
|
||||
offset += dcCount; var rsPoly = QRUtil.getErrorCorrectPolynomial(ecCount); var rawPoly = new QRPolynomial(dcdata[r], rsPoly.getLength() - 1); var modPoly = rawPoly.mod(rsPoly); ecdata[r] = new Array(rsPoly.getLength() - 1); for (var i = 0; i < ecdata[r].length; i++) { var modIndex = i + modPoly.getLength() - ecdata[r].length; ecdata[r][i] = (modIndex >= 0) ? modPoly.get(modIndex) : 0; }
|
||||
}
|
||||
var totalCodeCount = 0; for (var i = 0; i < rsBlocks.length; i++) { totalCodeCount += rsBlocks[i].totalCount; }
|
||||
var data = new Array(totalCodeCount); var index = 0; for (var i = 0; i < maxDcCount; i++) { for (var r = 0; r < rsBlocks.length; r++) { if (i < dcdata[r].length) { data[index++] = dcdata[r][i]; } } }
|
||||
for (var i = 0; i < maxEcCount; i++) { for (var r = 0; r < rsBlocks.length; r++) { if (i < ecdata[r].length) { data[index++] = ecdata[r][i]; } } }
|
||||
return data;
|
||||
};
|
||||
var QRMode = { MODE_NUMBER: 1 << 0, MODE_ALPHA_NUM: 1 << 1, MODE_8BIT_BYTE: 1 << 2, MODE_KANJI: 1 << 3 };
|
||||
var QRErrorCorrectLevel = { L: 1, M: 0, Q: 3, H: 2 };
|
||||
var QRMaskPattern = { PATTERN000: 0, PATTERN001: 1, PATTERN010: 2, PATTERN011: 3, PATTERN100: 4, PATTERN101: 5, PATTERN110: 6, PATTERN111: 7 };
|
||||
var QRUtil = {
|
||||
PATTERN_POSITION_TABLE: [[], [6, 18], [6, 22], [6, 26], [6, 30], [6, 34], [6, 22, 38], [6, 24, 42], [6, 26, 46], [6, 28, 50], [6, 30, 54], [6, 32, 58], [6, 34, 62], [6, 26, 46, 66], [6, 26, 48, 70], [6, 26, 50, 74], [6, 30, 54, 78], [6, 30, 56, 82], [6, 30, 58, 86], [6, 34, 62, 90], [6, 28, 50, 72, 94], [6, 26, 50, 74, 98], [6, 30, 54, 78, 102], [6, 28, 54, 80, 106], [6, 32, 58, 84, 110], [6, 30, 58, 86, 114], [6, 34, 62, 90, 118], [6, 26, 50, 74, 98, 122], [6, 30, 54, 78, 102, 126], [6, 26, 52, 78, 104, 130], [6, 30, 56, 82, 108, 134], [6, 34, 60, 86, 112, 138], [6, 30, 58, 86, 114, 142], [6, 34, 62, 90, 118, 146], [6, 30, 54, 78, 102, 126, 150], [6, 24, 50, 76, 102, 128, 154], [6, 28, 54, 80, 106, 132, 158], [6, 32, 58, 84, 110, 136, 162], [6, 26, 54, 82, 110, 138, 166], [6, 30, 58, 86, 114, 142, 170]], G15: (1 << 10) | (1 << 8) | (1 << 5) | (1 << 4) | (1 << 2) | (1 << 1) | (1 << 0), G18: (1 << 12) | (1 << 11) | (1 << 10) | (1 << 9) | (1 << 8) | (1 << 5) | (1 << 2) | (1 << 0), G15_MASK: (1 << 14) | (1 << 12) | (1 << 10) | (1 << 4) | (1 << 1), getBCHTypeInfo: function (data) {
|
||||
var d = data << 10; while (QRUtil.getBCHDigit(d) - QRUtil.getBCHDigit(QRUtil.G15) >= 0) { d ^= (QRUtil.G15 << (QRUtil.getBCHDigit(d) - QRUtil.getBCHDigit(QRUtil.G15))); }
|
||||
return ((data << 10) | d) ^ QRUtil.G15_MASK;
|
||||
}, getBCHTypeNumber: function (data) {
|
||||
var d = data << 12; while (QRUtil.getBCHDigit(d) - QRUtil.getBCHDigit(QRUtil.G18) >= 0) { d ^= (QRUtil.G18 << (QRUtil.getBCHDigit(d) - QRUtil.getBCHDigit(QRUtil.G18))); }
|
||||
return (data << 12) | d;
|
||||
}, getBCHDigit: function (data) {
|
||||
var digit = 0; while (data != 0) { digit++; data >>>= 1; }
|
||||
return digit;
|
||||
}, getPatternPosition: function (typeNumber) { return QRUtil.PATTERN_POSITION_TABLE[typeNumber - 1]; }, getMask: function (maskPattern, i, j) { switch (maskPattern) { case QRMaskPattern.PATTERN000: return (i + j) % 2 == 0; case QRMaskPattern.PATTERN001: return i % 2 == 0; case QRMaskPattern.PATTERN010: return j % 3 == 0; case QRMaskPattern.PATTERN011: return (i + j) % 3 == 0; case QRMaskPattern.PATTERN100: return (Math.floor(i / 2) + Math.floor(j / 3)) % 2 == 0; case QRMaskPattern.PATTERN101: return (i * j) % 2 + (i * j) % 3 == 0; case QRMaskPattern.PATTERN110: return ((i * j) % 2 + (i * j) % 3) % 2 == 0; case QRMaskPattern.PATTERN111: return ((i * j) % 3 + (i + j) % 2) % 2 == 0; default: throw new Error("bad maskPattern:" + maskPattern); } }, getErrorCorrectPolynomial: function (errorCorrectLength) {
|
||||
var a = new QRPolynomial([1], 0); for (var i = 0; i < errorCorrectLength; i++) { a = a.multiply(new QRPolynomial([1, QRMath.gexp(i)], 0)); }
|
||||
return a;
|
||||
}, getLengthInBits: function (mode, type) { if (1 <= type && type < 10) { switch (mode) { case QRMode.MODE_NUMBER: return 10; case QRMode.MODE_ALPHA_NUM: return 9; case QRMode.MODE_8BIT_BYTE: return 8; case QRMode.MODE_KANJI: return 8; default: throw new Error("mode:" + mode); } } else if (type < 27) { switch (mode) { case QRMode.MODE_NUMBER: return 12; case QRMode.MODE_ALPHA_NUM: return 11; case QRMode.MODE_8BIT_BYTE: return 16; case QRMode.MODE_KANJI: return 10; default: throw new Error("mode:" + mode); } } else if (type < 41) { switch (mode) { case QRMode.MODE_NUMBER: return 14; case QRMode.MODE_ALPHA_NUM: return 13; case QRMode.MODE_8BIT_BYTE: return 16; case QRMode.MODE_KANJI: return 12; default: throw new Error("mode:" + mode); } } else { throw new Error("type:" + type); } }, getLostPoint: function (qrCode) {
|
||||
var moduleCount = qrCode.getModuleCount(); var lostPoint = 0; for (var row = 0; row < moduleCount; row++) {
|
||||
for (var col = 0; col < moduleCount; col++) {
|
||||
var sameCount = 0; var dark = qrCode.isDark(row, col); for (var r = -1; r <= 1; r++) {
|
||||
if (row + r < 0 || moduleCount <= row + r) { continue; }
|
||||
for (var c = -1; c <= 1; c++) {
|
||||
if (col + c < 0 || moduleCount <= col + c) { continue; }
|
||||
if (r == 0 && c == 0) { continue; }
|
||||
if (dark == qrCode.isDark(row + r, col + c)) { sameCount++; }
|
||||
}
|
||||
}
|
||||
if (sameCount > 5) { lostPoint += (3 + sameCount - 5); }
|
||||
}
|
||||
}
|
||||
for (var row = 0; row < moduleCount - 1; row++) { for (var col = 0; col < moduleCount - 1; col++) { var count = 0; if (qrCode.isDark(row, col)) count++; if (qrCode.isDark(row + 1, col)) count++; if (qrCode.isDark(row, col + 1)) count++; if (qrCode.isDark(row + 1, col + 1)) count++; if (count == 0 || count == 4) { lostPoint += 3; } } }
|
||||
for (var row = 0; row < moduleCount; row++) { for (var col = 0; col < moduleCount - 6; col++) { if (qrCode.isDark(row, col) && !qrCode.isDark(row, col + 1) && qrCode.isDark(row, col + 2) && qrCode.isDark(row, col + 3) && qrCode.isDark(row, col + 4) && !qrCode.isDark(row, col + 5) && qrCode.isDark(row, col + 6)) { lostPoint += 40; } } }
|
||||
for (var col = 0; col < moduleCount; col++) { for (var row = 0; row < moduleCount - 6; row++) { if (qrCode.isDark(row, col) && !qrCode.isDark(row + 1, col) && qrCode.isDark(row + 2, col) && qrCode.isDark(row + 3, col) && qrCode.isDark(row + 4, col) && !qrCode.isDark(row + 5, col) && qrCode.isDark(row + 6, col)) { lostPoint += 40; } } }
|
||||
var darkCount = 0; for (var col = 0; col < moduleCount; col++) { for (var row = 0; row < moduleCount; row++) { if (qrCode.isDark(row, col)) { darkCount++; } } }
|
||||
var ratio = Math.abs(100 * darkCount / moduleCount / moduleCount - 50) / 5; lostPoint += ratio * 10; return lostPoint;
|
||||
}
|
||||
};
|
||||
var QRMath = {
|
||||
glog: function (n) {
|
||||
if (n < 1) { throw new Error("glog(" + n + ")"); }
|
||||
return QRMath.LOG_TABLE[n];
|
||||
}, gexp: function (n) {
|
||||
while (n < 0) { n += 255; }
|
||||
while (n >= 256) { n -= 255; }
|
||||
return QRMath.EXP_TABLE[n];
|
||||
}, EXP_TABLE: new Array(256), LOG_TABLE: new Array(256)
|
||||
}; for (var i = 0; i < 8; i++) { QRMath.EXP_TABLE[i] = 1 << i; }
|
||||
for (var i = 8; i < 256; i++) { QRMath.EXP_TABLE[i] = QRMath.EXP_TABLE[i - 4] ^ QRMath.EXP_TABLE[i - 5] ^ QRMath.EXP_TABLE[i - 6] ^ QRMath.EXP_TABLE[i - 8]; }
|
||||
for (var i = 0; i < 255; i++) { QRMath.LOG_TABLE[QRMath.EXP_TABLE[i]] = i; }
|
||||
function QRPolynomial(num, shift) {
|
||||
if (num.length == undefined) { throw new Error(num.length + "/" + shift); }
|
||||
var offset = 0; while (offset < num.length && num[offset] == 0) { offset++; }
|
||||
this.num = new Array(num.length - offset + shift); for (var i = 0; i < num.length - offset; i++) { this.num[i] = num[i + offset]; }
|
||||
}
|
||||
QRPolynomial.prototype = {
|
||||
get: function (index) { return this.num[index]; }, getLength: function () { return this.num.length; }, multiply: function (e) {
|
||||
var num = new Array(this.getLength() + e.getLength() - 1); for (var i = 0; i < this.getLength(); i++) { for (var j = 0; j < e.getLength(); j++) { num[i + j] ^= QRMath.gexp(QRMath.glog(this.get(i)) + QRMath.glog(e.get(j))); } }
|
||||
return new QRPolynomial(num, 0);
|
||||
}, mod: function (e) {
|
||||
if (this.getLength() - e.getLength() < 0) { return this; }
|
||||
var ratio = QRMath.glog(this.get(0)) - QRMath.glog(e.get(0)); var num = new Array(this.getLength()); for (var i = 0; i < this.getLength(); i++) { num[i] = this.get(i); }
|
||||
for (var i = 0; i < e.getLength(); i++) { num[i] ^= QRMath.gexp(QRMath.glog(e.get(i)) + ratio); }
|
||||
return new QRPolynomial(num, 0).mod(e);
|
||||
}
|
||||
};
|
||||
function QRRSBlock(totalCount, dataCount) { this.totalCount = totalCount; this.dataCount = dataCount; }
|
||||
QRRSBlock.RS_BLOCK_TABLE = [[1, 26, 19], [1, 26, 16], [1, 26, 13], [1, 26, 9], [1, 44, 34], [1, 44, 28], [1, 44, 22], [1, 44, 16], [1, 70, 55], [1, 70, 44], [2, 35, 17], [2, 35, 13], [1, 100, 80], [2, 50, 32], [2, 50, 24], [4, 25, 9], [1, 134, 108], [2, 67, 43], [2, 33, 15, 2, 34, 16], [2, 33, 11, 2, 34, 12], [2, 86, 68], [4, 43, 27], [4, 43, 19], [4, 43, 15], [2, 98, 78], [4, 49, 31], [2, 32, 14, 4, 33, 15], [4, 39, 13, 1, 40, 14], [2, 121, 97], [2, 60, 38, 2, 61, 39], [4, 40, 18, 2, 41, 19], [4, 40, 14, 2, 41, 15], [2, 146, 116], [3, 58, 36, 2, 59, 37], [4, 36, 16, 4, 37, 17], [4, 36, 12, 4, 37, 13], [2, 86, 68, 2, 87, 69], [4, 69, 43, 1, 70, 44], [6, 43, 19, 2, 44, 20], [6, 43, 15, 2, 44, 16], [4, 101, 81], [1, 80, 50, 4, 81, 51], [4, 50, 22, 4, 51, 23], [3, 36, 12, 8, 37, 13], [2, 116, 92, 2, 117, 93], [6, 58, 36, 2, 59, 37], [4, 46, 20, 6, 47, 21], [7, 42, 14, 4, 43, 15], [4, 133, 107], [8, 59, 37, 1, 60, 38], [8, 44, 20, 4, 45, 21], [12, 33, 11, 4, 34, 12], [3, 145, 115, 1, 146, 116], [4, 64, 40, 5, 65, 41], [11, 36, 16, 5, 37, 17], [11, 36, 12, 5, 37, 13], [5, 109, 87, 1, 110, 88], [5, 65, 41, 5, 66, 42], [5, 54, 24, 7, 55, 25], [11, 36, 12], [5, 122, 98, 1, 123, 99], [7, 73, 45, 3, 74, 46], [15, 43, 19, 2, 44, 20], [3, 45, 15, 13, 46, 16], [1, 135, 107, 5, 136, 108], [10, 74, 46, 1, 75, 47], [1, 50, 22, 15, 51, 23], [2, 42, 14, 17, 43, 15], [5, 150, 120, 1, 151, 121], [9, 69, 43, 4, 70, 44], [17, 50, 22, 1, 51, 23], [2, 42, 14, 19, 43, 15], [3, 141, 113, 4, 142, 114], [3, 70, 44, 11, 71, 45], [17, 47, 21, 4, 48, 22], [9, 39, 13, 16, 40, 14], [3, 135, 107, 5, 136, 108], [3, 67, 41, 13, 68, 42], [15, 54, 24, 5, 55, 25], [15, 43, 15, 10, 44, 16], [4, 144, 116, 4, 145, 117], [17, 68, 42], [17, 50, 22, 6, 51, 23], [19, 46, 16, 6, 47, 17], [2, 139, 111, 7, 140, 112], [17, 74, 46], [7, 54, 24, 16, 55, 25], [34, 37, 13], [4, 151, 121, 5, 152, 122], [4, 75, 47, 14, 76, 48], [11, 54, 24, 14, 55, 25], [16, 45, 15, 14, 46, 16], [6, 147, 117, 4, 148, 118], [6, 73, 45, 14, 74, 46], [11, 54, 24, 16, 55, 25], [30, 46, 16, 2, 47, 17], [8, 132, 106, 4, 133, 107], [8, 75, 47, 13, 76, 48], [7, 54, 24, 22, 55, 25], [22, 45, 15, 13, 46, 16], [10, 142, 114, 2, 143, 115], [19, 74, 46, 4, 75, 47], [28, 50, 22, 6, 51, 23], [33, 46, 16, 4, 47, 17], [8, 152, 122, 4, 153, 123], [22, 73, 45, 3, 74, 46], [8, 53, 23, 26, 54, 24], [12, 45, 15, 28, 46, 16], [3, 147, 117, 10, 148, 118], [3, 73, 45, 23, 74, 46], [4, 54, 24, 31, 55, 25], [11, 45, 15, 31, 46, 16], [7, 146, 116, 7, 147, 117], [21, 73, 45, 7, 74, 46], [1, 53, 23, 37, 54, 24], [19, 45, 15, 26, 46, 16], [5, 145, 115, 10, 146, 116], [19, 75, 47, 10, 76, 48], [15, 54, 24, 25, 55, 25], [23, 45, 15, 25, 46, 16], [13, 145, 115, 3, 146, 116], [2, 74, 46, 29, 75, 47], [42, 54, 24, 1, 55, 25], [23, 45, 15, 28, 46, 16], [17, 145, 115], [10, 74, 46, 23, 75, 47], [10, 54, 24, 35, 55, 25], [19, 45, 15, 35, 46, 16], [17, 145, 115, 1, 146, 116], [14, 74, 46, 21, 75, 47], [29, 54, 24, 19, 55, 25], [11, 45, 15, 46, 46, 16], [13, 145, 115, 6, 146, 116], [14, 74, 46, 23, 75, 47], [44, 54, 24, 7, 55, 25], [59, 46, 16, 1, 47, 17], [12, 151, 121, 7, 152, 122], [12, 75, 47, 26, 76, 48], [39, 54, 24, 14, 55, 25], [22, 45, 15, 41, 46, 16], [6, 151, 121, 14, 152, 122], [6, 75, 47, 34, 76, 48], [46, 54, 24, 10, 55, 25], [2, 45, 15, 64, 46, 16], [17, 152, 122, 4, 153, 123], [29, 74, 46, 14, 75, 47], [49, 54, 24, 10, 55, 25], [24, 45, 15, 46, 46, 16], [4, 152, 122, 18, 153, 123], [13, 74, 46, 32, 75, 47], [48, 54, 24, 14, 55, 25], [42, 45, 15, 32, 46, 16], [20, 147, 117, 4, 148, 118], [40, 75, 47, 7, 76, 48], [43, 54, 24, 22, 55, 25], [10, 45, 15, 67, 46, 16], [19, 148, 118, 6, 149, 119], [18, 75, 47, 31, 76, 48], [34, 54, 24, 34, 55, 25], [20, 45, 15, 61, 46, 16]];
|
||||
QRRSBlock.getRSBlocks = function (typeNumber, errorCorrectLevel) {
|
||||
var rsBlock = QRRSBlock.getRsBlockTable(typeNumber, errorCorrectLevel); if (rsBlock == undefined) { throw new Error("bad rs block @ typeNumber:" + typeNumber + "/errorCorrectLevel:" + errorCorrectLevel); }
|
||||
var length = rsBlock.length / 3; var list = []; for (var i = 0; i < length; i++) { var count = rsBlock[i * 3 + 0]; var totalCount = rsBlock[i * 3 + 1]; var dataCount = rsBlock[i * 3 + 2]; for (var j = 0; j < count; j++) { list.push(new QRRSBlock(totalCount, dataCount)); } }
|
||||
return list;
|
||||
};
|
||||
QRRSBlock.getRsBlockTable = function (typeNumber, errorCorrectLevel) { switch (errorCorrectLevel) { case QRErrorCorrectLevel.L: return QRRSBlock.RS_BLOCK_TABLE[(typeNumber - 1) * 4 + 0]; case QRErrorCorrectLevel.M: return QRRSBlock.RS_BLOCK_TABLE[(typeNumber - 1) * 4 + 1]; case QRErrorCorrectLevel.Q: return QRRSBlock.RS_BLOCK_TABLE[(typeNumber - 1) * 4 + 2]; case QRErrorCorrectLevel.H: return QRRSBlock.RS_BLOCK_TABLE[(typeNumber - 1) * 4 + 3]; default: return undefined; } };
|
||||
function QRBitBuffer() { this.buffer = []; this.length = 0; }
|
||||
QRBitBuffer.prototype = {
|
||||
get: function (index) { var bufIndex = Math.floor(index / 8); return ((this.buffer[bufIndex] >>> (7 - index % 8)) & 1) == 1; }, put: function (num, length) { for (var i = 0; i < length; i++) { this.putBit(((num >>> (length - i - 1)) & 1) == 1); } }, getLengthInBits: function () { return this.length; }, putBit: function (bit) {
|
||||
var bufIndex = Math.floor(this.length / 8); if (this.buffer.length <= bufIndex) { this.buffer.push(0); }
|
||||
if (bit) { this.buffer[bufIndex] |= (0x80 >>> (this.length % 8)); }
|
||||
this.length++;
|
||||
}
|
||||
};
|
||||
var QRCodeLimitLength = [[17, 14, 11, 7], [32, 26, 20, 14], [53, 42, 32, 24], [78, 62, 46, 34], [106, 84, 60, 44], [134, 106, 74, 58], [154, 122, 86, 64], [192, 152, 108, 84], [230, 180, 130, 98], [271, 213, 151, 119], [321, 251, 177, 137], [367, 287, 203, 155], [425, 331, 241, 177], [458, 362, 258, 194], [520, 412, 292, 220], [586, 450, 322, 250], [644, 504, 364, 280], [718, 560, 394, 310], [792, 624, 442, 338], [858, 666, 482, 382], [929, 711, 509, 403], [1003, 779, 565, 439], [1091, 857, 611, 461], [1171, 911, 661, 511], [1273, 997, 715, 535], [1367, 1059, 751, 593], [1465, 1125, 805, 625], [1528, 1190, 868, 658], [1628, 1264, 908, 698], [1732, 1370, 982, 742], [1840, 1452, 1030, 790], [1952, 1538, 1112, 842], [2068, 1628, 1168, 898], [2188, 1722, 1228, 958], [2303, 1809, 1283, 983], [2431, 1911, 1351, 1051], [2563, 1989, 1423, 1093], [2699, 2099, 1499, 1139], [2809, 2213, 1579, 1219], [2953, 2331, 1663, 1273]];
|
||||
|
||||
// QRCode object
|
||||
QRCode = function (canvasId, vOption) {
|
||||
this._htOption = {
|
||||
width: 256,
|
||||
height: 256,
|
||||
typeNumber: 4,
|
||||
colorDark: "#000000",
|
||||
colorLight: "#ffffff",
|
||||
correctLevel: QRErrorCorrectLevel.H
|
||||
};
|
||||
|
||||
if (typeof vOption === 'string') {
|
||||
vOption = {
|
||||
text: vOption
|
||||
};
|
||||
}
|
||||
|
||||
// Overwrites options
|
||||
if (vOption) {
|
||||
for (var i in vOption) {
|
||||
this._htOption[i] = vOption[i];
|
||||
}
|
||||
}
|
||||
|
||||
this._oQRCode = null;
|
||||
this.canvasId = canvasId
|
||||
|
||||
if (this._htOption.text && this.canvasId) {
|
||||
this.makeCode(this._htOption.text);
|
||||
}
|
||||
};
|
||||
|
||||
QRCode.prototype.makeCode = function (sText) {
|
||||
this._oQRCode = new QRCodeModel(_getTypeNumber(sText, this._htOption.correctLevel), this._htOption.correctLevel);
|
||||
this._oQRCode.addData(sText);
|
||||
this._oQRCode.make();
|
||||
this.makeImage();
|
||||
};
|
||||
|
||||
QRCode.prototype.makeImage = function () {
|
||||
var _oContext
|
||||
if (this._htOption.usingIn) {
|
||||
_oContext = wx.createCanvasContext(this.canvasId, this._htOption.usingIn)
|
||||
}
|
||||
else {
|
||||
_oContext = wx.createCanvasContext(this.canvasId)
|
||||
}
|
||||
var _htOption = this._htOption;
|
||||
var oQRCode = this._oQRCode
|
||||
|
||||
var nCount = oQRCode.getModuleCount();
|
||||
var nWidth = _htOption.width / nCount;
|
||||
var nHeight = _htOption.height / nCount;
|
||||
var nRoundedWidth = Math.round(nWidth);
|
||||
var nRoundedHeight = Math.round(nHeight);
|
||||
|
||||
if (_htOption.image && _htOption.image != '') {
|
||||
_oContext.drawImage(_htOption.image, 0, 0, _htOption.width, _htOption.height)
|
||||
}
|
||||
|
||||
for (var row = 0; row < nCount; row++) {
|
||||
for (var col = 0; col < nCount; col++) {
|
||||
var bIsDark = oQRCode.isDark(row, col);
|
||||
var nLeft = col * nWidth;
|
||||
var nTop = row * nHeight;
|
||||
_oContext.setStrokeStyle(bIsDark ? _htOption.colorDark : _htOption.colorLight)
|
||||
// _oContext.setStrokeStyle('yellow')
|
||||
_oContext.setLineWidth(1)
|
||||
_oContext.setFillStyle(bIsDark ? _htOption.colorDark : _htOption.colorLight)
|
||||
// _oContext.setFillStyle('red')
|
||||
// if (bIsDark) {
|
||||
_oContext.fillRect(nLeft, nTop, nWidth, nHeight);
|
||||
// }
|
||||
|
||||
// 안티 앨리어싱 방지 처리
|
||||
// if (bIsDark) {
|
||||
_oContext.strokeRect(
|
||||
Math.floor(nLeft) + 0.5,
|
||||
Math.floor(nTop) + 0.5,
|
||||
nRoundedWidth,
|
||||
nRoundedHeight
|
||||
);
|
||||
|
||||
_oContext.strokeRect(
|
||||
Math.ceil(nLeft) - 0.5,
|
||||
Math.ceil(nTop) - 0.5,
|
||||
nRoundedWidth,
|
||||
nRoundedHeight
|
||||
);
|
||||
// }
|
||||
// _oContext.fillRect(
|
||||
// Math.floor(nLeft) + 0.5,
|
||||
// Math.floor(nTop) + 0.5,
|
||||
// nRoundedWidth,
|
||||
// nRoundedHeight
|
||||
// );
|
||||
// _oContext.fillRect(
|
||||
// Math.ceil(nLeft) - 0.5,
|
||||
// Math.ceil(nTop) - 0.5,
|
||||
// nRoundedWidth,
|
||||
// nRoundedHeight
|
||||
// );
|
||||
// _oContext.clearRect(
|
||||
// Math.floor(nLeft) + 0.5,
|
||||
// Math.floor(nTop) + 0.5,
|
||||
// nRoundedWidth,
|
||||
// nRoundedHeight
|
||||
// );
|
||||
// _oContext.clearRect(
|
||||
// Math.ceil(nLeft) - 0.5,
|
||||
// Math.ceil(nTop) - 0.5,
|
||||
// nRoundedWidth,
|
||||
// nRoundedHeight
|
||||
// );
|
||||
}
|
||||
}
|
||||
|
||||
_oContext.draw()
|
||||
};
|
||||
|
||||
// 保存为图片,将临时路径传给回调
|
||||
QRCode.prototype.exportImage = function (callback) {
|
||||
if (!callback) {
|
||||
return
|
||||
}
|
||||
wx.canvasToTempFilePath({
|
||||
x: 0,
|
||||
y: 0,
|
||||
width: this._htOption.width,
|
||||
height: this._htOption.height,
|
||||
destWidth: this._htOption.width,
|
||||
destHeight: this._htOption.height,
|
||||
canvasId: this.canvasId,
|
||||
success: function (res) {
|
||||
// console.log(res.tempFilePath)
|
||||
callback(res.tempFilePath)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
QRCode.CorrectLevel = QRErrorCorrectLevel;
|
||||
})();
|
||||
|
||||
module.exports = QRCode
|
|
@ -0,0 +1,36 @@
|
|||
<template>
|
||||
<view>
|
||||
<view v-if="showTop" style="position: fixed;right: 20rpx;bottom: 120rpx;">
|
||||
<image class="animated pulse infinite" style="width: 60rpx;height: 50rpx;" @tap="backTop" src="../static/img/public/backTop.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:"backTop",
|
||||
props:{
|
||||
showTop:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
};
|
||||
},
|
||||
onPageScroll(e) {
|
||||
// console.log(e);
|
||||
},
|
||||
methods:{
|
||||
backTop(){
|
||||
this.$emit('backTop')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
|
@ -0,0 +1,205 @@
|
|||
<template>
|
||||
<view>
|
||||
<view class="bacb disba padding20 posi-bzy" style="border-top: 1rpx solid #eeeeee;">
|
||||
<view class="disba" style="width: 24%;">
|
||||
<view @tap="goHome" class="discc margin-z20">
|
||||
<image class="bottosimg" src="/static/img/public/home.png" mode=""></image>
|
||||
<view class="fon24 bottoc">首页</view>
|
||||
</view>
|
||||
<view @tap="goKef" class="discc posir">
|
||||
<image class="bottokimg" src="/static/img/public/xkef.png" mode=""></image>
|
||||
<view class="fon24 bottoc">客服</view>
|
||||
<button v-if="showKf" class="fon24 bottoc posia" style="opacity: 0;" open-type="contact" bindcontact="huik">客服</button>
|
||||
</view>
|
||||
</view>
|
||||
<view class="disac">
|
||||
<view @tap="diaoq" class="margin-y20 textc bottoj">加入购物车</view>
|
||||
<view @tap="diaoq" class="textc bottol">立即购买</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 底部弹框 -->
|
||||
<view @touchmove.stop.prevent="moveHandle" v-if="isBtn" class="posiall zIn5" style="background-color: rgba(0,0,0,.6);">
|
||||
<view class="posi-bzy padding20" style="border-top-left-radius: 30rpx;border-top-right-radius: 30rpx;background-color: #FFFFFF;z-index: 6;">
|
||||
<view class="margin-s20 dis">
|
||||
<image class="flexs" style="width: 201rpx;height: 201rpx;border-radius: 10rpx;" :src="srcImg"></image>
|
||||
<view class="margin-z20 width100">
|
||||
<view class="colorf6 fon24 bold">¥<text class="fon28">{{detail.sku_list[sku_index].cur_price/100}}</text>.0</view>
|
||||
<view class="fon28 color33">{{detail.name}}</view>
|
||||
</view>
|
||||
<view @tap="isBtn=false" style="flex-shrink: 0; width: 38rpx;height: 38rpx;border-radius: 100%;background-color: rgba(0,0,0,.15);position: relative;display: flex;justify-content: center;align-items: center;top: -10rpx;">
|
||||
<view style="width: 2rpx;height: 20rpx;background-color: #666666;position: absolute;transform: rotate(45deg);"></view>
|
||||
<view style="width: 2rpx;height: 20rpx;background-color: #666666;position: absolute;transform: rotate(-45deg);"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bold color33 margin-s30" style="font-size: 30rpx;">规格选择</view>
|
||||
<view class="disac flw">
|
||||
<view @tap="chooseguig(item.id,indexg)"
|
||||
:class="guigCurrent==indexg?'guigactive':'guigmo'"
|
||||
class="fon24 margin-s20 margin-y10 padding-sx10 padding-zy30"
|
||||
v-for="(item,indexg) in guigArr" :key="indexg"
|
||||
style="background-color: #f3f3f3;border-radius: 30rpx;min-width: 60rpx;text-align: center;max-width: 100%;"><view class="clips1">{{item.title}}</view></view>
|
||||
</view>
|
||||
<view class="borbot margin-x20 margin-s30"></view>
|
||||
<view class="disba">
|
||||
<view class="width100">数量</view>
|
||||
<view class="disac" style="justify-content:flex-end;">
|
||||
<!-- 递减 -->
|
||||
<view @tap="delEvent(0)" class="disbcac padding-sx30">
|
||||
<image class="margin-y20" style="width: 18rpx;height: 4rpx;" src="../static/img/product/del.png"></image>
|
||||
</view>
|
||||
<!-- 数量框 -->
|
||||
<input type="text" disabled v-model="num" style="width: 40%;background-color: #F5F5F5;text-align: center;padding: 4rpx 0;border-radius: 4rpx;"/>
|
||||
<!-- 递增 -->
|
||||
<view @tap="addEvent(1)" class="disbcac padding-sx30">
|
||||
<image class="margin-zy20" style="width: 18rpx;height: 18rpx;" src="../static/img/product/add.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="disbcac padding-sx40">
|
||||
<view @tap="addGowc" class="bold padding-sx20 padding-zy40 colorf78 margin-y10" style="font-size: 30rpx;border: 1rpx solid #FF7800;border-radius: 60rpx;width: 30%;text-align: center;">加入购物车</view>
|
||||
<view @tap="buy" class="bold padding-sx20 padding-zy40 colorb margin-z20" style="font-size: 30rpx;background-color: #ff7800;border-radius: 60rpx;width: 30%;text-align: center;">立即购买</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props:{
|
||||
detail:{
|
||||
type:Object,
|
||||
default:function(){
|
||||
return {}
|
||||
}
|
||||
},
|
||||
sku_img:{
|
||||
type:String,
|
||||
default:''
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
guigArr:[],
|
||||
guigCurrent:0,
|
||||
num:1,
|
||||
isBtn:false,
|
||||
sku_index:0,
|
||||
sku_id:'',
|
||||
srcImg:'',
|
||||
orderList:[],
|
||||
showKf:true
|
||||
};
|
||||
},
|
||||
watch:{
|
||||
sku_img:function(newImg,oldImg){
|
||||
this.srcImg = newImg
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
if(uni.getStorageSync('is_active')==0) {
|
||||
this.showKf = false
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
huik(){
|
||||
// console.log('萨拉丁开发');
|
||||
},
|
||||
goHome(){uni.switchTab({url:'/pages/tabbar/homePage/homePage'})},
|
||||
goKef(){
|
||||
if(uni.getStorageSync('is_active')==0) {
|
||||
this.$toolAll.tools.showToast('您目前是游客,请授权登录')
|
||||
setTimeout(()=>{
|
||||
uni.navigateTo({url:'/pages/login/login'})
|
||||
},1500)
|
||||
}
|
||||
},
|
||||
diaoq(){
|
||||
if(uni.getStorageSync('is_active')==0) {
|
||||
this.$toolAll.tools.showToast('您目前是游客,请授权登录')
|
||||
setTimeout(()=>{
|
||||
uni.navigateTo({url:'/pages/login/login'})
|
||||
},1500)
|
||||
} else {
|
||||
this.$emit('diaoq');
|
||||
this.isBtn = true
|
||||
this.guigArr = []
|
||||
this.orderList = []
|
||||
this.detail.sku_list.forEach(item=>{
|
||||
this.guigArr.push(item)
|
||||
if(item.is_main==1){
|
||||
let buyObj = {
|
||||
sku_coding:item.coding,
|
||||
num:this.num
|
||||
}
|
||||
this.orderList.push(buyObj)
|
||||
// console.log(this.orderList);
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
addGowc(){//添加购物车事件
|
||||
this.isBtn = false
|
||||
if(this.sku_id==''){
|
||||
this.sku_id = this.guigArr[0].id
|
||||
}
|
||||
this.$requst.post('order/shopping-cart-add',{sku_id:this.sku_id,num:this.num}).then(res=>{
|
||||
// console.log(res);
|
||||
if(res.code==0){
|
||||
this.num = 1
|
||||
this.sku_id = ''
|
||||
this.$toolAll.tools.showToast('加入购物车成功(*^▽^*)')
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
buy(){//立即购买事件
|
||||
this.isBtn = false
|
||||
let storageAddress = uni.getStorageSync('storageAddress')
|
||||
let buyParma = {
|
||||
sku_list: this.orderList,
|
||||
address_id: storageAddress || ''
|
||||
}
|
||||
console.log('参数',buyParma);
|
||||
this.$requst.post('order/prepare-info',buyParma).then(res=>{
|
||||
// console.log(res);
|
||||
if(res.code==0){
|
||||
uni.setStorageSync('orderInfo',res.data)
|
||||
uni.navigateTo({
|
||||
url:'/pagesA/confirmOrder/confirmOrder'
|
||||
})
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
chooseguig(id,index){
|
||||
this.orderList = []//清空coding、num参数
|
||||
this.guigCurrent = index
|
||||
let ob = this.guigArr.findIndex((item)=>item.id==id)
|
||||
this.sku_index = ob
|
||||
this.srcImg = this.$http + this.guigArr[ob].main_image
|
||||
this.sku_id = id
|
||||
let chooseBuyObj = {
|
||||
sku_coding:this.detail.sku_list[this.sku_index].coding,
|
||||
num:this.num
|
||||
}
|
||||
this.orderList.push(chooseBuyObj)
|
||||
},
|
||||
delEvent(){
|
||||
// this.num==1 ? this.num=1 : this.num--
|
||||
this.num==1 ? this.num=1 : this.num--
|
||||
this.orderList[0].num = this.num
|
||||
},
|
||||
addEvent(){
|
||||
// this.num==10 ? this.num=10 : this.num++
|
||||
this.num++
|
||||
this.orderList[0].num = this.num
|
||||
},
|
||||
moveHandle(){
|
||||
return
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
|
@ -0,0 +1,107 @@
|
|||
.lotus-address-picker {
|
||||
font-size: 26rpx;
|
||||
padding-top: 30rpx;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
line-height: normal;
|
||||
padding-right: 30rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.lotus-address-picker-box {
|
||||
/*display: -webkit-box;
|
||||
display: -webkit-flex;*/
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
justify-content: flex-start;
|
||||
padding-top: 10rpx;
|
||||
padding-bottom: 10rpx;
|
||||
}
|
||||
.lotus-address-picker-box-item {
|
||||
height: 600upx;
|
||||
overflow-y: auto;
|
||||
width: 33.333%;
|
||||
padding-left: 20rpx;
|
||||
padding-right: 20rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.lotus-address-picker2 {
|
||||
color: #e93b3d;
|
||||
position: relative;
|
||||
}
|
||||
.lotus-address-picker2:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 65%;
|
||||
transform: translateY(-35%) rotate(-45deg);
|
||||
width: 20rpx;
|
||||
height: 10rpx;
|
||||
border-left-width: 4rpx;
|
||||
border-bottom-width: 4rpx;
|
||||
border-left-style: solid;
|
||||
border-bottom-style: solid;
|
||||
border-left-color: #e93b3d;
|
||||
border-bottom-color: #e93b3d;
|
||||
}
|
||||
.lotus-address-mask {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 999;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
.lotus-address-box {
|
||||
background: #fff;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
.lotus-address-action {
|
||||
font-size: 30rpx;
|
||||
/*display: -webkit-box;
|
||||
display: -webkit-flex;*/
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
justify-content: space-between;
|
||||
padding: 25rpx 30rpx;
|
||||
position: relative;
|
||||
}
|
||||
.lotus-address-action:after {
|
||||
content: " ";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
height: 1px;
|
||||
border-top: 1px solid #eee;
|
||||
color: #eee;
|
||||
transform-origin: 0 0;
|
||||
transform: scaleY(0.5);
|
||||
}
|
||||
.lotus-address-action:before {
|
||||
content: " ";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
height: 1px;
|
||||
border-bottom: 1px solid #eee;
|
||||
color: #eee;
|
||||
transform-origin: 0 100%;
|
||||
transform: scaleY(0.5);
|
||||
}
|
||||
.lotus-address-action-cancel {
|
||||
color: #969696;
|
||||
}
|
||||
.lotus-address-action-affirm {
|
||||
color: #e93b3d;
|
||||
}
|
|
@ -0,0 +1,233 @@
|
|||
<template>
|
||||
<!--地址picker-->
|
||||
<view :status="checkStatus" v-if="lotusAddressData.visible" class="lotus-address-mask">
|
||||
<view :class="lotusAddressData.visible?'lotus-address-box':'lotus-address-box lotus-address-box-out'">
|
||||
<view class="lotus-address-action">
|
||||
<text @tap="cancelPicker" class="lotus-address-action-cancel">取消</text>
|
||||
<text @tap="chosedVal" class="lotus-address-action-affirm">确认</text>
|
||||
</view>
|
||||
<view class="lotus-address-picker-box">
|
||||
<!--省-->
|
||||
<scroll-view scroll-y :scroll-into-view="'pid'+pChoseIndex" class="lotus-address-picker-box-item">
|
||||
<view @tap="clickPicker(0,pIndex,pItem);" :id="'pid'+pIndex" :class="pIndex === pChoseIndex?'lotus-address-picker lotus-address-picker2':'lotus-address-picker'" v-for="(pItem,pIndex) in province" :key="pIndex">{{pItem}}</view>
|
||||
</scroll-view>
|
||||
<!--市-->
|
||||
<scroll-view scroll-y :scroll-into-view="'cid'+cChoseIndex" class="lotus-address-picker-box-item">
|
||||
<view @tap="clickPicker(1,cIndex,cItem);" :id="'cid'+cIndex" :class="cIndex === cChoseIndex?'lotus-address-picker lotus-address-picker2':'lotus-address-picker'" v-for="(cItem,cIndex) in city" :key="cIndex">{{cItem}}</view>
|
||||
</scroll-view>
|
||||
<!--区-->
|
||||
<scroll-view scroll-y :scroll-into-view="'tid'+tChoseIndex" class="lotus-address-picker-box-item">
|
||||
<view @tap="clickPicker(2,tIndex,tItem);" :id="'tid'+tIndex" :class="tIndex === tChoseIndex?'lotus-address-picker lotus-address-picker2':'lotus-address-picker'" v-for="(tItem,tIndex) in town" :key="tIndex">{{tItem}}</view>
|
||||
</scroll-view>
|
||||
<!--区END-->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!--地址picker END-->
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {lotusAddressJson} from "./city.js";
|
||||
export default {
|
||||
props:['lotusAddressData'],
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
province:[],
|
||||
city:[],
|
||||
town:[],
|
||||
provinceName:'',
|
||||
cityName:'',
|
||||
townName:'',
|
||||
type:0,//0新增1编辑
|
||||
pChoseIndex:-1,
|
||||
cChoseIndex:-1,
|
||||
tChoseIndex:-1
|
||||
};
|
||||
},
|
||||
methods:{
|
||||
//取消
|
||||
cancelPicker(){
|
||||
const provinceCode = this.getTarId(this.provinceName);
|
||||
const cityCode = this.getTarId(this.cityName);
|
||||
const townCode = this.getTarId(this.townName);
|
||||
this.visible = false;
|
||||
this.$emit("choseVal",{
|
||||
province:this.provinceName,
|
||||
provinceCode,
|
||||
city:this.cityName,
|
||||
cityCode,
|
||||
town:this.townName,
|
||||
townCode,
|
||||
isChose:0,
|
||||
visible:false
|
||||
});
|
||||
},
|
||||
//获取最后选择的省市区的值
|
||||
chosedVal() {
|
||||
this.type = 1;
|
||||
const provinceCode = this.getTarId(this.provinceName);
|
||||
const cityCode = this.getTarId(this.cityName);
|
||||
const townCode = this.getTarId(this.townName);
|
||||
this.visible = false;
|
||||
let isChose = 0;
|
||||
//已选省市区 isChose = 1
|
||||
if((this.provinceName&&this.cityName)||(this.provinceName&&this.cityName&&this.townName)){
|
||||
isChose = 1;
|
||||
}
|
||||
this.$emit("choseVal",{
|
||||
province:this.provinceName,
|
||||
provinceCode,
|
||||
city:this.cityName,
|
||||
cityCode,
|
||||
town:this.townName,
|
||||
townCode,
|
||||
isChose,
|
||||
visible:false
|
||||
});
|
||||
},
|
||||
//获取省市区value
|
||||
getTarId(name,type){
|
||||
let id = 0;
|
||||
lotusAddressJson.map((item,index)=>{
|
||||
if(item.name === name){
|
||||
id = item.value;
|
||||
}
|
||||
});
|
||||
return id;
|
||||
},
|
||||
//获取市数据
|
||||
getCityArr(parentId){
|
||||
let city = [];
|
||||
lotusAddressJson.map((item,index)=>{
|
||||
if(item.parent === parentId){
|
||||
city.push(item.name);
|
||||
}
|
||||
});
|
||||
return city;
|
||||
},
|
||||
//获取区数据
|
||||
getTownArr(parentId){
|
||||
let town = [];
|
||||
lotusAddressJson.map((item,index)=>{
|
||||
if(index>34&&item.parent === parentId){
|
||||
town.push(item.name);
|
||||
}
|
||||
});
|
||||
return town;
|
||||
},
|
||||
//初始化数据
|
||||
initFn(){
|
||||
if(!this.province.length){
|
||||
lotusAddressJson.map((item,index)=>{
|
||||
if(index<=34){
|
||||
this.province.push(item.name);
|
||||
}
|
||||
});
|
||||
}
|
||||
//已选择省市区,高亮显示对应选择省市区
|
||||
const p = this._props.lotusAddressData.provinceName;
|
||||
const c = this._props.lotusAddressData.cityName;
|
||||
const t = this._props.lotusAddressData.townName;
|
||||
//已选省
|
||||
if(p){
|
||||
this.pChoseIndex = this.getTarIndex(this.province,p);
|
||||
}
|
||||
//已选市
|
||||
if(p&&c){
|
||||
const pid = this.getTarId(p);
|
||||
this.city = this.getCityArr(pid);
|
||||
this.cChoseIndex = this.getTarIndex(this.city,c);
|
||||
}
|
||||
//已选区
|
||||
if(p&&c&&t){
|
||||
const cid= this.getTarId(c);
|
||||
this.town = this.getTownArr(cid);
|
||||
this.tChoseIndex = this.getTarIndex(this.town,t);
|
||||
}
|
||||
//未选省市区
|
||||
if(!p&&!c&&!t){
|
||||
this.pChoseIndex = -1;
|
||||
this.cChoseIndex = -1;
|
||||
this.tChoseIndex = -1;
|
||||
this.city = [];
|
||||
this.town = [];
|
||||
}
|
||||
},
|
||||
//获取已选省市区
|
||||
getChosedData(){
|
||||
const pid = this.getTarId(this.provinceName,'province');
|
||||
this.city = this.getCityArr(pid);
|
||||
const cid= this.getTarId(this.cityName,'city');
|
||||
this.town = this.getTownArr(cid);
|
||||
//已选省市区获取对应index
|
||||
if(this.provinceName){
|
||||
this.pChoseIndex = this.getTarIndex(this.province,this.provinceName);
|
||||
}
|
||||
if(this.cityName){
|
||||
this.cChoseIndex = this.getTarIndex(this.city,this.cityName);
|
||||
}
|
||||
if(this.townName){
|
||||
this.tChoseIndex = this.getTarIndex(this.town,this.townName);
|
||||
}
|
||||
},
|
||||
//选择省市区交互
|
||||
clickPicker(type,index,name){
|
||||
//省
|
||||
if(type === 0){
|
||||
this.pChoseIndex = index;
|
||||
this.provinceName = name;
|
||||
this.cChoseIndex = -1;
|
||||
this.tChoseIndex = -1;
|
||||
this.cityName = '';
|
||||
this.townName = '';
|
||||
}
|
||||
//市
|
||||
if(type ===1){
|
||||
this.cChoseIndex = index;
|
||||
this.cityName = name;
|
||||
this.tChoseIndex = -1;
|
||||
this.townName = '';
|
||||
}
|
||||
//区
|
||||
if(type === 2){
|
||||
this.tChoseIndex = index;
|
||||
this.townName = name;
|
||||
}
|
||||
//获取省市区数据
|
||||
this.getChosedData();
|
||||
},
|
||||
//获取已选省市区index
|
||||
getTarIndex(arr,tarName){
|
||||
let cIndex = 0;
|
||||
arr.map((item,index)=>{
|
||||
if(item === tarName){
|
||||
cIndex = index;
|
||||
}
|
||||
});
|
||||
return cIndex;
|
||||
}
|
||||
},
|
||||
computed:{
|
||||
checkStatus(){
|
||||
let t = null;
|
||||
const _this = this;
|
||||
if(!_this.visible){
|
||||
_this.visible = _this._props.lotusAddressData.visible;
|
||||
//获取省市区
|
||||
_this.provinceName = _this._props.lotusAddressData.provinceName;
|
||||
_this.cityName = _this._props.lotusAddressData.cityName;
|
||||
_this.townName = _this._props.lotusAddressData.townName;
|
||||
//生成初始化数据
|
||||
_this.initFn();
|
||||
t = _this.visible;
|
||||
}
|
||||
return t;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
@import "./city.css";
|
||||
</style>
|
|
@ -0,0 +1,89 @@
|
|||
<template>
|
||||
<view>
|
||||
<!-- 展示所有数据 -->
|
||||
<view v-if="evalArr.length!=0" class="borbot padding20 bacb" v-for="(item,index) in evalArr" :key="index">
|
||||
<view class="disac">
|
||||
<image style="width: 70rpx; height: 70rpx;border-radius: 100%;" :src="item.src" mode=""></image>
|
||||
<view class="margin-z20">
|
||||
<view class="fon28">{{item.name}}</view>
|
||||
<rate :size="24" :gutter="10" :value="item.xingj" :readonly="true"></rate>
|
||||
<!-- <view>
|
||||
<image style="width: 162rpx;height: 23rpx;" :src="item.xingj" mode=""></image>
|
||||
</view> -->
|
||||
</view>
|
||||
</view>
|
||||
<view :class="isShow ? '':'clips2'" class="fon28 margin-s10 " style="color: #686868;">{{item.content}}</view>
|
||||
<view v-if="isEval">
|
||||
<scroll-view scroll-x="true">
|
||||
<view class="disac margin-sx10">
|
||||
<block v-for="(itemimg,indeximg) in item.imgList" :key="indeximg">
|
||||
<image @tap="previewImg(indeximg,item.imgList)" class="margin-y20 flexs radius10" style="width: 200rpx;height: 200rpx;" :src="itemimg.src" mode=""></image>
|
||||
</block>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<view class="fon26 disac margin-s10" style="color: #949494;">
|
||||
<view class="clips1">{{item.title}}</view>
|
||||
<view class="margin-z20 flexs">{{item.time}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="evalArr.length==0 && isShow==true" class="zanwu">暂无更多该商品评论信息</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import rate from '@/components/rate.vue';
|
||||
export default {
|
||||
components:{
|
||||
rate
|
||||
},
|
||||
props:{
|
||||
evalArr:{
|
||||
type:Array,
|
||||
default:function(){
|
||||
return []
|
||||
}
|
||||
},
|
||||
isEval:{//是否显示评论图片
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
isShow:{
|
||||
type:Boolean,
|
||||
default:true
|
||||
},
|
||||
len:{
|
||||
type:Number,
|
||||
default:0
|
||||
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
rateNum:5
|
||||
};
|
||||
},
|
||||
methods:{
|
||||
// 预览图片多张
|
||||
previewImg(index,arr) {
|
||||
let _this = this;
|
||||
let imgsArray = [];
|
||||
for (let i = 0; i < arr.length; i++) {
|
||||
if (arr[i].src!= '') {
|
||||
imgsArray.push(arr[i].src);
|
||||
}
|
||||
}
|
||||
uni.previewImage({
|
||||
current: index,
|
||||
urls: imgsArray,
|
||||
indicator: 'number',
|
||||
loop: true
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
|
@ -0,0 +1,58 @@
|
|||
<template>
|
||||
<view>
|
||||
<view style="height: 56px;font-size: 10px;border-top: 1rpx solid #FFFFFF;background-color: #FFFFFF;
|
||||
position: fixed;bottom: 0;left: 0;right: 0;display: flex;justify-content: space-around;align-items: center;">
|
||||
<view @tap="choosefoot(index)" v-for="(item,index) in tabArr" :key="index" style="display: flex;justify-content: center;flex-direction: column;align-items: center;">
|
||||
<image v-if="current==index" :src="item.selectedIconPath" style="width: 22px;height: 22px;"></image>
|
||||
<image v-else :src="item.iconPath" style="width: 22px;height: 22px;"></image>
|
||||
<view :class="current==index?'footactive':'footmo'" style="margin-top: 4px;">{{item.text}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name:'footTab',
|
||||
data() {
|
||||
return {
|
||||
tabArr:[
|
||||
{
|
||||
'pagePath': 'pages/tabbar/homePage/homePage',
|
||||
'iconPath': '../static/img/tabbar/pagem.png',
|
||||
'selectedIconPath': '../static/img/tabbar/pageh.png',
|
||||
'text': '首页'
|
||||
},
|
||||
{
|
||||
'pagePath': 'pages/tabbar/product/product',
|
||||
'iconPath': '../static/img/tabbar/productm.png',
|
||||
'selectedIconPath': '../static/img/tabbar/product.png',
|
||||
'text': '产品'
|
||||
},
|
||||
{
|
||||
'pagePath': 'pages/tabbar/shoppingCart/shoppingCart',
|
||||
'iconPath': '../static/img/tabbar/chem.png',
|
||||
'selectedIconPath': '../static/img/tabbar/chem.png',
|
||||
'text': '购物车'
|
||||
},
|
||||
{
|
||||
'pagePath': 'pages/tabbar/my/my',
|
||||
'iconPath': '../static/img/tabbar/mym.png',
|
||||
'selectedIconPath': '../static/img/tabbar/my.png',
|
||||
'text': '我的'
|
||||
},
|
||||
],
|
||||
current:0
|
||||
};
|
||||
},
|
||||
methods:{
|
||||
choosefoot(index){
|
||||
this.current = index
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.footactive{color: #214995;}
|
||||
.footmo{color: #aaaeb7;}
|
||||
</style>
|
|
@ -0,0 +1,101 @@
|
|||
<template>
|
||||
<view>
|
||||
<view class="switch_box row-b-c"
|
||||
:style="{backgroundColor: checked? bg :'',width: width+'rpx',height: height+'rpx',borderRadius: 20.5+ 'px'}"
|
||||
@tap="changeSwitch">
|
||||
<view class="switch_text c-white" :class="checked?['to_left']:['_right','c-black']"
|
||||
:style="{fontSize: size + 'rpx'}">{{checked?checked_text:check_text}}
|
||||
</view>
|
||||
<view class="round switch-qiu" :style="{left: checked?'100%':0,marginLeft:checked?'-'+34+'rpx':'',width:30+'rpx',
|
||||
height: 30+'rpx',borderRadius:30+'rpx'}">
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
bg: {
|
||||
type: String,
|
||||
default: '#ff7800'
|
||||
},
|
||||
checked: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
width: {
|
||||
type: String,
|
||||
default: '90'
|
||||
},
|
||||
height: {
|
||||
type: String,
|
||||
default: '40'
|
||||
},
|
||||
check_text: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
checked_text: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
size: {
|
||||
type: String,
|
||||
default: '20'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
changeSwitch: function(e) {
|
||||
this.$emit('change', {
|
||||
checked: this.checked
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.row-c-c {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.c-white {
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.c-black {
|
||||
color: #666666;
|
||||
}
|
||||
.switch_box {
|
||||
position: relative;
|
||||
border: 1rpx solid #EEEEEE;
|
||||
background-color: #F5F5F5;
|
||||
transition: all 0.4s;
|
||||
}
|
||||
.round {
|
||||
position: absolute;
|
||||
background-color: #FFFFFF;
|
||||
transition: all 0.4s;
|
||||
}
|
||||
.to_left {
|
||||
left: 0;
|
||||
margin-left: 0;
|
||||
}
|
||||
.to_right {
|
||||
left: 100%;
|
||||
margin-left: -50rpx;
|
||||
}
|
||||
.switch_text {
|
||||
position: absolute;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
._right {
|
||||
right: 0;
|
||||
}
|
||||
</style>
|
|
@ -0,0 +1,61 @@
|
|||
<template>
|
||||
<text :style="{ color: color, 'font-size': size + 'rpx' }" :class="{isTheme:isTheme}" class="lw-icons"
|
||||
@click="_onClick">{{icons[icon]}}</text>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import icons from './icons.js';
|
||||
// #ifdef APP-NVUE
|
||||
var domModule = weex.requireModule('dom');
|
||||
domModule.addRule('fontFace', {
|
||||
'fontFamily': 'iconfont',
|
||||
'src': 'url(\'https://at.alicdn.com/t/font_2294175_vq7ymlkpbtm.ttf\')',
|
||||
});
|
||||
// #endif
|
||||
export default {
|
||||
name: 'UniIcons',
|
||||
props: {
|
||||
icon: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
color: {
|
||||
type: String,
|
||||
default: '#333333'
|
||||
},
|
||||
size: {
|
||||
type: [Number, String],
|
||||
default: 50
|
||||
},
|
||||
isTheme: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
icons: icons
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
_onClick() {
|
||||
this.$emit('click')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
/* #ifndef APP-NVUE */
|
||||
@font-face {
|
||||
font-family: iconfont;
|
||||
src: url('https://at.alicdn.com/t/font_2294175_vq7ymlkpbtm.ttf')
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
.lw-icons {
|
||||
font-family: iconfont;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
|
@ -0,0 +1,6 @@
|
|||
export default {
|
||||
'aixin':'\ue8ab',
|
||||
'rules':'\ue909',
|
||||
'sound':'\ue8ea',
|
||||
'arrowright':'\uee02'
|
||||
}
|
|
@ -0,0 +1,373 @@
|
|||
<template>
|
||||
<view>
|
||||
<view class="contentBox" v-if="list.length" @click="toEmit()"
|
||||
:style="'color:' + color + ';background-color:' + backgroundColor + ';height:' + height+'rpx;'">
|
||||
<view v-if="showIcon" class="supBox">
|
||||
<lwIcon :size="32" :color="iconColor" icon="sound"></lwIcon>
|
||||
</view>
|
||||
<view v-if="list.length > 1" class="content">
|
||||
<view v-for="(item, index) in list" :key="index" @tap.stop="dangGao(index)">
|
||||
<view class="loopItemBase" :class="index==0&&firstIn?'fistInClass':''"
|
||||
:animation="realAnimation(index)" v-if="aindexArr.includes(index)"
|
||||
:style="'line-height:'+height+'rpx;'">
|
||||
{{ item }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="list.length == 1" class="content">
|
||||
<view :style="'line-height:'+height+'rpx;'" @tap.stop="dangGao(0)" class="loopItemBaseShow">{{ list[0] }}</view>
|
||||
</view>
|
||||
<view v-if="showMore" class="offBox">
|
||||
<lwIcon :size="32" :color="moreColor" icon="arrowright"></lwIcon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/*
|
||||
lw-notice公告上下轮询组件(组件内依赖了自有的字体图标组件,可自行替换为uni或自身项目的图标组件)
|
||||
color:字体颜色
|
||||
backgroundColor:背景色
|
||||
list:要循环的列表数据
|
||||
height:组件高度
|
||||
showScale:是否有缩放动画
|
||||
runTime:间隔切换时间
|
||||
showIcon:是否显示头部小喇叭
|
||||
iconColor:小喇叭的颜色
|
||||
showMore:是否显示尾部更多
|
||||
moreColor:显示更多的颜色
|
||||
*/
|
||||
import lwIcon from './iconFont.vue'
|
||||
export default {
|
||||
components: {
|
||||
lwIcon
|
||||
},
|
||||
props: {
|
||||
color: {
|
||||
type: String,
|
||||
default: '#666666'
|
||||
},
|
||||
backgroundColor: {
|
||||
type: String,
|
||||
default: '#f5f5f5'
|
||||
},
|
||||
list: {
|
||||
type: Array,
|
||||
default: function(){
|
||||
return []
|
||||
}
|
||||
},
|
||||
height: {
|
||||
type: Number,
|
||||
default: 80
|
||||
},
|
||||
showScale: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
runTime: {
|
||||
type: Number,
|
||||
default: 4000
|
||||
},
|
||||
showIcon: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
showMore: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
iconColor: {
|
||||
type: String,
|
||||
default: '#aaaaaa'
|
||||
},
|
||||
moreColor: {
|
||||
type: String,
|
||||
default: '#aaaaaa'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 第一次展示
|
||||
firstIn: true,
|
||||
// 当前显示的项
|
||||
aindexArr: [],
|
||||
// 创建动画的实例
|
||||
animation: null,
|
||||
// 动画对象一
|
||||
animationData: null,
|
||||
// 动画对象二
|
||||
animationDataTwo: null,
|
||||
// 显示项和动画之间的映射关系
|
||||
indexLinkAnimationObj: {},
|
||||
setTimerOne: null,
|
||||
setTimerTwo: null,
|
||||
setTimerThree: null,
|
||||
setTimerFour: null,
|
||||
setTimerFive: null
|
||||
};
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.resetPage()
|
||||
},
|
||||
computed: {
|
||||
// 计算展示项应该展示的动画
|
||||
realAnimation() {
|
||||
return function(value) {
|
||||
if (this.indexLinkAnimationObj[value]) {
|
||||
return this[this.indexLinkAnimationObj[value]]
|
||||
} else {
|
||||
return {}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 开始 按3000毫秒的运行示例图
|
||||
// 1.a显示 执行动画1 锁定动画1 0ms
|
||||
// 2.b显示 执行动画2 锁定动画2 200ms
|
||||
// 3.a隐藏 停止动画1 释放动画1 300ms
|
||||
// 4.c显示 执行动画1 锁定动画1 400ms
|
||||
// 5.b隐藏 停止动画2 释放动画2 500ms
|
||||
// 6.a显示 执行动画2 锁定动画2 600ms
|
||||
// 7.c隐藏 停止动画1 释放动画1 700ms
|
||||
// 8.b显示 执行动画1 锁定动画1 800ms
|
||||
// 9.a隐藏 停止动画2 释放动画2 900ms
|
||||
// 10.c显示 执行动画2 锁定动画2 1000ms
|
||||
initPage() {
|
||||
this.resetPage();
|
||||
if (this.list && this.list.length) {
|
||||
if (this.list.length > 1) {
|
||||
this.aindexArr.push(0);
|
||||
this.animation = uni.createAnimation({
|
||||
timingFunction: 'linear',
|
||||
})
|
||||
// #ifdef H5
|
||||
this.animationDataH5 = this.animation.translateY(-100).step({
|
||||
duration: 10000
|
||||
}).export()
|
||||
// #endif
|
||||
this.runAnimation(0, true);
|
||||
}
|
||||
}
|
||||
},
|
||||
// 重置页面动画
|
||||
resetPage() {
|
||||
// 移除所有定时器
|
||||
clearTimeout(this.setTimerOne);
|
||||
clearTimeout(this.setTimerTwo);
|
||||
clearTimeout(this.setTimerThree);
|
||||
clearTimeout(this.setTimerFour);
|
||||
clearTimeout(this.setTimerFive);
|
||||
// 重置页面属性
|
||||
this.aindexArr = [];
|
||||
this.animation = null;
|
||||
this.animationData = null;
|
||||
this.animationDataTwo = null;
|
||||
this.indexLinkAnimationObj = {};
|
||||
},
|
||||
// 执行动画方法(此方法内不要清除赋值的定时器)
|
||||
runAnimation(value, firstIn) {
|
||||
let that = this;
|
||||
if (!firstIn) {
|
||||
that.aindexArr.push(value);
|
||||
}
|
||||
// 获取执行动画对象
|
||||
let lockText = that.createAni(firstIn);
|
||||
// 延迟50毫秒执行(等待dom渲染)
|
||||
that.setTimerOne = setTimeout(() => {
|
||||
// 创建执行动画和执行方之间的映射关系
|
||||
that.indexLinkAnimationObj[value] = lockText;
|
||||
// console.log('已经创建完成绑定关系')
|
||||
// console.log(that.indexLinkAnimationObj)
|
||||
// 获取基础执行时间单位
|
||||
let unitRunTime = (that.runTime - 50) / 6;
|
||||
let waitTime = firstIn ? unitRunTime * 4 : unitRunTime * 5;
|
||||
let waitTimeTwo = firstIn ? (that.runTime - unitRunTime) : that.runTime;
|
||||
// #ifdef H5
|
||||
waitTimeTwo = firstIn ? (that.runTime - (1.5 * unitRunTime)) : that.runTime;
|
||||
//H5重新刷新一下动画绑定关系
|
||||
if (firstIn) {
|
||||
that.aindexArr.splice(0, 1);
|
||||
that.aindexArr.push(0);
|
||||
}
|
||||
// #endif
|
||||
|
||||
// 开启下一个动画
|
||||
that.setTimerTwo = setTimeout(() => {
|
||||
let Index = value == that.list.length - 1 ? 0 : value + 1;
|
||||
that.runAnimation(Index)
|
||||
}, waitTime)
|
||||
// 释放上一个执行方
|
||||
that.setTimerThree = setTimeout(() => {
|
||||
let index = that.aindexArr.indexOf(value);
|
||||
that.aindexArr.splice(index, 1)
|
||||
that.firstIn = false;
|
||||
delete that.indexLinkAnimationObj[value]
|
||||
}, waitTimeTwo)
|
||||
}, 50)
|
||||
},
|
||||
// 创建动画方法
|
||||
createAni(firstIn) {
|
||||
let that = this;
|
||||
let unitRunTime = (that.runTime - 50) / 6;
|
||||
|
||||
let delayTime = unitRunTime * 4;
|
||||
let durationTime = unitRunTime;
|
||||
let dispairTime = unitRunTime;
|
||||
// #ifdef H5
|
||||
delayTime = unitRunTime * 3.5;
|
||||
dispairTime = unitRunTime * 1.5;
|
||||
// #endif
|
||||
|
||||
let showTransformHeight = -uni.upx2px(that.height);
|
||||
let hideTransformHeight = showTransformHeight * 2;
|
||||
// 创建动画
|
||||
if (that.showScale) {
|
||||
if (firstIn) {
|
||||
// that.animation.translateY(1).scale(1,1).step({ duration: 5 });
|
||||
that.animation.translateY(showTransformHeight).scale(0.5, 0.5).step({
|
||||
delay: delayTime,
|
||||
duration: dispairTime
|
||||
});
|
||||
} else {
|
||||
that.animation.translateY(showTransformHeight).scale(1, 1).step({
|
||||
duration: durationTime
|
||||
});
|
||||
that.animation.translateY(hideTransformHeight).scale(0.5, 0.5).step({
|
||||
delay: delayTime,
|
||||
duration: dispairTime
|
||||
});
|
||||
}
|
||||
} else {
|
||||
if (firstIn) {
|
||||
// that.animation.translateY(1).step({ duration: 5 });
|
||||
that.animation.translateY(showTransformHeight).step({
|
||||
delay: delayTime,
|
||||
duration: dispairTime
|
||||
});
|
||||
} else {
|
||||
that.animation.translateY(showTransformHeight).step({
|
||||
duration: durationTime
|
||||
});
|
||||
that.animation.translateY(hideTransformHeight).step({
|
||||
delay: delayTime,
|
||||
duration: dispairTime
|
||||
});
|
||||
}
|
||||
}
|
||||
// 判断动画赋值项并赋值
|
||||
if (!that.animationData) {
|
||||
that.animationData = that.animation.export()
|
||||
that.setTimerFour = setTimeout(() => {
|
||||
clearTimeout(that.setTimerFour)
|
||||
that.animationData = false;
|
||||
}, that.runTime)
|
||||
return 'animationData'
|
||||
} else {
|
||||
that.animationDataTwo = that.animation.export()
|
||||
that.setTimerFive = setTimeout(() => {
|
||||
clearTimeout(that.setTimerFive)
|
||||
that.animationDataTwo = false;
|
||||
}, that.runTime)
|
||||
return 'animationDataTwo'
|
||||
}
|
||||
},
|
||||
// 抛出点击事件
|
||||
toEmit() {
|
||||
let that = this
|
||||
if (that.list.length == 1) {
|
||||
that.$emit('itemClick', that.list[0])
|
||||
} else {
|
||||
that.$emit('itemClick', that.list[that.aindexArr[0]])
|
||||
}
|
||||
},
|
||||
dangGao(index){
|
||||
let that = this
|
||||
if (that.list.length != 0) {
|
||||
that.$emit('dangGao', index)
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
mounted() {
|
||||
// 判断list有值后开启动画
|
||||
// setTimeout()
|
||||
this.initPage()
|
||||
},
|
||||
watch: {
|
||||
list(value) {
|
||||
this.initPage()
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.contentBox {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
// padding: 0 20rpx;
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
font-size: 24rpx;
|
||||
.supBox {
|
||||
width: 50rpx;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.offBox {
|
||||
width: 50rpx;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.content {
|
||||
width: 100%;
|
||||
flex-grow: 1;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
justify-content: center;
|
||||
|
||||
.loopItemBase {
|
||||
left: 0;
|
||||
top: 100%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
font-size: 28rpx;
|
||||
text-align: left;
|
||||
position: absolute;
|
||||
white-space: nowrap;
|
||||
align-items: center;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
&.fistInClass {
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.loopItemBaseShow {
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
font-size: 28rpx;
|
||||
text-align: left;
|
||||
position: absolute;
|
||||
white-space: nowrap;
|
||||
align-items: center;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -0,0 +1,454 @@
|
|||
<!-- mosowe-canvas-image -->
|
||||
<template>
|
||||
<view class='mosowe-canvas-image'>
|
||||
<view class="slot-view" @click="createCanvas">
|
||||
<slot></slot>
|
||||
</view>
|
||||
<view class="canvas-wrap-box">
|
||||
<!-- 主面板绘制 -->
|
||||
<canvas class="canvas-wrap" canvas-id="canvas" :style="'width: '+ width +'px; height: '+ height +'px;'"></canvas>
|
||||
<!-- 这个是用来绘制圆形图片的 -->
|
||||
<canvas class="canvas-wrap" canvas-id="canvas-arc" :style="'width: '+ canvasArcWidth +'px; height: '+ canvasArcHeight +'px;'"></canvas>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import QR from './wxqrcode.js';
|
||||
export default {
|
||||
name: 'mosowe-canvas-image',
|
||||
components: {},
|
||||
props: {
|
||||
imgType: { // 图片类型
|
||||
type: String,
|
||||
default: 'jpg',
|
||||
validator: () => {
|
||||
return ['jpg', 'png'];
|
||||
}
|
||||
},
|
||||
compress: { // 是否开启压缩
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
compressSize: { // 压缩界限,超过界限压缩,默认2M
|
||||
type: [Number, String],
|
||||
default: 1024*1024*2
|
||||
},
|
||||
showPreview: { // 生成图像后是否预览
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
height: { // canvas高度
|
||||
type: [String, Number],
|
||||
default: 200
|
||||
},
|
||||
width: { // canvas宽度
|
||||
type: [String, Number],
|
||||
default: 200
|
||||
},
|
||||
lists: {
|
||||
type: Array,
|
||||
default: () => {
|
||||
return [];
|
||||
}
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
canvas: null,
|
||||
listsIndex: 0,
|
||||
listsLength: 0,
|
||||
canvasArc: null,
|
||||
canvasArcWidth: 100,
|
||||
canvasArcHeight: 100,
|
||||
compressQuality: 20,
|
||||
compressQualityH5: 5,
|
||||
};
|
||||
},
|
||||
watch: {},
|
||||
// 组件实例化之前
|
||||
beforeCreate () {},
|
||||
// 组件创建完成
|
||||
created () {
|
||||
this.canvas = uni.createCanvasContext('canvas', this);
|
||||
this.canvasArc = uni.createCanvasContext('canvas-arc', this);
|
||||
},
|
||||
// 组件挂载之前
|
||||
beforeMount () {},
|
||||
// 组件挂载之后
|
||||
mounted () {},
|
||||
// 组件数据更新时
|
||||
beforeUpdate () {},
|
||||
// 组价更新
|
||||
updated () {},
|
||||
// 组件销毁前
|
||||
beforeDestroy () {},
|
||||
// 组件销毁后
|
||||
destroyed () {},
|
||||
// 页面方法
|
||||
methods: {
|
||||
// 开始绘制
|
||||
createCanvas () {
|
||||
this.clearCanvas();
|
||||
if (this.lists.length === 0) {
|
||||
uni.showToast({
|
||||
title: 'lists不能为空',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
this.listsIndex = 0;
|
||||
this.listsLength = this.lists.length - 1;
|
||||
uni.showToast({
|
||||
title:'正在生成图片...',
|
||||
icon:'loading'
|
||||
})
|
||||
this.dataDrawCanvas();
|
||||
},
|
||||
// 数据绘制
|
||||
dataDrawCanvas () {
|
||||
let item = this.lists[this.listsIndex];
|
||||
if (item.type === 'image') { // 图片
|
||||
if (item.content.indexOf('https://') > -1) { // https://网络图片
|
||||
// #ifndef H5
|
||||
// 非H5
|
||||
this.downloadImageNotH5(item);
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
// H5
|
||||
this.downloadImageH5(item);
|
||||
// #endif
|
||||
} else { // 本地选择图片
|
||||
if (this.compress && item.hasOwnProperty('file') && item.file.size > this.compressSize) { // 大于限制2M压缩
|
||||
this.compressImage(item);
|
||||
} else {
|
||||
if (item.arc) {
|
||||
this.drawImageArc(item);
|
||||
} else {
|
||||
this.drawImage(item);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
} else if (item.type === 'text') { // 文本
|
||||
this.drawText(item);
|
||||
} else if (item.type === 'rect') { // 矩形(线条)
|
||||
this.drawRect(item);
|
||||
} else if (item.type === 'arc') { // 圆形
|
||||
this.drawArc(item);
|
||||
} else if (item.type === 'qr') { // 二维码
|
||||
this.drawQR(item);
|
||||
}
|
||||
},
|
||||
// #ifndef H5
|
||||
// https图片下载本地并绘制,非H5
|
||||
downloadImageNotH5 (item) {
|
||||
uni.downloadFile({
|
||||
url: item.content,
|
||||
header: {
|
||||
'Access-Control-Allow-Origin': '*',
|
||||
},
|
||||
success: (res) => {
|
||||
item.content = res.tempFilePath;
|
||||
if (item.arc) {
|
||||
this.drawImageArc(item);
|
||||
} else {
|
||||
this.drawImage(item);
|
||||
}
|
||||
},
|
||||
fail: (res) => {
|
||||
// console.log(res);
|
||||
}
|
||||
});
|
||||
},
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
// https图片下载本地并绘制,H5
|
||||
downloadImageH5 (item) {
|
||||
let image = null;
|
||||
image = new Image();
|
||||
image.setAttribute('crossOrigin', 'anonymous');
|
||||
image.crossOrigin = 'Anonymous';
|
||||
image.src = item.content;
|
||||
image.onload = () => {
|
||||
let canvas = document.createElement('canvas');
|
||||
canvas.width = item.width;
|
||||
canvas.height = item.height;
|
||||
let ctx = canvas.getContext('2d');
|
||||
ctx.drawImage(
|
||||
image,
|
||||
0,
|
||||
0,
|
||||
item.width,
|
||||
item.height
|
||||
);
|
||||
let dataURL = canvas.toDataURL('image/png');
|
||||
if (item.arc) { // 绘制圆形
|
||||
item.content = dataURL;
|
||||
this.drawImageArc(item);
|
||||
} else {
|
||||
this.canvas.globalAlpha = item.hasOwnProperty('globalAlpha') ? item.globalAlpha : 1;
|
||||
this.canvas.drawImage(
|
||||
dataURL,
|
||||
item.x,
|
||||
item.y,
|
||||
item.hasOwnProperty('width') ? item.width : this.width,
|
||||
item.hasOwnProperty('height') ? item.height : this.height
|
||||
);
|
||||
|
||||
this.checkDrawOver();
|
||||
}
|
||||
|
||||
};
|
||||
},
|
||||
// #endif
|
||||
// 图片压缩
|
||||
compressImage (item) {
|
||||
// uni.showLoading({
|
||||
// title: '压缩中...',
|
||||
// mask: true
|
||||
// });
|
||||
uni.showToast({
|
||||
title: '压缩中...',
|
||||
icon:'loading'
|
||||
})
|
||||
// 非H5压缩
|
||||
// #ifndef H5
|
||||
uni.compressImage({
|
||||
src: item.content,
|
||||
quality: this.compressQuality,
|
||||
success: (res) => {
|
||||
// uni.showLoading({
|
||||
// title: '正在生成图片...',
|
||||
// mask: true
|
||||
// });
|
||||
uni.showToast({
|
||||
title: '正在生成图片...',
|
||||
icon:'loading'
|
||||
})
|
||||
item.content = res.tempFilePath;
|
||||
if (item.arc) {
|
||||
this.drawImageArc(item);
|
||||
} else {
|
||||
this.drawImage(item);
|
||||
}
|
||||
},
|
||||
fail: (res) => {
|
||||
// console.log(res);
|
||||
uni.showToast({
|
||||
title: '压缩失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
// H5压缩
|
||||
// #ifdef H5
|
||||
let image = new Image();
|
||||
image.setAttribute('crossOrigin', 'anonymous');
|
||||
image.crossOrigin = 'Anonymous';
|
||||
image.src = item.content;
|
||||
image.onload = () => {
|
||||
let canvas = document.createElement('canvas');
|
||||
canvas.width = item.width;
|
||||
canvas.height = item.height;
|
||||
let ctx = canvas.getContext('2d');
|
||||
ctx.drawImage(
|
||||
image,
|
||||
0,
|
||||
0,
|
||||
item.width,
|
||||
item.height
|
||||
);
|
||||
let dataURL = canvas.toDataURL('image/png');
|
||||
item.content = dataURL;
|
||||
if (item.arc) {
|
||||
this.drawImageArc(item);
|
||||
} else {
|
||||
this.drawImage(item);
|
||||
}
|
||||
};
|
||||
// #endif
|
||||
},
|
||||
// 圆形图片另外绘制canvas,png格式
|
||||
drawImageArc (item) {
|
||||
this.canvasArc.clearRect(0, 0, this.canvasArcWidth, this.canvasArcHeight);
|
||||
this.canvasArcWidth = item.arcR * 2;
|
||||
this.canvasArcHeight = item.arcR * 2;
|
||||
this.canvasArc.save();
|
||||
let arcT = setTimeout(() => {
|
||||
clearTimeout(arcT);
|
||||
this.canvasArc.arc(item.arcR, item.arcR, item.arcR, 0, 2 * Math.PI);
|
||||
this.canvasArc.clip();
|
||||
// this.canvasArc.closePath();
|
||||
|
||||
this.canvasArc.drawImage(
|
||||
item.content,
|
||||
item.arcX,
|
||||
item.arcY,
|
||||
item.width,
|
||||
item.height
|
||||
);
|
||||
this.canvasArc.draw(false, setTimeout(() => {
|
||||
let t = setTimeout(() => {
|
||||
clearTimeout(t);
|
||||
uni.canvasToTempFilePath({
|
||||
x: 0,
|
||||
y: 0,
|
||||
width: item.arcR * 2,
|
||||
height: item.arcR * 2,
|
||||
fileType: 'png',
|
||||
canvasId: 'canvas-arc',
|
||||
success: (res) => {
|
||||
item.width = item.arcR * 2;
|
||||
item.height = item.arcR * 2;
|
||||
item.content = res.tempFilePath;
|
||||
this.drawImage(item);
|
||||
},
|
||||
fail: (res) => {
|
||||
// console.log(res);
|
||||
},
|
||||
complete: () => {
|
||||
this.canvasArc.restore();
|
||||
this.canvasArc.fillRect(0, 0, 0, 0);
|
||||
this.canvasArc.clearRect(0, 0, this.canvasArcWidth, this.canvasArcHeight);
|
||||
}
|
||||
}, this);
|
||||
}, 100);
|
||||
}));
|
||||
}, 100);
|
||||
},
|
||||
// 图片绘制
|
||||
drawImage (item) {
|
||||
this.canvas.globalAlpha = item.hasOwnProperty('globalAlpha') ? item.globalAlpha : 1;
|
||||
this.canvas.drawImage(
|
||||
item.content,
|
||||
item.x,
|
||||
item.y,
|
||||
item.hasOwnProperty('width') ? item.width : this.width,
|
||||
item.hasOwnProperty('height') ? item.height : this.height
|
||||
);
|
||||
this.checkDrawOver();
|
||||
},
|
||||
// 文本绘制
|
||||
drawText (item) {
|
||||
this.canvas.setFillStyle(item.hasOwnProperty('color') ? item.color : '#000000');
|
||||
this.canvas.setFontSize(item.hasOwnProperty('size')? item.size : 20);
|
||||
this.canvas.setTextAlign(item.hasOwnProperty('align') ? item.align: 'left');
|
||||
this.canvas.globalAlpha = item.hasOwnProperty('globalAlpha') ? item.globalAlpha : 1;
|
||||
|
||||
if (item.maxWidth) {
|
||||
this.canvas.fillText(item.content, item.x, item.y, item.maxWidth);
|
||||
} else {
|
||||
this.canvas.fillText(item.content, item.x, item.y);
|
||||
}
|
||||
this.checkDrawOver();
|
||||
},
|
||||
|
||||
// 矩形(线条)绘制
|
||||
drawRect (item) {
|
||||
this.canvas.setFillStyle(item.hasOwnProperty('color') ? item.color : '#000000');
|
||||
this.canvas.globalAlpha = item.hasOwnProperty('globalAlpha') ? item.globalAlpha : 1;
|
||||
this.canvas.fillRect(item.x, item.y, item.width, item.height);
|
||||
this.checkDrawOver();
|
||||
},
|
||||
|
||||
// 圆形绘制
|
||||
drawArc (item) {
|
||||
this.canvas.arc(item.arcX, item.arcY, item.arcR, 0, 2 * Math.PI);
|
||||
this.canvas.setFillStyle(item.hasOwnProperty('color') ? item.color : '#000000');
|
||||
this.canvas.globalAlpha = item.hasOwnProperty('globalAlpha') ? item.globalAlpha : 1;
|
||||
this.canvas.fill();
|
||||
this.canvas.closePath();
|
||||
this.checkDrawOver();
|
||||
},
|
||||
|
||||
// 二维码绘制
|
||||
drawQR (item) {
|
||||
item['qr'] = QR.createQrCodeImg(item.content, {
|
||||
size: parseInt(300)
|
||||
});
|
||||
this.canvas.globalAlpha = item.hasOwnProperty('globalAlpha') ? item.globalAlpha : 1;
|
||||
this.canvas.drawImage(
|
||||
item.qr,
|
||||
item.x,
|
||||
item.y,
|
||||
item.hasOwnProperty('width') ? item.width : this.width,
|
||||
item.hasOwnProperty('height') ? item.height : this.height
|
||||
);
|
||||
this.checkDrawOver();
|
||||
},
|
||||
|
||||
|
||||
// 判断是否绘制完
|
||||
checkDrawOver () {
|
||||
if (this.listsIndex < this.listsLength) { // lists未画完
|
||||
this.listsIndex++;
|
||||
this.dataDrawCanvas();
|
||||
} else {
|
||||
this.canvasImage();
|
||||
}
|
||||
},
|
||||
|
||||
// 绘制到画布并生成图片
|
||||
canvasImage () {
|
||||
this.listsIndex = 0;
|
||||
this.canvas.draw(false, setTimeout(() => {
|
||||
setTimeout(() => {
|
||||
uni.canvasToTempFilePath({
|
||||
x: 0,
|
||||
y: 0,
|
||||
width: Number(this.width),
|
||||
height: Number(this.height),
|
||||
fileType: this.imgType,
|
||||
canvasId: 'canvas',
|
||||
success: (res) => {
|
||||
this.$emit('canvasImage', res.tempFilePath);
|
||||
if (this.showPreview) {
|
||||
this.showPreviewFn(res.tempFilePath);
|
||||
}
|
||||
},
|
||||
fail: (res) => {
|
||||
// console.log(res);
|
||||
},
|
||||
complete: () => {
|
||||
// uni.hideLoading();
|
||||
}
|
||||
}, this);
|
||||
}, 500);
|
||||
}));
|
||||
},
|
||||
// 预览图
|
||||
showPreviewFn (img) {
|
||||
uni.previewImage({
|
||||
current: 0,
|
||||
urls: [img]
|
||||
});
|
||||
},
|
||||
// 清空画布
|
||||
clearCanvas () {
|
||||
this.canvas.clearRect(0, 0, this.width, this.height);
|
||||
},
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang='scss' scoped>
|
||||
.mosowe-canvas-image{
|
||||
overflow: hidden;
|
||||
.canvas-wrap-box{
|
||||
overflow: hidden;
|
||||
height: 0;
|
||||
width: 0;
|
||||
position: fixed;
|
||||
left:200%;
|
||||
top: 0;
|
||||
}
|
||||
.canvas-wrap {
|
||||
overflow: hidden;
|
||||
height: 0;
|
||||
width: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -0,0 +1,195 @@
|
|||
## mosowe-canvas-image:一个可以制作多用途图片的插件(海报,二维码,分享图)
|
||||
|
||||
### v1.2.0:
|
||||
1. 添加透明度`globalAlpha`,值0-1;
|
||||
2. 修改只能画一个圆形图片问题,画圆形图片时耗时较多,因为额外增加了一个canvas处理圆形图片,请注意`arcX`与`arcY`的说明;
|
||||
|
||||
### v1.1.0:
|
||||
|
||||
1. 添加本地图片渲染,已支持本地相册/相机 + https的网络图片,建议画布宽高:750*1330
|
||||
2. 添加导出图片的类型:`imgType`,可选值,jpg、png
|
||||
3. 添加本地图片压缩功能:`compress`是否开启压缩,`compressSize`:压缩程度,默认2M,lists列表图片项需增加传参`file`,
|
||||
4. 解决H5网络图片“canvasToTempFilePath:fail SecurityError: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported”错误问题,图片服务器需支持“Access-Control-Allow-Origin: *”
|
||||
5. 使用非solt插槽触发事件时,请确认`$ref`是否正确
|
||||
6. 示例增加参数编辑,使用前体验插件
|
||||
|
||||
#### 平台支持:
|
||||
|
||||
| APP | H5 | 微信小程序 | 支付宝小程序 | 百度小程序 | 字节跳动小程序 | QQ小程序 |
|
||||
| :--: | :--: | :--------: | :----------: | :--------: | :------------: | :------: |
|
||||
| √ | √ | √ | × | 未测 | 未测 | 未测 |
|
||||
|
||||
#### 插件功能
|
||||
|
||||
1. 支持多图片绘制,多文本绘制,圆形图片绘制;
|
||||
2. 支持矩形(线条)绘制;
|
||||
3. 支持圆形绘制;
|
||||
4. 支持二维码生成,项目用不上可以去插件内去除,毕竟这个插件携带的比较大,单纯用来生成二维码图片也是阔以的;
|
||||
5. 支持绘图后预览。
|
||||
|
||||
多用于海报图,分享图;
|
||||
|
||||
注意H5跨域问题及小程序白名单配置;
|
||||
|
||||
图片是网络图片:https://....(require及import引入不了3Kb以上的绝对路径图片,若有大神知道处理方法,望不吝赐教,谢谢!)
|
||||
|
||||
#### 属性
|
||||
|
||||
| 名称 | 类型 | 默认值 | 说明 | 版本 |
|
||||
| ------------ | ---------------- | ------------ | -------------------------------------------------------- | ----- |
|
||||
| width | Number \String | 200 | canvas画布宽度,也是导出图片宽度,单位px,值中不要带单位 | 1.0.0 |
|
||||
| height | Number \String | 200 | canvas画布高度,也是导出图片高度,单位px,值中不要带单位 | 1.0.0 |
|
||||
| showPreview | Boolean | false | 绘制完成后是否打开预览 | 1.0.0 |
|
||||
| lists | Array | [] | 绘制的元素列表:图片,文字,矩形(线条),圆形,二维码 | 1.0.0 |
|
||||
| imgType | String | jpg | 生成图片格式,可选:png | 1.1.0 |
|
||||
| compress | Boolean | false | 是否开启图片压缩 | 1.1.0 |
|
||||
| compressSize | Number\String | 2097152 (2M) | 超过多少M压缩 | 1.1.0 |
|
||||
|
||||
|
||||
|
||||
|
||||
#### lists\<item>属性
|
||||
|
||||
注意:图文先后顺序,底层的图片靠前,最上层的在最后,圆形图片放在最后,因为一旦绘制圆形,后续的元素都只在该圆形内显示,而超过圆形范围的将看不见。
|
||||
|
||||
| 名称 | 类型 | 必填 | 说明 |版本|
|
||||
| :------- | :----- | :--- | :----------------------------------------------------------- |:----|
|
||||
| type | String | 是 | 元素类型:`image`图片,`text`文本,`rect`矩形(线条),`arc`圆形,`qr`二维码 |1.0.0|
|
||||
| content | String | 否 | image:图片路径(必填),text:文字(必填),qr:转二维码的数据(必填),rect及arc:非必填 |1.0.0|
|
||||
| x | Number | 是 | X轴坐标,绘制圆形图片时:x = arcX - arcR |1.0.0|
|
||||
| y | Number | 是 | Y轴坐标,绘制圆形图片时:y = arcY - arcR |1.0.0|
|
||||
| width | Number | 否 | 图片、矩形(线条)、二维码宽度 |1.0.0|
|
||||
| height | Number | 否 | 图片、矩形(线条)、二维码高度 |1.0.0|
|
||||
| arc | Boolen | 否 | type=image时:是否绘制圆形图片 |1.0.0|
|
||||
| arcX | Number | 否 | type=arc时:绘制圆形时中心点X轴坐标,type=image时,图片在圆形canvas的X坐标,多为负数,版本`1.2.0` |1.2.0|
|
||||
| arcY | Number | 否 | type=arc时:绘制圆形时中心点Y轴坐标,type=image时,图片在圆形canvas的Y坐标,多为负数,版本`1.2.0` |1.2.0|
|
||||
| arcR | Number | 否 | type=image、arc时:绘制圆形的半径 |1.0.0|
|
||||
| color | String | 否 | 绘制文本、矩形(线条)的颜色,默认:#000000 |1.0.0|
|
||||
| size | Number | 否 | 绘制文本的字号大小,默认:20 |1.0.0|
|
||||
| align | String | 否 | 绘制文本的对齐方式,默认:left |1.0.0|
|
||||
| maxWidth | Number | 否 | 绘制文本的最大宽度,文字长度超过该值会被压缩 |1.0.0|
|
||||
| file | file | 否 | 选择本地图片的file文件,版本`1.1.0` |1.1.0|
|
||||
| globalAlpha | Number | 否 | 透明度:0~1,默认1,版本`1.2.0` |1.2.0|
|
||||
|
||||
#### slots
|
||||
|
||||
| 名称 | 说明 |
|
||||
| :------ | :--------------------------------- |
|
||||
| default | 自定义插槽,点击此区会触发绘图事件 |
|
||||
|
||||
#### 事件
|
||||
|
||||
| 名称 | 回调参数 | 说明 |
|
||||
| ----------- | -------- | ------------------------------------ |
|
||||
| canvasImage | url | 绘制成功后返回的本地地址,H5为base64 |
|
||||
|
||||
|
||||
|
||||
#### 使用方式
|
||||
|
||||
若`page.json`中配置了`"easycom": true`,则无需`script`引入就可以使用,没有则需要引入。
|
||||
|
||||
1. 无slot:组件标签添加`ref`属性,采用父级调用子组件`createCanvas()`方法使用,见后文示例;
|
||||
2. 有slot:slot区点击就会执行
|
||||
|
||||
#### 示例
|
||||
|
||||
```javascript
|
||||
// js
|
||||
data () {
|
||||
return {
|
||||
canvasUrl: '',
|
||||
lists: [
|
||||
{
|
||||
type: 'image',
|
||||
content: 'https://www.zhonglixunqing.cn/images/uniapp/1.jpg',
|
||||
width: 200,
|
||||
height: 100,
|
||||
x: 50,
|
||||
y: 20,
|
||||
},
|
||||
{
|
||||
type: 'image',
|
||||
content: 'https://www.zhonglixunqing.cn/images/uniapp/2.jpg',
|
||||
width: 80,
|
||||
height: 80,
|
||||
x: 20,
|
||||
y: 200,
|
||||
arc: false,
|
||||
arcX: 0,
|
||||
arcY: 0,
|
||||
arcR: 0
|
||||
},
|
||||
{
|
||||
type: 'text',
|
||||
content: '扫一扫,获取更多信息',
|
||||
x: 120,
|
||||
y: 250,
|
||||
color: '#ff0000',
|
||||
size: 10,
|
||||
// maxWidth: 100,
|
||||
// align: 'left',
|
||||
},
|
||||
{
|
||||
type: 'rect',
|
||||
width: 1,
|
||||
height: 100,
|
||||
x: 0,
|
||||
y: 10,
|
||||
color: '#ff0000',
|
||||
},
|
||||
{
|
||||
type: 'image',
|
||||
content: 'https://www.zhonglixunqing.cn/images/uniapp/3.jpg',
|
||||
width: 100,
|
||||
height: 100,
|
||||
x: 200,
|
||||
y: 200,
|
||||
arc: true,
|
||||
arcX: 250,
|
||||
arcY: 250,
|
||||
arcR: 50
|
||||
},
|
||||
]
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
beginCanvas () {
|
||||
this.$refs.mosoweCanvasComponents.createCanvas();
|
||||
},
|
||||
_canvasImage (e) {
|
||||
this.canvasUrl = e;
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
插件外独立按钮触发:
|
||||
|
||||
```html
|
||||
<button type="default" @click="beginCanvas">开始绘图</button>
|
||||
<image :src="canvasUrl" mode="widthFix"></image>
|
||||
<mosowe-canvas-image
|
||||
ref="mosoweCanvasComponents"
|
||||
@canvasImage="_canvasImage"
|
||||
:lists="lists"
|
||||
height="300"
|
||||
width="300"
|
||||
showPreview />
|
||||
```
|
||||
|
||||
slot插槽触发:
|
||||
|
||||
```html
|
||||
<mosowe-canvas-image
|
||||
:lists="lists"
|
||||
height="300"
|
||||
width="300"
|
||||
showPreview >
|
||||
<view class="in_btn">
|
||||
slot按钮的
|
||||
</view>
|
||||
</mosowe-canvas-image>
|
||||
```
|
||||
|
||||
#### 预览地址
|
||||
|
|
@ -0,0 +1,142 @@
|
|||
<template>
|
||||
<view class="htz-rate-main">
|
||||
<template v-for="(item,index) in count">
|
||||
<image @tap="checkItem((index+1))" class="htz-rate-image" :key="index"
|
||||
:style="{'width':size+'rpx','height':size+'rpx','padding-right':gutter+'rpx'}"
|
||||
:src="checkedVal<(index+1)?defImgSrc:selImgSrc"></image>
|
||||
</template>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'htz-rate',
|
||||
props: {
|
||||
value: { //受控分值
|
||||
type: Number,
|
||||
default: 0,
|
||||
},
|
||||
count: { //数量
|
||||
type: Number,
|
||||
default: 5,
|
||||
},
|
||||
size: { //图标大小
|
||||
type: Number,
|
||||
default: 42,
|
||||
},
|
||||
gutter: { //图标间距
|
||||
type: Number,
|
||||
default: 15,
|
||||
},
|
||||
type: { //内置类型
|
||||
type: Number,
|
||||
default: 0,
|
||||
},
|
||||
disHref: { //自定义默认图片
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
checkedHref: { //自定义选中图片
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
readonly: { //是否只读
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
ImgData: ['/static/img/rate/rate1_0.png', '/static/img/rate/rate2_0.png',
|
||||
'/static/img/rate/rate3_0.png', '/static/img/rate/rate4_0.png', '/static/img/rate/rate5_0.png',
|
||||
'/static/img/rate/rate6_0.png'
|
||||
],
|
||||
defImgSrc: '',
|
||||
selImgSrc: '',
|
||||
checkedVal: 0,
|
||||
}
|
||||
},
|
||||
mounted: function() {
|
||||
this.$nextTick(function() {
|
||||
this.checkedVal = this.value;
|
||||
if (this.disHref != '') {
|
||||
this.defImgSrc = this.disHref;
|
||||
this.selImgSrc = this.checkedHref;
|
||||
} else {
|
||||
//if (this.type != undefined) {
|
||||
this.defImgSrc = this.ImgData[this.type];
|
||||
this.selImgSrc = this.ImgData[this.type].replace('_0', '_1');
|
||||
//}
|
||||
}
|
||||
});
|
||||
},
|
||||
watch: {
|
||||
value(val, oldVal) {
|
||||
this.checkedVal = this.value;
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
checkItem(index) {
|
||||
if (!this.readonly) {
|
||||
this.checkedVal = index;
|
||||
this.$emit('input', index);
|
||||
this.$emit('change', index);
|
||||
}
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.htz-rate-main {
|
||||
display: inline-flex;
|
||||
}
|
||||
|
||||
.htz-rate-image {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
|
||||
.htz-image-upload-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.htz-image-upload-Item {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
margin: 13rpx;
|
||||
border-radius: 10rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.htz-image-upload-Item image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.htz-image-upload-Item-add {
|
||||
font-size: 105rpx;
|
||||
/* line-height: 160rpx; */
|
||||
text-align: center;
|
||||
border: 1px dashed #d9d9d9;
|
||||
color: #d9d9d9;
|
||||
}
|
||||
|
||||
.htz-image-upload-Item-del {
|
||||
background-color: #f5222d;
|
||||
font-size: 24rpx;
|
||||
position: absolute;
|
||||
width: 35rpx;
|
||||
height: 35rpx;
|
||||
line-height: 35rpx;
|
||||
text-align: center;
|
||||
top: 0;
|
||||
right: 0;
|
||||
z-index: 100;
|
||||
color: #fff;
|
||||
}
|
||||
</style>
|
|
@ -0,0 +1,42 @@
|
|||
<template>
|
||||
<view>
|
||||
<view v-if="showShare" @tap="closeShare" style="position: fixed;top: 0;right: 0;left: 0;bottom: 0;background-color: rgba(0,0,0,.5);z-index: 10;">
|
||||
</view>
|
||||
<view v-if="showShare" style="display: flex;flex-direction: column;justify-content: space-around;
|
||||
position: fixed;bottom: 0;left: 0;right: 0;z-index: 100; background-color: #FFFFFF;padding: 40rpx;">
|
||||
<view class="posir" v-for="(item,index) in cateArr" :key="index" style="display: flex;justify-content: center;align-items: center;flex-direction: column;width: 25%;">
|
||||
<image style="width: 100rpx;height: 100rpx;margin-bottom: 10rpx;" :src="item.src" mode=""></image>
|
||||
<view class="fon28 color33">{{item.title}}</view>
|
||||
<button data-name="shareBtn" open-type="share" plain="true" class="posia" style="top: 0;left: 0;right: 0;bottom: 0;opacity: 0;">分享</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:'shareAll',
|
||||
props:{
|
||||
showShare:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
cateArr:[
|
||||
{src:'/static/img/share/weix.png',title:'微信好友'},
|
||||
]
|
||||
};
|
||||
},
|
||||
methods:{
|
||||
closeShare(){
|
||||
this.$emit('closeShare')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
|
@ -0,0 +1,110 @@
|
|||
<template>
|
||||
<view class="posi-tzy zIn5 statusHNH" style="background: url(https://s3.jpg.cm/2021/07/22/I6PtxL.png) fixed top;background-size: 100%;">
|
||||
<view :style="{height:statusBarHeight+'px'}"></view>
|
||||
<view class="padding-z20 disac width100 navBarH" :style="{background:backgroudColor}">
|
||||
<!-- 返回键 -->
|
||||
<view @tap="backEvent">
|
||||
<image v-if="statusBackg" class="tab-back margin-y10" src="/static/img/public/back.png"></image>
|
||||
<image v-if="statusBackw" class="tab-back margin-y10" src="/static/img/public/white.png"></image>
|
||||
</view>
|
||||
<!-- 标题 -->
|
||||
<view v-if="statusTitle" :class="iscenter?'titlec':'width60 clips1'" class="tab-title " :style="{color:tabcolor}">
|
||||
{{titleVal}}
|
||||
<image v-if="statusTitleImg" class="margin-z10" src="/static/img/gouwc/map.png" style="width: 35rpx;height: 38rpx;margin-bottom: -5rpx;"></image>
|
||||
</view>
|
||||
<!-- 输入框 -->
|
||||
<view v-if="statusInput" class="searchpradius disac tab-input-box">
|
||||
<image src="/static/img/pageh/sousuo.png"></image>
|
||||
<input @confirm="confirm" type="text" class="width100 colorh" v-model="serchVal" placeholder="搜索的内容" placeholder-style="color:#c6c6c6;"/>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props:{
|
||||
statusTitle:{//是否显示标题
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
statusTitleImg:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
statusBackg:{//是否显示灰色返回键
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
statusBackw:{//是否显示白色返回键
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
statusInput:{//是否显示搜索输入框
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
backgroudColor:{//标题栏背景颜色
|
||||
type:String,
|
||||
default:''
|
||||
},
|
||||
tabcolor:{//标题颜色
|
||||
type:String,
|
||||
default:'#000000'
|
||||
},
|
||||
titleVal:{//标题内容
|
||||
type:String,
|
||||
default:'登锐商城'
|
||||
},
|
||||
iscenter:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
whereCome:{
|
||||
type:Number,
|
||||
default:0
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// 缓存tabber栏的高度
|
||||
const query = wx.createSelectorQuery().in(this)
|
||||
query.select('.statusHNH').boundingClientRect((rect) => {
|
||||
// console.log('rect.height',rect)
|
||||
uni.setStorageSync('statusHNH',rect.height)
|
||||
}).exec()
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
serchVal:'',
|
||||
statusBarHeight:uni.getSystemInfoSync().statusBarHeight,
|
||||
};
|
||||
},
|
||||
methods:{
|
||||
backEvent(){
|
||||
// console.log(uni.getStorageInfoSync('token'));
|
||||
if(uni.getStorageInfoSync('token')){
|
||||
uni.reLaunch({
|
||||
url:'/pages/login/login.vue'
|
||||
})
|
||||
}
|
||||
if(this.whereCome==2){
|
||||
uni.switchTab({url:'/pages/tabbar/homePage/homePage'})
|
||||
return
|
||||
}
|
||||
if(this.whereCome==1){
|
||||
uni.switchTab({url:'/pages/tabbar/my/my'})
|
||||
return
|
||||
}
|
||||
if(this.whereCome==3){
|
||||
uni.switchTab({url:'/pages/tabbar/product/product'})
|
||||
return
|
||||
}
|
||||
uni.navigateBack({delta:1})
|
||||
},
|
||||
confirm(){
|
||||
this.$emit('inputConfirm',this.serchVal)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,69 @@
|
|||
<template>
|
||||
<view>
|
||||
<view v-if="isShow" class="popu-boxw">
|
||||
<view class="popu-boxn">
|
||||
<image v-if="isSuccess" class="popu-imgh" src="../static/img/order/happy.png" mode=""></image>
|
||||
<image v-else class="popu-imgs" src="../static/img/order/sorry.png" mode=""></image>
|
||||
<view class="popu-title">{{title}}</view>
|
||||
<view class="popu-con">{{content}}</view>
|
||||
<image @tap="closepopu" class="popu-guan" src="../static/img/my/maclose.png" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:'successpopu',
|
||||
props:{
|
||||
isShow:{//显示弹框
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
isSuccess:{//成功、失败
|
||||
type:Boolean,
|
||||
default:true
|
||||
},
|
||||
title:{//标题
|
||||
type:String,
|
||||
default:'恭喜你,购买成功'
|
||||
},
|
||||
content:{//描述
|
||||
type:String,
|
||||
default:'可以在个人中心--我的订单查看订单详情'
|
||||
},
|
||||
typeNum:{
|
||||
type:String,
|
||||
default:''
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
panshow:this.isShow
|
||||
};
|
||||
},
|
||||
methods:{
|
||||
closepopu(){
|
||||
// console.log(this.typeNum);
|
||||
if(this.typeNum==1){
|
||||
setTimeout(function(){
|
||||
uni.navigateTo({
|
||||
url:'/pagesA/myOrder/myOrder'
|
||||
})
|
||||
},500)
|
||||
}
|
||||
this.$emit('change')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.popu-boxw{position: fixed;top: 0;bottom: 0;right: 0;left: 0;background-color: rgba(0,0,0,.8);z-index: 100;}
|
||||
.popu-boxn{background-color: #FFFFFF;border-radius: 20rpx;display: flex;justify-content: center;flex-direction: column;align-items: center;position: fixed;top: 50%;left: 50%;transform: translate(-50%,-50%);width: 80%;}
|
||||
.popu-imgh{width: 113rpx;height: 113rpx;margin: 40rpx 0;}
|
||||
.popu-imgs{width: 113rpx;height: 113rpx;margin: 40rpx 0;}
|
||||
.popu-title{color: #1c4593;font-size: 38rpx;}
|
||||
.popu-con{color: #282828;font-size: 26rpx;margin: 20rpx 0 80rpx 0;}
|
||||
.popu-guan{width: 55rpx;height: 55rpx;position: absolute;bottom: -80rpx;}
|
||||
</style>
|
|
@ -0,0 +1,66 @@
|
|||
<template>
|
||||
<view class="padding-zy20 disba flw">
|
||||
<view v-if="dataList.length!=0" class="discc radius10 padding20 margin-x20" v-for="(item,index) in dataList" :key="index"
|
||||
style="background-color: #FFFFFF;width: 43%;box-shadow: 0 0 30rpx rgba(0,0,0,0.1);">
|
||||
<image @tap="goDetail(item.spu_id)" class="pimg radius10 margin-s10" :src="item.src" mode="aspectFill"></image>
|
||||
<view class="clips2 margin-s10 width100" style="font-size: 27rpx;height: 68rpx;text-align: left;">{{item.title}}</view>
|
||||
<view class="disba width100 margin-sx10">
|
||||
<view class="disac fon24 colorf78">
|
||||
<view>¥<text class="fon36 bold">{{item.price}}</text>.00</view>
|
||||
<view class="flexs radius16 colorb fon24 margin-z10" style="background-color: #4cc474;line-height: 30rpx;height: 30rpx;">
|
||||
<view style="transform: scale(0.7);margin-top: -1rpx;">放心购</view>
|
||||
</view>
|
||||
</view>
|
||||
<image @tap="addChe(item.id)" class="pche" src="/static/img/public/gouwcar.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="dataList.length==0" class="kongk width100 text-center">空空如也</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props:{
|
||||
dataList:{
|
||||
type:Array,
|
||||
default:function(){
|
||||
return []
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
};
|
||||
},
|
||||
methods:{
|
||||
addChe(id){//加入购物车事件
|
||||
// console.log(this.dataList);
|
||||
if(uni.getStorageSync('is_active')==0) {
|
||||
this.$toolAll.tools.showToast('您目前是游客,请授权登录')
|
||||
setTimeout(()=>{
|
||||
uni.navigateTo({url:'/pages/login/login'})
|
||||
},1500)
|
||||
} else {
|
||||
this.$emit('addChe')
|
||||
this.$requst.post('order/shopping-cart-add',{sku_id:id,num:1}).then(res=>{
|
||||
if(res.code==0){
|
||||
this.$toolAll.tools.showToast('添加购物车成功(*^▽^*)')
|
||||
}
|
||||
},error=>{})
|
||||
}
|
||||
|
||||
},
|
||||
goDetail(index){
|
||||
// console.log('进入详情页'+index);
|
||||
uni.navigateTo({
|
||||
url:'/pagesA/productDetail/productDetail?id='+index
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
|
@ -0,0 +1,433 @@
|
|||
function AMapWX(a) {
|
||||
this.key = a.key, this.requestConfig = {
|
||||
key: a.key,
|
||||
s: "rsx",
|
||||
platform: "WXJS",
|
||||
appname: a.key,
|
||||
sdkversion: "1.2.0",
|
||||
logversion: "2.0"
|
||||
}
|
||||
}
|
||||
AMapWX.prototype.getWxLocation = function(a, b) {
|
||||
wx.getLocation({
|
||||
type: "gcj02",
|
||||
success: function(a) {
|
||||
var c = a.longitude + "," + a.latitude;
|
||||
wx.setStorage({
|
||||
key: "userLocation",
|
||||
data: c
|
||||
}), b(c)
|
||||
},
|
||||
fail: function(c) {
|
||||
wx.getStorage({
|
||||
key: "userLocation",
|
||||
success: function(a) {
|
||||
a.data && b(a.data)
|
||||
}
|
||||
}), a.fail({
|
||||
errCode: "0",
|
||||
errMsg: c.errMsg || ""
|
||||
})
|
||||
}
|
||||
})
|
||||
}, AMapWX.prototype.getRegeo = function(a) {
|
||||
function c(c) {
|
||||
var d = b.requestConfig;
|
||||
wx.request({
|
||||
url: "https://restapi.amap.com/v3/geocode/regeo",
|
||||
data: {
|
||||
key: b.key,
|
||||
location: c,
|
||||
extensions: "all",
|
||||
s: d.s,
|
||||
platform: d.platform,
|
||||
appname: b.key,
|
||||
sdkversion: d.sdkversion,
|
||||
logversion: d.logversion
|
||||
},
|
||||
method: "GET",
|
||||
header: {
|
||||
"content-type": "application/json"
|
||||
},
|
||||
success: function(b) {
|
||||
var d, e, f, g, h, i, j, k, l;
|
||||
b.data.status && "1" == b.data.status ? (d = b.data.regeocode, e = d.addressComponent,
|
||||
f = [], g = "", d && d.roads[0] && d.roads[0].name && (g = d.roads[0].name +
|
||||
"附近"), h = c.split(",")[0], i = c.split(",")[1], d.pois && d.pois[0] && (g =
|
||||
d.pois[0].name + "附近", j = d.pois[0].location, j && (h = parseFloat(j.split(
|
||||
",")[0]), i = parseFloat(j.split(",")[1]))), e.provice && f.push(e
|
||||
.provice), e.city && f.push(e.city), e.district && f.push(e.district), e
|
||||
.streetNumber && e.streetNumber.street && e.streetNumber.number ? (f.push(e
|
||||
.streetNumber.street), f.push(e.streetNumber.number)) : (k = "", d && d
|
||||
.roads[0] && d.roads[0].name && (k = d.roads[0].name), f.push(k)), f = f
|
||||
.join(""), l = [{
|
||||
iconPath: a.iconPath,
|
||||
width: a.iconWidth,
|
||||
height: a.iconHeight,
|
||||
name: f,
|
||||
desc: g,
|
||||
longitude: h,
|
||||
latitude: i,
|
||||
id: 0,
|
||||
regeocodeData: d
|
||||
}], a.success(l)) : a.fail({
|
||||
errCode: b.data.infocode,
|
||||
errMsg: b.data.info
|
||||
})
|
||||
},
|
||||
fail: function(b) {
|
||||
a.fail({
|
||||
errCode: "0",
|
||||
errMsg: b.errMsg || ""
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
var b = this;
|
||||
a.location ? c(a.location) : b.getWxLocation(a, function(a) {
|
||||
c(a)
|
||||
})
|
||||
}, AMapWX.prototype.getWeather = function(a) {
|
||||
function d(d) {
|
||||
var e = "base";
|
||||
a.type && "forecast" == a.type && (e = "all"), wx.request({
|
||||
url: "https://restapi.amap.com/v3/weather/weatherInfo",
|
||||
data: {
|
||||
key: b.key,
|
||||
city: d,
|
||||
extensions: e,
|
||||
s: c.s,
|
||||
platform: c.platform,
|
||||
appname: b.key,
|
||||
sdkversion: c.sdkversion,
|
||||
logversion: c.logversion
|
||||
},
|
||||
method: "GET",
|
||||
header: {
|
||||
"content-type": "application/json"
|
||||
},
|
||||
success: function(b) {
|
||||
function c(a) {
|
||||
var b = {
|
||||
city: {
|
||||
text: "城市",
|
||||
data: a.city
|
||||
},
|
||||
weather: {
|
||||
text: "天气",
|
||||
data: a.weather
|
||||
},
|
||||
temperature: {
|
||||
text: "温度",
|
||||
data: a.temperature
|
||||
},
|
||||
winddirection: {
|
||||
text: "风向",
|
||||
data: a.winddirection + "风"
|
||||
},
|
||||
windpower: {
|
||||
text: "风力",
|
||||
data: a.windpower + "级"
|
||||
},
|
||||
humidity: {
|
||||
text: "湿度",
|
||||
data: a.humidity + "%"
|
||||
}
|
||||
};
|
||||
return b
|
||||
}
|
||||
var d, e;
|
||||
b.data.status && "1" == b.data.status ? b.data.lives ? (d = b.data.lives, d && d
|
||||
.length > 0 && (d = d[0], e = c(d), e["liveData"] = d, a.success(e))) : b.data
|
||||
.forecasts && b.data.forecasts[0] && a.success({
|
||||
forecast: b.data.forecasts[0]
|
||||
}) : a.fail({
|
||||
errCode: b.data.infocode,
|
||||
errMsg: b.data.info
|
||||
})
|
||||
},
|
||||
fail: function(b) {
|
||||
a.fail({
|
||||
errCode: "0",
|
||||
errMsg: b.errMsg || ""
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function e(e) {
|
||||
wx.request({
|
||||
url: "https://restapi.amap.com/v3/geocode/regeo",
|
||||
data: {
|
||||
key: b.key,
|
||||
location: e,
|
||||
extensions: "all",
|
||||
s: c.s,
|
||||
platform: c.platform,
|
||||
appname: b.key,
|
||||
sdkversion: c.sdkversion,
|
||||
logversion: c.logversion
|
||||
},
|
||||
method: "GET",
|
||||
header: {
|
||||
"content-type": "application/json"
|
||||
},
|
||||
success: function(b) {
|
||||
var c, e;
|
||||
b.data.status && "1" == b.data.status ? (e = b.data.regeocode, e.addressComponent ? c =
|
||||
e.addressComponent.adcode : e.aois && e.aois.length > 0 && (c = e.aois[0]
|
||||
.adcode), d(c)) : a.fail({
|
||||
errCode: b.data.infocode,
|
||||
errMsg: b.data.info
|
||||
})
|
||||
},
|
||||
fail: function(b) {
|
||||
a.fail({
|
||||
errCode: "0",
|
||||
errMsg: b.errMsg || ""
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
var b = this,
|
||||
c = b.requestConfig;
|
||||
a.city ? d(a.city) : b.getWxLocation(a, function(a) {
|
||||
e(a)
|
||||
})
|
||||
}, AMapWX.prototype.getPoiAround = function(a) {
|
||||
function d(d) {
|
||||
var e = {
|
||||
key: b.key,
|
||||
location: d,
|
||||
s: c.s,
|
||||
platform: c.platform,
|
||||
appname: b.key,
|
||||
sdkversion: c.sdkversion,
|
||||
logversion: c.logversion
|
||||
};
|
||||
a.querytypes && (e["types"] = a.querytypes), a.querykeywords && (e["keywords"] = a.querykeywords), wx
|
||||
.request({
|
||||
url: "https://restapi.amap.com/v3/place/around",
|
||||
data: e,
|
||||
method: "GET",
|
||||
header: {
|
||||
"content-type": "application/json"
|
||||
},
|
||||
success: function(b) {
|
||||
var c, d, e, f;
|
||||
if (b.data.status && "1" == b.data.status) {
|
||||
if (b = b.data, b && b.pois) {
|
||||
for (c = [], d = 0; d < b.pois.length; d++) e = 0 == d ? a.iconPathSelected : a
|
||||
.iconPath, c.push({
|
||||
latitude: parseFloat(b.pois[d].location.split(",")[1]),
|
||||
longitude: parseFloat(b.pois[d].location.split(",")[0]),
|
||||
iconPath: e,
|
||||
width: 22,
|
||||
height: 32,
|
||||
id: d,
|
||||
name: b.pois[d].name,
|
||||
address: b.pois[d].address
|
||||
});
|
||||
f = {
|
||||
markers: c,
|
||||
poisData: b.pois
|
||||
}, a.success(f)
|
||||
}
|
||||
} else a.fail({
|
||||
errCode: b.data.infocode,
|
||||
errMsg: b.data.info
|
||||
})
|
||||
},
|
||||
fail: function(b) {
|
||||
a.fail({
|
||||
errCode: "0",
|
||||
errMsg: b.errMsg || ""
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
var b = this,
|
||||
c = b.requestConfig;
|
||||
a.location ? d(a.location) : b.getWxLocation(a, function(a) {
|
||||
d(a)
|
||||
})
|
||||
}, AMapWX.prototype.getStaticmap = function(a) {
|
||||
function f(b) {
|
||||
c.push("location=" + b), a.zoom && c.push("zoom=" + a.zoom), a.size && c.push("size=" + a.size), a.scale &&
|
||||
c.push("scale=" + a.scale), a.markers && c.push("markers=" + a.markers), a.labels && c.push("labels=" +
|
||||
a.labels), a.paths && c.push("paths=" + a.paths), a.traffic && c.push("traffic=" + a.traffic);
|
||||
var e = d + c.join("&");
|
||||
a.success({
|
||||
url: e
|
||||
})
|
||||
}
|
||||
var e, b = this,
|
||||
c = [],
|
||||
d = "https://restapi.amap.com/v3/staticmap?";
|
||||
c.push("key=" + b.key), e = b.requestConfig, c.push("s=" + e.s), c.push("platform=" + e.platform), c.push(
|
||||
"appname=" + e.appname), c.push("sdkversion=" + e.sdkversion), c.push("logversion=" + e.logversion), a
|
||||
.location ? f(a.location) : b.getWxLocation(a, function(a) {
|
||||
f(a)
|
||||
})
|
||||
}, AMapWX.prototype.getInputtips = function(a) {
|
||||
var b = this,
|
||||
c = b.requestConfig,
|
||||
d = {
|
||||
key: b.key,
|
||||
s: c.s,
|
||||
platform: c.platform,
|
||||
appname: b.key,
|
||||
sdkversion: c.sdkversion,
|
||||
logversion: c.logversion
|
||||
};
|
||||
a.location && (d["location"] = a.location), a.keywords && (d["keywords"] = a.keywords), a.type && (d["type"] = a
|
||||
.type), a.city && (d["city"] = a.city), a.citylimit && (d["citylimit"] = a.citylimit), wx.request({
|
||||
url: "https://restapi.amap.com/v3/assistant/inputtips",
|
||||
data: d,
|
||||
method: "GET",
|
||||
header: {
|
||||
"content-type": "application/json"
|
||||
},
|
||||
success: function(b) {
|
||||
b && b.data && b.data.tips && a.success({
|
||||
tips: b.data.tips
|
||||
})
|
||||
},
|
||||
fail: function(b) {
|
||||
a.fail({
|
||||
errCode: "0",
|
||||
errMsg: b.errMsg || ""
|
||||
})
|
||||
}
|
||||
})
|
||||
}, AMapWX.prototype.getDrivingRoute = function(a) {
|
||||
var b = this,
|
||||
c = b.requestConfig,
|
||||
d = {
|
||||
key: b.key,
|
||||
s: c.s,
|
||||
platform: c.platform,
|
||||
appname: b.key,
|
||||
sdkversion: c.sdkversion,
|
||||
logversion: c.logversion
|
||||
};
|
||||
a.origin && (d["origin"] = a.origin), a.destination && (d["destination"] = a.destination), a.strategy && (d[
|
||||
"strategy"] = a.strategy), a.waypoints && (d["waypoints"] = a.waypoints), a.avoidpolygons && (d[
|
||||
"avoidpolygons"] = a.avoidpolygons), a.avoidroad && (d["avoidroad"] = a.avoidroad), wx.request({
|
||||
url: "https://restapi.amap.com/v3/direction/driving",
|
||||
data: d,
|
||||
method: "GET",
|
||||
header: {
|
||||
"content-type": "application/json"
|
||||
},
|
||||
success: function(b) {
|
||||
b && b.data && b.data.route && a.success({
|
||||
paths: b.data.route.paths,
|
||||
taxi_cost: b.data.route.taxi_cost || ""
|
||||
})
|
||||
},
|
||||
fail: function(b) {
|
||||
a.fail({
|
||||
errCode: "0",
|
||||
errMsg: b.errMsg || ""
|
||||
})
|
||||
}
|
||||
})
|
||||
}, AMapWX.prototype.getWalkingRoute = function(a) {
|
||||
var b = this,
|
||||
c = b.requestConfig,
|
||||
d = {
|
||||
key: b.key,
|
||||
s: c.s,
|
||||
platform: c.platform,
|
||||
appname: b.key,
|
||||
sdkversion: c.sdkversion,
|
||||
logversion: c.logversion
|
||||
};
|
||||
a.origin && (d["origin"] = a.origin), a.destination && (d["destination"] = a.destination), wx.request({
|
||||
url: "https://restapi.amap.com/v3/direction/walking",
|
||||
data: d,
|
||||
method: "GET",
|
||||
header: {
|
||||
"content-type": "application/json"
|
||||
},
|
||||
success: function(b) {
|
||||
b && b.data && b.data.route && a.success({
|
||||
paths: b.data.route.paths
|
||||
})
|
||||
},
|
||||
fail: function(b) {
|
||||
a.fail({
|
||||
errCode: "0",
|
||||
errMsg: b.errMsg || ""
|
||||
})
|
||||
}
|
||||
})
|
||||
}, AMapWX.prototype.getTransitRoute = function(a) {
|
||||
var b = this,
|
||||
c = b.requestConfig,
|
||||
d = {
|
||||
key: b.key,
|
||||
s: c.s,
|
||||
platform: c.platform,
|
||||
appname: b.key,
|
||||
sdkversion: c.sdkversion,
|
||||
logversion: c.logversion
|
||||
};
|
||||
a.origin && (d["origin"] = a.origin), a.destination && (d["destination"] = a.destination), a.strategy && (d[
|
||||
"strategy"] = a.strategy), a.city && (d["city"] = a.city), a.cityd && (d["cityd"] = a.cityd), wx
|
||||
.request({
|
||||
url: "https://restapi.amap.com/v3/direction/transit/integrated",
|
||||
data: d,
|
||||
method: "GET",
|
||||
header: {
|
||||
"content-type": "application/json"
|
||||
},
|
||||
success: function(b) {
|
||||
if (b && b.data && b.data.route) {
|
||||
var c = b.data.route;
|
||||
a.success({
|
||||
distance: c.distance || "",
|
||||
taxi_cost: c.taxi_cost || "",
|
||||
transits: c.transits
|
||||
})
|
||||
}
|
||||
},
|
||||
fail: function(b) {
|
||||
a.fail({
|
||||
errCode: "0",
|
||||
errMsg: b.errMsg || ""
|
||||
})
|
||||
}
|
||||
})
|
||||
}, AMapWX.prototype.getRidingRoute = function(a) {
|
||||
var b = this,
|
||||
c = b.requestConfig,
|
||||
d = {
|
||||
key: b.key,
|
||||
s: c.s,
|
||||
platform: c.platform,
|
||||
appname: b.key,
|
||||
sdkversion: c.sdkversion,
|
||||
logversion: c.logversion
|
||||
};
|
||||
a.origin && (d["origin"] = a.origin), a.destination && (d["destination"] = a.destination), wx.request({
|
||||
url: "https://restapi.amap.com/v4/direction/bicycling",
|
||||
data: d,
|
||||
method: "GET",
|
||||
header: {
|
||||
"content-type": "application/json"
|
||||
},
|
||||
success: function(b) {
|
||||
b && b.data && b.data.data && a.success({
|
||||
paths: b.data.data.paths
|
||||
})
|
||||
},
|
||||
fail: function(b) {
|
||||
a.fail({
|
||||
errCode: "0",
|
||||
errMsg: b.errMsg || ""
|
||||
})
|
||||
}
|
||||
})
|
||||
}, module.exports.AMapWX = AMapWX;
|
|
@ -0,0 +1,31 @@
|
|||
const ENV = process.env.NODE_ENV;
|
||||
// console.log('当前环境', process.env.NODE_ENV)
|
||||
|
||||
const apiHub = {
|
||||
//开发环境
|
||||
development: {
|
||||
BASE_URL: "https://dengrui.scdxtc.cn/api/",
|
||||
IMG_URL: "https://xx",
|
||||
BASE_UPLOAD_URL: "",
|
||||
},
|
||||
|
||||
//测试环境
|
||||
test: {
|
||||
BASE_URL: "https://xxx",
|
||||
IMG_URL: "https://xxx",
|
||||
BASE_UPLOAD_URL: "",
|
||||
},
|
||||
|
||||
//生产环境
|
||||
production: {
|
||||
BASE_URL: "https://xx",
|
||||
IMG_URL: "https://xx",
|
||||
BASE_UPLOAD_URL: "",
|
||||
}
|
||||
}
|
||||
|
||||
// 导出配置
|
||||
export default {
|
||||
ENV: ENV,
|
||||
...apiHub[ENV]
|
||||
}
|
|
@ -0,0 +1,198 @@
|
|||
import base from '@/jsFile/config.js'
|
||||
// 统一给参数
|
||||
const dataObj = (url, params) => {
|
||||
let options = params
|
||||
// #ifdef APP-PLUS
|
||||
// DOTO:暂时没处理过,只是放在这里
|
||||
let data = null; //业务数据
|
||||
let terminal = 1 //终端类型,web:0,app:1
|
||||
options = {
|
||||
...params,
|
||||
data,
|
||||
sign,
|
||||
terminal
|
||||
}
|
||||
// #endif
|
||||
return options
|
||||
}
|
||||
const goLogin = () => {
|
||||
uni.clearStorageSync();
|
||||
uni.reLaunch({
|
||||
url: '/pages/login/Login'
|
||||
}) //未授权,请重新登录(401)
|
||||
}
|
||||
// 请求错误处理
|
||||
const checkError = (e, reject) => {
|
||||
// console.error("----接口错误----", e)
|
||||
if (e.data) {
|
||||
if (e.data.code) {
|
||||
switch (Number(e.data.code)) {
|
||||
case 4001:
|
||||
goLogin()
|
||||
break;
|
||||
}
|
||||
}
|
||||
reject(e.data)
|
||||
} else {
|
||||
reject({
|
||||
'msg': '接口错误'
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// 封装请求
|
||||
const request = (method, url, options) => {
|
||||
let methods = '';
|
||||
let headers = {};
|
||||
switch (method) {
|
||||
case 'get':
|
||||
methods = 'GET'
|
||||
headers = {
|
||||
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8',
|
||||
'Authorization': 'Bearer '+uni.getStorageSync('token') || ''
|
||||
}
|
||||
break;
|
||||
case 'post':
|
||||
methods = 'POST'
|
||||
headers = {
|
||||
'Content-Type': 'application/json; charset=UTF-8',
|
||||
// "content-type": "application/x-www-form-urlencoded;charset=UTF-8",
|
||||
'Authorization': 'Bearer '+uni.getStorageSync('token') || '',
|
||||
'Cookie': uni.getStorageSync('openid') || ''
|
||||
}
|
||||
break;
|
||||
case 'postForm':
|
||||
methods = 'POST'
|
||||
headers = {
|
||||
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8',
|
||||
'Authorization': 'Bearer '+uni.getStorageSync('token') || ''
|
||||
}
|
||||
break;
|
||||
}
|
||||
let obj = {},
|
||||
hideLoading = false,
|
||||
loadingText = 'loading...';
|
||||
if (options) { //如果有options
|
||||
if (options.hideLoading) {
|
||||
hideLoading = options.hideLoading
|
||||
delete options.hideLoading
|
||||
}
|
||||
if (options.loadingText) {
|
||||
loadingText = options.loadingText
|
||||
delete options.loadingText
|
||||
}
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
//!hideLoading && uni.showToast({title: loadingText,icon:'loading'})
|
||||
uni.request({
|
||||
url: `${base.BASE_URL}${url}`,
|
||||
method: methods,
|
||||
data: dataObj(url, options),
|
||||
header: headers,
|
||||
success: res => {
|
||||
// console.log('反的结果===>',res);
|
||||
if (res.statusCode == 200) {
|
||||
if (res.data.code == 0) {
|
||||
resolve(res.data)
|
||||
} else {
|
||||
// if(uni.getStorageSync('token')==''){
|
||||
// uni.showToast({title:'登录失效,请重新授权登录',icon:'none'})
|
||||
// setTimeout(function(){
|
||||
// uni.reLaunch({
|
||||
// url:'/pages/login/login'
|
||||
// })
|
||||
// },1000)
|
||||
// }
|
||||
checkError(res, reject)
|
||||
|
||||
}
|
||||
} else {
|
||||
|
||||
reject({
|
||||
'msg': '请求错误(' + res.statusCode + ')'
|
||||
})
|
||||
}
|
||||
},
|
||||
fail: e => {
|
||||
checkError(e, reject)
|
||||
},
|
||||
complete: () => {
|
||||
!hideLoading && uni.hideToast()
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
// 上传文件 封装请求
|
||||
const uploadFile = (url, options) => {
|
||||
let tempData = options || {}
|
||||
uni.showLoading({
|
||||
title: "上传中..."
|
||||
})
|
||||
return new Promise((resolve, reject) => {
|
||||
// console.log('tempData',tempData);
|
||||
uni.uploadFile({
|
||||
url: `${base.BASE_URL}${url}`,
|
||||
filePath: tempData.file,
|
||||
name: 'image',
|
||||
fileType:'image',
|
||||
formData: tempData,
|
||||
header: {
|
||||
'Content-Type': 'multipart/form-data;charset=UTF-8',
|
||||
'Authorization': 'Bearer '+uni.getStorageSync('token') || ''
|
||||
},
|
||||
success: res => {
|
||||
if (res.statusCode == 200) {
|
||||
let temp = JSON.parse(res.data)
|
||||
if (temp.code == 0) {
|
||||
resolve(temp)
|
||||
} else {
|
||||
reject(temp)
|
||||
uni.showToast({
|
||||
title: temp.msg || '接口错误(' + temp.code + ')',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: `未知错误(${res.statusCode})`,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
},
|
||||
fail(e) {
|
||||
// uni.showToast({
|
||||
// title: '接口请求超时',
|
||||
// icon: 'none'
|
||||
// })
|
||||
// reject(e.data)
|
||||
},
|
||||
complete: () => {
|
||||
uni.hideLoading()
|
||||
}
|
||||
});
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
export default {
|
||||
get: (url, options) => {
|
||||
return request('get', url, options)
|
||||
},
|
||||
|
||||
// JOSN格式
|
||||
post: (url, options) => {
|
||||
return request('post', url, options)
|
||||
},
|
||||
|
||||
// form-data格式
|
||||
postForm: (url, options) => {
|
||||
return request('postForm', url, options)
|
||||
},
|
||||
|
||||
// 上传
|
||||
upload: (url, options) => {
|
||||
return uploadFile(url, options)
|
||||
}
|
||||
}
|
|
@ -0,0 +1,239 @@
|
|||
const tools = {
|
||||
// 手机号验证
|
||||
isPhone:function(phone){
|
||||
// 手机号正则表达式
|
||||
let reg_tel = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;
|
||||
if(!reg_tel.test(phone)){
|
||||
return true
|
||||
}
|
||||
return false
|
||||
},
|
||||
// 手机号中间四位用"****"带替
|
||||
hideMPhone(phone){
|
||||
return `${phone.substr(0, 3)}****${phone.substr(7)}`
|
||||
},
|
||||
// 只显示姓,名使用"*"代替
|
||||
hideName(name,num){
|
||||
let hname = ''
|
||||
// let reg = /(?<=.)./g;
|
||||
// let reg = new RegExp("(?<=.).", 'g');
|
||||
|
||||
// if(num==1) hname = name.replace(reg, '*')
|
||||
// if(num==2) hname = `${name.substr(0, 1)}****${name.substr(name.length-1)}`
|
||||
hname = `${name.substr(0, 1)}****${name.substr(name.length-1)}`
|
||||
return hname
|
||||
},
|
||||
// 时间戳===>日期
|
||||
timestampToTime(timestamp) {
|
||||
var date = new Date(timestamp * 1000);//时间戳为10位需*1000,时间戳为13位的话不需乘1000
|
||||
var Y = date.getFullYear();
|
||||
var M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1);
|
||||
var D = date.getDate() < 10 ? '0'+date.getDate() : date.getDate();
|
||||
var h = date.getHours() < 10 ? '0'+date.getHours() : date.getHours();
|
||||
var m = date.getMinutes() < 10 ? '0'+date.getMinutes() : date.getMinutes();
|
||||
var s = date.getSeconds() < 10 ? '0'+date.getSeconds() : date.getSeconds();
|
||||
return Y + '-' + M + '-' + D + ' ' + h + ':' + m + ':' +s;
|
||||
},
|
||||
// 日期===>时间戳
|
||||
timeToTimestamp(time){
|
||||
var date = new Date(time);
|
||||
var timestamp = date.getTime();//精确到毫秒
|
||||
return timestamp
|
||||
// var date = new Date('2014-04-23 18:55:49:123');
|
||||
// 有三种方式获取
|
||||
// var time1 = date.getTime();//精确到毫秒
|
||||
// var time2 = date.valueOf();//精确到毫秒
|
||||
// var time3 = Date.parse(date);//只能精确到秒,毫秒用000替代
|
||||
// console.log(time1);//1398250549123
|
||||
// console.log(time2);//1398250549123
|
||||
// console.log(time3);//1398250549000
|
||||
},
|
||||
guoq(){
|
||||
var date = new Date();
|
||||
var timestamp = date.getTime();//精确到毫秒
|
||||
if((uni.getStorageSync('expire')*1000) - 10000 < timestamp){
|
||||
this.loginEv()
|
||||
} else if(uni.getStorageSync('token')==''){
|
||||
this.loginEv()
|
||||
} else {
|
||||
this.loginEv()
|
||||
}
|
||||
},
|
||||
loginEv(){
|
||||
uni.login({
|
||||
provider: 'weixin',
|
||||
success: function(res) {
|
||||
if (res.code) {
|
||||
let code = res.code;
|
||||
let obj = uni.getStorageSync('params')
|
||||
var params = {
|
||||
invite_code:uni.getStorageSync('invite_code'),
|
||||
code:code,
|
||||
nickname: obj.nickname,
|
||||
avatar: obj.avatarUrl,
|
||||
country: obj.country,
|
||||
province: obj.province,
|
||||
city: obj.city,
|
||||
gender: obj.gender,
|
||||
language:obj.language
|
||||
}
|
||||
uni.request({
|
||||
url: `https://dengrui.scdxtc.cn/api/user/wxAppletsLogin`,
|
||||
method: 'post',
|
||||
data: params,
|
||||
header: {
|
||||
'Content-Type': 'application/json; charset=UTF-8',
|
||||
// "content-type": "application/x-www-form-urlencoded;charset=UTF-8",
|
||||
'Authorization': 'Bearer '+uni.getStorageSync('token') || ''
|
||||
},
|
||||
success: res => {
|
||||
if(res.data.data.token!=''){
|
||||
uni.setStorageSync('token',res.data.data.token)//缓存token
|
||||
uni.setStorageSync('openid',res.data.data.openid)//缓存Openid
|
||||
uni.setStorageSync('expire',res.data.data.expire)//缓存失效时间(时间戳格式)
|
||||
uni.setStorageSync('is_active',res.data.data.is_active)//是否第一次授权
|
||||
}
|
||||
},
|
||||
fail: e => {
|
||||
checkError(e, reject)
|
||||
},
|
||||
complete: () => {}
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '登录失败!',
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
},
|
||||
});
|
||||
},
|
||||
// 随机数生成
|
||||
randomStr(){
|
||||
var strData = "";
|
||||
//如果觉得12个数太少也可以多放点,将i<4修改即可
|
||||
for(var i=0;i<4;i++){
|
||||
var num = random(0,9); //数字
|
||||
var upper = String.fromCharCode(random(65,90)); //大写字母
|
||||
var lower = String.fromCharCode(random(97,122)); //小写字母
|
||||
strData = strData+num+upper+lower; //将所有结果放进strData中
|
||||
|
||||
}
|
||||
var str = "";
|
||||
for (var i = 0; i < 4; i++) {
|
||||
str += strData[random(0,strData.length-1)]; //在strData里面随机抽取四个数
|
||||
}
|
||||
return str;
|
||||
},
|
||||
// 金额输入框验证
|
||||
checkPrice(number,zong){
|
||||
let reg = /^[0-9]*$/;//数字正则表达式
|
||||
let newObj = {}
|
||||
zong = parseInt(zong).toString()//取小数点左边的整数
|
||||
if(!reg.test(number)){//不是数字时
|
||||
newObj = {
|
||||
len:zong.length,//动态设置长度
|
||||
val:zong//动态设置值正整数的总金额
|
||||
}
|
||||
} else {//是数字时
|
||||
newObj = {
|
||||
len:zong.length,
|
||||
val:number//动态设置当前输入的值
|
||||
}
|
||||
if(number*1 > zong*1){//输入的金额大于总金额
|
||||
newObj.val = zong//赋值总金额
|
||||
}
|
||||
}
|
||||
return newObj
|
||||
},
|
||||
// 提示方法
|
||||
showToast: function(msg, icon,time) {
|
||||
// 弹框图标:none默认无图标、loading、success
|
||||
var newIncon = 'none';
|
||||
if (icon) {newIncon = icon;}
|
||||
// 弹框显示时间:默认2秒
|
||||
var newTime = 2000
|
||||
if (time) {newTime = time;}
|
||||
return uni.showToast({
|
||||
title: msg,
|
||||
icon: newIncon,
|
||||
duration:newTime
|
||||
})
|
||||
},
|
||||
formatDuring: function(mss) {
|
||||
// let dangTime = Math.round(new Date()/1000)//获取当前时间戳
|
||||
var hours = parseInt((mss % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
|
||||
var minutes = parseInt((mss % (1000 * 60 * 60)) / (1000 * 60));
|
||||
var seconds = (mss % (1000 * 60)) / 1000;
|
||||
hours = hours < 10 ? ('0' + hours) : hours;
|
||||
minutes = minutes < 10 ? ('0' + minutes) : minutes;
|
||||
seconds = seconds < 10 && seconds >= 1 ? ('0' + seconds) : seconds;
|
||||
return hours + ' :' + minutes + ' :' + seconds;
|
||||
},
|
||||
escape2Html(str) {
|
||||
var arrEntities = { 'lt': '<', 'gt': '>', 'nbsp': ' ', 'amp': '&', 'quot': '"' };
|
||||
return str.replace(/&(lt|gt|nbsp|amp|quot|src);/ig, function (all, t) { return arrEntities[t]; }).replace('<section', '<div').replace(/\<img/g, '<img @tap="pre" style="max-width:100%;height:auto" ').replace(/src=\"/g,'src="https://dengrui.scdxtc.cn');
|
||||
},
|
||||
setTime(url,title,time){
|
||||
// console.log(url,title,time);
|
||||
if(url=='' && title==''){
|
||||
setTimeout(function(){uni.navigateBack({delta:1,})},time)
|
||||
} else if(title==''){
|
||||
setTimeout(function(){
|
||||
uni.navigateTo({
|
||||
url:url
|
||||
})
|
||||
},time)
|
||||
}
|
||||
|
||||
},
|
||||
checkGuo(){
|
||||
let invalidTime = uni.getStorageSync('expire')//获取过期时间戳
|
||||
let dangTime = Math.round(new Date()/1000)//获取当前时间戳
|
||||
// if(invalidTime==''){//当前时间戳减过期时间戳大于零,就表示已过期
|
||||
// uni.showToast({title:'您当前是游客,请授权登录',icon:'none',duration:2000})
|
||||
// setTimeout(function(){
|
||||
// uni.reLaunch({url:'/pages/login/login'})//跳转到授权登录页
|
||||
// },2000)
|
||||
// }
|
||||
// console.log('dangTime-invalidTime:',(dangTime-invalidTime));
|
||||
// if(dangTime-invalidTime>=0){
|
||||
uni.request({
|
||||
url: `https://dengrui.scdxtc.cn/api/user/wxAppletsLogin`,
|
||||
method: 'post',
|
||||
data: uni.getStorageSync('params'),
|
||||
header: {
|
||||
'Content-Type': 'application/json; charset=UTF-8',
|
||||
// "content-type": "application/x-www-form-urlencoded;charset=UTF-8",
|
||||
'Authorization': 'Bearer '+uni.getStorageSync('token') || ''
|
||||
},
|
||||
success: res => {
|
||||
console.log(res);
|
||||
console.log('token:',uni.getStorageSync('token'));
|
||||
if(res.data.token!=''){
|
||||
uni.setStorageSync('token',res.data.token)//缓存token
|
||||
uni.setStorageSync('openid',res.data.openid)//缓存Openid
|
||||
uni.setStorageSync('expire',res.data.expire)//缓存失效时间(时间戳格式)
|
||||
}
|
||||
},
|
||||
fail: e => {
|
||||
checkError(e, reject)
|
||||
},
|
||||
complete: () => {}
|
||||
})
|
||||
// }
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
export default {
|
||||
tools
|
||||
}
|
|
@ -0,0 +1,28 @@
|
|||
import Vue from 'vue'
|
||||
import App from './App'
|
||||
import statusNav from './components/status-nav.vue';//引入状态栏组件
|
||||
Vue.component('status-nav',statusNav)//挂载状态栏组件
|
||||
const newwidth = uni.getSystemInfoSync().screenWidth//获取屏幕宽度
|
||||
Vue.prototype.$newwidth = newwidth//挂载屏幕宽度
|
||||
const statusH = uni.getSystemInfoSync().statusBarHeight//获取状态栏高
|
||||
Vue.prototype.$statusH = statusH//挂载状态栏高
|
||||
|
||||
// 常用工具
|
||||
import tools from '@/jsFile/tools.js'
|
||||
Vue.prototype.$toolAll = tools;
|
||||
// 响应数据
|
||||
import requst from '@/jsFile/requst.js'
|
||||
Vue.prototype.$requst = requst;
|
||||
|
||||
|
||||
Vue.prototype.$http = 'https://dengrui.scdxtc.cn'
|
||||
|
||||
|
||||
Vue.config.productionTip = false
|
||||
|
||||
App.mpType = 'app'
|
||||
|
||||
const app = new Vue({
|
||||
...App
|
||||
})
|
||||
app.$mount()
|
|
@ -0,0 +1,77 @@
|
|||
{
|
||||
"name" : "dengrui",
|
||||
"appid" : "__UNI__02EF3E2",
|
||||
"description" : "",
|
||||
"versionName" : "1.0.0",
|
||||
"versionCode" : "100",
|
||||
"transformPx" : false,
|
||||
"app-plus" : {
|
||||
"usingComponents" : true,
|
||||
"compilerVersion" : 3,
|
||||
/* 5+App特有相关 */
|
||||
"modules" : {
|
||||
"Payment" : {}
|
||||
},
|
||||
/* 模块配置 */
|
||||
"distribute" : {
|
||||
/* 应用发布信息 */
|
||||
"android" : {
|
||||
/* android打包配置 */
|
||||
"permissions" : [
|
||||
"<uses-feature android:name=\"android.hardware.camera\"/>",
|
||||
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
|
||||
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
|
||||
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
|
||||
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.MODIFY_AUDIO_SETTINGS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
|
||||
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
|
||||
]
|
||||
},
|
||||
"ios" : {},
|
||||
/* ios打包配置 */
|
||||
"sdkConfigs" : {
|
||||
"maps" : {},
|
||||
"payment" : {
|
||||
"weixin" : {
|
||||
"__platform__" : [ "ios", "android" ],
|
||||
"appid" : "wxd370f89ab17d48d2",
|
||||
"UniversalLinks" : ""
|
||||
}
|
||||
},
|
||||
"push" : {},
|
||||
"geolocation" : {}
|
||||
}
|
||||
}
|
||||
},
|
||||
/* SDK配置 */
|
||||
"quickapp" : {},
|
||||
/* 快应用特有相关 */
|
||||
"mp-weixin" : {
|
||||
/* 小程序特有相关 */
|
||||
"appid" : "wxd370f89ab17d48d2",
|
||||
"setting" : {
|
||||
"urlCheck" : true,
|
||||
"es6" : false
|
||||
},
|
||||
"usingComponents" : true,
|
||||
"permission" : {
|
||||
"scope.userLocation" : {
|
||||
"desc" : "您的位置信息将用于小程序位置接口的效果展示"
|
||||
}
|
||||
}
|
||||
},
|
||||
"h5" : {
|
||||
"sdkConfigs" : {
|
||||
"maps" : {}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,195 @@
|
|||
{
|
||||
"pages": [
|
||||
//pages数组中第一项表示应用启动页,参考:https://uniapp.dcloud.io/collocation/pages
|
||||
{
|
||||
"path": "pages/tabbar/homePage/homePage",
|
||||
"style": {
|
||||
"navigationBarTitleText": "登锐汽配汇",
|
||||
"navigationStyle":"custom",//去掉原生导航栏
|
||||
"app-plus":{
|
||||
"titleNView":false//去掉顶部状态栏
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"path" : "pages/login/login",
|
||||
"style" :{}
|
||||
},
|
||||
{
|
||||
"path": "pages/tabbar/product/product",//产品列表页
|
||||
"style": {}
|
||||
},
|
||||
{
|
||||
"path": "pages/tabbar/shoppingCart/shoppingCart",//购物车页面
|
||||
"style": {}
|
||||
},
|
||||
{
|
||||
"path": "pages/tabbar/my/my",//我的页面
|
||||
"style": {}
|
||||
}
|
||||
,{
|
||||
"path" : "pages/login/xiey/xiey",
|
||||
"style" :
|
||||
{
|
||||
"navigationBarTitleText": "",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
|
||||
}
|
||||
],
|
||||
"subPackages": [{
|
||||
"root": "pagesA",
|
||||
"pages": [
|
||||
{
|
||||
"path": "productDetail/productDetail",//产品详情页
|
||||
"style": {}
|
||||
},
|
||||
{
|
||||
"path" : "myOrder/myOrder",//我的订单列表
|
||||
"style" : {}
|
||||
},
|
||||
{
|
||||
"path" : "confirmOrder/confirmOrder",//订单确认
|
||||
"style" : {}
|
||||
},
|
||||
{
|
||||
"path" : "afterSales/afterSales",//售后
|
||||
"style" : {}
|
||||
},
|
||||
{
|
||||
"path" : "daiEvaluated/daiEvaluated",//待评价
|
||||
"style" : {}
|
||||
},
|
||||
{
|
||||
"path" : "evaluate/evaluate",//评价
|
||||
"style" : {}
|
||||
},
|
||||
{
|
||||
"path" : "viewLogistics/viewLogistics",//物流信息
|
||||
"style" : {}
|
||||
},
|
||||
{
|
||||
"path" : "applyAfterSales/applyAfterSales",//申请售后
|
||||
"style" : {}
|
||||
}
|
||||
]
|
||||
}, {
|
||||
"root": "pagesB",
|
||||
"pages": [
|
||||
{
|
||||
"path" : "allEvaluate/allEvaluate",//商品所有评价页
|
||||
"style" : {}
|
||||
},
|
||||
{
|
||||
"path" : "zIncome/zIncome",//收益页面
|
||||
"style" : {}
|
||||
},
|
||||
{
|
||||
"path" : "personalInfo/personalInfo",//个人资料
|
||||
"style" : {}
|
||||
},
|
||||
{
|
||||
"path" : "record/record",//提现记录
|
||||
"style" : {}
|
||||
},
|
||||
{
|
||||
"path" : "immediateWithdrawal/immediateWithdrawal",//立即提现
|
||||
"style" : {}
|
||||
},
|
||||
{
|
||||
"path" : "notices/notices",//公告
|
||||
"style" : {}
|
||||
},
|
||||
{
|
||||
"path" : "noticesDetail/noticesDetail",//公告详情
|
||||
"style" : {}
|
||||
},
|
||||
{
|
||||
"path" : "myCollection/myCollection",//我的收藏
|
||||
"style" : {}
|
||||
},
|
||||
{
|
||||
"path" : "dividendRules/dividendRules",//分红规则
|
||||
"style" : {}
|
||||
},
|
||||
{
|
||||
"path" : "adManagement/adManagement",//地址管理
|
||||
"style" : {}
|
||||
},
|
||||
{
|
||||
"path" : "newAddress/newAddress",//新增地址
|
||||
"style" : {}
|
||||
},
|
||||
{
|
||||
"path" : "businessCooperation/businessCooperation",//商务合作
|
||||
"style" : {}
|
||||
}
|
||||
,{
|
||||
"path" : "platformDescription/platformDescription",
|
||||
"style" :
|
||||
{
|
||||
"navigationBarTitleText": "",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
|
||||
}
|
||||
,{
|
||||
"path" : "keySearch/keySearch",
|
||||
"style" :
|
||||
{
|
||||
"navigationBarTitleText": "",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
|
||||
}
|
||||
]
|
||||
}],
|
||||
"preloadRule": {
|
||||
"pages/tabbar/homePage/homePage": {
|
||||
"network": "all",
|
||||
"packages": ["pagesA"]
|
||||
}
|
||||
},
|
||||
"globalStyle": {
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarTitleText": "登锐",
|
||||
"navigationBarBackgroundColor": "#f5f5f5",//导航栏背景色
|
||||
"backgroundColor": "#f5f5f5",//窗口背景色
|
||||
"navigationStyle":"custom"//去掉所有原生导航栏
|
||||
},
|
||||
"tabBar": {
|
||||
// "height":"56px",//底部tab高度
|
||||
// "fontSize":"10px",//字体大小
|
||||
// "iconWidth":"22px",//图标宽高等比缩放
|
||||
// "spacing":"4px",//图标和文字距离
|
||||
"borderStyle": "white",//线条颜色
|
||||
"backgroundColor": "#FFFFFF",//背景颜色
|
||||
"color": "#aaaeb7",//默认字体颜色
|
||||
"selectedColor": "#214995",//选中字体颜色
|
||||
"list": [{
|
||||
"pagePath": "pages/tabbar/homePage/homePage",
|
||||
"iconPath": "static/img/tabbar/pagem.png",
|
||||
"selectedIconPath": "static/img/tabbar/pageh.png",
|
||||
"text": "首页"
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/tabbar/product/product",
|
||||
"iconPath": "static/img/tabbar/productm.png",
|
||||
"selectedIconPath": "static/img/tabbar/product.png",
|
||||
"text": "产品"
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/tabbar/shoppingCart/shoppingCart",
|
||||
"iconPath": "static/img/tabbar/chem.png",
|
||||
"selectedIconPath": "static/img/tabbar/chem.png",
|
||||
"text": "购物车"
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/tabbar/my/my",
|
||||
"iconPath": "static/img/tabbar/mym.png",
|
||||
"selectedIconPath": "static/img/tabbar/my.png",
|
||||
"text": "我的"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
|
@ -0,0 +1,202 @@
|
|||
<template>
|
||||
<view>
|
||||
<view style="opacity: 1;">
|
||||
<status-nav :statusBackg="true" :whereCome="2*1" :backgroudColor="'#F5F5F5'"></status-nav>
|
||||
</view>
|
||||
<view v-if="canIUse || canIGetUserProfile">
|
||||
<view class='login-header'>
|
||||
<image class="infoImg" style="border: 1rpx solid rgba(0,0,0,.6);" mode="aspectFit" :src="userInfo.avatarUrl || imgSrc"></image>
|
||||
<view class="name">登锐商城</view>
|
||||
</view>
|
||||
<view class="login-box">
|
||||
<!--新版登录方式-->
|
||||
<button v-if="canIGetUserProfile" class='login-btn' type='primary'
|
||||
@click="bindGetUserInfo">授权登录</button>
|
||||
<!--旧版登录方式-->
|
||||
<button v-else class='login-btn' type='primary' open-type="getUserInfo" withCredentials="true"
|
||||
lang="zh_CN" @getuserinfo="bindGetUserInfo">授权登录</button>
|
||||
<view class="disbcac margin-s30 color9">登录代表您已同意<text @tap="goXie" style="color: #007AFF;">《用户服务协议》</text></view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else class="text-center">
|
||||
请升级微信版本
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
sessionKey: '',
|
||||
openId: '',
|
||||
nickName: null,
|
||||
avatarUrl: null,
|
||||
userInfo: {},
|
||||
canIUse: uni.canIUse('button.open-type.getUserInfo'),
|
||||
canIGetUserProfile: false,
|
||||
imgSrc: 'https://s3.jpg.cm/2021/07/31/I8c8AL.jpg',
|
||||
invite_code:'',
|
||||
showtime:100000
|
||||
};
|
||||
},
|
||||
onLoad(options) {
|
||||
var _this = this;
|
||||
// 微信扫码后会自动编码,所以需要解码
|
||||
// if (options && options.q) {
|
||||
// let arr = decodeURIComponent(options.q).split('?')[1].split('&')
|
||||
// let obj = {}
|
||||
// arr.forEach(item => {
|
||||
// let brr = item.split('=')
|
||||
// obj[brr[0]] = brr[1]
|
||||
// })
|
||||
// _this.invite_code = obj.invite_code
|
||||
// // console.log(obj) //得到参数组成的对象
|
||||
// uni.setStorageSync('invite_code',obj.invite_code)
|
||||
// }
|
||||
if (uni.getUserProfile) {
|
||||
this.canIGetUserProfile = true;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
goXie(){
|
||||
uni.navigateTo({
|
||||
url:'/pages/login/xiey/xiey'
|
||||
})
|
||||
},
|
||||
//登录授权
|
||||
bindGetUserInfo(e) {
|
||||
var _this = this;
|
||||
if (this.canIGetUserProfile) {
|
||||
//新版登录方式
|
||||
uni.getUserProfile({
|
||||
desc: '登录',
|
||||
lang: 'zh_CN',
|
||||
success: (res) => {
|
||||
_this.userInfo = res.userInfo;
|
||||
// console.log(_this.userInfo);
|
||||
// var userInfo = res.userInfo
|
||||
// var nickName = userInfo.nickName
|
||||
var avatarUrl = _this.userInfo.avatarUrl
|
||||
uni.setStorageSync('logoImg',avatarUrl)
|
||||
// var gender = userInfo.gender //性别 0:未知、1:男、2:女
|
||||
// var province = userInfo.province
|
||||
// var city = userInfo.city
|
||||
// var country = userInfo.country
|
||||
// console.log('用户信息:' + userInfo);
|
||||
// console.log('用户昵称:' + nickName);
|
||||
// console.log('用户头像:' + avatarUrl);
|
||||
// console.log('用户所在省:' + province);
|
||||
// console.log('用户所在城市:' + city);
|
||||
// console.log('用户所在国家:' + country);
|
||||
try {
|
||||
_this.login();
|
||||
} catch (e) {}
|
||||
},
|
||||
fail: (res) => {
|
||||
// console.log(res)
|
||||
}
|
||||
});
|
||||
} else {
|
||||
//旧版登录方式
|
||||
if (e.detail.userInfo) {
|
||||
//用户按了允许授权按钮
|
||||
_this.userInfo = e.detail.userInfo;
|
||||
try {
|
||||
_this.login();
|
||||
} catch (e) {}
|
||||
} else {
|
||||
//用户按了拒绝按钮
|
||||
}
|
||||
}
|
||||
},
|
||||
//登录
|
||||
login() {
|
||||
let _this = this;
|
||||
// 获取登录用户code
|
||||
uni.login({
|
||||
provider: 'weixin',
|
||||
success: function(res) {
|
||||
if (res.code) {
|
||||
let code = res.code;
|
||||
console.log('code');
|
||||
_this.updateUserInfo(code);
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '登录失败!',
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
},
|
||||
});
|
||||
},
|
||||
//向后台更新信息
|
||||
updateUserInfo(code) {
|
||||
let _this = this;
|
||||
uni.showToast({
|
||||
title: '登录中...',
|
||||
icon:'loading',
|
||||
duration:_this.showtime
|
||||
})
|
||||
var params = {
|
||||
invite_code:uni.getStorageSync('invite_code'),
|
||||
code:code,
|
||||
nickname: _this.userInfo.nickName,
|
||||
avatar: _this.userInfo.avatarUrl,
|
||||
country: _this.userInfo.country,
|
||||
province: _this.userInfo.province,
|
||||
city: _this.userInfo.city,
|
||||
gender: _this.userInfo.gender,
|
||||
language:_this.userInfo.language,
|
||||
is_active:1
|
||||
}
|
||||
// console.log('授权时的参数:',params);
|
||||
this.$requst.post('user/wxAppletsLogin',params).then(res => {
|
||||
// console.log(res);
|
||||
if(res.data.token!=''){
|
||||
uni.setStorageSync('params',params)
|
||||
uni.setStorageSync('token',res.data.token)//缓存token
|
||||
uni.setStorageSync('openid',res.data.openid)//缓存Openid
|
||||
uni.setStorageSync('expire',res.data.expire)//缓存失效时间(时间戳格式)
|
||||
uni.setStorageSync('is_active',res.data.is_active)//是否第一次授权
|
||||
setTimeout(()=>{
|
||||
uni.switchTab({
|
||||
url:'/pages/tabbar/homePage/homePage'
|
||||
})
|
||||
_this.$toolAll.tools.showToast('登录成功','success')
|
||||
},1000)
|
||||
}
|
||||
},error => {})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.login-header {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
margin-top: 40%;
|
||||
}
|
||||
|
||||
.infoImg {
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
.name {
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.login-box {
|
||||
margin-top: 60rpx;
|
||||
}
|
||||
|
||||
.login-btn {
|
||||
width: 80%;
|
||||
margin-top: 50%;
|
||||
}
|
||||
</style>
|
|
@ -0,0 +1,51 @@
|
|||
<template>
|
||||
<view>
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav :statusBackw="true" :statusTitle="true" :title-val="'用户协议'" :tabcolor="'#ffffff'"></status-nav>
|
||||
<view :style="{marginTop:(statusHNH+10)+'px'}">
|
||||
<view class="fon28 bold width100" style="text-align: center;">成都登锐科技会员服务计划---会员章程(及协议)</view>
|
||||
<view class="padding20 fon24">
|
||||
<view class="fon28 bold margin-sx10">一、宗旨</view>
|
||||
<view class="">【成都登锐科技会员服务计划(以下简称“平台”)是由成都登锐科技(以下简称“组织方”)出资及组织,对平台会员(以下简称“会员”),以购买产品,特惠折扣、平台提成、利润分红、其他增值服务等内容的市场服务计划。该平台将打造一个智能、便捷、贴心服务的购物以及会员活动环境,让会员享受智能化的消费体验。】</view>
|
||||
<view class="fon28 bold margin-sx10">二、实施范围</view>
|
||||
<view class="">成都登锐科技会员服务计划将于成都登锐科技小程序内实施,具体实施范围以组织方不时对外公布的为准。</view>
|
||||
<view class="fon28 bold margin-sx10">三、会员条款</view>
|
||||
<view class="">
|
||||
<view class="">(一)会员注册:</view>
|
||||
<view class="">1、会员必须为年满18周岁的自然人,并且具有完全的民事行为能力。</view>
|
||||
<view class="">2、符合上述第一条件的人士可以通过平台关注或者组织方的微信账号以及其他媒体来源通过绑定成为会员;部分会员(销售、商户)身份需要获得平台方的审核认可即可成为会员。</view>
|
||||
<view class="">3、申请人必须认真阅读本章程以及相关文献,一经关注平台或组织方的维系账号并与微信绑定,即视为申请人已仔细阅读,理解并同意接受本章程的全部条款。有权选择停止使用或者继续使用平台内的所有服务,一旦您继续使用了,则表示您已接受经平台对外发布的各项规章制度及管理办法,当用户与平台发生争议时,应以最新的规章制度和管理办法内容为准。</view>
|
||||
<view class="">4、若申请人以及商户不符合本章程规定的申请条件,组织方有权在知晓前述情况后终止对其提供会员服务,届时其账户上所有的分红、优惠福利均自动作废,平台对此无需承担任何责任。</view>
|
||||
<view class="">(二)会员购买须知:</view>
|
||||
<view class="">1、本平台所有会员均同意本平台的任意产品因市场价格的波动会有涨价、降价或者优惠等变化,具体价格等优惠以实时公布为准;</view>
|
||||
<view class="">2、下单:会员在购买产品时,应详细的核对购买需求,确认后向平台支付对应款项提交订单,有任何问题及时拨打平台客服热线;</view>
|
||||
<view>3、发货:平台收到订单后,根据下单时间先后顺序进行发货,部分急单请先与平台取得联系后下单;</view>
|
||||
<view>4、物流:商品的到货时间根据各物流公司配货情况而不同,无法准确估计,有任何情况都可与本平台进行沟通;</view>
|
||||
<view>5、运费:本平台的产品默认包邮,当产品的运输价格不能满足包邮条件下,平台有权向会员索要运费,若双方协商无果,平台有权利无责取消该订单;</view>
|
||||
<view>6、退货:本平台暂不支持退货,若需要退货,需要支付平台方已经产生的运费等费用,以及其余用户的佣金等不可弥补的损失;</view>
|
||||
<view>7、换货:因平台的货物产生问题,在收到款项后应立即联系平台进行处理,如已经确认收货后发现问题,寻找平台进行协商换货。非平台货物问题损坏的情况平台概不负责;</view>
|
||||
</view>
|
||||
<view class="fon28 bold margin-sx10">四、分销系统说明</view>
|
||||
<view class="">(一)分销会员等级</view>
|
||||
<view>1、平台基础分销员(普通会员):以销售额度的3%佣金提成;</view>
|
||||
<view>2、平台特约分销员(商户会员):以销售额度的5%佣金提成;</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
statusHNH:uni.getStorageSync('statusHNH'),
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
|
@ -0,0 +1,340 @@
|
|||
<template>
|
||||
<view>
|
||||
<view class="posir">
|
||||
<image class="posia" src="/static/img/pageh/headb.png" style="width: 100%;"></image>
|
||||
<!-- 使用标题栏 -->
|
||||
<!-- <status-nav :statusTitle="true" :title-val="'登锐商城'" :tabcolor="'#ffffff'"></status-nav> -->
|
||||
<view class="posi-tzy zIn5 statusHNH" style="background: url(https://s3.jpg.cm/2021/07/22/I6PtxL.png) fixed top;background-size: 100%;">
|
||||
<view :style="{height:statusBarHeight+'px'}"></view>
|
||||
<view class="padding-z20 disac width100 navBarH" :style="{background:backgroudColor}">
|
||||
<!-- 标题 -->
|
||||
<view class="tab-title titlec" style="color:#ffffff;">登锐商城</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 搜索框、消息 -->
|
||||
<view class="margin-zy20 disba" :style="{paddingTop:statusHNH+'px'}">
|
||||
<view class="searchRadius disac ptwo-input-box">
|
||||
<image class="searcht margin-z20" src="/static/img/pageh/sousuo.png"></image>
|
||||
<input @tap="inputFocus" disabled class="margin-z10 fon26 colorh width100" placeholder="搜索的内容" placeholder-class="searchpla"
|
||||
type="text" />
|
||||
</view>
|
||||
<!-- <image @tap="goNotices" class="xiaox margin-y10 flexs" src="/static/img/pageh/xiaoxi.png"></image> -->
|
||||
</view>
|
||||
<view class="margin20">
|
||||
<!-- banner轮播 -->
|
||||
<view class="radius10">
|
||||
<swiper class="banner-box" :indicator-color="'#f9f9f9'" :indicator-active-color="'#1c4593'"
|
||||
:indicator-dots="true" :easing-function="'easeOutCubic'" :autoplay="true" :interval="3000"
|
||||
:circular="true" :duration="1000">
|
||||
<swiper-item v-if="bannerList.length!=0" v-for="(item,index) in bannerList" :key="index">
|
||||
<view class="swiper-item">
|
||||
<image class="width100 banner-box radius10" :src="item.src" mode="aspectFill"></image>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
<!-- 公告 -->
|
||||
<view class="margin-sx20 disac zIn4" style="position: relative;">
|
||||
<view class="disac flexs">
|
||||
<image class="gimg" src="/static/img/pageh/gonggao.png" mode=""></image>
|
||||
<view class="fon26 gtitle margin-z10"><i>小程序公告:</i></view>
|
||||
</view>
|
||||
<view class="disba width100">
|
||||
<view class="fon24 color6 margin-zy20 width100">
|
||||
<!-- <marquee direction="left" align="absmiddle" scrollamount="5">新品上市百雀明媚羚眼霜限时促销霜限时促销霜限时促销</marquee> -->
|
||||
<lwNotice @dangGao="dangGao" :list="advanceListTwo"></lwNotice>
|
||||
</view>
|
||||
<view @tap="goNotices" class="fon24 color9 margin-y20 flexs">更多</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 热门产品,限时补贴 -->
|
||||
<view class="discc width100 textc" style="background: url(https://s3.jpg.cm/2021/07/22/I6P1IW.png) no-repeat;background-size: 100% 100%;">
|
||||
<view class="fon36 colorb bold margin-s40 disbcac">
|
||||
<image class="reba" src="/static/img/pageh/rebefore.png"></image>
|
||||
<view class="margin-zy20">厂家送红包 购100送70</view>
|
||||
<image class="reba" src="/static/img/pageh/reaffter.png"></image>
|
||||
</view>
|
||||
<view class="fon24 colorb margin-sx20 discc">
|
||||
<view class="zIn1">红包可提现,也可分次购货</view>
|
||||
<view class="tiao"></view>
|
||||
</view>
|
||||
<view class="fon24 margin-x20" style="color: rgba(255,255,255,.7);">商城产品低于市场价70%,红包可选择长期分红更划算</view>
|
||||
<view class="reboxre margin-zy20 margin-x20" style="width: 94%;" v-for="(itemre,indexre) in zanReArrImg" :key="indexre">
|
||||
<image class="radius10" @tap="goReDetail(itemre.link)" style="width: 100%;height: 342rpx;" mode="aspectFill" :src="itemre.src"></image>
|
||||
</view>
|
||||
<!-- <view class="radius10 disba rebox margin-zy20 margin-x20" v-for="(itemre,indexre) in reArr" :key="indexre">
|
||||
<image v-if="indexre%2==0" class="flexs reimg" :src="itemre.src"></image>
|
||||
<view class="disbc width100 flw margin-sf30">
|
||||
<view class="fon26 color26">{{itemre.title}}</view>
|
||||
<view class="fon36 color26 bold margin-sx10">{{itemre.miaoone}}</view>
|
||||
<view class="fon24 color26">{{itemre.miaotwo}}</view>
|
||||
<view class="btnradius fon24 colorb rebtn margin-s20">
|
||||
惊喜价:¥<span class="fon36 blod">{{itemre.price}}</span>.00
|
||||
</view>
|
||||
</view>
|
||||
<image v-if="indexre%2!=0" class="flexs reimg" :src="itemre.src"></image>
|
||||
</view> -->
|
||||
</view>
|
||||
<!-- 分类列表 -->
|
||||
<view class="width100">
|
||||
<!-- 分类 -->
|
||||
<scroll-view scroll-x="true" style="height: 80rpx;">
|
||||
<view class="disba margin20 catebox">
|
||||
<view @tap="chooseCate(item.id,index)" :class="current==index?'pactive':'pmo'" class="disac flexs"
|
||||
v-for="(item,index) in cateList" :key="index">{{item.name}}<view class="pxian"></view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<!-- 列表 -->
|
||||
<!-- @addChe="addChe" -->
|
||||
<twocoluList :dataList="dataList"></twocoluList>
|
||||
<!-- 更多 -->
|
||||
<view v-if="gisok" class="margin-sx26 textc color9 fon26">{{gcontent}}</view>
|
||||
</view>
|
||||
<backTop :showTop="showTop" @backTop="backTop"></backTop>
|
||||
<!-- <footTab></footTab> -->
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import twocoluList from '@/components/twocoluList.vue';
|
||||
import backTop from '@/components/backTop.vue';
|
||||
import lwNotice from '@/components/lw-notice/lw-notice.vue';
|
||||
import footTab from '@/components/footTab.vue';
|
||||
export default {
|
||||
components:{
|
||||
twocoluList,
|
||||
backTop,
|
||||
lwNotice,
|
||||
footTab
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
statusBarHeight:uni.getSystemInfoSync().statusBarHeight,
|
||||
bannerList: [],
|
||||
// cateList:['轮胎轮毂','车载电器','雨刮器','机油养护','汽车配件'],
|
||||
cateList:[{
|
||||
id:'',
|
||||
name:'全部',
|
||||
pid:'',
|
||||
hasChildren:''
|
||||
}],
|
||||
current:0,
|
||||
dataList:[],
|
||||
gcontent:'暂无更多',//更多文本
|
||||
gisok:false,//判断更多是否出现
|
||||
showTop:false,
|
||||
advanceListTwo:[],//公告内容列表
|
||||
advanceListInfo:[],//公告所有信息
|
||||
// reArr:[
|
||||
// {src:'/static/img/pageh/reone.jpg',title:'/凌度BLACKVIEW/',miaoone:'行车记录仪前后双录',miaotwo:'全屏流媒体后视镜倒车影像',price:'459'},
|
||||
// {src:'/static/img/pageh/retwo.jpg',title:'/凌度BLACKVIEW/',miaoone:'行车记录仪前后双录',miaotwo:'全屏流媒体后视镜倒车影像',price:'459'},
|
||||
// ],
|
||||
zanReArrImg:[],
|
||||
cid:0,
|
||||
page:1,
|
||||
size:10,
|
||||
total:'',
|
||||
isZanw:true,
|
||||
statusHNH:uni.getStorageSync('statusHNH'),
|
||||
pageShow:false
|
||||
};
|
||||
},
|
||||
onReachBottom() {
|
||||
if(this.total!=this.dataList.length){
|
||||
this.page++
|
||||
this.checkList()//调用自主预约列表事件
|
||||
} else {
|
||||
if(this.isZanw) this.$toolAll.tools.showToast('暂无更多商品列表','none',1000)
|
||||
this.isZanw = false
|
||||
}
|
||||
},
|
||||
onPageScroll(e) {
|
||||
e.scrollTop > 360 ? this.showTop = true : this.showTop = false
|
||||
},
|
||||
onShow() {
|
||||
if(uni.getStorageSync('is_active')!='' && uni.getStorageSync('is_active')!=0) this.$toolAll.tools.guoq()
|
||||
uni.showTabBar()
|
||||
},
|
||||
onLoad(options) {
|
||||
const query = wx.createSelectorQuery().in(this)
|
||||
query.select('.statusHNH').boundingClientRect((rect) => {
|
||||
// console.log('rect.height',rect)
|
||||
uni.setStorageSync('statusHNH',rect.height)
|
||||
this.statusHNH = rect.height
|
||||
}).exec()
|
||||
var _this = this;
|
||||
// 微信扫码后会自动编码,所以需要解码
|
||||
if (options && options.q) {
|
||||
let arr = decodeURIComponent(options.q).split('?')[1].split('&')
|
||||
let obj = {}
|
||||
arr.forEach(item => {
|
||||
let brr = item.split('=')
|
||||
obj[brr[0]] = brr[1]
|
||||
})
|
||||
// console.log(obj) //得到参数组成的对象
|
||||
uni.setStorageSync('invite_code',obj.invite_code)
|
||||
}
|
||||
this.title = this.dengrui
|
||||
this.bannerEv()//查询轮播
|
||||
this.requestGao()//查询公告
|
||||
this.reMen()//查询热门产品
|
||||
this.shaiEv()//查询商品分类
|
||||
this.checkList()//商品列表查询事件
|
||||
},
|
||||
methods: {
|
||||
shaiEv(){//商品分类查询事件
|
||||
this.$requst.post('product/spu/category').then(res=>{
|
||||
// console.log('筛选',res);
|
||||
if(res.data.length!=0){
|
||||
res.data.forEach(item=>{
|
||||
let obj = {
|
||||
id:item.id,
|
||||
name:item.name,
|
||||
pid:item.pid,
|
||||
hasChildren:item.hasChildren
|
||||
}
|
||||
this.cateList.push(obj)
|
||||
})
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
bannerEv(){// 查询轮播图片事件
|
||||
let paramsBanner = {
|
||||
position:'home_banner'
|
||||
}
|
||||
this.$requst.post('slide/index',paramsBanner).then(res => {
|
||||
// console.log('轮播图===>',res);
|
||||
if(res.data.length!=0){
|
||||
this.pageShow = true
|
||||
res.data.forEach(item=>{
|
||||
let obj = {
|
||||
src:this.$http+item.src,
|
||||
alt:item.alt,
|
||||
link:item.link,
|
||||
time:item.time
|
||||
}
|
||||
this.bannerList.push(obj)
|
||||
})
|
||||
}
|
||||
},error => {})
|
||||
},
|
||||
goReDetail(urlre){// 去热门详情
|
||||
uni.navigateTo({
|
||||
url:urlre
|
||||
})
|
||||
},
|
||||
reMen(){//查询热门
|
||||
this.$requst.post('slide/index',{position:'home_promote'}).then(res => {
|
||||
// console.log('热门===>',res);
|
||||
if(res.data.length!=0){
|
||||
res.data.forEach(item=>{
|
||||
let zanObj = {
|
||||
alt: item.alt,
|
||||
desc: item.desc,
|
||||
link: item.link,
|
||||
src: this.$http+item.src,
|
||||
time: item.time
|
||||
}
|
||||
this.zanReArrImg.push(zanObj)
|
||||
// let obj = {
|
||||
// src:this.$http+item.src,
|
||||
// title:item.alt,
|
||||
// miaoone:item.link,
|
||||
// miaotwo:item.time,
|
||||
// price:item.price
|
||||
// }
|
||||
// this.reArr.push(obj)
|
||||
})
|
||||
}
|
||||
},error => {})
|
||||
},
|
||||
requestGao(){//查询公告列表
|
||||
var paramsGao = {
|
||||
size:0
|
||||
}
|
||||
this.$requst.post('article/announcement/topList',paramsGao).then(res => {
|
||||
// console.log(res);
|
||||
if(res.data.list.length!=0){
|
||||
res.data.list.forEach(item=>{
|
||||
this.advanceListTwo.push(item.title)
|
||||
})
|
||||
this.advanceListInfo = res.data.list
|
||||
}
|
||||
},error => {})
|
||||
},
|
||||
backTop(){
|
||||
uni.pageScrollTo({
|
||||
scrollTop: 0,
|
||||
duration: 300
|
||||
});
|
||||
},
|
||||
chooseCate(id,e){
|
||||
this.current = e
|
||||
if(id=='') this.cid = 0
|
||||
else this.cid = id
|
||||
this.page = 1
|
||||
this.isZanw = true
|
||||
this.checkList()
|
||||
},
|
||||
checkList(){
|
||||
let paramCate ={
|
||||
category_id:this.cid,
|
||||
page:this.page,
|
||||
size:this.size,
|
||||
sort_filed:'synthetical',//排序字段。“synthetical”综合推荐
|
||||
sort_direction:'down'//排序方向。【down 由大到小|up 由小到大】
|
||||
}
|
||||
this.$requst.post('product/spu/list',paramCate).then(res=>{
|
||||
// console.log('产品',res);
|
||||
if(this.page==1) this.dataList = []
|
||||
if(res.data.list.length!=0){
|
||||
this.total = res.data.total
|
||||
// this.cid = res.data.list[0].cid//获取分类ID,以便加载更多使用
|
||||
this.zanList = res.data.list
|
||||
res.data.list.forEach(item=>{
|
||||
let cateObj = {
|
||||
id:item.main_sku.id,//商品ID
|
||||
spu_id:item.id,
|
||||
src:this.$http + item.main_sku.main_image,//商品图片
|
||||
title:item.name,//商品名称
|
||||
content:item.sub_title,//商品标题
|
||||
cate:item.tag_list,//标签列表
|
||||
price:item.main_sku.cur_price/100//商品原价
|
||||
}
|
||||
this.dataList.push(cateObj)
|
||||
})
|
||||
} else {
|
||||
// this.$toolAll.tools.showToast('没找到相关产品o(╥﹏╥)o')
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
// addChe(e){//加入购物车事件
|
||||
// console.log('加入购物车:'+e)
|
||||
// },
|
||||
dangGao(e){//跳转到公告详情
|
||||
uni.setStorageSync('noticeInfo',this.advanceListInfo[e])
|
||||
uni.navigateTo({
|
||||
url:'/pagesB/noticesDetail/noticesDetail?index=2'
|
||||
})
|
||||
},
|
||||
goNotices(){//跳转到公告列表
|
||||
uni.navigateTo({
|
||||
url:'/pagesB/notices/notices'
|
||||
})
|
||||
},
|
||||
inputFocus(){//搜索框获取焦点跳转产品页
|
||||
wx.hideKeyboard()
|
||||
uni.navigateTo({
|
||||
url:'/pagesB/keySearch/keySearch'
|
||||
})
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
|
@ -0,0 +1,748 @@
|
|||
<template>
|
||||
<view class="posir">
|
||||
<!-- 背景图 -->
|
||||
<image class="zIn1 posiall mybei" :style="{width:newWidth+'px',height:newHeight+'px'}"
|
||||
src="/static/img/my/myb.png" mode="scaleToFill"></image>
|
||||
<view :style="{height:(statusBarHeight+50)+'px'}"></view>
|
||||
<!-- 内容框 -->
|
||||
<view class="posia zIn2 width100">
|
||||
<view class="disba padding20" style="margin: 0 20rpx 20rpx 20rpx;">
|
||||
<view class="disac width100">
|
||||
<!-- 头像 -->
|
||||
<image class="flexs myhead" :src="headImg" mode="aspectFill"></image>
|
||||
<view class="margin-z20 width100">
|
||||
<view class="colorb fon36 bold disba ">
|
||||
<!-- 姓名 -->
|
||||
<view class="clips1" style="max-width: 320rpx;">{{name}}</view>
|
||||
<!-- 消息 -->
|
||||
<!-- <view class="posir" @tap="checkMess">
|
||||
<image class="myxiaoimg" src="/static/img/my/xiaoximg.png" mode="aspectFill"></image>
|
||||
<view class="posia colorb disbcac fon24 myxiaoc">{{message}}</view>
|
||||
</view> -->
|
||||
</view>
|
||||
<!-- 电话 -->
|
||||
<view v-if="phone!=''" class="fon24 disbcac padding-zy10 margin-s20 myphone">{{phone}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="disaa padding-zy20" style="margin-top: -10rpx;">
|
||||
<!-- 我的收藏 -->
|
||||
<view class="discc" @tap="ziliao(0)">
|
||||
<view class="colorb fon36 bold">{{allCollection}}</view>
|
||||
<view class="fon24 colorb">我的收藏</view>
|
||||
</view>
|
||||
<!-- 个人资料 -->
|
||||
<view class="discc" @tap="ziliao(1)">
|
||||
<image style="width: 31rpx;height: 35rpx;" src="/static/img/my/deit.png" mode=""></image>
|
||||
<view class="fon24 colorb margin-s10">个人资料</view>
|
||||
</view>
|
||||
<!-- 个人邀请码 -->
|
||||
<view class="discc" @tap="ziliao(2)">
|
||||
<image style="width: 37rpx;height: 37rpx;" src="/static/img/my/ecode.png" mode=""></image>
|
||||
<view class="fon24 colorb margin-s10">个人邀请码</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- -->
|
||||
<view class="margin20">
|
||||
<!-- 收益 -->
|
||||
<view class="disaa colorb padding-sx20 "
|
||||
style="background-color: #293140;border-top-left-radius: 10rpx;border-top-right-radius: 10rpx;">
|
||||
<view @tap="goShouy(indexs)" class="discc flexs" v-for="(item,indexs) in shouArr" :key="indexs"
|
||||
style="width: 25%;">
|
||||
<!-- <view class="disac">
|
||||
<view class="fon24">{{item.title}}</view>
|
||||
</view>
|
||||
<view class="fon32 bold margin-s10">{{item.sprice}}</view> -->
|
||||
<view v-if="item.price!=''" class="fon24 disba">
|
||||
{{item.title}}
|
||||
<!-- <image @tap.stop="zhuan(indexs)" v-if="item.title=='分红收益' || item.title=='可提现'" class="margin-z10" style="width: 19rpx;height: 19rpx;" src="../../../static/img/my/tis.png" mode=""></image> -->
|
||||
</view>
|
||||
<view v-if="item.price!=''" class="fon32 bold margin-s10 clips1">{{item.price}}</view>
|
||||
<view v-else class="fon28 colorb padding-sx10 padding-zy20 textc"
|
||||
style="width: 130rpx;height: 45rpx;line-height: 45rpx; background-color: #1b60d6;border-radius: 50rpx;margin-right: 16rpx;">
|
||||
{{item.title}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 提现类 -->
|
||||
<view class="disaa padding-sx20 bacb"
|
||||
style="border-bottom-left-radius: 10rpx;border-bottom-right-radius: 10rpx;">
|
||||
<view @tap="clickt(indext)" class="discc flexs" v-for="(item,indext) in tiArr" :key="indext"
|
||||
style="width: 25%;">
|
||||
<view v-if="item.price!=''" class="fon24">{{item.title}}</view>
|
||||
<view v-if="item.price!=''" :class="indext==2?'colorb':''" class="fon32 bold margin-s10 clips1">
|
||||
{{item.price}}</view>
|
||||
<view v-else class="fon28 colorb padding-sx10 padding-zy20 textc"
|
||||
style="width: 130rpx;height: 45rpx;line-height: 45rpx; background-color: #1b60d6;border-radius: 50rpx;margin-right: 16rpx;">
|
||||
{{item.title}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 我的订单 -->
|
||||
<view class="margin20 bacb radius10">
|
||||
<view class="disba padding20 margin-zy10">
|
||||
<view class="fon32 bold">我的订单</view>
|
||||
<view class="disac" @tap="checkAll">
|
||||
<view class="fon26 color9 margin-y10">查看全部订单</view>
|
||||
<image style="width: 12rpx;height: 22rpx;" src="../../../static/img/my/youj.png" mode="">
|
||||
</image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="borbot"></view>
|
||||
<view class="disaa padding-sx20">
|
||||
<view @tap="goOrder(index)" class="discc" v-for="(item,index) in cateOder" :key="index">
|
||||
<image style="width: 38rpx;height: 38rpx;margin-top: 10rpx;" :src="item.src"></image>
|
||||
<view class="margin-s10 margin-x10 color33 fon24">{{item.title}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 常用工具 -->
|
||||
<view class="margin20 bacb radius10">
|
||||
<view class="disba padding20 margin-zy10">
|
||||
<view class="fon32 bold">常用工具</view>
|
||||
</view>
|
||||
<view class="borbot"></view>
|
||||
<view class="disac padding-sx20 flw ">
|
||||
<view class="discc posir" @tap="goUtils(index)" v-for="(item,index) in useArr" :key="index"
|
||||
style="width: 25%;">
|
||||
<image class="margin-s20 mygong" :src="item.src"></image>
|
||||
<view class="margin-s10 margin-x10 color33 fon24">{{item.title}}</view>
|
||||
<button v-if="index==2" class="posia" style="opacity: 0;" open-type="contact" bindcontact="huik">客服</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 个人邀请码弹框 -->
|
||||
<view v-if="isMa" @touchmove.stop.prevent="" class="disbcac"
|
||||
style="position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: 100;background-color: rgba(0,0,0,.8);">
|
||||
<view class="padding20 tan-box">
|
||||
<view class="disbcac" style="margin-top: -60rpx;">
|
||||
<image src="/static/img/my/yaof.png" style="width: 96rpx;height: 96rpx;" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="">
|
||||
<!-- <image class="margin20" style="width: 559rpx;height: 369rpx;" src="/static/img/my/yaoimg.png" mode="aspectFit"></image> -->
|
||||
<image :src="share_img" class="radius20 margin20" style="width: 559rpx;height: 369rpx;"></image>
|
||||
<view class="fon32 margin-zy20 padding-zy10 textc ">{{share_title}}</view>
|
||||
</view>
|
||||
<view class="borbot margin-sx26"></view>
|
||||
<view class="discc padding-x40">
|
||||
<!-- 二维码 -->
|
||||
<!-- <view class="disbcac">
|
||||
<canvas @longpress="longpress" class='qrcode-canvas' @click="previewImage" canvas-id='qrcode'></canvas>
|
||||
</view> -->
|
||||
<image @longpress="longpress" @tap="previewImage" style="width: 165rpx;height: 165rpx;" :src="logoImg" mode="aspectFit"></image>
|
||||
<view class="fon24 color9" style="transform: scale(0.9);">长按或扫描查看</view>
|
||||
</view>
|
||||
<view class="posir disbcac">
|
||||
<image @tap="closema" class="posia" style="width: 70rpx;height: 70rpx;top: 60rpx;"
|
||||
src="/static/img/my/maclose.png" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 功能弹框 -->
|
||||
<view v-if="showScan" class="discc animated bounceInUp fon28"
|
||||
style="position: fixed;bottom: 20rpx;left: 20rpx;right: 20rpx;background-color: #FFFFFF;padding: 20rpx 0;border-radius: 6rpx;z-index: 110;">
|
||||
<view @tap="scan" class="colorf78 padding-x20 borbot width100 textc">扫一扫</view>
|
||||
<view @tap="dosave" class="color33 padding-s20">保存到相册</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 分红收益转化弹框 -->
|
||||
<view v-if="isInput" class="posiall disbcac" style="background-color: rgba(0,0,0,.5);z-index: 1002;">
|
||||
<view :class="isClose ? '':'bounceOut'" class="animated bounceIn" style="background-color: #FFFFFF;width: 70%;padding: 20rpx;border-radius: 10rpx;">
|
||||
<view style="font-size: 28rpx;">当前可转分红收益:{{xtitle}}</view>
|
||||
<view v-if="indexd==3" v-for="(itemd,indexd) in drawRule" :key="indexd" class="disac borbot padding-sx20">
|
||||
<view class="fon28">{{itemd.title}}:</view>
|
||||
<view class="fon24 color9">{{itemd.desc}}</view>
|
||||
</view>
|
||||
<input :focus="isfocus" type="number" v-model="inputVal" style="border: 1rpx solid #dddddd;border-radius: 10rpx;padding: 10rpx 20rpx;" />
|
||||
<view style="margin-top: 20rpx;display: flex;justify-content: space-between;align-items: center;font-size: 28rpx;">
|
||||
<view @tap="closeT" class="color9 width100" style="text-align: center;">取消</view>
|
||||
<view @tap="submit" class="colorf78 width100"style="text-align: center;">确认</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 提现规则 -->
|
||||
<view v-if="isGui" @tap="isGui=false" class="posiall disbcac" style="background-color: rgba(0,0,0,.5);z-index: 1002;">
|
||||
<view class="" style="background-color: #FFFFFF;width: 70%;padding: 20rpx;border-radius: 10rpx;">
|
||||
<view v-if="indexd!=3" v-for="(itemd,indexd) in drawRule" :key="indexd" class="disac borbot padding-sx20">
|
||||
<view class="fon28">{{itemd.title}}:</view>
|
||||
<view class="fon24 color9">{{itemd.desc}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
let QRCode = require('../../../jsFile/qrcode.js').default;
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
statusBarHeight: uni.getSystemInfoSync().statusBarHeight,
|
||||
navigationBarHeight: uni.getSystemInfoSync().navigationBarHeight,
|
||||
newWidth: uni.getSystemInfoSync().windowWidth,
|
||||
newHeight: uni.getSystemInfoSync().windowHeight,
|
||||
headImg: '/static/img/my/myhead.png',
|
||||
name: '',
|
||||
phone: '',
|
||||
message: '99',
|
||||
shouArr: [
|
||||
{title: '分红收益',price: '0.00'},
|
||||
{title: '可提现',price: '0.00'},
|
||||
{title: '提现中',price: '0.00'},
|
||||
{title: '立即提现',price: ''},
|
||||
],
|
||||
tiArr: [
|
||||
{title: '直卖收益',price: '0.00'},
|
||||
{title: '提现中',price: '0.00'},
|
||||
{title: '',price: '0.00'},
|
||||
{title: '立即提现',price: ''},
|
||||
],
|
||||
cateOder: [
|
||||
{src: '/static/img/my/fah.png',title: '待发货'},
|
||||
{src: '/static/img/my/daif.png',title: '待收货'},
|
||||
{src: '/static/img/my/pingj.png',title: '待评价'},
|
||||
{src: '/static/img/my/shouh.png',title: '售后'},
|
||||
],
|
||||
useArr: [
|
||||
{src: '/static/img/my/pingt.png',title: '平台说明'},
|
||||
{src: '/static/img/my/hez.png',title: '商务合作'},
|
||||
{src: '/static/img/my/kef.png',title: '在线客服'},
|
||||
{src: '/static/img/my/diz.png',title: '地址管理'},
|
||||
{src: '/static/img/my/wenj.png',title: '分红规则'},
|
||||
],
|
||||
isMa: false,
|
||||
qRcode: '/static/img/my/ma.png',
|
||||
showScan: false,
|
||||
allCollection: '0', //收藏总数
|
||||
share_img: '',
|
||||
share_title: '',
|
||||
QR: '',
|
||||
qrtext: '',
|
||||
canvasId: 'qrcode',
|
||||
logoImg: '',
|
||||
colorData: '#000000',
|
||||
invite_code:'',
|
||||
inputVal:'',
|
||||
isInput:false,
|
||||
isClose:true,
|
||||
isfocus:false,
|
||||
xtitle:'',
|
||||
drawRule:[],
|
||||
isGui:false
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
let res = uni.getSystemInfoSync();
|
||||
var that = this;
|
||||
that.canvasWidth = res.windowWidth * 350 / 750;
|
||||
that.canvasHeight = res.windowWidth * 350 / 750;
|
||||
let qrcode = new QRCode(this.canvasId, {
|
||||
width: 110,
|
||||
height: 110,
|
||||
});
|
||||
this.QR = qrcode;
|
||||
},
|
||||
onShow() {
|
||||
if(uni.getStorageSync('is_active')==0) {
|
||||
this.$toolAll.tools.showToast('您目前是游客,请授权登录')
|
||||
setTimeout(()=>{
|
||||
uni.navigateTo({url:'/pages/login/login'})
|
||||
},1500)
|
||||
} else {
|
||||
// 查询收藏数量
|
||||
this.checkCollection()
|
||||
this.userInfo()//调用获取用户信息事件
|
||||
this.isGui = false
|
||||
this.isInput = false
|
||||
this.inputVal = ''
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
zhuan(index){//调起转换分红收益弹框
|
||||
if(index==0){
|
||||
this.isInput = true
|
||||
this.isfocus = true
|
||||
this.xtitle = this.shouArr[0].price
|
||||
} else {
|
||||
this.isGui = true
|
||||
}
|
||||
this.checkTG()
|
||||
},
|
||||
closeT(){//关闭分红收益转化弹框
|
||||
this.tankClose()
|
||||
},
|
||||
submit(){//分红收益转化确认事件
|
||||
if(uni.getStorageSync('sm').name=='' || uni.getStorageSync('sm').phone){
|
||||
this.$toolAll.tools.showToast('请前往个人资料完善信息')
|
||||
} else if(this.inputVal==0){
|
||||
this.tankClose()
|
||||
} else if(0<this.inputVal<1){
|
||||
this.$toolAll.tools.showToast('最小转换金额不得低于1元')
|
||||
} else if(this.inputVal>this.xtitle) {
|
||||
this.$toolAll.tools.showToast('转换金额不得大于可转金额')
|
||||
} else {
|
||||
this.$requst.post('user/bonus-to-balance',{amount:this.inputVal*100}).then(res=>{
|
||||
if(res.code==0){
|
||||
this.$toolAll.tools.showToast('转换成功,可在可提现查看')
|
||||
this.shouArr[1].price = this.inputVal
|
||||
this.tankClose()
|
||||
}
|
||||
},error=>{})
|
||||
}
|
||||
},
|
||||
tankClose(){
|
||||
let ya = this
|
||||
ya.isfocus = false
|
||||
ya.isClose = false
|
||||
setTimeout(function(){
|
||||
ya.isInput = false
|
||||
ya.isClose = true
|
||||
ya.xtitle = ''
|
||||
ya.inputVal = ''
|
||||
},1000)
|
||||
},
|
||||
// 查询提现规则
|
||||
checkTG(){
|
||||
this.$requst.post('user/withdraw-rule').then(res=>{
|
||||
// console.log(res);
|
||||
if(res.code==0){
|
||||
this.drawRule = res.data
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
// 个人邀请码的logo图事件
|
||||
logoEv(){
|
||||
// this.$requst.post('user/qrcode').then(res=>{
|
||||
// if(res.code==0){
|
||||
// this.logoImg = res.data.qrcode
|
||||
// }
|
||||
// },error=>{})
|
||||
this.$requst.post('user/qrcode-original').then(res=>{
|
||||
if(res.code==0){
|
||||
this.logoImg = res.data.qrcode
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
createQRCode: function() {
|
||||
var that = this;
|
||||
that.doCreateQRCode();
|
||||
},
|
||||
doCreateQRCode: function() {
|
||||
uni.showToast({
|
||||
title: '邀请码生成中...',
|
||||
icon:'loading'
|
||||
});
|
||||
|
||||
this.QR.clear();
|
||||
this.QR._opts.colorDark = this.colorData;
|
||||
this.QR._opts.logo = this.logoImg;
|
||||
this.QR._opts.successTips = true;
|
||||
this.QR.makeCode(this.qrtext);
|
||||
this.createQRCodeDone = true;
|
||||
},
|
||||
savePic: function() {
|
||||
let that = this;
|
||||
uni.saveImageToPhotosAlbum({
|
||||
filePath: that.logoImg,
|
||||
success(res) {
|
||||
uni.showToast({
|
||||
title: '已保存相册',
|
||||
icon: 'success',
|
||||
duration: 1000
|
||||
});
|
||||
},
|
||||
fail(res) {
|
||||
uni.showToast({
|
||||
title: '无相册权限',
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
});
|
||||
// let res = uni.getSystemInfoSync();
|
||||
// uni.canvasToTempFilePath({
|
||||
// x: 0,
|
||||
// y: 0,
|
||||
// width: 110,
|
||||
// height: 110,
|
||||
// destWidth: 110,
|
||||
// destHeight: 110,
|
||||
// canvasId: this.canvasId,
|
||||
// success(res) {
|
||||
// uni.saveImageToPhotosAlbum({
|
||||
// filePath: res.tempFilePath,
|
||||
// success(res) {
|
||||
// uni.showToast({
|
||||
// title: '已保存相册',
|
||||
// icon: 'success',
|
||||
// duration: 1000
|
||||
// });
|
||||
// },
|
||||
// fail(res) {
|
||||
// uni.showToast({
|
||||
// title: '无相册权限',
|
||||
// icon: 'none',
|
||||
// duration: 2000
|
||||
// });
|
||||
// }
|
||||
// });
|
||||
// }
|
||||
// });
|
||||
},
|
||||
previewImage(e) {
|
||||
uni.previewImage({
|
||||
urls: [this.logoImg],
|
||||
})
|
||||
// if (this.createQRCodeDone) {
|
||||
// uni.canvasToTempFilePath({
|
||||
// x: 0,
|
||||
// y: 0,
|
||||
// width: this.canvasWidth,
|
||||
// height: this.canvasHeight,
|
||||
// destWidth: 472,
|
||||
// destHeight: 472,
|
||||
// canvasId: this.canvasId,
|
||||
// success(res) {
|
||||
// console.log(res.tempFilePath);
|
||||
// uni.previewImage({
|
||||
// urls: [res.tempFilePath],
|
||||
// })
|
||||
// }
|
||||
// });
|
||||
// }
|
||||
},
|
||||
checkCollection() {
|
||||
this.$requst.post('user/collection', {
|
||||
page: 1,
|
||||
size: 200
|
||||
}).then(res => {
|
||||
// console.log('获取收藏总数:',res);
|
||||
if (res.code == 0) {
|
||||
this.allCollection = res.data.length
|
||||
}
|
||||
}, error => {})
|
||||
},
|
||||
userInfo() { //查询用户信息
|
||||
this.$requst.post('user/info').then(res => {
|
||||
// console.log('信息=====>', res);
|
||||
if (res.code == 0) {
|
||||
let info = res.data
|
||||
this.name = info.nickname
|
||||
this.headImg = info.headimgurl
|
||||
uni.setStorageSync('sm',{name:info.username,phone:info.mobile})
|
||||
this.share_img = this.$http + info.share_img
|
||||
this.share_title = info.share_title
|
||||
this.qrtext = info.invite_url
|
||||
// this.qrtext = '/pages/login/login?invite_code='+info.invite_code
|
||||
this.invite_code = info.invite_code
|
||||
// this.logoImg = info.headimgurl
|
||||
// console.log(this.logoImg,this.qrtext);
|
||||
info.bonus == 0 ? this.shouArr[0].price = '0.00' : this.shouArr[0].price = (info.bonus/100).toFixed(2) //分红收益
|
||||
info.bonus_balance == 0 ? this.shouArr[1].price = '0.00' : this.shouArr[1].price = (info.bonus_balance / 100).toFixed(2) //分红可提现
|
||||
info.withdraw_bonus == 0 ? this.shouArr[2].price = '0.00' : this.shouArr[2].price = (info.withdraw_bonus / 100).toFixed(2) //分红提现中
|
||||
info.commission_balance == 0 ? this.tiArr[0].price = '0.00' : this.tiArr[0].price = (info.commission_balance / 100).toFixed(2) //直卖收益
|
||||
info.withdraw_sale == 0 ? this.tiArr[1].price = '0.00' : this.tiArr[1].price = (info.withdraw_sale / 100).toFixed(2) //直卖提现中
|
||||
if (info.mobile != '') {
|
||||
// 隐藏手机号中间四位
|
||||
this.phone = `${info.mobile.substr(0, 3)}****${info.mobile.substr(7)}`
|
||||
}
|
||||
uni.setStorageSync('userInfoObj', info)
|
||||
this.logoEv()
|
||||
}
|
||||
}, error => {})
|
||||
},
|
||||
longpress() {
|
||||
let _this = this;
|
||||
this.showScan = true
|
||||
// 判断平台
|
||||
// if (plus.os.name == 'Android') {
|
||||
// plus.runtime.launchApplication({
|
||||
// pname: 'com.tencent.mm'
|
||||
// },
|
||||
// function(e) {
|
||||
// console.log('Open system default browser failed: ' + e.message);
|
||||
// }
|
||||
// );
|
||||
// } else if (plus.os.name == 'iOS') {
|
||||
// plus.runtime.launchApplication({
|
||||
// action: 'weixin://'
|
||||
// }, function(e) {
|
||||
// console.log('Open system default browser failed: ' + e.message);
|
||||
// });
|
||||
// }
|
||||
},
|
||||
scan() {
|
||||
wx.scanCode({ // 微信扫码 调起客户端扫码界面进行扫码
|
||||
complete: (res) => {}, //接口调用结束的回调函数(调用成功、失败都会执行)
|
||||
fail: (res) => {}, //接口调用失败的回调函数
|
||||
onlyFromCamera: false, //是否只能从相机扫码,不允许从相册选择图片,这里是只允许相机扫码
|
||||
scanType: ['qrCode'], // scanType:扫码类型 : 二维码
|
||||
success: (result) => { // 接口调用成功的回调函数
|
||||
// console.log(result);
|
||||
wx.navigateTo({ //navigateTo:页面跳转 保留当前页面(页面隐藏,并未销毁,节省性能),跳转到应用内的某个页面。但是不能跳到 tabbar 页面 ,小程序使用页面跳转方法的时候 不能添加文件扩展名,否则会没有反应
|
||||
url: '/pages/login/login?invite_code='+this.invite_code,
|
||||
})
|
||||
wx.setStorage({ // 设置微信本地存储数据
|
||||
data: result,
|
||||
key: 'key',
|
||||
complete: (res) => {},
|
||||
fail: (res) => {},
|
||||
success: (res) => {},
|
||||
})
|
||||
}
|
||||
})
|
||||
// plus.barcode.scan(this.qRcode, (type, res) => {
|
||||
// if (type == 0) {
|
||||
// plus.runtime.openURL(res)
|
||||
// }
|
||||
// }, (e) => {
|
||||
// if (e.code == 3) {
|
||||
// tools.showToast('未识别到二维码')
|
||||
// } else {
|
||||
// tools.showToast('无法识别此图片')
|
||||
// }
|
||||
// })
|
||||
},
|
||||
async requestAndroidPermission(permisionID) {
|
||||
var result = await permision.requestAndroidPermission(permisionID)
|
||||
var strStatus
|
||||
if (result == 1) {
|
||||
strStatus = '已获得授权'
|
||||
this.savePic()
|
||||
} else if (result == 0) {
|
||||
strStatus = '未获得授权'
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '保存失败,请打开权限功能重试',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
},
|
||||
dosave() {
|
||||
// this.savePic()
|
||||
var aa = wx.getFileSystemManager();
|
||||
aa.writeFile({
|
||||
filePath:wx.env.USER_DATA_PATH+'/test.png',
|
||||
data: this.logoImg.slice(22),
|
||||
encoding:'base64',
|
||||
success: res => {
|
||||
wx.saveImageToPhotosAlbum({
|
||||
filePath: wx.env.USER_DATA_PATH + '/test.png',
|
||||
success: function (res) {
|
||||
wx.showToast({
|
||||
title: '保存成功',
|
||||
})
|
||||
},
|
||||
fail: function (err) {
|
||||
// console.log(err)
|
||||
}
|
||||
})
|
||||
// console.log(res)
|
||||
}, fail: err => {
|
||||
// console.log(err)
|
||||
}
|
||||
})
|
||||
// wx.downloadFile({
|
||||
// url: this.logoImg,//图片地址
|
||||
// success: function (res) {
|
||||
// console.log(res);
|
||||
// //图片保存到本地
|
||||
// wx.saveImageToPhotosAlbum({
|
||||
// filePath: res.tempFilePath,
|
||||
// success: function (data) {
|
||||
// wx.hideLoading()
|
||||
// wx.showModal({
|
||||
// title: '提示',
|
||||
// content: '您的二维码已保存到相册,赶快识别二维码添加小易进行咨询吧',
|
||||
// showCancel: false,
|
||||
// })
|
||||
// },
|
||||
// fail: function (err) {
|
||||
// if (err.errMsg === "saveImageToPhotosAlbum:fail:auth denied" || err.errMsg === "saveImageToPhotosAlbum:fail auth deny" || err.errMsg === "saveImageToPhotosAlbum:fail authorize no response") {
|
||||
// // 这边微信做过调整,必须要在按钮中触发,因此需要在弹框回调中进行调用
|
||||
// wx.showModal({
|
||||
// title: '提示',
|
||||
// content: '需要您授权保存相册',
|
||||
// showCancel: false,
|
||||
// success: modalSuccess => {
|
||||
// wx.openSetting({
|
||||
// success(settingdata) {
|
||||
// console.log("settingdata", settingdata)
|
||||
// if (settingdata.authSetting['scope.writePhotosAlbum']) {
|
||||
// wx.showModal({
|
||||
// title: '提示',
|
||||
// content: '获取权限成功,再次点击图片即可保存',
|
||||
// showCancel: false,
|
||||
// })
|
||||
// } else {
|
||||
// wx.showModal({
|
||||
// title: '提示',
|
||||
// content: '获取权限失败,将无法保存到相册哦~',
|
||||
// showCancel: false,
|
||||
// })
|
||||
// }
|
||||
// },
|
||||
// fail(failData) {
|
||||
// console.log("failData", failData)
|
||||
// },
|
||||
// complete(finishData) {
|
||||
// console.log("finishData", finishData)
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
// },
|
||||
// complete(res) {
|
||||
// wx.hideLoading()
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
// })
|
||||
},
|
||||
checkMess() {
|
||||
// console.log('查看消息');
|
||||
uni.navigateTo({
|
||||
url: '/pagesB/notices/notices?index=1'
|
||||
})
|
||||
},
|
||||
ziliao(index) {
|
||||
// console.log(index);
|
||||
switch (index) {
|
||||
case 0: //我的收藏
|
||||
uni.navigateTo({
|
||||
url: '/pagesB/myCollection/myCollection?index=1'
|
||||
})
|
||||
break;
|
||||
case 1: //个人资料
|
||||
uni.navigateTo({
|
||||
url: '/pagesB/personalInfo/personalInfo'
|
||||
})
|
||||
break;
|
||||
case 2: //个人邀请码
|
||||
this.isMa = true
|
||||
uni.hideTabBar()
|
||||
let ya = this
|
||||
// setTimeout(function(){
|
||||
// ya.createQRCode()
|
||||
// },1000)
|
||||
break;
|
||||
}
|
||||
},
|
||||
goShouy(index) {
|
||||
// console.log(index);
|
||||
switch (index) {
|
||||
case 0: //分红收益
|
||||
uni.navigateTo({
|
||||
url: '/pagesB/zIncome/zIncome?index=1'
|
||||
}) //index=1表示查询分红收益记录
|
||||
break;
|
||||
case 2: //提现中
|
||||
uni.navigateTo({
|
||||
url: '/pagesB/record/record?index=1'
|
||||
}) //index=1表示查询分红提现记录
|
||||
break;
|
||||
case 3: //分红收益的立即提现
|
||||
let price = this.shouArr[1].price
|
||||
this.$toolAll.tools.showToast('由于腾讯规定限制,本业务需3月后进行开放。具体时间请查看平台公告信息!','',3000)
|
||||
// uni.navigateTo({
|
||||
// url: '/pagesB/immediateWithdrawal/immediateWithdrawal?index=1&price=' + price +
|
||||
// '&type=bonus'
|
||||
// })
|
||||
break;
|
||||
}
|
||||
},
|
||||
clickt(index) {
|
||||
switch (index) {
|
||||
case 0: //直卖收益
|
||||
uni.navigateTo({
|
||||
url: '/pagesB/zIncome/zIncome?index=0'
|
||||
}) //index=0表示查询直卖收益记录
|
||||
break;
|
||||
case 1: //提现中
|
||||
uni.navigateTo({
|
||||
url: '/pagesB/record/record?index=0'
|
||||
}) //index=0表示查询直卖提现记录
|
||||
break;
|
||||
case 3: //直卖收益的立即提现
|
||||
let price = this.tiArr[0].price
|
||||
this.$toolAll.tools.showToast('由于腾讯规定限制,本业务需3月后进行开放。具体时间请查看平台公告信息!','',3000)
|
||||
// uni.navigateTo({
|
||||
// url: '/pagesB/immediateWithdrawal/immediateWithdrawal?index=1&price=' + price +
|
||||
// '&type=sale'
|
||||
// })
|
||||
break;
|
||||
}
|
||||
},
|
||||
checkAll() {
|
||||
// console.log('全部订单');
|
||||
uni.navigateTo({
|
||||
url: '/pagesA/myOrder/myOrder?index=0&num=0'
|
||||
})
|
||||
},
|
||||
goOrder(index) {
|
||||
// console.log('我的订单' + index);
|
||||
switch (index) {
|
||||
case 0:
|
||||
uni.navigateTo({
|
||||
url: '/pagesA/myOrder/myOrder?index=1&num=1'
|
||||
})
|
||||
break;
|
||||
case 1:
|
||||
uni.navigateTo({
|
||||
url: '/pagesA/myOrder/myOrder?index=1&num=2'
|
||||
})
|
||||
break;
|
||||
case 2:
|
||||
uni.navigateTo({
|
||||
url: '/pagesA/daiEvaluated/daiEvaluated'
|
||||
})
|
||||
break;
|
||||
case 3:
|
||||
uni.navigateTo({
|
||||
url: '/pagesA/afterSales/afterSales?index=1'
|
||||
})
|
||||
break;
|
||||
}
|
||||
},
|
||||
goUtils(index) {
|
||||
// console.log('常用工具:' + index);
|
||||
switch (index) {
|
||||
case 0:
|
||||
uni.navigateTo({
|
||||
url: '/pagesB/platformDescription/platformDescription'
|
||||
})
|
||||
break;
|
||||
case 1:
|
||||
uni.navigateTo({
|
||||
url: '/pagesB/businessCooperation/businessCooperation'
|
||||
})
|
||||
break;
|
||||
case 3:
|
||||
uni.navigateTo({
|
||||
url: '/pagesB/adManagement/adManagement?wherenum=1'
|
||||
})
|
||||
break;
|
||||
case 4:
|
||||
uni.navigateTo({
|
||||
url: '/pagesB/dividendRules/dividendRules'
|
||||
})
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
},
|
||||
closema() {
|
||||
this.isMa = this.showScan = false
|
||||
uni.showTabBar()
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.qrcode-canvas {
|
||||
margin: 0rpx ;
|
||||
height: 110px;
|
||||
width: 110px;
|
||||
}
|
||||
</style>
|
|
@ -0,0 +1,348 @@
|
|||
<template>
|
||||
<view v-if="pageShow">
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav @inputConfirm="inputConfirm" :statusBackg="true" :statusInput="true" :whereCome="whereCome*1" :backgroudColor="'#ffffff'" :tabcolor="'#ffffff'"></status-nav>
|
||||
<!-- 导航 -->
|
||||
<view class="disaa color33 bacb zIn1 ptab" :style="{top:statusHNH+'px'}">
|
||||
<view :class="current==0?'bold':''" @tap="choose(0)">综合推荐</view>
|
||||
<view :class="current==1?'bold':''" @tap="choose(1)">销量</view>
|
||||
<view :class="current==2?'bold':''" @tap="choose(2)" class="disac">
|
||||
<view>价格</view>
|
||||
<view class=" margin-z10">
|
||||
<view v-if="showJian" class="discc">
|
||||
<image class="ascedesc" src="/static/img/product/ascendingOrder.png"></image>
|
||||
<image class="ascedesc" style="transform: rotateZ(180deg);" src="/static/img/product/ascendingOrder.png"></image>
|
||||
</view>
|
||||
<view v-else class="discc">
|
||||
<image v-if="!isasce" @tap.stop="asecedescEvent(0)" class="ascedesc" src="/static/img/product/ascendingOrder.png"></image>
|
||||
<image v-else class="ascedesc" style="transform: rotateZ(180deg);" src="/static/img/product/descendingOrder.png"></image>
|
||||
<image v-if="isasce" @tap.stop="asecedescEvent(1)" class="ascedesc" style="transform: rotateZ(180deg);" src="/static/img/product/ascendingOrder.png"></image>
|
||||
<image v-else class="ascedesc" src="/static/img/product/descendingOrder.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view :class="chooseShai?'catebold':''" @tap="chooseShaiEv" class="disac">
|
||||
<view>筛选</view>
|
||||
<!-- 筛选图标 -->
|
||||
<image v-if="chooseShai" style="width: 22rpx;height: 22rpx;" src="/static/img/product/screen_02.png"></image>
|
||||
<image v-else style="width: 22rpx;height: 22rpx;" src="/static/img/product/screen.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 列表 -->
|
||||
<view class="padding20 bacb plist" v-if="productList.length!=0" :style="{marginTop:(statusHNH+42)+'px'}">
|
||||
<view @tap="goDetail(item.spu_id)" class="disba padding-x30 padding-s20 borbot margin-s10" v-for="(item,index) in productList" :key="index">
|
||||
<image class="proimg flexs radius10" :src="item.src"></image>
|
||||
<view class="padding-sx20 padding-z20 width100">
|
||||
<view class="clips2 fon28">{{item.title}}</view>
|
||||
<view class="fon24 color9 margin-sx10 clips1">{{item.content}}</view>
|
||||
<view class="dis flw">
|
||||
<label class="colorf6 fon24 radius16 pro margin-y10" v-for="(itemc,indexc) in item.cate" :key="indexc">{{itemc.name}}</label>
|
||||
</view>
|
||||
<view class="disba margin-s20">
|
||||
<view class="colorf6 fon24 bold">¥<text class="fon28">{{item.price}}</text>.0</view>
|
||||
<!-- 加入购物车图片 -->
|
||||
<image @tap.stop="addGou(item.id)" class="progc" src="/static/img/public/gouwcar.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="productList.length==0" class="zanwu">暂无相关产品</view>
|
||||
<!-- 筛选弹框 -->
|
||||
<view v-if="yin" :class="isShai?'fadeInRight':chuout+' '+xiao" class="pchoose animated" :style="{top:(statusHNH+32)+'px'}">
|
||||
<view class="padding-sx20" style="display: flex;background-color: rgba(0,0,0,.3);flex-direction: row-reverse;">
|
||||
<!-- 筛选弹框,关闭图片 -->
|
||||
<image @tap="closeCate" class="margin-y20" style="width: 28rpx;height: 28rpx;" src="/static/img/product/pclose.png" mode=""></image>
|
||||
</view>
|
||||
<view style="background-color: #f5f5f5;height: 100%;">
|
||||
<view @tap="checkShai(item.id,indexs)"
|
||||
:class="shaiCurrent==indexs?'dangShai':''"
|
||||
class="fon24 disac" v-for="(item,indexs) in shaiArr"
|
||||
:key="indexs" style="padding: 30rpx;">
|
||||
<view>{{item.name}}</view>
|
||||
<!-- 筛选弹框,右侧图片 -->
|
||||
<image v-if="shaiCurrent==indexs" class="posia" style="right: 0;width: 4rpx;height: 49rpx;" src="/static/img/product/pyxian.png" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<backTop :showTop="showTop" @backTop="backTop"></backTop>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import backTop from '@/components/backTop.vue';
|
||||
export default {
|
||||
components:{
|
||||
backTop
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
current:0,
|
||||
chooseShai:false,
|
||||
isasce:true,
|
||||
productList:[],
|
||||
zanList:[],//暂存产品列表不显示
|
||||
shaiArr:[],
|
||||
shaiCurrent:0,
|
||||
isShai:false,
|
||||
yin:false,
|
||||
chuout:'',
|
||||
xiao:'',
|
||||
showTop:false,
|
||||
whereCome:2,
|
||||
page:1,
|
||||
size:10,
|
||||
total:'',
|
||||
isZanw:true,
|
||||
cid:0,//分类ID
|
||||
filed:'',//默认:synthetical 取值view_amount、sale_amount、sort_price
|
||||
direction:'down',//取值down/up
|
||||
statusHNH:uni.getStorageSync('statusHNH'),
|
||||
moIndex:0,
|
||||
pageShow:false,
|
||||
showJian:true
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.$toolAll.tools.guoq()
|
||||
uni.showTabBar()
|
||||
uni.getStorageSync('whereCome') !='' ? this.whereCome = uni.getStorageSync('whereCome') : ''
|
||||
uni.removeStorageSync('proDetail')
|
||||
// console.log('清除产品详情缓存成功',uni.getStorageSync('proDetail'));
|
||||
this.showJian = true
|
||||
this.isasce = true
|
||||
this.moIndex = 0
|
||||
this.direction = 'up'
|
||||
this.current = 0
|
||||
this.filed = 'synthetical'
|
||||
this.cid = 0
|
||||
this.size = 10
|
||||
this.page = 1
|
||||
this.checkList()
|
||||
},
|
||||
onReachBottom() {
|
||||
console.log(this.total,this.productList.length);
|
||||
if(this.total!=this.productList.length){
|
||||
this.page++
|
||||
this.checkList()//调用自主预约列表事件
|
||||
} else {
|
||||
if(this.isZanw) this.$toolAll.tools.showToast('暂无更多商品列表','none',1000)
|
||||
this.isZanw = false
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.shaiEv()
|
||||
},
|
||||
onPageScroll(e) {
|
||||
e.scrollTop > 360 ? this.showTop = true : this.showTop = false
|
||||
},
|
||||
// onReachBottom() {
|
||||
// console.log('触底了');
|
||||
// let that = this;
|
||||
// this.page++
|
||||
// that.checkList();
|
||||
// },
|
||||
methods: {
|
||||
checkList(){
|
||||
let paramCate ={
|
||||
category_id:this.cid,
|
||||
page:this.page,
|
||||
size:this.size,
|
||||
sort_filed:this.filed,
|
||||
sort_direction:this.direction
|
||||
}
|
||||
// console.log('参数:',paramCate);
|
||||
this.$requst.post('product/spu/list',paramCate).then(res=>{
|
||||
// console.log('产品',res);
|
||||
if(res.code==0){
|
||||
this.pageShow = true
|
||||
if(this.page==1) this.productList = []
|
||||
this.total = res.data.total
|
||||
if(res.data.list.length!=0){
|
||||
// this.cid = res.data.list[0].cid//获取分类ID,以便加载更多使用
|
||||
this.zanList = res.data.list
|
||||
res.data.list.forEach(item=>{
|
||||
let cateObj = {
|
||||
id:item.main_sku.id,//商品ID
|
||||
spu_id:item.id,
|
||||
src:this.$http + item.main_sku.main_image,//商品图片
|
||||
title:item.name,//商品名称
|
||||
content:item.sub_title,//商品标题
|
||||
cate:item.tag_list,//标签列表
|
||||
price:item.main_sku.cur_price/100//商品原价
|
||||
}
|
||||
this.productList.push(cateObj)
|
||||
})
|
||||
} else {
|
||||
// this.$toolAll.tools.showToast('没找到相关产品o(╥﹏╥)o')
|
||||
}
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
inputConfirm(e){
|
||||
// console.log(e);
|
||||
this.keySearch(e)
|
||||
},
|
||||
keySearch(key){
|
||||
this.productList = []
|
||||
if(key!='' || key=='') this.cid = ''
|
||||
let paramCate ={
|
||||
category_id:this.cid,
|
||||
page:this.page,
|
||||
size:this.size,
|
||||
sort_filed:this.filed,
|
||||
sort_direction:this.direction,
|
||||
keyword:key
|
||||
}
|
||||
this.$requst.post('product/spu/list',paramCate).then(res=>{
|
||||
// console.log('产品',res);
|
||||
if(res.data.list.length!=0){
|
||||
this.cid = res.data.list[0].cid//获取分类ID,以便加载更多使用
|
||||
this.zanList = res.data.list
|
||||
res.data.list.forEach(item=>{
|
||||
let cateObj = {
|
||||
id:item.id,//商品ID
|
||||
src:this.$http + item.main_sku.main_image,//商品图片
|
||||
title:item.name,//商品名称
|
||||
content:item.sub_title,//商品标题
|
||||
cate:item.tag_list,//标签列表
|
||||
price:item.main_sku.cur_price/100//商品原价
|
||||
}
|
||||
this.productList.push(cateObj)
|
||||
})
|
||||
} else {
|
||||
// this.$toolAll.tools.showToast('没找到相关产品o(╥﹏╥)o')
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
backTop(){//回到顶部事件
|
||||
uni.pageScrollTo({
|
||||
scrollTop: 0,
|
||||
duration: 300
|
||||
});
|
||||
this.isShai = false
|
||||
},
|
||||
choose(index){//标题选择
|
||||
let ya = this
|
||||
this.cid = 0
|
||||
this.page = 1
|
||||
this.size = 10
|
||||
this.current = index
|
||||
if(index==0){this.filed = 'synthetical'}
|
||||
else if(index==1){this.filed = 'sale_amount';this.direction = 'down'}
|
||||
else if(index==2){//价格点击事件判断
|
||||
this.showJian = false
|
||||
this.moIndex++
|
||||
if(this.moIndex==1){
|
||||
// console.log('2');
|
||||
if(!this.isasce){
|
||||
this.direction = 'down'
|
||||
} else this.direction = 'up'
|
||||
} else {
|
||||
// console.log('3');
|
||||
this.isasce = !this.isasce
|
||||
if(!this.isasce){
|
||||
this.direction = 'down'
|
||||
} else {
|
||||
this.direction = 'up'
|
||||
}
|
||||
}
|
||||
this.filed = 'sort_price';this.checkList();return false
|
||||
} else {
|
||||
this.isShai = false
|
||||
this.hideEv()
|
||||
return false
|
||||
}
|
||||
this.checkList()
|
||||
},
|
||||
chooseShaiEv(){
|
||||
this.cid = 0
|
||||
this.page = 1
|
||||
this.size = 10
|
||||
this.yin = true
|
||||
this.isShai= true
|
||||
this.chooseShai = true
|
||||
this.chuout='fadeOutRight'
|
||||
},
|
||||
closeCate(){//关闭按钮事件
|
||||
this.isShai = false
|
||||
this.hideEv()
|
||||
},
|
||||
hideEv(){//隐藏筛选弹框延迟事件
|
||||
let ya = this
|
||||
setTimeout(function(){
|
||||
ya.yin = false
|
||||
},500)
|
||||
},
|
||||
shaiEv(){//商品分类查询事件
|
||||
this.$requst.post('product/spu/category').then(res=>{
|
||||
// console.log('筛选',res);
|
||||
if(res.data.length!=0){
|
||||
res.data.forEach(item=>{
|
||||
let obj = {
|
||||
id:item.id,
|
||||
name:item.name,
|
||||
pid:item.pid,
|
||||
hasChildren:item.hasChildren
|
||||
}
|
||||
this.shaiArr.push(obj)
|
||||
})
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
asecedescEvent(index){//升序
|
||||
this.cid = 0
|
||||
this.page = 1
|
||||
this.size = 10
|
||||
this.current = 2
|
||||
if(index==0){
|
||||
this.isasce = false
|
||||
this.direction = 'up'
|
||||
} else {
|
||||
this.isasce = true
|
||||
this.direction = 'down'
|
||||
}
|
||||
this.checkList()
|
||||
},
|
||||
addGou(e){//加入购物车
|
||||
// console.log('加入购物车'+e);
|
||||
// uni.showToast({title:'加入购物车'+e+'成功',icon:'none'})
|
||||
if(uni.getStorageSync('is_active')==0) {
|
||||
this.$toolAll.tools.showToast('您目前是游客,请授权登录')
|
||||
setTimeout(()=>{
|
||||
uni.navigateTo({url:'/pages/login/login'})
|
||||
},1500)
|
||||
} else {
|
||||
this.$requst.post('order/shopping-cart-add',{sku_id:e,num:1}).then(res=>{
|
||||
if(res.code==0){
|
||||
this.$toolAll.tools.showToast('添加购物车成功(*^▽^*)')
|
||||
}
|
||||
},error=>{})
|
||||
}
|
||||
},
|
||||
goDetail(id){//查看详情
|
||||
// console.log(id);
|
||||
uni.navigateTo({
|
||||
url:'/pagesA/productDetail/productDetail?id='+id
|
||||
})
|
||||
},
|
||||
|
||||
checkShai(id,index){//筛选框item点击事件 按类别查询商品
|
||||
// console.log(id,index);
|
||||
this.shaiCurrent = index
|
||||
if(id=='') this.cid = 0
|
||||
else this.cid = id
|
||||
this.page = 1
|
||||
this.isZanw = true
|
||||
this.checkList()
|
||||
}
|
||||
},
|
||||
onHide() {
|
||||
this.isShai = false
|
||||
this.yin = false
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
page {background-color: #f5f5f5;}
|
||||
</style>
|
|
@ -0,0 +1,351 @@
|
|||
<template>
|
||||
<view v-if="pageShow">
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav :statusBackw="true" :whereCome="2" :iscenter="true" :statusTitleImg="true" :statusTitle="true" :title-val="'购物车'" :tabcolor="'#ffffff'"></status-nav>
|
||||
<!-- 列表 -->
|
||||
<view :style="{paddingTop:(statusHNH+10)+'px'}">
|
||||
<view class="padding-zy20 bacb">
|
||||
<view v-if="gouwList.length!=0" :class="delCur==index?'fadeOutUp ':''" class="padding-sx30 disba borbot animated " v-for="(item,index) in gouwList" :key="index">
|
||||
<view class="disac">
|
||||
<!-- 单选按钮 -->
|
||||
<view class="margin-y20"><label class="radio"><radio @tap.stop="choose(index)" :checked="item.status" color="#ff7800"/></label></view>
|
||||
<!-- 商品图片 -->
|
||||
<image @tap="checkDetail(item.spu_id)" class="radius10 gouwcimg" :src="item.src" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="padding-z20">
|
||||
<view class="dis">
|
||||
<!-- 商品标题 -->
|
||||
<view class="clips2 fon28 color33 margin-y20 width100" style="line-height: 46rpx;">{{item.title}}</view>
|
||||
<!-- 删除按钮 -->
|
||||
<image @tap.stop="clear(item.id,index)" class="flexs margin-s10" style="width: 30rpx;height: 30rpx;" src="../../../static/img/gouwc/del.png" mode=""></image>
|
||||
</view>
|
||||
<view @tap="chooseCate(index)" class="disbcac margin-s10 margin-x20 xuanz posir fon24 color9 ">
|
||||
<!-- 商品类型 -->
|
||||
<view class="clips1">{{item.cateArr[0].sku_name}}</view>
|
||||
<!-- 下键 -->
|
||||
<image class="margin-z20 flexs" style="width: 17rpx;height: 10rpx;" src="../../../static/img/gouwc/xia.png" mode=""></image>
|
||||
<!-- 选择框 -->
|
||||
<view v-if="current==index" class="posia textc padding-x20" style="top: 60rpx;left: 0;right: 0;background-color: rgb(245, 245, 245);border-radius: 6rpx;">
|
||||
<scroll-view scroll-y="true" style="height: 100rpx;">
|
||||
<view class="discc">
|
||||
<view @tap="cateChoose(index,index1)" class="clips1 margin-s20" v-for="(item1,index1) in item.cateArr" :key="index1" style="width: 80%;">{{item1.sku_name}}</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="margin-s30 disba">
|
||||
<view class="colorf6 fon24 bold width100">¥<text class="fon28">{{item.price}}</text>.0</view>
|
||||
<view class="disac">
|
||||
<!-- 递减 -->
|
||||
<button @tap.stop="deladdEvent( item.id , index , 0)" class="deladd fon36 color33" :disabled="item.num==1">-</button>
|
||||
<!-- 数量框 禁止输入-->
|
||||
<input type="text" disabled v-model="item.num" style="width: 60%;background-color: #F5F5F5;text-align: center;padding: 4rpx 0;border-radius: 4rpx;"/>
|
||||
<!-- 数量框 可以输入-->
|
||||
<!-- <input type="text" @blur="blurEv(index)" @input="changeInput(index,0,$event)" :value="item.num" style="width: 60%;background-color: #F5F5F5;text-align: center;padding: 4rpx 0;border-radius: 4rpx;"/> -->
|
||||
<!-- 递增 -->
|
||||
<button @tap.stop="deladdEvent( item.id , index , 1)" class="deladd fon36 color33">+</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="gouwList.length==0" class="kongk">空空如也</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 猜你喜欢 -->
|
||||
<view class="disbcac padding-sx40">
|
||||
<view class="gouwcxian "></view>
|
||||
<image class="margin-zy20 margin-s10 gouwchh" src="/static/img/gouwc/heh.png" mode=""></image>
|
||||
<view class="bold fon32">猜你喜欢</view>
|
||||
<view class="gouwcxian margin-z20"></view>
|
||||
</view>
|
||||
<!-- 喜欢列表 -->
|
||||
<twocoluList @addChe="addChe" :dataList="dataList"></twocoluList>
|
||||
<!-- 结算 -->
|
||||
<view class="posi-bzy disba padding-zy20 gouwcb-box">
|
||||
<view class="disac">
|
||||
<label class="radio disac" style="margin-top: -6rpx;">
|
||||
<radio :checked="allcheck" @tap="allchoose" color="#ff7800"/><view class="margin-z10 margin-y20 margin-s10">全选</view>
|
||||
</label>
|
||||
<view class="fon36">合计:<label class="colorf6 bold">¥{{allPrice}}.0</label></view>
|
||||
</view>
|
||||
<button v-if="allNum!=0" :disabled="disb" @tap="gopay" class="colorb bold gouwcbtn">{{disb?'正在前往...':'去结算('+allNum+')'}}</button>
|
||||
<button v-else @tap="goGouw" class="colorb bold gouwcbtn">去购物</button>
|
||||
</view>
|
||||
<view style="height: 56px;"></view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import twocoluList from '@/components/twocoluList.vue';
|
||||
export default {
|
||||
components:{
|
||||
twocoluList
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
current:'-1',
|
||||
delCur:'-1',
|
||||
gouwList:[],
|
||||
dataList:[],
|
||||
disb:false,
|
||||
allcheck:false,
|
||||
cunIdArr:[],
|
||||
newId:'',
|
||||
newNum:1,
|
||||
newType:'',
|
||||
inputNum:'',
|
||||
dangVal:'',
|
||||
orderList:[],//暂存准备下单的订单的coding、num
|
||||
statusHNH:uni.getStorageSync('statusHNH'),
|
||||
pageShow:true,
|
||||
page:1,
|
||||
size:10,
|
||||
total:'',
|
||||
isZanw:true,
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.$toolAll.tools.guoq()
|
||||
uni.hideTabBar()
|
||||
this.checkGouCList()
|
||||
this.allcheck = false
|
||||
uni.removeStorageSync('orderInfo')
|
||||
},
|
||||
onReachBottom() {
|
||||
// console.log(this.total,this.productList.length);
|
||||
if(this.total!=this.dataList.length){
|
||||
this.page++
|
||||
this.like()//调用自主预约列表事件
|
||||
} else {
|
||||
if(this.isZanw) this.$toolAll.tools.showToast('暂无更多商品列表','none',1000)
|
||||
this.isZanw = false
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.like()
|
||||
},
|
||||
computed:{
|
||||
allPrice(){
|
||||
let sum = 0
|
||||
this.gouwList.forEach(item=>{
|
||||
if(item.status) sum += item.price*1 * item.num
|
||||
})
|
||||
return sum;
|
||||
},
|
||||
allNum(){
|
||||
let num = 0
|
||||
this.gouwList.forEach(item=>{
|
||||
if(item.status) num +=item.num*1
|
||||
})
|
||||
return num;
|
||||
},
|
||||
zhunOrder(){
|
||||
let arr = []
|
||||
// console.log('数据:',this.gouwList);
|
||||
this.gouwList.forEach(item=>{
|
||||
let buyObj = {
|
||||
sku_coding:item.coding,
|
||||
num:item.num
|
||||
}
|
||||
if(item.status) arr.push(buyObj)
|
||||
})
|
||||
return arr
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
like(){//查询猜你喜欢列表
|
||||
this.$requst.post('product/spu/guess',{page:1,size:50}).then(res=>{
|
||||
// console.log('猜你喜欢',res);
|
||||
if(res.code==0){
|
||||
this.pageShow = true
|
||||
this.total = res.data.total
|
||||
if(res.data.list.length!=0){
|
||||
res.data.list.forEach(item=>{
|
||||
let likeObj = {
|
||||
id:item.main_sku.id,
|
||||
spu_id:item.id,
|
||||
src:this.$http + item.main_sku.main_image,
|
||||
title:item.name,
|
||||
price:item.main_sku.cur_price/100,
|
||||
tags:item.tags
|
||||
}
|
||||
this.dataList.push(likeObj)
|
||||
})
|
||||
}
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
checkGouCList(){//购物车商品查询事件
|
||||
this.gouwList = []
|
||||
let gouParma = {
|
||||
page:1,
|
||||
size:50//后台默认20
|
||||
}
|
||||
this.$requst.post('order/shopping-cart',gouParma).then(res=>{
|
||||
// console.log('购物车',res);
|
||||
if(res.data.length!=0){
|
||||
res.data.forEach(item=>{
|
||||
if(item.sku!=null){
|
||||
let gouObj = {
|
||||
id:item.id,
|
||||
spu_id:item.spu_id,
|
||||
coding:item.sku.coding,
|
||||
src:this.$http + item.sku.sku_cover,
|
||||
status:false,
|
||||
title:item.spu_name,
|
||||
price:parseInt(item.price)/100,
|
||||
num:item.num,
|
||||
cateArr:item.skus
|
||||
}
|
||||
this.gouwList.push(gouObj)
|
||||
} else {
|
||||
// console.log('id:',item.id);
|
||||
this.$requst.post('order/shopping-cart-del',{id:item.id}).then(res=>{},error=>{})
|
||||
}
|
||||
// console.log('数据:',this.gouwList);
|
||||
})
|
||||
}
|
||||
// console.log(res);
|
||||
},error=>{})
|
||||
},
|
||||
cateChoose(index,index1){//类型选择
|
||||
let dang = this.gouwList[index].cateArr[index1];
|
||||
let num = this.gouwList[index].cateArr.indexOf(dang)
|
||||
if(num!=-1){
|
||||
this.gouwList[index].cateArr.splice(num,1)
|
||||
this.gouwList[index].cateArr.unshift(dang)
|
||||
}
|
||||
|
||||
this.gouwList[index].src = this.$http + this.gouwList[index].cateArr[0].sku_cover
|
||||
this.gouwList[index].coding = this.gouwList[index].cateArr[0].coding
|
||||
this.gouwList[index].price = this.gouwList[index].cateArr[0].sku_price/100
|
||||
},
|
||||
chooseCate(index){//类型选择调起
|
||||
// console.log('下拉选择:'+index);
|
||||
this.current==index ? this.current = '-1' : this.current = index
|
||||
},
|
||||
gopay(){//去结算事件
|
||||
let ya = this
|
||||
let storageAddress = uni.getStorageSync('storageAddress')
|
||||
let buyParma = {
|
||||
sku_list: this.zhunOrder,
|
||||
address_id: storageAddress || ''
|
||||
}
|
||||
// console.log('参数',buyParma);
|
||||
this.$requst.post('order/prepare-info',buyParma).then(res=>{
|
||||
// console.log(res);
|
||||
if(res.code==0){
|
||||
ya.disb = true
|
||||
uni.setStorageSync('orderInfo',res.data)
|
||||
setTimeout(function(){
|
||||
ya.disb = false
|
||||
},2000)
|
||||
uni.navigateTo({
|
||||
url:'/pagesA/confirmOrder/confirmOrder'
|
||||
})
|
||||
}
|
||||
},error=>{ya.disb = false})
|
||||
},
|
||||
choose(index){//单选
|
||||
this.gouwList[index].status = !this.gouwList[index].status
|
||||
let one = this.gouwList.filter(function(item){
|
||||
return item.status == false;
|
||||
})
|
||||
one.length==0 ? this.allcheck = true : this.allcheck = false
|
||||
},
|
||||
allchoose(){//全选
|
||||
this.allcheck = !this.allcheck
|
||||
this.gouwList.forEach((item,index)=>{
|
||||
this.allcheck ? item.status = true : item.status = false
|
||||
})
|
||||
},
|
||||
deladdEvent(id,cur,index){//数量加减事件
|
||||
if(index==0){//减少数量
|
||||
this.gouwList[cur].num--
|
||||
this.newType = 'down'
|
||||
} else {//增加数量
|
||||
this.gouwList[cur].num++
|
||||
this.newType = 'up'
|
||||
}
|
||||
this.newId = id
|
||||
this.changeNum()//调用数量变更事件
|
||||
},
|
||||
changeNum(){//执行数量变更事件
|
||||
let bparma = {
|
||||
id:this.newId,
|
||||
num:this.newNum,
|
||||
type:this.newType
|
||||
}
|
||||
this.$requst.post('order/shopping-cart-change-num',bparma).then(res=>{},error=>{})
|
||||
},
|
||||
// changeInput(index,id,e){//数量输入框事件
|
||||
// // console.log(index,id);
|
||||
// this.newId = id
|
||||
// this.inputNum = e.target.value
|
||||
// this.dangVal = this.gouwList[index].num
|
||||
// if(this.inputNum>this.dangVal){
|
||||
// this.newType = 'up'
|
||||
// } else if(this.inputNum<this.dangVal){
|
||||
// this.newType = 'down'
|
||||
// }
|
||||
// this.newNum = this.gouwList[index].num = this.inputNum
|
||||
// },
|
||||
// blurEv(index){
|
||||
// if(this.inputNum==''){
|
||||
// this.gouwList[index].num = this.dangVal
|
||||
// this.$toolAll.tools.showToast('请输入正确的产品数量')
|
||||
// } else {
|
||||
// this.changeNum()//调用数量变更事件
|
||||
// }
|
||||
// },
|
||||
goGouw(){//去购物按钮事件
|
||||
// console.log('去购物');
|
||||
uni.setStorageSync('whereCome',0)
|
||||
uni.switchTab({
|
||||
url:'/pages/tabbar/product/product'
|
||||
})
|
||||
},
|
||||
clear(id,index){//删除商品
|
||||
// console.log('删除商品:'+id);
|
||||
uni.showModal({
|
||||
content:'确定要删除该商品吗?',
|
||||
cancelText:'取消',
|
||||
cancelColor:'#999999',
|
||||
confirmText:'确定',
|
||||
confirmColor:'#FF7800',
|
||||
success: (res) => {
|
||||
if(res.confirm){
|
||||
this.$requst.post('order/shopping-cart-del',{id:id}).then(res=>{
|
||||
if(res.code==0){
|
||||
this.delCur = index
|
||||
setTimeout(()=>{
|
||||
this.delCur = '-1'
|
||||
this.gouwList.splice(index,1)
|
||||
},500)
|
||||
// this.checkGouCList()
|
||||
this.$toolAll.tools.showToast('删除商品成功')
|
||||
}
|
||||
},error=>{})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
checkDetail(id){//查看商品详情
|
||||
// console.log('查看详情:'+id);
|
||||
uni.navigateTo({
|
||||
url:'/pagesA/productDetail/productDetail?index=0&id='+id
|
||||
})
|
||||
},
|
||||
addChe(){//加入购物车事件
|
||||
let ya = this
|
||||
setTimeout(function(){
|
||||
ya.checkGouCList()
|
||||
},500)
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
|
@ -0,0 +1,96 @@
|
|||
<template>
|
||||
<view class="">
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav :statusBackw="true" :statusTitle="true" :whereCome="whereCome*1" :title-val="'售后'" :tabcolor="'#ffffff'"></status-nav>
|
||||
<view :style="{paddingTop:statusHNH+'px'}">
|
||||
<view v-if="dataArr.length!=0" class="padding-sx20 fon28 bacb margin-sx20 padding-zy30" style="border-radius: 5rpx;" v-for="(item,index) in dataArr" :key="index">
|
||||
<view class="fon24 color6 margin-sx10">订单号:{{item.orderId}}</view>
|
||||
<view class="margin-sx20 disac posir borbot padding-x20">
|
||||
<image @tap="checkDetail(index)" class="radius10 flexs goodsImg" :src="item.src" mode=""></image>
|
||||
<view class="margin-zy20" style="width: 54%;">
|
||||
<view class="fon32 clips2">{{item.title}}</view>
|
||||
<view class="fon24 color9 margin-sx10">{{item.cate}}</view>
|
||||
<view class="fon24 color6">X{{item.num}}</view>
|
||||
</view>
|
||||
<view style="position: absolute;right: 10rpx;bottom: 36rpx;text-align: right;">
|
||||
<view>¥<text class="fon36 bold">{{item.allprice}}</text>.0</view>
|
||||
<view class="fon26 disac margin-s20"><view class="flexs">实付款:</view><text class="colorf78">¥{{item.price}}.0</text></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="dis fon24 margin-x10">
|
||||
<view class="color33 flexs">处理结果:</view>
|
||||
<view class="bold">{{['待处理','处理中','已处理'][item.result]}}</view>
|
||||
</view>
|
||||
<view class="dis fon24">
|
||||
<view class="color33 flexs">留言信息:</view>
|
||||
<view class="">
|
||||
<block v-for="(itema,indexa) in item.content" :key="indexa">
|
||||
<view class="margin-x10"><text style="color: #007AFF;">(我):</text>{{itema.description}} </view>
|
||||
<view class="margin-x20" v-if="itema.reply!=''"><text style="color: #ff0000;">(商家):</text>{{itema.reply}} </view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="dataArr.length==0" class="zanwu">暂无售后记录</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
whereCome:0,
|
||||
dataArr:[],
|
||||
page:1,
|
||||
size:50,
|
||||
statusHNH:uni.getStorageSync('statusHNH')
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.$toolAll.tools.guoq()
|
||||
},
|
||||
onLoad(options) {
|
||||
if(options.index!=undefined){this.whereCome = options.index}
|
||||
this.checkAfterList()//调用售后记录事件
|
||||
},
|
||||
methods: {
|
||||
checkAfterList(){//查询售后记录事件
|
||||
this.$requst.post('order/get-after-sale-list',{page:this.page,size:this.size}).then(res=>{
|
||||
// console.log('售后列表',res);
|
||||
if(res.code==0){
|
||||
if(res.data.list.length!=0){
|
||||
res.data.list.forEach(item=>{
|
||||
let newStatus = ''
|
||||
if(item.afterSales[0].status=='waiting') newStatus = 0
|
||||
if(item.afterSales[0].status=='doing') newStatus = 1
|
||||
if(item.afterSales[0].status=='done') newStatus = 2
|
||||
let afterObj = {
|
||||
spu_id:item.skus[0].spu_id,
|
||||
orderId:item.skus[0].order_id,
|
||||
src:this.$http + item.skus[0].sku_cover,
|
||||
title:item.skus[0].spu_name,
|
||||
cate:item.skus[0].sku_name,
|
||||
num:item.skus[0].num,
|
||||
allprice:item.original_price/100,
|
||||
price:item.skus[0].price/100,
|
||||
result:newStatus,
|
||||
content:item.afterSales
|
||||
}
|
||||
this.dataArr.push(afterObj)
|
||||
})
|
||||
}
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
checkDetail(index){
|
||||
uni.navigateTo({
|
||||
url:'/pagesA/productDetail/productDetail?id='+index
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
|
@ -0,0 +1,81 @@
|
|||
<template>
|
||||
<view class="">
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav :statusBackw="true" :statusTitle="true" :title-val="'申请售后'" :tabcolor="'#ffffff'"></status-nav>
|
||||
<view :style="{paddingTop:statusHNH+'px'}">
|
||||
<view class="bacb margin-s20 padding-s30 padding-zy20 padding-x40">
|
||||
<view class="margin-x20 fon24 color33">订单号:{{afterOrder.orderId}}</view>
|
||||
<view class="dis borbot padding-x30 ">
|
||||
<image class="flexs goodsImg" :src="afterOrder.skuList[0].src" mode=""></image>
|
||||
<view class="margin-z20 margin-y30 width100">
|
||||
<view class="clips2 fon28">{{afterOrder.skuList[0].title}}</view>
|
||||
<view class="fon24 color9 margin-s10">{{afterOrder.skuList[0].cate}}</view>
|
||||
</view>
|
||||
<view class="margin-z20 " style="text-align: right;">
|
||||
<view class="fon24 bold">¥<text class="fon32">{{afterOrder.skuList[0].price}}</text>.0</view>
|
||||
<view class="margin-s10" style="font-size: 30rpx;color: #6f6f6f;">共{{afterOrder.skuList[0].num}}件</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="padding-s30 margin-x20">申请售后原因</view>
|
||||
<view style="background-color: #f6f6f6;padding: 20rpx;height: 230rpx;border-radius: 8rpx;">
|
||||
<textarea v-model="content" style="background-color: #f6f6f6;width: 100%;font-size: 26rpx;height: 100%;" placeholder="请输入不想要的原因" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="disbc">
|
||||
<button class="businessbtn" :disabled="disabled" @tap="submit">{{btncon}}</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
disabled:false,
|
||||
btncon:'提交',
|
||||
content:'',
|
||||
afterOrder:{},
|
||||
statusHNH:uni.getStorageSync('statusHNH')
|
||||
}
|
||||
},
|
||||
onUnload() {
|
||||
uni.removeStorageSync('afterOrder')
|
||||
},
|
||||
onLoad() {
|
||||
this.afterOrder = uni.getStorageSync('afterOrder')
|
||||
},
|
||||
onShow() {
|
||||
this.$toolAll.tools.guoq()
|
||||
},
|
||||
methods: {
|
||||
// 获取要申请售后的订单信息
|
||||
checkInfo(id){
|
||||
this.$requst.post('order/get-after-sale-list',{order_id:id}).then(res=>{
|
||||
// console.log('售后订单信息',res);
|
||||
},error=>{})
|
||||
},
|
||||
submit(){
|
||||
if(!this.content){
|
||||
this.$toolAll.tools.showToast('请输入原因')
|
||||
} else {
|
||||
this.disabled = true
|
||||
this.btncon = '正在提交...'
|
||||
this.$requst.post('order/after-sale-apply',{order_id:this.afterOrder.id,description:this.content}).then(res=>{
|
||||
// console.log(res);
|
||||
if(res.code==0){
|
||||
this.btncon = '提交'
|
||||
this.$toolAll.tools.showToast('恭喜售后申请成功(*^▽^*)')
|
||||
setTimeout(function(){
|
||||
uni.navigateBack({delta:1})
|
||||
},1000)
|
||||
}
|
||||
},error=>{})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
|
@ -0,0 +1,340 @@
|
|||
<template>
|
||||
<view class="">
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav :statusBackw="true" :statusTitle="true" :whereCome="whereCome" :title-val="'订单确认'" :tabcolor="'#ffffff'"></status-nav>
|
||||
<!-- 地址信息 -->
|
||||
<view @tap="chooseAddress" class=" bacb disba padding-zy30 posir" :style="{paddingTop:(statusHNH+10)+'px'}" v-if="listAddress!=null">
|
||||
<view class="margin-sx40">
|
||||
<view class="fon28 color33 disac">
|
||||
<view v-if="listAddress.is_default==1" class="fon24 colorb margin-y20 btnaddress" style="background-color: #e91111;">默认</view>
|
||||
<!-- <view class="fon24 colorb margin-y20 btnaddress" style="background-color: #ffc600;">公司</view> -->
|
||||
{{listAddress.province_str}} {{listAddress.city_str}} {{listAddress.county_str}}
|
||||
</view>
|
||||
<view class="fon36 bold margin-sx20">{{listAddress.address}}</view>
|
||||
<view class="fon28 color33">{{listAddress.name}} {{listAddress.phone}}</view>
|
||||
</view>
|
||||
<image class="youj" src="/static/img/my/youj.png" mode=""></image>
|
||||
<image class="posia lanh" src="/static/img/order/oaddressx.png" mode=""></image>
|
||||
</view>
|
||||
<view v-if="listAddress==null" @tap="chooseAddress" class="ptwo-box konga">添加地址</view>
|
||||
<!-- 商品列表 -->
|
||||
<view class="bacb margin-s20 padding-zy30 padding-x30">
|
||||
<view class="disba borbot padding-sx40" v-for="(itemOr,indexOr) in listInfo" :key="indexOr">
|
||||
<image class="flexs gouwcimg margin-y20" :src="itemOr.main_image" mode="aspectFill"></image>
|
||||
<view>
|
||||
<view class="clips2 fon28">{{itemOr.spu_name}}</view>
|
||||
<view class="fon24 color9 margin-sx10">{{itemOr.sub_title}}</view>
|
||||
<view class="disba margin-s20">
|
||||
<view class="bold colorf78">¥{{itemOr.price/100}}.0</view>
|
||||
<view class="fon28">X{{itemOr.num}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 商品下单金额相关与留言 -->
|
||||
<view class="margin-s20 padding-zy30 bacb">
|
||||
<view @tap="clickfen(index)" v-for="(item,index) in infoArr" :key="index" class="disba padding-s40">
|
||||
<view class="fon30 color33 flexs">{{item.title}}</view>
|
||||
<view v-if="item.price!=''" class="disac width100 jcend">
|
||||
<view :class="index==0?'bold':''" class="fon26 margin-y30" v-if="item.price!=''"><text :class="index==1?'colorf78':''">¥{{item.price}}</text></view>
|
||||
<image v-if="item.src!=''" class="youj" :src="item.src" style="margin-left: -15rpx;" mode="aspectFill"></image>
|
||||
</view>
|
||||
<input class="borbot width100 margin-z20 fon24 padding-sx10" v-if="item.title=='订单备注'" type="text" v-model="orderBZ" placeholder="可以再这里给商家留言(*^▽^*)哟" placeholder-style="color:#9a9a9a;font-size:24rpx;font-weight:bold;"/>
|
||||
<view class="borbot"></view>
|
||||
</view>
|
||||
<view class="bold fon30 padding-sx20 textr">合计: <text class="colorf78 fon36">¥{{hPrice}}</text></view>
|
||||
</view>
|
||||
<view class="margin-s20 padding-zy30 color9 fon24 marb-box12 textr">本单商品可以获得{{percentage}}%的分红金额</view>
|
||||
<!-- 提交订单 -->
|
||||
<view class="disba bacb padding-sx10 padding-zy30 posi-bzy" style="border-top: 1rpx solid #eeeeee;">
|
||||
<view>
|
||||
<view class="fon28">合计: <text class="fon32 bold colorf78">¥{{hPrice}}</text></view>
|
||||
<view class="fon24" style="color: #353535;">已使用分红金额¥{{infoArr[1].price}}</view>
|
||||
</view>
|
||||
<!-- 发起支付 -->
|
||||
<button @tap="confirm" :disabled="disabled" class="bold btntj">{{btncon}}</button>
|
||||
</view>
|
||||
<!-- 底部弹框 -->
|
||||
<view @touchmove.stop.prevent="" v-if="isBtn" class="posiall zIn5" style="background-color: rgba(0,0,0,.6);">
|
||||
<view class="posi-bzy padding20 animated bounceInUp" style="border-top-left-radius: 30rpx;border-top-right-radius: 30rpx;background-color: #FFFFFF;z-index: 6;">
|
||||
<view class="margin-s20 disba">
|
||||
<view>分红抵扣</view>
|
||||
<view @tap="isBtn=false" class="close-box">
|
||||
<view style="transform: rotate(45deg);"></view>
|
||||
<view style="transform: rotate(-45deg);"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="margin-sx20 width94" style="background-color: #f3f3f3;border-radius: 41rpx;">
|
||||
<input @input="inputev" :disabled="disf" type="number" class="fon24 margin-zy30" :maxlength="len" style="height: 82rpx;" :value="fhprice" :placeholder="placeCon" />
|
||||
</view>
|
||||
<view class="fon24 color9">可用分红金额:¥{{usableAmount}},实际获得金额:¥{{shijPrice}}</view>
|
||||
<view class="disbc">
|
||||
<view @tap="tankEv" style="height: 86rpx;line-height: 86rpx;background-color: #FF7800;border-radius: 42.5rpx;text-align: center;color: #FFFFFF;font-weight: bold;width: 90%;margin-top: 40rpx;margin-bottom: 60rpx;">立即使用</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<successpopu :isShow="isShow" :isSuccess="isSuccess" :title="title" :content="content" :typeNum="typeNum" @change="changepopu"></successpopu>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import successpopu from '@/components/successpopu.vue';
|
||||
export default {
|
||||
components:{
|
||||
successpopu
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
infoArr:[
|
||||
{title:'商品总额',price:'0.00',src:''},
|
||||
{title:'分红抵扣',price:'0.00',src:'/static/img/my/youj.png'},
|
||||
{title:'配送费',price:'0.00',src:''},
|
||||
{title:'本单分红',price:'0.00',src:''},
|
||||
{title:'订单备注',price:'',src:''},
|
||||
],
|
||||
orderBZ:'',
|
||||
isBtn:false,
|
||||
fhprice:'',
|
||||
isShow:false,
|
||||
isSuccess:true,
|
||||
title:'',
|
||||
content:'',
|
||||
disabled:false,
|
||||
btncon:'确认提交',
|
||||
usableAmount:'',//可用的分红抵扣金额
|
||||
zBig:'',//最大可抵扣实际金额
|
||||
percentage:0,//抵扣比例
|
||||
len:10,
|
||||
placeCon:'请输入您想要抵扣的金额',
|
||||
disf:false,
|
||||
listInfo:[],
|
||||
listAddress:'',
|
||||
hPrice:'',//合计金额
|
||||
shijPrice:'0.0',//实际获得金额
|
||||
orderInfo:'',//订单信息
|
||||
typeNum:'1',
|
||||
lenaddr:0,
|
||||
whereCome:0,
|
||||
newsku_list:[],
|
||||
statusHNH:uni.getStorageSync('statusHNH')
|
||||
}
|
||||
},
|
||||
onUnload() {
|
||||
uni.removeStorageSync('isAddr')
|
||||
},
|
||||
onShow() {
|
||||
this.$toolAll.tools.guoq()
|
||||
this.checkAddress()// 查询地址
|
||||
},
|
||||
onLoad(option) {
|
||||
// console.log(this.infoArr[3].price);
|
||||
// this.checkFHE()
|
||||
if(option.index!=undefined) this.whereCome = option.index
|
||||
this.orderInfo = uni.getStorageSync('orderInfo')
|
||||
// console.log('订单:',this.orderInfo);
|
||||
this.orderInfo.list.forEach(item=>{
|
||||
let obj = {
|
||||
coding:item.coding,
|
||||
id:item.id,
|
||||
main_image:this.$http + item.main_image,
|
||||
num:item.num,
|
||||
original_price:item.original_price,
|
||||
price:item.price,
|
||||
sku_name:item.sku_name,
|
||||
spec_summary:item.spec_summary,
|
||||
spu_id:item.spu_id,
|
||||
spu_name:item.spu_name,
|
||||
stock:item.stock,
|
||||
sub_title:item.sub_title
|
||||
}
|
||||
this.listInfo.push(obj)
|
||||
})
|
||||
this.listInfo.forEach(iteml=>{
|
||||
let nskObj = {
|
||||
sku_coding: iteml.coding,
|
||||
num: iteml.num
|
||||
}
|
||||
this.newsku_list.push(nskObj)
|
||||
})
|
||||
// console.log('参数',this.orderInfo);
|
||||
//商品总额
|
||||
this.infoArr[0].price = (this.orderInfo.original_total/100).toFixed(2)
|
||||
//运费
|
||||
this.infoArr[2].price = (this.orderInfo.freight/100).toFixed(2)
|
||||
//可用分红额度
|
||||
this.usableAmount = (this.orderInfo.bonus_amount/100).toFixed(2)
|
||||
if(this.usableAmount==0){
|
||||
this.placeCon = '暂无可用分红金额'
|
||||
this.disf = true
|
||||
}
|
||||
//抵扣比例
|
||||
this.percentage = this.orderInfo.bonus_rate
|
||||
// 实际金额
|
||||
// console.log('总金额+运费=',this.infoArr[0].price*1 + this.infoArr[2].price*1);//没问题
|
||||
|
||||
this.hPrice = this.infoArr[0].price*1 + this.infoArr[2].price*1 - this.infoArr[1].price*1
|
||||
// 本单分红
|
||||
this.infoArr[3].price = (this.hPrice * (this.percentage/100)).toFixed(2)
|
||||
// 实际获得金额
|
||||
// this.shijPrice = (this.orderInfo.bonus_amount * this.orderInfo.deduction_rate/100).toFixed(2)
|
||||
// 地址
|
||||
this.listAddress = this.orderInfo.address
|
||||
|
||||
|
||||
let getisAddr = uni.getStorageSync('isAddr')
|
||||
if(getisAddr!='') this.listAddress = getisAddr
|
||||
|
||||
// console.log(this.listAddress);
|
||||
|
||||
},
|
||||
methods: {
|
||||
// checkFHE(){//查询可用分红额度
|
||||
// this.$requst.post('order/bonus-info').then(res=>{
|
||||
// if(res.code==0){
|
||||
// this.usableAmount = res.data.bonus
|
||||
// this.percentage = res.data.bonus_deduction_rate
|
||||
// if(this.usableAmount==0){
|
||||
// this.placeCon = '暂无可用分红金额'
|
||||
// this.disf = true
|
||||
// }
|
||||
// this.infoArr[3].price = this.infoArr[0].price*(this.percentage/100)
|
||||
// // console.log(this.infoArr);
|
||||
// }
|
||||
// // console.log(res);
|
||||
// },error=>{})
|
||||
// },
|
||||
checkAddress(){//查询地址列表事件
|
||||
this.$requst.post('user/address').then(res=>{
|
||||
if(res.code==0){
|
||||
this.lenaddr = res.data.length
|
||||
if(this.listAddress==''){
|
||||
if(this.lenaddr!=0){
|
||||
res.data.forEach(item=>{
|
||||
if(item.is_default==1){
|
||||
this.listAddress = item
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
confirm(){//提交订单事件
|
||||
let ya = this
|
||||
// console.log(this.listAddress);
|
||||
if(this.lenaddr!=0){
|
||||
this.disabled = true
|
||||
this.btncon = '正在提交...'
|
||||
// console.log('数据:',this.orderInfo);
|
||||
// console.log('订单参数:',this.newsku_list);
|
||||
let orderObj = {
|
||||
sku_list: this.newsku_list,
|
||||
total: this.hPrice*100,
|
||||
address_id: this.listAddress.id,
|
||||
original_total: this.infoArr[0].price*100,
|
||||
bonus_amount: this.fhprice*100,
|
||||
bonus_deduction: this.infoArr[1].price*100,
|
||||
freight: this.orderInfo.freight,
|
||||
bonus: this.infoArr[3].price*100,
|
||||
remarks: this.orderBZ//买家备注
|
||||
}
|
||||
console.log('创建订单参数',orderObj);
|
||||
// console.log('随机数',this.$toolAll.tools.randomStr());
|
||||
this.$requst.post('order/create',orderObj).then(res=>{
|
||||
// console.log('调起结果',res);
|
||||
let dataInfo = res
|
||||
if(res.code==0){
|
||||
if(dataInfo.data.needPay){
|
||||
uni.requestPayment({
|
||||
provider: 'wxpay',
|
||||
appId:dataInfo.data.payment_params.appId,//appId
|
||||
timeStamp: dataInfo.data.payment_params.timeStamp,//时间戳
|
||||
nonceStr: dataInfo.data.payment_params.nonceStr,//随机字符串
|
||||
package: dataInfo.data.payment_params.package,//package
|
||||
signType: dataInfo.data.payment_params.signType,//MD5
|
||||
paySign: dataInfo.data.payment_params.sign,//签名
|
||||
success:(res)=> {
|
||||
this.btncon = '确认提交'
|
||||
this.isShow = true
|
||||
this.isSuccess = true
|
||||
this.title = '恭喜你,购买成功'
|
||||
this.content = '可以在个人中心--我的订单查看订单详情'
|
||||
// console.log('success:' + JSON.stringify(res));
|
||||
this.$requst.post('order/paid',{order_id:dataInfo.data.order_id}).then(result=>{
|
||||
// console.log('成功通知',result);
|
||||
},error=>{})
|
||||
},
|
||||
fail: (err)=> {
|
||||
// console.log('fail:' + JSON.stringify(err));
|
||||
this.disabled = false
|
||||
this.btncon = '确认提交'
|
||||
}
|
||||
});
|
||||
} else {
|
||||
this.btncon = '确认提交'
|
||||
this.isShow = true
|
||||
this.isSuccess = true
|
||||
this.title = '恭喜你,购买成功'
|
||||
this.content = '可以在个人中心--我的订单查看订单详情'
|
||||
// console.log('success:' + JSON.stringify(res));
|
||||
this.$requst.post('order/paid',{order_id:dataInfo.data.order_id}).then(result=>{
|
||||
// console.log('成功通知',result);
|
||||
},error=>{})
|
||||
}
|
||||
|
||||
}
|
||||
},error=>{})
|
||||
}else {
|
||||
this.$toolAll.tools.showToast('请先完善地址信息')
|
||||
setTimeout(function(){
|
||||
ya.chooseAddress()
|
||||
},500)
|
||||
}
|
||||
},
|
||||
changepopu(){
|
||||
this.isShow = false
|
||||
},
|
||||
clickfen(index){
|
||||
if(index==1){this.fhprice=''}
|
||||
index==1?this.isBtn = true : this.isBtn = false
|
||||
},
|
||||
chooseAddress(){
|
||||
uni.navigateTo({
|
||||
url:'/pagesB/adManagement/adManagement?isOrder=0'
|
||||
})
|
||||
},
|
||||
inputev(e){//分红金额输入框
|
||||
let val = e.target.value
|
||||
let ya =this
|
||||
let result = this.$toolAll.tools.checkPrice(val,ya.usableAmount)
|
||||
ya.len = result.len;
|
||||
ya.fhprice = result.val
|
||||
if(ya.fhprice>=100){
|
||||
ya.shijPrice = (ya.fhprice * ya.orderInfo.deduction_rate/100).toFixed(2)
|
||||
}
|
||||
},
|
||||
tankEv(){//立即使用事件
|
||||
if(this.shijPrice==''){this.shijPrice = '0.0'}
|
||||
if(this.fhprice<100){
|
||||
this.$toolAll.tools.showToast('抵扣金额最低 100')
|
||||
} else {
|
||||
this.infoArr[1].price = this.shijPrice
|
||||
if((this.infoArr[0].price - this.shijPrice)<=0){
|
||||
this.hPrice = 0
|
||||
} else {
|
||||
this.hPrice = this.infoArr[0].price - this.shijPrice
|
||||
}
|
||||
if((this.hPrice * this.percentage/100)==0){
|
||||
this.infoArr[3].price = '0.00'
|
||||
} else {
|
||||
this.infoArr[3].price = this.hPrice * this.percentage/100
|
||||
}
|
||||
this.isBtn = false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
|
@ -0,0 +1,88 @@
|
|||
<template>
|
||||
<view v-if="pageShow">
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav :statusBackw="true" :statusTitle="true" :title-val="'待评价'" :tabcolor="'#ffffff'"></status-nav>
|
||||
<view :style="{paddingTop:(statusHNH+10)+'px'}">
|
||||
<view v-if="dataArr.length!=0" class="margin-sx20 bacb padding-zy20">
|
||||
<view class="padding-sx30 borbot" v-for="(item,index) in dataArr" :key="index">
|
||||
<view class="disac" @tap="checkDetail(item.spu_id)">
|
||||
<image class="flexs goodsImg" :src="item.src" mode="aspectFill"></image>
|
||||
<view class="margin-z20">
|
||||
<view class="fon28 clips2">{{item.title}}</view>
|
||||
<view class="margin-sx10"><text class="fon26" style="color: #6f6f6f;">共{{item.num}}件</text><text class="bold fon26 margin-z10">¥<text class="fon32">{{item.price}}</text>.0</text></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="disba jcend">
|
||||
<view @tap="goEvaluated(index)" class="fon26 colorf78" style="border: 1rpx solid #FF7800;height: 60rpx;width: 150rpx;border-radius: 29.5rpx;text-align: center;line-height: 60rpx;">评价</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="dataArr.length==0" class="zanwu">暂无待评价商品记录</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
dataArr:[],
|
||||
page:1,
|
||||
size:50,
|
||||
statusHNH:uni.getStorageSync('statusHNH'),
|
||||
pageShow:false
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.$toolAll.tools.guoq()
|
||||
},
|
||||
onLoad() {
|
||||
this.checkDai()
|
||||
},
|
||||
methods: {
|
||||
checkDai(){//查询待评价列表
|
||||
this.$requst.post('user/order',{tag:'waiting_comment',page:this.page,size:this.size}).then(res=>{
|
||||
// console.log('待评价商品列表:',res);
|
||||
if(res.code==0){
|
||||
this.pageShow = true
|
||||
if(res.data.list.length!=0){
|
||||
res.data.list.forEach(item=>{
|
||||
item.skus.forEach(itemone=>{
|
||||
if(itemone.has_comment!='yes'){
|
||||
let orderObj = {
|
||||
id:item.id,
|
||||
orderId:itemone.order_id,
|
||||
danId:itemone.id,
|
||||
src:this.$http + itemone.sku_cover,
|
||||
title:itemone.spu_name,
|
||||
cate:itemone.sku_name,
|
||||
num:itemone.num,
|
||||
allprice:item.price/100,
|
||||
price:itemone.price/100,
|
||||
spu_id:itemone.spu_id
|
||||
}
|
||||
this.dataArr.push(orderObj)
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
goEvaluated(index){//去评价事件
|
||||
uni.setStorageSync('orderPing',this.dataArr[index])
|
||||
uni.navigateTo({
|
||||
url:'/pagesA/evaluate/evaluate'
|
||||
})
|
||||
},
|
||||
checkDetail(id){//查看详情事件
|
||||
uni.navigateTo({
|
||||
url:'/pagesA/productDetail/productDetail?id='+id
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
|
@ -0,0 +1,151 @@
|
|||
<template>
|
||||
<view class="">
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav :statusBackw="true" :statusTitle="true" :title-val="'评价'" :tabcolor="'#ffffff'"></status-nav>
|
||||
<view :style="{paddingTop:statusHNH+'px'}">
|
||||
<view class="margin-s20 bacb padding-zy20 borbot padding-x20">
|
||||
<view class="dis padding-sx30">
|
||||
<image class="flexs goodsImg" :src="orderPing.skuList[0].src" mode="aspectFill"></image>
|
||||
<view class="margin-z20">
|
||||
<view class="clips2 fon28 color33">{{orderPing.skuList[0].title}}</view>
|
||||
<view v-if="rateCon!=''" class="fon24 colorf78 margin-s20">已评价{{rateNum}}星,{{rateCon}}.</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="borbot"></view>
|
||||
<view class="disac fon30 padding-sx30">
|
||||
<view class="color33 margin-y20">商品评价</view>
|
||||
<rate :size="42" :gutter="20" v-model="rateNum" @change="chooseRate"></rate>
|
||||
<view class="color9">{{rateCon}}</view>
|
||||
</view>
|
||||
<view class="dis padding-sx30 padding-zy30" style="background-color: #f6f6f6;height: 144rpx;border-radius: 8rpx;">
|
||||
<image class="flexs" style="width: 32rpx;height: 35rpx;" src="/static/img/public/evaEdit.png" mode=""></image>
|
||||
<textarea v-model="content" style="height: auto;" maxlength="500" class="fon26 color9 margin-z20" placeholder="多方面描述评价宝,可以帮助等多想买的人哦!" />
|
||||
</view>
|
||||
<view class=" margin-s20 flexs disac flw padding-x40">
|
||||
<view v-if="imgSrc.length!=0" v-for="(item,index) in imgSrc" :key="index" class="posir margin-y20 margin-x20 pimg-box">
|
||||
<image @tap="previewImg(index)" style="border-radius: 8rpx;height: 159rpx;width: 159rpx;" :src="item" mode="aspectFill"></image>
|
||||
<image @tap="delimg(index)" class="posia" style="width: 30rpx;height: 30rpx;right: 6rpx;top: 6rpx;" src="/static/img/product/pclose.png" mode=""></image>
|
||||
</view>
|
||||
<view @tap="chooseImg" class="discc margin-x20" style="height: 159rpx;width: 159rpx;border: 1rpx dashed #9c9c9c;border-radius: 8rpx;">
|
||||
<image style="width: 63rpx;height: 57rpx;" src="/static/img/public/bussiness.png" mode=""></image>
|
||||
<view class="fon26 margin-s20" style="color: #7d7b7e;">添加图片</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="disbc">
|
||||
<button class="businessbtn" @tap="submit" :disabled="disabled">{{btncon}}</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import rate from '@/components/rate.vue';
|
||||
export default {
|
||||
components:{
|
||||
rate
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
imgSrc:[],
|
||||
rateNum:5,
|
||||
rateCon:'非常好',
|
||||
content:'',
|
||||
btncon:'提交评价',
|
||||
disabled:false,
|
||||
orderPing:{},
|
||||
chuanImg:'',
|
||||
statusHNH:uni.getStorageSync('statusHNH')
|
||||
}
|
||||
},
|
||||
onUnload() {
|
||||
uni.removeStorageSync('orderPing')
|
||||
},
|
||||
onLoad() {
|
||||
this.orderPing = uni.getStorageSync('orderPing')
|
||||
// console.log('数据:',this.orderPing);
|
||||
},
|
||||
onShow() {
|
||||
this.$toolAll.tools.guoq()
|
||||
},
|
||||
methods: {
|
||||
submit(){//提交评价事件
|
||||
this.disabled = true
|
||||
this.btncon = '正在提交评价...'
|
||||
let pingObj = {
|
||||
order_sku_id:this.orderPing.skuList[0].danId,
|
||||
grade:this.rateNum,
|
||||
content:this.content,
|
||||
images:this.chuanImg
|
||||
}
|
||||
// console.log(pingObj);
|
||||
this.$requst.post('order/comment-add',pingObj).then(res=>{
|
||||
// console.log(res);
|
||||
if(res.code==0){
|
||||
this.$toolAll.tools.showToast('提交评论成功')
|
||||
this.btncon = '提交评价'
|
||||
setTimeout(()=>{
|
||||
this.disabled = false
|
||||
uni.navigateTo({
|
||||
url:'/pagesA/myOrder/myOrder'
|
||||
})
|
||||
},500)
|
||||
}
|
||||
},error=>{
|
||||
this.disabled = false
|
||||
this.$toolAll.tools.showToast('提交评论失败')
|
||||
})
|
||||
},
|
||||
chooseRate(val){
|
||||
this.rateNum = val
|
||||
if(val==1){this.rateCon = '极差'}
|
||||
if(val==2){this.rateCon = '差'}
|
||||
if(val==3){this.rateCon = '一般'}
|
||||
if(val==4){this.rateCon = '好'}
|
||||
if(val==5){this.rateCon = '非常好'}
|
||||
},
|
||||
chooseImg(){
|
||||
uni.chooseImage({
|
||||
count:9,
|
||||
sizeType:['compressed'],
|
||||
success: (res) => {
|
||||
let len = res.tempFilePaths.length
|
||||
let imgArr = []
|
||||
res.tempFilePaths.forEach(item=>{
|
||||
this.$requst.upload('file/upload/image',{file:item}).then(res=>{
|
||||
// console.log('图片',res);
|
||||
if(res.code==0){// src原图
|
||||
let imgsrc = this.$http + res.data.src//缩略图
|
||||
imgArr.push(res.data.src)
|
||||
this.imgSrc.push(imgsrc)
|
||||
len--
|
||||
if(len!=0){
|
||||
uni.showToast({
|
||||
title:`正在上传第 ${len} 张`,
|
||||
icon:'loading'
|
||||
})
|
||||
} else {
|
||||
this.$toolAll.tools.showToast('图片上传成功(*^▽^*)')
|
||||
this.chuanImg = imgArr.join(',');
|
||||
}
|
||||
}
|
||||
},error=>{})
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
previewImg(index){//预览图片
|
||||
uni.previewImage({
|
||||
current:index,
|
||||
urls:this.imgSrc
|
||||
})
|
||||
},
|
||||
delimg(index){//删除图片
|
||||
this.imgSrc.splice(index,1)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
|
@ -0,0 +1,249 @@
|
|||
<template>
|
||||
<view>
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav class="statush" :statusBackw="true" :whereCome="whereCome*1" :statusTitle="true" :title-val="'我的订单'" :tabcolor="'#ffffff'">
|
||||
</status-nav>
|
||||
<view class="bacb" :style="{paddingTop:statusHNH+'px'}">
|
||||
<view class="disaa fon28 padding-sx20" :style="{top:ordertop}" style="position: fixed;left: 0;right: 0;z-index: 10;background-color: #FFFFFF;border-bottom: 1rpx solid #EEEEEE;">
|
||||
<view @tap="tapTab(index)" :class="current==index?'colorf78':''" v-for="(item,index) in tabArr"
|
||||
:key="index">{{item}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<swiper :current="current" @change="changec" :style="{height: (heightone-(statusHNH+40)) +'px',paddingTop:40+'px'}">
|
||||
<swiper-item class="swiper-item" v-for="(itemarr,indexarr) in dataArr.length" :key="indexarr">
|
||||
<scroll-view scroll-y="true" :style="{height: (height-(statusHNH+40)) +'px'}">
|
||||
<view v-if="dataArr[indexarr].length!=0" :class="'active'+index" v-for="(item,index) in dataArr[indexarr]" :key="index"
|
||||
class="padding-sx20 fon28 bacb margin-sx20 padding-zy30 item-box" style="border-radius: 5rpx;">
|
||||
<view class="fon24 color6 margin-s10">订单号:{{item.orderId}}</view>
|
||||
<view v-for="(itemsk,indexsk) in item.skuList" :key="indexsk" class="borbot margin-sx20">
|
||||
<view @tap="checkDetail(itemsk.spu_id,index)" class="disac posir padding-sx10 margin-x20">
|
||||
<image class="radius10 flexs goodsImg" :src="itemsk.src" mode="aspectFill"></image>
|
||||
<view class="margin-zy20" style="width: 52%;">
|
||||
<view class="fon32 clips2">{{itemsk.title}}</view>
|
||||
<view class="fon24 color9 margin-sx10 clips1">{{itemsk.cate}}</view>
|
||||
<view class="fon24 color6">X{{itemsk.num}}</view>
|
||||
</view>
|
||||
<view class="orderRight">
|
||||
<view class="fon24 colorf78 margin-x10">{{['','待发货','待收货','待评价','待付款'][item.status]}}</view>
|
||||
<view>¥<text class="fon36 bold">{{itemsk.price}}</text>.0</view>
|
||||
<view class="fon26 disac orderRights" style="" v-if="indexsk==(item.skuList.length-1)">
|
||||
<view class="flexs">实付款:</view><text class="colorf78">¥{{item.allprice}}.0</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="disac jcend">
|
||||
<!-- 查看物流 -->
|
||||
<view v-if="item.status==2" @tap="checkLogistics(item.orderId)" class="myorderbtn">查看物流</view>
|
||||
<!-- 晒单评价 -->
|
||||
<view v-if="item.status==3" @tap="goPing(index)" class="myorderbtn">{{pingCon}}</view>
|
||||
<!-- 申请售后 -->
|
||||
<view v-if="(item.status==2 || item.status==3) && item.is_after_sale==0" @tap="saleAfter(index)" class="myorderbtn">{{shouCon}}</view>
|
||||
<!-- 确认收获 -->
|
||||
<view v-if="item.status==2" @tap="confrimEv(index)" class="myorderbtn confrimbtn">确认收货</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="dataArr[indexarr].length==0" class="zanwu">暂无订单记录</view>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
<backTop :showTop="showTop" @backTop="backTop"></backTop>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import backTop from '@/components/backTop.vue';
|
||||
export default {
|
||||
components:{
|
||||
backTop
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
whereCome:0,
|
||||
tabArr: ['全部', '待发货', '待收货', '待评价'],
|
||||
current: 0,
|
||||
dataArr: [[],[],[],[]],
|
||||
height: 750,
|
||||
heightone:'',
|
||||
showTop:false,
|
||||
ordertab:'ordertop',
|
||||
tag:'all',
|
||||
total:'',
|
||||
size:50,
|
||||
page:1,
|
||||
pingCon:'评价晒单',
|
||||
shouCon:'申请售后',
|
||||
statusHNH:uni.getStorageSync('statusHNH')
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.$toolAll.tools.guoq()
|
||||
},
|
||||
onLoad(options) {
|
||||
// console.log(options);
|
||||
this.whereCome = options.index
|
||||
if(options.num!=undefined) this.current = options.num
|
||||
|
||||
// let obj = uni.createSelectorQuery().select('.ptwo-box')
|
||||
// obj.boundingClientRect(function (data) { // data - 各种参数
|
||||
// console.log(data.height)
|
||||
// }).exec()
|
||||
// let obj1 = uni.createSelectorQuery().select('.statush')
|
||||
// obj1.boundingClientRect(function (data) { // data - 各种参数
|
||||
// console.log(data.height)
|
||||
// }).exec()
|
||||
this.checkList()
|
||||
this.setHeight();
|
||||
},
|
||||
onPageScroll(e) {
|
||||
e.scrollTop > 360 ? this.showTop = true : this.showTop = false
|
||||
},
|
||||
methods: {
|
||||
// 查询订单列表事件
|
||||
checkList(){//tag传参 all:全部 waiting_comment:待评价 paid:已付款 expired:已过期 shipped:已发货 waiting:待付款
|
||||
let ya = this
|
||||
this.dataArr = [[],[],[],[]]
|
||||
this.$requst.post('user/order',{tag:this.tag,page:this.page,size:this.size}).then(res=>{
|
||||
// console.log('订单数据',res);
|
||||
if(res.code==0){
|
||||
if(res.data.list.length!=0){
|
||||
let list = []
|
||||
res.data.list.forEach(item=>{
|
||||
let numStatus = ''
|
||||
let newArr = []
|
||||
if(item.status=='paid') numStatus = 1
|
||||
if(item.status=='shipped') numStatus = 2
|
||||
if(item.status=='completed') numStatus = 3
|
||||
if(item.status=='waiting') numStatus = 4
|
||||
item.skus.forEach(itemone=>{
|
||||
let orderObj = {
|
||||
danId:itemone.id,
|
||||
spu_id:itemone.spu_id,
|
||||
src:this.$http + itemone.sku_cover,
|
||||
title:itemone.spu_name,
|
||||
cate:itemone.sku_name,
|
||||
num:itemone.num,
|
||||
price:itemone.price/100,
|
||||
}
|
||||
newArr.push(orderObj)
|
||||
// this.pingCon = '追加评价'
|
||||
})
|
||||
let listObj = {
|
||||
id:item.id,
|
||||
orderId:item.order_id,
|
||||
allprice:item.price/100,
|
||||
is_after_sale:item.is_after_sale,
|
||||
status:numStatus,
|
||||
skuList:newArr,
|
||||
original_price:item.original_price/100
|
||||
}
|
||||
ya.dataArr[0].push(listObj)
|
||||
if(numStatus==1){ya.dataArr[1].push(listObj)}
|
||||
if(numStatus==2){ya.dataArr[2].push(listObj)}
|
||||
if(numStatus==3){ya.dataArr[3].push(listObj)}
|
||||
})
|
||||
// console.log(ya.dataArr);
|
||||
}
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
confrimEv(index){
|
||||
// console.log('id:',this.dataArr[this.current][index].id);//订单ID
|
||||
uni.showModal({
|
||||
content:'是否确认收货?',
|
||||
cancelText:'否',
|
||||
cancelColor:'#999999',
|
||||
confirmText:'是',
|
||||
confirmColor:'#ff7800',
|
||||
success: (res) => {
|
||||
if(res.confirm){
|
||||
this.$requst.post('order/accepted',{order_id:this.dataArr[this.current][index].id}).then(res=>{
|
||||
// console.log('确认收货返回数据:',res);
|
||||
if(res.code==0){
|
||||
this.$toolAll.tools.showToast('收货成功(*^▽^*)')
|
||||
this.checkList()
|
||||
}
|
||||
},error=>{})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
backTop(){
|
||||
uni.pageScrollTo({
|
||||
scrollTop: 0,
|
||||
duration: 300
|
||||
});
|
||||
},
|
||||
goPing(index){//去评价事件
|
||||
// console.log(this.current,this.dataArr[this.current]);
|
||||
uni.setStorageSync('orderPing',this.dataArr[this.current][index])
|
||||
uni.navigateTo({
|
||||
url:'/pagesA/evaluate/evaluate'
|
||||
})
|
||||
},
|
||||
tapTab(index) {//tab改变事件
|
||||
this.current = index
|
||||
// this.qiehuanEv(index)
|
||||
},
|
||||
changec(e) {//滑动事件
|
||||
// console.log(e);
|
||||
this.current = e.detail.current
|
||||
// this.qiehuanEv(this.current)
|
||||
},
|
||||
qiehuanEv(index){
|
||||
let ya = this
|
||||
switch (index){
|
||||
case 0:
|
||||
this.tag = 'all'
|
||||
break;
|
||||
case 1:
|
||||
this.tag = 'paid'
|
||||
break;
|
||||
case 2:
|
||||
this.tag = 'shipped'
|
||||
break;
|
||||
case 3:
|
||||
this.tag = 'waiting_comment'
|
||||
break;
|
||||
}
|
||||
setTimeout(function(){
|
||||
ya.checkList()
|
||||
},500)
|
||||
},
|
||||
setHeight() {
|
||||
let windowHeight = uni.getSystemInfoSync().screenHeight; //页面可见区域
|
||||
// console.log(windowHeight);
|
||||
this.heightone = windowHeight
|
||||
// windowHeight = windowHeight - 44; //页面可见区域 - 在线购物条高度
|
||||
var query = uni.createSelectorQuery();
|
||||
query.in(this).select('.item-box').boundingClientRect(rect => {
|
||||
// if (rect) {
|
||||
this.height = windowHeight; //页面可见区域 - 头部高度
|
||||
// console.log(this.height);
|
||||
// }
|
||||
}).exec();
|
||||
},
|
||||
checkLogistics(orderId){//查询物流事件
|
||||
uni.navigateTo({
|
||||
url:'/pagesA/viewLogistics/viewLogistics?orderId='+orderId
|
||||
})
|
||||
},
|
||||
saleAfter(index){//售后服务事件
|
||||
uni.setStorageSync('afterOrder',this.dataArr[this.current][index])
|
||||
uni.navigateTo({
|
||||
url:'/pagesA/applyAfterSales/applyAfterSales'
|
||||
})
|
||||
},
|
||||
checkDetail(id,index){//查看详情事件
|
||||
// console.log('订单ID',id);
|
||||
uni.navigateTo({
|
||||
url:'/pagesA/productDetail/productDetail?id='+id
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
|
@ -0,0 +1,348 @@
|
|||
<template>
|
||||
<view class="padding-x120">
|
||||
<status-nav :statusBackw="true" :whereCome="whereCome*1" :statusTitle="true" :title-val="titleVal" :tabcolor="'#ffffff'"></status-nav>
|
||||
<view v-if="pageShow">
|
||||
<!-- 使用标题栏 -->
|
||||
<view class="bacb padding-x20" :style="{paddingTop:(statusHNH+10)+'px'}">
|
||||
<!-- 图片 -->
|
||||
<image :src="zhuImg" mode="aspectFit" style="height: 682rpx;width: 100%;margin-top: 20rpx;"></image>
|
||||
<view class="margin20">
|
||||
<view class="disba">
|
||||
<!-- 现价、原价 -->
|
||||
<view>
|
||||
<view class="colorf78 fon24 bold">¥<text class="fon36">{{proDetailTwo.cur_price/100}}</text>.00</view>
|
||||
<view class="color9 fon24 dis">原价<text style="text-decoration: line-through;">¥{{proDetailTwo.price/100}}.00</text></view>
|
||||
</view>
|
||||
<!-- 收藏 -->
|
||||
<view class="discc" @tap="collection(proDetail.id)">
|
||||
<image v-if="isCollection" style="width: 40rpx; height: 38rpx;" src="/static/img/public/shouc.png" mode=""></image>
|
||||
<image v-else class="animated bounceIn" style="width: 40rpx; height: 38rpx;" src="/static/img/public/shoucactive.png" mode=""></image>
|
||||
<view class="fon24 color9 margin-s10">收藏</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="color33 fon32 margin-sx16 clips2">{{proDetail.name}}</view>
|
||||
<view class="fon24 color9">{{proDetail.sub_title}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 商品评价 -->
|
||||
<view class="margin-s20 bacb">
|
||||
<view class="disba padding-sx20 padding-zy20">
|
||||
<view class="fon32 bold">商品评价({{evalTotal}})</view>
|
||||
<view class="disac">
|
||||
<view @tap="checkAllp(proDetail.id)" class="fon26 color9 margin-y10">查看全部</view>
|
||||
<image style="width: 12rpx;height: 22rpx;" src="/static/img/my/youj.png" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 评价列表 -->
|
||||
<evaluateList :eval-arr="evalArr" :isEval="true" :isShow="false" :len="2"></evaluateList>
|
||||
</view>
|
||||
<!-- 商品详情 -->
|
||||
<view class="disbcac padding-sx40">
|
||||
<view class="gouwcxian "></view>
|
||||
<image class="margin-zy20 margin-s10 gouwchh" src="/static/img/gouwc/heh.png" mode=""></image>
|
||||
<view class="bold fon32">商品详情</view>
|
||||
<view class="gouwcxian margin-z20"></view>
|
||||
</view>
|
||||
<!-- 详情 -->
|
||||
<view class="padding20 bacb">
|
||||
<view class="fon32 bold margin-sx10" style="color: #353535;">规格与包装</view>
|
||||
<view class="disba fon24 color6 flw">
|
||||
<view class="disac margin-x10" style="width: 50%;" v-if="proDetail.brand_name!=''"><view style="width: 32%;" class="flexs"><text>品牌</text></view><view class="flexs clips1">: {{proDetail.brand_name}} </view></view>
|
||||
<view class="disac margin-x10" style="width: 50%;"><view style="width: 32%;" class="flexs">商品编号</view><view class="clips1">: {{proDetailTwo.coding}}</view></view>
|
||||
<view class="disac margin-x10" style="width: 50%;"><view style="width: 32%;" class="flexs">商品名称</view><view class="clips1">: {{proDetail.name}}</view></view>
|
||||
<view class="disac margin-x10" style="width: 50%;"><view style="width: 32%;" class="flexs">类别</view><view class="flexs clips1">: {{proDetail.category_name}}</view></view>
|
||||
<block v-for="(itemspec,indexspec) in proDetailTwo.own_spec" :key="indexspec">
|
||||
<view class="disac margin-x10" style="width: 50%;"><view style="width: 32%;" class="flexs">{{itemspec.name}}</view><view class="flexs clips1">:{{itemspec.value}}{{itemspec.unit}}</view></view>
|
||||
</block>
|
||||
<!-- <view class="disac margin-x10" style="width: 50%;"><view style="width: 32%;" class="flexs">容量(L)</view><view class="flexs clips1">: 其他</view></view>
|
||||
<view class="disac margin-x10" style="width: 50%;"><view style="width: 32%;" class="flexs">商品毛重</view><view class="flexs clips1">: 11.6kg</view></view> -->
|
||||
</view>
|
||||
<view class="margin-s20">
|
||||
<rich-text :nodes="detailCon"></rich-text>
|
||||
<!-- <image :src="itemimg.src" mode="widthFix" style="width: 100%;" v-for="(itemimg,indeximg) in detailImg" :key="indeximg"></image> -->
|
||||
</view>
|
||||
</view>
|
||||
<!-- 猜你喜欢 -->
|
||||
<view class="disbcac padding-sx40">
|
||||
<view class="gouwcxian "></view>
|
||||
<image class="margin-zy20 margin-s10 gouwchh" src="/static/img/gouwc/heh.png" mode=""></image>
|
||||
<view class="bold fon32">猜你喜欢</view>
|
||||
<view class="gouwcxian margin-z20"></view>
|
||||
</view>
|
||||
<!-- 喜欢列表 -->
|
||||
<twocoluList @addChe="addChe" :dataList="dataList"></twocoluList>
|
||||
<!-- 分享 -->
|
||||
<button v-if="showShare" data-name="shareBtn" open-type="share" plain="true" style="border: none;">
|
||||
<image class="zIn5 share animated pulse infinite" src="/static/img/product/share.png" mode=""></image>
|
||||
</button>
|
||||
<!-- 底部 -->
|
||||
<bottomkf :detail="proDetail" @diaoq="proDetailEv" :sku_img="sku_img"></bottomkf>
|
||||
<!-- 返回顶部 -->
|
||||
<backTop :showTop="showTop" @backTop="backTop"></backTop>
|
||||
</view>
|
||||
<view v-if="xiaj" class="zanwu">该商品已下架,将自动返回</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import twocoluList from '@/components/twocoluList.vue';
|
||||
import bottomkf from '@/components/bottomkf.vue';
|
||||
import evaluateList from '@/components/evaluateList.vue';
|
||||
import backTop from '@/components/backTop.vue';
|
||||
export default {
|
||||
components:{
|
||||
twocoluList,
|
||||
bottomkf,
|
||||
evaluateList,
|
||||
backTop
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
whereCome:0,
|
||||
dataInfo:{},
|
||||
dataList:[],
|
||||
guigArr:[],
|
||||
guigCurrent:0,
|
||||
num:1,
|
||||
isBtn:false,
|
||||
evalArr:[],
|
||||
showTop:false,
|
||||
isCollection:true,
|
||||
proDetail:{},
|
||||
zhuImg:'',
|
||||
detailImg:[],
|
||||
proDetailTwo:{},
|
||||
detailCon:'',
|
||||
order_sku_id:'',
|
||||
evalTotal:0,
|
||||
sku_img:'',
|
||||
page:1,
|
||||
size:50,
|
||||
only_image:0,
|
||||
statusHNH:uni.getStorageSync('statusHNH'),
|
||||
pageShow:false,
|
||||
titleVal:'',
|
||||
xiaj:false,//是否下架
|
||||
showShare:true
|
||||
}
|
||||
},
|
||||
onPageScroll(e) {
|
||||
e.scrollTop > 360 ? this.showTop = true : this.showTop = false
|
||||
},
|
||||
onShareAppMessage(options) {
|
||||
var ya = this;
|
||||
var shareObj = {
|
||||
title: ya.proDetail.name, // 默认是小程序的名称(可以写slogan等)
|
||||
path: '/pagesA/productDetail/productDetail?id='+ya.proDetail.id+"&index=2", // 默认是当前页面,必须是以‘/’开头的完整路径
|
||||
imageUrl: ya.zhuImg, //自定义图片路径,可以是本地文件路径、代码包文件路径或者网络图片路径,支持PNG及JPG,不传入 imageUrl 则使用默认截图。显示图片长宽比是 5:4
|
||||
success: function(res){
|
||||
// 转发成功之后的回调
|
||||
if(res.errMsg == 'shareAppMessage:ok'){
|
||||
|
||||
}
|
||||
},
|
||||
fail: function(res){
|
||||
// 转发失败之后的回调
|
||||
if(res.errMsg == 'shareAppMessage:fail cancel'){
|
||||
// 用户取消转发
|
||||
}else if(res.errMsg == 'shareAppMessage:fail'){
|
||||
// 转发失败,其中 detail message 为详细失败信息
|
||||
}
|
||||
}
|
||||
};
|
||||
// 来自页面内的按钮的转发
|
||||
if( options.from == 'button' ){
|
||||
var eData = options.target.dataset;
|
||||
//console.log( eData.name ); // shareBtn
|
||||
// 此处可以修改 shareObj 中的内容
|
||||
shareObj.path = '/pages/tabbar/my/my';
|
||||
}
|
||||
return shareObj;
|
||||
},
|
||||
onShow() {
|
||||
this.$toolAll.tools.guoq()
|
||||
if(uni.getStorageSync('is_active')==0) {
|
||||
this.showShare = false
|
||||
}
|
||||
uni.removeStorageSync('orderInfo')
|
||||
},
|
||||
onLoad(options) {
|
||||
let ya = this
|
||||
|
||||
if(uni.getStorageSync('token')!=''){
|
||||
let whereNum = options.index
|
||||
if(whereNum!=undefined) this.whereCome = whereNum
|
||||
this.checkDetail(options.id)
|
||||
this.like()
|
||||
} else {
|
||||
this.$toolAll.tools.showToast('您目前是游客,请登录')
|
||||
setTimeout(function(){
|
||||
uni.navigateTo({
|
||||
url:'/pages/login/login'
|
||||
})
|
||||
},2000)
|
||||
}
|
||||
// this.proDetail = uni.getStorageSync('proDetail')
|
||||
// this.zhuImg = this.$http + this.proDetail.main_sku.main_image
|
||||
// if(this.proDetail.main_sku.images.length!=0){
|
||||
// this.proDetail.main_sku.images.forEach(item=>{
|
||||
// let detailImgObj = {
|
||||
// src:this.$http+item.src
|
||||
// }
|
||||
// this.detailImg.push(detailImgObj)
|
||||
// })
|
||||
// }
|
||||
},
|
||||
methods:{
|
||||
like(){//查询猜你喜欢列表
|
||||
this.$requst.post('product/spu/guess',{page:this.page,size:this.size}).then(res=>{
|
||||
// console.log('猜你喜欢',res);
|
||||
if(res.code==0){
|
||||
if(res.data.list.length!=0){
|
||||
res.data.list.forEach(item=>{
|
||||
let likeObj = {
|
||||
id:item.main_sku.id,
|
||||
spu_id:item.id,
|
||||
src:this.$http + item.main_sku.main_image,
|
||||
title:item.name,
|
||||
price:item.main_sku.cur_price/100,
|
||||
tags:item.tags
|
||||
}
|
||||
this.dataList.push(likeObj)
|
||||
})
|
||||
}
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
proDetailEv(){
|
||||
this.sku_img = this.$http + this.proDetail.sku_list[0].main_image
|
||||
},
|
||||
checkDetail(id){//详情接口
|
||||
this.$requst.post('product/spu/detail',{id:id}).then(res=>{
|
||||
if(res.code==0){
|
||||
this.pageShow = true
|
||||
this.proDetail = res.data
|
||||
this.titleVal = this.proDetail.name
|
||||
if(res.data.is_collected==0) this.isCollection = true
|
||||
if(res.data.is_collected==1) this.isCollection = false
|
||||
if(res.data.sku_list.length!=0){
|
||||
for (let i = 0; i < res.data.sku_list.length; i++) {
|
||||
if(res.data.sku_list[i].is_main==1){
|
||||
this.proDetailTwo = res.data.sku_list[i]
|
||||
this.zhuImg = this.$http + res.data.sku_list[i].main_image
|
||||
this.order_sku_id = res.data.sku_list[i].id
|
||||
break;
|
||||
} else {
|
||||
this.proDetailTwo = res.data.sku_list[i]
|
||||
this.zhuImg = this.$http + res.data.sku_list[0].main_image
|
||||
this.order_sku_id = res.data.sku_list[0].id
|
||||
}
|
||||
}
|
||||
}
|
||||
this.detailCon = this.$toolAll.tools.escape2Html(this.proDetail.spu_detail.description)
|
||||
this.checkEval(this.proDetail.id)
|
||||
}
|
||||
// if(res.code==4004){
|
||||
|
||||
// }
|
||||
},error=>{
|
||||
this.xiaj = true
|
||||
setTimeout(function(){
|
||||
uni.navigateBack({delta:1})
|
||||
},1500)
|
||||
})
|
||||
},
|
||||
checkEval(id){//评论接口
|
||||
let allEvaluateObj = {
|
||||
spu_id:id,
|
||||
page:this.page,
|
||||
size:this.size,
|
||||
only_image:this.only_image
|
||||
}
|
||||
let pingArr = []
|
||||
this.$requst.post('product/spu/comment-list',allEvaluateObj).then(res=>{
|
||||
if(res.code==0){
|
||||
this.evalTotal = res.data.total
|
||||
if(res.data.list.length!=0){
|
||||
res.data.list.forEach((item,index)=>{
|
||||
let imgArr = []
|
||||
item.images.forEach(itemimg=>{
|
||||
let imgObj = {
|
||||
src:this.$http + itemimg
|
||||
}
|
||||
imgArr.push(imgObj)
|
||||
})
|
||||
let haveH = item.account.headimgurl.slice(0,4)
|
||||
if(haveH!='http') {
|
||||
haveH = this.$http
|
||||
} else haveH = ''
|
||||
let newname = this.$toolAll.tools.hideName(item.account.nickname)//隐藏姓名中间几位
|
||||
let evalObj = {
|
||||
src:haveH + item.account.headimgurl,
|
||||
name:newname,
|
||||
xingj:item.grade,
|
||||
content:item.content,
|
||||
title:item.orderSku.spu_name,
|
||||
time:item.created_at,
|
||||
imgList:imgArr
|
||||
}
|
||||
if(index<2){
|
||||
this.evalArr.push(evalObj)
|
||||
}
|
||||
pingArr.push(evalObj)
|
||||
})
|
||||
}
|
||||
}
|
||||
// console.log('pingArr:',pingArr);
|
||||
// console.log(res);
|
||||
},error=>{})
|
||||
},
|
||||
checkAllp(id){
|
||||
uni.setStorageSync('plOrder',this.proDetail)
|
||||
uni.navigateTo({url:'/pagesB/allEvaluate/allEvaluate?id='+id})
|
||||
},
|
||||
backTop(){
|
||||
uni.pageScrollTo({
|
||||
scrollTop: 0,
|
||||
duration: 300
|
||||
});
|
||||
},
|
||||
addChe(e){//加入购物车事件
|
||||
// console.log('加入购物车:'+e)
|
||||
this.$toolAll.tools.showToast('加入购物车'+e)
|
||||
},
|
||||
collection(id){
|
||||
if(uni.getStorageSync('is_active')==0) {
|
||||
this.$toolAll.tools.showToast('您目前是游客,请授权登录')
|
||||
setTimeout(()=>{
|
||||
uni.navigateTo({url:'/pages/login/login'})
|
||||
},1500)
|
||||
} else {
|
||||
// console.log('收藏商品ID',id);
|
||||
let newApi = ''
|
||||
if(this.isCollection==true){//添加收藏事件
|
||||
this.$requst.post('user/collection-add',{spu_id:id}).then(res=>{
|
||||
// console.log(res);
|
||||
if(res.code==0){
|
||||
this.isCollection = false
|
||||
uni.showToast({title:'收藏成功',icon:'none'})
|
||||
}
|
||||
},error=>{})
|
||||
} else {//取消收藏事件
|
||||
// console.log('信息',this.proDetail);
|
||||
this.$requst.post('user/collection-del',{spu_id:id}).then(res=>{
|
||||
// console.log(res);
|
||||
if(res.code==0){
|
||||
this.isCollection = true
|
||||
uni.showToast({title:'取消成功',icon:'none'})
|
||||
}
|
||||
},error=>{})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
|
@ -0,0 +1,97 @@
|
|||
<template>
|
||||
<view v-if="pageShow">
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav class="statush" :statusBackw="true" :statusTitle="true" :title-val="'查看物流'" :tabcolor="'#ffffff'"></status-nav>
|
||||
<view class="bacb padding-zy20 padding-sx30" :style="{paddingTop:statusHNH+'px'}">
|
||||
<view class="disba margin-s30 margin-x20">
|
||||
<view class="fon30 bold">包裹已{{orderStatus}}</view>
|
||||
<view class="fon26 color9">{{orderTime}}</view>
|
||||
</view>
|
||||
<view class="dis">
|
||||
<image class="flexs goodsImg radius10" :src="orderImg" mode="aspectFill"></image>
|
||||
<view class="margin-z20 margin-s10">
|
||||
<view class="clips1 fon28">{{orderInfo.skus[0].spu_name}}</view>
|
||||
<view class="fon24 margin-sx20">订单号:{{orderInfo.order_id}}</view>
|
||||
<view class="fon28 color9 padding20 width100" style="background-color: #f8f8f8;border-radius: 2rpx;">
|
||||
<view>您的包裹已成功{{orderResult}}</view>
|
||||
<view class="clips1 margin-s20">物流公司:{{orderInfo.express_name}}</view>
|
||||
<view class="disba">
|
||||
<view class="clips1">运单编号:{{orderInfo.express_number}}</view>
|
||||
<view class="flexs" @tap="copy" style="width: 94rpx;height: 60rpx;line-height: 60rpx;text-align: center;border-radius: 30.5rpx;border: 1rpx solid #999999;color: #000000;">复制</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
orderInfo:{},//订单详情
|
||||
orderImg:'',//订单图片
|
||||
orderStatus:'',//当前状态
|
||||
orderResult:'',//当前状态结果
|
||||
orderTime:'',//当前状态时间
|
||||
statusHNH:uni.getStorageSync('statusHNH'),
|
||||
pageShow:false
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.$toolAll.tools.guoq()
|
||||
},
|
||||
onLoad(options) {
|
||||
this.checkWl(options.orderId)
|
||||
},
|
||||
methods: {
|
||||
checkWl(orderId){//查看物流事件
|
||||
this.$requst.post('order/logistics',{order_id:orderId}).then(res=>{
|
||||
// console.log(res);
|
||||
if(res.code==0){
|
||||
this.pageShow = true
|
||||
this.orderInfo = res.data
|
||||
this.orderImg = this.$http + res.data.skus[0].sku_cover
|
||||
if(res.data.status=='shipped') {
|
||||
this.orderStatus = this.orderResult = '发货'
|
||||
}
|
||||
if(res.data.status=='completed') {
|
||||
this.orderStatus = '领取'
|
||||
this.orderResult = '取出'
|
||||
}
|
||||
if(res.data.express_info.status==500){
|
||||
let zdtime = res.data.skus[0].created_at//获取物流最新时间
|
||||
let jtime = zdtime.slice(0,10)//去除时分秒
|
||||
let ftime = jtime.split('-')//去除-
|
||||
this.orderTime = ftime[0].slice(2,4)+'/'+ftime[1]+'/'+ftime[2]
|
||||
} else {
|
||||
if(res.data.express_info.data.length!=0){
|
||||
let zdtime = res.data.express_info.data[0].time//获取物流最新时间
|
||||
let jtime = zdtime.slice(0,10)//去除时分秒
|
||||
let ftime = jtime.split('-')//去除-
|
||||
this.orderTime = ftime[0].slice(2,4)+'/'+ftime[1]+'/'+ftime[2]
|
||||
}
|
||||
}
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
copy(){
|
||||
uni.setClipboardData({
|
||||
data: this.orderInfo.express_number,
|
||||
success: function() {
|
||||
uni.showToast({
|
||||
title: '复制成功',
|
||||
duration: 2000,
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
|
@ -0,0 +1,108 @@
|
|||
<template>
|
||||
<view class="">
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav :statusBackw="true" :statusTitle="true" :whereCome="wherenum*1" :title-val="'地址管理'" :tabcolor="'#ffffff'"></status-nav>
|
||||
<!-- 地址信息 -->
|
||||
<view class="bacb padding-zy30 posir" :style="{paddingTop:statusHNH+'px'}">
|
||||
<view v-if="dataArr.length!=0" class="disba borbot" v-for="(item,index) in dataArr" :key="index">
|
||||
<view @tap="chooseAddress(index)" class="margin-sx40" style="margin-top: 20px;">
|
||||
<view class="fon28 color33 disac">
|
||||
<view v-if="item.is_default==1" class="fon24 colorb margin-y20 btnaddress" style="background-color: #e91111;">默认</view>
|
||||
<!-- <view v-if="item.tag==1" class="fon24 colorb margin-y20 btnaddress" style="background-color: #ffc600;">{{item.tag}}</view> -->
|
||||
<view class="fon28 color33">{{item.name}} {{item.phone}}</view>
|
||||
</view>
|
||||
<view class="fon30 bold margin-sx10">{{item.address}}</view>
|
||||
<view class="fon28 color33">{{item.province_str}} {{item.city_str}} {{item.county_str}}</view>
|
||||
</view>
|
||||
<view>
|
||||
<image @tap="updateAddress(index,item.id)" style="width: 27rpx;height: 26rpx;margin-right: 20rpx;" src="/static/img/order/addEdit.png" mode=""></image>
|
||||
<image @tap="delAddress(index,item.id)" style="width: 33rpx;height: 33rpx;" src="/static/img/gouwc/del.png" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="dataArr.length==0" class="zanwu">暂无收货地址</view>
|
||||
</view>
|
||||
<view class="disbc" style="position: fixed;bottom: 40px;left: 60px;right: 60px;">
|
||||
<view @tap="updateAddress('-1',0)" class="colorb fon30 addbtn">+新建收货地址</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
dataArr:[],
|
||||
wherenum:0,
|
||||
isOrder:'',
|
||||
statusHNH:uni.getStorageSync('statusHNH')
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.$toolAll.tools.guoq()
|
||||
this.checkAddress()
|
||||
},
|
||||
onLoad(options) {
|
||||
this.wherenum = options.wherenum;
|
||||
if(options.isOrder!=undefined) this.isOrder = options.isOrder
|
||||
},
|
||||
methods: {
|
||||
checkAddress(){//查询地址列表事件
|
||||
this.$requst.post('user/address').then(res=>{
|
||||
this.dataArr = res.data
|
||||
// console.log(this.dataArr);
|
||||
if(this.dataArr.length!=0){
|
||||
// let obj = this.dataArr.filter(item=>item.isMo==true)//返回找到的对象
|
||||
let index = this.dataArr.findIndex((v) => {//找到是否有默认地址
|
||||
return v.is_default == 1;
|
||||
});
|
||||
let newArr = this.dataArr.splice(index,1)//有删除改地址
|
||||
this.dataArr.unshift(newArr[0])//插入改地址到第一位
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
chooseAddress(index){//选中当前地址作为收货地址
|
||||
// console.log('选择当前地址:'+index);
|
||||
if(this.isOrder!=''){
|
||||
uni.setStorageSync('isAddr',this.dataArr[index])
|
||||
uni.navigateTo({
|
||||
url:'/pagesA/confirmOrder/confirmOrder?index=3'
|
||||
})
|
||||
}
|
||||
},
|
||||
updateAddress(index,id){//编辑地址事件
|
||||
// console.log('新增/编辑地址:'+index);
|
||||
if(index!='-1'){
|
||||
uni.setStorageSync('updataAddress',this.dataArr[index])
|
||||
}
|
||||
uni.navigateTo({
|
||||
url:'/pagesB/newAddress/newAddress'
|
||||
})
|
||||
},
|
||||
delAddress(index,id){//删除地址事件
|
||||
// console.log('删除地址:'+id);
|
||||
uni.showModal({
|
||||
title:'提示:',
|
||||
content:`确定要删除 " ${this.dataArr[index].name} " 的地址吗?`,
|
||||
cancelText:'取消',
|
||||
cancelColor:'#999999',
|
||||
confirmText:'确定',
|
||||
confirmColor:'#164396',
|
||||
success: (res) => {
|
||||
if(res.confirm){
|
||||
this.$requst.post('user/address-del',{id:id}).then(res=>{
|
||||
uni.showToast({
|
||||
title:'删除地址成功',
|
||||
icon:'none'
|
||||
})
|
||||
this.checkAddress()//重新执行查询地址
|
||||
},error=>{})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
|
@ -0,0 +1,95 @@
|
|||
<template>
|
||||
<view style="padding-bottom: 120rpx;" v-if="pageShow">
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav :statusBackw="true" :statusTitle="true" :title-val="'商品评价'" :tabcolor="'#ffffff'"></status-nav>
|
||||
<view class="bacb padding-x20" :style="{marginTop:(statusHNH+10)+'px'}" style="background-color: #F5F5F5;">
|
||||
<!-- 列表 -->
|
||||
<evaluateList :eval-arr="evalArr" :isEval="true"></evaluateList>
|
||||
</view>
|
||||
<!-- 客服 -->
|
||||
<bottomkf :detail="proDetail" @diaoq="proDetailEv" :sku_img="sku_img"></bottomkf>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import bottomkf from '@/components/bottomkf.vue';
|
||||
import evaluateList from '@/components/evaluateList.vue';
|
||||
export default {
|
||||
components:{
|
||||
bottomkf,
|
||||
evaluateList
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
evalArr:[],
|
||||
page:1,
|
||||
size:50,
|
||||
only_image:0,
|
||||
proDetail:'',
|
||||
sku_img:'',
|
||||
statusHNH:uni.getStorageSync('statusHNH'),
|
||||
pageShow:false
|
||||
}
|
||||
},
|
||||
onUnload() {
|
||||
uni.removeStorageSync('plOrder')
|
||||
},
|
||||
onLoad(options) {
|
||||
this.checkAllEvaluate(options.id)
|
||||
this.proDetail = uni.getStorageSync('plOrder')
|
||||
},
|
||||
onShow() {
|
||||
this.$toolAll.tools.guoq()
|
||||
},
|
||||
methods: {
|
||||
proDetailEv(){
|
||||
this.sku_img = this.$http + this.proDetail.sku_list[0].main_image
|
||||
},
|
||||
checkAllEvaluate(id){//查看所有评论列表事件
|
||||
let allEvaluateObj = {
|
||||
spu_id:id,
|
||||
page:this.page,
|
||||
size:this.size,
|
||||
only_image:this.only_image
|
||||
}
|
||||
this.$requst.post('product/spu/comment-list',allEvaluateObj).then(res=>{
|
||||
// console.log('所有评论信息:',res);
|
||||
if(res.code==0){
|
||||
this.pageShow = true
|
||||
if(res.data.list.length!=0){
|
||||
res.data.list.forEach(item=>{
|
||||
let imgArr = []
|
||||
item.images.forEach(itemimg=>{
|
||||
let imgObj = {
|
||||
src:this.$http + itemimg
|
||||
}
|
||||
imgArr.push(imgObj)
|
||||
})
|
||||
let newname = this.$toolAll.tools.hideName(item.account.nickname)//隐藏姓名中间几位
|
||||
let haveH = item.account.headimgurl.slice(0,4)
|
||||
if(haveH!='http') {
|
||||
haveH = this.$http
|
||||
} else haveH = ''
|
||||
let evalObj = {
|
||||
src:haveH + item.account.headimgurl,
|
||||
name:newname,
|
||||
xingj:item.grade,
|
||||
content:item.content,
|
||||
title:item.orderSku.spu_name,
|
||||
time:item.created_at,
|
||||
imgList:imgArr
|
||||
}
|
||||
this.evalArr.push(evalObj)
|
||||
})
|
||||
// console.log(this.evalArr);
|
||||
}
|
||||
}
|
||||
},error=>{})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
|
@ -0,0 +1,145 @@
|
|||
<template>
|
||||
<view class="">
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav :statusBackw="true" :statusTitle="true" :whereCome="1" :title-val="'商务合作'" :tabcolor="'#ffffff'"></status-nav>
|
||||
<!-- 合作列表 -->
|
||||
<view class="bacb padding-zy20 posir" :style="{marginTop:statusHNH+'px'}">
|
||||
<view class="disbc flw padding-zy10 padding-sx30">
|
||||
<view class="fon36 bold">商务合作</view>
|
||||
<view class="fon24 margin-s10" style="text-align: center;">
|
||||
<rich-text :nodes="businessCon"></rich-text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="padding-zy20 margin-s20 business-box">
|
||||
<input class="fon24 businessInput" type="text" v-model="name" placeholder="姓名" />
|
||||
</view>
|
||||
<view class="padding-zy20 margin-s20 business-box">
|
||||
<input class="fon24 businessInput" type="number" v-model="phone" maxlength="11" placeholder="电话号码" />
|
||||
</view>
|
||||
<view class="padding-zy20 margin-s20 business-box">
|
||||
<input class="fon24 businessInput" type="text" v-model="company" placeholder="公司名称" />
|
||||
</view>
|
||||
<view class="disac padding-x40">
|
||||
<view class=" margin-s20 flexs" style="">
|
||||
<view @tap="chooseImg" v-if="isChoose" class="discc" style="height: 159rpx;width: 159rpx;border: 1rpx dashed #9c9c9c;border-radius: 8rpx;">
|
||||
<image style="width: 63rpx;height: 57rpx;" src="/static/img/public/bussiness.png" mode=""></image>
|
||||
<view class="fon26 margin-s20" style="color: #7d7b7e;">添加图片</view>
|
||||
</view>
|
||||
<view v-else class="posir" style="height: 159rpx;width: 159rpx;border: 1rpx dashed #FFFFFF;">
|
||||
<image @tap="previewImg" v-if="imgSrc!=''" style="border-radius: 8rpx;height: 159rpx;width: 159rpx;" :src="imgSrc" mode="aspectFill"></image>
|
||||
<image @tap="delimg" class="posia" style="width: 30rpx;height: 30rpx;right: 6rpx;top: 6rpx;" src="/static/img/product/pclose.png" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="fon24 padding-z20" style="color: #727272;margin-top: -30rpx;">请上传公司营业执照照片</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="disbc">
|
||||
<button class="businessbtn" :disabled="disabled" @tap="submit">{{btncon}}</button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
businessCon:'',//商务合作描述
|
||||
isChoose:true,//是否显示照相机
|
||||
imgSrc:'',//选择后的图片路径
|
||||
name:'',
|
||||
phone:'',
|
||||
company:'',//公司名称
|
||||
disabled:false,
|
||||
btncon:'提交',//btn按钮文字
|
||||
statusHNH:uni.getStorageSync('statusHNH')
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.$toolAll.tools.guoq()
|
||||
},
|
||||
onLoad() {
|
||||
this.businessConEv()
|
||||
},
|
||||
watch:{
|
||||
imgSrc:function(newSrc,oldSrc){
|
||||
// console.log(newSrc);
|
||||
if(newSrc!=''){
|
||||
this.uploadImg()
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
businessConEv(){//查询商务合作内容
|
||||
this.$requst.post('user/business').then(res=>{
|
||||
this.businessCon = this.$toolAll.tools.escape2Html(res.data.content)
|
||||
},error=>{})
|
||||
},
|
||||
submit(){//提交商务合作信息
|
||||
if(!this.name){
|
||||
this.$toolAll.tools.showToast('请输入姓名o(╥﹏╥)o')
|
||||
} else if(!this.phone){
|
||||
this.$toolAll.tools.showToast('请输入电话号码o(╥﹏╥)o')
|
||||
} else if(this.$toolAll.tools.isPhone(this.phone)){
|
||||
this.$toolAll.tools.showToast('请输入正确的电话号码o(╥﹏╥)o')
|
||||
} else if(!this.company){
|
||||
this.$toolAll.tools.showToast('请输入公司名称o(╥﹏╥)o')
|
||||
} else if(!this.imgSrc) {
|
||||
this.$toolAll.tools.showToast('请添加营业执照照片o(╥﹏╥)o')
|
||||
} else {
|
||||
this.disabled = true
|
||||
this.btncon = '正在提交...'
|
||||
let paramBusiness = {
|
||||
company_name:this.company,//公司名称
|
||||
contact_name:this.name,//姓名
|
||||
phone:this.phone,//联系电话
|
||||
license:this.imgSrc//营业执照
|
||||
}
|
||||
// console.log(paramBusiness);
|
||||
this.$requst.post('user/business-apply',paramBusiness).then(res=>{
|
||||
if(res.code==0){
|
||||
this.$toolAll.tools.showToast('信息提交成功(*^▽^*)')
|
||||
this.name = ''
|
||||
this.phone = ''
|
||||
this.company = ''
|
||||
this.imgSrc = ''
|
||||
this.isChoose = true
|
||||
this.$toolAll.tools.setTime('','',2000)
|
||||
}
|
||||
},error=>{})
|
||||
}
|
||||
},
|
||||
uploadImg(){//获取压缩的图
|
||||
this.$requst.upload('file/upload/image',{file:this.imgSrc}).then(res=>{
|
||||
this.imgSrc = this.$http + res.data.src
|
||||
this.$toolAll.tools.showToast('图片上传成功(*^▽^*)')
|
||||
},error=>{})
|
||||
},
|
||||
chooseImg(){
|
||||
uni.chooseImage({
|
||||
count:1,
|
||||
sizeType:['original'],
|
||||
success: (res) => {
|
||||
this.isChoose = false
|
||||
this.imgSrc = res.tempFilePaths[0]
|
||||
},
|
||||
complete: (res) => {
|
||||
// console.log(res);
|
||||
}
|
||||
})
|
||||
},
|
||||
previewImg(){
|
||||
uni.previewImage({
|
||||
urls:[this.imgSrc]
|
||||
})
|
||||
},
|
||||
delimg(){
|
||||
this.isChoose = true
|
||||
this.imgSrc = ''
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
|
@ -0,0 +1,53 @@
|
|||
<template>
|
||||
<view class="">
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav :statusBackw="true" :statusTitle="true" :whereCome="1" :title-val="'分红规则'" :tabcolor="'#ffffff'"></status-nav>
|
||||
<view class=" bacb" :style="{paddingTop:statusHNH+'px'}">
|
||||
<view class="fon28 margin-zy40 padding-sx20 borbot" v-for="(item,index) in dataArr" :key="index">
|
||||
<view class="bold">{{item.title}}</view>
|
||||
<!-- <view class="color6 margin-s10">{{item.content}}</view> -->
|
||||
<view class="color6 margin-s10">
|
||||
<rich-text :nodes="item.content"></rich-text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="borbot padding-x30"></view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
dataArr:[
|
||||
{title:'分红获得规则',content:''},
|
||||
{title:'分红抵扣规则',content:''},
|
||||
{title:'分红提现规则',content:''},
|
||||
],
|
||||
statusHNH:uni.getStorageSync('statusHNH')
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.$toolAll.tools.guoq()
|
||||
},
|
||||
onLoad() {
|
||||
this.checkFenGZ()//查询分红规则事件
|
||||
},
|
||||
methods: {
|
||||
checkFenGZ(){
|
||||
this.$requst.post('user/bonus').then(res=>{
|
||||
// console.log('分红规则列表:',res);
|
||||
if(res.code==0){
|
||||
this.dataArr[0].content = res.data.get
|
||||
this.dataArr[1].content = res.data.deduct
|
||||
this.dataArr[2].content = res.data.withdraw
|
||||
}
|
||||
},error=>{})
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
|
@ -0,0 +1,101 @@
|
|||
<template>
|
||||
<view class="">
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav :statusBackw="true" :whereCome="whereCome*1" :statusTitle="true" :title-val="'立即提现'" :tabcolor="'#ffffff'"></status-nav>
|
||||
<view class=" bacb" :style="{paddingTop:statusHNH+'px'}">
|
||||
<view class="fon32 margin40 padding-x40">
|
||||
<view>可提现余额<text>{{allPrice}}</text>元</view>
|
||||
<view class="margin-sx40">可提现</view>
|
||||
<view class="fon28 bold padding-x30 disac" style="">
|
||||
<view class="margin-s10">¥</view><input :maxlength="maxLength" @input="priceInput" class="margin-z10" style="font-size: 38rpx;" type="number" v-model="inputPrice" placeholder="请输入要提现的金额" placeholder-style="color:#cccccc;"/>
|
||||
</view>
|
||||
<view class="borbot" style="margin-top: -10rpx;"></view>
|
||||
<!-- <view class="fon24 color9 margin-sx20">提现需要扣除<text>{{cost}}</text>%的手续费,实际到账金额<text class="cloor16">¥{{dangPrice}}</text></view> -->
|
||||
<view class="padding-sx20">
|
||||
<button @tap="submitT" :disabled="disabled" class="comebtn">立即提现</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 弹框 -->
|
||||
<successpopu :isShow="isShow" :isSuccess="isSuccess" :title="title" :content="content" @change="changepopu"></successpopu>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import successpopu from '@/components/successpopu.vue';
|
||||
export default {
|
||||
components:{
|
||||
successpopu
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
whereCome:0,
|
||||
allPrice:'',
|
||||
inputPrice:'',
|
||||
cost:5,
|
||||
dangPrice:'0.00',
|
||||
disabled:true,
|
||||
isShow:false,
|
||||
isSuccess:true,
|
||||
title:'',
|
||||
content:'',
|
||||
maxLength:10,
|
||||
ttype:'',//是否为分红提现、直卖提现
|
||||
statusHNH:uni.getStorageSync('statusHNH')
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.$toolAll.tools.guoq()
|
||||
},
|
||||
onLoad(options) {
|
||||
this.whereCome = options.index
|
||||
this.allPrice = options.price
|
||||
this.ttype = options.type
|
||||
},
|
||||
methods: {
|
||||
submitT(){//立即提现事件
|
||||
if(uni.getStorageSync('sm').name=='' || uni.getStorageSync('sm').phone){
|
||||
this.$toolAll.tools.showToast('请前往个人资料完善信息')
|
||||
} else if(this.inputPrice==0){
|
||||
uni.showToast({
|
||||
title:'请正确输入提现金额',
|
||||
icon:'none'
|
||||
})
|
||||
} else {
|
||||
this.disabled = true
|
||||
this.$requst.post('user/withdraw-apply',{withdraw_money:this.inputPrice,type:this.ttype}).then(res=>{
|
||||
// console.log('提现成功返回信息',res);
|
||||
if(res.code==0){
|
||||
this.isShow = true
|
||||
this.isSuccess = true
|
||||
this.title = '提现已申请'
|
||||
this.content = '提现申请已经提交成功,请耐心等待。'
|
||||
} else {
|
||||
this.$toolAll.tools.showToast(res.msg)
|
||||
}
|
||||
},error=>{
|
||||
|
||||
})
|
||||
}
|
||||
},
|
||||
changepopu(){//关闭弹框事件
|
||||
this.isShow = false
|
||||
},
|
||||
priceInput(e){//实时输入事件,input事件
|
||||
let val = e.target.value
|
||||
let ya =this
|
||||
let jieg = this.$toolAll.tools.checkPrice(val,ya.allPrice)
|
||||
ya.maxLength = jieg.len;
|
||||
ya.inputPrice = jieg.val
|
||||
ya.dangPrice = ya.inputPrice - (ya.inputPrice * ya.cost / 100).toFixed(2)
|
||||
let str = ya.dangPrice.toString();//转换成字符串
|
||||
let result = str.split('.')//变成数组
|
||||
result.length == 1 ? ya.dangPrice = ya.dangPrice+'.00' : ''
|
||||
ya.inputPrice.length == 0 ? ya.disabled = true : ya.disabled = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
|
@ -0,0 +1,169 @@
|
|||
<template>
|
||||
<view>
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav @inputConfirm="inputConfirm" :statusBackg="true" :statusInput="true" :whereCome="whereCome*1" :backgroudColor="'#ffffff'" :tabcolor="'#ffffff'"></status-nav>
|
||||
<!-- 搜索框 -->
|
||||
|
||||
<!-- 列表 -->
|
||||
<view class="padding20 bacb searchlist" v-if="productList.length!=0" :style="{marginTop:(statusHNH+10)+'px'}">
|
||||
<view @tap="goDetail(item.id)" class="disba padding-x30 padding-s20 borbot" v-for="(item,index) in productList" :key="index">
|
||||
<image class="proimg flexs radius10" :src="item.src"></image>
|
||||
<view class="padding-sx20 padding-z20 width100">
|
||||
<view class="clips2 fon28">{{item.title}}</view>
|
||||
<view class="fon24 color9 margin-sx10 clips1">{{item.content}}</view>
|
||||
<view class="dis flw">
|
||||
<label class="colorf6 fon24 radius16 pro margin-y10" v-for="(itemc,indexc) in item.cate" :key="indexc">{{itemc.name}}</label>
|
||||
</view>
|
||||
<view class="disba margin-s20">
|
||||
<view class="colorf6 fon24 bold">¥<text class="fon28">{{item.price}}</text>.0</view>
|
||||
<!-- 加入购物车图片 -->
|
||||
<image @tap.stop="addGou(item.id)" class="progc" src="/static/img/public/gouwcar.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="productList.length==0" class="zanwu">暂无相关产品</view>
|
||||
<backTop :showTop="showTop" @backTop="backTop"></backTop>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import backTop from '@/components/backTop.vue';
|
||||
export default {
|
||||
components:{
|
||||
backTop
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
current:0,
|
||||
chooseShai:false,
|
||||
isasce:true,
|
||||
productList:[],
|
||||
zanList:[],//暂存产品列表不显示
|
||||
shaiArr:[],
|
||||
shaiCurrent:0,
|
||||
isShai:false,
|
||||
yin:false,
|
||||
chuout:'',
|
||||
xiao:'',
|
||||
showTop:false,
|
||||
whereCome:2,
|
||||
page:1,
|
||||
size:50,
|
||||
cid:0,//分类ID
|
||||
filed:'',//默认:synthetical 取值view_amount、sale_amount、sort_price
|
||||
direction:'down',//取值down/up
|
||||
statusHNH:uni.getStorageSync('statusHNH')
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.$toolAll.tools.guoq()
|
||||
uni.showTabBar()
|
||||
uni.getStorageSync('whereCome') !='' ? this.whereCome = uni.getStorageSync('whereCome') : ''
|
||||
uni.removeStorageSync('proDetail')
|
||||
// console.log('清除产品详情缓存成功',uni.getStorageSync('proDetail'));
|
||||
this.filed = 'synthetical'
|
||||
this.cid = 0
|
||||
this.size = 10
|
||||
this.page = 1
|
||||
},
|
||||
onLoad() {
|
||||
this.checkList()
|
||||
},
|
||||
onPageScroll(e) {
|
||||
e.scrollTop > 360 ? this.showTop = true : this.showTop = false
|
||||
},
|
||||
methods: {
|
||||
inputConfirm(e){
|
||||
// console.log(e);
|
||||
this.keySearch(e)
|
||||
},
|
||||
keySearch(key){
|
||||
this.productList = []
|
||||
let paramCate ={
|
||||
page:this.page,
|
||||
size:this.size,
|
||||
sort_filed:this.filed,
|
||||
sort_direction:this.direction,
|
||||
keyword:key
|
||||
}
|
||||
this.$requst.post('product/spu/list',paramCate).then(res=>{
|
||||
// console.log('产品',res);
|
||||
if(res.data.list.length!=0){
|
||||
this.cid = res.data.list[0].cid//获取分类ID,以便加载更多使用
|
||||
this.zanList = res.data.list
|
||||
res.data.list.forEach(item=>{
|
||||
let cateObj = {
|
||||
id:item.id,//商品ID
|
||||
src:this.$http + item.main_sku.main_image,//商品图片
|
||||
title:item.name,//商品名称
|
||||
content:item.sub_title,//商品标题
|
||||
cate:item.tag_list,//标签列表
|
||||
price:item.main_sku.cur_price/100//商品原价
|
||||
}
|
||||
this.productList.push(cateObj)
|
||||
})
|
||||
} else {
|
||||
// this.$toolAll.tools.showToast('没找到相关产品o(╥﹏╥)o')
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
checkList(){
|
||||
this.productList = []
|
||||
let paramCate ={
|
||||
category_id:this.cid,
|
||||
page:this.page,
|
||||
size:this.size,
|
||||
sort_filed:this.filed,
|
||||
sort_direction:this.direction
|
||||
}
|
||||
this.$requst.post('product/spu/list',paramCate).then(res=>{
|
||||
// console.log('产品',res);
|
||||
if(res.data.list.length!=0){
|
||||
this.cid = res.data.list[0].cid//获取分类ID,以便加载更多使用
|
||||
this.zanList = res.data.list
|
||||
res.data.list.forEach(item=>{
|
||||
let cateObj = {
|
||||
id:item.id,//商品ID
|
||||
src:this.$http + item.main_sku.main_image,//商品图片
|
||||
title:item.name,//商品名称
|
||||
content:item.sub_title,//商品标题
|
||||
cate:item.tag_list,//标签列表
|
||||
price:item.main_sku.cur_price/100//商品原价
|
||||
}
|
||||
this.productList.push(cateObj)
|
||||
})
|
||||
} else {
|
||||
// this.$toolAll.tools.showToast('没找到相关产品o(╥﹏╥)o')
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
backTop(){//回到顶部事件
|
||||
uni.pageScrollTo({
|
||||
scrollTop: 0,
|
||||
duration: 300
|
||||
});
|
||||
this.isShai = false
|
||||
},
|
||||
addGou(e){//加入购物车
|
||||
// console.log('加入购物车'+e);
|
||||
// uni.showToast({title:'加入购物车'+e+'成功',icon:'none'})
|
||||
this.$requst.post('order/shopping-cart-add',{sku_id:e,num:1}).then(res=>{
|
||||
if(res.code==0){
|
||||
this.$toolAll.tools.showToast('添加购物车成功(*^▽^*)')
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
goDetail(id){//查看详情
|
||||
// console.log(id);
|
||||
uni.navigateTo({
|
||||
url:'/pagesA/productDetail/productDetail?id='+id
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
page {background-color: #f5f5f5;}
|
||||
</style>
|
|
@ -0,0 +1,119 @@
|
|||
<template>
|
||||
<view v-if="pageShow">
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav :statusBackw="true" :statusTitle="true" :whereCome="1" :title-val="'我的收藏'" :tabcolor="'#ffffff'"></status-nav>
|
||||
<view :style="{marginTop:(statusHNH+10)+'px'}">
|
||||
<view v-if="dataArr.length!=0" :class="current==index?'fadeOut':''" class="padding-sx20 fon28 bacb margin-sx20 padding-zy30 animated " style="border-radius: 5rpx;" v-for="(item,index) in dataArr" :key="index">
|
||||
<view @tap="goDetail(item.sku.spu_id)" class="margin-sx20 disac posir borbot">
|
||||
<image class="radius10 flexs" style="width: 215rpx;height: 215rpx;" :src="item.sku.main_image" mode="aspectFill"></image>
|
||||
<view class="margin-z20 width100">
|
||||
<view class="fon28 clips2">{{item.spu.name}}</view>
|
||||
<view class="colorf78 margin-sx10">¥<text class="fon36 bold ">{{item.sku.price/100}}</text>.0</view>
|
||||
<view class="dis" style="justify-content:flex-end">
|
||||
<view @tap.stop="canleCollection(item.id,index)" class="fon26 margin-s20 flexs" style="padding: 12rpx;border-radius: 60rpx;border: 1rpx solid #bababa;width: 28%;text-align: center;">取消收藏</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="dataArr.length==0" class="zanwu" @tap="goList">暂无更多收藏,赶快去收藏吧</view>
|
||||
</view>
|
||||
<backTop :showTop="showTop" @backTop="backTop"></backTop>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import backTop from '@/components/backTop.vue';
|
||||
export default {
|
||||
components:{
|
||||
backTop
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dataArr:[],
|
||||
showTop:false,
|
||||
current:'-1',
|
||||
page:1,
|
||||
size:50,
|
||||
statusHNH:uni.getStorageSync('statusHNH'),
|
||||
pageShow:false
|
||||
}
|
||||
},
|
||||
onPageScroll(e) {
|
||||
e.scrollTop > 360 ? this.showTop = true : this.showTop = false
|
||||
},
|
||||
onLoad() {
|
||||
|
||||
},
|
||||
onShow() {
|
||||
this.$toolAll.tools.guoq()
|
||||
this.checkCon()
|
||||
},
|
||||
methods: {
|
||||
goDetail(id){
|
||||
uni.navigateTo({
|
||||
url:'/pagesA/productDetail/productDetail?id='+id
|
||||
})
|
||||
},
|
||||
checkCon(){//查询收藏列表
|
||||
this.dataArr = []
|
||||
this.$requst.post('user/collection').then(res=>{
|
||||
// console.log('收藏列表',res);
|
||||
if(res.code==0){
|
||||
this.pageShow = true
|
||||
if(res.data.length!=0){
|
||||
res.data.forEach(item=>{
|
||||
let obj = {
|
||||
id:item.id,
|
||||
sku:{
|
||||
coding:item.sku.coding,
|
||||
id:item.sku.id,
|
||||
main_image:this.$http + item.sku.main_image,
|
||||
price:item.sku.price,
|
||||
spu_id:item.sku.spu_id
|
||||
},
|
||||
spu:{
|
||||
id:item.spu.id,
|
||||
name:item.spu.name
|
||||
},
|
||||
spu_id:item.spu_id
|
||||
}
|
||||
this.dataArr.push(obj)
|
||||
})
|
||||
}
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
backTop(){
|
||||
uni.pageScrollTo({
|
||||
scrollTop: 0,
|
||||
duration: 300
|
||||
});
|
||||
},
|
||||
canleCollection(id,index){//取消收藏事件
|
||||
let ya = this
|
||||
this.current = index
|
||||
// console.log('取消收藏ID',id);
|
||||
// console.log(id);
|
||||
this.$requst.post('user/collection-del',{id:id,spu_id:0}).then(res=>{
|
||||
// console.log(res);
|
||||
if(res.code==0){
|
||||
uni.showToast({title:'取消成功',icon:'none'})
|
||||
setTimeout(function(){
|
||||
ya.dataArr.splice(index,1)
|
||||
ya.current = '-1'
|
||||
},500)
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
goList(){//去产品列表
|
||||
uni.switchTab({
|
||||
url:'/pages/tabbar/product/product'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
|
@ -0,0 +1,247 @@
|
|||
<template>
|
||||
<view class="">
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav :statusBackw="true" :statusTitle="true" :whereCome="0" :title-val="'地址管理'" :tabcolor="'#ffffff'"></status-nav>
|
||||
<!-- 地址信息 -->
|
||||
<view class="bacb padding-zy20 posir padding-sx30" :style="{paddingTop:statusHNH+'px'}">
|
||||
<view class="disba fon24 color33 borbot padding-sx20">
|
||||
<view style="width: 16%;" class="flexs margin-y10">收货人</view>
|
||||
<input class="width100 fon24" style="" type="text" v-model="name" placeholder="请填写收货人姓名" placeholder-style="font-size:24rpx;"/>
|
||||
</view>
|
||||
<view class="disac fon24 color33 borbot padding-sx20">
|
||||
<view class="flexs" style="width: 16%;">手机号码</view>
|
||||
<view class="disac width100">
|
||||
<view class="flexs">+86</view>
|
||||
<input class="width100 margin-z10 fon24" type="number" maxlength="11" v-model="phone" placeholder="请填写收货人的手机号码" placeholder-style="font-size:24rpx;"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="disba fon24 color33 borbot padding-sx20">
|
||||
<view style="width: 16%;" class="flexs margin-y10">所在地区</view>
|
||||
<input @tap="openPicker" disabled class="width100 fon24" style="" type="text" v-model="region" placeholder="省市区县、乡镇等" placeholder-style="font-size:24rpx;"/>
|
||||
</view>
|
||||
<view class="dis fon24 color33 borbot padding-sx20">
|
||||
<view style="width: 16%;" class="flexs margin-y10">详细地址</view>
|
||||
<textarea class="width100 fon24" v-model="address" style="height: 200rpx;" placeholder="街道、楼牌号等" placeholder-style="font-size:24rpx;"/>
|
||||
</view>
|
||||
<view class="borbot"></view>
|
||||
</view>
|
||||
<view class="bacb margin-s20 padding-zy20 padding-sx30">
|
||||
<view class="disba">
|
||||
<view class="fon28">设置为默认地址</view>
|
||||
<liSwitch :checked="switch_state" @change="switchChange1"></liSwitch>
|
||||
</view>
|
||||
<view class="fon24 color9">提醒:每次下单会默认推荐使用该地址</view>
|
||||
</view>
|
||||
<view class="disbc" style="position: fixed;bottom: 40px;left: 60px;right: 60px;">
|
||||
<view @tap="saveAddress" class="colorb fon30 addbtn">保存</view>
|
||||
</view>
|
||||
<city @choseVal="choseValue" :lotusAddressData="lotusAddressData"></city>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import liSwitch from '@/components/li-switch.vue';
|
||||
import city from '@/components/city/city.js';
|
||||
import amap from '../../jsFile/amap-wx.js'
|
||||
export default {
|
||||
components:{
|
||||
liSwitch,
|
||||
city
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
name:'',
|
||||
phone:'',
|
||||
address:'',
|
||||
switch_state: true,
|
||||
updateId:'',
|
||||
lotusAddressData:{
|
||||
visible:false,
|
||||
provinceName:'',
|
||||
cityName:'',
|
||||
townName:'',
|
||||
},
|
||||
region:'',
|
||||
regionObj:{
|
||||
province:'',
|
||||
provinceCode:'',
|
||||
city:'',
|
||||
cityCode:'',
|
||||
town:'',
|
||||
townCode:''
|
||||
},
|
||||
amapPlugin: null, //new地图
|
||||
key: '20e98934067a5cf96d8da862fe561787',
|
||||
lat:'',//纬度
|
||||
lng:'',//经度
|
||||
statusHNH:uni.getStorageSync('statusHNH'),
|
||||
newProvice:'',
|
||||
newCity:'',
|
||||
newDistrict:''
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
let obj = uni.getStorageSync('updataAddress');
|
||||
if(obj!=''){
|
||||
this.updateId = obj.id
|
||||
this.name = obj.name
|
||||
this.phone = obj.phone
|
||||
this.address = obj.address
|
||||
this.regionObj.provinceCode = obj.province
|
||||
this.regionObj.cityCode = obj.city
|
||||
this.regionObj.townCode = obj.county
|
||||
this.regionObj.province = obj.province_str
|
||||
this.regionObj.city = obj.city_str
|
||||
this.regionObj.town = obj.county_str
|
||||
if(obj.is_default==0){
|
||||
this.switch_state = false
|
||||
}
|
||||
this.region = `${obj.province_str} ${obj.city_str} ${obj.county_str} `
|
||||
}
|
||||
// uni.getLocation({
|
||||
// type: 'wgs84',
|
||||
// geocode:true,
|
||||
// success: function (res) {
|
||||
// console.log('位置信息:'+JSON.stringify(res));
|
||||
// }
|
||||
// });
|
||||
},
|
||||
onUnload() {
|
||||
uni.removeStorageSync('updataAddress');
|
||||
},
|
||||
onShow() {
|
||||
this.$toolAll.tools.guoq()
|
||||
let ya = this
|
||||
wx.getLocation({
|
||||
success:function(res) {
|
||||
ya.getDistrict(res.latitude, res.longitude)
|
||||
},
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
getDistrict(latitude, longitude) {
|
||||
let ya = this
|
||||
wx.request({
|
||||
url: `https://apis.map.qq.com/ws/geocoder/v1/?location=${latitude},${longitude}&key=B2ABZ-SIDKS-WD2O3-6CJ2U-CDZOT-U3FKF`,
|
||||
header: {
|
||||
'Content-Type':'application/json'
|
||||
},
|
||||
success:function(res) {
|
||||
// console.log('地址数据:',res)
|
||||
ya.newProvice = res.data.result.address_component.province
|
||||
ya.newCity = res.data.result.address_component.city
|
||||
ya.newDistrict = res.data.result.address_component.district
|
||||
}
|
||||
})
|
||||
},
|
||||
//打开picker
|
||||
openPicker() {
|
||||
this.lotusAddressData.visible = true;
|
||||
this.lotusAddressData.provinceName = this.newProvice;
|
||||
this.lotusAddressData.cityName = this.newCity;
|
||||
this.lotusAddressData.townName = this.newDistrict;
|
||||
},
|
||||
//回传已选的省市区的值
|
||||
choseValue(res){
|
||||
//res数据源包括已选省市区与省市区code
|
||||
// console.log(res);
|
||||
this.lotusAddressData.visible = res.visible;//visible为显示与关闭组件标识true显示false隐藏
|
||||
//res.isChose = 1省市区已选 res.isChose = 0;未选
|
||||
if(res.isChose){
|
||||
this.lotusAddressData.provinceName = res.province;//省
|
||||
this.lotusAddressData.cityName = res.city;//市
|
||||
this.lotusAddressData.townName = res.town;//区
|
||||
this.region = `${res.province} ${res.city} ${res.town}`; //region为已选的省市区的值
|
||||
this.regionObj = {
|
||||
province:res.province,
|
||||
provinceCode:res.provinceCode,
|
||||
city:res.city,
|
||||
cityCode:res.cityCode,
|
||||
town:res.town,
|
||||
townCode:res.townCode
|
||||
}
|
||||
}
|
||||
},
|
||||
saveAddress(){
|
||||
if(!this.name){
|
||||
this.$toolAll.tools.showToast('请输入收货人');
|
||||
} else if(!this.phone){
|
||||
this.$toolAll.tools.showToast('请输入手机号');
|
||||
} else if(this.$toolAll.tools.isPhone(this.phone)){
|
||||
this.$toolAll.tools.showToast('请输入正确的手机号');
|
||||
} else if(!this.region){
|
||||
this.$toolAll.tools.showToast('请输入所在地区');
|
||||
} else if(!this.address){
|
||||
this.$toolAll.tools.showToast('请输入详细地址');
|
||||
} else if(!this.switch_state){
|
||||
uni.showModal({
|
||||
title:'提示:',
|
||||
content:'是否设为默认地址',
|
||||
cancelText:'取消默认',
|
||||
cancelColor:'#999999',
|
||||
confirmText:'设为默认',
|
||||
confirmColor:'#164396',
|
||||
success: (res) => {
|
||||
if(res.confirm){
|
||||
this.switch_state = true
|
||||
} else {
|
||||
this.saveEv()
|
||||
}
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.showModal({
|
||||
title:'提示:',
|
||||
content:'确定要保存当前地址信息吗?',
|
||||
cancelText:'取消',
|
||||
cancelColor:'#999999',
|
||||
confirmText:'确定',
|
||||
confirmColor:'#164396',
|
||||
success: (res) => {
|
||||
if(res.confirm){
|
||||
this.saveEv()
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
saveEv(){//保存地址执行事件
|
||||
let ya = this
|
||||
let num = 1
|
||||
if(!ya.switch_state){num = 0}
|
||||
let paramsadd = {
|
||||
id: ya.updateId,
|
||||
name:ya.name,//姓名
|
||||
phone:ya.phone,//电话
|
||||
province:ya.regionObj.provinceCode,//省级行政编码 如110000
|
||||
city:ya.regionObj.cityCode,//市级行政编码 如110100
|
||||
county:ya.regionObj.townCode,//县乡级行政编码 如110101
|
||||
province_str:ya.regionObj.province,//省级名称 如北京
|
||||
city_str:ya.regionObj.city,//市级名称 如北京市
|
||||
county_str:ya.regionObj.town,//县乡区域名称 如东城区
|
||||
address:ya.address,//具体地址 如XX路xx街
|
||||
is_default:num,//是否默认地址 0=否 1=是
|
||||
postcode:'',//邮编 如610200
|
||||
tag:''//地址标签 如 家 公司
|
||||
}
|
||||
this.$requst.post('user/address-save',paramsadd).then(res=>{
|
||||
if(res.msg=='success'){
|
||||
this.$toolAll.tools.showToast('地址保存成功');
|
||||
setTimeout(function(){
|
||||
uni.navigateBack({delta:1})
|
||||
},2000)
|
||||
}
|
||||
},error=>{})
|
||||
|
||||
},
|
||||
switchChange1: function(e){
|
||||
// console.log(e);
|
||||
this.switch_state = !e.checked;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
|
@ -0,0 +1,65 @@
|
|||
<template>
|
||||
<view class="">
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav :statusBackw="true" :whereCome="whereCome*1" :statusTitle="true" :title-val="'公告'" :tabcolor="'#ffffff'"></status-nav>
|
||||
<view :style="{paddingTop:statusHNH+'px'}">
|
||||
<view class="fon28 dis margin20 borbot" v-for="(item,index) in dataArr" :key="index">
|
||||
<view class="margin-y20 flexs noticesitem-img"></view>
|
||||
<view @tap="choose(index)">
|
||||
<view class="color33 clips2">{{item.title}}</view>
|
||||
<view class="fon24 color9 margin-s10 margin-x20">{{$toolAll.tools.timestampToTime(item.update_time)}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="borbot"></view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
whereCome:2,
|
||||
dataArr:[],
|
||||
statusHNH:uni.getStorageSync('statusHNH')
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.$toolAll.tools.guoq()
|
||||
},
|
||||
onLoad(options) {
|
||||
if(uni.getStorageSync('token')==''){
|
||||
uni.showToast({title:'您当前是游客,请授权登录',icon:'none',duration:2000})
|
||||
setTimeout(function(){
|
||||
uni.reLaunch({url:'/pages/login/login'})//跳转到授权登录页
|
||||
},2000)
|
||||
} else {
|
||||
options.index !=undefined ? this.whereCome = options.index : ''
|
||||
let noticeObj = {
|
||||
page:1,
|
||||
size:50
|
||||
}
|
||||
this.$requst.post('article/announcement/index',noticeObj).then(res=>{
|
||||
if(res.data.list.length!=0){
|
||||
this.dataArr = res.data.list
|
||||
}
|
||||
},error=>{})
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
choose(index){
|
||||
let dataInfo = this.dataArr[index]
|
||||
if(uni.getStorageSync('noticeInfo')==''){
|
||||
uni.setStorageSync('noticeInfo',dataInfo)
|
||||
}
|
||||
uni.navigateTo({
|
||||
url:'/pagesB/noticesDetail/noticesDetail?index=0'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
page{background-color: #FFFFFF;}
|
||||
</style>
|
|
@ -0,0 +1,55 @@
|
|||
<template>
|
||||
<view class="">
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav :statusBackw="true" :whereCome="whereCome*1" :statusTitle="true" :title-val="'公告详情'" :tabcolor="'#ffffff'"></status-nav>
|
||||
<view :style="{paddingTop:(statusHNH+10)+'px'}">
|
||||
<view class="margin20" style="margin-top: 0;">
|
||||
<view class="fon32 padding-s10">{{dataInfo.title}}</view>
|
||||
<view class="fon24 color6 margin-sx10 disac"><view>发布时间:{{$toolAll.tools.timestampToTime(dataInfo.create_time)}}</view><view class="margin-z20">来源:{{dataInfo.source}}</view></view>
|
||||
<view class="borbot margin-sx20"></view>
|
||||
<rich-text class="fon24" :nodes="conArr" style="text-indent:2em;line-height: 46rpx;"></rich-text>
|
||||
<view class="fon24" style="text-indent:2em;line-height: 46rpx;">{{dataInfo.summary}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
whereCome:'',
|
||||
dataInfo:{},
|
||||
conArr:[],
|
||||
statusHNH:uni.getStorageSync('statusHNH')
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
let ya = this
|
||||
let here = options.index
|
||||
ya.whereCome = here
|
||||
if(uni.getStorageSync('noticeInfo')!=undefined){
|
||||
this.dataInfo = uni.getStorageSync('noticeInfo');
|
||||
this.conArr = this.$toolAll.tools.escape2Html(this.dataInfo.content)
|
||||
this.conArr = ya.escape2Html(this.dataInfo.content);
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.$toolAll.tools.guoq()
|
||||
},
|
||||
methods: {
|
||||
//转义方法
|
||||
escape2Html(str) {
|
||||
var arrEntities = { 'lt': '<', 'gt': '>', 'nbsp': ' ', 'amp': '&', 'quot': '"' };
|
||||
return str.replace(/&(lt|gt|nbsp|amp|quot|src);/ig, function (all, t) { return arrEntities[t]; }).replace('<section', '<div').replace(/\<img/g, '<img style="max-width:100%;height:auto" ').replace(/src=\"/g,'src="https://dengrui.scdxtc.cn');
|
||||
}
|
||||
},
|
||||
onUnload() {
|
||||
uni.removeStorageSync('noticeInfo')
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
page{background-color: #FFFFFF;}
|
||||
</style>
|
|
@ -0,0 +1,167 @@
|
|||
<template>
|
||||
<view class="">
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav :statusBackw="true" :statusTitle="true" :title-val="'个人资料'" :tabcolor="'#ffffff'"></status-nav>
|
||||
<view class="margin-zy20 bacb radius10" :style="{marginTop:(statusHNH+10)+'px'}">
|
||||
<view @tap="chooseVal(index)" class="disba fon28 margin-zy20 borbot padding-sx20" v-for="(item,index) in dataArr" :key="index">
|
||||
<view class="" style="color: #292929;">{{item.title}}</view>
|
||||
<view class="disac">
|
||||
<view v-if="item.content!=''" style="color: #a6a6a6;">{{item.content}}</view>
|
||||
<image v-if="item.imgSrc!=''" style="width: 96rpx;height: 96rpx;border-radius: 100%;margin-left: 20rpx;" :src="item.imgSrc" mode="aspectFill"></image>
|
||||
<image class="margin-z10 youj" src="/static/img/my/youj.png" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="margin20">
|
||||
<!-- <button class="fon32 color33" style="background-color: #FFFFFF;border: none;position: inherit;height: 120rpx;line-height: 120rpx;">退出登录</button> -->
|
||||
<navigator @tap="clearAll" class="fon32 color33" target="miniProgram" open-type="exit"style="background-color: #FFFFFF;height: 120rpx;line-height: 120rpx;text-align: center;border-radius: 10rpx;"> 退出登录</navigator>
|
||||
</view>
|
||||
<!-- 弹框输入 -->
|
||||
<view v-if="isInput" class="posiall disbcac" style="background-color: rgba(0,0,0,.5);z-index: 100;">
|
||||
<view :class="isClose ? '':'bounceOut'" class="animated bounceIn" style="background-color: #FFFFFF;width: 70%;padding: 20rpx;border-radius: 10rpx;">
|
||||
<view style="padding-bottom: 20rpx;font-size: 28rpx;">修改:{{xtitle}}</view>
|
||||
<input @input="inputEv" :focus="isfocus" :type="inputType" :value="inputVal" style="border: 1rpx solid #dddddd;border-radius: 10rpx;padding: 10rpx 20rpx;" />
|
||||
<view style="margin-top: 20rpx;display: flex;justify-content: space-between;align-items: center;font-size: 28rpx;">
|
||||
<view @tap="closeT" class="color9 width100" style="text-align: center;">取消</view>
|
||||
<view @tap="submit" class="colorf78 width100"style="text-align: center;">确认</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
dataArr:[
|
||||
{title:'昵称:',content:'',imgSrc:'/static/img/my/myhead.png'},
|
||||
{title:'真实姓名:',content:'',imgSrc:''},
|
||||
{title:'手机号码:',content:'',imgSrc:''},
|
||||
],
|
||||
inputVal:'',
|
||||
isClose:true,
|
||||
isInput:false,
|
||||
isfocus:true,
|
||||
xtitle:'',
|
||||
field:'',
|
||||
inputType:'text',
|
||||
inputIndex:'',
|
||||
headImg:'',
|
||||
statusHNH:uni.getStorageSync('statusHNH')
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
let obj = uni.getStorageSync('userInfoObj')
|
||||
this.dataArr[0].content = obj.nickname
|
||||
this.dataArr[0].imgSrc = obj.headimgurl
|
||||
if(obj.realname==null){
|
||||
this.dataArr[1].content = '未知'
|
||||
} else {
|
||||
this.dataArr[1].content = obj.realname
|
||||
}
|
||||
if(obj.mobile==''){
|
||||
this.dataArr[2].content = '未知'
|
||||
} else {
|
||||
this.dataArr[2].content = obj.mobile
|
||||
this.zanPhone = obj.mobile
|
||||
}
|
||||
},
|
||||
onShow(){
|
||||
this.$toolAll.tools.guoq()
|
||||
},
|
||||
methods: {
|
||||
inputEv(e){
|
||||
this.inputVal = e.target.value
|
||||
},
|
||||
chooseVal(index){
|
||||
if(index!=0) this.isInput = true
|
||||
this.inputIndex = index
|
||||
this.xtitle = this.dataArr[index].content
|
||||
if(index==0) {
|
||||
this.field = 'headimgurl'
|
||||
uni.chooseImage({
|
||||
count:1,
|
||||
sizeType:['original'],
|
||||
success: (res) => {
|
||||
this.dataArr[0].imgSrc = res.tempFilePaths[0]
|
||||
this.$requst.upload('file/upload/image',{file: this.dataArr[0].imgSrc}).then(res=>{
|
||||
this.headImg = res.data.src
|
||||
this.submit()//调用提交事件
|
||||
},error=>{})
|
||||
},
|
||||
complete: (res) => {
|
||||
// console.log(res);
|
||||
}
|
||||
})
|
||||
}
|
||||
if(index==1) {
|
||||
this.field = 'realname'
|
||||
this.inputType = 'text'
|
||||
}
|
||||
if(index==2) {
|
||||
this.field = 'mobile'
|
||||
this.inputType = 'number'
|
||||
}
|
||||
},
|
||||
closeT(){
|
||||
this.isClose = false
|
||||
let ya = this
|
||||
setTimeout(function(){
|
||||
ya.isInput = false
|
||||
ya.isClose = true
|
||||
},1000)
|
||||
},
|
||||
submit(){//用户信息提交事件
|
||||
let ya = this
|
||||
if(this.inputIndex==2 && this.$toolAll.tools.isPhone(this.inputVal)){
|
||||
this.$toolAll.tools.showToast('请输入正确的手机号')
|
||||
} else {
|
||||
if(this.headImg!='') this.inputVal = this.headImg
|
||||
this.$requst.post('user/edit-info',{field:this.field,value:this.inputVal}).then(res=>{
|
||||
// console.log(res);
|
||||
if(res.code==0){
|
||||
let newObj = uni.getStorageSync('params')
|
||||
if(this.inputIndex==0) this.$toolAll.tools.showToast('头像修改成功')
|
||||
let newName = ''
|
||||
if(this.inputIndex==1) {
|
||||
this.$toolAll.tools.showToast('姓名修改成功')
|
||||
newName = this.inputVal
|
||||
} else {
|
||||
newName = newObj.nickname
|
||||
}
|
||||
if(this.inputIndex==2) this.$toolAll.tools.showToast('号码修改成功')
|
||||
this.isClose = false
|
||||
let objInfo = {
|
||||
avatar:this.$http + this.headImg,
|
||||
city:newObj.city,
|
||||
code:'',
|
||||
country:newObj.country,
|
||||
gender:newObj.gender,
|
||||
invite_code:newObj.invite_code,
|
||||
language:newObj.language,
|
||||
nickname:newName,
|
||||
province:newObj.province
|
||||
}
|
||||
uni.setStorageSync('params',objInfo)
|
||||
if(this.headImg=='') this.dataArr[this.inputIndex].content = this.inputVal
|
||||
setTimeout(function(){
|
||||
ya.isInput = false
|
||||
ya.isClose = true
|
||||
ya.inputVal = ya.headImg =''
|
||||
},1000)
|
||||
}
|
||||
},error=>{})
|
||||
}
|
||||
},
|
||||
clearAll(){//清除所以缓存
|
||||
// uni.clearStorageSync()
|
||||
uni.removeStorageSync('token')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
|
@ -0,0 +1,42 @@
|
|||
<template>
|
||||
<view class="">
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav :statusBackw="true" :whereCome="0" :statusTitle="true" :title-val="'平台说明'" :tabcolor="'#ffffff'"></status-nav>
|
||||
<view :style="{paddingTop:statusHNH+'px'}">
|
||||
<view class="margin20">
|
||||
<view style="word-break: break-all;">
|
||||
<rich-text :nodes="pcontent"></rich-text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
pcontent:'',
|
||||
statusHNH:uni.getStorageSync('statusHNH')
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.$toolAll.tools.guoq()
|
||||
},
|
||||
onLoad() {
|
||||
this.$requst.post('user/description').then(res=>{
|
||||
// console.log(res);
|
||||
if(res.code==0){
|
||||
this.pcontent = res.data.content
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
page{background-color: #FFFFFF;}
|
||||
</style>
|
|
@ -0,0 +1,83 @@
|
|||
<template>
|
||||
<view v-if="pageShow">
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav :statusBackw="true" :statusTitle="true" :title-val="titlename" :tabcolor="'#ffffff'"></status-nav>
|
||||
<view :style="{marginTop:(statusHNH+10)+'px'}">
|
||||
<view v-if="dataArr.length!=0" class="padding20 fon28 bacb margin-zy20 margin-x20" style="border-radius: 5rpx;" v-for="(item,index) in dataArr" :key="index">
|
||||
<view class="disba">
|
||||
<view>{{item.title}}</view>
|
||||
<view class="colorf78">-{{item.price}}</view>
|
||||
</view>
|
||||
<view class="fon24 color9 margin-s10">{{item.time}}</view>
|
||||
</view>
|
||||
<view v-if="dataArr.length==0" class="zanwu">暂无更多提现记录</view>
|
||||
</view>
|
||||
<backTop :showTop="showTop" @backTop="backTop"></backTop>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import backTop from '@/components/backTop.vue';
|
||||
export default {
|
||||
components:{
|
||||
backTop
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dataArr:[],
|
||||
showTop:false,
|
||||
titlename:'提现记录',
|
||||
page:1,
|
||||
size:50,
|
||||
statusHNH:uni.getStorageSync('statusHNH'),
|
||||
pageShow:false
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
let num = options.index
|
||||
if(num==0){
|
||||
// 直卖提现记录
|
||||
this.titlename = '直卖提现记录'
|
||||
this.checkFenZhiList('sale')
|
||||
} else {
|
||||
// 分红提现记录
|
||||
this.titlename = '分红提现记录'
|
||||
this.checkFenZhiList('bonus')
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.$toolAll.tools.guoq()
|
||||
},
|
||||
onPageScroll(e) {
|
||||
e.scrollTop > 360 ? this.showTop = true : this.showTop = false
|
||||
},
|
||||
methods: {
|
||||
checkFenZhiList(newtype){
|
||||
this.$requst.post('user/withdraw-list',{page:this.page,size:this.size,type:newtype}).then(res=>{
|
||||
// console.log('提现记录:',res);
|
||||
this.pageShow = true
|
||||
if(res.data.list.length!=0){
|
||||
res.data.list.forEach(item=>{
|
||||
let fenObj = {
|
||||
title:'微信提现',
|
||||
time:item.created_at,
|
||||
price:item.amount/100
|
||||
}
|
||||
this.dataArr.push(fenObj)
|
||||
})
|
||||
}
|
||||
},error=>{})
|
||||
|
||||
},
|
||||
backTop(){
|
||||
uni.pageScrollTo({
|
||||
scrollTop: 0,
|
||||
duration: 300
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
|
@ -0,0 +1,107 @@
|
|||
<template>
|
||||
<view v-if="pageShow">
|
||||
<!-- 使用标题栏 -->
|
||||
<status-nav :statusBackw="true" :statusTitle="true" :title-val="titleName+'收益'" :tabcolor="'#ffffff'"></status-nav>
|
||||
<view :style="{paddingTop:statusHNH+'px'}">
|
||||
<view class="disba padding20 borbot" style="font-size: 30rpx;">
|
||||
<view>商品内容</view>
|
||||
<view>{{titleName}}收益</view>
|
||||
</view>
|
||||
<view v-if="dataArr.length!=0" class="disba padding20 borbot fon28" v-for="(item,index) in dataArr" :key="index">
|
||||
<view>
|
||||
<view class="clips1">{{item.title}}</view>
|
||||
<view class="fon24 color9 margin-s10">{{item.time}}</view>
|
||||
</view>
|
||||
<view class="colorf78">{{item.price}}</view>
|
||||
</view>
|
||||
<view v-if="dataArr.length==0" class="zanwu">暂无更多{{titleName}}收益记录</view>
|
||||
</view>
|
||||
<backTop :showTop="showTop" @backTop="backTop"></backTop>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import backTop from '@/components/backTop.vue';
|
||||
export default {
|
||||
components:{
|
||||
backTop
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dataArr:[],
|
||||
titleName:'',
|
||||
whereCome:'',
|
||||
showTop:false,
|
||||
page:1,
|
||||
size:50,
|
||||
statusHNH:uni.getStorageSync('statusHNH'),
|
||||
pageShow:false
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
this.whereCome = options.index
|
||||
if(this.whereCome==0) {
|
||||
this.titleName = '直卖'
|
||||
this.checkZhiList()//查询直卖收益列表
|
||||
}
|
||||
if(this.whereCome==1) {
|
||||
this.titleName = '分红'
|
||||
this.checkFenList()//查询分红收益
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.$toolAll.tools.guoq()
|
||||
},
|
||||
onPageScroll(e) {
|
||||
e.scrollTop > 360 ? this.showTop = true : this.showTop = false
|
||||
},
|
||||
methods: {
|
||||
checkFenList(){//分红收益明细列表
|
||||
this.$requst.post('user/bonus-income-list',{page:this.page,size:this.size}).then(res=>{
|
||||
// console.log('分红收益记录:',res);
|
||||
if(res.code==0){
|
||||
this.pageShow = true
|
||||
if(res.data.list.length!=0){
|
||||
res.data.list.forEach(item=>{
|
||||
let fenObj = {
|
||||
title:item.income_text,
|
||||
time:item.created_at,
|
||||
price:item.income/100
|
||||
}
|
||||
this.dataArr.push(fenObj)
|
||||
})
|
||||
}
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
checkZhiList(){
|
||||
this.$requst.post('user/sale-income-list',{page:this.page,size:this.size}).then(res=>{
|
||||
// console.log('直卖收益记录:',res);
|
||||
if(res.code==0){
|
||||
this.pageShow = true
|
||||
if(res.data.list.length!=0){
|
||||
res.data.list.forEach(item=>{
|
||||
let zhiObj = {
|
||||
title:item.income_text,
|
||||
time:item.created_at,
|
||||
price:item.income/100
|
||||
}
|
||||
this.dataArr.push(zhiObj)
|
||||
})
|
||||
}
|
||||
}
|
||||
},error=>{})
|
||||
},
|
||||
backTop(){
|
||||
uni.pageScrollTo({
|
||||
scrollTop: 0,
|
||||
duration: 300
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
page{background-color: #FFFFFF;}
|
||||
</style>
|
After Width: | Height: | Size: 675 B |
After Width: | Height: | Size: 997 B |
After Width: | Height: | Size: 1.2 KiB |
After Width: | Height: | Size: 475 B |
After Width: | Height: | Size: 1.5 KiB |
After Width: | Height: | Size: 912 B |
After Width: | Height: | Size: 2.0 KiB |
After Width: | Height: | Size: 865 B |
After Width: | Height: | Size: 1.2 KiB |
After Width: | Height: | Size: 2.2 KiB |
After Width: | Height: | Size: 2.2 KiB |
After Width: | Height: | Size: 27 KiB |
After Width: | Height: | Size: 2.0 KiB |
After Width: | Height: | Size: 33 KiB |
After Width: | Height: | Size: 2.3 KiB |
After Width: | Height: | Size: 1.3 KiB |
After Width: | Height: | Size: 1.6 KiB |
After Width: | Height: | Size: 1.7 KiB |
After Width: | Height: | Size: 601 B |
After Width: | Height: | Size: 2.0 KiB |
After Width: | Height: | Size: 1.0 KiB |
After Width: | Height: | Size: 3.1 KiB |
After Width: | Height: | Size: 640 B |
After Width: | Height: | Size: 1.1 KiB |
After Width: | Height: | Size: 4.5 KiB |
After Width: | Height: | Size: 1.9 KiB |
After Width: | Height: | Size: 7.6 KiB |
After Width: | Height: | Size: 502 KiB |
After Width: | Height: | Size: 95 KiB |
After Width: | Height: | Size: 71 KiB |
After Width: | Height: | Size: 129 KiB |
After Width: | Height: | Size: 938 B |
After Width: | Height: | Size: 81 KiB |
After Width: | Height: | Size: 732 B |
After Width: | Height: | Size: 727 B |
After Width: | Height: | Size: 48 KiB |
After Width: | Height: | Size: 80 KiB |
After Width: | Height: | Size: 1005 B |