Skip to content

I
isc-web-vue
Commit 7c9ac51c by huangshunlin
Options

牌价分页 设置默认pagesize和pagenum

parent c7440a4b
Showing with 123 additions and 113 deletions
src/page/Home/components/ForeignExchangeRates.vue
<template>
<div style="height: 40%">
<CardWrapper title="外汇牌价" :isShowRefresh="true" v-on="$listeners" v-bind="$attrs" @refresh="refresh" >
<div class="content">
<div class="rates-top">
<div class="rates-items">
<div class="rates-items-title">汇总种类：</div>
<div class="rates-items-description">即期牌价</div>
</div>
<div class="rates-items">
<div class="rates-items-title">货币名称：</div>
<div class="rates-items-description">CNY-人民币</div>
</div>
<div class="rates-items">
<div class="rates-items-title">牌价时间：</div>
<div class="rates-items-description">{{today}}</div>
</div>
<!-- <div class="rates-items">
<div style="height: 40%">
<CardWrapper
title="外汇牌价"
:isShowRefresh="true"
v-on="$listeners"
v-bind="$attrs"
@refresh="refresh"
>
<div class="content">
<div class="rates-top">
<div class="rates-items">
<div class="rates-items-title">汇总种类：</div>
<div class="rates-items-description">即期牌价</div>
</div>
<div class="rates-items">
<div class="rates-items-title">货币名称：</div>
<div class="rates-items-description">CNY-人民币</div>
</div>
<div class="rates-items">
<div class="rates-items-title">牌价时间：</div>
<div class="rates-items-description">{{ today }}</div>
</div>
<!-- <div class="rates-items">
<div class="rates-items-title">生效日期：</div>
<div class="rates-items-description">{{today}}</div>
</div> -->
</div>
<el-table :data="xrtData" style="width: 100%" stripe :highlight-current-row="true" height="calc(100% - 30px)">
<el-table-column prop="curnam" label="货币名称">
</el-table-column>
<el-table-column prop="midrat" label="中间价">
</el-table-column>
<el-table-column prop="buyrat" label="现汇买入价">
</el-table-column>
<el-table-column prop="selrat" label="现汇卖出价">
</el-table-column>
<!-- <el-table-column prop="buy1rat" label="现钞买入价">
</div>
<el-table
:data="xrtData"
style="width: 100%"
stripe
:highlight-current-row="true"
height="calc(100% - 30px)"
>
<el-table-column prop="curnam" label="货币名称"> </el-table-column>
<el-table-column prop="midrat" label="中间价"> </el-table-column>
<el-table-column prop="buyrat" label="现汇买入价"> </el-table-column>
<el-table-column prop="selrat" label="现汇卖出价"> </el-table-column>
<!-- <el-table-column prop="buy1rat" label="现钞买入价">
</el-table-column>
<el-table-column prop="sel1rat" label="现钞卖出价">
</el-table-column> -->
</el-table>
<!--<c-paging-table
</el-table>
<!--<c-paging-table
:data="xrtData"
:columns="xrtColumns"
:highlight-current-row="true"
......@@ -45,14 +53,14 @@
:border="true"
>
</c-paging-table>-->
</div>
</CardWrapper>
</div>
</div>
</CardWrapper>
</div>
</template>
<script>
import CardWrapper from "./CardWrapper";
import {queryFXRateList} from "~/service/manage/xrt.js";
import { queryFXRateList } from "~/service/manage/xrt.js";
import moment from "moment";
export default {
......@@ -60,126 +68,128 @@ export default {
components: { CardWrapper },
data() {
return {
today:'',
today: "",
xrtData: [],
xrtColumns: [
{ label: '货币名称', prop: 'curnam', width: 'auto' },
{ label: '中间价', prop: 'midrat', width: 'auto' },
{ label: '现汇买入价', prop: 'buyrat', width: 'auto' },
{ label: '现汇卖出价', prop: 'selrat', width: 'auto' },
{ label: '现钞卖出价', prop: 'sel1rat', width: 'auto' },
{ label: '现钞买入价', prop: 'buy1rat', width: 'auto' },
],
{ label: "货币名称", prop: "curnam", width: "auto" },
{ label: "中间价", prop: "midrat", width: "auto" },
{ label: "现汇买入价", prop: "buyrat", width: "auto" },
{ label: "现汇卖出价", prop: "selrat", width: "auto" },
{ label: "现钞卖出价", prop: "sel1rat", width: "auto" },
{ label: "现钞买入价", prop: "buy1rat", width: "auto" },
],
xrtmodel: {
cur:"",
curnam:"",
begdat:"",
enddat:"",
buyrat:0,
selrat:0,
sel1rat:0,
buy1rat:0,
cur: "",
curnam: "",
begdat: "",
enddat: "",
buyrat: 0,
selrat: 0,
sel1rat: 0,
buy1rat: 0,
pageNum: 0,
pageSize: 0,
total: 0
total: 0,
},
};
},
mounted(){
this.today = moment(new Date()).format("YYYY.MM.DD HH:mm")
mounted() {
this.today = moment(new Date()).format("YYYY.MM.DD HH:mm");
},
created() {
this.xrtmodel.begdat = this.getNowDate();
this.xrtmodel.enddat = "2999-12-31";
this.xrtmodel.pageNum = 1;
this.xrtmodel.pageSize = 10;
this.onInfXrtSearch();
},
methods: {
getNowDate() {
const timeOne = new Date()
const year = timeOne.getFullYear()
let month = timeOne.getMonth() + 1
let day = timeOne.getDate()
month = month < 10 ? '0' + month : month
day = day < 10 ? '0' + day : day
const NOW_MONTHS_AGO = `${year}-${month}-${day}`
return NOW_MONTHS_AGO
getNowDate() {
const timeOne = new Date();
const year = timeOne.getFullYear();
let month = timeOne.getMonth() + 1;
let day = timeOne.getDate();
month = month < 10 ? "0" + month : month;
day = day < 10 ? "0" + day : day;
const NOW_MONTHS_AGO = `${year}-${month}-${day}`;
return NOW_MONTHS_AGO;
},
onInfXrtSearch() {
queryFXRateList(this.xrtmodel).then(res => {
if(res.respCode == SUCCESS) {
const list = res.data.list
this.xrtData = list
this.xrtmodel.pageNum = res.data.pageNumber
this.xrtmodel.pageSize = res.data.pageSize
this.xrtmodel.total = res.data.total
queryFXRateList(this.xrtmodel).then((res) => {
if (res.respCode == SUCCESS) {
const list = res.data.list;
this.xrtData = list;
this.xrtmodel.pageNum = res.data.pageNumber;
this.xrtmodel.pageSize = res.data.pageSize;
this.xrtmodel.total = res.data.total;
}
})
},
});
},
queryFunc(pageNumber, pageSize) {
this.xrtmodel.pageNum = pageNumber
this.xrtmodel.pageSize = pageSize
this.onInfXrtSearch()
this.xrtmodel.pageNum = pageNumber;
this.xrtmodel.pageSize = pageSize;
this.onInfXrtSearch();
},
refresh(){
this.today = moment(new Date()).format("YYYY.MM.DD HH:mm")
refresh() {
this.today = moment(new Date()).format("YYYY.MM.DD HH:mm");
this.xrtmodel.begdat = this.getNowDate();
this.xrtmodel.enddat = "2299-12-31";
this.onInfXrtSearch();
}
}
},
},
};
</script>
<style scoped lang="less">
.content {
width: 100%;
width: 100%;
padding: 12px 0;
height: 100%;
}
.rates-top {
position: absolute;
top:38px;
// right:0;
z-index: 2;
width: 100%;
background: #fff;
display: flex;
line-height: 36px;
justify-content: flex-start;
font-size: 14px;
// padding: 0 20px;
box-sizing: border-box;
position: absolute;
top: 38px;
// right:0;
z-index: 2;
width: 100%;
background: #fff;
display: flex;
line-height: 36px;
justify-content: flex-start;
font-size: 14px;
// padding: 0 20px;
box-sizing: border-box;
}
.rates-items {
// width: 30%;
display:flex;
// flex-direction: column;
// padding: 0 0 15px;
// width: 30%;
display: flex;
// flex-direction: column;
// padding: 0 0 15px;
}
.rates-items .rates-items-title {
// width: 100%;
height: 40px;
line-height: 40px;
display: inline;
color:var(--text-secondary-color)
// width: 100%;
height: 40px;
line-height: 40px;
display: inline;
color: var(--text-secondary-color);
}
.rates-items .rates-items-description {
// width: 100%;
height: 40px;
line-height: 40px;
padding-right: 10px;
color:var(--text-color-1)
// width: 100%;
height: 40px;
line-height: 40px;
padding-right: 10px;
color: var(--text-color-1);
}
.content /deep/ .el-table{
margin-top:30px;
.content /deep/ .el-table {
margin-top: 30px;
}
.content /deep/ .el-table::before {
height: 0px;
height: 0px;
}
.content /deep/ .el-table th {
color: var(--warning-text-color);
background: #fcf6ec;
line-height: 22px;
color: var(--warning-text-color);
background: #fcf6ec;
line-height: 22px;
}
.content /deep/ .el-table tr {
background: #f9f9f9;
......@@ -204,7 +214,7 @@ export default {
padding: 7px 0;
}
.content /deep/ .el-table .cell {
height: 21px;
line-height: 21px;
height: 21px;
line-height: 21px;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment