[权限管理]角色组管理

web/src/views/backend/auth/group/index.vue

@@ -54,7 +54,13 @@ const baTable: baTableClass = new baTableClass(
         dblClickNotEditColumn: [undefined],
         column: [
             { type: 'selection', align: 'center' },
-            { label: t('auth.group.Group name'), prop: 'name', align: 'left', width: '200' },
+            {
+                label: t('auth.group.Group name'),
+                prop: 'name',
+                align: 'left',
+                minWidth: '180',
+            },
+            { label: t('auth.group.commission_rate'), prop: 'commission_rate', align: 'center', formatter: formatRatePercent },
             { label: t('auth.group.jurisdiction'), prop: 'rules', align: 'center' },
             {
                 label: t('State'),
@@ -165,6 +171,13 @@ const menuRuleTreeUpdate = () => {
 
 provide('baTable', baTable)
 
+function formatRatePercent(row: anyObj, _column: any, cellValue: number | string | null) {
+    if (cellValue === null || cellValue === undefined || cellValue === '') {
+        return '0%'
+    }
+    return `${cellValue}%`
+}
+
 onMounted(() => {
     baTable.table.ref = tableRef.value
     baTable.mount()

web/src/views/backend/auth/group/popupForm.vue

@@ -49,6 +49,23 @@
                             :placeholder="t('Please input field', { field: t('auth.group.Group name') })"
                         ></el-input>
                     </el-form-item>
+                    <FormItem
+                        :label="t('auth.group.commission_rate')"
+                        v-model="baTable.form.items!.commission_rate"
+                        type="number"
+                        prop="commission_rate"
+                        :input-attr="{ step: 0.01, precision: 2, min: 0, max: 100, disabled: shouldDisableCommissionRate() }"
+                        :placeholder="t('Please input field', { field: t('auth.group.commission_rate') })"
+                    />
+                    <el-alert class="commission-rate-alert" :title="t('auth.group.commission_rate_desc_title')" type="info" :closable="false" show-icon>
+                        <template #default>
+                            <ul class="commission-rate-desc-list">
+                                <li>{{ t('auth.group.commission_rate_desc_1') }}</li>
+                                <li>{{ t('auth.group.commission_rate_desc_2') }}</li>
+                                <li>{{ t('auth.group.commission_rate_desc_3') }}</li>
+                            </ul>
+                        </template>
+                    </el-alert>
                     <el-form-item prop="auth" :label="t('auth.group.jurisdiction')">
                         <el-tree
                             ref="treeRef"
@@ -94,16 +111,40 @@ import type { ElTree, FormItemRule } from 'element-plus'
 import { buildValidatorData } from '/@/utils/validate'
 import type Node from 'element-plus/es/components/tree/src/model/node'
 import { useConfig } from '/@/stores/config'
+import { useAdminInfo } from '/@/stores/adminInfo'
 
 const config = useConfig()
+const adminInfo = useAdminInfo()
 const formRef = useTemplateRef('formRef')
 const treeRef = useTemplateRef('treeRef')
 const baTable = inject('baTable') as baTableClass
 
 const { t } = useI18n()
+const shouldDisableCommissionRate = () => {
+    return false
+}
 
 const rules: Partial<Record<string, FormItemRule[]>> = reactive({
     name: [buildValidatorData({ name: 'required', title: t('auth.group.Group name') })],
+    commission_rate: [
+        {
+            required: true,
+            validator: (_rule: any, val: number | string, callback: Function) => {
+                if (shouldDisableCommissionRate()) {
+                    return callback()
+                }
+                const strVal = String(val ?? '').trim()
+                if (!strVal) {
+                    return callback(new Error(t('Please input field', { field: t('auth.group.commission_rate') })))
+                }
+                if (!/^(100(\.00?)?|[0-9]{1,2}(\.[0-9]{1,2})?)$/.test(strVal)) {
+                    return callback(new Error(t('auth.admin.Commission rate must be between 0 and 100 with up to 2 decimals')))
+                }
+                return callback()
+            },
+            trigger: 'blur',
+        },
+    ],
     auth: [
         {
             required: true,
@@ -153,6 +194,16 @@ defineExpose({
 </script>
 
 <style scoped lang="scss">
+.commission-rate-alert {
+    margin-bottom: 12px;
+}
+
+.commission-rate-desc-list {
+    margin: 6px 0 0;
+    padding-left: 18px;
+    line-height: 1.6;
+}
+
 :deep(.penultimate-node) {
     .el-tree-node__children {
         padding-left: 60px;