<template> <div class="eibs-tab"> <c-col :span="12" class="col-left"> <c-col :span="24"> <el-form-item label="交易配置信息代码" prop="cod"> <c-input v-model="model.cod" placeholder="请输入交易配置信息代码" style="width: 100%"> </c-input> </el-form-item> </c-col> </c-col> <!------------- 右 ----------> <c-col :span="12" class="col-right"> <c-col :span="24"> <el-form-item label="代码描述" prop="cod"> <c-input v-model="model.cod" placeholder="请输入代码描述" style="width: 100%"> </c-input> </el-form-item> </c-col> </c-col> <c-col :span="24"> <c-col :span="12" style="text-align: left"> <el-button type="primary" size="small" @click="atpAdd">新增</el-button> </c-col> <c-col :span="12" style="text-align: right"> <el-button size="small" @click="handleReset">重置</el-button> <el-button type="primary" icon="el-icon-search" size="small" @click="onInfatpSearch()" >查询 </el-button> </c-col> </c-col> <c-col :span="24"> <c-paging-table :data="atpData" :columns="atpColumns" :pageNumber="model.pageNum" :pageSize="model.pageSize" :total="model.total" v-on:queryFunc="queryFunc" :border="true" > <c-table-column fixed="right" prop="op" label="操作" width="240px"> <template slot-scope="{ scope }"> <c-button style="margin-left: 0" size="small" @click="atpInfo(scope.$index, scope.row)" >详情</c-button > <c-button style="margin-left: 5px" size="small" type="primary" @click="atpEdit(scope.$index, scope.row)" >修改</c-button > <c-button size="small" style="margin-left: 5px" @click="atpDelete(scope.$index, scope.row)" >删除</c-button > <el-popover placement="top-start" width="50" trigger="click"> <ul class="table-button-item-list"> <li> <c-button size="small" style="margin-left: 0">指派</c-button> </li> <li> <c-button size="small" style="margin-left: 0">删除</c-button> </li> </ul> <a slot="reference" href="javascript:void(0)" style="margin-left: 5px" > <i class="el-icon-more"></i> </a> </el-popover> </template> </c-table-column> </c-paging-table> </c-col> </div> </template> <script> import codes from "~/config/CodeTable"; import { queryByPage } from "~/service/test/atp.js"; export default { name: "", props: ["model"], inject: ["root"], data() { return { atpData: [], atpColumns: [ { label: '交易配置信息代码', prop: 'cod', width: '240' }, { label: '描述', prop: 'cod', width: '600' }, ], }; }, computed: { }, activated() { const { update } = this.$route.params if (update) { this.onInfatpSearch() } }, methods: { handleReset() { this.root.$refs.modelForm.resetFields(); }, onInfatpSearch() { queryByPage(this.model).then(res => { /** * pageNumber: 0 * pageSize: 0 * total: 69 * totalPage: 0 */ const list = res.list this.atpData = list this.model.pageNum = res.pageNumber this.model.pageSize = res.pageSize this.model.total = res.total }) }, queryFunc(pageNumber, pageSize) { this.model.pageNum = pageNumber this.model.pageSize = pageSize this.onInfatpSearch() }, atptypeChange(val) { this.model.fectyp = val; }, atpCodesByKey(key) { return codes[key] ?? []; }, atpAdd() { this.$router.push(`/statics/dbaatp`) }, atpInfo(index, row) { this.$router.push(`/statics/dbiatp/${row.inr}`) }, atpEdit(index, row) { this.$router.push(`/statics/dbeatp/${row.inr}`) }, atpDelete(index, row) { this.$router.push(`/statics/dbdatp/${row.inr}`) }, }, }; </script> <style scoped> .table-button-item-list { padding: 0; margin: 0; } .table-button-item-list li { list-style: none; padding: 5px 0; text-align: center; color: #606266; cursor: pointer; }</style>