Files
pqs-9100_client/frontend/src/views/authority/role/components/roleUnit.vue

84 lines
2.3 KiB
Vue

<template>
<!-- 基础信息弹出框 -->
<el-dialog :model-value="dialogVisible" :title="title" v-bind="dialogSmall" @close="handleCancel" width="500" draggable>
<div>
<el-form :model="data">
<el-form-item label="名称" :label-width="100">
<el-input v-model="data.rolename" placeholder="请输入名称" autocomplete="off" />
</el-form-item>
<el-form-item label="编码" :label-width="100">
<el-input v-model="data.id" placeholder="请输入编码" autocomplete="off" />
</el-form-item>
<el-form-item label="状态" :label-width="100">
<el-switch
v-model=value
inline-prompt
style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
active-text="启用"
inactive-text="禁用"
/>
</el-form-item>
<el-form-item label="备注" :label-width="100">
<el-input v-model="data.describe" :rows="2" type="textarea" placeholder="请输入备注" autocomplete="off" />
</el-form-item>
</el-form>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="handleCancel">取消</el-button>
<el-button type="primary" @click="handleOK">
保存
</el-button>
</div>
</template>
</el-dialog>
</template>
<script lang="ts" setup>
import { ref,computed } from 'vue'
import {dialogSmall} from '@/utils/elementBind'
import {
addRole,
} from '@/api/role/role'
const {dialogVisible,title,data,updataList} = defineProps<{
dialogVisible:boolean;
title:string;
data:{
rolename:string;
id:string;
status:number;
describe:string;
}
updataList:Function
}>();
const value = computed({
get: () => {
if(title === '新增角色')
return true
data.status === 1
},
set: (value: boolean) => data.status = value ? 1 : 0
})
const emit = defineEmits<{
(e:'update:visible',value:boolean):void;
}>();
const handleCancel = () => {
emit('update:visible',false)
}
const handleOK = () => {
addRole(data).then(res => {
if(res.code === "200")
ElMessage.success(res.message)
updataList()
})
emit('update:visible',false)
}
</script>