更新：登录功能

uni_modules/wot-design-uni/components/wd-sidebar/index.scss

@@ -0,0 +1,25 @@
+@import '../common/abstracts/variable';
+@import '../common/abstracts/mixin';
+
+.wot-theme-dark {
+  @include b(sidebar) {
+    background: $-dark-background;
+    @include e(padding){
+      background: $-dark-background2;
+    }
+  }
+}
+
+@include b(sidebar) {
+  display: flex;
+  flex-direction: column;
+  overflow-y: auto;
+  width: $-sidebar-width;
+  height: $-sidebar-height;
+  background: $-color-white;
+  
+  @include e(padding){
+    flex: 1 1 auto;
+    background: $-sidebar-bg;
+  }
+}

uni_modules/wot-design-uni/components/wd-sidebar/types.ts

@@ -0,0 +1,47 @@
+/*
+ * @Author: weisheng
+ * @Date: 2024-01-05 18:03:27
+ * @LastEditTime: 2024-11-18 23:27:55
+ * @LastEditors: weisheng
+ * @Description:
+ * @FilePath: /wot-design-uni/src/uni_modules/wot-design-uni/components/wd-sidebar/types.ts
+ * 记得注释
+ */
+import { type ExtractPropTypes, type InjectionKey, type PropType } from 'vue'
+import { baseProps, makeNumericProp } from '../common/props'
+
+export type SidebarProvide = {
+  props: Partial<SidebarProps>
+  setChange: (value: number | string, label: string) => void
+}
+
+export const SIDEBAR_KEY: InjectionKey<SidebarProvide> = Symbol('wd-sidebar')
+
+/**
+ * Sidebar切换前的选项接口
+ */
+export type SidebarBeforeChangeOption = {
+  // 目标值
+  value: number | string
+  resolve: (pass: boolean) => void
+}
+
+/**
+ * Sidebar切换前的钩子函数类型
+ * @param option 切换选项
+ */
+export type SidebarBeforeChange = (option: SidebarBeforeChangeOption) => void
+
+export const sidebarProps = {
+  ...baseProps,
+  /**
+   * 当前导航项的索引
+   */
+  modelValue: makeNumericProp(0),
+  /**
+   * 在改变前执行的函数
+   */
+  beforeChange: Function as PropType<SidebarBeforeChange>
+}
+
+export type SidebarProps = ExtractPropTypes<typeof sidebarProps>

uni_modules/wot-design-uni/components/wd-sidebar/wd-sidebar.vue

@@ -0,0 +1,63 @@
+<template>
+  <view :class="`wd-sidebar ${customClass}`" :style="customStyle">
+    <slot></slot>
+    <view class="wd-sidebar__padding"></view>
+  </view>
+</template>
+
+<script lang="ts">
+export default {
+  name: 'wd-sidebar',
+  options: {
+    addGlobalClass: true,
+    virtualHost: true,
+    styleIsolation: 'shared'
+  }
+}
+</script>
+
+<script lang="ts" setup>
+import { isFunction } from '../common/util'
+import { useChildren } from '../composables/useChildren'
+import { SIDEBAR_KEY, sidebarProps } from './types'
+
+const props = defineProps(sidebarProps)
+const emit = defineEmits(['change', 'update:modelValue'])
+
+const { linkChildren } = useChildren(SIDEBAR_KEY)
+linkChildren({ props, setChange })
+
+/**
+ * 子项状态变更
+ * @param value 目标值
+ * @param label 目标值标题
+ */
+function setChange(value: number | string, label: string) {
+  if (isFunction(props.beforeChange)) {
+    props.beforeChange({
+      value: value,
+      resolve: (pass: boolean) => {
+        if (pass) {
+          updateValue(value, label)
+        }
+      }
+    })
+  } else {
+    updateValue(value, label)
+  }
+}
+
+/**
+ * 更新选中状态
+ * @param value 目标值
+ * @param label 目标值标题
+ */
+function updateValue(value: number | string, label: string) {
+  emit('update:modelValue', value)
+  emit('change', { value, label })
+}
+</script>
+
+<style lang="scss" scoped>
+@import './index.scss';
+</style>