Skip to content

J
jilinzhongdianrenqun-web
Commit 3f828572 by wangchunyang
Options

人员权限管理设置功能，增加人员选择组件

parent c4f1f9f2
正在显示 包含 345 行增加 和 210 行删除
src/api/key-dm-user.js
...@@ -26,3 +26,21 @@ export const saveDmUser = (param) => { ...@@ -26,3 +26,21 @@ export const saveDmUser = (param) => {
data: param data: param
}) })
} }
// 获取人员选择器列表（根据机构和权限过滤）
export const getUserSelectorList = (param) => {
return axios.request({
url: '/api/ac/jilinsscgsdp/keyDmUser/selectUserSelectorList',
method: 'post',
data: param
})
}
// 获取人员多选器列表（所有在职人员）
export const getUserMultiSelectorList = (param) => {
return axios.request({
url: '/api/ac/jilinsscgsdp/keyDmUser/selectUserMultiSelectorList',
method: 'post',
data: param
})
}
src/api/key-dm.js
...@@ -144,7 +144,7 @@ export const deleteMaterial = (param) => { ...@@ -144,7 +144,7 @@ export const deleteMaterial = (param) => {
// 导入物料（Excel） // 导入物料（Excel）
export const importMaterial = (formData) => { export const importMaterial = (formData) => {
return axios.request({ return axios.request({
url: '/api/ac/jilinsscgsdp/keyDmMaterial/import', url: '/api/ac/jilinsscgsdp/keyDmMaterial/importExcel',
method: 'post', method: 'post',
data: formData data: formData
}) })
...@@ -158,3 +158,19 @@ export const materialTemplateDownload = (param) => { ...@@ -158,3 +158,19 @@ export const materialTemplateDownload = (param) => {
data: param data: param
}) })
} }
// ===== 人员权限配置 =====
export const getPermissionConfigList = () => {
return axios.request({
url: '/api/ac/jilinsscgsdp/keyDmUserCategory/selectPermissionConfigList',
method: 'post'
})
}
export const savePermissionUsers = (param) => {
return axios.request({
url: '/api/ac/jilinsscgsdp/keyDmUserCategory/savePermissionUsers',
method: 'post',
data: param
})
}
src/view/key-person/key_dm_conf/index.vue
<template> <template>
<div class="key-dm-wrapper"> <div class="key-dm-wrapper">
<Tabs v-model="activeTab" @on-click="handleTabChange"> <Tabs v-model="activeTab" @on-click="handleTabChange">
<!-- 人员分类管理 --> <!-- 人员权限配置 -->
<TabPane label="人员分类管理" name="userCategory"> <TabPane label="人员权限配置" name="permissionConfig">
<div class="search-div"> <Table border :loading="loading.permissionConfig" :columns="permissionConfigColumns" :data="tables.permissionConfig">
<Row type="flex" :gutter="16">
<Col span="12">
<span>分类名称：</span>
<Input v-model="filters.userCategory.catgory_name" placeholder="请输入" style="width: 30%" />
</Col>
<Col span="12" class="text-right">
<Button type="primary" class="mr10" @click="handleSearch('userCategory')">搜索</Button>
<Button type="primary" class="mr10" @click="handleReset('userCategory')">重置</Button>
<Button type="primary" @click="openAddModal('userCategory')">新增</Button>
</Col>
</Row>
</div>
<Table border :loading="loading.userCategory" :columns="userCategoryColumns" :data="tables.userCategory">
<template slot="action" slot-scope="{ row }"> <template slot="action" slot-scope="{ row }">
<Button size="small" type="primary" class="mr5" @click="openEditModal('userCategory', row)">修改</Button> <Button size="small" type="primary" @click="openUserConfigModal(row)">配置人员</Button>
<Button size="small" type="warning" class="mr5" @click="openPermissionModal(row)">权限配置</Button>
<Poptip confirm title="确认删除？" transfer @on-ok="handleDelete('userCategory', row)">
<Button size="small" type="error">删除</Button>
</Poptip>
</template> </template>
</Table> </Table>
<Page
class="page_style"
:total="pagers.userCategory.totalRecord"
:current="pagers.userCategory.pageNo"
:page-size="pagers.userCategory.pageSize"
show-total
show-sizer
@on-change="pageChange('userCategory', $event)"
@on-page-size-change="sizeChange('userCategory', $event)"
/>
</TabPane> </TabPane>
<!-- 假种管理 --> <!-- 假种管理 -->
<TabPane label="假种管理" name="leaveType"> <TabPane label="假种管理" name="leaveType">
<div class="search-div"> <div class="search-div">
...@@ -162,31 +134,13 @@ ...@@ -162,31 +134,13 @@
</TabPane> </TabPane>
</Tabs> </Tabs>
<!-- 人员分类管理弹窗 -->
<Modal v-model="modals.userCategory.visible" :title="modals.userCategory.isEdit ? '修改人员分类' : '新增人员分类'" width="600" :mask-closable="false">
<Form :label-width="120" :model="modals.userCategory.form" :rules="modals.userCategory.rules" ref="userCategoryForm">
<FormItem label="分类名称" prop="catgory_name">
<Input v-model="modals.userCategory.form.catgory_name" placeholder="请输入分类名称" />
</FormItem>
<FormItem label="描述" prop="remark">
<Input type="textarea" :rows="3" v-model="modals.userCategory.form.remark" placeholder="请输入描述" />
</FormItem>
<FormItem label="排序号" prop="order_no">
<InputNumber v-model="modals.userCategory.form.order_no" :min="0" style="width: 100%" />
</FormItem>
</Form>
<div slot="footer">
<Button @click="modals.userCategory.visible = false">取消</Button>
<Button type="primary" :loading="modals.userCategory.saving" @click="handleSave('userCategory')">保存</Button>
</div>
</Modal>
<!-- 导入物料弹窗 --> <!-- 导入物料弹窗 -->
<Modal v-model="importShow" title="物料导入" width="360"> <Modal v-model="importShow" title="物料导入" width="360">
<Row type="flex" justify="center" align="middle"> <Row type="flex" justify="center" align="middle">
<Col span="10"> <Col span="10">
<div style="text-align: center;"> <div style="text-align: center;">
<Upload <Upload
action="#", action="#"
:show-upload-list="false" :show-upload-list="false"
:before-upload="handleBeforeUpload" :before-upload="handleBeforeUpload"
:format="['xls','xlsx']" :format="['xls','xlsx']"
...@@ -365,6 +319,13 @@ ...@@ -365,6 +319,13 @@
</FormItem> </FormItem>
</Col> </Col>
</Row> </Row>
<Row :gutter="16">
<Col span="24">
<FormItem label="供应商" prop="supplier_name">
<Input v-model="modals.material.form.supplier_name" placeholder="请输入供应商" style="width: 100%" />
</FormItem>
</Col>
</Row>
<FormItem label="物料描述" prop="material_desc"> <FormItem label="物料描述" prop="material_desc">
<Input type="textarea" :rows="3" v-model="modals.material.form.material_desc" placeholder="请输入物料描述" /> <Input type="textarea" :rows="3" v-model="modals.material.form.material_desc" placeholder="请输入物料描述" />
</FormItem> </FormItem>
...@@ -375,31 +336,37 @@ ...@@ -375,31 +336,37 @@
</div> </div>
</Modal> </Modal>
<!-- 权限配置弹窗 --> <!-- 人员权限配置弹窗 -->
<Modal v-model="permissionModal.visible" title="权限配置" width="600" :mask-closable="false"> <Modal v-model="userConfigModal.visible" title="人员权限配置" width="800" :mask-closable="false">
<Form :label-width="120"> <div style="margin-bottom: 16px;">
<FormItem label="分类名称"> <span style="font-weight: bold;">权限：</span>{{ userConfigModal.permissionName }}
<Input :value="permissionModal.categoryName" disabled /> </div>
</FormItem> <div style="margin-bottom: 16px;">
<FormItem label="权限配置"> <span style="font-weight: bold;">已配置人员：</span>
<Select v-model="permissionModal.selectedPermissions" multiple clearable filterable placeholder="请选择权限"> <div style="margin-top: 8px;">
<Option v-for="opt in permissionOptions" :key="opt.value" :value="opt.value">{{ opt.label }}</Option> <Tag v-for="user in userConfigModal.selectedUsers" :key="user.user_id" closable @on-close="removeUser(user)">
</Select> {{ user.user_name }}
</FormItem> </Tag>
</Form> </div>
</div>
<div slot="footer"> <div slot="footer">
<Button @click="permissionModal.visible = false">取消</Button> <Button @click="userConfigModal.visible = false">取消</Button>
<Button type="primary" :loading="permissionModal.saving" @click="savePermission">保存</Button> <Button type="primary" @click="addUsers">添加人员</Button>
<Button type="primary" :loading="userConfigModal.saving" @click="saveUserConfig">保存</Button>
</div> </div>
</Modal> </Modal>
<!-- 人员选择器 -->
<UserMultiSelector
v-model="userSelectorVisible"
@on-ok="handleUserSelectorOk"
@cancel="userSelectorVisible = false" />
</div> </div>
</template> </template>
<script> <script>
import { import {
getUserCategoryList,
saveUserCategory,
deleteUserCategory,
getLeaveTypeList, getLeaveTypeList,
saveLeaveType, saveLeaveType,
deleteLeaveType, deleteLeaveType,
...@@ -409,57 +376,43 @@ import { ...@@ -409,57 +376,43 @@ import {
getMaterialList, getMaterialList,
saveMaterial, saveMaterial,
deleteMaterial, deleteMaterial,
getUserCategoryPermissionList,
saveUserCategoryPermission,
importMaterial, importMaterial,
materialTemplateDownload getPermissionConfigList,
savePermissionUsers
} from '@/api/key-dm' } from '@/api/key-dm'
import { getDictList } from '@/api/common' import axios from 'axios'
import UserMultiSelector from '@/view/key-person/key_dm_user/userMultiSelector.vue'
export default { export default {
name: 'key-dm-index', name: 'key-dm-index',
components: { UserMultiSelector },
data () { data () {
return { return {
activeTab: 'userCategory', activeTab: 'permissionConfig',
filters: { filters: {
userCategory: { catgory_name: '' },
leaveType: { type_name: '', type_code: '' }, leaveType: { type_name: '', type_code: '' },
materialCategory: { category_name: '', category_code: '' }, materialCategory: { category_name: '', category_code: '' },
material: { material_name: '', material_code: '', category_id: '' } material: { material_name: '', material_code: '', category_id: '' }
}, },
tables: { tables: {
userCategory: [], permissionConfig: [],
leaveType: [], leaveType: [],
materialCategory: [], materialCategory: [],
material: [] material: []
}, },
loading: { loading: {
userCategory: false, permissionConfig: false,
leaveType: false, leaveType: false,
materialCategory: false, materialCategory: false,
material: false material: false
}, },
pagers: { pagers: {
userCategory: { pageNo: 1, pageSize: 10, totalRecord: 0 }, permissionConfig: { pageNo: 1, pageSize: 10, totalRecord: 0 },
leaveType: { pageNo: 1, pageSize: 10, totalRecord: 0 }, leaveType: { pageNo: 1, pageSize: 10, totalRecord: 0 },
materialCategory: { pageNo: 1, pageSize: 10, totalRecord: 0 }, materialCategory: { pageNo: 1, pageSize: 10, totalRecord: 0 },
material: { pageNo: 1, pageSize: 10, totalRecord: 0 } material: { pageNo: 1, pageSize: 10, totalRecord: 0 }
}, },
modals: { modals: {
userCategory: {
visible: false,
isEdit: false,
saving: false,
form: {
id: '',
catgory_name: '',
remark: '',
order_no: 0
},
rules: {
catgory_name: [{ required: true, message: '请输入分类名称', trigger: 'blur' }]
}
},
leaveType: { leaveType: {
visible: false, visible: false,
isEdit: false, isEdit: false,
...@@ -521,25 +474,17 @@ export default { ...@@ -521,25 +474,17 @@ export default {
} }
} }
}, },
permissionModal: { userConfigModal: {
visible: false, visible: false,
saving: false, saving: false,
categoryId: '', permissionCode: '',
categoryName: '', permissionName: '',
selectedPermissions: [] selectedUsers: []
}, },
userSelectorVisible: false,
importShow: false, importShow: false,
impBtnDisabled: false, impBtnDisabled: false,
permissionOptions: [],
materialCategoryOptions: [], materialCategoryOptions: [],
userCategoryColumns: [
{ type: 'index', title: '序号', width: 60, align: 'center' },
{ title: '分类名称', key: 'catgory_name', align: 'center' },
{ title: '描述', key: 'remark', align: 'center' },
{ title: '权限', key: 'permission_names', align: 'center', minWidth: 200 },
{ title: '排序号', key: 'order_no', align: 'center', width: 100 },
{ title: '操作', slot: 'action', align: 'center', width: 250, fixed: 'right' }
],
leaveTypeColumns: [ leaveTypeColumns: [
{ type: 'index', title: '序号', width: 60, align: 'center' }, { type: 'index', title: '序号', width: 60, align: 'center' },
{ title: '类型编码', key: 'type_code', align: 'center' }, { title: '类型编码', key: 'type_code', align: 'center' },
...@@ -559,12 +504,13 @@ export default { ...@@ -559,12 +504,13 @@ export default {
], ],
materialColumns: [ materialColumns: [
{ type: 'index', title: '序号', width: 60, align: 'center' }, { type: 'index', title: '序号', width: 60, align: 'center' },
{ title: '分类', key: 'category_name', align: 'center' }, { title: '分类', key: 'category_name', minwidth: 120, align: 'center' },
{ title: '物料编码', key: 'material_code', align: 'center' }, { title: '物料编码', key: 'material_code', minwidth: 120, align: 'center' },
{ title: '物料名称', key: 'material_name', align: 'center' }, { title: '物料名称', key: 'material_name', minwidth: 180, align: 'center' },
{ title: '规格型号', key: 'material_spec', align: 'center' }, { title: '规格型号', key: 'material_spec', minwidth: 100, align: 'center' },
{ title: '单位', key: 'unit', align: 'center', width: 80 }, { title: '单位', key: 'unit', align: 'center', minwidth: 80 },
{ title: '单价', key: 'unit_price', align: 'center', width: 100 }, { title: '单价', key: 'unit_price', align: 'center', minwidth: 100 },
{ title: '供应商', key: 'supplier_name', align: 'center', minwidth: 120 },
{ title: '物料状态', { title: '物料状态',
key: 'status', key: 'status',
align: 'center', align: 'center',
...@@ -574,22 +520,32 @@ export default { ...@@ -574,22 +520,32 @@ export default {
return h('span', statusMap[row.status] || '-') return h('span', statusMap[row.status] || '-')
} }, } },
{ title: '操作', slot: 'action', align: 'center', width: 180, fixed: 'right' } { title: '操作', slot: 'action', align: 'center', width: 180, fixed: 'right' }
],
permissionConfigColumns: [
{ type: 'index', title: '序号', width: 60, align: 'center' },
{ title: '权限名称', key: 'permission_name', align: 'center', minWidth: 150 },
{ title: '配置人员', key: 'user_names', align: 'center', minWidth: 300 },
{ title: '操作', slot: 'action', align: 'center', width: 120, fixed: 'right' }
] ]
} }
}, },
created () { created () {
this.loadPermissionDict()
this.loadMaterialCategoryOptions() this.loadMaterialCategoryOptions()
this.loadPermissionConfig()
this.fetchList(this.activeTab) this.fetchList(this.activeTab)
}, },
methods: { methods: {
handleTabChange (name) { handleTabChange (name) {
this.activeTab = name this.activeTab = name
this.fetchList(name) if (name === 'permissionConfig') {
this.loadPermissionConfig()
} else {
this.fetchList(name)
}
}, },
fetchList (tab) { fetchList (tab) {
const apiMap = { const apiMap = {
userCategory: getUserCategoryList, permissionConfig: () => Promise.resolve({ data: { errcode: 0, data: [] } }),
leaveType: getLeaveTypeList, leaveType: getLeaveTypeList,
materialCategory: getMaterialCategoryList, materialCategory: getMaterialCategoryList,
material: getMaterialList material: getMaterialList
...@@ -602,27 +558,6 @@ export default { ...@@ -602,27 +558,6 @@ export default {
if (ret.data && ret.data.errcode === 0) { if (ret.data && ret.data.errcode === 0) {
const data = ret.data.data || {} const data = ret.data.data || {}
this.tables[tab] = data.results || [] this.tables[tab] = data.results || []
// 如果是人员分类，加载每行的权限名称并拼接显示
if (tab === 'userCategory' && Array.isArray(this.tables[tab]) && this.tables[tab].length > 0) {
const rows = this.tables[tab]
// 并行查询每个分类的权限配置（可优化为批量接口）
const promises = rows.map(r => {
return getUserCategoryPermissionList({ category_id: r.id }).then(res => {
let names = ''
if (res.data && res.data.errcode === 0) {
const list = res.data.data || res.data.results || []
names = (Array.isArray(list) ? list.map(it => it.permission_name).filter(Boolean) : []).join(',')
}
// 确保响应式设置字段
this.$set(r, 'permission_names', names)
return r
}).catch(() => {
this.$set(r, 'permission_names', '')
return r
})
})
Promise.all(promises).then(() => { /* table updated */ })
}
this.pagers[tab].totalRecord = data.totalRecord || 0 this.pagers[tab].totalRecord = data.totalRecord || 0
} else { } else {
this.$Notice.error({ title: '查询失败', desc: ret.data.errmsg || '请稍后重试' }) this.$Notice.error({ title: '查询失败', desc: ret.data.errmsg || '请稍后重试' })
...@@ -635,7 +570,7 @@ export default { ...@@ -635,7 +570,7 @@ export default {
}, },
handleReset (tab) { handleReset (tab) {
const resetMap = { const resetMap = {
userCategory: () => ({ catgory_name: '' }), permissionConfig: () => ({}),
leaveType: () => ({ type_name: '', type_code: '' }), leaveType: () => ({ type_name: '', type_code: '' }),
materialCategory: () => ({ category_name: '', category_code: '' }), materialCategory: () => ({ category_name: '', category_code: '' }),
material: () => ({ material_name: '', material_code: '', category_id: '' }) material: () => ({ material_name: '', material_code: '', category_id: '' })
...@@ -671,12 +606,6 @@ export default { ...@@ -671,12 +606,6 @@ export default {
}, },
getDefaultForm (tab) { getDefaultForm (tab) {
const defaults = { const defaults = {
userCategory: {
id: '',
catgory_name: '',
remark: '',
order_no: 0
},
leaveType: { leaveType: {
id: '', id: '',
type_code: '', type_code: '',
...@@ -721,7 +650,6 @@ export default { ...@@ -721,7 +650,6 @@ export default {
if (!valid) return if (!valid) return
modal.saving = true modal.saving = true
const saveApiMap = { const saveApiMap = {
userCategory: saveUserCategory,
leaveType: saveLeaveType, leaveType: saveLeaveType,
materialCategory: saveMaterialCategory, materialCategory: saveMaterialCategory,
material: saveMaterial material: saveMaterial
...@@ -732,6 +660,10 @@ export default { ...@@ -732,6 +660,10 @@ export default {
this.$Message.success('保存成功') this.$Message.success('保存成功')
modal.visible = false modal.visible = false
this.fetchList(tab) this.fetchList(tab)
// 如果是办公用品分类管理操作成功，刷新分类选项
if (tab === 'materialCategory') {
this.loadMaterialCategoryOptions()
}
} else { } else {
this.$Notice.error({ title: '保存失败', desc: ret.data.errmsg || '请稍后重试' }) this.$Notice.error({ title: '保存失败', desc: ret.data.errmsg || '请稍后重试' })
} }
...@@ -740,7 +672,6 @@ export default { ...@@ -740,7 +672,6 @@ export default {
}, },
handleDelete (tab, row) { handleDelete (tab, row) {
const deleteApiMap = { const deleteApiMap = {
userCategory: deleteUserCategory,
leaveType: deleteLeaveType, leaveType: deleteLeaveType,
materialCategory: deleteMaterialCategory, materialCategory: deleteMaterialCategory,
material: deleteMaterial material: deleteMaterial
...@@ -750,64 +681,15 @@ export default { ...@@ -750,64 +681,15 @@ export default {
if (ret.data && ret.data.errcode === 0) { if (ret.data && ret.data.errcode === 0) {
this.$Message.success('删除成功') this.$Message.success('删除成功')
this.fetchList(tab) this.fetchList(tab)
// 如果是办公用品分类管理删除成功，刷新分类选项
if (tab === 'materialCategory') {
this.loadMaterialCategoryOptions()
}
} else { } else {
this.$Notice.error({ title: '删除失败', desc: ret.data.errmsg || '请稍后重试' }) this.$Notice.error({ title: '删除失败', desc: ret.data.errmsg || '请稍后重试' })
} }
}) })
}, },
openPermissionModal (row) {
this.permissionModal.visible = true
this.permissionModal.categoryId = row.id
this.permissionModal.categoryName = row.catgory_name
this.permissionModal.selectedPermissions = []
// 加载已有权限
getUserCategoryPermissionList({ category_id: row.id }).then(ret => {
if (ret.data && ret.data.errcode === 0) {
const list = ret.data.data || ret.data.results || []
this.permissionModal.selectedPermissions = list.map(item => item.permission_mark).filter(Boolean)
}
})
},
savePermission () {
if (!this.permissionModal.categoryId) {
this.$Message.warning('分类ID不存在')
return
}
this.permissionModal.saving = true
const permissions = Array.isArray(this.permissionModal.selectedPermissions) ? this.permissionModal.selectedPermissions : []
const permissionList = permissions.map(mark => {
const opt = this.permissionOptions.find(p => p.value === mark)
return {
category_id: this.permissionModal.categoryId,
permission_mark: mark,
permission_name: opt ? opt.label : mark
}
})
saveUserCategoryPermission({
category_id: this.permissionModal.categoryId,
permissions: permissionList
}).then(ret => {
if (ret.data && ret.data.errcode === 0) {
this.$Message.success('保存成功')
this.permissionModal.visible = false
this.fetchList('userCategory')
} else {
this.$Notice.error({ title: '保存失败', desc: ret.data.errmsg || '请稍后重试' })
}
}).finally(() => { this.permissionModal.saving = false })
},
loadPermissionDict () {
// 从字典获取权限选项，字典类型为 daily_manage_dict_permission
getDictList({ type: 'daily_manage_dict_permission' }).then(res => {
if (res.data && res.data.errcode === 0) {
const results = res.data.data && res.data.data.results ? res.data.data.results : []
this.permissionOptions = results.map(it => ({
label: it.label || it.name || '',
value: it.value || it.dictValue || ''
})).filter(it => it.label && it.value)
}
})
},
loadMaterialCategoryOptions () { loadMaterialCategoryOptions () {
getMaterialCategoryList({ pageNo: 1, pageSize: 1000, params: {} }).then(ret => { getMaterialCategoryList({ pageNo: 1, pageSize: 1000, params: {} }).then(ret => {
if (ret.data && ret.data.errcode === 0) { if (ret.data && ret.data.errcode === 0) {
...@@ -817,26 +699,104 @@ export default { ...@@ -817,26 +699,104 @@ export default {
const raw = data.results || [] const raw = data.results || []
// 规范化后端字段名，确保 id 字段为小写 id，以便 Select v-model 绑定正常工作 // 规范化后端字段名，确保 id 字段为小写 id，以便 Select v-model 绑定正常工作
this.materialCategoryOptions = Array.isArray(raw) ? raw.map(it => ({ this.materialCategoryOptions = Array.isArray(raw) ? raw.map(it => ({
id: (it.Id || it.id || it.category_code || '').toString(), id: (it.id || it.id || it.category_code || '').toString(),
category_name: (it.category_name || it.categoryName || it.category_code || '') category_name: (it.category_name || it.categoryName || it.category_code || '')
})) : [] })) : []
} }
}) })
}, },
tplDownload () { loadPermissionConfig () {
// 下载物料导入模板 // 从字典获取权限配置数据，并加载对应的用户配置
materialTemplateDownload({}).then(ret => { this.loading.permissionConfig = true
if (ret && ret.data && ret.data.errcode === 0) { getPermissionConfigList().then(ret => {
// const data = ret.data.data if (ret.data && ret.data.errcode === 0) {
// 如果后端直接返回文件流需要采用 axios blob 下载，这里假设返回 url 或 blob handled by backend this.tables.permissionConfig = ret.data.data || []
// 简单提示或可实现下载逻辑
this.$Notice.success({ title: '模板已准备，请在后台下载' })
} else { } else {
this.$Notice.error({ title: '模板下载失败', desc: ret.data && ret.data.errmsg }) this.$Notice.error({ title: '加载失败', desc: ret.data && ret.data.errmsg })
} }
}).catch(() => { }).finally(() => { this.loading.permissionConfig = false })
this.$Notice.error({ title: '模板下载失败' }) },
}) openUserConfigModal (row) {
this.userConfigModal.visible = true
this.userConfigModal.permissionCode = row.permission_code
this.userConfigModal.permissionName = row.permission_name
this.userConfigModal.selectedUsers = row.user_names ? (JSON.parse(row.users) || []) : []
console.log('this.userConfigModal', this.userConfigModal)
},
addUsers () {
this.userSelectorVisible = true
},
handleUserSelectorOk (selectedUsers) {
// 将新选择的用户添加到已选用户列表中，避免重复
const existingIds = this.userConfigModal.selectedUsers.map(u => u.user_id)
const newUsers = selectedUsers.filter(u => !existingIds.includes(u.id)).map(u => ({
user_id: u.id,
user_name: u.name,
gh: u.gh
}))
this.userConfigModal.selectedUsers = [...this.userConfigModal.selectedUsers, ...newUsers]
this.userSelectorVisible = false
},
removeUser (user) {
this.userConfigModal.selectedUsers = this.userConfigModal.selectedUsers.filter(u => u.user_id !== user.user_id)
},
saveUserConfig () {
this.userConfigModal.saving = true
const userIds = this.userConfigModal.selectedUsers.map(u => u.user_id)
savePermissionUsers({
permission_code: this.userConfigModal.permissionCode,
user_ids: userIds
}).then(ret => {
if (ret.data && ret.data.errcode === 0) {
this.$Message.success('保存成功')
this.userConfigModal.visible = false
this.loadPermissionConfig()
} else {
this.$Notice.error({ title: '保存失败', desc: ret.data && ret.data.errmsg })
}
}).finally(() => { this.userConfigModal.saving = false })
},
// tplDownload () {
// // 下载物料导入模板
// materialTemplateDownload({}).then(ret => {
// if (ret && ret.data && ret.data.errcode === 0) {
// // const data = ret.data.data
// // 如果后端直接返回文件流需要采用 axios blob 下载，这里假设返回 url 或 blob handled by backend
// // 简单提示或可实现下载逻辑
// this.$Notice.success({ title: '模板已准备，请在后台下载' })
// } else {
// this.$Notice.error({ title: '模板下载失败', desc: ret.data && ret.data.errmsg })
// }
// }).catch(() => {
// this.$Notice.error({ title: '模板下载失败' })
// })
// },
async tplDownload () {
// 下载物料导入模板
try {
const response = await axios.post(
'/api/ac/jilinsscgsdp/keyDmMaterial/templateDownload',
{},
{
responseType: 'blob'
}
)
const url = window.URL.createObjectURL(new Blob([response.data]))
// 创建隐藏的a标签并设置属性
const link = document.createElement('a')
link.href = url
link.download = '办公用品导入模板.xlsx' // 自定义下载文件名和扩展名
link.style.display = 'none'
document.body.appendChild(link)
// 触发点击下载
link.click()
// 清理
document.body.removeChild(link)
window.URL.revokeObjectURL(url)
} catch (error) {
console.error('下载失败:', error)
// 可以在这里添加错误提示
}
}, },
handleBeforeUpload (file) { handleBeforeUpload (file) {
const fileExt = file.name.split('.').pop().toLocaleLowerCase() const fileExt = file.name.split('.').pop().toLocaleLowerCase()
......
src/view/key-person/key_dm_user/userMultiSelector.vue 0 → 100644
<template>
<Modal v-model="visible" title="选择人员" width="900" :mask-closable="false">
<div class="search-div">
<Row type="flex" :gutter="16" align="middle">
<Col :span="12">
<span>姓名：</span>
<Input v-model="filters.name" placeholder="请输入姓名" @on-enter="handleSearch" />
</Col>
<Col :span="12" class="text-right">
<Button type="primary" class="mr10" @click="handleSearch">搜索</Button>
<Button @click="handleReset">重置</Button>
</Col>
</Row>
</div>
<Table
:data="rows"
:loading="loading"
:columns="columns"
@on-selection-change="onSelectionChange"
border />
<Page class="page_style" :total="pager.totalRecord" :current="pager.pageNo" :page-size="pager.pageSize" show-total show-sizer
@on-change="pageChange" @on-page-size-change="sizeChange" />
<div slot="footer">
<Button @click="handleCancel">取消</Button>
<Button type="primary" :loading="confirming" @click="handleConfirm">确定({{ selectedRows.length }})</Button>
</div>
</Modal>
</template>
<script>
import { getUserMultiSelectorList } from '@/api/key-dm-user'
export default {
name: 'user-multi-selector',
props: {
// v-model: value 控制显示
value: { type: Boolean, default: false }
},
data () {
return {
visibleInternal: false,
filters: { name: '' },
rows: [],
loading: false,
pager: { pageNo: 1, pageSize: 10, totalRecord: 0 },
selectedRows: [],
confirming: false,
columns: [
{ type: 'selection', width: 60, align: 'center' },
{ title: '姓名', key: 'name', align: 'center', minWidth: 100 },
{ title: '工号', key: 'gh', align: 'center', minWidth: 120 },
{ title: '邮箱', key: 'email', align: 'center', minWidth: 150 },
{ title: '电话', key: 'phone', align: 'center', minWidth: 120 },
{ title: '手机', key: 'mobile', align: 'center', minWidth: 120 },
{ title: '归属部门', key: 'office_name', align: 'center', minWidth: 150 }
]
}
},
computed: {
visible: {
get () { return this.value },
set (v) { this.$emit('input', v) }
}
},
watch: {
visible (v) {
if (v) {
this.pager.pageNo = 1
this.selectedRows = []
this.filters.name = ''
this.fetchList()
}
}
},
methods: {
fetchList () {
this.loading = true
const payload = {
pageNo: this.pager.pageNo,
pageSize: this.pager.pageSize,
params: this.filters
}
getUserMultiSelectorList(payload).then(ret => {
if (ret.data && ret.data.errcode === 0) {
const data = ret.data.data || {}
this.rows = data.results || []
this.pager.totalRecord = data.totalRecord || 0
} else {
this.$Notice.error({ title: '查询失败', desc: ret.data && ret.data.errmsg })
}
}).finally(() => { this.loading = false })
},
handleSearch () {
this.pager.pageNo = 1
this.fetchList()
},
handleReset () {
this.filters = { name: '' }
this.pager.pageNo = 1
this.fetchList()
},
pageChange (pageNo) {
this.pager.pageNo = pageNo
this.fetchList()
},
sizeChange (size) {
this.pager.pageSize = size
this.pager.pageNo = 1
this.fetchList()
},
onSelectionChange (list) {
this.selectedRows = list || []
},
handleCancel () {
this.$emit('cancel')
this.$emit('input', false)
},
handleConfirm () {
if (this.selectedRows.length === 0) {
this.$Message.warning('请先选择人员')
return
}
this.confirming = true
// emit selected users to parent
this.$emit('on-ok', this.selectedRows)
this.$emit('input', false)
this.confirming = false
}
}
}
</script>
<style scoped>
.search-div { border: 1px solid #dce1e7; padding: 12px; margin-bottom: 12px; background-color: #f8fbff; }
.mr10 { margin-right: 10px; }
.page_style { margin-top: 12px; text-align: right; }
.text-right { text-align: right; }
</style>
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论