|
|
@@ -0,0 +1,233 @@
|
|
|
+<template>
|
|
|
+ <div class="main-container">
|
|
|
+ <ibps-crud
|
|
|
+ ref="crud"
|
|
|
+ :display-field="title"
|
|
|
+ :height="height"
|
|
|
+ :data="listData"
|
|
|
+ :toolbars="listConfig.toolbars"
|
|
|
+ :search-form="listConfig.searchForm"
|
|
|
+ :pk-key="pkKey"
|
|
|
+ :columns="listConfig.columns"
|
|
|
+ :row-handle="listConfig.rowHandle"
|
|
|
+ :pagination="pagination"
|
|
|
+ :loading="loading"
|
|
|
+ @action-event="handleAction"
|
|
|
+ @sort-change="handleSortChange"
|
|
|
+ @pagination-change="handlePaginationChange"
|
|
|
+ @row-dblclick="handleRowDblclick"
|
|
|
+ >
|
|
|
+ </ibps-crud>
|
|
|
+ <makeUpEdit
|
|
|
+ v-if="showMakeUpEdit"
|
|
|
+ :visible.sync="showMakeUpEdit"
|
|
|
+ :params="params"
|
|
|
+ :readonly="readonly"
|
|
|
+ @refresh="loadData"
|
|
|
+ @close="() => showMakeUpEdit = false"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import ActionUtils from '@/utils/action'
|
|
|
+import FixHeight from '@/mixins/height'
|
|
|
+import IbpsExport from '@/plugins/export'
|
|
|
+import color from '@/store/modules/ibps/modules/color'
|
|
|
+
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ makeUpEdit: () => import('./makeUpEdit')
|
|
|
+ },
|
|
|
+ mixins: [FixHeight],
|
|
|
+ data () {
|
|
|
+ const { userList = [], deptList = [] } = this.$store.getters || {}
|
|
|
+ const userOption = userList.map(item => ({ label: item.userName, value: item.userId }))
|
|
|
+ const deptOption = deptList.map(item => ({ label: item.positionName, value: item.positionId }))
|
|
|
+ return {
|
|
|
+ userOption,
|
|
|
+ deptOption,
|
|
|
+ title: '补卡记录',
|
|
|
+ pkKey: 'id_', // 主键对应数据库字段
|
|
|
+ loading: true,
|
|
|
+ height: document.clientHeight,
|
|
|
+ listData: [],
|
|
|
+ pagination: {
|
|
|
+ currentPage: 1,
|
|
|
+ limit: 20
|
|
|
+ },
|
|
|
+ showMakeUpEdit: false,
|
|
|
+ params: {},
|
|
|
+ sorts: {},
|
|
|
+ listConfig: {
|
|
|
+ toolbars: [
|
|
|
+ { key: 'search', icon: 'ibps-icon-search', label: '查询', type: 'primary' },
|
|
|
+ { key: 'add', icon: 'ibps-icon-plus', label: '申请', type: 'success' }
|
|
|
+ ],
|
|
|
+ searchForm: {
|
|
|
+ labelWidth: 100,
|
|
|
+ forms: [
|
|
|
+ { prop: 'Q^bian_zhi_ren_^S', label: '申请人', fieldType: 'select', options: userOption },
|
|
|
+ { prop: ['Q^bian_zhi_shi_jian^DL', 'Q^bian_zhi_shi_jian^DG'], label: '申请时间', fieldType: 'daterange' },
|
|
|
+ { prop: 'Q^zhuang_tai_^SL', label: '状态', fieldType: 'select', options: [{ value: '待审核', label: '待审核' }, { value: '未通过', label: '未通过' }, { value: '已通过', label: '已通过' }] },
|
|
|
+ { prop: ['Q^bu_ka_ri_qi_^DL', 'Q^bu_ka_ri_qi_^DG'], label: '补卡日期', fieldType: 'daterange' },
|
|
|
+ { prop: 'Q^bu_ka_ban_ci_^SL', label: '补卡班次' },
|
|
|
+ { prop: 'Q^bu_ka_shi_you_^SL', label: '补卡事由' }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ columns: [
|
|
|
+ { prop: 'bianZhiRen', label: '申请人', tags: userOption, width: 80 },
|
|
|
+ { prop: 'bianZhiShiJian', label: '申请时间', dateFormat: 'yyyy-MM-dd HH:mm', sortable: 'custom', width: 140 },
|
|
|
+ // { prop: 'shenHeRen', label: '审核人', tags: userOption, dataType: 'stringArray', separator: ',', minWidth: 100 },
|
|
|
+ // { prop: 'shenHeShiJian', label: '审核时间', dateFormat: 'yyyy-MM-dd HH:mm', sortable: 'custom', width: 140 },
|
|
|
+ { prop: 'zhuangTai', label: '状态', width: 90 },
|
|
|
+ { prop: 'buKaRiQi', label: '补卡日期', dateFormat: 'yyyy-MM-dd', sortable: 'custom', width: 80 },
|
|
|
+ { prop: 'buKaShiJian', label: '补卡时间', dateFormat: 'HH:mm', sortable: 'custom', width: 80 },
|
|
|
+ { prop: 'buKaBanCi', label: '补卡班次', width: 80 },
|
|
|
+ { prop: 'buKaShiYou', label: '补卡事由', width: 300 },
|
|
|
+ { prop: 'fuJian', label: '说明附件', width: 150 }
|
|
|
+ ],
|
|
|
+ rowHandle: {
|
|
|
+ effect: 'default',
|
|
|
+ // effect: 'display',
|
|
|
+ actions: [
|
|
|
+ { key: 'detail', label: '详情', type: 'primary', icon: 'ibps-icon-list-alt' }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ },
|
|
|
+ created () {
|
|
|
+ this.loadData()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 加载数据
|
|
|
+ loadData () {
|
|
|
+ this.loading = true
|
|
|
+ const sql = this.getSearchSql()
|
|
|
+ this.$common.request('sql', sql).then(res => {
|
|
|
+ this.listData = res.variables.data
|
|
|
+ // 做部门和姓名处理
|
|
|
+ this.listData.forEach(item => {
|
|
|
+ item.userName = this.getUserLabel(item.yong_hu_id_)
|
|
|
+ item.deptName = this.getDeptLabel(item.bu_men_)
|
|
|
+ })
|
|
|
+ // this.pagination.total = res.totalCount
|
|
|
+ }).finally(() => {
|
|
|
+ this.loading = false
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getUserLabel (userId) {
|
|
|
+ const user = this.userOption.find(item => item.value === userId)
|
|
|
+ return user ? user.label : ''
|
|
|
+ },
|
|
|
+ getDeptLabel (positionId) {
|
|
|
+ const dept = this.deptOption.find(item => item.value === positionId)
|
|
|
+ return dept ? dept.label : ''
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 获取格式化参数
|
|
|
+ */
|
|
|
+ getSearchFormData () {
|
|
|
+ const { first, second } = this.$store.getters.level || {}
|
|
|
+ const searchParam = this.$refs['crud'] ? this.$refs['crud'].getSearcFormData() : {}
|
|
|
+ searchParam['Q^di_dian_^S'] = second || first
|
|
|
+ return ActionUtils.formatParams(searchParam, this.pagination, this.sorts)
|
|
|
+ },
|
|
|
+ getSearchSql () {
|
|
|
+ let sql = `select * FROM t_attendance_reissue`
|
|
|
+ const params = this.getSearchFormData()
|
|
|
+ // 定义操作符映射
|
|
|
+ const operatorMap = {
|
|
|
+ 'S': '=',
|
|
|
+ 'SL': 'LIKE',
|
|
|
+ 'DG': '<=',
|
|
|
+ 'DL': '>='
|
|
|
+ }
|
|
|
+ // 如果有查询条件,构建 WHERE 子句
|
|
|
+ if (params.parameters && params.parameters.length > 0) {
|
|
|
+ const conditions = []
|
|
|
+ params.parameters.forEach(item => {
|
|
|
+ const { key, value } = item
|
|
|
+ const parts = key.split('^') // 格式: Q^field^operator
|
|
|
+ if (parts.length === 3 && parts[0] === 'Q') {
|
|
|
+ const field = parts[1] // 字段名
|
|
|
+ const operatorKey = parts[2] // 操作符(S/SL/DG/DL)
|
|
|
+ const operator = operatorMap[operatorKey]
|
|
|
+ if (operator) {
|
|
|
+ let condition
|
|
|
+ if (operator === 'LIKE') {
|
|
|
+ condition = `${field} LIKE '%${value}%'` // LIKE 模糊查询
|
|
|
+ } else {
|
|
|
+ condition = `${field} ${operator} '${value}'` // 其他操作符(=, <=, >=)
|
|
|
+ }
|
|
|
+ conditions.push(condition)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ if (conditions.length > 0) {
|
|
|
+ sql += ' WHERE ' + conditions.join(' AND ')
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // 添加分页
|
|
|
+ sql += ` LIMIT ${this.pagination.limit} OFFSET ${(this.pagination.currentPage - 1) * this.pagination.limit}`
|
|
|
+ return sql
|
|
|
+ },
|
|
|
+ // 分页/排序处理
|
|
|
+ handlePaginationChange (page) {
|
|
|
+ ActionUtils.setPagination(this.pagination, page)
|
|
|
+ this.loadData()
|
|
|
+ },
|
|
|
+ handleSortChange (sort) {
|
|
|
+ ActionUtils.setSorts(this.sorts, sort)
|
|
|
+ this.loadData()
|
|
|
+ },
|
|
|
+
|
|
|
+ // 操作处理
|
|
|
+ handleAction (command, _, selection, data) {
|
|
|
+ switch (command) {
|
|
|
+ case 'search':
|
|
|
+ ActionUtils.setFirstPagination(this.pagination)
|
|
|
+ this.loadData()
|
|
|
+ break
|
|
|
+ case 'edit':
|
|
|
+ this.handleEdit(command, data)
|
|
|
+ break
|
|
|
+ case 'add':
|
|
|
+ this.handleEdit(command, {})
|
|
|
+ break
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 处理编辑
|
|
|
+ */
|
|
|
+ async handleEdit (key, { id, scheduleId }) {
|
|
|
+ this.params = {
|
|
|
+ id,
|
|
|
+ scheduleId,
|
|
|
+ action: key === 'detail' ? 'view' : 'edit'
|
|
|
+ }
|
|
|
+ this.readonly = key === 'detail'
|
|
|
+ this.showMakeUpEdit = true
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+.main-container {
|
|
|
+ padding: 20px;
|
|
|
+ background: #fff;
|
|
|
+ border-radius: 4px;
|
|
|
+ box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
|
|
|
+}
|
|
|
+
|
|
|
+::v-deep .el-table {
|
|
|
+ .el-table__column[prop="bu_men_"] { min-width: 200px; }
|
|
|
+ .el-table__column[prop="pal_ban_ming_chen"] { min-width: 180px; }
|
|
|
+ .el-tag { margin: 2px; }
|
|
|
+}
|
|
|
+</style>
|