榆钱落尽槿花稀
448712ece5
本次提交主要包含以下内容： 1. 新增积分申请系统核心功能： - 添加登录页面及API接口 - 实现积分申请记录查看功能 - 集成微信小程序分享功能 - 添加请求管理工具类 2. 引入Tuniao UI组件库： - 添加时间线、折叠面板、表格等UI组件 - 集成头像组、单选框组等交互组件 - 配置全局样式和主题颜色 3. 基础架构搭建： - 配置项目manifest和pages.json路由 - 添加状态管理store - 实现自定义导航栏适配 - 添加工具函数(加解密、数字处理等) 4. 静态资源： - 添加项目logo和背景图片 - 配置uni.scss全局样式变量 本次提交为系统基础功能搭建，后续将进一步完善积分申请流程和审批功能。
99 lines
2.1 KiB
Vue
99 lines
2.1 KiB
Vue
<template>
|
||
<view class="tn-collapse-class tn-collapse">
|
||
<slot></slot>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
name: 'tn-collapse',
|
||
props: {
|
||
// 是否为手风琴
|
||
accordion: {
|
||
type: Boolean,
|
||
default: true
|
||
},
|
||
// 头部样式
|
||
headStyle: {
|
||
type: Object,
|
||
default() {
|
||
return {}
|
||
}
|
||
},
|
||
// 主题样式
|
||
bodyStyle: {
|
||
type: Object,
|
||
default() {
|
||
return {}
|
||
}
|
||
},
|
||
// 每一个item的样式
|
||
itemStyle: {
|
||
type: Object,
|
||
default() {
|
||
return {}
|
||
}
|
||
},
|
||
// 显示箭头
|
||
arrow: {
|
||
type: Boolean,
|
||
default: true
|
||
},
|
||
// 箭头颜色
|
||
arrowColor: {
|
||
type: String,
|
||
default: '#AAAAAA'
|
||
},
|
||
// 点击标题栏时的按压样式
|
||
hoverClass: {
|
||
type: String,
|
||
default: 'tn-hover'
|
||
}
|
||
},
|
||
computed: {
|
||
parentData() {
|
||
return [this.headStyle, this.bodyStyle, this.itemStyle, this.arrow, this.arrowColor, this.hoverClass]
|
||
}
|
||
},
|
||
data() {
|
||
return {
|
||
|
||
}
|
||
},
|
||
watch: {
|
||
parentData() {
|
||
// 如果父组件的参数发生变化重新初始化子组件的信息
|
||
if (this.childrens.length > 0) {
|
||
this.init()
|
||
}
|
||
}
|
||
},
|
||
created() {
|
||
this.childrens = []
|
||
},
|
||
methods: {
|
||
// 重新初始化内部所有子元素计算高度，异步获取数据时重新渲染
|
||
init() {
|
||
this.childrens.forEach((child, index) => {
|
||
child.init()
|
||
})
|
||
},
|
||
// collapseItem被点击时由collapseItem调用父组件
|
||
onChange() {
|
||
let activeItem = []
|
||
this.childrens.forEach((child, index) => {
|
||
if (child.isShow) {
|
||
activeItem.push(child.nameSync)
|
||
}
|
||
})
|
||
// 如果时手风琴模式，只有一个匹配结果，即activeItem长度为1
|
||
if (this.accordion) activeItem = activeItem.join(',')
|
||
this.$emit('change', activeItem)
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
</style>
|