✨ feat(g-sys-dict): 新增单选按钮渲染模式并优化渲染模式类型声明

Web/src/components/sysDict/sysDict.vue

@@ -3,6 +3,8 @@
 import { reactive, watch, PropType } from 'vue';
 import { useUserInfo } from '/@/stores/userInfo';
 
+const renderTypeArray = ['tag', 'select', 'radio', 'checkbox', 'radio-button'] as const;
+type RenderType = typeof renderTypeArray[number];
 type DictItem = {
 	[key: string]: any;
 	tagType?: string;
@@ -77,14 +79,14 @@ const props = defineProps({
 	},
 	/**
 	 * 组件渲染方式
-	 * @values 'tag', 'select', 'radio', 'checkbox'
+	 * @values 'tag', 'select', 'radio', 'checkbox', 'radio-button'
 	 * @default 'tag'
 	 */
 	renderAs: {
-		type: String as PropType<'tag' | 'select' | 'radio' | 'checkbox'>,
-		default: 'tag',
-		validator(value: string) {
-			return ['tag', 'select', 'radio', 'checkbox'].includes(value);
+		type: String as PropType<RenderType>,
+		default: renderTypeArray[0],
+		validator(value: any) {
+			return renderTypeArray.includes(value);
 		},
 	},
 	/**
@@ -233,5 +235,14 @@ watch(
 			</el-radio>
 		</el-radio-group>
 	</template>
+
+  <!-- 渲染单选框按钮 -->
+  <template v-if="props.renderAs === 'radio-button'">
+    <el-radio-group v-model="state.value" v-bind="$attrs" @change="updateValue">
+      <el-radio-button v-for="(item, index) in state.dictData" :key="index" :value="item[propValue]">
+        {{ getDisplayText(item) }}
+      </el-radio-button>
+    </el-radio-group>
+  </template>
 </template>
 <style scoped lang="scss"></style>