From 92230c9a97dc9ce9df3313d11d26999c04bb6b26 Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期二, 15 七月 2025 13:12:48 +0800
Subject: [PATCH] 项目初始化
---
src/uni_modules/uni-goods-nav/components/uni-goods-nav/uni-goods-nav.vue | 229 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 229 insertions(+), 0 deletions(-)
diff --git a/src/uni_modules/uni-goods-nav/components/uni-goods-nav/uni-goods-nav.vue b/src/uni_modules/uni-goods-nav/components/uni-goods-nav/uni-goods-nav.vue
new file mode 100644
index 0000000..8a16b17
--- /dev/null
+++ b/src/uni_modules/uni-goods-nav/components/uni-goods-nav/uni-goods-nav.vue
@@ -0,0 +1,229 @@
+<template>
+ <view class="uni-goods-nav">
+ <!-- 搴曢儴鍗犱綅 -->
+ <view class="uni-tab__seat" />
+ <view class="uni-tab__cart-box flex">
+ <view class="flex uni-tab__cart-sub-left">
+ <view v-for="(item,index) in options" :key="index" class="flex uni-tab__cart-button-left uni-tab__shop-cart" @click="onClick(index,item)">
+ <view class="uni-tab__icon">
+ <uni-icons :type="item.icon" size="20" color="#646566"></uni-icons>
+ <!-- <image class="image" :src="item.icon" mode="widthFix" /> -->
+ </view>
+ <text class="uni-tab__text">{{ item.text }}</text>
+ <view class="flex uni-tab__dot-box">
+ <text v-if="item.info" :class="{ 'uni-tab__dots': item.info > 9 }" class="uni-tab__dot " :style="{'backgroundColor':item.infoBackgroundColor?item.infoBackgroundColor:'#ff0000',
+ color:item.infoColor?item.infoColor:'#fff'
+ }">{{ item.info }}</text>
+ </view>
+ </view>
+ </view>
+ <view :class="{'uni-tab__right':fill}" class="flex uni-tab__cart-sub-right ">
+ <view v-for="(item,index) in buttonGroup" :key="index" :style="{background:item.backgroundColor,color:item.color}"
+ class="flex uni-tab__cart-button-right" @click="buttonClick(index,item)"><text :style="{color:item.color}" class="uni-tab__cart-button-right-text">{{ item.text }}</text></view>
+ </view>
+ </view>
+ </view>
+</template>
+
+<script>
+ import {
+ initVueI18n
+ } from '@dcloudio/uni-i18n'
+ import messages from './i18n/index.js'
+ const { t } = initVueI18n(messages)
+ /**
+ * GoodsNav 鍟嗗搧瀵艰埅
+ * @description 鍟嗗搧鍔犲叆璐墿杞︺�佺珛鍗宠喘涔扮瓑
+ * @tutorial https://ext.dcloud.net.cn/plugin?id=865
+ * @property {Array} options 缁勪欢鍙傛暟
+ * @property {Array} buttonGroup 缁勪欢鎸夐挳缁勫弬鏁�
+ * @property {Boolean} fill = [true | false] 缁勪欢鎸夐挳缁勫弬鏁�
+ * @property {Boolean} stat 鏄惁寮�鍚粺璁″姛鑳�
+ * @event {Function} click 宸︿晶鐐瑰嚮浜嬩欢
+ * @event {Function} buttonClick 鍙充晶鎸夐挳缁勭偣鍑讳簨浠�
+ * @example <uni-goods-nav :fill="true" options="" buttonGroup="buttonGroup" @click="" @buttonClick="" />
+ */
+ export default {
+ name: 'UniGoodsNav',
+ emits:['click','buttonClick'],
+ props: {
+ options: {
+ type: Array,
+ default () {
+ return [{
+ icon: 'shop',
+ text: t("uni-goods-nav.options.shop"),
+ }, {
+ icon: 'cart',
+ text: t("uni-goods-nav.options.cart")
+ }]
+ }
+ },
+ buttonGroup: {
+ type: Array,
+ default () {
+ return [{
+ text: t("uni-goods-nav.buttonGroup.addToCart"),
+ backgroundColor: 'linear-gradient(90deg, #FFCD1E, #FF8A18)',
+ color: '#fff'
+ },
+ {
+ text: t("uni-goods-nav.buttonGroup.buyNow"),
+ backgroundColor: 'linear-gradient(90deg, #FE6035, #EF1224)',
+ color: '#fff'
+ }
+ ]
+ }
+ },
+ fill: {
+ type: Boolean,
+ default: false
+ },
+ stat:{
+ type: Boolean,
+ default: false
+ }
+ },
+ methods: {
+ onClick(index, item) {
+ this.$emit('click', {
+ index,
+ content: item,
+ })
+ },
+ buttonClick(index, item) {
+ if (uni.report && this.stat) {
+ uni.report(item.text, item.text)
+ }
+ this.$emit('buttonClick', {
+ index,
+ content: item
+ })
+ }
+ }
+ }
+</script>
+
+<style lang="scss" >
+ .flex {
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ flex-direction: row;
+ }
+
+ .uni-goods-nav {
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ flex: 1;
+ flex-direction: row;
+ }
+
+ .uni-tab__cart-box {
+ flex: 1;
+ height: 50px;
+ background-color: #fff;
+ z-index: 900;
+ }
+
+ .uni-tab__cart-sub-left {
+ padding: 0 5px;
+ }
+
+ .uni-tab__cart-sub-right {
+ flex: 1;
+ }
+
+ .uni-tab__right {
+ margin: 5px 0;
+ margin-right: 10px;
+ border-radius: 100px;
+ overflow: hidden;
+ }
+
+ .uni-tab__cart-button-left {
+ /* #ifndef APP-NVUE */
+ display: flex;
+ /* #endif */
+ // flex: 1;
+ position: relative;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+ margin: 0 10px;
+ /* #ifdef H5 */
+ cursor: pointer;
+ /* #endif */
+ }
+
+ .uni-tab__icon {
+ width: 18px;
+ height: 18px;
+ }
+
+ .image {
+ width: 18px;
+ height: 18px;
+ }
+
+ .uni-tab__text {
+ margin-top: 3px;
+ font-size: 12px;
+ color: #646566;
+ }
+
+ .uni-tab__cart-button-right {
+ /* #ifndef APP-NVUE */
+ display: flex;
+ flex-direction: column;
+ /* #endif */
+ flex: 1;
+ justify-content: center;
+ align-items: center;
+ /* #ifdef H5 */
+ cursor: pointer;
+ /* #endif */
+ }
+
+ .uni-tab__cart-button-right-text {
+ font-size: 14px;
+ color: #fff;
+ }
+
+ .uni-tab__cart-button-right:active {
+ opacity: 0.7;
+ }
+
+ .uni-tab__dot-box {
+ /* #ifndef APP-NVUE */
+ display: flex;
+ flex-direction: column;
+ /* #endif */
+ position: absolute;
+ right: -2px;
+ top: 2px;
+ justify-content: center;
+ align-items: center;
+ // width: 0;
+ // height: 0;
+ }
+
+ .uni-tab__dot {
+ // width: 30rpx;
+ // height: 30rpx;
+ padding: 0 4px;
+ line-height: 15px;
+ color: #ffffff;
+ text-align: center;
+ font-size: 12px;
+ background-color: #ff0000;
+ border-radius: 15px;
+ }
+
+ .uni-tab__dots {
+ padding: 0 4px;
+ // width: auto;
+ border-radius: 15px;
+ }
+</style>
--
Gitblit v1.9.3