feat:通用样式加入devStyle

src/components/devStyle/components/RadioPage/index.vue

+<script setup lang="ts">
+import { ElRadioGroup, ElRadioButton, ElRow, ElCol } from 'element-plus';
+import { ref } from 'vue';
+import '@/styles/radio.scss';
+
+const radio = ref(1)
+const span = 12
+</script>
+
+<template>
+    <el-row>
+        <el-col :span="span">
+            <pre>
+{{ `import '@/styles/radio.scss';
+<template>
+    <el-radio-group class="radio-group-as-gap-btn">
+    </el-radio-group>
+</template>
+`}}
+</pre>
+            <el-radio-group v-model="radio" class="radio-group-as-gap-btn">
+                <el-radio-button :value="1">选项1</el-radio-button>
+                <el-radio-button :value="2">选项2</el-radio-button>
+                <el-radio-button :value="3">选项3</el-radio-button>
+            </el-radio-group>
+        </el-col>
+    </el-row>
+</template>
+
+<style lang="scss" scoped></style>
\ No newline at end of file

src/components/devStyle/components/TabsPage/index.vue

+<script setup lang="ts">
+import { ElTabs, ElTabPane, ElSpace, ElRow, ElCol } from 'element-plus';
+import { ref } from 'vue';
+import '@/styles/tabs.scss'
+const span = 12
+</script>
+
+<template>
+    <el-row>
+        <el-col :span="span">
+            <pre>
+{{ `import '@/styles/tabs.scss';
+<template>
+    <el-tabs stretch class="tabs-header-as-card tabs-nav-no-wrap tabs-bar-as-btn">
+    </el-tabs>
+</template>
+`}}
+</pre>
+            <el-tabs stretch class="tabs-header-as-card tabs-nav-no-wrap tabs-bar-as-btn">
+                <el-tab-pane label="tab1">tab1</el-tab-pane>
+                <el-tab-pane label="tab2">tab2</el-tab-pane>
+                <el-tab-pane label="tab3">tab3</el-tab-pane>
+            </el-tabs>
+        </el-col>
+    </el-row>
+</template>
+
+<style lang="scss" scoped></style>
\ No newline at end of file

src/components/devStyle/components/index.vue

 <template>
     <el-scrollbar>
         <div class="common-page">
-            <el-space direction="vertical" :size="20" alignment="flex-start">
+            <el-space direction="vertical" :size="20" alignment="flex-start" fill>
                 <div class="text-title-0-show">开发样式</div>
                 <div class="text-title-1-show">样式变量</div>
                 <ConstStyle />
                 <div class="text-title-1-show">文字样式</div>
                 <TextStyle />
+                <div class="text-title-1-show">通用组件</div>
+                <el-tabs tabPosition="left">
+                    <el-tab-pane label="单选框" lazy>
+                        <radio-page />
+                    </el-tab-pane>
+                    <el-tab-pane label="选项卡" lazy>
+                        <tabs-page />
+                    </el-tab-pane>
+                </el-tabs>
             </el-space>
         </div>
     </el-scrollbar>
@@ -16,5 +25,9 @@
 import "@/styles/container.scss"
 import TextStyle from './textStyle.vue';
 import ConstStyle from './constStyle.vue';
+import { ElTabs, ElTabPane, ElSpace } from "element-plus";
+import RadioPage from './RadioPage/index.vue';
+import TabsPage from './TabsPage/index.vue';
+</script>
 
-</script>
+<style lang="scss" scoped></style>
\ No newline at end of file