fix: 增加了趋势页面逻辑,后端的查询目前为sql,暂时不通,需要修改调通及提升效率

dev_refactor_0120_qoder
Lxy 4 months ago
parent c662a567bd
commit 789584e62a

@ -101,4 +101,15 @@ public class TTrendsController extends BaseController
{
return toAjax(tTrendsService.deleteTTrendsByIds(ids));
}
/**
*
*/
@PreAuthorize("@ss.hasPermi('newstocksystem:trends:list')")
@GetMapping("/listSection")
public TableDataInfo listSection(TTrends tTrends)
{
List<?> list = tTrendsService.listTrendsSection(tTrends);
return getDataTable(list);
}
}

@ -32,6 +32,14 @@ public interface TTrendsMapper
*/
public List<TTrends> selectTTrendsList(TTrends tTrends);
/**
*
*
* @param tTrends
* @return
*/
public List<?> listTrendsSection(TTrends tTrends);
/**
*
*

@ -27,6 +27,14 @@ public interface TTrendsService
*/
public List<TTrends> selectTTrendsList(TTrends tTrends);
/**
*
*
* @param tTrends
* @return
*/
public List<?> listTrendsSection(TTrends tTrends);
/**
*
*

@ -119,4 +119,16 @@ public class TTrendsServiceImpl implements TTrendsService
{
return tIndustryBasicMapper.selectTIndustryBasicByName(industryName) != null;
}
/**
*
*
* @param tTrends
* @return
*/
@Override
public List<?> listTrendsSection(TTrends tTrends)
{
return tTrendsMapper.listTrendsSection(tTrends);
}
}

@ -135,4 +135,52 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
<select id="checkTrendsExistsByDate" parameterType="Date" resultType="int">
select count(1) from t_trends where trade_date = #{tradeDate}
</select>
<!-- 查询趋势分段列表 -->
<select id="listTrendsSection" parameterType="TTrends" resultType="map">
<!-- 第一步获取最近10个交易日 -->
WITH recent_days AS (
SELECT trade_date
FROM t_trends
WHERE momentum_type = #{momentumType}
GROUP BY trade_date
ORDER BY trade_date DESC
LIMIT 10
),
<!-- 第二步:获取所有行业名称 -->
industry_names AS (
SELECT DISTINCT industry_name
FROM t_trends
WHERE momentum_type = #{momentumType}
AND trade_date IN (SELECT trade_date FROM recent_days)
),
<!-- 第三步:获取每个行业在每个交易日的排名 -->
industry_ranks AS (
SELECT
i.industry_name,
rd.trade_date,
t.`rank`
FROM industry_names i
CROSS JOIN recent_days rd
LEFT JOIN t_trends t ON i.industry_name = t.industry_name
AND rd.trade_date = t.trade_date
AND t.momentum_type = #{momentumType}
)
<!-- 第四步:将数据转换为列形式 -->
SELECT
industry_name,
MAX(CASE WHEN trade_date = (SELECT trade_date FROM recent_days ORDER BY trade_date DESC LIMIT 1) THEN `rank` ELSE 0 END) AS current_day,
MAX(CASE WHEN trade_date = (SELECT trade_date FROM recent_days ORDER BY trade_date DESC LIMIT 1 OFFSET 1) THEN `rank` ELSE 0 END) AS day_2,
MAX(CASE WHEN trade_date = (SELECT trade_date FROM recent_days ORDER BY trade_date DESC LIMIT 1 OFFSET 2) THEN `rank` ELSE 0 END) AS day_3,
MAX(CASE WHEN trade_date = (SELECT trade_date FROM recent_days ORDER BY trade_date DESC LIMIT 1 OFFSET 3) THEN `rank` ELSE 0 END) AS day_4,
MAX(CASE WHEN trade_date = (SELECT trade_date FROM recent_days ORDER BY trade_date DESC LIMIT 1 OFFSET 4) THEN `rank` ELSE 0 END) AS day_5,
MAX(CASE WHEN trade_date = (SELECT trade_date FROM recent_days ORDER BY trade_date DESC LIMIT 1 OFFSET 5) THEN `rank` ELSE 0 END) AS day_6,
MAX(CASE WHEN trade_date = (SELECT trade_date FROM recent_days ORDER BY trade_date DESC LIMIT 1 OFFSET 6) THEN `rank` ELSE 0 END) AS day_7,
MAX(CASE WHEN trade_date = (SELECT trade_date FROM recent_days ORDER BY trade_date DESC LIMIT 1 OFFSET 7) THEN `rank` ELSE 0 END) AS day_8,
MAX(CASE WHEN trade_date = (SELECT trade_date FROM recent_days ORDER BY trade_date DESC LIMIT 1 OFFSET 8) THEN `rank` ELSE 0 END) AS day_9,
MAX(CASE WHEN trade_date = (SELECT trade_date FROM recent_days ORDER BY trade_date DESC LIMIT 1 OFFSET 9) THEN `rank` ELSE 0 END) AS day_10
FROM industry_ranks
GROUP BY industry_name
ORDER BY current_day
</select>
</mapper>

@ -66,7 +66,7 @@ export function listStockIndexStocksDistribution(query) {
// 查询菜单列表
export function getLatestTradeDay() {
return request({
url: '/stocksystem/stocks/getTradeDay',
url: '/newstocksystem/stockdata/stockDailyTrade/lastTradeDate2',
method: 'get',
params: null
})

@ -0,0 +1,63 @@
import request from '@/utils/request'
// 查询趋势列表
export function listTrends(query) {
return request({
url: '/newstocksystem/trends/list',
method: 'get',
params: query
})
}
// 查询趋势分段列表
export function listTrendsSection(query) {
return request({
url: '/newstocksystem/trends/listSection',
method: 'get',
params: query
})
}
// 查询趋势详细
export function getTrends(id) {
return request({
url: '/newstocksystem/trends/' + id,
method: 'get'
})
}
// 新增趋势
export function addTrends(data) {
return request({
url: '/newstocksystem/trends',
method: 'post',
data: data
})
}
// 修改趋势
export function updateTrends(data) {
return request({
url: '/newstocksystem/trends',
method: 'put',
data: data
})
}
// 删除趋势
export function delTrends(id) {
return request({
url: '/newstocksystem/trends/' + id,
method: 'delete'
})
}
// 导出趋势
export function exportTrends(query) {
return request({
url: '/newstocksystem/trends/export',
method: 'post',
params: query,
responseType: 'blob'
})
}

@ -0,0 +1,200 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="交易日期" prop="tradeDate">
<el-date-picker clearable size="small"
v-model="queryParams.tradeDate"
type="date"
value-format="yyyy-MM-dd"
placeholder="选择交易日期"
style="width: 160px"
@change="dateChanged"
:editable="false"
:clearable="false"
>
</el-date-picker>
</el-form-item>
<el-form-item label="动量周期" prop="momentumType">
<el-select v-model="queryParams.momentumType"
placeholder="动量周期"
clearable
size="small"
@change="selectChanged"
style="width: 100px"
:clearable="false"
>
<el-option key="1" label="1日" :value="'1'" />
<el-option key="3" label="3日" :value="'3'" />
<el-option key="5" label="5日" :value="'5'" />
<el-option key="10" label="10日" :value="'10'" />
<el-option key="15" label="15日" :value="'15'" />
<el-option key="20" label="20日" :value="'20'" />
<el-option key="30" label="30日" :value="'30'" />
</el-select>
</el-form-item>
<el-form-item label="行业名称" prop="industryName">
<el-autocomplete
v-model="queryParams.industryName"
placeholder="请输入行业名称"
size="small"
:fetch-suggestions="querySearchAsync"
@select="handleSelect"
@change="dateChanged"
></el-autocomplete>
</el-form-item>
<el-form-item>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery"></el-button>
</el-form-item>
</el-form>
<el-row :gutter="20">
<el-col :xs="24" :sm="24" :md="24" :lg="24">
<div style="border-bottom: solid 2px #A9A4A4;margin: 10px 0 10px 0;height: 30px;">
<span id="lotDistribute">{{ queryParams.type }}日趋势板块</span>
</div>
<el-tabs type="border-card">
<el-tab-pane>
<span slot="label"><el-icon type="primary" plain circle size = "mini" class="el-icon-medal-1" style="border: 0px;"></el-icon> </span>
<el-table :data="this.lotTrendsList[0].sortDataList"
height='560'
style="width: 100%;"
empty-text="暂无数据"
tooltip-effect="dark"
@cell-click="handleClickTable"
:cell-style="trendCellStyle"
:key="itemKey"
v-loading="loading"
>
<template v-for="item in this.lotTrendsList">
<el-table-column
:label="item.title"
class="active"
>
<template slot-scope="scope">
<span>{{ item.sortDataList[scope.$index] }}</span>
</template>
</el-table-column>
</template>
</el-table>
</el-tab-pane>
</el-tabs>
</el-col>
</el-row>
</div>
</template>
<script>
import { getToken } from '@/utils/auth'
import stockdataApi from '@/api/newstocksystem/stockdata'
import { listTrends, listTrendsSection } from '@/api/newstocksystem/trends'
export default {
name: "Trends",
data() {
return {
//
itemKey: '',//
loading: true,
//
showSearch: true,
//
total: 0,
// ,
lotTrendsList: [{sortDataList:[]}],
//
queryParams: {
pageNum: 1,
pageSize: 10,
tradeDate: null,
industryName: null,
momentumType: "10"
}
};
},
created() {
this.getLastTradeDate();
},
methods: {
/** 获取最后一个交易日 */
getLastTradeDate() {
stockdataApi.getLastTradeDate().then(response => {
const lastTradeDate = response.msg;
console.log("getLastTradeDate " , lastTradeDate);
this.queryParams.tradeDate = lastTradeDate;
//
this.getListSection();
});
},
/** 查询动量结果列表 */
getListSection() {
this.loading = true;
listTrendsSection(this.queryParams).then(response => {
this.lotTrendsList = response.rows;
this.itemKey = Math.random();
document.getElementById('lotDistribute').innerText = this.queryParams.momentumType + "日趋势板块";
this.loading = false;
});
},
/** 重置按钮操作 */
resetQuery() {
this.queryParams.industryName = "";
this.getLastTradeDate();
},
handleClickTable(row, column) {
console.log("handleClickTable : ",row, column.label);
},
dateChanged() {
this.getListSection();
},
selectChanged() {
this.getListSection();
},
querySearchAsync(queryString, cb) {
//
//
cb([]);
},
handleSelect(item) {
console.log("handleSelect : ", item);
},
//
trendCellStyle({row, column, rowIndex, columnIndex}) {
if(this.lotTrendsList[columnIndex].sortDataList[rowIndex] <= 3 && this.lotTrendsList[columnIndex].sortDataList[rowIndex] > 0)
return 'background:red;color:white;text-align:center;';
else if(this.lotTrendsList[columnIndex].sortDataList[rowIndex] <= 6 && this.lotTrendsList[columnIndex].sortDataList[rowIndex] > 3)
return 'background:#FF9D00;color:white;text-align:center;';
else if(this.lotTrendsList[columnIndex].sortDataList[rowIndex] <= 10 && this.lotTrendsList[columnIndex].sortDataList[rowIndex] > 6)
return 'background:#FFD000;color:white;text-align:center;';
else
return 'text-align:center;';
}
}
}
</script>
<style scoped>
.app-container {
padding: 15px;
}
.box-card {
margin-bottom: 15px;
}
.text-red {
color: #f56c6c;
}
.text-green {
color: #67c23a;
}
.clearfix:before,
.clearfix:after {
display: table;
content: "";
}
.clearfix:after {
clear: both;
}
</style>
Loading…
Cancel
Save