优化组件/更新

This commit is contained in:
gyq
2025-12-03 10:13:55 +08:00
parent 92f9776a35
commit 09b6e36a52
261 changed files with 22080 additions and 7238 deletions

View File

@@ -1,39 +1,2 @@
## 2.0.132021-11-18
## 2.0.122021-11-18
123123
## 2.0.112021-11-18
0000
## 2.0.102021-11-18
111234
## 2.0.92021-11-18
3333
## 2.0.82021-11-18
===
## 2.0.72021-11-18
111
## 2.0.62021-05-26
- test
## 0.0.372021-03-23
- uni-forms 更新 校验器
- uni-forms 修复 表单规则设置类型为 number 的情况下值为0校验失败的Bug
## 0.0.362021-03-23
- uni-forms 更新 校验器
- uni-forms 修复 表单规则设置类型为 number 的情况下值为0校验失败的Bug
## 0.0.352021-03-23
- uni-forms 更新 校验器
- uni-forms 修复 表单规则设置类型为 number 的情况下值为0校验失败的Bug
## 0.0.342021-03-23
- 测试新同步插件
## 0.0.332021-03-09
- test
## 0.0.322021-02-24
- 更新 read 2
## 0.0.312021-02-24
- 同步 readme.md
## 2.0.42021-05-20
- test1

View File

@@ -0,0 +1,120 @@
.uni-flex {
display: flex;
}
.uni-flex-row {
@extend .uni-flex;
flex-direction: row;
box-sizing: border-box;
}
.uni-flex-column {
@extend .uni-flex;
flex-direction: column;
}
.uni-color-gary {
color: #3b4144;
}
/* 标题 */
.uni-title {
display: flex;
margin-bottom: $uni-spacing-col-base;
font-size: $uni-font-size-lg;
font-weight: bold;
color: #3b4144;
}
.uni-title-sub {
display: flex;
// margin-bottom: $uni-spacing-col-base;
font-size: $uni-font-size-base;
font-weight: 500;
color: #3b4144;
}
/* 描述 额外文本 */
.uni-note {
margin-top: 10px;
color: #999;
font-size: $uni-font-size-sm;
}
/* 列表内容 */
.uni-list-box {
@extend .uni-flex-row;
flex: 1;
margin-top: 10px;
}
/* 略缩图 */
.uni-thumb {
flex-shrink: 0;
margin-right: $uni-spacing-row-base;
width: 125px;
height: 75px;
border-radius: $uni-border-radius-lg;
overflow: hidden;
border: 1px #f5f5f5 solid;
image {
width: 100%;
height: 100%;
}
}
.uni-media-box {
@extend .uni-flex-row;
// margin-bottom: $uni-spacing-col-base;
border-radius: $uni-border-radius-lg;
overflow: hidden;
.uni-thumb {
margin: 0;
margin-left: 4px;
flex-shrink: 1;
width: 33%;
border-radius:0;
&:first-child {
margin: 0;
}
}
}
/* 内容 */
.uni-content {
@extend .uni-flex-column;
justify-content: space-between;
}
/* 列表footer */
.uni-footer {
@extend .uni-flex-row;
justify-content: space-between;
margin-top: $uni-spacing-col-lg;
}
.uni-footer-text {
font-size: $uni-font-size-sm;
color: $uni-text-color-grey;
margin-left: 5px;
}
/* 标签 */
.uni-tag {
flex-shrink: 0;
padding: 0 5px;
border: 1px $uni-border-color solid;
margin-right: $uni-spacing-row-sm;
border-radius: $uni-border-radius-base;
background: $uni-bg-color-grey;
color: $uni-text-color;
font-size: $uni-font-size-sm;
}
/* 链接 */
.uni-link {
margin-left: 10px;
color: $uni-text-color;
text-decoration: underline;
}

View File

@@ -0,0 +1,12 @@
{
"id": "99999",
"name": "Section",
"desc": "标题栏",
"edition": "0.0.1",
"url": "section",
"type": "布局组件",
"path": "https://ext.dcloud.net.cn/plugin?id=",
"hidden": true,
"test":true,
"update_log": []
}

View File

@@ -0,0 +1,30 @@
### Section 标题栏
标题栏,用于显示标题,组件名:``uni-section``,代码块: uSection。
### 使用方式
在 ``script`` 中引用组件
```javascript
import uniSection from "@/components/uni-section/uni-section.vue"
export default {
components: {uniSection}
}
```
在 ``template`` 中使用组件
```html
<uni-section title="只有主标题"></uni-section>
<uni-section title="竖线装饰" sub-title="副标题" type="line"></uni-section>
<uni-section title="圆形装饰" sub-title="副标题" type="circle"></uni-section>
```
### 属性说明
|属性名 |类型 |默认值 |说明 |
|--- |---- |--- |--- |
|type |String |- |标题装饰类型 可选值line竖线、circle圆形|
|title |String |- |主标题 |
|sub-title |String |- |副标题 |

View File

@@ -0,0 +1,136 @@
<template>
<view class="uni-section" nvue>
<view v-if="type" class="uni-section__head">
<view :class="type" class="uni-section__head-tag" />
</view>
<view class="uni-section__content">
<text :class="{'distraction':!subTitle}" class="uni-section__content-title">{{ title }}</text>
<text v-if="subTitle" class="uni-section__content-sub">{{ subTitle }}</text>
</view>
<slot />
</view>
</template>
<script>
/**
* Section 标题栏
* @description 标题栏
* @property {String} type = [line|circle] 标题装饰类型
* @value line 竖线
* @value circle 圆形
* @property {String} title 主标题
* @property {String} subTitle 副标题
*/
export default {
name: 'UniSection',
props: {
type: {
type: String,
default: ''
},
title: {
type: String,
default: ''
},
subTitle: {
type: String,
default: ''
}
},
data() {
return {}
},
watch: {
title(newVal) {
if (uni.report && newVal !== '') {
uni.report('title', newVal)
}
}
},
methods: {
onClick() {
this.$emit('click')
}
}
}
</script>
<style lang="scss" scoped>
.uni-section {
position: relative;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
margin-top: 10px;
flex-direction: row;
align-items: center;
padding: 0 10px;
height: 50px;
background-color: $uni-bg-color-grey;
/* #ifdef APP-NVUE */
// border-bottom-color: $uni-border-color;
// border-bottom-style: solid;
// border-bottom-width: 0.5px;
/* #endif */
font-weight: normal;
}
/* #ifndef APP-NVUE */
// .uni-section:after {
// position: absolute;
// bottom: 0;
// right: 0;
// left: 0;
// height: 1px;
// content: '';
// -webkit-transform: scaleY(.5);
// transform: scaleY(.5);
// background-color: $uni-border-color;
// }
/* #endif */
.uni-section__head {
flex-direction: row;
justify-content: center;
align-items: center;
margin-right: 10px;
}
.line {
height: 15px;
background-color: $uni-text-color-disable;
border-radius: 5px;
width: 3px;
}
.circle {
width: 8px;
height: 8px;
border-top-right-radius: 50px;
border-top-left-radius: 50px;
border-bottom-left-radius: 50px;
border-bottom-right-radius: 50px;
background-color: $uni-text-color-disable;
}
.uni-section__content {
flex-direction: column;
flex: 1;
color: $uni-text-color;
}
.uni-section__content-title {
font-size: $uni-font-size-base;
color: $uni-text-color;
}
.distraction {
flex-direction: row;
align-items: center;
}
.uni-section__content-sub {
font-size: $uni-font-size-sm;
color: $uni-text-color-grey;
}
</style>

View File

@@ -1,22 +1,19 @@
{
"id": "uni-test",
"displayName": "Test 测试插件",
"version": "2.0.13",
"description": "测试插件 ",
"displayName": "uni-test",
"version": "2.0.4",
"description": "uni-test",
"keywords": [
"test"
"list-goods"
],
"repository": "https://github.com/dcloudio/uni-ui",
"repository": "",
"engines": {
"HBuilderX": "^3.1.3"
},
"directories": {
"example": "../../temps/example_temps"
"HBuilderX": "^3.1.0"
},
"dcloudext": {
"category": [
"前端组件",
"通用组件"
"uniCloud",
"云端一体页面模板"
],
"sale": {
"regular": {
@@ -34,10 +31,10 @@
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
"npmurl": ""
},
"uni_modules": {
"dependencies": ["uni-scss"],
"dependencies": ["uni-badge","uni-icons","uni-id","uni-list","uni-load-more"],
"encrypt": [],
"platforms": {
"cloud": {
@@ -46,38 +43,34 @@
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y"
"app-vue": "u",
"app-nvue": "u"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
"Safari": "u",
"Android Browser": "u",
"微信浏览器(Android)": "u",
"QQ浏览器(Android)": "u"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
"Chrome": "u",
"IE": "u",
"Edge": "u",
"Firefox": "u",
"Safari": "u"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y"
"微信": "u",
"阿里": "u",
"百度": "u",
"字节跳动": "u",
"QQ": "u"
},
"快应用": {
"华为": "y",
"联盟": "y"
},
"Vue": {
"vue2": "y",
"vue3": "y"
"华为": "u",
"联盟": "u"
}
}
}
}
}
}

View File

@@ -0,0 +1,242 @@
<template>
<!--
本页面模板教程https://ext.dcloud.net.cn/plugin?id=2651
uni-list 文档https://ext.dcloud.net.cn/plugin?id=24
uniCloud 文档https://uniapp.dcloud.io/uniCloud/README
unicloud-db 组件文档https://uniapp.dcloud.io/uniCloud/unicloud-db
DB Schema 规范https://uniapp.dcloud.net.cn/uniCloud/schema
-->
<view class="list">
<!-- 刷新页面后的顶部提示框 -->
<!-- 当前弹出内容没有实际逻辑 可根据当前业务修改弹出提示 -->
<view class="tips" :class="{ 'tips-ani': tipShow }">为您更新了10条最新新闻动态</view>
<!-- 页面分类标题 -->
<uni-section title="最热商品" type="line"><button class="button-box" @click="select">切换视图</button></uni-section>
<unicloud-db ref="udb" v-slot:default="{data, loading, error, options}" :options="formData" :collection="collection" :field="field" @load="load">
<!-- 基于 uni-list 的页面布局 -->
<uni-list :class="{ 'uni-list--waterfall': options.waterfall }">
<!-- 通过 uni-list--waterfall 类决定页面布局方向 -->
<!-- to 属性携带参数跳转详情页面当前只为参考 -->
<uni-list-item :border="!options.waterfall" class="uni-list-item--waterfall" title="自定义商品列表" v-for="item in data"
:key="item._id" :to="'/pages/detail/detail?id='+item._id+'&title='+item.name">
<!-- 通过header插槽定义列表左侧图片 -->
<template v-slot:header>
<view class="uni-thumb shop-picture" :class="{ 'shop-picture-column': options.waterfall }">
<image :src="item.goods_thumb" mode="aspectFill"></image>
</view>
</template>
<!-- 通过body插槽定义商品布局 -->
<view slot="body" class="shop">
<view>
<view class="uni-title">
<text class="uni-ellipsis-2">{{ item.name }}</text>
</view>
<view>
<text class="uni-tag hot-tag">{{ item.goods_tip }}</text>
<text v-for="tag in item.tag" :key="tag" class="uni-tag">{{ tag }}</text>
</view>
</view>
<view>
<view class="shop-price">
<text>¥</text>
<text class="shop-price-text">{{ item.goods_price }}</text>
<text>.00</text>
</view>
<view class="uni-note">{{ item.comment_count }}条评论 月销量 {{ item.month_sell_count }}</view>
<view class="uni-note ellipsis">
<text class="uni-ellipsis-1">{{ item.shop_name }}</text>
<text class="uni-link">进店 ></text>
</view>
</view>
</view>
</uni-list-item>
</uni-list>
<!-- 通过 loadMore 组件实现上拉加载效果如需自定义显示内容可参考https://ext.dcloud.net.cn/plugin?id=29 -->
<uni-load-more v-if="loading || options.status === 'noMore' " :status="options.status" />
</unicloud-db>
</view>
</template>
<script>
export default {
components: {},
data() {
return {
// 数据表名
collection: 'opendb-mall-goods',
// 查询字段,多个字段用 , 分割
field: 'goods_thumb,name,goods_tip,tag,goods_price,comment_count,month_sell_count,shop_name',
formData: {
waterfall: false, // 布局方向切换
status: 'loading', // 加载状态
},
tipShow: false // 是否显示顶部提示框
};
},
onLoad() {},
methods: {
/**
* 切换商品列表布局方向
*/
select() {
this.formData.waterfall = !this.formData.waterfall;
},
load(data,ended){
if(ended){
this.formData.status = 'noMore'
}
}
},
/**
* 下拉刷新回调函数
*/
onPullDownRefresh() {
this.tipShow = true
this.formData.status = 'more'
this.$refs.udb.loadData({clear:true},()=>{
this.tipShow = false
uni.stopPullDownRefresh()
})
},
/**
* 上拉加载回调函数
*/
onReachBottom() {
this.$refs.udb.loadMore()
},
};
</script>
<style lang="scss">
@import '../../common/uni-ui.scss';
page {
display: flex;
flex-direction: column;
box-sizing: border-box;
background-color: #efeff4;
min-height: 100%;
height: auto;
}
.tips {
color: #67c23a;
font-size: 14px;
line-height: 40px;
text-align: center;
background-color: #f0f9eb;
height: 0;
opacity: 0;
transform: translateY(-100%);
transition: all 0.3s;
}
.tips-ani {
transform: translateY(0);
height: 40px;
opacity: 1;
}
.shop {
flex: 1;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.shop-picture {
width: 110px;
height: 110px;
}
.shop-picture-column {
width: 100%;
height: 170px;
margin-bottom: 10px;
}
.shop-price {
margin-top: 5px;
font-size: 12px;
color: #ff5a5f;
}
.shop-price-text {
font-size: 16px;
}
.hot-tag {
background: #ff5a5f;
border: none;
color: #fff;
}
.button-box {
height: 30px;
line-height: 30px;
font-size: 12px;
background: #007AFF;
color: #fff;
}
.uni-link {
flex-shrink: 0;
}
.ellipsis {
display: flex;
overflow: hidden;
}
.uni-ellipsis-1 {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.uni-ellipsis-2 {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
// 默认加入 scoped ,所以外面加一层提升权重
.list {
.uni-list--waterfall {
/* #ifndef H5 || APP-VUE */
// 小程序 编译后会多一层标签,而其他平台没有,所以需要特殊处理一下
/deep/ .uni-list {
/* #endif */
display: flex;
flex-direction: row;
flex-wrap: wrap;
padding: 5px;
box-sizing: border-box;
/* #ifdef H5 || APP-VUE */
// h5 和 app-vue 使用深度选择器,因为默认使用了 scoped ,所以样式会无法穿透
/deep/
/* #endif */
.uni-list-item--waterfall {
width: 50%;
box-sizing: border-box;
.uni-list-item__container {
padding: 5px;
flex-direction: column;
}
}
/* #ifndef H5 || APP-VUE */
}
/* #endif */
}
}
</style>

View File

@@ -1,10 +1 @@
## DataCheckbox 数据驱动的单选复选框
> **组件名uni-data-checkbox**
> 代码块: `uDataCheckbox`
本组件是基于uni-app基础组件checkbox的封装。本组件要解决问题包括
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-card)
# list-goods

View File

@@ -0,0 +1,8 @@
'use strict';
exports.main = async (event, context) => {
//event为客户端上传的参数
console.log('event : ', event)
//返回数据给客户端
return event
};

File diff suppressed because it is too large Load Diff