Merge branch 'master-dev' of http://git.hivekion.com:3000/xiaoguangbin/AnalysisSystemForRadionuclide_vue into master-dev
This commit is contained in:
commit
287e042d87
|
@ -1,12 +1,22 @@
|
|||
<template>
|
||||
<a-modal :class="'custom-modal' + (innerFullscreen ? ' fullscreen' : '')" v-bind="_attrs" v-model="visible" @cancel="handleCancel">
|
||||
<a-modal
|
||||
:class="'custom-modal' + (innerFullscreen ? ' fullscreen' : '')"
|
||||
v-bind="_attrs"
|
||||
v-model="visible"
|
||||
:maskClosable="false"
|
||||
@cancel="handleCancel"
|
||||
>
|
||||
<img slot="closeIcon" src="@/assets/images/global/close.png" />
|
||||
<div slot="title">
|
||||
<div class="custom-modal-title">
|
||||
<span>{{ title }}</span>
|
||||
<template v-if="enableFullScreen">
|
||||
<img v-if="innerFullscreen" src="@/assets/images/global/quit-fullscreen.png" @click="innerFullscreen = false" />
|
||||
<img v-else src="@/assets/images/global/fullscreen.png" @click="innerFullscreen = true" />
|
||||
<img
|
||||
v-if="innerFullscreen"
|
||||
src="@/assets/images/global/quit-fullscreen.png"
|
||||
@click="innerFullscreen = false"
|
||||
/>
|
||||
<img v-else src="@/assets/images/global/fullscreen.png" @click="innerFullscreen = true" />
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -24,24 +34,24 @@
|
|||
export default {
|
||||
props: {
|
||||
value: {
|
||||
type: Boolean
|
||||
type: Boolean,
|
||||
},
|
||||
okHandler: {
|
||||
type: Function
|
||||
type: Function,
|
||||
},
|
||||
title: {
|
||||
type: String
|
||||
type: String,
|
||||
},
|
||||
enableFullScreen: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
default: false,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
visible: this.value,
|
||||
confirmLoading: false,
|
||||
innerFullscreen: false
|
||||
innerFullscreen: false,
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
@ -56,7 +66,7 @@ export default {
|
|||
},
|
||||
innerFullscreen(val) {
|
||||
this.$emit('fullscreen', val)
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
async onSave() {
|
||||
|
@ -64,7 +74,7 @@ export default {
|
|||
try {
|
||||
this.confirmLoading = true
|
||||
const success = await this.okHandler()
|
||||
if(success !== false) {
|
||||
if (success !== false) {
|
||||
this.visible = false
|
||||
}
|
||||
} catch (error) {
|
||||
|
@ -80,8 +90,8 @@ export default {
|
|||
this.visible = false
|
||||
},
|
||||
handleCancel() {
|
||||
this.$emit("cancel")
|
||||
}
|
||||
this.$emit('cancel')
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
_attrs() {
|
||||
|
@ -96,8 +106,8 @@ export default {
|
|||
// 是否有自定义的footer
|
||||
hasCustomFooter() {
|
||||
return !!this.$slots['custom-footer']
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
|
|
|
@ -1,26 +1,26 @@
|
|||
<template>
|
||||
<div style="height: 100%;overflow: hidden;">
|
||||
<div style="height: 100%; overflow: hidden">
|
||||
<div class="group-header">
|
||||
<a-button class="group-add" @click="showModal">
|
||||
<img class="icon-add" src="@/assets/images/global/add.png" alt="" />
|
||||
<span style="margin-left: 10px;">
|
||||
Add Contact Group
|
||||
</span>
|
||||
<span style="margin-left: 10px"> Add Contact Group </span>
|
||||
</a-button>
|
||||
</div>
|
||||
<div class="group-content">
|
||||
<a-spin :spinning="spinning">
|
||||
<a-collapse :activeKey="activeKey" :bordered="false">
|
||||
<a-collapse-panel :key="item.id" :style="customStyle" v-for="item in contactGroups" >
|
||||
<a-collapse-panel :key="item.id" :style="customStyle" v-for="item in contactGroups">
|
||||
<template slot="header">
|
||||
{{ item.name }}
|
||||
<span class="header-sub">Create Date: {{ item.createTime }} , Number of people: {{ item.personNumber }}</span>
|
||||
<span class="header-sub"
|
||||
>Create Date: {{ item.createTime }} , Number of people: {{ item.personNumber }}</span
|
||||
>
|
||||
</template>
|
||||
<template slot="extra">
|
||||
<a-button class="actions" shape="circle" @click.stop="editGroup(item.id)">
|
||||
<img class="icon-edit" src="@/assets/images/abnormalAlarm/edit.png" alt="" />
|
||||
</a-button>
|
||||
<a-button class="actions" style="margin-right: 15px;" shape="circle" @click.stop="deleteGroup(item.id)">
|
||||
<a-button class="actions" style="margin-right: 15px" shape="circle" @click.stop="deleteGroup(item.id)">
|
||||
<img class="icon-delete" src="@/assets/images/abnormalAlarm/delete.png" alt="" />
|
||||
</a-button>
|
||||
</template>
|
||||
|
@ -33,15 +33,25 @@
|
|||
:canSelect="false"
|
||||
:scroll="{ y: 200 }"
|
||||
>
|
||||
<template slot="name" slot-scope="{text}">
|
||||
<img src="@/assets/images/abnormalAlarm/user.png" alt=""><span style="margin-left: 8px;padding-top: 2px;">{{ text }}</span>
|
||||
<template slot="name" slot-scope="{ text }">
|
||||
<img src="@/assets/images/abnormalAlarm/user.png" alt="" /><span
|
||||
style="margin-left: 8px; padding-top: 2px"
|
||||
>{{ text }}</span
|
||||
>
|
||||
</template>
|
||||
<template slot="role" slot-scope="{record}">
|
||||
<span v-for="(role,index) in record.roles" :key="role.id">{{ role.roleName }}<i v-if="index!=record.roles.length-1">,</i></span>
|
||||
<template slot="role" slot-scope="{ record }">
|
||||
<span v-for="(role, index) in record.roles" :key="role.id"
|
||||
>{{ role.roleName }}<i v-if="index != record.roles.length - 1">,</i></span
|
||||
>
|
||||
</template>
|
||||
|
||||
<template slot="action" slot-scope="{record}">
|
||||
<a-button class="actions" style="margin-right: 15px;" shape="circle" @click="deleteUser(item.id, record.id)">
|
||||
|
||||
<template slot="action" slot-scope="{ record }">
|
||||
<a-button
|
||||
class="actions"
|
||||
style="margin-right: 15px"
|
||||
shape="circle"
|
||||
@click="deleteUser(item.id, record.id)"
|
||||
>
|
||||
<img class="icon-delete" src="@/assets/images/abnormalAlarm/delete.png" alt="" />
|
||||
</a-button>
|
||||
</template>
|
||||
|
@ -49,69 +59,71 @@
|
|||
</a-collapse-panel>
|
||||
</a-collapse>
|
||||
</a-spin>
|
||||
<a-pagination
|
||||
<a-pagination
|
||||
size="small"
|
||||
v-model="page.currentPage"
|
||||
v-model="page.currentPage"
|
||||
:pageSize="page.pageSize"
|
||||
:page-size-options="page.pageSizeOptions"
|
||||
show-size-changer
|
||||
show-quick-jumper
|
||||
:total="page.total"
|
||||
:show-total="(total, range) => `Total ${total} items Page ${page.currentPage} / ${Math.ceil(total / page.pageSize)}`"
|
||||
show-less-items
|
||||
:show-total="
|
||||
(total, range) => `Total ${total} items Page ${page.currentPage} / ${Math.ceil(total / page.pageSize)}`
|
||||
"
|
||||
show-less-items
|
||||
@change="handlePageChange"
|
||||
@showSizeChange="handleSizeChange"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<a-modal
|
||||
:title="isAdd ? 'Add Contact Group' : 'Edit Contact Group'"
|
||||
:width="845"
|
||||
v-model="visible"
|
||||
@ok="handleOk"
|
||||
|
||||
<a-modal
|
||||
:title="isAdd ? 'Add Contact Group' : 'Edit Contact Group'"
|
||||
:width="845"
|
||||
:maskClosable="false"
|
||||
v-model="visible"
|
||||
@ok="handleOk"
|
||||
destroy-on-close
|
||||
>
|
||||
<!-- <a-spin :spinning="false"> -->
|
||||
<div class="group-assign">
|
||||
<a-transfer
|
||||
:dataSource="userList"
|
||||
:target-keys="targetKeys"
|
||||
:render="item => item.title"
|
||||
:operations="['Assign', 'Remove']"
|
||||
:titles="['All Users', 'Contact Group']"
|
||||
@change="handleChange"
|
||||
@search="handleSearch"
|
||||
>
|
||||
<div class="group-assign">
|
||||
<a-transfer
|
||||
:dataSource="userList"
|
||||
:target-keys="targetKeys"
|
||||
:render="(item) => item.title"
|
||||
:operations="['Assign', 'Remove']"
|
||||
:titles="['All Users', 'Contact Group']"
|
||||
@change="handleChange"
|
||||
@search="handleSearch"
|
||||
>
|
||||
</a-transfer>
|
||||
<!-- 穿梭框右上方搜索 -->
|
||||
<div class="group-name">
|
||||
|
||||
<!-- <label>Group Name</label>
|
||||
<!-- 穿梭框右上方搜索 -->
|
||||
<div class="group-name">
|
||||
<!-- <label>Group Name</label>
|
||||
<a-input :value="groupName" placeholder="Basic usage" @change="setGroupName" /> -->
|
||||
<a-form :form="form" :label-col="{ span: 9 }" :wrapper-col="{ span: 15 }">
|
||||
<a-form-item label="Group Name">
|
||||
<a-input
|
||||
v-decorator="['name', { rules: [{ required: true, message: 'The group name is mandatory' }] }]"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 穿梭框右上方搜索结束 -->
|
||||
<a-form :form="form" :label-col="{ span: 9 }" :wrapper-col="{ span: 15 }">
|
||||
<a-form-item label="Group Name">
|
||||
<a-input
|
||||
v-decorator="['name', { rules: [{ required: true, message: 'The group name is mandatory' }] }]"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 穿梭框右上方搜索结束 -->
|
||||
</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>
|
||||
<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,postAction,httpAction,deleteAction } from '@/api/manage'
|
||||
import { getAction, postAction, httpAction, deleteAction } from '@/api/manage'
|
||||
const columns = [
|
||||
{
|
||||
title: 'NAME',
|
||||
|
@ -119,7 +131,7 @@ const columns = [
|
|||
dataIndex: 'username',
|
||||
scopedSlots: {
|
||||
customRender: 'name',
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'ROLE',
|
||||
|
@ -132,12 +144,12 @@ const columns = [
|
|||
{
|
||||
title: 'Phone',
|
||||
align: 'left',
|
||||
dataIndex: 'telephone'
|
||||
dataIndex: 'telephone',
|
||||
},
|
||||
{
|
||||
title: 'E-MAIL',
|
||||
align: 'left',
|
||||
dataIndex: 'email'
|
||||
dataIndex: 'email',
|
||||
},
|
||||
{
|
||||
title: '',
|
||||
|
@ -146,31 +158,30 @@ const columns = [
|
|||
scopedSlots: {
|
||||
customRender: 'action',
|
||||
},
|
||||
}
|
||||
},
|
||||
]
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
activeKey:"",
|
||||
spinning:false,
|
||||
activeKey: '',
|
||||
spinning: false,
|
||||
page: {
|
||||
currentPage:1,
|
||||
currentPage: 1,
|
||||
pageSize: 10,
|
||||
pageSizeOptions: ['10', '20', '30'],
|
||||
total:0
|
||||
total: 0,
|
||||
},
|
||||
contactGroups:[],
|
||||
isAdd:true,
|
||||
contactGroups: [],
|
||||
isAdd: true,
|
||||
userList: [],
|
||||
groupList: [],
|
||||
columns,
|
||||
visible: false,
|
||||
customStyle:
|
||||
'background: #02282b;;margin-bottom: 20px;border: solid 1px #416f7f;overflow: hidden',
|
||||
customStyle: 'background: #02282b;;margin-bottom: 20px;border: solid 1px #416f7f;overflow: hidden',
|
||||
targetKeys: [],
|
||||
groupName: "",
|
||||
currGroupId: "",
|
||||
form: this.$form.createForm(this)
|
||||
groupName: '',
|
||||
currGroupId: '',
|
||||
form: this.$form.createForm(this),
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
@ -192,21 +203,21 @@ export default {
|
|||
this.spinning = true
|
||||
let params = {
|
||||
pageNo: this.page.currentPage,
|
||||
pageSize:this.page.pageSize
|
||||
pageSize: this.page.pageSize,
|
||||
}
|
||||
getAction("/alarmContactGroup/findPage", params).then(res => {
|
||||
getAction('/alarmContactGroup/findPage', params).then((res) => {
|
||||
this.spinning = false
|
||||
if (res.success) {
|
||||
this.contactGroups = res.result.records
|
||||
this.activeKey = this.contactGroups[0].id
|
||||
this.page.total = res.result.total
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
editGroup(id) {
|
||||
getAction("/alarmContactGroup/findInfo", {id}).then(res => {
|
||||
getAction('/alarmContactGroup/findInfo', { id }).then((res) => {
|
||||
if (res.success) {
|
||||
this.visible = true
|
||||
this.isAdd = false
|
||||
|
@ -214,26 +225,26 @@ export default {
|
|||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue({
|
||||
name: res.result.name,
|
||||
});
|
||||
})
|
||||
})
|
||||
this.targetKeys = res.result.userIds
|
||||
this.currGroupId = res.result.id
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
getAllUser() {
|
||||
getAction("sys/user/list").then(res => {
|
||||
getAction('sys/user/list').then((res) => {
|
||||
if (res.success) {
|
||||
this.userList = res.result.records.map(item => {
|
||||
this.userList = res.result.records.map((item) => {
|
||||
return {
|
||||
key: item.id,
|
||||
title:item.username
|
||||
title: item.username,
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
@ -241,23 +252,23 @@ export default {
|
|||
// this.groupName = e.target.value
|
||||
// },
|
||||
handleChange(targetKeys, direction, moveKeys) {
|
||||
console.log(targetKeys, direction, moveKeys);
|
||||
this.targetKeys= targetKeys;
|
||||
console.log(targetKeys, direction, moveKeys)
|
||||
this.targetKeys = targetKeys
|
||||
},
|
||||
handleOk() {
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
if (this.targetKeys.length>0) {
|
||||
if (this.targetKeys.length > 0) {
|
||||
if (this.isAdd) {
|
||||
this.createContactGroup(values.name)
|
||||
} else {
|
||||
this.updateContactGroup(values.name)
|
||||
}
|
||||
} else {
|
||||
this.$message.warning("Please select User")
|
||||
this.$message.warning('Please select User')
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
onCancel() {
|
||||
this.visible = false
|
||||
|
@ -265,33 +276,33 @@ export default {
|
|||
updateContactGroup(name) {
|
||||
let params = {
|
||||
name,
|
||||
description: "",
|
||||
description: '',
|
||||
userIds: this.targetKeys,
|
||||
id:this.currGroupId
|
||||
id: this.currGroupId,
|
||||
}
|
||||
httpAction("/alarmContactGroup/update", params, "put").then(res => {
|
||||
httpAction('/alarmContactGroup/update', params, 'put').then((res) => {
|
||||
if (res.success) {
|
||||
this.visible = false
|
||||
this.$message.success("success")
|
||||
this.$message.success('success')
|
||||
this.getAlarmGroup()
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
createContactGroup(name) {
|
||||
let params = {
|
||||
name,
|
||||
description: "",
|
||||
userIds:this.targetKeys,
|
||||
description: '',
|
||||
userIds: this.targetKeys,
|
||||
}
|
||||
postAction("/alarmContactGroup/create", params).then(res => {
|
||||
postAction('/alarmContactGroup/create', params).then((res) => {
|
||||
if (res.success) {
|
||||
this.visible = false
|
||||
this.$message.success("success")
|
||||
this.$message.success('success')
|
||||
this.getAlarmGroup()
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
@ -300,50 +311,50 @@ export default {
|
|||
this.$confirm({
|
||||
title: 'Are you sure to delete this item?',
|
||||
onOk() {
|
||||
deleteAction("/alarmContactGroup/deleteById", {id}).then(res => {
|
||||
deleteAction('/alarmContactGroup/deleteById', { id }).then((res) => {
|
||||
if (res.success) {
|
||||
_this.$message.success("success")
|
||||
_this.$message.success('success')
|
||||
_this.getAlarmGroup()
|
||||
} else {
|
||||
_this.$message.warning("This operation fails. Contact your system administrator")
|
||||
_this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
onCancel() {
|
||||
console.log('Cancel');
|
||||
console.log('Cancel')
|
||||
},
|
||||
class: 'test',
|
||||
});
|
||||
})
|
||||
},
|
||||
deleteUser(id,userId) {
|
||||
deleteUser(id, userId) {
|
||||
let _this = this
|
||||
this.$confirm({
|
||||
title: 'Are you sure to delete this item?',
|
||||
onOk() {
|
||||
deleteAction("/alarmContactGroup/deleteUserById", {id,userId}).then(res => {
|
||||
deleteAction('/alarmContactGroup/deleteUserById', { id, userId }).then((res) => {
|
||||
if (res.success) {
|
||||
_this.$message.success("success")
|
||||
_this.$message.success('success')
|
||||
_this.getAlarmGroup()
|
||||
} else {
|
||||
_this.$message.warning("This operation fails. Contact your system administrator")
|
||||
_this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
onCancel() {
|
||||
console.log('Cancel');
|
||||
}
|
||||
});
|
||||
console.log('Cancel')
|
||||
},
|
||||
})
|
||||
},
|
||||
handleSearch(dir, value) {
|
||||
console.log('search:', dir, value);
|
||||
console.log('search:', dir, value)
|
||||
},
|
||||
showModal() {
|
||||
this.targetKeys = []
|
||||
this.groupName = ""
|
||||
this.groupName = ''
|
||||
this.form.setFieldsValue({
|
||||
name: "",
|
||||
});
|
||||
this.visible = true;
|
||||
name: '',
|
||||
})
|
||||
this.visible = true
|
||||
},
|
||||
},
|
||||
}
|
||||
|
@ -357,7 +368,7 @@ export default {
|
|||
width: 92px;
|
||||
}
|
||||
}
|
||||
.group-header{
|
||||
.group-header {
|
||||
height: 50px;
|
||||
border-top: 1px solid rgba(13, 235, 201, 0.3);
|
||||
border-bottom: 1px solid rgba(13, 235, 201, 0.3);
|
||||
|
@ -366,24 +377,24 @@ export default {
|
|||
align-items: center;
|
||||
padding: 0 10px;
|
||||
background: rgba(12, 235, 201, 0.05);
|
||||
.group-add{
|
||||
.group-add {
|
||||
background-color: #1397a3;
|
||||
font-family: ArialMT;
|
||||
color: #ffffff;
|
||||
color: #ffffff;
|
||||
border: none;
|
||||
box-shadow: 0px 1px 1px 0px #000000
|
||||
box-shadow: 0px 1px 1px 0px #000000;
|
||||
}
|
||||
}
|
||||
.group-content{
|
||||
.group-content {
|
||||
height: calc(100% - 65px);
|
||||
margin-left: 20px;
|
||||
position: relative;
|
||||
.ant-spin-nested-loading{
|
||||
.ant-spin-nested-loading {
|
||||
width: 100%;
|
||||
height: calc(100% - 30px);
|
||||
overflow: auto;
|
||||
}
|
||||
.header-sub{
|
||||
.header-sub {
|
||||
margin-left: 20px;
|
||||
font-family: MicrosoftYaHei;
|
||||
font-size: 16px;
|
||||
|
@ -393,15 +404,15 @@ export default {
|
|||
// height: calc(100% - 30px);
|
||||
// overflow: auto;
|
||||
// }
|
||||
.actions{
|
||||
.actions {
|
||||
background: none;
|
||||
border: none;
|
||||
margin-left: 10px;
|
||||
}
|
||||
.split-float:last-child{
|
||||
.split-float:last-child {
|
||||
display: none;
|
||||
}
|
||||
.ant-pagination{
|
||||
.ant-pagination {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: 0;
|
||||
|
@ -409,27 +420,27 @@ export default {
|
|||
}
|
||||
}
|
||||
::v-deep {
|
||||
.ant-collapse-header{
|
||||
.ant-collapse-header {
|
||||
height: 50px;
|
||||
background-color: rgba(13, 109, 118,0.2);
|
||||
background-color: rgba(13, 109, 118, 0.2);
|
||||
font-family: ArialMT;
|
||||
color: #fff !important;
|
||||
line-height: 50px !important;
|
||||
padding-left: 35px !important;
|
||||
font-size: 18px;
|
||||
}
|
||||
.ant-collapse-content-box{
|
||||
.ant-collapse-content-box {
|
||||
padding: 15px !important;
|
||||
}
|
||||
.ant-modal-title{
|
||||
.ant-modal-title {
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
.ant-form-item-label > label{
|
||||
.ant-form-item-label > label {
|
||||
font-family: ArialMT;
|
||||
color: #5b9cba;
|
||||
}
|
||||
}
|
||||
.group-assign{
|
||||
.group-assign {
|
||||
position: relative;
|
||||
width: 690px;
|
||||
margin: 0 auto;
|
||||
|
@ -504,32 +515,32 @@ export default {
|
|||
}
|
||||
}
|
||||
}
|
||||
.ant-transfer-list-header{
|
||||
.ant-transfer-list-header {
|
||||
position: relative;
|
||||
.ant-checkbox-wrapper{
|
||||
.ant-checkbox-wrapper {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
}
|
||||
}
|
||||
.ant-transfer-list-content-item{
|
||||
.ant-transfer-list-content-item {
|
||||
position: relative;
|
||||
&::before{
|
||||
content: '';
|
||||
&::before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
background: url(~@/assets/images/abnormalAlarm/user.png) no-repeat;
|
||||
background: url(~@/assets/images/abnormalAlarm/user.png) no-repeat;
|
||||
background-size: contain;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
.ant-checkbox-wrapper{
|
||||
.ant-checkbox-wrapper {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
}
|
||||
}
|
||||
.ant-transfer-list-content-item-text{
|
||||
.ant-transfer-list-content-item-text {
|
||||
padding-left: 22px;
|
||||
}
|
||||
}
|
||||
|
@ -549,12 +560,12 @@ export default {
|
|||
user-select: none;
|
||||
}
|
||||
}
|
||||
.transfer-left-item{
|
||||
.transfer-left-item {
|
||||
position: relative;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
font-size: 14px;
|
||||
&-checkBox{
|
||||
&-checkBox {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
|
File diff suppressed because it is too large
Load Diff
|
@ -1,26 +1,25 @@
|
|||
<template>
|
||||
<div style="height: 100%;">
|
||||
<div style="height: 100%">
|
||||
<div class="rules-header">
|
||||
<a-row type="flex" :gutter="10">
|
||||
<a-col flex="190px">
|
||||
<a-button class="rules-add" @click="handleAdd">
|
||||
<img class="icon-add" src="@/assets/images/global/add.png" alt="" />
|
||||
<span style="margin-left: 10px;">
|
||||
Create Alarm Rule
|
||||
</span>
|
||||
<span style="margin-left: 10px"> Create Alarm Rule </span>
|
||||
</a-button>
|
||||
</a-col>
|
||||
<a-col flex="265px">
|
||||
<span class="item-label">Stations</span>
|
||||
<a-select style="width:180px"
|
||||
v-model="queryParams.station"
|
||||
mode="multiple"
|
||||
<a-select
|
||||
style="width: 180px"
|
||||
v-model="queryParams.station"
|
||||
mode="multiple"
|
||||
placeholder="select..."
|
||||
:maxTagCount="1"
|
||||
:maxTagCount="1"
|
||||
:filter-option="filterOption"
|
||||
show-arrow
|
||||
show-arrow
|
||||
allowClear
|
||||
:options="stationOptions"
|
||||
:options="stationOptions"
|
||||
@change="onStationChange"
|
||||
>
|
||||
<img slot="suffixIcon" src="@/assets/images/global/select-down.png" alt="" />
|
||||
|
@ -28,23 +27,20 @@
|
|||
</a-col>
|
||||
<a-col flex="294px">
|
||||
<span class="item-label">Sources</span>
|
||||
<DicSelect
|
||||
v-model="queryParams.source"
|
||||
placeholder="select..."
|
||||
dictCode="alarm_analyse_rule_source"
|
||||
/>
|
||||
<DicSelect v-model="queryParams.source" placeholder="select..." dictCode="alarm_analyse_rule_source" />
|
||||
</a-col>
|
||||
<a-col flex="275px">
|
||||
<span class="item-label">Nuclide</span>
|
||||
<a-select style="width:180px"
|
||||
v-model="queryParams.nuclide"
|
||||
mode="multiple"
|
||||
<a-select
|
||||
style="width: 180px"
|
||||
v-model="queryParams.nuclide"
|
||||
mode="multiple"
|
||||
placeholder="select..."
|
||||
:maxTagCount="1"
|
||||
:maxTagCount="1"
|
||||
:filter-option="filterOption"
|
||||
show-arrow
|
||||
show-arrow
|
||||
allowClear
|
||||
:options="nuclideOptions"
|
||||
:options="nuclideOptions"
|
||||
@change="onNuclideChange"
|
||||
>
|
||||
<img slot="suffixIcon" src="@/assets/images/global/select-down.png" alt="" />
|
||||
|
@ -53,9 +49,7 @@
|
|||
<a-col>
|
||||
<a-button class="search-btn" @click="onSearch">
|
||||
<img class="icon-add" src="@/assets/images/global/search.png" alt="" />
|
||||
<span style="margin-left: 10px;">
|
||||
Search
|
||||
</span>
|
||||
<span style="margin-left: 10px"> Search </span>
|
||||
</a-button>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
@ -67,8 +61,8 @@
|
|||
<div class="monitor-list-item-title">
|
||||
<div class="monitor-list-item-title-name">{{ item.name }}</div>
|
||||
<div class="monitor-list-item-title-server">
|
||||
<span style="color: #5b9cba;">Qualifier:</span>
|
||||
<span style="color: #ade6ee;">{{ item.spectralQualifier.join("、") }}</span>
|
||||
<span style="color: #5b9cba">Qualifier:</span>
|
||||
<span style="color: #ade6ee">{{ item.spectralQualifier.join('、') }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="monitor-list-item-content">
|
||||
|
@ -77,10 +71,10 @@
|
|||
<a-col :span="4" class="monitor-list-item-content-info-key">Source:</a-col>
|
||||
<a-tooltip>
|
||||
<template slot="title">
|
||||
{{ item.source.join("、") }}
|
||||
{{ item.source.join('、') }}
|
||||
</template>
|
||||
<a-col :span="18" class="monitor-list-item-content-info-val">
|
||||
{{ item.source.join("、") }}
|
||||
<a-col :span="18" class="monitor-list-item-content-info-val">
|
||||
{{ item.source.join('、') }}
|
||||
</a-col>
|
||||
</a-tooltip>
|
||||
</a-row>
|
||||
|
@ -88,10 +82,10 @@
|
|||
<a-col :span="4" class="monitor-list-item-content-info-key">Stations:</a-col>
|
||||
<a-tooltip>
|
||||
<template slot="title">
|
||||
{{ item.stations.join("、") }}
|
||||
{{ item.stations.join('、') }}
|
||||
</template>
|
||||
<a-col :span="18" class="monitor-list-item-content-info-val">
|
||||
{{ item.stations.join("、") }}
|
||||
<a-col :span="18" class="monitor-list-item-content-info-val">
|
||||
{{ item.stations.join('、') }}
|
||||
</a-col>
|
||||
</a-tooltip>
|
||||
</a-row>
|
||||
|
@ -99,99 +93,114 @@
|
|||
<a-col :span="4" class="monitor-list-item-content-info-key">Nuclides:</a-col>
|
||||
<a-tooltip>
|
||||
<template slot="title">
|
||||
{{ item.nuclides.join("、") }}
|
||||
{{ item.nuclides.join('、') }}
|
||||
</template>
|
||||
<a-col :span="18" class="monitor-list-item-content-info-val">
|
||||
{{ item.nuclides.join("、") }}
|
||||
<a-col :span="18" class="monitor-list-item-content-info-val">
|
||||
{{ item.nuclides.join('、') }}
|
||||
</a-col>
|
||||
</a-tooltip>
|
||||
</a-row>
|
||||
</div>
|
||||
<div :class="[item.enabled==1?'monitor-list-item-content-enable':'monitor-list-item-content-disable', 'monitor-list-item-content-btn']">
|
||||
{{ item.enabled==1?"Enable":"Disabled" }}
|
||||
<div
|
||||
:class="[
|
||||
item.enabled == 1 ? 'monitor-list-item-content-enable' : 'monitor-list-item-content-disable',
|
||||
'monitor-list-item-content-btn',
|
||||
]"
|
||||
>
|
||||
{{ item.enabled == 1 ? 'Enable' : 'Disabled' }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="monitor-list-item-footer">
|
||||
<div class="monitor-list-item-footer-group">
|
||||
<span style="color: #5b9cba;">Alarm Contact Group:</span>
|
||||
<span style="color: #ade6ee;">{{ item.groupName }}</span>
|
||||
<span style="color: #5b9cba">Alarm Contact Group:</span>
|
||||
<span style="color: #ade6ee">{{ item.groupName }}</span>
|
||||
</div>
|
||||
<div class="monitor-list-item-footer-actions">
|
||||
<span title="Edit" class="actions-edit" @click="editItem(item.id)"></span>
|
||||
<span title="Delete" class="actions-delete" @click="deleteItem(item.id)"></span>
|
||||
<span v-if="item.enabled==1" title="Enable" class="actions-enable" @click="changeItemStatus(item.id,item.enabled)">
|
||||
<span
|
||||
v-if="item.enabled == 1"
|
||||
title="Enable"
|
||||
class="actions-enable"
|
||||
@click="changeItemStatus(item.id, item.enabled)"
|
||||
>
|
||||
</span>
|
||||
<span v-if="item.enabled==0" title="Disabled" class="actions-disable" @click="changeItemStatus(item.id,item.enabled)">
|
||||
<span
|
||||
v-if="item.enabled == 0"
|
||||
title="Disabled"
|
||||
class="actions-disable"
|
||||
@click="changeItemStatus(item.id, item.enabled)"
|
||||
>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a-spin>
|
||||
<a-pagination
|
||||
<a-pagination
|
||||
size="small"
|
||||
v-model="ipagination.current"
|
||||
v-model="ipagination.current"
|
||||
:pageSize="ipagination.pageSize"
|
||||
:page-size-options="ipagination.pageSizeOptions"
|
||||
show-size-changer
|
||||
show-quick-jumper
|
||||
:total="ipagination.total"
|
||||
:show-total="(total, range) => `Total ${total} items Page ${ipagination.current} / ${Math.ceil(total / ipagination.pageSize)}`"
|
||||
show-less-items
|
||||
:show-total="
|
||||
(total, range) =>
|
||||
`Total ${total} items Page ${ipagination.current} / ${Math.ceil(total / ipagination.pageSize)}`
|
||||
"
|
||||
show-less-items
|
||||
@change="handlePageChange"
|
||||
@showSizeChange="handleSizeChange"
|
||||
/>
|
||||
</div>
|
||||
<a-modal
|
||||
:title="isAdd ? 'Add Rule' : 'Edit Rule'"
|
||||
:width="800"
|
||||
v-model="visible"
|
||||
<a-modal
|
||||
:title="isAdd ? 'Add Rule' : 'Edit Rule'"
|
||||
:width="800"
|
||||
v-model="visible"
|
||||
:maskClosable="false"
|
||||
@cancel="onCancel"
|
||||
>
|
||||
<a-form
|
||||
:form="form"
|
||||
:label-col="labelCol"
|
||||
:wrapper-col="wrapperCol"
|
||||
>
|
||||
<a-form :form="form" :label-col="labelCol" :wrapper-col="wrapperCol">
|
||||
<a-form-item label="Name">
|
||||
<a-input
|
||||
v-decorator="[
|
||||
'name',
|
||||
{
|
||||
'name',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input name!' }],
|
||||
initialVale: this.formVal.name
|
||||
}
|
||||
initialVale: this.formVal.name,
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
|
||||
|
||||
<a-form-item label="Source">
|
||||
<dic-select
|
||||
type="checkbox"
|
||||
dictCode="alarm_analyse_rule_source"
|
||||
v-decorator="[
|
||||
'source',
|
||||
{
|
||||
'source',
|
||||
{
|
||||
rules: [{ required: true }],
|
||||
initialVale: this.formVal.source
|
||||
}
|
||||
initialVale: this.formVal.source,
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="Station">
|
||||
<a-select
|
||||
class="form-select"
|
||||
mode="multiple"
|
||||
mode="multiple"
|
||||
placeholder="select..."
|
||||
:filter-option="filterOption"
|
||||
show-arrow
|
||||
show-arrow
|
||||
:options="stationOptions"
|
||||
v-decorator="[
|
||||
'station',
|
||||
{
|
||||
'station',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please select station' }],
|
||||
initialVale: this.formVal.station
|
||||
}
|
||||
initialVale: this.formVal.station,
|
||||
},
|
||||
]"
|
||||
>
|
||||
<img slot="suffixIcon" src="@/assets/images/global/select-down.png" alt="" />
|
||||
|
@ -200,18 +209,18 @@
|
|||
<a-form-item label="Nuclide">
|
||||
<a-select
|
||||
class="form-select"
|
||||
mode="multiple"
|
||||
mode="multiple"
|
||||
placeholder="select..."
|
||||
:maxTagCount="5"
|
||||
:maxTagCount="5"
|
||||
:filter-option="filterOption"
|
||||
show-arrow
|
||||
show-arrow
|
||||
:options="nuclideOptions"
|
||||
v-decorator="[
|
||||
'nuclide',
|
||||
{
|
||||
'nuclide',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please select nuclide' }],
|
||||
initialVale: this.formVal.nuclide
|
||||
}
|
||||
initialVale: this.formVal.nuclide,
|
||||
},
|
||||
]"
|
||||
>
|
||||
<img slot="suffixIcon" src="@/assets/images/global/select-down.png" alt="" />
|
||||
|
@ -222,11 +231,11 @@
|
|||
type="checkbox"
|
||||
dictCode="spectral_qualifier"
|
||||
v-decorator="[
|
||||
'qualifier',
|
||||
{
|
||||
'qualifier',
|
||||
{
|
||||
rules: [{ required: true }],
|
||||
initialVale: this.formVal.qualifier
|
||||
}
|
||||
initialVale: this.formVal.qualifier,
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
|
@ -236,11 +245,11 @@
|
|||
layout="vertical"
|
||||
dictCode="alarm_analyse_rule_condition"
|
||||
v-decorator="[
|
||||
'condition',
|
||||
{
|
||||
'condition',
|
||||
{
|
||||
rules: [{ required: true }],
|
||||
initialVale: this.formVal.condition
|
||||
}
|
||||
initialVale: this.formVal.condition,
|
||||
},
|
||||
]"
|
||||
>
|
||||
</dic-select>
|
||||
|
@ -248,16 +257,16 @@
|
|||
<a-form-item label="Contact Group">
|
||||
<a-select
|
||||
class="form-select"
|
||||
:options="contactGroupOptions"
|
||||
show-arrow
|
||||
:options="contactGroupOptions"
|
||||
show-arrow
|
||||
allowClear
|
||||
placeholder="select..."
|
||||
placeholder="select..."
|
||||
v-decorator="[
|
||||
'contactGroup',
|
||||
{
|
||||
'contactGroup',
|
||||
{
|
||||
rules: [{ required: true }],
|
||||
initialVale: this.formVal.contactGroup
|
||||
}
|
||||
initialVale: this.formVal.contactGroup,
|
||||
},
|
||||
]"
|
||||
>
|
||||
<img slot="suffixIcon" src="@/assets/images/global/select-down.png" alt="" />
|
||||
|
@ -265,12 +274,12 @@
|
|||
</a-form-item>
|
||||
<a-form-item label="Remark">
|
||||
<a-input
|
||||
type="textarea"
|
||||
type="textarea"
|
||||
v-decorator="[
|
||||
'remark',
|
||||
{
|
||||
initialVale: this.formVal.remark
|
||||
}
|
||||
'remark',
|
||||
{
|
||||
initialVale: this.formVal.remark,
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
|
@ -278,7 +287,7 @@
|
|||
<template slot="footer">
|
||||
<a-space class="operators" :size="20">
|
||||
<a-button type="success" @click="onSave">Save</a-button>
|
||||
<a-button type="warn" @click="onCancel">Cancel</a-button>
|
||||
<a-button type="warn" @click="onCancel">Cancel</a-button>
|
||||
</a-space>
|
||||
</template>
|
||||
</a-modal>
|
||||
|
@ -287,7 +296,7 @@
|
|||
|
||||
<script>
|
||||
import { getAction, postAction, httpAction, deleteAction, putAction } from '@/api/manage'
|
||||
import DicSelect from '../../components/dicSelect.vue';
|
||||
import DicSelect from '../../components/dicSelect.vue'
|
||||
export default {
|
||||
components: {
|
||||
DicSelect,
|
||||
|
@ -300,21 +309,21 @@ export default {
|
|||
queryParams: {
|
||||
station: undefined,
|
||||
source: undefined,
|
||||
nuclide: undefined
|
||||
nuclide: undefined,
|
||||
},
|
||||
sourceOptions: [
|
||||
{
|
||||
label: "IDC",
|
||||
value: "idc"
|
||||
label: 'IDC',
|
||||
value: 'idc',
|
||||
},
|
||||
{
|
||||
label: "ARMD",
|
||||
value: "armd"
|
||||
}
|
||||
label: 'ARMD',
|
||||
value: 'armd',
|
||||
},
|
||||
],
|
||||
stationOptions: [],
|
||||
nuclideOptions: [],
|
||||
ipagination:{
|
||||
ipagination: {
|
||||
current: 1,
|
||||
pageSize: 9,
|
||||
pageSizeOptions: ['9', '18', '27'],
|
||||
|
@ -324,66 +333,66 @@ export default {
|
|||
},
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
total: 0
|
||||
total: 0,
|
||||
},
|
||||
labelCol: { span: 4 },
|
||||
wrapperCol: { span: 18 },
|
||||
form: this.$form.createForm(this),
|
||||
contactGroupOptions: [],
|
||||
formVal: {
|
||||
name: "",
|
||||
name: '',
|
||||
source: null,
|
||||
station: undefined,
|
||||
nuclide: undefined,
|
||||
qualifier: null,
|
||||
condition: null,
|
||||
contactGroup: undefined,
|
||||
remark: ""
|
||||
remark: '',
|
||||
},
|
||||
monitorList: [],
|
||||
currId:"",
|
||||
currId: '',
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.getStationList();
|
||||
this.getNuclideList();
|
||||
this.getAlarmGroup();
|
||||
created() {
|
||||
this.getStationList()
|
||||
this.getNuclideList()
|
||||
this.getAlarmGroup()
|
||||
this.getAlarmRulesPage()
|
||||
},
|
||||
methods: {
|
||||
getStationList() {
|
||||
getAction("/webStatistics/findStationList",{menuName:""}).then(res => {
|
||||
getAction('/webStatistics/findStationList', { menuName: '' }).then((res) => {
|
||||
if (res.success) {
|
||||
if (res.result.length>0) {
|
||||
this.stationOptions = res.result.map(item => {
|
||||
if (res.result.length > 0) {
|
||||
this.stationOptions = res.result.map((item) => {
|
||||
return {
|
||||
label: item.stationCode,
|
||||
value: `${item.stationId}`
|
||||
value: `${item.stationId}`,
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.stationOptions=[]
|
||||
this.stationOptions = []
|
||||
}
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
getNuclideList() {
|
||||
getAction("/sys/defaultNuclide/allName",{useType:2}).then(res => {
|
||||
getAction('/sys/defaultNuclide/allName', { useType: 2 }).then((res) => {
|
||||
if (res.success) {
|
||||
if (res.result.length>0) {
|
||||
this.nuclideOptions = res.result.map(item => {
|
||||
if (res.result.length > 0) {
|
||||
this.nuclideOptions = res.result.map((item) => {
|
||||
return {
|
||||
label: item,
|
||||
value: item
|
||||
value: item,
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.nuclideOptions=[]
|
||||
this.nuclideOptions = []
|
||||
}
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
@ -392,9 +401,7 @@ export default {
|
|||
this.visible = true
|
||||
},
|
||||
filterOption(input, option) {
|
||||
return (
|
||||
option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||
);
|
||||
return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||
},
|
||||
onStationChange(val) {
|
||||
this.queryParams.station = val
|
||||
|
@ -412,15 +419,15 @@ export default {
|
|||
pageSize: this.ipagination.pageSize,
|
||||
stations: this.queryParams.station,
|
||||
source: this.queryParams.source,
|
||||
nuclides: this.queryParams.nuclide
|
||||
nuclides: this.queryParams.nuclide,
|
||||
}
|
||||
getAction("/alarmAnalysisRule/findPage", params).then(res => {
|
||||
getAction('/alarmAnalysisRule/findPage', params).then((res) => {
|
||||
this.spinning = false
|
||||
if (res.success) {
|
||||
this.monitorList = res.result.records
|
||||
this.ipagination.total = res.result.total
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
@ -428,10 +435,10 @@ export default {
|
|||
this.ipagination.current = 1
|
||||
this.getAlarmRulesPage()
|
||||
},
|
||||
editItem(id) {
|
||||
editItem(id) {
|
||||
this.currId = id
|
||||
getAction("/alarmAnalysisRule/finInfo", { id }).then( res => {
|
||||
if (res.success) {
|
||||
getAction('/alarmAnalysisRule/finInfo', { id }).then((res) => {
|
||||
if (res.success) {
|
||||
this.isAdd = false
|
||||
this.visible = true
|
||||
this.$nextTick(() => {
|
||||
|
@ -443,40 +450,40 @@ export default {
|
|||
qualifier: res.result.qualifierChecked.join(','),
|
||||
condition: res.result.conditionChecked.join(','),
|
||||
contactGroup: res.result.contactGroup,
|
||||
remark: res.result.remark
|
||||
});
|
||||
remark: res.result.remark,
|
||||
})
|
||||
})
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
deleteItem(id) {
|
||||
},
|
||||
deleteItem(id) {
|
||||
let _this = this
|
||||
this.$confirm({
|
||||
title: 'Are you sure to delete this item?',
|
||||
onOk() {
|
||||
deleteAction("/alarmAnalysisRule/delete", {id:id}).then(res => {
|
||||
deleteAction('/alarmAnalysisRule/delete', { id: id }).then((res) => {
|
||||
if (res.success) {
|
||||
_this.$message.success("success")
|
||||
_this.$message.success('success')
|
||||
_this.getAlarmRulesPage()
|
||||
} else {
|
||||
_this.$message.warning("This operation fails. Contact your system administrator")
|
||||
_this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
onCancel() {
|
||||
console.log('Cancel');
|
||||
console.log('Cancel')
|
||||
},
|
||||
});
|
||||
},
|
||||
changeItemStatus(id, isEnabled) {
|
||||
putAction(`/alarmAnalysisRule/updateStatus?id=${id}&enabled=${isEnabled==1?0:1}`).then(res => {
|
||||
})
|
||||
},
|
||||
changeItemStatus(id, isEnabled) {
|
||||
putAction(`/alarmAnalysisRule/updateStatus?id=${id}&enabled=${isEnabled == 1 ? 0 : 1}`).then((res) => {
|
||||
if (res.success) {
|
||||
this.$message.success("success")
|
||||
this.$message.success('success')
|
||||
this.getAlarmRulesPage()
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
@ -493,54 +500,54 @@ export default {
|
|||
getAlarmGroup() {
|
||||
let params = {
|
||||
pageNo: 1,
|
||||
pageSize: 9999
|
||||
pageSize: 9999,
|
||||
}
|
||||
getAction("/alarmContactGroup/findPage", params).then(res => {
|
||||
getAction('/alarmContactGroup/findPage', params).then((res) => {
|
||||
if (res.success) {
|
||||
this.contactGroupOptions = res.result.records.map(item => {
|
||||
this.contactGroupOptions = res.result.records.map((item) => {
|
||||
return {
|
||||
label: item.name,
|
||||
value: item.id
|
||||
value: item.id,
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
onSave() {
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
let params = {
|
||||
conditions:values.condition,
|
||||
name:values.name,
|
||||
remark:values.remark,
|
||||
stations:values.station.join(","),
|
||||
conditions: values.condition,
|
||||
name: values.name,
|
||||
remark: values.remark,
|
||||
stations: values.station.join(','),
|
||||
source: values.source,
|
||||
nuclides:values.nuclide.join(","),
|
||||
contactGroup:values.contactGroup,
|
||||
nuclides: values.nuclide.join(','),
|
||||
contactGroup: values.contactGroup,
|
||||
spectralQualifier: values.qualifier,
|
||||
}
|
||||
if (this.isAdd) {
|
||||
postAction("/alarmAnalysisRule/add", params).then(res => {
|
||||
postAction('/alarmAnalysisRule/add', params).then((res) => {
|
||||
if (res.success) {
|
||||
this.visible = false
|
||||
this.form.resetFields()
|
||||
this.$message.success("success")
|
||||
this.$message.success('success')
|
||||
this.getAlarmRulesPage()
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
} else {
|
||||
httpAction("/alarmAnalysisRule/edit", {...params,id: this.currId}, "put").then(res => {
|
||||
httpAction('/alarmAnalysisRule/edit', { ...params, id: this.currId }, 'put').then((res) => {
|
||||
if (res.success) {
|
||||
this.visible = false
|
||||
this.form.resetFields()
|
||||
this.$message.success("success")
|
||||
this.$message.success('success')
|
||||
this.getAlarmRulesPage()
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
}
|
||||
|
@ -556,13 +563,13 @@ export default {
|
|||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.ant-row-flex{
|
||||
.ant-row-flex {
|
||||
flex-flow: nowrap;
|
||||
}
|
||||
.ant-select{
|
||||
.ant-select {
|
||||
width: 206px;
|
||||
}
|
||||
.form-select{
|
||||
.form-select {
|
||||
width: 100%;
|
||||
}
|
||||
.operators {
|
||||
|
@ -572,10 +579,10 @@ export default {
|
|||
width: 92px;
|
||||
}
|
||||
}
|
||||
/deep/.ant-modal-title{
|
||||
/deep/.ant-modal-title {
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
.rules-header{
|
||||
.rules-header {
|
||||
height: 50px;
|
||||
border-top: 1px solid rgba(13, 235, 201, 0.3);
|
||||
border-bottom: 1px solid rgba(13, 235, 201, 0.3);
|
||||
|
@ -585,7 +592,7 @@ export default {
|
|||
justify-content: space-between;
|
||||
padding: 0 10px;
|
||||
background: rgba(12, 235, 201, 0.05);
|
||||
.item-label{
|
||||
.item-label {
|
||||
display: inline-block;
|
||||
font-size: 16px;
|
||||
font-family: ArialMT;
|
||||
|
@ -594,44 +601,44 @@ export default {
|
|||
height: 32px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.rules-add{
|
||||
.rules-add {
|
||||
background-color: #1397a3;
|
||||
font-family: ArialMT;
|
||||
color: #ffffff;
|
||||
color: #ffffff;
|
||||
border: none;
|
||||
}
|
||||
.search-btn{
|
||||
.search-btn {
|
||||
margin-left: 10px;
|
||||
background-color: #1397a3;
|
||||
font-family: ArialMT;
|
||||
color: #ffffff;
|
||||
color: #ffffff;
|
||||
border: none;
|
||||
}
|
||||
.rules-reset{
|
||||
.rules-reset {
|
||||
background-color: #1397a3;
|
||||
font-family: ArialMT;
|
||||
color: #ffffff;
|
||||
color: #ffffff;
|
||||
border: none;
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
.rules-content{
|
||||
.rules-content {
|
||||
height: calc(100% - 65px);
|
||||
margin-left: 20px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
.ant-spin-nested-loading{
|
||||
.ant-spin-nested-loading {
|
||||
width: 100%;
|
||||
height: calc(100% - 40px);
|
||||
}
|
||||
.monitor-list{
|
||||
.monitor-list {
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
display: flex;
|
||||
flex-wrap:wrap;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
align-content: flex-start;
|
||||
&-item{
|
||||
&-item {
|
||||
width: 32.76%;
|
||||
height: 224px;
|
||||
// margin-top: 15px;
|
||||
|
@ -639,7 +646,7 @@ export default {
|
|||
border: solid 1px rgba(65, 111, 127, 0.5);
|
||||
position: relative;
|
||||
margin-top: 15px;
|
||||
&-title{
|
||||
&-title {
|
||||
height: 50px;
|
||||
padding: 0 15px 0 20px;
|
||||
background-color: rgba(13, 109, 118, 0.2);
|
||||
|
@ -648,11 +655,11 @@ export default {
|
|||
justify-content: space-between;
|
||||
line-height: 50px;
|
||||
font-family: ArialMT;
|
||||
&-name{
|
||||
&-name {
|
||||
font-size: 16px;
|
||||
color: #00bded;
|
||||
}
|
||||
&-server{
|
||||
&-server {
|
||||
width: 55%;
|
||||
font-size: 14px;
|
||||
text-align: right;
|
||||
|
@ -661,18 +668,18 @@ export default {
|
|||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
&-content{
|
||||
&-content {
|
||||
padding: 15px 20px;
|
||||
&-info{
|
||||
&-info {
|
||||
font-family: ArialMT;
|
||||
font-size: 16px;
|
||||
color: #ade6ee;
|
||||
&-key{
|
||||
&-key {
|
||||
// display: inline-block;
|
||||
// width: 120px;
|
||||
// vertical-align: middle;
|
||||
}
|
||||
&-val{
|
||||
&-val {
|
||||
margin-left: 5px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
@ -680,19 +687,19 @@ export default {
|
|||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
&-btn{
|
||||
&-btn {
|
||||
margin-top: 10px;
|
||||
display: inline-block;
|
||||
padding: 3px 10px;
|
||||
}
|
||||
&-enable{
|
||||
&-enable {
|
||||
background-color: #098839;
|
||||
}
|
||||
&-disable{
|
||||
&-disable {
|
||||
background-color: #8a8a8a;
|
||||
}
|
||||
}
|
||||
&-footer{
|
||||
&-footer {
|
||||
width: 100%;
|
||||
height: 32px;
|
||||
position: absolute;
|
||||
|
@ -701,48 +708,48 @@ export default {
|
|||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
&-group{
|
||||
&-group {
|
||||
font-family: ArialMT;
|
||||
font-size: 14px;
|
||||
font-size: 14px;
|
||||
}
|
||||
&-actions{
|
||||
&-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
span{
|
||||
span {
|
||||
display: inline-block;
|
||||
width: 26px;
|
||||
height: 26px;
|
||||
margin-left: 5px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.actions-edit{
|
||||
.actions-edit {
|
||||
background: url(~@/assets/images/abnormalAlarm/edit.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
&:hover{
|
||||
&:hover {
|
||||
background: url(~@/assets/images/abnormalAlarm/edit-active.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
.actions-delete{
|
||||
.actions-delete {
|
||||
background: url(~@/assets/images/abnormalAlarm/delete.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
&:hover{
|
||||
&:hover {
|
||||
background: url(~@/assets/images/abnormalAlarm/delete-active.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
.actions-enable{
|
||||
.actions-enable {
|
||||
background: url(~@/assets/images/abnormalAlarm/enable.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
&:hover{
|
||||
&:hover {
|
||||
background: url(~@/assets/images/abnormalAlarm/enable-active.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
.actions-disable{
|
||||
.actions-disable {
|
||||
background: url(~@/assets/images/abnormalAlarm/disable.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
&:hover{
|
||||
&:hover {
|
||||
background: url(~@/assets/images/abnormalAlarm/disable-active.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
@ -750,12 +757,12 @@ export default {
|
|||
}
|
||||
}
|
||||
}
|
||||
&::after{
|
||||
&::after {
|
||||
content: '';
|
||||
width: 32.76%;
|
||||
}
|
||||
}
|
||||
.ant-pagination{
|
||||
.ant-pagination {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: 0;
|
||||
|
|
|
@ -1,17 +1,15 @@
|
|||
<template>
|
||||
<div style="height: 100%;">
|
||||
<div style="height: 100%">
|
||||
<div class="search-bar">
|
||||
<a-row type="flex">
|
||||
<a-col flex="108px">
|
||||
<a-button class="search-btn" type="primary" @click="handleConfig">
|
||||
Config
|
||||
</a-button>
|
||||
<a-button class="search-btn" type="primary" @click="handleConfig"> Config </a-button>
|
||||
</a-col>
|
||||
<a-col flex="380px">
|
||||
<span class="item-label">Cacl date</span>
|
||||
<a-range-picker
|
||||
:value="[moment(queryParams.startDate), moment(queryParams.endDate)]"
|
||||
@change="onRangeDateChange"
|
||||
@change="onRangeDateChange"
|
||||
/>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
@ -27,59 +25,58 @@
|
|||
:canSelect="false"
|
||||
>
|
||||
</TableList>
|
||||
<a-pagination
|
||||
<a-pagination
|
||||
size="small"
|
||||
v-model="ipagination.current"
|
||||
v-model="ipagination.current"
|
||||
:pageSize="ipagination.pageSize"
|
||||
:page-size-options="ipagination.pageSizeOptions"
|
||||
show-size-changer
|
||||
show-quick-jumper
|
||||
:total="ipagination.total"
|
||||
:show-total="(total, range) => `Total ${total} items Page ${ipagination.current} / ${Math.ceil(total / ipagination.pageSize)}`"
|
||||
show-less-items
|
||||
:show-total="
|
||||
(total, range) =>
|
||||
`Total ${total} items Page ${ipagination.current} / ${Math.ceil(total / ipagination.pageSize)}`
|
||||
"
|
||||
show-less-items
|
||||
@change="handlePageChange"
|
||||
@showSizeChange="handleSizeChange"
|
||||
/>
|
||||
</div>
|
||||
<a-modal
|
||||
title="Config"
|
||||
v-model="visible"
|
||||
@cancel="onCancel"
|
||||
>
|
||||
<a-form :form="form" :label-col="{ span: 5 }" :wrapper-col="{ span: 17 }">
|
||||
<a-form-item label="Cycle">
|
||||
<a-input-number
|
||||
v-decorator="[
|
||||
'days',
|
||||
{
|
||||
rules: [
|
||||
{ required: true, message: 'Please input days!' },
|
||||
{ pattern: new RegExp('^[1-9]\\d*$'), message: 'Please input a positive integer!' },
|
||||
],
|
||||
initialVale: this.formVal.days
|
||||
}
|
||||
]"
|
||||
/>days
|
||||
</a-form-item>
|
||||
<a-form-item label="Index">
|
||||
<a-input-number
|
||||
v-decorator="[
|
||||
'index',
|
||||
{
|
||||
rules: [
|
||||
{ required: true, message: 'Please input index!' },
|
||||
{ pattern: new RegExp('^([1-9]|[1-9]\\d|100)$'),message: 'Please input an integer from 1 to 100!'},
|
||||
],
|
||||
initialVale: this.formVal.index
|
||||
}
|
||||
]"
|
||||
/>%
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
<a-modal title="Config" v-model="visible" :maskClosable="false" @cancel="onCancel">
|
||||
<a-form :form="form" :label-col="{ span: 5 }" :wrapper-col="{ span: 17 }">
|
||||
<a-form-item label="Cycle">
|
||||
<a-input-number
|
||||
v-decorator="[
|
||||
'days',
|
||||
{
|
||||
rules: [
|
||||
{ required: true, message: 'Please input days!' },
|
||||
{ pattern: new RegExp('^[1-9]\\d*$'), message: 'Please input a positive integer!' },
|
||||
],
|
||||
initialVale: this.formVal.days,
|
||||
},
|
||||
]"
|
||||
/>days
|
||||
</a-form-item>
|
||||
<a-form-item label="Index">
|
||||
<a-input-number
|
||||
v-decorator="[
|
||||
'index',
|
||||
{
|
||||
rules: [
|
||||
{ required: true, message: 'Please input index!' },
|
||||
{ pattern: new RegExp('^([1-9]|[1-9]\\d|100)$'), message: 'Please input an integer from 1 to 100!' },
|
||||
],
|
||||
initialVale: this.formVal.index,
|
||||
},
|
||||
]"
|
||||
/>%
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
<template slot="footer">
|
||||
<a-space class="operators" :size="20">
|
||||
<a-button type="success" @click="onSave">Save</a-button>
|
||||
<a-button type="warn" @click="onCancel">Cancel</a-button>
|
||||
<a-button type="warn" @click="onCancel">Cancel</a-button>
|
||||
</a-space>
|
||||
</template>
|
||||
</a-modal>
|
||||
|
@ -88,31 +85,35 @@
|
|||
|
||||
<script>
|
||||
import dateFormat from '@/components/jeecg/JEasyCron/format-date'
|
||||
import moment from 'moment';
|
||||
import TableList from '../../components/tableList.vue';
|
||||
import moment from 'moment'
|
||||
import TableList from '../../components/tableList.vue'
|
||||
import { getAction, postAction, httpAction, deleteAction } from '@/api/manage'
|
||||
const columns = [
|
||||
{
|
||||
title: 'NUCLIDE',
|
||||
align: 'center',
|
||||
dataIndex: 'nuclide',
|
||||
},{
|
||||
},
|
||||
{
|
||||
title: 'VALUE',
|
||||
align: 'center',
|
||||
dataIndex: 'val',
|
||||
},{
|
||||
},
|
||||
{
|
||||
title: 'SOURCE TYPE',
|
||||
align: 'center',
|
||||
dataIndex: 'datasource',
|
||||
},{
|
||||
},
|
||||
{
|
||||
title: 'CACL DATE',
|
||||
align: 'center',
|
||||
dataIndex: 'caclDate',
|
||||
},{
|
||||
},
|
||||
{
|
||||
title: 'CYCLE',
|
||||
align: 'center',
|
||||
dataIndex: 'cycle'
|
||||
}
|
||||
dataIndex: 'cycle',
|
||||
},
|
||||
]
|
||||
export default {
|
||||
components: {
|
||||
|
@ -125,9 +126,9 @@ export default {
|
|||
loading: false,
|
||||
queryParams: {
|
||||
startDate: dateFormat(new Date(), 'yyyy-MM-dd'),
|
||||
endDate: dateFormat(new Date(), 'yyyy-MM-dd')
|
||||
endDate: dateFormat(new Date(), 'yyyy-MM-dd'),
|
||||
},
|
||||
ipagination:{
|
||||
ipagination: {
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
pageSizeOptions: ['10', '20', '30'],
|
||||
|
@ -137,63 +138,63 @@ export default {
|
|||
},
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
total: 0
|
||||
total: 0,
|
||||
},
|
||||
isAdd: true,
|
||||
visible: false,
|
||||
form: this.$form.createForm(this),
|
||||
formVal: {
|
||||
days:"",
|
||||
index: "",
|
||||
days: '',
|
||||
index: '',
|
||||
},
|
||||
currId:""
|
||||
currId: '',
|
||||
}
|
||||
},
|
||||
created () {
|
||||
created() {
|
||||
this.queryParams.startDate = this.getBeforeDate(1)
|
||||
},
|
||||
mounted () {
|
||||
this.getNuclideAvgList();
|
||||
mounted() {
|
||||
this.getNuclideAvgList()
|
||||
},
|
||||
methods: {
|
||||
// 获取n天前的日期
|
||||
getBeforeDate(n){
|
||||
var n = n;
|
||||
var d = new Date();
|
||||
var year = d.getFullYear();
|
||||
var mon=d.getMonth()+1;
|
||||
var day=d.getDate();
|
||||
if(day <= n){
|
||||
if(mon>1) {
|
||||
mon=mon-1;
|
||||
getBeforeDate(n) {
|
||||
var n = n
|
||||
var d = new Date()
|
||||
var year = d.getFullYear()
|
||||
var mon = d.getMonth() + 1
|
||||
var day = d.getDate()
|
||||
if (day <= n) {
|
||||
if (mon > 1) {
|
||||
mon = mon - 1
|
||||
} else {
|
||||
year = year-1;
|
||||
mon = 12;
|
||||
year = year - 1
|
||||
mon = 12
|
||||
}
|
||||
}
|
||||
d.setDate(d.getDate()-n);
|
||||
year = d.getFullYear();
|
||||
mon=d.getMonth()+1;
|
||||
day=d.getDate();
|
||||
var s = year+"-"+(mon<10?('0'+mon):mon)+"-"+(day<10?('0'+day):day);
|
||||
return s;
|
||||
d.setDate(d.getDate() - n)
|
||||
year = d.getFullYear()
|
||||
mon = d.getMonth() + 1
|
||||
day = d.getDate()
|
||||
var s = year + '-' + (mon < 10 ? '0' + mon : mon) + '-' + (day < 10 ? '0' + day : day)
|
||||
return s
|
||||
},
|
||||
moment,
|
||||
getNuclideAvgList() {
|
||||
this.loading = true
|
||||
let params = {
|
||||
startDate:this.queryParams.startDate,
|
||||
endDate:this.queryParams.endDate,
|
||||
startDate: this.queryParams.startDate,
|
||||
endDate: this.queryParams.endDate,
|
||||
pageNo: this.ipagination.current,
|
||||
pageSize: this.ipagination.pageSize
|
||||
pageSize: this.ipagination.pageSize,
|
||||
}
|
||||
getAction("/nuclideAvg/findPage", params).then(res => {
|
||||
getAction('/nuclideAvg/findPage', 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")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
@ -214,31 +215,31 @@ export default {
|
|||
},
|
||||
handleConfig() {
|
||||
this.visible = true
|
||||
getAction("/nuclideParam/findInfo").then(res => {
|
||||
getAction('/nuclideParam/findInfo').then((res) => {
|
||||
if (res.success) {
|
||||
this.currId = res.result.id
|
||||
this.form.setFieldsValue({
|
||||
days: res.result.days,
|
||||
index: res.result.index*100
|
||||
});
|
||||
index: res.result.index * 100,
|
||||
})
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
onSave() {
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
let params = {
|
||||
id: this.currId,
|
||||
days: values.days,
|
||||
index:values.index/100
|
||||
index: values.index / 100,
|
||||
}
|
||||
httpAction("/nuclideParam/update", params, "put").then(res => {
|
||||
httpAction('/nuclideParam/update', params, 'put').then((res) => {
|
||||
if (res.success) {
|
||||
this.form.resetFields()
|
||||
this.visible = false
|
||||
this.$message.success("success")
|
||||
this.$message.success('success')
|
||||
} else {
|
||||
this.$message.info(res.result.message)
|
||||
}
|
||||
|
@ -255,7 +256,7 @@ export default {
|
|||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.search-bar{
|
||||
.search-bar {
|
||||
height: 50px;
|
||||
border-top: 1px solid rgba(13, 235, 201, 0.3);
|
||||
border-bottom: 1px solid rgba(13, 235, 201, 0.3);
|
||||
|
@ -263,16 +264,16 @@ export default {
|
|||
padding: 8px 10px;
|
||||
background: rgba(12, 235, 201, 0.05);
|
||||
}
|
||||
.ant-calendar-picker{
|
||||
.ant-calendar-picker {
|
||||
width: 270px;
|
||||
}
|
||||
.search-btn {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
/deep/ .ant-calendar-range-picker-separator{
|
||||
/deep/ .ant-calendar-range-picker-separator {
|
||||
color: white;
|
||||
}
|
||||
.item-label{
|
||||
.item-label {
|
||||
display: inline-block;
|
||||
font-size: 16px;
|
||||
font-family: ArialMT;
|
||||
|
@ -281,7 +282,7 @@ export default {
|
|||
height: 32px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.analysis-main{
|
||||
.analysis-main {
|
||||
width: 100%;
|
||||
height: calc(100% - 50px);
|
||||
overflow: hidden;
|
||||
|
@ -289,7 +290,7 @@ export default {
|
|||
margin-left: 20px;
|
||||
position: relative;
|
||||
}
|
||||
.ant-pagination{
|
||||
.ant-pagination {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: 0;
|
||||
|
@ -302,12 +303,12 @@ export default {
|
|||
width: 92px;
|
||||
}
|
||||
}
|
||||
/deep/.ant-modal-title{
|
||||
/deep/.ant-modal-title {
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
.ant-input-number{
|
||||
.ant-input-number {
|
||||
width: 85%;
|
||||
margin-right: 10px;
|
||||
background-color: #03353f !important
|
||||
background-color: #03353f !important;
|
||||
}
|
||||
</style>
|
|
@ -1,31 +1,25 @@
|
|||
<template>
|
||||
<div style="height: 100%;">
|
||||
<div style="height: 100%">
|
||||
<div class="view-header">
|
||||
<div class="view-num">Alarms:<span>{{ alarmTotal }}</span></div>
|
||||
<div class="view-num">
|
||||
Alarms:<span>{{ alarmTotal }}</span>
|
||||
</div>
|
||||
<div>
|
||||
<a-button class="view-btn" @click="onAdd">
|
||||
<img class="icon-add" src="@/assets/images/global/add.png" alt="" />
|
||||
<span style="margin-left: 10px;">
|
||||
Add
|
||||
</span>
|
||||
<span style="margin-left: 10px"> Add </span>
|
||||
</a-button>
|
||||
<a-button class="view-btn" @click="onEdit">
|
||||
<img class="icon-add" src="@/assets/images/global/edit.png" alt="" />
|
||||
<span style="margin-left: 10px;">
|
||||
Edit
|
||||
</span>
|
||||
<span style="margin-left: 10px"> Edit </span>
|
||||
</a-button>
|
||||
<a-button class="view-btn" @click="onDelete">
|
||||
<img class="icon-add" src="@/assets/images/global/delete.png" alt="" />
|
||||
<span style="margin-left: 10px;">
|
||||
Delete
|
||||
</span>
|
||||
<span style="margin-left: 10px"> Delete </span>
|
||||
</a-button>
|
||||
<a-button class="view-btn" @click="getSysDatabase">
|
||||
<img class="icon-add" src="@/assets/images/global/reset-pwd.png" alt="" />
|
||||
<span style="margin-left: 10px;">
|
||||
Refresh
|
||||
</span>
|
||||
<span style="margin-left: 10px"> Refresh </span>
|
||||
</a-button>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -42,120 +36,121 @@
|
|||
@cancleRowClick="cancelRow"
|
||||
@rowDbclick="onRowDbclick"
|
||||
>
|
||||
<template slot="status" slot-scope="{record}">
|
||||
<template slot="status" slot-scope="{ record }">
|
||||
<div>
|
||||
<img v-if="record.online" src="@/assets/images/abnormalAlarm/on.png" alt="">
|
||||
<img v-else src="@/assets/images/abnormalAlarm/off.png" alt="">
|
||||
<span :class="[record.online?'status-on':'status-off']">{{ record.online?"Connecting":"Disconnect" }}</span>
|
||||
<img v-if="record.online" src="@/assets/images/abnormalAlarm/on.png" alt="" />
|
||||
<img v-else src="@/assets/images/abnormalAlarm/off.png" alt="" />
|
||||
<span :class="[record.online ? 'status-on' : 'status-off']">{{
|
||||
record.online ? 'Connecting' : 'Disconnect'
|
||||
}}</span>
|
||||
</div>
|
||||
</template>
|
||||
<template slot="alarms" slot-scope="{text,record}">
|
||||
<span :class="[record.alarmRed?'isAlarm':'','alarm-text']">{{ text }}</span>
|
||||
<template slot="alarms" slot-scope="{ text, record }">
|
||||
<span :class="[record.alarmRed ? 'isAlarm' : '', 'alarm-text']">{{ text }}</span>
|
||||
</template>
|
||||
<template slot="cpu" slot-scope="{text,record}">
|
||||
<span :class="[record.cpuRed?'isRed':'','alarm-text']">{{ text?text:"--" }}</span>
|
||||
<template slot="cpu" slot-scope="{ text, record }">
|
||||
<span :class="[record.cpuRed ? 'isRed' : '', 'alarm-text']">{{ text ? text : '--' }}</span>
|
||||
</template>
|
||||
<template slot="memory" slot-scope="{text,record}">
|
||||
<span :class="[record.memoryRed?'isRed':'','alarm-text']">{{ text?text:"--" }}</span>
|
||||
<template slot="memory" slot-scope="{ text, record }">
|
||||
<span :class="[record.memoryRed ? 'isRed' : '', 'alarm-text']">{{ text ? text : '--' }}</span>
|
||||
</template>
|
||||
<template slot="disk" slot-scope="{text,record}">
|
||||
<span :class="[record.diskRed?'isRed':'','alarm-text']">{{ text?text:"--" }}</span>
|
||||
<template slot="disk" slot-scope="{ text, record }">
|
||||
<span :class="[record.diskRed ? 'isRed' : '', 'alarm-text']">{{ text ? text : '--' }}</span>
|
||||
</template>
|
||||
</TableList>
|
||||
</div>
|
||||
<a-pagination
|
||||
<a-pagination
|
||||
size="small"
|
||||
v-model="ipagination.current"
|
||||
v-model="ipagination.current"
|
||||
:pageSize="ipagination.pageSize"
|
||||
:page-size-options="ipagination.pageSizeOptions"
|
||||
show-size-changer
|
||||
show-quick-jumper
|
||||
:total="ipagination.total"
|
||||
:show-total="(total, range) => `Total ${total} items Page ${ipagination.current} / ${Math.ceil(total / ipagination.pageSize)}`"
|
||||
show-less-items
|
||||
:show-total="
|
||||
(total, range) =>
|
||||
`Total ${total} items Page ${ipagination.current} / ${Math.ceil(total / ipagination.pageSize)}`
|
||||
"
|
||||
show-less-items
|
||||
@change="handlePageChange"
|
||||
@showSizeChange="handleSizeChange"
|
||||
/>
|
||||
</div>
|
||||
<a-modal
|
||||
:title="isAdd ? 'Add' : 'Edit'"
|
||||
v-model="visible"
|
||||
@cancel="onCancel"
|
||||
>
|
||||
<a-form :form="form" :label-col="{ span: 6 }" :wrapper-col="{ span: 16 }">
|
||||
<a-form-item label="Name">
|
||||
<a-input
|
||||
v-decorator="[
|
||||
'name',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input name!' }],
|
||||
initialVale: this.formVal.name
|
||||
}
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="DB Type">
|
||||
<j-dict-select-tag
|
||||
placeholder="Please select a database type"
|
||||
dict-code="database_type"
|
||||
v-decorator="[
|
||||
'type',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please select a DB Type!' }],
|
||||
initialVale: this.formVal.type
|
||||
}
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="DB Port">
|
||||
<a-input-number
|
||||
v-decorator="[
|
||||
'port',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input port!' }],
|
||||
initialVale: this.formVal.port
|
||||
}
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="Ip Address">
|
||||
<a-input
|
||||
v-decorator="[
|
||||
'ipAddress',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input ip address!' }],
|
||||
initialVale: this.formVal.ipAddress
|
||||
}
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="DB Username">
|
||||
<a-input
|
||||
v-decorator="[
|
||||
'username',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input username!' }],
|
||||
initialVale: this.formVal.username
|
||||
}
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="DB Password">
|
||||
<a-input
|
||||
v-decorator="[
|
||||
'password',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input DB Password!' }],
|
||||
initialVale: this.formVal.password
|
||||
}
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
<a-modal :title="isAdd ? 'Add' : 'Edit'" v-model="visible" :maskClosable="false" @cancel="onCancel">
|
||||
<a-form :form="form" :label-col="{ span: 6 }" :wrapper-col="{ span: 16 }">
|
||||
<a-form-item label="Name">
|
||||
<a-input
|
||||
v-decorator="[
|
||||
'name',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input name!' }],
|
||||
initialVale: this.formVal.name,
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="DB Type">
|
||||
<j-dict-select-tag
|
||||
placeholder="Please select a database type"
|
||||
dict-code="database_type"
|
||||
v-decorator="[
|
||||
'type',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please select a DB Type!' }],
|
||||
initialVale: this.formVal.type,
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="DB Port">
|
||||
<a-input-number
|
||||
v-decorator="[
|
||||
'port',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input port!' }],
|
||||
initialVale: this.formVal.port,
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="Ip Address">
|
||||
<a-input
|
||||
v-decorator="[
|
||||
'ipAddress',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input ip address!' }],
|
||||
initialVale: this.formVal.ipAddress,
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="DB Username">
|
||||
<a-input
|
||||
v-decorator="[
|
||||
'username',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input username!' }],
|
||||
initialVale: this.formVal.username,
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="DB Password">
|
||||
<a-input
|
||||
v-decorator="[
|
||||
'password',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input DB Password!' }],
|
||||
initialVale: this.formVal.password,
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
<template slot="footer">
|
||||
<a-space class="operators" :size="20">
|
||||
<a-button type="success" @click="onSave">Save</a-button>
|
||||
<a-button type="warn" @click="onCancel">Cancel</a-button>
|
||||
<a-button type="warn" @click="onCancel">Cancel</a-button>
|
||||
</a-space>
|
||||
</template>
|
||||
</a-modal>
|
||||
|
@ -163,64 +158,73 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import TableList from '../../components/tableList.vue';
|
||||
import { getAction,postAction,httpAction,deleteAction } from '@/api/manage'
|
||||
import TableList from '../../components/tableList.vue'
|
||||
import { getAction, postAction, httpAction, deleteAction } from '@/api/manage'
|
||||
const columns = [
|
||||
{
|
||||
title: 'NAME',
|
||||
align: 'center',
|
||||
dataIndex: 'name'
|
||||
},{
|
||||
dataIndex: 'name',
|
||||
},
|
||||
{
|
||||
title: 'STATUS',
|
||||
align: 'center',
|
||||
dataIndex: 'online',
|
||||
scopedSlots: {
|
||||
customRender: 'status'
|
||||
}
|
||||
},{
|
||||
customRender: 'status',
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'IP ADDRESS',
|
||||
align: 'center',
|
||||
dataIndex: 'ipAddress'
|
||||
},{
|
||||
dataIndex: 'ipAddress',
|
||||
},
|
||||
{
|
||||
title: 'DB TYPE',
|
||||
align: 'center',
|
||||
dataIndex: 'dataBaseType'
|
||||
},{
|
||||
dataIndex: 'dataBaseType',
|
||||
},
|
||||
{
|
||||
title: 'PROT',
|
||||
align: 'center',
|
||||
dataIndex: 'port'
|
||||
},{
|
||||
dataIndex: 'port',
|
||||
},
|
||||
{
|
||||
title: 'SLOW QUERY',
|
||||
align: 'center',
|
||||
dataIndex: 'slowQuery'
|
||||
},{
|
||||
dataIndex: 'slowQuery',
|
||||
},
|
||||
{
|
||||
title: 'ALARMS',
|
||||
align: 'center',
|
||||
dataIndex: 'alarms',
|
||||
scopedSlots: {
|
||||
customRender: 'alarms',
|
||||
}
|
||||
},{
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'CPU UTILIZATION',
|
||||
align: 'center',
|
||||
dataIndex: 'cpuUutilzation',
|
||||
scopedSlots: {
|
||||
customRender: 'cpu',
|
||||
}
|
||||
},{
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'MEMORY USAGE',
|
||||
align: 'center',
|
||||
dataIndex: 'memoryUsage',
|
||||
scopedSlots: {
|
||||
customRender: 'memory',
|
||||
}
|
||||
},{
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'DISK USAGE',
|
||||
align: 'center',
|
||||
dataIndex: 'diskUsage',
|
||||
scopedSlots: {
|
||||
customRender: 'disk',
|
||||
}
|
||||
},
|
||||
},
|
||||
]
|
||||
export default {
|
||||
|
@ -229,22 +233,22 @@ export default {
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
loading:false,
|
||||
loading: false,
|
||||
isAdd: true,
|
||||
visible: false,
|
||||
form: this.$form.createForm(this),
|
||||
formVal: {
|
||||
username: "",
|
||||
password: "",
|
||||
name: "",
|
||||
username: '',
|
||||
password: '',
|
||||
name: '',
|
||||
type: undefined,
|
||||
port: "",
|
||||
ipAddress:""
|
||||
port: '',
|
||||
ipAddress: '',
|
||||
},
|
||||
currentId:"",
|
||||
currentId: '',
|
||||
columns,
|
||||
dataSource: [],
|
||||
ipagination:{
|
||||
ipagination: {
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
pageSizeOptions: ['10', '20', '30'],
|
||||
|
@ -254,36 +258,36 @@ export default {
|
|||
},
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
total: 0
|
||||
total: 0,
|
||||
},
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
alarmTotal() {
|
||||
let num= 0
|
||||
this.dataSource.forEach(item => {
|
||||
let num = 0
|
||||
this.dataSource.forEach((item) => {
|
||||
num = item.alarmRed ? num + item.alarms : num
|
||||
});
|
||||
})
|
||||
return num
|
||||
}
|
||||
},
|
||||
},
|
||||
mounted () {
|
||||
this.getSysDatabase();
|
||||
mounted() {
|
||||
this.getSysDatabase()
|
||||
},
|
||||
methods: {
|
||||
getSysDatabase() {
|
||||
this.loading = true
|
||||
let params = {
|
||||
pageNo: this.ipagination.current,
|
||||
pageSize: this.ipagination.pageSize
|
||||
pageSize: this.ipagination.pageSize,
|
||||
}
|
||||
getAction("/sysDatabase/findPage", params).then(res => {
|
||||
getAction('/sysDatabase/findPage', params).then((res) => {
|
||||
this.loading = false
|
||||
if (res.success) {
|
||||
this.ipagination.total = res.result.total
|
||||
this.dataSource = res.result.records
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
@ -305,7 +309,7 @@ export default {
|
|||
if (this.currentId) {
|
||||
this.isAdd = false
|
||||
this.visible = true
|
||||
getAction("/sysDatabase/findInfo", {id:this.currentId}).then(res => {
|
||||
getAction('/sysDatabase/findInfo', { id: this.currentId }).then((res) => {
|
||||
if (res.success) {
|
||||
this.form.setFieldsValue({
|
||||
username: res.result.username,
|
||||
|
@ -313,14 +317,14 @@ export default {
|
|||
name: res.result.name,
|
||||
type: res.result.type,
|
||||
port: res.result.port,
|
||||
ipAddress: res.result.ipAddress
|
||||
});
|
||||
ipAddress: res.result.ipAddress,
|
||||
})
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.$message.info("Please select a piece of data")
|
||||
this.$message.info('Please select a piece of data')
|
||||
}
|
||||
},
|
||||
onDelete() {
|
||||
|
@ -329,39 +333,39 @@ export default {
|
|||
this.$confirm({
|
||||
title: 'Are you sure to delete this item?',
|
||||
onOk() {
|
||||
deleteAction("/sysDatabase/deleteById", {id:_this.currentId}).then(res => {
|
||||
deleteAction('/sysDatabase/deleteById', { id: _this.currentId }).then((res) => {
|
||||
if (res.success) {
|
||||
_this.$message.success("success")
|
||||
this.currentId=""
|
||||
_this.$message.success('success')
|
||||
this.currentId = ''
|
||||
_this.getSysDatabase()
|
||||
} else {
|
||||
_this.$message.warning("This operation fails. Contact your system administrator")
|
||||
_this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
onCancel() {
|
||||
console.log('Cancel');
|
||||
console.log('Cancel')
|
||||
},
|
||||
});
|
||||
})
|
||||
} else {
|
||||
this.$message.info("Please select a piece of data")
|
||||
this.$message.info('Please select a piece of data')
|
||||
}
|
||||
},
|
||||
selectRow(record) {
|
||||
this.currentId = record.id
|
||||
},
|
||||
cancelRow() {
|
||||
this.currentId = ""
|
||||
this.currentId = ''
|
||||
},
|
||||
onSave() {
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
if (this.isAdd) {
|
||||
postAction("/sysDatabase/create", values).then(res => {
|
||||
postAction('/sysDatabase/create', values).then((res) => {
|
||||
if (res.success) {
|
||||
this.form.resetFields()
|
||||
this.visible = false
|
||||
this.$message.success("success")
|
||||
this.$message.success('success')
|
||||
this.getSysDatabase()
|
||||
} else {
|
||||
this.$message.info(res.result.message)
|
||||
|
@ -370,13 +374,13 @@ export default {
|
|||
} else {
|
||||
let params = {
|
||||
id: this.currentId,
|
||||
...values
|
||||
...values,
|
||||
}
|
||||
httpAction("/sysDatabase/update", params, "put").then(res => {
|
||||
httpAction('/sysDatabase/update', params, 'put').then((res) => {
|
||||
if (res.success) {
|
||||
this.form.resetFields()
|
||||
this.visible = false
|
||||
this.$message.success("success")
|
||||
this.$message.success('success')
|
||||
this.getSysDatabase()
|
||||
} else {
|
||||
this.$message.info(res.result.message)
|
||||
|
@ -384,28 +388,28 @@ export default {
|
|||
})
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
onCancel() {
|
||||
this.form.resetFields()
|
||||
this.visible = false
|
||||
},
|
||||
onRowDbclick(record) {
|
||||
console.log(record);
|
||||
console.log(record)
|
||||
let query = {
|
||||
id:record.id
|
||||
id: record.id,
|
||||
}
|
||||
this.$router.push({
|
||||
path: '/alarm/databaseMonitor/instances',
|
||||
query
|
||||
query,
|
||||
})
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.view-header{
|
||||
.view-header {
|
||||
height: 50px;
|
||||
border-top: 1px solid rgba(13, 235, 201, 0.3);
|
||||
border-bottom: 1px solid rgba(13, 235, 201, 0.3);
|
||||
|
@ -421,58 +425,58 @@ export default {
|
|||
color: #ade6ee;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
span{
|
||||
span {
|
||||
font-family: MicrogrammaD-MediExte;
|
||||
font-size: 30px;
|
||||
color: #d31f1f;
|
||||
}
|
||||
}
|
||||
}
|
||||
.view-btn{
|
||||
.view-btn {
|
||||
background-color: #1397a3;
|
||||
font-family: ArialMT;
|
||||
color: #ffffff;
|
||||
color: #ffffff;
|
||||
border: none;
|
||||
margin-left: 20px;
|
||||
box-shadow: 0px 1px 1px 0px #000000;;
|
||||
box-shadow: 0px 1px 1px 0px #000000;
|
||||
}
|
||||
}
|
||||
.view-main{
|
||||
.view-main {
|
||||
height: calc(100% - 50px);
|
||||
margin-left: 20px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
padding-top: 15px;
|
||||
&-table{
|
||||
&-table {
|
||||
height: calc(100% - 30px);
|
||||
overflow: auto;
|
||||
}
|
||||
.ant-pagination{
|
||||
.ant-pagination {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: 0;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
.status-on{
|
||||
.status-on {
|
||||
margin-left: 10px;
|
||||
font-family: MicrosoftYaHei;
|
||||
color: #4bc048;
|
||||
}
|
||||
.status-off{
|
||||
.status-off {
|
||||
font-family: MicrosoftYaHei;
|
||||
color: #868686;
|
||||
}
|
||||
.alarm-text{
|
||||
.alarm-text {
|
||||
font-family: MicrogrammaD-MediExte;
|
||||
font-size: 22px;
|
||||
color: #ade6ee;
|
||||
}
|
||||
.isAlarm{
|
||||
.isAlarm {
|
||||
color: #ed2d2d;
|
||||
}
|
||||
.isRed{
|
||||
.isRed {
|
||||
color: #f02c2c;
|
||||
}
|
||||
/deep/.ant-table-tbody tr{
|
||||
/deep/.ant-table-tbody tr {
|
||||
height: 88px;
|
||||
}
|
||||
}
|
||||
|
@ -483,11 +487,11 @@ export default {
|
|||
width: 92px;
|
||||
}
|
||||
}
|
||||
/deep/.ant-modal-title{
|
||||
/deep/.ant-modal-title {
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
.ant-input-number{
|
||||
.ant-input-number {
|
||||
width: 100%;
|
||||
background-color: #03353f !important
|
||||
background-color: #03353f !important;
|
||||
}
|
||||
</style>
|
|
@ -1,31 +1,25 @@
|
|||
<template>
|
||||
<div style="height: 100%;">
|
||||
<div style="height: 100%">
|
||||
<div class="view-header">
|
||||
<div class="view-num">Alarms:<span>{{ alarmTotal }}</span></div>
|
||||
<div class="view-num">
|
||||
Alarms:<span>{{ alarmTotal }}</span>
|
||||
</div>
|
||||
<div>
|
||||
<a-button class="view-btn" @click="onAdd">
|
||||
<img class="icon-add" src="@/assets/images/global/add.png" alt="" />
|
||||
<span style="margin-left: 10px;">
|
||||
Add
|
||||
</span>
|
||||
<span style="margin-left: 10px"> Add </span>
|
||||
</a-button>
|
||||
<a-button class="view-btn" @click="onEdit">
|
||||
<img class="icon-add" src="@/assets/images/global/edit.png" alt="" />
|
||||
<span style="margin-left: 10px;">
|
||||
Edit
|
||||
</span>
|
||||
<span style="margin-left: 10px"> Edit </span>
|
||||
</a-button>
|
||||
<a-button class="view-btn" @click="onDelete">
|
||||
<img class="icon-add" src="@/assets/images/global/delete.png" alt="" />
|
||||
<span style="margin-left: 10px;">
|
||||
Delete
|
||||
</span>
|
||||
<span style="margin-left: 10px"> Delete </span>
|
||||
</a-button>
|
||||
<a-button class="view-btn" @click="getSysEmail">
|
||||
<img class="icon-add" src="@/assets/images/global/reset-pwd.png" alt="" />
|
||||
<span style="margin-left: 10px;">
|
||||
Refresh
|
||||
</span>
|
||||
<span style="margin-left: 10px"> Refresh </span>
|
||||
</a-button>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -42,149 +36,146 @@
|
|||
@cancleRowClick="cancelRow"
|
||||
@rowDbclick="onRowDbclick"
|
||||
>
|
||||
<template slot="status" slot-scope="{record}">
|
||||
<template slot="status" slot-scope="{ record }">
|
||||
<div>
|
||||
<img v-if="record.online" src="@/assets/images/abnormalAlarm/on.png" alt="">
|
||||
<img v-else src="@/assets/images/abnormalAlarm/off.png" alt="">
|
||||
<span :class="[record.online?'status-on':'status-off']">{{ record.online?"Connecting":"Disconnect" }}</span>
|
||||
<img v-if="record.online" src="@/assets/images/abnormalAlarm/on.png" alt="" />
|
||||
<img v-else src="@/assets/images/abnormalAlarm/off.png" alt="" />
|
||||
<span :class="[record.online ? 'status-on' : 'status-off']">{{
|
||||
record.online ? 'Connecting' : 'Disconnect'
|
||||
}}</span>
|
||||
</div>
|
||||
</template>
|
||||
<template slot="enabled" slot-scope="{text}">
|
||||
<template slot="enabled" slot-scope="{ text }">
|
||||
<div>
|
||||
<img v-if="text==1" src="@/assets/images/abnormalAlarm/on.png" alt="">
|
||||
<img v-else src="@/assets/images/abnormalAlarm/off.png" alt="">
|
||||
<img v-if="text == 1" src="@/assets/images/abnormalAlarm/on.png" alt="" />
|
||||
<img v-else src="@/assets/images/abnormalAlarm/off.png" alt="" />
|
||||
</div>
|
||||
</template>
|
||||
<template slot="today" slot-scope="{text}">
|
||||
<span class="alarm-text">{{ text?text:"--" }}</span>
|
||||
<template slot="today" slot-scope="{ text }">
|
||||
<span class="alarm-text">{{ text ? text : '--' }}</span>
|
||||
</template>
|
||||
<template slot="yesterday" slot-scope="{text}">
|
||||
<span class="alarm-text">{{ text?text:"--" }}</span>
|
||||
<template slot="yesterday" slot-scope="{ text }">
|
||||
<span class="alarm-text">{{ text ? text : '--' }}</span>
|
||||
</template>
|
||||
<template slot="weekly" slot-scope="{text}">
|
||||
<span class="alarm-text">{{ text?text:"--" }}</span>
|
||||
<template slot="weekly" slot-scope="{ text }">
|
||||
<span class="alarm-text">{{ text ? text : '--' }}</span>
|
||||
</template>
|
||||
<template slot="alarms" slot-scope="{text,record}">
|
||||
<span :class="[record.alarmRed?'isAlarm':'','alarm-text']">{{ text }}</span>
|
||||
<template slot="alarms" slot-scope="{ text, record }">
|
||||
<span :class="[record.alarmRed ? 'isAlarm' : '', 'alarm-text']">{{ text }}</span>
|
||||
</template>
|
||||
<template slot="stoer" slot-scope="{text,record}">
|
||||
<span :class="[record.cpuRed?'isRed':'','alarm-text']">{{ text?text:"--" }}</span>
|
||||
<template slot="stoer" slot-scope="{ text, record }">
|
||||
<span :class="[record.cpuRed ? 'isRed' : '', 'alarm-text']">{{ text ? text : '--' }}</span>
|
||||
</template>
|
||||
</TableList>
|
||||
</div>
|
||||
<a-pagination
|
||||
<a-pagination
|
||||
size="small"
|
||||
v-model="ipagination.current"
|
||||
v-model="ipagination.current"
|
||||
:pageSize="ipagination.pageSize"
|
||||
:page-size-options="ipagination.pageSizeOptions"
|
||||
show-size-changer
|
||||
show-quick-jumper
|
||||
:total="ipagination.total"
|
||||
:show-total="(total, range) => `Total ${total} items Page ${ipagination.current} / ${Math.ceil(total / ipagination.pageSize)}`"
|
||||
show-less-items
|
||||
:show-total="
|
||||
(total, range) =>
|
||||
`Total ${total} items Page ${ipagination.current} / ${Math.ceil(total / ipagination.pageSize)}`
|
||||
"
|
||||
show-less-items
|
||||
@change="handlePageChange"
|
||||
@showSizeChange="handleSizeChange"
|
||||
/>
|
||||
</div>
|
||||
<a-modal
|
||||
:title="isAdd ? 'Add' : 'Edit'"
|
||||
v-model="visible"
|
||||
@cancel="onCancel"
|
||||
>
|
||||
<a-form :form="form" :label-col="{ span: 6 }" :wrapper-col="{ span: 16 }">
|
||||
<a-form-item label="Name">
|
||||
<a-input
|
||||
v-decorator="[
|
||||
'name',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input name!' }],
|
||||
initialVale: this.formVal.name
|
||||
}
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="Server Address">
|
||||
<a-input
|
||||
v-decorator="[
|
||||
'emailServerAddress',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input email server address!' }],
|
||||
initialVale: this.formVal.emailServerAddress
|
||||
}
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="Email Address">
|
||||
<a-input
|
||||
v-decorator="[
|
||||
'username',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input email address!' }],
|
||||
initialVale: this.formVal.username
|
||||
}
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="Password">
|
||||
<a-input
|
||||
v-decorator="[
|
||||
'password',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input password!' }],
|
||||
initialVale: this.formVal.password
|
||||
}
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="Email Type">
|
||||
<j-dict-select-tag
|
||||
placeholder="Please select an email type"
|
||||
dict-code="email_type"
|
||||
v-decorator="[
|
||||
'emilType',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input your name!' }],
|
||||
initialVale: this.formVal.emilType
|
||||
}
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="Enable or not">
|
||||
<a-select
|
||||
allowClear
|
||||
v-decorator="[
|
||||
'enabled',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please select a Station!' }],
|
||||
initialVale: this.formVal.enabled
|
||||
}
|
||||
]"
|
||||
>
|
||||
<img slot="suffixIcon" src="@/assets/images/global/select-down.png" alt="" />
|
||||
<a-select-option :value="1">
|
||||
Enable
|
||||
</a-select-option>
|
||||
<a-select-option :value="0">
|
||||
Disabled
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
<a-form-item label="Port">
|
||||
<a-input-number
|
||||
v-decorator="[
|
||||
'port',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input port!' }],
|
||||
initialVale: this.formVal.port
|
||||
}
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
<a-modal :title="isAdd ? 'Add' : 'Edit'" v-model="visible" :maskClosable="false" @cancel="onCancel">
|
||||
<a-form :form="form" :label-col="{ span: 6 }" :wrapper-col="{ span: 16 }">
|
||||
<a-form-item label="Name">
|
||||
<a-input
|
||||
v-decorator="[
|
||||
'name',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input name!' }],
|
||||
initialVale: this.formVal.name,
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="Server Address">
|
||||
<a-input
|
||||
v-decorator="[
|
||||
'emailServerAddress',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input email server address!' }],
|
||||
initialVale: this.formVal.emailServerAddress,
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="Email Address">
|
||||
<a-input
|
||||
v-decorator="[
|
||||
'username',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input email address!' }],
|
||||
initialVale: this.formVal.username,
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="Password">
|
||||
<a-input
|
||||
v-decorator="[
|
||||
'password',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input password!' }],
|
||||
initialVale: this.formVal.password,
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="Email Type">
|
||||
<j-dict-select-tag
|
||||
placeholder="Please select an email type"
|
||||
dict-code="email_type"
|
||||
v-decorator="[
|
||||
'emilType',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input your name!' }],
|
||||
initialVale: this.formVal.emilType,
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="Enable or not">
|
||||
<a-select
|
||||
allowClear
|
||||
v-decorator="[
|
||||
'enabled',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please select a Station!' }],
|
||||
initialVale: this.formVal.enabled,
|
||||
},
|
||||
]"
|
||||
>
|
||||
<img slot="suffixIcon" src="@/assets/images/global/select-down.png" alt="" />
|
||||
<a-select-option :value="1"> Enable </a-select-option>
|
||||
<a-select-option :value="0"> Disabled </a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
<a-form-item label="Port">
|
||||
<a-input-number
|
||||
v-decorator="[
|
||||
'port',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input port!' }],
|
||||
initialVale: this.formVal.port,
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
<template slot="footer">
|
||||
<a-space class="operators" :size="20">
|
||||
<a-button type="success" @click="onSave">Save</a-button>
|
||||
<a-button type="warn" @click="onCancel">Cancel</a-button>
|
||||
<a-button type="warn" @click="onCancel">Cancel</a-button>
|
||||
</a-space>
|
||||
</template>
|
||||
</a-modal>
|
||||
|
@ -192,67 +183,75 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import TableList from '../../components/tableList.vue';
|
||||
import { getAction,postAction,httpAction,deleteAction } from '@/api/manage'
|
||||
import TableList from '../../components/tableList.vue'
|
||||
import { getAction, postAction, httpAction, deleteAction } from '@/api/manage'
|
||||
const columns = [
|
||||
{
|
||||
title: 'NAME',
|
||||
align: 'center',
|
||||
dataIndex: 'name'
|
||||
},{
|
||||
dataIndex: 'name',
|
||||
},
|
||||
{
|
||||
title: 'STATUS',
|
||||
align: 'center',
|
||||
dataIndex: 'online',
|
||||
scopedSlots: {
|
||||
customRender: 'status'
|
||||
}
|
||||
},{
|
||||
customRender: 'status',
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'ENABLE',
|
||||
align: 'center',
|
||||
dataIndex: 'enabled',
|
||||
scopedSlots: {
|
||||
customRender: 'enabled'
|
||||
}
|
||||
},{
|
||||
customRender: 'enabled',
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'E-MAIL',
|
||||
align: 'center',
|
||||
dataIndex: 'emailServerAddress'
|
||||
},{
|
||||
dataIndex: 'emailServerAddress',
|
||||
},
|
||||
{
|
||||
title: "TODAY'S TOTAL",
|
||||
align: 'center',
|
||||
dataIndex: 'today',
|
||||
scopedSlots: {
|
||||
customRender: 'today'
|
||||
}
|
||||
},{
|
||||
customRender: 'today',
|
||||
},
|
||||
},
|
||||
{
|
||||
title: "YESTERDAY'S TOTAL",
|
||||
align: 'center',
|
||||
dataIndex: 'yesterday',
|
||||
scopedSlots: {
|
||||
customRender: 'yesterday'
|
||||
}
|
||||
},{
|
||||
title: "WEEKLY TOTAL",
|
||||
customRender: 'yesterday',
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'WEEKLY TOTAL',
|
||||
align: 'center',
|
||||
dataIndex: 'weekly',
|
||||
scopedSlots: {
|
||||
customRender: 'weekly'
|
||||
}
|
||||
},{
|
||||
customRender: 'weekly',
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'ALARMS',
|
||||
align: 'center',
|
||||
dataIndex: 'alarms',
|
||||
scopedSlots: {
|
||||
customRender: 'alarms',
|
||||
}
|
||||
},{
|
||||
title: "STOER CAPACITY",
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'STOER CAPACITY',
|
||||
align: 'center',
|
||||
dataIndex: 'stoerCapacity',
|
||||
scopedSlots: {
|
||||
customRender: 'stoer',
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
]
|
||||
export default {
|
||||
components: {
|
||||
|
@ -265,18 +264,18 @@ export default {
|
|||
visible: false,
|
||||
form: this.$form.createForm(this),
|
||||
formVal: {
|
||||
name: "",
|
||||
emailServerAddress: "",
|
||||
username: "",
|
||||
password: "",
|
||||
emilType: "",
|
||||
enabled: "",
|
||||
port: ""
|
||||
name: '',
|
||||
emailServerAddress: '',
|
||||
username: '',
|
||||
password: '',
|
||||
emilType: '',
|
||||
enabled: '',
|
||||
port: '',
|
||||
},
|
||||
currentId:"",
|
||||
currentId: '',
|
||||
columns,
|
||||
dataSource: [],
|
||||
ipagination:{
|
||||
ipagination: {
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
pageSizeOptions: ['10', '20', '30'],
|
||||
|
@ -286,36 +285,36 @@ export default {
|
|||
},
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
total: 0
|
||||
total: 0,
|
||||
},
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
alarmTotal() {
|
||||
let num= 0
|
||||
this.dataSource.forEach(item => {
|
||||
let num = 0
|
||||
this.dataSource.forEach((item) => {
|
||||
num = item.alarmRed ? num + item.alarms : num
|
||||
});
|
||||
})
|
||||
return num
|
||||
}
|
||||
},
|
||||
},
|
||||
mounted () {
|
||||
this.getSysEmail();
|
||||
mounted() {
|
||||
this.getSysEmail()
|
||||
},
|
||||
methods: {
|
||||
getSysEmail() {
|
||||
this.loading = true
|
||||
let params = {
|
||||
pageNo: this.ipagination.current,
|
||||
pageSize: this.ipagination.pageSize
|
||||
pageSize: this.ipagination.pageSize,
|
||||
}
|
||||
getAction("/sysEmail/findPage", params).then(res => {
|
||||
this.loading=false
|
||||
getAction('/sysEmail/findPage', params).then((res) => {
|
||||
this.loading = false
|
||||
if (res.success) {
|
||||
this.ipagination.total = res.result.total
|
||||
this.dataSource = res.result.records
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
@ -337,7 +336,7 @@ export default {
|
|||
if (this.currentId) {
|
||||
this.isAdd = false
|
||||
this.visible = true
|
||||
getAction("/sysEmail/findInfo", {id:this.currentId}).then(res => {
|
||||
getAction('/sysEmail/findInfo', { id: this.currentId }).then((res) => {
|
||||
if (res.success) {
|
||||
this.form.setFieldsValue({
|
||||
name: res.result.name,
|
||||
|
@ -346,14 +345,14 @@ export default {
|
|||
password: res.result.password,
|
||||
emilType: res.result.emilType,
|
||||
enabled: res.result.enabled,
|
||||
port: res.result.port
|
||||
});
|
||||
port: res.result.port,
|
||||
})
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.$message.info("Please select a piece of data")
|
||||
this.$message.info('Please select a piece of data')
|
||||
}
|
||||
},
|
||||
onDelete() {
|
||||
|
@ -362,40 +361,40 @@ export default {
|
|||
this.$confirm({
|
||||
title: 'Are you sure to delete this item?',
|
||||
onOk() {
|
||||
deleteAction("/sysEmail/deleteById", {id:_this.currentId}).then(res => {
|
||||
deleteAction('/sysEmail/deleteById', { id: _this.currentId }).then((res) => {
|
||||
if (res.success) {
|
||||
_this.$message.success("success")
|
||||
this.currentId=""
|
||||
_this.$message.success('success')
|
||||
this.currentId = ''
|
||||
_this.getSysEmail()
|
||||
} else {
|
||||
_this.$message.warning("This operation fails. Contact your system administrator")
|
||||
_this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
onCancel() {
|
||||
console.log('Cancel');
|
||||
console.log('Cancel')
|
||||
},
|
||||
});
|
||||
})
|
||||
} else {
|
||||
this.$message.info("Please select a piece of data")
|
||||
this.$message.info('Please select a piece of data')
|
||||
}
|
||||
},
|
||||
selectRow(record) {
|
||||
this.currentId = record.id
|
||||
},
|
||||
cancelRow() {
|
||||
this.currentId = ""
|
||||
this.currentId = ''
|
||||
},
|
||||
onSave() {
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
console.log('Received values of form: ', values);
|
||||
console.log('Received values of form: ', values)
|
||||
if (this.isAdd) {
|
||||
postAction("/sysEmail/create", values).then(res => {
|
||||
postAction('/sysEmail/create', values).then((res) => {
|
||||
if (res.success) {
|
||||
this.form.resetFields()
|
||||
this.visible = false
|
||||
this.$message.success("success")
|
||||
this.$message.success('success')
|
||||
this.getSysEmail()
|
||||
} else {
|
||||
this.$message.info(res.result.message)
|
||||
|
@ -404,13 +403,13 @@ export default {
|
|||
} else {
|
||||
let params = {
|
||||
id: this.currentId,
|
||||
...values
|
||||
...values,
|
||||
}
|
||||
httpAction("/sysEmail/update", params, "put").then(res => {
|
||||
httpAction('/sysEmail/update', params, 'put').then((res) => {
|
||||
if (res.success) {
|
||||
this.form.resetFields()
|
||||
this.visible = false
|
||||
this.$message.success("success")
|
||||
this.$message.success('success')
|
||||
this.getSysEmail()
|
||||
} else {
|
||||
this.$message.info(res.result.message)
|
||||
|
@ -418,7 +417,7 @@ export default {
|
|||
})
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
onCancel() {
|
||||
this.form.resetFields()
|
||||
|
@ -426,19 +425,19 @@ export default {
|
|||
},
|
||||
onRowDbclick(record) {
|
||||
let query = {
|
||||
emailId:record.id
|
||||
emailId: record.id,
|
||||
}
|
||||
this.$router.push({
|
||||
path: '/alarm/emailMonitor/instances',
|
||||
query
|
||||
query,
|
||||
})
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.view-header{
|
||||
.view-header {
|
||||
height: 50px;
|
||||
border-top: 1px solid rgba(13, 235, 201, 0.3);
|
||||
border-bottom: 1px solid rgba(13, 235, 201, 0.3);
|
||||
|
@ -454,58 +453,58 @@ export default {
|
|||
color: #ade6ee;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
span{
|
||||
span {
|
||||
font-family: MicrogrammaD-MediExte;
|
||||
font-size: 30px;
|
||||
color: #d31f1f;
|
||||
}
|
||||
}
|
||||
}
|
||||
.view-btn{
|
||||
.view-btn {
|
||||
background-color: #1397a3;
|
||||
font-family: ArialMT;
|
||||
color: #ffffff;
|
||||
color: #ffffff;
|
||||
border: none;
|
||||
margin-left: 20px;
|
||||
box-shadow: 0px 1px 1px 0px #000000;;
|
||||
box-shadow: 0px 1px 1px 0px #000000;
|
||||
}
|
||||
}
|
||||
.view-main{
|
||||
.view-main {
|
||||
height: calc(100% - 50px);
|
||||
margin-left: 20px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
padding-top: 15px;
|
||||
&-table{
|
||||
&-table {
|
||||
height: calc(100% - 30px);
|
||||
overflow: auto;
|
||||
}
|
||||
.ant-pagination{
|
||||
.ant-pagination {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: 0;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
.status-on{
|
||||
.status-on {
|
||||
margin-left: 10px;
|
||||
font-family: MicrosoftYaHei;
|
||||
color: #4bc048;
|
||||
}
|
||||
.status-off{
|
||||
.status-off {
|
||||
font-family: MicrosoftYaHei;
|
||||
color: #868686;
|
||||
}
|
||||
.alarm-text{
|
||||
.alarm-text {
|
||||
font-family: MicrogrammaD-MediExte;
|
||||
font-size: 22px;
|
||||
color: #ade6ee;
|
||||
}
|
||||
.isAlarm{
|
||||
.isAlarm {
|
||||
color: #ed2d2d;
|
||||
}
|
||||
.isRed{
|
||||
.isRed {
|
||||
color: #f02c2c;
|
||||
}
|
||||
/deep/.ant-table-tbody tr{
|
||||
/deep/.ant-table-tbody tr {
|
||||
height: 88px;
|
||||
}
|
||||
}
|
||||
|
@ -516,11 +515,11 @@ export default {
|
|||
width: 92px;
|
||||
}
|
||||
}
|
||||
/deep/.ant-modal-title{
|
||||
/deep/.ant-modal-title {
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
.ant-input-number{
|
||||
.ant-input-number {
|
||||
width: 100%;
|
||||
background-color: #03353f !important
|
||||
background-color: #03353f !important;
|
||||
}
|
||||
</style>
|
|
@ -152,7 +152,7 @@
|
|||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
<a-modal :title="modalTitle" :width="1200" v-model="visible" @cancel="onCancel">
|
||||
<a-modal :title="modalTitle" :width="1200" v-model="visible" :maskClosable="false" @cancel="onCancel">
|
||||
<div class="modal-content" id="common_cpu"></div>
|
||||
</a-modal>
|
||||
<CreateRules
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div>
|
||||
<a-modal title="Add Rule" :width="845" v-model="visible" @cancel="onCancel">
|
||||
<a-modal title="Add Rule" :width="845" v-model="visible" :maskClosable="false" @cancel="onCancel">
|
||||
<a-form-model ref="al_ruleForm" :model="form" :rules="rules" layout="vertical">
|
||||
<a-row :gutter="[15, 0]">
|
||||
<a-col :span="12">
|
||||
|
|
|
@ -156,7 +156,7 @@
|
|||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
<a-modal :title="modalTitle" :width="1200" v-model="visible" @cancel="onCancel">
|
||||
<a-modal :title="modalTitle" :width="1200" v-model="visible" :maskClosable="false" @cancel="onCancel">
|
||||
<div class="modal-content" id="common"></div>
|
||||
</a-modal>
|
||||
<CreateRules
|
||||
|
|
|
@ -1,31 +1,25 @@
|
|||
<template>
|
||||
<div style="height: 100%;">
|
||||
<div style="height: 100%">
|
||||
<div class="view-header">
|
||||
<div class="view-num">Alarms:<span>{{ alarmTotal }}</span></div>
|
||||
<div class="view-num">
|
||||
Alarms:<span>{{ alarmTotal }}</span>
|
||||
</div>
|
||||
<div>
|
||||
<a-button class="view-btn" @click="onAdd">
|
||||
<img class="icon-add" src="@/assets/images/global/add.png" alt="" />
|
||||
<span style="margin-left: 10px;">
|
||||
Add
|
||||
</span>
|
||||
<span style="margin-left: 10px"> Add </span>
|
||||
</a-button>
|
||||
<a-button class="view-btn" @click="onEdit">
|
||||
<img class="icon-add" src="@/assets/images/global/edit.png" alt="" />
|
||||
<span style="margin-left: 10px;">
|
||||
Edit
|
||||
</span>
|
||||
<span style="margin-left: 10px"> Edit </span>
|
||||
</a-button>
|
||||
<a-button class="view-btn" @click="onDelete">
|
||||
<img class="icon-add" src="@/assets/images/global/delete.png" alt="" />
|
||||
<span style="margin-left: 10px;">
|
||||
Delete
|
||||
</span>
|
||||
<span style="margin-left: 10px"> Delete </span>
|
||||
</a-button>
|
||||
<a-button class="view-btn" @click="getSysServer">
|
||||
<img class="icon-add" src="@/assets/images/global/reset-pwd.png" alt="" />
|
||||
<span style="margin-left: 10px;">
|
||||
Refresh
|
||||
</span>
|
||||
<span style="margin-left: 10px"> Refresh </span>
|
||||
</a-button>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -42,74 +36,73 @@
|
|||
@cancleRowClick="cancelRow"
|
||||
@rowDbclick="onRowDbclick"
|
||||
>
|
||||
<template slot="status" slot-scope="{text,record}">
|
||||
<template slot="status" slot-scope="{ text, record }">
|
||||
<div>
|
||||
<img v-if="record.online" src="@/assets/images/abnormalAlarm/on.png" alt="">
|
||||
<img v-else src="@/assets/images/abnormalAlarm/off.png" alt="">
|
||||
<span :class="[record.online?'status-on':'status-off']">{{ text }}</span>
|
||||
<img v-if="record.online" src="@/assets/images/abnormalAlarm/on.png" alt="" />
|
||||
<img v-else src="@/assets/images/abnormalAlarm/off.png" alt="" />
|
||||
<span :class="[record.online ? 'status-on' : 'status-off']">{{ text }}</span>
|
||||
</div>
|
||||
</template>
|
||||
<template slot="alarms" slot-scope="{text,record}">
|
||||
<span :class="[record.alarmRed?'isAlarm':'','alarm-text']">{{ text }}</span>
|
||||
<template slot="alarms" slot-scope="{ text, record }">
|
||||
<span :class="[record.alarmRed ? 'isAlarm' : '', 'alarm-text']">{{ text }}</span>
|
||||
</template>
|
||||
<template slot="cpu" slot-scope="{text,record}">
|
||||
<span :class="[record.cpuRed?'isRed':'','alarm-text']">{{ text?text:"--" }}</span>
|
||||
<template slot="cpu" slot-scope="{ text, record }">
|
||||
<span :class="[record.cpuRed ? 'isRed' : '', 'alarm-text']">{{ text ? text : '--' }}</span>
|
||||
</template>
|
||||
<template slot="memory" slot-scope="{text,record}">
|
||||
<span :class="[record.memoryRed?'isRed':'','alarm-text']">{{ text?text:"--" }}</span>
|
||||
<template slot="memory" slot-scope="{ text, record }">
|
||||
<span :class="[record.memoryRed ? 'isRed' : '', 'alarm-text']">{{ text ? text : '--' }}</span>
|
||||
</template>
|
||||
<template slot="disk" slot-scope="{text,record}">
|
||||
<span :class="[record.diskRed?'isRed':'','alarm-text']">{{ text?text:"--" }}</span>
|
||||
<template slot="disk" slot-scope="{ text, record }">
|
||||
<span :class="[record.diskRed ? 'isRed' : '', 'alarm-text']">{{ text ? text : '--' }}</span>
|
||||
</template>
|
||||
</TableList>
|
||||
</div>
|
||||
<a-pagination
|
||||
<a-pagination
|
||||
size="small"
|
||||
v-model="ipagination.current"
|
||||
v-model="ipagination.current"
|
||||
:pageSize="ipagination.pageSize"
|
||||
:page-size-options="ipagination.pageSizeOptions"
|
||||
show-size-changer
|
||||
show-quick-jumper
|
||||
:total="ipagination.total"
|
||||
:show-total="(total, range) => `Total ${total} items Page ${ipagination.current} / ${Math.ceil(total / ipagination.pageSize)}`"
|
||||
show-less-items
|
||||
:show-total="
|
||||
(total, range) =>
|
||||
`Total ${total} items Page ${ipagination.current} / ${Math.ceil(total / ipagination.pageSize)}`
|
||||
"
|
||||
show-less-items
|
||||
@change="handlePageChange"
|
||||
@showSizeChange="handleSizeChange"
|
||||
/>
|
||||
</div>
|
||||
<a-modal
|
||||
:title="isAdd ? 'Add' : 'Edit'"
|
||||
v-model="visible"
|
||||
@cancel="onCancel"
|
||||
>
|
||||
<a-form :form="form" :label-col="{ span: 5 }" :wrapper-col="{ span: 17 }">
|
||||
<a-form-item label="Name">
|
||||
<a-input
|
||||
v-decorator="[
|
||||
'name',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input name!' }],
|
||||
initialVale: this.formVal.name
|
||||
}
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="Ip Address">
|
||||
<a-input
|
||||
v-decorator="[
|
||||
'ipAddress',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input ip address!' }],
|
||||
initialVale: this.formVal.ipAddress
|
||||
}
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
<a-modal :title="isAdd ? 'Add' : 'Edit'" v-model="visible" :maskClosable="false" @cancel="onCancel">
|
||||
<a-form :form="form" :label-col="{ span: 5 }" :wrapper-col="{ span: 17 }">
|
||||
<a-form-item label="Name">
|
||||
<a-input
|
||||
v-decorator="[
|
||||
'name',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input name!' }],
|
||||
initialVale: this.formVal.name,
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="Ip Address">
|
||||
<a-input
|
||||
v-decorator="[
|
||||
'ipAddress',
|
||||
{
|
||||
rules: [{ required: true, message: 'Please input ip address!' }],
|
||||
initialVale: this.formVal.ipAddress,
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
<template slot="footer">
|
||||
<a-space class="operators" :size="20">
|
||||
<a-button type="success" @click="onSave">Save</a-button>
|
||||
<a-button type="warn" @click="onCancel">Cancel</a-button>
|
||||
<a-button type="warn" @click="onCancel">Cancel</a-button>
|
||||
</a-space>
|
||||
</template>
|
||||
</a-modal>
|
||||
|
@ -118,51 +111,57 @@
|
|||
|
||||
<script>
|
||||
import TableList from '../../components/tableList.vue'
|
||||
import { getAction,postAction,httpAction,deleteAction } from '@/api/manage'
|
||||
import { getAction, postAction, httpAction, deleteAction } from '@/api/manage'
|
||||
const columns = [
|
||||
{
|
||||
title: 'NAME',
|
||||
align: 'center',
|
||||
dataIndex: 'name'
|
||||
},{
|
||||
dataIndex: 'name',
|
||||
},
|
||||
{
|
||||
title: 'STATUS',
|
||||
align: 'center',
|
||||
dataIndex: 'serverInfo',
|
||||
scopedSlots: {
|
||||
customRender: 'status'
|
||||
}
|
||||
},{
|
||||
customRender: 'status',
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'IP ADDRESS',
|
||||
align: 'center',
|
||||
dataIndex: 'ipAddress'
|
||||
},{
|
||||
dataIndex: 'ipAddress',
|
||||
},
|
||||
{
|
||||
title: 'ALARMS',
|
||||
align: 'center',
|
||||
dataIndex: 'alarms',
|
||||
scopedSlots: {
|
||||
customRender: 'alarms',
|
||||
}
|
||||
},{
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'CPU UTILIZATION',
|
||||
align: 'center',
|
||||
dataIndex: 'cpuUutilzation',
|
||||
scopedSlots: {
|
||||
customRender: 'cpu',
|
||||
}
|
||||
},{
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'MEMORY USAGE',
|
||||
align: 'center',
|
||||
dataIndex: 'memoryUsage',
|
||||
scopedSlots: {
|
||||
customRender: 'memory',
|
||||
}
|
||||
},{
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'DISK USAGE',
|
||||
align: 'center',
|
||||
dataIndex: 'diskUsage',
|
||||
scopedSlots: {
|
||||
customRender: 'disk',
|
||||
}
|
||||
},
|
||||
},
|
||||
]
|
||||
export default {
|
||||
|
@ -171,18 +170,18 @@ export default {
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
loading:false,
|
||||
loading: false,
|
||||
isAdd: true,
|
||||
visible: false,
|
||||
form: this.$form.createForm(this),
|
||||
formVal: {
|
||||
name: "",
|
||||
ipAddress:""
|
||||
name: '',
|
||||
ipAddress: '',
|
||||
},
|
||||
currentId:"",
|
||||
currentId: '',
|
||||
columns,
|
||||
dataSource: [],
|
||||
ipagination:{
|
||||
ipagination: {
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
pageSizeOptions: ['10', '20', '30'],
|
||||
|
@ -192,36 +191,36 @@ export default {
|
|||
},
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
total: 0
|
||||
total: 0,
|
||||
},
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
alarmTotal() {
|
||||
let num= 0
|
||||
this.dataSource.forEach(item => {
|
||||
let num = 0
|
||||
this.dataSource.forEach((item) => {
|
||||
num = item.alarmRed ? num + item.alarms : num
|
||||
});
|
||||
})
|
||||
return num
|
||||
}
|
||||
},
|
||||
},
|
||||
mounted () {
|
||||
this.getSysServer();
|
||||
mounted() {
|
||||
this.getSysServer()
|
||||
},
|
||||
methods: {
|
||||
getSysServer() {
|
||||
this.loading = true
|
||||
let params = {
|
||||
pageNo: this.ipagination.current,
|
||||
pageSize: this.ipagination.pageSize
|
||||
pageSize: this.ipagination.pageSize,
|
||||
}
|
||||
getAction("/sysServer/findPage", params).then(res => {
|
||||
getAction('/sysServer/findPage', params).then((res) => {
|
||||
this.loading = false
|
||||
if (res.success) {
|
||||
this.ipagination.total = res.result.total
|
||||
this.dataSource = res.result.records
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
@ -243,18 +242,18 @@ export default {
|
|||
if (this.currentId) {
|
||||
this.isAdd = false
|
||||
this.visible = true
|
||||
getAction("/sysServer/findInfo", {id:this.currentId}).then(res => {
|
||||
getAction('/sysServer/findInfo', { id: this.currentId }).then((res) => {
|
||||
if (res.success) {
|
||||
this.form.setFieldsValue({
|
||||
name: res.result.name,
|
||||
ipAddress: res.result.ipAddress
|
||||
});
|
||||
ipAddress: res.result.ipAddress,
|
||||
})
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.$message.info("Please select a piece of data")
|
||||
this.$message.info('Please select a piece of data')
|
||||
}
|
||||
},
|
||||
onDelete() {
|
||||
|
@ -263,39 +262,39 @@ export default {
|
|||
this.$confirm({
|
||||
title: 'Are you sure to delete this item?',
|
||||
onOk() {
|
||||
deleteAction("/sysServer/deleteById", {id:_this.currentId}).then(res => {
|
||||
deleteAction('/sysServer/deleteById', { id: _this.currentId }).then((res) => {
|
||||
if (res.success) {
|
||||
_this.$message.success("success")
|
||||
_this.currentId = ""
|
||||
_this.$message.success('success')
|
||||
_this.currentId = ''
|
||||
_this.getSysServer()
|
||||
} else {
|
||||
_this.$message.warning("This operation fails. Contact your system administrator")
|
||||
_this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
onCancel() {
|
||||
console.log('Cancel');
|
||||
console.log('Cancel')
|
||||
},
|
||||
});
|
||||
})
|
||||
} else {
|
||||
this.$message.info("Please select a piece of data")
|
||||
this.$message.info('Please select a piece of data')
|
||||
}
|
||||
},
|
||||
selectRow(record) {
|
||||
this.currentId = record.id
|
||||
},
|
||||
cancelRow() {
|
||||
this.currentId = ""
|
||||
this.currentId = ''
|
||||
},
|
||||
onSave() {
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
if (this.isAdd) {
|
||||
postAction("/sysServer/create", values).then(res => {
|
||||
postAction('/sysServer/create', values).then((res) => {
|
||||
if (res.success) {
|
||||
this.form.resetFields()
|
||||
this.visible = false
|
||||
this.$message.success("success")
|
||||
this.$message.success('success')
|
||||
this.getSysServer()
|
||||
} else {
|
||||
this.$message.info(res.result.message)
|
||||
|
@ -304,13 +303,13 @@ export default {
|
|||
} else {
|
||||
let params = {
|
||||
id: this.currentId,
|
||||
...values
|
||||
...values,
|
||||
}
|
||||
httpAction("/sysServer/update", params, "put").then(res => {
|
||||
httpAction('/sysServer/update', params, 'put').then((res) => {
|
||||
if (res.success) {
|
||||
this.form.resetFields()
|
||||
this.visible = false
|
||||
this.$message.success("success")
|
||||
this.$message.success('success')
|
||||
this.getSysServer()
|
||||
} else {
|
||||
this.$message.info(res.result.message)
|
||||
|
@ -318,7 +317,7 @@ export default {
|
|||
})
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
onCancel() {
|
||||
this.form.resetFields()
|
||||
|
@ -326,19 +325,19 @@ export default {
|
|||
},
|
||||
onRowDbclick(record) {
|
||||
let query = {
|
||||
serverId:record.id
|
||||
serverId: record.id,
|
||||
}
|
||||
this.$router.push({
|
||||
path: '/alarm/serverMonitor/instances',
|
||||
query
|
||||
query,
|
||||
})
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.view-header{
|
||||
.view-header {
|
||||
height: 50px;
|
||||
border-top: 1px solid rgba(13, 235, 201, 0.3);
|
||||
border-bottom: 1px solid rgba(13, 235, 201, 0.3);
|
||||
|
@ -354,58 +353,58 @@ export default {
|
|||
color: #ade6ee;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
span{
|
||||
span {
|
||||
font-family: MicrogrammaD-MediExte;
|
||||
font-size: 30px;
|
||||
color: #d31f1f;
|
||||
}
|
||||
}
|
||||
}
|
||||
.view-btn{
|
||||
.view-btn {
|
||||
background-color: #1397a3;
|
||||
font-family: ArialMT;
|
||||
color: #ffffff;
|
||||
color: #ffffff;
|
||||
border: none;
|
||||
margin-left: 20px;
|
||||
box-shadow: 0px 1px 1px 0px #000000;;
|
||||
box-shadow: 0px 1px 1px 0px #000000;
|
||||
}
|
||||
}
|
||||
.view-main{
|
||||
.view-main {
|
||||
height: calc(100% - 50px);
|
||||
margin-left: 20px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
padding-top: 15px;
|
||||
&-table{
|
||||
&-table {
|
||||
height: calc(100% - 30px);
|
||||
overflow: auto;
|
||||
}
|
||||
.ant-pagination{
|
||||
.ant-pagination {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: 0;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
.status-on{
|
||||
.status-on {
|
||||
margin-left: 10px;
|
||||
font-family: MicrosoftYaHei;
|
||||
color: #4bc048;
|
||||
}
|
||||
.status-off{
|
||||
.status-off {
|
||||
font-family: MicrosoftYaHei;
|
||||
color: #868686;
|
||||
}
|
||||
.alarm-text{
|
||||
.alarm-text {
|
||||
font-family: MicrogrammaD-MediExte;
|
||||
font-size: 22px;
|
||||
color: #ade6ee;
|
||||
}
|
||||
.isAlarm{
|
||||
.isAlarm {
|
||||
color: #ed2d2d;
|
||||
}
|
||||
.isRed{
|
||||
.isRed {
|
||||
color: #f02c2c;
|
||||
}
|
||||
/deep/.ant-table-tbody tr{
|
||||
/deep/.ant-table-tbody tr {
|
||||
height: 88px;
|
||||
}
|
||||
}
|
||||
|
@ -416,7 +415,7 @@ export default {
|
|||
width: 92px;
|
||||
}
|
||||
}
|
||||
/deep/.ant-modal-title{
|
||||
/deep/.ant-modal-title {
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
</style>
|
|
@ -138,7 +138,7 @@
|
|||
</template>
|
||||
<!-- 底部按钮结束 -->
|
||||
</custom-modal>
|
||||
<a-modal v-model="visible_file" :width="1200" title="File List" @cancel="cancelFileModale">
|
||||
<a-modal v-model="visible_file" :width="1200" title="File List" :maskClosable="false" @cancel="cancelFileModale">
|
||||
<a-spin :spinning="loading_file">
|
||||
<div style="position: relative; padding-bottom: 40px; height: 460px; overflow: hidden">
|
||||
<a-row type="flex" style="margin-bottom: 15px">
|
||||
|
@ -445,7 +445,9 @@ export default {
|
|||
})
|
||||
|
||||
if (findFile) {
|
||||
const regExp = new RegExp(`(${otherFilePrefix}${fileType}_${qualify}_\\d{1,}\\.{0,}\\d{0,}).*?(\\.PHD)`)
|
||||
const regExp = new RegExp(
|
||||
`(${otherFilePrefix}${fileType}_${qualify}_\\d{1,}\\.{0,}\\d{0,}).*?(\\.PHD)`
|
||||
)
|
||||
record[nameKeys[index]] = {
|
||||
file: findFile,
|
||||
fileName: findFile.name.replace(regExp, '$1$2'),
|
||||
|
|
|
@ -1,18 +1,18 @@
|
|||
<template>
|
||||
<div style="height: 100%;">
|
||||
<div style="height: 100%">
|
||||
<List :stationList="stationList" :columns="columns" :dataType="dataType" fileName="DETBKPHD" pageType="ACQ"></List>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import List from "../../../list.vue"
|
||||
import List from '../../../list.vue'
|
||||
import { getAction } from '../../../../../api/manage'
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: 'NO',
|
||||
align: 'left',
|
||||
width:80,
|
||||
width: 80,
|
||||
scopedSlots: {
|
||||
customRender: 'index',
|
||||
},
|
||||
|
@ -68,24 +68,23 @@ export default {
|
|||
},
|
||||
stationList: [],
|
||||
columns,
|
||||
dataType:"D"
|
||||
dataType: 'D',
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
console.log(this.dataType);
|
||||
this.findStationList();
|
||||
this.findStationList()
|
||||
},
|
||||
methods: {
|
||||
findStationList() {
|
||||
getAction(this.url.findStationList, { menuName: 'Particulate' }).then((res) => {
|
||||
if (res.success) {
|
||||
if (res.result.length>0) {
|
||||
if (res.result.length > 0) {
|
||||
this.stationList = res.result.map((res) => ({ label: res.stationCode, value: res.stationId }))
|
||||
} else {
|
||||
this.stationList=[]
|
||||
this.stationList = []
|
||||
}
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
@ -94,5 +93,4 @@ export default {
|
|||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
|
||||
</style>
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div style="height: 100%;">
|
||||
<div style="height: 100%">
|
||||
<a-spin :spinning="spinning">
|
||||
<a-card v-if="!isDetail" :bordered="false" style="margin-left: 20px">
|
||||
<search-form :items="formItems" v-model="queryParam" @search="searchQueryData">
|
||||
|
@ -32,54 +32,67 @@
|
|||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import { getAction,getFileAction } from '../../api/manage'
|
||||
import { getAction, getFileAction } from '../../api/manage'
|
||||
import dateFormat from '../../components/jeecg/JEasyCron/format-date'
|
||||
import Detail from "./detail.vue"
|
||||
import Detail from './detail.vue'
|
||||
export default {
|
||||
name: 'menuTree',
|
||||
props: {
|
||||
stationList: {
|
||||
type: Array,
|
||||
default: ()=>[]
|
||||
default: () => [],
|
||||
},
|
||||
columns: {
|
||||
type: Array,
|
||||
default: ()=>[]
|
||||
default: () => [],
|
||||
},
|
||||
dataType: {
|
||||
type: String,
|
||||
default:""
|
||||
default: '',
|
||||
},
|
||||
fileName: {
|
||||
type: String,
|
||||
default:""
|
||||
default: '',
|
||||
},
|
||||
spectralQualifie: {
|
||||
type: String,
|
||||
default:""
|
||||
default: '',
|
||||
},
|
||||
pageType: {
|
||||
type: String,
|
||||
default:""
|
||||
}
|
||||
default: '',
|
||||
},
|
||||
},
|
||||
mixins: [JeecgListMixin],
|
||||
components: {
|
||||
Detail,
|
||||
},
|
||||
watch: {
|
||||
fileName: {
|
||||
handler: function (val) {
|
||||
if (val === 'QCPHD' || val === 'SPHDF' || val === 'SPHDP') {
|
||||
console.log(56, this)
|
||||
console.log(this.getBeforeDate(6))
|
||||
this.$nextTick(() => {
|
||||
this.queryParam.startTime = this.getBeforeDate(6)
|
||||
})
|
||||
}
|
||||
},
|
||||
immediate: true,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
spinning: false,
|
||||
isImmediate:true,
|
||||
isDetail:false,
|
||||
isImmediate: true,
|
||||
isDetail: false,
|
||||
queryParam: {
|
||||
dataType: this.dataType,
|
||||
startTime: dateFormat(new Date(), 'yyyy-MM-dd'),
|
||||
endTime: dateFormat(new Date(), 'yyyy-MM-dd'),
|
||||
stationIds: [],
|
||||
spectralQualifie:this.spectralQualifie
|
||||
spectralQualifie: this.spectralQualifie,
|
||||
},
|
||||
url: {
|
||||
list: '/webStatistics/findParticulatePage',
|
||||
|
@ -90,21 +103,21 @@ export default {
|
|||
dataSource: [],
|
||||
detailJson: {},
|
||||
allChecked: false,
|
||||
currSampleId:""
|
||||
currSampleId: '',
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleExcel() {
|
||||
if (this.dataSource.length>0) {
|
||||
if (this.dataSource.length > 0) {
|
||||
let params = {
|
||||
...this.queryParam,
|
||||
pageType:this.pageType
|
||||
pageType: this.pageType,
|
||||
}
|
||||
getFileAction("/webStatistics/radionuclideExport", params).then(res => {
|
||||
getFileAction('/webStatistics/radionuclideExport', params).then((res) => {
|
||||
if (res.code && res.code == 500) {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
} else {
|
||||
const blob = new Blob([res], { type: "application/vnd.ms-excel" })
|
||||
const blob = new Blob([res], { type: 'application/vnd.ms-excel' })
|
||||
let link = document.createElement('a')
|
||||
link.href = window.URL.createObjectURL(blob)
|
||||
link.download = this.fileName
|
||||
|
@ -115,7 +128,7 @@ export default {
|
|||
}
|
||||
})
|
||||
} else {
|
||||
this.$message.warning("No downloadable data")
|
||||
this.$message.warning('No downloadable data')
|
||||
}
|
||||
},
|
||||
searchQueryData() {
|
||||
|
@ -124,7 +137,7 @@ export default {
|
|||
let params = {
|
||||
...this.queryParam,
|
||||
pageNo: 1,
|
||||
pageSize: 10
|
||||
pageSize: 10,
|
||||
}
|
||||
getAction(this.url.list, params).then((res) => {
|
||||
this.loading = false
|
||||
|
@ -134,25 +147,27 @@ export default {
|
|||
this.ipagination.total = res.result.total
|
||||
this.dataSource = res.result.records
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
handleDetail(record) {
|
||||
this.spinning = true
|
||||
this.currSampleId = record.sampleId
|
||||
getAction("webStatistics/findGeneratedReport", { sampleId: record.sampleId }).then(res => {
|
||||
this.spinning = false
|
||||
if (res.success){
|
||||
this.detailJson = res.result
|
||||
this.detailJson = JSON.parse(JSON.stringify(this.detailJson))
|
||||
this.isDetail = true
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
}
|
||||
}).catch(err => {
|
||||
this.spinning = false
|
||||
})
|
||||
getAction('webStatistics/findGeneratedReport', { sampleId: record.sampleId })
|
||||
.then((res) => {
|
||||
this.spinning = false
|
||||
if (res.success) {
|
||||
this.detailJson = res.result
|
||||
this.detailJson = JSON.parse(JSON.stringify(this.detailJson))
|
||||
this.isDetail = true
|
||||
} else {
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
this.spinning = false
|
||||
})
|
||||
},
|
||||
handleBack(flag) {
|
||||
this.isDetail = flag
|
||||
|
@ -168,15 +183,35 @@ export default {
|
|||
handleSelectChangeAll(val) {
|
||||
this.allChecked = val
|
||||
if (val) {
|
||||
this.queryParam.stationIds = this.stationList.map(item => item.value)
|
||||
this.queryParam.stationIds = this.stationList.map((item) => item.value)
|
||||
} else {
|
||||
this.queryParam.stationIds =[]
|
||||
this.queryParam.stationIds = []
|
||||
}
|
||||
},
|
||||
filterOption(input, option) {
|
||||
return (
|
||||
option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||
);
|
||||
return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||||
},
|
||||
// 获取n天前的日期
|
||||
getBeforeDate(n) {
|
||||
var n = n
|
||||
var d = new Date()
|
||||
var year = d.getFullYear()
|
||||
var mon = d.getMonth() + 1
|
||||
var day = d.getDate()
|
||||
if (day <= n) {
|
||||
if (mon > 1) {
|
||||
mon = mon - 1
|
||||
} else {
|
||||
year = year - 1
|
||||
mon = 12
|
||||
}
|
||||
}
|
||||
d.setDate(d.getDate() - n)
|
||||
year = d.getFullYear()
|
||||
mon = d.getMonth() + 1
|
||||
day = d.getDate()
|
||||
var s = year + '-' + (mon < 10 ? '0' + mon : mon) + '-' + (day < 10 ? '0' + day : day)
|
||||
return s
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
|
@ -202,20 +237,18 @@ export default {
|
|||
name: 'stationIds',
|
||||
props: {
|
||||
allChecked: this.allChecked,
|
||||
filterOption:this.filterOption,
|
||||
filterOption: this.filterOption,
|
||||
placeholder: 'select stations',
|
||||
mode: 'multiple',
|
||||
maxTagCount: 1,
|
||||
options: [
|
||||
...this.stationList,
|
||||
],
|
||||
options: [...this.stationList],
|
||||
style: {
|
||||
width: '200px',
|
||||
},
|
||||
},
|
||||
on: {
|
||||
change: this.handleSelectChange,
|
||||
changeAll: this.handleSelectChangeAll
|
||||
changeAll: this.handleSelectChangeAll,
|
||||
},
|
||||
style: {
|
||||
width: 'auto',
|
||||
|
@ -259,7 +292,7 @@ export default {
|
|||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.icon-edit{
|
||||
.icon-edit {
|
||||
margin-right: 10px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -1,10 +1,10 @@
|
|||
<template>
|
||||
<div style="height: 100%;">
|
||||
<div style="height: 100%">
|
||||
<div class="header">
|
||||
<a-button type="primary" @click="handleAdd">
|
||||
<img src="@/assets/images/global/add.png" alt="" />
|
||||
Edit
|
||||
</a-button>
|
||||
<img src="@/assets/images/global/add.png" alt="" />
|
||||
Edit
|
||||
</a-button>
|
||||
</div>
|
||||
<!-- 列表 -->
|
||||
<div>
|
||||
|
@ -29,20 +29,14 @@
|
|||
</custom-table>
|
||||
</div>
|
||||
<!-- 列表结束 -->
|
||||
<a-modal
|
||||
title='Edit'
|
||||
:width="845"
|
||||
v-model="visible"
|
||||
@ok="handleOk"
|
||||
destroy-on-close
|
||||
>
|
||||
<a-modal title="Edit" :width="845" v-model="visible" :maskClosable="false" @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"
|
||||
:render="(item) => item.title"
|
||||
:operations="['Assign', 'Remove']"
|
||||
:titles="['Total Nuclides', 'User Nuclides']"
|
||||
@change="handleChange"
|
||||
|
@ -54,7 +48,7 @@
|
|||
<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="success" @click="handleOk">Save</a-button>
|
||||
<a-button type="warn" @click="onCancel">Cancel</a-button>
|
||||
</a-space>
|
||||
</template>
|
||||
|
@ -70,32 +64,32 @@ const columns = [
|
|||
align: 'left',
|
||||
width: 170,
|
||||
scopedSlots: {
|
||||
customRender: 'index'
|
||||
customRender: 'index',
|
||||
},
|
||||
customHeaderCell: () => {
|
||||
return {
|
||||
style: {
|
||||
'padding-left': '60px !important'
|
||||
}
|
||||
'padding-left': '60px !important',
|
||||
},
|
||||
}
|
||||
},
|
||||
customCell: () => {
|
||||
return {
|
||||
style: {
|
||||
'padding-left': '60px !important'
|
||||
}
|
||||
'padding-left': '60px !important',
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'NUCLIDE NAME',
|
||||
align: 'left',
|
||||
dataIndex: 'nuclideName'
|
||||
dataIndex: 'nuclideName',
|
||||
},
|
||||
{
|
||||
title: 'CREATE TIME',
|
||||
align: 'left',
|
||||
dataIndex: 'createTime'
|
||||
dataIndex: 'createTime',
|
||||
},
|
||||
]
|
||||
export default {
|
||||
|
@ -106,7 +100,7 @@ export default {
|
|||
url: {
|
||||
list: '/sys/defaultNuclide/findPage',
|
||||
},
|
||||
ipagination:{
|
||||
ipagination: {
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
pageSizeOptions: ['10', '20', '30'],
|
||||
|
@ -116,17 +110,17 @@ export default {
|
|||
},
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
total: 0
|
||||
total: 0,
|
||||
},
|
||||
loading: false,
|
||||
targetKeys: [],
|
||||
visible: false,
|
||||
dataList: [],
|
||||
spinning: false
|
||||
spinning: false,
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.getRulesList();
|
||||
mounted() {
|
||||
this.getRulesList()
|
||||
},
|
||||
methods: {
|
||||
getRulesList() {
|
||||
|
@ -134,23 +128,22 @@ export default {
|
|||
let params = {
|
||||
pageNo: this.ipagination.current,
|
||||
pageSize: this.ipagination.pageSize,
|
||||
useType: 2
|
||||
useType: 2,
|
||||
}
|
||||
getAction(this.url.list, params).then(res => {
|
||||
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")
|
||||
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();
|
||||
this.getRulesList()
|
||||
},
|
||||
handleAdd() {
|
||||
this.visible = true
|
||||
|
@ -159,39 +152,39 @@ export default {
|
|||
this.getNuclideList()
|
||||
},
|
||||
getNuclideListAll() {
|
||||
getAction("/gardsNuclLib/allName").then(res => {
|
||||
getAction('/gardsNuclLib/allName').then((res) => {
|
||||
this.spinning = false
|
||||
if (res.success) {
|
||||
if (res.result.length > 0) {
|
||||
this.dataList = res.result.map((item,index) => {
|
||||
this.dataList = res.result.map((item, index) => {
|
||||
return {
|
||||
key: item,
|
||||
title: item
|
||||
title: item,
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.dataList = []
|
||||
}
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
getNuclideList() {
|
||||
getAction("/sys/defaultNuclide/allName",{useType:2}).then(res => {
|
||||
getAction('/sys/defaultNuclide/allName', { useType: 2 }).then((res) => {
|
||||
if (res.success) {
|
||||
if (res.result.length > 0) {
|
||||
this.targetKeys = res.result.map(item => item)
|
||||
this.targetKeys = res.result.map((item) => item)
|
||||
} else {
|
||||
this.targetKeys = []
|
||||
}
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
handleChange(targetKeys, direction, moveKeys) {
|
||||
this.targetKeys= targetKeys;
|
||||
this.targetKeys = targetKeys
|
||||
},
|
||||
handleSearch(dir, value) {
|
||||
console.log('search:', dir, value)
|
||||
|
@ -199,15 +192,15 @@ export default {
|
|||
handleOk() {
|
||||
let params = {
|
||||
nuclideNames: this.targetKeys,
|
||||
useType: 2
|
||||
useType: 2,
|
||||
}
|
||||
getAction("/sys/defaultNuclide/add",params).then(res => {
|
||||
getAction('/sys/defaultNuclide/add', params).then((res) => {
|
||||
this.visible = false
|
||||
if (res.success) {
|
||||
this.$message.success(res.message)
|
||||
this.getRulesList()
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
@ -219,7 +212,7 @@ export default {
|
|||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.header{
|
||||
.header {
|
||||
height: 54px;
|
||||
border-top: 1px solid rgba(12, 235, 201, 0.3);
|
||||
border-bottom: 1px solid rgba(12, 235, 201, 0.3);
|
||||
|
@ -236,7 +229,7 @@ export default {
|
|||
width: 92px;
|
||||
}
|
||||
}
|
||||
.group-assign{
|
||||
.group-assign {
|
||||
position: relative;
|
||||
width: 690px;
|
||||
margin: 0 auto;
|
||||
|
@ -258,7 +251,7 @@ export default {
|
|||
left: 16px;
|
||||
}
|
||||
}
|
||||
&-body{
|
||||
&-body {
|
||||
height: calc(100% - 37px);
|
||||
}
|
||||
&-content {
|
||||
|
@ -268,14 +261,14 @@ export default {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
&:last-child {
|
||||
height: 411px;
|
||||
position: relative;
|
||||
// top: 35px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.ant-transfer-operation {
|
||||
.ant-btn {
|
||||
width: 92px;
|
||||
|
@ -314,27 +307,27 @@ export default {
|
|||
}
|
||||
}
|
||||
}
|
||||
.ant-transfer-list-header{
|
||||
.ant-transfer-list-header {
|
||||
position: relative;
|
||||
.ant-checkbox-wrapper{
|
||||
.ant-checkbox-wrapper {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
}
|
||||
}
|
||||
.ant-transfer-list-content-item{
|
||||
.ant-transfer-list-content-item {
|
||||
position: relative;
|
||||
.ant-checkbox-wrapper{
|
||||
.ant-checkbox-wrapper {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
}
|
||||
}
|
||||
.ant-transfer-list-content-item-text{
|
||||
.ant-transfer-list-content-item-text {
|
||||
padding-left: 22px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
/deep/.ant-modal-title{
|
||||
/deep/.ant-modal-title {
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
</style>
|
|
@ -1,15 +1,15 @@
|
|||
<template>
|
||||
<div style="height: 100%;">
|
||||
<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
|
||||
<a-select
|
||||
style="width: 180px; display: inline-block"
|
||||
v-model="type"
|
||||
:options="typeOptions"
|
||||
show-arrow
|
||||
allowClear
|
||||
placeholder="select..."
|
||||
placeholder="select..."
|
||||
@change="onTypeChange"
|
||||
>
|
||||
<img slot="suffixIcon" src="@/assets/images/global/select-down.png" alt="" />
|
||||
|
@ -43,23 +43,17 @@
|
|||
</custom-table>
|
||||
</div>
|
||||
<!-- 列表结束 -->
|
||||
<a-modal
|
||||
title='Edit'
|
||||
:width="845"
|
||||
v-model="visible"
|
||||
@ok="handleOk"
|
||||
destroy-on-close
|
||||
>
|
||||
<a-modal title="Edit" :width="845" v-model="visible" :maskClosable="false" @ok="handleOk" destroy-on-close>
|
||||
<a-spin :spinning="spinning">
|
||||
<div style="padding-left: 52px;margin-bottom: 20px;">
|
||||
<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
|
||||
<a-select
|
||||
style="width: 180px; display: inline-block"
|
||||
v-model="currType"
|
||||
:options="typeOptions"
|
||||
show-arrow
|
||||
allowClear
|
||||
placeholder="select..."
|
||||
placeholder="select..."
|
||||
@change="onCurrTypeChange"
|
||||
>
|
||||
<img slot="suffixIcon" src="@/assets/images/global/select-down.png" alt="" />
|
||||
|
@ -70,7 +64,7 @@
|
|||
:dataSource="dataList"
|
||||
:target-keys="targetKeys"
|
||||
show-search
|
||||
:render="item => item.title"
|
||||
:render="(item) => item.title"
|
||||
:operations="['Assign', 'Remove']"
|
||||
:titles="['Total Nuclides', 'User Nuclides']"
|
||||
@change="handleChange"
|
||||
|
@ -82,7 +76,7 @@
|
|||
<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="success" @click="handleOk">Save</a-button>
|
||||
<a-button type="warn" @click="onCancel">Cancel</a-button>
|
||||
</a-space>
|
||||
</template>
|
||||
|
@ -98,37 +92,37 @@ const columns = [
|
|||
align: 'left',
|
||||
width: 170,
|
||||
scopedSlots: {
|
||||
customRender: 'index'
|
||||
customRender: 'index',
|
||||
},
|
||||
customHeaderCell: () => {
|
||||
return {
|
||||
style: {
|
||||
'padding-left': '60px !important'
|
||||
}
|
||||
'padding-left': '60px !important',
|
||||
},
|
||||
}
|
||||
},
|
||||
customCell: () => {
|
||||
return {
|
||||
style: {
|
||||
'padding-left': '60px !important'
|
||||
}
|
||||
'padding-left': '60px !important',
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'NUCLIDE NAME',
|
||||
align: 'left',
|
||||
dataIndex: 'nuclideName'
|
||||
dataIndex: 'nuclideName',
|
||||
},
|
||||
{
|
||||
title: 'NUCLIDE TYPE',
|
||||
align: 'left',
|
||||
dataIndex: 'nuclideType'
|
||||
dataIndex: 'nuclideType',
|
||||
},
|
||||
{
|
||||
title: 'CREATE TIME',
|
||||
align: 'left',
|
||||
dataIndex: 'createTime'
|
||||
dataIndex: 'createTime',
|
||||
},
|
||||
]
|
||||
export default {
|
||||
|
@ -139,7 +133,7 @@ export default {
|
|||
url: {
|
||||
list: '/sys/defaultNuclide/findPage',
|
||||
},
|
||||
ipagination:{
|
||||
ipagination: {
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
pageSizeOptions: ['10', '20', '30'],
|
||||
|
@ -149,29 +143,29 @@ export default {
|
|||
},
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
total: 0
|
||||
total: 0,
|
||||
},
|
||||
loading: false,
|
||||
typeOptions: [
|
||||
{
|
||||
label: "P",
|
||||
value: "P"
|
||||
label: 'P',
|
||||
value: 'P',
|
||||
},
|
||||
{
|
||||
label: "G",
|
||||
value: "G"
|
||||
}
|
||||
label: 'G',
|
||||
value: 'G',
|
||||
},
|
||||
],
|
||||
type: undefined,
|
||||
currType: "P",
|
||||
currType: 'P',
|
||||
targetKeys: [],
|
||||
visible: false,
|
||||
dataList: [],
|
||||
spinning: false
|
||||
spinning: false,
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.getAuroPeocessList();
|
||||
mounted() {
|
||||
this.getAuroPeocessList()
|
||||
},
|
||||
methods: {
|
||||
getAuroPeocessList() {
|
||||
|
@ -180,27 +174,26 @@ export default {
|
|||
pageNo: this.ipagination.current,
|
||||
pageSize: this.ipagination.pageSize,
|
||||
useType: 1,
|
||||
nuclideType: this.type || ""
|
||||
nuclideType: this.type || '',
|
||||
}
|
||||
getAction(this.url.list, params).then(res => {
|
||||
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")
|
||||
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();
|
||||
this.getAuroPeocessList()
|
||||
},
|
||||
onTypeChange(val) {
|
||||
this.type = val
|
||||
this.getAuroPeocessList();
|
||||
this.getAuroPeocessList()
|
||||
},
|
||||
onCurrTypeChange(val) {
|
||||
this.currType = val
|
||||
|
@ -213,40 +206,40 @@ export default {
|
|||
this.getNuclideList()
|
||||
},
|
||||
getNuclideListAll() {
|
||||
getAction("/gardsNuclLib/allName").then(res => {
|
||||
getAction('/gardsNuclLib/allName').then((res) => {
|
||||
this.spinning = false
|
||||
if (res.success) {
|
||||
if (res.result.length > 0) {
|
||||
this.dataList = res.result.map((item,index) => {
|
||||
this.dataList = res.result.map((item, index) => {
|
||||
return {
|
||||
key: item,
|
||||
title: item
|
||||
title: item,
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.dataList = []
|
||||
}
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
getNuclideList() {
|
||||
getAction("/sys/defaultNuclide/allName",{useType:1,nuclideType: this.currType}).then(res => {
|
||||
getAction('/sys/defaultNuclide/allName', { useType: 1, nuclideType: this.currType }).then((res) => {
|
||||
if (res.success) {
|
||||
if (res.result.length > 0) {
|
||||
this.targetKeys = res.result.map(item => item)
|
||||
this.targetKeys = res.result.map((item) => item)
|
||||
} else {
|
||||
this.targetKeys = []
|
||||
}
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
handleChange(targetKeys, direction, moveKeys) {
|
||||
console.log(targetKeys, direction, moveKeys);
|
||||
this.targetKeys= targetKeys;
|
||||
console.log(targetKeys, direction, moveKeys)
|
||||
this.targetKeys = targetKeys
|
||||
},
|
||||
handleSearch(dir, value) {
|
||||
console.log('search:', dir, value)
|
||||
|
@ -255,15 +248,15 @@ export default {
|
|||
let params = {
|
||||
nuclideNames: this.targetKeys,
|
||||
nuclideType: this.currType,
|
||||
useType: 1
|
||||
useType: 1,
|
||||
}
|
||||
getAction("/sys/defaultNuclide/add",params).then(res => {
|
||||
getAction('/sys/defaultNuclide/add', params).then((res) => {
|
||||
this.visible = false
|
||||
if (res.success) {
|
||||
this.$message.success(res.message)
|
||||
this.getAuroPeocessList()
|
||||
} else {
|
||||
this.$message.warning("This operation fails. Contact your system administrator")
|
||||
this.$message.warning('This operation fails. Contact your system administrator')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
@ -275,7 +268,7 @@ export default {
|
|||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.header{
|
||||
.header {
|
||||
height: 54px;
|
||||
border-top: 1px solid rgba(12, 235, 201, 0.3);
|
||||
border-bottom: 1px solid rgba(12, 235, 201, 0.3);
|
||||
|
@ -286,7 +279,7 @@ export default {
|
|||
padding: 0 10px;
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
.item-label{
|
||||
.item-label {
|
||||
display: inline-block;
|
||||
font-size: 16px;
|
||||
font-family: ArialMT;
|
||||
|
@ -302,7 +295,7 @@ export default {
|
|||
width: 92px;
|
||||
}
|
||||
}
|
||||
.group-assign{
|
||||
.group-assign {
|
||||
position: relative;
|
||||
width: 690px;
|
||||
margin: 0 auto;
|
||||
|
@ -324,7 +317,7 @@ export default {
|
|||
left: 16px;
|
||||
}
|
||||
}
|
||||
&-body{
|
||||
&-body {
|
||||
height: calc(100% - 37px);
|
||||
}
|
||||
&-content {
|
||||
|
@ -334,14 +327,14 @@ export default {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
&:last-child {
|
||||
height: 411px;
|
||||
position: relative;
|
||||
// top: 35px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.ant-transfer-operation {
|
||||
.ant-btn {
|
||||
width: 92px;
|
||||
|
@ -380,27 +373,27 @@ export default {
|
|||
}
|
||||
}
|
||||
}
|
||||
.ant-transfer-list-header{
|
||||
.ant-transfer-list-header {
|
||||
position: relative;
|
||||
.ant-checkbox-wrapper{
|
||||
.ant-checkbox-wrapper {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
}
|
||||
}
|
||||
.ant-transfer-list-content-item{
|
||||
.ant-transfer-list-content-item {
|
||||
position: relative;
|
||||
.ant-checkbox-wrapper{
|
||||
.ant-checkbox-wrapper {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
}
|
||||
}
|
||||
.ant-transfer-list-content-item-text{
|
||||
.ant-transfer-list-content-item-text {
|
||||
padding-left: 22px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
/deep/.ant-modal-title{
|
||||
/deep/.ant-modal-title {
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
</style>
|
|
@ -3,185 +3,167 @@
|
|||
:title="title"
|
||||
:width="800"
|
||||
:visible="visible"
|
||||
:maskClosable="false"
|
||||
:confirmLoading="confirmLoading"
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
:cancelButtonProps="{ props: { type: 'warn' } }"
|
||||
>
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form-model ref="form" :model="model" :rules="validatorRules">
|
||||
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
prop="itemText"
|
||||
label="Name">
|
||||
<a-input placeholder="Please Enter Name" v-model="model.itemText"/>
|
||||
<a-form-model ref="form" :model="model" :rules="validatorRules">
|
||||
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" prop="itemText" label="Name">
|
||||
<a-input placeholder="Please Enter Name" v-model="model.itemText" />
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
prop="itemValue"
|
||||
label="Item Value">
|
||||
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" prop="itemValue" label="Item Value">
|
||||
<a-input placeholder="Please Enter Item Value" v-model="model.itemValue" />
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="Description">
|
||||
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="Description">
|
||||
<a-input v-model="model.description" />
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="Sort">
|
||||
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="Sort">
|
||||
<a-input-number :min="1" v-model="model.sortOrder" />
|
||||
The Smaller The Value, the More Advanced
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="Enable"
|
||||
hasFeedback>
|
||||
<a-switch checkedChildren="Enable" unCheckedChildren="Disable" @change="onChose" v-model="visibleCheck"/>
|
||||
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="Enable" hasFeedback>
|
||||
<a-switch checkedChildren="Enable" unCheckedChildren="Disable" @change="onChose" v-model="visibleCheck" />
|
||||
</a-form-model-item>
|
||||
|
||||
</a-form-model>
|
||||
</a-spin>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import {addDictItem, editDictItem} from '@/api/api'
|
||||
import { getAction } from '@api/manage'
|
||||
import pick from 'lodash.pick'
|
||||
import { addDictItem, editDictItem } from '@/api/api'
|
||||
import { getAction } from '@api/manage'
|
||||
|
||||
export default {
|
||||
name: "DictItemModal",
|
||||
data() {
|
||||
return {
|
||||
title: "操作",
|
||||
visible: false,
|
||||
visibleCheck: true,
|
||||
model: {},
|
||||
dictId: "",
|
||||
status: 1,
|
||||
labelCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 5},
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 16},
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules: {
|
||||
itemText: [{required: true, message: 'Please Enter Name'}],
|
||||
itemValue: [{required: true, message: 'Please Enter Item Value'},{validator: this.validateItemValue}],
|
||||
},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
},
|
||||
methods: {
|
||||
add(dictId) {
|
||||
this.dictId = dictId;
|
||||
//初始化默认值
|
||||
this.edit({sortOrder:1,status:1});
|
||||
export default {
|
||||
name: 'DictItemModal',
|
||||
data() {
|
||||
return {
|
||||
title: '操作',
|
||||
visible: false,
|
||||
visibleCheck: true,
|
||||
model: {},
|
||||
dictId: '',
|
||||
status: 1,
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 },
|
||||
},
|
||||
edit(record) {
|
||||
if (record.id) {
|
||||
this.dictId = record.dictId;
|
||||
}
|
||||
this.status = record.status;
|
||||
this.visibleCheck = (record.status == 1) ? true : false;
|
||||
this.model = Object.assign({}, record);
|
||||
this.model.dictId = this.dictId;
|
||||
this.model.status = this.status;
|
||||
this.visible = true;
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
onChose(checked) {
|
||||
if (checked) {
|
||||
this.status = 1;
|
||||
this.visibleCheck = true;
|
||||
} else {
|
||||
this.status = 0;
|
||||
this.visibleCheck = false;
|
||||
}
|
||||
confirmLoading: false,
|
||||
validatorRules: {
|
||||
itemText: [{ required: true, message: 'Please Enter Name' }],
|
||||
itemValue: [{ required: true, message: 'Please Enter Item Value' }, { validator: this.validateItemValue }],
|
||||
},
|
||||
// 确定
|
||||
handleOk() {
|
||||
const that = this;
|
||||
// 触发表单验证
|
||||
this.$refs.form.validate(valid => {
|
||||
if (valid) {
|
||||
that.confirmLoading = true;
|
||||
this.model.itemText = (this.model.itemText || '').trim()
|
||||
this.model.itemValue = (this.model.itemValue || '').trim()
|
||||
this.model.description = (this.model.description || '').trim()
|
||||
this.model.status = this.status;
|
||||
let obj;
|
||||
if (!this.model.id) {
|
||||
obj = addDictItem(this.model);
|
||||
} else {
|
||||
obj = editDictItem(this.model);
|
||||
}
|
||||
obj.then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message);
|
||||
that.$emit('ok');
|
||||
} else {
|
||||
that.$message.warning(res.message);
|
||||
}
|
||||
}).finally(() => {
|
||||
that.confirmLoading = false;
|
||||
that.close();
|
||||
})
|
||||
}else{
|
||||
return false;
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭
|
||||
handleCancel() {
|
||||
this.close();
|
||||
},
|
||||
close() {
|
||||
this.$emit('close');
|
||||
this.visible = false;
|
||||
this.$refs.form.resetFields();
|
||||
},
|
||||
validateItemValue(rule, value, callback){
|
||||
let param = {
|
||||
itemValue:value,
|
||||
dictId:this.dictId,
|
||||
}
|
||||
if(this.model.id){
|
||||
param.id = this.model.id
|
||||
}
|
||||
if(value){
|
||||
let reg=new RegExp("[`~!@#$^&*()=|{}'.<>《》/?!¥()—【】‘;:”“。,、?]")
|
||||
if(reg.test(value)){
|
||||
callback("Cannot Have Special Charactors")
|
||||
}else{
|
||||
//update--begin--autor:lvdandan-----date:20201203------for:JT-27【数据字典】字典 - 数据值可重复
|
||||
getAction("/sys/dictItem/dictItemCheck",param).then((res)=>{
|
||||
if(res.success){
|
||||
callback()
|
||||
}else{
|
||||
callback(res.message);
|
||||
}
|
||||
});
|
||||
//update--end--autor:lvdandan-----date:20201203------for:JT-27【数据字典】字典 - 数据值可重复
|
||||
}
|
||||
}else{
|
||||
callback()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
methods: {
|
||||
add(dictId) {
|
||||
this.dictId = dictId
|
||||
//初始化默认值
|
||||
this.edit({ sortOrder: 1, status: 1 })
|
||||
},
|
||||
edit(record) {
|
||||
if (record.id) {
|
||||
this.dictId = record.dictId
|
||||
}
|
||||
this.status = record.status
|
||||
this.visibleCheck = record.status == 1 ? true : false
|
||||
this.model = Object.assign({}, record)
|
||||
this.model.dictId = this.dictId
|
||||
this.model.status = this.status
|
||||
this.visible = true
|
||||
},
|
||||
onChose(checked) {
|
||||
if (checked) {
|
||||
this.status = 1
|
||||
this.visibleCheck = true
|
||||
} else {
|
||||
this.status = 0
|
||||
this.visibleCheck = false
|
||||
}
|
||||
},
|
||||
// 确定
|
||||
handleOk() {
|
||||
const that = this
|
||||
// 触发表单验证
|
||||
this.$refs.form.validate((valid) => {
|
||||
if (valid) {
|
||||
that.confirmLoading = true
|
||||
this.model.itemText = (this.model.itemText || '').trim()
|
||||
this.model.itemValue = (this.model.itemValue || '').trim()
|
||||
this.model.description = (this.model.description || '').trim()
|
||||
this.model.status = this.status
|
||||
let obj
|
||||
if (!this.model.id) {
|
||||
obj = addDictItem(this.model)
|
||||
} else {
|
||||
obj = editDictItem(this.model)
|
||||
}
|
||||
obj
|
||||
.then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message)
|
||||
that.$emit('ok')
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
.finally(() => {
|
||||
that.confirmLoading = false
|
||||
that.close()
|
||||
})
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭
|
||||
handleCancel() {
|
||||
this.close()
|
||||
},
|
||||
close() {
|
||||
this.$emit('close')
|
||||
this.visible = false
|
||||
this.$refs.form.resetFields()
|
||||
},
|
||||
validateItemValue(rule, value, callback) {
|
||||
let param = {
|
||||
itemValue: value,
|
||||
dictId: this.dictId,
|
||||
}
|
||||
if (this.model.id) {
|
||||
param.id = this.model.id
|
||||
}
|
||||
if (value) {
|
||||
let reg = new RegExp("[`~!@#$^&*()=|{}'.<>《》/?!¥()—【】‘;:”“。,、?]")
|
||||
if (reg.test(value)) {
|
||||
callback('Cannot Have Special Charactors')
|
||||
} else {
|
||||
//update--begin--autor:lvdandan-----date:20201203------for:JT-27【数据字典】字典 - 数据值可重复
|
||||
getAction('/sys/dictItem/dictItemCheck', param).then((res) => {
|
||||
if (res.success) {
|
||||
callback()
|
||||
} else {
|
||||
callback(res.message)
|
||||
}
|
||||
})
|
||||
//update--end--autor:lvdandan-----date:20201203------for:JT-27【数据字典】字典 - 数据值可重复
|
||||
}
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
|
|
@ -3,6 +3,7 @@
|
|||
:title="title"
|
||||
:width="600"
|
||||
:visible="visible"
|
||||
:maskClosable="false"
|
||||
:confirmLoading="confirmLoading"
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
|
@ -10,141 +11,125 @@
|
|||
>
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form-model ref="form" :model="model" :rules="validatorRules">
|
||||
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
prop="dictName"
|
||||
required
|
||||
label="Dict Name">
|
||||
<a-input placeholder="Please Enter Dict Name" v-model="model.dictName"/>
|
||||
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" prop="dictName" required label="Dict Name">
|
||||
<a-input placeholder="Please Enter Dict Name" v-model="model.dictName" />
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
prop="dictCode"
|
||||
required
|
||||
label="Dict Code">
|
||||
<a-input placeholder="Please Enter Dict Code" v-model="model.dictCode"/>
|
||||
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" prop="dictCode" required label="Dict Code">
|
||||
<a-input placeholder="Please Enter Dict Code" v-model="model.dictCode" />
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="Description">
|
||||
<a-input v-model="model.description"/>
|
||||
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="Description">
|
||||
<a-input v-model="model.description" />
|
||||
</a-form-model-item>
|
||||
|
||||
</a-form-model>
|
||||
</a-spin>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import pick from 'lodash.pick'
|
||||
import { addDict, editDict, duplicateCheck } from '@/api/api'
|
||||
import pick from 'lodash.pick'
|
||||
import { addDict, editDict, duplicateCheck } from '@/api/api'
|
||||
|
||||
export default {
|
||||
name: 'DictModal',
|
||||
data() {
|
||||
return {
|
||||
value: 1,
|
||||
title: '操作',
|
||||
visible: false,
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 }
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 }
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules: {
|
||||
dictName: [{ required: true, message: 'Please Enter Dict Name' }],
|
||||
dictCode: [
|
||||
{ required: true, message: 'Please Enter Dict Code' },
|
||||
{ validator: this.validateDictCode }]
|
||||
}
|
||||
export default {
|
||||
name: 'DictModal',
|
||||
data() {
|
||||
return {
|
||||
value: 1,
|
||||
title: '操作',
|
||||
visible: false,
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules: {
|
||||
dictName: [{ required: true, message: 'Please Enter Dict Name' }],
|
||||
dictCode: [{ required: true, message: 'Please Enter Dict Code' }, { validator: this.validateDictCode }],
|
||||
},
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
methods: {
|
||||
validateDictCode(rule, value, callback) {
|
||||
// 重复校验
|
||||
var params = {
|
||||
tableName: 'sys_dict',
|
||||
fieldName: 'dict_code',
|
||||
fieldVal: value,
|
||||
dataId: this.model.id,
|
||||
}
|
||||
},
|
||||
created() {
|
||||
},
|
||||
methods: {
|
||||
validateDictCode(rule, value, callback) {
|
||||
// 重复校验
|
||||
var params = {
|
||||
tableName: 'sys_dict',
|
||||
fieldName: 'dict_code',
|
||||
fieldVal: value,
|
||||
dataId: this.model.id
|
||||
}
|
||||
duplicateCheck(params).then((res) => {
|
||||
if (res.success) {
|
||||
callback()
|
||||
} else {
|
||||
callback(res.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
handleChange(value) {
|
||||
this.model.status = value
|
||||
},
|
||||
add() {
|
||||
this.edit({})
|
||||
},
|
||||
edit(record) {
|
||||
if (record.id) {
|
||||
this.visiblekey = true
|
||||
duplicateCheck(params).then((res) => {
|
||||
if (res.success) {
|
||||
callback()
|
||||
} else {
|
||||
this.visiblekey = false
|
||||
callback(res.message)
|
||||
}
|
||||
this.model = Object.assign({}, record)
|
||||
this.visible = true
|
||||
},
|
||||
// 确定
|
||||
handleOk() {
|
||||
const that = this
|
||||
// 触发表单验证
|
||||
this.$refs.form.validate(valid => {
|
||||
if (valid) {
|
||||
that.confirmLoading = true
|
||||
this.model.dictName = (this.model.dictName || '').trim()
|
||||
this.model.dictCode = (this.model.dictCode || '').trim()
|
||||
this.model.description = (this.model.description || '').trim()
|
||||
let obj
|
||||
if (!this.model.id) {
|
||||
obj = addDict(this.model)
|
||||
} else {
|
||||
obj = editDict(this.model)
|
||||
}
|
||||
obj.then((res) => {
|
||||
})
|
||||
},
|
||||
handleChange(value) {
|
||||
this.model.status = value
|
||||
},
|
||||
add() {
|
||||
this.edit({})
|
||||
},
|
||||
edit(record) {
|
||||
if (record.id) {
|
||||
this.visiblekey = true
|
||||
} else {
|
||||
this.visiblekey = false
|
||||
}
|
||||
this.model = Object.assign({}, record)
|
||||
this.visible = true
|
||||
},
|
||||
// 确定
|
||||
handleOk() {
|
||||
const that = this
|
||||
// 触发表单验证
|
||||
this.$refs.form.validate((valid) => {
|
||||
if (valid) {
|
||||
that.confirmLoading = true
|
||||
this.model.dictName = (this.model.dictName || '').trim()
|
||||
this.model.dictCode = (this.model.dictCode || '').trim()
|
||||
this.model.description = (this.model.description || '').trim()
|
||||
let obj
|
||||
if (!this.model.id) {
|
||||
obj = addDict(this.model)
|
||||
} else {
|
||||
obj = editDict(this.model)
|
||||
}
|
||||
obj
|
||||
.then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message)
|
||||
that.$emit('ok')
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
})
|
||||
.finally(() => {
|
||||
that.confirmLoading = false
|
||||
that.close()
|
||||
})
|
||||
}else{
|
||||
return false;
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭
|
||||
handleCancel() {
|
||||
this.close()
|
||||
},
|
||||
close() {
|
||||
this.$emit('close')
|
||||
this.visible = false
|
||||
this.$refs.form.resetFields();
|
||||
}
|
||||
}
|
||||
}
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭
|
||||
handleCancel() {
|
||||
this.close()
|
||||
},
|
||||
close() {
|
||||
this.$emit('close')
|
||||
this.visible = false
|
||||
this.$refs.form.resetFields()
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
|
@ -3,171 +3,161 @@
|
|||
:title="title"
|
||||
:width="1000"
|
||||
:visible="visible"
|
||||
:maskClosable="false"
|
||||
:confirmLoading="confirmLoading"
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
:cancelButtonProps="{ props: { type: 'warn' } }"
|
||||
cancelText="Cancel">
|
||||
|
||||
cancelText="Cancel"
|
||||
>
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form-model ref="form" :model="model" :rules="validatorRules">
|
||||
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
prop="ruleName"
|
||||
label="Rule Name">
|
||||
<a-input placeholder="Please Enter Rule Name" v-model="model.ruleName"/>
|
||||
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" prop="ruleName" label="Rule Name">
|
||||
<a-input placeholder="Please Enter Rule Name" v-model="model.ruleName" />
|
||||
</a-form-model-item>
|
||||
<a-form-model-item
|
||||
v-show="showRuleColumn"
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
prop="ruleColumn"
|
||||
label="Rule Column">
|
||||
<a-input placeholder="Please Enter Rule Column" v-model.trim="model.ruleColumn"/>
|
||||
label="Rule Column"
|
||||
>
|
||||
<a-input placeholder="Please Enter Rule Column" v-model.trim="model.ruleColumn" />
|
||||
</a-form-model-item>
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
prop="ruleConditions"
|
||||
label="Rule Conditions">
|
||||
<j-dict-select-tag @input="handleChangeRuleCondition" v-model="model.ruleConditions" placeholder="Please Enter Rule Conditions" dictCode="rule_conditions"/>
|
||||
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" prop="ruleConditions" label="Rule Conditions">
|
||||
<j-dict-select-tag
|
||||
@input="handleChangeRuleCondition"
|
||||
v-model="model.ruleConditions"
|
||||
placeholder="Please Enter Rule Conditions"
|
||||
dictCode="rule_conditions"
|
||||
/>
|
||||
</a-form-model-item>
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
prop="ruleValue"
|
||||
label="Rule Value">
|
||||
<a-input placeholder="Please Enter Rule Value" v-model="model.ruleValue"/>
|
||||
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" prop="ruleValue" label="Rule Value">
|
||||
<a-input placeholder="Please Enter Rule Value" v-model="model.ruleValue" />
|
||||
</a-form-model-item>
|
||||
|
||||
<a-form-model-item
|
||||
:labelCol="labelCol"
|
||||
:wrapperCol="wrapperCol"
|
||||
label="Status">
|
||||
<a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="Status">
|
||||
<a-radio-group buttonStyle="solid" v-model="model.status">
|
||||
<a-radio-button value="1">Valid</a-radio-button>
|
||||
<a-radio-button value="0">Invalid</a-radio-button>
|
||||
</a-radio-group>
|
||||
</a-form-model-item>
|
||||
|
||||
</a-form-model>
|
||||
</a-spin>
|
||||
</a-modal>
|
||||
</template>
|
||||
<script>
|
||||
import { httpAction } from '@/api/manage'
|
||||
import { httpAction } from '@/api/manage'
|
||||
|
||||
export default {
|
||||
name: 'PermissionDataRuleModal',
|
||||
data() {
|
||||
return {
|
||||
queryParam: {},
|
||||
title: '操作',
|
||||
visible: false,
|
||||
model: {},
|
||||
ruleConditionList: [],
|
||||
labelCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 5}
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: {span: 24},
|
||||
sm: {span: 16}
|
||||
},
|
||||
confirmLoading: false,
|
||||
permissionId: '',
|
||||
validatorRules: {
|
||||
ruleConditions: [{required: true, message: '请选择条件!'}],
|
||||
ruleName:[{required: true, message: '请输入规则名称!'}],
|
||||
ruleValue: [{required: true, message: '请输入规则值!'}],
|
||||
ruleColumn: []
|
||||
},
|
||||
url: {
|
||||
list: '/sys/dictItem/list',
|
||||
add: '/sys/permission/addPermissionRule',
|
||||
edit: '/sys/permission/editPermissionRule'
|
||||
},
|
||||
showRuleColumn:true
|
||||
export default {
|
||||
name: 'PermissionDataRuleModal',
|
||||
data() {
|
||||
return {
|
||||
queryParam: {},
|
||||
title: '操作',
|
||||
visible: false,
|
||||
model: {},
|
||||
ruleConditionList: [],
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
confirmLoading: false,
|
||||
permissionId: '',
|
||||
validatorRules: {
|
||||
ruleConditions: [{ required: true, message: '请选择条件!' }],
|
||||
ruleName: [{ required: true, message: '请输入规则名称!' }],
|
||||
ruleValue: [{ required: true, message: '请输入规则值!' }],
|
||||
ruleColumn: [],
|
||||
},
|
||||
url: {
|
||||
list: '/sys/dictItem/list',
|
||||
add: '/sys/permission/addPermissionRule',
|
||||
edit: '/sys/permission/editPermissionRule',
|
||||
},
|
||||
showRuleColumn: true,
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
methods: {
|
||||
add(permId) {
|
||||
this.permissionId = permId
|
||||
//初始化默认值
|
||||
this.edit({ status: '1' })
|
||||
},
|
||||
edit(record) {
|
||||
this.model = Object.assign({}, record)
|
||||
if (record.permissionId) {
|
||||
this.model.permissionId = record.permissionId
|
||||
} else {
|
||||
this.model.permissionId = this.permissionId
|
||||
}
|
||||
this.visible = true
|
||||
this.initRuleCondition()
|
||||
},
|
||||
created() {
|
||||
close() {
|
||||
this.$emit('close')
|
||||
this.visible = false
|
||||
this.$refs.form.resetFields()
|
||||
},
|
||||
methods: {
|
||||
add(permId) {
|
||||
this.permissionId = permId
|
||||
//初始化默认值
|
||||
this.edit({status:'1'})
|
||||
},
|
||||
edit(record) {
|
||||
this.model = Object.assign({}, record)
|
||||
if (record.permissionId) {
|
||||
this.model.permissionId = record.permissionId
|
||||
} else {
|
||||
this.model.permissionId = this.permissionId
|
||||
}
|
||||
this.visible = true
|
||||
this.initRuleCondition()
|
||||
},
|
||||
close() {
|
||||
this.$emit('close')
|
||||
this.visible = false
|
||||
this.$refs.form.resetFields()
|
||||
},
|
||||
handleOk() {
|
||||
const that = this
|
||||
// 触发表单验证
|
||||
this.$refs.form.validate(valid => {
|
||||
if (valid) {
|
||||
that.confirmLoading = true
|
||||
let httpurl = ''
|
||||
let method = ''
|
||||
if (!this.model.id) {
|
||||
httpurl += this.url.add
|
||||
method = 'post'
|
||||
} else {
|
||||
httpurl += this.url.edit
|
||||
method = 'put'
|
||||
}
|
||||
httpAction(httpurl, this.model, method).then((res) => {
|
||||
handleOk() {
|
||||
const that = this
|
||||
// 触发表单验证
|
||||
this.$refs.form.validate((valid) => {
|
||||
if (valid) {
|
||||
that.confirmLoading = true
|
||||
let httpurl = ''
|
||||
let method = ''
|
||||
if (!this.model.id) {
|
||||
httpurl += this.url.add
|
||||
method = 'post'
|
||||
} else {
|
||||
httpurl += this.url.edit
|
||||
method = 'put'
|
||||
}
|
||||
httpAction(httpurl, this.model, method)
|
||||
.then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message)
|
||||
that.$emit('ok')
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
})
|
||||
.finally(() => {
|
||||
that.confirmLoading = false
|
||||
that.close()
|
||||
})
|
||||
}else{
|
||||
return false;
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel() {
|
||||
this.close()
|
||||
},
|
||||
initRuleCondition(){
|
||||
if(this.model.ruleConditions && this.model.ruleConditions=='USE_SQL_RULES'){
|
||||
this.showRuleColumn = false
|
||||
}else{
|
||||
this.showRuleColumn = true
|
||||
}
|
||||
},
|
||||
handleChangeRuleCondition(val){
|
||||
if(val=='USE_SQL_RULES'){
|
||||
this.model.ruleColumn=''
|
||||
this.showRuleColumn = false
|
||||
}else{
|
||||
this.showRuleColumn = true
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel() {
|
||||
this.close()
|
||||
},
|
||||
initRuleCondition() {
|
||||
if (this.model.ruleConditions && this.model.ruleConditions == 'USE_SQL_RULES') {
|
||||
this.showRuleColumn = false
|
||||
} else {
|
||||
this.showRuleColumn = true
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
handleChangeRuleCondition(val) {
|
||||
if (val == 'USE_SQL_RULES') {
|
||||
this.model.ruleColumn = ''
|
||||
this.showRuleColumn = false
|
||||
} else {
|
||||
this.showRuleColumn = true
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
|
@ -5,29 +5,27 @@
|
|||
:title="title"
|
||||
:width="1000"
|
||||
:visible="visible"
|
||||
:maskClosable="false"
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
:cancelButtonProps="{ props: { type: 'warn' } }"
|
||||
cancelText="Cancel">
|
||||
|
||||
|
||||
cancelText="Cancel"
|
||||
>
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
|
||||
<a-col :span="10">
|
||||
<a-form-item label="User Name">
|
||||
<a-input v-model="queryParam.username"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="8">
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-button type="primary" @click="searchQuery" icon="search">Search</a-button>
|
||||
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">Reset</a-button>
|
||||
</span>
|
||||
<span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
|
||||
<a-button type="primary" @click="searchQuery" icon="search">Search</a-button>
|
||||
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">Reset</a-button>
|
||||
</span>
|
||||
</a-col>
|
||||
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
|
@ -42,248 +40,249 @@
|
|||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:scroll="{ y: 240 }"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys,onSelectAll:onSelectAll,onSelect:onSelect,onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
|
||||
:rowSelection="{
|
||||
selectedRowKeys: selectedRowKeys,
|
||||
onSelectAll: onSelectAll,
|
||||
onSelect: onSelect,
|
||||
onChange: onSelectChange,
|
||||
}"
|
||||
@change="handleTableChange"
|
||||
>
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
|
||||
|
||||
</a-modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {filterObj} from '@/utils/util'
|
||||
import {getAction} from '@/api/manage'
|
||||
import { filterObj } from '@/utils/util'
|
||||
import { getAction } from '@/api/manage'
|
||||
|
||||
export default {
|
||||
name: "SelectUserModal",
|
||||
data() {
|
||||
return {
|
||||
title: "Add From List",
|
||||
names: [],
|
||||
visible: false,
|
||||
placement: 'right',
|
||||
description: '',
|
||||
// 查询条件
|
||||
queryParam: {},
|
||||
// 表头
|
||||
columns1: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key: 'rowIndex',
|
||||
width: 50,
|
||||
align: "center",
|
||||
customRender: function (t, r, index) {
|
||||
return parseInt(index) + 1;
|
||||
}
|
||||
export default {
|
||||
name: 'SelectUserModal',
|
||||
data() {
|
||||
return {
|
||||
title: 'Add From List',
|
||||
names: [],
|
||||
visible: false,
|
||||
placement: 'right',
|
||||
description: '',
|
||||
// 查询条件
|
||||
queryParam: {},
|
||||
// 表头
|
||||
columns1: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key: 'rowIndex',
|
||||
width: 50,
|
||||
align: 'center',
|
||||
customRender: function (t, r, index) {
|
||||
return parseInt(index) + 1
|
||||
},
|
||||
{
|
||||
title: 'User Name',
|
||||
align: "center",
|
||||
width: 100,
|
||||
dataIndex: 'username'
|
||||
},
|
||||
{
|
||||
title: 'Real Name',
|
||||
align: "center",
|
||||
width: 100,
|
||||
dataIndex: 'realname'
|
||||
},
|
||||
{
|
||||
title: 'Gender',
|
||||
align: "center",
|
||||
width: 100,
|
||||
dataIndex: 'sex_dictText'
|
||||
},
|
||||
{
|
||||
title: 'Phone',
|
||||
align: "center",
|
||||
width: 100,
|
||||
dataIndex: 'phone'
|
||||
},
|
||||
{
|
||||
title: 'Org',
|
||||
align: "center",
|
||||
width: 150,
|
||||
dataIndex: 'orgCode'
|
||||
}
|
||||
],
|
||||
columns2: [
|
||||
{
|
||||
title: 'User Name',
|
||||
align: "center",
|
||||
dataIndex: 'username',
|
||||
|
||||
},
|
||||
{
|
||||
title: 'Real Name',
|
||||
align: "center",
|
||||
dataIndex: 'realname',
|
||||
},
|
||||
{
|
||||
title: 'Action',
|
||||
dataIndex: 'action',
|
||||
align: "center",
|
||||
width: 100,
|
||||
scopedSlots: {customRender: 'action'},
|
||||
}
|
||||
],
|
||||
//数据集
|
||||
dataSource1: [],
|
||||
dataSource2: [],
|
||||
// 分页参数
|
||||
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
|
||||
},
|
||||
isorter: {
|
||||
column: 'createTime',
|
||||
order: 'desc',
|
||||
{
|
||||
title: 'User Name',
|
||||
align: 'center',
|
||||
width: 100,
|
||||
dataIndex: 'username',
|
||||
},
|
||||
loading: false,
|
||||
selectedRowKeys: [],
|
||||
selectedRows: [],
|
||||
url: {
|
||||
list: "/sys/user/list",
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.loadData();
|
||||
},
|
||||
methods: {
|
||||
searchQuery() {
|
||||
this.loadData(1);
|
||||
{
|
||||
title: 'Real Name',
|
||||
align: 'center',
|
||||
width: 100,
|
||||
dataIndex: 'realname',
|
||||
},
|
||||
{
|
||||
title: 'Gender',
|
||||
align: 'center',
|
||||
width: 100,
|
||||
dataIndex: 'sex_dictText',
|
||||
},
|
||||
{
|
||||
title: 'Phone',
|
||||
align: 'center',
|
||||
width: 100,
|
||||
dataIndex: 'phone',
|
||||
},
|
||||
{
|
||||
title: 'Org',
|
||||
align: 'center',
|
||||
width: 150,
|
||||
dataIndex: 'orgCode',
|
||||
},
|
||||
],
|
||||
columns2: [
|
||||
{
|
||||
title: 'User Name',
|
||||
align: 'center',
|
||||
dataIndex: 'username',
|
||||
},
|
||||
{
|
||||
title: 'Real Name',
|
||||
align: 'center',
|
||||
dataIndex: 'realname',
|
||||
},
|
||||
{
|
||||
title: 'Action',
|
||||
dataIndex: 'action',
|
||||
align: 'center',
|
||||
width: 100,
|
||||
scopedSlots: { customRender: 'action' },
|
||||
},
|
||||
],
|
||||
//数据集
|
||||
dataSource1: [],
|
||||
dataSource2: [],
|
||||
// 分页参数
|
||||
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,
|
||||
},
|
||||
searchReset() {
|
||||
this.queryParam = {};
|
||||
this.loadData(1);
|
||||
isorter: {
|
||||
column: 'createTime',
|
||||
order: 'desc',
|
||||
},
|
||||
handleCancel() {
|
||||
this.visible = false;
|
||||
loading: false,
|
||||
selectedRowKeys: [],
|
||||
selectedRows: [],
|
||||
url: {
|
||||
list: '/sys/user/list',
|
||||
},
|
||||
handleOk() {
|
||||
this.dataSource2 = this.selectedRowKeys;
|
||||
console.log("data:" + this.dataSource2);
|
||||
this.$emit("selectFinished", this.dataSource2);
|
||||
this.visible = false;
|
||||
},
|
||||
add() {
|
||||
this.visible = true;
|
||||
},
|
||||
loadData(arg) {
|
||||
//加载数据 若传入参数1则加载第一页的内容
|
||||
if (arg === 1) {
|
||||
this.ipagination.current = 1;
|
||||
}
|
||||
var params = this.getQueryParams();//查询条件
|
||||
getAction(this.url.list, params).then((res) => {
|
||||
if (res.success) {
|
||||
this.dataSource1 = res.result.records;
|
||||
this.ipagination.total = res.result.total;
|
||||
}
|
||||
})
|
||||
},
|
||||
getQueryParams() {
|
||||
var param = Object.assign({}, this.queryParam, this.isorter);
|
||||
param.field = this.getQueryField();
|
||||
param.pageNo = this.ipagination.current;
|
||||
param.pageSize = this.ipagination.pageSize;
|
||||
return filterObj(param);
|
||||
},
|
||||
getQueryField() {
|
||||
//TODO 字段权限控制
|
||||
},
|
||||
onSelectAll(selected, selectedRows, changeRows) {
|
||||
if (selected === true) {
|
||||
for (var a = 0; a < changeRows.length; a++) {
|
||||
this.dataSource2.push(changeRows[a]);
|
||||
}
|
||||
} else {
|
||||
for (var b = 0; b < changeRows.length; b++) {
|
||||
this.dataSource2.splice(this.dataSource2.indexOf(changeRows[b]), 1);
|
||||
}
|
||||
}
|
||||
// console.log(selected, selectedRows, changeRows);
|
||||
},
|
||||
onSelect(record, selected) {
|
||||
if (selected === true) {
|
||||
this.dataSource2.push(record);
|
||||
} else {
|
||||
var index = this.dataSource2.indexOf(record);
|
||||
//console.log();
|
||||
if (index >= 0) {
|
||||
this.dataSource2.splice(this.dataSource2.indexOf(record), 1);
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
onSelectChange(selectedRowKeys, selectedRows) {
|
||||
this.selectedRowKeys = selectedRowKeys;
|
||||
this.selectionRows = selectedRows;
|
||||
},
|
||||
onClearSelected() {
|
||||
this.selectedRowKeys = [];
|
||||
this.selectionRows = [];
|
||||
},
|
||||
handleDelete: function (record) {
|
||||
this.dataSource2.splice(this.dataSource2.indexOf(record), 1);
|
||||
},
|
||||
handleTableChange(pagination, filters, sorter) {
|
||||
//分页、排序、筛选变化时触发
|
||||
console.log(sorter);
|
||||
//TODO 筛选
|
||||
if (Object.keys(sorter).length > 0) {
|
||||
this.isorter.column = sorter.field;
|
||||
this.isorter.order = "ascend" == sorter.order ? "asc" : "desc"
|
||||
}
|
||||
this.ipagination = pagination;
|
||||
this.loadData();
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.loadData()
|
||||
},
|
||||
methods: {
|
||||
searchQuery() {
|
||||
this.loadData(1)
|
||||
},
|
||||
searchReset() {
|
||||
this.queryParam = {}
|
||||
this.loadData(1)
|
||||
},
|
||||
handleCancel() {
|
||||
this.visible = false
|
||||
},
|
||||
handleOk() {
|
||||
this.dataSource2 = this.selectedRowKeys
|
||||
console.log('data:' + this.dataSource2)
|
||||
this.$emit('selectFinished', this.dataSource2)
|
||||
this.visible = false
|
||||
},
|
||||
add() {
|
||||
this.visible = true
|
||||
},
|
||||
loadData(arg) {
|
||||
//加载数据 若传入参数1则加载第一页的内容
|
||||
if (arg === 1) {
|
||||
this.ipagination.current = 1
|
||||
}
|
||||
var params = this.getQueryParams() //查询条件
|
||||
getAction(this.url.list, params).then((res) => {
|
||||
if (res.success) {
|
||||
this.dataSource1 = res.result.records
|
||||
this.ipagination.total = res.result.total
|
||||
}
|
||||
})
|
||||
},
|
||||
getQueryParams() {
|
||||
var param = Object.assign({}, this.queryParam, this.isorter)
|
||||
param.field = this.getQueryField()
|
||||
param.pageNo = this.ipagination.current
|
||||
param.pageSize = this.ipagination.pageSize
|
||||
return filterObj(param)
|
||||
},
|
||||
getQueryField() {
|
||||
//TODO 字段权限控制
|
||||
},
|
||||
onSelectAll(selected, selectedRows, changeRows) {
|
||||
if (selected === true) {
|
||||
for (var a = 0; a < changeRows.length; a++) {
|
||||
this.dataSource2.push(changeRows[a])
|
||||
}
|
||||
} else {
|
||||
for (var b = 0; b < changeRows.length; b++) {
|
||||
this.dataSource2.splice(this.dataSource2.indexOf(changeRows[b]), 1)
|
||||
}
|
||||
}
|
||||
// console.log(selected, selectedRows, changeRows);
|
||||
},
|
||||
onSelect(record, selected) {
|
||||
if (selected === true) {
|
||||
this.dataSource2.push(record)
|
||||
} else {
|
||||
var index = this.dataSource2.indexOf(record)
|
||||
//console.log();
|
||||
if (index >= 0) {
|
||||
this.dataSource2.splice(this.dataSource2.indexOf(record), 1)
|
||||
}
|
||||
}
|
||||
},
|
||||
onSelectChange(selectedRowKeys, selectedRows) {
|
||||
this.selectedRowKeys = selectedRowKeys
|
||||
this.selectionRows = selectedRows
|
||||
},
|
||||
onClearSelected() {
|
||||
this.selectedRowKeys = []
|
||||
this.selectionRows = []
|
||||
},
|
||||
handleDelete: function (record) {
|
||||
this.dataSource2.splice(this.dataSource2.indexOf(record), 1)
|
||||
},
|
||||
handleTableChange(pagination, filters, sorter) {
|
||||
//分页、排序、筛选变化时触发
|
||||
console.log(sorter)
|
||||
//TODO 筛选
|
||||
if (Object.keys(sorter).length > 0) {
|
||||
this.isorter.column = sorter.field
|
||||
this.isorter.order = 'ascend' == sorter.order ? 'asc' : 'desc'
|
||||
}
|
||||
this.ipagination = pagination
|
||||
this.loadData()
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.ant-card-body .table-operator {
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
.ant-card-body .table-operator {
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
.ant-table-tbody .ant-table-row td {
|
||||
padding-top: 15px;
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
.ant-table-tbody .ant-table-row td {
|
||||
padding-top: 15px;
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
|
||||
.anty-row-operator button {
|
||||
margin: 0 5px
|
||||
}
|
||||
.anty-row-operator button {
|
||||
margin: 0 5px;
|
||||
}
|
||||
|
||||
.ant-btn-danger {
|
||||
background-color: #ffffff
|
||||
}
|
||||
.ant-btn-danger {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp {
|
||||
height: 100%
|
||||
}
|
||||
.ant-modal-cust-warp {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp .ant-modal-body {
|
||||
height: calc(100% - 110px) !important;
|
||||
overflow-y: auto
|
||||
}
|
||||
.ant-modal-cust-warp .ant-modal-body {
|
||||
height: calc(100% - 110px) !important;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp .ant-modal-content {
|
||||
height: 90% !important;
|
||||
overflow-y: hidden
|
||||
}
|
||||
.ant-modal-cust-warp .ant-modal-content {
|
||||
height: 90% !important;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
</style>
|
Loading…
Reference in New Issue
Block a user