Skip to content

bdc / bdcjg-web

Go to a project
Toggle navigation
Toggle navigation pinning
0c17b529 by 任超
Options

feat:接入区域管理

1 parent 14e5aa23
Inline Side-by-side
Showing 3 changed files with 129 additions and 16 deletions
1 <template> 1 <template>
2 <!-- 监控日志 -->
2 <div class="jktjDetail form-clues"> 3 <div class="jktjDetail form-clues">
4 <!-- 头部搜索 -->
3 <el-form ref="form" :model="form" :inline="true" class="from-clues-header" label-width="100px"> 5 <el-form ref="form" :model="form" :inline="true" class="from-clues-header" label-width="100px">
4 <el-row> 6 <el-row>
5 <el-col :span="6"> 7 <el-col :span="6">
...@@ -15,24 +17,23 @@ ...@@ -15,24 +17,23 @@
15 </el-date-picker> 17 </el-date-picker>
16 </el-form-item> 18 </el-form-item>
17 </el-col> 19 </el-col>
18 20 <!-- 按钮操作 -->
19 <el-col :span="12" class="btnColRight"> 21 <el-col :span="12" class="btnColRight">
20 <el-button type="default" @click="resetForm"> 重置 </el-button> 22 <el-button type="default" @click="resetForm"> 重置 </el-button>
21 <el-button type="primary"> 查询 </el-button> 23 <el-button type="primary"> 查询 </el-button>
22 </el-col> 24 </el-col>
23 </el-row> 25 </el-row>
24 </el-form> 26 </el-form>
25 <div class="form-clues-content"> 27 <!-- 表格 -->
26 <div class="echarts-box"> 28 <div class="form-clues-content echarts-box">
27 <div id="myChart" class="chart"></div> 29 <div id="myChart" class="chart"></div>
28 </div>
29 </div> 30 </div>
30 </div> 31 </div>
31 </template> 32 </template>
32 33
33 <script> 34 <script>
34 export default { 35 export default {
35 name: "jktjDetail", 36 name: "jktj",
36 data () { 37 data () {
37 return { 38 return {
38 // 开始结束日期限制 39 // 开始结束日期限制
...@@ -55,6 +56,7 @@ export default { ...@@ -55,6 +56,7 @@ export default {
55 } 56 }
56 } 57 }
57 }, 58 },
59 // 搜索表单
58 form: { 60 form: {
59 startTime: "", 61 startTime: "",
60 endTime: "" 62 endTime: ""
...@@ -62,9 +64,11 @@ export default { ...@@ -62,9 +64,11 @@ export default {
62 } 64 }
63 }, 65 },
64 mounted () { 66 mounted () {
67 // 初始化图表
65 this.echartInit(); 68 this.echartInit();
66 }, 69 },
67 methods: { 70 methods: {
71 // 重置
68 resetForm () { 72 resetForm () {
69 this.form = { 73 this.form = {
70 startTime: "", 74 startTime: "",
......
1 <template>
2 <!-- 编辑 -->
3 <dialogBox :title="title" @closeDialog="closeDialog" @submitForm="handleSubmit" v-model="myValue">
4 <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="120px">
5 <el-row>
6 <el-col :span="6">
7 <el-form-item label="接入点代码" prop="jrddm">
8 <el-input v-model="ruleForm.jrddm" placeholder="接入点代码"></el-input>
9 </el-form-item>
10 </el-col>
11 <el-col :span="6">
12 <el-form-item label="接入点名称" prop="jrdmc">
13 <el-input v-model="ruleForm.jrdmc" placeholder="接入点名称"></el-input>
14 </el-form-item>
15 </el-col>
16 <el-col :span="6">
17 <el-form-item label="队列名称" prop="dlmc">
18 <el-input v-model="ruleForm.dlmc" placeholder="队列名称"></el-input>
19 </el-form-item>
20 </el-col>
21 <el-col :span="6">
22 <el-form-item label="ip地址" prop="ip">
23 <el-input v-model="ruleForm.ip" placeholder="ip地址"></el-input>
24 </el-form-item>
25 </el-col>
26 </el-row>
27 <el-row>
28 <el-col :span="6">
29 <el-form-item label="负责人" prop="fzr">
30 <el-input v-model="ruleForm.fzr" placeholder="负责人"></el-input>
31 </el-form-item>
32 </el-col>
33 </el-row>
34 </el-form>
35 </dialogBox>
36 </template>
37
38 <script>
39 export default {
40 props: {
41 value: { type: Boolean, default: false },
42 title: { type: String, default: '详情' }
43 },
44 data () {
45 return {
46 myValue: this.value,
47 ruleForm: {
48 jrddm: '',
49 jrdmc: '',
50 dlmc: '',
51 ywmc: '',
52 czsj: ''
53 },
54 rules: {
55 jrddm: [
56 { required: true, message: '接入点代码', trigger: 'blur' }
57 ],
58 jrdmc: [
59 { required: true, message: '行政区名称', trigger: 'blur' }
60 ],
61 dlmc: [
62 { required: true, message: '队列名称', trigger: 'blur' }
63 ],
64 ip: [
65 { required: true, message: 'ip地址', trigger: 'blur' }
66 ],
67 fzr: [
68 { required: true, message: '负责人', trigger: 'blur' }
69 ],
70 }
71 }
72 },
73 watch: {
74 value (val) {
75 this.myValue = val
76 }
77 },
78 methods: {
79 closeDialog () {
80 this.$emit('input', false)
81 },
82 handleSubmit () {
83 this.$emit('input', false)
84 }
85 }
86 }
87 </script>
...\ No newline at end of file ...\ No newline at end of file
1 <template> 1 <template>
2 <div class="reportLog from-clues"> 2 <!-- 接入区域管理 -->
3 <div class="from-clues">
4 <!-- 头部搜索 -->
3 <div class="from-clues-header"> 5 <div class="from-clues-header">
4 <el-form ref="ruleForm" :model="form" label-width="100px"> 6 <el-form ref="ruleForm" :model="form" label-width="100px">
5 <el-row> 7 <el-row>
...@@ -16,39 +18,54 @@ ...@@ -16,39 +18,54 @@
16 </el-select> 18 </el-select>
17 </el-form-item> 19 </el-form-item>
18 </el-col> 20 </el-col>
19 21 <!-- 操作按钮 -->
20 <el-col :span="12" class="btnColRight"> 22 <el-col :span="12" class="btnColRight">
21 <el-form-item> 23 <el-form-item>
22 <el-button type="danger">删除</el-button> 24 <el-button type="primary">删除</el-button>
23 <el-button @click="resetForm('ruleForm')">重置</el-button> 25 <el-button @click="resetForm('ruleForm')">重置</el-button>
26 <el-button type="primary">新增</el-button>
24 <el-button type="primary" @click="handleSubmit">查询结果</el-button> 27 <el-button type="primary" @click="handleSubmit">查询结果</el-button>
25 </el-form-item> 28 </el-form-item>
26 </el-col> 29 </el-col>
27 </el-row> 30 </el-row>
28 </el-form> 31 </el-form>
29 </div> 32 </div>
33 <!-- 列表数据 -->
30 <div class="from-clues-content"> 34 <div class="from-clues-content">
31 <lb-table ref="table" @selection-change="handleSelectionChange" :page-size="pageData.size" 35 <lb-table ref="table" @selection-change="handleSelectionChange" :page-size="pageData.size"
32 :current-page.sync="pageData.current" :total="pageData.total" @size-change="handleSizeChange" 36 :current-page.sync="pageData.current" :total="pageData.total" @size-change="handleSizeChange"
33 @p-current-change="handleCurrentChange" :column="tableData.columns" :data="tableData.data"> 37 @p-current-change="handleCurrentChange" :column="tableData.columns" :data="tableData.data">
34 </lb-table> 38 </lb-table>
35 </div> 39 </div>
40 <!-- 修改弹框 -->
41 <detailDialog v-model="isShow" />
36 </div> 42 </div>
37 </template> 43 </template>
38
39 <script> 44 <script>
45 // 接入区域管理
46 // 引入table数据
40 import data from "./data" 47 import data from "./data"
48 // 引入混入方法
41 import tableMixin from '@/mixins/tableMixin.js' 49 import tableMixin from '@/mixins/tableMixin.js'
50 // 引入修改弹框
51 import detailDialog from './components/detailDialog'
42 export default { 52 export default {
43 name: "reportLog", 53 name: "jrqygl",
44 mixins: [tableMixin], 54 mixins: [tableMixin],
55 // 注册组件
56 components: {
57 detailDialog
58 },
45 data () { 59 data () {
46 return { 60 return {
61 isShow: false,
62 // 搜索表单
47 form: { 63 form: {
48 fzr: '', 64 fzr: '',
49 jrdmc: '', 65 jrdmc: '',
50 currentPage: 1 66 currentPage: 1
51 }, 67 },
68 // 表单校验
52 rules: { 69 rules: {
53 fzr: [ 70 fzr: [
54 { required: true, message: '负责人', trigger: 'change' } 71 { required: true, message: '负责人', trigger: 'change' }
...@@ -57,7 +74,9 @@ export default { ...@@ -57,7 +74,9 @@ export default {
57 { required: true, message: '接入点名称', trigger: 'change' } 74 { required: true, message: '接入点名称', trigger: 'change' }
58 ] 75 ]
59 }, 76 },
77 // 列表数据
60 tableData: { 78 tableData: {
79 // 列表头部
61 columns: data.columns().concat([ 80 columns: data.columns().concat([
62 { 81 {
63 label: "操作", 82 label: "操作",
...@@ -68,8 +87,6 @@ export default { ...@@ -68,8 +87,6 @@ export default {
68 <el-button 87 <el-button
69 type="text" 88 type="text"
70 size="mini" 89 size="mini"
71 icon="el-icon-edit"
72 style="margin-left: 10px"
73 onClick={() => { this.handleEdit(scope.row) }} 90 onClick={() => { this.handleEdit(scope.row) }}
74 > 91 >
75 修改 92 修改
...@@ -79,25 +96,30 @@ export default { ...@@ -79,25 +96,30 @@ export default {
79 } 96 }
80 } 97 }
81 ]), 98 ]),
99 // 列表数据
82 data: [{}] 100 data: [{}]
83 }, 101 },
102 // 分页
84 pageData: { 103 pageData: {
85 total: 0, 104 total: 0,
86 pageSize: 15, 105 pageSize: 15,
87 }, 106 }
88 } 107 }
89 }, 108 },
90 methods: { 109 methods: {
110 // 多选
91 handleSelectionChange (val) { 111 handleSelectionChange (val) {
92
93 }, 112 },
113 // 重置表单
94 resetForm () { 114 resetForm () {
95 this.$refs.ruleForm.resetFields(); 115 this.$refs.ruleForm.resetFields();
96 }, 116 },
117 // 初始化数据
97 async featchData () { 118 async featchData () {
98 }, 119 },
120 // 修改
99 handleEdit (row) { 121 handleEdit (row) {
100 122 this.isShow = true
101 } 123 }
102 } 124 }
103 } 125 }
......