From 1e71dd86f6d0c4fc7e5143600d4bc4b50992a2a7 Mon Sep 17 00:00:00 2001 From: quanyawei <401863037@qq.com> Date: Thu, 04 Jul 2024 14:51:28 +0800 Subject: [PATCH] fix: 高德密钥修改 --- uni_modules/uview-ui/components/u-collapse-item/u-collapse-item.vue | 225 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 225 insertions(+), 0 deletions(-) diff --git a/uni_modules/uview-ui/components/u-collapse-item/u-collapse-item.vue b/uni_modules/uview-ui/components/u-collapse-item/u-collapse-item.vue new file mode 100644 index 0000000..0e1b703 --- /dev/null +++ b/uni_modules/uview-ui/components/u-collapse-item/u-collapse-item.vue @@ -0,0 +1,225 @@ +<template> + <view class="u-collapse-item"> + <u-cell + :title="title" + :value="value" + :label="label" + :icon="icon" + :isLink="isLink" + :clickable="clickable" + :border="parentData.border && showBorder" + @click="clickHandler" + :arrowDirection="expanded ? 'up' : 'down'" + :disabled="disabled" + > + <!-- #ifndef MP-WEIXIN --> + <!-- ��������������������������������������������������� <slot name="title" slot="title" />��������� --> + <template slot="title"> + <slot name="title"></slot> + </template> + <template slot="icon"> + <slot name="icon"></slot> + </template> + <template slot="value"> + <slot name="value"></slot> + </template> + <template slot="right-icon"> + <slot name="right-icon"></slot> + </template> + <!-- #endif --> + </u-cell> + <view + class="u-collapse-item__content" + :animation="animationData" + ref="animation" + > + <view + class="u-collapse-item__content__text content-class" + :id="elId" + :ref="elId" + ><slot /></view> + </view> + <u-line v-if="parentData.border"></u-line> + </view> +</template> + +<script> + import props from './props.js'; + // #ifdef APP-NVUE + const animation = uni.requireNativePlugin('animation') + const dom = uni.requireNativePlugin('dom') + // #endif + /** + * collapseItem ������������Item + * @description ���������������������������������������������u-collapse��������� + * @tutorial https://www.uviewui.com/components/collapse.html + * @property {String} title ������ + * @property {String} value ������������������ + * @property {String} label ��������������������������� + * @property {Boolean} disbled ������������������������ ( ������ false ) + * @property {Boolean} isLink ��������������������������������������������� ( ������ true ) + * @property {Boolean} clickable ������������������������ ( ������ true ) + * @property {Boolean} border ��������������������� ( ������ true ) + * @property {String} align ��������������������� ( ������ 'left' ) + * @property {String | Number} name ��������������� + * @property {String} icon ��������������������������������������������������������������� + * @event {Function} change ������item������������������������������ + * @example <u-collapse-item :title="item.head" v-for="(item, index) in itemList" :key="index">{{item.body}}</u-collapse-item> + */ + export default { + name: "u-collapse-item", + mixins: [uni.$u.mpMixin, uni.$u.mixin, props], + data() { + return { + elId: uni.$u.guid(), + // uni.createAnimation��������������� + animationData: {}, + // ������������������ + expanded: false, + // ������expanded������������������border���������������������������cell��������������������������������������������������������������� + showBorder: false, + // ��������������������������������������������������������� + animating: false, + // ���������u-collapse��������� + parentData: { + accordion: false, + border: false + } + }; + }, + watch: { + expanded(n) { + clearTimeout(this.timer) + this.timer = null + // ������������expanded������������������������������������������cell��������������������������������� + this.timer = setTimeout(() => { + this.showBorder = n + }, n ? 10 : 290) + } + }, + mounted() { + this.init() + }, + methods: { + // ��������������������������������������������������������������������������� + init() { + // ��������������� + this.updateParentData() + if (!this.parent) { + return uni.$u.error('u-collapse-item���������������u-collapse������������') + } + const { + value, + accordion, + children = [] + } = this.parent + + if (accordion) { + if (uni.$u.test.array(value)) { + return uni.$u.error('���������������������u-collapse���������value���������������������') + } + this.expanded = this.name == value + } else { + if (!uni.$u.test.array(value) && value !== null) { + return uni.$u.error('������������������������u-collapse���������value���������������������') + } + this.expanded = (value || []).some(item => item == this.name) + } + // ������������������������������������ + this.$nextTick(function() { + this.setContentAnimate() + }) + }, + updateParentData() { + // ������������mixin��� + this.getParentData('u-collapse') + }, + async setContentAnimate() { + // ��������������������������������������������������������� + // ��������������������������������������������������������������������������������������������������� + const rect = await this.queryRect() + const height = this.expanded ? rect.height : 0 + this.animating = true + // #ifdef APP-NVUE + const ref = this.$refs['animation'].ref + animation.transition(ref, { + styles: { + height: height + 'px' + }, + duration: this.duration, + // ���������������true��������������������������������������������������������������������������������������������� + needLayout: true, + timingFunction: 'ease-in-out', + }, () => { + this.animating = false + }) + // #endif + + // #ifndef APP-NVUE + const animation = uni.createAnimation({ + timingFunction: 'ease-in-out', + }); + animation + .height(height) + .step({ + duration: this.duration, + }) + .step() + // ������������������������������animationData��� + this.animationData = animation.export() + // ������������������ + uni.$u.sleep(this.duration).then(() => { + this.animating = false + }) + // #endif + }, + // ������collapsehead������ + clickHandler() { + if (this.disabled && this.animating) return + // ��������������������������������� + this.parent && this.parent.onChange(this) + }, + // ������������������ + queryRect() { + // #ifndef APP-NVUE + // $uGetRect���uView���������������������������������������������������������https://www.uviewui.com/js/getRect.html + // ���������������������this.$uGetRect���������������uni.$u.getRect������������������������������������ + return new Promise(resolve => { + this.$uGetRect(`#${this.elId}`).then(size => { + resolve(size) + }) + }) + // #endif + + // #ifdef APP-NVUE + // nvue������������dom������������������������ + // ������������promise���������������������������������������then������ + return new Promise(resolve => { + dom.getComponentRect(this.$refs[this.elId], res => { + resolve(res.size) + }) + }) + // #endif + } + }, + }; +</script> + +<style lang="scss" scoped> + @import "../../libs/css/components.scss"; + + .u-collapse-item { + + &__content { + overflow: hidden; + height: 0; + + &__text { + padding: 12px 15px; + color: $u-content-color; + font-size: 14px; + line-height: 18px; + } + } + } +</style> -- Gitblit v1.8.0