优化顶部自定义导航栏
commit
6474f606f4
|
|
@ -0,0 +1,9 @@
|
|||
/vendor
|
||||
/node_modules
|
||||
/public/storage
|
||||
/unpackage
|
||||
/.hbuilderx
|
||||
Homestead.yaml
|
||||
Homestead.json
|
||||
.env
|
||||
.idea
|
||||
|
|
@ -0,0 +1,52 @@
|
|||
<script>
|
||||
export default {
|
||||
globalData:{
|
||||
projectname:'', // 项目名称
|
||||
lat:'', // 公司地址维度
|
||||
lng:'' ,// 公司地址经度
|
||||
hostapi:'' // 域名配置
|
||||
},
|
||||
// 优先于show方法
|
||||
onLaunch: function() {
|
||||
// 配置全局域名
|
||||
// #ifdef APP-PLUS
|
||||
getApp().globalData.hostapi = 'http://maintain.7and5.cn';
|
||||
// #endif
|
||||
// #ifdef MP-WEIXIN
|
||||
getApp().globalData.hostapi = 'http://maintain.7and5.cn';
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
getApp().globalData.hostapi = '/web';
|
||||
// #endif
|
||||
},
|
||||
onShow: function() {
|
||||
if(uni.getStorageSync('phone_active')){
|
||||
// 刷新token
|
||||
this.$toolAll.tools.refreshToken();
|
||||
}
|
||||
},
|
||||
onHide: function() {
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/*每个页面公共css */
|
||||
|
||||
/* 阿里巴巴矢量图标库 start */
|
||||
@import url("./commons/icon-font.css");
|
||||
/* 阿里巴巴矢量图标库 end */
|
||||
/* 项目基础样式 start */
|
||||
@import url("./commons/base.css");
|
||||
/* 项目基础样式 end */
|
||||
/* 项目页面样式 start */
|
||||
@import url("./commons/flying-monkey.css");
|
||||
/* 项目页面样式 end */
|
||||
|
||||
/* 动画样式 start */
|
||||
@import url("./commons/animate.min.css");
|
||||
/* 动画样式 end */
|
||||
|
||||
page {background-color: #f7f7f7;}
|
||||
</style>
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,387 @@
|
|||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* @media screen and (height:812px){
|
||||
}
|
||||
@media screen and (height:844px){
|
||||
}
|
||||
@media screen and (height:896px){
|
||||
}
|
||||
@media screen and (min-height:926px){
|
||||
}
|
||||
*/
|
||||
|
||||
|
||||
|
||||
|
||||
.bottoc{margin-top: 6rpx;color: #414141;}
|
||||
.opc{opacity: 0.7;}
|
||||
.width100{width: 100%;}
|
||||
.width55{width: 55%;}
|
||||
.width50{width: 50%;}
|
||||
.width49{width: 49%;}
|
||||
.width48_5{width: 48.5%;}
|
||||
.width48{width: 48%;}
|
||||
.width47{width: 47%;}
|
||||
.width46{width: 46%;}
|
||||
.width45{width: 45%;}
|
||||
.width33{width: 33%;}
|
||||
.width30{width: 30%;}
|
||||
.width29{width: 29%;}
|
||||
.width28{width: 28%;}
|
||||
.width27{width: 27%;}
|
||||
.width26{width: 26%;}
|
||||
.width25{width: 25%;}
|
||||
|
||||
.posAll{position: fixed;top: 0;left: 0;right: 0;bottom: 0;background-color: rgba(0,0,0,.45);z-index: 12;}
|
||||
.posir{position: relative;}
|
||||
.posia{position: absolute;}
|
||||
.poszy{position: fixed;left: 0;right: 0;z-index: 3;}
|
||||
.posiszy{position: fixed;left: 0;right: 0;z-index: 5;}
|
||||
.posixzy{position: fixed;left: 0;right: 0;z-index: 2;bottom: 0;}
|
||||
.posia-op{position: absolute;top: 0;right: 0;left: 0;bottom: 0;opacity: 0;}
|
||||
.syxzo{top: 0;left: 0;right: 0;bottom: 0;opacity: 0;}
|
||||
|
||||
|
||||
.dis{display: flex;}
|
||||
.disac{display: flex;align-items: center;}
|
||||
.disja{display: flex;justify-content: space-around;}
|
||||
.disjb{display: flex;justify-content: space-between;}
|
||||
.disje{display: flex;justify-content: flex-end;}
|
||||
.disjbac{display: flex;justify-content: space-between;align-items: center;}
|
||||
.disjcac{display: flex;justify-content: center;align-items: center;}
|
||||
.fc{flex-direction: column;}
|
||||
.fw{flex-wrap: wrap;}
|
||||
.fe{justify-content: flex-end;}
|
||||
.flexs{flex-shrink: 0;}
|
||||
|
||||
|
||||
.wh42{width: 42rpx;height: 42rpx;}
|
||||
.wh44{width: 44rpx;height: 44rpx;}
|
||||
|
||||
button:after{content: none!important;}
|
||||
.borbot{border-bottom: 2rpx solid #E6E6E6;}
|
||||
.borbot:last-child{border-bottom: none;}
|
||||
.bbot{border-bottom: 2rpx solid #EEEEEE;}
|
||||
.borbot-df{border: 2rpx solid #DFDFDF;}
|
||||
.borbot-cc{border: 2rpx solid #CCCCCC;}
|
||||
.bleft {border-left: 1rpx solid #EEEEEE;}
|
||||
|
||||
/* 行高 */
|
||||
.line-h30{line-height: 30rpx;}
|
||||
.line-h32{line-height: 32rpx;}
|
||||
.line-h34{line-height: 34rpx;}
|
||||
.line-h36{line-height: 36rpx;}
|
||||
.line-h38{line-height: 38rpx;}
|
||||
.line-h40{line-height: 40rpx;}
|
||||
.line-h42{line-height: 42rpx;}
|
||||
.line-h44{line-height: 44rpx;}
|
||||
.line-h46{line-height: 46rpx;}
|
||||
.line-h48{line-height: 48rpx;}
|
||||
.line-h50{line-height: 50rpx;}
|
||||
.line-h52{line-height: 52rpx;}
|
||||
.line-h54{line-height: 54rpx;}
|
||||
.line-h56{line-height: 56rpx;}
|
||||
.line-h58{line-height: 58rpx;}
|
||||
.line-h60{line-height: 60rpx;}
|
||||
.line-h62{line-height: 62rpx;}
|
||||
.line-h64{line-height: 64rpx;}
|
||||
.line-h66{line-height: 66rpx;}
|
||||
.line-h68{line-height: 60rpx;}
|
||||
.line-h70{line-height: 70rpx;}
|
||||
.line-h72{line-height: 72rpx;}
|
||||
.line-h74{line-height: 74rpx;}
|
||||
|
||||
|
||||
.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;}
|
||||
.clips4{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 4;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;word-break:break-all;}
|
||||
.clips5{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 5;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;word-break:break-all;}
|
||||
.clips6{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 6;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;word-break:break-all;}
|
||||
.clips7{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 7;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;word-break:break-all;}
|
||||
.clips8{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 8;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;word-break:break-all;}
|
||||
.clips9{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 9;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;word-break:break-all;}
|
||||
.clips10{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 10;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;word-break:break-all;}
|
||||
|
||||
|
||||
/* 字体大小 */
|
||||
.fon20{font-size: 20rpx;}
|
||||
.fon22{font-size: 22rpx;}
|
||||
.fon24{font-size: 24rpx;}
|
||||
.fon25{font-size: 25rpx;}
|
||||
.fon26{font-size: 26rpx;}
|
||||
.fon27{font-size: 27rpx;}
|
||||
.fon28{font-size: 28rpx;}
|
||||
.fon30{font-size: 30rpx;}
|
||||
.fon32{font-size: 32rpx;}
|
||||
.fon34{font-size: 34rpx;}
|
||||
.fon36{font-size: 36rpx;}
|
||||
.fon38{font-size: 38rpx;}
|
||||
.fon40{font-size: 40rpx;}
|
||||
.fon42{font-size: 42rpx;}
|
||||
.fon44{font-size: 44rpx;}
|
||||
.fon46{font-size: 46rpx;}
|
||||
.fon48{font-size: 48rpx;}
|
||||
.fon50{font-size: 50rpx;}
|
||||
.fon52{font-size: 52rpx;}
|
||||
.fon54{font-size: 54rpx;}
|
||||
.fon56{font-size: 56rpx;}
|
||||
.fon58{font-size: 58rpx;}
|
||||
.fon60{font-size: 60rpx;}
|
||||
.fon62{font-size: 62rpx;}
|
||||
.fon64{font-size: 64rpx;}
|
||||
.fon66{font-size: 66rpx;}
|
||||
.fon68{font-size: 68rpx;}
|
||||
.fon70{font-size: 70rpx;}
|
||||
.fon72{font-size: 72rpx;}
|
||||
|
||||
/* 字体颜色 */
|
||||
.colf{color: #FFFFFF;}
|
||||
.colf6{color: #f6f6f6;}
|
||||
.colb{color: #000000;}
|
||||
.colc{color: #CCCCCC;}
|
||||
.col3{color: #333333;}
|
||||
.col34{color: #343434;}
|
||||
.col6{color: #666666;}
|
||||
.colf8{color: #F85050;}
|
||||
.col9{color: #999999;}
|
||||
.pcol{color: #3875F6;}
|
||||
.col2c{color: #2C2C2C;}
|
||||
.col80{color: #808080;}
|
||||
.col7D{color: #7D7D7D;}
|
||||
.colB3{color: #B3B3B3;}
|
||||
.col5b{color: #5B5B5B;}
|
||||
.colpeili{color: #868695;}
|
||||
|
||||
|
||||
/* 字体位置 */
|
||||
.tright{text-align: right;}
|
||||
.tcenter{text-align: center;}
|
||||
|
||||
/* 文字空两格 */
|
||||
.tindent{text-indent: 2em;}
|
||||
|
||||
/* 元素缩小 */
|
||||
.scal13{transform: scale(1.3);}
|
||||
.scal12{transform: scale(1.2);}
|
||||
.scal11{transform: scale(1.1);}
|
||||
.scal10{transform: scale(1);}
|
||||
.scal09{transform: scale(.9);}
|
||||
.scal08{transform: scale(.8);}
|
||||
.scal07{transform: scale(.7);}
|
||||
.scal06{transform: scale(.6);}
|
||||
.scal05{transform: scale(.5);}
|
||||
|
||||
/* 行间距 */
|
||||
.linh40{line-height: 40rpx;}
|
||||
.linh50{line-height: 50rpx;}
|
||||
.linh60{line-height: 60rpx;}
|
||||
.linh70{line-height: 70rpx;}
|
||||
|
||||
/* 粗体 */
|
||||
.bold{font-weight: bold;}
|
||||
.bold400{font-weight: 400;}
|
||||
.bold500{font-weight: 500;}
|
||||
|
||||
|
||||
/* 背景颜色 */
|
||||
.pbackc{background-color: #3875F6;}
|
||||
.bacf{background-color: #FFFFFF;}
|
||||
.bac0{background-color: #000000;}
|
||||
.bcdb{background-color: #DBDBDB;}
|
||||
.bcf8{background: #F85050;}
|
||||
.bacf5{background: #F5F5F5;}
|
||||
.bacf6{background-color: #f6f6f6;}
|
||||
|
||||
|
||||
|
||||
/* 圆角 */
|
||||
.radius10{border-radius: 10rpx;}
|
||||
.radius15{border-radius: 15rpx;}
|
||||
.radius20{border-radius: 20rpx;}
|
||||
.radius30{border-radius: 30rpx;}
|
||||
.radius35{border-radius: 35rpx;}
|
||||
.radius40{border-radius: 40rpx;}
|
||||
.radius45{border-radius: 45rpx;}
|
||||
|
||||
/* 上下左右---外边距 */
|
||||
.mar10{margin: 10rpx;}
|
||||
.mar20{margin: 20rpx;}
|
||||
.mar25{margin: 25rpx;}
|
||||
.mar30{margin: 30rpx;}
|
||||
.mar32{margin: 32rpx;}
|
||||
.mar36{margin: 36rpx;}
|
||||
.mar40{margin: 40rpx;}
|
||||
.mar50{margin: 50rpx;}
|
||||
/* 上下---外边距 */
|
||||
.mar-sx10{margin-top: 10rpx;margin-bottom: 10rpx;}
|
||||
.mar-sx20{margin-top: 20rpx;margin-bottom: 20rpx;}
|
||||
.mar-sx25{margin-top: 25rpx;margin-bottom: 25rpx;}
|
||||
.mar-sx30{margin-top: 30rpx;margin-bottom: 30rpx;}
|
||||
.mar-sx32{margin-top: 32rpx;margin-bottom: 32rpx;}
|
||||
.mar-sx36{margin-top: 36rpx;margin-bottom: 36rpx;}
|
||||
.mar-sx40{margin-top: 40rpx;margin-bottom: 40rpx;}
|
||||
.mar-sx50{margin-top: 50rpx;margin-bottom: 50rpx;}
|
||||
/* 左右---外边距 */
|
||||
.mar-zy10{margin-left: 10rpx;margin-right: 10rpx;}
|
||||
.mar-zy20{margin-left: 20rpx;margin-right: 20rpx;}
|
||||
.mar-zy25{margin-left: 25rpx;margin-right: 25rpx;}
|
||||
.mar-zy30{margin-left: 30rpx;margin-right: 30rpx;}
|
||||
.mar-zy32{margin-left: 32rpx;margin-right: 32rpx;}
|
||||
.mar-zy36{margin-left: 36rpx;margin-right: 36rpx;}
|
||||
.mar-zy40{margin-left: 40rpx;margin-right: 40rpx;}
|
||||
.mar-zy50{margin-left: 50rpx;margin-right: 50rpx;}
|
||||
.mar-zy85{margin-left: 85rpx;margin-right: 85rpx;}
|
||||
/* 上---外边距 */
|
||||
.mar-s10{margin-top: 10rpx;}
|
||||
.mar-s20{margin-top: 20rpx;}
|
||||
.mar-s25{margin-top: 25rpx;}
|
||||
.mar-s30{margin-top: 30rpx;}
|
||||
.mar-s32{margin-top: 32rpx;}
|
||||
.mar-s36{margin-top: 36rpx;}
|
||||
.mar-s40{margin-top: 40rpx;}
|
||||
.mar-s50{margin-top: 50rpx;}
|
||||
.mar-s60{margin-top: 60rpx;}
|
||||
.mar-s70{margin-top: 70rpx;}
|
||||
.mar-s80{margin-top: 80rpx;}
|
||||
.mar-s90{margin-top: 90rpx;}
|
||||
.mar-s100{margin-top: 100rpx;}
|
||||
.mar-s120{margin-top: 120rpx;}
|
||||
.mar-s140{margin-top: 140rpx;}
|
||||
.mar-s160{margin-top: 160rpx;}
|
||||
.mar-s180{margin-top: 180rpx;}
|
||||
/* 下---外边距 */
|
||||
.mar-x10{margin-bottom: 10rpx;}
|
||||
.mar-x20{margin-bottom: 20rpx;}
|
||||
.mar-x25{margin-bottom: 25rpx;}
|
||||
.mar-x30{margin-bottom: 30rpx;}
|
||||
.mar-x32{margin-bottom: 32rpx;}
|
||||
.mar-x36{margin-bottom: 36rpx;}
|
||||
.mar-x40{margin-bottom: 40rpx;}
|
||||
.mar-x50{margin-bottom: 50rpx;}
|
||||
.mar-x60{margin-bottom: 60rpx;}
|
||||
.mar-x70{margin-bottom: 70rpx;}
|
||||
.mar-x80{margin-bottom: 80rpx;}
|
||||
.mar-x90{margin-bottom: 90rpx;}
|
||||
.mar-x100{margin-bottom: 100rpx;}
|
||||
.mar-x120{margin-bottom: 120rpx;}
|
||||
.mar-x140{margin-bottom: 140rpx;}
|
||||
.mar-x160{margin-bottom: 160rpx;}
|
||||
.mar-x180{margin-bottom: 180rpx;}
|
||||
/* 左---外边距 */
|
||||
.mar-z10{margin-left: 10rpx;}
|
||||
.mar-z20{margin-left: 20rpx;}
|
||||
.mar-z25{margin-left: 25rpx;}
|
||||
.mar-z30{margin-left: 30rpx;}
|
||||
.mar-z32{margin-left: 32rpx;}
|
||||
.mar-z36{margin-left: 36rpx;}
|
||||
.mar-z40{margin-left: 40rpx;}
|
||||
.mar-z50{margin-left: 50rpx;}
|
||||
/* 右---外边距 */
|
||||
.mar-y10{margin-right: 10rpx;}
|
||||
.mar-y20{margin-right: 20rpx;}
|
||||
.mar-y25{margin-right: 25rpx;}
|
||||
.mar-y30{margin-right: 30rpx;}
|
||||
.mar-y32{margin-right: 32rpx;}
|
||||
.mar-y36{margin-right: 36rpx;}
|
||||
.mar-y40{margin-right: 40rpx;}
|
||||
.mar-y50{margin-right: 50rpx;}
|
||||
|
||||
/* 上下左右---内边距 */
|
||||
.pad10{padding: 10rpx;}
|
||||
.pad20{padding: 20rpx;}
|
||||
.pad25{padding: 25rpx;}
|
||||
.pad30{padding: 30rpx;}
|
||||
.pad32{padding: 32rpx;}
|
||||
.pad36{padding: 36rpx;}
|
||||
.pad40{padding: 40rpx;}
|
||||
.pad50{padding: 50rpx;}
|
||||
/* 上下---内边距 */
|
||||
.pad-sx10{padding-top: 10rpx;padding-bottom: 10rpx;}
|
||||
.pad-sx20{padding-top: 20rpx;padding-bottom: 20rpx;}
|
||||
.pad-sx25{padding-top: 25rpx;padding-bottom: 25rpx;}
|
||||
.pad-sx30{padding-top: 30rpx;padding-bottom: 30rpx;}
|
||||
.pad-sx32{padding-top: 32rpx;padding-bottom: 32rpx;}
|
||||
.pad-sx36{padding-top: 36rpx;padding-bottom: 36rpx;}
|
||||
.pad-sx40{padding-top: 40rpx;padding-bottom: 40rpx;}
|
||||
.pad-sx50{padding-top: 50rpx;padding-bottom: 50rpx;}
|
||||
/* 左右---内边距 */
|
||||
.pad-zy10{padding-left: 10rpx;padding-right: 10rpx;}
|
||||
.pad-zy20{padding-left: 20rpx;padding-right: 20rpx;}
|
||||
.pad-zy25{padding-left: 25rpx;padding-right: 25rpx;}
|
||||
.pad-zy30{padding-left: 30rpx;padding-right: 30rpx;}
|
||||
.pad-zy32{padding-left: 32rpx;padding-right: 32rpx;}
|
||||
.pad-zy36{padding-left: 36rpx;padding-right: 36rpx;}
|
||||
.pad-zy40{padding-left: 40rpx;padding-right: 40rpx;}
|
||||
.pad-zy50{padding-left: 50rpx;padding-right: 50rpx;}
|
||||
/* 上---内边距 */
|
||||
.pad-s10{padding-top: 10rpx;}
|
||||
.pad-s20{padding-top: 20rpx;}
|
||||
.pad-s25{padding-top: 25rpx;}
|
||||
.pad-s30{padding-top: 30rpx;}
|
||||
.pad-s32{padding-top: 32rpx;}
|
||||
.pad-s36{padding-top: 36rpx;}
|
||||
.pad-s40{padding-top: 40rpx;}
|
||||
.pad-s50{padding-top: 50rpx;}
|
||||
.pad-s120{padding-top: 120rpx;}
|
||||
.pad-s140{padding-top: 140rpx;}
|
||||
.pad-s160{padding-top: 160rpx;}
|
||||
.pad-s180{padding-top: 180rpx;}
|
||||
/* 下---内边距 */
|
||||
.pad-x10{padding-bottom: 10rpx;}
|
||||
.pad-x20{padding-bottom: 20rpx;}
|
||||
.pad-x25{padding-bottom: 25rpx;}
|
||||
.pad-x30{padding-bottom: 30rpx;}
|
||||
.pad-x32{padding-bottom: 32rpx;}
|
||||
.pad-x36{padding-bottom: 36rpx;}
|
||||
.pad-x40{padding-bottom: 40rpx;}
|
||||
.pad-x50{padding-bottom: 50rpx;}
|
||||
.pad-x120{padding-bottom: 120rpx;}
|
||||
.pad-x140{padding-bottom: 140rpx;}
|
||||
.pad-x160{padding-bottom: 160rpx;}
|
||||
.pad-x180{padding-bottom: 180rpx;}
|
||||
.pad-x260{padding-bottom: 260rpx;}
|
||||
/* 左---内边距 */
|
||||
.pad-z10{padding-left: 10rpx;}
|
||||
.pad-z20{padding-left: 20rpx;}
|
||||
.pad-z25{padding-left: 25rpx;}
|
||||
.pad-z30{padding-left: 30rpx;}
|
||||
.pad-z32{padding-left: 32rpx;}
|
||||
.pad-z36{padding-left: 36rpx;}
|
||||
.pad-z40{padding-left: 40rpx;}
|
||||
.pad-z50{padding-left: 50rpx;}
|
||||
/* 右---内边距 */
|
||||
.pad-y10{padding-right: 10rpx;}
|
||||
.pad-y20{padding-right: 20rpx;}
|
||||
.pad-y25{padding-right: 25rpx;}
|
||||
.pad-y30{padding-right: 30rpx;}
|
||||
.pad-y32{padding-right: 32rpx;}
|
||||
.pad-y36{padding-right: 36rpx;}
|
||||
.pad-y40{padding-right: 40rpx;}
|
||||
.pad-y50{padding-right: 50rpx;}
|
||||
|
||||
.pad-sx27-zy20{padding: 27rpx 20rpx;}
|
||||
|
||||
|
||||
|
||||
|
||||
scroll-view ::-webkit-scrollbar {
|
||||
display: none !important;
|
||||
width: 0 !important;
|
||||
height: 0 !important;
|
||||
-webkit-appearance: none;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
@ -0,0 +1,379 @@
|
|||
/* 注册页面 */
|
||||
.register-close {width: 26rpx;height: 25rpx;}
|
||||
.register-title {color: #03affb;}
|
||||
.register-phone-img{
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-left: 8rpx solid transparent;
|
||||
border-top: 10rpx solid #000;
|
||||
border-right: 8rpx solid transparent;
|
||||
margin: 0 20rpx 0 10rpx;
|
||||
}
|
||||
.clear-input {
|
||||
width: 100%;
|
||||
border: none;
|
||||
border-bottom: 1rpx solid #d9d9d9;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
box-sizing: border-box;
|
||||
height: 66rpx;
|
||||
padding-right: 60rpx;
|
||||
}
|
||||
.obtain-code {
|
||||
flex-shrink: 0;
|
||||
border: 1rpx solid #03affb;
|
||||
color: #03affb;
|
||||
width: 170rpx;
|
||||
height: 45rpx;
|
||||
display: flex;justify-content: center;align-items: center;
|
||||
border-radius: 24rpx;
|
||||
padding: 4rpx 0rpx;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
.obtainIng {
|
||||
background-color: #03affb;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.placeholderColor {color: #bfbfbf;}
|
||||
.register-radio {transform: scale(0.5);margin-left: -10rpx;margin-right: -10rpx;}
|
||||
uni-radio .uni-radio-input {border: 1rpx solid #444444;}
|
||||
.register-agree-policy {color: #03affb;}
|
||||
.register-btn {width: 422rpx;height: 76rpx;display: flex;justify-content: center;align-items: center; margin: 0 auto;border-radius: 76rpx;margin-top: 60rpx; background-color: #03affb;color: #FFFFFF;}
|
||||
.clear-box {
|
||||
position: absolute;right: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
z-index: 1;
|
||||
}
|
||||
.clear-close {
|
||||
position: relative;
|
||||
display: flex;justify-content: center;align-items: center;
|
||||
width: 40rpx;height: 40rpx;
|
||||
border-radius: 100%;
|
||||
background-color: rgba(0,0,0,.3);
|
||||
}
|
||||
.clear-close span {
|
||||
position: absolute;
|
||||
width: 0;
|
||||
border: 2rpx solid #FFFFFF;
|
||||
height: 20rpx;
|
||||
border-radius: 2rpx;
|
||||
}
|
||||
.clear-close span:first-child {transform: rotate(45deg);}
|
||||
.clear-close span:last-child {transform: rotate(-45deg);}
|
||||
|
||||
|
||||
/* panding全局 */
|
||||
|
||||
.padding{
|
||||
padding: 0 27rpx;
|
||||
}
|
||||
/* 按钮全局 */
|
||||
.submit-button {
|
||||
width: 686rpx;
|
||||
border-radius: 50rpx;
|
||||
height: 90rpx;
|
||||
background-color: #02A2ea !important;
|
||||
display: flex;justify-content: center;align-items: center;
|
||||
color: #FFFFFF !important;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
/* 登录 */
|
||||
.login-img {
|
||||
width: 100%;
|
||||
}
|
||||
.login-box {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 46%;
|
||||
padding: 0 50rpx;
|
||||
}
|
||||
.login-input-box {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border: 1rpx solid #cbcccb;
|
||||
border-radius: 10rpx;
|
||||
padding: 20rpx;
|
||||
margin-bottom: 40rpx;
|
||||
}
|
||||
.login-code-btn {
|
||||
position: absolute;
|
||||
right: 20rpx;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
background-color: #03affb;
|
||||
color: #FFFFFF;
|
||||
padding: 10rpx 20rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
.login-input-box input {
|
||||
border-left: 1rpx solid #EEEEEE;
|
||||
margin-left: 20rpx;
|
||||
padding-left: 20rpx;
|
||||
}
|
||||
.login-btn {
|
||||
height: 80rpx;
|
||||
display: flex;justify-content: center;align-items: center;
|
||||
background-color: #03affb;
|
||||
border-radius: 10rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
/* 忘记密码 */
|
||||
.forget-title{color: #787a81;}
|
||||
.forget-input-box{
|
||||
border-bottom: 1rpx solid #EEEEEE;
|
||||
padding: 20rpx 0;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
.forget-obtain-code {
|
||||
position: absolute;
|
||||
right: 0rpx;
|
||||
top: 0rpx;
|
||||
background-color: #03affb;
|
||||
color: #FFFFFF;
|
||||
padding: 10rpx 20rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
.forget-btn {
|
||||
width: 422rpx;
|
||||
height: 75rpx;
|
||||
display: flex;justify-content: center;align-items: center;
|
||||
background-color: #03affb;
|
||||
color: #FFFFFF;
|
||||
border-radius: 75rpx;
|
||||
margin: 0 auto;
|
||||
box-shadow: 0rpx 10rpx 30rpx rgba(3, 175, 251,0.3);
|
||||
margin-top: 80rpx;
|
||||
}
|
||||
/* 首页 */
|
||||
.home-message-box {line-height: 60rpx;}
|
||||
.home-message-box image {
|
||||
width: 30rpx;
|
||||
height: 35rpx;
|
||||
}
|
||||
.home-message-box view {
|
||||
position: absolute;
|
||||
left: 14rpx;
|
||||
top: -16rpx;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
display: flex;justify-content: center;align-items: center;
|
||||
border-radius: 100%;
|
||||
font-size: 22rpx;
|
||||
background-color: #e93030;
|
||||
color: #FFFFFF;
|
||||
transform: scale(.8);
|
||||
}
|
||||
.project-notice-box {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
background-color: #FFFFFF;
|
||||
margin: 20rpx 0;
|
||||
border-radius: 10rpx;
|
||||
box-shadow: 6rpx 6rpx 20rpx rgba(0, 162, 234, 0.3);
|
||||
margin-top: -70rpx;
|
||||
padding: 20rpx 0;
|
||||
}
|
||||
.home-fun-box {
|
||||
background-color: #FFFFFF;
|
||||
padding: 30rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
.fun-title::before {
|
||||
content: '';
|
||||
display: block;
|
||||
width: 7rpx;
|
||||
height: 30rpx;
|
||||
background: linear-gradient(to top, #FFFFFF 0%, #03affb 40%, #03affb 100%);
|
||||
border-radius: 26%;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
.home-solution {
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
.solution-title {
|
||||
bottom: 6rpx;
|
||||
left: -40rpx;
|
||||
right: -40rpx;
|
||||
padding: 6rpx;
|
||||
background-color: rgba(255,255,255,0.6);
|
||||
transform: scale(.6);
|
||||
text-align: center;
|
||||
}
|
||||
.engineer-num {
|
||||
position: absolute;
|
||||
top: -16rpx;
|
||||
right: -12rpx;
|
||||
font-size: 24rpx;
|
||||
background-color: #f03232;
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
display: flex;justify-content: center;align-items: center;
|
||||
border-radius: 100%;
|
||||
color: #FFFFFF;
|
||||
transform: scale(.8);
|
||||
|
||||
}
|
||||
/* 我的页面 */
|
||||
.my-exit-btn{
|
||||
height: 88rpx;
|
||||
display: flex;justify-content: center;align-items: center;
|
||||
border-radius: 88rpx;
|
||||
background-color: #03affb;
|
||||
color: #FFFFFF;
|
||||
margin-top: 40rpx;
|
||||
}
|
||||
/* 个人信息页面 */
|
||||
.gender-box {margin-right: 80rpx;color: #333333;}
|
||||
.gender-box view{
|
||||
position: relative;
|
||||
width: 20rpx;
|
||||
height: 20rpx;
|
||||
border: 4rpx solid #818181;
|
||||
border-radius: 100%;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
.gender-box view::before {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%,-50%);
|
||||
content: '';
|
||||
display: block;
|
||||
width: 14rpx;
|
||||
height: 14rpx;
|
||||
background-color: #818181;
|
||||
border-radius: 100%;
|
||||
}
|
||||
.gender-active view{
|
||||
border: 4rpx solid #d81e06!important;
|
||||
}
|
||||
.gender-active view::before {
|
||||
background-color: #d81e06!important;
|
||||
}
|
||||
.person-btn {
|
||||
margin: 0 40rpx;
|
||||
height: 88rpx;
|
||||
display: flex;justify-content: center;align-items: center;
|
||||
border-radius: 88rpx;
|
||||
background-color: #03affb;
|
||||
color: #FFFFFF;
|
||||
margin-top: 40rpx;
|
||||
}
|
||||
/* 电子证件 */
|
||||
.electronic-head{
|
||||
background-color: #03affb;
|
||||
padding-top: 80rpx;
|
||||
}
|
||||
/* 服务范围 */
|
||||
.service-range-status {
|
||||
background-color: #cdcdcd;
|
||||
color: #333333;
|
||||
padding: 6rpx 20rpx;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
.service-range-activeStatus {
|
||||
background-color: #03affb;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
/* 我要评价 */
|
||||
.evaluate-addimg {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.evaluate-addimg::before,.evaluate-addimg::after{
|
||||
content: '';
|
||||
display: block;
|
||||
width: 2rpx;
|
||||
background-color: #959595;
|
||||
height: 60rpx;
|
||||
}
|
||||
.evaluate-addimg::before{
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
/* 我的账户 */
|
||||
.account-active {
|
||||
position: relative;
|
||||
color: #03affb;
|
||||
}
|
||||
.account-active::after{
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 0;
|
||||
content: '';
|
||||
display: block;
|
||||
width: 60%;
|
||||
height: 4rpx;
|
||||
background-color: #03affb;
|
||||
}
|
||||
.account-btn {
|
||||
border: 1rpx solid #00a2e9;
|
||||
color: #00a2e9;
|
||||
border-radius: 16rpx;
|
||||
padding: 8rpx 10rpx;
|
||||
}
|
||||
.account-detailed {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 29rpx;
|
||||
font-weight: bold;
|
||||
padding-left: 20rpx;
|
||||
}
|
||||
.account-detailed::before {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 4rpx;
|
||||
bottom: 4rpx;
|
||||
content: '';
|
||||
display: block;
|
||||
width: 4rpx;
|
||||
background-color: #03affb;
|
||||
}
|
||||
.account-detailed-item view:nth-child(1) {
|
||||
width: 16%;
|
||||
}
|
||||
.account-detailed-item view:nth-child(2) {
|
||||
width: 40%;
|
||||
text-align: center;
|
||||
}
|
||||
.account-detailed-item view:nth-child(3) {
|
||||
width: 16%;
|
||||
text-align: center;
|
||||
}
|
||||
.account-detailed-item view:nth-child(4) {
|
||||
width: 22%;
|
||||
text-align: center;
|
||||
}
|
||||
.unsettled-btn {
|
||||
font-size: 30rpx;
|
||||
color: #03affb;
|
||||
border: 1rpx solid #03affb;
|
||||
border-radius: 6rpx;
|
||||
padding: 6rpx 20rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
/* 消息中心 */
|
||||
.message-circle::before {
|
||||
content: '';
|
||||
display: flex;
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
background-color: #6f91ff;
|
||||
border-radius: 100%;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
.activity-message::before {
|
||||
background-color: #6f91ff;
|
||||
}
|
||||
.audit-failed::before {
|
||||
background-color: #f15d5d;
|
||||
}
|
||||
.system-notification::before {
|
||||
background-color: #2cfc3b;
|
||||
}
|
||||
|
|
@ -0,0 +1,123 @@
|
|||
@font-face {
|
||||
font-family: "iconfont"; /* Project id 3180711 */
|
||||
src: url('https://at.alicdn.com/t/font_3180711_7fx7wl7itar.woff2?t=1647479558213') format('woff2'),
|
||||
url('https://at.alicdn.com/t/font_3180711_7fx7wl7itar.woff?t=1647479558213') format('woff'),
|
||||
url('https://at.alicdn.com/t/font_3180711_7fx7wl7itar.ttf?t=1647479558213') format('truetype');
|
||||
}
|
||||
|
||||
.icon {
|
||||
font-family: "iconfont" !important;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icon-sandian:before {
|
||||
content: "\e769";
|
||||
}
|
||||
|
||||
.icon-nothing-collection:before {
|
||||
content: "\e610";
|
||||
}
|
||||
|
||||
.icon-nothing-more:before {
|
||||
content: "\e624";
|
||||
}
|
||||
|
||||
.icon-nothing-data:before {
|
||||
content: "\e60c";
|
||||
}
|
||||
|
||||
.icon-address-check:before {
|
||||
content: "\e6c2";
|
||||
}
|
||||
|
||||
.icon-address-unchecked:before {
|
||||
content: "\e623";
|
||||
}
|
||||
|
||||
.icon-navigate-now:before {
|
||||
content: "\e640";
|
||||
}
|
||||
|
||||
.icon-send-goods:before {
|
||||
content: "\e601";
|
||||
}
|
||||
|
||||
.icon-payment:before {
|
||||
content: "\e602";
|
||||
}
|
||||
|
||||
.icon-finish:before {
|
||||
content: "\e63f";
|
||||
}
|
||||
|
||||
.icon-take:before {
|
||||
content: "\e649";
|
||||
}
|
||||
|
||||
.icon-refund:before {
|
||||
content: "\e613";
|
||||
}
|
||||
|
||||
.icon-customer-black:before {
|
||||
content: "\ec2e";
|
||||
}
|
||||
|
||||
.icon-customer:before {
|
||||
content: "\e628";
|
||||
}
|
||||
|
||||
.icon-check:before {
|
||||
content: "\e61e";
|
||||
}
|
||||
|
||||
.icon-del-white:before {
|
||||
content: "\e61f";
|
||||
}
|
||||
|
||||
.icon-screen:before {
|
||||
content: "\e60b";
|
||||
}
|
||||
|
||||
.icon-search:before {
|
||||
content: "\e653";
|
||||
}
|
||||
|
||||
.icon-caidan-mo:before {
|
||||
content: "\e73e";
|
||||
}
|
||||
|
||||
.icon-renwu-mo:before {
|
||||
content: "\e73f";
|
||||
}
|
||||
|
||||
.icon-shopp-cart:before {
|
||||
content: "\e73d";
|
||||
}
|
||||
|
||||
.icon-caidan-active:before {
|
||||
content: "\e608";
|
||||
}
|
||||
|
||||
.icon-renwu-acitve:before {
|
||||
content: "\e67c";
|
||||
}
|
||||
|
||||
.icon-home-mo:before {
|
||||
content: "\e673";
|
||||
}
|
||||
|
||||
.icon-home-active:before {
|
||||
content: "\e674";
|
||||
}
|
||||
|
||||
.icon-return:before {
|
||||
content: "\e600";
|
||||
}
|
||||
|
||||
.icon-next:before {
|
||||
content: "\e60e";
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,176 @@
|
|||
<template>
|
||||
<view
|
||||
class="circle-progress"
|
||||
:style="{
|
||||
width: widthPx + 'px',
|
||||
height: widthPx + 'px',
|
||||
backgroundColor: bgColor
|
||||
}"
|
||||
>
|
||||
<!-- 有的不支持canvas-id属性，必须用id属性 -->
|
||||
<canvas v-if="canvasId"
|
||||
class="canvas-bg"
|
||||
:canvas-id="canvasId"
|
||||
:id="canvasId"
|
||||
:style="{
|
||||
width: widthPx + 'px',
|
||||
height: widthPx + 'px'
|
||||
}"
|
||||
></canvas>
|
||||
<canvas v-if="elId"
|
||||
class="canvas"
|
||||
:canvas-id="elId"
|
||||
:id="elId"
|
||||
:style="{
|
||||
width: widthPx + 'px',
|
||||
height: widthPx + 'px'
|
||||
}"
|
||||
></canvas>
|
||||
<slot></slot>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'circle-progress',
|
||||
props: {
|
||||
// 圆环进度百分比值
|
||||
percent: {
|
||||
type: Number,
|
||||
default: 0,
|
||||
// 值在0到100之间
|
||||
validator: val => {
|
||||
return val >= 0 && val <= 100;
|
||||
}
|
||||
},
|
||||
// 圆环底色（灰色的圆环）
|
||||
inactiveColor: {
|
||||
type: String,
|
||||
default: '#ececec'
|
||||
},
|
||||
// 圆环激活部分的颜色
|
||||
activeColor: {
|
||||
type: String,
|
||||
default: '#009dff'
|
||||
},
|
||||
// 圆环线条的宽度，单位rpx
|
||||
borderWidth: {
|
||||
type: [Number, String],
|
||||
default: 14
|
||||
},
|
||||
// 整个圆形的宽度，单位rpx
|
||||
width: {
|
||||
type: [Number, String],
|
||||
default: 200
|
||||
},
|
||||
// 整个圆环执行一圈的时间，单位ms
|
||||
duration: {
|
||||
type: [Number, String],
|
||||
default: 1500
|
||||
},
|
||||
// 圆环进度区域的背景色
|
||||
bgColor: {
|
||||
type: String,
|
||||
default: '#ffffff'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
canvasId: this.randomId(), //一个页面多个圆形进度
|
||||
elId: this.randomId(),
|
||||
widthPx: uni.upx2px(this.width), // 转成px后的整个组件的背景宽度
|
||||
borderWidthPx: uni.upx2px(this.borderWidth), // 转成px后的圆环的宽度
|
||||
startAngle: -Math.PI / 2, // canvas画圆的起始角度，默认为3点钟方向，定位到12点钟方向
|
||||
progressContext: null, // 活动圆的canvas上下文
|
||||
newPercent: 0, // 当动态修改进度值的时候，保存进度值的变化前后值，用于比较用
|
||||
oldPercent: 0 // 当动态修改进度值的时候，保存进度值的变化前后值，用于比较用
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
percent(nVal, oVal = 0) {
|
||||
if (nVal > 100) nVal = 100;
|
||||
if (nVal < 0) oVal = 0;
|
||||
this.newPercent = nVal;
|
||||
this.oldPercent = oVal;
|
||||
setTimeout(() => {
|
||||
this.drawCircleByProgress(oVal);
|
||||
}, 50);
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// 赋值，用于加载后第一个画圆使用
|
||||
this.newPercent = this.percent;
|
||||
this.oldPercent = 0;
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.drawProgressBg();
|
||||
this.drawCircleByProgress(this.oldPercent);
|
||||
},
|
||||
methods: {
|
||||
//一个页面多个progress时ID需不同
|
||||
randomId(){
|
||||
return 'progressId'+parseInt(Math.random()*1000000)
|
||||
},
|
||||
drawProgressBg() {
|
||||
let ctx = uni.createCanvasContext(this.canvasId, this);
|
||||
ctx.setLineWidth(this.borderWidthPx); // 设置圆环宽度
|
||||
ctx.setStrokeStyle(this.inactiveColor); // 线条颜色
|
||||
ctx.beginPath(); // 开始描绘路径
|
||||
let radius = this.widthPx / 2;
|
||||
ctx.arc(radius, radius, radius - this.borderWidthPx, 0, 2 * Math.PI, false);
|
||||
ctx.stroke(); // 对路径进行描绘
|
||||
ctx.draw();
|
||||
},
|
||||
drawCircleByProgress(progress) {
|
||||
let ctx = this.progressContext;
|
||||
if (!ctx) {
|
||||
ctx = uni.createCanvasContext(this.elId, this);
|
||||
this.progressContext = ctx;
|
||||
}
|
||||
// 表示进度的两端为圆形
|
||||
ctx.setLineCap('round');
|
||||
// 设置线条的宽度和颜色
|
||||
ctx.setLineWidth(this.borderWidthPx);
|
||||
ctx.setStrokeStyle(this.activeColor);
|
||||
// 计算过渡时间
|
||||
let time = Math.floor(this.duration / 200);
|
||||
let endAngle = ((2 * Math.PI) / 100) * progress + this.startAngle;
|
||||
ctx.beginPath();
|
||||
// 半径为整个canvas宽度的一半
|
||||
let radius = this.widthPx / 2;
|
||||
ctx.arc(radius, radius, radius - this.borderWidthPx, this.startAngle, endAngle, false);
|
||||
ctx.stroke();
|
||||
ctx.draw();
|
||||
// 增大了百分比
|
||||
if (this.newPercent > this.oldPercent) {
|
||||
progress++;
|
||||
if (progress > this.newPercent) return;
|
||||
} else {
|
||||
// 减少百分比
|
||||
progress--;
|
||||
if (progress < this.newPercent) return;
|
||||
}
|
||||
setTimeout(() => {
|
||||
// 定时器，为了让进度条有动画效果
|
||||
this.drawCircleByProgress(progress);
|
||||
}, time);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.circle-progress {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.canvas-bg {
|
||||
position: absolute;
|
||||
}
|
||||
.canvas {
|
||||
position: absolute;
|
||||
}
|
||||
</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: #03affb;
|
||||
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: #03affb;
|
||||
border-bottom-color: #03affb;
|
||||
}
|
||||
.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: #03affb;
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -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,568 @@
|
|||
<template>
|
||||
<view class="cmd-progress cmd-progress-default" :class="setStatusClass">
|
||||
<block v-if="type == 'circle' || type == 'dashboard'">
|
||||
<view class="cmd-progress cmd-progress-default" :class="setStatusClass">
|
||||
<view class="cmd-progress-inner" :style="setCircleStyle">
|
||||
<!-- 绘制圈 start -->
|
||||
<!-- #ifdef H5 -->
|
||||
<svg viewBox="0 0 100 100" class="cmd-progress-circle">
|
||||
<path :d="setCirclePath" stroke="#f3f3f3" :stroke-linecap="strokeShape" :stroke-width="strokeWidth"
|
||||
fill-opacity="0" class="cmd-progress-circle-trail" :style="setCircleTrailStyle"></path>
|
||||
<path :d="setCirclePath" :stroke-linecap="strokeShape" :stroke-width="strokeWidth" fill-opacity="0" class="cmd-progress-circle-path"
|
||||
:style="setCirclePathStyle"></path>
|
||||
</svg>
|
||||
<!-- #endif -->
|
||||
<!-- #ifndef H5 -->
|
||||
<text :style="setCircle"></text>
|
||||
<!-- #endif -->
|
||||
<!-- 绘制圈 end -->
|
||||
<!-- 状态文本 start -->
|
||||
<block v-if="showInfo">
|
||||
<text class="cmd-progress-text" :title="setFormat" :style="{color: strokeColor}">
|
||||
<block v-if="status != 'success' && status != 'exception' && setProgress < 100">{{setFormat}}</block>
|
||||
<!-- #ifdef H5 -->
|
||||
<svg v-if="status == 'exception'" viewBox="64 64 896 896" data-icon="close" width="1em" height="1em" fill="currentColor"
|
||||
aria-hidden="true">
|
||||
<path d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 0 0 203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path>
|
||||
</svg>
|
||||
<!-- <svg v-if="status == 'success' || setProgress == 100" viewBox="64 64 896 896" data-icon="check" width="1em"
|
||||
height="1em" fill="currentColor" aria-hidden="true" :style="{'color': strokeColor ? strokeColor : ''}">
|
||||
<path d="M912 190h-69.9c-9.8 0-19.1 4.5-25.1 12.2L404.7 724.5 207 474a32 32 0 0 0-25.1-12.2H112c-6.7 0-10.4 7.7-6.3 12.9l273.9 347c12.8 16.2 37.4 16.2 50.3 0l488.4-618.9c4.1-5.1.4-12.8-6.3-12.8z"></path>
|
||||
</svg> -->
|
||||
<text v-if="status == 'exception' || status == 'success' || setProgress == 100">{{setFormat}}</text>
|
||||
<!-- #endif -->
|
||||
<!-- #ifndef H5 -->
|
||||
<!-- <text v-if="status == 'exception' || status == 'success' || setProgress == 100" :style="setCircleIcon"></text> -->
|
||||
<text v-if="status == 'exception' || status == 'success' || setProgress == 100">{{setFormat}}</text>
|
||||
<!-- #endif -->
|
||||
</text>
|
||||
</block>
|
||||
<!-- 状态文本 end -->
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<block v-if="type == 'line'">
|
||||
<!-- 进度条 start -->
|
||||
<view class="cmd-progress-outer">
|
||||
<view class="cmd-progress-inner" :style="{'border-radius': strokeShape == 'square' ? 0 : '100px'}">
|
||||
<view class="cmd-progress-bg" :style="setLineStyle"></view>
|
||||
<view v-if="successPercent" class="cmd-progress-success-bg" :style="setLineSuccessStyle"></view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 进度条 end -->
|
||||
<!-- 进度条是否显示信息 start -->
|
||||
<block v-if="showInfo">
|
||||
<text class="cmd-progress-text" :title="setFormat">
|
||||
<block v-if="status != 'success' && status != 'exception' && setProgress < 100">{{setFormat}}</block>
|
||||
<!-- #ifdef H5 -->
|
||||
<svg v-if="status == 'exception'" viewBox="64 64 896 896" data-icon="close-circle" width="1em" height="1em"
|
||||
fill="currentColor" aria-hidden="true">
|
||||
<path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm165.4 618.2l-66-.3L512 563.4l-99.3 118.4-66.1.3c-4.4 0-8-3.5-8-8 0-1.9.7-3.7 1.9-5.2l130.1-155L340.5 359a8.32 8.32 0 0 1-1.9-5.2c0-4.4 3.6-8 8-8l66.1.3L512 464.6l99.3-118.4 66-.3c4.4 0 8 3.5 8 8 0 1.9-.7 3.7-1.9 5.2L553.5 514l130 155c1.2 1.5 1.9 3.3 1.9 5.2 0 4.4-3.6 8-8 8z"></path>
|
||||
</svg>
|
||||
<svg v-if="status == 'success' || setProgress == 100" viewBox="64 64 896 896" data-icon="check-circle" width="1em"
|
||||
height="1em" fill="currentColor" aria-hidden="true" :style="{'color': strokeColor ? strokeColor : ''}">
|
||||
<path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm193.5 301.7l-210.6 292a31.8 31.8 0 0 1-51.7 0L318.5 484.9c-3.8-5.3 0-12.7 6.5-12.7h46.9c10.2 0 19.9 4.9 25.9 13.3l71.2 98.8 157.2-218c6-8.3 15.6-13.3 25.9-13.3H699c6.5 0 10.3 7.4 6.5 12.7z"></path>
|
||||
</svg>
|
||||
<!-- #endif -->
|
||||
<!-- #ifndef H5 -->
|
||||
<!-- <text v-if="status == 'exception' || status == 'success' || setProgress == 100" :style="setLineStatusIcon"></text> -->
|
||||
<text v-if="status == 'exception' || status == 'success' || setProgress == 100">{{setFormat}}</text>
|
||||
<!-- #endif -->
|
||||
</text>
|
||||
</block>
|
||||
<!-- 进度条是否显示信息 end -->
|
||||
</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/**
|
||||
* 进度条组件
|
||||
* @description 显示一个操作完成的百分比时，为用户显示该操作的当前进度和状态。
|
||||
* @tutorial https://ext.dcloud.net.cn/plugin?id=259
|
||||
* @property {String} type 进度类型 - 线型：line、圆圈形：circle、仪表盘：dashboard，默认线型：line
|
||||
* @property {Number} percent 进度百分比值 - 显示范围0-100 ，可能数比较大就需要自己转成百分比的值
|
||||
* @property {Number} success-percent 进度已完成的百分几 - 仅支持进度线型：line
|
||||
* @property {String} status 进度状态 - 涌动：active（仅支持线型：line）、正常：normal、完成：success、失败：exception，默认正常：normal
|
||||
* @property {Boolean} show-info 进度状态信息 - 是否显示进度数值或状态图标，默认true
|
||||
* @property {Number} stroke-width 进度线条的宽度 - 建议在条线的宽度范围：1-50，与进度条显示宽度有关，默认8
|
||||
* @property {String} stroke-color 进度线条的颜色 - 渐变色仅支持线型：line
|
||||
* @property {String} stroke-shape 进度线条两端的形状 - 圆：round、方块直角：square，默认圆：round
|
||||
* @property {Number} width 进度画布宽度 - 仅支持圆圈形：circle、仪表盘：dashboard，默认80
|
||||
* @property {String} gap-degree 进度圆形缺口角度 - 可取值 0 ~ 360,仅支持圆圈形：circle、仪表盘：dashboard
|
||||
* @property {String} gap-position 进度圆形缺口位置 - 可取值'top', 'bottom', 'left', 'right',仅支持圆圈形：circle、仪表盘：dashboard
|
||||
* @example <cmd-progress :percent="30"></cmd-progress>
|
||||
*/
|
||||
export default {
|
||||
name: 'cmd-progress',
|
||||
|
||||
props: {
|
||||
/**
|
||||
* 类型默认：line，可选 line circle dashboard
|
||||
*/
|
||||
type: {
|
||||
validator: val => {
|
||||
return ['line', 'circle', 'dashboard'].includes(val);
|
||||
},
|
||||
default: 'line'
|
||||
},
|
||||
/**
|
||||
* 百分比
|
||||
*/
|
||||
percent: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
/**
|
||||
* 已完成的分段百分，仅支持类型line
|
||||
*/
|
||||
successPercent: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
/**
|
||||
* 是否显示进度数值或状态图标
|
||||
*/
|
||||
showInfo: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
/**
|
||||
* 进度状态，可选：normal success exception （active仅支持类型line
|
||||
*/
|
||||
status: {
|
||||
validator: val => {
|
||||
return ['normal', 'success', 'exception', 'active'].includes(val);
|
||||
},
|
||||
default: 'normal'
|
||||
},
|
||||
/**
|
||||
* 条线的宽度1-50，与width有关
|
||||
*/
|
||||
strokeWidth: {
|
||||
type: Number,
|
||||
default: 6
|
||||
},
|
||||
/**
|
||||
* 条线的颜色，渐变色仅支持类型line
|
||||
*/
|
||||
strokeColor: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
/**
|
||||
* 线圈底色
|
||||
*/
|
||||
circleStrokeColor:{
|
||||
type:String,
|
||||
default:''
|
||||
},
|
||||
/**
|
||||
* 条线两端的形状 可选：'round', 'square'
|
||||
*/
|
||||
strokeShape: {
|
||||
validator: val => {
|
||||
return ['round', 'square'].includes(val);
|
||||
},
|
||||
default: 'round'
|
||||
},
|
||||
/**
|
||||
* 圆形进度条画布宽度,支持类型circle dashboard
|
||||
*/
|
||||
width: {
|
||||
type: Number,
|
||||
default: 80
|
||||
},
|
||||
/**
|
||||
* 圆形进度条缺口角度，可取值 0 ~ 360,支持类型circle dashboard
|
||||
*/
|
||||
gapDegree: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
/**
|
||||
* 圆形进度条缺口位置,可取值'top', 'bottom', 'left', 'right' ,支持类型circle dashboard
|
||||
*/
|
||||
gapPosition: {
|
||||
validator: val => {
|
||||
return ['top', 'bottom', 'left', 'right'].includes(val);
|
||||
},
|
||||
default: 'top'
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
/**
|
||||
* 如果需要自定义格式就在这改
|
||||
*/
|
||||
setFormat() {
|
||||
return `${this.setProgress}%`;
|
||||
},
|
||||
/**
|
||||
* 设置显示进度值，禁止小于0和超过100
|
||||
*/
|
||||
setProgress() {
|
||||
let percent = this.percent;
|
||||
if (!this.percent || this.percent < 0) {
|
||||
percent = 0;
|
||||
} else if (this.percent >= 100) {
|
||||
percent = 100;
|
||||
}
|
||||
return percent;
|
||||
},
|
||||
/**
|
||||
* 进度圈svg大小
|
||||
*/
|
||||
setCircleStyle() {
|
||||
return `width: ${this.width}px;
|
||||
height: ${this.width}px;
|
||||
fontSize: ${this.width * 0.15 + 6}px;`
|
||||
},
|
||||
/**
|
||||
* 圈底色
|
||||
*/
|
||||
setCircleTrailStyle() {
|
||||
const radius = 50 - this.strokeWidth / 2;
|
||||
const len = Math.PI * 2 * radius;
|
||||
const gapDeg = this.gapDegree || (this.type === 'dashboard' && 75);
|
||||
return `stroke-dasharray: ${len - (gapDeg||0)}px, ${len}px;
|
||||
stroke-dashoffset: -${(gapDeg||0) / 2}px;
|
||||
stroke: ${this.circleStrokeColor};
|
||||
transition: stroke-dashoffset 0.3s ease 0s, stroke-dasharray 0.3s ease 0s, stroke 0.3s;`
|
||||
},
|
||||
/**
|
||||
* 圈进度
|
||||
*/
|
||||
setCirclePathStyle() {
|
||||
const radius = 50 - this.strokeWidth / 2;
|
||||
const len = Math.PI * 2 * radius;
|
||||
const gapDeg = this.gapDegree || (this.type === 'dashboard' && 75);
|
||||
return `stroke: ${this.strokeColor};
|
||||
stroke-dasharray: ${(this.setProgress / 100) * (len - (gapDeg||0))}px, ${len}px;
|
||||
stroke-dashoffset: -${(gapDeg||0) / 2}px;
|
||||
transition: stroke-dashoffset 0.3s ease 0s, stroke-dasharray 0.3s ease 0s, stroke 0.3s, stroke-width 0.06s ease 0.3s;`
|
||||
},
|
||||
/**
|
||||
* 绘制圈
|
||||
*/
|
||||
setCirclePath() {
|
||||
const radius = 50 - this.strokeWidth / 2;
|
||||
let beginPositionX = 0;
|
||||
let beginPositionY = -radius;
|
||||
let endPositionX = 0;
|
||||
let endPositionY = -2 * radius;
|
||||
const gapPos = (this.type === 'dashboard' && 'bottom') || this.gapPosition || 'top';
|
||||
switch (gapPos) {
|
||||
case 'left':
|
||||
beginPositionX = -radius;
|
||||
beginPositionY = 0;
|
||||
endPositionX = 2 * radius;
|
||||
endPositionY = 0;
|
||||
break;
|
||||
case 'right':
|
||||
beginPositionX = radius;
|
||||
beginPositionY = 0;
|
||||
endPositionX = -2 * radius;
|
||||
endPositionY = 0;
|
||||
break;
|
||||
case 'bottom':
|
||||
beginPositionY = radius;
|
||||
endPositionY = 2 * radius;
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
return `M 50,50 m ${beginPositionX},${beginPositionY} a ${radius},${radius} 0 1 1 ${endPositionX},${-endPositionY} a ${radius},${radius} 0 1 1 ${-endPositionX},${endPositionY}`;
|
||||
},
|
||||
// #ifndef H5
|
||||
/**
|
||||
* 非H5端，绘制进度圈svg转base URL
|
||||
*/
|
||||
setCircle() {
|
||||
const radius = 50 - this.strokeWidth / 2;
|
||||
const len = Math.PI * 2 * radius;
|
||||
const gapDeg = this.gapDegree || (this.type === 'dashboard' && 75);
|
||||
let currentColor = '#108ee9'
|
||||
// 异常进度
|
||||
if (this.status == 'exception') {
|
||||
currentColor = '#f5222d'
|
||||
}
|
||||
// 完成进度
|
||||
if (this.status == 'success' || this.setProgress >= 100 || this.strokeColor) {
|
||||
currentColor = this.strokeColor || '#52c41a'
|
||||
}
|
||||
let svgToBase =
|
||||
`data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' class='cmd-progress-circle'%3E%3Cpath d='${this.setCirclePath}' stroke='%23f3f3f3' stroke-linecap='${this.strokeShape}' stroke-width='${this.strokeWidth}' fill-opacity='0' class='cmd-progress-circle-trail' style='stroke-dasharray: ${len - (gapDeg||0)}px, ${len}px;stroke-dashoffset: -${(gapDeg||0) / 2}px;transition: stroke-dashoffset 0.3s ease 0s, stroke-dasharray 0.3s ease 0s, stroke 0.3s;'%3E%3C/path%3E%3Cpath d='${this.setCirclePath}' stroke-linecap='${this.strokeShape}' stroke-width='${this.strokeWidth}' fill-opacity='0' class='cmd-progress-circle-path' style='stroke: ${escape(currentColor)};stroke-dasharray: ${(this.setProgress / 100) * (len - (gapDeg||0))}px, ${len}px;stroke-dashoffset: -${(gapDeg||0) / 2}px;transition: stroke-dashoffset 0.3s ease 0s, stroke-dasharray 0.3s ease 0s, stroke 0.3s, stroke-width 0.06s ease 0.3s;'%3E%3C/path%3E%3C/svg%3E`
|
||||
return `background-image: url("${svgToBase}");
|
||||
background-size: cover;
|
||||
display: inline-block;
|
||||
${this.setCircleStyle}`;
|
||||
},
|
||||
/**
|
||||
* 设置进度圈状态图标
|
||||
*/
|
||||
setCircleIcon() {
|
||||
let currentColor = '#108ee9'
|
||||
let svgToBase = ''
|
||||
// 异常进度
|
||||
if (this.status == 'exception') {
|
||||
currentColor = '#f5222d'
|
||||
svgToBase =
|
||||
`data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='64 64 896 896' data-icon='close' width='1em' height='1em' fill='${escape(currentColor)}' aria-hidden='true'%3E %3Cpath d='M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 0 0 203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z'%3E%3C/path%3E %3C/svg%3E`;
|
||||
}
|
||||
// 完成进度
|
||||
if (this.status == 'success' || this.setProgress >= 100) {
|
||||
currentColor = this.strokeColor || '#52c41a'
|
||||
// svgToBase = `data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='64 64 896 896' data-icon='check' width='1em' height='1em' fill='${escape(currentColor)}' aria-hidden='true'%3E %3Cpath d='M912 190h-69.9c-9.8 0-19.1 4.5-25.1 12.2L404.7 724.5 207 474a32 32 0 0 0-25.1-12.2H112c-6.7 0-10.4 7.7-6.3 12.9l273.9 347c12.8 16.2 37.4 16.2 50.3 0l488.4-618.9c4.1-5.1.4-12.8-6.3-12.8z'%3E%3C/path%3E %3C/svg%3E`;
|
||||
}
|
||||
return `background-image: url("${svgToBase}");
|
||||
background-size: cover;
|
||||
display: inline-block;
|
||||
width: 1em;
|
||||
height: 1em;`;
|
||||
},
|
||||
// #endif
|
||||
/**
|
||||
* 设置进度条样式
|
||||
*/
|
||||
setLineStyle() {
|
||||
return `width: ${this.setProgress}%;
|
||||
height: ${this.strokeWidth}px;
|
||||
background: ${this.strokeColor};
|
||||
border-radius: ${this.strokeShape === 'square' ? 0 : '100px'};`;
|
||||
},
|
||||
/**
|
||||
* 设置已完成分段进度
|
||||
*/
|
||||
setLineSuccessStyle() {
|
||||
let successPercent = this.successPercent;
|
||||
if (!this.successPercent || this.successPercent < 0 || this.setProgress < this.successPercent) {
|
||||
successPercent = 0;
|
||||
} else if (this.successPercent >= 100) {
|
||||
successPercent = 100;
|
||||
}
|
||||
return `width: ${successPercent}%;
|
||||
height: ${this.strokeWidth}px;
|
||||
border-radius: ${this.strokeShape === 'square' ? 0 : '100px'};`;
|
||||
},
|
||||
// #ifndef H5
|
||||
/**
|
||||
* 设置进度条状态图标
|
||||
*/
|
||||
setLineStatusIcon() {
|
||||
let currentColor = '#108ee9'
|
||||
let svgToBase = ''
|
||||
// 异常进度
|
||||
if (this.status == 'exception') {
|
||||
currentColor = '#f5222d'
|
||||
svgToBase =
|
||||
`data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='64 64 896 896' data-icon='close-circle' width='1em' height='1em' fill='${escape(currentColor)}' aria-hidden='true'%3E %3Cpath d='M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm165.4 618.2l-66-.3L512 563.4l-99.3 118.4-66.1.3c-4.4 0-8-3.5-8-8 0-1.9.7-3.7 1.9-5.2l130.1-155L340.5 359a8.32 8.32 0 0 1-1.9-5.2c0-4.4 3.6-8 8-8l66.1.3L512 464.6l99.3-118.4 66-.3c4.4 0 8 3.5 8 8 0 1.9-.7 3.7-1.9 5.2L553.5 514l130 155c1.2 1.5 1.9 3.3 1.9 5.2 0 4.4-3.6 8-8 8z'%3E%3C/path%3E %3C/svg%3E`;
|
||||
}
|
||||
// 完成进度
|
||||
if (this.status == 'success' || this.setProgress >= 100) {
|
||||
currentColor = this.strokeColor || '#52c41a'
|
||||
svgToBase =
|
||||
`data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='64 64 896 896' data-icon='check-circle' width='1em' height='1em' fill='${escape(currentColor)}' aria-hidden='true'%3E %3Cpath d='M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm193.5 301.7l-210.6 292a31.8 31.8 0 0 1-51.7 0L318.5 484.9c-3.8-5.3 0-12.7 6.5-12.7h46.9c10.2 0 19.9 4.9 25.9 13.3l71.2 98.8 157.2-218c6-8.3 15.6-13.3 25.9-13.3H699c6.5 0 10.3 7.4 6.5 12.7z'%3E%3C/path%3E %3C/svg%3E`;
|
||||
}
|
||||
return `background-image: url("${svgToBase}");
|
||||
background-size: cover;
|
||||
display: inline-block;
|
||||
width: 1em;
|
||||
height: 1em;`;
|
||||
},
|
||||
// #endif
|
||||
/**
|
||||
* 状态样式
|
||||
*/
|
||||
setStatusClass() {
|
||||
let statusClass = [];
|
||||
// 异常进度
|
||||
if (this.status == 'exception') {
|
||||
statusClass.push('cmd-progress-status-exception')
|
||||
}
|
||||
// 完成进度
|
||||
if (this.status == 'success' || this.setProgress >= 100) {
|
||||
statusClass.push('cmd-progress-status-success')
|
||||
}
|
||||
// 活动进度条
|
||||
if (this.status == 'active') {
|
||||
statusClass.push('cmd-progress-status-active')
|
||||
}
|
||||
// 是否显示信息
|
||||
if (this.showInfo) {
|
||||
statusClass.push('cmd-progress-show-info')
|
||||
}
|
||||
// 进度条类型
|
||||
if (this.type === 'line') {
|
||||
statusClass.push('cmd-progress-line')
|
||||
}
|
||||
// 进度圈、仪表盘类型
|
||||
if (this.type === 'circle' || this.type === 'dashboard') {
|
||||
statusClass.push('cmd-progress-circle')
|
||||
}
|
||||
statusClass.push('cmd-progress-status-normal')
|
||||
return statusClass;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.cmd-progress {
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.cmd-progress-line {
|
||||
width: 100%;
|
||||
font-size: 28upx;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.cmd-progress-outer {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
margin-right: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cmd-progress-show-info .cmd-progress-outer {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.cmd-progress-inner {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
background-color: #f5f5f5;
|
||||
border-radius: 200upx;
|
||||
vertical-align: middle;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.cmd-progress-circle-trail {
|
||||
stroke: #f5f5f5;
|
||||
}
|
||||
|
||||
.cmd-progress-circle-path {
|
||||
stroke: #1890ff;
|
||||
animation: appear 0.3s;
|
||||
}
|
||||
|
||||
.cmd-progress-success-bg,
|
||||
.cmd-progress-bg {
|
||||
background-color: #1890ff;
|
||||
transition: all 0.4s cubic-bezier(0.08, 0.82, 0.17, 1) 0s;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.cmd-progress-success-bg {
|
||||
background-color: #52c41a;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.cmd-progress-text {
|
||||
word-break: normal;
|
||||
width: 60upx;
|
||||
text-align: left;
|
||||
margin-left: 16upx;
|
||||
vertical-align: middle;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
color: rgba(0, 0, 0, 0.45);
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.cmd-progress-status-active .cmd-progress-bg:before {
|
||||
content: "";
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: #fff;
|
||||
border-radius: 20upx;
|
||||
-webkit-animation: cmd-progress-active 2.4s cubic-bezier(0.23, 1, 0.32, 1) infinite;
|
||||
animation: cmd-progress-active 2.4s cubic-bezier(0.23, 1, 0.32, 1) infinite;
|
||||
}
|
||||
|
||||
.cmd-progress-status-exception .cmd-progress-bg {
|
||||
background-color: #f5222d;
|
||||
}
|
||||
|
||||
.cmd-progress-status-exception .cmd-progress-text {
|
||||
color: #f5222d;
|
||||
}
|
||||
|
||||
.cmd-progress-status-exception .cmd-progress-circle-path {
|
||||
stroke: #f5222d;
|
||||
}
|
||||
|
||||
.cmd-progress-status-success .cmd-progress-bg {
|
||||
background-color: #52c41a;
|
||||
}
|
||||
|
||||
.cmd-progress-status-success .cmd-progress-text {
|
||||
color: #52c41a;
|
||||
}
|
||||
|
||||
.cmd-progress-status-success .cmd-progress-circle-path {
|
||||
stroke: #52c41a;
|
||||
}
|
||||
|
||||
.cmd-progress-circle .cmd-progress-inner {
|
||||
position: relative;
|
||||
line-height: 1;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.cmd-progress-circle .cmd-progress-text {
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
line-height: 1;
|
||||
top: 50%;
|
||||
-webkit-transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
left: 0;
|
||||
margin: 0;
|
||||
color: rgba(0, 0, 0, 0.65);
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.cmd-progress-circle .cmd-progress-status-exception .cmd-progress-text {
|
||||
color: #f5222d;
|
||||
}
|
||||
|
||||
.cmd-progress-circle .cmd-progress-status-success .cmd-progress-text {
|
||||
color: #52c41a;
|
||||
}
|
||||
|
||||
@keyframes cmd-progress-active {
|
||||
0% {
|
||||
opacity: 0.1;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
20% {
|
||||
opacity: 0.5;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 0;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,65 @@
|
|||
<template>
|
||||
<view>
|
||||
<view class="pad-zy30" :style="{paddingBottom: '70px'}">
|
||||
<slot name="content"></slot>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:"container-subgroup",
|
||||
props:{
|
||||
ifLoading:{
|
||||
type:Boolean,
|
||||
default:true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
statusBarHeight:uni.getSystemInfoSync().statusBarHeight + 50,
|
||||
loading:true,
|
||||
exist:''
|
||||
};
|
||||
},
|
||||
// 执行顺序 第一
|
||||
beforeCreate(){
|
||||
|
||||
},
|
||||
// 执行顺序 第二
|
||||
created(){
|
||||
|
||||
},
|
||||
// 执行顺序 第三
|
||||
beforeMount(){
|
||||
|
||||
},
|
||||
// 执行顺序 第四
|
||||
mounted(){
|
||||
setTimeout(()=>{
|
||||
this.loading = false;
|
||||
},500)
|
||||
},
|
||||
// 组件更新前
|
||||
beforeUpdate(){
|
||||
|
||||
},
|
||||
// 组件更新后
|
||||
updated(){
|
||||
|
||||
},
|
||||
// 组件销毁前：实例销毁之前调用。在这一步，实例仍然完全可用
|
||||
beforeDestroy(){
|
||||
|
||||
},
|
||||
// 销毁所有实例
|
||||
destroyed(){
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,85 @@
|
|||
<template>
|
||||
<view>
|
||||
<view v-if="loading && ifLoading" class="container-loading">
|
||||
<view class="loading-box">
|
||||
<span></span>
|
||||
<span></span>
|
||||
<span></span>
|
||||
<span></span>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else class="pad-zy20" style="padding-bottom: 70px;">
|
||||
<slot name="content"></slot>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:"container-subgroup",
|
||||
props:{
|
||||
ifLoading:{
|
||||
type:Boolean,
|
||||
default:true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
statusBarHeight:uni.getStorageSync('statusBar') + 50,
|
||||
loading:true,
|
||||
exist:''
|
||||
};
|
||||
},
|
||||
// 执行顺序 第一
|
||||
beforeCreate(){
|
||||
this.exist = uni.getStorageSync('token');
|
||||
this.exist ? this.loading = false : this.loading = true;
|
||||
},
|
||||
// 执行顺序 第二
|
||||
created(){
|
||||
|
||||
},
|
||||
// 执行顺序 第三
|
||||
beforeMount(){
|
||||
|
||||
},
|
||||
// 执行顺序 第四
|
||||
mounted(){
|
||||
setTimeout(()=>{
|
||||
this.loading = false;
|
||||
},500)
|
||||
},
|
||||
// 组件更新前
|
||||
beforeUpdate(){
|
||||
|
||||
},
|
||||
// 组件更新后
|
||||
updated(){
|
||||
|
||||
},
|
||||
// 组件销毁前：实例销毁之前调用。在这一步，实例仍然完全可用
|
||||
beforeDestroy(){
|
||||
|
||||
},
|
||||
// 销毁所有实例
|
||||
destroyed(){
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.container-loading {position: fixed;top: 0;left: 0;bottom: 0;right: 0;display: flex;justify-content: center;align-items: center;}
|
||||
.container-loading .loading-box {width: 80rpx;display: flex;flex-wrap: wrap;animation: rotate 3s linear infinite;}
|
||||
@keyframes rotate{
|
||||
to{transform: rotateZ(360deg);}
|
||||
}
|
||||
.container-loading .loading-box span {width: 32rpx;height: 32rpx;background-color: #000000;margin: 4rpx;animation: scale 1.5s linear infinite;}
|
||||
@keyframes scale{
|
||||
50%{transform: scale(1);}
|
||||
}
|
||||
.container-loading .loading-box span:nth-child(1){border-radius: 50% 50% 0 50%;transform-origin: bottom right;}
|
||||
.container-loading .loading-box span:nth-child(2){border-radius: 50% 50% 50% 0;transform-origin: bottom left;animation-delay: .5s;}
|
||||
.container-loading .loading-box span:nth-child(3){border-radius: 50% 0 50% 50%;transform-origin: top right;animation-delay: 1.5s;}
|
||||
.container-loading .loading-box span:nth-child(4){border-radius: 0 50% 50% 50%;transform-origin: top left;animation-delay: 1s;}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,133 @@
|
|||
<template>
|
||||
<view @click="toggle" class="evan-switch" :class="{'evan-switch--disabled':disabled}" :style="{width:2*size+'px',height:switchHeight,borderRadius:size+'px',backgroundColor:currentValue===activeValue?activeColor:inactiveColor}">
|
||||
<view class="evan-switch__circle" :style="{width:size+'px',height:size+'px',transform:currentValue===activeValue?`translateX(${size}px)`:`translateX(0)`}"></view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'EvanSwitch',
|
||||
props: {
|
||||
value: {
|
||||
type: [String, Number, Boolean],
|
||||
default: false
|
||||
},
|
||||
activeColor: {
|
||||
type: String,
|
||||
default: '#108ee9'
|
||||
},
|
||||
inactiveColor: {
|
||||
type: String,
|
||||
default: '#fff'
|
||||
},
|
||||
size: {
|
||||
type: Number,
|
||||
default: 30
|
||||
},
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
activeValue: {
|
||||
type: [String, Number, Boolean],
|
||||
default: true
|
||||
},
|
||||
inactiveValue: {
|
||||
type: [String, Number, Boolean],
|
||||
default: false
|
||||
},
|
||||
beforeChange: {
|
||||
type: Function,
|
||||
default: null
|
||||
},
|
||||
extraData: null,
|
||||
contextLevel: {
|
||||
type: Number,
|
||||
default: 1
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
switchHeight() {
|
||||
// #ifdef APP-NVUE
|
||||
return this.size + 2 + 'px'
|
||||
// #endif
|
||||
// #ifndef APP-NVUE
|
||||
return this.size + 'px'
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
value: {
|
||||
immediate: true,
|
||||
handler(value) {
|
||||
this.currentValue = value
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
currentValue: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
toggle() {
|
||||
if (!this.disabled) {
|
||||
if (this.beforeChange && typeof this.beforeChange === 'function') {
|
||||
let context = this
|
||||
for (let i = 0; i < this.contextLevel; i++) {
|
||||
context = context.$options.parent
|
||||
}
|
||||
const result = this.beforeChange(this.currentValue === this.activeValue ? this.inactiveValue : this.activeValue,
|
||||
this.extraData, context)
|
||||
if (typeof result === 'object') {
|
||||
result.then(() => {
|
||||
this.toggleValue()
|
||||
}).catch(() => {})
|
||||
} else if (typeof result === 'boolean' && result) {
|
||||
this.toggleValue()
|
||||
}
|
||||
} else {
|
||||
this.toggleValue()
|
||||
}
|
||||
}
|
||||
},
|
||||
toggleValue() {
|
||||
this.currentValue = this.currentValue === this.activeValue ? this.inactiveValue : this.activeValue
|
||||
this.$emit('input', this.currentValue)
|
||||
this.$emit('change', this.currentValue)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.evan-switch {
|
||||
position: relative;
|
||||
border-width: 1px;
|
||||
border-color: rgba(0, 0, 0, 0.1);
|
||||
border-style: solid;
|
||||
transition: background-color 0.3s;
|
||||
/* #ifndef APP-NVUE */
|
||||
box-sizing: content-box;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.evan-switch--disabled {
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
.evan-switch__circle {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
background-color: #fff;
|
||||
border-radius: 50%;
|
||||
/* #ifndef APP-NVUE */
|
||||
box-shadow: 0 3px 1px 0 rgba(0, 0, 0, 0.05), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 3px 3px 0 rgba(0, 0, 0, 0.05);
|
||||
/* #endif */
|
||||
/* #ifdef APP-NVUE */
|
||||
box-shadow: 1px 0 0px 0 rgba(0, 0, 0, 0.05);
|
||||
/* #endif */
|
||||
transition: transform 0.3s;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,297 @@
|
|||
<template>
|
||||
<view class="foot-box"
|
||||
:style="{
|
||||
background: isGradualChange ? `linear-gradient( to ${direction}, ${colorOne} 0%, ${colorTwo} 20%, ${colorThree} 80%, ${colorFour} 100%)` : `url(${backgroundImage}) ${backgroundColor} `,
|
||||
boxShadow: `-10rpx 0rpx 20rpx rgba( 0, 0, 0, ${boxShadowNum})`
|
||||
}">
|
||||
<!-- 后台动态改变的icon与标题 start -->
|
||||
<view @tap="choosefoot(index)" class="item-box" v-for="(item,index) in footList" :key="index">
|
||||
<image :class="isIcon==index ? 'bulge' : ''" :style="{width:[40,40,40,40,37][index]+'rpx',height:[40,40,40,40,40][index]+'rpx'}" :src="current == index ? item.selectedIconPath : item.iconPath" mode="widthFix"></image>
|
||||
<view class="clips1" :class="current==index ? 'activeclass' : 'defaultclass'">{{item.title}}</view>
|
||||
</view>
|
||||
<!-- 后台动态改变的icon图 end -->
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
// 引入qrcode.js （必须导出qrcode.js ）
|
||||
var qrcode = require('@/jsFile/qrcode.js');
|
||||
export default {
|
||||
name:'foot-tab',
|
||||
props:{
|
||||
// 当前选中项
|
||||
current:{
|
||||
type:Number,
|
||||
default:0
|
||||
},
|
||||
// 默认哪个图标突出
|
||||
isIcon:{
|
||||
type:Number,
|
||||
default:2
|
||||
},
|
||||
// 底部导航背景图片
|
||||
backgroundImage:{
|
||||
type:String,
|
||||
default:'http://img.netbian.com/file/2021/1212/232713y3bCy.jpg'
|
||||
},
|
||||
// 背景颜色
|
||||
backgroundColor:{
|
||||
type:String,
|
||||
default:'#FFFFFF'
|
||||
},
|
||||
// 是否开启背景颜色渐变
|
||||
isGradualChange:{
|
||||
type:Boolean,
|
||||
default:true
|
||||
},
|
||||
// 渐变方向
|
||||
direction:{
|
||||
type:String,
|
||||
default:'right top'
|
||||
},
|
||||
// 第一种颜色
|
||||
colorOne:{
|
||||
type:String,
|
||||
default:'#FFFFFF'
|
||||
},
|
||||
// 第二种颜色
|
||||
colorTwo:{
|
||||
type:String,
|
||||
default:'#FFFFFF'
|
||||
},
|
||||
// 第三种颜色
|
||||
colorThree:{
|
||||
type:String,
|
||||
default:'#FFFFFF'
|
||||
},
|
||||
// 第四种颜色
|
||||
colorFour:{
|
||||
type:String,
|
||||
default:'#FFFFFF'
|
||||
},
|
||||
// 阴影大小0~1之间 0表示没有阴影
|
||||
boxShadowNum:{
|
||||
type:Number,
|
||||
default:0.1
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
ifCustomerService:false,//是否存在客服 默认不存在客服
|
||||
footList:[
|
||||
{
|
||||
iconPath: "/static/tabbar/icon-mo-home.png",
|
||||
selectedIconPath: "/static/tabbar/icon-select-home.png",
|
||||
title:'首页'
|
||||
},
|
||||
{
|
||||
iconPath: "/static/tabbar/icon-mo-fun.png",
|
||||
selectedIconPath: "/static/tabbar/icon-select-fun.png",
|
||||
title:'项目列表'
|
||||
},
|
||||
{
|
||||
iconPath: "/static/tabbar/icon-scan.png",
|
||||
selectedIconPath: "/static/tabbar/icon-scan.png",
|
||||
title:'扫码报修'
|
||||
},
|
||||
{
|
||||
iconPath: "/static/tabbar/icon-mo-news.png",
|
||||
selectedIconPath: "/static/tabbar/icon-select-news.png",
|
||||
title:'意见反馈'
|
||||
},
|
||||
{
|
||||
iconPath: "/static/tabbar/icon-mo-person.png",
|
||||
selectedIconPath: "/static/tabbar/icon-select-person.png",
|
||||
title:'我的'
|
||||
}
|
||||
]
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
// 打印qrcode 查看是否引入成功
|
||||
console.log(qrcode,111)
|
||||
},
|
||||
methods:{
|
||||
choosefoot(index){
|
||||
if(index==0){
|
||||
uni.reLaunch({url:'/pages/tabbar/pagehome/pagehome'})
|
||||
} else {
|
||||
// if(!this.$toolAll.tools.judgeAuth()) {
|
||||
// 已授权
|
||||
switch (index){
|
||||
case 1:
|
||||
uni.reLaunch({url:'/pages/tabbar/project-list/project-list'})
|
||||
break;
|
||||
case 2:
|
||||
// #ifdef APP-PLUS, MP-WEIXIN
|
||||
uni.scanCode({
|
||||
onlyFromCamera:false, // 是否只能从相机扫码，不允许从相册选择图片
|
||||
scanType: ['qrCode'], // barCode：一维码， qrCode：二维码， datamatrix：Data Matrix 码， pdf417：PDF417 条码
|
||||
autoDecodeCharset:true, // 是否启用自动识别字符编码功能，默认为否
|
||||
success: function (res) {
|
||||
console.log('条码类型：' + res.scanType);
|
||||
console.log('条码内容：' + res.result);
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
this.scanCode();
|
||||
// #endif
|
||||
break;
|
||||
case 3:
|
||||
uni.reLaunch({url:'/pages/tabbar/feedback/feedback'})
|
||||
break;
|
||||
case 4:
|
||||
uni.reLaunch({url:'/pages/tabbar/my/my'})
|
||||
break;
|
||||
}
|
||||
// } else {
|
||||
// // 未授权
|
||||
// uni.navigateTo({
|
||||
// url:'/pages/login/login'
|
||||
// })
|
||||
// }
|
||||
}
|
||||
},
|
||||
scanCode() {
|
||||
let that = this
|
||||
// 调用uni提供的调用相机api
|
||||
uni.chooseImage({
|
||||
sizeType: ['original'],
|
||||
count: 1,
|
||||
success: (res)=> {
|
||||
qrcode.decode(this.getObjectURL(res.tempFiles[0]))
|
||||
qrcode.callback = (codeRes) => {
|
||||
if (codeRes.indexOf('error') >= 0) {
|
||||
// 二维码识别失败
|
||||
console.log('不合法二维码：' + codeRes);
|
||||
} else {
|
||||
// 二维码识别成功
|
||||
let r = this.decodeStr(codeRes)
|
||||
// this.qrCodeRes = r
|
||||
console.log(r);
|
||||
}
|
||||
}
|
||||
// const tempFilePaths = res.tempFilePaths[0] // 获取到二维码图片的链接
|
||||
// qrcode.decode(tempFilePaths); // 解析二维码图片
|
||||
// qrcode.callback = function(res1) {
|
||||
// // 解析失败返回 error decoding QR Code
|
||||
// if (res1 == "error decoding QR Code") {
|
||||
// uni.showToast({
|
||||
// title: "识别二维码失败，请重新上传！",
|
||||
// duration: 2000,
|
||||
// icon: 'none'
|
||||
// })
|
||||
// } else {
|
||||
// // 解析成功返回二维码链接
|
||||
// console.log(res1)
|
||||
// }
|
||||
// }
|
||||
}
|
||||
});
|
||||
},
|
||||
// 获取文件地址函数
|
||||
getObjectURL(file) {
|
||||
var url = null
|
||||
if (window.createObjectURL !== undefined) { // basic
|
||||
url = window.createObjectURL(file)
|
||||
} else if (window.URL !== undefined) { // mozilla(firefox)
|
||||
url = window.URL.createObjectURL(file)
|
||||
} else if (window.webkitURL !== undefined) { // webkit or chrome
|
||||
url = window.webkitURL.createObjectURL(file)
|
||||
}
|
||||
return url
|
||||
},
|
||||
// 解码，输出：中文
|
||||
decodeStr(str) {
|
||||
var out, i, len, c;
|
||||
var char2, char3;
|
||||
out = "";
|
||||
len = str.length;
|
||||
i = 0;
|
||||
while (i < len) {
|
||||
c = str.charCodeAt(i++);
|
||||
switch (c >> 4) {
|
||||
case 0:
|
||||
case 1:
|
||||
case 2:
|
||||
case 3:
|
||||
case 4:
|
||||
case 5:
|
||||
case 6:
|
||||
case 7:
|
||||
// 0xxxxxxx
|
||||
out += str.charAt(i - 1);
|
||||
break;
|
||||
case 12:
|
||||
case 13:
|
||||
// 110x xxxx 10xx xxxx
|
||||
char2 = str.charCodeAt(i++);
|
||||
out += String.fromCharCode(((c & 0x1F) << 6) | (char2 & 0x3F));
|
||||
break;
|
||||
case 14:
|
||||
// 1110 xxxx 10xx xxxx 10xx xxxx
|
||||
char2 = str.charCodeAt(i++);
|
||||
char3 = str.charCodeAt(i++);
|
||||
out += String.fromCharCode(((c & 0x0F) << 12) |
|
||||
((char2 & 0x3F) << 6) |
|
||||
((char3 & 0x3F) << 0));
|
||||
break;
|
||||
}
|
||||
}
|
||||
return out;
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.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;}
|
||||
/* 外框样式 start */
|
||||
.foot-box{
|
||||
height: 110rpx;
|
||||
font-size: 24rpx;
|
||||
position: fixed;bottom: 0;left: 0;right: 0;z-index: 10;
|
||||
display: flex;justify-content: space-around;
|
||||
background-repeat: no-repeat;background-size: 100% 100%;
|
||||
}
|
||||
/* 外框样式 end */
|
||||
.item-box {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 16rpx 10rpx;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
height: 110rpx;
|
||||
}
|
||||
/* 图标样式 */
|
||||
.item-box image {
|
||||
width: 64rpx;
|
||||
height: 64rpx;
|
||||
}
|
||||
.item-box view{
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
/* 字体默认样式 */
|
||||
.defaultclass {
|
||||
color: #999999;
|
||||
}
|
||||
/* 字体选中样式 */
|
||||
.activeclass {
|
||||
color: #000000;
|
||||
}
|
||||
/* 凸出样式 */
|
||||
.bulge {
|
||||
position: absolute;
|
||||
top: -30rpx;
|
||||
width: 80rpx!important;
|
||||
height: 80rpx!important;
|
||||
border: 8rpx solid #FFFFFF;
|
||||
border-radius: 100%;
|
||||
vertical-align: middle;
|
||||
box-shadow: 0rpx -3rpx 6rpx rgba(0,0,0,.1);
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,85 @@
|
|||
<template>
|
||||
<view>
|
||||
<view @tap="chooseItem(index)" v-for="(item,index) in list" :key="index"
|
||||
class="item-box display-between-center">
|
||||
<view class="display-between-center">
|
||||
<view class="display-center-center left-box">
|
||||
<image v-if="item.leftImg!=''"
|
||||
:style="{width:[26,38,40,33][index]+'rpx',height:[36,38,40,31][index]+'rpx'}"
|
||||
:src="item.leftImg" mode="widthFix" lazy-load></image>
|
||||
</view>
|
||||
<view class="item-title">{{item.title}}</view>
|
||||
</view>
|
||||
<view class="display-between-center">
|
||||
<view class="item-content">{{item.content}}</view>
|
||||
<i class='icon icon-next' style="font-size: 28rpx;color: #8c8c9b;"></i>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:"function-list",
|
||||
props:{
|
||||
list:{
|
||||
type:Array,
|
||||
default:()=>{
|
||||
return [
|
||||
{
|
||||
leftImg:'/static/public/icon-address.png',
|
||||
title:'收货地址',
|
||||
num:0,
|
||||
content:'',
|
||||
rightImg:'',
|
||||
url:''
|
||||
},
|
||||
{
|
||||
leftImg:'/static/public/icon-distribution.png',
|
||||
title:'分销中心',
|
||||
num:0,
|
||||
content:'百万奖金等你来拿',
|
||||
rightImg:'',
|
||||
url:''
|
||||
},
|
||||
{
|
||||
leftImg:'/static/public/icon-duty.png',
|
||||
title:'免责声明',
|
||||
num:0,
|
||||
content:'',
|
||||
rightImg:'',
|
||||
url:''
|
||||
},
|
||||
{
|
||||
leftImg:'/static/public/icon-aboutus.png',
|
||||
title:'关于我们',
|
||||
num:0,
|
||||
content:'',
|
||||
rightImg:'',
|
||||
url:''
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
methods:{
|
||||
chooseItem(index){
|
||||
uni.navigateTo({
|
||||
url: this.list[index].url
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.display-between-center {display: flex;justify-content: space-between;align-items: center;}
|
||||
.display-center-center {display: flex;justify-content: center;align-items: center;}
|
||||
.item-box{padding: 30rpx 0;}
|
||||
.left-box{width: 40rpx;height: 40rpx;margin-right: 20rpx;}
|
||||
.item-title {font-size: 30rpx;color: #000000;}
|
||||
.item-content {font-size: 24rpx;color: #8c8c9b;margin-right: 10rpx;}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,75 @@
|
|||
<template>
|
||||
<view id="main-img">
|
||||
<!-- <view class="mar-x40" v-for="(item,index) in list" :key="index"> -->
|
||||
<!-- 活动商品 start -->
|
||||
<view v-for="(item,index) in activityList" :key="index" class="mar-x50">
|
||||
<h1 class="fon36 bold">{{item.name}}</h1>
|
||||
<view class="colpeili fon26 mar-s20 mar-x40 clips1">{{item.subtitle}}</view>
|
||||
<view class="posir" @tap="goDetail(item.id)">
|
||||
<image class="radius30 animated fadeIn" :src="item.cover" mode="aspectFill" lazy-load style="height: 425rpx;width: 100%;" :style="{height:activityHeight + 'px'}"></image>
|
||||
<view v-if="item.tag!=''" class="posia fon24 colf pad-zy10 pad-s10 pad-x20 activity-img">限时优惠</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 活动商品 end -->
|
||||
|
||||
<!-- 子商品 start -->
|
||||
<view class="disjbac fw">
|
||||
<view @tap="goDetail(item.id)" class="width47 mar-x50 posir" v-for="(item,index) in list" :key="index">
|
||||
<image :src="item.cover" mode="aspectFill" lazy-load style="width: 100%;height: 312rpx;border-radius: 30rpx;"></image>
|
||||
<view class="clips2 fon30 col0 linh50" style="height: 100rpx;">{{item.name}}</view>
|
||||
<view class="fon30 colpeili">￥{{item.price}}</view>
|
||||
<view v-if="item.tag!=''" class="posia fon24 colf pad-zy10 pad-s10 pad-x20 activity-img">限时优惠</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 子商品 end -->
|
||||
<!-- </view> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:"list-one",
|
||||
props:{
|
||||
list:{
|
||||
type:Array,
|
||||
default:()=>{
|
||||
return []
|
||||
}
|
||||
},
|
||||
activityList:{
|
||||
type:Array,
|
||||
default:()=>{
|
||||
return []
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
check:uni.getStorageSync('is_active'),
|
||||
activityHeight:''
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
uni.createSelectorQuery().in(this).select('#main-img').boundingClientRect().exec(rect => {
|
||||
this.activityHeight = rect[0].width;
|
||||
console.log(this.activityHeight,55);
|
||||
});
|
||||
},
|
||||
methods:{
|
||||
goDetail(id){//前往详情页
|
||||
if(this.check){
|
||||
uni.navigateTo({
|
||||
url:`/pagesB/shopDetail/shopDetail?id=${id}`
|
||||
})
|
||||
} else {
|
||||
uni.navigateTo({
|
||||
url:`/pages/login/login`
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
|
|
@ -0,0 +1,163 @@
|
|||
<template>
|
||||
<scroll-view scroll-y @scrolltolower="scrollBottomEv" :style="{height: scrollHeight +'px'}">
|
||||
<view class="disjbac fw">
|
||||
<view @tap="goDetail(item.id)" class="width48_5 mar-x50 posir" v-for="(item,index) in dataList" :key="index">
|
||||
<image class="animated fadeIn" :src="item.imgSrc" mode="aspectFill" style="width: 100%;height: 312rpx;border-radius: 30rpx;"></image>
|
||||
<view class="clips2 fon30 col0 linh50" style="height: 100rpx;">{{item.title}}</view>
|
||||
<view class="fon30 colpeili">￥{{item.price}}</view>
|
||||
<view v-if="item.isActivity" class="posia fon24 colf pad-zy10 pad-s10 pad-x20 activity-img">限时优惠</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 暂无更多数据 -->
|
||||
<pitera v-if="showpitera"></pitera>
|
||||
</scroll-view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// 暂无更多组件
|
||||
import pitera from '@/components/nothing/pitera.vue';
|
||||
export default {
|
||||
name:"list-two",
|
||||
components:{
|
||||
pitera
|
||||
},
|
||||
props:{
|
||||
// 高度类型
|
||||
scrollCate:{
|
||||
type:Number,
|
||||
default:1
|
||||
},
|
||||
// 页面来源
|
||||
pageSource: {
|
||||
type:Number,
|
||||
default:1
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
scrollHeight:uni.getStorageSync('scrollHeight'),
|
||||
// 数据
|
||||
dataList:[
|
||||
{
|
||||
id:1,
|
||||
imgSrc:'https://s6.jpg.cm/2022/02/14/L4oDhy.jpg',
|
||||
title:'于亿年宝藏中臻选1的宝',
|
||||
price:'2,000',
|
||||
isActivity:true,
|
||||
},
|
||||
{
|
||||
id:1,
|
||||
imgSrc:'https://s6.jpg.cm/2022/02/14/L4oDhy.jpg',
|
||||
title:'于亿年宝藏中臻选1的宝石级钻石每年开采数级钻石每年开采数',
|
||||
price:'2,000',
|
||||
isActivity:false,
|
||||
},
|
||||
{
|
||||
id:1,
|
||||
imgSrc:'https://s6.jpg.cm/2022/02/14/L4oDhy.jpg',
|
||||
title:'于亿年宝藏中臻选',
|
||||
price:'2,000',
|
||||
isActivity:false,
|
||||
},
|
||||
{
|
||||
id:1,
|
||||
imgSrc:'https://s6.jpg.cm/2022/02/14/L4oDhy.jpg',
|
||||
title:'于亿年宝藏中臻选',
|
||||
price:'2,000',
|
||||
isActivity:true,
|
||||
},
|
||||
{
|
||||
id:1,
|
||||
imgSrc:'https://s6.jpg.cm/2022/02/14/L4oDhy.jpg',
|
||||
title:'于亿年宝藏中臻选',
|
||||
price:'2,000',
|
||||
isActivity:false,
|
||||
},
|
||||
{
|
||||
id:1,
|
||||
imgSrc:'https://s6.jpg.cm/2022/02/14/L4oDhy.jpg',
|
||||
title:'于亿年宝藏中臻选1的宝石级钻石每年开采数',
|
||||
price:'2,000',
|
||||
isActivity:false,
|
||||
},
|
||||
{
|
||||
id:1,
|
||||
imgSrc:'https://s6.jpg.cm/2022/02/14/L4oDhy.jpg',
|
||||
title:'于亿年宝藏中臻选1的宝石级钻石每年开采数的宝石级钻石每年开采数',
|
||||
price:'2,000',
|
||||
isActivity:false,
|
||||
},
|
||||
{
|
||||
id:1,
|
||||
imgSrc:'https://s6.jpg.cm/2022/02/14/L4oDhy.jpg',
|
||||
title:'于亿年宝藏中臻选',
|
||||
price:'2,000',
|
||||
isActivity:false,
|
||||
},
|
||||
{
|
||||
id:1,
|
||||
imgSrc:'https://s6.jpg.cm/2022/02/14/L4oDhy.jpg',
|
||||
title:'于亿年宝藏中臻选1的宝石级钻石每年开采数的宝石级钻石每年开采数',
|
||||
price:'2,000',
|
||||
isActivity:false,
|
||||
}
|
||||
],
|
||||
page:1, // 第几页
|
||||
size:10, // 数量
|
||||
total:0, // 总数
|
||||
showpitera:true, // 是否显示暂无数据
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
switch (this.scrollCate){
|
||||
case 1:
|
||||
this.scrollHeight = uni.getStorageSync('scrollHeight-one'); // App.vue缓存的数据
|
||||
break;
|
||||
case 2:
|
||||
this.scrollHeight = uni.getStorageSync('scrollHeight-two'); // App.vue缓存的数据
|
||||
break;
|
||||
case 3:
|
||||
this.scrollHeight = uni.getStorageSync('scrollHeight-three'); // App.vue缓存的数据
|
||||
break;
|
||||
case 4:
|
||||
this.scrollHeight = uni.getStorageSync('scrollHeight-four'); // App.vue缓存的数据
|
||||
break;
|
||||
}
|
||||
switch (this.pageSource){
|
||||
case 1:
|
||||
this.checkList();
|
||||
break;
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
checkList(){
|
||||
console.log('列表事件')
|
||||
},
|
||||
// 视图容器触底事件
|
||||
scrollBottomEv(){
|
||||
console.log('触底了',55)
|
||||
// 判断总数是否等于数组长度，如果相等显示暂无更多，否则继续执行列表事件
|
||||
if(this.total!=this.dataList.length){
|
||||
// 页数每次+1
|
||||
this.page++
|
||||
switch (this.pageSource){
|
||||
case 1:
|
||||
// this.checkList();// 调用列表事件
|
||||
break;
|
||||
}
|
||||
} else {
|
||||
// 显示暂无数据
|
||||
this.pitera = true;
|
||||
}
|
||||
},
|
||||
goDetail(id){//前往详情页
|
||||
uni.navigateTo({
|
||||
url:`/pagesB/shopDetail/shopDetail?id=${id}`
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</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: 40
|
||||
},
|
||||
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 {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
// height: 100%;
|
||||
overflow: hidden;
|
||||
font-size: 28rpx;
|
||||
text-align: left;
|
||||
white-space: nowrap;
|
||||
align-items: center;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
<template>
|
||||
<view class="nothing">
|
||||
<view class="nothing-box">
|
||||
<image v-if="imgSrc!=''" class="nothing-img" :src="imgSrc" mode="aspectFill" lazy-load></image>
|
||||
<i class="iconImg icon"
|
||||
:class="['icon-nothing-more','icon-nothing-data','icon-nothing-collection'][currentType]"></i>
|
||||
<view v-if="currentType!=1" class="nothing-con">{{content}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:"nothing-page",
|
||||
props:{
|
||||
imgSrc:{ // 没有更多的图片
|
||||
type:String,
|
||||
default:''
|
||||
},
|
||||
content:{ // 没有更多的描述
|
||||
type:String,
|
||||
default:'暂无内容'
|
||||
},
|
||||
currentType:{ // 暂无更多 icon 图标
|
||||
type:Number,
|
||||
default: 0
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {};
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.nothing{position: fixed;top: 0;bottom: 0;left: 0;right: 0;display: flex;justify-content: center;align-items: center;}
|
||||
.nothing-box{display: flex;justify-content: center;flex-direction: column;align-items: center;}
|
||||
.nothing-box .nothing-img{width: 470rpx;height: 270rpx;}
|
||||
.iconImg {font-size: 280rpx;color: #999999;}
|
||||
.nothing-con{font-size: 24rpx;font-family: PingFang SC;font-weight: 500;color: #999999;}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,54 @@
|
|||
<template>
|
||||
<view :style="{
|
||||
color: textColor,
|
||||
fontSize: textFontSize,
|
||||
fontWeight: `${ ifBold ? 'bold' : 0 }`,
|
||||
textAlign: `${ ifCenter ? 'center' : 'left' }`,
|
||||
padding: paddingStr
|
||||
}">{{textStr}}</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:"pitera",
|
||||
props:{
|
||||
// 内容
|
||||
textStr: {
|
||||
type:String,
|
||||
default:'-- NO MORE --'
|
||||
},
|
||||
// 字体颜色
|
||||
textColor: {
|
||||
type:String,
|
||||
default:'#999999'
|
||||
},
|
||||
// 字体大小
|
||||
textFontSize: {
|
||||
type: String,
|
||||
default: '24rpx'
|
||||
},
|
||||
// 是否加粗
|
||||
ifBold: {
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
// 是否居中
|
||||
ifCenter: {
|
||||
type:Boolean,
|
||||
default: true
|
||||
},
|
||||
// 内边距的值
|
||||
paddingStr: {
|
||||
type:String,
|
||||
default:'20rpx'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {};
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,100 @@
|
|||
<template>
|
||||
<view>
|
||||
<view @tap="lianK"
|
||||
:style="{
|
||||
background: backgroundColor,
|
||||
right:nright+'rpx',
|
||||
bottom:nbottom+'rpx',
|
||||
boxShadow: `0rpx 0rpx 30rpx rgba(0,0,0,${shadowNum})`,
|
||||
borderRadius: radiusNum,
|
||||
width: widthHeight,
|
||||
height: widthHeight}"
|
||||
class="customer-box">
|
||||
<i class="icon" :style="{color:iconColor}" :class="['icon-customer','icon-customer-black'][iconNum]" style="font-size: 70rpx;"></i>
|
||||
<!-- <image class="posia" src="/static/public/btnKF.png" style="width: 50rpx;height: 50rpx;top: 20rpx;" mode=""></image> -->
|
||||
<view v-if="showText" class="fon20" style="margin-top: -20rpx;">在线客服</view>
|
||||
<button class="fon24 posia-op" open-type="contact"></button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:"public-customer",
|
||||
props:{
|
||||
// 客服框框大小
|
||||
widthHeight:{
|
||||
type:String,
|
||||
default:'110rpx'
|
||||
},
|
||||
// 客服框背景色
|
||||
backgroundColor:{
|
||||
type:String,
|
||||
default:'#000000'
|
||||
},
|
||||
// 阴影大小0~1
|
||||
shadowNum:{
|
||||
type:Number,
|
||||
default:0.55
|
||||
},
|
||||
// 圆角大小
|
||||
radiusNum:{
|
||||
type:String,
|
||||
default: '26rpx'
|
||||
},
|
||||
//距离右边多宽
|
||||
nright:{
|
||||
type:Number,
|
||||
default:20
|
||||
},
|
||||
nbottom:{//距离底部多高
|
||||
type:Number,
|
||||
default:260
|
||||
},
|
||||
// 是否显示在线客服文本
|
||||
showText:{
|
||||
type:Boolean,
|
||||
default:true
|
||||
},
|
||||
// 客服图标选中
|
||||
iconNum:{
|
||||
type:Number,
|
||||
default:0
|
||||
},
|
||||
// 客服图标颜色
|
||||
iconColor:{
|
||||
type:String,
|
||||
default:'#FFFFFF'
|
||||
},
|
||||
nid:{//内容id
|
||||
type:String,
|
||||
default:'0'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
publicColor:uni.getStorageSync('publicColor'),
|
||||
};
|
||||
},
|
||||
methods:{
|
||||
lianK(){
|
||||
this.$requst.post('user/rand-bind-service').then(res=>{})
|
||||
this.$requst.post('user/record',{type:'other',action:'ask',id:this.nid}).then(res=>{},error=>{})
|
||||
let maiOjb = {
|
||||
e:5,//内容咨询
|
||||
t:new Date().getTime()//当前时间戳
|
||||
}
|
||||
this.$toolAll.tools.maiDian(maiOjb)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.customer-box {
|
||||
position: fixed;z-index: 2;
|
||||
display: flex;justify-content: center;align-items: center;flex-wrap: wrap;
|
||||
box-sizing: border-box;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,143 @@
|
|||
<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: {
|
||||
curentClick:{//多个评分时当前点击第几个
|
||||
type:Number,
|
||||
default:0
|
||||
},
|
||||
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/rate/rate1_0.png', '/static/rate/rate1_1.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.curentClick]);
|
||||
this.$emit('change', [index,this.curentClick]);
|
||||
}
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
</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,188 @@
|
|||
<template>
|
||||
<view class="status-box statusHNH">
|
||||
<!-- 网络、电量栏 start -->
|
||||
<view :style="{height: statusBarHeight+'px',background: backgroudColor}"></view>
|
||||
<!-- 网络、电量栏 end -->
|
||||
|
||||
<!-- 头部状态栏 start -->
|
||||
<view class="status-nav"
|
||||
:style="{background: backgroudColor,height: navBarHeight+'px'}">
|
||||
<!-- 返回键 -->
|
||||
<view class="return-box" @tap="backEv" v-if="ifReturn"
|
||||
:style="{height: navBarHeight+'px'}">
|
||||
<slot name="leftContent">
|
||||
<i class="icon icon-return" style="font-size: 32rpx;"
|
||||
:style="{color: returnColor}"></i>
|
||||
</slot>
|
||||
</view>
|
||||
<!-- 标题 -->
|
||||
<view class="tab-title" v-if="ifTitle && ifNet"
|
||||
:style="{
|
||||
color: titleColor,
|
||||
justifyContent: ifCenter ? 'center' : '',
|
||||
padding: ifCenter ? '0px' : `${ifReturn ? '0 38' : '0 15'}px`}">
|
||||
<view class="title-box" :class="['','clips1','clips2'][clipNumber]" :style="{maxWidth: ifCenter ? '360rpx' : '70%'}">{{navBarTitle}}</view>
|
||||
</view>
|
||||
<view class="tab-title" v-if="!ifNet"
|
||||
:style="{
|
||||
color: titleColor,
|
||||
justifyContent: ifCenter ? 'center' : '',
|
||||
padding: ifCenter ? '0px' : `${ifReturn ? '0 38' : '0 15'}px`}">
|
||||
<view class="title-box" :class="['','clips1','clips2'][clipNumber]" :style="{maxWidth: ifCenter ? '360rpx' : '70%'}">{{netText}}<text @tap="refreshEv" style="color: #3875F6;margin-left: 20rpx;">刷新</text></view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 头部状态栏 end -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:'status-nav',
|
||||
props:{
|
||||
//状态栏、导航栏背景颜色
|
||||
backgroudColor:{
|
||||
type:String,
|
||||
default:'#FFFFFF'
|
||||
},
|
||||
// 默认导航栏高度
|
||||
navBarHeight: {
|
||||
type:Number,
|
||||
default:40
|
||||
},
|
||||
//是否显示返回键
|
||||
ifReturn:{
|
||||
type:Boolean,
|
||||
default:true
|
||||
},
|
||||
// 返回键颜色
|
||||
returnColor: {
|
||||
type:String,
|
||||
default:'#000'
|
||||
},
|
||||
//是否显示标题
|
||||
ifTitle:{
|
||||
type:Boolean,
|
||||
default:true
|
||||
},
|
||||
// 导航栏标题
|
||||
navBarTitle: {
|
||||
type:String,
|
||||
default:''
|
||||
},
|
||||
// 标题最多几行显示
|
||||
clipNumber: {
|
||||
type:Number,
|
||||
default:1
|
||||
},
|
||||
//标题颜色
|
||||
titleColor:{
|
||||
type:String,
|
||||
default:'#333333'
|
||||
},
|
||||
// 标题是否居中
|
||||
ifCenter: {
|
||||
type:Boolean,
|
||||
default: true
|
||||
},
|
||||
// 来自哪里
|
||||
fromWhere: {
|
||||
type:Number,
|
||||
default:0
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
statusBarHeight: uni.getSystemInfoSync().statusBarHeight,
|
||||
ifNet:true ,// 是否有网络
|
||||
netText:'当前无网络',
|
||||
netTimer:null
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// 网络监测
|
||||
this.$toolAll.tools.networkStatus();
|
||||
// 缓存状态栏+标题栏的高度
|
||||
// const query = wx.createSelectorQuery().in(this)
|
||||
// query.select('.statusHNH').boundingClientRect((rect) => {
|
||||
// uni.setStorageSync('statusHNH',rect.height)
|
||||
// }).exec();
|
||||
|
||||
// 获取当前页面路径
|
||||
this.$toolAll.tools.obtainUrl();
|
||||
this.$toolAll.tools.obtainUrlParam();
|
||||
setTimeout(()=>{
|
||||
this.ifNet = uni.getStorageSync('isNet');
|
||||
},500)
|
||||
},
|
||||
methods:{
|
||||
// 刷新网络事件
|
||||
refreshEv(){
|
||||
this.netText = '正在刷新...';
|
||||
let outTime = 0;//十秒超时
|
||||
this.netTimer = setInterval(()=>{
|
||||
outTime++;
|
||||
this.$toolAll.tools.networkStatus();
|
||||
if(uni.getStorageSync('isNet')) {
|
||||
clearInterval(this.netTimer);
|
||||
this.ifNet = true;
|
||||
}
|
||||
if(outTime==10) {
|
||||
clearInterval(this.netTimer);
|
||||
this.netText = '刷新失败';
|
||||
outTime = 0;
|
||||
}
|
||||
},1000)
|
||||
},
|
||||
//返回事件
|
||||
backEv(){
|
||||
if(uni.getStorageSync('outside')*1==2){
|
||||
this.fromWhere = uni.getStorageSync('outside')*1;
|
||||
}
|
||||
switch (this.fromWhere){
|
||||
case 1:
|
||||
case 2:
|
||||
uni.navigateTo({
|
||||
url:'/pages/tabbar/pagehome/pagehome'
|
||||
})
|
||||
uni.setStorageSync('outside',0)
|
||||
break;
|
||||
case 0:
|
||||
uni.navigateBack({
|
||||
delta:1
|
||||
})
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.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;}
|
||||
|
||||
.status-box{
|
||||
position: fixed;top: 0;left: 0;right: 0;z-index: 10;
|
||||
}
|
||||
.status-nav{
|
||||
width: 100%;
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.return-box {
|
||||
display: flex;justify-content: center;align-items: center;flex-shrink: 0;
|
||||
position: absolute;
|
||||
padding: 0rpx 10rpx;
|
||||
}
|
||||
.return-box i {font-size: 56rpx;}
|
||||
.tab-title{
|
||||
width: 100%;
|
||||
font-size: 32rpx;
|
||||
display: flex;
|
||||
font-weight: bold;
|
||||
}
|
||||
.tab-title .title-box{margin-top: -4rpx;}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,191 @@
|
|||
<template>
|
||||
<view class="status-box statusHNH">
|
||||
<!-- 网络、电量栏 start -->
|
||||
<view :style="{height: statusBarHeight+'px',background: backgroudColor}"></view>
|
||||
<!-- 网络、电量栏 end -->
|
||||
|
||||
<!-- 头部状态栏 start -->
|
||||
<view class="status-nav"
|
||||
:style="{background: backgroudColor,height: navBarHeight+'px'}">
|
||||
<!-- 返回键 -->
|
||||
<slot name="leftContent">
|
||||
<view class="return-box" @tap="backEv" v-if="ifReturn"
|
||||
:style="{height: navBarHeight+'px'}">
|
||||
</view>
|
||||
</slot>
|
||||
<!-- 标题 -->
|
||||
<view class="tab-title" v-if="ifTitle && ifNet"
|
||||
:style="{
|
||||
color: titleColor,
|
||||
justifyContent: ifCenter ? 'center' : '',
|
||||
padding: ifCenter ? '0px' : `${ifReturn ? '0 38' : '0 15'}px`}">
|
||||
<view class="title-box" :class="['','clips1','clips2'][clipNumber]" :style="{maxWidth: ifCenter ? '360rpx' : '70%'}">
|
||||
<slot name="centerContent">{{navBarTitle}}</slot>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 右边功能 -->
|
||||
<view class="right-box">
|
||||
<slot name="rightContent"></slot>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 头部状态栏 end -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:'status-nav',
|
||||
props:{
|
||||
//状态栏、导航栏背景颜色
|
||||
backgroudColor:{
|
||||
type:String,
|
||||
default:'#FFFFFF'
|
||||
},
|
||||
// 默认导航栏高度
|
||||
navBarHeight: {
|
||||
type:Number,
|
||||
default:50
|
||||
},
|
||||
//是否显示返回键
|
||||
ifReturn:{
|
||||
type:Boolean,
|
||||
default:true
|
||||
},
|
||||
// 返回键颜色
|
||||
returnColor: {
|
||||
type:String,
|
||||
default:'#000'
|
||||
},
|
||||
//是否显示标题
|
||||
ifTitle:{
|
||||
type:Boolean,
|
||||
default:true
|
||||
},
|
||||
// 导航栏标题
|
||||
navBarTitle: {
|
||||
type:String,
|
||||
default:''
|
||||
},
|
||||
// 标题最多几行显示
|
||||
clipNumber: {
|
||||
type:Number,
|
||||
default:1
|
||||
},
|
||||
//标题颜色
|
||||
titleColor:{
|
||||
type:String,
|
||||
default:'#333333'
|
||||
},
|
||||
// 标题是否居中
|
||||
ifCenter: {
|
||||
type:Boolean,
|
||||
default: true
|
||||
},
|
||||
// 来自哪里
|
||||
fromWhere: {
|
||||
type:Number,
|
||||
default:0
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
statusBarHeight: uni.getSystemInfoSync().statusBarHeight,
|
||||
ifNet:true ,// 是否有网络
|
||||
netText:'当前无网络',
|
||||
netTimer:null
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// 网络监测
|
||||
this.$toolAll.tools.networkStatus();
|
||||
// 缓存状态栏+标题栏的高度
|
||||
// const query = wx.createSelectorQuery().in(this)
|
||||
// query.select('.statusHNH').boundingClientRect((rect) => {
|
||||
// uni.setStorageSync('statusHNH',rect.height)
|
||||
// }).exec();
|
||||
|
||||
// 获取当前页面路径
|
||||
this.$toolAll.tools.obtainUrl();
|
||||
this.$toolAll.tools.obtainUrlParam();
|
||||
setTimeout(()=>{
|
||||
this.ifNet = uni.getStorageSync('isNet');
|
||||
},500)
|
||||
},
|
||||
methods:{
|
||||
// 刷新网络事件
|
||||
refreshEv(){
|
||||
this.netText = '正在刷新...';
|
||||
let outTime = 0;//十秒超时
|
||||
this.netTimer = setInterval(()=>{
|
||||
outTime++;
|
||||
this.$toolAll.tools.networkStatus();
|
||||
if(uni.getStorageSync('isNet')) {
|
||||
clearInterval(this.netTimer);
|
||||
this.ifNet = true;
|
||||
}
|
||||
if(outTime==10) {
|
||||
clearInterval(this.netTimer);
|
||||
this.netText = '刷新失败';
|
||||
outTime = 0;
|
||||
}
|
||||
},1000)
|
||||
},
|
||||
//返回事件
|
||||
backEv(){
|
||||
if(uni.getStorageSync('outside')*1==2){
|
||||
this.fromWhere = uni.getStorageSync('outside')*1;
|
||||
}
|
||||
switch (this.fromWhere){
|
||||
case 1:
|
||||
case 2:
|
||||
uni.navigateTo({
|
||||
url:'/pages/tabbar/pagehome/pagehome'
|
||||
})
|
||||
uni.setStorageSync('outside',0)
|
||||
break;
|
||||
case 0:
|
||||
uni.navigateBack({
|
||||
delta:1
|
||||
})
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.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;}
|
||||
|
||||
.status-box{
|
||||
position: fixed;top: 0;left: 0;right: 0;z-index: 10;
|
||||
}
|
||||
.status-nav{
|
||||
width: 100%;
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
padding: 0 30rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.return-box {
|
||||
display: flex;justify-content: center;align-items: center;flex-shrink: 0;
|
||||
position: absolute;
|
||||
padding: 0rpx 10rpx;
|
||||
}
|
||||
.return-box i {font-size: 56rpx;}
|
||||
.tab-title{
|
||||
width: 100%;
|
||||
font-size: 38rpx;
|
||||
display: flex;
|
||||
}
|
||||
.tab-title .title-box{margin-top: -4rpx;}
|
||||
|
||||
.right-box {flex-shrink: 0;font-size: 30rpx;}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,181 @@
|
|||
<template>
|
||||
<view class="status-box statusHNH" :style="{marginBottom: marginBottom + 'rpx'}">
|
||||
<!-- 网络、电量栏 start -->
|
||||
<view :style="{height: height+'px',background: backgroudColor}"></view>
|
||||
<!-- 网络、电量栏 end -->
|
||||
|
||||
<!-- 头部状态栏 start -->
|
||||
<view class="status-nav" :style="{background: backgroudColor,height:navBarHeight}">
|
||||
<!-- 返回键 start -->
|
||||
<view class="disjcac left-box" @tap="backEv" v-if="ifReturn" :style="{height: navBarHeight}" >
|
||||
<slot name="leftcontent">
|
||||
<i class="icon icon-return" style="font-size: 32rpx;" :style="{color: returnColor}"></i>
|
||||
</slot>
|
||||
</view>
|
||||
<!-- 返回键 end -->
|
||||
|
||||
<!-- 标题 start -->
|
||||
<view class=" tab-title "
|
||||
:style="{
|
||||
color: titleColor,
|
||||
justifyContent: ifCenter ? 'center' : '',
|
||||
padding: ifCenter ? '0px' : `${ifReturn ? '0 38' : '0 15'}px`}">
|
||||
<view class="title-box" :class="['','clips1','clips2'][clipNumber]" :style="{maxWidth: ifCenter ? '360rpx' : '70%'}">
|
||||
<!-- 有网络 -->
|
||||
<view v-if="ifTitle && ifNet" >{{navBarTitle}}</view>
|
||||
<!-- 无网络 -->
|
||||
<view v-if="!ifNet">{{netText}}<text @tap="refreshEv" style="color: #3875F6;margin-left: 20rpx;">刷新</text></view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 标题 end -->
|
||||
|
||||
<!-- 右侧图标 start -->
|
||||
<view class="right-box disjcac" :style="{height: navBarHeight}">
|
||||
<slot name="rightcontent"></slot>
|
||||
</view>
|
||||
<!-- 右侧图标 end -->
|
||||
</view>
|
||||
<!-- 头部状态栏 end -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:'status-nav',
|
||||
props:{
|
||||
//状态栏、导航栏背景颜色
|
||||
backgroudColor:{
|
||||
type:String,
|
||||
default:'#FFFFFF'
|
||||
},
|
||||
// 默认导航栏高度
|
||||
navBarHeight: {
|
||||
type:String,
|
||||
default:'50px'
|
||||
},
|
||||
//是否显示返回键
|
||||
ifReturn:{
|
||||
type:Boolean,
|
||||
default:true
|
||||
},
|
||||
// 返回键颜色
|
||||
returnColor: {
|
||||
type:String,
|
||||
default:'#000'
|
||||
},
|
||||
//是否显示标题
|
||||
ifTitle:{
|
||||
type:Boolean,
|
||||
default:true
|
||||
},
|
||||
// 导航栏标题
|
||||
navBarTitle: {
|
||||
type:String,
|
||||
default:''
|
||||
},
|
||||
// 标题最多几行显示
|
||||
clipNumber: {
|
||||
type:Number,
|
||||
default:1
|
||||
},
|
||||
//标题颜色
|
||||
titleColor:{
|
||||
type:String,
|
||||
default:'#333333'
|
||||
},
|
||||
// 标题是否居中
|
||||
ifCenter: {
|
||||
type:Boolean,
|
||||
default: true
|
||||
},
|
||||
// 来自哪里
|
||||
fromWhere: {
|
||||
type:Number,
|
||||
default:0
|
||||
},
|
||||
// 底部距离内容多高
|
||||
marginBottom: {
|
||||
type:String,
|
||||
default:'20'
|
||||
},
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
height: uni.getSystemInfoSync().statusBarHeight,
|
||||
ifNet:true ,// 是否有网络
|
||||
netText:'当前无网络',
|
||||
netTimer:null
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// 网络监测
|
||||
this.$toolAll.tools.networkStatus();
|
||||
// 缓存状态栏+标题栏的高度
|
||||
// const query = wx.createSelectorQuery().in(this)
|
||||
// query.select('.statusHNH').boundingClientRect((rect) => {
|
||||
// uni.setStorageSync('statusHNH',rect.height)
|
||||
// }).exec();
|
||||
|
||||
// 获取当前页面路径
|
||||
this.$toolAll.tools.obtainUrl();
|
||||
this.$toolAll.tools.obtainUrlParam();
|
||||
setTimeout(()=>{
|
||||
this.ifNet = uni.getStorageSync('isNet');
|
||||
},500)
|
||||
},
|
||||
methods:{
|
||||
// 刷新网络事件
|
||||
refreshEv(){
|
||||
this.netText = '正在刷新...';
|
||||
let outTime = 0;//十秒超时
|
||||
this.netTimer = setInterval(()=>{
|
||||
outTime++;
|
||||
this.$toolAll.tools.networkStatus();
|
||||
if(uni.getStorageSync('isNet')) {
|
||||
clearInterval(this.netTimer);
|
||||
this.ifNet = true;
|
||||
}
|
||||
if(outTime==10) {
|
||||
clearInterval(this.netTimer);
|
||||
this.netText = '刷新失败';
|
||||
outTime = 0;
|
||||
}
|
||||
},1000)
|
||||
},
|
||||
//返回事件
|
||||
backEv(){
|
||||
if(uni.getStorageSync('outside')*1==2){
|
||||
this.fromWhere = uni.getStorageSync('outside')*1;
|
||||
}
|
||||
switch (this.fromWhere){
|
||||
case 1:
|
||||
case 2:
|
||||
uni.navigateTo({
|
||||
url:'/pages/tabbar/pagehome/pagehome'
|
||||
})
|
||||
uni.setStorageSync('outside',0)
|
||||
break;
|
||||
case 0:
|
||||
uni.navigateBack({
|
||||
delta:1
|
||||
})
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.disjcac{display: flex;justify-content: center;align-items: 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;}
|
||||
.status-box{position: sticky;top: 0;left: 0;right: 0;z-index: 10;}
|
||||
.status-nav{width: 100%;height: 50px; position: relative;display: flex;align-items: center;}
|
||||
.left-box {position: absolute;padding: 0 20rpx;}
|
||||
.right-box {position: absolute;right: 0; padding: 0 20rpx;}
|
||||
.tab-title {width: 100%;font-size: 32rpx;display: flex;font-weight: bold;}
|
||||
.tab-title .title-box {margin-top: -4rpx;}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,172 @@
|
|||
<template>
|
||||
<view class="tabBlock" v-if="list.length > 0">
|
||||
<scroll-view scroll-x="true" scroll-with-animation :scroll-left="tabsScrollLeft" @scroll="scroll">
|
||||
<view class="tab" id="tab_list">
|
||||
<!-- 循环体 -->
|
||||
<view v-for="(item, index) in list" :key="index"
|
||||
:class="['tab__item', {'tab__item--active': currentIndex === index}]"
|
||||
:style="{color: (currentIndex === index ? `${itemColor}`: '')}" id="tab_item"
|
||||
@click="select(item, index)">
|
||||
<!-- 标题 -->
|
||||
<!-- <view><slot name="title" :title="item.title"></slot></view> -->
|
||||
<!-- 标题 -->
|
||||
<view v-if="!showTitleSlot">{{item.title}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 下划线 -->
|
||||
<view class="tab__line"
|
||||
:style="{background: lineColor, width: lineStyle.width, transform: lineStyle.transform,transitionDuration: lineStyle.transitionDuration}">
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
value: [Number, String],
|
||||
list: { // 传值
|
||||
type: Array,
|
||||
default: () => {
|
||||
return [
|
||||
{title:'标题一'},
|
||||
{title:'标题二'},
|
||||
{title:'标题三'},
|
||||
{title:'标题四'},
|
||||
{title:'标题五'},
|
||||
{title:'标题六'},
|
||||
{title:'标题七'},
|
||||
{title:'标题八'},
|
||||
{title:'标题九'},
|
||||
]
|
||||
}
|
||||
},
|
||||
itemColor: String, // tab内容颜色
|
||||
lineColor: String, // 下划线颜色
|
||||
lineAnimated: { // 是否展示下划线动画
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
currentIndex: 0,
|
||||
lineStyle: {},
|
||||
scrollLeft: 0,
|
||||
tabsScrollLeft: 0,
|
||||
duration: 0.3
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
showTitleSlot() {
|
||||
return this.$scopedSlots.title
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
list() {
|
||||
this.setTabList()
|
||||
},
|
||||
value() {
|
||||
this.currentIndex = this.value
|
||||
this.setTabList()
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.currentIndex = this.value
|
||||
this.setTabList()
|
||||
if (!this.lineAnimated) {
|
||||
this.duration = 0
|
||||
}
|
||||
console.log(this.$scopedSlots)
|
||||
},
|
||||
methods: {
|
||||
select(item, index) {
|
||||
this.$emit('input', index)
|
||||
},
|
||||
setTabList() {
|
||||
this.$nextTick(() => {
|
||||
if (this.list.length > 0) {
|
||||
this.setLine()
|
||||
this.scrollIntoView()
|
||||
}
|
||||
})
|
||||
},
|
||||
setLine() {
|
||||
let lineWidth = 0,
|
||||
lineLeft = 0
|
||||
this.getElementData(`#tab_item`, (data) => {
|
||||
let el = data[this.currentIndex]
|
||||
this.$emit('tabheight',el.height)
|
||||
lineWidth = el.width / 2
|
||||
// lineLeft = el.width * (this.currentIndex + 0.5) // 此种只能针对每个item长度一致的
|
||||
lineLeft = el.width / 2 + (-data[0].left) + el.left
|
||||
this.lineStyle = {
|
||||
width: `${lineWidth}px`,
|
||||
transform: `translateX(${lineLeft}px) translateX(-50%)`,
|
||||
transitionDuration: `${this.duration}s`
|
||||
};
|
||||
})
|
||||
},
|
||||
scrollIntoView() { // item滚动
|
||||
let lineLeft = 0;
|
||||
this.getElementData('#tab_list', (data) => {
|
||||
let list = data[0]
|
||||
this.getElementData(`#tab_item`, (data) => {
|
||||
let el = data[this.currentIndex]
|
||||
// lineLeft = el.width * (this.currentIndex + 0.5) - list.width / 2 - this.scrollLeft
|
||||
lineLeft = el.width / 2 + (-list.left) + el.left - list.width / 2 - this.scrollLeft
|
||||
this.tabsScrollLeft = this.scrollLeft + lineLeft
|
||||
})
|
||||
})
|
||||
},
|
||||
getElementData(el, callback) {
|
||||
uni.createSelectorQuery().in(this).selectAll(el).boundingClientRect().exec((data) => {
|
||||
callback(data[0]);
|
||||
});
|
||||
},
|
||||
scroll(e) {
|
||||
this.scrollLeft = e.detail.scrollLeft;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.tabBlock {
|
||||
position: relative;
|
||||
background: #fff;
|
||||
.tab {
|
||||
position: relative;
|
||||
display: flex;
|
||||
font-size: 28rpx;
|
||||
padding-bottom: 15rpx;
|
||||
white-space: nowrap;
|
||||
&__item {
|
||||
// flex: 1;
|
||||
width: 20%;
|
||||
flex-shrink: 0;
|
||||
text-align: center;
|
||||
line-height: 90rpx;
|
||||
color: #868695;
|
||||
&--active {
|
||||
color: $uni-color-primary;
|
||||
font-weight: bold;
|
||||
}
|
||||
&-title {
|
||||
margin: 0 40rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.tab__line {
|
||||
display: block;
|
||||
height: 6rpx;
|
||||
position: absolute;
|
||||
bottom: 20rpx;
|
||||
left: 0;
|
||||
z-index: 1;
|
||||
border-radius: 6rpx;
|
||||
position: relative;
|
||||
background: $uni-color-primary;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,132 @@
|
|||
<template>
|
||||
<view class="banner-box">
|
||||
<swiper :current="bcurrent" @change="changeBanner" :style="{height: newHeight+'px'}" :autoplay="isplay" :circular="true" :interval="3000" :duration="500">
|
||||
<swiper-item v-for="(item,index) in bannerList" :key="index">
|
||||
<view @tap="chooseImg(index,item.url)" class="img-box">
|
||||
<image :style="{borderRadius:newRadius+'px',height:newHeight+'px'}" class="img animated fadeIn" :src="item.imgSrc" mode="aspectFill"></image>
|
||||
<image @tap.stop="playVideo(index)" v-if="item.isVideo && isVedio" class="posia animated bounceIn" style="width: 126rpx;height: 126rpx;z-index: 1;" src="/static/public/video.png" mode=""></image>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
<!-- 指示点 -->
|
||||
<view v-if="isDot" class="dot-box" :style="{bottom:newBottom+'px'}">
|
||||
<view :class="bcurrent==indexd ? 'dotActive' : 'dotMo'"
|
||||
v-for="(itemd,indexd) in bannerList.length" :key="indexd"
|
||||
@tap="chooseDot(indexd)"></view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:"swiper-pu",
|
||||
props:{
|
||||
isplay:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
},
|
||||
isDot:{//是否显示指示点
|
||||
type:Boolean,
|
||||
default:true
|
||||
},
|
||||
bannerList:{//默认轮播图片
|
||||
type:Array,
|
||||
default:function(){
|
||||
return [
|
||||
{imgSrc:'https://s6.jpg.cm/2022/02/14/L4oDhy.jpg',url:'',isVideo:false,poster:''},
|
||||
{imgSrc:'https://s6.jpg.cm/2022/02/14/L4oDhy.jpg',url:'',isVideo:false,poster:''},
|
||||
{imgSrc:'https://s6.jpg.cm/2022/02/14/L4oDhy.jpg',url:'',isVideo:false,poster:''},
|
||||
]
|
||||
}
|
||||
},
|
||||
newHeight:{//swiper的高
|
||||
type:String,
|
||||
default:'200'
|
||||
},
|
||||
newBottom:{//指示点距离底部位置
|
||||
type:String,
|
||||
default:'18'
|
||||
},
|
||||
newRadius:{//图片圆角
|
||||
type:String,
|
||||
default:'0'
|
||||
},
|
||||
browseP:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
bcurrent: 0, // 默认当前选中项
|
||||
isShowVideo:false, // 是否显示视频
|
||||
autoplay:false, // 是否开启自动轮播
|
||||
isVedio:uni.getStorageSync('is_vedio') // 是否是视频
|
||||
};
|
||||
},
|
||||
methods:{
|
||||
// 图片点击事件
|
||||
chooseImg(index,url){
|
||||
// console.log('当前banner图',index);
|
||||
this.bcurrent = index
|
||||
if(this.browseP){
|
||||
let imgList = []
|
||||
this.bannerList.forEach(item=>{
|
||||
let nurl = ''
|
||||
let obj = {}
|
||||
if(this.isVedio) {
|
||||
item.url=='' ? nurl = item.imgSrc : nurl = item.url
|
||||
obj = {
|
||||
url:nurl,
|
||||
type:item.isVideo?'video':'image',
|
||||
poster:item.poster
|
||||
}
|
||||
} else {
|
||||
nurl = item.imgSrc
|
||||
obj = {
|
||||
url:nurl,
|
||||
type:'image',
|
||||
poster:item.poster
|
||||
}
|
||||
}
|
||||
imgList.push(obj)
|
||||
})
|
||||
// 预览图片和视频
|
||||
uni.previewMedia({
|
||||
current:this.bcurrent,
|
||||
sources:imgList
|
||||
})
|
||||
} else {
|
||||
// 有链接，跳转链接
|
||||
uni.navigateTo({
|
||||
url:`/${url}`
|
||||
})
|
||||
}
|
||||
},
|
||||
// 切换后获取当前索引
|
||||
changeBanner(e){
|
||||
this.bcurrent = e.detail.current//当前的指示点下标
|
||||
// console.log(this.bcurrent);
|
||||
},
|
||||
// 点击当前指示点
|
||||
chooseDot(index){
|
||||
this.bcurrent = index;
|
||||
},
|
||||
playVideo(index){
|
||||
// console.log('播放视频');
|
||||
uni.navigateTo({
|
||||
url:`/pagesB/video/playVideo?src=${this.bannerList[index].url}&posterSrc=${this.bannerList[index].poster}`
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.banner-box{position: relative;}
|
||||
.img-box{position: relative;display: flex;justify-content: center;align-items: center;}
|
||||
.img{width:100%;vertical-align: bottom;}
|
||||
.dot-box{position: absolute;bottom: 36rpx;display: flex;justify-content: center;width: 100%;}
|
||||
.dotActive{width: 20rpx;height: 20rpx;margin-right: 10rpx;border-radius: 20rpx; background-color: rgba(255, 255, 255, 1);}
|
||||
.dotMo{width: 20rpx;height: 20rpx;margin-right: 10rpx;border-radius: 100%;background-color: rgba(191, 191, 191, 0.8);}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,201 @@
|
|||
function getLocalFilePath(path) {
|
||||
if (path.indexOf('_www') === 0 || path.indexOf('_doc') === 0 || path.indexOf('_documents') === 0 || path.indexOf(
|
||||
'_downloads') === 0) {
|
||||
return path
|
||||
}
|
||||
if (path.indexOf('file://') === 0) {
|
||||
return path
|
||||
}
|
||||
if (path.indexOf('/storage/emulated/0/') === 0) {
|
||||
return path
|
||||
}
|
||||
if (path.indexOf('/') === 0) {
|
||||
var localFilePath = plus.io.convertAbsoluteFileSystem(path)
|
||||
if (localFilePath !== path) {
|
||||
return localFilePath
|
||||
} else {
|
||||
path = path.substr(1)
|
||||
}
|
||||
}
|
||||
return '_www/' + path
|
||||
}
|
||||
|
||||
function dataUrlToBase64(str) {
|
||||
var array = str.split(',')
|
||||
return array[array.length - 1]
|
||||
}
|
||||
|
||||
var index = 0
|
||||
|
||||
function getNewFileId() {
|
||||
return Date.now() + String(index++)
|
||||
}
|
||||
|
||||
function biggerThan(v1, v2) {
|
||||
var v1Array = v1.split('.')
|
||||
var v2Array = v2.split('.')
|
||||
var update = false
|
||||
for (var index = 0; index < v2Array.length; index++) {
|
||||
var diff = v1Array[index] - v2Array[index]
|
||||
if (diff !== 0) {
|
||||
update = diff > 0
|
||||
break
|
||||
}
|
||||
}
|
||||
return update
|
||||
}
|
||||
// 图片路径转base64
|
||||
export function pathToBase64(path) {
|
||||
return new Promise(function(resolve, reject) {
|
||||
if (typeof window === 'object' && 'document' in window) {
|
||||
if (typeof FileReader === 'function') {
|
||||
var xhr = new XMLHttpRequest()
|
||||
xhr.open('GET', path, true)
|
||||
xhr.responseType = 'blob'
|
||||
xhr.onload = function() {
|
||||
if (this.status === 200) {
|
||||
let fileReader = new FileReader()
|
||||
fileReader.onload = function(e) {
|
||||
resolve(e.target.result)
|
||||
}
|
||||
fileReader.onerror = reject
|
||||
fileReader.readAsDataURL(this.response)
|
||||
}
|
||||
}
|
||||
xhr.onerror = reject
|
||||
xhr.send()
|
||||
return
|
||||
}
|
||||
var canvas = document.createElement('canvas')
|
||||
var c2x = canvas.getContext('2d')
|
||||
var img = new Image
|
||||
img.onload = function() {
|
||||
canvas.width = img.width
|
||||
canvas.height = img.height
|
||||
c2x.drawImage(img, 0, 0)
|
||||
resolve(canvas.toDataURL())
|
||||
canvas.height = canvas.width = 0
|
||||
}
|
||||
img.onerror = reject
|
||||
img.src = path
|
||||
return
|
||||
}
|
||||
if (typeof plus === 'object') {
|
||||
plus.io.resolveLocalFileSystemURL(getLocalFilePath(path), function(entry) {
|
||||
entry.file(function(file) {
|
||||
var fileReader = new plus.io.FileReader()
|
||||
fileReader.onload = function(data) {
|
||||
resolve(data.target.result)
|
||||
}
|
||||
fileReader.onerror = function(error) {
|
||||
reject(error)
|
||||
}
|
||||
fileReader.readAsDataURL(file)
|
||||
}, function(error) {
|
||||
reject(error)
|
||||
})
|
||||
}, function(error) {
|
||||
reject(error)
|
||||
})
|
||||
return
|
||||
}
|
||||
if (typeof wx === 'object' && wx.canIUse('getFileSystemManager')) {
|
||||
wx.getFileSystemManager().readFile({
|
||||
filePath: path,
|
||||
encoding: 'base64',
|
||||
success: function(res) {
|
||||
resolve('data:image/png;base64,' + res.data)
|
||||
},
|
||||
fail: function(error) {
|
||||
reject(error)
|
||||
}
|
||||
})
|
||||
return
|
||||
}
|
||||
reject(new Error('not support'))
|
||||
})
|
||||
}
|
||||
// base64转图片路径
|
||||
export function base64ToPath(base64) {
|
||||
return new Promise(function(resolve, reject) {
|
||||
if (typeof window === 'object' && 'document' in window) {
|
||||
base64 = base64.split(',')
|
||||
var type = base64[0].match(/:(.*?);/)[1]
|
||||
var str = atob(base64[1])
|
||||
var n = str.length
|
||||
var array = new Uint8Array(n)
|
||||
while (n--) {
|
||||
array[n] = str.charCodeAt(n)
|
||||
}
|
||||
return resolve((window.URL || window.webkitURL).createObjectURL(new Blob([array], {
|
||||
type: type
|
||||
})))
|
||||
}
|
||||
var extName = base64.split(',')[0].match(/data\:\S+\/(\S+);/)
|
||||
if (extName) {
|
||||
extName = extName[1]
|
||||
} else {
|
||||
reject(new Error('base64 error'))
|
||||
}
|
||||
var fileName = getNewFileId() + '.' + extName
|
||||
if (typeof plus === 'object') {
|
||||
var basePath = '_doc'
|
||||
var dirPath = 'uniapp_temp'
|
||||
var filePath = basePath + '/' + dirPath + '/' + fileName
|
||||
if (!biggerThan(plus.os.name === 'Android' ? '1.9.9.80627' : '1.9.9.80472', plus.runtime
|
||||
.innerVersion)) {
|
||||
plus.io.resolveLocalFileSystemURL(basePath, function(entry) {
|
||||
entry.getDirectory(dirPath, {
|
||||
create: true,
|
||||
exclusive: false,
|
||||
}, function(entry) {
|
||||
entry.getFile(fileName, {
|
||||
create: true,
|
||||
exclusive: false,
|
||||
}, function(entry) {
|
||||
entry.createWriter(function(writer) {
|
||||
writer.onwrite = function() {
|
||||
resolve(filePath)
|
||||
}
|
||||
writer.onerror = reject
|
||||
writer.seek(0)
|
||||
writer.writeAsBinary(dataUrlToBase64(base64))
|
||||
}, reject)
|
||||
}, reject)
|
||||
}, reject)
|
||||
}, reject)
|
||||
return
|
||||
}
|
||||
var bitmap = new plus.nativeObj.Bitmap(fileName)
|
||||
bitmap.loadBase64Data(base64, function() {
|
||||
bitmap.save(filePath, {}, function() {
|
||||
bitmap.clear()
|
||||
resolve(filePath)
|
||||
}, function(error) {
|
||||
bitmap.clear()
|
||||
reject(error)
|
||||
})
|
||||
}, function(error) {
|
||||
bitmap.clear()
|
||||
reject(error)
|
||||
})
|
||||
return
|
||||
}
|
||||
if (typeof wx === 'object' && wx.canIUse('getFileSystemManager')) {
|
||||
var filePath = wx.env.USER_DATA_PATH + '/' + fileName
|
||||
wx.getFileSystemManager().writeFile({
|
||||
filePath: filePath,
|
||||
data: dataUrlToBase64(base64),
|
||||
encoding: 'base64',
|
||||
success: function() {
|
||||
resolve(filePath)
|
||||
},
|
||||
fail: function(error) {
|
||||
reject(error)
|
||||
}
|
||||
})
|
||||
return
|
||||
}
|
||||
reject(new Error('not support'))
|
||||
})
|
||||
}
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
import request from './requst.js';
|
||||
export function uploadImg(data) {
|
||||
return request.upload("/universal/api.upload/upload", data);
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,158 @@
|
|||
// 判断当前环境
|
||||
const ENV = process.env.NODE_ENV;
|
||||
console.log(ENV,'当前环境'); // development：开发环境 test：测试环境 production：生产环境
|
||||
// 配置全局域名
|
||||
// #ifdef APP-PLUS
|
||||
const hostapi = 'http://maintain.7and5.cn';
|
||||
// #endif
|
||||
// #ifdef MP-WEIXIN
|
||||
const hostapi = 'http://maintain.7and5.cn';
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
const hostapi = '/web';
|
||||
// #endif
|
||||
// 清理所有缓存并前往授权页
|
||||
const goLogin = () => {
|
||||
uni.clearStorageSync();
|
||||
uni.navigateTo({
|
||||
url: '/pages/login/login'
|
||||
})
|
||||
}
|
||||
// 请求错误处理
|
||||
const checkError = (e) => {
|
||||
// console.error("----接口错误----", e)
|
||||
if (e.data) {
|
||||
if (e.data.code) {
|
||||
switch (Number(e.data.code)) {
|
||||
case 4003:
|
||||
// 参数错误
|
||||
console.log('4003参数错误');
|
||||
break;
|
||||
case 4004:
|
||||
// 记录不存在
|
||||
console.log('4004记录不存在');
|
||||
break;
|
||||
case 5001:
|
||||
// xxx错误
|
||||
console.log('5001xxx错误');
|
||||
break;
|
||||
case 5050:
|
||||
// 服务器错误，请稍后重试
|
||||
console.log('5050服务器错误，请稍后重试');
|
||||
break;
|
||||
case 5051:
|
||||
// 未知错误
|
||||
console.log('5051未知错误');
|
||||
break;
|
||||
case 6001:
|
||||
// token验证失败或已失效
|
||||
console.log('6001token验证失败或已失效');
|
||||
goLogin();
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 封装request的(GET、POST)请求
|
||||
const request = (method, url, options) => {
|
||||
let methods = '';
|
||||
let headers = {};
|
||||
switch (method) {
|
||||
case 'get':
|
||||
methods = 'GET'
|
||||
headers = {
|
||||
'Content-Type': 'application/json; charset=UTF-8',
|
||||
'Authorization': 'Bearer '+uni.getStorageSync('token') || ''
|
||||
}
|
||||
break;
|
||||
case 'post':
|
||||
methods = 'POST'
|
||||
headers = {
|
||||
'Content-Type': 'application/json; charset=UTF-8',
|
||||
'Authorization': 'Bearer '+uni.getStorageSync('token') || ''
|
||||
}
|
||||
break;
|
||||
case 'postForm':
|
||||
methods = 'POST'
|
||||
headers = {
|
||||
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8',
|
||||
'Authorization': 'Bearer '+uni.getStorageSync('token') || ''
|
||||
}
|
||||
break;
|
||||
}
|
||||
let params = {};
|
||||
if(options!=undefined) params = options;
|
||||
params.token = uni.getStorageSync('token');
|
||||
return new Promise((resolve, reject) => {
|
||||
uni.request({
|
||||
url: `${hostapi}${url}`,
|
||||
method: methods,
|
||||
data: params,
|
||||
header: headers,
|
||||
success: res => {
|
||||
console.log(`${url}返的结果===>`,res);
|
||||
if (res.statusCode == 200) {
|
||||
// 接口调用成功
|
||||
resolve(res.data);
|
||||
} else {
|
||||
// 接口返回错误信息
|
||||
checkError(res);
|
||||
}
|
||||
},
|
||||
fail: e => {
|
||||
// 接口请求错误
|
||||
checkError(e, reject);
|
||||
},
|
||||
complete: rest => {
|
||||
// 是否成功，都会执行
|
||||
console.log(rest,100);
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
// 上传文件 封装请求
|
||||
const uploadFile = (url, options) => {
|
||||
let tempData = options || {}
|
||||
console.log(tempData,108);
|
||||
return new Promise((resolve, reject) => {
|
||||
uni.uploadFile({
|
||||
url: `${hostapi}${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)
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
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,11 @@
|
|||
export default {
|
||||
onShareAppMessage(res) { //发送给朋友
|
||||
return {
|
||||
title: '', // 默认是小程序的名称(可以写slogan等)
|
||||
path: uni.getStorageSync('url') // 默认是当前页面，必须是以‘/’开头的完整路径
|
||||
}
|
||||
},
|
||||
onShareTimeline(res) {//分享到朋友圈
|
||||
return {}
|
||||
},
|
||||
}
|
||||
|
|
@ -0,0 +1,557 @@
|
|||
const tools = {
|
||||
timer:'',
|
||||
timerNot:'',
|
||||
// 埋点倒计时
|
||||
daoTime(){
|
||||
let daoTime = uni.getStorageSync('daoTime')
|
||||
if(daoTime==''){//初次判断倒计时是否为空
|
||||
uni.setStorageSync('daoTime',60)//设置倒计时
|
||||
daoTime = uni.getStorageSync('daoTime')
|
||||
this.timer = setInterval(()=>{
|
||||
uni.setStorageSync('daoTime',daoTime--)//设置倒计时
|
||||
// console.log('埋点倒计时初次：',daoTime);
|
||||
// console.log('埋点长度初次：',uni.getStorageSync('maiList').length);
|
||||
if(uni.getStorageSync('daoTime')<=0 || uni.getStorageSync('maiList').length==5){
|
||||
uni.removeStorageSync('daoTime')//清空倒计时
|
||||
clearInterval(this.timer)//关闭倒计时
|
||||
// console.log('上/报，埋点');
|
||||
// reportBuriedPoint(uni.getStorageSync('maiList'))//上报事件
|
||||
uni.removeStorageSync('maiList')//清空上报参数
|
||||
this.daoTime()//重新倒计时
|
||||
}
|
||||
},1000)
|
||||
} else {//继续当前倒计时倒计
|
||||
this.timer = setInterval(()=>{
|
||||
uni.setStorageSync('daoTime',daoTime--)//设置倒计时
|
||||
// console.log('埋点倒计时：',daoTime);
|
||||
// console.log('埋点长度：',uni.getStorageSync('maiList').length);
|
||||
if(uni.getStorageSync('daoTime')<=0 || uni.getStorageSync('maiList').length==5){
|
||||
uni.removeStorageSync('daoTime')//清空倒计时
|
||||
clearInterval(this.timer)//关闭倒计时
|
||||
// console.log('上报，埋点');
|
||||
// reportBuriedPoint(uni.getStorageSync('maiList'))//上报事件
|
||||
uni.removeStorageSync('maiList')//清空上报参数
|
||||
this.daoTime()//重新倒计时
|
||||
}
|
||||
},1000)
|
||||
}
|
||||
},
|
||||
closeTimer(){
|
||||
clearInterval(this.timer)//关闭倒计时
|
||||
console.log('倒计时清空了');
|
||||
clearInterval(this.timerNot)//关闭倒计时
|
||||
},
|
||||
maiDian(data){//埋点事件
|
||||
let maiList = uni.getStorageSync('maiList')
|
||||
// console.log(maiList);
|
||||
if(maiList==''){
|
||||
maiList = [data]
|
||||
} else maiList.push(data)
|
||||
uni.setStorageSync('maiList',maiList)
|
||||
},
|
||||
weekDate(){//获取未来七天星期几，几号
|
||||
let date = new Date()
|
||||
let year = date.getFullYear()
|
||||
let month = date.getMonth()+1
|
||||
let day = date.getDate()
|
||||
let nth = date.getDay()//星期几
|
||||
// console.log(year,month,day);
|
||||
let xingq = ['周一','周二','周三','周四','周五','周六','周日']
|
||||
|
||||
},
|
||||
// 手机号验证
|
||||
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
|
||||
return !reg_tel.test(phone);
|
||||
},
|
||||
// 电子邮箱验证
|
||||
isEmail(email){
|
||||
let reg_email = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
|
||||
return !reg_email.test(email);
|
||||
},
|
||||
// 身份证验证
|
||||
isIdentity(identity) {
|
||||
let reg_identity = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
|
||||
return !reg_identity.test(identity);
|
||||
},
|
||||
// 手机号中间四位用"****"带替
|
||||
hideMPhone(phone){
|
||||
return `${phone.substr(0, 3)}****${phone.substr(7)}`
|
||||
},
|
||||
// 昵称从第一个字开始，后面的都用"*"代替
|
||||
hideName(name,num){
|
||||
return `${name.substr(0, 1)}****${name.substr(name.length-1)}`
|
||||
},
|
||||
// 金额转换各三位数使用英文","隔开
|
||||
changeNum(num){
|
||||
if (num) {
|
||||
// 针对整数部分进行格式化处理，这是此方法的核心，也是稍难理解的一个地方，逆向的来思考或者采用简单的事例来实现就容易多了
|
||||
/*
|
||||
也可以这样想象，现在有一串数字字符串在你面前，如果让你给他家千分位的逗号的话，你是怎么来思考和操作的?
|
||||
字符串长度为0/1/2/3时都不用添加
|
||||
字符串长度大于3的时候，从右往左数，有三位字符就加一个逗号，然后继续往前数，直到不到往前数少于三位字符为止
|
||||
*/
|
||||
num = num+''; // 数字转换为字符串，数字是没有.length属性的
|
||||
for (var i = 0; i < Math.floor((num.length - (1 + i)) / 3); i++) {
|
||||
num = num.substring(0, num.length - (4 * i + 3)) + ',' + num.substring(num.length - (4 * i + 3))
|
||||
}
|
||||
// 将数据（符号、整数部分、小数部分）整体组合返回
|
||||
return num;
|
||||
}
|
||||
},
|
||||
// 整数添加.00，小数就不添加
|
||||
addXiaoShu(num){
|
||||
console.log(num,120);
|
||||
let str = num.toString();
|
||||
if(str.length > 9){
|
||||
str = str*1;
|
||||
str = str.toFixed(2);
|
||||
str = str+'';
|
||||
}
|
||||
return str.includes('.') ? str*1 : str = num + '.00';
|
||||
},
|
||||
// type:+加、-减、*乘、/除
|
||||
// len:小数后保留几位
|
||||
operationEv(num1,num2,type,len=0){
|
||||
// 将数字转化成字符串
|
||||
num1 = num1.toString();
|
||||
num2 = num2.toString();
|
||||
// 获取小数点的位置
|
||||
var index1 = num1.indexOf(".");
|
||||
var index2 = num2.indexOf(".");
|
||||
// 如果小数点存在，那么就再获取各自的小数位数
|
||||
var ws1 = 0;
|
||||
var ws2 = 0;
|
||||
if(index1 != -1){
|
||||
ws1 = num1.split(".")[1].length;
|
||||
}
|
||||
if(index2 != -1){
|
||||
ws2 = num2.split(".")[1].length;
|
||||
}
|
||||
// 看谁的小数位数大，谁的小数位数小
|
||||
var bigger = (ws1 > ws2) ? ws1 : ws2;
|
||||
var smaller = (ws1 < ws2) ? ws1 : ws2;
|
||||
// 计算得到需要补齐的0的个数
|
||||
var zerosCount = bigger - smaller;
|
||||
// 好了，现在不管三七二十，全部去除小数点
|
||||
num1 = num1.replace(".","");
|
||||
num2 = num2.replace(".","");
|
||||
// 比较num1和num2谁大，比较方法就是看谁是smaller，是smaller的一方就补0
|
||||
if(ws1 == smaller){
|
||||
for (var i = 0; i < zerosCount; i++) {
|
||||
num1 += "0";
|
||||
}
|
||||
} else {
|
||||
for (var i = 0; i < zerosCount; i++) {
|
||||
num2 += "0";
|
||||
}
|
||||
}
|
||||
// 开始计算
|
||||
var sum = "";
|
||||
if(type=="+"){
|
||||
// 加
|
||||
sum = parseInt(num1) + parseInt(num2);
|
||||
}
|
||||
if(type=="-"){
|
||||
// 减
|
||||
sum = parseInt(num1) - parseInt(num2);
|
||||
}
|
||||
if(type=="*"){
|
||||
// 乘
|
||||
sum = parseInt(num1) * parseInt(num2);
|
||||
}
|
||||
if(type=="/"){
|
||||
// 除
|
||||
sum = parseInt(num1) / parseInt(num2);
|
||||
}
|
||||
// 根据较大的小数位数计算倍数
|
||||
var beishu = 1;
|
||||
for (var i = 0; i < bigger; i++) {
|
||||
beishu = beishu*10;
|
||||
}
|
||||
sum = sum/beishu;
|
||||
if(type=="*"){
|
||||
switch (bigger){
|
||||
case 1:
|
||||
sum = sum / 10;
|
||||
break;
|
||||
case 2:
|
||||
sum = sum / 100;
|
||||
break;
|
||||
case 3:
|
||||
sum = sum / 1000;
|
||||
break;
|
||||
}
|
||||
}
|
||||
if(type=="/"){
|
||||
switch (bigger){
|
||||
case 1:
|
||||
sum = sum * 10;
|
||||
break;
|
||||
case 2:
|
||||
sum = sum * 100;
|
||||
break;
|
||||
case 3:
|
||||
sum = sum * 1000;
|
||||
break;
|
||||
}
|
||||
}
|
||||
len!=0 ? sum = sum.toFixed(len) : '';
|
||||
return sum;
|
||||
},
|
||||
// 时间戳===>日期
|
||||
timestampToTime(timestamp) {
|
||||
var date = timestamp.toString().length==13 ? new Date(timestamp*1) : 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
|
||||
},
|
||||
// 随机数生成
|
||||
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%!important;height:auto" ')
|
||||
.replace(/src=\"/g,'src="https://oss.hmzfyy.cn');
|
||||
},
|
||||
updaX(){//检测小程序版本以及更新小程序
|
||||
// #ifdef MP-WEIXIN
|
||||
// 获取小程序的运行环境、版本号、appId 注意：线上小程序版本号仅支持在正式版小程序中获取，开发版和体验版中无法获取。
|
||||
const accountInfo = wx.getAccountInfoSync();//使用详情：https://developers.weixin.qq.com/miniprogram/dev/api/open-api/account-info/wx.getAccountInfoSync.html
|
||||
var version = accountInfo.miniProgram.version;
|
||||
console.log(version,319);
|
||||
// 检测小程序的更新
|
||||
const updateManager = wx.getUpdateManager()//以下使用详情：https://developers.weixin.qq.com/miniprogram/dev/api/base/update/UpdateManager.html#%E7%A4%BA%E4%BE%8B%E4%BB%A3%E7%A0%81
|
||||
updateManager.onCheckForUpdate(function (res) {
|
||||
// 请求完新版本信息的回调
|
||||
// console.log('检测是否有更新：',res.hasUpdate)
|
||||
})
|
||||
updateManager.onUpdateReady(function (res) {
|
||||
wx.showModal({
|
||||
title: `更新`,
|
||||
content: `新版本${version}已上线，是否重启应用`,
|
||||
success:(res)=> {
|
||||
if (res.confirm) {
|
||||
// 新的版本已经下载好，调用 applyUpdate 应用新版本并重启
|
||||
updateManager.applyUpdate()
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
updateManager.onUpdateFailed(function (res) {
|
||||
// 新版本下载失败
|
||||
// console.log('新版本下载失败:',res);
|
||||
})
|
||||
// #endif
|
||||
},
|
||||
networkStatus(){//检查网络状态
|
||||
uni.getNetworkType({
|
||||
success: function (res) {
|
||||
console.log('当前网络状态：',res.networkType);//none：当前无网络连接
|
||||
if(res.networkType=='none'){
|
||||
uni.setStorageSync('isNet',false)
|
||||
} else {
|
||||
uni.setStorageSync('isNet',true);
|
||||
// 微信小程序原生API性能优化
|
||||
// #ifdef MP-WEIXIN
|
||||
// 连网下，检测小程序是否有更新
|
||||
tools.updaX();
|
||||
// #endif
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
// 文本复制
|
||||
clickCopy(data){
|
||||
uni.setClipboardData({
|
||||
data: data,
|
||||
success: ()=> {
|
||||
uni.showToast({title: '复制成功',duration: 2000,icon: 'none'});
|
||||
}
|
||||
});
|
||||
},
|
||||
dayTime(endTime,startTime=''){//开启倒计时
|
||||
let totalSecond = '';
|
||||
// 本地倒计时
|
||||
// if(startTime=='') totalSecond = Math.floor((new Date(endTime).getTime() - new Date().getTime())/1000);
|
||||
// 解决苹果手机问题
|
||||
let date = endTime;
|
||||
date = endTime.replace(/-/g,'/')
|
||||
// 服务器倒计时
|
||||
if(startTime!='') totalSecond = Math.floor((new Date(date).getTime() - startTime)/1000);
|
||||
// 总秒数
|
||||
let second = totalSecond;
|
||||
// 天数
|
||||
let day = Math.floor(second / 3600 / 24);
|
||||
let dayStr = day.toString();
|
||||
if(dayStr.length == 1) dayStr = '0' + dayStr;
|
||||
// 小时
|
||||
let hr = Math.floor((second - day * 3600 * 24) / 3600);
|
||||
let hrStr = hr.toString();
|
||||
if(hrStr.length == 1) hrStr = '0' + hrStr;
|
||||
// 分钟
|
||||
let min = Math.floor((second - day * 3600 * 24 - hr * 3600) / 60);
|
||||
let minStr = min.toString();
|
||||
if(minStr.length == 1) minStr = '0' + minStr;
|
||||
// 秒
|
||||
let sec = second - day * 3600 * 24 - hr * 3600 - min * 60;
|
||||
let secStr = sec.toString();
|
||||
if(secStr.length == 1) secStr = '0' + secStr;
|
||||
|
||||
let newTime = '';
|
||||
if(dayStr==0) {
|
||||
newTime = hrStr +'时'+ minStr +'分'+ secStr +'秒';
|
||||
} else {
|
||||
newTime = dayStr +'天'+ hrStr +'时'+ minStr +'分'+ secStr +'秒';
|
||||
}
|
||||
return newTime;
|
||||
},
|
||||
// 刷新token
|
||||
refreshToken(){
|
||||
console.log('进入检测token是否过期');
|
||||
var date = new Date();
|
||||
var timestamp = date.getTime();//精确到毫秒
|
||||
// 如果过期时间 减 10分钟 小于当前时间，刷新token
|
||||
if((uni.getStorageSync('expire')*1000 - 600000) < timestamp) {
|
||||
uni.login({
|
||||
provider: 'weixin',
|
||||
success: (res)=> {
|
||||
if (res.code) {
|
||||
var params = {code:res.code}
|
||||
uni.request({
|
||||
url: `${uni.getStorageSync('hostapi')}/api/user/login`,
|
||||
method: 'post',
|
||||
data: params,
|
||||
header: {
|
||||
'Content-Type': 'application/json; 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)//是否第一次授权
|
||||
uni.setStorageSync('phone_active',res.data.data.phone_active)//是否绑定手机号
|
||||
uni.setStorageSync('userId',res.data.data.account_id)//用户id
|
||||
uni.setStorageSync('invite_code',res.data.data.invite_code)//邀请码
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
},
|
||||
// 判断是否授权，没授权，前往登录页面授权
|
||||
judgeAuth(){
|
||||
let auth = true;
|
||||
switch (uni.getStorageSync('phone_active')*1){
|
||||
case 0: // 未注册
|
||||
uni.navigateTo({url:'/pages/login/login'});
|
||||
auth = false
|
||||
break;
|
||||
case 1: // 已注册
|
||||
auth = true
|
||||
break;
|
||||
}
|
||||
return auth;
|
||||
},
|
||||
// 判断当前环境、清空日志、设置全局域名
|
||||
currentContext(){
|
||||
// #ifdef APP-PLUS
|
||||
if(uni.getSystemInfoSync().platform != "devtools"){//devtools：开发版 值域为：ios、android、mac（3.1.10+）、windows（3.1.10+）、linux（3.1.10+）
|
||||
// console.log = () =>{}
|
||||
}
|
||||
// #endif
|
||||
// 微信小程序原生API性能优化
|
||||
// #ifdef MP-WEIXIN
|
||||
let hInfo = wx.getAccountInfoSync();
|
||||
// console.log(hInfo.envVersion);//develop:开发版 trial：体验版 release：正式版
|
||||
// if(hInfo.miniProgram.envVersion == "develop"){
|
||||
if(hInfo.miniProgram.envVersion == "develop" || hInfo.miniProgram.envVersion == "trial"){
|
||||
// (开发版,体验版)-配置全局域名
|
||||
// uni.setStorageSync('hostapi','https://hengmei.scdxtc.cn/api/');
|
||||
} else {
|
||||
// 清除所有输出日志
|
||||
console.log = () =>{};
|
||||
// 正式版-配置全局域名
|
||||
// uni.setStorageSync('hostapi','https://hm.hmzfyy.cn/api/');
|
||||
// 开启埋点倒计时
|
||||
this.daoTime();//开启埋点倒计时
|
||||
}
|
||||
// #endif
|
||||
},
|
||||
// 禁止小程序使用分享
|
||||
disableShareEv(){
|
||||
// #ifdef MP-WEIXIN
|
||||
wx.hideShareMenu({
|
||||
menus: ['shareAppMessage', 'shareTimeline']
|
||||
})
|
||||
// #endif
|
||||
},
|
||||
// 获取当前页面url，不带参数
|
||||
obtainUrl(){
|
||||
let pages = getCurrentPages();
|
||||
let route = pages[pages.length - 1].route;
|
||||
uni.setStorageSync('url',`/${route}?invite_code=${uni.getStorageSync('invite_code')}`);
|
||||
console.log(`${route}`,'tools.js：当前页面路径不带参数')
|
||||
},
|
||||
// 获取当前页面url，带参数
|
||||
obtainUrlParam(){
|
||||
let pages = getCurrentPages();
|
||||
let routeParam = pages[pages.length - 1].$page.fullPath;
|
||||
uni.setStorageSync('urlParam',`${routeParam}?invite_code=${uni.getStorageSync('invite_code')}`);
|
||||
console.log(uni.getStorageSync('urlParam'),'tools.js：当前页面路径带参数')
|
||||
},
|
||||
// 去这里
|
||||
goFlag:true,
|
||||
goThere(){
|
||||
if(this.flag){
|
||||
this.flag = false;
|
||||
// #ifdef MP-WEIXIN
|
||||
wx.getLocation({//获取当前经纬度
|
||||
type: 'wgs84', //返回可以用于wx.openLocation的经纬度，官方提示bug: iOS 6.3.30 type 参数不生效，只会返回 wgs84 类型的坐标信息
|
||||
success: (res)=> {
|
||||
wx.openLocation({//使用微信内置地图查看位置。
|
||||
latitude: 30.656693,//要去的纬度-地址
|
||||
longitude: 104.136425,//要去的经度-地址
|
||||
name: '大向天诚有限责任公司',
|
||||
address: '四川省成都市成华区双店路B口',
|
||||
fail:err=>{
|
||||
this.showToast('地址信息错误');
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
// #endif
|
||||
setTimeout(()=>{
|
||||
this.flag = true;
|
||||
},2000)
|
||||
} else {
|
||||
this.showToast('请勿多次点击');
|
||||
}
|
||||
},
|
||||
// 拨打电话
|
||||
countCustomer(phone){
|
||||
const res = uni.getSystemInfoSync();
|
||||
if(res.platform=='ios'){
|
||||
uni.makePhoneCall({
|
||||
phoneNumber:phone,
|
||||
success: () => {},
|
||||
fail: () => {}
|
||||
})
|
||||
} else {
|
||||
uni.showActionSheet({
|
||||
itemList:[phone,'立即呼叫'],
|
||||
itemColor:'#3875F6',
|
||||
success: (res) => {
|
||||
if(res.tapIndex==1){
|
||||
uni.makePhoneCall({
|
||||
phoneNumber:phone
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
export default {
|
||||
tools
|
||||
}
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
import Vue from 'vue';
|
||||
import App from './App';
|
||||
|
||||
import nothingPage from './components/nothing/nothing-page.vue';//引入无内容组件
|
||||
Vue.component('nothing-page',nothingPage);//全局注册无内容组件
|
||||
|
||||
import statusNav from './components/status-navs/status-nav.vue';//引入头部状态栏与导航栏组件
|
||||
Vue.component('status-nav',statusNav);//全局注册头部状态栏与导航栏组件
|
||||
|
||||
import containerSubgroupTwo from './components/containers/container-subgroup-two.vue';//引入头部状态栏与导航栏组件
|
||||
Vue.component('container-subgroup',containerSubgroupTwo);//全局注册头部状态栏与导航栏组件
|
||||
|
||||
import share from './jsFile/share.js';// 全局注册分享事件
|
||||
Vue.mixin(share);
|
||||
|
||||
// 常用工具
|
||||
import tools from '@/jsFile/tools.js';
|
||||
Vue.prototype.$toolAll = tools;
|
||||
// 响应数据
|
||||
import requst from '@/jsFile/requst.js';
|
||||
Vue.prototype.$requst = requst;
|
||||
|
||||
App.mpType = 'app';
|
||||
|
||||
const app = new Vue({
|
||||
...App
|
||||
})
|
||||
app.$mount()
|
||||
|
|
@ -0,0 +1,109 @@
|
|||
{
|
||||
"name" : "飞猴",
|
||||
"appid" : "__UNI__C9AEDD9",
|
||||
"description" : "",
|
||||
"versionName" : "1.0.0",
|
||||
"versionCode" : "100",
|
||||
"transformPx" : false,
|
||||
"app-plus" : {
|
||||
"usingComponents" : true,
|
||||
"compilerVersion" : 3,
|
||||
/* 5+App特有相关 */
|
||||
"modules" : {
|
||||
"Payment" : {},
|
||||
"Share" : {}
|
||||
},
|
||||
/* 模块配置 */
|
||||
"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" : "wx2654bc27c419ada6",
|
||||
"UniversalLinks" : ""
|
||||
}
|
||||
},
|
||||
"push" : {},
|
||||
"geolocation" : {},
|
||||
"share" : {
|
||||
"weixin" : {
|
||||
"appid" : "wx2654bc27c419ada6",
|
||||
"UniversalLinks" : ""
|
||||
}
|
||||
},
|
||||
"ad" : {}
|
||||
}
|
||||
},
|
||||
"splashscreen" : {
|
||||
"alwaysShowBeforeRender" : false,
|
||||
"waiting" : false
|
||||
}
|
||||
},
|
||||
/* SDK配置 */
|
||||
"quickapp" : {},
|
||||
/* 快应用特有相关 */
|
||||
"mp-weixin" : {
|
||||
/* 小程序特有相关 */
|
||||
"appid" : "wx705dfb975654e53a",
|
||||
"setting" : {
|
||||
"urlCheck" : true,
|
||||
"es6" : true
|
||||
},
|
||||
"usingComponents" : true,
|
||||
"permission" : {
|
||||
"scope.userLocation" : {
|
||||
"desc" : "您的位置信息将用于小程序位置接口的效果展示"
|
||||
}
|
||||
}
|
||||
},
|
||||
"h5" : {
|
||||
"sdkConfigs" : {
|
||||
"maps" : {
|
||||
"qqmap" : {
|
||||
"key" : "TMWBZ-XA3CD-HA74Y-PNUS4-SAV6Q-X7FXH"
|
||||
}
|
||||
}
|
||||
},
|
||||
"devServer" : {
|
||||
"https" : false,
|
||||
"proxy" : {
|
||||
"/web" : {
|
||||
"target" : "http://maintain.7and5.cn",
|
||||
"changeOrigin" : true,
|
||||
"secure" : false,
|
||||
"pathRewrite" : {
|
||||
"^/web" : ""
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"mp-baidu" : {
|
||||
"appid" : "24346353"
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
{
|
||||
"id": "zhuge-swiper",
|
||||
"name": "轮播视频和图片",
|
||||
"version": "1.0.1",
|
||||
"description": "自动轮播视频和图片组件。播放视频时停止轮播，手动滑动swiper时视频停止播放",
|
||||
"keywords": [
|
||||
"vue",
|
||||
"swiper",
|
||||
"zhuge"
|
||||
]
|
||||
}
|
||||
|
|
@ -0,0 +1,153 @@
|
|||
{
|
||||
"pages": [{
|
||||
"path": "pages/guide-page/guide-page",
|
||||
"style": {
|
||||
"navigationBarTitleText": "",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationStyle": "custom", //禁用原生导航栏，微信小程序可用
|
||||
"navigationBarTextStyle": "white",
|
||||
"app-plus": {
|
||||
"titleNView": false //禁用原生导航栏，APP和H5可用
|
||||
}
|
||||
}
|
||||
}, {
|
||||
"path": "pages/login/login",
|
||||
"style": {
|
||||
"navigationBarTitleText": "",
|
||||
"navigationStyle": "custom" ,//禁用原生导航栏，微信小程序可用
|
||||
"navigationBarTextStyle": "white"
|
||||
}
|
||||
}, {
|
||||
"path": "pages/tabbar/pagehome/pagehome",
|
||||
"style": {
|
||||
"navigationBarTitleText": "",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationStyle": "custom", //禁用原生导航栏，微信小程序可用
|
||||
"navigationBarTextStyle": "black",
|
||||
"app-plus": {
|
||||
"titleNView": false, //禁用原生导航栏，APP和H5可用
|
||||
"bounce": "none",
|
||||
"scrollIndicator": "none"
|
||||
}
|
||||
}
|
||||
}, {
|
||||
"path": "pages/tabbar/my/my",
|
||||
"style": {
|
||||
"navigationBarTitleText": "个人中心",
|
||||
"navigationStyle": "custom" //禁用原生导航栏，微信小程序可用
|
||||
}
|
||||
}, {
|
||||
"path": "pages/login/agreement",
|
||||
"style": {
|
||||
"navigationBarTitleText": ""
|
||||
}
|
||||
}, {
|
||||
"path": "pages/tabbar/project-list/project-list",
|
||||
"style": {
|
||||
"navigationBarTitleText": "项目列表",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
|
||||
}, {
|
||||
"path": "pages/tabbar/feedback/feedback",
|
||||
"style": {
|
||||
"navigationBarTitleText": "意见反馈",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
}, {
|
||||
"path": "pages/register/register",
|
||||
"style": {
|
||||
"navigationBarTitleText": "",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationStyle": "custom", //禁用原生导航栏，微信小程序可用
|
||||
"navigationBarTextStyle": "black",
|
||||
"app-plus": {
|
||||
"titleNView": false, //禁用原生导航栏，APP和H5可用
|
||||
"bounce": "none",
|
||||
"scrollIndicator": "none"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/forget/forget",
|
||||
"style": {
|
||||
"navigationBarTitleText": "找回密码",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
}
|
||||
],
|
||||
"subPackages": [{ //A包
|
||||
"root": "pagesA",
|
||||
"pages": [{
|
||||
"path": "test/test",
|
||||
"style": {
|
||||
"navigationBarTitleText": "",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
}]
|
||||
},
|
||||
{ //B包
|
||||
"root": "pagesB",
|
||||
"pages": [{
|
||||
"path": "personal-information/personal-information",
|
||||
"style": {
|
||||
"navigationBarTitleText": "个人信息",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
},{
|
||||
"path": "service-range/service-range",
|
||||
"style": {
|
||||
"navigationBarTitleText": "服务范围",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
}, {
|
||||
"path": "i-want-evaluate/i-want-evaluate",
|
||||
"style": {
|
||||
"navigationBarTitleText": "我要评价",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
},{
|
||||
"path": "set-up/set-up",
|
||||
"style": {
|
||||
"navigationBarTitleText": "设置",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
},{
|
||||
"path" : "map/map",
|
||||
"style" : {
|
||||
"navigationBarTitleText": "",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
|
||||
"preloadRule": {
|
||||
"pages/tabbar/pagehome/pagehome": {
|
||||
"network": "all",
|
||||
"packages": ["pagesA"]
|
||||
}
|
||||
},
|
||||
"globalStyle": {
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarBackgroundColor": "#FFFFFF", //导航栏背景色
|
||||
"backgroundColor": "#FFFFFF", //窗口背景色
|
||||
"navigationStyle": "custom", //禁用原生导航栏，微信小程序可用
|
||||
"app-plus": {
|
||||
"titleNView": false, //禁用原生导航栏，APP和H5可用
|
||||
"bounce": "none",
|
||||
"scrollIndicator": "none"
|
||||
}
|
||||
},
|
||||
"condition" : { //模式配置，仅开发期间生效
|
||||
"current": 0, //当前激活的模式(list 的索引项)
|
||||
"list": [
|
||||
{
|
||||
"name": "", //模式名称
|
||||
"path": "", //启动页面，必选
|
||||
"query": "" //启动参数，在页面的onLoad函数里面得到
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,221 @@
|
|||
<template>
|
||||
<view class="pad-zy30">
|
||||
<status-nav navBarTitle="找回密码" returnColor="#c2c2c2"></status-nav>
|
||||
<container-subgroup>
|
||||
<view slot="content" style="margin: 0 -30rpx;">
|
||||
<view class="fon52 bold mar-sx50">忘记密码 ？</view>
|
||||
<view class="fon28">
|
||||
<view class="forget-title mar-x10">手机号码</view>
|
||||
<view class="forget-input-box posir">
|
||||
<input @blur="inputBlurEv(0)" @focus="inputFocusEv(0)" @input="inputFocusEv(0)" class="fon24" type="number" maxlength="11" v-model="forget_phone" placeholder="请输入您的手机号码" placeholder-style="color:#c8c8c8;" />
|
||||
<!-- 清除按钮 -->
|
||||
<view class="clear-box" v-show="ifPhone" @tap="clearInput(0)"><view class="clear-close"><span></span><span></span></view></view>
|
||||
</view>
|
||||
<view class="forget-title mar-x10">手机验证码</view>
|
||||
<view class="forget-input-box posir">
|
||||
<input @blur="inputBlurEv(1)" @focus="inputFocusEv(1)" @input="inputFocusEv(1)" class="fon24" type="number" maxlength="6" v-model="forget_code" placeholder="请输入手机验证码" placeholder-style="color:#c8c8c8;" />
|
||||
<view class="forget-obtain-code" @tap="getCode">{{codeText}}</view>
|
||||
<!-- 清除按钮 -->
|
||||
<view class="clear-box" v-show="ifCode" @tap="clearInput(1)" style="right: 260rpx;"><view class="clear-close"><span></span><span></span></view></view>
|
||||
</view>
|
||||
<view class="forget-title mar-x10">新密码</view>
|
||||
<view class="forget-input-box posir">
|
||||
<input @blur="inputBlurEv(2)" @focus="inputFocusEv(2)" @input="inputFocusEv(2)" class="fon24" type="text" password v-model="forget_password" placeholder="请输入新密码" placeholder-style="color:#c8c8c8;" />
|
||||
<!-- 清除按钮 -->
|
||||
<view class="clear-box" v-show="ifPassword" @tap="clearInput(2)"><view class="clear-close"><span></span><span></span></view></view>
|
||||
</view>
|
||||
<view class="forget-title mar-x10">确认密码</view>
|
||||
<view class="forget-input-box posir">
|
||||
<input @blur="inputBlurEv(3)" @focus="inputFocusEv(3)" @input="inputFocusEv(3)" class="fon24" type="text" password v-model="forget_qpassword" placeholder="请再次确认密码" placeholder-style="color:#c8c8c8;" />
|
||||
<!-- 清除按钮 -->
|
||||
<view class="clear-box" v-show="ifqpassword" @tap="clearInput(3)"><view class="clear-close"><span></span><span></span></view></view>
|
||||
</view>
|
||||
<view class="forget-title mar-x10">单位名称</view>
|
||||
<view class="forget-input-box posir">
|
||||
<input @blur="inputBlurEv(4)" @focus="inputFocusEv(4)" @input="inputFocusEv(4)" class="fon24" type="text" v-model="forget_unitname" placeholder="请输入单位名称" placeholder-style="color:#c8c8c8;" />
|
||||
<!-- 清除按钮 -->
|
||||
<view class="clear-box" v-show="ifUnitname" @tap="clearInput(4)"><view class="clear-close"><span></span><span></span></view></view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 立即修改 -->
|
||||
<view class="forget-btn" @tap="submitEv">立即修改</view>
|
||||
</view>
|
||||
</container-subgroup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
ifPhone:false,
|
||||
forget_phone:'',
|
||||
ifCode:false,
|
||||
forget_code:'',
|
||||
ifPassword:false,
|
||||
forget_password:'',
|
||||
ifqpassword:false,
|
||||
forget_qpassword:'',
|
||||
ifUnitname:false,
|
||||
forget_unitname:'',
|
||||
codeText:'获取验证码' ,// 获取验证码按钮文字
|
||||
flagCode:true ,// 允许点击获取验证码
|
||||
countDown:null//验证码倒计时事件
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 提交事件
|
||||
submitEv(){
|
||||
if(this.checkEmpty()){
|
||||
let params = {
|
||||
phone: this.forget_phone, // 手机号码
|
||||
sms_code:this.forget_code, // 短信验证码
|
||||
password: this.forget_password, // 密码
|
||||
confirm_password: this.forget_qpassword, // 确认密码
|
||||
affiliation: this.forget_unitname ,//单位名称
|
||||
}
|
||||
this.$requst.post('/universal/api.login/password_find',params).then(res=>{
|
||||
if(res.code==1) {
|
||||
this.$toolAll.tools.showToast('找回成功');
|
||||
setTimeout(()=>{uni.navigateBack({delta:1})},1000)
|
||||
} else {
|
||||
this.$toolAll.tools.showToast(res.msg);
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
// 获取验证码
|
||||
getCode(){
|
||||
if(this.$toolAll.tools.isPhone(this.forget_phone)) {
|
||||
this.$toolAll.tools.showToast('请输入正确的手机号');
|
||||
} else {
|
||||
if(this.flagCode) {
|
||||
this.flagCode = false;
|
||||
let count = 60;
|
||||
this.codeText = `${count}S重新获取`
|
||||
this.countDown = setInterval(()=>{
|
||||
count--;
|
||||
count < 10 ? this.codeText = `0${count}S重新获取` : this.codeText = `${count}S重新获取`;
|
||||
if(count==0) {
|
||||
this.codeText = `重新获取`;
|
||||
clearInterval(this.countDown);
|
||||
this.flagCode = true;
|
||||
}
|
||||
},1000)
|
||||
// 调用获取短信事件
|
||||
this.getMessage(this.forget_phone);
|
||||
}
|
||||
}
|
||||
},
|
||||
// 获取短信事件
|
||||
getMessage(phone){
|
||||
this.$requst.post('/universal/api.login/send_sms',{phone}).then(res=>{
|
||||
this.$toolAll.tools.showToast(res.msg);
|
||||
if(res.code==0) {
|
||||
clearInterval(this.countDown);
|
||||
this.codeText = `获取验证码`
|
||||
}
|
||||
})
|
||||
},
|
||||
// 检测是否某个输入框为空
|
||||
checkEmpty(){
|
||||
let ifEmpty = true;
|
||||
if(this.$toolAll.tools.isPhone(this.forget_phone)) {
|
||||
this.$toolAll.tools.showToast('手机号格式不正确');
|
||||
ifEmpty = false;
|
||||
return;
|
||||
}
|
||||
if(!this.forget_code) {
|
||||
this.$toolAll.tools.showToast('请输入验证码');
|
||||
ifEmpty = false;
|
||||
return;
|
||||
}
|
||||
if(!this.forget_password) {
|
||||
this.$toolAll.tools.showToast('密码不能为空');
|
||||
ifEmpty = false;
|
||||
return;
|
||||
}
|
||||
if(!this.forget_qpassword) {
|
||||
this.$toolAll.tools.showToast('确认密码不能为空');
|
||||
ifEmpty = false;
|
||||
return;
|
||||
}
|
||||
if(this.forget_password != this.forget_qpassword) {
|
||||
this.$toolAll.tools.showToast('两次输入的密码必须相同');
|
||||
ifEmpty = false;
|
||||
return;
|
||||
}
|
||||
if(!this.forget_unitname) {
|
||||
this.$toolAll.tools.showToast('请输入单位名称');
|
||||
ifEmpty = false;
|
||||
return;
|
||||
}
|
||||
return ifEmpty;
|
||||
},
|
||||
// 输入框获取焦点
|
||||
inputFocusEv(index){
|
||||
switch (index){
|
||||
case 0:
|
||||
this.forget_phone ? this.ifPhone = true : this.ifPhone = false;
|
||||
break;
|
||||
case 1:
|
||||
this.forget_code ? this.ifCode = true : this.ifCode = false;
|
||||
break;
|
||||
case 2:
|
||||
this.forget_password ? this.ifPassword = true : this.ifPassword = false;
|
||||
break;
|
||||
case 3:
|
||||
this.forget_qpassword ? this.ifqpassword = true : this.ifqpassword = false;
|
||||
break;
|
||||
case 4:
|
||||
this.forget_unitname ? this.ifUnitname = true : this.ifUnitname = false;
|
||||
break;
|
||||
}
|
||||
},
|
||||
// 输入框失去焦点
|
||||
inputBlurEv(index){
|
||||
switch (index){
|
||||
case 0:
|
||||
setTimeout(()=>{this.ifPhone = false;},100)
|
||||
break;
|
||||
case 1:
|
||||
setTimeout(()=>{this.ifCode = false;},100)
|
||||
break;
|
||||
case 2:
|
||||
setTimeout(()=>{this.ifPassword = false;},100)
|
||||
break;
|
||||
case 3:
|
||||
setTimeout(()=>{this.ifqpassword = false;},100)
|
||||
break;
|
||||
case 4:
|
||||
setTimeout(()=>{this.ifUnitname = false;},100)
|
||||
break;
|
||||
}
|
||||
},
|
||||
// 清除手机号
|
||||
clearInput(index){
|
||||
switch (index){
|
||||
case 0:
|
||||
this.forget_phone = '';
|
||||
break;
|
||||
case 1:
|
||||
this.forget_code = '';
|
||||
break;
|
||||
case 2:
|
||||
this.forget_password = '';
|
||||
break;
|
||||
case 3:
|
||||
this.forget_qpassword = '';
|
||||
break;
|
||||
case 4:
|
||||
this.forget_unitname = '';
|
||||
break;
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
page{background-color: #FFFFFF;}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,66 @@
|
|||
<template>
|
||||
<view :style="{height: windowHeight+'px'}" style="overflow: hidden;">
|
||||
<image src="/static/public/icon-guide.png" mode="widthFix" style="width: 100%;"></image>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
windowHeight:uni.getSystemInfoSync().windowHeight
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.checkContext();
|
||||
},
|
||||
methods: {
|
||||
// 检测是否是微信端
|
||||
checkContext(){
|
||||
// #ifdef APP-PLUS
|
||||
if(uni.getSystemInfoSync().platform != "devtools"){//devtools：开发版 值域为：ios、android、mac（3.1.10+）、windows（3.1.10+）、linux（3.1.10+）
|
||||
console.log = () =>{}
|
||||
}
|
||||
setTimeout(()=>{
|
||||
uni.reLaunch({
|
||||
url:'/pages/login/login'
|
||||
})
|
||||
},3000)
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
if(uni.getSystemInfoSync().platform != "development"){//devtools：开发版 值域为：ios、android、mac（3.1.10+）、windows（3.1.10+）、linux（3.1.10+）
|
||||
console.log = () =>{}
|
||||
}
|
||||
setTimeout(()=>{
|
||||
uni.reLaunch({
|
||||
url:'/pages/login/login'
|
||||
})
|
||||
},3000)
|
||||
// #endif
|
||||
// 微信小程序原生API性能优化
|
||||
// #ifdef MP-WEIXIN
|
||||
let hInfo = wx.getAccountInfoSync();
|
||||
// console.log(hInfo.envVersion);//develop:开发版 trial：体验版 release：正式版
|
||||
if(hInfo.miniProgram.envVersion == "develop" || hInfo.miniProgram.envVersion == "trial"){
|
||||
// (开发版,体验版)-配置全局域名
|
||||
// uni.setStorageSync('hostapi','https://hengmei.scdxtc.cn/api/');
|
||||
} else {
|
||||
// 清除所有输出日志
|
||||
console.log = () =>{};
|
||||
// 正式版-配置全局域名
|
||||
// uni.setStorageSync('hostapi','https://hm.hmzfyy.cn/api/');
|
||||
}
|
||||
setTimeout(()=>{
|
||||
uni.reLaunch({
|
||||
url:'/pages/tabbar/pagehome/pagehome'
|
||||
})
|
||||
},3000)
|
||||
// #endif
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
page{background-color: #FFFFFF;}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,42 @@
|
|||
<template>
|
||||
<view>
|
||||
<status-nav :navBarTitle="title" returnColor="#c2c2c2"></status-nav>
|
||||
<container-subgroup>
|
||||
<view slot="content" style="margin: 0 -30rpx;" class="bacf">
|
||||
<view class="pad30">
|
||||
<rich-text :nodes="richText" class="fon24 line-h40 col6"></rich-text>
|
||||
</view>
|
||||
</view>
|
||||
</container-subgroup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data(){
|
||||
return {
|
||||
title:'',//标题
|
||||
richText:''//富文本详情
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
options.type*1 ? this.title = '飞猴隐私政策' : this.title = '飞猴用户服务协议';
|
||||
this.checkAgreement(options.type);
|
||||
},
|
||||
methods:{
|
||||
checkAgreement(type){
|
||||
console.log(type,26);
|
||||
let url = type*1 ? '/universal/api.login/register_privacy_agreement' : '/universal/api.login/register_user_agreement';
|
||||
this.$requst.post(url).then(res=>{
|
||||
if(res.code==1) {
|
||||
this.richText = this.$toolAll.tools.escape2Html(res.data.protocol);
|
||||
} else this.$toolAll.tools.showToast(res.msg);
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,254 @@
|
|||
<template>
|
||||
<view>
|
||||
<view style="overflow: hidden;position: relative;" :style="{height: windowHeight + 'px'}">
|
||||
<image class="login-img" src="/static/public/icon-login.png" mode="widthFix"></image>
|
||||
<view class="login-box fon28">
|
||||
<!-- 手机号 -->
|
||||
<view class="login-input-box">
|
||||
<view style="width: 30rpx;">
|
||||
<image style="width: 30rpx;height: 28rpx;" src="/static/public/icon-people.png" mode=""></image>
|
||||
</view>
|
||||
<input class="width100" type="number" @blur="inputBlurEv(0)" @focus="inputFocusEv(0)" @input="inputFocusEv(0)" v-model="login_phone" maxlength="11" placeholder="请输入手机号" placeholder-class="col9" />
|
||||
<!-- 清除按钮 -->
|
||||
<view class="clear-box" v-show="ifPhone" @tap="clearInput(0)" style="right: 20rpx;"><view class="clear-close"><span></span><span></span></view></view>
|
||||
</view>
|
||||
<!-- 验证码 -->
|
||||
<view class="login-input-box" v-show="login_type=='mobile'">
|
||||
<view style="width: 30rpx;">
|
||||
<image style="width: 22rpx;height: 26rpx;" src="/static/public/icon-password.png" mode=""></image>
|
||||
</view>
|
||||
<input class="width100" type="number" v-model="login_code" maxlength="6" @blur="inputBlurEv(1)" @focus="inputFocusEv(1)" @input="inputFocusEv(1)" placeholder="请输入验证码" placeholder-class="col9" />
|
||||
<view class="login-code-btn" @tap="getCode">{{codeText}}</view>
|
||||
<!-- 清除按钮 -->
|
||||
<view class="clear-box" v-show="ifCode" @tap="clearInput(1)" style="right: 260rpx;"><view class="clear-close"><span></span><span></span></view></view>
|
||||
</view>
|
||||
<!-- 密码登录 -->
|
||||
<view class="login-input-box" v-show="login_type!='mobile'">
|
||||
<view style="width: 30rpx;">
|
||||
<image style="width: 22rpx;height: 26rpx;" src="/static/public/icon-password.png" mode=""></image>
|
||||
</view>
|
||||
<input class="width100" type="text" password v-model="login_password" @blur="inputBlurEv(3)" @focus="inputFocusEv(3)" @input="inputFocusEv(3)" placeholder="请输入密码" placeholder-class="col9" />
|
||||
<view class="clear-box" v-show="ifPassword" @tap="clearInput(3)" style="right: 20rpx;"><view class="clear-close"><span></span><span></span></view></view>
|
||||
</view>
|
||||
<!-- 单位名称 -->
|
||||
<view class="login-input-box">
|
||||
<view style="width: 30rpx;">
|
||||
<image style="width: 26rpx;height: 26rpx;" src="/static/public/icon-unit.png" mode=""></image>
|
||||
</view>
|
||||
<input class="width100" type="text" v-model="login_unitName" @blur="inputBlurEv(2)" @focus="inputFocusEv(2)" @input="inputFocusEv(2)" placeholder="请输入单位名称" placeholder-class="col9" />
|
||||
<!-- 清除按钮 -->
|
||||
<view class="clear-box" v-show="ifunitName" @tap="clearInput(2)" style="right: 20rpx;"><view class="clear-close"><span></span><span></span></view></view>
|
||||
</view>
|
||||
<!-- 登入 -->
|
||||
<view class="login-btn fon32" @tap="submitEv">登录</view>
|
||||
<!-- 使用账号密码登录、忘记密码 -->
|
||||
<view class="fon24 disjbac mar-s20">
|
||||
<view @tap="switchType">使用{{login_type_text}}登录</view>
|
||||
<view class="col9" @tap="goForget">忘记密码?</view>
|
||||
</view>
|
||||
<!-- 注册工程师 -->
|
||||
<view @tap="goRegister" class="login-btn fon24 mar-s70" style="background-color: #f0f0f0;color: #333333;">注册工程师</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import containerSubgroupTwo from '@/components/containers/container-subgroup-two.vue';
|
||||
export default {
|
||||
components:{
|
||||
containerSubgroupTwo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
windowHeight: uni.getSystemInfoSync().windowHeight,
|
||||
ifPhone:false,
|
||||
login_phone:'',//登录手机号
|
||||
ifCode:false,
|
||||
login_code:'',//登录验证码
|
||||
ifunitName:false,
|
||||
login_unitName:'',//登录单位名称
|
||||
ifPassword:false,
|
||||
login_password:'',//登录密码
|
||||
codeText:'获取验证码' ,// 获取验证码按钮文字
|
||||
flagCode:true ,// 允许点击获取验证码
|
||||
countDown:null,
|
||||
login_type:'mobile',// 登录方式默认手机验证码登录 account：账号密码登陆
|
||||
login_type_text:'账号密码'
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
// 提交事件
|
||||
submitEv(){
|
||||
if(this.checkEmpty()){
|
||||
let params = {
|
||||
login_type: this.login_type, // 登陆手机类型： mobile：手机登陆、account：账号密码登陆
|
||||
phone: this.login_type == 'mobile' ? this.login_phone : '', // 手机号码，login_type 为 mobile 时必填
|
||||
password: this.login_password, // 密码，login_type 为 account 时必填
|
||||
sms_code: this.login_code, // 短信验证码，login_type 为 mobile 时必填
|
||||
username: this.login_type == 'account' ? this.login_phone : '', //账号，login_type 为 account 时必填
|
||||
affiliation: this.login_unitName // 单位名称
|
||||
}
|
||||
this.$requst.post('/universal/api.login/login',params).then(res=>{
|
||||
if(res.code==1) {
|
||||
this.$toolAll.tools.showToast('登录成功');
|
||||
// 缓存token和角色类型
|
||||
uni.setStorageSync('token',res.data.token);
|
||||
// 角色(1：业务员、2：客户、3：客服、4：工程师)
|
||||
uni.setStorageSync('type_id',res.data.type_id);
|
||||
setTimeout(()=>{
|
||||
uni.reLaunch({
|
||||
url:'/pages/tabbar/pagehome/pagehome'
|
||||
})
|
||||
},2000)
|
||||
} else {
|
||||
this.$toolAll.tools.showToast(res.msg);
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
// 获取验证码
|
||||
getCode(){
|
||||
if(this.$toolAll.tools.isPhone(this.login_phone)) {
|
||||
this.$toolAll.tools.showToast('请输入正确的手机号');
|
||||
} else {
|
||||
if(this.flagCode) {
|
||||
this.flagCode = false;
|
||||
let count = 60;
|
||||
this.codeText = `${count}S重新获取`
|
||||
this.countDown = setInterval(()=>{
|
||||
count--;
|
||||
count < 10 ? this.codeText = `0${count}S重新获取` : this.codeText = `${count}S重新获取`;
|
||||
if(count==0) {
|
||||
this.codeText = `重新获取`;
|
||||
clearInterval(this.countDown);
|
||||
this.flagCode = true;
|
||||
}
|
||||
},1000)
|
||||
// 调用获取短信事件
|
||||
this.getMessage(this.login_phone);
|
||||
}
|
||||
}
|
||||
},
|
||||
// 获取短信事件
|
||||
getMessage(phone){
|
||||
this.$requst.post('/universal/api.login/send_sms',{phone}).then(res=>{
|
||||
this.$toolAll.tools.showToast(res.msg);
|
||||
if(res.code==0) {
|
||||
this.codeText = '获取验证码';
|
||||
clearInterval(this.countDown);
|
||||
}
|
||||
})
|
||||
},
|
||||
// 检测是否某个输入框为空
|
||||
checkEmpty(){
|
||||
let ifEmpty = true;
|
||||
if(this.$toolAll.tools.isPhone(this.login_phone)) {
|
||||
this.$toolAll.tools.showToast('手机号格式不正确');
|
||||
ifEmpty = false;
|
||||
return;
|
||||
}
|
||||
if(this.login_type_text=='账号密码') {
|
||||
if(!this.login_code) {
|
||||
this.$toolAll.tools.showToast('请输入验证码');
|
||||
ifEmpty = false;
|
||||
return;
|
||||
}
|
||||
} else {
|
||||
if(!this.login_password) {
|
||||
this.$toolAll.tools.showToast('请输入密码');
|
||||
ifEmpty = false;
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
if(!this.login_unitName) {
|
||||
this.$toolAll.tools.showToast('请输入单位名称');
|
||||
ifEmpty = false;
|
||||
return;
|
||||
}
|
||||
return ifEmpty;
|
||||
},
|
||||
// 输入框获取焦点
|
||||
inputFocusEv(index){
|
||||
switch (index){
|
||||
case 0:
|
||||
this.login_phone ? this.ifPhone = true : this.ifPhone = false;
|
||||
break;
|
||||
case 1:
|
||||
this.login_code ? this.ifCode = true : this.ifCode = false;
|
||||
break;
|
||||
case 2:
|
||||
this.login_unitName ? this.ifunitName = true : this.ifunitName = false;
|
||||
break;
|
||||
case 3:
|
||||
this.login_password ? this.ifPassword = true : this.ifPassword = false;
|
||||
break;
|
||||
}
|
||||
},
|
||||
// 输入框失去焦点
|
||||
inputBlurEv(index){
|
||||
switch (index){
|
||||
case 0:
|
||||
setTimeout(()=>{this.ifPhone = false;},100)
|
||||
break;
|
||||
case 1:
|
||||
setTimeout(()=>{this.ifCode = false;},100)
|
||||
break;
|
||||
case 2:
|
||||
setTimeout(()=>{this.ifunitName = false;},100)
|
||||
break;
|
||||
case 3:
|
||||
setTimeout(()=>{this.ifPassword = false;},100)
|
||||
break;
|
||||
}
|
||||
},
|
||||
// 清除手机号
|
||||
clearInput(index){
|
||||
switch (index){
|
||||
case 0:
|
||||
this.login_phone = '';
|
||||
break;
|
||||
case 1:
|
||||
this.login_code = '';
|
||||
break;
|
||||
case 2:
|
||||
this.login_unitName = '';
|
||||
break;
|
||||
case 3:
|
||||
this.login_password = '';
|
||||
break;
|
||||
}
|
||||
},
|
||||
// 切换登录方式
|
||||
switchType(){
|
||||
if(this.login_type_text=="账号密码") {
|
||||
this.login_type = 'account';
|
||||
this.login_type_text = '验证码';
|
||||
this.login_code = '';
|
||||
} else {
|
||||
this.login_type = 'mobile';
|
||||
this.login_type_text = '账号密码';
|
||||
this.login_password = '';
|
||||
}
|
||||
},
|
||||
// 前往注册页面
|
||||
goRegister(){
|
||||
uni.navigateTo({
|
||||
url:'/pages/register/register'
|
||||
})
|
||||
},
|
||||
// 前往找回密码页面
|
||||
goForget(){
|
||||
uni.navigateTo({
|
||||
url:'/pages/forget/forget'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
page{background-color: #FFFFFF;}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,279 @@
|
|||
<template>
|
||||
<view>
|
||||
<status-nav-slot>
|
||||
<view slot="leftContent" @tap="goLogin"><image class="register-close" src="/static/public/icon-close.png" mode="widthFix" lazy-load></image></view>
|
||||
<view slot="rightContent" @tap="goLogin">登录</view>
|
||||
</status-nav-slot>
|
||||
<container-subgroup-two>
|
||||
<view slot="content">
|
||||
<view class="disjcac">
|
||||
<image src="/static/public/icon-register.png" mode="widthFix" lazy-load></image>
|
||||
</view>
|
||||
<view class="register-title line-h56">
|
||||
<view class="fon40 bold">注册</view>
|
||||
<view class="fon28">欢迎来到飞猴云服务平台</view>
|
||||
</view>
|
||||
<view class="fon24">
|
||||
<!-- 手机号 -->
|
||||
<view class="disac mar-s30">
|
||||
<view class="disac fon30">+86 <view class="register-phone-img"></view></view>
|
||||
<view class="posir width100">
|
||||
<input @blur="inputBlurEv(0)" @focus="inputFocusEv(0)" @input="inputFocusEv(0)" class="clear-input" type="number" maxlength="11" v-model="register_phone" placeholder="请输入手机号" placeholder-class="placeholderColor" />
|
||||
<!-- 清除按钮 -->
|
||||
<view class="clear-box" v-show="ifPhone" @tap="clearInput(0)"><view class="clear-close"><span></span><span></span></view></view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 验证码 -->
|
||||
<view class="disjbac mar-s50">
|
||||
<view class="posir width100">
|
||||
<input @blur="inputBlurEv(1)" @focus="inputFocusEv(1)" @input="inputFocusEv(1)" class="clear-input" type="number" maxlength="6" v-model="register_code" placeholder="请输入验证码" placeholder-class="placeholderColor" />
|
||||
<!-- 清除按钮 -->
|
||||
<view class="clear-box" v-show="ifCode" @tap="clearInput(1)"><view class="clear-close"><span></span><span></span></view></view>
|
||||
</view>
|
||||
<!-- 获取验证码按钮 -->
|
||||
<view class="obtain-code" :class="!flagCode ? 'obtainIng' : ''" @tap="getCode">{{codeText}}</view>
|
||||
</view>
|
||||
<!-- 密码 -->
|
||||
<view class="disjbac mar-s50">
|
||||
<view class="posir width100">
|
||||
<input @blur="inputBlurEv(2)" @focus="inputFocusEv(2)" @input="inputFocusEv(2)" class="clear-input" type="text" password maxlength="16" v-model="register_password" placeholder="请输入密码" placeholder-class="placeholderColor" />
|
||||
<!-- 清除按钮 -->
|
||||
<view class="clear-box" v-show="ifPassword" @tap="clearInput(2)"><view class="clear-close"><span></span><span></span></view></view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 确认密码 -->
|
||||
<view class="disjbac mar-s50">
|
||||
<view class="posir width100">
|
||||
<input @blur="inputBlurEv(3)" @focus="inputFocusEv(3)" @input="inputFocusEv(3)" class="clear-input" type="text" password maxlength="16" v-model="register_qpassword" placeholder="请再次确认密码" placeholder-class="placeholderColor" />
|
||||
<!-- 清除按钮 -->
|
||||
<view class="clear-box" v-show="ifqpssword" @tap="clearInput(3)"><view class="clear-close"><span></span><span></span></view></view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 单位名称 -->
|
||||
<view class="disjbac mar-s50">
|
||||
<view class="posir width100">
|
||||
<input @blur="inputBlurEv(4)" @focus="inputFocusEv(4)" @input="inputFocusEv(4)" class="clear-input" type="text" v-model="register_unitName" placeholder="请输入单位名称" placeholder-class="placeholderColor" />
|
||||
<!-- 清除按钮 -->
|
||||
<view class="clear-box" v-show="ifunitName" @tap="clearInput(4)"><view class="clear-close"><span></span><span></span></view></view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 协议、政策 -->
|
||||
<view class="disac mar-s50">
|
||||
<label class="radio disac col9" @tap="chooseXY">
|
||||
<radio class="register-radio" color="#03affb" :checked="ifAgreen"/><view>我已阅读并同意 <text @tap.stop="goXY(0)" class="register-agree-policy">《飞猴用户服务协议》</text>和 <text @tap.stop="goXY(1)" class="register-agree-policy">《飞猴隐私政策》</text></view>
|
||||
</label>
|
||||
</view>
|
||||
<!-- 免费注册 -->
|
||||
<view class="register-btn" @tap="submitEv">免费注册</view>
|
||||
</view>
|
||||
</view>
|
||||
</container-subgroup-two>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import statusNavSlot from '@/components/status-navs/status-nav-slot.vue';
|
||||
import containerSubgroupTwo from '@/components/containers/container-subgroup-two.vue';
|
||||
export default {
|
||||
components:{
|
||||
statusNavSlot,
|
||||
containerSubgroupTwo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
ifPhone:false, // 是否显示手机号清空按钮
|
||||
register_phone:'', // 注册时的手机号
|
||||
ifCode:false,
|
||||
register_code:'', // 注册时的验证码
|
||||
ifPassword:false,
|
||||
register_password:'', // 注册时的密码
|
||||
ifqpssword:false,
|
||||
register_qpassword:'', // 注册时的确认密码
|
||||
ifunitName:false,
|
||||
register_unitName:'', // 注册时的单位名称
|
||||
ifAgreen:false ,// 注册时是否勾选协议与政策
|
||||
codeText:'获取验证码' ,// 获取验证码按钮文字
|
||||
flagCode:true ,// 允许点击获取验证码
|
||||
countDown:null//验证码倒计时事件
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 提交事件
|
||||
submitEv(){
|
||||
if(this.checkEmpty()){
|
||||
let params = {
|
||||
phone: this.register_phone, // 手机号码
|
||||
sms_code:this.register_code, // 短信验证码
|
||||
password: this.register_password, // 密码
|
||||
confirm_password: this.register_qpassword, // 确认密码
|
||||
affiliation: this.register_unitName //单位名称
|
||||
}
|
||||
this.$requst.post('/universal/api.login/register',params).then(res=>{
|
||||
if(res.code==1) {
|
||||
this.$toolAll.tools.showToast('注册成功');
|
||||
setTimeout(()=>{
|
||||
// 调用前往登录页
|
||||
this.goLogin();
|
||||
},1000)
|
||||
} else {
|
||||
this.$toolAll.tools.showToast(res.msg);
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
// 获取验证码
|
||||
getCode(){
|
||||
if(this.$toolAll.tools.isPhone(this.register_phone)) {
|
||||
this.$toolAll.tools.showToast('请输入正确的手机号');
|
||||
} else {
|
||||
if(this.flagCode) {
|
||||
this.flagCode = false;
|
||||
let count = 60;
|
||||
this.codeText = `${count}S重新获取`
|
||||
this.countDown = setInterval(()=>{
|
||||
count--;
|
||||
count < 10 ? this.codeText = `0${count}S重新获取` : this.codeText = `${count}S重新获取`;
|
||||
if(count==0) {
|
||||
this.codeText = `重新获取`;
|
||||
clearInterval(this.countDown);
|
||||
this.flagCode = true;
|
||||
}
|
||||
},1000)
|
||||
// 调用获取短信事件
|
||||
this.getMessage(this.register_phone);
|
||||
}
|
||||
}
|
||||
},
|
||||
// 获取短信事件
|
||||
getMessage(phone){
|
||||
this.$requst.post('/universal/api.login/send_sms',{phone}).then(res=>{
|
||||
this.$toolAll.tools.showToast(res.msg);
|
||||
if(res.code==0) {
|
||||
clearInterval(this.countDown);
|
||||
this.codeText = `获取验证码`
|
||||
this.flagCode = true;
|
||||
}
|
||||
})
|
||||
},
|
||||
// 检测是否某个输入框为空
|
||||
checkEmpty(){
|
||||
let ifEmpty = true;
|
||||
if(this.$toolAll.tools.isPhone(this.register_phone)) {
|
||||
this.$toolAll.tools.showToast('手机号格式不正确');
|
||||
ifEmpty = false;
|
||||
return;
|
||||
}
|
||||
if(!this.register_code) {
|
||||
this.$toolAll.tools.showToast('请输入验证码');
|
||||
ifEmpty = false;
|
||||
return;
|
||||
}
|
||||
if(!this.register_password) {
|
||||
this.$toolAll.tools.showToast('密码不能为空');
|
||||
ifEmpty = false;
|
||||
return;
|
||||
}
|
||||
if(!this.register_qpassword) {
|
||||
this.$toolAll.tools.showToast('确认密码不能为空');
|
||||
ifEmpty = false;
|
||||
return;
|
||||
}
|
||||
if(this.register_password != this.register_qpassword) {
|
||||
this.$toolAll.tools.showToast('两次输入的密码必须相同');
|
||||
ifEmpty = false;
|
||||
return;
|
||||
}
|
||||
if(!this.register_unitName) {
|
||||
this.$toolAll.tools.showToast('请输入单位名称');
|
||||
ifEmpty = false;
|
||||
return;
|
||||
}
|
||||
if(!this.ifAgreen) {
|
||||
this.$toolAll.tools.showToast('请勾选协议与政策');
|
||||
ifEmpty = false;
|
||||
return;
|
||||
}
|
||||
return ifEmpty;
|
||||
},
|
||||
// 关闭当前页返回到登录页
|
||||
goLogin(){
|
||||
uni.navigateBack({delta:1})
|
||||
},
|
||||
// 输入框获取焦点
|
||||
inputFocusEv(index){
|
||||
switch (index){
|
||||
case 0:
|
||||
this.register_phone ? this.ifPhone = true : this.ifPhone = false;
|
||||
break;
|
||||
case 1:
|
||||
this.register_code ? this.ifCode = true : this.ifCode = false;
|
||||
break;
|
||||
case 2:
|
||||
this.register_password ? this.ifPassword = true : this.ifPassword = false;
|
||||
break;
|
||||
case 3:
|
||||
this.register_qpassword ? this.ifqpssword = true : this.ifqpssword = false;
|
||||
break;
|
||||
case 4:
|
||||
this.register_unitName ? this.ifunitName = true : this.ifunitName = false;
|
||||
break;
|
||||
}
|
||||
},
|
||||
// 输入框失去焦点
|
||||
inputBlurEv(index){
|
||||
switch (index){
|
||||
case 0:
|
||||
setTimeout(()=>{this.ifPhone = false;},100)
|
||||
break;
|
||||
case 1:
|
||||
setTimeout(()=>{this.ifCode = false;},100)
|
||||
break;
|
||||
case 2:
|
||||
setTimeout(()=>{this.ifPassword = false;},100)
|
||||
break;
|
||||
case 3:
|
||||
setTimeout(()=>{this.ifqpssword = false;},100)
|
||||
break;
|
||||
case 4:
|
||||
setTimeout(()=>{this.ifunitName = false;},100)
|
||||
break;
|
||||
}
|
||||
},
|
||||
// 清除手机号
|
||||
clearInput(index){
|
||||
switch (index){
|
||||
case 0:
|
||||
this.register_phone = '';
|
||||
console.log(this.register_phone);
|
||||
break;
|
||||
case 1:
|
||||
this.register_code = '';
|
||||
break;
|
||||
case 2:
|
||||
this.register_password = '';
|
||||
break;
|
||||
case 3:
|
||||
this.register_qpassword = '';
|
||||
break;
|
||||
case 4:
|
||||
this.register_unitName = '';
|
||||
break;
|
||||
}
|
||||
},
|
||||
// 勾选协议
|
||||
chooseXY(){
|
||||
this.ifAgreen = !this.ifAgreen;
|
||||
},
|
||||
// 前往协议或政策
|
||||
goXY(index){
|
||||
uni.navigateTo({
|
||||
url:`/pages/login/agreement?type=${index}`
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
<template>
|
||||
<view>
|
||||
<!-- 底部tab -->
|
||||
<foot-tab :current="3"></foot-tab>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// 底部组件
|
||||
import footTabOne from '@/components/foot-tabs/foot-tab-one.vue';
|
||||
export default {
|
||||
components:{
|
||||
'foot-tab' :footTabOne
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,183 @@
|
|||
<template>
|
||||
<view class="pad-x180">
|
||||
<status-nav-slot :backgroudColor="backgroudColor">
|
||||
<!-- <view slot="leftContent"><i class="icon icon-return fon40" :style="{color:newColor}"></i></view> -->
|
||||
<view slot="leftContent" style="width: 30rpx;"></view>
|
||||
<view slot="centerContent"><view :style="{color:newColor}">个人中心</view></view>
|
||||
<!-- #ifdef APP-PLUS -->
|
||||
<view slot="rightContent" @tap="goSetUp"><i class="icon icon-sandian fon40" :style="{color:newColor}"></i></view>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef H5 -->
|
||||
<view slot="rightContent" @tap="goSetUp"><i class="icon icon-sandian fon40" :style="{color:newColor}"></i></view>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<view slot="rightContent" style="width: 30rpx;"></view>
|
||||
<!-- #endif -->
|
||||
</status-nav-slot>
|
||||
<view class="posir" style="background: url(/static/public/icon-my-logo.png) no-repeat;background-size: 100% auto;" :style="{paddingTop: newHeight + 'px'}">
|
||||
<!-- <image src="/static/public/icon-my-logo.png" class="width100" mode="widthFix" lazy-load></image> -->
|
||||
<view class="mar-zy40">
|
||||
<view style="background: url(../../../static/public/icon-my-head.png) no-repeat;height: 400rpx;background-size: 100% 100%;">
|
||||
<view class="disjbac" style="padding: 60rpx 80rpx 60rpx 60rpx;">
|
||||
<view class="disac">
|
||||
<image class="flexs mar-y10" src="/static/public/icon-my-headimg.png" mode="aspectFill" style="width: 91rpx;height: 91rpx;" lazy-load></image>
|
||||
<view class="disjb fc" style="height: 91rpx;">
|
||||
<view class="fon34 bold">156****0510</view>
|
||||
<view class="fon22" style="color: #717171;">未实名认证</view>
|
||||
</view>
|
||||
</view>
|
||||
<image src="/static/public/icon-my-level.png" mode="aspectFill" style="width: 49rpx;height: 76rpx;" lazy-load></image>
|
||||
</view>
|
||||
<!-- 信用分、项目数量、未评价 -->
|
||||
<view class="disja pad-zy40">
|
||||
<view v-for="(item,index) in headList" :key="index" class="disjcac fc">
|
||||
<view style="height: 50rpx;" class="disjcac">
|
||||
<image :src="item.imgsrc" :style="{width: [49,49,46][index] + 'rpx',height: [50,50,42][index] + 'rpx'}" mode="widthFix" lazy-load></image>
|
||||
</view>
|
||||
<view class="fon24 col9 mar-sx10">{{item.title}}</view>
|
||||
<view class="fon36 bold">{{item.num}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 预约及时率、上门准时率、项目报修率 -->
|
||||
<view class="disja mar-s20">
|
||||
<view v-for="(item,index) in percentageList" :key="index" class="disjcac fc col3">
|
||||
<!-- <cmd-progress type="circle" :percent="item.num" :width="60" :stroke-color="['#00a2e9','#e87c00','#0b56ec'][index]" :circleStrokeColor="['#c6e6f5','#f4dfc6','#c8d7f5'][index]" :strokeShape="'square'"></cmd-progress> -->
|
||||
<arprogress :percent="item.num"
|
||||
:inactiveColor="['#c6e6f5','#f4dfc6','#c8d7f5'][index]"
|
||||
:activeColor="['#00a2e9','#e87c00','#0b56ec'][index]"
|
||||
:borderWidth="7.8"
|
||||
:width="120"
|
||||
:duration="500"
|
||||
bgColor="transparent"><text :style="{color: ['#00a2e9','#e87c00','#0b56ec'][index]}">{{item.num}}%</text></arprogress>
|
||||
<view class="fon24 mar-s20">{{item.title}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 六宫格 -->
|
||||
<view class="disjbac fw bacf" style="margin: 30rpx -20rpx 0rpx -20rpx;">
|
||||
<view @tap="chooseGridEv(index)" class="disjcac fc width50 pad-sx40" v-for="(item,index) in gridList" :key="index" :class="[`${(index%2!=0) ? 'bleft' : ''} ${(index < gridList.length-2) ? 'bbot' : ''}`]" style="box-sizing: border-box;">
|
||||
<image :src="item.imgsrc" mode="widthFix" lazy-load :style="{width: [52,52,46,50,46,52][index] + 'rpx',height: [48,45,52,52,53,52][index] + 'rpx'}"></image>
|
||||
<view class="fon26 col3 mar-s20">{{item.title}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 退出登录 -->
|
||||
<view class="my-exit-btn" @tap="logOutEv">退出登录</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 底部tab -->
|
||||
<foot-tab :current='4'></foot-tab>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import statusNavSlot from '@/components/status-navs/status-nav-slot.vue';
|
||||
// 进度条
|
||||
import cmdProgress from '@/components/cmd-progress/cmd-progress.vue';
|
||||
// 底部组件
|
||||
import footTabOne from '@/components/foot-tabs/foot-tab-one.vue';
|
||||
import arprogress from '@/components/ar-circle-progress/index.vue'
|
||||
export default {
|
||||
components:{statusNavSlot,cmdProgress,'foot-tab' :footTabOne,arprogress},
|
||||
data() {
|
||||
return {
|
||||
newHeight: uni.getSystemInfoSync().statusBarHeight + 50,
|
||||
backgroudColor:'rgba(255,255,255,0)',
|
||||
newColor:'rgba(255,255,255,1)',
|
||||
headList:[
|
||||
{imgsrc:'/static/public/icon-my-creditScore.png',title:'信用分',num:0},
|
||||
{imgsrc:'/static/public/icon-my-projectNum.png',title:'项目数量',num:0},
|
||||
{imgsrc:'/static/public/icon-my-notEvaluated.png',title:'未评价',num:0},
|
||||
],
|
||||
percentageList:[
|
||||
{title:'预约及时率',num:100},
|
||||
{title:'上门准时率',num:60},
|
||||
{title:'项目报修率',num:40},
|
||||
],
|
||||
gridList:[
|
||||
{imgsrc:'/static/public/icon-my-information.png',title:'个人信息'},
|
||||
{imgsrc:'/static/public/icon-my-certificates.png',title:'电子证件'},
|
||||
{imgsrc:'/static/public/icon-my-service.png',title:'服务范围'},
|
||||
{imgsrc:'/static/public/icon-my-evaluate.png',title:'我要评价'},
|
||||
{imgsrc:'/static/public/icon-my-account.png',title:'我的账户'},
|
||||
{imgsrc:'/static/public/icon-my-set.png',title:'设置'},
|
||||
]
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
// 查询用户信息
|
||||
// this.checkInfo();
|
||||
},
|
||||
onPageScroll(e) {
|
||||
let navHeight = uni.getSystemInfoSync().statusBarHeight + 50;
|
||||
this.backgroudColor = `rgba(255,255,255,${e.scrollTop/navHeight})`;
|
||||
if(e.scrollTop/navHeight < 0.5) {
|
||||
this.newColor = `#FFFFFF`;
|
||||
} else {
|
||||
this.newColor = `#000000`;
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
// 禁止分享
|
||||
this.$toolAll.tools.disableShareEv();
|
||||
},
|
||||
methods: {
|
||||
// 退出登录
|
||||
logOutEv(){
|
||||
this.$requst.post('/universal/api.login/signout').then(res=>{
|
||||
if(res.code==1) {
|
||||
this.$toolAll.tools.showToast('退出成功');
|
||||
// 清除所有缓存
|
||||
uni.clearStorageSync();
|
||||
// 配置全局域名
|
||||
// #ifdef APP-PLUS
|
||||
uni.setStorageSync('hostapi','http://maintain.7and5.cn');
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
uni.setStorageSync('hostapi','/web');
|
||||
// #endif
|
||||
setTimeout(()=>{
|
||||
uni.reLaunch({
|
||||
url:'/pages/login/login'
|
||||
})
|
||||
},1000)
|
||||
}
|
||||
})
|
||||
},
|
||||
checkInfo(){
|
||||
this.$requst.post('/api/user/info').then(res=>{
|
||||
// console.log('用户信息：',res);
|
||||
if(res.code==0 && res.data.length!=0) {
|
||||
this.userInfo = res.data;
|
||||
this.orderStatus[0].num = this.userInfo.order_count.waiting;//待付款
|
||||
this.orderStatus[1].num = this.userInfo.order_count.paid;//待发货
|
||||
this.orderStatus[2].num = this.userInfo.order_count.shipped;//待收货
|
||||
}
|
||||
})
|
||||
},
|
||||
// 六宫格选择事件
|
||||
chooseGridEv(index){
|
||||
let urls = [
|
||||
'/pagesB/personal-information/personal-information',
|
||||
'/pagesB/electronic-certificate/electronic-certificate',
|
||||
'/pagesB/service-range/service-range',
|
||||
'/pagesB/i-want-evaluate/i-want-evaluate',
|
||||
'/pagesB/my-account/my-account',
|
||||
'/pagesB/set-up/set-up',
|
||||
];
|
||||
uni.navigateTo({
|
||||
url:urls[index]
|
||||
})
|
||||
},
|
||||
// 前往设置页面
|
||||
goSetUp(){
|
||||
uni.navigateTo({
|
||||
url:'/pagesB/set-up/set-up'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
page {background-color: #f7f7f7;}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,455 @@
|
|||
<template>
|
||||
<view class="pad-x50">
|
||||
<status-nav-slot>
|
||||
<view slot="leftContent" @tap="goMessage" style="width: 70px;">
|
||||
<view class="home-message-box posir disac">
|
||||
<image src="/static/public/icon-home-message.png" mode=""></image>
|
||||
<view v-if="messageNumber!=0">{{messageNumber}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view slot="centerContent" class="disjcac">
|
||||
<image style="width: 156rpx;height: 38rpx;" src="/static/public/icom-home-logo.png" mode="widthFix"></image>
|
||||
</view>
|
||||
<!-- #ifdef APP-PLUS -->
|
||||
<view slot="rightContent" class="disac" @tap="callEv">
|
||||
<image class="mar-y10" style="width: 26rpx;height: 26rpx;" src="/static/public/icon-home-phone.png" mode=""></image>
|
||||
<view class="fon26 col3">拨打电话</view>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef H5 -->
|
||||
<view slot="rightContent" class="disac" @tap="callEv">
|
||||
<image class="mar-y10" style="width: 26rpx;height: 26rpx;" src="/static/public/icon-home-phone.png" mode=""></image>
|
||||
<view class="fon26 col3">拨打电话</view>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<view slot="rightContent" @tap="goMessage" style="width: 70px;"></view>
|
||||
<!-- #endif -->
|
||||
</status-nav-slot>
|
||||
<!-- <view :style="{paddingTop: statusHeight +'px'}"> -->
|
||||
<!-- banner图 -->
|
||||
<container-subgroup-two>
|
||||
<view slot="content" style="margin: 0 -30rpx;">
|
||||
<image class="width100" src="/static/public/icon-home-banner.png" mode="widthFix"></image>
|
||||
<view class="pad-zy20">
|
||||
<!-- 项目总数、实时故障、公告 -->
|
||||
<view class="project-notice-box">
|
||||
<view class="disjcac pad-sx20 bbot">
|
||||
<view class="disjcac fc width50">
|
||||
<view class="fon26 col9">项目总数</view>
|
||||
<view class="fon60 bold">126</view>
|
||||
</view>
|
||||
<view class="bleft" style="height: 90rpx;"></view>
|
||||
<view class="disjcac fc width50">
|
||||
<view class="fon26 col9">实时故障</view>
|
||||
<view class="fon60 bold">116</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="disac pad-s30 pad-x10">
|
||||
<image class="mar-zy20" style="width: 64rpx;height: 27rpx;" src="/static/public/icon-home-notice.png" mode=""></image>
|
||||
<view class="fon24 color6 mar-y20 width100 bleft pad-z20">
|
||||
<lwNotice @dangGao="goNoticeDetail" :list="noticeList" :backgroundColor="'#FFFFFF'"></lwNotice>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 客户可见 -->
|
||||
<view v-if="role==2 || role==1">
|
||||
<!-- 故障报修 -->
|
||||
<view class="home-fun-box">
|
||||
<view class="fun-title col3 fon28 disac bold">故障报修</view>
|
||||
<view class="disac mar-s30">
|
||||
<view @tap="goFaultRepair(index)" class="disjcac fc width25" v-for="(item,index) in repairList" :key="index">
|
||||
<image :style="{width: [58,58,50][index]+'rpx',height:[53,56,58][index] + 'rpx'}" style="width: 58rpx;height: 53rpx;" :src="item.imgsrc" mode="widthFix"></image>
|
||||
<view class="fon24 col3 mar-s10">{{item.title}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 数据查询 -->
|
||||
<view class="home-fun-box" v-if="role==1">
|
||||
<view class="fun-title col3 fon28 disac bold">数据查询</view>
|
||||
<view class="disac mar-s30">
|
||||
<view @tap="dataQueryEv(index)" class="disjcac fc width25" v-for="(item,index) in dataQueryList" :key="index">
|
||||
<view class="posir">
|
||||
<image :style="{width: [58,58,58][index]+'rpx',height:[46,56,50][index] + 'rpx'}" style="width: 58rpx;height: 53rpx;" :src="item.imgsrc" mode="widthFix"></image>
|
||||
<view class="engineer-num" v-if="item.num!=0">{{item.num}}</view>
|
||||
</view>
|
||||
<view class="fon24 col3 mar-s10">{{item.title}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 增值服务 -->
|
||||
<view class="home-fun-box">
|
||||
<view class="fun-title col3 fon28 disac bold">增值服务</view>
|
||||
<view class="disac mar-s30">
|
||||
<view @tap="goIncrement(index)" class="disjcac fc width25" v-for="(item,index) in incrementList" :key="index">
|
||||
<image :style="{width: [57,52,58,51][index]+'rpx',height:[56,56,50,56][index] + 'rpx'}" style="width: 58rpx;height: 53rpx;" :src="item.imgsrc" mode="widthFix"></image>
|
||||
<view class="fon24 col3 mar-s10">{{item.title}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 工程师可见 -->
|
||||
<view v-if="role==4 || role==3">
|
||||
<!-- 项目维修 -->
|
||||
<view class="home-fun-box" v-if="role==4">
|
||||
<view class="fun-title col3 fon28 disac bold">项目维修</view>
|
||||
<view class="disac mar-s30">
|
||||
<view class="disjcac fc width25" v-for="(item,index) in projectRepairList" :key="index">
|
||||
<view class="posir">
|
||||
<image :style="{width: [53,52,51][index]+'rpx',height:[58,58,58][index] + 'rpx'}" style="width: 58rpx;height: 53rpx;" :src="item.imgsrc" mode="widthFix"></image>
|
||||
<view class="engineer-num" v-if="item.num!=0">{{item.num}}</view>
|
||||
</view>
|
||||
<view class="fon24 col3 mar-s10">{{item.title}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="role==3">
|
||||
<!-- 待办工单 -->
|
||||
<view class="home-fun-box">
|
||||
<view class="fun-title col3 fon28 disac bold">待办工单</view>
|
||||
<view class="disac mar-s30">
|
||||
<view class="disjcac fc width25" v-for="(item,index) in stayWorkOrderList" :key="index">
|
||||
<view class="posir">
|
||||
<image :style="{width: [53,48,51,58][index]+'rpx',height:[58,58,58,53][index] + 'rpx'}" style="width: 58rpx;height: 53rpx;" :src="item.imgsrc" mode="widthFix"></image>
|
||||
<view class="engineer-num" v-if="item.num!=0">{{item.num}}</view>
|
||||
</view>
|
||||
<view class="fon24 col3 mar-s10">{{item.title}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 待办事件 -->
|
||||
<view class="home-fun-box">
|
||||
<view class="fun-title col3 fon28 disac bold">待办事件</view>
|
||||
<view class="disac mar-s30">
|
||||
<view class="disjcac fc width25" v-for="(item,index) in stayEventList" :key="index">
|
||||
<view class="posir">
|
||||
<image :style="{width: [58,58,50][index]+'rpx',height:[58,54,58][index] + 'rpx'}" style="width: 58rpx;height: 53rpx;" :src="item.imgsrc" mode="widthFix"></image>
|
||||
<view class="engineer-num" v-if="item.num!=0">{{item.num}}</view>
|
||||
</view>
|
||||
<view class="fon24 col3 mar-s10">{{item.title}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 工单数据 -->
|
||||
<view class="home-fun-box">
|
||||
<view class="fun-title col3 fon28 disac bold">工单数据</view>
|
||||
<view class="disac mar-s30">
|
||||
<view class="disjcac fc width25" @click="goWorkOrder(index)" v-for="(item,index) in workOrderList" :key="index">
|
||||
<view class="posir">
|
||||
<image :style="{width: [59,56,58,58][index]+'rpx',height:[49,58,58,60][index] + 'rpx'}" style="width: 58rpx;height: 53rpx;" :src="item.imgsrc" mode="widthFix"></image>
|
||||
<view class="engineer-num" v-if="item.num!=0">{{item.num}}</view>
|
||||
</view>
|
||||
<view class="fon24 col3 mar-s10">{{item.title}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 数据查询 -->
|
||||
<view class="home-fun-box" v-if="role==3">
|
||||
<view class="fun-title col3 fon28 disac bold">数据查询</view>
|
||||
<view class="disac mar-s30">
|
||||
<view @tap="dataQueryEv(index)" class="disjcac fc width25" v-for="(item,index) in dataQueryList" :key="index">
|
||||
<view class="posir">
|
||||
<image :style="{width: [58,58,58][index]+'rpx',height:[46,56,50][index] + 'rpx'}" style="width: 58rpx;height: 53rpx;" :src="item.imgsrc" mode="widthFix"></image>
|
||||
<view class="engineer-num" v-if="item.num!=0">{{item.num}}</view>
|
||||
</view>
|
||||
<view class="fon24 col3 mar-s10">{{item.title}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 结算情况 -->
|
||||
<view class="home-fun-box" v-if="role==4">
|
||||
<view class="fun-title col3 fon28 disac bold">结算情况</view>
|
||||
<view class="disac mar-s30">
|
||||
<view class="disjcac fc width25" v-for="(item,index) in settlementList" :key="index">
|
||||
<view class="posir">
|
||||
<image :style="{width: [58,50,58][index]+'rpx',height:[54,58,58][index] + 'rpx'}" style="width: 58rpx;height: 53rpx;" :src="item.imgsrc" mode="widthFix"></image>
|
||||
<view class="engineer-num" v-if="item.num!=0">{{item.num}}</view>
|
||||
</view>
|
||||
<view class="fon24 col3 mar-s10">{{item.title}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 其他 -->
|
||||
<view class="home-fun-box">
|
||||
<view class="fun-title col3 fon28 disac bold">其他</view>
|
||||
<view class="disac mar-s30">
|
||||
<view @tap="otherEv(index)" class="disjcac fc width25" v-for="(item,index) in otherList" :key="index">
|
||||
<image :style="{width: [58,49,58][index]+'rpx',height:[51,58,55][index] + 'rpx'}" style="width: 58rpx;height: 53rpx;" :src="item.imgsrc" mode="widthFix"></image>
|
||||
<view class="fon24 col3 mar-s10">{{item.title}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 解决方案 -->
|
||||
<view class="home-solution mar-x20 pad30">
|
||||
<view class="disjbac" @tap="goPlant(0)">
|
||||
<view>
|
||||
<view class="fon30 bold" style="color: #00a2e9;">畅想智能-场景化设计</view>
|
||||
<view class="fon34 bold col3 mar-s10">解决方案<text class="col9 mar-z10">Solution</text></view>
|
||||
</view>
|
||||
<image style="width: 50rpx;height: 50rpx;" src="/static/public/icon-home-solution.png" mode=""></image>
|
||||
</view>
|
||||
<view class="mar-s30">
|
||||
<scroll-view scroll-x>
|
||||
<view :class="solutionList.length == 4 ? 'disjbac' : 'disac'">
|
||||
<view @tap="goDetail(0,item.id)" class="posir flexs" v-for="(item,index) in solutionList" :key="index" style="width: 23%;height: 214rpx;" :style="{marginRight: solutionList.length != 4 ? '20rpx' : ''}">
|
||||
<image style="width: 100%;height: 214rpx;" class="radius10 " :src="item.imgsrc" mode="widthFix"></image>
|
||||
<view class="posia solution-title clips1">{{item.title}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 常见故障 -->
|
||||
<view class="bacf mar-zy20 pad-sx30 pad-zy10 radius10">
|
||||
<view class="fon34 bold col3" @tap="goPlant(1)">常见故障<text class="col9 mar-z10">Common faults</text></view>
|
||||
<view @tap="goDetail(1,item.id)" class="pad-sx20 bbot disjb" v-for="(item,index) in faultsList" :key="index">
|
||||
<view class="fon28 line-h38 disjb fc" style="min-height: 160rpx;">
|
||||
<view>
|
||||
<view class="col3 clips1">{{item.title}}</view>
|
||||
<view class="fon22 col6 clips3 mar-sx10">{{item.content}}</view>
|
||||
</view>
|
||||
<view class="col9">{{item.views}}人看过</view>
|
||||
</view>
|
||||
<image class="flexs mar-z20" :src="item.imgsrc" style="width: 280rpx;height: 160rpx;" mode="aspectFill" lazy-load></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</container-subgroup-two>
|
||||
<!-- 底部tab -->
|
||||
<foot-tab></foot-tab>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import statusNavSlot from '@/components/status-navs/status-nav-slot.vue';
|
||||
// 暂无更多组件
|
||||
import pitera from '@/components/nothing/pitera.vue';
|
||||
// 公告
|
||||
import lwNotice from '@/components/lw-notice/lw-notice.vue';
|
||||
import footTabOne from '@/components/foot-tabs/foot-tab-one.vue';
|
||||
import containerSubgroupTwo from '@/components/containers/container-subgroup-two.vue';
|
||||
export default {
|
||||
components:{
|
||||
pitera,
|
||||
statusNavSlot,
|
||||
lwNotice,
|
||||
'foot-tab' :footTabOne,
|
||||
containerSubgroupTwo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
role: 1, // 1：业务员 2:表示客户 3:表示客服 4：表示工程师
|
||||
statusHeight: uni.getSystemInfoSync().statusBarHeight + 50,
|
||||
messageNumber: 16 ,// 消息数量
|
||||
noticeList:['2021年11月06日公司团建，维修服务暂停一天服务暂停一天服务暂停一天。','51akslfj;dkpiojasdjf;j1ij'],//公告
|
||||
// 故障报修
|
||||
repairList:[
|
||||
{imgsrc:'/static/public/icon-home-repair.png',title:'报修'},
|
||||
{imgsrc:'/static/public/icon-home-dealt.png',title:'待办'},
|
||||
{imgsrc:'/static/public/icon-home-urge.png',title:'催一催'},
|
||||
],
|
||||
// 增值服务
|
||||
incrementList:[
|
||||
{imgsrc:'/static/public/icon-home-patrol.png',title:'巡检'},
|
||||
{imgsrc:'/static/public/icon-home-maintain.png',title:'保养'},
|
||||
{imgsrc:'/static/public/icon-home-movingScreen.png',title:'移屏'},
|
||||
{imgsrc:'/static/public/icon-home-screeRemoval.png',title:'拆屏'},
|
||||
],
|
||||
// 其他
|
||||
otherList:[
|
||||
{imgsrc:'/static/public/icon-home-largeScreen.png',title:'故障统计'},
|
||||
{imgsrc:'/static/public/icon-home-reportForm.png',title:'数据看板'},
|
||||
{imgsrc:'/static/public/icon-home-product.png',title:'新产品'},
|
||||
],
|
||||
// 解决方案
|
||||
solutionList:[
|
||||
{imgsrc:'/static/deleteImg/flying-img01.png',title:'控制室解决方案'},
|
||||
{imgsrc:'/static/deleteImg/flying-img02.png',title:'户外屏解决方案'},
|
||||
{imgsrc:'/static/deleteImg/flying-img03.png',title:'会议室解决方案'},
|
||||
{imgsrc:'/static/deleteImg/flying-img04.png',title:'实体店解决方案'},
|
||||
],
|
||||
// 项目维修
|
||||
projectRepairList:[
|
||||
{imgsrc:'/static/public/icon-home-staySingle.png',title:'待接单',num:0},
|
||||
{imgsrc:'/static/public/icon-home-stayImplement.png',title:'待执行',num:99},
|
||||
{imgsrc:'/static/public/icon-home-repairIng.png',title:'维修中',num:6},
|
||||
],
|
||||
// 工单数据
|
||||
workOrderList:[
|
||||
{imgsrc:'/static/public/icon-home-abnormalSingle.png',title:'异常单',num:0},
|
||||
{imgsrc:'/static/public/icon-home-overdueSingle.png',title:'逾期单',num:0},
|
||||
{imgsrc:'/static/public/icon-home-overtime.png',title:'超时单 ',num:0},
|
||||
{imgsrc:'/static/public/icon-home-workOrderPool.png',title:'工单池',num:6,},
|
||||
],
|
||||
// 结算情况
|
||||
settlementList:[
|
||||
{imgsrc:'/static/public/icon-home-stayCollection.png',title:'待收款',num:0},
|
||||
{imgsrc:'/static/public/icon-home-received.png',title:'已收款',num:6},
|
||||
{imgsrc:'/static/public/icon-home-commission.png',title:'佣金',num:0},
|
||||
],
|
||||
// 待办工单
|
||||
stayWorkOrderList:[
|
||||
{imgsrc:'/static/public/icon-home-stayImplement.png',title:'待受理',num:0},
|
||||
{imgsrc:'/static/public/icon-home-stayAssign.png',title:'待指派',num:6},
|
||||
{imgsrc:'/static/public/icon-home-stayRepair.png',title:'待维修',num:6},
|
||||
{imgsrc:'/static/public/icon-home-returnVisit.png',title:'待回访',num:0},
|
||||
],
|
||||
// 待办事件
|
||||
stayEventList:[
|
||||
{imgsrc:'/static/public/icon-home-stayBatch.png',title:'待审批',num:0},
|
||||
{imgsrc:'/static/public/icon-home-stayCollection.png',title:'待收款',num:0},
|
||||
{imgsrc:'/static/public/icon-home-received.png',title:'已收款',num:0},
|
||||
],
|
||||
// 数据查询
|
||||
dataQueryList:[
|
||||
{imgsrc:'/static/public/icon-home-checkCustomer.png',title:'查客户',num:0},
|
||||
{imgsrc:'/static/public/icon-home-checkProject.png',title:'查项目',num:0},
|
||||
{imgsrc:'/static/public/icon-home-checkSparePart.png',title:'查备件',num:0},
|
||||
],
|
||||
// 常见故障
|
||||
faultsList:[],
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
// 获取当前页面url
|
||||
this.$toolAll.tools.obtainUrl();
|
||||
// 调用解决方案类型事件
|
||||
this.getPlanType();
|
||||
// 调用增值服务类型
|
||||
// this.getIncrementServiceType();
|
||||
// 调用获取常见故障列表事件
|
||||
this.getFaultsList();
|
||||
},
|
||||
methods: {
|
||||
// 工单跳转
|
||||
goWorkOrder(index){
|
||||
if(index==0){
|
||||
|
||||
}else if(index==1){
|
||||
|
||||
}
|
||||
else if(index==2){
|
||||
|
||||
}
|
||||
else if(index==3){
|
||||
uni.navigateTo({
|
||||
url:'/pages/workOrder/workOrderLlsit'
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
goNoticeDetail(e){
|
||||
console.log(e);
|
||||
},
|
||||
// 前往增值服务页面
|
||||
goIncrement(index) {
|
||||
uni.navigateTo({
|
||||
url:`/pages/appreciationServe/appreciationServe?index=${index}`
|
||||
})
|
||||
},
|
||||
// 查询增值服务类型
|
||||
getIncrementServiceType(){
|
||||
this.$requst.post('/universal/api.vas/vas_type').then(res=>{
|
||||
if(res.code) {
|
||||
|
||||
}
|
||||
})
|
||||
},
|
||||
// 数据查询事件
|
||||
dataQueryEv(index){
|
||||
uni.navigateTo({
|
||||
url:`/pages/dataQuery/queryFunction?index=${index}`
|
||||
})
|
||||
},
|
||||
// 查询解决方案类型
|
||||
getPlanType(){
|
||||
this.$requst.post('/universal/api.solution/solution_type').then(res=>{
|
||||
if(res.code) {
|
||||
res.data.forEach(item=>{
|
||||
let obj = {
|
||||
id:item.id,
|
||||
title:item.name,
|
||||
imgsrc: uni.getStorageSync('hostapi') + '/' + item.cover_img,
|
||||
}
|
||||
this.solutionList.push(obj);
|
||||
})
|
||||
console.log(this.solutionList,340);
|
||||
}
|
||||
})
|
||||
},
|
||||
// 故障报修分类下的点击事件
|
||||
goFaultRepair(index){
|
||||
if(index!=2) {
|
||||
let faultRepairUrls = [
|
||||
'/pages/repairsPage/repairsPage',
|
||||
'/pages/workOrder/workOrderLlsit',
|
||||
];
|
||||
uni.navigateTo({
|
||||
url:faultRepairUrls[index]
|
||||
})
|
||||
} else {
|
||||
this.$toolAll.tools.showToast('已催单成功')
|
||||
}
|
||||
},
|
||||
// 获取常见故障推荐列表
|
||||
getFaultsList(){
|
||||
this.$requst.post('/universal/api.question/question').then(res=>{
|
||||
if(res.code) {
|
||||
res.data.forEach(item=>{
|
||||
let obj = {
|
||||
id:item.id,
|
||||
title:item.title,
|
||||
imgsrc: getApp().globalData.hostapi + '/' + item.cover_img,
|
||||
content:item.summary,
|
||||
views:item.reading
|
||||
}
|
||||
this.faultsList.push(obj);
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 其他分类下的点击事件
|
||||
otherEv(index) {
|
||||
let otherUrls = [
|
||||
'/pages/faultStatistics/faultStatistics',
|
||||
'/pages/faultStatistics/projectOverview',
|
||||
'/pagesB/new-product/new-product',
|
||||
];
|
||||
uni.navigateTo({
|
||||
url:otherUrls[index]
|
||||
})
|
||||
},
|
||||
// 前往解决方案、常见故障列表
|
||||
goPlant(index){
|
||||
uni.navigateTo({
|
||||
url:`/pagesB/plan-fault/plan-fault?index=${index}`
|
||||
})
|
||||
},
|
||||
// 前往解决方案详情、常见故障详情
|
||||
goDetail(index,id) {
|
||||
uni.navigateTo({
|
||||
url:`/pagesB/plan-fault-product-detail/detail?index=${index}&id=${id}`
|
||||
})
|
||||
},
|
||||
// 前往消息列表页面
|
||||
goMessage(){
|
||||
uni.navigateTo({
|
||||
url:`/pagesB/message-center/message-center`
|
||||
})
|
||||
},
|
||||
// 拨打电话事件
|
||||
callEv(){
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: '15616330510'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
page{background-color: #f7f7f7;}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
<template>
|
||||
<view>
|
||||
<!-- 底部tab -->
|
||||
<foot-tab :current="1"></foot-tab>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// 底部组件
|
||||
import footTabOne from '@/components/foot-tabs/foot-tab-one.vue';
|
||||
export default {
|
||||
components:{
|
||||
'foot-tab' :footTabOne
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
<template>
|
||||
<view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,50 @@
|
|||
<template>
|
||||
<view>
|
||||
<status-nav navBarTitle="电子证件" returnColor="#c2c2c2"></status-nav>
|
||||
<container-subgroup>
|
||||
<view slot="content">
|
||||
<view class="mar-s20 mar-zy10" style="box-shadow: 0rpx 0rpx 20rpx rgba(0,0,0,.3);">
|
||||
<view class="bacf" style="padding: 4rpx;border-radius: 30rpx;">
|
||||
<view class="electronic-head disjcac fc">
|
||||
<image :src="userImg" mode="widthFix" lazy-load style="width: 347rpx;height: 85rpx;"></image>
|
||||
<view class="colf fon52 mar-sx30" style="letter-spacing: 6rpx;">ID：{{userId}}</view>
|
||||
<image class="mar-s20" src="/static/deleteImg/flying-img06.png" mode="aspectFill" style="width: 258rpx;height: 258rpx;border-radius: 100%;margin-bottom: -130rpx;border: 6rpx solid #edf1ff;background-color: #edf1ff;"></image>
|
||||
</view>
|
||||
<view class="pad-s140 mar-s30 disjcac fc">
|
||||
<view class="col3 fon68">{{userName}}</view>
|
||||
<view class="fon32 col6 mar-sx30">{{userContent}}</view>
|
||||
<view class="fon22 col3 tcenter line-h36" style="margin: 60rpx 0 60rpx 0;">
|
||||
<view>+86 {{userPhone}}</view>
|
||||
<view>{{userEmail}}</view>
|
||||
<view>{{website}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</container-subgroup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
userImg:'/static/public/icon-electronic-logo.png',
|
||||
userId:'CW-0000',
|
||||
userName:'姓名',
|
||||
userContent:'市场部门 | 技术支持',
|
||||
userPhone:'123 4567 8910',
|
||||
userEmail:'12345678910qwer@890.com',
|
||||
website:'WWW.12345678910.com'
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,111 @@
|
|||
<template>
|
||||
<view>
|
||||
<status-nav navBarTitle="我要评价" returnColor="#c2c2c2"></status-nav>
|
||||
<container-subgroup>
|
||||
<view slot="content" style="margin: 0 -30rpx;">
|
||||
<view class="bacf fon28 pad-sx30 pad-zy40">
|
||||
<view class=" bold disjbac fw line-h50">
|
||||
<view class="mar-y20">{{project_name}}</view>
|
||||
<view>{{project_number}}</view>
|
||||
</view>
|
||||
<view class="mar-s10 mar-x30" style="color: #6b6a6a;">服务时间：{{project_time}}</view>
|
||||
<view class="radius20 pad30 dis" style="border: 2rpx solid #dcdcdc;">
|
||||
<image src="/static/public/icon-evaluate-pen.png" mode="widthFix" lazy-load style="width: 25rpx;height: 30rpx;"></image>
|
||||
<textarea v-model="serviceExperience" class="fon24 mar-z20 width100" style="height: 200rpx;" placeholder="写下您的服务体验，帮助我们更好的管理提升" placeholder-style="font-size:24rpx;color: #aaaaaa;" />
|
||||
</view>
|
||||
<view class="fon30 bold mar-sx30">上传图片</view>
|
||||
<view class="disac">
|
||||
<view @tap="chooseImg(index)" class="mar-y20" v-for="(item,index) in imgList" :key="index" style="background-color: #dcdcdc;">
|
||||
<view v-if="item.imgsrc==''" class="evaluate-addimg" style="width: 142rpx;height: 142rpx;"></view>
|
||||
<image v-else :src="item.imgsrc" mode="aspectFill" lazy-load style="width: 142rpx;height: 142rpx;vertical-align: middle;"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bacf fon28 pad-sx30 pad-zy40 mar-s20">
|
||||
<view class="fon30 bold mar-sx30">您的评价</view>
|
||||
<view class="mar-s40 mar-x50" style="color: #545454;">
|
||||
<view class="mar-x40 disac"><text class="mar-y40">技术服务</text><rate :size="42" :gutter="40" :curentClick="0" v-model="rateNum" @change="chooseRate"></rate></view>
|
||||
<view class="disac"><text class="mar-y40">客服态度</text><rate :size="42" :gutter="40" :curentClick="1" v-model="attitudeNum" @change="chooseRate"></rate></view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 提交保存 -->
|
||||
<view class="person-btn" @tap="submitData" style="margin-top: 50rpx;">提交保存</view>
|
||||
</view>
|
||||
</container-subgroup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import rate from '@/components/rate.vue';
|
||||
export default {
|
||||
components:{
|
||||
rate
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
imgList:[//上传图片数组
|
||||
{imgsrc:''},
|
||||
{imgsrc:''},
|
||||
{imgsrc:''}
|
||||
],
|
||||
project_id:'',
|
||||
project_name:'长沙XXXXXXXXX项目名称',
|
||||
project_number:'GD20220108-1002',
|
||||
project_time:'2022-01-11 15 : 27',
|
||||
rateNum:5,//技术服务评分
|
||||
attitudeNum:5,//客服态度评分
|
||||
serviceExperience:'',//服务体验
|
||||
flag:true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 提交保存事件
|
||||
submitData(){
|
||||
if(this.flag) {
|
||||
this.flag = false;
|
||||
let params = {
|
||||
id:this.project_id,
|
||||
a:this.serviceExperience,
|
||||
b:this.imgList[0].imgsrc,
|
||||
c:this.imgList[1].imgsrc,
|
||||
d:this.imgList[2].imgsrc,
|
||||
f:this.rateNum,
|
||||
g:this.attitudeNum
|
||||
}
|
||||
console.log(params,74);
|
||||
// this.$requst.post('',params).then(res=>{
|
||||
// if(res.code) {
|
||||
// uni.navigateBack({delta:1})
|
||||
// }
|
||||
// })
|
||||
}
|
||||
},
|
||||
// 选择图片
|
||||
chooseImg(index){
|
||||
uni.chooseImage({
|
||||
count:1,
|
||||
sourceType:['album','camera'],
|
||||
sizeType:['compressed'],
|
||||
success: (res) => {
|
||||
this.imgList[index].imgsrc = res.tempFilePaths[0];
|
||||
}
|
||||
})
|
||||
},
|
||||
chooseRate(arr){
|
||||
switch (arr[1]){
|
||||
case 0:
|
||||
this.rateNum = arr[0];
|
||||
break;
|
||||
case 1:
|
||||
this.attitudeNum = arr[0];
|
||||
break;
|
||||
}
|
||||
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
<template>
|
||||
<view>
|
||||
<map :latitude="30.656693" :longitude="104.136425"></map>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,221 @@
|
|||
<template>
|
||||
<view>
|
||||
<status-nav navBarTitle="个人信息" returnColor="#c2c2c2"></status-nav>
|
||||
<container-subgroup-two>
|
||||
<view slot="content" style="margin: 0 -30rpx;">
|
||||
<view class="fon28">
|
||||
<view class="bacf pad-sx30 pad-zy40 disac bbot">
|
||||
<view class="bold width30 flexs">我的昵称</view>
|
||||
<view class="width100" style="color: #8b8b8b;">
|
||||
<input type="text" v-model="nickname" placeholder="请输入昵称" placeholder-style="font-size:28rpx;color:#8b8b8b;" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="bacf pad-sx30 pad-zy40 disac bbot">
|
||||
<view class="bold width30 flexs">姓名</view>
|
||||
<view class="width100" style="color: #8b8b8b;">
|
||||
<input type="text" v-model="full_name" placeholder="请输入姓名" placeholder-style="font-size:28rpx;color:#8b8b8b;" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="bacf pad-sx30 pad-zy40 disac bbot">
|
||||
<view class="bold width30 flexs">性别</view>
|
||||
<view class="disac">
|
||||
<view @tap="chooseGender(1)" class="disac gender-box" :class="genderNum==1 ? 'gender-active' : ''">
|
||||
<view></view>
|
||||
<text>男</text>
|
||||
</view>
|
||||
<view @tap="chooseGender(2)" class="disac gender-box" :class="genderNum==2 ? 'gender-active' : ''">
|
||||
<view></view>
|
||||
<text>女</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bacf pad-sx30 pad-zy40 disac bbot">
|
||||
<view class="bold width30 flexs">联系电话</view>
|
||||
<view class="width100" style="color: #8b8b8b;">
|
||||
<input type="number" v-model="contact_number" placeholder="请输入联系电话" placeholder-style="font-size:28rpx;color:#8b8b8b;" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="bacf pad-sx30 pad-zy40 disac bbot">
|
||||
<view class="bold width30 flexs">电子邮箱</view>
|
||||
<view class="width100" style="color: #8b8b8b;">
|
||||
<input type="text" v-model="e_mail" placeholder="请输入电子邮箱" placeholder-style="font-size:28rpx;color:#8b8b8b;" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="bacf pad-sx30 pad-zy40 disac bbot mar-s10">
|
||||
<view class="bold width30 flexs">身份证号码</view>
|
||||
<view class="width100" style="color: #8b8b8b;">
|
||||
<input type="text" v-model="id_card_no" placeholder="请输入身份证号码" placeholder-style="font-size:28rpx;color:#8b8b8b;" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="bacf pad-sx30 pad-zy40 disac bbot">
|
||||
<view class="bold width30 flexs">身份证正反面</view>
|
||||
<view style="color: #f26803;" class="width100 disjbac">
|
||||
<text @tap="previewImageEv(0)">查看</text>
|
||||
<image @tap="uploadImgEv(0)" src="/static/public/icon-personInfo-upload.png" mode="widthFix" lazy-load style="width: 128rpx;height: 50rpx;"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bacf pad-sx30 pad-zy40 disac bbot">
|
||||
<view class="bold width30 flexs">意外险材料</view>
|
||||
<view style="color: #f26803;" class="width100 disjbac">
|
||||
<text @tap="previewImageEv(1)">查看</text>
|
||||
<image @tap="uploadImgEv(1)" src="/static/public/icon-personInfo-upload.png" mode="widthFix" lazy-load style="width: 128rpx;height: 50rpx;"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bacf pad-sx30 pad-zy40 disac bbot">
|
||||
<view class="bold flexs mar-y40">签署工程师合作协议</view>
|
||||
<view style="color: #f26803;" class="width100 disjbac">
|
||||
<text @tap="previewImageEv(2)">查看</text>
|
||||
<image @tap="uploadImgEv(2)" src="/static/public/icon-personInfo-upload.png" mode="widthFix" lazy-load style="width: 128rpx;height: 50rpx;"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bacf pad-sx30 pad-zy40 disac bbot">
|
||||
<view class="bold width30 flexs">技能证书</view>
|
||||
<view style="color: #f26803;" class="width100 disjbac">
|
||||
<text @tap="previewImageEv(3)">查看</text>
|
||||
<image @tap="uploadImgEv(3)" src="/static/public/icon-personInfo-upload.png" mode="widthFix" lazy-load style="width: 128rpx;height: 50rpx;"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="person-btn" @tap="sumbmitData">提交保存</view>
|
||||
</view>
|
||||
</container-subgroup-two>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import containerSubgroupTwo from '@/components/containers/container-subgroup-two.vue';
|
||||
import { uploadImg } from '@/jsFile/public-api.js';
|
||||
export default {
|
||||
components:{
|
||||
containerSubgroupTwo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
nickname:'', // 我的昵称
|
||||
full_name:'', // 姓名
|
||||
genderNum:1 ,// 1：男 2：女
|
||||
contact_number:'', // 联系电话
|
||||
e_mail:'', // 电子邮箱
|
||||
id_card_no:'', // 身份证号码
|
||||
imgList:[],
|
||||
flag:true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 提交保存事件
|
||||
sumbmitData(){
|
||||
if(this.checkEmpty()){
|
||||
if(this.flag) {
|
||||
this.flag = false;
|
||||
let params = {
|
||||
a:this.nickname,
|
||||
b:this.full_name,
|
||||
c:this.genderNum,
|
||||
d:this.contact_number,
|
||||
e:this.e_mail,
|
||||
f:this.id_card_no,
|
||||
g:this.imgList[0] || '',
|
||||
h:this.imgList[1] || '',
|
||||
i:this.imgList[2] || '',
|
||||
k:this.imgList[3] || ''
|
||||
}
|
||||
console.log(params,119);
|
||||
// this.$requst.post('',params).then(res=>{
|
||||
// if(res.code){
|
||||
uni.navigateBack({delta:1})
|
||||
// }
|
||||
// })
|
||||
} else {
|
||||
this.$toolAll.tools.showToast('请勿重复提交');
|
||||
}
|
||||
}
|
||||
},
|
||||
// 判断是否为空
|
||||
checkEmpty(){
|
||||
let result = false;
|
||||
if(uni.getStorageSync('type_id')==4) {
|
||||
// 如果是工程师
|
||||
if(!this.nickname) {
|
||||
this.$toolAll.tools.showToast('请输入我的昵称');
|
||||
} else if(!this.full_name) {
|
||||
this.$toolAll.tools.showToast('请输入姓名');
|
||||
} else if(this.$toolAll.tools.isPhone(this.contact_number)) {
|
||||
this.$toolAll.tools.showToast('请正确输入联系电话');
|
||||
} else if(this.$toolAll.tools.isEmail(this.e_mail)) {
|
||||
this.$toolAll.tools.showToast('请正确输入电子邮箱');
|
||||
} else if(this.$toolAll.tools.isIdentity(this.id_card_no)) {
|
||||
this.$toolAll.tools.showToast('请正确输入身份证号码');
|
||||
} else if(!this.imgList[0]) {
|
||||
this.$toolAll.tools.showToast('请上传身份证正反面');
|
||||
} else if(!this.imgList[1]) {
|
||||
this.$toolAll.tools.showToast('请上传意外险材料');
|
||||
} else if(!this.imgList[2]) {
|
||||
this.$toolAll.tools.showToast('请上传合作协议');
|
||||
} else if(!this.imgList[3]) {
|
||||
this.$toolAll.tools.showToast('请上传技能证书');
|
||||
} else {
|
||||
result = true;
|
||||
}
|
||||
} else {
|
||||
result = true;
|
||||
}
|
||||
return result;
|
||||
},
|
||||
// 性别切换
|
||||
chooseGender(index){
|
||||
this.genderNum = index;
|
||||
},
|
||||
// 图片上传
|
||||
uploadImgEv(index){
|
||||
uni.chooseImage({
|
||||
count:1,
|
||||
sourceType:['album'],
|
||||
success: (res) => {
|
||||
let tempImg = res.tempFilePaths;
|
||||
this.imgList[index] = tempImg[0];
|
||||
let params = {
|
||||
token: uni.getStorageSync('token'),
|
||||
dir: 'images',
|
||||
from:tempImg[0]
|
||||
}
|
||||
console.log(params,104);
|
||||
uploadImg(params).then(res=>{
|
||||
console.log(res);
|
||||
})
|
||||
// this.$requst.upload('file/upload/image',{file:tempImg[i]}).then(res=>{
|
||||
// if(this.imgArr.length!=9){
|
||||
// // this.imgArr.push(this.$http + res.data.src);
|
||||
// }
|
||||
// if(num==tempImg.length){
|
||||
// this.$toolAll.tools.showToast('上传成功(*^▽^*)')
|
||||
// } else {
|
||||
// this.$toolAll.tools.showToast('上传中...')
|
||||
// }
|
||||
// },error=>{})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 预览图片
|
||||
previewImageEv(current){
|
||||
let arr = [];
|
||||
// 不能滑动看其他的图片
|
||||
this.imgList.forEach((item,index)=>{
|
||||
if(current==index) arr.push(item);
|
||||
})
|
||||
if(arr.length) {
|
||||
uni.previewImage({
|
||||
current:current,
|
||||
urls: arr,
|
||||
success() {}
|
||||
})
|
||||
} else {
|
||||
this.$toolAll.tools.showToast('无内容...')
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,216 @@
|
|||
<template>
|
||||
<view>
|
||||
<status-nav navBarTitle="服务范围" returnColor="#c2c2c2"></status-nav>
|
||||
<container-subgroup>
|
||||
<view slot="content" style="margin: 0rpx -30rpx 0rpx -30rpx;padding-bottom: 120rpx;" class="fon28 bacf">
|
||||
<view class="bbot disac pad-sx30 pad-zy30">
|
||||
<view class="mar-y30 flexs">人员状态 <text style="color: red;">*</text></view>
|
||||
<view class="disac">
|
||||
<view @tap="chooseStatus(index,0)" v-for="(item,index) in personnelStatus" :key="index" class="service-range-status mar-y10" :class="statusNum==index ? 'service-range-activeStatus' : ''">{{item}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bbot disac pad-sx30 pad-zy30">
|
||||
<view id="timeBox" class="mar-y30 flexs">工作时段 <text style="color: red;">*</text></view>
|
||||
<view class="disac">
|
||||
<view @tap="chooseStatus(index,1)" v-for="(item,index) in workingHours" :key="index" class="service-range-status mar-y10" :class="hoursNum==index ? 'service-range-activeStatus' : ''">{{item}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bbot disac pad-sx30 pad-zy30">
|
||||
<view class="mar-y30 flexs disjbac" :style="{width: eareWidth + 'px'}">地 <view>区<text style="color: red;">*</text></view></view>
|
||||
<!-- <view class="disjbac width100" @tap="chooseRegion"> -->
|
||||
<view class="disjbac width100" @tap="openPicker">
|
||||
<view>{{region}}</view>
|
||||
<i class="icon icon-next col9" style="font-size: 30rpx;"></i>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bbot disac pad-sx30 pad-zy30">
|
||||
<view class="mar-y30 flexs">详细地址 <text style="color: red;">*</text></view>
|
||||
<input class="fon28 width100" type="text" v-model="detailed_address" placeholder="请输入详细地址" placeholder-style="font-size:28rpx;"/>
|
||||
</view>
|
||||
<view class="bbot disac pad-sx30 pad-zy30">
|
||||
<view class="mar-y30 flexs">服务范围 <text style="color: red;">*</text></view>
|
||||
<scroll-view scroll-x style="width: 76%;">
|
||||
<view class="disac">
|
||||
<view @tap="chooseStatus(index,2)" v-for="(item,index) in serviceRange" :key="index" class="service-range-status mar-y10 flexs" :class="rangeNum==index ? 'service-range-activeStatus' : ''">{{item}}</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<view class="bbot disjcac fc pad-sx30 pad-zy30">
|
||||
<textarea class="fon28" v-model="remarkText" maxlength="50" placeholder="特殊情况请备注" placeholder-style="font-size: 28rpx;color:#bbbbbb;" style="height: 160rpx;width: 100%;" />
|
||||
<view class="col9">{{remarkText.length}}/50</view>
|
||||
</view>
|
||||
</view>
|
||||
</container-subgroup>
|
||||
<!-- 提交保存 -->
|
||||
<view class="person-btn" @tap="submitData" style="margin-top: -60rpx;">提交保存</view>
|
||||
<city @choseVal="choseValue" :lotusAddressData="lotusAddressData"></city>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import city from '@/components/city/city.vue';
|
||||
// import city from '@/components/city/city.js';
|
||||
export default {
|
||||
components:{
|
||||
city
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
personnelStatus:['工作状态','休息状态'],
|
||||
statusNum:0,
|
||||
workingHours:['不限','白天','晚上'],
|
||||
hoursNum:0,
|
||||
serviceRange:['30KM','80KM','1500KM','其他','其他','其他','其他'],
|
||||
rangeNum:0,
|
||||
lotusAddressData:{
|
||||
visible:false,
|
||||
provinceName:'',
|
||||
cityName:'',
|
||||
townName:'',
|
||||
},
|
||||
region:'湖南省株洲市芦淞区',
|
||||
newProvice:'',
|
||||
newCity:'',
|
||||
newDistrict:'',
|
||||
detailed_address:'',
|
||||
remarkText:'',
|
||||
eareWidth:'',
|
||||
flag:true
|
||||
}
|
||||
},
|
||||
onReady() {
|
||||
const query = wx.createSelectorQuery()
|
||||
query.select('#timeBox').boundingClientRect((rect) => {
|
||||
this.eareWidth = rect.width;
|
||||
}).exec()
|
||||
},
|
||||
methods: {
|
||||
// 提交保存
|
||||
submitData(){
|
||||
if(this.checkEmpty()) {
|
||||
if(this.flag) {
|
||||
this.flag = false;
|
||||
let params = {
|
||||
a:this.personnelStatus[this.statusNum],
|
||||
b:this.workingHours[this.hoursNum],
|
||||
c:this.region,
|
||||
d:this.detailed_address,
|
||||
f:this.serviceRange[this.rangeNum],
|
||||
g:this.remarkText
|
||||
}
|
||||
console.log(params,87);
|
||||
// this.$requst.post().then(res=>{
|
||||
// if(res.code) {
|
||||
// uni.navigateBack({delta:1})
|
||||
// }
|
||||
// })
|
||||
}
|
||||
}
|
||||
},
|
||||
// 判空事件
|
||||
checkEmpty(){
|
||||
let result = false;
|
||||
if(!this.region) {
|
||||
this.$toolAll.tools.showToast('请选择地区');
|
||||
} else if(!this.detailed_address){
|
||||
this.$toolAll.tools.showToast('请输入详细地址');
|
||||
} else {
|
||||
result = true;
|
||||
}
|
||||
return result;
|
||||
},
|
||||
// 选择地区
|
||||
chooseRegion(){
|
||||
uni.getLocation({
|
||||
type: 'gcj02', //返回可以用于uni.openLocation的经纬度
|
||||
success: function (res) {
|
||||
const latitude = res.latitude;
|
||||
const longitude = res.longitude;
|
||||
console.log(latitude,longitude,78);
|
||||
uni.chooseLocation({
|
||||
success: function (res) {
|
||||
console.log(res,81);
|
||||
console.log('位置名称：' + res.name);
|
||||
console.log('详细地址：' + res.address);
|
||||
console.log('纬度：' + res.latitude);
|
||||
console.log('经度：' + res.longitude);
|
||||
}
|
||||
});
|
||||
// uni.openLocation({
|
||||
// latitude: latitude,
|
||||
// longitude: longitude,
|
||||
// success: function () {
|
||||
// console.log('success');
|
||||
// }
|
||||
// });
|
||||
}
|
||||
});
|
||||
},
|
||||
getDistrict() {
|
||||
let ya = this
|
||||
uni.getLocation({
|
||||
success:(res)=> {
|
||||
uni.request({
|
||||
url: `https://apis.map.qq.com/ws/geocoder/v1/?location=${res.latitude},${res.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
|
||||
}
|
||||
}
|
||||
},
|
||||
// 人员状态选择
|
||||
chooseStatus(index,num){
|
||||
switch (num){
|
||||
case 0:
|
||||
this.statusNum = index;
|
||||
break;
|
||||
case 1:
|
||||
this.hoursNum = index;
|
||||
break;
|
||||
case 2:
|
||||
this.rangeNum = index;
|
||||
break;
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,140 @@
|
|||
<template>
|
||||
<view>
|
||||
<status-nav navBarTitle="设置" returnColor="#c2c2c2"></status-nav>
|
||||
<container-subgroup>
|
||||
<view slot="content" style="margin: 0 -30rpx;" class="fon28">
|
||||
<!-- #ifdef APP-PLUS -->
|
||||
<view class="bacf pad30 disjbac bbot">
|
||||
<view>开启语音提醒</view>
|
||||
<view><evan-switch v-model="voiceStatus" @change="voiceEv" :size="18" inactive-color="#b3b3b3" active-color="#fd8956"></evan-switch></view>
|
||||
</view>
|
||||
<view class="bacf pad30 disjbac mar-x20">
|
||||
<view>接受新消息通知</view>
|
||||
<view><evan-switch v-model="newsStatus" @change="newsEv" :size="18" inactive-color="#b3b3b3" active-color="#fd8956"></evan-switch></view>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
<view @tap="updatePassword" class="bacf pad30 disjbac bbot">
|
||||
<view>修改登录密码</view>
|
||||
<i class="icon icon-next col9" style="font-size: 26rpx;"></i>
|
||||
</view>
|
||||
<!-- #ifdef APP-PLUS -->
|
||||
<view @tap="cleanEv" class="bacf pad30 disjbac">
|
||||
<view>清除缓存</view>
|
||||
<view class="col9">{{cacheSize}}</view>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
<view class="bacf pad30 disjbac mar-s20 bbot">
|
||||
<view>上门服务条款</view>
|
||||
<view class="disac col9">
|
||||
V3.0<i class="icon icon-next col9 mar-z20" style="font-size: 26rpx;"></i>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bacf pad30 disjbac bbot">
|
||||
<view>用户服务协议</view>
|
||||
<view class="disac col9">
|
||||
V1.1<i class="icon icon-next col9 mar-z20" style="font-size: 26rpx;"></i>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bacf pad30 disjbac bbot">
|
||||
<view>飞猴云服务隐私政策</view>
|
||||
<view class="disac col9">
|
||||
V1.2<i class="icon icon-next col9 mar-z20" style="font-size: 26rpx;"></i>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bacf pad30 disjbac bbot">
|
||||
<view>技术服务合作协议</view>
|
||||
<view class="disac col9">
|
||||
V1.1<i class="icon icon-next col9 mar-z20" style="font-size: 26rpx;"></i>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bacf pad30 disjbac bbot">
|
||||
<view>关于飞猴云服务</view>
|
||||
<view class="disac col9">
|
||||
V1.1<i class="icon icon-next col9 mar-z20" style="font-size: 26rpx;"></i>
|
||||
</view>
|
||||
</view>
|
||||
<!-- #ifdef APP-PLUS -->
|
||||
<view @tap="checkEdition" class="bacf pad30 disjbac">
|
||||
<view>版本更新</view>
|
||||
<view class="col9">当前版本 5.1.4</view>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</container-subgroup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import evanSwitch from '@/components/evan-switch/evan-switch.vue';
|
||||
export default {
|
||||
components:{
|
||||
evanSwitch
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
voiceStatus:false,//是否开启语音提醒
|
||||
newsStatus:false,//是否开启接受新消息通知
|
||||
cacheSize:'754.72 KB',//缓存数据大小
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
// 调用获取缓存数据的大小
|
||||
this.getStorageDataNum();
|
||||
},
|
||||
methods: {
|
||||
// 获取缓存数据的大小
|
||||
getStorageDataNum(){
|
||||
// #ifdef APP-PLUS
|
||||
var self = this;
|
||||
plus.cache.calculate(function(size) { //size是多少个字节单位是b
|
||||
//做下面相应的处理
|
||||
if (size < 1024) {
|
||||
self.cacheSize = size + ' B';
|
||||
} else if (size / 1024 >= 1 && size / 1024 / 1024 < 1) {
|
||||
self.cacheSize = Math.floor(size / 1024 * 100) / 100 + ' KB';
|
||||
} else if (size / 1024 / 1024 >= 1) {
|
||||
self.cacheSize = Math.floor(size / 1024 / 1024 * 100) / 100 + ' M';
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
},
|
||||
// 语音提醒事件
|
||||
voiceEv(status){
|
||||
console.log(status);
|
||||
},
|
||||
// 新消息通知事件
|
||||
newsEv(status){
|
||||
console.log(status);
|
||||
},
|
||||
// 修改登录密码
|
||||
updatePassword(){
|
||||
console.log('修改登录密码');
|
||||
},
|
||||
// 清除缓存事件
|
||||
cleanEv(){
|
||||
console.log('清除缓存事件');
|
||||
// #ifdef APP-PLUS
|
||||
var self = this;
|
||||
//使用plus.cache.clear 清除应用中的缓存数据
|
||||
plus.cache.clear(function() {
|
||||
uni.showToast({
|
||||
title: '清除成功!',
|
||||
icon: 'none',
|
||||
success() {
|
||||
self.cacheSize = '0B'
|
||||
}
|
||||
})
|
||||
});
|
||||
// #endif
|
||||
},
|
||||
// 检测版本事件
|
||||
checkEdition(){
|
||||
console.log('检测版本事件');
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,77 @@
|
|||
{
|
||||
"description": "项目配置文件",
|
||||
"packOptions": {
|
||||
"ignore": []
|
||||
},
|
||||
"setting": {
|
||||
"urlCheck": true,
|
||||
"es6": true,
|
||||
"enhance": true,
|
||||
"postcss": true,
|
||||
"preloadBackgroundData": false,
|
||||
"minified": true,
|
||||
"newFeature": false,
|
||||
"coverView": true,
|
||||
"nodeModules": false,
|
||||
"autoAudits": false,
|
||||
"showShadowRootInWxmlPanel": true,
|
||||
"scopeDataCheck": false,
|
||||
"uglifyFileName": false,
|
||||
"checkInvalidKey": true,
|
||||
"checkSiteMap": true,
|
||||
"uploadWithSourceMap": true,
|
||||
"compileHotReLoad": false,
|
||||
"lazyloadPlaceholderEnable": false,
|
||||
"useMultiFrameRuntime": true,
|
||||
"useApiHook": true,
|
||||
"useApiHostProcess": true,
|
||||
"babelSetting": {
|
||||
"ignore": [],
|
||||
"disablePlugins": [],
|
||||
"outputPath": ""
|
||||
},
|
||||
"useIsolateContext": false,
|
||||
"userConfirmedBundleSwitch": false,
|
||||
"packNpmManually": false,
|
||||
"packNpmRelationList": [],
|
||||
"minifyWXSS": true,
|
||||
"disableUseStrict": false,
|
||||
"minifyWXML": true,
|
||||
"showES6CompileOption": false,
|
||||
"useCompilerPlugins": false,
|
||||
"ignoreUploadUnusedFiles": true
|
||||
},
|
||||
"compileType": "miniprogram",
|
||||
"libVersion": "2.22.0",
|
||||
"appid": "wx987dc41899f719e8",
|
||||
"projectname": "%E4%BD%A9%E4%B8%BD%E5%95%86%E5%9F%8E",
|
||||
"debugOptions": {
|
||||
"hidedInDevtools": []
|
||||
},
|
||||
"scripts": {},
|
||||
"staticServerOptions": {
|
||||
"baseURL": "",
|
||||
"servePath": ""
|
||||
},
|
||||
"isGameTourist": false,
|
||||
"condition": {
|
||||
"search": {
|
||||
"list": []
|
||||
},
|
||||
"conversation": {
|
||||
"list": []
|
||||
},
|
||||
"game": {
|
||||
"list": []
|
||||
},
|
||||
"plugin": {
|
||||
"list": []
|
||||
},
|
||||
"gamePlugin": {
|
||||
"list": []
|
||||
},
|
||||
"miniprogram": {
|
||||
"list": []
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
<!-- 暂无更多组件参数的使用
|
||||
|
||||
组件一
|
||||
<nothing-page
|
||||
:imgSrc="图片路径可相对、可绝对、可网络"
|
||||
:currentType="0,1,2,..."
|
||||
:content="'-- NO MORE --'"></nothing-page>
|
||||
|
||||
组件二
|
||||
<pitera
|
||||
:textColor="'#999999'"
|
||||
:textStr="'-- NO MORE --'"
|
||||
:textFontSize="'24rpx'"
|
||||
:ifBold="false"
|
||||
:ifCenter="true"
|
||||
:paddingStr="'20rpx'"></pitera>
|
||||
|
||||
-->
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 30 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 67 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 42 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 44 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 64 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 59 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 73 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 70 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 74 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 65 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 456 B |
Binary file not shown.
|
After Width: | Height: | Size: 426 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 589 B |
Binary file not shown.
|
After Width: | Height: | Size: 667 B |
Binary file not shown.
|
After Width: | Height: | Size: 573 B |
Binary file not shown.
|
After Width: | Height: | Size: 4.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 403 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 511 B |
Binary file not shown.
|
After Width: | Height: | Size: 394 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 296 B |
Binary file not shown.
|
After Width: | Height: | Size: 227 B |
Binary file not shown.
|
After Width: | Height: | Size: 321 B |
Binary file not shown.
|
After Width: | Height: | Size: 2.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 716 B |
Binary file not shown.
|
After Width: | Height: | Size: 747 B |
Binary file not shown.
|
After Width: | Height: | Size: 290 B |
Binary file not shown.
|
After Width: | Height: | Size: 678 B |
Binary file not shown.
|
After Width: | Height: | Size: 6.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 951 B |
Binary file not shown.
|
After Width: | Height: | Size: 768 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 177 B |
Binary file not shown.
|
After Width: | Height: | Size: 681 B |
Binary file not shown.
|
After Width: | Height: | Size: 714 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 576 B |
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue