From b9514c7668eea1158852c12e45be108c9dddc6bb Mon Sep 17 00:00:00 2001
From: whycq <10027870+whycq@user.noreply.gitee.com>
Date: 星期四, 14 三月 2024 13:46:47 +0800
Subject: [PATCH] #
---
uni_modules/uni-collapse/components/uni-collapse/uni-collapse.vue | 147 +++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 147 insertions(+), 0 deletions(-)
diff --git a/uni_modules/uni-collapse/components/uni-collapse/uni-collapse.vue b/uni_modules/uni-collapse/components/uni-collapse/uni-collapse.vue
new file mode 100644
index 0000000..384c39a
--- /dev/null
+++ b/uni_modules/uni-collapse/components/uni-collapse/uni-collapse.vue
@@ -0,0 +1,147 @@
+<template>
+ <view class="uni-collapse">
+ <slot />
+ </view>
+</template>
+<script>
+ /**
+ * Collapse 鎶樺彔闈㈡澘
+ * @description 灞曠ず鍙互鎶樺彔 / 灞曞紑鐨勫唴瀹瑰尯鍩�
+ * @tutorial https://ext.dcloud.net.cn/plugin?id=23
+ * @property {String|Array} value 褰撳墠婵�娲婚潰鏉挎敼鍙樻椂瑙﹀彂(濡傛灉鏄墜椋庣惔妯″紡锛屽弬鏁扮被鍨嬩负string锛屽惁鍒欎负array)
+ * @property {Boolean} accordion = [true|false] 鏄惁寮�鍚墜椋庣惔鏁堟灉鏄惁寮�鍚墜椋庣惔鏁堟灉
+ * @event {Function} change 鍒囨崲闈㈡澘鏃惰Е鍙戯紝濡傛灉鏄墜椋庣惔妯″紡锛岃繑鍥炵被鍨嬩负string锛屽惁鍒欎负array
+ */
+ export default {
+ name: 'uniCollapse',
+ emits:['change','activeItem','input','update:modelValue'],
+ props: {
+ value: {
+ type: [String, Array],
+ default: ''
+ },
+ modelValue: {
+ type: [String, Array],
+ default: ''
+ },
+ accordion: {
+ // 鏄惁寮�鍚墜椋庣惔鏁堟灉
+ type: [Boolean, String],
+ default: false
+ },
+ },
+ data() {
+ return {}
+ },
+ computed: {
+ // TODO 鍏煎 vue2 鍜� vue3
+ dataValue() {
+ let value = (typeof this.value === 'string' && this.value === '') ||
+ (Array.isArray(this.value) && this.value.length === 0)
+ let modelValue = (typeof this.modelValue === 'string' && this.modelValue === '') ||
+ (Array.isArray(this.modelValue) && this.modelValue.length === 0)
+ if (value) {
+ return this.modelValue
+ }
+ if (modelValue) {
+ return this.value
+ }
+
+ return this.value
+ }
+ },
+ watch: {
+ dataValue(val) {
+ this.setOpen(val)
+ }
+ },
+ created() {
+ this.childrens = []
+ this.names = []
+ },
+ mounted() {
+ this.$nextTick(()=>{
+ this.setOpen(this.dataValue)
+ })
+ },
+ methods: {
+ setOpen(val) {
+ let str = typeof val === 'string'
+ let arr = Array.isArray(val)
+ this.childrens.forEach((vm, index) => {
+ if (str) {
+ if (val === vm.nameSync) {
+ if (!this.accordion) {
+ console.warn('accordion 灞炴�т负 false ,v-model 绫诲瀷搴旇涓� array')
+ return
+ }
+ vm.isOpen = true
+ }
+ }
+ if (arr) {
+ val.forEach(v => {
+ if (v === vm.nameSync) {
+ if (this.accordion) {
+ console.warn('accordion 灞炴�т负 true ,v-model 绫诲瀷搴旇涓� string')
+ return
+ }
+ vm.isOpen = true
+ }
+ })
+ }
+ })
+ this.emit(val)
+ },
+ setAccordion(self) {
+ if (!this.accordion) return
+ this.childrens.forEach((vm, index) => {
+ if (self !== vm) {
+ vm.isOpen = false
+ }
+ })
+ },
+ resize() {
+ this.childrens.forEach((vm, index) => {
+ // #ifndef APP-NVUE
+ vm.getCollapseHeight()
+ // #endif
+ // #ifdef APP-NVUE
+ vm.getNvueHwight()
+ // #endif
+ })
+ },
+ onChange(isOpen, self) {
+ let activeItem = []
+
+ if (this.accordion) {
+ activeItem = isOpen ? self.nameSync : ''
+ } else {
+ this.childrens.forEach((vm, index) => {
+ if (vm.isOpen) {
+ activeItem.push(vm.nameSync)
+ }
+ })
+ }
+ this.$emit('change', activeItem)
+ this.emit(activeItem)
+ },
+ emit(val){
+ this.$emit('input', val)
+ this.$emit('update:modelValue', val)
+ }
+ }
+ }
+</script>
+<style lang="scss" >
+ .uni-collapse {
+ /* #ifndef APP-NVUE */
+ width: 100%;
+ display: flex;
+ /* #endif */
+ /* #ifdef APP-NVUE */
+ flex: 1;
+ /* #endif */
+ flex-direction: column;
+ background-color: #fff;
+ }
+</style>
--
Gitblit v1.9.1