Skip to content

basic-uniapp-v3
basic-uniapp-v3
提交 a8af7394 作者: 方治民
操作

合并分支 'main' 到 'main' 

Main

查看合并请求 hntq/hntq-v5!19
上级 111bfb3a d2a5581e
正在显示 包含 1376 行增加 和 459 行删除
build/utils.ts
import fs from 'node:fs'
import path from 'node:path'
import process from 'node:process'
import dotenv from 'dotenv'
export function isDevFn(mode: string): boolean {
......
build/vite/uni.ts
......@@ -11,7 +11,7 @@ import tags from '@dcloudio/uni-helper-json/dist/tags.json'
/**
* 根据 @dcloudio/uni-helper-json 生成组件 .d.ts 描述文件，对组件进行高亮展示
*/
function generateUniComponentsTypes() {
async function generateUniComponentsTypes() {
const components = Object.keys(tags).map((key) => `'${key}': UniComponent`)
const content = `
// generated by @dcloudio/uni-helper-json/dist/tags.json
......@@ -32,7 +32,7 @@ function generateUniComponentsTypes() {
export {}
`
const formatted = prettier.format(content, {
const formatted = await prettier.format(content, {
parser: 'typescript',
// eslint-disable-next-line @typescript-eslint/no-require-imports
...require('../../prettier.config'),
......
package.json
......@@ -66,23 +66,23 @@
}
},
"dependencies": {
"@dcloudio/uni-app": "3.0.0-3080720230703001",
"@dcloudio/uni-app-plus": "3.0.0-3080720230703001",
"@dcloudio/uni-components": "3.0.0-3080720230703001",
"@dcloudio/uni-h5": "3.0.0-3080720230703001",
"@dcloudio/uni-mp-alipay": "3.0.0-3080720230703001",
"@dcloudio/uni-mp-baidu": "3.0.0-3080720230703001",
"@dcloudio/uni-mp-jd": "3.0.0-3080720230703001",
"@dcloudio/uni-mp-kuaishou": "3.0.0-3080720230703001",
"@dcloudio/uni-mp-lark": "3.0.0-3080720230703001",
"@dcloudio/uni-mp-qq": "3.0.0-3080720230703001",
"@dcloudio/uni-mp-toutiao": "3.0.0-3080720230703001",
"@dcloudio/uni-mp-weixin": "3.0.0-3080720230703001",
"@dcloudio/uni-quickapp-webview": "3.0.0-3080720230703001",
"@dcloudio/uni-app": "3.0.0-alpha-3081220230802001",
"@dcloudio/uni-app-plus": "3.0.0-alpha-3081220230802001",
"@dcloudio/uni-components": "3.0.0-alpha-3081220230802001",
"@dcloudio/uni-h5": "3.0.0-alpha-3081220230802001",
"@dcloudio/uni-mp-alipay": "3.0.0-alpha-3081220230802001",
"@dcloudio/uni-mp-baidu": "3.0.0-alpha-3081220230802001",
"@dcloudio/uni-mp-jd": "3.0.0-alpha-3081220230802001",
"@dcloudio/uni-mp-kuaishou": "3.0.0-alpha-3081220230802001",
"@dcloudio/uni-mp-lark": "3.0.0-alpha-3081220230802001",
"@dcloudio/uni-mp-qq": "3.0.0-alpha-3081220230802001",
"@dcloudio/uni-mp-toutiao": "3.0.0-alpha-3081220230802001",
"@dcloudio/uni-mp-weixin": "3.0.0-alpha-3081220230802001",
"@dcloudio/uni-quickapp-webview": "3.0.0-alpha-3081220230802001",
"@dcloudio/uni-ui": "^1.4.28",
"@faker-js/faker": "^8.0.2",
"@vue/runtime-core": "~3.2.47",
"@vueuse/core": "^10.2.1",
"@vueuse/core": "^10.3.0",
"axios": "^1.4.0",
"crypto-js": "^4.1.1",
"dayjs": "^1.11.9",
......@@ -95,65 +95,65 @@
"vue": "~3.2.47",
"vue-i18n": "^9.2.2",
"vue-request": "^2.0.3",
"vue-types": "^5.1.0"
"vue-types": "^5.1.1"
},
"devDependencies": {
"@antfu/eslint-config": "^0.39.7",
"@commitlint/cli": "^17.6.6",
"@commitlint/config-conventional": "^17.6.6",
"@antfu/eslint-config": "^0.40.2",
"@commitlint/cli": "^17.7.1",
"@commitlint/config-conventional": "^17.7.0",
"@dcloudio/types": "^3.3.3",
"@dcloudio/uni-automator": "3.0.0-3080720230703001",
"@dcloudio/uni-cli-shared": "3.0.0-3080720230703001",
"@dcloudio/uni-automator": "3.0.0-alpha-3081220230802001",
"@dcloudio/uni-cli-shared": "3.0.0-alpha-3081220230802001",
"@dcloudio/uni-helper-json": "^1.0.13",
"@dcloudio/uni-stacktracey": "3.0.0-3080720230703001",
"@dcloudio/vite-plugin-uni": "3.0.0-3080720230703001",
"@iconify/json": "^2.2.86",
"@dcloudio/uni-stacktracey": "3.0.0-alpha-3081220230802001",
"@dcloudio/vite-plugin-uni": "3.0.0-alpha-3081220230802001",
"@iconify/json": "^2.2.101",
"@types/crypto-js": "^4.1.1",
"@types/lodash-es": "^4.17.7",
"@types/node": "^18.16.19",
"@types/lodash-es": "^4.17.8",
"@types/node": "^20.4.10",
"@types/prettier": "^2.7.3",
"@types/qs": "^6.9.7",
"@types/stompjs": "^2.3.5",
"@types/urijs": "^1.19.19",
"@typescript-eslint/eslint-plugin": "^5.61.0",
"@typescript-eslint/parser": "^5.61.0",
"@typescript-eslint/eslint-plugin": "^6.3.0",
"@typescript-eslint/parser": "^6.3.0",
"commitizen": "^4.3.0",
"conventional-changelog-cli": "^3.0.0",
"cz-conventional-changelog": "^3.3.0",
"cz-customizable": "^7.0.0",
"cz-git": "^1.6.1",
"czg": "^1.6.1",
"cz-git": "^1.7.1",
"czg": "^1.7.1",
"dotenv": "^16.3.1",
"eslint": "^8.44.0",
"eslint-config-prettier": "^8.8.0",
"eslint-plugin-prettier": "^4.2.1",
"eslint-plugin-vue": "^9.15.1",
"eslint": "^8.47.0",
"eslint-config-prettier": "^9.0.0",
"eslint-plugin-prettier": "^5.0.0",
"eslint-plugin-vue": "^9.17.0",
"husky": "^8.0.3",
"jest": "27.0.4",
"jest-environment-node": "27.5.1",
"less": "^4.1.3",
"less": "^4.2.0",
"lint-staged": "^13.2.3",
"npm-run-all": "^4.1.5",
"picocolors": "^1.0.0",
"pont-engine": "^1.5.11",
"postcss": "^8.4.24",
"pont-engine": "^1.5.12",
"postcss": "^8.4.27",
"postcss-html": "^1.5.0",
"postcss-less": "^6.0.0",
"prettier": "^2.8.8",
"prettier": "^3.0.1",
"rimraf": "^5.0.1",
"sass": "^1.63.6",
"sort-package-json": "^2.5.0",
"stylelint": "^15.10.0",
"sass": "^1.65.1",
"sort-package-json": "^2.5.1",
"stylelint": "^15.10.2",
"stylelint-config-html": "^1.1.0",
"stylelint-config-recommended": "^12.0.0",
"stylelint-config-standard": "^33.0.0",
"stylelint-config-recommended": "^13.0.0",
"stylelint-config-standard": "^34.0.0",
"stylelint-order": "^6.0.3",
"typescript": "~5.0.4",
"unocss": "^0.53.4",
"unocss-preset-weapp": "^0.53.5",
"typescript": "~5.1.6",
"unocss": "^0.54.3",
"unocss-preset-weapp": "^0.54.0",
"unplugin-auto-import": "^0.16.6",
"unplugin-vue-components": "^0.25.1",
"vite": "^4.3.9",
"vite": "^4.4.9",
"vue-eslint-parser": "^9.3.1"
},
"engines": {
......
pnpm-lock.yaml
This source diff could not be displayed because it is too large. You can view the blob instead.
src/api/types.ts
......@@ -82,11 +82,6 @@ export enum Status {
INTERNAL_SERVER_ERROR = 500,
/**
* 未知错误
*/
UNKNOWN_ERROR = 500,
/**
* API 未实现
*/
NOT_IMPLEMENTED = 501,
......
src/components/FirstUI/fui-actionsheet/fui-actionsheet.vue
......@@ -84,7 +84,7 @@
},
zIndex: {
type: [Number, String],
default: 1001
default: 996
},
//是否适配底部安全区
safeArea: {
......@@ -174,8 +174,7 @@
_animation(type) {
if (!this.$refs['fui_asm_ani'] || !this.$refs['fui_as_ani']) return;
let styles = {
transform: `translateY(${type ? '0' : '100%'})`,
opacity: type ? 1 : 0
transform: `translateY(${type ? '0' : '100%'})`
}
animation.transition(
this.$refs['fui_asm_ani'].ref, {
......@@ -247,7 +246,6 @@
transition: all 0.25s ease-in-out;
/* #endif */
/* #ifdef APP-NVUE */
transition-property: transform;
transform: translateY(100%);
/* #endif */
transform-origin: center center;
......@@ -280,12 +278,12 @@
.fui-actionsheet__tips {
/* #ifndef APP-NVUE */
width: 100%;
display: flex;
box-sizing: border-box;
/* #endif */
flex: 1;
padding: 40rpx 60rpx;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
font-weight: normal;
......
src/components/FirstUI/fui-alert/fui-alert.vue
......@@ -16,9 +16,9 @@
<view class="fui-alert__shrink">
<slot name="right"></slot>
</view>
<icon @tap.stop="close" type="cancel" :size="closeSize" :color="closeColor" v-if="closable"
:class="{'fui-alert__icon-close':desc}">
</icon>
<view :class="{'fui-alert__icon-close':desc}" v-if="closable">
<icon @tap.stop="close" type="cancel" :size="closeSize" :color="closeColor"></icon>
</view>
</view>
</template>
......
src/components/FirstUI/fui-backdrop/fui-backdrop.vue
......@@ -48,7 +48,7 @@
},
zIndex: {
type: Number,
default: 999
default: 980
},
closable: {
type: Boolean,
......@@ -67,11 +67,13 @@
},
mounted() {
this.$nextTick(() => {
if (this.show) {
this._ani(true)
} else {
this._aniHidden(this.show)
}
setTimeout(() => {
if (this.show) {
this._ani(true)
} else {
this._aniHidden(this.show)
}
}, 50)
})
},
data() {
......@@ -153,10 +155,13 @@
display: flex;
visibility: hidden;
transition: all 0.3s;
opacity: 0;
/* #endif */
align-items: center;
justify-content: center;
opacity: 0;
/* #ifdef APP-NVUE */
opacity: 0.001;
/* #endif */
}
/* #ifndef APP-NVUE */
......
src/components/FirstUI/fui-backtop/fui-backtop.vue
......@@ -8,6 +8,9 @@
</template>
<script>
// #ifdef APP-NVUE
const dom = weex.requireModule('dom')
// #endif
//非easycom模式取消注释引入字体组件，按实际路径进行调整
// import fuiIcon from "@/components/firstui/fui-icon/fui-icon.vue"
export default {
......@@ -21,8 +24,10 @@
type: [Number, String]
},
targetRef: {
type: String,
default: ''
type: [String, Object],
default () {
return {}
}
},
threshold: {
type: [Number, String],
......@@ -110,7 +115,13 @@
/* #endif */
position: fixed;
z-index: 888;
/* #ifndef APP-NVUE */
box-shadow: 0 0 6px rgb(0 0 0 / 12%);
/* #endif */
/* #ifdef APP-NVUE */
box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
/* #endif */
justify-content: center;
align-items: center;
/* #ifdef H5 */
......
src/components/FirstUI/fui-badge/fui-badge.vue
......@@ -6,6 +6,7 @@
</template>
<script>
const sys = uni.getSystemInfoSync()
export default {
name: "fui-badge",
emits: ['click'],
......@@ -113,6 +114,22 @@
this.getWidth()
},
methods: {
_getTextWidth(text) {
let sum = 0;
for (let i = 0, len = text.length; i < len; i++) {
if (text.charCodeAt(i) >= 0 && text.charCodeAt(i) <= 255)
sum = sum + 1;
else
sum = sum + 2;
}
const px = uni.upx2px(text.length > 1 ? 32 : 24)
var strCode = text.charCodeAt();
let multiplier = 12;
if (strCode >= 65 && strCode <= 90) {
multiplier = 15;
}
return (sum / 2 * multiplier) + px + 'px';
},
getWidth() {
let max = Number(this.max)
let val = Number(this.value)
......@@ -123,7 +140,7 @@
value = val > max ? `${max}+` : val
}
this.showValue = value;
this.width = this.dot ? '8px' : ((String(value).length * 16 + 21) + 'rpx')
this.width = this.dot ? '8px' : this._getTextWidth(String(value))
},
handleClick() {
this.$emit('click');
......@@ -149,6 +166,7 @@
flex-direction: row;
align-items: center;
justify-content: center;
text-align: center;
z-index: 10;
}
......
src/components/FirstUI/fui-banner-arc/fui-banner-arc.vue
......@@ -9,7 +9,7 @@
<!-- #endif -->
<!-- #ifdef APP-NVUE -->
<view class="fui-banner__arc-inner"
:style="{background:background,height:width+'rpx',width:width+'px',paddingLeft:(width-bannerWidth)/2+'px',paddingRight:(width-bannerWidth)/2+'px',left:'-'+(width-bannerWidth)/2+'px'}">
:style="{background:background,height:width+'px',width:width+'px',paddingLeft:(width-bannerWidth)/2+'px',paddingRight:(width-bannerWidth)/2+'px',left:'-'+(width-bannerWidth)/2+'px'}">
<slot></slot>
</view>
<!-- #endif -->
......@@ -89,11 +89,6 @@
},
// #endif
methods: {
getPercent(val) {
//最低值120
val = Number(val || 0)
return val < 120 ? 120 : val
},
initArcWidth() {
let ratio = Number(this.ratio || 0)
......@@ -153,6 +148,7 @@
border-top-right-radius: 0;
border-bottom-right-radius: 10000px;
border-bottom-left-radius: 10000px;
justify-content: flex-end;
/* #endif */
overflow: hidden;
}
......
src/components/FirstUI/fui-bottom-popup/fui-bottom-popup.vue
......@@ -40,7 +40,7 @@
},
zIndex: {
type: [Number, String],
default: 1001
default: 996
},
//点击遮罩 是否可关闭
maskClosable: {
......@@ -146,7 +146,7 @@
}
}
);
//android 部分手机隐藏时动画有抖动感，调整duration去动画
//nvue android 部分手机隐藏时动画有抖动感，调整duration去动画
animation.transition(
this.$refs['fui_bp_ani'].ref, {
styles: {
......@@ -189,8 +189,13 @@
visibility: hidden;
border-bottom-width: 0;
overflow: hidden;
/* #endif */
opacity: 0;
/* #endif */
/* #ifdef APP-NVUE */
opacity: 0.001;
/* #endif */
}
/* #ifdef APP-NVUE */
......
src/components/FirstUI/fui-bubble-box/fui-bubble-box.vue
......@@ -95,7 +95,7 @@
},
zIndex: {
type: [Number, String],
default: 1001
default: 997
},
background: {
type: String,
......@@ -491,7 +491,7 @@
/* #endif */
/* #ifdef APP-NVUE */
transform: rotate(45deg) translateY(6.5px);
transform: rotate(45deg) translateX(6.5px);
/* #endif */
}
......
src/components/FirstUI/fui-calendar/fui-calendar.vue
......@@ -25,7 +25,7 @@
<!-- #endif -->
</view>
<swiper :indicator-dots="false" :autoplay="false" :current="defCurrent" :duration="300" :vertical="vertical"
@change="swiperChange" class="fui-calendar__swiper" v-if="isMultiple">
@change="swiperChange" class="fui-calendar__swiper" style="height: 648rpx;" v-if="isMultiple">
<swiper-item v-for="(item,index) in monthArr" :key="item.key">
<view class="fui-calendar__date-wrap">
<view class="fui-calendar__date" :style="{width:itemWidth}" :class="['fui-calendar__dh']"
......@@ -92,6 +92,11 @@
return []
}
},
//v2.0.0+ 最多可选天数，type=2 || type=3有效
maxDays: {
type: [Number, String],
default: -1
},
minDate: {
type: String,
default: '2010-01-01'
......@@ -238,7 +243,7 @@
},
itemWidth() {
// #ifdef APP-NVUE
return (Number(this.dateWidth.replace('px', '')) - 1) / 7 + 'px'
return (Number(this.dateWidth.replace('px', '').replace('%','')) - 1) / 7 + 'px'
// #endif
// #ifndef APP-NVUE
......@@ -516,6 +521,12 @@
return `${arr[0]}-${this.formatNum(arr[1])}-${this.formatNum(arr[2])}`
})
this.values = value;
} else {
this.year = year;
if (this._isDisAbled(month - 1, day - 1)) {
year = this.maxArr[0]
month = this.maxArr[1]
}
}
this.year = year;
this.month = month;
......@@ -599,6 +610,18 @@
}
let ets = new Date(date.replace(/\-/g, '/')).getTime()
if (start && values.length === 1 && sts <= ets) {
const dateMax = `${date} 23:59:59`
const etsMill = new Date(dateMax.replace(/\-/g, '/')).getTime()
const diff = etsMill - sts
const diffDays = Math.ceil(diff / 1000 / 60 / 60 / 24)
const maxDays = Number(this.maxDays)
if ((maxDays && maxDays > 0 && diffDays > maxDays) || maxDays === 0) {
uni.showToast({
title: `最多可选${maxDays}天，当前已超出可选范围`,
icon: 'none'
});
return;
}
values.push(date)
} else {
values = [date]
......@@ -608,6 +631,14 @@
if (idx != -1) {
values.splice(idx, 1)
} else {
const maxDays = Number(this.maxDays)
if ((maxDays && maxDays > 0 && values.length >= maxDays) || maxDays === 0) {
uni.showToast({
title: `最多可选${maxDays}天`,
icon: 'none'
});
return;
}
if (type == 2) {
values.push(date)
} else {
......
src/components/FirstUI/fui-card/fui-card.vue
<template>
<!--nvue下， Android平台阴影设置elevation值-->
<view class="fui-card__wrap"
:class="{'fui-card__full':full,'fui-card__border':showBorder,'fui-card__border-radius':showBorder && !isNvue && !full}"
:style="{marginTop:margin[0] || 0,marginRight:margin[1] || 0,marginBottom:margin[2] || margin[0] || 0,marginLeft:margin[3] || margin[1] || 0,background:background,borderRadius:radius,'box-shadow':shadow,borderColor:isNvue?borderColor:'transparent'}"
:elevation="showBorder?'0px':elevation" @tap="handleClick">
:style="{marginTop:margin[0] || 0,marginRight:full?0: (margin[1] || 0),marginBottom:margin[2] || margin[0] || 0,marginLeft:full?0:(margin[3] || margin[1] || 0),background:background,borderRadius:full?0:radius,'box-shadow':showBorder?'none':shadow,borderColor:isNvue?borderColor:'transparent'}"
@tap="handleClick">
<view class="fui-card__header" v-if="tag || title || src" :class="{'fui-card__header-line':headerLine}"
:style="{'border-top-left-radius':full?0:radius,'border-top-right-radius':full?0:radius,'border-bottom-color':isNvue && headerLine?lineColor:'transparent',paddingTop:padding[0] || 0,paddingRight:padding[1]||0,paddingBottom:padding[2] || padding[0] || 0,paddingLeft:padding[3] || padding[1] || 0}">
:style="{'border-top-left-radius':full?0:radius,'border-top-right-radius':full?0:radius,'border-bottom-color':isNvue && headerLine?lineColor:'transparent',paddingTop:padding[0] || 0,paddingRight:padding[1]||0,paddingBottom:padding[2] || padding[0] || 0,paddingLeft:padding[3] || padding[1] || 0,background:headerBackground}">
<view class="fui-card__header-left">
<image :src="src" class="fui-card__header-thumb" mode="widthFix" v-if="src"
<image :src="src" class="fui-card__header-thumb" v-if="src"
:style="{height:height+'rpx',width:width+'rpx',borderRadius:imageRadius}"></image>
<text class="fui-card__header-title" :style="{fontSize:size+'rpx',color:color}"
v-if="title">{{title}}</text>
......@@ -53,16 +52,11 @@
type: String,
default: '16rpx'
},
//阴影：nvue下，android无效
//阴影：nvue下
shadow: {
type: String,
default: '0 2rpx 4rpx 0 rgba(2, 4, 38, 0.05)'
},
//仅android且nvue下有效，box-shadow失效
elevation: {
type: String,
default: '5px'
},
//是否显示card 边框，为true时box-shadow失效
showBorder: {
type: Boolean,
......@@ -71,7 +65,7 @@
//边框颜色，仅nvue下生效
borderColor: {
type: String,
default: '#EEEEEE'
default: 'red'
},
headerBackground: {
type: String,
......@@ -170,18 +164,21 @@
<style scoped>
.fui-card__wrap {
/* #ifndef APP-NVUE */
overflow: hidden;
flex: 1;
box-sizing: border-box;
/* #endif */
overflow: hidden;
}
/* #ifndef APP-NVUE */
.fui-card__full {
margin-left: 0 !important;
margin-right: 0 !important;
border-radius: 0 !important;
}
/* #endif */
/* #ifndef APP-NVUE */
.fui-card__full::after {
border-radius: 0 !important;
......@@ -229,7 +226,9 @@
box-sizing: border-box;
overflow: hidden;
/* #endif */
/* #ifdef APP-NVUE */
flex: 1;
/* #endif */
flex-direction: row;
align-items: center;
justify-content: space-between;
......@@ -309,6 +308,7 @@
flex: 1;
/* #endif */
/* #ifndef APP-NVUE */
width: 100%;
box-sizing: border-box;
/* #endif */
}
......@@ -318,6 +318,7 @@
flex: 1;
/* #endif */
/* #ifndef APP-NVUE */
width: 100%;
box-sizing: border-box;
/* #endif */
}
......
src/components/FirstUI/fui-cascader/fui-cascader.vue
<template>
<view class="fui-cascader__wrap">
<view class="fui-cascader__header-wrap">
<scroll-view scroll-x scroll-with-animation :show-scrollbar="false" :scroll-into-view="scrollViewId"
<scroll-view :scroll-x="true" scroll-with-animation :show-scrollbar="false" :scroll-into-view="scrollViewId"
:style="{ background: headBackground }" class="fui-cascader__scroll">
<view class="fui-cascader__header" :style="{ height: headHeight+'rpx'}">
<view class="fui-cascader__header-item" :id="`fui_cr_${idx}`" v-for="(item, idx) in selectedArr"
......@@ -435,6 +435,7 @@
width: 100%;
/* #endif */
/* #ifdef APP-NVUE */
flex: 1;
flex-direction: row;
/* #endif */
}
......@@ -453,6 +454,7 @@
/* #endif */
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.fui-cascader__header-item {
......
src/components/FirstUI/fui-circle/fui-circle.vue
......@@ -6,10 +6,11 @@
<!-- #ifdef APP-VUE || H5 -->
<canvas :start="percentage" :change:start="parse.init" :width="w" :change:width="parse.widthChange"
:sw="strokeWidth" :change:sw="parse.widthChange" :data-width="w" :data-sw="strokeWidth" :data-lc="lineCap"
:data-size="size" :data-percent="percentage" :data-color="color || primaryColor" :data-show="show" :data-ds="defaultShow"
:data-background="background" :data-foreground="foreground || primaryColor" :data-gradient="gradient" :data-sa="sAngle"
:data-ccw="counterclockwise" :data-speed="speed" :data-am="activeMode" :data-cid="circleId"
:canvas-id="circleId" :class="[circleId]" :style="{width: w + 'px',height: w + 'px'}"></canvas>
:data-size="size" :data-percent="percentage" :data-color="color || primaryColor" :data-show="show"
:data-ds="defaultShow" :data-background="background" :data-foreground="foreground || primaryColor"
:data-gradient="gradient" :data-sa="sAngle" :data-ccw="counterclockwise" :data-speed="speed"
:data-am="activeMode" :data-cid="circleId" :canvas-id="circleId" :class="[circleId]"
:style="{width: w + 'px',height: w + 'px'}"></canvas>
<!-- #endif -->
<!-- #ifdef MP -->
......@@ -282,11 +283,13 @@
// #ifdef APP-NVUE
mounted() {
//以下代码写在nvue.js中 android端可能会出现canvas大小不受控制
let ganvas = this.$refs[this.circleId];
let canvas = enable(ganvas, {
bridge: WeexBridge
});
this.context = canvas.getContext('2d');
setTimeout(() => {
let ganvas = this.$refs[this.circleId];
let canvas = enable(ganvas, {
bridge: WeexBridge
});
this.context = canvas.getContext('2d');
}, 50);
},
// #endif
methods: {
......
src/components/FirstUI/fui-circle/nvue.js
......@@ -29,10 +29,12 @@ export default {
created() {
let sys = uni.getSystemInfoSync()
this.isAndroid = sys.platform.toLocaleLowerCase() == "android"
this.fontSize=this.isAndroid ? Number(this.size) : Number(this.size) * sys.pixelRatio
this.fontSize = this.isAndroid ? Number(this.size) : Number(this.size) * sys.pixelRatio
},
mounted() {
this.init(true);
setTimeout(() => {
this.init(true);
}, 50);
},
// #ifndef VUE3
beforeDestroy() {
......@@ -124,7 +126,8 @@ export default {
ctx.setLineCap(this.lineCap);
ctx.beginPath();
let radius = this.w / 2;
ctx.arc(radius, radius, radius - Number(this.strokeWidth), Number(this.sAngle)* Math.PI, eAngle, this.counterclockwise);
ctx.arc(radius, radius, radius - Number(this.strokeWidth), Number(this.sAngle) * Math.PI, eAngle, this
.counterclockwise);
ctx.stroke();
!def && ctx.draw();
}
......
src/components/FirstUI/fui-collapse-item/fui-collapse-item.vue
......@@ -5,7 +5,8 @@
<view class="fui-collapse__title">
<slot></slot>
</view>
<view v-if="arrow" :class="{'fui-collapse__arrow-active': isOpen, 'fui-collapse__item-ani': animation}"
<view v-if="arrow"
:class="{'fui-collapse__arrow-close':!isOpen,'fui-collapse__arrow-active': isOpen, 'fui-collapse__item-ani': animation}"
class="fui-collapse__arrow" :style="{marginRight:arrowRight+'rpx'}">
<view class="fui-collapse__arrow-inner" :style="{borderColor:arrowColor}"></view>
</view>
......@@ -122,7 +123,9 @@
},
updated(e) {
this.$nextTick(() => {
this.init()
setTimeout(() => {
this.init()
}, 50)
})
},
created() {
......@@ -145,8 +148,12 @@
},
// #endif
mounted() {
this.isOpen = this.open;
this.init()
this.$nextTick(() => {
setTimeout(() => {
this.init()
this.isOpen = this.open;
}, 50)
})
},
methods: {
init() {
......@@ -285,10 +292,8 @@
}
.fui-collapse__title {
/* #ifndef APP-NVUE */
width: 100%;
/* #endif */
flex: 1;
overflow: hidden;
}
......@@ -309,13 +314,16 @@
.fui-collapse__arrow {
width: 40rpx;
height: 40rpx;
transform: rotate(0deg);
position: relative;
/* #ifndef APP-NVUE */
flex-shrink: 0;
/* #endif */
}
.fui-collapse__arrow-close {
transform: rotate(0deg);
}
.fui-collapse__arrow-active {
transform: rotate(180deg);
}
......
src/components/FirstUI/fui-copy-text/fui-copy-text.vue
<template>
<view class="fui-copy__text-wrap">
<!-- #ifndef MP-ALIPAY -->
<text ref="fui_ct__el" :selectable="false" class="fui-copy__text" @longpress.stop="handleCopy" @mousedown="handleCopyByPC"
<!-- #ifndef MP-ALIPAY || APP-NVUE -->
<text ref="fui_ct__el" :selectable="false" class="fui-copy__text" @longpress.stop="handleCopy"
@mousedown="handleCopyByPC"
:style="{ color: color, fontSize: size + 'rpx', fontWeight: fontWeight, background: showTooltip ? background : 'transparent' }">{{ text }}</text>
<!-- #endif -->
<!-- #ifdef APP-NVUE -->
<text ref="fui_ct__el" class="fui-copy__text" @longpress.stop="handleCopy" @mousedown="handleCopyByPC"
:style="{ color: color, fontSize: size + 'rpx', fontWeight: fontWeight, background: showTooltip ? background : 'transparent' }">{{ text }}</text>
<!-- #endif -->
<!-- #ifdef MP-ALIPAY -->
<view ref="fui_ct__el" class="fui-copy__text" @longpress.stop="handleCopy"
:style="{ color: color, fontSize: size + 'rpx', fontWeight: fontWeight, background: showTooltip ? background : 'transparent' }">
{{ text }}</view>
{{ text }}
</view>
<!-- #endif -->
<!-- #ifndef APP-NVUE -->
<view v-if="showTooltip" class="fui-copy__tooltip-list"
......
src/components/FirstUI/fui-count-down/fui-count-down.vue
......@@ -141,6 +141,11 @@
this.clearTimer();
this.time = Number(val) || 0;
this.countDown(this.time);
if (this.returnTime) {
this.$emit('time', {
seconds: this.time
});
}
setTimeout(() => {
if (this.autoStart) {
this.startCountdown();
......@@ -167,6 +172,11 @@
this.countDown(this.time);
//注意：如果初始化值确实为0，可在页面自行判断结束或手动调用结束方法
if (this.time > 0 && this.autoStart) {
if (this.returnTime) {
this.$emit('time', {
seconds: this.time
});
}
this.startCountdown();
}
},
......@@ -241,6 +251,7 @@
},
startCountdown: function() {
this.clearTimer();
//初始化值为0时不会执行此方法，请看mounted中判断与提示
if (this.time <= 0) {
this.endCountdown();
return;
......@@ -251,22 +262,27 @@
// #endif
this.countdown = setInterval(() => {
this.time--;
if (this.time < 0) {
this.endCountdown();
return;
}
this.countDown(this.time);
if (this.returnTime) {
this.$emit('time', {
seconds: this.time
});
}
if (this.time <= 0) {
this.endCountdown();
return;
}
}, 1000);
},
resetCountdown(seconds = 0) {
this.time = seconds || Number(this.value);
this.clearTimer();
this.countDown(this.time);
if (this.returnTime) {
this.$emit('time', {
seconds: this.time
});
}
if (this.autoStart) {
this.startCountdown();
}
......
src/components/FirstUI/fui-cubic-bezier/fui-cubic-bezier.vue
......@@ -162,7 +162,7 @@
// #ifdef APP-NVUE
this.style_x +=
`transform:translate(${diff.x}px,0px);`;
this.style_y = `transform:translate(0px,${diff.y}px);`;
this.style_y = `transform:translate(0px,${diff.y+this.navH}px);`;
// #endif
// #ifndef APP-NVUE
......
src/components/FirstUI/fui-data-tag/fui-data-tag.vue
......@@ -5,7 +5,8 @@
:style="{width:width?width+'rpx':'auto',height:height?height+'rpx':'auto',paddingTop:padding[0] || 0,paddingRight:padding[1] || 0,paddingBottom:padding[2] || padding[0] || 0,paddingLeft:padding[3] || padding[1] || 0,borderRadius:radius+'rpx',marginRight:gap+'rpx',marginBottom:gap+'rpx',background:item.selected?activeBgColor:background,borderColor:item.selected?(borderColor || primaryColor):(defaultBorderColor || background)}"
v-for="(item,index) in dataList" :key="index">
<view class="fui-data__tag-inner" @tap.stop="handleClick(index)">
<text class="fui-dt__icon" :style="{color:markColor || primaryColor,fontSize:markSize+'rpx',lineHeight:markSize+'rpx'}"
<text class="fui-dt__icon"
:style="{color:markColor || primaryColor,fontSize:markSize+'rpx',lineHeight:markSize+'rpx'}"
v-if="mark && item.selected">{{icon}}</text>
</view>
<text class="fui-data__tag-text"
......@@ -17,7 +18,8 @@
<view class="fui-data__tag-item" :class="{'fui-data__tag-disable':item.disable}"
:style="{width:width?width+'rpx':'auto',height:height?height+'rpx':'auto',paddingTop:padding[0] || 0,paddingRight:padding[1] || 0,paddingBottom:padding[2] || padding[0] || 0,paddingLeft:padding[3] || padding[1] || 0,borderRadius:radius+'rpx',marginRight:gap+'rpx',marginBottom:gap+'rpx',background:item.selected?activeBgColor:background,borderColor:item.selected?(borderColor || primaryColor):defaultBorderColor || background}"
v-for="(item,index) in dataList" :key="index" @tap.stop="handleClick(index)">
<text class="fui-dt__icon" :style="{color:markColor || primaryColor,fontSize:markSize+'rpx',lineHeight:markSize+'rpx'}"
<text class="fui-dt__icon"
:style="{color:markColor || primaryColor,fontSize:markSize+'rpx',lineHeight:markSize+'rpx'}"
v-if="mark && item.selected">{{icon}}</text>
<text class="fui-data__tag-text"
:style="{fontSize:size+'rpx',lineHeight:size+'rpx',color:item.selected?(activeColor || primaryColor):color}">{{item.text}}</text>
......@@ -213,12 +215,14 @@
const min = Number(this.min)
if (this.val === model.value && min > 0) return;
let val = '';
let i = index
let i = index;
let entity = {}
this.dataList.forEach((item, idx) => {
if (idx === index) {
const bool = this.val === item.value && min <= 0
val = bool ? '' : item.value
i = bool ? -1 : index
entity = bool ? {} : item
item.selected = bool ? false : true
} else {
item.selected = false
......@@ -228,7 +232,8 @@
let e = {
detail: {
index: i,
value: val
value: val,
item: entity
}
}
this.emitsChange(e)
......@@ -298,9 +303,11 @@
}
}
this.vals = vals
const entity = this.dataList.filter(item => vals.indexOf(item.value) != -1)
let e = {
detail: {
value: vals
value: vals,
item: entity
}
}
this.emitsChange(e)
......
src/components/FirstUI/fui-date-picker/fui-date-picker.vue
......@@ -10,12 +10,12 @@
:class="{'fui-dpk__header-dark':theme==='dark','fui-date__picker-radius':radius}" :style="headerStyl">
<text class="fui-dpk_btn-cancel"
:class="[theme==='dark'?'fui-dpk__cancel-color_dark':'fui-dpk__cancel-color']" :style="cancelStyl"
@tap.stop="btnCancel">取消</text>
@tap.stop="btnCancel">{{cancelText}}</text>
<text class="fui-date__picker-title"
:class="[theme==='dark'?'fui-dpk__title-color_dark':'fui-dpk__title-color']"
:style="titleStyl">{{title}}</text>
<text class="fui-dpk__btn-sure" :class="{'fui-dpk__sure-color':!confirmColor}" :style="confrimStyl"
@tap.stop="btnConfirm">确定</text>
@tap.stop="btnConfirm">{{confirmText}}</text>
</view>
<view class="fui-dpk__range-wrap" v-if="range">
<view class="fui-dpk__range-inner"
......@@ -383,7 +383,7 @@
},
zIndex: {
type: [Number, String],
default: 999
default: 996
},
//点击确认按钮后是否立即关闭弹框
isClose: {
......@@ -402,13 +402,11 @@
},
// #ifdef APP-NVUE
mounted() {
if (!this.$refs['fui_dpkm_ani'] || !this.$refs['fui_dpk_ani']) return;
this._transtion('fui_dpkm_ani', {
transform: 'translateX(-100%)'
}, 0)
this._transtion('fui_dpk_ani', {
transform: 'translateY(100%)'
}, 0)
this.$nextTick(() => {
setTimeout(() => {
this.hiddenNvuePicker()
}, 50)
})
},
// #endif
computed: {
......@@ -536,6 +534,7 @@
minutes: [],
seconds: [],
vals: [],
nvueVals: [],
values: [],
minArr: [],
maxArr: [],
......@@ -558,6 +557,17 @@
};
},
methods: {
// #ifdef APP-NVUE
hiddenNvuePicker() {
if (!this.$refs['fui_dpkm_ani'] || !this.$refs['fui_dpk_ani']) return;
this._transtion('fui_dpkm_ani', {
transform: 'translateX(-100%)'
}, 0)
this._transtion('fui_dpk_ani', {
transform: 'translateY(100%)'
}, 0)
},
// #endif
initialize() {
this.reset();
this.getDefaultOptions(this.value)
......@@ -593,6 +603,9 @@
this.isActive = 1;
this.startDate = {}
this.endDate = {}
// #ifdef APP-NVUE
this.nvueVals = [...this.vals]
// #endif
},
open() {
this.isShow = true;
......@@ -866,6 +879,9 @@
[hi, mi, si],
[mi, si]
][type - 1]
// #ifdef APP-NVUE
this.nvueVals = [...this.vals]
// #endif
}, 220)
})
},
......@@ -957,6 +973,9 @@
} else {
data = this.getResult()
}
// #ifdef APP-NVUE
this.nvueVals = [...this.vals];
// #endif
setTimeout(() => {
this.$emit('change', data)
}, 0)
......@@ -1017,10 +1036,11 @@
}, 80)
},
pickerChange(e) {
// isInitShow 是为了避免 app端初始化时自行执行change事件
if (!this.isInitShow) return;
//1-年 2-年月 3-年月日 4-年月日 时 5-年月日 时分 6-时分 7-时分秒 8-分秒
let value = e.detail.value;
let type = Number(this.type)
const layer = [1, 2, 3, 4, 5, 2, 3, 2][type - 1]
if (!this.isInitShow || value.length != layer) return;
if (type > 1 && type < 6) {
if (value[0] != this.vals[0]) {
this.getMonths(value[0])
......@@ -1055,6 +1075,7 @@
// #ifdef APP-NVUE
openPicker() {
setTimeout(() => {
this.vals = [...this.nvueVals];
this._animation(true);
}, 20);
},
......@@ -1115,13 +1136,14 @@
/* #ifndef APP-NVUE */
transition: all 0.25s ease-in-out;
visibility: hidden;
opacity: 0;
/* #endif */
/* #ifdef APP-NVUE */
transition-property: opacity;
transition-timing-function: ease-in-out;
transition-duration: .25s;
opacity: 0.001;
/* #endif */
opacity: 0;
}
.fui-dpk__mask-show {
......@@ -1146,10 +1168,9 @@
/* #endif */
/* #ifdef APP-NVUE */
transition-property: opacity;
transition-property: transform;
transition-duration: .25s;
transform: translateY(100%);
/* opacity: 0; */
/* #endif */
transform-origin: center center;
flex-direction: column;
......@@ -1161,9 +1182,8 @@
transform: translate3d(0, 0, 0);
visibility: visible;
/* #endif */
/* #ifdef APP-NVUE */
opacity: 1;
transform: translateY(0);
/* #endif */
}
......@@ -1366,7 +1386,9 @@
/* #ifndef APP-NVUE */
width: 100%;
/* #endif */
/* #ifdef APP-NVUE */
flex: 1;
/* #endif */
height: 520rpx;
}
......
src/components/FirstUI/fui-dialog/fui-dialog.vue
......@@ -149,7 +149,7 @@
<style scoped>
.fui-dialog__wrap {
position: fixed;
z-index: 1000;
z-index: 996;
top: 0;
right: 0;
left: 0;
......
src/components/FirstUI/fui-digital-keyboard/fui-digital-keyboard.vue
......@@ -7,17 +7,17 @@
<view class="fui-digital__keyboard-left">
<view class="fui-dk__left-wrap" v-for="(item,index) in items" :key="item.id">
<view class="fui-dk__grid-left" v-for="(val,idx) in item.keys" :key="idx">
<text :style="{fontSize:`${index===3 && idx===0? spareSize:40}rpx`}"
<text :key="theme" :style="{fontSize:`${index===3 && idx===0? spareSize:40}rpx`}"
class="fui-digital__keyboard-key"
:class="{'fui-dk__key-dark':theme==='dark','fui-dk__highlight-dark':theme==='dark' && val,'fui-dk__highlight':theme==='light' && val}"
:class="{'fui-dk__key-dark':theme==='dark','fui-dk__key-light':theme!=='dark','fui-dk__highlight-dark':theme==='dark','fui-dk__highlight':theme==='light' && val}"
@tap.stop="keyClick(index,idx,val)">{{val}}</text>
</view>
</view>
</view>
<view class="fui-digital__keyboard-right">
<view class="fui-dk__grid-right">
<view class="fui-digital__keyboard-key fui-dk__highlight"
:class="{'fui-dk__key-dark':theme==='dark','fui-dk__highlight-dark':theme==='dark'}"
<view :key="theme" class="fui-digital__keyboard-key"
:class="{'fui-dk__key-dark':theme==='dark','fui-dk__key-light':theme!=='dark','fui-dk__highlight-dark':theme==='dark','fui-dk__highlight':theme!=='dark'}"
@tap.stop="backspace">
<fui-icon :name="name" :size="56" :color="theme==='dark'?'#d1d1d1':'#333'"></fui-icon>
</view>
......@@ -265,7 +265,7 @@
transform-origin: center center;
/* #ifdef APP-NVUE */
transform: translate(0, 100%);
opacity: 0;
opacity: 0.01;
border-top-style: solid;
border-top-width: 0.5px;
/* #endif */
......@@ -334,7 +334,9 @@
width: 100%;
display: flex;
/* #endif */
/* #ifdef APP-NVUE */
flex: 1;
/* #endif */
flex-direction: row;
padding-top: 16rpx;
}
......@@ -364,7 +366,9 @@
width: 100%;
display: flex;
/* #endif */
/* #ifdef APP-NVUE */
flex: 1;
/* #endif */
flex-direction: row;
align-items: center;
justify-content: space-between;
......@@ -447,35 +451,40 @@
flex-shrink: 0;
overflow: hidden;
/* #endif */
/* #ifdef APP-NVUE */
flex: 1;
/* #endif */
font-size: 40rpx;
font-weight: 600;
height: 88rpx;
/* #ifdef APP-NVUE */
line-height: 88rpx;
/* #endif */
background: #fff;
border-radius: 8rpx;
align-items: center;
justify-content: center;
/* #ifdef H5 */
cursor: pointer;
/* #endif */
color: #181818;
text-align: center;
}
.fui-dk__key-light {
background-color: #fff;
color: #181818;
}
.fui-dk__key-dark {
background: #222;
background-color: #222;
color: #D1D1D1;
}
.fui-dk__highlight:active {
background: rgba(0, 0, 0, .2);
background-color: rgba(0, 0, 0, .2);
}
.fui-dk__highlight-dark:active {
background: #333 !important;
background-color: #333 !important;
}
/* #ifndef APP-NVUE */
......
src/components/FirstUI/fui-drawer/fui-drawer.vue
......@@ -61,7 +61,8 @@
return {
isNvue: isNvue,
isShow: false,
width: 0
width: 0,
isMounted: false
}
},
// #ifdef APP-NVUE
......@@ -79,12 +80,26 @@
},
// #endif
mounted() {
setTimeout(() => {
this._getSize((width) => {
this.width = width
})
}, 100)
this.isMounted = true
this.$nextTick(() => {
setTimeout(() => {
this._getSize((width) => {
this.width = width
})
}, 100)
})
},
// #ifdef H5
updated() {
if(!this.isMounted && !this.width){
setTimeout(() => {
this._getSize((width) => {
this.width = width
})
}, 50)
}
},
// #endif
methods: {
_getSize(callback) {
// #ifndef APP-NVUE
......
src/components/FirstUI/fui-dropdown-menu/fui-dropdown-menu.vue
......@@ -189,18 +189,20 @@
getStyles() {
let styles = `border-radius:${this.radius}rpx;background:${this.background};`
let right = Number(this.right || 0)
let left = Number(this.left || 0)
if (right >= 0) {
styles += 'right:0;'
} else {
// #ifndef APP-NVUE
styles += 'left:0;'
styles += `left:${left}rpx;`
// #endif
}
// #ifdef APP-NVUE
styles += `left:${this.n_left}px;top:${this.n_top}px;height:${this.maxHeight}rpx;`
if (this.direction === 'up') {
styles += `transform: translate(0, -${this.maxHeight}rpx);`
}
left = Math.floor(uni.upx2px(left))
styles += `left:${this.n_left+left}px;top:${this.n_top}px;height:${this.maxHeight}rpx;`
// if (this.direction === 'up') {
// styles += `transform: translate(0, -${this.maxHeight}rpx);`
// }
// #endif
return styles
},
......
src/components/FirstUI/fui-fab/fui-fab.vue
......@@ -260,23 +260,23 @@
// #endif
mounted() {
// #ifdef APP-NVUE
if (!this.$refs['fui_fab_ani']) return;
let styles = {
transform: 'scale(0)',
opacity: 0
}
animation.transition(
this.$refs['fui_fab_ani'].ref, {
styles,
duration: 0,
needLayout: false,
delay: 0
},
() => {}
);
// #endif
this.$nextTick(() => {
// #ifdef APP-NVUE
if (!this.$refs['fui_fab_ani']) return;
let styles = {
transform: 'scale(0)',
opacity: 0
}
animation.transition(
this.$refs['fui_fab_ani'].ref, {
styles,
duration: 0,
needLayout: false,
delay: 0
},
() => {}
);
// #endif
setTimeout(() => {
this._getSize()
}, 50);
......@@ -567,7 +567,9 @@
/* #ifdef APP-NVUE */
border-radius: 100px;
/* #endif */
/* #ifndef APP-NVUE */
box-shadow: 0 10rpx 14rpx 0 rgba(0, 0, 0, 0.1);
/* #endif */
align-items: center;
justify-content: center;
transform: rotate(0deg);
......
src/components/FirstUI/fui-filter-bar/fui-filter-bar.vue
......@@ -11,8 +11,14 @@
</view>
<fui-icon name="screen" :size="item.size || 28" :color="item.value?activeColor:color"
v-if="item.type==='filter'"></fui-icon>
<!-- #ifndef APP-NVUE -->
<fui-icon v-if="item.type==='switch'" :name="item.switch===1?'classify':'list'"
:size="item.size || (item.switch===1?46:60)" :color="item.active?activeColor:color"></fui-icon>
<!-- #endif -->
<!-- #ifdef APP-NVUE -->
<fui-icon v-if="item.type==='switch'" :name="item.switch===1?'classify':'list'" :size="item.size || 48"
:color="item.active?activeColor:color"></fui-icon>
<!-- #endif -->
<fui-icon v-if="item.type==='sort'" :name="item.sort===1?'turningup':'turningdown'"
:color="item.value?activeColor:color" :size="item.size || 28"></fui-icon>
</view>
......
src/components/FirstUI/fui-gallery/fui-gallery.vue
<template>
<view class="fui-gallery__wrap" :style="{zIndex:zIndex}" :class="[show?'fui-gallery__show':'fui-gallery__hidden']"
v-if="show || !isNvue" @tap.stop="hideGallery">
<swiper class="fui-gallery__img-wrap" :indicator-dots="false" @change="change" :current="defActive"
:autoplay="false" :duration="500">
<swiper-item class="fui-gallery__swiper-item" v-for="(item,index) in imgUrls" :key="index">
<image mode="aspectFit" class="fui-gallery__img" :src="item.src"></image>
v-if="show || !isNvue">
<swiper class="fui-gallery__img-wrap" :style="{height:height+'px'}" :indicator-dots="false" @change="change"
:current="defActive" :autoplay="false" :duration="500">
<swiper-item :style="{height:height+'px'}" v-for="(item,index) in imgUrls" :key="index">
<view class="fui-gallery__swiper-item" :style="{height:height+'px'}">
<image mode="aspectFit" class="fui-gallery__img" :style="{height:height+'px'}" :src="item.src"
@tap.stop="hideGallery"></image>
</view>
</swiper-item>
</swiper>
<view class="fui-gallery__index-wrap" :style="{top:top+'px'}">
......@@ -65,6 +68,7 @@
},
mounted() {
let sys = uni.getSystemInfoSync()
this.height = sys.windowHeight
this.top = sys.statusBarHeight + 20
// #ifdef APP-NVUE || MP-TOUTIAO
this.iphoneX = this.isPhoneX(sys)
......@@ -85,7 +89,8 @@
defActive: 0,
top: 20,
descr: '',
iphoneX: false
iphoneX: false,
height: 800
};
},
methods: {
......@@ -156,6 +161,9 @@
}
.fui-gallery__img-wrap {
/* #ifndef APP-NVUE */
width: 100%;
/* #endif */
flex: 1;
position: relative;
font-size: 0;
......@@ -163,6 +171,7 @@
.fui-gallery__swiper-item {
/* #ifndef APP-NVUE */
width: 100%;
display: flex;
/* #endif */
align-items: center;
......@@ -262,6 +271,5 @@
/* #ifdef APP-NVUE */
width: 750rpx;
/* #endif */
flex: 1;
}
</style>
src/components/FirstUI/fui-grid-item/fui-grid-item.vue
......@@ -100,7 +100,7 @@
box-sizing: border-box;
flex-shrink: 0;
/* #endif */
flex-direction: column;
/* #ifdef H5 */
cursor: pointer;
/* #endif */
......
src/components/FirstUI/fui-grid/fui-grid.vue
<template>
<view class="fui-grid__wrap" :class="[isShow?'fui-grid__wrap-show':'fui-grid__wrap-hidden']">
<view :id="elemId" ref="fui_grid" class="fui-grid" :class="{ 'fui-grid__border': showBorder }"
<view :id="elemId" ref="fui_grid" class="fui-grid"
:class="{ 'fui-grid__border': showBorder,'fui-grid__between':between }"
:style="{ 'border-left-color':borderColor,'border-top-color':borderColor}">
<slot></slot>
<!-- #ifndef APP-VUE || H5 || MP-WEIXIN -->
<template v-if="seats.length > 0 && between">
<view v-for="(item,index) in seats" :key="index"
:style="'width:'+width+';'+(height?'height:'+height:'')"></view>
</template>
<!-- #endif -->
</view>
</view>
</template>
......@@ -34,6 +41,17 @@
square: {
type: Boolean,
default: true
},
// item 项是否两端对齐，仅在宽度无法拉满且影响美观时使用，谨慎使用 v2.0.0+
between: {
type: Boolean,
default: false
},
//当数据无法铺满时，且设置了between 布局，末尾补足占位元素个数
//最后一行数据个数+emptyElements 不可大于 columns 值
emptyElements: {
type: [Number, String],
default: 0
}
},
provide() {
......@@ -47,15 +65,16 @@
elemId: elemId,
width: 0,
height: 0,
isShow: false
isShow: false,
seats: []
};
},
created() {
this.children = []
let sys = uni.getSystemInfoSync()
this.width = (100 / this.columns) + '%'
if(this.square){
this.height = (sys.windowWidth-1) / this.columns + 'px'
if (this.square) {
this.height = parseInt((sys.windowWidth - 1) / this.columns * 10) / 10 + 'px'
}
},
watch: {
......@@ -66,11 +85,15 @@
},
showBorder(val) {
this.childChange()
},
emptyElements(val) {
this.createEmptyEl(val)
}
},
mounted() {
this.$nextTick(() => {
this.init()
this.createEmptyEl(this.emptyElements)
})
},
methods: {
......@@ -85,6 +108,19 @@
})
}, 50)
},
createEmptyEl(val) {
// 百度小程序在页面循环数字有问题
const nums = Number(val)
let seats = []
if (nums && nums > 0) {
for (let i = 0; i < nums; i++) {
seats.push(i)
}
this.seats = seats
} else {
this.seats = []
}
},
childChange() {
this.children.forEach((item, index) => {
item.showBorder = this.showBorder
......@@ -110,8 +146,8 @@
.boundingClientRect()
.exec(ret => {
//使用 parseInt 不使用 Number 避免 部分android机 换行（小数渲染有兼容性问题） ，但是可能会出现误差无法铺满
//尽量让组件居中显示，视觉看起来左右对齐
const width = parseInt((ret[0].width - 1) / this.columns) + 'px'
let width = (ret[0].width - 1) / this.columns
width = (parseInt(width * 10) / 10) + 'px'
if (this.square)
this.height = width;
if (isNoSupported)
......@@ -124,8 +160,10 @@
// #endif
// #ifdef APP-NVUE
dom.getComponentRect(this.$refs['fui_grid'], (ret) => {
//使用 parseInt 不使用 Number 避免 部分android机 换行，但是可能会出现误差无法铺满
this.width = parseInt((ret.size.width - 1) / this.columns) + 'px'
//使用 parseInt 不使用 Number 可避免 部分android机 换行，但是可能会出现误差无法铺满
// 注：以真机测试为准，如果还有换行，则只能不保留小数
let width = (ret.size.width - 1) / this.columns
this.width = parseInt(width * 10) / 10 + 'px'
if (this.square) {
this.height = this.width;
}
......@@ -145,11 +183,17 @@
display: flex;
box-sizing: border-box;
/* #endif */
/* #ifdef APP-NVUE */
flex: 1;
/* #endif */
flex-direction: column;
/* 以下css可能导致数据过多nvue端直接白屏不显示 */
/* #ifndef APP-NVUE */
transition-property: opacity;
transition-duration: .2s;
transition-timing-function: ease-in-out;
/* #endif */
}
.fui-grid__wrap-hidden {
......@@ -157,7 +201,7 @@
}
.fui-grid__wrap-show {
opacity: 1;
opacity: 1 !important;
}
.fui-grid {
......@@ -169,6 +213,13 @@
flex-wrap: wrap;
}
/* #ifndef APP-VUE || H5 || MP-WEIXIN */
.fui-grid__between {
justify-content: space-between;
}
/* #endif */
.fui-grid__border {
position: relative;
/* #ifdef APP-NVUE */
......
src/components/FirstUI/fui-horizontal-scroll/fui-horizontal-scroll.vue
......@@ -108,7 +108,8 @@
//滚动条滑块长度
blockWidth: 0,
blockHeight: 0,
transform: ''
transform: '',
isMounted: false
};
},
created() {
......@@ -117,10 +118,20 @@
this.blockHeight = this.getPx(this.scrollHeight || 8)
},
mounted() {
this.isMounted = true
this.$nextTick(() => {
this.init()
})
},
// #ifdef H5
updated() {
if(!this.isMounted && !this.width){
setTimeout(() => {
this.init()
}, 0)
}
},
// #endif
watch: {
scrollWidth(val) {
this.bgWidth = this.getPx(val || 96)
......
src/components/FirstUI/fui-image-cropper/fui-image-cropper.vue
......@@ -2,7 +2,8 @@
<view class="fui-image__cropper" @touchmove.stop.prevent="stop">
<!-- #ifdef APP-VUE || MP-WEIXIN || H5 -->
<image @touchstart="handler.touchstart" @touchmove="handler.touchmove" @touchend="handler.touchend"
@mousedown="handler.mousedown" class="fui-cropper__img" :class="{'fui-cropper__img-hidden':!src}" :src="src"
@mousedown="handler.mousedown" class="fui-cropper__img"
:class="{'fui-cropper__img-hidden':!src || !initVal}" :src="src"
:style="{width: (imgWidth ? imgWidth : width) + 'px',height: imgHeight ? imgHeight + 'px' : 'auto',transitionDuration: ani ?'0.25s' : '0s'}"
mode="widthFix">
</image>
......@@ -14,7 +15,8 @@
</image>
<!-- #endif -->
<!-- #ifndef APP-PLUS || MP-WEIXIN || H5 -->
<image @touchstart="touchstart" @touchmove="touchmove" @touchend="touchend" class="fui-cropper__img" :class="{'fui-cropper__img-hidden':!src}" :src="src"
<image @touchstart="touchstart" @touchmove="touchmove" @touchend="touchend" class="fui-cropper__img"
:class="{'fui-cropper__img-hidden':!src || !initVal}" :src="src"
:style="{width: (imgWidth ? imgWidth : width) + 'px',height: imgHeight ? imgHeight + 'px' : 'auto',transitionDuration: ani ?'0.25s' : '0s',transform:getTransform}"
mode="widthFix">
</image>
......@@ -60,7 +62,7 @@
<!-- #ifndef APP-NVUE -->
<canvas canvas-id="fui_image_cropper" id="fui_image_cropper" :disable-scroll="true"
:style="{ width: width * scaleRatio + 'px', height: height * scaleRatio + 'px' }"
:style="{ width: nWidth * nScaleRatio + 'px', height: nWidth * nScaleRatio + 'px' }"
class="fui-cropper__canvas"></canvas>
<!-- #endif -->
</view>
......@@ -138,6 +140,15 @@
this.ani = false;
}, 220);
}
},
scaleRatio(val) {
this.nScaleRatio = Number(val) || 2
},
width(val) {
this.nWidth = Number(val) || 280
},
height(val) {
this.nHeight = Number(val) || 280
}
},
data() {
......@@ -158,13 +169,19 @@
naturalWidth: 0,
naturalHeight: 0,
picturePath: '',
rotateAngle: 0
rotateAngle: 0,
nScaleRatio: 2,
nWidth: 280,
nHeight: 280
};
},
created() {
this.cutTimer = null;
this.aniTimer = null;
this.ctx = null;
this.nScaleRatio = Number(this.scaleRatio) || 2
this.nWidth = Number(this.width) || 280
this.nHeight = Number(this.height) || 280
},
mounted() {
let sys = uni.getSystemInfoSync();
......@@ -172,14 +189,16 @@
this.windowWidth = sys.windowWidth
this.imgTop = sys.windowHeight / 2;
this.imgLeft = sys.windowWidth / 2;
// #ifndef APP-NVUE
this.ctx = uni.createCanvasContext('fui_image_cropper', this);
// #endif
this.$nextTick(() => {
// #ifndef APP-NVUE
this.ctx = uni.createCanvasContext('fui_image_cropper', this);
// #endif
setTimeout(() => {
this.changeval = `1_${this.getRandom()}`;
this.initVal = true
this.src && this.handleImage(this.src)
setTimeout(() => {
this.src && this.handleImage(this.src)
}, 50);
}, 220);
})
},
......@@ -208,11 +227,11 @@
let imgWidth = width,
imgHeight = height;
if (imgWidth > 0 && imgHeight > 0) {
if (imgWidth / imgHeight > this.width / this.height) {
imgHeight = this.height;
if (imgWidth / imgHeight > this.nWidth / this.nHeight) {
imgHeight = this.nHeight;
imgWidth = (width / height) * imgHeight;
} else {
imgWidth = this.width;
imgWidth = this.nWidth;
imgHeight = (height / width) * imgWidth;
}
} else {
......@@ -474,11 +493,11 @@
// #ifndef APP-NVUE
let draw = async () => {
let imgWidth = this.imgWidth * this.scale * this.scaleRatio;
let imgHeight = this.imgHeight * this.scale * this.scaleRatio;
let imgWidth = this.imgWidth * this.scale * this.nScaleRatio;
let imgHeight = this.imgHeight * this.scale * this.nScaleRatio;
let xpos = this.imgLeft - this.cutX;
let ypos = this.imgTop - this.cutY;
this.ctx.translate(xpos * this.scaleRatio, ypos * this.scaleRatio);
this.ctx.translate(xpos * this.nScaleRatio, ypos * this.nScaleRatio);
this.ctx.rotate((this.angle * Math.PI) / 180);
let src = this.src;
// #ifdef APP-PLUS || MP
......@@ -489,16 +508,16 @@
this.ctx.drawImage(src, -imgWidth / 2, -imgHeight / 2, imgWidth, imgHeight);
this.ctx.draw(false, () => {
let params = {
width: this.width * this.scaleRatio,
height: Math.round(this.height * this.scaleRatio),
width: this.nWidth * this.nScaleRatio,
height: Math.round(this.nHeight * this.nScaleRatio),
// #ifdef MP-QQ
destWidth: this.width * this.scaleRatio * 2 ,
destHeight: Math.round(this.height) * this.scaleRatio * 2,
destWidth: this.nWidth * this.nScaleRatio * 2,
destHeight: Math.round(this.nHeight) * this.nScaleRatio * 2,
// #endif
// #ifndef MP-QQ
destWidth: this.width * this.scaleRatio,
destHeight: Math.round(this.height) * this.scaleRatio,
destWidth: this.nWidth * this.nScaleRatio,
destHeight: Math.round(this.nHeight) * this.nScaleRatio,
// #endif
fileType: this.fileType,
quality: this.quality
......@@ -511,10 +530,11 @@
uni.hideLoading();
this.ctx.rotate(((360 - this.angle % 360) * Math
.PI) / 180);
this.ctx.translate(-xpos * this.scaleRatio, -
ypos * this.scaleRatio);
this.ctx.clearRect(0, 0, this.width * this
.scaleRatio, this.height * this.scaleRatio);
this.ctx.translate(-xpos * this.nScaleRatio, -
ypos * this.nScaleRatio);
this.ctx.clearRect(0, 0, this.nWidth * this
.nScaleRatio, this.nHeight * this
.nScaleRatio);
this.ctx.draw();
callback && callback(res.apFilePath)
}
......@@ -570,10 +590,11 @@
}
/* #ifndef APP-NVUE */
.fui-cropper__img-hidden{
.fui-cropper__img-hidden {
opacity: 0;
visibility: hidden;
}
/* #endif */
.fui-cropper__mask {
position: fixed;
......
src/components/FirstUI/fui-index-list/fui-index-list.vue
......@@ -276,9 +276,11 @@
// #ifdef H5
this.isPC = this.IsPC()
// #endif
setTimeout(() => {
this.initData()
}, 50)
this.$nextTick(() => {
setTimeout(() => {
this.initData()
}, 50)
})
},
methods: {
getIndex(y) {
......
src/components/FirstUI/fui-input-number/fui-input-number.vue
......@@ -306,6 +306,9 @@
text-align: center;
font-weight: 500;
border-width: 0;
/* #ifdef H5 */
outline: none;
/* #endif */
}
/* #ifdef H5 */
......
src/components/FirstUI/fui-landscape/fui-landscape.vue
......@@ -66,7 +66,7 @@
},
zIndex: {
type: Number,
default: 1001
default: 996
},
param: {
type: [Number, String],
......@@ -77,8 +77,14 @@
getStyles() {
let distance = Math.abs(Number(this.distance))
let styles = `bottom: -${distance}rpx;`;
// #ifdef APP-NVUE
styles = `bottom: 0rpx;`;
// #endif
if (this.position != 3) {
styles = `top: -${distance}rpx;`;
// #ifdef APP-NVUE
styles = `top: 0rpx;`;
// #endif
}
return styles
}
......@@ -210,6 +216,9 @@
justify-content: center;
flex-direction: column;
position: relative;
/* #ifdef APP-NVUE */
padding: 40px 0;
/* #endif */
}
.fui-landscape__icon {
......
src/components/FirstUI/fui-lazyload/fui-lazyload.vue
......@@ -103,6 +103,7 @@
},
// #ifndef APP-NVUE
mounted() {
this.isMounted = true
setTimeout(() => {
// #ifdef H5
if (window.self === window.top) {
......@@ -119,6 +120,13 @@
}, 50)
},
// #endif
// #ifdef H5
updated() {
if(!this.isMounted){
this.handleFade()
}
},
// #endif
// #ifndef VUE3
beforeDestroy() {
this.endObserver()
......
src/components/FirstUI/fui-license-plate/fui-license-plate.vue
......@@ -6,21 +6,22 @@
<view v-if="toolbar" class="fui-lp__btn-wrap"
:class="[theme==='light'?'fui-lp__btnwrap-light':'fui-lp__btnwrap-dark']">
<text class="fui-lp__button" :class="{'fui-lp__button-color':!color}"
:style="{color:getColor,fontSize:size+'rpx',fontWeight:fontWeight}" @tap.stop="onComplete">{{text}}</text>
:style="{color:getColor,fontSize:size+'rpx',fontWeight:fontWeight}"
@tap.stop="onComplete">{{text}}</text>
</view>
<view class="fui-license__plate-grids">
<view class="fui-lp__grid-wrap" v-for="(item,index) in keyList" :key="item.id">
<view class="fui-lp__grid"
:class="{'fui-lp__grid-lg':index===3 && idx===0,'fui-lp__grid-hidden':!(type===1?val.cn:val.en)}"
v-for="(val,idx) in item.keys" :key="idx">
<text :style="{fontSize:`${index===3 && idx===0? 28:(type===1?32:36)}rpx`}"
<text :key="theme" :style="{fontSize:`${index===3 && idx===0? 28:(type===1?32:36)}rpx`}"
class="fui-license__plate-key"
:class="{'fui-lp__key-dark':theme==='dark','fui-lp__highlight-dark':theme==='dark' && val,'fui-lp__highlight':theme==='light' && val}"
:class="{'fui-lp__key-dark':theme==='dark','fui-lp__key-light':theme!=='dark','fui-lp__highlight-dark':theme==='dark' && val,'fui-lp__highlight':theme==='light' && val}"
@tap.stop="keyClick(index,idx,val)">{{type===1?val.cn:val.en}}</text>
</view>
<view class="fui-lp__grid fui-lp__grid-lg" v-if="index===3">
<view class="fui-license__plate-key"
:class="{'fui-lp__key-dark':theme==='dark','fui-lp__highlight-dark':theme==='dark','fui-lp__highlight':theme==='light'}"
<view :key="theme" class="fui-license__plate-key"
:class="{'fui-lp__key-dark':theme==='dark','fui-lp__key-light':theme!=='dark','fui-lp__highlight-dark':theme==='dark','fui-lp__highlight':theme==='light'}"
@tap.stop="backspace">
<fui-icon :name="name" :size="48" :color="theme==='dark'?'#d1d1d1':'#333'"></fui-icon>
</view>
......@@ -222,7 +223,7 @@
transform-origin: center center;
/* #ifdef APP-NVUE */
transform: translate(0, 100%);
opacity: 0;
opacity: 0.01;
border-top-style: solid;
border-top-width: 0.5px;
/* #endif */
......@@ -339,29 +340,36 @@
flex-shrink: 0;
box-sizing: border-box;
/* #endif */
/* #ifdef APP-NVUE */
flex: 1;
/* #endif */
font-weight: 500;
height: 88rpx;
/* #ifdef APP-NVUE */
line-height: 88rpx;
/* #endif */
background: #fff;
border-radius: 8rpx;
align-items: center;
justify-content: center;
/* #ifdef H5 */
cursor: pointer;
/* #endif */
color: #181818;
/* #ifdef APP-NVUE */
border-bottom-width: 0.5px;
border-bottom-color: rgba(0, 0, 0, .1);
border-bottom-style: solid;
/* #endif */
text-align: center;
position: relative;
}
.fui-lp__key-light {
background: #fff;
color: #181818;
/* #ifdef APP-NVUE */
border-bottom-color: rgba(0, 0, 0, .1);
/* #endif */
}
/* #ifndef APP-NVUE */
.fui-license__plate-key::after {
content: '';
......
src/components/FirstUI/fui-load-ani/fui-load-ani.vue
<template>
<view class="fui-load__ani" :class="{'fui-load__ani-fixed':isFixed}">
<view class="fui-load__ani" :class="{'fui-load__ani-fixed':isFixed}"
:style="{background:isFixed?maskColor:'transparent'}">
<!-- #ifndef APP-NVUE -->
<view class="fui-load__ani-1" v-if="type==1">
<view class="fui-load__ani-a" :class="{'fui-load__ani-bg':!color || color==='true'}"
<view class="fui-load__ani-a" :class="{'fui-load__ani-bg':!color || color===true}"
:style="{background:color}"></view>
<view class="fui-ani__ani-b" :class="{'fui-load__ani-bg':!color || color==='true'}"
<view class="fui-ani__ani-b" :class="{'fui-load__ani-bg':!color || color===true}"
:style="{background:color}"></view>
<view :class="{'fui-load__ani-bg':!color || color==='true'}" :style="{background:color}"></view>
</view>
<view class="fui-load__ani-2" v-if="type==2">
<view class="fui-load__ani-line fui-load__ani-c" :class="{'fui-load__ani-bg':!color || color==='true'}"
<view class="fui-load__ani-line fui-load__ani-c" :class="{'fui-load__ani-bg':!color || color===true}"
:style="{background:color}"></view>
<view class="fui-load__ani-line fui-load__ani-d" :class="{'fui-load__ani-bg':!color || color==='true'}"
<view class="fui-load__ani-line fui-load__ani-d" :class="{'fui-load__ani-bg':!color || color===true}"
:style="{background:color}"></view>
<view class="fui-load__ani-line fui-load__ani-e" :class="{'fui-load__ani-bg':!color || color==='true'}"
<view class="fui-load__ani-line fui-load__ani-e" :class="{'fui-load__ani-bg':!color || color===true}"
:style="{background:color}"></view>
</view>
<view class="fui-load__ani-3" :class="{'fui-load__ani-border':!color || color==='true'}"
<view class="fui-load__ani-3" :class="{'fui-load__ani-border':!color || color===true}"
:style="{'border-left-color':color,'border-right-color':color}" v-if="type==3">
</view>
<view class="fui-load__ani-4" :class="{'fui-load__ani-bcolor':!color || color==='true'}"
<view class="fui-load__ani-4" :class="{'fui-load__ani-bcolor':!color || color===true}"
:style="{borderColor:color}" v-if="type==4">
<view class="fui-load__ani-f" :class="{'fui-load__ani-bg':!color || color==='true'}"
<view class="fui-load__ani-f" :class="{'fui-load__ani-bg':!color || color===true}"
:style="{background:color}"></view>
</view>
<view class="fui-load__ani-5" :class="{'fui-load__ani-bg':!color || color==='true'}" :style="{background:color}"
<view class="fui-load__ani-5" :class="{'fui-load__ani-bg':!color || color===true}" :style="{background:color}"
v-if="type==5">
<view class="fui-load__ani-g" :class="{'fui-load__ani-bg':!color || color==='true'}"
<view class="fui-load__ani-g" :class="{'fui-load__ani-bg':!color || color===true}"
:style="{background:color}"></view>
<view class="fui-load__ani-h" :class="{'fui-load__ani-bg':!color || color==='true'}"
<view class="fui-load__ani-h" :class="{'fui-load__ani-bg':!color || color===true}"
:style="{background:color}"></view>
</view>
<!-- #endif -->
<!-- #ifdef APP-NVUE -->
<loading-indicator :animating="true"></loading-indicator>
<view class="fui-load__ani-1n" v-if="type==1">
<view class="fui-loadani__1" :style="{background:color}" ref="ani_11"></view>
<view class="fui-loadani__1" :style="{background:color}" ref="ani_12"></view>
<view class="fui-loadani__1" ref="ani_13" :style="{background:color}"></view>
</view>
<view class="fui-load__ani-2n" v-if="type==2">
<view class="fui-load__ani-line" ref="ani_11" :style="{background:color}"></view>
<view class="fui-load__ani-line" ref="ani_12" :style="{background:color}"></view>
<view class="fui-load__ani-line" ref="ani_13" :style="{background:color}"></view>
</view>
<view class="fui-load__ani-3n" ref="fui_loadani34"
:style="{'border-left-color':color,'border-right-color':color}" v-if="type==3">
</view>
<view class="fui-load__ani-4n" ref="fui_loadani34" v-if="type==4">
<view class="fui-load__ani-41" :style="{borderColor:color}"></view>
<view class="fui-load__ani-42" :style="{background:color}"></view>
</view>
<view class="fui-load__ani-5n" v-if="type==5">
<view class="fui-load__ani-i" ref="ani_11" :style="{background:color}"></view>
<view class="fui-load__ani-i" ref="ani_12" :style="{background:color}"></view>
<view class="fui-load__ani-i" ref="ani_13" :style="{background:color}"></view>
</view>
<!-- #endif -->
</view>
</template>
<script>
// #ifdef APP-NVUE
const animation = weex.requireModule('animation')
// #endif
export default {
name: "fui-load-ani",
props: {
......@@ -53,43 +81,163 @@
default: 1
},
//loading颜色
// #ifdef APP-NVUE
color: {
type: String,
default: '#465CFF'
},
// #endif
// #ifndef APP-NVUE
color: {
type: String,
default: ''
},
// #endif
//是否固定在屏幕中间显示
isFixed: {
type: Boolean,
default: false
},
//isFixed=true时有效
maskColor: {
type: String,
default: 'transparent'
}
},
// #ifdef APP-NVUE
created() {
this.timer = null;
this.deg = 0;
this.stop = false;
},
mounted() {
clearInterval(this.timer)
this.$nextTick(() => {
if (this.type == 1 || this.type == 2 || this.type == 5) {
setTimeout(() => {
this.startAni()
}, 50)
this.timer = setInterval(() => {
this.startAni()
}, 1200)
} else if (this.type == 3 || this.type == 4) {
setTimeout(() => {
this.deg += 360;
this._animation()
}, 50)
}
})
},
// #ifndef VUE3
beforeDestroy() {
clearInterval(this.timer)
this.deg = 0;
this.stop = true;
},
// #endif
// #ifdef VUE3
beforeUnmount() {
clearInterval(this.timer)
this.deg = 0;
this.stop = true;
},
// #endif
methods: {
transition(el, options, duration, delay = 0) {
return new Promise((resolve) => {
animation.transition(el.ref, {
duration,
delay,
timingFunction: 'linear',
needLayout: false,
...options,
}, resolve)
})
},
ani(el) {
let styles = {}
let styles2 = {}
if (this.type == 5) {
styles.opacity = 0.25
styles2.opacity = 1
} else {
styles.transform = this.type == 1 ? 'scale(0)' : `translateY(0)`
styles2.transform = this.type == 1 ? 'scale(1)' : `translateY(100%)`
}
this.transition(el, {
styles
}, 500, 0).then(() => {
this.transition(el, {
styles: styles2
}, 500, 0)
})
},
startAni() {
this.ani(this.$refs['ani_11'])
setTimeout(() => {
this.ani(this.$refs['ani_12'])
}, 300)
setTimeout(() => {
this.ani(this.$refs['ani_13'])
}, 500)
},
_animation() {
if (!this.$refs['fui_loadani34'] || this.stop) return;
animation.transition(
this.$refs['fui_loadani34'].ref, {
styles: {
transform: `rotate(${this.deg}deg)`
},
duration: 800, //ms
timingFunction: 'linear',
iterationCount: 'infinite',
needLayout: false,
delay: 0 //ms
}, () => {
this.deg += 360;
this._animation()
}
);
}
}
// #endif
}
</script>
<style scoped>
.fui-load__ani {
/* #ifdef APP-VUE */
flex: 1;
/* #endif */
/* #ifndef APP-NVUE */
width: 100%;
display: flex;
/* #endif */
/* #ifdef APP-VUE */
flex: 1;
/* #endif */
flex-direction: row;
align-items: center;
justify-content: center;
}
/* #ifndef APP-NVUE */
.fui-load__ani-fixed {
position: fixed;
left: 0;
top: 50%;
transform: translateY(-50%);
z-index: 1008;
right: 0;
top: 0;
bottom: 0;
/* #ifndef APP-NVUE */
display: flex;
z-index: 996;
/* #endif */
justify-content: center;
align-items: center;
}
/* #ifndef APP-NVUE */
.fui-load__ani-1{
flex-direction: row;
}
.fui-load__ani-1 view {
width: 36rpx;
height: 36rpx;
......@@ -292,4 +440,84 @@
}
/* #endif */
/* #ifdef APP-NVUE */
.fui-load__ani-1n {
flex-direction: row;
align-items: center;
}
.fui-loadani__1 {
width: 36rpx;
height: 36rpx;
border-radius: 36rpx;
}
.fui-load__ani-2n {
position: relative;
width: 56rpx;
height: 56rpx;
flex-direction: row;
align-items: flex-end;
justify-content: space-between;
overflow: hidden;
}
.fui-load__ani-line {
width: 8rpx;
height: 56rpx;
border-top-left-radius: 8rpx;
border-top-right-radius: 8rpx;
transform: translateY(100%);
}
.fui-load__ani-3n {
width: 40rpx;
height: 40rpx;
border: 2px solid transparent;
border-radius: 24rpx;
}
.fui-load__ani-4n {
width: 68rpx;
height: 68rpx;
position: relative;
align-items: center;
justify-content: center;
border: 0;
}
.fui-load__ani-41 {
width: 52rpx;
height: 52rpx;
border: 1px solid;
border-radius: 50%;
}
.fui-load__ani-42 {
width: 16rpx;
height: 16rpx;
position: absolute;
top: 0rpx;
left: 26rpx;
border-radius: 12rpx;
opacity: .6;
}
.fui-load__ani-5n {
width: 76rpx;
height: 18rpx;
flex-direction: row;
align-items: center;
justify-content: space-between;
}
.fui-load__ani-i {
width: 16rpx;
height: 16rpx;
border-radius: 12rpx;
opacity: .25;
}
/* #endif */
</style>
src/components/FirstUI/fui-loading/fui-loading.vue
......@@ -95,7 +95,12 @@
},
// #ifdef APP-NVUE
mounted() {
this._animation()
this.$nextTick(() => {
setTimeout(() => {
this.deg += 360;
this._animation()
}, 50)
})
},
// #endif
//nvue暂不支持vue3，所以不需要做兼容,此处以防后续兼容
......
src/components/FirstUI/fui-loadmore/fui-loadmore.vue
......@@ -124,7 +124,12 @@
},
// #ifdef APP-NVUE
mounted() {
this._animation()
this.$nextTick(() => {
setTimeout(() => {
this.deg += 360;
this._animation()
}, 50)
})
},
// #endif
// #ifndef VUE3
......
src/components/FirstUI/fui-lottie/fui-lottie.vue
......@@ -153,7 +153,11 @@
mounted() {
this.actionVal = this.getAction(this.action)
// #ifdef MP
this.initMp()
this.$nextTick(()=>{
setTimeout(()=> {
this.initMp()
}, 10);
})
// #endif
},
methods: {
......
src/components/FirstUI/fui-message/fui-message.vue
......@@ -173,6 +173,7 @@
box-sizing: border-box;
display: flex;
/* #endif */
flex-direction: row;
align-items: center;
justify-content: center;
opacity: 0;
......
src/components/FirstUI/fui-modal/fui-modal.vue
......@@ -13,7 +13,7 @@
<view class="fui-modal__btn-wrap" :style="getWidth" :class="{'fui-modal__btn-row':direction==='row'}"
v-if="vals.length>0">
<view class="fui-modal__button"
:class="{'fui-modal__button-col':direction==='column' && index!==vals.length-1,'fui-modal__button-bg':!entity.plain && !entity.background,'fui-modal__button-border':entity.plain,'fui-modal__button-bc':entity.plain && !entity.background}"
:class="{'fui-model__button-full':direction==='row','fui-modal__button-col':direction==='column' && index!==vals.length-1,'fui-modal__button-bg':!entity.plain && !entity.background,'fui-modal__button-border':entity.plain,'fui-modal__button-bc':entity.plain && !entity.background}"
:style="{borderRadius:radius+'rpx',background:entity.plain?'transparent':(entity.background || primaryColor),borderColor:entity.plain?(entity.background || primaryColor):'transparent'}"
v-for="(entity,index) in vals" :key="index">
<text class="fui-modal__button-inner"
......@@ -111,7 +111,7 @@
},
zIndex: {
type: Number,
default: 1001
default: 996
}
},
data() {
......@@ -317,7 +317,6 @@
}
.fui-modal__button {
flex: 1;
margin-left: 20rpx;
margin-right: 20rpx;
margin-top: 20rpx;
......@@ -330,6 +329,10 @@
/* #endif */
}
.fui-model__button-full {
flex: 1;
}
.fui-modal__button-col {
margin-bottom: 0 !important;
}
......
src/components/FirstUI/fui-notice-bar/fui-notice-bar.vue
......@@ -128,7 +128,9 @@
})
// #endif
this.$nextTick(() => {
this.initAnimation()
setTimeout(() => {
this.initAnimation()
}, 10)
})
},
watch: {
......
src/components/FirstUI/fui-overflow-hidden/fui-overflow-hidden.vue
<template>
<view class="fui-overflow__hidden-wrap"
<view :key="visible" class="fui-overflow__hidden-wrap"
:class="{'fui-overflow__hidden':type==1,'fui-gradient__hidden':type==2 && !visible,'fui-text__nowrap':type==1 && rows==1}"
:style="{width:width,height:type==1 || visible?'auto':height,paddingTop:type==2?padding[0]:'0',paddingRight:type==2?padding[1]:0,paddingBottom:type==2?(padding[2] || padding[0]):0,paddingLeft:type==2?(padding[3] || padding[1]):0,background:background,fontSize:size+'rpx',color:color,fontWeight:fontWeight,'-webkit-line-clamp':type==1?rows:'none',textOverflow:overflow,textAlign:align}"
@tap="handleTap">
<!-- #ifdef APP-NVUE -->
<text
<text :key="visible"
:style="{width:width,height:type==1 || visible?'auto':height,fontSize:size+'rpx',color:color,fontWeight:fontWeight,lines:type==1?rows:0,textOverflow:overflow,textAlign:align}"
v-if="text">{{text}}</text>
<!-- #endif -->
......
src/components/FirstUI/fui-pagination/fui-pagination.vue
......@@ -16,7 +16,8 @@
</view>
<view class="fui-page__number" v-if="isPage && pageType==2">
<view class="fui-page__num-item" :class="{'fui-pagination__bg':!activeBgColor && currentIndex===item}"
<view class="fui-page__num-item"
:class="{'fui-pagination__bg':!activeBgColor && currentIndex===item,'fui-page__num-width':item==='...' || (item!='...' && item<1000),'fui-page__num-padding':item!='...' && item>999}"
v-for="(item,index) in pageNumber" :key="index"
:style="{background:currentIndex===item?getActiveBgColor:pageBgColor,borderRadius:radius+'rpx'}"
@tap.stop="handleClick(item,index)">
......@@ -323,9 +324,9 @@
/* #ifndef APP-NVUE */
border-width: 1px;
flex-shrink: 0;
/* #endif */
border-style: solid;
flex-shrink: 0;
/* #ifdef H5 */
cursor: pointer;
/* #endif */
......@@ -390,8 +391,20 @@
/* #ifdef H5 */
cursor: pointer;
/* #endif */
}
/* #ifdef APP-NVUE */
.fui-page__num-width {
width: 60rpx;
}
.fui-page__num-padding {
padding: 0 8rpx;
}
/* #endif */
.fui-page__num-item:active {
opacity: .5;
}
......
src/components/FirstUI/fui-picker/fui-picker.vue
......@@ -228,7 +228,7 @@
},
zIndex: {
type: [Number, String],
default: 1001
default: 996
},
isClose: {
type: Boolean,
......@@ -246,13 +246,11 @@
},
// #ifdef APP-NVUE
mounted() {
if (!this.$refs['fui_pkm_ani'] || !this.$refs['fui_pk_ani']) return;
this._transtion('fui_pkm_ani', {
transform: 'translateX(-100%)'
}, 0)
this._transtion('fui_pk_ani', {
transform: 'translateY(100%)'
}, 0)
this.$nextTick(() => {
setTimeout(() => {
this.hiddenNvuePicker()
}, 50)
})
},
// #endif
computed: {
......@@ -351,6 +349,7 @@
thirdArr: [],
fourthArr: [],
vals: [],
nvueVals: [],
// #ifndef APP-NVUE
darkStyle: 'background-image: -webkit-linear-gradient(top, rgba(35, 35, 35, .95), rgba(35, 35, 35, .6)), -webkit-linear-gradient(bottom, rgba(35, 35, 35, .95), rgba(35, 35, 35, .6));',
indicatorStyl: 'border-color: #333;height: 44px;',
......@@ -370,6 +369,17 @@
};
},
methods: {
// #ifdef APP-NVUE
hiddenNvuePicker() {
if (!this.$refs['fui_pkm_ani'] || !this.$refs['fui_pk_ani']) return;
this._transtion('fui_pkm_ani', {
transform: 'translateX(-100%)'
}, 0)
this._transtion('fui_pk_ani', {
transform: 'translateY(100%)'
}, 0)
},
// #endif
initialize() {
if (this.linkage) {
this.getFields(this.fields)
......@@ -515,12 +525,16 @@
}
},
reset() {
this.vals = [
const vals = [
[0],
[0, 0],
[0, 0, 0],
[0, 0, 0, 0]
][Number(this.layer) - 1]
this.vals = [...vals];
// #ifdef APP-NVUE
this.nvueVals = [...vals]
// #endif
},
open() {
this.isShow = true;
......@@ -563,7 +577,10 @@
this.vals = []
this.$nextTick(() => {
setTimeout(() => {
this.vals = vals;
this.vals = [...vals];
// #ifdef APP-NVUE
this.nvueVals = [...vals]
// #endif
}, 200)
})
} else {
......@@ -670,7 +687,9 @@
result = text.join('');
}
}
// #ifdef APP-NVUE
this.nvueVals = [...this.vals];
// #endif
this.$emit('change', {
text: text,
value: value,
......@@ -711,8 +730,8 @@
}, 50)
},
pickerChange(e) {
if (!this.isInitShow) return;
let value = e.detail.value;
if (!this.isInitShow || value.length != this.layer) return;
if (this.linkage) {
if (this.layer == 1) {
this.setOneLayers(value)
......@@ -734,6 +753,7 @@
// #ifdef APP-NVUE
openPicker() {
setTimeout(() => {
this.vals = [...this.nvueVals];
this._animation(true);
}, 20);
},
......@@ -747,7 +767,7 @@
duration: duration,
needLayout: false,
delay: 0
}, () => {
}, (e) => {
callback && callback()
});
},
......@@ -794,13 +814,14 @@
/* #ifndef APP-NVUE */
transition: all 0.25s ease-in-out;
visibility: hidden;
opacity: 0;
/* #endif */
/* #ifdef APP-NVUE */
transition-property: opacity;
transition-timing-function: ease-in-out;
transition-duration: .25s;
opacity: 0.001;
/* #endif */
opacity: 0;
}
.fui-picker__mask-show {
......@@ -825,10 +846,9 @@
/* #endif */
/* #ifdef APP-NVUE */
transition-property: opacity;
transition-property: transform;
transition-duration: .25s;
transform: translateY(100%);
/* opacity: 0; */
/* #endif */
transform-origin: center center;
flex-direction: column;
......@@ -844,9 +864,8 @@
transform: translate3d(0, 0, 0);
visibility: visible;
/* #endif */
/* #ifdef APP-NVUE */
opacity: 1;
transform: translateY(0);
/* #endif */
}
......@@ -974,7 +993,9 @@
/* #ifndef APP-NVUE */
width: 100%;
/* #endif */
/* #ifdef APP-NVUE */
flex: 1;
/* #endif */
height: 520rpx;
}
......
src/components/FirstUI/fui-poster-weex/fui-poster-weex.vue
......@@ -59,20 +59,23 @@
this.h = this._toPx(this.height)
},
mounted() {
let ganvas = this.$refs[this.canvasId];
/*通过元素引用获取canvas对象*/
let canvasObj = enable(ganvas, {
bridge: WeexBridge
});
/*获取绘图所需的上下文，暂不支持3d*/
this.context = canvasObj.getContext('2d');
setTimeout(() => {
this.$emit('ready')
}, 50)
this.$nextTick(()=>{
let ganvas = this.$refs[this.canvasId];
/*通过元素引用获取canvas对象*/
let canvasObj = enable(ganvas, {
bridge: WeexBridge
});
/*获取绘图所需的上下文，暂不支持3d*/
this.context = canvasObj.getContext('2d');
setTimeout(() => {
this.$emit('ready')
}, 50)
})
},
methods: {
_toPx(rpx) {
return uni.upx2px(Number(rpx) * Number(this.pixelRatio))
// * Number(this.pixelRatio)
return uni.upx2px(Number(rpx))
},
_getTextWidth(context, text, fontSize) {
//measureText首次获取可能为空对象，.width为undefined
......@@ -151,7 +154,6 @@
context.setTextAlign(textAlign);
let textWidth = this._getTextWidth(context, text, fontSize);
width = this._toPx(width);
console.log(textWidth, width)
let textArr = this._wrapText(text, fontSize, textWidth, width, context, rows)
//如果文本前面有其他文本内容
if (frontText) {
......@@ -553,9 +555,6 @@
1,
function(res) {
callback && callback(res.tempFilePath)
},
function() {
callback && callback(false)
}
)
}, time)
......
src/components/FirstUI/fui-poster/fui-poster.vue
......@@ -46,7 +46,7 @@
// #ifndef MP-WEIXIN || MP-QQ
const canvasId = `fui_${Math.ceil(Math.random() * 10e5).toString(36)}`
// #endif
//vue3下QQ小程序无法使用动态id
//vue3下QQ小程序无法使用动态id
// #ifdef MP-QQ
const canvasId = 'canvas_poster'
// #endif
......@@ -69,7 +69,7 @@
this.h = this._toPx(this.height)
},
mounted() {
this.$nextTick(()=>{
this.$nextTick(() => {
setTimeout(() => {
poster.create(Number(this.pixelRatio), this.canvasId, this)
this.$emit('ready')
......@@ -152,6 +152,45 @@
},
saveImage(filePath) {
poster.saveImage(filePath)
},
//删除已缓存文件，防止超出存储空间大小限制 【备用】
//App、微信小程序、支付宝小程序、百度小程序、抖音小程序、飞书小程序、QQ小程序、京东小程序
removeSavedFile() {
//使用前请先查看支持平台
let count = 0;
return new Promise((resolve, reject) => {
// #ifdef APP-PLUS || MP-WEIXIN || MP-ALIPAY || MP-BAIDU || MP-TOUTIAO || MP-JD || MP-QQ || MP-LARK
uni.getSavedFileList({
success(res) {
count = res.fileList.length;
if (count > 0) {
let num = 0;
let list = res.fileList || []
list.forEach(item => {
uni.removeSavedFile({
filePath: item.filePath,
complete(res) {
num++;
if (num === count) {
resolve(true)
}
}
})
})
} else {
resolve(true)
}
},
fail() {
reject(false)
}
})
// #endif
// #ifndef APP-PLUS || MP-WEIXIN || MP-ALIPAY || MP-BAIDU || MP-TOUTIAO || MP-JD || MP-QQ || MP-LARK
resolve(true)
// #endif
})
}
}
}
......
src/components/FirstUI/fui-preview/fui-preview.vue
......@@ -18,8 +18,18 @@
<text class="fui-preview__label"
:class="[!labelColor && !item[lColor]?'fui-preview__gray':'','fui-preview__label-'+labelAlign]"
:style="{color:item[lColor] || labelColor,fontSize:bdSize+'rpx',width:labelWidth>0?labelWidth+'rpx':'auto',marginRight:labelRight+'rpx'}">{{item[label]}}</text>
<!-- #ifndef APP-NVUE -->
<text class="fui-preview__value" :class="{'fui-preview__color':!bdColor && !item[valueColor]}"
:style="{color:item[valueColor] || bdColor,fontSize:bdSize+'rpx',textAlign:bdAlign}">{{item[value]}}</text>
:style="{color:item[valueColor] || bdColor,fontSize:bdSize+'rpx',textAlign:bdAlign}"
@tap="itemClick(index)">{{item[value]}}</text>
<!-- #endif -->
<!-- #ifdef APP-NVUE -->
<view class="fui-preview__value-wrap">
<text class="fui-preview__value" :class="{'fui-preview__color':!bdColor && !item[valueColor]}"
:style="{color:item[valueColor] || bdColor,fontSize:bdSize+'rpx',textAlign:bdAlign}"
@tap="itemClick(index)">{{item[value]}}</text>
</view>
<!-- #endif -->
</view>
</view>
<slot></slot>
......@@ -39,7 +49,7 @@
<script>
export default {
name: "fui-preview",
emits: ['click'],
emits: ['click', 'valueClick'],
props: {
previewData: {
type: Object,
......@@ -236,6 +246,21 @@
index: idx,
...params
})
},
itemClick(index) {
this.$emit('valueClick', {
index,
item: this.pvd[this.list][index]
})
},
setValue(index, value) {
const idx = Number(index)
if (idx || idx === 0) {
const data = JSON.parse(JSON.stringify(this.pvd))
const item = data[this.list][idx]
item[this.value] = value;
this.pvd = data
}
}
}
}
......@@ -351,10 +376,16 @@
/* #endif */
.fui-preview__value {
/* #ifdef APP-NVUE */
.fui-preview__value-wrap {
flex: 1;
}
/* #endif */
.fui-preview__value {
text-align: right;
/* #ifndef APP-NVUE */
flex: 1;
display: block;
word-break: break-all;
word-wrap: break-word;
......@@ -386,7 +417,9 @@
.fui-preview__ft {
/* #ifdef APP-NVUE */
flex: 1;
/* #endif */
position: relative;
height: 100rpx;
/* #ifdef APP-NVUE */
......@@ -423,6 +456,9 @@
/* #endif */
flex-direction: row;
justify-content: space-between;
/* #ifdef APP-NVUE */
align-items: flex-start;
/* #endif */
}
.fui-preview__label {
......
src/components/FirstUI/fui-progress/fui-progress.vue
......@@ -35,10 +35,18 @@
type: [Number, String],
default: 8
},
// #ifndef APP-NVUE
radius: {
type: [Number, String],
default: 8
},
// #endif
// #ifdef APP-NVUE
radius: {
type: [Number, String],
default: 0
},
// #endif
showInfo: {
type: Boolean,
default: false
......@@ -80,7 +88,9 @@
}
},
mounted() {
this.darwProgress();
this.$nextTick(() => {
this.darwProgress();
})
},
computed: {
getActiveColor() {
......@@ -156,6 +166,7 @@
align-items: center;
}
/* nvue android 端 overflow: hidden 无效，目前uni-app官方尚未修复此问题*/
.fui-progress__bar-bg {
/* #ifndef APP-NVUE */
width: 100%;
......
src/components/FirstUI/fui-puzzle-verify/fui-puzzle-verify.vue
......@@ -154,10 +154,14 @@
},
watch: {
src(newValue, oldValue) {
this.reset()
setTimeout(()=> {
this.reset()
}, 50);
},
cutSrc(val) {
this.reset()
setTimeout(()=> {
this.reset()
}, 50);
}
},
computed: {
......
src/components/FirstUI/fui-rate/fui-rate.vue
......@@ -93,7 +93,8 @@
intScore: 0,
decimalScore: 0,
isPC: false,
rated: false
rated: false,
isMounted: false
};
},
created() {
......@@ -102,13 +103,25 @@
this.drawer = this.getParent()
},
mounted() {
setTimeout(() => {
this._getSize()
}, 100)
this.isMounted = true;
this.$nextTick(() => {
setTimeout(() => {
this._getSize()
}, 100)
})
// #ifdef H5
this.isPC = this.IsPC()
// #endif
},
// #ifdef H5
updated() {
if (!this.isMounted && !this.pageX) {
setTimeout(() => {
this._getSize()
}, 50)
}
},
// #endif
methods: {
getName(index, iScore, dScore) {
let name = 'star'
......@@ -287,6 +300,9 @@
parentName = parent.$options.name;
}
return parent;
},
reset() {
this._getSize();
}
}
}
......
src/components/FirstUI/fui-result/fui-result.vue
......@@ -176,7 +176,8 @@
width: 30rpx;
height: 60rpx;
border-style: solid;
border-width: 0;
border-left-width: 0;
border-top-width: 0;
border-right-width: 8rpx;
border-bottom-width: 8rpx;
/* #ifndef APP-NVUE */
......@@ -185,6 +186,9 @@
transform: rotate(45deg);
margin-bottom: 12rpx;
margin-left: 4rpx;
/* #ifdef APP-NVUE */
border-bottom-right-radius: 8rpx;
/* #endif */
}
.fui-result__ib-fail {
......@@ -205,10 +209,14 @@
.fui-result__ib-waiting {
height: 48rpx;
width: 48rpx;
border-width: 8rpx;
border-style: solid;
border-top-width: 0;
border-right-width: 0;
border-bottom-width: 8rpx;
border-left-width: 8rpx;
/* #ifdef APP-NVUE */
border-bottom-left-radius: 8rpx;
/* #endif */
/* #ifndef APP-NVUE */
box-sizing: border-box;
/* #endif */
......
src/components/FirstUI/fui-row/fui-row.vue
......@@ -94,7 +94,9 @@
/* #endif */
.fui-row__box {
/* #ifdef APP-NVUE */
flex: 1;
/* #endif */
/* #ifndef APP-NVUE */
box-sizing: border-box;
-webkit-box-orient: horizontal;
......@@ -104,6 +106,7 @@
/* #ifdef MP-TOUTIAO || MP-QQ || MP-BAIDU */
display: block;
/* #endif */
flex-direction: row;
}
/* #ifndef APP-NVUE */
......@@ -124,7 +127,7 @@
/* #endif */
.fui-row__flex {
/* #ifndef APP-NVUE*/
display: flex !important;
display: flex;
/* #endif */
flex-direction: row;
}
......
src/components/FirstUI/fui-search-bar/fui-search-bar.vue
......@@ -34,10 +34,10 @@
<text class="fui-search__bar-text">{{ placeholder }}</text>
</view>
</view>
<text v-if="cancel && isSearch && !val && cancelText && cancelText!=='true'" class="fui-search__bar-btn"
:style="{ color: cancelColor }" @tap="hideInput">{{ cancelText }}</text>
<text v-if="val && !disabled && isSearch && searchText && searchText!=='true'" class="fui-search__bar-btn"
:class="{'fui-sb__btn-color':!searchColor}" :style="{ color: getSearchColor }"
<text v-if="cancel && isSearch && !val && cancelText && cancelText!==true && cancelText!=='true'"
class="fui-search__bar-btn" :style="{ color: cancelColor }" @tap="hideInput">{{ cancelText }}</text>
<text v-if="val && !disabled && isSearch && searchText && searchText!==true && searchText!=='true'"
class="fui-search__bar-btn" :class="{'fui-sb__btn-color':!searchColor}" :style="{ color: getSearchColor }"
@tap="search">{{ searchText }}</text>
</view>
</template>
......@@ -147,22 +147,17 @@
},
mounted() {
this.$nextTick(() => {
// #ifdef MP-TOUTIAO
setTimeout(() => {
this.isFocus = this.focus;
}, 300)
// #endif
// #ifndef MP-TOUTIAO
setTimeout(() => {
this.isFocus = this.focus;
}, 120)
// #endif
})
},
watch: {
focus(val) {
this.$nextTick(() => {
this.isFocus = val;
setTimeout(() => {
this.isFocus = val;
}, 20)
})
},
// #ifdef APP-NVUE
......
src/components/FirstUI/fui-select/fui-select.vue
......@@ -455,17 +455,27 @@
/* #ifndef APP-NVUE */
transition: all ease-in-out .3s;
visibility: hidden;
/* #endif */
opacity: 0;
/* #endif */
/* #ifdef APP-NVUE */
opacity: 0.001;
/* #endif */
}
/* #ifndef APP-NVUE */
.fui-select__mask-show {
/* #ifndef APP-NVUE */
opacity: 1;
visibility: visible;
/* #endif */
/* #ifdef APP-NVUE */
opacity: 1;
/* #endif */
}
/* #endif */
.fui-select__wrap {
position: fixed;
left: 0;
......@@ -482,6 +492,8 @@
/* #ifdef APP-NVUE */
flex-direction: column;
/* transition-property: transform;
transition-duration: 0.3s; */
transform: translateY(100%);
/* #endif */
......@@ -498,14 +510,20 @@
/* #endif */
/* #ifndef APP-NVUE */
.fui-select__wrap-show {
/* #ifndef APP-NVUE */
transform: translate3d(0, 0, 0);
opacity: 1;
visibility: visible;
/* #endif */
/* #ifdef APP-NVUE */
/* transform: translateY(0); */
/* #endif */
}
/* #endif */
.fui-select__scroll {
/* #ifndef APP-NVUE */
......
src/components/FirstUI/fui-share-sheet/fui-share-sheet.vue
......@@ -4,14 +4,14 @@
@tap.stop="maskClick">
</view>
<view class="fui-share__sheet-wrap"
:class="{'fui-share__sheet-radius':radius,'fui-share__sheet-hidden':!show,'fui-share__sheet-show':show}"
:class="{'fui-share__sheet-radius':radius,'fui-share__sheet-show':show,'fui-share__sheet-hidden':nvueHidden}"
:style="{zIndex:zIndex,background:background}" ref="fui_ss_ani">
<slot>
<text class="fui-share__sheet-title"
:style="{fontSize:size+'rpx',color:color}">{{!title || title==='true' || title===true?'':title}}</text>
</slot>
<view class="fui-share__sheet-box" v-for="(item,index) in items" :key="item.id">
<scroll-view :show-scrollbar="false" scroll-x class="fui-share__sheet-scroll">
<scroll-view :show-scrollbar="false" :scroll-x="true" class="fui-share__sheet-scroll">
<view class="fui-share__sheet-list" :class="{'fui-share__sheet-full':isFull}"
:style="{paddingLeft:padding+'rpx',paddingRight:padding+'rpx'}">
<view class="fui-share__sheet-item" @tap.stop="handleClick($event,index,idx)"
......@@ -26,7 +26,9 @@
</view>
<text class="fui-share__sheet-text"
:style="{fontSize:(obj.textSize || 24) + 'rpx',color:obj.textColor || '#7f7f7f'}">{{obj.text}}</text>
<!-- #ifndef APP-NVUE -->
<button class="fui-sharesheet__btn" :open-type="obj.openType" v-if="obj.openType"></button>
<!-- #endif -->
</view>
</view>
</scroll-view>
......@@ -141,7 +143,8 @@
data() {
return {
items: [],
iphoneX: false
iphoneX: false,
nvueHidden: true
};
},
created() {
......@@ -152,13 +155,16 @@
},
// #ifdef APP-NVUE
mounted() {
if (!this.$refs['fui_ssm_ani'] || !this.$refs['fui_ss_ani']) return;
this._transtion('fui_ssm_ani', {
transform: 'translateX(-100%)'
}, 0)
this._transtion('fui_ss_ani', {
transform: 'translateY(100%)'
}, 0)
this.$nextTick(() => {
if (!this.$refs['fui_ssm_ani'] || !this.$refs['fui_ss_ani']) {
setTimeout(() => {
this.hiddenNvueLayer()
}, 50)
} else {
this.hiddenNvueLayer()
}
this.nvueHidden = false;
})
},
// #endif
computed: {
......@@ -184,6 +190,15 @@
}
},
methods: {
hiddenNvueLayer() {
if (!this.$refs['fui_ssm_ani'] || !this.$refs['fui_ss_ani']) return;
this._transtion('fui_ssm_ani', {
transform: 'translateX(-100%)'
}, 0)
this._transtion('fui_ss_ani', {
transform: 'translateY(100%)'
}, 0)
},
initData(vals) {
if (vals && vals.length > 0) {
if (Array.isArray(vals[0])) {
......@@ -313,13 +328,14 @@
/* #ifndef APP-NVUE */
transition: all 0.25s ease-in-out;
visibility: hidden;
opacity: 0;
/* #endif */
/* #ifdef APP-NVUE */
transition-property: opacity;
transition-timing-function: ease-in-out;
transition-duration: .25s;
opacity: 0.001;
/* #endif */
opacity: 0;
}
.fui-ss__mask-show {
......@@ -345,21 +361,12 @@
/* #endif */
/* #ifdef APP-NVUE */
/* transition-property: opacity;
transition-duration: .25s; */
transform: translateY(100%);
/* #endif */
transform-origin: center center;
flex-direction: column;
}
/* #ifdef APP-NVUE */
.fui-share__sheet-hidden {
opacity: 0;
}
/* #endif */
.fui-share__sheet-radius {
border-top-left-radius: 24rpx;
border-top-right-radius: 24rpx;
......@@ -368,19 +375,23 @@
/* #endif */
}
/* #ifdef APP-NVUE */
.fui-share__sheet-hidden {
opacity: 0.001;
}
/* #endif */
.fui-share__sheet-show {
/* #ifndef APP-NVUE */
transform: translate3d(0, 0, 0);
visibility: visible;
/* #endif */
/* #ifdef APP-NVUE */
opacity: 1 !important;
opacity: 1;
/* #endif */
}
.fui-share__sheet-title {
/* #ifndef APP-NVUE */
width: 100%;
......@@ -430,6 +441,9 @@
min-width: 100%;
box-sizing: border-box;
/* #endif */
/* #ifdef APP-NVUE */
flex: 1;
/* #endif */
justify-content: space-between;
}
......@@ -458,7 +472,9 @@
border-width: 0;
background-color: rgba(0, 0, 0, 0);
opacity: 0;
/* #ifndef APP-NVUE */
z-index: 1;
/* #endif */
}
/* #ifndef APP-NVUE */
......@@ -497,13 +513,16 @@
/* #ifndef APP-NVUE */
width: 100%;
display: flex;
box-sizing: content-box;
/* #endif */
/* #ifndef APP-NVUE || MP-TOUTIAO */
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
/* #endif */
/* #ifdef APP-NVUE */
flex: 1;
/* #endif */
height: 96rpx;
align-items: center;
justify-content: center;
......@@ -536,6 +555,8 @@
/* #ifndef APP-NVUE */
display: flex;
z-index: 2;
font-weight: normal;
box-sizing: content-box;
/* #endif */
/* #ifndef APP-NVUE || MP-TOUTIAO */
......@@ -554,7 +575,6 @@
/* #ifdef H5 */
cursor: pointer;
/* #endif */
font-weight: normal;
}
/* #ifdef APP-NVUE || MP-TOUTIAO */
......
src/components/FirstUI/fui-single-input/fui-single-input.vue
......@@ -242,7 +242,7 @@
// #ifndef MP-TOUTIAO
setTimeout(() => {
this.initFocus(this.isFocus)
}, 150)
}, 200)
// #endif
// #ifdef MP-TOUTIAO
......
src/components/FirstUI/fui-skeleton/fui-skeleton.vue
<template>
<view class="fui-skeleton__wrap " :style="{background:background,height:height+'px'}">
<view class="fui-skeleton__wrap" :style="{background:background,height:height+'px'}" ref="fui_skeleton">
<view class="fui-skeleton__item"
:class="{'fui-skeleton__dark':theme==='dark','fui-skeleton__dark-ani':active && theme==='dark','fui-skeleton__light-ani':active && theme!=='dark'}"
:style="{width: item.width+'px', height:item.height+'px', left: item.left+'px', top: item.top+'px',borderRadius:item.type==='round'?(isNvue?item.width/2+'px':'50%'):'6rpx'}"
......@@ -10,7 +10,7 @@
<script>
// #ifdef APP-NVUE
// const dom = uni.requireNativePlugin('dom');
const animation = uni.requireNativePlugin('animation');
// #endif
export default {
name: "fui-skeleton",
......@@ -59,6 +59,7 @@
// #endif
return {
isNvue: isNvue,
stop: false,
//round、rect
elList: [],
height: 0
......@@ -84,8 +85,46 @@
}
})
// #endif
// #ifdef APP-NVUE
this.$nextTick(() => {
setTimeout(() => {
this._animation(false)
}, 50)
})
// #endif
},
// #ifdef APP-NVUE
// #ifndef VUE3
beforeDestroy() {
this.stop = true;
},
// #endif
// #ifdef VUE3
beforeUnmount() {
this.stop = true;
},
// #endif
// #endif
methods: {
// #ifdef APP-NVUE
_animation(type) {
if (!this.$refs['fui_skeleton'] || this.stop || !this.active) return;
animation.transition(
this.$refs['fui_skeleton'].ref, {
styles: {
opacity: type ? 1 : 0.1
},
duration: 1000, //ms
timingFunction: 'linear',
iterationCount: 'infinite',
needLayout: false,
delay: 0 //ms
}, () => {
this._animation(!type)
}
);
},
// #endif
// #ifndef APP-NVUE
//nvue端暂不支持动态获取节点信息
async selectorQuery() {
......
src/components/FirstUI/fui-slider/bindingx.js
......@@ -39,16 +39,20 @@ export default {
this.onceRight = 0
},
mounted() {
this.handleLeft = this.getEl(this.$refs['handleLeft'])
this.poleLeft = this.getEl(this.$refs['poleLeft']);
this.handleRight = null;
this.poleRight = null;
this.initData(this.value)
if (this.section) {
this.handleRight = this.getEl(this.$refs['handleRight'])
this.poleRight = this.getEl(this.$refs['poleRight']);
this.initEndData(this.endValue)
}
this.$nextTick(() => {
setTimeout(() => {
this.handleLeft = this.getEl(this.$refs['handleLeft'])
this.poleLeft = this.getEl(this.$refs['poleLeft']);
this.handleRight = null;
this.poleRight = null;
this.initData(this.value)
if (this.section) {
this.handleRight = this.getEl(this.$refs['handleRight'])
this.poleRight = this.getEl(this.$refs['poleRight']);
this.initEndData(this.endValue)
}
}, 50)
})
},
methods: {
getEl(el) {
......
src/components/FirstUI/fui-slider/fui-slider.vue
......@@ -41,11 +41,11 @@
<view class="fui-slider__pole-right" :class="['fui-slider__pole-l']" ref="poleRight"
:style="{background:getActiveColor}"></view>
</view>
<view class="fui-slider__handle" fireEventSync="true" @touchstart="touchstart" @horizontalpan="touchmove"
<view class="fui-slider__handle" :fireEventSync="true" @touchstart="touchstart" @horizontalpan="touchmove"
@touchend="touchend" ref="handleLeft"
:style="{width:blockWidth+'px',height:blockHeight+'px',borderRadius:24+'px',background:blockColor}"
:class="['fui-slider__handle-left',isAndroid?'fui-slider__border':'fui-slider__shadow']"></view>
<view class="fui-slider__handle" fireEventSync="true" @touchstart="endTouchstart"
<view class="fui-slider__handle" :fireEventSync="true" @touchstart="endTouchstart"
@horizontalpan="endTouchmove" @touchend="endTouchend" ref="handleRight"
:style="{width:blockWidth+'px',height:blockHeight+'px',borderRadius:24+'px',background:blockColor}"
:class="['fui-slider__handle-right',isAndroid?'fui-slider__border':'fui-slider__shadow']"
......
src/components/FirstUI/fui-slider/mpjs.js
......@@ -28,10 +28,12 @@ export default {
}
},
mounted() {
this.initData(this.value)
if (this.section) {
this.initEndData(this.endValue)
}
this.$nextTick(()=>{
this.initData(this.value)
if (this.section) {
this.initEndData(this.endValue)
}
})
},
methods: {
initData(value) {
......
src/components/FirstUI/fui-spin/fui-spin.vue
......@@ -31,7 +31,12 @@
},
// #ifdef APP-NVUE
mounted() {
this._animation()
this.$nextTick(() => {
setTimeout(() => {
this.deg += 360;
this._animation()
}, 50)
})
},
// #endif
// #ifdef APP-NVUE
......
src/components/FirstUI/fui-steps/fui-steps.vue
......@@ -16,7 +16,8 @@
:class="{'fui-steps__background':index<=current && !getActiveColor,'fui-steps__border':index<=current && !getActiveColor}"
v-if="item.text && !(isMark && index==current)"
:style="{background:index<=current?getActiveColor:'#fff',borderColor:index<=current?getActiveColor:nodeColor,color:index<=current?'#fff':color}">{{item.text}}</text>
<view class="fui-steps__checkbox" :class="{'fui-steps__background':!getActiveColor && !processColor}"
<view class="fui-steps__checkbox"
:class="{'fui-steps__background':!getActiveColor && !processColor}"
:style="{background:processColor || getActiveColor}" v-if="isMark && index==current">
<template v-if="processStatus==='fail'">
<view class="fui-steps__ia-fail"></view>
......@@ -25,7 +26,8 @@
<view class="fui-steps__ic-waiting" v-else-if="processStatus==='wait'"></view>
<view class="fui-steps__checkmark" v-else></view>
</view>
<view class="fui-steps__node-dot" :class="{'fui-steps__background':index<=current && !getActiveColor}"
<view class="fui-steps__node-dot"
:class="{'fui-steps__background':index<=current && !getActiveColor}"
:style="{background:index<=current?getActiveColor:nodeColor}"
v-if="!item.text && !item.src && !(isMark && index==current)">
</view>
......@@ -153,7 +155,7 @@
}
return styles
},
getActiveColor(){
getActiveColor() {
let color = this.activeColor;
// #ifdef APP-NVUE
if (!color || color === true) {
......@@ -465,8 +467,9 @@
.fui-steps__ic-waiting {
height: 32rpx;
width: 32rpx;
border-width: 3px;
border-style: solid;
border-bottom-width: 3px;
border-left-width: 3px;
border-top-width: 0;
border-right-width: 0;
border-color: #fff;
......
src/components/FirstUI/fui-sticky/fui-sticky.vue
......@@ -75,11 +75,13 @@
}
},
mounted() {
setTimeout(() => {
this.init(() => {
this.updateStickyChange();
});
}, 50)
this.$nextTick(()=>{
setTimeout(() => {
this.init(() => {
this.updateStickyChange();
});
}, 50)
})
},
updated(e) {
this.$nextTick(() => {
......
src/components/FirstUI/fui-swipe-action/bindingx.js
......@@ -9,7 +9,7 @@ export default {
},
watch: {
show(newVal) {
if (this.autoClose) return
// if (this.autoClose) return
if (this.stop) return
this.stop = true
if (newVal) {
......@@ -29,9 +29,11 @@ export default {
}
},
mounted() {
this.box = this.getEl(this.$refs['fui_swipea_wrap'])
this.selector = this.getEl(this.$refs['fui_swipea_content']);
this.rightButton = this.getEl(this.$refs['fui_swipea_buttons']);
this.$nextTick(()=>{
this.box = this.getEl(this.$refs['fui_swipea_wrap'])
this.selector = this.getEl(this.$refs['fui_swipea_content']);
this.rightButton = this.getEl(this.$refs['fui_swipea_buttons']);
})
this.init()
},
methods: {
......
src/components/FirstUI/fui-swipe-action/mpjs.js
......@@ -29,11 +29,13 @@ export default {
}
},
mounted() {
this.group = this.getParent()
if (this.group.children !== undefined) {
this.group.children.push(this)
}
this.init()
this.$nextTick(()=>{
this.group = this.getParent()
if (this.group.children !== undefined) {
this.group.children.push(this)
}
this.init()
})
},
methods: {
init() {
......
src/components/FirstUI/fui-switch/fui-switch.vue
......@@ -14,12 +14,14 @@
</switch>
</view>
<!-- #endif -->
<view class="fui-checkbox__self" :class="{'fui-checkbox__disabled':disabled,'fui-switch__color':!getColor && val}"
:style="{background:val?getColor:'#fff',border:val?`1px solid ${getColor}`:`1px solid ${borderColor}`}" v-else>
<view class="fui-checkbox__self"
:class="{'fui-checkbox__disabled':disabled,'fui-switch__color':!getColor && val}"
:style="{background:val?getColor:'#fff',border:val?`1px solid ${getColor}`:`1px solid ${borderColor}`}"
v-else>
<view class="fui-check__mark" :style="{borderBottomColor:checkMarkColor,borderRightColor:checkMarkColor}"
v-if="val"></view>
<switch class="fui-switch__hidden" :class="{'fui-pointer__events':isLabel}"
style="opacity: 0;position: absolute;" @change="change" :name="name" :type="isNvue?'switch':'checkbox'"
style="opacity: 0;position: absolute;" @change="change" :name="name" type="checkbox"
:checked="val" :disabled="disabled"></switch>
</view>
</view>
......@@ -148,6 +150,13 @@
/* #endif */
/* #ifdef APP-NVUE */
.fui-switch__input {
border: 1px solid transparent;
}
/* #endif */
.fui-checkbox__self {
font-size: 0;
width: 40rpx;
......@@ -262,7 +271,6 @@
top: -1px;
left: -1px;
opacity: 0;
z-index: 2;
/* #ifndef APP-NVUE */
width: 100%;
height: 100%;
......@@ -270,6 +278,7 @@
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
z-index: 2;
/* #endif */
/* #ifdef APP-NVUE */
......
src/components/FirstUI/fui-tabbar/fui-tabbar.vue
......@@ -297,13 +297,18 @@
min-width: 32rpx !important;
display: flex;
box-sizing: border-box;
z-index: 10;
/* #endif */
flex-direction: row;
align-items: center;
justify-content: center;
/* #ifndef APP-NVUE */
right: -20rpx;
/* #endif */
/* #ifdef APP-NVUE */
right: 0;
/* #endif */
top: 0;
z-index: 10;
text-align: center;
}
......@@ -313,13 +318,15 @@
width: 16rpx;
/* #ifndef APP-NVUE */
border-radius: 50%;
right: -4rpx;
top: -4rpx;
/* #endif */
/* #ifdef APP-NVUE */
border-radius: 8rpx;
right: 0;
top: 0;
/* #endif */
right: -4rpx;
top: -4rpx;
}
.fui-tabbar__icon {
......
src/components/FirstUI/fui-table/fui-table.vue
......@@ -6,7 +6,7 @@
:class="{'fui-table__flex-row':!height || height==0}">
<!-- #endif -->
<!-- #ifndef MP-BAIDU -->
<scroll-view :show-scrollbar="false" scroll-x :scroll-y="height>0 && height!=0"
<scroll-view :show-scrollbar="false" :scroll-x="true" :scroll-y="height>0 && height!=0"
:style="{width:width+'px',height:height>0 || height!=0?height+'rpx':'auto'}"
class="fui-table__scroll-view" :class="{'fui-table__flex-row':!height || height==0}">
<!-- #endif -->
......
src/components/FirstUI/fui-tabs/fui-tabs.vue
<template>
<scroll-view class="fui-tabs__scrollbox"
:class="{'fui-tabs__fixed':isFixed && !isSticky,'fui-tabs__sticky':isSticky}" scroll-with-animation
:class="{'fui-tabs__fixed':isFixed && !isSticky,'fui-tabs__sticky':isSticky}" :scroll-with-animation="true"
:scroll-x="scroll" :show-scrollbar="false" :scroll-into-view="scrollInto"
:style="{background:background,zIndex:(isFixed || isSticky)?zIndex:1,top: isFixed || isSticky ? top + 'px' : 'auto'}">
<view class="fui-scroll__view" :class="{'fui-tabs__full':!alignLeft}">
......@@ -21,12 +21,15 @@
</image>
<!-- #ifdef APP-NVUE -->
<view class="fui-tabs__text">
<text
:style="{fontSize:selectedSize+'rpx',fontWeight:tabIndex===index?selectedFontWeight:fontWeight,height:height+'rpx',lineHeight:height+'rpx'}"
style="opacity: 0;">{{tab.name}}</text>
<text class="fui-tabs__text-nvue"
:class="{'fui-tabs__selected-color':!getSelectedColor && tabIndex===index,'fui-tabs__text-color':!color && tabIndex!==index}"
:style="{fontSize:(tabIndex===index && isNvue? selectedSize:size)+'rpx',color:tabIndex===index?getSelectedColor:color,fontWeight:tabIndex===index?selectedFontWeight:fontWeight,height:height+'rpx',lineHeight:height+'rpx'}">{{tab.name}}</text>
<text
:class="{'fui-tabs__badge-color':!getBadgeBgColor,'fui-tabs__badge-dot':isDot,'fui-tabs__badge':!isDot}"
:style="{color:badgeColor,background:getBadgeBgColor}"
:style="{color:badgeColor,background:getBadgeBgColor,top:getTop+'rpx'}"
v-if="tab.badge">{{isDot?'':tab.badge}}</text>
</view>
......@@ -228,8 +231,14 @@
created() {
this.initData(this.tabs)
},
computed:{
getSelectedColor(){
computed: {
// #ifdef APP-NVUE
getTop() {
const height = Number(this.height) - Number(this.selectedSize)
return height / 2
},
// #endif
getSelectedColor() {
let color = this.selectedColor
// #ifdef APP-NVUE
if (!color || color === true) {
......@@ -239,7 +248,7 @@
// #endif
return color
},
getSliderBgColor(){
getSliderBgColor() {
let color = this.sliderBackground
// #ifdef APP-NVUE
if (!color || color === true) {
......@@ -249,7 +258,7 @@
// #endif
return color
},
getBadgeBgColor(){
getBadgeBgColor() {
let color = this.badgeBackground
// #ifdef APP-NVUE
if (!color || color === true) {
......@@ -419,6 +428,8 @@
/* #ifndef APP-NVUE */
white-space: nowrap;
display: block;
transition: transform 0.2s linear;
z-index: 3;
/* #endif */
/* #ifdef APP-NVUE */
flex-wrap: nowrap;
......@@ -426,13 +437,16 @@
align-items: center;
justify-content: center;
/* #endif */
transition: transform 0.2s linear;
position: relative;
z-index: 3;
}
/* #ifdef APP-NVUE */
.fui-tabs__text-nvue {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
text-align: center;
}
......@@ -445,19 +459,22 @@
font-size: 24rpx;
line-height: 36rpx;
border-radius: 100px;
position: absolute;
/* #ifndef APP-NVUE */
min-width: 36rpx !important;
display: flex;
box-sizing: border-box;
position: absolute;
right: -32rpx;
top: -18rpx;
z-index: 10;
/* #endif */
/* #ifdef APP-NVUE */
right: 0;
/* #endif */
flex-direction: row;
align-items: center;
justify-content: center;
transform: scale(0.9);
z-index: 10;
}
.fui-tabs__badge-dot {
......@@ -466,15 +483,17 @@
/* #ifdef APP-NVUE */
border-radius: 100px;
/* #endif */
position: absolute;
/* #ifndef APP-NVUE */
display: inline-block;
position: absolute;
right: -6px;
top: -3px;
border-radius: 50%;
/* #endif */
z-index: 10;
/* #endif */
/* #ifdef APP-NVUE */
right: 0;
/* #endif */
}
.fui-tabs__line-wrap {
......
src/components/FirstUI/fui-tag/fui-tag.vue
<template>
<view class="fui-tag__wrap"
:class="[highlight?'fui-tag__opacity':'',originLeft?'fui-tag__origin-left':'',originRight?'fui-tag__origin-right':'',!background?`fui-tag__${type}-${theme}`:'']"
:style="{backgroundColor:getBackground,fontSize:size+'rpx',lineHeight:size+'rpx',color:color,borderColor:getBorderColor,zoom:isNvue?1:scaleRatio,transform: `scale(${isNvue?scaleRatio:1})`,borderRadius:radius+'rpx',paddingTop:padding[0] || 0,paddingRight:padding[1]|| 0,paddingBottom:padding[2] || padding[0] || 0,paddingLeft:padding[3] || padding[1] || 0,marginTop:marginTop+'rpx',marginRight:marginRight+'rpx',marginBottom:marginBottom+'rpx',marginLeft:marginLeft+'rpx'}"
:class="[highlight?'fui-tag__opacity':'',originLeft?'fui-tag__origin-left':'',originRight?'fui-tag__origin-right':'',!background?`fui-tag__${type}-${theme}`:'',(background && !borderColor) || !isBorder?'fui-tag__no-border':'']"
:style="{backgroundColor:getBackground,fontSize:size+'rpx',lineHeight:size+'rpx',color:color,borderColor:getBorderColor,transform: `scale(${scaleRatio})`,borderRadius:radius+'rpx',paddingTop:padding[0] || 0,paddingRight:padding[1]|| 0,paddingBottom:padding[2] || padding[0] || 0,paddingLeft:padding[3] || padding[1] || 0,marginTop:marginTop+'rpx',marginRight:marginRight+'rpx',marginBottom:marginBottom+'rpx',marginLeft:marginLeft+'rpx'}"
@tap="handleClick">
<text v-if="text" class="fui-tag__text" :class="[!background?`fui-tag_${type}-${theme}`:'']"
:style="{fontSize:size+'rpx',lineHeight:size+'rpx',color:getColor}">{{text}}</text>
......@@ -41,6 +41,11 @@
type: String,
default: ''
},
//v2.0.0+
isBorder: {
type: Boolean,
default: true
},
borderColor: {
type: String,
default: ''
......@@ -107,13 +112,8 @@
}
},
data() {
let isNvue = false
// #ifdef APP-NVUE
isNvue = true
// #endif
const app = uni && uni.$fui && uni.$fui.color;
return {
isNvue: isNvue,
// #ifdef APP-NVUE
dark: {
primary: (app && app.primary) || '#465CFF',
......@@ -208,6 +208,10 @@
text-overflow: ellipsis;
}
.fui-tag__no-border {
border-width: 0;
}
.fui-tag__text {
/* #ifdef APP-NVUE */
lines: 1;
......
src/components/FirstUI/fui-text/fui-text.vue
......@@ -11,10 +11,12 @@
:userSelect="userSelect" :decode="decode">{{getText(text, textType, format)}}</text>
<!-- #endif -->
<!-- #ifdef APP-NVUE -->
<text class="fui-text__content"
:style="{color:getColor,fontSize:getSize,lineHeight:lineHeight?getSize:'auto',textAlign:align,textDecoration:decoration,fontWeight:fontWeight}"
:class="[color?'':'fui-text__'+type,unShrink?'fui-text__unshrink':'']" :userSelect="userSelect"
:decode="decode">{{getText(text, textType, format)}}</text>
<view class="fui-text__nvue">
<text class="fui-text__content"
:style="{color:getColor,fontSize:getSize,lineHeight:lineHeight?getSize:'auto',textAlign:align,textDecoration:decoration,fontWeight:fontWeight}"
:class="[color?'':'fui-text__'+type,unShrink?'fui-text__unshrink':'']" :userSelect="userSelect"
:decode="decode">{{getText(text, textType, format)}}</text>
</view>
<!-- #endif -->
<slot name="right"></slot>
</view>
......@@ -236,6 +238,12 @@
/* #endif */
/* #ifdef APP-NVUE */
.fui-text__nvue{
flex: 1;
}
/* #endif */
.fui-text__center {
justify-content: center;
}
......
src/components/FirstUI/fui-textarea/fui-textarea.vue
......@@ -4,15 +4,16 @@
:style="{paddingTop:padding[0] || 0,paddingRight:padding[1] || 0,paddingBottom:padding[2] || padding[0] || 0,paddingLeft:padding[3] || padding[1] || 0,background:backgroundColor,borderRadius:radius+'rpx',borderColor:borderColor,marginTop:marginTop+'rpx'}"
@tap="fieldClick">
<view v-if="borderTop && !textareaBorder"
:style="{background:borderColor,left:topLeft+'rpx',right:topRight+'rpx'}" class="fui-textarea__border-top" :class="{'fui-textarea__background':!borderColor}">
:style="{background:borderColor,left:topLeft+'rpx',right:topRight+'rpx'}" class="fui-textarea__border-top"
:class="{'fui-textarea__background':!borderColor}">
</view>
<!-- #ifndef APP-NVUE -->
<view class="fui-textarea__border" :class="{'fui-textarea__bordercolor':!borderColor}" :style="{borderRadius:getRadius,borderColor:borderColor}"
v-if="textareaBorder"></view>
<view class="fui-textarea__border" :class="{'fui-textarea__bordercolor':!borderColor}"
:style="{borderRadius:getRadius,borderColor:borderColor}" v-if="textareaBorder"></view>
<!-- #endif -->
<!-- #ifdef APP-NVUE -->
<view class="fui-textarea__required" v-if="required && !flexStart">
<text :style="{color:getRequiredColor,paddingTop:'2rpx'}">*</text>
<text class="fui-form__asterisk-text" :style="{color:getRequiredColor,paddingTop:'2rpx'}">*</text>
</view>
<text class="fui-textarea__required" :style="{color:getRequiredColor,top:requiredTop}"
v-if="required && flexStart">*</text>
......@@ -26,7 +27,7 @@
</view>
<slot name="left"></slot>
<view class="fui-textarea__flex-1">
<textarea class="fui-textarea__self" :class="{'fui-text__right':textRight}"
<textarea ref="fuiTextarea" class="fui-textarea__self" :class="{'fui-text__right':textRight}"
:style="{height:height,minHeight:minHeight,fontSize:size+'rpx',color:color}"
placeholder-class="fui-textarea-placeholder" :name="name" :value="val" :placeholder="placeholder"
:placeholderStyle="placeholderStyl" :disabled="disabled" :cursor-spacing="cursorSpacing"
......@@ -318,9 +319,25 @@
watch: {
focus(val) {
this.$nextTick(() => {
this.focused = val
setTimeout(() => {
this.focused = val
}, 20)
})
},
// #ifdef APP-NVUE
focused(val) {
if (!this.$refs.fuiTextarea) return;
this.$nextTick(() => {
setTimeout(() => {
if (val) {
this.$refs.fuiTextarea.focus()
} else {
this.$refs.fuiTextarea.blur()
}
}, 50)
})
},
// #endif
placeholderStyle() {
this.fieldPlaceholderStyle()
},
......@@ -352,7 +369,9 @@
},
mounted() {
this.$nextTick(() => {
this.focused = this.focus
setTimeout(() => {
this.focused = this.focus
}, 300)
})
},
methods: {
......@@ -480,12 +499,21 @@
/* #ifdef APP-NVUE */
flex: 1;
height: 100wx;
top: 28rpx;
bottom: 28rpx;
align-items: center;
justify-content: center;
/* #endif */
}
/* #ifdef APP-NVUE */
.fui-form__asterisk-text {
font-size: 32rpx;
height: 32rpx;
}
/* #endif */
/* #ifndef APP-NVUE */
.fui-required__flex-start {
transform: translateY(0);
......@@ -571,12 +599,13 @@
-webkit-user-select: none;
user-select: none;
}
.fui-textarea__bordercolor{
border-color:var(--fui-color-border, #EEEEEE) !important;
.fui-textarea__bordercolor {
border-color: var(--fui-color-border, #EEEEEE) !important;
}
.fui-textarea__background{
background: var(--fui-color-border, #EEEEEE) !important;
.fui-textarea__background {
background: var(--fui-color-border, #EEEEEE) !important;
}
/* #endif */
......
src/components/FirstUI/fui-timeaxis/fui-timeaxis.vue
......@@ -27,15 +27,19 @@
type: [Number, String],
default: 48
},
// #ifdef APP-NVUE
lineWidth: {
type: [Number, String],
// #ifdef APP-NVUE
default: 0.5
// #endif
// #ifndef APP-NVUE
},
// #endif
// #ifndef APP-NVUE
lineWidth: {
type: [Number, String],
default: 1
// #endif
}
// #endif
},
provide() {
return {
......
src/components/FirstUI/fui-toast/fui-toast.vue
......@@ -183,11 +183,16 @@
/* #endif */
.fui-toast__icon-box {
padding-bottom: 20rpx;
/* #ifndef APP-NVUE */
box-sizing: content-box;
flex-shrink: 0;
/* #endif */
}
/* #ifndef APP-NVUE */
.fui-toast__icon {
display: block;
flex-shrink: 0;
}
/* #endif */
......
src/components/FirstUI/fui-top-popup/fui-top-popup.vue
......@@ -35,7 +35,7 @@
},
zIndex: {
type: [Number, String],
default: 1001
default: 996
},
//点击遮罩 是否可关闭
maskClosable: {
......@@ -137,7 +137,7 @@
right: 0;
top: 0;
bottom: 0;
z-index: 1001;
z-index: 996;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
......
src/components/FirstUI/fui-vtabs-content/fui-vtabs-content.vue
......@@ -20,11 +20,13 @@
mounted() {
if (this.vtabs && this.vtabs.linkage) {
this.vtabs.children.push(this)
setTimeout(() => {
this.calcHeight((height) => {
this.vtabs.getCalcHeight(height, Number(this.tabIndex))
})
}, 300)
this.$nextTick(()=>{
setTimeout(() => {
this.calcHeight((height) => {
this.vtabs.getCalcHeight(height, Number(this.tabIndex))
})
}, 300)
})
}
},
// #ifndef VUE3
......
src/hooks/app/useConcealedExit.ts 0 → 100644
/**
* 隐藏式退出应用 Hook
* @param max 最大点击次数
* @returns 退出函数
*/
export function useConcealedExit(max = 10) {
const maxTapCount = max
const count = ref(0)
let loop: NodeJS.Timer
// 隐藏退出功能计数
function exit() {
// #ifdef APP-PLUS
count.value++
// #endif
}
// 退出或过期时清理计数
function reset() {
count.value = 0
if (loop) {
clearTimeout(loop)
loop = null
}
}
// #ifdef APP-PLUS
watch(
() => count.value,
() => {
if (count.value >= maxTapCount - 3) {
Message.toast(`再点击 ${maxTapCount - count.value} 次将退出应用`)
// 达到最大点击次数时退出
if (count.value >= maxTapCount) {
reset()
plus.runtime.quit()
}
}
if (!loop && count.value > 0) {
// 15 秒内未点击则清空计数
loop = setTimeout(reset, 15 * 1000)
}
},
)
// #endif
return {
exit,
reset,
}
}
src/pages/index/index.vue
......@@ -2,7 +2,9 @@
import dayjs from 'dayjs'
import { checkUpgrade } from '@/utils/upgrade'
import { useRuntime } from '@/hooks/app/useRuntime'
import { useConcealedExit } from '@/hooks/app/useConcealedExit'
const { exit } = useConcealedExit()
const { app } = useRuntime()
const year = ref(dayjs().year())
const title = ref('Hello World')
......@@ -68,13 +70,13 @@
<fui-divider />
<uni-icons type="hand-up" size="30" :class="[animate]" @click="handUp" />
<uni-icons type="hand-up" size="30" :class="[animate]" @tap="handUp" />
</view>
<fui-footer isFixed>
<template #text>
<view v-if="version" @click="checkUpgrade(true)">V{{ version }}</view>
<view v-if="version" @tap="checkUpgrade(true)">V{{ version }}</view>
<view class="mt-1">壹润科技 版权所有</view>
<view class="mt-1">Copyright © 2021-{{ year }} Yiring. All Ringhts Reserved</view>
<view class="mt-1" @tap="exit">Copyright © 2021-{{ year }} Yiring. All Ringhts Reserved</view>
</template>
</fui-footer>
</view>
......
vite.config.ts
import process from 'node:process'
import { loadEnv } from 'vite'
import type { ConfigEnv, UserConfig } from 'vite'
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论