diff --git a/.gitignore b/.gitignore index 2561bb4..eda1a93 100644 --- a/.gitignore +++ b/.gitignore @@ -21,3 +21,4 @@ yarn-error.log* *.njsproj *.sln *.sw* +/package-lock.json diff --git a/package.json b/package.json index 0457ba1..a7476e9 100644 --- a/package.json +++ b/package.json @@ -34,6 +34,7 @@ "@dcloudio/uni-mp-weixin": "^2.0.0-23320190923002", "@dcloudio/uni-stat": "^2.0.0-23320190923002", "flyio": "^0.6.2", + "mpvue-weui": "^1.0.13", "regenerator-runtime": "^0.12.1", "vue": "^2.6.10", "vuex": "^3.0.1" @@ -46,8 +47,8 @@ "@dcloudio/vue-cli-plugin-uni-optimize": "^2.0.0-23320190923002", "@dcloudio/webpack-uni-mp-loader": "^2.0.0-23320190923002", "@dcloudio/webpack-uni-pages-loader": "^2.0.0-23320190923002", - "@types/html5plus": "*", - "@types/uni-app": "*", + "@types/html5plus": "^1.0.0", + "@types/uni-app": "^1.4.0", "@vue/cli-plugin-babel": "3.5.1", "@vue/cli-service": "^3.12.0", "babel-plugin-import": "^1.11.0", diff --git a/postcss.config.js b/postcss.config.js index 5112863..7867f0a 100644 --- a/postcss.config.js +++ b/postcss.config.js @@ -5,6 +5,6 @@ module.exports = { require('autoprefixer')({ remove: process.env.UNI_PLATFORM !== 'h5' }), - require('@dcloudio/vue-cli-plugin-uni/packages/postcss') + require('@dcloudio/vue-cli-plugin-uni/packages/postcss'), ] } diff --git a/src/App.vue b/src/App.vue index 8c2b732..8050a38 100644 --- a/src/App.vue +++ b/src/App.vue @@ -14,4 +14,9 @@ diff --git a/src/common/uni.css b/src/common/uni.css new file mode 100644 index 0000000..c6ec0a6 --- /dev/null +++ b/src/common/uni.css @@ -0,0 +1,1447 @@ +@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 { + 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%); +} diff --git a/src/manifest.json b/src/manifest.json index 972bd1e..1512164 100644 --- a/src/manifest.json +++ b/src/manifest.json @@ -54,7 +54,7 @@ }, "mp-weixin": { /* 微信小程序特有相关 */ - "appid": "", + "appid": "wx3f63b0c4127278ac", "setting": { "urlCheck": false }, diff --git a/src/pages.json b/src/pages.json index 1aea851..6370ba6 100644 --- a/src/pages.json +++ b/src/pages.json @@ -1,16 +1,45 @@ { - "pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages - { - "path": "pages/index/index", - "style": { - "navigationBarTitleText": "uni-app" - } - } - ], - "globalStyle": { - "navigationBarTextStyle": "black", - "navigationBarTitleText": "uni-app", - "navigationBarBackgroundColor": "#F8F8F8", - "backgroundColor": "#F8F8F8" - } + "pages": [ + //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages + { + "path": "pages/waste_sorting/query", + "style": { + "navigationBarTitleText": "查询" + } + }, + { + "path": "pages/waste_sorting/baike", + "style": { + "navigationBarTitleText": "百科" + } + }, + { + "path": "pages/waste_sorting/question", + "style": { + "navigationBarTitleText": "测验" + } + } + ], + "globalStyle": { + "navigationBarTextStyle": "black", + "navigationBarTitleText": "uni-app", + "navigationBarBackgroundColor": "#F8F8F8", + "backgroundColor": "#F8F8F8" + }, + "tabBar": { + "list": [ + { + "pagePath": "pages/waste_sorting/query", + "text": "查询" + }, + { + "pagePath": "pages/waste_sorting/baike", + "text": "百科" + }, + { + "pagePath": "pages/waste_sorting/question", + "text": "测验" + } + ] + } } diff --git a/src/pages/index/index.vue b/src/pages/index/index.vue index 30323da..3280c0d 100644 --- a/src/pages/index/index.vue +++ b/src/pages/index/index.vue @@ -26,17 +26,17 @@ diff --git a/src/pages/waste_sorting/baike.vue b/src/pages/waste_sorting/baike.vue new file mode 100644 index 0000000..462ed4d --- /dev/null +++ b/src/pages/waste_sorting/baike.vue @@ -0,0 +1,62 @@ + + + + + \ No newline at end of file diff --git a/src/pages/waste_sorting/query.vue b/src/pages/waste_sorting/query.vue new file mode 100644 index 0000000..e0ffe2c --- /dev/null +++ b/src/pages/waste_sorting/query.vue @@ -0,0 +1,75 @@ + + + + + \ No newline at end of file diff --git a/src/pages/waste_sorting/question.vue b/src/pages/waste_sorting/question.vue new file mode 100644 index 0000000..a75461d --- /dev/null +++ b/src/pages/waste_sorting/question.vue @@ -0,0 +1,91 @@ + + + + + \ No newline at end of file diff --git a/src/static/photo.png b/src/static/photo.png new file mode 100644 index 0000000..fed8406 Binary files /dev/null and b/src/static/photo.png differ diff --git a/src/static/uni.ttf b/src/static/uni.ttf new file mode 100644 index 0000000..e8d4909 Binary files /dev/null and b/src/static/uni.ttf differ diff --git a/src/uni.scss b/src/uni.scss index f0f426c..845142d 100644 --- a/src/uni.scss +++ b/src/uni.scss @@ -39,38 +39,38 @@ $uni-border-color:#c8c7cc; /* 尺寸变量 */ /* 文字尺寸 */ -$uni-font-size-sm:24upx; -$uni-font-size-base:28upx; -$uni-font-size-lg:32upx; +$uni-font-size-sm:24rpx; +$uni-font-size-base:28rpx; +$uni-font-size-lg:32rpx; /* 图片尺寸 */ -$uni-img-size-sm:40upx; -$uni-img-size-base:52upx; -$uni-img-size-lg:80upx; +$uni-img-size-sm:40rpx; +$uni-img-size-base:52rpx; +$uni-img-size-lg:80rpx; /* Border Radius */ -$uni-border-radius-sm: 4upx; -$uni-border-radius-base: 6upx; -$uni-border-radius-lg: 12upx; +$uni-border-radius-sm: 4rpx; +$uni-border-radius-base: 6rpx; +$uni-border-radius-lg: 12rpx; $uni-border-radius-circle: 50%; /* 水平间距 */ $uni-spacing-row-sm: 10px; -$uni-spacing-row-base: 20upx; -$uni-spacing-row-lg: 30upx; +$uni-spacing-row-base: 20rpx; +$uni-spacing-row-lg: 30rpx; /* 垂直间距 */ -$uni-spacing-col-sm: 8upx; -$uni-spacing-col-base: 16upx; -$uni-spacing-col-lg: 24upx; +$uni-spacing-col-sm: 8rpx; +$uni-spacing-col-base: 16rpx; +$uni-spacing-col-lg: 24rpx; /* 透明度 */ $uni-opacity-disabled: 0.3; // 组件禁用态的透明度 /* 文章场景相关 */ $uni-color-title: #2C405A; // 文章标题颜色 -$uni-font-size-title:40upx; +$uni-font-size-title:40rpx; $uni-color-subtitle: #555555; // 二级标题颜色 -$uni-font-size-subtitle:36upx; +$uni-font-size-subtitle:36rpx; $uni-color-paragraph: #3F536E; // 文章段落颜色 -$uni-font-size-paragraph:30upx; \ No newline at end of file +$uni-font-size-paragraph:30rpx; \ No newline at end of file diff --git a/yarn.lock b/yarn.lock index 0f4625d..060f2b1 100644 --- a/yarn.lock +++ b/yarn.lock @@ -862,10 +862,10 @@ "@types/minimatch" "*" "@types/node" "*" -"@types/html5plus@*": +"@types/html5plus@^1.0.0": version "1.0.0" - resolved "https://registry.npm.taobao.org/@types/html5plus/download/@types/html5plus-1.0.0.tgz#a88600fc9de85b785959754aea403c0a8d0714ba" - integrity sha1-qIYA/J3oW3hZWXVK6kA8Co0HFLo= + resolved "https://registry.yarnpkg.com/@types/html5plus/-/html5plus-1.0.0.tgz#a88600fc9de85b785959754aea403c0a8d0714ba" + integrity sha512-kTL4Ik+pTXEAhzDS0jUp0x1kEEY025LQzqEKN1ggnQwWgRHQzAf3tY2ZCYr57jPz9TypN0z1Tf/XY6xQbSPSDw== "@types/minimatch@*": version "3.0.3" @@ -887,10 +887,10 @@ resolved "https://registry.npm.taobao.org/@types/q/download/@types/q-1.5.2.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40types%2Fq%2Fdownload%2F%40types%2Fq-1.5.2.tgz#690a1475b84f2a884fd07cd797c00f5f31356ea8" integrity sha1-aQoUdbhPKohP0HzXl8APXzE1bqg= -"@types/uni-app@*": +"@types/uni-app@^1.4.0": version "1.4.0" - resolved "https://registry.npm.taobao.org/@types/uni-app/download/@types/uni-app-1.4.0.tgz#83b910384733c19b1947e285ac07924bbdb074a6" - integrity sha1-g7kQOEczwZsZR+KFrAeSS72wdKY= + resolved "https://registry.yarnpkg.com/@types/uni-app/-/uni-app-1.4.0.tgz#83b910384733c19b1947e285ac07924bbdb074a6" + integrity sha512-qRrNTzPOVTIDzDQWJ4zXhKxfnk4LfQwkf5HVBMWL/d0ke039eHbmlhZJCm7kIxa0fa/mNgREkWDgvzs2Uz2y3A== dependencies: vue "^2.6.8" @@ -5054,6 +5054,24 @@ move-concurrently@^1.0.1: rimraf "^2.5.4" run-queue "^1.0.3" +mpvue-citypicker@^1.0.6: + version "1.0.6" + resolved "https://registry.yarnpkg.com/mpvue-citypicker/-/mpvue-citypicker-1.0.6.tgz#861b9d4b1ed2245ad860d7e29dd2872d8fa7c74a" + integrity sha512-V8TuUILYw7pFV0ii02tXKUtLmoa+mTxxJS85dEIc4sp85dVTLNi2GmXqBoz9MkT+QwKeOf3fPvFZzoucERz5rA== + +mpvue-picker@^2.1.6: + version "2.1.6" + resolved "https://registry.yarnpkg.com/mpvue-picker/-/mpvue-picker-2.1.6.tgz#e4e423bf66e063e3ab17076094601e847f670798" + integrity sha512-qm4sAw8uFfwIl6CBSyKWij8OcAcLntag3acqeYJy4TgNjaANOrZMx8UaA9dY+NZOrLmFJL/rZwxWKd3rg3O7dA== + +mpvue-weui@^1.0.13: + version "1.0.13" + resolved "https://registry.yarnpkg.com/mpvue-weui/-/mpvue-weui-1.0.13.tgz#d4b42a42f7b73fa32526deb54f3d48dc6e776c7d" + integrity sha512-zgIQ0LqOVywaASOLJptgI3MAEiTcO9cwKO2NTO0dBBF3kFwbopAGMROOd+lRqQFuC9+46huYxjqijVbNMfkejg== + dependencies: + mpvue-citypicker "^1.0.6" + mpvue-picker "^2.1.6" + ms@2.0.0: version "2.0.0" resolved "https://registry.npm.taobao.org/ms/download/ms-2.0.0.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fms%2Fdownload%2Fms-2.0.0.tgz#5608aeadfc00be6c2901df5f9861788de0d597c8"