docs: 更新文档

example/docs/zh-CN/components/switch.md

@@ -182,8 +182,10 @@ export default {
 | name          | 原生 name 属性 | --             |
 | v-model       | 是否启用       | `true` `false` |
 | disabled      | 禁用           | `true` `false` |
-| active-text   | 启用描述       | `启动`         |
+| onswitch-text | 启用描述       | `启动`        |
-| inactive-text | 禁用描述       | `禁用`         |
+| unswitch-text | 禁用描述       | `禁用`         |
+| onswitch-value | 启用值       | `true`        |
+| unswitch-value | 禁用值       | `false`         |
 
 :::
 
@@ -199,6 +201,16 @@ export default {
 :::
 
  
+::: title Switch 插槽
+:::
+
+::: table
+
+| 属性   | 描述     | 参数           |
+| ------ | -------- | ---------------- |
+| onswitch-icon | 启用图标 | -- |
+| unswitch-icon | 禁用图标 | -- |
+:::
 
 ::: previousNext switch
 :::

example/docs/zh-CN/guide/changelog.md

@@ -14,7 +14,7 @@
     <ul> 
       <a name="0-4-5"> </a> 
       <li> 
-        <h3>0.4.5 <span class="layui-badge-rim">2022-03-29</span></h3> 
+        <h3>0.4.5 <span class="layui-badge-rim">2022-04-01</span></h3> 
         <ul>
           <li>[新增] switch 组件 onswitch-value 属性。</li>
           <li>[新增] switch 组件 unswitch-value 属性。</li>
@@ -23,6 +23,7 @@
           <li>[修复] upload 组件 number 属性必填警告。</li>
           <li>[修复] variable 全局变量重复导入的问题。</li>
           <li>[修复] menu 组件 openKeys 属性失效。</li>
+          <li>[支持] animation 点击演示。</li>
           <li>[支持] icon 列表复制。</li>
           <li>[支持] 夜间模式。</li>
         </ul> 
@@ -31,7 +32,7 @@
     <ul> 
       <a name="0-4-4"> </a> 
       <li> 
-        <h3>0.4.5 <span class="layui-badge-rim">2022-04-01</span></h3> 
+        <h3>0.4.4 <span class="layui-badge-rim">2022-03-29</span></h3> 
         <ul>
           <li>[新增] button 组件 prefix-icon 属性。</li>
           <li>[新增] button 组件 suffix-icon 属性。</li>

example/docs/zh-CN/guide/dark.md

@@ -1,10 +1,13 @@
 ::: title 夜间模式
 :::
 
-::: describe 默认情况下, 网站主题为日间模式。若需启用深夜模式, 使用 config-provider 组件。
+::: describe 默认情况下, 网站主题为日间模式。
 :::
 
-```
+::: describe 若启用夜间模式, 使用 "全局配置" 组件配合 theme 属性, 设置为 `dark` 值。
+:::
+
+```vue
 <template>
     <lay-config-provider :theme="theme">
         <App />

src/component/datePicker/index.vue

@@ -8,29 +8,38 @@
       </lay-input>
       <template #content>
         <!-- 日期选择 -->
-        <div class="layui-laydate" v-show="showPane === 'date' || showPane === 'datetime'">
+        <div
+          class="layui-laydate"
+          v-show="showPane === 'date' || showPane === 'datetime'"
+        >
           <div class="layui-laydate-main laydate-main-list-0">
             <div class="layui-laydate-header">
               <i
                 class="layui-icon laydate-icon laydate-prev-y"
                 @click="changeYearOrMonth('year', -1)"
-              ></i>
+                ></i
+              >
               <i
                 class="layui-icon laydate-icon laydate-prev-m"
                 @click="changeYearOrMonth('month', -1)"
-              ></i>
+                ></i
+              >
               <div class="laydate-set-ym">
                 <span @click="showYearPanel">{{ currentYear }} 年</span>
-                <span @click="showPane = 'month'">{{ currentMonth + 1 }} 月</span>
+                <span @click="showPane = 'month'"
+                  >{{ currentMonth + 1 }} 月</span
+                >
               </div>
               <i
                 class="layui-icon laydate-icon laydate-next-m"
                 @click="changeYearOrMonth('month', 1)"
-              ></i>
+                ></i
+              >
               <i
                 class="layui-icon laydate-icon laydate-next-y"
                 @click="changeYearOrMonth('year', 1)"
-              ></i>
+                ></i
+              >
             </div>
             <div class="layui-laydate-content">
               <table>
@@ -59,7 +68,9 @@
                           'layui-this': item.value === currentDay,
                         }"
                         @click="handleDayClick(item)"
-                      >{{ item.day }}</td>
+                      >
+                        {{ item.day }}
+                      </td>
                     </tr>
                   </template>
                 </tbody>
@@ -71,11 +82,18 @@
               v-if="type === 'datetime'"
               @click="showPane = 'time'"
               class="laydate-btns-time"
-            >选择时间</span>
+              >选择时间</span
+            >
             <div class="laydate-footer-btns">
-              <span lay-type="clear" class="laydate-btns-clear" @click="clear">清空</span>
+              <span lay-type="clear" class="laydate-btns-clear" @click="clear"
-              <span lay-type="now" class="laydate-btns-now" @click="now">现在</span>
+                >清空</span
-              <span lay-type="confirm" class="laydate-btns-confirm" @click="ok">确定</span>
+              >
+              <span lay-type="now" class="laydate-btns-now" @click="now"
+                >现在</span
+              >
+              <span lay-type="confirm" class="laydate-btns-confirm" @click="ok"
+                >确定</span
+              >
             </div>
           </div>
         </div>
@@ -88,14 +106,19 @@
                 <span class="laydate-time-text">选择年份</span>
               </div>
             </div>
-            <div class="layui-laydate-content" style="height: 220px; overflow-y: auto">
+            <div
+              class="layui-laydate-content"
+              style="height: 220px; overflow-y: auto"
+            >
               <ul class="layui-laydate-list laydate-year-list">
                 <li
                   v-for="item of yearList"
                   :key="item"
                   :class="[{ 'layui-this': currentYear === item }]"
                   @click="handleYearClick(item)"
-                >{{ item }}</li>
+                >
+                  {{ item }}
+                </li>
               </ul>
             </div>
           </div>
@@ -104,11 +127,18 @@
               class="layui-laydate-preview"
               title="当前选中的结果"
               style="color: rgb(102, 102, 102)"
-            >2022</span>
+              >2022</span
+            >
             <div class="laydate-footer-btns">
-              <span lay-type="clear" class="laydate-btns-clear" @click="clear">清空</span>
+              <span lay-type="clear" class="laydate-btns-clear" @click="clear"
-              <span lay-type="now" class="laydate-btns-now" @click="now">现在</span>
+                >清空</span
-              <span lay-type="confirm" class="laydate-btns-confirm" @click="ok">确定</span>
+              >
+              <span lay-type="now" class="laydate-btns-now" @click="now"
+                >现在</span
+              >
+              <span lay-type="confirm" class="laydate-btns-confirm" @click="ok"
+                >确定</span
+              >
             </div>
           </div>
         </div>
@@ -120,18 +150,23 @@
               <i
                 class="layui-icon laydate-icon laydate-prev-y"
                 @click="changeYearOrMonth('year', -1)"
-              ></i>
+                ></i
+              >
               <div class="laydate-set-ym">
                 <span
                   @click="showYearPanel"
                   v-if="showPane === 'date' || showPane === 'datetime'"
-                >{{ currentYear }} 年</span>
+                  >{{ currentYear }} 年</span
-                <span @click="showPane = 'month'">{{ currentMonth + 1 }} 月</span>
+                >
+                <span @click="showPane = 'month'"
+                  >{{ currentMonth + 1 }} 月</span
+                >
               </div>
               <i
                 class="layui-icon laydate-icon laydate-next-y"
                 @click="changeYearOrMonth('year', 1)"
-              ></i>
+                ></i
+              >
             </div>
             <div class="layui-laydate-content" style="height: 220px">
               <ul class="layui-laydate-list laydate-month-list">
@@ -142,7 +177,9 @@
                     { 'layui-this': MONTH_NAME.indexOf(item) === currentMonth },
                   ]"
                   @click="handleMonthClick(item)"
-                >{{ item.slice(0, 3) }}</li>
+                >
+                  {{ item.slice(0, 3) }}
+                </li>
               </ul>
             </div>
           </div>
@@ -151,11 +188,18 @@
               class="layui-laydate-preview"
               title="当前选中的结果"
               style="color: rgb(102, 102, 102)"
-            >2022-03</span>
+              >2022-03</span
+            >
             <div class="laydate-footer-btns">
-              <span lay-type="clear" class="laydate-btns-clear" @click="clear">清空</span>
+              <span lay-type="clear" class="laydate-btns-clear" @click="clear"
-              <span lay-type="now" class="laydate-btns-now" @click="now">现在</span>
+                >清空</span
-              <span lay-type="confirm" class="laydate-btns-confirm" @click="ok">确定</span>
+              >
+              <span lay-type="now" class="laydate-btns-now" @click="now"
+                >现在</span
+              >
+              <span lay-type="confirm" class="laydate-btns-confirm" @click="ok"
+                >确定</span
+              >
             </div>
           </div>
         </div>
@@ -184,18 +228,28 @@
                           ? 'layui-this'
                           : '',
                       ]"
-                    >{{ index.toString().padStart(2, "0") }}</li>
+                    >
+                      {{ index.toString().padStart(2, "0") }}
+                    </li>
                   </ol>
                 </li>
               </ul>
             </div>
           </div>
           <div class="layui-laydate-footer">
-            <span @click="showPane = 'date'" class="laydate-btns-time">返回日期</span>
+            <span @click="showPane = 'date'" class="laydate-btns-time"
+              >返回日期</span
+            >
             <div class="laydate-footer-btns">
-              <span lay-type="clear" class="laydate-btns-clear" @click="clear">清空</span>
+              <span lay-type="clear" class="laydate-btns-clear" @click="clear"
-              <span lay-type="now" class="laydate-btns-now" @click="now">现在</span>
+                >清空</span
-              <span lay-type="confirm" class="laydate-btns-confirm" @click="ok">确定</span>
+              >
+              <span lay-type="now" class="laydate-btns-now" @click="now"
+                >现在</span
+              >
+              <span lay-type="confirm" class="laydate-btns-confirm" @click="ok"
+                >确定</span
+              >
             </div>
           </div>
         </div>
@@ -267,12 +321,12 @@ watch(
 );
 // 格式化
 const fmtMap = {
-  date: 'YYYY-MM-DD',
+  date: "YYYY-MM-DD",
-  datetime: 'YYYY-MM-DD hh:mm:ss',
+  datetime: "YYYY-MM-DD hh:mm:ss",
-  year: 'YYYY',
+  year: "YYYY",
-  month: 'MM',
+  month: "MM",
-  '': '',
+  "": "",
-}
+};
 // 计算结果日期
 const dateValue = computed<string>(() => {
   if (currentDay.value === -1) {
@@ -280,10 +334,9 @@ const dateValue = computed<string>(() => {
     return "";
   }
   let momentVal;
-  let momentObj = moment(props.modelValue || currentDay.value)
+  let momentObj = moment(props.modelValue || currentDay.value);
-  momentVal = momentObj.format(fmtMap[props.type])
+  momentVal = momentObj.format(fmtMap[props.type]);
-  if (momentVal != props.modelValue)
+  if (momentVal != props.modelValue) $emits("update:modelValue", momentVal);
-    $emits("update:modelValue", momentVal);
   return momentVal;
 });
 

src/component/switch/index.vue

@@ -32,7 +32,7 @@ const isActive = computed({
     return props.modelValue === props.onswitchValue;
   },
   set(val) {
-    if(val) {
+    if (val) {
       emit("change", props.onswitchValue);
       emit("update:modelValue", props.onswitchValue);
     } else {