Industrial-image-management.../src/views/performance/setting/components/RuleList.vue

64 lines
2.2 KiB
Vue

<template>
<a-drawer v-model:visible="visible" :title="`管理细则 - ${dimension?.dimensionName || ''}`">
<a-button type="primary" @click="openRuleDrawer()">新增细则</a-button>
<a-table :data="ruleList" :columns="ruleColumns" row-key="ruleId" style="margin-top: 16px;">
<template #status="{ record }">
<a-tag :color="record.status === 0 ? 'green' : 'red'">
{{ record.status === 0 ? '启用' : '禁用' }}
</a-tag>
</template>
<template #action="{ record }">
<a-space>
<a-button type="text" @click="openRuleDrawer(record)">编辑</a-button>
<a-button type="text" status="danger" @click="handleDeleteRule(record.ruleId)">删除</a-button>
</a-space>
</template>
</a-table>
<RuleDrawer ref="ruleDrawerRef" @success="loadRules" :dimension="dimension" />
</a-drawer>
</template>
<script setup lang="ts">
import { ref } from 'vue'
import { getRuleList, deleteRule } from '@/apis/performance-setting'
import RuleDrawer from './RuleDrawer.vue'
import type { PerformanceRule, PerformanceDimension } from '@/apis/performance-setting/type'
const visible = ref(false)
const dimension = ref<PerformanceDimension>()
const ruleList = ref<PerformanceRule[]>([])
const ruleDrawerRef = ref()
const ruleColumns = [
{ title: '细则名称', dataIndex: 'ruleName' },
{ title: '描述', dataIndex: 'description' },
{ title: '分数', dataIndex: 'score' },
{ title: '权重', dataIndex: 'weight' },
{ title: '奖金', dataIndex: 'bonus' },
{ title: '状态', slotName: 'status' },
{ title: '操作', slotName: 'action' },
]
const open = (dim: PerformanceDimension) => {
dimension.value = dim
visible.value = true
loadRules()
}
const loadRules = async () => {
if (!dimension.value) return
const res = await getRuleList({ dimensionName: dimension.value.dimensionName })
ruleList.value = res.data || []
}
const openRuleDrawer = (record?: PerformanceRule) => {
ruleDrawerRef.value.open(record)
}
const handleDeleteRule = async (id: string) => {
await deleteRule(id)
loadRules()
}
defineExpose({ open })
</script>