@pisell/private-materials 6.6.8 → 6.6.10

package/dist/lib/components/walletList/index.less

@@ -0,0 +1,369 @@
+.pisell-lowcode__walletList {
+  position: relative;
+  margin: 0;
+  /* 移除负边距 */
+
+  .slick-list {
+    padding: 0 !important;
+    /* 确保没有内边距，避免第一个和最后一个元素有额外边距 */
+    margin: 0;
+  }
+
+  .slick-track {
+    display: flex;
+    align-items: stretch;
+    // gap: 24px;
+    /* 只在元素之间添加24px间距 */
+    margin: 0 !important;
+    /* 确保track本身没有外边距 */
+  }
+
+  .slick-slide {
+    height: auto;
+    opacity: 0.5;
+    transition: opacity 0.3s ease;
+    margin: 0 !important;
+    /* 确保slide元素本身没有外边距 */
+    padding: 0 !important;
+    /* 确保slide元素本身没有内边距 */
+
+    &.slick-active {
+      opacity: 1;
+    }
+
+    > div {
+      height: 100%;
+      margin: 0;
+      padding: 0;
+    }
+  }
+
+  /* 保留默认箭头样式并增强可见性 */
+  .slick-arrow {
+    font-size: 0;
+    opacity: 0;
+    /* 设置为0，隐藏默认箭头 */
+    width: 40px;
+    height: 40px;
+    z-index: 100;
+
+    &.slick-prev {
+      left: 20px;
+    }
+
+    &.slick-next {
+      right: 20px;
+    }
+
+    &:before {
+      content: '';
+      /* 确保不显示箭头内容 */
+    }
+  }
+
+  /* 完全隐藏内置导航点 */
+  .slick-dots {
+    display: none !important;
+    visibility: hidden !important;
+    opacity: 0 !important;
+    pointer-events: none !important;
+    height: 0 !important;
+    width: 0 !important;
+    overflow: hidden !important;
+    position: absolute !important;
+    left: -9999px !important;
+
+    /* 确保子元素也不可见 */
+    * {
+      display: none !important;
+      visibility: hidden !important;
+      opacity: 0 !important;
+      pointer-events: none !important;
+    }
+  }
+
+  .slick-dots.slick-dots-bottom {
+    display: none !important;
+    visibility: hidden !important;
+    opacity: 0 !important;
+    pointer-events: none !important;
+    /*
+    padding: 12px;
+    border-radius: 17px;
+    background: rgba(255, 255, 255, 0.90);
+    height: 34px;
+    box-sizing: border-box;
+    bottom: -12px;
+    left: 50%;
+    transform: translateX(-50%);
+    backdrop-filter: blur(4px);
+    width: fit-content;
+    margin: 0;
+    position: absolute;
+    */
+  }
+}
+
+.pisell-wallet-list-container {
+  overflow: visible;
+  /* 修改为visible允许内容溢出显示 */
+  width: 100%;
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  min-height: 0;
+  /* 防止flex子项溢出 */
+  padding-bottom: 8px;
+  /* 添加底部padding确保按钮阴影完整显示 */
+
+  .wallet-content {
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+    min-height: 0;
+    /* 防止flex子项溢出 */
+
+    /* 确保内置箭头不可见但功能可用 */
+    .slick-prev,
+    .slick-next {
+      opacity: 0;
+      /* 设置为0，隐藏箭头 */
+      pointer-events: auto;
+      /* 保留点击事件 */
+      z-index: -1;
+      /* 确保在其他元素之下 */
+    }
+
+    .slick-slider {
+      display: flex;
+      flex-direction: column;
+      flex: 1;
+      min-height: 0;
+      /* 防止flex子项溢出 */
+    }
+
+    .slick-list {
+      flex: 1;
+      min-height: 0;
+      padding: 0 !important;
+      margin: 0;
+      /* 防止flex子项溢出 */
+    }
+
+    .slick-track {
+      display: flex;
+      min-height: 0;
+      // gap: 24px;
+      /* 元素之间保持24px间距 */
+      margin: 0 !important;
+      /* 确保没有外边距 */
+    }
+
+    .slick-slide {
+      margin: 0 !important;
+      padding: 0 !important;
+    }
+  }
+
+  /* 为卡片容器添加样式 */
+  .wallet-card-container {
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+    min-height: 0;
+    /* 防止flex子项溢出 */
+
+    /* 确保WalletCard组件可以正确展示 */
+    .pisell-wallet-card {
+      width: 100%;
+      display: block;
+      margin-bottom: 0;
+    }
+  }
+
+  /* 确保底部容器的overflow设置不会影响阴影显示 */
+  .wallet-navigation {
+    cursor: default;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-top: 12px;
+    /* 保持固定的12px顶部间距 */
+    position: relative;
+    /* 确保相对于容器定位 */
+    overflow: visible;
+    /* 确保阴影可以溢出容器 */
+    z-index: 5;
+    /* 提高z-index确保在其他元素之上 */
+
+    /* 增加一个透明的遮罩层，确保点击事件不会穿透 */
+    &::before {
+      content: '';
+      position: absolute;
+      z-index: -1;
+      top: -10px;
+      left: -10px;
+      right: -10px;
+      bottom: -10px;
+      pointer-events: none;
+      /* 该遮罩自身不接收事件 */
+    }
+  }
+
+  .wallet-nav-button {
+    cursor: pointer;
+    width: 44px;
+    height: 44px;
+    background-color: #ffffff;
+    border-radius: 50%;
+    display: flex;
+    padding: 10px;
+    box-sizing: border-box;
+    align-items: center;
+    justify-content: center;
+    cursor: pointer;
+    border-radius: 22px;
+    background: rgba(255, 255, 255, 0.9);
+    backdrop-filter: blur(4px);
+    box-shadow: 0px 2px 4px rgba(16, 24, 40, 0.1),
+      0px 1px 3px rgba(16, 24, 40, 0.1);
+    z-index: 10;
+    position: relative;
+    /* 确保相对定位 */
+    touch-action: manipulation;
+    /* 优化触摸事件处理 */
+    pointer-events: auto;
+    /* 确保按钮可以接收点击事件 */
+
+    /* 为图标设置样式 */
+    .anticon {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      font-size: 24px;
+    }
+
+    &:hover {
+      background-color: #ffffff;
+      box-shadow: 0px 3px 6px rgba(16, 24, 40, 0.15),
+        0px 2px 4px rgba(16, 24, 40, 0.1);
+    }
+
+    &.disabled {
+      cursor: not-allowed;
+      opacity: 0.7;
+
+      &:hover {
+        box-shadow: 0px 2px 4px rgba(16, 24, 40, 0.1),
+          0px 1px 3px rgba(16, 24, 40, 0.1);
+      }
+    }
+
+    /* 确保所有子元素不会阻止点击事件 */
+    * {
+      pointer-events: none;
+    }
+  }
+
+  .wallet-dots-container {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 12px;
+    border-radius: 17px;
+    background: rgba(255, 255, 255, 0.9);
+    backdrop-filter: blur(4px);
+    height: 34px;
+    z-index: 100;
+    box-shadow: 0px 2px 4px rgba(16, 24, 40, 0.1),
+      0px 1px 3px rgba(16, 24, 40, 0.1);
+
+    .wallet-dot {
+      width: 10px;
+      height: 10px;
+      border-radius: 50%;
+      background-color: #f2f4f7;
+      margin: 0 8px;
+      transition: all 0.3s ease;
+
+      &.active {
+        width: 8px;
+        height: 8px;
+        border-radius: 4px;
+        background-color: #6941c6;
+      }
+    }
+  }
+
+  /* 添加计数器样式 */
+  .wallet-counter {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: #ffffff;
+    min-width: 70px;
+    text-align: center;
+
+    color: var(--Gray-500, #667085);
+
+    /* Text xl/Semibold */
+    font-size: 20px;
+    font-style: normal;
+    font-weight: 600;
+    line-height: 30px;
+    /* 150% */
+  }
+
+  .pisell-lowcode__walletList {
+    flex: 1;
+    /* 让走马灯填充剩余空间 */
+    min-height: 0;
+    /* 防止flex子项溢出 */
+
+    .slick-slide {
+      box-sizing: border-box;
+    }
+
+    .slick-dots {
+      display: none;
+
+      li {
+        button {
+          background: rgba(0, 0, 0, 0.2);
+          border-radius: 4px;
+          transition: all 0.3s ease;
+
+          &:hover {
+            background: rgba(0, 0, 0, 0.4);
+          }
+        }
+
+        &.slick-active {
+          button {
+            background: var(--theme-color, #7f56d9);
+          }
+        }
+      }
+    }
+  }
+
+  .pisell-lowcode__error {
+    text-align: center;
+    padding: 20px;
+    color: #ff4d4f;
+    font-size: 14px;
+  }
+
+  .pisell-lowcode__empty {
+    text-align: center;
+    padding: 20px;
+    color: #8c8c8c;
+    font-size: 14px;
+  }
+
+  /* 简化骨架屏样式，使用组件库自带的骨架屏 */
+  .pisell-wallet-skeleton {
+    padding: 16px;
+  }
+}

package/dist/lib/components/walletList/locales.js

@@ -0,0 +1,22 @@
+
+//#region src/components/walletList/locales.ts
+var locales_default = {
+	"en": {
+		"page.wallet.guide.title": "Activate Now!",
+		"page.wallet.guide.subtitle": "Unlock membership benefits now",
+		"page.wallet.guide.button": "Get Your Reward"
+	},
+	"zh-CN": {
+		"page.wallet.guide.title": "待解锁权益",
+		"page.wallet.guide.subtitle": "成为专属会员，即可享受更多权益",
+		"page.wallet.guide.button": "点击获取"
+	},
+	"zh-HK": {
+		"page.wallet.guide.title": "待解鎖權益",
+		"page.wallet.guide.subtitle": "成為專屬會員，即可享受更多權益",
+		"page.wallet.guide.button": "點擊獲取"
+	}
+};
+
+//#endregion
+exports.default = locales_default;

package/dist/lib/components/walletList/model.js

@@ -0,0 +1,40 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.js');
+const require_index = require('./types/index.js');
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+
+//#region src/components/walletList/model.tsx
+const initialState = {
+	list: [],
+	balance: null,
+	loading: false,
+	error: null,
+	authError: false,
+	hasAttempted: false
+};
+const Context = (0, react.createContext)({
+	state: initialState,
+	dispatch: () => null
+});
+const Provider = (Component) => {
+	return function ProviderWrapper(props) {
+		const [state, dispatch] = (0, react.useReducer)(reducer, initialState);
+		return /* @__PURE__ */ react.default.createElement(Context.Provider, { value: {
+			state,
+			dispatch
+		} }, /* @__PURE__ */ react.default.createElement(Component, props));
+	};
+};
+function reducer(state, action) {
+	switch (action.type) {
+		case "setState": return {
+			...state,
+			...action.payload
+		};
+		default: return state;
+	}
+}
+
+//#endregion
+exports.Context = Context;
+exports.Provider = Provider;

package/dist/lib/components/walletList/serve.js

@@ -0,0 +1,48 @@
+const require_index = require('../../utils/index.js');
+
+//#region src/components/walletList/serve.ts
+/**
+* 获取 wallet 列表
+* @param params 
+* @returns 
+*/
+const getWalletList = async () => {
+	try {
+		const { data } = await require_index.request.getRequest().get("/h5/wallet", {});
+		return data || [];
+	} catch (error) {
+		return [];
+	}
+};
+/**
+* 获取钱包余额
+* @returns 
+*/
+const getWalletBalance = async () => {
+	try {
+		const { data } = await require_index.request.getRequest().get("/h5/wallet/wallet-pass/balance", {});
+		return data || null;
+	} catch (error) {
+		return null;
+	}
+};
+/**
+* @title: 获取钱包店铺列表
+* @description: 
+* @return {*}
+* @Author: WangHan
+* @Date: 2025-06-09 11:12
+*/
+const getWalletShopList = async (params) => {
+	try {
+		const { data } = await require_index.request.getRequest().get("/h5/wallet/shop/list", params || {}, { useCache: true });
+		return data || null;
+	} catch (error) {
+		return null;
+	}
+};
+
+//#endregion
+exports.getWalletBalance = getWalletBalance;
+exports.getWalletList = getWalletList;
+exports.getWalletShopList = getWalletShopList;

package/dist/lib/components/walletList/status.js

@@ -0,0 +1,47 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.js');
+let __pisell_utils = require("@pisell/utils");
+
+//#region src/components/walletList/status.ts
+/**
+* @title: 默认引导页配置
+* @description: 
+* @param {any} locales
+* @return {any}
+* @Author: WangHan
+* @Date: 2025-06-09 14:22
+*/
+const defaultWalletGuideConfig = () => {
+	return {
+		show: 1,
+		align: "center",
+		backgroundColor: "",
+		backgroundImage: "",
+		backgroundImageAlt: "",
+		buttonColor: "rgba(127,86,217,1)",
+		buttonBorderColor: "rgba(127,86,217,1)",
+		titleConfig: {
+			size: 18,
+			color: "rgba(255,255,255,1)",
+			weight: 600,
+			style: "normal",
+			text: __pisell_utils.locales.getText("page.wallet.guide.title")
+		},
+		subtitleConfig: {
+			size: 14,
+			color: "rgba(208,213,221,1)",
+			weight: 400,
+			style: "normal",
+			text: __pisell_utils.locales.getText("page.wallet.guide.subtitle")
+		},
+		buttonConfig: {
+			size: 14,
+			color: "rgba(255,255,255,1)",
+			weight: 600,
+			style: "normal",
+			text: __pisell_utils.locales.getText("page.wallet.guide.button")
+		}
+	};
+};
+
+//#endregion
+exports.defaultWalletGuideConfig = defaultWalletGuideConfig;

package/dist/lib/components/walletList/types/index.js

@@ -0,0 +1,19 @@
+
+//#region src/components/walletList/types/index.ts
+const DEFAULT_CARD_CONFIG = {
+	mode: "light",
+	cardStyle: "normal",
+	codeDirection: "bottom",
+	showShopName: true,
+	showWalletName: true,
+	showIcon: true,
+	iconImg: "",
+	showCardNo: true,
+	showCode: true,
+	points: true,
+	balance: true,
+	coupon: true
+};
+
+//#endregion
+exports.DEFAULT_CARD_CONFIG = DEFAULT_CARD_CONFIG;

package/dist/lib/components/workSpaceList/components/AppearanceEdit/Color.js

@@ -0,0 +1,46 @@
+const require_rolldown_runtime = require('../../../../_virtual/rolldown_runtime.js');
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let classnames = require("classnames");
+classnames = require_rolldown_runtime.__toESM(classnames);
+let ahooks = require("ahooks");
+require("./Color.less");
+
+//#region src/components/workSpaceList/components/AppearanceEdit/Color.tsx
+const colorArr = [
+	"#7F56D9",
+	"#D92D20",
+	"#DC6803",
+	"#039855",
+	"#3E4784",
+	"#088AB2",
+	"#444CE7",
+	"#BA24D5",
+	"#CA8504",
+	"#475467"
+];
+const ColorItem = (props) => {
+	const { color, active, onClick } = props;
+	const style = (0, react.useMemo)(() => {
+		return { "--color-item-background-color": color };
+	}, [color]);
+	return /* @__PURE__ */ react.default.createElement("span", {
+		onClick,
+		className: (0, classnames.default)("color-item", { ["color-item-active"]: active }),
+		style
+	});
+};
+const Color = (props) => {
+	const { value, onChange, defaultValue } = props;
+	const [state, setState] = (0, ahooks.useControllableValue)(props);
+	return /* @__PURE__ */ react.default.createElement("div", null, colorArr.map((item) => /* @__PURE__ */ react.default.createElement(ColorItem, {
+		key: item,
+		color: item,
+		active: state === item,
+		onClick: () => setState?.(item)
+	})));
+};
+var Color_default = Color;
+
+//#endregion
+exports.default = Color_default;

package/dist/lib/components/workSpaceList/components/AppearanceEdit/Color.less

@@ -0,0 +1,24 @@
+.color-item {
+  width: 28px;
+  height: 28px;
+  margin-right: 12px;
+  border-radius: 50%;
+  background-color: var(--color-item-background-color);
+  position: relative;
+  display: inline-block;
+  cursor: pointer;
+}
+.color-item-active {
+  &:after {
+    content: '';
+    display: inline-block;
+    position: absolute;
+    width: 40px;
+    height: 40px;
+    border-radius: 50%;
+    border: 3px solid var(--color-item-background-color);
+    left: -6px;
+    top: -6px;
+    box-sizing: border-box;
+  }
+}

package/dist/lib/components/workSpaceList/components/AppearanceEdit/IconPanel.js

@@ -0,0 +1,47 @@
+const require_rolldown_runtime = require('../../../../_virtual/rolldown_runtime.js');
+const require_constants = require('./constants.js');
+let react = require("react");
+let antd = require("antd");
+let classnames = require("classnames");
+classnames = require_rolldown_runtime.__toESM(classnames);
+let ahooks = require("ahooks");
+let __pisell_materials = require("@pisell/materials");
+let __pisell_icon = require("@pisell/icon");
+require("./IconPanel.less");
+
+//#region src/components/workSpaceList/components/AppearanceEdit/IconPanel.tsx
+const IconPanel = (props) => {
+	const { color, name, value } = props;
+	const [state, setState] = (0, ahooks.useControllableValue)(props);
+	const [showIcons, setShowIcons] = (0, react.useState)(require_constants.icons);
+	const onSearch = (val) => {
+		setShowIcons(require_constants.icons.filter((item) => item.name.includes(val)));
+	};
+	return /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(__pisell_materials.Input, {
+		bordered: false,
+		prefix: /* @__PURE__ */ React.createElement(__pisell_icon.SearchLg, { className: "search-icon" }),
+		placeholder: "Search icons",
+		className: "search",
+		onPressEnter: (e) => onSearch?.(e.target?.value)
+	}), /* @__PURE__ */ React.createElement(antd.Space, {
+		size: 20,
+		wrap: true
+	}, /* @__PURE__ */ React.createElement("div", {
+		className: (0, classnames.default)("icon-item-wrap", "icon-item-text", { ["icon-item-wrap-active"]: !require_constants.iconMap[value] }),
+		style: !require_constants.iconMap[value] ? { background: color } : {},
+		onClick: () => setState("")
+	}, name.slice(0, 2)), showIcons.map((item) => {
+		const isActive = state === item.name;
+		const Icon = item.icon;
+		return /* @__PURE__ */ React.createElement("div", {
+			className: (0, classnames.default)("icon-item-wrap", { ["icon-item-wrap-active"]: isActive }),
+			style: isActive ? { background: color } : {},
+			onClick: () => setState(item.name),
+			key: item.name
+		}, /* @__PURE__ */ React.createElement(Icon, { style: { fontSize: 20 } }));
+	})));
+};
+var IconPanel_default = IconPanel;
+
+//#endregion
+exports.default = IconPanel_default;

package/dist/lib/components/workSpaceList/components/AppearanceEdit/IconPanel.less

@@ -0,0 +1,19 @@
+.search {
+  margin-bottom: 20px;
+}
+.icon-item-wrap {
+  width: 36px;
+  height: 36px;
+  padding: 8px;
+  cursor: pointer;
+  border-radius: 8px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.icon-item-text {
+  padding: 0;
+}
+.icon-item-wrap-active {
+  color: #fff;
+}