houzhongjian
2024-07-23 8501060c4f921d1e744c477e4dc08eb47b52693c
提交 | 用户 | 时间
850106 1 <template>
H 2   <el-card shadow="never" class="aui-card--fill">
3     <div class="mod-kio">
4       <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
5         <el-form-item>
6           <el-input v-model="dataForm.instanceName" placeholder="实例名称" clearable></el-input>
7         </el-form-item>
8         <el-form-item>
9           <el-button @click="getDataList()">{{ $t("query") }}</el-button>
10         </el-form-item>
11         <el-form-item>
12           <el-button v-hasPermi="['configinfo:kingio:add']" type="primary" @click="addOrUpdateHandle()">新增
13           </el-button>
14         </el-form-item>
15       </el-form>
16       <el-table v-loading="dataListLoading" :data="dataList" border
17                 @selection-change="dataListSelectionChangeHandle"
18                 @sort-change="dataListSortChangeHandle"
19                 style="width: 100%;">>
20         <el-table-column prop="instanceName" label="实例名称" header-align="center" align="center"></el-table-column>
21         <el-table-column prop="address" label="IP地址" header-align="center" align="center"></el-table-column>
22         <el-table-column prop="port" label="端口" header-align="center" align="center"></el-table-column>
23         <el-table-column prop="username" label="用户名" header-align="center" align="center"></el-table-column>
24         <el-table-column prop="password" label="密码" header-align="center" align="center"></el-table-column>
25         <el-table-column :label="$t('handle')" fixed="right" header-align="center" align="center" width="160">
26           <template slot-scope="scope">
27             <el-button v-hasPermi="['configinfo:kingio:update']" type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">{{ $t("update") }}
28             </el-button>
29             <el-button v-hasPermi="['configinfo:kingio:delete']" type="text" size="small" @click="deleteHandle(scope.row.id)">{{ $t("delete") }}
30             </el-button>
31             <el-button v-hasPermi="['configinfo:kingio:tag']" type="text" size="small" @click="tagItemHandle(scope.row.instanceName)">Tag
32             </el-button>
33           </template>
34         </el-table-column>
35       </el-table>
36       <el-pagination
37         :current-page="page"
38         :page-sizes="[10, 20, 50, 100]"
39         :page-size="limit"
40         :total="total"
41         layout="total, sizes, prev, pager, next, jumper"
42         @size-change="pageSizeChangeHandle"
43         @current-change="pageCurrentChangeHandle">
44       </el-pagination>
45       <!-- 弹窗, 新增 / 修改 -->
46       <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
47       <!-- 弹窗, tag -->
48       <tag-item v-if="tagItemVisible" ref="tagItem" @refreshDataList="getDataList"></tag-item>
49     </div>
50   </el-card>
51 </template>
52 <script>
53
54   import mixinViewModule from '@/mixins/view-module'
55   import AddOrUpdate from "./kingio-add-or-update"
56   import TagItem from "./kingio-tag"
57   export default {
58     mixins: [mixinViewModule],
59     data() {
60       return {
61         mixinViewModuleOptions: {
62           getDataListURL: '/data/channel/kio/device/page',
63           getDataListIsPage: true,
64           deleteURL: '/data/channel/kio/device',
65           deleteIsBatch: true
66         },
67         tagItemVisible: false,
68       };
69     },
70
71     components: {
72       AddOrUpdate,
73       TagItem,
74     },
75     methods: {
76       //  tag方法
77       tagItemHandle(instanceName) {
78         this.tagItemVisible = true;
79         this.$nextTick(() => {
80           this.$refs.tagItem.init(instanceName);
81         });
82       }
83     },
84   };
85 </script>