@ruixinkeji/prism-ui 1.0.14 → 1.0.16

package/dist/dev/mp-weixin/components/PrismMusicPlayer/PrismMusicPlayer.wxss

@@ -0,0 +1,334 @@
+/**
+ * Prism UI - SCSS 变量定义
+ * 此文件包含所有设计令牌和变量
+ * 所有变量使用 $prism- 前缀，避免与用户项目冲突
+ *
+ * 主题切换：修改下面的引入文件即可切换主题
+ * 可选主题：blue(默认) / green / purple / orange / red / cyan
+ */
+/**
+ * Prism UI - 蓝色主题（默认）
+ *
+ * 使用方式：在 variables.scss 中修改引入
+ * @import '../theme/blue.scss';
+ *
+ * 颜色值来自 colors.scss 中的 $prism-blue-* 变量
+ */
+/* ============================================================
+   一、浅色模式变量（使用 !default，允许主题文件覆盖）
+   ============================================================ */
+/* -------------------- 主题色 -------------------- */
+/* -------------------- 状态色 -------------------- */
+/* -------------------- 文字颜色 -------------------- */
+/* -------------------- 边框颜色 -------------------- */
+/* -------------------- 背景颜色 -------------------- */
+/* ============================================================
+   二、深色模式变量
+   ============================================================ */
+/* -------------------- 主题色（深色） -------------------- */
+/* -------------------- 状态色（深色） -------------------- */
+/* -------------------- 文字颜色（深色） -------------------- */
+/* -------------------- 边框颜色（深色） -------------------- */
+/* -------------------- 背景颜色（深色） -------------------- */
+/* ============================================================
+   三、主题色透明度（使用 !default，允许主题文件覆盖）
+   ============================================================ */
+/* ============================================================
+   主题色渐变（使用 !default，允许主题文件覆盖）
+   ============================================================ */
+/* ============================================================
+   四、白色透明度
+   ============================================================ */
+/* ============================================================
+   六、第三方品牌色
+   ============================================================ */
+/* ============================================================
+   八、常用阴影（使用 !default，允许主题文件覆盖）
+   ============================================================ */
+/* ============================================================
+   九、统一间距
+   ============================================================ */
+.prism-music-player.data-v-1a161305 {
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  border-radius: 24rpx;
+  padding: 24rpx;
+  color: #fff;
+}
+
+/* 主播放区 - 横向布局 */
+.player-main.data-v-1a161305 {
+  display: flex;
+  align-items: center;
+  gap: 20rpx;
+  margin-bottom: 20rpx;
+}
+.cover-wrapper.data-v-1a161305 {
+  width: 140rpx;
+  height: 140rpx;
+  border-radius: 50%;
+  overflow: hidden;
+  flex-shrink: 0;
+  box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.3);
+  border: 4rpx solid rgba(255, 255, 255, 0.3);
+  position: relative;
+}
+.cover-wrapper.playing.data-v-1a161305 {
+  animation: rotate-1a161305 10s linear infinite;
+}
+.cover-wrapper.data-v-1a161305::after {
+  content: "";
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  width: 32rpx;
+  height: 32rpx;
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  border-radius: 50%;
+  border: 4rpx solid rgba(255, 255, 255, 0.5);
+  z-index: 2;
+}
+@keyframes rotate-1a161305 {
+from {
+    transform: rotate(0deg);
+}
+to {
+    transform: rotate(360deg);
+}
+}
+.cover-image.data-v-1a161305 {
+  width: 100%;
+  height: 100%;
+}
+.cover-placeholder.data-v-1a161305 {
+  width: 100%;
+  height: 100%;
+  background: rgba(255, 255, 255, 0.15);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.cover-placeholder .fa.data-v-1a161305 {
+  font-size: 40rpx;
+  opacity: 0.6;
+}
+.player-info.data-v-1a161305 {
+  flex: 1;
+  min-width: 0;
+}
+.song-title.data-v-1a161305 {
+  display: block;
+  font-size: 28rpx;
+  font-weight: 600;
+  margin-bottom: 4rpx;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.song-album.data-v-1a161305 {
+  display: block;
+  font-size: 22rpx;
+  opacity: 0.7;
+  margin-bottom: 12rpx;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.player-controls.data-v-1a161305 {
+  display: flex;
+  align-items: center;
+  gap: 24rpx;
+}
+.control-icon.data-v-1a161305 {
+  font-size: 36rpx;
+  opacity: 0.8;
+}
+.play-button.data-v-1a161305 {
+  width: 72rpx;
+  height: 72rpx;
+  border-radius: 50%;
+  background: #fff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.2);
+}
+.play-button .fa.data-v-1a161305 {
+  font-size: 28rpx;
+  color: #667eea;
+}
+
+/* 进度条 */
+.progress-section.data-v-1a161305 {
+  display: flex;
+  align-items: center;
+  gap: 12rpx;
+  margin-bottom: 16rpx;
+}
+.time-text.data-v-1a161305 {
+  font-size: 20rpx;
+  opacity: 0.8;
+}
+.progress-bar.data-v-1a161305 {
+  flex: 1;
+  height: 6rpx;
+  background: rgba(255, 255, 255, 0.3);
+  border-radius: 3rpx;
+  overflow: hidden;
+}
+.progress-fill.data-v-1a161305 {
+  height: 100%;
+  background: #fff;
+  border-radius: 3rpx;
+  transition: width 0.3s ease;
+}
+
+/* 底部按钮栏 */
+.bottom-bar.data-v-1a161305 {
+  display: flex;
+  gap: 12rpx;
+}
+.bar-btn.data-v-1a161305 {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 8rpx;
+  padding: 12rpx 16rpx;
+  background: rgba(0, 0, 0, 0.15);
+  border-radius: 8rpx;
+  font-size: 22rpx;
+  opacity: 0.9;
+}
+.bar-btn.active.data-v-1a161305 {
+  background: rgba(255, 255, 255, 0.2);
+}
+
+/* 弹出层遮罩 */
+.popup-mask.data-v-1a161305 {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.5);
+  z-index: 100;
+}
+
+/* 弹出层 - 居中 */
+.popup.data-v-1a161305 {
+  position: fixed;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%) scale(0.9);
+  width: 560rpx;
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  border-radius: 16rpx;
+  z-index: 101;
+  opacity: 0;
+  visibility: hidden;
+  transition: all 0.2s ease;
+  box-shadow: 0 16rpx 48rpx rgba(0, 0, 0, 0.3);
+}
+.popup.show.data-v-1a161305 {
+  opacity: 1;
+  visibility: visible;
+  transform: translate(-50%, -50%) scale(1);
+}
+.popup-title.data-v-1a161305 {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 12rpx;
+  padding: 20rpx 24rpx;
+  font-size: 26rpx;
+  font-weight: 600;
+  border-bottom: 1rpx solid rgba(255, 255, 255, 0.1);
+}
+.popup-item.data-v-1a161305 {
+  display: flex;
+  align-items: center;
+  gap: 12rpx;
+  padding: 16rpx 24rpx;
+  font-size: 24rpx;
+}
+.popup-item.data-v-1a161305:active, .popup-item.active.data-v-1a161305 {
+  background: rgba(255, 255, 255, 0.15);
+}
+.item-name.data-v-1a161305 {
+  flex: 1;
+}
+.item-count.data-v-1a161305 {
+  font-size: 20rpx;
+  opacity: 0.6;
+}
+
+/* 播放清单弹出层 */
+.playlist-popup.data-v-1a161305 {
+  width: 620rpx;
+}
+.popup-scroll.data-v-1a161305 {
+  max-height: 500rpx;
+}
+.playlist-item.data-v-1a161305 {
+  display: flex;
+  align-items: center;
+  padding: 12rpx 16rpx;
+  gap: 12rpx;
+  border-bottom: 1rpx solid rgba(255, 255, 255, 0.08);
+}
+.playlist-item.data-v-1a161305:last-child {
+  border-bottom: none;
+}
+.playlist-item.data-v-1a161305:active, .playlist-item.active.data-v-1a161305 {
+  background: rgba(255, 255, 255, 0.1);
+}
+.playlist-cover.data-v-1a161305 {
+  width: 56rpx;
+  height: 56rpx;
+  border-radius: 6rpx;
+  flex-shrink: 0;
+}
+.playlist-cover.placeholder.data-v-1a161305 {
+  background: rgba(255, 255, 255, 0.1);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.playlist-cover.placeholder .fa.data-v-1a161305 {
+  font-size: 24rpx;
+  opacity: 0.5;
+}
+.song-info.data-v-1a161305 {
+  flex: 1;
+  min-width: 0;
+}
+.song-name.data-v-1a161305 {
+  font-size: 24rpx;
+  display: block;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.song-album-small.data-v-1a161305 {
+  font-size: 18rpx;
+  opacity: 0.6;
+  display: block;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  margin-top: 2rpx;
+}
+.playing-icon.data-v-1a161305 {
+  font-size: 20rpx;
+  color: #fff;
+  animation: pulse-1a161305 1s infinite;
+}
+@keyframes pulse-1a161305 {
+0%, 100% {
+    opacity: 1;
+}
+50% {
+    opacity: 0.4;
+}
+}

package/dist/dev/mp-weixin/components/PrismNavBar/PrismNavBar.js

@@ -0,0 +1,71 @@
+"use strict";
+const common_vendor = require("../../common/vendor.js");
+const store_app = require("../../store/app.js");
+const _sfc_main = {
+  __name: "PrismNavBar",
+  props: {
+    title: {
+      type: String,
+      required: true
+    },
+    icon: {
+      type: String,
+      default: ""
+    },
+    iconColor: {
+      type: String,
+      default: "blue"
+    },
+    glass: {
+      type: Boolean,
+      default: true
+    },
+    showBack: {
+      type: Boolean,
+      default: false
+    }
+  },
+  setup(__props) {
+    const appStore = store_app.useAppStore();
+    const themeIcon = common_vendor.computed(() => {
+      const icons = {
+        "light": "fa-sun",
+        "dark": "fa-moon",
+        "system": "fa-circle-half-stroke"
+      };
+      return icons[appStore.themeMode] || "fa-moon";
+    });
+    function handleThemeClick() {
+      appStore.toggleTheme();
+    }
+    function handleBack() {
+      const pages = getCurrentPages();
+      if (pages.length > 1) {
+        common_vendor.index.navigateBack();
+      } else {
+        common_vendor.index.reLaunch({ url: "/pages/index/index" });
+      }
+    }
+    return (_ctx, _cache) => {
+      return common_vendor.e({
+        a: __props.showBack
+      }, __props.showBack ? {
+        b: common_vendor.o(handleBack)
+      } : {}, {
+        c: __props.icon
+      }, __props.icon ? {
+        d: common_vendor.n(__props.icon),
+        e: common_vendor.n(__props.iconColor)
+      } : {}, {
+        f: common_vendor.t(__props.title),
+        g: common_vendor.n(themeIcon.value),
+        h: common_vendor.o(handleThemeClick),
+        i: common_vendor.unref(appStore).isDarkMode ? 1 : "",
+        j: __props.glass ? 1 : "",
+        k: common_vendor.unref(appStore).statusBarHeight + "px"
+      });
+    };
+  }
+};
+wx.createComponent(_sfc_main);
+//# sourceMappingURL=../../../.sourcemap/mp-weixin/components/PrismNavBar/PrismNavBar.js.map

package/dist/dev/mp-weixin/components/PrismNavBar/PrismNavBar.json

@@ -0,0 +1,4 @@
+{
+  "component": true,
+  "usingComponents": {}
+}

package/dist/dev/mp-weixin/components/PrismNavBar/PrismNavBar.wxml

@@ -0,0 +1 @@
+<view class="{{['prism-nav-bar', i && 'dark-mode', j && 'glass-effect']}}" style="{{'padding-top:' + k}}"><view class="nav-bar-content"><view class="nav-bar-left"><view wx:if="{{a}}" class="nav-bar-back" bindtap="{{b}}"><text class="fa fa-arrow-left"></text></view><view wx:if="{{c}}" class="{{['nav-bar-icon', 'prism-icon', e]}}"><text class="{{['fa', d]}}"></text></view><text class="nav-bar-title">{{f}}</text></view><view class="nav-bar-actions"><view class="prism-icon-btn prism-icon-btn--md theme-btn" bindtap="{{h}}"><text class="{{['fa', g]}}"></text></view></view></view></view>

package/dist/dev/mp-weixin/components/PrismNavBar/PrismNavBar.wxss

@@ -0,0 +1,150 @@
+/**
+ * Prism UI - SCSS 变量定义
+ * 此文件包含所有设计令牌和变量
+ * 所有变量使用 $prism- 前缀，避免与用户项目冲突
+ *
+ * 主题切换：修改下面的引入文件即可切换主题
+ * 可选主题：blue(默认) / green / purple / orange / red / cyan
+ */
+/**
+ * Prism UI - 蓝色主题（默认）
+ *
+ * 使用方式：在 variables.scss 中修改引入
+ * @import '../theme/blue.scss';
+ *
+ * 颜色值来自 colors.scss 中的 $prism-blue-* 变量
+ */
+/* ============================================================
+   一、浅色模式变量（使用 !default，允许主题文件覆盖）
+   ============================================================ */
+/* -------------------- 主题色 -------------------- */
+/* -------------------- 状态色 -------------------- */
+/* -------------------- 文字颜色 -------------------- */
+/* -------------------- 边框颜色 -------------------- */
+/* -------------------- 背景颜色 -------------------- */
+/* ============================================================
+   二、深色模式变量
+   ============================================================ */
+/* -------------------- 主题色（深色） -------------------- */
+/* -------------------- 状态色（深色） -------------------- */
+/* -------------------- 文字颜色（深色） -------------------- */
+/* -------------------- 边框颜色（深色） -------------------- */
+/* -------------------- 背景颜色（深色） -------------------- */
+/* ============================================================
+   三、主题色透明度（使用 !default，允许主题文件覆盖）
+   ============================================================ */
+/* ============================================================
+   主题色渐变（使用 !default，允许主题文件覆盖）
+   ============================================================ */
+/* ============================================================
+   四、白色透明度
+   ============================================================ */
+/* ============================================================
+   六、第三方品牌色
+   ============================================================ */
+/* ============================================================
+   八、常用阴影（使用 !default，允许主题文件覆盖）
+   ============================================================ */
+/* ============================================================
+   九、统一间距
+   ============================================================ */
+.prism-nav-bar {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  z-index: 100;
+  background: var(--prism-bg-color-card);
+  border-bottom: 1rpx solid var(--prism-border-color-light);
+}
+.prism-nav-bar.glass-effect {
+  background: rgba(255, 255, 255, 0.4);
+  backdrop-filter: saturate(180%) blur(40px);
+  -webkit-backdrop-filter: saturate(180%) blur(40px);
+  border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);
+}
+.nav-bar-content {
+  height: 88rpx;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0 32rpx;
+}
+.nav-bar-left {
+  display: flex;
+  align-items: center;
+  gap: 16rpx;
+  margin-top: -6rpx;
+}
+.nav-bar-back {
+  width: 56rpx;
+  height: 56rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 50%;
+  flex-shrink: 0;
+  transition: all 0.2s;
+}
+.nav-bar-back:active {
+  opacity: 0.7;
+  transform: scale(0.95);
+}
+.nav-bar-back .fa {
+  font-size: 28rpx;
+  color: var(--prism-text-primary);
+}
+.nav-bar-icon {
+  width: 56rpx;
+  height: 56rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 16rpx;
+  flex-shrink: 0;
+}
+.nav-bar-icon .fa {
+  font-size: 32rpx;
+  line-height: 1;
+}
+.nav-bar-title {
+  font-size: 32rpx;
+  font-weight: 600;
+  color: var(--prism-text-primary);
+  line-height: 1;
+}
+.nav-bar-actions {
+  display: flex;
+  align-items: center;
+  gap: 12rpx;
+  margin-top: -6rpx;
+  /* 小程序环境下预留胶囊位置 */
+  margin-right: 160rpx;
+}
+
+/* 主题切换按钮 */
+.theme-btn {
+  width: 56rpx;
+  height: 56rpx;
+  border-radius: 288rpx;
+  background: var(--prism-bg-color-icon-btn);
+  border: 1rpx solid var(--prism-border-color-light);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: all 0.2s;
+}
+.theme-btn:active {
+  opacity: 0.7;
+  transform: scale(0.96);
+}
+.theme-btn .fa {
+  color: var(--prism-warning-color);
+  font-size: 24rpx;
+}
+
+/* 深色模式 - 毛玻璃效果 */
+.prism-nav-bar.dark-mode.glass-effect {
+  background: rgba(26, 26, 26, 0.4);
+  border-bottom-color: rgba(255, 255, 255, 0.12);
+}

package/dist/dev/mp-weixin/components/PrismSecureInput/PrismSecureInput.js

@@ -0,0 +1,140 @@
+"use strict";
+const common_vendor = require("../../common/vendor.js");
+const store_app = require("../../store/app.js");
+const _sfc_main = {
+  __name: "PrismSecureInput",
+  props: {
+    modelValue: {
+      type: String,
+      default: ""
+    },
+    length: {
+      type: Number,
+      default: 6
+    },
+    title: {
+      type: String,
+      default: "请输入密码"
+    },
+    randomOrder: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: ["update:modelValue", "complete"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const appStore = store_app.useAppStore();
+    const passwordValue = common_vendor.ref(props.modelValue);
+    const isFocused = common_vendor.ref(false);
+    const showKeyboard = common_vendor.ref(false);
+    const displayNumbers = common_vendor.ref(["1", "2", "3", "4", "5", "6", "7", "8", "9", "0"]);
+    const passwordArray = common_vendor.computed(() => {
+      return passwordValue.value.split("").slice(0, props.length);
+    });
+    function shuffleNumbers() {
+      if (props.randomOrder) {
+        const arr = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"];
+        for (let i = arr.length - 1; i > 0; i--) {
+          const j = Math.floor(Math.random() * (i + 1));
+          [arr[i], arr[j]] = [arr[j], arr[i]];
+        }
+        displayNumbers.value = arr;
+      }
+    }
+    function showKeyboardModal() {
+      isFocused.value = true;
+      showKeyboard.value = true;
+      if (props.randomOrder) {
+        shuffleNumbers();
+      }
+    }
+    function hideKeyboard() {
+      isFocused.value = false;
+      showKeyboard.value = false;
+    }
+    function inputNumber(n) {
+      if (passwordValue.value.length >= props.length) return;
+      passwordValue.value += n;
+      emit("update:modelValue", passwordValue.value);
+      if (passwordValue.value.length === props.length) {
+        emit("complete", passwordValue.value);
+        setTimeout(() => {
+          hideKeyboard();
+        }, 200);
+      }
+    }
+    function deleteNumber() {
+      if (passwordValue.value.length > 0) {
+        passwordValue.value = passwordValue.value.slice(0, -1);
+        emit("update:modelValue", passwordValue.value);
+      }
+    }
+    function clearAll() {
+      passwordValue.value = "";
+      emit("update:modelValue", "");
+    }
+    common_vendor.watch(() => props.modelValue, (val) => {
+      passwordValue.value = val;
+    });
+    common_vendor.onMounted(() => {
+      if (props.randomOrder) {
+        shuffleNumbers();
+      }
+    });
+    return (_ctx, _cache) => {
+      return common_vendor.e({
+        a: common_vendor.f(__props.length, (i, k0, i0) => {
+          return common_vendor.e({
+            a: passwordArray.value[i - 1]
+          }, passwordArray.value[i - 1] ? {} : {}, {
+            b: isFocused.value && passwordArray.value.length === i - 1
+          }, isFocused.value && passwordArray.value.length === i - 1 ? {} : {}, {
+            c: i,
+            d: isFocused.value && passwordArray.value.length === i - 1 ? 1 : "",
+            e: passwordArray.value[i - 1] ? 1 : ""
+          });
+        }),
+        b: common_vendor.o(showKeyboardModal),
+        c: showKeyboard.value
+      }, showKeyboard.value ? {
+        d: common_vendor.t(__props.title),
+        e: common_vendor.o(hideKeyboard),
+        f: common_vendor.f(displayNumbers.value.slice(0, 3), (n, k0, i0) => {
+          return {
+            a: common_vendor.t(n),
+            b: n,
+            c: common_vendor.o(($event) => inputNumber(n), n)
+          };
+        }),
+        g: common_vendor.f(displayNumbers.value.slice(3, 6), (n, k0, i0) => {
+          return {
+            a: common_vendor.t(n),
+            b: n,
+            c: common_vendor.o(($event) => inputNumber(n), n)
+          };
+        }),
+        h: common_vendor.f(displayNumbers.value.slice(6, 9), (n, k0, i0) => {
+          return {
+            a: common_vendor.t(n),
+            b: n,
+            c: common_vendor.o(($event) => inputNumber(n), n)
+          };
+        }),
+        i: common_vendor.o(clearAll),
+        j: common_vendor.t(displayNumbers.value[9]),
+        k: common_vendor.o(($event) => inputNumber(displayNumbers.value[9])),
+        l: common_vendor.o(deleteNumber),
+        m: __props.randomOrder ? 1 : "",
+        n: common_vendor.o(() => {
+        }),
+        o: common_vendor.o(hideKeyboard)
+      } : {}, {
+        p: common_vendor.unref(appStore).isDarkMode ? 1 : ""
+      });
+    };
+  }
+};
+wx.createComponent(_sfc_main);
+//# sourceMappingURL=../../../.sourcemap/mp-weixin/components/PrismSecureInput/PrismSecureInput.js.map

package/dist/dev/mp-weixin/components/PrismSecureInput/PrismSecureInput.json

@@ -0,0 +1,4 @@
+{
+  "component": true,
+  "usingComponents": {}
+}