| | |
| | | <style>
|
| | | @import "static/css/colorUi/icon.css";
|
| | | /*每个页面公共css */
|
| | | |
| | | /* #ifndef APP-PLUS-NVUE */ |
| | | /* uni.css - 通用组件、模板样式库,可以当作一套ui库应用 */ |
| | | @import './common/uni.css'; |
| | | /* H5 兼容 pc 所需 */ |
| | | @media screen and (min-width: 768px) { |
| | | body { |
| | | overflow-y: scroll; |
| | | } |
| | | } |
| | | |
| | | /* #endif */ |
| | | |
| | | body {
|
| | | background-color: #f1f1f1;
|
| | | color: #606266;
|
New file |
| | |
| | | /* #ifndef APP-PLUS-NVUE */ |
| | | page { |
| | | min-height: 100%; |
| | | height: auto; |
| | | } |
| | | /* #endif */ |
| | | |
| | | /* 解决头条小程序字体图标不显示问题,因为头条运行时自动插入了span标签,且有全局字体 */ |
| | | /* #ifdef MP-TOUTIAO */ |
| | | /* text :not(view) { |
| | | font-family: uniicons; |
| | | } */ |
| | | /* #endif */ |
| | | |
| | | .uni-icon { |
| | | font-family: uniicons; |
| | | font-weight: normal; |
| | | } |
| | | |
| | | .uni-container { |
| | | padding: 15px; |
| | | background-color: #f8f8f8; |
| | | } |
| | | |
| | | .uni-header-logo { |
| | | /* #ifdef H5 */ |
| | | display: flex; |
| | | /* #endif */ |
| | | padding: 15px 15px; |
| | | flex-direction: column; |
| | | justify-content: center; |
| | | align-items: center; |
| | | margin-top: 10rpx; |
| | | } |
| | | |
| | | .uni-header-image { |
| | | width: 80px; |
| | | height: 80px; |
| | | } |
| | | |
| | | .uni-hello-text { |
| | | margin-bottom: 20px; |
| | | } |
| | | |
| | | .hello-text { |
| | | color: #7A7E83; |
| | | font-size: 14px; |
| | | line-height: 20px; |
| | | } |
| | | |
| | | .hello-link { |
| | | color: #7A7E83; |
| | | font-size: 14px; |
| | | line-height: 20px; |
| | | } |
| | | |
| | | .uni-panel { |
| | | margin-bottom: 12px; |
| | | } |
| | | |
| | | .uni-panel-h { |
| | | /* #ifdef H5 */ |
| | | display: flex; |
| | | /* #endif */ |
| | | background-color: #ffffff; |
| | | flex-direction: row !important; |
| | | /* justify-content: space-between !important; */ |
| | | align-items: center !important; |
| | | padding: 12px; |
| | | /* #ifdef H5 */ |
| | | cursor: pointer; |
| | | /* #endif */ |
| | | } |
| | | /* |
| | | .uni-panel-h:active { |
| | | background-color: #f8f8f8; |
| | | } |
| | | */ |
| | | .uni-panel-h-on { |
| | | background-color: #f0f0f0; |
| | | } |
| | | |
| | | .uni-panel-text { |
| | | flex: 1; |
| | | color: #000000; |
| | | font-size: 14px; |
| | | font-weight: normal; |
| | | } |
| | | |
| | | .uni-panel-icon { |
| | | margin-left: 15px; |
| | | color: #999999; |
| | | font-size: 14px; |
| | | font-weight: normal; |
| | | transform: rotate(0deg); |
| | | transition-duration: 0s; |
| | | transition-property: transform; |
| | | } |
| | | |
| | | .uni-panel-icon-on { |
| | | transform: rotate(180deg); |
| | | } |
| | | |
| | | .uni-navigate-item { |
| | | /* #ifdef H5 */ |
| | | display: flex; |
| | | /* #endif */ |
| | | flex-direction: row; |
| | | align-items: center; |
| | | background-color: #FFFFFF; |
| | | border-top-style: solid; |
| | | border-top-color: #f0f0f0; |
| | | border-top-width: 1px; |
| | | padding: 12px; |
| | | /* #ifdef H5 */ |
| | | cursor: pointer; |
| | | /* #endif */ |
| | | } |
| | | |
| | | .uni-navigate-item:active { |
| | | background-color: #f8f8f8; |
| | | } |
| | | |
| | | .uni-navigate-text { |
| | | flex: 1; |
| | | color: #000000; |
| | | font-size: 14px; |
| | | font-weight: normal; |
| | | } |
| | | |
| | | .uni-navigate-icon { |
| | | margin-left: 15px; |
| | | color: #999999; |
| | | font-size: 14px; |
| | | font-weight: normal; |
| | | } |
New file |
| | |
| | | @font-face {
|
| | | font-family: uniicons;
|
| | | font-weight: normal;
|
| | | font-style: normal;
|
| | | /* src: url('~@/static/uni.ttf') format('truetype'); */
|
| | | }
|
| | |
|
| | | /* #ifdef H5 */ |
| | | .fix-left-window { |
| | | padding-left: var(--window-left); |
| | | } |
| | | .pc-hide { |
| | | display: none !important; |
| | | } |
| | | /* #endif */ |
| | | |
| | | /*通用 */ |
| | |
|
| | | /* 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 */
|
| | | .common-page-head{
|
| | | padding:35rpx;
|
| | | text-align: center;
|
| | | }
|
| | | .common-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-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%);
|
| | | }
|
| | | |
| | | .left-win-active text{ |
| | | color: #007AFF !important; |
| | | } |
New file |
| | |
| | | function formatTime(time) {
|
| | | if (typeof time !== 'number' || time < 0) {
|
| | | return time
|
| | | }
|
| | |
|
| | | var hour = parseInt(time / 3600)
|
| | | time = time % 3600
|
| | | var minute = parseInt(time / 60)
|
| | | time = time % 60
|
| | | var second = time
|
| | |
|
| | | return ([hour, minute, second]).map(function(n) {
|
| | | n = n.toString()
|
| | | return n[1] ? n : '0' + n
|
| | | }).join(':')
|
| | | }
|
| | |
|
| | | function formatLocation(longitude, latitude) {
|
| | | if (typeof longitude === 'string' && typeof latitude === 'string') {
|
| | | longitude = parseFloat(longitude)
|
| | | latitude = parseFloat(latitude)
|
| | | }
|
| | |
|
| | | longitude = longitude.toFixed(2)
|
| | | latitude = latitude.toFixed(2)
|
| | |
|
| | | return {
|
| | | longitude: longitude.toString().split('.'),
|
| | | latitude: latitude.toString().split('.')
|
| | | }
|
| | | }
|
| | | var dateUtils = {
|
| | | UNITS: {
|
| | | '年': 31557600000,
|
| | | '月': 2629800000,
|
| | | '天': 86400000,
|
| | | '小时': 3600000,
|
| | | '分钟': 60000,
|
| | | '秒': 1000
|
| | | },
|
| | | humanize: function(milliseconds) {
|
| | | var humanize = '';
|
| | | for (var key in this.UNITS) {
|
| | | if (milliseconds >= this.UNITS[key]) {
|
| | | humanize = Math.floor(milliseconds / this.UNITS[key]) + key + '前';
|
| | | break;
|
| | | }
|
| | | }
|
| | | return humanize || '刚刚';
|
| | | },
|
| | | format: function(dateStr) {
|
| | | var date = this.parse(dateStr)
|
| | | var diff = Date.now() - date.getTime();
|
| | | if (diff < this.UNITS['天']) {
|
| | | return this.humanize(diff);
|
| | | }
|
| | | var _format = function(number) {
|
| | | return (number < 10 ? ('0' + number) : number);
|
| | | };
|
| | | return date.getFullYear() + '/' + _format(date.getMonth() + 1) + '/' + _format(date.getDate()) + '-' +
|
| | | _format(date.getHours()) + ':' + _format(date.getMinutes());
|
| | | },
|
| | | parse: function(str) { //将"yyyy-mm-dd HH:MM:ss"格式的字符串,转化为一个Date对象
|
| | | var a = str.split(/[^0-9]/);
|
| | | return new Date(a[0], a[1] - 1, a[2], a[3], a[4], a[5]);
|
| | | }
|
| | | };
|
| | |
|
| | | export {
|
| | | formatTime,
|
| | | formatLocation,
|
| | | dateUtils
|
| | | } |
| | |
| | | "enablePullDownRefresh": false |
| | | } |
| | |
|
| | | }, |
| | | {
|
| | | "path" : "pages/stock/orderBindSeed",
|
| | | "style" : |
| | | { |
| | | "navigationBarTitleText": "地标绑定", |
| | | "enablePullDownRefresh": false |
| | | } |
| | | |
| | | }
|
| | | ],
|
| | | "globalStyle": {
|
| | |
| | | url: '/stock/outFlat'
|
| | | },
|
| | | {
|
| | | title: '订单入库',
|
| | | name: 'orderPakin',
|
| | | title: '地标绑定', |
| | | name: 'orderBindSeed', |
| | | color: 'red',
|
| | | cuIcon: 'pullup',
|
| | | url: '/order/orderPakin'
|
| | | url: '/stock/orderBindSeed' |
| | | },
|
| | | {
|
| | | title: '打印',
|
| | | name: 'print',
|
| | | color: 'purple',
|
| | | cuIcon: 'text',
|
| | | url: '/print/print'
|
| | | },
|
| | | {
|
| | | title: '订单上架',
|
| | | name: 'orderPutOn',
|
| | | color: 'yellow',
|
| | | cuIcon: 'pullup',
|
| | | url: '/order/orderPutOn'
|
| | | },
|
| | | {
|
| | | title: '订单下架',
|
| | | name: 'orderPutDown',
|
| | | color: 'olive',
|
| | | cuIcon: 'pulldown',
|
| | | url: '/order/orderPutDown'
|
| | | },
|
| | | {
|
| | | title: '库存查询',
|
| | | name: 'stockQuery',
|
| | | color: 'green',
|
| | | cuIcon: 'check',
|
| | | url: '/stock/stockQuery'
|
| | | },
|
| | | {
|
| | | title: '盘点',
|
| | | name: 'stockCheck',
|
| | | color: 'red',
|
| | | cuIcon: 'post',
|
| | | url: '/stock/stockCheck'
|
| | | },
|
| | | {
|
| | | title: '商品打印',
|
| | | name: 'matList',
|
| | | color: 'orange',
|
| | | cuIcon: 'post',
|
| | | url: '/mat/matList'
|
| | | },
|
| | | {
|
| | | title: '补货',
|
| | | name: 'restock',
|
| | | color: 'yellow',
|
| | | cuIcon: 'punch',
|
| | | url: '/stock/restock'
|
| | | },
|
| | | {
|
| | | title: '转全板',
|
| | | name: 'piking',
|
| | | color: 'olive',
|
| | | cuIcon: 'order',
|
| | | url: '/pakin/piking'
|
| | | },
|
| | | {
|
| | | title: '换板绑定',
|
| | | name: 'changePallet',
|
| | | color: 'green',
|
| | | cuIcon: 'order',
|
| | | url: '/stock/changePallet'
|
| | | },
|
| | | // {
|
| | | // title: '订单入库',
|
| | | // name: 'orderPakin',
|
| | | // color: 'red',
|
| | | // cuIcon: 'pullup',
|
| | | // url: '/order/orderPakin'
|
| | | // },
|
| | | // {
|
| | | // title: '打印',
|
| | | // name: 'print',
|
| | | // color: 'purple',
|
| | | // cuIcon: 'text',
|
| | | // url: '/print/print'
|
| | | // },
|
| | | // {
|
| | | // title: '订单上架',
|
| | | // name: 'orderPutOn',
|
| | | // color: 'yellow',
|
| | | // cuIcon: 'pullup',
|
| | | // url: '/order/orderPutOn'
|
| | | // },
|
| | | // {
|
| | | // title: '订单下架',
|
| | | // name: 'orderPutDown',
|
| | | // color: 'olive',
|
| | | // cuIcon: 'pulldown',
|
| | | // url: '/order/orderPutDown'
|
| | | // },
|
| | | // {
|
| | | // title: '库存查询',
|
| | | // name: 'stockQuery',
|
| | | // color: 'green',
|
| | | // cuIcon: 'check',
|
| | | // url: '/stock/stockQuery'
|
| | | // },
|
| | | // {
|
| | | // title: '盘点',
|
| | | // name: 'stockCheck',
|
| | | // color: 'red',
|
| | | // cuIcon: 'post',
|
| | | // url: '/stock/stockCheck'
|
| | | // },
|
| | | // {
|
| | | // title: '商品打印',
|
| | | // name: 'matList',
|
| | | // color: 'orange',
|
| | | // cuIcon: 'post',
|
| | | // url: '/mat/matList'
|
| | | // },
|
| | | // {
|
| | | // title: '补货',
|
| | | // name: 'restock',
|
| | | // color: 'yellow',
|
| | | // cuIcon: 'punch',
|
| | | // url: '/stock/restock'
|
| | | // },
|
| | | // {
|
| | | // title: '转全板',
|
| | | // name: 'piking',
|
| | | // color: 'olive',
|
| | | // cuIcon: 'order',
|
| | | // url: '/pakin/piking'
|
| | | // },
|
| | | // {
|
| | | // title: '换板绑定',
|
| | | // name: 'changePallet',
|
| | | // color: 'green',
|
| | | // cuIcon: 'order',
|
| | | // url: '/stock/changePallet'
|
| | | // },
|
| | | {
|
| | | title: '退出登录',
|
| | | name: 'logOut',
|
New file |
| | |
| | | <template>
|
| | | <view>
|
| | | <view class="view-bg"> |
| | | <uni-section title="播种位" type="line" /> |
| | | <uni-data-select v-model="value" :localdata="range" @change="change" style="padding: 20rpx; height: 100rpx;background-color: white;"> |
| | | </uni-data-select> |
| | | </view> |
| | | <view class="view-bg"> |
| | | <uni-section title="订单" type="line" /> |
| | | <input maxlength="10" placeholder="PDA扫描站点标签" v-model="orderNo"/> |
| | | </view> |
| | | <view class="view-bg"> |
| | | <uni-section title="容器" type="line" /> |
| | | <input maxlength="10" placeholder="PDA扫描托盘/料箱标签" v-model="barcode"/> |
| | | </view> |
| | | |
| | | <view class="button-sp-buttom"> |
| | | <button class="btn-span" type="primary" @click="bindOrder">绑定</button> |
| | | <button class="btn-span" type="default">解绑</button> |
| | | </view>
|
| | | </view>
|
| | | </template>
|
| | |
|
| | | <script>
|
| | | export default {
|
| | | data() {
|
| | | return {
|
| | | value: 0,
|
| | | range: [], |
| | | orderNo: '', |
| | | barcode: ''
|
| | | }
|
| | | }, |
| | | |
| | | onLoad () { |
| | | this.baseUrl = uni.getStorageSync('baseUrl'); |
| | | this.token = uni.getStorageSync('token'); |
| | | this.getSeedLocs() |
| | | }, |
| | | |
| | | methods: { |
| | | getSeedLocs() { |
| | | let that = this |
| | | uni.request({ |
| | | url: this.baseUrl + '/pda/pick/seed/locs', |
| | | header: { |
| | | 'token': uni.getStorageSync('token') |
| | | }, |
| | | success(res) { |
| | | let result = res.data; |
| | | if (result.code === 200) { |
| | | if (result.data != undefined && result.data.length > 0) { |
| | | let array = result.data |
| | | console.log(array) |
| | | that.range = array.map((item, index) => { |
| | | return {text: item.siteNo, value: item.id} |
| | | }) |
| | | console.log(that.range) |
| | | } |
| | | } |
| | | } |
| | | }) |
| | | }, |
| | | |
| | | change(e) {
|
| | | console.log("e:", e);
|
| | | }, |
| | | //绑定订单至播种墙 |
| | | bindOrder() { |
| | | let that = this |
| | | uni.request({ |
| | | url: that.baseUrl + "/pda/pick/seed/bind", |
| | | data: {barcode: that.barcode, orderNo: that.orderNo, siteNo: '', type: 'bind'}, |
| | | header: { |
| | | 'token': uni.getStorageSync('token') |
| | | }, |
| | | success(res) { |
| | | let result = res.data; |
| | | if (result.code === 200) { |
| | | |
| | | } |
| | | } |
| | | }) |
| | | }, |
| | | //解绑 |
| | | unbindOrder() { |
| | | let that = this |
| | | uni.request({ |
| | | url: that.baseUrl + "/pda/pick/seed/bind", |
| | | data: {barcode: that.barcode, orderNo: that.orderNo, siteNo: '', type: 'unbind'}, |
| | | header: { |
| | | 'token': uni.getStorageSync('token') |
| | | }, |
| | | success(res) { |
| | | let result = res.data; |
| | | if (result.code === 200) { |
| | | |
| | | } |
| | | } |
| | | }) |
| | | }
|
| | | }
|
| | | }
|
| | | </script>
|
| | |
|
| | | <style> |
| | | @import url('../../static/css/wms.css/wms.css');
|
| | |
|
| | | .view-bg { |
| | | background-color: white; |
| | | |
| | | input { |
| | | padding: 30rpx;; |
| | | } |
| | | |
| | | .uni-section__content-title { |
| | | font-size: 16px; |
| | | } |
| | | |
| | | .uni-section__head { |
| | | .line { |
| | | background-color: #007aff; |
| | | } |
| | | } |
| | | } |
| | | |
| | | .button-sp-buttom { |
| | | margin-top: 90rpx; |
| | | padding: 40rpx; |
| | | |
| | | .btn-span { |
| | | margin: 30rpx 20rpx; |
| | | } |
| | | }
|
| | | </style> |
New file |
| | |
| | | ## 1.0.8(2024-03-28) |
| | | - 修复 在vue2下:style动态绑定导致编译失败的bug |
| | | ## 1.0.7(2024-01-20) |
| | | - 修复 长文本回显超过容器的bug,超过容器部分显示省略号 |
| | | ## 1.0.6(2023-04-12) |
| | | - 修复 微信小程序点击时会改变背景颜色的 bug |
| | | ## 1.0.5(2023-02-03) |
| | | - 修复 禁用时会显示清空按钮 |
| | | ## 1.0.4(2023-02-02) |
| | | - 优化 查询条件短期内多次变更只查询最后一次变更后的结果 |
| | | - 调整 内部缓存键名调整为 uni-data-select-lastSelectedValue |
| | | ## 1.0.3(2023-01-16) |
| | | - 修复 不关联服务空间报错的问题 |
| | | ## 1.0.2(2023-01-14) |
| | | - 新增 属性 `format` 可用于格式化显示选项内容 |
| | | ## 1.0.1(2022-12-06) |
| | | - 修复 当where变化时,数据不会自动更新的问题 |
| | | ## 0.1.9(2022-09-05) |
| | | - 修复 微信小程序下拉框出现后选择会点击到蒙板后面的输入框 |
| | | ## 0.1.8(2022-08-29) |
| | | - 修复 点击的位置不准确 |
| | | ## 0.1.7(2022-08-12) |
| | | - 新增 支持 disabled 属性 |
| | | ## 0.1.6(2022-07-06) |
| | | - 修复 pc端宽度异常的bug |
| | | ## 0.1.5 |
| | | - 修复 pc端宽度异常的bug |
| | | ## 0.1.4(2022-07-05) |
| | | - 优化 显示样式 |
| | | ## 0.1.3(2022-06-02) |
| | | - 修复 localdata 赋值不生效的 bug |
| | | - 新增 支持 uni.scss 修改颜色 |
| | | - 新增 支持选项禁用(数据选项设置 disabled: true 即禁用) |
| | | ## 0.1.2(2022-05-08) |
| | | - 修复 当 value 为 0 时选择不生效的 bug |
| | | ## 0.1.1(2022-05-07) |
| | | - 新增 记住上次的选项(仅 collection 存在时有效) |
| | | ## 0.1.0(2022-04-22) |
| | | - 初始化 |
New file |
| | |
| | | <template>
|
| | | <view class="uni-stat__select">
|
| | | <span v-if="label" class="uni-label-text hide-on-phone">{{label + ':'}}</span>
|
| | | <view class="uni-stat-box" :class="{'uni-stat__actived': current}">
|
| | | <view class="uni-select" :class="{'uni-select--disabled':disabled}">
|
| | | <view class="uni-select__input-box" @click="toggleSelector">
|
| | | <view v-if="current" class="uni-select__input-text">{{textShow}}</view>
|
| | | <view v-else class="uni-select__input-text uni-select__input-placeholder">{{typePlaceholder}}</view>
|
| | | <view v-if="current && clear && !disabled" @click.stop="clearVal">
|
| | | <uni-icons type="clear" color="#c0c4cc" size="24" />
|
| | | </view>
|
| | | <view v-else>
|
| | | <uni-icons :type="showSelector? 'top' : 'bottom'" size="14" color="#999" />
|
| | | </view>
|
| | | </view>
|
| | | <view class="uni-select--mask" v-if="showSelector" @click="toggleSelector" />
|
| | | <view class="uni-select__selector" :style="getOffsetByPlacement" v-if="showSelector">
|
| | | <view :class="placement=='bottom'?'uni-popper__arrow_bottom':'uni-popper__arrow_top'"></view>
|
| | | <scroll-view scroll-y="true" class="uni-select__selector-scroll">
|
| | | <view class="uni-select__selector-empty" v-if="mixinDatacomResData.length === 0">
|
| | | <text>{{emptyTips}}</text>
|
| | | </view>
|
| | | <view v-else class="uni-select__selector-item" v-for="(item,index) in mixinDatacomResData" :key="index"
|
| | | @click="change(item)">
|
| | | <text :class="{'uni-select__selector__disabled': item.disable}">{{formatItemName(item)}}</text>
|
| | | </view>
|
| | | </scroll-view>
|
| | | </view>
|
| | | </view>
|
| | | </view>
|
| | | </view>
|
| | | </template>
|
| | |
|
| | | <script>
|
| | | /**
|
| | | * DataChecklist 数据选择器
|
| | | * @description 通过数据渲染的下拉框组件
|
| | | * @tutorial https://uniapp.dcloud.io/component/uniui/uni-data-select
|
| | | * @property {String} value 默认值
|
| | | * @property {Array} localdata 本地数据 ,格式 [{text:'',value:''}]
|
| | | * @property {Boolean} clear 是否可以清空已选项
|
| | | * @property {Boolean} emptyText 没有数据时显示的文字 ,本地数据无效
|
| | | * @property {String} label 左侧标题
|
| | | * @property {String} placeholder 输入框的提示文字
|
| | | * @property {Boolean} disabled 是否禁用
|
| | | * @property {String} placement 弹出位置
|
| | | * @value top 顶部弹出
|
| | | * @value bottom 底部弹出(default)
|
| | | * @event {Function} change 选中发生变化触发
|
| | | */
|
| | |
|
| | | export default {
|
| | | name: "uni-data-select",
|
| | | mixins: [uniCloud.mixinDatacom || {}],
|
| | | props: {
|
| | | localdata: {
|
| | | type: Array,
|
| | | default () {
|
| | | return []
|
| | | }
|
| | | },
|
| | | value: {
|
| | | type: [String, Number],
|
| | | default: ''
|
| | | },
|
| | | modelValue: {
|
| | | type: [String, Number],
|
| | | default: ''
|
| | | },
|
| | | label: {
|
| | | type: String,
|
| | | default: ''
|
| | | },
|
| | | placeholder: {
|
| | | type: String,
|
| | | default: '请选择'
|
| | | },
|
| | | emptyTips: {
|
| | | type: String,
|
| | | default: '无选项'
|
| | | },
|
| | | clear: {
|
| | | type: Boolean,
|
| | | default: true
|
| | | },
|
| | | defItem: {
|
| | | type: Number,
|
| | | default: 0
|
| | | },
|
| | | disabled: {
|
| | | type: Boolean,
|
| | | default: false
|
| | | },
|
| | | // 格式化输出 用法 field="_id as value, version as text, uni_platform as label" format="{label} - {text}"
|
| | | format: {
|
| | | type: String,
|
| | | default: ''
|
| | | },
|
| | | placement: {
|
| | | type: String,
|
| | | default: 'bottom'
|
| | | }
|
| | | },
|
| | | data() {
|
| | | return {
|
| | | showSelector: false,
|
| | | current: '',
|
| | | mixinDatacomResData: [],
|
| | | apps: [],
|
| | | channels: [],
|
| | | cacheKey: "uni-data-select-lastSelectedValue",
|
| | | };
|
| | | },
|
| | | created() {
|
| | | this.debounceGet = this.debounce(() => {
|
| | | this.query();
|
| | | }, 300);
|
| | | if (this.collection && !this.localdata.length) {
|
| | | this.debounceGet();
|
| | | }
|
| | | },
|
| | | computed: {
|
| | | typePlaceholder() {
|
| | | const text = {
|
| | | 'opendb-stat-app-versions': '版本',
|
| | | 'opendb-app-channels': '渠道',
|
| | | 'opendb-app-list': '应用'
|
| | | }
|
| | | const common = this.placeholder
|
| | | const placeholder = text[this.collection]
|
| | | return placeholder ?
|
| | | common + placeholder :
|
| | | common
|
| | | },
|
| | | valueCom() {
|
| | | // #ifdef VUE3
|
| | | return this.modelValue;
|
| | | // #endif
|
| | | // #ifndef VUE3
|
| | | return this.value;
|
| | | // #endif
|
| | | },
|
| | | textShow() {
|
| | | // 长文本显示
|
| | | let text = this.current;
|
| | | if (text.length > 10) {
|
| | | return text.slice(0, 25) + '...';
|
| | | }
|
| | | return text;
|
| | | },
|
| | | getOffsetByPlacement() {
|
| | | switch (this.placement) {
|
| | | case 'top':
|
| | | return "bottom:calc(100% + 12px);";
|
| | | case 'bottom':
|
| | | return "top:calc(100% + 12px);";
|
| | | }
|
| | | }
|
| | | },
|
| | |
|
| | | watch: {
|
| | | localdata: {
|
| | | immediate: true,
|
| | | handler(val, old) {
|
| | | if (Array.isArray(val) && old !== val) {
|
| | | this.mixinDatacomResData = val
|
| | | }
|
| | | }
|
| | | },
|
| | | valueCom(val, old) {
|
| | | this.initDefVal()
|
| | | },
|
| | | mixinDatacomResData: {
|
| | | immediate: true,
|
| | | handler(val) {
|
| | | if (val.length) {
|
| | | this.initDefVal()
|
| | | }
|
| | | }
|
| | | },
|
| | |
|
| | | },
|
| | | methods: {
|
| | | debounce(fn, time = 100) {
|
| | | let timer = null
|
| | | return function(...args) {
|
| | | if (timer) clearTimeout(timer)
|
| | | timer = setTimeout(() => {
|
| | | fn.apply(this, args)
|
| | | }, time)
|
| | | }
|
| | | },
|
| | | // 执行数据库查询
|
| | | query() {
|
| | | this.mixinDatacomEasyGet();
|
| | | },
|
| | | // 监听查询条件变更事件
|
| | | onMixinDatacomPropsChange() {
|
| | | if (this.collection) {
|
| | | this.debounceGet();
|
| | | }
|
| | | },
|
| | | initDefVal() {
|
| | | let defValue = ''
|
| | | if ((this.valueCom || this.valueCom === 0) && !this.isDisabled(this.valueCom)) {
|
| | | defValue = this.valueCom
|
| | | } else {
|
| | | let strogeValue
|
| | | if (this.collection) {
|
| | | strogeValue = this.getCache()
|
| | | }
|
| | | if (strogeValue || strogeValue === 0) {
|
| | | defValue = strogeValue
|
| | | } else {
|
| | | let defItem = ''
|
| | | if (this.defItem > 0 && this.defItem <= this.mixinDatacomResData.length) {
|
| | | defItem = this.mixinDatacomResData[this.defItem - 1].value
|
| | | }
|
| | | defValue = defItem
|
| | | }
|
| | | if (defValue || defValue === 0) {
|
| | | this.emit(defValue)
|
| | | }
|
| | | }
|
| | | const def = this.mixinDatacomResData.find(item => item.value === defValue)
|
| | | this.current = def ? this.formatItemName(def) : ''
|
| | | },
|
| | |
|
| | | /**
|
| | | * @param {[String, Number]} value
|
| | | * 判断用户给的 value 是否同时为禁用状态
|
| | | */
|
| | | isDisabled(value) {
|
| | | let isDisabled = false;
|
| | |
|
| | | this.mixinDatacomResData.forEach(item => {
|
| | | if (item.value === value) {
|
| | | isDisabled = item.disable
|
| | | }
|
| | | })
|
| | |
|
| | | return isDisabled;
|
| | | },
|
| | |
|
| | | clearVal() {
|
| | | this.emit('')
|
| | | if (this.collection) {
|
| | | this.removeCache()
|
| | | }
|
| | | },
|
| | | change(item) {
|
| | | if (!item.disable) {
|
| | | this.showSelector = false
|
| | | this.current = this.formatItemName(item)
|
| | | this.emit(item.value)
|
| | | }
|
| | | },
|
| | | emit(val) {
|
| | | this.$emit('input', val)
|
| | | this.$emit('update:modelValue', val)
|
| | | this.$emit('change', val)
|
| | | if (this.collection) {
|
| | | this.setCache(val);
|
| | | }
|
| | | },
|
| | | toggleSelector() {
|
| | | if (this.disabled) {
|
| | | return
|
| | | }
|
| | |
|
| | | this.showSelector = !this.showSelector
|
| | | },
|
| | | formatItemName(item) {
|
| | | let {
|
| | | text,
|
| | | value,
|
| | | channel_code
|
| | | } = item
|
| | | channel_code = channel_code ? `(${channel_code})` : ''
|
| | |
|
| | | if (this.format) {
|
| | | // 格式化输出
|
| | | let str = "";
|
| | | str = this.format;
|
| | | for (let key in item) {
|
| | | str = str.replace(new RegExp(`{${key}}`, "g"), item[key]);
|
| | | }
|
| | | return str;
|
| | | } else {
|
| | | return this.collection.indexOf('app-list') > 0 ?
|
| | | `${text}(${value})` :
|
| | | (
|
| | | text ?
|
| | | text :
|
| | | `未命名${channel_code}`
|
| | | )
|
| | | }
|
| | | },
|
| | | // 获取当前加载的数据
|
| | | getLoadData() {
|
| | | return this.mixinDatacomResData;
|
| | | },
|
| | | // 获取当前缓存key
|
| | | getCurrentCacheKey() {
|
| | | return this.collection;
|
| | | },
|
| | | // 获取缓存
|
| | | getCache(name = this.getCurrentCacheKey()) {
|
| | | let cacheData = uni.getStorageSync(this.cacheKey) || {};
|
| | | return cacheData[name];
|
| | | },
|
| | | // 设置缓存
|
| | | setCache(value, name = this.getCurrentCacheKey()) {
|
| | | let cacheData = uni.getStorageSync(this.cacheKey) || {};
|
| | | cacheData[name] = value;
|
| | | uni.setStorageSync(this.cacheKey, cacheData);
|
| | | },
|
| | | // 删除缓存
|
| | | removeCache(name = this.getCurrentCacheKey()) {
|
| | | let cacheData = uni.getStorageSync(this.cacheKey) || {};
|
| | | delete cacheData[name];
|
| | | uni.setStorageSync(this.cacheKey, cacheData);
|
| | | },
|
| | | }
|
| | | }
|
| | | </script>
|
| | |
|
| | | <style lang="scss">
|
| | | $uni-base-color: #6a6a6a !default;
|
| | | $uni-main-color: #333 !default;
|
| | | $uni-secondary-color: #909399 !default;
|
| | | $uni-border-3: #e5e5e5;
|
| | |
|
| | | /* #ifndef APP-NVUE */
|
| | | @media screen and (max-width: 500px) {
|
| | | .hide-on-phone {
|
| | | display: none;
|
| | | }
|
| | | }
|
| | |
|
| | | /* #endif */
|
| | | .uni-stat__select {
|
| | | display: flex;
|
| | | align-items: center;
|
| | | // padding: 15px;
|
| | | /* #ifdef H5 */
|
| | | cursor: pointer;
|
| | | /* #endif */
|
| | | width: 100%;
|
| | | flex: 1;
|
| | | box-sizing: border-box;
|
| | | }
|
| | |
|
| | | .uni-stat-box {
|
| | | width: 100%;
|
| | | flex: 1;
|
| | | }
|
| | |
|
| | | .uni-stat__actived {
|
| | | width: 100%;
|
| | | flex: 1;
|
| | | // outline: 1px solid #2979ff;
|
| | | }
|
| | |
|
| | | .uni-label-text {
|
| | | font-size: 14px;
|
| | | font-weight: bold;
|
| | | color: $uni-base-color;
|
| | | margin: auto 0;
|
| | | margin-right: 5px;
|
| | | }
|
| | |
|
| | | .uni-select {
|
| | | font-size: 14px;
|
| | | border: 1px solid $uni-border-3;
|
| | | box-sizing: border-box;
|
| | | border-radius: 4px;
|
| | | padding: 0 5px;
|
| | | padding-left: 10px;
|
| | | position: relative;
|
| | | /* #ifndef APP-NVUE */
|
| | | display: flex;
|
| | | user-select: none;
|
| | | /* #endif */
|
| | | flex-direction: row;
|
| | | align-items: center;
|
| | | border-bottom: solid 1px $uni-border-3;
|
| | | width: 100%;
|
| | | flex: 1;
|
| | | height: 35px;
|
| | |
|
| | | &--disabled {
|
| | | background-color: #f5f7fa;
|
| | | cursor: not-allowed;
|
| | | }
|
| | | }
|
| | |
|
| | | .uni-select__label {
|
| | | font-size: 16px;
|
| | | // line-height: 22px;
|
| | | height: 35px;
|
| | | padding-right: 10px;
|
| | | color: $uni-secondary-color;
|
| | | }
|
| | |
|
| | | .uni-select__input-box {
|
| | | height: 35px;
|
| | | position: relative;
|
| | | /* #ifndef APP-NVUE */
|
| | | display: flex;
|
| | | /* #endif */
|
| | | flex: 1;
|
| | | flex-direction: row;
|
| | | align-items: center;
|
| | | }
|
| | |
|
| | | .uni-select__input {
|
| | | flex: 1;
|
| | | font-size: 14px;
|
| | | height: 22px;
|
| | | line-height: 22px;
|
| | | }
|
| | |
|
| | | .uni-select__input-plac {
|
| | | font-size: 14px;
|
| | | color: $uni-secondary-color;
|
| | | }
|
| | |
|
| | | .uni-select__selector {
|
| | | /* #ifndef APP-NVUE */
|
| | | box-sizing: border-box;
|
| | | /* #endif */
|
| | | position: absolute;
|
| | | left: 0;
|
| | | width: 100%;
|
| | | background-color: #FFFFFF;
|
| | | border: 1px solid #EBEEF5;
|
| | | border-radius: 6px;
|
| | | box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
| | | z-index: 3;
|
| | | padding: 4px 0;
|
| | | }
|
| | |
|
| | | .uni-select__selector-scroll {
|
| | | /* #ifndef APP-NVUE */
|
| | | max-height: 200px;
|
| | | box-sizing: border-box;
|
| | | /* #endif */
|
| | | }
|
| | |
|
| | | /* #ifdef H5 */
|
| | | @media (min-width: 768px) {
|
| | | .uni-select__selector-scroll {
|
| | | max-height: 600px;
|
| | | }
|
| | | }
|
| | |
|
| | | /* #endif */
|
| | |
|
| | | .uni-select__selector-empty,
|
| | | .uni-select__selector-item {
|
| | | /* #ifndef APP-NVUE */
|
| | | display: flex;
|
| | | cursor: pointer;
|
| | | /* #endif */
|
| | | line-height: 35px;
|
| | | font-size: 14px;
|
| | | text-align: center;
|
| | | /* border-bottom: solid 1px $uni-border-3; */
|
| | | padding: 0px 10px;
|
| | | }
|
| | |
|
| | | .uni-select__selector-item:hover {
|
| | | background-color: #f9f9f9;
|
| | | }
|
| | |
|
| | | .uni-select__selector-empty:last-child,
|
| | | .uni-select__selector-item:last-child {
|
| | | /* #ifndef APP-NVUE */
|
| | | border-bottom: none;
|
| | | /* #endif */
|
| | | }
|
| | |
|
| | | .uni-select__selector__disabled {
|
| | | opacity: 0.4;
|
| | | cursor: default;
|
| | | }
|
| | |
|
| | | /* picker 弹出层通用的指示小三角 */
|
| | | .uni-popper__arrow_bottom,
|
| | | .uni-popper__arrow_bottom::after,
|
| | | .uni-popper__arrow_top,
|
| | | .uni-popper__arrow_top::after,
|
| | | {
|
| | | position: absolute;
|
| | | display: block;
|
| | | width: 0;
|
| | | height: 0;
|
| | | border-color: transparent;
|
| | | border-style: solid;
|
| | | border-width: 6px;
|
| | | }
|
| | |
|
| | | .uni-popper__arrow_bottom {
|
| | | filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03));
|
| | | top: -6px;
|
| | | left: 10%;
|
| | | margin-right: 3px;
|
| | | border-top-width: 0;
|
| | | border-bottom-color: #EBEEF5;
|
| | | }
|
| | |
|
| | | .uni-popper__arrow_bottom::after {
|
| | | content: " ";
|
| | | top: 1px;
|
| | | margin-left: -6px;
|
| | | border-top-width: 0;
|
| | | border-bottom-color: #fff;
|
| | | }
|
| | |
|
| | | .uni-popper__arrow_top {
|
| | | filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.03));
|
| | | bottom: -6px;
|
| | | left: 10%;
|
| | | margin-right: 3px;
|
| | | border-bottom-width: 0;
|
| | | border-top-color: #EBEEF5;
|
| | | }
|
| | |
|
| | | .uni-popper__arrow_top::after {
|
| | | content: " ";
|
| | | bottom: 1px;
|
| | | margin-left: -6px;
|
| | | border-bottom-width: 0;
|
| | | border-top-color: #fff;
|
| | | }
|
| | |
|
| | |
|
| | | .uni-select__input-text {
|
| | | // width: 280px;
|
| | | width: 100%;
|
| | | color: $uni-main-color;
|
| | | white-space: nowrap;
|
| | | text-overflow: ellipsis;
|
| | | -o-text-overflow: ellipsis;
|
| | | overflow: hidden;
|
| | | }
|
| | |
|
| | | .uni-select__input-placeholder {
|
| | | color: $uni-base-color;
|
| | | font-size: 12px;
|
| | | }
|
| | |
|
| | | .uni-select--mask {
|
| | | position: fixed;
|
| | | top: 0;
|
| | | bottom: 0;
|
| | | right: 0;
|
| | | left: 0;
|
| | | z-index: 2;
|
| | | }
|
| | | </style> |
New file |
| | |
| | | {
|
| | | "id": "uni-data-select",
|
| | | "displayName": "uni-data-select 下拉框选择器",
|
| | | "version": "1.0.8",
|
| | | "description": "通过数据驱动的下拉框选择器",
|
| | | "keywords": [
|
| | | "uni-ui",
|
| | | "select",
|
| | | "uni-data-select",
|
| | | "下拉框",
|
| | | "下拉选"
|
| | | ],
|
| | | "repository": "https://github.com/dcloudio/uni-ui",
|
| | | "engines": {
|
| | | "HBuilderX": "^3.1.1"
|
| | | },
|
| | | "directories": {
|
| | | "example": "../../temps/example_temps"
|
| | | },
|
| | | "dcloudext": {
|
| | | "sale": {
|
| | | "regular": {
|
| | | "price": "0.00"
|
| | | },
|
| | | "sourcecode": {
|
| | | "price": "0.00"
|
| | | }
|
| | | },
|
| | | "contact": {
|
| | | "qq": ""
|
| | | },
|
| | | "declaration": {
|
| | | "ads": "无",
|
| | | "data": "无",
|
| | | "permissions": "无"
|
| | | },
|
| | | "npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui",
|
| | | "type": "component-vue"
|
| | | },
|
| | | "uni_modules": {
|
| | | "dependencies": ["uni-load-more"],
|
| | | "encrypt": [],
|
| | | "platforms": {
|
| | | "cloud": {
|
| | | "tcb": "y",
|
| | | "aliyun": "y",
|
| | | "alipay": "n"
|
| | | },
|
| | | "client": {
|
| | | "App": {
|
| | | "app-vue": "u",
|
| | | "app-nvue": "n"
|
| | | },
|
| | | "H5-mobile": {
|
| | | "Safari": "y",
|
| | | "Android Browser": "y",
|
| | | "微信浏览器(Android)": "y",
|
| | | "QQ浏览器(Android)": "y"
|
| | | },
|
| | | "H5-pc": {
|
| | | "Chrome": "y",
|
| | | "IE": "y",
|
| | | "Edge": "y",
|
| | | "Firefox": "y",
|
| | | "Safari": "y"
|
| | | },
|
| | | "小程序": {
|
| | | "微信": "y",
|
| | | "阿里": "u",
|
| | | "百度": "u",
|
| | | "字节跳动": "u",
|
| | | "QQ": "u",
|
| | | "京东": "u"
|
| | | },
|
| | | "快应用": {
|
| | | "华为": "u",
|
| | | "联盟": "u"
|
| | | },
|
| | | "Vue": {
|
| | | "vue2": "y",
|
| | | "vue3": "y"
|
| | | }
|
| | | }
|
| | | }
|
| | | }
|
| | | }
|
New file |
| | |
| | | ## DataSelect 下拉框选择器 |
| | | > **组件名:uni-data-select** |
| | | > 代码块: `uDataSelect` |
| | | |
| | | 当选项过多时,使用下拉菜单展示并选择内容 |
| | | |
| | | ### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-data-select) |
| | | #### 如使用过程中有任何问题,或者您对uni-ui有一些好的建议,欢迎加入 uni-ui 交流群:871950839 |
| | |
| | | ## 1.3.6(2024-10-15) |
| | | - 修复 微信小程序中的getSystemInfo警告 |
| | | ## 1.3.5(2024-10-12) |
| | | - 修复 微信小程序中的getSystemInfo警告 |
| | | ## 1.3.4(2024-10-12) |
| | | - 修复 微信小程序中的getSystemInfo警告 |
| | | ## 1.3.3(2022-01-20)
|
| | | - 新增 showText属性 ,是否显示文本
|
| | | ## 1.3.2(2022-01-19)
|
| | |
| | | <script>
|
| | | let platform
|
| | | setTimeout(() => {
|
| | | // #ifdef MP-WEIXIN |
| | | platform = uni.getDeviceInfo().platform |
| | | // #endif |
| | | // #ifndef MP-WEIXIN |
| | | platform = uni.getSystemInfoSync().platform
|
| | | // #endif
|
| | | }, 16)
|
| | |
|
| | | import {
|
| | |
| | | {
|
| | | "id": "uni-load-more",
|
| | | "displayName": "uni-load-more 加载更多",
|
| | | "version": "1.3.3",
|
| | | "version": "1.3.6", |
| | | "description": "LoadMore 组件,常用在列表里面,做滚动加载使用。",
|
| | | "keywords": [
|
| | | "uni-ui",
|
| | |
| | | "example": "../../temps/example_temps"
|
| | | },
|
| | | "dcloudext": {
|
| | | "category": [
|
| | | "前端组件",
|
| | | "通用组件"
|
| | | ],
|
| | | "sale": {
|
| | | "regular": {
|
| | | "price": "0.00"
|
| | |
| | | "data": "无",
|
| | | "permissions": "无"
|
| | | },
|
| | | "npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
|
| | | "npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui", |
| | | "type": "component-vue" |
| | | },
|
| | | "uni_modules": {
|
| | | "dependencies": ["uni-scss"],
|
| | |
| | | "platforms": {
|
| | | "cloud": {
|
| | | "tcb": "y",
|
| | | "aliyun": "y"
|
| | | "aliyun": "y", |
| | | "alipay": "n" |
| | | },
|
| | | "client": {
|
| | | "App": {
|