|
|
|
@ -3,263 +3,286 @@ |
|
|
|
@ 时间: 2023-07-05 15:03:42 |
|
|
|
@ 备注: 设置字段值 |
|
|
|
--> |
|
|
|
<script lang='ts' setup> |
|
|
|
import { matrixTable,objectStruct,orgAndUserMatrixCont } from '@/api/matrixapi/type' |
|
|
|
import { getMatrixField,getNumber,submitMatrixData,haveMatrixCont } from '@/api/matrixapi'; |
|
|
|
import { Search } from '@element-plus/icons-vue' |
|
|
|
<script lang="ts" setup> |
|
|
|
import { matrixTable, objectStruct, orgAndUserMatrixCont } from "@/api/matrixapi/type"; |
|
|
|
import { |
|
|
|
getMatrixField, |
|
|
|
getNumber, |
|
|
|
submitMatrixData, |
|
|
|
haveMatrixCont, |
|
|
|
} from "@/api/matrixapi"; |
|
|
|
import { Search } from "@element-plus/icons-vue"; |
|
|
|
/** |
|
|
|
* 引入页面 |
|
|
|
*/ |
|
|
|
import PickOrg from '@/views/matrix/orgoruser/pickorg.vue' |
|
|
|
|
|
|
|
import PickOrg from "@/views/matrix/orgoruser/pickorg.vue"; |
|
|
|
|
|
|
|
const props = defineProps({ |
|
|
|
userShow:{ |
|
|
|
type:Boolean, |
|
|
|
default:false |
|
|
|
}, |
|
|
|
matrixcont:{ |
|
|
|
type:Object, |
|
|
|
default(){ |
|
|
|
return {} |
|
|
|
} |
|
|
|
} |
|
|
|
userShow: { |
|
|
|
type: Boolean, |
|
|
|
default: false, |
|
|
|
}, |
|
|
|
matrixcont: { |
|
|
|
type: Object, |
|
|
|
default() { |
|
|
|
return {}; |
|
|
|
}, |
|
|
|
}, |
|
|
|
}); |
|
|
|
const emits = defineEmits(["update:userShow"]); //父级元素 |
|
|
|
const addFieldLoading = ref(false) |
|
|
|
const tabelColumn = reactive<matrixTable[]>([]) |
|
|
|
const tableList = reactive<any[]>([]) |
|
|
|
const loading = ref(false) |
|
|
|
const orgOrUserBox = ref(false); //选择行政组织或选择人员 |
|
|
|
const judgePage = ref(false); |
|
|
|
const orguseInfo = reactive<orgAndUserMatrixCont[]>([]) |
|
|
|
const emits = defineEmits(["update:userShow"]); //父级元素 |
|
|
|
const addFieldLoading = ref(false); |
|
|
|
const tabelColumn = reactive<matrixTable[]>([]); |
|
|
|
const tableList = reactive<any[]>([]); |
|
|
|
const loading = ref(false); |
|
|
|
const orgOrUserBox = ref(false); //选择行政组织或选择人员 |
|
|
|
const judgePage = ref(false); |
|
|
|
const orguseInfo = reactive<orgAndUserMatrixCont[]>([]); |
|
|
|
const systemMenuTreeProps = { |
|
|
|
children: "child", |
|
|
|
label: "name", |
|
|
|
value:"id" |
|
|
|
} |
|
|
|
const orgOptionsList = ref<any>(); //行政组织树 |
|
|
|
const tableValue = ref<any>(); //单元格内容 |
|
|
|
const ids = ref<number[]>([]); //批量删除的ID |
|
|
|
children: "child", |
|
|
|
label: "name", |
|
|
|
value: "id", |
|
|
|
}; |
|
|
|
const orgOptionsList = ref<any>(); //行政组织树 |
|
|
|
const tableValue = ref<any>(); //单元格内容 |
|
|
|
const ids = ref<number[]>([]); //批量删除的ID |
|
|
|
/** |
|
|
|
* 弹窗显示控制 |
|
|
|
*/ |
|
|
|
const field_is_Show = computed({ |
|
|
|
get: () => props.userShow, |
|
|
|
set: (val) => { |
|
|
|
emits("update:userShow", val); |
|
|
|
}, |
|
|
|
get: () => props.userShow, |
|
|
|
set: (val) => { |
|
|
|
emits("update:userShow", val); |
|
|
|
}, |
|
|
|
}); |
|
|
|
/** |
|
|
|
* 关闭弹窗 |
|
|
|
*/ |
|
|
|
function handleCloseBox(){ |
|
|
|
emits("update:userShow", false); |
|
|
|
initData() |
|
|
|
function handleCloseBox() { |
|
|
|
emits("update:userShow", false); |
|
|
|
initData(); |
|
|
|
} |
|
|
|
/** |
|
|
|
* 初始化数据 |
|
|
|
*/ |
|
|
|
function initData(){ |
|
|
|
orgOptionsList.value?.splice(0,orgOptionsList.value.length); |
|
|
|
// console.log("tableList-------->",tableList.length) |
|
|
|
tableList.splice(0, tableList.length); |
|
|
|
function initData() { |
|
|
|
orgOptionsList.value?.splice(0, orgOptionsList.value.length); |
|
|
|
// console.log("tableList-------->",tableList.length) |
|
|
|
tableList.splice(0, tableList.length); |
|
|
|
} |
|
|
|
/** |
|
|
|
* 监听数据 |
|
|
|
*/ |
|
|
|
watch(() => props.userShow,() => { |
|
|
|
if(props.userShow){ |
|
|
|
getMatrixField({id:props.matrixcont.id}) |
|
|
|
.then(({data})=>{ |
|
|
|
// console.log("监听数据---->",data) |
|
|
|
tabelColumn.splice(0,tabelColumn.length) |
|
|
|
data.factor.forEach(item=>{ |
|
|
|
tabelColumn.push({ |
|
|
|
id:item.id, |
|
|
|
label:item.name, |
|
|
|
prop:item.pinyin, |
|
|
|
types:item.types |
|
|
|
}) |
|
|
|
}) |
|
|
|
data.outcome.forEach(item=>{ |
|
|
|
tabelColumn.push({ |
|
|
|
id:item.id, |
|
|
|
label:item.name, |
|
|
|
prop:item.pinyin, |
|
|
|
types:item.types |
|
|
|
}) |
|
|
|
}) |
|
|
|
}) |
|
|
|
.finally(()=>{ |
|
|
|
tableList.splice(0,tableList.length) |
|
|
|
haveMatrixCont({id:props.matrixcont.id}) |
|
|
|
.then((data)=>{ |
|
|
|
if(data.data&&data.data.length>0){ |
|
|
|
data.data.forEach((item:any)=>{ |
|
|
|
tableList.push(item) |
|
|
|
}) |
|
|
|
} |
|
|
|
}) |
|
|
|
.finally(()=>{ |
|
|
|
if(tableList.length<1){ |
|
|
|
addTableHang(); |
|
|
|
} |
|
|
|
}) |
|
|
|
}) |
|
|
|
} |
|
|
|
}); |
|
|
|
watch( |
|
|
|
() => props.userShow, |
|
|
|
() => { |
|
|
|
if (props.userShow) { |
|
|
|
getMatrixField({ id: props.matrixcont.id }) |
|
|
|
.then(({ data }) => { |
|
|
|
console.log("监听数据---->", data); |
|
|
|
tabelColumn.splice(0, tabelColumn.length); |
|
|
|
data.factor.forEach((item) => { |
|
|
|
tabelColumn.push({ |
|
|
|
id: item.id, |
|
|
|
label: item.name, |
|
|
|
prop: item.pinyin, |
|
|
|
types: item.types, |
|
|
|
}); |
|
|
|
}); |
|
|
|
data.outcome.forEach((item) => { |
|
|
|
tabelColumn.push({ |
|
|
|
id: item.id, |
|
|
|
label: item.name, |
|
|
|
prop: item.pinyin, |
|
|
|
types: item.types, |
|
|
|
}); |
|
|
|
}); |
|
|
|
}) |
|
|
|
.finally(() => { |
|
|
|
tableList.splice(0, tableList.length); |
|
|
|
haveMatrixCont({ id: props.matrixcont.id }) |
|
|
|
.then((data) => { |
|
|
|
console.log("监听数据--11111-->", data); |
|
|
|
if (data.data && data.data.length > 0) { |
|
|
|
data.data.forEach((item: any) => { |
|
|
|
tableList.push(item); |
|
|
|
}); |
|
|
|
} |
|
|
|
}) |
|
|
|
.finally(() => { |
|
|
|
if (tableList.length < 1) { |
|
|
|
addTableHang(); |
|
|
|
} |
|
|
|
}); |
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
); |
|
|
|
/** |
|
|
|
* 添加行 |
|
|
|
*/ |
|
|
|
function addTableHang(){ |
|
|
|
//获取编号 |
|
|
|
getNumber({id:8}) |
|
|
|
.then((data)=>{ |
|
|
|
var jks:objectStruct = {} |
|
|
|
tabelColumn.forEach(item=>{ |
|
|
|
jks[item.prop]={ |
|
|
|
id:item.id, |
|
|
|
types:item.types, |
|
|
|
number:data.data.uuidstring, |
|
|
|
userlist:[], |
|
|
|
orgid:0, |
|
|
|
namelist:[], |
|
|
|
isedit:false, |
|
|
|
pinyin:item.prop |
|
|
|
} |
|
|
|
}) |
|
|
|
tableList.push(jks) |
|
|
|
}) |
|
|
|
// console.log("监听数据-1111->",props.orglist,props.orgtree) |
|
|
|
function addTableHang() { |
|
|
|
//获取编号 |
|
|
|
getNumber({ id: 8 }).then((data) => { |
|
|
|
var jks: objectStruct = {}; |
|
|
|
tabelColumn.forEach((item) => { |
|
|
|
jks[item.prop] = { |
|
|
|
id: item.id, |
|
|
|
types: item.types, |
|
|
|
number: data.data.uuidstring, |
|
|
|
userlist: [], |
|
|
|
orgid: 0, |
|
|
|
namelist: [], |
|
|
|
isedit: false, |
|
|
|
pinyin: item.prop, |
|
|
|
}; |
|
|
|
}); |
|
|
|
tableList.push(jks); |
|
|
|
}); |
|
|
|
// console.log("监听数据-1111->",props.orglist,props.orgtree) |
|
|
|
} |
|
|
|
/** |
|
|
|
* 提交使用人 |
|
|
|
*/ |
|
|
|
function submitAddMatrixUser(){ |
|
|
|
if(orguseInfo&&orguseInfo.length>0){ |
|
|
|
orguseInfo.splice(0,orguseInfo.length) |
|
|
|
} |
|
|
|
// console.log("提交数据-->",tableList) |
|
|
|
if(tableList&&tableList.length > 0){ |
|
|
|
tableList.forEach((item)=>{ |
|
|
|
// console.log("提交数据-4->",item,item.bm) |
|
|
|
// if(item&&item.length>=0){ |
|
|
|
// item.forEach((items: any)=>{ |
|
|
|
// console.log("提交数据-2->",items) |
|
|
|
// }) |
|
|
|
// } |
|
|
|
const entries = Object.entries(item); |
|
|
|
entries.map((val:any)=>{ |
|
|
|
// console.log("提交数据-2->",val,val[val.length-1].number) |
|
|
|
let typeClass = 1 |
|
|
|
if(val[val.length-1].types == 1){ |
|
|
|
typeClass = 2 |
|
|
|
} |
|
|
|
orguseInfo.push({ |
|
|
|
id:0, |
|
|
|
number:val[val.length-1].number, |
|
|
|
userlist:val[val.length-1].userlist, |
|
|
|
types:typeClass, |
|
|
|
mcid:props.matrixcont.id, |
|
|
|
mhid:val[val.length-1].id, |
|
|
|
}) |
|
|
|
}) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}) |
|
|
|
} |
|
|
|
submitMatrixData(orguseInfo) |
|
|
|
.then((data)=>{ |
|
|
|
// console.log("提交数据-66666->",data) |
|
|
|
handleCloseBox(); |
|
|
|
}) |
|
|
|
function submitAddMatrixUser() { |
|
|
|
if (orguseInfo && orguseInfo.length > 0) { |
|
|
|
orguseInfo.splice(0, orguseInfo.length); |
|
|
|
} |
|
|
|
// console.log("提交数据-->",tableList) |
|
|
|
if (tableList && tableList.length > 0) { |
|
|
|
tableList.forEach((item) => { |
|
|
|
// console.log("提交数据-4->",item,item.bm) |
|
|
|
// if(item&&item.length>=0){ |
|
|
|
// item.forEach((items: any)=>{ |
|
|
|
// console.log("提交数据-2->",items) |
|
|
|
// }) |
|
|
|
// } |
|
|
|
const entries = Object.entries(item); |
|
|
|
entries.map((val: any) => { |
|
|
|
// console.log("提交数据-2->",val,val[val.length-1].number) |
|
|
|
let typeClass = 1; |
|
|
|
if (val[val.length - 1].types == 1) { |
|
|
|
typeClass = 2; |
|
|
|
} |
|
|
|
orguseInfo.push({ |
|
|
|
id: 0, |
|
|
|
number: val[val.length - 1].number, |
|
|
|
userlist: val[val.length - 1].userlist, |
|
|
|
types: typeClass, |
|
|
|
mcid: props.matrixcont.id, |
|
|
|
mhid: val[val.length - 1].id, |
|
|
|
}); |
|
|
|
}); |
|
|
|
}); |
|
|
|
} |
|
|
|
submitMatrixData(orguseInfo).then((data) => { |
|
|
|
// console.log("提交数据-66666->",data) |
|
|
|
handleCloseBox(); |
|
|
|
}); |
|
|
|
|
|
|
|
// console.log("提交数据-1->",orguseInfo) |
|
|
|
// console.log("提交数据-1->",orguseInfo) |
|
|
|
} |
|
|
|
function sdfdsf(cont:any){ |
|
|
|
// console.log("单击单元格-2222222->",cont) |
|
|
|
if(cont.types<1){ |
|
|
|
judgePage.value = true |
|
|
|
}else{ |
|
|
|
judgePage.value = false |
|
|
|
} |
|
|
|
cont.isedit=true |
|
|
|
orgOrUserBox.value = true |
|
|
|
tableValue.value = cont |
|
|
|
function sdfdsf(cont: any) { |
|
|
|
// console.log("单击单元格-2222222->",cont) |
|
|
|
if (cont.types < 1) { |
|
|
|
judgePage.value = true; |
|
|
|
} else { |
|
|
|
judgePage.value = false; |
|
|
|
} |
|
|
|
cont.isedit = true; |
|
|
|
orgOrUserBox.value = true; |
|
|
|
tableValue.value = cont; |
|
|
|
} |
|
|
|
/** |
|
|
|
* 删除行 |
|
|
|
*/ |
|
|
|
function delTableHang(id:any){ |
|
|
|
// console.log("删除行",id) |
|
|
|
tableList.splice(id,1) |
|
|
|
if(tableList.length<1){ |
|
|
|
addTableHang(); |
|
|
|
} |
|
|
|
function delTableHang(id: any) { |
|
|
|
// console.log("删除行",id) |
|
|
|
tableList.splice(id, 1); |
|
|
|
if (tableList.length < 1) { |
|
|
|
addTableHang(); |
|
|
|
} |
|
|
|
} |
|
|
|
</script> |
|
|
|
<template> |
|
|
|
<el-dialog v-model="field_is_Show" custom-class="dialog_box" title="矩阵数据维护" :before-close="handleCloseBox" width="80%" draggable> |
|
|
|
<PickOrg v-model:orgBoxShow="orgOrUserBox" :ismultiselect="false" :tabledata="tableValue" /> |
|
|
|
<el-table |
|
|
|
v-loading="loading" |
|
|
|
highlight-current-row |
|
|
|
:data="tableList" |
|
|
|
border |
|
|
|
> |
|
|
|
<el-table-column v-for="(item,index) in tabelColumn" :key="index" align="center"> |
|
|
|
<!-- 自定义表头 --> |
|
|
|
<template #header> |
|
|
|
{{item.label}} |
|
|
|
</template> |
|
|
|
<!-- 自定义表项/单元格内容 --> |
|
|
|
<template #default="scope"> |
|
|
|
<div v-if="!scope.row[item.prop].isedit" class="edit_table_row" @dblclick="sdfdsf(scope.row[item.prop])" > |
|
|
|
<el-tag v-for="(itemtext,ti) in scope.row[item.prop].userlist" :key="ti" class="ml-2" size="small">{{ itemtext.name }}</el-tag> |
|
|
|
</div> |
|
|
|
<div v-else> |
|
|
|
<el-input |
|
|
|
v-model="scope.row[item.prop].namelist" |
|
|
|
placeholder="请选择" |
|
|
|
:suffix-icon="Search" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column label="操作" width="80" align="center"> |
|
|
|
<template #default="scope"> |
|
|
|
<el-button type="danger" link @click="delTableHang(scope.$index)">删除</el-button> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
|
|
|
|
<template #footer> |
|
|
|
<div class="dialog-footer left_right"> |
|
|
|
<div> |
|
|
|
<el-button type="warning" @click="addTableHang">添加数据</el-button> |
|
|
|
</div> |
|
|
|
<div> |
|
|
|
<el-button type="primary" :loading="addFieldLoading" @click="submitAddMatrixUser" >确 定</el-button> |
|
|
|
<el-button @click="handleCloseBox">取 消</el-button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
|
|
<el-dialog |
|
|
|
v-model="field_is_Show" |
|
|
|
custom-class="dialog_box" |
|
|
|
title="矩阵数据维护" |
|
|
|
:before-close="handleCloseBox" |
|
|
|
width="80%" |
|
|
|
draggable |
|
|
|
> |
|
|
|
<PickOrg |
|
|
|
v-model:orgBoxShow="orgOrUserBox" |
|
|
|
:ismultiselect="false" |
|
|
|
:tabledata="tableValue" |
|
|
|
/> |
|
|
|
<el-table v-loading="loading" highlight-current-row :data="tableList" border> |
|
|
|
<el-table-column v-for="(item, index) in tabelColumn" :key="index" align="center"> |
|
|
|
<!-- 自定义表头 --> |
|
|
|
<template #header> |
|
|
|
{{ item.label }} |
|
|
|
</template> |
|
|
|
<!-- 自定义表项/单元格内容 --> |
|
|
|
<template #default="scope"> |
|
|
|
<div |
|
|
|
v-if="!scope.row[item.prop].isedit" |
|
|
|
class="edit_table_row" |
|
|
|
@dblclick="sdfdsf(scope.row[item.prop])" |
|
|
|
> |
|
|
|
<el-tag |
|
|
|
v-for="(itemtext, ti) in scope.row[item.prop].userlist" |
|
|
|
:key="ti" |
|
|
|
class="ml-2" |
|
|
|
size="small" |
|
|
|
>{{ itemtext.name }}</el-tag |
|
|
|
> |
|
|
|
</div> |
|
|
|
<div v-else> |
|
|
|
<el-input |
|
|
|
v-model="scope.row[item.prop].namelist" |
|
|
|
placeholder="请选择" |
|
|
|
:suffix-icon="Search" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column label="操作" width="80" align="center"> |
|
|
|
<template #default="scope"> |
|
|
|
<el-button type="danger" link @click="delTableHang(scope.$index)" |
|
|
|
>删除</el-button |
|
|
|
> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
|
|
|
|
</el-dialog> |
|
|
|
<template #footer> |
|
|
|
<div class="dialog-footer left_right"> |
|
|
|
<div> |
|
|
|
<el-button type="warning" @click="addTableHang">添加数据</el-button> |
|
|
|
</div> |
|
|
|
<div> |
|
|
|
<el-button |
|
|
|
type="primary" |
|
|
|
:loading="addFieldLoading" |
|
|
|
@click="submitAddMatrixUser" |
|
|
|
>确 定</el-button |
|
|
|
> |
|
|
|
<el-button @click="handleCloseBox">取 消</el-button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
</el-dialog> |
|
|
|
</template> |
|
|
|
<style lang='scss' scoped> |
|
|
|
.edit_table_row{ |
|
|
|
display: block; |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
<style lang="scss" scoped> |
|
|
|
.edit_table_row { |
|
|
|
display: block; |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
} |
|
|
|
.left_right{ |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
align-items: center; |
|
|
|
.left_right { |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
align-items: center; |
|
|
|
} |
|
|
|
</style> |
|
|
|
|
herenshan112
7 months ago