feat: 按钮鉴权

This commit is contained in:
leiqiaochu 2023-03-07 10:13:41 +08:00
parent 70a28bcbe1
commit 356bf1fccf
12 changed files with 158 additions and 88 deletions

View File

@ -4,11 +4,12 @@
<div v-if="productStore.current.accessId === undefined || null"> <div v-if="productStore.current.accessId === undefined || null">
<a-empty :image="simpleImage"> <a-empty :image="simpleImage">
<template #description> <template #description>
<span> <span v-if="permissionStore.hasPermission('device/Product:update')">
请先<a-button type="link" @click="showModal" 请先<a-button type="link" @click="showModal"
>选择</a-button >选择</a-button
>设备接入网关用以提供设备接入能力 >设备接入网关用以提供设备接入能力
</span> </span>
<span v-else>暂无权限请联系管理员</span>
</template> </template>
</a-empty> </a-empty>
</div> </div>
@ -173,9 +174,7 @@
</a-select> </a-select>
</a-form-item> </a-form-item>
</a-form> </a-form>
<a-button type="primary" @click="submitDevice" <PermissionButton type="primary" @click="submitDevice" hasPermission="device/Instance:update">保存</PermissionButton>
>保存</a-button
>
</a-col> </a-col>
<a-col <a-col
:span="12" :span="12"
@ -271,16 +270,11 @@
target="deviceModal" target="deviceModal"
@search="search" @search="search"
/> />
<JTable <JProTable
:columns="columns" :columns="columns"
:request="queryList" :request="queryList"
ref="tableRef" ref="tableRef"
modal="card" modal="card"
:rowSelection="{
selectedRowKeys: _selectedRowKeys,
onChange: onSelectChange,
type: 'radio',
}"
:defaultParams="{ :defaultParams="{
...temp, ...temp,
sorts: [ sorts: [
@ -343,7 +337,7 @@
<template #id="slotProps"> <template #id="slotProps">
<a>{{ slotProps.id }}</a> <a>{{ slotProps.id }}</a>
</template> </template>
</JTable> </JProTable>
</a-modal> </a-modal>
</template> </template>
@ -353,6 +347,7 @@ import { ConfigMetadata } from '@/views/device/Product/typings';
import { Empty, message } from 'ant-design-vue'; import { Empty, message } from 'ant-design-vue';
import { getImage } from '@/utils/comm'; import { getImage } from '@/utils/comm';
import Title from '../Title/index.vue'; import Title from '../Title/index.vue';
import { usePermissionStore } from '@/store/permission';
import './index.less'; import './index.less';
import { import {
getProviders, getProviders,
@ -375,6 +370,7 @@ import Driver from 'driver.js';
import 'driver.js/dist/driver.min.css'; import 'driver.js/dist/driver.min.css';
import { marked } from 'marked'; import { marked } from 'marked';
import type { FormInstance, TableColumnType } from 'ant-design-vue'; import type { FormInstance, TableColumnType } from 'ant-design-vue';
const permissionStore = usePermissionStore();
const render = new marked.Renderer(); const render = new marked.Renderer();
marked.setOptions({ marked.setOptions({
renderer: render, renderer: render,
@ -548,10 +544,6 @@ const temp = {
const _selectedRowKeys = ref<string[]>([]); const _selectedRowKeys = ref<string[]>([]);
const currentForm = ref({}); const currentForm = ref({});
const onSelectChange = (keys: string[]) => {
_selectedRowKeys.value = [...keys];
};
const cancelSelect = () => { const cancelSelect = () => {
_selectedRowKeys.value = []; _selectedRowKeys.value = [];
}; };

View File

@ -15,19 +15,26 @@
:params="params" :params="params"
> >
<template #headerTitle> <template #headerTitle>
<a-space> <j-space>
<a-button type="primary" @click="add" <PermissionButton
><plus-outlined />新增</a-button type="primary"
@click="add"
hasPermission="device/Product:add"
> >
<template #icon><AIcon type="PlusOutlined" /></template>
新增
</PermissionButton>
<a-upload <a-upload
name="file" name="file"
accept=".json" accept=".json"
:showUploadList="false" :showUploadList="false"
:before-upload="beforeUpload" :before-upload="beforeUpload"
> >
<a-button>导入</a-button> <PermissionButton hasPermission="device/Product:import"
>导入</PermissionButton
>
</a-upload> </a-upload>
</a-space> </j-space>
</template> </template>
<template #deviceType="slotProps"> <template #deviceType="slotProps">
<div>{{ slotProps.deviceType.text }}</div> <div>{{ slotProps.deviceType.text }}</div>
@ -130,6 +137,7 @@
...item.tooltip, ...item.tooltip,
}" }"
@click="item.onClick" @click="item.onClick"
:hasPermission="'device/Product:' + item.key"
> >
<AIcon <AIcon
type="DeleteOutlined" type="DeleteOutlined"
@ -193,6 +201,7 @@
<PermissionButton <PermissionButton
:disabled="i.disabled" :disabled="i.disabled"
:popConfirm="i.popConfirm" :popConfirm="i.popConfirm"
:hasPermission="'device/Product:' + i.key"
:tooltip="{ :tooltip="{
...i.tooltip, ...i.tooltip,
}" }"
@ -334,12 +343,11 @@ const getActions = (
}, },
}, },
{ {
key: 'edit', key: 'update',
text: '编辑', text: '编辑',
tooltip: { tooltip: {
title: '编辑', title: '编辑',
}, },
icon: 'EditOutlined', icon: 'EditOutlined',
onClick: () => { onClick: () => {
title.value = '编辑'; title.value = '编辑';
@ -350,7 +358,7 @@ const getActions = (
}, },
}, },
{ {
key: 'download', key: 'export',
text: '导出', text: '导出',
tooltip: { tooltip: {
title: '导出', title: '导出',

View File

@ -21,15 +21,16 @@
" "
/> />
</a-tooltip> </a-tooltip>
<div
style=" <PermissionButton
margin: 0 0px 0 4px; type="link"
color: #1d39c4; @click="showOutput"
cursor: pointer; hasPermission="device/Instance:update"
"
> >
<edit-outlined @click="showOutput"/> <template #icon
</div> ><AIcon type="EditOutlined"
/></template>
</PermissionButton>
</div> </div>
</template> </template>
<a-descriptions <a-descriptions
@ -82,15 +83,14 @@
" "
/> />
</a-tooltip> </a-tooltip>
<div <PermissionButton
style=" type="link"
margin: 0 0px 0 4px; @click="showInput"
color: #1d39c4; hasPermission="device/Instance:update"
cursor: pointer;
"
> >
<edit-outlined @click="showInput"/> <template #icon
</div> ><AIcon type="EditOutlined" /></template
></PermissionButton>
</div> </div>
</template> </template>
<a-descriptions <a-descriptions
@ -168,14 +168,24 @@
</div> </div>
</a-col> </a-col>
</a-row> </a-row>
<InputSave :data="input" v-if="inputVisible" @closeModel="closeInput" @saveSuc="saveInput"/> <InputSave
<OutputSave :data="output" v-if="outputVisible" @closeModel="closeOutput" @saveSuc="saveOutput"/> :data="input"
v-if="inputVisible"
@closeModel="closeInput"
@saveSuc="saveInput"
/>
<OutputSave
:data="output"
v-if="outputVisible"
@closeModel="closeOutput"
@saveSuc="saveOutput"
/>
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import InputSave from './Save/input.vue' import InputSave from './Save/input.vue';
import OutputSave from './save/output.vue' import OutputSave from './save/output.vue';
import { import {
EditOutlined, EditOutlined,
DeleteOutlined, DeleteOutlined,
@ -439,24 +449,24 @@ handleInputSearch();
handleOutputSearch(); handleOutputSearch();
const showInput = () => { const showInput = () => {
inputVisible.value = true; inputVisible.value = true;
} };
const closeInput = () =>{ const closeInput = () => {
inputVisible.value = false; inputVisible.value = false;
} };
const saveInput = () =>{ const saveInput = () => {
inputVisible.value = false; inputVisible.value = false;
handleInputSearch(); handleInputSearch();
} };
const showOutput = () =>{ const showOutput = () => {
outputVisible.value = true; outputVisible.value = true;
} };
const closeOutput = () =>{ const closeOutput = () => {
outputVisible.value = false; outputVisible.value = false;
} };
const saveOutput = () =>{ const saveOutput = () => {
outputVisible.value = false; outputVisible.value = false;
handleOutputSearch(); handleOutputSearch();
} };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.alarmTitle { .alarmTitle {

View File

@ -35,12 +35,13 @@
</div> </div>
</div> </div>
</a-card> </a-card>
<a-button <!-- <a-button
type="primary" type="primary"
size="middle" size="middle"
@click="handleSaveLevel" @click="handleSaveLevel"
>保存</a-button >保存</a-button
> > -->
<PermissionButton type="primary" size="middle" @click="handleSaveLevel" hasPermission="rule-engine/Alarm/Config:update">保存</PermissionButton>
</div> </div>
</a-col> </a-col>
<a-col :span="10"> <a-col :span="10">

View File

@ -46,9 +46,7 @@
<a-form-item label="说明" name="description"> <a-form-item label="说明" name="description">
<a-textarea v-model:value="form.description"></a-textarea> <a-textarea v-model:value="form.description"></a-textarea>
</a-form-item> </a-form-item>
<a-button type="primary" @click="handleSave" :loading="loading" <PermissionButton type="primary" @click="handleSave" :hasPermission="['rule-engine/Alarm/Configuration:add','rule-engine/Alarm/Configuration:update']">保存</PermissionButton>
>保存</a-button
>
</a-form> </a-form>
</div> </div>
</template> </template>
@ -63,6 +61,7 @@ import { useMenuStore } from '@/store/menu';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import { useAlarmConfigurationStore } from '@/store/alarm'; import { useAlarmConfigurationStore } from '@/store/alarm';
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import { usePermissionStore } from '@/store/permission';
const route = useRoute(); const route = useRoute();
const id = route.query?.id; const id = route.query?.id;
let selectDisable = ref(false); let selectDisable = ref(false);

View File

@ -11,7 +11,7 @@
> >
<template #headerTitle> <template #headerTitle>
<a-space> <a-space>
<PermissionButton type="primary" @click="showModal"> <PermissionButton type="primary" @click="showModal" hasPermission="rule-engine/Alarm/Configuration:add">
<template #icon><AIcon type="PlusOutlined" /></template> <template #icon><AIcon type="PlusOutlined" /></template>
新增 新增
</PermissionButton> </PermissionButton>
@ -64,6 +64,7 @@
...item.tooltip, ...item.tooltip,
}" }"
@click="item.onClick" @click="item.onClick"
:hasPermission="'rule-engine/Alarm/Configuration:'+item.key"
> >
<AIcon :type="item.icon" /> <AIcon :type="item.icon" />
<span>{{ item?.text }}</span> <span>{{ item?.text }}</span>
@ -137,7 +138,7 @@ const getActions = (
if (!data) return []; if (!data) return [];
const actions: ActionsType[] = [ const actions: ActionsType[] = [
{ {
key: 'unbind', key: 'action',
text: '解绑', text: '解绑',
icon: 'DisconnectOutlined', icon: 'DisconnectOutlined',
popConfirm: { popConfirm: {

View File

@ -10,7 +10,7 @@
:columns="columns" :columns="columns"
:request="queryList" :request="queryList"
:gridColumn="3" :gridColumn="3"
:gridColumns="[1,2,3]" :gridColumns="[1, 2, 3]"
ref="tableRef" ref="tableRef"
:defaultParams="{ :defaultParams="{
sorts: [{ name: 'createTime', order: 'desc' }], sorts: [{ name: 'createTime', order: 'desc' }],
@ -18,11 +18,18 @@
:params="params" :params="params"
> >
<template #headerTitle> <template #headerTitle>
<a-space> <j-space>
<a-button type="primary" @click="add" <PermissionButton
><plus-outlined />新增</a-button type="primary"
@click="add"
hasPermission="device/Instance:add"
> >
</a-space> <template #icon
><AIcon type="PlusOutlined"
/></template>
新增
</PermissionButton>
</j-space>
</template> </template>
<template #card="slotProps"> <template #card="slotProps">
<CardBox <CardBox
@ -74,13 +81,17 @@
<template #actions="item"> <template #actions="item">
<PermissionButton <PermissionButton
v-if=" v-if="
item.key != 'trigger' || item.key != 'tigger' ||
slotProps.sceneTriggerType == 'manual' slotProps.sceneTriggerType == 'manual'
" "
:disabled="item.disabled" :disabled="item.disabled"
:popConfirm="item.popConfirm" :popConfirm="item.popConfirm"
:tooltip="{ ...item.tootip }" :tooltip="{ ...item.tootip }"
@click="item.onClick" @click="item.onClick"
:hasPermission="
'rule-engine/Alarm/Configuration:' +
item.key
"
> >
<AIcon <AIcon
type="DeleteOutlined" type="DeleteOutlined"
@ -136,7 +147,7 @@
> >
<PermissionButton <PermissionButton
v-if=" v-if="
i.key != 'trigger' || i.key != 'tigger' ||
slotProps.sceneTriggerType == 'manual' slotProps.sceneTriggerType == 'manual'
" "
:disabled="i.disabled" :disabled="i.disabled"
@ -147,6 +158,10 @@
@click="i.onClick" @click="i.onClick"
type="link" type="link"
style="padding: 0px" style="padding: 0px"
:hasPermission="
'rule-engine/Alarm/Configuration:' +
item.key
"
> >
<template #icon <template #icon
><AIcon :type="i.icon" ><AIcon :type="i.icon"
@ -161,7 +176,6 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import JTable from '@/components/Table';
import { import {
queryList, queryList,
_enable, _enable,
@ -323,7 +337,7 @@ const getActions = (
} }
const actions = [ const actions = [
{ {
key: 'trigger', key: 'tigger',
text: '手动触发', text: '手动触发',
disabled: data?.state?.value === 'disabled', disabled: data?.state?.value === 'disabled',
tooltip: { tooltip: {
@ -353,7 +367,7 @@ const getActions = (
icon: 'LikeOutlined', icon: 'LikeOutlined',
}, },
{ {
key: 'edit', key: 'update',
text: '编辑', text: '编辑',
tooltip: { tooltip: {
title: '编辑', title: '编辑',

View File

@ -5,7 +5,7 @@
target="alarm-log-detail" target="alarm-log-detail"
@search="handleSearch" @search="handleSearch"
></Search> ></Search>
<JTable <JProTable
:columns="columns" :columns="columns"
model="TABLE" model="TABLE"
:request="queryList" :request="queryList"
@ -39,7 +39,7 @@
</template> </template>
</a-space> </a-space>
</template> </template>
</JTable> </JProTable>
<Info v-if="visiable" :data="current" @close="close"/> <Info v-if="visiable" :data="current" @close="close"/>
</page-container> </page-container>
</template> </template>

View File

@ -13,7 +13,7 @@
target="bind-channel" target="bind-channel"
@search="handleSearch" @search="handleSearch"
></Search> ></Search>
<JTable <JProTable
model="TABLE" model="TABLE"
:columns="columns" :columns="columns"
:defaultParams="{ :defaultParams="{
@ -47,7 +47,7 @@
}} }}
</span> </span>
</template> </template>
</JTable> </JProTable>
</a-modal> </a-modal>
</template> </template>

View File

@ -28,7 +28,7 @@
:columns="columns" :columns="columns"
:request="handleSearch" :request="handleSearch"
:params="params" :params="params"
:gridColumns="[1,1,2]" :gridColumns="[1, 1, 2]"
:gridColumn="2" :gridColumn="2"
model="CARD" model="CARD"
> >
@ -98,16 +98,23 @@
</span> </span>
</a-col> </a-col>
</a-row> </a-row>
</template> </template>
<template #actions="item"> <template #actions="item">
<PermissionButton <PermissionButton
:disabled="item.key === 'solve' && slotProps.state.value ==='normal'" :disabled="
item.key === 'solve' &&
slotProps.state.value === 'normal'
"
:popConfirm="item.popConfirm" :popConfirm="item.popConfirm"
:tooltip="{ :tooltip="{
...item.tooltip, ...item.tooltip,
}" }"
@click="item.onClick" @click="item.onClick"
:hasPermission="
item.key == 'solve'
? 'rule-engine/Alarm/Log:action'
: 'rule-engine/Alarm/Log:view'
"
> >
<AIcon :type="item.icon" /> <AIcon :type="item.icon" />
<span>{{ item?.text }}</span> <span>{{ item?.text }}</span>
@ -116,8 +123,16 @@
</CardBox> </CardBox>
</template> </template>
</JProTable> </JProTable>
<SolveComponent :data="data" v-if="data.solveVisible" @closeSolve="closeSolve"/> <SolveComponent
<SolveLog :data="data.current" v-if="data.logVisible" @closeLog="closeLog"/> :data="data"
v-if="data.solveVisible"
@closeSolve="closeSolve"
/>
<SolveLog
:data="data.current"
v-if="data.logVisible"
@closeLog="closeLog"
/>
</div> </div>
</template> </template>
@ -139,6 +154,7 @@ import type { ActionsType } from '@/components/Table';
import SolveComponent from '../SolveComponent/index.vue'; import SolveComponent from '../SolveComponent/index.vue';
import SolveLog from '../SolveLog/index.vue' import SolveLog from '../SolveLog/index.vue'
import { useMenuStore } from '@/store/menu'; import { useMenuStore } from '@/store/menu';
import { usePermissionStore } from '@/store/permission';
const menuStory = useMenuStore(); const menuStory = useMenuStore();
const alarmStore = useAlarmStore(); const alarmStore = useAlarmStore();
@ -368,6 +384,13 @@ const getActions = (
onClick: () =>{ onClick: () =>{
data.value.current = currentData; data.value.current = currentData;
data.value.solveVisible = true; data.value.solveVisible = true;
},
popConfirm:{
title: !usePermissionStore().hasPermission('rule-engine/Alarm/Log:action')
? '暂无权限,请联系管理员'
: data.state?.value === 'normal'
? '无告警'
: ''
} }
}, },
{ {

View File

@ -20,7 +20,7 @@
:title="item.alarmName" :title="item.alarmName"
placement="topLeft" placement="topLeft"
> >
<a>{{ item.alarmName }}</a> <a @click="()=>{return jumpDetail(item)}">{{ item.alarmName }}</a>
</a-tooltip> </a-tooltip>
</div> </div>
<div class="new-alarm-item-state"> <div class="new-alarm-item-state">
@ -63,6 +63,7 @@
<script lang="ts" setup> <script lang="ts" setup>
import { Empty } from 'ant-design-vue'; import { Empty } from 'ant-design-vue';
import { getImage } from '@/utils/comm'; import { getImage } from '@/utils/comm';
import { useMenuStore } from '@/store/menu';
import moment from 'moment'; import moment from 'moment';
const props = defineProps({ const props = defineProps({
alarmList: { alarmList: {
@ -70,6 +71,10 @@ const props = defineProps({
default: [], default: [],
}, },
}); });
const menuStore = useMenuStore();
const jumpDetail = (item:any) =>{
menuStore.jumpPage(`rule-engine/Alarm/Log/Detail`,{id:item.id});
}
</script> </script>
<style scoped lang="less"> <style scoped lang="less">
.new-alarm { .new-alarm {

View File

@ -6,7 +6,7 @@
target="device-instance" target="device-instance"
@search="handleSearch" @search="handleSearch"
></Search> ></Search>
<JTable <JProTable
:columns="columns" :columns="columns"
:request="queryList" :request="queryList"
ref="tableRef" ref="tableRef"
@ -16,11 +16,18 @@
:params="params" :params="params"
> >
<template #headerTitle> <template #headerTitle>
<a-space> <j-space>
<a-button type="primary" @click="add" <PermissionButton
><plus-outlined />新增</a-button type="primary"
@click="add"
hasPermission="rule-engine/Instance:add"
> >
</a-space> <template #icon
><AIcon type="PlusOutlined"
/></template>
新增
</PermissionButton>
</j-space>
</template> </template>
<template #card="slotProps"> <template #card="slotProps">
<CardBox <CardBox
@ -29,6 +36,7 @@
v-bind="slotProps" v-bind="slotProps"
:status="slotProps.state?.value" :status="slotProps.state?.value"
:statusText="slotProps.state?.text" :statusText="slotProps.state?.text"
@click="openRuleEditor"
:statusNames="{ :statusNames="{
started: 'success', started: 'success',
disable: 'error', disable: 'error',
@ -62,6 +70,9 @@
:tooltip="{ :tooltip="{
...item.tooltip, ...item.tooltip,
}" }"
:hasPermission="
'rule-engine/Instance:' + item.key
"
@click="item.onClick" @click="item.onClick"
> >
<AIcon <AIcon
@ -113,7 +124,7 @@
</template> </template>
</a-space> </a-space>
</template> </template>
</JTable> </JProTable>
<!-- 新增编辑 --> <!-- 新增编辑 -->
<Save <Save
ref="saveRef" ref="saveRef"
@ -138,6 +149,7 @@ import type { ActionsType } from '@/components/Table/index.vue';
import { getImage } from '@/utils/comm'; import { getImage } from '@/utils/comm';
import { message } from 'ant-design-vue'; import { message } from 'ant-design-vue';
import Save from './Save/index.vue'; import Save from './Save/index.vue';
import { SystemConst } from '@/utils/consts';
const params = ref<Record<string, any>>({}); const params = ref<Record<string, any>>({});
let isAdd = ref<number>(0); let isAdd = ref<number>(0);
let title = ref<string>(''); let title = ref<string>('');
@ -216,7 +228,7 @@ const getActions = (
} }
const actions = [ const actions = [
{ {
key: 'edit', key: 'update',
text: '编辑', text: '编辑',
tooltip: { tooltip: {
title: '编辑', title: '编辑',
@ -312,6 +324,11 @@ const refresh = () => {
const handleSearch = (e: any) => { const handleSearch = (e: any) => {
params.value = e; params.value = e;
}; };
const openRuleEditor = (item: any) => {
window.open(
`/${SystemConst.API_BASE}/rule-editor/index.html#flow/${item.id}`,
);
};
</script> </script>
<style scoped> <style scoped>
</style> </style>