1. icon图标增加

2. slider组件增加
3. 商城分类修复
4. tabs优化
5. 请求修复
6. 样式类定义
parent 8a2f859e
...@@ -14,6 +14,12 @@ ...@@ -14,6 +14,12 @@
data() { data() {
return { return {
iconList: [ iconList: [
{
name: 'chat'
},
{
name: 'chat-fill'
},
{ {
name: 'red-packet' name: 'red-packet'
}, },
......
...@@ -36,11 +36,11 @@ ...@@ -36,11 +36,11 @@
</view> </view>
<view class="u-config-item"> <view class="u-config-item">
<view class="u-item-title">步进值</view> <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>
<view class="u-config-item"> <view class="u-config-item">
<view class="u-item-title">最大最小值</view> <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> </view>
</view> </view>
...@@ -84,7 +84,7 @@ ...@@ -84,7 +84,7 @@
} }
}, },
stepChange(index) { stepChange(index) {
let arr = ['1', '10', '30']; let arr = ['1', '10', '20'];
this.step = arr[index]; this.step = arr[index];
}, },
slotChange(index) { slotChange(index) {
...@@ -95,7 +95,7 @@ ...@@ -95,7 +95,7 @@
this.min = 0; this.min = 0;
this.max = 100; this.max = 100;
} else { } else {
this.min = 30; this.min = 40;
this.max = 80; this.max = 80;
} }
} }
......
...@@ -64,9 +64,7 @@ ...@@ -64,9 +64,7 @@
} }
}, },
onLoad() { onLoad() {
setTimeout(() => {
this.list = [];
}, 3000)
}, },
methods: { methods: {
typeChange(index) { typeChange(index) {
......
<template> <template>
<view> <view>
<u-modal v-model="show" :title-style="{color: 'red'}"> <view style="margin: 20px 0px 20px 0px;">
<view class="slot-content"> <scroll-view scroll-x enable-flex class="scroll">
<rich-text :nodes="content"></rich-text> <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>
</u-modal> </view>
<u-button @click="open"> <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>
<u-button :ripple="true" @tap="to('/pages/center/agent/agentlist')" type="error" size="medium">查看详细奖励记录</u-button>
</view>
</view>
</view>
</view>
</view> </view>
</template> </template>
...@@ -15,24 +54,88 @@ ...@@ -15,24 +54,88 @@
export default { export default {
data() { data() {
return { return {
show: false, customStyle:{
content: `
空山新雨后<br> }
天气晚来秋
`
} }
}, },
methods: { methods: {
open() { to(e){
this.show = true; uni.navigateTo({
url: e
});
} }
} }
} }
</script> </script>
<style lang="scss" scoped>
.slot-content { <style scoped>
font-size: 28rpx; /deep/.uni-scroll-view::-webkit-scrollbar {
color: $u-content-color; display: none
padding-left: 30rpx; }
} .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> </style>
...@@ -38,6 +38,7 @@ ...@@ -38,6 +38,7 @@
data() { data() {
return { return {
scrollTop: 0, //tab标题的滚动条位置 scrollTop: 0, //tab标题的滚动条位置
oldScrollTop: 0,
current: 0, // 预设当前项的值 current: 0, // 预设当前项的值
menuHeight: 0, // 左边菜单的高度 menuHeight: 0, // 左边菜单的高度
menuItemHeight: 0, // 左边菜单item的高度 menuItemHeight: 0, // 左边菜单item的高度
...@@ -47,10 +48,14 @@ ...@@ -47,10 +48,14 @@
arr: [], arr: [],
scrollRightTop: 0, // 右边栏目scroll-view的滚动条高度 scrollRightTop: 0, // 右边栏目scroll-view的滚动条高度
timer: null, // 定时器 timer: null, // 定时器
} }
}, },
onLoad() { onLoad() {
},
onReady() {
this.getMenuItemTop()
}, },
methods: { methods: {
// 点击左边的栏目切换 // 点击左边的栏目切换
...@@ -59,9 +64,12 @@ ...@@ -59,9 +64,12 @@
await this.getMenuItemTop(); await this.getMenuItemTop();
} }
if (index == this.current) return; if (index == this.current) return;
this.scrollRightTop = this.oldScrollTop;
this.$nextTick(function(){
this.scrollRightTop = this.arr[index]; this.scrollRightTop = this.arr[index];
this.current = index; this.current = index;
this.leftMenuStatus(index); this.leftMenuStatus(index);
})
}, },
// 获取一个目标元素的高度 // 获取一个目标元素的高度
getElRect(elClass, dataVal) { getElRect(elClass, dataVal) {
...@@ -131,7 +139,7 @@ ...@@ -131,7 +139,7 @@
}, },
// 右边菜单滚动 // 右边菜单滚动
async rightScroll(e) { async rightScroll(e) {
this.scrollRightTop = e.detail.scrollTop; this.oldScrollTop = e.detail.scrollTop;
if(this.arr.length == 0) { if(this.arr.length == 0) {
await this.getMenuItemTop(); await this.getMenuItemTop();
} }
......
...@@ -4,3 +4,6 @@ ...@@ -4,3 +4,6 @@
* uView自定义的css类名和scss变量,均以"u-"开头,不会造成冲突,请放心使用 * uView自定义的css类名和scss变量,均以"u-"开头,不会造成冲突,请放心使用
*/ */
@import '@/uview/index.scss'; @import '@/uview/index.scss';
$u-type-success: black;
\ No newline at end of file
...@@ -33,10 +33,10 @@ ...@@ -33,10 +33,10 @@
* @property {Number | String} min 最小值(默认0) * @property {Number | String} min 最小值(默认0)
* @property {Number | String} max 最大值(默认100) * @property {Number | String} max 最大值(默认100)
* @property {Number | String} step 步长(默认1) * @property {Number | String} step 步长(默认1)
* @property {Number | String} blockWidth 滑块宽度,高等于宽(20) * @property {Number | String} blockWidth 滑块宽度,高等于宽(30)
* @property {Number | String} height 滑块条高度,单位rpx(默认6) * @property {Number | String} height 滑块条高度,单位rpx(默认6)
* @property {String} inactiveColor 底部条背景颜色(默认#c0c4cc) * @property {String} inactiveColor 底部条背景颜色(默认#c0c4cc)
* @property {String} activeColor 底部选择部分颜色(默认#2979ff) * @property {String} activeColor 底部选择部分的背景颜色(默认#2979ff)
* @property {String} blockColor 滑块颜色(默认#ffffff) * @property {String} blockColor 滑块颜色(默认#ffffff)
* @property {Object} blockStyle 给滑块自定义样式,对象形式 * @property {Object} blockStyle 给滑块自定义样式,对象形式
* @property {Boolean} disabled 是否禁用滑块(默认为false) * @property {Boolean} disabled 是否禁用滑块(默认为false)
...@@ -62,7 +62,7 @@ export default { ...@@ -62,7 +62,7 @@ export default {
// 滑块宽度,高等于宽,单位rpx // 滑块宽度,高等于宽,单位rpx
blockWidth: { blockWidth: {
type: [Number, String], type: [Number, String],
default: 20 default: 30
}, },
// 最小值 // 最小值
min: { min: {
......
...@@ -189,6 +189,7 @@ ...@@ -189,6 +189,7 @@
'font-size': this.fontSize + 'rpx', 'font-size': this.fontSize + 'rpx',
'transition-duration': `${this.duration}s`, 'transition-duration': `${this.duration}s`,
padding: this.isScroll ? `0 ${this.gutter}rpx` : '', padding: this.isScroll ? `0 ${this.gutter}rpx` : '',
flex: this.isScroll ? 'auto' : '1'
}; };
// 字体加粗 // 字体加粗
if (index == this.currentIndex && this.bold) style.fontWeight = 'bold'; if (index == this.currentIndex && this.bold) style.fontWeight = 'bold';
......
/* 颜色定义文件 */ /* 颜色定义文件 */
@import './libs/css/color.scss'; @import './libs/css/color.scss';
// 基础css定义文件
@import './libs/css/common.scss';
page { page {
color: $u-main-color; color: $u-main-color;
......
// 此版本发布于2020-04-25 // 此版本发布于2020-04-27
let version = '1.1.1'; let version = '1.1.2';
export default { export default {
v: version, v: version,
......
...@@ -181,3 +181,7 @@ $u-type-info-light: #f4f4f5; ...@@ -181,3 +181,7 @@ $u-type-info-light: #f4f4f5;
.u-tips-color { .u-tips-color {
color: $u-tips-color; color: $u-tips-color;
} }
.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 { ...@@ -38,13 +38,6 @@ class Request {
// 主要请求部分 // 主要请求部分
async request(options = {}) { 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') { if (this.interceptor.request && typeof this.interceptor.request === 'function') {
let tmpConfig = {}; let tmpConfig = {};
...@@ -55,6 +48,13 @@ class Request { ...@@ -55,6 +48,13 @@ class Request {
this.options = interceptorReuest; 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) => { return new Promise((resolve, reject) => {
options.complete = (response) => { options.complete = (response) => {
// 请求返回后,隐藏loading(如果请求返回快的话,可能会没有loading) // 请求返回后,隐藏loading(如果请求返回快的话,可能会没有loading)
...@@ -123,41 +123,41 @@ class Request { ...@@ -123,41 +123,41 @@ class Request {
constructor() { constructor() {
// get请求 // get请求
this.get = (url, data, options = {}) => { this.get = (url, data = {}, header = {}) => {
return this.request({ return this.request({
method: 'GET', method: 'GET',
url, url,
...options, header,
data data
}) })
} }
// post请求 // post请求
this.post = (url, data, options = {}) => { this.post = (url, data = {}, header = {}) => {
return this.request({ return this.request({
url, url,
method: 'POST', method: 'POST',
...options, header,
data data
}) })
} }
// put请求,不支持支付宝小程序(HX2.6.15) // put请求,不支持支付宝小程序(HX2.6.15)
this.put = (url, data, options = {}) => { this.put = (url, data = {}, header = {}) => {
return this.request({ return this.request({
url, url,
method: 'PUT', method: 'PUT',
...options, header,
data data
}) })
} }
// delete请求,不支持支付宝和头条小程序(HX2.6.15) // delete请求,不支持支付宝和头条小程序(HX2.6.15)
this.delete = (url, data, options = {}) => { this.delete = (url, data = {}, header = {}) => {
return this.request({ return this.request({
url, url,
method: 'DELETE', method: 'DELETE',
...options, header,
data 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