Compare commits
11 Commits
addcompany
...
main
| Author | SHA1 | Date |
|---|---|---|
BianLzhaoMin
|
cfba3e278d | |
|
BianLzhaoMin
|
e07c237201 | |
|
BianLzhaoMin
|
1346c150fe | |
|
BianLzhaoMin
|
5f0f633adb | |
|
BianLzhaoMin
|
8852031f72 | |
|
BianLzhaoMin
|
bd1b55d4db | |
|
BianLzhaoMin
|
9b37f1a3fd | |
|
BianLzhaoMin
|
9704d0d055 | |
|
BianLzhaoMin
|
75787c5aac | |
 sxu
|
571c4fead2 | |
weiweiw
|
7d78be85eb |
|
|
@ -25,8 +25,14 @@ export const editCompanyAPI = (data) => {
|
|||
return request.post('/system/dept/edit', data)
|
||||
}
|
||||
/**
|
||||
* @data 编辑参数 编辑公司信息提交接口
|
||||
* @data 注销
|
||||
*/
|
||||
export const editDeptLogoutAPI = (data) => {
|
||||
return request.post('/system/dept/deptLogout', data)
|
||||
export const turnOnOffAPI = (data) => {
|
||||
return request.post('/system/dept/turnOnOff', data)
|
||||
}
|
||||
/**
|
||||
* @data 查询参数 获取地址信息
|
||||
*/
|
||||
export const getAddressListAPI = (data) => {
|
||||
return request.get('/system/address/list', { params: data })
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,33 @@
|
|||
import request from '@/utils/request'
|
||||
|
||||
/**
|
||||
* @data 新增权限模板参数 权限模板新增接口
|
||||
*/
|
||||
export const addTemplateAPI = (data) => {
|
||||
return request.post('/system/template', data)
|
||||
}
|
||||
/**
|
||||
* @data 修改权限模板参数 权限模板修改接口
|
||||
*/
|
||||
export const editTemplateAPI = (data) => {
|
||||
return request.post('/system/template/edit', data)
|
||||
}
|
||||
/**
|
||||
* @data 查询参数 权限模板列表接口
|
||||
*/
|
||||
export const getTemplateListAPI = (data) => {
|
||||
return request.get(`/system/template/list`, { params: data })
|
||||
}
|
||||
/**
|
||||
* @data 删除参数 权限模板删除接口
|
||||
* @ids 参数
|
||||
*/
|
||||
export const deleteTemplateAPI = (data) => {
|
||||
return request.post('/system/template/delete/' + data)
|
||||
}
|
||||
/**
|
||||
* @data 删除参数 查询权限模板详情
|
||||
*/
|
||||
export const getTemplateMenuTreeselectAPI = (id) => {
|
||||
return request.get(`/system/template/templateMenuTreeselect/${id}`)
|
||||
}
|
||||
|
|
@ -2,7 +2,7 @@
|
|||
<!-- 新增修改弹框 -->
|
||||
<div>
|
||||
<el-dialog
|
||||
width="50%"
|
||||
width="55%"
|
||||
:title="dialogTitle"
|
||||
:visible.sync="dialogVisible"
|
||||
:before-close="handleClose"
|
||||
|
|
@ -19,6 +19,76 @@
|
|||
<el-form-item label="公司名称：" prop="deptName">
|
||||
<el-input v-model="addOrEditForm.deptName" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="公司地址：" prop="province">
|
||||
<el-row>
|
||||
<el-col :span="6">
|
||||
<el-form-item prop="province">
|
||||
<el-select
|
||||
filterable
|
||||
clearable
|
||||
placeholder="请选择所在省"
|
||||
@change="onChangeProvince"
|
||||
v-model="addOrEditForm.province"
|
||||
style="width: 95%"
|
||||
>
|
||||
<el-option
|
||||
:key="item.code"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
v-for="item in provinceList"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item prop="city">
|
||||
<el-select
|
||||
filterable
|
||||
clearable
|
||||
placeholder="请选择所在市"
|
||||
@change="onChangeCity"
|
||||
v-model="addOrEditForm.city"
|
||||
style="width: 95%"
|
||||
>
|
||||
<el-option
|
||||
:key="item.code"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
v-for="item in cityList"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item prop="district">
|
||||
<el-select
|
||||
filterable
|
||||
clearable
|
||||
placeholder="请选择所在区/县"
|
||||
v-model="addOrEditForm.district"
|
||||
style="width: 95%"
|
||||
>
|
||||
<el-option
|
||||
:key="item.code"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
v-for="item in areaList"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item prop="address">
|
||||
<el-input
|
||||
clearable
|
||||
style="width: 95%"
|
||||
placeholder="请输入详细地址"
|
||||
v-model="addOrEditForm.address"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
<el-form-item label="公司简称：" prop="deptAbbreviation">
|
||||
<el-input
|
||||
v-model="addOrEditForm.deptAbbreviation"
|
||||
|
|
@ -41,12 +111,12 @@
|
|||
<el-radio-group v-model="addOrEditForm.status">
|
||||
<el-radio label="0"> 启用 </el-radio>
|
||||
<el-radio label="1"> 停用 </el-radio>
|
||||
<el-radio label="2"> 注销 </el-radio>
|
||||
<!-- <el-radio label="2"> 注销 </el-radio> -->
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<TitleTip :titleText="`基础设置`" />
|
||||
<el-form-item label="默认密码：" prop="password">
|
||||
<el-input v-model="addOrEditForm.password" clearable />
|
||||
<!-- <TitleTip :titleText="`基础设置`" /> -->
|
||||
<el-form-item label="默认密码：" prop="initPassword">
|
||||
<el-input v-model="addOrEditForm.initPassword" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="LOGO设置：" prop="logo">
|
||||
<div class="upload-container" v-if="formType != 1">
|
||||
|
|
@ -68,8 +138,8 @@
|
|||
<div>
|
||||
1、上传图片文件格式仅支持SVG； <br />
|
||||
2、LOGO图片大小不超过3MB,尺寸100px * 100px； <br />
|
||||
3、收集客户的logo请UI设计完成海购添加； <br />
|
||||
4、默认智慧工地LOGO。
|
||||
3、收集客户的logo请UI设计完成后添加； <br />
|
||||
4、默认公司LOGO。
|
||||
<a @click="onDefaultLogo()"> >> 恢复默认 </a>
|
||||
<br />
|
||||
</div>
|
||||
|
|
@ -103,10 +173,26 @@
|
|||
</template>
|
||||
<el-input v-model="addOrEditForm.phonenumber" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="权限模板：" prop="menuTemplateId">
|
||||
<el-select
|
||||
filterable
|
||||
clearable
|
||||
placeholder="请选择权限模板"
|
||||
v-model="addOrEditForm.menuTemplateId"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-option
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
v-for="item in templateList"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="角色：" prop="roles">
|
||||
<el-input disabled v-model="addOrEditForm.roles" />
|
||||
</el-form-item>
|
||||
<el-form-item class="handle">
|
||||
<el-form-item class="handle" v-if="formType !== 1">
|
||||
<el-button
|
||||
@click="
|
||||
() => {
|
||||
|
|
@ -144,9 +230,11 @@
|
|||
<script>
|
||||
import {
|
||||
addCompanyAPI,
|
||||
getDeptDetailsAPI,
|
||||
editCompanyAPI,
|
||||
getDeptDetailsAPI,
|
||||
getAddressListAPI,
|
||||
} from '@/api/company-manage/index.js'
|
||||
import { getTemplateListAPI } from '@/api/permission-template/index.js'
|
||||
import { validateNewPassword } from '@/utils/validate'
|
||||
import { getToken } from '@/utils/auth'
|
||||
export default {
|
||||
|
|
@ -170,6 +258,10 @@ export default {
|
|||
uploadFileUrl: process.env.VUE_APP_BASE_API + '/file/upload',
|
||||
fileType: ['svg'],
|
||||
dialogInnerVisible: false,
|
||||
provinceList: [],
|
||||
cityList: [],
|
||||
areaList: [],
|
||||
templateList: [],
|
||||
previewUrl: '',
|
||||
headers: {
|
||||
Authorization: 'Bearer ' + getToken(),
|
||||
|
|
@ -179,15 +271,20 @@ export default {
|
|||
deptName: '',
|
||||
deptAbbreviation: '',
|
||||
remark: '',
|
||||
password: '',
|
||||
initPassword: '',
|
||||
logo: '',
|
||||
nickName: '',
|
||||
phonenumber: '',
|
||||
userName: '',
|
||||
orderNum: 200,
|
||||
orderNum: 999,
|
||||
fileList: [],
|
||||
status: '',
|
||||
roles: '系统管理员',
|
||||
roles: '公司管理员',
|
||||
province: '',
|
||||
city: '',
|
||||
district: '',
|
||||
address: '',
|
||||
menuTemplateId: '',
|
||||
},
|
||||
addOrEditFormRef: {
|
||||
deptName: [
|
||||
|
|
@ -236,7 +333,7 @@ export default {
|
|||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
password: [
|
||||
initPassword: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入默认密码',
|
||||
|
|
@ -283,6 +380,41 @@ export default {
|
|||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
province: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择省',
|
||||
trigger: 'change',
|
||||
},
|
||||
],
|
||||
city: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择市',
|
||||
trigger: 'change',
|
||||
},
|
||||
],
|
||||
district: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择区/县',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
address: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入详细地址',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
menuTemplateId: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择权限模板',
|
||||
trigger: 'change',
|
||||
},
|
||||
],
|
||||
},
|
||||
}
|
||||
},
|
||||
|
|
@ -306,6 +438,7 @@ export default {
|
|||
this.$refs.addOrEditFormRef.resetFields()
|
||||
this.$emit('update:formDialogVisible', false)
|
||||
},
|
||||
// 表单提交
|
||||
onSubmitForm() {
|
||||
this.$refs.addOrEditFormRef.validate(async (valid) => {
|
||||
if (valid) {
|
||||
|
|
@ -313,7 +446,7 @@ export default {
|
|||
deptName,
|
||||
deptAbbreviation,
|
||||
remark,
|
||||
password,
|
||||
initPassword,
|
||||
logo,
|
||||
nickName,
|
||||
phonenumber,
|
||||
|
|
@ -321,18 +454,29 @@ export default {
|
|||
parentId,
|
||||
userId,
|
||||
status,
|
||||
province,
|
||||
city,
|
||||
district,
|
||||
address,
|
||||
menuTemplateId,
|
||||
roleId,
|
||||
} = this.addOrEditForm
|
||||
const params = {
|
||||
deptName,
|
||||
deptAbbreviation,
|
||||
remark,
|
||||
logo,
|
||||
initPassword,
|
||||
orderNum: 200,
|
||||
province,
|
||||
city,
|
||||
district,
|
||||
address,
|
||||
menuTemplateId,
|
||||
sysUser: {
|
||||
nickName,
|
||||
phonenumber,
|
||||
userName: phonenumber,
|
||||
password,
|
||||
},
|
||||
}
|
||||
|
||||
|
|
@ -341,6 +485,7 @@ export default {
|
|||
params.status = status
|
||||
params.parentId = parentId
|
||||
params.sysUser.userId = userId
|
||||
params.sysUser.roleId = roleId
|
||||
}
|
||||
const SEND_FUN =
|
||||
this.formType == 2 ? editCompanyAPI : addCompanyAPI
|
||||
|
|
@ -374,17 +519,19 @@ export default {
|
|||
}
|
||||
this.$modal.loading('图片正在上传，请稍候...')
|
||||
},
|
||||
// 移除
|
||||
handleRemove(file) {
|
||||
this.addOrEditForm.fileList = this.addOrEditForm.fileList.filter(
|
||||
(item) => item.uid !== file.uid,
|
||||
)
|
||||
this.addOrEditForm.logo = ''
|
||||
},
|
||||
// 预览 LOGO
|
||||
handlePreview(file) {
|
||||
this.dialogInnerVisible = true
|
||||
this.previewUrl = file.url
|
||||
},
|
||||
|
||||
// 上传成功
|
||||
handleSuccess(res) {
|
||||
if (res.code === 200) {
|
||||
this.addOrEditForm.logo = res.data.url
|
||||
|
|
@ -394,11 +541,12 @@ export default {
|
|||
}
|
||||
this.$modal.closeLoading()
|
||||
},
|
||||
// 详情时预览 LOGO
|
||||
onViewLogoImg(url) {
|
||||
this.dialogInnerVisible = true
|
||||
this.previewUrl = url
|
||||
},
|
||||
|
||||
// 设置默认LOGO
|
||||
onDefaultLogo() {
|
||||
this.addOrEditForm.fileList = [
|
||||
{
|
||||
|
|
@ -408,14 +556,42 @@ export default {
|
|||
this.addOrEditForm.logo =
|
||||
'http://36.33.26.201:17788/statics/2025/01/03/logo_20250103151123A002.svg'
|
||||
},
|
||||
// 文件个数超出
|
||||
// 文件个数超出限制
|
||||
handleExceed() {
|
||||
this.$modal.msgError(`上传的LOGO数量不能超过 1 个`)
|
||||
},
|
||||
|
||||
// 获取地址
|
||||
async getAddressListData(parentCode = 0) {
|
||||
const { data: res } = await getAddressListAPI({ parentCode })
|
||||
return res
|
||||
},
|
||||
// 获取省
|
||||
async getProvinceData() {
|
||||
this.provinceList = await this.getAddressListData()
|
||||
},
|
||||
// 省change事件
|
||||
async onChangeProvince(val) {
|
||||
this.cityList = await this.getAddressListData(val)
|
||||
},
|
||||
// 市change事件
|
||||
async onChangeCity(val) {
|
||||
this.areaList = await this.getAddressListData(val)
|
||||
},
|
||||
|
||||
async getTemplateListData() {
|
||||
const { rows: res } = await getTemplateListAPI({
|
||||
pageNum: 1,
|
||||
pageSize: 9999,
|
||||
})
|
||||
this.templateList = res
|
||||
console.log(res, '模板列表')
|
||||
},
|
||||
},
|
||||
async mounted() {
|
||||
this.getProvinceData()
|
||||
this.getTemplateListData()
|
||||
if (this.formType === 1 || this.formType === 2) {
|
||||
// console.log(this.detailsId, 'detailsId')
|
||||
const { data: res } = await getDeptDetailsAPI(this.detailsId)
|
||||
const {
|
||||
deptName,
|
||||
|
|
@ -423,12 +599,21 @@ export default {
|
|||
remark,
|
||||
deptId,
|
||||
logo,
|
||||
initPassword,
|
||||
parentId,
|
||||
sysUser,
|
||||
status,
|
||||
province,
|
||||
city,
|
||||
district,
|
||||
address,
|
||||
menuTemplateId,
|
||||
} = res
|
||||
|
||||
const { userName, password, nickName, userId } = sysUser
|
||||
this.cityList = await this.getAddressListData(province)
|
||||
this.areaList = await this.getAddressListData(city)
|
||||
|
||||
const { userName, nickName, userId, roleId } = sysUser
|
||||
Object.assign(this.addOrEditForm, {
|
||||
deptName,
|
||||
deptAbbreviation,
|
||||
|
|
@ -436,18 +621,24 @@ export default {
|
|||
deptId,
|
||||
userId,
|
||||
logo,
|
||||
initPassword,
|
||||
parentId,
|
||||
phonenumber: userName,
|
||||
userName,
|
||||
password,
|
||||
nickName,
|
||||
status,
|
||||
province,
|
||||
city,
|
||||
district,
|
||||
address,
|
||||
menuTemplateId,
|
||||
roleId,
|
||||
fileList: [{ url: logo }],
|
||||
})
|
||||
}
|
||||
if (this.formType === 3) {
|
||||
this.getConfigKey('sys.user.initPassword').then((res) => {
|
||||
this.addOrEditForm.password = res.msg
|
||||
this.addOrEditForm.initPassword = res.msg
|
||||
})
|
||||
}
|
||||
},
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<div>
|
||||
<el-avatar size="large" :src="companyInfo.logo" />
|
||||
</div>
|
||||
<div style="flex: 1; padding-left: 14px">
|
||||
<div style="flex: 1; padding-left: 14px; width: 100%">
|
||||
<div class="company-title">
|
||||
<div> {{ companyInfo.deptName }} </div>
|
||||
<el-tag
|
||||
|
|
@ -33,7 +33,9 @@
|
|||
</el-tag>
|
||||
</div>
|
||||
|
||||
<p class="company-remark"> {{ companyInfo.remark }} </p>
|
||||
<p class="company-remark">
|
||||
<span> {{ companyInfo.remark }}</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -44,7 +46,7 @@
|
|||
v-for="(item, index) in userList"
|
||||
>
|
||||
<div>{{ item.title_name }}</div>
|
||||
<div>{{ item.count }}</div>
|
||||
<div>{{ companyInfo[item.count] || 0 }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="items-card">
|
||||
|
|
@ -60,6 +62,7 @@
|
|||
<el-button
|
||||
type="text"
|
||||
icon="el-icon-chat-dot-round"
|
||||
v-if="companyInfo.delFlag == 0"
|
||||
@click="onClickButton(1)"
|
||||
>
|
||||
详情
|
||||
|
|
@ -68,23 +71,28 @@
|
|||
type="text"
|
||||
icon="el-icon-edit"
|
||||
@click="onClickButton(2)"
|
||||
v-if="companyInfo.delFlag == 0"
|
||||
>
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
:style="{
|
||||
color: companyInfo.delFlag == 0 ? '#409EFF' : '#999',
|
||||
}"
|
||||
:icon="
|
||||
companyInfo.delFlag == 0 ? 'el-icon-delete' : 'el-icon-back'
|
||||
"
|
||||
@click="onClickButton(3)"
|
||||
v-if="companyInfo.status != 2"
|
||||
>
|
||||
注销
|
||||
{{ companyInfo.delFlag == 0 ? '注销' : '撤回注销' }}
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { editDeptLogoutAPI } from '@/api/company-manage/index.js'
|
||||
import { turnOnOffAPI } from '@/api/company-manage/index.js'
|
||||
export default {
|
||||
props: {
|
||||
companyInfo: {
|
||||
|
|
@ -95,7 +103,7 @@ export default {
|
|||
data() {
|
||||
return {
|
||||
userList: [
|
||||
{ title_name: '用户', count: 0 },
|
||||
{ title_name: '用户', count: 'userCount' },
|
||||
{ title_name: '项目', count: 0 },
|
||||
{ title_name: '设备', count: 0 },
|
||||
],
|
||||
|
|
@ -124,23 +132,27 @@ export default {
|
|||
if (type === 1 || type === 2) {
|
||||
this.$emit('openAddForm', type, this.companyInfo.deptId)
|
||||
} else {
|
||||
if (this.companyInfo.status == 2) {
|
||||
this.$modal.msgError('该公司已注销，无法重复注销')
|
||||
return
|
||||
}
|
||||
this.$modal
|
||||
.confirm('是否确认注销')
|
||||
.confirm(
|
||||
`是否确认${
|
||||
this.companyInfo.delFlag == 0 ? '注销' : '撤回注销'
|
||||
}`,
|
||||
)
|
||||
.then(async () => {
|
||||
// 组装参数
|
||||
const { deptId, deptName, orderNum } = this.companyInfo
|
||||
const { deptId, deptName, orderNum, delFlag } =
|
||||
this.companyInfo
|
||||
const params = {
|
||||
deptId,
|
||||
deptName,
|
||||
orderNum,
|
||||
delFlag: delFlag == 0 ? 2 : 0,
|
||||
}
|
||||
const res = await editDeptLogoutAPI(params)
|
||||
const res = await turnOnOffAPI(params)
|
||||
if (res.code === 200) {
|
||||
this.$modal.msgSuccess('注销成功')
|
||||
this.$modal.msgSuccess(
|
||||
`${delFlag == 0 ? '注销成功' : '已撤回注销'}`,
|
||||
)
|
||||
this.$emit('updateTableList')
|
||||
}
|
||||
})
|
||||
|
|
@ -156,14 +168,15 @@ export default {
|
|||
padding: 12px 10px;
|
||||
border-radius: 6px;
|
||||
background-color: #f7f8fc;
|
||||
min-height: 220px;
|
||||
max-height: 220px;
|
||||
min-height: 260px;
|
||||
max-height: 260px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
.company-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
|
||||
.company-title {
|
||||
width: 100%;
|
||||
|
|
@ -176,6 +189,7 @@ export default {
|
|||
overflow: hidden;
|
||||
-webkit-line-clamp: 1;
|
||||
text-overflow: ellipsis;
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -190,6 +204,7 @@ export default {
|
|||
overflow: hidden;
|
||||
-webkit-line-clamp: 2;
|
||||
text-overflow: ellipsis;
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
.items-card {
|
||||
|
|
|
|||
|
|
@ -113,12 +113,12 @@ export default {
|
|||
flex-wrap: wrap;
|
||||
overflow-y: auto;
|
||||
.company-items {
|
||||
width: calc((100% - 30px) / 3);
|
||||
width: calc((100% - 60px) / 5);
|
||||
margin-right: 15px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
& .company-items:nth-child(3n) {
|
||||
& .company-items:nth-child(5n) {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,629 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
<el-form
|
||||
:model="queryParams"
|
||||
ref="queryForm"
|
||||
size="small"
|
||||
:inline="true"
|
||||
v-show="showSearch"
|
||||
>
|
||||
<el-form-item label="模板名称" prop="name">
|
||||
<el-input
|
||||
v-model="queryParams.name"
|
||||
placeholder="请输入模板名称"
|
||||
clearable
|
||||
style="width: 240px"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
size="mini"
|
||||
@click="handleQuery"
|
||||
>搜索</el-button
|
||||
>
|
||||
<el-button
|
||||
icon="el-icon-refresh"
|
||||
size="mini"
|
||||
@click="resetQuery"
|
||||
>重置</el-button
|
||||
>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
v-hasPermi="['system:role:add']"
|
||||
>新增
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="handleDelete(null, 0)"
|
||||
v-hasPermi="['system:role:remove']"
|
||||
>删除
|
||||
</el-button>
|
||||
</el-col>
|
||||
|
||||
<right-toolbar
|
||||
:showSearch.sync="showSearch"
|
||||
@queryTable="getList"
|
||||
></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table
|
||||
v-loading="loading"
|
||||
:data="roleList"
|
||||
@selection-change="handleSelectionChange"
|
||||
:selectable="checkSelectable"
|
||||
:row-class-name="getRowClassName"
|
||||
class="app-content"
|
||||
>
|
||||
<el-table-column type="selection" min-width="55" align="center" />
|
||||
<el-table-column
|
||||
label="模板ID"
|
||||
align="center"
|
||||
prop="id"
|
||||
width="55"
|
||||
:show-overflow-tooltip="true"
|
||||
/>
|
||||
<el-table-column
|
||||
label="模板名称"
|
||||
align="center"
|
||||
prop="name"
|
||||
:show-overflow-tooltip="true"
|
||||
/>
|
||||
|
||||
<el-table-column
|
||||
label="备注"
|
||||
align="center"
|
||||
prop="remark"
|
||||
width="180"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" width="140">
|
||||
<template
|
||||
slot-scope="scope"
|
||||
v-if="scope.row.roleId !== 1 && scope.row.isBuiltIn !== '0'"
|
||||
>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit"
|
||||
@click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['system:role:edit']"
|
||||
>修改
|
||||
</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row, 1)"
|
||||
v-hasPermi="['system:role:remove']"
|
||||
>删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
|
||||
<!-- 添加或修改角色配置对话框 -->
|
||||
<el-dialog
|
||||
:title="title"
|
||||
:visible.sync="open"
|
||||
width="500px"
|
||||
append-to-body
|
||||
>
|
||||
<el-form
|
||||
ref="form"
|
||||
:model="form"
|
||||
:rules="rules"
|
||||
label-width="100px"
|
||||
>
|
||||
<el-form-item label="模板名称" prop="name">
|
||||
<el-input
|
||||
v-model="form.name"
|
||||
placeholder="请输入模板名称"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="菜单权限" prop="menuIds">
|
||||
<el-checkbox
|
||||
v-model="menuExpand"
|
||||
@change="handleCheckedTreeExpand($event, 'menu')"
|
||||
>展开/折叠</el-checkbox
|
||||
>
|
||||
<el-checkbox
|
||||
v-model="menuNodeAll"
|
||||
@change="handleCheckedTreeNodeAll($event, 'menu')"
|
||||
>全选/全不选
|
||||
</el-checkbox>
|
||||
<el-checkbox
|
||||
v-model="form.menuCheckStrictly"
|
||||
@change="handleCheckedTreeConnect($event, 'menu')"
|
||||
>父子联动
|
||||
</el-checkbox>
|
||||
<el-tree
|
||||
class="tree-border"
|
||||
:data="menuOptions"
|
||||
show-checkbox
|
||||
ref="menu"
|
||||
node-key="id"
|
||||
:check-strictly="!form.menuCheckStrictly"
|
||||
empty-text="加载中，请稍候"
|
||||
:props="defaultProps"
|
||||
></el-tree>
|
||||
</el-form-item>
|
||||
<el-form-item label="备注">
|
||||
<el-input
|
||||
v-model="form.remark"
|
||||
type="textarea"
|
||||
placeholder="请输入内容"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
listRole,
|
||||
getRole,
|
||||
delRole,
|
||||
addRole,
|
||||
updateRole,
|
||||
dataScope,
|
||||
changeRoleStatus,
|
||||
deptTreeSelect,
|
||||
} from '@/api/system/role'
|
||||
import {
|
||||
addTemplateAPI,
|
||||
getTemplateListAPI,
|
||||
getTemplateMenuTreeselectAPI,
|
||||
editTemplateAPI,
|
||||
deleteTemplateAPI,
|
||||
} from '@/api/permission-template/index.js'
|
||||
import {
|
||||
treeselect as menuTreeselect,
|
||||
roleMenuTreeselect,
|
||||
} from '@/api/system/menu'
|
||||
|
||||
export default {
|
||||
name: 'Role',
|
||||
dicts: ['sys_normal_disable'],
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 角色表格数据
|
||||
roleList: [],
|
||||
// 弹出层标题
|
||||
title: '',
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 是否显示弹出层（数据权限）
|
||||
openDataScope: false,
|
||||
menuExpand: false,
|
||||
menuNodeAll: false,
|
||||
deptExpand: true,
|
||||
deptNodeAll: false,
|
||||
// 日期范围
|
||||
dateRange: [],
|
||||
// 数据范围选项
|
||||
dataScopeOptions: [
|
||||
{
|
||||
value: '1',
|
||||
label: '全部数据权限',
|
||||
},
|
||||
{
|
||||
value: '2',
|
||||
label: '自定数据权限',
|
||||
},
|
||||
{
|
||||
value: '3',
|
||||
label: '本部门数据权限',
|
||||
},
|
||||
{
|
||||
value: '4',
|
||||
label: '本部门及以下数据权限',
|
||||
},
|
||||
{
|
||||
value: '5',
|
||||
label: '仅本人数据权限',
|
||||
},
|
||||
],
|
||||
// 菜单列表
|
||||
menuOptions: [],
|
||||
// 部门列表
|
||||
deptOptions: [],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
name: '',
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
defaultProps: {
|
||||
children: 'children',
|
||||
label: 'label',
|
||||
},
|
||||
// 表单校验
|
||||
rules: {
|
||||
name: [
|
||||
{
|
||||
required: true,
|
||||
message: '模板名称不能为空',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
menuIds: [
|
||||
{
|
||||
required: true,
|
||||
message: '菜单权限不能为空',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
},
|
||||
editId: '',
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
/** 查询角色列表 */
|
||||
async getList() {
|
||||
this.loading = true
|
||||
// listRole(this.addDateRange(this.queryParams, this.dateRange)).then(
|
||||
// (response) => {
|
||||
// this.roleList = response.rows
|
||||
// this.total = response.total
|
||||
// this.loading = false
|
||||
// },
|
||||
// )
|
||||
|
||||
const res = await getTemplateListAPI(this.queryParams)
|
||||
this.roleList = res.rows
|
||||
this.total = res.total
|
||||
this.loading = false
|
||||
},
|
||||
/** 查询菜单树结构 */
|
||||
getMenuTreeselect() {
|
||||
menuTreeselect().then((response) => {
|
||||
this.menuOptions = response.data
|
||||
})
|
||||
},
|
||||
// 所有菜单节点数据
|
||||
getMenuAllCheckedKeys() {
|
||||
// 目前被选中的菜单节点
|
||||
let checkedKeys = this.$refs.menu.getCheckedKeys()
|
||||
// 半选中的菜单节点
|
||||
let halfCheckedKeys = this.$refs.menu.getHalfCheckedKeys()
|
||||
checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys)
|
||||
return checkedKeys
|
||||
},
|
||||
// 所有部门节点数据
|
||||
getDeptAllCheckedKeys() {
|
||||
// 目前被选中的部门节点
|
||||
let checkedKeys = this.$refs.dept.getCheckedKeys()
|
||||
// 半选中的部门节点
|
||||
let halfCheckedKeys = this.$refs.dept.getHalfCheckedKeys()
|
||||
checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys)
|
||||
return checkedKeys
|
||||
},
|
||||
/** 根据角色ID查询菜单树结构 */
|
||||
getRoleMenuTreeselect(tempId) {
|
||||
return getTemplateMenuTreeselectAPI(tempId).then((response) => {
|
||||
this.menuOptions = response.menus
|
||||
return response
|
||||
})
|
||||
},
|
||||
/** 根据角色ID查询部门树结构 */
|
||||
getDeptTree(roleId) {
|
||||
return deptTreeSelect(roleId).then((response) => {
|
||||
this.deptOptions = response.depts
|
||||
return response
|
||||
})
|
||||
},
|
||||
// 角色状态修改
|
||||
handleStatusChange(row) {
|
||||
let text = row.status === '0' ? '启用' : '停用'
|
||||
this.$modal
|
||||
.confirm('确认要"' + text + '""' + row.roleName + '"角色吗？')
|
||||
.then(function () {
|
||||
return changeRoleStatus(row.roleId, row.status)
|
||||
})
|
||||
.then(() => {
|
||||
this.$modal.msgSuccess(text + '成功')
|
||||
})
|
||||
.catch(function () {
|
||||
row.status = row.status === '0' ? '1' : '0'
|
||||
})
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false
|
||||
this.reset()
|
||||
},
|
||||
// 取消按钮（数据权限）
|
||||
cancelDataScope() {
|
||||
this.openDataScope = false
|
||||
this.reset()
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
if (this.$refs.menu != undefined) {
|
||||
this.$refs.menu.setCheckedKeys([])
|
||||
}
|
||||
;(this.menuExpand = false),
|
||||
(this.menuNodeAll = false),
|
||||
(this.deptExpand = true),
|
||||
(this.deptNodeAll = false),
|
||||
(this.form = {
|
||||
name: undefined,
|
||||
menuIds: [],
|
||||
remark: undefined,
|
||||
})
|
||||
this.resetForm('form')
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1
|
||||
this.getList()
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.dateRange = []
|
||||
this.resetForm('queryForm')
|
||||
this.handleQuery()
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
// 过滤掉不可选的行（虽然界面上不可选，但为了安全起见还是过滤一次）
|
||||
const validSelection = selection.filter((row) =>
|
||||
this.checkSelectable(row),
|
||||
)
|
||||
|
||||
// 更新选中的roleId数组
|
||||
this.ids = validSelection.map((item) => item.id)
|
||||
// 更新单选和多选状态
|
||||
this.single = validSelection.length !== 1
|
||||
this.multiple = !validSelection.length
|
||||
},
|
||||
// 更多操作触发
|
||||
handleCommand(command, row) {
|
||||
switch (command) {
|
||||
case 'handleDataScope':
|
||||
this.handleDataScope(row)
|
||||
break
|
||||
case 'handleAuthUser':
|
||||
this.handleAuthUser(row)
|
||||
break
|
||||
default:
|
||||
break
|
||||
}
|
||||
},
|
||||
// 树权限（展开/折叠）
|
||||
handleCheckedTreeExpand(value, type) {
|
||||
if (type == 'menu') {
|
||||
let treeList = this.menuOptions
|
||||
for (let i = 0; i < treeList.length; i++) {
|
||||
this.$refs.menu.store.nodesMap[treeList[i].id].expanded =
|
||||
value
|
||||
}
|
||||
} else if (type == 'dept') {
|
||||
let treeList = this.deptOptions
|
||||
for (let i = 0; i < treeList.length; i++) {
|
||||
this.$refs.dept.store.nodesMap[treeList[i].id].expanded =
|
||||
value
|
||||
}
|
||||
}
|
||||
},
|
||||
// 树权限（全选/全不选）
|
||||
handleCheckedTreeNodeAll(value, type) {
|
||||
if (type == 'menu') {
|
||||
this.$refs.menu.setCheckedNodes(value ? this.menuOptions : [])
|
||||
} else if (type == 'dept') {
|
||||
this.$refs.dept.setCheckedNodes(value ? this.deptOptions : [])
|
||||
}
|
||||
},
|
||||
// 树权限（父子联动）
|
||||
handleCheckedTreeConnect(value, type) {
|
||||
if (type == 'menu') {
|
||||
this.form.menuCheckStrictly = value ? true : false
|
||||
} else if (type == 'dept') {
|
||||
this.form.deptCheckStrictly = value ? true : false
|
||||
}
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset()
|
||||
this.getMenuTreeselect()
|
||||
this.open = true
|
||||
this.title = '添加权限模板'
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset()
|
||||
this.title = '修改权限模板'
|
||||
this.open = true
|
||||
this.form.name = row.name
|
||||
this.form.remark = row.remark
|
||||
this.editId = row.id
|
||||
// const roleId = row.roleId || this.ids
|
||||
const roleMenu = this.getRoleMenuTreeselect(row.id)
|
||||
this.$nextTick(() => {
|
||||
roleMenu.then((res) => {
|
||||
let checkedKeys = res.checkedKeys
|
||||
checkedKeys.forEach((v) => {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.menu.setChecked(v, true, false)
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
},
|
||||
/** 选择角色权限范围触发 */
|
||||
dataScopeSelectChange(value) {
|
||||
if (value !== '2') {
|
||||
this.$refs.dept.setCheckedKeys([])
|
||||
}
|
||||
},
|
||||
/** 分配数据权限操作 */
|
||||
handleDataScope(row) {
|
||||
this.reset()
|
||||
const deptTreeSelect = this.getDeptTree(row.roleId)
|
||||
getRole(row.roleId).then((response) => {
|
||||
this.form = response.data
|
||||
this.openDataScope = true
|
||||
this.$nextTick(() => {
|
||||
deptTreeSelect.then((res) => {
|
||||
this.$refs.dept.setCheckedKeys(res.checkedKeys)
|
||||
})
|
||||
})
|
||||
this.title = '分配数据权限'
|
||||
})
|
||||
},
|
||||
/** 分配用户操作 */
|
||||
handleAuthUser: function (row) {
|
||||
const roleId = row.roleId
|
||||
this.$router.push('/system/role-auth/user/' + roleId)
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm: function () {
|
||||
this.form.menuIds = this.getMenuAllCheckedKeys()
|
||||
this.$refs['form'].validate((valid) => {
|
||||
if (valid) {
|
||||
if (this.title === '修改权限模板') {
|
||||
// this.form.menuIds = this.getMenuAllCheckedKeys()
|
||||
const { name, remark, menuIds } = this.form
|
||||
const params = {
|
||||
id: this.editId,
|
||||
name,
|
||||
remark,
|
||||
menuIds,
|
||||
}
|
||||
editTemplateAPI(params).then((response) => {
|
||||
this.$modal.msgSuccess('修改成功')
|
||||
this.open = false
|
||||
this.getList()
|
||||
})
|
||||
} else {
|
||||
addTemplateAPI(this.form).then((response) => {
|
||||
this.$modal.msgSuccess('新增成功')
|
||||
this.open = false
|
||||
this.getList()
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
/** 提交按钮（数据权限） */
|
||||
submitDataScope: function () {
|
||||
if (this.form.roleId != undefined) {
|
||||
this.form.deptIds = this.getDeptAllCheckedKeys()
|
||||
dataScope(this.form).then((response) => {
|
||||
this.$modal.msgSuccess('修改成功')
|
||||
this.openDataScope = false
|
||||
this.getList()
|
||||
})
|
||||
}
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row, type) {
|
||||
if (!row && this.ids.length < 1) {
|
||||
this.$modal.msgError('请勾选需要删除的模板')
|
||||
return
|
||||
}
|
||||
const roleIds = type === 0 ? this.ids : row.id
|
||||
this.$modal
|
||||
.confirm('是否确认删除权限模板？')
|
||||
.then(async () => {
|
||||
const res = await deleteTemplateAPI(roleIds)
|
||||
this.getList()
|
||||
this.$modal.msgSuccess('删除成功')
|
||||
})
|
||||
|
||||
.catch(() => {})
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download(
|
||||
'system/role/export',
|
||||
{
|
||||
...this.queryParams,
|
||||
},
|
||||
`role_${new Date().getTime()}.xlsx`,
|
||||
)
|
||||
},
|
||||
// 检查行是否可选
|
||||
checkSelectable(row) {
|
||||
return !(row.roleId === 1 || row.isBuiltIn === '0')
|
||||
},
|
||||
|
||||
getRowClassName(row) {
|
||||
return !this.checkSelectable(row) ? 'disabled-row' : ''
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.disabled-row {
|
||||
background-color: #f5f7fa !important;
|
||||
color: #909399;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.disabled-row .el-checkbox__input {
|
||||
cursor: not-allowed !important;
|
||||
}
|
||||
|
||||
.disabled-row:hover td {
|
||||
background-color: #f5f7fa !important;
|
||||
}
|
||||
|
||||
.app-content {
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -134,11 +134,7 @@
|
|||
>新增
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="
|
||||
config.isAddRootCompany
|
||||
? true
|
||||
: scope.row.parentId != 0
|
||||
"
|
||||
v-if="scope.row.parentId != 0"
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
|
|
@ -165,11 +161,7 @@
|
|||
v-model="form.parentId"
|
||||
:options="deptOptions"
|
||||
:normalizer="normalizer"
|
||||
:placeholder="
|
||||
config.isAddRootCompany
|
||||
? '选择上级部门，如果不选择则创建顶级部门'
|
||||
: '选择上级部门'
|
||||
"
|
||||
placeholder="选择上级部门"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
|
@ -335,16 +327,13 @@ export default {
|
|||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
parentId: JSON.parse(localStorage.getItem('systemConfig'))
|
||||
.isAddRootCompany
|
||||
? []
|
||||
: [
|
||||
{
|
||||
required: true,
|
||||
message: '上级部门不能为空',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
parentId: [
|
||||
{
|
||||
required: true,
|
||||
message: '上级部门不能为空',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
deptName: [
|
||||
{
|
||||
required: true,
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -35,7 +35,8 @@ module.exports = {
|
|||
proxy: {
|
||||
// detail: https://cli.vuejs.org/config/#devserver-proxy
|
||||
[process.env.VUE_APP_BASE_API]: {
|
||||
target: `http://192.168.2.209:38080`,
|
||||
// target: `http://192.168.2.209:38080`,
|
||||
target: `http://192.168.2.76:38080`,
|
||||
// target: `http://192.168.0.244:18877`,
|
||||
changeOrigin: true,
|
||||
pathRewrite: {
|
||||
|
|
|
|||
Loading…
Reference in New Issue