修改跨站脚本攻击缺陷
This commit is contained in:
范强强
@@ -241,6 +241,19 @@ export const ConfigurableTableMixin = {
|
||||
this.selectedRowKeys = selectedRowKeys
|
||||
this.selectionRows = selectionRows
|
||||
},
|
||||
htmlspecialchars (string) {
|
||||
var entityMap = {
|
||||
'&': '&',
|
||||
'<': '<',
|
||||
'>': '>',
|
||||
'"': '"',
|
||||
"'": ''',
|
||||
'/': '/'
|
||||
}
|
||||
return String(string).replace(/[&<>"'\/]/g, function (s) {
|
||||
return entityMap[s]
|
||||
})
|
||||
},
|
||||
/* 导入 */
|
||||
handleImportExcel (info) {
|
||||
// 限制导入大于500MB
|
||||
@@ -275,13 +288,13 @@ export const ConfigurableTableMixin = {
|
||||
// this.$message.success(`${info.file.name} 文件上传成功`);
|
||||
if (info.file.response.code === 201) {
|
||||
const { message, result: { msg, fileUrl, fileName } } = info.file.response
|
||||
const href = window._CONFIG.domianURL + fileUrl
|
||||
const href = this.htmlspecialchars(window._CONFIG.domianURL + fileUrl)
|
||||
this.$warning({
|
||||
title: message,
|
||||
content: (
|
||||
<div>
|
||||
<span>{msg}</span><br />
|
||||
<span>具体详情请 <a href={href} target="_blank" download={fileName}>点击下载</a> </span>
|
||||
<span>具体详情请 <a href={href} rel="nofollow noopener noreferrer" target="_blank" download={fileName}>点击下载</a> </span>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
|
||||
@@ -1,19 +0,0 @@
|
||||
/**
|
||||
*
|
||||
*/
|
||||
import { disabledAuthFilter } from '@/utils/authFilter'
|
||||
|
||||
export const DisabledAuthFilterMixin = {
|
||||
props: ['formData'],
|
||||
data () {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
isDisabledAuth (code) {
|
||||
return disabledAuthFilter(code, this.formData)
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@@ -1,189 +0,0 @@
|
||||
import JEditableTable from '@/components/jero/JEditableTable'
|
||||
import { VALIDATE_NO_PASSED, getRefPromise, validateFormAndTables } from '@/utils/JEditableTableUtil'
|
||||
import { httpAction, getAction } from '@/api/manage'
|
||||
|
||||
export const JEditableTableMixin = {
|
||||
components: {
|
||||
JEditableTable
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title: '操作',
|
||||
visible: false,
|
||||
form: this.$form.createForm(this),
|
||||
confirmLoading: false,
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 6 }
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 18 }
|
||||
},
|
||||
addDefaultRowNum: null // 这个变量应该是一个数字，但是为了保留原本代码中的提示逻辑，定义为null
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
/** 获取所有的editableTable实例 */
|
||||
getAllTable () {
|
||||
if (!(this.refKeys instanceof Array)) {
|
||||
throw this.throwNotArray('refKeys')
|
||||
}
|
||||
const values = this.refKeys.map(key => getRefPromise(this, key))
|
||||
return Promise.all(values)
|
||||
},
|
||||
|
||||
/** 遍历所有的JEditableTable实例 */
|
||||
eachAllTable (callback) {
|
||||
// 开始遍历
|
||||
this.getAllTable().then(tables => {
|
||||
tables.forEach((item, index) => {
|
||||
if (typeof callback === 'function') {
|
||||
callback(item, index)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
/** 当点击新增按钮时调用此方法 */
|
||||
add () {
|
||||
// update-begin-author:lvdandan date:20201113 for:LOWCOD-1049 JEditaTable,子表默认添加一条数据，addDefaultRowNum设置无效 #1930
|
||||
return new Promise((resolve) => {
|
||||
this.tableReset()
|
||||
resolve()
|
||||
}).then(() => {
|
||||
if (typeof this.addBefore === 'function') {
|
||||
this.addBefore()
|
||||
}
|
||||
// 默认新增空数据
|
||||
let rowNum = this.addDefaultRowNum
|
||||
if (typeof rowNum !== 'number') {
|
||||
rowNum = 1
|
||||
console.warn('由于你没有在 data 中定义 addDefaultRowNum 或 addDefaultRowNum 不是数字，所以默认添加一条空数据，如果不想默认添加空数据，请将定义 addDefaultRowNum 为 0')
|
||||
}
|
||||
this.eachAllTable((item) => {
|
||||
item.add(rowNum)
|
||||
})
|
||||
if (typeof this.addAfter === 'function') this.addAfter(this.model)
|
||||
this.edit({})
|
||||
})
|
||||
// update-end-author:lvdandan date:20201113 for:LOWCOD-1049 JEditaTable,子表默认添加一条数据，addDefaultRowNum设置无效 #1930
|
||||
},
|
||||
/** 当点击了编辑（修改）按钮时调用此方法 */
|
||||
edit (record) {
|
||||
if (record && JSON.stringify(record) !== '{}') {
|
||||
this.tableReset()
|
||||
}
|
||||
if (typeof this.editBefore === 'function') this.editBefore(record)
|
||||
this.visible = true
|
||||
this.activeKey = this.refKeys[0]
|
||||
this.form.resetFields()
|
||||
this.model = Object.assign({}, record)
|
||||
if (typeof this.editAfter === 'function') this.editAfter(this.model)
|
||||
},
|
||||
/** 关闭弹窗，并将所有JEditableTable实例回归到初始状态 */
|
||||
close () {
|
||||
this.visible = false
|
||||
this.$emit('close')
|
||||
},
|
||||
// 清空子表table的数据
|
||||
tableReset () {
|
||||
this.eachAllTable((item) => {
|
||||
item.clearRow()
|
||||
})
|
||||
},
|
||||
/** 查询某个tab的数据 */
|
||||
requestSubTableData (url, params, tab, success) {
|
||||
tab.loading = true
|
||||
getAction(url, params).then(res => {
|
||||
const { result } = res
|
||||
let dataSource = []
|
||||
if (result) {
|
||||
if (Array.isArray(result)) {
|
||||
dataSource = result
|
||||
} else if (Array.isArray(result.records)) {
|
||||
dataSource = result.records
|
||||
}
|
||||
}
|
||||
tab.dataSource = dataSource
|
||||
if (typeof success === 'function') {
|
||||
success(res)
|
||||
}
|
||||
}).finally(() => {
|
||||
tab.loading = false
|
||||
})
|
||||
},
|
||||
/** 发起请求，自动判断是执行新增还是修改操作 */
|
||||
request (formData) {
|
||||
let url = this.url.add
|
||||
const method = 'post'
|
||||
if (this.model.id) {
|
||||
url = this.url.edit
|
||||
// method = 'put'
|
||||
}
|
||||
this.confirmLoading = true
|
||||
httpAction(url, formData, method).then((res) => {
|
||||
if (res.success) {
|
||||
this.$message.success(res.message)
|
||||
this.$emit('ok')
|
||||
this.close()
|
||||
} else {
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
this.confirmLoading = false
|
||||
})
|
||||
},
|
||||
|
||||
/* --- handle 事件 --- */
|
||||
|
||||
/** ATab 选项卡切换事件 */
|
||||
handleChangeTabs (key) {
|
||||
// 自动重置scrollTop状态，防止出现白屏
|
||||
getRefPromise(this, key).then(editableTable => {
|
||||
editableTable.resetScrollTop()
|
||||
})
|
||||
},
|
||||
/** 关闭按钮点击事件 */
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
/** 确定按钮点击事件 */
|
||||
handleOk () {
|
||||
/** 触发表单验证 */
|
||||
this.getAllTable().then(tables => {
|
||||
/** 一次性验证主表和所有的次表 */
|
||||
return validateFormAndTables(this.form, tables)
|
||||
}).then(allValues => {
|
||||
if (typeof this.classifyIntoFormData !== 'function') {
|
||||
throw this.throwNotFunction('classifyIntoFormData')
|
||||
}
|
||||
const formData = this.classifyIntoFormData(allValues)
|
||||
// 发起请求
|
||||
return this.request(formData)
|
||||
}).catch(e => {
|
||||
if (e.error === VALIDATE_NO_PASSED) {
|
||||
// 如果有未通过表单验证的子表，就自动跳转到它所在的tab
|
||||
this.activeKey = e.index == null ? this.activeKey : this.refKeys[e.index]
|
||||
} else {
|
||||
console.error(e)
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
/* --- throw --- */
|
||||
|
||||
/** not a function */
|
||||
throwNotFunction (name) {
|
||||
return `${name} 未定义或不是一个函数`
|
||||
},
|
||||
|
||||
/** not a array */
|
||||
throwNotArray (name) {
|
||||
return `${name} 未定义或不是一个数组`
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
@@ -1,198 +0,0 @@
|
||||
import JEditableTable from '@/components/jero/JEditableTable'
|
||||
import { VALIDATE_NO_PASSED, getRefPromise, validateFormModelAndTables } from '@/utils/JEditableTableUtil'
|
||||
import { httpAction, getAction } from '@/api/manage'
|
||||
|
||||
export const JEditableTableModelMixin = {
|
||||
components: {
|
||||
JEditableTable
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title: '操作',
|
||||
visible: false,
|
||||
confirmLoading: false,
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 6 }
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 18 }
|
||||
},
|
||||
addDefaultRowNum: null, // 这个变量应该是一个数字，但是为了保留原本代码中的提示逻辑，定义为null
|
||||
refKeys: null
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
/** 获取所有的editableTable实例 */
|
||||
getAllTable () {
|
||||
if (!(this.refKeys instanceof Array)) {
|
||||
throw this.throwNotArray('refKeys')
|
||||
}
|
||||
const values = this.refKeys.map(key => getRefPromise(this, key))
|
||||
return Promise.all(values)
|
||||
},
|
||||
|
||||
/** 遍历所有的JEditableTable实例 */
|
||||
eachAllTable (callback) {
|
||||
// 开始遍历
|
||||
this.getAllTable().then(tables => {
|
||||
tables.forEach((item, index) => {
|
||||
if (typeof callback === 'function') {
|
||||
callback(item, index)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
/** 当点击新增按钮时调用此方法 */
|
||||
add () {
|
||||
// update-begin-author:lvdandan date:20201113 for:LOWCOD-1049 JEditaTable,子表默认添加一条数据，addDefaultRowNum设置无效 #1930
|
||||
return new Promise((resolve) => {
|
||||
this.tableReset()
|
||||
resolve()
|
||||
}).then(() => {
|
||||
if (typeof this.addBefore === 'function') {
|
||||
this.addBefore()
|
||||
}
|
||||
// 默认新增空数据
|
||||
let rowNum = this.addDefaultRowNum
|
||||
if (typeof rowNum !== 'number') {
|
||||
rowNum = 1
|
||||
console.warn('由于你没有在 data 中定义 addDefaultRowNum 或 addDefaultRowNum 不是数字，所以默认添加一条空数据，如果不想默认添加空数据，请将定义 addDefaultRowNum 为 0')
|
||||
}
|
||||
this.eachAllTable((item) => {
|
||||
item.add(rowNum)
|
||||
})
|
||||
if (typeof this.addAfter === 'function') this.addAfter(this.model)
|
||||
this.edit(this.model)
|
||||
})
|
||||
// update-end-author:lvdandan date:20201113 for:LOWCOD-1049 JEditaTable,子表默认添加一条数据，addDefaultRowNum设置无效 #1930
|
||||
},
|
||||
/** 当点击了编辑（修改）按钮时调用此方法 */
|
||||
edit (record) {
|
||||
if (record && JSON.stringify(record) !== '{}' && record.id) {
|
||||
this.tableReset()
|
||||
}
|
||||
if (typeof this.editBefore === 'function') this.editBefore(record)
|
||||
this.visible = true
|
||||
this.activeKey = this.refKeys[0]
|
||||
this.$refs.form.resetFields()
|
||||
this.model = Object.assign({}, record)
|
||||
if (typeof this.editAfter === 'function') this.editAfter(this.model)
|
||||
},
|
||||
/** 关闭弹窗，并将所有JEditableTable实例回归到初始状态 */
|
||||
close () {
|
||||
this.visible = false
|
||||
this.$emit('close')
|
||||
},
|
||||
// 清空子表table的数据
|
||||
tableReset () {
|
||||
this.eachAllTable((item) => {
|
||||
item.clearRow()
|
||||
})
|
||||
},
|
||||
/** 查询某个tab的数据 */
|
||||
requestSubTableData (url, params, tab, success) {
|
||||
tab.loading = true
|
||||
getAction(url, params).then(res => {
|
||||
const { result } = res
|
||||
let dataSource = []
|
||||
if (result) {
|
||||
if (Array.isArray(result)) {
|
||||
dataSource = result
|
||||
} else if (Array.isArray(result.records)) {
|
||||
dataSource = result.records
|
||||
}
|
||||
}
|
||||
tab.dataSource = dataSource
|
||||
if (typeof success === 'function') {
|
||||
success(res)
|
||||
}
|
||||
}).finally(() => {
|
||||
tab.loading = false
|
||||
})
|
||||
},
|
||||
/** 发起请求，自动判断是执行新增还是修改操作 */
|
||||
request (formData) {
|
||||
let url = this.url.add
|
||||
const method = 'post'
|
||||
if (this.model.id) {
|
||||
url = this.url.edit
|
||||
// method = 'put'
|
||||
}
|
||||
this.confirmLoading = true
|
||||
httpAction(url, formData, method).then((res) => {
|
||||
if (res.success) {
|
||||
this.$message.success(res.message)
|
||||
this.$emit('ok')
|
||||
this.close()
|
||||
} else {
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
this.confirmLoading = false
|
||||
})
|
||||
},
|
||||
|
||||
/* --- handle 事件 --- */
|
||||
|
||||
/** ATab 选项卡切换事件 */
|
||||
handleChangeTabs (key) {
|
||||
// 自动重置scrollTop状态，防止出现白屏
|
||||
getRefPromise(this, key).then(editableTable => {
|
||||
editableTable.resetScrollTop()
|
||||
})
|
||||
},
|
||||
/** 关闭按钮点击事件 */
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
/** 确定按钮点击事件 */
|
||||
handleOk () {
|
||||
/** 触发表单验证 */
|
||||
this.getAllTable().then(tables => {
|
||||
/** 一次性验证主表和所有的次表 */
|
||||
return validateFormModelAndTables(this.$refs.form, this.model, tables)
|
||||
}).then(allValues => {
|
||||
/** 一次性验证一对一的所有子表 */
|
||||
return this.validateSubForm(allValues)
|
||||
}).then(allValues => {
|
||||
if (typeof this.classifyIntoFormData !== 'function') {
|
||||
throw this.throwNotFunction('classifyIntoFormData')
|
||||
}
|
||||
const formData = this.classifyIntoFormData(allValues)
|
||||
// 发起请求
|
||||
return this.request(formData)
|
||||
}).catch(e => {
|
||||
if (e.error === VALIDATE_NO_PASSED) {
|
||||
// 如果有未通过表单验证的子表，就自动跳转到它所在的tab
|
||||
// update--begin--autor:liusq-----date:20210316------for：未通过表单验证跳转tab问题------
|
||||
this.activeKey = e.index == null ? this.activeKey : (e.paneKey ? e.paneKey : this.refKeys[e.index])
|
||||
// update--end--autor:liusq-----date:20210316------for：未通过表单验证跳转tab问题------
|
||||
} else {
|
||||
console.error(e)
|
||||
}
|
||||
})
|
||||
},
|
||||
// 校验所有子表表单
|
||||
validateSubForm (allValues) {
|
||||
return new Promise((resolve) => {
|
||||
resolve(allValues)
|
||||
})
|
||||
},
|
||||
/* --- throw --- */
|
||||
|
||||
/** not a function */
|
||||
throwNotFunction (name) {
|
||||
return `${name} 未定义或不是一个函数`
|
||||
},
|
||||
|
||||
/** not a array */
|
||||
throwNotArray (name) {
|
||||
return `${name} 未定义或不是一个数组`
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
@@ -1,178 +0,0 @@
|
||||
import { getRefPromise, validateFormAndTables } from '@/components/jero/JVxeTable/utils/vxeUtils.js'
|
||||
import { httpAction, getAction } from '@/api/manage'
|
||||
|
||||
const VALIDATE_NO_PASSED = ''
|
||||
|
||||
export const JVxeTableMixin = {
|
||||
data () {
|
||||
return {
|
||||
title: '操作',
|
||||
visible: false,
|
||||
form: this.$form.createForm(this),
|
||||
confirmLoading: false,
|
||||
scrolling: true,
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 6 }
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 18 }
|
||||
},
|
||||
refKeys: null,
|
||||
addDefaultRowNum: null // 这个变量应该是一个数字，但是为了保留原本代码中的提示逻辑，定义为null
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
/** 获取所有的JVxeTable实例 */
|
||||
getAllTable () {
|
||||
if (!(this.refKeys instanceof Array)) {
|
||||
throw this.throwNotArray('refKeys')
|
||||
}
|
||||
const values = this.refKeys.map(key => getRefPromise(this, key))
|
||||
return Promise.all(values)
|
||||
},
|
||||
|
||||
/** 遍历所有的JVxeTable实例 */
|
||||
eachAllTable (callback) {
|
||||
// 开始遍历
|
||||
this.getAllTable().then(tables => {
|
||||
tables.forEach((item, index) => {
|
||||
if (typeof callback === 'function') {
|
||||
callback(item, index)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
/** 当点击新增按钮时调用此方法 */
|
||||
add () {
|
||||
if (typeof this.addBefore === 'function') this.addBefore()
|
||||
// 默认新增空数据
|
||||
let rowNum = this.addDefaultRowNum
|
||||
if (typeof rowNum !== 'number') {
|
||||
rowNum = 1
|
||||
console.warn('由于你没有在 data 中定义 addDefaultRowNum 或 addDefaultRowNum 不是数字，所以默认添加一条空数据，如果不想默认添加空数据，请将定义 addDefaultRowNum 为 0')
|
||||
}
|
||||
this.eachAllTable((item) => {
|
||||
setTimeout(() => {
|
||||
item.addRows()
|
||||
}, 30)
|
||||
})
|
||||
if (typeof this.addAfter === 'function') this.addAfter(this.model)
|
||||
this.edit({})
|
||||
},
|
||||
/** 当点击了编辑（修改）按钮时调用此方法 */
|
||||
edit (record) {
|
||||
if (typeof this.editBefore === 'function') this.editBefore(record)
|
||||
this.visible = true
|
||||
this.activeKey = this.refKeys[0]
|
||||
this.form.resetFields()
|
||||
this.model = Object.assign({}, record)
|
||||
if (typeof this.editAfter === 'function') this.editAfter(this.model)
|
||||
},
|
||||
/** 关闭弹窗，并将所有JVxeTable实例回归到初始状态 */
|
||||
close () {
|
||||
this.visible = false
|
||||
this.eachAllTable((item) => {
|
||||
item._remove()
|
||||
})
|
||||
this.$emit('close')
|
||||
},
|
||||
|
||||
/** 查询某个tab的数据 */
|
||||
requestSubTableData (url, params, tab, success) {
|
||||
tab.loading = true
|
||||
getAction(url, params).then(res => {
|
||||
const { result } = res
|
||||
let dataSource = []
|
||||
if (result) {
|
||||
if (Array.isArray(result)) {
|
||||
dataSource = result
|
||||
} else if (Array.isArray(result.records)) {
|
||||
dataSource = result.records
|
||||
}
|
||||
}
|
||||
tab.dataSource = dataSource
|
||||
if (typeof success === 'function') {
|
||||
success(res)
|
||||
}
|
||||
}).finally(() => {
|
||||
tab.loading = false
|
||||
})
|
||||
},
|
||||
/** 发起请求，自动判断是执行新增还是修改操作 */
|
||||
request (formData) {
|
||||
let url = this.url.add
|
||||
const method = 'post'
|
||||
if (this.model.id) {
|
||||
url = this.url.edit
|
||||
// method = 'put'
|
||||
}
|
||||
this.confirmLoading = true
|
||||
console.log('formData===>', formData)
|
||||
httpAction(url, formData, method).then((res) => {
|
||||
if (res.success) {
|
||||
this.$message.success(res.message)
|
||||
this.$emit('ok')
|
||||
this.close()
|
||||
} else {
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
this.confirmLoading = false
|
||||
})
|
||||
},
|
||||
|
||||
/* --- handle 事件 --- */
|
||||
|
||||
/** ATab 选项卡切换事件 */
|
||||
handleChangeTabs (key) {
|
||||
// 自动重置scrollTop状态，防止出现白屏
|
||||
getRefPromise(this, key).then(vxeTable => {
|
||||
vxeTable.resetScrollTop()
|
||||
})
|
||||
},
|
||||
/** 关闭按钮点击事件 */
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
/** 确定按钮点击事件 */
|
||||
handleOk () {
|
||||
/** 触发表单验证 */
|
||||
this.getAllTable().then(tables => {
|
||||
/** 一次性验证主表和所有的次表 */
|
||||
return validateFormAndTables(this.form, tables)
|
||||
}).then(allValues => {
|
||||
if (typeof this.classifyIntoFormData !== 'function') {
|
||||
throw this.throwNotFunction('classifyIntoFormData')
|
||||
}
|
||||
const formData = this.classifyIntoFormData(allValues)
|
||||
// 发起请求
|
||||
return this.request(formData)
|
||||
}).catch(e => {
|
||||
if (e.error === VALIDATE_NO_PASSED) {
|
||||
// 如果有未通过表单验证的子表，就自动跳转到它所在的tab
|
||||
this.activeKey = e.index == null ? this.activeKey : this.refKeys[e.index]
|
||||
} else {
|
||||
console.error(e)
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
/* --- throw --- */
|
||||
|
||||
/** not a function */
|
||||
throwNotFunction (name) {
|
||||
return `${name} 未定义或不是一个函数`
|
||||
},
|
||||
|
||||
/** not a array */
|
||||
throwNotArray (name) {
|
||||
return `${name} 未定义或不是一个数组`
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
@@ -1,186 +0,0 @@
|
||||
import { VALIDATE_FAILED, getRefPromise, validateFormModelAndTables } from '@/components/jero/JVxeTable/utils/vxeUtils.js'
|
||||
import { httpAction, getAction } from '@/api/manage'
|
||||
|
||||
export const JVxeTableModelMixin = {
|
||||
data () {
|
||||
return {
|
||||
title: '操作',
|
||||
visible: false,
|
||||
confirmLoading: false,
|
||||
scrolling: true,
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 6 }
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 18 }
|
||||
},
|
||||
refKeys: null,
|
||||
addDefaultRowNum: null // 这个变量应该是一个数字，但是为了保留原本代码中的提示逻辑，定义为null
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
/** 获取所有的JVxeTable实例 */
|
||||
getAllTable () {
|
||||
if (!(this.refKeys instanceof Array)) {
|
||||
throw this.throwNotArray('refKeys')
|
||||
}
|
||||
const values = this.refKeys.map(key => getRefPromise(this, key))
|
||||
return Promise.all(values)
|
||||
},
|
||||
|
||||
/** 遍历所有的JVxeTable实例 */
|
||||
eachAllTable (callback) {
|
||||
// 开始遍历
|
||||
this.getAllTable().then(tables => {
|
||||
console.log('tables', tables)
|
||||
tables.forEach((item, index) => {
|
||||
if (typeof callback === 'function') {
|
||||
callback(item, index)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
/** 当点击新增按钮时调用此方法 */
|
||||
add () {
|
||||
if (typeof this.addBefore === 'function') this.addBefore()
|
||||
// 默认新增空数据
|
||||
let rowNum = this.addDefaultRowNum
|
||||
if (typeof rowNum !== 'number') {
|
||||
rowNum = 1
|
||||
console.warn('由于你没有在 data 中定义 addDefaultRowNum 或 addDefaultRowNum 不是数字，所以默认添加一条空数据，如果不想默认添加空数据，请将定义 addDefaultRowNum 为 0')
|
||||
}
|
||||
this.eachAllTable((item) => {
|
||||
// update-begin-author:taoyan date:20210315 for: 一对多jvex 默认几行不好使了 LOWCOD-1349
|
||||
setTimeout(() => {
|
||||
item.addRows()
|
||||
}, 30)
|
||||
// update-end-author:taoyan date:20210315 for: 一对多jvex 默认几行不好使了 LOWCOD-1349
|
||||
})
|
||||
if (typeof this.addAfter === 'function') this.addAfter(this.model)
|
||||
this.edit(this.model)
|
||||
},
|
||||
/** 当点击了编辑（修改）按钮时调用此方法 */
|
||||
edit (record) {
|
||||
if (typeof this.editBefore === 'function') this.editBefore(record)
|
||||
this.visible = true
|
||||
this.activeKey = this.refKeys[0]
|
||||
this.$refs.form.resetFields()
|
||||
this.model = Object.assign({}, record)
|
||||
if (typeof this.editAfter === 'function') this.editAfter(this.model)
|
||||
},
|
||||
/** 关闭弹窗，并将所有JVxeTable实例回归到初始状态 */
|
||||
close () {
|
||||
this.visible = false
|
||||
this.eachAllTable((item) => {
|
||||
item._remove()
|
||||
})
|
||||
this.$emit('close')
|
||||
},
|
||||
|
||||
/** 查询某个tab的数据 */
|
||||
requestSubTableData (url, params, tab, success) {
|
||||
tab.loading = true
|
||||
getAction(url, params).then(res => {
|
||||
const { result } = res
|
||||
let dataSource = []
|
||||
if (result) {
|
||||
if (Array.isArray(result)) {
|
||||
dataSource = result
|
||||
} else if (Array.isArray(result.records)) {
|
||||
dataSource = result.records
|
||||
}
|
||||
}
|
||||
tab.dataSource = dataSource
|
||||
if (typeof success === 'function') {
|
||||
success(res)
|
||||
}
|
||||
}).finally(() => {
|
||||
tab.loading = false
|
||||
})
|
||||
},
|
||||
/** 发起请求，自动判断是执行新增还是修改操作 */
|
||||
request (formData) {
|
||||
let url = this.url.add
|
||||
const method = 'post'
|
||||
if (this.model.id) {
|
||||
url = this.url.edit
|
||||
// method = 'put'
|
||||
}
|
||||
this.confirmLoading = true
|
||||
console.log('formData===>', formData)
|
||||
httpAction(url, formData, method).then((res) => {
|
||||
if (res.success) {
|
||||
this.$message.success(res.message)
|
||||
this.$emit('ok')
|
||||
this.close()
|
||||
} else {
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
this.confirmLoading = false
|
||||
})
|
||||
},
|
||||
|
||||
/* --- handle 事件 --- */
|
||||
|
||||
/** ATab 选项卡切换事件 */
|
||||
handleChangeTabs (key) {
|
||||
// 自动重置scrollTop状态，防止出现白屏
|
||||
getRefPromise(this, key).then(vxeTable => {
|
||||
vxeTable.resetScrollTop()
|
||||
})
|
||||
},
|
||||
/** 关闭按钮点击事件 */
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
/** 确定按钮点击事件 */
|
||||
handleOk () {
|
||||
/** 触发表单验证 */
|
||||
this.getAllTable().then(tables => {
|
||||
/** 一次性验证主表和所有的次表 */
|
||||
return validateFormModelAndTables(this.$refs.form, this.model, tables)
|
||||
}).then(allValues => {
|
||||
/** 一次性验证一对一的所有子表 */
|
||||
return this.validateSubForm(allValues)
|
||||
}).then(allValues => {
|
||||
if (typeof this.classifyIntoFormData !== 'function') {
|
||||
throw this.throwNotFunction('classifyIntoFormData')
|
||||
}
|
||||
const formData = this.classifyIntoFormData(allValues)
|
||||
// 发起请求
|
||||
return this.request(formData)
|
||||
}).catch(e => {
|
||||
if (e.error === VALIDATE_FAILED) {
|
||||
// 如果有未通过表单验证的子表，就自动跳转到它所在的tab
|
||||
this.activeKey = e.index == null ? this.activeKey : this.refKeys[e.index]
|
||||
} else {
|
||||
console.error(e)
|
||||
}
|
||||
})
|
||||
},
|
||||
// 校验所有子表表单
|
||||
validateSubForm (allValues) {
|
||||
return new Promise((resolve) => {
|
||||
resolve(allValues)
|
||||
})
|
||||
},
|
||||
/* --- throw --- */
|
||||
|
||||
/** not a function */
|
||||
throwNotFunction (name) {
|
||||
return `${name} 未定义或不是一个函数`
|
||||
},
|
||||
|
||||
/** not a array */
|
||||
throwNotArray (name) {
|
||||
return `${name} 未定义或不是一个数组`
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
@@ -309,7 +309,6 @@ export const JeroListMixin = {
|
||||
if (this.selectedRowKeys && this.selectedRowKeys.length > 0) {
|
||||
param.selections = this.selectedRowKeys.join(',')
|
||||
}
|
||||
console.log('导出参数', param)
|
||||
// 加一个大的提示
|
||||
const modalLoading = this.$info({
|
||||
title: '提示',
|
||||
@@ -386,6 +385,19 @@ export const JeroListMixin = {
|
||||
modalLoading.destroy()
|
||||
})
|
||||
},
|
||||
htmlspecialchars (string) {
|
||||
var entityMap = {
|
||||
'&': '&',
|
||||
'<': '<',
|
||||
'>': '>',
|
||||
'"': '"',
|
||||
"'": ''',
|
||||
'/': '/'
|
||||
}
|
||||
return String(string).replace(/[&<>"'\/]/g, function (s) {
|
||||
return entityMap[s]
|
||||
})
|
||||
},
|
||||
/* 导入 */
|
||||
handleImportExcel (info) {
|
||||
// 限制导入大于500MB
|
||||
@@ -418,12 +430,12 @@ export const JeroListMixin = {
|
||||
// this.$message.success(`${info.file.name} 文件上传成功`);
|
||||
if (info.file.response.code === 201) {
|
||||
const { message, result: { msg, fileUrl, fileName } } = info.file.response
|
||||
const href = window._CONFIG.domianURL + fileUrl
|
||||
const href = this.htmlspecialchars(window._CONFIG.domianURL + fileUrl)
|
||||
this.$warning({
|
||||
title: message,
|
||||
content: (<div>
|
||||
<span>{msg}</span><br />
|
||||
<span>具体详情请 <a href={href} target="_blank" download={fileName}>点击下载</a> </span>
|
||||
<span>具体详情请 <a rel="nofollow noopener noreferrer" href={href} target="_blank" download={fileName}>点击下载</a> </span>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
|
||||
@@ -1,27 +0,0 @@
|
||||
import { formatDate } from '@/utils/util'
|
||||
import Area from '@/components/_util/Area'
|
||||
|
||||
const onlUtil = {
|
||||
data () {
|
||||
return {
|
||||
mixin_pca: '',
|
||||
flowCodePre: 'onl_'
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.mixin_pca = new Area(this.$Jpcaa)
|
||||
},
|
||||
methods: {
|
||||
simpleDateFormat (millisecond, format) {
|
||||
return formatDate(millisecond, format)
|
||||
},
|
||||
getPcaText (code) {
|
||||
return this.mixin_pca.getText(code)
|
||||
},
|
||||
getPcaCode (text) {
|
||||
return this.mixin_pca.getCode(text)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export { onlUtil }
|
||||
@@ -1,276 +0,0 @@
|
||||
/**
|
||||
* 新增修改完成调用 modalFormOk方法 编辑弹框组件ref定义为modalForm
|
||||
* 高级查询按钮调用 superQuery方法 高级查询组件ref定义为superQueryModal
|
||||
* data中url定义 list为查询列表 delete为删除单条记录 deleteBatch为批量删除
|
||||
*/
|
||||
import { filterObj } from '@/utils/util'
|
||||
import { getAction, postAction } from '@/api/manage'
|
||||
import { mapGetters } from 'vuex'
|
||||
|
||||
export const SimpleListMixin = {
|
||||
data () {
|
||||
return {
|
||||
/* 查询条件-请不要在queryParam中声明非字符串值的属性 */
|
||||
queryParam: {},
|
||||
/* 数据源 */
|
||||
dataSource: [],
|
||||
/* 分页参数 */
|
||||
ipagination: {
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
pageSizeOptions: ['10', '30', '50', '100', '150', '200'],
|
||||
showTotal: (total, range) => {
|
||||
return range[0] + '-' + range[1] + ' 共' + total + '条'
|
||||
},
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
total: 0
|
||||
},
|
||||
/* 排序参数 */
|
||||
isorter: {
|
||||
column: 'createTime',
|
||||
order: 'desc'
|
||||
},
|
||||
/* 筛选参数 */
|
||||
filters: {},
|
||||
/* table加载状态 */
|
||||
loading: false,
|
||||
/* table选中keys */
|
||||
selectedRowKeys: [],
|
||||
/* table选中records */
|
||||
selectionRows: [],
|
||||
/* 查询折叠 */
|
||||
toggleSearchStatus: false,
|
||||
/* 高级查询条件生效状态 */
|
||||
superQueryFlag: false,
|
||||
/* 高级查询条件 */
|
||||
superQueryParams: '',
|
||||
/** 高级查询拼接方式 */
|
||||
superQueryMatchType: 'and',
|
||||
isBackTitle: false // 是否是详情页有返回的标题
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['defaultHeight']),
|
||||
yScrollHeight () {
|
||||
/**
|
||||
* 前几个使用变量是为了配合iframe嵌套，算出页面显示范围的高度
|
||||
* 48px：分页器的高度
|
||||
* 48px：a-card的padding（上24+下24）
|
||||
* 54px：表头行的高度
|
||||
*/
|
||||
return `calc(100vh - ${this.defaultHeight['user-info-height']} - ${this.defaultHeight['breadcrumb-height']} - ${this.defaultHeight.oneLineSearchHeight} - ${this.defaultHeight.oneLineOperationHeight} - 48px - 48px - 54px - ${this.isBackTitle ? '56px' : '0px'})`
|
||||
}
|
||||
},
|
||||
created () {
|
||||
if (!this.disableMixinCreated) {
|
||||
this.loadData()
|
||||
// 初始化字典配置 在自己页面定义
|
||||
this.initDictConfig()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
loadData (arg) {
|
||||
if (!this.url.list) {
|
||||
this.$message.warning('请设置url.list属性!')
|
||||
return
|
||||
}
|
||||
// 加载数据 若传入参数1则加载第一页的内容
|
||||
if (arg === 1) {
|
||||
this.ipagination.current = 1
|
||||
}
|
||||
const params = this.getQueryParams()// 查询条件
|
||||
this.loading = true
|
||||
getAction(this.url.list, params).then((res) => {
|
||||
if (res.success) {
|
||||
// update-begin---author:zhangyafei Date:20201118 for：适配不分页的数据列表------------
|
||||
this.dataSource = res.result.records || res.result
|
||||
if (res.result.total) {
|
||||
this.ipagination.total = res.result.total
|
||||
} else {
|
||||
this.ipagination.total = 0
|
||||
}
|
||||
// update-end---author:zhangyafei Date:20201118 for：适配不分页的数据列表------------
|
||||
} else {
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
initDictConfig () {
|
||||
|
||||
},
|
||||
handleSuperQuery (params, matchType) {
|
||||
// 高级查询方法
|
||||
if (!params) {
|
||||
this.superQueryParams = ''
|
||||
this.superQueryFlag = false
|
||||
} else {
|
||||
this.superQueryFlag = true
|
||||
this.superQueryParams = JSON.stringify(params)
|
||||
this.superQueryMatchType = matchType
|
||||
}
|
||||
this.loadData(1)
|
||||
},
|
||||
getQueryParams () {
|
||||
// 获取查询条件
|
||||
const sqp = {}
|
||||
if (this.superQueryParams) {
|
||||
sqp.superQueryParams = encodeURI(this.superQueryParams)
|
||||
sqp.superQueryMatchType = this.superQueryMatchType
|
||||
}
|
||||
const param = Object.assign(sqp, this.queryParam, this.isorter, this.filters)
|
||||
param.field = this.getQueryField()
|
||||
param.pageNo = this.ipagination.current
|
||||
param.pageSize = this.ipagination.pageSize
|
||||
return filterObj(param)
|
||||
},
|
||||
getQueryField () {
|
||||
// TODO 字段权限控制
|
||||
let str = 'id,'
|
||||
this.columns.forEach(function (value) {
|
||||
str += ',' + value.dataIndex
|
||||
})
|
||||
return str
|
||||
},
|
||||
|
||||
onSelectChange (selectedRowKeys, selectionRows) {
|
||||
this.selectedRowKeys = selectedRowKeys
|
||||
this.selectionRows = selectionRows
|
||||
},
|
||||
onClearSelected () {
|
||||
this.selectedRowKeys = []
|
||||
this.selectionRows = []
|
||||
},
|
||||
searchQuery () {
|
||||
this.loadData(1)
|
||||
// 点击查询清空列表选中行
|
||||
this.selectedRowKeys = []
|
||||
this.selectionRows = []
|
||||
},
|
||||
superQuery () {
|
||||
this.$refs.superQueryModal.show()
|
||||
},
|
||||
searchReset () {
|
||||
this.queryParam = {}
|
||||
this.loadData(1)
|
||||
},
|
||||
batchDel () {
|
||||
if (!this.url.deleteBatch) {
|
||||
this.$message.warning('请设置url.deleteBatch属性!')
|
||||
return
|
||||
}
|
||||
if (this.selectedRowKeys.length <= 0) {
|
||||
this.$message.warning('请选择一条记录！')
|
||||
return
|
||||
}
|
||||
|
||||
const ids = this.selectedRowKeys.join()
|
||||
const that = this
|
||||
this.$confirm({
|
||||
title: '确认删除',
|
||||
content: '是否删除选中数据?',
|
||||
onOk: function () {
|
||||
that.loading = true
|
||||
postAction(that.url.deleteBatch, { ids: ids }).then((res) => {
|
||||
if (res.success) {
|
||||
// 重新计算分页问题
|
||||
that.reCalculatePage(that.selectedRowKeys.length)
|
||||
that.$message.success(res.message)
|
||||
that.loadData()
|
||||
that.onClearSelected()
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
that.loading = false
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
handleDelete: function (id) {
|
||||
if (!this.url.delete) {
|
||||
this.$message.warning('请设置url.delete属性!')
|
||||
return
|
||||
}
|
||||
const that = this
|
||||
this.$confirm({
|
||||
title: '确认删除',
|
||||
content: '确定要删除此条数据吗?',
|
||||
onOk: function () {
|
||||
postAction(that.url.delete, { id: id }).then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message)
|
||||
// 判断当前删除的数据是否是最后一页的最后一条数据，如果是的话页码减一
|
||||
if (that.ipagination.current > 1 && ((that.ipagination.current - 1) * that.ipagination.pageSize) + 1 === that.ipagination.total) {
|
||||
that.ipagination.current -= 1
|
||||
}
|
||||
that.loadData()
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
reCalculatePage (count) {
|
||||
// 总数量-count
|
||||
const total = this.ipagination.total - count
|
||||
// 获取删除后的分页数
|
||||
const currentIndex = Math.ceil(total / this.ipagination.pageSize)
|
||||
// 删除后的分页数<所在当前页
|
||||
if (currentIndex < this.ipagination.current) {
|
||||
this.ipagination.current = currentIndex
|
||||
}
|
||||
console.log('currentIndex', currentIndex)
|
||||
},
|
||||
handleEdit: function (record) {
|
||||
this.$refs.modalForm.edit(record)
|
||||
this.$refs.modalForm.title = this.$t('edit')
|
||||
this.$refs.modalForm.disableSubmit = false
|
||||
},
|
||||
handleAdd: function () {
|
||||
this.$refs.modalForm.add()
|
||||
this.$refs.modalForm.title = this.$t('newlyAdded')
|
||||
this.$refs.modalForm.disableSubmit = false
|
||||
},
|
||||
handleTableChange (pagination, filters, sorter) {
|
||||
// 分页、排序、筛选变化时触发
|
||||
if (Object.keys(sorter).length > 0) {
|
||||
this.isorter.column = sorter.field
|
||||
this.isorter.order = sorter.order === 'ascend' ? 'asc' : 'desc'
|
||||
}
|
||||
this.ipagination = pagination
|
||||
this.loadData()
|
||||
},
|
||||
handleToggleSearch () {
|
||||
this.toggleSearchStatus = !this.toggleSearchStatus
|
||||
},
|
||||
|
||||
modalFormOk () {
|
||||
// 新增/修改 成功时，重载列表
|
||||
this.loadData()
|
||||
// 清空列表选中
|
||||
this.onClearSelected()
|
||||
},
|
||||
handleDetail: function (record) {
|
||||
this.$refs.modalForm.edit(record)
|
||||
this.$refs.modalForm.title = '详情'
|
||||
this.$refs.modalForm.disableSubmit = true
|
||||
},
|
||||
/**
|
||||
* 循环操作按钮的操作
|
||||
* @param operation
|
||||
* @param record
|
||||
*/
|
||||
operationClick (operation, record) {
|
||||
if (operation.clickEvent === 'handleDelete') {
|
||||
this.handleDelete(record.id)
|
||||
} else {
|
||||
this[operation.clickEvent](record)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@@ -1,63 +0,0 @@
|
||||
import store from '@/store/'
|
||||
import { ACCESS_TOKEN } from '@/store/mutation-types'
|
||||
import Vue from 'vue'
|
||||
|
||||
export const WebsocketMixin = {
|
||||
mounted () {
|
||||
this.initWebSocket()
|
||||
},
|
||||
destroyed: function () {
|
||||
// 离开页面生命周期函数
|
||||
this.websocketOnclose()
|
||||
},
|
||||
methods: {
|
||||
initWebSocket: function () {
|
||||
const token = Vue.ls.get(ACCESS_TOKEN)
|
||||
console.log('------------WebSocket连接成功')
|
||||
// WebSocket与普通的请求所用协议有所不同，ws等同于http，wss等同于https
|
||||
const userId = store.getters.userInfo.id
|
||||
if (!this.socketUrl.startsWith('/')) {
|
||||
this.socketUrl = '/' + this.socketUrl
|
||||
}
|
||||
if (!this.socketUrl.endsWith('/')) {
|
||||
this.socketUrl = this.socketUrl + '/'
|
||||
}
|
||||
const url = window._CONFIG.domianURL.replace('https://', 'wss://').replace('http://', 'ws://') + this.socketUrl + userId + '/' + token
|
||||
this.websock = new WebSocket(url)
|
||||
this.websock.onopen = this.websocketOnopen
|
||||
this.websock.onerror = this.websocketOnerror
|
||||
this.websock.onmessage = this.websocketOnmessage
|
||||
this.websock.onclose = this.websocketOnclose
|
||||
},
|
||||
websocketOnopen: function () {
|
||||
console.log('WebSocket连接成功')
|
||||
},
|
||||
websocketOnerror: function () {
|
||||
console.log('WebSocket连接发生错误')
|
||||
this.reconnect()
|
||||
},
|
||||
websocketOnclose: function () {
|
||||
this.reconnect()
|
||||
},
|
||||
websocketSend (text) {
|
||||
// 数据发送
|
||||
try {
|
||||
this.websock.send(text)
|
||||
} catch (err) {
|
||||
console.log('send failed (' + err.code + ')')
|
||||
}
|
||||
},
|
||||
reconnect () {
|
||||
const that = this
|
||||
if (that.lockReconnect) return
|
||||
that.lockReconnect = true
|
||||
// 没连接上会一直重连，设置延迟避免请求过多
|
||||
// setTimeout(function () {
|
||||
// console.info('尝试重连...')
|
||||
// that.initWebSocket()
|
||||
// that.lockReconnect = false
|
||||
// }, 5000)
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@@ -1,99 +0,0 @@
|
||||
import { getProcessNodeList } from '../api/workCenter'
|
||||
import Vue from 'vue'
|
||||
import { USER_INFO } from '../store/mutation-types'
|
||||
|
||||
export const WorkCenterMixin = {
|
||||
data () {
|
||||
return {
|
||||
personnelInfoData: [], // 需要传给PersonnelInfo的数据
|
||||
switchValue: 'base',
|
||||
formItemColon: false // a-form不显示冒号
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 查询人员信息结构数据，callback用于获取完流程才可以初始化人员信息
|
||||
getPersonInfoStructure (key, callback) {
|
||||
const param = {}
|
||||
param.processDefinitionKey = key
|
||||
if (this.$route.query.processInstanceId) {
|
||||
param.processInstanceId = this.$route.query.processInstanceId
|
||||
}
|
||||
getProcessNodeList(param).then(res => {
|
||||
if (res.success) {
|
||||
console.log(res.result)
|
||||
// 处理人员信息数据，判断每个节点是否能选人
|
||||
this.personnelInfoData = res.result.map(item => {
|
||||
return {
|
||||
...item,
|
||||
chooseType: item.variableType === 'string' ? 'radio' : 'checkbox'
|
||||
}
|
||||
})
|
||||
if (!this.$route.query.processInstanceId) {
|
||||
// 说明是在新发起一个节点，初始化发起人员信息
|
||||
this.personnelInfoData[0].linkUserIds = Vue.ls.get(USER_INFO).id
|
||||
this.personnelInfoData[0].linkUserIds_dictText = Vue.ls.get(USER_INFO).realname + '(' + Vue.ls.get(USER_INFO).username + ')'
|
||||
this.personnelInfoData[0].userList = Vue.ls.get(USER_INFO).realname + '(' + Vue.ls.get(USER_INFO).username + ')'
|
||||
}
|
||||
if (callback) {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 待办中进入时需要初始化人员信息数据
|
||||
initPersonInfoData (isFirstNode) {
|
||||
console.log('-----------isFirstNode------------', isFirstNode)
|
||||
if (isFirstNode) {
|
||||
// 是第一个节点，回显数据
|
||||
this.personnelInfoData = this.personnelInfoData.map(item => {
|
||||
return {
|
||||
...item,
|
||||
userList: item.linkUserIds_dictText
|
||||
}
|
||||
})
|
||||
} else {
|
||||
// 不是第一个节点，回显数据，都不可选人
|
||||
this.personnelInfoData = this.personnelInfoData.map(item => {
|
||||
return {
|
||||
...item,
|
||||
userList: item.linkUserIds_dictText,
|
||||
canChoose: 0
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
// 节点1的草稿回显人员信息
|
||||
draftInitPersonInfo (personInfoObj) {
|
||||
console.log('(((((((((((((draftInitPersonInfo)))))))))))')
|
||||
this.personnelInfoData = this.personnelInfoData.map((item, index) => {
|
||||
// 如果是从草稿进入的保存，只有第一个节点和可以选择的节点需要回显
|
||||
if (this.$route.query.draftId) {
|
||||
return {
|
||||
...item,
|
||||
linkUserIds: index === 0 || item.canChoose === 1 ? personInfoObj[item.variableName] || item.linkUserIds : null,
|
||||
linkUserIds_dictText: index === 0 || item.canChoose === 1 ? personInfoObj[item.variableName + '_dictText'] : null,
|
||||
userList: index === 0 || item.canChoose === 1 ? personInfoObj[item.variableName + '_dictText'] : null
|
||||
}
|
||||
}
|
||||
return {
|
||||
...item,
|
||||
linkUserIds: personInfoObj[item.variableName] || item.linkUserIds,
|
||||
linkUserIds_dictText: personInfoObj[item.variableName + '_dictText'],
|
||||
userList: personInfoObj[item.variableName + '_dictText']
|
||||
}
|
||||
})
|
||||
console.log(this.personnelInfoData)
|
||||
},
|
||||
// 操作完成返回
|
||||
goBack () {
|
||||
let timer = setTimeout(() => {
|
||||
clearTimeout(timer)
|
||||
timer = null
|
||||
this.$router.go(-1)
|
||||
}, 700)
|
||||
},
|
||||
switchChange (value) {
|
||||
this.switchValue = value
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -34,7 +34,7 @@ export default {
|
||||
const replaceStand = ''
|
||||
// http://39.98.140.126:8999
|
||||
// http://127.0.0.1:8080
|
||||
window.open('http://39.98.140.126:8999' + '/editor?fileId=' + val.id + '&pid=' + val.pid +
|
||||
window.open('http://127.0.0.1:8082' + '/editor?fileId=' + val.id + '&pid=' + val.pid +
|
||||
'&taskIds=' + val.taskId + '&oldFileName=' + oldFileName + '&assessor=' + assessor +
|
||||
'&fileType=docx' + '&attId=' + val.id + '&fileUrl=' + val.downLoadUrl +
|
||||
'&key=' + val.id + nowTime + '&filePath=' + val.editFilePath + '&fileName=' + val.fileName +
|
||||
|
||||
@@ -1,443 +0,0 @@
|
||||
<template>
|
||||
<div class="detail-page">
|
||||
<a-spin :spinning="loading">
|
||||
<div class="detail-page-title">{{ pageTitle }}{{ $t('details') }}</div>
|
||||
|
||||
<div class="detail-page-part" v-for="(part, index) in partList" :key="part + index">
|
||||
<div class="detail-page-part-title">
|
||||
<span>{{ part }}</span>
|
||||
<div class="detail-page-part-title-operate-box" v-if="index === 0">
|
||||
<!-- 更新记录-->
|
||||
<a-button type="link" @click="handleOpenUpdateRecord" v-has="btnPermission.updateRecord">
|
||||
<i class="iconfont icon-root-list" />
|
||||
{{ $t('standardRegulationLibrary.updateRecord') }}
|
||||
</a-button>
|
||||
<!-- 提交问题-->
|
||||
<a-button type="link" @click="submitQuestion" v-has="btnPermission.submitQuestion">
|
||||
<a-icon type="database" />
|
||||
{{ $t('standardRegulationLibrary.submitQuestion') }}
|
||||
</a-button>
|
||||
<!-- 分享-->
|
||||
<a-button type="link" @click="handleShare" v-has="btnPermission.share">
|
||||
<i class="iconfont icon-share-internal" />{{ $t('share') }}
|
||||
</a-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="detail-page-part-form" v-if="part !== '过程稿件' && part !== 'Process Manuscript'">
|
||||
<div class="detail-page-part-form-item" v-for="formItem in form[part]" :key="formItem.id">
|
||||
<label>{{ formItem.dbFieldTxt }}</label>
|
||||
<!--文件需要显示预览-->
|
||||
<span v-if="!fileField.includes(formItem.dbFieldName)">
|
||||
{{
|
||||
detailData[needDictFieldList.includes(formItem.fieldShowType) ? formItem.dbFieldName + '_dictText' : formItem.dbFieldName] || global.emptyLine
|
||||
}}
|
||||
</span>
|
||||
<div class="file-box" v-else>
|
||||
<template v-if="detailData[formItem.dbFieldName + 'List'] && detailData[formItem.dbFieldName + 'List'].length > 0">
|
||||
<div class="detail-page-process-manuscript-file"
|
||||
v-for="file in detailData[formItem.dbFieldName + 'List']"
|
||||
:key="file.id">
|
||||
<div class="detail-page-process-manuscript-file-info">
|
||||
<a-icon type="link" />
|
||||
<div class="detail-page-process-manuscript-file-name" @click="handlePreview(file)">{{ file.fileName }}</div>
|
||||
</div>
|
||||
<!-- 下载-->
|
||||
<a-button type="link"
|
||||
icon="download"
|
||||
v-has="btnPermission.download"
|
||||
class="file-btn"
|
||||
@click="handleDownload(file)">
|
||||
{{
|
||||
$t('download')
|
||||
}}
|
||||
</a-button>
|
||||
<!-- 无水印下载-->
|
||||
<!--<a-button type="link" v-has="btnPermission.unwatermarkedDownload" class="file-btn">-->
|
||||
<!-- <i class="iconfont icon-water-drop-slash"></i>-->
|
||||
<!-- {{ $t('unwatermarkedDownload') }}-->
|
||||
<!--</a-button>-->
|
||||
</div>
|
||||
</template>
|
||||
<span v-else>{{ global.emptyLine }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 过程稿件特殊处理-->
|
||||
<div class="detail-page-process-manuscript" v-if="part === '过程稿件' || part === 'Process Manuscript'">
|
||||
<div class="detail-page-process-manuscript-item" v-for="formItem in form[part]" :key="formItem.id">
|
||||
<div class="detail-page-process-manuscript-title">
|
||||
<span>{{ formItem.dbFieldTxt }}</span>
|
||||
<!-- 标准分解单-->
|
||||
<a-button type="primary"
|
||||
ghost
|
||||
icon="file-text"
|
||||
@click="previewStandardResolutionSheet(detailData[formItem.dbFieldName + '_standardSplit'])"
|
||||
v-has="btnPermission.standardResolutionSheet"
|
||||
:disabled="!detailData[formItem.dbFieldName + '_standardSplit']">
|
||||
{{ $t('standardRegulationLibrary.standardResolutionSheet') }}
|
||||
</a-button>
|
||||
</div>
|
||||
<div class="detail-page-process-manuscript-file"
|
||||
v-for="file in detailData[formItem.dbFieldName + 'List']"
|
||||
:key="file.id">
|
||||
<div class="detail-page-process-manuscript-file-info">
|
||||
<a-icon type="link" />
|
||||
<div class="detail-page-process-manuscript-file-name" @click="handlePreview(file)">{{ file.fileName }}</div>
|
||||
</div>
|
||||
<div class="detail-page-process-manuscript-file-operate">
|
||||
<!-- 下载-->
|
||||
<a-button type="link" icon="download" v-has="btnPermission.download" @click="handleWatermarkedDownload(file)">
|
||||
{{ $t('download') }}
|
||||
</a-button>
|
||||
<!-- 无水印下载-->
|
||||
<a-button type="link" v-has="btnPermission.unwatermarkedDownload" @click="handleDownload(file)">
|
||||
<i class="iconfont icon-water-drop-slash"></i>
|
||||
{{ $t('unwatermarkedDownload') }}
|
||||
</a-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a-spin>
|
||||
|
||||
<div id="images">
|
||||
<div class="image" v-viewer="{movable: false}">
|
||||
<img v-show="image" :src="imageUrl" alt="">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 更新记录-->
|
||||
<update-record-modal ref="uploadRecordModal" />
|
||||
<!-- 提交问题-->
|
||||
<submit-question-modal ref="submitQuestionModal" />
|
||||
<!-- 分享选人-->
|
||||
<user-select-modal ref="userSelectModal" type="checkbox" @change="continueShare" />
|
||||
<!-- 标准分解单-->
|
||||
<standard-resolution-sheet-modal ref="standardResolutionSheetModal" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import '@assets/less/common.less'
|
||||
import { FieldType, StandardSource } from '../../../enums/commonEnums'
|
||||
import {
|
||||
getDomesticStandardFormModal,
|
||||
shareDomesticStandard,
|
||||
getDomesticStandardDetail,
|
||||
getOverseasStandardForm,
|
||||
getOverseasStandardDocumentInfo,
|
||||
shareOverseasStandard
|
||||
} from '../../../api/standardRegulationLibraryApi'
|
||||
import UpdateRecordModal from './modules/UpdateRecordModal.vue'
|
||||
import SubmitQuestionModal from './modules/SubmitQuestionModal.vue'
|
||||
import UserSelectModal from '../../../components/selection/UserSelectModal.vue'
|
||||
import StandardResolutionSheetModal from './modules/StandardResolutionSheetModal.vue'
|
||||
import { getFileInfo } from '../../../api/api.js'
|
||||
import Vue from 'vue'
|
||||
import { ACCESS_TOKEN } from '../../../store/mutation-types.js'
|
||||
import { downloadFile, getFileAccessHttpUrl } from '../../../api/manage.js'
|
||||
import { previewPdf } from '../../../utils/previewPdf.js'
|
||||
import { Base64 } from 'js-base64'
|
||||
import { kkFilePreview } from '../../../utils/kkFilePreview'
|
||||
import { previewFileCurrentWindowByFileId } from '../../../utils/util'
|
||||
|
||||
// 国内标准权限
|
||||
const DomesticStandardPermission = {
|
||||
updateRecord: 'domesticStandard:updateRecord', // 更新记录
|
||||
submitQuestion: 'domesticStandard:submitQuestion', // 提交问题
|
||||
share: 'domesticStandard:share', // 分享
|
||||
standardResolutionSheet: 'domesticStandard:standardResolutionSheet', // 标准分解单
|
||||
download: 'domesticStandard:download', // 下载
|
||||
unwatermarkedDownload: 'domesticStandard:unwatermarkedDownload' // 无水印下载
|
||||
}
|
||||
|
||||
// 海外标准权限
|
||||
const OverseasStandardPermission = {
|
||||
updateRecord: 'overseasStandard:updateRecord', // 更新记录
|
||||
submitQuestion: 'overseasStandard:submitQuestion', // 提交问题
|
||||
share: 'overseasStandard:share', // 分享
|
||||
standardResolutionSheet: 'overseasStandard:standardResolutionSheet', // 标准分解单
|
||||
download: 'overseasStandard:download', // 下载
|
||||
unwatermarkedDownload: 'overseasStandard:unwatermarkedDownload' // 无水印下载
|
||||
}
|
||||
|
||||
// 国内标准接口
|
||||
const DomesticApi = {
|
||||
getFormFunc: getDomesticStandardFormModal, // 获取字段
|
||||
getDetailData: getDomesticStandardDetail, // 获取详情数据
|
||||
share: shareDomesticStandard // 分享
|
||||
}
|
||||
|
||||
// 海外标准接口
|
||||
const OverseasApi = {
|
||||
getFormFunc: getOverseasStandardForm, // 获取字段
|
||||
getDetailData: getOverseasStandardDocumentInfo, // 获取详情数据
|
||||
share: shareOverseasStandard // 分享
|
||||
}
|
||||
|
||||
// 支持预览的文件后缀
|
||||
const CAN_PREVIEW_FILE_SUFFIX = ['jpg', 'jpeg', 'png', 'pdf', 'doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx']
|
||||
const FILE_TYPE_PDF = 'pdf'
|
||||
const FILE_TYPE_IMGS = ['jpg', 'jpeg', 'png', 'raw']
|
||||
|
||||
export default {
|
||||
name: 'StandardDetailPage',
|
||||
components: { UpdateRecordModal, SubmitQuestionModal, UserSelectModal, StandardResolutionSheetModal },
|
||||
data () {
|
||||
return {
|
||||
loading: false,
|
||||
partList: [], // 页面模块列表
|
||||
form: {}, // 页面字段
|
||||
// 页面数据
|
||||
detailData: {},
|
||||
// 文件的字段
|
||||
fileField: [],
|
||||
// 需要数据字段翻译的属性类型
|
||||
needDictFieldList: [FieldType.USER_SINGLE.value, FieldType.ORGAN_SINGLE.value, FieldType.ORGAN_MORE.value, FieldType.OPTION_SINGLE.value, FieldType.OPTION_MORE.value, FieldType.TREE.value, FieldType.TREE_SINGLE.value],
|
||||
image: false,
|
||||
imageUrl: null
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
type () {
|
||||
if (this.$route.path.indexOf('Domestic') !== -1) {
|
||||
return StandardSource.DOMESTIC.value
|
||||
}
|
||||
if (this.$route.path.indexOf('Overseas') !== -1) {
|
||||
return StandardSource.OVERSEAS.value
|
||||
}
|
||||
return ''
|
||||
},
|
||||
pageTitle () {
|
||||
if (this.type === StandardSource.DOMESTIC.value) {
|
||||
return this.$t('system.tag.domesticLaws')
|
||||
}
|
||||
if (this.type === StandardSource.OVERSEAS.value) {
|
||||
return this.$t('system.tag.foreignStandards')
|
||||
}
|
||||
return ''
|
||||
},
|
||||
// 按钮权限
|
||||
btnPermission () {
|
||||
let permission = {}
|
||||
switch (this.type) {
|
||||
// 国内标准法规
|
||||
case StandardSource.DOMESTIC.value:
|
||||
permission = DomesticStandardPermission
|
||||
break
|
||||
// 海外
|
||||
case StandardSource.OVERSEAS.value:
|
||||
permission = OverseasStandardPermission
|
||||
break
|
||||
default:
|
||||
break
|
||||
}
|
||||
return permission
|
||||
},
|
||||
// 操作接口
|
||||
operateApiFunc () {
|
||||
let func = {}
|
||||
switch (this.type) {
|
||||
case StandardSource.DOMESTIC.value:
|
||||
func = DomesticApi
|
||||
break
|
||||
case StandardSource.OVERSEAS.value:
|
||||
func = OverseasApi
|
||||
break
|
||||
default:
|
||||
break
|
||||
}
|
||||
return func
|
||||
}
|
||||
},
|
||||
async created () {
|
||||
// 如果是要直接看文件
|
||||
// if (this.$route.query.viewFile) {
|
||||
// // TODO 这里需要调一个接口，通过标准id按规则获取文件
|
||||
// const fileId = '1734843741558288385'
|
||||
// previewFileCurrentWindowByFileId(fileId).then(() => {
|
||||
// }).catch((message) => {
|
||||
// this.$message.warning(message)
|
||||
// })
|
||||
// return
|
||||
// }
|
||||
await this.initForm()
|
||||
this.initDetailData()
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 获取页面字段
|
||||
*/
|
||||
initForm () {
|
||||
return new Promise(resolve => {
|
||||
this.operateApiFunc.getFormFunc({ type: 1 }).then(res => {
|
||||
if (res.success) {
|
||||
const data = res.result || {}
|
||||
this.partList = Object.keys(data)
|
||||
const formList = Object.values(data).reduce((acc, cur) => acc.concat(cur), [])
|
||||
this.fileField = []
|
||||
formList.forEach(item => {
|
||||
if (item.fieldShowType === FieldType.FILE_UP.value) {
|
||||
this.fileField.push(item.dbFieldName)
|
||||
}
|
||||
})
|
||||
this.form = data
|
||||
} else {
|
||||
this.$message.warn(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
resolve()
|
||||
})
|
||||
})
|
||||
},
|
||||
// 获取数据
|
||||
initDetailData () {
|
||||
this.loading = true
|
||||
this.operateApiFunc.getDetailData({ id: this.$route.query.id, type: 1 }).then(res => {
|
||||
if (res.success) {
|
||||
this.detailData = Object.assign({}, res.result || {})
|
||||
this.fileField.forEach(item => {
|
||||
if (this.detailData[item]) {
|
||||
const fileList = this.detailData[item].split(',')
|
||||
const fileInfoList = []
|
||||
fileList.forEach(async id => {
|
||||
const fileInfo = await this.getFileInfo(id)
|
||||
if (fileInfo) {
|
||||
fileInfoList.push(fileInfo)
|
||||
}
|
||||
})
|
||||
this.$set(this.detailData, item + 'List', fileInfoList)
|
||||
}
|
||||
})
|
||||
console.log(this.detailData)
|
||||
} else {
|
||||
this.$message.warn(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
getFileInfo (fileId) {
|
||||
return new Promise(resolve => {
|
||||
let fileInfo
|
||||
getFileInfo({ id: fileId }).then(res => {
|
||||
if (res.success) {
|
||||
fileInfo = res.result
|
||||
}
|
||||
}).finally(() => {
|
||||
resolve(fileInfo)
|
||||
})
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 更新记录
|
||||
*/
|
||||
handleOpenUpdateRecord () {
|
||||
this.$refs.uploadRecordModal.open(this.detailData.standard_number)
|
||||
},
|
||||
/**
|
||||
* 提交问题
|
||||
*/
|
||||
submitQuestion () {
|
||||
this.$refs.submitQuestionModal.open(this.detailData.standard_number, this.type)
|
||||
},
|
||||
/**
|
||||
* 分享
|
||||
*/
|
||||
handleShare () {
|
||||
this.$refs.userSelectModal.open()
|
||||
},
|
||||
/**
|
||||
* 选择分享的人之后继续分享
|
||||
* @param ids
|
||||
*/
|
||||
continueShare (ids) {
|
||||
const params = {
|
||||
standardId: this.$route.query.id, // 要分享的标准的id
|
||||
standardNumber: this.detailData.standard_number, // 分享的标准编号
|
||||
recipientId: ids // 分享给的用户的id
|
||||
}
|
||||
this.loading = true
|
||||
this.operateApiFunc.share(params).then(res => {
|
||||
if (res.success) {
|
||||
this.$message.success(res.message)
|
||||
} else {
|
||||
this.$message.warn(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 查看标准分解单
|
||||
*/
|
||||
previewStandardResolutionSheet (id) {
|
||||
this.$refs.standardResolutionSheetModal.open(id)
|
||||
},
|
||||
handlePreview (file) {
|
||||
if (!file || !file.url) {
|
||||
return
|
||||
}
|
||||
// 截取文件后缀名
|
||||
const fileSuffix = file.fileName ? file.fileName.split('.')[file.fileName.split('.').length - 1] : ''
|
||||
const canPreview = CAN_PREVIEW_FILE_SUFFIX.some(tt => fileSuffix.toLowerCase() === tt)
|
||||
// 判断是否为可预览格式的文件
|
||||
if (!canPreview) {
|
||||
this.$message.loading('该文件类型不支持预览，正在为您准备下载...').then(() => {
|
||||
this.handleDownload(file)
|
||||
})
|
||||
return
|
||||
}
|
||||
const fileFullUrl = `${window._CONFIG.domianWebSocketURL}/sys/common/view/${file.id}?at=${Vue.ls.get(ACCESS_TOKEN)}&fullfilename=${file.fileName}`
|
||||
console.log(fileFullUrl)
|
||||
// 图片预览，使用自己添加的组件
|
||||
if (canPreview && FILE_TYPE_IMGS.includes(fileSuffix.toLowerCase())) {
|
||||
this.imageUrl = getFileAccessHttpUrl(file.id)
|
||||
// 获取viewer实例
|
||||
const viewer = this.$el.querySelector('.image').$viewer
|
||||
// 调用show方法进行显示预览图
|
||||
viewer.show()
|
||||
// this.$refs.imagePreviewModal.open(file)
|
||||
return
|
||||
}
|
||||
// pdf预览
|
||||
if (canPreview && FILE_TYPE_PDF.includes(fileSuffix)) {
|
||||
const url = previewPdf(file.id)
|
||||
window.open(url)
|
||||
return
|
||||
}
|
||||
// 其余可预览文件仍使用KKFile进行预览
|
||||
kkFilePreview(fileFullUrl)
|
||||
},
|
||||
/**
|
||||
* 无水印下载
|
||||
* @param file
|
||||
*/
|
||||
handleDownload (file) {
|
||||
// 下载文件
|
||||
downloadFile(`/sys/common/downloadWithoutWaterMark/${file.id}`, file.fileName)
|
||||
},
|
||||
/**
|
||||
* 有水印下载
|
||||
* @param file
|
||||
*/
|
||||
handleWatermarkedDownload (file) {
|
||||
downloadFile(`/sys/common/download/${file.id}`, file.fileName)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.file-box {
|
||||
flex: 1;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
.file-btn > ::v-deep span {
|
||||
display: inline;
|
||||
color: @primary-color;
|
||||
font-size: 14px;
|
||||
}
|
||||
</style>
|
||||
-84
@@ -1,84 +0,0 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="$t('standardRegulationLibrary.standardResolutionSheet')"
|
||||
:maskClosable="false"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirm-loading="confirmLoading"
|
||||
fullscreen
|
||||
switchFullscreen
|
||||
@cancel="handleCancel">
|
||||
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<div class="page-container">
|
||||
<standard-resolution-sheet ref="resolutionSheet" />
|
||||
</div>
|
||||
</a-spin>
|
||||
|
||||
<template v-slot:footer>
|
||||
<a-button @click="handleCancel">{{ $t('close') }}</a-button>
|
||||
</template>
|
||||
|
||||
</j-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import StandardResolutionSheet from '../../../../components/StandardResolutionSheet.vue'
|
||||
|
||||
export default {
|
||||
name: 'StandardResolutionSheetModal',
|
||||
components: { StandardResolutionSheet },
|
||||
data () {
|
||||
return {
|
||||
width: '90%',
|
||||
visible: false,
|
||||
confirmLoading: false,
|
||||
splitId: null,
|
||||
isFullScreen: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open (id) {
|
||||
this.visible = true
|
||||
this.$nextTick(() => {
|
||||
const ids = id.split(',')
|
||||
this.$refs.resolutionSheet.queryParams = {
|
||||
id: ids[0],
|
||||
publishBeforeId: ids[1]
|
||||
}
|
||||
this.$refs.resolutionSheet.initClauseFieldList()
|
||||
this.$refs.resolutionSheet.initDetailInfo()
|
||||
})
|
||||
},
|
||||
handleCancel () {
|
||||
this.visible = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.page-container {
|
||||
min-height: 250px;
|
||||
height: calc(100vh - 200px - 55px - 54px - 48px);
|
||||
}
|
||||
|
||||
/deep/ .ant-modal-body {
|
||||
background: #F0F2F4;
|
||||
}
|
||||
|
||||
// 处理全屏状态下的样式问题
|
||||
.j-modal-box.fullscreen .ant-modal-content .ant-modal-body {
|
||||
.ant-spin-nested-loading {
|
||||
height: 100%;
|
||||
|
||||
/deep/ .ant-spin-container {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.page-container {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
-205
@@ -1,205 +0,0 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="$t('standardRegulationLibrary.submitQuestion')"
|
||||
:maskClosable="false"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirm-loading="confirmLoading"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel">
|
||||
|
||||
<a-form :form="form">
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<!-- 标题-->
|
||||
<a-form-item :label="$t('title')" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-input :placeholder="$t('pleaseEnter') + $t('title')"
|
||||
@change="event => event.target.value = event.target.value.trim()"
|
||||
:maxLength="50"
|
||||
v-decorator="['title', validatorRules.title]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<!-- 项目-->
|
||||
<a-form-item :label="$t('project')" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-select :placeholder="$t('pleaseSelect') + $t('project')"
|
||||
v-decorator="['project', validatorRules.project]"
|
||||
show-search
|
||||
:filter-option="filterOption">
|
||||
<a-select-option v-for="item in projectSelectOptions" :key="item.id" :title="item.projectName">{{ item.projectName }}</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<!-- 标准编号-->
|
||||
<a-form-item :label="$t('standardRegulationLibrary.standardDetail.standardNumber')" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-input :placeholder="$t('pleaseEnter') + $t('standardRegulationLibrary.standardDetail.standardNumber')"
|
||||
@change="event => event.target.value = event.target.value.trim()"
|
||||
:maxLength="50"
|
||||
disabled
|
||||
v-decorator="['standardNumber', validatorRules.standardNumber]" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<!-- 提问时间-->
|
||||
<a-form-item :label="$t('standardRegulationLibrary.standardDetail.problemOccurrenceTime')" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-date-picker :placeholder="$t('pleaseSelect') + $t('standardRegulationLibrary.standardDetail.problemOccurrenceTime')"
|
||||
:getCalendarContainer="(trigger) => trigger.parentNode"
|
||||
v-decorator="['quizTime', validatorRules.quizTime]"
|
||||
format="YYYY-MM-DD HH:mm:ss"
|
||||
value-format="YYYY-MM-DD HH:mm:ss"
|
||||
showTime
|
||||
style="width: 100%" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="24">
|
||||
<!-- 问题描述-->
|
||||
<a-form-item :label="$t('standardRegulationLibrary.standardDetail.problemDescription')"
|
||||
:labelCol="longLabelCol"
|
||||
:wrapperCol="longWrapperCol">
|
||||
<a-input :placeholder="$t('pleaseEnter') + $t('standardRegulationLibrary.standardDetail.problemDescription')"
|
||||
type="textarea"
|
||||
@change="event => event.target.value = event.target.value.trim()"
|
||||
:maxLength="500"
|
||||
v-decorator="['problemDescription', validatorRules.problemDescription]" />
|
||||
<j-upload v-decorator="['file', validatorRules.file]" return-id />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</j-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { submitDomesticQuestion, submitOverseasQuestion } from '../../../../api/standardRegulationLibraryApi.js'
|
||||
import { getCarTypeProjectList } from '../../../../api/projectLibraryApi.js'
|
||||
import { StandardSource } from '../../../../enums/commonEnums.js'
|
||||
import moment from 'moment'
|
||||
|
||||
export default {
|
||||
name: 'SubmitQuestionModal',
|
||||
data () {
|
||||
return {
|
||||
width: 800,
|
||||
visible: false,
|
||||
confirmLoading: false,
|
||||
form: this.$form.createForm(this),
|
||||
modal: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 8 }
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 }
|
||||
},
|
||||
longLabelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 4 }
|
||||
},
|
||||
longWrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 20 }
|
||||
},
|
||||
validatorRules: {
|
||||
// 标题
|
||||
title: {
|
||||
rules: [{ required: true, message: this.$t('pleaseEnter') + this.$t('title') }],
|
||||
validateTrigger: 'blur'
|
||||
},
|
||||
// 项目
|
||||
project: {
|
||||
rules: [{ required: false, message: this.$t('pleaseSelect') + this.$t('project') }],
|
||||
validateTrigger: 'change'
|
||||
},
|
||||
// 标准编号
|
||||
standardNumber: {
|
||||
rules: [{ required: true, message: this.$t('pleaseEnter') + this.$t('standardRegulationLibrary.standardDetail.standardNumber') }],
|
||||
validateTrigger: 'blur'
|
||||
},
|
||||
// 问题发生时间
|
||||
quizTime: {
|
||||
rules: [{ required: false, message: this.$t('pleaseSelect') + this.$t('standardRegulationLibrary.standardDetail.problemOccurrenceTime') }],
|
||||
validateTrigger: 'change'
|
||||
},
|
||||
// 问题描述
|
||||
problemDescription: {
|
||||
rules: [{ required: true, message: this.$t('pleaseEnter') + this.$t('standardRegulationLibrary.standardDetail.problemDescription') }],
|
||||
validateTrigger: 'blur'
|
||||
},
|
||||
// 附件
|
||||
file: {},
|
||||
type: null
|
||||
},
|
||||
projectSelectOptions: [] // 项目下拉数据
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open (standardNumber, type) {
|
||||
this.visible = true
|
||||
this.initProjectOptions()
|
||||
this.type = type
|
||||
const param = {}
|
||||
param.standardNumber = standardNumber
|
||||
param.quizTime = moment().format('YYYY-MM-DD HH:mm:ss')
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(param)
|
||||
})
|
||||
},
|
||||
// 获取项目下拉框数据
|
||||
initProjectOptions () {
|
||||
getCarTypeProjectList({ column: 'createTime', order: 'desc' }).then(res => {
|
||||
if (res.success) {
|
||||
this.projectSelectOptions = res.result
|
||||
} else {
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
handleOk () {
|
||||
if (this.confirmLoading) return
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
let submitFunc
|
||||
switch (this.type) {
|
||||
case StandardSource.DOMESTIC.value:
|
||||
submitFunc = submitDomesticQuestion
|
||||
break
|
||||
case StandardSource.OVERSEAS.value:
|
||||
submitFunc = submitOverseasQuestion
|
||||
break
|
||||
default:
|
||||
break
|
||||
}
|
||||
this.confirmLoading = true
|
||||
const param = Object.assign({}, values)
|
||||
submitFunc(param).then(res => {
|
||||
if (res.success) {
|
||||
this.$message.success(res.message)
|
||||
this.close()
|
||||
} else {
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
this.confirmLoading = false
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
close () {
|
||||
this.visible = false
|
||||
},
|
||||
filterOption (input, option) {
|
||||
return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
|
||||
</style>
|
||||
@@ -1,76 +0,0 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="$t('standardRegulationLibrary.updateRecord')"
|
||||
:maskClosable="false"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirm-loading="confirmLoading"
|
||||
switchFullscreen
|
||||
@cancel="handleCancel">
|
||||
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<template v-if="recordList && recordList.length > 0">
|
||||
<div class="record-item" v-for="record in recordList" :key="record.id">
|
||||
{{ record.content }}
|
||||
</div>
|
||||
</template>
|
||||
<a-empty v-else/>
|
||||
</a-spin>
|
||||
|
||||
<template v-slot:footer>
|
||||
<a-button @click="handleCancel">{{ $t('close') }}</a-button>
|
||||
</template>
|
||||
</j-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getDomesticStandardUpdateRecord } from '../../../../api/standardRegulationLibraryApi.js'
|
||||
|
||||
export default {
|
||||
name: 'UpdateRecordModal',
|
||||
data () {
|
||||
return {
|
||||
width: 800,
|
||||
visible: false,
|
||||
confirmLoading: false,
|
||||
recordList: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open (standardNumber) {
|
||||
this.visible = true
|
||||
this.initRecord(standardNumber)
|
||||
},
|
||||
initRecord (standardNumber) {
|
||||
this.confirmLoading = true
|
||||
getDomesticStandardUpdateRecord({ standardNumber }).then(res => {
|
||||
if (res.success) {
|
||||
this.recordList = res.result || []
|
||||
} else {
|
||||
this.$message.warn(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
this.confirmLoading = false
|
||||
})
|
||||
},
|
||||
handleCancel () {
|
||||
this.visible = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.record-item {
|
||||
padding: 20px 0;
|
||||
border-bottom: 1px solid #E5E6EB;
|
||||
}
|
||||
|
||||
.record-item:first-child {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.record-item:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
</style>
|
||||
-860
@@ -1,860 +0,0 @@
|
||||
<template>
|
||||
<a-card :bordered="false" class="page-left-right-layout">
|
||||
<!-- 树部分-->
|
||||
<div class="page-left-box">
|
||||
<a-input-search v-model="treeInput" class="tree-search"
|
||||
:placeholder="$t('standardRegulationLibrary.domesticStandard.treeSearchPlaceholder')"
|
||||
@search="handleTreeSearch" />
|
||||
<div class="page-tree-box page-tree-box-has-search">
|
||||
<a-spin :spinning="treeLoading">
|
||||
<a-tree :show-line="true"
|
||||
:show-icon="true"
|
||||
:tree-data="treeData"
|
||||
:expanded-keys.sync="expandedKeys"
|
||||
:selected-keys="selectedTreeKeys">
|
||||
<template #title="record">
|
||||
<div class="tree-operate-node"
|
||||
@mouseenter="handleTreeMouseover(record.key)"
|
||||
@mouseleave="handleTreeMouseout(record.key)"
|
||||
@click="handleSelectTreeNode(record)">
|
||||
<a-icon class="parent-node-icon"
|
||||
type="folder"
|
||||
v-if="record.dataRef.children && record.dataRef.children.length > 0" />
|
||||
<a-tooltip>
|
||||
<template #title>
|
||||
{{ record.title }}
|
||||
</template>
|
||||
<span class="tree-node-custom-title">{{ record.title }}</span>
|
||||
</a-tooltip>
|
||||
<div class="tree-operate-node-btn-box" :class="{'tree-operate-node-btn-box-hide': record.key !== mouseInNodeKey}">
|
||||
<!-- 新增-->
|
||||
<a-button icon="plus"
|
||||
class="tree-operate-node-btn"
|
||||
@click.stop="handleAddTreeNode(record)"
|
||||
v-if="record.nodeType !== StandardSystemTreeNodeType.NOT_OPERATE_NODE.value"
|
||||
v-has="'domesticStandard:tree:add'"></a-button>
|
||||
<!-- 编辑，根节点不能编辑-->
|
||||
<a-button class="tree-operate-node-btn"
|
||||
@click.stop="handleEditTreeNode(record)"
|
||||
v-has="'domesticStandard:tree:edit'"
|
||||
v-if="record.nodeType !== StandardSystemTreeNodeType.ROOT_NODE.value && record.nodeType !== StandardSystemTreeNodeType.NOT_OPERATE_NODE.value">
|
||||
<i class="iconfont icon-bianji" />
|
||||
</a-button>
|
||||
<!-- 删除，根节点不能删除-->
|
||||
<a-button class="tree-operate-node-btn"
|
||||
v-has="'domesticStandard:tree:delete'"
|
||||
v-if="record.nodeType !== StandardSystemTreeNodeType.ROOT_NODE.value && record.nodeType !== StandardSystemTreeNodeType.NOT_OPERATE_NODE.value"
|
||||
@click.stop="handleDelTreeNode(record)">
|
||||
<i class="iconfont icon-shanchu_" />
|
||||
</a-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</a-tree>
|
||||
</a-spin>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 表格部分-->
|
||||
<div class="page-right-box">
|
||||
<div class="table-page-search-wrapper">
|
||||
<search ref="searchRef"
|
||||
:url="url"
|
||||
:get-query-condition-func="getQueryConditionFunc"
|
||||
search-has="domesticStandard:search"
|
||||
@search="searchQuery"
|
||||
@reset="searchReset" />
|
||||
</div>
|
||||
|
||||
<div class="table-operator">
|
||||
<!-- 新增-->
|
||||
<a-button icon="plus" type="primary" @click="handleAdd" v-has="'domesticStandard:add'">{{ $t('newlyAdded') }}</a-button>
|
||||
<!-- 导入-->
|
||||
<a-upload name="file"
|
||||
:showUploadList="false"
|
||||
:multiple="false"
|
||||
:headers="tokenHeader"
|
||||
:action="importExcelUrl"
|
||||
v-has="'domesticStandard:import'"
|
||||
@change="handleImportExcel">
|
||||
<a-button type="primary" icon="download" ghost>{{ $t('import') }}</a-button>
|
||||
</a-upload>
|
||||
<!-- 导出-->
|
||||
<a-button icon="upload"
|
||||
type="primary"
|
||||
ghost
|
||||
v-has="'domesticStandard:export'"
|
||||
@click="handleExportXls($t('standardRegulationLibrary.domesticStandard.exportFileName'))">
|
||||
{{ $t('export') }}
|
||||
</a-button>
|
||||
<!-- 带文件导出-->
|
||||
<a-button icon="upload"
|
||||
type="primary"
|
||||
ghost
|
||||
v-has="'domesticStandard:exportFile'"
|
||||
@click="handleFileExport($t('standardRegulationLibrary.domesticStandard.exportFileName'))">
|
||||
{{ $t('exportWithFile') }}
|
||||
</a-button>
|
||||
<!-- 模板下载-->
|
||||
<a-button type="primary"
|
||||
icon="download"
|
||||
ghost
|
||||
v-has="'domesticStandard:downTemplate'"
|
||||
@click="downTemplate($t('standardRegulationLibrary.domesticStandard.templateName'))">
|
||||
{{ $t('templateDownload') }}
|
||||
</a-button>
|
||||
<!-- 批量删除-->
|
||||
<a-button type="primary" icon="delete" ghost @click="batchDel" v-has="'domesticStandard:batchDel'">{{
|
||||
$t('batchDelete')
|
||||
}}
|
||||
</a-button>
|
||||
<!-- 配置标准-->
|
||||
<a-button type="primary" icon="setting" ghost @click="handleConfigStandard" v-has="'domesticStandard:configStandard'">
|
||||
{{ $t('standardRegulationLibrary.configStandard') }}
|
||||
</a-button>
|
||||
<!-- 移出标准-->
|
||||
<a-button type="primary"
|
||||
icon="minus-circle"
|
||||
ghost
|
||||
@click="handleRemoveStandard"
|
||||
v-has="'domesticStandard:removeStandard'">
|
||||
{{ $t('standardRegulationLibrary.removeStandard') }}
|
||||
</a-button>
|
||||
</div>
|
||||
<div>
|
||||
<j-table
|
||||
v-if="columns && columns.length > 0"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:can-drag="true"
|
||||
rowKey="id"
|
||||
:row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
|
||||
:pagination="ipagination"
|
||||
:scroll="{x: '100%', y: yScrollHeight}"
|
||||
:loading="loading"
|
||||
@change="tableOnChange">
|
||||
|
||||
<!-- 标准编号-->
|
||||
<template v-slot:standard_number="{text, record}">
|
||||
<a-tooltip overlay-class-name="tooltip-style">
|
||||
<template slot="title">{{ text || text === 0 ? text : global.emptyLine }}</template>
|
||||
<div class="table-text can-click-table-text" v-if="text || text === 0" @click="filePreview(record)">{{
|
||||
text
|
||||
}}
|
||||
</div>
|
||||
<div v-else class="table-text">{{ global.emptyLine }}</div>
|
||||
</a-tooltip>
|
||||
</template>
|
||||
|
||||
<!-- 标准名称-->
|
||||
<template v-slot:standard_name="{text, record}">
|
||||
<a-tooltip overlay-class-name="tooltip-style">
|
||||
<template slot="title">{{ text || text === 0 ? text : global.emptyLine }}</template>
|
||||
<div class="table-text can-click-table-text" v-if="text || text === 0" @click="filePreview(record)">{{
|
||||
text
|
||||
}}
|
||||
</div>
|
||||
<div v-else class="table-text">{{ global.emptyLine }}</div>
|
||||
</a-tooltip>
|
||||
</template>
|
||||
|
||||
<template v-slot:operation="{text, record}">
|
||||
<template v-if="operationList.length > operateMaxNum + 1">
|
||||
<!-- 收藏-->
|
||||
<a @click="operationClick(operationList[0],record)"
|
||||
v-if="operationList[0].text === $t('standardRegulationLibrary.domesticStandard.cancelCollection')">
|
||||
<i class="iconfont icon-star1" v-show="record.collectionFlag" />
|
||||
<i class="iconfont icon-star" v-show="!record.collectionFlag" />
|
||||
</a>
|
||||
<a v-else @click="operationClick(operationList[0],record)">
|
||||
<div class="operate-btn">
|
||||
<!-- 查看图标-->
|
||||
<i class="iconfont icon-link operate-btn-icon" v-if="operationList[0].text === $t('view')" />
|
||||
<!-- 编辑图标-->
|
||||
<i class="iconfont icon-bianji operate-btn-icon" v-if="operationList[0].text === $t('edit')" />
|
||||
<!-- 分享图标-->
|
||||
<i class="iconfont icon-fangxingfenxiang operate-btn-icon" v-if="operationList[0].text === $t('share')" />
|
||||
<!-- 删除图标-->
|
||||
<i class="iconfont icon-shanchu_ operate-btn-icon" v-if="operationList[0].text === $t('delete')" />
|
||||
{{ operationList[0].text }}
|
||||
</div>
|
||||
</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-dropdown placement="bottomCenter">
|
||||
<a-icon type="more" class="operate-icon-btn operate-icon-more" />
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item v-for="(operation, index) in operationList.slice(operateMaxNum)" :key="index">
|
||||
<a @click="operationClick(operation,record)">
|
||||
<div class="operate-btn">
|
||||
<!-- 查看图标-->
|
||||
<i class="iconfont icon-link operate-btn-icon" v-if="operation.text === $t('view')" />
|
||||
<!-- 编辑图标-->
|
||||
<i class="iconfont icon-bianji operate-btn-icon" v-if="operation.text === $t('edit')" />
|
||||
<!-- 分享图标-->
|
||||
<i class="iconfont icon-fangxingfenxiang operate-btn-icon" v-if="operation.text === $t('share')" />
|
||||
<!-- 删除图标-->
|
||||
<i class="iconfont icon-shanchu_ operate-btn-icon" v-if="operation.text === $t('delete')" />
|
||||
{{ operation.text }}
|
||||
</div>
|
||||
</a>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</a-dropdown>
|
||||
</template>
|
||||
<template v-else-if="operationList.length > 0">
|
||||
<template v-for="(operation, index) in operationList">
|
||||
<!-- 收藏-->
|
||||
<a :key="index" @click="operationClick(operationList[0],record)"
|
||||
v-if="operation.text === $t('standardRegulationLibrary.domesticStandard.cancelCollection')">
|
||||
<i class="iconfont icon-star1" v-show="record.collectionFlag" />
|
||||
<i class="iconfont icon-star" v-show="!record.collectionFlag" />
|
||||
</a>
|
||||
<a v-else @click="operationClick(operation,record)" style="display: inline-block">
|
||||
<div class="operate-btn">
|
||||
<!-- 编辑图标-->
|
||||
<i class="iconfont icon-bianji operate-btn-icon" v-if="operation.text === $t('edit')" />
|
||||
<!-- 分享图标-->
|
||||
<i class="iconfont icon-fangxingfenxiang operate-btn-icon" v-if="operation.text === $t('share')" />
|
||||
<!-- 删除图标-->
|
||||
<i class="iconfont icon-shanchu_ operate-btn-icon" v-if="operation.text === $t('delete')" />
|
||||
{{ operation.text }}
|
||||
</div>
|
||||
</a>
|
||||
<a-divider type="vertical" v-if="index !== operationList.length - 1" />
|
||||
</template>
|
||||
</template>
|
||||
</template>
|
||||
</j-table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 新增、编辑-->
|
||||
<domestic-standard-modal ref="modalForm" @ok="modalFormOk" />
|
||||
<!-- 分享选人-->
|
||||
<user-select-modal ref="userSelectModal" type="checkbox" @change="continueShare" />
|
||||
<!-- 树新增、编辑-->
|
||||
<domestic-system-tree-modal ref="treeModal" @ok="modalFormOk" />
|
||||
<!-- 配置标准-->
|
||||
<selection-domestic-standard-drawer ref="standardSelectionModal"
|
||||
:node-code="selectedTreeNodeCodes[0]"
|
||||
@change="continueConfigStandard" />
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Vue from 'vue'
|
||||
import '@assets/less/common.less'
|
||||
import { ConfigurableTableMixin } from '@/mixins/ConfigurableTableMixin'
|
||||
import Search from '../../../components/customField/Search.vue'
|
||||
import JTable from '../../../components/jero/JTable.vue'
|
||||
import DomesticStandardModal from './modules/DomesticStandardModal.vue'
|
||||
import {
|
||||
configDomesticStandard,
|
||||
deleteDomesticSystemTree,
|
||||
getDomesticStandardDetail,
|
||||
getDomesticStandardFormModal,
|
||||
getDomesticStandardSearchForm,
|
||||
getDomesticStandardTableHeader,
|
||||
getDomesticStandardTree,
|
||||
removeDomesticStandard,
|
||||
shareDomesticStandard,
|
||||
collectionDomesticStandard,
|
||||
cancelCollectionDomesticStandard
|
||||
} from '../../../api/standardRegulationLibraryApi'
|
||||
import { OperationType, StandardSource, StandardSystemTreeNodeType, YesOrNoEnum } from '../../../enums/commonEnums'
|
||||
import UserSelectModal from '../../../components/selection/UserSelectModal.vue'
|
||||
import DomesticSystemTreeModal from './modules/DomesticSystemTreeModal.vue'
|
||||
import SelectionDomesticStandardDrawer from './modules/SelectionDomesticStandardDrawer.vue'
|
||||
import { postDownFile } from '@api/manage'
|
||||
import { ACCESS_TOKEN } from '@/store/mutation-types'
|
||||
import { previewPdf } from '@/utils/previewPdf'
|
||||
import { kkFilePreview } from '@/utils/kkFilePreview'
|
||||
import { getFileInfo } from '@api/api'
|
||||
import { mapGetters } from 'vuex'
|
||||
|
||||
export default {
|
||||
name: 'DomesticStandardList',
|
||||
components: {
|
||||
Search,
|
||||
JTable,
|
||||
DomesticStandardModal,
|
||||
UserSelectModal,
|
||||
DomesticSystemTreeModal,
|
||||
SelectionDomesticStandardDrawer
|
||||
},
|
||||
mixins: [ConfigurableTableMixin],
|
||||
data () {
|
||||
return {
|
||||
StandardSystemTreeNodeType,
|
||||
treeInput: null, // 树查询绑定值
|
||||
treeData: [],
|
||||
mouseInNodeKey: null, // 鼠标悬浮的节点key值
|
||||
showAction: true,
|
||||
operationList: [
|
||||
// 收藏
|
||||
{
|
||||
text: this.$t('standardRegulationLibrary.domesticStandard.cancelCollection'),
|
||||
clickEvent: 'handleCollection',
|
||||
has: 'domesticStandard:collection'
|
||||
},
|
||||
// 查看
|
||||
{
|
||||
text: this.$t('view'),
|
||||
clickEvent: 'toDetailPage',
|
||||
has: 'domesticStandard:view'
|
||||
},
|
||||
// 编辑
|
||||
{
|
||||
text: this.$t('edit'),
|
||||
clickEvent: 'handleEdit',
|
||||
has: 'domesticStandard:edit'
|
||||
},
|
||||
// 分享
|
||||
{
|
||||
text: this.$t('share'),
|
||||
clickEvent: 'handleShare',
|
||||
has: 'domesticStandard:share'
|
||||
},
|
||||
// 删除
|
||||
{
|
||||
text: this.$t('delete'),
|
||||
clickEvent: 'handleDelete',
|
||||
has: 'domesticStandard:delete'
|
||||
}
|
||||
],
|
||||
getTableHeaderFunc: getDomesticStandardTableHeader,
|
||||
getQueryConditionFunc: getDomesticStandardSearchForm,
|
||||
url: {
|
||||
list: '/laws/standard/domestic/getCommonPage',
|
||||
delete: '/laws/standard/domestic/deleteByIdsAndModule',
|
||||
deleteBatch: '/laws/standard/domestic/deleteByIdsAndModule',
|
||||
downTemplateUrl: '/laws/standard/domestic/templateDownload', // 下载模板
|
||||
exportXlsUrl: '/laws/standard/domestic/exportData', // 导出
|
||||
exportZipUrl: '/laws/standard/domestic/exportDataWithFile', // 带文件导出
|
||||
importExcelUrl: '/laws/standard/domestic/importExcelWithData' // 导入
|
||||
},
|
||||
yesValue: YesOrNoEnum.YES.value,
|
||||
noValue: YesOrNoEnum.NO.value,
|
||||
nowShareInfo: {}, // 当前正在分享的数据
|
||||
selectedTreeKeys: [], // 选中的树节点key
|
||||
selectedTreeNodeCodes: [], // 选中树节点的code
|
||||
tableSlotField: ['standard_name', 'standard_number'], // 表格中需要插槽的字段
|
||||
treeLoading: false,
|
||||
isCollection: false,
|
||||
expandedKeys: [], // 展开的节点
|
||||
needFilterTableBtn: true
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['userInfo']),
|
||||
importExcelUrl () {
|
||||
return `${window._CONFIG.domianURL}/${this.url.importExcelUrl}`
|
||||
},
|
||||
// 当前用户是否管理员
|
||||
isAdmin () {
|
||||
const adminRoleList = window._CONFIG.adminRoleCode.split(',')
|
||||
const userRoleList = this.userInfo.roleCode.split(',')
|
||||
return userRoleList.some(tt => adminRoleList.includes(tt))
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.initTreeData()
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 获取树数据
|
||||
*/
|
||||
initTreeData () {
|
||||
this.treeLoading = true
|
||||
const params = {
|
||||
nodeName: this.treeInput
|
||||
}
|
||||
if (!params.nodeName) {
|
||||
delete params.nodeName
|
||||
}
|
||||
getDomesticStandardTree(params).then(res => {
|
||||
this.treeData = []
|
||||
this.selectedTreeKeys = []
|
||||
this.selectedTreeNodeCodes = []
|
||||
this.filters.nodeCode = null
|
||||
if (res.success) {
|
||||
this.treeData = res.result || []
|
||||
// 根节点默认展开
|
||||
this.expandedKeys = [this.treeData[0].key]
|
||||
} else {
|
||||
this.$message.warn(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
this.treeLoading = false
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 树节点查询
|
||||
*/
|
||||
handleTreeSearch () {
|
||||
this.initTreeData()
|
||||
},
|
||||
/**
|
||||
* 树节点鼠标移入
|
||||
* @param key
|
||||
*/
|
||||
handleTreeMouseover (key) {
|
||||
this.mouseInNodeKey = key
|
||||
},
|
||||
/**
|
||||
* 树节点鼠标移出
|
||||
* @param key
|
||||
*/
|
||||
handleTreeMouseout (key) {
|
||||
if (this.mouseInNodeKey === key) {
|
||||
this.mouseInNodeKey = null
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 收藏/取消收藏
|
||||
* @param record
|
||||
*/
|
||||
handleCollection ({ collectionFlag, id: standardId, standard_number: standardNumber }) {
|
||||
if (this.isCollection) {
|
||||
return
|
||||
}
|
||||
this.isCollection = true
|
||||
let params
|
||||
let submitFunc
|
||||
// 取消收藏
|
||||
if (collectionFlag) {
|
||||
params = { id: standardId, standardNumber }
|
||||
submitFunc = cancelCollectionDomesticStandard
|
||||
} else {
|
||||
params = { standardId, standardNumber }
|
||||
submitFunc = collectionDomesticStandard
|
||||
}
|
||||
// 收藏
|
||||
submitFunc(params).then(res => {
|
||||
if (res.success) {
|
||||
this.$message.success(res.message)
|
||||
this.loadData()
|
||||
} else {
|
||||
this.$message.warn(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
this.isCollection = false
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 分享
|
||||
*/
|
||||
handleShare ({ id, standard_number: standardNumber }) {
|
||||
this.nowShareInfo = {
|
||||
standardId: id,
|
||||
standardNumber
|
||||
}
|
||||
this.$refs.userSelectModal.open()
|
||||
},
|
||||
/**
|
||||
* 选择分享的人之后继续分享
|
||||
* @param ids
|
||||
*/
|
||||
continueShare (ids) {
|
||||
const params = Object.assign(this.nowShareInfo, {
|
||||
recipientId: ids // 分享给的用户的id
|
||||
})
|
||||
this.loading = true
|
||||
shareDomesticStandard(params).then(res => {
|
||||
if (res.success) {
|
||||
this.$message.success(res.message)
|
||||
} else {
|
||||
this.$message.warn(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
modalFormOk () {
|
||||
this.selectedTreeKeys = []
|
||||
this.filters.nodeCode = null
|
||||
this.initTreeData()
|
||||
// 新增/修改 成功时，重载列表
|
||||
this.loadData()
|
||||
// 清空列表选中
|
||||
this.onClearSelected()
|
||||
},
|
||||
/**
|
||||
* 新增树节点
|
||||
* @param dataRef
|
||||
*/
|
||||
handleAddTreeNode ({ dataRef }) {
|
||||
this.$refs.treeModal.add({ parentId: dataRef.id, parentCode: dataRef.nodeCode })
|
||||
},
|
||||
/**
|
||||
* 编辑树节点
|
||||
* @param dataRef
|
||||
*/
|
||||
handleEditTreeNode ({ dataRef }) {
|
||||
this.$refs.treeModal.edit(dataRef)
|
||||
},
|
||||
/**
|
||||
* 删除树节点
|
||||
* @param dataRef
|
||||
*/
|
||||
handleDelTreeNode ({ dataRef }) {
|
||||
this.$confirm({
|
||||
title: this.$t('confirmDeletion'),
|
||||
content: this.$t('areYouSure'),
|
||||
onOk: () => {
|
||||
deleteDomesticSystemTree({ id: dataRef.id }).then((res) => {
|
||||
if (res.success) {
|
||||
this.$message.success(res.message)
|
||||
this.modalFormOk()
|
||||
} else {
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 选中树节点
|
||||
* @param dataRef
|
||||
*/
|
||||
handleSelectTreeNode ({ dataRef }) {
|
||||
this.selectedTreeKeys = [dataRef.key]
|
||||
this.selectedTreeNodeCodes = [dataRef.nodeCode]
|
||||
this.filters.nodeCode = dataRef.nodeCode
|
||||
this.loadData(1)
|
||||
},
|
||||
/**
|
||||
* 配置标准
|
||||
*/
|
||||
handleConfigStandard () {
|
||||
if (!this.selectedTreeNodeCodes || this.selectedTreeNodeCodes.length === 0 ||
|
||||
this.selectedTreeNodeCodes.includes('MyCollection') || this.selectedTreeNodeCodes.includes('A02')) {
|
||||
this.$message.warn(this.$t('standardRegulationLibrary.configStandardNoTreeNode'))
|
||||
return
|
||||
}
|
||||
this.$refs.standardSelectionModal.open()
|
||||
},
|
||||
/**
|
||||
* 配置标准-提交
|
||||
* @param dbFieldName
|
||||
* @param standardIds
|
||||
*/
|
||||
continueConfigStandard (dbFieldName, standardIds) {
|
||||
this.loading = true
|
||||
const params = {
|
||||
nodeCode: this.selectedTreeNodeCodes[0],
|
||||
ids: standardIds
|
||||
}
|
||||
configDomesticStandard(params).then(res => {
|
||||
if (res.success) {
|
||||
this.$message.success(res.message)
|
||||
this.loadData()
|
||||
} else {
|
||||
this.$message.warn(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 移出标准
|
||||
*/
|
||||
handleRemoveStandard () {
|
||||
// 没选择左侧树节点，需要提示“请先选择二级及以下体系”
|
||||
if (!this.selectedTreeNodeCodes || this.selectedTreeNodeCodes.length === 0 || this.selectedTreeNodeCodes.includes('A02')) {
|
||||
this.$message.warn(this.$t('standardRegulationLibrary.configStandardNoTreeNode'))
|
||||
return
|
||||
}
|
||||
// 左侧节点选的是我的收藏，不可移出标准
|
||||
if (this.selectedTreeNodeCodes[0] === 'MyCollection') {
|
||||
this.$message.warn(this.$t('enterpriseStandardLibrary.standard.myCollectNotRemove'))
|
||||
return
|
||||
}
|
||||
// 没有选择列表数据，需要提示“选中至少一条列表数据”
|
||||
if (!this.selectedRowKeys || this.selectedRowKeys.length === 0) {
|
||||
this.$message.warning(this.$t('standardRegulationLibrary.selectLeastOneTableData'))
|
||||
return
|
||||
}
|
||||
this.loading = true
|
||||
const params = {
|
||||
nodeCode: this.selectedTreeNodeCodes[0],
|
||||
ids: this.selectedRowKeys.join(',')
|
||||
}
|
||||
removeDomesticStandard(params).then(res => {
|
||||
if (res.success) {
|
||||
this.$message.success(res.message)
|
||||
// 判断当前删除的数据是否是最后一页的最后一条数据，如果是的话页码减一
|
||||
if (this.ipagination.current > 1 && ((this.ipagination.current - 1) * this.ipagination.pageSize) + 1 === this.ipagination.total) {
|
||||
this.ipagination.current -= 1
|
||||
}
|
||||
this.loadData()
|
||||
} else {
|
||||
this.$message.warn(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 跳转详情页
|
||||
* @param id
|
||||
* @param standardNumber
|
||||
*/
|
||||
toDetailPage ({ id }) {
|
||||
this.$openPageNewSheet({
|
||||
path: '/standardRegulationLibrary/DomesticStandardDetail',
|
||||
query: {
|
||||
id
|
||||
}
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 按顺序打开最新的pdf或word
|
||||
*/
|
||||
async filePreview (record) {
|
||||
console.log('filePreview', record)
|
||||
// 获取并处理过程稿件数据
|
||||
let res = await getDomesticStandardFormModal({ type: 1 })
|
||||
if (!res.success) {
|
||||
this.$message.warn(res.message)
|
||||
console.log('getDomesticStandardFormModal error:', res)
|
||||
return
|
||||
}
|
||||
console.log('res.result', res.result)
|
||||
const data = res.result || {}
|
||||
const form = data
|
||||
const partList = Object.keys(data)
|
||||
let part
|
||||
const partZh = '过程稿件'
|
||||
const partEn = 'Process Manuscript'
|
||||
if (partList.includes(partEn))part = partEn
|
||||
if (partList.includes(partZh))part = partZh
|
||||
console.log('part', part)
|
||||
const processManuscript = form[part]
|
||||
console.log('过程稿件', processManuscript)
|
||||
|
||||
// 获取并处理详情数据
|
||||
res = await getDomesticStandardDetail({ id: record.id, type: 1 })
|
||||
if (!res.success) {
|
||||
this.$message.warn(res.message)
|
||||
console.log('getDomesticStandardDetail error:', res)
|
||||
return
|
||||
}
|
||||
const detailData = Object.assign({}, res.result || {})
|
||||
console.log('detailData', detailData)
|
||||
|
||||
// 选择合适的文件
|
||||
let file = null
|
||||
const pdfFileList = []
|
||||
const docFileList = []
|
||||
let newestFileList = []
|
||||
// 按照过程稿件顺序寻找文件
|
||||
for (const formItem of processManuscript) {
|
||||
const keyId = formItem.dbFieldName
|
||||
const keyName = formItem.dbFieldName + '_dictText'
|
||||
if (!detailData[keyId]) continue
|
||||
const idArray = detailData[keyId].split(',')
|
||||
const nameArray = detailData[keyName].split(',')
|
||||
// 每个过程中可能有多个文件
|
||||
for (let i = 0; i < idArray.length; i++) {
|
||||
const id = idArray[i]
|
||||
const name = nameArray[i]
|
||||
var suffix = name.substring(name.lastIndexOf('.') + 1)
|
||||
if (suffix === 'pdf') {
|
||||
pdfFileList.push({ id, name, suffix })
|
||||
}
|
||||
if (suffix === 'doc' || suffix === 'docx') {
|
||||
docFileList.push({ id, name, suffix })
|
||||
}
|
||||
}
|
||||
// 一旦一个过程中找到pdf或者doc，就可以退出
|
||||
if (pdfFileList.length > 0 || docFileList.length > 0) {
|
||||
break
|
||||
}
|
||||
}
|
||||
newestFileList = pdfFileList // 默认从pdf里选最新的文件
|
||||
if (pdfFileList.length === 0)newestFileList = docFileList // 如果没有pdf文件，就从doc文件里选
|
||||
file = await this.selectNewestFile(newestFileList)
|
||||
if (file === null) { // 没有找到文件就退出
|
||||
console.log('没有找到符合要求的文件！')
|
||||
this.$message.error('没有找到符合要求的文件！')
|
||||
return
|
||||
}
|
||||
console.log('seletedFile', file)
|
||||
|
||||
// 预览选择的文件
|
||||
const fileFullUrl = `${window._CONFIG.domianWebSocketURL}/sys/common/view/${file.id}?at=${Vue.ls.get(ACCESS_TOKEN)}&fullfilename=${file.name}`
|
||||
console.log(fileFullUrl)
|
||||
if (file.suffix === 'pdf') { // pdf预览
|
||||
const url = previewPdf(file.id)
|
||||
window.open(url)
|
||||
return
|
||||
}
|
||||
kkFilePreview(fileFullUrl)// 其余可预览文件仍使用KKFile进行预览
|
||||
},
|
||||
/**
|
||||
* 从文件列表里选择最新文件
|
||||
* @param fileList
|
||||
*/
|
||||
async selectNewestFile (fileList) {
|
||||
if (!fileList || fileList.length === 0) return null
|
||||
if (fileList.length === 1) return fileList[0]
|
||||
const newFileList = []
|
||||
// 获取时间信息
|
||||
for (const file of fileList) {
|
||||
const res = await getFileInfo(file)
|
||||
newFileList.push({ ...file, ...res.result })
|
||||
}
|
||||
// 排序取出最新
|
||||
newFileList.sort((a, b) => b.id - a.id) // 日期只精确到天，用id更能区分
|
||||
console.log('newFileList', newFileList)
|
||||
return newFileList[0]
|
||||
},
|
||||
/**
|
||||
* 重置查询
|
||||
*/
|
||||
searchReset () {
|
||||
this.searchParams = {}
|
||||
this.selectedRowKeys = []
|
||||
this.selectedTreeKeys = []
|
||||
delete this.filters.nodeCode
|
||||
this.getTableHeader()
|
||||
this.loadData()
|
||||
},
|
||||
// 导出改成用post
|
||||
handleExportXls (fileName) {
|
||||
if (!fileName || typeof fileName !== 'string') {
|
||||
fileName = '导出文件'
|
||||
}
|
||||
const param = this.getQueryParams()
|
||||
if (this.selectedRowKeys && this.selectedRowKeys.length > 0) {
|
||||
param.selections = this.selectedRowKeys.join(',')
|
||||
}
|
||||
console.log('导出参数', param)
|
||||
// 加一个大的提示
|
||||
const modalLoading = this.$info({
|
||||
title: '提示',
|
||||
content: <span>正在导出，请稍候 <a-spin size="small" /></span>,
|
||||
keyboard: false
|
||||
})
|
||||
// 把知道了这个按钮去掉
|
||||
this.$nextTick(() => {
|
||||
document.getElementsByClassName('ant-modal-confirm-btns')[0].style = 'display:none'
|
||||
})
|
||||
postDownFile(this.url.exportXlsUrl, param).then((data) => {
|
||||
if (!data || data.size === 0) {
|
||||
this.$message.warning('文件下载失败')
|
||||
return
|
||||
}
|
||||
if (typeof window.navigator.msSaveBlob !== 'undefined') {
|
||||
window.navigator.msSaveBlob(new Blob([data]), fileName + '.xls')
|
||||
} else {
|
||||
const url = window.URL.createObjectURL(new Blob([data]))
|
||||
const link = document.createElement('a')
|
||||
link.style.display = 'none'
|
||||
link.href = url
|
||||
link.setAttribute('download', fileName + '.xls')
|
||||
document.body.appendChild(link)
|
||||
link.click()
|
||||
document.body.removeChild(link) // 下载完成移除元素
|
||||
window.URL.revokeObjectURL(url) // 释放掉blob对象
|
||||
}
|
||||
}).finally(() => {
|
||||
// 销毁这个提示
|
||||
modalLoading.destroy()
|
||||
})
|
||||
},
|
||||
// 带文件导出
|
||||
handleFileExport (fileName) {
|
||||
if (!fileName || typeof fileName !== 'string') {
|
||||
fileName = '导出文件'
|
||||
}
|
||||
const param = this.getQueryParams()
|
||||
if (this.selectedRowKeys && this.selectedRowKeys.length > 0) {
|
||||
param.selections = this.selectedRowKeys.join(',')
|
||||
}
|
||||
param.module = StandardSource.DOMESTIC.value
|
||||
console.log('导出参数', param)
|
||||
// 加一个大的提示
|
||||
const modalLoading = this.$info({
|
||||
title: '提示',
|
||||
content: <span>正在导出，请稍候 <a-spin size="small" /></span>,
|
||||
keyboard: false
|
||||
})
|
||||
// 把知道了这个按钮去掉
|
||||
this.$nextTick(() => {
|
||||
document.getElementsByClassName('ant-modal-confirm-btns')[0].style = 'display:none'
|
||||
})
|
||||
postDownFile(this.url.exportZipUrl, param).then((data) => {
|
||||
if (!data) {
|
||||
this.$message.warning('文件下载失败')
|
||||
}
|
||||
if (typeof window.navigator.msSaveBlob !== 'undefined') {
|
||||
window.navigator.msSaveBlob(new Blob([data]), fileName + '.zip')
|
||||
} else {
|
||||
const url = window.URL.createObjectURL(new Blob([data]))
|
||||
const link = document.createElement('a')
|
||||
link.style.display = 'none'
|
||||
link.href = url
|
||||
link.setAttribute('download', fileName + '.zip')
|
||||
document.body.appendChild(link)
|
||||
link.click()
|
||||
document.body.removeChild(link) // 下载完成移除元素
|
||||
window.URL.revokeObjectURL(url) // 释放掉blob对象
|
||||
}
|
||||
// }
|
||||
}).finally(() => {
|
||||
// 销毁这个提示
|
||||
modalLoading.destroy()
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 新增-非管理员用户跳转流程发起页面，不能修改操作类型
|
||||
*/
|
||||
handleAdd () {
|
||||
if (!this.isAdmin) {
|
||||
this.$router.push({
|
||||
path: '/workCenter/StandardEntryOrChangeProcess',
|
||||
query: {
|
||||
source: StandardSource.DOMESTIC.value, // 国内标准
|
||||
operateType: OperationType.ENTRY.value // 入库
|
||||
}
|
||||
})
|
||||
return
|
||||
}
|
||||
this.$refs.modalForm.add()
|
||||
this.$refs.modalForm.title = this.$t('newlyAdded')
|
||||
this.$refs.modalForm.disableSubmit = false
|
||||
},
|
||||
handleEdit (record) {
|
||||
if (!this.isAdmin) {
|
||||
this.$router.push({
|
||||
path: '/workCenter/StandardEntryOrChangeProcess',
|
||||
query: {
|
||||
source: StandardSource.DOMESTIC.value, // 国内标准
|
||||
operateType: OperationType.CHANGE.value, // 变更
|
||||
standardId: record.id // 标准id
|
||||
}
|
||||
})
|
||||
return
|
||||
}
|
||||
this.$refs.modalForm.edit(record)
|
||||
this.$refs.modalForm.title = this.$t('edit')
|
||||
this.$refs.modalForm.disableSubmit = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
@import '~@assets/less/common.less';
|
||||
|
||||
/deep/ .ant-tree li span.ant-tree-switcher.ant-tree-switcher-noop {
|
||||
color: #1D2129;
|
||||
}
|
||||
|
||||
.parent-node-icon {
|
||||
color: #1D2129;
|
||||
font-size: 16px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
</style>
|
||||
-138
@@ -1,138 +0,0 @@
|
||||
<template>
|
||||
<a-drawer
|
||||
:title="title"
|
||||
:width="width"
|
||||
placement="right"
|
||||
:closable="true"
|
||||
@close="handleCancel"
|
||||
:visible="visible"
|
||||
:maskClosable="false"
|
||||
destroyOnClose
|
||||
class="custom-drawer-style"
|
||||
>
|
||||
<div class="custom-drawer-style-scroll">
|
||||
<a-spin :spinning="confirmLoading" style="width: 100%;height:100%">
|
||||
<add-form ref="addForm"
|
||||
:flag="StandardSource.DOMESTIC.value"
|
||||
:get-form-func="getFormFunc"
|
||||
:get-document-info-func="getDocumentInfoFunc"
|
||||
:special-placeholder="specialPlaceholder"
|
||||
:default-value="defaultValue"
|
||||
:disabled-field-list="disabledField"
|
||||
:exclude-standard-fields="excludeStandardFields"
|
||||
domestic-special-check
|
||||
:flag-by-field="{associated_foreign_standards: StandardSource.OVERSEAS.value}"
|
||||
@submitFormData="submitFormData" />
|
||||
</a-spin>
|
||||
</div>
|
||||
<div class="custom-drawer-style-bottom-btn">
|
||||
<a-button @click="handleCancel" style="margin-bottom: 0;" :loading="confirmLoading">{{ $t('close') }}</a-button>
|
||||
<a-button @click="handleOk" type="primary" style="margin-bottom: 0;" :loading="confirmLoading">
|
||||
{{ $t('preservation') }}
|
||||
</a-button>
|
||||
</div>
|
||||
</a-drawer>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import AddForm from '../../../../components/customField/AddForm.vue'
|
||||
import {
|
||||
getDomesticStandardDocumentInfo,
|
||||
getDomesticStandardFormModal,
|
||||
addDomesticStandard,
|
||||
editDomesticStandard
|
||||
} from '../../../../api/standardRegulationLibraryApi'
|
||||
import { StandardSource } from '../../../../enums/commonEnums.js'
|
||||
|
||||
export default {
|
||||
name: 'DomesticStandardModal',
|
||||
components: { AddForm },
|
||||
data () {
|
||||
return {
|
||||
StandardSource,
|
||||
visible: false,
|
||||
title: '',
|
||||
width: 800,
|
||||
// 存储表单的数据
|
||||
form: {},
|
||||
confirmLoading: false,
|
||||
getFormFunc: getDomesticStandardFormModal,
|
||||
getDocumentInfoFunc: getDomesticStandardDocumentInfo,
|
||||
// 特殊的placeholder
|
||||
specialPlaceholder: {
|
||||
standard_number_temp: `${this.$t('standardRegulationLibrary.inputExample')}7258`
|
||||
},
|
||||
defaultValue: {
|
||||
year_number: new Date().getFullYear() + ''
|
||||
},
|
||||
isEdit: null // 是否编辑
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
// 不可编辑的字段
|
||||
disabledField () {
|
||||
if (this.isEdit) {
|
||||
// 标准编号，被代替标准号，被引用标准号，标准类别，年代号
|
||||
return ['standard_number_temp', 'replaced_by_standard_number', 'referenced_standard', 'standard_class', 'year_number']
|
||||
}
|
||||
return ['replaced_by_standard_number', 'referenced_standard']
|
||||
},
|
||||
excludeStandardFields () {
|
||||
if (this.isEdit) {
|
||||
return ['substitute_standard_number', 'reference_standard']
|
||||
}
|
||||
return []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
add () {
|
||||
this.visible = true
|
||||
this.isEdit = false
|
||||
this.$nextTick(() => {
|
||||
this.$refs.addForm.add()
|
||||
})
|
||||
},
|
||||
edit (record) {
|
||||
this.visible = true
|
||||
this.isEdit = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.addForm.edit(record)
|
||||
})
|
||||
},
|
||||
handleOk () {
|
||||
this.$refs.addForm.submit()
|
||||
},
|
||||
// 表单提交的回调，获取表单数据
|
||||
submitFormData (formInline) {
|
||||
this.confirmLoading = true
|
||||
let submitFunc
|
||||
if (formInline.id) {
|
||||
submitFunc = editDomesticStandard
|
||||
} else {
|
||||
submitFunc = addDomesticStandard
|
||||
}
|
||||
submitFunc(formInline).then((res) => {
|
||||
if (res.success) {
|
||||
this.$message.success(res.message)
|
||||
this.$emit('ok')
|
||||
this.close()
|
||||
} else {
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
this.confirmLoading = false
|
||||
})
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
close () {
|
||||
this.visible = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
-104
@@ -1,104 +0,0 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:maskClosable="false"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
:confirm-loading="confirmLoading"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel">
|
||||
|
||||
<a-form :form="form">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="$t('standardRegulationLibrary.nodeName')">
|
||||
<a-input :placeholder="$t('pleaseEnter') + $t('standardRegulationLibrary.nodeName')"
|
||||
@change="event => event.target.value = event.target.value.trim()"
|
||||
:maxLength="50"
|
||||
v-decorator="['nodeName', validatorRules.nodeName]" />
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
|
||||
</j-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { addDomesticSystemTree, editDomesticSystemTree } from '../../../../api/standardRegulationLibraryApi'
|
||||
|
||||
export default {
|
||||
name: 'DomesticSystemTreeModal',
|
||||
data () {
|
||||
return {
|
||||
title: this.$t('operation'),
|
||||
width: 800,
|
||||
visible: false,
|
||||
confirmLoading: false,
|
||||
form: this.$form.createForm(this),
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 4 }
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 20 }
|
||||
},
|
||||
validatorRules: {
|
||||
// 节点名称
|
||||
nodeName: {
|
||||
rules: [{ required: true, message: this.$t('pleaseEnter') + this.$t('standardRegulationLibrary.nodeName') }],
|
||||
validateTrigger: 'blur'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
add (parentInfo) {
|
||||
this.edit(parentInfo)
|
||||
},
|
||||
edit (record) {
|
||||
this.form.resetFields()
|
||||
this.model = Object.assign({}, record)
|
||||
this.visible = true
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(this.model)
|
||||
})
|
||||
},
|
||||
close () {
|
||||
this.visible = false
|
||||
},
|
||||
handleOk () {
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
this.confirmLoading = true
|
||||
const formData = Object.assign(this.model, values)
|
||||
formData.nodeOrder = '0'
|
||||
let submitFunc
|
||||
if (this.model.id) {
|
||||
submitFunc = editDomesticSystemTree
|
||||
} else {
|
||||
submitFunc = addDomesticSystemTree
|
||||
}
|
||||
submitFunc(formData).then(res => {
|
||||
if (res.success) {
|
||||
this.$message.success(res.message)
|
||||
this.$emit('ok')
|
||||
this.close()
|
||||
} else {
|
||||
this.$message.warn(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
this.confirmLoading = false
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
|
||||
</style>
|
||||
-238
@@ -1,238 +0,0 @@
|
||||
<template>
|
||||
<a-drawer
|
||||
:title="$t('standardSelect.standardSelection')"
|
||||
:maskClosable="false"
|
||||
:width="1000"
|
||||
placement="right"
|
||||
:closable="true"
|
||||
@close="handleCancel"
|
||||
:visible="visible"
|
||||
class="custom-drawer-style">
|
||||
<div class="custom-drawer-style-scroll">
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :sm="8">
|
||||
<a-form-item :label="$t('standardSelect.standardNumOrName')" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-input :placeholder="$t('pleaseEnter')+$t('standardSelect.standardNumOrName')"
|
||||
v-model="queryParam.standardNumberOrName"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<div style="float: right;overflow: hidden;margin-right: 41px;margin-bottom: 20px"
|
||||
class="table-page-search-submitButtons">
|
||||
<a-button class="box-button" style="margin-left: 8px" @click="searchReset">{{ $t('reset') }}</a-button>
|
||||
<a-button class="box-button" style="margin-left: 8px" type="primary" @click="searchQuery">{{
|
||||
$t('query')
|
||||
}}
|
||||
</a-button>
|
||||
</div>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<a-table
|
||||
:columns="columns"
|
||||
rowKey="serial_number"
|
||||
:scroll="{x: 900}"
|
||||
:data-source="dataList"
|
||||
:pagination="ipagination"
|
||||
:row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
|
||||
:loading="loading"
|
||||
@change="handleTableChange">
|
||||
|
||||
<!-- 标准编号、标准名称跳转详情-->
|
||||
<template v-slot:detail="text, record">
|
||||
<a-tooltip overlay-class-name="tooltip-style">
|
||||
<template slot="title">{{ text || text === 0 ? text : global.emptyLine }}</template>
|
||||
<div class="table-text can-click-table-text" v-if="text || text === 0" @click="toDetailPage(record)">{{ text }}</div>
|
||||
<div v-else class="table-text">{{ global.emptyLine }}</div>
|
||||
</a-tooltip>
|
||||
</template>
|
||||
|
||||
<template slot="text" slot-scope="text">
|
||||
<a-tooltip overlay-class-name="tooltip-style">
|
||||
<template slot="title">{{ text || text === 0 ? text : global.emptyLine }}</template>
|
||||
<div class="table-text">{{ text || text === 0 ? text : global.emptyLine }}</div>
|
||||
</a-tooltip>
|
||||
</template>
|
||||
|
||||
</a-table>
|
||||
</div>
|
||||
|
||||
<div class="custom-drawer-style-bottom-btn">
|
||||
<a-button @click="handleCancel">{{ $t('cancel') }}</a-button>
|
||||
<a-button @click="handleSubmit" type="primary" :loading="confirmLoading">{{ $t('submit') }}</a-button>
|
||||
</div>
|
||||
</a-drawer>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getDomesticStandardNoSystem } from '../../../../api/standardRegulationLibraryApi.js'
|
||||
import { StandardSource } from '../../../../enums/commonEnums.js'
|
||||
|
||||
export default {
|
||||
name: 'SelectionDomesticStandardDrawer',
|
||||
props: {
|
||||
// 选中节点code
|
||||
nodeCode: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: null
|
||||
},
|
||||
query: {
|
||||
type: Object,
|
||||
required: false,
|
||||
default: () => {
|
||||
return {}
|
||||
}
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
visible: false,
|
||||
confirmLoading: false,
|
||||
labelCol: {
|
||||
sm: 8
|
||||
},
|
||||
wrapperCol: {
|
||||
sm: 14
|
||||
},
|
||||
selectedRowKeys: [],
|
||||
selectedRowList: [],
|
||||
loading: false,
|
||||
queryParam: {},
|
||||
/* 分页参数 */
|
||||
ipagination: {
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
pageSizeOptions: ['10', '30', '50', '100', '150', '200'],
|
||||
showTotal: (total, range) => {
|
||||
return range[0] + '-' + range[1] + ' ' + this.$t('total') + ' ' + total + ' ' + this.$t('strip')
|
||||
},
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
total: 0
|
||||
},
|
||||
columns: [
|
||||
// 标准号
|
||||
{
|
||||
title: this.$t('standardSelect.standardNumber'),
|
||||
dataIndex: 'standardNumber',
|
||||
align: 'center',
|
||||
width: 150,
|
||||
scopedSlots: { customRender: 'detail' }
|
||||
},
|
||||
// 标准名称
|
||||
{
|
||||
title: this.$t('standardSelect.standardName'),
|
||||
dataIndex: 'standardName',
|
||||
align: 'center',
|
||||
width: 150,
|
||||
scopedSlots: { customRender: 'detail' }
|
||||
},
|
||||
// 发布日期
|
||||
{
|
||||
title: this.$t('standardSelect.releaseDate'),
|
||||
dataIndex: 'releaseDate',
|
||||
align: 'center',
|
||||
width: 120,
|
||||
scopedSlots: { customRender: 'text' }
|
||||
},
|
||||
// 标准状态
|
||||
{
|
||||
title: this.$t('projectLibrary.vehicleItemLibrary.standardState'),
|
||||
dataIndex: 'standardState_dictText',
|
||||
align: 'center',
|
||||
width: 120,
|
||||
scopedSlots: { customRender: 'text' }
|
||||
}
|
||||
],
|
||||
dataList: [],
|
||||
url: {
|
||||
searchList: 'document/bussDocumentLibraryEO/queryCondition' // 搜索字段
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open () {
|
||||
this.visible = true
|
||||
this.queryParam = {}
|
||||
this.replacePage()
|
||||
},
|
||||
// 获取表格数据
|
||||
replacePage () {
|
||||
const query = {
|
||||
...this.queryParam,
|
||||
pageNo: this.ipagination.current,
|
||||
pageSize: this.ipagination.pageSize,
|
||||
nodeCode: this.nodeCode,
|
||||
source: StandardSource.DOMESTIC.value
|
||||
}
|
||||
this.selectedRowKeys = []
|
||||
this.loading = true
|
||||
getDomesticStandardNoSystem(query).then((res) => {
|
||||
if (res.success) {
|
||||
this.dataList = res.result.records
|
||||
this.ipagination.total = res.result.total
|
||||
this.selectedRowKeys = this.standard[this.query.db_field_name] ? this.standard[this.query.db_field_name].split(',') : []
|
||||
} else {
|
||||
this.dataList = []
|
||||
}
|
||||
}).finally(() => {
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
searchQuery () {
|
||||
this.replacePage()
|
||||
},
|
||||
searchReset () {
|
||||
this.queryParam = {}
|
||||
this.replacePage()
|
||||
},
|
||||
// 表格选择改变
|
||||
onSelectChange (value, row) {
|
||||
this.selectedRowKeys = value
|
||||
this.selectedRowList = row
|
||||
},
|
||||
handleCancel () {
|
||||
this.visible = false
|
||||
},
|
||||
handleSubmit () {
|
||||
const serialNumber = []
|
||||
const replaceStandardId = []
|
||||
if (this.selectedRowKeys && this.selectedRowKeys.length > 0) {
|
||||
// let content = JSON.parse(JSON.stringify(this.selectedRowList))
|
||||
this.selectedRowList.forEach(res => {
|
||||
serialNumber.push(res.serial_number)
|
||||
replaceStandardId.push(res.id)
|
||||
})
|
||||
this.$emit('input', serialNumber.join(','))
|
||||
this.$emit('change', this.query.dbFieldName, replaceStandardId.join(','))
|
||||
// this.$emit('changecontent', this.content)
|
||||
this.visible = false
|
||||
} else {
|
||||
this.$message.warning(this.$t('selectLeastOne'))
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 跳转详情页
|
||||
* @param id
|
||||
*/
|
||||
toDetailPage ({ id }) {
|
||||
this.$openPageNewSheet({
|
||||
path: '/standardRegulationLibrary/DomesticStandardDetail',
|
||||
query: {
|
||||
id
|
||||
}
|
||||
})
|
||||
},
|
||||
handleTableChange (pagination) {
|
||||
this.ipagination = pagination
|
||||
this.replacePage()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -1,138 +0,0 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item :label="$t('log.tableName')">
|
||||
<a-input :placeholder="$t('pleaseEnter') + $t('log.tableName')" v-model="queryParam.dataTable"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="8">
|
||||
<a-form-item :label="$t('log.dataID')">
|
||||
<a-input :placeholder="$t('pleaseEnter') + 'ID'" v-model="queryParam.dataId"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="searchQuery">{{ $t('query') }}</a-button>
|
||||
<a-button style="margin-left: 8px" @click="searchReset">{{ $t('reset') }}</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator">
|
||||
<a-button @click="handleCompare()" type="primary" icon="plus">{{ $t('log.dataComparison') }}</a-button>
|
||||
</div>
|
||||
|
||||
<!--table区 -->
|
||||
<div>
|
||||
<!--已选择的清空 -->
|
||||
<div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
|
||||
<i class="anticon anticon-info-circle ant-alert-icon"></i>{{$t('selected')}} <a style="font-weight: 600">{{ selectedRowKeys.length }}</a>{{ $t('term') }}
|
||||
<a style="margin-left: 24px" @click="onClearSelected">{{ $t('empty') }}</a>
|
||||
</div>
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys,onChange: onSelectChange}"
|
||||
@change="handleTableChange"
|
||||
>
|
||||
<!-- 字符串超长截取省略号显示-->
|
||||
<span slot="dataContent" slot-scope="text">
|
||||
<j-ellipsis :value="text" :length="80" />
|
||||
</span>
|
||||
</a-table>
|
||||
</div>
|
||||
<data-log-modal ref="modalForm" @ok="modalFormOk"></data-log-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import DataLogModal from './modules/DataLogModal'
|
||||
import { JeroListMixin } from '@/mixins/JeroListMixin'
|
||||
import JEllipsis from '@/components/jero/JEllipsis'
|
||||
|
||||
export default {
|
||||
name: 'DataLogList',
|
||||
mixins: [JeroListMixin],
|
||||
components: {
|
||||
JEllipsis,
|
||||
DataLogModal
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
description: '数据日志管理页面',
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: this.$t('log.tableName'),
|
||||
align: 'center',
|
||||
dataIndex: 'dataTable',
|
||||
width: '120'
|
||||
}, {
|
||||
title: this.$t('log.dataID'),
|
||||
align: 'center',
|
||||
dataIndex: 'dataId',
|
||||
width: '120'
|
||||
}, {
|
||||
title: this.$t('log.versionNumber'),
|
||||
align: 'center',
|
||||
dataIndex: 'dataVersion',
|
||||
width: '50'
|
||||
}, {
|
||||
title: this.$t('log.dataContent'),
|
||||
align: 'center',
|
||||
dataIndex: 'dataContent',
|
||||
width: '150',
|
||||
scopedSlots: { customRender: 'dataContent' }
|
||||
}, {
|
||||
title: this.$t('creator'),
|
||||
align: 'center',
|
||||
dataIndex: 'createBy',
|
||||
width: '100'
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: '/sys/dataLog/page'
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleCompare: function () {
|
||||
if (!this.selectionRows || this.selectionRows.length !== 2) {
|
||||
this.openNotifIcon(this.$t('log.selectTwoPiecesData'))
|
||||
return false
|
||||
} else if (this.selectionRows[0].dataId !== this.selectionRows[1].dataId) {
|
||||
this.openNotifIcon(this.$t('log.selectSameDatabase'))
|
||||
return false
|
||||
} else {
|
||||
this.$refs.modalForm.addModal(this.selectionRows)
|
||||
this.$refs.modalForm.title = this.$t('log.dataComparison')
|
||||
}
|
||||
},
|
||||
openNotifIcon (msg) {
|
||||
this.$notification.warning({
|
||||
message: this.$t('log.promptInformation'),
|
||||
description: msg
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less';
|
||||
</style>
|
||||
@@ -1,673 +0,0 @@
|
||||
<template xmlns:background-color="http://www.w3.org/1999/xhtml">
|
||||
<a-row :gutter="10">
|
||||
<a-col :md="12" :sm="24">
|
||||
<a-card :bordered="false">
|
||||
|
||||
<!-- 按钮操作区域 -->
|
||||
<a-row style="margin: 0 0 0 14px" class="table-operator">
|
||||
<a-button @click="handleAdd(1)" type="primary">添加部门</a-button>
|
||||
<a-button @click="handleAdd(2)" type="primary">添加下级</a-button>
|
||||
<a-button type="primary" icon="download" @click="handleExportXls('部门信息')">导出</a-button>
|
||||
<a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
|
||||
<a-button type="primary" icon="import">导入</a-button>
|
||||
</a-upload>
|
||||
<j-third-app-button biz-type="depart" :selected-row-keys="selectedRowKeys" syncToApp @sync-finally="onSyncFinally"/>
|
||||
<a-button title="删除多条数据" @click="batchDel" type="default">批量删除</a-button>
|
||||
</a-row>
|
||||
<div style="background: #fff;padding-left:16px;height: 100%; margin-top: 5px">
|
||||
<a-alert type="info" :showIcon="true">
|
||||
<div slot="message">
|
||||
当前选择：<span v-if="this.currSelected.title">{{ getCurrSelectedTitle() }}</span>
|
||||
<a v-if="this.currSelected.title" style="margin-left: 10px" @click="onClearSelected">取消选择</a>
|
||||
</div>
|
||||
</a-alert>
|
||||
<a-input-search @search="onSearch" style="width:100%;margin-top: 10px" placeholder="请输入部门名称"/>
|
||||
<!-- 树-->
|
||||
<a-col :md="10" :sm="24">
|
||||
<template>
|
||||
<a-dropdown :trigger="[this.dropTrigger]" @visibleChange="dropStatus">
|
||||
<span style="user-select: none">
|
||||
<a-tree
|
||||
v-if="loading"
|
||||
:checkable="true"
|
||||
multiple
|
||||
@select="onSelect"
|
||||
@check="onCheck"
|
||||
@rightClick="rightHandle"
|
||||
:selectedKeys="selectedKeys"
|
||||
:checkedKeys="checkedKeys"
|
||||
:treeData="departTree"
|
||||
:checkStrictly="checkStrictly"
|
||||
:expandedKeys.sync="iExpandedKeys"
|
||||
:load-data="loadSubTree"
|
||||
@expand="onExpand"/>
|
||||
</span>
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item @click="handleAdd(3)" key="1">添加</a-menu-item>
|
||||
<a-menu-item @click="handleDelete" key="2">删除</a-menu-item>
|
||||
<a-menu-item @click="closeDrop" key="3">取消</a-menu-item>
|
||||
</a-menu>
|
||||
</a-dropdown>
|
||||
</template>
|
||||
</a-col>
|
||||
</div>
|
||||
</a-card>
|
||||
<!---- author:os_chengtgen -- date:20190827 -- for:切换父子勾选模式 =======------>
|
||||
<div class="drawer-bootom-button">
|
||||
<a-dropdown :trigger="['click']" placement="topCenter">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="switchCheckStrictly(1)">父子关联</a-menu-item>
|
||||
<a-menu-item key="2" @click="switchCheckStrictly(2)">取消关联</a-menu-item>
|
||||
<a-menu-item key="3" @click="checkALL">全部勾选</a-menu-item>
|
||||
<a-menu-item key="4" @click="cancelCheckALL">取消全选</a-menu-item>
|
||||
<a-menu-item key="5" @click="expandAll">展开所有</a-menu-item>
|
||||
<a-menu-item key="6" @click="closeAll">合并所有</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button>
|
||||
树操作 <a-icon type="up" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<!---- author:os_chengtgen -- date:20190827 -- for:切换父子勾选模式 =======------>
|
||||
</a-col>
|
||||
<a-col :md="12" :sm="24">
|
||||
<a-tabs defaultActiveKey="1">
|
||||
<a-tab-pane tab="基本信息" key="1" >
|
||||
<a-card :bordered="false" v-if="selectedKeys.length>0">
|
||||
<a-form-model ref="form" :model="model" :rules="validatorRules">
|
||||
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="机构名称" prop="departName" >
|
||||
<a-input placeholder="请输入机构/部门名称" v-model="model.departName"/>
|
||||
</a-form-model-item>
|
||||
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="上级部门" prop="parentId">
|
||||
<a-tree-select style="width:100%" :dropdownStyle="{maxHeight:'200px',overflow:'auto'}" :treeData="treeData" :disabled="disable" v-model="model.parentId" placeholder="无">
|
||||
</a-tree-select>
|
||||
</a-form-model-item>
|
||||
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="机构编码" prop="orgCode">
|
||||
<a-input disabled placeholder="请输入机构编码" v-model="model.orgCode"/>
|
||||
</a-form-model-item>
|
||||
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="机构类型" prop="orgCategory">
|
||||
<template v-if="orgCategoryDisabled">
|
||||
<a-radio-group v-model="model.orgCategory" placeholder="请选择机构类型">
|
||||
<a-radio value="1">
|
||||
公司
|
||||
</a-radio>
|
||||
</a-radio-group>
|
||||
</template>
|
||||
<template v-else>
|
||||
<a-radio-group v-model="model.orgCategory" placeholder="请选择机构类型">
|
||||
<a-radio value="2">
|
||||
部门
|
||||
</a-radio>
|
||||
<a-radio value="3">
|
||||
岗位
|
||||
</a-radio>
|
||||
</a-radio-group>
|
||||
</template>
|
||||
</a-form-model-item>
|
||||
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="排序" prop="departOrder">
|
||||
<a-input-number v-model="model.departOrder"/>
|
||||
</a-form-model-item>
|
||||
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="手机号" prop="mobile">
|
||||
<a-input placeholder="请输入手机号" v-model="model.mobile"/>
|
||||
</a-form-model-item>
|
||||
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="地址" prop="address">
|
||||
<a-input placeholder="请输入地址" v-model="model.address"/>
|
||||
</a-form-model-item>
|
||||
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="备注" prop="memo">
|
||||
<a-textarea placeholder="请输入备注" v-model="model.memo"/>
|
||||
</a-form-model-item>
|
||||
</a-form-model>
|
||||
<div class="anty-form-btn">
|
||||
<a-button @click="emptyCurrForm" type="default" htmlType="button" icon="sync">重置</a-button>
|
||||
<a-button @click="submitCurrForm" type="primary" htmlType="button" icon="form">保存</a-button>
|
||||
</div>
|
||||
</a-card>
|
||||
<a-card v-else >
|
||||
<a-empty>
|
||||
<span slot="description"> 请先选择一个部门! </span>
|
||||
</a-empty>
|
||||
</a-card>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane tab="部门权限" key="2" forceRender>
|
||||
<depart-auth-modal ref="departAuth"/>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
|
||||
</a-col>
|
||||
<depart-modal ref="departModal" @ok="loadTree"></depart-modal>
|
||||
</a-row>
|
||||
</template>
|
||||
<script>
|
||||
import DepartModal from './modules/DepartModal'
|
||||
import { deleteByDepartId, queryDepartTreeSync, searchByKeywords } from '@/api/api'
|
||||
import { httpAction, postAction } from '@/api/manage'
|
||||
import { JeroListMixin } from '@/mixins/JeroListMixin'
|
||||
import DepartAuthModal from './modules/DepartAuthModal'
|
||||
import { cloneObject } from '@/utils/util'
|
||||
import JThirdAppButton from '@comp/jerobiz/thirdApp/JThirdAppButton'
|
||||
// 表头
|
||||
const columns = [
|
||||
{
|
||||
title: '机构名称',
|
||||
dataIndex: 'departName'
|
||||
},
|
||||
{
|
||||
title: '机构类型',
|
||||
align: 'center',
|
||||
dataIndex: 'orgType'
|
||||
},
|
||||
{
|
||||
title: '机构编码',
|
||||
dataIndex: 'orgCode'
|
||||
},
|
||||
{
|
||||
title: '手机号',
|
||||
dataIndex: 'mobile'
|
||||
},
|
||||
{
|
||||
title: '传真',
|
||||
dataIndex: 'fax'
|
||||
},
|
||||
{
|
||||
title: '地址',
|
||||
dataIndex: 'address'
|
||||
},
|
||||
{
|
||||
title: '排序',
|
||||
align: 'center',
|
||||
dataIndex: 'departOrder'
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
align: 'center',
|
||||
dataIndex: 'action',
|
||||
scopedSlots: { customRender: 'action' }
|
||||
}
|
||||
]
|
||||
export default {
|
||||
name: 'DepartList',
|
||||
mixins: [JeroListMixin],
|
||||
components: {
|
||||
JThirdAppButton,
|
||||
DepartAuthModal,
|
||||
DepartModal
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
iExpandedKeys: [],
|
||||
loading: true,
|
||||
autoExpandParent: false,
|
||||
currFlowId: '',
|
||||
currFlowName: '',
|
||||
disable: true,
|
||||
treeData: [],
|
||||
visible: false,
|
||||
departTree: [],
|
||||
departTreeAll: [],
|
||||
loadedKeys: [],
|
||||
allIds: [],
|
||||
rightClickSelectedKey: '',
|
||||
rightClickSelectedOrgCode: '',
|
||||
hiding: true,
|
||||
model: {},
|
||||
dropTrigger: '',
|
||||
depart: {},
|
||||
columns: columns,
|
||||
disableSubmit: false,
|
||||
checkedKeys: [],
|
||||
selectedKeys: [],
|
||||
autoIncr: 1,
|
||||
currSelected: {},
|
||||
|
||||
allTreeKeys: [],
|
||||
loadTreeKeys: [],
|
||||
checkStrictly: true,
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 }
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 }
|
||||
},
|
||||
graphDatasource: {
|
||||
nodes: [],
|
||||
edges: []
|
||||
},
|
||||
validatorRules: {
|
||||
departName: [{ required: true, message: '请输入机构/部门名称!' }],
|
||||
orgCode: [{ required: true, message: '请输入机构编码!' }],
|
||||
orgCategory: [{ required: true, message: '请输入机构类型!' }],
|
||||
mobile: [{ validator: this.validateMobile }]
|
||||
},
|
||||
url: {
|
||||
delete: '/sys/sysDepart/delete',
|
||||
edit: '/sys/sysDepart/edit',
|
||||
deleteBatch: '/sys/sysDepart/deleteBatch',
|
||||
exportXlsUrl: 'sys/sysDepart/exportXls',
|
||||
importExcelUrl: 'sys/sysDepart/importExcel'
|
||||
},
|
||||
orgCategoryDisabled: false
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
importExcelUrl: function () {
|
||||
return `${window._CONFIG.domianURL}/${this.url.importExcelUrl}`
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
loadData () {
|
||||
this.refresh()
|
||||
},
|
||||
loadTree () {
|
||||
const that = this
|
||||
// 上级部门树信息
|
||||
that.treeData = []
|
||||
// 保存的树信息，搜索是需要用到
|
||||
that.departTreeAll = []
|
||||
// 所有的树信息
|
||||
that.departTree = []
|
||||
// 所有的树节点key信息
|
||||
that.allIds = []
|
||||
|
||||
that.iExpandedKeys = []
|
||||
|
||||
that.loading = false
|
||||
queryDepartTreeSync().then((res) => {
|
||||
if (res.success) {
|
||||
this.allTreeKeys = []
|
||||
for (let i = 0; i < res.result.length; i++) {
|
||||
const temp = res.result[i]
|
||||
that.treeData.push(temp)
|
||||
that.departTreeAll.push(temp)
|
||||
that.departTree.push(temp)
|
||||
that.allIds.push(temp.key)
|
||||
that.allTreeKeys.push(temp.key)
|
||||
if (that.loadTreeKeys.indexOf(temp.key) >= 0) {
|
||||
that.iExpandedKeys.push(temp.key)
|
||||
}
|
||||
}
|
||||
that.$nextTick(() => {
|
||||
that.loading = true
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
loadSubTree (treeNode) {
|
||||
const that = this
|
||||
return new Promise(resolve => {
|
||||
queryDepartTreeSync({ pid: treeNode.dataRef.id }).then((res) => {
|
||||
if (res.success) {
|
||||
// 判断chidlren是否为空，并修改isLeaf属性值
|
||||
if (res.result.length === 0) {
|
||||
treeNode.dataRef.isLeaf = true
|
||||
return
|
||||
} else {
|
||||
treeNode.dataRef.children = res.result
|
||||
}
|
||||
for (let i = 0; i < res.result.length; i++) {
|
||||
const temp = res.result[i]
|
||||
that.allIds.push(temp.key)
|
||||
if (that.loadTreeKeys.indexOf(temp.key) > 0) {
|
||||
that.iExpandedKeys.push(temp.key)
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
resolve()
|
||||
})
|
||||
// 保存全部部门 信息，方便后面搜索使用
|
||||
// that.departTreeAll = that.departTree
|
||||
},
|
||||
refresh () {
|
||||
this.loading = true
|
||||
this.loadTree()
|
||||
},
|
||||
// 右键操作方法
|
||||
rightHandle (node) {
|
||||
this.dropTrigger = 'contextmenu'
|
||||
console.log(node.node.eventKey)
|
||||
this.rightClickSelectedKey = node.node.eventKey
|
||||
this.rightClickSelectedOrgCode = node.node.dataRef.orgCode
|
||||
},
|
||||
onExpand (expandedKeys) {
|
||||
console.log('onExpand', expandedKeys)
|
||||
this.iExpandedKeys = expandedKeys
|
||||
this.autoExpandParent = false
|
||||
this.allTreeKeys = expandedKeys
|
||||
this.loadTreeKeys = expandedKeys
|
||||
},
|
||||
backFlowList () {
|
||||
this.$router.back(-1)
|
||||
},
|
||||
// 右键点击下拉框改变事件
|
||||
dropStatus (visible) {
|
||||
if (visible === false) {
|
||||
this.dropTrigger = ''
|
||||
}
|
||||
},
|
||||
// 右键店家下拉关闭下拉框
|
||||
closeDrop () {
|
||||
this.dropTrigger = ''
|
||||
},
|
||||
addRootNode () {
|
||||
this.$refs.nodeModal.add(this.currFlowId, '')
|
||||
},
|
||||
batchDel: function () {
|
||||
console.log(this.checkedKeys)
|
||||
if (this.checkedKeys.length <= 0) {
|
||||
this.$message.warning('请选择一条记录！')
|
||||
} else {
|
||||
let ids = ''
|
||||
for (let a = 0; a < this.checkedKeys.length; a++) {
|
||||
ids += this.checkedKeys[a] + ','
|
||||
}
|
||||
const that = this
|
||||
this.$confirm({
|
||||
title: '确认删除',
|
||||
content: '确定要删除所选中的 ' + this.checkedKeys.length + ' 条数据，以及子节点数据吗?',
|
||||
onOk: function () {
|
||||
postAction(that.url.deleteBatch, { ids: ids }).then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message)
|
||||
that.loadTree()
|
||||
that.onClearSelected()
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
onSearch (value) {
|
||||
const that = this
|
||||
if (value) {
|
||||
searchByKeywords({ keyWord: value }).then((res) => {
|
||||
if (res.success) {
|
||||
that.departTree = []
|
||||
for (let i = 0; i < res.result.length; i++) {
|
||||
const temp = res.result[i]
|
||||
that.departTree.push(temp)
|
||||
}
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
} else {
|
||||
that.departTree = that.departTreeAll
|
||||
}
|
||||
},
|
||||
nodeModalOk () {
|
||||
this.loadTree()
|
||||
},
|
||||
nodeModalClose () {
|
||||
},
|
||||
hide () {
|
||||
this.visible = false
|
||||
},
|
||||
onCheck (checkedKeys, info) {
|
||||
console.log('onCheck', checkedKeys, info)
|
||||
this.hiding = false
|
||||
// this.checkedKeys = checkedKeys.checked
|
||||
// <!---- author:os_chengtgen -- date:20190827 -- for:切换父子勾选模式 =======------>
|
||||
if (this.checkStrictly) {
|
||||
this.checkedKeys = checkedKeys.checked
|
||||
} else {
|
||||
this.checkedKeys = checkedKeys
|
||||
}
|
||||
// <!---- author:os_chengtgen -- date:20190827 -- for:切换父子勾选模式 =======------>
|
||||
},
|
||||
onSelect (selectedKeys, e) {
|
||||
console.log('selected', selectedKeys, e)
|
||||
this.hiding = false
|
||||
const record = e.node.dataRef
|
||||
console.log('onSelect-record', record)
|
||||
this.currSelected = Object.assign({}, record)
|
||||
this.model = this.currSelected
|
||||
this.selectedKeys = [record.key]
|
||||
this.model.parentId = record.parentId
|
||||
this.setValuesToForm(record)
|
||||
this.$refs.departAuth.show(record.id)
|
||||
},
|
||||
// 触发onSelect事件时,为部门树右侧的form表单赋值
|
||||
setValuesToForm (record) {
|
||||
this.orgCategoryDisabled = (record.orgCategory + '') === '1'
|
||||
this.$nextTick(() => {
|
||||
this.model = cloneObject(record)
|
||||
})
|
||||
},
|
||||
getCurrSelectedTitle () {
|
||||
return !this.currSelected.title ? '' : this.currSelected.title
|
||||
},
|
||||
onClearSelected () {
|
||||
this.hiding = true
|
||||
this.checkedKeys = []
|
||||
this.currSelected = {}
|
||||
this.model = cloneObject(this.currSelected)
|
||||
this.selectedKeys = []
|
||||
this.$refs.departAuth.departId = ''
|
||||
},
|
||||
handleNodeTypeChange (val) {
|
||||
this.currSelected.nodeType = val
|
||||
},
|
||||
notifyTriggerTypeChange (value) {
|
||||
this.currSelected.notifyTriggerType = value
|
||||
},
|
||||
receiptTriggerTypeChange (value) {
|
||||
this.currSelected.receiptTriggerType = value
|
||||
},
|
||||
submitCurrForm () {
|
||||
this.$refs.form.validate((ok) => {
|
||||
if (ok) {
|
||||
if (!this.currSelected.id) {
|
||||
this.$message.warning('请点击选择要修改部门!')
|
||||
return
|
||||
}
|
||||
|
||||
const formData = Object.assign(this.currSelected, this.model)
|
||||
console.log('Received values of form: ', formData)
|
||||
httpAction(this.url.edit, formData, 'post').then((res) => {
|
||||
if (res.success) {
|
||||
this.$message.success('保存成功!')
|
||||
this.loadTree()
|
||||
} else {
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
emptyCurrForm () {
|
||||
this.model = this.currSelected
|
||||
},
|
||||
nodeSettingFormSubmit () {
|
||||
this.$refs.form.validate((ok) => {
|
||||
if (ok) {
|
||||
console.log('Received values of form: ', this.model)
|
||||
}
|
||||
})
|
||||
},
|
||||
openSelect () {
|
||||
this.$refs.sysDirectiveModal.show()
|
||||
},
|
||||
handleAdd (num) {
|
||||
if (num === 1) {
|
||||
this.$refs.departModal.add()
|
||||
this.$refs.departModal.title = '新增'
|
||||
} else if (num === 2) {
|
||||
const key = this.currSelected.key
|
||||
if (!key) {
|
||||
this.$message.warning('请先点击选中上级部门！')
|
||||
return false
|
||||
}
|
||||
this.$refs.departModal.add(this.selectedKeys[0])
|
||||
this.$refs.departModal.title = '新增'
|
||||
} else {
|
||||
this.$refs.departModal.add(this.rightClickSelectedKey)
|
||||
this.$refs.departModal.title = '新增'
|
||||
}
|
||||
},
|
||||
handleDelete () {
|
||||
const that = this
|
||||
this.$confirm({
|
||||
title: '确认删除',
|
||||
content: '确定要删除此部门以及子节点数据吗?',
|
||||
onOk: function () {
|
||||
deleteByDepartId({ id: that.rightClickSelectedKey }).then((resp) => {
|
||||
if (resp.success) {
|
||||
// 删除成功后，去除已选中中的数据
|
||||
that.checkedKeys.splice(that.checkedKeys.findIndex(key => key === that.rightClickSelectedKey), 1)
|
||||
that.$message.success('删除成功!')
|
||||
that.loadTree()
|
||||
// 删除后同步清空右侧基本信息内容
|
||||
const orgCode = that.model.orgCode
|
||||
if (orgCode && orgCode === that.rightClickSelectedOrgCode) {
|
||||
that.onClearSelected()
|
||||
}
|
||||
} else {
|
||||
that.$message.warning('删除失败!')
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
selectDirectiveOk (record) {
|
||||
console.log('选中指令数据', record)
|
||||
this.nodeSettingForm.setFieldsValue({ directiveCode: record.directiveCode })
|
||||
this.currSelected.sysCode = record.sysCode
|
||||
},
|
||||
getFlowGraphData (node) {
|
||||
this.graphDatasource.nodes.push({
|
||||
id: node.id,
|
||||
text: node.flowNodeName
|
||||
})
|
||||
if (node.children.length > 0) {
|
||||
for (let a = 0; a < node.children.length; a++) {
|
||||
const temp = node.children[a]
|
||||
this.graphDatasource.edges.push({
|
||||
source: node.id,
|
||||
target: temp.id
|
||||
})
|
||||
this.getFlowGraphData(temp)
|
||||
}
|
||||
}
|
||||
},
|
||||
// <!---- author:os_chengtgen -- date:20190827 -- for:切换父子勾选模式 =======------>
|
||||
expandAll () {
|
||||
this.iExpandedKeys = this.allTreeKeys
|
||||
// this.loadTree()
|
||||
},
|
||||
closeAll () {
|
||||
this.iExpandedKeys = []
|
||||
},
|
||||
checkALL () {
|
||||
this.checkStriccheckStrictlytly = false
|
||||
// this.checkedKeys = this.allTreeKeys
|
||||
this.checkedKeys = this.allIds
|
||||
},
|
||||
cancelCheckALL () {
|
||||
// this.checkedKeys = this.defaultCheckedKeys
|
||||
this.checkedKeys = []
|
||||
},
|
||||
switchCheckStrictly (v) {
|
||||
if (v === 1) {
|
||||
this.checkStrictly = false
|
||||
} else if (v === 2) {
|
||||
this.checkStrictly = true
|
||||
}
|
||||
},
|
||||
getAllKeys (node) {
|
||||
// console.log('node',node);
|
||||
this.allTreeKeys.push(node.key)
|
||||
if (node.children && node.children.length > 0) {
|
||||
for (let a = 0; a < node.children.length; a++) {
|
||||
this.getAllKeys(node.children[a])
|
||||
}
|
||||
}
|
||||
},
|
||||
// <!---- author:os_chengtgen -- date:20190827 -- for:切换父子勾选模式 =======------>
|
||||
|
||||
// 验证手机号
|
||||
validateMobile (rule, value, callback) {
|
||||
if (!value || new RegExp(/^1([38][0-9]|4[579]|5[0-3,5-9]|6[6]|7[0135678]|9[89])\d{8}$/).test(value)) {
|
||||
callback()
|
||||
} else {
|
||||
callback(new Error('您的手机号码格式不正确!'))
|
||||
}
|
||||
},
|
||||
onSyncFinally ({ isToLocal }) {
|
||||
// 同步到本地时刷新下数据
|
||||
if (isToLocal) {
|
||||
this.loadData()
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.currFlowId = this.$route.params.id
|
||||
this.currFlowName = this.$route.params.name
|
||||
// this.loadTree()
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less';
|
||||
</style>
|
||||
<style scoped>
|
||||
.ant-card-body .table-operator {
|
||||
margin: 15px;
|
||||
}
|
||||
|
||||
.anty-form-btn {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.anty-form-btn button {
|
||||
margin: 0 5px;
|
||||
}
|
||||
|
||||
.anty-node-layout .ant-layout-header {
|
||||
padding-right: 0
|
||||
}
|
||||
|
||||
.header {
|
||||
padding: 0 8px;
|
||||
}
|
||||
|
||||
.header button {
|
||||
margin: 0 3px
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp {
|
||||
height: 100%
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp .ant-modal-body {
|
||||
height: calc(100% - 110px) !important;
|
||||
overflow-y: auto
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp .ant-modal-content {
|
||||
height: 90% !important;
|
||||
overflow-y: hidden
|
||||
}
|
||||
|
||||
#app .desktop {
|
||||
height: auto !important;
|
||||
}
|
||||
|
||||
/** Button按钮间距 */
|
||||
.drawer-bootom-button {
|
||||
/*position: absolute;*/
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
border-top: 1px solid #e8e8e8;
|
||||
padding: 10px 16px;
|
||||
text-align: left;
|
||||
left: 0;
|
||||
background: #fff;
|
||||
border-radius: 0 0 2px 2px;
|
||||
}
|
||||
</style>
|
||||
@@ -1,228 +0,0 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator">
|
||||
<a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-button
|
||||
@click="batchDel"
|
||||
v-if="selectedRowKeys.length > 0"
|
||||
ghost
|
||||
type="primary"
|
||||
icon="delete">批量删除
|
||||
</a-button>
|
||||
</div>
|
||||
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
|
||||
<div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
|
||||
<i class="anticon anticon-info-circle ant-alert-icon"></i>已选择 <a style="font-weight: 600">{{
|
||||
selectedRowKeys.length }}</a>项
|
||||
<a style="margin-left: 24px" @click="onClearSelected">清空</a>
|
||||
</div>
|
||||
|
||||
<a-table
|
||||
:columns="columns"
|
||||
size="middle"
|
||||
:pagination="false"
|
||||
:dataSource="dataSource"
|
||||
:loading="loading"
|
||||
@expand="expandSubmenu"
|
||||
:expandedRowKeys="expandedRowKeys"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@expandedRowsChange="handleExpandedRowsChange">
|
||||
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="handleEdit(record)">编辑</a>
|
||||
|
||||
<a-divider type="vertical"/>
|
||||
<a-dropdown>
|
||||
<a class="ant-dropdown-link">
|
||||
更多 <a-icon type="down"/>
|
||||
</a>
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item>
|
||||
<a href="javascript:" @click="handleDetail(record)">详情</a>
|
||||
</a-menu-item>
|
||||
<a-menu-item>
|
||||
<a href="javascript:" @click="handleAddSub(record)">添加下级</a>
|
||||
</a-menu-item>
|
||||
<a-menu-item>
|
||||
<a href="javascript:" @click="handleDataRule(record)">数据规则</a>
|
||||
</a-menu-item>
|
||||
|
||||
<a-menu-item>
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)" placement="topLeft">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</a-dropdown>
|
||||
</span>
|
||||
<!-- 字符串超长截取省略号显示 -->
|
||||
<span slot="url" slot-scope="text">
|
||||
<j-ellipsis :value="text" :length="25"/>
|
||||
</span>
|
||||
<!-- 字符串超长截取省略号显示-->
|
||||
<span slot="component" slot-scope="text">
|
||||
<j-ellipsis :value="text"/>
|
||||
</span>
|
||||
</a-table>
|
||||
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
|
||||
<permission-modal ref="modalForm" @ok="modalFormOk"></permission-modal>
|
||||
<permission-data-rule-list ref="PermissionDataRuleList" @ok="modalFormOk"></permission-data-rule-list>
|
||||
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import PermissionModal from './modules/PermissionModal'
|
||||
import { getSystemMenuList, getSystemSubmenu, getSystemSubmenuBatch } from '@/api/api'
|
||||
import { JeroListMixin } from '@/mixins/JeroListMixin'
|
||||
import PermissionDataRuleList from './PermissionDataRuleList'
|
||||
import JEllipsis from '@/components/jero/JEllipsis'
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: '菜单名称',
|
||||
dataIndex: 'name',
|
||||
key: 'name'
|
||||
}, {
|
||||
title: '菜单类型',
|
||||
dataIndex: 'menuType',
|
||||
key: 'menuType',
|
||||
customRender: function (text) {
|
||||
if ((text + '') === '0') {
|
||||
return '菜单'
|
||||
} else if ((text + '') === '1') {
|
||||
return '菜单'
|
||||
} else if ((text + '') === '2') {
|
||||
return '按钮/权限'
|
||||
} else {
|
||||
return text
|
||||
}
|
||||
}
|
||||
}, /* {
|
||||
title: '权限编码',
|
||||
dataIndex: 'perms',
|
||||
key: 'permissionCode',
|
||||
}, */{
|
||||
title: 'icon',
|
||||
dataIndex: 'icon',
|
||||
key: 'icon'
|
||||
},
|
||||
{
|
||||
title: '组件',
|
||||
dataIndex: 'component',
|
||||
key: 'component',
|
||||
scopedSlots: { customRender: 'component' }
|
||||
},
|
||||
{
|
||||
title: '路径',
|
||||
dataIndex: 'url',
|
||||
key: 'url',
|
||||
scopedSlots: { customRender: 'url' }
|
||||
},
|
||||
{
|
||||
title: '排序',
|
||||
dataIndex: 'sortNo',
|
||||
key: 'sortNo'
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
scopedSlots: { customRender: 'action' },
|
||||
align: 'center',
|
||||
width: 150
|
||||
}
|
||||
]
|
||||
|
||||
export default {
|
||||
name: 'PermissionListAsync',
|
||||
mixins: [JeroListMixin],
|
||||
components: {
|
||||
PermissionDataRuleList,
|
||||
PermissionModal,
|
||||
JEllipsis
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
description: '这是菜单管理页面',
|
||||
// 表头
|
||||
columns: columns,
|
||||
loading: false,
|
||||
// 展开的行，受控属性
|
||||
expandedRowKeys: [],
|
||||
url: {
|
||||
list: '/sys/permission/page',
|
||||
delete: '/sys/permission/delete',
|
||||
deleteBatch: '/sys/permission/deleteBatch'
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
loadData () {
|
||||
this.loading = true
|
||||
getSystemMenuList().then((res) => {
|
||||
if (res.success) {
|
||||
this.dataSource = res.result
|
||||
return this.loadDataByExpandedRows(this.dataSource)
|
||||
}
|
||||
}).finally(() => {
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
expandSubmenu (expanded, record) {
|
||||
if (expanded && (!record.children || record.children.length === 0)) {
|
||||
getSystemSubmenu({ parentId: record.id }).then((res) => {
|
||||
if (res.success) {
|
||||
record.children = res.result
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
// 根据已展开的行查询数据（用于保存后刷新时异步加载子级的数据）
|
||||
loadDataByExpandedRows (dataList) {
|
||||
if (this.expandedRowKeys.length > 0) {
|
||||
return getSystemSubmenuBatch({ parentIds: this.expandedRowKeys.join(',') }).then((res) => {
|
||||
if (res.success) {
|
||||
const childrenMap = res.result
|
||||
const fn = (list) => {
|
||||
if (list && list.length > 0) {
|
||||
list.forEach(data => {
|
||||
if (this.expandedRowKeys.includes(data.id)) {
|
||||
data.children = childrenMap[data.id]
|
||||
fn(data.children)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
fn(dataList)
|
||||
}
|
||||
})
|
||||
} else {
|
||||
return Promise.resolve()
|
||||
}
|
||||
},
|
||||
// 打开数据规则编辑
|
||||
handleDataRule (record) {
|
||||
this.$refs.PermissionDataRuleList.edit(record)
|
||||
},
|
||||
handleAddSub (record) {
|
||||
this.$refs.modalForm.title = '添加子菜单'
|
||||
this.$refs.modalForm.disableSubmit = false
|
||||
this.$refs.modalForm.edit({ status: '1', permsType: '1', route: true, parentId: record.id, menuType: 1 })
|
||||
},
|
||||
handleExpandedRowsChange (expandedRows) {
|
||||
this.expandedRowKeys = expandedRows
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less';
|
||||
</style>
|
||||
@@ -1,188 +0,0 @@
|
||||
<template>
|
||||
<a-drawer
|
||||
title="数据权限规则"
|
||||
:width="drawerWidth"
|
||||
@close="onClose"
|
||||
:visible="visible">
|
||||
|
||||
<!-- 抽屉内容的border -->
|
||||
<div
|
||||
:style="{
|
||||
padding:'10px',
|
||||
border: '1px solid #e9e9e9',
|
||||
background: '#fff',
|
||||
}">
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="12">
|
||||
<a-col :md="8" :sm="8">
|
||||
<a-form-item label="规则名称" :labelCol="{span: 8}" :wrapperCol="{span: 14, offset: 1}">
|
||||
<a-input placeholder="请输入规则名称" v-model="queryParam.ruleName"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="8" :sm="8">
|
||||
<a-form-item label="规则值" :labelCol="{span: 8}" :wrapperCol="{span: 14, offset: 1}">
|
||||
<a-input placeholder="请输入规则值" v-model="queryParam.ruleValue"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="7" :sm="8">
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
|
||||
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
|
||||
</span>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row>
|
||||
<a-col :md="24" :sm="24">
|
||||
<a-button style="margin-bottom: 10px" @click="addPermissionRule" type="primary" icon="plus">添加</a-button>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
|
||||
<a-table
|
||||
ref="table"
|
||||
rowKey="id"
|
||||
size="middle"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:loading="loading"
|
||||
:rowClassName="getRowClassname">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="handleEdit(record)">
|
||||
<a-icon type="edit"/>编辑
|
||||
</a>
|
||||
<a-divider type="vertical"/>
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
</a-table>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<permission-data-rule-modal @ok="modalFormOk" ref="modalForm"></permission-data-rule-modal>
|
||||
</a-drawer>
|
||||
</template>
|
||||
<script>
|
||||
import { getPermissionRuleList, queryPermissionRule } from '@/api/api'
|
||||
import { JeroListMixin } from '@/mixins/JeroListMixin'
|
||||
import PermissionDataRuleModal from './modules/PermissionDataRuleModal'
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: '规则名称',
|
||||
dataIndex: 'ruleName',
|
||||
key: 'ruleName'
|
||||
},
|
||||
{
|
||||
title: '规则字段',
|
||||
dataIndex: 'ruleColumn',
|
||||
key: 'ruleColumn'
|
||||
},
|
||||
{
|
||||
title: '规则值',
|
||||
dataIndex: 'ruleValue',
|
||||
key: 'ruleValue'
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
scopedSlots: { customRender: 'action' },
|
||||
align: 'center'
|
||||
}
|
||||
]
|
||||
export default {
|
||||
name: 'PermissionDataRuleList',
|
||||
mixins: [JeroListMixin],
|
||||
components: {
|
||||
PermissionDataRuleModal
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
queryParam: {},
|
||||
drawerWidth: 650,
|
||||
columns: columns,
|
||||
permId: '',
|
||||
visible: false,
|
||||
form: this.$form.createForm(this),
|
||||
loading: false,
|
||||
url: {
|
||||
list: '/sys/permission/getPermRuleListByPermId',
|
||||
delete: '/sys/permission/deletePermissionRule'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.resetScreenSize()
|
||||
},
|
||||
methods: {
|
||||
loadData () {
|
||||
// 20190908 scott for: 首次进入菜单列表的时候，不加载权限列表
|
||||
if (!this.permId) {
|
||||
return
|
||||
}
|
||||
const that = this
|
||||
this.dataSource = []
|
||||
const params = this.getQueryParams()// 查询条件
|
||||
getPermissionRuleList(params).then((res) => {
|
||||
if (res.success) {
|
||||
that.dataSource = res.result
|
||||
}
|
||||
})
|
||||
},
|
||||
edit (record) {
|
||||
if (record.id) {
|
||||
this.visible = true
|
||||
this.permId = record.id
|
||||
}
|
||||
this.queryParam = {}
|
||||
this.queryParam.permissionId = record.id
|
||||
this.visible = true
|
||||
this.loadData()
|
||||
this.resetScreenSize()
|
||||
},
|
||||
addPermissionRule () {
|
||||
this.$refs.modalForm.add(this.permId)
|
||||
this.$refs.modalForm.title = '新增'
|
||||
},
|
||||
searchQuery () {
|
||||
const params = this.getQueryParams()
|
||||
params.permissionId = this.permId
|
||||
queryPermissionRule(params).then((res) => {
|
||||
if (res.success) {
|
||||
this.dataSource = res.result
|
||||
}
|
||||
})
|
||||
},
|
||||
searchReset () {
|
||||
this.queryParam = {}
|
||||
this.queryParam.permissionId = this.permId
|
||||
this.loadData(1)
|
||||
},
|
||||
onClose () {
|
||||
this.visible = false
|
||||
},
|
||||
// 根据屏幕变化,设置抽屉尺寸
|
||||
resetScreenSize () {
|
||||
const screenWidth = document.body.clientWidth
|
||||
if (screenWidth < 500) {
|
||||
this.drawerWidth = screenWidth
|
||||
} else {
|
||||
this.drawerWidth = 650
|
||||
}
|
||||
},
|
||||
getRowClassname (record) {
|
||||
if ((record.status + '') !== '1') {
|
||||
return 'data-rule-invalid'
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.data-rule-invalid{
|
||||
background: #f4f4f4;
|
||||
color: #bababa;
|
||||
}
|
||||
</style>
|
||||
@@ -1,205 +0,0 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator">
|
||||
<a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-button
|
||||
@click="batchDel"
|
||||
v-if="selectedRowKeys.length > 0"
|
||||
ghost
|
||||
type="primary"
|
||||
icon="delete">批量删除
|
||||
</a-button>
|
||||
</div>
|
||||
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
|
||||
<div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
|
||||
<i class="anticon anticon-info-circle ant-alert-icon"></i>已选择 <a style="font-weight: 600">{{
|
||||
selectedRowKeys.length }}</a>项
|
||||
<a style="margin-left: 24px" @click="onClearSelected">清空</a>
|
||||
</div>
|
||||
|
||||
<a-table
|
||||
:columns="columns"
|
||||
:scroll="{x: 1500}"
|
||||
size="middle"
|
||||
:pagination="false"
|
||||
:dataSource="dataSource"
|
||||
:loading="loading"
|
||||
:expandedRowKeys="expandedRowKeys"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@expandedRowsChange="handleExpandedRowsChange">
|
||||
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="handleEdit(record)">编辑</a>
|
||||
|
||||
<a-divider type="vertical" />
|
||||
<a-dropdown>
|
||||
<a class="ant-dropdown-link">
|
||||
更多 <a-icon type="down" />
|
||||
</a>
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item>
|
||||
<a href="javascript:" @click="handleDetail(record)">详情</a>
|
||||
</a-menu-item>
|
||||
<a-menu-item>
|
||||
<a href="javascript:" @click="handleAddSub(record)">添加下级</a>
|
||||
</a-menu-item>
|
||||
<a-menu-item>
|
||||
<a href="javascript:" @click="handleDataRule(record)">数据规则</a>
|
||||
</a-menu-item>
|
||||
|
||||
<a-menu-item>
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</a-dropdown>
|
||||
</span>
|
||||
<!-- 字符串超长截取省略号显示 -->
|
||||
<template slot="text" slot-scope="text">
|
||||
<a-tooltip overlay-class-name="tooltip-style">
|
||||
<template slot="title">{{ text || text === 0 ? text : global.emptyLine }}</template>
|
||||
<div class="table-text">{{ text || text === 0 ? text : global.emptyLine }}</div>
|
||||
</a-tooltip>
|
||||
</template>
|
||||
</a-table>
|
||||
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
|
||||
<permission-modal ref="modalForm" @ok="modalFormOk"></permission-modal>
|
||||
<permission-data-rule-list ref="PermissionDataRuleList" @ok="modalFormOk"></permission-data-rule-list>
|
||||
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import PermissionModal from './modules/PermissionModal'
|
||||
import { getPermissionList } from '@/api/api'
|
||||
import { JeroListMixin } from '@/mixins/JeroListMixin'
|
||||
import PermissionDataRuleList from './PermissionDataRuleList'
|
||||
import JEllipsis from '@/components/jero/JEllipsis'
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: '菜单名称',
|
||||
dataIndex: 'name',
|
||||
key: 'name'
|
||||
}, {
|
||||
title: '菜单英文名称',
|
||||
dataIndex: 'englishName',
|
||||
key: 'englishName',
|
||||
scopedSlots: { customRender: 'text' }
|
||||
}, {
|
||||
title: '菜单类型',
|
||||
dataIndex: 'menuType',
|
||||
key: 'menuType',
|
||||
width: 90,
|
||||
customRender: function (text) {
|
||||
if ((text + '') === '0') {
|
||||
return '菜单'
|
||||
} else if ((text + '') === '1') {
|
||||
return '菜单'
|
||||
} else if ((text + '') === '2') {
|
||||
return '按钮/权限'
|
||||
} else {
|
||||
return text
|
||||
}
|
||||
},
|
||||
scopedSlots: { customRender: 'text' }
|
||||
}, /* {
|
||||
title: '权限编码',
|
||||
dataIndex: 'perms',
|
||||
key: 'permissionCode',
|
||||
}, */{
|
||||
title: 'icon',
|
||||
dataIndex: 'icon',
|
||||
key: 'icon',
|
||||
width: 120,
|
||||
scopedSlots: { customRender: 'text' }
|
||||
},
|
||||
{
|
||||
title: '组件',
|
||||
dataIndex: 'component',
|
||||
key: 'component',
|
||||
scopedSlots: { customRender: 'text' }
|
||||
},
|
||||
{
|
||||
title: '路径',
|
||||
dataIndex: 'url',
|
||||
key: 'url',
|
||||
scopedSlots: { customRender: 'text' }
|
||||
},
|
||||
{
|
||||
title: '排序',
|
||||
dataIndex: 'sortNo',
|
||||
key: 'sortNo',
|
||||
width: 60,
|
||||
scopedSlots: { customRender: 'text' }
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
fixed: 'right',
|
||||
scopedSlots: { customRender: 'action' },
|
||||
align: 'center',
|
||||
width: 150
|
||||
}
|
||||
]
|
||||
|
||||
export default {
|
||||
name: 'PermissionList',
|
||||
mixins: [JeroListMixin],
|
||||
components: {
|
||||
PermissionDataRuleList,
|
||||
PermissionModal,
|
||||
JEllipsis
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
description: '这是菜单管理页面',
|
||||
// 表头
|
||||
columns: columns,
|
||||
loading: false,
|
||||
// 展开的行，受控属性
|
||||
expandedRowKeys: [],
|
||||
url: {
|
||||
list: '/sys/permission/page',
|
||||
delete: '/sys/permission/delete',
|
||||
deleteBatch: '/sys/permission/deleteBatch'
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
loadData () {
|
||||
this.dataSource = []
|
||||
getPermissionList().then((res) => {
|
||||
if (res.success) {
|
||||
console.log(res.result)
|
||||
this.dataSource = res.result
|
||||
}
|
||||
})
|
||||
},
|
||||
// 打开数据规则编辑
|
||||
handleDataRule (record) {
|
||||
this.$refs.PermissionDataRuleList.edit(record)
|
||||
},
|
||||
handleAddSub (record) {
|
||||
this.$refs.modalForm.title = '添加子菜单'
|
||||
this.$refs.modalForm.disableSubmit = false
|
||||
this.$refs.modalForm.edit({ status: '1', permsType: '1', route: true, parentId: record.id, menuType: 1 })
|
||||
},
|
||||
handleExpandedRowsChange (expandedRows) {
|
||||
this.expandedRowKeys = expandedRows
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less';
|
||||
</style>
|
||||
@@ -1,527 +0,0 @@
|
||||
<template>
|
||||
<a-row :gutter="10" style="width: 100%">
|
||||
<a-col :md="leftColMd" :sm="24" style="margin-bottom: 20px">
|
||||
<a-card :bordered="false">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<!-- 搜索区域 -->
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
<a-col :md="this.selectedRowKeys1.length === 0 ? 6: 12" :sm="12">
|
||||
<a-form-item :label="$t('roleManage.roleName')" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<j-input :placeholder="$t('pleaseEnter') + $t('roleManage.roleName')" v-model="queryParam.roleName"></j-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<!--
|
||||
<a-col :md="11" :sm="12">
|
||||
<a-form-item label="创建时间" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
|
||||
<j-date v-model="queryParam.createTime_begin" :showTime="true" date-format="YYYY-MM-DD HH:mm:ss" style="width:45%" placeholder="请选择开始时间" ></j-date>
|
||||
<span style="width: 10px;">~</span>
|
||||
<j-date v-model="queryParam.createTime_end" :showTime="true" date-format="YYYY-MM-DD HH:mm:ss" style="width:45%" placeholder="请选择结束时间"></j-date>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
-->
|
||||
<div style="float: right;overflow: hidden;margin-right: 11px" class="table-page-search-submitButtons">
|
||||
<a-button type="primary" @click="searchQuery" icon="search" style="margin-left: 21px">{{ $t('query') }}</a-button>
|
||||
<a-button type="primary" @click="searchReset" icon="reload" ghost style="margin-left: 8px">{{ $t('reset') }}</a-button>
|
||||
</div>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator" style="margin: 5px 0 10px 2px">
|
||||
<a-button @click="handleAdd" type="primary" icon="plus">{{ $t('roleManage.newRole') }}</a-button>
|
||||
<!--<a-button @click="handleEdit(model1)" type="primary" icon="plus">角色编辑</a-button>-->
|
||||
<!-- <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">-->
|
||||
<!-- <a-button type="primary" icon="import">导入</a-button>-->
|
||||
<!-- </a-upload>-->
|
||||
<!-- <a-button type="primary" icon="download" @click="handleExportXls('角色管理')">导出</a-button>-->
|
||||
</div>
|
||||
|
||||
<div style="margin-top: 15px">
|
||||
<a-table
|
||||
:components="drag(columns,'columns')"
|
||||
ref="table"
|
||||
style="max-height: 500px"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:scroll="{x: '100%', y: yScrollHeight}"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys1, onChange: onSelectChange1, type:'radio'}"
|
||||
@change="handleTableChange">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="handleOpen(record)">{{ $t('roleManage.userBtn') }}</a>
|
||||
<a-divider type="vertical" />
|
||||
|
||||
<a-dropdown>
|
||||
<a class="ant-dropdown-link">
|
||||
<a-icon type="more" class="operate-icon-btn operate-icon-more" />
|
||||
</a>
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item>
|
||||
<a @click="handlePerssion(record.id)">{{ $t('roleManage.toGrantAuthorization') }}</a>
|
||||
</a-menu-item>
|
||||
<a-menu-item>
|
||||
<a @click="handleEdit(record)">{{ $t('edit') }}</a>
|
||||
</a-menu-item>
|
||||
<a-menu-item>
|
||||
<a-popconfirm :title="$t('areYouSure')" @confirm="() => handleDelete1(record.id)">
|
||||
<a>{{ $t('delete') }}</a>
|
||||
</a-popconfirm>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</a-dropdown>
|
||||
</span>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- 右侧的角色权限配置 -->
|
||||
<user-role-modal ref="modalUserRole"></user-role-modal>
|
||||
<role-modal ref="modalForm" @ok="modalFormOk"></role-modal>
|
||||
</a-card>
|
||||
</a-col>
|
||||
<a-col :md="rightColMd" :sm="24" v-if="this.rightcolval === 1">
|
||||
<a-card :bordered="false">
|
||||
<div style="text-align: right;margin-bottom: 6px">
|
||||
<a-icon type="close-circle" @click="hideUserList" />
|
||||
</div>
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form layout="inline">
|
||||
<a-row :gutter="24">
|
||||
|
||||
<a-col :md="12" :sm="12">
|
||||
<a-form-item :label="$t('user.userAccount')">
|
||||
<a-input :placeholder="$t('pleaseEnter') + $t('user.userAccount')" v-model="queryParam2.username"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<div style="float: right;overflow: hidden;margin-right: 11px" class="table-page-search-submitButtons">
|
||||
<a-button type="primary" @click="searchQuery2" icon="search" style="margin-left: 21px">{{ $t('query') }}</a-button>
|
||||
<a-button type="primary" @click="searchReset2" icon="reload" style="margin-left: 8px">{{ $t('reset') }}</a-button>
|
||||
</div>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator">
|
||||
<!--<a-button @click="handleAdd2" type="primary" icon="plus" style="margin-top: 16px">{{ $t('roleManage.newUser') }}</a-button>-->
|
||||
<!--<a-button @click="handleEdit2" type="primary" icon="edit" style="margin-top: 16px">用户编辑</a-button>-->
|
||||
<a-button @click="handleAddUserRole" type="primary" icon="plus" style="margin-top: 16px">{{
|
||||
$t('roleManage.existingUsers')
|
||||
}}
|
||||
</a-button>
|
||||
|
||||
<a-dropdown v-if="selectedRowKeys2.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel2">
|
||||
<a-icon type="delete" />
|
||||
{{ $t('delete') }}
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px"> {{ $t('batchOperation') }}
|
||||
<a-icon type="down" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<a-table
|
||||
:components="drag(columns2,'columns2')"
|
||||
ref="table2"
|
||||
bordered
|
||||
style="max-height: 500px"
|
||||
size="middle"
|
||||
rowKey="id"
|
||||
:columns="columns2"
|
||||
:dataSource="dataSource2"
|
||||
:pagination="ipagination2"
|
||||
:loading="loading2"
|
||||
:scroll="{x: '100%', y: yScrollHeight}"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys2, onChange: onSelectChange2}"
|
||||
@change="handleTableChange2">
|
||||
<template slot="action" slot-scope="text, record">
|
||||
<a-popconfirm :title="$t('areYouSure')" @confirm="() => handleDelete2(record.id)">
|
||||
<a>{{ $t('delete') }}</a>
|
||||
</a-popconfirm>
|
||||
</template>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- 表单区域 -->
|
||||
<role-modal ref="modalForm" @ok="modalFormOk"></role-modal>
|
||||
<user-modal ref="modalForm2" @ok="modalFormOk2"></user-modal>
|
||||
<Select-User-Modal ref="selectUserModal" @selectFinished="selectOK"></Select-User-Modal>
|
||||
</a-card>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</template>
|
||||
<script>
|
||||
import '@assets/less/common.less'
|
||||
import { JeroListMixin } from '@/mixins/JeroListMixin'
|
||||
import { postAction, getAction } from '@/api/manage'
|
||||
import SelectUserModal from './modules/SelectUserModal'
|
||||
import RoleModal from './modules/RoleModal'
|
||||
import UserModal from './modules/UserModal'
|
||||
import { filterObj } from '@/utils/util'
|
||||
import UserRoleModal from './modules/UserRoleModal'
|
||||
import moment from 'moment'
|
||||
import { ResizeHeader, ResizeColumnProvide } from '@/mixins/header'
|
||||
|
||||
export default {
|
||||
name: 'RoleUserList',
|
||||
mixins: [JeroListMixin, ResizeHeader, ResizeColumnProvide],
|
||||
components: {
|
||||
UserRoleModal,
|
||||
SelectUserModal,
|
||||
RoleModal,
|
||||
UserModal
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
model1: {},
|
||||
model2: {},
|
||||
currentRoleId: '',
|
||||
queryParam1: {},
|
||||
queryParam2: {},
|
||||
dataSource1: [],
|
||||
dataSource2: [],
|
||||
ipagination1: {
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
pageSizeOptions: ['10', '30', '50', '100', '150', '200'],
|
||||
showTotal: (total, range) => {
|
||||
return range[0] + '-' + range[1] + ' ' + this.$t('total') + total + this.$t('strip')
|
||||
},
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
total: 0
|
||||
},
|
||||
ipagination2: {
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
pageSizeOptions: ['10', '30', '50', '100', '150', '200'],
|
||||
showTotal: (total, range) => {
|
||||
return range[0] + '-' + range[1] + ' ' + this.$t('total') + total + this.$t('strip')
|
||||
},
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
total: 0
|
||||
},
|
||||
isorter1: {
|
||||
column: 'createTime',
|
||||
order: 'desc'
|
||||
},
|
||||
isorter2: {
|
||||
column: 'createTime',
|
||||
order: 'desc'
|
||||
},
|
||||
filters1: {},
|
||||
filters2: {},
|
||||
loading1: false,
|
||||
loading2: false,
|
||||
selectedRowKeys1: [],
|
||||
selectedRowKeys2: [],
|
||||
selectionRows1: [],
|
||||
selectionRows2: [],
|
||||
test: {},
|
||||
rightcolval: 0,
|
||||
columns:
|
||||
[
|
||||
{
|
||||
title: this.$t('roleManage.roleCode'),
|
||||
align: 'center',
|
||||
dataIndex: 'roleCode'
|
||||
},
|
||||
{
|
||||
title: this.$t('roleManage.roleName'),
|
||||
align: 'center',
|
||||
dataIndex: 'roleName'
|
||||
},
|
||||
{
|
||||
title: this.$t('createTime'),
|
||||
dataIndex: 'createTime',
|
||||
align: 'center',
|
||||
sorter: true,
|
||||
customRender: (text) => {
|
||||
return moment(text).format('YYYY-MM-DD')
|
||||
}
|
||||
},
|
||||
{
|
||||
title: this.$t('operation'),
|
||||
dataIndex: 'action',
|
||||
align: 'center',
|
||||
scopedSlots: { customRender: 'action' }
|
||||
}
|
||||
],
|
||||
columns2: [{
|
||||
title: this.$t('user.userAccount'),
|
||||
align: 'center',
|
||||
dataIndex: 'username',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
title: this.$t('user.userName'),
|
||||
align: 'center',
|
||||
width: 100,
|
||||
dataIndex: 'realname'
|
||||
},
|
||||
{
|
||||
title: this.$t('status'),
|
||||
align: 'center',
|
||||
width: 80,
|
||||
dataIndex: 'status_dictText'
|
||||
},
|
||||
|
||||
{
|
||||
title: this.$t('operation'),
|
||||
dataIndex: 'action',
|
||||
scopedSlots: { customRender: 'action' },
|
||||
align: 'center',
|
||||
width: 120
|
||||
}],
|
||||
|
||||
// 高级查询参数
|
||||
superQueryParams2: '',
|
||||
// 高级查询拼接条件
|
||||
superQueryMatchType2: 'and',
|
||||
url: {
|
||||
list: '/sys/role/page',
|
||||
delete: '/sys/role/delete',
|
||||
list2: '/sys/user/userRoleList',
|
||||
addUserRole: '/sys/user/addSysUserRole',
|
||||
delete2: '/sys/user/deleteUserRole',
|
||||
deleteBatch2: '/sys/user/deleteUserRoleBatch',
|
||||
exportXlsUrl: 'sys/role/exportXls',
|
||||
importExcelUrl: 'sys/role/importExcel'
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
importExcelUrl: function () {
|
||||
return `${window._CONFIG.domianURL}/${this.url.importExcelUrl}`
|
||||
},
|
||||
leftColMd () {
|
||||
return this.selectedRowKeys1.length === 0 ? 24 : 12
|
||||
},
|
||||
rightColMd () {
|
||||
return this.selectedRowKeys1.length === 0 ? 0 : 12
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onSelectChange2 (selectedRowKeys, selectionRows) {
|
||||
this.selectedRowKeys2 = selectedRowKeys
|
||||
this.selectionRows2 = selectionRows
|
||||
},
|
||||
onClearSelected2 () {
|
||||
this.selectedRowKeys2 = []
|
||||
this.selectionRows2 = []
|
||||
},
|
||||
onClearSelected1 () {
|
||||
this.selectedRowKeys1 = []
|
||||
this.selectionRows1 = []
|
||||
},
|
||||
onSelectChange1 (selectedRowKeys, selectionRows) {
|
||||
this.rightcolval = 1
|
||||
this.selectedRowKeys1 = selectedRowKeys
|
||||
this.selectionRows1 = selectionRows
|
||||
this.model1 = Object.assign({}, selectionRows[0])
|
||||
console.log(this.model1)
|
||||
this.currentRoleId = selectedRowKeys[0]
|
||||
this.loadData2()
|
||||
},
|
||||
onClearSelected () {
|
||||
},
|
||||
|
||||
getQueryParams2 () {
|
||||
// 获取查询条件
|
||||
const sqp = {}
|
||||
if (this.superQueryParams2) {
|
||||
sqp.superQueryParams = encodeURI(this.superQueryParams2)
|
||||
sqp.superQueryMatchType = this.superQueryMatchType2
|
||||
}
|
||||
const param = Object.assign(sqp, this.queryParam2, this.isorter2, this.filters2)
|
||||
param.field = this.getQueryField2()
|
||||
param.pageNo = this.ipagination2.current
|
||||
param.pageSize = this.ipagination2.pageSize
|
||||
return filterObj(param)
|
||||
},
|
||||
getQueryField2 () {
|
||||
// TODO 字段权限控制
|
||||
let str = 'id,'
|
||||
this.columns2.forEach(function (value) {
|
||||
str += ',' + value.dataIndex
|
||||
})
|
||||
return str
|
||||
},
|
||||
handleEdit2: function (record) {
|
||||
this.$refs.modalForm2.title = this.$t('edit')
|
||||
this.$refs.modalForm2.roleDisabled = true
|
||||
this.$refs.modalForm2.edit(record)
|
||||
},
|
||||
handleAdd2: function () {
|
||||
if (!this.currentRoleId) {
|
||||
this.$message.warning(this.$t('roleManage.pleaseSelectARole'))
|
||||
} else {
|
||||
this.$refs.modalForm2.roleDisabled = true
|
||||
this.$refs.modalForm2.title = this.$t('newlyAdded')
|
||||
this.$refs.modalForm2.edit({ activitiSync: '1', userIdentity: 1, selectedroles: this.currentRoleId })
|
||||
}
|
||||
},
|
||||
modalFormOk2 () {
|
||||
// 新增/修改 成功时，重载列表
|
||||
this.loadData2()
|
||||
},
|
||||
loadData2 (arg) {
|
||||
if (!this.url.list2) {
|
||||
this.$message.warning('请设置url.list2属性!')
|
||||
return
|
||||
}
|
||||
// 加载数据 若传入参数1则加载第一页的内容
|
||||
if (arg === 1) {
|
||||
this.ipagination2.current = 1
|
||||
}
|
||||
if (this.currentRoleId === '') return
|
||||
const params = this.getQueryParams2()// 查询条件
|
||||
params.roleId = this.currentRoleId
|
||||
this.loading2 = true
|
||||
getAction(this.url.list2, params).then((res) => {
|
||||
if (res.success) {
|
||||
this.dataSource2 = res.result.records
|
||||
this.ipagination2.total = res.result.total
|
||||
}
|
||||
this.loading2 = false
|
||||
})
|
||||
},
|
||||
handleDelete1: function (id) {
|
||||
this.handleDelete(id)
|
||||
this.dataSource2 = []
|
||||
this.currentRoleId = ''
|
||||
},
|
||||
handleDelete2: function (id) {
|
||||
if (!this.url.delete2) {
|
||||
this.$message.warning('请设置url.delete2属性!')
|
||||
return
|
||||
}
|
||||
const that = this
|
||||
postAction(that.url.delete2, { roleId: this.currentRoleId, userId: id }).then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message)
|
||||
that.loadData2()
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
batchDel2: function () {
|
||||
if (!this.url.deleteBatch2) {
|
||||
this.$message.warning('请设置url.deleteBatch2属性!')
|
||||
return
|
||||
}
|
||||
if (this.selectedRowKeys2.length <= 0) {
|
||||
this.$message.warning(this.$t('selectARecord'))
|
||||
} else {
|
||||
let ids = ''
|
||||
for (let a = 0; a < this.selectedRowKeys2.length; a++) {
|
||||
ids += this.selectedRowKeys2[a] + ','
|
||||
}
|
||||
const that = this
|
||||
console.log(this.currentDeptId)
|
||||
this.$confirm({
|
||||
title: this.$t('confirmDeletion'),
|
||||
content: this.$t('deleteAData'),
|
||||
onOk: function () {
|
||||
postAction(that.url.deleteBatch2, { roleId: that.currentRoleId, userIds: ids }).then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message)
|
||||
that.loadData2()
|
||||
that.onClearSelected()
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
selectOK (data) {
|
||||
const params = {}
|
||||
params.roleId = this.currentRoleId
|
||||
params.userIdList = []
|
||||
for (let a = 0; a < data.length; a++) {
|
||||
params.userIdList.push(data[a])
|
||||
}
|
||||
console.log(params)
|
||||
postAction(this.url.addUserRole, params).then((res) => {
|
||||
if (res.success) {
|
||||
this.loadData2()
|
||||
this.$message.success(res.message)
|
||||
} else {
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
handleAddUserRole () {
|
||||
if (!this.currentRoleId) {
|
||||
this.$message.warning(this.$t('roleManage.pleaseSelectARole'))
|
||||
} else {
|
||||
this.$refs.selectUserModal.visible = true
|
||||
this.$refs.selectUserModal.searchQuery()
|
||||
}
|
||||
},
|
||||
handleOpen (record) {
|
||||
this.rightcolval = 1
|
||||
this.selectedRowKeys1 = [record.id]
|
||||
this.model1 = Object.assign({}, record)
|
||||
this.currentRoleId = record.id
|
||||
this.onClearSelected2()
|
||||
this.loadData2()
|
||||
},
|
||||
/* handleEdit: function(record) {
|
||||
if (this.currentRoleId == '') {
|
||||
this.$message.warning('请选择一个角色!')
|
||||
} else {
|
||||
this.$refs.modalForm.edit(record)
|
||||
this.$refs.modalForm.title = '编辑'
|
||||
}
|
||||
}, */
|
||||
searchQuery2 () {
|
||||
this.loadData2(1)
|
||||
},
|
||||
searchReset2 () {
|
||||
this.queryParam2 = {}
|
||||
this.loadData2(1)
|
||||
},
|
||||
handleTableChange2 (pagination, filters, sorter) {
|
||||
// 分页、排序、筛选变化时触发
|
||||
// TODO 筛选
|
||||
if (Object.keys(sorter).length > 0) {
|
||||
this.isorter2.column = sorter.field
|
||||
this.isorter2.order = sorter.order === 'ascend' ? 'asc' : 'desc'
|
||||
}
|
||||
this.ipagination2 = pagination
|
||||
this.loadData2()
|
||||
},
|
||||
hideUserList () {
|
||||
// this.rightcolval = 0
|
||||
this.selectedRowKeys1 = []
|
||||
},
|
||||
handlePerssion (roleId) {
|
||||
this.$refs.modalUserRole.show(roleId)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
@import '~@assets/less/common.less';
|
||||
/** Button按钮间距 */
|
||||
.ant-btn {
|
||||
margin-left: 8px
|
||||
}
|
||||
|
||||
/deep/ .table-page-search-wrapper .ant-form-inline .ant-form-item > .ant-form-item-label {
|
||||
min-width: 60px;
|
||||
}
|
||||
</style>
|
||||
@@ -1,459 +0,0 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
|
||||
<a-col :md="6" :sm="12">
|
||||
<a-form-item :label="$t('user.userAccount')">
|
||||
<j-input :placeholder="$t('pleaseEnter') + $t('user.userAccount')" v-model="queryParam.username"></j-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :md="6" :sm="12">
|
||||
<a-form-item :label="$t('user.gender')">
|
||||
<a-select v-model="queryParam.sex" :placeholder="$t('pleaseSelect') + $t('user.gender')">
|
||||
<a-select-option value="">{{ $t('pleaseSelect') }}</a-select-option>
|
||||
<a-select-option value="1">{{ $t('user.male') }}</a-select-option>
|
||||
<a-select-option value="2">{{ $t('user.female') }}</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :md="6" :sm="12">
|
||||
<a-form-item :label="$t('user.userName')">
|
||||
<j-input :placeholder="$t('pleaseEnter') + $t('user.userName')" v-model="queryParam.realname"></j-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<template v-if="toggleSearchStatus">
|
||||
<a-col :md="6" :sm="12">
|
||||
<a-form-item :label="$t('phoneNumber')">
|
||||
<a-input :placeholder="$t('pleaseEnter') + $t('phoneNumber')" v-model="queryParam.phone"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="12">
|
||||
<a-form-item :label="$t('status')">
|
||||
<a-select v-model="queryParam.status" :placeholder="$t('pleaseSelect') + $t('status')">
|
||||
<a-select-option value="">{{ $t('pleaseSelect') }}</a-select-option>
|
||||
<a-select-option value="1">{{ $t('normal') }}</a-select-option>
|
||||
<a-select-option value="2">{{ $t('user.frozen') }}</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :md="6" :sm="12">
|
||||
<a-form-item :label="$t('organization')">
|
||||
<a-tree-select
|
||||
tree-node-filter-prop="title"
|
||||
v-model="queryParam.departId"
|
||||
:maxTagCount="1"
|
||||
:show-search="true"
|
||||
:getPopupContainer="triggerNode=> triggerNode.parentNode"
|
||||
class="box-input"
|
||||
style="width: 100%"
|
||||
:tree-data="categoryTreeList"
|
||||
:placeholder="$t('pleaseSelect') + $t('organization')"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :md="6" :sm="12">
|
||||
<a-form-item :label="$t('role')">
|
||||
<j-search-select-tag
|
||||
:placeholder="$t('pleaseSelect') + $t('role')"
|
||||
v-model="queryParam.roleId"
|
||||
:dictOptions="rolesList">
|
||||
</j-search-select-tag>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</template>
|
||||
|
||||
<div style="float: right;overflow: hidden;margin-right: 11px" class="table-page-search-submitButtons">
|
||||
<a @click="handleToggleSearch" style="margin-left: 8px">
|
||||
{{ toggleSearchStatus ? $t('putAway') : $t('open') }}
|
||||
<a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
|
||||
</a>
|
||||
<a-button type="primary" @click="searchQuery" icon="search">{{ $t('query') }}</a-button>
|
||||
<a-button type="primary" @click="searchReset" icon="reload" ghost style="margin-left: 8px">{{ $t('reset') }}</a-button>
|
||||
</div>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator" style="border-top: 5px">
|
||||
<a-button v-if="isDev" @click="handleAdd" type="primary" icon="plus" >{{ $t('user.addUser') }}</a-button>
|
||||
<a-button type="primary" ghost icon="download" @click="handleExportXls($t('user.userInformation'), '.xls')">{{ $t('export') }}</a-button>
|
||||
<a-button v-if="isDev" type="primary" ghost icon="hdd" @click="recycleBinVisible=true">{{ $t('recycleBin') }}</a-button>
|
||||
<a-button v-if="isDev" type="primary" ghost icon="hdd" @click="roleAssignment">{{ $t('user.roleAllocation') }}</a-button>
|
||||
<a-dropdown v-if="isDev && selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay" @click="handleMenuClick">
|
||||
<a-menu-item key="1">
|
||||
<a-icon type="delete" @click="batchDel"/>
|
||||
{{ $t('delete') }}
|
||||
</a-menu-item>
|
||||
<a-menu-item key="2">
|
||||
<a-icon type="lock" @click="batchFrozen('2')"/>
|
||||
{{ $t('user.frozen') }}
|
||||
</a-menu-item>
|
||||
<a-menu-item key="3">
|
||||
<a-icon type="unlock" @click="batchFrozen('1')"/>
|
||||
{{ $t('user.thaw') }}
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px">
|
||||
{{ $t('batchOperation') }}
|
||||
<a-icon type="down"/>
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
<!--<j-super-query :fieldList="superQueryFieldList" @handleSuperQuery="handleSuperQuery"/>-->
|
||||
</div>
|
||||
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<j-table
|
||||
:can-drag="true"
|
||||
:scroll="{x: '100%', y: yScrollHeight}"
|
||||
ref="table"
|
||||
size="middle"
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
|
||||
<template v-slot:avatarslot="{text, record}">
|
||||
<div class="anty-img-wrap">
|
||||
<a-avatar shape="square" :src="getAvatarView(record.avatar)" icon="user"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-slot:action="{text, record}" v-if="isDev">
|
||||
<a @click="handleEdit(record)" >{{ $t('edit') }}</a>
|
||||
|
||||
<a-divider type="vertical" />
|
||||
|
||||
<a-dropdown>
|
||||
<a class="ant-dropdown-link">
|
||||
<a-icon type="more" class="operate-icon-btn operate-icon-more" />
|
||||
</a>
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item>
|
||||
<a href="javascript:" @click="handleDetail(record)">{{ $t('details') }}</a>
|
||||
</a-menu-item>
|
||||
|
||||
<a-menu-item>
|
||||
<a href="javascript:" @click="handleChangePassword(record.username)">{{ $t('user.password') }}</a>
|
||||
</a-menu-item>
|
||||
|
||||
<a-menu-item>
|
||||
<a-popconfirm :title="$t('areYouSure')" @confirm="() => handleDelete(record.id)">
|
||||
<a>{{ $t('delete') }}</a>
|
||||
</a-popconfirm>
|
||||
</a-menu-item>
|
||||
|
||||
<a-menu-item v-if="(record.status + '')==='1'">
|
||||
<a-popconfirm :title="$t('user.freezePassword')" @confirm="() => handleFrozen(record.id,2,record.username)">
|
||||
<a>{{ $t('user.frozen') }}</a>
|
||||
</a-popconfirm>
|
||||
</a-menu-item>
|
||||
|
||||
<a-menu-item v-if="(record.status + '')==='2'">
|
||||
<a-popconfirm :title="$t('user.youThaw')" @confirm="() => handleFrozen(record.id,1,record.username)">
|
||||
<a>{{ $t('user.thaw') }}</a>
|
||||
</a-popconfirm>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</a-dropdown>
|
||||
</template>
|
||||
<template v-slot:action="{text, record}" v-else>
|
||||
<a href="javascript:" @click="handleDetail(record)">{{ $t('details') }}</a>
|
||||
</template>
|
||||
</j-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
|
||||
<user-modal ref="modalForm" @ok="modalFormOk"></user-modal>
|
||||
|
||||
<password-modal ref="passwordmodal" @ok="passwordModalOk"></password-modal>
|
||||
|
||||
<!-- 用户回收站 -->
|
||||
<user-recycle-bin-modal :visible.sync="recycleBinVisible" @ok="modalFormOk"/>
|
||||
<!-- 角色配置 -->
|
||||
<!-- <j-modal title="角色配置" :width='650'>-->
|
||||
<role-assignment ref="roleAssignmentModal" :selectedRowKeysArray='selectedRowKeys' @ok="modalFormOk" @rolevisible='rolevisibleMethods'></role-assignment>
|
||||
<!-- </j-modal>-->
|
||||
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import '@assets/less/common.less'
|
||||
import RoleAssignment from './modules/RoleAssignment'
|
||||
import UserModal from './modules/UserModal'
|
||||
import PasswordModal from './modules/PasswordModal'
|
||||
import { getAction, getFileAccessHttpUrl } from '@/api/manage'
|
||||
import { frozenBatch, queryall } from '@/api/api'
|
||||
import { JeroListMixin } from '@/mixins/JeroListMixin'
|
||||
import JInput from '@/components/jero/JInput'
|
||||
import UserRecycleBinModal from './modules/UserRecycleBinModal'
|
||||
import JTable from '@/components/jero/JTable'
|
||||
import JSearchSelectTag from '@/components/dict/JSearchSelectTag'
|
||||
|
||||
export default {
|
||||
name: 'UserList',
|
||||
mixins: [JeroListMixin],
|
||||
components: {
|
||||
RoleAssignment,
|
||||
UserModal,
|
||||
PasswordModal,
|
||||
JInput,
|
||||
UserRecycleBinModal,
|
||||
JTable,
|
||||
JSearchSelectTag
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 是否开发环境(线上需隐藏按钮)
|
||||
isDev: process.env.VUE_APP_TAG_FLAG === '0',
|
||||
description: this.$t('user.freezePasManagementPage'),
|
||||
queryParam: {},
|
||||
recycleBinVisible: false,
|
||||
selectedRowKeys: [],
|
||||
categoryTreeList: [], // 组织机构查询的组织机构树数据
|
||||
rolesList: [], // 角色查询的角色数据
|
||||
columns: [
|
||||
{
|
||||
title: this.$t('serialNumber'),
|
||||
dataIndex: '',
|
||||
key: 'rowIndex',
|
||||
width: 60,
|
||||
align: 'center',
|
||||
customRender: function (t, r, index) {
|
||||
return parseInt(index) + 1
|
||||
}
|
||||
},
|
||||
// {
|
||||
// title: this.$t('user.heads'),
|
||||
// align: 'center',
|
||||
// width: 120,
|
||||
// dataIndex: 'avatar',
|
||||
// scopedSlots: { customRender: 'avatarslot' }
|
||||
// },
|
||||
{
|
||||
title: this.$t('user.userAccount'),
|
||||
align: 'center',
|
||||
dataIndex: 'username',
|
||||
width: 150,
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: this.$t('user.userName'),
|
||||
align: 'center',
|
||||
width: 100,
|
||||
dataIndex: 'realname'
|
||||
},
|
||||
{
|
||||
title: this.$t('user.post'),
|
||||
align: 'center',
|
||||
width: 100,
|
||||
dataIndex: 'post'
|
||||
},
|
||||
{
|
||||
title: this.$t('user.gender'),
|
||||
align: 'center',
|
||||
width: 90,
|
||||
dataIndex: 'sex_dictText',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: this.$t('phoneNumber'),
|
||||
align: 'center',
|
||||
width: 150,
|
||||
dataIndex: 'phone'
|
||||
},
|
||||
{
|
||||
title: this.$t('organization'),
|
||||
align: 'center',
|
||||
width: 180,
|
||||
dataIndex: 'orgCodeTxt'
|
||||
},
|
||||
{
|
||||
title: this.$t('role'),
|
||||
align: 'center',
|
||||
width: 180,
|
||||
dataIndex: 'roleTxt'
|
||||
},
|
||||
// {
|
||||
// title: '生日',
|
||||
// align: "center",
|
||||
// width: 100,
|
||||
// dataIndex: 'birthday'
|
||||
// },
|
||||
// {
|
||||
// title: '负责部门',
|
||||
// align: "center",
|
||||
// width: 180,
|
||||
// dataIndex: 'departIds_dictText'
|
||||
// },
|
||||
{
|
||||
title: this.$t('status'),
|
||||
align: 'center',
|
||||
width: 80,
|
||||
dataIndex: 'status_dictText'
|
||||
},
|
||||
{
|
||||
title: this.$t('operation'),
|
||||
scopedSlots: { customRender: 'action' },
|
||||
align: 'center',
|
||||
width: 170
|
||||
}
|
||||
],
|
||||
superQueryFieldList: [
|
||||
{ type: 'input', value: 'username', text: '用户账号' },
|
||||
{ type: 'input', value: 'realname', text: '用户姓名' },
|
||||
{ type: 'select', value: 'sex', dbType: 'int', text: '性别', dictCode: 'sex' }
|
||||
],
|
||||
url: {
|
||||
syncUser: '/act/process/extActProcess/doSyncUser',
|
||||
list: '/sys/user/page',
|
||||
delete: '/sys/user/delete',
|
||||
deleteBatch: '/sys/user/deleteBatch',
|
||||
exportXlsUrl: '/sys/user/exportXls',
|
||||
importExcelUrl: 'sys/user/importExcel',
|
||||
getSysCategoryTree: '/sys/sysDepart/queryTreeList' // 获取组织机构树
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
importExcelUrl: function () {
|
||||
return `${window._CONFIG.domianURL}/${this.url.importExcelUrl}`
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.getSysCategoryTree()
|
||||
this.initRoleList()
|
||||
},
|
||||
methods: {
|
||||
getAvatarView: function (avatar) {
|
||||
return getFileAccessHttpUrl(avatar)
|
||||
},
|
||||
|
||||
batchFrozen: function (status) {
|
||||
if (this.selectedRowKeys.length <= 0) {
|
||||
this.$message.warning(this.$t('pleaseSelect') + this.$t('aRcord'))
|
||||
return false
|
||||
} else {
|
||||
let ids = ''
|
||||
const that = this
|
||||
let isAdmin = false
|
||||
that.selectionRows.forEach(function (row) {
|
||||
if (row.username === 'admin') {
|
||||
isAdmin = true
|
||||
}
|
||||
})
|
||||
if (isAdmin) {
|
||||
that.$message.warning(this.$t('operationAllowedAccount'))
|
||||
return
|
||||
}
|
||||
that.selectedRowKeys.forEach(function (val) {
|
||||
ids += val + ','
|
||||
})
|
||||
that.$confirm({
|
||||
title: this.$t('confirm') + this.$t('operation'),
|
||||
content: this.$t('whether') + ((status + '') === '1' ? this.$t('user.thaw') : this.$t('user.frozen')) + this.$t('user.selectedAccount'),
|
||||
onOk: function () {
|
||||
frozenBatch({ ids: ids, status: status }).then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message)
|
||||
that.loadData()
|
||||
that.onClearSelected()
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
handleMenuClick (e) {
|
||||
if ((e.key + '') === '1') {
|
||||
this.batchDel()
|
||||
} else if ((e.key + '') === '2') {
|
||||
this.batchFrozen('2')
|
||||
} else if ((e.key + '') === '3') {
|
||||
this.batchFrozen('1')
|
||||
}
|
||||
},
|
||||
handleFrozen: function (id, status, username) {
|
||||
const that = this
|
||||
if (username === 'admin') {
|
||||
that.$message.warning(this.$t('adminDoNotAllowOperation'))
|
||||
return
|
||||
}
|
||||
frozenBatch({ ids: id, status: status }).then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message)
|
||||
that.loadData()
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
handleChangePassword (username) {
|
||||
if (process.env.VUE_APP_CURRENT_SYSTEM === 'IAM') {
|
||||
this.$message.warn('请前往IAM修改密码')
|
||||
return
|
||||
}
|
||||
this.$refs.passwordmodal.show(username)
|
||||
},
|
||||
passwordModalOk () {
|
||||
console.log('密码修改完成')
|
||||
},
|
||||
// 获取组织机构树
|
||||
getSysCategoryTree () {
|
||||
getAction(this.url.getSysCategoryTree, {}).then((res) => {
|
||||
if (res.success) {
|
||||
this.categoryTreeList = res.result
|
||||
} else {
|
||||
this.categoryTreeList = []
|
||||
}
|
||||
})
|
||||
},
|
||||
// 初始化角色字典
|
||||
initRoleList () {
|
||||
queryall().then((res) => {
|
||||
if (res.success) {
|
||||
this.rolesList = res.result.map((item) => {
|
||||
return { text: item.roleName, value: item.id }
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 角色配置
|
||||
roleAssignment () {
|
||||
if (this.selectedRowKeys.length === 0) {
|
||||
this.$message.warning(this.$t('selectLeastOne'))
|
||||
} else {
|
||||
this.$refs.roleAssignmentModal.show()
|
||||
}
|
||||
},
|
||||
rolevisibleMethods () {
|
||||
this.onClearSelected()
|
||||
this.selectedRowKeys = []
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
@import '~@assets/less/common.less';
|
||||
/deep/ .table-page-search-wrapper .ant-form-inline .ant-form-item > .ant-form-item-label {
|
||||
min-width: 80px;
|
||||
}
|
||||
</style>
|
||||
@@ -1,99 +0,0 @@
|
||||
<template>
|
||||
<a-card :loading="cardLoading" :bordered="false" style="height: 100%;">
|
||||
<a-spin :spinning="loading">
|
||||
<a-input-search @search="handleSearch" style="width:100%;margin-top: 10px" placeholder="输入机构名称查询..." enterButton />
|
||||
|
||||
<a-tree
|
||||
showLine
|
||||
checkStrictly
|
||||
:expandedKeys.sync="expandedKeys"
|
||||
:selectedKeys="selectedKeys"
|
||||
:dropdownStyle="{maxHeight:'200px',overflow:'auto'}"
|
||||
:treeData="treeDataSource"
|
||||
@select="handleTreeSelect"
|
||||
/>
|
||||
</a-spin>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { queryDepartTreeList, searchByKeywords } from '@/api/api'
|
||||
|
||||
export default {
|
||||
name: 'AddressListLeft',
|
||||
props: ['value'],
|
||||
data () {
|
||||
return {
|
||||
cardLoading: true,
|
||||
loading: false,
|
||||
treeDataSource: [],
|
||||
selectedKeys: [],
|
||||
expandedKeys: []
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.queryTreeData()
|
||||
},
|
||||
methods: {
|
||||
|
||||
queryTreeData (keyword) {
|
||||
this.commonRequestThen(queryDepartTreeList({
|
||||
departName: keyword || undefined
|
||||
}))
|
||||
},
|
||||
|
||||
handleSearch (value) {
|
||||
if (value) {
|
||||
this.commonRequestThen(searchByKeywords({ keyWord: value }))
|
||||
} else {
|
||||
this.queryTreeData()
|
||||
}
|
||||
},
|
||||
|
||||
handleTreeSelect (selectedKeys, event) {
|
||||
if (selectedKeys.length > 0 && this.selectedKeys[0] !== selectedKeys[0]) {
|
||||
this.selectedKeys = [selectedKeys[0]]
|
||||
const orgCode = event.node.dataRef.orgCode
|
||||
this.emitInput(orgCode)
|
||||
}
|
||||
},
|
||||
|
||||
emitInput (orgCode) {
|
||||
this.$emit('input', orgCode)
|
||||
},
|
||||
|
||||
commonRequestThen (promise) {
|
||||
this.loading = true
|
||||
promise.then(res => {
|
||||
if (res.success) {
|
||||
this.treeDataSource = res.result
|
||||
// update-begin- --- author:wangshuai ------ date:20200102 ---- for:去除默认选中第一条数据、默认展开所有第一级
|
||||
// 默认选中第一条数据、默认展开所有第一级
|
||||
// if (res.result.length > 0) {
|
||||
// this.expandedKeys = []
|
||||
// res.result.forEach((item, index) => {
|
||||
// if (index === 0) {
|
||||
// this.selectedKeys = [item.id]
|
||||
// this.emitInput(item.orgCode)
|
||||
// }
|
||||
// this.expandedKeys.push(item.id)
|
||||
// })
|
||||
// }
|
||||
// update-end- --- author:wangshuai ------ date:20200102 ---- for:去除默认选中第一条数据、默认展开所有第一级
|
||||
} else {
|
||||
this.$message.warn(res.message)
|
||||
console.error('组织机构查询失败:', res)
|
||||
}
|
||||
}).finally(() => {
|
||||
this.loading = false
|
||||
this.cardLoading = false
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -1,210 +0,0 @@
|
||||
<template>
|
||||
<a-card class="j-address-list-right-card-box" :loading="cardLoading" :bordered="false">
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form-model layout="inline" :model="queryParam">
|
||||
<a-row :gutter="10">
|
||||
|
||||
<a-col :md="6" :sm="12">
|
||||
<a-form-model-item label="姓名" prop="realname" style="margin-left:8px">
|
||||
<a-input placeholder="请输入姓名查询" v-model="queryParam.realname"></a-input>
|
||||
</a-form-model-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :md="6" :sm="12">
|
||||
<a-form-model-item label="工号" prop="username" style="margin-left:8px">
|
||||
<a-input placeholder="请输入工号查询" v-model="queryParam.username"></a-input>
|
||||
</a-form-model-item>
|
||||
</a-col>
|
||||
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-col :md="6" :sm="24">
|
||||
<a-button type="primary" @click="searchQuery" icon="search" style="margin-left: 18px">查询</a-button>
|
||||
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-row>
|
||||
</a-form-model>
|
||||
</div>
|
||||
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="userId"
|
||||
:pagination="ipagination"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:loading="loading"
|
||||
@change="handleTableChange">
|
||||
</a-table>
|
||||
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getAction } from '@/api/manage'
|
||||
import { JeroListMixin } from '@/mixins/JeroListMixin'
|
||||
|
||||
export default {
|
||||
name: 'AddressListRight',
|
||||
mixins: [JeroListMixin],
|
||||
components: {},
|
||||
props: ['value'],
|
||||
data () {
|
||||
return {
|
||||
description: '用户信息',
|
||||
cardLoading: true,
|
||||
positionInfo: {},
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
key: 'rowIndex',
|
||||
dataIndex: '',
|
||||
width: 60,
|
||||
align: 'center',
|
||||
customRender: (t, r, i) => parseInt(i) + 1
|
||||
},
|
||||
{
|
||||
title: '姓名',
|
||||
width: '15%',
|
||||
align: 'center',
|
||||
dataIndex: 'realname'
|
||||
},
|
||||
{
|
||||
title: '工号',
|
||||
width: '15%',
|
||||
align: 'center',
|
||||
dataIndex: 'username'
|
||||
},
|
||||
{
|
||||
title: '部门',
|
||||
width: '20%',
|
||||
align: 'center',
|
||||
dataIndex: 'departName'
|
||||
},
|
||||
{
|
||||
title: '职务',
|
||||
width: '15%',
|
||||
align: 'center',
|
||||
dataIndex: 'post',
|
||||
customRender: (text) => (text || '').split(',').map(t => this.positionInfo[t] ? this.positionInfo[t] : t).join(',')
|
||||
},
|
||||
{
|
||||
title: '手机',
|
||||
width: '15%',
|
||||
align: 'center',
|
||||
dataIndex: 'telephone'
|
||||
},
|
||||
// {
|
||||
// title: '手机号',
|
||||
// width: '12%',
|
||||
// align: 'center',
|
||||
// dataIndex: 'phone'
|
||||
// },
|
||||
{
|
||||
title: '公司邮箱',
|
||||
width: '15%',
|
||||
align: 'center',
|
||||
dataIndex: 'email'
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: '/sys/user/queryByOrgCodeForAddressList',
|
||||
listByPosition: '/sys/position/page'
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
value: {
|
||||
immediate: true,
|
||||
handler (orgCode) {
|
||||
this.dataSource = []
|
||||
this.loadData(1, orgCode)
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.queryPositionInfo()
|
||||
},
|
||||
methods: {
|
||||
|
||||
loadData (pageNum, orgCode) {
|
||||
this.loading = true
|
||||
if (pageNum === 1) {
|
||||
this.ipagination.current = 1
|
||||
}
|
||||
// update-begin- --- author:wangshuai ------ date:20200102 ---- for:传过来的部门编码为空全查
|
||||
if (!orgCode) {
|
||||
getAction(this.url.list, {
|
||||
...this.getQueryParams()
|
||||
}).then((res) => {
|
||||
if (res.success) {
|
||||
this.dataSource = res.result.records
|
||||
this.ipagination.total = res.result.total
|
||||
}
|
||||
}).finally(() => {
|
||||
this.loading = false
|
||||
this.cardLoading = false
|
||||
})
|
||||
// update-end- --- author:wangshuai ------ date:20200102 ---- for:传过来的部门编码为空全查
|
||||
} else {
|
||||
// 加载数据 若传入参数1则加载第一页的内容
|
||||
getAction(this.url.list, {
|
||||
orgCode,
|
||||
...this.getQueryParams()
|
||||
}).then((res) => {
|
||||
if (res.success) {
|
||||
this.dataSource = res.result.records
|
||||
this.ipagination.total = res.result.total
|
||||
}
|
||||
}).finally(() => {
|
||||
this.loading = false
|
||||
this.cardLoading = false
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
searchQuery () {
|
||||
this.loadData(1, this.value)
|
||||
},
|
||||
searchReset () {
|
||||
this.queryParam = {}
|
||||
this.loadData(1, this.value)
|
||||
},
|
||||
|
||||
handleTableChange (pagination, filters, sorter) {
|
||||
if (Object.keys(sorter).length > 0) {
|
||||
this.isorter.column = sorter.field
|
||||
this.isorter.order = sorter.order === 'ascend' ? 'asc' : 'desc'
|
||||
}
|
||||
this.ipagination = pagination
|
||||
this.loadData(null, this.value)
|
||||
},
|
||||
|
||||
// 查询职务信息
|
||||
queryPositionInfo () {
|
||||
getAction(this.url.listByPosition, { pageSize: 99999 }).then(res => {
|
||||
if (res.success) {
|
||||
const positionInfo = {}
|
||||
res.result.records.forEach(record => {
|
||||
positionInfo[record.code] = record.name
|
||||
})
|
||||
this.positionInfo = positionInfo
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.j-address-list-right-card-box .ant-table-placeholder {
|
||||
min-height: 46px;
|
||||
}
|
||||
</style>
|
||||
<style scoped>
|
||||
.j-address-list-right-card-box {
|
||||
height: 100%;
|
||||
min-height: 300px;
|
||||
}
|
||||
</style>
|
||||
@@ -1,164 +0,0 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:width="modalWidth"
|
||||
:visible="visible"
|
||||
:footer="null"
|
||||
switchFullscreen
|
||||
@cancel="handleCancel"
|
||||
cancelText="关闭">
|
||||
<!--table区 -->
|
||||
<div class="marginCss">
|
||||
<a-table
|
||||
ref="table"
|
||||
size="small"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:rowClassName="setdataCss"
|
||||
:loading="loading"
|
||||
:scroll="{ y: 700 }"
|
||||
:pagination="false">
|
||||
<span slot="dataVersionTitle1"><a-icon type="smile-o" /> 版本:{{dataVersion1Num}}</span>
|
||||
<span slot="dataVersionTitle2"><a-icon type="smile-o" /> 版本:{{dataVersion2Num}}</span>
|
||||
<template slot="avatarslot" slot-scope="text, record">
|
||||
<div class="anty-img-wrap">
|
||||
<img :src="getAvatarView(record)" alt=""/>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
</a-table>
|
||||
</div>
|
||||
</j-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getAction } from '@/api/manage'
|
||||
|
||||
export default {
|
||||
name: 'DataLogCompareModal',
|
||||
data () {
|
||||
return {
|
||||
modalWidth: 1000,
|
||||
modaltoggleFlag: true,
|
||||
confirmDirty: false,
|
||||
title: '操作',
|
||||
visible: false,
|
||||
model: {},
|
||||
confirmLoading: false,
|
||||
headers: {},
|
||||
// 版本号
|
||||
dataVersion1Num: '',
|
||||
dataVersion2Num: '',
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '字段名',
|
||||
align: 'left',
|
||||
dataIndex: 'code',
|
||||
width: '30%'
|
||||
}, {
|
||||
align: 'left',
|
||||
dataIndex: 'dataVersion1',
|
||||
width: '30%',
|
||||
slots: { title: 'dataVersionTitle1' }
|
||||
}, {
|
||||
title: '',
|
||||
dataIndex: 'imgshow',
|
||||
align: 'center',
|
||||
scopedSlots: { customRender: 'avatarslot' },
|
||||
width: '10%'
|
||||
}, {
|
||||
align: 'left',
|
||||
dataIndex: 'dataVersion2',
|
||||
width: '30%',
|
||||
slots: { title: 'dataVersionTitle2' }
|
||||
}
|
||||
],
|
||||
// 数据集
|
||||
dataSource: [],
|
||||
loading: false,
|
||||
url: {
|
||||
queryCompareUrl: '/sys/dataLog/queryCompareList'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
|
||||
},
|
||||
methods: {
|
||||
loadData (dataId1, dataId2) {
|
||||
this.dataSource = []
|
||||
const that = this
|
||||
getAction(that.url.queryCompareUrl, { dataId1: dataId1, dataId2: dataId2 }).then((res) => {
|
||||
if (res.success) {
|
||||
that.dataVersion1Num = res.result[0].dataVersion
|
||||
that.dataVersion2Num = res.result[1].dataVersion
|
||||
const json1 = JSON.parse(res.result[0].dataContent)
|
||||
const json2 = JSON.parse(res.result[1].dataContent)
|
||||
for (const item1 in json1) {
|
||||
for (const item2 in json2) {
|
||||
if (item1 === item2) {
|
||||
this.dataSource.push({
|
||||
code: item1,
|
||||
imgshow: '',
|
||||
dataVersion1: json1[item1],
|
||||
dataVersion2: json2[item2]
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
} else {
|
||||
console.log(res.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
compareModal (dataId1, dataId2) {
|
||||
this.visible = true
|
||||
this.loadData(dataId1, dataId2)
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
modalFormOk () {
|
||||
},
|
||||
close () {
|
||||
this.$emit('close')
|
||||
this.visible = false
|
||||
this.disableSubmit = false
|
||||
},
|
||||
setdataCss (record) {
|
||||
const className = 'trcolor'
|
||||
const dataVersion1 = record.dataVersion1
|
||||
const dataVersion2 = record.dataVersion2
|
||||
if (dataVersion1 !== dataVersion2) {
|
||||
return className
|
||||
}
|
||||
},
|
||||
getAvatarView: function (avatar) {
|
||||
if (avatar.dataVersion1 !== avatar.dataVersion2) {
|
||||
return '/goright.png'
|
||||
} else {
|
||||
return ''
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.anty-img-wrap {
|
||||
height: 25px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.anty-img-wrap > img {
|
||||
max-height: 100%;
|
||||
}
|
||||
|
||||
.marginCss {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
@import '../../../assets/less/index.less';
|
||||
</style>
|
||||
@@ -1,153 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<j-modal
|
||||
:width="modalWidth"
|
||||
:visible="visible"
|
||||
title="数据对比窗口"
|
||||
:confirmLoading="confirmLoading"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
cancelText="取消">
|
||||
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form @submit="handleSubmit" :form="form" class="form">
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :md="12" :sm="8">
|
||||
<a-form-item label="数据库表名" :label-col="{ span: 6 }" :wrapper-col="{ span: 15 }">
|
||||
<a-input placeholder="请输入数据库表名" v-decorator="[ 'dataTale', {}]" @blur="handleTableBlur" disabled/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :md="12" :sm="8">
|
||||
<a-form-item label="数据ID" :label-col="{ span: 5 }" :wrapper-col="{ span: 15 }">
|
||||
<a-input placeholder="请输入数据ID" v-decorator="[ 'dataId', {}]" @blur="handleIdBlur" disabled/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
<a-row class="form-row" :gutter="24">
|
||||
<a-col :md="12" :sm="8">
|
||||
<a-form-item label="版本号1" :label-col="{ span: 6 }" :wrapper-col="{ span: 15 }">
|
||||
<a-select placeholder="请选择版本号" v-decorator="[ 'dataVersion1', {}]" @change="handleChange1">
|
||||
<a-select-option v-for="(log,logindex) in DataVersionList" :key="logindex.toString()" :value="log.id">
|
||||
{{ log.dataVersion }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="12" :sm="8">
|
||||
<a-form-item label="版本号2" :label-col="{ span: 5 }" :wrapper-col="{ span: 15 }">
|
||||
<a-select placeholder="请选择版本号" v-decorator="[ 'dataVersion2', {}]" @change="handleChange2">
|
||||
<a-select-option v-for="(log,logindex) in DataVersionList" :key="logindex.toString()" :value="log.id">
|
||||
{{ log.dataVersion }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
<data-log-compare-modal ref="modal" @ok="modalFormOk" ></data-log-compare-modal>
|
||||
</j-modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getAction } from '@/api/manage'
|
||||
import DataLogCompareModal from './DataLogCompareModal'
|
||||
export default {
|
||||
name: 'DataLogModal',
|
||||
components: { DataLogCompareModal },
|
||||
dataId1: '',
|
||||
dataId2: '',
|
||||
dataTable1: '',
|
||||
dataID3: '',
|
||||
|
||||
data () {
|
||||
return {
|
||||
modalWidth: 700,
|
||||
modaltoggleFlag: true,
|
||||
confirmDirty: false,
|
||||
title: '操作',
|
||||
visible: false,
|
||||
model: {},
|
||||
confirmLoading: false,
|
||||
headers: {},
|
||||
form: this.$form.createForm(this),
|
||||
url: {
|
||||
queryDataVerListUrl: '/sys/dataLog/queryDataVerList'
|
||||
},
|
||||
DataVersionList: []
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
addModal (records) {
|
||||
const dataTable = records[0].dataTable
|
||||
const dataId = records[0].dataId
|
||||
const dataVersion1 = records[0].dataVersion
|
||||
const dataVersion2 = records[1].dataVersion
|
||||
this.dataId1 = records[0].id
|
||||
this.dataId2 = records[1].id
|
||||
this.dataTable1 = records[0].dataTable
|
||||
this.dataID3 = records[0].dataId
|
||||
this.initDataVersionList()
|
||||
this.form.resetFields()
|
||||
this.visible = true
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue({ dataTale: dataTable, dataId: dataId, dataVersion1: dataVersion1, dataVersion2: dataVersion2 })
|
||||
})
|
||||
},
|
||||
handleOk () {
|
||||
this.close()
|
||||
this.$refs.modal.compareModal(this.dataId1, this.dataId2)
|
||||
this.$refs.modal.title = '数据比较'
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
handleSubmit () {
|
||||
},
|
||||
close () {
|
||||
this.$emit('close')
|
||||
this.visible = false
|
||||
this.disableSubmit = false
|
||||
},
|
||||
modalFormOk () {
|
||||
},
|
||||
initDataVersionList () {
|
||||
const that = this
|
||||
getAction(that.url.queryDataVerListUrl, { dataTable: this.dataTable1, dataId: this.dataID3 }).then((res) => {
|
||||
if (res.success) {
|
||||
this.DataVersionList = res.result
|
||||
} else {
|
||||
this.DataVersionList = []
|
||||
this.dataId1 = ''
|
||||
this.dataId2 = ''
|
||||
console.log(res.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
handleChange1 (value) {
|
||||
this.dataId1 = value
|
||||
},
|
||||
handleChange2 (value) {
|
||||
this.dataId2 = value
|
||||
},
|
||||
handleTableBlur (e) {
|
||||
this.dataTable1 = e.target.value
|
||||
this.initDataVersionList()
|
||||
},
|
||||
handleIdBlur (e) {
|
||||
this.dataID3 = e.target.value
|
||||
this.initDataVersionList()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -1,190 +0,0 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<template v-if="this.departId">
|
||||
<a-spin :spinning="loading">
|
||||
<a-form>
|
||||
<a-form-item :label="$t('roleManage.youHavePermissions')">
|
||||
<a-tree
|
||||
:checkable="true"
|
||||
@check="onCheck"
|
||||
:checkedKeys="checkedKeys"
|
||||
:treeData="treeData"
|
||||
@expand="onExpand"
|
||||
@select="onTreeNodeSelect"
|
||||
:selectedKeys="selectedKeys"
|
||||
:expandedKeys="expandedKeysss"
|
||||
:checkStrictly="checkStrictly"
|
||||
style="height:500px;overflow: auto;">
|
||||
<span slot="hasDatarule" slot-scope="{slotTitle,ruleFlag}">
|
||||
{{ slotTitle }}
|
||||
<a-icon v-if="ruleFlag" type="align-left" style="margin-left:5px;color: red;"></a-icon>
|
||||
</span>
|
||||
</a-tree>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
<div class="anty-form-btn" v-if="isDev">
|
||||
<a-dropdown style="float: left" :trigger="['click']" placement="topCenter">
|
||||
<a-menu slot="overlay">
|
||||
<!-- 简化Tree逻辑，使用默认checkStrictly为false的行为，即默认父子关联
|
||||
<a-menu-item key="1" @click="switchCheckStrictly(1)">父子关联</a-menu-item>
|
||||
<a-menu-item key="2" @click="switchCheckStrictly(2)">取消关联</a-menu-item>
|
||||
-->
|
||||
<a-menu-item key="3" @click="checkALL">{{ $t('checkAll') }}</a-menu-item>
|
||||
<a-menu-item key="4" @click="cancelCheckALL">{{ $t('deselectAll') }}</a-menu-item>
|
||||
<a-menu-item key="5" @click="expandAll">{{ $t('expandAll') }}</a-menu-item>
|
||||
<a-menu-item key="6" @click="closeAll">{{ $t('mergeAll') }}</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button>
|
||||
{{ $t('treeOperation') }} <a-icon type="up" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
<a-button style="float: right" @click="handleSubmit" type="primary" htmlType="button" icon="form">{{ $t('preservation') }}</a-button>
|
||||
</div>
|
||||
</template>
|
||||
<a-card v-else :bordered="false" style="height:200px">
|
||||
<a-empty>
|
||||
<span slot="description"> {{ $t('depart:selectDepartmentFirst') }} </span>
|
||||
</a-empty>
|
||||
</a-card>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { queryTreeListForRole, queryDepartPermission, saveDepartPermission } from '@/api/api'
|
||||
|
||||
export default {
|
||||
name: 'DepartAuthModal',
|
||||
data () {
|
||||
return {
|
||||
// 是否开发环境(线上需隐藏按钮)
|
||||
isDev: process.env.VUE_APP_TAG_FLAG === '0',
|
||||
departId: '',
|
||||
treeData: [],
|
||||
defaultCheckedKeys: [],
|
||||
checkedKeys: [],
|
||||
halfCheckedKeys: [],
|
||||
expandedKeysss: [],
|
||||
allTreeKeys: [],
|
||||
autoExpandParent: true,
|
||||
checkStrictly: false,
|
||||
title: this.$t('depart.departmentPermissionConfig'),
|
||||
visible: false,
|
||||
loading: false,
|
||||
selectedKeys: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onTreeNodeSelect (id) {
|
||||
if (id && id.length > 0) {
|
||||
this.selectedKeys = id
|
||||
}
|
||||
},
|
||||
onCheck (checkedKeys, { halfCheckedKeys }) {
|
||||
// 保存选中的和半选中的，后面保存的时候合并提交
|
||||
this.checkedKeys = checkedKeys
|
||||
this.halfCheckedKeys = halfCheckedKeys
|
||||
},
|
||||
show (departId) {
|
||||
this.departId = departId
|
||||
this.loadData()
|
||||
},
|
||||
close () {
|
||||
this.reset()
|
||||
this.$emit('close')
|
||||
this.visible = false
|
||||
},
|
||||
onExpand (expandedKeys) {
|
||||
this.expandedKeysss = expandedKeys
|
||||
this.autoExpandParent = false
|
||||
},
|
||||
reset () {
|
||||
this.expandedKeysss = []
|
||||
this.checkedKeys = []
|
||||
this.defaultCheckedKeys = []
|
||||
this.loading = false
|
||||
},
|
||||
expandAll () {
|
||||
this.expandedKeysss = this.allTreeKeys
|
||||
},
|
||||
closeAll () {
|
||||
this.expandedKeysss = []
|
||||
},
|
||||
checkALL () {
|
||||
this.checkedKeys = this.allTreeKeys
|
||||
},
|
||||
cancelCheckALL () {
|
||||
this.checkedKeys = []
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
handleSubmit () {
|
||||
const that = this
|
||||
if (!that.departId) {
|
||||
this.$message.warning(this.$t('depart.clickCheckADepart'))
|
||||
}
|
||||
const checkedKeys = [...that.checkedKeys, ...that.halfCheckedKeys]
|
||||
const permissionIds = checkedKeys.join(',')
|
||||
const params = {
|
||||
departId: that.departId,
|
||||
permissionIds,
|
||||
lastpermissionIds: that.defaultCheckedKeys.join(',')
|
||||
}
|
||||
that.loading = true
|
||||
saveDepartPermission(params).then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message)
|
||||
that.loading = false
|
||||
that.loadData()
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
that.loading = false
|
||||
}
|
||||
})
|
||||
},
|
||||
convertTreeListToKeyLeafPairs (treeList, keyLeafPair = []) {
|
||||
for (const { key, isLeaf, children } of treeList) {
|
||||
keyLeafPair.push({ key, isLeaf })
|
||||
if (children && children.length > 0) {
|
||||
this.convertTreeListToKeyLeafPairs(children, keyLeafPair)
|
||||
}
|
||||
}
|
||||
return keyLeafPair
|
||||
},
|
||||
emptyCurrForm () {
|
||||
this.form.resetFields()
|
||||
},
|
||||
loadData () {
|
||||
this.loading = true
|
||||
queryTreeListForRole().then((res) => {
|
||||
this.treeData = res.result.treeList
|
||||
this.allTreeKeys = res.result.ids
|
||||
const keyLeafPairs = this.convertTreeListToKeyLeafPairs(this.treeData)
|
||||
queryDepartPermission({ departId: this.departId }).then((res) => {
|
||||
// 过滤出 leaf node 即可，即选中的
|
||||
// Tree组件中checkStrictly默认为false的时候，选中子节点，父节点会自动设置选中或半选中
|
||||
// 保存 checkedKeys 以及 halfCheckedKeys 以便于未做任何操作时提交表单数据
|
||||
const checkedKeys = [...res.result].filter(key => {
|
||||
const keyLeafPair = keyLeafPairs.filter(item => item.key === key)[0]
|
||||
return keyLeafPair && keyLeafPair.isLeaf
|
||||
})
|
||||
const halfCheckedKeys = [...res.result].filter(key => {
|
||||
const keyLeafPair = keyLeafPairs.filter(item => item.key === key)[0]
|
||||
return keyLeafPair && !keyLeafPair.isLeaf
|
||||
})
|
||||
this.checkedKeys = [...checkedKeys]
|
||||
this.halfCheckedKeys = [...halfCheckedKeys]
|
||||
this.defaultCheckedKeys = [...halfCheckedKeys, ...checkedKeys]
|
||||
this.expandedKeysss = this.allTreeKeys
|
||||
this.loading = false
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -1,116 +0,0 @@
|
||||
<template>
|
||||
<a-drawer
|
||||
title="数据规则/按钮权限配置"
|
||||
width="365"
|
||||
:closable="false"
|
||||
@close="onClose"
|
||||
:visible="visible"
|
||||
>
|
||||
<a-tabs defaultActiveKey="1">
|
||||
<a-tab-pane tab="数据规则" key="1">
|
||||
|
||||
<a-checkbox-group v-model="dataruleChecked" v-if="dataruleList.length>0">
|
||||
<a-row>
|
||||
<a-col :span="24" v-for="(item,index) in dataruleList" :key=" 'dr'+index ">
|
||||
<a-checkbox :value="item.id">{{ item.ruleName }}</a-checkbox>
|
||||
</a-col>
|
||||
|
||||
<a-col :span="24">
|
||||
<div style="width: 100%;margin-top: 15px">
|
||||
<a-button @click="saveDataruleForRole" type="primary" size="small" icon="save">点击保存</a-button>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-checkbox-group>
|
||||
<div v-else><h3>无配置信息!</h3></div>
|
||||
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
|
||||
</a-drawer>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ARow from 'ant-design-vue/es/grid/Row'
|
||||
import ACol from 'ant-design-vue/es/grid/Col'
|
||||
import { getAction, postAction } from '@/api/manage'
|
||||
|
||||
export default {
|
||||
name: 'DepartDataruleModal',
|
||||
components: { ACol, ARow },
|
||||
data () {
|
||||
return {
|
||||
functionId: '',
|
||||
departId: '',
|
||||
visible: false,
|
||||
tabList: [{
|
||||
key: '1',
|
||||
tab: '数据规则'
|
||||
}, {
|
||||
key: '2',
|
||||
tab: '按钮权限'
|
||||
}],
|
||||
activeTabKey: '1',
|
||||
url: {
|
||||
datarule: '/sys/sysDepartPermission/datarule'
|
||||
},
|
||||
dataruleList: [],
|
||||
dataruleChecked: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
loadData () {
|
||||
getAction(`${this.url.datarule}/${this.functionId}/${this.departId}`).then(res => {
|
||||
if (res.success) {
|
||||
this.dataruleList = res.result.datarule
|
||||
const drChecked = res.result.drChecked
|
||||
if (drChecked) {
|
||||
this.dataruleChecked = drChecked.split(',')
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
saveDataruleForRole () {
|
||||
if (!this.dataruleChecked || this.dataruleChecked.length === 0) {
|
||||
this.$message.warning('请注意，现未勾选任何数据权限!')
|
||||
}
|
||||
const params = {
|
||||
permissionId: this.functionId,
|
||||
departId: this.departId,
|
||||
dataRuleIds: this.dataruleChecked.join(',')
|
||||
}
|
||||
postAction(this.url.datarule, params).then(res => {
|
||||
if (res.success) {
|
||||
this.$message.success(res.message)
|
||||
} else {
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
show (functionId, departId) {
|
||||
this.onReset()
|
||||
this.functionId = functionId
|
||||
this.departId = departId
|
||||
this.visible = true
|
||||
this.loadData()
|
||||
},
|
||||
onClose () {
|
||||
this.visible = false
|
||||
this.onReset()
|
||||
},
|
||||
onTabChange (key) {
|
||||
this.activeTabKey = key
|
||||
},
|
||||
onReset () {
|
||||
this.functionId = ''
|
||||
this.departId = ''
|
||||
this.dataruleList = []
|
||||
this.dataruleChecked = []
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -1,223 +0,0 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="800"
|
||||
:ok=false
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
switchFullscreen
|
||||
:okButtonProps="{ props: {disabled: disableSubmit} }"
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
:cancelText="$t('close')">
|
||||
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form-model ref="form" :model="model" :rules="validatorRules">
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
:label="$t('depart.organizationName')"
|
||||
prop="departName"
|
||||
:hidden="false"
|
||||
:hasFeedback="true" >
|
||||
<a-input id="departName" :placeholder="$t('depart.enterOrganizationDepartment')" v-model="model.departName"/>
|
||||
</a-form-model-item>
|
||||
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" :hidden="seen" :label="$t('depart.superiorDepartment')" :hasFeedback="true">
|
||||
<a-tree-select
|
||||
style="width:100%"
|
||||
:dropdownStyle="{maxHeight:'200px',overflow:'auto'}"
|
||||
:treeData="departTree"
|
||||
v-model="model.parentId"
|
||||
:placeholder="$t('pleaseSelect') + $t('depart.superiorDepartment')"
|
||||
:disabled="condition">
|
||||
</a-tree-select>
|
||||
</a-form-model-item>
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
:label="$t('depart.organizationType')">
|
||||
<template v-if="seen">
|
||||
<a-radio-group v-model="model.orgCategory" :placeholder="$t('pleaseSelect') + $t('depart.organizationType')">
|
||||
<a-radio value="1">
|
||||
{{ $t('depart.company') }}
|
||||
</a-radio>
|
||||
</a-radio-group>
|
||||
</template>
|
||||
<template v-else>
|
||||
<a-radio-group v-model="model.orgCategory" :placeholder="$t('pleaseSelect') + $t('depart.organizationType')">
|
||||
<a-radio value="2">
|
||||
{{ $t('department') }}
|
||||
</a-radio>
|
||||
<a-radio value="3">
|
||||
{{ $t('depart.post') }}
|
||||
</a-radio>
|
||||
</a-radio-group>
|
||||
</template>
|
||||
</a-form-model-item>
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
prop="mobile"
|
||||
:label="$t('phoneNumber')">
|
||||
<a-input :placeholder="$t('pleaseEnter') + $t('phoneNumber')" v-model="model.mobile"/>
|
||||
</a-form-model-item>
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
:label="$t('depart.fax')">
|
||||
<a-input :placeholder="$t('pleaseEnter') + $t('depart.fax')" v-model="model.fax"/>
|
||||
</a-form-model-item>
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
:label="$t('address')">
|
||||
<a-input :placeholder="$t('pleaseEnter') + $t('address')" v-model="model.address"/>
|
||||
</a-form-model-item>
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
:label="$t('sort')">
|
||||
<a-input-number v-model="model.departOrder"/>
|
||||
</a-form-model-item>
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
:label="$t('remarks')">
|
||||
<a-textarea :placeholder="$t('pleaseEnter') + $t('remarks')" v-model="model.memo"/>
|
||||
</a-form-model-item>
|
||||
|
||||
</a-form-model>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { httpAction } from '@/api/manage'
|
||||
import { queryIdTree } from '@/api/api'
|
||||
// import pick from 'lodash.pick'
|
||||
import ATextarea from 'ant-design-vue/es/input/TextArea'
|
||||
export default {
|
||||
name: 'SysDepartModal',
|
||||
components: { ATextarea },
|
||||
data () {
|
||||
return {
|
||||
departTree: [],
|
||||
orgTypeData: [],
|
||||
phoneWarning: '',
|
||||
departName: '',
|
||||
title: '操作',
|
||||
seen: false,
|
||||
visible: false,
|
||||
condition: true,
|
||||
disableSubmit: false,
|
||||
model: {},
|
||||
defaultModel: {
|
||||
departOrder: 0,
|
||||
orgCategory: '1'
|
||||
},
|
||||
menuhidden: false,
|
||||
menuusing: true,
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 }
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 }
|
||||
},
|
||||
|
||||
confirmLoading: false,
|
||||
validatorRules: {
|
||||
departName: [{ required: true, message: this.$t('depart.enterOrganizationDepartment') + '!' }],
|
||||
orgCode: [{ required: true, message: this.$t('pleaseEnter') + this.$t('depart.organizationCode') + '!' }],
|
||||
mobile: [{ validator: this.validateMobile }],
|
||||
orgCategory: [{ required: true, message: this.$t('pleaseSelect') + this.$t('depart.organizationType') + '!' }]
|
||||
},
|
||||
url: {
|
||||
add: '/sys/sysDepart/add'
|
||||
},
|
||||
dictDisabled: true
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
loadTreeData () {
|
||||
const that = this
|
||||
queryIdTree().then((res) => {
|
||||
if (res.success) {
|
||||
that.departTree = []
|
||||
for (let i = 0; i < res.result.length; i++) {
|
||||
const temp = res.result[i]
|
||||
that.departTree.push(temp)
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
add (depart) {
|
||||
if (depart) {
|
||||
this.seen = false
|
||||
this.dictDisabled = false
|
||||
} else {
|
||||
this.seen = true
|
||||
this.dictDisabled = true
|
||||
}
|
||||
this.edit(depart)
|
||||
},
|
||||
edit (record) {
|
||||
this.visible = true
|
||||
this.model = Object.assign({}, this.defaultModel, record)
|
||||
this.loadTreeData()
|
||||
this.model.parentId = record != null ? record.toString() : null
|
||||
if (this.seen) {
|
||||
this.model.orgCategory = '1'
|
||||
} else {
|
||||
this.model.orgCategory = '2'
|
||||
}
|
||||
},
|
||||
close () {
|
||||
this.$emit('close')
|
||||
this.disableSubmit = false
|
||||
this.visible = false
|
||||
this.$refs.form.resetFields()
|
||||
},
|
||||
handleOk () {
|
||||
const that = this
|
||||
// 触发表单验证
|
||||
this.$refs.form.validate(valid => {
|
||||
if (valid) {
|
||||
that.confirmLoading = true
|
||||
httpAction(this.url.add, this.model, 'post').then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message)
|
||||
that.loadTreeData()
|
||||
that.$emit('ok')
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
that.confirmLoading = false
|
||||
that.close()
|
||||
})
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
validateMobile (rule, value, callback) {
|
||||
if (!value || new RegExp(/^1([38][0-9]|4[579]|5[0-3,5-9]|6[6]|7[0135678]|9[89])\d{8}$/).test(value)) {
|
||||
callback()
|
||||
} else {
|
||||
callback(new Error(this.$t('depart.mobileFormatCorrect')))
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -1,188 +0,0 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:width="modalWidth"
|
||||
:visible="visible"
|
||||
title="部门搜索"
|
||||
:confirmLoading="confirmLoading"
|
||||
switchFullscreen
|
||||
@ok="handleSubmit"
|
||||
@cancel="handleCancel"
|
||||
cancelText="关闭"
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
>
|
||||
<!--部门树-->
|
||||
<template>
|
||||
<a-form :form="form">
|
||||
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="上级部门">
|
||||
<a-tree
|
||||
multiple
|
||||
treeCheckable="tree"
|
||||
:checkable="true"
|
||||
@expand="onExpand"
|
||||
:expandedKeys="expandedKeysss"
|
||||
:checkedKeys="checkedKeys"
|
||||
allowClear="true"
|
||||
:checkStrictly="true"
|
||||
@check="onCheck"
|
||||
:dropdownStyle="{maxHeight:'200px',overflow:'auto'}"
|
||||
:treeData="departTree"
|
||||
placeholder="请选择上级部门"
|
||||
>
|
||||
</a-tree>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</template>
|
||||
</j-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import { getAction } from '@/api/manage'
|
||||
import { queryIdTree } from '@/api/api'
|
||||
export default {
|
||||
name: 'DepartWindow',
|
||||
components: {
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
checkedKeys: [], // 存储选中的部门id
|
||||
expandedKeysss: [], // 展开的节点
|
||||
userId: '', // 存储用户id
|
||||
model: {}, // 存储SysUserDepartsVO表
|
||||
userDepartModel: { userId: '', departIdList: [] }, // 存储用户id一对多部门信息的对象
|
||||
departList: [], // 存储部门信息
|
||||
modalWidth: 400,
|
||||
departTree: [],
|
||||
title: '操作',
|
||||
visible: false,
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 }
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 }
|
||||
},
|
||||
confirmLoading: false,
|
||||
headers: {},
|
||||
form: this.$form.createForm(this),
|
||||
url: {
|
||||
userId: '/sys/user/generateUserId' // 引入生成添加用户情况下的url
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
add (checkedDepartKeys, userId) {
|
||||
this.checkedKeys = checkedDepartKeys
|
||||
this.userId = userId
|
||||
this.edit({})
|
||||
},
|
||||
edit (record) {
|
||||
this.departList = []
|
||||
this.queryDepartTree()
|
||||
this.form.resetFields()
|
||||
this.visible = true
|
||||
this.model = Object.assign({}, record)
|
||||
const filedsVal = pick(this.model, 'id', 'userId', 'departIdList')
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(filedsVal)
|
||||
})
|
||||
},
|
||||
close () {
|
||||
this.$emit('close')
|
||||
this.visible = false
|
||||
this.departList = []
|
||||
this.checkedKeys = []
|
||||
},
|
||||
handleSubmit () {
|
||||
const that = this
|
||||
// 触发表单验证
|
||||
this.form.validateFields((err) => {
|
||||
if (!err) {
|
||||
that.confirmLoading = true
|
||||
if (this.userId == null) {
|
||||
getAction(this.url.userId).then((res) => {
|
||||
if (res.success) {
|
||||
const formData = {
|
||||
userId: res.result,
|
||||
departIdList: this.departList
|
||||
}
|
||||
that.$emit('ok', formData)
|
||||
}
|
||||
}).finally(() => {
|
||||
that.departList = []
|
||||
that.confirmLoading = false
|
||||
that.close()
|
||||
})
|
||||
} else {
|
||||
const formData = {
|
||||
userId: this.userId,
|
||||
departIdList: this.departList
|
||||
}
|
||||
that.departList = []
|
||||
that.$emit('ok', formData)
|
||||
that.confirmLoading = false
|
||||
that.close()
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
|
||||
// 选择部门时作用的API
|
||||
onCheck (checkedKeys, info) {
|
||||
this.departList = []
|
||||
this.checkedKeys = checkedKeys.checked
|
||||
const checkedNodes = info.checkedNodes
|
||||
for (let i = 0; i < checkedNodes.length; i++) {
|
||||
const de = checkedNodes[i].data.props
|
||||
const depart = { key: '', value: '', title: '' }
|
||||
depart.key = de.value
|
||||
depart.value = de.value
|
||||
depart.title = de.title
|
||||
this.departList.push(depart)
|
||||
}
|
||||
},
|
||||
queryDepartTree () {
|
||||
queryIdTree().then((res) => {
|
||||
if (res.success) {
|
||||
this.departTree = res.result
|
||||
if (this.checkedKeys && this.checkedKeys.length > 0) {
|
||||
const treekey = []
|
||||
const arr = res.result
|
||||
if (arr && arr.length > 0) {
|
||||
arr.forEach(item => {
|
||||
treekey.push(item.key)
|
||||
/* if(item.children&&item.children.length>0){
|
||||
item.children.forEach(item1 => {
|
||||
treekey.push(item1.key);
|
||||
})
|
||||
} */
|
||||
})
|
||||
this.expandedKeysss = treekey
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
onExpand (expandedKeys) {
|
||||
this.expandedKeysss = expandedKeys
|
||||
},
|
||||
modalFormOk () {
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.ant-table-tbody .ant-table-row td{
|
||||
padding-top:10px;
|
||||
padding-bottom:10px;
|
||||
}
|
||||
/deep/ .ant-modal{
|
||||
height: 700px;
|
||||
}
|
||||
</style>
|
||||
@@ -1,145 +0,0 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="$t('resetPassword.resetPasswordModalTitle')"
|
||||
:width="800"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
switchFullscreen
|
||||
@ok="handleSubmit"
|
||||
@cancel="handleCancel"
|
||||
:cancelText="$t('close')"
|
||||
style="top:20px;"
|
||||
>
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
|
||||
<a-form-item :label="$t('user.userAccount')" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-input :placeholder="$t('pleaseEnter') + $t('user.userAccount')" v-decorator="[ 'username', {}]" :readOnly="true"/>
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item :label="$t('user.loginPassword')" :labelCol="labelCol" :wrapperCol="wrapperCol" :hasFeedback="true" >
|
||||
<a-input type="password" :placeholder="$t('pleaseEnter') + $t('user.loginPassword')" v-decorator="[ 'password', validatorRules.password]" />
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item :label="$t('user.confirmPassword')" :labelCol="labelCol" :wrapperCol="wrapperCol" :hasFeedback="true" >
|
||||
<a-input type="password" @blur="handleConfirmBlur" :placeholder="$t('user.reenterLoginPassword')" v-decorator="[ 'confirmpassword', validatorRules.confirmpassword]"/>
|
||||
</a-form-item>
|
||||
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { changePassword } from '@/api/api'
|
||||
|
||||
export default {
|
||||
name: 'PasswordModal',
|
||||
data () {
|
||||
return {
|
||||
visible: false,
|
||||
confirmLoading: false,
|
||||
confirmDirty: false,
|
||||
validatorRules: {
|
||||
password: {
|
||||
rules: [{
|
||||
required: true,
|
||||
pattern: /^(?=.*[a-zA-Z])(?=.*\d)(?=.*[~!@#$%^&*()_+`\-={}:";'<>?,./]).{8,}$/,
|
||||
message: this.$t('user.passwordConsists')
|
||||
}, {
|
||||
validator: this.validateToNextPassword
|
||||
}],
|
||||
validateTrigger: 'blur'
|
||||
},
|
||||
confirmpassword: {
|
||||
rules: [{
|
||||
required: true, message: this.$t('user.reenterLoginPassword')
|
||||
}, {
|
||||
validator: this.compareToFirstPassword
|
||||
}],
|
||||
validateTrigger: 'blur'
|
||||
}
|
||||
},
|
||||
|
||||
model: {},
|
||||
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 }
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 }
|
||||
},
|
||||
form: this.$form.createForm(this)
|
||||
}
|
||||
},
|
||||
created () {
|
||||
console.log('created')
|
||||
},
|
||||
|
||||
methods: {
|
||||
show (username) {
|
||||
this.form.resetFields()
|
||||
this.visible = true
|
||||
this.model.username = username
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue({ username: username })
|
||||
})
|
||||
},
|
||||
close () {
|
||||
this.$emit('close')
|
||||
this.visible = false
|
||||
this.disableSubmit = false
|
||||
this.selectedRole = []
|
||||
},
|
||||
handleSubmit () {
|
||||
// 触发表单验证
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
this.confirmLoading = true
|
||||
const formData = Object.assign(this.model, values)
|
||||
changePassword(formData).then((res) => {
|
||||
if (res.success) {
|
||||
this.$message.success(res.message)
|
||||
this.$emit('ok')
|
||||
} else {
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
this.confirmLoading = false
|
||||
this.close()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
validateToNextPassword (rule, value, callback) {
|
||||
const form = this.form
|
||||
const confirmpassword = form.getFieldValue('confirmpassword')
|
||||
console.log('confirmpassword==>', confirmpassword)
|
||||
if (value && confirmpassword && value !== confirmpassword) {
|
||||
callback(new Error(this.$t('user.passwordsEnteredTwice')))
|
||||
}
|
||||
if (value && this.confirmDirty) {
|
||||
form.validateFields(['confirm'], { force: true })
|
||||
}
|
||||
callback()
|
||||
},
|
||||
compareToFirstPassword (rule, value, callback) {
|
||||
const form = this.form
|
||||
if (value && value !== form.getFieldValue('password')) {
|
||||
callback(new Error(this.$t('user.passwordsEnteredTwice')))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
handleConfirmBlur (e) {
|
||||
const value = e.target.value
|
||||
this.confirmDirty = this.confirmDirty || !!value
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -1,171 +0,0 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="1000"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
cancelText="关闭">
|
||||
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form-model ref="form" :model="model" :rules="validatorRules">
|
||||
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
prop="ruleName"
|
||||
label="规则名称">
|
||||
<a-input placeholder="请输入规则名称" v-model="model.ruleName"/>
|
||||
</a-form-model-item>
|
||||
<a-form-model-item
|
||||
v-show="showRuleColumn"
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
prop="ruleColumn"
|
||||
label="规则字段">
|
||||
<a-input placeholder="请输入规则字段" v-model.trim="model.ruleColumn"/>
|
||||
</a-form-model-item>
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
prop="ruleConditions"
|
||||
label="条件规则">
|
||||
<j-dict-select-tag @input="handleChangeRuleCondition" v-model="model.ruleConditions" placeholder="请输入条件规则" dictCode="rule_conditions"/>
|
||||
</a-form-model-item>
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
prop="ruleValue"
|
||||
label="规则值">
|
||||
<a-input placeholder="请输入规则值" v-model.trim="model.ruleValue"/>
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="状态">
|
||||
<a-radio-group buttonStyle="solid" v-model="model.status">
|
||||
<a-radio-button value="1">有效</a-radio-button>
|
||||
<a-radio-button value="0">无效</a-radio-button>
|
||||
</a-radio-group>
|
||||
</a-form-model-item>
|
||||
|
||||
</a-form-model>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { httpAction } from '@/api/manage'
|
||||
|
||||
export default {
|
||||
name: 'PermissionDataRuleModal',
|
||||
data () {
|
||||
return {
|
||||
queryParam: {},
|
||||
title: '操作',
|
||||
visible: false,
|
||||
model: {},
|
||||
ruleConditionList: [],
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 }
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 }
|
||||
},
|
||||
confirmLoading: false,
|
||||
permissionId: '',
|
||||
validatorRules: {
|
||||
ruleConditions: [{ required: true, message: '请选择条件!' }],
|
||||
ruleName: [{ required: true, message: '请输入规则名称!' }],
|
||||
ruleValue: [{ required: true, message: '请输入规则值!' }],
|
||||
ruleColumn: []
|
||||
},
|
||||
url: {
|
||||
list: '/sys/dictItem/page',
|
||||
add: '/sys/permission/addPermissionRule',
|
||||
edit: '/sys/permission/editPermissionRule'
|
||||
},
|
||||
showRuleColumn: true
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
add (permId) {
|
||||
this.permissionId = permId
|
||||
// 初始化默认值
|
||||
this.edit({ status: '1' })
|
||||
},
|
||||
edit (record) {
|
||||
this.model = Object.assign({}, record)
|
||||
if (record.permissionId) {
|
||||
this.model.permissionId = record.permissionId
|
||||
} else {
|
||||
this.model.permissionId = this.permissionId
|
||||
}
|
||||
this.visible = true
|
||||
this.initRuleCondition()
|
||||
},
|
||||
close () {
|
||||
this.$emit('close')
|
||||
this.visible = false
|
||||
this.$refs.form.resetFields()
|
||||
},
|
||||
handleOk () {
|
||||
const that = this
|
||||
// 触发表单验证
|
||||
this.$refs.form.validate(valid => {
|
||||
if (valid) {
|
||||
that.confirmLoading = true
|
||||
let httpurl = ''
|
||||
const method = 'post'
|
||||
if (!this.model.id) {
|
||||
httpurl += this.url.add
|
||||
// method = 'post'
|
||||
} else {
|
||||
httpurl += this.url.edit
|
||||
// method = 'put'
|
||||
}
|
||||
|
||||
httpAction(httpurl, this.model, method).then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message)
|
||||
that.$emit('ok')
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
that.confirmLoading = false
|
||||
that.close()
|
||||
})
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
initRuleCondition () {
|
||||
this.showRuleColumn = !(this.model.ruleConditions && this.model.ruleConditions === 'USE_SQL_RULES')
|
||||
},
|
||||
handleChangeRuleCondition (val) {
|
||||
if (val === 'USE_SQL_RULES') {
|
||||
this.model.ruleColumn = ''
|
||||
this.showRuleColumn = false
|
||||
} else {
|
||||
this.showRuleColumn = true
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -1,379 +0,0 @@
|
||||
<template>
|
||||
<a-drawer
|
||||
:title="title"
|
||||
:width="drawerWidth"
|
||||
@close="handleCancel"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading">
|
||||
|
||||
<div :style="{width: '100%',border: '1px solid #e9e9e9',padding: '10px 16px',background: '#fff',}">
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form-model ref="form" :model="model" :rules="validatorRules">
|
||||
|
||||
<a-form-model-item label="菜单类型" :labelCol="labelCol" :wrapperCol="wrapperCol" >
|
||||
<a-radio-group @change="onChangeMenuType" v-model="model.menuType">
|
||||
<a-radio :value="0">一级菜单</a-radio>
|
||||
<a-radio :value="1">子菜单</a-radio>
|
||||
<a-radio :value="2">按钮/权限</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
:label="menuLabel"
|
||||
prop="name"
|
||||
:hasFeedback="true" >
|
||||
<a-input placeholder="请输入菜单名称" v-model="model.name" :readOnly="disableSubmit"/>
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="菜单英文名称"
|
||||
prop="englishName"
|
||||
:hasFeedback="true" >
|
||||
<a-input placeholder="请输入菜单英文名称" v-model="model.englishName" :readOnly="disableSubmit"/>
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item
|
||||
v-show="(model.menuType + '')!=='0'"
|
||||
label="上级菜单"
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
:validate-status="validateStatus"
|
||||
:hasFeedback="true"
|
||||
:required="true">
|
||||
<span slot="help">{{ validateStatus==='error'?'请选择上级菜单':' ' }}</span>
|
||||
<a-tree-select
|
||||
style="width:100%"
|
||||
:dropdownStyle="{ maxHeight: '200px', overflow: 'auto' }"
|
||||
:treeData="treeData"
|
||||
v-model="model.parentId"
|
||||
placeholder="请选择父级菜单"
|
||||
:disabled="disableSubmit"
|
||||
@change="handleParentIdChange">
|
||||
</a-tree-select>
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
prop="url"
|
||||
label="菜单路径">
|
||||
<a-input placeholder="请输入菜单路径" v-model="model.url" :readOnly="disableSubmit"/>
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item
|
||||
v-show="show"
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
prop="component"
|
||||
label="前端组件">
|
||||
<a-input placeholder="请输入前端组件" v-model="model.component" :readOnly="disableSubmit"/>
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item
|
||||
v-show="(model.menuType + '')==='0'"
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="默认跳转地址">
|
||||
<a-input placeholder="请输入路由参数 redirect" v-model="model.redirect" :readOnly="disableSubmit"/>
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item
|
||||
v-show="!show"
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
prop="perms"
|
||||
label="授权标识">
|
||||
<a-input placeholder="请输入授权标识, 如: user:list" v-model="model.perms" :readOnly="disableSubmit"/>
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item
|
||||
v-show="!show"
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="授权策略">
|
||||
<j-dict-select-tag v-model="model.permsType" placeholder="请选择授权策略" :type="'radio'" dictCode="global_perms_type"/>
|
||||
|
||||
</a-form-model-item>
|
||||
<a-form-model-item
|
||||
v-show="!show"
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="状态">
|
||||
<j-dict-select-tag v-model="model.status" placeholder="请选择状态" :type="'radio'" dictCode="valid_status"/>
|
||||
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item
|
||||
v-show="show"
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="菜单图标">
|
||||
<a-input placeholder="点击选择图标" v-model="model.icon" :readOnly="disableSubmit">
|
||||
<a-icon slot="addonAfter" type="setting" @click="selectIcons" />
|
||||
</a-input>
|
||||
</a-form-model-item>
|
||||
<!--v-show="show"-->
|
||||
<a-form-model-item
|
||||
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
prop="sortNo"
|
||||
label="排序">
|
||||
<a-input-number placeholder="请输入菜单排序" v-model="model.sortNo" style="width: 200px" :readOnly="disableSubmit"/>
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item
|
||||
v-show="show"
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="是否路由菜单">
|
||||
<a-switch checkedChildren="是" unCheckedChildren="否" v-model="model.route"/>
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item
|
||||
v-show="show"
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="隐藏路由">
|
||||
<a-switch checkedChildren="是" unCheckedChildren="否" v-model="model.hidden"/>
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item
|
||||
v-show="show"
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="是否缓存路由">
|
||||
<a-switch checkedChildren="是" unCheckedChildren="否" v-model="model.keepAlive"/>
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item
|
||||
v-show="show"
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="聚合路由">
|
||||
<a-switch checkedChildren="是" unCheckedChildren="否" v-model="model.alwaysShow"/>
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item
|
||||
v-show="show"
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="打开方式">
|
||||
<a-switch checkedChildren="外部" unCheckedChildren="内部" v-model="model.internalOrExternal"/>
|
||||
</a-form-model-item>
|
||||
|
||||
</a-form-model>
|
||||
|
||||
<!-- 选择图标 -->
|
||||
<icons @choose="handleIconChoose" @close="handleIconCancel" :iconChooseVisible="iconChooseVisible"></icons>
|
||||
</a-spin>
|
||||
<a-row :style="{textAlign:'right'}">
|
||||
<a-button :style="{marginRight: '8px'}" @click="handleCancel">
|
||||
关闭
|
||||
</a-button>
|
||||
<a-button :disabled="disableSubmit" @click="handleOk" type="primary">确定</a-button>
|
||||
</a-row>
|
||||
</div>
|
||||
</a-drawer>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { addPermission, editPermission, queryTreeList, duplicateCheck } from '@/api/api'
|
||||
import Icons from './icon/Icons'
|
||||
import JDictSelectTag from '../../../components/dict/JDictSelectTag'
|
||||
import { getConfusionCode } from '@/utils/util'
|
||||
|
||||
export default {
|
||||
name: 'PermissionModal',
|
||||
components: { Icons, JDictSelectTag },
|
||||
data () {
|
||||
return {
|
||||
drawerWidth: 700,
|
||||
treeData: [],
|
||||
title: '操作',
|
||||
visible: false,
|
||||
disableSubmit: false,
|
||||
model: {},
|
||||
show: true, // 根据菜单类型，动态显示隐藏表单元素
|
||||
menuLabel: '菜单名称',
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 }
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 }
|
||||
},
|
||||
confirmLoading: false,
|
||||
iconChooseVisible: false,
|
||||
validateStatus: ''
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
validatorRules: function () {
|
||||
return {
|
||||
name: [{ required: true, message: '请输入菜单标题!' }],
|
||||
englishName: [{ required: false, message: '请输入菜单英文名称' }],
|
||||
component: [{ required: this.show, message: '请输入前端组件!' }],
|
||||
url: [{ required: this.show, message: '请输入菜单路径!' }],
|
||||
permsType: [{ required: true, message: '请输入授权策略!' }],
|
||||
perms: [{ required: false, message: '请输入授权标识!' }, { validator: this.validatePerms }]
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
loadTree () {
|
||||
const that = this
|
||||
queryTreeList().then((res) => {
|
||||
if (res.success) {
|
||||
that.treeData = []
|
||||
const treeList = res.result.treeList
|
||||
for (let a = 0; a < treeList.length; a++) {
|
||||
const temp = treeList[a]
|
||||
temp.isLeaf = temp.leaf
|
||||
that.treeData.push(temp)
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
add () {
|
||||
// 初始化默认值
|
||||
this.edit({ status: '1', permsType: '1', sortNo: 1.0, route: true, menuType: 0 })
|
||||
},
|
||||
edit (record) {
|
||||
this.resetScreenSize() // 调用此方法,根据屏幕宽度自适应调整抽屉的宽度
|
||||
this.model = Object.assign({}, record)
|
||||
|
||||
// --------------------------------------------------------------------------------------------------
|
||||
// 根据菜单类型，动态展示页面字段
|
||||
console.log('record: ', record)
|
||||
this.show = (record.menuType + '') !== '2'
|
||||
this.menuLabel = (record.menuType + '') === '2' ? '按钮/权限' : '菜单名称'
|
||||
|
||||
this.visible = true
|
||||
this.loadTree()
|
||||
},
|
||||
close () {
|
||||
this.$emit('close')
|
||||
this.disableSubmit = false
|
||||
this.visible = false
|
||||
this.$refs.form.resetFields()
|
||||
},
|
||||
handleOk () {
|
||||
const that = this
|
||||
// 触发表单验证
|
||||
this.$refs.form.validate(valid => {
|
||||
if (valid) {
|
||||
if (((this.model.menuType + '') === '1' || (this.model.menuType + '') === '2') && !this.model.parentId) {
|
||||
that.validateStatus = 'error'
|
||||
that.$message.warning('请检查你填的类型以及信息是否正确！')
|
||||
return
|
||||
} else {
|
||||
that.validateStatus = 'success'
|
||||
}
|
||||
that.confirmLoading = true
|
||||
let obj
|
||||
if (!this.model.id) {
|
||||
obj = addPermission(this.model)
|
||||
} else {
|
||||
obj = editPermission(this.model)
|
||||
}
|
||||
obj.then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message)
|
||||
that.$emit('ok')
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
that.confirmLoading = false
|
||||
that.close()
|
||||
})
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
validateNumber (rule, value, callback) {
|
||||
if (!value || new RegExp(/^[0-9]*[1-9][0-9]*$/).test(value)) {
|
||||
callback()
|
||||
} else {
|
||||
callback(new Error('请输入正整数!'))
|
||||
}
|
||||
},
|
||||
validatePerms (rule, value, callback) {
|
||||
if (value && value.length > 0) {
|
||||
const confusionCode = getConfusionCode('sys_permission', 'perms')
|
||||
// 校验授权标识是否存在
|
||||
const params = {
|
||||
// tableName: 'sys_permission',
|
||||
// fieldName: 'perms',
|
||||
confusionCode,
|
||||
fieldVal: value,
|
||||
dataId: this.model.id
|
||||
}
|
||||
duplicateCheck(params).then((res) => {
|
||||
if (res.success) {
|
||||
callback()
|
||||
} else {
|
||||
callback(new Error('授权标识已存在!'))
|
||||
}
|
||||
})
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
onChangeMenuType (/* e */) {
|
||||
if ((this.model.menuType + '') === '2') {
|
||||
this.show = false
|
||||
this.menuLabel = '按钮/权限'
|
||||
} else {
|
||||
this.show = true
|
||||
this.menuLabel = '菜单名称'
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
this.$refs.form.validateField(['url', 'component'])
|
||||
})
|
||||
},
|
||||
selectIcons () {
|
||||
this.iconChooseVisible = true
|
||||
},
|
||||
handleIconCancel () {
|
||||
this.iconChooseVisible = false
|
||||
},
|
||||
handleIconChoose (value) {
|
||||
this.model.icon = value
|
||||
this.iconChooseVisible = false
|
||||
},
|
||||
// 根据屏幕变化,设置抽屉尺寸
|
||||
resetScreenSize () {
|
||||
const screenWidth = document.body.clientWidth
|
||||
if (screenWidth < 500) {
|
||||
this.drawerWidth = screenWidth
|
||||
} else {
|
||||
this.drawerWidth = 700
|
||||
}
|
||||
},
|
||||
handleParentIdChange (value) {
|
||||
if (!value) {
|
||||
this.validateStatus = 'error'
|
||||
} else {
|
||||
this.validateStatus = 'success'
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -1,166 +0,0 @@
|
||||
<!--用户管理-角色配置弹框-->
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="650"
|
||||
:closable="true"
|
||||
:visible="visible"
|
||||
switchFullscreen
|
||||
@cancel="handleCancel"
|
||||
>
|
||||
<div class='diolag-area'>
|
||||
<a-spin :spinning='spinLoading'>
|
||||
<a-form-model
|
||||
class='tag-module'
|
||||
ref='ruleForm'
|
||||
:model='form'
|
||||
:rules='rules'
|
||||
:label-col='labelCol'
|
||||
:wrapper-col='wrapperCol'
|
||||
>
|
||||
<a-row :gutter='24'>
|
||||
<a-col :span='24'>
|
||||
<a-form-item label="角色配置" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-select mode="multiple" placeholder="请选择角色" v-model="selectedRole">
|
||||
<a-select-option v-for="(role) in roleList" :key="role.id" :value="role.id">
|
||||
<span style="display: inline-block;width: 100%">
|
||||
{{ role.roleName }}
|
||||
</span>
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form-model>
|
||||
</a-spin>
|
||||
<div class='drawer-bootom-button'>
|
||||
<a-button style='margin-right: .8rem' @click='handleCancel'>取消</a-button>
|
||||
<a-button @click='handleSubmit' type='primary' :loading='confirmLoading'>提交</a-button>
|
||||
</div>
|
||||
</div>
|
||||
</j-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { postAction, getAction } from '@/api/manage'
|
||||
import Vue from 'vue'
|
||||
import { ACCESS_TOKEN } from '@/store/mutation-types'
|
||||
|
||||
export default {
|
||||
name: 'RoleAssignment',
|
||||
components: {},
|
||||
data () {
|
||||
return {
|
||||
token: Vue.ls.get(ACCESS_TOKEN),
|
||||
title: '角色配置',
|
||||
total: 0,
|
||||
selectedRowKeysDate: {},
|
||||
loading: false,
|
||||
editId: '',
|
||||
visible: false,
|
||||
selectedRole: undefined,
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 7 }
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 14 }
|
||||
},
|
||||
form: {},
|
||||
rules: {},
|
||||
areaTable: [],
|
||||
flag: false, // 表单提交标识
|
||||
spinLoading: false,
|
||||
confirmLoading: false,
|
||||
selectedRowKeys: [],
|
||||
roleList: [],
|
||||
defaultValue: undefined
|
||||
}
|
||||
},
|
||||
props: {
|
||||
selectedRowKeysArray: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
require: true
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.loadData()
|
||||
},
|
||||
methods: {
|
||||
loadData () {
|
||||
this.loading = true
|
||||
getAction(`sys/role/queryall`, {}).then(res => {
|
||||
if (res.success) {
|
||||
this.roleList = [...res.result]
|
||||
}
|
||||
}).finally(() => {
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
show () {
|
||||
this.visible = true
|
||||
},
|
||||
handleCancel () {
|
||||
this.visible = false
|
||||
this.$emit('rolevisible', false)
|
||||
},
|
||||
// 保存
|
||||
handleSubmit () {
|
||||
const param = { ids: this.selectedRowKeysArray.join(','), selectedroles: `${this.selectedRole.join(',')}` }
|
||||
postAction('/sys/user/setRole', param).then((res) => {
|
||||
this.visible = false
|
||||
if (res.success) {
|
||||
this.$emit('ok', false)
|
||||
this.$message.success(res.message)
|
||||
this.selectedRole = []
|
||||
} else {
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang='less' scoped>
|
||||
@import '~@assets/less/common.less';
|
||||
|
||||
.diolag-area {
|
||||
.table-area {
|
||||
margin: 20px 0;
|
||||
|
||||
.action-edit {
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.table-del {
|
||||
color: red;
|
||||
}
|
||||
}
|
||||
.drawer-bootom-button{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
::v-deep .page{
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
</style>
|
||||
<style lang='less'>
|
||||
.area-module {
|
||||
.ant-modal-wrap {
|
||||
.ant-modal {
|
||||
.ant-modal-content {
|
||||
.ant-modal-footer {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -1,120 +0,0 @@
|
||||
<template>
|
||||
<a-drawer
|
||||
title="数据规则/按钮权限配置"
|
||||
width="365"
|
||||
:closable="false"
|
||||
@close="onClose"
|
||||
:visible="visible"
|
||||
>
|
||||
|
||||
<a-tabs defaultActiveKey="1">
|
||||
<a-tab-pane tab="数据规则" key="1">
|
||||
|
||||
<a-checkbox-group v-model="dataruleChecked" v-if="dataruleList.length>0">
|
||||
<a-row>
|
||||
<a-col :span="24" v-for="(item,index) in dataruleList" :key=" 'dr'+index ">
|
||||
<a-checkbox :value="item.id">{{ item.ruleName }}</a-checkbox>
|
||||
</a-col>
|
||||
|
||||
<a-col :span="24">
|
||||
<div style="width: 100%;margin-top: 15px">
|
||||
<a-button @click="saveDataruleForRole" type="primary" size="small" icon="save">点击保存</a-button>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-checkbox-group>
|
||||
<div v-else><h3>无配置信息!</h3></div>
|
||||
|
||||
</a-tab-pane>
|
||||
<!--<a-tab-pane tab="按钮权限" key="2">敬请期待!!!</a-tab-pane>-->
|
||||
</a-tabs>
|
||||
|
||||
</a-drawer>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ARow from 'ant-design-vue/es/grid/Row'
|
||||
import ACol from 'ant-design-vue/es/grid/Col'
|
||||
import { getAction, postAction } from '@/api/manage'
|
||||
|
||||
export default {
|
||||
name: 'RoleDataruleModal',
|
||||
components: { ACol, ARow },
|
||||
data () {
|
||||
return {
|
||||
functionId: '',
|
||||
roleId: '',
|
||||
visible: false,
|
||||
tabList: [{
|
||||
key: '1',
|
||||
tab: '数据规则'
|
||||
}, {
|
||||
key: '2',
|
||||
tab: '按钮权限'
|
||||
}],
|
||||
activeTabKey: '1',
|
||||
url: {
|
||||
datarule: '/sys/role/datarule'
|
||||
},
|
||||
dataruleList: [],
|
||||
dataruleChecked: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
loadData () {
|
||||
getAction(`${this.url.datarule}/${this.functionId}/${this.roleId}`).then(res => {
|
||||
console.log(res)
|
||||
if (res.success) {
|
||||
this.dataruleList = res.result.datarule
|
||||
const drChecked = res.result.drChecked
|
||||
if (drChecked) {
|
||||
this.dataruleChecked = drChecked.split(',')
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
saveDataruleForRole () {
|
||||
if (!this.dataruleChecked || this.dataruleChecked.length === 0) {
|
||||
this.$message.warning('请注意，现未勾选任何数据权限!')
|
||||
}
|
||||
const params = {
|
||||
permissionId: this.functionId,
|
||||
roleId: this.roleId,
|
||||
dataRuleIds: this.dataruleChecked.join(',')
|
||||
}
|
||||
console.log('保存数据权限', params)
|
||||
postAction(this.url.datarule, params).then(res => {
|
||||
if (res.success) {
|
||||
this.$message.success(res.message)
|
||||
} else {
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
show (functionId, roleId) {
|
||||
this.onReset()
|
||||
this.functionId = functionId
|
||||
this.roleId = roleId
|
||||
this.visible = true
|
||||
this.loadData()
|
||||
},
|
||||
onClose () {
|
||||
this.visible = false
|
||||
this.onReset()
|
||||
},
|
||||
onTabChange (key) {
|
||||
this.activeTabKey = key
|
||||
},
|
||||
onReset () {
|
||||
this.functionId = ''
|
||||
this.roleId = ''
|
||||
this.dataruleList = []
|
||||
this.dataruleChecked = []
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -1,161 +0,0 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="800"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
:cancelText="$t('close')"
|
||||
switchFullscreen
|
||||
wrapClassName="ant-modal-cust-warp"
|
||||
style="top:5%;overflow-y: hidden">
|
||||
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form-model ref="form" v-bind="layout" :model="model" :rules="validatorRules">
|
||||
<a-form-model-item :label="$t('roleManage.roleCode')" required prop="roleCode">
|
||||
<a-input v-model="model.roleCode" :disabled="roleDisabled" :placeholder="$t('pleaseEnter') + $t('roleManage.roleCode')" />
|
||||
</a-form-model-item>
|
||||
<a-form-model-item :label="$t('roleManage.roleName')" required prop="roleName">
|
||||
<a-input v-model="model.roleName" :placeholder="$t('pleaseEnter') + $t('roleManage.roleName')" />
|
||||
</a-form-model-item>
|
||||
<a-form-model-item :label="$t('roleManage.roleDescribe')" prop="description">
|
||||
<a-textarea :rows="5" v-model="model.description" :placeholder="$t('pleaseEnter') + $t('roleManage.roleDescribe')" />
|
||||
</a-form-model-item>
|
||||
</a-form-model>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { addRole, editRole, duplicateCheck } from '@/api/api'
|
||||
import { getConfusionCode } from '@/utils/util'
|
||||
|
||||
export default {
|
||||
name: 'RoleModal',
|
||||
data () {
|
||||
return {
|
||||
title: '操作',
|
||||
visible: false,
|
||||
roleDisabled: false,
|
||||
model: {},
|
||||
layout: {
|
||||
labelCol: { span: 3 },
|
||||
wrapperCol: { span: 14 }
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules: {
|
||||
roleName: [
|
||||
{ required: true, validator: this.validateRoleName },
|
||||
{ min: 2, max: 30, message: this.$t('roleManage.lengthIsTwoToThirty'), trigger: 'blur' }
|
||||
],
|
||||
roleCode: [
|
||||
{ required: true, message: this.$t('pleaseEnter') + this.$t('roleManage.roleCode') + '!' },
|
||||
{ min: 0, max: 64, message: this.$t('roleManage.notExceed') + ' 64 ' + this.$t('roleManage.charLength'), trigger: 'blur' },
|
||||
{ validator: this.validateRoleCode }
|
||||
],
|
||||
description: [
|
||||
{ min: 0, max: 126, message: this.$t('roleManage.notExceed') + ' 126 ' + this.$t('roleManage.charLength'), trigger: 'blur' }
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
// 备份model原始值
|
||||
this.modelDefault = JSON.parse(JSON.stringify(this.model))
|
||||
},
|
||||
methods: {
|
||||
add () {
|
||||
this.edit(this.modelDefault)
|
||||
},
|
||||
edit (record) {
|
||||
this.model = Object.assign({}, record)
|
||||
this.visible = true
|
||||
// 编辑页面禁止修改角色编码
|
||||
this.roleDisabled = !!this.model.id
|
||||
},
|
||||
close () {
|
||||
this.$refs.form.clearValidate()
|
||||
this.$emit('close')
|
||||
this.visible = false
|
||||
},
|
||||
handleOk () {
|
||||
const that = this
|
||||
// 触发表单验证
|
||||
this.$refs.form.validate(valid => {
|
||||
if (valid) {
|
||||
that.confirmLoading = true
|
||||
let obj
|
||||
if (!this.model.id) {
|
||||
obj = addRole(this.model)
|
||||
} else {
|
||||
obj = editRole(this.model)
|
||||
}
|
||||
obj.then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message)
|
||||
that.$emit('ok')
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
that.confirmLoading = false
|
||||
that.close()
|
||||
})
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
validateRoleCode (rule, value, callback) {
|
||||
if (/[\u4E00-\u9FA5]/g.test(value)) {
|
||||
callback(new Error(this.$t('roleManage.roleCodeNotChinese')))
|
||||
} else {
|
||||
const confusionCode = getConfusionCode('sys_role', 'role_code')
|
||||
const params = {
|
||||
// tableName: 'sys_role',
|
||||
// fieldName: 'role_code',
|
||||
confusionCode,
|
||||
fieldVal: value,
|
||||
dataId: this.model.id
|
||||
}
|
||||
duplicateCheck(params).then((res) => {
|
||||
if (res.success) {
|
||||
callback()
|
||||
} else {
|
||||
callback(res.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
validateRoleName (rule, value, callback) {
|
||||
if (!value) {
|
||||
callback(new Error(this.$t('pleaseEnter') + this.$t('roleManage.roleName') + '!'))
|
||||
} else {
|
||||
const confusionCode = getConfusionCode('sys_role', 'role_name')
|
||||
const params = {
|
||||
// tableName: 'sys_role',
|
||||
// fieldName: 'role_name',
|
||||
confusionCode,
|
||||
fieldVal: value,
|
||||
dataId: this.model.id
|
||||
}
|
||||
duplicateCheck(params).then((res) => {
|
||||
if (res.success) {
|
||||
callback()
|
||||
} else {
|
||||
callback(res.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -1,290 +0,0 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="1200"
|
||||
:visible="visible"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
cancelText="关闭">
|
||||
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form layout="inline">
|
||||
<a-row :gutter="24">
|
||||
|
||||
<a-col :span="6">
|
||||
<a-form-item label="账号">
|
||||
<a-input placeholder="请输入账号" v-model="queryParam.username"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :span="6">
|
||||
<a-form-item label="性别">
|
||||
<a-select v-model="queryParam.sex" placeholder="请选择性别">
|
||||
<a-select-option value="">请选择性别查询</a-select-option>
|
||||
<a-select-option value="1">男性</a-select-option>
|
||||
<a-select-option value="2">女性</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<template v-if="toggleSearchStatus">
|
||||
<a-col :span="6">
|
||||
<a-form-item label="邮箱">
|
||||
<a-input placeholder="请输入邮箱" v-model="queryParam.email"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :span="6">
|
||||
<a-form-item label="手机号码">
|
||||
<a-input placeholder="请输入手机号码" v-model="queryParam.phone"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :span="6">
|
||||
<a-form-item label="状态">
|
||||
<a-select v-model="queryParam.status" placeholder="请选择状态">
|
||||
<a-select-option value="">请选择状态</a-select-option>
|
||||
<a-select-option value="1">正常</a-select-option>
|
||||
<a-select-option value="2">解冻</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</template>
|
||||
|
||||
<a-col :span="6" >
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-button type="primary" @click="searchByquery" icon="search">查询</a-button>
|
||||
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
|
||||
<a @click="handleToggleSearch" style="margin-left: 8px">
|
||||
{{ toggleSearchStatus ? '收起' : '展开' }}
|
||||
<a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
|
||||
</a>
|
||||
</span>
|
||||
</a-col>
|
||||
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- update-begin author:kangxiaolin date:20190921 for:系统发送通知 用户多选失败 #513 -->
|
||||
<a-table
|
||||
ref="table"
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange,onSelect:onSelect}"
|
||||
@change="handleTableChange"
|
||||
>
|
||||
<!-- update-end author:kangxiaolin date:20190921 for:系统发送通知 用户多选失败 #513 -->
|
||||
</a-table>
|
||||
</j-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { filterObj } from '@/utils/util'
|
||||
|
||||
import { getUserList } from '@/api/api'
|
||||
|
||||
export default {
|
||||
name: 'SelectUserListModal',
|
||||
components: {
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title: '选择用户',
|
||||
queryParam: {},
|
||||
columns: [{
|
||||
title: '用户账号',
|
||||
align: 'center',
|
||||
dataIndex: 'username',
|
||||
fixed: 'left',
|
||||
width: 200
|
||||
}, {
|
||||
title: '用户名称',
|
||||
align: 'center',
|
||||
dataIndex: 'realname'
|
||||
}, {
|
||||
title: '性别',
|
||||
align: 'center',
|
||||
dataIndex: 'sex',
|
||||
customRender: function (text) {
|
||||
if ((text + '') === '1') {
|
||||
return '男'
|
||||
} else if ((text + '') === '2') {
|
||||
return '女'
|
||||
} else {
|
||||
return text
|
||||
}
|
||||
}
|
||||
}, {
|
||||
title: '手机号码',
|
||||
align: 'center',
|
||||
dataIndex: 'phone'
|
||||
}, {
|
||||
title: '邮箱',
|
||||
align: 'center',
|
||||
dataIndex: 'email'
|
||||
}, {
|
||||
title: '状态',
|
||||
align: 'center',
|
||||
dataIndex: 'status',
|
||||
customRender: function (text) {
|
||||
if ((text + '') === '1') {
|
||||
return '正常'
|
||||
} else if ((text + '') === '2') {
|
||||
return '冻结'
|
||||
} else {
|
||||
return text
|
||||
}
|
||||
}
|
||||
}],
|
||||
dataSource: [],
|
||||
ipagination: {
|
||||
current: 1,
|
||||
pageSize: 5,
|
||||
pageSizeOptions: ['5', '10', '20'],
|
||||
showTotal: (total, range) => {
|
||||
return range[0] + '-' + range[1] + ' 共' + total + '条'
|
||||
},
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
total: 0
|
||||
},
|
||||
isorter: {
|
||||
column: 'createTime',
|
||||
order: 'desc'
|
||||
},
|
||||
selectedRowKeys: [],
|
||||
selectionRows: [],
|
||||
visible: false,
|
||||
toggleSearchStatus: false
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.loadData()
|
||||
},
|
||||
methods: {
|
||||
add (selectUser, userIds) {
|
||||
this.visible = true
|
||||
this.edit(selectUser, userIds)
|
||||
},
|
||||
edit (selectUser, userIds) {
|
||||
// 控制台报错
|
||||
if (userIds && userIds.length > 0) {
|
||||
this.selectedRowKeys = userIds.split(',')
|
||||
} else {
|
||||
this.selectedRowKeys = []
|
||||
}
|
||||
if (!selectUser) {
|
||||
this.selectionRows = []
|
||||
} else {
|
||||
const that = this
|
||||
that.selectionRows = []
|
||||
selectUser.forEach(function (record, index) {
|
||||
console.log(record)
|
||||
that.selectionRows.push({ id: that.selectedRowKeys[index], realname: record.label })
|
||||
})
|
||||
// this.selectionRows = selectUser;
|
||||
}
|
||||
},
|
||||
loadData (arg) {
|
||||
if (arg === 1) {
|
||||
this.ipagination.current = 1
|
||||
}
|
||||
const params = this.getQueryParams()// 查询条件
|
||||
getUserList(params).then((res) => {
|
||||
if (res.success) {
|
||||
this.dataSource = res.result.records
|
||||
this.ipagination.total = res.result.total
|
||||
}
|
||||
})
|
||||
},
|
||||
getQueryParams () {
|
||||
const param = Object.assign({}, this.queryParam, this.isorter)
|
||||
param.field = this.getQueryField()
|
||||
// --update-begin----author:scott---date:20190818------for:新建公告时指定特定用户翻页错误SelectUserListModal #379----
|
||||
// param.current = this.ipagination.current;
|
||||
// param.pageSize = this.ipagination.pageSize;
|
||||
param.pageNo = this.ipagination.current
|
||||
param.pageSize = this.ipagination.pageSize
|
||||
// --update-end----author:scott---date:20190818------for:新建公告时指定特定用户翻页错误SelectUserListModal #379---
|
||||
return filterObj(param)
|
||||
},
|
||||
getQueryField () {
|
||||
let str = 'id,'
|
||||
for (let a = 0; a < this.columns.length; a++) {
|
||||
str += ',' + this.columns[a].dataIndex
|
||||
}
|
||||
return str
|
||||
},
|
||||
// --update-begin----author:kangxiaolin---date:20190921------for:系统发送通知 用户多选失败 #513----
|
||||
onSelectChange (selectedRowKeys) {
|
||||
this.selectedRowKeys = selectedRowKeys
|
||||
},
|
||||
onSelect (record, selected) {
|
||||
if (selected === true) {
|
||||
this.selectionRows.push(record)
|
||||
} else {
|
||||
this.selectionRows.forEach(function (item, index, arr) {
|
||||
if (item.id === record.id) {
|
||||
arr.splice(index, 1)
|
||||
}
|
||||
})
|
||||
}
|
||||
// --update-end----author:kangxiaolin---date:20190921------for:系统发送通知 用户多选失败 #513----
|
||||
},
|
||||
|
||||
searchReset () {
|
||||
const that = this
|
||||
Object.keys(that.queryParam).forEach(function (key) {
|
||||
that.queryParam[key] = ''
|
||||
})
|
||||
that.loadData(1)
|
||||
},
|
||||
handleTableChange (pagination, filters, sorter) {
|
||||
// TODO 筛选
|
||||
if (Object.keys(sorter).length > 0) {
|
||||
this.isorter.column = sorter.field
|
||||
this.isorter.order = sorter.order === 'ascend' ? 'asc' : 'desc'
|
||||
}
|
||||
this.ipagination = pagination
|
||||
this.loadData()
|
||||
},
|
||||
handleCancel () {
|
||||
this.selectionRows = []
|
||||
this.selectedRowKeys = []
|
||||
this.visible = false
|
||||
},
|
||||
handleOk () {
|
||||
this.$emit('choseUser', this.selectionRows)
|
||||
this.handleCancel()
|
||||
},
|
||||
searchByquery () {
|
||||
this.loadData(1)
|
||||
},
|
||||
handleToggleSearch () {
|
||||
this.toggleSearchStatus = !this.toggleSearchStatus
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.ant-card-body .table-operator{
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
.ant-table-tbody .ant-table-row td{
|
||||
padding-top:15px;
|
||||
padding-bottom:15px;
|
||||
}
|
||||
.anty-row-operator button{margin: 0 5px}
|
||||
.ant-btn-danger{background-color: #ffffff}
|
||||
|
||||
.ant-modal-cust-warp{height: 100%}
|
||||
.ant-modal-cust-warp .ant-modal-body{height:calc(100% - 110px) !important;overflow-y: auto}
|
||||
.ant-modal-cust-warp .ant-modal-content{height:90% !important;overflow-y: hidden}
|
||||
|
||||
.anty-img-wrap{height:25px;position: relative;}
|
||||
.anty-img-wrap > img{max-height:100%;}
|
||||
</style>
|
||||
@@ -1,294 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<j-modal
|
||||
centered
|
||||
:title="title"
|
||||
:width="1000"
|
||||
:visible="visible"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
cancelText="关闭">
|
||||
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
|
||||
<a-col :span="8">
|
||||
<a-form-item label="用户账号">
|
||||
<j-input placeholder="请输入用户账号" v-model="queryParam.username"></j-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="8">
|
||||
<a-form-item label="用户名称">
|
||||
<j-input placeholder="请输入用户名称" v-model="queryParam.realname"></j-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="8">
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
|
||||
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
|
||||
</span>
|
||||
</a-col>
|
||||
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<a-table
|
||||
size="small"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns1"
|
||||
:dataSource="dataSource1"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:scroll="{ y: 240 }"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys,onSelectAll:onSelectAll,onSelect:onSelect,onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
|
||||
</j-modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { filterObj } from '@/utils/util'
|
||||
import { getAction } from '@/api/manage'
|
||||
|
||||
export default {
|
||||
name: 'SelectUserModal',
|
||||
data () {
|
||||
return {
|
||||
title: '添加已有用户',
|
||||
names: [],
|
||||
visible: false,
|
||||
placement: 'right',
|
||||
description: '',
|
||||
// 查询条件
|
||||
queryParam: {},
|
||||
// 表头
|
||||
columns1: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key: 'rowIndex',
|
||||
width: 50,
|
||||
align: 'center',
|
||||
customRender: function (t, r, index) {
|
||||
return parseInt(index) + 1
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '用户账号',
|
||||
align: 'center',
|
||||
width: 100,
|
||||
dataIndex: 'username'
|
||||
},
|
||||
{
|
||||
title: '用户名称',
|
||||
align: 'center',
|
||||
width: 100,
|
||||
dataIndex: 'realname'
|
||||
},
|
||||
{
|
||||
title: '性别',
|
||||
align: 'center',
|
||||
width: 100,
|
||||
dataIndex: 'sex_dictText'
|
||||
},
|
||||
{
|
||||
title: '电话',
|
||||
align: 'center',
|
||||
width: 100,
|
||||
dataIndex: 'phone'
|
||||
},
|
||||
{
|
||||
title: '部门',
|
||||
align: 'center',
|
||||
width: 150,
|
||||
dataIndex: 'orgCodeTxt'
|
||||
}
|
||||
],
|
||||
columns2: [
|
||||
{
|
||||
title: '用户账号',
|
||||
align: 'center',
|
||||
dataIndex: 'username'
|
||||
|
||||
},
|
||||
{
|
||||
title: '用户名称',
|
||||
align: 'center',
|
||||
dataIndex: 'realname'
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align: 'center',
|
||||
width: 100,
|
||||
scopedSlots: { customRender: 'action' }
|
||||
}
|
||||
],
|
||||
// 数据集
|
||||
dataSource1: [],
|
||||
dataSource2: [],
|
||||
// 分页参数
|
||||
ipagination: {
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
pageSizeOptions: ['10', '20', '30'],
|
||||
showTotal: (total, range) => {
|
||||
return range[0] + '-' + range[1] + ' 共' + total + '条'
|
||||
},
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
total: 0
|
||||
},
|
||||
isorter: {
|
||||
column: 'createTime',
|
||||
order: 'desc'
|
||||
},
|
||||
loading: false,
|
||||
selectedRowKeys: [],
|
||||
selectedRows: [],
|
||||
url: {
|
||||
list: '/sys/user/page'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.loadData()
|
||||
},
|
||||
methods: {
|
||||
searchQuery () {
|
||||
this.loadData(1)
|
||||
},
|
||||
searchReset () {
|
||||
this.queryParam = {}
|
||||
this.loadData(1)
|
||||
},
|
||||
handleCancel () {
|
||||
this.visible = false
|
||||
this.onClearSelected()
|
||||
},
|
||||
handleOk () {
|
||||
this.dataSource2 = this.selectedRowKeys
|
||||
console.log('data:' + this.dataSource2)
|
||||
this.$emit('selectFinished', this.dataSource2)
|
||||
this.visible = false
|
||||
},
|
||||
add () {
|
||||
this.visible = true
|
||||
},
|
||||
loadData (arg) {
|
||||
// 加载数据 若传入参数1则加载第一页的内容
|
||||
if (arg === 1) {
|
||||
this.ipagination.current = 1
|
||||
}
|
||||
const params = this.getQueryParams()// 查询条件
|
||||
this.loading = true
|
||||
getAction(this.url.list, params).then((res) => {
|
||||
if (res.success) {
|
||||
this.dataSource1 = res.result.records
|
||||
this.ipagination.total = res.result.total
|
||||
}
|
||||
}).finally(() => {
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
getQueryParams () {
|
||||
const param = Object.assign({}, this.queryParam, this.isorter)
|
||||
param.field = this.getQueryField()
|
||||
param.pageNo = this.ipagination.current
|
||||
param.pageSize = this.ipagination.pageSize
|
||||
return filterObj(param)
|
||||
},
|
||||
getQueryField () {
|
||||
// TODO 字段权限控制
|
||||
},
|
||||
onSelectAll (selected, selectedRows, changeRows) {
|
||||
if (selected === true) {
|
||||
for (let a = 0; a < changeRows.length; a++) {
|
||||
this.dataSource2.push(changeRows[a])
|
||||
}
|
||||
} else {
|
||||
for (let b = 0; b < changeRows.length; b++) {
|
||||
this.dataSource2.splice(this.dataSource2.indexOf(changeRows[b]), 1)
|
||||
}
|
||||
}
|
||||
// console.log(selected, selectedRows, changeRows);
|
||||
},
|
||||
onSelect (record, selected) {
|
||||
if (selected === true) {
|
||||
this.dataSource2.push(record)
|
||||
} else {
|
||||
const index = this.dataSource2.indexOf(record)
|
||||
// console.log();
|
||||
if (index >= 0) {
|
||||
this.dataSource2.splice(this.dataSource2.indexOf(record), 1)
|
||||
}
|
||||
}
|
||||
},
|
||||
onSelectChange (selectedRowKeys, selectedRows) {
|
||||
this.selectedRowKeys = selectedRowKeys
|
||||
this.selectionRows = selectedRows
|
||||
},
|
||||
onClearSelected () {
|
||||
this.selectedRowKeys = []
|
||||
this.selectionRows = []
|
||||
},
|
||||
handleDelete: function (record) {
|
||||
this.dataSource2.splice(this.dataSource2.indexOf(record), 1)
|
||||
},
|
||||
handleTableChange (pagination, filters, sorter) {
|
||||
// 分页、排序、筛选变化时触发
|
||||
console.log(sorter)
|
||||
// TODO 筛选
|
||||
if (Object.keys(sorter).length > 0) {
|
||||
this.isorter.column = sorter.field
|
||||
this.isorter.order = sorter.order === 'ascend' ? 'asc' : 'desc'
|
||||
}
|
||||
this.ipagination = pagination
|
||||
this.loadData()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.ant-card-body .table-operator {
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
.ant-table-tbody .ant-table-row td {
|
||||
padding-top: 15px;
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
|
||||
.anty-row-operator button {
|
||||
margin: 0 5px
|
||||
}
|
||||
|
||||
.ant-btn-danger {
|
||||
background-color: #ffffff
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp {
|
||||
height: 100%
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp .ant-modal-body {
|
||||
height: calc(100% - 110px) !important;
|
||||
overflow-y: auto
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp .ant-modal-content {
|
||||
height: 90% !important;
|
||||
overflow-y: hidden
|
||||
}
|
||||
</style>
|
||||
@@ -1,157 +0,0 @@
|
||||
<!--<template>-->
|
||||
<!-- <a-modal-->
|
||||
<!-- :title="title"-->
|
||||
<!-- :width="800"-->
|
||||
<!-- :visible="visible"-->
|
||||
<!-- :confirmLoading="confirmLoading"-->
|
||||
<!-- @ok="handleOk"-->
|
||||
<!-- @cancel="handleCancel"-->
|
||||
<!-- cancelText="关闭">-->
|
||||
|
||||
<!-- <a-spin :spinning="confirmLoading">-->
|
||||
<!-- <a-form-model ref="form" :model="model" :rules="validatorRules">-->
|
||||
|
||||
<!-- <a-form-model-item-->
|
||||
<!-- :labelCol="labelCol"-->
|
||||
<!-- :wrapperCol="wrapperCol"-->
|
||||
<!-- prop="roleName"-->
|
||||
<!-- label="部门角色名称">-->
|
||||
<!-- <a-input placeholder="请输入部门角色名称" v-model="model.roleName"/>-->
|
||||
<!-- </a-form-model-item>-->
|
||||
<!-- <a-form-model-item-->
|
||||
<!-- :labelCol="labelCol"-->
|
||||
<!-- :wrapperCol="wrapperCol"-->
|
||||
<!-- prop="roleCode"-->
|
||||
<!-- label="部门角色编码">-->
|
||||
<!-- <a-input placeholder="请输入部门角色编码" v-model="model.roleCode"/>-->
|
||||
<!-- </a-form-model-item>-->
|
||||
<!-- <a-form-model-item-->
|
||||
<!-- :labelCol="labelCol"-->
|
||||
<!-- :wrapperCol="wrapperCol"-->
|
||||
<!-- prop="description"-->
|
||||
<!-- label="描述">-->
|
||||
<!-- <a-input placeholder="请输入描述" v-model="model.description"/>-->
|
||||
<!-- </a-form-model-item>-->
|
||||
|
||||
<!-- </a-form-model>-->
|
||||
<!-- </a-spin>-->
|
||||
<!-- </a-modal>-->
|
||||
<!--</template>-->
|
||||
|
||||
<!--<script>-->
|
||||
<!-- import { httpAction } from '@/api/manage'-->
|
||||
<!-- import {duplicateCheck } from '@/api/api'-->
|
||||
|
||||
<!-- export default {-->
|
||||
<!-- name: "SysDepartRoleModal",-->
|
||||
<!-- data () {-->
|
||||
<!-- return {-->
|
||||
<!-- title:"操作",-->
|
||||
<!-- visible: false,-->
|
||||
<!-- model: {},-->
|
||||
<!-- labelCol: {-->
|
||||
<!-- xs: { span: 24 },-->
|
||||
<!-- sm: { span: 5 },-->
|
||||
<!-- },-->
|
||||
<!-- wrapperCol: {-->
|
||||
<!-- xs: { span: 24 },-->
|
||||
<!-- sm: { span: 16 },-->
|
||||
<!-- },-->
|
||||
<!-- confirmLoading: false,-->
|
||||
<!-- validatorRules:{-->
|
||||
<!-- roleName:[-->
|
||||
<!-- { required: true, message: '请输入部门角色名称!' },-->
|
||||
<!-- { min: 2, max: 30, message: '长度在 2 到 30 个字符', trigger: 'blur' }-->
|
||||
<!-- ],-->
|
||||
<!-- roleCode: [-->
|
||||
<!-- { required: true, message: '请输入部门角色编码!'},-->
|
||||
<!-- { min: 0, max: 64, message: '长度不超过 64 个字符', trigger: 'blur' },-->
|
||||
<!-- { validator: this.validateRoleCode}-->
|
||||
<!-- ],-->
|
||||
<!-- description: [-->
|
||||
<!-- { min: 0, max: 126, message: '长度不超过 126 个字符', trigger: 'blur' }-->
|
||||
<!-- ]-->
|
||||
<!-- },-->
|
||||
<!-- url: {-->
|
||||
<!-- add: "/sys/sysDepartRole/add",-->
|
||||
<!-- edit: "/sys/sysDepartRole/edit",-->
|
||||
<!-- },-->
|
||||
<!-- }-->
|
||||
<!-- },-->
|
||||
<!-- created () {-->
|
||||
<!-- },-->
|
||||
<!-- methods: {-->
|
||||
<!-- add (departId) {-->
|
||||
<!-- this.edit({},departId);-->
|
||||
<!-- },-->
|
||||
<!-- edit (record,departId) {-->
|
||||
<!-- this.departId = departId;-->
|
||||
<!-- this.model = Object.assign({}, record);-->
|
||||
<!-- this.visible = true;-->
|
||||
<!-- },-->
|
||||
<!-- close () {-->
|
||||
<!-- this.$emit('close');-->
|
||||
<!-- this.visible = false;-->
|
||||
<!-- this.$refs.form.resetFields()-->
|
||||
<!-- },-->
|
||||
<!-- handleOk () {-->
|
||||
<!-- const that = this;-->
|
||||
<!-- // 触发表单验证-->
|
||||
<!-- this.$refs.form.validate(valid => {-->
|
||||
<!-- if (valid) {-->
|
||||
<!-- that.confirmLoading = true;-->
|
||||
<!-- let httpurl = '';-->
|
||||
<!-- let method = '';-->
|
||||
<!-- if(!this.model.id){-->
|
||||
<!-- httpurl+=this.url.add;-->
|
||||
<!-- method = 'post';-->
|
||||
<!-- }else{-->
|
||||
<!-- httpurl+=this.url.edit;-->
|
||||
<!-- method = 'put';-->
|
||||
<!-- }-->
|
||||
<!-- this.model.departId = this.departId;-->
|
||||
<!-- httpAction(httpurl,this.model,method).then((res)=>{-->
|
||||
<!-- if(res.success){-->
|
||||
<!-- that.$message.success(res.message);-->
|
||||
<!-- that.$emit('ok');-->
|
||||
<!-- }else{-->
|
||||
<!-- that.$message.warning(res.message);-->
|
||||
<!-- }-->
|
||||
<!-- }).finally(() => {-->
|
||||
<!-- that.confirmLoading = false;-->
|
||||
<!-- that.close();-->
|
||||
<!-- })-->
|
||||
<!-- }else{-->
|
||||
<!-- return false;-->
|
||||
<!-- }-->
|
||||
<!-- })-->
|
||||
<!-- },-->
|
||||
<!-- handleCancel () {-->
|
||||
<!-- this.close()-->
|
||||
<!-- },-->
|
||||
<!-- validateRoleCode(rule, value, callback){-->
|
||||
<!-- if(/[\u4E00-\u9FA5]/g.test(value)){-->
|
||||
<!-- callback("部门角色编码不可输入汉字!");-->
|
||||
<!-- }else{-->
|
||||
<!-- var params = {-->
|
||||
<!-- tableName: "sys_depart_role",-->
|
||||
<!-- fieldName: "role_code",-->
|
||||
<!-- fieldVal: value,-->
|
||||
<!-- dataId: this.model.id,-->
|
||||
<!-- };-->
|
||||
<!-- duplicateCheck(params).then((res)=>{-->
|
||||
<!-- if(res.success){-->
|
||||
<!-- callback();-->
|
||||
<!-- }else{-->
|
||||
<!-- callback(res.message);-->
|
||||
<!-- }-->
|
||||
<!-- });-->
|
||||
<!-- }-->
|
||||
<!-- }-->
|
||||
<!-- }-->
|
||||
<!-- }-->
|
||||
<!--</script>-->
|
||||
|
||||
<!--<style lang="less" scoped>-->
|
||||
|
||||
<!--</style>-->
|
||||
@@ -1,172 +0,0 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="800"
|
||||
:visible="visible"
|
||||
:maskClosable="false"
|
||||
:confirmLoading="confirmLoading"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
cancelText="关闭">
|
||||
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form-model ref="form" :model="model" :rules="validatorRules">
|
||||
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
prop="code"
|
||||
required
|
||||
label="职务编码">
|
||||
<a-input placeholder="请输入职务编码" v-model="model.code" :read-only="readOnly"/>
|
||||
</a-form-model-item>
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
prop="name"
|
||||
required
|
||||
label="职务名称">
|
||||
<a-input placeholder="请输入职务名称" v-model="model.name"/>
|
||||
</a-form-model-item>
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
prop="postRank"
|
||||
required
|
||||
label="职级"
|
||||
>
|
||||
<j-dict-select-tag
|
||||
placeholder="请选择职级"
|
||||
dictCode="position_rank"
|
||||
v-model="model.postRank"
|
||||
/>
|
||||
</a-form-model-item>
|
||||
|
||||
</a-form-model>
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { httpAction } from '@/api/manage'
|
||||
import { duplicateCheck } from '@/api/api'
|
||||
import JDictSelectTag from '@/components/dict/JDictSelectTag'
|
||||
import { getConfusionCode } from '@/utils/util'
|
||||
|
||||
let validatorCodeTimer = null
|
||||
|
||||
export default {
|
||||
name: 'SysPositionModal',
|
||||
components: { JDictSelectTag },
|
||||
data () {
|
||||
return {
|
||||
title: '操作',
|
||||
visible: false,
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 }
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 }
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules: {
|
||||
code: [
|
||||
{ required: true, message: '请输入职务编码' },
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
// 函数消抖的简单实现，防止一段时间内重复发送请求
|
||||
if (validatorCodeTimer) {
|
||||
// 停止上次开启的定时器
|
||||
clearTimeout(validatorCodeTimer)
|
||||
}
|
||||
validatorCodeTimer = setTimeout(() => {
|
||||
const confusionCode = getConfusionCode('sys_position', 'code')
|
||||
duplicateCheck({
|
||||
// tableName: 'sys_position',
|
||||
// fieldName: 'code',
|
||||
confusionCode,
|
||||
fieldVal: value,
|
||||
dataId: this.model.id
|
||||
}).then((res) => {
|
||||
if (res.success) {
|
||||
callback()
|
||||
} else {
|
||||
callback(res.message)
|
||||
}
|
||||
}).catch(console.error)
|
||||
}, 300)
|
||||
}
|
||||
}
|
||||
],
|
||||
name: [{ required: true, message: '请输入职务名称' }],
|
||||
postRank: [{ required: true, message: '请选择职级' }]
|
||||
},
|
||||
url: {
|
||||
add: '/sys/position/add',
|
||||
edit: '/sys/position/edit'
|
||||
},
|
||||
readOnly: false
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
add () {
|
||||
this.edit({})
|
||||
},
|
||||
edit (record) {
|
||||
this.model = Object.assign({}, record)
|
||||
this.visible = true
|
||||
this.readOnly = !!record.id
|
||||
},
|
||||
close () {
|
||||
this.$emit('close')
|
||||
this.visible = false
|
||||
this.$refs.form.resetFields()
|
||||
},
|
||||
handleOk () {
|
||||
const that = this
|
||||
// 触发表单验证
|
||||
this.$refs.form.validate(valid => {
|
||||
if (valid) {
|
||||
that.confirmLoading = true
|
||||
let httpurl = ''
|
||||
const method = 'post'
|
||||
if (!this.model.id) {
|
||||
httpurl += this.url.add
|
||||
// method = 'post'
|
||||
} else {
|
||||
httpurl += this.url.edit
|
||||
// method = 'put'
|
||||
}
|
||||
|
||||
httpAction(httpurl, this.model, method).then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message)
|
||||
that.$emit('ok')
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
that.confirmLoading = false
|
||||
that.close()
|
||||
})
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
|
||||
</style>
|
||||
@@ -1,178 +0,0 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="800"
|
||||
:visible="visible"
|
||||
:confirmLoading="confirmLoading"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
cancelText="关闭">
|
||||
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="用户名">
|
||||
<a-input placeholder="请输入用户名" v-decorator="['userName', {}]" readOnly/>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="代理人用户名">
|
||||
<j-select-user-by-dep placeholder="请输入代理人用户名" v-decorator="['agentUserName', validatorRules.agentUserName]" :trigger-change="true"></j-select-user-by-dep>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="代理开始时间">
|
||||
<j-date
|
||||
v-decorator="[ 'startTime', validatorRules.startTime]"
|
||||
:trigger-change="true"
|
||||
:showTime="true"
|
||||
date-format="YYYY-MM-DD HH:mm:ss"
|
||||
style="width:100%"
|
||||
placeholder="请选择开始时间" >
|
||||
</j-date>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="代理结束时间">
|
||||
<j-date
|
||||
v-decorator="[ 'endTime', validatorRules.endTime]"
|
||||
:trigger-change="true"
|
||||
:showTime="true"
|
||||
date-format="YYYY-MM-DD HH:mm:ss"
|
||||
style="width:100%"
|
||||
placeholder="请选择结束时间" >
|
||||
</j-date>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="状态">
|
||||
<a-radio-group class="fontiframe" name="radioGroup" v-decorator="[ 'status', {}]">
|
||||
<a-radio class="radioGroup" value="1">有效</a-radio>
|
||||
<a-radio class="radioGroup" value="0">无效</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
|
||||
</a-form>
|
||||
|
||||
</a-spin>
|
||||
</j-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import { httpAction, getAction } from '@/api/manage'
|
||||
import JDate from '@/components/jero/JDate.vue'
|
||||
import JSelectUserByDep from '@/components/jerobiz/JSelectUserByDep'
|
||||
|
||||
export default {
|
||||
name: 'SysUserAgentModal',
|
||||
components: {
|
||||
JDate,
|
||||
JSelectUserByDep
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title: '操作',
|
||||
visible: false,
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 }
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 }
|
||||
},
|
||||
username: '',
|
||||
confirmLoading: false,
|
||||
form: this.$form.createForm(this),
|
||||
validatorRules: {
|
||||
agentUserName: { rules: [{ required: true, message: '请输入代理人用户名!' }] },
|
||||
startTime: { rules: [{ required: true, message: '请输入代理开始时间!' }] },
|
||||
endTime: { rules: [{ required: true, message: '请输入代理结束时间!' }] }
|
||||
},
|
||||
url: {
|
||||
add: '/sys/sysUserAgent/add',
|
||||
edit: '/sys/sysUserAgent/edit',
|
||||
queryByUserName: '/sys/sysUserAgent/queryByUserName'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
},
|
||||
methods: {
|
||||
agentSettings (username) {
|
||||
this.username = username
|
||||
this.init()
|
||||
},
|
||||
init () {
|
||||
const params = { userName: this.username }// 查询条件
|
||||
getAction(this.url.queryByUserName, params).then((res) => {
|
||||
if (res.success) {
|
||||
console.log('获取流程节点信息', res)
|
||||
this.edit(res.result)
|
||||
} else {
|
||||
this.edit({ userName: this.username, status: '0' })
|
||||
}
|
||||
})
|
||||
},
|
||||
edit (record) {
|
||||
this.form.resetFields()
|
||||
this.model = Object.assign({}, record)
|
||||
this.visible = true
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model, 'userName', 'agentUserName', 'status', 'startTime', 'endTime'))
|
||||
})
|
||||
},
|
||||
close () {
|
||||
this.$emit('close')
|
||||
this.visible = false
|
||||
},
|
||||
handleOk () {
|
||||
const that = this
|
||||
// 触发表单验证
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
that.confirmLoading = true
|
||||
let httpurl = ''
|
||||
const method = 'post'
|
||||
if (!this.model.id) {
|
||||
httpurl += this.url.add
|
||||
// method = 'post'
|
||||
} else {
|
||||
httpurl += this.url.edit
|
||||
// method = 'put'
|
||||
}
|
||||
const formData = Object.assign(this.model, values)
|
||||
httpAction(httpurl, formData, method).then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message)
|
||||
// this.init();
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
that.confirmLoading = false
|
||||
that.close()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -1,560 +0,0 @@
|
||||
<template>
|
||||
<a-drawer
|
||||
:title="title"
|
||||
:maskClosable="true"
|
||||
:width="drawerWidth"
|
||||
placement="right"
|
||||
:closable="true"
|
||||
@close="handleCancel"
|
||||
:visible="visible"
|
||||
style="height: 100%;overflow: auto;padding-bottom: 53px;">
|
||||
|
||||
<template slot="title">
|
||||
<div style="width: 100%;">
|
||||
<span>{{ title }}</span>
|
||||
<span style="display:inline-block;width:calc(100% - 51px);padding-right:10px;text-align: right">
|
||||
<a-button @click="toggleScreen" icon="appstore" style="height:20px;width:20px;border:0"></a-button>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form-model ref="form" :model="model" :rules="validatorRules">
|
||||
|
||||
<a-form-model-item :label="$t('user.userAccount')" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="username">
|
||||
<a-input :placeholder="$t('pleaseEnter') + $t('user.userAccount')"
|
||||
:maxLength="50"
|
||||
v-model="model.username"
|
||||
:readOnly="!!model.id"
|
||||
:disabled="disableSubmit"
|
||||
@change="event => event.target.value = event.target.value.trim()" />
|
||||
</a-form-model-item>
|
||||
|
||||
<template v-if="!model.id">
|
||||
<a-form-model-item :label="$t('user.loginPassword')" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="password">
|
||||
<a-input-password type="password"
|
||||
:placeholder="$t('pleaseEnter') + $t('user.loginPassword')"
|
||||
:maxLength="20"
|
||||
v-model="model.password" />
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item :label="$t('user.confirmPassword')" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="confirmpassword">
|
||||
<a-input-password type="password"
|
||||
@blur="handleConfirmBlur"
|
||||
:maxLength="20"
|
||||
:placeholder="$t('user.reenterLoginPassword')"
|
||||
v-model="model.confirmpassword" />
|
||||
</a-form-model-item>
|
||||
</template>
|
||||
|
||||
<a-form-model-item :label="$t('user.userName')" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="realname">
|
||||
<a-input :placeholder="$t('pleaseEnter') + $t('user.userName')"
|
||||
v-model="model.realname"
|
||||
:maxLength="50"
|
||||
:disabled="disableSubmit"
|
||||
@change="event => event.target.value = event.target.value.trim()" />
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item :label="$t('user.post')" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="post">
|
||||
<a-input :placeholder="$t('pleaseEnter') + $t('user.post')"
|
||||
v-model="model.post"
|
||||
:maxLength="50"
|
||||
:disabled="disableSubmit"
|
||||
@change="event => event.target.value = event.target.value.trim()" />
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item :label="$t('user.roleAssignment')" :labelCol="labelCol" :wrapperCol="wrapperCol" v-show="!roleDisabled">
|
||||
<j-multi-select-tag
|
||||
:disabled="disableSubmit"
|
||||
v-model="model.selectedroles"
|
||||
:options="rolesOptions"
|
||||
:placeholder="$t('pleaseSelect') + $t('role')">
|
||||
</j-multi-select-tag>
|
||||
</a-form-model-item>
|
||||
|
||||
<!--部门分配-->
|
||||
<a-form-model-item :label="$t('user.departmentAllocation')" :labelCol="labelCol" :wrapperCol="wrapperCol" v-show="!departDisabled">
|
||||
<j-select-depart
|
||||
:disabled="disableSubmit"
|
||||
v-model="model.selecteddeparts"
|
||||
:multi="true"
|
||||
@back="backDepartInfo"
|
||||
:backDepart="true"
|
||||
:treeOpera="true">>
|
||||
</j-select-depart>
|
||||
</a-form-model-item>
|
||||
|
||||
<!--租户分配
|
||||
<a-form-model-item label="租户分配" :labelCol="labelCol" :wrapperCol="wrapperCol" v-show="!departDisabled">
|
||||
<j-multi-select-tag
|
||||
:disabled="disableSubmit"
|
||||
v-model="model.relTenantIds"
|
||||
:options="tenantsOptions"
|
||||
placeholder="请选择租户">
|
||||
</j-multi-select-tag>
|
||||
</a-form-model-item>
|
||||
-->
|
||||
|
||||
<a-form-model-item :label="$t('user.identity')" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-radio-group v-model="model.userIdentity" @change="identityChange" :disabled="disableSubmit">
|
||||
<a-radio :value="1">{{ $t('user.ordinaryUsers') }}</a-radio>
|
||||
<a-radio :value="2">{{ $t('user.superior') }}</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-model-item>
|
||||
<a-form-model-item :label="$t('user.responsibleDepartment')"
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
v-if="departIdShow===true">
|
||||
<j-multi-select-tag
|
||||
:disabled="disableSubmit"
|
||||
v-model="model.departIds"
|
||||
:options="nextDepartOptions"
|
||||
:placeholder="$t('pleaseSelect') + $t('user.responsibleDepartment')">
|
||||
</j-multi-select-tag>
|
||||
</a-form-model-item>
|
||||
<!-- update--end--autor:wangshuai-----date:20200108------for：新增身份和负责部门------ -->
|
||||
<!-- <a-form-model-item :label="$t('user.heads')" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
|
||||
<!-- <j-image-upload class="avatar-uploader"-->
|
||||
<!-- :text="$t('upload')"-->
|
||||
<!-- v-model="model.avatar"-->
|
||||
<!-- :disabled="disableSubmit"-->
|
||||
<!-- :number=1-->
|
||||
<!-- accept='.png,.PNG,.jpg,.JPG'></j-image-upload>-->
|
||||
<!-- </a-form-model-item>-->
|
||||
|
||||
<a-form-model-item :label="$t('user.gender')" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-select v-model="model.sex"
|
||||
:placeholder="$t('pleaseSelect') + $t('user.gender')"
|
||||
:getPopupContainer="(target) => target.parentNode"
|
||||
:disabled="disableSubmit">
|
||||
<a-select-option :value="1">{{ $t('user.male') }}</a-select-option>
|
||||
<a-select-option :value="2">{{ $t('user.female') }}</a-select-option>
|
||||
</a-select>
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item :label="$t('user.mailbox')" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="email">
|
||||
<a-input :placeholder="$t('pleaseEnter') + $t('user.mailbox')"
|
||||
v-model="model.email"
|
||||
:maxLength="50"
|
||||
:disabled="disableSubmit"
|
||||
@change="event => event.target.value = event.target.value.trim()" />
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item :label="$t('phoneNumber')" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="phone">
|
||||
<a-input :placeholder="$t('pleaseEnter') + $t('phoneNumber')"
|
||||
:disabled="isDisabledAuth('user:form:phone') || disableSubmit"
|
||||
v-model="model.phone" />
|
||||
</a-form-model-item>
|
||||
|
||||
<!-- <a-form-model-item label="工作流引擎" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
|
||||
<!-- <j-dict-select-tag v-model="model.activitiSync" placeholder="请选择是否同步工作流引擎" :type="'radio'" dictCode="activiti_sync"/>-->
|
||||
<!-- </a-form-model-item>-->
|
||||
|
||||
</a-form-model>
|
||||
</a-spin>
|
||||
|
||||
<div class="drawer-bootom-button" v-show="!disableSubmit">
|
||||
<a-popconfirm :title="$t('areYouWantDiscardEditing')" @confirm="handleCancel" :okText="$t('determine')" :cancelText="$t('cancel')">
|
||||
<a-button style="margin-right: .8rem">{{ $t('cancel') }}</a-button>
|
||||
</a-popconfirm>
|
||||
<a-button @click="handleSubmit" type="primary" :loading="confirmLoading">{{ $t('submit') }}</a-button>
|
||||
</div>
|
||||
|
||||
</a-drawer>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import moment from 'moment'
|
||||
import Vue from 'vue'
|
||||
import { ACCESS_TOKEN } from '@/store/mutation-types'
|
||||
import { getAction } from '@/api/manage'
|
||||
import { addUser, duplicateCheck, editUser, queryall, queryUserRole } from '@/api/api'
|
||||
import { disabledAuthFilter } from '@/utils/authFilter'
|
||||
|
||||
import { getRSAPublicKey } from '@/utils/encryption.js'
|
||||
import { JSEncrypt } from 'jsencrypt'
|
||||
import JMultiSelectTag from '../../../components/dict/JMultiSelectTag'
|
||||
import { getConfusionCode } from '@/utils/util'
|
||||
|
||||
export default {
|
||||
name: 'UserModal',
|
||||
components: {
|
||||
JMultiSelectTag
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
departDisabled: false, // 是否是我的部门调用该页面
|
||||
roleDisabled: false, // 是否是角色维护调用该页面
|
||||
modalWidth: 800,
|
||||
drawerWidth: 700,
|
||||
modaltoggleFlag: true,
|
||||
confirmDirty: false,
|
||||
userId: '', // 保存用户id
|
||||
disableSubmit: false,
|
||||
dateFormat: 'YYYY-MM-DD',
|
||||
validatorRules: {
|
||||
username: [{ required: true, message: this.$t('pleaseEnter') + this.$t('user.userAccount') },
|
||||
{ validator: this.validateUsername }],
|
||||
password: [{
|
||||
required: true,
|
||||
pattern: /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[~!@#$%^&*()_+`\-={}:";'<>?,./]).{8,}$/,
|
||||
message: this.$t('user.passwordConsists')
|
||||
},
|
||||
{ validator: this.validateToNextPassword, trigger: 'change' }],
|
||||
confirmpassword: [{ required: true, message: this.$t('user.reenterLoginPassword') },
|
||||
{ validator: this.compareToFirstPassword }],
|
||||
realname: [{ required: true, message: this.$t('pleaseEnter') + this.$t('user.userName') }],
|
||||
phone: [{ validator: this.validatePhone }],
|
||||
email: [{ validator: this.validateEmail }],
|
||||
roles: {}
|
||||
},
|
||||
departIdShow: false,
|
||||
title: this.$t('operation'),
|
||||
visible: false,
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 }
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 }
|
||||
},
|
||||
uploadLoading: false,
|
||||
confirmLoading: false,
|
||||
headers: {},
|
||||
url: {
|
||||
fileUpload: window._CONFIG.domianURL + '/sys/common/upload',
|
||||
userWithDepart: '/sys/user/userDepartList', // 引入为指定用户查看部门 信息需要的url
|
||||
userId: '/sys/user/generateUserId', // 引入生成添加用户情况下的url
|
||||
syncUserByUserName: '/act/process/extActProcess/doSyncUserByUserName', // 同步用户到工作流
|
||||
queryTenantList: '/sys/tenant/queryList'
|
||||
},
|
||||
tenantsOptions: [],
|
||||
rolesOptions: [],
|
||||
nextDepartOptions: [],
|
||||
rsaPublicKey: ''
|
||||
}
|
||||
},
|
||||
created () {
|
||||
const token = Vue.ls.get(ACCESS_TOKEN)
|
||||
this.headers = { 'X-Access-Token': token }
|
||||
this.initRoleList()
|
||||
this.initTenantList()
|
||||
},
|
||||
computed: {
|
||||
uploadAction: function () {
|
||||
return this.url.fileUpload
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
add () {
|
||||
this.refresh()
|
||||
this.edit({ userIdentity: 1 })
|
||||
},
|
||||
edit (record) {
|
||||
const that = this
|
||||
that.visible = true
|
||||
// 根据屏幕宽度自适应抽屉宽度
|
||||
this.resetScreenSize()
|
||||
that.model = Object.assign({}, { selectedroles: '', selecteddeparts: '' }, record)
|
||||
// 身份为上级显示负责部门，否则不显示
|
||||
this.departIdShow = this.model.userIdentity === 2
|
||||
if (Object.prototype.hasOwnProperty.call(record, 'id')) {
|
||||
that.userId = record.id
|
||||
that.getUserRoles(record.id)
|
||||
that.getUserDeparts(record.id)
|
||||
}
|
||||
},
|
||||
isDisabledAuth (code) {
|
||||
return disabledAuthFilter(code)
|
||||
},
|
||||
// 窗口最大化切换
|
||||
toggleScreen () {
|
||||
if (this.modaltoggleFlag) {
|
||||
this.modalWidth = window.innerWidth
|
||||
} else {
|
||||
this.modalWidth = 800
|
||||
}
|
||||
this.modaltoggleFlag = !this.modaltoggleFlag
|
||||
},
|
||||
// 根据屏幕变化,设置抽屉尺寸
|
||||
resetScreenSize () {
|
||||
const screenWidth = document.body.clientWidth
|
||||
if (screenWidth < 500) {
|
||||
this.drawerWidth = screenWidth
|
||||
} else {
|
||||
this.drawerWidth = 700
|
||||
}
|
||||
},
|
||||
// 初始化租户字典
|
||||
initTenantList () {
|
||||
getAction(this.url.queryTenantList).then(res => {
|
||||
if (res.success) {
|
||||
this.tenantsOptions = res.result.map((item) => {
|
||||
return { label: item.name, value: item.id + '' }
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 初始化角色字典
|
||||
initRoleList () {
|
||||
queryall().then((res) => {
|
||||
if (res.success) {
|
||||
this.rolesOptions = res.result.map((item) => {
|
||||
return { label: item.roleName, value: item.id }
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
getUserRoles (userid) {
|
||||
queryUserRole({ userid: userid }).then((res) => {
|
||||
if (res.success) {
|
||||
this.model.selectedroles = res.result.join(',')
|
||||
}
|
||||
})
|
||||
},
|
||||
getUserDeparts (userid) {
|
||||
const that = this
|
||||
getAction(that.url.userWithDepart, { userId: userid }).then((res) => {
|
||||
if (res.success) {
|
||||
const departOptions = []
|
||||
const selectDepartKeys = []
|
||||
for (let i = 0; i < res.result.length; i++) {
|
||||
selectDepartKeys.push(res.result[i].key)
|
||||
// 新增负责部门选择下拉框
|
||||
departOptions.push({
|
||||
value: res.result[i].key,
|
||||
label: res.result[i].title
|
||||
})
|
||||
}
|
||||
that.model.selecteddeparts = selectDepartKeys.join(',')
|
||||
that.nextDepartOptions = departOptions
|
||||
}
|
||||
})
|
||||
},
|
||||
backDepartInfo (info) {
|
||||
this.model.departIds = this.model.selecteddeparts
|
||||
this.nextDepartOptions = info.map((item) => {
|
||||
return { label: item.text, value: item.value + '' }
|
||||
})
|
||||
},
|
||||
refresh () {
|
||||
this.userId = ''
|
||||
this.nextDepartOptions = []
|
||||
this.departIdShow = false
|
||||
},
|
||||
close () {
|
||||
this.$emit('close')
|
||||
this.visible = false
|
||||
this.disableSubmit = false
|
||||
this.nextDepartOptions = []
|
||||
this.departIdShow = false
|
||||
this.$refs.form.resetFields()
|
||||
},
|
||||
moment,
|
||||
handleSubmit () {
|
||||
const that = this
|
||||
// 先拉取秘钥
|
||||
getRSAPublicKey().then(res => {
|
||||
this.rsaPublicKey = res.result
|
||||
|
||||
// 触发表单验证
|
||||
this.$refs.form.validate(valid => {
|
||||
if (valid) {
|
||||
that.confirmLoading = true
|
||||
// 如果是上级择传入departIds,否则为空
|
||||
if (this.model.userIdentity !== 2) {
|
||||
this.model.departIds = ''
|
||||
}
|
||||
|
||||
// 对密码、邮箱、手机号进行加密
|
||||
const encrypt = new JSEncrypt()
|
||||
encrypt.setPublicKey(that.rsaPublicKey)
|
||||
|
||||
if (this.model.password) {
|
||||
this.model.password = encrypt.encrypt(this.model.password)
|
||||
}
|
||||
|
||||
if (this.model.phone) {
|
||||
this.model.phone = encrypt.encrypt(this.model.phone)
|
||||
}
|
||||
|
||||
if (this.model.email) {
|
||||
this.model.email = encrypt.encrypt(this.model.email)
|
||||
}
|
||||
this.model.rsaPublicKey = that.rsaPublicKey
|
||||
|
||||
let obj
|
||||
if (!this.model.id) {
|
||||
this.model.id = this.userId
|
||||
obj = addUser(this.model)
|
||||
} else {
|
||||
obj = editUser(this.model)
|
||||
}
|
||||
|
||||
obj.then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message)
|
||||
that.$emit('ok')
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
that.confirmLoading = false
|
||||
that.close()
|
||||
})
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
validateToNextPassword (rule, value, callback) {
|
||||
const confirmpassword = this.model.confirmpassword
|
||||
|
||||
if (value && confirmpassword && value !== confirmpassword) {
|
||||
callback(new Error(this.$t('user.passwordsEnteredTwice')))
|
||||
}
|
||||
if (value && this.confirmDirty) {
|
||||
this.$refs.form.validateField(['user.confirmpassword'])
|
||||
}
|
||||
callback()
|
||||
},
|
||||
compareToFirstPassword (rule, value, callback) {
|
||||
if (value && value !== this.model.password) {
|
||||
callback(new Error(this.$t('user.passwordsEnteredTwice')))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
validatePhone (rule, value, callback) {
|
||||
if (!value) {
|
||||
callback()
|
||||
} else {
|
||||
if (new RegExp(/^1[345789][0-9]\d{8}$/).test(value)) {
|
||||
callback()
|
||||
// const confusionCode = getConfusionCode('sys_user', 'phone')
|
||||
// const params = {
|
||||
// // tableName: 'sys_user',
|
||||
// // fieldName: 'phone',
|
||||
// confusionCode,
|
||||
// fieldVal: value,
|
||||
// dataId: this.userId
|
||||
// }
|
||||
// duplicateCheck(params).then((res) => {
|
||||
// if (res.success) {
|
||||
// callback()
|
||||
// } else {
|
||||
// callback(new Error(this.$t('user.phoneNumberExists')))
|
||||
// }
|
||||
// })
|
||||
} else {
|
||||
callback(new Error(this.$t('user.enterPhoneCorrect')))
|
||||
}
|
||||
}
|
||||
},
|
||||
validateEmail (rule, value, callback) {
|
||||
if (!value) {
|
||||
callback()
|
||||
} else {
|
||||
if (new RegExp(/^\w[-\w.+]*@([A-Za-z0-9][-A-Za-z0-9]+\.)+[A-Za-z]{2,14}/).test(value)) {
|
||||
const confusionCode = getConfusionCode('sys_user', 'email')
|
||||
const params = {
|
||||
// tableName: 'sys_user',
|
||||
// fieldName: 'email',
|
||||
confusionCode,
|
||||
fieldVal: value,
|
||||
dataId: this.userId
|
||||
}
|
||||
duplicateCheck(params).then((res) => {
|
||||
console.log(res)
|
||||
if (res.success) {
|
||||
callback()
|
||||
} else {
|
||||
callback(new Error(this.$t('user.mailboxExists')))
|
||||
}
|
||||
})
|
||||
} else {
|
||||
callback(new Error(this.$t('user.enterMailboxCorrect')))
|
||||
}
|
||||
}
|
||||
},
|
||||
validateUsername (rule, value, callback) {
|
||||
const confusionCode = getConfusionCode('sys_user', 'username')
|
||||
const params = {
|
||||
// tableName: 'sys_user',
|
||||
// fieldName: 'username',
|
||||
confusionCode,
|
||||
fieldVal: value,
|
||||
dataId: this.userId
|
||||
}
|
||||
duplicateCheck(params).then((res) => {
|
||||
if (res.success) {
|
||||
callback()
|
||||
} else {
|
||||
callback(new Error(this.$t('user.userExists')))
|
||||
}
|
||||
})
|
||||
},
|
||||
handleConfirmBlur (e) {
|
||||
const value = e.target.value
|
||||
this.confirmDirty = this.confirmDirty || !!value
|
||||
},
|
||||
beforeUpload: function (file) {
|
||||
const fileType = file.type
|
||||
if (fileType.indexOf('image') < 0) {
|
||||
this.$message.warning(this.$t('uploadPictures'))
|
||||
return false
|
||||
}
|
||||
// TODO 验证文件大小
|
||||
},
|
||||
|
||||
// 搜索用户对应的部门API
|
||||
onSearch () {
|
||||
this.$refs.departWindow.add(this.checkedDepartKeys, this.userId)
|
||||
},
|
||||
identityChange (e) {
|
||||
this.departIdShow = e.target.value !== 1
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.avatar-uploader > .ant-upload {
|
||||
width: 104px;
|
||||
height: 104px;
|
||||
}
|
||||
|
||||
.ant-upload-select-picture-card i {
|
||||
font-size: 49px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.ant-upload-select-picture-card .ant-upload-text {
|
||||
margin-top: 8px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.ant-table-tbody .ant-table-row td {
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
.drawer-bootom-button {
|
||||
position: absolute;
|
||||
bottom: -8px;
|
||||
width: 100%;
|
||||
border-top: 1px solid #e8e8e8;
|
||||
padding: 10px 16px;
|
||||
text-align: right;
|
||||
left: 0;
|
||||
background: #fff;
|
||||
border-radius: 0 0 2px 2px;
|
||||
}
|
||||
</style>
|
||||
@@ -1,207 +0,0 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:width="1000"
|
||||
:title="title"
|
||||
:visible="innerVisible"
|
||||
switchFullscreen
|
||||
@cancel="handleCancel"
|
||||
:cancelText="$t('close')"
|
||||
:okButtonProps="{style:{display:'none'}}"
|
||||
>
|
||||
<a-alert type="info" showIcon style="margin-bottom: 16px;">
|
||||
<template slot="message">
|
||||
<span>{{ $t('selected') }}</span>
|
||||
<a style="font-weight: 600;padding: 0 4px;">{{ selectedRowKeys.length }}</a>
|
||||
<span>{{ $t('term') }}</span>
|
||||
<template v-if="selectedRowKeys.length>0">
|
||||
<a-divider type="vertical"/>
|
||||
<a @click="handleClearSelection">{{ $t('userRecycle.clearSelection') }}</a>
|
||||
<a-divider type="vertical"/>
|
||||
<a @click="handleRevertBatch">{{ $t('userRecycle.batchRestore') }}</a>
|
||||
<a-divider type="vertical"/>
|
||||
<a @click="handleDeleteBatch">{{ $t('batchDelete') }}</a>
|
||||
</template>
|
||||
</template>
|
||||
</a-alert>
|
||||
|
||||
<a-table
|
||||
ref="table"
|
||||
rowKey="id"
|
||||
size="middle"
|
||||
bordered
|
||||
:columns="columns"
|
||||
:loading="loading"
|
||||
:dataSource="dataSource"
|
||||
:pagination="false"
|
||||
:rowSelection="{selectedRowKeys, onChange: handleTableSelectChange}"
|
||||
>
|
||||
|
||||
<!-- 显示头像 -->
|
||||
<template slot="avatarslot" slot-scope="text, record">
|
||||
<div class="anty-img-wrap">
|
||||
<a-avatar shape="square" :src="url.getAvatar(record.avatar)" icon="user"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="handleRevert([record.id],[record.username])"><a-icon type="redo"/> {{ $t('userRecycle.restoreUser') }}</a>
|
||||
<a-divider type="vertical"/>
|
||||
<a @click="handleDelete([record.id])"><a-icon type="delete"/> {{ $t('userRecycle.completelyDelete') }}</a>
|
||||
</span>
|
||||
</a-table>
|
||||
|
||||
</j-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getFileAccessHttpUrl, postAction } from '@/api/manage'
|
||||
|
||||
// 高度封装的请求，请务必使用 superRequest.call(this,{}) 的方式调用
|
||||
function superRequest (options) {
|
||||
this.loading = !!options.loading
|
||||
options.promise.then(res => {
|
||||
if (res.success && typeof options.success === 'function') {
|
||||
options.success(res)
|
||||
} else {
|
||||
throw new Error(res.message)
|
||||
}
|
||||
}).catch(e => {
|
||||
console.error('查询已删除的用户失败：', e)
|
||||
// this.$message.warning('查询已删除的用户失败：' + (e.message || e))
|
||||
}).finally(() => {
|
||||
this.loading = false
|
||||
})
|
||||
}
|
||||
|
||||
export default {
|
||||
name: 'UserRecycleBinModal',
|
||||
props: {
|
||||
visible: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title: '用户回收站',
|
||||
loading: false,
|
||||
innerVisible: false,
|
||||
selectedRowKeys: [],
|
||||
dataSource: [],
|
||||
columns: [
|
||||
{ title: '#', align: 'center', key: 'rowIndex', width: 80, customRender: (t, r, i) => i + 1 },
|
||||
{ title: this.$t('user.userAccount'), align: 'center', dataIndex: 'username' },
|
||||
{ title: this.$t('user.userName'), align: 'center', dataIndex: 'realname' },
|
||||
{ title: this.$t('user.heads'), align: 'center', dataIndex: 'avatar', scopedSlots: { customRender: 'avatarslot' } },
|
||||
{ title: this.$t('department'), align: 'center', dataIndex: 'orgCode' },
|
||||
{ title: this.$t('operation'), align: 'center', dataIndex: 'action', width: 200, scopedSlots: { customRender: 'action' } }
|
||||
],
|
||||
url: {
|
||||
getAvatar: (path) => getFileAccessHttpUrl(`${path}`),
|
||||
// 回收站操作，get = 获取列表；put = 取回；delete = 彻底删除
|
||||
recycleBin: '/sys/user/recycleBin',
|
||||
putRecycleBin: '/sys/user/putRecycleBin',
|
||||
deleteRecycleBin: '/sys/user/deleteRecycleBin'
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
visible: {
|
||||
immediate: true,
|
||||
handler (val) {
|
||||
if (val) {
|
||||
this.loadData()
|
||||
}
|
||||
this.innerVisible = val
|
||||
}
|
||||
},
|
||||
innerVisible (val) {
|
||||
this.$emit('update:visible', val)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
loadData () {
|
||||
superRequest.call(this, {
|
||||
loading: true,
|
||||
promise: this.$http.get(this.url.recycleBin),
|
||||
success: res => (this.dataSource = res.result)
|
||||
})
|
||||
},
|
||||
handleOk () {
|
||||
this.loadData()
|
||||
this.$emit('ok')
|
||||
},
|
||||
handleCancel () {
|
||||
this.innerVisible = false
|
||||
},
|
||||
// 还原用户
|
||||
handleRevert (userIds, username) {
|
||||
this.$confirm({
|
||||
title: this.$t('userRecycle.restoreUser'),
|
||||
content: this.$t('userRecycle.whetherRestoreUser') + `${username}？`,
|
||||
centered: true,
|
||||
onOk: () => {
|
||||
postAction(this.url.putRecycleBin, { userIds: userIds.join(',') }).then((res) => {
|
||||
if (res.success) {
|
||||
this.handleOk()
|
||||
this.handleClearSelection()
|
||||
this.$message.success(`${username}` + this.$t('userRecycle.userRestoreSuccessfully'))
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 彻底删除用户
|
||||
handleDelete (userIds) {
|
||||
this.$confirm({
|
||||
title: this.$t('userRecycle.completelyDeleteUser'),
|
||||
content: (<div>
|
||||
<p>{this.$t('userRecycle.sureCompletelyDelete')} {userIds.length} {this.$t('userRecycle.users')}</p>
|
||||
<p style="color:red;">{this.$t('userRecycle.comDeleteAfterCannotRestore')}</p>
|
||||
</div>),
|
||||
centered: true,
|
||||
onOk: () => {
|
||||
const that = this
|
||||
postAction(that.url.deleteRecycleBin, { userIds: userIds.join(',') }).then((res) => {
|
||||
if (res.success) {
|
||||
this.loadData()
|
||||
this.handleClearSelection()
|
||||
this.$message.success(`${this.$t('userRecycle.completelyDelete')} ${userIds.length} ${this.$t('userRecycle.usersSucceeded')}`)
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
handleRevertBatch () {
|
||||
this.$confirm({
|
||||
title: this.$t('userRecycle.restoreUser'),
|
||||
content: this.$t('userRecycle.whetherRestoreSelectedUser'),
|
||||
centered: true,
|
||||
onOk: () => {
|
||||
postAction(this.url.putRecycleBin, { userIds: this.selectedRowKeys.join(',') }).then((res) => {
|
||||
if (res.success) {
|
||||
this.handleOk()
|
||||
this.handleClearSelection()
|
||||
this.$message.success(this.$t('userRecycle.selectedUserRestoreSuccess'))
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
handleDeleteBatch () {
|
||||
this.handleDelete(this.selectedRowKeys)
|
||||
},
|
||||
handleClearSelection () {
|
||||
this.handleTableSelectChange([], [])
|
||||
},
|
||||
handleTableSelectChange (selectedRowKeys, selectionRows) {
|
||||
this.selectedRowKeys = selectedRowKeys
|
||||
this.selectionRows = selectionRows
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
||||
@@ -1,192 +0,0 @@
|
||||
<template>
|
||||
<a-drawer
|
||||
:title="title"
|
||||
:maskClosable="true"
|
||||
width=650
|
||||
placement="right"
|
||||
:closable="true"
|
||||
@close="close"
|
||||
:visible="visible"
|
||||
style="overflow: auto;padding-bottom: 53px;">
|
||||
|
||||
<a-form>
|
||||
<a-form-item :label="$t('roleManage.youHavePermissions')">
|
||||
<a-tree
|
||||
:checkable="true"
|
||||
@check="onCheck"
|
||||
:checkedKeys="checkedKeys"
|
||||
:treeData="treeData"
|
||||
@expand="onExpand"
|
||||
@select="onTreeNodeSelect"
|
||||
:selectedKeys="selectedKeys"
|
||||
:expandedKeys="expandedKeysss"
|
||||
:checkStrictly="checkStrictly">
|
||||
<span slot="hasDatarule" slot-scope="{slotTitle,ruleFlag}">
|
||||
{{ slotTitle }}<a-icon v-if="ruleFlag" type="align-left" style="margin-left:5px;color: red;"></a-icon>
|
||||
</span>
|
||||
</a-tree>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
|
||||
<div class="drawer-bootom-button">
|
||||
<a-dropdown style="float: left" :trigger="['click']" placement="topCenter">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="switchCheckStrictly(1)">{{ $t('parentChildConnection') }}</a-menu-item>
|
||||
<a-menu-item key="2" @click="switchCheckStrictly(2)">{{ $t('cancelConnection') }}</a-menu-item>
|
||||
<a-menu-item key="3" @click="checkALL">{{ $t('checkAll') }}</a-menu-item>
|
||||
<a-menu-item key="4" @click="cancelCheckALL">{{ $t('deselectAll') }}</a-menu-item>
|
||||
<a-menu-item key="5" @click="expandAll">{{ $t('expandAll') }}</a-menu-item>
|
||||
<a-menu-item key="6" @click="closeAll">{{ $t('mergeAll') }}</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button>
|
||||
{{ $t('treeOperation') }} <a-icon type="up" />
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
<a-popconfirm :title="$t('areYouWantDiscardEditing')" @confirm="close" :okText="$t('confirm')" :cancelText="$t('cancel')">
|
||||
<a-button style="margin-right: .8rem">{{ $t('cancel') }}</a-button>
|
||||
</a-popconfirm>
|
||||
<a-button @click="handleSubmit(false)" type="primary" :loading="loading" ghost style="margin-right: 0.8rem">{{ $t('roleManage.saveOnly') }}</a-button>
|
||||
<a-button @click="handleSubmit(true)" type="primary" :loading="loading">{{ $t('roleManage.saveAndClose') }}</a-button>
|
||||
</div>
|
||||
</a-drawer>
|
||||
|
||||
</template>
|
||||
<script>
|
||||
import { queryTreeListForRole, queryRolePermission, saveRolePermission } from '@/api/api'
|
||||
|
||||
export default {
|
||||
name: 'RoleModal',
|
||||
data () {
|
||||
return {
|
||||
roleId: '',
|
||||
treeData: [],
|
||||
defaultCheckedKeys: [],
|
||||
checkedKeys: [],
|
||||
expandedKeysss: [],
|
||||
allTreeKeys: [],
|
||||
autoExpandParent: true,
|
||||
checkStrictly: true,
|
||||
title: this.$t('roleManage.rolePermissionConfig'),
|
||||
visible: false,
|
||||
loading: false,
|
||||
selectedKeys: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onTreeNodeSelect (id) {
|
||||
if (id && id.length > 0) {
|
||||
this.selectedKeys = id
|
||||
}
|
||||
},
|
||||
onCheck (o) {
|
||||
if (this.checkStrictly) {
|
||||
this.checkedKeys = o.checked
|
||||
} else {
|
||||
this.checkedKeys = o
|
||||
}
|
||||
},
|
||||
show (roleId) {
|
||||
this.roleId = roleId
|
||||
this.visible = true
|
||||
},
|
||||
close () {
|
||||
this.reset()
|
||||
this.$emit('close')
|
||||
this.visible = false
|
||||
},
|
||||
onExpand (expandedKeys) {
|
||||
this.expandedKeysss = expandedKeys
|
||||
this.autoExpandParent = false
|
||||
},
|
||||
reset () {
|
||||
this.expandedKeysss = []
|
||||
this.checkedKeys = []
|
||||
this.defaultCheckedKeys = []
|
||||
this.loading = false
|
||||
},
|
||||
expandAll () {
|
||||
this.expandedKeysss = this.allTreeKeys
|
||||
},
|
||||
closeAll () {
|
||||
this.expandedKeysss = []
|
||||
},
|
||||
checkALL () {
|
||||
this.checkedKeys = this.allTreeKeys
|
||||
},
|
||||
cancelCheckALL () {
|
||||
// this.checkedKeys = this.defaultCheckedKeys
|
||||
this.checkedKeys = []
|
||||
},
|
||||
switchCheckStrictly (v) {
|
||||
if (v === 1) {
|
||||
this.checkStrictly = false
|
||||
} else if (v === 2) {
|
||||
this.checkStrictly = true
|
||||
}
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
},
|
||||
handleSubmit (exit) {
|
||||
const that = this
|
||||
const params = {
|
||||
roleId: that.roleId,
|
||||
permissionIds: that.checkedKeys.join(','),
|
||||
lastpermissionIds: that.defaultCheckedKeys.join(',')
|
||||
}
|
||||
that.loading = true
|
||||
console.log('请求参数：', params)
|
||||
saveRolePermission(params).then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message)
|
||||
that.loading = false
|
||||
if (exit) {
|
||||
that.close()
|
||||
}
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
that.loading = false
|
||||
if (exit) {
|
||||
that.close()
|
||||
}
|
||||
}
|
||||
this.loadData()
|
||||
})
|
||||
},
|
||||
loadData () {
|
||||
queryTreeListForRole().then((res) => {
|
||||
this.treeData = res.result.treeList
|
||||
this.allTreeKeys = res.result.ids
|
||||
queryRolePermission({ roleId: this.roleId }).then((res) => {
|
||||
this.checkedKeys = [...res.result]
|
||||
this.defaultCheckedKeys = [...res.result]
|
||||
this.expandedKeysss = this.allTreeKeys
|
||||
console.log(this.defaultCheckedKeys)
|
||||
})
|
||||
})
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
visible () {
|
||||
if (this.visible) {
|
||||
this.loadData()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.drawer-bootom-button {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
border-top: 1px solid #e8e8e8;
|
||||
padding: 10px 16px;
|
||||
text-align: right;
|
||||
left: 0;
|
||||
background: #fff;
|
||||
border-radius: 0 0 2px 2px;
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -1,35 +0,0 @@
|
||||
@active-color: #4a4a48;
|
||||
ul {
|
||||
max-height: 700px;
|
||||
overflow-y: auto;
|
||||
padding-left: .5rem;
|
||||
i {
|
||||
font-size: 1.5rem;
|
||||
border: 1px solid #f1f1f1;
|
||||
padding: .2rem;
|
||||
margin: .3rem;
|
||||
cursor: pointer;
|
||||
&.active, &:hover {
|
||||
border-radius: 2px;
|
||||
border-color: @active-color;
|
||||
background-color: @active-color;
|
||||
color: #fff;
|
||||
transition: all .3s;
|
||||
}
|
||||
}
|
||||
li {
|
||||
list-style: none;
|
||||
float: left;
|
||||
width: 5%;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
color: #555;
|
||||
transition: color .3s ease-in-out,background-color .3s ease-in-out;
|
||||
position: relative;
|
||||
margin: 3px 0;
|
||||
border-radius: 4px;
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
padding: 10px 0 0;
|
||||
}
|
||||
}
|
||||
@@ -1,133 +0,0 @@
|
||||
<template>
|
||||
<j-modal
|
||||
v-model="show"
|
||||
:width="900"
|
||||
:keyboard="false"
|
||||
:closable="false"
|
||||
:centered="true"
|
||||
switchFullscreen
|
||||
@ok="ok"
|
||||
@cancel="cancel"
|
||||
:maskClosable="false"
|
||||
:mask="false"
|
||||
okText="确认"
|
||||
cancelText="取消">
|
||||
<a-tabs>
|
||||
<a-tab-pane tab="方向性图标" key="1">
|
||||
<ul>
|
||||
<li v-for="icon in icons.directionIcons" :key="icon">
|
||||
<a-icon :type="icon" :title="icon" @click="chooseIcon(icon)" :class="{'active':activeIndex === icon}"/>
|
||||
</li>
|
||||
</ul>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane tab="指示性图标" key="2">
|
||||
<ul>
|
||||
<li v-for="icon in icons.suggestionIcons" :key="icon">
|
||||
<a-icon :type="icon" :title="icon" @click="chooseIcon(icon)" :class="{'active':activeIndex === icon}"/>
|
||||
</li>
|
||||
</ul>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane tab="编辑类图标" key="3">
|
||||
<ul>
|
||||
<li v-for="icon in icons.editIcons" :key="icon">
|
||||
<a-icon :type="icon" :title="icon" @click="chooseIcon(icon)" :class="{'active':activeIndex === icon}"/>
|
||||
</li>
|
||||
</ul>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane tab="数据类图标" key="4">
|
||||
<ul>
|
||||
<li v-for="icon in icons.dataIcons" :key="icon">
|
||||
<a-icon :type="icon" :title="icon" @click="chooseIcon(icon)" :class="{'active':activeIndex === icon}"/>
|
||||
</li>
|
||||
</ul>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane tab="网站通用图标" key="5">
|
||||
<ul>
|
||||
<li v-for="icon in icons.webIcons" :key="icon">
|
||||
<a-icon :type="icon" :title="icon" @click="chooseIcon(icon)" :class="{'active':activeIndex === icon}"/>
|
||||
</li>
|
||||
</ul>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane tab="品牌和标识" key="6">
|
||||
<ul>
|
||||
<li v-for="icon in icons.logoIcons" :key="icon">
|
||||
<a-icon :type="icon" :title="icon" @click="chooseIcon(icon)" :class="{'active':activeIndex === icon}"/>
|
||||
</li>
|
||||
</ul>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane tab="自定义" key="7">
|
||||
<ul>
|
||||
<li v-for="icon in icons.selfIcons" :key="icon">
|
||||
<i class="iconfont" :class="icon" @click="chooseIcon(icon)"></i>
|
||||
</li>
|
||||
</ul>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</j-modal>
|
||||
</template>
|
||||
<script>
|
||||
const directionIcons = ['step-backward', 'step-forward', 'fast-backward', 'fast-forward', 'shrink', 'arrows-alt', 'down', 'up', 'left', 'right', 'caret-up', 'caret-down', 'caret-left', 'caret-right', 'up-circle', 'down-circle', 'left-circle', 'right-circle', 'up-circle-o', 'down-circle-o', 'right-circle-o', 'left-circle-o', 'double-right', 'double-left', 'vertical-left', 'vertical-right', 'forward', 'backward', 'rollback', 'enter', 'retweet', 'swap', 'swap-left', 'swap-right', 'arrow-up', 'arrow-down', 'arrow-left', 'arrow-right', 'play-circle', 'play-circle-o', 'up-square', 'down-square', 'left-square', 'right-square', 'up-square-o', 'down-square-o', 'left-square-o', 'right-square-o', 'login', 'logout', 'menu-fold', 'menu-unfold', 'border-bottom', 'border-horizontal', 'border-inner', 'border-left', 'border-right', 'border-top', 'border-verticle', 'pic-center', 'pic-left', 'pic-right', 'radius-bottomleft', 'radius-bottomright', 'radius-upleft', 'radius-upright', 'fullscreen', 'fullscreen-exit']
|
||||
const suggestionIcons = ['question', 'question-circle', 'plus', 'plus-circle', 'pause', 'pause-circle', 'minus', 'minus-circle', 'plus-square', 'minus-square', 'info', 'info-circle', 'exclamation', 'exclamation-circle', 'close', 'close-circle', 'close-square', 'check', 'check-circle', 'check-square', 'clock-circle', 'warning', 'issues-close', 'stop']
|
||||
const editIcons = ['edit', 'form', 'copy', 'scissor', 'delete', 'snippets', 'diff', 'highlight', 'align-center', 'align-left', 'align-right', 'bg-colors', 'bold', 'italic', 'underline', 'strikethrough', 'redo', 'undo', 'zoom-in', 'zoom-out', 'font-colors', 'font-size', 'line-height', 'colum-height', 'dash', 'small-dash', 'sort-ascending', 'sort-descending', 'drag', 'ordered-list', 'radius-setting']
|
||||
const dataIcons = ['area-chart', 'pie-chart', 'bar-chart', 'dot-chart', 'line-chart', 'radar-chart', 'heat-map', 'fall', 'rise', 'stock', 'box-plot', 'fund', 'sliders']
|
||||
const webIcons = ['lock', 'unlock', 'bars', 'book', 'calendar', 'cloud', 'cloud-download', 'code', 'copy', 'credit-card', 'delete', 'desktop', 'download', 'ellipsis', 'file', 'file-text', 'file-unknown', 'file-pdf', 'file-word', 'file-excel', 'file-jpg', 'file-ppt', 'file-markdown', 'file-add', 'folder', 'folder-open', 'folder-add', 'hdd', 'frown', 'meh', 'smile', 'inbox', 'laptop', 'appstore', 'link', 'mail', 'mobile', 'notification', 'paper-clip', 'picture', 'poweroff', 'reload', 'search', 'setting', 'share-alt', 'shopping-cart', 'tablet', 'tag', 'tags', 'to-top', 'upload', 'user', 'video-camera', 'home', 'loading', 'loading-3-quarters', 'cloud-upload', 'star', 'heart', 'environment', 'eye', 'camera', 'save', 'team', 'solution', 'phone', 'filter', 'exception', 'export', 'customer-service', 'qrcode', 'scan', 'like', 'dislike', 'message', 'pay-circle', 'calculator', 'pushpin', 'bulb', 'select', 'switcher', 'rocket', 'bell', 'disconnect', 'database', 'compass', 'barcode', 'hourglass', 'key', 'flag', 'layout', 'printer', 'sound', 'usb', 'skin', 'tool', 'sync', 'wifi', 'car', 'schedule', 'user-add', 'user-delete', 'usergroup-add', 'usergroup-delete', 'man', 'woman', 'shop', 'gift', 'idcard', 'medicine-box', 'red-envelope', 'coffee', 'copyright', 'trademark', 'safety', 'wallet', 'bank', 'trophy', 'contacts', 'global', 'shake', 'api', 'fork', 'dashboard', 'table', 'profile', 'alert', 'audit', 'branches', 'build', 'border', 'crown', 'experiment', 'fire', 'money-collect', 'property-safety', 'read', 'reconciliation', 'rest', 'security-scan', 'insurance', 'interation', 'safety-certificate', 'project', 'thunderbolt', 'block', 'cluster', 'deployment-unit', 'dollar', 'euro', 'pound', 'file-done', 'file-exclamation', 'file-protect', 'file-search', 'file-sync', 'gateway', 'gold', 'robot', 'shopping']
|
||||
const logoIcons = ['android', 'apple', 'windows', 'ie', 'chrome', 'github', 'aliwangwang', 'dingding', 'weibo-square', 'weibo-circle', 'taobao-circle', 'html5', 'weibo', 'twitter', 'wechat', 'youtube', 'alipay-circle', 'taobao', 'skype', 'qq', 'medium-workmark', 'gitlab', 'medium', 'linkedin', 'google-plus', 'dropbox', 'facebook', 'codepen', 'amazon', 'google', 'codepen-circle', 'alipay', 'ant-design', 'aliyun', 'zhihu', 'slack', 'slack-square', 'behance', 'behance-square', 'dribbble', 'dribbble-square', 'instagram', 'yuque', 'alibaba', 'yahoo']
|
||||
const selfIcons = ['icon-kucun_crm', 'icon-24gf-folderOpen', 'icon-qicheweixiu', 'icon-yujing', 'icon-shezhi', 'icon-shouye', 'icon-file-star', 'icon-file-set', 'icon-a-iconfontgerenzhongxin1', 'icon-yingyong']
|
||||
export default {
|
||||
name: 'Icons',
|
||||
props: {
|
||||
iconChooseVisible: {
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
icons: {
|
||||
directionIcons,
|
||||
suggestionIcons,
|
||||
editIcons,
|
||||
dataIcons,
|
||||
webIcons,
|
||||
logoIcons,
|
||||
selfIcons
|
||||
},
|
||||
choosedIcon: '',
|
||||
activeIndex: ''
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
show: {
|
||||
get: function () {
|
||||
return this.iconChooseVisible
|
||||
},
|
||||
set: function () {
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
reset () {
|
||||
this.activeIndex = ''
|
||||
},
|
||||
chooseIcon (icon) {
|
||||
this.activeIndex = icon
|
||||
this.choosedIcon = icon
|
||||
this.$message.success(`选中 ${icon}`)
|
||||
},
|
||||
ok () {
|
||||
if (this.choosedIcon === '') {
|
||||
this.$message.warning('尚未选择任何图标')
|
||||
return
|
||||
}
|
||||
this.reset()
|
||||
this.$emit('choose', this.choosedIcon)
|
||||
},
|
||||
cancel () {
|
||||
this.reset()
|
||||
this.$emit('close')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
@import "Icon";
|
||||
</style>
|
||||
Reference in New Issue
Block a user