|
|
@@ -1,61 +1,70 @@
|
|
|
<template>
|
|
|
- <div class="bgColorSz">
|
|
|
- <el-tabs v-model="activeName" class="abc">
|
|
|
- <el-tab-pane label="我的" name="second">
|
|
|
- <div align="right" style="margin-right: 1%;"><el-button size="mini" type="primary" @click="create_test(form)">新建团队</el-button></div>
|
|
|
- <div align="center" style="margin: 1%;">
|
|
|
- <el-table :data="tableData" max-height="590" :header-cell-style="{ background: '#F0F2F4', color: '#333B4A' }" size="mini" border align="center" :show-overflow-tooltip="true">
|
|
|
- <el-table-column label="团队名称" min-width="120" align="center"><template slot-scope="scope">{{ scope.row.names }}</template></el-table-column>
|
|
|
- <el-table-column label="我的角色" min-width="120" align="center"><template slot-scope="scope">{{ scope.row.address }}</template></el-table-column>
|
|
|
- <el-table-column label="成员名单" min-width="120" align="center"><template slot-scope="scope">{{ scope.row.date }}</template></el-table-column>
|
|
|
- <el-table-column label="操作" align="center">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-button size="mini" type="primary" plain @click="update_test(scope.row)">编辑</el-button>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- </div>
|
|
|
- </el-tab-pane>
|
|
|
-
|
|
|
- <el-tab-pane label="全部" name="third">
|
|
|
- <div align="right" style="margin-right: 1%;"><el-button size="mini" type="primary" @click="create_test(form)">新建团队</el-button></div>
|
|
|
- <div align="center" style="margin: 1%;">
|
|
|
- <el-table :data="tableData" max-height="590" :header-cell-style="{ background: '#F0F2F4', color: '#333B4A' }" size="mini" width="80%" border show-overflow-tooltip="true">
|
|
|
- <el-table-column label="团队名称" min-width="120" align="center"><template slot-scope="scope">{{ scope.row.names }}</template></el-table-column>
|
|
|
- <el-table-column label="团队属性" min-width="120" align="center"><template slot-scope="scope">{{ scope.row.address1 }}</template></el-table-column>
|
|
|
- <el-table-column label="成员名单" min-width="120" align="center">
|
|
|
- <template slot-scope="scope">
|
|
|
- <span>{{ scope.row.date }}<span style="color: red; margin-left: 2%;" /></span><br>
|
|
|
- <span>{{ scope.row.date }}<span style="color: red; margin-left: 2%;">Lerader</span></span><br>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="操作" align="center">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-button size="mini" type="primary" plain @click="update_test(scope.row)">编辑</el-button>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- </div>
|
|
|
- </el-tab-pane>
|
|
|
- </el-tabs>
|
|
|
+ <div class="1hao" style="height: calc(100vh - 80px);background-color:#F2F3F6;display:flex;align-items: center;justify-content: center;">
|
|
|
+ <div class="2hao" style="height: 96%;width: 98%;background-color: white;overflow: auto;border-radius:8px;">
|
|
|
+ <el-tabs v-model="activeName" class="abc" @tab-click="handleClick">
|
|
|
+ <el-tab-pane label="我的" name="second">
|
|
|
+ <div align="right" style="margin-right: 1%;"><el-button size="mini" type="primary" @click="create_test(form)">新建团队</el-button></div>
|
|
|
+ <div align="center" style="margin: 1%;">
|
|
|
+ <el-table :data="tableData" :header-cell-style="{ background: '#F0F2F4', color: '#333B4A' }" size="mini" border align="center" :show-overflow-tooltip="true">
|
|
|
+ <el-table-column label="团队名称" min-width="120" align="center"><template slot-scope="scope">{{ scope.row.teamName }}</template></el-table-column>
|
|
|
+ <el-table-column label="我的角色" min-width="120" align="center"><template slot-scope="scope">{{ scope.row.teamAttribute[0] }}</template></el-table-column>
|
|
|
+ <el-table-column label="成员名单" min-width="120" align="center"><template slot-scope="scope">{{ scope.row.date }}</template></el-table-column>
|
|
|
+ <el-table-column label="操作" align="center">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button size="mini" type="primary" plain @click="update_test(scope.row)">编辑</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <el-pagination :current-page.sync="currentPage1" :page-size="100" background layout="total, prev, pager, next" :total="total" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
|
|
|
+ </div>
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane label="全部" name="third">
|
|
|
+ <div align="right" style="margin-right: 1%;"><el-button size="mini" type="primary" @click="create_test(form)">新建团队</el-button></div>
|
|
|
+ <div align="center" style="margin: 1%;">
|
|
|
+ <el-table :data="tableData" :header-cell-style="{ background: '#F0F2F4', color: '#333B4A' }" size="mini" width="80%" border show-overflow-tooltip="true">
|
|
|
+ <el-table-column label="团队名称" min-width="120" align="center"><template slot-scope="scope">{{ scope.row.teamName }}</template></el-table-column>
|
|
|
+ <el-table-column label="团队属性" min-width="120" align="center"><template slot-scope="scope">{{ scope.row.teamAttribute[0] }}, {{ scope.row.teamAttribute[1] }}</template></el-table-column>
|
|
|
+ <el-table-column label="成员名单" min-width="120" align="center">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span v-for="item in scope.row.memberName" :key="item">{{ item }}<span style="color: red; margin-left: 2%;">Lerader</span><br></span>
|
|
|
+ <span v-for="(item, index) in scope.row.memberName1" :key="index">{{ item }}<br></span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" align="center">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button size="mini" type="primary" plain @click="update_test(scope.row)">编辑</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <el-pagination :current-page.sync="currentPage1" :page-size="100" background layout="total, prev, pager, next" :total="total" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
|
|
|
+ </div>
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+ </div>
|
|
|
<el-dialog title="新建团队" :visible.sync="dialogFormVisible" width="30%" center>
|
|
|
<el-form ref="form" label-position="left" :model="form" :rules="rules" label-width="110px">
|
|
|
- <el-form-item label="团队名称" prop="address">
|
|
|
- <el-input v-model="form.address" autocomplete="off" placeholder="请输入团队名称，不得超过20个汉字" />
|
|
|
+ <el-form-item label="团队名称" prop="teamName">
|
|
|
+ <el-input v-model="form.teamName" autocomplete="off" placeholder="请输入团队名称，不得超过20个汉字" @blur="blur_teamName(form.teamName)" />
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="团队属性" prop="address1">
|
|
|
- <el-select v-model="form.address1" style="width: 100%;" placeholder="请选择">
|
|
|
- <el-option v-for="item in array_tim" :key="item.code" :label="item.name" :value="item.code" />
|
|
|
+ <el-form-item label="团队属性" prop="teamAttribute">
|
|
|
+ <el-select v-model="form.teamAttribute" style="width: 100%;" placeholder="请选择">
|
|
|
+ <el-option v-for="item in arr_team" :key="item.code" :label="item.msg" :value="item.code" />
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="团队Lerader">
|
|
|
- <el-select v-model="form.name" multiple collapse-tags filterable style="width: 100%;" placeholder="请输入姓名或者邮箱前缀">
|
|
|
- <el-option v-for="item in array_tim" :key="item.code" :label="item.name" :value="item.code" />
|
|
|
+ <el-select v-model="form.lerader" style="width: 100%;" multiple filterable remote reserve-keyword placeholder="请输入姓名或者邮箱前缀" :remote-method="remoteMethod" :loading="loading" @change="team_lerader(form.lerader)">
|
|
|
+ <el-option v-for="item in options" :key="item.empId" :label="item.name" :value="test2(item, 1)">
|
|
|
+ <span style="float: left">{{ item.name }}</span>
|
|
|
+ <span style="float: right; color: #8492a6; font-size: 13px,">{{ item.idap }}</span>
|
|
|
+ </el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="团队成员" prop="dates">
|
|
|
- <el-select v-model="form.dates" multiple collapse-tags filterable style="width: 100%;" placeholder="请输入姓名或者邮箱前缀">
|
|
|
- <el-option v-for="item in array_tim" :key="item.code" :label="item.name" :value="item.code" />
|
|
|
+ <el-select v-model="form.dates" style="width: 100%;" multiple filterable remote reserve-keyword placeholder="请输入姓名或者邮箱前缀" :remote-method="remoteMethod" :loading="loading" @change="team_dates(form.dates)">
|
|
|
+ <el-option v-for="item in options" :key="item.empId" :label="item.name" :value="test2(item, 0)">
|
|
|
+ <span style="float: left">{{ item.name }}</span>
|
|
|
+ <span style="float: right; color: #8492a6; font-size: 13px,">{{ item.idap }}</span>
|
|
|
+ </el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
@@ -68,7 +77,7 @@
|
|
|
</template>
|
|
|
<script>
|
|
|
|
|
|
-// import { } from '@/api/workbench'
|
|
|
+import { teamCreateTeam, memberQueryMemberInfoByIDAPorName, teamQueryTeamInfoList, configShowTeamAndMemberEnum, teamIsTeamNameRepetition } from '@/api/configure'
|
|
|
|
|
|
export default {
|
|
|
name: 'PersonalWorkbench',
|
|
|
@@ -78,29 +87,91 @@ export default {
|
|
|
bizJson: localStorage.getItem('key'),
|
|
|
dialogFormVisible: false,
|
|
|
activeName: 'second',
|
|
|
+ currentPage1: 1,
|
|
|
gridData: [],
|
|
|
+ arr_team: [],
|
|
|
rules: {
|
|
|
- address: [{ required: true, message: '团队名称不能为空', trigger: 'change' }, { max: 20, message: '团队名称，不得超过20个汉字', trigger: 'blur' }],
|
|
|
- address1: [{ required: true, message: '团队属性不能为空', trigger: 'change' }],
|
|
|
- // name: [{ required: true, message: '团队Lerader不能为空', trigger: ['blur', 'change'] }],
|
|
|
+ teamName: [{ required: true, message: '团队名称不能为空', trigger: 'change' }, { max: 20, message: '团队名称，不得超过20个汉字', trigger: 'blur' }],
|
|
|
+ teamAttribute: [{ required: true, message: '团队属性不能为空', trigger: 'change' }],
|
|
|
dates: [{ required: true, message: '团队成员不能为空', trigger: ['blur', 'change'] }]
|
|
|
},
|
|
|
- array_tim: [{ code: '1', name: '汝瑞' }, { code: '2', name: '秦志鹏' }, { code: '3', name: '赵杰' }],
|
|
|
+ teamRoleEnum: [],
|
|
|
+ teamMemberRelateInfos: [],
|
|
|
form: {},
|
|
|
- tableData: []
|
|
|
+ tableData: [],
|
|
|
+ options: [],
|
|
|
+ lerader: [],
|
|
|
+ tates: [],
|
|
|
+ depid: [],
|
|
|
+ loading: false,
|
|
|
+ test: {},
|
|
|
+ arry: [],
|
|
|
+ arr: [],
|
|
|
+ total: 0,
|
|
|
+ curIndex: 1,
|
|
|
+ pageSize: 15
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
- this.haha()
|
|
|
+ this.get_select()
|
|
|
+ this.get_list(this.userInformation)
|
|
|
},
|
|
|
methods: {
|
|
|
- haha() {
|
|
|
- var arr = { dates: ['2'], date: '秦志鹏', names: '两轮车B端', name: ['1'], address: 'rd qa pm', address1: '不知道' }
|
|
|
- for (var i = 0; i <= 60; i++) {
|
|
|
- this.tableData.push(arr)
|
|
|
+ // 获取团队人员信息
|
|
|
+ test2(item, e) {
|
|
|
+ if (typeof this.test[item.idap] === 'undefined') {
|
|
|
+ item.role = e
|
|
|
+ this.test[item.idap] = item
|
|
|
+ }
|
|
|
+ return item.idap
|
|
|
+ },
|
|
|
+ // 获得list
|
|
|
+ get_list(e) {
|
|
|
+ var arr = { memberIDAP: e, curIndex: this.curIndex, pageSize: this.pageSize }
|
|
|
+ teamQueryTeamInfoList(arr).then(res => {
|
|
|
+ if (res.code === 200 && res.data.list !== null) {
|
|
|
+ res.data.list.map(item => {
|
|
|
+ this.teamRoleEnum.map(item1 => {
|
|
|
+ item.teamAttribute[0] === item1.code ? item.teamAttribute[0] = item1.msg : ''
|
|
|
+ item.teamAttribute[1] === item1.code ? item.teamAttribute[1] = item1.msg : ''
|
|
|
+ })
|
|
|
+ item.memberName = []
|
|
|
+ item.memberName1 = []
|
|
|
+ item.teamLeaderRelateInfoResponseList.map(item2 => {
|
|
|
+ item.memberName.push(item2.memberName)
|
|
|
+ })
|
|
|
+ item.teamMemberRelateInfoResponseList.map(item3 => {
|
|
|
+ item.memberName1.push(item3.memberName)
|
|
|
+ })
|
|
|
+ this.tableData = res.data.list
|
|
|
+ })
|
|
|
+ this.total = res.data.total
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ remoteMethod(query) {
|
|
|
+ if (query !== '') {
|
|
|
+ this.loading = true
|
|
|
+ setTimeout(() => {
|
|
|
+ this.loading = false
|
|
|
+ memberQueryMemberInfoByIDAPorName({ memberIDAP: query }).then(res => {
|
|
|
+ this.options = res.data
|
|
|
+ })
|
|
|
+ }, 200)
|
|
|
+ } else {
|
|
|
+ this.options = []
|
|
|
}
|
|
|
},
|
|
|
|
|
|
+ // 团队名称重复
|
|
|
+ blur_teamName(e) {
|
|
|
+ teamIsTeamNameRepetition({ teamName: e }).then(res => {
|
|
|
+ if (res.data === true) {
|
|
|
+ this.$set(this.form, 'teamName', '')
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
// 点击新增按钮
|
|
|
create_test() {
|
|
|
this.dialogFormVisible = true
|
|
|
@@ -119,13 +190,71 @@ export default {
|
|
|
this.form = e
|
|
|
},
|
|
|
|
|
|
+ // 改变lerader
|
|
|
+ team_lerader(e) {
|
|
|
+ this.form.arr = []
|
|
|
+ for (const i in e) {
|
|
|
+ this.form.arr.push(this.test[e[i]])
|
|
|
+ }
|
|
|
+ this.arr = this.form.arr.map(item => {
|
|
|
+ return { memberIDAP: item.idap, department: item.deptid, role: 1 }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 改变成员
|
|
|
+ team_dates(e) {
|
|
|
+ this.form.arry = []
|
|
|
+ for (const i in e) {
|
|
|
+ this.form.arry.push(this.test[e[i]])
|
|
|
+ }
|
|
|
+ this.arry = this.form.arry.map(item => {
|
|
|
+ return { memberIDAP: item.idap, department: item.deptid, role: 0 }
|
|
|
+ })
|
|
|
+ console.log(this.arry)
|
|
|
+ },
|
|
|
+
|
|
|
// 创建团队
|
|
|
Preservation(form) {
|
|
|
this.$refs['form'].validate((valid) => {
|
|
|
if (valid) {
|
|
|
- console.log(form)
|
|
|
+ var team = {
|
|
|
+ teamName: form.teamName,
|
|
|
+ teamAttribute: form.teamAttribute,
|
|
|
+ teamMemberRelateInfoRequests: this.arr.concat(this.arry),
|
|
|
+ creator: this.userInformation,
|
|
|
+ modifier: this.userInformation
|
|
|
+ }
|
|
|
+ teamCreateTeam(team).then(res => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ this.dialogFormVisible = false
|
|
|
+ this.$message({ message: res.msg, type: 'success' })
|
|
|
+ } else {
|
|
|
+ this.dialogFormVisible = true
|
|
|
+ this.$message({ message: res.msg, type: 'error' })
|
|
|
+ }
|
|
|
+ })
|
|
|
}
|
|
|
})
|
|
|
+ },
|
|
|
+ // 切换（我的/全部）
|
|
|
+ handleClick(tab, event) {
|
|
|
+ tab.index === '0' ? this.get_list(this.userInformation) : this.get_list()
|
|
|
+ },
|
|
|
+ // 分页
|
|
|
+ handleSizeChange(val) {
|
|
|
+ console.log(`每页 ${val} 条`)
|
|
|
+ },
|
|
|
+ handleCurrentChange(val) {
|
|
|
+ console.log(`当前页: ${val}`)
|
|
|
+ },
|
|
|
+
|
|
|
+ get_select() { // 获取下拉菜单数据
|
|
|
+ configShowTeamAndMemberEnum().then(res => {
|
|
|
+ this.teamRoleEnum = res.data.teamRoleEnum // 团队属性
|
|
|
+ this.memberRoleEnum = res.data.memberRoleEnum // lerader
|
|
|
+ this.arr_team = this.teamRoleEnum.filter(item => {
|
|
|
+ return item.code <= 3
|
|
|
+ })
|
|
|
+ })
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
@@ -134,29 +263,15 @@ export default {
|
|
|
.abc .el-tabs__nav-wrap::after {
|
|
|
background-color:#FFFFFF !important;
|
|
|
}
|
|
|
- .bgColorSz .el-tabs__nav-scroll {
|
|
|
- padding: 1% 2% 0 1% !important;
|
|
|
+ .abc .el-tabs__nav-scroll {
|
|
|
+ padding: 0% 2% 0 1% !important;
|
|
|
}
|
|
|
.bgColorSz .el-dialog {
|
|
|
border-radius: 8px;
|
|
|
}
|
|
|
</style>
|
|
|
<style scoped>
|
|
|
- .abc {
|
|
|
- background:#FFFFFF;
|
|
|
- border-radius:8px;
|
|
|
- margin: 0 1%;
|
|
|
- width: 100%;
|
|
|
- height: 97%;
|
|
|
- }
|
|
|
-
|
|
|
- .bgColorSz {
|
|
|
- width: 100%;
|
|
|
- height: calc(100vh - 50px);
|
|
|
- background: #F2F3F6;
|
|
|
- font-size: 0.9rem;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
+ .el-select-dropdown.is-multiple .el-select-dropdown__item.selected::after {
|
|
|
+ display: none;
|
|
|
}
|
|
|
</style>
|
qinzhipeng_v
