From cc6e273316b78ed38a232e7a6d6472ee47226caf Mon Sep 17 00:00:00 2001 From: Fox-33 <1466778434@qq.com> Date: Wed, 27 Aug 2025 22:06:33 +0800 Subject: [PATCH] feat: page-live; --- components/home/pictureLiveView.vue | 38 +- components/product/productCard.vue | 2 +- pages.json | 9 + pages/index/index.vue | 2 +- pages_order/article/search.vue | 165 ++++++++ pages_order/comment/recordFormPopup.vue | 2 +- .../reloateProjectPopup.vue | 0 pages_order/growing/activity/index.vue | 9 +- pages_order/growing/activity/markList.vue | 120 ++++++ pages_order/growing/activity/markPopup.vue | 44 ++- pages_order/growing/activity/reviewPopup.vue | 262 +++++++++++++ pages_order/growing/activity/search.vue | 23 +- pages_order/live/formPopup.vue | 361 ++++++++++++++++++ pages_order/live/index.vue | 241 ++++++++++++ pages_order/live/list.vue | 235 ++++++++++++ pages_order/product/search.vue | 23 +- static/image/icon-location.png | Bin 0 -> 1436 bytes uni_modules/SY-StackedCarousel/changelog.md | 4 + .../SY-StackedCarousel/SY-StackedCarousel.vue | 421 +++++++++++++++++++++ .../components/SY-StackedCarousel/util.js | 22 ++ uni_modules/SY-StackedCarousel/package.json | 85 +++++ uni_modules/SY-StackedCarousel/readme.md | 117 ++++++ 22 files changed, 2133 insertions(+), 52 deletions(-) create mode 100644 pages_order/article/search.vue rename pages_order/{comment => components}/reloateProjectPopup.vue (100%) create mode 100644 pages_order/growing/activity/markList.vue create mode 100644 pages_order/growing/activity/reviewPopup.vue create mode 100644 pages_order/live/formPopup.vue create mode 100644 pages_order/live/index.vue create mode 100644 pages_order/live/list.vue create mode 100644 static/image/icon-location.png create mode 100644 uni_modules/SY-StackedCarousel/changelog.md create mode 100644 uni_modules/SY-StackedCarousel/components/SY-StackedCarousel/SY-StackedCarousel.vue create mode 100644 uni_modules/SY-StackedCarousel/components/SY-StackedCarousel/util.js create mode 100644 uni_modules/SY-StackedCarousel/package.json create mode 100644 uni_modules/SY-StackedCarousel/readme.md diff --git a/components/home/pictureLiveView.vue b/components/home/pictureLiveView.vue index 8e0a6d8..a981fdf 100644 --- a/components/home/pictureLiveView.vue +++ b/components/home/pictureLiveView.vue @@ -17,24 +17,26 @@ --> - - - - - - - {{ item.title }} - {{ item.time }} + + + + + + + + {{ item.title }} + {{ item.time }} + - - - + + + @@ -94,10 +96,10 @@ }, jumpToLive(id) { - // todo + this.$utils.navigateTo(`/pages_order/live/index?id=${id}`) }, showAll() { - // todo + this.$utils.navigateTo(`/pages_order/live/list`) } }, } diff --git a/components/product/productCard.vue b/components/product/productCard.vue index 2891a94..1ab48b5 100644 --- a/components/product/productCard.vue +++ b/components/product/productCard.vue @@ -72,7 +72,7 @@ const width = this.isCollected ? 80 : 56 const background = this.isCollected ? '#26334E' : '#FF9035' - let display = Math.ceil(this.displayX / this.collectBtnWidth * 100) + let display = Math.ceil(this.displayX / width * 100) display > 100 && (display = 100) diff --git a/pages.json b/pages.json index cd11f03..0aeacd2 100644 --- a/pages.json +++ b/pages.json @@ -103,6 +103,9 @@ { "path": "growing/activity/index" }, + { + "path": "growing/activity/markList" + }, { "path": "growing/activity/applyEmail" }, @@ -118,6 +121,12 @@ { "path": "member/switch" }, + { + "path": "live/list" + }, + { + "path": "live/index" + }, { "path": "partner/apply" }, diff --git a/pages/index/index.vue b/pages/index/index.vue index a7d5016..991a6a5 100644 --- a/pages/index/index.vue +++ b/pages/index/index.vue @@ -93,7 +93,7 @@ } }, onLoad() { - // this.$utils.navigateTo(`/pages_order/growing/activity/applyEmail`) + // this.$utils.navigateTo(`/pages_order/live/index`) // uni.navigateTo({ // url: `/pages_order/order/orderConfirm/index` // }) diff --git a/pages_order/article/search.vue b/pages_order/article/search.vue new file mode 100644 index 0000000..8a67306 --- /dev/null +++ b/pages_order/article/search.vue @@ -0,0 +1,165 @@ + + + + + \ No newline at end of file diff --git a/pages_order/comment/recordFormPopup.vue b/pages_order/comment/recordFormPopup.vue index bb68559..fad4167 100644 --- a/pages_order/comment/recordFormPopup.vue +++ b/pages_order/comment/recordFormPopup.vue @@ -89,7 +89,7 @@ diff --git a/pages_order/growing/activity/markList.vue b/pages_order/growing/activity/markList.vue new file mode 100644 index 0000000..bdb63fc --- /dev/null +++ b/pages_order/growing/activity/markList.vue @@ -0,0 +1,120 @@ + + + + + \ No newline at end of file diff --git a/pages_order/growing/activity/markPopup.vue b/pages_order/growing/activity/markPopup.vue index 776b822..31fc8d8 100644 --- a/pages_order/growing/activity/markPopup.vue +++ b/pages_order/growing/activity/markPopup.vue @@ -3,7 +3,7 @@ - 新增回顾 + 标记有我 @@ -17,7 +17,7 @@ - 上传图片 + 上传本人照片 + + + @@ -48,6 +49,7 @@ export default { data() { return { + id: null, form: { image: null, }, @@ -62,6 +64,13 @@ } }, methods: { + open(id) { + this.id = id + this.$refs.popup.open(); + }, + close() { + this.$refs.popup.close(); + }, onUpload() { uni.chooseImage({ count: 1, @@ -76,7 +85,7 @@ } }); }, - async onPublish() { + async onSubmit() { try { await this.$refs.form.validate() @@ -91,17 +100,23 @@ uni.showToast({ icon: 'success', - title: '发布成功', + title: '提交成功', }); this.$emit('submitted') this.close() + this.$utils.navigateTo(`/pages_order/growing/activity/markList`) + } catch (err) { console.log('onSave err', err) } }, + jumpToGrowing(id) { + // todo + this.$utils.navigateTo(`/pages/index/growing`) + }, }, } @@ -196,23 +211,32 @@ } .footer { + column-gap: 32rpx; width: 100%; padding: 32rpx 40rpx; box-sizing: border-box; border-top: 2rpx solid #F1F1F1; .btn { - width: 100%; + flex: 1; padding: 14rpx 0; box-sizing: border-box; font-family: PingFang SC; font-weight: 500; font-size: 36rpx; line-height: 1.4; - color: #FFFFFF; - background-image: linear-gradient(to right, #21FEEC, #019AF9); - border: 2rpx solid #00A9FF; border-radius: 41rpx; + + &-palin { + color: #252545; + border: 2rpx solid #252545; + } + + &-primary { + color: #FFFFFF; + background: linear-gradient(to right, #21FEEC, #019AF9); + border: 2rpx solid #00A9FF; + } } } diff --git a/pages_order/growing/activity/reviewPopup.vue b/pages_order/growing/activity/reviewPopup.vue new file mode 100644 index 0000000..776b822 --- /dev/null +++ b/pages_order/growing/activity/reviewPopup.vue @@ -0,0 +1,262 @@ + + + + + \ No newline at end of file diff --git a/pages_order/growing/activity/search.vue b/pages_order/growing/activity/search.vue index f7a3f91..37cf3d4 100644 --- a/pages_order/growing/activity/search.vue +++ b/pages_order/growing/activity/search.vue @@ -5,13 +5,13 @@ - + + + + + + 新增记录 + + + + + + + + + 关联项目 + + + + {{ projectDesc }} + 请选择关联项目 + + + + + + + + + 选择地址 + + + {{ form.area }} + 请选择地址 + + + + + + + + 上传图片 + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/pages_order/live/index.vue b/pages_order/live/index.vue new file mode 100644 index 0000000..efc18c9 --- /dev/null +++ b/pages_order/live/index.vue @@ -0,0 +1,241 @@ + + + + + \ No newline at end of file diff --git a/pages_order/live/list.vue b/pages_order/live/list.vue new file mode 100644 index 0000000..aca3336 --- /dev/null +++ b/pages_order/live/list.vue @@ -0,0 +1,235 @@ + + + + + \ No newline at end of file diff --git a/pages_order/product/search.vue b/pages_order/product/search.vue index 9207f48..1db09c4 100644 --- a/pages_order/product/search.vue +++ b/pages_order/product/search.vue @@ -5,13 +5,13 @@ - + $wTB5#6CgQ6Er{Y&o1p|z_}RrS_74EJ__9#2ZM@V8?7{>zr1&Iul^okE_<+x$ z%3+Jx4g*B=x9}W^oS3H@D=6Sk{9eKnmBBy^XW(2D;WKO{aRVWP5zOHi^*anee+Eu< ziUcgMHFo}Cbs+*ZytAtia}V%);+ZK!iR|^2Mn49a_$zFsAPLc^8t-ve+w`1N?H>Gu zV}EOm?a4$u13uz49K&Pv0%CBgXO@vQdNC2tz?psv74bRFum``Y74*Tm9wYO#8SC@2 zf`4(o2un4B82qK{q8~y$fyUAtv=NLks@PG)3=tAw)p=X~?oykzFDUE*ADNw9w(jgJ zeT0VK&@T_bX z;J4l9`Xx%{1^9hJisNRcj}JFuPPx_wgsD(neR4QZ-#7Zu?iR+OF|^syH+Gdru*qsI zQ0=bG8qEA1?EkZR2OAJ3fst@l?4+Qvcp+4bB=lJA;d5l319iV9HHB(L=R{&(kwvTK zzBY$DfV2?kn$vmH`2X5?*ma)_ZTYOxhu%p&zw7bJg_v7~g(jg4B%+;r7M2paY@5a* zaO_zp_paH2I6uG(#|CYm6rl`cqWzs`mX&BffHv@9X86vM9P9hvgD?hm#AFJCF&AGM z-Ola86R*9md+`kZE6;<3RK*Me5blZ3^xv>HaU66lYya21DH92BVOJT~5*@Ng?m_3c z=yf@kELQ-+&wz%Lvh9-s+w~LiCdKE-JaytvyjBV@qpQ|hLLg!oxG38SJta9e7YAx; z?S1B%AvX@}3HEV8b7|p6bZsL#5f@IM>npLF7fA5Fw_j{9$05knv}yOr2?ipLfm1!P z$qd7H7GiO#r#NR7AN>zM!qe~&Jc;?q?7j?Ig?vU@zALKDtQe5-JT3ShcXH@$ z3dK2uwsR8$8Ayt<%pGrMQmk!U1#N?Hf?I+SsLp_l_lZ-gLX-HuG>C>>xT+;Zf>z~p zc1_-mRw@Ploow%V7#=F7p{+-iP6^X}QK&7s6S zD@rgs^SO#z>x;t6&O0~glTs=p?uVxI$K}DHOtA!+U{=it-!nWKB`JM_>TqKiN$uOT qrFT|-?;zp-;P;kq?r(96NPGl%)g5Sd*mgny0000 + + + + + + + + + + {{ item.desc }} + + + + + + + + + + + + \ No newline at end of file diff --git a/uni_modules/SY-StackedCarousel/components/SY-StackedCarousel/util.js b/uni_modules/SY-StackedCarousel/components/SY-StackedCarousel/util.js new file mode 100644 index 0000000..bd4fc76 --- /dev/null +++ b/uni_modules/SY-StackedCarousel/components/SY-StackedCarousel/util.js @@ -0,0 +1,22 @@ +/** + * 验证十进制数字 + */ +export function isNumber(value) { + return /^[\+-]?(\d+\.?\d*|\.\d+|\d\.\d+e\+\d+)$/.test(value) +} + +export function addUnit(value = 'auto', unit = '') { + if (!unit) { + unit = 'px' + } + if (unit == 'rpx') { + value = value * 2 + } + value = String(value) + // 用内置验证规则中的number判断是否为数值 + return isNumber(value) ? `${value}${unit}` : value +} + +export function millisecondsToSeconds(milliseconds) { + return Math.round(milliseconds / 1000 * 100) / 100; // 将结果四舍五入到两位小数 +} \ No newline at end of file diff --git a/uni_modules/SY-StackedCarousel/package.json b/uni_modules/SY-StackedCarousel/package.json new file mode 100644 index 0000000..7b22fbc --- /dev/null +++ b/uni_modules/SY-StackedCarousel/package.json @@ -0,0 +1,85 @@ +{ + "id": "SY-StackedCarousel", + "displayName": "堆叠轮播图、3D轮播图", + "version": "1.0.0", + "description": "堆叠（层叠）式轮播图组件，3D轮播图，微信小程序通用。让您不再为特殊轮播需求而烦恼。", + "keywords": [ + "堆叠轮播图", + "层叠轮播图", + "3D轮播图", + "轮播图", + "轮播" +], + "repository": "", + "engines": { + "HBuilderX": "^3.7.12" + }, + "dcloudext": { + "type": "component-vue", + "sale": { + "regular": { + "price": "0.00" + }, + "sourcecode": { + "price": "0.00" + } + }, + "contact": { + "qq": "" + }, + "declaration": { + "ads": "无", + "data": "无", + "permissions": "无" + }, + "npmurl": "" + }, + "uni_modules": { + "dependencies": [], + "encrypt": [], + "platforms": { + "cloud": { + "tcb": "y", + "aliyun": "y" + }, + "client": { + "Vue": { + "vue2": "y", + "vue3": "y" + }, + "App": { + "app-vue": "u", + "app-nvue": "u" + }, + "H5-mobile": { + "Safari": "u", + "Android Browser": "u", + "微信浏览器(Android)": "u", + "QQ浏览器(Android)": "u" + }, + "H5-pc": { + "Chrome": "y", + "IE": "y", + "Edge": "y", + "Firefox": "u", + "Safari": "u" + }, + "小程序": { + "微信": "y", + "阿里": "u", + "百度": "u", + "字节跳动": "u", + "QQ": "u", + "钉钉": "u", + "快手": "u", + "飞书": "u", + "京东": "u" + }, + "快应用": { + "华为": "u", + "联盟": "u" + } + } + } + } +} \ No newline at end of file diff --git a/uni_modules/SY-StackedCarousel/readme.md b/uni_modules/SY-StackedCarousel/readme.md new file mode 100644 index 0000000..d6e7f88 --- /dev/null +++ b/uni_modules/SY-StackedCarousel/readme.md @@ -0,0 +1,117 @@ +## SY-StackedCarousel + +该组件一般用于导航轮播，广告展示等场景,可开箱即用，具有如下特点： + +- 3D 轮播图效果，满足不同的开发需求 +- 可配置显示标题，涵盖不同的应用场景 +- 功能属性齐全丰富 +- 轻量级，支持小程序、H5 等平台（支持 vue2、vue3） + +### 使用方式 + +```html + + + +``` + +### 属性说明 + +| 属性名 | 类型 | 默认值 | 说明 | +| :-----------------| :---------------| :------------------ | :--------------------------------------------------------- | +| images | Array | [] | 图片数组 | +| height | [String, Number]| 300rpx | 轮播图高度 | +| autoplay | Boolean | true | 是否自动播放 | +| padding | String | 10px | 轮播内边距 | +| radius | [String, Number]| 4 | 组件圆角值 | +| bgColor | String | #ffffff | 容器背景色 | +| interval | Number | 2000 | 滑块自动切换时间间隔（ms） | +| current | Number | 0 | 当前显示的图片索引 | +| easing | String | ease-in-out | 动画类型 | +| enableOpacity | Boolean | true | 是否启用不透明度设定（堆叠每一层逐渐变透明） | +| baseOpacity | Number | 0.8 | 最顶层图片的不透明度，每一层会根据这个值自动缩小 opacity值 | +| duration | Number | 500 | 滑块切换过程所需时间（ms） | +| horizontalMargin | [String, Number]| 10 | 横向间距 | +| verticalMargin | [String, Number]| 10 | 纵向间距 | +| showButton | Boolean | false | 是否显示操作按钮 | +| buttonSize | [String, Number]| 24 | 按钮大小以及按钮图标大小 | +| buttonBgColor | String | rgba(0, 0, 0, 0.26) | 按钮背景颜色 | +| imgMode | String | aspectFill | 图片裁剪模式，详情见微信原生 imageMode | +| showFirstImageOnly| Boolean | false | 是否只显示第一张图片，其他图片被蒙版遮住 | +| maskBgColor | String | #ffffff | 遮住蒙版的颜色 | +| showDesc | Boolean | true | 是否显示图片描述（需要 images 传递的数据中存在 desc 属性） | +| descBgColor | String | rgba(0, 0, 0, 0.5) | 底部描述的背景颜色 | +| descColor | String | #ffffff | 底部描述字体颜色 | +| descSize | [String, Number]| 10 | 底部描述字体大小 | +| descNoWrap | Boolean | false | 描述是否不换行，超出后用...省略 | +| slideRadius | [String, Number]| 10 | 图片的圆角值 | + +### 事件说明 + +| 事件名 | 说明 | 回调参数 | +| :----- | :----------------------------------- | :--------------------------------------------------------- | +| click | 点击图片触发 | item：当前图片对象信息, index：当前是第几张图片，从 0 开始 | +| change | 轮播图切换时触发（自动或者手动切换） | index：当前是第几张图片，从 0 开始 | + +### 插槽 + +| 插槽名称 | 说明 | +| :----- | :-----------------------------------| +| left-button | 翻页按钮左侧图标 | +| right-button| 翻页按钮右侧图标 | \ No newline at end of file