Initial commit

This commit is contained in:
danshihao
2024-06-11 15:39:01 +08:00
commit 00acf31aa3
1589 changed files with 520803 additions and 0 deletions
+120
View File
@@ -0,0 +1,120 @@
<template>
<a-card :bordered="false">
<div>
<j-table
:can-drag="true"
:scroll="{x: '100%'}"
ref="table"
rowKey="id"
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
:loading="loading"
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
@change="handleTableChange">
<!-- 操作栏 -->
<div slot="action" class="table-action" slot-scope="{text, record}">
<a class="action-edit" @click="handleEdit(record)" >{{ $t('edit') }}</a>
<a class="action-delete" @click="handleDelete(record.id)">{{ $t('delete') }}</a>
<a class="action-delete" @click="handleShow(record.id)">查看</a>
</div>
</j-table>
</div>
</a-card>
</template>
<script>
import { JeroListMixin } from '@/mixins/JeroListMixin'
import JTable from '@comp/jero/JTable'
export default {
name: 'AsmsDomesticLawsList',
components: { JTable },
mixins: [JeroListMixin],
data () {
return {
isorter: null,
labelCol: {
span: 4
},
wrapperCol: {
span: 14
},
columns: [
{
title: '标准法规编号/标准号',
align: 'center',
width: 120,
dataIndex: 'code',
scopedSlots: { customRender: 'text' }
},
{
title: '标准法规名称/标准名称',
align: 'center',
width: 120,
dataIndex: 'name',
scopedSlots: { customRender: 'text' }
},
{
title: '法规英文名称',
align: 'center',
width: 120,
dataIndex: 'englishName',
scopedSlots: { customRender: 'text' }
},
{
title: '标准领域名称',
align: 'center',
width: 120,
dataIndex: 'focalPointName',
scopedSlots: { customRender: 'text' }
},
{
title: '实施日期',
align: 'center',
width: 120,
dataIndex: 'implementationDate',
scopedSlots: { customRender: 'text' }
},
{
title: '发布日期',
align: 'center',
width: 120,
dataIndex: 'publishDate',
scopedSlots: { customRender: 'text' }
},
{
title: '关联代替标准号',
align: 'center',
width: 120,
dataIndex: 'replaceCode',
scopedSlots: { customRender: 'text' }
},
{
title: '标准状态名称',
align: 'center',
width: 120,
dataIndex: 'standardStatus',
scopedSlots: { customRender: 'text' }
},
{
title: '同步标识',
align: 'center',
width: 120,
dataIndex: 'syncFlag_dictText',
scopedSlots: { customRender: 'text' }
},
],
url: {
list: '/docking/asms/lawsAsmsDomestic/page'
}
}
},
}
</script>
<style scoped lang="less">
@import '~@assets/less/common.less';
</style>
+222
View File
@@ -0,0 +1,222 @@
<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 :span="6">-->
<!-- <a-form-item :label="$t('personalCenter.receivedShare.pushSearch')" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
<!-- <a-input :placeholder="$t('personalCenter.receivedShare.enterPushInfo')" v-model="queryParam.title"></a-input>-->
<!-- </a-form-item>-->
<!-- </a-col>-->
<!-- <a-col :span="6">-->
<!-- <a-form-item :label="$t('personalCenter.receivedShare.owningPlate')" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
<!-- <j-dict-select-tag-->
<!-- :placeholder="$t('pleaseEnter')+$t('personalCenter.receivedShare.owningPlate')"-->
<!-- dict-code="sector"-->
<!-- v-model="queryParam.source">-->
<!-- </j-dict-select-tag>-->
<!-- </a-form-item>-->
<!-- </a-col>-->
<!-- <div style="float: right;overflow: hidden;" class="table-page-search-submitButtons">-->
<!-- <a-button type="primary" @click="searchQuery" icon="search" style="margin-left: 8px" v-has="'personalCenter:receivedShare:search'">{{ $t('query') }}</a-button>-->
<!-- <a-button @click="searchReset" icon="reload" style="margin-left: 8px">{{ $t('reset') }}</a-button>-->
<!-- </div>-->
<!-- </a-row>-->
<!-- </a-form>-->
<!-- </div>-->
<!-- 操作区域 -->
<div class="table-operator">
<a-button @click="handleAdd" type="primary" icon="plus">{{ $t('newlyAdded') }}</a-button>
<a-button @click="handleBatchDelDictItem" type="primary">批量删除原字典配置项</a-button>
<a-button @click="handleSync" type="primary">批量同步</a-button>
<!-- 批量删除 -->
<a-button icon="delete" type="primary" ghost @click="batchDel">
{{ $t('batchDelete') }}
</a-button>
</div>
<div>
<j-table
:can-drag="true"
:scroll="{x: '100%'}"
ref="table"
rowKey="id"
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
:loading="loading"
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
@change="handleTableChange">
<!-- 操作栏 -->
<div slot="action" class="table-action" slot-scope="{text, record}">
<a class="action-edit" @click="handleEdit(record)" >{{ $t('edit') }}</a>
<a class="action-delete" @click="handleDelete(record.id)">{{ $t('delete') }}</a>
<a class="action-delete" @click="handleShow(record.id)">查看</a>
</div>
</j-table>
</div>
<!-- 添加编辑 -->
<asms-interface-modal ref="modalForm" @ok="modalFormOk"/>
</a-card>
</template>
<script>
import { JeroListMixin } from '@/mixins/JeroListMixin'
import JTable from '@comp/jero/JTable'
import AsmsInterfaceModal from '@views/system/modules/AsmsInterfaceModal'
import { batchDelDictItemAsmsInterface, getAsmsInterfaceById, syncAsmsInterface } from '@api/api'
export default {
name: 'AsmsInterfaceList',
components: { AsmsInterfaceModal, JTable },
mixins: [JeroListMixin],
data () {
return {
isorter: null,
labelCol: {
span: 4
},
wrapperCol: {
span: 14
},
columns: [
{
title: 'api名称',
align: 'center',
width: 150,
dataIndex: 'apiName',
scopedSlots: { customRender: 'text' }
},
{
title: '接口类型',
align: 'center',
width: 120,
dataIndex: 'apiType_dictText',
scopedSlots: { customRender: 'text' }
},
{
title: 'api路径',
align: 'center',
width: 180,
dataIndex: 'apiUrl',
scopedSlots: { customRender: 'text' }
},
{
title: '数据字典',
align: 'center',
width: 180,
dataIndex: 'dictId_dictText',
scopedSlots: { customRender: 'text' }
},
{
title: '参数map',
align: 'center',
width: 180,
dataIndex: 'queryParamJson',
scopedSlots: { customRender: 'text' }
},
{
title: '状态',
align: 'center',
width: 100,
dataIndex: 'status_dictText',
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('operation'),
// dataIndex: 'action',
align: 'center',
width: 170,
scopedSlots: { customRender: 'action' }
}
],
url: {
list: '/docking/asms/api/lawsAsmsOpenApi/page',
delete: '/docking/asms/api/lawsAsmsOpenApi/delete',
deleteBatch: '/docking/asms/api/lawsAsmsOpenApi/deleteBatch'
}
}
},
methods: {
handleBatchDelDictItem () {
if (this.selectedRowKeys.length <= 0) {
this.$message.warning(this.$t('selectARecord'))
} else {
const ids = this.selectedRowKeys.join(',')
const that = this
this.$confirm({
title: '批量删除原字典配置项',
content: '确认批量删除原字典配置项',
onOk: function () {
that.loading = true
batchDelDictItemAsmsInterface({ 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
})
}
})
}
},
handleSync () {
if (this.selectedRowKeys.length <= 0) {
this.$message.warning(this.$t('selectARecord'))
} else {
const ids = this.selectedRowKeys.join(',')
const that = this
this.$confirm({
title: '同步',
content: '确认进行同步',
onOk: function () {
that.loading = true
syncAsmsInterface({ 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
})
}
})
}
},
handleShow (id) {
getAsmsInterfaceById({ id }).then(res => {
if (res.success) {
const arr = res.result || []
this.$success({
width: 800,
title: '查看',
content: arr.map(item => (<p>{(JSON.stringify(item) + '\n')}</p>))
})
} else {
this.$message.warn(res.message)
}
})
}
}
}
</script>
<style scoped lang="less">
@import '~@assets/less/common.less';
</style>
+138
View File
@@ -0,0 +1,138 @@
<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')}}&nbsp;<a style="font-weight: 600">{{ selectedRowKeys.length }}</a>{{ $t('term') }}&nbsp;&nbsp;
<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>
+623
View File
@@ -0,0 +1,623 @@
<template xmlns:background-color="http://www.w3.org/1999/xhtml">
<a-row :gutter="10" style="width: 100%;">
<a-col :md="12" :sm="24">
<a-card :bordered="false">
<!-- 按钮操作区域 -->
<a-row style="margin-left: 14px">
<a-button v-if="isDev" icon="plus" @click="handleAdd(1)" type="primary">{{ $t('depart.addDepartment') }}</a-button>
<a-button v-if="isDev" icon="plus" @click="handleAdd(2)" type="primary">{{ $t('depart.addSubordinate') }}</a-button>
<a-button type="primary" ghost icon="upload" @click="handleExportXls($t('depart.departmentInformation'), '.xls')">{{ $t('export') }}</a-button>
<!--<a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">-->
<!-- <a-button type="primary" icon="import">{{ $t('import') }}</a-button>-->
<!--</a-upload>-->
<a-button v-if="isDev" :title="$t('depart.deleteMultiplePiecesData')" @click="batchDel" type="default">{{ $t('batchDelete') }}</a-button>
<!--<a-button @click="refresh" type="default" icon="reload" :loading="loading">刷新</a-button>-->
</a-row>
<div style="background: #fff;padding-left:16px;height: 100%; margin-top: 5px">
<a-input-search @search="onSearch" style="width:100%;margin-top: 10px" :placeholder="$t('depart.enterDepartmentName')" />
<!-- -->
<a-col :md="10" :sm="24" class="dropdown-tree">
<template>
<a-dropdown :trigger="[this.dropTrigger]" @visibleChange="dropStatus">
<span style="user-select: none">
<a-tree
:checkable="true"
multiple
@select="onSelect"
@check="onCheck"
@rightClick="rightHandle"
:selectedKeys="selectedKeys"
:checkedKeys="checkedKeys"
:treeData="departTree"
:checkStrictly="checkStrictly"
:expandedKeys="iExpandedKeys"
:autoExpandParent="autoExpandParent"
@expand="onExpand" />
</span>
<!--新增右键点击事件,和增加添加和删除功能-->
<a-menu slot="overlay" v-if="isDev">
<a-menu-item @click="handleAdd(3)" key="1">{{ $t('add') }}</a-menu-item>
<a-menu-item @click="handleDelete" key="2">{{ $t('delete') }}</a-menu-item>
<a-menu-item @click="closeDrop" key="3">{{ $t('cancel') }}</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)">{{ $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>
</div>
<!---- author:os_chengtgen -- date:20190827 -- for:切换父子勾选模式 =======------>
</a-col>
<a-col :md="12" :sm="24">
<a-tabs defaultActiveKey="1">
<a-tab-pane :tab="$t('depart.essentialInformation')" 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" prop="departName" :label="$t('depart.organizationName')">
<a-input :placeholder="$t('depart.enterOrganizationDepartment')" v-model="model.departName" />
</a-form-model-item>
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="$t('depart.superiorDepartment')">
<a-tree-select
style="width:100%"
:dropdownStyle="{maxHeight:'200px',overflow:'auto'}"
:treeData="treeData"
:disabled="disable"
v-model="model.parentId"
:placeholder="$t('nothing')">
</a-tree-select>
</a-form-model-item>
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" prop="orgCode" :label="$t('depart.organizationCode')">
<a-input disabled :placeholder="$t('pleaseEnter') + $t('depart.organizationCode')" v-model="model.orgCode" />
</a-form-model-item>
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" prop="orgCategory" :label="$t('depart.organizationType')">
<template v-if="orgCategoryDisabled">
<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" :label="$t('sort')">
<a-input-number v-model="model.departOrder" />
</a-form-model-item>
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" :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('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('remarks')">
<a-textarea :placeholder="$t('pleaseEnter') + $t('remarks')" v-model="model.memo" />
</a-form-model-item>
</a-form-model>
<div class="anty-form-btn" v-if="isDev">
<a-button @click="emptyCurrForm" type="default" htmlType="button" icon="sync">{{ $t('reset') }}</a-button>
<a-button @click="submitCurrForm" type="primary" htmlType="button" icon="form">{{ $t('preservation') }}</a-button>
</div>
</a-card>
<a-card v-else>
<a-empty>
<span slot="description"> {{ $t('depart.selectDepartmentFirst') }} </span>
</a-empty>
</a-card>
</a-tab-pane>
<!--<a-tab-pane :tab="$t('depart.departmentAuth')" 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 { queryDepartTreeList, searchByKeywords, deleteByDepartId } from '@/api/api'
import { httpAction, postAction } from '@/api/manage'
import { JeroListMixin } from '@/mixins/JeroListMixin'
// import DepartAuthModal from './modules/DepartAuthModal'
// 表头
export default {
name: 'DepartList',
mixins: [JeroListMixin],
components: {
// DepartAuthModal,
DepartModal
},
data () {
return {
// 是否开发环境(线上需隐藏按钮)
isDev: process.env.VUE_APP_TAG_FLAG === '0',
iExpandedKeys: [],
loading: false,
autoExpandParent: true,
currFlowId: '',
currFlowName: '',
disable: true,
treeData: [],
visible: false,
departTree: [],
rightClickSelectedKey: '',
rightClickSelectedOrgCode: '',
hiding: true,
model: {},
dropTrigger: '',
depart: {},
columns: [
{
title: this.$t('depart.organizationName'),
dataIndex: 'departName'
},
{
title: this.$t('depart.organizationType'),
align: 'center',
dataIndex: 'orgType'
},
{
title: this.$t('depart.organizationCode'),
dataIndex: 'orgCode'
},
{
title: this.$t('phoneNumber'),
dataIndex: 'mobile'
},
{
title: this.$t('depart.fax'),
dataIndex: 'fax'
},
{
title: this.$t('address'),
dataIndex: 'address'
},
{
title: this.$t('sort'),
align: 'center',
dataIndex: 'departOrder'
},
{
title: this.$t('operation'),
align: 'center',
dataIndex: 'action',
scopedSlots: { customRender: 'action' }
}
],
disableSubmit: false,
checkedKeys: [],
selectedKeys: [],
autoIncr: 1,
currSelected: {},
allTreeKeys: [],
checkStrictly: true,
labelCol: {
xs: { span: 24 },
sm: { span: 5 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 }
},
graphDatasource: {
nodes: [],
edges: []
},
validatorRules: {
departName: [{ required: true, message: this.$t('depart.enterOrganizationDepartment') + '!' }],
orgCode: [{ required: true, message: this.$t('pleaseEnter') + this.$t('depart.organizationCode') + '!' }],
orgCategory: [{ required: true, message: this.$t('pleaseSelect') + this.$t('depart.organizationType') + '!' }],
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.departTree = []
queryDepartTreeList().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.departTree.push(temp)
that.setThisExpandedKeys(temp)
that.getAllKeys(temp)
// console.log(temp.id)
}
this.loading = false
}
})
},
setThisExpandedKeys (node) {
if (node.children && node.children.length > 0) {
this.iExpandedKeys.push(node.key)
for (let a = 0; a < node.children.length; a++) {
this.setThisExpandedKeys(node.children[a])
}
}
},
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
},
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(this.$t('depart.atLeastSelectARecord'))
} else {
let ids = ''
for (let a = 0; a < this.checkedKeys.length; a++) {
ids += this.checkedKeys[a] + ','
}
const that = this
this.$confirm({
title: this.$t('confirmDeletion'),
content: this.$t('depart.sureDeleteSelected') + this.checkedKeys.length + this.$t('depart.pieceData'),
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.loadTree()
}
},
nodeModalOk () {
this.loadTree()
},
nodeModalClose () {
},
hide () {
console.log(111)
this.visible = false
},
onCheck (checkedKeys, info) {
console.log('onCheck', checkedKeys, info)
this.hiding = false
// ---- 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'
},
getCurrSelectedTitle () {
return !this.currSelected.title ? '' : this.currSelected.title
},
onClearSelected () {
this.hiding = true
this.checkedKeys = []
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(valid => {
if (valid) {
if (!this.currSelected.id) {
this.$message.warning(this.$t('depart.clickCheckUpdateDepart'))
return
}
httpAction(this.url.edit, this.currSelected, 'post').then((res) => {
if (res.success) {
this.$message.success(this.$t('savedSuccessfully'))
this.loadTree()
} else {
this.$message.warning(res.message)
}
})
}
})
},
emptyCurrForm () {
// 不被重置的字段
const reserveField = ['parentId', 'orgCode']
const temp = {}
reserveField.forEach(key => {
temp[key] = this.model[key]
})
this.$refs.form.resetFields()
this.model = temp
},
nodeSettingFormSubmit () {
this.$refs.form.validate(valid => {
if (valid) {
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 = this.$t('newlyAdded')
} else if (num === 2) {
const key = this.currSelected.key
if (!key) {
this.$message.warning(this.$t('depart.selectSuperiorDepartmentFirst'))
return false
}
this.$refs.departModal.add(this.selectedKeys)
this.$refs.departModal.title = this.$t('newlyAdded')
} else {
this.$refs.departModal.add(this.rightClickSelectedKey)
this.$refs.departModal.title = this.$t('newlyAdded')
}
},
handleDelete () {
const that = this
this.$confirm({
title: this.$t('confirmDeletion'),
content: this.$t('depart.deleteDepartmentData'),
onOk: () => {
deleteByDepartId({ id: that.rightClickSelectedKey }).then((resp) => {
if (resp.success) {
// 删除成功后,去除已选中中的数据
that.checkedKeys.splice(that.checkedKeys.findIndex(key => key === that.rightClickSelectedKey), 1)
that.$message.success(this.$t('deleteSucceeded'))
that.loadTree()
// 删除后同步清空右侧基本信息内容
const orgCode = that.model.orgCode
if (orgCode && orgCode === that.rightClickSelectedOrgCode) {
that.onClearSelected()
}
} else {
that.$message.warning(this.$t('deletionFailed'))
}
})
}
})
},
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
},
closeAll () {
this.iExpandedKeys = []
},
checkALL () {
this.checkStriccheckStrictlytly = false
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
}
},
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:切换父子勾选模式 =======------
},
created () {
this.currFlowId = this.$route.params.id
this.currFlowName = this.$route.params.name
// this.loadTree()
}
}
</script>
<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按钮间距 */
.ant-btn {
margin-left: 3px
}
.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;
}
.dropdown-tree {
padding-bottom: 30px;
}
</style>
+673
View File
@@ -0,0 +1,673 @@
<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>
+203
View File
@@ -0,0 +1,203 @@
<template>
<a-row :gutter="10" style="width: 100%;">
<a-col :md="8" :sm="24">
<a-card :bordered="false">
<div style="background: #fff;padding-left:16px;height: 100%; margin-top: 5px">
<a-input-search @search="onSearch" style="width:100%;margin-top: 10px" placeholder="请输入部门名称"/>
<!-- -->
<template v-if="userIdentity === '2' && departTree.length>0">
<!--组织机构-->
<a-tree
showLine
:selectedKeys="selectedKeys"
:checkStrictly="true"
@select="onSelect"
:dropdownStyle="{maxHeight:'200px',overflow:'auto'}"
:treeData="departTree"
:autoExpandParent="autoExpandParent"
:expandedKeys="iExpandedKeys"
@expand="onExpand"
/>
</template>
<div style="margin-top: 24px;" v-else-if="userIdentity === '2' && departTree.length===0">
<h3><span>您的部门下暂无有效部门信息</span></h3>
</div>
<div style="margin-top: 24px;" v-else><h3>普通员工暂无此权限</h3></div>
</div>
</a-card>
</a-col>
<a-col :md="16" :sm="24">
<a-card :bordered="false">
<a-tabs defaultActiveKey="2" @change="callback">
<a-tab-pane tab="基本信息" key="1" forceRender>
<Dept-Base-Info ref="DeptBaseInfo"></Dept-Base-Info>
</a-tab-pane>
<a-tab-pane tab="用户信息" key="2">
<Dept-User-Info ref="DeptUserInfo" @clearSelectedDepartKeys="clearSelectedDepartKeys"></Dept-User-Info>
</a-tab-pane>
</a-tabs>
</a-card>
</a-col>
</a-row>
</template>
<script>
import DeptBaseInfo from './modules/DeptBaseInfo'
import DeptUserInfo from './modules/DeptUserInfo'
import { queryMyDepartTreeList, searchByKeywords } from '@/api/api'
import { JeroListMixin } from '@/mixins/JeroListMixin'
export default {
name: 'DepartUserList',
mixins: [JeroListMixin],
components: {
// DeptRoleInfo,
DeptBaseInfo,
DeptUserInfo
},
data () {
return {
currentDeptId: '',
iExpandedKeys: [],
loading: false,
autoExpandParent: true,
currFlowId: '',
currFlowName: '',
disable: true,
treeData: [],
visible: false,
departTree: [],
rightClickSelectedKey: '',
hiding: true,
model: {},
dropTrigger: '',
depart: {},
disableSubmit: false,
checkedKeys: [],
selectedKeys: [],
autoIncr: 1,
currSelected: {},
form: this.$form.createForm(this),
labelCol: {
xs: { span: 24 },
sm: { span: 5 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 }
},
graphDatasource: {
nodes: [],
edges: []
},
userIdentity: ''
}
},
methods: {
callback (key) {
// console.log(key)
},
loadData () {
this.refresh()
},
clearSelectedDepartKeys () {
this.checkedKeys = []
this.selectedKeys = []
this.currentDeptId = ''
this.$refs.DeptUserInfo.currentDeptId = ''
},
loadTree () {
const that = this
that.treeData = []
that.departTree = []
queryMyDepartTreeList().then((res) => {
if (res.success && res.result) {
for (let i = 0; i < res.result.length; i++) {
const temp = res.result[i]
that.treeData.push(temp)
that.departTree.push(temp)
that.setThisExpandedKeys(temp)
// console.log(temp.id)
}
this.loading = false
}
that.userIdentity = res.message
})
},
setThisExpandedKeys (node) {
// 只展开一级目录
if (node.children && node.children.length > 0) {
this.iExpandedKeys.push(node.key)
// 下方代码放开注释则默认展开所有节点
/**
for (let a = 0; a < node.children.length; a++) {
this.setThisExpandedKeys(node.children[a])
}
*/
}
},
refresh () {
this.loading = true
this.loadTree()
},
onExpand (expandedKeys) {
// console.log('onExpand', expandedKeys)
// if not set autoExpandParent to false, if children expanded, parent can not collapse.
// or, you can remove all expanded children keys.
this.iExpandedKeys = expandedKeys
this.autoExpandParent = false
},
onSearch (value) {
const that = this
if (value) {
searchByKeywords({ keyWord: value, myDeptSearch: '1' }).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.loadTree()
}
},
onCheck (checkedKeys, e) {
const record = e.node.dataRef
this.checkedKeys = []
this.currentDeptId = record.id
this.checkedKeys.push(record.id)
this.$refs.DeptBaseInfo.open(record)
this.$refs.DeptUserInfo.open(record)
this.hiding = false
},
onSelect (selectedKeys, e) {
if (this.selectedKeys[0] !== selectedKeys[0]) {
this.selectedKeys = [selectedKeys[0]]
}
const record = e.node.dataRef
this.checkedKeys.push(record.id)
this.$refs.DeptBaseInfo.open(record)
this.$refs.DeptUserInfo.onClearSelected()
this.$refs.DeptUserInfo.open(record)
}
},
created () {
this.currFlowId = this.$route.params.id
this.currFlowName = this.$route.params.name
// this.loadTree()
}
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>
+138
View File
@@ -0,0 +1,138 @@
<template>
<j-modal
:width="modalWidth"
:style="modalStyle"
:visible="visible"
switchFullscreen
:maskClosable="false"
@cancel="handleCancel">
<template slot="footer">
<a-button @click="handleCancel">{{ $t('close') }}</a-button>
</template>
<a-table
ref="table"
rowKey="id"
size="middle"
:columns="columns"
:loading="loading"
:dataSource="dataSource"
:pagination="false">
<span slot="action" slot-scope="text, record">
<a @click="handleBack(record.id)"><a-icon type="redo"/>{{ $t('dict.dictFetch') }}</a>
<a-divider type="vertical"/>
<a @click="handleDelete(record.id)"><a-icon type="scissor"/>{{ $t('userRecycle.completelyDelete') }}</a>
</span>
</a-table>
</j-modal>
</template>
<script>
import { getAction, postAction } from '@/api/manage'
export default {
name: 'DictDeleteList',
data () {
return {
modalWidth: '90%',
modalStyle: { top: '20px' },
title: this.$t('operation'),
visible: false,
loading: false,
dataSource: [],
columns: [
{
title: '#',
dataIndex: '',
key: 'rowIndex',
width: 120,
align: 'center',
customRender: function (t, r, index) {
return parseInt(index) + 1
}
},
{
title: this.$t('dict.dictionaryName'),
align: 'left',
dataIndex: 'dictName'
},
{
title: this.$t('dict.dictionaryNumber'),
align: 'left',
dataIndex: 'dictCode'
},
{
title: this.$t('description'),
align: 'left',
dataIndex: 'description'
},
{
title: this.$t('operation'),
dataIndex: 'action',
align: 'center',
scopedSlots: { customRender: 'action' }
}
]
}
},
methods: {
handleCancel () {
this.visible = false
// 回收站字典列表刷新
this.$emit('refresh')
},
show () {
this.visible = true
this.loadData()
},
loadData () {
this.loading = true
getAction('/sys/dict/deleteList').then(res => {
this.loading = false
if (res.success) {
this.dataSource = res.result
} else {
this.$message.warning(res.message)
}
})
},
handleBack (id) {
postAction('/sys/dict/back/' + id).then(res => {
if (res.success) {
this.$message.success(res.message)
this.loadData()
} else {
this.$message.warning(res.message)
}
})
},
handleDelete (id) {
this.$confirm({
title: this.$t('dict.completeDeleteDict'),
content: (<div>
<p>{ this.$t('dict.sureCompleteDeleteDict') }</p>
<p style="color:red;">{ this.$t('dict.deleteDictCannotRestore') }</p>
</div>),
centered: false,
onOk: () => {
const that = this
postAction('/sys/dict/deletePhysic/' + id).then((res) => {
if (res.success) {
this.$message.success(res.message)
this.loadData()
} else {
that.$message.warning(res.message)
}
})
}
})
}
}
}
</script>
<style scoped>
</style>
+248
View File
@@ -0,0 +1,248 @@
<template>
<a-card :bordered="false">
<!-- 抽屉 -->
<a-drawer
:title="$t('dict.dictList')"
width="800"
@close="onClose"
:visible="visible"
>
<!-- 抽屉内容的border -->
<div
:style="{
padding:'10px',
border: '1px solid #e9e9e9',
background: '#fff',
}">
<div class="table-page-search-wrapper">
<a-form layout="inline" :form="form" @keyup.enter.native="searchQuery">
<a-row :gutter="10">
<a-col :md="8" :sm="12">
<a-form-item :label="$t('name')">
<j-input style="width: 120px;" :placeholder="$t('pleaseEnter') + $t('name')" v-model="queryParam.itemText"></j-input>
</a-form-item>
</a-col>
<a-col :md="9" :sm="24">
<a-form-item :label="$t('status')" style="width: 170px" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-select
:placeholder="$t('pleaseSelect')"
v-model="queryParam.status"
>
<a-select-option value="1">{{ $t('normal') }}</a-select-option>
<a-select-option value="0">{{ $t('disable') }}</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :md="7" :sm="24">
<span style="float: right;" class="table-page-search-submitButtons">
<a-button icon="search" type="primary" @click="searchQuery">{{ $t('query') }}</a-button>
<a-button icon="reload" type="primary" ghost @click="searchReset" style="margin-left: 8px">{{ $t('reset') }}</a-button>
</span>
</a-col>
</a-row>
<a-row>
<a-col :md="2" :sm="24">
<a-button style="margin-bottom: 10px" icon="plus" type="primary" @click="handleAdd" v-if="model.isReadOnly === IsReadOnlyEnums.configurable.value || model.isReadOnly === IsReadOnlyEnums.subConfigurable.value">{{ $t('newlyAdded') }}</a-button>
</a-col>
</a-row>
</a-form>
</div>
<div>
<j-table
ref="table"
can-drag
:class="{'tree-table': attributeType === TagsAttributeTypeEnums.TREE.value}"
:bordered="true"
size="middle"
rowKey="id"
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
:loading="loading"
:scroll="{x: '100%', y: yScrollHeight}"
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
@change="handleTableChange"
:rowClassName="getRowClassname"
>
<div slot="action" class="table-action" slot-scope="{text, record}">
<a class="action-edit" v-if="record.isReadOnly === IsReadOnlyEnums.configurable.value || record.isReadOnly === IsReadOnlyEnums.subConfigurable.value" @click="handleEdit(record)" v-has="'sys:dict:operation'">{{ $t('edit') }}</a>
<a-divider type="vertical" v-if="record.isReadOnly === IsReadOnlyEnums.configurable.value || record.isReadOnly === IsReadOnlyEnums.subConfigurable.value" @click="handleDelete(record.id)" v-has="'sys:dict:operation'"/>
<a class="table-del" v-if="record.isReadOnly === IsReadOnlyEnums.configurable.value || record.isReadOnly === IsReadOnlyEnums.subConfigurable.value" @click="handleDelete(record.id)" v-has="'sys:dict:operation'">{{ $t('delete') }}</a>
</div>
</j-table>
</div>
</div>
</a-drawer>
<dict-item-modal ref="modalForm" @ok="modalFormOk"></dict-item-modal> <!-- 字典数据 -->
</a-card>
</template>
<script>
import pick from 'lodash.pick'
import { filterObj } from '@/utils/util'
import DictItemModal from './modules/DictItemModal'
import { JeroListMixin } from '@/mixins/JeroListMixin'
import JInput from '@/components/jero/JInput'
import { IsReadOnlyEnums, TagsAttributeTypeEnums } from '../../enums/commonEnums'
import JTable from '../../components/jero/JTable'
export default {
name: 'DictItemList',
mixins: [JeroListMixin],
components: { DictItemModal, JInput, JTable },
data () {
return {
IsReadOnlyEnums,
TagsAttributeTypeEnums,
columns: [
{
title: this.$t('name'),
align: 'center',
ellipsis: true,
dataIndex: 'itemText'
},
{
title: this.$t('englishName'),
align: 'center',
ellipsis: true,
dataIndex: 'enName'
},
{
title: this.$t('dict.dataValue'),
align: 'center',
width: 150,
dataIndex: 'itemValue'
},
{
title: this.$t('operation'),
dataIndex: 'action',
align: 'center',
width: 150,
scopedSlots: { customRender: 'action' }
}
],
queryParam: {
dictId: '',
dictName: '',
itemText: '',
delFlag: '1',
status: []
},
isReadOnly: IsReadOnlyEnums.configurable.value,
title: this.$t('operation'),
visible: false,
screenWidth: 1200,
model: {},
dictId: '',
status: 1,
labelCol: {
xs: { span: 5 },
sm: { span: 5 }
},
wrapperCol: {
xs: { span: 12 },
sm: { span: 12 }
},
form: this.$form.createForm(this),
validatorRules: {
itemText: { rules: [{ required: true, message: this.$t('pleaseEnter') + this.$t('name') + '!' }] },
itemValue: { rules: [{ required: true, message: this.$t('pleaseEnter') + this.$t('dict.dataValue') + '!' }] }
},
url: {
list: '/sys/dictItem/page',
delete: '/sys/dictItem/delete',
deleteBatch: '/sys/dictItem/deleteBatch'
},
// 标签类型
attributeType: undefined
}
},
created () {
// 当页面初始化时,根据屏幕大小来给抽屉设置宽度
this.resetScreenSize()
},
methods: {
add (dictId) {
this.dictId = dictId
this.edit({})
},
edit (record) {
if (record.id) {
this.dictId = record.id
this.isReadOnly = record.isReadOnly // 父级readonly的值 用于判断是否可以编辑
}
this.queryParam = {}
this.form.resetFields()
this.model = Object.assign({}, record)
this.attributeType = Number(this.model.attributeType) // 标签类型,用于辨别是下拉框还是树形结构
this.model.dictId = this.dictId
this.model.status = this.status
this.visible = true
this.$nextTick(() => {
this.form.setFieldsValue(pick(this.model, 'itemText', 'itemValue'))
})
// 当其它模块调用该模块时,调用此方法加载字典数据
this.loadData()
},
getQueryParams () {
// update--begin--autor:wangshuai-----date:20191204------for:清空总条数 teambition JT-113------
this.ipagination.total = 0
// update--end--autor:wangshuai-----date:20191204------for:清空总条数 teambition JT-113------
const param = Object.assign({}, this.queryParam)
param.dictId = this.dictId
param.field = this.getQueryField()
param.pageNo = this.ipagination.current
param.pageSize = this.ipagination.pageSize
if (this.superQueryParams) {
param.superQueryParams = encodeURI(this.superQueryParams)
param.superQueryMatchType = this.superQueryMatchType
}
return filterObj(param)
},
// 添加字典数据
handleAdd () {
this.$refs.modalForm.add(this.dictId)
this.$refs.modalForm.title = this.$t('newlyAdded')
},
showDrawer () {
this.visible = true
},
onClose () {
this.visible = false
this.form.resetFields()
this.dataSource = []
},
// 抽屉的宽度随着屏幕大小来改变
resetScreenSize () {
const screenWidth = document.body.clientWidth
if (screenWidth < 600) {
this.screenWidth = screenWidth
} else {
this.screenWidth = 600
}
},
// update--begin--autor:wangshuai-----date:20191204------for:系统管理 数据字典禁用和正常区别开,添加背景颜色 teambition JT-22------
// 增加样式方法返回值
getRowClassname (record) {
if ((record.status + '') === '0') {
return 'data-rule-invalid'
}
}
// update--end--autor:wangshuai-----date:20191204------for:系统管理 数据字典禁用和正常区别开,添加背景颜色 teambition JT-22------
}
}
</script>
<style lang="less" scoped>
//update--begin--autor:wangshuai-----date:20191204------for:系统管理 数据字典禁用和正常区别开,添加背景颜色 teambition JT-22------
/deep/ .data-rule-invalid{
background: #f4f4f4;
color: #bababa;
}
/deep/ .table-page-search-wrapper .ant-form-inline .ant-form-item > .ant-form-item-label {
min-width: 40px;
}
//update--begin--autor:wangshuai-----date:20191204------for:系统管理 数据字典禁用和正常区别开,添加背景颜色 teambition JT-22------
</style>
+253
View File
@@ -0,0 +1,253 @@
<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="7" :sm="8">
<a-form-item :label="$t('dict.dictionaryName')" :labelCol="{span: 6}" :wrapperCol="{span: 14, offset: 1}">
<j-input :placeholder="$t('pleaseEnter')+$t('dict.dictionaryName')"
v-model="queryParam.dictName"></j-input>
</a-form-item>
</a-col>
<a-col :md="7" :sm="8">
<a-form-item :label="$t('dict.dictionaryNumber')" :labelCol="{span: 6}" :wrapperCol="{span: 14, offset: 1}">
<j-input :placeholder="$t('pleaseEnter')+$t('dict.dictionaryNumber')"
v-model="queryParam.dictCode"></j-input>
</a-form-item>
</a-col>
<div style="float: right;overflow: hidden;" class="table-page-search-submitButtons">
<a-col :md="7" :sm="8">
<a-button type="primary" @click="searchQuery" icon="search">{{ $t('query') }}</a-button>
<a-button type="primary" @click="searchReset" ghost icon="reload" style="margin-left: 8px">{{ $t('reset')
}}
</a-button>
</a-col>
</div>
</a-row>
</a-form>
</div>
<div class="table-operator" style="border-top: 5px">
<a-button @click="handleAdd" type="primary" icon="plus" v-has="'sys:dict:operation'">{{ $t('add') }}</a-button>
<a-button type="primary" icon="upload" ghost @click="handleExportXls($t('dict.dictInfo'))"
v-has="'sys:dict:operation'">{{ $t('export') }}
</a-button>
<a-upload v-has="'sys:dict:operation'" name="file" :showUploadList="false" :multiple="false"
:headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
<a-button type="primary" icon="download" ghost>{{ $t('import') }}</a-button>
</a-upload>
<a-button type="primary" icon="sync" ghost v-has="'sys:dict:operation'" @click="refleshCache()">
{{ $t('dict.refreshCache') }}
</a-button>
<a-button type="primary" icon="hdd" ghost @click="openDeleteList">{{ $t('recycleBin') }}</a-button>
</div>
<j-table
rowKey="id"
can-drag
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
:scroll="{x: '100%', y: yScrollHeight}"
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
:operation-list="operationList"
@change="handleTableChange"
@operationClick="operationClick"
>
</j-table>
<dict-modal ref="modalForm" @ok="modalFormOk"></dict-modal> <!-- 字典类型 -->
<dict-item-list v-show="false" ref="dictItemList"></dict-item-list>
<dict-delete-list ref="dictDeleteList" @refresh="() =>loadData()"></dict-delete-list>
</a-card>
</template>
<script>
import { filterObj } from '@/utils/util'
import { JeroListMixin } from '@/mixins/JeroListMixin'
import DictModal from './modules/DictModal'
import DictItemList from './DictItemList'
import DictDeleteList from './DictDeleteList'
import JInput from '@/components/jero/JInput'
import { getAction } from '@/api/manage'
import { UI_CACHE_DB_DICT_DATA } from '@/store/mutation-types'
import Vue from 'vue'
import JTable from '../../components/jero/JTable'
import { IsReadOnlyEnums } from '../../enums/commonEnums'
export default {
name: 'DictList',
mixins: [JeroListMixin],
components: { DictModal, DictItemList, DictDeleteList, JInput, JTable },
data () {
return {
description: '这是数据字典页面',
visible: false,
// 查询条件
queryParam: {
dictCode: '',
dictName: ''
},
// 表头
columns: [
{
title: '#',
dataIndex: '',
key: 'rowIndex',
width: 60,
align: 'center',
customRender: function (t, r, index) {
return parseInt(index) + 1
}
},
{
title: this.$t('dict.dictionaryName'),
align: 'left',
width: 100,
dataIndex: 'dictName',
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('dict.dictionaryEnglishName'),
align: 'left',
width: 100,
dataIndex: 'dictEnglishName',
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('dict.dictionaryNumber'),
align: 'left',
width: 100,
dataIndex: 'dictCode',
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('description'),
align: 'left',
dataIndex: 'description',
width: 200,
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('operation'),
// dataIndex: 'action',
align: 'left',
width: 170,
scopedSlots: { customRender: 'action' }
}
],
canOpeFlag: process.env.VUE_APP_TAG_FLAG === '0', // 是否可以操作编辑和删除,开发环境可以
dict: '',
labelCol: {
xs: { span: 8 },
sm: { span: 5 }
},
wrapperCol: {
xs: { span: 16 },
sm: { span: 19 }
},
url: {
list: '/sys/dict/page',
delete: '/sys/dict/delete',
exportXlsUrl: 'sys/dict/exportXls',
importExcelUrl: 'sys/dict/importExcel',
refleshCache: 'sys/dict/refleshCache',
queryAllDictItems: 'sys/dict/queryAllDictItems'
},
operationList: [
// 字典配置
{
text: this.$t('system.tag.dictionaryConfiguration'),
clickEvent: 'editDictItem'
},
// 编辑
{
text: this.$t('edit'),
clickEvent: 'handleEdit',
has: 'sys:dict:operation',
show: (record) => {
return (this.canOpeFlag || record.isReadOnly === IsReadOnlyEnums.configurable.value)
}
},
// 删除
{
text: this.$t('delete'),
clickEvent: 'handleDelete',
has: 'sys:dict:operation',
show: (record) => {
return (this.canOpeFlag || record.isReadOnly === IsReadOnlyEnums.configurable.value)
}
}
]
}
},
computed: {
importExcelUrl: function () {
return `${window._CONFIG.domianURL}/${this.url.importExcelUrl}`
}
},
methods: {
getQueryParams () {
const param = Object.assign({}, this.queryParam, this.isorter)
param.field = this.getQueryField()
param.pageNo = this.ipagination.current
param.pageSize = this.ipagination.pageSize
if (this.superQueryParams) {
param.superQueryParams = encodeURI(this.superQueryParams)
param.superQueryMatchType = this.superQueryMatchType
}
return filterObj(param)
},
// 取消选择
cancelDict () {
this.dict = ''
this.visible = false
this.loadData()
},
// 编辑字典数据
editDictItem (record) {
this.$refs.dictItemList.edit(record)
},
// 重置字典类型搜索框的内容
searchReset () {
const that = this
that.queryParam.dictName = ''
that.queryParam.dictCode = ''
that.loadData(this.ipagination.current)
},
openDeleteList () {
this.$refs.dictDeleteList.show()
},
refleshCache () {
getAction(this.url.refleshCache).then((res) => {
if (res.success) {
// 重新加载缓存
getAction(this.url.queryAllDictItems).then((res) => {
if (res.success) {
Vue.ls.remove(UI_CACHE_DB_DICT_DATA)
Vue.ls.set(UI_CACHE_DB_DICT_DATA, res.result, 7 * 24 * 60 * 60 * 1000)
}
})
this.$message.success(this.$t('dict.refreshCache') + this.$t('dict.complete') + '!')
}
}).catch(e => {
this.$message.warn(this.$t('dict.refreshCache') + this.$t('dict.failed') + '!')
console.log('刷新失败', e)
})
}
},
watch: {
openKeys (val) {
console.log('openKeys', val)
}
}
}
</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: 60px;
}
</style>
+38
View File
@@ -0,0 +1,38 @@
<template>
<a-card :bordered="false">
<!--导航区域-->
<div>
<a-tabs defaultActiveKey="1">
<a-tab-pane :tab="$t('log.loginLog')" key="1">
<login-log-list></login-log-list>
</a-tab-pane>
<a-tab-pane :tab="$t('log.operationLog')" key="2">
<operator-log-list></operator-log-list>
</a-tab-pane>
</a-tabs>
</div>
</a-card>
</template>
<script>
import LoginLogList from './log/LoginLogList'
import OperatorLogList from './log/OperatorLogList'
export default {
name: 'LogList',
components: {
LoginLogList,
OperatorLogList
},
data () {
return {
}
},
methods: {
}
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>
+228
View File
@@ -0,0 +1,228 @@
<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>已选择&nbsp;<a style="font-weight: 600">{{
selectedRowKeys.length }}</a>&nbsp;&nbsp;
<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>
+188
View File
@@ -0,0 +1,188 @@
<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>
+205
View File
@@ -0,0 +1,205 @@
<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>已选择&nbsp;<a style="font-weight: 600">{{
selectedRowKeys.length }}</a>&nbsp;&nbsp;
<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>
+287
View File
@@ -0,0 +1,287 @@
<template>
<a-card :bordered="false">
<!-- 查询区域 -->
<div class="table-page-search-wrapper">
<a-form-model layout="inline" :model="queryParam" @keyup.enter.native="searchQuery">
<a-row :gutter="24">
<a-col :md="6" :sm="10">
<a-form-model-item label="任务类名" prop="jobClassName">
<a-input placeholder="请输入任务类名" v-model="queryParam.jobClassName"></a-input>
</a-form-model-item>
</a-col>
<a-col :md="6" :sm="10">
<a-form-model-item label="任务状态" prop="status">
<a-select style="width: 220px" v-model="queryParam.status" placeholder="请选择状态">
<a-select-option value="">全部</a-select-option>
<a-select-option value="0">正常</a-select-option>
<a-select-option value="-1">停止</a-select-option>
</a-select>
</a-form-model-item>
</a-col>
<a-col :md="6" :sm="10" >
<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-model>
</div>
<!-- 操作按钮区域 -->
<div class="table-operator">
<a-button @click="handleAdd" type="primary" icon="plus">新增</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>
<a-dropdown v-if="selectedRowKeys.length > 0">
<a-menu slot="overlay">
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
</a-menu>
<a-button style="margin-left: 8px"> 批量操作 <a-icon type="down" /></a-button>
</a-dropdown>
</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
ref="table"
size="middle"
bordered
rowKey="id"
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
:loading="loading"
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
@change="handleTableChange">
<!-- 字符串超长截取省略号显示-->
<span slot="description" slot-scope="text">
<j-ellipsis :value="text" :length="20" />
</span>
<span slot="parameterRender" slot-scope="text">
<j-ellipsis :value="text" :length="20" />
</span>
<span slot="action" slot-scope="text, record">
<a @click="resumeJob(record)" v-if="record.status==='-1'">启动</a>
<a @click="pauseJob(record)" v-if="record.status==='0'">停止</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 @click="executeImmediately(record)">立即执行</a></a-menu-item>
<a-menu-item><a @click="handleEdit(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="customRenderStatus" slot-scope="status">
<a-tag v-if="status==='0'" color="green">已启动</a-tag>
<a-tag v-if="status==='-1'" color="orange">已暂停</a-tag>
</template>
</a-table>
</div>
<!-- table区域-end -->
<!-- 表单区域 -->
<quartzJob-modal ref="modalForm" @ok="modalFormOk"></quartzJob-modal>
</a-card>
</template>
<script>
import QuartzJobModal from './modules/QuartzJobModal'
import { getAction } from '@/api/manage'
import { JeroListMixin } from '@/mixins/JeroListMixin'
import JEllipsis from '@/components/jero/JEllipsis'
export default {
name: 'QuartzJobList',
mixins: [JeroListMixin],
components: {
QuartzJobModal,
JEllipsis
},
data () {
return {
description: '定时任务在线管理',
// 查询条件
queryParam: {},
// 表头
columns: [
{
title: '#',
dataIndex: '',
key: 'rowIndex',
width: 60,
align: 'center',
customRender: function (t, r, index) {
return parseInt(index) + 1
}
},
{
title: '任务类名',
align: 'center',
dataIndex: 'jobClassName',
sorter: true
/* customRender:function (text) {
return "*"+text.substring(9,text.length);
} */
},
{
title: 'cron表达式',
align: 'center',
dataIndex: 'cronExpression'
},
{
title: '参数',
align: 'center',
width: 150,
dataIndex: 'parameter',
scopedSlots: { customRender: 'parameterRender' }
},
{
title: '描述',
align: 'center',
width: 250,
dataIndex: 'description',
scopedSlots: { customRender: 'description' }
},
{
title: '状态',
align: 'center',
dataIndex: 'status',
scopedSlots: { customRender: 'customRenderStatus' },
filterMultiple: false,
filters: [
{ text: '已启动', value: '0' },
{ text: '已暂停', value: '-1' }
]
},
{
title: '操作',
dataIndex: 'action',
align: 'center',
width: 180,
scopedSlots: { customRender: 'action' }
}
],
url: {
list: '/sys/quartzJob/page',
delete: '/sys/quartzJob/delete',
deleteBatch: '/sys/quartzJob/deleteBatch',
pause: '/sys/quartzJob/pause',
resume: '/sys/quartzJob/resume',
exportXlsUrl: 'sys/quartzJob/exportXls',
importExcelUrl: 'sys/quartzJob/importExcel',
execute: 'sys/quartzJob/execute'
}
}
},
computed: {
importExcelUrl: function () {
return `${window._CONFIG.domianURL}/${this.url.importExcelUrl}`
}
},
methods: {
// 筛选需要重写handleTableChange
handleTableChange (pagination, filters, sorter) {
// 分页、排序、筛选变化时触发
// TODO 筛选
if (Object.keys(sorter).length > 0) {
this.isorter.column = sorter.field
this.isorter.order = sorter.order === 'ascend' ? 'asc' : 'desc'
}
// 这种筛选方式只支持单选
// update-begin-author:liusq date:20210624 for:前台定时任务无法翻页 #2666
if (filters && Object.keys(filters).length > 0 && filters.status) {
this.filters.status = filters.status[0]
}
// update-end-author:liusq date:20210624 for:前台定时任务无法翻页 #2666
this.ipagination = pagination
this.loadData()
},
pauseJob: function (record) {
const that = this
// 暂停定时任务
this.$confirm({
title: '确认暂停',
content: '是否暂停选中任务?',
onOk: function () {
getAction(that.url.pause, { id: record.id }).then((res) => {
if (res.success) {
that.$message.success(res.message)
that.loadData()
that.onClearSelected()
} else {
that.$message.warning(res.message)
}
})
}
})
},
resumeJob: function (record) {
const that = this
// 恢复定时任务
this.$confirm({
title: '确认启动',
content: '是否启动选中任务?',
onOk: function () {
getAction(that.url.resume, { id: record.id }).then((res) => {
if (res.success) {
that.$message.success(res.message)
that.loadData()
that.onClearSelected()
} else {
that.$message.warning(res.message)
}
})
}
})
},
executeImmediately (record) {
const that = this
// 立即执行定时任务
this.$confirm({
title: '确认提示',
content: '是否立即执行任务?',
onOk: function () {
getAction(that.url.execute, { id: record.id }).then((res) => {
if (res.success) {
that.$message.success(res.message)
that.loadData()
that.onClearSelected()
} else {
that.$message.warning(res.message)
}
})
}
})
}
}
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>
+527
View File
@@ -0,0 +1,527 @@
<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>
+333
View File
@@ -0,0 +1,333 @@
<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 :span="6">
<a-form-item label="标题">
<a-input placeholder="请输入标题" v-model="queryParam.titile"></a-input>
</a-form-item>
</a-col>
<!--<a-col :span="6">
<a-form-item label="内容">
<a-input placeholder="请输入内容" v-model="queryParam.msgContent"></a-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>
<!-- 操作按钮区域 -->
<div class="table-operator">
<a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
<a-button type="primary" icon="upload" @click="handleExportXls('系统通告')">导出</a-button>
<a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
<a-button type="primary" icon="download">导入</a-button>
</a-upload>
<a-dropdown v-if="selectedRowKeys.length > 0">
<a-menu slot="overlay">
<a-menu-item key="1" @click="batchDel">
<a-icon type="delete"/>
删除
</a-menu-item>
</a-menu>
<a-button style="margin-left: 8px"> 批量操作
<a-icon type="down"/>
</a-button>
</a-dropdown>
</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
ref="table"
size="middle"
bordered
rowKey="id"
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
:loading="loading"
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
@change="handleTableChange">
<span slot="action" slot-scope="text, record">
<a v-if="(record.sendStatus + '') === '0'" @click="handleEdit(record)">编辑</a>
<a-divider type="vertical" v-if="(record.sendStatus + '') === '0'"/>
<a-dropdown>
<a class="ant-dropdown-link">更多 <a-icon type="down"/></a>
<a-menu slot="overlay">
<a-menu-item v-if="(record.sendStatus + '') !== '1'">
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
<a>删除</a>
</a-popconfirm>
</a-menu-item>
<a-menu-item v-if="(record.sendStatus + '') === '0'">
<a-popconfirm title="确定发布吗?" @confirm="() => releaseData(record.id)">
<a>发布</a>
</a-popconfirm>
</a-menu-item>
<a-menu-item v-if="(record.sendStatus + '') === '1'">
<a-popconfirm title="确定撤销吗?" @confirm="() => reovkeData(record.id)">
<a>撤销</a>
</a-popconfirm>
</a-menu-item>
<a-menu-item>
<a @click="handleDetail(record)">查看</a>
</a-menu-item>
</a-menu>
</a-dropdown>
</span>
</a-table>
</div>
<!-- table区域-end -->
<!-- 表单区域 -->
<sysAnnouncement-modal ref="modalForm" @ok="modalFormOk"></sysAnnouncement-modal>
<!-- 查看详情 -->
<j-modal class="detail-modal" title="查看详情" :visible.sync="detailModal.visible" :top="50" :width="600" switchFullscreen :footer="null">
<iframe v-if="detailModal.url" class="detail-iframe" :src="detailModal.url"/>
</j-modal>
</a-card>
</template>
<script>
import SysAnnouncementModal from './modules/SysAnnouncementModal'
import { doReleaseData, doReovkeData } from '@/api/api'
import { getAction } from '@/api/manage'
import { JeroListMixin } from '@/mixins/JeroListMixin'
import { ACCESS_TOKEN } from '@/store/mutation-types'
export default {
name: 'SysAnnouncementList',
mixins: [JeroListMixin],
components: {
SysAnnouncementModal
},
data () {
return {
description: '系统通告表管理页面',
// 查询条件
queryParam: {},
// 表头
columns: [
{
title: '#',
dataIndex: '',
key: 'rowIndex',
width: 60,
align: 'center',
customRender: function (t, r, index) {
return parseInt(index) + 1
}
},
{
title: '标题',
align: 'center',
dataIndex: 'titile'
},
{
title: '消息类型',
align: 'center',
dataIndex: 'msgCategory',
customRender: function (text) {
if ((text + '') === '1') {
return '通知公告'
} else if ((text + '') === '2') {
return '系统消息'
} else {
return text
}
}
},
/* {
title: '开始时间',
align: "center",
dataIndex: 'startTime'
},
{
title: '结束时间',
align: "center",
dataIndex: 'endTime'
}, */
{
title: '发布人',
align: 'center',
dataIndex: 'sender'
},
{
title: '优先级',
align: 'center',
dataIndex: 'priority',
customRender: function (text) {
if ((text + '') === 'L') {
return '低'
} else if ((text + '') === 'M') {
return '中'
} else if ((text + '') === 'H') {
return '高'
} else {
return text
}
}
},
{
title: '通告对象',
align: 'center',
dataIndex: 'msgType',
customRender: function (text) {
if ((text + '') === 'USER') {
return '指定用户'
} else if ((text + '') === 'ALL') {
return '全体用户'
} else {
return text
}
}
},
{
title: '发布状态',
align: 'center',
dataIndex: 'sendStatus',
customRender: function (text) {
if ((text + '') === '0') {
return '未发布'
} else if ((text + '') === '1') {
return '已发布'
} else if ((text + '') === '2') {
return '已撤销'
} else {
return text
}
}
},
{
title: '发布时间',
align: 'center',
dataIndex: 'sendTime'
},
{
title: '撤销时间',
align: 'center',
dataIndex: 'cancelTime'
},
/* {
title: '删除状态(0,正常,1已删除)',
align:"center",
dataIndex: 'delFlag'
}, */
{
title: '操作',
dataIndex: 'action',
align: 'center',
scopedSlots: { customRender: 'action' }
}
],
detailModal: { visible: false, url: '' },
url: {
list: '/sys/annountCement/page',
delete: '/sys/annountCement/delete',
deleteBatch: '/sys/annountCement/deleteBatch',
releaseDataUrl: '/sys/annountCement/doReleaseData',
reovkeDataUrl: 'sys/annountCement/doReovkeData',
exportXlsUrl: 'sys/annountCement/exportXls',
importExcelUrl: 'sys/annountCement/importExcel'
}
}
},
computed: {
importExcelUrl: function () {
return `${window._CONFIG.domianURL}/${this.url.importExcelUrl}`
}
},
methods: {
// 执行发布操作
releaseData: function (id) {
console.log(id)
const that = this
doReleaseData({ id: id }).then((res) => {
if (res.success) {
that.$message.success(res.message)
that.loadData(1)
} else {
that.$message.warning(res.message)
}
})
},
// 执行撤销操作
reovkeData: function (id) {
const that = this
doReovkeData({ id: id }).then((res) => {
if (res.success) {
that.$message.success(res.message)
that.loadData(1)
this.syncHeadNotic(id)
} else {
that.$message.warning(res.message)
}
})
},
syncHeadNotic (anntId) {
getAction('sys/annountCement/syncNotic', { anntId: anntId })
},
handleDetail: function (record) {
const domain = window._CONFIG.domianURL
const token = this.$ls.get(ACCESS_TOKEN)
this.detailModal.url = `${domain}/sys/annountCement/show/${record.id}?token=${token}`
this.detailModal.visible = true
}
}
}
</script>
<style scoped lang="less">
@import '~@assets/less/common.less';
/** 查看详情弹窗的样式 */
.detail-modal {
.detail-iframe {
border: 0;
width: 100%;
height: 88vh;
min-height: 600px;
}
&.fullscreen .detail-iframe {
height: 100%;
}
}
.detail-modal /deep/ .ant-modal {
top: 30px;
.ant-modal-body {
font-size: 0;
padding: 0;
}
}
.detail-modal.fullscreen /deep/ .ant-modal {
top: 0;
}
</style>
+343
View File
@@ -0,0 +1,343 @@
<template>
<a-card :bordered="false">
<!-- 操作按钮区域 -->
<div class="table-operator">
<a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
<a-button type="primary" icon="upload" @click="handleExportXls('分类字典')" ghost>导出</a-button>
<a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
<a-button type="primary" icon="download" ghost>导入</a-button>
</a-upload>
<a-dropdown v-if="selectedRowKeys.length > 0">
<a-menu slot="overlay">
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
</a-menu>
<a-button style="margin-left: 8px"> 批量操作 <a-icon type="down" /></a-button>
</a-dropdown>
</div>
<!-- table区域-begin -->
<div>
<a-table
ref="table"
size="middle"
rowKey="id"
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
:loading="loading"
:expandedRowKeys="expandedRowKeys"
@change="handleTableChange"
@expand="handleExpand"
v-bind="tableProps">
<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="more" class="operate-icon-btn operate-icon-more" />
</a>
<a-menu slot="overlay">
<a-menu-item>
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record)">
<a>删除</a>
</a-popconfirm>
</a-menu-item>
<a-menu-item>
<a @click="handleAddSub(record)">添加下级</a>
</a-menu-item>
</a-menu>
</a-dropdown>
</span>
</a-table>
</div>
<sysCategory-modal ref="modalForm" @ok="modalFormOk"></sysCategory-modal>
</a-card>
</template>
<script>
import { getAction, postAction } from '@/api/manage'
import { JeroListMixin } from '@/mixins/JeroListMixin'
import SysCategoryModal from './modules/SysCategoryModal'
export default {
name: 'SysCategoryList',
mixins: [JeroListMixin],
components: {
SysCategoryModal
},
data () {
return {
description: '分类字典管理页面',
// 表头
columns: [
{
title: '分类名称',
align: 'left',
dataIndex: 'name'
},
{
title: '分类编码',
align: 'left',
dataIndex: 'code'
},
{
title: '操作',
dataIndex: 'action',
align: 'center',
scopedSlots: { customRender: 'action' }
}
],
url: {
list: '/sys/category/rootList',
childList: '/sys/category/childList',
getChildListBatch: '/sys/category/getChildListBatch',
delete: '/sys/category/delete',
deleteBatch: '/sys/category/deleteBatch',
exportXlsUrl: '/sys/category/exportXls',
importExcelUrl: 'sys/category/importExcel'
},
expandedRowKeys: [],
hasChildrenField: 'hasChild',
pidField: 'pid',
dictOptions: {
},
subExpandedKeys: []
}
},
computed: {
importExcelUrl () {
return `${window._CONFIG.domianURL}/${this.url.importExcelUrl}`
},
tableProps () {
const _this = this
return {
// 列表项是否可选择
rowSelection: {
selectedRowKeys: _this.selectedRowKeys,
onChange: (selectedRowKeys) => (_this.selectedRowKeys = selectedRowKeys)
}
}
}
},
methods: {
loadData (arg) {
if (arg === 1) {
this.ipagination.current = 1
}
this.loading = true
const params = this.getQueryParams()
return new Promise(() => {
getAction(this.url.list, params).then(res => {
if (res.success) {
const result = res.result
if (Number(result.total) > 0) {
this.ipagination.total = Number(result.total)
this.dataSource = this.getDataByResult(res.result.records)
// update--begin--autor:lvdandan-----date:20201204------forJT-31 删除成功后默认展开已展开信息
return this.loadDataByExpandedRows(this.dataSource)
// update--end--autor:lvdandan-----date:20201204------forJT-31 删除成功后默认展开已展开信息
} else {
this.ipagination.total = 0
this.dataSource = []
}
} else {
this.$message.warning(res.message)
}
}).finally(() => {
this.loading = false
})
})
},
getDataByResult (result) {
if (result && result.length > 0) {
return result.map(item => {
// 判断是否标记了带有子节点
if ((item[this.hasChildrenField] + '') === '1') {
const loadChild = { id: item.id + '_loadChild', name: 'loading...', isLoading: true }
item.children = [loadChild]
}
return item
})
}
},
handleExpand (expanded, record) {
// 判断是否是展开状态
if (expanded) {
this.expandedRowKeys.push(record.id)
if (record.children.length > 0 && record.children[0].isLoading === true) {
const params = this.getQueryParams()// 查询条件
params[this.pidField] = record.id
getAction(this.url.childList, params).then((res) => {
if (res.success) {
if (res.result && res.result.length > 0) {
record.children = this.getDataByResult(res.result)
this.dataSource = [...this.dataSource]
} else {
record.children = ''
record.hasChildrenField = '0'
}
} else {
this.$message.warning(res.message)
}
})
}
} else {
const keyIndex = this.expandedRowKeys.indexOf(record.id)
if (keyIndex >= 0) {
this.expandedRowKeys.splice(keyIndex, 1)
}
}
},
initDictConfig () {
},
modalFormOk (formData, arr) {
if (!formData.id) {
this.addOk(formData, arr)
} else {
this.editOk(formData, this.dataSource)
this.dataSource = [...this.dataSource]
}
},
editOk (formData, arr) {
if (arr && arr.length > 0) {
for (let i = 0; i < arr.length; i++) {
if (arr[i].id === formData.id) {
arr[i] = formData
break
} else {
this.editOk(formData, arr[i].children)
}
}
}
},
async addOk (formData, arr) {
if (!formData[this.pidField]) {
this.loadData()
} else {
this.expandedRowKeys = []
console.log('22222', arr)
for (const i of arr) {
await this.expandTreeNode(i)
}
}
},
expandTreeNode (nodeId) {
return new Promise((resolve, reject) => {
this.getFormDataById(nodeId, this.dataSource)
const row = this.parentFormData
this.expandedRowKeys.push(nodeId)
const params = this.getQueryParams()// 查询条件
params[this.pidField] = nodeId
getAction(this.url.childList, params).then((res) => {
console.log('11111', res)
if (res.success) {
if (res.result && res.result.length > 0) {
row.children = this.getDataByResult(res.result)
this.dataSource = [...this.dataSource]
resolve()
} else {
row.children = ''
row.hasChildrenField = '0'
reject()
}
} else {
reject()
}
})
})
},
getFormDataById (id, arr) {
if (arr && arr.length > 0) {
for (let i = 0; i < arr.length; i++) {
if (arr[i].id === id) {
this.parentFormData = arr[i]
} else {
this.getFormDataById(id, arr[i].children)
}
}
}
},
handleAddSub (record) {
this.subExpandedKeys = []
this.getExpandKeysByPid(record.id, this.dataSource, this.dataSource)
this.$refs.modalForm.subExpandedKeys = this.subExpandedKeys
this.$refs.modalForm.title = '添加子分类'
this.$refs.modalForm.edit({ pid: record.id })
this.$refs.modalForm.disableSubmit = false
},
handleDelete: function (record) {
const that = this
postAction(that.url.delete, { id: record.id }).then((res) => {
if (res.success) {
// update--begin--autor:lvdandan-----date:20201204------forJT-31 删除成功后默认展开已展开信息
that.loadData()
// update--end--autor:lvdandan-----date:20201204------forJT-31 删除成功后默认展开已展开信息
} else {
that.$message.warning(res.message)
}
})
},
// 添加子分类时获取所有父级id
getExpandKeysByPid (pid, arr, all) {
if (pid && arr && arr.length > 0) {
for (let i = 0; i < arr.length; i++) {
if (arr[i].id === pid) {
this.subExpandedKeys.push(arr[i].id)
this.getExpandKeysByPid(arr[i].pid, all, all)
} else {
this.getExpandKeysByPid(pid, arr[i].children, all)
}
}
}
},
// 根据已展开的行查询数据(用于保存后刷新时异步加载子级的数据)
loadDataByExpandedRows (dataList) {
if (this.expandedRowKeys.length > 0) {
return getAction(this.url.getChildListBatch, { parentIds: this.expandedRowKeys.join(',') }).then(res => {
if (res.success && res.result.records.length > 0) {
// 已展开的数据批量子节点
const records = res.result.records
const listMap = new Map()
for (const item of records) {
const pid = item[this.pidField]
if (this.expandedRowKeys.join(',').includes(pid)) {
let mapList = listMap.get(pid)
if (mapList == null) {
mapList = []
}
mapList.push(item)
listMap.set(pid, mapList)
}
}
const childrenMap = listMap
const fn = (list) => {
if (list) {
list.forEach(data => {
if (this.expandedRowKeys.includes(data.id)) {
data.children = this.getDataByResult(childrenMap.get(data.id))
fn(data.children)
}
})
}
}
fn(dataList)
}
})
} else {
return Promise.resolve()
}
}
}
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>
+182
View File
@@ -0,0 +1,182 @@
<template>
<a-card :bordered="false">
<!-- 查询区域 -->
<div class="table-page-search-wrapper">
<a-form-model layout="inline" :model="queryParam" @keyup.enter.native="searchQuery">
<a-row :gutter="24">
<a-col :md="6" :sm="8">
<a-form-model-item label="规则名称" prop="ruleName">
<a-input placeholder="请输入规则名称" v-model="queryParam.ruleName"/>
</a-form-model-item>
</a-col>
<a-col :md="6" :sm="8">
<a-form-model-item label="规则Code" prop="ruleCode">
<a-input placeholder="请输入规则Code" v-model="queryParam.ruleCode"/>
</a-form-model-item>
</a-col>
<template v-if="toggleSearchStatus">
</template>
<a-col :md="6" :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>
<a @click="handleToggleSearch" style="margin-left: 8px">
{{ toggleSearchStatus ? '收起' : '展开' }}
<a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
</a>
</span>
</a-col>
</a-row>
</a-form-model>
</div>
<!-- 操作按钮区域 -->
<div class="table-operator">
<a-button @click="handleAdd" type="primary" icon="plus">新增</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>
<a-dropdown v-if="selectedRowKeys.length > 0">
<a-menu slot="overlay">
<a-menu-item key="1" @click="batchDel">
<a-icon type="delete"/>
删除
</a-menu-item>
</a-menu>
<a-button style="margin-left: 8px"> 批量操作
<a-icon type="down"/>
</a-button>
</a-dropdown>
</div>
<!-- table区域-begin -->
<a-alert type="info" showIcon style="margin-bottom: 16px;">
<template slot="message">
<span>已选择</span>
<a style="font-weight: 600;padding: 0 4px;">{{ selectedRowKeys.length }}</a>
<span></span>
<template v-if="selectedRowKeys.length>0">
<a-divider type="vertical"/>
<a @click="onClearSelected">清空</a>
</template>
</template>
</a-alert>
<a-table
ref="table"
size="middle"
bordered
rowKey="id"
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
:loading="loading"
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
@change="handleTableChange">
<template slot="action" slot-scope="text, record">
<a @click="handleEdit(record)">编辑</a>
<a-divider type="vertical"/>
<a @click="handleTest(record)">功能测试</a>
<a-divider type="vertical"/>
<a-dropdown>
<a class="ant-dropdown-link">
<span>更多</span>
<a-icon type="down"/>
</a>
<a-menu slot="overlay">
<a-menu-item>
<a-popconfirm title="确定删除吗?" @confirm="handleDelete(record.id)">删除</a-popconfirm>
</a-menu-item>
</a-menu>
</a-dropdown>
</template>
</a-table>
<!-- table区域-end -->
<!-- 表单区域 -->
<sys-check-rule-modal ref="modalForm" @ok="modalFormOk"/>
<sys-check-rule-test-modal ref="testModal"/>
</a-card>
</template>
<script>
import JEllipsis from '@/components/jero/JEllipsis'
import { JeroListMixin } from '@/mixins/JeroListMixin'
import SysCheckRuleModal from './modules/SysCheckRuleModal'
import SysCheckRuleTestModal from './modules/SysCheckRuleTestModal'
export default {
name: 'SysCheckRuleList',
mixins: [JeroListMixin],
components: {
SysCheckRuleModal,
SysCheckRuleTestModal,
JEllipsis
},
data () {
return {
description: '编码校验规则管理页面',
// 表头
columns: [
{
title: '#',
key: 'rowIndex',
width: 60,
align: 'center',
customRender: (t, r, i) => i + 1
},
{
title: '规则名称',
align: 'center',
dataIndex: 'ruleName'
},
{
title: '规则Code',
align: 'center',
dataIndex: 'ruleCode'
},
{
title: '规则描述',
align: 'center',
dataIndex: 'ruleDescription',
customRender: (t) => (<j-ellipsis value={t} length={48}/>)
},
{
title: '操作',
dataIndex: 'action',
align: 'center',
scopedSlots: { customRender: 'action' }
}
],
url: {
list: '/sys/checkRule/page',
delete: '/sys/checkRule/delete',
deleteBatch: '/sys/checkRule/deleteBatch',
exportXlsUrl: 'sys/checkRule/exportXls',
importExcelUrl: 'sys/checkRule/importExcel'
}
}
},
computed: {
importExcelUrl: function () {
return `${window._CONFIG.domianURL}/${this.url.importExcelUrl}`
}
},
methods: {
handleTest (record) {
this.$refs.testModal.open(record.ruleCode)
}
}
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>
+182
View File
@@ -0,0 +1,182 @@
<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="数据源名称">
<a-input placeholder="请输入数据源名称" v-model="queryParam.name"/>
</a-form-item>
</a-col>
<a-col :md="6" :sm="8">
<a-form-item label="数据库类型">
<j-dict-select-tag v-model="queryParam.dbType" placeholder="请选择数据库类型" dict-code="database_type"/>
</a-form-item>
</a-col>
<a-col :md="6" :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-form>
</div>
<!-- 操作按钮区域 -->
<div class="table-operator">
<a-button @click="handleAdd" type="primary" icon="plus">新增</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>
<a-dropdown v-if="selectedRowKeys.length > 0">
<a-menu slot="overlay">
<a-menu-item key="1" @click="batchDel">
<a-icon type="delete"/>
删除
</a-menu-item>
</a-menu>
<a-button style="margin-left: 8px"> 批量操作
<a-icon type="down"/>
</a-button>
</a-dropdown>
</div>
<!-- table区域-begin -->
<div>
<a-alert type="info" showIcon style="margin-bottom: 16px;">
<template slot="message">
<span>已选择</span>
<a style="font-weight: 600;padding: 0 4px;">{{ selectedRowKeys.length }}</a>
<span></span>
<a style="margin-left: 24px" @click="onClearSelected">清空</a>
</template>
</a-alert>
<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="action" slot-scope="text, record">
<a @click="handleEdit(record)">编辑</a>
<a-divider type="vertical"/>
<a @click="handleDelete(record.id)">删除</a>
<!-- <a-dropdown>-->
<!-- <a class="ant-dropdown-link">更多 <a-icon type="down"/></a>-->
<!-- <a-menu slot="overlay">-->
<!-- <a-menu-item>-->
<!-- <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">-->
<!-- <a>删除</a>-->
<!-- </a-popconfirm>-->
<!-- </a-menu-item>-->
<!-- </a-menu>-->
<!-- </a-dropdown>-->
</span>
</a-table>
</div>
<!-- table区域-end -->
<!-- 表单区域 -->
<sys-data-source-modal ref="modalForm" @ok="modalFormOk"/>
</a-card>
</template>
<script>
import JEllipsis from '@/components/jero/JEllipsis'
import { JeroListMixin } from '@/mixins/JeroListMixin'
import SysDataSourceModal from './modules/SysDataSourceModal'
export default {
name: 'SysDataSourceList',
mixins: [JeroListMixin],
components: {
JEllipsis,
SysDataSourceModal
},
data () {
const ellipsis = (v, l = 20) => (<j-ellipsis value={v} length={l}/>)
return {
description: '多数据源管理管理页面',
// 表头
columns: [
{
title: '#',
dataIndex: '',
key: 'rowIndex',
width: 60,
align: 'center',
customRender: (t, r, index) => index + 1
},
{
title: '数据源名称',
align: 'center',
dataIndex: 'name'
},
{
title: '数据库类型',
align: 'center',
dataIndex: 'dbType_dictText'
},
{
title: '驱动类',
align: 'center',
dataIndex: 'dbDriver',
customRender: (t) => ellipsis(t)
},
{
title: '数据源地址',
align: 'center',
dataIndex: 'dbUrl',
customRender: (t) => ellipsis(t)
},
{
title: '用户名',
align: 'center',
dataIndex: 'dbUsername'
},
{
title: '操作',
dataIndex: 'action',
align: 'center',
scopedSlots: { customRender: 'action' }
}
],
url: {
list: '/sys/dataSource/page',
delete: '/sys/dataSource/delete',
deleteBatch: '/sys/dataSource/deleteBatch',
exportXlsUrl: 'sys/dataSource/exportXls',
importExcelUrl: 'sys/dataSource/importExcel'
}
}
},
computed: {
importExcelUrl () {
return `${window._CONFIG.domianURL}/${this.url.importExcelUrl}`
}
},
methods: {}
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>
+187
View File
@@ -0,0 +1,187 @@
<template>
<a-card :bordered="false">
<!-- 查询区域 -->
<div class="table-page-search-wrapper">
<a-form-model layout="inline" :model="queryParam" @keyup.enter.native="searchQuery">
<a-row :gutter="24">
<a-col :md="6" :sm="8">
<a-form-model-item label="规则名称" prop="ruleName">
<a-input placeholder="请输入规则名称" v-model="queryParam.ruleName"></a-input>
</a-form-model-item>
</a-col>
<a-col :md="6" :sm="8">
<a-form-model-item label="规则Code" prop="ruleCode">
<a-input placeholder="请输入规则Code" v-model="queryParam.ruleCode"></a-input>
</a-form-model-item>
</a-col>
<a-col :md="6" :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-form-model>
</div>
<!-- 操作按钮区域 -->
<div class="table-operator">
<a-button @click="handleAdd" type="primary" icon="plus">新增</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>
<a-dropdown v-if="selectedRowKeys.length > 0">
<a-menu slot="overlay">
<a-menu-item key="1" @click="batchDel">
<a-icon type="delete"/>
删除
</a-menu-item>
</a-menu>
<a-button style="margin-left: 8px"> 批量操作
<a-icon type="down"/>
</a-button>
</a-dropdown>
</div>
<!-- table区域-begin -->
<a-alert type="info" showIcon style="margin-bottom: 16px;">
<template slot="message">
<span>已选择</span>
<a style="font-weight: 600;padding: 0 4px;">{{ selectedRowKeys.length }}</a>
<span></span>
<template v-if="selectedRowKeys.length>0">
<a-divider type="vertical"/>
<a @click="onClearSelected">清空</a>
</template>
</template>
</a-alert>
<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="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 @click="handleTest(record)">
功能测试
</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>
</a-table>
<!-- table区域-end -->
<!-- 表单区域 -->
<sys-fill-rule-modal ref="modalForm" @ok="modalFormOk"/>
</a-card>
</template>
<script>
import { getAction } from '@/api/manage'
import SysFillRuleModal from './modules/SysFillRuleModal'
import { JeroListMixin } from '@/mixins/JeroListMixin'
export default {
name: 'SysFillRuleList',
mixins: [JeroListMixin],
components: { SysFillRuleModal },
data () {
return {
description: '填值规则管理页面',
// 表头
columns: [
{
title: '#',
dataIndex: '',
key: 'rowIndex',
width: 60,
align: 'center',
customRender: (t, r, index) => 1 + index
},
{
title: '规则名称',
align: 'center',
dataIndex: 'ruleName'
},
{
title: '规则Code',
align: 'center',
dataIndex: 'ruleCode'
},
{
title: '规则实现类',
align: 'center',
dataIndex: 'ruleClass'
},
{
title: '规则参数',
align: 'center',
dataIndex: 'ruleParams'
},
{
title: '操作',
dataIndex: 'action',
align: 'center',
scopedSlots: { customRender: 'action' }
}
],
url: {
list: '/sys/fillRule/page',
test: '/sys/fillRule/testFillRule',
delete: '/sys/fillRule/delete',
deleteBatch: '/sys/fillRule/deleteBatch',
exportXlsUrl: '/sys/fillRule/exportXls',
importExcelUrl: '/sys/fillRule/importExcel'
}
}
},
computed: {
importExcelUrl () {
return `${window._CONFIG.domianURL}${this.url.importExcelUrl}`
}
},
methods: {
handleTest (record) {
const closeLoading = this.$message.loading('生成中...', 0)
getAction(this.url.test, {
ruleCode: record.ruleCode
}).then(res => {
if (res.success) {
this.$info({
title: '填值规则功能测试',
content: '生成结果:' + res.result
})
} else {
this.$message.warn(res.message)
}
}).finally(() => {
closeLoading()
})
}
}
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>
@@ -0,0 +1,74 @@
<template>
<internal-detail-page :title="$t('message.my.myMessage')" :loading="loading" :content-padding="0">
<div class="container">
<div class="msg-header">
<div class="title">{{ model.titile }}</div>
<div class="subTitle">
<span>{{ $t('message.my.notificationTime') }}{{ model.sendTime }}</span>
</div>
</div>
<div class="msg-content" v-html="model.msgContent"></div>
</div>
</internal-detail-page>
</template>
<script>
import InternalDetailPage from '@comp/InternalDetailPage'
import { getMsgDetail } from '@api/personCenter'
export default {
name: 'UserAnnouncementDetail',
components: { InternalDetailPage },
data () {
return {
loading: false,
model: {}
}
},
created () {
this.initPage()
},
methods: {
initPage () {
this.loading = true
getMsgDetail({ id: this.$route.query.id }).then(res => {
if (res.success) {
const data = res.result || {}
this.model = data
this.title = data.titile
} else {
this.$message.warn(res.message)
}
}).catch((err) => {
this.$message.warn(err)
}).finally(() => {
this.loading = false
})
}
}
}
</script>
<style lang="less" scoped>
.container {
margin: 0 90px;
.msg-header {
border-bottom: 1px solid #E5E6EB;
.title {
margin-top: 30px;
font-size: 22px;
font-family: PingFang SC-Semibold, PingFang SC, sans-serif;
font-weight: 600;
color: #1D2129;
text-align: center;
}
.subTitle {
text-align: right;
line-height: 32px;
}
}
.msg-content {
margin-top: 20px;
}
}
</style>
+344
View File
@@ -0,0 +1,344 @@
<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 :span="6">
<a-form-item :label="$t('message.my.title')">
<a-input :placeholder="$t('pleaseEnter') + $t('message.my.title')" v-model="queryParam.titile"></a-input>
</a-form-item>
</a-col>
<a-col :span="6">
<a-form-item :label="$t('message.my.publisher')">
<a-input :placeholder="$t('pleaseEnter') + $t('message.my.publisher')" v-model="queryParam.sender"></a-input>
</a-form-item>
</a-col>
<!--<a-col :span="6">-->
<!-- <a-form-item :label="$t('message.my.messageType')">-->
<!-- <a-select class="box-input"-->
<!-- :placeholder="$t('pleaseSelect')+$t('message.my.messageType')"-->
<!-- v-model="queryParam.msgCategory">-->
<!-- <a-select-option :value="undefined">{{ $t('pleaseSelect') }}</a-select-option>-->
<!-- <a-select-option v-for="(item, key) in Object.keys(msgCategoryQuery)"-->
<!-- :key="key" :value="item">-->
<!-- <span style="display: inline-block;width: 100%" :title="msgCategoryQuery[item]">-->
<!-- {{ msgCategoryQuery[item] }}-->
<!-- </span>-->
<!-- </a-select-option>-->
<!-- </a-select>-->
<!-- </a-form-item>-->
<!--</a-col>-->
<div style="float: right;overflow: hidden;" class="table-page-search-submitButtons">
<a-button v-if="'system:userAnnouncementList:search'" type="primary" @click="searchQuery">{{ $t('query') }}</a-button>
<a-button @click="searchReset" style="margin-left: 8px">{{ $t('reset') }}</a-button>
</div>
</a-row>
</a-form>
</div>
<div class="table-operator">
<!-- 标记已读 -->
<a-button type="primary" ghost @click="readAll" v-has="'system:userAnnouncementList:allLabelsRead'">
<a-icon type="eye" />
{{ $t('message.my.allLabelsRead') }}
</a-button>
</div>
<div>
<j-table
:can-drag="true"
:scroll="{x: '100%', y: yScrollHeight}"
ref="table"
rowKey="id"
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
:loading="loading"
:rowClassName="rowClassName"
@change="handleTableChange">
<!--已读、未读状态-->
<template v-slot:readFlag="{text, record}">
<a-tooltip overlay-class-name="tooltip-style">
<template slot="title">{{ text}}</template>
<div class="table-text" :class="{'agree-color': record.readFlag + '' === '1', 'reject-color': record.readFlag + '' === '0'}">
{{ text }}
</div>
</a-tooltip>
</template>
<!-- 操作 -->
<template v-slot:action="{text, record}">
<a-tooltip overlay-class-name="tooltip-style">
<a class="table-del" @click="handleGoDetail(record)" v-has="'system:userAnnouncementList:detail'">{{$t('view')}}</a>
</a-tooltip>
</template>
</j-table>
</div>
</a-card>
</template>
<script>
// import { filterObj } from '@/utils/util'
// import ShowAnnouncement from '@/components/tools/ShowAnnouncement'
// import DynamicNotice from '../../components/tools/DynamicNotice'
import { getAction, deleteAction, postAction } from '@/api/manage'
import { JeroListMixin } from '@/mixins/JeroListMixin'
// import { ResizeHeader, ResizeColumnProvide } from '@/mixins/header'
import Vue from 'vue'
import { ACCESS_TOKEN } from '@/store/mutation-types'
import JTable from '@comp/jero/JTable'
import { ReadFlag } from '@/enums/commonEnums'
import { getMsgDetail } from '@api/personCenter'
export default {
name: 'UserAnnouncementList',
components: { JTable },
mixins: [JeroListMixin],
// components: {
// DynamicNotice,
// ShowAnnouncement
// },
data () {
return {
description: '系统通告表管理页面',
queryParam: {},
selectedRowKeys: [],
msgCategoryQuery: {
1: this.$t('message.my.subscriptionNotification'),
2: this.$t('message.my.warningInformation'),
3: this.$t('message.my.forwardPush')
// '4': this.$t('CollectinguthenticationParameters'),
// '6':this.$t('RegulationListConfirmationTask'),
// '7':this.$t('RegulationListConfirmationNotification'),
// '8':this.$t('RegulationTaskConfirmation'),
// '9':this.$t('DesignComplianceTask'),
// '10':this.$t('PreHomoTask'),
// '11':this.$t('ValidationTask'),
// '12':this.$t('DesignComplianceNotification'),
// '13':this.$t('PreHomoNotification'),
// '14':this.$t('ValidationComplianceNotification'),
// '15':this.$t('RegulationTaskConfirmationNotification'),
// '17':this.$t('listConfirmation'),
// '18':this.$t('taskAffirm'),
// '19':this.$t('complianceConfirmation'),
// '20':this.$t('collectionLegislativeComments'),
// '21':this.$t('regulatoryAndTechnicalAssessment'),
},
columns: [
{
title: this.$t('message.my.title'),
align: 'center',
dataIndex: 'titile',
width: 150,
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('message.my.messageType'),
align: 'center',
dataIndex: 'msgCategory_dictText',
width: 150,
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('message.my.publisher'),
align: 'center',
dataIndex: 'sender',
width: 150,
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('message.my.notificationTime'),
align: 'center',
width: 120,
dataIndex: 'sendTime',
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('message.my.readingStatus'),
align: 'center',
width: 120,
dataIndex: 'readFlag_dictText',
scopedSlots: { customRender: 'readFlag' }
},
{
// 操作
// fixed: 'right',
title: this.$t('operation'),
dataIndex: 'action',
align: 'center',
width: 100,
scopedSlots: { customRender: 'action' }
}
],
url: {
list: '/sys/sysAnnouncementSend/getMyAnnouncementSend',
editCementSend: 'sys/sysAnnouncementSend/editByAnntIdAndUserId',
readAllMsg: 'sys/sysAnnouncementSend/readAll',
deleteUrl: 'sys/sysAnnouncementSend/deleteBatch'
},
loading: false,
openPath: '',
formData: '',
language: ''
}
},
mounted () {
this.language = localStorage.getItem('language') || ''
},
methods: {
// 未读的高亮
rowClassName (record) {
return record.readFlag === ReadFlag.UNREAD.value ? 'row-unread' : ''
},
// 跳转详情
handleGoDetail (record) {
if (record.openType === 'url') {
this.$router.push({ path: record.openPage })
// 如果是跳转其他页面请求详情(作用是为了标记已读)
getMsgDetail({ id: record.id })
} else if (record.openType === 'page') {
this.$openPageNewSheet({ path: record.openPage })
// 如果是跳转其他页面请求详情(作用是为了标记已读)
getMsgDetail({ id: record.id })
} else {
this.$router.push({
path: '/isps/userAnnouncementDetail',
query: {
id: record.id
}
})
}
},
expandIcon (props) {
if (props.expanded) {
return <a-icon type = 'down' onClick = { e => {
props.onExpand(props.record, e)
}
}
/>
} else {
return <a-icon type="right" onClick={e => {
props.onExpand(props.record, e)
}
}
/>
}
},
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:适配不分页的数据列表------------
if (res.result.current > 1 && res.result.records.length === 0) {
this.loadData(1)
return
}
this.dataSource = res.result.records || res.result
if (this.dataSource && this.dataSource.length > 0) {
this.dataSource.forEach(val => {
if (val.msgContentInfoCn && val.msgContentInfoCn.includes('/common/downLoadFile')) {
const index = val.msgContentInfoCn.indexOf('target')
val.msgContentInfoCn = val.msgContentInfoCn.slice(0, index - 2) + '&token=' + Vue.ls.get(ACCESS_TOKEN) + '\' ' +
val.msgContentInfoCn.slice(index)
}
if (val.msgContentInfo && val.msgContentInfo.includes('/common/downLoadFile')) {
const index = val.msgContentInfo.indexOf('target')
val.msgContentInfo = val.msgContentInfo.slice(0, index - 2) + '&token=' + Vue.ls.get(ACCESS_TOKEN) + '\' ' +
val.msgContentInfo.slice(index)
}
})
}
if (res.result.total) {
this.ipagination.total = res.result.total
} else {
this.ipagination.total = 0
}
// update-end---author:zhangyafei Date:20201118 for:适配不分页的数据列表------------
}
if (res.code === 510) {
this.$message.warning(res.message)
}
this.loading = false
})
},
expandChange (isTrue, val) {
if (isTrue) {
if (val.readFlag === '0') {
this.msgContentClick(val)
}
}
},
readAll () {
if (this.dataSource.length > 0) {
this.$confirm({
content: this.$t('message.my.areAllLabelsRead'),
onOk: () => {
postAction(this.url.readAllMsg, {}).then((res) => {
if (res.success) {
this.selectedRowKeys = []
this.$message.success(this.$t('operationSuccessful'))
this.loadData()
} else {
this.$message.success(this.$t('operationFailed'))
}
})
}
})
} else {
this.$message.warning(this.$t('personalCenter.myMessage.noCanRemarkData'))
}
},
onSelectChange (value) {
this.selectedRowKeys = value
},
msgContentClick (row) {
postAction(this.url.readAllMsg, { ids: row.id })
},
handleDel () {
if (this.selectedRowKeys.length > 0) {
this.$confirm({
content: this.$t('confirmBatchDeletion'),
onOk: () => {
const selectedRowKeys = JSON.parse(JSON.stringify(this.selectedRowKeys))
deleteAction(this.url.deleteUrl, { ids: selectedRowKeys.join(',') }).then((res) => {
if (res.success) {
this.selectedRowKeys = []
this.$message.success(this.$t('operationSuccessful'))
this.loadData()
} else {
this.$message.warning(this.$t('operationFailed'))
}
})
}
})
} else {
this.$message.warning(this.$t('pleaseSelectData'))
}
}
}
}
</script>
<style scoped lang="less">
@import '~@assets/less/common.less';
/deep/ .row-unread > td {
background-color: #F9F9F9;
}
// 未读
.reject-color {
color: @primary-color;
}
</style>
+476
View File
@@ -0,0 +1,476 @@
<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"
allow-clear
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="upload" @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>
<a-divider type="vertical" v-has="'user:uploadHandStamp'" />
<a @click="handleUploadHandStamp(record)" v-has="'user:uploadHandStamp'">{{ $t('user.uploadHandStamp') }}</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>-->
<upload-hand-stamp-modal ref="uploadHandStampModal" @ok="modalFormOk" />
</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'
import UploadHandStampModal from './modules/UploadHandStampModal'
export default {
name: 'UserList',
mixins: [JeroListMixin],
components: {
RoleAssignment,
UserModal,
PasswordModal,
JInput,
UserRecycleBinModal,
JTable,
JSearchSelectTag,
UploadHandStampModal
},
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 = []
},
/**
* 上传手写章
* @param record
*/
handleUploadHandStamp (record) {
this.$refs.uploadHandStampModal.edit(record)
}
}
}
</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>
@@ -0,0 +1,198 @@
<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('system.friendshipLink.name')">
<j-input
:placeholder="$t('pleaseEnter') + $t('system.friendshipLink.name')"
v-model="queryParam.name"></j-input>
</a-form-item>
</a-col>
<a-col :md="6" :sm="8">
<a-form-item :label="$t('system.friendshipLink.shelfStatus')">
<j-dict-select-tag
:placeholder="$t('pleaseSelect') + $t('system.friendshipLink.shelfStatus')"
v-model="queryParam.grounding"
dict-code="yn"></j-dict-select-tag>
</a-form-item>
</a-col>
<div style="float: right;overflow: hidden;" class="table-page-search-submitButtons">
<a-button type="primary" @click="searchQuery" icon="search" v-has="'sys:friendshipLink:search'">{{ $t('query') }}</a-button>
<a-button type="primary" ghost @click="searchReset" icon="reload" style="margin-left: 8px">{{ $t('reset') }}</a-button>
</div>
</a-row>
</a-form>
</div>
<div class="table-operator" v-if="dataSource.length < 6" v-has="'sys:friendshipLink:add'">
<!-- 新增 -->
<a-button icon="plus" type="primary" @click="handleAdd">{{ $t('newlyAdded') }}</a-button>
</div>
<!-- table区域-begin -->
<div>
<j-table
:can-drag="true"
:scroll="{x: '100%', y: yScrollHeight}"
ref="table"
rowKey="id"
:columns="columns"
:dataSource="dataSource"
:pagination="false"
:loading="loading"
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
@change="handleTableChange">
<template v-slot:link="{text, record}">
<a-tooltip overlay-class-name="tooltip-style">
<template slot="title">{{ text || text === 0 ? text : global.emptyLine }}</template>
<a class="link-a" @click="handleLinkClick(record)">{{ text }}</a>
</a-tooltip>
</template>
<template v-slot:isShelf="{text, record}">
<a-switch v-model="record.grounding" @change="switchChange(record)" />
</template>
<template v-slot:action="{text, record}">
<a @click="handleEdit(record)" v-has="'sys:friendshipLink:edit'">{{ $t('edit') }}</a>
</template>
</j-table>
</div>
<!-- table区域-end -->
<friendship-link-modal ref="modalForm" @ok="modalFormOk"></friendship-link-modal>
</a-card>
</template>
<script>
import JTable from '@/components/jero/JTable'
import JDictSelectTag from '@/components/dict/JDictSelectTag'
import { JeroListMixin } from '@/mixins/JeroListMixin'
import { postAction, getAction } from '@/api/manage'
import FriendshipLinkModal from './modules/FriendshipLinkModal'
export default {
name: 'FriendshipLinkList',
components: { FriendshipLinkModal, JTable, JDictSelectTag },
mixins: [JeroListMixin],
data () {
return {
columns: [
{
title: this.$t('serialNumber'),
dataIndex: '',
key: 'rowIndex',
align: 'center',
width: 80,
customRender: function (t, r, index) {
return parseInt(index) + 1
}
},
{
title: this.$t('system.friendshipLink.linkName'),
align: 'center',
width: 180,
dataIndex: 'name',
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('system.friendshipLink.link'),
align: 'center',
width: 180,
dataIndex: 'link',
scopedSlots: { customRender: 'link' }
},
{
title: this.$t('system.friendshipLink.isShelf'),
align: 'center',
width: 180,
dataIndex: 'isShelf',
scopedSlots: { customRender: 'isShelf' }
},
{
title: this.$t('system.friendshipLink.sort'),
align: 'center',
width: 180,
dataIndex: 'sort',
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('operation'),
scopedSlots: { customRender: 'action' },
align: 'center',
fixed: 'right',
width: 170
}
],
url: {
list: '/sys/lawsFriendlyLinks/list',
edit: '/sys/lawsFriendlyLinks/edit'
}
}
},
methods: {
loadData () {
const params = Object.assign({}, this.queryParam)
this.loading = true
getAction(this.url.list, params).then((res) => {
if (res.success) {
this.dataSource = res.result ? res.result.map(item => {
return {
...item,
grounding: item.grounding !== '0'
}
}) : []
} else {
this.$message.warning(res.message)
}
}).finally(() => {
this.loading = false
})
},
handleLinkClick (record) {
const href = record.link
window.open(href)
},
// 是否上架状态改变
switchChange (record) {
if (!record.link) {
this.$message.warning(this.$t('system.friendshipLink.shelfWarn'))
return
}
// 1开启 0未开启
if (this.dataSource.reduce((pre, cur) => pre += (cur.grounding ? 1 : 0), 0) > 6) {
this.$message.warning('最多上架六个友情链接')
record.grounding = false
return
}
console.log(record)
const param = Object.assign({}, record)
param.grounding = record.grounding === true ? '1' : '0'
postAction(this.url.edit, param).then(res => {
if (res.success) {
this.loadData()
} else {
this.$message.warning(res.message)
}
})
}
}
}
</script>
<style scoped lang="less">
@import '~@assets/less/common.less';
/deep/ .table-page-search-wrapper .ant-form-inline .ant-form-item > .ant-form-item-label {
min-width: 80px;
}
</style>
@@ -0,0 +1,152 @@
<template>
<j-modal
:title="title"
:maskClosable="true"
:width="500"
:closable="true"
switchFullscreen
@cancel="handleCancel"
@ok="handleOk"
:confirm-loading="confirmLoading"
:visible="visible">
<a-spin :spinning="confirmLoading">
<a-form :form="form">
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="$t('system.friendshipLink.linkName')">
<a-input
v-decorator.trim="[ 'name', validatorRules.name]"
:maxLength="50"
:placeholder="$t('pleaseEnter')+$t('system.friendshipLink.linkName')"
></a-input>
</a-form-item>
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="$t('system.friendshipLink.link')">
<a-input
v-decorator.trim="[ 'link', validatorRules.link]"
:maxLength="50"
:placeholder="$t('pleaseEnter')+$t('system.friendshipLink.link')"
></a-input>
</a-form-item>
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="$t('system.friendshipLink.sort')">
<a-input
v-decorator.trim="[ 'sort', validatorRules.sort]"
:maxLength="50"
@change="e => e.target.value = e.target.value.replace(/[^0-9]/g, '')"
:placeholder="$t('pleaseEnter')+$t('system.friendshipLink.sort')"
></a-input>
</a-form-item>
<a-form-item :required="true" :labelCol="labelCol" :wrapperCol="wrapperCol" :label="$t('system.friendshipLink.isShelf')">
<a-switch
v-decorator="[ 'grounding', { valuePropName: 'checked', rules: validatorRules.grounding }]"
:placeholder="$t('pleaseSelect')+$t('system.friendshipLink.isShelf')"
>
</a-switch>
</a-form-item>
</a-form>
</a-spin>
</j-modal>
</template>
<script>
import pick from 'lodash.pick'
import { postAction } from '@/api/manage'
export default {
name: 'FriendshipLinkModal',
data () {
return {
title: '',
visible: false,
confirmLoading: false,
form: this.$form.createForm(this),
labelCol: {
xs: { span: 24 },
sm: { span: 6 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 }
},
validatorRules: {
name: {
rules: [
{ required: true, message: this.$t('pleaseEnter') + this.$t('system.friendshipLink.linkName') }
],
validateTrigger: 'blur'
},
link: {
rules: [
{ required: true, message: this.$t('pleaseEnter') + this.$t('system.friendshipLink.link') }
],
validateTrigger: 'blur'
},
sort: {
rules: [
{ required: true, message: this.$t('pleaseEnter') + this.$t('system.friendshipLink.sort') }
],
validateTrigger: 'blur'
},
grounding: {
rules: [
{ required: true, message: this.$t('pleaseSelect') + this.$t('system.friendshipLink.grounding') }
],
validateTrigger: 'change'
}
},
url: {
edit: '/sys/lawsFriendlyLinks/edit'
}
}
},
methods: {
add () {
this.edit({})
},
edit (record) {
this.visible = true
this.form.resetFields()
this.model = Object.assign({}, record)
this.$nextTick(() => {
this.form.setFieldsValue(pick(this.model, 'name', 'link', 'sort', 'grounding'))
})
},
handleCancel () {
this.close()
},
handleOk () {
if (this.confirmLoading) return
this.form.validateFields((err, values) => {
if (!err) {
this.confirmLoading = true
const param = Object.assign({}, values)
param.id = this.model.id
param.grounding = param.grounding ? '1' : '0'
const url = this.url.edit
postAction(url, param).then(res => {
if (res.success) {
this.$message.success(res.message)
this.$emit('ok')
this.close()
} else {
this.$message.warning(res.message)
}
}).finally(() => {
// 防止连点提交
setTimeout(() => {
this.confirmLoading = false
}, 700)
})
}
})
},
close () {
this.visible = false
this.model = {}
}
}
}
</script>
<style scoped>
</style>
+175
View File
@@ -0,0 +1,175 @@
<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.searchLog')">
<a-input :placeholder="$t('log.enterSearchKeyword')" v-model="queryParam.keyWord"></a-input>
</a-form-item>
</a-col>
<a-col :md="6" :sm="8">
<a-form-item :label="$t('createTime')" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-range-picker
v-model="queryParam.createTimeRange"
format="YYYY-MM-DD"
:placeholder="[$t('startTime'), $t('endTime')]"
@change="onDateChange"
@ok="onDateOk"
/>
</a-form-item>
</a-col>
<div style="float: right;overflow: hidden;margin-right: 12px" class="table-page-search-submitButtons">
<a-button type="primary" @click="searchQuery" icon="search">{{ $t('query') }}</a-button>
<a-button type="primary" @click="searchReset" ghost icon="reload" style="margin-left: 8px;">{{ $t('reset') }}</a-button>
</div>
</a-row>
</a-form>
</div>
<!-- table区域-begin -->
<a-table
ref="table"
size="middle"
rowKey="id"
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
:loading="loading"
@change="handleTableChange">
<!-- 字符串超长截取省略号显示-->
<span slot="logContent" slot-scope="text">
<j-ellipsis :value="text" :length="40"/>
</span>
</a-table>
<!-- table区域-end -->
</a-card>
</template>
<script>
import { filterObj } from '@/utils/util'
import { JeroListMixin } from '@/mixins/JeroListMixin'
import JEllipsis from '@/components/jero/JEllipsis'
export default {
name: 'LoginLogList',
mixins: [JeroListMixin],
components: {
JEllipsis
},
data () {
return {
description: '这是日志管理页面',
// 查询条件
queryParam: {
ipInfo: '',
createTimeRange: [],
logType: '1',
keyWord: ''
},
// 表头
columns: [
{
title: '#',
dataIndex: '',
key: 'rowIndex',
align: 'center',
customRender: function (t, r, index) {
return parseInt(index) + 1
}
},
{
title: this.$t('log.logContent'),
align: 'left',
dataIndex: 'logContent',
scopedSlots: { customRender: 'logContent' },
sorter: true
},
{
title: this.$t('log.operatorID'),
dataIndex: 'userid',
align: 'center',
sorter: true
},
{
title: this.$t('log.operatorName'),
dataIndex: 'username',
align: 'center',
sorter: true
},
{
title: 'IP',
dataIndex: 'ip',
align: 'center',
sorter: true
},
{
title: this.$t('log.logType'),
dataIndex: 'logType_dictText',
align: 'center'
},
{
title: this.$t('createTime'),
dataIndex: 'createTime',
align: 'center',
sorter: true
}
],
labelCol: {
xs: { span: 1 },
sm: { span: 2 }
},
wrapperCol: {
xs: { span: 10 },
sm: { span: 16 }
},
url: {
list: '/sys/log/page'
}
}
},
methods: {
getQueryParams () {
const param = Object.assign({}, this.queryParam, this.isorter)
param.field = this.getQueryField()
param.pageNo = this.ipagination.current
param.pageSize = this.ipagination.pageSize
delete param.createTimeRange // 时间参数不传递后台
if (this.superQueryParams) {
param.superQueryParams = encodeURI(this.superQueryParams)
param.superQueryMatchType = this.superQueryMatchType
}
return filterObj(param)
},
// 重置
searchReset () {
const that = this
const logType = that.queryParam.logType
that.queryParam = {} // 清空查询区域参数
that.queryParam.logType = logType
that.loadData(this.ipagination.current)
},
onDateChange: function (value, dateString) {
console.log(dateString[0], dateString[1])
this.queryParam.createTime_begin = dateString[0]
this.queryParam.createTime_end = dateString[1]
},
onDateOk (value) {
console.log(value)
}
}
}
</script>
<style 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>
+196
View File
@@ -0,0 +1,196 @@
<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.searchLog')">
<a-input :placeholder="$t('log.enterSearchKeyword')" v-model="queryParam.keyWord"></a-input>
</a-form-item>
</a-col>
<a-col :md="6" :sm="8">
<a-form-item :label="$t('createTime')" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-range-picker
v-model="queryParam.createTimeRange"
format="YYYY-MM-DD"
:placeholder="[$t('startTime'), $t('endTime')]"
@change="onDateChange"
@ok="onDateOk"
/>
</a-form-item>
</a-col>
<a-col :md="6" :sm="8">
<a-form-item :label="$t('log.operationType')">
<j-dict-select-tag v-model="queryParam.operateType" :placeholder="$t('pleaseSelect') + $t('log.operationType')" dictCode="operate_type"/>
</a-form-item>
</a-col>
<div style="float: right;overflow: hidden;margin-right: 12px" class="table-page-search-submitButtons">
<a-button type="primary" @click="searchQuery" icon="search">{{ $t('query') }}</a-button>
<a-button type="primary" @click="searchReset" ghost icon="reload" style="margin-left: 8px;">{{ $t('reset') }}</a-button>
</div>
</a-row>
</a-form>
</div>
<!-- table区域-begin -->
<a-table
ref="table"
size="middle"
rowKey="id"
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
:loading="loading"
@change="handleTableChange">
<div slot="expandedRowRender" slot-scope="record" style="margin: 0">
<div style="margin-bottom: 5px"><a-badge status="success" style="vertical-align: middle;"/><span style="vertical-align: middle;">{{ $t('log.requestMethod') }}:{{ record.method }}</span></div>
<div><a-badge status="processing" style="vertical-align: middle;"/><span style="vertical-align: middle;">{{ $t('log.requestParam') }}:{{ record.requestParam }}</span></div>
</div>
<!-- 字符串超长截取省略号显示-->
<span slot="logContent" slot-scope="text">
<j-ellipsis :value="text" :length="40"/>
</span>
</a-table>
<!-- table区域-end -->
</a-card>
</template>
<script>
import { filterObj } from '@/utils/util'
import { JeroListMixin } from '@/mixins/JeroListMixin'
import JEllipsis from '@/components/jero/JEllipsis'
export default {
name: 'OperatorLogList',
mixins: [JeroListMixin],
components: {
JEllipsis
},
data () {
return {
description: '这是日志管理页面',
// 查询条件
queryParam: {
ipInfo: '',
createTimeRange: [],
logType: '2',
keyWord: ''
},
// 表头
columns: [
{
title: '#',
dataIndex: '',
key: 'rowIndex',
align: 'center',
customRender: function (t, r, index) {
return parseInt(index) + 1
}
},
{
title: this.$t('log.logContent'),
align: 'left',
dataIndex: 'logContent',
scopedSlots: { customRender: 'logContent' },
sorter: true
},
{
title: this.$t('log.operatorID'),
dataIndex: 'userid',
align: 'center',
sorter: true
},
{
title: this.$t('log.operatorName'),
dataIndex: 'username',
align: 'center',
sorter: true
},
{
title: 'IP',
dataIndex: 'ip',
align: 'center',
sorter: true
},
{
title: this.$t('log.elapsedTime'),
dataIndex: 'costTime',
align: 'center',
sorter: true
},
{
title: this.$t('log.logType'),
dataIndex: 'logType_dictText',
align: 'center'
},
{
title: this.$t('createTime'),
dataIndex: 'createTime',
align: 'center',
sorter: true
}
],
operateColumn:
{
title: this.$t('log.operationType'),
dataIndex: 'operateType_dictText',
align: 'center'
},
labelCol: {
xs: { span: 1 },
sm: { span: 2 }
},
wrapperCol: {
xs: { span: 10 },
sm: { span: 16 }
},
url: {
list: '/sys/log/page'
}
}
},
methods: {
getQueryParams () {
const param = Object.assign({}, this.queryParam, this.isorter)
param.field = this.getQueryField()
param.pageNo = this.ipagination.current
param.pageSize = this.ipagination.pageSize
delete param.createTimeRange // 时间参数不传递后台
if (this.superQueryParams) {
param.superQueryParams = encodeURI(this.superQueryParams)
param.superQueryMatchType = this.superQueryMatchType
}
return filterObj(param)
},
// 重置
searchReset () {
const that = this
const logType = that.queryParam.logType
that.queryParam = {} // 清空查询区域参数
that.queryParam.logType = logType
that.loadData(this.ipagination.current)
},
onDateChange: function (value, dateString) {
console.log(dateString[0], dateString[1])
this.queryParam.createTime_begin = dateString[0]
this.queryParam.createTime_end = dateString[1]
},
onDateOk (value) {
console.log(value)
}
}
}
</script>
<style 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>
@@ -0,0 +1,99 @@
<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>
@@ -0,0 +1,210 @@
<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>
@@ -0,0 +1,162 @@
<template>
<j-modal
:title="title"
:width="drawerWidth"
:visible="visible"
:confirmLoading="confirmLoading"
switchFullscreen
@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"
prop="apiName"
label="api名称">
<a-input placeholder="请输入api名称" v-model="model.apiName"/>
</a-form-model-item>
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="apiType"
label="接口类型">
<j-dict-select-tag v-model="model.apiType" placeholder="请选择接口类型" dict-code="asms_open_api_type">
</j-dict-select-tag>
</a-form-model-item>
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="apiUrl"
label="api路径">
<a-input placeholder="请输入api路径" v-model="model.apiUrl"/>
</a-form-model-item>
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="apiType"
label="数据字典id">
<a-select v-model="model.dictId" placeholder="请选择数据字典id"
show-search :filter-option="filterOption">
<a-select-option v-for="item in dictList" :value="item.id" :key="item.id">{{ item.dictName }}</a-select-option>
</a-select>
</a-form-model-item>
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="queryParamJson"
label="参数">
<a-textarea :rows="10" placeholder="请输入参数" v-model="model.queryParamJson"/>
</a-form-model-item>
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="status"
label="状态">
<j-dict-select-tag v-model="model.status" placeholder="请选择接口类型" dict-code="sync_status">
</j-dict-select-tag>
</a-form-model-item>
</a-form-model>
</a-spin>
</j-modal>
</template>
<script>
import { addAsmsInterface, editAsmsInterface } from '@api/api'
import { getAction } from '@api/manage'
export default {
name: 'AsmsInterfaceModal',
data () {
return {
title: this.$t('add'),
drawerWidth: 600,
visible: false,
model: {},
labelCol: {
xs: { span: 24 },
sm: { span: 7 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 }
},
confirmLoading: false,
validatorRules: {},
dictList: []
}
},
methods: {
add () {
this.edit({})
},
edit (record) {
this.visiblekey = !!record.id
this.model = Object.assign({}, record)
this.visible = true
},
// 确定
handleOk () {
const that = this
// 触发表单验证
this.$refs.form.validate(valid => {
if (valid) {
that.confirmLoading = true
let obj
const formData = Object.assign({}, this.model)
if (!this.model.id) {
obj = addAsmsInterface
} else {
obj = editAsmsInterface
}
obj(formData).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()
},
close () {
this.$emit('close')
this.visible = false
this.$refs.form.resetFields()
},
filterOption (input, option) {
return (
option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
)
},
getDictList () {
getAction('/sys/dict/page', {
pageNo: -1,
pageSize: -1
}).then(res => {
if (res.success) {
this.dictList = (res.result && res.result.records) || []
}
})
}
},
created () {
this.getDictList()
}
}
</script>
<style scoped>
</style>
@@ -0,0 +1,164 @@
<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>
+153
View File
@@ -0,0 +1,153 @@
<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>
@@ -0,0 +1,190 @@
<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>
@@ -0,0 +1,116 @@
<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>
+223
View File
@@ -0,0 +1,223 @@
<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>
+188
View File
@@ -0,0 +1,188 @@
<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>
+123
View File
@@ -0,0 +1,123 @@
<template>
<a-card :visible="visible">
<a-form-model ref="form" :model="model">
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="机构名称">
<a-input style="border:0;" placeholder="" v-model="model.departName"/>
</a-form-model-item>
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="上级部门">
<a-tree-select
disabled
style="width:100%;border: 0;border: none;outline:none;"
:dropdownStyle="{maxHeight:'200px',overflow:'auto'}"
:treeData="treeData"
v-model="model.parentId"
placeholder="无">
</a-tree-select>
</a-form-model-item>
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="机构编码">
<a-input style="border:0;" placeholder="" v-model="model.orgCode"/>
</a-form-model-item>
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="机构类型">
<a-radio-group :disabled="true" v-model="model.orgCategory" read-only>
<a-radio value="1">
公司
</a-radio>
<a-radio value="2">
部门
</a-radio>
<a-radio value="3">
岗位
</a-radio>
</a-radio-group>
</a-form-model-item>
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="排序">
<a-input-number style="border:0;" v-model="model.departOrder"/>
</a-form-model-item>
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="手机号">
<a-input style="border:0;" placeholder="" v-model="model.mobile"/>
</a-form-model-item>
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="地址">
<a-input style="border:0;" placeholder="" v-model="model.address"/>
</a-form-model-item>
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="备注">
<a-textarea style="border:0;" placeholder="" v-model="model.memo"/>
</a-form-model-item>
</a-form-model>
</a-card>
</template>
<script>
import { queryIdTree } from '@/api/api'
export default {
name: 'DeptBaseInfo',
components: {},
data () {
return {
departTree: [],
id: '',
model: {},
visible: false,
disable: true,
treeData: [],
labelCol: {
xs: { span: 24 },
sm: { span: 3 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 }
}
}
},
created () {
this.loadTreeData()
},
methods: {
loadTreeData () {
queryIdTree().then((res) => {
if (res.success) {
for (let i = 0; i < res.result.length; i++) {
const temp = res.result[i]
this.treeData.push(temp)
}
}
})
},
open (record) {
this.visible = true
this.$nextTick(() => {
this.$refs.form.resetFields()
this.model = Object.assign({}, record)
})
},
clearForm () {
this.$refs.form.resetFields()
this.treeData = []
}
}
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>
+320
View File
@@ -0,0 +1,320 @@
<template>
<a-card :bordered="false">
<!-- 查询区域 -->
<div class="table-page-search-wrapper">
<!-- 搜索区域 -->
<a-form layout="inline">
<a-row :gutter="10">
<a-col :md="10" :sm="12">
<a-form-item label="用户账号" style="margin-left:8px">
<a-input placeholder="请输入账号" v-model="queryParam.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="searchQuery" icon="search" style="margin-left: 18px">查询</a-button>
<a-button type="primary" @click="searchReset" icon="reload" ghost style="margin-left: 8px">重置</a-button>
</div>
</a-row>
</a-form>
</div>
<!-- 操作按钮区域 -->
<div class="table-operator" style="margin-top: -15px">
<!--<a-button @click="handleEdit" type="primary" icon="edit" style="margin-top: 16px">用户编辑</a-button>-->
<a-button @click="handleAddUserDepart" type="primary" icon="plus">添加已有用户</a-button>
<!--<a-button @click="handleAdd" type="primary" icon="plus" style="margin-top: 16px">新建用户</a-button>-->
<a-dropdown v-if="selectedRowKeys.length > 0">
<a-menu slot="overlay">
<a-menu-item key="1" @click="batchDel">
<a-icon type="delete"/>
取消关联
</a-menu-item>
</a-menu>
<a-button style="margin-left: 8px"> 批量操作
<a-icon type="down"/>
</a-button>
</a-dropdown>
</div>
<!-- table区域-begin -->
<div>
<a-table
ref="table"
size="middle"
bordered
rowKey="id"
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
:loading="loading"
:scroll="{x: '100%', y: yScrollHeight}"
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
@change="handleTableChange">
<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="more" class="operate-icon-btn operate-icon-more" />
</a>
<a-menu slot="overlay">
<a-menu-item>
<a href="javascript:" @click="handleDetail(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>
</a-table>
</div>
<!-- table区域-end -->
<!-- 表单区域 -->
<user-modal ref="modalForm" @ok="modalFormOk"></user-modal>
<Select-User-Modal ref="selectUserModal" @selectFinished="selectOK"></Select-User-Modal>
</a-card>
</template>
<script>
import { JeroListMixin } from '@/mixins/JeroListMixin'
import { getAction, postAction } from '@/api/manage'
import SelectUserModal from './SelectUserModal'
import UserModal from './UserModal'
export default {
name: 'DeptUserInfo',
mixins: [JeroListMixin],
components: {
SelectUserModal,
UserModal
},
data () {
return {
description: '用户信息',
currentDeptId: '',
currentDept: {},
// 表头
columns: [{
title: '用户账号',
align: 'center',
dataIndex: 'username'
},
{
title: '用户姓名',
align: 'center',
dataIndex: 'realname'
},
{
title: '部门',
align: 'center',
dataIndex: 'orgCode'
},
{
title: '性别',
align: 'center',
dataIndex: 'sex_dictText'
},
{
title: '电话',
align: 'center',
dataIndex: 'phone'
},
{
title: '操作',
dataIndex: 'action',
scopedSlots: { customRender: 'action' },
align: 'center',
width: 150
}],
url: {
list: '/sys/user/departUserList',
edit: '/sys/user/editSysDepartWithUser',
delete: '/sys/user/deleteUserInDepart',
deleteBatch: '/sys/user/deleteUserInDepartBatch'
}
}
},
created () {
},
methods: {
searchReset () {
this.queryParam = {}
this.loadData(1)
},
loadData (arg) {
if (!this.url.list) {
this.$message.warning('请设置url.list属性!')
return
}
// 加载数据 若传入参数1则加载第一页的内容
if (arg === 1) {
this.ipagination.current = 1
}
// if (this.currentDeptId === '') return;
const params = this.getQueryParams()// 查询条件
params.depId = this.currentDeptId
getAction(this.url.list, params).then((res) => {
if (res.success && res.result) {
this.dataSource = res.result.records
this.ipagination.total = res.result.total
}
})
},
batchDel: function () {
if (!this.url.deleteBatch) {
this.$message.warning('请设置url.deleteBatch属性!')
return
}
if (!this.currentDeptId) {
this.$message.warning('未选中任何部门,无法取消部门与用户的关联!')
return
}
if (this.selectedRowKeys.length <= 0) {
this.$message.warning('请选择一条记录!')
} else {
let ids = ''
for (let a = 0; a < this.selectedRowKeys.length; a++) {
ids += this.selectedRowKeys[a] + ','
}
const that = this
console.log(this.currentDeptId)
this.$confirm({
title: '确认取消',
content: '是否取消用户与选中部门的关联?',
onOk: function () {
postAction(that.url.deleteBatch, { depId: that.currentDeptId, userIds: ids }).then((res) => {
if (res.success) {
that.$message.success('删除用户与选中部门关系成功!')
that.loadData()
that.onClearSelected()
} else {
that.$message.warning(res.message)
}
})
}
})
}
},
handleDelete: function (id) {
if (!this.url.delete) {
this.$message.warning('请设置url.delete属性!')
return
}
if (!this.currentDeptId) {
this.$message.warning('未选中任何部门,无法取消部门与用户的关联!')
return
}
const that = this
postAction(that.url.delete, { depId: this.currentDeptId, userId: id }).then((res) => {
if (res.success) {
that.$message.success('删除用户与选中部门关系成功!')
if (this.selectedRowKeys.length > 0) {
for (let i = 0; i < this.selectedRowKeys.length; i++) {
if (this.selectedRowKeys[i] === id) {
this.selectedRowKeys.splice(i, 1)
break
}
}
}
that.loadData()
} else {
that.$message.warning(res.message)
}
})
},
open (record) {
this.currentDeptId = record.id
this.currentDept = record
this.loadData(1)
},
clearList () {
this.currentDeptId = ''
this.dataSource = []
},
hasSelectDept () {
if (!this.currentDeptId) {
this.$message.warning('请选择一个部门!')
return false
}
return true
},
handleAddUserDepart () {
if (!this.currentDeptId) {
this.$message.warning('请选择一个部门!')
} else {
this.$refs.selectUserModal.visible = true
}
},
handleEdit: function (record) {
this.$refs.modalForm.title = '编辑'
this.$refs.modalForm.departDisabled = true
this.$refs.modalForm.disableSubmit = false
this.$refs.modalForm.edit(record)
},
// handleAdd: function () {
// if (!this.currentDeptId) {
// this.$message.warning('请选择一个部门!')
// } else {
// this.$refs.modalForm.departDisabled = true
// // 初始化负责部门
// this.$refs.modalForm.nextDepartOptions = [{ value: this.currentDept.key, label: this.currentDept.title }]
// this.$refs.modalForm.title = '新增'
// this.$refs.modalForm.edit({ activitiSync: '1', userIdentity: 1, selecteddeparts: this.currentDeptId })
// }
// },
selectOK (data) {
const params = {}
params.depId = this.currentDeptId
params.userIdList = []
for (let a = 0; a < data.length; a++) {
params.userIdList.push(data[a])
}
console.log(params)
postAction(this.url.edit, params).then((res) => {
if (res.success) {
this.$message.success(res.message)
this.loadData()
} else {
this.$message.warning(res.message)
}
})
}
}
}
</script>
<style lang="less" scoped>
@import '~@assets/less/common.less';
/** Button按钮间距 */
.ant-btn {
margin-left: 3px
}
.ant-card {
margin-left: -30px;
padding: 12px;
margin-right: -30px;
}
.table-page-search-wrapper {
margin-top: -16px;
margin-bottom: 16px;
}
/deep/ .table-page-search-wrapper .ant-form-inline .ant-form-item > .ant-form-item-label {
min-width: 80px;
}
</style>
+212
View File
@@ -0,0 +1,212 @@
<template>
<j-modal
:title="title"
:width="800"
:visible="visible"
:confirmLoading="confirmLoading"
switchFullscreen
@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"
prop="itemText"
:label="$t('name')">
<a-input :placeholder="$t('pleaseEnter') + $t('name')"
:maxLength="50"
v-model="model.itemText" />
</a-form-model-item>
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="enName"
:label="$t('englishName')">
<a-input :placeholder="$t('pleaseEnter') + $t('englishName')"
:maxLength="50"
v-model="model.enName" />
</a-form-model-item>
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="itemValue"
:label="$t('dict.dataValue')">
<a-input :placeholder="$t('pleaseEnter') + $t('dict.dataValue')" v-model="model.itemValue" />
</a-form-model-item>
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('description')">
<a-input :maxLength="50" v-model="model.description" />
</a-form-model-item>
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('dict.rankingValue')">
<a-input-number :min="1" :max="99999" v-model="model.sortOrder" />
{{ $t('dict.valueSmallerIsHigher') }}
</a-form-model-item>
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('whether') + $t('enable')"
:hasFeedback="true">
<a-switch :checkedChildren="$t('enable')" :unCheckedChildren="$t('disable')" @change="onChose" v-model="visibleCheck" />
</a-form-model-item>
</a-form-model>
</a-spin>
</j-modal>
</template>
<script>
// import pick from 'lodash.pick'
import { addDictItem, editDictItem } from '@/api/api'
import { getAction } from '@api/manage'
import { IsReadOnlyEnums } from '../../../enums/commonEnums'
export default {
name: 'DictItemModal',
data () {
return {
title: this.$t('operation'),
visible: false,
visibleCheck: true,
model: {},
dictId: '',
status: 1,
labelCol: {
xs: { span: 24 },
sm: { span: 5 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 }
},
confirmLoading: false,
validatorRules: {
itemText: [{ required: true, message: this.$t('pleaseEnter') + this.$t('name') + '!' }],
itemValue: [{
required: true,
message: this.$t('pleaseEnter') + this.$t('dict.dataValue') + '!'
}, { validator: this.validateItemValue }]
}
}
},
created () {
},
methods: {
add (dictId) {
this.dictId = dictId
// 初始化默认值
this.edit({ sortOrder: 1, status: 1 })
},
edit (record) {
if (record.id) {
this.dictId = record.dictId
}
this.status = record.status
this.visibleCheck = (record.status === 1)
this.model = Object.assign({}, record)
this.model.dictId = this.dictId
this.model.status = this.status
this.visible = true
},
onChose (checked) {
if (checked) {
this.status = 1
this.visibleCheck = true
} else {
this.status = 0
this.visibleCheck = false
}
},
// 确定
handleOk () {
const that = this
// 触发表单验证
this.$refs.form.validate(valid => {
if (valid) {
that.confirmLoading = true
this.model.itemText = (this.model.itemText || '').trim()
this.model.itemValue = (this.model.itemValue || '').trim()
this.model.description = (this.model.description || '').trim()
this.model.status = this.status
let obj
// 数据字典
if (!this.model.id) {
obj = addDictItem
} else {
obj = editDictItem
}
const params = Object.assign({
isTagDict: 0, // 是否为标签管理的表示
isReadOnly: IsReadOnlyEnums.configurable.value // 是否可以操作,默认是可配的
}, this.model, {
dictId: this.dictId, // 数据字典的id
delFlag: 0 // 是否删除的标识,新的接口必须增加这一个字段,可以联系后端沟通,否则不能查看
})
obj(params).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()
},
close () {
this.$emit('close')
this.visible = false
this.$refs.form.resetFields()
},
validateItemValue (rule, value, callback) {
const param = {
itemValue: value,
dictId: this.dictId
}
if (this.model.id) {
param.id = this.model.id
}
if (value) {
const reg = new RegExp('[`_~!@#$^&*()=|{}\'.<>《》?!¥()—【】‘;:”“。,、?]')
if (reg.test(value)) {
callback(new Error(this.$t('dict.valueCannotContainSpecChar')))
} else {
// update--begin--autor:lvdandan-----date:20201203------forJT-27【数据字典】字典 - 数据值可重复
getAction('/sys/dictItem/dictItemCheck', param).then((res) => {
if (res.success) {
callback()
} else {
callback(res.message)
}
})
// update--end--autor:lvdandan-----date:20201203------forJT-27【数据字典】字典 - 数据值可重复
}
} else {
callback()
}
}
}
}
</script>
+168
View File
@@ -0,0 +1,168 @@
<template>
<j-modal
:title="title"
:width="600"
:visible="visible"
:confirmLoading="confirmLoading"
switchFullscreen
@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"
prop="dictName"
required
:label="$t('dict.dictionaryName')">
<a-input :maxLength="50" :placeholder="$t('pleaseEnter') + $t('dict.dictionaryName')" v-model="model.dictName" />
</a-form-model-item>
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="dictEnglishName"
:label="$t('dict.dictionaryEnglishName')">
<a-input :maxLength="50" :placeholder="$t('pleaseEnter') + $t('dict.dictionaryEnglishName')" v-model="model.dictEnglishName" />
</a-form-model-item>
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="dictCode"
required
:label="$t('dict.dictionaryNumber')">
<a-input
:maxLength="50"
:placeholder="$t('pleaseEnter') + $t('dict.dictionaryNumber')"
v-model="model.dictCode"
/>
</a-form-model-item>
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
:label="$t('description')">
<a-textarea :maxLength="500" v-model="model.description" :placeholder="$t('pleaseEnter') + $t('system.tag.describe')"/>
</a-form-model-item>
</a-form-model>
</a-spin>
</j-modal>
</template>
<script>
// import pick from 'lodash.pick'
import { addDict, editDict, duplicateCheck } from '@/api/api'
import { getConfusionCode } from '@/utils/util'
export default {
name: 'DictModal',
data () {
return {
value: 1,
title: this.$t('operation'),
visible: false,
model: {},
labelCol: {
xs: { span: 24 },
sm: { span: 7 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 }
},
confirmLoading: false,
validatorRules: {
dictName: [{ required: true, message: this.$t('pleaseEnter') + this.$t('dict.dictionaryName') + '!' }],
dictCode: [
{ required: true, message: this.$t('pleaseEnter') + this.$t('dict.dictionaryNumber') + '!' },
{ validator: this.validateDictCode }]
}
}
},
created () {
},
methods: {
validateDictCode (rule, value, callback) {
const confusionCode = getConfusionCode('sys_dict', 'dict_code')
// 重复校验
const params = {
// tableName: 'sys_dict',
// fieldName: 'dict_code',
confusionCode,
fieldVal: value,
dataId: this.model.id
}
duplicateCheck(params).then((res) => {
if (res.success) {
callback()
} else {
callback(res.message)
}
})
},
handleChange (value) {
this.model.status = value
},
add () {
this.edit({})
},
edit (record) {
this.visiblekey = !!record.id
this.model = Object.assign({}, record)
this.visible = true
},
// 确定
handleOk () {
const that = this
// 触发表单验证
this.$refs.form.validate(valid => {
if (valid) {
that.confirmLoading = true
this.model.dictName = (this.model.dictName || '').trim()
this.model.dictCode = (this.model.dictCode || '').trim()
this.model.description = (this.model.description || '').trim()
let obj
const formData = Object.assign({}, this.model)
if (!this.model.id) {
obj = addDict
// 设置为非固定字段--默认可以编辑
formData.isReadOnly = 0
} else {
obj = editDict
}
// 重要,设置为数据字典内容
formData.isTagDict = 0
obj(formData).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()
},
close () {
this.$emit('close')
this.visible = false
this.$refs.form.resetFields()
}
}
}
</script>
+145
View File
@@ -0,0 +1,145 @@
<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>
@@ -0,0 +1,171 @@
<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="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="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>
@@ -0,0 +1,379 @@
<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'?'请选择上级菜单':'&nbsp;&nbsp;' }}</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>
+140
View File
@@ -0,0 +1,140 @@
<template>
<j-modal
:title="title"
:width="800"
:visible="visible"
:confirmLoading="confirmLoading"
switchFullscreen
@ok="handleOk"
@cancel="handleCancel"
okText="保存并安排任务"
cancelText="关闭">
<a-spin :spinning="confirmLoading">
<a-form-model ref="form" :model="model" :rules="validatorRules">
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="任务类名" prop="jobClassName" :hasFeedback="true" >
<a-input placeholder="请输入任务类名" v-model="model.jobClassName" />
</a-form-model-item>
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="Cron表达式" prop="cronExpression">
<!-- <j-cron v-model="model.cronExpression"/>-->
<j-easy-cron v-model="model.cronExpression" />
</a-form-model-item>
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="参数" prop="parameter" >
<a-textarea placeholder="请输入参数" :rows="5" v-model="model.parameter" />
</a-form-model-item>
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="描述" prop="description">
<a-textarea placeholder="请输入描述" :rows="3" v-model="model.description" />
</a-form-model-item>
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="状态" prop="status">
<j-dict-select-tag type="radioButton" v-model="model.status" dictCode="quartz_status"/>
</a-form-model-item>
</a-form-model>
</a-spin>
</j-modal>
</template>
<script>
import { httpAction } from '@/api/manage'
import cronValidator from '@/components/jero/JEasyCron/validator'
export default {
name: 'QuartzJobModal',
components: {
},
data () {
return {
title: '操作',
buttonStyle: 'solid',
visible: false,
model: {},
labelCol: {
xs: { span: 24 },
sm: { span: 5 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 }
},
cron: {
label: '',
value: ''
},
confirmLoading: false,
form: this.$form.createForm(this),
validatorRules: {
cronExpression: [
{ required: true, message: '请输入cron表达式!' },
{ validator: cronValidator }
],
jobClassName: [{ required: true, message: '请输入任务类名!' }]
},
url: {
add: '/sys/quartzJob/add',
edit: '/sys/quartzJob/edit'
}
}
},
created () {
},
methods: {
add () {
// 统一设置默认值
this.edit({
cronExpression: '* * * * * ? *',
status: 0
})
},
edit (record) {
this.visible = true
this.$nextTick(() => {
this.$refs.form.resetFields()
this.model = Object.assign({}, record)
})
},
close () {
this.$emit('close')
this.visible = false
},
handleOk () {
const that = this
// 触发表单验证
this.$refs.form.validate((ok/* , err */) => {
if (ok) {
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'
}
console.log('提交参数', this.model)
httpAction(httpurl, this.model, method).then((res) => {
if (res.success) {
that.$message.success(res.message)
that.$emit('ok')
that.close()
} else {
that.$message.warning(res.message)
}
}).finally(() => {
that.confirmLoading = false
})
}
})
},
handleCancel () {
this.close()
}
}
}
</script>
<style scoped>
</style>
+166
View File
@@ -0,0 +1,166 @@
<!--用户管理-角色配置弹框-->
<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>
@@ -0,0 +1,120 @@
<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>
+161
View File
@@ -0,0 +1,161 @@
<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>
@@ -0,0 +1,290 @@
<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>
@@ -0,0 +1,294 @@
<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>
@@ -0,0 +1,359 @@
<template>
<j-modal
:title="title"
switchFullscreen
:width="900"
:visible="visible"
:confirmLoading="confirmLoading"
@ok="handleOk"
@cancel="handleCancel"
:okButtonProps="{ props: {disabled: disabled} }"
cancelText="关闭">
<a-spin :spinning="confirmLoading">
<a-form-model ref="form" :model="model" :rules="validatorRules">
<a-row style="width: 100%;">
<a-col :span="24/2">
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="titile"
label="标题">
<a-input placeholder="请输入标题" v-model="model.titile" :readOnly="disableSubmit"/>
</a-form-model-item>
</a-col>
<a-col :span="24/2">
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="msgCategory"
label="消息类型">
<a-select
v-model="model.msgCategory"
placeholder="请选择消息类型"
:disabled="disableSubmit"
:getPopupContainer = "(target) => target.parentNode">
<a-select-option value="1">通知公告</a-select-option>
<a-select-option value="2">系统消息</a-select-option>
</a-select>
</a-form-model-item>
</a-col>
</a-row>
<a-row style="width: 100%;">
<a-col :span="24/2">
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="startTime"
label="开始时间:">
<j-date style="width: 100%" :getCalendarContainer="node => node.parentNode" v-model="model.startTime" placeholder="请选择开始时间" showTime dateFormat="YYYY-MM-DD HH:mm:ss" ></j-date>
</a-form-model-item>
</a-col>
<a-col :span="24/2">
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="endTime"
label="结束时间"
class="endTime">
<j-date style="width: 100%" :getCalendarContainer="node => node.parentNode" v-model="model.endTime" placeholder="请选择结束时间" showTime dateFormat="YYYY-MM-DD HH:mm:ss"></j-date>
</a-form-model-item>
</a-col>
</a-row>
<a-row style="width: 100%;">
<a-col :span="24/2">
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="优先级">
<a-select
v-model="model.priority"
placeholder="请选择优先级"
:disabled="disableSubmit"
:getPopupContainer = "(target) => target.parentNode">
<a-select-option value="L"></a-select-option>
<a-select-option value="M"></a-select-option>
<a-select-option value="H"></a-select-option>
</a-select>
</a-form-model-item>
</a-col>
<a-col :span="24/2">
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="msgType"
label="通告类型">
<a-select
v-model="model.msgType"
placeholder="请选择通告类型"
:disabled="disableSubmit"
@change="chooseMsgType"
:getPopupContainer = "(target) => target.parentNode">
<a-select-option value="USER">指定用户</a-select-option>
<a-select-option value="ALL">全体用户</a-select-option>
</a-select>
</a-form-model-item>
</a-col>
</a-row>
<a-row style="width: 100%;">
<a-col :span="24/2">
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
prop="msgAbstract"
label="摘要">
<a-textarea placeholder="请输入摘要" v-model="model.msgAbstract" />
</a-form-model-item>
</a-col>
<a-col :span="24/2">
<a-form-model-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="指定用户"
v-if="userType">
<a-select
mode="multiple"
placeholder="请选择用户"
:labelInValue=true
v-model="selectedUser"
@dropdownVisibleChange="selectUserIds"
@change="handleChange"
>
</a-select>
</a-form-model-item>
</a-col>
</a-row>
<a-row style="width: 100%;">
<a-col :span="24">
<a-form-model-item
:labelCol="labelColX1"
:wrapperCol="wrapperColX1"
label="内容"
class="j-field-content">
<j-editor v-model="model.msgContent"></j-editor>
</a-form-model-item>
</a-col>
</a-row>
</a-form-model>
</a-spin>
<select-user-list-modal ref="UserListModal" @choseUser="choseUser"></select-user-list-modal>
</j-modal>
</template>
<script>
import { httpAction, postAction } from '@/api/manage'
// import pick from 'lodash.pick'
import JDate from '@/components/jero/JDate'
import JEditor from '@/components/jero/JEditor'
import SelectUserListModal from './SelectUserListModal'
import moment from 'moment'
export default {
components: { JEditor, JDate, SelectUserListModal },
name: 'SysAnnouncementModal',
data () {
return {
title: '操作',
visible: false,
disableSubmit: false,
model: {},
labelCol: {
xs: { span: 24 },
sm: { span: 6 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 18 }
},
labelColX1: {
xs: { span: 24 },
sm: { span: 3 }
},
wrapperColX1: {
xs: { span: 24 },
sm: { span: 21 }
},
confirmLoading: false,
validatorRules: {
titile: [{ required: true, message: '请输入标题!' }],
msgCategory: [{ required: true, message: '请选择消息类型!' }],
msgType: [{ required: true, message: '请选择通告对象类型!' }],
endTime: [{ required: true, message: '请选择结束时间!' }, { validator: this.endTimeValidate }],
startTime: [{ required: true, message: '请选择开始时间!' }, { validator: this.startTimeValidate }],
msgAbstract: [{ required: true, message: '请输入摘要!' }]
},
url: {
queryByIds: '/sys/user/queryByIds',
add: '/sys/annountCement/add',
edit: '/sys/annountCement/edit'
},
userType: false,
userIds: [],
selectedUser: [],
disabled: false,
msgContent: '',
userList: []
}
},
created () {
},
methods: {
add () {
this.edit({})
},
edit (record) {
this.model = {}
this.disable = false
this.visible = true
this.getUser(record)
},
getUser (record) {
this.model = Object.assign({}, record)
// 指定用户
if (record && record.msgType === 'USER') {
this.userType = true
this.userIds = record.userIds
postAction(this.url.queryByIds, { userIds: this.userIds }).then((res) => {
if (res.success) {
// update--begin--autor:wangshuai-----date:20200601------for:系统公告选人后,不能删除------
const userList = []
for (let i = 0; i < res.result.length; i++) {
const user = {}
user.label = res.result[i].realname
user.key = res.result[i].id
userList.push(user)
}
this.selectedUser = userList
// update--begin--autor:wangshuai-----date:20200601------for:系统公告选人后,不能删除------
this.$refs.UserListModal.edit(res.result, this.userIds)
}
})
}
},
close () {
this.$emit('close')
this.selectedUser = []
this.visible = false
this.$refs.form.resetFields()
},
handleOk () {
const that = this
// 当设置指定用户类型,但用户为空时,后台报错
if (this.userType && !(this.userIds != null && this.userIds.length > 0)) {
this.$message.warning('指定用户不能为空!')
return
}
// 触发表单验证
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'
}
if (this.userType) {
this.model.userIds = this.userIds
}
httpAction(httpurl, this.model, method).then((res) => {
if (res.success) {
that.$message.success(res.message)
that.$emit('ok')
that.resetUser()
} else {
that.$message.warning(res.message)
}
}).finally(() => {
that.confirmLoading = false
that.close()
})
} else {
return false
}
})
},
handleCancel () {
this.visible = false
this.$emit('close')
this.$refs.form.resetFields()
this.resetUser()
},
resetUser () {
this.userType = false
this.userIds = []
this.selectedUser = []
this.disabled = false
this.$refs.UserListModal.edit(null, null)
},
selectUserIds () {
this.$refs.UserListModal.add(this.selectedUser, this.userIds)
},
chooseMsgType (value) {
if (value === 'USER') {
this.userType = true
} else {
this.userType = false
this.selectedUser = []
this.userIds = []
}
},
// 子modal回调
choseUser: function (userList) {
this.selectedUser = []
this.userIds = []
for (let i = 0; i < userList.length; i++) {
// update--begin--autor:wangshuai-----date:20200601------for:系统公告选人后,不能删除------
const user = {}
user.label = userList[i].realname
user.key = userList[i].id
this.selectedUser.push(user)
// update--end--autor:wangshuai-----date:20200601------for:系统公告选人后,不能删除------
this.userIds += userList[i].id + ','
}
},
startTimeValidate (rule, value, callback) {
const endTime = this.model.endTime
if (!value || !endTime) {
callback()
} else if (moment(value).isBefore(endTime)) {
callback()
} else {
callback(new Error('开始时间需小于结束时间'))
}
},
endTimeValidate (rule, value, callback) {
const startTime = this.model.startTime
if (!value || !startTime) {
callback()
} else if (moment(startTime).isBefore(value)) {
callback()
} else {
callback(new Error('结束时间需大于开始时间'))
}
},
handleChange (userList) {
const users = []
if (userList) {
this.userIds = []
for (let i = 0; i < userList.length; i++) {
const user = {}
user.id = userList[i].key
user.realname = userList[i].label
this.userIds += userList[i].key + ','
users.push(user)
}
}
this.$refs.UserListModal.edit(users, this.userIds)
}
}
}
</script>
<style scoped>
</style>
@@ -0,0 +1,159 @@
<template>
<j-modal
:title="title"
:width="width"
:visible="visible"
:confirmLoading="confirmLoading"
switchFullscreen
@ok="handleOk"
@cancel="handleCancel"
:destroyOnClose="true"
cancelText="关闭">
<a-spin :spinning="confirmLoading">
<a-form-model ref="form" :model="model" :rules="validatorRules">
<a-form-model-item label="父级节点" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="pid">
<j-tree-select
ref="treeSelect"
placeholder="请选择父级节点"
v-model="model.pid"
dict="sys_category,name,id"
pidField="pid"
pidValue="0"
:disabled="disabled">
</j-tree-select>
</a-form-model-item>
<a-form-model-item label="分类名称" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="name">
<a-input v-model="model.name" placeholder="请输入分类名称"></a-input>
</a-form-model-item>
</a-form-model>
</a-spin>
</j-modal>
</template>
<script>
import { httpAction } from '@/api/manage'
import JTreeSelect from '@/components/jero/JTreeSelect'
export default {
name: 'SysCategoryModal',
components: {
JTreeSelect
},
data () {
return {
title: '操作',
width: 800,
visible: false,
model: {},
labelCol: {
xs: { span: 24 },
sm: { span: 5 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 }
},
confirmLoading: false,
validatorRules: {
pid: {},
name: [{ required: true, message: '请输入类型名称!' }]
},
url: {
add: '/sys/category/add',
edit: '/sys/category/edit',
checkCode: '/sys/category/checkCode'
},
expandedRowKeys: [],
pidField: 'pid',
subExpandedKeys: []
}
},
created () {
},
computed: {
disabled () {
return !!this.model.id
}
},
methods: {
add () {
this.edit({})
},
edit (record) {
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 = ''
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)
// close的时候清空了表单的值 导致model为空 修改值在列表页没有变 此处需要复制一下model
that.submitSuccess({ ...this.model })
} else {
that.$message.warning(res.message)
}
}).finally(() => {
that.confirmLoading = false
that.close()
})
} else {
return false
}
})
},
handleCancel () {
this.close()
},
submitSuccess (formData) {
if (!formData.id) {
const treeData = this.$refs.treeSelect.getCurrTreeData()
this.expandedRowKeys = []
this.getExpandKeysByPid(formData[this.pidField], treeData, treeData)
if (formData.pid && this.expandedRowKeys.length === 0) {
this.expandedRowKeys = this.subExpandedKeys
}
this.$emit('ok', formData, this.expandedRowKeys.reverse())
} else {
this.$emit('ok', formData)
}
},
getExpandKeysByPid (pid, arr, all) {
if (pid && arr && arr.length > 0) {
for (let i = 0; i < arr.length; i++) {
if (arr[i].key === pid) {
this.expandedRowKeys.push(arr[i].key)
this.getExpandKeysByPid(arr[i].parentId, all, all)
} else {
this.getExpandKeysByPid(pid, arr[i].children, all)
}
}
}
}
}
}
</script>
@@ -0,0 +1,363 @@
<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" label="规则名称" prop="ruleName" >
<a-input placeholder="请输入规则名称" v-model="model.ruleName"/>
</a-form-model-item>
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="规则Code" prop="ruleCode">
<a-input placeholder="请输入规则Code" v-model="model.ruleCode"/>
</a-form-model-item>
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="规则描述" prop="ruleDescription">
<a-textarea placeholder="请输入规则描述" v-model="model.ruleDescription"/>
</a-form-model-item>
</a-form-model>
<!-- 规则设计 -->
<a-tabs v-model="tabs.activeKey">
<a-tab-pane tab="局部规则" :key="tabs.design.key" forceRender>
<a-alert type="info" showIcon message="局部规则按照你输入的位数有序的校验。"/>
<j-editable-table ref="designTable" dragSort rowNumber :maxHeight="240" :columns="tabs.design.columns" :dataSource="tabs.design.dataSource" style="margin-top: 8px;">
<template #action="props">
<my-action-button :rowEvent="props"/>
</template>
</j-editable-table>
</a-tab-pane>
<a-tab-pane tab="全局规则" :key="tabs.global.key" forceRender>
<j-editable-table ref="globalTable" dragSort rowNumber actionButton :maxHeight="240" :columns="tabs.global.columns" :dataSource="tabs.global.dataSource">
<template #actionButtonAfter>
<a-alert type="info" showIcon message="全局规则可校验用户输入的所有字符;全局规则的优先级比局部规则的要高。" style="margin-bottom: 8px;"/>
</template>
<template #action="props">
<my-action-button :rowEvent="props" allowEmpty/>
</template>
</j-editable-table>
</a-tab-pane>
</a-tabs>
</a-spin>
</j-modal>
</template>
<script>
import pick from 'lodash.pick'
import { httpAction } from '@/api/manage'
import { validateDuplicateValue, alwaysResolve, failedSymbol } from '@/utils/util'
import { FormTypes } from '@/utils/JEditableTableUtil'
import JEditableTable from '@comp/jero/JEditableTable'
export default {
name: 'SysCheckRuleModal',
components: {
JEditableTable,
'my-action-button': {
props: { rowEvent: Object, allowEmpty: Boolean },
methods: {
confirmIsShow () {
const { index, allValues: { inputValues } } = this.rowEvent
const value = inputValues[index]
return value.digits || value.pattern
},
handleLineAdd () {
const { target } = this.rowEvent
target.add()
},
handleLineDelete () {
const { rowId, target } = this.rowEvent
target.removeRows(rowId)
},
renderDeleteButton () {
if (this.allowEmpty || this.rowEvent.index > 0) {
if (this.confirmIsShow()) {
return (
<a-popconfirm title="确定要删除吗?" onConfirm={this.handleLineDelete}>
<a-button icon="minus"/>
</a-popconfirm>
)
} else {
return (
<a-button icon="minus" onClick={this.handleLineDelete}/>
)
}
}
return ''
}
},
render () {
return (
<div>
<a-button onClick={this.handleLineAdd} icon="plus"/>
&nbsp;
{this.renderDeleteButton()}
</div>
)
}
}
},
data () {
return {
title: '操作',
visible: false,
model: {},
labelCol: {
xs: { span: 24 },
sm: { span: 5 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 }
},
confirmLoading: false,
validatorRules: {
ruleName: [{ required: true, message: '请输入规则名称!' }],
ruleCode: [
{ required: true, message: '请输入规则Code!' },
{ validator: (rule, value, callback) => validateDuplicateValue(false, 'sys_check_rule', 'rule_code', value, this.model.id, callback) }
]
},
tabs: {
activeKey: 'design',
global: {
key: 'global',
columns: [
{
title: '优先级',
key: 'priority',
width: '15%',
type: FormTypes.select,
defaultValue: '1',
options: [
{ title: '优先运行', value: '1' },
{ title: '最后运行', value: '0' }
],
validateRules: []
},
{
title: '规则(正则表达式)',
key: 'pattern',
width: '50%',
type: FormTypes.input,
validateRules: [
{ required: true, message: '规则不能为空' },
{ handler: this.validatePatternHandler }
]
},
{
title: '提示文本',
key: 'message',
width: '20%',
type: FormTypes.input,
validateRules: [
// eslint-disable-next-line no-template-curly-in-string
{ required: true, message: '${title}不能为空' }
]
},
{
title: '操作',
key: 'action',
width: '15%',
slotName: 'action',
type: FormTypes.slot
}
],
dataSource: []
},
design: {
key: 'design',
columns: [
{
title: '位数',
key: 'digits',
width: '15%',
type: FormTypes.inputNumber,
validateRules: [
// eslint-disable-next-line no-template-curly-in-string
{ required: true, message: '${title}不能为空' },
{ pattern: /^[1-9]\d*$/, message: '请输入零以上的正整数' }
]
},
{
title: '规则(正则表达式)',
key: 'pattern',
width: '50%',
type: FormTypes.input,
validateRules: [
{ required: true, message: '规则不能为空' },
{ handler: this.validatePatternHandler }
]
},
{
title: '提示文本',
key: 'message',
width: '20%',
type: FormTypes.input,
validateRules: [
// eslint-disable-next-line no-template-curly-in-string
{ required: true, message: '${title}不能为空' }
]
},
{
title: '操作',
key: 'action',
width: '15%',
slotName: 'action',
type: FormTypes.slot
}
],
dataSource: []
}
},
url: {
add: '/sys/checkRule/add',
edit: '/sys/checkRule/edit'
}
}
},
created () {
},
methods: {
validatePatternHandler (type, value, row, column, callback) {
let status = null
if (type === 'blur' || type === 'getValues') {
try {
status = !!new RegExp(value)
callback(status)
} catch (e) {
status = false
callback(status, '请输入正确的正则表达式')
}
} else {
status = true
callback(status) // 不填写或者填写 null 代表不进行任何操作
}
},
add () {
this.edit({})
},
edit (record) {
this.tabs.activeKey = this.tabs.design.key
this.tabs.global.dataSource = []
this.tabs.design.dataSource = [{ digits: '', pattern: '', message: '' }]
this.visible = true
this.$nextTick(() => {
this.$refs.form.resetFields()
this.model = Object.assign({}, record)
// 子表数据
const ruleJson = this.model.ruleJson
if (ruleJson) {
const ruleList = JSON.parse(ruleJson)
// 筛选出全局规则和局部规则
const global = []; const design = []; let priority = '1'
ruleList.forEach(rule => {
if (rule.digits === '*') {
global.push(Object.assign(rule, { priority }))
} else {
priority = '0'
design.push(rule)
}
})
this.tabs.global.dataSource = global
this.tabs.design.dataSource = design
}
})
},
close () {
this.$emit('close')
this.visible = false
},
handleOk () {
Promise.all([
// 主表单校验
alwaysResolve(new Promise((resolve, reject) => {
this.$refs.form.validate((ok, err) => ok ? resolve(this.model) : reject(err))
})),
// 局部规则子表校验
alwaysResolve(this.$refs.designTable.getValuesPromise),
// 全局规则子表校验
alwaysResolve(this.$refs.globalTable.getValuesPromise)
]).then(results => {
const [mainResult, designResult, globalResult] = results
let errorInfo = ''
if (mainResult.type === failedSymbol) {
errorInfo = '主表校验未通过'
return Promise.reject(errorInfo)
} else if (designResult.type === failedSymbol) {
this.tabs.activeKey = this.tabs.design.key
errorInfo = '局部规则子表校验未通过'
return Promise.reject(errorInfo)
} else if (globalResult.type === failedSymbol) {
this.tabs.activeKey = this.tabs.global.key
errorInfo = '全局规则子表校验未通过'
return Promise.reject(errorInfo)
} else {
// 所有校验已通过,这一步是整合数据
const mainValues = mainResult.data; const globalValues = globalResult.data; const designValues = designResult.data
// 整合两个子表的数据
const firstGlobal = []; const afterGlobal = []
globalValues.forEach(v => {
v.digits = '*'
if (v.priority === '1') {
firstGlobal.push(v)
} else {
afterGlobal.push(v)
}
})
const concatValues = firstGlobal.concat(designValues).concat(afterGlobal)
const subValues = concatValues.map(i => pick(i, 'digits', 'pattern', 'message'))
// 生成 formData,用于传入后台
const ruleJson = JSON.stringify(subValues)
const formData = Object.assign(this.model, mainValues, { ruleJson })
// 判断请求方式和请求地址,并发送请求
const method = 'post'
let httpUrl = this.url.add
if (this.model.id) {
// method = 'put'
httpUrl = this.url.edit
}
this.confirmLoading = true
return httpAction(httpUrl, formData, method)
}
}).then((res) => {
if (res.success) {
this.$message.success(res.message)
this.$emit('ok')
this.close()
} else {
this.$message.warning(res.message)
}
}).catch(e => {
console.error(e)
}).finally(() => {
this.confirmLoading = false
})
},
handleCancel () {
this.close()
}
}
}
</script>
<style lang="less" scoped></style>
@@ -0,0 +1,59 @@
<template>
<j-modal
title="功能测试"
:width="800"
:visible="visible"
switchFullscreen
@ok="visible=false"
@cancel="visible=false"
>
<a-form :form="form">
<a-form-item label="功能测试">
<a-input placeholder="请输入" v-decorator="['test', validatorRules.test]" @change="e=>this.testValue=e.target.value"/>
</a-form-item>
</a-form>
<a-row type="flex" :gutter="8">
<a-col v-for="(str,index) of testValue" :key="index">
<a-row>
<a-col>
<a-input :value="str" style="text-align: center;width: 40px;"/>
</a-col>
<a-col style="text-align: center;">{{index+1}}</a-col>
</a-row>
</a-col>
</a-row>
</j-modal>
</template>
<script>
import { validateCheckRule } from '@/utils/util'
export default {
name: 'SysCheckRuleTestModal',
data () {
return {
title: '操作',
visible: false,
ruleCode: '',
testValue: '',
form: this.$form.createForm(this),
validatorRules: {
test: {
rules: [{ validator: (rule, value, callback) => validateCheckRule(this.ruleCode, value, callback) }]
}
}
}
},
methods: {
open (ruleCode) {
this.ruleCode = ruleCode
this.form.resetFields()
this.testValue = ''
this.visible = true
}
}
}
</script>
<style lang="less" scoped></style>
@@ -0,0 +1,283 @@
<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="请输入数据源编码" :disabled="!!model.id" v-decorator="['code', validatorRules.code]"/>
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="数据源名称">
<a-input placeholder="请输入数据源名称" v-decorator="['name', validatorRules.name]"/>
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="数据库类型">
<j-dict-select-tag placeholder="请选择数据库类型" dict-code="database_type" triggerChange v-decorator="['dbType', validatorRules.dbType]" @change="handleDbTypeChange"/>
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="驱动类">
<a-input placeholder="请输入驱动类" v-decorator="['dbDriver', validatorRules.dbDriver]"/>
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="数据源地址">
<a-input placeholder="请输入数据源地址" v-decorator="['dbUrl', validatorRules.dbUrl]"/>
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="用户名">
<a-input placeholder="请输入用户名" v-decorator="['dbUsername', validatorRules.dbUsername]"/>
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="密码">
<a-row :gutter="8">
<a-col :span="21">
<a-input-password placeholder="请输入密码" v-decorator="['dbPassword', validatorRules.dbPassword]"/>
</a-col>
<a-col :span="3">
<a-button type="primary" size="small" style="width: 100%" @click="handleTest">测试</a-button>
</a-col>
</a-row>
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="备注">
<a-textarea placeholder="请输入备注" v-decorator="['remark', {}]"/>
</a-form-item>
</a-form>
</a-spin>
</j-modal>
</template>
<script>
import pick from 'lodash.pick'
import { httpAction, postAction } from '@/api/manage'
import { validateDuplicateValue } from '@/utils/util'
export default {
name: 'SysDataSourceModal',
components: {},
data () {
return {
title: '操作',
visible: false,
model: {},
labelCol: {
xs: { span: 24 },
sm: { span: 5 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 }
},
confirmLoading: false,
form: this.$form.createForm(this),
validatorRules: {
code: {
validateFirst: true,
rules: [
{ required: true, message: '请输入数据源编码!' },
{
validator: (rule, value, callback) => {
const pattern = /^[a-z|A-Z][a-z|A-Z\d_-]{0,}$/
if (!pattern.test(value)) {
callback(new Error('编码必须以字母开头,可包含数字、下划线、横杠'))
} else {
validateDuplicateValue(false, 'sys_data_source', 'code', value, this.model.id, callback)
}
}
}
]
},
name: { rules: [{ required: true, message: '请输入数据源名称!' }] },
dbType: { rules: [{ required: true, message: '请选择数据库类型!' }] },
dbDriver: { rules: [{ required: true, message: '请输入驱动类!' }] },
dbUrl: { rules: [{ required: true, message: '请输入数据源地址!' }] },
dbName: { rules: [{ required: true, message: '请输入数据库名称!' }] },
dbUsername: { rules: [{ required: true, message: '请输入用户名!' }] },
dbPassword: { rules: [{ required: false, message: '请输入密码!' }] }
},
url: {
add: '/sys/dataSource/add',
edit: '/sys/dataSource/edit'
},
dbDriverMap: {
// MySQL 数据库
1: { dbDriver: 'com.mysql.jdbc.Driver' },
// MySQL5.7+ 数据库
4: { dbDriver: 'com.mysql.cj.jdbc.Driver' },
// Oracle
2: { dbDriver: 'oracle.jdbc.OracleDriver' },
// SQLServer 数据库
3: { dbDriver: 'com.microsoft.sqlserver.jdbc.SQLServerDriver' },
// marialDB 数据库
5: { dbDriver: 'org.mariadb.jdbc.Driver' },
// postgresql 数据库
6: { dbDriver: 'org.postgresql.Driver' },
// 达梦 数据库
7: { dbDriver: 'dm.jdbc.driver.DmDriver' },
// 人大金仓 数据库
8: { dbDriver: 'com.kingbase8.Driver' },
// 神通 数据库
9: { dbDriver: 'com.oscar.Driver' },
// SQLite 数据库
10: { dbDriver: 'org.sqlite.JDBC' },
// DB2 数据库
11: { dbDriver: 'com.ibm.db2.jcc.DB2Driver' },
// Hsqldb 数据库
12: { dbDriver: 'org.hsqldb.jdbc.JDBCDriver' },
// Derby 数据库
13: { dbDriver: 'org.apache.derby.jdbc.ClientDriver' },
// H2 数据库
14: { dbDriver: 'org.h2.Driver' },
// 其他数据库
15: { dbDriver: '' }
},
dbUrlMap: {
// MySQL 数据库
1: { dbUrl: 'jdbc:mysql://127.0.0.1:3306/jeecg-boot?characterEncoding=UTF-8&useUnicode=true&useSSL=false' },
// MySQL5.7+ 数据库
4: { dbUrl: 'jdbc:mysql://127.0.0.1:3306/jeecg-boot?characterEncoding=UTF-8&useUnicode=true&useSSL=false&tinyInt1isBit=false&allowPublicKeyRetrieval=true&serverTimezone=Asia/Shanghai' },
// Oracle
2: { dbUrl: 'jdbc:oracle:thin:@127.0.0.1:1521:ORCL' },
// SQLServer 数据库
3: { dbUrl: 'jdbc:sqlserver://127.0.0.1:1433;SelectMethod=cursor;DatabaseName=jeecgboot' },
// Mariadb 数据库
5: { dbUrl: 'jdbc:mariadb://127.0.0.1:3306/jeecg-boot?characterEncoding=UTF-8&useSSL=false' },
// Postgresql 数据库
6: { dbUrl: 'jdbc:postgresql://127.0.0.1:5432/jeecg-boot' },
// 达梦 数据库
7: { dbUrl: 'jdbc:dm://127.0.0.1:5236/?jeecg-boot&zeroDateTimeBehavior=convertToNull&useUnicode=true&characterEncoding=utf-8' },
// 人大金仓 数据库
8: { dbUrl: 'jdbc:kingbase8://127.0.0.1:54321/jeecg-boot' },
// 神通 数据库
9: { dbUrl: 'jdbc:oscar://192.168.1.125:2003/jeecg-boot' },
// SQLite 数据库
10: { dbUrl: 'jdbc:sqlite://opt/test.db' },
// DB2 数据库
11: { dbUrl: 'jdbc:db2://127.0.0.1:50000/jeecg-boot' },
// Hsqldb 数据库
12: { dbUrl: 'jdbc:hsqldb:hsql://127.0.0.1/jeecg-boot' },
// Derby 数据库
13: { dbUrl: 'jdbc:derby://127.0.0.1:1527/jeecg-boot' },
// H2 数据库
14: { dbUrl: 'jdbc:h2:tcp://127.0.0.1:8082/jeecg-boot' },
// 其他数据库
15: { dbUrl: '' }
}
}
},
created () {
},
methods: {
add () {
this.edit({})
},
edit (record) {
this.form.resetFields()
this.model = Object.assign({}, record)
this.visible = true
this.$nextTick(() => {
this.form.setFieldsValue(pick(this.model, 'code', 'name', 'remark', 'dbType', 'dbDriver', 'dbUrl', 'dbName', 'dbUsername', 'dbPassword'))
})
},
close () {
this.$emit('close')
this.visible = false
},
handleOk () {
// 触发表单验证
this.form.validateFields((err, values) => {
if (!err) {
this.confirmLoading = true
const formData = Object.assign(this.model, values)
let httpUrl = this.url.add
const method = 'post'
if (this.model.id) {
httpUrl = this.url.edit
// method = 'put'
// 由于编码的特殊性,所以不能更改
formData.code = undefined
}
httpAction(httpUrl, 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
})
}
})
},
handleCancel () {
this.close()
},
// 测试数据源配置是否可以正常连接
handleTest () {
const keys = ['dbType', 'dbDriver', 'dbUrl', 'dbName', 'dbUsername', 'dbPassword']
// 获取以上字段的值,并清除校验状态
const fieldsValues = this.form.getFieldsValue(keys)
const setFields = {}
keys.forEach(key => (setFields[key] = { value: fieldsValues[key], errors: null }))
// 清除校验状态,目的是可以让错误文字闪烁
this.form.setFields(setFields)
// 重新校验
this.$nextTick(() => {
this.form.validateFields(keys, (errors/* , values */) => {
if (!errors) {
const loading = this.$message.loading('连接中……', 0)
postAction('/online/cgreport/api/testConnection', fieldsValues).then(res => {
if (res.success) {
this.$message.success('连接成功')
} else throw new Error(res.message)
}).catch(error => {
this.$warning({ title: '连接失败', content: error.message || error })
}).finally(() => loading())
}
})
})
},
// 数据库类型更改时,联动更改数据库驱动
handleDbTypeChange (val) {
const dbDriver = this.dbDriverMap[val]
const dbUrl = this.dbUrlMap[val]
if (dbDriver) {
this.form.setFieldsValue(dbDriver)
}
if (dbUrl) {
this.form.setFieldsValue(dbUrl)
}
}
}
}
</script>
<style lang="less" scoped></style>
@@ -0,0 +1,157 @@
<!--<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>-->
@@ -0,0 +1,143 @@
<template>
<j-modal
:title="title"
:width="800"
:visible="visible"
:maskClosable="false"
switchFullscreen
: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" label="规则名称" prop="ruleName">
<a-input placeholder="请输入规则名称" v-model="model.ruleName"/>
</a-form-model-item>
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="规则Code" prop="ruleCode" >
<a-input placeholder="请输入规则Code" :disabled="disabledCode" v-model="model.ruleCode"/>
</a-form-model-item>
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="规则实现类" prop="ruleClass" >
<a-input placeholder="请输入规则实现类" v-model="model.ruleClass"/>
</a-form-model-item>
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="规则参数" prop="ruleParams">
<a-textarea placeholder="请输入规则参数" :rows="5" v-model="model.ruleParams"/>
</a-form-model-item>
</a-form-model>
</a-spin>
</j-modal>
</template>
<script>
import { httpAction } from '@/api/manage'
import { validateDuplicateValue } from '@/utils/util'
export default {
name: 'SysFillRuleModal',
components: {},
data () {
return {
title: '操作',
visible: false,
model: {},
labelCol: { xs: { span: 24 }, sm: { span: 5 } },
wrapperCol: { xs: { span: 24 }, sm: { span: 16 } },
confirmLoading: false,
validatorRules: {
ruleName: [{ required: true, message: '规则名称不能为空' }],
ruleCode: [
{ required: true, message: '规则Code不能为空' },
{ validator: (rule, value, callback) => validateDuplicateValue(false, 'sys_fill_rule', 'rule_code', value, this.model.id, callback) }
],
ruleClass: [{ required: true, message: '规则实现类不能为空' }],
ruleParams: [{
validator: (rule, value, callback) => {
let info = ''
try {
const json = JSON.parse(value)
if (json instanceof Array) {
info = '只能传递JSON对象,不能传递JSON数组'
callback(info)
} else if (json instanceof Object) {
callback()
} else {
info = '请输入JSON字符串'
callback(info)
}
} catch (err) {
info = '请输入JSON字符串'
callback(info)
}
}
}]
},
url: {
add: '/sys/fillRule/add',
edit: '/sys/fillRule/edit'
}
}
},
computed: {
disabledCode () {
return !!this.model.id
}
},
created () {
},
methods: {
add () {
this.edit({})
},
edit (record) {
this.visible = true
this.$nextTick(() => {
this.$refs.form.resetFields()
this.model = Object.assign({}, record)
})
},
close () {
this.$emit('close')
this.visible = false
},
handleOk () {
const that = this
// 触发表单验证
this.$refs.form.validate((ok) => {
if (ok) {
that.confirmLoading = true
let httpUrl = this.url.add
const method = 'post'
if (this.model.id) {
httpUrl = this.url.edit
// method = 'put'
}
httpAction(httpUrl, this.model, method).then((res) => {
if (res.success) {
that.$message.success(res.message)
that.$emit('ok')
that.close()
} else {
that.$message.warning(res.message)
}
}).finally(() => {
that.confirmLoading = false
})
}
})
},
handleCancel () {
this.close()
}
}
}
</script>
<style lang="less" scoped>
</style>
@@ -0,0 +1,172 @@
<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>
@@ -0,0 +1,178 @@
<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>
@@ -0,0 +1,97 @@
<template>
<j-modal
:title="$t('user.uploadHandStamp')"
:width="width"
:visible="visible"
:maskClosable="false"
:confirmLoading="confirmLoading"
@ok="handleOk"
@cancel="handleCancel">
<a-spin :spinning="confirmLoading">
<a-form :form="form">
<!--手写章-->
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="$t('user.handStamp')">
<j-image-upload class="avatar-uploader"
:text="$t('upload')"
v-decorator="['avatar', validatorRules.avatar]"
:number=1
accept='.png,.PNG,.jpg,.JPG'></j-image-upload>
</a-form-item>
</a-form>
</a-spin>
</j-modal>
</template>
<script>
import { uploadHandStamp } from '../../../api/api'
export default {
name: 'UploadHandStampModal',
data () {
return {
title: this.$t('operation'),
width: 400,
visible: false,
confirmLoading: false,
model: {},
form: this.$form.createForm(this),
labelCol: {
xs: { span: 24 },
sm: { span: 6 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 18 }
},
validatorRules: {
// 手写章
avatar: {
rules: [{ required: true, message: this.$t('uploadFile.pleaseUpload') + this.$t('user.handStamp') }],
validateTrigger: 'change'
}
}
}
},
methods: {
edit (record) {
this.visible = true
this.model = Object.assign({}, record)
this.$nextTick(() => {
this.form.setFieldsValue(this.model)
})
},
handleOk () {
this.form.validateFields((errors, values) => {
if (!errors) {
const formData = Object.assign({ id: this.model.id }, values)
this.confirmLoading = true
uploadHandStamp(formData).then(res => {
if (res.success) {
this.$message.success(res.message)
this.close()
that.$emit('ok')
} else {
this.$message.warning(res.message)
}
}).finally(() => {
this.confirmLoading = false
})
}
})
},
handleCancel () {
this.close()
},
close () {
this.visible = false
this.model = {}
this.form.resetFields()
}
}
}
</script>
<style scoped lang="less">
</style>
+558
View File
@@ -0,0 +1,558 @@
<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" />
</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" />
</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" />
</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.handStamp')" :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" />
</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) {
this.initRoleList()
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>
@@ -0,0 +1,207 @@
<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>
+192
View File
@@ -0,0 +1,192 @@
<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>
+35
View File
@@ -0,0 +1,35 @@
@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;
}
}
+133
View File
@@ -0,0 +1,133 @@
<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>
+39
View File
@@ -0,0 +1,39 @@
<!--标签管理-->
<template>
<div class="tags">
<a-card :bordered="false">
<div class="tag-tab">
<a-tabs type="card" @change="callback">
<a-tab-pane key="1" :tab="$t('system.tag.tagItemManagement')">
<tag-item></tag-item>
</a-tab-pane>
<a-tab-pane key="2" :tab="$t('system.tag.labelContentManagement')">
<tag-content></tag-content>
</a-tab-pane>
</a-tabs>
</div>
</a-card>
</div>
</template>
<script>
import TagItem from './pages/TagItem'
import TagContent from './pages/TagContent'
export default {
name: 'TagList',
components: {
TagItem,
TagContent
},
methods: {
callback () {
}
}
}
</script>
<style lang="less" scoped>
@import '~@assets/less/common.less';
</style>
@@ -0,0 +1,166 @@
<!--展示区域新增数据-->
<template>
<j-modal
:title="title"
:width="width"
:visible="visible"
switchFullscreen
:maskClosable="false"
:confirmLoading="confirmLoading"
:ok-text="$t('preservation')"
:cancel-text="$t('cancel')"
@ok="handleOk"
@cancel="handleCancel">
<a-form-model ref="form" :model="model" :rules="validatorRules" :label-col="labelCol" :wrapper-col="wrapperCol">
<!--所属模块-->
<a-form-model-item :label="$t('system.tag.module')" prop="isModel">
<a-select :placeholder="$t('pleaseSelect') + $t('system.tag.module')" disabled v-model="model.isModel">
<a-select-option v-for="item in moduleArr" :key="item.value" :value="item.value">
{{ translate(item.langKey) }}
</a-select-option>
</a-select>
</a-form-model-item>
<!--展示区域-->
<a-form-model-item :label="$t('system.tag.showArea')" prop="showArea">
<a-input
v-model="model.showArea"
:placeholder="$t('pleaseEnter') + $t('system.tag.showArea')"
:maxLength="50"
></a-input>
</a-form-model-item>
<!-- 英文名称-->
<a-form-model-item :label="$t('system.tag.attributeNameEnglish')" prop="enName">
<a-input
v-model="model.enName"
:placeholder="$t('pleaseEnter') + $t('system.tag.attributeNameEnglish')"
:maxLength="50"
></a-input>
</a-form-model-item>
<!--排序值-->
<a-form-model-item :label="$t('dict.rankingValue')" prop="sort">
<a-input-number :min="1" :max="99999" v-model="model.sort" />
{{ $t('dict.valueSmallerIsHigher')}}
</a-form-model-item>
<!--<a-form-model-item :label="$t('system.tag.displayOrder')" prop="orderNum">-->
<!-- <a-input-number v-model="model.orderNum"-->
<!-- :placeholder="$t('pleaseEnter') + $t('system.tag.displayOrder')" style="width: 100%"-->
<!-- :min="1" :max="99999" :formatter="limitNumber" :parser="limitNumber" />-->
<!--</a-form-model-item>-->
</a-form-model>
</j-modal>
</template>
<script>
import { TagsTypeEnums } from '../../../../enums/commonEnums'
import { addAreaData, editAreaData } from '../../../../api/api'
export default {
name: 'AreaFormModal',
props: {
type: {
required: false,
type: Number,
// 默认显示国内法规的
default: TagsTypeEnums.DOMESTIC_LIST.value
}
},
data () {
return {
title: '新增',
width: 800,
visible: false,
confirmLoading: false,
model: {},
labelCol: {
xs: { span: 24 },
sm: { span: 4 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 20 }
},
validatorRules: {
// 所属模块
isModel: [
{ required: true, message: this.$t('pleaseSelect') + this.$t('system.tag.module'), trigger: 'change' }
],
// 英文名称
enName: [
{
required: true,
message: this.$t('pleaseEnter') + this.$t('system.tag.attributeNameEnglish'),
trigger: 'change'
},
{ max: 50, message: this.$t('cantExeed') + '50' + this.$t('characters'), trigger: 'blur' },
{ validator: this.test }
],
// 展示区域
showArea: [
{ required: true, message: this.$t('pleaseEnter') + this.$t('system.tag.showArea'), trigger: 'blur' },
{ min: 1, max: 50, message: this.$t('charactersLength'), trigger: 'blur' }
],
sort: [
{ required: false, message: this.$t('enterSortingNumber'), trigger: 'change' }
]
},
moduleArr: TagsTypeEnums.getItemList()
}
},
methods: {
add () {
// 初始化默认值
this.edit({
isModel: this.type,
sort: 1
})
},
edit (record) {
this.model = Object.assign({}, record)
// 所属模块-转化成NUMBER 方便回显
this.model.isModel = Number(this.model.isModel)
this.visible = true
},
translate (key) {
return this.$t(key)
},
handleOk () {
this.$refs.form.validate(valid => {
if (valid) {
this.confirmLoading = true
const formData = Object.assign({}, this.model)
let Func = addAreaData
if (this.model.id) {
Func = editAreaData
}
Func(formData).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.$emit('close')
this.visible = false
this.$refs.form && this.$refs.form.resetFields()
}
}
}
</script>
<style scoped>
</style>
+236
View File
@@ -0,0 +1,236 @@
<!-- 展示区域新增编辑模态框-->
<template>
<j-modal
:title="title"
:width="width"
:visible="visible"
switchFullscreen
:maskClosable="false"
:confirmLoading="confirmLoading"
:ok-text="$t('preservation')"
:cancel-text="$t('cancel')"
:footer="null"
@ok="handleOk"
@cancel="handleCancel">
<a-spin :spinning="confirmLoading">
<div class="table-operator">
<!--新增-->
<a-button icon="plus" type="primary" @click="handleAdd" v-has="'area:add'">{{ $t('add') }}</a-button>
<!--批量删除-->
<a-button type="primary" icon="delete" ghost @click="batchDel" v-has="'area:delete'">{{ $t('batchDelete') }}</a-button>
</div>
<j-table
ref="table"
bordered
can-drag
size="middle"
rowKey="id"
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
:loading="loading"
:scroll="{x: '100%', y: yScrollHeight}"
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
:operation-list="operationList"
@change="handleTableChange"
@operationClick="operationClick"
>
</j-table>
</a-spin>
<!--新增表单-->
<area-form-modal v-bind="$props" ref="modalForm" @ok="modalFormOk"></area-form-modal>
</j-modal>
</template>
<script>
import '@assets/less/common.less'
import AreaFormModal from './AreaFormModal'
import { TagsTypeEnums } from '../../../../enums/commonEnums'
import { SimpleListMixin } from '../../../../mixins/SimpleListMixin'
import { postAction } from '../../../../api/manage'
import JTable from '../../../../components/jero/JTable'
export default {
name: 'AreaModal',
mixins: [SimpleListMixin],
props: {
type: {
required: false,
type: Number,
// 默认显示国内法规的
default: TagsTypeEnums.DOMESTIC_LIST.value
}
},
components: {
AreaFormModal,
JTable
},
data () {
return {
title: this.$t('system.tag.exhibitionAreaManagement'),
width: 800,
visible: false,
confirmLoading: false,
url: {
list: 'tag/LawsArea/page',
delete: 'tag/LawsArea/delete',
deleteBatch: 'tag/LawsArea/deleteBatch'
},
// 其他查询参数
filters: {
isModel: this.type
},
columns: [
{
title: this.$t('system.tag.showArea'),
dataIndex: 'showArea',
key: 'showArea',
align: 'left',
width: 100,
ellipsis: true
},
{
title: this.$t('system.tag.attributeNameEnglish'),
align: 'left',
width: 100,
dataIndex: 'enName',
ellipsis: true
},
// {
// title: this.$t('system.tag.module'),
// align: 'left',
// width: 100,
// dataIndex: 'isModelName',
// ellipsis: true
// },
{
title: this.$t('dict.rankingValue'),
align: 'left',
width: 40,
dataIndex: 'sort'
},
{
title: this.$t('operation'),
scopedSlots: { customRender: 'action' },
align: 'left',
width: 60
}
],
/* 排序参数--按照排序字段失序 */
isorter: {
column: 'sort',
order: 'ascend'
},
operationList: [
// 编辑
{
text: this.$t('edit'),
clickEvent: 'handleEdit',
has: 'area:edit'
},
// 删除
{
text: this.$t('delete'),
clickEvent: 'handleDelete',
has: 'area:delete'
}
],
disableMixinCreated: true // 默认不加载数据
}
},
methods: {
show () {
this.visible = true
this.loadData(1)
},
handleOk () {},
// 关闭
handleCancel () {
this.close()
},
close () {
this.$emit('close')
this.visible = false
this.$refs.form && this.$refs.form.resetFields()
},
showModal () {
this.title = this.$t('add')
this.newVisible = true
},
// 新增编辑回调函数
modalFormOk () {
this.$emit('refresh')
this.loadData()
// 清空列表选中
this.onClearSelected()
},
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.$emit('refresh')
that.loadData()
} else {
that.$message.warning(res.message)
}
})
}
})
},
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()
// 增加列表页的操作
that.$emit('refresh')
} else {
that.$message.warning(res.message)
}
}).finally(() => {
that.loading = false
})
}
})
}
}
}
</script>
<style scoped>
</style>
@@ -0,0 +1,461 @@
<!--条款拆分的抽屉-->
<template>
<a-drawer
:title="title"
:width="width"
placement="right"
:closable="true"
@close="onClose"
:visible="visible"
:maskClosable="false"
class="custom-drawer-style">
<div class="custom-drawer-style-scroll">
<a-spin :spinning="confirmLoading">
<a-form-model
:model="form"
:rules="validatorRules"
ref="editForm"
:label-col="labelCol"
:wrapper-col="wrapperCol"
>
<!--基本信息-->
<p class="tag-info">{{ $t('system.tag.essentialInformation') }}</p>
<a-divider dashed />
<!--所属模块-->
<a-form-model-item :label="$t('system.tag.module')" prop="isModel">
<a-select :placeholder="$t('pleaseSelect') + $t('system.tag.module')"
disabled
v-model="form.isModel"
show-search
:filter-option="filterOption">
<a-select-option v-for="item in moduleArr" :key="item.value" :value="item.value">
{{ translate(item.langKey) }}
</a-select-option>
</a-select>
</a-form-model-item>
<!-- 属性名称-->
<a-form-model-item :label="$t('system.tag.attributeName')" prop="dbFieldTxt">
<a-input
v-model="form.dbFieldTxt" :placeholder="$t('pleaseEnter') + $t('system.tag.attributeName')"
:maxLength="50"
></a-input>
</a-form-model-item>
<!-- 英文名称-->
<a-form-model-item :label="$t('system.tag.attributeNameEnglish')" prop="dbFieldEnName">
<a-input
v-model="form.dbFieldEnName"
:placeholder="$t('pleaseEnter') + $t('system.tag.attributeNameEnglish')"
:maxLength="50"
></a-input>
</a-form-model-item>
<!-- 字段名称 正式环境 需要注释掉开发环境可以先留着方便使用-->
<a-col :span="24" v-if="canOpeFlag">
<a-form-model-item :label="$t('system.tag.fieldName')" prop="dbFieldName">
<a-input
v-model="form.dbFieldName"
:placeholder="$t('pleaseEnter') + $t('system.tag.fieldName')"
:maxLength="120"
></a-input>
</a-form-model-item>
</a-col>
<!-- 属性类型-->
<a-form-model-item :label="$t('system.tag.attributeType')" prop="fieldShowType">
<j-dict-select-tag type="list" v-model="form.fieldShowType" dictCode="field_show_type"
:placeholder="$t('pleaseSelect') + $t('system.tag.attributeType')"
@change="fieldShowTypeChange"
:disabled="disabledEdit" />
</a-form-model-item>
<!--选项内容-->
<a-form-model-item v-if="isTagContent" :label="$t('system.tag.optionContent')" prop="dictId" key="dictId">
<template>
<a-select
:placeholder="$t('pleaseSelect') + $t('system.tag.optionContent')"
v-model="form.dictId"
show-search
:filter-option="filterOption"
@change="optionContentChange"
>
<a-select-option v-for="item in contentOption" :key="item.id" :value="item.id">
{{ item.dictName }}
</a-select-option>
</a-select>
</template>
</a-form-model-item>
<!--字段长度 key 值必须加解决验证错位的问题-->
<a-form-model-item v-if="isLength" :label="$t('system.tag.fieldLength')" prop="dbLength" key="dbLength">
<a-input-number v-model="form.dbLength" :min="1" :max="9999"
:placeholder="$t('pleaseEnter') + $t('system.tag.fieldLength')"
style="width: 100%" :formatter="limitNumber" :parser="limitNumber" />
</a-form-model-item>
<!--展示顺序-->
<a-form-model-item :label="$t('system.tag.displayOrder')" prop="orderNum">
<a-input-number v-model="form.orderNum"
:placeholder="$t('pleaseEnter') + $t('system.tag.displayOrder')" style="width: 100%"
:min="1" :max="99999" :formatter="limitNumber" :parser="limitNumber" />
</a-form-model-item>
<!--是否必填-->
<a-form-model-item :label="$t('system.tag.required')" prop="fieldMustInput">
<j-dict-select-tag type="list" v-model="form.fieldMustInput" dictCode="yn"
:placeholder="$t('pleaseSelect') + $t('system.tag.required')" />
</a-form-model-item>
<!--使用范围-->
<a-form-model-item :label="$t('system.tag.usableRange')" prop="usableRange">
<j-multi-select-tag v-model="form.usableRange"
dict-code="clause_usable_range"
:placeholder="$t('pleaseSelect') + $t('system.tag.usableRange')" />
</a-form-model-item>
<!-- 文档拆分列表展示-->
<template>
<p class="tag-info">{{ $t('system.tag.documentSplitDisplay') }}</p>
<a-divider dashed />
<a-form-model-item :label="$t('system.tag.documentSplitList')" prop="isShowList">
<j-dict-select-tag type="list" v-model="form.isShowList" dictCode="yn"
:placeholder="$t('system.tag.selectSplitListDisplay')" />
</a-form-model-item>
<!--详情页展示-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.isShowDetail')" prop="isShowForm">
<j-dict-select-tag type="list" v-model="form.isShowForm" dictCode="yn"
:placeholder="$t('system.tag.isShowDetailMessage')" />
</a-form-model-item>
</a-col>
<!--新增是否展示-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.isShowAddForm')" prop="isShowFormCreate">
<j-dict-select-tag type="list" v-model="form.isShowFormCreate" dictCode="yn"
:placeholder="$t('system.tag.isShowAddFormMessage')" />
</a-form-model-item>
</a-col>
<!--是否搜索-->
<a-col :span="24" v-if="isSearch">
<a-form-model-item :label="$t('system.tag.search')" prop="isQuery" key="isQuery">
<j-dict-select-tag type="list" v-model="form.isQuery" dictCode="yn"
:placeholder="$t('pleaseSelect') + $t('system.tag.search')" />
</a-form-model-item>
</a-col>
<!--是否排序-->
<a-col :span="24" v-if="isSearch">
<a-form-model-item :label="$t('system.tag.isSort')" prop="sortFlag" key="sortFlag">
<j-dict-select-tag type="list" v-model="form.sortFlag" dictCode="yn"
:placeholder="$t('pleaseSelect') + $t('system.tag.isSort')" />
</a-form-model-item>
</a-col>
</template>
</a-form-model>
</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 JDictSelectTag from '../../../../components/dict/JDictSelectTag'
import { FieldType, StandardSource, TagsAttributeTypeEnums, TagsTypeEnums } from '../../../../enums/commonEnums'
import { addTag, ajaxGetDictItems, editTag, queryDictName } from '../../../../api/api'
export default {
name: 'ClauseSplittingDrawer',
components: {
JDictSelectTag
},
props: {
type: {
required: false,
type: Number
}
},
data () {
return {
canOpeFlag: process.env.VUE_APP_TAG_FLAG === '0', // 是否存在字段名称,开发环境存在
visible: false,
title: '',
width: 800,
// 存储表单的数据
form: {},
isEdit: false,
confirmLoading: false,
labelCol: {
xs: { span: 24 },
sm: { span: 6 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 }
},
validatorRules: {
// 所属模块
isModel: [
{ required: true, message: this.$t('pleaseSelect') + this.$t('system.tag.module'), trigger: 'change' }
],
// 属性名称
dbFieldTxt: [
{ required: true, message: this.$t('pleaseEnter') + this.$t('system.tag.attributeName'), trigger: 'blur' },
{ min: 1, max: 20, message: this.$t('cantExeed') + '20' + this.$t('characters'), trigger: 'blur' },
{ validator: this.test }
],
// 字段名称
dbFieldName: [
{ required: false, message: this.$t('system.tag.pleaseEnterYourEnglishName'), trigger: 'blur' },
// { min: 1, max: 20, message: this.$t('cantExeed') + '20' + this.$t('characters'), trigger: 'blur' },
{ validator: this.test }
],
// 英文名称
dbFieldEnName: [
{
required: true,
message: this.$t('pleaseEnter') + this.$t('system.tag.attributeNameEnglish'),
trigger: 'change'
},
{ max: 50, message: this.$t('cantExeed') + '50' + this.$t('characters'), trigger: 'blur' },
{ validator: this.test }
],
// 属性类型
fieldShowType: [
{ required: true, message: this.$t('pleaseSelect') + this.$t('system.tag.attributeType'), trigger: 'change' }
],
// 选项内容
dictId: [
{ required: true, message: this.$t('pleaseSelect') + this.$t('system.tag.optionContent'), trigger: 'change' }
],
// 字段长度
dbLength: [
{ required: true, message: this.$t('pleaseEnter') + this.$t('system.tag.fieldLength'), trigger: 'blur' }
],
// 展示顺序
orderNum: [
{ required: true, message: this.$t('pleaseEnter') + this.$t('system.tag.displayOrder'), trigger: 'blur' }
],
// 是否必填
fieldMustInput: [
{ required: true, message: this.$t('pleaseSelect') + this.$t('system.tag.required'), trigger: 'change' }
],
// 使用范围
usableRange: [
{ required: true, message: this.$t('pleaseSelect') + this.$t('system.tag.usableRange'), trigger: 'change' }
],
// 文档拆分列表展示
isShowList: [
{ required: true, message: this.$t('system.tag.selectSplitListDisplay'), trigger: 'change' }
],
// 是否搜索
isQuery: [
{ required: true, message: this.$t('pleaseSelect') + this.$t('system.tag.search'), trigger: 'change' }
]
},
isTagContent: false,
isSearch: true,
isLength: true,
disabledEdit: false,
// 展示区域选项内容
areaOptions: [],
// 选项内容选项
contentOption: [],
contentOptionSelect: [],
contentOptionTree: [],
moduleArr: TagsTypeEnums.getItemList(),
usableRangeOptions: []
}
},
watch: {
'form.fieldShowType' (val) {
this.initFlags(val)
}
},
methods: {
translate (key) {
return this.$t(key)
},
add () {
this.edit({
isModel: this.type,
fieldMustInput: 1,
isShowList: 1,
isQuery: 1
})
},
edit (record) {
this.$refs.editForm && this.$refs.editForm.resetFields()
this.form = Object.assign({}, record)
this.form.isModel = 4
this.isEdit = !!this.form.id
this.initData()
this.visible = true
},
// 初始化一些数据
initData () {
this.loadContent()
this.getUsableRangeOptions()
},
getUsableRangeOptions () {
ajaxGetDictItems('standard_source').then(res => {
if (res.success) {
this.usableRangeOptions = (res.result || []).filter(tt => tt.value !== StandardSource.OVERSEAS.value)
}
})
},
showDrawer () {
this.visible = true
},
onClose () {
this.visible = false
},
fieldShowTypeChange (e) {
this.form.dictId = undefined
// 很重要,必须要复制一下,否则不能重新赋值成功
this.form = { ...this.form }
this.$forceUpdate()
},
optionContentChange (e) {
this.form.dictId = e
// 很重要,必须要复制一下,否则不能重新赋值成功
this.form = { ...this.form }
this.$forceUpdate()
},
handleOk () {
this.$refs.editForm.validate((valid) => {
console.log('---err-----', valid)
if (valid) {
this.confirmLoading = true
const formData = Object.assign({}, this.form)
// 多行文字 默认500的长度
if (formData.fieldShowType === FieldType.TEXTAREA.value) {
formData.dbLength = formData.dbLength || 500
}
let Func = addTag
if (this.isEdit) {
Func = editTag
}
Func(formData).then(res => {
if (res.success) {
this.$message.success(res.message)
this.$emit('ok')
this.onClose()
} else {
this.$message.warning(res.message)
}
}).finally(() => {
this.confirmLoading = false
})
}
})
},
handleCancel () {
this.drawerVisible = false
this.onClose()
},
// 正则替换小数点
limitNumber (value) {
if (typeof value === 'string') {
return !isNaN(Number(value)) ? value.replace(/\./g, '') : 0
} else if (typeof value === 'number') {
return !isNaN(value) ? String(value).replace(/\./g, '') : 0
} else {
return 0
}
},
test (rule, value, callback) {
var money = /[,]|[]/g
if (money.test(value)) {
callback(new Error(this.$t('disableInput') + ','))
} else {
callback()
}
},
// 初始化所有判断的值
// 具体值对应关系可以去commonEnums.js中查看 FieldType
initFlags (val) {
val = val + ''
// this.contentFlag=val
// 树形结构
if (val === FieldType.TREE.value || val === FieldType.TREE_SINGLE.value || val === FieldType.TREE_MODAL_SELECT.value) {
this.contentOption = [...this.contentOptionTree]
this.isTagContent = true
} else if (val === FieldType.OPTION_SINGLE.value || val === FieldType.OPTION_MORE.value) {
// 下拉单选 下拉多选
this.contentOption = [...this.contentOptionSelect]
this.isTagContent = true
} else {
this.isTagContent = false
}
// 上传文件
if (val === FieldType.FILE_UP.value) {
this.isSearch = false
this.form.isQuery = 0
} else {
this.isSearch = true
}
// 输入框(字符串) 文本框
if (val === FieldType.TEXT_BOX.value || val === 'sel_user') {
this.isLength = true
} else {
this.isLength = false
// this.isLength = true
}
},
// 获取选项内容
loadContent () {
const params = {}
queryDictName(params).then((res) => {
if (res.success) {
const data = [...res.result]
this.contentOptionSelect = []
this.contentOptionTree = []
data.map(res => {
const num = Number(res.attributeType)
if (num === TagsAttributeTypeEnums.SELECT.value) {
this.contentOptionSelect.push(res)
} else if (num === TagsAttributeTypeEnums.TREE.value) {
this.contentOptionTree.push(res)
}
})
// 树形结构
if (this.form.fieldShowType === FieldType.TREE.value) {
this.contentOption = [...this.contentOptionTree]
this.isTagContent = true
} else if (this.form.fieldShowType === FieldType.OPTION_SINGLE.value || this.form.fieldShowType === FieldType.OPTION_MORE.value) {
// 下拉单选 下拉多选
this.contentOption = [...this.contentOptionSelect]
this.isTagContent = true
} else {
this.isTagContent = false
}
}
})
},
filterOption (input, option) {
const text = option.componentOptions.children[0].text || option.componentOptions.children[0].data.attrs.title
return text.toLowerCase().indexOf(input.toLowerCase()) >= 0
}
}
}
</script>
<style scoped lang="less">
.drawer-container {
.drawer-footer {
height: 32px;
display: flex;
justify-content: center;
.ant-btn {
margin-left: 30px;
margin-bottom: 30px;
float: right;
}
}
}
</style>
@@ -0,0 +1,90 @@
<template>
<j-modal
title="title"
:width="width"
:visible="visible"
switchFullscreen
:maskClosable="false"
:confirmLoading="confirmLoading"
:ok-text="$t('preservation')"
:cancel-text="$t('cancel')"
@ok="handleOk"
@cancel="handleCancel">
<a-form-model ref="form" :model="model" :rules="validatorRules" :label-col="labelCol" :wrapper-col="wrapperCol">
</a-form-model>
</j-modal>
</template>
<script>
export default {
name: 'ModalDemo',
data () {
return {
title: '新增',
width: 800,
visible: false,
confirmLoading: false,
model: {},
labelCol: {
xs: { span: 24 },
sm: { span: 4 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 20 }
},
validatorRules: {
}
}
},
methods: {
add () {
// 初始化默认值
this.edit({})
},
edit (record) {
if (record.id) {
this.dictId = record.dictId
}
this.status = record.status
this.visibleCheck = (record.status === 1)
this.model = Object.assign({}, record)
this.model.dictId = this.dictId
this.model.status = this.status
this.visible = true
},
handleOk () {
this.$refs.form.validate(valid => {
if (valid) {
// this.confirmLoading = true
// const formData = Object.assign(this.model, values)
// changePromoter(formData).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.$emit('close')
this.visible = false
this.$refs.form && this.$refs.form.resetFields()
}
}
}
</script>
<style scoped>
</style>
@@ -0,0 +1,525 @@
<!--国内法规新增字段-->
<template>
<a-drawer
:title="title"
:width="width"
placement="right"
:closable="true"
@close="onClose"
:visible="visible"
:maskClosable="false"
class="custom-drawer-style"
>
<div class="custom-drawer-style-scroll">
<a-spin :spinning="confirmLoading">
<a-form-model
:model="form"
:rules="validatorRules"
ref="editForm"
:label-col="labelCol"
:wrapper-col="wrapperCol"
>
<a-row>
<!--基本信息-->
<p class="tag-info">{{ $t('system.tag.essentialInformation') }}</p>
<a-divider dashed />
<!--所属模块-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.module')" prop="isModel">
<a-select :placeholder="$t('pleaseSelect') + $t('system.tag.module')" disabled v-model="form.isModel">
<a-select-option v-for="item in moduleArr" :key="item.value" :value="item.value">
{{ translate(item.langKey) }}
</a-select-option>
</a-select>
</a-form-model-item>
</a-col>
<!-- 属性名称-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.attributeName')" prop="dbFieldTxt">
<a-input
v-model="form.dbFieldTxt" :placeholder="$t('pleaseEnter') + $t('system.tag.attributeName')"
:maxLength="50"
></a-input>
</a-form-model-item>
</a-col>
<!-- 英文名称-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.attributeNameEnglish')" prop="dbFieldEnName">
<a-input
v-model="form.dbFieldEnName"
:placeholder="$t('pleaseEnter') + $t('system.tag.attributeNameEnglish')"
:maxLength="50"
></a-input>
</a-form-model-item>
</a-col>
<!-- 字段名称 正式环境 需要注释掉开发环境可以先留着方便使用-->
<a-col :span="24" v-if="canOpeFlag">
<a-form-model-item :label="$t('system.tag.fieldName')" prop="dbFieldName">
<a-input
v-model="form.dbFieldName"
:placeholder="$t('pleaseEnter') + $t('system.tag.fieldName')"
:maxLength="60"
></a-input>
</a-form-model-item>
</a-col>
<!-- 属性类型-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.attributeType')" prop="fieldShowType">
<j-dict-select-tag
type="list" v-model="form.fieldShowType"
dictCode="field_show_type"
:placeholder="$t('pleaseSelect') + $t('system.tag.attributeType')"
:disabled="disabledEdit"
show-search
@change="fieldShowTypeChange"
/>
<!-- @change="form.dictId = undefined"-->
</a-form-model-item>
</a-col>
<!--选项内容-->
<a-col :span="24" v-if="isTagContent">
<a-form-model-item :label="$t('system.tag.optionContent')" prop="dictId" key="dictId">
<template>
<a-select
:placeholder="$t('pleaseSelect') + $t('system.tag.optionContent')"
v-model="form.dictId"
@change="optionContentChange"
show-search
:filter-option="filterOption"
>
<!-- :filter-option="filterOption"-->
<a-select-option v-for="item in contentOption" :key="item.id" :value="item.id">
{{ item.dictName }}
</a-select-option>
</a-select>
</template>
</a-form-model-item>
</a-col>
<!--字段长度 key 值必须加解决验证错位的问题-->
<a-col :span="24" v-if="isLength">
<a-form-model-item :label="$t('system.tag.fieldLength')" prop="dbLength" key="dbLength">
<a-input-number v-model="form.dbLength" :min="1" :max="form.fieldShowType === FieldType.TEXT_BOX.value ? 50 : 9999"
:placeholder="$t('pleaseEnter') + $t('system.tag.fieldLength')"
style="width: 100%" :formatter="limitNumber" :parser="limitNumber" />
</a-form-model-item>
</a-col>
<!--展示顺序-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.displayOrder')" prop="orderNum">
<a-input-number v-model="form.orderNum"
:placeholder="$t('pleaseEnter') + $t('system.tag.displayOrder')" style="width: 100%"
:min="1" :max="99999" :formatter="limitNumber" :parser="limitNumber" />
</a-form-model-item>
</a-col>
<!--是否必填-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.required')" prop="fieldMustInput">
<j-dict-select-tag type="list" v-model="form.fieldMustInput" dictCode="yn"
:placeholder="$t('pleaseSelect') + $t('system.tag.required')" />
</a-form-model-item>
</a-col>
<template>
<!--对应标准模块展示-->
<p class="tag-info">{{ showText + $t('system.tag.documentLibraryModuleDisplay') }}</p>
<a-divider dashed />
<a-col :span="24">
<a-form-model-item :label="showText + $t('system.tag.documentLibraryListDisplay')" prop="isShowList">
<j-dict-select-tag type="list" v-model="form.isShowList" dictCode="yn"
:placeholder="$t('pleaseSelect') + $t('whether') + showText + $t('system.tag.documentLibraryListDisplay')" />
</a-form-model-item>
</a-col>
<!--详情页展示-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.isShowDetail')" prop="isShowForm">
<j-dict-select-tag type="list" v-model="form.isShowForm" dictCode="yn"
:placeholder="$t('system.tag.isShowDetailMessage')" />
</a-form-model-item>
</a-col>
<!--新增是否展示-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.isShowAddForm')" prop="isShowFormCreate">
<j-dict-select-tag type="list" v-model="form.isShowFormCreate" dictCode="yn"
:placeholder="$t('system.tag.isShowAddFormMessage')" />
</a-form-model-item>
</a-col>
<!--展示区域-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.showArea')" prop="showArea">
<a-select :placeholder="$t('pleaseSelect') + $t('system.tag.showArea')" v-model="form.showArea">
<a-select-option v-for="(item) in areaOptions" :key="item.id" :value="item.id">
{{ item.showArea }}
</a-select-option>
</a-select>
</a-form-model-item>
</a-col>
<!--是否搜索-->
<a-col :span="24" v-if="isSearch">
<a-form-model-item :label="$t('system.tag.search')" prop="isQuery" key="isQuery">
<j-dict-select-tag type="list" v-model="form.isQuery" dictCode="yn"
:placeholder="$t('pleaseSelect') + $t('system.tag.search')" />
</a-form-model-item>
</a-col>
<!--是否排序-->
<a-col :span="24" v-if="isSearch">
<a-form-model-item :label="$t('system.tag.isSort')" prop="sortFlag" key="sortFlag">
<j-dict-select-tag type="list" v-model="form.sortFlag" dictCode="yn"
:placeholder="$t('pleaseSelect') + $t('system.tag.isSort')" />
</a-form-model-item>
</a-col>
</template>
<!--其它模块展示-->
<template v-if="isSearch">
<p class="tag-info">{{ $t('system.tag.displayOtherModules') }}</p>
<a-divider dashed />
<!--搜索中心展示-->
<a-col :span="24" v-if="isSearch">
<a-form-model-item :label="$t('system.tag.searchCenterDisplay')" prop="isShowSearch">
<j-dict-select-tag type="list" v-model="form.isShowSearch" dictCode="yn"
:placeholder="$t('system.tag.selectSearchCenterDisplayed')" />
</a-form-model-item>
</a-col>
</template>
</a-row>
</a-form-model>
</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 { addTag, editTag, getShowAreaData, queryDictName } from '../../../../api/api'
import JDictSelectTag from '../../../../components/dict/JDictSelectTag'
import { FieldType, TagsAttributeTypeEnums, TagsTypeEnums } from '../../../../enums/commonEnums'
export default {
name: 'StandardDrawer',
components: {
JDictSelectTag
},
props: {
type: {
required: false,
type: Number
},
// 当前模块的名称
showText: {
required: false,
type: String
}
},
data () {
return {
FieldType,
canOpeFlag: process.env.VUE_APP_TAG_FLAG === '0', // 是否存在字段名称,开发环境存在
visible: false,
title: '',
width: 800,
// 存储表单的数据
form: {},
isEdit: false,
confirmLoading: false,
labelCol: {
xs: { span: 24 },
sm: { span: 6 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 }
},
validatorRules: {
// 所属模块
isModel: [
{ required: true, message: this.$t('pleaseSelect') + this.$t('system.tag.module'), trigger: 'change' }
],
// 属性名称
dbFieldTxt: [
{ required: true, message: this.$t('pleaseEnter') + this.$t('system.tag.attributeName'), trigger: 'blur' },
// { min: 1, max: 20, message: this.$t('cantExeed') + '20' + this.$t('characters'), trigger: 'blur' },
{ validator: this.test }
],
dbFieldName: [
{ required: false, message: this.$t('system.tag.pleaseEnterYourEnglishName'), trigger: 'blur' },
{ min: 1, max: 60, message: this.$t('cantExeed') + '60' + this.$t('characters'), trigger: 'blur' },
{ validator: this.test }
],
// 英文名称
dbFieldEnName: [
{
required: true,
message: this.$t('pleaseEnter') + this.$t('system.tag.attributeNameEnglish'),
trigger: 'change'
},
{ max: 50, message: this.$t('cantExeed') + '50' + this.$t('characters'), trigger: 'blur' },
{ validator: this.test }
],
// 属性类型
fieldShowType: [
{ required: true, message: this.$t('pleaseSelect') + this.$t('system.tag.attributeType'), trigger: 'change' }
],
// 选项内容
dictId: [
{ required: true, message: this.$t('pleaseSelect') + this.$t('system.tag.optionContent'), trigger: 'change' }
],
// 字段长度
dbLength: [
{ required: true, message: this.$t('pleaseEnter') + this.$t('system.tag.fieldLength'), trigger: 'blur' }
],
// 展示顺序
orderNum: [
{ required: true, message: this.$t('pleaseEnter') + this.$t('system.tag.displayOrder'), trigger: 'blur' }
],
// 是否必填
fieldMustInput: [
{ required: true, message: this.$t('pleaseSelect') + this.$t('system.tag.required'), trigger: 'change' }
],
// 文档库模块展示
isShowList: [
{ required: true, message: this.$t('pleaseSelect') + this.$t('whether') + this.showText + this.$t('system.tag.documentLibraryListDisplay'), trigger: 'change' }
],
// 详情页展示
isShowForm: [
{ required: true, message: this.$t('system.tag.isShowDetailMessage'), trigger: 'change' }
],
// 新增表单展示
isShowFormCreate: [
{ required: true, message: this.$t('system.tag.isShowAddFormMessage'), trigger: 'change' }
],
// 展示区域
showArea: [
{ required: true, message: this.$t('pleaseSelect') + this.$t('system.tag.showArea'), trigger: 'change' }
],
// 是否搜索
isQuery: [
{ required: true, message: this.$t('pleaseSelect') + this.$t('system.tag.search'), trigger: 'change' }
],
// 是否排序
sortFlag: [
{ required: true, message: this.$t('pleaseSelect') + this.$t('system.tag.isSort'), trigger: 'change' }
],
// 其它模块展示
isShowLawsList: [
{ required: true, message: this.$t('system.tag.selectDisplayListRegulations'), trigger: 'change' }
],
// 搜索中心展示
isShowSearch: [
{ required: true, message: this.$t('system.tag.selectSearchCenterDisplayed'), trigger: 'change' }
]
},
isTagContent: false,
isSearch: true,
isLength: true,
disabledEdit: false,
// 展示区域选项内容
areaOptions: [],
// 选项内容选项
contentOption: [],
contentOptionSelect: [],
contentOptionTree: [],
moduleArr: TagsTypeEnums.getItemList()
}
},
watch: {
'form.fieldShowType' (val) {
this.initFlags(val)
}
},
methods: {
filterOption (input, option) {
return (
option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
)
},
translate (key) {
return this.$t(key)
},
add () {
this.edit({
isModel: this.type, // 默认所属模块
isShowForm: 1, // 默认在详情页展示
isShowFormCreate: 1 // 默认在新增表单展示
})
},
edit (record) {
this.$refs.editForm && this.$refs.editForm.resetFields()
this.form = Object.assign({}, record)
this.form.isModel = Number(this.form.isModel)
this.isEdit = !!this.form.id
this.initData()
this.visible = true
},
// 初始化一些数据
async initData () {
this.getShowAreaData()
this.loadContent()
},
showDrawer () {
this.visible = true
},
onClose () {
this.visible = false
},
fieldShowTypeChange (e) {
this.form.dictId = undefined
// 很重要,必须要复制一下,否则不能重新赋值成功
this.form = { ...this.form }
this.$forceUpdate()
},
optionContentChange (e) {
this.form.dictId = e
// 很重要,必须要复制一下,否则不能重新赋值成功
this.form = { ...this.form }
this.$forceUpdate()
},
handleOk () {
this.$refs.editForm.validate((valid) => {
console.log('---err-----', valid)
if (valid) {
this.confirmLoading = true
const formData = Object.assign({}, this.form)
// 多行文字 默认500的长度
if (formData.fieldShowType === FieldType.TEXTAREA.value) {
formData.dbLength = formData.dbLength || 500
}
let Func = addTag
if (this.isEdit) {
Func = editTag
}
Func(formData).then(res => {
if (res.success) {
this.$message.success(res.message)
this.$emit('ok')
this.onClose()
} else {
this.$message.warning(res.message)
}
}).finally(() => {
this.confirmLoading = false
})
}
})
},
handleCancel () {
this.drawerVisible = false
this.onClose()
},
// 正则替换小数点
limitNumber (value) {
if (typeof value === 'string') {
return !isNaN(Number(value)) ? value.replace(/\./g, '') : 0
} else if (typeof value === 'number') {
return !isNaN(value) ? String(value).replace(/\./g, '') : 0
} else {
return 0
}
},
test (rule, value, callback) {
var money = /[,]|[]/g
if (money.test(value)) {
callback(new Error(this.$t('disableInput') + ','))
} else {
callback()
}
},
// 获取展示区域下拉框数据
getShowAreaData () {
getShowAreaData({ isModel: this.type }).then(res => {
if (res.success) {
this.areaOptions = res.result || []
}
})
},
// 初始化所有判断的值
// 具体值对应关系可以去commonEnums.js中查看 FieldType
initFlags (val) {
val = val + ''
// this.contentFlag=val
// 树形结构
if (val === FieldType.TREE.value || val === FieldType.TREE_SINGLE.value || val === FieldType.TREE_MODAL_SELECT.value) {
this.contentOption = [...this.contentOptionTree]
this.isTagContent = true
} else if (val === FieldType.OPTION_SINGLE.value || val === FieldType.OPTION_MORE.value) {
// 下拉单选 下拉多选
this.contentOption = [...this.contentOptionSelect]
this.isTagContent = true
} else {
this.isTagContent = false
}
// 上传文件
if (val === FieldType.FILE_UP.value) {
this.isSearch = false
this.form.isQuery = 0
} else {
this.isSearch = true
}
// 输入框(字符串) 文本框 人员选择 标准选择 输入框(链接)
// 文本框
if (val === FieldType.TEXT_BOX.value || val === 'sel_user') {
this.isLength = true
} else {
this.isLength = false
// this.isLength = true
}
},
// 获取选项内容
loadContent () {
const params = {
column: 'orderNum',
order: 'ascend'
}
queryDictName(params).then((res) => {
if (res.success) {
const data = [...res.result]
this.contentOptionSelect = []
this.contentOptionTree = []
data.map(res => {
const num = Number(res.attributeType)
if (num === TagsAttributeTypeEnums.SELECT.value) {
this.contentOptionSelect.push(res)
} else if (num === TagsAttributeTypeEnums.TREE.value) {
this.contentOptionTree.push(res)
}
})
// 树形结构
if (this.form.fieldShowType === FieldType.TREE.value || this.form.fieldShowType === FieldType.TREE_SINGLE.value || this.form.fieldShowType === FieldType.TREE_MODAL_SELECT.value) {
this.contentOption = [...this.contentOptionTree]
this.isTagContent = true
} else if (this.form.fieldShowType === FieldType.OPTION_SINGLE.value || this.form.fieldShowType === FieldType.OPTION_MORE.value) {
// 下拉单选 下拉多选
this.contentOption = [...this.contentOptionSelect]
this.isTagContent = true
} else {
this.isTagContent = false
}
}
})
}
}
}
</script>
<style scoped lang="less">
.drawer-footer {
height: 32px;
display: flex;
justify-content: center;
.ant-btn {
margin-left: 30px;
margin-bottom: 30px;
float: right;
}
}
</style>
@@ -0,0 +1,251 @@
<!--标签管理--新增配置-->
<template>
<j-modal
:title="title"
:width="800"
:visible="visible"
switchFullscreen
:maskClosable="false"
:confirmLoading="confirmLoading"
@ok="handleOk"
@cancel="handleCancel"
:cancelText="$t('close')"
>
<a-spin :spinning="confirmLoading">
<a-form-model ref="form" :model="model" :rules="validatorRules" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-form-model-item prop="itemText" :label="$t('system.tag.name')">
<a-input
:placeholder="$t('pleaseEnter') + $t('system.tag.name')"
v-model="model.itemText"
:maxLength="50"
/>
</a-form-model-item>
<!--英文名称-->
<a-form-model-item prop="enName" :label="$t('system.tag.attributeNameEnglish')">
<a-input
:placeholder="$t('pleaseEnter') + $t('system.tag.attributeNameEnglish')"
v-model="model.enName"
:maxLength="50"
/>
</a-form-model-item>
<!--父级名称 只有树形结构时显示 TODO 中英文的限制需要做显示的判断-->
<a-form-model-item :label="$t('system.tag.parentName')"
prop="parentId"
v-if="attributeType === TagsAttributeTypeEnums.TREE.value">
<a-tree-select
style="width:100%"
:dropdownStyle="{ maxHeight: '200px', overflow: 'auto' }"
:treeData="parentDataPid"
:replaceFields="{children:'children', title: 'name', key:'id', value: 'id' }"
v-model="model.parentId"
:placeholder="$t('pleaseSelect')"
allowClear
showSearch
tree-node-filter-prop="title"
:disabled="model.id"
>
</a-tree-select>
</a-form-model-item>
<!--数据值-->
<a-form-model-item prop="itemValue" :label="$t('system.tag.dataValue')">
<a-input
:placeholder="$t('pleaseEnter') + $t('system.tag.dataValue')"
v-model="model.itemValue"
:maxLength="50"
/>
</a-form-model-item>
<a-form-model-item :label="$t('description')">
<a-input :maxLength="50"
v-model="model.description"
:placeholder="$t('pleaseEnter') + $t('description')" />
</a-form-model-item>
<a-form-model-item :label="$t('dict.rankingValue')">
<a-input-number :min="1" :max="99999" v-model="model.sortOrder" />
{{ $t('dict.valueSmallerIsHigher') }}
</a-form-model-item>
</a-form-model>
</a-spin>
</j-modal>
</template>
<script>
import { IsReadOnlyEnums, TagsAttributeTypeEnums } from '../../../../enums/commonEnums'
import { addDictItem, editDictItem, getDictTreeList } from '../../../../api/api'
import { getAction } from '../../../../api/manage'
export default {
name: 'TagContentDictItemModal',
props: {
// 标签类型
attributeType: {
default: TagsAttributeTypeEnums.SELECT.value,
type: Number
}
},
data () {
return {
TagsAttributeTypeEnums,
title: this.$t('operation'),
visible: false,
visibleCheck: true,
model: {},
dictId: '',
status: 1,
labelCol: {
xs: { span: 24 },
sm: { span: 5 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 }
},
confirmLoading: false,
validatorRules: {
// 名称
itemText: [{ required: true, message: this.$t('pleaseEnter') + this.$t('system.tag.name'), trigger: 'blur' }],
// 英文名称
enName: [{
required: false,
message: this.$t('pleaseEnter') + this.$t('system.tag.attributeNameEnglish'),
trigger: 'blur'
}],
// 数据值
itemValue: [
{ required: true, message: this.$t('pleaseEnter') + this.$t('system.tag.dataValue'), trigger: 'blur' },
{ validator: this.validateItemValue, trigger: 'blur' }
]
},
// 父级项目下拉框数据的集合
parentDataPid: []
}
},
methods: {
add (dictId) {
this.dictId = dictId
// 初始化默认值
this.edit({ sortOrder: 1, status: 1 })
},
edit (record) {
if (record.id) {
this.dictId = record.dictId
// 一级菜单则将父级的默认值0 删除
if (record.parentId === '0') {
record.parentId = undefined
}
}
this.status = record.status
this.visibleCheck = (record.status === 1)
this.model = Object.assign({}, record)
this.model.dictId = this.dictId
this.model.status = this.status
// 树形结构的时候 获取父级名称的全部接口
if (this.attributeType === TagsAttributeTypeEnums.TREE.value) {
this.getAllTree()
}
this.visible = true
},
onChose (checked) {
if (checked) {
this.status = 1
this.visibleCheck = true
} else {
this.status = 0
this.visibleCheck = false
}
},
// 确定
handleOk () {
const that = this
// 触发表单验证
this.$refs.form.validate(valid => {
if (valid) {
that.confirmLoading = true
// 启用、禁用的标识
that.model.status = that.status
const params = Object.assign({}, this.model, {
dictId: this.dictId, // 数据字典的id
isTagDict: 1, // 是否为标签管理的表示
delFlag: 0 // 是否删除的标识,新的接口必须增加这一个字段,可以联系后端沟通
})
let obj
// 数据字典
if (!this.model.id) {
obj = addDictItem
params.isReadOnly = IsReadOnlyEnums.configurable.value // 是否可以操作,默认是可配的
} else {
obj = editDictItem
}
obj(params).then((res) => {
if (res.success) {
that.$message.success(res.message)
that.$emit('ok')
that.close()
} else {
that.$message.warning(res.message)
}
}).finally(() => {
that.confirmLoading = false
})
}
})
},
// 关闭
handleCancel () {
this.close()
},
close () {
this.$emit('close')
this.visible = false
this.$refs.form.resetFields()
},
validateItemValue (rule, value, callback) {
const param = {
itemValue: value,
dictId: this.dictId
}
if (this.model.id) {
param.id = this.model.id
}
if (value) {
const reg = new RegExp('[`_~!@#$^&*()=|{}\'.<>《》?!¥()—【】‘;:”“。,、?]')
if (reg.test(value)) {
callback(new Error(this.$t('dict.valueCannotContainSpecChar')))
} else {
// update--begin--autor:lvdandan-----date:20201203------forJT-27【数据字典】字典 - 数据值可重复
getAction('/sys/dictItem/dictItemCheck', param).then((res) => {
if (res.success) {
callback()
} else {
callback(res.message)
}
})
// update--end--autor:lvdandan-----date:20201203------forJT-27【数据字典】字典 - 数据值可重复
}
} else {
callback()
}
},
getAllTree () {
// 获取所有的树形结构
const params = {
dictId: this.dictId,
isTagDict: 1,
pageNo: 1,
pageSize: 10
}
getDictTreeList(params).then(res => {
if (res.success) {
// todo 不知道为啥发生了改变
this.parentDataPid = res.result.records || []
}
})
}
}
}
</script>
<style scoped>
</style>
@@ -0,0 +1,244 @@
<!--标签内容管理的数据字典查询-->
<template>
<a-drawer
:title="title"
:width="width"
placement="right"
:closable="true"
@close="onClose"
:visible="visible"
:maskClosable="false"
style="height: 100%;overflow: auto;"
>
<div>
<div class="table-page-search-wrapper">
<a-form layout="inline" @keyup.enter.native="searchQuery">
<a-row :gutter="24">
<a-col :md="12" :sm="12">
<a-form-item :label="$t('system.tag.name')" :labelCol="{span: 5}"
:wrapperCol="{span: 18, offset: 1}">
<j-input :placeholder="$t('pleaseEnter') + $t('system.tag.name')"
v-model="queryParam.itemText"></j-input>
</a-form-item>
</a-col>
<div style="float: right;overflow: hidden;margin-right: 11px" class="table-page-search-submitButtons">
<a-button icon="search" class="box-button" style="margin-left: 8px" type="primary" @click="searchQuery">{{ $t('query') }}</a-button>
<a-button icon="reload" class="box-button" @click="searchReset">{{ $t('reset') }}</a-button>
</div>
</a-row>
</a-form>
</div>
<div class="table-operator">
<!--新增-->
<a-button icon="plus" type="primary" v-if="record.isReadOnly === IsReadOnlyEnums.configurable.value || record.isReadOnly === IsReadOnlyEnums.subConfigurable.value" @click="handleAdd" v-has="'sys:dict:operation'">{{ $t('newlyAdded') }}</a-button>
<!--批量删除-->
<a-button type="primary" icon="delete" ghost v-if="record.isReadOnly === IsReadOnlyEnums.configurable.value || record.isReadOnly === IsReadOnlyEnums.subConfigurable.value" @click="batchDel" v-has="'sys:dict:operation'">{{ $t('batchDelete') }}</a-button>
</div>
<j-table
ref="table"
can-drag
:class="{'tree-table': attributeType === TagsAttributeTypeEnums.TREE.value}"
:bordered="true"
size="middle"
rowKey="id"
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
:loading="loading"
:scroll="{x: '100%', y: yScrollHeight}"
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
@change="handleTableChange"
>
<div slot="action" class="table-action" slot-scope="{text, record}">
<a class="action-edit" v-if="record.isReadOnly === IsReadOnlyEnums.configurable.value || record.isReadOnly === IsReadOnlyEnums.subConfigurable.value" @click="handleEdit(record)" v-has="'sys:dict:operation'">{{ $t('edit') }}</a>
<a-divider type="vertical" v-if="record.isReadOnly === IsReadOnlyEnums.configurable.value || record.isReadOnly === IsReadOnlyEnums.subConfigurable.value" @click="handleDelete(record.id)" v-has="'sys:dict:operation'"/>
<a class="table-del" v-if="record.isReadOnly === IsReadOnlyEnums.configurable.value || record.isReadOnly === IsReadOnlyEnums.subConfigurable.value" @click="handleDelete(record.id)" v-has="'sys:dict:operation'">{{ $t('delete') }}</a>
</div>
</j-table>
</div>
<tag-content-dict-item-modal ref="modalForm" :attribute-type="attributeType" @ok="modalFormOk"></tag-content-dict-item-modal>
</a-drawer>
</template>
<script>
import '@assets/less/common.less'
import TagContentDictItemModal from './TagContentDictItemModal'
import { SimpleListMixin } from '../../../../mixins/SimpleListMixin'
import { IsReadOnlyEnums, TagsAttributeTypeEnums } from '../../../../enums/commonEnums'
import JTable from '../../../../components/jero/JTable'
export default {
name: 'TagContentDictListDrawer',
mixins: [SimpleListMixin],
components: {
TagContentDictItemModal,
JTable
},
data () {
return {
IsReadOnlyEnums,
TagsAttributeTypeEnums,
visible: false,
title: this.$t('system.tag.dictionaryConfiguration'),
width: 1000,
confirmLoading: false,
record: {},
commonColumns: [
{
// 英文名称
title: this.$t('system.tag.attributeNameEnglish'),
align: 'center',
width: 100,
ellipsis: true,
dataIndex: 'enName',
scopedSlots: { customRender: 'text' }
},
{
// 数据值
title: this.$t('system.tag.dataValue'),
align: 'center',
width: 100,
ellipsis: true,
dataIndex: 'itemValue',
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('system.tag.describe'),
align: 'center',
width: 100,
ellipsis: true,
dataIndex: 'description',
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('operation'),
scopedSlots: { customRender: 'action' },
align: 'left',
width: 170
}
],
treeColumn: [
{
title: this.$t('system.tag.name'),
dataIndex: 'itemText',
key: 'itemText',
align: 'left',
ellipsis: true,
width: 150,
// 必须增加 为了过滤掉组件本身的插槽
scopedSlots: { customRender: '' }
}
],
listColumn: [
{
title: this.$t('system.tag.name'),
dataIndex: 'itemText',
key: 'itemText',
align: 'left',
ellipsis: true,
width: 100,
scopedSlots: { customRender: 'text' }
}
],
columns: [],
/* 排序参数--按照排序字段失序 */
isorter: {
column: 'sortOrder',
order: 'asc'
},
// 树形结构对应的接口
treeUrl: {
list: 'sys/dictItem/treeList',
delete: 'sys/dictItem/delete',
deleteBatch: 'sys/dictItem/deleteBatch'
},
dictUrl: {
list: 'sys/dictItem/page',
delete: '/sys/dictItem/delete',
deleteBatch: '/sys/dictItem/deleteBatch'
},
// 混入中查询等相关接口
url: {},
// // 其他的查询条件
filters: {
dictId: '' // 列表页数据字典的值
},
disableMixinCreated: true,
// 标签类型
attributeType: undefined
}
},
computed: {
},
methods: {
show (record) {
this.record = record
this.attributeType = Number(this.record.attributeType) // 标签类型,用于辨别是下拉框还是树形结构
// 不同的标签类型 调用不同的接口
if (this.attributeType === TagsAttributeTypeEnums.SELECT.value) {
this.url = { ...this.dictUrl }
this.columns = [...this.listColumn, ...this.commonColumns]
} else {
this.url = { ...this.treeUrl }
this.columns = [...this.treeColumn, ...this.commonColumns]
}
this.filters.dictId = record.id
// todo 需要判断当前标签的类型,来决定列表页是否是树形的
this.visible = true
this.initData()
},
// 初始化一些数据
initData () {
this.loadData(1)
},
onClose () {
this.visible = false
},
handleCancel () {
this.onClose()
},
handleAdd () {
this.$refs.modalForm.add(this.record.id)
this.$refs.modalForm.title = this.$t('newlyAdded')
this.$refs.modalForm.disableSubmit = false
},
handleEdit (record) {
this.$refs.modalForm.edit(record)
this.$refs.modalForm.title = this.$t('edit')
this.$refs.modalForm.disableSubmit = false
}
}
}
</script>
<style scoped lang="less">
.drawer-container {
.drawer-footer {
height: 32px;
display: flex;
justify-content: center;
.ant-btn {
margin-left: 30px;
margin-bottom: 30px;
float: right;
}
}
}
.tree-table {
.tree-table-content {
.tree-table-con {
.action-edit {
margin-right: 10px;
}
.action-delete {
color: red;
}
}
}
}
</style>
@@ -0,0 +1,193 @@
<template>
<j-modal
:title="title"
:width="width"
:visible="visible"
switchFullscreen
:maskClosable="false"
:confirmLoading="confirmLoading"
:ok-text="$t('preservation')"
:cancel-text="$t('cancel')"
@ok="handleOk"
@cancel="handleCancel">
<a-spin :spinning="confirmLoading">
<a-form-model ref="form" :model="model" :rules="validatorRules" :label-col="labelCol" :wrapper-col="wrapperCol">
<!--标签项名称-->
<a-form-model-item :label="$t('system.tag.labelItemName')" prop="dictName" class="tag-item">
<a-input
:maxLength="50"
v-model="model.dictName"
:placeholder="$t('pleaseEnter') + $t('system.tag.labelItemName')"
/>
</a-form-model-item>
<!--标签类型-->
<a-form-model-item :label="$t('system.tag.labelType')" prop="attributeType" class="tag-item">
<j-dict-select-tag type="list" v-model="model.attributeType" dictCode="attribute_type"
:placeholder="$t('pleaseSelect') + $t('system.tag.labelType')"/>
</a-form-model-item>
<!--字典编码 ---是因为后端会报错增加的但是需求设计中没有这个字段 -->
<a-form-model-item prop="dictCode" :label="$t('dict.dictionaryNumber')">
<a-input
:maxLength="50"
:placeholder="$t('pleaseEnter') + $t('dict.dictionaryNumber')"
v-model="model.dictCode"
/>
</a-form-model-item>
<!--展示顺序-->
<a-form-model-item :label="$t('system.tag.displayOrder')" prop="orderNum" class="tag-item">
<a-input-number v-model="model.orderNum" :placeholder="$t('pleaseEnter') + $t('system.tag.displayOrder')" style="width: 100%"
:min="1" :max="99999" :formatter="limitNumber" :parser="limitNumber"/>
</a-form-model-item>
<!--描述-->
<a-form-model-item ref="describe" :label="$t('system.tag.describe')" prop="description" class="tag-item">
<a-textarea
v-model="model.description"
:maxLength="500"
:placeholder="$t('pleaseEnter') + $t('system.tag.describe')"
/>
</a-form-model-item>
</a-form-model>
</a-spin>
</j-modal>
</template>
<script>
import JDictSelectTag from '../../../../components/dict/JDictSelectTag'
import { addDict, duplicateCheck, editDict } from '../../../../api/api'
import { IsReadOnlyEnums } from '../../../../enums/commonEnums'
import { getConfusionCode } from '@/utils/util'
export default {
name: 'TagContentModal',
components: {
JDictSelectTag
},
data () {
return {
title: '新增',
width: 800,
visible: false,
confirmLoading: false,
model: {},
labelCol: {
xs: { span: 24 },
sm: { span: 4 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 20 }
},
validatorRules: {
// 标签项名称
dictName: [
{ required: true, message: this.$t('pleaseEnter') + this.$t('system.tag.labelItemName'), trigger: 'blur' }
],
// 标签类型
attributeType: [
{ required: true, message: this.$t('pleaseSelect') + this.$t('system.tag.labelType'), trigger: 'blur' }
],
// 字典编码
dictCode: [
{ required: true, message: this.$t('pleaseEnter') + this.$t('dict.dictionaryNumber') },
{ validator: this.validateDictCode }],
// 展示顺序
orderNum: [
{ required: true, message: this.$t('pleaseEnter') + this.$t('system.tag.displayOrder'), trigger: 'blur' }
],
description: [
{ required: false, trigger: 'blur' }
]
}
}
},
methods: {
add () {
// this.dictId = dictId
this.isEdit = false
// 初始化默认值
this.edit({})
},
edit (record) {
if (record.id) {
this.isEdit = true
}
this.model = Object.assign({}, record)
// this.model.dictId = this.dictI
// this.model.status = this.status
this.visible = true
},
handleOk () {
// 这块的新增、编辑直接用数据字典的接口
this.$refs.form.validate(valid => {
if (valid) {
this.confirmLoading = true
const formData = Object.assign({}, this.model)
// 重要,设置为标签内容
formData.isTagDict = 1
let Func = addDict
if (this.isEdit) {
Func = editDict
} else {
// 设置为非固定字段--默认可以编辑
formData.isReadOnly = IsReadOnlyEnums.configurable.value // 是否可以操作,默认是可配的
}
Func(formData).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.$emit('close')
this.visible = false
this.$refs.form && this.$refs.form.resetFields()
},
// 正则替换小数点
limitNumber (value) {
if (typeof value === 'string') {
return !isNaN(Number(value)) ? value.replace(/\./g, '') : 0
} else if (typeof value === 'number') {
return !isNaN(value) ? String(value).replace(/\./g, '') : 0
} else {
return 0
}
},
validateDictCode (rule, value, callback) {
const confusionCode = getConfusionCode('sys_dict', 'dict_code')
// 重复校验
const params = {
// tableName: 'sys_dict',
// fieldName: 'dict_code',
confusionCode,
fieldVal: value,
dataId: this.model.id
}
duplicateCheck(params).then((res) => {
if (res.success) {
callback()
} else {
callback(res.message)
}
})
}
}
}
</script>
<style scoped>
</style>
@@ -0,0 +1,158 @@
<!--条款拆分-->
<template>
<div>
<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="$t('system.tag.attributeName')" :labelCol="{span: 5}"
:wrapperCol="{span: 18, offset: 1}">
<j-input :placeholder="$t('pleaseEnter') + $t('system.tag.attributeName')"
v-model="queryParam.dbFieldTxt"></j-input>
</a-form-item>
</a-col>
<div style="float: right;overflow: hidden;margin-right: 11px" class="table-page-search-submitButtons">
<a-button icon="search" class="box-button" v-has="'tag:page'" style="margin-left: 8px" type="primary" @click="searchQuery">{{ $t('query') }}</a-button>
<a-button icon="reload" class="box-button" @click="searchReset">{{ $t('reset') }}</a-button>
</div>
</a-row>
</a-form>
</div>
<div class="table-operator">
<!--新增-->
<a-button icon="plus" type="primary" @click="handleAdd" v-has="'tag:add'">{{ $t('newlyAdded') }}</a-button>
<!--批量删除-->
<a-button type="primary" icon="delete" ghost @click="batchDel" v-has="'tag:logicDeleteBatch'">{{ $t('batchDelete') }}</a-button>
</div>
<j-table
ref="table"
:bordered="false"
size="middle"
rowKey="id"
can-drag
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
:loading="loading"
:scroll="{x: '100%', y: yScrollHeight}"
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
:operation-list="operationList"
@change="handleTableChange"
@operationClick="operationClick"
>
</j-table>
<clause-splitting-drawer ref="modalForm" v-bind="$props" @ok="modalFormOk"></clause-splitting-drawer>
</div>
</template>
<script>
import '@assets/less/common.less'
import ClauseSplittingDrawer from '../modules/ClauseSplittingDrawer'
import { SimpleListMixin } from '../../../../mixins/SimpleListMixin'
import JTable from '../../../../components/jero/JTable'
import { IsReadOnlyEnums } from '../../../../enums/commonEnums'
export default {
name: 'ClauseSplittingList',
mixins: [SimpleListMixin],
components: {
ClauseSplittingDrawer,
JTable
},
props: {
type: {
required: false,
type: Number
}
},
data () {
return {
// 混入中查询等相关接口
url: {
list: 'tag/lawsTag/page',
delete: 'tag/lawsTag/logicDelete',
deleteBatch: 'tag/lawsTag/logicDeleteBatch'
},
filters: {
isModel: this.type
},
/* 排序参数 */
isorter: {
column: 'orderNum',
order: 'asc'
},
columns: [
{
title: this.$t('system.tag.attributeName'),
align: 'center',
width: 200,
dataIndex: 'dbFieldTxt',
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('system.tag.attributeNameEnglish'),
align: 'center',
width: 100,
dataIndex: 'dbFieldEnName',
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('system.tag.attributeType'),
align: 'center',
width: 100,
dataIndex: 'fieldShowType_dictText',
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('system.tag.fieldLength'),
align: 'center',
width: 80,
dataIndex: 'dbLength',
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('system.tag.displayOrder'),
align: 'center',
width: 80,
dataIndex: 'orderNum',
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('operation'),
scopedSlots: { customRender: 'action' },
align: 'center',
fixed: 'right',
width: 170
}
],
canOpeFlag: process.env.VUE_APP_TAG_FLAG === '0', // 是否可以操作编辑和删除,开发环境可以
operationList: [
// 编辑
{
text: this.$t('edit'),
clickEvent: 'handleEdit',
has: 'tag:edit',
show: (record) => {
return (this.canOpeFlag || record.isReadOnly === IsReadOnlyEnums.configurable.value || record.isReadOnly === IsReadOnlyEnums.subConfigurable.value)
}
},
// 删除
{
text: this.$t('delete'),
clickEvent: 'handleDelete',
has: 'tag:logicDelete',
show: (record) => {
return (this.canOpeFlag || record.isReadOnly === IsReadOnlyEnums.configurable.value || record.isReadOnly === IsReadOnlyEnums.subConfigurable.value)
}
}
]
}
}
}
</script>
<style scoped>
</style>
@@ -0,0 +1,207 @@
<!-- 国内法规-->
<template>
<div>
<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="$t('system.tag.attributeName')" :labelCol="{span: 5}"
:wrapperCol="{span: 18, offset: 1}">
<j-input :placeholder="$t('pleaseEnter') + $t('system.tag.attributeName')"
v-model="queryParam.dbFieldTxt"></j-input>
</a-form-item>
</a-col>
<a-col :span="8">
<a-form-item :label="$t('system.tag.showArea')" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
<a-select class="box-input" v-model="queryParam.showArea"
:placeholder="$t('pleaseSelect') + $t('system.tag.showArea')">
<a-select-option :value="item.id" v-for="item in areasArr" :key="item.id">{{ item.showArea }}
</a-select-option>
</a-select>
</a-form-item>
</a-col>
<div style="float: right;overflow: hidden;margin-right: 11px" class="table-page-search-submitButtons">
<a-button icon="search" class="box-button" v-has="'tag:page'" style="margin-left: 8px" type="primary" @click="searchQuery">
{{ $t('query') }}
</a-button>
<a-button icon="reload" class="box-button" @click="searchReset">{{ $t('reset') }}</a-button>
</div>
</a-row>
</a-form>
</div>
<div class="table-operator">
<!--新增-->
<a-button icon="plus" type="primary" @click="handleAdd" v-has="'tag:add'">{{ $t('newlyAdded') }}</a-button>
<!--展示区域管理-->
<a-button icon="unordered-list" type="primary" ghost @click="handleShow" v-has="'tag:area:list'">{{ $t('system.tag.exhibitionAreaManagement') }}</a-button>
<!--批量删除-->
<a-button type="primary" icon="delete" ghost @click="batchDel" v-has="'tag:logicDeleteBatch'">{{ $t('batchDelete') }}</a-button>
</div>
<div>
<j-table
rowKey="id"
:bordered="false"
can-drag
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
:scroll="{x: '100%', y: yScrollHeight}"
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
:operation-list="operationList"
@change="handleTableChange"
@operationClick="operationClick"
>
</j-table>
</div>
<!--新增字段-->
<standard-drawer ref="modalForm" v-bind="$props" @ok="modalFormOk"></standard-drawer>
<!--区域管理模态框-->
<area-modal ref="areaModal" v-bind="$props" @refresh="refreshAreaData"></area-modal>
</div>
</template>
<script>
import { getShowAreaData } from '../../../../api/api'
import '@assets/less/common.less'
import StandardDrawer from '../modules/StandardDrawer'
import AreaModal from '../modules/AreaModal'
import { SimpleListMixin } from '../../../../mixins/SimpleListMixin'
import JTable from '../../../../components/jero/JTable'
import { IsReadOnlyEnums } from '../../../../enums/commonEnums'
export default {
name: 'StandardList',
mixins: [SimpleListMixin],
components: {
StandardDrawer,
AreaModal,
JTable
},
props: {
type: {
required: false,
type: Number
},
// 当前模块的名称
showText: {
required: false,
type: String
}
},
data () {
return {
// 展示区域-下拉框的数据
areasArr: [],
// 混入中查询等相关接口
url: {
list: 'tag/lawsTag/page',
delete: 'tag/lawsTag/logicDelete',
deleteBatch: 'tag/lawsTag/logicDeleteBatch'
},
filters: {
isModel: this.type
},
/* 排序参数 */
isorter: {
column: 'orderNum',
order: 'asc'
},
canOpeFlag: process.env.VUE_APP_TAG_FLAG === '0', // 是否可以操作编辑和删除,开发环境可以
columns: [
{
title: this.$t('system.tag.attributeName'),
width: 170,
dataIndex: 'dbFieldTxt',
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('system.tag.attributeNameEnglish'),
width: 170,
dataIndex: 'dbFieldEnName',
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('system.tag.attributeType'),
width: 170,
dataIndex: 'fieldShowType_dictText',
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('system.tag.fieldLength'),
width: 170,
dataIndex: 'dbLength',
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('system.tag.displayOrder'),
width: 170,
dataIndex: 'orderNum',
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('system.tag.showArea'),
width: 170,
dataIndex: 'showArea_dictText',
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('operation'),
scopedSlots: { customRender: 'action' },
align: 'center',
fixed: 'right',
width: 150
}
],
operationList: [
// 编辑
{
text: this.$t('edit'),
clickEvent: 'handleEdit',
has: 'tag:edit',
show: (record) => {
return (this.canOpeFlag || record.isReadOnly === IsReadOnlyEnums.configurable.value || record.isReadOnly === IsReadOnlyEnums.subConfigurable.value)
}
},
// 删除
{
text: this.$t('delete'),
clickEvent: 'handleDelete',
has: 'tag:logicDelete',
show: (record) => {
return (this.canOpeFlag || record.isReadOnly === IsReadOnlyEnums.configurable.value || record.isReadOnly === IsReadOnlyEnums.subConfigurable.value)
}
}
]
}
},
methods: {
// 获取展示区域下拉框数据
getShowAreaData () {
getShowAreaData({ isModel: this.type }).then(res => {
if (res.success) {
this.areasArr = res.result || []
}
})
},
// 展示区域管理
handleShow () {
this.$refs.areaModal.show()
},
refreshAreaData () {
this.getShowAreaData()
this.loadData()
this.queryParam.showArea = undefined
}
},
created () {
console.log('-----------process.env.VUE_TAG_FLAG--------', process.env)
this.getShowAreaData()
}
}
</script>
<style scoped>
</style>
+196
View File
@@ -0,0 +1,196 @@
<template>
<div class="tag-content">
<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="$t('system.tag.labelName')" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
<j-input :placeholder="$t('pleaseEnter') + $t('system.tag.labelName')"
v-model="queryParam.dictName"></j-input>
</a-form-item>
</a-col>
<a-col :span="8">
<a-form-item :label="$t('system.tag.labelType')" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
<j-dict-select-tag type="list" v-model="queryParam.attributeType" dictCode="attribute_type"
:placeholder="$t('pleaseSelect') + $t('system.tag.labelType')" />
</a-form-item>
</a-col>
<div style="float: right;overflow: hidden;margin-right: 11px" class="table-page-search-submitButtons">
<a-col :span="8">
<a-button icon="search" class="box-button" style="margin-left: 8px" type="primary" @click="searchQuery">{{ $t('query') }}</a-button>
<a-button icon="reload" class="box-button" @click="searchReset">{{ $t('reset') }}</a-button>
</a-col>
</div>
</a-row>
</a-form>
</div>
<div class="table-operator">
<!--新增-->
<a-button icon="plus" type="primary" @click="handleAdd" v-has="'sys:dict:operation'">{{ $t('newlyAdded') }}</a-button>
<!--刷新缓存-->
<a-button icon="sync" type="primary" ghost @click="refreshCache" v-has="'sys:dict:operation'">{{ $t('dict.refreshCache') }}</a-button>
<!--批量删除-->
<a-button type="primary" icon="delete" ghost @click="batchDel" v-has="'sys:dict:operation'">{{ $t('batchDelete') }}</a-button>
</div>
<j-table
class="tag-con-table"
rowKey="id"
can-drag
:data-source="dataSource"
:pagination="ipagination"
:loading="loading"
:columns="columns"
:scroll="{x: '100%', y: yScrollHeight}"
:row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
:operation-list="operationList"
@change="handleTableChange"
@operationClick="operationClick"
>
</j-table>
<!-- 新增编辑 -->
<tag-content-modal ref="modalForm" @ok="modalFormOk"></tag-content-modal>
<!--配置字典-字典列表的展示-->
<tag-content-dict-list-drawer ref="tagContentDictListDrawer"></tag-content-dict-list-drawer>
</div>
</template>
<script>
import '@assets/less/common.less'
import TagContentModal from '../modules/TagContentModal'
import TagContentDictListDrawer from '../modules/TagContentDictListDrawer'
import JDictSelectTag from '../../../../components/dict/JDictSelectTag'
import { SimpleListMixin } from '../../../../mixins/SimpleListMixin'
import JTable from '../../../../components/jero/JTable'
import Vue from 'vue'
import { getAction } from '../../../../api/manage'
import { UI_CACHE_DB_DICT_DATA } from '../../../../store/mutation-types'
import { IsReadOnlyEnums } from '../../../../enums/commonEnums'
export default {
name: 'TagContent',
mixins: [SimpleListMixin],
components: {
TagContentModal,
TagContentDictListDrawer,
JDictSelectTag,
JTable
},
data () {
return {
IsReadOnlyEnums,
columns: [
{
title: this.$t('system.tag.labelName'),
dataIndex: 'dictName',
key: 'dictName',
align: 'center',
// ellipsis: true,
width: 100,
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('system.tag.labelType'),
align: 'center',
width: 100,
dataIndex: 'attributeType_dictText',
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('system.tag.describe'),
align: 'center',
dataIndex: 'description',
ellipsis: true,
width: 200,
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('system.tag.displayOrder'),
align: 'center',
width: 100,
dataIndex: 'orderNum',
scopedSlots: { customRender: 'text' }
},
{
title: this.$t('operation'),
scopedSlots: { customRender: 'action' },
align: 'center',
width: 100
}
],
canOpeFlag: process.env.VUE_APP_TAG_FLAG === '0', // 是否可以操作编辑和删除,开发环境可以
// dataSource: [],
url: {
list: 'sys/dict/tagDictPage',
delete: 'sys/dict/delete',
deleteBatch: 'sys/dict/deleteBatch',
refreshCache: 'sys/dict/refleshCache',
queryAllDictItems: 'sys/dict/queryAllDictItems'
},
/* 排序参数 */
isorter: {
column: 'orderNum',
order: 'ascend'
},
// 增加其他的查询条件
filters: {
isTagDict: 1 // 是否为标签内容(1是 0否)
},
operationList: [
// 字典配置
{
text: this.$t('system.tag.dictionaryConfiguration'),
clickEvent: 'editDictItem'
},
// 编辑
{
text: this.$t('edit'),
clickEvent: 'handleEdit',
has: 'sys:dict:operation',
show: (record) => {
return (this.canOpeFlag || record.isReadOnly === IsReadOnlyEnums.configurable.value)
}
},
// 删除
{
text: this.$t('delete'),
clickEvent: 'handleDelete',
has: 'sys:dict:operation',
show: (record) => {
return (this.canOpeFlag || record.isReadOnly === IsReadOnlyEnums.configurable.value)
}
}
]
}
},
methods: {
refreshCache () {
getAction(this.url.refreshCache).then((res) => {
if (res.success) {
// 重新加载缓存
getAction(this.url.queryAllDictItems).then((res) => {
if (res.success) {
Vue.ls.remove(UI_CACHE_DB_DICT_DATA)
Vue.ls.set(UI_CACHE_DB_DICT_DATA, res.result, 7 * 24 * 60 * 60 * 1000)
}
})
this.$message.success(this.$t('dict.refreshCache') + this.$t('dict.complete') + '!')
}
}).catch(e => {
this.$message.warn(this.$t('dict.refreshCache') + this.$t('dict.failed') + '!')
console.log('刷新失败', e)
})
},
// 编辑字典数据
editDictItem (record) {
this.$refs.tagContentDictListDrawer.show(record)
}
}
}
</script>
<style scoped>
</style>
+49
View File
@@ -0,0 +1,49 @@
<template>
<div class='tag-item-container'>
<a-spin :spinning="spinning">
<a-tabs :default-active-key="1" @change="callbackTab">
<a-tab-pane v-for='item in tabArr' :key="item.value" :tab="item.showText">
<component :is='item.comp' :type='item.value' :show-text="item.showText" :property="item.props"></component>
</a-tab-pane>
</a-tabs>
</a-spin>
</div>
</template>
<script>
import StandardList from './StandardList'
import ClauseSplittingList from './ClauseSplittingList'
export default {
name: 'TagItem',
components: {
StandardList
},
data () {
return {
spinning: false,
tabArr: [
{ name: '国内法规', showText: this.$t('system.tag.domesticLaws'), value: 1, comp: StandardList },
{ name: '海外标准', showText: this.$t('system.tag.foreignStandards'), value: 2, comp: StandardList },
{ name: '企业标准', showText: this.$t('system.tag.enterpriseStandards'), value: 3, comp: StandardList },
{ name: '条款拆分', showText: this.$t('system.tag.clauseSplitting'), value: 4, comp: ClauseSplittingList }
]
}
},
methods: {
// 标签项管理tab切换
callbackTab (value) {
this.key = value
this.spinning = true
setTimeout(() => {
this.spinning = false
}, 100)
}
}
}
</script>
<style scoped>
</style>
+252
View File
@@ -0,0 +1,252 @@
/**
* 新增修改完成调用 modalFormOk方法 编辑弹框组件ref定义为modalForm
* 高级查询按钮调用 superQuery方法 高级查询组件ref定义为superQueryModal
* data中url定义 list为查询列表 delete为删除单条记录 deleteBatch为批量删除
*/
import { filterObj } from '@/utils/util'
import { getAction, postAction } from '@/api/manage'
export const TagListMixin = {
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'
}
},
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
}
let ids = ''
for (let a = 0; a < this.selectedRowKeys.length; a++) {
ids += this.selectedRowKeys[a] + ','
}
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
}
}
}