|
|
|
@@ -7,7 +7,7 @@ |
|
|
|
> |
|
|
|
<div class="base-info"> |
|
|
|
<div class="title">基础信息:</div> |
|
|
|
<div class="body"> |
|
|
|
<div class="base-body"> |
|
|
|
<el-row v-if="type == 1 || type == 2" type="flex"> |
|
|
|
<el-col :span="5" class="grey"><span>一级指标</span></el-col> |
|
|
|
<el-col :span="7" |
|
|
|
@@ -96,11 +96,12 @@ |
|
|
|
> |
|
|
|
</div> |
|
|
|
<div> |
|
|
|
<el-table |
|
|
|
<!-- <el-table |
|
|
|
:data="detailList" |
|
|
|
border |
|
|
|
highlight-current-row |
|
|
|
v-loading="tableLoading" |
|
|
|
:height="tableHeight" |
|
|
|
> |
|
|
|
<el-table-column |
|
|
|
type="index" |
|
|
|
@@ -308,17 +309,26 @@ |
|
|
|
</el-table-column> |
|
|
|
<el-table-column label="操作" align="center" width="135"> |
|
|
|
<template slot-scope="{ row, $index }"> |
|
|
|
<el-link |
|
|
|
v-if="row.add || row.edit" |
|
|
|
@click="add(row)" |
|
|
|
icon="el-icon-edit" |
|
|
|
type="primary" |
|
|
|
:underline="false" |
|
|
|
>保存</el-link |
|
|
|
> |
|
|
|
<template v-if="row.add || row.edit"> |
|
|
|
<el-link |
|
|
|
@click="add(row)" |
|
|
|
icon="el-icon-edit" |
|
|
|
type="primary" |
|
|
|
:underline="false" |
|
|
|
>保存</el-link |
|
|
|
> |
|
|
|
<el-link |
|
|
|
@click="remove('cancel', $index, row)" |
|
|
|
icon="el-icon-edit" |
|
|
|
type="primary" |
|
|
|
:underline="false" |
|
|
|
>取消</el-link |
|
|
|
> |
|
|
|
</template> |
|
|
|
|
|
|
|
<template v-else> |
|
|
|
<el-link |
|
|
|
@click="change('edit', $index)" |
|
|
|
@click="change('edit', $index, row)" |
|
|
|
icon="el-icon-edit" |
|
|
|
type="primary" |
|
|
|
:underline="false" |
|
|
|
@@ -326,7 +336,7 @@ |
|
|
|
> |
|
|
|
<el-popconfirm |
|
|
|
title="确定要删除此表格？" |
|
|
|
@confirm="remove(row.id)" |
|
|
|
@confirm="remove('delete', row.id)" |
|
|
|
class="ele-action" |
|
|
|
> |
|
|
|
<el-link |
|
|
|
@@ -340,7 +350,294 @@ |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
</el-table> --> |
|
|
|
<div class="table" v-loading="tableLoading"> |
|
|
|
<div class="scroll-x"> |
|
|
|
<div class="header"> |
|
|
|
<el-row type="flex"> |
|
|
|
<el-col :span="1" align="center" class="thead td" |
|
|
|
><span class="cell">编号</span></el-col |
|
|
|
> |
|
|
|
<el-col :span="4" align="center" class="thead td" |
|
|
|
><span class="cell">小项内容</span></el-col |
|
|
|
> |
|
|
|
<el-col :span="1" align="center" class="thead td" |
|
|
|
><span class="cell">分值</span></el-col |
|
|
|
> |
|
|
|
<el-col :span="2" align="center" class="thead td" |
|
|
|
><span class="cell">牵头部门</span></el-col |
|
|
|
> |
|
|
|
<el-col :span="2" align="center" class="thead td" |
|
|
|
><span class="cell">责任领导</span></el-col |
|
|
|
> |
|
|
|
<el-col :span="3" align="center" class="thead td" |
|
|
|
><span class="cell">其他牵头部门</span></el-col |
|
|
|
> |
|
|
|
<el-col :span="3" align="center" class="thead td" |
|
|
|
><span class="cell">责任领导</span></el-col |
|
|
|
> |
|
|
|
<el-col :span="3" align="center" class="thead td" |
|
|
|
><span class="cell">配合部门</span></el-col |
|
|
|
> |
|
|
|
<el-col :span="3" align="center" class="thead td" |
|
|
|
><span class="cell">责任领导</span></el-col |
|
|
|
> |
|
|
|
<el-col :span="2" align="center" class="thead td" |
|
|
|
><span class="cell">操作</span></el-col |
|
|
|
> |
|
|
|
</el-row> |
|
|
|
</div> |
|
|
|
<div class="body"> |
|
|
|
<el-row |
|
|
|
type="flex" |
|
|
|
v-for="(item, index) of detailList" |
|
|
|
:key="index" |
|
|
|
> |
|
|
|
<el-col :span="1" align="center" class="thead td" |
|
|
|
><span class="cell">{{ index + 1 }}</span></el-col |
|
|
|
> |
|
|
|
<el-col :span="4" align="center" class="thead td" |
|
|
|
><span class="cell"> |
|
|
|
<el-input |
|
|
|
type="textarea" |
|
|
|
placeholder="请输入小项内容" |
|
|
|
v-model="item.itemContent" |
|
|
|
v-if="item.edit || item.add" |
|
|
|
:row="5" |
|
|
|
></el-input> |
|
|
|
<span v-else>{{ item.itemContent }}</span> |
|
|
|
</span></el-col |
|
|
|
> |
|
|
|
<el-col :span="1" align="center" class="thead td" |
|
|
|
><span class="cell"> |
|
|
|
<el-input |
|
|
|
placeholder="请输入分值" |
|
|
|
v-if="item.edit || item.add" |
|
|
|
v-model="item.points" |
|
|
|
></el-input> |
|
|
|
<span v-else>{{ item.points }}</span> |
|
|
|
</span></el-col |
|
|
|
> |
|
|
|
<el-col :span="2" align="center" class="thead td" |
|
|
|
><span class="cell"> |
|
|
|
<treeselect |
|
|
|
:disable-branch-nodes="true" |
|
|
|
@input="changePrincipal($event, 'leader')" |
|
|
|
v-if="item.edit || item.add" |
|
|
|
v-model="form.leaderDept" |
|
|
|
:options="formatDep" |
|
|
|
placeholder="请选择牵头部门" |
|
|
|
:defaultExpandLevel="1" |
|
|
|
:normalizer=" |
|
|
|
(d) => { |
|
|
|
return { |
|
|
|
id: d.id, |
|
|
|
label: d.name, |
|
|
|
children: |
|
|
|
d.children && d.children.length > 0 |
|
|
|
? d.children |
|
|
|
: undefined, |
|
|
|
}; |
|
|
|
} |
|
|
|
" |
|
|
|
/> |
|
|
|
<span v-else> |
|
|
|
<pre>{{ item.leaderDeptList | formatList }}</pre> |
|
|
|
</span> |
|
|
|
</span></el-col |
|
|
|
> |
|
|
|
<el-col :span="2" align="center" class="thead td" |
|
|
|
><span class="cell"> |
|
|
|
<treeselect |
|
|
|
:disable-branch-nodes="true" |
|
|
|
:disable="true" |
|
|
|
v-if="item.edit || item.add" |
|
|
|
v-model="form.leaderPrincipal" |
|
|
|
:options="principalList" |
|
|
|
placeholder="请选择牵头部门责任领导" |
|
|
|
:defaultExpandLevel="1" |
|
|
|
:normalizer=" |
|
|
|
(d) => { |
|
|
|
return { |
|
|
|
id: d.id, |
|
|
|
label: d.realname, |
|
|
|
children: |
|
|
|
d.children && d.children.length > 0 |
|
|
|
? d.children |
|
|
|
: undefined, |
|
|
|
}; |
|
|
|
} |
|
|
|
" |
|
|
|
/> |
|
|
|
<span v-else> |
|
|
|
<pre>{{ item.leaderPrincipalList | formatList }}</pre> |
|
|
|
</span> |
|
|
|
</span></el-col |
|
|
|
> |
|
|
|
<el-col :span="3" align="center" class="thead td" |
|
|
|
><span class="cell"> |
|
|
|
<treeselect |
|
|
|
:disable-branch-nodes="true" |
|
|
|
v-if="item.edit || item.add" |
|
|
|
@input="changePrincipal($event, 'other')" |
|
|
|
:multiple="true" |
|
|
|
v-model="form.otherDept" |
|
|
|
:options="formatDep" |
|
|
|
placeholder="请选择其他牵头部门" |
|
|
|
:defaultExpandLevel="1" |
|
|
|
:normalizer=" |
|
|
|
(d) => { |
|
|
|
return { |
|
|
|
id: d.id, |
|
|
|
label: d.name, |
|
|
|
children: |
|
|
|
d.children && d.children.length > 0 |
|
|
|
? d.children |
|
|
|
: undefined, |
|
|
|
}; |
|
|
|
} |
|
|
|
" |
|
|
|
/> |
|
|
|
<span v-else> |
|
|
|
<pre>{{ item.otherDeptList | formatList }}</pre> |
|
|
|
</span> |
|
|
|
</span></el-col |
|
|
|
> |
|
|
|
<el-col :span="3" align="center" class="thead td" |
|
|
|
><span class="cell"> |
|
|
|
<treeselect |
|
|
|
:disable-branch-nodes="true" |
|
|
|
:disabled="true" |
|
|
|
v-if="item.edit || item.add" |
|
|
|
:multiple="true" |
|
|
|
v-model="form.otherPrincipal" |
|
|
|
:options="principalList" |
|
|
|
placeholder="请选择牵头部门责任领导" |
|
|
|
:defaultExpandLevel="1" |
|
|
|
:normalizer=" |
|
|
|
(d) => { |
|
|
|
return { |
|
|
|
id: d.id, |
|
|
|
label: d.realname, |
|
|
|
children: |
|
|
|
d.children && d.children.length > 0 |
|
|
|
? d.children |
|
|
|
: undefined, |
|
|
|
}; |
|
|
|
} |
|
|
|
" |
|
|
|
/> |
|
|
|
<span v-else> |
|
|
|
<pre>{{ item.otherPrincipalList | formatList }}</pre> |
|
|
|
</span> |
|
|
|
</span></el-col |
|
|
|
> |
|
|
|
<el-col :span="3" align="center" class="thead td" |
|
|
|
><span class="cell"> |
|
|
|
<treeselect |
|
|
|
:disable-branch-nodes="true" |
|
|
|
@input="changePrincipal($event, 'cooperate')" |
|
|
|
v-if="item.edit || item.add" |
|
|
|
:multiple="true" |
|
|
|
v-model="form.cooperateDept" |
|
|
|
:options="formatDep" |
|
|
|
placeholder="请选择配合部门" |
|
|
|
:defaultExpandLevel="1" |
|
|
|
:normalizer=" |
|
|
|
(d) => { |
|
|
|
return { |
|
|
|
id: d.id, |
|
|
|
label: d.name, |
|
|
|
children: |
|
|
|
d.children && d.children.length > 0 |
|
|
|
? d.children |
|
|
|
: undefined, |
|
|
|
}; |
|
|
|
} |
|
|
|
" |
|
|
|
/> |
|
|
|
<span v-else> |
|
|
|
<pre>{{ item.cooperateDeptList | formatList }}</pre> |
|
|
|
</span> |
|
|
|
</span></el-col |
|
|
|
> |
|
|
|
<el-col :span="3" align="center" class="thead td" |
|
|
|
><span class="cell"> |
|
|
|
<treeselect |
|
|
|
:disable-branch-nodes="true" |
|
|
|
v-if="item.edit || item.add" |
|
|
|
:multiple="true" |
|
|
|
:disabled="true" |
|
|
|
v-model="form.cooperatePrincipal" |
|
|
|
:options="principalList" |
|
|
|
placeholder="请选择配合部门责任领导" |
|
|
|
:defaultExpandLevel="1" |
|
|
|
:normalizer=" |
|
|
|
(d) => { |
|
|
|
return { |
|
|
|
id: d.id, |
|
|
|
label: d.realname, |
|
|
|
children: |
|
|
|
d.children && d.children.length > 0 |
|
|
|
? d.children |
|
|
|
: undefined, |
|
|
|
}; |
|
|
|
} |
|
|
|
" |
|
|
|
/> |
|
|
|
<span v-else> |
|
|
|
<pre>{{ item.cooperatePrincipalList | formatList }}</pre> |
|
|
|
</span> |
|
|
|
</span></el-col |
|
|
|
> |
|
|
|
<el-col :span="2" align="center" class="thead td" |
|
|
|
><span class="cell"> |
|
|
|
<template v-if="item.add || item.edit"> |
|
|
|
<el-link |
|
|
|
@click="add(item)" |
|
|
|
icon="el-icon-edit" |
|
|
|
type="primary" |
|
|
|
:underline="false" |
|
|
|
>保存</el-link |
|
|
|
> |
|
|
|
<el-link |
|
|
|
@click="remove('cancel', index, item)" |
|
|
|
icon="el-icon-edit" |
|
|
|
type="primary" |
|
|
|
:underline="false" |
|
|
|
>取消</el-link |
|
|
|
> |
|
|
|
</template> |
|
|
|
|
|
|
|
<template v-else> |
|
|
|
<el-link |
|
|
|
@click="change('edit', index, item)" |
|
|
|
icon="el-icon-edit" |
|
|
|
type="primary" |
|
|
|
:underline="false" |
|
|
|
>编辑</el-link |
|
|
|
> |
|
|
|
<el-popconfirm |
|
|
|
title="确定要删除此表格？" |
|
|
|
@confirm="remove('delete', item.id)" |
|
|
|
class="ele-action" |
|
|
|
> |
|
|
|
<el-link |
|
|
|
slot="reference" |
|
|
|
icon="el-icon-delete" |
|
|
|
type="danger" |
|
|
|
:underline="false" |
|
|
|
>删除</el-link |
|
|
|
> |
|
|
|
</el-popconfirm> |
|
|
|
</template> |
|
|
|
</span></el-col |
|
|
|
> |
|
|
|
</el-row> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<!-- <div class="line"></div> --> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div slot="footer" class="footer"> |
|
|
|
<el-button @click="close">返回</el-button> |
|
|
|
@@ -382,6 +679,7 @@ export default { |
|
|
|
tableLoading: false, |
|
|
|
form: {}, |
|
|
|
reducing: false, |
|
|
|
tableHeight: document.documentElement.clientHeight - 750, |
|
|
|
}; |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
@@ -481,7 +779,7 @@ export default { |
|
|
|
this.tableLoading = false; |
|
|
|
}); |
|
|
|
}, |
|
|
|
change(type, index) { |
|
|
|
change(type, index, row) { |
|
|
|
if (!this.reducing) { |
|
|
|
if (type == "add") { |
|
|
|
this.form = {}; |
|
|
|
@@ -642,21 +940,33 @@ export default { |
|
|
|
}); |
|
|
|
} |
|
|
|
}, |
|
|
|
remove(id) { |
|
|
|
this.allLoading = true; |
|
|
|
this.getApi() |
|
|
|
.deleteItem(id) |
|
|
|
.then((res) => { |
|
|
|
this.$message({ type: "success", message: "删除小项成功" }); |
|
|
|
this.getData(); |
|
|
|
}) |
|
|
|
.catch((e) => { |
|
|
|
console.log(e); |
|
|
|
this.$message.error("删除小项失败"); |
|
|
|
}) |
|
|
|
.finally(() => { |
|
|
|
this.allLoading = false; |
|
|
|
}); |
|
|
|
remove(type, id, row) { |
|
|
|
if (type == "delete") { |
|
|
|
this.allLoading = true; |
|
|
|
this.getApi() |
|
|
|
.deleteItem(id) |
|
|
|
.then((res) => { |
|
|
|
this.$message({ type: "success", message: "删除小项成功" }); |
|
|
|
this.getData(); |
|
|
|
}) |
|
|
|
.catch((e) => { |
|
|
|
console.log(e); |
|
|
|
this.$message.error("删除小项失败"); |
|
|
|
}) |
|
|
|
.finally(() => { |
|
|
|
this.allLoading = false; |
|
|
|
}); |
|
|
|
} |
|
|
|
if (type == "cancel") { |
|
|
|
this.reducing = false; |
|
|
|
if (row.add) { |
|
|
|
this.$set(this.detailList[id], "add", null); |
|
|
|
this.detailList.splice(id, 1); |
|
|
|
} |
|
|
|
if (row.edit) { |
|
|
|
this.$set(this.detailList[id], "edit", null); |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
}; |
|
|
|
@@ -670,24 +980,45 @@ export default { |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
} |
|
|
|
.body { |
|
|
|
border-left: 1px solid rgb(201, 201, 201); |
|
|
|
border-top: 1px solid rgb(201, 201, 201); |
|
|
|
.base-body { |
|
|
|
border-left: 1px solid rgb(237, 237, 237); |
|
|
|
border-top: 1px solid rgb(237, 237, 237); |
|
|
|
max-width: 1200px; |
|
|
|
background: #fff; |
|
|
|
} |
|
|
|
.header { |
|
|
|
border-top: 1px solid rgb(237, 237, 237); |
|
|
|
border-left: 1px solid rgb(237, 237, 237); |
|
|
|
color: #262626; |
|
|
|
background-color: #fafafa; |
|
|
|
} |
|
|
|
.el-row { |
|
|
|
align-items: stretch; |
|
|
|
} |
|
|
|
.table{ |
|
|
|
overflow-x: scroll; |
|
|
|
} |
|
|
|
.table .el-row:hover { |
|
|
|
background: #fafafa; |
|
|
|
} |
|
|
|
.el-col { |
|
|
|
border-bottom: 1px solid rgb(201, 201, 201); |
|
|
|
border-right: 1px solid rgb(201, 201, 201); |
|
|
|
border-bottom: 1px solid rgb(237, 237, 237); |
|
|
|
border-right: 1px solid rgb(237, 237, 237); |
|
|
|
text-align: center; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: center; |
|
|
|
padding: 10px; |
|
|
|
} |
|
|
|
.body { |
|
|
|
border-left: 1px solid rgb(237, 237, 237); |
|
|
|
position: relative; |
|
|
|
width: calc(100%+16px); |
|
|
|
box-sizing: border-box; |
|
|
|
} |
|
|
|
.scroll-x{ |
|
|
|
min-width:1500px; |
|
|
|
} |
|
|
|
.grey { |
|
|
|
background: #eeeeee; |
|
|
|
} |
|
|
|
@@ -695,10 +1026,5 @@ export default { |
|
|
|
margin-top: 20px; |
|
|
|
text-align: center; |
|
|
|
} |
|
|
|
/deep/ .cell, |
|
|
|
.el-table, |
|
|
|
/deep/ .el-table__body-wrapper, |
|
|
|
.el-card { |
|
|
|
overflow: visible; |
|
|
|
} |
|
|
|
|
|
|
|
</style> |
YF-yuan
3 年前