提交 d3a960dc 编写于 作者: L linju

12

上级 9d05c7e8
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
}, },
onLaunch: function() { onLaunch: function() {
console.log('App Launch') console.log('App Launch')
// initApp(); initApp();
}, },
onShow: function() { onShow: function() {
console.log('App Show') console.log('App Show')
......
...@@ -25,7 +25,7 @@ function keepScreenOn(){ ...@@ -25,7 +25,7 @@ function keepScreenOn(){
* // 初始化appVersion * // 初始化appVersion
*/ */
function initAppVersion(){ function initAppVersion(){
// #ifdef APP-NVUE // #ifdef APP-PLUS
let appid = plus.runtime.appid; let appid = plus.runtime.appid;
plus.runtime.getProperty(appid ,(wgtInfo) => { plus.runtime.getProperty(appid ,(wgtInfo) => {
wgtInfo.version wgtInfo.version
......
/* 头条小程序需要把 iconfont 样式放到组件外 */
@font-face {
font-family: uniicons;
font-weight: normal;
font-style: normal;
src: url('/static/uni.ttf') format('truetype');
}
.m-icon {
font-family: uniicons;
/* font-size: 24px; */
margin-left: 20px;
font-weight: normal;
font-style: normal;
line-height: 1;
display: inline-block;
text-decoration: none;
-webkit-font-smoothing: antialiased;
}
.m-icon.uni-active {
color: #007aff;
}
.m-icon-contact:before {
content: '\e100';
}
.m-icon-person:before {
content: '\e101';
}
.m-icon-personadd:before {
content: '\e102';
}
.m-icon-contact-filled:before {
content: '\e130';
}
.m-icon-person-filled:before {
content: '\e131';
}
.m-icon-personadd-filled:before {
content: '\e132';
}
.m-icon-phone:before {
content: '\e200';
}
.m-icon-email:before {
content: '\e201';
}
.m-icon-chatbubble:before {
content: '\e202';
}
.m-icon-chatboxes:before {
content: '\e203';
}
.m-icon-phone-filled:before {
content: '\e230';
}
.m-icon-email-filled:before {
content: '\e231';
}
.m-icon-chatbubble-filled:before {
content: '\e232';
}
.m-icon-chatboxes-filled:before {
content: '\e233';
}
.m-icon-weibo:before {
content: '\e260';
}
.m-icon-weixin:before {
content: '\e261';
}
.m-icon-pengyouquan:before {
content: '\e262';
}
.m-icon-chat:before {
content: '\e263';
}
.m-icon-qq:before {
content: '\e264';
}
.m-icon-videocam:before {
content: '\e300';
}
.m-icon-camera:before {
content: '\e301';
}
.m-icon-mic:before {
content: '\e302';
}
.m-icon-location:before {
content: '\e303';
}
.m-icon-mic-filled:before,
.m-icon-speech:before {
content: '\e332';
}
.m-icon-location-filled:before {
content: '\e333';
}
.m-icon-micoff:before {
content: '\e360';
}
.m-icon-image:before {
content: '\e363';
}
.m-icon-map:before {
content: '\e364';
}
.m-icon-compose:before {
content: '\e400';
}
.m-icon-trash:before {
content: '\e401';
}
.m-icon-upload:before {
content: '\e402';
}
.m-icon-download:before {
content: '\e403';
}
.m-icon-close:before {
content: '\e404';
}
.m-icon-redo:before {
content: '\e405';
}
.m-icon-undo:before {
content: '\e406';
}
.m-icon-refresh:before {
content: '\e407';
}
.m-icon-star:before {
content: '\e408';
}
.m-icon-plus:before {
content: '\e409';
}
.m-icon-minus:before {
content: '\e410';
}
.m-icon-circle:before,
.m-icon-checkbox:before {
content: '\e411';
}
.m-icon-close-filled:before,
.m-icon-clear:before {
content: '\e434';
}
.m-icon-refresh-filled:before {
content: '\e437';
}
.m-icon-star-filled:before {
content: '\e438';
}
.m-icon-plus-filled:before {
content: '\e439';
}
.m-icon-minus-filled:before {
content: '\e440';
}
.m-icon-circle-filled:before {
content: '\e441';
}
.m-icon-checkbox-filled:before {
content: '\e442';
}
.m-icon-closeempty:before {
content: '\e460';
}
.m-icon-refreshempty:before {
content: '\e461';
}
.m-icon-reload:before {
content: '\e462';
}
.m-icon-starhalf:before {
content: '\e463';
}
.m-icon-spinner:before {
content: '\e464';
}
.m-icon-spinner-cycle:before {
content: '\e465';
}
.m-icon-search:before {
content: '\e466';
}
.m-icon-plusempty:before {
content: '\e468';
}
.m-icon-forward:before {
content: '\e470';
}
.m-icon-back:before,
.m-icon-left-nav:before {
content: '\e471';
}
.m-icon-checkmarkempty:before {
content: '\e472';
}
.m-icon-home:before {
content: '\e500';
}
.m-icon-navigate:before {
content: '\e501';
}
.m-icon-gear:before {
content: '\e502';
}
.m-icon-paperplane:before {
content: '\e503';
}
.m-icon-info:before {
content: '\e504';
}
.m-icon-help:before {
content: '\e505';
}
.m-icon-locked:before {
content: '\e506';
}
.m-icon-more:before {
content: '\e507';
}
.m-icon-flag:before {
content: '\e508';
}
.m-icon-home-filled:before {
content: '\e530';
}
.m-icon-gear-filled:before {
content: '\e532';
}
.m-icon-info-filled:before {
content: '\e534';
}
.m-icon-help-filled:before {
content: '\e535';
}
.m-icon-more-filled:before {
content: '\e537';
}
.m-icon-settings:before {
content: '\e560';
}
.m-icon-list:before {
content: '\e562';
}
.m-icon-bars:before {
content: '\e563';
}
.m-icon-loop:before {
content: '\e565';
}
.m-icon-paperclip:before {
content: '\e567';
}
.m-icon-eye:before {
content: '\e568';
}
.m-icon-arrowup:before {
content: '\e580';
}
.m-icon-arrowdown:before {
content: '\e581';
}
.m-icon-arrowleft:before {
content: '\e582';
}
.m-icon-arrowright:before {
content: '\e583';
}
.m-icon-arrowthinup:before {
content: '\e584';
}
.m-icon-arrowthindown:before {
content: '\e585';
}
.m-icon-arrowthinleft:before {
content: '\e586';
}
.m-icon-arrowthinright:before {
content: '\e587';
}
.m-icon-pulldown:before {
content: '\e588';
}
.m-icon-scan:before {
content: "\e612";
}
/*每个页面公共css */
page {
min-height: 100%;
display: flex;
font-size: 14px;
}
input,
textarea,
button {
font-size: 14px;
}
/* #ifdef MP-BAIDU */
page {
width: 100%;
height: 100%;
display: block;
}
swan-template {
width: 100%;
min-height: 100%;
display: flex;
}
/* 原生组件模式下需要注意组件外部样式 */
custom-component {
width: 100%;
min-height: 100%;
display: flex;
}
/* #endif */
/* #ifdef MP-ALIPAY */
page {
min-height: 100vh;
}
/* #endif */
/* 原生组件模式下需要注意组件外部样式 */
m-input {
width: 100%;
/* min-height: 100%; */
display: flex;
flex: 1;
}
.content {
display: flex;
flex: 1;
flex-direction: column;
background-color: #efeff4;
padding: 10px;
}
.input-group {
background-color: #ffffff;
margin-top: 20px;
position: relative;
}
.input-group::before {
position: absolute;
right: 0;
top: 0;
left: 0;
height: 1px;
content: '';
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
background-color: #c8c7cc;
}
.input-group::after {
position: absolute;
right: 0;
bottom: 0;
left: 0;
height: 1px;
content: '';
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
background-color: #c8c7cc;
}
.input-row {
display: flex;
flex-direction: row;
position: relative;
/* font-size: 18px; */
height: 40px;
line-height: 40px;
}
.input-row .title {
width: 70px;
padding-left: 15px;
}
.input-row.border::after {
position: absolute;
right: 0;
bottom: 0;
left: 8px;
height: 1px;
content: '';
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
background-color: #c8c7cc;
}
.btn-row {
margin-top: 25px;
padding: 10px;
}
button.primary {
background-color: #0faeff;
}
\ No newline at end of file
.uni-flex {
display: flex;
}
.uni-flex-row {
@extend .uni-flex;
flex-direction: row;
box-sizing: border-box;
}
.uni-flex-column {
@extend .uni-flex;
flex-direction: column;
}
.uni-color-gary {
color: #3b4144;
}
/* 标题 */
.uni-title {
display: flex;
margin-bottom: $uni-spacing-col-base;
font-size: $uni-font-size-lg;
font-weight: bold;
color: #3b4144;
}
.uni-title-sub {
display: flex;
// margin-bottom: $uni-spacing-col-base;
font-size: $uni-font-size-base;
font-weight: 500;
color: #3b4144;
}
/* 描述 额外文本 */
.uni-note {
margin-top: 10px;
color: #999;
font-size: $uni-font-size-sm;
}
/* 列表内容 */
.uni-list-box {
@extend .uni-flex-row;
flex: 1;
margin-top: 10px;
}
/* 略缩图 */
.uni-thumb {
flex-shrink: 0;
margin-right: $uni-spacing-row-base;
width: 125px;
height: 75px;
border-radius: $uni-border-radius-lg;
overflow: hidden;
border: 1px #f5f5f5 solid;
image {
width: 100%;
height: 100%;
}
}
.uni-media-box {
@extend .uni-flex-row;
// margin-bottom: $uni-spacing-col-base;
border-radius: $uni-border-radius-lg;
overflow: hidden;
.uni-thumb {
margin: 0;
margin-left: 4px;
flex-shrink: 1;
width: 33%;
border-radius:0;
&:first-child {
margin: 0;
}
}
}
/* 内容 */
.uni-content {
@extend .uni-flex-column;
justify-content: space-between;
}
/* 列表footer */
.uni-footer {
@extend .uni-flex-row;
justify-content: space-between;
margin-top: $uni-spacing-col-lg;
}
.uni-footer-text {
font-size: $uni-font-size-sm;
color: $uni-text-color-grey;
margin-left: 5px;
}
/* 标签 */
.uni-tag {
flex-shrink: 0;
padding: 0 5px;
border: 1px $uni-border-color solid;
margin-right: $uni-spacing-row-sm;
border-radius: $uni-border-radius-base;
background: $uni-bg-color-grey;
color: $uni-text-color;
font-size: $uni-font-size-sm;
}
/* 链接 */
.uni-link {
margin-left: 10px;
color: $uni-text-color;
text-decoration: underline;
}
@font-face {
font-family: uniicons;
font-weight: normal;
font-style: normal;
src: url('~@/static/uni.ttf') format('truetype');
}
/*通用 */
view{
font-size:28rpx;
line-height:1.8;
}
progress, checkbox-group{
width: 100%;
}
form {
width: 100%;
}
.uni-flex {
display: flex;
flex-direction: row;
}
.uni-flex-item {
flex: 1;
}
.uni-row {
flex-direction: row;
}
.uni-column {
flex-direction: column;
}
.uni-link{
color:#576B95;
font-size:26rpx;
}
.uni-center{
text-align:center;
}
.uni-inline-item{
display: flex;
flex-direction: row;
align-items:center;
}
.uni-inline-item text{
margin-right: 20rpx;
}
.uni-inline-item text:last-child{
margin-right: 0rpx;
margin-left: 20rpx;
}
/* page */
.uni-page-head{
padding:35rpx;
text-align: center;
}
.uni-page-head-title {
display: inline-block;
padding: 0 40rpx;
font-size: 30rpx;
height: 88rpx;
line-height: 88rpx;
color: #BEBEBE;
box-sizing: border-box;
border-bottom: 2rpx solid #D8D8D8;
}
.uni-page-body {
width: 100%;
flex-grow: 1;
overflow-x: hidden;
}
.uni-padding-wrap{
width:690rpx;
padding:0 30rpx;
}
.uni-word {
text-align: center;
padding:200rpx 100rpx;
}
.uni-title {
font-size:30rpx;
font-weight:500;
padding:20rpx 0;
line-height:1.5;
}
.uni-text{
font-size:28rpx;
}
.uni-title text{
font-size:24rpx;
color:#888;
}
.uni-text-gray{
color: #ccc;
}
.uni-text-small {
font-size:24rpx;
}
.uni-common-mb{
margin-bottom:30rpx;
}
.uni-common-pb{
padding-bottom:30rpx;
}
.uni-common-pl{
padding-left:30rpx;
}
.uni-common-mt{
margin-top:30rpx;
}
/* 背景色 */
.uni-bg-red{
background:#F76260; color:#FFF;
}
.uni-bg-green{
background:#09BB07; color:#FFF;
}
.uni-bg-blue{
background:#007AFF; color:#FFF;
}
/* 标题 */
.uni-h1 {font-size: 80rpx; font-weight:700;}
.uni-h2 {font-size: 60rpx; font-weight:700;}
.uni-h3 {font-size: 48rpx; font-weight:700;}
.uni-h4 {font-size: 36rpx; font-weight:700;}
.uni-h5 {font-size: 28rpx; color: #8f8f94;}
.uni-h6 {font-size: 24rpx; color: #8f8f94;}
.uni-bold{font-weight:bold;}
/* 文本溢出隐藏 */
.uni-ellipsis {overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
/* 竖向百分百按钮 */
.uni-btn-v{
padding:10rpx 0;
}
.uni-btn-v button{margin:20rpx 0;}
/* 表单 */
.uni-form-item{
display:flex;
width:100%;
padding:10rpx 0;
}
.uni-form-item .title{
padding:10rpx 25rpx;
}
.uni-label {
width: 210rpx;
word-wrap: break-word;
word-break: break-all;
text-indent:20rpx;
}
.uni-input {
height: 50rpx;
padding: 15rpx 25rpx;
line-height:50rpx;
font-size:28rpx;
background:#FFF;
flex: 1;
}
radio-group, checkbox-group{
width:100%;
}
radio-group label, checkbox-group label{
padding-right:20rpx;
}
.uni-form-item .with-fun{
display:flex;
flex-wrap:nowrap;
background:#FFFFFF;
}
.uni-form-item .with-fun .uni-icon{
width:40px;
height:80rpx;
line-height:80rpx;
flex-shrink:0;
}
/* loadmore */
.uni-loadmore{
height:80rpx;
line-height:80rpx;
text-align:center;
padding-bottom:30rpx;
}
/*数字角标*/
.uni-badge,
.uni-badge-default {
font-family: 'Helvetica Neue', Helvetica, sans-serif;
font-size: 12px;
line-height: 1;
display: inline-block;
padding: 3px 6px;
color: #333;
border-radius: 100px;
background-color: rgba(0, 0, 0, .15);
}
.uni-badge.uni-badge-inverted {
padding: 0 5px 0 0;
color: #929292;
background-color: transparent
}
.uni-badge-primary {
color: #fff;
background-color: #007aff
}
.uni-badge-blue.uni-badge-inverted,
.uni-badge-primary.uni-badge-inverted {
color: #007aff;
background-color: transparent
}
.uni-badge-green,
.uni-badge-success {
color: #fff;
background-color: #4cd964;
}
.uni-badge-green.uni-badge-inverted,
.uni-badge-success.uni-badge-inverted {
color: #4cd964;
background-color: transparent
}
.uni-badge-warning,
.uni-badge-yellow {
color: #fff;
background-color: #f0ad4e
}
.uni-badge-warning.uni-badge-inverted,
.uni-badge-yellow.uni-badge-inverted {
color: #f0ad4e;
background-color: transparent
}
.uni-badge-danger,
.uni-badge-red {
color: #fff;
background-color: #dd524d
}
.uni-badge-danger.uni-badge-inverted,
.uni-badge-red.uni-badge-inverted {
color: #dd524d;
background-color: transparent
}
.uni-badge-purple,
.uni-badge-royal {
color: #fff;
background-color: #8a6de9
}
.uni-badge-purple.uni-badge-inverted,
.uni-badge-royal.uni-badge-inverted {
color: #8a6de9;
background-color: transparent
}
/*折叠面板 */
.uni-collapse-content {
height: 0;
width: 100%;
overflow: hidden;
}
.uni-collapse-content.uni-active {
height: auto;
}
/*卡片视图 */
.uni-card {
background: #fff;
border-radius: 8rpx;
margin:20rpx 0;
position: relative;
box-shadow: 0 2rpx 4rpx rgba(0, 0, 0, .3);
}
.uni-card-content {
font-size: 30rpx;
}
.uni-card-content.image-view{
width: 100%;
margin: 0;
}
.uni-card-content-inner {
position: relative;
padding: 30rpx;
}
.uni-card-footer,
.uni-card-header {
position: relative;
display: flex;
min-height: 50rpx;
padding: 20rpx 30rpx;
justify-content: space-between;
align-items: center;
}
.uni-card-header {
font-size: 36rpx;
}
.uni-card-footer {
color: #6d6d72;
}
.uni-card-footer:before,
.uni-card-header:after {
position: absolute;
top: 0;
right: 0;
left: 0;
height: 2rpx;
content: '';
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
background-color: #c8c7cc;
}
.uni-card-header:after {
top: auto;
bottom: 0;
}
.uni-card-media {
justify-content: flex-start;
}
.uni-card-media-logo {
height: 84rpx;
width: 84rpx;
margin-right: 20rpx;
}
.uni-card-media-body {
height: 84rpx;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: flex-start;
}
.uni-card-media-text-top {
line-height: 36rpx;
font-size: 34rpx;
}
.uni-card-media-text-bottom {
line-height: 30rpx;
font-size: 28rpx;
color: #8f8f94;
}
.uni-card-link {
color: #007AFF;
}
/* 列表 */
.uni-list {
background-color: #FFFFFF;
position: relative;
width: 100%;
display: flex;
flex-direction: column;
}
.uni-list:after {
position: absolute;
z-index: 10;
right: 0;
bottom: 0;
left: 0;
height: 1px;
content: '';
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
background-color: #c8c7cc;
}
.uni-list::before {
position: absolute;
z-index: 10;
right: 0;
top: 0;
left: 0;
height: 1px;
content: '';
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
background-color: #c8c7cc;
}
.uni-list-cell {
position: relative;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.uni-list-cell-hover {
background-color: #eee;
}
.uni-list-cell-pd {
padding: 22rpx 30rpx;
}
.uni-list-cell-left {
white-space: nowrap;
font-size:28rpx;
padding: 0 30rpx;
}
.uni-list-cell-db,
.uni-list-cell-right {
flex: 1;
}
.uni-list-cell::after {
position: absolute;
z-index: 3;
right: 0;
bottom: 0;
left: 30rpx;
height: 1px;
content: '';
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
background-color: #c8c7cc;
}
.uni-list .uni-list-cell:last-child::after {
height: 0rpx;
}
.uni-list-cell-last.uni-list-cell::after {
height: 0rpx;
}
.uni-list-cell-divider {
position: relative;
display: flex;
color: #999;
background-color: #f7f7f7;
padding:15rpx 20rpx;
}
.uni-list-cell-divider::before {
position: absolute;
right: 0;
top: 0;
left: 0;
height: 1px;
content: '';
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
background-color: #c8c7cc;
}
.uni-list-cell-divider::after {
position: absolute;
right: 0;
bottom: 0;
left: 0rpx;
height: 1px;
content: '';
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
background-color: #c8c7cc;
}
.uni-list-cell-navigate {
font-size:30rpx;
padding: 22rpx 30rpx;
line-height: 48rpx;
position: relative;
display: flex;
box-sizing: border-box;
width: 100%;
flex: 1;
justify-content: space-between;
align-items: center;
}
.uni-list-cell-navigate {
padding-right: 36rpx;
}
.uni-navigate-badge {
padding-right: 50rpx;
}
.uni-list-cell-navigate.uni-navigate-right:after {
font-family: uniicons;
content: '\e583';
position: absolute;
right: 24rpx;
top: 50%;
color: #bbb;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.uni-list-cell-navigate.uni-navigate-bottom:after {
font-family: uniicons;
content: '\e581';
position: absolute;
right: 24rpx;
top: 50%;
color: #bbb;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.uni-list-cell-navigate.uni-navigate-bottom.uni-active::after {
font-family: uniicons;
content: '\e580';
position: absolute;
right: 24rpx;
top: 50%;
color: #bbb;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.uni-collapse.uni-list-cell {
flex-direction: column;
}
.uni-list-cell-navigate.uni-active {
background: #eee;
}
.uni-list.uni-collapse {
box-sizing: border-box;
height: 0;
overflow: hidden;
}
.uni-collapse .uni-list-cell {
padding-left: 20rpx;
}
.uni-collapse .uni-list-cell::after {
left: 52rpx;
}
.uni-list.uni-active {
height: auto;
}
/* 三行列表 */
.uni-triplex-row {
display: flex;
flex: 1;
width: 100%;
box-sizing: border-box;
flex-direction: row;
padding: 22rpx 30rpx;
}
.uni-triplex-right,
.uni-triplex-left {
display: flex;
flex-direction: column;
}
.uni-triplex-left {
width: 84%;
}
.uni-triplex-left .uni-title{
padding:8rpx 0;
}
.uni-triplex-left .uni-text, .uni-triplex-left .uni-text-small{color:#999999;}
.uni-triplex-right {
width: 16%;
text-align: right;
}
/* 图文列表 */
.uni-media-list {
padding: 22rpx 30rpx;
box-sizing: border-box;
display: flex;
width: 100%;
flex-direction: row;
}
.uni-navigate-right.uni-media-list {
padding-right: 74rpx;
}
.uni-pull-right {
flex-direction: row-reverse;
}
.uni-pull-right>.uni-media-list-logo {
margin-right: 0rpx;
margin-left: 20rpx;
}
.uni-media-list-logo {
height: 84rpx;
width: 84rpx;
margin-right: 20rpx;
}
.uni-media-list-logo image {
height: 100%;
width: 100%;
}
.uni-media-list-body {
height: 84rpx;
display: flex;
flex: 1;
flex-direction: column;
justify-content: space-between;
align-items: flex-start;
overflow: hidden;
}
.uni-media-list-text-top {
width: 100%;
line-height: 36rpx;
font-size: 30rpx;
}
.uni-media-list-text-bottom {
width: 100%;
line-height: 30rpx;
font-size: 26rpx;
color: #8f8f94;
}
/* 九宫格 */
.uni-grid-9 {
background: #f2f2f2;
width: 750rpx;
display: flex;
flex-direction: row;
flex-wrap: wrap;
border-top: 2rpx solid #eee;
}
.uni-grid-9-item {
width: 250rpx;
height: 200rpx;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
border-bottom: 2rpx solid;
border-right: 2rpx solid;
border-color: #eee;
box-sizing: border-box;
}
.no-border-right {
border-right: none;
}
.uni-grid-9-image {
width: 100rpx;
height: 100rpx;
}
.uni-grid-9-text {
width: 250rpx;
line-height: 4rpx;
height: 40rpx;
text-align: center;
font-size: 30rpx;
}
.uni-grid-9-item-hover {
background: rgba(0, 0, 0, 0.1);
}
/* 上传 */
.uni-uploader {
flex: 1;
flex-direction: column;
}
.uni-uploader-head {
display: flex;
flex-direction: row;
justify-content: space-between;
}
.uni-uploader-info {
color: #B2B2B2;
}
.uni-uploader-body {
margin-top: 16rpx;
}
.uni-uploader__files {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.uni-uploader__file {
margin: 10rpx;
width: 210rpx;
height: 210rpx;
}
.uni-uploader__img {
display: block;
width: 210rpx;
height: 210rpx;
}
.uni-uploader__input-box {
position: relative;
margin:10rpx;
width: 208rpx;
height: 208rpx;
border: 2rpx solid #D9D9D9;
}
.uni-uploader__input-box:before,
.uni-uploader__input-box:after {
content: " ";
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
background-color: #D9D9D9;
}
.uni-uploader__input-box:before {
width: 4rpx;
height: 79rpx;
}
.uni-uploader__input-box:after {
width: 79rpx;
height: 4rpx;
}
.uni-uploader__input-box:active {
border-color: #999999;
}
.uni-uploader__input-box:active:before,
.uni-uploader__input-box:active:after {
background-color: #999999;
}
.uni-uploader__input {
position: absolute;
z-index: 1;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
}
/*问题反馈*/
.feedback-title {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
padding: 20rpx;
color: #8f8f94;
font-size: 28rpx;
}
.feedback-star-view.feedback-title {
justify-content: flex-start;
margin: 0;
}
.feedback-quick {
position: relative;
padding-right: 40rpx;
}
.feedback-quick:after {
font-family: uniicons;
font-size: 40rpx;
content: '\e581';
position: absolute;
right: 0;
top: 50%;
color: #bbb;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.feedback-body {
background: #fff;
}
.feedback-textare {
height: 200rpx;
font-size: 34rpx;
line-height: 50rpx;
width: 100%;
box-sizing: border-box;
padding: 20rpx 30rpx 0;
}
.feedback-input {
font-size: 34rpx;
height: 50rpx;
min-height: 50rpx;
padding: 15rpx 20rpx;
line-height: 50rpx;
}
.feedback-uploader {
padding: 22rpx 20rpx;
}
.feedback-star {
font-family: uniicons;
font-size: 40rpx;
margin-left: 6rpx;
}
.feedback-star-view {
margin-left: 20rpx;
}
.feedback-star:after {
content: '\e408';
}
.feedback-star.active {
color: #FFB400;
}
.feedback-star.active:after {
content: '\e438';
}
.feedback-submit {
background: #007AFF;
color: #FFFFFF;
margin: 20rpx;
}
/* input group */
.uni-input-group {
position: relative;
padding: 0;
border: 0;
background-color: #fff;
}
.uni-input-group:before {
position: absolute;
top: 0;
right: 0;
left: 0;
height: 2rpx;
content: '';
transform: scaleY(.5);
background-color: #c8c7cc;
}
.uni-input-group:after {
position: absolute;
right: 0;
bottom: 0;
left: 0;
height: 2rpx;
content: '';
transform: scaleY(.5);
background-color: #c8c7cc;
}
.uni-input-row {
position: relative;
display: flex;
flex-direction: row;
font-size:28rpx;
padding: 22rpx 30rpx;
justify-content: space-between;
}
.uni-input-group .uni-input-row:after {
position: absolute;
right: 0;
bottom: 0;
left: 30rpx;
height: 2rpx;
content: '';
transform: scaleY(.5);
background-color: #c8c7cc;
}
.uni-input-row label {
line-height: 70rpx;
}
/* textarea */
.uni-textarea{
width:100%;
background:#FFF;
}
.uni-textarea textarea{
width:96%;
padding:18rpx 2%;
line-height:1.6;
font-size:28rpx;
height:150rpx;
}
/* tab bar */
.uni-tab-bar {
display: flex;
flex: 1;
flex-direction: column;
overflow: hidden;
height: 100%;
}
.uni-tab-bar .list {
width: 750rpx;
height: 100%;
}
.uni-swiper-tab {
width: 100%;
white-space: nowrap;
line-height: 100rpx;
height: 100rpx;
border-bottom: 1px solid #c8c7cc;
}
.swiper-tab-list {
font-size: 30rpx;
width: 150rpx;
display: inline-block;
text-align: center;
color: #555;
}
.uni-tab-bar .active {
color: #007AFF;
}
.uni-tab-bar .swiper-box {
flex: 1;
width: 100%;
height: calc(100% - 100rpx);
}
.uni-tab-bar-loading{
padding:20rpx 0;
}
/* comment */
.uni-comment{padding:5rpx 0; display: flex; flex-grow:1; flex-direction: column;}
.uni-comment-list{flex-wrap:nowrap; padding:10rpx 0; margin:10rpx 0; width:100%; display: flex;}
.uni-comment-face{width:70rpx; height:70rpx; border-radius:100%; margin-right:20rpx; flex-shrink:0; overflow:hidden;}
.uni-comment-face image{width:100%; border-radius:100%;}
.uni-comment-body{width:100%;}
.uni-comment-top{line-height:1.5em; justify-content:space-between;}
.uni-comment-top text{color:#0A98D5; font-size:24rpx;}
.uni-comment-date{line-height:38rpx; flex-direction:row; justify-content:space-between; display:flex !important; flex-grow:1;}
.uni-comment-date view{color:#666666; font-size:24rpx; line-height:38rpx;}
.uni-comment-content{line-height:1.6em; font-size:28rpx; padding:8rpx 0;}
.uni-comment-replay-btn{background:#FFF; font-size:24rpx; line-height:28rpx; padding:5rpx 20rpx; border-radius:30rpx; color:#333 !important; margin:0 10rpx;}
/* swiper msg */
.uni-swiper-msg{width:100%; padding:12rpx 0; flex-wrap:nowrap; display:flex;}
.uni-swiper-msg-icon{width:50rpx; margin-right:20rpx;}
.uni-swiper-msg-icon image{width:100%; flex-shrink:0;}
.uni-swiper-msg swiper{width:100%; height:50rpx;}
.uni-swiper-msg swiper-item{line-height:50rpx;}
/* product */
.uni-product-list {
display: flex;
width: 100%;
flex-wrap: wrap;
flex-direction: row;
}
.uni-product {
padding: 20rpx;
display: flex;
flex-direction: column;
}
.image-view {
height: 330rpx;
width: 330rpx;
margin:12rpx 0;
}
.uni-product-image {
height: 330rpx;
width: 330rpx;
}
.uni-product-title {
width: 300rpx;
word-break: break-all;
display: -webkit-box;
overflow: hidden;
line-height:1.5;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.uni-product-price {
margin-top:10rpx;
font-size: 28rpx;
line-height:1.5;
position: relative;
}
.uni-product-price-original {
color: #e80080;
}
.uni-product-price-favour {
color: #888888;
text-decoration: line-through;
margin-left: 10rpx;
}
.uni-product-tip {
position: absolute;
right: 10rpx;
background-color: #ff3333;
color: #ffffff;
padding: 0 10rpx;
border-radius: 5rpx;
}
/* timeline */
.uni-timeline {
margin: 35rpx 0;
display: flex;
flex-direction: column;
position: relative;
}
.uni-timeline-item {
display: flex;
flex-direction: row;
position: relative;
padding-bottom: 20rpx;
box-sizing: border-box;
overflow: hidden;
}
.uni-timeline-item .uni-timeline-item-keynode {
width: 160rpx;
flex-shrink: 0;
box-sizing: border-box;
padding-right: 20rpx;
text-align: right;
line-height: 65rpx;
}
.uni-timeline-item .uni-timeline-item-divider {
flex-shrink: 0;
position: relative;
width: 30rpx;
height: 30rpx;
top: 15rpx;
border-radius: 50%;
background-color: #bbb;
}
.uni-timeline-item-divider::before,
.uni-timeline-item-divider::after {
position: absolute;
left: 15rpx;
width: 1rpx;
height: 100vh;
content: '';
background: inherit;
}
.uni-timeline-item-divider::before {
bottom: 100%;
}
.uni-timeline-item-divider::after {
top: 100%;
}
.uni-timeline-last-item .uni-timeline-item-divider:after {
display: none;
}
.uni-timeline-first-item .uni-timeline-item-divider:before {
display: none;
}
.uni-timeline-item .uni-timeline-item-content {
padding-left: 20rpx;
}
.uni-timeline-last-item .bottom-border::after{
display: none;
}
.uni-timeline-item-content .datetime{
color: #CCCCCC;
}
/* 自定义节点颜色 */
.uni-timeline-last-item .uni-timeline-item-divider{
background-color: #1AAD19;
}
/* uni-icon */
.uni-icon {
font-family: uniicons;
font-size: 24px;
font-weight: normal;
font-style: normal;
line-height: 1;
display: inline-block;
text-decoration: none;
-webkit-font-smoothing: antialiased;
}
.uni-icon.uni-active {
color: #007aff;
}
.uni-icon-contact:before {
content: '\e100';
}
.uni-icon-person:before {
content: '\e101';
}
.uni-icon-personadd:before {
content: '\e102';
}
.uni-icon-contact-filled:before {
content: '\e130';
}
.uni-icon-person-filled:before {
content: '\e131';
}
.uni-icon-personadd-filled:before {
content: '\e132';
}
.uni-icon-phone:before {
content: '\e200';
}
.uni-icon-email:before {
content: '\e201';
}
.uni-icon-chatbubble:before {
content: '\e202';
}
.uni-icon-chatboxes:before {
content: '\e203';
}
.uni-icon-phone-filled:before {
content: '\e230';
}
.uni-icon-email-filled:before {
content: '\e231';
}
.uni-icon-chatbubble-filled:before {
content: '\e232';
}
.uni-icon-chatboxes-filled:before {
content: '\e233';
}
.uni-icon-weibo:before {
content: '\e260';
}
.uni-icon-weixin:before {
content: '\e261';
}
.uni-icon-pengyouquan:before {
content: '\e262';
}
.uni-icon-chat:before {
content: '\e263';
}
.uni-icon-qq:before {
content: '\e264';
}
.uni-icon-videocam:before {
content: '\e300';
}
.uni-icon-camera:before {
content: '\e301';
}
.uni-icon-mic:before {
content: '\e302';
}
.uni-icon-location:before {
content: '\e303';
}
.uni-icon-mic-filled:before,
.uni-icon-speech:before {
content: '\e332';
}
.uni-icon-location-filled:before {
content: '\e333';
}
.uni-icon-micoff:before {
content: '\e360';
}
.uni-icon-image:before {
content: '\e363';
}
.uni-icon-map:before {
content: '\e364';
}
.uni-icon-compose:before {
content: '\e400';
}
.uni-icon-trash:before {
content: '\e401';
}
.uni-icon-upload:before {
content: '\e402';
}
.uni-icon-download:before {
content: '\e403';
}
.uni-icon-close:before {
content: '\e404';
}
.uni-icon-redo:before {
content: '\e405';
}
.uni-icon-undo:before {
content: '\e406';
}
.uni-icon-refresh:before {
content: '\e407';
}
.uni-icon-star:before {
content: '\e408';
}
.uni-icon-plus:before {
content: '\e409';
}
.uni-icon-minus:before {
content: '\e410';
}
.uni-icon-circle:before,
.uni-icon-checkbox:before {
content: '\e411';
}
.uni-icon-close-filled:before,
.uni-icon-clear:before {
content: '\e434';
}
.uni-icon-refresh-filled:before {
content: '\e437';
}
.uni-icon-star-filled:before {
content: '\e438';
}
.uni-icon-plus-filled:before {
content: '\e439';
}
.uni-icon-minus-filled:before {
content: '\e440';
}
.uni-icon-circle-filled:before {
content: '\e441';
}
.uni-icon-checkbox-filled:before {
content: '\e442';
}
.uni-icon-closeempty:before {
content: '\e460';
}
.uni-icon-refreshempty:before {
content: '\e461';
}
.uni-icon-reload:before {
content: '\e462';
}
.uni-icon-starhalf:before {
content: '\e463';
}
.uni-icon-spinner:before {
content: '\e464';
}
.uni-icon-spinner-cycle:before {
content: '\e465';
}
.uni-icon-search:before {
content: '\e466';
}
.uni-icon-plusempty:before {
content: '\e468';
}
.uni-icon-forward:before {
content: '\e470';
}
.uni-icon-back:before,
.uni-icon-left-nav:before {
content: '\e471';
}
.uni-icon-checkmarkempty:before {
content: '\e472';
}
.uni-icon-home:before {
content: '\e500';
}
.uni-icon-navigate:before {
content: '\e501';
}
.uni-icon-gear:before {
content: '\e502';
}
.uni-icon-paperplane:before {
content: '\e503';
}
.uni-icon-info:before {
content: '\e504';
}
.uni-icon-help:before {
content: '\e505';
}
.uni-icon-locked:before {
content: '\e506';
}
.uni-icon-more:before {
content: '\e507';
}
.uni-icon-flag:before {
content: '\e508';
}
.uni-icon-home-filled:before {
content: '\e530';
}
.uni-icon-gear-filled:before {
content: '\e532';
}
.uni-icon-info-filled:before {
content: '\e534';
}
.uni-icon-help-filled:before {
content: '\e535';
}
.uni-icon-more-filled:before {
content: '\e537';
}
.uni-icon-settings:before {
content: '\e560';
}
.uni-icon-list:before {
content: '\e562';
}
.uni-icon-bars:before {
content: '\e563';
}
.uni-icon-loop:before {
content: '\e565';
}
.uni-icon-paperclip:before {
content: '\e567';
}
.uni-icon-eye:before {
content: '\e568';
}
.uni-icon-arrowup:before {
content: '\e580';
}
.uni-icon-arrowdown:before {
content: '\e581';
}
.uni-icon-arrowleft:before {
content: '\e582';
}
.uni-icon-arrowright:before {
content: '\e583';
}
.uni-icon-arrowthinup:before {
content: '\e584';
}
.uni-icon-arrowthindown:before {
content: '\e585';
}
.uni-icon-arrowthinleft:before {
content: '\e586';
}
.uni-icon-arrowthinright:before {
content: '\e587';
}
.uni-icon-pulldown:before {
content: '\e588';
}
.uni-icon-scan:before {
content: "\e612";
}
/* 分界线 */
.uni-divider{
height: 110rpx;
display: flex;
align-items:center;
justify-content: center;
position: relative;
}
.uni-divider__content{
font-size: 28rpx;
color: #999;
padding: 0 20rpx;
position: relative;
z-index: 101;
background: #F4F5F6;
}
.uni-divider__line{
background-color: #CCCCCC;
height: 1px;
width: 100%;
position: absolute;
z-index: 100;
top: 50%;
left: 0;
transform: translateY(50%);
}
import Vuex from '@/store/index.js'
export function univerifyLogin() {
const commit = Vuex.commit;
const PROVIDER = 'univerify';
/**
* reject(true) 点击其他登录方式
* reject(false) 关闭登录框
*/
return new Promise((resolve, reject) => {
uni.getProvider({
service: 'oauth',
success: (res) => {
if (res.provider.indexOf(PROVIDER) !== -1) {
// 一键登录已在APP onLaunch的时候进行了预登陆,可以显著提高登录速度。登录成功后,预登陆状态会重置
uni.login({
provider: PROVIDER,
success: (res) => {
uni.closeAuthView();
uni.showLoading();
uniCloud.callFunction({
name: 'user-center',
data: {
action: 'loginByUniverify',
params: res.authResult
},
success: (e) => {
console.log('login success', e);
if (e.result.code == 0) {
const username = e.result.username || e.result.mobile || '一键登录新用户'
uni.setStorageSync('uni_id_token', e.result.token)
uni.setStorageSync('username', username)
uni.setStorageSync('login_type', 'online')
commit('login', username)
resolve();
uni.switchTab({
url: '../main/main',
});
} else {
uni.showModal({
title: `登录失败: ${e.result.code}`,
content: e.result.message,
showCancel: false
})
console.log('登录失败', e);
e.result.errMsg = e.result.message;
}
},
fail: (e) => {
uni.showModal({
title: `登录失败`,
content: e.errMsg,
showCancel: false
})
},
complete: () => {
uni.hideLoading()
}
})
},
fail: (err) => {
console.error('授权登录失败:' + JSON.stringify(err));
// 一键登录点击其他登录方式
if (err.code == 30002) {
uni.closeAuthView();
reject(true);
return;
}
// 关闭登录
if (err.code == 30003) {
uni.closeAuthView();
reject(false);
return;
}
reject(err);
}
})
} else {
reject();
}
},
fail: (err) => {
console.error('获取服务供应商失败:' + err.errMsg);
reject(err)
}
});
})
}
export function univerifyErrorHandler(err, cb) {
if (!err) {
cb && cb()
return
};
const state = Vuex.state;
const obj = {
/* showCancel: true,
cancelText: '其他登录方式',
success(res) {
if (res.cancel) {
cb && cb()
}
} */
}
switch (true) {
// 未开通
case err.code == 1000:
uni.showModal(Object.assign({
title: `登录失败`,
content: `${err.errMsg},错误码:${err.code}\n开通指南:https://ask.dcloud.net.cn/article/37965`,
}, obj));
break;
// 预登陆失败
case err.code == 30005:
uni.showModal(Object.assign({
showCancel: false,
title: `预登录失败`,
content: `${err.errMsg},错误码:${err.code}`
}, obj));
break;
//用户关闭验证界面
case err.code != 30003:
uni.showModal(Object.assign({
showCancel: false,
title: `登录失败`,
content: `${err.errMsg},错误码:${err.code}`,
}, obj));
break;
}
}
//---------------------------------------------------------------------
// github https://github.com/Sansnn/uQRCode
//---------------------------------------------------------------------
let uQRCode = {};
(function() {
//---------------------------------------------------------------------
// QRCode for JavaScript
//
// Copyright (c) 2009 Kazuhiko Arase
//
// URL: http://www.d-project.com/
//
// Licensed under the MIT license:
// http://www.opensource.org/licenses/mit-license.php
//
// The word "QR Code" is registered trademark of
// DENSO WAVE INCORPORATED
// http://www.denso-wave.com/qrcode/faqpatent-e.html
//
//---------------------------------------------------------------------
//---------------------------------------------------------------------
// QR8bitByte
//---------------------------------------------------------------------
function QR8bitByte(data) {
this.mode = QRMode.MODE_8BIT_BYTE;
this.data = data;
}
QR8bitByte.prototype = {
getLength: function(buffer) {
return this.data.length;
},
write: function(buffer) {
for (var i = 0; i < this.data.length; i++) {
// not JIS ...
buffer.put(this.data.charCodeAt(i), 8);
}
}
};
//---------------------------------------------------------------------
// QRCode
//---------------------------------------------------------------------
function QRCode(typeNumber, errorCorrectLevel) {
this.typeNumber = typeNumber;
this.errorCorrectLevel = errorCorrectLevel;
this.modules = null;
this.moduleCount = 0;
this.dataCache = null;
this.dataList = new Array();
}
QRCode.prototype = {
addData: function(data) {
var newData = new QR8bitByte(data);
this.dataList.push(newData);
this.dataCache = null;
},
isDark: function(row, col) {
if (row < 0 || this.moduleCount <= row || col < 0 || this.moduleCount <= col) {
throw new Error(row + "," + col);
}
return this.modules[row][col];
},
getModuleCount: function() {
return this.moduleCount;
},
make: function() {
// Calculate automatically typeNumber if provided is < 1
if (this.typeNumber < 1) {
var typeNumber = 1;
for (typeNumber = 1; typeNumber < 40; typeNumber++) {
var rsBlocks = QRRSBlock.getRSBlocks(typeNumber, this.errorCorrectLevel);
var buffer = new QRBitBuffer();
var totalDataCount = 0;
for (var i = 0; i < rsBlocks.length; i++) {
totalDataCount += rsBlocks[i].dataCount;
}
for (var i = 0; i < this.dataList.length; i++) {
var data = this.dataList[i];
buffer.put(data.mode, 4);
buffer.put(data.getLength(), QRUtil.getLengthInBits(data.mode, typeNumber));
data.write(buffer);
}
if (buffer.getLengthInBits() <= totalDataCount * 8)
break;
}
this.typeNumber = typeNumber;
}
this.makeImpl(false, this.getBestMaskPattern());
},
makeImpl: function(test, maskPattern) {
this.moduleCount = this.typeNumber * 4 + 17;
this.modules = new Array(this.moduleCount);
for (var row = 0; row < this.moduleCount; row++) {
this.modules[row] = new Array(this.moduleCount);
for (var col = 0; col < this.moduleCount; col++) {
this.modules[row][col] = null; //(col + row) % 3;
}
}
this.setupPositionProbePattern(0, 0);
this.setupPositionProbePattern(this.moduleCount - 7, 0);
this.setupPositionProbePattern(0, this.moduleCount - 7);
this.setupPositionAdjustPattern();
this.setupTimingPattern();
this.setupTypeInfo(test, maskPattern);
if (this.typeNumber >= 7) {
this.setupTypeNumber(test);
}
if (this.dataCache == null) {
this.dataCache = QRCode.createData(this.typeNumber, this.errorCorrectLevel, this.dataList);
}
this.mapData(this.dataCache, maskPattern);
},
setupPositionProbePattern: function(row, col) {
for (var r = -1; r <= 7; r++) {
if (row + r <= -1 || this.moduleCount <= row + r) continue;
for (var c = -1; c <= 7; c++) {
if (col + c <= -1 || this.moduleCount <= col + c) continue;
if ((0 <= r && r <= 6 && (c == 0 || c == 6)) ||
(0 <= c && c <= 6 && (r == 0 || r == 6)) ||
(2 <= r && r <= 4 && 2 <= c && c <= 4)) {
this.modules[row + r][col + c] = true;
} else {
this.modules[row + r][col + c] = false;
}
}
}
},
getBestMaskPattern: function() {
var minLostPoint = 0;
var pattern = 0;
for (var i = 0; i < 8; i++) {
this.makeImpl(true, i);
var lostPoint = QRUtil.getLostPoint(this);
if (i == 0 || minLostPoint > lostPoint) {
minLostPoint = lostPoint;
pattern = i;
}
}
return pattern;
},
createMovieClip: function(target_mc, instance_name, depth) {
var qr_mc = target_mc.createEmptyMovieClip(instance_name, depth);
var cs = 1;
this.make();
for (var row = 0; row < this.modules.length; row++) {
var y = row * cs;
for (var col = 0; col < this.modules[row].length; col++) {
var x = col * cs;
var dark = this.modules[row][col];
if (dark) {
qr_mc.beginFill(0, 100);
qr_mc.moveTo(x, y);
qr_mc.lineTo(x + cs, y);
qr_mc.lineTo(x + cs, y + cs);
qr_mc.lineTo(x, y + cs);
qr_mc.endFill();
}
}
}
return qr_mc;
},
setupTimingPattern: function() {
for (var r = 8; r < this.moduleCount - 8; r++) {
if (this.modules[r][6] != null) {
continue;
}
this.modules[r][6] = (r % 2 == 0);
}
for (var c = 8; c < this.moduleCount - 8; c++) {
if (this.modules[6][c] != null) {
continue;
}
this.modules[6][c] = (c % 2 == 0);
}
},
setupPositionAdjustPattern: function() {
var pos = QRUtil.getPatternPosition(this.typeNumber);
for (var i = 0; i < pos.length; i++) {
for (var j = 0; j < pos.length; j++) {
var row = pos[i];
var col = pos[j];
if (this.modules[row][col] != null) {
continue;
}
for (var r = -2; r <= 2; r++) {
for (var c = -2; c <= 2; c++) {
if (r == -2 || r == 2 || c == -2 || c == 2 ||
(r == 0 && c == 0)) {
this.modules[row + r][col + c] = true;
} else {
this.modules[row + r][col + c] = false;
}
}
}
}
}
},
setupTypeNumber: function(test) {
var bits = QRUtil.getBCHTypeNumber(this.typeNumber);
for (var i = 0; i < 18; i++) {
var mod = (!test && ((bits >> i) & 1) == 1);
this.modules[Math.floor(i / 3)][i % 3 + this.moduleCount - 8 - 3] = mod;
}
for (var i = 0; i < 18; i++) {
var mod = (!test && ((bits >> i) & 1) == 1);
this.modules[i % 3 + this.moduleCount - 8 - 3][Math.floor(i / 3)] = mod;
}
},
setupTypeInfo: function(test, maskPattern) {
var data = (this.errorCorrectLevel << 3) | maskPattern;
var bits = QRUtil.getBCHTypeInfo(data);
// vertical
for (var i = 0; i < 15; i++) {
var mod = (!test && ((bits >> i) & 1) == 1);
if (i < 6) {
this.modules[i][8] = mod;
} else if (i < 8) {
this.modules[i + 1][8] = mod;
} else {
this.modules[this.moduleCount - 15 + i][8] = mod;
}
}
// horizontal
for (var i = 0; i < 15; i++) {
var mod = (!test && ((bits >> i) & 1) == 1);
if (i < 8) {
this.modules[8][this.moduleCount - i - 1] = mod;
} else if (i < 9) {
this.modules[8][15 - i - 1 + 1] = mod;
} else {
this.modules[8][15 - i - 1] = mod;
}
}
// fixed module
this.modules[this.moduleCount - 8][8] = (!test);
},
mapData: function(data, maskPattern) {
var inc = -1;
var row = this.moduleCount - 1;
var bitIndex = 7;
var byteIndex = 0;
for (var col = this.moduleCount - 1; col > 0; col -= 2) {
if (col == 6) col--;
while (true) {
for (var c = 0; c < 2; c++) {
if (this.modules[row][col - c] == null) {
var dark = false;
if (byteIndex < data.length) {
dark = (((data[byteIndex] >>> bitIndex) & 1) == 1);
}
var mask = QRUtil.getMask(maskPattern, row, col - c);
if (mask) {
dark = !dark;
}
this.modules[row][col - c] = dark;
bitIndex--;
if (bitIndex == -1) {
byteIndex++;
bitIndex = 7;
}
}
}
row += inc;
if (row < 0 || this.moduleCount <= row) {
row -= inc;
inc = -inc;
break;
}
}
}
}
};
QRCode.PAD0 = 0xEC;
QRCode.PAD1 = 0x11;
QRCode.createData = function(typeNumber, errorCorrectLevel, dataList) {
var rsBlocks = QRRSBlock.getRSBlocks(typeNumber, errorCorrectLevel);
var buffer = new QRBitBuffer();
for (var i = 0; i < dataList.length; i++) {
var data = dataList[i];
buffer.put(data.mode, 4);
buffer.put(data.getLength(), QRUtil.getLengthInBits(data.mode, typeNumber));
data.write(buffer);
}
// calc num max data.
var totalDataCount = 0;
for (var i = 0; i < rsBlocks.length; i++) {
totalDataCount += rsBlocks[i].dataCount;
}
if (buffer.getLengthInBits() > totalDataCount * 8) {
throw new Error("code length overflow. (" +
buffer.getLengthInBits() +
">" +
totalDataCount * 8 +
")");
}
// end code
if (buffer.getLengthInBits() + 4 <= totalDataCount * 8) {
buffer.put(0, 4);
}
// padding
while (buffer.getLengthInBits() % 8 != 0) {
buffer.putBit(false);
}
// padding
while (true) {
if (buffer.getLengthInBits() >= totalDataCount * 8) {
break;
}
buffer.put(QRCode.PAD0, 8);
if (buffer.getLengthInBits() >= totalDataCount * 8) {
break;
}
buffer.put(QRCode.PAD1, 8);
}
return QRCode.createBytes(buffer, rsBlocks);
}
QRCode.createBytes = function(buffer, rsBlocks) {
var offset = 0;
var maxDcCount = 0;
var maxEcCount = 0;
var dcdata = new Array(rsBlocks.length);
var ecdata = new Array(rsBlocks.length);
for (var r = 0; r < rsBlocks.length; r++) {
var dcCount = rsBlocks[r].dataCount;
var ecCount = rsBlocks[r].totalCount - dcCount;
maxDcCount = Math.max(maxDcCount, dcCount);
maxEcCount = Math.max(maxEcCount, ecCount);
dcdata[r] = new Array(dcCount);
for (var i = 0; i < dcdata[r].length; i++) {
dcdata[r][i] = 0xff & buffer.buffer[i + offset];
}
offset += dcCount;
var rsPoly = QRUtil.getErrorCorrectPolynomial(ecCount);
var rawPoly = new QRPolynomial(dcdata[r], rsPoly.getLength() - 1);
var modPoly = rawPoly.mod(rsPoly);
ecdata[r] = new Array(rsPoly.getLength() - 1);
for (var i = 0; i < ecdata[r].length; i++) {
var modIndex = i + modPoly.getLength() - ecdata[r].length;
ecdata[r][i] = (modIndex >= 0) ? modPoly.get(modIndex) : 0;
}
}
var totalCodeCount = 0;
for (var i = 0; i < rsBlocks.length; i++) {
totalCodeCount += rsBlocks[i].totalCount;
}
var data = new Array(totalCodeCount);
var index = 0;
for (var i = 0; i < maxDcCount; i++) {
for (var r = 0; r < rsBlocks.length; r++) {
if (i < dcdata[r].length) {
data[index++] = dcdata[r][i];
}
}
}
for (var i = 0; i < maxEcCount; i++) {
for (var r = 0; r < rsBlocks.length; r++) {
if (i < ecdata[r].length) {
data[index++] = ecdata[r][i];
}
}
}
return data;
}
//---------------------------------------------------------------------
// QRMode
//---------------------------------------------------------------------
var QRMode = {
MODE_NUMBER: 1 << 0,
MODE_ALPHA_NUM: 1 << 1,
MODE_8BIT_BYTE: 1 << 2,
MODE_KANJI: 1 << 3
};
//---------------------------------------------------------------------
// QRErrorCorrectLevel
//---------------------------------------------------------------------
var QRErrorCorrectLevel = {
L: 1,
M: 0,
Q: 3,
H: 2
};
//---------------------------------------------------------------------
// QRMaskPattern
//---------------------------------------------------------------------
var QRMaskPattern = {
PATTERN000: 0,
PATTERN001: 1,
PATTERN010: 2,
PATTERN011: 3,
PATTERN100: 4,
PATTERN101: 5,
PATTERN110: 6,
PATTERN111: 7
};
//---------------------------------------------------------------------
// QRUtil
//---------------------------------------------------------------------
var QRUtil = {
PATTERN_POSITION_TABLE: [
[],
[6, 18],
[6, 22],
[6, 26],
[6, 30],
[6, 34],
[6, 22, 38],
[6, 24, 42],
[6, 26, 46],
[6, 28, 50],
[6, 30, 54],
[6, 32, 58],
[6, 34, 62],
[6, 26, 46, 66],
[6, 26, 48, 70],
[6, 26, 50, 74],
[6, 30, 54, 78],
[6, 30, 56, 82],
[6, 30, 58, 86],
[6, 34, 62, 90],
[6, 28, 50, 72, 94],
[6, 26, 50, 74, 98],
[6, 30, 54, 78, 102],
[6, 28, 54, 80, 106],
[6, 32, 58, 84, 110],
[6, 30, 58, 86, 114],
[6, 34, 62, 90, 118],
[6, 26, 50, 74, 98, 122],
[6, 30, 54, 78, 102, 126],
[6, 26, 52, 78, 104, 130],
[6, 30, 56, 82, 108, 134],
[6, 34, 60, 86, 112, 138],
[6, 30, 58, 86, 114, 142],
[6, 34, 62, 90, 118, 146],
[6, 30, 54, 78, 102, 126, 150],
[6, 24, 50, 76, 102, 128, 154],
[6, 28, 54, 80, 106, 132, 158],
[6, 32, 58, 84, 110, 136, 162],
[6, 26, 54, 82, 110, 138, 166],
[6, 30, 58, 86, 114, 142, 170]
],
G15: (1 << 10) | (1 << 8) | (1 << 5) | (1 << 4) | (1 << 2) | (1 << 1) | (1 << 0),
G18: (1 << 12) | (1 << 11) | (1 << 10) | (1 << 9) | (1 << 8) | (1 << 5) | (1 << 2) | (1 << 0),
G15_MASK: (1 << 14) | (1 << 12) | (1 << 10) | (1 << 4) | (1 << 1),
getBCHTypeInfo: function(data) {
var d = data << 10;
while (QRUtil.getBCHDigit(d) - QRUtil.getBCHDigit(QRUtil.G15) >= 0) {
d ^= (QRUtil.G15 << (QRUtil.getBCHDigit(d) - QRUtil.getBCHDigit(QRUtil.G15)));
}
return ((data << 10) | d) ^ QRUtil.G15_MASK;
},
getBCHTypeNumber: function(data) {
var d = data << 12;
while (QRUtil.getBCHDigit(d) - QRUtil.getBCHDigit(QRUtil.G18) >= 0) {
d ^= (QRUtil.G18 << (QRUtil.getBCHDigit(d) - QRUtil.getBCHDigit(QRUtil.G18)));
}
return (data << 12) | d;
},
getBCHDigit: function(data) {
var digit = 0;
while (data != 0) {
digit++;
data >>>= 1;
}
return digit;
},
getPatternPosition: function(typeNumber) {
return QRUtil.PATTERN_POSITION_TABLE[typeNumber - 1];
},
getMask: function(maskPattern, i, j) {
switch (maskPattern) {
case QRMaskPattern.PATTERN000:
return (i + j) % 2 == 0;
case QRMaskPattern.PATTERN001:
return i % 2 == 0;
case QRMaskPattern.PATTERN010:
return j % 3 == 0;
case QRMaskPattern.PATTERN011:
return (i + j) % 3 == 0;
case QRMaskPattern.PATTERN100:
return (Math.floor(i / 2) + Math.floor(j / 3)) % 2 == 0;
case QRMaskPattern.PATTERN101:
return (i * j) % 2 + (i * j) % 3 == 0;
case QRMaskPattern.PATTERN110:
return ((i * j) % 2 + (i * j) % 3) % 2 == 0;
case QRMaskPattern.PATTERN111:
return ((i * j) % 3 + (i + j) % 2) % 2 == 0;
default:
throw new Error("bad maskPattern:" + maskPattern);
}
},
getErrorCorrectPolynomial: function(errorCorrectLength) {
var a = new QRPolynomial([1], 0);
for (var i = 0; i < errorCorrectLength; i++) {
a = a.multiply(new QRPolynomial([1, QRMath.gexp(i)], 0));
}
return a;
},
getLengthInBits: function(mode, type) {
if (1 <= type && type < 10) {
// 1 - 9
switch (mode) {
case QRMode.MODE_NUMBER:
return 10;
case QRMode.MODE_ALPHA_NUM:
return 9;
case QRMode.MODE_8BIT_BYTE:
return 8;
case QRMode.MODE_KANJI:
return 8;
default:
throw new Error("mode:" + mode);
}
} else if (type < 27) {
// 10 - 26
switch (mode) {
case QRMode.MODE_NUMBER:
return 12;
case QRMode.MODE_ALPHA_NUM:
return 11;
case QRMode.MODE_8BIT_BYTE:
return 16;
case QRMode.MODE_KANJI:
return 10;
default:
throw new Error("mode:" + mode);
}
} else if (type < 41) {
// 27 - 40
switch (mode) {
case QRMode.MODE_NUMBER:
return 14;
case QRMode.MODE_ALPHA_NUM:
return 13;
case QRMode.MODE_8BIT_BYTE:
return 16;
case QRMode.MODE_KANJI:
return 12;
default:
throw new Error("mode:" + mode);
}
} else {
throw new Error("type:" + type);
}
},
getLostPoint: function(qrCode) {
var moduleCount = qrCode.getModuleCount();
var lostPoint = 0;
// LEVEL1
for (var row = 0; row < moduleCount; row++) {
for (var col = 0; col < moduleCount; col++) {
var sameCount = 0;
var dark = qrCode.isDark(row, col);
for (var r = -1; r <= 1; r++) {
if (row + r < 0 || moduleCount <= row + r) {
continue;
}
for (var c = -1; c <= 1; c++) {
if (col + c < 0 || moduleCount <= col + c) {
continue;
}
if (r == 0 && c == 0) {
continue;
}
if (dark == qrCode.isDark(row + r, col + c)) {
sameCount++;
}
}
}
if (sameCount > 5) {
lostPoint += (3 + sameCount - 5);
}
}
}
// LEVEL2
for (var row = 0; row < moduleCount - 1; row++) {
for (var col = 0; col < moduleCount - 1; col++) {
var count = 0;
if (qrCode.isDark(row, col)) count++;
if (qrCode.isDark(row + 1, col)) count++;
if (qrCode.isDark(row, col + 1)) count++;
if (qrCode.isDark(row + 1, col + 1)) count++;
if (count == 0 || count == 4) {
lostPoint += 3;
}
}
}
// LEVEL3
for (var row = 0; row < moduleCount; row++) {
for (var col = 0; col < moduleCount - 6; col++) {
if (qrCode.isDark(row, col) &&
!qrCode.isDark(row, col + 1) &&
qrCode.isDark(row, col + 2) &&
qrCode.isDark(row, col + 3) &&
qrCode.isDark(row, col + 4) &&
!qrCode.isDark(row, col + 5) &&
qrCode.isDark(row, col + 6)) {
lostPoint += 40;
}
}
}
for (var col = 0; col < moduleCount; col++) {
for (var row = 0; row < moduleCount - 6; row++) {
if (qrCode.isDark(row, col) &&
!qrCode.isDark(row + 1, col) &&
qrCode.isDark(row + 2, col) &&
qrCode.isDark(row + 3, col) &&
qrCode.isDark(row + 4, col) &&
!qrCode.isDark(row + 5, col) &&
qrCode.isDark(row + 6, col)) {
lostPoint += 40;
}
}
}
// LEVEL4
var darkCount = 0;
for (var col = 0; col < moduleCount; col++) {
for (var row = 0; row < moduleCount; row++) {
if (qrCode.isDark(row, col)) {
darkCount++;
}
}
}
var ratio = Math.abs(100 * darkCount / moduleCount / moduleCount - 50) / 5;
lostPoint += ratio * 10;
return lostPoint;
}
};
//---------------------------------------------------------------------
// QRMath
//---------------------------------------------------------------------
var QRMath = {
glog: function(n) {
if (n < 1) {
throw new Error("glog(" + n + ")");
}
return QRMath.LOG_TABLE[n];
},
gexp: function(n) {
while (n < 0) {
n += 255;
}
while (n >= 256) {
n -= 255;
}
return QRMath.EXP_TABLE[n];
},
EXP_TABLE: new Array(256),
LOG_TABLE: new Array(256)
};
for (var i = 0; i < 8; i++) {
QRMath.EXP_TABLE[i] = 1 << i;
}
for (var i = 8; i < 256; i++) {
QRMath.EXP_TABLE[i] = QRMath.EXP_TABLE[i - 4] ^
QRMath.EXP_TABLE[i - 5] ^
QRMath.EXP_TABLE[i - 6] ^
QRMath.EXP_TABLE[i - 8];
}
for (var i = 0; i < 255; i++) {
QRMath.LOG_TABLE[QRMath.EXP_TABLE[i]] = i;
}
//---------------------------------------------------------------------
// QRPolynomial
//---------------------------------------------------------------------
function QRPolynomial(num, shift) {
if (num.length == undefined) {
throw new Error(num.length + "/" + shift);
}
var offset = 0;
while (offset < num.length && num[offset] == 0) {
offset++;
}
this.num = new Array(num.length - offset + shift);
for (var i = 0; i < num.length - offset; i++) {
this.num[i] = num[i + offset];
}
}
QRPolynomial.prototype = {
get: function(index) {
return this.num[index];
},
getLength: function() {
return this.num.length;
},
multiply: function(e) {
var num = new Array(this.getLength() + e.getLength() - 1);
for (var i = 0; i < this.getLength(); i++) {
for (var j = 0; j < e.getLength(); j++) {
num[i + j] ^= QRMath.gexp(QRMath.glog(this.get(i)) + QRMath.glog(e.get(j)));
}
}
return new QRPolynomial(num, 0);
},
mod: function(e) {
if (this.getLength() - e.getLength() < 0) {
return this;
}
var ratio = QRMath.glog(this.get(0)) - QRMath.glog(e.get(0));
var num = new Array(this.getLength());
for (var i = 0; i < this.getLength(); i++) {
num[i] = this.get(i);
}
for (var i = 0; i < e.getLength(); i++) {
num[i] ^= QRMath.gexp(QRMath.glog(e.get(i)) + ratio);
}
// recursive call
return new QRPolynomial(num, 0).mod(e);
}
};
//---------------------------------------------------------------------
// QRRSBlock
//---------------------------------------------------------------------
function QRRSBlock(totalCount, dataCount) {
this.totalCount = totalCount;
this.dataCount = dataCount;
}
QRRSBlock.RS_BLOCK_TABLE = [
// L
// M
// Q
// H
// 1
[1, 26, 19],
[1, 26, 16],
[1, 26, 13],
[1, 26, 9],
// 2
[1, 44, 34],
[1, 44, 28],
[1, 44, 22],
[1, 44, 16],
// 3
[1, 70, 55],
[1, 70, 44],
[2, 35, 17],
[2, 35, 13],
// 4
[1, 100, 80],
[2, 50, 32],
[2, 50, 24],
[4, 25, 9],
// 5
[1, 134, 108],
[2, 67, 43],
[2, 33, 15, 2, 34, 16],
[2, 33, 11, 2, 34, 12],
// 6
[2, 86, 68],
[4, 43, 27],
[4, 43, 19],
[4, 43, 15],
// 7
[2, 98, 78],
[4, 49, 31],
[2, 32, 14, 4, 33, 15],
[4, 39, 13, 1, 40, 14],
// 8
[2, 121, 97],
[2, 60, 38, 2, 61, 39],
[4, 40, 18, 2, 41, 19],
[4, 40, 14, 2, 41, 15],
// 9
[2, 146, 116],
[3, 58, 36, 2, 59, 37],
[4, 36, 16, 4, 37, 17],
[4, 36, 12, 4, 37, 13],
// 10
[2, 86, 68, 2, 87, 69],
[4, 69, 43, 1, 70, 44],
[6, 43, 19, 2, 44, 20],
[6, 43, 15, 2, 44, 16],
// 11
[4, 101, 81],
[1, 80, 50, 4, 81, 51],
[4, 50, 22, 4, 51, 23],
[3, 36, 12, 8, 37, 13],
// 12
[2, 116, 92, 2, 117, 93],
[6, 58, 36, 2, 59, 37],
[4, 46, 20, 6, 47, 21],
[7, 42, 14, 4, 43, 15],
// 13
[4, 133, 107],
[8, 59, 37, 1, 60, 38],
[8, 44, 20, 4, 45, 21],
[12, 33, 11, 4, 34, 12],
// 14
[3, 145, 115, 1, 146, 116],
[4, 64, 40, 5, 65, 41],
[11, 36, 16, 5, 37, 17],
[11, 36, 12, 5, 37, 13],
// 15
[5, 109, 87, 1, 110, 88],
[5, 65, 41, 5, 66, 42],
[5, 54, 24, 7, 55, 25],
[11, 36, 12],
// 16
[5, 122, 98, 1, 123, 99],
[7, 73, 45, 3, 74, 46],
[15, 43, 19, 2, 44, 20],
[3, 45, 15, 13, 46, 16],
// 17
[1, 135, 107, 5, 136, 108],
[10, 74, 46, 1, 75, 47],
[1, 50, 22, 15, 51, 23],
[2, 42, 14, 17, 43, 15],
// 18
[5, 150, 120, 1, 151, 121],
[9, 69, 43, 4, 70, 44],
[17, 50, 22, 1, 51, 23],
[2, 42, 14, 19, 43, 15],
// 19
[3, 141, 113, 4, 142, 114],
[3, 70, 44, 11, 71, 45],
[17, 47, 21, 4, 48, 22],
[9, 39, 13, 16, 40, 14],
// 20
[3, 135, 107, 5, 136, 108],
[3, 67, 41, 13, 68, 42],
[15, 54, 24, 5, 55, 25],
[15, 43, 15, 10, 44, 16],
// 21
[4, 144, 116, 4, 145, 117],
[17, 68, 42],
[17, 50, 22, 6, 51, 23],
[19, 46, 16, 6, 47, 17],
// 22
[2, 139, 111, 7, 140, 112],
[17, 74, 46],
[7, 54, 24, 16, 55, 25],
[34, 37, 13],
// 23
[4, 151, 121, 5, 152, 122],
[4, 75, 47, 14, 76, 48],
[11, 54, 24, 14, 55, 25],
[16, 45, 15, 14, 46, 16],
// 24
[6, 147, 117, 4, 148, 118],
[6, 73, 45, 14, 74, 46],
[11, 54, 24, 16, 55, 25],
[30, 46, 16, 2, 47, 17],
// 25
[8, 132, 106, 4, 133, 107],
[8, 75, 47, 13, 76, 48],
[7, 54, 24, 22, 55, 25],
[22, 45, 15, 13, 46, 16],
// 26
[10, 142, 114, 2, 143, 115],
[19, 74, 46, 4, 75, 47],
[28, 50, 22, 6, 51, 23],
[33, 46, 16, 4, 47, 17],
// 27
[8, 152, 122, 4, 153, 123],
[22, 73, 45, 3, 74, 46],
[8, 53, 23, 26, 54, 24],
[12, 45, 15, 28, 46, 16],
// 28
[3, 147, 117, 10, 148, 118],
[3, 73, 45, 23, 74, 46],
[4, 54, 24, 31, 55, 25],
[11, 45, 15, 31, 46, 16],
// 29
[7, 146, 116, 7, 147, 117],
[21, 73, 45, 7, 74, 46],
[1, 53, 23, 37, 54, 24],
[19, 45, 15, 26, 46, 16],
// 30
[5, 145, 115, 10, 146, 116],
[19, 75, 47, 10, 76, 48],
[15, 54, 24, 25, 55, 25],
[23, 45, 15, 25, 46, 16],
// 31
[13, 145, 115, 3, 146, 116],
[2, 74, 46, 29, 75, 47],
[42, 54, 24, 1, 55, 25],
[23, 45, 15, 28, 46, 16],
// 32
[17, 145, 115],
[10, 74, 46, 23, 75, 47],
[10, 54, 24, 35, 55, 25],
[19, 45, 15, 35, 46, 16],
// 33
[17, 145, 115, 1, 146, 116],
[14, 74, 46, 21, 75, 47],
[29, 54, 24, 19, 55, 25],
[11, 45, 15, 46, 46, 16],
// 34
[13, 145, 115, 6, 146, 116],
[14, 74, 46, 23, 75, 47],
[44, 54, 24, 7, 55, 25],
[59, 46, 16, 1, 47, 17],
// 35
[12, 151, 121, 7, 152, 122],
[12, 75, 47, 26, 76, 48],
[39, 54, 24, 14, 55, 25],
[22, 45, 15, 41, 46, 16],
// 36
[6, 151, 121, 14, 152, 122],
[6, 75, 47, 34, 76, 48],
[46, 54, 24, 10, 55, 25],
[2, 45, 15, 64, 46, 16],
// 37
[17, 152, 122, 4, 153, 123],
[29, 74, 46, 14, 75, 47],
[49, 54, 24, 10, 55, 25],
[24, 45, 15, 46, 46, 16],
// 38
[4, 152, 122, 18, 153, 123],
[13, 74, 46, 32, 75, 47],
[48, 54, 24, 14, 55, 25],
[42, 45, 15, 32, 46, 16],
// 39
[20, 147, 117, 4, 148, 118],
[40, 75, 47, 7, 76, 48],
[43, 54, 24, 22, 55, 25],
[10, 45, 15, 67, 46, 16],
// 40
[19, 148, 118, 6, 149, 119],
[18, 75, 47, 31, 76, 48],
[34, 54, 24, 34, 55, 25],
[20, 45, 15, 61, 46, 16]
];
QRRSBlock.getRSBlocks = function(typeNumber, errorCorrectLevel) {
var rsBlock = QRRSBlock.getRsBlockTable(typeNumber, errorCorrectLevel);
if (rsBlock == undefined) {
throw new Error("bad rs block @ typeNumber:" + typeNumber + "/errorCorrectLevel:" + errorCorrectLevel);
}
var length = rsBlock.length / 3;
var list = new Array();
for (var i = 0; i < length; i++) {
var count = rsBlock[i * 3 + 0];
var totalCount = rsBlock[i * 3 + 1];
var dataCount = rsBlock[i * 3 + 2];
for (var j = 0; j < count; j++) {
list.push(new QRRSBlock(totalCount, dataCount));
}
}
return list;
}
QRRSBlock.getRsBlockTable = function(typeNumber, errorCorrectLevel) {
switch (errorCorrectLevel) {
case QRErrorCorrectLevel.L:
return QRRSBlock.RS_BLOCK_TABLE[(typeNumber - 1) * 4 + 0];
case QRErrorCorrectLevel.M:
return QRRSBlock.RS_BLOCK_TABLE[(typeNumber - 1) * 4 + 1];
case QRErrorCorrectLevel.Q:
return QRRSBlock.RS_BLOCK_TABLE[(typeNumber - 1) * 4 + 2];
case QRErrorCorrectLevel.H:
return QRRSBlock.RS_BLOCK_TABLE[(typeNumber - 1) * 4 + 3];
default:
return undefined;
}
}
//---------------------------------------------------------------------
// QRBitBuffer
//---------------------------------------------------------------------
function QRBitBuffer() {
this.buffer = new Array();
this.length = 0;
}
QRBitBuffer.prototype = {
get: function(index) {
var bufIndex = Math.floor(index / 8);
return ((this.buffer[bufIndex] >>> (7 - index % 8)) & 1) == 1;
},
put: function(num, length) {
for (var i = 0; i < length; i++) {
this.putBit(((num >>> (length - i - 1)) & 1) == 1);
}
},
getLengthInBits: function() {
return this.length;
},
putBit: function(bit) {
var bufIndex = Math.floor(this.length / 8);
if (this.buffer.length <= bufIndex) {
this.buffer.push(0);
}
if (bit) {
this.buffer[bufIndex] |= (0x80 >>> (this.length % 8));
}
this.length++;
}
};
//---------------------------------------------------------------------
// Support Chinese
//---------------------------------------------------------------------
function utf16To8(text) {
var result = '';
var c;
for (var i = 0; i < text.length; i++) {
c = text.charCodeAt(i);
if (c >= 0x0001 && c <= 0x007F) {
result += text.charAt(i);
} else if (c > 0x07FF) {
result += String.fromCharCode(0xE0 | c >> 12 & 0x0F);
result += String.fromCharCode(0x80 | c >> 6 & 0x3F);
result += String.fromCharCode(0x80 | c >> 0 & 0x3F);
} else {
result += String.fromCharCode(0xC0 | c >> 6 & 0x1F);
result += String.fromCharCode(0x80 | c >> 0 & 0x3F);
}
}
return result;
}
uQRCode = {
errorCorrectLevel: QRErrorCorrectLevel,
defaults: {
size: 354,
margin: 0,
backgroundColor: '#ffffff',
foregroundColor: '#000000',
fileType: 'png', // 'jpg', 'png'
errorCorrectLevel: QRErrorCorrectLevel.H,
typeNumber: -1
},
make: function(options) {
var defaultOptions = {
canvasId: options.canvasId,
componentInstance: options.componentInstance,
text: options.text,
size: this.defaults.size,
margin: this.defaults.margin,
backgroundColor: this.defaults.backgroundColor,
foregroundColor: this.defaults.foregroundColor,
fileType: this.defaults.fileType,
errorCorrectLevel: this.defaults.errorCorrectLevel,
typeNumber: this.defaults.typeNumber
};
if (options) {
for (var i in options) {
defaultOptions[i] = options[i];
}
}
options = defaultOptions;
if (!options.canvasId) {
console.error('uQRCode: Please set canvasId!');
return;
}
function createCanvas() {
var qrcode = new QRCode(options.typeNumber, options.errorCorrectLevel);
qrcode.addData(utf16To8(options.text));
qrcode.make();
var ctx = uni.createCanvasContext(options.canvasId, options.componentInstance);
ctx.setFillStyle(options.backgroundColor);
ctx.fillRect(0, 0, options.size, options.size);
var tileW = (options.size - options.margin * 2) / qrcode.getModuleCount();
var tileH = tileW;
for (var row = 0; row < qrcode.getModuleCount(); row++) {
for (var col = 0; col < qrcode.getModuleCount(); col++) {
var style = qrcode.isDark(row, col) ? options.foregroundColor : options.backgroundColor;
ctx.setFillStyle(style);
var x = Math.round(col * tileW) + options.margin;
var y = Math.round(row * tileH) + options.margin;
var w = Math.ceil((col + 1) * tileW) - Math.floor(col * tileW);
var h = Math.ceil((row + 1) * tileW) - Math.floor(row * tileW);
ctx.fillRect(x, y, w, h);
}
}
setTimeout(function() {
ctx.draw(false, (function() {
setTimeout(function() {
uni.canvasToTempFilePath({
canvasId: options.canvasId,
fileType: options.fileType,
width: options.size,
height: options.size,
destWidth: options.size,
destHeight: options.size,
success: function(res) {
options.success && options.success(res.tempFilePath);
},
fail: function(error) {
options.fail && options.fail(error);
},
complete: function(res) {
options.complete && options.complete(res);
}
}, options.componentInstance);
}, options.text.length + 100);
})());
}, 150);
}
createCanvas();
}
}
})()
export default uQRCode
export function getDeviceUUID() {
let deviceId = uni.getStorageSync('uni_deviceId') ||
uni.getSystemInfoSync().deviceId ||
uni.getSystemInfoSync().system + '_' + Math.random().toString(36).substr(2);
uni.setStorageSync('uni_deviceId', deviceId)
return deviceId;
}
export function friendlyDate(timestamp) {
var formats = {
'year': '%n% 年前',
'month': '%n% 月前',
'day': '%n% 天前',
'hour': '%n% 小时前',
'minute': '%n% 分钟前',
'second': '%n% 秒前',
};
var now = Date.now();
var seconds = Math.floor((now - timestamp) / 1000);
var minutes = Math.floor(seconds / 60);
var hours = Math.floor(minutes / 60);
var days = Math.floor(hours / 24);
var months = Math.floor(days / 30);
var years = Math.floor(months / 12);
var diffType = '';
var diffValue = 0;
if (years > 0) {
diffType = 'year';
diffValue = years;
} else {
if (months > 0) {
diffType = 'month';
diffValue = months;
} else {
if (days > 0) {
diffType = 'day';
diffValue = days;
} else {
if (hours > 0) {
diffType = 'hour';
diffValue = hours;
} else {
if (minutes > 0) {
diffType = 'minute';
diffValue = minutes;
} else {
diffType = 'second';
diffValue = seconds === 0 ? (seconds = 1) : seconds;
}
}
}
}
}
return formats[diffType].replace('%n%', diffValue);
}
\ No newline at end of file
<template>
<uni-popup ref="popup" type="center" :maskClick="false">
<view class="update-wrap">
<view class="white-bg"></view>
<image src="@/static/images/top_2.png" class="updateCon-img"></image>
<view class="updateCon-top">
<!-- 发现新版本 -->
<text class="update-top-title">发现新版本</text>
<text class="update-top-version">V{{update_info.version}}</text>
</view>
<text class="uodate-content" v-if="!update_ing">更新内容:{{update_info.version_note}}</text>
<text class="current-version" v-if="!update_ing">当前版本:V{{version}}</text>
<view class="update-btn" v-if="!update_ing">
<view class="update-btn-item update-btn-left" @click="up_close">
<!-- 残忍拒绝 -->
<text class="update-btn-item-text ">残忍拒绝</text>
</view>
<view class="update-btn-item" @click="nowUpdate">
<!-- 立即升级 -->
<text class="update-btn-item-text text-bule">立即升级</text>
</view>
</view>
<!-- 下载进度 -->
<view class="sche-wrap" v-if="update_ing">
<!-- 更新包下载中 -->
<text class="sche-wrap-text">更新包下载中...</text>
<view class="sche-bg">
<view class="sche-bg-jindu" :style="lengthWidth">
<view class="sche-bg-round">
<text class="sche-bg-round-text" v-if="schedule">{{schedule}}%</text>
<text class="sche-bg-round-text" v-else>{{(downloadedSize/1024/1024 ).toFixed(2)}}M</text>
</view>
</view>
</view>
</view>
</view>
</uni-popup>
</template>
<script>
import uniPopup from '@/components/uni-popup/uni-popup.vue'
export default {
data() {
return {
platform: "", //ios or android
version: "1.0.0", //当前软件版本
is_update: false, // 是否更新
is_reques: false, //是否请求中
update_info: {
"type": "1", //1分发平台更新 2安装包/升级包更新
"version_note": "", //ios更新备注
"version": "1.0.0", //ios版本号
"download_url": "", //ios更新新链接
},
is_update: false,
schedule: 0,
update_ing: false, //点击升级
is_down: false,
downloadedSize: 0,
};
},
components:{uniPopup},
mounted() {
this.getSystemInfo() //获取系统新
},
computed: {
// 下载进度计算
lengthWidth: function() {
return {
width: this.schedule * 480 / 100 + "rpx"
}
}
},
methods: {
// 获取系统信息
getSystemInfo() {
let vm = this;
// 获取手机系统信息
uni.getSystemInfo({
success: function(res) {
vm.platform = res.platform //ios or android
}
});
// 获取版本号
plus.runtime.getProperty(plus.runtime.appid, function(inf) {
vm.version = inf.version
});
vm.getUpdateInfo(); //获取更新信息
},
// 获取线上版本信息
getUpdateInfo() {
let vm = this;
uni.request({
url: 'http://ui.ishenghuo.org.cn/api/version.php', //仅为示例,并非真实接口地址。
success: (res) => {
let data = res.data.data;
if (vm.platform == "ios") {
vm.update_info.type = data.ios_type
vm.update_info.version_note = data.ios_version_note
vm.update_info.version = data.ios_version
vm.update_info.download_url = data.ios_download_url
} else if (vm.platform == "android") {
vm.update_info.type = data.android_type
vm.update_info.version_note = data.android_version_note
vm.update_info.version = data.android_version
vm.update_info.download_url = data.android_download_url
} else {
return false
}
vm.checkUpdate(); ///检查是否更新
}
});
},
// 检查是否更新
checkUpdate() {
let vm = this;
vm.is_update = vm.compareVersion(vm.version, vm.update_info.version); // 检查是否升级
if (vm.is_update) {
vm.$refs.popup.open() //显示升级弹窗
} else {
// 不更新,根据需要做处理
}
},
// 取消更新
up_close() {
// console.log('点击取消')
plus.os.name == "Android" ? plus.runtime.quit() : plus.ios.import("UIApplication").sharedApplication().performSelector("exit");
},
// 立即更新
nowUpdate() {
let vm = this;
if(vm.is_reques){
return false //如果正在下载就停止操作
}else{
vm.is_reques = true
}
console.log(111111);
if (vm.update_info.type == 1) {
// 分发平台更新 //调用浏览器打开链接或者分发平台
plus.runtime.openURL(vm.update_info.download_url, function() {
plus.nativeUI.toast("打开错误");
});
setTimeout(function() {
plus.runtime.quit(); //五秒后关闭app
}, 5000)
} else if (vm.update_info.type == 2) {
// 安装包/升级包更新
vm.download_wgt()
}
},
// 下载升级资源包
download_wgt() {
let vm = this;
plus.nativeUI.showWaiting("下载更新文件..."); //下载更新文件...
let options = {
method: "POST"
};
let dtask = plus.downloader.createDownload(vm.update_info.download_url, options);
dtask.addEventListener("statechanged", function(task, status) {
switch (task.state) {
case 1: // 开始
break;
case 2: //已连接到服务器
vm.update_ing = true;
break;
case 3: // 已接收到数据
vm.downloadedSize = task.downloadedSize;
let totalSize = 0;
if (task.totalSize) {
totalSize = task.totalSize //服务器须返回正确的content-length才会有长度
}
vm.schedule = parseInt(100 * task.downloadedSize / totalSize);
break;
case 4:
vm.installWgt(task.filename); // 安装wgt包
break;
}
});
dtask.start();
},
// 安装文件
installWgt(path) {
let vm = this;
plus.nativeUI.showWaiting("安装更新文件..."); //安装更新文件...
plus.runtime.install(path, {}, function() {
plus.nativeUI.closeWaiting();
// 应用资源更新完成!
plus.nativeUI.alert("应用资源更新完成!", function() {
plus.runtime.restart();
});
}, function(e) {
plus.nativeUI.closeWaiting();
// 安装更新文件失败
plus.nativeUI.alert("安装更新文件失败[" + e.code + "]:" + e.message);
});
},
// 对比版本号
compareVersion(ov, nv) {
if (!ov || !nv || ov == "" || nv == "") {
return false;
}
let b = false,
ova = ov.split(".", 4),
nva = nv.split(".", 4);
for (let i = 0; i < ova.length && i < nva.length; i++) {
let so = ova[i],
no = parseInt(so),
sn = nva[i],
nn = parseInt(sn);
if (nn > no || sn.length > so.length) {
return true;
} else if (nn < no) {
return false;
}
}
if (nva.length > ova.length && 0 == nv.indexOf(ov)) {
return true;
} else {
return false;
}
},
}
}
</script>
<style scoped>
/*#ifndef APP-NVUE*/
view {
display: flex;
flex-direction: column;
box-sizing: border-box;
}
/*#endif*/
.updateBox {
background-color: rgba(0, 0, 0, 0.6);
z-index: 1000;
position: fixed;
right: 0px;
top: 0;
left: 0;
bottom: 0;
align-items: center;
justify-content: center;
}
.update-wrap {
width: 580rpx;
height: 500rpx;
border-radius: 10px;
padding-bottom: 0px;
position: relative;
}
.white-bg {
position: absolute;
top: 60rpx;
left: 0px;
width: 580rpx;
height: 440rpx;
background-color: #ffffff;
border-bottom-left-radius: 30rpx;
border-bottom-right-radius: 30rpx;
}
.updateCon-img {
position: absolute;
top: 0rpx;
left: 0px;
width: 580rpx;
height: 440rpx;
}
.updateCon-top {
padding: 70rpx 50rpx;
/*#ifndef APP-NVUE*/
z-index: 1;
/*#endif*/
}
.update-top-title {
color: #fff;
font-size: 36rpx;
font-weight: bold;
}
.update-top-version {
color: #fff;
font-size: 28rpx;
margin-top: 10rpx;
}
.uodate-content {
color: #333;
font-size: 18px;
padding: 0px 50rpx;
margin-top: 80rpx;
/*#ifndef APP-NVUE*/
z-index: 1;
/*#endif*/
}
.current-version {
text-align: center;
margin-top: 10rpx;
font-size: 24rpx;
color: #666;
/*#ifndef APP-NVUE*/
z-index: 1;
/*#endif*/
}
.update-btn {
position: absolute;
left: 0px;
bottom: 0px;
width: 580rpx;
height: 80rpx;
padding: 0px 50rpx;
align-items: center;
flex-direction: row;
border-top-color: #e7e7e7;
border-top-style: solid;
border-top-width: 1px;
background-color: #fff;
border-bottom-left-radius: 30rpx;
border-bottom-right-radius: 30rpx;
}
.update-btn-item {
width: 240rpx;
height: 80rpx;
justify-content: center;
align-items: center;
}
.update-btn-left {
border-right-color: #e7e7e7;
border-right-style: solid;
border-right-width: 1px;
}
.update-btn-item-text {
text-align: center;
font-size: 28rpx;
color: #666;
}
.text-bule {
color: #045FCF;
}
.sche-wrap {
padding: 0px 50rpx 0rpx;
height: 100rpx;
align-items: center;
border-bottom-left-radius: 30rpx;
border-bottom-right-radius: 30rpx;
flex: 1;
justify-content: flex-end;
}
.sche-wrap-text {
font-size: 24rpx;
color: #666;
margin-bottom: 20rpx;
}
.sche-bg {
position: relative;
background-color: #ccc;
height: 20rpx;
border-radius: 100px;
width: 480rpx;
margin-bottom: 30rpx;
}
.sche-bg-jindu {
position: absolute;
left: 0px;
top: 0px;
height: 20rpx;
background-color: #5775e7;
border-radius: 100px;
}
.sche-bg-round {
position: absolute;
left: 100%;
height: 24rpx;
width: 24rpx;
background-color: #fff;
border-color: #fff;
border-style: solid;
border-width: 10px;
border-radius: 100px;
transform: translateX(-20rpx) translateY(-10rpx);
}
.sche-bg-round-text {
font-size: 24rpx;
width: 120rpx;
text-align: center;
transform: translateX(-50rpx) translateY(-40rpx);
color: #5775e7;
}
.uodate-close {
/* display: flex; */
flex-direction: row;
justify-content: center;
padding-top: 50rpx;
}
.uodate-close-img {
width: 80rpx;
height: 80rpx;
}
</style>
@font-face {
font-family: uniicons;
font-weight: normal;
font-style: normal;
src: url('/static/uni.ttf') format('truetype');
}
.m-icon {
font-family: uniicons;
/* font-size: 24px; */
margin-left: 20px;
font-weight: normal;
font-style: normal;
line-height: 1;
display: inline-block;
text-decoration: none;
-webkit-font-smoothing: antialiased;
}
.m-icon.uni-active {
color: #007aff;
}
.m-icon-contact:before {
content: '\e100';
}
.m-icon-person:before {
content: '\e101';
}
.m-icon-personadd:before {
content: '\e102';
}
.m-icon-contact-filled:before {
content: '\e130';
}
.m-icon-person-filled:before {
content: '\e131';
}
.m-icon-personadd-filled:before {
content: '\e132';
}
.m-icon-phone:before {
content: '\e200';
}
.m-icon-email:before {
content: '\e201';
}
.m-icon-chatbubble:before {
content: '\e202';
}
.m-icon-chatboxes:before {
content: '\e203';
}
.m-icon-phone-filled:before {
content: '\e230';
}
.m-icon-email-filled:before {
content: '\e231';
}
.m-icon-chatbubble-filled:before {
content: '\e232';
}
.m-icon-chatboxes-filled:before {
content: '\e233';
}
.m-icon-weibo:before {
content: '\e260';
}
.m-icon-weixin:before {
content: '\e261';
}
.m-icon-pengyouquan:before {
content: '\e262';
}
.m-icon-chat:before {
content: '\e263';
}
.m-icon-qq:before {
content: '\e264';
}
.m-icon-videocam:before {
content: '\e300';
}
.m-icon-camera:before {
content: '\e301';
}
.m-icon-mic:before {
content: '\e302';
}
.m-icon-location:before {
content: '\e303';
}
.m-icon-mic-filled:before,
.m-icon-speech:before {
content: '\e332';
}
.m-icon-location-filled:before {
content: '\e333';
}
.m-icon-micoff:before {
content: '\e360';
}
.m-icon-image:before {
content: '\e363';
}
.m-icon-map:before {
content: '\e364';
}
.m-icon-compose:before {
content: '\e400';
}
.m-icon-trash:before {
content: '\e401';
}
.m-icon-upload:before {
content: '\e402';
}
.m-icon-download:before {
content: '\e403';
}
.m-icon-close:before {
content: '\e404';
}
.m-icon-redo:before {
content: '\e405';
}
.m-icon-undo:before {
content: '\e406';
}
.m-icon-refresh:before {
content: '\e407';
}
.m-icon-star:before {
content: '\e408';
}
.m-icon-plus:before {
content: '\e409';
}
.m-icon-minus:before {
content: '\e410';
}
.m-icon-circle:before,
.m-icon-checkbox:before {
content: '\e411';
}
.m-icon-close-filled:before,
.m-icon-clear:before {
content: '\e434';
}
.m-icon-refresh-filled:before {
content: '\e437';
}
.m-icon-star-filled:before {
content: '\e438';
}
.m-icon-plus-filled:before {
content: '\e439';
}
.m-icon-minus-filled:before {
content: '\e440';
}
.m-icon-circle-filled:before {
content: '\e441';
}
.m-icon-checkbox-filled:before {
content: '\e442';
}
.m-icon-closeempty:before {
content: '\e460';
}
.m-icon-refreshempty:before {
content: '\e461';
}
.m-icon-reload:before {
content: '\e462';
}
.m-icon-starhalf:before {
content: '\e463';
}
.m-icon-spinner:before {
content: '\e464';
}
.m-icon-spinner-cycle:before {
content: '\e465';
}
.m-icon-search:before {
content: '\e466';
}
.m-icon-plusempty:before {
content: '\e468';
}
.m-icon-forward:before {
content: '\e470';
}
.m-icon-back:before,
.m-icon-left-nav:before {
content: '\e471';
}
.m-icon-checkmarkempty:before {
content: '\e472';
}
.m-icon-home:before {
content: '\e500';
}
.m-icon-navigate:before {
content: '\e501';
}
.m-icon-gear:before {
content: '\e502';
}
.m-icon-paperplane:before {
content: '\e503';
}
.m-icon-info:before {
content: '\e504';
}
.m-icon-help:before {
content: '\e505';
}
.m-icon-locked:before {
content: '\e506';
}
.m-icon-more:before {
content: '\e507';
}
.m-icon-flag:before {
content: '\e508';
}
.m-icon-home-filled:before {
content: '\e530';
}
.m-icon-gear-filled:before {
content: '\e532';
}
.m-icon-info-filled:before {
content: '\e534';
}
.m-icon-help-filled:before {
content: '\e535';
}
.m-icon-more-filled:before {
content: '\e537';
}
.m-icon-settings:before {
content: '\e560';
}
.m-icon-list:before {
content: '\e562';
}
.m-icon-bars:before {
content: '\e563';
}
.m-icon-loop:before {
content: '\e565';
}
.m-icon-paperclip:before {
content: '\e567';
}
.m-icon-eye:before {
content: '\e568';
}
.m-icon-arrowup:before {
content: '\e580';
}
.m-icon-arrowdown:before {
content: '\e581';
}
.m-icon-arrowleft:before {
content: '\e582';
}
.m-icon-arrowright:before {
content: '\e583';
}
.m-icon-arrowthinup:before {
content: '\e584';
}
.m-icon-arrowthindown:before {
content: '\e585';
}
.m-icon-arrowthinleft:before {
content: '\e586';
}
.m-icon-arrowthinright:before {
content: '\e587';
}
.m-icon-pulldown:before {
content: '\e588';
}
.m-icon-scan:before {
content: "\e612";
}
<template>
<view class="m-icon" :class="['m-icon-'+type]" @click="onClick()"></view>
</template>
<script>
export default {
props: {
/**
* 图标类型
*/
type: String
},
methods: {
onClick() {
this.$emit('click')
}
}
}
</script>
<style>
@import "./m-icon.css";
</style>
<template>
<view class="m-input-view">
<input :focus="focus" :type="inputType" :value="value" @input="onInput" class="m-input-input" :placeholder="placeholder"
:password="type==='password'&&!showPassword" @focus="onFocus" @blur="onBlur" />
<!-- 优先显示密码可见按钮 -->
<view v-if="clearable&&!displayable&&value.length" class="m-input-icon">
<m-icon color="#666666" type="clear" @click="clear"></m-icon>
</view>
<view v-if="displayable" class="m-input-icon">
<m-icon :style="{color:showPassword?'#666666':'#cccccc'}" type="eye" @click="display"></m-icon>
</view>
</view>
</template>
<script>
import mIcon from './m-icon/m-icon.vue'
export default {
components: {
mIcon
},
props: {
/**
* 输入类型
*/
type: String,
/**
* 值
*/
value: String,
/**
* 占位符
*/
placeholder: String,
/**
* 是否显示清除按钮
*/
clearable: {
type: [Boolean, String],
default: false
},
/**
* 是否显示密码可见按钮
*/
displayable: {
type: [Boolean, String],
default: false
},
/**
* 自动获取焦点
*/
focus: {
type: [Boolean, String],
default: false
}
},
model: {
prop: 'value',
event: 'input'
},
data() {
return {
/**
* 显示密码明文
*/
showPassword: false,
/**
* 是否获取焦点
*/
isFocus: false
}
},
computed: {
inputType() {
const type = this.type
return type === 'password' ? 'text' : type
}
},
methods: {
clear() {
this.$emit('input', '')
},
display() {
this.showPassword = !this.showPassword
},
onFocus() {
this.isFocus = true
},
onBlur() {
this.$nextTick(() => {
this.isFocus = false
})
},
onInput(e) {
this.$emit('input', e.detail.value)
}
}
}
</script>
<style>
.m-input-view {
display: inline-flex;
flex-direction: row;
align-items: center;
/* width: 100%; */
flex: 1;
padding: 0 10px;
}
.m-input-input {
flex: 1;
width: 100%;
height: 20px;
line-height: 20px;
background-color: rgba(0, 0, 0, 0);
}
.m-input-icon {
/* width: 20px; */
font-size: 20px;
line-height: 20px;
color: #666666;
}
</style>
<template>
<view>
<canvas :id="cid" :canvas-id="cid" :style="{width: `${size}px`, height: `${size}px`}" />
</view>
</template>
<script>
import uQRCode from '@/common/uqrcode.js'
export default {
props: {
cid: {
type: String,
required: true
},
text: {
type: String,
required: true
},
size: {
type: Number,
default: uni.upx2px(590)
},
margin: {
type: Number,
default: 0
},
backgroundColor: {
type: String,
default: '#ffffff'
},
foregroundColor: {
type: String,
default: '#000000'
},
backgroundImage: {
type: String
},
logo: {
type: String
},
makeOnLoad: {
type: Boolean,
default: false
}
},
data() {
return {
}
},
mounted() {
if (this.makeOnLoad) {
this.make()
}
},
methods: {
async make() {
var options = {
canvasId: this.cid,
componentInstance: this,
text: this.text,
size: this.size,
margin: this.margin,
backgroundColor: this.backgroundImage ? 'rgba(255,255,255,0)' : this.backgroundColor,
foregroundColor: this.foregroundColor
}
var filePath = await this.makeSync(options)
if (this.backgroundImage) {
filePath = await this.drawBackgroundImageSync(filePath)
}
if (this.logo) {
filePath = await this.drawLogoSync(filePath)
}
this.makeComplete(filePath)
},
makeComplete(filePath) {
this.$emit('makeComplete', filePath)
},
drawBackgroundImage(options) {
var ctx = uni.createCanvasContext(this.cid, this)
ctx.drawImage(this.backgroundImage, 0, 0, this.size, this.size)
ctx.drawImage(options.filePath, 0, 0, this.size, this.size)
ctx.draw(false, () => {
uni.canvasToTempFilePath({
canvasId: this.cid,
success: res => {
options.success && options.success(res.tempFilePath)
},
fail: error => {
options.fail && options.fail(error)
}
}, this)
})
},
async drawBackgroundImageSync(filePath) {
return new Promise((resolve, reject) => {
this.drawBackgroundImage({
filePath: filePath,
success: res => {
resolve(res)
},
fail: error => {
reject(error)
}
})
})
},
fillRoundRect(ctx, r, x, y, w, h) {
ctx.save()
ctx.translate(x, y)
ctx.beginPath()
ctx.arc(w - r, h - r, r, 0, Math.PI / 2)
ctx.lineTo(r, h)
ctx.arc(r, h - r, r, Math.PI / 2, Math.PI)
ctx.lineTo(0, r)
ctx.arc(r, r, r, Math.PI, Math.PI * 3 / 2)
ctx.lineTo(w - r, 0)
ctx.arc(w - r, r, r, Math.PI * 3 / 2, Math.PI * 2)
ctx.lineTo(w, h - r)
ctx.closePath()
ctx.setFillStyle('#ffffff')
ctx.fill()
ctx.restore()
},
drawLogo(options) {
var ctx = uni.createCanvasContext(this.cid, this)
ctx.drawImage(options.filePath, 0, 0, this.size, this.size)
var logoSize = this.size / 4
var logoX = this.size / 2 - logoSize / 2
var logoY = logoX
var borderSize = logoSize + 10
var borderX = this.size / 2 - borderSize / 2
var borderY = borderX
var borderRadius = 5
this.fillRoundRect(ctx, borderRadius, borderX, borderY, borderSize, borderSize)
ctx.drawImage(this.logo, logoX, logoY, logoSize, logoSize)
ctx.draw(false, () => {
uni.canvasToTempFilePath({
canvasId: this.cid,
success: res => {
options.success && options.success(res.tempFilePath)
},
fail: error => {
options.fail && options.fail(error)
}
}, this)
})
},
async drawLogoSync(filePath) {
return new Promise((resolve, reject) => {
this.drawLogo({
filePath: filePath,
success: res => {
resolve(res)
},
fail: error => {
reject(error)
}
})
})
},
async makeSync(options) {
return new Promise((resolve, reject) => {
uQRCode.make({
canvasId: options.canvasId,
componentInstance: options.componentInstance,
text: options.text,
size: options.size,
margin: options.margin,
backgroundColor: options.backgroundColor,
foregroundColor: options.foregroundColor,
success: res => {
resolve(res)
},
fail: error => {
reject(error)
}
})
})
}
}
}
</script>
<template>
<view class="container">
<view class="intro">本项目已包含uni ui组件,无需import和注册,可直接使用。在代码区键入字母u,即可通过代码助手列出所有可用组件。光标置于组件名称处按F1,即可查看组件文档。</view>
<text class="intro">详见:</text>
<uni-link :href="href" :text="href"></uni-link>
</view>
</template>
<script>
export default {
data() {
return {
href: 'https://uniapp.dcloud.io/component/README?id=uniui'
}
},
methods: {
}
}
</script>
<style>
.container {
padding: 20px;
font-size: 14px;
line-height: 24px;
}
</style>
<template>
<view class="content">
<view class=""></view>
<view class="form-group">
<view class="form-row">
<text class="form-label">手机号:</text>
<input class="form-input" type="text" auto-focus="true" v-model="mobile" placeholder="请输入手机号码" />
</view>
<view class="form-row">
<text class="form-label">验证码:</text>
<input class="form-input" type="form-input" v-model="code" placeholder="请输入验证码" />
<view class="send-code-btn" @click="sendSmsCode">{{codeDuration ? codeDuration + 's' : '发送验证码' }}</view>
</view>
<view class="form-row">
<text class="form-label">邀请码:</text>
<input class="form-input" type="text" v-model="inviteCode" placeholder="邀请码(选填)" />
</view>
<view class="form-row">
<text class="form-label">密码:</text>
<input class="form-input" type="password" displayable v-model="password" placeholder="请输入密码" />
</view>
<view class="form-row">
<text class="form-label">确认密码:</text>
<input class="form-input" type="password" displayable v-model="confirmPassword" placeholder="请确认密码" />
</view>
<view class="form-submit">
<button type="primary" class="primary" @tap="register">注册</button>
</view>
</view>
<view class="download-app">
<text @click="download">已有账号下载APP登录</text>
</view>
</view>
</template>
<script>
// 为方便演示,此邀请注册页面放在项目内,实际可以单独做一个项目放置邀请注册页面
export default {
data() {
return {
mobile: '',
code: '',
password: '',
confirmPassword: '',
codeDuration: 0,
inviteCode: ''
}
},
onLoad(options) {
this.inviteCode = options.invite_code
},
methods: {
sendSmsCode() {
if (this.codeDuration) {
uni.showModal({
content: `请在${this.codeDuration}秒后重试`,
showCancel: false
})
}
if (!/^1\d{10}$/.test(this.mobile)) {
uni.showModal({
content: '手机号码填写错误',
showCancel: false
})
return
}
uni.showLoading({
title: '请稍等...',
mask: true
})
uniCloud.callFunction({
name: 'user-center',
data: {
action: 'sendSmsCode',
params: {
mobile: this.mobile,
type: 'register'
}
},
success: (e) => {
if (e.result.code == 0) {
uni.showModal({
content: '验证码发送成功,请注意查收',
showCancel: false
})
this.codeDuration = 60
this.codeInterVal = setInterval(() => {
this.codeDuration--
if (this.codeDuration === 0) {
if (this.codeInterVal) {
clearInterval(this.codeInterVal)
this.codeInterVal = null
}
}
}, 1000)
} else {
uni.showModal({
content: '验证码发送失败:' + e.result.msg,
showCancel: false
})
}
},
fail(e) {
uni.showModal({
content: '验证码发送失败',
showCancel: false
})
},
complete() {
uni.hideLoading()
}
})
},
register() {
/**
* 客户端对账号信息进行一些必要的校验。
* 实际开发中,根据业务需要进行处理,这里仅做示例。
*/
if (!/^1\d{10}$/.test(this.mobile)) {
uni.showModal({
content: '手机号码填写错误',
showCancel: false
})
return
}
if (this.password.length < 6) {
uni.showToast({
icon: 'none',
title: '密码最短为 6 个字符'
});
return;
}
if (this.password !== this.confirmPassword) {
uni.showToast({
icon: 'none',
title: '两次密码输入不一致'
});
return;
}
if (this.code === '') {
uni.showToast({
icon: 'none',
title: '请输入正确的验证码'
});
return;
}
uni.showLoading({
title: '请稍后...'
})
uniCloud.callFunction({
name: 'user-center',
data: {
action: 'inviteLogin',
params: {
mobile: this.mobile,
code: this.code,
inviteCode: this.inviteCode,
password: this.password
}
},
success: (e) => {
console.log("注册成功", e);
if (e.result.code === 0) {
uni.showModal({
content: '注册成功,是否立即下载APP登录',
success: (res) => {
if (res.confirm) {
this.download()
}
}
})
} else {
uni.showModal({
content: '注册失败:' + e.result.msg,
showCancel: false
})
}
},
fail(e) {
uni.showModal({
content: JSON.stringify(e),
showCancel: false
})
},
complete() {
uni.hideLoading()
}
})
},
download() {
location.href = 'https://login.tpl.dcloud.net.cn/package/android-latest.apk'
}
}
}
</script>
<style>
.content {
padding: 20px;
}
.form-row {
display: flex;
flex-direction: row;
align-items: center;
justify-content: left;
height: 40px;
background-color: #FFFFFF;
border: solid 1px #DDDDDD;
border-radius: 20px;
overflow: hidden;
margin-bottom: 10px;
}
.form-row .form-label {
width: 80px;
padding-left: 15px;
}
.form-row .form-input {
flex: 1;
margin: 0px 10px;
}
.send-code-btn {
width: 120px;
height: 40px;
line-height: 40px;
text-align: center;
background-color: #0FAEFF;
color: #FFFFFF;
}
.form-submit {
display: flex;
flex-direction: row;
margin-bottom: 10px;
}
.form-submit button {
flex: 1;
height: 40px;
line-height: 40px;
border-radius: 40px;
}
.download-app {
text-align: center;
color: #007AFF;
text-decoration: underline;
}
</style>
<template>
<view class="content">
<view class="invite-wrapper" v-if="inviteUrl">
<uni-qrcode class="invite-qrcode" ref="qrcode" cid="invite-qr-canvas" :text="inviteUrl" :margin="10" makeOnLoad
@makeComplete="qrcodeComplete" />
<view class="share-btn">
<button type="primary" @click="shareLink">分享链接</button>
<button type="primary" @click="shareImage">分享图片</button>
</view>
<view class="share-btn">
<button type="primary" @click="toInvitedUser">我邀请的用户</button>
</view>
<uni-popup id="popupShare" ref="popupShare" type="share">
<uni-popup-share title="分享到" :shareType="shareType" @select="select"></uni-popup-share>
</uni-popup>
</view>
</view>
</template>
<script>
import {
mapState
} from 'vuex'
export default {
data() {
return {
inviteUrl: '',
qrcodeImagePath: '',
qrcodePath: '',
shareType: ''
}
},
onLoad() {
uni.showLoading({
title: '加载中...'
})
uniCloud.callFunction({
name: 'user-center',
data: {
action: 'getInviteCode'
},
success: (res) => {
console.log(res);
if (res.result.code === 0) {
// 这里请修改为真实的邀请页面url
this.inviteUrl = 'https://login.tpl.dcloud.net.cn/#/pages/invite-reg/invite-reg?invite_code=' + res.result.myInviteCode
} else {
uni.showModal({
content: '获取用户邀请码失败:' + res.result.msg,
showCancel: false
})
}
},
fail: (err) => {
uni.showModal({
content: '获取用户邀请码失败,请稍后再试',
showCancel: false
})
},
complete() {
uni.hideLoading()
}
})
},
methods: {
copyInviteUrl() {
uni.setClipboardData({
data: this.inviteUrl
})
},
qrcodeComplete(path) {
this.qrcodeImagePath = path
},
shareLink() {
this.shareType = 'link'
this.$refs.popupShare.open()
},
shareImage() {
this.shareType = 'image'
this.$refs.popupShare.open()
},
select({
item
}) {
const shareTitle = '登录模板',
shareSummary = 'DCloud邀请您试用登录模板'
let params = {}
switch (`${this.shareType}_${item.name}`) {
case 'link_weixin':
params = {
type: 1,
summary: this.inviteUrl,
scene: 'WXSceneSession'
}
break;
case 'link_qq':
params = {
type: 1,
title: shareTitle,
summary: shareSummary,
href: this.inviteUrl
}
break;
case 'link_more':
uni.setClipboardData({
data: this.inviteUrl
})
return
case 'image_weixin':
params = {
type: 2,
imageUrl: this.qrcodeImagePath,
scene: 'WXSceneSession'
}
break;
case 'image_qq':
params = {
type: 2,
imageUrl: this.qrcodeImagePath
}
break;
case 'image_more':
uni.shareWithSystem({
type: 'image',
imageUrl: this.qrcodeImagePath
})
return
default:
break;
}
console.log(params);
uni.share({
provider: item.name,
...params,
success() {
uni.showModal({
content: '分享成功',
showCancel: false
})
},
fail(err) {
uni.showModal({
content: '分享失败:' + err.errMsg,
showCancel: false
})
}
})
},
toInvitedUser() {
uni.navigateTo({
url: '/pages/invited-user/invited-user'
})
}
}
}
</script>
<style>
.invite-wrapper {
display: flex;
padding: 20px;
flex-direction: column;
align-items: center;
}
.invite-qrcode {
border-radius: 10px;
box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 10px 1px;
overflow: hidden;
}
.share-btn {
display: flex;
flex-direction: row;
padding: 20px 0px 10px 0px;
}
.share-btn button {
flex: 1;
margin: 0px 10px;
border-radius: 40px;
}
</style>
<template>
<view class="content">
<view class="invite-qrcode">
<view class="invited-users">
<view class="invited-users-title">我邀请的用户</view>
<view class="level-selector">
<text v-for="(item,index) in levelArr" :class="{act: index === selectedLevel}" :key="index" @click="changeLevel(index)">{{item}}级下线</text>
</view>
<view class="invited-users-list">
<view class="invited-users-item" v-for="(item,index) in invitedUser" :key="index">
<text class="username">{{item.username || '新用户'}}</text>
<text class="mobile">{{item.mobile}}</text>
</view>
</view>
<uni-load-more :status="status"></uni-load-more>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
invitedUser: [],
loading: true,
levelArr: ['', '', ''],
selectedLevel: 0,
status: 'more',
pageSize: 40,
current: 1
}
},
onLoad() {
this.getList()
},
onReachBottom() {
if (this.status !== 'loading') {
this.getList()
}
},
methods: {
changeLevel(index) {
this.selectedLevel = index
this.getList(true)
},
getList(refresh) {
this.status = 'loading'
uniCloud.callFunction({
name: 'user-center',
data: {
action: 'getInvitedUser',
params: {
level: this.selectedLevel + 1,
offset: (this.current - 1) * this.pageSize,
limit: this.pageSize,
needTotal: false
}
},
success: (res) => {
console.log(res);
if (res.result.code === 0) {
// 这里请修改为真实的邀请页面url
const tempList = res.result.invitedUser
this.invitedUser = refresh ? tempList : this.invitedUser.concat(tempList)
if (tempList.length < this.pageSize) {
this.status = 'noMore'
} else {
this.status = 'more'
}
} else {
this.status = 'more'
uni.showModal({
content: '获取被邀请用户列表失败:' + res.result.msg,
showCancel: false
})
}
},
fail: (err) => {
uni.showModal({
content: '获取被邀请用户列表失败,请稍后再试',
showCancel: false
})
},
complete: () => {
this.loading = false
}
})
}
}
}
</script>
<style>
.invited-users {
background-color: #FFFFFF;
margin-top: 10px;
border-radius: 5px;
}
.invited-users-title {
text-align: center;
padding-top: 10px;
margin-bottom: 10px;
}
.level-selector {
display: flex;
padding: 10px;
}
.level-selector text {
flex: 1;
line-height: 30px;
padding-bottom: 5px;
border-bottom: solid 2px transparent;
text-align: center;
}
.level-selector text.act {
border-bottom-color: #007AFF;
}
.invited-users-empty {
font-size: 12px;
color: #999999;
text-align: center;
}
.invited-users-item {
display: flex;
flex-direction: row;
border-bottom: solid 1px #DDDDDD;
}
.invited-users-item:last-child {
border-bottom: none;
}
.invited-users-item .username,
.invited-users-item .mobile {
flex: 1;
text-align: center;
font-size: 14px;
color: #666666;
line-height: 24px;
}
</style>
<template>
<!--
本页面模板教程:https://ext.dcloud.net.cn/plugin?id=2584
uni-list 文档:https://ext.dcloud.net.cn/plugin?id=24
uniCloud 文档:https://uniapp.dcloud.io/uniCloud/README
unicloud-db 组件文档:https://uniapp.dcloud.net.cn/uniCloud/unicloud-db-component
DB Schema 规范:https://uniapp.dcloud.net.cn/uniCloud/schema
-->
<view>
<!-- 刷新页面后的顶部提示框 -->
<view class="tips" :class="{ 'tips-ani': tipShow }">为您更新了10条最新新闻动态</view>
<unicloud-db ref="udb" v-slot:default="{data, loading, error, options}" :options="formData" :collection="collection"
:field="field" @load="load">
<!-- 基于 uni-list 的页面布局 -->
<uni-list>
<!-- to 属性携带参数跳转详情页面,当前只为参考 -->
<uni-list-item direction="column" v-for="item in data" :key="item.id" :to="'/pages/detail/detail?id='+item._id+'&title='+item.title">
<!-- 通过header插槽定义列表的标题 -->
<template v-slot:header>
<view class="uni-title">{{item.title}}</view>
</template>
<!-- 通过body插槽定义列表内容显示 -->
<template v-slot:body>
<view class="uni-list-box">
<view class="uni-thumb">
<!-- 当前判断长度只为简单判断类型,实际业务中,根据逻辑直接渲染即可 -->
<image :src="item.image[0].url" mode="aspectFill"></image>
</view>
<view class="uni-content">
<view class="uni-title-sub uni-ellipsis-2">{{item.excerpt}}</view>
<view class="uni-note">{{ item.origin }} {{ item.last_modify_date | beforTime }}</view>
</view>
</view>
</template>
<!-- 同步footer插槽定义列表底部的显示效果 -->
<template v-slot:footer>
<view class="uni-footer">
<text class="uni-footer-text">评论</text>
<text class="uni-footer-text">点赞</text>
<text class="uni-footer-text">分享</text>
</view>
</template>
</uni-list-item>
</uni-list>
<!-- 通过 loadMore 组件实现上拉加载效果,如需自定义显示内容,可参考:https://ext.dcloud.net.cn/plugin?id=29 -->
<uni-load-more v-if="loading || options.status === 'noMore' " :status="options.status" />
</unicloud-db>
</view>
</template>
<script>
import { friendlyDate } from '@/common/utils.js';
export default {
components: {},
data() {
return {
// 数据表名
collection: 'opendb-news-articles',
// 查询字段,多个字段用 , 分割
field: '_id,mode,image,title,origin,excerpt,last_modify_date',
formData: {
status: 'loading' // 加载状态
},
tipShow: false // 是否显示顶部提示框
};
},
onLoad() {},
filters:{
beforTime(number){
return friendlyDate(+number);
}
},
methods: {
/**
* 下拉刷新回调函数
*/
onPullDownRefresh() {
this.tipShow = true
this.formData.status = 'more'
this.$refs.udb.loadData({
clear: true
}, () => {
this.tipShow = false
uni.stopPullDownRefresh()
})
},
/**
* 上拉加载回调函数
*/
onReachBottom() {
this.$refs.udb.loadMore()
},
load(data, ended) {
if (ended) {
this.formData.status = 'noMore'
}
}
}
};
</script>
<style lang="scss">
@import '@/common/uni-ui.scss';
page {
display: flex;
flex-direction: column;
box-sizing: border-box;
background-color: #efeff4;
min-height: 100%;
height: auto;
}
.tips {
color: #67c23a;
font-size: 14px;
line-height: 40px;
text-align: center;
background-color: #f0f9eb;
height: 0;
opacity: 0;
transform: translateY(-100%);
transition: all 0.3s;
}
.tips-ani {
transform: translateY(0);
height: 40px;
opacity: 1;
}
.content {
width: 100%;
display: flex;
}
.list-picture {
width: 100%;
height: 145px;
}
.thumb-image {
width: 100%;
height: 100%;
}
.ellipsis {
display: flex;
overflow: hidden;
}
.uni-ellipsis-1 {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.uni-ellipsis-2 {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
</style>
...@@ -57,8 +57,6 @@ ...@@ -57,8 +57,6 @@
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import '@/common/uni-ui.scss';
page { page {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
......
...@@ -160,7 +160,7 @@ ...@@ -160,7 +160,7 @@
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import '@/common/uni-ui.scss'; // @import '@/common/uni-ui.scss';
page { page {
display: flex; display: flex;
......
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
import { import {
isOn, isOn,
setting setting
} from '@/common/dc-push/push.js'; } from './dc-push/push.js';
import { import {
mapMutations mapMutations
} from 'vuex'; } from 'vuex';
......
...@@ -72,11 +72,11 @@ ...@@ -72,11 +72,11 @@
to: '/pages/about/about' to: '/pages/about/about'
}, },
//#ifdef APP-PLUS //#ifdef APP-PLUS
// { {
// title: '检查更新', title: '检查更新',
// rightText: `V${getApp().appVersion.finall.version}_${getApp().appVersion.finall.versionCode}`, rightText: `V${getApp().appVersion.finall.version}_${getApp().appVersion.finall.versionCode}`,
// event:'checkVersion' event:'checkVersion'
// } }
//#endif //#endif
], ],
[{ [{
......
<template>
<view class="">
<view class="center">
<view class="logo" @click="bindLogin" :hover-class="!hasLogin ? 'logo-hover' : ''">
<image class="logo-img" :src="avatarUrl"></image>
<view class="logo-title">
<text class="uer-name">Hi,{{hasLogin ? userName : '您未登录'}}</text>
<text class="go-login navigat-arrow" v-if="!hasLogin">&#xe65e;</text>
</view>
</view>
<view class="center-list">
<view class="center-list-item border-bottom" v-show="hasLogin && hasPwd" @click="goto">
<text class="list-icon">&#xe60f;</text>
<text class="list-text">修改密码</text>
<text class="navigat-arrow">&#xe65e;</text>
</view>
<!-- #ifdef APP-PLUS -->
<view v-if="hasLogin" class="center-list-item border-bottom" @click="toInvite">
<text class="list-icon">&#xe65f;</text>
<text class="list-text">邀请好友</text>
<text class="navigat-arrow">&#xe65e;</text>
</view>
<!-- #endif -->
<view class="center-list-item">
<text class="list-icon">&#xe639;</text>
<text class="list-text">新消息通知</text>
<text class="navigat-arrow">&#xe65e;</text>
</view>
</view>
<view class="center-list">
<view class="center-list-item border-bottom">
<text class="list-icon">&#xe60b;</text>
<text class="list-text">帮助与反馈</text>
<text class="navigat-arrow">&#xe65e;</text>
</view>
<view class="center-list-item">
<text class="list-icon">&#xe65f;</text>
<text class="list-text">服务条款及隐私</text>
<text class="navigat-arrow">&#xe65e;</text>
</view>
</view>
<view class="center-list">
<view class="center-list-item">
<text class="list-icon">&#xe614;</text>
<text class="list-text">关于应用</text>
<text class="navigat-arrow">&#xe65e;</text>
</view>
</view>
<view class="btn-row">
<button v-if="hasLogin" class="primary" type="primary" :loading="logoutBtnLoading" @tap="bindLogout">退出登录</button>
</view>
</view>
</view>
</template>
<script>
import {
mapState,
mapMutations
} from 'vuex'
import {
univerifyLogin
} from '@/common/univerify.js'
export default {
data() {
return {
avatarUrl: "../../static/img/logo.png",
inviteUrl: '',
logoutBtnLoading: false,
hasPwd: uni.getStorageSync('uni_id_has_pwd')
}
},
computed: {
...mapState(['hasLogin', 'forcedLogin', 'userName'])
},
methods: {
...mapMutations(['logout']),
bindLogin() {
if (!this.hasLogin) {
univerifyLogin().catch(err => {
if (err === false) return;
uni.navigateTo({
url: '../login/login',
});
})
}
},
bindLogout() {
const loginType = uni.getStorageSync('login_type')
if (loginType === 'local') {
this.logout();
if (this.forcedLogin) {
uni.reLaunch({
url: '../login/login',
});
}
return
}
this.logoutBtnLoading = true
uniCloud.callFunction({
name: 'user-center',
data: {
action: 'logout'
},
success: (e) => {
console.log('logout success', e);
if (e.result.code == 0) {
this.logout();
uni.removeStorageSync('uni_id_token')
uni.removeStorageSync('username')
uni.removeStorageSync('uni_id_has_pwd')
/**
* 如果需要强制登录跳转回登录页面
*/
this.inviteUrl = ''
if (this.forcedLogin) {
uni.reLaunch({
url: '../login/login',
});
}
} else {
uni.showModal({
content: e.result.msg,
showCancel: false
})
console.log('登出失败', e);
}
},
fail: (e) => {
uni.showModal({
content: JSON.stringify(e),
showCancel: false
})
},
complete: () => {
this.logoutBtnLoading = false
}
})
},
toInvite() {
uni.navigateTo({
url: '/pages/invite/invite'
})
},
goto() {
uni.navigateTo({
url: '../pwd/update-password'
})
}
}
}
</script>
<style>
@font-face {
font-family: texticons;
font-weight: normal;
font-style: normal;
src: url('https://at.alicdn.com/t/font_984210_5cs13ndgqsn.ttf') format('truetype');
}
page,
view {
display: flex;
}
page {
background-color: #f8f8f8;
}
button {
width: 100%;
}
.center {
flex-direction: column;
}
.logo {
width: 750rpx;
height: 240rpx;
padding: 20rpx;
box-sizing: border-box;
background-color: #0faeff;
flex-direction: row;
align-items: center;
}
.logo-hover {
opacity: 0.8;
}
.logo-img {
width: 120rpx;
height: 120rpx;
border-radius: 150rpx;
}
.logo-title {
height: 150rpx;
flex: 1;
align-items: center;
justify-content: space-between;
flex-direction: row;
margin-left: 20rpx;
}
.uer-name {
height: 60rpx;
line-height: 60rpx;
color: #FFFFFF;
}
.go-login.navigat-arrow {
color: #FFFFFF;
}
.login-title {
height: 150rpx;
align-items: self-start;
justify-content: center;
flex-direction: column;
margin-left: 20rpx;
}
.center-list {
background-color: #FFFFFF;
margin-top: 20rpx;
width: 750rpx;
flex-direction: column;
}
.center-list-item {
height: 90rpx;
width: 750rpx;
box-sizing: border-box;
flex-direction: row;
padding: 0rpx 20rpx;
}
.border-bottom {
border-bottom-width: 1rpx;
border-color: #c8c7cc;
border-bottom-style: solid;
}
.list-icon {
width: 40rpx;
height: 90rpx;
line-height: 90rpx;
color: #0faeff;
text-align: center;
font-family: texticons;
margin-right: 20rpx;
}
.list-text {
height: 90rpx;
line-height: 90rpx;
color: #555;
flex: 1;
text-align: left;
}
.navigat-arrow {
height: 90rpx;
width: 40rpx;
line-height: 90rpx;
color: #555;
text-align: right;
font-family: texticons;
}
</style>
@font-face {
font-family: uniicons;
font-weight: normal;
font-style: normal;
src: url('/static/uni.ttf') format('truetype');
}
.m-icon {
font-family: uniicons;
/* font-size: 24px; */
margin-left: 20px;
font-weight: normal;
font-style: normal;
line-height: 1;
display: inline-block;
text-decoration: none;
-webkit-font-smoothing: antialiased;
}
.m-icon.uni-active {
color: #007aff;
}
.m-icon-contact:before {
content: '\e100';
}
.m-icon-person:before {
content: '\e101';
}
.m-icon-personadd:before {
content: '\e102';
}
.m-icon-contact-filled:before {
content: '\e130';
}
.m-icon-person-filled:before {
content: '\e131';
}
.m-icon-personadd-filled:before {
content: '\e132';
}
.m-icon-phone:before {
content: '\e200';
}
.m-icon-email:before {
content: '\e201';
}
.m-icon-chatbubble:before {
content: '\e202';
}
.m-icon-chatboxes:before {
content: '\e203';
}
.m-icon-phone-filled:before {
content: '\e230';
}
.m-icon-email-filled:before {
content: '\e231';
}
.m-icon-chatbubble-filled:before {
content: '\e232';
}
.m-icon-chatboxes-filled:before {
content: '\e233';
}
.m-icon-weibo:before {
content: '\e260';
}
.m-icon-weixin:before {
content: '\e261';
}
.m-icon-pengyouquan:before {
content: '\e262';
}
.m-icon-chat:before {
content: '\e263';
}
.m-icon-qq:before {
content: '\e264';
}
.m-icon-videocam:before {
content: '\e300';
}
.m-icon-camera:before {
content: '\e301';
}
.m-icon-mic:before {
content: '\e302';
}
.m-icon-location:before {
content: '\e303';
}
.m-icon-mic-filled:before,
.m-icon-speech:before {
content: '\e332';
}
.m-icon-location-filled:before {
content: '\e333';
}
.m-icon-micoff:before {
content: '\e360';
}
.m-icon-image:before {
content: '\e363';
}
.m-icon-map:before {
content: '\e364';
}
.m-icon-compose:before {
content: '\e400';
}
.m-icon-trash:before {
content: '\e401';
}
.m-icon-upload:before {
content: '\e402';
}
.m-icon-download:before {
content: '\e403';
}
.m-icon-close:before {
content: '\e404';
}
.m-icon-redo:before {
content: '\e405';
}
.m-icon-undo:before {
content: '\e406';
}
.m-icon-refresh:before {
content: '\e407';
}
.m-icon-star:before {
content: '\e408';
}
.m-icon-plus:before {
content: '\e409';
}
.m-icon-minus:before {
content: '\e410';
}
.m-icon-circle:before,
.m-icon-checkbox:before {
content: '\e411';
}
.m-icon-close-filled:before,
.m-icon-clear:before {
content: '\e434';
}
.m-icon-refresh-filled:before {
content: '\e437';
}
.m-icon-star-filled:before {
content: '\e438';
}
.m-icon-plus-filled:before {
content: '\e439';
}
.m-icon-minus-filled:before {
content: '\e440';
}
.m-icon-circle-filled:before {
content: '\e441';
}
.m-icon-checkbox-filled:before {
content: '\e442';
}
.m-icon-closeempty:before {
content: '\e460';
}
.m-icon-refreshempty:before {
content: '\e461';
}
.m-icon-reload:before {
content: '\e462';
}
.m-icon-starhalf:before {
content: '\e463';
}
.m-icon-spinner:before {
content: '\e464';
}
.m-icon-spinner-cycle:before {
content: '\e465';
}
.m-icon-search:before {
content: '\e466';
}
.m-icon-plusempty:before {
content: '\e468';
}
.m-icon-forward:before {
content: '\e470';
}
.m-icon-back:before,
.m-icon-left-nav:before {
content: '\e471';
}
.m-icon-checkmarkempty:before {
content: '\e472';
}
.m-icon-home:before {
content: '\e500';
}
.m-icon-navigate:before {
content: '\e501';
}
.m-icon-gear:before {
content: '\e502';
}
.m-icon-paperplane:before {
content: '\e503';
}
.m-icon-info:before {
content: '\e504';
}
.m-icon-help:before {
content: '\e505';
}
.m-icon-locked:before {
content: '\e506';
}
.m-icon-more:before {
content: '\e507';
}
.m-icon-flag:before {
content: '\e508';
}
.m-icon-home-filled:before {
content: '\e530';
}
.m-icon-gear-filled:before {
content: '\e532';
}
.m-icon-info-filled:before {
content: '\e534';
}
.m-icon-help-filled:before {
content: '\e535';
}
.m-icon-more-filled:before {
content: '\e537';
}
.m-icon-settings:before {
content: '\e560';
}
.m-icon-list:before {
content: '\e562';
}
.m-icon-bars:before {
content: '\e563';
}
.m-icon-loop:before {
content: '\e565';
}
.m-icon-paperclip:before {
content: '\e567';
}
.m-icon-eye:before {
content: '\e568';
}
.m-icon-arrowup:before {
content: '\e580';
}
.m-icon-arrowdown:before {
content: '\e581';
}
.m-icon-arrowleft:before {
content: '\e582';
}
.m-icon-arrowright:before {
content: '\e583';
}
.m-icon-arrowthinup:before {
content: '\e584';
}
.m-icon-arrowthindown:before {
content: '\e585';
}
.m-icon-arrowthinleft:before {
content: '\e586';
}
.m-icon-arrowthinright:before {
content: '\e587';
}
.m-icon-pulldown:before {
content: '\e588';
}
.m-icon-scan:before {
content: "\e612";
}
<template>
<view class="m-icon" :class="['m-icon-'+type]" @click="onClick()"></view>
</template>
<script>
export default {
props: {
/**
* 图标类型
*/
type: String
},
methods: {
onClick() {
this.$emit('click')
}
}
}
</script>
<style>
@import "./m-icon.css";
</style>
<template>
<view class="m-input-view">
<input :focus="focus" :type="inputType" :value="value" @input="onInput" class="m-input-input" :placeholder="placeholder"
:password="type==='password'&&!showPassword" @focus="onFocus" @blur="onBlur" />
<!-- 优先显示密码可见按钮 -->
<view v-if="clearable&&!displayable&&value.length" class="m-input-icon">
<m-icon color="#666666" type="clear" @click="clear"></m-icon>
</view>
<view v-if="displayable" class="m-input-icon">
<m-icon :style="{color:showPassword?'#666666':'#cccccc'}" type="eye" @click="display"></m-icon>
</view>
</view>
</template>
<script>
import mIcon from './m-icon/m-icon.vue'
export default {
components: {
mIcon
},
props: {
/**
* 输入类型
*/
type: String,
/**
* 值
*/
value: String,
/**
* 占位符
*/
placeholder: String,
/**
* 是否显示清除按钮
*/
clearable: {
type: [Boolean, String],
default: false
},
/**
* 是否显示密码可见按钮
*/
displayable: {
type: [Boolean, String],
default: false
},
/**
* 自动获取焦点
*/
focus: {
type: [Boolean, String],
default: false
}
},
model: {
prop: 'value',
event: 'input'
},
data() {
return {
/**
* 显示密码明文
*/
showPassword: false,
/**
* 是否获取焦点
*/
isFocus: false
}
},
computed: {
inputType() {
const type = this.type
return type === 'password' ? 'text' : type
}
},
methods: {
clear() {
this.$emit('input', '')
},
display() {
this.showPassword = !this.showPassword
},
onFocus() {
this.isFocus = true
},
onBlur() {
this.$nextTick(() => {
this.isFocus = false
})
},
onInput(e) {
this.$emit('input', e.detail.value)
}
}
}
</script>
<style>
.m-input-view {
display: inline-flex;
flex-direction: row;
align-items: center;
/* width: 100%; */
flex: 1;
padding: 0 10px;
}
.m-input-input {
flex: 1;
width: 100%;
height: 20px;
line-height: 20px;
background-color: rgba(0, 0, 0, 0);
}
.m-input-icon {
/* width: 20px; */
font-size: 20px;
line-height: 20px;
color: #666666;
}
</style>
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册