From 659d09ec24dab6c451220c8f3bb3943b0fdb3ba1 Mon Sep 17 00:00:00 2001
From: quanyawei <401863037@qq.com>
Date: Mon, 08 Jan 2024 16:16:12 +0800
Subject: [PATCH] fix:地图导航
---
uni_modules/uview-ui/components/u-col/u-col.vue | 162 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 162 insertions(+), 0 deletions(-)
diff --git a/uni_modules/uview-ui/components/u-col/u-col.vue b/uni_modules/uview-ui/components/u-col/u-col.vue
new file mode 100644
index 0000000..8be1517
--- /dev/null
+++ b/uni_modules/uview-ui/components/u-col/u-col.vue
@@ -0,0 +1,162 @@
+<template>
+ <view
+ class="u-col"
+ ref="u-col"
+ :class="[
+ 'u-col-' + span
+ ]"
+ :style="[colStyle]"
+ @tap="clickHandler"
+ >
+ <slot></slot>
+ </view>
+</template>
+
+<script>
+ import props from './props.js';
+ /**
+ * CodeInput ������������������
+ * @description ���������������������Layout ������ ��������������� 12 ������������������������������������
+ * @tutorial https://www.uviewui.com/components/Layout.html
+ * @property {String | Number} span ���������������������������12������ (������ 12 )
+ * @property {String | Number} offset ������������������������������������span������ (������ 0 )
+ * @property {String} justify ���������������������������������`start`(���`flex-start`)���`end`(���`flex-end`)���`center`���`around`(���`space-around`)���`between`(���`space-between`) (������ 'start' )
+ * @property {String} align ���������������������������������top���center���bottom���stretch (������ 'stretch' )
+ * @property {String} textAlign ������������������������ (������ 'left' )
+ * @property {Object} customStyle ���������������������������������
+ * @event {Function} click col������������������������������������row
+ * @example <u-col span="3" offset="3" > <view class="demo-layout bg-purple"></view> </u-col>
+ */
+ export default {
+ name: 'u-col',
+ mixins: [uni.$u.mpMixin, uni.$u.mixin, props],
+ data() {
+ return {
+ width: 0,
+ parentData: {
+ gutter: 0
+ },
+ gridNum: 12
+ }
+ },
+ computed: {
+ uJustify() {
+ if (this.justify == 'end' || this.justify == 'start') return 'flex-' + this.justify
+ else if (this.justify == 'around' || this.justify == 'between') return 'space-' + this.justify
+ else return this.justify
+ },
+ uAlignItem() {
+ if (this.align == 'top') return 'flex-start'
+ if (this.align == 'bottom') return 'flex-end'
+ else return this.align
+ },
+ colStyle() {
+ const style = {
+ // ������������"padding: 0 10px"������������������nvue���������
+ paddingLeft: uni.$u.addUnit(uni.$u.getPx(this.parentData.gutter)/2),
+ paddingRight: uni.$u.addUnit(uni.$u.getPx(this.parentData.gutter)/2),
+ alignItems: this.uAlignItem,
+ justifyContent: this.uJustify,
+ textAlign: this.textAlign,
+ // #ifndef APP-NVUE
+ // ������nvue���������������������������
+ flex: `0 0 ${100 / this.gridNum * this.span}%`,
+ marginLeft: 100 / 12 * this.offset + '%',
+ // #endif
+ // #ifdef APP-NVUE
+ // ���nvue������������������������������������������������������������������������������������������������������������������������������
+ width: uni.$u.addUnit(Math.floor(this.width / this.gridNum * Number(this.span))),
+ marginLeft: uni.$u.addUnit(Math.floor(this.width / this.gridNum * Number(this.offset))),
+ // #endif
+ }
+ return uni.$u.deepMerge(style, uni.$u.addStyle(this.customStyle))
+ }
+ },
+ mounted() {
+ this.init()
+ },
+ methods: {
+ async init() {
+ // ���������������������������provide/inject������������������������������������������������������created���������������������������
+ this.updateParentData()
+ this.width = await this.parent.getComponentWidth()
+ },
+ updateParentData() {
+ this.getParentData('u-row')
+ },
+ clickHandler(e) {
+ this.$emit('click');
+ }
+ },
+ }
+</script>
+
+<style lang="scss" scoped>
+ @import "../../libs/css/components.scss";
+
+ .u-col {
+ padding: 0;
+ /* #ifndef APP-NVUE */
+ box-sizing:border-box;
+ /* #endif */
+ /* #ifdef MP */
+ display: block;
+ /* #endif */
+ }
+
+ // nvue������������������
+ /* #ifndef APP-NVUE */
+ .u-col-0 {
+ width: 0;
+ }
+
+ .u-col-1 {
+ width: calc(100%/12);
+ }
+
+ .u-col-2 {
+ width: calc(100%/12 * 2);
+ }
+
+ .u-col-3 {
+ width: calc(100%/12 * 3);
+ }
+
+ .u-col-4 {
+ width: calc(100%/12 * 4);
+ }
+
+ .u-col-5 {
+ width: calc(100%/12 * 5);
+ }
+
+ .u-col-6 {
+ width: calc(100%/12 * 6);
+ }
+
+ .u-col-7 {
+ width: calc(100%/12 * 7);
+ }
+
+ .u-col-8 {
+ width: calc(100%/12 * 8);
+ }
+
+ .u-col-9 {
+ width: calc(100%/12 * 9);
+ }
+
+ .u-col-10 {
+ width: calc(100%/12 * 10);
+ }
+
+ .u-col-11 {
+ width: calc(100%/12 * 11);
+ }
+
+ .u-col-12 {
+ width: calc(100%/12 * 12);
+ }
+
+ /* #endif */
+</style>
--
Gitblit v1.8.0