Skip to content

U
uview-ui
Commit 5270afd2 authored by wlxuqu's avatar wlxuqu
Browse files
Options

1. 【优化】配置popup组件的外层元素z-index可动态调整 

2. 【优化】select和picker组件在微信小程序上第二次打开，直接点确定返回可能不对的问题
3. 【优化】添加u-col的click事件
4. 【修复】修复image组件无需淡入效果时png图片能看到底色的问题
5. 【修复】修复checkbox的lable-disabled参数无效的问题
parent 2587cd14
Hide whitespace changes
Inline Side-by-side
Showing with 147 additions and 48 deletions
pages.json
View file @ 5270afd2
......@@ -6,7 +6,7 @@
// "current": 0, //当前激活的模式(list 的索引项)
// "list": [{
// "name": "test", //模式名称
// "path": "pages/componentsB/tabbar/index", //启动页面，必选
// "path": "pages/componentsA/select/index", //启动页面，必选
// "query": "id=1&name=2" //启动参数，在页面的onLoad函数里面得到
// }]
// },
......
pages/componentsB/picker/index.vue
View file @ 5270afd2
......@@ -116,7 +116,7 @@ export default {
this.show = true;
},
confirm(e) {
console.log(e);
// console.log(e);
this.input = '';
if (this.mode == 'time') {
if (this.params.year) this.input += e.year;
......
pages/componentsB/tabbar/index.vue
View file @ 5270afd2
......@@ -113,11 +113,11 @@
},
badgeChange(index) {
if (index == 1) {
this.config[0].count = 0;
this.config[4].count = 0;
this.list[0].count = 0;
this.list[4].count = 0;
} else {
this.config[0].count = 2;
this.config[4].count = 23;
this.list[0].count = 2;
this.list[4].count = 23;
}
},
minButtonChange(index) {
......
pages/componentsC/test/index.vue
View file @ 5270afd2
<template>
<view class="wrap">
<u-swiper :list="list"></u-swiper>
<view>
<u-select v-model="show" @confirm="confirm" :list="list"></u-select>
<u-button @click="show = true">打开</u-button>
</view>
</template>
<script>
export default {
data() {
return {
list: [{
image: 'https://cdn.uviewui.com/uview/swiper/1.jpg',
title: '昨夜星辰昨夜风，画楼西畔桂堂东'
},
{
image: 'https://cdn.uviewui.com/uview/swiper/2.jpg',
title: '身无彩凤双飞翼，心有灵犀一点通'
},
{
image: 'https://cdn.uviewui.com/uview/swiper/3.jpg',
title: '谁念西风独自凉，萧萧黄叶闭疏窗，沉思往事立残阳'
export default {
data() {
return {
show: false,
list: [
{
label: '测试',
value: 'b0da629fa36e32110ea86dbfc53db96a',
extra: {
ductId: 'b0da629fa36e32110ea86dbfc53db96a',
name: '测试',
type: 3,
imgUrl: '1594173070713.jpg',
effectiveDay: 4,
dateType: 'day',
isInlay: 1,
createTime: '2020-07-08 09:51:13',
printerNum: 3,
createBy: '1',
updateTime: '2020-07-08 09:51:13',
updateBy: null,
ductAccessoryInfoList: []
}
],
}
},
methods: {
},
{
label: 'PICC - 2类',
value: '1c0c70fafe74e840dc79f1bfe2833b2b',
extra: {
ductId: '1c0c70fafe74e840dc79f1bfe2833b2b',
name: 'PICC - 2类',
type: 3,
imgUrl: '1592987125427.jpeg',
effectiveDay: 7,
dateType: 'day',
isInlay: 1,
createTime: '2020-06-24 16:25:25',
printerNum: 1,
createBy: '1',
updateTime: '2020-07-09 12:01:02',
updateBy: null,
ductAccessoryInfoList: [
{
ductAccessoryId: 'aecdc0e314dcb346a5ec1838929c02e6',
name: '敷贴 - 2类',
type: 1,
imgUrl: '',
effectiveDay: 3,
createTime: '2020-06-24 16:26:01',
createBy: '1',
updateTime: '2020-07-09 12:02:25',
dateType: 'day',
updateBy: null,
ductId: '1c0c70fafe74e840dc79f1bfe2833b2b',
printerNum: 2
},
{
ductAccessoryId: 'cea78c669259529a6e66cd0d3b7ea357',
name: '敷贴 - 1类',
type: 1,
imgUrl: '1592987145754.jpeg',
effectiveDay: 7,
createTime: '2020-06-24 16:25:46',
createBy: '1',
updateTime: '2020-07-09 12:04:29',
dateType: 'day',
updateBy: null,
ductId: '1c0c70fafe74e840dc79f1bfe2833b2b',
printerNum: 2
}
]
}
},
{
label: 'PICC - 1类',
value: '903a262182003743bb3062fe7393ffbd',
extra: {
ductId: '903a262182003743bb3062fe7393ffbd',
name: 'PICC - 1类',
type: 3,
imgUrl: '1592987111641.jpeg',
effectiveDay: 56,
dateType: 'hour',
isInlay: 1,
createTime: '2020-06-24 16:25:12',
printerNum: 1,
createBy: '1',
updateTime: '2020-07-09 14:24:02',
updateBy: null,
ductAccessoryInfoList: []
}
}
]
};
},
methods: {
confirm(e) {
console.log(e);
}
}
</script>
\ No newline at end of file
};
</script>
uview-ui/components/u-checkbox/u-checkbox.vue
View file @ 5270afd2
......@@ -160,7 +160,7 @@
},
methods: {
onClickLabel() {
if (!this.isDisabled) {
if (!this.isLabelDisabled) {
this.setValue();
}
},
......
uview-ui/components/u-col/u-col.vue
View file @ 5270afd2
......@@ -7,7 +7,7 @@
flex: `0 0 ${100 / 12 * span}%`,
alignItems: uAlignItem,
justifyContent: uJustify
}">
}" @tap.stop.prevent="click">
<slot></slot>
</view>
</template>
......@@ -58,6 +58,11 @@
else return this.align;
}
},
methods: {
click() {
this.$emit('click');
}
}
}
</script>
......
uview-ui/components/u-field/u-field.vue
View file @ 5270afd2
......@@ -23,7 +23,7 @@
:type="type"
class="u-flex-1 u-field__input-wrap"
:value="value"
:password="password || type === 'password'"
:password="type === 'password' ? 'text' : type"
:placeholder="placeholder"
:placeholderStyle="placeholderStyle"
:disabled="disabled"
......
uview-ui/components/u-icon/u-icon.vue
View file @ 5270afd2
......@@ -26,6 +26,7 @@
* @property {String} label-pos label文字相对于图标的位置，只能right或bottom（默认right）
* @property {String} label-color label字体颜色（默认#606266）
* @property {Object} custom-style icon的样式，对象形式
* @property {String} custom-prefix 自定义字体图标库时，需要写上此值
* @property {String | Number} margin-left label在右侧时与图标的距离，单位rpx（默认6）
* @property {String | Number} margin-top label在下方时与图标的距离，单位rpx（默认6）
* @property {String | Number} margin-bottom label在上方时与图标的距离，单位rpx（默认6）
......@@ -160,6 +161,7 @@ export default {
imgStyle() {
let style = {};
style.width = this.$u.addUnit(this.size);
style.height = this.$u.addUnit(this.size);
return style;
}
},
......
uview-ui/components/u-image/u-image.vue
View file @ 5270afd2
......@@ -157,8 +157,9 @@ export default {
this.loading = false;
this.isError = false;
this.$emit('load');
// 如果不需要动画效果，就不执行下方代码
if(!this.fade) return ;
// 如果不需要动画效果，就不执行下方代码，同时移除加载时的背景颜色
// 否则无需fade效果时，png图片依然能看到下方的背景色
if(!this.fade) return this.removeBgColor();
// 原来opacity为1(不透明，是为了显示占位图)，改成0(透明，意味着该元素显示的是背景颜色，默认的灰色)，再改成1，是为了获得过渡效果
this.opacity = 0;
// 这里设置为0，是为了图片展示到背景全透明这个过程时间为0，延时之后延时之后重新设置为duration，是为了获得背景透明(灰色)
......@@ -169,12 +170,16 @@ export default {
this.durationTime = this.duration;
this.opacity = 1;
setTimeout(() => {
// 淡入动画过渡完成后，将背景设置为透明色，否则png图片会看到灰色的背景
this.backgroundStyle = {
backgroundColor: 'transparent'
};
this.removeBgColor();
}, this.durationTime)
}, 50)
},
// 移除图片的背景色
removeBgColor() {
// 淡入动画过渡完成后，将背景设置为透明色，否则png图片会看到灰色的背景
this.backgroundStyle = {
backgroundColor: 'transparent'
};
}
}
};
......
uview-ui/components/u-picker/u-picker.vue
View file @ 5270afd2
<template>
<u-popup :maskCloseAble="maskCloseAble" mode="bottom" :popup="false" v-model="value" length="auto" :safeAreaInsetBottom="safeAreaInsetBottom" @close="close" :z-index="uZIndex">
<view class="u-datetime-picker" @tap.stop>
<!-- 多加一个if判断，避免微信小程序第二次打开后，视图没有重新渲染，而导致数据混乱 -->
<view class="u-datetime-picker" @tap.stop v-if="value">
<view class="u-picker-header" @touchmove.stop.prevent="">
<view class="u-btn-picker u-btn-picker--tips" :style="{ color: cancelColor }" hover-class="u-opacity" :hover-stay-time="150" @tap="getResult('cancel')">取消</view>
<view class="u-picker__title">{{ title }}</view>
......@@ -562,7 +563,7 @@ export default {
},
// 获取时间戳
getTimestamp() {
let time = this.year + '-' + this.month + '-' + this.day + ' ' + this.day + ':' + this.minute + ':' + this.second;
let time = this.year + '-' + this.month + '-' + this.day + ' ' + this.hour + ':' + this.minute + ':' + this.second;
return new Date(time).getTime() / 1000;
}
}
......
uview-ui/components/u-popup/u-popup.vue
View file @ 5270afd2
<template>
<view v-if="visibleSync" :style="[customStyle]" :class="{ 'u-drawer-visible': showDrawer }" class="u-drawer">
<view v-if="visibleSync" :style="[customStyle, {
zIndex: uZindex - 1
}]" :class="{ 'u-drawer-visible': showDrawer }" class="u-drawer">
<u-mask :maskClickAble="maskCloseAble" :show="showDrawer && mask" @click="maskClick"></u-mask>
<view
class="u-drawer-content"
......@@ -207,7 +209,7 @@ export default {
transform: `translate3D(0px,${this.mode == 'top' ? '-100%' : '100%'},0px)`
};
}
style.zIndex = this.zIndex ? this.zIndex : this.$u.zIndex.popup;
style.zIndex = this.uZindex;
// 如果用户设置了borderRadius值，添加弹窗的圆角
if (this.borderRadius) {
switch (this.mode) {
......@@ -236,7 +238,7 @@ export default {
style.width = this.width ? this.getUnitValue(this.width) : this.getUnitValue(this.length);
// 中部弹出的模式，如果没有设置高度，就用auto值，由内容撑开高度
style.height = this.height ? this.getUnitValue(this.height) : 'auto';
style.zIndex = this.zIndex ? this.zIndex : this.$u.zIndex.popup;
style.zIndex = this.uZindex;
style.marginTop = `-${this.$u.addUnit(this.negativeTop)}`;
if (this.borderRadius) {
style.borderRadius = `${this.borderRadius}rpx`;
......@@ -245,6 +247,10 @@ export default {
}
return style;
},
// 计算整理后的z-index值
uZindex() {
return this.zIndex ? this.zIndex : this.$u.zIndex.popup;
}
},
watch: {
value(val) {
......@@ -324,7 +330,6 @@ export default {
right: 0;
bottom: 0;
overflow: hidden;
z-index: 999;
}
.u-drawer-content {
......
uview-ui/components/u-select/u-select.vue
View file @ 5270afd2
......@@ -10,7 +10,8 @@
</view>
</view> -->
<u-popup :maskCloseAble="maskCloseAble" mode="bottom" :popup="false" v-model="value" length="auto" :safeAreaInsetBottom="safeAreaInsetBottom" @close="close" :z-index="uZIndex">
<view class="u-select">
<!-- 多加一个if判断，避免微信小程序第二次打开后，视图没有重新渲染，而导致数据混乱 -->
<view class="u-select" v-if="value">
<view class="u-select__header" @touchmove.stop.prevent="">
<view
class="u-select__header__cancel u-select__header__btn"
......@@ -251,12 +252,13 @@ export default {
let tmp = null;
for(let i = 0; i < this.columnNum; i++) {
tmp = this.columnData[i][this.defaultSelector[i]];
this.selectValue.push({
let data = {
value: tmp ? tmp[this.valueName] : null,
label: tmp ? tmp[this.labelName] : null
})
};
// 判断是否存在额外的参数，如果存在，就返回
if(tmp && tmp.extra) this.selectValue.extra = tmp.extra;
if(tmp && tmp.extra) data.extra = tmp.extra;
this.selectValue.push(data)
}
},
// 列选项
......
uview-ui/package.json
View file @ 5270afd2
{
"name": "uview-ui",
"version": "1.4.8",
"version": "1.5.0",
"description": "uView UI，是uni-app生态优秀的UI框架，全面的组件和便捷的工具会让您信手拈来，如鱼得水",
"main": "index.js",
"keywords": ["uview", "uView", "uni-app", "uni-app ui", "uniapp", "uviewui", "uview ui", "uviewUI", "uViewui", "uViewUI", "uView UI", "uni ui", "uni UI", "uniapp ui", "ui", "UI框架", "uniapp ui框架", "uniapp UI"],
......
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