update: 系统管理列表撑满高度
This commit is contained in:
JiangQiming
parent
881cc39e9b
commit
f08e28560a
|
|
@ -6,166 +6,176 @@
|
||||||
target="category"
|
target="category"
|
||||||
@search="(params:any)=>queryParams = {...params}"
|
@search="(params:any)=>queryParams = {...params}"
|
||||||
/>
|
/>
|
||||||
|
<FullPage>
|
||||||
<j-pro-table
|
<j-pro-table
|
||||||
ref="tableRef"
|
ref="tableRef"
|
||||||
:columns="columns"
|
:columns="columns"
|
||||||
:request="getApplyList_api"
|
:request="getApplyList_api"
|
||||||
:defaultParams="{
|
:defaultParams="{
|
||||||
sorts: [{ name: 'createTime', order: 'desc' }],
|
sorts: [{ name: 'createTime', order: 'desc' }],
|
||||||
}"
|
}"
|
||||||
:params="queryParams"
|
:params="queryParams"
|
||||||
:gridColumn="3"
|
:gridColumn="3"
|
||||||
>
|
>
|
||||||
<template #headerTitle>
|
<template #headerTitle>
|
||||||
<div style="display: flex; align-items: center">
|
<div style="display: flex; align-items: center">
|
||||||
<PermissionButton
|
<PermissionButton
|
||||||
:hasPermission="`${permission}:add`"
|
:hasPermission="`${permission}:add`"
|
||||||
type="primary"
|
type="primary"
|
||||||
@click="() => table.toSave()"
|
@click="() => table.toSave()"
|
||||||
>
|
|
||||||
<AIcon type="PlusOutlined" />新增
|
|
||||||
</PermissionButton>
|
|
||||||
<p style="margin: 0 0 0 30px; color: #0000008c">
|
|
||||||
<AIcon
|
|
||||||
type="ExclamationCircleOutlined"
|
|
||||||
style="margin-right: 12px"
|
|
||||||
/>
|
|
||||||
应用管理将多个应用系统的登录简化为一次登录，实现多处访问、集中管控的业务场景。
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<template #card="slotProps">
|
|
||||||
<CardBox
|
|
||||||
:value="slotProps"
|
|
||||||
:actions="table.getActions(slotProps, 'card')"
|
|
||||||
v-bind="slotProps"
|
|
||||||
:status="slotProps.state?.value"
|
|
||||||
:statusText="slotProps.state?.text"
|
|
||||||
:statusNames="{
|
|
||||||
enabled: 'success',
|
|
||||||
disabled: 'error',
|
|
||||||
}"
|
|
||||||
>
|
|
||||||
<template #img>
|
|
||||||
<slot name="img">
|
|
||||||
<img :src="getImage('/apply.png')" />
|
|
||||||
</slot>
|
|
||||||
</template>
|
|
||||||
<template #content>
|
|
||||||
<h3 class="card-item-content-title">
|
|
||||||
<Ellipsis>
|
|
||||||
{{ slotProps.name }}
|
|
||||||
</Ellipsis>
|
|
||||||
</h3>
|
|
||||||
<j-row>
|
|
||||||
<j-col :span="12">
|
|
||||||
<div class="card-item-content-text">
|
|
||||||
类型
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
{{
|
|
||||||
table.getTypeLabel(
|
|
||||||
slotProps.provider,
|
|
||||||
)
|
|
||||||
}}
|
|
||||||
</div>
|
|
||||||
</j-col>
|
|
||||||
<j-col :span="12">
|
|
||||||
<div class="card-item-content-text">
|
|
||||||
说明
|
|
||||||
</div>
|
|
||||||
<Ellipsis>
|
|
||||||
{{ slotProps.description }}
|
|
||||||
</Ellipsis>
|
|
||||||
</j-col>
|
|
||||||
</j-row>
|
|
||||||
</template>
|
|
||||||
<template #actions="item">
|
|
||||||
<j-tooltip
|
|
||||||
v-bind="item.tooltip"
|
|
||||||
:title="item.disabled && item.tooltip.title"
|
|
||||||
>
|
>
|
||||||
<j-dropdown
|
<AIcon type="PlusOutlined" />新增
|
||||||
placement="bottomRight"
|
</PermissionButton>
|
||||||
v-if="item.key === 'others'"
|
<p style="margin: 0 0 0 30px; color: #0000008c">
|
||||||
>
|
<AIcon
|
||||||
<j-button>
|
type="ExclamationCircleOutlined"
|
||||||
<AIcon :type="item.icon" />
|
style="margin-right: 12px"
|
||||||
<span>{{ item.text }}</span>
|
/>
|
||||||
</j-button>
|
应用管理将多个应用系统的登录简化为一次登录，实现多处访问、集中管控的业务场景。
|
||||||
<template #overlay>
|
</p>
|
||||||
<j-menu>
|
</div>
|
||||||
<j-menu-item
|
</template>
|
||||||
v-for="(o, i) in item.children"
|
<template #card="slotProps">
|
||||||
:key="i"
|
<CardBox
|
||||||
>
|
:value="slotProps"
|
||||||
<j-button
|
:actions="table.getActions(slotProps, 'card')"
|
||||||
type="link"
|
v-bind="slotProps"
|
||||||
@click="o.onClick"
|
:status="slotProps.state?.value"
|
||||||
>
|
:statusText="slotProps.state?.text"
|
||||||
<AIcon :type="o.icon" />
|
:statusNames="{
|
||||||
<span>{{ o.text }}</span>
|
enabled: 'success',
|
||||||
</j-button>
|
disabled: 'error',
|
||||||
</j-menu-item>
|
}"
|
||||||
</j-menu>
|
|
||||||
</template>
|
|
||||||
</j-dropdown>
|
|
||||||
<PermissionButton
|
|
||||||
v-else
|
|
||||||
:hasPermission="item.permission"
|
|
||||||
:tooltip="item.tooltip"
|
|
||||||
:pop-confirm="item.popConfirm"
|
|
||||||
@click="item.onClick"
|
|
||||||
:disabled="item.disabled"
|
|
||||||
>
|
|
||||||
<AIcon :type="item.icon" />
|
|
||||||
<span v-if="item.key !== 'delete'">{{
|
|
||||||
item.text
|
|
||||||
}}</span>
|
|
||||||
</PermissionButton>
|
|
||||||
</j-tooltip>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<template #mark>
|
|
||||||
<AIcon
|
|
||||||
type="EyeOutlined"
|
|
||||||
style="font-size: 24px"
|
|
||||||
@click="() => table.toSave(slotProps.id, true)"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</CardBox>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<template #provider="slotProps">
|
|
||||||
{{ table.getTypeLabel(slotProps.provider) }}
|
|
||||||
</template>
|
|
||||||
<template #status="slotProps">
|
|
||||||
<BadgeStatus
|
|
||||||
:status="slotProps.state.value"
|
|
||||||
:text="slotProps.state.text"
|
|
||||||
:statusNames="{
|
|
||||||
enabled: 'success',
|
|
||||||
disabled: 'error',
|
|
||||||
}"
|
|
||||||
></BadgeStatus>
|
|
||||||
</template>
|
|
||||||
<template #action="slotProps">
|
|
||||||
<j-space :size="16">
|
|
||||||
<PermissionButton
|
|
||||||
v-for="i in table.getActions(slotProps, 'table')"
|
|
||||||
:hasPermission="i.permission"
|
|
||||||
type="link"
|
|
||||||
:tooltip="i.tooltip"
|
|
||||||
:pop-confirm="i.popConfirm"
|
|
||||||
@click="i.onClick"
|
|
||||||
:disabled="i.disabled"
|
|
||||||
>
|
>
|
||||||
<AIcon :type="i.icon" />
|
<template #img>
|
||||||
</PermissionButton>
|
<slot name="img">
|
||||||
</j-space>
|
<img :src="getImage('/apply.png')" />
|
||||||
</template>
|
</slot>
|
||||||
</j-pro-table>
|
</template>
|
||||||
|
<template #content>
|
||||||
|
<h3 class="card-item-content-title">
|
||||||
|
<Ellipsis>
|
||||||
|
{{ slotProps.name }}
|
||||||
|
</Ellipsis>
|
||||||
|
</h3>
|
||||||
|
<j-row>
|
||||||
|
<j-col :span="12">
|
||||||
|
<div class="card-item-content-text">
|
||||||
|
类型
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
{{
|
||||||
|
table.getTypeLabel(
|
||||||
|
slotProps.provider,
|
||||||
|
)
|
||||||
|
}}
|
||||||
|
</div>
|
||||||
|
</j-col>
|
||||||
|
<j-col :span="12">
|
||||||
|
<div class="card-item-content-text">
|
||||||
|
说明
|
||||||
|
</div>
|
||||||
|
<Ellipsis>
|
||||||
|
{{ slotProps.description }}
|
||||||
|
</Ellipsis>
|
||||||
|
</j-col>
|
||||||
|
</j-row>
|
||||||
|
</template>
|
||||||
|
<template #actions="item">
|
||||||
|
<j-tooltip
|
||||||
|
v-bind="item.tooltip"
|
||||||
|
:title="item.disabled && item.tooltip.title"
|
||||||
|
>
|
||||||
|
<j-dropdown
|
||||||
|
placement="bottomRight"
|
||||||
|
v-if="item.key === 'others'"
|
||||||
|
>
|
||||||
|
<j-button>
|
||||||
|
<AIcon :type="item.icon" />
|
||||||
|
<span>{{ item.text }}</span>
|
||||||
|
</j-button>
|
||||||
|
<template #overlay>
|
||||||
|
<j-menu>
|
||||||
|
<j-menu-item
|
||||||
|
v-for="(
|
||||||
|
o, i
|
||||||
|
) in item.children"
|
||||||
|
:key="i"
|
||||||
|
>
|
||||||
|
<j-button
|
||||||
|
type="link"
|
||||||
|
@click="o.onClick"
|
||||||
|
>
|
||||||
|
<AIcon :type="o.icon" />
|
||||||
|
<span>{{
|
||||||
|
o.text
|
||||||
|
}}</span>
|
||||||
|
</j-button>
|
||||||
|
</j-menu-item>
|
||||||
|
</j-menu>
|
||||||
|
</template>
|
||||||
|
</j-dropdown>
|
||||||
|
<PermissionButton
|
||||||
|
v-else
|
||||||
|
:hasPermission="item.permission"
|
||||||
|
:tooltip="item.tooltip"
|
||||||
|
:pop-confirm="item.popConfirm"
|
||||||
|
@click="item.onClick"
|
||||||
|
:disabled="item.disabled"
|
||||||
|
>
|
||||||
|
<AIcon :type="item.icon" />
|
||||||
|
<span v-if="item.key !== 'delete'">{{
|
||||||
|
item.text
|
||||||
|
}}</span>
|
||||||
|
</PermissionButton>
|
||||||
|
</j-tooltip>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<template #mark>
|
||||||
|
<AIcon
|
||||||
|
type="EyeOutlined"
|
||||||
|
style="font-size: 24px"
|
||||||
|
@click="
|
||||||
|
() => table.toSave(slotProps.id, true)
|
||||||
|
"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</CardBox>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<template #provider="slotProps">
|
||||||
|
{{ table.getTypeLabel(slotProps.provider) }}
|
||||||
|
</template>
|
||||||
|
<template #status="slotProps">
|
||||||
|
<BadgeStatus
|
||||||
|
:status="slotProps.state.value"
|
||||||
|
:text="slotProps.state.text"
|
||||||
|
:statusNames="{
|
||||||
|
enabled: 'success',
|
||||||
|
disabled: 'error',
|
||||||
|
}"
|
||||||
|
></BadgeStatus>
|
||||||
|
</template>
|
||||||
|
<template #action="slotProps">
|
||||||
|
<j-space :size="16">
|
||||||
|
<PermissionButton
|
||||||
|
v-for="i in table.getActions(
|
||||||
|
slotProps,
|
||||||
|
'table',
|
||||||
|
)"
|
||||||
|
:hasPermission="i.permission"
|
||||||
|
type="link"
|
||||||
|
:tooltip="i.tooltip"
|
||||||
|
:pop-confirm="i.popConfirm"
|
||||||
|
@click="i.onClick"
|
||||||
|
:disabled="i.disabled"
|
||||||
|
>
|
||||||
|
<AIcon :type="i.icon" />
|
||||||
|
</PermissionButton>
|
||||||
|
</j-space>
|
||||||
|
</template>
|
||||||
|
</j-pro-table>
|
||||||
|
</FullPage>
|
||||||
</div>
|
</div>
|
||||||
<div class="dialogs">
|
<div class="dialogs">
|
||||||
<MenuDialog
|
<MenuDialog
|
||||||
|
|
|
||||||
|
|
@ -1,285 +1,313 @@
|
||||||
<template>
|
<template>
|
||||||
<page-container>
|
<page-container>
|
||||||
<div class="basis-container">
|
<FullPage>
|
||||||
<j-form
|
<div class="basis-container">
|
||||||
layout="vertical"
|
<j-form
|
||||||
ref="formRef"
|
layout="vertical"
|
||||||
:rules="rulesFrom"
|
ref="formRef"
|
||||||
:model="formValue"
|
:rules="rulesFrom"
|
||||||
>
|
:model="formValue"
|
||||||
<j-row :span="24" :gutter="24">
|
>
|
||||||
<j-col :span="10">
|
<j-row :span="24" :gutter="24">
|
||||||
<j-form-item label="系统名称" name="title">
|
<j-col :span="10">
|
||||||
<j-input
|
<j-form-item label="系统名称" name="title">
|
||||||
v-model:value="formValue.title"
|
<j-input
|
||||||
placeholder="请输入系统名称"
|
v-model:value="formValue.title"
|
||||||
/>
|
placeholder="请输入系统名称"
|
||||||
</j-form-item>
|
/>
|
||||||
<j-form-item label="主题色" name="headerTheme">
|
</j-form-item>
|
||||||
<j-select v-model:value="formValue.headerTheme">
|
<j-form-item label="主题色" name="headerTheme">
|
||||||
<j-select-option value="light">
|
<j-select v-model:value="formValue.headerTheme">
|
||||||
白色
|
<j-select-option value="light">
|
||||||
</j-select-option>
|
白色
|
||||||
<j-select-option value="dark">
|
</j-select-option>
|
||||||
黑色
|
<j-select-option value="dark">
|
||||||
</j-select-option>
|
黑色
|
||||||
</j-select>
|
</j-select-option>
|
||||||
</j-form-item>
|
</j-select>
|
||||||
<j-form-item>
|
</j-form-item>
|
||||||
<template #label>
|
<j-form-item>
|
||||||
<span>高德API Key</span>
|
<template #label>
|
||||||
<j-tooltip
|
<span>高德API Key</span>
|
||||||
title="配置后平台可调用高德地图GIS服务"
|
<j-tooltip
|
||||||
>
|
title="配置后平台可调用高德地图GIS服务"
|
||||||
<img
|
>
|
||||||
class="img-style"
|
<img
|
||||||
:src="getImage('/init-home/mark.png')"
|
class="img-style"
|
||||||
/>
|
:src="
|
||||||
</j-tooltip>
|
getImage('/init-home/mark.png')
|
||||||
</template>
|
"
|
||||||
<j-input
|
/>
|
||||||
v-model:value="formValue.apiKey"
|
</j-tooltip>
|
||||||
placeholder="请输入高德API Key"
|
</template>
|
||||||
/>
|
<j-input
|
||||||
</j-form-item>
|
v-model:value="formValue.apiKey"
|
||||||
<j-form-item name="base-path">
|
placeholder="请输入高德API Key"
|
||||||
<template #label>
|
/>
|
||||||
<span>base-path</span>
|
</j-form-item>
|
||||||
<j-tooltip title="系统后台访问的url">
|
<j-form-item name="base-path">
|
||||||
<img
|
<template #label>
|
||||||
class="img-style"
|
<span>base-path</span>
|
||||||
:src="getImage('/init-home/mark.png')"
|
<j-tooltip title="系统后台访问的url">
|
||||||
/>
|
<img
|
||||||
</j-tooltip>
|
class="img-style"
|
||||||
</template>
|
:src="
|
||||||
<j-input
|
getImage('/init-home/mark.png')
|
||||||
v-model:value="formValue['base-path']"
|
"
|
||||||
placeholder="请输入高德API Key"
|
/>
|
||||||
/>
|
</j-tooltip>
|
||||||
</j-form-item>
|
</template>
|
||||||
<j-row :gutter="24" :span="24">
|
<j-input
|
||||||
<j-col>
|
v-model:value="formValue['base-path']"
|
||||||
<j-form-item label="系统logo">
|
placeholder="请输入高德API Key"
|
||||||
<div class="upload-image-warp-logo">
|
/>
|
||||||
<div class="upload-image-border-logo">
|
</j-form-item>
|
||||||
<j-upload
|
<j-row :gutter="24" :span="24">
|
||||||
name="file"
|
<j-col>
|
||||||
:action="action"
|
<j-form-item label="系统logo">
|
||||||
:headers="headers"
|
<div class="upload-image-warp-logo">
|
||||||
:showUploadList="false"
|
<div
|
||||||
:beforeUpload="
|
class="upload-image-border-logo"
|
||||||
uploader.beforeLogoUpload
|
|
||||||
"
|
|
||||||
@change="
|
|
||||||
uploader.handleChangeLogo
|
|
||||||
"
|
|
||||||
:accept="uploader.imageTypes"
|
|
||||||
>
|
>
|
||||||
<div
|
<j-upload
|
||||||
class="upload-image-content-logo"
|
name="file"
|
||||||
|
:action="action"
|
||||||
|
:headers="headers"
|
||||||
|
:showUploadList="false"
|
||||||
|
:beforeUpload="
|
||||||
|
uploader.beforeLogoUpload
|
||||||
|
"
|
||||||
|
@change="
|
||||||
|
uploader.handleChangeLogo
|
||||||
|
"
|
||||||
|
:accept="
|
||||||
|
uploader.imageTypes
|
||||||
|
"
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
class="loading-logo"
|
class="upload-image-content-logo"
|
||||||
v-if="form.logoLoading"
|
>
|
||||||
|
<div
|
||||||
|
class="loading-logo"
|
||||||
|
v-if="
|
||||||
|
form.logoLoading
|
||||||
|
"
|
||||||
|
>
|
||||||
|
<AIcon
|
||||||
|
type="LoadingOutlined"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="upload-image"
|
||||||
|
style="height: 100%"
|
||||||
|
v-if="
|
||||||
|
formValue.logo
|
||||||
|
"
|
||||||
|
:style="
|
||||||
|
formValue.logo
|
||||||
|
? `background-image: url(${formValue.logo});`
|
||||||
|
: ''
|
||||||
|
"
|
||||||
|
></div>
|
||||||
|
<div
|
||||||
|
v-if="
|
||||||
|
formValue.logo
|
||||||
|
"
|
||||||
|
class="upload-image-mask"
|
||||||
|
>
|
||||||
|
点击修改
|
||||||
|
</div>
|
||||||
|
<div v-else>
|
||||||
|
<AIcon
|
||||||
|
:type="
|
||||||
|
form.logoLoading
|
||||||
|
? 'LoadingOutlined'
|
||||||
|
: 'PlusOutlined'
|
||||||
|
"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</j-upload>
|
||||||
|
<div v-if="form.logoLoading">
|
||||||
|
<div
|
||||||
|
class="upload-loading-mask"
|
||||||
>
|
>
|
||||||
<AIcon
|
<AIcon
|
||||||
type="LoadingOutlined"
|
type="LoadingOutlined"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div
|
|
||||||
class="upload-image"
|
|
||||||
style="height: 100%"
|
|
||||||
v-if="formValue.logo"
|
|
||||||
:style="
|
|
||||||
formValue.logo
|
|
||||||
? `background-image: url(${formValue.logo});`
|
|
||||||
: ''
|
|
||||||
"
|
|
||||||
></div>
|
|
||||||
<div
|
|
||||||
v-if="formValue.logo"
|
|
||||||
class="upload-image-mask"
|
|
||||||
>
|
|
||||||
点击修改
|
|
||||||
</div>
|
|
||||||
<div v-else>
|
|
||||||
<AIcon
|
|
||||||
:type="
|
|
||||||
form.logoLoading
|
|
||||||
? 'LoadingOutlined'
|
|
||||||
: 'PlusOutlined'
|
|
||||||
"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</j-upload>
|
</div>
|
||||||
<div v-if="form.logoLoading">
|
</div>
|
||||||
|
|
||||||
|
<div class="upload-tips">
|
||||||
|
推荐尺寸200*200
|
||||||
|
</div>
|
||||||
|
<div class="upload-tips">
|
||||||
|
支持jpg,png,jfif,pjp,pjpeg,jpeg
|
||||||
|
</div>
|
||||||
|
</j-form-item>
|
||||||
|
</j-col>
|
||||||
|
<j-col>
|
||||||
|
<j-form-item>
|
||||||
|
<template #label>
|
||||||
|
<span>浏览器页签</span>
|
||||||
|
<j-tooltip
|
||||||
|
title="浏览器tab页中显示的图片元素"
|
||||||
|
>
|
||||||
|
<img
|
||||||
|
class="img-style"
|
||||||
|
:src="
|
||||||
|
getImage(
|
||||||
|
'/init-home/mark.png',
|
||||||
|
)
|
||||||
|
"
|
||||||
|
/>
|
||||||
|
</j-tooltip>
|
||||||
|
</template>
|
||||||
|
<div class="upload-image-warp-logo">
|
||||||
|
<div
|
||||||
|
class="upload-image-border-logo"
|
||||||
|
>
|
||||||
|
<j-upload
|
||||||
|
name="file"
|
||||||
|
:action="action"
|
||||||
|
:headers="headers"
|
||||||
|
:showUploadList="false"
|
||||||
|
:beforeUpload="
|
||||||
|
uploader.beforeIconUpload
|
||||||
|
"
|
||||||
|
@change="
|
||||||
|
uploader.changeIconUpload
|
||||||
|
"
|
||||||
|
:accept="uploader.iconTypes"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="upload-image-content-logo"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
v-if="
|
||||||
|
form.iconLoading
|
||||||
|
"
|
||||||
|
class="loading-icon"
|
||||||
|
>
|
||||||
|
<AIcon
|
||||||
|
type="LoadingOutlined"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="upload-image-icon"
|
||||||
|
v-if="formValue.ico"
|
||||||
|
:style="
|
||||||
|
formValue.ico
|
||||||
|
? `background-image: url(${formValue.ico});`
|
||||||
|
: ''
|
||||||
|
"
|
||||||
|
></div>
|
||||||
|
<div
|
||||||
|
v-if="formValue.ico"
|
||||||
|
class="upload-image-mask"
|
||||||
|
>
|
||||||
|
点击修改
|
||||||
|
</div>
|
||||||
|
<div v-else>
|
||||||
|
<div>
|
||||||
|
<AIcon
|
||||||
|
type="PlusOutlined"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</j-upload>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="upload-tips">
|
||||||
|
推荐尺寸64*64
|
||||||
|
</div>
|
||||||
|
<div class="upload-tips">
|
||||||
|
支持ico格式
|
||||||
|
</div>
|
||||||
|
</j-form-item>
|
||||||
|
</j-col>
|
||||||
|
</j-row>
|
||||||
|
</j-col>
|
||||||
|
<j-col :span="14">
|
||||||
|
<j-form-item label="登录背景图">
|
||||||
|
<div class="upload-image-warp-back">
|
||||||
|
<div class="upload-image-border-back">
|
||||||
|
<j-upload
|
||||||
|
name="file"
|
||||||
|
:action="action"
|
||||||
|
:headers="headers"
|
||||||
|
:beforeUpload="
|
||||||
|
uploader.beforeLogoUpload
|
||||||
|
"
|
||||||
|
:showUploadList="false"
|
||||||
|
@change="uploader.changeBackUpload"
|
||||||
|
:accept="uploader.imageTypes"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="upload-image-content-back"
|
||||||
|
>
|
||||||
<div
|
<div
|
||||||
class="upload-loading-mask"
|
v-if="form.backLoading"
|
||||||
|
class="loading-back"
|
||||||
>
|
>
|
||||||
<AIcon
|
<AIcon
|
||||||
type="LoadingOutlined"
|
type="LoadingOutlined"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="upload-tips">
|
|
||||||
推荐尺寸200*200
|
|
||||||
</div>
|
|
||||||
<div class="upload-tips">
|
|
||||||
支持jpg,png,jfif,pjp,pjpeg,jpeg
|
|
||||||
</div>
|
|
||||||
</j-form-item>
|
|
||||||
</j-col>
|
|
||||||
<j-col>
|
|
||||||
<j-form-item>
|
|
||||||
<template #label>
|
|
||||||
<span>浏览器页签</span>
|
|
||||||
<j-tooltip
|
|
||||||
title="浏览器tab页中显示的图片元素"
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
class="img-style"
|
|
||||||
:src="
|
|
||||||
getImage(
|
|
||||||
'/init-home/mark.png',
|
|
||||||
)
|
|
||||||
"
|
|
||||||
/>
|
|
||||||
</j-tooltip>
|
|
||||||
</template>
|
|
||||||
<div class="upload-image-warp-logo">
|
|
||||||
<div class="upload-image-border-logo">
|
|
||||||
<j-upload
|
|
||||||
name="file"
|
|
||||||
:action="action"
|
|
||||||
:headers="headers"
|
|
||||||
:showUploadList="false"
|
|
||||||
:beforeUpload="
|
|
||||||
uploader.beforeIconUpload
|
|
||||||
"
|
|
||||||
@change="
|
|
||||||
uploader.changeIconUpload
|
|
||||||
"
|
|
||||||
:accept="uploader.iconTypes"
|
|
||||||
>
|
|
||||||
<div
|
<div
|
||||||
class="upload-image-content-logo"
|
class="upload-image"
|
||||||
|
v-if="formValue.backgroud"
|
||||||
|
:style="
|
||||||
|
formValue.backgroud
|
||||||
|
? `background-image: url(${formValue.backgroud});`
|
||||||
|
: ''
|
||||||
|
"
|
||||||
|
></div>
|
||||||
|
<div
|
||||||
|
v-if="formValue.backgroud"
|
||||||
|
class="upload-image-mask"
|
||||||
>
|
>
|
||||||
<div
|
点击修改
|
||||||
v-if="form.iconLoading"
|
</div>
|
||||||
class="loading-icon"
|
<div v-else>
|
||||||
>
|
<div>
|
||||||
<AIcon
|
<AIcon
|
||||||
type="LoadingOutlined"
|
type="PlusOutlined"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div
|
|
||||||
class="upload-image-icon"
|
|
||||||
v-if="formValue.ico"
|
|
||||||
:style="
|
|
||||||
formValue.ico
|
|
||||||
? `background-image: url(${formValue.ico});`
|
|
||||||
: ''
|
|
||||||
"
|
|
||||||
></div>
|
|
||||||
<div
|
|
||||||
v-if="formValue.ico"
|
|
||||||
class="upload-image-mask"
|
|
||||||
>
|
|
||||||
点击修改
|
|
||||||
</div>
|
|
||||||
<div v-else>
|
|
||||||
<div>
|
|
||||||
<AIcon
|
|
||||||
type="PlusOutlined"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</j-upload>
|
</div>
|
||||||
</div>
|
</j-upload>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="upload-tips">推荐尺寸64*64</div>
|
|
||||||
<div class="upload-tips">支持ico格式</div>
|
|
||||||
</j-form-item>
|
|
||||||
</j-col>
|
|
||||||
</j-row>
|
|
||||||
</j-col>
|
|
||||||
<j-col :span="14">
|
|
||||||
<j-form-item label="登录背景图">
|
|
||||||
<div class="upload-image-warp-back">
|
|
||||||
<div class="upload-image-border-back">
|
|
||||||
<j-upload
|
|
||||||
name="file"
|
|
||||||
:action="action"
|
|
||||||
:headers="headers"
|
|
||||||
:beforeUpload="
|
|
||||||
uploader.beforeLogoUpload
|
|
||||||
"
|
|
||||||
:showUploadList="false"
|
|
||||||
@change="uploader.changeBackUpload"
|
|
||||||
:accept="uploader.imageTypes"
|
|
||||||
>
|
|
||||||
<div class="upload-image-content-back">
|
|
||||||
<div
|
|
||||||
v-if="form.backLoading"
|
|
||||||
class="loading-back"
|
|
||||||
>
|
|
||||||
<AIcon type="LoadingOutlined" />
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
class="upload-image"
|
|
||||||
v-if="formValue.backgroud"
|
|
||||||
:style="
|
|
||||||
formValue.backgroud
|
|
||||||
? `background-image: url(${formValue.backgroud});`
|
|
||||||
: ''
|
|
||||||
"
|
|
||||||
></div>
|
|
||||||
<div
|
|
||||||
v-if="formValue.backgroud"
|
|
||||||
class="upload-image-mask"
|
|
||||||
>
|
|
||||||
点击修改
|
|
||||||
</div>
|
|
||||||
<div v-else>
|
|
||||||
<div>
|
|
||||||
<AIcon
|
|
||||||
type="PlusOutlined"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</j-upload>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="upload-tips">
|
||||||
<div class="upload-tips">
|
支持4M以内的图片:
|
||||||
支持4M以内的图片:
|
支持jpg,png,jfif,pjp,pjpeg,jpeg
|
||||||
支持jpg,png,jfif,pjp,pjpeg,jpeg
|
</div>
|
||||||
</div>
|
<div class="upload-tips">建议尺寸1400x1080</div>
|
||||||
<div class="upload-tips">建议尺寸1400x1080</div>
|
</j-form-item>
|
||||||
</j-form-item>
|
</j-col>
|
||||||
</j-col>
|
</j-row>
|
||||||
</j-row>
|
</j-form>
|
||||||
</j-form>
|
|
||||||
|
|
||||||
<j-button
|
<j-button
|
||||||
type="primary"
|
type="primary"
|
||||||
@click="form.clickSave"
|
@click="form.clickSave"
|
||||||
:disabled="
|
:disabled="
|
||||||
form.saveLoading ||
|
form.saveLoading ||
|
||||||
form.logoLoading ||
|
form.logoLoading ||
|
||||||
form.iconLoading ||
|
form.iconLoading ||
|
||||||
form.backLoading
|
form.backLoading
|
||||||
"
|
"
|
||||||
>
|
>
|
||||||
保存
|
保存
|
||||||
</j-button>
|
</j-button>
|
||||||
</div>
|
</div>
|
||||||
|
</FullPage>
|
||||||
</page-container>
|
</page-container>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -6,133 +6,134 @@
|
||||||
target="category"
|
target="category"
|
||||||
@search="(params:any)=>queryParams = {...params}"
|
@search="(params:any)=>queryParams = {...params}"
|
||||||
/>
|
/>
|
||||||
|
<FullPage>
|
||||||
<j-pro-table
|
<j-pro-table
|
||||||
ref="tableRef"
|
ref="tableRef"
|
||||||
:columns="columns"
|
:columns="columns"
|
||||||
:request="getDataSourceList_api"
|
:request="getDataSourceList_api"
|
||||||
model="TABLE"
|
model="TABLE"
|
||||||
:params="queryParams"
|
:params="queryParams"
|
||||||
:defaultParams="{
|
:defaultParams="{
|
||||||
pageSize: 10,
|
pageSize: 10,
|
||||||
sorts: [{ name: 'createTime', order: 'desc' }],
|
sorts: [{ name: 'createTime', order: 'desc' }],
|
||||||
}"
|
}"
|
||||||
:pagination="{
|
:pagination="{
|
||||||
showSizeChanger: true,
|
showSizeChanger: true,
|
||||||
pageSizeOptions: ['10', '20', '50', '100'],
|
pageSizeOptions: ['10', '20', '50', '100'],
|
||||||
}"
|
}"
|
||||||
>
|
>
|
||||||
<template #headerTitle>
|
<template #headerTitle>
|
||||||
<PermissionButton
|
|
||||||
type="primary"
|
|
||||||
:hasPermission="`${permission}:add`"
|
|
||||||
@click="table.openDialog({})"
|
|
||||||
>
|
|
||||||
<AIcon type="PlusOutlined" />新增
|
|
||||||
</PermissionButton>
|
|
||||||
</template>
|
|
||||||
<template #state="slotProps">
|
|
||||||
<BadgeStatus
|
|
||||||
:status="slotProps.state?.value"
|
|
||||||
:text="slotProps.state?.text"
|
|
||||||
:statusNames="{
|
|
||||||
enabled: 'processing',
|
|
||||||
disabled: 'error',
|
|
||||||
}"
|
|
||||||
>
|
|
||||||
</BadgeStatus>
|
|
||||||
</template>
|
|
||||||
<template #typeId="slotProps">
|
|
||||||
{{
|
|
||||||
(table.typeOptions.value.length &&
|
|
||||||
table.getTypeLabel(slotProps.typeId)) ||
|
|
||||||
''
|
|
||||||
}}
|
|
||||||
</template>
|
|
||||||
<template #action="slotProps">
|
|
||||||
<j-space :size="16">
|
|
||||||
<PermissionButton
|
<PermissionButton
|
||||||
:hasPermission="`${permission}:update`"
|
type="primary"
|
||||||
type="link"
|
:hasPermission="`${permission}:add`"
|
||||||
:tooltip="{
|
@click="table.openDialog({})"
|
||||||
title: '编辑',
|
|
||||||
}"
|
|
||||||
@click="table.openDialog(slotProps)"
|
|
||||||
>
|
>
|
||||||
<AIcon type="EditOutlined" />
|
<AIcon type="PlusOutlined" />新增
|
||||||
</PermissionButton>
|
</PermissionButton>
|
||||||
<PermissionButton
|
</template>
|
||||||
:hasPermission="`${permission}:manage`"
|
<template #state="slotProps">
|
||||||
type="link"
|
<BadgeStatus
|
||||||
:tooltip="{
|
:status="slotProps.state?.value"
|
||||||
title:
|
:text="slotProps.state?.text"
|
||||||
slotProps?.typeId === 'rabbitmq'
|
:statusNames="{
|
||||||
? '暂不支持管理功能'
|
enabled: 'processing',
|
||||||
: table.getRowStatus(slotProps)
|
disabled: 'error',
|
||||||
? '管理'
|
|
||||||
: '请先启用数据源',
|
|
||||||
}"
|
|
||||||
@click="
|
|
||||||
() =>
|
|
||||||
router.push(
|
|
||||||
`/system/DataSource/Management?id=${slotProps.id}`,
|
|
||||||
)
|
|
||||||
"
|
|
||||||
:disabled="
|
|
||||||
slotProps?.typeId === 'rabbitmq' ||
|
|
||||||
!table.getRowStatus(slotProps)
|
|
||||||
"
|
|
||||||
>
|
|
||||||
<AIcon type="icon-ziyuankuguanli" />
|
|
||||||
</PermissionButton>
|
|
||||||
<PermissionButton
|
|
||||||
:hasPermission="`${permission}:action`"
|
|
||||||
type="link"
|
|
||||||
:popConfirm="{
|
|
||||||
title: `确定要${
|
|
||||||
table.getRowStatus(slotProps)
|
|
||||||
? '禁用'
|
|
||||||
: '启用'
|
|
||||||
}吗？`,
|
|
||||||
onConfirm: () =>
|
|
||||||
table.clickChangeStatus(slotProps),
|
|
||||||
}"
|
|
||||||
:tooltip="{
|
|
||||||
title: table.getRowStatus(slotProps)
|
|
||||||
? '禁用'
|
|
||||||
: '启用',
|
|
||||||
}"
|
}"
|
||||||
>
|
>
|
||||||
<AIcon
|
</BadgeStatus>
|
||||||
:type="
|
</template>
|
||||||
table.getRowStatus(slotProps)
|
<template #typeId="slotProps">
|
||||||
? 'StopOutlined'
|
{{
|
||||||
: 'PlayCircleOutlined'
|
(table.typeOptions.value.length &&
|
||||||
|
table.getTypeLabel(slotProps.typeId)) ||
|
||||||
|
''
|
||||||
|
}}
|
||||||
|
</template>
|
||||||
|
<template #action="slotProps">
|
||||||
|
<j-space :size="16">
|
||||||
|
<PermissionButton
|
||||||
|
:hasPermission="`${permission}:update`"
|
||||||
|
type="link"
|
||||||
|
:tooltip="{
|
||||||
|
title: '编辑',
|
||||||
|
}"
|
||||||
|
@click="table.openDialog(slotProps)"
|
||||||
|
>
|
||||||
|
<AIcon type="EditOutlined" />
|
||||||
|
</PermissionButton>
|
||||||
|
<PermissionButton
|
||||||
|
:hasPermission="`${permission}:manage`"
|
||||||
|
type="link"
|
||||||
|
:tooltip="{
|
||||||
|
title:
|
||||||
|
slotProps?.typeId === 'rabbitmq'
|
||||||
|
? '暂不支持管理功能'
|
||||||
|
: table.getRowStatus(slotProps)
|
||||||
|
? '管理'
|
||||||
|
: '请先启用数据源',
|
||||||
|
}"
|
||||||
|
@click="
|
||||||
|
() =>
|
||||||
|
router.push(
|
||||||
|
`/system/DataSource/Management?id=${slotProps.id}`,
|
||||||
|
)
|
||||||
"
|
"
|
||||||
/>
|
:disabled="
|
||||||
<!-- <AIcon type="PlayCircleOutlined" /> -->
|
slotProps?.typeId === 'rabbitmq' ||
|
||||||
</PermissionButton>
|
!table.getRowStatus(slotProps)
|
||||||
|
"
|
||||||
|
>
|
||||||
|
<AIcon type="icon-ziyuankuguanli" />
|
||||||
|
</PermissionButton>
|
||||||
|
<PermissionButton
|
||||||
|
:hasPermission="`${permission}:action`"
|
||||||
|
type="link"
|
||||||
|
:popConfirm="{
|
||||||
|
title: `确定要${
|
||||||
|
table.getRowStatus(slotProps)
|
||||||
|
? '禁用'
|
||||||
|
: '启用'
|
||||||
|
}吗？`,
|
||||||
|
onConfirm: () =>
|
||||||
|
table.clickChangeStatus(slotProps),
|
||||||
|
}"
|
||||||
|
:tooltip="{
|
||||||
|
title: table.getRowStatus(slotProps)
|
||||||
|
? '禁用'
|
||||||
|
: '启用',
|
||||||
|
}"
|
||||||
|
>
|
||||||
|
<AIcon
|
||||||
|
:type="
|
||||||
|
table.getRowStatus(slotProps)
|
||||||
|
? 'StopOutlined'
|
||||||
|
: 'PlayCircleOutlined'
|
||||||
|
"
|
||||||
|
/>
|
||||||
|
<!-- <AIcon type="PlayCircleOutlined" /> -->
|
||||||
|
</PermissionButton>
|
||||||
|
|
||||||
<PermissionButton
|
<PermissionButton
|
||||||
:hasPermission="`${permission}:delete`"
|
:hasPermission="`${permission}:delete`"
|
||||||
type="link"
|
type="link"
|
||||||
:tooltip="{
|
:tooltip="{
|
||||||
title: table.getRowStatus(slotProps)
|
title: table.getRowStatus(slotProps)
|
||||||
? '请先禁用，再删除'
|
? '请先禁用，再删除'
|
||||||
: '删除',
|
: '删除',
|
||||||
}"
|
}"
|
||||||
:danger="true"
|
:danger="true"
|
||||||
:popConfirm="{
|
:popConfirm="{
|
||||||
title: `确认删除`,
|
title: `确认删除`,
|
||||||
onConfirm: () => table.clickDel(slotProps),
|
onConfirm: () => table.clickDel(slotProps),
|
||||||
}"
|
}"
|
||||||
:disabled="table.getRowStatus(slotProps)"
|
:disabled="table.getRowStatus(slotProps)"
|
||||||
>
|
>
|
||||||
<AIcon type="DeleteOutlined" />
|
<AIcon type="DeleteOutlined" />
|
||||||
</PermissionButton>
|
</PermissionButton>
|
||||||
</j-space>
|
</j-space>
|
||||||
</template>
|
</template>
|
||||||
</j-pro-table>
|
</j-pro-table>
|
||||||
|
</FullPage>
|
||||||
|
|
||||||
<EditDialog
|
<EditDialog
|
||||||
v-if="dialog.visible"
|
v-if="dialog.visible"
|
||||||
|
|
@ -283,13 +284,13 @@ const table = {
|
||||||
// 刷新列表
|
// 刷新列表
|
||||||
refresh: () => {
|
refresh: () => {
|
||||||
tableRef.value.reload();
|
tableRef.value.reload();
|
||||||
dialog.visible = false
|
dialog.visible = false;
|
||||||
dialog.selectItem = {}
|
dialog.selectItem = {};
|
||||||
},
|
},
|
||||||
cancel: () => {
|
cancel: () => {
|
||||||
dialog.visible = false
|
dialog.visible = false;
|
||||||
dialog.selectItem = {}
|
dialog.selectItem = {};
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
table.getTypeOption();
|
table.getTypeOption();
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -5,170 +5,175 @@
|
||||||
target="category"
|
target="category"
|
||||||
@search="(params:any)=>queryParams = {...params}"
|
@search="(params:any)=>queryParams = {...params}"
|
||||||
/>
|
/>
|
||||||
<j-pro-table
|
<FullPage>
|
||||||
ref="tableRef"
|
<j-pro-table
|
||||||
:request="table.requestFun"
|
ref="tableRef"
|
||||||
:gridColumn="2"
|
:request="table.requestFun"
|
||||||
:params="queryParams"
|
:gridColumn="2"
|
||||||
:rowSelection="{
|
:params="queryParams"
|
||||||
selectedRowKeys: table._selectedRowKeys.value,
|
:rowSelection="{
|
||||||
onChange:(keys:string[])=>table._selectedRowKeys.value = [...keys],
|
selectedRowKeys: table._selectedRowKeys.value,
|
||||||
onSelectNone: table.cancelSelect
|
onChange:(keys:string[])=>table._selectedRowKeys.value = [...keys],
|
||||||
}"
|
onSelectNone: table.cancelSelect
|
||||||
:columns="columns"
|
}"
|
||||||
>
|
:columns="columns"
|
||||||
<template #headerTitle>
|
>
|
||||||
<j-space>
|
<template #headerTitle>
|
||||||
<PermissionButton
|
<j-space>
|
||||||
:hasPermission="`${permission}:assert`"
|
|
||||||
type="primary"
|
|
||||||
@click="table.clickAdd('handle')"
|
|
||||||
>
|
|
||||||
<AIcon type="PlusOutlined" />资产分配
|
|
||||||
</PermissionButton>
|
|
||||||
<j-dropdown trigger="hover">
|
|
||||||
<j-button>批量操作</j-button>
|
|
||||||
<template #overlay>
|
|
||||||
<j-menu>
|
|
||||||
<j-menu-item>
|
|
||||||
<PermissionButton
|
|
||||||
:hasPermission="`${permission}:bind`"
|
|
||||||
:popConfirm="{
|
|
||||||
title: `是否批量解除绑定`,
|
|
||||||
onConfirm: () =>
|
|
||||||
table.clickUnBind(),
|
|
||||||
}"
|
|
||||||
>
|
|
||||||
<AIcon
|
|
||||||
type="DisconnectOutlined"
|
|
||||||
/>批量解绑
|
|
||||||
</PermissionButton>
|
|
||||||
</j-menu-item>
|
|
||||||
<j-menu-item>
|
|
||||||
<PermissionButton
|
|
||||||
:hasPermission="`${permission}:assert`"
|
|
||||||
@click="table.clickEdit()"
|
|
||||||
>
|
|
||||||
<AIcon type="EditOutlined" />批量编辑
|
|
||||||
</PermissionButton>
|
|
||||||
</j-menu-item>
|
|
||||||
</j-menu>
|
|
||||||
</template>
|
|
||||||
</j-dropdown>
|
|
||||||
</j-space>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<template #card="slotProps">
|
|
||||||
<CardBox
|
|
||||||
:value="slotProps"
|
|
||||||
:actions="[{ key: 1 }]"
|
|
||||||
v-bind="slotProps"
|
|
||||||
:active="
|
|
||||||
table._selectedRowKeys.value.includes(slotProps.id)
|
|
||||||
"
|
|
||||||
@click="table.onSelectChange"
|
|
||||||
:status="slotProps.state?.value"
|
|
||||||
:statusText="slotProps.state?.text"
|
|
||||||
:statusNames="{
|
|
||||||
online: 'processing',
|
|
||||||
offline: 'error',
|
|
||||||
notActive: 'warning',
|
|
||||||
}"
|
|
||||||
>
|
|
||||||
<template #img>
|
|
||||||
<slot name="img">
|
|
||||||
<img
|
|
||||||
:src="getImage('/device-product.png')"
|
|
||||||
style="cursor: pointer"
|
|
||||||
/>
|
|
||||||
</slot>
|
|
||||||
</template>
|
|
||||||
<template #content>
|
|
||||||
<h3 class="card-item-content-title">
|
|
||||||
{{ slotProps.name }}
|
|
||||||
</h3>
|
|
||||||
<j-row>
|
|
||||||
<j-col :span="12">
|
|
||||||
<div class="card-item-content-text">ID</div>
|
|
||||||
<div
|
|
||||||
style="cursor: pointer"
|
|
||||||
class="card-item-content-value"
|
|
||||||
>
|
|
||||||
{{ slotProps.id }}
|
|
||||||
</div>
|
|
||||||
</j-col>
|
|
||||||
<j-col :span="12">
|
|
||||||
<div class="card-item-content-text">
|
|
||||||
资产权限
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
style="cursor: pointer"
|
|
||||||
class="card-item-content-value"
|
|
||||||
>
|
|
||||||
{{
|
|
||||||
table.permissionList.value.length &&
|
|
||||||
table.getPermissLabel(
|
|
||||||
slotProps.permission,
|
|
||||||
)
|
|
||||||
}}
|
|
||||||
</div>
|
|
||||||
</j-col>
|
|
||||||
</j-row>
|
|
||||||
</template>
|
|
||||||
<template #actions>
|
|
||||||
<PermissionButton
|
<PermissionButton
|
||||||
:hasPermission="`${permission}:assert`"
|
:hasPermission="`${permission}:assert`"
|
||||||
@click="table.clickEdit(slotProps)"
|
type="primary"
|
||||||
|
@click="table.clickAdd('handle')"
|
||||||
>
|
>
|
||||||
<AIcon type="EditOutlined" />
|
<AIcon type="PlusOutlined" />资产分配
|
||||||
</PermissionButton>
|
</PermissionButton>
|
||||||
|
<j-dropdown trigger="hover">
|
||||||
|
<j-button>批量操作</j-button>
|
||||||
|
<template #overlay>
|
||||||
|
<j-menu>
|
||||||
|
<j-menu-item>
|
||||||
|
<PermissionButton
|
||||||
|
:hasPermission="`${permission}:bind`"
|
||||||
|
:popConfirm="{
|
||||||
|
title: `是否批量解除绑定`,
|
||||||
|
onConfirm: () =>
|
||||||
|
table.clickUnBind(),
|
||||||
|
}"
|
||||||
|
>
|
||||||
|
<AIcon
|
||||||
|
type="DisconnectOutlined"
|
||||||
|
/>批量解绑
|
||||||
|
</PermissionButton>
|
||||||
|
</j-menu-item>
|
||||||
|
<j-menu-item>
|
||||||
|
<PermissionButton
|
||||||
|
:hasPermission="`${permission}:assert`"
|
||||||
|
@click="table.clickEdit()"
|
||||||
|
>
|
||||||
|
<AIcon
|
||||||
|
type="EditOutlined"
|
||||||
|
/>批量编辑
|
||||||
|
</PermissionButton>
|
||||||
|
</j-menu-item>
|
||||||
|
</j-menu>
|
||||||
|
</template>
|
||||||
|
</j-dropdown>
|
||||||
|
</j-space>
|
||||||
|
</template>
|
||||||
|
|
||||||
<PermissionButton
|
<template #card="slotProps">
|
||||||
:hasPermission="`${permission}:bind`"
|
<CardBox
|
||||||
:popConfirm="{
|
:value="slotProps"
|
||||||
title: `是否解除绑定`,
|
:actions="[{ key: 1 }]"
|
||||||
onConfirm: () => table.clickUnBind(slotProps),
|
v-bind="slotProps"
|
||||||
}"
|
:active="
|
||||||
>
|
table._selectedRowKeys.value.includes(slotProps.id)
|
||||||
<AIcon type="DisconnectOutlined" />
|
"
|
||||||
</PermissionButton>
|
@click="table.onSelectChange"
|
||||||
</template>
|
:status="slotProps.state?.value"
|
||||||
</CardBox>
|
:statusText="slotProps.state?.text"
|
||||||
</template>
|
:statusNames="{
|
||||||
|
online: 'processing',
|
||||||
<template #permission="slotProps">
|
offline: 'error',
|
||||||
{{
|
notActive: 'warning',
|
||||||
table.permissionList.value.length &&
|
}"
|
||||||
table.getPermissLabel(slotProps.permission)
|
|
||||||
}}
|
|
||||||
</template>
|
|
||||||
<template #state="slotProps">
|
|
||||||
<BadgeStatus
|
|
||||||
:status="slotProps.state.value"
|
|
||||||
:text="slotProps.state.text"
|
|
||||||
:statusNames="{
|
|
||||||
online: 'processing',
|
|
||||||
offline: 'error',
|
|
||||||
notActive: 'warning',
|
|
||||||
}"
|
|
||||||
></BadgeStatus>
|
|
||||||
</template>
|
|
||||||
<template #action="slotProps">
|
|
||||||
<j-space :size="16">
|
|
||||||
<PermissionButton
|
|
||||||
v-for="i in table.getActions(slotProps, 'table')"
|
|
||||||
:hasPermission="i.permission"
|
|
||||||
type="link"
|
|
||||||
:tooltip="i?.tooltip"
|
|
||||||
:pop-confirm="i.popConfirm"
|
|
||||||
@click="i.onClick"
|
|
||||||
:disabled="i?.disabled"
|
|
||||||
>
|
>
|
||||||
<AIcon :type="i.icon" />
|
<template #img>
|
||||||
</PermissionButton>
|
<slot name="img">
|
||||||
</j-space>
|
<img
|
||||||
</template>
|
:src="getImage('/device-product.png')"
|
||||||
</j-pro-table>
|
style="cursor: pointer"
|
||||||
|
/>
|
||||||
|
</slot>
|
||||||
|
</template>
|
||||||
|
<template #content>
|
||||||
|
<h3 class="card-item-content-title">
|
||||||
|
{{ slotProps.name }}
|
||||||
|
</h3>
|
||||||
|
<j-row>
|
||||||
|
<j-col :span="12">
|
||||||
|
<div class="card-item-content-text">ID</div>
|
||||||
|
<div
|
||||||
|
style="cursor: pointer"
|
||||||
|
class="card-item-content-value"
|
||||||
|
>
|
||||||
|
{{ slotProps.id }}
|
||||||
|
</div>
|
||||||
|
</j-col>
|
||||||
|
<j-col :span="12">
|
||||||
|
<div class="card-item-content-text">
|
||||||
|
资产权限
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
style="cursor: pointer"
|
||||||
|
class="card-item-content-value"
|
||||||
|
>
|
||||||
|
{{
|
||||||
|
table.permissionList.value.length &&
|
||||||
|
table.getPermissLabel(
|
||||||
|
slotProps.permission,
|
||||||
|
)
|
||||||
|
}}
|
||||||
|
</div>
|
||||||
|
</j-col>
|
||||||
|
</j-row>
|
||||||
|
</template>
|
||||||
|
<template #actions>
|
||||||
|
<PermissionButton
|
||||||
|
:hasPermission="`${permission}:assert`"
|
||||||
|
@click="table.clickEdit(slotProps)"
|
||||||
|
>
|
||||||
|
<AIcon type="EditOutlined" />
|
||||||
|
</PermissionButton>
|
||||||
|
|
||||||
|
<PermissionButton
|
||||||
|
:hasPermission="`${permission}:bind`"
|
||||||
|
:popConfirm="{
|
||||||
|
title: `是否解除绑定`,
|
||||||
|
onConfirm: () =>
|
||||||
|
table.clickUnBind(slotProps),
|
||||||
|
}"
|
||||||
|
>
|
||||||
|
<AIcon type="DisconnectOutlined" />
|
||||||
|
</PermissionButton>
|
||||||
|
</template>
|
||||||
|
</CardBox>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<template #permission="slotProps">
|
||||||
|
{{
|
||||||
|
table.permissionList.value.length &&
|
||||||
|
table.getPermissLabel(slotProps.permission)
|
||||||
|
}}
|
||||||
|
</template>
|
||||||
|
<template #state="slotProps">
|
||||||
|
<BadgeStatus
|
||||||
|
:status="slotProps.state.value"
|
||||||
|
:text="slotProps.state.text"
|
||||||
|
:statusNames="{
|
||||||
|
online: 'processing',
|
||||||
|
offline: 'error',
|
||||||
|
notActive: 'warning',
|
||||||
|
}"
|
||||||
|
></BadgeStatus>
|
||||||
|
</template>
|
||||||
|
<template #action="slotProps">
|
||||||
|
<j-space :size="16">
|
||||||
|
<PermissionButton
|
||||||
|
v-for="i in table.getActions(slotProps, 'table')"
|
||||||
|
:hasPermission="i.permission"
|
||||||
|
type="link"
|
||||||
|
:tooltip="i?.tooltip"
|
||||||
|
:pop-confirm="i.popConfirm"
|
||||||
|
@click="i.onClick"
|
||||||
|
:disabled="i?.disabled"
|
||||||
|
>
|
||||||
|
<AIcon :type="i.icon" />
|
||||||
|
</PermissionButton>
|
||||||
|
</j-space>
|
||||||
|
</template>
|
||||||
|
</j-pro-table>
|
||||||
|
</FullPage>
|
||||||
|
|
||||||
<div class="dialogs">
|
<div class="dialogs">
|
||||||
<AddDeviceOrProductDialog
|
<AddDeviceOrProductDialog
|
||||||
|
|
@ -471,7 +476,7 @@ const table = {
|
||||||
},
|
},
|
||||||
clickAdd: (type?: string) => {
|
clickAdd: (type?: string) => {
|
||||||
// 设备资产分配弹窗操作类型: type = 'handle': 手动点击资产分配按钮, !type产品资产分配后, 自动弹出设备资产分配
|
// 设备资产分配弹窗操作类型: type = 'handle': 手动点击资产分配按钮, !type产品资产分配后, 自动弹出设备资产分配
|
||||||
departmentStore.setType(type)
|
departmentStore.setType(type);
|
||||||
dialogs.addShow = true;
|
dialogs.addShow = true;
|
||||||
},
|
},
|
||||||
clickEdit: (row?: any) => {
|
clickEdit: (row?: any) => {
|
||||||
|
|
|
||||||
|
|
@ -5,193 +5,199 @@
|
||||||
target="category"
|
target="category"
|
||||||
@search="(params:any)=>queryParams = {...params}"
|
@search="(params:any)=>queryParams = {...params}"
|
||||||
/>
|
/>
|
||||||
<j-pro-table
|
<FullPage>
|
||||||
ref="tableRef"
|
<j-pro-table
|
||||||
:request="table.requestFun"
|
ref="tableRef"
|
||||||
:gridColumn="2"
|
:request="table.requestFun"
|
||||||
:params="queryParams"
|
:gridColumn="2"
|
||||||
:rowSelection="{
|
:params="queryParams"
|
||||||
selectedRowKeys: tableData._selectedRowKeys,
|
:rowSelection="{
|
||||||
onChange:(keys:string[])=>tableData._selectedRowKeys = [...keys],
|
selectedRowKeys: tableData._selectedRowKeys,
|
||||||
onSelectNone: table.cancelSelect
|
onChange:(keys:string[])=>tableData._selectedRowKeys = [...keys],
|
||||||
}"
|
onSelectNone: table.cancelSelect
|
||||||
:columns="columns"
|
}"
|
||||||
>
|
:columns="columns"
|
||||||
<template #headerTitle>
|
>
|
||||||
<j-space>
|
<template #headerTitle>
|
||||||
<PermissionButton
|
<j-space>
|
||||||
:hasPermission="`${permission}:assert`"
|
<PermissionButton
|
||||||
type="primary"
|
:hasPermission="`${permission}:assert`"
|
||||||
@click="dialogs.addShow = true"
|
type="primary"
|
||||||
>
|
@click="dialogs.addShow = true"
|
||||||
<AIcon type="PlusOutlined" />资产分配
|
|
||||||
</PermissionButton>
|
|
||||||
<j-dropdown trigger="hover">
|
|
||||||
<j-button>批量操作</j-button>
|
|
||||||
<template #overlay>
|
|
||||||
<j-menu>
|
|
||||||
<j-menu-item>
|
|
||||||
<PermissionButton
|
|
||||||
:hasPermission="`${permission}:bind`"
|
|
||||||
:popConfirm="{
|
|
||||||
title: `是否批量解除绑定`,
|
|
||||||
onConfirm: () =>
|
|
||||||
table.clickUnBind(),
|
|
||||||
}"
|
|
||||||
>
|
|
||||||
<AIcon
|
|
||||||
type="DisconnectOutlined"
|
|
||||||
/>批量解绑
|
|
||||||
</PermissionButton>
|
|
||||||
</j-menu-item>
|
|
||||||
<j-menu-item>
|
|
||||||
<PermissionButton
|
|
||||||
:hasPermission="`${permission}:assert`"
|
|
||||||
@click="() => table.clickEdit()"
|
|
||||||
>
|
|
||||||
<AIcon type="EditOutlined" />批量编辑
|
|
||||||
</PermissionButton>
|
|
||||||
</j-menu-item>
|
|
||||||
</j-menu>
|
|
||||||
</template>
|
|
||||||
</j-dropdown>
|
|
||||||
</j-space>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<template #card="slotProps">
|
|
||||||
<CardBox
|
|
||||||
:value="slotProps"
|
|
||||||
:actions="table.getActions(slotProps, 'card')"
|
|
||||||
v-bind="slotProps"
|
|
||||||
:active="tableData._selectedRowKeys.includes(slotProps.id)"
|
|
||||||
@click="table.onSelectChange"
|
|
||||||
:status="slotProps.state?.value"
|
|
||||||
:statusText="slotProps.state?.text"
|
|
||||||
:statusNames="{
|
|
||||||
online: 'processing',
|
|
||||||
offline: 'error',
|
|
||||||
}"
|
|
||||||
>
|
|
||||||
<template #img>
|
|
||||||
<slot name="img">
|
|
||||||
<img
|
|
||||||
:src="getImage('/device-product.png')"
|
|
||||||
style="cursor: pointer"
|
|
||||||
/>
|
|
||||||
</slot>
|
|
||||||
</template>
|
|
||||||
<template #content>
|
|
||||||
<h3 class="card-item-content-title">
|
|
||||||
{{ slotProps.name }}
|
|
||||||
</h3>
|
|
||||||
<j-row>
|
|
||||||
<j-col :span="12">
|
|
||||||
<div class="card-item-content-text">ID</div>
|
|
||||||
<div
|
|
||||||
style="cursor: pointer"
|
|
||||||
class="card-item-content-value"
|
|
||||||
>
|
|
||||||
{{ slotProps.id }}
|
|
||||||
</div>
|
|
||||||
</j-col>
|
|
||||||
<j-col :span="12">
|
|
||||||
<div class="card-item-content-text">
|
|
||||||
资产权限
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
style="cursor: pointer"
|
|
||||||
class="card-item-content-value"
|
|
||||||
>
|
|
||||||
{{
|
|
||||||
tableData.permissionList.length &&
|
|
||||||
table.getPermissLabel(
|
|
||||||
slotProps.permission,
|
|
||||||
)
|
|
||||||
}}
|
|
||||||
</div>
|
|
||||||
</j-col>
|
|
||||||
</j-row>
|
|
||||||
</template>
|
|
||||||
<template #actions="item">
|
|
||||||
<j-tooltip
|
|
||||||
v-bind="item.tooltip"
|
|
||||||
:title="item.disabled && item.tooltip.title"
|
|
||||||
>
|
>
|
||||||
<j-dropdown
|
<AIcon type="PlusOutlined" />资产分配
|
||||||
placement="bottomRight"
|
</PermissionButton>
|
||||||
v-if="item.key === 'others'"
|
<j-dropdown trigger="hover">
|
||||||
>
|
<j-button>批量操作</j-button>
|
||||||
<j-button>
|
<template #overlay>
|
||||||
<AIcon :type="item.icon" />
|
<j-menu>
|
||||||
<span>{{ item.text }}</span>
|
<j-menu-item>
|
||||||
</j-button>
|
<PermissionButton
|
||||||
<template #overlay>
|
:hasPermission="`${permission}:bind`"
|
||||||
<j-menu>
|
:popConfirm="{
|
||||||
<j-menu-item
|
title: `是否批量解除绑定`,
|
||||||
v-for="(o, i) in item.children"
|
onConfirm: () =>
|
||||||
:key="i"
|
table.clickUnBind(),
|
||||||
|
}"
|
||||||
>
|
>
|
||||||
<j-button
|
<AIcon
|
||||||
type="link"
|
type="DisconnectOutlined"
|
||||||
@click="o.onClick"
|
/>批量解绑
|
||||||
>
|
</PermissionButton>
|
||||||
<AIcon :type="o.icon" />
|
</j-menu-item>
|
||||||
<span>{{ o.text }}</span>
|
<j-menu-item>
|
||||||
</j-button>
|
<PermissionButton
|
||||||
</j-menu-item>
|
:hasPermission="`${permission}:assert`"
|
||||||
</j-menu>
|
@click="() => table.clickEdit()"
|
||||||
</template>
|
>
|
||||||
</j-dropdown>
|
<AIcon
|
||||||
<PermissionButton
|
type="EditOutlined"
|
||||||
v-else
|
/>批量编辑
|
||||||
:hasPermission="item.permission"
|
</PermissionButton>
|
||||||
:tooltip="item.tooltip"
|
</j-menu-item>
|
||||||
:pop-confirm="item.popConfirm"
|
</j-menu>
|
||||||
@click="item.onClick"
|
</template>
|
||||||
:disabled="item.disabled"
|
</j-dropdown>
|
||||||
>
|
</j-space>
|
||||||
<AIcon :type="item.icon" />
|
</template>
|
||||||
<span v-if="item.key !== 'delete'">{{
|
|
||||||
item.text
|
|
||||||
}}</span>
|
|
||||||
</PermissionButton>
|
|
||||||
</j-tooltip>
|
|
||||||
</template>
|
|
||||||
</CardBox>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<template #permission="slotProps">
|
<template #card="slotProps">
|
||||||
{{
|
<CardBox
|
||||||
tableData.permissionList.length &&
|
:value="slotProps"
|
||||||
table.getPermissLabel(slotProps.permission)
|
:actions="table.getActions(slotProps, 'card')"
|
||||||
}}
|
v-bind="slotProps"
|
||||||
</template>
|
:active="
|
||||||
<template #state="slotProps">
|
tableData._selectedRowKeys.includes(slotProps.id)
|
||||||
<BadgeStatus
|
"
|
||||||
:status="slotProps.state.value"
|
@click="table.onSelectChange"
|
||||||
:text="slotProps.state.text"
|
:status="slotProps.state?.value"
|
||||||
:statusNames="{
|
:statusText="slotProps.state?.text"
|
||||||
online: 'processing',
|
:statusNames="{
|
||||||
offline: 'error',
|
online: 'processing',
|
||||||
}"
|
offline: 'error',
|
||||||
></BadgeStatus>
|
}"
|
||||||
</template>
|
|
||||||
<template #action="slotProps">
|
|
||||||
<j-space :size="16">
|
|
||||||
<PermissionButton
|
|
||||||
v-for="i in table.getActions(slotProps, 'table')"
|
|
||||||
:hasPermission="i.permission"
|
|
||||||
type="link"
|
|
||||||
:tooltip="i?.tooltip"
|
|
||||||
:pop-confirm="i.popConfirm"
|
|
||||||
@click="i.onClick"
|
|
||||||
:disabled="i?.disabled"
|
|
||||||
>
|
>
|
||||||
<AIcon :type="i.icon" />
|
<template #img>
|
||||||
</PermissionButton>
|
<slot name="img">
|
||||||
</j-space>
|
<img
|
||||||
</template>
|
:src="getImage('/device-product.png')"
|
||||||
</j-pro-table>
|
style="cursor: pointer"
|
||||||
|
/>
|
||||||
|
</slot>
|
||||||
|
</template>
|
||||||
|
<template #content>
|
||||||
|
<h3 class="card-item-content-title">
|
||||||
|
{{ slotProps.name }}
|
||||||
|
</h3>
|
||||||
|
<j-row>
|
||||||
|
<j-col :span="12">
|
||||||
|
<div class="card-item-content-text">ID</div>
|
||||||
|
<div
|
||||||
|
style="cursor: pointer"
|
||||||
|
class="card-item-content-value"
|
||||||
|
>
|
||||||
|
{{ slotProps.id }}
|
||||||
|
</div>
|
||||||
|
</j-col>
|
||||||
|
<j-col :span="12">
|
||||||
|
<div class="card-item-content-text">
|
||||||
|
资产权限
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
style="cursor: pointer"
|
||||||
|
class="card-item-content-value"
|
||||||
|
>
|
||||||
|
{{
|
||||||
|
tableData.permissionList.length &&
|
||||||
|
table.getPermissLabel(
|
||||||
|
slotProps.permission,
|
||||||
|
)
|
||||||
|
}}
|
||||||
|
</div>
|
||||||
|
</j-col>
|
||||||
|
</j-row>
|
||||||
|
</template>
|
||||||
|
<template #actions="item">
|
||||||
|
<j-tooltip
|
||||||
|
v-bind="item.tooltip"
|
||||||
|
:title="item.disabled && item.tooltip.title"
|
||||||
|
>
|
||||||
|
<j-dropdown
|
||||||
|
placement="bottomRight"
|
||||||
|
v-if="item.key === 'others'"
|
||||||
|
>
|
||||||
|
<j-button>
|
||||||
|
<AIcon :type="item.icon" />
|
||||||
|
<span>{{ item.text }}</span>
|
||||||
|
</j-button>
|
||||||
|
<template #overlay>
|
||||||
|
<j-menu>
|
||||||
|
<j-menu-item
|
||||||
|
v-for="(o, i) in item.children"
|
||||||
|
:key="i"
|
||||||
|
>
|
||||||
|
<j-button
|
||||||
|
type="link"
|
||||||
|
@click="o.onClick"
|
||||||
|
>
|
||||||
|
<AIcon :type="o.icon" />
|
||||||
|
<span>{{ o.text }}</span>
|
||||||
|
</j-button>
|
||||||
|
</j-menu-item>
|
||||||
|
</j-menu>
|
||||||
|
</template>
|
||||||
|
</j-dropdown>
|
||||||
|
<PermissionButton
|
||||||
|
v-else
|
||||||
|
:hasPermission="item.permission"
|
||||||
|
:tooltip="item.tooltip"
|
||||||
|
:pop-confirm="item.popConfirm"
|
||||||
|
@click="item.onClick"
|
||||||
|
:disabled="item.disabled"
|
||||||
|
>
|
||||||
|
<AIcon :type="item.icon" />
|
||||||
|
<span v-if="item.key !== 'delete'">{{
|
||||||
|
item.text
|
||||||
|
}}</span>
|
||||||
|
</PermissionButton>
|
||||||
|
</j-tooltip>
|
||||||
|
</template>
|
||||||
|
</CardBox>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<template #permission="slotProps">
|
||||||
|
{{
|
||||||
|
tableData.permissionList.length &&
|
||||||
|
table.getPermissLabel(slotProps.permission)
|
||||||
|
}}
|
||||||
|
</template>
|
||||||
|
<template #state="slotProps">
|
||||||
|
<BadgeStatus
|
||||||
|
:status="slotProps.state.value"
|
||||||
|
:text="slotProps.state.text"
|
||||||
|
:statusNames="{
|
||||||
|
online: 'processing',
|
||||||
|
offline: 'error',
|
||||||
|
}"
|
||||||
|
></BadgeStatus>
|
||||||
|
</template>
|
||||||
|
<template #action="slotProps">
|
||||||
|
<j-space :size="16">
|
||||||
|
<PermissionButton
|
||||||
|
v-for="i in table.getActions(slotProps, 'table')"
|
||||||
|
:hasPermission="i.permission"
|
||||||
|
type="link"
|
||||||
|
:tooltip="i?.tooltip"
|
||||||
|
:pop-confirm="i.popConfirm"
|
||||||
|
@click="i.onClick"
|
||||||
|
:disabled="i?.disabled"
|
||||||
|
>
|
||||||
|
<AIcon :type="i.icon" />
|
||||||
|
</PermissionButton>
|
||||||
|
</j-space>
|
||||||
|
</template>
|
||||||
|
</j-pro-table>
|
||||||
|
</FullPage>
|
||||||
|
|
||||||
<div class="dialogs">
|
<div class="dialogs">
|
||||||
<AddDeviceOrProductDialog
|
<AddDeviceOrProductDialog
|
||||||
|
|
|
||||||
|
|
@ -5,72 +5,74 @@
|
||||||
target="category"
|
target="category"
|
||||||
@search="handleParams"
|
@search="handleParams"
|
||||||
/>
|
/>
|
||||||
<j-pro-table
|
<FullPage>
|
||||||
ref="tableRef"
|
<j-pro-table
|
||||||
:columns="columns"
|
ref="tableRef"
|
||||||
:request="table.requestFun"
|
:columns="columns"
|
||||||
:params="queryParams"
|
:request="table.requestFun"
|
||||||
:rowSelection="{
|
:params="queryParams"
|
||||||
selectedRowKeys: table._selectedRowKeys,
|
:rowSelection="{
|
||||||
onChange: table.onSelectChange,
|
selectedRowKeys: table._selectedRowKeys,
|
||||||
}"
|
onChange: table.onSelectChange,
|
||||||
@cancelSelect="table.cancelSelect"
|
}"
|
||||||
model="TABLE"
|
@cancelSelect="table.cancelSelect"
|
||||||
:defaultParams="{
|
model="TABLE"
|
||||||
pageSize: 10,
|
:defaultParams="{
|
||||||
}"
|
pageSize: 10,
|
||||||
:pagination="{
|
}"
|
||||||
showSizeChanger: true,
|
:pagination="{
|
||||||
pageSizeOptions: ['10', '20', '50', '100'],
|
showSizeChanger: true,
|
||||||
}"
|
pageSizeOptions: ['10', '20', '50', '100'],
|
||||||
>
|
}"
|
||||||
<template #headerTitle>
|
>
|
||||||
<PermissionButton
|
<template #headerTitle>
|
||||||
type="primary"
|
<PermissionButton
|
||||||
:hasPermission="`${permission}:bind-user`"
|
type="primary"
|
||||||
@click="dialogVisible = true"
|
:hasPermission="`${permission}:bind-user`"
|
||||||
style="margin-right: 15px"
|
@click="dialogVisible = true"
|
||||||
>
|
style="margin-right: 15px"
|
||||||
<AIcon type="PlusOutlined" />绑定用户
|
>
|
||||||
</PermissionButton>
|
<AIcon type="PlusOutlined" />绑定用户
|
||||||
<div
|
</PermissionButton>
|
||||||
style="display: inline-block; width: 12px; height: 1px"
|
<div
|
||||||
></div>
|
style="display: inline-block; width: 12px; height: 1px"
|
||||||
<PermissionButton
|
></div>
|
||||||
:hasPermission="`${permission}:bind`"
|
|
||||||
:popConfirm="{
|
|
||||||
title: `是否解除绑定`,
|
|
||||||
onConfirm: () => table.unBind(),
|
|
||||||
}"
|
|
||||||
>
|
|
||||||
<AIcon type="DisconnectOutlined" />批量解绑
|
|
||||||
</PermissionButton>
|
|
||||||
</template>
|
|
||||||
<template #status="slotProps">
|
|
||||||
<BadgeStatus
|
|
||||||
:status="slotProps.status"
|
|
||||||
:text="slotProps.status ? '正常' : '禁用'"
|
|
||||||
:statusNames="{
|
|
||||||
1: 'success',
|
|
||||||
0: 'error',
|
|
||||||
}"
|
|
||||||
></BadgeStatus>
|
|
||||||
</template>
|
|
||||||
<template #action="slotProps">
|
|
||||||
<j-space :size="16">
|
|
||||||
<PermissionButton
|
<PermissionButton
|
||||||
type="link"
|
|
||||||
:hasPermission="`${permission}:bind`"
|
:hasPermission="`${permission}:bind`"
|
||||||
:popConfirm="{
|
:popConfirm="{
|
||||||
title: `是否解除绑定`,
|
title: `是否解除绑定`,
|
||||||
onConfirm: () => table.unBind(slotProps),
|
onConfirm: () => table.unBind(),
|
||||||
}"
|
}"
|
||||||
>
|
>
|
||||||
<AIcon type="DisconnectOutlined" />
|
<AIcon type="DisconnectOutlined" />批量解绑
|
||||||
</PermissionButton>
|
</PermissionButton>
|
||||||
</j-space>
|
</template>
|
||||||
</template>
|
<template #status="slotProps">
|
||||||
</j-pro-table>
|
<BadgeStatus
|
||||||
|
:status="slotProps.status"
|
||||||
|
:text="slotProps.status ? '正常' : '禁用'"
|
||||||
|
:statusNames="{
|
||||||
|
1: 'success',
|
||||||
|
0: 'error',
|
||||||
|
}"
|
||||||
|
></BadgeStatus>
|
||||||
|
</template>
|
||||||
|
<template #action="slotProps">
|
||||||
|
<j-space :size="16">
|
||||||
|
<PermissionButton
|
||||||
|
type="link"
|
||||||
|
:hasPermission="`${permission}:bind`"
|
||||||
|
:popConfirm="{
|
||||||
|
title: `是否解除绑定`,
|
||||||
|
onConfirm: () => table.unBind(slotProps),
|
||||||
|
}"
|
||||||
|
>
|
||||||
|
<AIcon type="DisconnectOutlined" />
|
||||||
|
</PermissionButton>
|
||||||
|
</j-space>
|
||||||
|
</template>
|
||||||
|
</j-pro-table>
|
||||||
|
</FullPage>
|
||||||
|
|
||||||
<div class="dialogs">
|
<div class="dialogs">
|
||||||
<AddBindUserDialog
|
<AddBindUserDialog
|
||||||
|
|
@ -150,8 +152,8 @@ const columns = [
|
||||||
const queryParams = ref({});
|
const queryParams = ref({});
|
||||||
|
|
||||||
const handleParams = (params: any) => {
|
const handleParams = (params: any) => {
|
||||||
queryParams.value = params
|
queryParams.value = params;
|
||||||
}
|
};
|
||||||
|
|
||||||
// 表格
|
// 表格
|
||||||
const tableRef = ref<Record<string, any>>({}); // 表格实例
|
const tableRef = ref<Record<string, any>>({}); // 表格实例
|
||||||
|
|
@ -174,7 +176,7 @@ const table = reactive({
|
||||||
value: props.parentId,
|
value: props.parentId,
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
type: 'and'
|
type: 'and',
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -6,70 +6,73 @@
|
||||||
target="category"
|
target="category"
|
||||||
@search="handleSearch"
|
@search="handleSearch"
|
||||||
/>
|
/>
|
||||||
|
<FullPage>
|
||||||
<j-pro-table
|
<j-pro-table
|
||||||
ref="tableRef"
|
ref="tableRef"
|
||||||
:columns="columns"
|
:columns="columns"
|
||||||
:request="table.getList"
|
:request="table.getList"
|
||||||
model="TABLE"
|
model="TABLE"
|
||||||
:params="queryParams"
|
:params="queryParams"
|
||||||
noPagination
|
noPagination
|
||||||
v-model:expandedRowKeys="expandedRowKeys"
|
v-model:expandedRowKeys="expandedRowKeys"
|
||||||
>
|
>
|
||||||
<template #headerTitle>
|
<template #headerTitle>
|
||||||
<PermissionButton
|
|
||||||
type="primary"
|
|
||||||
:hasPermission="`${permission}:add`"
|
|
||||||
@click="table.toDetails({})"
|
|
||||||
>
|
|
||||||
<AIcon type="PlusOutlined" />新增
|
|
||||||
</PermissionButton>
|
|
||||||
<j-button
|
|
||||||
style="margin-left: 12px"
|
|
||||||
@click="router.push('/system/Menu/Setting')"
|
|
||||||
>菜单配置</j-button
|
|
||||||
>
|
|
||||||
</template>
|
|
||||||
<template #createTime="slotProps">
|
|
||||||
{{
|
|
||||||
dayjs(slotProps.createTime).format('YYYY-MM-DD HH:mm:ss')
|
|
||||||
}}
|
|
||||||
</template>
|
|
||||||
<template #action="slotProps">
|
|
||||||
<j-space :size="16">
|
|
||||||
<j-tooltip>
|
|
||||||
<template #title>查看</template>
|
|
||||||
<j-button
|
|
||||||
style="padding: 0"
|
|
||||||
type="link"
|
|
||||||
@click="table.toDetails(slotProps)"
|
|
||||||
>
|
|
||||||
<AIcon type="SearchOutlined" />
|
|
||||||
</j-button>
|
|
||||||
</j-tooltip>
|
|
||||||
|
|
||||||
<PermissionButton
|
<PermissionButton
|
||||||
type="link"
|
type="primary"
|
||||||
:hasPermission="`${permission}:add`"
|
:hasPermission="`${permission}:add`"
|
||||||
:tooltip="{ title: '新增子菜单' }"
|
@click="table.toDetails({})"
|
||||||
@click="table.addChildren(slotProps)"
|
|
||||||
>
|
>
|
||||||
<AIcon type="PlusCircleOutlined" />
|
<AIcon type="PlusOutlined" />新增
|
||||||
</PermissionButton>
|
</PermissionButton>
|
||||||
<PermissionButton
|
<j-button
|
||||||
type="link"
|
style="margin-left: 12px"
|
||||||
:hasPermission="`${permission}:delete`"
|
@click="router.push('/system/Menu/Setting')"
|
||||||
:tooltip="{ title: '删除' }"
|
>菜单配置</j-button
|
||||||
:popConfirm="{
|
|
||||||
title: `是否删除该菜单`,
|
|
||||||
onConfirm: () => table.clickDel(slotProps),
|
|
||||||
}"
|
|
||||||
>
|
>
|
||||||
<AIcon type="DeleteOutlined" />
|
</template>
|
||||||
</PermissionButton>
|
<template #createTime="slotProps">
|
||||||
</j-space>
|
{{
|
||||||
</template>
|
dayjs(slotProps.createTime).format(
|
||||||
</j-pro-table>
|
'YYYY-MM-DD HH:mm:ss',
|
||||||
|
)
|
||||||
|
}}
|
||||||
|
</template>
|
||||||
|
<template #action="slotProps">
|
||||||
|
<j-space :size="16">
|
||||||
|
<j-tooltip>
|
||||||
|
<template #title>查看</template>
|
||||||
|
<j-button
|
||||||
|
style="padding: 0"
|
||||||
|
type="link"
|
||||||
|
@click="table.toDetails(slotProps)"
|
||||||
|
>
|
||||||
|
<AIcon type="SearchOutlined" />
|
||||||
|
</j-button>
|
||||||
|
</j-tooltip>
|
||||||
|
|
||||||
|
<PermissionButton
|
||||||
|
type="link"
|
||||||
|
:hasPermission="`${permission}:add`"
|
||||||
|
:tooltip="{ title: '新增子菜单' }"
|
||||||
|
@click="table.addChildren(slotProps)"
|
||||||
|
>
|
||||||
|
<AIcon type="PlusCircleOutlined" />
|
||||||
|
</PermissionButton>
|
||||||
|
<PermissionButton
|
||||||
|
type="link"
|
||||||
|
:hasPermission="`${permission}:delete`"
|
||||||
|
:tooltip="{ title: '删除' }"
|
||||||
|
:popConfirm="{
|
||||||
|
title: `是否删除该菜单`,
|
||||||
|
onConfirm: () => table.clickDel(slotProps),
|
||||||
|
}"
|
||||||
|
>
|
||||||
|
<AIcon type="DeleteOutlined" />
|
||||||
|
</PermissionButton>
|
||||||
|
</j-space>
|
||||||
|
</template>
|
||||||
|
</j-pro-table>
|
||||||
|
</FullPage>
|
||||||
</div>
|
</div>
|
||||||
</page-container>
|
</page-container>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
||||||
|
|
@ -6,134 +6,136 @@
|
||||||
target="system-permission"
|
target="system-permission"
|
||||||
@search="handleSearch"
|
@search="handleSearch"
|
||||||
/>
|
/>
|
||||||
|
<FullPage>
|
||||||
<j-pro-table
|
<j-pro-table
|
||||||
ref="tableRef"
|
ref="tableRef"
|
||||||
:columns="columns"
|
:columns="columns"
|
||||||
:request="getPermission_api"
|
:request="getPermission_api"
|
||||||
model="TABLE"
|
model="TABLE"
|
||||||
:params="queryParams"
|
:params="queryParams"
|
||||||
:defaultParams="{
|
:defaultParams="{
|
||||||
pageSize: 10,
|
pageSize: 10,
|
||||||
sorts: [{ name: 'id', order: 'asc' }],
|
sorts: [{ name: 'id', order: 'asc' }],
|
||||||
}"
|
}"
|
||||||
:pagination="{
|
:pagination="{
|
||||||
showSizeChanger: true,
|
showSizeChanger: true,
|
||||||
pageSizeOptions: ['10', '20', '50', '100'],
|
pageSizeOptions: ['10', '20', '50', '100'],
|
||||||
}"
|
}"
|
||||||
>
|
>
|
||||||
<template #headerTitle>
|
<template #headerTitle>
|
||||||
<PermissionButton
|
<PermissionButton
|
||||||
type="primary"
|
type="primary"
|
||||||
:hasPermission="`${permission}:add`"
|
:hasPermission="`${permission}:add`"
|
||||||
@click="table.openDialog(undefined)"
|
@click="table.openDialog(undefined)"
|
||||||
>
|
>
|
||||||
<AIcon type="PlusOutlined" />新增
|
<AIcon type="PlusOutlined" />新增
|
||||||
</PermissionButton>
|
</PermissionButton>
|
||||||
<j-dropdown trigger="hover">
|
<j-dropdown trigger="hover">
|
||||||
<j-button>批量操作</j-button>
|
<j-button>批量操作</j-button>
|
||||||
<template #overlay>
|
<template #overlay>
|
||||||
<j-menu>
|
<j-menu>
|
||||||
<j-menu-item>
|
<j-menu-item>
|
||||||
<j-upload
|
<j-upload
|
||||||
name="file"
|
name="file"
|
||||||
action="#"
|
action="#"
|
||||||
accept=".json"
|
accept=".json"
|
||||||
:showUploadList="false"
|
:showUploadList="false"
|
||||||
:before-upload="table.clickImport"
|
:before-upload="table.clickImport"
|
||||||
:disabled="
|
:disabled="
|
||||||
!hasPermission(
|
!hasPermission(
|
||||||
`${permission}:import`,
|
`${permission}:import`,
|
||||||
)
|
)
|
||||||
"
|
"
|
||||||
>
|
|
||||||
<PermissionButton
|
|
||||||
:hasPermission="`${permission}:import`"
|
|
||||||
>
|
>
|
||||||
导入
|
<PermissionButton
|
||||||
|
:hasPermission="`${permission}:import`"
|
||||||
|
>
|
||||||
|
导入
|
||||||
|
</PermissionButton>
|
||||||
|
</j-upload>
|
||||||
|
</j-menu-item>
|
||||||
|
<j-menu-item>
|
||||||
|
<PermissionButton
|
||||||
|
:hasPermission="`${permission}:export`"
|
||||||
|
:popConfirm="{
|
||||||
|
title: `确认导出？`,
|
||||||
|
onConfirm: () =>
|
||||||
|
table.clickExport(),
|
||||||
|
}"
|
||||||
|
>
|
||||||
|
导出
|
||||||
</PermissionButton>
|
</PermissionButton>
|
||||||
</j-upload>
|
</j-menu-item>
|
||||||
</j-menu-item>
|
</j-menu>
|
||||||
<j-menu-item>
|
</template>
|
||||||
<PermissionButton
|
</j-dropdown>
|
||||||
:hasPermission="`${permission}:export`"
|
</template>
|
||||||
:popConfirm="{
|
<template #status="slotProps">
|
||||||
title: `确认导出？`,
|
<BadgeStatus
|
||||||
onConfirm: () =>
|
:status="slotProps.status"
|
||||||
table.clickExport(),
|
:text="slotProps.status ? '启用' : '禁用'"
|
||||||
}"
|
:statusNames="{
|
||||||
>
|
1: 'success',
|
||||||
导出
|
0: 'error',
|
||||||
</PermissionButton>
|
|
||||||
</j-menu-item>
|
|
||||||
</j-menu>
|
|
||||||
</template>
|
|
||||||
</j-dropdown>
|
|
||||||
</template>
|
|
||||||
<template #status="slotProps">
|
|
||||||
<BadgeStatus
|
|
||||||
:status="slotProps.status"
|
|
||||||
:text="slotProps.status ? '启用' : '禁用'"
|
|
||||||
:statusNames="{
|
|
||||||
1: 'success',
|
|
||||||
0: 'error',
|
|
||||||
}"
|
|
||||||
></BadgeStatus>
|
|
||||||
</template>
|
|
||||||
<template #action="slotProps">
|
|
||||||
<j-space :size="16">
|
|
||||||
<PermissionButton
|
|
||||||
:hasPermission="`${permission}:update`"
|
|
||||||
type="link"
|
|
||||||
:tooltip="{
|
|
||||||
title: '编辑',
|
|
||||||
}"
|
}"
|
||||||
@click="table.openDialog(slotProps)"
|
></BadgeStatus>
|
||||||
>
|
</template>
|
||||||
<AIcon type="EditOutlined" />
|
<template #action="slotProps">
|
||||||
</PermissionButton>
|
<j-space :size="16">
|
||||||
|
<PermissionButton
|
||||||
|
:hasPermission="`${permission}:update`"
|
||||||
|
type="link"
|
||||||
|
:tooltip="{
|
||||||
|
title: '编辑',
|
||||||
|
}"
|
||||||
|
@click="table.openDialog(slotProps)"
|
||||||
|
>
|
||||||
|
<AIcon type="EditOutlined" />
|
||||||
|
</PermissionButton>
|
||||||
|
|
||||||
<PermissionButton
|
<PermissionButton
|
||||||
:hasPermission="`${permission}:action`"
|
:hasPermission="`${permission}:action`"
|
||||||
type="link"
|
type="link"
|
||||||
:popConfirm="{
|
:popConfirm="{
|
||||||
title: `确定要${
|
title: `确定要${
|
||||||
slotProps.status ? '禁用' : '启用'
|
slotProps.status ? '禁用' : '启用'
|
||||||
}吗？`,
|
}吗？`,
|
||||||
onConfirm: () => table.changeStatus(slotProps),
|
onConfirm: () =>
|
||||||
}"
|
table.changeStatus(slotProps),
|
||||||
:tooltip="{
|
}"
|
||||||
title: slotProps.status ? '禁用' : '启用',
|
:tooltip="{
|
||||||
}"
|
title: slotProps.status ? '禁用' : '启用',
|
||||||
>
|
}"
|
||||||
<AIcon
|
>
|
||||||
:type="
|
<AIcon
|
||||||
slotProps.status
|
:type="
|
||||||
? 'StopOutlined'
|
slotProps.status
|
||||||
: 'PlayCircleOutlined'
|
? 'StopOutlined'
|
||||||
"
|
: 'PlayCircleOutlined'
|
||||||
/>
|
"
|
||||||
</PermissionButton>
|
/>
|
||||||
|
</PermissionButton>
|
||||||
|
|
||||||
<PermissionButton
|
<PermissionButton
|
||||||
:hasPermission="`${permission}:delete`"
|
:hasPermission="`${permission}:delete`"
|
||||||
type="link"
|
type="link"
|
||||||
:tooltip="{
|
:tooltip="{
|
||||||
title: slotProps.status
|
title: slotProps.status
|
||||||
? '请先禁用，再删除'
|
? '请先禁用，再删除'
|
||||||
: '删除',
|
: '删除',
|
||||||
}"
|
}"
|
||||||
:popConfirm="{
|
:popConfirm="{
|
||||||
title: `确认删除`,
|
title: `确认删除`,
|
||||||
onConfirm: () => table.clickDel(slotProps),
|
onConfirm: () => table.clickDel(slotProps),
|
||||||
}"
|
}"
|
||||||
:disabled="slotProps.status"
|
:disabled="slotProps.status"
|
||||||
>
|
>
|
||||||
<AIcon type="DeleteOutlined" />
|
<AIcon type="DeleteOutlined" />
|
||||||
</PermissionButton>
|
</PermissionButton>
|
||||||
</j-space>
|
</j-space>
|
||||||
</template>
|
</template>
|
||||||
</j-pro-table>
|
</j-pro-table>
|
||||||
|
</FullPage>
|
||||||
|
|
||||||
<EditDialog
|
<EditDialog
|
||||||
v-if="dialog.visible"
|
v-if="dialog.visible"
|
||||||
|
|
|
||||||
|
|
@ -6,60 +6,61 @@
|
||||||
target="category"
|
target="category"
|
||||||
@search="(params:any)=>queryParams = {...params}"
|
@search="(params:any)=>queryParams = {...params}"
|
||||||
/>
|
/>
|
||||||
|
<FullPage>
|
||||||
<j-pro-table
|
<j-pro-table
|
||||||
ref="tableRef"
|
ref="tableRef"
|
||||||
:columns="columns"
|
:columns="columns"
|
||||||
:request="getRelationshipList_api"
|
:request="getRelationshipList_api"
|
||||||
model="TABLE"
|
model="TABLE"
|
||||||
:params="queryParams"
|
:params="queryParams"
|
||||||
:defaultParams="{
|
:defaultParams="{
|
||||||
pageSize: 10,
|
pageSize: 10,
|
||||||
sorts: [{ name: 'createTime', order: 'desc' }],
|
sorts: [{ name: 'createTime', order: 'desc' }],
|
||||||
}"
|
}"
|
||||||
:pagination="{
|
:pagination="{
|
||||||
showSizeChanger: true,
|
showSizeChanger: true,
|
||||||
pageSizeOptions: ['10', '20', '50', '100'],
|
pageSizeOptions: ['10', '20', '50', '100'],
|
||||||
}"
|
}"
|
||||||
>
|
>
|
||||||
<template #headerTitle>
|
<template #headerTitle>
|
||||||
<PermissionButton
|
|
||||||
type="primary"
|
|
||||||
:hasPermission="`${permission}:add`"
|
|
||||||
@click="table.openDialog(undefined)"
|
|
||||||
>
|
|
||||||
<AIcon type="PlusOutlined" />新增
|
|
||||||
</PermissionButton>
|
|
||||||
</template>
|
|
||||||
<template #action="slotProps">
|
|
||||||
<j-space :size="16">
|
|
||||||
<PermissionButton
|
<PermissionButton
|
||||||
:hasPermission="`${permission}:update`"
|
type="primary"
|
||||||
type="link"
|
:hasPermission="`${permission}:add`"
|
||||||
:tooltip="{
|
@click="table.openDialog(undefined)"
|
||||||
title: '编辑',
|
|
||||||
}"
|
|
||||||
@click="table.openDialog(slotProps)"
|
|
||||||
>
|
>
|
||||||
<AIcon type="EditOutlined" />
|
<AIcon type="PlusOutlined" />新增
|
||||||
</PermissionButton>
|
</PermissionButton>
|
||||||
|
</template>
|
||||||
|
<template #action="slotProps">
|
||||||
|
<j-space :size="16">
|
||||||
|
<PermissionButton
|
||||||
|
:hasPermission="`${permission}:update`"
|
||||||
|
type="link"
|
||||||
|
:tooltip="{
|
||||||
|
title: '编辑',
|
||||||
|
}"
|
||||||
|
@click="table.openDialog(slotProps)"
|
||||||
|
>
|
||||||
|
<AIcon type="EditOutlined" />
|
||||||
|
</PermissionButton>
|
||||||
|
|
||||||
<PermissionButton
|
<PermissionButton
|
||||||
:danger="true"
|
:danger="true"
|
||||||
:hasPermission="`${permission}:delete`"
|
:hasPermission="`${permission}:delete`"
|
||||||
type="link"
|
type="link"
|
||||||
:tooltip="{ title: '删除' }"
|
:tooltip="{ title: '删除' }"
|
||||||
:popConfirm="{
|
:popConfirm="{
|
||||||
title: `确认删除`,
|
title: `确认删除`,
|
||||||
onConfirm: () => table.clickDel(slotProps),
|
onConfirm: () => table.clickDel(slotProps),
|
||||||
}"
|
}"
|
||||||
:disabled="slotProps.status"
|
:disabled="slotProps.status"
|
||||||
>
|
>
|
||||||
<AIcon type="DeleteOutlined" />
|
<AIcon type="DeleteOutlined" />
|
||||||
</PermissionButton>
|
</PermissionButton>
|
||||||
</j-space>
|
</j-space>
|
||||||
</template>
|
</template>
|
||||||
</j-pro-table>
|
</j-pro-table>
|
||||||
|
</FullPage>
|
||||||
|
|
||||||
<EditDialog
|
<EditDialog
|
||||||
v-if="dialog.visible"
|
v-if="dialog.visible"
|
||||||
|
|
|
||||||
|
|
@ -6,65 +6,66 @@
|
||||||
target="category"
|
target="category"
|
||||||
@search="(params:any)=>queryParams = {...params}"
|
@search="(params:any)=>queryParams = {...params}"
|
||||||
/>
|
/>
|
||||||
|
<FullPage>
|
||||||
<j-pro-table
|
<j-pro-table
|
||||||
ref="tableRef"
|
ref="tableRef"
|
||||||
:columns="columns"
|
:columns="columns"
|
||||||
:request="getRoleList_api"
|
:request="getRoleList_api"
|
||||||
model="TABLE"
|
model="TABLE"
|
||||||
:params="queryParams"
|
:params="queryParams"
|
||||||
:defaultParams="{
|
:defaultParams="{
|
||||||
pageSize: 10,
|
pageSize: 10,
|
||||||
sorts: [
|
sorts: [
|
||||||
{ name: 'createTime', order: 'desc' },
|
{ name: 'createTime', order: 'desc' },
|
||||||
{ name: 'id', order: 'desc' },
|
{ name: 'id', order: 'desc' },
|
||||||
],
|
],
|
||||||
}"
|
}"
|
||||||
:pagination="{
|
:pagination="{
|
||||||
showSizeChanger: true,
|
showSizeChanger: true,
|
||||||
pageSizeOptions: ['10', '20', '50', '100'],
|
pageSizeOptions: ['10', '20', '50', '100'],
|
||||||
}"
|
}"
|
||||||
>
|
>
|
||||||
<template #headerTitle>
|
<template #headerTitle>
|
||||||
<PermissionButton
|
|
||||||
type="primary"
|
|
||||||
:hasPermission="`${permission}:add`"
|
|
||||||
@click="dialogVisible = true"
|
|
||||||
>
|
|
||||||
<AIcon type="PlusOutlined" />新增
|
|
||||||
</PermissionButton>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<template #action="slotProps">
|
|
||||||
<j-space :size="16">
|
|
||||||
<PermissionButton
|
<PermissionButton
|
||||||
:hasPermission="`${permission}:update`"
|
type="primary"
|
||||||
type="link"
|
:hasPermission="`${permission}:add`"
|
||||||
:tooltip="{
|
@click="dialogVisible = true"
|
||||||
title: '编辑',
|
|
||||||
}"
|
|
||||||
@click="
|
|
||||||
jumpPage(`system/Role/Detail`, {
|
|
||||||
id: slotProps.id,
|
|
||||||
})
|
|
||||||
"
|
|
||||||
>
|
>
|
||||||
<AIcon type="EditOutlined" />
|
<AIcon type="PlusOutlined" />新增
|
||||||
</PermissionButton>
|
</PermissionButton>
|
||||||
<PermissionButton
|
</template>
|
||||||
type="link"
|
|
||||||
:hasPermission="`${permission}:delete`"
|
<template #action="slotProps">
|
||||||
:tooltip="{ title: '删除' }"
|
<j-space :size="16">
|
||||||
:popConfirm="{
|
<PermissionButton
|
||||||
title: `确定要删除吗`,
|
:hasPermission="`${permission}:update`"
|
||||||
onConfirm: () => clickDel(slotProps),
|
type="link"
|
||||||
}"
|
:tooltip="{
|
||||||
>
|
title: '编辑',
|
||||||
<AIcon type="DeleteOutlined" />
|
}"
|
||||||
</PermissionButton>
|
@click="
|
||||||
</j-space>
|
jumpPage(`system/Role/Detail`, {
|
||||||
</template>
|
id: slotProps.id,
|
||||||
</j-pro-table>
|
})
|
||||||
|
"
|
||||||
|
>
|
||||||
|
<AIcon type="EditOutlined" />
|
||||||
|
</PermissionButton>
|
||||||
|
<PermissionButton
|
||||||
|
type="link"
|
||||||
|
:hasPermission="`${permission}:delete`"
|
||||||
|
:tooltip="{ title: '删除' }"
|
||||||
|
:popConfirm="{
|
||||||
|
title: `确定要删除吗`,
|
||||||
|
onConfirm: () => clickDel(slotProps),
|
||||||
|
}"
|
||||||
|
>
|
||||||
|
<AIcon type="DeleteOutlined" />
|
||||||
|
</PermissionButton>
|
||||||
|
</j-space>
|
||||||
|
</template>
|
||||||
|
</j-pro-table>
|
||||||
|
</FullPage>
|
||||||
|
|
||||||
<AddDialog v-if="dialogVisible" v-model:visible="dialogVisible" />
|
<AddDialog v-if="dialogVisible" v-model:visible="dialogVisible" />
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -6,106 +6,111 @@
|
||||||
target="category"
|
target="category"
|
||||||
@search="handleParams"
|
@search="handleParams"
|
||||||
/>
|
/>
|
||||||
|
<FullPage>
|
||||||
<j-pro-table
|
<j-pro-table
|
||||||
ref="tableRef"
|
ref="tableRef"
|
||||||
:columns="columns"
|
:columns="columns"
|
||||||
:request="getUserList_api"
|
:request="getUserList_api"
|
||||||
model="TABLE"
|
model="TABLE"
|
||||||
:params="queryParams"
|
:params="queryParams"
|
||||||
:defaultParams="{
|
:defaultParams="{
|
||||||
pageSize: 10,
|
pageSize: 10,
|
||||||
sorts: [{ name: 'createTime', order: 'desc' }],
|
sorts: [{ name: 'createTime', order: 'desc' }],
|
||||||
}"
|
}"
|
||||||
:pagination="{
|
:pagination="{
|
||||||
showSizeChanger: true,
|
showSizeChanger: true,
|
||||||
pageSizeOptions: ['10', '20', '50', '100'],
|
pageSizeOptions: ['10', '20', '50', '100'],
|
||||||
}"
|
}"
|
||||||
>
|
>
|
||||||
<template #headerTitle>
|
<template #headerTitle>
|
||||||
<PermissionButton
|
|
||||||
:hasPermission="`${permission}:add`"
|
|
||||||
type="primary"
|
|
||||||
@click="table.openDialog('add')"
|
|
||||||
>
|
|
||||||
<AIcon type="PlusOutlined" />新增
|
|
||||||
</PermissionButton>
|
|
||||||
</template>
|
|
||||||
<template #type="slotProps">
|
|
||||||
{{ slotProps.type.name }}
|
|
||||||
</template>
|
|
||||||
<template #status="slotProps">
|
|
||||||
<BadgeStatus
|
|
||||||
:status="slotProps.status"
|
|
||||||
:text="slotProps.status ? '正常' : '禁用'"
|
|
||||||
:statusNames="{
|
|
||||||
1: 'success',
|
|
||||||
0: 'error',
|
|
||||||
}"
|
|
||||||
></BadgeStatus>
|
|
||||||
</template>
|
|
||||||
<template #action="slotProps">
|
|
||||||
<j-space :size="16">
|
|
||||||
<PermissionButton
|
<PermissionButton
|
||||||
:hasPermission="`${permission}:update`"
|
:hasPermission="`${permission}:add`"
|
||||||
type="link"
|
type="primary"
|
||||||
:tooltip="{
|
@click="table.openDialog('add')"
|
||||||
title: '编辑',
|
|
||||||
}"
|
|
||||||
@click="table.openDialog('edit', slotProps)"
|
|
||||||
>
|
>
|
||||||
<AIcon type="EditOutlined" />
|
<AIcon type="PlusOutlined" />新增
|
||||||
</PermissionButton>
|
</PermissionButton>
|
||||||
<PermissionButton
|
</template>
|
||||||
:hasPermission="`${permission}:action`"
|
<template #type="slotProps">
|
||||||
type="link"
|
{{ slotProps.type.name }}
|
||||||
:tooltip="{
|
</template>
|
||||||
title: `${slotProps.status ? '禁用' : '启用'}`,
|
<template #status="slotProps">
|
||||||
|
<BadgeStatus
|
||||||
|
:status="slotProps.status"
|
||||||
|
:text="slotProps.status ? '正常' : '禁用'"
|
||||||
|
:statusNames="{
|
||||||
|
1: 'success',
|
||||||
|
0: 'error',
|
||||||
}"
|
}"
|
||||||
:popConfirm="{
|
></BadgeStatus>
|
||||||
title: `确定${
|
</template>
|
||||||
slotProps.status ? '禁用' : '启用'
|
<template #action="slotProps">
|
||||||
}吗？`,
|
<j-space :size="16">
|
||||||
onConfirm: () => table.changeStatus(slotProps),
|
<PermissionButton
|
||||||
}"
|
:hasPermission="`${permission}:update`"
|
||||||
>
|
type="link"
|
||||||
<AIcon
|
:tooltip="{
|
||||||
:type="
|
title: '编辑',
|
||||||
slotProps.status
|
}"
|
||||||
? 'StopOutlined'
|
@click="table.openDialog('edit', slotProps)"
|
||||||
: 'PlayCircleOutlined'
|
>
|
||||||
"
|
<AIcon type="EditOutlined" />
|
||||||
/>
|
</PermissionButton>
|
||||||
</PermissionButton>
|
<PermissionButton
|
||||||
<PermissionButton
|
:hasPermission="`${permission}:action`"
|
||||||
:hasPermission="`${permission}:update`"
|
type="link"
|
||||||
type="link"
|
:tooltip="{
|
||||||
:tooltip="{
|
title: `${
|
||||||
title: '重置密码',
|
slotProps.status ? '禁用' : '启用'
|
||||||
}"
|
}`,
|
||||||
@click="table.openDialog('reset', slotProps)"
|
}"
|
||||||
>
|
:popConfirm="{
|
||||||
<AIcon type="icon-zhongzhimima" />
|
title: `确定${
|
||||||
</PermissionButton>
|
slotProps.status ? '禁用' : '启用'
|
||||||
<PermissionButton
|
}吗？`,
|
||||||
type="link"
|
onConfirm: () =>
|
||||||
:hasPermission="`${permission}:delete`"
|
table.changeStatus(slotProps),
|
||||||
:tooltip="{
|
}"
|
||||||
title: slotProps.status
|
>
|
||||||
? '请先禁用，再删除'
|
<AIcon
|
||||||
: '删除',
|
:type="
|
||||||
}"
|
slotProps.status
|
||||||
:popConfirm="{
|
? 'StopOutlined'
|
||||||
title: `确认删除`,
|
: 'PlayCircleOutlined'
|
||||||
onConfirm: () => table.clickDel(slotProps.id),
|
"
|
||||||
}"
|
/>
|
||||||
:disabled="slotProps.status"
|
</PermissionButton>
|
||||||
>
|
<PermissionButton
|
||||||
<AIcon type="DeleteOutlined" />
|
:hasPermission="`${permission}:update`"
|
||||||
</PermissionButton>
|
type="link"
|
||||||
</j-space>
|
:tooltip="{
|
||||||
</template>
|
title: '重置密码',
|
||||||
</j-pro-table>
|
}"
|
||||||
|
@click="table.openDialog('reset', slotProps)"
|
||||||
|
>
|
||||||
|
<AIcon type="icon-zhongzhimima" />
|
||||||
|
</PermissionButton>
|
||||||
|
<PermissionButton
|
||||||
|
type="link"
|
||||||
|
:hasPermission="`${permission}:delete`"
|
||||||
|
:tooltip="{
|
||||||
|
title: slotProps.status
|
||||||
|
? '请先禁用，再删除'
|
||||||
|
: '删除',
|
||||||
|
}"
|
||||||
|
:popConfirm="{
|
||||||
|
title: `确认删除`,
|
||||||
|
onConfirm: () =>
|
||||||
|
table.clickDel(slotProps.id),
|
||||||
|
}"
|
||||||
|
:disabled="slotProps.status"
|
||||||
|
>
|
||||||
|
<AIcon type="DeleteOutlined" />
|
||||||
|
</PermissionButton>
|
||||||
|
</j-space>
|
||||||
|
</template>
|
||||||
|
</j-pro-table>
|
||||||
|
</FullPage>
|
||||||
|
|
||||||
<EditUserDialog
|
<EditUserDialog
|
||||||
v-if="dialog.visible"
|
v-if="dialog.visible"
|
||||||
|
|
@ -263,22 +268,21 @@ type dictType = {
|
||||||
};
|
};
|
||||||
type modalType = '' | 'add' | 'edit' | 'reset';
|
type modalType = '' | 'add' | 'edit' | 'reset';
|
||||||
|
|
||||||
const handleParams = (params: any)=> {
|
const handleParams = (params: any) => {
|
||||||
|
const newParams = (params?.terms as any[])?.map((item1) => {
|
||||||
const newParams = (params?.terms as any[])?.map(item1 => {
|
item1.terms = item1.terms.map((item2: any) => {
|
||||||
item1.terms = item1.terms.map((item2: any) => {
|
if (['telephone', 'email'].includes(item2.column)) {
|
||||||
if (['telephone', 'email'].includes(item2.column)) {
|
return {
|
||||||
return {
|
column: 'id$user-detail',
|
||||||
column: 'id$user-detail',
|
value: [item2],
|
||||||
value: [item2]
|
};
|
||||||
}
|
}
|
||||||
}
|
return item2;
|
||||||
return item2
|
});
|
||||||
})
|
return item1;
|
||||||
return item1
|
});
|
||||||
})
|
queryParams.value = { terms: newParams || [] };
|
||||||
queryParams.value = { terms: newParams || [] }
|
};
|
||||||
}
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue