From e4b6441426b8e3cc7ffda6aaf8a7b8697fb37663 Mon Sep 17 00:00:00 2001 From: xlmessage <3240982126@qq.com> Date: Thu, 13 Feb 2025 14:30:03 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BB=A3=E7=A0=81=E4=BC=98=E5=8C=96=E6=95=B4?= =?UTF-8?q?=E7=90=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 30 ++-- index.html | 3 +- src/assets/base.css | 63 -------- src/endnew/NewStyleDesign.vue | 42 +----- src/router/index.ts | 3 - src/store/usestylestore.ts | 0 src/views/TheNewView.vue | 266 +++++++++++----------------------- vite.config.ts | 2 +- 8 files changed, 99 insertions(+), 310 deletions(-) delete mode 100644 src/store/usestylestore.ts diff --git a/README.md b/README.md index abe83bc..ec15047 100644 --- a/README.md +++ b/README.md @@ -1,33 +1,25 @@ -# asideviewts - -This template should help get you started developing with Vue 3 in Vite. - -## Recommended IDE Setup - -[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur). - -## Type Support for `.vue` Imports in TS - -TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) to make the TypeScript language service aware of `.vue` types. - -## Customize configuration - -See [Vite Configuration Reference](https://vite.dev/config/). - -## Project Setup +## 项目依赖安装 ```sh npm install ``` -### Compile and Hot-Reload for Development +### 运行项目 ```sh npm run dev ``` -### Type-Check, Compile and Minify for Production +### 项目打包 ```sh npm run build ``` + +## 说明 + +node版本：20.13.1 + +vue版本：3.5.13 + +项目无法运行，检查版本。 diff --git a/index.html b/index.html index fbbd0b2..0d57e3d 100644 --- a/index.html +++ b/index.html @@ -4,12 +4,13 @@ - Vite App + 股票信息 diff --git a/src/assets/base.css b/src/assets/base.css index 21362b7..e03d6b0 100644 --- a/src/assets/base.css +++ b/src/assets/base.css @@ -36,66 +36,3 @@ --my-light-fc-2: #414040; } -/* semantic color variables for this project */ -/* :root { - --color-background: var(--vt-c-white); - --color-background-soft: var(--vt-c-white-soft); - --color-background-mute: var(--vt-c-white-mute); - - --color-border: var(--vt-c-divider-light-2); - --color-border-hover: var(--vt-c-divider-light-1); - - --color-heading: var(--vt-c-text-light-1); - --color-text: var(--vt-c-text-light-1); - - --section-gap: 160px; -} - -@media (prefers-color-scheme: dark) { - :root { - --color-background: var(--vt-c-black); - --color-background-soft: var(--vt-c-black-soft); - --color-background-mute: var(--vt-c-black-mute); - - --color-border: var(--vt-c-divider-dark-2); - --color-border-hover: var(--vt-c-divider-dark-1); - - --color-heading: var(--vt-c-text-dark-1); - --color-text: var(--vt-c-text-dark-2); - } -} - -*, -*::before, -*::after { - box-sizing: border-box; - margin: 0; - font-weight: normal; -} - -body { - min-height: 100vh; - color: var(--color-text); - background: var(--color-background); - transition: - color 0.5s, - background-color 0.5s; - line-height: 1.6; - font-family: - Inter, - -apple-system, - BlinkMacSystemFont, - 'Segoe UI', - Roboto, - Oxygen, - Ubuntu, - Cantarell, - 'Fira Sans', - 'Droid Sans', - 'Helvetica Neue', - sans-serif; - font-size: 15px; - text-rendering: optimizeLegibility; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} */ diff --git a/src/endnew/NewStyleDesign.vue b/src/endnew/NewStyleDesign.vue index 2aec231..393b01e 100644 --- a/src/endnew/NewStyleDesign.vue +++ b/src/endnew/NewStyleDesign.vue @@ -182,7 +182,6 @@ let chartConfigs = ref([ name: 'MACD', type: 'bar', barWidth: '1', - // symbol: 'none', data: [], }, ], @@ -219,7 +218,6 @@ let chartConfigs = ref([ }, yAxis: { type: 'value', - // splitNumber: 3 , interval: 10, }, series: [ @@ -271,15 +269,6 @@ let chartConfigs = ref([ data: [], symbol: 'none', smooth: true, - // lineStyle: { - // width: 1, - // }, - // areaStyle: { - // opacity: 0.5, - // }, - // itemStyle: { - // color: 'rgba(0,128,255,1)', - // }, }, { name: 'D', @@ -287,15 +276,6 @@ let chartConfigs = ref([ data: [], symbol: 'none', smooth: true, - // lineStyle: { - // width: 1, - // }, - // areaStyle: { - // opacity: 0.5, - // }, - // itemStyle: { - // color: 'rgba(0,128,255,1)', - // }, }, { name: 'J', @@ -303,15 +283,6 @@ let chartConfigs = ref([ data: [], symbol: 'none', smooth: true, - // lineStyle: { - // width: 1, - // }, - // areaStyle: { - // opacity: 0.5, - // }, - // itemStyle: { - // color: 'rgba(0,128,255,1)', - // }, }, ], }, @@ -1697,17 +1668,6 @@ onBeforeUnmount(() => { > - - - @@ -1729,7 +1689,7 @@ onBeforeUnmount(() => { } .newk{ flex: 2; - border: 1px solid rgb(190, 187, 187); + border-bottom: 1px solid rgb(190, 187, 187); } .newd{ flex: 2; diff --git a/src/router/index.ts b/src/router/index.ts index 80973d7..52bec42 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -1,8 +1,5 @@ import { createRouter, createWebHashHistory } from 'vue-router'; -// const route = useRoute(); - - const router = createRouter({ history: createWebHashHistory(import.meta.env.BASE_URL), routes: [ diff --git a/src/store/usestylestore.ts b/src/store/usestylestore.ts deleted file mode 100644 index e69de29..0000000 diff --git a/src/views/TheNewView.vue b/src/views/TheNewView.vue index 8a96f70..db501f4 100644 --- a/src/views/TheNewView.vue +++ b/src/views/TheNewView.vue @@ -5,15 +5,21 @@ import { Edit, Plus, Delete, View, Hide,Operation } from '@element-plus/icons-vu import { ElMessageBox, ElTable, ElMessage, ElLoading } from 'element-plus' import type { CollapseModelValue } from 'element-plus' import axios from 'axios' -// import { vscode } from './uilts/vscode' -import { RouterView } from 'vue-router' import HomeView from './HomeView.vue' const message = ref(''); // 用于存储要发送的消息 -const klineIframe = ref(null); // 引用 iframe 元素 - // --------------------后台数据-------------- +/** + * 请求后端接口数据，侧边栏的信息，当前是获取指定用户的信息。与万策页面是关联的，用户登录过后，可在 + * 万策页面进行保存筛选条件（保存的是一个请求参数），可在数据库的user_strategy表中查看。 + * 通过https://wance.cqxqg.tech/api/v1/strategy/getStockPageList接口发送请求得到相关股票数据。 + * 后端的逻辑处理可在src/akshare_data/router.py文件中查看。 + * 由于user_strategy表中的信息仅仅是请求参数，对我在后续中对分组管理操作无任何帮助，所以我将请求返回来的数据进行存储在 + * 新的一个数据库表中，名为new_user_strategy的数据库表中。 + * 最后通过新的接口，得到股票数据，显示在侧边栏中。 + * 下面代码的逻辑大致就是这样。 + */ axios({ url: 'http://127.0.0.1:8012/akshare/userstrategy', method: 'get', @@ -53,7 +59,7 @@ axios({ } ) .then((res) => { - console.log(res.data.data.list) + // console.log(res.data.data.list) let nowdata = res.data.data.list let opt = [] @@ -121,9 +127,6 @@ axios({ }) const activeNames = ref(['0']) -const handleChange = (val: string[]) => { - console.log(val) -} const showChangeVisible = ref(true) @@ -140,14 +143,17 @@ const handleClose = (done: () => void) => { .then(() => { done() }) - .catch(() => { - // catch error - }) + .catch(() => {}) } // -------------------股票信息------------------------------- - - +/** + * 股票信息，通过axios请求后端接口，得到股票信息，并保存在stocktypes.value中。 + * stocktypes.value是一个数组，数组中的每个元素都是一个对象，对象中包含股票的信息， + * 包括股票的id、label、value、state、info等属性。 + * stocktypes.value是一个数组，数组中的每个元素都是一个对象，对象中包含股票的信息， + * 包括股票的id、label、value、state、info等属性。 + */ interface StockType { id?: string label: string @@ -159,6 +165,11 @@ interface StockType { let cacheinfo = ref([]) +/** + * 固定分类，始终有港股、美股、沪深等分类。 + * stocktypes.value是一个数组，数组中的每个元素都是一个对象，对象中包含股票的信息， + * 包括股票的id、label、value、state、info等属性。 + */ let stocktypes = ref([ { id: '1', @@ -206,12 +217,9 @@ axios({ // --------------------切换是否可见-------------------------- const changestate = (item: any) => { item.state = !item.state - // console.log(item.state) } let asideshow = computed(() => { - // console.log(stocktypes.value) - return stocktypes.value.filter((item) => item.state) }) @@ -229,7 +237,7 @@ interface Equity { // ---------------------往info数组里面加股票数据------------------- const inputhandle = ref('') const filterTableData = computed(() =>{ - let newarr = cacheinfo.value.flat(); // 使用 flat 方法将多维数组展平 + let newarr = cacheinfo.value.flat(); return newarr.filter( (data) => !inputhandle.value || @@ -239,13 +247,9 @@ const filterTableData = computed(() =>{ }) // 添加新股票完成 const handleEdit = (index: number, row: Equity) => { - console.log(index, row) - stocklog.value?.info.push(row) - // 添加后移除，也可以不移除 // tableData2.value = tableData2.value.filter((data) => data.code !== row.code) - let mes = myitems.value[index] || '' // 存在自己的数据库表中 let newpostparam = { @@ -254,7 +258,6 @@ const handleEdit = (index: number, row: Equity) => { message: [mes], info: showdata.value, } - axios.post('http://127.0.0.1:8012/akshare/newupdata', newpostparam) } @@ -511,65 +514,41 @@ let kindofstock = ref() const clickTypeState = (val: CollapseModelValue) => { kindofstock.value = val } +// 定义一个URL映射对象 +const stockUrls = { + ganggu: 'http://127.0.0.1:8012/akshare/ganggudataK', + meigu: 'http://127.0.0.1:8012/akshare/meigudataK', + hushen: 'http://127.0.0.1:8012/akshare/hushendataK' +} as any; + +// 定义一个通用的发送请求的函数 +const fetchStockData = (url: string, symbol: string, startDate: string, endDate: string) => { + axios({ + url: url, + method: 'get', + params: { + symbol: symbol, + start_date: startDate, + end_date: endDate + }, + }).then((res) => { + console.log('数据传输成功'); + }).catch(error => { + console.error('请求失败，请检查URL是否正确或稍后重试。', error); + }); +}; + const chioseStock = (item: any) => { - - // vscode.postMessage({ - // command: 'showkline', - // text: item.code, - // }) - - // window.postMessage(item.code,'*'); // 发送消息 - // 如果需要与 iframe 中的内容交互，可以通过 postMessage 发送消息 - // if (klineIframe.value && klineIframe.value.contentWindow) { - // klineIframe.value.contentWindow.postMessage( - // { type: 'SHOW_KLINE', data: item.code }, - // '*' // 目标 origin，设置为 '*' 表示不限制 - // ); - // } - message.value = item.code; // 设置消息内容 + const stockType = kindofstock.value; + const url = stockUrls[stockType]; - if(kindofstock.value == '港股'){ - axios({ - url: 'http://127.0.0.1:8012/akshare/ganggudataK', - method: 'get', - params: { - symbol: item.code, - start_date: '2023-01-01', - end_date: getDate() - }, - }).then((res) => { - console.log('数据传输成功') - }) + if (url) { + fetchStockData(url, item.code, '2023-01-01', getDate()); + } else { + console.error('未找到对应的股票类型'); } - else if(kindofstock.value == '美股'){ - axios({ - url: 'http://127.0.0.1:8012/akshare/meigudataK', - method: 'get', - params: { - symbol: item.code, - start_date: '2023-01-01', - end_date: getDate() - }, - }).then((res) => { - console.log('数据传输成功') - }) - } - else if(kindofstock.value == '沪深'){ - axios({ - url: 'http://127.0.0.1:8012/akshare/hushendataK', - method: 'get', - params: { - symbol: item.code, - start_date: '2023-01-01', - end_date: getDate() - }, - }).then((res) => { - console.log('数据传输成功') - }) - } - -} +}; // --------------------------------------------- // -------------------------------更新日期----------------------------------------- const getDate = () => { @@ -581,106 +560,47 @@ const getDate = () => { return formattedDate } -const sendmessage = (content: any) => { +// 定义一个URL映射对象 +const urls = { + hs300: 'http://127.0.0.1:8012/akshare/stock', + zz500: 'http://127.0.0.1:8012/akshare/stock', + sse: 'http://127.0.0.1:8012/akshare/stock', + szse: 'http://127.0.0.1:8012/akshare/stock', + zz1000: 'http://127.0.0.1:8012/akshare/stock', + gz2000: 'http://127.0.0.1:8012/akshare/stock', + ganggu: 'http://127.0.0.1:8012/akshare/ganggudataK', + meigu: 'http://127.0.0.1:8012/akshare/meigudataK', + hushen: 'http://127.0.0.1:8012/akshare/hushendataK' +} as any; + +const sendmessage = (content: any, url: string) => { axios({ - url: 'http://127.0.0.1:8012/akshare/stock', + url: url, method: 'get', params: { - symbol: 'sz' + content.code, + symbol: content.type === 'ganggu' || content.type === 'meigu' || content.type === 'hushen' ? content.code : 'sz' + content.code, start_date: '2023-01-01', end_date: getDate() }, }).then((res) => { - console.log('数据传输成功') + console.log('数据传输成功'); }).catch(error => { - console.error(error); + console.error('请求失败，请检查URL是否正确或稍后重试。', error); }); -} +}; + const showkline = (content: any) => { - - - // vscode.postMessage({ - // command: 'showkline', - // text: content.code, - // }) - // window.postMessage(content.code,'*'); // 发送消息 - - // 如果需要与 iframe 中的内容交互，可以通过 postMessage 发送消息 - // if (klineIframe.value && klineIframe.value.contentWindow) { - // klineIframe.value.contentWindow.postMessage( - // { type: 'SHOW_KLINE', data: content.code }, - // '*' // 目标 origin，设置为 '*' 表示不限制 - // ); - // } - message.value = content.code; // 设置消息内容 + // console.log(content); - console.log(content); - if(content.type == "hs300"){ - sendmessage(content) + const url = urls[content.type] || urls['ganggu']; // 默认使用 'ganggu' URL + if (url) { + sendmessage(content, url); + } else { + console.error('未找到对应的URL类型'); } - if(content.type == "zz500"){ - sendmessage(content) - } - if(content.type == "sse"){ - sendmessage(content) - } - if(content.type == "szse"){ - sendmessage(content) - } - if(content.type == "zz1000"){ - sendmessage(content) - } - if(content.type == "gz2000"){ - sendmessage(content) - } - if(content.type == "other"){ - sendmessage(content) - } - if(content.type == "ganggu"){ - axios({ - url: 'http://127.0.0.1:8012/akshare/ganggudataK', - method: 'get', - params: { - symbol: content.code, - start_date: '2023-01-01', - end_date: getDate() - }, - }).then((res) => { - console.log('数据传输成功') - }) - } - if(content.type == "meigu"){ - axios({ - url: 'http://127.0.0.1:8012/akshare/meigudataK', - method: 'get', - params: { - symbol: content.code, - start_date: '2023-01-01', - end_date: getDate() - }, - }).then((res) => { - console.log('数据传输成功') - }) - } - if(content.type == "hushen"){ - axios({ - url: 'http://127.0.0.1:8012/akshare/hushendataK', - method: 'get', - params: { - symbol: content.code, - start_date: '2023-01-01', - end_date: getDate() - }, - }).then((res) => { - console.log('数据传输成功') - }) - } - - - -} +};