You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
770 lines
22 KiB
770 lines
22 KiB
2 years ago
|
<template>
|
||
|
<div>
|
||
|
<div class="table-header table-div">
|
||
|
<ListLayout :table-columns="tableColumns">
|
||
|
<div slot="search" ref="searchHeight" style="margin-top: 5px">
|
||
|
<!--这里放顶部搜索-->
|
||
|
<!-- 搜索部分开始 -->
|
||
|
<el-form
|
||
|
label-width="90px"
|
||
|
:inline="true"
|
||
|
:model="page"
|
||
|
class="search-form"
|
||
|
:size="$store.getters.size"
|
||
|
>
|
||
|
<el-form-item>
|
||
|
<!-- <el-input v-model="page.params.companyId" placeholder="公司" clearable @keyup.enter.native="getByPage" /> -->
|
||
|
<el-select
|
||
|
v-model="page.params.companyId"
|
||
|
clearable
|
||
|
filterable
|
||
|
remote
|
||
|
reserve-keyword
|
||
|
placeholder="企业名称"
|
||
|
:remote-method="companyRemoteMethod"
|
||
|
@keyup.enter.native="getByPage"
|
||
|
>
|
||
|
<el-option
|
||
|
v-for="item in queryCompanyList"
|
||
|
:key="item.id"
|
||
|
:label="item.name"
|
||
|
:value="item.id"
|
||
|
/>
|
||
|
</el-select>
|
||
|
</el-form-item>
|
||
|
<el-form-item>
|
||
|
<el-select
|
||
|
v-model="page.params.matchMark"
|
||
|
placeholder="匹配方式"
|
||
|
clearable
|
||
|
>
|
||
|
<el-option value="MATCH_DAY" label="按日匹配" />
|
||
|
<!-- <el-option value="MATCH_MONTH" label="按月匹配" />
|
||
|
<el-option value="MATCH_AMOUNT" label="按金额匹配" /> -->
|
||
|
</el-select>
|
||
|
</el-form-item>
|
||
|
<el-form-item>
|
||
|
<el-select
|
||
|
v-model="page.params.enableMark"
|
||
|
placeholder="启用标识"
|
||
|
clearable
|
||
|
>
|
||
|
<el-option value="1" label="启用" />
|
||
|
<el-option value="0" label="禁用" />
|
||
|
</el-select>
|
||
|
</el-form-item>
|
||
|
<el-form-item>
|
||
|
<el-select
|
||
|
v-model="page.params.overMark"
|
||
|
placeholder="结束标识"
|
||
|
clearable
|
||
|
>
|
||
|
<el-option value="0" label="匹配开始" />
|
||
|
<el-option value="1" label="匹配完成" />
|
||
|
<el-option value="2" label="匹配停止" />
|
||
|
</el-select>
|
||
|
</el-form-item>
|
||
|
</el-form>
|
||
|
<!-- 搜索部分结束 -->
|
||
|
</div>
|
||
|
<el-row slot="button-group" style="margin-top: 5px">
|
||
|
<el-col :span="16" class="tal">
|
||
|
<el-button
|
||
|
class="group-item"
|
||
|
:size="$store.getters.size"
|
||
|
type="primary"
|
||
|
@click="toAdd"
|
||
|
><svg-icon icon-class="iconxinzeng" /> 添加</el-button
|
||
|
>
|
||
|
</el-col>
|
||
|
<el-col :span="8">
|
||
|
<el-button
|
||
|
type="primary"
|
||
|
:size="$store.getters.size"
|
||
|
icon="el-icon-search"
|
||
|
@click="search"
|
||
|
>查询</el-button
|
||
|
>
|
||
|
<el-button
|
||
|
type="info"
|
||
|
:size="$store.getters.size"
|
||
|
icon="el-icon-refresh"
|
||
|
@click="page.params = {}"
|
||
|
>重置</el-button
|
||
|
>
|
||
|
</el-col>
|
||
|
</el-row>
|
||
|
|
||
|
<div slot="table">
|
||
|
<!--这里放表格和分页-->
|
||
|
<!-- 列表开始 -->
|
||
|
<el-table
|
||
|
:max-height="tableHeight"
|
||
|
:data="dataPage.list"
|
||
|
fit
|
||
|
style="width: 100%"
|
||
|
:size="$store.getters.size"
|
||
|
@sort-change="sortHandler"
|
||
|
@selection-change="handleSelectionChange"
|
||
|
>
|
||
|
<!-- <el-table-column
|
||
|
type="selection"
|
||
|
width="55"
|
||
|
/>
|
||
|
<el-table-column
|
||
|
label="序号"
|
||
|
type="index"
|
||
|
:index="indexMethod"
|
||
|
/> -->
|
||
|
<template v-for="(item, index) in tableColumns">
|
||
|
<el-table-column
|
||
|
v-if="item.show"
|
||
|
:key="index"
|
||
|
:fixed="item.fixed"
|
||
|
:align="item.align"
|
||
|
:show-overflow-tooltip="true"
|
||
|
:min-width="item.minWidth"
|
||
|
:width="item.width"
|
||
|
:prop="item.prop"
|
||
|
:sortable="item.sortable"
|
||
|
:label="item.label"
|
||
|
:formatter="item.render"
|
||
|
/>
|
||
|
</template>
|
||
|
|
||
|
<el-table-column
|
||
|
fixed="right"
|
||
|
label="操作"
|
||
|
align="center"
|
||
|
width="150px"
|
||
|
>
|
||
|
<template slot-scope="scope">
|
||
|
<el-button
|
||
|
:size="$store.getters.size"
|
||
|
type="text"
|
||
|
@click="handleDetail(scope.row.id)"
|
||
|
><svg-icon icon-class="iconxiangqing1" /> 详情</el-button
|
||
|
>
|
||
|
<el-dropdown>
|
||
|
<el-button type="text">
|
||
|
更多<i class="el-icon-arrow-down el-icon--right" />
|
||
|
</el-button>
|
||
|
<el-dropdown-menu slot="dropdown">
|
||
|
<el-dropdown-item @click.native="toUpdate(scope.row.id)">
|
||
|
<el-button :size="$store.getters.size" type="text"
|
||
|
><svg-icon icon-class="iconicon-" /> 编辑</el-button
|
||
|
>
|
||
|
</el-dropdown-item>
|
||
|
</el-dropdown-menu>
|
||
|
</el-dropdown>
|
||
|
</template>
|
||
|
</el-table-column>
|
||
|
</el-table>
|
||
|
<!-- 列表结束 -->
|
||
|
|
||
|
<!-- 分页组件开始 -->
|
||
|
<div class="page-div">
|
||
|
<el-pagination
|
||
|
:current-page="page.currentPage"
|
||
|
:page-sizes="[10, 15, 20, 30]"
|
||
|
:page-size="page.pageSize"
|
||
|
layout="total, sizes, prev, pager, next, jumper"
|
||
|
:total="page.totalCount"
|
||
|
@size-change="handleSizeChange"
|
||
|
@current-change="handleCurrentChange"
|
||
|
/>
|
||
|
</div>
|
||
|
<!-- 分页组件结束 -->
|
||
|
</div>
|
||
|
</ListLayout>
|
||
|
|
||
|
<!-- 添加弹窗 -->
|
||
|
<el-dialog
|
||
|
v-el-drag-dialog
|
||
|
title="添加"
|
||
|
:visible.sync="addDialog"
|
||
|
width="55%"
|
||
|
>
|
||
|
<OilCompanyMatchAdd @getByPage="getByPage" @closeDialog="closeDialog" />
|
||
|
</el-dialog>
|
||
|
|
||
|
<!-- 导出弹窗 -->
|
||
|
<el-dialog
|
||
|
v-el-drag-dialog
|
||
|
title="导出"
|
||
|
:visible.sync="outPutDialog"
|
||
|
width="55%"
|
||
|
>
|
||
|
<OilCompanyMatchOutput
|
||
|
@getByPage="getByPage"
|
||
|
@closeDialog="closeDialog"
|
||
|
/>
|
||
|
</el-dialog>
|
||
|
|
||
|
<!-- 导入弹窗 -->
|
||
|
<el-dialog
|
||
|
v-el-drag-dialog
|
||
|
title="导入"
|
||
|
:visible.sync="importDialog"
|
||
|
width="55%"
|
||
|
>
|
||
|
<OilCompanyMatchImport
|
||
|
@getByPage="getByPage"
|
||
|
@closeDialog="closeDialog"
|
||
|
/>
|
||
|
</el-dialog>
|
||
|
|
||
|
<!-- 修改弹窗 -->
|
||
|
<el-dialog
|
||
|
v-el-drag-dialog
|
||
|
title="修改"
|
||
|
:visible.sync="updateDialog"
|
||
|
width="55%"
|
||
|
>
|
||
|
<OilCompanyMatchUpdate
|
||
|
v-if="updateDialog"
|
||
|
:oil-company-match="oilCompanyMatch"
|
||
|
@getByPage="getByPage"
|
||
|
@closeDialog="closeDialog"
|
||
|
/>
|
||
|
</el-dialog>
|
||
|
|
||
|
<!-- 详情抽屉 -->
|
||
|
<el-drawer
|
||
|
title="详情"
|
||
|
class="table-detail-drawer"
|
||
|
:visible.sync="showTableDrawer"
|
||
|
size="55%"
|
||
|
direction="ltr"
|
||
|
:withHeader="false"
|
||
|
>
|
||
|
<general-details
|
||
|
title="详情"
|
||
|
isHeader="true"
|
||
|
@close="showTableDrawer=false"
|
||
|
:sourceData="oilCompanyMatch"
|
||
|
:mappingData="mappingData"
|
||
|
v-if="showTableDrawer" >
|
||
|
</general-details>
|
||
|
<!-- <OilCompanyMatchInfo :oil-company-match="oilCompanyMatch" /> -->
|
||
|
</el-drawer>
|
||
|
</div>
|
||
|
</div>
|
||
|
</template>
|
||
|
<script>
|
||
|
import oilCompanyMatchApi from "@/api/finance/oilCompanyMatch";
|
||
|
import OilCompanyMatchAdd from "./OilCompanyMatchAdd";
|
||
|
import OilCompanyMatchUpdate from "./OilCompanyMatchUpdate";
|
||
|
import OilCompanyMatchInfo from "./OilCompanyMatchInfo";
|
||
|
import OilCompanyMatchImport from "./OilCompanyMatchImport";
|
||
|
import OilCompanyMatchOutput from "./OilCompanyMatchOutput";
|
||
|
import oilCompanyInfoApi from "@/api/user/oilCompanyInfo";
|
||
|
import { mapGetters } from "vuex";
|
||
|
export default {
|
||
|
components: {
|
||
|
OilCompanyMatchAdd,
|
||
|
OilCompanyMatchUpdate,
|
||
|
OilCompanyMatchInfo,
|
||
|
OilCompanyMatchImport,
|
||
|
OilCompanyMatchOutput,
|
||
|
},
|
||
|
data() {
|
||
|
return {
|
||
|
mappingData:[
|
||
|
{
|
||
|
carTitle:'基础信息',
|
||
|
carItems:[
|
||
|
{
|
||
|
label:'id主键',
|
||
|
value:'id'
|
||
|
},
|
||
|
{
|
||
|
label:'公司id',
|
||
|
value:'companyId'
|
||
|
},
|
||
|
{
|
||
|
label:'匹配额度',
|
||
|
value:'matchAmount',
|
||
|
remark:'该额度为企业匹配单日额度上限',
|
||
|
},
|
||
|
{
|
||
|
label:'匹配方式',
|
||
|
value:'matchMark',
|
||
|
remark:'MATCH_DAY:按日匹配 MATCH_MONTH:按月匹配 MATCH_AMOUNT:按金额匹配',
|
||
|
},
|
||
|
{
|
||
|
label:'优先级',
|
||
|
value:'matchPriority',
|
||
|
remark:'1-20',
|
||
|
},
|
||
|
{
|
||
|
label:'开始时间',
|
||
|
value:'startTime',
|
||
|
},
|
||
|
{
|
||
|
label:'结束时间',
|
||
|
value:'endTime',
|
||
|
},
|
||
|
{
|
||
|
label:'累计匹配轮数',
|
||
|
value:'matchCount',
|
||
|
},
|
||
|
{
|
||
|
label:'累计匹配金额',
|
||
|
value:'totalAmount',
|
||
|
},
|
||
|
{
|
||
|
label:'乐观锁',
|
||
|
value:'version',
|
||
|
},
|
||
|
{
|
||
|
label:'结束标识',
|
||
|
value:'overMark',
|
||
|
remark:'1:已完成 0:匹配中 2:主动停止',
|
||
|
},
|
||
|
{
|
||
|
label:'结束人',
|
||
|
value:'overUser',
|
||
|
},
|
||
|
{
|
||
|
label:'实际匹配结束时间',
|
||
|
value:'overTime',
|
||
|
},
|
||
|
{
|
||
|
label:'主动结束匹配说明',
|
||
|
value:'overRemark',
|
||
|
},
|
||
|
{
|
||
|
label:'备注说明',
|
||
|
value:'remark',
|
||
|
},
|
||
|
{
|
||
|
label:'启用标识',
|
||
|
remark:'1启用,0禁用,默认1',
|
||
|
value:'enableMark',
|
||
|
},
|
||
|
{
|
||
|
label:'删除标识',
|
||
|
remark:'1删除,0未删除',
|
||
|
value:'deleteMark',
|
||
|
},
|
||
|
{
|
||
|
label:'启用禁用人',
|
||
|
value:'enableUser',
|
||
|
},
|
||
|
{
|
||
|
label:'启用禁用时间',
|
||
|
value:'deleteTime',
|
||
|
},
|
||
|
{
|
||
|
label:'创建人编号',
|
||
|
value:'createUser',
|
||
|
},
|
||
|
{
|
||
|
label:'创建时间',
|
||
|
value:'createTime',
|
||
|
},
|
||
|
{
|
||
|
label:'创建来源',
|
||
|
value:'createSource',
|
||
|
},
|
||
|
{
|
||
|
label:'修改人编号',
|
||
|
value:'updateUser',
|
||
|
},
|
||
|
{
|
||
|
label:'修改时间',
|
||
|
value:'updateTime',
|
||
|
}
|
||
|
]
|
||
|
}
|
||
|
],
|
||
|
multipleSelection: [], // 选择表格数据集合
|
||
|
importDialog: false, // 导入弹窗
|
||
|
outPutDialog: false, // 导出弹窗
|
||
|
showTableDrawer: false,
|
||
|
queryCompanyList: [], // 企业列表
|
||
|
page: {
|
||
|
pageSize: 10, // 每页显示条数
|
||
|
currentPage: 1, // 默认页
|
||
|
params: {}, // 查询参数
|
||
|
sorted: {},
|
||
|
columns: [],
|
||
|
},
|
||
|
tableHeight: 0,
|
||
|
filters: this.$options.filters,
|
||
|
dataPage: {
|
||
|
// 分页显示page
|
||
|
pageSize: 10, // 每页显示条数
|
||
|
currentPage: 1, // 默认页
|
||
|
params: {
|
||
|
// 查询参数
|
||
|
},
|
||
|
sorted: {},
|
||
|
},
|
||
|
tableColumns: [
|
||
|
{
|
||
|
prop: "id",
|
||
|
label: "编号",
|
||
|
show: true,
|
||
|
render: (row, column, cell) => {
|
||
|
return cell;
|
||
|
},
|
||
|
},
|
||
|
{
|
||
|
prop: "companyName",
|
||
|
label: "公司",
|
||
|
show: true,
|
||
|
render: (row, column, cell) => {
|
||
|
return cell;
|
||
|
},
|
||
|
},
|
||
|
{
|
||
|
prop: "matchAmount",
|
||
|
label: "日匹配额度",
|
||
|
show: true,
|
||
|
render: (row, column, cell) => {
|
||
|
return cell;
|
||
|
},
|
||
|
},
|
||
|
{
|
||
|
prop: "matchMark",
|
||
|
label: "匹配方式",
|
||
|
show: true,
|
||
|
render: (row, column, cell) => {
|
||
|
if (cell === "MATCH_DAY") {
|
||
|
return "按日匹配";
|
||
|
}
|
||
|
if (cell === "MATCH_MONTH") {
|
||
|
return "按月匹配";
|
||
|
}
|
||
|
if (cell === "MATCH_AMOUNT") {
|
||
|
return "按金额匹配";
|
||
|
}
|
||
|
return cell;
|
||
|
},
|
||
|
},
|
||
|
// {
|
||
|
// prop: "matchPriority",
|
||
|
// label: "优先级,1-20",
|
||
|
// show: true,
|
||
|
// render: (row, column, cell) => {
|
||
|
// return cell;
|
||
|
// },
|
||
|
// },
|
||
|
{
|
||
|
prop: "startTime",
|
||
|
label: "开始时间",
|
||
|
show: true,
|
||
|
render: (row, column, cell) => {
|
||
|
return cell;
|
||
|
},
|
||
|
},
|
||
|
{
|
||
|
prop: "endTime",
|
||
|
label: "结束时间",
|
||
|
show: true,
|
||
|
render: (row, column, cell) => {
|
||
|
return cell;
|
||
|
},
|
||
|
},
|
||
|
{
|
||
|
prop: "matchCount",
|
||
|
label: "累计匹配轮数",
|
||
|
show: true,
|
||
|
render: (row, column, cell) => {
|
||
|
return cell;
|
||
|
},
|
||
|
},
|
||
|
{
|
||
|
prop: "totalAmount",
|
||
|
label: "累计匹配金额",
|
||
|
show: true,
|
||
|
render: (row, column, cell) => {
|
||
|
return cell;
|
||
|
},
|
||
|
},
|
||
|
// { prop: 'version', label: '乐观锁', show: true, render: (row, column, cell) => {
|
||
|
// return cell
|
||
|
// } },
|
||
|
// { prop: 'overMark', label: '结束标识1:已完成0:匹配中2:主动停止', show: true, render: (row, column, cell) => {
|
||
|
// return cell
|
||
|
// } },
|
||
|
// { prop: 'overUser', label: '结束人', show: true, render: (row, column, cell) => {
|
||
|
// return cell
|
||
|
// } },
|
||
|
// { prop: 'overTime', label: '实际匹配结束时间', show: true, render: (row, column, cell) => {
|
||
|
// return cell
|
||
|
// } },
|
||
|
// { prop: 'overRemark', label: '主动结束匹配说明', show: true, render: (row, column, cell) => {
|
||
|
// return cell
|
||
|
// } },
|
||
|
// { prop: 'remark', label: '备注说明', show: true, render: (row, column, cell) => {
|
||
|
// return cell
|
||
|
// } },
|
||
|
{
|
||
|
prop: "enableMark",
|
||
|
label: "启用标识",
|
||
|
show: true,
|
||
|
render: (row, column, cell) => {
|
||
|
// return cell
|
||
|
return (
|
||
|
<el-switch
|
||
|
v-model={row.enableMark}
|
||
|
active-value={1}
|
||
|
inactive-value={0}
|
||
|
on-change={() => this.globalEnable(row)}
|
||
|
></el-switch>
|
||
|
);
|
||
|
},
|
||
|
},
|
||
|
{
|
||
|
prop: "overMark",
|
||
|
label: "结束标识",
|
||
|
show: true,
|
||
|
render: (row, column, cell) => {
|
||
|
if (cell === 0) {
|
||
|
return "匹配开始";
|
||
|
}
|
||
|
if (cell === 1) {
|
||
|
return "匹配完成";
|
||
|
}
|
||
|
if (cell === 2) {
|
||
|
return "匹配停止";
|
||
|
}
|
||
|
return cell;
|
||
|
},
|
||
|
},
|
||
|
// { prop: 'deleteMark', label: '删除标识,1删除,0未删除', show: true, render: (row, column, cell) => {
|
||
|
// return cell
|
||
|
// } },
|
||
|
// { prop: 'enableUser', label: '启用禁用人', show: true, render: (row, column, cell) => {
|
||
|
// return cell
|
||
|
// } },
|
||
|
// { prop: 'enableTime', label: '启用禁用时间', show: true, render: (row, column, cell) => {
|
||
|
// return cell
|
||
|
// } },
|
||
|
// { prop: 'deleteUser', label: '启用禁用人', show: true, render: (row, column, cell) => {
|
||
|
// return cell
|
||
|
// } }
|
||
|
// { prop: 'deleteTime', label: '启用禁用时间', show: true, render: (row, column, cell) => {
|
||
|
// return cell
|
||
|
// } },
|
||
|
// { prop: 'createUser', label: '创建人编号', show: true, render: (row, column, cell) => {
|
||
|
// return cell
|
||
|
// } },
|
||
|
// { prop: 'createTime', label: '创建时间', show: true, render: (row, column, cell) => {
|
||
|
// return cell
|
||
|
// } },
|
||
|
// { prop: 'createSource', label: '创建来源', show: true, render: (row, column, cell) => {
|
||
|
// return cell
|
||
|
// } },
|
||
|
// { prop: 'updateUser', label: '修改人编号', show: true, render: (row, column, cell) => {
|
||
|
// return cell
|
||
|
// } },
|
||
|
// { prop: 'updateTime', label: '修改时间', show: true, render: (row, column, cell) => {
|
||
|
// return cell
|
||
|
// } },
|
||
|
// { prop: 'updateSource', label: '修改来源', show: true, render: (row, column, cell) => {
|
||
|
// return cell
|
||
|
// } }
|
||
|
],
|
||
|
addDialog: false, // 添加弹窗
|
||
|
updateDialog: false, // 修改弹窗
|
||
|
oilCompanyMatch: {},
|
||
|
};
|
||
|
},
|
||
|
computed: {
|
||
|
...mapGetters(["sysUserList"]),
|
||
|
},
|
||
|
created() {
|
||
|
this.getByPage();
|
||
|
// 增加监听事件,窗口变化时得到高度。
|
||
|
this.getHeight();
|
||
|
window.addEventListener("resize", this.getHeight, false);
|
||
|
},
|
||
|
methods: {
|
||
|
globalEnable(row) {
|
||
|
console.log("row.id:" + row.id);
|
||
|
console.log("row.enableMark:" + row.enableMark);
|
||
|
const oilCompanyMatch = {};
|
||
|
oilCompanyMatch.id = row.id;
|
||
|
oilCompanyMatch.enableMark = row.enableMark;
|
||
|
if (row.enableMark === 1) {
|
||
|
this.$confirm("确认启用?", "提示", { type: "success" })
|
||
|
.then(() => {
|
||
|
console.log("oilCompanyMatch:" + JSON.stringify(oilCompanyMatch));
|
||
|
oilCompanyMatchApi.globalEnable(oilCompanyMatch).then((res) => {
|
||
|
this.$message.success(res.msg);
|
||
|
this.getByPage();
|
||
|
});
|
||
|
})
|
||
|
.catch(() => {
|
||
|
row.enableMark = 0;
|
||
|
});
|
||
|
} else {
|
||
|
this.$confirm("确认禁用?", "提示", { type: "warning" })
|
||
|
.then(() => {
|
||
|
console.log("oilCompanyMatch:" + JSON.stringify(oilCompanyMatch));
|
||
|
oilCompanyMatchApi.globalEnable(oilCompanyMatch).then((res) => {
|
||
|
this.$message.success(res.msg);
|
||
|
this.getByPage();
|
||
|
});
|
||
|
})
|
||
|
.catch(() => {
|
||
|
row.enableMark = 1;
|
||
|
});
|
||
|
}
|
||
|
},
|
||
|
companyRemoteMethod(value) {
|
||
|
// 远程搜索企业
|
||
|
if (value) {
|
||
|
oilCompanyInfoApi.getLike(value).then((res) => {
|
||
|
this.queryCompanyList = res.data;
|
||
|
});
|
||
|
}
|
||
|
},
|
||
|
indexMethod(index) {
|
||
|
return (index + 1) * 1;
|
||
|
},
|
||
|
handleSelectionChange(val) {
|
||
|
// 选择表格数据
|
||
|
this.multipleSelection = val;
|
||
|
},
|
||
|
toForbid() {
|
||
|
// 禁用
|
||
|
if (!this.multipleSelection || this.multipleSelection.length < 1) {
|
||
|
this.$message.error("请选择需要操作的数据");
|
||
|
return;
|
||
|
}
|
||
|
},
|
||
|
toStartUsing() {
|
||
|
// 启用
|
||
|
if (!this.multipleSelection || this.multipleSelection.length < 1) {
|
||
|
this.$message.error("请选择需要操作的数据");
|
||
|
return;
|
||
|
}
|
||
|
},
|
||
|
toImport() {
|
||
|
// 导入
|
||
|
this.importDialog = true;
|
||
|
},
|
||
|
toOutPut() {
|
||
|
// 导出
|
||
|
this.outPutDialog = true;
|
||
|
},
|
||
|
handleDetail(id) {
|
||
|
// 查看行 详情
|
||
|
oilCompanyMatchApi.get(id).then((res) => {
|
||
|
this.oilCompanyMatch = res.data;
|
||
|
this.showTableDrawer = true;
|
||
|
});
|
||
|
},
|
||
|
getHeight() {
|
||
|
setTimeout(() => {
|
||
|
this.sHeight = this.$refs.searchHeight.offsetHeight;
|
||
|
let fixedHeaderHeight =
|
||
|
document.querySelector(".fixed-header").clientHeight;
|
||
|
let elPaginationHeight =
|
||
|
document.querySelector(".el-pagination").clientHeight;
|
||
|
this.tableHeight =
|
||
|
document.documentElement.clientHeight -
|
||
|
this.sHeight -
|
||
|
fixedHeaderHeight -
|
||
|
elPaginationHeight -
|
||
|
160;
|
||
|
}, 350);
|
||
|
},
|
||
|
search() {
|
||
|
// 搜索
|
||
|
this.page.currentPage = 1;
|
||
|
this.getByPage();
|
||
|
},
|
||
|
toggleSearchAdvance() {
|
||
|
this.searchAdvice = !this.searchAdvice;
|
||
|
},
|
||
|
handleSizeChange(val) {
|
||
|
this.page.pageSize = val;
|
||
|
this.getByPage();
|
||
|
},
|
||
|
handleCurrentChange(val) {
|
||
|
this.page.currentPage = val;
|
||
|
this.getByPage();
|
||
|
},
|
||
|
sortHandler(column) {
|
||
|
// 排序查询
|
||
|
console.log(column);
|
||
|
const key = column.prop;
|
||
|
const value = column.order;
|
||
|
this.page.sorted = {};
|
||
|
this.page.sorted[key] = value;
|
||
|
this.getByPage();
|
||
|
},
|
||
|
toAdd() {
|
||
|
// 跳转到添加
|
||
|
this.oilCompanyMatch = {};
|
||
|
this.addDialog = true;
|
||
|
},
|
||
|
toUpdate(id) {
|
||
|
// 跳转到更新
|
||
|
oilCompanyMatchApi.get(id).then((res) => {
|
||
|
this.oilCompanyMatch = res.data;
|
||
|
this.updateDialog = true;
|
||
|
});
|
||
|
},
|
||
|
toDelete(id) {
|
||
|
// 删除
|
||
|
this.$confirm("确定删除?", "提示", { type: "error" }).then(() => {
|
||
|
oilCompanyMatchApi.deleteById(id).then((res) => {
|
||
|
this.$message.success(res.msg);
|
||
|
this.getByPage();
|
||
|
});
|
||
|
});
|
||
|
},
|
||
|
getByPage() {
|
||
|
// 分页查询
|
||
|
this.addDialog = false;
|
||
|
oilCompanyMatchApi.getByPage(this.page).then((res) => {
|
||
|
this.dataPage = res.data;
|
||
|
this.page.totalCount = this.dataPage.totalCount;
|
||
|
this.page.totalPage = this.dataPage.totalPage;
|
||
|
});
|
||
|
},
|
||
|
closeDialog() {
|
||
|
this.addDialog = false;
|
||
|
this.updateDialog = false;
|
||
|
},
|
||
|
},
|
||
|
};
|
||
|
</script>
|
||
|
|
||
|
<style scoped>
|
||
|
.handle-button-group {
|
||
|
margin-bottom: 10px;
|
||
|
}
|
||
|
.table-div {
|
||
|
min-height: calc(100vh - 150px);
|
||
|
max-height: calc(100vh - 110px);
|
||
|
position: relative;
|
||
|
overflow-y: scroll;
|
||
|
margin-bottom: 20px;
|
||
|
}
|
||
|
.table-div >>> .header-container {
|
||
|
position: sticky;
|
||
|
top: 0rem;
|
||
|
min-height: 152px;
|
||
|
z-index: 4;
|
||
|
background: #fff;
|
||
|
}
|
||
|
.table-div .el-table__footer-wrapper {
|
||
|
position: fixed !important;
|
||
|
}
|
||
|
.page-div {
|
||
|
/* position: fixed; */
|
||
|
background: #fff;
|
||
|
bottom: 0rem;
|
||
|
z-index: 4;
|
||
|
min-width: 100%;
|
||
|
}
|
||
|
</style>
|