| | |
| | | <!-- 奿©è®°å½ --> |
| | | <template> |
| | | <div> |
| | | <div style="text-align: left; margin-bottom: 15px;"> |
| | | <label>å§å</label> |
| | | <el-input v-model="search.userName" clearable placeholder="请è¾å
¥å
³é®å" size="small" style="width: 20vh;"></el-input> |
| | | <label style="margin-left: 1em">奿©æ¥æ</label> |
| | | <el-date-picker |
| | | v-model="search.searchTimeList" |
| | | :picker-options="pickerOptions" |
| | | align="right" |
| | | clearable |
| | | end-placeholder="ç»ææ¥æ" |
| | | format="yyyy-MM-dd" |
| | | range-separator="è³" |
| | | size="small" |
| | | start-placeholder="å¼å§æ¥æ" |
| | | style="width: 20%" |
| | | type="daterange" |
| | | unlink-panels |
| | | value-format="yyyy-MM-dd 00:00:00"> |
| | | </el-date-picker> |
| | | <el-button size="small" type="primary" @click="getPersonnelTraining(departId)">æ¥è¯¢</el-button> |
| | | <div style="float: right;"> |
| | | <el-button :loading="outLoading" size="small" type="primary" @click="handleDown">导åº</el-button> |
| | | <el-button size="small" type="primary" @click="addRow">æ°å¢</el-button> |
| | | <div class="view"> |
| | | <div style="display: flex;justify-content: space-between;"> |
| | | <el-form :model="search" ref="page" size="small" :inline="true"> |
| | | <el-form-item label="å§å"> |
| | | <el-input v-model="search.userName" clearable placeholder="请è¾å
¥å
³é®å" size="small" style="width: 20vh;"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="奿©æ¥æ"> |
| | | <el-date-picker |
| | | v-model="search.searchTimeList" |
| | | :picker-options="pickerOptions" |
| | | align="right" |
| | | clearable |
| | | end-placeholder="ç»ææ¥æ" |
| | | format="yyyy-MM-dd" |
| | | range-separator="è³" |
| | | size="small" |
| | | start-placeholder="å¼å§æ¥æ" |
| | | style="width: 100%" |
| | | type="daterange" |
| | | unlink-panels |
| | | value-format="yyyy-MM-dd 00:00:00"> |
| | | </el-date-picker> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button size="small" type="primary" @click="getPersonnelTraining(departId)">æ¥è¯¢</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="addRow">æ°å¢</el-button> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="table"> |
| | | <el-table :data="tableData" height="70vh" style="width: 100%"> |
| | | <el-table :data="tableData" v-loading="tableLoading" height="66.5vh" style="width: 100%"> |
| | | <el-table-column label="åºå·" type="index" width="120"> |
| | | <template v-slot="scope"> |
| | | <span>{{ (search.current - 1) * search.size + scope.$index + 1 }}</span> |
| | |
| | | </el-table-column> |
| | | <el-table-column label="å建人" min-width="180" prop="createUserName"> |
| | | </el-table-column> |
| | | <el-table-column fixed="right" label="æä½" width="100"> |
| | | <el-table-column fixed="right" label="æä½" width="100" align="center"> |
| | | <template v-slot="scope"> |
| | | <el-button size="small" type="text" @click="editForm(scope.row)">ç¼è¾</el-button> |
| | | <el-button size="small" type="text" @click="deleteRow(scope.row)">å é¤</el-button> |
| | | <el-button size="small" type="text" style="color: #f56c6c" @click="deleteRow(scope.row)">å é¤</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <el-pagination :current-page="1" :page-size="search.size" :page-sizes="[10, 20, 30, 50, 100]" |
| | | <el-pagination :current-page="1" :page-size="search.size" |
| | | :page-sizes="[10, 20, 30, 50, 100]" |
| | | :total="search.total" layout="->,total, sizes, prev, pager, next, jumper" |
| | | background |
| | | @size-change="handleSizeChange" |
| | | @current-change="handleCurrentChange"> |
| | | </el-pagination> |
| | | </div> |
| | | <el-dialog |
| | | :visible.sync="dialogVisible" |
| | | title="æç¤º" |
| | | title="奿©è®°å½" |
| | | width="50%" |
| | | @open="getUserList"> |
| | | <div style="height: 40vh"> |
| | |
| | | </el-form> |
| | | </div> |
| | | <span slot="footer" class="dialog-footer"> |
| | | <el-button @click="dialogVisible = false">å æ¶</el-button> |
| | | <el-button type="primary" @click="saveOrUpdate">ç¡® å®</el-button> |
| | | </span> |
| | | <el-button @click="dialogVisible = false">å æ¶</el-button> |
| | | <el-button type="primary" @click="saveOrUpdate">ç¡® å®</el-button> |
| | | </span> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import { |
| | | addOrUpdateRewardPunishment, deleteRewardPunishment, |
| | | rewardPunishmentExport, |
| | | rewardPunishmentPage |
| | | } from "@/api/cnas/personal/personRewardPunishmentRecord"; |
| | | import {selectUserCondition} from "@/api/system/user"; |
| | | import {delCustomById} from "@/api/system/customer"; |
| | | |
| | | export default { |
| | | props: { |
| | | departId: { |
| | |
| | | data() { |
| | | return { |
| | | tableData: [], |
| | | tableLoading: false, |
| | | search: { |
| | | size: 20, |
| | | current: 1, |
| | |
| | | this.getPersonnelTraining(this.departId); |
| | | }, |
| | | async getPersonnelTraining() { |
| | | const {code, data} = await this.$axios({ |
| | | method: 'get', |
| | | url: rewardPunishmentPageApi, |
| | | params: { |
| | | userId: this.isDepartment ? '' : this.departId, |
| | | const params = { |
| | | userId: this.isDepartment ? '' : this.departId, |
| | | departmentId: this.isDepartment ? this.departId : '', |
| | | current: this.search.curent, |
| | | size: this.search.size, |
| | | userName: this.search.userName, |
| | | startTime: this.search.searchTimeList && this.search.searchTimeList[0], |
| | | endTime: this.search.searchTimeList && this.search.searchTimeList[1], |
| | | } |
| | | }) |
| | | if (code == 200) { |
| | | this.tableData = data.records |
| | | this.search.total = data.total |
| | | } |
| | | this.tableLoading = true |
| | | rewardPunishmentPage(params).then(res => { |
| | | this.tableLoading = false |
| | | this.tableData = res.data.records |
| | | this.search.total = res.data.total |
| | | }).catch(err => { |
| | | this.tableLoading = false |
| | | }) |
| | | }, |
| | | addRow () { |
| | | this.dialogVisible = true |
| | |
| | | }, |
| | | handleDown(){ |
| | | this.outLoading = true |
| | | this.$axios.post(this.$api.deviceCheck.rewardPunishmentExport,{ |
| | | rewardPunishmentExport({ |
| | | userId: this.isDepartment ? '' : this.departId, |
| | | departmentId: this.isDepartment ? this.departId : '', |
| | | userName: this.search.userName, |
| | | startTime: this.search.searchTimeList && this.search.searchTimeList[0], |
| | | endTime: this.search.searchTimeList && this.search.searchTimeList[1] |
| | | },{responseType: 'blob'}).then(res => { |
| | | }).then(res => { |
| | | this.outLoading = false |
| | | const blob = new Blob([res], { |
| | | type: 'application/force-download' |
| | | }) |
| | | //å°Blob å¯¹è±¡è½¬æ¢æå符串 |
| | | let reader = new FileReader(); |
| | | reader.readAsText(blob, 'utf-8'); |
| | | reader.onload = () => { |
| | | try { |
| | | let result = JSON.parse(reader.result); |
| | | if (result.message) { |
| | | this.$message.error(result.message); |
| | | } else { |
| | | // å建ä¸ä¸ªè¶
龿¥ï¼å°æä»¶æµèµè¿å»ï¼ç¶åå®ç°è¿ä¸ªè¶
龿¥çåå»äºä»¶ |
| | | const elink = document.createElement('a') |
| | | elink.download = decodeURI('奿©è®°å½'+'.xlsx') |
| | | elink.style.display = 'none' |
| | | elink.href = URL.createObjectURL(blob) |
| | | document.body.appendChild(elink) |
| | | elink.click(); |
| | | URL.revokeObjectURL(elink.href) // éæ¾URL 对象 |
| | | document.body.removeChild(elink) |
| | | this.$message.success('å¯¼åºæå') |
| | | } |
| | | } catch (err) { |
| | | console.log(err); |
| | | // å建ä¸ä¸ªè¶
龿¥ï¼å°æä»¶æµèµè¿å»ï¼ç¶åå®ç°è¿ä¸ªè¶
龿¥çåå»äºä»¶ |
| | | const elink = document.createElement('a') |
| | | elink.download = decodeURI('奿©è®°å½'+'.xlsx') |
| | | elink.style.display = 'none' |
| | | elink.href = URL.createObjectURL(blob) |
| | | document.body.appendChild(elink) |
| | | elink.click(); |
| | | URL.revokeObjectURL(elink.href) // éæ¾URL 对象 |
| | | document.body.removeChild(elink) |
| | | this.$message.success('å¯¼åºæå') |
| | | } |
| | | } |
| | | this.$download.saveAs(blob, '奿©è®°å½.xlsx') |
| | | this.$message.success('å¯¼åºæå') |
| | | }) |
| | | }, |
| | | // è·åè´è´£äººä¿¡æ¯æ¥å£ |
| | | getUserList() { |
| | | this.$axios.get(this.$api.deviceScope.selectUserList).then(res => { |
| | | selectUserCondition().then(res => { |
| | | if (res.code == 200) { |
| | | this.responsibleOptions = res.data |
| | | } |
| | | }) |
| | | }); |
| | | }, |
| | | selectUserChange(val) { |
| | | const index = this.responsibleOptions.findIndex(item => item.id === val) |
| | |
| | | this.form.account = this.responsibleOptions[index].account |
| | | } |
| | | }, |
| | | // æå¼è¡¨åå¼¹æ¡ |
| | | editForm(row) { |
| | | this.dialogVisible = true |
| | | this.form = {...row}; |
| | | }, |
| | | // æäº¤è¡¨åæ°æ® |
| | | saveOrUpdate() { |
| | | this.$refs.form.validate(async (valid) => { |
| | | if (valid) { |
| | | this.dialogVisible = false |
| | | const {code, data} = await this.$axios({ |
| | | method: 'post', |
| | | url: addOrUpdateRewardPunishmentApi, |
| | | data: this.form, |
| | | headers: { |
| | | 'Content-Type': 'application/json' |
| | | }, |
| | | noQs: true |
| | | }) |
| | | if (code == 200) { |
| | | this.$message.success("æä½æåï¼") |
| | | addOrUpdateRewardPunishment(this.form).then(res => { |
| | | this.dialogVisible = false |
| | | this.$message.success("æä½æå") |
| | | this.getPersonnelTraining(this.departId); |
| | | } |
| | | }) |
| | | } |
| | | }) |
| | | }, |
| | | async deleteRow(row) { |
| | | const {code, data} = await this.$axios({ |
| | | method: 'delete', |
| | | url: deleteRewardPunishmentApi, |
| | | params: { |
| | | id: row.id |
| | | } |
| | | }) |
| | | if (code == 200) { |
| | | this.$message.success("æä½æåï¼") |
| | | this.getPersonnelTraining(this.departId); |
| | | } |
| | | deleteRow(row) { |
| | | this.$confirm('æ¯å¦å é¤å½åæ°æ®?', "è¦å", { |
| | | confirmButtonText: "ç¡®å®", |
| | | cancelButtonText: "åæ¶", |
| | | type: "warning" |
| | | }).then(() => { |
| | | deleteRewardPunishment({id: row.id}).then(res => { |
| | | if (res.code === 500) { |
| | | return |
| | | } |
| | | this.$message.success('å 餿å') |
| | | this.getPersonnelTraining(this.departId); |
| | | }).catch(e => { |
| | | this.$message.error('å é¤å¤±è´¥') |
| | | }) |
| | | }).catch(() => {}) |
| | | |
| | | } |
| | | }, |
| | | watch: { |