[update] 添加选择用户、组织机构弹框

This commit is contained in:
lideqin
2023-08-24 18:23:43 +08:00
parent ffcee5565c
commit 732897a665
14 changed files with 791 additions and 148 deletions
+1 -1
View File
@@ -1,4 +1,4 @@
@primary-color: #1890ff;
@primary-color: #D52C26;
/* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
/* stylelint-disable no-duplicate-selectors */
/* stylelint-disable */
+50 -2
View File
@@ -273,8 +273,8 @@
width: calc(100% - 100px);
line-height: 38px;
background: #fff;
border: 1px #1890ff solid;
color: #1890ff;
border: 1px #D52C26 solid;
color: #D52C26;
}
// 新增编辑表单样式--完
@@ -312,3 +312,51 @@
overflow: hidden;
text-overflow: ellipsis;
}
/* switch的样式 */
.table-operator-tab {
width: fit-content;
background-color: #F0F2F4;
border-radius: 4px;
overflow: hidden;
}
.table-operator-tab a {
border-radius: 4px;
display: inline-flex;
justify-content: center;
align-items: center;
width: 94px;
height: 32px;
color: #4E5969;
}
.table-operator-tab a.table-operator-tab-active {
background-color: #D52C26;
color: #FFFFFF;
}
.table-operator-tab a:not(:first-child) {
//transform: translateX(-8px);
margin-left: -8px;
}
/* switch的样式--end */
/*分页的样式start*/
/deep/ .ant-pagination-item-active {
background: #D52C26;
border-radius: 3px 3px 3px 3px;
border: none;
color: #FFFFFF;
}
/deep/ .ant-pagination-item {
min-width: 24px;
height: 24px;
line-height: 24px !important;
color: #1D2129;
font-weight: 400;
border: 1px solid #E5E6EB;
}
/*分页的样式end*/
+10 -1
View File
@@ -409,7 +409,7 @@ module.exports = {
addQuantity: '添加数量',
enterQuantity: '请输入数量',
numberRows: '行数',
numberColumns: '列数',
numberColumns: '列数'
},
comparison: {
releaseSituation: '发布情况',
@@ -471,6 +471,15 @@ module.exports = {
standardSelect: {
standardSelection: '标准选择'
},
// 用户/组织结构选择器
userOrOrganSelect: {
select: '选择',
selectUserOrOrgan: '选择用户/机构',
organization: '组织机构',
name: '姓名',
secondLevel: '二级',
threeLevel: '三级'
},
// 弹框上传附件
uploadFile: {
clickUpload: '点击上传',
+8 -2
View File
@@ -42,14 +42,14 @@
</a-form-item>
</template>
<!-- 日期区间 -->
<tempalet v-else-if="[FieldType.DATE_SINGLE.value, FieldType.DATE_MORE.value].includes(item.field_show_type)">
<template v-else-if="[FieldType.DATE_SINGLE.value, FieldType.DATE_MORE.value].includes(item.field_show_type)">
<a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-range-picker v-model="queryParam[item.db_field_name]"
:placeholder="$t('pleaseSelect')+item.db_field_txt"
format="YYYY-MM-DD" value-format="YYYY-MM-DD"
@change="onChange(item.db_field_name)"></a-range-picker>
</a-form-item>
</tempalet>
</template>
<!-- 字典单选框 -->
<template v-else-if="item.field_show_type === FieldType.PULL_SINGLE.value">
<a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
@@ -62,6 +62,7 @@
</template>
<template v-if="index >= minLength && toggleSearchStatus">
<!-- 树形选择器 -->
<template v-if="item.field_show_type === FieldType.TREE.value">
<a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-tree-select
@@ -75,6 +76,7 @@
/>
</a-form-item>
</template>
<!-- 输入框 -->
<template v-else-if="[FieldType.TEXT_STRING.value, FieldType.TEXT.value,FieldType.PERSON.value,
FieldType.STANDARD.value, FieldType.TEXT_LINK.value].includes(item.field_show_type)">
<a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
@@ -82,12 +84,14 @@
v-model="queryParam[item.db_field_name]"></a-input>
</a-form-item>
</template>
<!-- 数字输入框 -->
<template v-else-if="item.field_show_type === FieldType.TEXT_NUMBER.value">
<a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input-number :placeholder="$t('pleaseEnter')+item.db_field_txt"
v-model="queryParam[item.db_field_name]" :min="1" :max="99999999"/>
</a-form-item>
</template>
<!-- 字典多选框 -->
<template v-else-if="item.field_show_type === FieldType.PULL_MORE.value">
<a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-multi-select-tag v-model="queryParam[item.db_field_name]"
@@ -95,6 +99,7 @@
:triggerChange="false" :dictCode="item.dict_field"/>
</a-form-item>
</template>
<!-- 日期区间选择器 -->
<template v-else-if="[FieldType.DATE_SINGLE.value, FieldType.DATE_MORE.value].includes(item.field_show_type)">
<a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-range-picker v-model="queryParam[item.db_field_name]"
@@ -102,6 +107,7 @@
@change="onChange(item.db_field_name)"></a-range-picker>
</a-form-item>
</template>
<!-- 字典选择器 -->
<template v-else-if="item.field_show_type === FieldType.PULL_SINGLE.value">
<a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-dict-select-tag v-model="queryParam[item.db_field_name]"
+111 -111
View File
@@ -3,118 +3,118 @@
<a-row :gutter="24">
<a-col :md="12" :sm="8" v-for="(item,index) in searchList" :key="index" style="line-height: 48px">
<template v-if="index < 3">
<div class="box-title-text" v-if="item.field_show_type == '0'">
<div class="title-text" :title="item.db_field_txt">
<span>{{item.db_field_txt}}</span>
</div>
<a-tree-select
class="box-input"
tree-node-filter-prop="title"
v-model="queryParam[item.db_field_name]"
:maxTagCount="1"
:getPopupContainer="triggerNode=> triggerNode.parentNode"
:tree-data="item.tree"
tree-checkable
:placeholder="$t('PleaseSelect')+item.db_field_txt"
/>
</div>
<div class="box-title-text" v-else-if="item.field_show_type == '1' || item.field_show_type == '8' ||
item.field_show_type == '9' || item.field_show_type == '10' || item.field_show_type == '11'">
<div class="title-text" :title="item.db_field_txt">
<span>{{item.db_field_txt}}</span>
</div>
<a-input class="box-input" :placeholder="$t('PleaseEnter')+item.db_field_txt"
v-model="queryParam[item.db_field_name]"></a-input>
</div>
<div class="box-title-text" v-if="item.field_show_type == '2'">
<div class="title-text" :title="item.db_field_txt">
<span>{{item.db_field_txt}}</span>
</div>
<a-input-number class="box-input" :placeholder="$t('PleaseEnter')+item.db_field_txt"
v-model="queryParam[item.db_field_name]" :min="1" :max="99999999"/>
</div>
<div class="box-title-text" v-else-if="item.field_show_type == '4'">
<div class="title-text" :title="item.db_field_txt">
<span>{{item.db_field_txt}}</span>
</div>
<j-multi-select-tag class="box-input" v-model="queryParam[item.db_field_name]"
:placeholder="$t('PleaseSelect')+item.db_field_txt" :type="'select'"
:triggerChange="false" :dictCode="item.dict_field"/>
</div>
<div class="box-title-text" v-else-if="item.field_show_type == '6' || item.field_show_type == '5'">
<div class="title-text" :title="item.db_field_txt">
<span>{{item.db_field_txt}}</span>
</div>
<a-range-picker class="box-input" v-model="queryParam[item.db_field_name]"
format="YYYY-MM-DD" value-format="YYYY-MM-DD"
@change="onChange(item.db_field_name)"></a-range-picker>
</div>
<div class="box-title-text" v-else-if="item.field_show_type == '3'">
<div class="title-text" :title="item.db_field_txt">
<span>{{item.db_field_txt}}</span>
</div>
<j-dict-select-tag class="box-input" v-model="queryParam[item.db_field_name]"
:placeholder="$t('PleaseSelect')+item.db_field_txt"
:type="'select'"
:triggerChange="false" :dictCode="item.dict_field"/>
</div>
<!-- 树形选择器 -->
<template v-if="item.field_show_type === FieldType.TREE.value">
<a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-tree-select
tree-node-filter-prop="title"
v-model="queryParam[item.db_field_name]"
:maxTagCount="1"
:getPopupContainer="triggerNode=> triggerNode.parentNode"
:tree-data="item.tree"
tree-checkable
:placeholder="$t('pleaseSelect')+item.db_field_txt"
/>
</a-form-item>
</template>
<!-- 输入框 -->
<template
v-else-if="[FieldType.TEXT_STRING.value, FieldType.TEXT.value,FieldType.PERSON.value,
FieldType.STANDARD.value, FieldType.TEXT_LINK.value].includes(item.field_show_type)">
<a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input :placeholder="$t('pleaseEnter')+item.db_field_txt"
v-model="queryParam[item.db_field_name]"></a-input>
</a-form-item>
</template>
<!-- 数字输入框 -->
<template v-else-if="item.field_show_type === FieldType.TEXT_NUMBER.value">
<a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input-number :placeholder="$t('pleaseEnter')+item.db_field_txt"
v-model="queryParam[item.db_field_name]" :min="1" :max="99999999"/>
</a-form-item>
</template>
<!-- 字典多选框 -->
<template v-else-if="item.field_show_type === FieldType.PULL_MORE.value">
<a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-multi-select-tag v-model="queryParam[item.db_field_name]"
:placeholder="$t('pleaseSelect')+item.db_field_txt" :type="'select'"
:triggerChange="false" :dictCode="item.dict_field"/>
</a-form-item>
</template>
<!-- 日期区间 -->
<template v-else-if="[FieldType.DATE_SINGLE.value, FieldType.DATE_MORE.value].includes(item.field_show_type)">
<a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-range-picker v-model="queryParam[item.db_field_name]"
:placeholder="$t('pleaseSelect')+item.db_field_txt"
format="YYYY-MM-DD" value-format="YYYY-MM-DD"
@change="onChange(item.db_field_name)"></a-range-picker>
</a-form-item>
</template>
<!-- 字典单选框 -->
<template v-else-if="item.field_show_type === FieldType.PULL_SINGLE.value">
<a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-dict-select-tag v-model="queryParam[item.db_field_name]"
:placeholder="$t('pleaseSelect')+item.db_field_txt"
:type="'select'"
:triggerChange="false" :dictCode="item.dict_field"/>
</a-form-item>
</template>
</template>
<template v-if="index >= 3 && toggleSearchStatus">
<div class="box-title-text" v-if="item.field_show_type == '0'">
<div class="title-text" :title="item.db_field_txt">
<span>{{item.db_field_txt}}</span>
</div>
<a-tree-select
class="box-input"
tree-node-filter-prop="title"
v-model="queryParam[item.db_field_name]"
:maxTagCount="1"
:getPopupContainer="triggerNode=> triggerNode.parentNode"
:tree-data="item.tree"
tree-checkable
:placeholder="$t('PleaseSelect')+item.db_field_txt"
/>
</div>
<div class="box-title-text" v-else-if="item.field_show_type == '1' || item.field_show_type == '8' ||
item.field_show_type == '9' || item.field_show_type == '10' || item.field_show_type == '11'">
<div class="title-text" :title="item.db_field_txt">
<span>{{item.db_field_txt}}</span>
</div>
<a-input class="box-input" :placeholder="$t('PleaseEnter')+item.db_field_txt"
v-model="queryParam[item.db_field_name]"></a-input>
</div>
<div class="box-title-text" v-if="item.field_show_type == '2'">
<div class="title-text" :title="item.db_field_txt">
<span>{{item.db_field_txt}}</span>
</div>
<a-input-number class="box-input" :placeholder="$t('PleaseEnter')+item.db_field_txt"
v-model="queryParam[item.db_field_name]" :min="1" :max="99999999"/>
</div>
<div class="box-title-text" v-else-if="item.field_show_type == '4'">
<div class="title-text" :title="item.db_field_txt">
<span>{{item.db_field_txt}}</span>
</div>
<j-multi-select-tag class="box-input" v-model="queryParam[item.db_field_name]"
:placeholder="$t('PleaseSelect')+item.db_field_txt" :type="'select'"
:triggerChange="false" :dictCode="item.dict_field"/>
</div>
<div class="box-title-text" v-else-if="item.field_show_type == '6' || item.field_show_type == '5'">
<div class="title-text" :title="item.db_field_txt">
<span>{{item.db_field_txt}}</span>
</div>
<a-range-picker class="box-input" v-model="queryParam[item.db_field_name]"
format="YYYY-MM-DD" value-format="YYYY-MM-DD"
@change="onChange(item.db_field_name)"></a-range-picker>
</div>
<div class="box-title-text" v-else-if="item.field_show_type == '3'">
<div class="title-text" :title="item.db_field_txt">
<span>{{item.db_field_txt}}</span>
</div>
<j-dict-select-tag class="box-input" v-model="queryParam[item.db_field_name]"
:placeholder="$t('PleaseSelect')+item.db_field_txt"
:type="'select'"
:triggerChange="false" :dictCode="item.dict_field"/>
</div>
<template v-if="index >= 2 && toggleSearchStatus">
<!-- 树形选择器 -->
<template v-if="item.field_show_type === FieldType.TREE.value">
<a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-tree-select
tree-node-filter-prop="title"
v-model="queryParam[item.db_field_name]"
:maxTagCount="1"
:getPopupContainer="triggerNode=> triggerNode.parentNode"
:tree-data="item.tree"
tree-checkable
:placeholder="$t('pleaseSelect')+item.db_field_txt"
/>
</a-form-item>
</template>
<!-- 输入框 -->
<template v-else-if="[FieldType.TEXT_STRING.value, FieldType.TEXT.value,FieldType.PERSON.value,
FieldType.STANDARD.value, FieldType.TEXT_LINK.value].includes(item.field_show_type)">
<a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input :placeholder="$t('pleaseEnter')+item.db_field_txt"
v-model="queryParam[item.db_field_name]"></a-input>
</a-form-item>
</template>
<!-- 数字输入框 -->
<template v-else-if="item.field_show_type === FieldType.TEXT_NUMBER.value">
<a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-input-number :placeholder="$t('pleaseEnter')+item.db_field_txt"
v-model="queryParam[item.db_field_name]" :min="1" :max="99999999"/>
</a-form-item>
</template>
<!-- 字典多选框 -->
<template v-else-if="item.field_show_type === FieldType.PULL_MORE.value">
<a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-multi-select-tag v-model="queryParam[item.db_field_name]"
:placeholder="$t('pleaseSelect')+item.db_field_txt" :type="'select'"
:triggerChange="false" :dictCode="item.dict_field"/>
</a-form-item>
</template>
<!-- 日期区间选择器 -->
<template v-else-if="[FieldType.DATE_SINGLE.value, FieldType.DATE_MORE.value].includes(item.field_show_type)">
<a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-range-picker v-model="queryParam[item.db_field_name]"
format="YYYY-MM-DD" value-format="YYYY-MM-DD"
@change="onChange(item.db_field_name)"></a-range-picker>
</a-form-item>
</template>
<!-- 字典选择器 -->
<template v-else-if="item.field_show_type === FieldType.PULL_SINGLE.value">
<a-form-item :label="item.db_field_txt" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-dict-select-tag v-model="queryParam[item.db_field_name]"
:placeholder="$t('pleaseSelect')+item.db_field_txt"
:type="'select'"
:triggerChange="false" :dictCode="item.dict_field"/>
</a-form-item>
</template>
</template>
</a-col>
<span style="float: right;overflow: hidden;margin-right: 41px;margin-bottom: 20px"
@@ -86,7 +86,7 @@ export default {
},
columns: [
{
title: this.$t('standard'),
title: this.$t('number'),
dataIndex: 'serial_number',
ellipsis: true,
align: 'left',
@@ -0,0 +1,62 @@
<template>
<div>
<div class="box-title-text">
<div @click="selectClick">
<div v-for="item in selectValue" :key="item.id">{{item.label}}</div>
</div>
<a-button type="primary" class="button-box" @click="selectClick">
{{this.$t('userOrOrganSelect.select')}}
</a-button>
</div>
<user-organ-select-modal ref="selectModal" :selectType="selectType" @change="selectChange"></user-organ-select-modal>
</div>
</template>
<script>
import UserOrganSelectModal from './UserOrganSelectModal'
export default {
name: 'UserOrOrganSelection',
components: { UserOrganSelectModal },
props: {
disabled: {
type: Boolean,
default: false
},
selectType: {
type: String,
default: 'all'
},
value: {
type: Object,
default: () => {
return {
organ: '',
user: ''
}
}
}
},
data () {
return {
selectValue: []
}
},
methods: {
selectClick () {
this.$refs.selectModal.open()
},
selectChange (arrOne, arrTwo) {
if (this.selectType === 'all') {
this.selectValue = [...arrOne, ...arrTwo]
} else {
this.selectValue = arrOne
}
}
}
}
</script>
<style scoped>
</style>
@@ -0,0 +1,522 @@
<template>
<a-modal
:title="$t('userOrOrganSelect.selectUserOrOrgan')"
:maskClosable="false"
:width="1000"
:closable="true"
@ok="handleOk"
@cancel="handleCancel"
:visible="visible">
<div class="modal-search-wrapper table-page-search-wrapper">
<a-form v-if="switchValue === 'organ'" layout="inline" @keyup.enter.native="searchQueryOrgan">
<a-row :gutter="24">
<a-col :sm="6">
<a-form-item :label="$t('organization')">
<a-tree-select
tree-node-filter-prop="title"
v-model="queryParamOrgan.departId"
:maxTagCount="1"
:show-search="true"
:getPopupContainer="triggerNode=> triggerNode.parentNode"
style="width: 100%"
:tree-data="categoryTreeList"
:placeholder="$t('pleaseSelect')"
/>
</a-form-item>
</a-col>
<span style="float: right;overflow: hidden;margin-right: 11px" class="table-page-search-submitButtons">
<a-button style="margin-left: 8px" @click="searchResetOrgan">{{$t('reset')}}</a-button>
<a-button style="margin-left: 8px" type="primary" @click="searchQueryOrgan">{{$t('query')}}</a-button>
</span>
</a-row>
</a-form>
<a-form v-if="switchValue === 'user'" layout="inline" @keyup.enter.native="searchQueryUser">
<a-row :gutter="24">
<a-col :sm="6">
<a-form-item :label="$t('user.account')">
<a-input :placeholder="$t('pleaseEnter')"
v-model="queryParamUser.account"></a-input>
</a-form-item>
</a-col>
<a-col :sm="6">
<a-form-item :label="$t('userOrOrganSelect.name')">
<a-input :placeholder="$t('pleaseEnter')"
v-model="queryParamUser.realname"></a-input>
</a-form-item>
</a-col>
<a-col :sm="6">
<a-form-item :label="$t('user.workNo')">
<a-input :placeholder="$t('pleaseEnter')"
v-model="queryParamUser.workNo"></a-input>
</a-form-item>
</a-col>
<span style="float: right;overflow: hidden;margin-right: 11px" class="table-page-search-submitButtons">
<a-button style="margin-left: 8px" @click="searchResetUser">{{$t('reset')}}</a-button>
<a-button style="margin-left: 8px" type="primary" @click="searchQueryUser">{{$t('query')}}</a-button>
</span>
</a-row>
</a-form>
</div>
<div class="modal-content">
<div class="modal-content-left">
<div class="modal-content-title-div">
<p class="modal-content-title">选择</p>
<div class="table-operator-tab">
<a class="switch-item" :class="switchValue === 'organ' ? 'table-operator-tab-active' : ''"
@click="switchChange('organ')">组织机构
</a>
<a class="switch-item" :class="switchValue === 'user' ? 'table-operator-tab-active' : ''"
@click="switchChange('user')">用户列表
</a>
</div>
</div>
<a-table
v-if="switchValue === 'organ'"
:columns="columnsOrgan"
rowKey="id"
bordered
:scroll="{x: 500}"
:data-source="dataSourceOrgan"
:pagination="ipaginationOrgan"
:row-selection="{ selectedRowKeys: selectedRowKeysOrgan, onChange: onSelectChangeOrgan, getCheckboxProps: getCheckboxPropsOrgan }"
:loading="loadingLeft"
@change="organLeftTableChange">
</a-table>
<a-table
v-else-if="switchValue === 'user'"
:columns="columnsUser"
rowKey="id"
bordered
:scroll="{x: 500}"
:data-source="dataSourceUser"
:pagination="ipaginationUser"
:row-selection="{ selectedRowKeys: selectedRowKeysUser, onChange: onSelectChangeUser, getCheckboxProps: getCheckboxPropsUser }"
:loading="loadingLeft"
@change="userLeftTableChange">
</a-table>
</div>
<div class="modal-content-right">
<div class="modal-content-title-div">
<p class="modal-content-title">选择</p>
</div>
<a-table
v-if="switchValue === 'organ'"
:columns="columnsOrganRight"
rowKey="id"
bordered
:scroll="{x: 300}"
:loading="loadingRight"
:data-source="dataSourceOrganRight">
<template slot="action" slot-scope="text, record, index">
<a @click="handleDeleteOrgan(record, index)" >{{ $t('delete') }}</a>
</template>
</a-table>
<a-table
v-else-if="switchValue === 'user'"
:columns="columnsOrganRight"
rowKey="id"
bordered
:scroll="{x: 300}"
:loading="loadingRight"
:data-source="dataSourceOrganRight">
<template slot="action" slot-scope="text, record, index">
<a @click="handleDeleteOrgan(record, index)" >{{ $t('delete') }}</a>
</template>
</a-table>
</div>
</div>
</a-modal>
</template>
<script>
import '@assets/less/common.less'
import { getAction } from '@/api/manage'
export default {
name: 'UserOrganSelectModal',
props: {
selectType: {
type: String,
default: 'all'
},
value: {
type: Object,
default: () => {
return {
organ: '',
user: ''
}
}
}
},
watch: {
value: {
immediate: true,
handler (val) {
if (this.selectType === 'all') {
if (val.organ) {
this.loadOrganRight(val.organ, () => {
if (val.user) {
this.loadUserRight(val.user, () => {
this.$emit('change', this.dataSourceOrganRight, this.dataSourceUserRight)
})
} else {
this.$emit('change', this.dataSourceOrganRight, [])
}
})
} else {
this.loadUserRight(val.user, () => {
this.$emit('change', [], this.dataSourceUserRight)
})
}
} else if (this.selectType === 'organ') {
this.loadOrganRight(val.organ, () => {
this.$emit('change', this.dataSourceOrganRight)
})
} else if (this.selectType === 'user') {
this.loadUserRight(val.user, () => {
this.$emit('change', this.dataSourceUserRight)
})
}
}
}
},
data () {
return {
visible: false,
labelCol: {
sm: 4
},
wrapperCol: {
sm: 20
},
categoryTreeList: [], // 组织机构查询的组织机构树数据
switchValue: 'organ',
loadingLeft: false, // 左侧表的加载状态
loadingRight: false, // 右侧表的加载
// 组织机构左侧表相关数据
queryParamOrgan: {},
columnsOrgan: [
{
title: this.$t('organization'),
dataIndex: 'title',
align: 'center'
},
{
title: this.$t('userOrOrganSelect.secondLevel'),
dataIndex: 'secondLevel',
align: 'center'
},
{
title: this.$t('userOrOrganSelect.threeLevel'),
dataIndex: 'threeLevel',
align: 'center'
}
],
dataSourceOrgan: [],
selectedRowKeysOrgan: [],
selectedRowsOrgan: [],
ipaginationOrgan: {
current: 1,
pageSize: 5,
pageSizeOptions: ['5', '10', '20', '30'],
showTotal: (total, range) => {
return range[0] + '-' + range[1] + ' ' + this.$t('total') + ' ' + total + ' ' + this.$t('strip')
},
showQuickJumper: true,
showSizeChanger: true,
total: 0
},
columnsOrganRight: [
{
title: this.$t('organization'),
dataIndex: 'title',
align: 'center'
},
{
title: this.$t('operation'),
dataIndex: 'action',
scopedSlots: { customRender: 'action' },
align: 'center'
}
],
dataSourceOrganRight: [],
// 用户相关数据
queryParamUser: {},
columnsUser: [
{
title: this.$t('user.account'),
dataIndex: 'account',
align: 'center'
},
{
title: this.$t('userOrOrganSelect.name'),
dataIndex: 'name',
align: 'center'
},
{
title: this.$t('user.workNo'),
dataIndex: 'workNo',
align: 'center'
},
{
title: this.$t('role'),
dataIndex: 'role',
align: 'center'
},
{
title: this.$t('organization'),
dataIndex: 'organization',
align: 'center'
}
],
dataSourceUser: [],
selectedRowKeysUser: [],
selectedRowsUser: [],
ipaginationUser: {
current: 1,
pageSize: 5,
pageSizeOptions: ['5', '10', '20', '30'],
showTotal: (total, range) => {
return range[0] + '-' + range[1] + ' ' + this.$t('total') + ' ' + total + ' ' + this.$t('strip')
},
showQuickJumper: true,
showSizeChanger: true,
total: 0
},
columnsUserRight: [
{
title: this.$t('userOrOrganSelect.name'),
dataIndex: 'title',
align: 'center'
},
{
title: this.$t('operation'),
dataIndex: 'action',
scopedSlots: { customRender: 'action' },
align: 'center'
}
],
dataSourceUserRight: [],
url: {
organList: '',
userList: '/sys/user/page'
}
}
},
created () {
this.loadDataOrgan()
},
methods: {
open () {
this.visible = true
},
// switch改变
switchChange (value) {
this.switchValue = value
if (value === 'organ') {
this.loadDataOrgan()
} else {
this.loadDataUser()
}
},
/**
* 组织机构相关方法
*/
// 获取组织机构树
getSysCategoryTree () {
getAction(this.url.getSysCategoryTree, {}).then((res) => {
if (res.success) {
this.categoryTreeList = res.result
} else {
this.categoryTreeList = []
}
})
},
searchResetOrgan () {
this.queryParamOrgan = {}
this.loadDataOrgan()
},
searchQueryOrgan () {
this.loadDataOrgan()
},
// 获取组织机构左侧树列表
loadDataOrgan () {
const params = Object.assign({}, this.queryParamOrgan)
params.pageNo = this.ipaginationOrgan.current
params.pageSize = this.ipaginationOrgan.pageSize
this.loadingLeft = true
getAction(this.url.organList, params).then((res) => {
if (res.success) {
if (res.result.current > 1 && res.result.records.length === 0) {
this.ipaginationOrgan.current = res.result.current - 1
this.loadDataOrgan()
return
}
this.dataSourceOrgan = res.result.records || []
this.ipaginationOrgan.total = res.result.total
} else {
this.$message.warn(res.message)
}
}).finally(() => {
this.loadingLeft = false
})
},
// 组织机构左侧树的选择
onSelectChangeOrgan (selectedRowKeys, selectedRows) {
this.selectedRowKeysOrgan = selectedRows
this.selectedRowsOrgan = selectedRows
this.dataSourceOrganRight.map(selectedRows)
},
// 组织结构左侧树的复选框状态
getCheckboxPropsOrgan (record) {
return {
disabled: this.selectedRowKeysOrgan.includes(record.id)
}
},
// 组织机构左侧表格改变
organLeftTableChange (pagination) {
this.ipaginationOrganLeft = pagination
this.loadDataOrgan()
},
// 组织机构右侧表的删除
handleDeleteOrgan (record, index) {
this.dataSourceOrganRight.splice(index, 1)
this.selectedRowKeysOrgan = this.selectedRowKeysOrgan.filter(item => item === record.id)
},
// 组织机构初始化右侧树列表
loadOrganRight (ids, callback) {
this.loadingRight = true
getAction(this.url.organList, { ids: ids }).then((res) => {
if (res.success) {
this.dataSourceOrganRight = res.result.records || []
callback && callback()
} else {
this.$message.warn(res.message)
}
}).finally(() => {
this.loadingRight = false
})
},
/**
* 用户相关方法
*/
searchResetUser () {
this.queryParamUser = {}
this.loadDataUser()
},
searchQueryUser () {
this.loadDataUser()
},
// 获取用户左侧树列表
loadDataUser () {
const params = Object.assign({}, this.queryParamUser)
params.pageNo = this.ipaginationUser.current
params.pageSize = this.ipaginationUser.pageSize
this.loadingLeft = true
getAction(this.url.userList, params).then((res) => {
if (res.success) {
if (res.result.current > 1 && res.result.records.length === 0) {
this.ipaginationOrgan.current = res.result.current - 1
this.loadDataUser()
return
}
this.dataSourceUser = res.result.records || []
this.ipaginationUser.total = res.result.total
} else {
this.$message.warn(res.message)
}
}).finally(() => {
this.loadingLeft = false
})
},
// 用户左侧表的选择
onSelectChangeUser (selectedRowKeys, selectedRows) {
this.selectedRowKeysUser = selectedRows
this.selectedRowsUser = selectedRows
this.dataSourceUserRight.map(selectedRows)
},
// 用户左侧表的复选框状态
getCheckboxPropsUser (record) {
return {
disabled: this.selectedRowKeysUser.includes(record.id)
}
},
// 用户左侧表格改变
userLeftTableChange (pagination) {
this.ipaginationUserLeft = pagination
this.loadDataUser()
},
// 用户右侧表的删除
handleDeleteUser (record, index) {
this.dataSourceUserRight.splice(index, 1)
this.selectedRowKeysUser = this.selectedRowKeysUser.filter(item => item === record.id)
},
// 用户初始化右侧树列表
loadUserRight (ids, callback) {
this.loadingRight = true
getAction(this.url.userList, { ids: ids }).then((res) => {
if (res.success) {
this.dataSourceUserRight = res.result.records || []
callback && callback()
} else {
this.$message.warn(res.message)
}
}).finally(() => {
this.loadingRight = false
})
},
handleOk () {
if (this.selectType === 'all') {
this.$emit('change', this.dataSourceOrganRight, this.dataSourceUserRight)
} else if (this.selectType === 'organ') {
this.$emit('change', this.dataSourceOrganRight)
} else {
this.$emit('change', this.dataSourceUserRight)
}
},
handleCancel () {
this.close()
},
close () {
this.visible = false
this.dataSourceOrgan = []
this.dataSourceUser = []
this.dataSourceOrganRight = []
this.dataSourceUserRight = []
this.selectedRowKeysOrgan = []
this.selectedRowKeysUser = []
}
},
model: {
prop: 'value',
event: 'change'
}
}
</script>
<style scoped lang="less">
.modal-content {
width: 100%;
display: flex;
justify-content: space-between;
&-left {
width: 58%;
}
&-right {
width: 40%;
}
&-title-div {
display: flex;
align-items: center;
height: 28px;
margin: 20px 0;
.modal-content-title {
color: #1D2129;
font-weight: 500;
margin-right: 12px;
margin-bottom: 0;
}
}
}
</style>
+1 -1
View File
@@ -14,7 +14,7 @@
*/
export default {
primaryColor: '#1890FF', // primary color of ant design
primaryColor: '#D52C26', // primary color of ant design
navTheme: 'light', // theme for nav menu
layout: 'sidemenu', // nav menu position: sidemenu or topmenu
contentWidth: 'Fixed', // layout of content: Fluid or Fixed, only works when layout is topmenu
+3 -3
View File
@@ -67,9 +67,9 @@ export const ConfigurableTableMixin = {
this.getTableHeader()
this.loadData()
// 过滤没有权限的按钮
if (this.needFilterTableBtn) {
this.operationList = this.operationList.filter(item => isHasPermission(item.has))
}
// if (this.needFilterTableBtn) {
// this.operationList = this.operationList.filter(item => isHasPermission(item.has))
// }
},
methods: {
/**
+3 -11
View File
@@ -1,17 +1,15 @@
<template>
<div>
<a-button @click="previewFileByOnlyOffice('1693528070103957505')">打开预览onlyOffice</a-button>
<a-button @click="editFileByOnlyOffice('1693528070103957505')">打开编辑onlyOffice</a-button>
<j-upload />
<user-or-organ-selection></user-or-organ-selection>
</div>
</template>
<script>
import onlyOfficePreview from '@/common/onlyOffice/onlyOfficePreview'
import onlyOfficeEdit from '@/common/onlyOffice/onlyOfficeEdit'
import UserOrOrganSelection from '../../components/selection/UserOrOrganSelection'
export default {
name: 'Analysis',
components: { UserOrOrganSelection },
data () {
return {}
},
@@ -19,12 +17,6 @@ export default {
},
methods: {
previewFileByOnlyOffice (fileId) {
onlyOfficePreview(fileId, '文件名')
},
editFileByOnlyOffice (fileId) {
onlyOfficeEdit(fileId, '文件名')
}
}
}
</script>
+5 -1
View File
@@ -48,6 +48,7 @@
<div style="margin-top: 15px">
<a-table
:components="drag(columns,'columns')"
style="height:500px"
ref="table"
size="middle"
@@ -140,6 +141,7 @@
<a style="margin-left: 24px" @click="onClearSelected2">{{ $t('empty') }}</a>
</div>
<a-table
:components="drag(columns2,'columns2')"
style="height:500px"
ref="table2"
bordered
@@ -178,6 +180,7 @@
</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'
@@ -186,10 +189,11 @@ 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],
mixins: [JeroListMixin, ResizeHeader, ResizeColumnProvide],
components: {
UserRoleModal,
SelectUserModal,
+10 -10
View File
@@ -126,11 +126,10 @@
<a style="margin-left: 24px" @click="onClearSelected">{{ $t('empty') }}</a>
</div>
<a-table
:components="drag(columns,'columns')"
<j-table
:can-drag="true"
:scroll="{x: '100%'}"
ref="table"
bordered
size="middle"
rowKey="id"
:columns="columns"
@@ -140,13 +139,13 @@
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
@change="handleTableChange">
<template slot="avatarslot" slot-scope="text, record/* , index */">
<template v-slot:avatarslot="{text, record}">
<div class="anty-img-wrap">
<a-avatar shape="square" :src="getAvatarView(record.avatar)" icon="user"/>
</div>
</template>
<span slot="action" slot-scope="text, record">
<template v-slot:action="{text, record}">
<a @click="handleEdit(record)" >{{ $t('edit') }}</a>
<a-divider type="vertical" />
@@ -183,9 +182,9 @@
</a-menu-item>
</a-menu>
</a-dropdown>
</span>
</template>
</a-table>
</j-table>
</div>
<!-- table区域-end -->
@@ -204,6 +203,7 @@
</template>
<script>
import '@assets/less/common.less'
import RoleAssignment from './modules/RoleAssignment'
import UserModal from './modules/UserModal'
import PasswordModal from './modules/PasswordModal'
@@ -212,18 +212,19 @@ import { frozenBatch, queryall } from '@/api/api'
import { JeroListMixin } from '@/mixins/JeroListMixin'
import JInput from '@/components/jero/JInput'
import UserRecycleBinModal from './modules/UserRecycleBinModal'
import { ResizeHeader, ResizeColumnProvide } from '@/mixins/header'
import JTable from '@/components/jero/JTable'
import JSearchSelectTag from '@/components/dict/JSearchSelectTag'
export default {
name: 'UserList',
mixins: [JeroListMixin, ResizeHeader, ResizeColumnProvide],
mixins: [JeroListMixin],
components: {
RoleAssignment,
UserModal,
PasswordModal,
JInput,
UserRecycleBinModal,
JTable,
JSearchSelectTag
},
data () {
@@ -450,5 +451,4 @@ export default {
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>
+4 -4
View File
@@ -65,8 +65,8 @@ module.exports = {
less: {
modifyVars: {
/* less 变量覆盖,用于自定义 ant design 主题 */
'primary-color': '#1890FF',
'link-color': '#1890FF',
'primary-color': '#D52C26',
'link-color': '#D52C26',
'border-radius-base': '4px'
},
javascriptEnabled: true
@@ -75,7 +75,7 @@ module.exports = {
},
devServer: {
port: 23084,
port: 3334,
proxy: {
/* '/api': {
target: 'https://mock.ihx.me/mock/5baf3052f7da7e07e04a5116/antd-pro', //mock API接口系统
@@ -86,7 +86,7 @@ module.exports = {
}
}, */
'/laws-sinotruk': {
target: 'http://localhost:23085',
target: 'http://localhost:8184',
ws: false,
changeOrigin: true,
pathRewrite: {