cxc/yshop-pro-uniapp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

v1.0

Browse Source
This commit is contained in:
hupeng
2023-10-11 11:27:47 +08:00
commit d0b337c596
659 changed files with 67106 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
uni_modules/uv-divider/changelog.md Normal file
View File

@ -0,0 +1,7 @@
## 1.0.2（2023-06-01）
1. 修复点击触发两次事件的BUG
## 1.0.1（2023-05-16）
1. 优化组件依赖，修改后无需全局引入，组件导入即可使用
2. 优化部分功能
## 1.0.0（2023-05-10）
uv-divider 分割线

45
uni_modules/uv-divider/components/uv-divider/props.js Normal file
View File

@ -0,0 +1,45 @@
export default {
props: {
// 是否虚线
dashed: {
type: Boolean,
default: false
},
// 是否细线
hairline: {
type: Boolean,
default: true
},
// 是否以点替代文字，优先于text字段起作用
dot: {
type: Boolean,
default: false
},
// 内容文本的位置，left-左边，center-中间，right-右边
textPosition: {
type: String,
default: 'center'
},
// 文本内容
text: {
type: [String, Number],
default: ''
},
// 文本大小
textSize: {
type: [String, Number],
default: 14
},
// 文本颜色
textColor: {
type: String,
default: '#909399'
},
// 线条颜色
lineColor: {
type: String,
default: '#dcdfe6'
},
...uni.$uv?.props?.divider
}
}

113
uni_modules/uv-divider/components/uv-divider/uv-divider.vue Normal file
View File

@ -0,0 +1,113 @@
<template>
<view
class="uv-divider"
:style="[$uv.addStyle(customStyle)]"
@tap="click"
>
<uv-line
:color="lineColor"
:customStyle="leftLineStyle"
:hairline="hairline"
:dashed="dashed"></uv-line>
<text
v-if="dot"
class="uv-divider__dot"
>●</text>
<text
v-else-if="text"
class="uv-divider__text"
:style="[textStyle]"
>{{text}}</text>
<uv-line
:color="lineColor"
:customStyle="rightLineStyle"
:hairline="hairline"
:dashed="dashed"
></uv-line>
</view>
</template>
<script>
import mpMixin from '@/uni_modules/uv-ui-tools/libs/mixin/mpMixin.js'
import mixin from '@/uni_modules/uv-ui-tools/libs/mixin/mixin.js'
import props from './props.js';
/**
* divider 分割线
* @description 区隔内容的分割线，一般用于页面底部"没有更多"的提示。
* @tutorial https://www.uvui.cn/components/divider.html
* @property {Boolean} dashed 是否虚线 （默认 false ）
* @property {Boolean} hairline 是否细线 （默认 true ）
* @property {Boolean} dot 是否以点替代文字，优先于text字段起作用 （默认 false ）
* @property {String} textPosition 内容文本的位置，left-左边，center-中间，right-右边 （默认 'center' ）
* @property {String | Number} text 文本内容
* @property {String | Number} textSize 文本大小 （默认 14）
* @property {String} textColor 文本颜色 （默认 '#909399' ）
* @property {String} lineColor 线条颜色 （默认 '#dcdfe6' ）
* @property {Object} customStyle 定义需要用到的外部样式
*
* @event {Function} click divider组件被点击时触发
* @example <uv-divider :color="color">锦瑟无端五十弦</uv-divider>
*/
export default {
name: 'uv-divider',
mixins: [mpMixin, mixin, props],
emits: ['click'],
computed: {
textStyle() {
const style = {}
style.fontSize = this.$uv.addUnit(this.textSize)
style.color = this.textColor
return style
},
// 左边线条的的样式
leftLineStyle() {
const style = {}
// 如果是在左边，设置左边的宽度为固定值
if (this.textPosition === 'left') {
style.width = '80rpx'
} else {
style.flex = 1
}
return style
},
// 右边线条的的样式
rightLineStyle() {
const style = {}
// 如果是在右边，设置右边的宽度为固定值
if (this.textPosition === 'right') {
style.width = '80rpx'
} else {
style.flex = 1
}
return style
}
},
methods: {
// divider组件被点击时触发
click() {
this.$emit('click');
}
}
}
</script>
<style lang="scss" scoped>
@import '@/uni_modules/uv-ui-tools/libs/css/components.scss';
$uv-divider-margin: 15px 0 !default;
$uv-divider-text-margin: 0 15px !default;
$uv-divider-dot-font-size: 12px !default;
$uv-divider-dot-margin: 0 12px !default;
$uv-divider-dot-color: #c0c4cc !default;
.uv-divider {
@include flex;
flex-direction: row;
align-items: center;
margin: $uv-divider-margin;
&__text {
margin: $uv-divider-text-margin;
}
&__dot {
font-size: $uv-divider-dot-font-size;
margin: $uv-divider-dot-margin;
color: $uv-divider-dot-color;
}
}
</style>

88
uni_modules/uv-divider/package.json Normal file
View File

@ -0,0 +1,88 @@
{
"id": "uv-divider",
"displayName": "uv-divider 分割线 全面兼容小程序、nvue、vue2、vue3等多端",
"version": "1.0.2",
"description": "区隔内容的分割线，一般用于页面底部没有更多的提示。",
"keywords": [
"divider",
"uvui",
"uv-ui",
"分割线",
"没有更多"
],
"repository": "",
"engines": {
"HBuilderX": "^3.1.0"
},
"dcloudext": {
"type": "component-vue",
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "插件不采集任何数据",
"permissions": "无"
},
"npmurl": ""
},
"uni_modules": {
"dependencies": [
"uv-ui-tools",
"uv-line"
],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"Vue": {
"vue2": "y",
"vue3": "y"
},
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y",
"钉钉": "u",
"快手": "u",
"飞书": "u",
"京东": "u"
},
"快应用": {
"华为": "u",
"联盟": "u"
}
}
}
}
}

11
uni_modules/uv-divider/readme.md Normal file
View File

@ -0,0 +1,11 @@
## Divider 分割线
> **组件名：uv-divider**
区隔内容的分割线，一般用于页面底部"没有更多"的提示。
### <a href="https://www.uvui.cn/components/divider.html" target="_blank">查看文档</a>
### [完整示例项目下载 | 关注更多组件](https://ext.dcloud.net.cn/plugin?name=uv-ui)
#### 如使用过程中有任何问题，或者您对uv-ui有一些好的建议，欢迎加入 uv-ui 交流群：<a href="https://ext.dcloud.net.cn/plugin?id=12287" target="_blank">uv-ui</a>、<a href="https://www.uvui.cn/components/addQQGroup.html" target="_blank">官方QQ群</a>