feat: 初始化项目配置和样式- 添加项目环境变量配置文件 (.env)
- 创建代码忽略文件列表 (.gitignore) - 设置代码格式化规则 (.prettierrc)- 添加各种样式文件,包括背景、边框、按钮、卡片等组件样式 - 创建暗黑主题样式文件 - 添加表单和代码样式文件
This commit is contained in:
@@ -0,0 +1,62 @@
|
||||
<template>
|
||||
<view class="wrap" :style="{height: `${height}px`}">
|
||||
<view class="divider" :style="[elStyle]"></view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
/**
|
||||
* 分割线
|
||||
*/
|
||||
|
||||
import { computed } from 'vue';
|
||||
|
||||
// 接收参数
|
||||
const props = defineProps({
|
||||
// 线条颜色
|
||||
lineColor: {
|
||||
type: String,
|
||||
default: '#000',
|
||||
},
|
||||
// 线条样式:'dotted', 'solid', 'double', 'dashed'
|
||||
borderType: {
|
||||
type: String,
|
||||
default: 'dashed',
|
||||
},
|
||||
// 线条宽度
|
||||
lineWidth: {
|
||||
type: Number,
|
||||
default: 1,
|
||||
},
|
||||
// 高度
|
||||
height: {
|
||||
type: [Number, String],
|
||||
default: 'auto'
|
||||
},
|
||||
// 左右边距:none - 无边距,horizontal - 左右留边
|
||||
paddingType: {
|
||||
type: String,
|
||||
default: 'none'
|
||||
}
|
||||
});
|
||||
|
||||
const elStyle = computed(() => {
|
||||
return {
|
||||
'border-top-width': `${props.lineWidth}px`,
|
||||
'border-top-color': props.lineColor,
|
||||
'border-top-style': props.borderType,
|
||||
margin: props.paddingType === 'none' ? '0' : '0px 16px'
|
||||
};
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.divider {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user