This commit is contained in:
orgin 2023-11-01 14:48:03 +08:00
commit 287e042d87
20 changed files with 2096 additions and 2093 deletions

View File

@ -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>

View File

@ -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

View File

@ -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;

View File

@ -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>

View File

@ -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>

View File

@ -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>

View File

@ -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

View File

@ -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">

View File

@ -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

View File

@ -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>

View File

@ -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'),

View File

@ -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>

View File

@ -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>

View File

@ -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>

View File

@ -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>

View File

@ -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------forJT-27 -
getAction("/sys/dictItem/dictItemCheck",param).then((res)=>{
if(res.success){
callback()
}else{
callback(res.message);
}
});
//update--end--autor:lvdandan-----date:20201203------forJT-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------forJT-27 -
getAction('/sys/dictItem/dictItemCheck', param).then((res) => {
if (res.success) {
callback()
} else {
callback(res.message)
}
})
//update--end--autor:lvdandan-----date:20201203------forJT-27 -
}
} else {
callback()
}
},
},
}
</script>

View File

@ -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>

View File

@ -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>

View File

@ -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>