¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <div> |
| | | <div style="display: flex;justify-content: space-between;"> |
| | | <el-form :model="entity" ref="entity" size="small" :inline="true"> |
| | | <el-form-item label="人ååç§°"> |
| | | <el-input v-model="entity.name" clearable></el-input> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button size="small" style="margin-left: 10px" @click="refresh()">é ç½®</el-button> |
| | | <el-button size="small" type="primary" @click="refreshTable()">æ¥ è¯¢</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | <div> |
| | | <el-button |
| | | :loading="outLoading" |
| | | size="small" |
| | | type="primary" |
| | | @click="handleDown">导åº</el-button> |
| | | <el-button size="small" type="primary" @click="openSelectUserDia">æ°å»º</el-button> |
| | | </div> |
| | | </div> |
| | | <div class="search-table"> |
| | | <el-table v-loading="tableLoading" :data="tableData" border height="calc(100vh - 21em)" style="width: 100%;"> |
| | | <el-table-column align="center" label="åºå·" type="index" width="60"></el-table-column> |
| | | <el-table-column label="åå·¥ç¼å·" prop="account" width="150"></el-table-column> |
| | | <el-table-column label="å§å" prop="name" width="120"></el-table-column> |
| | | <el-table-column label="ç±è´¯" prop="nativePlace" width="120"></el-table-column> |
| | | <el-table-column label="è¯ä»¶å°å" prop="idAddress" show-overflow-tooltip width="100"></el-table-column> |
| | | <el-table-column label="ææºå·" prop="telephone" show-overflow-tooltip width="100"></el-table-column> |
| | | <el-table-column label="æ¯ä¸é¢æ ¡" prop="graduatedInstitutions1" width="100"></el-table-column> |
| | | <el-table-column label="æå¦ä¸ä¸" prop="major1" width="100"></el-table-column> |
| | | <el-table-column label="æ¯ä¸æ¶é´" prop="graduationTime1" width="100"></el-table-column> |
| | | <el-table-column label="æé«å¦å" prop="officialAcademicRedentials" width="100"></el-table-column> |
| | | <el-table-column label="æé«å¦ä½" prop="highestDegree" width="100"></el-table-column> |
| | | <el-table-column label="èç§°" prop="professionalTitle" width="100"></el-table-column> |
| | | <el-table-column fixed="right" label="æä½" width="120" align="center"> |
| | | <template slot-scope="scope"> |
| | | <el-button size="small" type="text" @click="$emit('updatePerson', scope.row)">ç¼è¾</el-button> |
| | | <el-button size="small" type="text" @click="deletePerson(scope.row)" style="color: #f56c6c">å é¤</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <el-pagination |
| | | :current-page="1" |
| | | :current-page.sync="page.current" |
| | | :page-size="page.size" |
| | | :page-sizes="[10, 20, 30, 50, 100]" |
| | | :total="page.total" |
| | | background |
| | | layout="->,total, sizes, prev, pager, next, jumper" |
| | | style="margin-top: 16px" |
| | | @size-change="handleSizeChange" |
| | | @current-change="handleCurrentChange" |
| | | > |
| | | </el-pagination> |
| | | </div> |
| | | <el-dialog :visible.sync="selectUserDia" title="éæ©ç¨æ·" width="70%"> |
| | | <div class="search" style="margin-bottom: 9px;"> |
| | | <div class="search_thing"> |
| | | <div class="search_label">ç¨æ·åï¼</div> |
| | | <div class="search_input"> |
| | | <el-input |
| | | v-model="addUserTableInfo.name" |
| | | clearable |
| | | placeholder="请è¾å
¥" |
| | | size="small" |
| | | @change="selectUserList" |
| | | ></el-input> |
| | | </div> |
| | | <el-button size="small" style="margin-left: 10px" type="primary" @click="selectUserList">æ¥è¯¢</el-button> |
| | | </div> |
| | | </div> |
| | | <div v-if="selectUserDia" class="body" style="height: 60vh;"> |
| | | <lims-table :tableData="tableData1" :column="column1" |
| | | :isSelection="true" :handleSelectionChange="selectMethod" |
| | | :height="'calc(100vh - 290px)'" |
| | | :tableLoading="tableLoading1"></lims-table> |
| | | </div> |
| | | <span slot="footer" class="dialog-footer"> |
| | | <el-button @click="selectUserDia = false">å æ¶</el-button> |
| | | <el-button type="primary" @click="selectUser">ç¡® å®</el-button> |
| | | </span> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import {selectUserCondition} from "@/api/business/inspectionTask"; |
| | | import limsTable from "@/components/Table/lims-table.vue"; |
| | | import { |
| | | basicInformationOfPersonnelSelectPage, |
| | | delUserDepardLimsId, |
| | | exportPersonBasicInfo, |
| | | upUserDepardLimsId |
| | | } from "@/api/cnas/personal/personalList"; |
| | | import store from "@/store"; |
| | | import {Message} from "element-ui"; |
| | | |
| | | export default { |
| | | name: 'PersonnelList', |
| | | // import å¼å
¥çç»ä»¶éè¦æ³¨å
¥å°å¯¹è±¡ä¸æè½ä½¿ç¨ |
| | | components: {limsTable}, |
| | | props: { |
| | | departId: { |
| | | type: Number, |
| | | default: () => { |
| | | return null; |
| | | } |
| | | }, |
| | | isDepartment: { |
| | | type: Boolean, |
| | | default: false |
| | | }, |
| | | currentCompaniesList: { |
| | | type: Array, |
| | | default: [] |
| | | } |
| | | }, |
| | | data() { |
| | | // è¿éåæ¾æ°æ® |
| | | return { |
| | | page: { |
| | | size: 20, |
| | | current: 1, |
| | | }, |
| | | outLoading: false, |
| | | tableLoading: false, |
| | | tableData: [], // äººåæ»åè¡¨æ°æ® |
| | | tableData1: [], |
| | | tableLoading1: false, |
| | | column1: [ |
| | | {label: 'å§å', prop: 'name'}, |
| | | {label: 'è´¦å·', prop: 'account'}, |
| | | {label: 'è§è²', prop: 'roleName'}, |
| | | { |
| | | dataType: 'tag', |
| | | label: 'ç¶æ', |
| | | prop: 'status', |
| | | formatData: (params) => { |
| | | if (params == 0) { |
| | | return 'å¯ç¨' |
| | | } else { |
| | | return '' |
| | | } |
| | | }, |
| | | formatType: (params) => { |
| | | if (params == 0) { |
| | | return 'success' |
| | | } else { |
| | | return 'danger' |
| | | } |
| | | } |
| | | }, |
| | | {label: 'çµè¯å·ç ', prop: 'phone'}, |
| | | ], |
| | | page1: { |
| | | total:0, |
| | | size:10, |
| | | current:1 |
| | | }, |
| | | selectUserDia: false, // æ·»å 人åå¼¹æ¡ |
| | | entity: { |
| | | name: '', |
| | | orderBy: { |
| | | field: 'id', |
| | | order: 'asc' |
| | | } |
| | | }, |
| | | addUserTableInfo: { |
| | | name: null, |
| | | isCustom: 0, |
| | | }, |
| | | multipleSelection: [] |
| | | }; |
| | | }, |
| | | mounted() { |
| | | this.refreshTable(); |
| | | }, |
| | | // æ¹æ³éå |
| | | methods: { |
| | | /** |
| | | * @desc è·å设å¤id |
| | | */ |
| | | // éç½® |
| | | refresh() { |
| | | this.page = { |
| | | size: 20, |
| | | current: 1, |
| | | }; |
| | | this.entity.name = '' |
| | | this.refreshTable(); |
| | | }, |
| | | // æ¥è¯¢äººååè¡¨æ°æ® |
| | | refreshTable() { |
| | | this.tableLoading = true; |
| | | this.entity.departLimsId = this.departId; |
| | | const params = { |
| | | size: this.page.size, |
| | | current: this.page.current, |
| | | departmentId: this.entity.departLimsId, |
| | | name: this.entity.name, |
| | | } |
| | | basicInformationOfPersonnelSelectPage(params).then(res => { |
| | | this.tableLoading = false; |
| | | this.page.total = res.data.total; |
| | | this.tableData = res.data.records; |
| | | }).catch(err => { |
| | | this.tableLoading = false; |
| | | }) |
| | | }, |
| | | // å é¤äººå |
| | | deletePerson(row) { |
| | | this.$confirm('æ¯å¦å é¤å½åæ°æ®?', 'è¦å', { |
| | | confirmButtonText: 'ç¡®å®', |
| | | cancelButtonText: 'åæ¶', |
| | | type: 'warning' |
| | | }).then(() => { |
| | | delUserDepardLimsId({id: row.userId}).then(res => { |
| | | this.$message.success('å 餿å'); |
| | | this.refreshTable(); |
| | | this.$emit('refreshTree') |
| | | }).catch(e => { |
| | | this.$message.error('å é¤å¤±è´¥'); |
| | | }); |
| | | }).catch(() => { |
| | | }); |
| | | }, |
| | | handleSizeChange(val) { |
| | | this.page.size = val; |
| | | this.refreshTable(); |
| | | }, |
| | | handleCurrentChange(val) { |
| | | this.page.current = val; |
| | | this.refreshTable(); |
| | | }, |
| | | // æå¼æ°å¢äººåå¼¹æ¡ |
| | | openSelectUserDia () { |
| | | this.selectUserDia = true; |
| | | this.selectUserList() |
| | | }, |
| | | // æ¥è¯¢æ°å¢å¼¹æ¡ç人åå表 |
| | | selectUserList () { |
| | | this.tableLoading1 = true |
| | | selectUserCondition().then(res => { |
| | | this.tableLoading1 = false |
| | | this.tableData1 = res.data |
| | | }).catch(err => { |
| | | this.tableLoading1 = false |
| | | }) |
| | | }, |
| | | // è¡¨æ ¼éæ©æ¹æ³ |
| | | selectMethod(val) { |
| | | this.multipleSelection = val |
| | | }, |
| | | // æäº¤éè¦æ·»å ç人å |
| | | selectUser() { |
| | | if (!this.currentCompaniesList.length > 0) { |
| | | this.$message.warning("è¯·éæ©é¨é¨ï¼") |
| | | return; |
| | | } |
| | | let selects = this.HaveJson(this.multipleSelection) |
| | | if (selects.length === 0) { |
| | | this.$message.error('æªéæ©æ°æ®'); |
| | | return; |
| | | } |
| | | let ids = []; |
| | | selects.forEach(a => { |
| | | ids.push(a.id); |
| | | }); |
| | | let str = ''; |
| | | this.currentCompaniesList.forEach(a => { |
| | | if (a) { |
| | | str += a + ','; |
| | | } |
| | | }); |
| | | upUserDepardLimsId({ |
| | | ids: JSON.stringify(ids), |
| | | id: str |
| | | }).then(res => { |
| | | this.selectUserDia = false; |
| | | this.$message.success('æ·»å æå'); |
| | | this.refreshTable(); |
| | | this.$emit('refreshTree') |
| | | }); |
| | | }, |
| | | // 导åºäººåä¿¡æ¯ |
| | | handleDown() { |
| | | this.outLoading = true; |
| | | let entity = this.HaveJson(this.entity) |
| | | delete entity.orderBy; |
| | | exportPersonBasicInfo({...entity}).then(res => { |
| | | this.outLoading = false; |
| | | const blob = new Blob([res], {type: 'application/octet-stream'}); |
| | | this.$download.saveAs(blob, '人åä¿¡æ¯.xlsx') |
| | | this.$message.success('å¯¼åºæå') |
| | | }) |
| | | }, |
| | | }, |
| | | watch: { |
| | | departId: { |
| | | handler(newId, oldId) { |
| | | if (newId) { |
| | | this.page.current = 1 |
| | | this.refreshTable(); |
| | | } |
| | | } |
| | | } |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .search_thing { |
| | | display: flex; |
| | | align-items: center; |
| | | } |
| | | </style> |