通知栏提交

package/document/src/document/zh-CN/components/noticeBar.md

@@ -0,0 +1,132 @@
+::: anchor
+:::
+
+::: title 基本介绍
+:::
+
+::: describe 全局展示操作反馈信息。
+:::
+
+::: title 基础使用
+:::
+
+::: demo
+
+<template>
+    <lay-notice-bar text="以写作为工具，为道途，先帮助自己一程，再以自己的领悟帮助他人一程, 这是一种服务 。" mode="link"></lay-notice-bar>
+</template>
+
+<script>
+import { layer } from "@layui/layer-vue"
+
+export default {
+  setup() {
+
+    return {
+    }
+  }
+}
+</script>
+
+:::
+
+::: title 使用图标
+:::
+
+::: demo
+
+<template>
+    <lay-notice-bar leftIcon="layui-icon-mute" text="最好的爱是两个人彼此做个伴，不要束缚，不要缠绕，不要占有，不渴望从对方那里得到，只是并肩站在一起，看看这个世界。"></lay-notice-bar>
+</template>
+
+<script>
+import { ref } from "vue"
+
+export default {
+  setup() {
+
+    return {
+    }
+  }
+}
+</script>
+
+:::
+
+::: title 允许关闭
+:::
+
+::: demo
+
+<template>
+    <lay-notice-bar leftIcon="layui-icon-mute" rightIcon="layui-icon-close" text="所有发生过的都是既定的。是应该发生。只能发生。" mode="closeable" background="#ecf5ff"	></lay-notice-bar>
+</template>
+
+<script>
+import { ref } from "vue"
+
+export default {
+  setup() {
+
+    const visible = ref(true);
+
+    return {
+        visible
+    }
+  }
+}
+</script>
+
+:::
+
+::: title 垂直滚动
+:::
+
+::: demo
+<template>
+    <lay-notice-bar   :scrollable="true" leftIcon="layui-icon-mute" :textlist="list"   >
+    </lay-notice-bar>
+</template>
+
+<script>
+import { ref,reactive } from "vue"
+
+export default {
+  setup() {
+
+    const   list = reactive([
+      { id: '1', text: '条目一' },
+      { id: '2', text: '条目二' },
+      { id: '3', text: '条目三' },
+      { id: '4', text: '条目四' },
+    ])
+    return {
+       
+        list,
+        
+    }
+  }
+}
+</script>
+
+:::
+
+::: title Notice Bar 属性
+:::
+
+::: table
+
+| 事件 | 描述     | 参数                  |
+| ---- | -------- | --------------------- |
+| mode | 模式 | 'link' 'closeable' |
+| text | 内容 | 滚动内容 |
+| leftIcon | 左侧图标 | -- |
+| rightIcon | 右侧图标 | -- |
+| scrollable | 是否开启垂直滚动|true,false|
+|  textlist  | 垂直滚动内容| Array|
+:::
+
+ 
+
+::: previousNext transfer
+:::

package/document/src/router/zh-CN.ts

@@ -382,6 +382,11 @@ const zhCN = [
             component: () => import("../document/zh-CN/components/ripple.md"),
             meta: { title: "水波纹" },
           },
+          {
+            path: "/zh-CN/components/noticeBar",
+            component: () => import("../document/zh-CN/components/noticeBar.md"),
+            meta: { title: "通告栏" },
+          },
         ],
       },
     ],

package/document/src/view/utils/menus.ts

@@ -351,6 +351,12 @@ const menus = [
         subTitle: "scroll",
         path: "/zh-CN/components/scroll",
       },
+      {
+        id: 114,
+        title: "通告栏",
+        subTitle: "noticeBar",
+        path: "/zh-CN/components/noticeBar",
+      },
     ],
   },
   {