Merge branch 'main' of http://121.37.111.42:3000/ThbTech/gis-bi
This commit is contained in:
commit
0d369c13bd
6
core/core-frontend/src/assets/adds.svg
Normal file
6
core/core-frontend/src/assets/adds.svg
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="14px" height="14px" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<g transform="matrix(1 0 0 1 -357 -147 )">
|
||||||
|
<path d="M 0.625 6.37500000000003 L 6.375 6.37500000000003 L 6.375 0.624999999999972 C 6.375 0.279828124999995 6.65482812499999 0 7 0 C 7.345171875 0 7.625 0.279828124999995 7.625 0.624999999999972 L 7.625 6.37500000000003 L 13.375 6.37500000000003 C 13.720171875 6.37500000000003 14 6.65482812499999 14 7 C 14 7.345171875 13.720171875 7.62499999999997 13.375 7.62499999999997 L 7.625 7.62499999999997 L 7.625 13.375 C 7.625 13.720171875 7.345171875 14 7 14 C 6.65482812499999 14 6.375 13.720171875 6.375 13.375 L 6.375 7.62499999999997 L 0.625 7.62499999999997 C 0.279828124999995 7.62499999999997 0 7.345171875 0 7 C 0 6.65482812499999 0.279828124999995 6.37500000000003 0.625 6.37500000000003 Z " fill-rule="nonzero" fill="#0089ff" stroke="none" transform="matrix(1 0 0 1 357 147 )" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
6
core/core-frontend/src/assets/svg/adds.svg
Normal file
6
core/core-frontend/src/assets/svg/adds.svg
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="14px" height="14px" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<g transform="matrix(1 0 0 1 -357 -147 )">
|
||||||
|
<path d="M 0.625 6.37500000000003 L 6.375 6.37500000000003 L 6.375 0.624999999999972 C 6.375 0.279828124999995 6.65482812499999 0 7 0 C 7.345171875 0 7.625 0.279828124999995 7.625 0.624999999999972 L 7.625 6.37500000000003 L 13.375 6.37500000000003 C 13.720171875 6.37500000000003 14 6.65482812499999 14 7 C 14 7.345171875 13.720171875 7.62499999999997 13.375 7.62499999999997 L 7.625 7.62499999999997 L 7.625 13.375 C 7.625 13.720171875 7.345171875 14 7 14 C 6.65482812499999 14 6.375 13.720171875 6.375 13.375 L 6.375 7.62499999999997 L 0.625 7.62499999999997 C 0.279828124999995 7.62499999999997 0 7.345171875 0 7 C 0 6.65482812499999 0.279828124999995 6.37500000000003 0.625 6.37500000000003 Z " fill-rule="nonzero" fill="#0089ff" stroke="none" transform="matrix(1 0 0 1 357 147 )" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
@ -0,0 +1,6 @@
|
|||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="14px" height="14px" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<g transform="matrix(1 0 0 1 -484 -209 )">
|
||||||
|
<path d="M 13.2797155040491 2.55992134455221 L 9.92797416445654 2.55992134455221 C 9.88235025024102 1.13300892710839 8.63865637746909 0 7.10924884137609 0 C 5.57982605664864 0 4.33852621948233 1.13299467793303 4.28570494981568 2.55543285432358 L 0.72026924731648 2.55543285432358 C 0.324124973451035 2.55543285432358 0 2.85607620458964 0 3.22850690016315 C 0 3.59870047520999 0.321730937845473 3.90159519517806 0.720284495950921 3.90159519517806 L 1.51499757655631 3.90159519517806 L 1.51499757655631 11.4310874258152 C 1.51499757655631 12.8445486217485 2.54020901521051 14 3.80793473584464 14 L 10.2664938488098 14 C 11.5318255338384 14 12.5594310080981 12.8512884816792 12.5594310080981 11.4310874258152 L 12.5594310080981 3.90608368540677 L 13.2797155040491 3.90608368540677 C 13.675875026549 3.90608368540677 14 3.60542608596529 14 3.23299539039178 C 14 2.86280181534494 13.6782690621545 2.55992134455221 13.2797155040491 2.55992134455221 Z M 11.2076853117529 11.4378130365705 C 11.2076853117529 12.2073682485626 10.7130806053707 12.7480817047714 10.2640998132043 12.7480817047714 L 3.80552545160464 12.7480817047714 C 3.3565446594381 12.7480817047714 2.86193995305592 12.202879758334 2.86193995305592 11.4310874258152 L 2.86193995305592 3.90608368540677 L 11.2076853117529 3.90608368540677 L 11.2076853117529 11.4378130365705 Z M 5.6350566105553 2.55543285432358 C 5.68787788022195 1.8262740543891 6.32414240046182 1.26089527568598 7.11164287698165 1.26089527568598 C 7.89914335350147 1.26089527568598 8.53540787374129 1.82851117491577 8.58103178795682 2.55543285432358 L 5.6350566105553 2.55543285432358 Z M 4.49316075172948 5.83332502131438 C 4.12326324246993 5.83332502131438 3.81818181818181 6.16898021042672 3.81818181818181 6.59036968898866 L 3.81818181818181 10.909635183892 C 3.81818181818181 11.3285662200342 4.11516980540483 11.6666642918041 4.49316075172948 11.6666642918041 C 4.86302396676399 11.6666642918041 5.16812253816454 11.331024662454 5.16812253816454 10.909635183892 L 5.16812253816454 6.59036968898866 C 5.16812253816454 6.16898021042672 4.86573321052737 5.83332502131438 4.49316075172948 5.83332502131438 Z M 6.93655568402272 5.83332502131438 C 6.56667532187578 5.83332502131438 6.26157675047523 6.16898021042672 6.26157675047523 6.59036968898866 L 6.26157675047523 10.909635183892 C 6.26157675047523 11.3285662200342 6.56667532187578 11.6666642918041 6.93655568402272 11.6666642918041 C 7.30643604616984 11.6666642918041 7.61151747045795 11.331024662454 7.61151747045795 10.909635183892 L 7.61151747045795 6.59036968898866 C 7.61151747045795 6.16898021042672 7.30912814282073 5.83332502131438 6.93655568402272 5.83332502131438 Z M 9.50683924827052 5.83332502131438 C 9.13695888612358 5.83332502131438 8.8318774618354 6.16898021042672 8.8318774618354 6.59036968898866 L 8.8318774618354 10.909635183892 C 8.8318774618354 11.3285662200342 9.12615620529499 11.6666642918041 9.50683924827052 11.6666642918041 C 9.87671961041758 11.6666642918041 10.1818181818182 11.331024662454 10.1818181818182 10.909635183892 L 10.1818181818182 6.59036968898866 C 10.1818181818182 6.16898021042672 9.87942885418096 5.83332502131438 9.50683924827052 5.83332502131438 Z " fill-rule="nonzero" fill="#409eff" stroke="none" transform="matrix(1 0 0 1 484 209 )" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
@ -0,0 +1,6 @@
|
|||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="14px" height="14px" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<g transform="matrix(1 0 0 1 -484 -209 )">
|
||||||
|
<path d="M 13.2797155040491 2.55992134455221 L 9.92797416445654 2.55992134455221 C 9.88235025024102 1.13300892710839 8.63865637746909 0 7.10924884137609 0 C 5.57982605664864 0 4.33852621948233 1.13299467793303 4.28570494981568 2.55543285432358 L 0.72026924731648 2.55543285432358 C 0.324124973451035 2.55543285432358 0 2.85607620458964 0 3.22850690016315 C 0 3.59870047520999 0.321730937845473 3.90159519517806 0.720284495950921 3.90159519517806 L 1.51499757655631 3.90159519517806 L 1.51499757655631 11.4310874258152 C 1.51499757655631 12.8445486217485 2.54020901521051 14 3.80793473584464 14 L 10.2664938488098 14 C 11.5318255338384 14 12.5594310080981 12.8512884816792 12.5594310080981 11.4310874258152 L 12.5594310080981 3.90608368540677 L 13.2797155040491 3.90608368540677 C 13.675875026549 3.90608368540677 14 3.60542608596529 14 3.23299539039178 C 14 2.86280181534494 13.6782690621545 2.55992134455221 13.2797155040491 2.55992134455221 Z M 11.2076853117529 11.4378130365705 C 11.2076853117529 12.2073682485626 10.7130806053707 12.7480817047714 10.2640998132043 12.7480817047714 L 3.80552545160464 12.7480817047714 C 3.3565446594381 12.7480817047714 2.86193995305592 12.202879758334 2.86193995305592 11.4310874258152 L 2.86193995305592 3.90608368540677 L 11.2076853117529 3.90608368540677 L 11.2076853117529 11.4378130365705 Z M 5.6350566105553 2.55543285432358 C 5.68787788022195 1.8262740543891 6.32414240046182 1.26089527568598 7.11164287698165 1.26089527568598 C 7.89914335350147 1.26089527568598 8.53540787374129 1.82851117491577 8.58103178795682 2.55543285432358 L 5.6350566105553 2.55543285432358 Z M 4.49316075172948 5.83332502131438 C 4.12326324246993 5.83332502131438 3.81818181818181 6.16898021042672 3.81818181818181 6.59036968898866 L 3.81818181818181 10.909635183892 C 3.81818181818181 11.3285662200342 4.11516980540483 11.6666642918041 4.49316075172948 11.6666642918041 C 4.86302396676399 11.6666642918041 5.16812253816454 11.331024662454 5.16812253816454 10.909635183892 L 5.16812253816454 6.59036968898866 C 5.16812253816454 6.16898021042672 4.86573321052737 5.83332502131438 4.49316075172948 5.83332502131438 Z M 6.93655568402272 5.83332502131438 C 6.56667532187578 5.83332502131438 6.26157675047523 6.16898021042672 6.26157675047523 6.59036968898866 L 6.26157675047523 10.909635183892 C 6.26157675047523 11.3285662200342 6.56667532187578 11.6666642918041 6.93655568402272 11.6666642918041 C 7.30643604616984 11.6666642918041 7.61151747045795 11.331024662454 7.61151747045795 10.909635183892 L 7.61151747045795 6.59036968898866 C 7.61151747045795 6.16898021042672 7.30912814282073 5.83332502131438 6.93655568402272 5.83332502131438 Z M 9.50683924827052 5.83332502131438 C 9.13695888612358 5.83332502131438 8.8318774618354 6.16898021042672 8.8318774618354 6.59036968898866 L 8.8318774618354 10.909635183892 C 8.8318774618354 11.3285662200342 9.12615620529499 11.6666642918041 9.50683924827052 11.6666642918041 C 9.87671961041758 11.6666642918041 10.1818181818182 11.331024662454 10.1818181818182 10.909635183892 L 10.1818181818182 6.59036968898866 C 10.1818181818182 6.16898021042672 9.87942885418096 5.83332502131438 9.50683924827052 5.83332502131438 Z " fill-rule="nonzero" fill="#ffffff" stroke="none" transform="matrix(1 0 0 1 484 209 )" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -205,6 +205,13 @@ export const routes: AppRouteRecordRaw[] = [
|
|||||||
hidden: true,
|
hidden: true,
|
||||||
meta: {},
|
meta: {},
|
||||||
component: () => import('@/viewsnew/application/service/datasource/index.vue')
|
component: () => import('@/viewsnew/application/service/datasource/index.vue')
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/permissionset',
|
||||||
|
name: 'permissionset',
|
||||||
|
hidden: true,
|
||||||
|
meta: {},
|
||||||
|
component: () => import('@/viewsnew/application/permissionset/index.vue')
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
|
|
||||||
|
|||||||
@ -38,10 +38,6 @@ function closeClick(e){ // 关闭新增弹窗
|
|||||||
}
|
}
|
||||||
isAppPopUp.value = false
|
isAppPopUp.value = false
|
||||||
}
|
}
|
||||||
function addClick(){
|
|
||||||
paramsObj.value = {}
|
|
||||||
isAppPopUp.value = true
|
|
||||||
}
|
|
||||||
function updateClick(row:any){
|
function updateClick(row:any){
|
||||||
paramsObj.value = row
|
paramsObj.value = row
|
||||||
isAppPopUp.value = true
|
isAppPopUp.value = true
|
||||||
@ -110,7 +106,7 @@ function delClick(row){
|
|||||||
<img src="@/assets/newimg/icon/dataset.png" alt="" title="编辑数据集" @click="routerClick(item,'/datasetnew')">
|
<img src="@/assets/newimg/icon/dataset.png" alt="" title="编辑数据集" @click="routerClick(item,'/datasetnew')">
|
||||||
<img src="@/assets/newimg/icon/caidan.png" alt="" title="菜单配置">
|
<img src="@/assets/newimg/icon/caidan.png" alt="" title="菜单配置">
|
||||||
<img src="@/assets/newimg/icon/fuwu.png" alt="" title="服务配置">
|
<img src="@/assets/newimg/icon/fuwu.png" alt="" title="服务配置">
|
||||||
<img src="@/assets/newimg/icon/permission.png" alt="" title="权限设置">
|
<img src="@/assets/newimg/icon/permission.png" alt="" title="权限设置" @click="routerClick(item,'/permissionset')">
|
||||||
<img src="@/assets/newimg/icon/export.png" alt="" title="导出">
|
<img src="@/assets/newimg/icon/export.png" alt="" title="导出">
|
||||||
<img src="@/assets/newimg/icon/release.png" alt="" title="发布">
|
<img src="@/assets/newimg/icon/release.png" alt="" title="发布">
|
||||||
<img src="@/assets/newimg/icon/del.png" alt="" title="删除" @click="delClick(item)">
|
<img src="@/assets/newimg/icon/del.png" alt="" title="删除" @click="delClick(item)">
|
||||||
|
|||||||
@ -0,0 +1,104 @@
|
|||||||
|
<script lang="ts" setup>
|
||||||
|
import {ref, onMounted,watch } from 'vue'
|
||||||
|
import { useRouter, useRoute } from 'vue-router'
|
||||||
|
const props = defineProps({
|
||||||
|
projectInfo: {
|
||||||
|
type: String,
|
||||||
|
default: ''
|
||||||
|
}
|
||||||
|
})
|
||||||
|
const projectInfo:any=ref({
|
||||||
|
|
||||||
|
})
|
||||||
|
watch(() => props.projectInfo, val => {
|
||||||
|
projectInfo.value = props.projectInfo
|
||||||
|
})
|
||||||
|
onMounted(()=>{
|
||||||
|
projectInfo.value = props.projectInfo
|
||||||
|
})
|
||||||
|
|
||||||
|
</script>
|
||||||
|
<template>
|
||||||
|
<div class="project-header-box">
|
||||||
|
<div class="project-header-left">
|
||||||
|
<div class="return-box" @click="$router.go(-1)">
|
||||||
|
<img src="@/assets/newimg/u594.png" alt="">
|
||||||
|
</div>
|
||||||
|
<img src="@/assets/newimg/logosmall.png" alt="" style="margin-left: 10px;">
|
||||||
|
<div class="header-title">{{projectInfo.name }} - {{ projectInfo.typename }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.project-header-box{
|
||||||
|
width: 100%;
|
||||||
|
height: 60px;
|
||||||
|
background-color: rgba(37, 38, 38, 1);
|
||||||
|
box-sizing: border-box;
|
||||||
|
border-bottom: 1px solid rgba(79, 80, 82, 1);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 0 10px;
|
||||||
|
.project-header-left{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.project-header-right{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.return-box{
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
width: 36px;
|
||||||
|
height: 36px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.return-box:hover{
|
||||||
|
background-color: rgba(255, 255, 255, 0.1);
|
||||||
|
}
|
||||||
|
.header-title{
|
||||||
|
font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
|
||||||
|
font-weight: 700;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #F2F4F5;
|
||||||
|
padding-left: 14px;
|
||||||
|
}
|
||||||
|
.preview-button{
|
||||||
|
width: 60px;
|
||||||
|
height: 30px;
|
||||||
|
line-height: 30px;
|
||||||
|
background-color: rgba(54, 55, 56, 1);
|
||||||
|
border: none;
|
||||||
|
border-radius: 4px;
|
||||||
|
font-family: 'Arial Normal', 'Arial';
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #F2F4F5;
|
||||||
|
text-align: center;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.design-button{
|
||||||
|
width: 60px;
|
||||||
|
height: 30px;
|
||||||
|
line-height: 30px;
|
||||||
|
background-color: rgba(0, 137, 255, 1);
|
||||||
|
border: none;
|
||||||
|
border-radius: 4px;
|
||||||
|
font-family: 'Arial Normal', 'Arial';
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #F2F4F5;
|
||||||
|
text-align: center;
|
||||||
|
margin-left: 10px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,109 @@
|
|||||||
|
<script lang="tsx" setup>
|
||||||
|
import Header from './header.vue'
|
||||||
|
import { findApplicationById } from "@/api/application/application";
|
||||||
|
import { useRoute, useRouter } from 'vue-router'
|
||||||
|
import { computed,reactive, ref, shallowRef, nextTick, watch, onMounted } from 'vue'
|
||||||
|
import Organization from './organization/index.vue'
|
||||||
|
|
||||||
|
const projectInfo:any =ref({})
|
||||||
|
const route = useRoute()
|
||||||
|
const router = useRouter()
|
||||||
|
const applicationId:any =ref("")
|
||||||
|
const curmenu = ref('')
|
||||||
|
onMounted(() => {
|
||||||
|
if (route.query.id) {
|
||||||
|
applicationId.value = route.query.id
|
||||||
|
curmenu.value = '组织机构配置'
|
||||||
|
findApplicationById(applicationId.value).then(res => {
|
||||||
|
res.data.data.typename = '权限设置'
|
||||||
|
projectInfo.value = res.data.data
|
||||||
|
})
|
||||||
|
}else{
|
||||||
|
|
||||||
|
}
|
||||||
|
})
|
||||||
|
function menuclick(name){
|
||||||
|
curmenu.value = name
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<Header :projectInfo="projectInfo"/>
|
||||||
|
<div class="permission-box">
|
||||||
|
<div class="permission-leftbox">
|
||||||
|
<div class="permission-leftbox-menu" :class="curmenu == '组织机构配置' ? 'permission-leftbox-menu-active' : ''" @click="menuclick('组织机构配置')">组织机构配置</div>
|
||||||
|
<div class="permission-leftbox-menu" :class="curmenu == '系统角色配置' ? 'permission-leftbox-menu-active' : ''" @click="menuclick('系统角色配置')">系统角色配置</div>
|
||||||
|
<div class="permission-leftbox-menu" :class="curmenu == '系统用户配置' ? 'permission-leftbox-menu-active' : ''" @click="menuclick('系统用户配置')">系统用户配置</div>
|
||||||
|
</div>
|
||||||
|
<div class="permission-rightbox">
|
||||||
|
<Organization v-if="curmenu == '组织机构配置'" :applicationId="applicationId" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.permission-box{
|
||||||
|
background: rgb(21,21,21);
|
||||||
|
height: calc(100vh - 60px);
|
||||||
|
display: flex;
|
||||||
|
.permission-leftbox{
|
||||||
|
width: 260px;
|
||||||
|
height: 100%;
|
||||||
|
border-right: 1px solid #4f5052;
|
||||||
|
background: rgb(37,38,38);
|
||||||
|
padding-top: 10px;
|
||||||
|
.permission-leftbox-menu{
|
||||||
|
width: 100%;
|
||||||
|
height: 40px;
|
||||||
|
line-height: 40px;
|
||||||
|
color: #ffffff;
|
||||||
|
font-size: 14px;
|
||||||
|
padding-left: 35px;
|
||||||
|
}
|
||||||
|
.permission-leftbox-menu:hover{
|
||||||
|
background: rgb(54,55,56);
|
||||||
|
}
|
||||||
|
.permission-leftbox-menu-active{
|
||||||
|
background: rgb(26,68,103);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.permission-rightbox{
|
||||||
|
width: calc(100% - 260px);
|
||||||
|
height: 100%;
|
||||||
|
padding: 13px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<style>
|
||||||
|
.ed-dialog__header{
|
||||||
|
padding: 13px 20px;
|
||||||
|
border-bottom: 1px solid #333333;
|
||||||
|
margin-right: 0px;
|
||||||
|
}
|
||||||
|
.ed-dialog__headerbtn{
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
.ed-dialog__title{
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
.ed-dialog__headerbtn{
|
||||||
|
top: 13px !important;
|
||||||
|
}
|
||||||
|
.ed-dialog {
|
||||||
|
border: 1px solid #5f5f5f;
|
||||||
|
border-radius: 4px;
|
||||||
|
background: #212121;
|
||||||
|
}
|
||||||
|
.dialog-footer .ed-button{
|
||||||
|
color: #F2F4F5;
|
||||||
|
background-color: #212121;
|
||||||
|
border: 1px solid #363636;
|
||||||
|
}
|
||||||
|
.dialog-footer .ed-button--primary{
|
||||||
|
color: #F2F4F5;
|
||||||
|
background-color: #0089ff;
|
||||||
|
border: 1px solid #0089ff;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,174 @@
|
|||||||
|
<script lang="tsx" setup>
|
||||||
|
import { ref, onMounted } from 'vue'
|
||||||
|
import icon_permission_del_white from '@/assets/svg/permission_del_white.svg'
|
||||||
|
import icon_permission_edit_white from '@/assets/svg/permission_edit_white.svg'
|
||||||
|
import icon_permission_edit_blue from '@/assets/svg/permission_edit_blue.svg'
|
||||||
|
import icon_permission_del_blue from '@/assets/svg/permission_del_blue.svg'
|
||||||
|
import icon_add from '@/assets/svg/adds.svg'
|
||||||
|
const props = defineProps({
|
||||||
|
applicationId:String
|
||||||
|
})
|
||||||
|
|
||||||
|
const treeData:any = ref([])
|
||||||
|
const defaultProps = {
|
||||||
|
children: 'children',
|
||||||
|
label: 'name'
|
||||||
|
}
|
||||||
|
const hoverNodeId = ref(null);
|
||||||
|
const currentNodeId = ref(null);
|
||||||
|
const dialogVisible = ref(false);
|
||||||
|
const title = ref('新增企业');
|
||||||
|
onMounted(() => {
|
||||||
|
treeData.value = [{id:'111',name:'53'},{id:'232',name:'3434'}]
|
||||||
|
})
|
||||||
|
const handleMouseEnter = (node) => {
|
||||||
|
hoverNodeId.value = node.key;
|
||||||
|
};
|
||||||
|
const handleMouseLeave = () => {
|
||||||
|
hoverNodeId.value = null;
|
||||||
|
};
|
||||||
|
function nodeclick(data:any,node:any){
|
||||||
|
currentNodeId.value = node.key
|
||||||
|
}
|
||||||
|
function addtree(data:any){
|
||||||
|
dialogVisible.value = true
|
||||||
|
}
|
||||||
|
function edittree(data:any){
|
||||||
|
|
||||||
|
}
|
||||||
|
function deltree(data:any){
|
||||||
|
}
|
||||||
|
function handleClose() {
|
||||||
|
dialogVisible.value = false;
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<template>
|
||||||
|
<div class="organization-box">
|
||||||
|
<div class="organization-leftbox">
|
||||||
|
<div class="leftbox-title">企业列表</div>
|
||||||
|
<div class="leftbox-btn" @click="addtree">
|
||||||
|
<el-icon style="font-size: 14px;">
|
||||||
|
<Icon name="icon_add"
|
||||||
|
><icon_add class="svg-icon"
|
||||||
|
/></Icon>
|
||||||
|
</el-icon>
|
||||||
|
<span>新增企业</span>
|
||||||
|
</div>
|
||||||
|
<el-tree :data="treeData" node-key="id" :props="defaultProps"
|
||||||
|
highlight-current default-expand-all :expand-on-click-node="false"
|
||||||
|
@node-click="nodeclick">
|
||||||
|
<template #default="{ node, data }">
|
||||||
|
<div class="custom-tree-node" @mouseenter="handleMouseEnter(node)"
|
||||||
|
@mouseleave="handleMouseLeave()">
|
||||||
|
<div>{{ node.label }}</div>
|
||||||
|
<div v-show="hoverNodeId === node.key || currentNodeId === node.key" style="display: flex;" >
|
||||||
|
<div>
|
||||||
|
<el-icon v-if="currentNodeId === node.key" @click.stop="edittree(data)">
|
||||||
|
<icon_permission_edit_white class="svg-icon"/>
|
||||||
|
</el-icon>
|
||||||
|
<el-icon v-else @click.stop="edittree(data)">
|
||||||
|
<icon_permission_edit_blue class="svg-icon"/>
|
||||||
|
</el-icon>
|
||||||
|
</div>
|
||||||
|
<div style="margin-left: 8px;">
|
||||||
|
<el-icon v-if="currentNodeId === node.key" @click.stop="deltree(data)">
|
||||||
|
<icon_permission_del_white class="svg-icon"/>
|
||||||
|
</el-icon>
|
||||||
|
<el-icon v-else @click.stop="deltree(data)">
|
||||||
|
<icon_permission_del_blue class="svg-icon" />
|
||||||
|
</el-icon>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-tree>
|
||||||
|
</div>
|
||||||
|
<div class="organization-rightbox">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<el-dialog v-model="dialogVisible" title="Tips" width="30%" :before-close="handleClose">
|
||||||
|
<span>This is a message</span>
|
||||||
|
<template #footer>
|
||||||
|
<span class="dialog-footer">
|
||||||
|
<el-button @click="handleClose">取消</el-button>
|
||||||
|
<el-button type="primary" @click="dialogVisible = false">确定</el-button>
|
||||||
|
</span>
|
||||||
|
</template>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.organization-box{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
.organization-leftbox{
|
||||||
|
width: 240px;
|
||||||
|
height: 100%;
|
||||||
|
background: rgb(33,33,33);
|
||||||
|
border-radius: 5px;
|
||||||
|
margin-right: 15px;
|
||||||
|
.leftbox-title{
|
||||||
|
width: 100%;
|
||||||
|
height: 44px;
|
||||||
|
line-height: 44px;
|
||||||
|
font-family: 'Arial Negreta', 'Arial Normal', 'Arial', sans-serif;
|
||||||
|
font-weight: 700;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 15px;
|
||||||
|
color: #FFFFFF;
|
||||||
|
border-bottom: 1px solid #282828;
|
||||||
|
padding-left: 20px;
|
||||||
|
}
|
||||||
|
.leftbox-btn{
|
||||||
|
width: 200px;
|
||||||
|
height: 40px;
|
||||||
|
border-width: 1px;
|
||||||
|
border-style: solid;
|
||||||
|
border-color: rgba(0, 137, 255, 1);
|
||||||
|
border-radius: 3px;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #0089FF;
|
||||||
|
margin: 0 auto;
|
||||||
|
margin-top: 15px;
|
||||||
|
}
|
||||||
|
:deep(.ed-tree){
|
||||||
|
background:#212121;
|
||||||
|
height: calc(100vh - 210px);
|
||||||
|
margin-top: 20px;
|
||||||
|
color: #ffffff;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
:deep(.ed-tree-node__content){
|
||||||
|
height: 40px;
|
||||||
|
line-height: 40px;
|
||||||
|
}
|
||||||
|
:deep(.ed-tree-node__content:hover){
|
||||||
|
background: rgba(61,158, 255, 0.1);
|
||||||
|
color: #0089FF;
|
||||||
|
}
|
||||||
|
:deep(.ed-tree--highlight-current .ed-tree-node.is-current>.ed-tree-node__content){
|
||||||
|
background: #409eff;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
:deep(.custom-tree-node){
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
font-size: 14px;
|
||||||
|
padding-right: 8px;
|
||||||
|
}
|
||||||
|
:deep(.ed-tree-node__content>.ed-tree-node__expand-icon){
|
||||||
|
padding: 2px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.organization-rightbox{
|
||||||
|
width: calc(100% - 240px);
|
||||||
|
height: 100%;
|
||||||
|
background: rgb(33,33,33);
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue
Block a user