tree宽度修改

src/components/tree/index.vue

@@ -1,12 +1,12 @@
 <template>
-    <div :style="{ width: menuCollapse ? '40px' : '280px' }" style="transition: all .3s; overflow: hidden;" >
+    <div :style="{ width: menuCollapse ? '40px' : props.width }" style="transition: all 0.3s; overflow: hidden">
         <Icon
             v-show="menuCollapse"
             @click="onMenuCollapse"
             :name="menuCollapse ? 'el-icon-Expand' : 'el-icon-Fold'"
             :class="menuCollapse ? 'unfold' : ''"
             size="18"
-            class="fold ml10 mt20  menu-collapse"
+            class="fold ml10 mt20 menu-collapse"
             style="cursor: pointer"
         />
         <div class="cn-tree" :style="{ opacity: menuCollapse ? 0 : 1 }">
@@ -59,6 +59,13 @@ import { ref, watch } from 'vue'
 defineOptions({
     name: 'govern/tree'
 })
+interface Props {
+    width?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+    width: '280px'
+})
 const { proxy } = useCurrentInstance()
 const menuCollapse = ref(false)
 const filterText = ref('')
@@ -89,7 +96,7 @@ defineExpose({ treeRef })
     box-sizing: border-box;
     padding: 10px;
     height: 100%;
-    width: 280px;
+    width: 100%;
     :deep(.el-tree) {
         border: 1px solid var(--el-border-color);
     }