Commit 4e77b883 authored by wlxuqu's avatar wlxuqu

1. select组件新增自定义value和label属性名的value-name和label-name,还有额外参数extra

2. toast组件新增callback回调参数
3. 修复由于deepClone方法缺陷导致select组件报错的问题
4. 修复slider在演示中无法显示拖动滑块的问题
5. 优化mask组件缩放效果时,传入的slot被一直停留在1.2倍放大的问题
6. 优化modal组件同时取消确定和取消按钮时,底部有占用空间的问题
7. swiper新增轮播切换时的change事件
8. 优化switch组件切换的控件可能会受父组件字体大小影响的问题
9. 去除请求插件中的默认header请求头的content-type字段,避免某些特殊情况下造成影响
parent 9e15c6cf
...@@ -15,15 +15,6 @@ ...@@ -15,15 +15,6 @@
<style lang="scss"> <style lang="scss">
@import "uview-ui/index.scss"; @import "uview-ui/index.scss";
@import "common/demo.scss";
/*每个页面公共css */ /*每个页面公共css */
/* H5的时候,隐藏滚动条 */
/* #ifdef H5 */
::-webkit-scrollbar {
display: none;
width: 0 !important;
height: 0 !important;
-webkit-appearance: none;
background: transparent;
}
/* #endif */
</style> </style>
\ No newline at end of file
...@@ -26,6 +26,8 @@ uView UI,是[uni-app](https://uniapp.dcloud.io/)生态优秀的UI框架,全 ...@@ -26,6 +26,8 @@ uView UI,是[uni-app](https://uniapp.dcloud.io/)生态优秀的UI框架,全
#### **vue-admin-beautiful** —— [企业级、通用型中后台前端解决方案(基于vue/cli 4 最新版,同时支持电脑,手机,平板)](https://github.com/chuzhixin/vue-admin-beautiful) #### **vue-admin-beautiful** —— [企业级、通用型中后台前端解决方案(基于vue/cli 4 最新版,同时支持电脑,手机,平板)](https://github.com/chuzhixin/vue-admin-beautiful)
#### **vue-admin-beautiful** —— [在线演示](http://beautiful.panm.cn/vue-admin-beautiful/#/index) #### **vue-admin-beautiful** —— [在线演示](http://beautiful.panm.cn/vue-admin-beautiful/#/index)
#### **pl-table** —— [ 完美解决 element 万级表格数据渲染卡顿问题](https://github.com/livelyPeng/pl-table)
<br> <br>
## 安装 ## 安装
......
/* start--演示页面使用的统一样式--start */
.u-demo {
padding: 50rpx 40rpx;
}
.u-demo-wrap {
border-width: 1px;
border-color: #ddd;
border-style: dashed;
background-color: rgb(250, 250, 250);
padding: 40rpx 20rpx;
border-radius: 6px;
}
.u-demo-area {
text-align: center;
}
.u-no-demo-here {
color: $u-tips-color;
font-size: 26rpx;
}
.u-demo-result-line {
border-width: 1px;
border-color: #ddd;
border-style: dashed;
padding: 10rpx 40rpx;
margin-top: 30rpx;
border-radius: 5px;
background-color: rgb(240, 240, 240);
color: $u-content-color;
font-size: 32rpx;
/* #ifndef APP-NVUE */
word-break: break-word;
display: inline-block;
/* #endif */
text-align: left;
}
.u-demo-title,
.u-config-title {
text-align: center;
font-size: 32rpx;
font-weight: bold;
margin-bottom: 40rpx;
}
.u-config-item {
margin-top: 50rpx;
}
.u-config-title {
margin-top: 40rpx;
padding-bottom: 10rpx;
}
.u-item-title {
position: relative;
font-size: 28rpx;
padding-left: 8px;
line-height: 1;
margin-bottom: 22rpx;
}
.u-item-title:after {
position: absolute;
width: 4px;
top: -1px;
height: 16px;
/* #ifndef APP-NVUE */
content: '';
/* #endif */
left: 0;
border-radius: 10px;
background-color: $u-content-color;
}
/* end--演示页面使用的统一样式--end */
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
"name" : "uView", "name" : "uView",
"appid" : "__UNI__60F4B81", "appid" : "__UNI__60F4B81",
"description" : "多平台快速开发的UI框架", "description" : "多平台快速开发的UI框架",
"versionName" : "1.0.0", "versionName" : "1.3.6",
"versionCode" : "100", "versionCode" : "100",
"transformPx" : false, "transformPx" : false,
"app-plus" : { "app-plus" : {
......
...@@ -233,7 +233,7 @@ ...@@ -233,7 +233,7 @@
"navigationBarTitleText": "keyboardPay 自定义键盘支付" "navigationBarTitleText": "keyboardPay 自定义键盘支付"
} }
}, },
// // douyin 仿抖音 // douyin 仿抖音
// { // {
// "path": "douyin/index", // "path": "douyin/index",
// "style": { // "style": {
......
...@@ -11,10 +11,10 @@ ...@@ -11,10 +11,10 @@
<u-input type="textarea" :border="border" placeholder="请填写简介" v-model="model.intro" /> <u-input type="textarea" :border="border" placeholder="请填写简介" v-model="model.intro" />
</u-form-item> </u-form-item>
<u-form-item :label-position="labelPosition" label="密码" prop="password"> <u-form-item :label-position="labelPosition" label="密码" prop="password">
<u-input :border="border" type="password" :password="true" v-model="model.password" placeholder="请输入密码"></u-input> <u-input :password-icon="true" :border="border" type="password" v-model="model.password" placeholder="请输入密码"></u-input>
</u-form-item> </u-form-item>
<u-form-item :label-position="labelPosition" label="确认密码" label-width="150" prop="rePassword"> <u-form-item :label-position="labelPosition" label="确认密码" label-width="150" prop="rePassword">
<u-input :border="border" type="password" :password="true" v-model="model.rePassword" placeholder="请确认密码"></u-input> <u-input :border="border" type="password" v-model="model.rePassword" placeholder="请确认密码"></u-input>
</u-form-item> </u-form-item>
<u-form-item :label-position="labelPosition" label="水果品种" label-width="150" prop="likeFruit"> <u-form-item :label-position="labelPosition" label="水果品种" label-width="150" prop="likeFruit">
<u-checkbox-group @change="checkboxGroupChange" :width="radioCheckWidth" :wrap="radioCheckWrap"> <u-checkbox-group @change="checkboxGroupChange" :width="radioCheckWidth" :wrap="radioCheckWrap">
......
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
} }
}, },
onShow() { onShow() {
this.$nextTick(function(){ this.$nextTick(() => {
this.current = 1; this.current = 1;
}) })
}, },
......
...@@ -32,32 +32,32 @@ export default { ...@@ -32,32 +32,32 @@ export default {
list: [], list: [],
list1: [ list1: [
{ {
value: '', id: '',
label: '' name: ''
}, },
{ {
value: '', id: '',
label: '' name: ''
}, },
{ {
value: '', id: '',
label: '' name: ''
}, },
{ {
value: '', id: '',
label: '' name: ''
}, },
{ {
value: '', id: '',
label: '' name: ''
}, },
{ {
value: '', id: '',
label: '' name: ''
}, },
{ {
value: '', id: '',
label: '' name: ''
} }
], ],
list2: [ list2: [
......
...@@ -11,11 +11,13 @@ ...@@ -11,11 +11,13 @@
@end="end" @end="end"
@moving="moving" @moving="moving"
> >
<view class=""> <!-- #ifndef MP-WEIXIN -->
<view class="badge-button" v-if="useSlot"> <view class="" v-if="useSlot">
<view class="badge-button">
{{value}} {{value}}
</view> </view>
</view> </view>
<!-- #endif -->
</u-slider> </u-slider>
<view class="u-demo-result-line"> <view class="u-demo-result-line">
滑块值:{{value}} 滑块值:{{value}}
...@@ -28,10 +30,12 @@ ...@@ -28,10 +30,12 @@
<view class="u-item-title">自定义颜色</view> <view class="u-item-title">自定义颜色</view>
<u-subsection vibrateShort :list="['primary', 'warning', 'error', 'success']" @change="typeChange"></u-subsection> <u-subsection vibrateShort :list="['primary', 'warning', 'error', 'success']" @change="typeChange"></u-subsection>
</view> </view>
<!-- #ifndef MP-WEIXIN -->
<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 current="1" :list="['是', '否']" @change="slotChange"></u-subsection> <u-subsection vibrateShort current="1" :list="['是', '否']" @change="slotChange"></u-subsection>
</view> </view>
<!-- #endif -->
<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 current="1" :list="['是', '否']" @change="sizeChange"></u-subsection> <u-subsection vibrateShort current="1" :list="['是', '否']" @change="sizeChange"></u-subsection>
......
...@@ -17,7 +17,7 @@ ...@@ -17,7 +17,7 @@
</view> </view>
</view> </view>
<view class="" slot="foot"> <view class="" slot="foot">
<u-icon v-if="bottomSlot" name="chat-fill" size="34" color="" label="30评论"></u-icon> <u-icon v-if="bottomSlot" name="chat-fill" size="34" label="30评论"></u-icon>
</view> </view>
</u-card> </u-card>
</view> </view>
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<view class="u-demo-wrap"> <view class="u-demo-wrap">
<view class="u-demo-title">演示效果</view> <view class="u-demo-title">演示效果</view>
<view class="u-demo-area u-flex u-row-center"> <view class="u-demo-area u-flex u-row-center">
<u-line color="red" :color="color" :length="length" :direction="direction" :hair-line="hairLine"></u-line> <u-line :border-style="borderStyle" color="red" :color="color" :length="length" :direction="direction" :hair-line="hairLine"></u-line>
</view> </view>
</view> </view>
<view class="u-config-wrap"> <view class="u-config-wrap">
...@@ -14,6 +14,10 @@ ...@@ -14,6 +14,10 @@
<view class="u-item-title">颜色</view> <view class="u-item-title">颜色</view>
<u-subsection vibrateShort :list="['primary', 'success', 'warning', 'error', 'info']" @change="colorChange"></u-subsection> <u-subsection vibrateShort :list="['primary', 'success', 'warning', 'error', 'info']" @change="colorChange"></u-subsection>
</view> </view>
<view class="u-config-item">
<view class="u-item-title">线条类型</view>
<u-subsection vibrateShort :list="['实线', '方形虚线', '圆点虚线']" @change="borderStyleChange"></u-subsection>
</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="['是', '否']" @change="hairLineChange"></u-subsection> <u-subsection vibrateShort :list="['是', '否']" @change="hairLineChange"></u-subsection>
...@@ -33,7 +37,8 @@ ...@@ -33,7 +37,8 @@
direction: 'row', direction: 'row',
hairLine: true, hairLine: true,
length: '100%', length: '100%',
color: this.$u.color['primary'] color: this.$u.color['primary'],
borderStyle: 'solid'
} }
}, },
methods: { methods: {
...@@ -48,6 +53,9 @@ ...@@ -48,6 +53,9 @@
if(index == 0) this.length = '100%'; if(index == 0) this.length = '100%';
else this.length = '50rpx'; else this.length = '50rpx';
}, },
borderStyleChange(index) {
this.borderStyle = ['solid', 'dashed', 'dotted'][index];
}
} }
} }
</script> </script>
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
<view class="u-demo-title">演示效果</view> <view class="u-demo-title">演示效果</view>
<view class="u-demo-area"> <view class="u-demo-area">
<u-toast ref="uToast"></u-toast> <u-toast ref="uToast"></u-toast>
<u-swiper :height="250" :list="list" :title="title" :effect3d="effect3d" <u-swiper @change="change" :height="250" :list="list" :title="title" :effect3d="effect3d"
:indicator-pos="indicatorPos" :mode="mode" :interval="3000" @click="click"></u-swiper> :indicator-pos="indicatorPos" :mode="mode" :interval="3000" @click="click"></u-swiper>
</view> </view>
</view> </view>
...@@ -74,6 +74,9 @@ ...@@ -74,6 +74,9 @@
title: `点击了第${index + 1}张图片`, title: `点击了第${index + 1}张图片`,
type: 'success' type: 'success'
}) })
},
change(index) {
// console.log(index);
} }
} }
} }
......
...@@ -13,10 +13,6 @@ ...@@ -13,10 +13,6 @@
<view class="u-config-title u-border-bottom"> <view class="u-config-title u-border-bottom">
参数配置 参数配置
</view> </view>
<view class="u-config-item">
<view class="u-item-title">顶部提示文字</view>
<u-subsection vibrateShort :current="show ? 0 : 1" :list="['是', '否']" @change="tipsChange"></u-subsection>
</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="['是', '否']" @change="cancelChange"></u-subsection> <u-subsection vibrateShort :list="['是', '否']" @change="cancelChange"></u-subsection>
......
...@@ -43,7 +43,7 @@ ...@@ -43,7 +43,7 @@
data() { data() {
return { return {
show: false, show: false,
zoom: false, zoom: true,
duration: 300, duration: 300,
content: false, content: false,
} }
......
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
:closeable="closeable" :closeable="closeable"
:close-icon-pos="closeIconPos" :close-icon-pos="closeIconPos"
> >
<view v-if="mode == 'center'" style="width: 400rpx;height: 400rpx"> <view v-if="mode == 'center'" style="height: 400rpx">
<view class="close-btn"> <view class="close-btn">
<u-button @click="show = false;" size="medium">关闭弹窗</u-button> <u-button @click="show = false;" size="medium">关闭弹窗</u-button>
</view> </view>
......
<template> <template>
<view> <view>
<!-- {{hasLogin}}||{{provider}}||{{openid}} -->
<image src="http://www.gyb086.com/Content/Home/images/regist-logo_03.jpg" mode="aspectFill" class="logo"></image>
<view class="loginWarp">
<view class="u-border-bottom">
<u-cell-group :border="false">
<u-field :field-style="fieldStyle" v-model="formData.name" placeholder="请输入用户名" label-width="20" :placeholder-style="placeholderClass">
<text class="iconfont icon-xingmingyonghumingnicheng color_gray2 u-padding-top-30" slot="icon"></text>
</u-field>
<u-field :field-style="fieldStyle" :password="true" v-model="formData.password" placeholder="请输入密码" label-width="20" :placeholder-style="placeholderClass">
<text class="iconfont icon-mima color_gray2 u-padding-top-30" slot="icon"></text>
<text class="iconfont icon-yanjing color_gray2" slot="right"></text>
</u-field>
<u-field :field-style="fieldStyle" v-model="formData.phone" placeholder="请输入手机号" label-width="20" :placeholder-style="placeholderClass">
<text class="iconfont icon-shoujihao color_gray2 u-padding-top-30" slot="icon"></text>
</u-field>
<u-field :field-style="fieldStyle" v-model="formData.code" placeholder="请填写验证码" label-width="20" :placeholder-style="placeholderClass">
<text class="iconfont icon-_yanzhengma color_gray2 u-padding-top-30" slot="icon"></text>
<!-- <u-button size="mini" slot="right" type="success" @tap="getCode">获取验证码</u-button> -->
<!-- <u-toast ref="uToast"></u-toast> -->
<text class="color_green u-padding-top-30" slot="right" @click="getCode">{{ tips }}</text>
</u-field>
</u-cell-group>
</view>
<view class="loginbtn">
<u-button :custom-style="btnColor" type="success" shape="circle" :ripple="true" ripple-bg-color="#19be6b" @click="login()">
登录
</u-button>
</view>
<navigator url="/pages/register/register" class="color_gray8 f28 text_ac">快速注册</navigator>
<!-- <navigator class="wxLogin"><text class="iconfont icon-weixin1"></text></navigator> -->
<u-button class="wxbtn" type="success" :custom-style="wxLogin" shape="circle" :plain="true" :hair-line="false" open-type="getPhoneNumber" @getphonenumber="getphonenumber">
<text class="iconfont icon-weixin1 wxicon"></text>
</u-button>
<u-verification-code seconds="60" :keep-running="true" @end="end" @start="start" ref="uCode" @change="codeChange"></u-verification-code>
</view>
</view> </view>
</template> </template>
<script> <script>
import { mapState, mapMutations } from 'vuex'; export default {
export default { data() {
data() { return {
return { list: [{
placeholderClass: 'color:#c4c4c5;', text: '点赞',
fieldStyle: { color: 'blue',
paddingTop: '30rpx', fontSize: 28
}, }, {
wxLogin:{ text: '分享'
border:'none', }, {
borderColor:'#fff', text: '评论'
backgroundColor:'none', }],
height: '120rpx', show: false
width:'120rpx',
color: '#fff',
fontSize: '70rpx',
marginTop:'120px'
},
btnColor:{
backgroundColor: '#338b39',
borderColor: '#338b39'
},
formData: {
name: '高供货',
password: '123456',
phone: '13730508115',
code: '888',
verCode: '',
wxPhone: '',
codeSession_key: ''
},
tips: '获取验证码'
};
},
// computed: {
// ...mapState(['hasLogin', 'provider', 'openid', 'session_key'])
// },
methods: {
//...mapMutations(['setOpenid', 'loginSetData']),
// 获取微信用户手机号 快捷登陆
getphonenumber: function(e) {
// console.log(e);
let getWxPhone = this.util.getWxPhone(e.detail.encryptedData, this.session_key, e.detail.iv);
this.formData.wxPhone = getWxPhone.phoneNumber;
console.log(this.formData.wxPhone);
this.request
.post('/Common/Login/', {
ciphertext: {
nvc_platform: '1',
nvc_wx_identifier: this.openid,
nvc_phone: this.formData.wxPhone
}
})
.then(res => {
console.log(res);
if(res.code == 400){
this.$u.toast('您还未绑定平台账号,请先登陆后进行绑定');
}
// uni.hideLoading();
// // 这里此提示会被this.start()方法中的提示覆盖
// this.$u.toast('验证码已发送');
// // 通知验证码组件内部开始倒计时
// this.$refs.uCode.start();
})
.catch(e => {
});
},
// 获取验证码
codeChange(text) {
this.tips = text;
},
getCode() {
console.log(this.$refs.uCode);
if (this.$refs.uCode.canGetCode) {
if (this.$u.test.isEmpty(this.formData.name)) {
this.$u.toast('请输入用户名');
return;
} else if (this.$u.test.isEmpty(this.formData.phone)) {
this.$u.toast('请输入手机号');
return;
} else {
uni.showLoading({
title: '正在获取验证码'
});
this.request
.post('/Common/SendMobileCode/', {
ciphertext: {
nvc_platform: '1',
sendType: '1',
number: this.formData.phone,
userName: this.formData.name
}
})
.then(res => {
console.log(res);
if(res.success == true){
uni.hideLoading();
// 这里此提示会被this.start()方法中的提示覆盖
this.$u.toast('验证码已发送');
this.formData.codeSession_key = res.data.session_key
// 通知验证码组件内部开始倒计时
this.$refs.uCode.start();
}else{
this.$u.toast(res.msg);
}
})
.catch(e => {});
}
} else {
this.$u.toast('倒计时结束后再发送');
} }
},
end() {
// this.$u.toast('倒计时结束');
},
start() {
this.$u.toast('验证码已发送啊啊');
},
login(){
if (this.$u.test.isEmpty(this.formData.name)) {
this.$u.toast('请输入用户名');
return;
} else if (this.$u.test.isEmpty(this.formData.password)) {
this.$u.toast('请输入密码');
return;
} else if (this.$u.test.isEmpty(this.formData.phone)) {
this.$u.toast('请输入手机号');
return;
} else if(!this.$u.test.mobile(this.formData.phone)){
this.$u.toast('请输入正确的手机号');
return;
}else if(this.$u.test.isEmpty(this.formData.code)){
this.$u.toast('请输入验证码');
return;
}else{
this.request
.post('/Common/Login/', {
ciphertext: {
nvc_platform: '1',
nvc_user_name: this.formData.name,
nvc_pass_word: this.formData.password,
nvc_phone:this.formData.phone,
mobile_code:this.formData.code,
session_key:this.formData.codeSession_key
}
})
.then(res => {
console.log(res);
// debugger
if(res.success == true){
this.loginSetData({
loginUser:res.data.loginUser,
loginPersonInfo:res.data.loginPersonInfo
})
uni.setStorageSync('userData',{
loginUser:res.data.loginUser,
loginPersonInfo:res.data.loginPersonInfo
})
uni.switchTab({
url:'../me/me-index/me-index'
})
this.$u.toast('登录成功');
}
})
.catch(e => {});
}
}
},
onLoad: function() {
// console.log(this.openid)
if (this.openid == null) {
// 获取服务供应商
let that = this;
let provider = '';
uni.getProvider({
service: 'oauth',
success: function(res) {
console.log(res);
provider = res.provider[0];
// 登录微信
uni.login({
provider: provider,
success: function(loginRes) {
console.log(loginRes);
// debugger
that.request
.post('/Common/GetOpenId/', {
ciphertext: {
nvc_platform: '1',
js_code: loginRes.code
}
})
.then(res => {
console.log(res);
// debugger
that.setOpenid({
openid: res.data.openid,
session_key: res.data.session_key,
provider: provider
});
})
.catch(e => {});
// // 获取用户信息
// uni.getUserInfo({
// provider:provider,
// success:function(infoRes){
// console.log(infoRes)
// }
// })
},
fail: function(res) {}
});
}
});
} }
} }
}; </script>
</script> \ No newline at end of file
<style lang="scss" scoped>
.logo {
display: block;
width: 282rpx;
height: 106rpx;
margin: 0 auto;
padding: 40rpx 0 60rpx;
}
.loginWarp {
padding: 0 75rpx;
.loginbtn {
margin: 70rpx 0;
}
.wxicon {
color: #52c223;
}
}
</style>
...@@ -5,4 +5,7 @@ ...@@ -5,4 +5,7 @@
</script> </script>
<style> <style>
.div {
}
</style> </style>
...@@ -59,6 +59,7 @@ ...@@ -59,6 +59,7 @@
<style lang="scss"> <style lang="scss">
page{ page{
background-color: #ededed; background-color: #ededed;
min-height: 100vh;
} }
.camera{ .camera{
......
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
<view <view
v-if="showHead" v-if="showHead"
class="u-card__head" class="u-card__head"
:style="[headStyle, {padding: padding + 'rpx'}]" :style="[{padding: padding + 'rpx'}, headStyle]"
:class="{ :class="{
'u-border-bottom': headBorderBottom 'u-border-bottom': headBorderBottom
}" }"
...@@ -54,12 +54,12 @@ ...@@ -54,12 +54,12 @@
</view> </view>
<slot name="head" v-else /> <slot name="head" v-else />
</view> </view>
<view @tap="bodyClick" class="u-card__body" :style="[bodyStyle, {padding: padding + 'rpx'}]"><slot name="body" /></view> <view @tap="bodyClick" class="u-card__body" :style="[{padding: padding + 'rpx'}, bodyStyle]"><slot name="body" /></view>
<view <view
v-if="showFoot" v-if="showFoot"
class="u-card__foot" class="u-card__foot"
@tap="footClick" @tap="footClick"
:style="[footStyle, {padding: $slots.foot ? padding + 'rpx' : 0}]" :style="[{padding: $slots.foot ? padding + 'rpx' : 0}, footStyle]"
:class="{ :class="{
'u-border-top': footBorderTop 'u-border-top': footBorderTop
}" }"
......
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
export default { export default {
data() { data() {
return { return {
show: true, show: false,
content: ` content: `
1. 修复badge组件的size参数无效问题<br> 1. 修复badge组件的size参数无效问题<br>
2. 新增Modal模态框组件<br> 2. 新增Modal模态框组件<br>
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
`, `,
} }
}, },
onShow() { onReady() {
this.show = true; this.show = true;
}, },
methods: { methods: {
......
...@@ -35,7 +35,7 @@ ...@@ -35,7 +35,7 @@
:type="type == 'password' ? 'text' : type" :type="type == 'password' ? 'text' : type"
:style="[getStyle]" :style="[getStyle]"
:value="defaultValue" :value="defaultValue"
:password="type == 'password' && showPassword" :password="type == 'password' && !showPassword"
:placeholder="placeholder" :placeholder="placeholder"
:placeholderStyle="placeholderStyle" :placeholderStyle="placeholderStyle"
:disabled="disabled || type === 'select'" :disabled="disabled || type === 'select'"
...@@ -52,7 +52,7 @@ ...@@ -52,7 +52,7 @@
<u-icon size="32" name="close-circle-fill" color="#c0c4cc" @touchstart="onClear"/> <u-icon size="32" name="close-circle-fill" color="#c0c4cc" @touchstart="onClear"/>
</view> </view>
<view class="u-input__right-icon__clear u-input__right-icon__item" v-if="passwordIcon && type == 'password'"> <view class="u-input__right-icon__clear u-input__right-icon__item" v-if="passwordIcon && type == 'password'">
<u-icon size="32" :name="showPassword ? 'eye' : 'eye-fill'" color="#c0c4cc" @click="showPassword = !showPassword"/> <u-icon size="32" :name="!showPassword ? 'eye' : 'eye-fill'" color="#c0c4cc" @click="showPassword = !showPassword"/>
</view> </view>
<view class="u-input__right-icon--select u-input__right-icon__item" v-if="type == 'select'" :class="{ <view class="u-input__right-icon--select u-input__right-icon__item" v-if="type == 'select'" :class="{
'u-input__right-icon--select--reverse': selectOpen 'u-input__right-icon--select--reverse': selectOpen
...@@ -166,7 +166,7 @@ export default { ...@@ -166,7 +166,7 @@ export default {
textareaHeight: 100, // textarea的高度 textareaHeight: 100, // textarea的高度
validateState: false, // 当前input的验证状态,用于错误时,边框是否改为红色 validateState: false, // 当前input的验证状态,用于错误时,边框是否改为红色
focused: false, // 当前是否处于获得焦点的状态 focused: false, // 当前是否处于获得焦点的状态
showPassword: this.passwordIcon, // 是否预览密码 showPassword: false, // 是否预览密码
marginRight: 0, // 输入框右边的距离,当获得焦点时各一个后面的距离,避免点击右边图标误触输入框 marginRight: 0, // 输入框右边的距离,当获得焦点时各一个后面的距离,避免点击右边图标误触输入框
}; };
}, },
......
...@@ -12,6 +12,7 @@ ...@@ -12,6 +12,7 @@
* @property {String} color 线条的颜色(默认#e4e7ed) * @property {String} color 线条的颜色(默认#e4e7ed)
* @property {String} length 长度,竖向时表现为高度,横向时表现为长度,可以为百分比,带rpx单位的值等 * @property {String} length 长度,竖向时表现为高度,横向时表现为长度,可以为百分比,带rpx单位的值等
* @property {String} direction 线条的方向,row-横向,col-竖向(默认row) * @property {String} direction 线条的方向,row-横向,col-竖向(默认row)
* @property {String} border-style 线条的类型,solid-实线,dashed-方形虚线,dotted-圆点虚线(默认solid)
* @property {Boolean} hair-line 是否显示细线条(默认true) * @property {Boolean} hair-line 是否显示细线条(默认true)
* @property {String} margin 线条与上下左右元素的间距,字符串形式,如"30rpx" * @property {String} margin 线条与上下左右元素的间距,字符串形式,如"30rpx"
* @example <u-line color="red"></u-line> * @example <u-line color="red"></u-line>
...@@ -42,24 +43,32 @@ ...@@ -42,24 +43,32 @@
margin: { margin: {
type: String, type: String,
default: '0' default: '0'
},
// 线条的类型,solid-实线,dashed-方形虚线,dotted-圆点虚线
borderStyle: {
type: String,
default: 'solid'
} }
}, },
computed: { computed: {
lineStyle() { lineStyle() {
let style = {}; let style = {};
style.backgroundColor = this.color;
style.margin = this.margin; style.margin = this.margin;
// 如果是水平线条,高度为1px,再通过transform缩小一半,就是0.5px了 // 如果是水平线条,边框高度为1px,再通过transform缩小一半,就是0.5px了
if(this.direction == 'row') { if(this.direction == 'row') {
style.height = '1px'; // 此处采用兼容分开写,兼容nvue的写法
style.borderBottomWidth = '1px';
style.borderBottomStyle = this.borderStyle;
style.width = this.length; style.width = this.length;
if(this.hairLine) style.transform = 'scaleY(0.5)'; if(this.hairLine) style.transform = 'scaleY(0.5)';
} else { } else {
// 如果是竖向线条,宽度为1px,再通过transform缩小一半,就是0.5px了 // 如果是竖向线条,边框宽度为1px,再通过transform缩小一半,就是0.5px了
style.width = '1px'; style.borderLeftWidth = '1px';
style.borderLeftStyle = this.borderStyle;
style.height = this.length; style.height = this.length;
if(this.hairLine) style.transform = 'scaleX(0.5)'; if(this.hairLine) style.transform = 'scaleX(0.5)';
} }
style.borderColor = this.color;
return style; return style;
} }
} }
......
<template> <template>
<view class="u-mask" :style="[maskStyle]" :class="[show ? 'u-mask-show' : '']" @tap="click" @touchmove.stop.prevent> <view class="u-mask" :style="[maskStyle, zoomStyle]" @tap="click" @touchmove.stop.prevent :class="{
'u-mask-zoom': zoom,
'u-mask-show': show
}">
<slot /> <slot />
</view> </view>
</template> </template>
...@@ -54,6 +57,25 @@ ...@@ -54,6 +57,25 @@
default: true default: true
} }
}, },
data() {
return {
zoomStyle: {
transform: ''
},
scale: 'scale(1.2, 1.2)'
}
},
watch: {
show(n) {
if(n && this.zoom) {
// 当展示遮罩的时候,设置scale为1,达到缩小(原来为1.2)的效果
this.zoomStyle.transform = 'scale(1, 1)';
} else if(!n && this.zoom) {
// 当隐藏遮罩的时候,设置scale为1.2,达到放大(因为显示遮罩时已重置为1)的效果
this.zoomStyle.transform = this.scale;
}
}
},
computed: { computed: {
maskStyle() { maskStyle() {
let style = {}; let style = {};
...@@ -61,14 +83,10 @@ ...@@ -61,14 +83,10 @@
if(this.show) style.zIndex = this.zIndex ? this.zIndex : this.$u.zIndex.mask; if(this.show) style.zIndex = this.zIndex ? this.zIndex : this.$u.zIndex.mask;
else style.zIndex = -1; else style.zIndex = -1;
style.transition = `all ${this.duration / 1000}s ease-in-out`; style.transition = `all ${this.duration / 1000}s ease-in-out`;
// 缩放 // 判断用户传递的对象是否为空,不为空就进行合并
if (this.zoom == true) style.transform = 'scale(1.2, 1.2)';
// 判断用户传递的对象是否为空
if (Object.keys(this.customStyle).length) style = { ...style, if (Object.keys(this.customStyle).length) style = { ...style,
...this.customStyle ...this.customStyle
}; };
// 合并自定义的样式
//Object.assign(style, customStyle);
return style; return style;
} }
}, },
...@@ -89,10 +107,14 @@ ...@@ -89,10 +107,14 @@
right: 0; right: 0;
bottom: 0; bottom: 0;
opacity: 0; opacity: 0;
transition: transform 0.3s;
} }
.u-mask-show { .u-mask-show {
opacity: 1; opacity: 1;
transform: scale(1); }
.u-mask-zoom {
transform: scale(1.2, 1.2);
} }
</style> </style>
...@@ -15,7 +15,7 @@ ...@@ -15,7 +15,7 @@
</view> </view>
<view v-else class="u-model-content-message" :style="[contentStyle]">{{ content }}</view> <view v-else class="u-model-content-message" :style="[contentStyle]">{{ content }}</view>
</view> </view>
<view class="u-model-footer u-border-top"> <view class="u-model-footer u-border-top" v-if="showCancelButton || showConfirmButton">
<view <view
v-if="showCancelButton" v-if="showCancelButton"
:hover-stay-time="100" :hover-stay-time="100"
...@@ -242,25 +242,10 @@ export default { ...@@ -242,25 +242,10 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.u-mask {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
opacity: 0;
visibility: hidden;
}
.btn-hover { .btn-hover {
background-color: rgb(230, 230, 230); background-color: rgb(230, 230, 230);
} }
.u-mask-show {
opacity: 1;
visibility: visible;
}
.u-model { .u-model {
height: auto; height: auto;
overflow: hidden; overflow: hidden;
......
...@@ -36,7 +36,7 @@ ...@@ -36,7 +36,7 @@
<picker-view @change="columnChange" class="u-select__body__picker-view" :value="defaultSelector"> <picker-view @change="columnChange" class="u-select__body__picker-view" :value="defaultSelector">
<picker-view-column v-for="(item, index) in columnData" :key="index"> <picker-view-column v-for="(item, index) in columnData" :key="index">
<view class="u-select__body__picker-view__item" v-for="(item1, index1) in item" :key="index1"> <view class="u-select__body__picker-view__item" v-for="(item1, index1) in item" :key="index1">
<view class="u-line-1">{{ item1.label }}</view> <view class="u-line-1">{{ item1[labelName] }}</view>
</view> </view>
</picker-view-column> </picker-view-column>
</picker-view> </picker-view>
...@@ -101,6 +101,21 @@ export default { ...@@ -101,6 +101,21 @@ export default {
mode: { mode: {
type: String, type: String,
default: 'single-column' default: 'single-column'
},
// 自定义value属性名
valueName: {
type: String,
default: 'value'
},
// 自定义label属性名
labelName: {
type: String,
default: 'label'
},
// 自定义多列联动模式的children属性名
childName: {
type: String,
default: 'children'
} }
}, },
data() { data() {
...@@ -156,8 +171,8 @@ export default { ...@@ -156,8 +171,8 @@ export default {
let num = 1; let num = 1;
let column = this.list; let column = this.list;
// 只要有元素并且第一个元素有children属性,继续历遍 // 只要有元素并且第一个元素有children属性,继续历遍
while(column[0].children) { while(column[0][this.childName]) {
column = column[0] ? column[0].children : {}; column = column[0] ? column[0][this.childName] : {};
num ++; num ++;
} }
this.columnNum = num; this.columnNum = num;
...@@ -175,11 +190,11 @@ export default { ...@@ -175,11 +190,11 @@ export default {
// 第一列默认为整个list数组 // 第一列默认为整个list数组
if (i == 0) { if (i == 0) {
data[i] = this.list; data[i] = this.list;
column = column.children; column = column[this.childName];
} else { } else {
// 大于第一列时,判断是否有默认选中的,如果没有就用该列的第一项 // 大于第一列时,判断是否有默认选中的,如果没有就用该列的第一项
data[i] = column; data[i] = column;
column = column[this.defaultSelector[i]].children; column = column[this.defaultSelector[i]][this.childName];
} }
} }
} else if(this.mode == 'single-column') { } else if(this.mode == 'single-column') {
...@@ -191,11 +206,15 @@ export default { ...@@ -191,11 +206,15 @@ export default {
}, },
// 获取默认选中的值,如果没有设置defaultValue,就默认选中每列的第一个 // 获取默认选中的值,如果没有设置defaultValue,就默认选中每列的第一个
setSelectValue() { setSelectValue() {
let tmp = null;
for(let i = 0; i < this.columnNum; i++) { for(let i = 0; i < this.columnNum; i++) {
tmp = this.columnData[i][this.defaultSelector[i]];
this.selectValue.push({ this.selectValue.push({
value: this.columnData[i][this.defaultSelector[i]].value, value: tmp ? tmp[this.valueName] : null,
label: this.columnData[i][this.defaultSelector[i]].label, label: tmp ? tmp[this.labelName] : null
}) })
// 判断是否存在额外的参数,如果存在,就返回
if(tmp && tmp.extra) this.selectValue.extra = tmp.extra;
} }
}, },
// 列选项 // 列选项
...@@ -213,7 +232,7 @@ export default { ...@@ -213,7 +232,7 @@ export default {
for (let i = index + 1; i < this.columnNum; i++) { for (let i = index + 1; i < this.columnNum; i++) {
// 当前变化列的下一列的数据,需要获取上一列的数据,同时需要指定是上一列的第几个的children,再往后的 // 当前变化列的下一列的数据,需要获取上一列的数据,同时需要指定是上一列的第几个的children,再往后的
// 默认是队列的第一个为默认选项 // 默认是队列的第一个为默认选项
this.columnData[i] = this.columnData[i - 1][i - 1 == index ? cloumnIndex[index] : 0].children; this.columnData[i] = this.columnData[i - 1][i - 1 == index ? cloumnIndex[index] : 0][this.childName];
// 改变的列之后的所有列,默认选中第一个 // 改变的列之后的所有列,默认选中第一个
this.defaultSelector[i] = 0; this.defaultSelector[i] = 0;
} }
...@@ -221,27 +240,39 @@ export default { ...@@ -221,27 +240,39 @@ export default {
// 只有在最后一次数据稳定后的结果是正确的,此前的历遍中,可能会产生undefined,故需要判断 // 只有在最后一次数据稳定后的结果是正确的,此前的历遍中,可能会产生undefined,故需要判断
cloumnIndex.map((item, index) => { cloumnIndex.map((item, index) => {
let data = this.columnData[index][cloumnIndex[index]]; let data = this.columnData[index][cloumnIndex[index]];
this.selectValue.push({ let tmp = {
value: data ? data.value : null, value: data ? data[this.valueName] : null,
label: data ? data.label : null label: data ? data[this.labelName] : null,
}) };
// 判断是否有需要额外携带的参数
if(data && data.extra) tmp.extra = data.extra;
this.selectValue.push(tmp);
}) })
// 保存这一次的结果,用于下次列发生变化时作比较 // 保存这一次的结果,用于下次列发生变化时作比较
this.lastSelectIndex = cloumnIndex; this.lastSelectIndex = cloumnIndex;
} else if(this.mode == 'single-column') { } else if(this.mode == 'single-column') {
let data = this.columnData[0][cloumnIndex[0]];
// 初始默认选中值 // 初始默认选中值
this.selectValue.push({ let tmp = {
value: this.columnData[0][cloumnIndex[0]].value, value: data ? data[this.valueName] : null,
label: this.columnData[0][cloumnIndex[0]].label, label: data ? data[this.labelName] : null,
}) };
// 判断是否有需要额外携带的参数
if(data && data.extra) tmp.extra = data.extra;
this.selectValue.push(tmp);
} else if(this.mode == 'mutil-column') { } else if(this.mode == 'mutil-column') {
// 初始默认选中值 // 初始默认选中值
cloumnIndex.map((item, index) => { cloumnIndex.map((item, index) => {
let data = this.columnData[index][cloumnIndex[index]]; let data = this.columnData[index][cloumnIndex[index]];
this.selectValue.push({ // 初始默认选中值
value: data ? data.value : null, let tmp = {
label: data ? data.label : null value: data ? data[this.valueName] : null,
}) label: data ? data[this.labelName] : null,
};
// 判断是否有需要额外携带的参数
if(data && data.extra) tmp.extra = data.extra;
this.selectValue.push(tmp);
}) })
} }
}, },
......
...@@ -193,7 +193,10 @@ ...@@ -193,7 +193,10 @@
this.$emit('click', index); this.$emit('click', index);
}, },
change(e) { change(e) {
this.current = e.detail.current; let current = e.detail.current;
this.current = current;
// 发出change事件,表示当前自动切换的index,从0开始
this.$emit('change', current);
}, },
// 头条小程序不支持animationfinish事件,改由change事件 // 头条小程序不支持animationfinish事件,改由change事件
// 暂不监听此事件,因为不再给swiper绑定current属性 // 暂不监听此事件,因为不再给swiper绑定current属性
......
...@@ -109,17 +109,12 @@ ...@@ -109,17 +109,12 @@
display: inline-block; display: inline-block;
box-sizing: initial; box-sizing: initial;
width: 2em; width: 2em;
width: var(--switch-width, 2em);
height: 1em; height: 1em;
height: var(--switch-height, 1em);
background-color: #fff; background-color: #fff;
background-color: var(--switch-background-color, #fff);
border: 1px solid rgba(0, 0, 0, 0.1); border: 1px solid rgba(0, 0, 0, 0.1);
border: var(--switch-border, 1px solid rgba(0, 0, 0, 0.1));
border-radius: 1em; border-radius: 1em;
border-radius: var(--switch-node-size, 1em);
transition: background-color 0.3s; transition: background-color 0.3s;
transition: background-color var(--switch-transition-duration, 0.3s); font-size: 50rpx;
} }
.u-switch__node { .u-switch__node {
...@@ -131,22 +126,16 @@ ...@@ -131,22 +126,16 @@
left: 0; left: 0;
border-radius: 100%; border-radius: 100%;
z-index: 1; z-index: 1;
z-index: var(--switch-node-z-index, 1);
width: 1em; width: 1em;
width: var(--switch-node-size, 1em);
height: 1em; height: 1em;
height: var(--switch-node-size, 1em);
background-color: #fff; background-color: #fff;
background-color: var(--switch-node-background-color, #fff); background-color: #fff;
box-shadow: 0 3px 1px 0 rgba(0, 0, 0, 0.05), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 3px 3px 0 rgba(0, 0, 0, 0.05);
box-shadow: 0 3px 1px 0 rgba(0, 0, 0, 0.05), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 3px 3px 0 rgba(0, 0, 0, 0.05); box-shadow: 0 3px 1px 0 rgba(0, 0, 0, 0.05), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 3px 3px 0 rgba(0, 0, 0, 0.05);
box-shadow: var(--switch-node-box-shadow, 0 3px 1px 0 rgba(0, 0, 0, 0.05), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 3px 3px 0 rgba(0, 0, 0, 0.05));
transition: -webkit-transform 0.3s cubic-bezier(0.3, 1.05, 0.4, 1.05);
transition: transform 0.3s cubic-bezier(0.3, 1.05, 0.4, 1.05); transition: transform 0.3s cubic-bezier(0.3, 1.05, 0.4, 1.05);
transition: transform 0.3s cubic-bezier(0.3, 1.05, 0.4, 1.05), -webkit-transform 0.3s cubic-bezier(0.3, 1.05, 0.4, 1.05); transition: transform 0.3s cubic-bezier(0.3, 1.05, 0.4, 1.05), -webkit-transform 0.3s cubic-bezier(0.3, 1.05, 0.4, 1.05);
transition: -webkit-transform var(--switch-transition-duration, 0.3s) cubic-bezier(0.3, 1.05, 0.4, 1.05); transition: transform cubic-bezier(0.3, 1.05, 0.4, 1.05);
transition: transform var(--switch-transition-duration, 0.3s) cubic-bezier(0.3, 1.05, 0.4, 1.05); transition: transform 0.3s cubic-bezier(0.3, 1.05, 0.4, 1.05)
transition: transform var(--switch-transition-duration, 0.3s) cubic-bezier(0.3, 1.05, 0.4, 1.05),
-webkit-transform var(--switch-transition-duration, 0.3s) cubic-bezier(0.3, 1.05, 0.4, 1.05);
} }
.u-switch__loading { .u-switch__loading {
...@@ -157,18 +146,13 @@ ...@@ -157,18 +146,13 @@
.u-switch--on { .u-switch--on {
background-color: #1989fa; background-color: #1989fa;
background-color: var(--switch-on-background-color, #1989fa);
} }
.u-switch--on .u-switch__node { .u-switch--on .u-switch__node {
-webkit-transform: translateX(1em);
transform: translateX(1em); transform: translateX(1em);
-webkit-transform: translateX(calc(var(--switch-width, 2em) - var(--switch-node-size, 1em)));
transform: translateX(calc(var(--switch-width, 2em) - var(--switch-node-size, 1em)));
} }
.u-switch--disabled { .u-switch--disabled {
opacity: 0.4; opacity: 0.4;
opacity: var(--switch-disabled-opacity, 0.4);
} }
</style> </style>
...@@ -86,7 +86,9 @@ ...@@ -86,7 +86,9 @@
box-sizing: border-box; box-sizing: border-box;
} }
/* #ifdef MP */
.u-table /deep/ t-tr { .u-table /deep/ t-tr {
display: flex; display: flex;
} }
/* #endif */
</style> </style>
...@@ -40,6 +40,7 @@ ...@@ -40,6 +40,7 @@
url: '', // toast消失后是否跳转页面,有则跳转 url: '', // toast消失后是否跳转页面,有则跳转
icon: true, // 显示的图标 icon: true, // 显示的图标
position: 'center', // toast出现的位置 position: 'center', // toast出现的位置
callback: null, // 执行完后的回调函数
} }
}; };
}, },
...@@ -59,7 +60,7 @@ ...@@ -59,7 +60,7 @@
methods: { methods: {
// 显示toast组件,由父组件通过this.$refs.xxx.show(options)形式调用 // 显示toast组件,由父组件通过this.$refs.xxx.show(options)形式调用
show(options) { show(options) {
this.config = Object.assign(this.config, options); this.config = this.$u.deepMerge(this.config, options);
if (this.timer) { if (this.timer) {
// 清除定时器 // 清除定时器
clearTimeout(this.timer); clearTimeout(this.timer);
...@@ -71,6 +72,8 @@ ...@@ -71,6 +72,8 @@
this.isShow = false; this.isShow = false;
clearTimeout(this.timer); clearTimeout(this.timer);
this.timer = null; this.timer = null;
// 判断是否存在callback方法,如果存在就执行
typeof(this.config.callback) === 'function' && this.config.callback();
this.timeEnd(); this.timeEnd();
}, this.config.duration); }, this.config.duration);
}, },
......
...@@ -334,14 +334,19 @@ ...@@ -334,14 +334,19 @@
formData: this.formData, formData: this.formData,
header: this.header, header: this.header,
success: (res) => { success: (res) => {
// 由于此处返回的res.data为字符串,将其转为json格式
let data = {};
try{
data = JSON.parse(res.data);
}catch(e){}
if (![200,201].includes(res.statusCode)) { if (![200,201].includes(res.statusCode)) {
this.uploadError(index, res.data); this.uploadError(index, data);
} else { } else {
// 上传成功 // 上传成功
this.lists[index].response = res.data; this.lists[index].response = data;
this.lists[index].progress = 100; this.lists[index].progress = 100;
this.lists[index].error = false; this.lists[index].error = false;
this.$emit('on-success', res.data, index, this.lists); this.$emit('on-success', data, index, this.lists);
} }
}, },
fail: (e) => { fail: (e) => {
......
...@@ -79,12 +79,11 @@ ...@@ -79,12 +79,11 @@
// 当前秒的时间戳 // 当前秒的时间戳
let nowTimestamp = Math.floor((+ new Date()) / 1000); let nowTimestamp = Math.floor((+ new Date()) / 1000);
// 判断当前的时间戳,是否小于上一次的本该按设定结束,却提前结束的时间戳 // 判断当前的时间戳,是否小于上一次的本该按设定结束,却提前结束的时间戳
console.log(lastTimestamp, nowTimestamp);
if(this.keepRunning && lastTimestamp && lastTimestamp > nowTimestamp) { if(this.keepRunning && lastTimestamp && lastTimestamp > nowTimestamp) {
// 剩余尚未执行完的倒计秒数 // 剩余尚未执行完的倒计秒数
this.secNum = lastTimestamp - nowTimestamp; this.secNum = lastTimestamp - nowTimestamp;
// 清除本地保存的变量 // 清除本地保存的变量
uni.setStorageSync(this.uniqueKey + '_$uCountDownTimestamp', 0); uni.removeStorageSync(this.uniqueKey + '_$uCountDownTimestamp');
// 开始倒计时 // 开始倒计时
this.start(); this.start();
} else { } else {
...@@ -130,7 +129,7 @@ ...@@ -130,7 +129,7 @@
}, },
// 保存时间戳,为了防止倒计时尚未结束,H5刷新或者各端的右上角返回上一页再进来 // 保存时间戳,为了防止倒计时尚未结束,H5刷新或者各端的右上角返回上一页再进来
setTimeToStorage() { setTimeToStorage() {
if(!this.keepRunning || !this.timer) return console.log(111, this.timer); if(!this.keepRunning || !this.timer) return;
// 记录当前的时间戳,为了下次进入页面,如果还在倒计时内的话,继续倒计时 // 记录当前的时间戳,为了下次进入页面,如果还在倒计时内的话,继续倒计时
// 倒计时尚未结束,结果大于0;倒计时已经开始,就会小于初始值,如果等于初始值,说明没有开始倒计时,无需处理 // 倒计时尚未结束,结果大于0;倒计时已经开始,就会小于初始值,如果等于初始值,说明没有开始倒计时,无需处理
if(this.secNum > 0 && this.secNum <= this.seconds) { if(this.secNum > 0 && this.secNum <= this.seconds) {
...@@ -139,7 +138,7 @@ ...@@ -139,7 +138,7 @@
// 将本该结束时候的时间戳保存起来 => 当前时间戳 + 剩余的秒数 // 将本该结束时候的时间戳保存起来 => 当前时间戳 + 剩余的秒数
uni.setStorage({ uni.setStorage({
key: this.uniqueKey + '_$uCountDownTimestamp', key: this.uniqueKey + '_$uCountDownTimestamp',
data: nowTimestamp + this.secNum data: nowTimestamp + Number(this.secNum)
}) })
} }
} }
......
...@@ -2,262 +2,22 @@ ...@@ -2,262 +2,22 @@
@import "./libs/css/common.scss"; @import "./libs/css/common.scss";
@import "./libs/css/color.scss"; @import "./libs/css/color.scss";
page { // 非nvue的样式
color: $u-main-color; /* #ifndef APP-NVUE */
font-size: 28rpx; @import "./libs/css/style.vue.scss";
}
image {
display: inline-block;
// 解决图片加载时可能会瞬间变形的问题
will-change: transform;
}
view,
text {
box-sizing: border-box;
flex-direction: row;
}
/* start--去除webkit的默认样式--start */
.u-fix-ios-appearance {
-webkit-appearance:none;
}
/* end--去除webkit的默认样式--end */
/* start--icon图标外层套一个view,让其达到更好的垂直居中的效果--start */
.u-icon-wrap {
display: flex;
align-items: center;
}
/* end-icon图标外层套一个view,让其达到更好的垂直居中的效果--end */
/* start--微信小程序编译后页面有组件名的元素,特别处理--start */
/* #ifdef MP-WEIXIN */
u-td, u-th {
flex: 1;
align-self: stretch;
}
.u-td {
height: 100%;
}
u-icon {
display: flex;
align-items: center;
}
// 各家小程序宫格组件外层设置为100%,避免受到父元素display: flex;的影响
u-grid {
width: 100%;
flex: 0 0 100%;
}
// 避免小程序线条组件因为父组件display: flex;而失效
u-line {
flex: 1;
}
/* #endif */ /* #endif */
/* end-微信小程序编译后页面有组件名的元素,特别处理--end */
/* start--iPhoneX底部安全区定义--start */
.safe-area-inset-bottom {
padding-bottom: 0;
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
}
/* end-iPhoneX底部安全区定义--end */
/* start--各种hover点击反馈相关的类名-start */
.u-hover-class {
// background-color: #f7f8f9!important;
opacity: 0.6;
}
.u-cell-hover {
background-color: #f7f8f9!important;
}
/* end--各种hover点击反馈相关的类名--end */
/* start--文本行数限制--start */
.u-line-1 {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.u-line-2 {
-webkit-line-clamp: 2;
}
.u-line-3 {
-webkit-line-clamp: 3;
}
.u-line-4 {
-webkit-line-clamp: 4;
}
.u-line-5 {
-webkit-line-clamp: 5;
}
.u-line-2, .u-line-3, .u-line-4, .u-line-5 {
overflow: hidden;
word-break: break-all;
text-overflow: ellipsis;
display: -webkit-box; // 弹性伸缩盒
-webkit-box-orient: vertical; // 设置伸缩盒子元素排列方式
}
/* end--文本行数限制--end */
/* start--Retina 屏幕下的 1px 边框--start */ // nvue的特有样式
.u-border, /* #ifdef APP-NVUE */
.u-border-bottom, @import "./libs/css/style.nvue.scss";
.u-border-left, /* #endif */
.u-border-right,
.u-border-top,
.u-border-top-bottom {
position: relative
}
.u-border-bottom:after,
.u-border-left:after,
.u-border-right:after,
.u-border-top-bottom:after,
.u-border-top:after,
.u-border:after {
content: ' ';
position: absolute;
left: 0;
top: 0;
pointer-events: none;
box-sizing: border-box;
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
// 多加0.1%,能解决有时候边框缺失的问题
width: 199.8%;
height: 199.7%;
transform: scale(0.5, 0.5);
border: 0 solid $u-border-color;
z-index: 2;
}
.u-border-top:after {
border-top-width: 1px
}
.u-border-left:after {
border-left-width: 1px
}
.u-border-right:after {
border-right-width: 1px
}
.u-border-bottom:after {
border-bottom-width: 1px
}
.u-border-top-bottom:after {
border-width: 1px 0
}
.u-border:after {
border-width: 1px
}
/* end--Retina 屏幕下的 1px 边框--end */
/* start--clearfix--start */
.u-clearfix:after,
.clearfix:after {
content: "";
display: table;
clear: both
}
/* end--clearfix--end */
/* start--演示页面使用的统一样式--start */
.u-demo {
padding: 50rpx 40rpx;
}
.u-demo-wrap {
border: 1px dashed #ddd;
background-color: rgb(250, 250, 250);
padding: 40rpx 20rpx;
border-radius: 6px;
}
.u-demo-area {
text-align: center;
}
.u-no-demo-here {
color: $u-tips-color;
font-size: 26rpx;
}
.u-demo-result-line {
border: 1px dashed #ddd;
padding: 10rpx 40rpx;
margin-top: 30rpx;
border-radius: 5px;
background-color: rgb(240, 240, 240);
color: $u-content-color;
display: inline-block;
font-size: 32rpx;
transition: all 0.35s;
word-break: break-word;
text-align: left;
}
.u-demo-title,
.u-config-title {
text-align: center;
font-size: 32rpx;
font-weight: bold;
margin-bottom: 40rpx;
}
.u-config-item {
margin-top: 50rpx;
}
.u-config-title {
margin-top: 40rpx;
padding-bottom: 10rpx;
}
.u-item-title {
position: relative;
font-size: 28rpx;
padding-left: 8px;
line-height: 1;
margin-bottom: 22rpx;
}
.u-item-title:after { // 小程序特有的样式
position: absolute; /* #ifdef MP */
width: 4px; @import "./libs/css/style.mp.scss";
top: -1px; /* #endif */
height: 16px;
content: '';
left: 0;
border-radius: 10px;
background-color: $u-content-color;
}
/* end--演示页面使用的统一样式--end */
/* start--高斯模糊tabbar底部处理--start */ // H5特有的样式
.u-blur-effect-inset { /* #ifdef MP */
width: 750rpx; @import "./libs/css/style.h5.scss";
height: var(--window-bottom); /* #endif */
background-color: #FFFFFF; \ No newline at end of file
}
/* end--高斯模糊tabbar底部处理--end */
// 此版本发布于2020-06-15 // 此版本发布于2020-06-19
let version = '1.3.5'; let version = '1.3.61';
export default { export default {
v: version, v: version,
......
...@@ -29,7 +29,9 @@ ...@@ -29,7 +29,9 @@
} }
.u-flex { .u-flex {
/* #ifndef APP-NVUE */
display: flex; display: flex;
/* #endif */
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
} }
...@@ -87,7 +89,9 @@ ...@@ -87,7 +89,9 @@
} }
.u-flex-col { .u-flex-col {
/* #ifndef APP-NVUE */
display: flex; display: flex;
/* #endif */
flex-direction: column; flex-direction: column;
} }
......
/* H5的时候,隐藏滚动条 */
/* #ifdef H5 */
::-webkit-scrollbar {
display: none;
width: 0 !important;
height: 0 !important;
-webkit-appearance: none;
background: transparent;
}
/* #endif */
\ No newline at end of file
/* start--微信小程序编译后页面有组件名的元素,特别处理--start */
/* #ifdef MP-WEIXIN */
u-td, u-th {
flex: 1;
align-self: stretch;
}
.u-td {
height: 100%;
}
u-icon {
display: flex;
align-items: center;
}
// 各家小程序宫格组件外层设置为100%,避免受到父元素display: flex;的影响
u-grid {
width: 100%;
flex: 0 0 100%;
}
// 避免小程序线条组件因为父组件display: flex;而失效
u-line {
flex: 1;
}
/* #endif */
/* end-微信小程序编译后页面有组件名的元素,特别处理--end */
\ No newline at end of file
.nvue {
font-size: 24rpx;
}
\ No newline at end of file
page {
color: $u-main-color;
font-size: 28rpx;
}
image {
display: inline-block;
// 解决图片加载时可能会瞬间变形的问题
will-change: transform;
}
view,
text {
box-sizing: border-box;
flex-direction: row;
}
/* start--去除webkit的默认样式--start */
.u-fix-ios-appearance {
-webkit-appearance:none;
}
/* end--去除webkit的默认样式--end */
/* start--icon图标外层套一个view,让其达到更好的垂直居中的效果--start */
.u-icon-wrap {
display: flex;
align-items: center;
}
/* end-icon图标外层套一个view,让其达到更好的垂直居中的效果--end */
/* start--iPhoneX底部安全区定义--start */
.safe-area-inset-bottom {
padding-bottom: 0;
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
}
/* end-iPhoneX底部安全区定义--end */
/* start--各种hover点击反馈相关的类名-start */
.u-hover-class {
// background-color: #f7f8f9!important;
opacity: 0.6;
}
.u-cell-hover {
background-color: #f7f8f9!important;
}
/* end--各种hover点击反馈相关的类名--end */
/* start--文本行数限制--start */
.u-line-1 {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.u-line-2 {
-webkit-line-clamp: 2;
}
.u-line-3 {
-webkit-line-clamp: 3;
}
.u-line-4 {
-webkit-line-clamp: 4;
}
.u-line-5 {
-webkit-line-clamp: 5;
}
.u-line-2, .u-line-3, .u-line-4, .u-line-5 {
overflow: hidden;
word-break: break-all;
text-overflow: ellipsis;
display: -webkit-box; // 弹性伸缩盒
-webkit-box-orient: vertical; // 设置伸缩盒子元素排列方式
}
/* end--文本行数限制--end */
/* start--Retina 屏幕下的 1px 边框--start */
.u-border,
.u-border-bottom,
.u-border-left,
.u-border-right,
.u-border-top,
.u-border-top-bottom {
position: relative
}
.u-border-bottom:after,
.u-border-left:after,
.u-border-right:after,
.u-border-top-bottom:after,
.u-border-top:after,
.u-border:after {
/* #ifndef APP-NVUE */
content: ' ';
/* #endif */
position: absolute;
left: 0;
top: 0;
pointer-events: none;
box-sizing: border-box;
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
// 多加0.1%,能解决有时候边框缺失的问题
width: 199.8%;
height: 199.7%;
transform: scale(0.5, 0.5);
border: 0 solid $u-border-color;
z-index: 2;
}
.u-border-top:after {
border-top-width: 1px
}
.u-border-left:after {
border-left-width: 1px
}
.u-border-right:after {
border-right-width: 1px
}
.u-border-bottom:after {
border-bottom-width: 1px
}
.u-border-top-bottom:after {
border-width: 1px 0
}
.u-border:after {
border-width: 1px
}
/* end--Retina 屏幕下的 1px 边框--end */
/* start--clearfix--start */
.u-clearfix:after,
.clearfix:after {
/* #ifndef APP-NVUE */
content: '';
/* #endif */
display: table;
clear: both
}
/* end--clearfix--end */
/* start--高斯模糊tabbar底部处理--start */
.u-blur-effect-inset {
width: 750rpx;
height: var(--window-bottom);
background-color: #FFFFFF;
}
/* end--高斯模糊tabbar底部处理--end */
// 对象深度克隆 // 判断arr是否为一个数组,返回一个bool值
function deepClone(object = {}) { function isArray (arr) {
var o, i, j, k; return Object.prototype.toString.call(arr) === '[object Array]';
if (typeof(object) !== "object" || object === null) return object; }
if (object instanceof Array) {
o = []; // 深度克隆
i = 0; function deepClone (obj) {
j = object.length; if(typeof obj !== "object" && typeof obj !== 'function') {
for (; i < j; i++) { //原始类型直接返回
if (typeof(object[i]) === "object" && object[i] != null) { return obj;
o[i] = deepClone(object[i]); }
} else { var o = isArray(obj) ? [] : {};
o[i] = object[i]; for(let i in obj) {
} if(obj.hasOwnProperty(i)){
} o[i] = typeof obj[i] === "object" ? deepClone(obj[i]) : obj[i];
} else { }
o = {}; }
for (i in object) { return o;
if (typeof(object[i]) === "object" && object[i] !== null) {
o[i] = deepClone(object[i]);
} else {
o[i] = object[i];
}
}
}
return o;
} }
export default deepClone; export default deepClone;
...@@ -97,9 +97,7 @@ class Request { ...@@ -97,9 +97,7 @@ class Request {
this.config = { this.config = {
baseUrl: '', // 请求的根域名 baseUrl: '', // 请求的根域名
// 默认的请求头 // 默认的请求头
header: { header: {},
'content-type': 'application/json;charset=UTF-8',
},
method: 'POST', method: 'POST',
// 设置为json,返回后uni.request会对数据进行一次JSON.parse // 设置为json,返回后uni.request会对数据进行一次JSON.parse
dataType: 'json', dataType: 'json',
......
{ {
"name": "uview-ui", "name": "uview-ui",
"version": "1.3.5", "version": "1.3.61",
"description": "uView UI,是uni-app生态优秀的UI框架,全面的组件和便捷的工具会让您信手拈来,如鱼得水", "description": "uView UI,是uni-app生态优秀的UI框架,全面的组件和便捷的工具会让您信手拈来,如鱼得水",
"main": "index.js", "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"], "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