后台需要以下几种的格式之一都行
我的本地代码
控制台打印出来是这样 Tue Apr 09 2019 10:20:30 GMT+0800 (中国标准时间)
讲道理没错啊 完全符合
然而,事情往往没有那么简单
发送给后台时格式变成了这样
然后问了一下后台 他说没有做任何转换 让我搜一下格式转换
然后通过toString()这个方法成功把格式转为正确的格式!
但每次加载页面时也产生报错提示,发现原因是设置默认日期在获取表格数据之后执行了
以下是完整代码
<template>
<div id="container">
<!-- 下拉选择框 -->
<span>开始日期</span>
<el-date-picker v-model="startDate" type="date" @change="startChange()"></el-date-picker>
<span>结束日期</span>
<el-date-picker v-model="endDate" type="date" @change="endChange()"></el-date-picker>
<!-- <span>营业部</span>
<el-select v-model="roleName" placeholder="请选择">
<el-option v-for="item in roleList" :key="item.id" :label="item.roleName" :value="item.id"></el-option>
</el-select>-->
<!-- 主要按钮 -->
<el-button type="primary" @click="handleSearch()">查询</el-button>
<!-- 表格 -->
<el-table :data="tableData" style="width: 100%;height:600px;">
<!-- 表格内操作 -->
<el-table-column label="统计日期" width="130">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.openDate }}</span>
</template>
</el-table-column>
<el-table-column label="branchNo" width="130">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.branchNo }}</span>
</template>
</el-table-column>
<el-table-column label="营业部" width="130">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.branchName }}</span>
</template>
</el-table-column>
<el-table-column label="姓名" width="130">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.clientName }}</span>
</template>
</el-table-column>
<el-table-column label="资金账号" width="130">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.clientId }}</span>
</template>
</el-table-column>
<el-table-column label="证件类型" width="130">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.idKind }}</span>
</template>
</el-table-column>
<el-table-column label="证件号码" width="130">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.idNo }}</span>
</template>
</el-table-column>
<el-table-column label="organFlag" width="130">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.organFlag }}</span>
</template>
</el-table-column>
<el-table-column label="修改次数" width="130">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.count }}</span>
</template>
</el-table-column>
<el-table-column label="类型" width="130">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.type }}</span>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<el-pagination
id="pagination"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
@prev-click="handlePrevClick"
@next-click="handleNextClick"
:current-page="pageNo"
:page-sizes="[4, 8, 12, 16, 20]"
:page-size="limit"
layout="total , prev, pager, next, jumper"
:total="total"
background
></el-pagination>
</div>
</template>
<script>
import axios from "axios";
export default {
data() {
return {
tableData: [],
total: 0, //总条数
limit: 10, //当前页显示条数
pageNo: 1, //当前页码
startDate: "",
endDate: ""
};
},
methods: {
//获取表格数据
getTableData() {
axios
.get(
"api/monitor/detail/account-a",
{
params: {
startDate: (this.startDate).toString(),
endDate: (this.endDate).toString(),
pageNo: this.pageNo,
limit: 10
}
},
{
withCredentials: true
}
)
.then(response => {
if (response.data.code == 0) {
this.tableData = response.data.content.list;
console.log(this.tableData, "this.tableData");
this.total = Number(response.data.content.totalElements); //给总条数赋值
} else {
this.$message({
type: "info",
message: response.data.message
});
}
})
.catch(error => {
console.log(error);
});
},
//查询操作
handleSearch() {
this.getTableData();
},
//分页按钮
handleSizeChange(val) {
this.limit = Number(`${val}`);
console.log(`每页 ${val} 条`);
this.getTableData();
},
handleCurrentChange(val) {
this.pageNo = Number(`${val}`);
console.log(this.limit);
this.getTableData();
},
handlePrevClick(val) {
//上一页
this.pageNo = Number(`${val}`);
console.log(`当前页: ${val}`);
this.getTableData();
},
handleNextClick(val) {
//下一页
this.pageNo = Number(`${val}`);
console.log(`当前页: ${val}`);
this.getTableData();
},
//默认搜索条件
defaultDate() {
this.endDate = new Date(); //默认结束日期为当前日期
const startDate = new Date();
startDate.setTime(startDate.getTime() - 3600 * 1000 * 24 * 7);
this.startDate = startDate; //默认开始日期为一周前
console.log(this.startDate, this.endDate);
},
startChange() {
console.log(this.startDate);
},
endChange() {
console.log(this.endDate);
}
},
mounted() {
this.defaultDate(); //要在获取表格数据前面执行
this.getTableData();
}
};
</script>