|
@@ -1,12 +1,6 @@
|
|
|
<template>
|
|
|
<div class="Box">
|
|
|
- <el-form
|
|
|
- :model="FormData"
|
|
|
- :rules="rules"
|
|
|
- ref="ruleForm"
|
|
|
- label-width="100px"
|
|
|
- class="demo-ruleForm"
|
|
|
- >
|
|
|
+ <el-form :model="FormData" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
|
|
|
<div class="topBox">
|
|
|
<div class="titleBtn">
|
|
|
<span class="titleStyle">策略信息编辑 </span>
|
|
@@ -18,51 +12,26 @@
|
|
|
<div class="fristLine">
|
|
|
<div class="inputBox">
|
|
|
<el-form-item label="策略名称" prop="TacName">
|
|
|
- <el-input
|
|
|
- placeholder="请输入"
|
|
|
- v-model.trim="FormData.TacName"
|
|
|
- ></el-input>
|
|
|
+ <el-input placeholder="请输入" v-model.trim="FormData.TacName"></el-input>
|
|
|
</el-form-item>
|
|
|
</div>
|
|
|
<div class="inputBox">
|
|
|
<el-form-item label="IP类型" prop="IpType">
|
|
|
<el-select v-model="FormData.IpType" placeholder="请选择类型">
|
|
|
- <el-option
|
|
|
- v-for="item in options"
|
|
|
- :key="item.value"
|
|
|
- :label="item.label"
|
|
|
- :value="item.value"
|
|
|
- >
|
|
|
+ <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
</div>
|
|
|
<div class="block inputBox1">
|
|
|
<el-form-item label="登录日期" prop="Date">
|
|
|
- <el-date-picker
|
|
|
- v-model="FormData.Date"
|
|
|
- type="daterange"
|
|
|
- range-separator="至"
|
|
|
- start-placeholder="开始日期"
|
|
|
- end-placeholder="结束日期"
|
|
|
- @change="dataChange"
|
|
|
- value-format="yyyy-MM-dd"
|
|
|
- >
|
|
|
+ <el-date-picker v-model="FormData.Date" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" @change="dataChange" value-format="yyyy-MM-dd">
|
|
|
</el-date-picker>
|
|
|
</el-form-item>
|
|
|
</div>
|
|
|
<div class="block inputBox1">
|
|
|
<el-form-item label="登录时间" prop="Time">
|
|
|
- <el-time-picker
|
|
|
- is-range
|
|
|
- v-model="FormData.Time"
|
|
|
- range-separator="至"
|
|
|
- start-placeholder="开始时间"
|
|
|
- end-placeholder="结束时间"
|
|
|
- placeholder="选择时间范围"
|
|
|
- @change="timeChange"
|
|
|
- value-format="HH:mm:ss"
|
|
|
- >
|
|
|
+ <el-time-picker is-range v-model="FormData.Time" range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间" placeholder="选择时间范围" @change="timeChange" value-format="HH:mm:ss">
|
|
|
</el-time-picker>
|
|
|
</el-form-item>
|
|
|
</div>
|
|
@@ -71,20 +40,12 @@
|
|
|
<div class="fristLine" style="margin-top: 24px">
|
|
|
<div class="inputBox2">
|
|
|
<el-form-item label="IP段" prop="IpList">
|
|
|
- <el-input
|
|
|
- placeholder="请输入IP,并以‘;’号隔开"
|
|
|
- v-model.trim="FormData.IpList"
|
|
|
- maxlength="256"
|
|
|
- ></el-input>
|
|
|
+ <el-input placeholder="请输入IP,并以‘;’号隔开" v-model.trim="FormData.IpList"></el-input>
|
|
|
</el-form-item>
|
|
|
</div>
|
|
|
<div class="inputBox3">
|
|
|
<el-form-item label="描述" prop="TacDesc">
|
|
|
- <el-input
|
|
|
- placeholder="请输入"
|
|
|
- maxlength="128"
|
|
|
- v-model.trim="FormData.TacDesc"
|
|
|
- ></el-input>
|
|
|
+ <el-input placeholder="请输入" v-model.trim="FormData.TacDesc"></el-input>
|
|
|
</el-form-item>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -97,11 +58,7 @@
|
|
|
</div>
|
|
|
<div class="center-box fpBox">
|
|
|
<el-row class="scCont" :gutter="16">
|
|
|
- <el-col
|
|
|
- :span="4"
|
|
|
- v-for="(item, index) in FormData.UseList"
|
|
|
- :key="index"
|
|
|
- >
|
|
|
+ <el-col :span="4" v-for="(item, index) in FormData.UseList" :key="index">
|
|
|
<el-card class="box-card">
|
|
|
<div class="lineTop"></div>
|
|
|
<div class="text item">
|
|
@@ -109,10 +66,7 @@
|
|
|
<div class="header-mid">
|
|
|
<span class="title">{{ item.UserName }}</span>
|
|
|
</div>
|
|
|
- <el-checkbox-group
|
|
|
- v-model="UncheckList"
|
|
|
- @change="UnchangeChecked(item, index)"
|
|
|
- >
|
|
|
+ <el-checkbox-group v-model="UncheckList" @change="UnchangeChecked(item, index)">
|
|
|
<el-checkbox checked></el-checkbox>
|
|
|
</el-checkbox-group>
|
|
|
</div>
|
|
@@ -120,11 +74,7 @@
|
|
|
</el-card>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
- <el-empty
|
|
|
- v-if="FormData.UseList.length == 0"
|
|
|
- description="没有选取"
|
|
|
- style="margin: 0 auto"
|
|
|
- ></el-empty>
|
|
|
+ <el-empty v-if="FormData.UseList.length == 0" description="没有选取" style="margin: 0 auto"></el-empty>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
@@ -132,22 +82,13 @@
|
|
|
<div class="titleBtn">
|
|
|
<span class="titleStyle">选择职员 </span>
|
|
|
<div class="searchBox">
|
|
|
- <el-input
|
|
|
- placeholder="请输入内容"
|
|
|
- clearable
|
|
|
- @clear="clearData"
|
|
|
- v-model.trim="keyWords"
|
|
|
- ></el-input>
|
|
|
+ <el-input placeholder="请输入内容" clearable @clear="clearData" v-model.trim="keyWords"></el-input>
|
|
|
<el-button @click="queryData()">搜索</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="center-box">
|
|
|
<el-row class="scCont" :gutter="16">
|
|
|
- <el-col
|
|
|
- :span="6"
|
|
|
- v-for="(item, index) in FormData.Unuselist"
|
|
|
- :key="index"
|
|
|
- >
|
|
|
+ <el-col :span="6" v-for="(item, index) in FormData.Unuselist" :key="index">
|
|
|
<el-card class="box-card">
|
|
|
<div class="lineTop"></div>
|
|
|
<div class="text item">
|
|
@@ -157,10 +98,7 @@
|
|
|
item.UserName
|
|
|
}}</span>
|
|
|
</div>
|
|
|
- <el-checkbox-group
|
|
|
- v-model="checkList"
|
|
|
- @change="changeChecked(item, index)"
|
|
|
- >
|
|
|
+ <el-checkbox-group v-model="checkList" @change="changeChecked(item, index)">
|
|
|
<el-checkbox></el-checkbox>
|
|
|
</el-checkbox-group>
|
|
|
</div>
|
|
@@ -168,11 +106,7 @@
|
|
|
</el-card>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
- <el-empty
|
|
|
- v-if="FormData.Unuselist.length == 0"
|
|
|
- description="没有内容"
|
|
|
- style="margin: 0 auto"
|
|
|
- ></el-empty>
|
|
|
+ <el-empty v-if="FormData.Unuselist.length == 0" description="没有内容" style="margin: 0 auto"></el-empty>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -182,13 +116,7 @@
|
|
|
<div class="title1">删除策略</div>
|
|
|
<div class="content">是否确认删除该策略?</div>
|
|
|
<div class="foot right t30">
|
|
|
- <el-button
|
|
|
- size="medium"
|
|
|
- @click="remove(item, index)"
|
|
|
- type="danger"
|
|
|
- class="r24"
|
|
|
- >删除</el-button
|
|
|
- >
|
|
|
+ <el-button size="medium" @click="remove(item, index)" type="danger" class="r24">删除</el-button>
|
|
|
<el-button size="medium" @click="flag = false">取消</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -202,7 +130,7 @@ import Dialog from "@/layout/components/Dialog";
|
|
|
import { findarrays } from "@/utils/validate";
|
|
|
import { lengthValidator } from "@/utils/validate";
|
|
|
export default {
|
|
|
- data() {
|
|
|
+ data () {
|
|
|
return {
|
|
|
flag: false,
|
|
|
checkList: false,
|
|
@@ -259,6 +187,14 @@ export default {
|
|
|
trigger: ["change", "blur"],
|
|
|
},
|
|
|
],
|
|
|
+ IpList: [
|
|
|
+ {
|
|
|
+ validator: lengthValidator,
|
|
|
+ max: 256,
|
|
|
+ message: "长度在 1 到 256 个字符",
|
|
|
+ trigger: ["change", "blur"],
|
|
|
+ }
|
|
|
+ ]
|
|
|
},
|
|
|
editId: null,
|
|
|
};
|
|
@@ -269,14 +205,14 @@ export default {
|
|
|
},
|
|
|
components: { Dialog },
|
|
|
watch: {
|
|
|
- keyWords() {
|
|
|
+ keyWords () {
|
|
|
if (this.keyWords.length == 0) {
|
|
|
this.getDetial(this.editId);
|
|
|
}
|
|
|
},
|
|
|
},
|
|
|
methods: {
|
|
|
- queryData() {
|
|
|
+ queryData () {
|
|
|
this.keyWords = this.keyWords.replace(/\s+/g, "");
|
|
|
const search = this.keyWords;
|
|
|
if (search) {
|
|
@@ -300,7 +236,7 @@ export default {
|
|
|
/^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/;
|
|
|
return reg.test(ip);
|
|
|
},
|
|
|
- save() {
|
|
|
+ save () {
|
|
|
let that = this;
|
|
|
let ipArr = [];
|
|
|
if (this.FormData.IpList) {
|
|
@@ -356,7 +292,7 @@ export default {
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
- getDetial(id) {
|
|
|
+ getDetial (id) {
|
|
|
let that = this;
|
|
|
return new Promise((resolve, reject) => {
|
|
|
GetTacDetails({ TacId: id })
|
|
@@ -386,12 +322,12 @@ export default {
|
|
|
});
|
|
|
});
|
|
|
},
|
|
|
- changeChecked(val, index) {
|
|
|
+ changeChecked (val, index) {
|
|
|
this.checkList = false;
|
|
|
this.FormData.UseList.push(val);
|
|
|
this.FormData.Unuselist.splice(index, 1);
|
|
|
},
|
|
|
- UnchangeChecked(val, index) {
|
|
|
+ UnchangeChecked (val, index) {
|
|
|
this.UncheckList = true;
|
|
|
this.FormData.Unuselist.push(val);
|
|
|
this.FormData.UseList.splice(index, 1);
|
|
@@ -409,7 +345,7 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
//删除
|
|
|
- remove() {
|
|
|
+ remove () {
|
|
|
let that = this;
|
|
|
return new Promise((resolve, reject) => {
|
|
|
DeleteTac({ TacId: this.FormData.TacId })
|
|
@@ -429,7 +365,7 @@ export default {
|
|
|
});
|
|
|
});
|
|
|
},
|
|
|
- clearData() {
|
|
|
+ clearData () {
|
|
|
this.FormData.Unuselist = this.boxArr;
|
|
|
},
|
|
|
},
|