1. icon图标增加

2. slider组件增加
3. 商城分类修复
4. tabs优化
5. 请求修复
6. 样式类定义
parent 8a2f859e
......@@ -14,6 +14,12 @@
data() {
return {
iconList: [
{
name: 'chat'
},
{
name: 'chat-fill'
},
{
name: 'red-packet'
},
......
......@@ -36,11 +36,11 @@
</view>
<view class="u-config-item">
<view class="u-item-title">步进值</view>
<u-subsection vibrateShort :list="['1', '10', '30']" @change="stepChange"></u-subsection>
<u-subsection vibrateShort :list="['1', '10', '20']" @change="stepChange"></u-subsection>
</view>
<view class="u-config-item">
<view class="u-item-title">最大最小值</view>
<u-subsection vibrateShort :list="['0-100', '30-80']" @change="minMaxchange"></u-subsection>
<u-subsection vibrateShort :list="['0-100', '40-80']" @change="minMaxchange"></u-subsection>
</view>
</view>
</view>
......@@ -84,7 +84,7 @@
}
},
stepChange(index) {
let arr = ['1', '10', '30'];
let arr = ['1', '10', '20'];
this.step = arr[index];
},
slotChange(index) {
......@@ -95,7 +95,7 @@
this.min = 0;
this.max = 100;
} else {
this.min = 30;
this.min = 40;
this.max = 80;
}
}
......
......@@ -64,9 +64,7 @@
}
},
onLoad() {
setTimeout(() => {
this.list = [];
}, 3000)
},
methods: {
typeChange(index) {
......
<template>
<view>
<u-modal v-model="show" :title-style="{color: 'red'}">
<view class="slot-content">
<rich-text :nodes="content"></rich-text>
<view style="margin: 20px 0px 20px 0px;">
<scroll-view scroll-x enable-flex class="scroll">
<view v-for="i in 4" :key="i" class="slider">
<view class="slider-view-1">
<view class="slider-view-1-1">推广奖励</view>
<view class="slider-view-1-2">
<u-count-to color="#fff" font-size="80" :end-val="500"></u-count-to>
</view>
</view>
<view class="slider-view-2">
下次是手动阿萨德撒的撒的
下次是手动阿萨德撒的撒的
下次是手动阿萨德撒的撒的
下次是手动阿萨德撒的撒的
下次是手动阿萨德撒的撒的
下次是手动阿萨德撒的撒的
下次是手动阿萨德撒的撒的
下次是手动阿萨德撒的撒的
下次是手动阿萨德撒的撒的
下次是手动阿萨德撒的撒的
</view>
</view>
</scroll-view>
<view class="content">
<text class="content-title" >推广奖励怎么计算?</text>
<view class="content-view">
<view>
<u-button type="error"
size="medium"
@tap="to('/pages/center/agent/agentplus')">
进入代理管理后台
</u-button>
<u-button :ripple="true" @tap="to('/pages/center/agent/agentlist')" type="error" size="medium">查看详细奖励记录</u-button>
</view>
</view>
</view>
</u-modal>
<u-button @click="open">
打开模态框
</u-button>
</view>
</view>
</template>
<script>
export default {
data() {
data() {
return {
show: false,
content: `
空山新雨后<br>
天气晚来秋
`
customStyle:{
}
}
},
methods: {
open() {
this.show = true;
to(e){
uni.navigateTo({
url: e
});
}
}
}
</script>
<style lang="scss" scoped>
.slot-content {
font-size: 28rpx;
color: $u-content-color;
padding-left: 30rpx;
}
</style>
\ No newline at end of file
<style scoped>
/deep/.uni-scroll-view::-webkit-scrollbar {
display: none
}
.scroll{
white-space: nowrap;
width: 100%;
overflow: hidden;
display: flex;
}
.slider{
display: inline-block;
width: 200px;
height: 230px;
background-color: red;
background-color: #fff;
margin: 0 20px 0 20px;
box-shadow:15px 0 15px -15px #606266,
-15px 0 15px -15px #606266;
}
.slider-view-1{
height: 70%;
background-color: #007AFF;
position: relative;
display: flex;
padding: 5px;
}
.slider-view-2{
height: 30%;
background-color: #fff;
white-space:normal;
overflow-y: auto;
padding: 5px;
font-size: 12px;
color: #909399;
}
.slider-view-1-1{
color:#fff;
font-size: 14px;
}
.slider-view-1-2{
color:#fff;
font-size: 14px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
.content{
margin: 20px 5px 20px 5px;
padding: 10px;
background: #fff;
}
.content-title{
font-size: 16px;
color: #007AFF;
font-weight: bold;
}
.content-view{
margin: 10px;
display: flex;
border-bottom: 1px solid #c8c9cc;
padding-bottom: 10px;
font-size: 14px;
}
</style>
......@@ -38,6 +38,7 @@
data() {
return {
scrollTop: 0, //tab标题的滚动条位置
oldScrollTop: 0,
current: 0, // 预设当前项的值
menuHeight: 0, // 左边菜单的高度
menuItemHeight: 0, // 左边菜单item的高度
......@@ -47,10 +48,14 @@
arr: [],
scrollRightTop: 0, // 右边栏目scroll-view的滚动条高度
timer: null, // 定时器
}
},
onLoad() {
},
onReady() {
this.getMenuItemTop()
},
methods: {
// 点击左边的栏目切换
......@@ -59,9 +64,12 @@
await this.getMenuItemTop();
}
if (index == this.current) return;
this.scrollRightTop = this.arr[index];
this.current = index;
this.leftMenuStatus(index);
this.scrollRightTop = this.oldScrollTop;
this.$nextTick(function(){
this.scrollRightTop = this.arr[index];
this.current = index;
this.leftMenuStatus(index);
})
},
// 获取一个目标元素的高度
getElRect(elClass, dataVal) {
......@@ -131,7 +139,7 @@
},
// 右边菜单滚动
async rightScroll(e) {
this.scrollRightTop = e.detail.scrollTop;
this.oldScrollTop = e.detail.scrollTop;
if(this.arr.length == 0) {
await this.getMenuItemTop();
}
......
......@@ -4,3 +4,6 @@
* uView自定义的css类名和scss变量,均以"u-"开头,不会造成冲突,请放心使用
*/
@import '@/uview/index.scss';
$u-type-success: black;
\ No newline at end of file
......@@ -33,10 +33,10 @@
* @property {Number | String} min 最小值(默认0)
* @property {Number | String} max 最大值(默认100)
* @property {Number | String} step 步长(默认1)
* @property {Number | String} blockWidth 滑块宽度,高等于宽(20)
* @property {Number | String} blockWidth 滑块宽度,高等于宽(30)
* @property {Number | String} height 滑块条高度,单位rpx(默认6)
* @property {String} inactiveColor 底部条背景颜色(默认#c0c4cc)
* @property {String} activeColor 底部选择部分颜色(默认#2979ff)
* @property {String} activeColor 底部选择部分的背景颜色(默认#2979ff)
* @property {String} blockColor 滑块颜色(默认#ffffff)
* @property {Object} blockStyle 给滑块自定义样式,对象形式
* @property {Boolean} disabled 是否禁用滑块(默认为false)
......@@ -62,7 +62,7 @@ export default {
// 滑块宽度,高等于宽,单位rpx
blockWidth: {
type: [Number, String],
default: 20
default: 30
},
// 最小值
min: {
......
......@@ -189,6 +189,7 @@
'font-size': this.fontSize + 'rpx',
'transition-duration': `${this.duration}s`,
padding: this.isScroll ? `0 ${this.gutter}rpx` : '',
flex: this.isScroll ? 'auto' : '1'
};
// 字体加粗
if (index == this.currentIndex && this.bold) style.fontWeight = 'bold';
......
/* 颜色定义文件 */
@import './libs/css/color.scss';
// 基础css定义文件
@import './libs/css/common.scss';
page {
color: $u-main-color;
......
// 此版本发布于2020-04-25
let version = '1.1.1';
// 此版本发布于2020-04-27
let version = '1.1.2';
export default {
v: version,
......
......@@ -180,4 +180,8 @@ $u-type-info-light: #f4f4f5;
.u-tips-color {
color: $u-tips-color;
}
\ No newline at end of file
}
.u-light-color {
color: $u-light-color;
}
.u-flex {
display: flex;
flex-wrap: wrap;
flex-direction: row;
align-items: center;
}
.u-flex-wrap {
flex-wrap: wrap;
}
.u-flex-nowrap {
flex-wrap: nowrap;
}
.u-align-center {
align-items: center;
}
.u-align-top {
align-items: flex-start;
}
.u-align-bottom {
align-items: flex-end;
}
.u-align-left {
justify-content: flex-start;
}
.u-align-right {
justify-content: flex-end;
}
.u-align-between {
justify-content: space-between;
}
.u-align-around {
justify-content: space-around;
}
.u-text-left {
text-align: left;
}
.u-text-center {
text-align: center;
}
.u-text-right {
text-align: right;
}
.u-flex-col {
display: flex;
flex-direction: column;
}
// 定义flex等分
@for $i from 1 through 12 {
.u-flex-#{$i} {
flex: $i;
}
}
// 定义字体(px)单位,小于20都为px单位字体
@for $i from 9 to 20 {
.u-font-#{$i} {
font-size: $i + px;
}
}
// 定义字体(rpx)单位,大于或等于20的都为rpx单位字体
@for $i from 20 through 40 {
.u-font-#{$i} {
font-size: $i + rpx;
}
}
// 定义外边距
@for $i from 1 through 80 {
@if $i % 2 == 0 or $i % 5 == 0 {
@each $dirction in left, top, right, botttom {
// 定义外边距
.u-margin-#{$dirction}-#{$i} {
margin: $i + rpx;
}
// 定义内边距
.u-padding-#{$dirction}-#{$i} {
padding: $i + rpx;
}
}
}
}
......@@ -38,13 +38,6 @@ class Request {
// 主要请求部分
async request(options = {}) {
options.dataType = options.dataType || this.config.dataType;
options.responseType = options.responseType || this.config.responseType;
options.url = options.url || '';
options.params = options.params || {};
options.header = options.header || this.config.header;
options.method = options.method || this.config.method;
// 检查请求拦截
if (this.interceptor.request && typeof this.interceptor.request === 'function') {
let tmpConfig = {};
......@@ -54,6 +47,13 @@ class Request {
}
this.options = interceptorReuest;
}
options.dataType = options.dataType || this.config.dataType;
options.responseType = options.responseType || this.config.responseType;
options.url = options.url || '';
options.params = options.params || {};
options.header = Object.assign(this.config.header, options.header);
options.method = options.method || this.config.method;
return new Promise((resolve, reject) => {
options.complete = (response) => {
......@@ -123,41 +123,41 @@ class Request {
constructor() {
// get请求
this.get = (url, data, options = {}) => {
this.get = (url, data = {}, header = {}) => {
return this.request({
method: 'GET',
url,
...options,
header,
data
})
}
// post请求
this.post = (url, data, options = {}) => {
this.post = (url, data = {}, header = {}) => {
return this.request({
url,
method: 'POST',
...options,
header,
data
})
}
// put请求,不支持支付宝小程序(HX2.6.15)
this.put = (url, data, options = {}) => {
this.put = (url, data = {}, header = {}) => {
return this.request({
url,
method: 'PUT',
...options,
header,
data
})
}
// delete请求,不支持支付宝和头条小程序(HX2.6.15)
this.delete = (url, data, options = {}) => {
this.delete = (url, data = {}, header = {}) => {
return this.request({
url,
method: 'DELETE',
...options,
header,
data
})
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment