4 changed files with 149 additions and 15 deletions
@ -0,0 +1,79 @@ |
|||
<!-- |
|||
@ 作者: 秦东 |
|||
@ 时间: 2023-10-28 13:56:34 |
|||
@ 备注: 矩阵选项 |
|||
--> |
|||
<script lang='ts' setup> |
|||
import { searchMatrix,matrixCont } from '@/api/matrixapi/type' |
|||
import { getMatrixList } from '@/api/matrixapi/index' |
|||
|
|||
|
|||
const props = defineProps({ |
|||
isshow:{ |
|||
type:Boolean, |
|||
default:false |
|||
} |
|||
}) |
|||
const emits = defineEmits(["update:isshow","change"]); //父级元素 |
|||
const isShow = computed({ |
|||
get: () => props.isshow, |
|||
set: (val) => { |
|||
emits("update:isshow", val); |
|||
}, |
|||
}); |
|||
const loading = ref(true); |
|||
const matrixContList = ref<matrixCont[]>(); |
|||
//执行监听 |
|||
watch(() => props.isshow,(val:any) => { |
|||
if(val){ |
|||
console.log("执行监听") |
|||
searchMatrixList(); |
|||
} |
|||
}) |
|||
//行政组织树对照值 |
|||
const searchArchiveQuery = reactive<searchMatrix>({ |
|||
page:1, |
|||
pagesize:10 |
|||
}) |
|||
const total = ref(0); //总记录数 |
|||
/** |
|||
* 获取矩阵列表 |
|||
*/ |
|||
function searchMatrixList(){ |
|||
loading.value = true |
|||
getMatrixList(searchArchiveQuery) |
|||
.then(({ data })=>{ |
|||
console.log("获取矩阵列表->",data) |
|||
matrixContList.value = data.list |
|||
total.value = data.total |
|||
}).finally(()=>{loading.value = false}) |
|||
} |
|||
</script> |
|||
<template> |
|||
<el-descriptions |
|||
v-if="isShow" |
|||
title="权限矩阵" |
|||
direction="vertical" |
|||
:column="2" |
|||
:size="size" |
|||
border |
|||
> |
|||
<el-descriptions-item label="可用矩阵" width="50%"> |
|||
<el-row v-loading="loading"> |
|||
<el-col v-for="item in matrixContList" :key="item.id" :span="24"> |
|||
{{item.name}} |
|||
</el-col> |
|||
<el-col :span="24"> |
|||
<el-pagination v-model:total="total" v-model:current-page="searchArchiveQuery.page" small layout="prev, pager, next" :page-size="searchArchiveQuery.pagesize" :pager-count="5" /> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
</el-descriptions-item> |
|||
<el-descriptions-item label="矩阵选项" width="50%"> |
|||
|
|||
</el-descriptions-item> |
|||
</el-descriptions> |
|||
</template> |
|||
<style lang='scss' scoped> |
|||
|
|||
</style> |
|||
Loading…
Reference in new issue