<template>
|
<el-dialog
|
:title="dialogTitle"
|
:visible.sync="isVisible"
|
width="80%"
|
top="5vh"
|
:close-on-click-modal="false"
|
@closed="handleClosed"
|
>
|
<div class="employee-dialog">
|
<el-card>
|
<el-form :inline="true" :model="queryForm" class="mb-8" ref="queryFormRef">
|
<el-collapse v-model="activeCollapse">
|
<el-collapse-item title="更多" name="more">
|
<el-row :gutter="12">
|
<el-col :span="8">
|
<el-form-item label="职员代码">
|
<el-input
|
v-model="queryForm.HNumber"
|
placeholder="职员代码"
|
@keydown.enter="handleSearch"
|
/>
|
</el-form-item>
|
</el-col>
|
<el-col :span="8">
|
<el-form-item label="职员名称">
|
<el-input
|
v-model="queryForm.HName"
|
placeholder="职员名称"
|
@keydown.enter="handleSearch"
|
/>
|
</el-form-item>
|
</el-col>
|
<el-col :span="8">
|
<el-form-item label="组织名称">
|
<el-select v-model="queryForm.HUSEORGID" placeholder="请选择组织">
|
<el-option
|
v-for="org in organizations"
|
:key="org.ID"
|
:label="org.Name"
|
:value="org.Name"
|
/>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
|
<el-row :gutter="12" style="margin-top: 12px;">
|
<el-col :span="24">
|
<!-- 过滤条件 -->
|
<el-row :gutter="12" style="margin-bottom: 10px;">
|
<el-col :span="6">
|
<el-form-item label="过滤">
|
<el-select v-model="queryForm.ColName">
|
<el-option value="0" label=""></el-option>
|
<el-option
|
v-for="col in filterColumns"
|
:key="col.field"
|
:value="col.field"
|
:label="col.title"
|
/>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="6">
|
<el-select v-model="queryForm.Comparator">
|
<el-option value="0" label=""></el-option>
|
<el-option value="=" label="=" />
|
<el-option value=">=" label=">=" />
|
<el-option value=">" label=">" />
|
<el-option value="<=" label="<=" />
|
<el-option value="<" label="<" />
|
<el-option value="<>" label="<>" />
|
<el-option value="7" label="包含" />
|
<el-option value="8" label="左包含" />
|
<el-option value="9" label="右包含" />
|
<el-option value="10" label="不包含" />
|
</el-select>
|
</el-col>
|
<el-col :span="6">
|
<el-input v-model="queryForm.ColContent" placeholder="过滤内容" />
|
</el-col>
|
</el-row>
|
|
<el-row :gutter="12" style="margin-bottom: 10px;">
|
<el-col :span="6">
|
<el-form-item label="过滤">
|
<el-select v-model="queryForm.ColName1">
|
<el-option value="0" label=""></el-option>
|
<el-option
|
v-for="col in filterColumns"
|
:key="col.field"
|
:value="col.field"
|
:label="col.title"
|
/>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="6">
|
<el-select v-model="queryForm.Comparator1">
|
<el-option value="0" label=""></el-option>
|
<el-option value="=" label="=" />
|
<el-option value=">=" label=">=" />
|
<el-option value=">" label=">" />
|
<el-option value="<=" label="<=" />
|
<el-option value="<" label="<" />
|
<el-option value="<>" label="<>" />
|
<el-option value="7" label="包含" />
|
<el-option value="8" label="左包含" />
|
<el-option value="9" label="右包含" />
|
<el-option value="10" label="不包含" />
|
</el-select>
|
</el-col>
|
<el-col :span="6">
|
<el-input v-model="queryForm.ColContent1" placeholder="过滤内容" />
|
</el-col>
|
</el-row>
|
|
<el-row :gutter="12">
|
<el-col :span="6">
|
<el-form-item label="过滤">
|
<el-select v-model="queryForm.ColName2">
|
<el-option value="0" label=""></el-option>
|
<el-option
|
v-for="col in filterColumns"
|
:key="col.field"
|
:value="col.field"
|
:label="col.title"
|
/>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="6">
|
<el-select v-model="queryForm.Comparator2">
|
<el-option value="0" label=""></el-option>
|
<el-option value="=" label="=" />
|
<el-option value=">=" label=">=" />
|
<el-option value=">" label=">" />
|
<el-option value="<=" label="<=" />
|
<el-option value="<" label="<" />
|
<el-option value="<>" label="<>" />
|
<el-option value="7" label="包含" />
|
<el-option value="8" label="左包含" />
|
<el-option value="9" label="右包含" />
|
<el-option value="10" label="不包含" />
|
</el-select>
|
</el-col>
|
<el-col :span="6">
|
<el-input v-model="queryForm.ColContent2" placeholder="过滤内容" />
|
</el-col>
|
</el-row>
|
</el-col>
|
</el-row>
|
</el-collapse-item>
|
</el-collapse>
|
|
<div style="margin-top: 12px;">
|
<el-button type="primary" icon="el-icon-search" @click="handleSearch">查询</el-button>
|
<el-button @click="handleReset">重置</el-button>
|
<div v-if="currentFilterName" style="display: inline-block; margin-left: 12px; color: #fc9393; font-weight: 600">
|
当前过滤方案：{{ currentFilterName }}
|
</div>
|
</div>
|
</el-form>
|
|
<el-table
|
:data="tableData"
|
stripe
|
border
|
style="width: 100%;"
|
height="400"
|
v-loading="loading"
|
@row-dblclick="handleRowDoubleClick"
|
@selection-change="handleSelectionChange"
|
ref="tableRef"
|
>
|
<el-table-column type="selection" width="55" />
|
<el-table-column
|
v-for="column in tableColumns"
|
:key="column.field"
|
:prop="column.field"
|
:label="column.title"
|
:width="column.width"
|
:formatter="column.formatter"
|
>
|
<template v-if="column.field === '职员代码'" #default="scope">
|
<span style="color: blue; cursor: pointer;" @click="handleCodeClick(scope.row)">
|
{{ scope.row.职员代码 }}
|
</span>
|
</template>
|
</el-table-column>
|
</el-table>
|
|
<el-pagination
|
style="margin-top: 12px;"
|
background
|
layout="total, sizes, prev, pager, next, jumper"
|
:total="total"
|
:page-size.sync="pageSize"
|
:current-page.sync="page"
|
@current-change="handlePageChange"
|
@size-change="handleSizeChange"
|
:page-sizes="[50, 500, 5000, 50000]"
|
/>
|
</el-card>
|
</div>
|
|
<div slot="footer" class="dialog-footer">
|
<el-button @click="handleCancel">取消</el-button>
|
<el-button type="primary" @click="handleConfirm">确定</el-button>
|
</div>
|
</el-dialog>
|
</template>
|
|
<script>
|
import axios from 'axios'
|
|
export default {
|
name: 'EmployeeDialog',
|
props: {
|
visible: {
|
type: Boolean,
|
default: false
|
},
|
dialogType: {
|
type: String,
|
default: 'employee' // employee, manager, keeper, worker 等
|
},
|
dialogTitle: {
|
type: String,
|
default: '选择职员'
|
}
|
},
|
data() {
|
return {
|
// 内部可控的可见性，避免直接修改 prop 导致的双向回路
|
isVisible: this.visible,
|
queryForm: {
|
HNumber: '',
|
HName: '',
|
HUSEORGID: '',
|
ColName: '0',
|
Comparator: '0',
|
ColContent: '',
|
ColName1: '0',
|
Comparator1: '0',
|
ColContent1: '',
|
ColName2: '0',
|
Comparator2: '0',
|
ColContent2: ''
|
},
|
organizations: [],
|
tableData: [],
|
tableColumns: [],
|
filterColumns: [],
|
loading: false,
|
page: 1,
|
pageSize: 50,
|
total: 0,
|
selectedRows: [],
|
currentFilterName: '',
|
activeCollapse: ['more'],
|
baseURL: process.env.VUE_APP_BASE_URL || "http://47.96.97.237/API/"
|
}
|
},
|
watch: {
|
visible(val) {
|
this.isVisible = val
|
if (val) {
|
this.initDialog()
|
}
|
},
|
isVisible(val) {
|
this.$emit('update:visible', val)
|
}
|
},
|
methods: {
|
async initDialog() {
|
await this.getOrganizations()
|
await this.getEmployeeList()
|
this.initFilterColumns()
|
},
|
|
// 获取组织列表
|
async getOrganizations() {
|
try {
|
const response = await axios.get(`${this.baseURL}/Web/GetOrganizations`)
|
if (response.data.count === 1) {
|
this.organizations = response.data.data
|
const defaultOrg = sessionStorage.getItem('Organization')
|
if (defaultOrg) {
|
this.queryForm.HUSEORGID = defaultOrg
|
}
|
}
|
} catch (error) {
|
console.error('获取组织列表失败:', error)
|
this.$message.error('获取组织列表失败')
|
}
|
},
|
|
// 获取职员列表
|
async getEmployeeList(sWhere = '') {
|
this.loading = true
|
try {
|
let finalWhere = sWhere
|
const params = this.$route.query
|
if (params.openType === '2') {
|
finalWhere += " and 禁用标记 = '' and 审核人 != '' "
|
}
|
|
const orgFilter = await this.getOrgFilterByUser()
|
finalWhere += orgFilter
|
console.log('最终过滤条件:', finalWhere)
|
const requestParams = {
|
sWhere: finalWhere,
|
user: sessionStorage.getItem('HUserName') || 'admin',
|
Organization: this.queryForm.HUSEORGID
|
}
|
console.log('请求参数:', requestParams)
|
const response = await axios.get(`${this.baseURL}/Gy_Employee/list`, { params: requestParams })
|
|
if (response.data.count === 1) {
|
this.tableData = response.data.data || []
|
this.total = response.data.count || 0
|
|
if (response.data.list.length > 0) {
|
this.setTableColumns(response.data.list)
|
}
|
} else {
|
this.$message.error(response.data.Message || '获取数据失败')
|
}
|
} catch (error) {
|
console.error('获取职员列表失败:', error)
|
this.$message.error('获取职员列表失败')
|
} finally {
|
this.loading = false
|
}
|
},
|
|
async getOrgFilterByUser() {
|
try {
|
const response = await axios.get(`${this.baseURL}/Xt_User/getOrgIDListByUser`, {
|
params: {
|
UserID: sessionStorage.getItem('Czybm'),
|
UserName: sessionStorage.getItem('HUserName'),
|
HOrgID: this.queryForm.HUSEORGID??'100038'
|
}
|
})
|
console.log('组织过滤响应:', response)
|
if (response.data.count === 1) {
|
if (response.data.data[0].sWhere === "1") {
|
//return ` and 组织名称 = '${this.queryForm.HUSEORGID}'`
|
return ''
|
} else {
|
return response.data.data[0].sWhere
|
}
|
}
|
} catch (error) {
|
console.error('获取用户组织过滤条件失败:', error)
|
}
|
return " and 1 = 0"
|
},
|
|
// 设置表格列
|
setTableColumns(columnDefs) {
|
const columns = []
|
const filterCols = []
|
const hideFields = ['HItemID', 'HDeptID', 'HGroupID']
|
|
// 添加选择列
|
columns.push({ type: 'selection', fixed: 'left' })
|
|
columnDefs.forEach(item => {
|
const colDef = {
|
field: item.ColmCols,
|
title: item.ColmCols,
|
width: 140
|
}
|
|
// 设置列格式
|
switch (item.ColmType) {
|
case 'DateTime':
|
colDef.formatter = (row, col, cellValue) => this.formatDateTime(cellValue)
|
colDef.width = 160
|
break
|
case 'Decimal':
|
case 'Int32':
|
colDef.width = 120
|
break
|
}
|
|
if (item.ColmCols === '职员代码') {
|
colDef.width = 160
|
}
|
|
columns.push(colDef)
|
|
|
if (!hideFields.includes(item.ColmCols)) {
|
filterCols.push(colDef)
|
}
|
})
|
|
this.tableColumns = columns
|
this.filterColumns = filterCols
|
},
|
|
initFilterColumns() {
|
},
|
|
handleSearch() {
|
const sWhere = this.buildWhereClause()
|
this.page = 1
|
this.getEmployeeList(sWhere)
|
},
|
|
buildWhereClause() {
|
const sWhereParts = []
|
const q = this.queryForm
|
|
const buildComparator = (col, cmp, content) => {
|
if (!col || !cmp || cmp === '0' || !content) return ''
|
let com = ''
|
switch (cmp) {
|
case '7': com = `like '%${content}%'`; break
|
case '8': com = `like '%${content}'`; break
|
case '9': com = `like '${content}%'`; break
|
case '10': com = `not like '%${content}%'`; break
|
default: com = `${cmp} '${content}'`; break
|
}
|
return ` and ${col} ${com}`
|
}
|
|
if (q.ColName && q.Comparator && q.Comparator !== '0' && q.ColContent)
|
sWhereParts.push(buildComparator(q.ColName, q.Comparator, q.ColContent))
|
if (q.ColName1 && q.Comparator1 && q.Comparator1 !== '0' && q.ColContent1)
|
sWhereParts.push(buildComparator(q.ColName1, q.Comparator1, q.ColContent1))
|
if (q.ColName2 && q.Comparator2 && q.Comparator2 !== '0' && q.ColContent2)
|
sWhereParts.push(buildComparator(q.ColName2, q.Comparator2, q.ColContent2))
|
|
if (q.HNumber) sWhereParts.push(` and 职员代码 like '%${q.HNumber}%'`)
|
if (q.HName) sWhereParts.push(` and 职员名称 like '%${q.HName}%'`)
|
|
return sWhereParts.join('')
|
},
|
|
// 处理重置
|
handleReset() {
|
this.queryForm = {
|
HNumber: '',
|
HName: '',
|
HUSEORGID: this.organizations.length > 0 ? this.organizations[0].Name : '',
|
ColName: '0',
|
Comparator: '0',
|
ColContent: '',
|
ColName1: '0',
|
Comparator1: '0',
|
ColContent1: '',
|
ColName2: '0',
|
Comparator2: '0',
|
ColContent2: ''
|
}
|
this.page = 1
|
this.getEmployeeList()
|
},
|
|
handleRowDoubleClick(row) {
|
this.selectedRows = [row]
|
this.handleConfirm()
|
},
|
|
handleSelectionChange(selection) {
|
this.selectedRows = selection
|
},
|
|
handleCodeClick(row) {
|
console.log('打开职员详情:', row)
|
},
|
|
handlePageChange(val) {
|
this.page = val
|
this.getEmployeeList(this.buildWhereClause())
|
},
|
|
handleSizeChange(val) {
|
this.pageSize = val
|
this.page = 1
|
this.getEmployeeList(this.buildWhereClause())
|
},
|
|
|
handleConfirm() {
|
if (this.selectedRows.length === 0) {
|
this.$message.warning('请选择职员')
|
return
|
}
|
|
const selectedData = this.selectedRows[0]
|
this.$emit('select', selectedData, this.dialogType)
|
this.$emit('update:visible', false)
|
},
|
|
|
handleCancel() {
|
this.$emit('update:visible', false)
|
},
|
|
handleClosed() {
|
this.selectedRows = []
|
this.$emit('closed')
|
},
|
|
formatDateTime(value) {
|
if (!value) return ''
|
try {
|
const d = new Date(value)
|
return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')} ${String(d.getHours()).padStart(2, '0')}:${String(d.getMinutes()).padStart(2, '0')}:${String(d.getSeconds()).padStart(2, '0')}`
|
} catch (e) {
|
return value
|
}
|
}
|
}
|
}
|
</script>
|
|
<style scoped>
|
.employee-dialog {
|
height: 60vh;
|
}
|
|
.mb-8 {
|
margin-bottom: 8px;
|
}
|
|
.dialog-footer {
|
text-align: right;
|
}
|
|
::v-deep .el-table {
|
font-size: 14px;
|
}
|
|
::v-deep .el-table .cell {
|
padding: 8px 12px;
|
}
|
</style>
|
