首页UI完成80%
This commit is contained in:
@@ -0,0 +1,12 @@
|
||||
import request from '@/api/request'
|
||||
|
||||
|
||||
// 获取首页统计数据方法
|
||||
export const getStatisticsData = (data) => {
|
||||
return request({
|
||||
url: '/plappro/process/queryProcessList',
|
||||
method: 'post',
|
||||
data,
|
||||
suppressErrors:true
|
||||
});
|
||||
};
|
||||
@@ -1,5 +1,5 @@
|
||||
import request from '@/api/request'
|
||||
import common from "../../common/common";
|
||||
import common from "@/common/common";
|
||||
|
||||
const setToken = data => uni.setStorageSync('token', data)
|
||||
const setUserInfo = data => uni.setStorageSync('userInfo', data)
|
||||
@@ -14,11 +14,11 @@ export const useAccountLoginApp = (data) => request({
|
||||
setToken(body)
|
||||
// deptId: ""
|
||||
// deptName: null
|
||||
// loginName: "ADMIN"
|
||||
// loginName: "ADMIN" // todo id
|
||||
// orgId: "00E200"
|
||||
// orgName: "金融科技部"
|
||||
// userId: "USER001"
|
||||
// userName: "ADMIN"
|
||||
// userName: "ADMIN" / todo name
|
||||
// userStatus: "01"
|
||||
const user_data = await queryCurrentUser()
|
||||
setUserInfo(user_data.body)
|
||||
+13
-3
@@ -21,6 +21,7 @@ export default function request({
|
||||
data,
|
||||
meta,
|
||||
isStream,
|
||||
suppressErrors
|
||||
}) {
|
||||
const base_url = get_base_url(url);
|
||||
|
||||
@@ -43,17 +44,23 @@ export default function request({
|
||||
if (isStream) { // 流式传输,直接返回
|
||||
return resolve(response);
|
||||
}
|
||||
|
||||
// 0005 QQ0005 登录已过期
|
||||
|
||||
// suppressErrors
|
||||
// 模拟拦截器功能
|
||||
const res = response.data
|
||||
if (res?.rtnCode === '0000'){
|
||||
return resolve(res)
|
||||
}
|
||||
//到这里全是异常情况
|
||||
if(suppressErrors){ // 静默的接口,报错也不处理,因为下面有公共处理
|
||||
return reject()
|
||||
}
|
||||
if (!res) {
|
||||
common.msg("系统异常.")
|
||||
return reject()
|
||||
}
|
||||
if (res.rtnCode === '0000'){
|
||||
return resolve(res)
|
||||
}
|
||||
if (res.rtnCode === '0005' || res.rtnCode === 'QQ0005'){
|
||||
common.hideLoading()
|
||||
common.show('未登录','现在去登录').then(() => {
|
||||
@@ -61,6 +68,9 @@ export default function request({
|
||||
})
|
||||
}
|
||||
return reject(res)
|
||||
},
|
||||
fail() {
|
||||
console.log('131231');
|
||||
}
|
||||
});
|
||||
})
|
||||
|
||||
+89
-31
@@ -25,7 +25,7 @@
|
||||
<!-- 滚动通知 -->
|
||||
<view class="notice_div">
|
||||
<uv-notice-bar v-show="notice_text.length" :text="notice_text" :bgColor="null"
|
||||
color="rgba(255,255,255,0.7)" fontSize="10px" :speed="40" direction="column"></uv-notice-bar>
|
||||
color="rgba(255,255,255,0.7)" :speed="40" direction="column"></uv-notice-bar>
|
||||
</view>
|
||||
<!-- 学习时长和飞天兔子,为了挡住部分兔子只能多一个盒子 -->
|
||||
<view class="study_duration_and_profile_div">
|
||||
@@ -37,16 +37,19 @@
|
||||
<view class="study_duration_div">
|
||||
|
||||
<view class="item">
|
||||
<view class="top">累计学习时长</view>
|
||||
<view class="bottom">256h</view>
|
||||
<view class="top">年度学习时长</view>
|
||||
<view class="bottom">
|
||||
<uv-count-to :startVal="0" :endVal="256" :useEasing="true" :decimals="0"></uv-count-to>h
|
||||
</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="top">累计训练时长</view>
|
||||
<view class="bottom">224h</view>
|
||||
<view class="bottom">
|
||||
<uv-count-to :startVal="0" :endVal="224" :useEasing="true"></uv-count-to>h</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="top">累计考试次数</view>
|
||||
<view class="bottom">25</view>
|
||||
<view class="bottom"><uv-count-to :startVal="0" :endVal="25" :useEasing="true"></uv-count-to></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -120,7 +123,7 @@
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
|
||||
|
||||
<!-- 推荐课程分模块标题 -->
|
||||
<view class="module_title_div">
|
||||
<view class="icon">
|
||||
@@ -153,7 +156,7 @@
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
|
||||
|
||||
<!-- 最新课程分模块标题 -->
|
||||
<view class="module_title_div">
|
||||
<view class="icon">
|
||||
@@ -190,7 +193,7 @@
|
||||
<uv-divider text='我是有底线的' lineColor="#9cB0DC" :hairline="true"></uv-divider>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<tabbar-shadow></tabbar-shadow>
|
||||
</view>
|
||||
</template>
|
||||
@@ -200,7 +203,13 @@
|
||||
onMounted,
|
||||
ref
|
||||
} from 'vue'
|
||||
import common from '../../common/common'
|
||||
import {
|
||||
onShow
|
||||
} from '@dcloudio/uni-app'
|
||||
import common from '@/common/common'
|
||||
import {
|
||||
getStatisticsData
|
||||
} from '@/api/index.js'
|
||||
|
||||
// 静态样式配置
|
||||
const customStyles = {
|
||||
@@ -226,6 +235,31 @@
|
||||
date: '',
|
||||
num: ''
|
||||
}])
|
||||
const statistics_data = {
|
||||
'study': 0, // 学习
|
||||
'train': 0, // 训练
|
||||
'exam': 0, //考试
|
||||
'start_tudy': 0, // 起始学习
|
||||
'start_train': 0, // 起始训练
|
||||
'start_exam': 0, //起始考试
|
||||
'request_time': 0, //上次请求时间
|
||||
}
|
||||
|
||||
// 获取首页统计数据方法
|
||||
const get_statistics_data = async () => {
|
||||
if (!common.isLogin()) return
|
||||
const time_now = Date.now()
|
||||
// 暂时设置10分钟
|
||||
if (time_now - statistics_data['request_time'] > 600 * 1000) {
|
||||
statistics_data['request_time'] = time_now
|
||||
const data = await getStatisticsData()
|
||||
|
||||
}
|
||||
}
|
||||
onShow(() => {
|
||||
get_statistics_data() // 获取首页统计数据
|
||||
console.log('onShow');
|
||||
})
|
||||
onMounted(() => {
|
||||
|
||||
setTimeout(() => {
|
||||
@@ -249,24 +283,25 @@
|
||||
|
||||
<style lang="scss" scoped>
|
||||
$bg-margin-left: 50rpx;
|
||||
|
||||
|
||||
// :deep(.uni-scroll-view-content) {
|
||||
// display: flex;
|
||||
// }
|
||||
|
||||
|
||||
// :deep(.uv-skeleton__wrapper__avatar) {
|
||||
// height: 146rpx !important;
|
||||
// width: 146rpx !important;
|
||||
// border-radius: 16rpx;
|
||||
// }
|
||||
|
||||
.bottom_line{
|
||||
|
||||
.bottom_line {
|
||||
|
||||
margin: 0 auto;
|
||||
width: 240rpx;
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
.hot_class_div {
|
||||
margin-left: $bg-margin-left;
|
||||
|
||||
@@ -292,12 +327,13 @@
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
|
||||
|
||||
.left {
|
||||
border-radius: 16rpx;
|
||||
overflow: hidden;
|
||||
width: 180rpx;
|
||||
height: 146rpx;
|
||||
|
||||
.img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
@@ -398,7 +434,7 @@
|
||||
z-index: 20;
|
||||
display: flex;
|
||||
position: relative;
|
||||
|
||||
|
||||
.message_div {
|
||||
position: absolute;
|
||||
top: 4rpx;
|
||||
@@ -406,11 +442,13 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
.message_img {
|
||||
width: 32rpx;
|
||||
height: 36rpx;
|
||||
}
|
||||
.message_text{
|
||||
|
||||
.message_text {
|
||||
margin-top: 4rpx;
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
font-weight: 400;
|
||||
@@ -419,7 +457,7 @@
|
||||
line-height: 24rpx;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
|
||||
.message_num {
|
||||
position: absolute;
|
||||
top: 2rpx;
|
||||
@@ -431,7 +469,7 @@
|
||||
height: 20rpx;
|
||||
font-size: 10rpx;
|
||||
color: #ffffff;
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -448,15 +486,29 @@
|
||||
font-style: normal;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
::v-deep .u-notice-bar {
|
||||
padding: 14rpx 0;
|
||||
font-size: 22rpx;
|
||||
|
||||
:deep(.uv-notice-bar) {
|
||||
padding: 9px 2px;
|
||||
}
|
||||
|
||||
::v-deep .u-notice__left-icon {
|
||||
margin-right: 5rpx;
|
||||
|
||||
:deep(.uv-notice__swiper__item__text) {
|
||||
font-size: 20rpx !important;
|
||||
}
|
||||
:deep(.uv-notice__left-icon) .uv-icon__icon {
|
||||
font-size: 24rpx !important;
|
||||
}
|
||||
|
||||
|
||||
// ::v-deep .u-notice-bar {
|
||||
// padding: 14rpx 0;
|
||||
// font-size: 22rpx;
|
||||
// }
|
||||
|
||||
|
||||
// :deep(.u-notice__left-icon) {
|
||||
// margin-right: 5rpx;
|
||||
// }
|
||||
|
||||
}
|
||||
|
||||
// 学习时长
|
||||
@@ -484,8 +536,10 @@
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
z-index: 20;
|
||||
|
||||
|
||||
.item {
|
||||
flex: 1;
|
||||
// background-color: red;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
@@ -499,6 +553,7 @@
|
||||
text-align: center;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.bottom {
|
||||
margin-top: 5%;
|
||||
font-weight: bold;
|
||||
@@ -508,11 +563,14 @@
|
||||
text-align: left;
|
||||
font-style: normal;
|
||||
text-align: center;
|
||||
|
||||
// 数字滚动组件
|
||||
:deep(.uv-count-num) {
|
||||
font-weight: bold !important;
|
||||
font-size: 50rpx !important;
|
||||
color: #000000 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -70,14 +70,14 @@
|
||||
// import { v4 as uuid4 } from 'uuid'
|
||||
import { ref, computed } from 'vue'
|
||||
import common from '@/common/common'
|
||||
import { useAccountLoginApp, queryCurrentUser } from '@/api/login/login.js'
|
||||
import { useAccountLoginApp, queryCurrentUser } from '@/api/login.js'
|
||||
import { encryptByAES } from '@/api/encryptAndDecryptData.js'
|
||||
|
||||
const show_password = ref<Boolean>(false)
|
||||
const account = ref<string>('admin')
|
||||
const password = ref<string>('123456')
|
||||
const read_text_state = ref<Array<unknown>>([])
|
||||
|
||||
|
||||
// 登录按钮状态
|
||||
const login_button_status = computed<boolean>(() => !read_text_state.value.length)
|
||||
|
||||
@@ -106,16 +106,13 @@
|
||||
common.msg('账号或密码错误,如忘记密码,请去统一身份认证平台修改。')
|
||||
}
|
||||
else if (res.rtnCode !== "0005") {
|
||||
common.msg('其他错误')
|
||||
common.msg('登录出错,请稍后再试')
|
||||
}
|
||||
})
|
||||
} catch (e) {
|
||||
common.hideLoading()
|
||||
}
|
||||
}
|
||||
const aaa = () => {
|
||||
console.log('111');
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
@@ -12,8 +12,7 @@
|
||||
import common from '@/common/common'
|
||||
import {
|
||||
getYsxy
|
||||
} from '@/api/login/login.js'
|
||||
|
||||
} from '@/api/login.js'
|
||||
const ysxi_text = ref('')
|
||||
onMounted(() => {
|
||||
common.loading()
|
||||
|
||||
@@ -0,0 +1,13 @@
|
||||
## 1.0.4(2023-06-20)
|
||||
1. 优化
|
||||
## 1.0.3(2023-06-20)
|
||||
1. 修复继续滚动的函数
|
||||
2. 修复其他
|
||||
## 1.0.2(2023-06-20)
|
||||
1. 适配px和rpx的单位
|
||||
2. 适配customStyle参数
|
||||
## 1.0.1(2023-05-16)
|
||||
1. 优化组件依赖,修改后无需全局引入,组件导入即可使用
|
||||
2. 优化部分功能
|
||||
## 1.0.0(2023-05-10)
|
||||
uv-count-to 数字滚动
|
||||
@@ -0,0 +1,60 @@
|
||||
export default {
|
||||
props: {
|
||||
// 开始的数值,默认从0增长到某一个数
|
||||
startVal: {
|
||||
type: [String, Number],
|
||||
default: 0
|
||||
},
|
||||
// 要滚动的目标数值,必须
|
||||
endVal: {
|
||||
type: [String, Number],
|
||||
default: 0
|
||||
},
|
||||
// 滚动到目标数值的动画持续时间,单位为毫秒(ms)
|
||||
duration: {
|
||||
type: [String, Number],
|
||||
default: 2000
|
||||
},
|
||||
// 设置数值后是否自动开始滚动
|
||||
autoplay: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
// 要显示的小数位数
|
||||
decimals: {
|
||||
type: [String, Number],
|
||||
default: 0
|
||||
},
|
||||
// 是否在即将到达目标数值的时候,使用缓慢滚动的效果
|
||||
useEasing: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
// 十进制分割
|
||||
decimal: {
|
||||
type: [String, Number],
|
||||
default: '.'
|
||||
},
|
||||
// 字体颜色
|
||||
color: {
|
||||
type: String,
|
||||
default: '#606266'
|
||||
},
|
||||
// 字体大小
|
||||
fontSize: {
|
||||
type: [String, Number],
|
||||
default: 22
|
||||
},
|
||||
// 是否加粗字体
|
||||
bold: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
// 千位分隔符,类似金额的分割(¥23,321.05中的",")
|
||||
separator: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
...uni.$uv?.props?.countTo
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,187 @@
|
||||
<template>
|
||||
<text
|
||||
class="uv-count-num"
|
||||
:style="[{
|
||||
fontSize: $uv.addUnit(fontSize),
|
||||
fontWeight: bold ? 'bold' : 'normal',
|
||||
color: color
|
||||
},$uv.addStyle(customStyle)]"
|
||||
>{{ displayValue }}</text>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import mpMixin from '@/uni_modules/uv-ui-tools/libs/mixin/mpMixin.js'
|
||||
import mixin from '@/uni_modules/uv-ui-tools/libs/mixin/mixin.js'
|
||||
import props from './props.js';
|
||||
/**
|
||||
* countTo 数字滚动
|
||||
* @description 该组件一般用于需要滚动数字到某一个值的场景,目标要求是一个递增的值。
|
||||
* @tutorial https://www.uvui.cn/components/countTo.html
|
||||
* @property {String | Number} startVal 开始的数值,默认从0增长到某一个数(默认 0 )
|
||||
* @property {String | Number} endVal 要滚动的目标数值,必须 (默认 0 )
|
||||
* @property {String | Number} duration 滚动到目标数值的动画持续时间,单位为毫秒(ms) (默认 2000 )
|
||||
* @property {Boolean} autoplay 设置数值后是否自动开始滚动 (默认 true )
|
||||
* @property {String | Number} decimals 要显示的小数位数,见官网说明(默认 0 )
|
||||
* @property {Boolean} useEasing 滚动结束时,是否缓动结尾,见官网说明(默认 true )
|
||||
* @property {String} decimal 十进制分割 ( 默认 "." )
|
||||
* @property {String} color 字体颜色( 默认 '#606266' )
|
||||
* @property {String | Number} fontSize 字体大小,单位px( 默认 22 )
|
||||
* @property {Boolean} bold 字体是否加粗(默认 false )
|
||||
* @property {String} separator 千位分隔符,见官网说明
|
||||
* @event {Function} end 数值滚动到目标值时触发
|
||||
* @example <uv-count-to ref="uCountTo" :end-val="endVal" :autoplay="autoplay"></uv-count-to>
|
||||
*/
|
||||
export default {
|
||||
name: 'uv-count-to',
|
||||
data() {
|
||||
return {
|
||||
localStartVal: this.startVal,
|
||||
displayValue: this.formatNumber(this.startVal),
|
||||
printVal: null,
|
||||
paused: false, // 是否暂停
|
||||
localDuration: Number(this.duration),
|
||||
startTime: null, // 开始的时间
|
||||
timestamp: null, // 时间戳
|
||||
remaining: null, // 停留的时间
|
||||
rAF: null,
|
||||
lastTime: 0 // 上一次的时间
|
||||
};
|
||||
},
|
||||
mixins: [mpMixin, mixin, props],
|
||||
computed: {
|
||||
countDown() {
|
||||
return this.startVal > this.endVal;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
startVal() {
|
||||
this.autoplay && this.start();
|
||||
},
|
||||
endVal() {
|
||||
this.autoplay && this.start();
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.autoplay && this.start();
|
||||
},
|
||||
methods: {
|
||||
easingFn(t, b, c, d) {
|
||||
return (c * (-Math.pow(2, (-10 * t) / d) + 1) * 1024) / 1023 + b;
|
||||
},
|
||||
requestAnimationFrame(callback) {
|
||||
const currTime = new Date().getTime();
|
||||
// 为了使setTimteout的尽可能的接近每秒60帧的效果
|
||||
const timeToCall = Math.max(0, 16 - (currTime - this.lastTime));
|
||||
const id = setTimeout(() => {
|
||||
callback(currTime + timeToCall);
|
||||
}, timeToCall);
|
||||
this.lastTime = currTime + timeToCall;
|
||||
return id;
|
||||
},
|
||||
cancelAnimationFrame(id) {
|
||||
clearTimeout(id);
|
||||
},
|
||||
// 开始滚动数字
|
||||
start() {
|
||||
this.localStartVal = this.startVal;
|
||||
this.startTime = null;
|
||||
this.localDuration = this.duration;
|
||||
this.paused = false;
|
||||
this.rAF = this.requestAnimationFrame(this.count);
|
||||
},
|
||||
// 暂定状态,从暂停状态开始滚动;或者滚动状态下,暂停
|
||||
restart() {
|
||||
if (this.paused) {
|
||||
this.resume();
|
||||
this.paused = false;
|
||||
} else {
|
||||
this.stop();
|
||||
this.paused = true;
|
||||
}
|
||||
},
|
||||
// 暂停
|
||||
stop() {
|
||||
this.cancelAnimationFrame(this.rAF);
|
||||
this.paused = true;
|
||||
},
|
||||
// 重新开始(暂停的情况下)
|
||||
resume() {
|
||||
if (!this.remaining) return;
|
||||
this.startTime = 0;
|
||||
this.localDuration = this.remaining;
|
||||
this.localStartVal = this.printVal;
|
||||
this.requestAnimationFrame(this.count);
|
||||
},
|
||||
// 重置
|
||||
reset() {
|
||||
this.startTime = null;
|
||||
this.cancelAnimationFrame(this.rAF);
|
||||
this.displayValue = this.formatNumber(this.startVal);
|
||||
},
|
||||
count(timestamp) {
|
||||
if (!this.startTime) this.startTime = timestamp;
|
||||
this.timestamp = timestamp;
|
||||
const progress = timestamp - this.startTime;
|
||||
this.remaining = this.localDuration - progress;
|
||||
if (this.useEasing) {
|
||||
if (this.countDown) {
|
||||
this.printVal = this.localStartVal - this.easingFn(progress, 0, this.localStartVal - this.endVal, this.localDuration);
|
||||
} else {
|
||||
this.printVal = this.easingFn(progress, this.localStartVal, this.endVal - this.localStartVal, this.localDuration);
|
||||
}
|
||||
} else {
|
||||
if (this.countDown) {
|
||||
this.printVal = this.localStartVal - (this.localStartVal - this.endVal) * (progress / this.localDuration);
|
||||
} else {
|
||||
this.printVal = this.localStartVal + (this.endVal - this.localStartVal) * (progress / this.localDuration);
|
||||
}
|
||||
}
|
||||
if (this.countDown) {
|
||||
this.printVal = this.printVal < this.endVal ? this.endVal : this.printVal;
|
||||
} else {
|
||||
this.printVal = this.printVal > this.endVal ? this.endVal : this.printVal;
|
||||
}
|
||||
this.displayValue = this.formatNumber(this.printVal) || 0;
|
||||
if (progress < this.localDuration) {
|
||||
this.rAF = this.requestAnimationFrame(this.count);
|
||||
} else {
|
||||
this.$emit('end');
|
||||
}
|
||||
},
|
||||
// 判断是否数字
|
||||
isNumber(val) {
|
||||
return !isNaN(parseFloat(val));
|
||||
},
|
||||
formatNumber(num) {
|
||||
// 将num转为Number类型,因为其值可能为字符串数值,调用toFixed会报错
|
||||
num = Number(num);
|
||||
num = num.toFixed(Number(this.decimals));
|
||||
num += '';
|
||||
const x = num.split('.');
|
||||
let x1 = x[0];
|
||||
const x2 = x.length > 1 ? `${this.decimal}${x[1]}` : '';
|
||||
const rgx = /(\d+)(\d{3})/;
|
||||
if (this.separator && !this.isNumber(this.separator)) {
|
||||
while (rgx.test(x1)) {
|
||||
x1 = x1.replace(rgx, '$1' + this.separator + '$2');
|
||||
}
|
||||
}
|
||||
return x1 + x2;
|
||||
},
|
||||
destroyed() {
|
||||
this.cancelAnimationFrame(this.rAF);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import '@/uni_modules/uv-ui-tools/libs/css/components.scss';
|
||||
|
||||
.uv-count-num {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: inline-flex;
|
||||
/* #endif */
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,87 @@
|
||||
{
|
||||
"id": "uv-count-to",
|
||||
"displayName": "uv-count-to 数字滚动 全面兼容小程序、nvue、vue2、vue3等多端",
|
||||
"version": "1.0.4",
|
||||
"description": "该数字滚动组件一般用于需要滚动数字到某一个值的场景,目标要求是一个递增的值,一种数字上升的视觉冲击效果。",
|
||||
"keywords": [
|
||||
"countTo",
|
||||
"uvui",
|
||||
"uv-ui",
|
||||
"数字滚动",
|
||||
"数字变化"
|
||||
],
|
||||
"repository": "",
|
||||
"engines": {
|
||||
"HBuilderX": "^3.1.0"
|
||||
},
|
||||
"dcloudext": {
|
||||
"type": "component-vue",
|
||||
"sale": {
|
||||
"regular": {
|
||||
"price": "0.00"
|
||||
},
|
||||
"sourcecode": {
|
||||
"price": "0.00"
|
||||
}
|
||||
},
|
||||
"contact": {
|
||||
"qq": ""
|
||||
},
|
||||
"declaration": {
|
||||
"ads": "无",
|
||||
"data": "插件不采集任何数据",
|
||||
"permissions": "无"
|
||||
},
|
||||
"npmurl": ""
|
||||
},
|
||||
"uni_modules": {
|
||||
"dependencies": [
|
||||
"uv-ui-tools"
|
||||
],
|
||||
"encrypt": [],
|
||||
"platforms": {
|
||||
"cloud": {
|
||||
"tcb": "y",
|
||||
"aliyun": "y"
|
||||
},
|
||||
"client": {
|
||||
"Vue": {
|
||||
"vue2": "y",
|
||||
"vue3": "y"
|
||||
},
|
||||
"App": {
|
||||
"app-vue": "y",
|
||||
"app-nvue": "y"
|
||||
},
|
||||
"H5-mobile": {
|
||||
"Safari": "y",
|
||||
"Android Browser": "y",
|
||||
"微信浏览器(Android)": "y",
|
||||
"QQ浏览器(Android)": "y"
|
||||
},
|
||||
"H5-pc": {
|
||||
"Chrome": "y",
|
||||
"IE": "y",
|
||||
"Edge": "y",
|
||||
"Firefox": "y",
|
||||
"Safari": "y"
|
||||
},
|
||||
"小程序": {
|
||||
"微信": "y",
|
||||
"阿里": "y",
|
||||
"百度": "y",
|
||||
"字节跳动": "y",
|
||||
"QQ": "y",
|
||||
"钉钉": "u",
|
||||
"快手": "u",
|
||||
"飞书": "u",
|
||||
"京东": "u"
|
||||
},
|
||||
"快应用": {
|
||||
"华为": "u",
|
||||
"联盟": "u"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,11 @@
|
||||
## CountTo 数字滚动
|
||||
|
||||
> **组件名:uv-count-to**
|
||||
|
||||
该组件一般用于需要滚动数字到某一个值的场景,目标要求是一个递增的值。
|
||||
|
||||
### <a href="https://www.uvui.cn/components/countTo.html" target="_blank">查看文档</a>
|
||||
|
||||
### [完整示例项目下载 | 关注更多组件](https://ext.dcloud.net.cn/plugin?name=uv-ui)
|
||||
|
||||
#### 如使用过程中有任何问题,或者您对uv-ui有一些好的建议,欢迎加入 uv-ui 交流群:<a href="https://ext.dcloud.net.cn/plugin?id=12287" target="_blank">uv-ui</a>、<a href="https://www.uvui.cn/components/addQQGroup.html" target="_blank">官方QQ群</a>
|
||||
+1
-1
@@ -2,7 +2,7 @@
|
||||
;(function(){
|
||||
let u=void 0,isReady=false,onReadyCallbacks=[],isServiceReady=false,onServiceReadyCallbacks=[];
|
||||
const __uniConfig = {"pages":[],"globalStyle":{"backgroundColor":"#F8F8F8","titleView":false,"bounce":"none","navigationBar":{"backgroundColor":"#F8F8F8","titleText":"AI智能培训","style":"custom","type":"default","titleColor":"#000000"},"isNVue":false},"nvue":{"compiler":"uni-app","styleCompiler":"uni-app","flex-direction":"column"},"renderer":"auto","appname":"tra-app","splashscreen":{"alwaysShowBeforeRender":true,"autoclose":true},"compilerVersion":"4.66","entryPagePath":"pages/index/index","entryPageQuery":"","realEntryPagePath":"","networkTimeout":{"request":60000,"connectSocket":60000,"uploadFile":60000,"downloadFile":60000},"tabBar":{"position":"bottom","color":"#666666","selectedColor":"#0066FF","borderStyle":"white","blurEffect":"none","fontSize":"16px","iconWidth":"24px","spacing":"10px","height":"70px","list":[{"text":"首页","pagePath":"pages/index/index"},{"text":"学习","pagePath":"pages/study/index"},{"text":"场景","pagePath":"pages/scene/index"},{"text":"我的","pagePath":"pages/me/index"}],"borderColor":"#ffffff","midButton":{"iconPath":"/static/images/icon/fawn.png","width":"86px","height":"86px","iconWidth":"90px"},"selectedIndex":0,"shown":true},"locales":{},"darkmode":false,"themeConfig":{}};
|
||||
const __uniRoutes = [{"path":"pages/index/index","meta":{"isQuit":true,"isEntry":true,"isTabBar":true,"tabBarIndex":0,"titleNView":false,"navigationBar":{"titleText":"首页","type":"default","style":"custom"},"isNVue":false}},{"path":"pages/study/index","meta":{"isQuit":true,"isTabBar":true,"tabBarIndex":1,"titleNView":false,"navigationBar":{"titleText":"学习","type":"default","style":"custom"},"isNVue":false}},{"path":"pages/intelligent_answering/index","meta":{"titleNView":false,"navigationBar":{"titleText":"智能问答","type":"default","style":"custom"},"isNVue":false}},{"path":"pages/scene/index","meta":{"isQuit":true,"isTabBar":true,"tabBarIndex":2,"titleNView":false,"navigationBar":{"titleText":"场景","type":"default","style":"custom"},"isNVue":false}},{"path":"pages/me/index","meta":{"isQuit":true,"isTabBar":true,"tabBarIndex":3,"titleNView":false,"navigationBar":{"titleText":"我的","type":"default","style":"custom"},"isNVue":false}},{"path":"pages/login/login","meta":{"titleNView":false,"navigationBar":{"titleText":"登录","type":"default","style":"custom"},"isNVue":false}},{"path":"pages/other/web_view","meta":{"titleNView":false,"navigationBar":{"titleText":"","type":"default","style":"custom"},"isNVue":false}}].map(uniRoute=>(uniRoute.meta.route=uniRoute.path,__uniConfig.pages.push(uniRoute.path),uniRoute.path='/'+uniRoute.path,uniRoute));
|
||||
const __uniRoutes = [{"path":"pages/index/index","meta":{"isQuit":true,"isEntry":true,"isTabBar":true,"tabBarIndex":0,"titleNView":false,"navigationBar":{"titleText":"首页","type":"default","style":"custom"},"isNVue":false}},{"path":"pages/study/index","meta":{"isQuit":true,"isTabBar":true,"tabBarIndex":1,"titleNView":false,"navigationBar":{"titleText":"学习","type":"default","style":"custom"},"isNVue":false}},{"path":"pages/intelligent_answering/index","meta":{"titleNView":false,"navigationBar":{"titleText":"智能问答","type":"default","style":"custom"},"isNVue":false}},{"path":"pages/scene/index","meta":{"isQuit":true,"isTabBar":true,"tabBarIndex":2,"titleNView":false,"navigationBar":{"titleText":"场景","type":"default","style":"custom"},"isNVue":false}},{"path":"pages/me/index","meta":{"isQuit":true,"isTabBar":true,"tabBarIndex":3,"titleNView":false,"navigationBar":{"titleText":"我的","type":"default","style":"custom"},"isNVue":false}},{"path":"pages/login/login","meta":{"titleNView":false,"navigationBar":{"titleText":"登录","type":"default","style":"custom"},"isNVue":false}},{"path":"pages/other/web_view","meta":{"titleNView":false,"navigationBar":{"titleText":"","type":"default","style":"custom"},"isNVue":false}},{"path":"pages/login/ysxy","meta":{"titleNView":false,"navigationBar":{"titleText":"","type":"default","style":"custom"},"isNVue":false}}].map(uniRoute=>(uniRoute.meta.route=uniRoute.path,__uniConfig.pages.push(uniRoute.path),uniRoute.path='/'+uniRoute.path,uniRoute));
|
||||
__uniConfig.styles=[];//styles
|
||||
__uniConfig.onReady=function(callback){if(__uniConfig.ready){callback()}else{onReadyCallbacks.push(callback)}};Object.defineProperty(__uniConfig,"ready",{get:function(){return isReady},set:function(val){isReady=val;if(!isReady){return}const callbacks=onReadyCallbacks.slice(0);onReadyCallbacks.length=0;callbacks.forEach(function(callback){callback()})}});
|
||||
__uniConfig.onServiceReady=function(callback){if(__uniConfig.serviceReady){callback()}else{onServiceReadyCallbacks.push(callback)}};Object.defineProperty(__uniConfig,"serviceReady",{get:function(){return isServiceReady},set:function(val){isServiceReady=val;if(!isServiceReady){return}const callbacks=onServiceReadyCallbacks.slice(0);onServiceReadyCallbacks.length=0;callbacks.forEach(function(callback){callback()})}});
|
||||
|
||||
+500
-171
File diff suppressed because it is too large
Load Diff
+51
-5
@@ -460,6 +460,44 @@ uni-view[data-v-ecf69ee0], uni-scroll-view[data-v-ecf69ee0], uni-swiper-item[dat
|
||||
/* 垂直间距 */
|
||||
/* 透明度 */
|
||||
/* 文章场景相关 */
|
||||
uni-view[data-v-8f2e1838], uni-scroll-view[data-v-8f2e1838], uni-swiper-item[data-v-8f2e1838] {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-shrink: 0;
|
||||
flex-grow: 0;
|
||||
flex-basis: auto;
|
||||
align-items: stretch;
|
||||
align-content: flex-start;
|
||||
}
|
||||
.uv-count-num[data-v-8f2e1838] {
|
||||
display: inline-flex;
|
||||
text-align: center;
|
||||
}
|
||||
/**
|
||||
* 这里是uni-app内置的常用样式变量
|
||||
*
|
||||
* uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量
|
||||
* 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App
|
||||
*
|
||||
*/
|
||||
/**
|
||||
* 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能
|
||||
*
|
||||
* 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
|
||||
*/
|
||||
/* 颜色变量 */
|
||||
/* 行为相关颜色 */
|
||||
/* 文字基本颜色 */
|
||||
/* 背景颜色 */
|
||||
/* 边框颜色 */
|
||||
/* 尺寸变量 */
|
||||
/* 文字尺寸 */
|
||||
/* 图片尺寸 */
|
||||
/* Border Radius */
|
||||
/* 水平间距 */
|
||||
/* 垂直间距 */
|
||||
/* 透明度 */
|
||||
/* 文章场景相关 */
|
||||
uni-view[data-v-0b5f3d7f], uni-scroll-view[data-v-0b5f3d7f], uni-swiper-item[data-v-0b5f3d7f] {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@@ -800,12 +838,14 @@ uni-view[data-v-222d1a38], uni-scroll-view[data-v-222d1a38], uni-swiper-item[dat
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.bg_div .notice_div[data-v-1cf27b2a] .u-notice-bar {
|
||||
padding: 0.4375rem 0;
|
||||
font-size: 0.6875rem;
|
||||
.bg_div .notice_div[data-v-1cf27b2a] .uv-notice-bar {
|
||||
padding: 9px 2px;
|
||||
}
|
||||
.bg_div .notice_div[data-v-1cf27b2a] .u-notice__left-icon {
|
||||
margin-right: 0.15625rem;
|
||||
.bg_div .notice_div[data-v-1cf27b2a] .uv-notice__swiper__item__text {
|
||||
font-size: 0.625rem !important;
|
||||
}
|
||||
.bg_div .notice_div[data-v-1cf27b2a] .uv-notice__left-icon .uv-icon__icon {
|
||||
font-size: 0.75rem !important;
|
||||
}
|
||||
.bg_div .study_duration_and_profile_div[data-v-1cf27b2a] {
|
||||
margin: 0 1.5625rem;
|
||||
@@ -830,6 +870,7 @@ uni-view[data-v-222d1a38], uni-scroll-view[data-v-222d1a38], uni-swiper-item[dat
|
||||
z-index: 20;
|
||||
}
|
||||
.bg_div .study_duration_and_profile_div .study_duration_div .item[data-v-1cf27b2a] {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
@@ -853,6 +894,11 @@ uni-view[data-v-222d1a38], uni-scroll-view[data-v-222d1a38], uni-swiper-item[dat
|
||||
font-style: normal;
|
||||
text-align: center;
|
||||
}
|
||||
.bg_div .study_duration_and_profile_div .study_duration_div .item .bottom[data-v-1cf27b2a] .uv-count-num {
|
||||
font-weight: bold !important;
|
||||
font-size: 1.5625rem !important;
|
||||
color: #000000 !important;
|
||||
}
|
||||
.bg_div .navigation_div[data-v-1cf27b2a] {
|
||||
margin: 0.5rem 1.5625rem 0 1.5625rem;
|
||||
height: 10.5625rem;
|
||||
|
||||
@@ -1,38 +0,0 @@
|
||||
|
||||
.bg {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.titletopbg {
|
||||
width: 100%;
|
||||
background: #F8F8F8;
|
||||
height: 1.5625rem;
|
||||
}
|
||||
.titlebg {
|
||||
width: 100%;
|
||||
height: 3.125rem;
|
||||
background: #F8F8F8;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
.arrowleft {
|
||||
width: 1.40625rem;
|
||||
height: 1.40625rem;
|
||||
position: absolute;
|
||||
left: 0.625rem;
|
||||
}
|
||||
.txt {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
color: #000000;
|
||||
font-weight: 600;
|
||||
font-size: 1.1875rem;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.webbg {
|
||||
}
|
||||
Reference in New Issue
Block a user