system模块 default Nuclide 报警规则，自动处理页面开发及联调
This commit is contained in:
parent
8772c16c9b
commit
c5794c24f4
|
|
@ -55,6 +55,7 @@
|
||||||
"xss": "^1.0.13"
|
"xss": "^1.0.13"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
"@babel/plugin-proposal-nullish-coalescing-operator": "^7.18.6",
|
||||||
"@babel/polyfill": "^7.2.5",
|
"@babel/polyfill": "^7.2.5",
|
||||||
"@types/crypto-js": "^4.1.1",
|
"@types/crypto-js": "^4.1.1",
|
||||||
"@vue/cli-plugin-babel": "^3.3.0",
|
"@vue/cli-plugin-babel": "^3.3.0",
|
||||||
|
|
|
||||||
339
src/views/system/DefaultNuclide/AlarmRule.vue
Normal file
339
src/views/system/DefaultNuclide/AlarmRule.vue
Normal file
|
|
@ -0,0 +1,339 @@
|
||||||
|
<template>
|
||||||
|
<div style="height: 100%;">
|
||||||
|
<div class="header">
|
||||||
|
<a-button type="primary" @click="handleAdd">
|
||||||
|
<img src="@/assets/images/global/add.png" alt="" />
|
||||||
|
Edit
|
||||||
|
</a-button>
|
||||||
|
</div>
|
||||||
|
<!-- 列表 -->
|
||||||
|
<div>
|
||||||
|
<custom-table
|
||||||
|
size="middle"
|
||||||
|
rowKey="id"
|
||||||
|
:columns="columns"
|
||||||
|
:list="dataSource"
|
||||||
|
:pagination="ipagination"
|
||||||
|
:loading="loading"
|
||||||
|
@change="handleTableChange"
|
||||||
|
:scroll="{ y: 'calc(100vh - 365px)' }"
|
||||||
|
>
|
||||||
|
<template slot="index" slot-scope="{ index }">
|
||||||
|
{{ index + 1 }}
|
||||||
|
</template>
|
||||||
|
<template slot="roles" slot-scope="{ text }">
|
||||||
|
<span v-for="role of text" :key="role.id">
|
||||||
|
{{ role.roleName }}
|
||||||
|
</span>
|
||||||
|
</template>
|
||||||
|
</custom-table>
|
||||||
|
</div>
|
||||||
|
<!-- 列表结束 -->
|
||||||
|
<a-modal
|
||||||
|
title='Edit'
|
||||||
|
:width="845"
|
||||||
|
v-model="visible"
|
||||||
|
@ok="handleOk"
|
||||||
|
destroy-on-close
|
||||||
|
>
|
||||||
|
<a-spin :spinning="spinning">
|
||||||
|
<div class="group-assign">
|
||||||
|
<a-transfer
|
||||||
|
:dataSource="dataList"
|
||||||
|
:target-keys="targetKeys"
|
||||||
|
show-search
|
||||||
|
:render="item => item.title"
|
||||||
|
:operations="['Assign', 'Remove']"
|
||||||
|
:titles="['Total Nuclides', 'User Nuclides']"
|
||||||
|
@change="handleChange"
|
||||||
|
@search="handleSearch"
|
||||||
|
>
|
||||||
|
</a-transfer>
|
||||||
|
</div>
|
||||||
|
</a-spin>
|
||||||
|
<template slot="footer">
|
||||||
|
<slot name="custom-footer"></slot>
|
||||||
|
<a-space class="operators" :size="20">
|
||||||
|
<a-button type="success" @click="handleOk" >Save</a-button>
|
||||||
|
<a-button type="warn" @click="onCancel">Cancel</a-button>
|
||||||
|
</a-space>
|
||||||
|
</template>
|
||||||
|
</a-modal>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { getAction, putAction } from '@/api/manage'
|
||||||
|
const columns = [
|
||||||
|
{
|
||||||
|
title: 'NO',
|
||||||
|
align: 'left',
|
||||||
|
width: 170,
|
||||||
|
scopedSlots: {
|
||||||
|
customRender: 'index'
|
||||||
|
},
|
||||||
|
customHeaderCell: () => {
|
||||||
|
return {
|
||||||
|
style: {
|
||||||
|
'padding-left': '60px !important'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
customCell: () => {
|
||||||
|
return {
|
||||||
|
style: {
|
||||||
|
'padding-left': '60px !important'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'NUCLIDE NAME',
|
||||||
|
align: 'left',
|
||||||
|
dataIndex: 'nuclideName'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'CREATE TIME',
|
||||||
|
align: 'left',
|
||||||
|
dataIndex: 'createTime'
|
||||||
|
},
|
||||||
|
]
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
columns,
|
||||||
|
dataSource: [],
|
||||||
|
url: {
|
||||||
|
list: '/sys/defaultNuclide/findPage',
|
||||||
|
},
|
||||||
|
ipagination:{
|
||||||
|
current: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
pageSizeOptions: ['10', '20', '30'],
|
||||||
|
showTotal: (total, range) => {
|
||||||
|
const { current, pageSize } = this.ipagination
|
||||||
|
return `Total ${total} items Page ${current} / ${Math.ceil(total / pageSize)}`
|
||||||
|
},
|
||||||
|
showQuickJumper: true,
|
||||||
|
showSizeChanger: true,
|
||||||
|
total: 0
|
||||||
|
},
|
||||||
|
loading: false,
|
||||||
|
targetKeys: [],
|
||||||
|
visible: false,
|
||||||
|
dataList: [],
|
||||||
|
spinning: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted () {
|
||||||
|
this.getRulesList();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getRulesList() {
|
||||||
|
this.loading = true
|
||||||
|
let params = {
|
||||||
|
pageNo: this.ipagination.current,
|
||||||
|
pageSize: this.ipagination.pageSize,
|
||||||
|
useType: 2
|
||||||
|
}
|
||||||
|
getAction(this.url.list, params).then(res => {
|
||||||
|
this.loading = false
|
||||||
|
if (res.success) {
|
||||||
|
this.dataSource = res.result.records
|
||||||
|
this.ipagination.total = res.result.total
|
||||||
|
} else {
|
||||||
|
this.$message.warning("This operation fails. Contact your system administrator")
|
||||||
|
}
|
||||||
|
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleTableChange(pagination, filters, sorter) {
|
||||||
|
this.ipagination.current = pagination.current
|
||||||
|
this.ipagination.pageSize = pagination.pageSize
|
||||||
|
this.getRulesList();
|
||||||
|
},
|
||||||
|
handleAdd() {
|
||||||
|
this.visible = true
|
||||||
|
this.spinning = true
|
||||||
|
this.getNuclideListAll()
|
||||||
|
this.getNuclideList()
|
||||||
|
},
|
||||||
|
getNuclideListAll() {
|
||||||
|
getAction("/gardsNuclLib/allName").then(res => {
|
||||||
|
this.spinning = false
|
||||||
|
if (res.success) {
|
||||||
|
if (res.result.length > 0) {
|
||||||
|
this.dataList = res.result.map((item,index) => {
|
||||||
|
return {
|
||||||
|
key: item,
|
||||||
|
title: item
|
||||||
|
}
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
this.dataList = []
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
this.$message.warning("This operation fails. Contact your system administrator")
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
getNuclideList() {
|
||||||
|
getAction("/sys/defaultNuclide/allName",{useType:2}).then(res => {
|
||||||
|
if (res.success) {
|
||||||
|
if (res.result.length > 0) {
|
||||||
|
this.targetKeys = res.result.map(item => item)
|
||||||
|
} else {
|
||||||
|
this.targetKeys = []
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
this.$message.warning("This operation fails. Contact your system administrator")
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleChange(targetKeys, direction, moveKeys) {
|
||||||
|
this.targetKeys= targetKeys;
|
||||||
|
},
|
||||||
|
handleSearch(dir, value) {
|
||||||
|
console.log('search:', dir, value)
|
||||||
|
},
|
||||||
|
handleOk() {
|
||||||
|
let params = {
|
||||||
|
nuclideNames: this.targetKeys,
|
||||||
|
useType: 2
|
||||||
|
}
|
||||||
|
putAction("/sys/defaultNuclide/add",params).then(res => {
|
||||||
|
this.visible = false
|
||||||
|
if (res.success) {
|
||||||
|
this.$message(res.message)
|
||||||
|
} else {
|
||||||
|
this.$message.warning("This operation fails. Contact your system administrator")
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
onCancel() {
|
||||||
|
this.visible = false
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.header{
|
||||||
|
height: 54px;
|
||||||
|
border-top: 1px solid rgba(12, 235, 201, 0.3);
|
||||||
|
border-bottom: 1px solid rgba(12, 235, 201, 0.3);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
background-color: rgba(12, 235, 201, 0.05);
|
||||||
|
padding: 0 10px;
|
||||||
|
margin-bottom: 18px;
|
||||||
|
}
|
||||||
|
.operators {
|
||||||
|
width: 100%;
|
||||||
|
justify-content: center;
|
||||||
|
.ant-btn {
|
||||||
|
width: 92px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.group-assign{
|
||||||
|
position: relative;
|
||||||
|
width: 690px;
|
||||||
|
margin: 0 auto;
|
||||||
|
.ant-transfer {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
::v-deep {
|
||||||
|
.ant-transfer-list {
|
||||||
|
width: 291px;
|
||||||
|
height: 411px;
|
||||||
|
padding-top: 0;
|
||||||
|
&-header {
|
||||||
|
height: 37px;
|
||||||
|
&-selected {
|
||||||
|
span:first-child {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&-title {
|
||||||
|
left: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&-body{
|
||||||
|
height: calc(100% - 37px);
|
||||||
|
}
|
||||||
|
&-content {
|
||||||
|
&-item {
|
||||||
|
&:hover {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
height: 411px;
|
||||||
|
position: relative;
|
||||||
|
// top: 35px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-transfer-operation {
|
||||||
|
.ant-btn {
|
||||||
|
width: 92px;
|
||||||
|
height: 26px;
|
||||||
|
padding: 0;
|
||||||
|
.anticon {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
span {
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
&:first-child {
|
||||||
|
margin-bottom: 52px;
|
||||||
|
&::after {
|
||||||
|
display: inline-block;
|
||||||
|
margin-left: 13px;
|
||||||
|
content: '';
|
||||||
|
width: 18px;
|
||||||
|
height: 10px;
|
||||||
|
background: url(~@/assets/images/system/transfer-right.png) no-repeat;
|
||||||
|
background-size: contain;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:nth-child(2) {
|
||||||
|
&::before {
|
||||||
|
display: inline-block;
|
||||||
|
margin-right: 6px;
|
||||||
|
content: '';
|
||||||
|
width: 18px;
|
||||||
|
height: 10px;
|
||||||
|
background: url(~@/assets/images/system/transfer-left.png) no-repeat;
|
||||||
|
background-size: contain;
|
||||||
|
position: static;
|
||||||
|
opacity: initial;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.ant-transfer-list-header{
|
||||||
|
position: relative;
|
||||||
|
.ant-checkbox-wrapper{
|
||||||
|
position: absolute;
|
||||||
|
right: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.ant-transfer-list-content-item{
|
||||||
|
position: relative;
|
||||||
|
.ant-checkbox-wrapper{
|
||||||
|
position: absolute;
|
||||||
|
right: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.ant-transfer-list-content-item-text{
|
||||||
|
padding-left: 22px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/deep/.ant-modal-title{
|
||||||
|
letter-spacing: 1px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
404
src/views/system/DefaultNuclide/AutoProcess.vue
Normal file
404
src/views/system/DefaultNuclide/AutoProcess.vue
Normal file
|
|
@ -0,0 +1,404 @@
|
||||||
|
<template>
|
||||||
|
<div style="height: 100%;">
|
||||||
|
<div class="header">
|
||||||
|
<div>
|
||||||
|
<span class="item-label">Nuclide Type</span>
|
||||||
|
<a-select
|
||||||
|
style="width: 180px;display: inline-block;"
|
||||||
|
v-model="type"
|
||||||
|
:options="typeOptions"
|
||||||
|
show-arrow
|
||||||
|
allowClear
|
||||||
|
placeholder="select..."
|
||||||
|
@change="onTypeChange"
|
||||||
|
>
|
||||||
|
<img slot="suffixIcon" src="@/assets/images/global/select-down.png" alt="" />
|
||||||
|
</a-select>
|
||||||
|
</div>
|
||||||
|
<a-button type="primary" @click="handleAdd">
|
||||||
|
<img src="@/assets/images/global/add.png" alt="" />
|
||||||
|
Edit
|
||||||
|
</a-button>
|
||||||
|
</div>
|
||||||
|
<!-- 列表 -->
|
||||||
|
<div>
|
||||||
|
<custom-table
|
||||||
|
size="middle"
|
||||||
|
rowKey="id"
|
||||||
|
:columns="columns"
|
||||||
|
:list="dataSource"
|
||||||
|
:pagination="ipagination"
|
||||||
|
:loading="loading"
|
||||||
|
@change="handleTableChange"
|
||||||
|
:scroll="{ y: 'calc(100vh - 365px)' }"
|
||||||
|
>
|
||||||
|
<template slot="index" slot-scope="{ index }">
|
||||||
|
{{ index + 1 }}
|
||||||
|
</template>
|
||||||
|
<template slot="roles" slot-scope="{ text }">
|
||||||
|
<span v-for="role of text" :key="role.id">
|
||||||
|
{{ role.roleName }}
|
||||||
|
</span>
|
||||||
|
</template>
|
||||||
|
</custom-table>
|
||||||
|
</div>
|
||||||
|
<!-- 列表结束 -->
|
||||||
|
<a-modal
|
||||||
|
title='Edit'
|
||||||
|
:width="845"
|
||||||
|
v-model="visible"
|
||||||
|
@ok="handleOk"
|
||||||
|
destroy-on-close
|
||||||
|
>
|
||||||
|
<a-spin :spinning="spinning">
|
||||||
|
<div style="padding-left: 52px;margin-bottom: 20px;">
|
||||||
|
<span class="item-label">Nuclide Type</span>
|
||||||
|
<a-select
|
||||||
|
style="width: 180px;display: inline-block;"
|
||||||
|
v-model="currType"
|
||||||
|
:options="typeOptions"
|
||||||
|
show-arrow
|
||||||
|
allowClear
|
||||||
|
placeholder="select..."
|
||||||
|
@change="onCurrTypeChange"
|
||||||
|
>
|
||||||
|
<img slot="suffixIcon" src="@/assets/images/global/select-down.png" alt="" />
|
||||||
|
</a-select>
|
||||||
|
</div>
|
||||||
|
<div class="group-assign">
|
||||||
|
<a-transfer
|
||||||
|
:dataSource="dataList"
|
||||||
|
:target-keys="targetKeys"
|
||||||
|
show-search
|
||||||
|
:render="item => item.title"
|
||||||
|
:operations="['Assign', 'Remove']"
|
||||||
|
:titles="['Total Nuclides', 'User Nuclides']"
|
||||||
|
@change="handleChange"
|
||||||
|
@search="handleSearch"
|
||||||
|
>
|
||||||
|
</a-transfer>
|
||||||
|
</div>
|
||||||
|
</a-spin>
|
||||||
|
<template slot="footer">
|
||||||
|
<slot name="custom-footer"></slot>
|
||||||
|
<a-space class="operators" :size="20">
|
||||||
|
<a-button type="success" @click="handleOk" >Save</a-button>
|
||||||
|
<a-button type="warn" @click="onCancel">Cancel</a-button>
|
||||||
|
</a-space>
|
||||||
|
</template>
|
||||||
|
</a-modal>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {getAction } from '@/api/manage'
|
||||||
|
const columns = [
|
||||||
|
{
|
||||||
|
title: 'NO',
|
||||||
|
align: 'left',
|
||||||
|
width: 170,
|
||||||
|
scopedSlots: {
|
||||||
|
customRender: 'index'
|
||||||
|
},
|
||||||
|
customHeaderCell: () => {
|
||||||
|
return {
|
||||||
|
style: {
|
||||||
|
'padding-left': '60px !important'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
customCell: () => {
|
||||||
|
return {
|
||||||
|
style: {
|
||||||
|
'padding-left': '60px !important'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'NUCLIDE NAME',
|
||||||
|
align: 'left',
|
||||||
|
dataIndex: 'nuclideName'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'NUCLIDE TYPE',
|
||||||
|
align: 'left',
|
||||||
|
dataIndex: 'nuclideType'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'CREATE TIME',
|
||||||
|
align: 'left',
|
||||||
|
dataIndex: 'createTime'
|
||||||
|
},
|
||||||
|
]
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
columns,
|
||||||
|
dataSource: [],
|
||||||
|
url: {
|
||||||
|
list: '/sys/defaultNuclide/findPage',
|
||||||
|
},
|
||||||
|
ipagination:{
|
||||||
|
current: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
pageSizeOptions: ['10', '20', '30'],
|
||||||
|
showTotal: (total, range) => {
|
||||||
|
const { current, pageSize } = this.ipagination
|
||||||
|
return `Total ${total} items Page ${current} / ${Math.ceil(total / pageSize)}`
|
||||||
|
},
|
||||||
|
showQuickJumper: true,
|
||||||
|
showSizeChanger: true,
|
||||||
|
total: 0
|
||||||
|
},
|
||||||
|
loading: false,
|
||||||
|
typeOptions: [
|
||||||
|
{
|
||||||
|
label: "P",
|
||||||
|
value: "P"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "G",
|
||||||
|
value: "G"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
type: undefined,
|
||||||
|
currType: "P",
|
||||||
|
targetKeys: [],
|
||||||
|
visible: false,
|
||||||
|
dataList: [],
|
||||||
|
spinning: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted () {
|
||||||
|
this.getAuroPeocessList();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getAuroPeocessList() {
|
||||||
|
this.loading = true
|
||||||
|
let params = {
|
||||||
|
pageNo: this.ipagination.current,
|
||||||
|
pageSize: this.ipagination.pageSize,
|
||||||
|
useType: 1,
|
||||||
|
nuclideType: this.type || ""
|
||||||
|
}
|
||||||
|
getAction(this.url.list, params).then(res => {
|
||||||
|
this.loading = false
|
||||||
|
if (res.success) {
|
||||||
|
this.dataSource = res.result.records
|
||||||
|
this.ipagination.total = res.result.total
|
||||||
|
} else {
|
||||||
|
this.$message.warning("This operation fails. Contact your system administrator")
|
||||||
|
}
|
||||||
|
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleTableChange(pagination, filters, sorter) {
|
||||||
|
this.ipagination.current = pagination.current
|
||||||
|
this.ipagination.pageSize = pagination.pageSize
|
||||||
|
this.getAuroPeocessList();
|
||||||
|
},
|
||||||
|
onTypeChange(val) {
|
||||||
|
this.type = val
|
||||||
|
this.getAuroPeocessList();
|
||||||
|
},
|
||||||
|
onCurrTypeChange(val) {
|
||||||
|
this.currType = val
|
||||||
|
},
|
||||||
|
handleAdd() {
|
||||||
|
this.visible = true
|
||||||
|
this.spinning = true
|
||||||
|
this.getNuclideListAll()
|
||||||
|
this.getNuclideList()
|
||||||
|
},
|
||||||
|
getNuclideListAll() {
|
||||||
|
getAction("/gardsNuclLib/allName").then(res => {
|
||||||
|
this.spinning = false
|
||||||
|
if (res.success) {
|
||||||
|
if (res.result.length > 0) {
|
||||||
|
this.dataList = res.result.map((item,index) => {
|
||||||
|
return {
|
||||||
|
key: item,
|
||||||
|
title: item
|
||||||
|
}
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
this.dataList = []
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
this.$message.warning("This operation fails. Contact your system administrator")
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
getNuclideList() {
|
||||||
|
getAction("/sys/defaultNuclide/allName",{useType:1}).then(res => {
|
||||||
|
if (res.success) {
|
||||||
|
if (res.result.length > 0) {
|
||||||
|
this.targetKeys = res.result.map(item => item)
|
||||||
|
} else {
|
||||||
|
this.targetKeys = []
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
this.$message.warning("This operation fails. Contact your system administrator")
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleChange(targetKeys, direction, moveKeys) {
|
||||||
|
console.log(targetKeys, direction, moveKeys);
|
||||||
|
this.targetKeys= targetKeys;
|
||||||
|
},
|
||||||
|
handleSearch(dir, value) {
|
||||||
|
console.log('search:', dir, value)
|
||||||
|
},
|
||||||
|
handleOk() {
|
||||||
|
let params = {
|
||||||
|
nuclideNames: this.targetKeys,
|
||||||
|
nuclideType: this.currType,
|
||||||
|
useType: 1
|
||||||
|
}
|
||||||
|
putAction("/sys/defaultNuclide/add",params).then(res => {
|
||||||
|
this.visible = false
|
||||||
|
if (res.success) {
|
||||||
|
this.$message(res.message)
|
||||||
|
} else {
|
||||||
|
this.$message.warning("This operation fails. Contact your system administrator")
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
onCancel() {
|
||||||
|
this.visible = false
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.header{
|
||||||
|
height: 54px;
|
||||||
|
border-top: 1px solid rgba(12, 235, 201, 0.3);
|
||||||
|
border-bottom: 1px solid rgba(12, 235, 201, 0.3);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
background-color: rgba(12, 235, 201, 0.05);
|
||||||
|
padding: 0 10px;
|
||||||
|
margin-bottom: 18px;
|
||||||
|
}
|
||||||
|
.item-label{
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 16px;
|
||||||
|
font-family: ArialMT;
|
||||||
|
color: #ade6ee;
|
||||||
|
line-height: 32px;
|
||||||
|
height: 32px;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
.operators {
|
||||||
|
width: 100%;
|
||||||
|
justify-content: center;
|
||||||
|
.ant-btn {
|
||||||
|
width: 92px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.group-assign{
|
||||||
|
position: relative;
|
||||||
|
width: 690px;
|
||||||
|
margin: 0 auto;
|
||||||
|
.ant-transfer {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
::v-deep {
|
||||||
|
.ant-transfer-list {
|
||||||
|
width: 291px;
|
||||||
|
height: 411px;
|
||||||
|
padding-top: 0;
|
||||||
|
&-header {
|
||||||
|
height: 37px;
|
||||||
|
&-selected {
|
||||||
|
span:first-child {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&-title {
|
||||||
|
left: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&-body{
|
||||||
|
height: calc(100% - 37px);
|
||||||
|
}
|
||||||
|
&-content {
|
||||||
|
&-item {
|
||||||
|
&:hover {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
height: 411px;
|
||||||
|
position: relative;
|
||||||
|
// top: 35px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-transfer-operation {
|
||||||
|
.ant-btn {
|
||||||
|
width: 92px;
|
||||||
|
height: 26px;
|
||||||
|
padding: 0;
|
||||||
|
.anticon {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
span {
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
&:first-child {
|
||||||
|
margin-bottom: 52px;
|
||||||
|
&::after {
|
||||||
|
display: inline-block;
|
||||||
|
margin-left: 13px;
|
||||||
|
content: '';
|
||||||
|
width: 18px;
|
||||||
|
height: 10px;
|
||||||
|
background: url(~@/assets/images/system/transfer-right.png) no-repeat;
|
||||||
|
background-size: contain;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:nth-child(2) {
|
||||||
|
&::before {
|
||||||
|
display: inline-block;
|
||||||
|
margin-right: 6px;
|
||||||
|
content: '';
|
||||||
|
width: 18px;
|
||||||
|
height: 10px;
|
||||||
|
background: url(~@/assets/images/system/transfer-left.png) no-repeat;
|
||||||
|
background-size: contain;
|
||||||
|
position: static;
|
||||||
|
opacity: initial;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.ant-transfer-list-header{
|
||||||
|
position: relative;
|
||||||
|
.ant-checkbox-wrapper{
|
||||||
|
position: absolute;
|
||||||
|
right: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.ant-transfer-list-content-item{
|
||||||
|
position: relative;
|
||||||
|
.ant-checkbox-wrapper{
|
||||||
|
position: absolute;
|
||||||
|
right: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.ant-transfer-list-content-item-text{
|
||||||
|
padding-left: 22px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/deep/.ant-modal-title{
|
||||||
|
letter-spacing: 1px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -69,6 +69,19 @@ module.exports = {
|
||||||
.use()
|
.use()
|
||||||
.loader('babel-loader')
|
.loader('babel-loader')
|
||||||
.end()
|
.end()
|
||||||
|
config.module
|
||||||
|
.rule('ol')
|
||||||
|
.test(/\.js$/)
|
||||||
|
.include
|
||||||
|
.add(resolve('node_modules/ol'))
|
||||||
|
.end()
|
||||||
|
.use()
|
||||||
|
.loader('babel-loader')
|
||||||
|
.options({
|
||||||
|
presets: ['@babel/preset-env'],
|
||||||
|
plugins: ['@babel/plugin-proposal-nullish-coalescing-operator']
|
||||||
|
})
|
||||||
|
.end()
|
||||||
},
|
},
|
||||||
|
|
||||||
css: {
|
css: {
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user