学习vue的第二周，昨天开始帮公司项目做一个管理系统的小功能，一个页面，两个接口。
【项目】
把之前一个结构相似的页面拷过来，改了下路由和权限，可以从菜单跳转过来。
【样式】
删除了以前的页面布局，新增加了页面的组件布局。
【接口】
昨天开始接口对接，开始数据没有拿到，其实拿到不拿到我也根本不清楚，不知道该怎么调试，在哪里看数据。
请教过别人才知道在浏览器后台可以看到console的打印，还有network的请求状态，头，返回信息。
写接口，跑数据，开始一直报错，后来才知道是请求参数写错了，数据还没有初始化就取了出来，修改后可以正常看到返回数据。
填充数据
如何把数据填充到页面，也是试了多次，开始取数据的时候多取了一层，data就行，结果取到了data.list，后面在放数据的时候页面周期没有搞对，数据还没填充就去刷新页面。
今天了解到项目中用到的UI框架是Element，一般用在管理系统，还有Iview，vant,一般用在移动端多一些。
截止下班前基本完成
林林总总，记录如上。
-kai
<el-table size="small" border fit highlight-current-row style="width: 100%" id="" :data="topData">
<el-table-column prop="assetsQuantity" label="买入数量总和"/>
<el-table-column prop="buyAmount" label="买入金额总数" />
<el-table-column prop="buyAvgPrice" label="整体买入均价" />
<el-table-column prop="buyQuantity" label="持仓总数" />
</el-table>
<el-table size="small" border fit highlight-current-row style="width: 100%" id="" :data="topData">
<el-table-column prop="sellAmount" label="卖出数量总和"></el-table-column>
<el-table-column prop="sellQuantity" label="卖出金额总数" />
<el-table-column prop="sellAvgPrice" label="整体卖出均价" />
<el-table-column prop="profitAndLoss" label="买卖盈亏" />
</el-table>
<el-table size="small" :data="list" v-loading="listLoading" border fit highlight-current-row
style="width: 100%" id="exportTab">
<el-table-column type="index" label="序号" align="center" width="65"></el-table-column>
<el-table-column prop="userId" label="UID" />
<el-table-column prop="symbol" label="交易对" />
<el-table-column prop="assetsQuantity" label="持仓数量" />
<el-table-column prop="buyQuantity" label="买入数量" />
<el-table-column prop="buyAmount" label="买入金额" />
<el-table-column prop="buyAvgPrice" label="买入均价" />
<el-table-column prop="sellQuantity" label="卖出数量" />
<el-table-column prop="sellAmount" label="卖出金额" />
<el-table-column prop="sellAvgPrice" label="卖出均价" />
<el-table-column prop="profitAndLoss" label="买卖盈亏" />
</el-table>
async getMarkets() {
let res = await C.request.get(C.Api("getMarkets"), {
page: 1,
rows: 10000,
});
this.symbolList = res.data.rows;
this.form.name = res.data.rows[0].symbol;
this.getList();
this.getTopData();
},
async getList() {
this.listLoading = true;
let res = await C.request.get(C.Api("positionRiskConfig"), {
pageNum: this.page,
pageSize: this.rows,
startTime: this.form.startTime,
endTime: this.form.endTime,
symbol: this.form.name||null,
});
this.listLoading = false;
this.list = res.list;
this.total = res.total;
},
async getTopData() {
this.listLoading = true;
let res = await C.request.get(C.Api("monitorSummary"), {
pageNum: this.page,
pageSize: this.rows,
startTime: this.form.startTime,
endTime: this.form.endTime,
symbol: this.form.name||null,
});
this.listLoading = false;
this.topData=[res];
},
