|
@@ -11,7 +11,30 @@
|
|
|
size="mini"
|
|
|
round
|
|
|
style="float: left"
|
|
|
+ @click="openCreateTeam"
|
|
|
>创建团队</el-button>
|
|
|
+ <el-input
|
|
|
+ v-model="listQuery.name"
|
|
|
+ placeholder="团队名称"
|
|
|
+ prefix-icon="el-icon-search"
|
|
|
+ style="margin-left: 20px;width: 200px;"
|
|
|
+ clearable
|
|
|
+ class="filter-item"
|
|
|
+ />
|
|
|
+ <el-input
|
|
|
+ v-model="listQuery.cultivateName"
|
|
|
+ placeholder="上级领导"
|
|
|
+ prefix-icon="el-icon-search"
|
|
|
+ style="margin-left: 20px;width: 200px;"
|
|
|
+ clearable
|
|
|
+ class="filter-item"
|
|
|
+ />
|
|
|
+ <el-button style="margin-left: 20px;" class="filter-item" type="primary" round @click="searchList">
|
|
|
+ 搜索
|
|
|
+ </el-button>
|
|
|
+ <el-button class="filter-item" round type="warning" @click="resetSearch()">
|
|
|
+ 重置
|
|
|
+ </el-button>
|
|
|
</template>
|
|
|
<parentTable
|
|
|
v-loading="listLoading"
|
|
@@ -42,16 +65,10 @@
|
|
|
<el-button
|
|
|
class-name="filter-item"
|
|
|
name=""
|
|
|
- type="primary"
|
|
|
- round
|
|
|
- size="mini"
|
|
|
- >添加组员</el-button>
|
|
|
- <el-button
|
|
|
- class-name="filter-item"
|
|
|
- name=""
|
|
|
type="danger"
|
|
|
round
|
|
|
size="mini"
|
|
|
+ @click="removeMember(row.id)"
|
|
|
>移除组员</el-button>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
@@ -88,99 +105,127 @@
|
|
|
<el-button
|
|
|
class-name="filter-item"
|
|
|
name=""
|
|
|
+ type="primary"
|
|
|
+ round
|
|
|
+ size="mini"
|
|
|
+ @click="openAddMembers(row.id)"
|
|
|
+ >添加组员</el-button>
|
|
|
+ <el-button
|
|
|
+ class-name="filter-item"
|
|
|
+ name=""
|
|
|
type="danger"
|
|
|
round
|
|
|
size="mini"
|
|
|
+ @click="deleteInfo(row.id)"
|
|
|
>解散团队</el-button>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</parentTable>
|
|
|
</y-page-list-layout>
|
|
|
+ <el-dialog
|
|
|
+ width="600px"
|
|
|
+ title="新增团队"
|
|
|
+ :visible.sync="dialogFormVisible"
|
|
|
+ :close-on-click-modal="false"
|
|
|
+ >
|
|
|
+ <el-form
|
|
|
+ ref="dataForm"
|
|
|
+ v-loading="dialogLoading"
|
|
|
+ :rules="rules"
|
|
|
+ :model="team"
|
|
|
+ label-position="right"
|
|
|
+ label-width="110px"
|
|
|
+ style="width: 400px; margin-left:50px;"
|
|
|
+ >
|
|
|
+ <el-form-item label="团队名称:" prop="name">
|
|
|
+ <el-input v-model="team.name" class="filter-item"/>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item label="营销主管:" filterable prop="supervisorId">
|
|
|
+ <el-select v-model="team.supervisorId" filterable class="filter-item" style="float: left;width: 100%;" placeholder="请选择">
|
|
|
+ <el-option
|
|
|
+ v-for="s in supervisors"
|
|
|
+ :key="s.id"
|
|
|
+ :label="s.name"
|
|
|
+ :value="s.id"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
|
|
|
-<!-- <el-tabs v-model="activeName" @tab-click="handleClick" type="border-card">-->
|
|
|
-<!-- <el-tab-pane label="创建团队" name="first">-->
|
|
|
-<!-- <y-page-list-layout :page-list="pageData" :page-para="listQuery" :get-page-list="getList">-->
|
|
|
-<!-- <template slot="left">-->
|
|
|
-<!-- <el-button-->
|
|
|
-<!-- class="filter-item"-->
|
|
|
-<!-- style="margin-left: 10px;float: left;"-->
|
|
|
-<!-- type="primary"-->
|
|
|
-<!-- @click="searchList"-->
|
|
|
-<!-- round-->
|
|
|
-<!-- >搜索-->
|
|
|
-<!-- </el-button>-->
|
|
|
-<!-- <el-button-->
|
|
|
-<!-- class="filter-item"-->
|
|
|
-<!-- style="float: left;"-->
|
|
|
-<!-- round-->
|
|
|
-<!-- type="warning"-->
|
|
|
-<!-- @click="resetSearch()"-->
|
|
|
-<!-- >重置-->
|
|
|
-<!-- </el-button>-->
|
|
|
-<!-- </template>-->
|
|
|
-<!-- <parentTable-->
|
|
|
-<!-- v-loading="listLoading"-->
|
|
|
-<!-- :data="pageData.records"-->
|
|
|
-<!-- slot="table"-->
|
|
|
-<!-- style="width: 100%;"-->
|
|
|
-<!-- >-->
|
|
|
-<!-- <el-table-column label="组员姓名" align="center" width="220">-->
|
|
|
-<!-- <template slot-scope="{row}">-->
|
|
|
-<!-- <span>{{ row.userName }}</span>-->
|
|
|
-<!-- </template>-->
|
|
|
-<!-- </el-table-column>-->
|
|
|
-<!-- <el-table-column label="组员岗位" align="center" width="220">-->
|
|
|
-<!-- <template slot-scope="{row}">-->
|
|
|
-<!-- <span>{{ row.userPostName }}</span>-->
|
|
|
-<!-- </template>-->
|
|
|
-<!-- </el-table-column>-->
|
|
|
-<!-- <el-table-column label="上级组员" align="center" width="220">-->
|
|
|
-<!-- <template slot-scope="{row}">-->
|
|
|
-<!-- <span>{{ row.parentUserName }}</span>-->
|
|
|
-<!-- </template>-->
|
|
|
-<!-- </el-table-column>-->
|
|
|
-<!-- <el-table-column label="上级组员岗位" align="center" width="220">-->
|
|
|
-<!-- <template slot-scope="{row}">-->
|
|
|
-<!-- <span>{{ row.parentUserPostName }}</span>-->
|
|
|
-<!-- </template>-->
|
|
|
-<!-- </el-table-column>-->
|
|
|
-<!-- <el-table-column label="团队别名" align="center" width="220">-->
|
|
|
-<!-- <template slot-scope="{row}">-->
|
|
|
-<!-- <span>{{ row.alias }}</span>-->
|
|
|
-<!-- </template>-->
|
|
|
-<!-- </el-table-column>-->
|
|
|
-<!-- <el-table-column label="创建时间" align="center" width="220">-->
|
|
|
-<!-- <template slot-scope="{row}">-->
|
|
|
-<!-- <span>{{ row.created }}</span>-->
|
|
|
-<!-- </template>-->
|
|
|
-<!-- </el-table-column>-->
|
|
|
-<!-- <el-table-column label="操作" align="center" fixed="right">-->
|
|
|
-<!-- <template slot-scope="{row}">-->
|
|
|
-<!-- <!– <PermissionButton–>-->
|
|
|
-<!-- <!– menu-code="_views_market_customer_detail"–>-->
|
|
|
-<!-- <!– class-name="filter-item"–>-->
|
|
|
-<!-- <!– name=""–>-->
|
|
|
-<!-- <!– type="primary"–>-->
|
|
|
-<!-- <!– :page-jump="true"–>-->
|
|
|
-<!-- <!– :page-query="{id: row.id,listQuery:listQuery}"–>-->
|
|
|
-<!-- <!– round–>-->
|
|
|
-<!-- <!– size="mini"–>-->
|
|
|
-<!-- <!– />–>-->
|
|
|
-<!-- <!– <PermissionButton–>-->
|
|
|
-<!-- <!– menu-code="_views_market_customer_remove"–>-->
|
|
|
-<!-- <!– class-name="filter-item"–>-->
|
|
|
-<!-- <!– name=""–>-->
|
|
|
-<!-- <!– type="danger"–>-->
|
|
|
-<!-- <!– round–>-->
|
|
|
-<!-- <!– size="mini"–>-->
|
|
|
-<!-- <!– @click="deleteInfo(row.id)"–>-->
|
|
|
-<!-- <!– />–>-->
|
|
|
-<!-- </template>-->
|
|
|
-<!-- </el-table-column>-->
|
|
|
-<!-- </parentTable>-->
|
|
|
-<!-- </y-page-list-layout>-->
|
|
|
-<!-- </el-tab-pane>>-->
|
|
|
-<!-- </el-tabs>-->
|
|
|
+ <el-form-item label="上级经理:" filterable prop="cultivateId">
|
|
|
+ <el-select v-model="team.cultivateId" filterable class="filter-item" style="float: left;width: 100%;" placeholder="请选择">
|
|
|
+ <el-option
|
|
|
+ v-for="c in cultivater"
|
|
|
+ :key="c.id"
|
|
|
+ :label="c.name"
|
|
|
+ :value="c.id"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="">
|
|
|
+ <el-button @click="dialogFormVisible = false">
|
|
|
+ 取消
|
|
|
+ </el-button>
|
|
|
+ <el-button type="primary" @click="createData()">
|
|
|
+ 保存
|
|
|
+ </el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-dialog>
|
|
|
+ <el-dialog
|
|
|
+ width="800px"
|
|
|
+ title="添加组员"
|
|
|
+ :visible.sync="dialogFormVisible1"
|
|
|
+ :close-on-click-modal="false"
|
|
|
+ >
|
|
|
+ <y-page-list-layout :get-page-list="getAddMember">
|
|
|
+ <parentTable
|
|
|
+ ref="multipleTable"
|
|
|
+ v-loading="listLoading1"
|
|
|
+ :data="toAddMembers"
|
|
|
+ slot="table"
|
|
|
+ style="width: 100%;"
|
|
|
+ tooltip-effect="dark"
|
|
|
+ :selection-change="selectionChange"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ type="selection"
|
|
|
+ width="55">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="工号" align="center" width="150">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <span>{{ row.staffNo }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="姓名" align="center" width="150">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <span>{{ row.name }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="性别" align="center" width="150">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <span>{{ row.sex }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="所属部门-岗位" align="center">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <span v-for="(item, index) in row.departmentPostVOList" :key="index">
|
|
|
+ <span v-if="index > 0">、</span>
|
|
|
+ {{ item.departmentName }}-{{ item.postName }}
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </parentTable>
|
|
|
+ </y-page-list-layout>
|
|
|
+ <div slot="footer" class="dialog-footer" style="text-align: center">
|
|
|
+ <el-button @click="dialogFormVisible1 = false">
|
|
|
+ 取消
|
|
|
+ </el-button>
|
|
|
+ <el-button type="primary" @click="addMembers">
|
|
|
+ 保存
|
|
|
+ </el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
@@ -207,17 +252,47 @@
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
+ dialogFormVisible1:false,
|
|
|
+ toAddMembers:[],
|
|
|
+ listLoading1:false,
|
|
|
+ supervisors:[],
|
|
|
+ cultivater:[],
|
|
|
+ dialogFormVisible: false,
|
|
|
activeName: 'first',
|
|
|
tableKey: 0,
|
|
|
pageData: { records: [] },
|
|
|
total: 20,
|
|
|
listLoading: true,
|
|
|
+ dialogLoading: false,
|
|
|
+ team:{},
|
|
|
listQuery: {
|
|
|
page: 1,
|
|
|
size: 10,
|
|
|
descs: 'id',
|
|
|
departmentName:'市场部'
|
|
|
},
|
|
|
+ rules: {
|
|
|
+ name: [{
|
|
|
+ required: true,
|
|
|
+ message: '请填写团队名称',
|
|
|
+ trigger: 'blur'
|
|
|
+ }],
|
|
|
+ supervisorId: [{
|
|
|
+ required: true,
|
|
|
+ message: '请选择营销主管',
|
|
|
+ trigger: 'change'
|
|
|
+ }],
|
|
|
+ cultivateId: [{
|
|
|
+ required: true,
|
|
|
+ message: '请选择上级经理',
|
|
|
+ trigger: 'change'
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ multipleSelection:[],
|
|
|
+ addTeam:{
|
|
|
+ id:null,
|
|
|
+ memberIds:[]
|
|
|
+ }
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
@@ -228,43 +303,118 @@
|
|
|
that.getList();
|
|
|
},
|
|
|
methods: {
|
|
|
+ openAddMembers(teamId) {
|
|
|
+ this.addTeam = {};
|
|
|
+ this.addTeam.id = teamId;
|
|
|
+ this.dialogFormVisible1 = true;
|
|
|
+ this.getAddMember();
|
|
|
+ },
|
|
|
+ selectionChange(val){
|
|
|
+ this.multipleSelection = val;
|
|
|
+ console.log('arr', val)
|
|
|
+ },
|
|
|
+ addMembers(){
|
|
|
+ const members = this.multipleSelection;
|
|
|
+ const ids = [];
|
|
|
+ if (members.length>0){
|
|
|
+ members.forEach(item=>{
|
|
|
+ ids.push(item.id);
|
|
|
+ });
|
|
|
+ this.addTeam.memberIds = ids;
|
|
|
+ }else {
|
|
|
+ this.$notify({
|
|
|
+ title: '错误',
|
|
|
+ message: '团队成员不能为空',
|
|
|
+ type: 'error',
|
|
|
+ duration: 2000
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ this.$api.teamMember.add(Object.assign({}, this.addTeam,
|
|
|
+ )).then(res => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ this.$notify({
|
|
|
+ title: '成功',
|
|
|
+ message: '保存成功',
|
|
|
+ type: 'success',
|
|
|
+ duration: 2000
|
|
|
+ });
|
|
|
+ this.getList();
|
|
|
+ this.vLoading = false;
|
|
|
+ this.dialogFormVisible1 = false;
|
|
|
+ }
|
|
|
+ }).catch(() => {
|
|
|
+ this.vLoading = false;
|
|
|
+ this.dialogFormVisible1 = false;
|
|
|
+ })
|
|
|
+
|
|
|
+ },
|
|
|
+ getAddMember() {
|
|
|
+ const that = this;
|
|
|
+ this.listLoading = true;
|
|
|
+ this.$api.user
|
|
|
+ .postUserVOList("客户经理")
|
|
|
+ .then((res) => {
|
|
|
+ that.toAddMembers = res.data;
|
|
|
+ setTimeout(() => {
|
|
|
+ that.listLoading = false;
|
|
|
+ }, 200)
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ that.listLoading = false;
|
|
|
+ })
|
|
|
+ },
|
|
|
+ createData() {
|
|
|
+ this.$api.team.add(Object.assign({}, this.team,
|
|
|
+ )).then(res => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ this.$notify({
|
|
|
+ title: '成功',
|
|
|
+ message: '保存成功',
|
|
|
+ type: 'success',
|
|
|
+ duration: 2000
|
|
|
+ });
|
|
|
+ this.getList();
|
|
|
+ this.vLoading = false
|
|
|
+ this.dialogFormVisible = false;
|
|
|
+ }
|
|
|
+ }).catch(() => {
|
|
|
+ this.vLoading = false;
|
|
|
+ this.dialogFormVisible = false;
|
|
|
+ })
|
|
|
+ },
|
|
|
+ openCreateTeam(){
|
|
|
+ this.dialogFormVisible = true;
|
|
|
+ this.$api.user
|
|
|
+ .postUser("营销主管")
|
|
|
+ .then((res) => {
|
|
|
+ this.supervisors = res.data;
|
|
|
+ setTimeout(() => {
|
|
|
+ }, 200)
|
|
|
+ });
|
|
|
+
|
|
|
+ this.$api.user
|
|
|
+ .postUser("市场部经理")
|
|
|
+ .then((res) => {
|
|
|
+ this.cultivater = res.data;
|
|
|
+ setTimeout(() => {
|
|
|
+ }, 200)
|
|
|
+ })
|
|
|
+ },
|
|
|
resetSearch() {
|
|
|
this.$router.push({ query: {} });
|
|
|
this.listQuery = {
|
|
|
current: 1,
|
|
|
size: 10,
|
|
|
descs: 'id',
|
|
|
- }
|
|
|
+ departmentName:'市场部'
|
|
|
+ };
|
|
|
this.getList()
|
|
|
},
|
|
|
- removeHandle(row) {
|
|
|
- // console.log(data)
|
|
|
- const that = this
|
|
|
- that
|
|
|
- .$confirm('确认删除当前记录吗?', '警告', {
|
|
|
- confirmButtonText: '确认',
|
|
|
- cancelButtonText: '取消',
|
|
|
- type: 'warning',
|
|
|
- })
|
|
|
- .then(async () => {
|
|
|
- this.$api.customer.delete(row.id).then((res) => {
|
|
|
- if (res.code === 200) {
|
|
|
- this.$message({
|
|
|
- type: 'success',
|
|
|
- message: '删除成功',
|
|
|
- })
|
|
|
- this.getList()
|
|
|
- }
|
|
|
- })
|
|
|
- })
|
|
|
- .catch((err) => {
|
|
|
- console.error(err)
|
|
|
- })
|
|
|
- },
|
|
|
searchList() {
|
|
|
// 重置分页
|
|
|
- this.listQuery.page = 1
|
|
|
- this.listQuery.size = 10
|
|
|
+ this.listQuery.page = 1;
|
|
|
+ this.listQuery.size = 10;
|
|
|
this.getList()
|
|
|
},
|
|
|
getList() {
|
|
@@ -272,11 +422,11 @@
|
|
|
this.listLoading = true
|
|
|
// console.log(that.listQuery)
|
|
|
const key = {}
|
|
|
- key[this.listQueryKey] = this.listQuery.description
|
|
|
+ key[this.listQueryKey] = this.listQuery.description;
|
|
|
this.$api.team
|
|
|
.list(Object.assign({}, that.listQuery, key))
|
|
|
.then((res) => {
|
|
|
- that.pageData = res.data
|
|
|
+ that.pageData = res.data;
|
|
|
setTimeout(() => {
|
|
|
that.listLoading = false
|
|
|
}, 200)
|
|
@@ -285,6 +435,50 @@
|
|
|
that.listLoading = false
|
|
|
})
|
|
|
},
|
|
|
+ deleteInfo(id) {
|
|
|
+ const that = this;
|
|
|
+ that.$confirm('请确认是否解散改团队?', '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning',
|
|
|
+ center: true
|
|
|
+ }).then(() => {
|
|
|
+ that.$api.team.delete(id).then(data => {
|
|
|
+ that.loading = false
|
|
|
+ if (data.code === 200) {
|
|
|
+ that.getList()
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ type: 'error',
|
|
|
+ message: data.msg
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }).catch(() => {
|
|
|
+ })
|
|
|
+ },
|
|
|
+ removeMember(id) {
|
|
|
+ const that = this;
|
|
|
+ that.$confirm('请确认是否移除该组员?', '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning',
|
|
|
+ center: true
|
|
|
+ }).then(() => {
|
|
|
+ that.$api.teamMember.delete(id).then(data => {
|
|
|
+ that.loading = false
|
|
|
+ if (data.code === 200) {
|
|
|
+ that.getList()
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ type: 'error',
|
|
|
+ message: data.msg
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }).catch(() => {
|
|
|
+ })
|
|
|
+ }
|
|
|
},
|
|
|
}
|
|
|
</script>
|