init

uni_modules/nutui-uni/components/col/col.ts

@@ -0,0 +1,16 @@
+import type { ExtractPropTypes } from 'vue'
+import { commonProps, makeNumericProp } from '../_utils'
+
+export const colProps = {
+  ...commonProps,
+  /**
+   * @description 列元素宽度（共分为 24 份，例如设置一行3个，那么 `span` 值为 8）
+   */
+  span: makeNumericProp(24),
+  /**
+   * @description 列元素偏移距离
+   */
+  offset: makeNumericProp(0),
+}
+
+export type ColProps = ExtractPropTypes<typeof colProps>

uni_modules/nutui-uni/components/col/col.vue

@@ -0,0 +1,46 @@
+<script setup lang="ts">
+import { computed, defineComponent, inject } from 'vue'
+import { PREFIX } from '../_constants'
+import { getMainClass, getMainStyle } from '../_utils'
+import { colProps } from './col'
+
+const props = defineProps(colProps)
+
+const gutter = inject('gutter') as number
+const classes = computed(() => {
+  return getMainClass(props, componentName, {
+    [`${componentName}-gutter`]: gutter,
+    [`nut-col-${props.span}`]: true,
+    [`nut-col-offset-${props.offset}`]: true,
+  })
+})
+const style = computed(() => {
+  return getMainStyle(props, {
+    paddingLeft: `${gutter / 2}px`,
+    paddingRight: `${gutter / 2}px`,
+  })
+})
+</script>
+
+<script lang="ts">
+const componentName = `${PREFIX}-col`
+
+export default defineComponent({
+  name: componentName,
+  options: {
+    virtualHost: true,
+    addGlobalClass: true,
+    styleIsolation: 'shared',
+  },
+})
+</script>
+
+<template>
+  <view :class="classes" :style="style">
+    <slot />
+  </view>
+</template>
+
+<style lang="scss">
+@import './index';
+</style>

uni_modules/nutui-uni/components/col/index.scss

@@ -0,0 +1,25 @@
+.nut-col {
+  box-sizing: border-box;
+  float: left;
+  word-break: break-all;
+
+  &-gutter {
+    &:last-child {
+      padding-right: 0 !important;
+    }
+
+    &:first-child {
+      padding-left: 0 !important;
+    }
+  }
+}
+
+@for $i from 1 through 24 {
+  .nut-col-offset-#{$i} {
+    margin-left: calc((100 / 24) * #{$i} * 1%);
+  }
+
+  .nut-col-#{$i} {
+    width: calc((100 / 24) * #{$i} * 1%);
+  }
+}

uni_modules/nutui-uni/components/col/index.ts

@@ -0,0 +1 @@
+export * from './col'