|
|
|
@ -4,15 +4,28 @@ |
|
|
|
@ 备注: 矩阵选项 |
|
|
|
--> |
|
|
|
<script lang='ts' setup> |
|
|
|
import { searchMatrix,matrixCont } from '@/api/matrixapi/type' |
|
|
|
import { getMatrixList } from '@/api/matrixapi/index' |
|
|
|
import { searchMatrix,matrixCont,martixFieldStruct,matrixInfo } from '@/api/matrixapi/type' |
|
|
|
import { getMatrixList,getMatrixField } from '@/api/matrixapi/index' |
|
|
|
|
|
|
|
|
|
|
|
const props = defineProps({ |
|
|
|
isshow:{ |
|
|
|
type:Boolean, |
|
|
|
default:false |
|
|
|
} |
|
|
|
}, |
|
|
|
data: { |
|
|
|
type: Object, |
|
|
|
default: () => { |
|
|
|
return { |
|
|
|
"matrixid":0, |
|
|
|
"matrixName":"", |
|
|
|
"factorid":0, |
|
|
|
"factorName":"", |
|
|
|
"outcomeid":0, |
|
|
|
"outcomeName":"", |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
}) |
|
|
|
const emits = defineEmits(["update:isshow","change"]); //父级元素 |
|
|
|
const isShow = computed({ |
|
|
|
@ -22,12 +35,28 @@ const isShow = computed({ |
|
|
|
}, |
|
|
|
}); |
|
|
|
const loading = ref(true); |
|
|
|
const loadingVal = ref(true); |
|
|
|
const matrixContList = ref<matrixCont[]>(); |
|
|
|
const matrixIsClick = reactive<matrixInfo>({ |
|
|
|
matrixid:0, |
|
|
|
factorid:0, |
|
|
|
outcomeid:0, |
|
|
|
matrixName:"", |
|
|
|
factorName:"", |
|
|
|
outcomeName:"", |
|
|
|
}); |
|
|
|
//执行监听 |
|
|
|
watch(() => props.isshow,(val:any) => { |
|
|
|
if(val){ |
|
|
|
console.log("执行监听") |
|
|
|
// console.log("执行监听") |
|
|
|
searchMatrixList(); |
|
|
|
|
|
|
|
matrixIsClick.matrixid = props.data.matrixid; |
|
|
|
matrixIsClick.matrixName = props.data.matrixName; |
|
|
|
matrixIsClick.factorid = props.data.factorid; |
|
|
|
matrixIsClick.factorName = props.data.factorName; |
|
|
|
matrixIsClick.outcomeid = props.data.outcomeid; |
|
|
|
matrixIsClick.outcomeName = props.data.outcomeName; |
|
|
|
} |
|
|
|
}) |
|
|
|
//行政组织树对照值 |
|
|
|
@ -36,18 +65,85 @@ const searchArchiveQuery = reactive<searchMatrix>({ |
|
|
|
pagesize:10 |
|
|
|
}) |
|
|
|
const total = ref(0); //总记录数 |
|
|
|
const farstId = ref<number>(0) |
|
|
|
/** |
|
|
|
* 获取矩阵列表 |
|
|
|
*/ |
|
|
|
function searchMatrixList(){ |
|
|
|
loading.value = true |
|
|
|
// console.log("值改变---->",matrixIsClick) |
|
|
|
getMatrixList(searchArchiveQuery) |
|
|
|
.then(({ data })=>{ |
|
|
|
console.log("获取矩阵列表->",data) |
|
|
|
// console.log("获取矩阵列表->",data) |
|
|
|
matrixContList.value = data.list |
|
|
|
total.value = data.total |
|
|
|
}).finally(()=>{loading.value = false}) |
|
|
|
if(data.list.length > 0){ |
|
|
|
farstId.val = data.list[0].id*1 |
|
|
|
// matrixIsClick.matrixid = data.list[0].id*1 |
|
|
|
// matrixIsClick.matrixName = data.list[0].name |
|
|
|
} |
|
|
|
}).finally(()=>{ |
|
|
|
loading.value = false |
|
|
|
gainMatrixNeed(farstId.val); |
|
|
|
}) |
|
|
|
} |
|
|
|
const factorList = ref<martixFieldStruct[]>() |
|
|
|
const outcomeList = ref<martixFieldStruct[]>() |
|
|
|
//获取矩阵相关字段 |
|
|
|
const gainMatrixNeed = (val:any) =>{ |
|
|
|
loadingVal.value = true |
|
|
|
getMatrixField({id:val*1}) |
|
|
|
.then(({data})=>{ |
|
|
|
console.log("监听数据---->",data) |
|
|
|
factorList.value = data.factor |
|
|
|
outcomeList.value = data.outcome |
|
|
|
if(data.factor.length>0){ |
|
|
|
// matrixIsClick.factorid = data.factor[0].id*1 |
|
|
|
// matrixIsClick.factorName = data.factor[0].name |
|
|
|
} |
|
|
|
if(data.outcome.length>0){ |
|
|
|
// matrixIsClick.outcomeid = data.outcome[0].id*1 |
|
|
|
// matrixIsClick.outcomeName = data.outcome[0].name |
|
|
|
} |
|
|
|
}) |
|
|
|
.finally(()=>{ |
|
|
|
loadingVal.value = false |
|
|
|
}) |
|
|
|
} |
|
|
|
//选择矩阵 |
|
|
|
const pickmatirval = (val:matrixCont) =>{ |
|
|
|
matrixIsClick.matrixid = val.id*1 |
|
|
|
matrixIsClick.matrixName = val.name |
|
|
|
gainMatrixNeed(val.id*1); |
|
|
|
} |
|
|
|
//选择矩阵值 |
|
|
|
const pickval = (val:martixFieldStruct) =>{ |
|
|
|
matrixIsClick.outcomeid = val.id*1 |
|
|
|
matrixIsClick.outcomeName = val.name |
|
|
|
} |
|
|
|
//选择条件 |
|
|
|
const pickSelect = (val:any) =>{ |
|
|
|
factorList.value.forEach(item=>{ |
|
|
|
if(item.id==val){ |
|
|
|
matrixIsClick.factorid = item.id*1 |
|
|
|
matrixIsClick.factorName = item.name |
|
|
|
} |
|
|
|
}) |
|
|
|
} |
|
|
|
watch(matrixIsClick,(val:any) => { |
|
|
|
// console.log("值改变---->",val) |
|
|
|
emits("change", val); |
|
|
|
}) |
|
|
|
onMounted(()=>{ |
|
|
|
matrixIsClick.matrixid = props.data.matrixid; |
|
|
|
matrixIsClick.matrixName = props.data.matrixName; |
|
|
|
matrixIsClick.factorid = props.data.factorid; |
|
|
|
matrixIsClick.factorName = props.data.factorName; |
|
|
|
matrixIsClick.outcomeid = props.data.outcomeid; |
|
|
|
matrixIsClick.outcomeName = props.data.outcomeName; |
|
|
|
searchMatrixList(); |
|
|
|
|
|
|
|
}) |
|
|
|
</script> |
|
|
|
<template> |
|
|
|
<el-descriptions |
|
|
|
@ -59,9 +155,13 @@ function searchMatrixList(){ |
|
|
|
border |
|
|
|
> |
|
|
|
<el-descriptions-item label="可用矩阵" width="50%"> |
|
|
|
<el-row v-loading="loading" :gutter="20"> |
|
|
|
<el-col v-for="item in matrixContList" :key="item.id" :span="24" class="materBody"> |
|
|
|
<el-text class="mx-1">{{item.name}}</el-text> <el-text class="mx-1">{{item.orgname}}</el-text> |
|
|
|
<el-row v-loading="loading"> |
|
|
|
<el-col :span="24" class="materBody"> |
|
|
|
<ul> |
|
|
|
<li v-for="item in matrixContList" :key="item.id" :class="matrixIsClick.matrixid==item.id?'active':''" @click="pickmatirval(item)"> |
|
|
|
<el-text class="mx-1">{{item.name}}</el-text> <el-text class="mx-1">{{item.orgname}}</el-text> |
|
|
|
</li> |
|
|
|
</ul> |
|
|
|
</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" /> |
|
|
|
@ -69,17 +169,47 @@ function searchMatrixList(){ |
|
|
|
</el-row> |
|
|
|
|
|
|
|
</el-descriptions-item> |
|
|
|
<el-descriptions-item label="矩阵选项" width="50%"> |
|
|
|
|
|
|
|
<el-descriptions-item label="矩阵选项" width="50%"> |
|
|
|
<el-row v-loading="loadingVal"> |
|
|
|
<el-col :span="24"> |
|
|
|
<el-select v-model="matrixIsClick.factorid" filterable placeholder="Select" style="width:100%" @change="pickSelect"> |
|
|
|
<el-option |
|
|
|
:key="0" |
|
|
|
label="请选择" |
|
|
|
:value="0" |
|
|
|
/> |
|
|
|
<el-option |
|
|
|
v-for="item in factorList" |
|
|
|
:key="item.id" |
|
|
|
:label="item.name" |
|
|
|
:value="item.id" |
|
|
|
/> |
|
|
|
</el-select> |
|
|
|
</el-col> |
|
|
|
<el-col :span="24" class="materBody"> |
|
|
|
<ul> |
|
|
|
<li v-for="item in outcomeList" :key="item.id" :class="matrixIsClick.outcomeid==item.id?'active':''" @click="pickval(item)"> |
|
|
|
<el-text class="mx-1">{{item.name}}</el-text> <el-text class="mx-1">{{}}{{item.pinyin}}</el-text> |
|
|
|
</li> |
|
|
|
</ul> |
|
|
|
|
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
</el-descriptions-item> |
|
|
|
</el-descriptions> |
|
|
|
</template> |
|
|
|
<style lang='scss' scoped> |
|
|
|
.materBody{ |
|
|
|
padding:5px 0 5px 0; |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
align-items: center; |
|
|
|
cursor:pointer; |
|
|
|
|
|
|
|
li{ |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
align-items: center; |
|
|
|
cursor:pointer; |
|
|
|
} |
|
|
|
li.active span { |
|
|
|
color:#409EFF; |
|
|
|
} |
|
|
|
} |
|
|
|
</style> |
|
|
|
|
