Browse Source

支持单选、多选按钮组

tongshangming 2 years ago
parent
commit
e00e9e9884
3 changed files with 54 additions and 21 deletions
  1. 8 6
      src/components.d.ts
  2. 44 12
      src/components/core/form/FormComp.vue
  3. 2 3
      src/views/user/UserInfo.vue

+ 8 - 6
src/components.d.ts

@@ -22,12 +22,13 @@ declare module '@vue/runtime-core' {
     DesignerSetting: typeof import('./components/designer/DesignerSetting.vue')['default']
     DialogForm: typeof import('./components/core/form/DialogForm.vue')['default']
     DynamicFormEdit: typeof import('./components/DynamicFormEdit.vue')['default']
-    ElArea: typeof import('./components/ElArea.vue')['default']
-    ElCustom: typeof import('./components/ElCustom.vue')['default']
-    ElDict: typeof import('./components/ElDict.vue')['default']
-    ElEditor: typeof import('./components/ElEditor.vue')['default']
-    ElEmployees: typeof import('./components/ElEmployees.vue')['default']
-    ElFormTabs: typeof import('./components/ElFormTabs.vue')['default']
+    ElArea: typeof import('./components/form/ElArea.vue')['default']
+    ElCustom: typeof import('./components/form/ElCustom.vue')['default']
+    ElDict: typeof import('./components/form/ElDict.vue')['default']
+    ElEditor: typeof import('./components/form/ElEditor.vue')['default']
+    ElEmployees: typeof import('./components/form/ElEmployees.vue')['default']
+    ElFormTabs: typeof import('./components/form/ElFormTabs.vue')['default']
+    ElImageUpload: typeof import('./components/form/ElImageUpload.vue')['default']
     EmployeesRoleDialog: typeof import('./components/workflow/dialog/employeesRoleDialog.vue')['default']
     ErrorDialog: typeof import('./components/workflow/dialog/errorDialog.vue')['default']
     Exception: typeof import('./components/Exception.vue')['default']
@@ -54,6 +55,7 @@ declare module '@vue/runtime-core' {
     SelectBox: typeof import('./components/workflow/selectBox.vue')['default']
     SelectResult: typeof import('./components/workflow/selectResult.vue')['default']
     SelIcon: typeof import('./components/SelIcon.vue')['default']
+    SlotTmpl: typeof import('./components/core/form/SlotTmpl.vue')['default']
     SvgIcon: typeof import('./components/SvgIcon.vue')['default']
     WorkflowEdit: typeof import('./components/workflow/WorkflowEdit.vue')['default']
   }

+ 44 - 12
src/components/core/form/FormComp.vue

@@ -113,20 +113,52 @@ const headers = reactive({
     v-on="item.events || {}"
   >
     <template v-if="item.type === 'radio-group'">
-      <el-radio v-for="(option, index) in item.options" :label="option.label" :key="index" v-bind="option.props">
-        {{ option.value }}
-      </el-radio>
+      <template v-if="item.props?.button">
+        <el-radio-button
+          v-for="(option, index) in item.options"
+          :label="option.label"
+          :key="index"
+          v-bind="option.props"
+        >
+          {{ option.value }}
+        </el-radio-button>
+      </template>
+      <template v-else>
+        <el-radio
+          v-for="(option, index) in item.options"
+          :label="option.label"
+          :key="index"
+          :border="item.props?.border"
+          v-bind="option.props"
+        >
+          {{ option.value }}
+        </el-radio>
+      </template>
     </template>
     <template v-if="item.type === 'checkbox-group'">
-      <el-checkbox
-        v-for="(option, index) in item.options"
-        :label="option.label"
-        :value="option.value"
-        :key="index"
-        v-bind="option.props"
-      >
-        {{ option.value }}
-      </el-checkbox>
+      <template v-if="item.props?.button">
+        <el-checkbox-button
+          v-for="(option, index) in item.options"
+          :label="option.label"
+          :value="option.value"
+          :key="index"
+          v-bind="option.props"
+        >
+          {{ option.value }}
+        </el-checkbox-button>
+      </template>
+      <template v-else>
+        <el-checkbox
+          v-for="(option, index) in item.options"
+          :label="option.label"
+          :value="option.value"
+          :key="index"
+          :border="item.props?.border"
+          v-bind="option.props"
+        >
+          {{ option.value }}
+        </el-checkbox>
+      </template>
     </template>
     <template #[slot.name]="slotProps" v-for="slot in item.slots" :key="slot.alias">
       <slot :name="slot.alias" v-bind="slotProps"></slot>

+ 2 - 3
src/views/user/UserInfo.vue

@@ -96,7 +96,7 @@ const passWordConfig = reactive<BasicForm>({
   },
   formItems: [
     {
-      label: '密码',
+      label: '密码',
       value: '',
       name: 'old',
       type: 'input',
@@ -128,7 +128,6 @@ const passWordConfig = reactive<BasicForm>({
   ]
 })
 const savePass = () => {
-  console.log(passFormRef.value)
   passFormRef.value.submit()
 }
 const create = (data: any) => {
@@ -273,7 +272,7 @@ const rowClassName = ({ row }: { row: any }) => {
         </div>
       </el-card>
     </el-aside>
-    <el-main class="logo-main">
+    <el-main class="log-main">
       <el-card class="box-card">
         <template #header>
           <div class="card-header">