Merge branch 'wyfMain-dev-0530'
This commit is contained in:
commit
b841a6d911
@ -85,201 +85,202 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { NDataTable, NButton, NDropdown, NIcon } from "naive-ui";
|
||||
import { reactive, onMounted, h, computed } from "vue";
|
||||
import axios from "axios";
|
||||
import { NDataTable, NButton, NDropdown, NIcon } from 'naive-ui'
|
||||
import { reactive, onMounted, h, computed } from 'vue'
|
||||
import axios from 'axios'
|
||||
import {
|
||||
ChevronDownOutline,
|
||||
ChevronBackOutline,
|
||||
ChevronForwardOutline,
|
||||
ArrowUpOutline,
|
||||
} from "@vicons/ionicons5";
|
||||
import defaultTableData from "../data";
|
||||
} from '@vicons/ionicons5'
|
||||
import defaultTableData from '../data'
|
||||
// console.log('defaultTableData', defaultTableData)
|
||||
import customEcharts from '@/components/customEcharts/index.vue'
|
||||
// console.log("defaultTableData", defaultTableData);
|
||||
|
||||
// 数据筛选选项
|
||||
const periodOptions = [
|
||||
{ label: "Daily", key: "Daily" },
|
||||
{ label: "Weekly", key: "Weekly" },
|
||||
{ label: "Monthly", key: "Monthly" },
|
||||
{ label: "Quarterly", key: "Quarterly" },
|
||||
{ label: "Annual", key: "Annual" },
|
||||
];
|
||||
{ label: 'Daily', key: 'Daily' },
|
||||
{ label: 'Weekly', key: 'Weekly' },
|
||||
{ label: 'Monthly', key: 'Monthly' },
|
||||
{ label: 'Quarterly', key: 'Quarterly' },
|
||||
{ label: 'Annual', key: 'Annual' },
|
||||
]
|
||||
|
||||
const durationOptions = [
|
||||
{ label: "3 Months", key: "3 Months" },
|
||||
{ label: "6 Months", key: "6 Months" },
|
||||
{ label: "Year to Date", key: "Year to Date" },
|
||||
{ label: "1 Year", key: "1 Year" },
|
||||
{ label: "5 Years", key: "5 Years" },
|
||||
{ label: "10 Years", key: "10 Years" },
|
||||
// { label: "Full History", key: "Full History", disabled: true },
|
||||
];
|
||||
{ label: '3 Months', key: '3 Months' },
|
||||
{ label: '6 Months', key: '6 Months' },
|
||||
{ label: 'Year to Date', key: 'Year to Date' },
|
||||
{ label: '1 Year', key: '1 Year' },
|
||||
{ label: '5 Years', key: '5 Years' },
|
||||
{ label: '10 Years', key: '10 Years' },
|
||||
// { label: 'Full History', key: 'Full History', disabled: true },
|
||||
]
|
||||
|
||||
// 分页大小选项
|
||||
const pageSizeOptions = [
|
||||
{ label: "50", key: 50 },
|
||||
{ label: "100", key: 100 },
|
||||
{ label: "500", key: 500 },
|
||||
{ label: "1000", key: 1000 },
|
||||
];
|
||||
{ label: '50', key: 50 },
|
||||
{ label: '100', key: 100 },
|
||||
{ label: '500', key: 500 },
|
||||
{ label: '1000', key: 1000 },
|
||||
]
|
||||
|
||||
const state = reactive({
|
||||
selectedPeriod: "Daily",
|
||||
selectedDuration: "3 Months",
|
||||
selectedPeriod: 'Daily',
|
||||
selectedDuration: '6 Months',
|
||||
tableData: [],
|
||||
currentPage: 1,
|
||||
pageSize: 50,
|
||||
});
|
||||
})
|
||||
|
||||
// 计算总页数
|
||||
const totalPages = computed(() => {
|
||||
return Math.ceil(state.tableData.length / state.pageSize);
|
||||
});
|
||||
return Math.ceil(state.tableData.length / state.pageSize)
|
||||
})
|
||||
|
||||
// 计算当前页的数据
|
||||
const paginatedData = computed(() => {
|
||||
const start = (state.currentPage - 1) * state.pageSize;
|
||||
const end = start + state.pageSize;
|
||||
return state.tableData.slice(start, end);
|
||||
});
|
||||
const start = (state.currentPage - 1) * state.pageSize
|
||||
const end = start + state.pageSize
|
||||
return state.tableData.slice(start, end)
|
||||
})
|
||||
|
||||
// 表格列定义
|
||||
const columns = [
|
||||
{
|
||||
title: "Date",
|
||||
key: "date",
|
||||
align: "left",
|
||||
fixed: "left",
|
||||
title: 'Date',
|
||||
key: 'date',
|
||||
align: 'left',
|
||||
fixed: 'left',
|
||||
width: 150,
|
||||
},
|
||||
{
|
||||
title: "Open",
|
||||
key: "open",
|
||||
align: "center",
|
||||
title: 'Open',
|
||||
key: 'open',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: "High",
|
||||
key: "high",
|
||||
align: "center",
|
||||
title: 'High',
|
||||
key: 'high',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: "Low",
|
||||
key: "low",
|
||||
align: "center",
|
||||
title: 'Low',
|
||||
key: 'low',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: "Close",
|
||||
key: "close",
|
||||
align: "center",
|
||||
title: 'Close',
|
||||
key: 'close',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: "Adj. Close",
|
||||
key: "adjClose",
|
||||
align: "center",
|
||||
title: 'Adj. Close',
|
||||
key: 'adjClose',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: "Change",
|
||||
key: "change",
|
||||
align: "center",
|
||||
title: 'Change',
|
||||
key: 'change',
|
||||
align: 'center',
|
||||
render(row) {
|
||||
const value = parseFloat(row.change);
|
||||
const color = value < 0 ? "#ff4d4f" : value > 0 ? "#52c41a" : "";
|
||||
return h("span", { style: { color } }, row.change);
|
||||
const value = parseFloat(row.change)
|
||||
const color = value < 0 ? '#ff4d4f' : value > 0 ? '#52c41a' : ''
|
||||
return h('span', { style: { color } }, row.change)
|
||||
},
|
||||
},
|
||||
{
|
||||
title: "Volume",
|
||||
key: "volume",
|
||||
align: "center",
|
||||
title: 'Volume',
|
||||
key: 'volume',
|
||||
align: 'center',
|
||||
},
|
||||
];
|
||||
]
|
||||
|
||||
// 处理下拉选项变更
|
||||
const handlePeriodChange = (key) => {
|
||||
state.selectedPeriod = key;
|
||||
if (key === "Annual") {
|
||||
handleDurationChange("Full History");
|
||||
return;
|
||||
state.selectedPeriod = key
|
||||
if (key === 'Annual') {
|
||||
handleDurationChange('Full History')
|
||||
return
|
||||
}
|
||||
if (key === "Monthly") {
|
||||
handleDurationChange("10 Years");
|
||||
return;
|
||||
if (key === 'Monthly') {
|
||||
handleDurationChange('10 Years')
|
||||
return
|
||||
}
|
||||
if (key === "Quarterly") {
|
||||
handleDurationChange("10 Years");
|
||||
return;
|
||||
if (key === 'Quarterly') {
|
||||
handleDurationChange('10 Years')
|
||||
return
|
||||
}
|
||||
getPageData();
|
||||
};
|
||||
getPageData()
|
||||
}
|
||||
|
||||
const handleDurationChange = (key) => {
|
||||
state.selectedDuration = key;
|
||||
getPageData();
|
||||
};
|
||||
state.selectedDuration = key
|
||||
state.currentPage = 1
|
||||
getPageData()
|
||||
}
|
||||
|
||||
// 处理分页
|
||||
const handlePrevPage = () => {
|
||||
if (state.currentPage === 1) {
|
||||
return;
|
||||
return
|
||||
}
|
||||
state.currentPage--;
|
||||
};
|
||||
state.currentPage--
|
||||
}
|
||||
|
||||
const handleNextPage = () => {
|
||||
if (state.currentPage >= totalPages.value) {
|
||||
return;
|
||||
return
|
||||
}
|
||||
state.currentPage++;
|
||||
};
|
||||
state.currentPage++
|
||||
}
|
||||
|
||||
const handlePageSizeChange = (size) => {
|
||||
state.pageSize = size;
|
||||
state.currentPage = 1; // 重置到第一页
|
||||
};
|
||||
state.pageSize = size
|
||||
state.currentPage = 1 // 重置到第一页
|
||||
}
|
||||
|
||||
// 回到顶部
|
||||
const scrollToTop = () => {
|
||||
// 尝试多种方法
|
||||
// 1. 使用document.body
|
||||
document.body.scrollTop = 0;
|
||||
document.body.scrollTop = 0
|
||||
// 2. 使用document.documentElement (HTML元素)
|
||||
document.documentElement.scrollTop = 0;
|
||||
document.documentElement.scrollTop = 0
|
||||
// 3. 使用scrollIntoView
|
||||
document.querySelector(".historic-data-container").scrollIntoView({
|
||||
behavior: "smooth",
|
||||
block: "start",
|
||||
});
|
||||
};
|
||||
document.querySelector('.historic-data-container').scrollIntoView({
|
||||
behavior: 'smooth',
|
||||
block: 'start',
|
||||
})
|
||||
}
|
||||
onMounted(() => {
|
||||
getPageData();
|
||||
});
|
||||
getPageData()
|
||||
})
|
||||
|
||||
const getPageDefaultData = async () => {
|
||||
try {
|
||||
let url =
|
||||
"https://stockanalysis.com/api/symbol/a/OTC-MINM/history?type=chart";
|
||||
const res = await axios.get(url);
|
||||
let originalData = res.data.data;
|
||||
'https://stockanalysis.com/api/symbol/a/OTC-MINM/history?period=Daily&range=3M'
|
||||
const res = await axios.get(url)
|
||||
let originalData = res.data.data
|
||||
|
||||
// 转换为日期格式："Nov 26, 2024"
|
||||
let calcApiData = originalData.map((item) => [
|
||||
new Date(item[0]).toLocaleDateString("en-US", {
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
year: "numeric",
|
||||
new Date(item[0]).toLocaleDateString('en-US', {
|
||||
month: 'short',
|
||||
day: 'numeric',
|
||||
year: 'numeric',
|
||||
}),
|
||||
item[1],
|
||||
]);
|
||||
// console.log("接口数据", calcApiData);
|
||||
])
|
||||
// console.log('接口数据', calcApiData)
|
||||
|
||||
// 使用API数据更新defaultTableData中的close和adjClose值
|
||||
const updatedTableData = defaultTableData.map((tableItem) => {
|
||||
// 查找对应日期的API数据
|
||||
const matchedApiData = calcApiData.find(
|
||||
(apiItem) => apiItem[0] === tableItem.date
|
||||
);
|
||||
(apiItem) => apiItem[0] === tableItem.date,
|
||||
)
|
||||
|
||||
if (matchedApiData) {
|
||||
// 更新close和adjClose值
|
||||
@ -287,56 +288,100 @@ const getPageDefaultData = async () => {
|
||||
...tableItem,
|
||||
close: matchedApiData[1].toFixed(2),
|
||||
adjClose: matchedApiData[1].toFixed(2),
|
||||
};
|
||||
}
|
||||
return tableItem;
|
||||
});
|
||||
}
|
||||
return tableItem
|
||||
})
|
||||
|
||||
state.tableData = updatedTableData;
|
||||
state.tableData = updatedTableData
|
||||
} catch (error) {
|
||||
// console.error("获取数据失败", error);
|
||||
// console.error('获取数据失败', error)
|
||||
}
|
||||
};
|
||||
}
|
||||
const getPageData = async () => {
|
||||
let range = "";
|
||||
if (state.selectedDuration === "3 Months") {
|
||||
range = "3M";
|
||||
} else if (state.selectedDuration === "6 Months") {
|
||||
range = "6M";
|
||||
} else if (state.selectedDuration === "Year to Date") {
|
||||
range = "YTD";
|
||||
} else if (state.selectedDuration === "1 Year") {
|
||||
range = "1Y";
|
||||
} else if (state.selectedDuration === "5 Years") {
|
||||
range = "5Y";
|
||||
} else if (state.selectedDuration === "10 Years") {
|
||||
range = "10Y";
|
||||
} else if (state.selectedDuration === "Full History") {
|
||||
range = "Max";
|
||||
let range = ''
|
||||
let now = new Date()
|
||||
const last = new Date(now)
|
||||
last.setMonth(now.getMonth() - 6)
|
||||
let fromDate = last
|
||||
let toDate =
|
||||
now.getFullYear() +
|
||||
'-' +
|
||||
String(now.getMonth() + 1).padStart(2, '0') +
|
||||
'-' +
|
||||
String(now.getDate()).padStart(2, '0')
|
||||
if (state.selectedDuration === '3 Months') {
|
||||
range = '3M'
|
||||
const last = new Date(now)
|
||||
last.setMonth(now.getMonth() - 3)
|
||||
fromDate = last
|
||||
} else if (state.selectedDuration === '6 Months') {
|
||||
range = '6M'
|
||||
const last = new Date(now)
|
||||
last.setMonth(now.getMonth() - 6)
|
||||
fromDate = last
|
||||
} else if (state.selectedDuration === 'Year to Date') {
|
||||
range = 'YTD'
|
||||
fromDate = new Date(now.getFullYear(), 0, 1)
|
||||
} else if (state.selectedDuration === '1 Year') {
|
||||
range = '1Y'
|
||||
const last = new Date(now)
|
||||
last.setFullYear(now.getFullYear() - 1)
|
||||
fromDate = last
|
||||
} else if (state.selectedDuration === '5 Years') {
|
||||
range = '5Y'
|
||||
const last = new Date(now)
|
||||
last.setFullYear(now.getFullYear() - 5)
|
||||
fromDate = last
|
||||
} else if (state.selectedDuration === '10 Years') {
|
||||
range = '10Y'
|
||||
const last = new Date(now)
|
||||
last.setFullYear(now.getFullYear() - 10)
|
||||
fromDate = last
|
||||
} else if (state.selectedDuration === 'Full History') {
|
||||
range = 'Max'
|
||||
fromDate = new Date('2009-10-07')
|
||||
}
|
||||
let url = `https://stockanalysis.com/api/symbol/a/OTC-MINM/history?period=${state.selectedPeriod}&range=${range}`;
|
||||
const res = await axios.get(url);
|
||||
if (res.data.status === 200) {
|
||||
let finalFromDate =
|
||||
fromDate.getFullYear() +
|
||||
'-' +
|
||||
String(fromDate.getMonth() + 1).padStart(2, '0') +
|
||||
'-' +
|
||||
String(fromDate.getDate()).padStart(2, '0')
|
||||
// let url = `https://stockanalysis.com/api/symbol/a/OTC-MINM/history?period=${state.selectedPeriod}&range=${range}`
|
||||
let url =
|
||||
'https://common.szjixun.cn/api/stock/history/list?from=' +
|
||||
finalFromDate +
|
||||
'&to=' +
|
||||
toDate
|
||||
const res = await axios.get(url)
|
||||
// console.error(res)
|
||||
if (res.status === 200) {
|
||||
if (res.data.status === 0) {
|
||||
// 转换为日期格式："Nov 26, 2024"
|
||||
let resultData = res.data.data.map((item) => {
|
||||
return {
|
||||
date: new Date(item.t).toLocaleDateString("en-US", {
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
year: "numeric",
|
||||
date: new Date(item.date).toLocaleDateString('en-US', {
|
||||
month: 'short',
|
||||
day: 'numeric',
|
||||
year: 'numeric',
|
||||
}),
|
||||
open: item.o != null ? Number(item.o).toFixed(2) : "",
|
||||
high: item.h != null ? Number(item.h).toFixed(2) : "",
|
||||
low: item.l != null ? Number(item.l).toFixed(2) : "",
|
||||
close: item.c != null ? Number(item.c).toFixed(2) : "",
|
||||
adjClose: item.a != null ? Number(item.a).toFixed(2) : "",
|
||||
change: item.ch != null ? Number(item.ch).toFixed(2) + "%" : "",
|
||||
volume: item.v,
|
||||
};
|
||||
});
|
||||
state.tableData = resultData;
|
||||
open: item.open != null ? Number(item.open).toFixed(2) : '',
|
||||
high: item.high != null ? Number(item.high).toFixed(2) : '',
|
||||
low: item.low != null ? Number(item.low).toFixed(2) : '',
|
||||
close: item.close != null ? Number(item.close).toFixed(2) : '',
|
||||
adjClose: item.close != null ? Number(item.close).toFixed(2) : '',
|
||||
change:
|
||||
item.changePercent != null
|
||||
? Number(item.changePercent).toFixed(2) + '%'
|
||||
: '',
|
||||
volume: item.volume,
|
||||
}
|
||||
};
|
||||
})
|
||||
state.tableData = resultData
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
@ -83,202 +83,202 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { NDataTable, NButton, NDropdown, NIcon } from "naive-ui";
|
||||
import { reactive, onMounted, h, computed } from "vue";
|
||||
import axios from "axios";
|
||||
import { NDataTable, NButton, NDropdown, NIcon } from 'naive-ui'
|
||||
import { reactive, onMounted, h, computed } from 'vue'
|
||||
import axios from 'axios'
|
||||
import {
|
||||
ChevronDownOutline,
|
||||
ChevronBackOutline,
|
||||
ChevronForwardOutline,
|
||||
ArrowUpOutline,
|
||||
} from "@vicons/ionicons5";
|
||||
import defaultTableData from "../data";
|
||||
} from '@vicons/ionicons5'
|
||||
import defaultTableData from '../data'
|
||||
// console.log('defaultTableData', defaultTableData)
|
||||
import customEcharts from '@/components/customEcharts/index.vue'
|
||||
// console.log("defaultTableData", defaultTableData);
|
||||
|
||||
// 数据筛选选项
|
||||
const periodOptions = [
|
||||
{ label: "Daily", key: "Daily" },
|
||||
{ label: "Weekly", key: "Weekly" },
|
||||
{ label: "Monthly", key: "Monthly" },
|
||||
{ label: "Quarterly", key: "Quarterly" },
|
||||
{ label: "Annual", key: "Annual" },
|
||||
];
|
||||
{ label: 'Daily', key: 'Daily' },
|
||||
{ label: 'Weekly', key: 'Weekly' },
|
||||
{ label: 'Monthly', key: 'Monthly' },
|
||||
{ label: 'Quarterly', key: 'Quarterly' },
|
||||
{ label: 'Annual', key: 'Annual' },
|
||||
]
|
||||
|
||||
const durationOptions = [
|
||||
{ label: "3 Months", key: "3 Months" },
|
||||
{ label: "6 Months", key: "6 Months" },
|
||||
{ label: "Year to Date", key: "Year to Date" },
|
||||
{ label: "1 Year", key: "1 Year" },
|
||||
{ label: "5 Years", key: "5 Years" },
|
||||
{ label: "10 Years", key: "10 Years" },
|
||||
// { label: "Full History", key: "Full History", disabled: true },
|
||||
];
|
||||
{ label: '3 Months', key: '3 Months' },
|
||||
{ label: '6 Months', key: '6 Months' },
|
||||
{ label: 'Year to Date', key: 'Year to Date' },
|
||||
{ label: '1 Year', key: '1 Year' },
|
||||
{ label: '5 Years', key: '5 Years' },
|
||||
{ label: '10 Years', key: '10 Years' },
|
||||
// { label: 'Full History', key: 'Full History', disabled: true },
|
||||
]
|
||||
|
||||
// 分页大小选项
|
||||
const pageSizeOptions = [
|
||||
{ label: "50", key: 50 },
|
||||
{ label: "100", key: 100 },
|
||||
{ label: "500", key: 500 },
|
||||
{ label: "1000", key: 1000 },
|
||||
];
|
||||
{ label: '50', key: 50 },
|
||||
{ label: '100', key: 100 },
|
||||
{ label: '500', key: 500 },
|
||||
{ label: '1000', key: 1000 },
|
||||
]
|
||||
|
||||
const state = reactive({
|
||||
selectedPeriod: "Daily",
|
||||
selectedDuration: "3 Months",
|
||||
selectedPeriod: 'Daily',
|
||||
selectedDuration: '6 Months',
|
||||
tableData: [],
|
||||
currentPage: 1,
|
||||
pageSize: 50,
|
||||
});
|
||||
})
|
||||
|
||||
// 计算总页数
|
||||
const totalPages = computed(() => {
|
||||
return Math.ceil(state.tableData.length / state.pageSize);
|
||||
});
|
||||
return Math.ceil(state.tableData.length / state.pageSize)
|
||||
})
|
||||
|
||||
// 计算当前页的数据
|
||||
const paginatedData = computed(() => {
|
||||
const start = (state.currentPage - 1) * state.pageSize;
|
||||
const end = start + state.pageSize;
|
||||
return state.tableData.slice(start, end);
|
||||
});
|
||||
const start = (state.currentPage - 1) * state.pageSize
|
||||
const end = start + state.pageSize
|
||||
return state.tableData.slice(start, end)
|
||||
})
|
||||
|
||||
// 表格列定义
|
||||
const columns = [
|
||||
{
|
||||
width: 100,
|
||||
title: "Date",
|
||||
key: "date",
|
||||
align: "left",
|
||||
fixed: "left",
|
||||
title: 'Date',
|
||||
key: 'date',
|
||||
align: 'left',
|
||||
fixed: 'left',
|
||||
width: 150,
|
||||
},
|
||||
{
|
||||
title: "Open",
|
||||
key: "open",
|
||||
align: "center",
|
||||
fixed: "left",
|
||||
title: 'Open',
|
||||
key: 'open',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: "High",
|
||||
key: "high",
|
||||
align: "center",
|
||||
title: 'High',
|
||||
key: 'high',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: "Low",
|
||||
key: "low",
|
||||
align: "center",
|
||||
title: 'Low',
|
||||
key: 'low',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: "Close",
|
||||
key: "close",
|
||||
align: "center",
|
||||
title: 'Close',
|
||||
key: 'close',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: "Adj. Close",
|
||||
key: "adjClose",
|
||||
align: "center",
|
||||
title: 'Adj. Close',
|
||||
key: 'adjClose',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: "Change",
|
||||
key: "change",
|
||||
align: "center",
|
||||
title: 'Change',
|
||||
key: 'change',
|
||||
align: 'center',
|
||||
render(row) {
|
||||
const value = parseFloat(row.change);
|
||||
const color = value < 0 ? "#ff4d4f" : value > 0 ? "#52c41a" : "";
|
||||
return h("span", { style: { color } }, row.change);
|
||||
const value = parseFloat(row.change)
|
||||
const color = value < 0 ? '#ff4d4f' : value > 0 ? '#52c41a' : ''
|
||||
return h('span', { style: { color } }, row.change)
|
||||
},
|
||||
},
|
||||
{
|
||||
title: "Volume",
|
||||
key: "volume",
|
||||
align: "center",
|
||||
title: 'Volume',
|
||||
key: 'volume',
|
||||
align: 'center',
|
||||
},
|
||||
];
|
||||
]
|
||||
|
||||
// 处理下拉选项变更
|
||||
const handlePeriodChange = (key) => {
|
||||
state.selectedPeriod = key;
|
||||
if (key === "Annual") {
|
||||
handleDurationChange("Full History");
|
||||
return;
|
||||
state.selectedPeriod = key
|
||||
if (key === 'Annual') {
|
||||
handleDurationChange('Full History')
|
||||
return
|
||||
}
|
||||
if (key === "Monthly") {
|
||||
handleDurationChange("10 Years");
|
||||
return;
|
||||
if (key === 'Monthly') {
|
||||
handleDurationChange('10 Years')
|
||||
return
|
||||
}
|
||||
if (key === "Quarterly") {
|
||||
handleDurationChange("10 Years");
|
||||
return;
|
||||
if (key === 'Quarterly') {
|
||||
handleDurationChange('10 Years')
|
||||
return
|
||||
}
|
||||
getPageData();
|
||||
};
|
||||
getPageData()
|
||||
}
|
||||
|
||||
const handleDurationChange = (key) => {
|
||||
state.selectedDuration = key;
|
||||
getPageData();
|
||||
};
|
||||
state.selectedDuration = key
|
||||
state.currentPage = 1
|
||||
getPageData()
|
||||
}
|
||||
|
||||
// 处理分页
|
||||
const handlePrevPage = () => {
|
||||
if (state.currentPage === 1) {
|
||||
return;
|
||||
return
|
||||
}
|
||||
state.currentPage--;
|
||||
};
|
||||
state.currentPage--
|
||||
}
|
||||
|
||||
const handleNextPage = () => {
|
||||
if (state.currentPage >= totalPages.value) {
|
||||
return;
|
||||
return
|
||||
}
|
||||
state.currentPage++;
|
||||
};
|
||||
state.currentPage++
|
||||
}
|
||||
|
||||
const handlePageSizeChange = (size) => {
|
||||
state.pageSize = size;
|
||||
state.currentPage = 1; // 重置到第一页
|
||||
};
|
||||
state.pageSize = size
|
||||
state.currentPage = 1 // 重置到第一页
|
||||
}
|
||||
|
||||
// 回到顶部
|
||||
const scrollToTop = () => {
|
||||
// 尝试多种方法
|
||||
// 1. 使用document.body
|
||||
document.body.scrollTop = 0;
|
||||
document.body.scrollTop = 0
|
||||
// 2. 使用document.documentElement (HTML元素)
|
||||
document.documentElement.scrollTop = 0;
|
||||
document.documentElement.scrollTop = 0
|
||||
// 3. 使用scrollIntoView
|
||||
document.querySelector(".historic-data-container").scrollIntoView({
|
||||
behavior: "smooth",
|
||||
block: "start",
|
||||
});
|
||||
};
|
||||
document.querySelector('.historic-data-container').scrollIntoView({
|
||||
behavior: 'smooth',
|
||||
block: 'start',
|
||||
})
|
||||
}
|
||||
onMounted(() => {
|
||||
getPageData();
|
||||
});
|
||||
getPageData()
|
||||
})
|
||||
|
||||
const getPageDefaultData = async () => {
|
||||
try {
|
||||
let url =
|
||||
"https://stockanalysis.com/api/symbol/a/OTC-MINM/history?type=chart";
|
||||
const res = await axios.get(url);
|
||||
let originalData = res.data.data;
|
||||
'https://stockanalysis.com/api/symbol/a/OTC-MINM/history?period=Daily&range=3M'
|
||||
const res = await axios.get(url)
|
||||
let originalData = res.data.data
|
||||
|
||||
// 转换为日期格式："Nov 26, 2024"
|
||||
let calcApiData = originalData.map((item) => [
|
||||
new Date(item[0]).toLocaleDateString("en-US", {
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
year: "numeric",
|
||||
new Date(item[0]).toLocaleDateString('en-US', {
|
||||
month: 'short',
|
||||
day: 'numeric',
|
||||
year: 'numeric',
|
||||
}),
|
||||
item[1],
|
||||
]);
|
||||
// console.log("接口数据", calcApiData);
|
||||
])
|
||||
// console.log('接口数据', calcApiData)
|
||||
|
||||
// 使用API数据更新defaultTableData中的close和adjClose值
|
||||
const updatedTableData = defaultTableData.map((tableItem) => {
|
||||
// 查找对应日期的API数据
|
||||
const matchedApiData = calcApiData.find(
|
||||
(apiItem) => apiItem[0] === tableItem.date
|
||||
);
|
||||
(apiItem) => apiItem[0] === tableItem.date,
|
||||
)
|
||||
|
||||
if (matchedApiData) {
|
||||
// 更新close和adjClose值
|
||||
@ -286,56 +286,100 @@ const getPageDefaultData = async () => {
|
||||
...tableItem,
|
||||
close: matchedApiData[1].toFixed(2),
|
||||
adjClose: matchedApiData[1].toFixed(2),
|
||||
};
|
||||
}
|
||||
return tableItem;
|
||||
});
|
||||
}
|
||||
return tableItem
|
||||
})
|
||||
|
||||
state.tableData = updatedTableData;
|
||||
state.tableData = updatedTableData
|
||||
} catch (error) {
|
||||
// console.error("获取数据失败", error);
|
||||
// console.error('获取数据失败', error)
|
||||
}
|
||||
};
|
||||
}
|
||||
const getPageData = async () => {
|
||||
let range = "";
|
||||
if (state.selectedDuration === "3 Months") {
|
||||
range = "3M";
|
||||
} else if (state.selectedDuration === "6 Months") {
|
||||
range = "6M";
|
||||
} else if (state.selectedDuration === "Year to Date") {
|
||||
range = "YTD";
|
||||
} else if (state.selectedDuration === "1 Year") {
|
||||
range = "1Y";
|
||||
} else if (state.selectedDuration === "5 Years") {
|
||||
range = "5Y";
|
||||
} else if (state.selectedDuration === "10 Years") {
|
||||
range = "10Y";
|
||||
} else if (state.selectedDuration === "Full History") {
|
||||
range = "Max";
|
||||
let range = ''
|
||||
let now = new Date()
|
||||
const last = new Date(now)
|
||||
last.setMonth(now.getMonth() - 6)
|
||||
let fromDate = last
|
||||
let toDate =
|
||||
now.getFullYear() +
|
||||
'-' +
|
||||
String(now.getMonth() + 1).padStart(2, '0') +
|
||||
'-' +
|
||||
String(now.getDate()).padStart(2, '0')
|
||||
if (state.selectedDuration === '3 Months') {
|
||||
range = '3M'
|
||||
const last = new Date(now)
|
||||
last.setMonth(now.getMonth() - 3)
|
||||
fromDate = last
|
||||
} else if (state.selectedDuration === '6 Months') {
|
||||
range = '6M'
|
||||
const last = new Date(now)
|
||||
last.setMonth(now.getMonth() - 6)
|
||||
fromDate = last
|
||||
} else if (state.selectedDuration === 'Year to Date') {
|
||||
range = 'YTD'
|
||||
fromDate = new Date(now.getFullYear(), 0, 1)
|
||||
} else if (state.selectedDuration === '1 Year') {
|
||||
range = '1Y'
|
||||
const last = new Date(now)
|
||||
last.setFullYear(now.getFullYear() - 1)
|
||||
fromDate = last
|
||||
} else if (state.selectedDuration === '5 Years') {
|
||||
range = '5Y'
|
||||
const last = new Date(now)
|
||||
last.setFullYear(now.getFullYear() - 5)
|
||||
fromDate = last
|
||||
} else if (state.selectedDuration === '10 Years') {
|
||||
range = '10Y'
|
||||
const last = new Date(now)
|
||||
last.setFullYear(now.getFullYear() - 10)
|
||||
fromDate = last
|
||||
} else if (state.selectedDuration === 'Full History') {
|
||||
range = 'Max'
|
||||
fromDate = new Date('2009-10-07')
|
||||
}
|
||||
let url = `https://stockanalysis.com/api/symbol/a/OTC-MINM/history?period=${state.selectedPeriod}&range=${range}`;
|
||||
const res = await axios.get(url);
|
||||
if (res.data.status === 200) {
|
||||
let finalFromDate =
|
||||
fromDate.getFullYear() +
|
||||
'-' +
|
||||
String(fromDate.getMonth() + 1).padStart(2, '0') +
|
||||
'-' +
|
||||
String(fromDate.getDate()).padStart(2, '0')
|
||||
// let url = `https://stockanalysis.com/api/symbol/a/OTC-MINM/history?period=${state.selectedPeriod}&range=${range}`
|
||||
let url =
|
||||
'https://common.szjixun.cn/api/stock/history/list?from=' +
|
||||
finalFromDate +
|
||||
'&to=' +
|
||||
toDate
|
||||
const res = await axios.get(url)
|
||||
// console.error(res)
|
||||
if (res.status === 200) {
|
||||
if (res.data.status === 0) {
|
||||
// 转换为日期格式："Nov 26, 2024"
|
||||
let resultData = res.data.data.map((item) => {
|
||||
return {
|
||||
date: new Date(item.t).toLocaleDateString("en-US", {
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
year: "numeric",
|
||||
date: new Date(item.date).toLocaleDateString('en-US', {
|
||||
month: 'short',
|
||||
day: 'numeric',
|
||||
year: 'numeric',
|
||||
}),
|
||||
open: item.o != null ? Number(item.o).toFixed(2) : "",
|
||||
high: item.h != null ? Number(item.h).toFixed(2) : "",
|
||||
low: item.l != null ? Number(item.l).toFixed(2) : "",
|
||||
close: item.c != null ? Number(item.c).toFixed(2) : "",
|
||||
adjClose: item.a != null ? Number(item.a).toFixed(2) : "",
|
||||
change: item.ch != null ? Number(item.ch).toFixed(2) + "%" : "",
|
||||
volume: item.v,
|
||||
};
|
||||
});
|
||||
state.tableData = resultData;
|
||||
open: item.open != null ? Number(item.open).toFixed(2) : '',
|
||||
high: item.high != null ? Number(item.high).toFixed(2) : '',
|
||||
low: item.low != null ? Number(item.low).toFixed(2) : '',
|
||||
close: item.close != null ? Number(item.close).toFixed(2) : '',
|
||||
adjClose: item.close != null ? Number(item.close).toFixed(2) : '',
|
||||
change:
|
||||
item.changePercent != null
|
||||
? Number(item.changePercent).toFixed(2) + '%'
|
||||
: '',
|
||||
volume: item.volume,
|
||||
}
|
||||
};
|
||||
})
|
||||
state.tableData = resultData
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
@ -85,201 +85,202 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { NDataTable, NButton, NDropdown, NIcon } from "naive-ui";
|
||||
import { reactive, onMounted, h, computed } from "vue";
|
||||
import axios from "axios";
|
||||
import { NDataTable, NButton, NDropdown, NIcon } from 'naive-ui'
|
||||
import { reactive, onMounted, h, computed } from 'vue'
|
||||
import axios from 'axios'
|
||||
import {
|
||||
ChevronDownOutline,
|
||||
ChevronBackOutline,
|
||||
ChevronForwardOutline,
|
||||
ArrowUpOutline,
|
||||
} from "@vicons/ionicons5";
|
||||
import defaultTableData from "../data";
|
||||
} from '@vicons/ionicons5'
|
||||
import defaultTableData from '../data'
|
||||
// console.log('defaultTableData', defaultTableData)
|
||||
import customEcharts from '@/components/customEcharts/index.vue'
|
||||
// console.log("defaultTableData", defaultTableData);
|
||||
|
||||
// 数据筛选选项
|
||||
const periodOptions = [
|
||||
{ label: "Daily", key: "Daily" },
|
||||
{ label: "Weekly", key: "Weekly" },
|
||||
{ label: "Monthly", key: "Monthly" },
|
||||
{ label: "Quarterly", key: "Quarterly" },
|
||||
{ label: "Annual", key: "Annual" },
|
||||
];
|
||||
{ label: 'Daily', key: 'Daily' },
|
||||
{ label: 'Weekly', key: 'Weekly' },
|
||||
{ label: 'Monthly', key: 'Monthly' },
|
||||
{ label: 'Quarterly', key: 'Quarterly' },
|
||||
{ label: 'Annual', key: 'Annual' },
|
||||
]
|
||||
|
||||
const durationOptions = [
|
||||
{ label: "3 Months", key: "3 Months" },
|
||||
{ label: "6 Months", key: "6 Months" },
|
||||
{ label: "Year to Date", key: "Year to Date" },
|
||||
{ label: "1 Year", key: "1 Year" },
|
||||
{ label: "5 Years", key: "5 Years" },
|
||||
{ label: "10 Years", key: "10 Years" },
|
||||
// { label: "Full History", key: "Full History", disabled: true },
|
||||
];
|
||||
{ label: '3 Months', key: '3 Months' },
|
||||
{ label: '6 Months', key: '6 Months' },
|
||||
{ label: 'Year to Date', key: 'Year to Date' },
|
||||
{ label: '1 Year', key: '1 Year' },
|
||||
{ label: '5 Years', key: '5 Years' },
|
||||
{ label: '10 Years', key: '10 Years' },
|
||||
// { label: 'Full History', key: 'Full History', disabled: true },
|
||||
]
|
||||
|
||||
// 分页大小选项
|
||||
const pageSizeOptions = [
|
||||
{ label: "50", key: 50 },
|
||||
{ label: "100", key: 100 },
|
||||
{ label: "500", key: 500 },
|
||||
{ label: "1000", key: 1000 },
|
||||
];
|
||||
{ label: '50', key: 50 },
|
||||
{ label: '100', key: 100 },
|
||||
{ label: '500', key: 500 },
|
||||
{ label: '1000', key: 1000 },
|
||||
]
|
||||
|
||||
const state = reactive({
|
||||
selectedPeriod: "Daily",
|
||||
selectedDuration: "3 Months",
|
||||
selectedPeriod: 'Daily',
|
||||
selectedDuration: '6 Months',
|
||||
tableData: [],
|
||||
currentPage: 1,
|
||||
pageSize: 50,
|
||||
});
|
||||
})
|
||||
|
||||
// 计算总页数
|
||||
const totalPages = computed(() => {
|
||||
return Math.ceil(state.tableData.length / state.pageSize);
|
||||
});
|
||||
return Math.ceil(state.tableData.length / state.pageSize)
|
||||
})
|
||||
|
||||
// 计算当前页的数据
|
||||
const paginatedData = computed(() => {
|
||||
const start = (state.currentPage - 1) * state.pageSize;
|
||||
const end = start + state.pageSize;
|
||||
return state.tableData.slice(start, end);
|
||||
});
|
||||
const start = (state.currentPage - 1) * state.pageSize
|
||||
const end = start + state.pageSize
|
||||
return state.tableData.slice(start, end)
|
||||
})
|
||||
|
||||
// 表格列定义
|
||||
const columns = [
|
||||
{
|
||||
title: "Date",
|
||||
key: "date",
|
||||
align: "left",
|
||||
fixed: "left",
|
||||
title: 'Date',
|
||||
key: 'date',
|
||||
align: 'left',
|
||||
fixed: 'left',
|
||||
width: 150,
|
||||
},
|
||||
{
|
||||
title: "Open",
|
||||
key: "open",
|
||||
align: "center",
|
||||
title: 'Open',
|
||||
key: 'open',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: "High",
|
||||
key: "high",
|
||||
align: "center",
|
||||
title: 'High',
|
||||
key: 'high',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: "Low",
|
||||
key: "low",
|
||||
align: "center",
|
||||
title: 'Low',
|
||||
key: 'low',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: "Close",
|
||||
key: "close",
|
||||
align: "center",
|
||||
title: 'Close',
|
||||
key: 'close',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: "Adj. Close",
|
||||
key: "adjClose",
|
||||
align: "center",
|
||||
title: 'Adj. Close',
|
||||
key: 'adjClose',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: "Change",
|
||||
key: "change",
|
||||
align: "center",
|
||||
title: 'Change',
|
||||
key: 'change',
|
||||
align: 'center',
|
||||
render(row) {
|
||||
const value = parseFloat(row.change);
|
||||
const color = value < 0 ? "#ff4d4f" : value > 0 ? "#52c41a" : "";
|
||||
return h("span", { style: { color } }, row.change);
|
||||
const value = parseFloat(row.change)
|
||||
const color = value < 0 ? '#ff4d4f' : value > 0 ? '#52c41a' : ''
|
||||
return h('span', { style: { color } }, row.change)
|
||||
},
|
||||
},
|
||||
{
|
||||
title: "Volume",
|
||||
key: "volume",
|
||||
align: "center",
|
||||
title: 'Volume',
|
||||
key: 'volume',
|
||||
align: 'center',
|
||||
},
|
||||
];
|
||||
]
|
||||
|
||||
// 处理下拉选项变更
|
||||
const handlePeriodChange = (key) => {
|
||||
state.selectedPeriod = key;
|
||||
if (key === "Annual") {
|
||||
handleDurationChange("Full History");
|
||||
return;
|
||||
state.selectedPeriod = key
|
||||
if (key === 'Annual') {
|
||||
handleDurationChange('Full History')
|
||||
return
|
||||
}
|
||||
if (key === "Monthly") {
|
||||
handleDurationChange("10 Years");
|
||||
return;
|
||||
if (key === 'Monthly') {
|
||||
handleDurationChange('10 Years')
|
||||
return
|
||||
}
|
||||
if (key === "Quarterly") {
|
||||
handleDurationChange("10 Years");
|
||||
return;
|
||||
if (key === 'Quarterly') {
|
||||
handleDurationChange('10 Years')
|
||||
return
|
||||
}
|
||||
getPageData();
|
||||
};
|
||||
getPageData()
|
||||
}
|
||||
|
||||
const handleDurationChange = (key) => {
|
||||
state.selectedDuration = key;
|
||||
getPageData();
|
||||
};
|
||||
state.selectedDuration = key
|
||||
state.currentPage = 1
|
||||
getPageData()
|
||||
}
|
||||
|
||||
// 处理分页
|
||||
const handlePrevPage = () => {
|
||||
if (state.currentPage === 1) {
|
||||
return;
|
||||
return
|
||||
}
|
||||
state.currentPage--;
|
||||
};
|
||||
state.currentPage--
|
||||
}
|
||||
|
||||
const handleNextPage = () => {
|
||||
if (state.currentPage >= totalPages.value) {
|
||||
return;
|
||||
return
|
||||
}
|
||||
state.currentPage++;
|
||||
};
|
||||
state.currentPage++
|
||||
}
|
||||
|
||||
const handlePageSizeChange = (size) => {
|
||||
state.pageSize = size;
|
||||
state.currentPage = 1; // 重置到第一页
|
||||
};
|
||||
state.pageSize = size
|
||||
state.currentPage = 1 // 重置到第一页
|
||||
}
|
||||
|
||||
// 回到顶部
|
||||
const scrollToTop = () => {
|
||||
// 尝试多种方法
|
||||
// 1. 使用document.body
|
||||
document.body.scrollTop = 0;
|
||||
document.body.scrollTop = 0
|
||||
// 2. 使用document.documentElement (HTML元素)
|
||||
document.documentElement.scrollTop = 0;
|
||||
document.documentElement.scrollTop = 0
|
||||
// 3. 使用scrollIntoView
|
||||
document.querySelector(".historic-data-container").scrollIntoView({
|
||||
behavior: "smooth",
|
||||
block: "start",
|
||||
});
|
||||
};
|
||||
document.querySelector('.historic-data-container').scrollIntoView({
|
||||
behavior: 'smooth',
|
||||
block: 'start',
|
||||
})
|
||||
}
|
||||
onMounted(() => {
|
||||
getPageData();
|
||||
});
|
||||
getPageData()
|
||||
})
|
||||
|
||||
const getPageDefaultData = async () => {
|
||||
try {
|
||||
let url =
|
||||
"https://stockanalysis.com/api/symbol/a/OTC-MINM/history?type=chart";
|
||||
const res = await axios.get(url);
|
||||
let originalData = res.data.data;
|
||||
'https://stockanalysis.com/api/symbol/a/OTC-MINM/history?period=Daily&range=3M'
|
||||
const res = await axios.get(url)
|
||||
let originalData = res.data.data
|
||||
|
||||
// 转换为日期格式："Nov 26, 2024"
|
||||
let calcApiData = originalData.map((item) => [
|
||||
new Date(item[0]).toLocaleDateString("en-US", {
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
year: "numeric",
|
||||
new Date(item[0]).toLocaleDateString('en-US', {
|
||||
month: 'short',
|
||||
day: 'numeric',
|
||||
year: 'numeric',
|
||||
}),
|
||||
item[1],
|
||||
]);
|
||||
// console.log("接口数据", calcApiData);
|
||||
])
|
||||
// console.log('接口数据', calcApiData)
|
||||
|
||||
// 使用API数据更新defaultTableData中的close和adjClose值
|
||||
const updatedTableData = defaultTableData.map((tableItem) => {
|
||||
// 查找对应日期的API数据
|
||||
const matchedApiData = calcApiData.find(
|
||||
(apiItem) => apiItem[0] === tableItem.date
|
||||
);
|
||||
(apiItem) => apiItem[0] === tableItem.date,
|
||||
)
|
||||
|
||||
if (matchedApiData) {
|
||||
// 更新close和adjClose值
|
||||
@ -287,56 +288,100 @@ const getPageDefaultData = async () => {
|
||||
...tableItem,
|
||||
close: matchedApiData[1].toFixed(2),
|
||||
adjClose: matchedApiData[1].toFixed(2),
|
||||
};
|
||||
}
|
||||
return tableItem;
|
||||
});
|
||||
}
|
||||
return tableItem
|
||||
})
|
||||
|
||||
state.tableData = updatedTableData;
|
||||
state.tableData = updatedTableData
|
||||
} catch (error) {
|
||||
// console.error("获取数据失败", error);
|
||||
// console.error('获取数据失败', error)
|
||||
}
|
||||
};
|
||||
}
|
||||
const getPageData = async () => {
|
||||
let range = "";
|
||||
if (state.selectedDuration === "3 Months") {
|
||||
range = "3M";
|
||||
} else if (state.selectedDuration === "6 Months") {
|
||||
range = "6M";
|
||||
} else if (state.selectedDuration === "Year to Date") {
|
||||
range = "YTD";
|
||||
} else if (state.selectedDuration === "1 Year") {
|
||||
range = "1Y";
|
||||
} else if (state.selectedDuration === "5 Years") {
|
||||
range = "5Y";
|
||||
} else if (state.selectedDuration === "10 Years") {
|
||||
range = "10Y";
|
||||
} else if (state.selectedDuration === "Full History") {
|
||||
range = "Max";
|
||||
let range = ''
|
||||
let now = new Date()
|
||||
const last = new Date(now)
|
||||
last.setMonth(now.getMonth() - 6)
|
||||
let fromDate = last
|
||||
let toDate =
|
||||
now.getFullYear() +
|
||||
'-' +
|
||||
String(now.getMonth() + 1).padStart(2, '0') +
|
||||
'-' +
|
||||
String(now.getDate()).padStart(2, '0')
|
||||
if (state.selectedDuration === '3 Months') {
|
||||
range = '3M'
|
||||
const last = new Date(now)
|
||||
last.setMonth(now.getMonth() - 3)
|
||||
fromDate = last
|
||||
} else if (state.selectedDuration === '6 Months') {
|
||||
range = '6M'
|
||||
const last = new Date(now)
|
||||
last.setMonth(now.getMonth() - 6)
|
||||
fromDate = last
|
||||
} else if (state.selectedDuration === 'Year to Date') {
|
||||
range = 'YTD'
|
||||
fromDate = new Date(now.getFullYear(), 0, 1)
|
||||
} else if (state.selectedDuration === '1 Year') {
|
||||
range = '1Y'
|
||||
const last = new Date(now)
|
||||
last.setFullYear(now.getFullYear() - 1)
|
||||
fromDate = last
|
||||
} else if (state.selectedDuration === '5 Years') {
|
||||
range = '5Y'
|
||||
const last = new Date(now)
|
||||
last.setFullYear(now.getFullYear() - 5)
|
||||
fromDate = last
|
||||
} else if (state.selectedDuration === '10 Years') {
|
||||
range = '10Y'
|
||||
const last = new Date(now)
|
||||
last.setFullYear(now.getFullYear() - 10)
|
||||
fromDate = last
|
||||
} else if (state.selectedDuration === 'Full History') {
|
||||
range = 'Max'
|
||||
fromDate = new Date('2009-10-07')
|
||||
}
|
||||
let url = `https://stockanalysis.com/api/symbol/a/OTC-MINM/history?period=${state.selectedPeriod}&range=${range}`;
|
||||
const res = await axios.get(url);
|
||||
if (res.data.status === 200) {
|
||||
let finalFromDate =
|
||||
fromDate.getFullYear() +
|
||||
'-' +
|
||||
String(fromDate.getMonth() + 1).padStart(2, '0') +
|
||||
'-' +
|
||||
String(fromDate.getDate()).padStart(2, '0')
|
||||
// let url = `https://stockanalysis.com/api/symbol/a/OTC-MINM/history?period=${state.selectedPeriod}&range=${range}`
|
||||
let url =
|
||||
'https://common.szjixun.cn/api/stock/history/list?from=' +
|
||||
finalFromDate +
|
||||
'&to=' +
|
||||
toDate
|
||||
const res = await axios.get(url)
|
||||
// console.error(res)
|
||||
if (res.status === 200) {
|
||||
if (res.data.status === 0) {
|
||||
// 转换为日期格式："Nov 26, 2024"
|
||||
let resultData = res.data.data.map((item) => {
|
||||
return {
|
||||
date: new Date(item.t).toLocaleDateString("en-US", {
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
year: "numeric",
|
||||
date: new Date(item.date).toLocaleDateString('en-US', {
|
||||
month: 'short',
|
||||
day: 'numeric',
|
||||
year: 'numeric',
|
||||
}),
|
||||
open: item.o != null ? Number(item.o).toFixed(2) : "",
|
||||
high: item.h != null ? Number(item.h).toFixed(2) : "",
|
||||
low: item.l != null ? Number(item.l).toFixed(2) : "",
|
||||
close: item.c != null ? Number(item.c).toFixed(2) : "",
|
||||
adjClose: item.a != null ? Number(item.a).toFixed(2) : "",
|
||||
change: item.ch != null ? Number(item.ch).toFixed(2) + "%" : "",
|
||||
volume: item.v,
|
||||
};
|
||||
});
|
||||
state.tableData = resultData;
|
||||
open: item.open != null ? Number(item.open).toFixed(2) : '',
|
||||
high: item.high != null ? Number(item.high).toFixed(2) : '',
|
||||
low: item.low != null ? Number(item.low).toFixed(2) : '',
|
||||
close: item.close != null ? Number(item.close).toFixed(2) : '',
|
||||
adjClose: item.close != null ? Number(item.close).toFixed(2) : '',
|
||||
change:
|
||||
item.changePercent != null
|
||||
? Number(item.changePercent).toFixed(2) + '%'
|
||||
: '',
|
||||
volume: item.volume,
|
||||
}
|
||||
};
|
||||
})
|
||||
state.tableData = resultData
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
Loading…
Reference in New Issue
Block a user