|
|
|
@ -1,13 +1,39 @@ |
|
|
|
<template> |
|
|
|
<div style="display: flex"> |
|
|
|
<el-table :data="personnelUnit.personnelgrouping" style="width: 100%"> |
|
|
|
<el-table-column prop="index" label="序号" width=""> </el-table-column> |
|
|
|
<el-table-column prop="displayName" label="分组编号" width=""> |
|
|
|
<el-table |
|
|
|
:data="personnelUnit.personnelgrouping" |
|
|
|
style="width: 100%" |
|
|
|
row-key="id" |
|
|
|
highlight-current-row |
|
|
|
@row-click="clickoncolumn" |
|
|
|
class="el-table__body-wrapper tbody" |
|
|
|
> |
|
|
|
<el-table-column type="index" label="序号" width=""> </el-table-column> |
|
|
|
<el-table-column prop="displayName" label="名称" width=""> |
|
|
|
</el-table-column> |
|
|
|
|
|
|
|
<el-table-column prop="creatorName" label="创建者"> </el-table-column> |
|
|
|
<el-table-column prop="" label="创建时间"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
{{ scope.row.creationTime | dateFormat }} |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
|
|
|
|
<el-table-column prop="forSexId" label="性别"> </el-table-column> |
|
|
|
<el-table-column prop="maritalStatusId" label="婚姻状况"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="groupname" label="分组名称"> </el-table-column> |
|
|
|
<el-table-column prop="sex" label="性别"> </el-table-column> |
|
|
|
<el-table-column prop="maritalstatus" label="婚姻状况"> </el-table-column> |
|
|
|
<el-table-column prop="price" label="价格"> </el-table-column> |
|
|
|
<el-table-column label="操作"> |
|
|
|
<template> |
|
|
|
<el-tag |
|
|
|
class="move" |
|
|
|
style="cursor: move; margin-left: 15px" |
|
|
|
draggable="true" |
|
|
|
> |
|
|
|
<i class="el-icon-d-caret" style="width: 1rem; height: 1rem"></i> |
|
|
|
</el-tag> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
<div style="margin-top: 3%; margin-left: 10px"> |
|
|
|
<div style="margin-left: 10px; margin-top: 5%"> |
|
|
|
@ -18,7 +44,18 @@ |
|
|
|
<el-button type="success" @click="editgroup">编辑</el-button> |
|
|
|
</div> |
|
|
|
<div style="margin-top: 10px"> |
|
|
|
<el-button type="danger">删除</el-button> |
|
|
|
<el-button type="danger" @click="deletegroup">删除</el-button> |
|
|
|
</div> |
|
|
|
<div style="margin-top: 10px"> |
|
|
|
<el-button type="primary" @click="topping">置顶</el-button> |
|
|
|
</div> |
|
|
|
<div style="margin-top: 10px"> |
|
|
|
<el-button type="primary" @click="bottoming">置低</el-button> |
|
|
|
</div> |
|
|
|
<div style="margin-top: 10px"> |
|
|
|
<el-button type="primary" @click="sortok" :disabled="isshow" |
|
|
|
>确定</el-button |
|
|
|
> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@ -102,11 +139,13 @@ |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
<script> |
|
|
|
import { getapi, postapi } from "@/api/api"; |
|
|
|
import Sortable from "sortablejs"; |
|
|
|
import { getapi, postapi, putapi, deletapi } from "@/api/api"; |
|
|
|
import { mapState } from "vuex"; |
|
|
|
export default { |
|
|
|
data() { |
|
|
|
return { |
|
|
|
isshow: true, |
|
|
|
title: 1, |
|
|
|
form: { |
|
|
|
displayName: "", |
|
|
|
@ -122,36 +161,123 @@ export default { |
|
|
|
forSexId: [], //性别id |
|
|
|
maritalStatusId: [], //婚姻状况 |
|
|
|
dialogVisible: false, |
|
|
|
tableData: [ |
|
|
|
{ |
|
|
|
index: "2", |
|
|
|
groupnumber: "33", |
|
|
|
groupname: "全部", |
|
|
|
sex: "男", |
|
|
|
maritalstatus: "未婚", |
|
|
|
price: "0", |
|
|
|
}, |
|
|
|
{ |
|
|
|
index: "1", |
|
|
|
groupnumber: "2fd", |
|
|
|
groupname: "全部", |
|
|
|
sex: "女", |
|
|
|
maritalstatus: "已婚", |
|
|
|
price: "0", |
|
|
|
}, |
|
|
|
], |
|
|
|
tableData: [], |
|
|
|
initTableData: [], |
|
|
|
// tableData: [ |
|
|
|
|
|
|
|
// ], |
|
|
|
}; |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
...mapState(["personnelUnit"]), |
|
|
|
}, |
|
|
|
created() { |
|
|
|
|
|
|
|
this.rowDrop(); |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
mounted() { |
|
|
|
//console.log('00000',this.personnelUnit.id); |
|
|
|
|
|
|
|
}, |
|
|
|
methods: { |
|
|
|
//确定排序 |
|
|
|
sortok() { |
|
|
|
const result = []; |
|
|
|
this.tableData.forEach((item, index) => { |
|
|
|
// index 从0开始的， 你的displayOrder从大到小排 |
|
|
|
console.log(item.id); |
|
|
|
// const currentDisplayOrder = this.tableData.length -1 |
|
|
|
const currentDisplayOrder = this.initTableData[index].displayOrder; |
|
|
|
if (item.displayOrder != currentDisplayOrder) { |
|
|
|
// 如果它的displayOrder和它当前所在的位置不同代表挪动过位置 |
|
|
|
result.push({ id: item.id, displayOrder: currentDisplayOrder }); |
|
|
|
} |
|
|
|
}); |
|
|
|
putapi("/api/app/customerorggroup/updatesortmany", { |
|
|
|
itemList: result, |
|
|
|
}).then((res) => { |
|
|
|
this.$message.success("操作成功"); |
|
|
|
this.isshow = true; |
|
|
|
this.getlist(); |
|
|
|
}); |
|
|
|
}, |
|
|
|
//初始化Sortable组件 |
|
|
|
rowDrop() { |
|
|
|
this.$nextTick(() => { |
|
|
|
const tbody = document.querySelector(".el-table__body-wrapper tbody"); |
|
|
|
const _this = this; |
|
|
|
Sortable.create(tbody, { |
|
|
|
handle: ".move", |
|
|
|
animation: 300, |
|
|
|
onEnd({ newIndex, oldIndex }) { |
|
|
|
_this.isshow = false; |
|
|
|
const currRow = _this.tableData.splice(oldIndex, 1)[0]; |
|
|
|
_this.tableData.splice(newIndex, 0, currRow); |
|
|
|
_this.tableData.map((item, index) => { |
|
|
|
if (index == newIndex && index == oldIndex) { |
|
|
|
} else if (index == oldIndex) { |
|
|
|
} else if (index == newIndex) { |
|
|
|
} |
|
|
|
}); |
|
|
|
console.log(_this.tableData.map((item) => item.displayOrder)); |
|
|
|
}, |
|
|
|
}); |
|
|
|
}); |
|
|
|
}, |
|
|
|
getlist() { |
|
|
|
getapi( |
|
|
|
`/api/app/customer-org-group/in-customer-org-id/${this.personnelUnit.id}` |
|
|
|
).then((res) => { |
|
|
|
this.tableData = res.data; |
|
|
|
this.personnelUnit.personnelgrouping = res.data; |
|
|
|
this.initTableData = [...res.data]; |
|
|
|
}); |
|
|
|
}, |
|
|
|
//置低 |
|
|
|
bottoming() { |
|
|
|
if (this.form.id == undefined) { |
|
|
|
this.$message.warning("请选择操作的数据"); |
|
|
|
} else { |
|
|
|
putapi( |
|
|
|
`/api/app/customerorggroup/updatemanysort?id=${this.form.id}&SortType=2` |
|
|
|
).then((res) => { |
|
|
|
this.$message.success("操作成功"); |
|
|
|
this.getlist(); |
|
|
|
}); |
|
|
|
} |
|
|
|
}, |
|
|
|
//置顶 |
|
|
|
topping() { |
|
|
|
if (this.form.id == undefined) { |
|
|
|
this.$message.warning("请选择操作的数据"); |
|
|
|
} else { |
|
|
|
putapi( |
|
|
|
`/api/app/customerorggroup/updatemanysort?id=${this.form.id}&SortType=1` |
|
|
|
).then((res) => { |
|
|
|
this.$message.success("操作成功"); |
|
|
|
this.getlist(); |
|
|
|
}); |
|
|
|
} |
|
|
|
}, |
|
|
|
//删除 |
|
|
|
deletegroup() { |
|
|
|
if (this.form.id == undefined) { |
|
|
|
this.$message.warning("请选择需要操作的数据"); |
|
|
|
} else { |
|
|
|
deletapi(`/api/app/customer-org-group/${this.form.id}`).then((res) => { |
|
|
|
this.$message.success("删除成功"); |
|
|
|
}); |
|
|
|
} |
|
|
|
}, |
|
|
|
//点击当前列 |
|
|
|
clickoncolumn(row) { |
|
|
|
getapi(`/api/app/customer-org-group/${row.id}`).then((res) => { |
|
|
|
this.form = res.data; |
|
|
|
}); |
|
|
|
//获取已选组合项目列表 |
|
|
|
getapi(`/api/app/customer-org-group-detail/customer-org-group-detail-in-asbitem?CustomerOrgGroupId=${this.form.id}`).then(res=>{ |
|
|
|
console.log(res,'ssssss'); |
|
|
|
}) |
|
|
|
}, |
|
|
|
//编辑弹框 |
|
|
|
editgroup() { |
|
|
|
this.title = 2; |
|
|
|
@ -183,18 +309,42 @@ export default { |
|
|
|
jobTitle: this.form.jobTitle, |
|
|
|
remark: this.form.remark, |
|
|
|
}; |
|
|
|
postapi("/api/app/customer-org-group", obj).then((res) => { |
|
|
|
postapi( |
|
|
|
`/api/app/customer-org-group/in-customer-org-id/${this.personnelUnit.id}`, |
|
|
|
obj |
|
|
|
).then((res) => { |
|
|
|
this.$message.success("新增成功"); |
|
|
|
this.dialogVisible = false; |
|
|
|
}); |
|
|
|
} else if (this.title == 2) { |
|
|
|
let obj = { |
|
|
|
displayName: this.form.displayName, |
|
|
|
price: Number(this.form.price), |
|
|
|
forSexId: this.form.forSexId, |
|
|
|
maritalStatusId: this.form.maritalStatusId, |
|
|
|
ageLowerLimit: Number(this.form.ageLowerLimit), |
|
|
|
ageUpperLimit: Number(this.form.ageUpperLimit), |
|
|
|
jobPost: this.form.jobPost, |
|
|
|
jobTitle: this.form.jobTitle, |
|
|
|
remark: this.form.remark, |
|
|
|
}; |
|
|
|
putapi(`/api/app/customer-org-group/${this.form.id}`, obj).then( |
|
|
|
(res) => { |
|
|
|
this.$message.success("修改成功"); |
|
|
|
this.dialogVisible = false; |
|
|
|
} |
|
|
|
); |
|
|
|
} |
|
|
|
}, |
|
|
|
//新增弹框 |
|
|
|
groupaddtion() { |
|
|
|
console.log(this.personnelUnit.id); |
|
|
|
this.dialogVisible = true; |
|
|
|
this.title = 1; |
|
|
|
this.obtainsuperior(); |
|
|
|
if (this.personnelUnit.id == "") { |
|
|
|
this.$message.warning("请选择单位"); |
|
|
|
} else { |
|
|
|
this.dialogVisible = true; |
|
|
|
this.title = 1; |
|
|
|
this.obtainsuperior(); |
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
}; |
mch
2 years ago