|
@@ -3,38 +3,58 @@
|
|
<div class="nowuser">
|
|
<div class="nowuser">
|
|
<p class="correlationbox-title">当前操作用户:</p>
|
|
<p class="correlationbox-title">当前操作用户:</p>
|
|
<div class="userlist">
|
|
<div class="userlist">
|
|
- <PersonalPhoto style="cursor: pointer;" name="陈明洋" width="40px" height="40px" fontSize="12px" class="pigpicture"></PersonalPhoto>
|
|
|
|
- <p class="userlist-name">陈明洋</p>
|
|
|
|
|
|
+ <div class="photobox">
|
|
|
|
+ <PersonalPhoto style="cursor: pointer;" :name="nowUsers.name" width="40px" height="40px" fontSize="12px" class="pigpicture" v-if="!nowUsers.picture"></PersonalPhoto>
|
|
|
|
+ <el-image style="width: 40px; height: 40px;border-radius:50%" :src="nowUsers.picture" fit="fill" v-else></el-image>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="userlist-name">{{nowUsers.name}}({{nowUsers.mobile}})</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<p class="correlationbox-title">目前用户所关联学校:</p>
|
|
<p class="correlationbox-title">目前用户所关联学校:</p>
|
|
- <div class="possessbox" v-if="tableDatas.length >=1">
|
|
|
|
- <el-table :data="tableDatas" style="width: 100%" height="20vh" size="small">
|
|
|
|
- <el-table-column fixed prop="date" label="名称" />
|
|
|
|
- <el-table-column prop="date" label="学校简码" />
|
|
|
|
- <el-table-column prop="name" label="版本" />
|
|
|
|
- <el-table-column prop="name" label="目前顾问" />
|
|
|
|
|
|
+ <div class="possessbox" v-if="nowUsers.handleSchools.length >0">
|
|
|
|
+ <el-table :data="nowUsers.handleSchools" style="width: 100%" height="20vh" size="small">
|
|
|
|
+ <el-table-column :label="$t(`personnelManagement.personnelTable.headportrait`)" align="center">
|
|
|
|
+ <template #default="scope">
|
|
|
|
+ <el-image style="width: 40px; height: 40px;" :src="scope.row.picture" fit="fill"></el-image>
|
|
|
|
+ </template>
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column fixed prop="name" label="名称" />
|
|
|
|
+ <el-table-column prop="id" label="学校简码" />
|
|
|
|
+ <!-- <el-table-column prop="name" label="版本" />
|
|
|
|
+ <el-table-column prop="name" label="目前顾问" /> -->
|
|
<el-table-column fixed="right" label="操作" width='80'>
|
|
<el-table-column fixed="right" label="操作" width='80'>
|
|
<template #default="scope">
|
|
<template #default="scope">
|
|
- <el-button type="text" size="small" @click="removeSchool(scope.$index,tableData)">取消关联</el-button>
|
|
|
|
|
|
+ <el-button type="text" size="small" @click="removeSchool(scope.row,scope.$index)">取消关联</el-button>
|
|
</template>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-table>
|
|
</div>
|
|
</div>
|
|
- <div class="nodata" v-else-if="tableDatas.length ==0">
|
|
|
|
|
|
+ <div class="nodata" v-else-if="nowUsers.handleSchools.length ===0">
|
|
<div>暂无关联学校</div>
|
|
<div>暂无关联学校</div>
|
|
</div>
|
|
</div>
|
|
<div class="school-list">
|
|
<div class="school-list">
|
|
- <p class="correlationbox-title">学校列表:</p>
|
|
|
|
|
|
+ <div class="school-list-header">
|
|
|
|
+ <div class="correlationbox-titles">学校列表:</div>
|
|
|
|
+ <div class="correlationbox-btn">
|
|
|
|
+ <el-button type="primary" size="small" v-if="multipleSchool.length >0" @click="multipleCorrelation">关联选中学校</el-button>
|
|
|
|
+ <el-button type="primary" size="small" v-else-if="multipleSchool.length ===0" disabled>关联选中学校</el-button>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
<div class="listbox">
|
|
<div class="listbox">
|
|
- <el-table :data="tableData" style="width: 100%" height="40vh" size="small">
|
|
|
|
- <el-table-column fixed prop="date" label="名称" />
|
|
|
|
- <el-table-column prop="date" label="学校简码" />
|
|
|
|
- <el-table-column prop="name" label="版本" />
|
|
|
|
- <el-table-column prop="name" label="目前顾问" />
|
|
|
|
|
|
+ <el-table :data="tableData" style="width: 100%" height="40vh" size="small" @selection-change="checkSchool">
|
|
|
|
+ <el-table-column type="selection" />
|
|
|
|
+ <el-table-column :label="$t(`personnelManagement.personnelTable.headportrait`)" align="center">
|
|
|
|
+ <template #default="scope">
|
|
|
|
+ <el-image style="width: 40px; height: 40px;" :src="scope.row.picture" fit="fill"></el-image>
|
|
|
|
+ </template>
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column fixed prop="name" label="名称" />
|
|
|
|
+ <el-table-column prop="id" label="学校简码" />
|
|
|
|
+ <!-- <el-table-column prop="name" label="版本" /> -->
|
|
|
|
+ <el-table-column prop="assisName" label="目前顾问" />
|
|
<el-table-column fixed="right" label="操作" width='80'>
|
|
<el-table-column fixed="right" label="操作" width='80'>
|
|
<template #default="scope">
|
|
<template #default="scope">
|
|
- <el-button type="text" size="small" @click="correlation(scope.$index,tableData)">关联学校</el-button>
|
|
|
|
|
|
+ <el-button type="text" size="small" @click="correlation(scope.row,tableData)">关联学校</el-button>
|
|
</template>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-table>
|
|
@@ -43,98 +63,154 @@
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
<script>
|
|
<script>
|
|
-import { ref, getCurrentInstance } from 'vue'
|
|
|
|
|
|
+import { ref, getCurrentInstance, watch } from 'vue'
|
|
import { ElMessage, ElLoading, ElMessageBox } from 'element-plus'
|
|
import { ElMessage, ElLoading, ElMessageBox } from 'element-plus'
|
|
export default {
|
|
export default {
|
|
- setup() {
|
|
|
|
|
|
+ props: {
|
|
|
|
+ userdata: {
|
|
|
|
+ type: Object,
|
|
|
|
+ default: () => {},
|
|
|
|
+ },
|
|
|
|
+ },
|
|
|
|
+ setup(props) {
|
|
let { proxy } = getCurrentInstance()
|
|
let { proxy } = getCurrentInstance()
|
|
const tableDatas = ref([])
|
|
const tableDatas = ref([])
|
|
- const tableData = [
|
|
|
|
- {
|
|
|
|
- date: '2016-05-03',
|
|
|
|
- name: 'Tom',
|
|
|
|
- address: 'No. 189, Grove St, Los Angeles',
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- date: '2016-05-02',
|
|
|
|
- name: 'Tom',
|
|
|
|
- address: 'No. 189, Grove St, Los Angeles',
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- date: '2016-05-04',
|
|
|
|
- name: 'Tom',
|
|
|
|
- address: 'No. 189, Grove St, Los Angeles',
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- date: '2016-05-01',
|
|
|
|
- name: 'Tom',
|
|
|
|
- address: 'No. 189, Grove St, Los Angeles',
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- date: '2016-05-01',
|
|
|
|
- name: 'Tom',
|
|
|
|
- address: 'No. 189, Grove St, Los Angeles',
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- date: '2016-05-01',
|
|
|
|
- name: 'Tom',
|
|
|
|
- address: 'No. 189, Grove St, Los Angeles',
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- date: '2016-05-01',
|
|
|
|
- name: 'Tom',
|
|
|
|
- address: 'No. 189, Grove St, Los Angeles',
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- date: '2016-05-01',
|
|
|
|
- name: 'Tom',
|
|
|
|
- address: 'No. 189, Grove St, Los Angeles',
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- date: '2016-05-01',
|
|
|
|
- name: 'Tom',
|
|
|
|
- address: 'No. 189, Grove St, Los Angeles',
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- date: '2016-05-01',
|
|
|
|
- name: 'Tom',
|
|
|
|
- address: 'No. 189, Grove St, Los Angeles',
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- date: '2016-05-01',
|
|
|
|
- name: 'Tom',
|
|
|
|
- address: 'No. 189, Grove St, Los Angeles',
|
|
|
|
- },
|
|
|
|
- ]
|
|
|
|
|
|
+ let tableData = ref([])
|
|
|
|
+ let nowUsers = ref()
|
|
|
|
+ let multipleSchool = ref([])
|
|
|
|
+ function getSchoolList() {
|
|
|
|
+ proxy.$api
|
|
|
|
+ .getSchooldata({})
|
|
|
|
+ .then((res) => {
|
|
|
|
+ console.log(res, '学校的返回列表')
|
|
|
|
+ // res.state === 200 ? (tableData.value = res.schoolAssists) : ''
|
|
|
|
+ if (res.state === 200) {
|
|
|
|
+ for (let i in res.schoolAssists) {
|
|
|
|
+ if (res.schoolAssists[i].assists) {
|
|
|
|
+ res.schoolAssists[i].assisName = ''
|
|
|
|
+ let datas = res.schoolAssists[i].assists
|
|
|
|
+ for (let y in datas) {
|
|
|
|
+ res.schoolAssists[i].assisName = res.schoolAssists[i].assisName + datas[y].tmdName + ','
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ tableData.value = res.schoolAssists
|
|
|
|
+ processingSchool()
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ .catch((err) => {
|
|
|
|
+ ElMessage.error('获取学校列表失败')
|
|
|
|
+ })
|
|
|
|
+ }
|
|
function correlation(value, data) {
|
|
function correlation(value, data) {
|
|
- ElMessageBox.confirm(`请问您确定将 用户123 设为 成都锦江区外国语小学 顾问,进行数据关联吗 ?`, '关联学校', {
|
|
|
|
|
|
+ console.log(value, data)
|
|
|
|
+ ElMessageBox.confirm(`请问您确定将 ${nowUsers.value.name} 设为 ${value.name} 顾问,进行数据关联吗 ?`, '关联学校', {
|
|
confirmButtonText: proxy.$t(`commonMsg.confirm`),
|
|
confirmButtonText: proxy.$t(`commonMsg.confirm`),
|
|
cancelButtonText: proxy.$t(`commonMsg.closes`),
|
|
cancelButtonText: proxy.$t(`commonMsg.closes`),
|
|
type: 'success',
|
|
type: 'success',
|
|
center: true,
|
|
center: true,
|
|
}).then(() => {
|
|
}).then(() => {
|
|
- tableDatas.value.push({
|
|
|
|
- date: '2016-05-01',
|
|
|
|
- name: 'Tom',
|
|
|
|
- address: 'No. 189, Grove St, Los Angeles',
|
|
|
|
- })
|
|
|
|
- ElMessage.success('操作成功')
|
|
|
|
|
|
+ let schoolArr = [value.id]
|
|
|
|
+ let data = { partitionKey: nowUsers.value.partitionKey, userId: nowUsers.value.userId, tmdId: nowUsers.value.tmdId, schoolIds: schoolArr, busy: 'add' }
|
|
|
|
+ proxy.$api
|
|
|
|
+ .setAistschool(data)
|
|
|
|
+ .then((res) => {
|
|
|
|
+ console.log(res, '成功的返回')
|
|
|
|
+ res.state === 200
|
|
|
|
+ ? (nowUsers.value.handleSchools.push(value), getSchoolList(), processingSchool(), ElMessage.success('操作成功'))
|
|
|
|
+ : res.state === 201
|
|
|
|
+ ? (ElMessage.success('已关联,请勿重复操作'), getSchoolList())
|
|
|
|
+ : ''
|
|
|
|
+ })
|
|
|
|
+ .catch((error) => {
|
|
|
|
+ ElMessage.error('关联失败,API异常')
|
|
|
|
+ })
|
|
})
|
|
})
|
|
}
|
|
}
|
|
- function removeSchool(value, data) {
|
|
|
|
- console.log(value, data)
|
|
|
|
- ElMessageBox.confirm(`请问您确定将 用户123 与 成都锦江区外国语小学 取消关联吗 ?`, '取消关联', {
|
|
|
|
|
|
+ function removeSchool(value, index) {
|
|
|
|
+ console.log(value, index)
|
|
|
|
+ ElMessageBox.confirm(`请问您确定将 ${nowUsers.value.name} 与 ${value.name} 取消关联吗 ?`, '取消关联', {
|
|
confirmButtonText: proxy.$t(`commonMsg.confirm`),
|
|
confirmButtonText: proxy.$t(`commonMsg.confirm`),
|
|
cancelButtonText: proxy.$t(`commonMsg.closes`),
|
|
cancelButtonText: proxy.$t(`commonMsg.closes`),
|
|
type: 'error',
|
|
type: 'error',
|
|
center: true,
|
|
center: true,
|
|
}).then(() => {
|
|
}).then(() => {
|
|
- tableDatas.value.splice(value, 1)
|
|
|
|
- console.log(tableDatas)
|
|
|
|
- ElMessage.success('操作成功')
|
|
|
|
|
|
+ let schoolArr = [value.id]
|
|
|
|
+ let data = { partitionKey: nowUsers.value.partitionKey, userId: nowUsers.value.userId, tmdId: nowUsers.value.tmdId, schoolIds: schoolArr, busy: 'del' }
|
|
|
|
+ proxy.$api
|
|
|
|
+ .setAistschool(data)
|
|
|
|
+ .then((res) => {
|
|
|
|
+ res.state === 200 ? (nowUsers.value.handleSchools.splice(index, 1), getSchoolList(), processingSchool(), ElMessage.success('操作成功')) : ''
|
|
|
|
+ })
|
|
|
|
+ .catch((error) => {
|
|
|
|
+ ElMessage.error('取消关联失败,API异常')
|
|
|
|
+ })
|
|
})
|
|
})
|
|
}
|
|
}
|
|
- return { tableData, tableDatas, correlation, removeSchool }
|
|
|
|
|
|
+ function checkSchool(value, row) {
|
|
|
|
+ multipleSchool.value = value
|
|
|
|
+ console.log(multipleSchool.value, '111')
|
|
|
|
+ }
|
|
|
|
+ function multipleCorrelation() {
|
|
|
|
+ let schoolData = multipleSchool.value
|
|
|
|
+ let schoolName = ''
|
|
|
|
+ if (schoolData.length < 5) {
|
|
|
|
+ schoolData.forEach((item) => {
|
|
|
|
+ schoolName = schoolName + ',' + item.name
|
|
|
|
+ })
|
|
|
|
+ } else {
|
|
|
|
+ for (let i = 0; i < 5; i++) {
|
|
|
|
+ schoolName = schoolName + ',' + schoolData[i].name
|
|
|
|
+ }
|
|
|
|
+ schoolName = schoolName + '等...'
|
|
|
|
+ }
|
|
|
|
+ ElMessageBox.confirm(`请问您确定将 ${nowUsers.value.name} 设为 ${schoolName} 学校的顾问,进行数据关联吗 ?`, '关联学校', {
|
|
|
|
+ confirmButtonText: proxy.$t(`commonMsg.confirm`),
|
|
|
|
+ cancelButtonText: proxy.$t(`commonMsg.closes`),
|
|
|
|
+ type: 'success',
|
|
|
|
+ center: true,
|
|
|
|
+ }).then(() => {
|
|
|
|
+ let schoolArr = []
|
|
|
|
+ for (let i in schoolData) {
|
|
|
|
+ schoolArr.push(schoolData[i].id)
|
|
|
|
+ }
|
|
|
|
+ let data = { partitionKey: nowUsers.value.partitionKey, userId: nowUsers.value.userId, tmdId: nowUsers.value.tmdId, schoolIds: schoolArr, busy: 'add' }
|
|
|
|
+ proxy.$api
|
|
|
|
+ .setAistschool(data)
|
|
|
|
+ .then((res) => {
|
|
|
|
+ console.log(res, '成功的返回')
|
|
|
|
+ res.state === 200
|
|
|
|
+ ? ((nowUsers.value.handleSchools = nowUsers.value.handleSchools.concat(schoolData)), getSchoolList(), processingSchool(), ElMessage.success('操作成功'))
|
|
|
|
+ : res.state === 201
|
|
|
|
+ ? (ElMessage.success('已关联,请勿重复操作'), getSchoolList())
|
|
|
|
+ : ''
|
|
|
|
+ })
|
|
|
|
+ .catch((error) => {
|
|
|
|
+ ElMessage.error('关联失败,API异常')
|
|
|
|
+ })
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ function processingSchool() {
|
|
|
|
+ let allSchool = tableData.value
|
|
|
|
+ let handleSchools = nowUsers.value.handleSchools
|
|
|
|
+ for (let i in handleSchools) {
|
|
|
|
+ let schoolInfo = handleSchools[i].id
|
|
|
|
+ for (let s in allSchool) {
|
|
|
|
+ allSchool[s].id === schoolInfo ? allSchool.splice(s, 1) : ''
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ tableData.value = allSchool
|
|
|
|
+ }
|
|
|
|
+ watch(
|
|
|
|
+ props,
|
|
|
|
+ (newuser) => {
|
|
|
|
+ newuser ? (nowUsers.value = newuser.userdata) : ''
|
|
|
|
+ console.log(nowUsers.value, '触发监听')
|
|
|
|
+ },
|
|
|
|
+ { immediate: true, deep: true }
|
|
|
|
+ )
|
|
|
|
+ getSchoolList()
|
|
|
|
+ return { tableData, tableDatas, correlation, removeSchool, nowUsers, getSchoolList, checkSchool, multipleSchool, multipleCorrelation, processingSchool }
|
|
},
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
</script>
|
|
@@ -170,11 +246,49 @@ export default {
|
|
font-weight: 700;
|
|
font-weight: 700;
|
|
}
|
|
}
|
|
.userlist {
|
|
.userlist {
|
|
- width: 20%;
|
|
|
|
|
|
+ width: 100%;
|
|
text-align: center;
|
|
text-align: center;
|
|
|
|
+ display: flex;
|
|
|
|
+ justify-content: center;
|
|
|
|
+ align-items: center;
|
|
}
|
|
}
|
|
.userlist-name {
|
|
.userlist-name {
|
|
font-size: 14px;
|
|
font-size: 14px;
|
|
color: #7f8c8d;
|
|
color: #7f8c8d;
|
|
}
|
|
}
|
|
|
|
+.photobox {
|
|
|
|
+ display: inline-block;
|
|
|
|
+ width: 20%;
|
|
|
|
+ vertical-align: top;
|
|
|
|
+}
|
|
|
|
+.userlist-name {
|
|
|
|
+ text-align: left;
|
|
|
|
+ display: inline-block;
|
|
|
|
+ width: 45%;
|
|
|
|
+ vertical-align: top;
|
|
|
|
+ line-height: 40px;
|
|
|
|
+ margin-left: 0%;
|
|
|
|
+ font-size: 18px;
|
|
|
|
+}
|
|
|
|
+.school-list-header {
|
|
|
|
+ width: 100%;
|
|
|
|
+ display: flex;
|
|
|
|
+ justify-content: space-between;
|
|
|
|
+}
|
|
|
|
+.correlationbox-titles {
|
|
|
|
+ width: 50%;
|
|
|
|
+ font-size: 14px;
|
|
|
|
+ color: #b2bec3;
|
|
|
|
+ text-align: left;
|
|
|
|
+}
|
|
|
|
+.correlationbox-btn {
|
|
|
|
+ width: 50%;
|
|
|
|
+ text-align: right;
|
|
|
|
+}
|
|
|
|
+</style>
|
|
|
|
+<style>
|
|
|
|
+.school-list-header .el-button--small {
|
|
|
|
+ min-height: 25px;
|
|
|
|
+ padding: 7px 10px;
|
|
|
|
+}
|
|
</style>
|
|
</style>
|