@dckj-npm/dc-material 0.1.127 → 0.1.129

package/es/components/notice-bar/notice-bar-item.scss

@@ -1,26 +1,26 @@
-.notice-bar__panel__item {
-    width: calc(100vw - 110px);
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    margin-bottom: 5px;
-    .notice-bar__panel__item-left {
-        display: flex;
-        align-items: center;
-        .notice-bar__panal__item__content{
-          color: #676767;
-          font-size: 12px;
-          width: 160px;
-          overflow: hidden;
-          text-overflow: ellipsis;
-          white-space: nowrap;
-          margin-left: 4px;
-        }
-    }
-    .notice-bar__panel__item-releaseTime {
-         color: #676767;
-         font-size: 11px;
-         opacity: 0.5;
-    }
-
-}
+.notice-bar__panel__item {
+    width: calc(100vw - 110px);
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    margin-bottom: 5px;
+    .notice-bar__panel__item-left {
+        display: flex;
+        align-items: center;
+        .notice-bar__panal__item__content{
+          color: #676767;
+          font-size: 12px;
+          width: 160px;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+          margin-left: 4px;
+        }
+    }
+    .notice-bar__panel__item-releaseTime {
+         color: #676767;
+         font-size: 11px;
+         opacity: 0.5;
+    }
+
+}

package/es/components/notice-bar/notice-bar.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
 var _excluded = ["dataList", "onClick", "icon", "children"];
-import React from 'react';
+import React, { useRef, useState, useEffect } from 'react';
 import "./index.scss";
 import NoticeBarItem from "./notice-bar-item";
 var NoticeBar = function NoticeBar(_ref) {
@@ -12,13 +12,45 @@ var NoticeBar = function NoticeBar(_ref) {
     children = _ref.children,
     otherProps = _objectWithoutPropertiesLoose(_ref, _excluded);
   var _otherProps = otherProps || {};
-  var stickyItems = (dataList || []).filter(function (item) {
-    return (item === null || item === void 0 ? void 0 : item.isTop) === 1;
+  //   const stickyItems = (dataList || []).filter((item) => item?.isTop === 1)
+  //   const loopItems = (dataList || []).filter((item) => item?.isTop === 0)
+
+  var _useState = useState(true),
+    play = _useState[0],
+    setPlay = _useState[1];
+  var _useState2 = useState([]),
+    loopItems = _useState2[0],
+    setLoopItems = _useState2[1];
+  var intervalId = useRef(null);
+  useEffect(function () {
+    var stickyItems = dataList.filter(function (item) {
+      return item.isTop === 1;
+    });
+    setLoopItems(dataList.filter(function (item) {
+      return item.isTop === 1;
+    }));
+    var startPlay = function startPlay() {
+      if (play) {
+        setLoopItems(function (prev) {
+          var newItems = [].concat(prev);
+          newItems.push(newItems[0]);
+          newItems.shift();
+          return newItems;
+        });
+        setPlay(false);
+      }
+    };
+    intervalId.current = setInterval(startPlay, 2000);
+    return function () {
+      clearInterval(intervalId.current);
+    };
+  }, [dataList, play]);
+  var isScroll = function isScroll(index) {
+    return index === 0;
+  };
+  var stickyItems = dataList.filter(function (item) {
+    return item.isTop === 1;
   });
-  var loopItems = (dataList || []).filter(function (item) {
-    return (item === null || item === void 0 ? void 0 : item.isTop) === 0;
-  });
-  var loopItemsData = console.log('loopItemsData');
   return /*#__PURE__*/React.createElement("div", _extends({
     className: "notice-bar__panel"
   }, _otherProps), /*#__PURE__*/React.createElement("img", {
@@ -33,15 +65,19 @@ var NoticeBar = function NoticeBar(_ref) {
       onClick: onClick,
       children: children
     }, item));
-  }) : /*#__PURE__*/React.createElement("div", null), /*#__PURE__*/React.createElement("div", {
-    className: "notice-bar__panel__item-loop"
-  }, /*#__PURE__*/React.createElement("div", null, loopItems.length > 0 ? loopItems.map(function (item, index) {
-    return /*#__PURE__*/React.createElement(NoticeBarItem, _extends({
+  }) : /*#__PURE__*/React.createElement("div", null), loopItems.length > 0 ? /*#__PURE__*/React.createElement("div", {
+    className: "notice-bar__panel-loop"
+  }, loopItems.map(function (item, index) {
+    return /*#__PURE__*/React.createElement(NoticeBarItem, {
       key: index,
-      onClick: onClick,
-      children: children
-    }, item));
-  }) : /*#__PURE__*/React.createElement("div", null, "No items to display")))));
+      className: "notice-bar__panel-loop__item " + (isScroll(index) && play ? 'toUp' : ''),
+      content: item.content,
+      releaseTime: item.releaseTime,
+      isTop: item.isTop,
+      tag: item.tag,
+      onClick: onClick
+    });
+  })) : /*#__PURE__*/React.createElement("div", null, "\u6682\u65E0\u6570\u636E")));
 };
 NoticeBar.displayName = 'NoticeBar';
 export default NoticeBar;

package/es/components/position/index.scss

@@ -1,27 +1,27 @@
-.location {
-  display: flex;
-  cursor: pointer;
-  color: #414141;
-  font-size: 13.5px;
-  &-address {
-    margin-right: 7px;
-  }
-  &-icon {
-    display: flex;
-    align-items: center;
-  }
-}
-.location-list {
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 100vw;
-  height: 100vh;
-  background-color: #fff;
-  padding: 10px 15px;
-  z-index: 999;
-  &-item {
-    padding: 10px 0;
-    border-bottom: solid 1px #eee;
-  }
-}
+.location {
+  display: flex;
+  cursor: pointer;
+  color: #414141;
+  font-size: 13.5px;
+  &-address {
+    margin-right: 7px;
+  }
+  &-icon {
+    display: flex;
+    align-items: center;
+  }
+}
+.location-list {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100vw;
+  height: 100vh;
+  background-color: #fff;
+  padding: 10px 15px;
+  z-index: 999;
+  &-item {
+    padding: 10px 0;
+    border-bottom: solid 1px #eee;
+  }
+}

package/es/components/position/position-list.js

@@ -3,6 +3,7 @@ import "./index.scss";
 var ContentList = function navigationList(_ref) {
   var open = _ref.open,
     itemArray = _ref.itemArray,
+    currentLocation = _ref.currentLocation,
     setIsOpen = _ref.setIsOpen,
     setCurrent = _ref.setCurrent;
   var changeHandle = function changeHandle(position) {
@@ -17,13 +18,13 @@ var ContentList = function navigationList(_ref) {
     style: {
       display: open ? 'block' : 'none'
     }
-  }, itemArray ? itemArray.map(function (item) {
+  }, itemArray.map(function (item) {
     return /*#__PURE__*/React.createElement("div", {
       onClick: function onClick() {
         return changeHandle(item);
       },
       className: "location-list-item"
     }, item.address);
-  }) : /*#__PURE__*/React.createElement("div", null, "\u6682\u65E0\u6570\u636E"));
+  }));
 };
 export default ContentList;

package/es/components/radio-group/index.js

@@ -1,5 +1,5 @@
-/**
- * 单选按钮组
+/**
+ * 单选按钮组
  */
 
 import RadioGroup from "./radio-group";

package/es/components/radio-group/index.scss

@@ -1,40 +1,40 @@
-@import '../../variables.scss';
-
-.radio-group__panel {
-  display: flex;
-  gap: 12px;
-  width: 100%;
-
-  .radio-group-item__button {
-    flex: 0 0 auto;
-    transition-property: all;
-    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-    transition-duration: 250ms;
-    font-size: 12px;
-    padding: 5px 11px;
-    border-radius: 25rem;
-  }
-
-  .radio-group-item__text {
-    flex: 0 0 auto;
-    transition-property: all;
-    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-    transition-duration: 250ms;
-    font-size: 12px;
-    padding: 5px 0;
-
-    .radio-group-item__text__line {
-      width: 100%;
-      height: 1px;
-      right: 0;
-      left: 0;
-      bottom: 0;
-      position: absolute;
-    }
-
-  }
-
-
-}
-
-
+@import '../../variables.scss';
+
+.radio-group__panel {
+  display: flex;
+  gap: 12px;
+  width: 100%;
+
+  .radio-group-item__button {
+    flex: 0 0 auto;
+    transition-property: all;
+    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+    transition-duration: 250ms;
+    font-size: 12px;
+    padding: 5px 11px;
+    border-radius: 25rem;
+  }
+
+  .radio-group-item__text {
+    flex: 0 0 auto;
+    transition-property: all;
+    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+    transition-duration: 250ms;
+    font-size: 12px;
+    padding: 5px 0;
+
+    .radio-group-item__text__line {
+      width: 100%;
+      height: 1px;
+      right: 0;
+      left: 0;
+      bottom: 0;
+      position: absolute;
+    }
+
+  }
+
+
+}
+
+

package/es/components/rich-text/index.js

@@ -1,5 +1,5 @@
-/**
- * 富文本
+/**
+ * 富文本
  */
 
 import RichText from "./rich-text";

package/es/components/rich-text/index.scss

@@ -1,19 +1,19 @@
-.rich-text {
-  width: 100%;
-  display: flex;
-  flex-direction: column;
-  padding: 0; /* 添加内边距 */
-  margin: 0; /* 去除外边距 */
-  word-break: break-word; /* 处理长单词换行 */
-  overflow-wrap: break-word; /* 支持长单词换行 */
-  overflow: hidden; /* 隐藏超出部分 */
-}
-p {
-  padding: 0;
-  margin: 0 0 20px 0 !important;
-}
-img {
-  max-width: 100%;
-  height: auto; /* 保持纵横比 */
-  object-fit: contain; /* 确保图片保持在容器内 */
-}
+.rich-text {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  padding: 0; /* 添加内边距 */
+  margin: 0; /* 去除外边距 */
+  word-break: break-word; /* 处理长单词换行 */
+  overflow-wrap: break-word; /* 支持长单词换行 */
+  overflow: hidden; /* 隐藏超出部分 */
+}
+p {
+  padding: 0;
+  margin: 0 0 20px 0 !important;
+}
+img {
+  max-width: 100%;
+  height: auto; /* 保持纵横比 */
+  object-fit: contain; /* 确保图片保持在容器内 */
+}

package/es/components/search-bar/index.scss

@@ -1,14 +1,13 @@
-.search-bar-box {
-  //width: 260px;
-  height: 35px;
-  margin: 0;
-  flex: 1;
-    .next-input {
-      width: 100%;
-      border-radius: 34px;
-      height: 35px;
-      & input {
-        height: 100%;
-      }
-    }
-}
+.search-bar-box {
+  width: 260px;
+  height: 35px;
+  margin: 0;
+    .next-input {
+      width: 260px;
+      border-radius: 34px;
+      height: 35px;
+      & input {
+        height: 100%;
+      }
+    }
+}

package/es/components/swiper/index.scss

@@ -1,33 +1,12 @@
-.carousel {
-  position: relative;
-  overflow: hidden;
-  width: 100%;
-  margin: 0;
-}
-.carousel__wrapper {
-  display: flex;
-}
-.carousel__slide {
-  min-width: 100%;
-  transition: transform ease-in-out;
-}
-.carousel__slide img {
-  width: 100%;
-  height: auto;
-}
-.carousel__button {
-  position: absolute;
-  top: 50%;
-  transform: translateY(-50%);
-  background: rgba(0, 0, 0, 0.5);
-  color: white;
-  border: none;
-  padding: 10px;
-  cursor: pointer;
-}
-.carousel__button--prev {
-  left: 10px;
-}
-.carousel__button--next {
-  right: 10px;
-}
+/* write style here */
+.swiper__container {
+  margin: 0;
+  &__sliede {
+    position: relative;
+    height: 100%;
+  }
+}
+.img{
+  width: 100%;
+  height: 100%;
+}

package/es/components/swiper/swiper.js

@@ -1,77 +1,34 @@
 import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
-var _excluded = ["speed", "autoplay", "loop", "picUrls", "height"];
 import * as React from 'react';
-import { useEffect, useRef, useState } from 'react';
+import { Image } from '@alilc/lowcode-materials';
+import { Swiper, SwiperSlide } from 'swiper/react';
+import SwiperCore, { Autoplay } from 'swiper/core'; // 引入核心插件和自动播放组件
+SwiperCore.use([Autoplay]); // 使用插件，插件名放入[]中，这一行是重点
 import "./index.scss";
-var DCSlider = function DCSlider(_ref) {
-  var _ref$speed = _ref.speed,
-    speed = _ref$speed === void 0 ? 500 : _ref$speed,
-    autoplay = _ref.autoplay,
-    loop = _ref.loop,
-    _ref$picUrls = _ref.picUrls,
-    picUrls = _ref$picUrls === void 0 ? [] : _ref$picUrls,
-    height = _ref.height,
-    otherProps = _objectWithoutPropertiesLoose(_ref, _excluded);
-  var _useState = useState(0),
-    currentIndex = _useState[0],
-    setCurrentIndex = _useState[1];
-  var autoplayRef = useRef(null);
-  var nextSlide = function nextSlide() {
-    if (currentIndex < picUrls.length - 1) {
-      setCurrentIndex(currentIndex + 1);
-    } else if (loop) {
-      setCurrentIndex(0);
-    }
-  };
-  var startAutoplay = function startAutoplay() {
-    if (autoplay && !autoplayRef.current) {
-      autoplayRef.current = setInterval(nextSlide, speed);
-    }
-  };
-  var stopAutoplay = function stopAutoplay() {
-    if (autoplayRef.current) {
-      clearInterval(autoplayRef.current);
-      autoplayRef.current = null;
-    }
-  };
-  useEffect(function () {
-    if (autoplay) {
-      startAutoplay();
-    }
-    return function () {
-      stopAutoplay();
-    };
-  }, [autoplay, speed, loop, picUrls]);
-  return /*#__PURE__*/React.createElement("div", _extends({
-    className: "carousel",
-    onMouseEnter: stopAutoplay,
-    onMouseLeave: startAutoplay,
+import 'swiper/swiper.min.css';
+var DCSlider = function DCSlider(props) {
+  var height = props.height;
+  return /*#__PURE__*/React.createElement(Swiper, _extends({}, props, {
+    className: "swiper__container",
     style: {
       height: height ? height + "px" : '100%'
     }
-  }, otherProps), /*#__PURE__*/React.createElement("div", {
-    className: "carousel__wrapper",
-    style: {
-      transform: "translateX(-" + currentIndex * 100 + "%)",
-      transitionDuration: speed + "ms"
-    }
-  }, picUrls.map(function (url, index) {
-    return /*#__PURE__*/React.createElement("div", {
-      key: index,
-      className: "carousel__slide",
+  }), props.picUrls && props.picUrls.length > 0 ? props.picUrls.map(function (url, index) {
+    return /*#__PURE__*/React.createElement(SwiperSlide, {
+      className: "swiper__container__sliede",
       style: {
         width: '100%',
         height: height ? height + "px" : '100%'
       }
-    }, /*#__PURE__*/React.createElement("img", {
+    }, /*#__PURE__*/React.createElement(Image, {
       src: url,
-      alt: "Slide " + index,
+      alt: "Slide",
+      key: index,
       style: {
         width: '100%',
         height: height ? height + "px" : '100%'
       }
     }));
-  })));
+  }) : /*#__PURE__*/React.createElement("div", null, "\u56FE\u7247\u4E3A\u7A7A"));
 };
 export default DCSlider;

package/es/components/tab/index.js

@@ -1,5 +1,5 @@
-/**
- * 标签tag
+/**
+ * 标签tag
  */
 import Tab from "./tab";
 export default Tab;

package/es/components/tab/index.scss

@@ -1,39 +1,39 @@
-.tabs__container {
-  display: inline-block;
-  padding: 5px 17px;
-  border-radius: 19px;
-  background-color: #FFFFFF;
-  color: #666666;
-  font-size: 15px;
-  cursor: pointer;
-  margin-right: 6px;
-  letter-spacing: 2px;
-  position: relative;
-  &--selected {
-    background-color: #ED794A;
-    color: #FFFFFF;
-  }
-  &--small {
-    padding: 5px 16px;
-    border-radius: 19px;
-  }
-  &--large {
-    padding: 14px 30px;
-    border-radius: 28px;
-  }
-  .badge {
-    display: flex;
-    padding: 2px 4px;
-    border-radius: 8px;
-    background-color: #F44341; // 红色背景
-    color: white; // 字体颜色
-    // text-align: center;
-    letter-spacing: 0;
-    justify-content: center;
-    line-height: normal; // 垂直居中
-    font-size: 10px; // 根据需要调整字体大小
-    position: absolute; // 绝对定位
-    top: 0; // 根据需要调整位置
-    right: 3px; // 根据需要调整位置
-  }
-}
+.tabs__container {
+  display: inline-block;
+  padding: 5px 17px;
+  border-radius: 19px;
+  background-color: #FFFFFF;
+  color: #666666;
+  font-size: 15px;
+  cursor: pointer;
+  margin-right: 6px;
+  letter-spacing: 2px;
+  position: relative;
+  &--selected {
+    background-color: #ED794A;
+    color: #FFFFFF;
+  }
+  &--small {
+    padding: 5px 16px;
+    border-radius: 19px;
+  }
+  &--large {
+    padding: 14px 30px;
+    border-radius: 28px;
+  }
+  .badge {
+    display: flex;
+    padding: 2px 4px;
+    border-radius: 8px;
+    background-color: #F44341; // 红色背景
+    color: white; // 字体颜色
+    // text-align: center;
+    letter-spacing: 0;
+    justify-content: center;
+    line-height: normal; // 垂直居中
+    font-size: 10px; // 根据需要调整字体大小
+    position: absolute; // 绝对定位
+    top: 0; // 根据需要调整位置
+    right: 3px; // 根据需要调整位置
+  }
+}