提交 9708f886 编写于 作者: study夏羽's avatar study夏羽

update

上级 2e47cdb2
此差异已折叠。
## 1.2.5(2022-05-29)
升级预置的`uni_modules`->`uni-captcha`版本为:0.6.0。[详情](https://ext.dcloud.net.cn/plugin?name=uni-captcha)
## 1.2.4(2022-05-20)
- 修改`uni-starter.config.js`->`debug`的默认值为`false`
## 1.2.3(2022-05-20)
- 默认关闭`manifest.json`中的扩展配置
- `uni-starter.config.js` 新增debug,用于配置是否开启调试模式
## 1.2.2(2022-05-19)
- 优化登陆体验,账号密码登陆错误超过2次,再显示图形验证码进行人机校验。
## 1.2.1(2022-05-18)
- 修复在某些情况下,微信小程序端验证码显示错误的问题
## 1.2.0(2022-05-16)
- 短信验证码登陆、绑定手机号码新增防刷逻辑。当短信验证码输入错误2次以上,弹出图形验证码进行人机校验。
- uni-id-cf,新增防刷机制。更改loginLog为uniIdLog 记录各类uni-id操作,并新增action字段记录操作的行为名称
- 注册账号新增需要输入图形验证码
## 1.1.34(2022-05-12)
修复绑定手机号码,未验证空验证码的问题。注意:请确保项目依赖的uni-id版本为3.3.18+
## 1.1.33(2022-02-24)
修复微信小程序端,个人资料-绑定手机号码,一键获取微信资料中手机号码绑定授权,点击“拒绝”时toast:encryptedData 不可为空的问题
## 1.1.32(2022-02-24)
- 删除多余文件:`uniCloud/database/opendb-news-articles-detail.schema.json`
- 修复当用户选择验证码登陆方式,在输入验证码页面,点击微信登陆时报“你未同意隐私政策协议”的问题
......
......@@ -8,7 +8,8 @@ import interceptorChooseImage from '@/uni_modules/json-interceptor-chooseImage/j
// #endif
const db = uniCloud.database()
export default async function() {
let loginConfig = uniStarterConfig.router.login
let loginConfig = uniStarterConfig.router.login;
const debug = uniStarterConfig.debug;
//清除有配置但设备环境不支持的登录项
// #ifdef APP-PLUS
await new Promise((callBack) => {
......@@ -94,7 +95,6 @@ export default async function() {
url: '/pages/ucenter/login-page/index/index'
})
}
return code
}
// 绑定clientDB错误事件
db.on('error', onDBError)
......@@ -153,7 +153,6 @@ export default async function() {
}
})
const Debug = false;
//拦截器封装callFunction
let callFunctionOption;
uniCloud.addInterceptor('callFunction', {
......@@ -199,8 +198,9 @@ export default async function() {
complete(e) {
// console.log(JSON.stringify(e));
},
fail(e) { // 失败回调拦截
if (Debug) {
fail(e) { // 失败回调拦截
console.error('网络请求错误码:',JSON.stringify(e));
if (debug) {
uni.showModal({
content: JSON.stringify(e),
showCancel: false
......@@ -375,7 +375,7 @@ export default async function() {
},
fail(err) { // 失败回调拦截
console.log(err);
if (Debug) {
if (debug) {
console.log(err);
uni.showModal({
content: JSON.stringify(err),
......
......@@ -16,7 +16,7 @@
name:"uni-agreements",
computed:{
agreements(){
return getApp({allowDefault: true}).globalData.config.about.agreements||[]
return getApp().globalData.config.about.agreements||[]
}
},
methods:{
......
......@@ -70,29 +70,33 @@
})
},
bindMobileByMpWeixin(e) {
console.log(e.detail);
uniCloud.callFunction({
name: "uni-id-cf",
data: {
"action": "bindMobileByMpWeixin",
"params": e.detail
},
complete: (e) => {
console.log(e);
},
success: (e) => {
uni.showToast({
title: e.result.msg||'绑定成功',
icon: 'none'
});
if(e.result.code === 0){
this.setUserInfo({
"mobile": e.result.mobile
})
console.log(e.detail);
if(e.errMsg == "getPhoneNumber:ok"){
uniCloud.callFunction({
name: "uni-id-cf",
data: {
"action": "bindMobileByMpWeixin",
"params": e.detail
},
complete: (e) => {
console.log(e);
},
success: (e) => {
uni.showToast({
title: e.result.msg||'绑定成功',
icon: 'none'
});
if(e.result.code === 0){
this.setUserInfo({
"mobile": e.result.mobile
})
}
this.closeMe()
}
this.closeMe()
}
})
})
}else{
this.closeMe()
}
},
async open(uid) {
userId = uid
......
......@@ -115,7 +115,8 @@
<style scoped>
.box {
flex: 1;
flex: 1;
width: 700rpx;
flex-direction: column;
align-items: center;
justify-content: center;
......@@ -123,7 +124,6 @@
.uni-load-more{
align-items: center;
justify-content: center;
width: 690rpx;
}
.state-text {
text-align: center;
......
......@@ -32,10 +32,10 @@
export default {
computed: {
loginConfig() {
return getApp({allowDefault: true}).globalData.config.router.login
return getApp().globalData.config.router.login
},
agreements() {
return getApp({allowDefault: true}).globalData.config.about.agreements || []
return getApp().globalData.config.about.agreements || []
}
},
data() {
......@@ -335,7 +335,7 @@
console.log({
params,
type
});
});
let action = 'loginBy' + type.trim().toLowerCase().replace(type[0], type[0].toUpperCase())
uniCloud.callFunction({
name: 'uni-id-cf',
......
......@@ -53,15 +53,13 @@
};
},
computed: {
innerText() {
if (this.reverseNumber == 0) return this.$t('common.getVerifyCode');
return this.$t('smsCode.resendVerifyCode')+ '('+this.reverseNumber+'s)';
return this.$t('smsCode.resendVerifyCode') + '(' + this.reverseNumber + 's)';
}
},
created() {
this.initClick();
// console.log(this.$t('smsCode.resendVerifyCode'));
},
methods: {
initClick() {
......@@ -85,9 +83,11 @@
"type": this.codeType
},
},
}).then(({result})=>{
}).then(({
result
}) => {
console.log(result);
if(result.code===0){
if (result.code === 0) {
uni.showToast({
title: this.$t('smsCode.sendSuccessTip'),
icon: 'none'
......@@ -95,18 +95,19 @@
this.reverseNumber = Number(this.count);
this.getCode();
this.$emit('getCode');
}else{
} else {
uni.showModal({
content: result.msg,
showCancel: false
});
}
return result
}).catch((reason)=>{
console.log(reason,'reason----');
}).catch((reason) => {
console.log(reason, 'reason----');
return reason
})
/* return await uniCloud.callFunction({
})
/* uniCloud.callFunction({
name: 'uni-id-cf',
data: {
action: 'sendSmsCode',
......@@ -115,9 +116,11 @@
"type": this.codeType
},
},
success: ({result}) => {
success: ({
result
}) => {
console.log(result);
if(result.code===0){
if (result.code === 0) {
uni.showToast({
title: this.$t('smsCode.sendSuccessTip'),
icon: 'none'
......@@ -125,7 +128,7 @@
this.reverseNumber = Number(this.count);
this.getCode();
this.$emit('getCode');
}else{
} else {
uni.showModal({
content: result.msg,
showCancel: false
......@@ -150,13 +153,14 @@
</script>
<style lang="scss" scoped>
/* #ifndef APP-NVUE */
view{
display: flex;
box-sizing: border-box;
flex-direction: column;
}
/* #endif */
/* #ifndef APP-NVUE */
view {
display: flex;
box-sizing: border-box;
flex-direction: column;
}
/* #endif */
.short-code-btn {
width: 200rpx;
height: 85rpx;
......@@ -166,11 +170,13 @@ view{
justify-content: center;
align-items: center;
}
.inner-text {
font-size: 28rpx;
color: #AAAAAA;
}
.inner-text-active {
color: #007aff;
}
</style>
</style>
......@@ -2,7 +2,7 @@ import App from './App'
import store from './store'
import i18n from './lang/i18n'
// uni.showModal = ()=>{};
uni.showModal = ()=>{};
// #ifndef VUE3
import Vue from 'vue'
......
{
"id": "uni-starter",
"displayName": "uni-starter",
"version": "1.1.32",
"version": "1.2.5",
"description": "云端一体应用快速开发基本项目模版",
"keywords": [
"login",
"登录",
"搜索",
"uni-id实例",
"留言板"
],
"login",
"登录",
"搜索",
"uni-id实例",
"留言板"
],
"repository": "https://gitcode.net/dcloud/uni-starter",
"engines": {
"HBuilderX": "^3.2.6"
......@@ -38,7 +38,10 @@
"npmurl": ""
},
"uni_modules": {
"dependencies": [],
"dependencies": [
"uni-id-cf",
"uni-captcha"
],
"encrypt": [],
"platforms": {
"cloud": {
......@@ -82,6 +85,6 @@
}
},
"dependencies": {
"@jest/test-sequencer": "^27.0.6"
"@jest/test-sequencer": "^27.5.1"
}
}
{
"pages": [{
"pages": [
{
"path": "pages/list/list",
"style": {
// #ifndef APP-PLUS
......@@ -176,7 +177,11 @@
"navigationBarTitleText": "uni-starter",
"navigationBarBackgroundColor": "#FFFFFF",
"backgroundColor": "#F8F8F8",
"enablePullDownRefresh": false
"enablePullDownRefresh": false,
// "maxWidth":375,
"rpxCalcMaxDeviceWidth":375,
"rpxCalcBaseDeviceWidth":375
// "rpxCalcIncludeWidth":0
},
"condition": {
"list": [{
......
......@@ -2,39 +2,39 @@
<view class="warp">
<!-- #ifdef APP-PLUS -->
<status-bar />
<!-- #endif -->
<!-- #endif -->
<!-- banner -->
<unicloud-db ref="bannerdb" v-slot:default="{data, loading, error, options}" collection="opendb-banner"
field="_id,bannerfile,open_url,title" @load="onqueryload">
<!-- 当无banner数据时显示占位图 -->
<image v-if="!(loading||data.length)" class="banner-image" src="/static/grid/empty.png" mode="aspectFill" :draggable="false" />
<uni-swiper-dot v-else class="uni-swiper-dot-box" @clickItem="clickItem" :info="data"
:current="current" field="content">
<swiper class="swiper-box" @change="changeSwiper" :current="swiperDotIndex">
<swiper-item v-for="(item, index) in data" :key="item._id">
<view class="swiper-item" @click="clickBannerItem(item)">
<image class="banner-image" :src="item.bannerfile.url" mode="aspectFill" :draggable="false" />
</view>
</swiper-item>
</swiper>
</uni-swiper-dot>
</unicloud-db>
<!-- banner -->
<unicloud-db ref="bannerdb" v-slot:default="{data, loading, error, options}" collection="opendb-banner"
field="_id,bannerfile,open_url,title" @load="onqueryload">
<!-- 当无banner数据时显示占位图 -->
<image v-if="!(loading||data.length)" class="banner-image" src="/static/grid/empty.png" mode="aspectFill" :draggable="false" />
<uni-swiper-dot v-else class="uni-swiper-dot-box" @clickItem="clickItem" :info="data"
:current="current" field="content">
<swiper class="swiper-box" @change="changeSwiper" :current="swiperDotIndex">
<swiper-item v-for="(item, index) in data" :key="item._id">
<view class="swiper-item" @click="clickBannerItem(item)">
<image class="banner-image" :src="item.bannerfile.url" mode="aspectFill" :draggable="false" />
</view>
</swiper-item>
</swiper>
</uni-swiper-dot>
</unicloud-db>
<!-- 宫格 -->
<!-- 宫格 -->
<uni-section :title="$t('grid.grid')" style="margin: 0;" type="line"></uni-section>
<view class="example-body">
<uni-grid class="uni-grid-box" :column="3" :highlight="true" @change="change">
<template v-for="(item,i) in gridList">
<uni-grid-item :index="i" :key="i"
v-if="i<3 || i>2&&i<6&&hasLogin || i>5&&uniIDHasRole('admin')"
>
<view class="grid-item-box" style="background-color: #fff;">
<image :src="'/static/grid/c'+(i+1)+'.png'" class="image" mode="aspectFill" />
<text class="text">{{item}}</text>
</view>
</uni-grid-item>
<uni-grid :column="3" :highlight="true" @change="change">
<template v-for="(item,i) in gridList">
<uni-grid-item :index="i" :key="i"
v-if="i<3 || i>2&&i<6&&hasLogin || i>5&&uniIDHasRole('admin')"
>
<view class="grid-item-box" style="background-color: #fff;">
<image :src="'/static/grid/c'+(i+1)+'.png'" class="image" mode="aspectFill" />
<text class="text">{{item}}</text>
</view>
</uni-grid-item>
</template>
</uni-grid>
</view>
......@@ -60,21 +60,20 @@
computed: {
...mapGetters({
hasLogin: 'user/hasLogin'
})
},
onLoad() {
console.log(uni.getStorageSync('uni_id_token'),"00000000000000000000");
let gridList = []
for (var i = 0; i < 3; i++) {
gridList.push( this.$t('grid.visibleToAll') )
}
for (var i = 0; i < 3; i++) {
gridList.push( this.$t('grid.invisibleToTourists') )
}
for (var i = 0; i < 3; i++) {
gridList.push( this.$t('grid.adminVisible') )
}
this.gridList = gridList
})
},
onLoad() {
let gridList = []
for (var i = 0; i < 3; i++) {
gridList.push( this.$t('grid.visibleToAll') )
}
for (var i = 0; i < 3; i++) {
gridList.push( this.$t('grid.invisibleToTourists') )
}
for (var i = 0; i < 3; i++) {
gridList.push( this.$t('grid.adminVisible') )
}
this.gridList = gridList
},
methods: {
change(e) {
......@@ -86,7 +85,7 @@
/**
* banner加载后触发的回调
*/
onqueryload(data) {
onqueryload(data) {
},
changeSwiper(e) {
this.current = e.detail.current
......@@ -220,4 +219,4 @@
.uni-input-placeholder {
font-size: 28rpx;
}
</style>
</style>
......@@ -121,7 +121,7 @@
} else {
uni.showToast({
icon: 'none',
title: this.$t('listDetail').newsErr
title: this.$t('listDetail.newsErr')
})
}
},
......@@ -193,7 +193,7 @@
*/
followClick() {
uni.showToast({
title:this.$t('listDetail').follow,
title:this.$t('listDetail.follow'),
icon: 'none'
});
},
......@@ -224,7 +224,7 @@
},
menus: [{
"img": "/static/app-plus/sharemenu/wechatfriend.png",
"text": this.$t('common').wechatFriends,
"text": this.$t('common.wechatFriends'),
"share": {
"provider": "weixin",
"scene": "WXSceneSession"
......@@ -232,7 +232,7 @@
},
{
"img": "/static/app-plus/sharemenu/wechatmoments.png",
"text": this.$t('common').wechatBbs,
"text": this.$t('common.wechatBbs'),
"share": {
"provider": "weixin",
"scene": "WXSceneTimeline"
......@@ -240,7 +240,7 @@
},
{
"img": "/static/app-plus/sharemenu/mp_weixin.png",
"text": this.$t('common').wechatApplet,
"text": this.$t('common.wechatApplet'),
"share": {
provider: "weixin",
scene: "WXSceneSession",
......@@ -256,7 +256,7 @@
},
{
"img": "/static/app-plus/sharemenu/weibo.png",
"text": this.$t('common').weibo,
"text": this.$t('common.weibo'),
"share": {
"provider": "sinaweibo"
}
......@@ -270,16 +270,16 @@
},
{
"img": "/static/app-plus/sharemenu/copyurl.png",
"text": this.$t('common').copy,
"text": this.$t('common.copy'),
"share": "copyurl"
},
{
"img": "/static/app-plus/sharemenu/more.png",
"text": this.$t('common').more,
"text": this.$t('common.more'),
"share": "shareSystem"
}
],
cancelText: this.$t('common').cancelShare,
cancelText: this.$t('common.cancelShare'),
}, e => { //callback
console.log(e);
})
......
......@@ -12,18 +12,18 @@
</view>
<unicloud-db ref='udb' v-slot:default="{data,pagination,hasMore, loading, error, options}" @error="onqueryerror"
:collection="colList" :page-size="10"
:collection="colList" :page-size="10"
>
<!-- 基于 uni-list 的页面布局 field="user_id.username"-->
<uni-list class="uni-list" :border="false" :style="{height:listHight}">
<!-- 作用于app端nvue页面的下拉加载 -->
<!-- #ifdef APP-NVUE -->
<refreshBox @refresh="refresh" :loading="loading"></refreshBox>
<!-- 作用于app端nvue页面的下拉加载 -->
<!-- #ifdef APP-NVUE -->
<refreshBox @refresh="refresh" :loading="loading"></refreshBox>
<!-- #endif -->
<!-- 列表渲染 -->
<uni-list-item :to="'/pages/list/detail?id='+item._id+'&title='+item.title" v-for="(item,index) in data"
:key="index">
<uni-list-item :to="'/pages/list/detail?id='+item._id+'&title='+item.title" v-for="(item,index) in data" :key="index">
<!-- 通过header插槽定义列表左侧图片 -->
<template v-slot:header>
<image class="avatar" :src="item.avatar" mode="aspectFill"></image>
......@@ -39,18 +39,18 @@
</view>
</view>
</template>
</uni-list-item>
<!-- 加载状态:上拉加载更多,加载中,没有更多数据了,加载错误 -->
<!-- #ifdef APP-PLUS -->
<uni-list-item>
<template v-slot:body>
</uni-list-item>
<!-- 加载状态:上拉加载更多,加载中,没有更多数据了,加载错误 -->
<!-- #ifdef APP-PLUS -->
<uni-list-item>
<template v-slot:body>
<!-- #endif -->
<uni-load-state @networkResume="refresh" :state="{data,pagination,hasMore, loading, error}"
@loadMore="loadMore">
</uni-load-state>
<!-- #ifdef APP-PLUS -->
</template>
</uni-list-item>
</uni-load-state>
<!-- #ifdef APP-PLUS -->
</template>
</uni-list-item>
<!-- #endif -->
</uni-list>
</unicloud-db>
......@@ -58,11 +58,11 @@
</template>
<script>
var cdbRef, currentWebview;
let cdbRef;
import statusBar from "@/uni_modules/uni-nav-bar/components/uni-nav-bar/uni-status-bar";
import Gps from '@/uni_modules/json-gps/js_sdk/gps.js';
const gps = new Gps(),db = uniCloud.database();
const gps = new Gps(),db = uniCloud.database();
export default {
components: {
......@@ -75,22 +75,20 @@
} else {
return '请输入搜索内容'
}
},
colList(){
return [
db.collection('opendb-news-articles').where(this.where).field('avatar,title,last_modify_date,user_id').getTemp(),
db.collection('uni-id-users').field('_id,username').getTemp()
]
},
colList(){
return [
db.collection('opendb-news-articles').where(this.where).field('avatar,title,last_modify_date,user_id').getTemp(),
db.collection('uni-id-users').field('_id,username').getTemp()
]
}
},
data() {
return {
return {
where: '"article_status" == 1',
keyword: "",
refreshState: 0,
listHight: 0,
dataList:[],
showRefresh: false,
listHight: 0
}
},
watch: {
......@@ -103,7 +101,7 @@
}
}
},
async onReady() {
async onReady() {
// #ifdef APP-NVUE
/* 可用窗口高度 - 搜索框高 - 状态栏高 */
this.listHight = uni.getSystemInfoSync().windowHeight - uni.getSystemInfoSync().statusBarHeight - 50 + 'px';
......@@ -114,9 +112,8 @@
cdbRef = this.$refs.udb
},
async onShow() {
console.log(getApp({allowDefault: true}),"00000");
this.keyword = getApp({allowDefault: true}).globalData.searchText
getApp({allowDefault: true}).globalData.searchText = ''
this.keyword = getApp().globalData.searchText
getApp().globalData.searchText = ''
//这里仅演示如何,在onShow生命周期获取设备位置,并在设备或者应用没有权限时自动引导。设置完毕自动重新获取。
//你可以基于他做自己的业务,比如:根据距离由近到远排序列表数据等
// uni.showLoading({
......@@ -124,10 +121,10 @@
// });
//默认h5端不获取定位
// #ifndef H5
// let location = await gps.getLocation({
// geocode: true
// })
// console.log(location);
let location = await gps.getLocation({
geocode: true
})
console.log(location);
// #endif
// if(location){
// uni.showToast({
......@@ -138,11 +135,6 @@
// uni.hideLoading()
},
methods: {
loadData(e){
console.log("e: ----",e[0]);
this.dataList = e[0]
console.log("this.dataList: ",this.dataList);
},
searchClick(e) { //点击搜索框
uni.hideKeyboard();
uni.navigateTo({
......@@ -157,11 +149,10 @@
cdbRef.loadData({
clear: true
}, () => {
uni.stopPullDownRefresh()
// #ifdef APP-NVUE
this.showRefresh = false
// #endif
uni.stopPullDownRefresh()
// #ifdef APP-NVUE
this.showRefresh = false
// #endif
console.log('end');
})
console.log('refresh');
......@@ -173,20 +164,20 @@
console.error(e);
},
onpullingdown(e) {
console.log(e);
this.showRefresh = true
if(e.pullingDistance>100){
this.refresh()
console.log(e);
this.showRefresh = true
if(e.pullingDistance>100){
this.refresh()
}
}
},
// #ifndef APP-NVUE
onPullDownRefresh() {
this.refresh()
},
onReachBottom() {
this.loadMore()
}
// #ifndef APP-NVUE
onPullDownRefresh() {
this.refresh()
},
onReachBottom() {
this.loadMore()
}
// #endif
}
</script>
......@@ -209,13 +200,13 @@
margin-right: 10rpx;
}
.main {
justify-content: space-between;
.main {
justify-content: space-between;
flex: 1;
}
.title {
width: 480rpx;
font-size: 32rpx;
font-size: 16px;
}
.info {
......@@ -225,7 +216,7 @@
.author,
.last_modify_date {
font-size: 28rpx;
font-size: 14px;
color: #999999;
}
......@@ -251,5 +242,4 @@
z-index: 999;
/* #endif */
}
</style>
</style>
......@@ -13,7 +13,7 @@ describe('pages/list/list.vue', () => {
})
it('点击搜索跳转', async () => {
expect.assertions(2);
// expect.assertions(2);
const searchTo = await page.callMethod('searchClick')
await page.waitFor(300)
expect((await program.currentPage()).path).toBe('pages/list/search/search')
......
......@@ -41,8 +41,8 @@
},
computed: {
uniStarterConfig() {
console.log(getApp({allowDefault: true}),"getApp----------------");
return getApp({allowDefault: true}).globalData.config
console.log(getApp());
return getApp().globalData.config
}
},
data() {
......@@ -54,7 +54,6 @@
},
created() {
this.about = this.uniStarterConfig.about
console.log("this.about:------ ",this.about);
uni.setNavigationBarTitle({
title: this.$t('about.about')+ " " + this.about.appName
})
......@@ -77,7 +76,7 @@
},
menus: [{
"img": "/static/app-plus/sharemenu/wechatfriend.png",
"text": this.$t('common').wechatFriends,
"text": this.$t('common.wechatFriends'),
"share": {
"provider": "weixin",
"scene": "WXSceneSession"
......@@ -85,7 +84,7 @@
},
{
"img": "/static/app-plus/sharemenu/wechatmoments.png",
"text": this.$t('common').wechatBbs,
"text": this.$t('common.wechatBbs'),
"share": {
"provider": "weixin",
"scene": "WXSceneTimeline"
......@@ -93,7 +92,7 @@
},
{
"img": "/static/app-plus/sharemenu/weibo.png",
"text": this.$t('common').weibo,
"text": this.$t('common.weibo'),
"share": {
"provider": "sinaweibo"
}
......@@ -107,16 +106,16 @@
},
{
"img": "/static/app-plus/sharemenu/copyurl.png",
"text": this.$t('common').copy,
"text": this.$t('common.copy'),
"share": "copyurl"
},
{
"img": "/static/app-plus/sharemenu/more.png",
"text": this.$t('common').more,
"text": this.$t('common.more'),
"share": "shareSystem"
}
],
cancelText: this.$t('common').cancelShare,
cancelText: this.$t('common.cancelShare'),
}, e => { //callback
console.log(e);
})
......@@ -127,7 +126,7 @@
title
}) {
uni.navigateTo({
url: '/pages/common/webview/webview?url=' + url + '&title=' + title,
url: '/pages/common/webview/webview?url=' + url + '&title=' + title,
success: res => {},
fail: () => {},
complete: () => {}
......@@ -145,8 +144,9 @@
}
/* #endif */
.about {
width: 750rpx;
flex-direction: column;
flex-direction: column;
justify-content: center;
align-items: center;
}
.box {
......@@ -181,13 +181,12 @@
}
.copyright {
width: 750rpx;
font-size: 32rpx;
flex-direction: column;
justify-content: center;
align-items: center;
bottom: 20px;
left: 0;
// left: 0;
position: fixed;
}
......
......@@ -9,7 +9,7 @@ view {
.content {
padding: 0 50rpx;
width: 750rpx;
/* width: 750rpx; */
flex: 1;
}
......
......@@ -6,12 +6,12 @@
<view v-if="['apple','weixin'].includes(type)" class="quickLogin">
<image @click="quickLogin" :src="imgSrc" mode="widthFix" class="quickLoginBtn"></image>
<uni-agreements @setAgree="agree = $event"></uni-agreements>
</view>
</view>
<template v-else>
<input type="number" class="input-box" :inputBorder="false" v-model="phone" maxlength="11"
:placeholder="$t('common.phonePlaceholder')" />
<uni-agreements @setAgree="agree = $event"></uni-agreements>
<button class="get-code" :disabled="!isPhone" :type="isPhone?'primary':'default'"
<uni-agreements @setAgree="agree = $event"></uni-agreements>
<button class="get-code" :disabled="!isPhone || !agree" :type="isPhone&&agree?'primary':'default'"
@click="sendShortMsg">{{$t('login.getVerifyCode')}}</button>
<text class="tip">{{$t('login.phoneLoginTip')}}</text>
</template>
......@@ -91,7 +91,7 @@
sendShortMsg() {
if (!this.agree) {
return uni.showToast({
title: this.$t('common').noAgree,
title: this.$t('common.noAgree'),
icon: 'none'
});
}
......
......@@ -4,92 +4,113 @@
<text class="tit">{{$t('common.verifyCodePlaceholder')}}</text>
<text class="tip">{{tipText}}</text>
<uni-forms>
<!-- 登录框 (选择手机号所属国家和地区需要另行实现) -->
<uni-easyinput type="number" class="easyinput" :inputBorder="false"
v-model="code" maxlength="6" :placeholder="$t('common.verifyCodePlaceholder')">
<!-- 登录框 (选择手机号所属国家和地区需要另行实现) -->
<uni-easyinput type="number" class="easyinput" :inputBorder="false" v-model="code" maxlength="6"
:placeholder="$t('common.verifyCodePlaceholder')">
<template v-slot:right>
<uni-send-sms-code :phone="phone" ref="sendSmsCode"></uni-send-sms-code>
</template>
</uni-easyinput>
<button class="send-btn" :disabled="!canSubmit" :type="canSubmit?'primary':'default'"
@click="submit">{{$t('common.login')}}</button>
</uni-forms>
</uni-forms>
<uni-quick-login agree></uni-quick-login>
<uni-popup-captcha @confirm="submit" ref="popup-captcha" v-model="captcha" scene="loginBySms">
</uni-popup-captcha>
</view>
</template>
<script>
import mixin from '../common/login-page.mixin.js';
export default {
mixins:[mixin],
mixins: [mixin],
data() {
return {
code:'',
phone:''
code: '',
phone: '',
captcha: false
}
},
computed: {
tipText() {
return this.$t('common.verifyCodeSend')+ `${this.phone}。`;
return this.$t('common.verifyCodeSend') + `${this.phone}。`;
},
canSubmit(){
return this.code.length==6;
canSubmit() {
return this.code.length == 6;
}
},
onLoad({phoneNumber,phoneArea}) {
onLoad({
phoneNumber,
phoneArea
}) {
this.phone = phoneNumber;
},
onReady() {
if(this.phone.length==11){
if (this.phone.length == 11) {
this.$refs.sendSmsCode.start();
}
},
methods: {
async submit(){ //完成并提交
async submit() { //完成并提交
return await uniCloud.callFunction({
name:'uni-id-cf',
data:{
action:'loginBySms',
params:{
"mobile":this.phone,
"code":this.code
name: 'uni-id-cf',
data: {
action: 'loginBySms',
params: {
"mobile": this.phone,
"code": this.code,
"captcha": this.captcha
},
}
}).then(({result})=>{
if(result.code === 0){
}).then(({result}) => {
uni.showToast({
title: result.msg || result.errMsg,
icon: 'none'
});
if (result.errCode == "CAPTCHA_REQUIRED") {
return this.$refs['popup-captcha'].open()
}
if (result.code === 0) {
this.loginSuccess(result)
}else{
uni.showModal({
content: result.msg,
showCancel: false
});
}
return result
}).finally((e)=>{
console.log("e: ",e);
this.captcha = false
})
// uniCloud.callFunction({
// name:'uni-id-cf',
// data:{
// action:'loginBySms',
// params:{
// "mobile":this.phone,
// "code":this.code
// },
// },
// success: ({result}) => {
// if(result.code === 0){
// this.loginSuccess(result)
// }else{
// uni.showModal({
// content: result.msg,
// showCancel: false
// });
// }
// }
// })
/* uniCloud.callFunction({
name: 'uni-id-cf',
data: {
action: 'loginBySms',
params: {
"mobile": this.phone,
"code": this.code,
"captcha": this.captcha
},
},
success: ({
result
}) => {
uni.showToast({
title: result.msg || result.errMsg,
icon: 'none'
});
if (result.errCode == "CAPTCHA_REQUIRED") {
return this.$refs['popup-captcha'].open()
}
if (result.code === 0) {
this.loginSuccess(result)
}
},
complete: () => {
this.captcha = false
}
}) */
}
}
}
</script>
<style>
@import url("../common/login-page.css");
</style>
</style>
......@@ -4,11 +4,8 @@
<text class="title">{{$t('pwdLogin.pwdLogin')}}</text>
<input class="input-box" :inputBorder="false" v-model="username" :placeholder="$t('pwdLogin.placeholder')"/>
<input type="password" class="input-box" :inputBorder="false" v-model="password" :placeholder="$t('pwdLogin.passwordPlaceholder')"/>
<view class="captcha-box" v-if="captchaBase64">
<image class="captcha-img" @click="createCaptcha" :src="captchaBase64" mode="widthFix"></image>
<input type="text" class="input-box captcha" :inputBorder="false" v-model="captcha" :placeholder="$t('pwdLogin.verifyCodePlaceholder')"/>
</view>
<uni-agreements @setAgree="agree = $event"></uni-agreements>
<uni-captcha v-if="needCaptcha" scene="login" v-model="captcha"></uni-captcha>
<uni-agreements class="agreement" @setAgree="agree = $event"></uni-agreements>
<button class="send-btn" :disabled="!canLogin" :type="canLogin?'primary':'default'"
@click="pwdLogin">{{$t('pwdLogin.login')}}</button>
<!-- 忘记密码 -->
......@@ -28,14 +25,14 @@
return {
"password": "",
"username": "",
"agree": false,
"captchaBase64":"",
"captcha":""
"agree": false,
"captcha":'',
"needCaptcha":false
}
},
computed: {
canLogin() {
return this.username.length && this.isPwd;
return this.username.length && this.isPwd && this.agree;
},
isPwd() {
return /^.{6,20}$/.test(this.password);
......@@ -51,10 +48,6 @@
url: '../pwd-retrieve/pwd-retrieve?phoneNumber=' + (this.isPhone ? this.username : '') +
'&phoneArea=' + this.currenPhoneArea
})
// uni.redirectTo({
// url: '../pwd-retrieve/pwd-retrieve?phoneNumber=' + (this.isPhone ? this.username : '') +
// '&phoneArea=' + this.currenPhoneArea
// })
},
/**
* 密码登录
......@@ -62,12 +55,11 @@
async pwdLogin() {
if (!this.agree) {
return uni.showToast({
title: this.$t('common').noAgree,
title: this.$t('common.noAgree'),
icon: 'none'
});
}
return await uniCloud.callFunction({
name:'uni-id-cf',
data:{
action:'login',
params:{
......@@ -76,23 +68,24 @@
"captcha":this.captcha
},
},
}).then(({result}) => {
}).then(({result})=>{
console.log(result);
if (result.code === 0) {
this.loginSuccess(result)
} else {
if (result.needCaptcha) {
uni.showToast({
title: result.msg,
title: result.msg||'完成',
icon: 'none'
});
this.createCaptcha()
this.needCaptcha = true
// this.createCaptcha()
}else{
uni.showModal({
title: this.$t('common').error,
title: this.$t('common.error'),
content: result.msg,
showCancel: false,
confirmText: this.$t('common').gotIt
confirmText: this.$t('common.gotIt')
});
}
}
......@@ -101,63 +94,43 @@
console.log("res:-- ",res);
return res
})
// 下边是可以登录
// uniCloud.callFunction({
// name:'uni-id-cf',
// data:{
// action:'login',
// params:{
// "username": this.username,
// "password": this.password,
// "captcha":this.captcha
// },
// },
// success: ({result}) => {
// console.log(result);
// if (result.code === 0) {
// this.loginSuccess(result)
// } else {
// if (result.needCaptcha) {
// uni.showToast({
// title: result.msg,
// icon: 'none'
// });
// this.createCaptcha()
// }else{
// uni.showModal({
// title: this.$t('common').error,
// content: result.msg,
// showCancel: false,
// confirmText: this.$t('common').gotIt
// });
// }
// }
// }
// })
},
createCaptcha(){
uniCloud.callFunction({
name:'uni-id-cf',
data:{
action:'createCaptcha',
params:{
scene: "login"
},
},
success: ({result}) => {
if (result.code === 0) {
this.captchaBase64 = result.captchaBase64
}else{
uni.showModal({
content: result.msg,
showCancel: false
});
}
}
})
// 下边是可以登录
/* uniCloud.callFunction({
name:'uni-id-cf',
data:{
action:'login',
params:{
"username": this.username,
"password": this.password,
"captcha":this.captcha
},
},
success: ({result}) => {
console.log(result);
if (result.code === 0) {
this.loginSuccess(result)
} else {
if (result.needCaptcha) {
uni.showToast({
title: result.msg||'完成',
icon: 'none'
});
this.needCaptcha = true
// this.createCaptcha()
}else{
uni.showModal({
title: this.$t('common.error'),
content: result.msg,
showCancel: false,
confirmText: this.$t('common.gotIt')
});
}
}
}
}) */
},
/* 前往注册 */
toRegister(e) {
toRegister() {
uni.navigateTo({
url: '/pages/ucenter/login-page/register/register'
})
......@@ -166,7 +139,7 @@
}
</script>
<style>
<style lang="scss" scoped>
@import url("../common/login-page.css");
.auth-box {
......@@ -186,17 +159,8 @@
.toRegister {
margin-top: 80px;
width: 600rpx;
}
.captcha-box{
flex-direction: row;
align-items: center;
justify-content: flex-end;
}
.captcha-img{
margin: 0 15px 10px 0;
width: 250rpx;
}
.captcha{
width: 350rpx;
}
.agreement{
margin-top: 10px;
}
</style>
......@@ -2,11 +2,12 @@
<view class="content">
<!-- 顶部文字 -->
<!-- 登录框 (选择手机号所属国家和地区需要另行实现) -->
<uni-forms ref="form" :value="formData" :rules="rules">
<uni-forms ref="form" :value="formData">
<uni-forms-item name="phone">
<!-- focus规则如果上一页携带来“手机号码”数据就focus验证码输入框,否则focus手机号码输入框 -->
<uni-easyinput :disabled="lock" :focus="formData.phone.length!=11" type="number" class="easyinput" :inputBorder="false"
v-model="formData.phone" maxlength="11" :placeholder="$t('common.phonePlaceholder')"></uni-easyinput>
<uni-easyinput :disabled="lock" :focus="formData.phone.length!=11" type="number" class="easyinput"
:inputBorder="false" v-model="formData.phone" maxlength="11"
:placeholder="$t('common.phonePlaceholder')"></uni-easyinput>
</uni-forms-item>
<uni-forms-item name="code">
<uni-easyinput :focus="formData.phone.length==11" type="number" class="easyinput" :inputBorder="false"
......@@ -36,10 +37,10 @@
mixins: [mixin],
data() {
return {
lock:false,
lock: false,
formData: {
"phone": "",
"code":"",
"code": "",
'pwd': '',
'pwd2': ''
},
......@@ -69,7 +70,7 @@
pwd: {
rules: [{
required: true,
errorMessage:this.$t('common.newPasswordPlaceholder'),
errorMessage: this.$t('common.newPasswordPlaceholder'),
},
{
pattern: /^.{6,20}$/,
......@@ -80,7 +81,7 @@
pwd2: {
rules: [{
required: true,
errorMessage:this.$t('common.confirmPassword'),
errorMessage: this.$t('common.confirmPassword'),
},
{
pattern: /^.{6,20}$/,
......@@ -133,34 +134,42 @@
if (this.formData.phone) {
this.$refs.shortCode.start();
}
this.$refs.form.setRules(this.rules)
},
methods: {
/**
* 完成并提交
*/
submit() {
submit() {
console.log("formData", this.formData);
console.log('rules', this.rules);
this.$refs.form.validate()
.then( async res => {
.then(async res => {
return await uniCloud.callFunction({
name:'uni-id-cf',
data:{
action:'resetPwdBySmsCode',
params:{
name: 'uni-id-cf',
data: {
action: 'resetPwdBySmsCode',
params: {
"mobile": this.formData.phone,
"code": this.formData.code,
"password": this.formData.pwd
},
}
}).then(({result})=>{
}).then(({
result
}) => {
console.log(result);
uni.showToast({
title: result.msg||'更新成功',
title: result.msg || '更新成功',
icon: 'none'
});
if (result.code === 0) {
uni.navigateBack()
}
return result
}).catch((reason) => {
console.log(reason, 'reason----');
return reason
})
// uniCloud.callFunction({
......@@ -176,7 +185,7 @@
// success: ({result}) => {
// console.log(result);
// uni.showToast({
// title: result.msg,
// title: result.msg||'更新成功',
// icon: 'none'
// });
// if (result.code === 0) {
......@@ -192,7 +201,8 @@
<style>
@import url("../common/login-page.css");
.content{
.content {
padding-top: 36rpx;
}
</style>
</style>
......@@ -2,38 +2,55 @@
<view class="uni-container">
<uni-forms ref="form" :value="formData" :rules="rules" validate-trigger="submit" err-show-type="undertext">
<uni-forms-item name="username" required>
<uni-easyinput :inputBorder="false" class="easyinput" :placeholder="$t('register.usernamePlaceholder')" v-model="formData.username" trim="both" />
<uni-easyinput :inputBorder="false" class="easyinput" :placeholder="$t('register.usernamePlaceholder')"
v-model="formData.username" trim="both" />
</uni-forms-item>
<uni-forms-item name="nickname">
<uni-easyinput :inputBorder="false" class="easyinput" :placeholder="$t('register.nicknamePlaceholder')" v-model="formData.nickname" trim="both" style="width: 660rpx;" />
<uni-easyinput :inputBorder="false" class="easyinput" :placeholder="$t('register.nicknamePlaceholder')"
v-model="formData.nickname" trim="both" />
</uni-forms-item>
<uni-forms-item name="password" v-model="formData.password" required>
<uni-easyinput :inputBorder="false" class="easyinput" :placeholder="$t('register.passwordDigitsPlaceholder')" type="password" v-model="formData.password" trim="both" />
<uni-easyinput :inputBorder="false" class="easyinput"
:placeholder="$t('register.passwordDigitsPlaceholder')" type="password" v-model="formData.password"
trim="both" />
</uni-forms-item>
<uni-forms-item name="pwd2" v-model="formData.pwd2" required>
<uni-easyinput :inputBorder="false" class="easyinput" :placeholder="$t('register.passwordAgain')" type="password" v-model="formData.pwd2" trim="both" />
<uni-easyinput :inputBorder="false" class="easyinput" :placeholder="$t('register.passwordAgain')"
type="password" v-model="formData.pwd2" trim="both" />
</uni-forms-item>
<uni-forms-item name="captcha" required>
<uni-captcha scene="register" v-model="formData.captcha"></uni-captcha>
</uni-forms-item>
<uni-agreements @setAgree="agree = $event"></uni-agreements>
<button class="send-btn" type="primary" @click="submit">{{$t('register.registerAndLogin')}}</button>
<button class="send-btn" :disabled="!canSubmit" :type="canSubmit?'primary':'default'"
@click="submit">{{$t('register.registerAndLogin')}}</button>
</uni-forms>
</view>
</template>
<script>
import rules from './validator.js';
import mixin from '../common/login-page.mixin.js';
import rules from './validator.js';
import mixin from '../common/login-page.mixin.js';
export default {
mixins:[mixin],
mixins: [mixin],
data() {
return {
formData: {
"username": "",
"nickname": "",
'password':'',
'pwd2':''
"password": "",
"pwd2": "",
"captcha": ""
},
rules,
agree:false
agree: false,
}
},
computed: {
canSubmit() {
/* return this.formData.username.length && this.formData.password.length && this.formData.captcha.length ==
4 && this.agree */
return this.formData.username.length && this.formData.password.length && this.agree
}
},
onReady() {
......@@ -49,9 +66,9 @@ import mixin from '../common/login-page.mixin.js';
* 触发表单提交
*/
submit() {
if(!this.agree){
if (!this.agree) {
return uni.showToast({
title: this.$t('common').noAgree,
title: this.$t('common.noAgree'),
icon: 'none'
});
}
......@@ -59,9 +76,9 @@ import mixin from '../common/login-page.mixin.js';
mask: true
})
return this.$refs.form.validate().then(async(res) => {
console.log("res: ",res);
// this.submitForm(res)
let msg = await this.submitForm(res)
console.log("msg: --------------",msg);
console.log("msg: --------------", msg);
return msg
}).catch((errors) => {
console.log(errors);
......@@ -73,38 +90,42 @@ import mixin from '../common/login-page.mixin.js';
},
async submitForm(params) {
return await uniCloud.callFunction({
name:'uni-id-cf',
data:{
action:'register',
params,
},
}).then(({result}) => {
if(result.code === 0){
this.loginSuccess(result)
}else{
uni.showModal({
content: result.msg,
showCancel: false
});
}
console.log(result);
return result
})
.catch((errors) => {
console.log(errors);
return errors
})
name: 'uni-id-cf',
data: {
action: 'register',
params,
},
}).then(({
result
}) => {
if (result.code === 0) {
this.loginSuccess(result)
} else {
uni.showModal({
content: result.msg,
showCancel: false
});
}
console.log(result);
return result
})
.catch((errors) => {
console.log(errors);
return errors
})
// uniCloud.callFunction({
// name:'uni-id-cf',
// data:{
// action:'register',
// name: 'uni-id-cf',
// data: {
// action: 'register',
// params,
// },
// success: ({result}) => {
// success: ({
// result
// }) => {
// console.log(result);
// if(result.code === 0){
// if (result.code === 0) {
// this.loginSuccess(result)
// }else{
// } else {
// uni.showModal({
// content: result.msg,
// showCancel: false
......@@ -117,15 +138,18 @@ import mixin from '../common/login-page.mixin.js';
}
</script>
<style>
<style lang="scss" scoped>
@import url("../common/login-page.css");
.uni-container {
padding: 15px;
}
.send-btn{
margin-top: 5px;
.send-btn {
margin-top: 15px;
}
.uni-container ::v-deep .uni-forms-item__label{
.uni-container ::v-deep .uni-forms-item__label {
width: 15px !important;
}
</style>
</style>
<template>
<view class="content">
<!-- 功能列表 -->
<uni-list class="mt10" :border="false">
<uni-list class="mt10" :border="false">
<uni-list-item :title="$t('settings.userInfo')" to="/pages/ucenter/userinfo/userinfo" link="navigateTo"></uni-list-item>
<uni-list-item v-if="userInfo.mobile" :title="$t('settings.changePassword')" :to="'/pages/ucenter/login-page/pwd-retrieve/pwd-retrieve?phoneNumber='+ userInfo.mobile" link="navigateTo"></uni-list-item>
</uni-list>
......@@ -34,7 +34,7 @@
import pushServer from './dc-push/push.js';
import {
mapMutations,
mapGetters,
mapGetters,
mapActions
} from 'vuex';
export default {
......@@ -43,22 +43,19 @@
pushServer:pushServer,
supportMode:[],
pushIsOn:"wait",
currentLanguage:"",
uniToken:""
currentLanguage:""
}
},
computed: {
...mapGetters({
'userInfo': 'user/info',
'hasLogin': 'user/hasLogin',
}),
i18nEnable(){
return getApp({allowDefault: true}).globalData.config.i18n.enable
}),
i18nEnable(){
return getApp().globalData.config.i18n.enable
}
},
onLoad() {
this.uniToken = uni.getStorageSync('uni_id_token')
console.log("uniToken: ",this.uniToken);
this.currentLanguage = uni.getStorageSync('CURRENT_LANG') == "en"?'English':'简体中文'
uni.setNavigationBarTitle({
......@@ -87,7 +84,7 @@
methods: {
...mapActions({
logout: 'user/logout'
}),
}),
toEdit() {
uni.navigateTo({
url: '/pages/ucenter/userinfo/userinfo'
......@@ -184,28 +181,21 @@
})
},
clickLogout() {
console.log("this.hasLogin:---------------- ",this.hasLogin);
if (this.hasLogin) {
this.logout()
uni.navigateBack();
// uni.showModal({
// title: this.$t('settings.tips'),
// content: this.$t('settings.exitLogin'),
// cancelText: this.$t('settings.cancelText'),
// confirmText: this.$t('settings.confirmText'),
// success: res => {
// if (res.confirm) {
// this.logout()
// uni.navigateBack();
// }
// },
// fail: (err) => {
// console.log("err: ",err);
// },
// complete: (com) => {
// console.log("com: ",com);
// }
// });
uni.showModal({
title: this.$t('settings.tips'),
content: this.$t('settings.exitLogin'),
cancelText: this.$t('settings.cancelText'),
confirmText: this.$t('settings.confirmText'),
success: res => {
if (res.confirm) {
this.logout()
uni.navigateBack();
}
},
fail: () => {},
complete: () => {}
});
} else {
uni.navigateTo({
url: '/pages/ucenter/login-page/index/index'
......@@ -213,10 +203,10 @@
}
},
clearTmp() {
// uni.showLoading({
// title: this.$t('settings.clearing'),
// mask: true
// });
uni.showLoading({
title: this.$t('settings.clearing'),
mask: true
});
/*
任何临时存储或删除不直接影响程序运行逻辑(清除缓存必定造成业务逻辑的变化,如:打开页面的图片不从缓存中读取而从网络请求)的内容都可以视为缓存。主要有storage、和file写入。
缓存分为三部分
......@@ -265,17 +255,17 @@
if(
!res.tapIndex && language=='zh-Hans' || res.tapIndex && language=='en'
){
const globalData = getApp({allowDefault: true}).globalData
const globalData = getApp().globalData
if (language === 'en') {
language = globalData.locale = 'zh-Hans'
} else {
language = globalData.locale = 'en'
}
uni.setStorageSync('CURRENT_LANG', language)
getApp({allowDefault: true}).globalData.$i18n.locale = language
this.currentLanguage = res.tapIndex?'简体中文':'English'
if(uni.setLocale){
uni.setLocale(language)
getApp().globalData.$i18n.locale = language
this.currentLanguage = res.tapIndex?'简体中文':'English'
if(uni.setLocale){
uni.setLocale(language)
}
uni.reLaunch({
url: '/pages/list/list',
......
......@@ -5,7 +5,7 @@ describe('pages/ucenter/ucenter.vue', () => {
page = await program.switchTab('/pages/ucenter/ucenter')
await page.waitFor(300)
})
it('宫格', async () => {
const getGrid = await page.data('gridList')
// console.log("getGrid: ",getGrid);
......@@ -19,10 +19,11 @@ describe('pages/ucenter/ucenter.vue', () => {
})
it('普通签到', async () => {
/* it('普通签到', async () => {
console.log("process.env.UNI_PLATFORM: ",process.env.UNI_PLATFORM);
if (process.env.UNI_PLATFORM === "h5" || process.env.UNI_PLATFORM === "mp-weixin") {
console.log('mp-h5');
await page.callMethod('signIn')
await page.waitFor(300)
await program.screenshot({
......@@ -32,6 +33,7 @@ describe('pages/ucenter/ucenter.vue', () => {
if (process.env.UNI_PLATFORM === "app-plus") {
console.log('app');
const signInByAdRes = await page.callMethod('signInByAd')
await page.waitFor(300)
......@@ -43,7 +45,7 @@ describe('pages/ucenter/ucenter.vue', () => {
})
}
})
}) */
it('我的积分', async () => {
// expect.assertions(1);
......@@ -53,12 +55,11 @@ describe('pages/ucenter/ucenter.vue', () => {
console.log("getScoreRes: ", getScoreRes);
if (getScoreRes) {
console.log("今日已签到");
expect(getScoreRes.score).not.toBeUndefined();
expect(getScoreRes.balance).toBeGreaterThanOrEqual(getScoreRes.score);
// expect(getScoreRes.score).not.toBeUndefined();
// expect(getScoreRes.balance).toBeGreaterThanOrEqual(getScoreRes.score);
} else {
console.log("签到失败");
}
})
})
......@@ -2,7 +2,8 @@
<view class="center">
<uni-sign-in ref="signIn"></uni-sign-in>
<view class="userInfo" @click.capture="toUserInfo">
<cloud-image width="150rpx" height="150rpx" v-if="userInfo.avatar_file&&userInfo.avatar_file.url" :src="userInfo.avatar_file.url"></cloud-image>
<cloud-image width="150rpx" height="150rpx" v-if="userInfo.avatar_file&&userInfo.avatar_file.url"
:src="userInfo.avatar_file.url"></cloud-image>
<image v-else class="logo-img" src="@/static/uni-center/defaultAvatarUrl.png"></image>
<view class="logo-title">
<text class="uer-name" v-if="hasLogin">{{userInfo.nickname||userInfo.username||userInfo.mobile}}</text>
......@@ -37,16 +38,18 @@
} from 'vuex';
import checkUpdate from '@/uni_modules/uni-upgrade-center-app/utils/check-update';
import callCheckVersion from '@/uni_modules/uni-upgrade-center-app/utils/call-check-version';
// #ifdef APP-PLUS
// #ifdef APP
import UniShare from '@/uni_modules/uni-share/js_sdk/uni-share.js';
const uniShare = new UniShare()
// #endif
const db = uniCloud.database();
export default {
// #ifdef APP-PLUS
onBackPress({from}) {
if(from=='backbutton'){
this.$nextTick(function(){
// #ifdef APP
onBackPress({
from
}) {
if (from == 'backbutton') {
this.$nextTick(function() {
uniShare.hide()
})
return uniShare.isShow;
......@@ -94,7 +97,7 @@
},
//#endif
{
"title":this.$t('mine.readArticles'),
"title": this.$t('mine.readArticles'),
"to": '/pages/ucenter/read-news-log/read-news-log',
"icon": "flag"
},
......@@ -136,28 +139,22 @@
"style": "solid", // 边框样式
"radius": "100%" // 边框圆角,支持百分比
}
},
uniToken:""
}
}
},
async onLoad() {
// const loginRes = await pwdLogin()
// console.log(loginRes,'-------------');
// this.uniToken = loginRes.token
onLoad() {
this.uniToken = uni.getStorageSync('uni_id_token')
console.log("uniToken: ", this.uniToken);
// console.log(313,this.userInfo,this.hasLogin);
//#ifdef APP-PLUS
console.log(this.appVersion,"this.appVersion--------");
this.ucenterList[this.ucenterList.length - 2].unshift({
title:this.$t('mine.checkUpdate'),// this.this.$t('mine.checkUpdate')"检查更新"
title: this.$t('mine.checkUpdate'), // this.this.$t('mine.checkUpdate')"检查更新"
rightText: this.appVersion.version + '-' + this.appVersion.versionCode,
event: 'checkVersion',
icon: 'loop',
showBadge: this.appVersion.hasNew
})
//#endif
this.uniToken = uni.getStorageSync('uni_id_token')
console.log("uniToken: ",this.uniToken);
},
computed: {
...mapGetters({
......@@ -167,7 +164,7 @@
// #ifdef APP-PLUS
,
appVersion() {
return getApp({allowDefault: true}).appVersion
return getApp().appVersion
}
// #endif
,
......@@ -187,7 +184,7 @@
signIn() { //普通签到
this.$refs.signIn.open()
},
signInByAd(){ //看激励视频广告签到
signInByAd() { //看激励视频广告签到
this.$refs.signIn.showRewardedVideoAd()
},
/**
......@@ -218,7 +215,7 @@
tapGrid(index) {
uni.showToast({
// title: '你点击了,第' + (index + 1) + '个',
title: this.$t('mine.clicked') + " " + (index + 1) ,
title: this.$t('mine.clicked') + " " + (index + 1),
icon: 'none'
});
},
......@@ -246,14 +243,13 @@
* 获取积分信息
*/
async getScore() {
console.log("this.userInfo:------------- ",this.userInfo);
if (!this.userInfo) return uni.showToast({
title: this.$t('mine.checkScore'),
icon: 'none'
});
// uni.showLoading({
// mask: true
// })
uni.showLoading({
mask: true
})
return await db.collection("uni-id-scores")
.where('"user_id" == $env.uid')
.field('score,balance')
......@@ -261,23 +257,21 @@
.limit(1)
.get()
.then((res) => {
console.log(res,"res------");
console.log(res);
const data = res.result.data[0];
console.log("data: ",data);
let msg = '';
msg = data ? (this.$t('mine.currentScore')+ data.balance) : this.$t('mine.noScore');
msg = data ? (this.$t('mine.currentScore') + data.balance) : this.$t('mine.noScore');
uni.showToast({
title: msg,
icon: 'none'
});
console.log("msg:---- ",msg);
return data
}).catch((reason)=>{
console.log(reason,'这是失败的操作');
}).catch((reason) => {
console.log(reason, '这是失败的操作');
return reason
}).finally((e)=>{
console.log("e:----- ",e);
// uni.hideLoading()
}).finally((e) => {
uni.hideLoading()
console.log("e: ", e);
return e
})
},
......@@ -312,7 +306,7 @@
},
menus: [{
"img": "/static/app-plus/sharemenu/wechatfriend.png",
"text": this.$t('common').wechatFriends,
"text": this.$t('common.wechatFriends'),
"share": {
"provider": "weixin",
"scene": "WXSceneSession"
......@@ -320,7 +314,7 @@
},
{
"img": "/static/app-plus/sharemenu/wechatmoments.png",
"text": this.$t('common').wechatBbs,
"text": this.$t('common.wechatBbs'),
"share": {
"provider": "weixin",
"scene": "WXSceneTimeline"
......@@ -328,7 +322,7 @@
},
{
"img": "/static/app-plus/sharemenu/weibo.png",
"text": this.$t('common').weibo,
"text": this.$t('common.weibo'),
"share": {
"provider": "sinaweibo"
}
......@@ -342,16 +336,16 @@
},
{
"img": "/static/app-plus/sharemenu/copyurl.png",
"text": this.$t('common').copy,
"text": this.$t('common.copy'),
"share": "copyurl"
},
{
"img": "/static/app-plus/sharemenu/more.png",
"text": this.$t('common').more,
"text": this.$t('common.more'),
"share": "shareSystem"
}
],
cancelText: this.$t('common').cancelShare,
cancelText: this.$t('common.cancelShare'),
}, e => { //callback
console.log(e);
})
......@@ -372,6 +366,7 @@
page {
background-color: #f8f8f8;
}
/* #endif*/
.center {
......@@ -381,7 +376,6 @@
}
.userInfo {
width: 750rpx;
padding: 20rpx;
padding-top: 50px;
background-image: url(../../static/uni-center/headers.png);
......@@ -426,7 +420,7 @@
}
.uni-grid .text {
font-size: 30rpx;
font-size: 16px;
height: 25px;
line-height: 25px;
color: #817f82;
......@@ -474,4 +468,4 @@
/* #endif */
background-color: #DD524D;
}
</style>
\ No newline at end of file
</style>
<template>
<view class="box">
<view class="uni-content">
<!-- 登录框 (选择手机号所属国家和地区需要另行实现) -->
<uni-easyinput clearable focus type="number" class="input-box" :inputBorder="false" v-model="formData.phone"
maxlength="11" :placeholder="$t('common.phonePlaceholder')"></uni-easyinput>
<uni-easyinput clearable focus type="number" class="input-box" :inputBorder="false" v-model="formData.mobile"
maxlength="11" placeholder="请输入手机号"></uni-easyinput>
<uni-easyinput clearable type="number" class="input-box" :inputBorder="false" v-model="formData.code"
maxlength="6" :placeholder="$t('common.verifyCodePlaceholder')">
<template v-slot:right>
<uni-send-sms-code ref="shortCode" code-type="bind" :phone="formData.phone"></uni-send-sms-code>
<uni-send-sms-code ref="shortCode" code-type="bind" :phone="formData.mobile"></uni-send-sms-code>
</template>
</uni-easyinput>
<button class="send-btn-box" :disabled="!canSubmit" :type="canSubmit?'primary':'default'"
@click="submit">{{$t('common.submit')}}</button>
<button class="uni-btn send-btn-box" :disabled="!canSubmit" :type="canSubmit?'primary':'default'"
@click="submit">提交</button>
<uni-popup-captcha ref="popup-captcha" @confirm="submit" v-model="formData.captcha" scene="bindMobileBySms">
</uni-popup-captcha>
</view>
</template>
<script>
......@@ -23,26 +25,22 @@
return {
currenPhoneArea: '',
formData: {
phone:"",
code:""
phone: "",
code: "",
captcha: false
}
}
},
computed: {
tipText() {
return this.$t('common.verifyCodeSend')+ `${this.currenPhoneArea} ${this.formData.phone}。` + this.$t('common.passwordDigits')
return "验证码已通过短信发送至" + `${this.currenPhoneArea} ${this.formData.mobile}。` + "密码为6 - 20位"
},
canSubmit() {
return true//this.isPhone() && this.isCode();
return this.isPhone() && this.isCode();
}
},
onLoad(event) {
uni.setNavigationBarTitle({
title:this.$t('bindMobile.navigationBarTitle')
})
},
onReady() {
},
onLoad(event) {},
onReady() {},
methods: {
...mapMutations({
setUserInfo: 'user/login'
......@@ -53,54 +51,80 @@
async submit() {
console.log(this.formData);
return await uniCloud.callFunction({
name:'uni-id-cf',
name: 'uni-id-cf',
data: {
action: 'bindMobileBySms',
params: {
"mobile": this.formData.phone,
"code": this.formData.code
},
}
params: this.formData
},
}).then(({result})=>{
console.log(result);
this.setUserInfo({"mobile":result.mobile})
uni.showToast({
title: result.msg||'完成',
title: result.msg || result.errMsg,
icon: 'none'
});
if (result.errCode == "CAPTCHA_REQUIRED") {
return this.$refs['popup-captcha'].open()
}
if (result.code === 0) {
this.setUserInfo({
"mobile": result.mobile
})
uni.navigateBack()
}
return result
}).catch((reason)=>{
console.log(reason,'reason----');
return reason
}).catch((reason)=>{
console.log(reason,'reason----');
return reason
})
// uniCloud.callFunction({
// name:'uni-id-cf',
// data:{
// action:'bindMobileBySms',
// params:{
// "mobile": this.formData.phone,
// "code": this.formData.code
// },
// },
// success: ({result}) => {
// console.log(result);
// this.setUserInfo({"mobile":result.mobile})
// uni.showToast({
// title: result.msg,
// icon: 'none'
// });
// if (result.code === 0) {
// uni.navigateBack()
// }
// }
// })
/* uniCloud.callFunction({
name: 'uni-id-cf',
data: {
action: 'bindMobileBySms',
params: this.formData
},
success: ({result}) => {
console.log(result);
uni.showToast({
title: result.msg || result.errMsg,
icon: 'none'
});
if (result.errCode == "CAPTCHA_REQUIRED") {
return this.$refs['popup-captcha'].open()
}
if (result.code === 0) {
this.setUserInfo({
"mobile": result.mobile
})
uni.navigateBack()
}
},
complete: () => {
this.formData.captcha = false
}
}) */
/*
const uniIdCo = uniCloud.importObject("uni-id-co")
uniIdCo.bindMobileBySms(this.formData).then(e => {
console.log(e);
uni.showToast({
title: e.errMsg,
icon: 'none'
});
uni.navigateBack()
}).catch(e => {
if( e.errCode == 'CAPTCHA_REQUIRED'){
this.$refs.popup.open()
}
}).finally(e=>{
this.formData.captcha = false
})
*/
},
isPhone() {
let reg_phone = /^1\d{10}$/;
let isPhone = reg_phone.test(this.formData.phone);
let isPhone = reg_phone.test(this.formData.mobile);
return isPhone;
},
isCode() {
......@@ -113,17 +137,18 @@
</script>
<style>
.box {
.uni-content {
padding: 0;
align-items: center;
justify-content: center;
padding: 50rpx;
padding-top: 10px;
}
/* #ifndef APP-NVUE || VUE3 */
.box /deep/ .uni-easyinput__content {
height: 50px;
}
/* #endif */
/* #ifndef APP-NVUE || VUE3 */
.uni-content /deep/ .uni-easyinput__content {}
/* #endif */
.input-box {
width: 100%;
margin-top: 16px;
......@@ -131,10 +156,10 @@
border-radius: 6rpx;
flex-direction: row;
flex-wrap: nowrap;
margin-bottom: 10px;
}
.send-btn-box {
width: 650rpx;
margin-top: 15px;
}
</style>
</style>
......@@ -6,21 +6,21 @@
<view class="item">
<text>{{$t('userinfo.ProfilePhoto')}}</text>
<cloud-image @click="uploadAvatarImg" v-if="avatar_file" :src="avatar_file.url" width="50px" height="50px"></cloud-image>
<uni-icons @click="uploadAvatarImg" v-else class="chooseAvatar" type="plusempty" size="30" color="#dddddd"></uni-icons>
<uni-icons @click="uploadAvatarImg" v-else class="chooseAvatar" type="plusempty" size="30" color="#dddddd"></uni-icons>
</view>
</template>
</uni-list-item>
<uni-list-item class="item" @click="setNickname('')" :title="$t('userinfo.nickname')" :rightText="userInfo.nickname||$t('userinfo.notSet')" link>
</uni-list-item>
<uni-list-item class="item" @click="bindMobile" :title="$t('userinfo.phoneNumber')" :rightText="userInfo.mobile||$t('userinfo.notSpecified')" link>
</uni-list-item>
</uni-list>
<uni-list-item class="item" @click="bindMobile" :title="$t('userinfo.phoneNumber')" :rightText="userInfo.mobile||$t('userinfo.notSpecified')" link>
</uni-list-item>
</uni-list>
<uni-popup ref="dialog" type="dialog">
<uni-popup-dialog mode="input" :value="userInfo.nickname" @confirm="setNickname" :title="$t('userinfo.setNickname')"
:placeholder="$t('userinfo.setNicknamePlaceholder')">
</uni-popup-dialog>
</uni-popup>
<uni-bindMobileByMpWeixin ref="uni-bindMobileByMpWeixin"></uni-bindMobileByMpWeixin>
</uni-popup>
<uni-bindMobileByMpWeixin ref="uni-bindMobileByMpWeixin"></uni-bindMobileByMpWeixin>
</view>
</template>
<script>
......@@ -40,15 +40,13 @@
otherLoginButton: {
"title": "其他号码绑定",
}
},
uniToken:''
}
}
},
},
onLoad() {
this.uniToken = uni.getStorageSync('uni_id_token')
console.log("uniToken: ",this.uniToken);
this.univerifyStyle.authButton.title = this.$t('userinfo.bindPhoneNumber')
console.log("uniToken: ",this.uniToken);
this.univerifyStyle.authButton.title = this.$t('userinfo.bindPhoneNumber')
this.univerifyStyle.otherLoginButton.title = this.$t('userinfo.bindOtherLogin')
uni.setNavigationBarTitle({
title: this.$t('userinfo.navigationBarTitle')
......@@ -58,17 +56,17 @@
...mapGetters({
userInfo: 'user/info',
login: 'user/hasLogin'
}),
}),
avatar_file() {
if (this.userInfo.avatar_file && this.userInfo.avatar_file.url) {
if (this.userInfo.avatar_file && this.userInfo.avatar_file.url) {
return this.userInfo.avatar_file
}
}
},
methods: {
},
methods: {
...mapMutations({
setUserInfo: 'user/login'
}),
}),
bindMobile() {
// #ifdef APP-PLUS
uni.preLogin({
......@@ -80,13 +78,13 @@
this.bindMobileBySmsCode()
}
})
// #endif
// #endif
// #ifdef MP-WEIXIN
this.$refs['uni-bindMobileByMpWeixin'].open()
// #endif
// #ifdef MP-WEIXIN
this.$refs['uni-bindMobileByMpWeixin'].open()
// #endif
// #ifdef H5
// #ifdef H5
//...去用验证码绑定
this.bindMobileBySmsCode()
// #endif
......@@ -132,40 +130,34 @@
}
})
},
bindMobileBySmsCode() {
bindMobileBySmsCode() {
uni.navigateTo({
url: '/pages/ucenter/userinfo/bind-mobile/bind-mobile',
complete: (res) => {
console.log("res: ",res);
}
url: '/pages/ucenter/userinfo/bind-mobile/bind-mobile'
})
},
async setNickname(nickname) {
console.log(nickname);
if (nickname) {
return await usersTable.where('_id==$env.uid').update({
nickname
}).then(e => {
console.log(e.result,"e.result---------");
return await usersTable.where('_id==$env.uid').update({nickname}).then(e => {
console.log(e);
if (e.result.updated) {
// uni.showToast({
// title:this.$t('common.updateSucceeded'),
// icon: 'none'
// });
uni.showToast({
title:this.$t('common.updateSucceeded'),
icon: 'none'
});
this.setUserInfo({
nickname
});
} else {
// uni.showToast({
// title: this.$t('userinfo.noChange'),
// icon: 'none'
// });
uni.showToast({
title: this.$t('userinfo.noChange'),
icon: 'none'
});
}
return e.result
})
.catch((reason)=>{
console.log(reason,'reason----');
return reason
}).catch((reason)=>{
console.log(reason,'reason----');
return reason
})
this.$refs.dialog.close()
} else {
......@@ -287,10 +279,10 @@
.chooseAvatar {
border: dotted 1px #ddd;
border-radius: 10px;
border-radius: 10px;
text-align: center;
width: 50px;
height: 50px;
line-height: 50px;
}
</style>
</style>
static/screenshot/about-app.png

110.6 KB | W: | H:

static/screenshot/about-app.png

91.3 KB | W: | H:

static/screenshot/about-app.png
static/screenshot/about-app.png
static/screenshot/about-app.png
static/screenshot/about-app.png
  • 2-up
  • Swipe
  • Onion skin
static/screenshot/about-h5.png

61.9 KB | W: | H:

static/screenshot/about-h5.png

55.8 KB | W: | H:

static/screenshot/about-h5.png
static/screenshot/about-h5.png
static/screenshot/about-h5.png
static/screenshot/about-h5.png
  • 2-up
  • Swipe
  • Onion skin
static/screenshot/sign-h5.png

88.1 KB | W: | H:

static/screenshot/sign-h5.png

76.5 KB | W: | H:

static/screenshot/sign-h5.png
static/screenshot/sign-h5.png
static/screenshot/sign-h5.png
static/screenshot/sign-h5.png
  • 2-up
  • Swipe
  • Onion skin
static/uni-center/headers.png

27.1 KB | W: | H:

static/uni-center/headers.png

32.3 KB | W: | H:

static/uni-center/headers.png
static/uni-center/headers.png
static/uni-center/headers.png
static/uni-center/headers.png
  • 2-up
  • Swipe
  • Onion skin
//这是应用的配置页面,App.vue挂载到getApp().globalData.config
export default {
//是否打开调试模式
"debug":false,
"h5": {
"url": "https://uni-starter.dcloud.net.cn", // 前端网页托管的域名
// 在h5端全局悬浮引导用户下载app的功能 更多自定义要求在/common/openApp.js中修改
// 在h5端全局悬浮引导用户下载app的功能 更多自定义要求在/common/openApp.js中修改
// "openApp": { //如不需要本功能直接移除本节点即可
// //点击悬浮下载栏后打开的网页链接
// "openUrl": '/#/pages/ucenter/invite/invite',
......@@ -28,11 +30,10 @@ export default {
2.visitor:白名单模式。枚举游客可访问的页面。
* 注意:黑名单与白名单模式二选一
*/
"needLogin": [{
pattern: /^\/pages\/list.*/
}, //支持正则表达式
// "/uni_modules/uni-news-favorite/pages/uni-news-favorite/list",
// "/uni_modules/uni-feedback/pages/uni-feedback/add"
"needLogin" : [
{pattern:/^\/pages\/list.*/}, //支持正则表达式
// "/uni_modules/uni-news-favorite/pages/uni-news-favorite/list",
// "/uni_modules/uni-feedback/pages/uni-feedback/add"
],
// "visitor" : [
// "/",//注意入口页必须直接写 "/"
......@@ -44,14 +45,12 @@ export default {
// "/pages/ucenter/about/about",
// "/pages/ucenter/settings/settings"
// ],
/*
login:配置登录类型与优先级
未列举到的,或设备环境不支持的选项,将被隐藏。如果你需要在不同平台有不同的配置,直接用条件编译即可
根据数组的第0项,决定登录方式的第一优先级。
*/
"login": ["username", "univerify", "weixin", "smsCode", "apple"],
// "login": ["univerify"]
},
//关于应用
"about": {
......@@ -65,30 +64,30 @@ export default {
"slogan": "云端一体应用快速开发模版",
//政策协议
"agreements": [{
"title": "用户服务条款", // 为了多语言国际化请在 lang/en.js 和 lang/zh-Hans.js中配置",
"title": "用户服务协议", //如果开启了多语言国际化,本配置将失效。请在 lang/en.js 和 lang/zh-Hans.js中配置
"url": "https://ask.dcloud.net.cn/protocol.html" //对应的网络链接
},
{
"title": "隐私政策", //为了多语言国际化请在 lang/en.js 和 lang/zh-Hans.js中配置
"url": "https://ask.dcloud.net.cn/protocol.html"
"title": "隐私政策", //如果开启了多语言国际化,本配置将失效。请在 lang/en.js 和 lang/zh-Hans.js中配置
"url": "https://ask.dcloud.net.cn/protocol.html" //对应的网络链接
}
],
//应用的链接,用于分享到第三方平台和生成关于我们页的二维码
"download": "",
//version
"version": "1.0.0" //用于非app端显示,app端自动获取
"version":"1.0.0" //用于非app端显示,app端自动获取
},
"download": { //用于生成二合一下载页面
"ios": "https://itunes.apple.com/cn/app/hello-uni-app/id1417078253?mt=8",
"android": "https://vkceyugu.cdn.bspapp.com/VKCEYUGU-97fca9f2-41f6-449f-a35e-3f135d4c3875/6d754387-a6c3-48ed-8ad2-e8f39b40fc01.apk"
"download":{ //用于生成二合一下载页面
"ios":"https://itunes.apple.com/cn/app/hello-uni-app/id1417078253?mt=8",
"android":"https://vkceyugu.cdn.bspapp.com/VKCEYUGU-97fca9f2-41f6-449f-a35e-3f135d4c3875/6d754387-a6c3-48ed-8ad2-e8f39b40fc01.apk"
},
//用于打开应用市场评分界面
"marketId": {
"ios": "id1417078253",
"android": "123456"
"marketId":{
"ios":"id1417078253",
"android":"123456"
},
//配置多语言国际化。i18n为英文单词 internationalization的首末字符i和n,18为中间的字符数 是“国际化”的简称
"i18n": {
"enable": false //默认关闭,国际化。如果你想使用国际化相关功能,请改为true
"i18n":{
"enable":false //默认关闭,国际化。如果你想使用国际化相关功能,请改为true
}
}
}
\ No newline at end of file
## 1.2.0(2021-11-19)
- 优化 组件UI,并提供设计资源,详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移,详见:[https://uniapp.dcloud.io/component/uniui/uni-badge](https://uniapp.dcloud.io/component/uniui/uni-badge)
## 1.1.7(2021-11-08)
- 优化 升级ui
- 修改 size 属性默认值调整为 small
- 修改 type 属性,默认值调整为 error,info 替换 default
## 1.1.6(2021-09-22)
- 修复 在字节小程序上样式不生效的 bug
## 1.1.5(2021-07-30)
......
......@@ -2,8 +2,7 @@
<view class="uni-badge--x">
<slot />
<text v-if="text" :class="classNames" :style="[badgeWidth, positionStyle, customStyle, dotStyle]"
class="uni-badge"
@click="onClick()">{{displayValue}}</text>
class="uni-badge" @click="onClick()">{{displayValue}}</text>
</view>
</template>
......@@ -13,26 +12,33 @@
* @description 数字角标一般和其它控件(列表、9宫格等)配合使用,用于进行数量提示,默认为实心灰色背景
* @tutorial https://ext.dcloud.net.cn/plugin?id=21
* @property {String} text 角标内容
* @property {String} type = [default|primary|success|warning|error] 颜色类型
* @value default 灰色
* @property {String} size = [normal|small] 角标内容
* @property {String} type = [info|primary|success|warning|error] 颜色类型
* @value info 灰色
* @value primary 蓝色
* @value success 绿色
* @value warning 黄色
* @value error 红色
* @property {String} size = [normal|small] Badge 大小
* @value normal 一般尺寸
* @value small 小尺寸
* @property {String} inverted = [true|false] 是否无需背景颜色
* @property {Number} maxNum 展示封顶的数字值,超过 99 显示 99+
* @property {String} absolute = [rightTop|rightBottom|leftBottom|leftTop] 开启绝对定位, 角标将定位到其包裹的标签的四角上
* @value rightTop 右上
* @value rightBottom 右下
* @value leftTop 左上
* @value leftBottom 左下
* @property {Array[number]} offset 距定位角中心点的偏移量,只有存在 absolute 属性时有效,例如:[-10, -10] 表示向外偏移 10px,[10, 10] 表示向 absolute 指定的内偏移 10px
* @property {String} isDot = [true|false] 是否显示为一个小点
* @event {Function} click 点击 Badge 触发事件
* @example <uni-badge text="1"></uni-badge>
*/
export default {
name: 'UniBadge',
emits:['click'],
emits: ['click'],
props: {
type: {
type: String,
default: 'default'
default: 'error'
},
inverted: {
type: Boolean,
......@@ -62,7 +68,7 @@
},
size: {
type: String,
default: 'normal'
default: 'small'
},
customStyle: {
type: Object,
......@@ -136,10 +142,14 @@
height: '10px',
borderRadius: '10px'
}
},
displayValue() {
const { isDot, text, maxNum } = this
return isDot ? '' : (Number(text) > maxNum ? `${maxNum}+` : text)
},
displayValue() {
const {
isDot,
text,
maxNum
} = this
return isDot ? '' : (Number(text) > maxNum ? `${maxNum}+` : text)
}
},
methods: {
......@@ -151,9 +161,15 @@
</script>
<style lang="scss" scoped>
$uni-primary: #2979ff !default;
$uni-success: #4cd964 !default;
$uni-warning: #f0ad4e !default;
$uni-error: #dd524d !default;
$uni-info: #909399 !default;
$bage-size: 12px;
$bage-small: scale(0.8);
$bage-height: 20px;
.uni-badge--x {
/* #ifdef APP-NVUE */
......@@ -169,6 +185,11 @@
position: absolute;
}
.uni-badge--small {
transform: $bage-small;
transform-origin: center center;
}
.uni-badge {
/* #ifndef APP-NVUE */
display: flex;
......@@ -177,77 +198,71 @@
/* #endif */
justify-content: center;
flex-direction: row;
height: $bage-height;
line-height: $bage-height;
color: $uni-text-color;
height: 20px;
line-height: 18px;
color: #fff;
border-radius: 100px;
background-color: $uni-bg-color-hover;
background-color: $uni-info;
background-color: transparent;
border: 1px solid #fff;
text-align: center;
font-family: 'Helvetica Neue', Helvetica, sans-serif;
font-size: $bage-size;
/* #ifdef H5 */
z-index: 999;
cursor: pointer;
/* #endif */
}
.uni-badge--inverted {
padding: 0 5px 0 0;
color: $uni-bg-color-hover;
}
&--info {
color: #fff;
background-color: $uni-info;
}
.uni-badge--default {
color: $uni-text-color;
background-color: $uni-bg-color-hover;
}
&--primary {
background-color: $uni-primary;
}
.uni-badge--default-inverted {
color: $uni-text-color-grey;
background-color: transparent;
}
&--success {
background-color: $uni-success;
}
.uni-badge--primary {
color: $uni-text-color-inverse;
background-color: $uni-color-primary;
}
&--warning {
background-color: $uni-warning;
}
.uni-badge--primary-inverted {
color: $uni-color-primary;
background-color: transparent;
}
&--error {
background-color: $uni-error;
}
.uni-badge--success {
color: $uni-text-color-inverse;
background-color: $uni-color-success;
}
&--inverted {
padding: 0 5px 0 0;
color: $uni-info;
}
.uni-badge--success-inverted {
color: $uni-color-success;
background-color: transparent;
}
&--info-inverted {
color: $uni-info;
background-color: transparent;
}
.uni-badge--warning {
color: $uni-text-color-inverse;
background-color: $uni-color-warning;
}
&--primary-inverted {
color: $uni-primary;
background-color: transparent;
}
.uni-badge--warning-inverted {
color: $uni-color-warning;
background-color: transparent;
}
&--success-inverted {
color: $uni-success;
background-color: transparent;
}
.uni-badge--error {
color: $uni-text-color-inverse;
background-color: $uni-color-error;
}
&--warning-inverted {
color: $uni-warning;
background-color: transparent;
}
.uni-badge--error-inverted {
color: $uni-color-error;
background-color: transparent;
}
&--error-inverted {
color: $uni-error;
background-color: transparent;
}
.uni-badge--small {
transform: $bage-small;
transform-origin: center center;
}
</style>
{
"id": "uni-badge",
"displayName": "uni-badge 数字角标",
"version": "1.1.6",
"version": "1.2.0",
"description": "数字角标(徽章)组件,在元素周围展示消息提醒,一般用于列表、九宫格、按钮等地方。",
"keywords": [
"",
......
## Badge 数字角标
> **组件名:uni-badge**
> 代码块: `uBadge`
数字角标一般和其它控件(列表、9宫格等)配合使用,用于进行数量提示,默认为实心灰色背景,
### 安装方式
本组件符合[easycom](https://uniapp.dcloud.io/collocation/pages?id=easycom)规范,`HBuilderX 2.5.5`起,只需将本组件导入项目,在页面`template`中即可直接使用,无需在页面中`import`和注册`components`
如需通过`npm`方式使用`uni-ui`组件,另见文档:[https://ext.dcloud.net.cn/plugin?id=55](https://ext.dcloud.net.cn/plugin?id=55)
### 基本用法
``template`` 中使用组件
```html
<uni-badge size="small" :text="100" absolute="rightBottom" type="primary">
<button type="default">右上</button>
</uni-badge>
<uni-badge text="1"></uni-badge>
<uni-badge text="2" type="purple" @click="bindClick"></uni-badge>
<uni-badge text="3" type="primary" :inverted="true"></uni-badge>
```
## API
### Badge Props
|属性名 |类型 |默认值 |说明 |
|:-: |:-: |:-: |:-: |
|text |String |- |角标内容 |
|type |String |default|颜色类型,可选值:default(灰色)、primary(蓝色)、success(绿色)、warning(黄色)、error(红色)|
|size |String |normal |Badge 大小,可取值:normal、small |
|is-dot |Boolean|false |不展示数字,只有一个小点 |
|max-num |String/Numbuer|99 |展示封顶的数字值,超过 99 显示99+ |
|custom-style |Object | {} |自定义 Badge 样式, 样式对象语法 |
|inverted |Boolean|false |是否无需背景颜色,为 true 时,背景颜色将变为文字的字体颜色 |
|absolute (不支持 nvue) |String| rightTop|开启绝对定位, 角标将定位到其包裹的标签的四个角上,可选值: rightTop(右上角)、rightBottom(右下角)、leftBottom(左下角) 、leftTop(左上角) |
|offset |Array[number]| [0, 0]|距定位角中心点的偏移量,[-10, -10] 表示向 absolute 指定的方向偏移 10px,[10, 10] 表示向 absolute 指定的反方向偏移 10px,只有存在 absolute 属性时有效,与absolute 的值一一对应(例如:值为rightTop, 对应 offset 为 [right, Top])|
### Badge Events
|事件名 |事件说明 |返回参数 |
|:-: |:-: |:-: |
|@click |点击 Badge 触发事件| - |
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-badge)
#### 如使用过程中有任何问题,或者您对uni-ui有一些好的建议,欢迎加入 uni-ui 交流群:871950839
## 组件示例
点击查看:[https://hellouniapp.dcloud.net.cn/pages/extUI/badge/badge](https://hellouniapp.dcloud.net.cn/pages/extUI/badge/badge)
\ No newline at end of file
## 1.4.5(2022-02-25)
- 修复 条件编译 nvue 不支持的 css 样式
## 1.4.4(2022-02-25)
- 修复 条件编译 nvue 不支持的 css 样式
## 1.4.3(2021-09-22)
- 修复 startDate、 endDate 属性失效的 bug
## 1.4.2(2021-08-24)
......
......@@ -388,14 +388,17 @@
}
.uni-calendar--fixed {
position: fixed;
bottom: calc(var(--window-bottom));
position: fixed;
/* #ifdef APP-NVUE */
bottom: 0;
/* #endif */
left: 0;
right: 0;
transition-property: transform;
transition-duration: 0.3s;
transform: translateY(460px);
/* #ifndef APP-NVUE */
/* #ifndef APP-NVUE */
bottom: calc(var(--window-bottom));
z-index: 99;
/* #endif */
}
......
{
"id": "uni-calendar",
"displayName": "uni-calendar 日历",
"version": "1.4.3",
"version": "1.4.5",
"description": "日历组件",
"keywords": [
"uni-ui",
......
## 0.1.1(2021-03-04)
- refresh不再读取上一条验证码状态
## 0.6.0(2022-05-27)
- 新增:支持在`uni-config-center`中根据场景值配置
- 修复:弹窗式验证码,输入内容后点击取消,重新打开验证码的值仍然存在的问题
## 0.5.2(2022-05-19)
- 修复在Vue3的兼容问题
## 0.5.1(2022-05-18)
- 修复在某些情况下微信小程序端验证码显示错误的问题
## 0.5.0(2022-05-17)
- 新增支持在`uni-captcha-co`->`config`配置验证码
## 0.4.1(2022-05-16)
- 新增示例项目
## 0.4.0(2022-05-16)
- 集成创建、刷新、显示验证码的云端一体验证码组件
- 云对象`uni-captcha-co`集成获取验证码的api,`getImageCaptcha`
## 0.3.1(2022-05-13)
- 新增 返回值符合响应体规范
## 0.3.0(2022-05-13)
- 新增 支持 uni-config-center 配置
## 0.2.2(2022-04-25)
- 修复 0.2.1 版本引起的使用 image 组件验证码不显示的Bug
## 0.2.1(2022-04-18)
- 更新 优化字体
## 0.2.0(2022-04-14)
- 新增 使用 svg 表现形式更好
- 新增 使用字体,可以任意替换默认字体
- 新增 支持设置字体大小
- 新增 支持忽略某些字符
- 注意 更新之后请重新上传公共模块
## 0.1.0(2021-03-01)
- 调整为uni_modules目录规范
<template>
<view class="captcha-box">
<view class="captcha-img-box">
<uni-icons class="loding" size="20px" color="#BBB" v-if="loging" type="spinner-cycle"></uni-icons>
<image class="captcha-img" :class="{opacity:loging}" @click="getImageCaptcha" :src="captchaBase64"
mode="widthFix"></image>
</view>
<input @blur="focusCaptchaInput = false" :focus="focusCaptchaInput" type="text" class="captcha"
:inputBorder="false" maxlength="4" v-model="val" placeholder="请输入验证码">
</view>
</template>
<script>
export default {
props: {
modelValue:String,
value:String,
scene: {
type: String,
default () {
return ""
}
},
focus: {
type: Boolean,
default () {
return false
}
}
},
computed:{
val:{
get(){
return this.value||this.modelValue
},
set(value){
// console.log(value);
// TODO 兼容 vue2
// #ifdef VUE2
this.$emit('input', value);
// #endif
// TODO 兼容 vue3
// #ifdef VUE3
this.$emit('update:modelValue', value)
// #endif
}
}
},
data() {
return {
focusCaptchaInput: false,
captchaBase64: "",
loging: false
};
},
watch: {
scene: {
handler(scene) {
if (scene) {
this.getImageCaptcha(this.focus)
} else {
uni.showToast({
title: 'scene不能为空',
icon: 'none'
});
}
},
immediate:true
}
},
methods: {
getImageCaptcha(focus = true) {
this.loging = true
if (focus) {
this.val = ''
this.focusCaptchaInput = true
}
const uniIdCo = uniCloud.importObject("uni-captcha-co", {
customUI: true
})
uniIdCo.getImageCaptcha({
scene: this.scene
}).then(result => {
// console.log(result);
this.captchaBase64 = result.captchaBase64
})
.catch(e => {
uni.showToast({
title: e.message,
icon: 'none'
});
}).finally(e => {
this.loging = false
})
}
}
}
</script>
<style lang="scss" scoped>
.captcha-box {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
align-items: center;
justify-content: flex-end;
flex: 1;
}
.captcha-img-box,
.captcha {
height: 44px;
line-height: 44px;
}
.captcha-img-box {
position: relative;
background-color: #FEFAE7;
}
.captcha {
background-color: #F8F8F8;
font-size: 14px;
flex: 1;
padding: 0 20rpx;
margin-left: 20rpx;
/* #ifndef APP-NVUE */
box-sizing: border-box;
/* #endif */
}
.captcha-img-box,
.captcha-img,
.loding {
height: 44px !important;
width: 100px;
}
.captcha-img{
cursor: pointer;
}
.loding {
z-index: 9;
color: #bbb;
position: absolute;
text-align: center;
line-height: 45px;
animation: rotate 1s linear infinite;
}
.opacity {
opacity: 0.5;
}
@keyframes rotate {
from {
transform: rotate(0deg)
}
to {
transform: rotate(360deg)
}
}
</style>
\ No newline at end of file
<template>
<uni-popup ref="popup" type="center">
<view class="popup-captcha">
<view class="content">
<text class="title">{{title}}</text>
<uni-captcha :focus="focus" :scene="scene" v-model="val"></uni-captcha>
</view>
<view class="button-box">
<view @click="close" class="btn">取消</view>
<view @click="confirm" class="btn confirm">确认</view>
</view>
</view>
</uni-popup>
</template>
<script>
export default {
data() {
return {
focus: false
}
},
props: {
modelValue:String,
value:String,
scene: {
type: String,
default () {
return ""
}
},
title: {
type: String,
default () {
return ""
}
},
},
computed:{
val:{
get(){
return this.value||this.modelValue
},
set(value){
// console.log(value);
// TODO 兼容 vue2
// #ifdef VUE2
this.$emit('input', value);
// #endif
// TODO 兼容 vue3
// #ifdef VUE3
this.$emit('update:modelValue', value)
// #endif
}
}
},
methods: {
open() {
this.focus = true
this.val = ""
this.$refs.popup.open()
},
close() {
this.focus = false
this.$refs.popup.close()
},
confirm() {
if(!this.val||this.val.length < 4){
return uni.showToast({
title: '请填写验证码',
icon: 'none'
});
}
this.close()
this.$emit('confirm')
}
}
}
</script>
<style lang="scss" scoped>
/* #ifndef APP-NVUE */
view {
display: flex;
flex-direction: column;
}
/* #endif */
.popup-captcha {
/* #ifndef APP-NVUE */
display: flex;
max-width: 600px;
/* #endif */
width: 600rpx;
padding-bottom: 0;
background-color: #FFF;
border-radius: 10px;
flex-direction: column;
position: relative;
}
.popup-captcha .content {
padding: 1.3em 0.8em;
}
.popup-captcha .title {
text-align: center;
word-wrap: break-word;
word-break: break-all;
white-space: pre-wrap;
font-weight: 400;
font-size: 18px;
overflow: hidden;
text-overflow: ellipsis;
color: #111;
margin-bottom: 15px;
}
.button-box {
height: 44px;
border-top: solid 1px #eee;
flex-direction: row;
align-items: center;
justify-content: space-around;
}
.button-box ,.btn{
height: 44px;
line-height: 44px;
}
.button-box .btn{
flex: 1;
margin: 1px;
text-align: center;
}
.button-box .confirm{
color: #007aff;
border-left: solid 1px #eee;
}
</style>
{
"id": "uni-captcha",
"displayName": "uni-captcha",
"version": "0.1.1",
"description": "简洁、高效、灵活可配置的云端验证码模块",
"version": "0.6.0",
"description": "云端一体图形验证码组件",
"keywords": [
"uniCloud",
"captcha",
......@@ -73,6 +73,10 @@
"快应用": {
"华为": "u",
"联盟": "u"
},
"Vue": {
"vue2": "y",
"vue3": "u"
}
}
}
......
## uni 验证码验证文档
> 用途:主要使用在登录、需要人机校验或其他限制调用的场景
> 验证码生成、校验都在服务端。页面使用返回的 base64 显示。[云端一体登陆模板](https://ext.dcloud.net.cn/plugin?id=13)已集成,可下载体验。
> 数据表使用[opendb-verify-codes](https://gitee.com/dcloud/opendb/blob/master/collection/opendb-verify-codes/collection.json)
### 获取验证码@create
用法:`uniCaptcha.create(Object params);`
**参数说明**
| 字段 | 类型 | 必填 | 默认值 | 说明 |
| --------------- | ------ | ---- | ------- | ----------------------------------------------- |
| scene | String | 是 | 4 | 使用场景值,用于防止不同功能的验证码混用 |
| deviceId | String | - | - | 设备 id,如果不传,将自动从 uniCloud 上下文获取 |
| width | Number | - | 100 | 图片宽度 |
| height | Number | - | 40 | 图片高度 |
| backgroundColor | String | - | #FFFAE8 | 验证码背景色 |
| size | Number | - | 4 | 验证码长度,最多 6 个字符 |
| noise | Number | - | 4 | 验证码干扰线条数 |
| expiresDate | Number | - | 180 | 验证码过期时间(s) |
**响应参数**
| 字段 | 类型 | 说明 |
| ------------- | ------ | ------------------- |
| code | Number | 错误码,0 表示成功 |
| message | String | 详细信息 |
| captchaBase64 | String | 验证码:base64 格式 |
`注意:`
- 重新生成后,上条验证码作废
### 校验验证码@verify
用法:`uniCaptcha.verify(Object params);`
**参数说明**
| 字段 | 类型 | 必填 | 默认值 | 说明 |
| -------- | ------ | ---- | ------ | ----------------------------------------------- |
| scene | String | 是 | - | 类型,用于防止不同功能的验证码混用 |
| captcha | String | 是 | - | 验证码 |
| deviceId | String | - | - | 设备 id,如果不传,将自动从 uniCloud 上下文获取 |
**响应参数**
| 字段 | 类型 | 说明 |
| ------- | ------ | ------------------ |
| code | Number | 错误码,0 表示成功 |
| message | String | 详细信息 |
`注意:`
- 若提示验证码失效,请重新获取
### 刷新验证码@refresh
用法:`uniCaptcha.refresh(Object params);`
**参数说明**
| 字段 | 类型 | 必填 | 默认值 | 说明 |
| -------- | ------ | ---- | ------ | ----------------------------------------------- |
| scene | String | 是 | - | 类型,用于防止不同功能的验证码混用 |
| deviceId | String | - | - | 设备 id,如果不传,将自动从 uniCloud 上下文获取 |
**响应参数**
| 字段 | 类型 | 说明 |
| ------------- | ------ | ------------------- |
| code | Number | 错误码,0 表示成功 |
| message | String | 详细信息 |
| captchaBase64 | String | 验证码:base64 格式 |
`注意:`
- 支持传入 create 方法的所有参数,如果不传,则自动按照 deviceId 匹配上次生成时的配置生成新的验证码
## 错误码
_详细信息请查看 message 中查看_
| 模块 | 模块码 | 错误代码 | 错误信息 |
| :----: | :----: | :------: | :---------------------: |
| 验证码 | 100 | 01 | (10001)验证码生成失败 |
| | | 02 | (10002)验证码校验失败 |
| | | 03 | (10003)验证码刷新失败 |
<h2>
文档已移至 <a href="https://uniapp.dcloud.io/uniCloud/uni-captcha.html" target="_blank">uni-captcha文档</a>
</h2>
\ No newline at end of file
{
"name": "uni-captcha",
"version": "0.1.1",
"version": "0.2.2",
"description": "uni-captcha",
"main": "index.js",
"homepage": "https://ext.dcloud.net.cn/plugin?id=4048",
......@@ -9,5 +9,8 @@
"url": "git+https://gitee.com/dcloud/uni-captcha"
},
"author": "DCloud",
"license": "Apache-2.0"
"license": "Apache-2.0",
"dependencies": {
"uni-config-center": "file:../../../../../uni-config-center/uniCloud/cloudfunctions/common/uni-config-center"
}
}
\ No newline at end of file
// 开发文档: https://uniapp.dcloud.net.cn/uniCloud/cloud-obj
//导入验证码公共模块
const uniCaptcha = require('uni-captcha')
//获取数据库对象
const db = uniCloud.database();
//获取数据表opendb-verify-codes对象
const verifyCodes = db.collection('opendb-verify-codes')
module.exports = {
async getImageCaptcha({
scene
}) {
//获取设备id
let {
deviceId,
platform
} = this.getClientInfo();
//根据:设备id、场景值、状态,查找记录是否存在
let res = await verifyCodes.where({
scene,
deviceId,
state: 0
}).limit(1).get()
//如果已存在则调用刷新接口,反之调用插件接口
let action = res.data.length ? 'refresh' : 'create'
//执行并返回结果
//导入配置,配置优先级说明:此处配置 > uni-config-center
return await uniCaptcha[action]({
scene, //来源客户端传递,表示:使用场景值,用于防止不同功能的验证码混用
uniPlatform: platform
})
}
}
{
"name": "uni-captcha-co",
"dependencies": {
"uni-captcha": "file:../common/uni-captcha",
"uni-config-center": "file:../../../../uni-config-center/uniCloud/cloudfunctions/common/uni-config-center"
},
"extensions": {
"uni-cloud-jql": {}
}
}
\ No newline at end of file
{
"bsonType": "object",
"required": [],
"properties": {
"_id": {
"description": "ID,系统自动生成"
},
"mobile": {
"bsonType": "string",
"description": "手机号码"
},
"email": {
"bsonType": "string",
"description": "邮箱"
},
"code": {
"bsonType": "string",
"description": "验证码"
},
"type": {
"bsonType": "string",
"description": "验证类型:login, bind, unbind, pay"
},
"state": {
"bsonType": "int",
"description": "验证状态:0 未验证、1 已验证、2 已作废"
},
"ip": {
"bsonType": "string",
"description": "请求时客户端IP地址"
},
"created_at": {
"bsonType": "timestamp",
"description": "创建时间"
},
"expired_at": {
"bsonType": "timestamp",
"description": "过期时间"
}
}
}
{
"bsonType": "object",
"properties": {
"_id": {
"description": "ID,系统自动生成"
},
"code": {
"bsonType": "string",
"description": "验证码"
},
"create_date": {
"bsonType": "timestamp",
"description": "创建时间"
},
"device_uuid": {
"bsonType": "string",
"description": "设备UUID,常用于图片验证码"
},
"email": {
"bsonType": "string",
"description": "邮箱"
},
"expired_date": {
"bsonType": "timestamp",
"description": "过期时间"
},
"ip": {
"bsonType": "string",
"description": "请求时客户端IP地址"
},
"mobile": {
"bsonType": "string",
"description": "手机号码"
},
"scene": {
"bsonType": "string",
"description": "使用验证码的场景,如:login, bind, unbind, pay"
},
"state": {
"bsonType": "int",
"description": "验证状态:0 未验证、1 已验证、2 已作废"
}
},
"required": []
}
\ No newline at end of file
## 1.3.1(2021-12-20)
- 修复 在vue页面下略缩图显示不正常的bug
## 1.3.0(2021-11-19)
- 重构插槽的用法 ,header 替换为 title
- 新增 actions 插槽
- 新增 cover 封面图属性和插槽
- 新增 padding 内容默认内边距离
- 新增 margin 卡片默认外边距离
- 新增 spacing 卡片默认内边距
- 新增 shadow 卡片阴影属性
- 取消 mode 属性,可使用组合插槽代替
- 取消 note 属性 ,使用actions插槽代替
- 优化 组件UI,并提供设计资源,详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移,详见:[https://uniapp.dcloud.io/component/uniui/uni-card](https://uniapp.dcloud.io/component/uniui/uni-card)
## 1.2.1(2021-07-30)
- 优化 vue3下事件警告的问题
## 1.2.0(2021-07-13)
- 组件兼容 vue3,如何创建vue3项目详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 1.1.8(2021-07-01)
- 优化 图文卡片无图片加载时,提供占位图标
- 新增 header 插槽,自定义卡片头部( 图文卡片 mode="style" 时,不支持)
- 修复 thumbnail 不存在仍然占位的 bug
## 1.1.7(2021-05-12)
- 新增 组件示例地址
## 1.1.6(2021-02-04)
- 调整为uni_modules目录规范
## 1.2.0(2021-07-13)
- 组件兼容 vue3,如何创建vue3项目详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 1.1.8(2021-07-01)
- 优化 图文卡片无图片加载时,提供占位图标
- 新增 header 插槽,自定义卡片头部( 图文卡片 mode="style" 时,不支持)
- 修复 thumbnail 不存在仍然占位的 bug
## 1.1.7(2021-05-12)
- 新增 组件示例地址
## 1.1.6(2021-02-04)
- 调整为uni_modules目录规范
<template>
<view class="uni-card uni-border"
:class="{ 'uni-card--full': isFull === true || isFull === 'true', 'uni-card--shadow': isShadow === true || isShadow === 'true'}">
<!-- 基础 -->
<view v-if="mode === 'basic' && title" @click.stop="onClick" class="uni-card__head-padding">
<view class="uni-card__header uni-border-bottom">
<slot name="header">
<view v-if="thumbnail" class="uni-card__header-extra-img-view">
<image :src="thumbnail" class="uni-card__header-extra-img" />
</view>
<text class="uni-card__header-title-text">{{ title }}</text>
<text v-if="extra" class="uni-card__header-extra-text">{{ extra }}</text>
</slot>
<view class="uni-card" :class="{ 'uni-card--full': isFull, 'uni-card--shadow': isShadow,'uni-card--border':border}"
:style="{'margin':isFull?0:margin,'padding':spacing,'box-shadow':isShadow?shadow:''}">
<!-- 封面 -->
<slot name="cover">
<view v-if="cover" class="uni-card__cover">
<image class="uni-card__cover-image" mode="widthFix" @click="onClick('cover')" :src="cover"></image>
</view>
</view>
<!-- 标题 -->
<view v-if="mode === 'title'" @click.stop="onClick" class="uni-card__head-padding">
<view class="uni-card__title uni-border-bottom">
<slot name="header">
<view class="uni-card__title-box">
<view v-if="thumbnail" class="uni-card__title-header">
<image class="uni-card__title-header-image" :src="thumbnail" mode="scaleToFill" />
</view>
<view class="uni-card__title-content">
<text class="uni-card__title-content-title uni-ellipsis">{{ title }}</text>
<text class="uni-card__title-content-extra uni-ellipsis">{{ subTitle }}</text>
</view>
</slot>
<slot name="title">
<view v-if="title || extra" class="uni-card__header">
<!-- 卡片标题 -->
<view class="uni-card__header-box" @click="onClick('title')">
<view v-if="thumbnail" class="uni-card__header-avatar">
<image class="uni-card__header-avatar-image" :src="thumbnail" mode="aspectFit" />
</view>
<view v-if="extra">
<text class="uni-card__header-extra-text">{{ extra }}</text>
<view class="uni-card__header-content">
<text class="uni-card__header-content-title uni-ellipsis">{{ title }}</text>
<text v-if="title&&subTitle"
class="uni-card__header-content-subtitle uni-ellipsis">{{ subTitle }}</text>
</view>
</slot>
</view>
<view class="uni-card__header-extra" @click="onClick('extra')">
<text class="uni-card__header-extra-text">{{ extra }}</text>
</view>
</view>
</slot>
<!-- 卡片内容 -->
<view class="uni-card__content" :style="{padding:padding}" @click="onClick('content')">
<slot></slot>
</view>
<!-- 图文 -->
<view v-if="mode === 'style'" class="uni-card__thumbnailimage" @click.stop="onClick">
<view class="uni-card__thumbnailimage-box">
<image v-if="thumbnail" class="uni-card__thumbnailimage-image" :src="thumbnail" mode="aspectFill" />
<uni-icons v-if="!thumbnail" type="image" size="30" color="#999" />
</view>
<view v-if="title" class="uni-card__thumbnailimage-title">
<text class="uni-card__thumbnailimage-title-text">{{ title }}</text>
</view>
</view>
<!-- 内容 -->
<view class="uni-card__content uni-card__content--pd" @click.stop="onClick">
<view v-if="mode === 'style' && extra" class=""><text class="uni-card__content-extra">{{ extra }}</text>
</view>
<slot />
</view>
<!-- 底部 -->
<view v-if="note" class="uni-card__footer uni-border-top">
<slot name="footer">
<text class="uni-card__footer-text">{{ note }}</text>
</slot>
<view class="uni-card__actions" @click="onClick('actions')">
<slot name="actions"></slot>
</view>
</view>
</template>
......@@ -63,22 +41,22 @@
* @description 卡片视图组件
* @tutorial https://ext.dcloud.net.cn/plugin?id=22
* @property {String} title 标题文字
* @property {String} subTitle 副标题(仅仅mode=title下生效)
* @property {String} subTitle 副标题
* @property {Number} padding 内容内边距
* @property {Number} margin 卡片外边距
* @property {Number} spacing 卡片内边距
* @property {String} extra 标题额外信息
* @property {String} note 底部信息
* @property {String} cover 封面图(本地路径需要引入)
* @property {String} thumbnail 标题左侧缩略图
* @property {String} mode = [basic|style|title] 卡片模式
* @value basic 基础卡片
* @value style 图文卡片
* @value title 标题卡片
* @property {Boolean} isFull = [true | false] 卡片内容是否通栏,为 true 时将去除padding值
* @property {Boolean} isShadow = [true | false] 卡片内容是否开启阴影
* @property {Boolean} is-full = [true | false] 卡片内容是否通栏,为 true 时将去除padding值
* @property {Boolean} is-shadow = [true | false] 卡片内容是否开启阴影
* @property {String} shadow 卡片阴影
* @property {Boolean} border 卡片边框
* @event {Function} click 点击 Card 触发事件
* @example <uni-card title="标题文字" thumbnail="xxx.jpg" extra="额外信息" note="Tips">内容主体,可自定义内容及样式</uni-card>
*/
export default {
name: 'UniCard',
emits:['click'],
emits: ['click'],
props: {
title: {
type: String,
......@@ -88,11 +66,23 @@
type: String,
default: ''
},
padding: {
type: String,
default: '10px'
},
margin: {
type: String,
default: '15px'
},
spacing: {
type: String,
default: '0 10px'
},
extra: {
type: String,
default: ''
},
note: {
cover: {
type: String,
default: ''
},
......@@ -100,10 +90,6 @@
type: String,
default: ''
},
mode: {
type: String,
default: 'basic'
},
isFull: {
// 内容区域是否通栏
type: Boolean,
......@@ -111,300 +97,157 @@
},
isShadow: {
// 是否开启阴影
type: [Boolean, String],
default: false
type: Boolean,
default: true
},
shadow: {
type: String,
default: '0px 0px 3px 1px rgba(0, 0, 0, 0.08)'
},
border: {
type: Boolean,
default: true
}
},
methods: {
onClick() {
this.$emit('click')
onClick(type) {
this.$emit('click', type)
}
}
}
</script>
<style lang="scss" scoped>
.uni-card {
/* #ifndef APP-NVUE */
display: flex;
flex: 1;
box-shadow: 0 0 0 rgba(0, 0, 0, 0);
/* #endif */
margin: $uni-spacing-col-lg $uni-spacing-row-lg;
background-color: $uni-bg-color;
position: relative;
flex-direction: column;
border-radius: 5px;
overflow: hidden;
/* #ifdef H5 */
cursor: pointer;
/* #endif */
}
<style lang="scss">
$uni-border-3: #EBEEF5 !default;
$uni-shadow-base:0 0px 6px 1px rgba($color: #a5a5a5, $alpha: 0.2) !default;
$uni-main-color: #3a3a3a !default;
$uni-base-color: #6a6a6a !default;
$uni-secondary-color: #909399 !default;
$uni-spacing-sm: 8px !default;
$uni-border-color:$uni-border-3;
$uni-shadow: $uni-shadow-base;
$uni-card-title: 15px;
$uni-cart-title-color:$uni-main-color;
$uni-card-subtitle: 12px;
$uni-cart-subtitle-color:$uni-secondary-color;
$uni-card-spacing: 10px;
$uni-card-content-color: $uni-base-color;
.uni-border {
position: relative;
/* #ifdef APP-NVUE */
border-color: $uni-border-color;
border-style: solid;
border-width: 0.5px;
/* #endif */
z-index: 1;
}
/* #ifndef APP-NVUE */
.uni-border:after {
content: '';
position: absolute;
bottom: 0;
left: 0;
top: 0;
right: 0;
border: 1px solid $uni-border-color;
border-radius: 10px;
box-sizing: border-box;
width: 200%;
height: 200%;
transform: scale(0.5);
transform-origin: left top;
z-index: -1;
}
/* #endif */
.uni-border-bottom {
position: relative;
/* #ifdef APP-NVUE */
border-bottom-color: $uni-border-color;
border-bottom-style: solid;
border-bottom-width: 0.5px;
/* #endif */
z-index: 1;
}
/* #ifndef APP-NVUE */
.uni-border-bottom:after {
content: '';
position: absolute;
bottom: 0;
left: 0;
top: 0;
right: 0;
border-bottom: 1px solid $uni-border-color;
box-sizing: border-box;
width: 200%;
height: 200%;
transform: scale(0.5);
transform-origin: left top;
z-index: -1;
}
/* #endif */
.uni-border-top {
position: relative;
/* #ifdef APP-NVUE */
border-top-color: $uni-border-color;
border-top-style: solid;
border-top-width: 0.5px;
/* #endif */
z-index: 1;
}
/* #ifndef APP-NVUE */
.uni-border-top:after {
content: '';
position: absolute;
bottom: 0;
left: 0;
top: 0;
right: 0;
border-top: 1px solid $uni-border-color;
box-sizing: border-box;
width: 200%;
height: 200%;
transform: scale(0.5);
transform-origin: left top;
z-index: -1;
}
/* #endif */
.uni-card__thumbnailimage {
position: relative;
/* #ifndef APP-NVUE */
// display: flex;
/* #endif */
flex-direction: column;
justify-content: center;
height: 150px;
background-color: #F1F1F1;
overflow: hidden;
}
.uni-card__thumbnailimage-box {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex: 1;
height: 150px;
flex-direction: row;
justify-content: center;
align-items: center;
overflow: hidden;
}
.uni-card__thumbnailimage-image {
flex: 1;
}
.uni-card__thumbnailimage-title {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
position: absolute;
bottom: 0;
left: 0;
right: 0;
flex-direction: row;
padding: $uni-spacing-col-base $uni-spacing-col-lg;
background-color: $uni-bg-color-mask;
}
.uni-card__thumbnailimage-title-text {
flex: 1;
font-size: $uni-font-size-base;
color: #fff;
}
.uni-card__title {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
align-items: center;
padding: 10px;
}
.uni-card__title-box {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex: 1;
flex-direction: row;
align-items: center;
overflow: hidden;
}
.uni-card__title-header {
width: 40px;
height: 40px;
.uni-card {
margin: $uni-card-spacing;
padding: 0 $uni-spacing-sm;
border-radius: 4px;
overflow: hidden;
border-radius: 5px;
padding-right: 10px;
}
.uni-card__title-header-image {
width: 40px;
height: 40px;
}
.uni-card__title-content {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: column;
justify-content: center;
font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, SimSun, sans-serif;
background-color: #fff;
flex: 1;
height: 40px;
overflow: hidden;
}
.uni-card__title-content-title {
font-size: $uni-font-size-base;
line-height: 22px;
}
.uni-card__title-content-extra {
font-size: $uni-font-size-sm;
line-height: 27px;
color: $uni-text-color-grey;
}
.uni-card__header {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
position: relative;
flex-direction: row;
padding: $uni-spacing-col-lg;
align-items: center;
}
.uni-card__header-title {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
margin-right: $uni-spacing-col-base;
justify-content: flex-start;
align-items: center;
}
.uni-card__header-title-text {
font-size: $uni-font-size-lg;
flex: 1;
color: #333;
}
.uni-card__cover {
position: relative;
margin-top: $uni-card-spacing;
flex-direction: row;
overflow: hidden;
border-radius: 4px;
.uni-card__cover-image {
flex: 1;
// width: 100%;
/* #ifndef APP-PLUS */
vertical-align: middle;
/* #endif */
}
}
.uni-card__header-extra-img {
height: $uni-img-size-sm;
width: $uni-img-size-sm;
margin-right: $uni-spacing-col-base;
}
.uni-card__header {
display: flex;
border-bottom: 1px $uni-border-color solid;
flex-direction: row;
align-items: center;
padding: $uni-card-spacing;
overflow: hidden;
.uni-card__header-box {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex: 1;
flex-direction: row;
align-items: center;
overflow: hidden;
}
.uni-card__header-extra-text {
flex: 1;
margin-left: $uni-spacing-col-base;
font-size: $uni-font-size-sm;
text-align: right;
color: $uni-text-color-grey;
}
.uni-card__header-avatar {
width: 40px;
height: 40px;
overflow: hidden;
border-radius: 5px;
margin-right: $uni-card-spacing;
.uni-card__header-avatar-image {
flex: 1;
width: 40px;
height: 40px;
}
}
.uni-card__content {
color: $uni-text-color;
}
.uni-card__header-content {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: column;
justify-content: center;
flex: 1;
// height: 40px;
overflow: hidden;
.uni-card__header-content-title {
font-size: $uni-card-title;
color: $uni-cart-title-color;
// line-height: 22px;
}
.uni-card__header-content-subtitle {
font-size: $uni-card-subtitle;
margin-top: 5px;
color: $uni-cart-subtitle-color;
}
}
.uni-card__content--pd {
padding: $uni-spacing-col-lg;
}
.uni-card__header-extra {
line-height: 12px;
.uni-card__content-extra {
font-size: $uni-font-size-base;
padding-bottom: 10px;
color: $uni-text-color-grey;
}
.uni-card__header-extra-text {
font-size: 12px;
color: $uni-cart-subtitle-color;
}
}
}
.uni-card__footer {
justify-content: space-between;
padding: $uni-spacing-col-lg;
}
.uni-card__content {
padding: $uni-card-spacing;
font-size: 14px;
color: $uni-card-content-color;
line-height: 22px;
}
.uni-card__footer-text {
color: $uni-text-color-grey;
font-size: $uni-font-size-sm;
.uni-card__actions {
font-size: 12px;
}
}
.uni-card--border {
border: 1px solid $uni-border-color;
}
.uni-card--shadow {
position: relative;
/* #ifndef APP-NVUE */
box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.1);
box-shadow: $uni-shadow;
/* #endif */
}
.uni-card--full {
margin: 0;
border-left-width: 0;
border-left-width: 0;
border-radius: 0;
}
......@@ -424,8 +267,4 @@
lines: 1;
/* #endif */
}
.uni-card__head-padding {
// mar: 12px;
}
</style>
{
"id": "uni-card",
"displayName": "uni-card 卡片",
"version": "1.2.1",
"description": "Card 组件,提供常见的卡片样式。",
"keywords": [
"uni-ui",
"uniui",
"card",
"",
"卡片"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": ""
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"category": [
"前端组件",
"通用组件"
],
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
},
"uni_modules": {
"dependencies": [
"uni-icons"
],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"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",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y"
},
"快应用": {
"华为": "u",
"联盟": "u"
}
}
}
}
}
{
"id": "uni-card",
"displayName": "uni-card 卡片",
"version": "1.3.1",
"description": "Card 组件,提供常见的卡片样式。",
"keywords": [
"uni-ui",
"uniui",
"card",
"",
"卡片"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": ""
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"category": [
"前端组件",
"通用组件"
],
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
},
"uni_modules": {
"dependencies": [
"uni-icons",
"uni-scss"
],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"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",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y"
},
"快应用": {
"华为": "u",
"联盟": "u"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}
......@@ -4,101 +4,9 @@
> **组件名:uni-card**
> 代码块: `uCard`
卡片视图组件。
### 安装方式
本组件符合[easycom](https://uniapp.dcloud.io/collocation/pages?id=easycom)规范,`HBuilderX 2.5.5`起,只需将本组件导入项目,在页面`template`中即可直接使用,无需在页面中`import`和注册`components`
如需通过`npm`方式使用`uni-ui`组件,另见文档:[https://ext.dcloud.net.cn/plugin?id=55](https://ext.dcloud.net.cn/plugin?id=55)
> **注意事项**
> 为了避免错误使用,给大家带来不好的开发体验,请在使用组件前仔细阅读下面的注意事项,可以帮你避免一些错误。
> - 因为平台兼容问题 , 目前 APP-NVUE 安卓平台下不支持阴影
### 基本用法
``template`` 中使用组件
```html
<!-- 一般用法 -->
<uni-card title="标题文字" thumbnail="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png" extra="额外信息" note="Tips">
内容主体,可自定义内容及样式
</uni-card>
<!-- 内容通栏 -->
<uni-card is-full="true" title="DCloud" thumbnail="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png" extra="2018.12.12" >
<image src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png" style="width: 100%;"></image>
</uni-card>
<!-- 图文卡片模式 -->
<uni-card
title="标题文字"
mode="style"
:is-shadow="true"
thumbnail="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png"
extra="Dcloud 2019-05-20 12:32:19"
note="Tips"
>
uni-app 是一个使用 Vue.js 开发所有前端应用的框架,开发者编写一套代码,可编译到iOS、Android、H5、以及各种小程序等多个平台。即使不跨端,uni-app同时也是更好的小程序开发框架。
</uni-card>
<!-- 标题卡片模式 -->
<uni-card
title="Dcloud"
mode="title"
:is-shadow="true"
thumbnail="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png"
extra="技术没有上限"
note="Tips"
>
uni-app 是一个使用 Vue.js 开发所有前端应用的框架,开发者编写一套代码,可编译到iOS、Android、H5、以及各种小程序等多个平台。即使不跨端,uni-app同时也是更好的小程序开发框架。
</uni-card>
<!-- 自定义底部按钮 -->
<uni-card title="Dcloud" note="true">
默认内容
<template v-slot:footer>
<view class="footer-box">
<view>喜欢</view>
<view>评论</view>
<view>分享</view>
</view>
</template>
</uni-card>
```
## API
### Card Props
|属性名 |类型 |默认值 |说明 |
|:-: |:-: |:-: |:-: |
|title |String |- |标题文字 |
|extra |String |- |标题额外信息 |
|note |String |- |底部信息 |
|thumbnail |String |- |标题左侧缩略图,支持网络图片,本地图片,本图片需要传入一个绝对路径,如:`/static/xxx.png` |
|mode |String |basic |卡片模式 ,可选值, basic:基础卡片 ;style :图文卡片 ; title :标题卡片 |
|isFull |Boolean|false |卡片内容是否通栏,为true时将去除padding值 |
|isShadow |Boolean|false |卡片内容是否开启阴影 |
### Card Events
|事件称名 |事件说明 |返回参数 |
|:-: |:-: |:-: |
|@click |点击 Card 触发事件 |- |
### Card Slots
|插槽称名 |说明 |
|:-: |:-: |
|header |卡片头部插槽( 图文卡片 mode="style" 时,不支持)|
|footer |卡片底部插槽 |
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-card)
#### 如使用过程中有任何问题,或者您对uni-ui有一些好的建议,欢迎加入 uni-ui 交流群:871950839
## 组件示例
点击查看:[https://hellouniapp.dcloud.net.cn/pages/extUI/card/card](https://hellouniapp.dcloud.net.cn/pages/extUI/card/card)
\ No newline at end of file
## 1.4.3(2022-01-25)
- 修复 初始化的时候 ,open 属性失效的bug
## 1.4.2(2022-01-21)
- 修复 微信小程序resize后组件收起的bug
## 1.4.1(2021-11-22)
- 修复 vue3中个别scss变量无法找到的问题
## 1.4.0(2021-11-19)
- 优化 组件UI,并提供设计资源,详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移,详见:[https://uniapp.dcloud.io/component/uniui/uni-collapse](https://uniapp.dcloud.io/component/uniui/uni-collapse)
## 1.3.3(2021-08-17)
- 优化 show-arrow 属性默认为true
## 1.3.2(2021-08-17)
- 新增 show-arrow 属性,控制是否显示右侧箭头
## 1.3.1(2021-07-30)
- 优化 vue3下小程序事件警告的问题
## 1.3.0(2021-07-30)
- 组件兼容 vue3,如何创建vue3项目,详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 1.2.2(2021-07-21)
- 修复 由1.2.0版本引起的 change 事件返回 undefined 的Bug
## 1.2.1(2021-07-21)
- 优化 组件示例
## 1.2.0(2021-07-21)
- 新增 组件折叠动画
- 新增 value\v-model 属性 ,动态修改面板折叠状态
- 新增 title 插槽 ,可定义面板标题
- 新增 border 属性 ,显示隐藏面板内容分隔线
- 新增 title-border 属性 ,显示隐藏面板标题分隔线
- 修复 resize 方法失效的Bug
- 修复 change 事件返回参数不正确的Bug
- 优化 H5、App 平台自动更具内容更新高度,无需调用 reszie() 方法
## 1.1.7(2021-05-12)
- 新增 组件示例地址
## 1.1.6(2021-02-05)
- 优化 组件引用关系,通过uni_modules引用组件
## 1.1.5(2021-02-05)
## 1.3.2(2021-08-17)
- 新增 show-arrow 属性,控制是否显示右侧箭头
## 1.3.1(2021-07-30)
- 优化 vue3下小程序事件警告的问题
## 1.3.0(2021-07-30)
- 组件兼容 vue3,如何创建vue3项目,详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 1.2.2(2021-07-21)
- 修复 由1.2.0版本引起的 change 事件返回 undefined 的Bug
## 1.2.1(2021-07-21)
- 优化 组件示例
## 1.2.0(2021-07-21)
- 新增 组件折叠动画
- 新增 value\v-model 属性 ,动态修改面板折叠状态
- 新增 title 插槽 ,可定义面板标题
- 新增 border 属性 ,显示隐藏面板内容分隔线
- 新增 title-border 属性 ,显示隐藏面板标题分隔线
- 修复 resize 方法失效的Bug
- 修复 change 事件返回参数不正确的Bug
- 优化 H5、App 平台自动更具内容更新高度,无需调用 reszie() 方法
## 1.1.7(2021-05-12)
- 新增 组件示例地址
## 1.1.6(2021-02-05)
- 优化 组件引用关系,通过uni_modules引用组件
## 1.1.5(2021-02-05)
- 调整为uni_modules目录规范
\ No newline at end of file
......@@ -11,11 +11,10 @@
</view>
</slot>
</view>
<view
v-if="showArrow"
<view v-if="showArrow"
:class="{ 'uni-collapse-item__title-arrow-active': isOpen, 'uni-collapse-item--animation': showAnimation === true }"
class="uni-collapse-item__title-arrow">
<uni-icons :color="disabled?'#ddd':'#bbb'" size="14" type="arrowdown" />
<uni-icons :color="disabled?'#ddd':'#bbb'" size="14" type="bottom" />
</view>
</view>
<view class="uni-collapse-item__wrap" :class="{'is--transition':showAnimation}"
......@@ -96,7 +95,7 @@
type: Boolean,
default: true
},
showArrow:{
showArrow: {
type: Boolean,
default: true
}
......@@ -115,31 +114,32 @@
watch: {
open(val) {
this.isOpen = val
this.onClick(val,'init')
this.onClick(val, 'init')
}
},
updated(e) {
this.$nextTick(()=> {
this.$nextTick(() => {
this.init(true)
})
},
created(){
created() {
this.collapse = this.getCollapse()
this.oldHeight = 0
},
// #ifndef VUE3
// TODO vue2
destroyed() {
if (this.__isUnmounted) return
this.uninstall()
},
this.onClick(this.open, 'init')
},
// #ifndef VUE3
// TODO vue2
destroyed() {
if (this.__isUnmounted) return
this.uninstall()
},
// #endif
// #ifdef VUE3
// TODO vue3
unmounted() {
this.__isUnmounted = true
this.uninstall()
},
// #ifdef VUE3
// TODO vue3
unmounted() {
this.__isUnmounted = true
this.uninstall()
},
// #endif
mounted() {
if (!this.collapse) return
......@@ -181,14 +181,14 @@
})
}
},
onClick(isOpen,type) {
onClick(isOpen, type) {
if (this.disabled) return
this.isOpen = isOpen
if (this.isOpen && this.collapse) {
this.collapse.setAccordion(this)
}
if(type !== 'init'){
this.collapse.onChange(isOpen,this)
if (type !== 'init') {
this.collapse.onChange(isOpen, this)
}
},
getCollapseHeight(type, index = 0) {
......@@ -213,7 +213,7 @@
// #endif
this.isheight = true
if (type) return
this.onClick(this.open,'init')
this.onClick(this.isOpen, 'init')
})
.exec()
},
......@@ -228,7 +228,7 @@
// #endif
this.isheight = true
if (type) return
this.onClick(this.open,'init')
this.onClick(this.open, 'init')
}
})
},
......@@ -249,7 +249,7 @@
}
</script>
<style lang="scss" scoped>
<style lang="scss">
.uni-collapse-item {
/* #ifndef APP-NVUE */
box-sizing: border-box;
......@@ -296,7 +296,7 @@
/* #endif */
&.is-disabled {
.uni-collapse-item__title-text {
color: $uni-text-color-disable;
color: #999;
}
}
......@@ -311,14 +311,14 @@
}
&-img {
height: $uni-img-size-base;
width: $uni-img-size-base;
height: 22px;
width: 22px;
margin-right: 10px;
}
&-text {
flex: 1;
font-size: $uni-font-size-base;
font-size: 14px;
/* #ifndef APP-NVUE */
white-space: nowrap;
color: inherit;
......@@ -343,7 +343,7 @@
transform: rotate(0deg);
&-active {
transform: rotate(180deg);
transform: rotate(-180deg);
}
}
......
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
## 1.0.0(2021-11-19)
- 优化 组件UI,并提供设计资源,详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移,详见:[https://uniapp.dcloud.io/component/uniui/uni-dateformat](https://uniapp.dcloud.io/component/uniui/uni-dateformat)
## 0.0.5(2021-07-08)
- 调整 默认时间不再是当前时间,而是显示'-'字符
## 0.0.4(2021-05-12)
......
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册