Skip to content

R
revised-version-h5
Commit 819b0f78 authored by jiaoyahui's avatar jiaoyahui
Browse files
Options

策略页面布局

parent 1fd00405
Hide whitespace changes
Inline Side-by-side
Showing with 932 additions and 8 deletions
package.json
View file @ 819b0f78
......@@ -12,8 +12,8 @@
"amfe-flexible": "^2.2.1",
"axios": "^0.27.2",
"core-js": "^3.8.3",
"postcss-pxtorem": "^6.0.0",
"vant": "^2.12.48",
"lib-flexible": "^0.3.2",
"vant": "^2.13.2",
"vue": "^2.6.14",
"vue-router": "^3.5.1",
"vuex": "^3.6.2",
......@@ -32,6 +32,7 @@
"eslint-plugin-vue": "^8.0.3",
"less": "^4.0.0",
"less-loader": "^8.0.0",
"postcss-pxtorem": "^6.1.0",
"vue-template-compiler": "^2.6.14"
},
"eslintConfig": {
......
src/api/test.js
View file @ 819b0f78
......@@ -12,6 +12,22 @@ const testApi = {
},
postFormAPI(params) {
return http.post('/api/user/reg', params)
}
}
},
//策略列表/invest/admin/pc/smart/product/{id}
getstrge(params) {
return http.post('/invest/admin/pc/smart/product-list', params)
},
//策略详情
getproduct_strge(params,id) {
return http.get('/invest/admin/pc/smart/product/'+id, params)
},
//策略历史战绩
gethistoricalRecord(params,id) {
return http.get('/invest/admin/pc/smart/historicalRecord', params)
}
};
export default testApi
src/config/index.js
View file @ 819b0f78
......@@ -2,10 +2,14 @@ export default {
/**接口请求的基础路径 */
baseUrl: {
dev: 'http://192.168.0.93:8080', // 开发路径
dev: 'https://test6.douniu8.com/', // 开发路径
// dev: 'https://autumnfish.cn',
// dev: 'http://10.0.0.147:8301',
pro: 'https://autumnfish.cn' // 生产路径
},
/****** request拦截器==>对请求参数做处理 ******/
};
src/main.js
View file @ 819b0f78
......@@ -6,7 +6,7 @@ import store from './store'
import 'amfe-flexible';
import Vant from 'vant';
import 'vant/lib/index.css';
import axios from 'axios'
import axios from 'axios';
Vue.use(Vant);
Vue.config.productionTip = false
Vue.prototype.server = server; //引入接口服务
......
src/router/router_modular/index.js
View file @ 819b0f78
const router_modular = [
{
path: '/strategyversion',
name: 'strategyversion',
component: () => import('@/views/strategyversion/index')
},
{
path: '/strategy',
name: 'strategy',
component: () => import('@/views/strategy/index')
},
{
path: '/strategyversion',
name: 'strategyversion',
component: () => import('@/views/strategyversion/index')
},
{
path: '/record',
name: 'record',
component: () => import('@/views/record/index')
},
{
path: '/',
name: 'record',
component: () => import('@/views/record/index')
},
{
path: '/',
name: 'home',
......@@ -12,6 +45,7 @@ const router_modular = [
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ '@/views/AboutView.vue')
}
},
]
export default router_modular
\ No newline at end of file
src/utils/request.js
View file @ 819b0f78
......@@ -10,6 +10,7 @@ const baseUrl =
const service = axios.create({
// 公共接口--这里注意后面会讲
baseURL:baseUrl,
// 超时时间 单位是ms，这里设置了3s的超时时间
timeout: 3 * 1000
})
......@@ -18,13 +19,14 @@ service.interceptors.request.use(config => {
//发请求前做的一些处理，数据转化，配置请求头，设置token,设置loading等，根据需求去添加
config.data = JSON.stringify(config.data); //数据转化,也可以使用qs转换
config.headers = {
'Content-Type':'application/json' //配置请求头
'Content-Type':'application/json' ,//配置请求头
'Authorization': 'Bearer eyJhbGciOiJIUzUxMiJ9.eyJleHAiOjE3MjYyMTk2MjQsInN1YiI6IjQ4MjY2NiIsImlhdCI6MTcyNTYxNDgyNH0.S-vd6o_eb5-IwSBIs39kRb-tI-2rRrMYlj3dTKgU_GqylRpv3GBVjeNzjSxXVnfRFp68OWTW8f_A085uTjP-Sw'
}
//如有需要：注意使用token的时候需要引入cookie方法或者用本地localStorage等方法，推荐js-cookie
//const token = getCookie('名称');//这里取token之前，你肯定需要先拿到token,存一下
// if(token){
// config.params = {'token':token} //如果要求携带在参数中
// config.headers.token= token; //如果要求携带在请求头中
// config.headers.token= token; //如果要求携带在请求头中
// }
return config
}, error => {
......
src/views/record/index.vue 0 → 100644
View file @ 819b0f78
<template>
<div class="contain">
<van-nav-bar
title="历史战绩"
left-text=""
left-arrow
@click-left="onClickLeft"
/>
<div class="plog">
<div class="oul">
<div>股票代码</div>
<div>
⼊选⽇期
<img
src="../../assets/bottom.png"
alt=""
class="oimg_sent"
v-if="is_show"
@click="tab_omg"
/>
<img
src="../../assets/top.png"
alt=""
class="oimg_sent"
v-if="isshow"
@click="tab_img"
/>
</div>
<div>⼊选价格</div>
<div>
⼊选后最⾼涨幅
<img
src="../../assets/top.png"
alt=""
class="oimg_sent"
v-if="s_show"
@click="tab_sel"
/>
<img
src="../../assets/bottom.png"
alt=""
class="oimg_sent"
v-if="l_show"
@click="tab_let"
/>
</div>
<div>持仓天数</div>
</div>
<ul class="user_ul">
<li class="name">
<div class="price">
<div>三祥新材</div>
<div>999</div>
</div>
<div class="se_data">2024-08-28</div>
<div class="se_data">14.5</div>
<div class="se_data_p">+7.71%</div>
<div class="se_data_t">2</div>
</li>
<li class="name">
<div class="price">
<div>三祥新材</div>
<div>999</div>
</div>
<div class="se_data">2024-08-28</div>
<div class="se_data">14.5</div>
<div class="se_data_p">+7.71%</div>
<div class="se_data_t">2</div>
</li>
</ul>
</div>
</div>
</template>
<script type="text/ecmascript-6">
export default {
setup() {
const onCdivckLeft = () => history.back();
return {
onCdivckLeft,
};
},
data() {
return {
isshow: true,
is_show: false,
s_show: true,
l_show: false,
};
},
created() {},
mounted() {},
methods: {
getsent_p(){
let params={
}
this.server.gethistoricalRecord(params).then(res=>{
this.getList = res.data.data.list
console.log(res)
})
},
onClickLeft() {
this.$router.push("../strategy");
},
tab_img: function () {
this.isshow = false;
this.is_show = true;
},
tab_omg: function () {
this.isshow = true;
this.is_show = false;
},
tab_sel: function () {
this.s_show = false;
this.l_show = true;
},
tab_let: function () {
this.s_show = true;
this.l_show = false;
},
},
components: {},
};
</script>
<style scoped>
.oul {
display: flex;
justify-content: space-around;
margin-top: 20px;
border-bottom: 1px solid #d5d8db;
padding-bottom: 21px;
/* padding-left: 10px; */
margin-left: 6px;
margin-right: 6px;
}
.contain {
position: relative;
}
.plog {
position: fixed;
top: 83px;
width: 100%;
}
.oul div {
color: #4e4a4a;
font-size: 0.18rem;
}
.van-nav-bar {
position: relative;
z-index: 1;
background-color: #e03939;
-webkit-user-select: none;
color: white;
user-select: none;
}
::v-deep .van-nav-bar__content {
position: relative;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-adivgn: center;
-webkit-adivgn-items: center;
height: 58px;
}
::v-deep .van-nav-bar__title {
max-width: 60%;
margin: 0 auto;
/* color: #323233; */
font-weight: 500;
font-size: 16px;
color: white !important;
}
.user_ul .name {
font-size: 0.2rem;
border-bottom: 1px solid #d5d8db;
display: flex;
line-height: 27px;
margin-top: 7px;
}
.user_ul {
border-bottom: 1px solid #d5d8db;
margin-left: 6px;
margin-right: 6px;
line-height: 22px;
/* margin-top: 20px; */
}
::v-deep .van-icon-arrow-left:before {
color: white;
}
.oimg_sent {
width: 9px;
height: 11px;
margin-left: 1px;
}
.se_data {
width:18%;
line-height: 41px;
text-align:center;
}
.se_data_p {
text-align:center;
color: red;
line-height: 41px;
width:28%
}
.se_data_t{
width:16%;
text-align:center;
line-height: 41px;
}
.price{
text-align: center;
width: 17%;
}
::v-deep .van-nav-bar__title {
max-width: 60%;
margin: 0 auto;
font-size: 16px;
font-weight: bolder;
color: white !important;
}
</style>
src/views/strategy/index.vue 0 → 100644
View file @ 819b0f78
<template>
<div>
<div class="contaion">
<div class="ster">
<img
src="../../assets/left.png"
alt=""
style="width: 3%; height: 5%; "
@click="tab_oimg"
/>
<div class="deta">策略详情</div>
</div>
<span>热点精选</span> <span>324⼈订阅</span>
<p class="tab_user">
对热点股票强度深度建模，优选热点持续且潜⼒,持久的成⻓性股票
</p>
<p></p>
<div>
<span>综合胜率:<span>84.43%</span></span>
<span style="margin-left: 41px">平均涨幅:<span>13.04%</span></span>
</div>
<img
src=""
alt=""
class="oimg"
style="width: 90px; height: 90px"
/>
</div>
<div class="data_time">今日入选</div>
<div>
<div class="nav">
<div>股票代码</div>
<div>⼊选时间</div>
<div>⼊选价格</div>
<div>涨跌幅</div>
</div>
<div class="p_alog">
<div class="oul">
<div class="odiv">
<div>三祥新材</div>
<div>999</div>
</div>
<div class="odiv">2024-08-28</div>
<div class="odiv_p">14.5</div>
<div class="odiv">22</div>
</div>
<div class="oul">
<div class="odiv">
<div>三祥新材</div>
<div>999</div>
</div>
<div class="odiv">2024-08-28</div>
<div class="odiv_p">14.5</div>
<div class="odiv">22</div>
</div>
<div class="user_con">
<div class="sent">
<img
src="../../assets/sure.png"
alt=""
style="width:8%; height: 36px
margin-left:38%"
/>
</div>
<van-button type="danger">解锁订阅</van-button>
</div>
</div>
</div>
<div class="usert_n">
<span @click="whole">全部战绩</span>
<img src="../../assets/back.png" alt="" style="width: 6px;margin-left: 12px;" />
</div>
<div class="alogn">
<div class="cont">
<div class="tab_p">
<img src="../../assets/jian.png" alt="" class="tab_img">
<div class="name_u">紫天科技</div>
<div class="user_t">97.06%</div>
<div class="user_se">⼊选最⾼涨幅</div>
</div>
<div class="tab_p">
<img src="../../assets/jian.png" alt="" class="tab_img">
<div class="name_u">紫天科技</div>
<div class="user_t">97.06%</div>
<div class="user_se">⼊选最⾼涨幅</div>
</div>
<div class="tab_p">
<img src="../../assets/jian.png" alt="" class="tab_img">
<div class="name_u">紫天科技</div>
<div class="user_t">97.06%</div>
<div class="user_se">⼊选最⾼涨幅</div>
</div>
</div>
<!-- <div class="uaser_a">
<img src="../../assets/jian.png" alt="" class="tab_img">
<div class="cont">紫天科技</div>
<div class="cont_p">97.06%</div>
<div class="cont_sent">⼊选最⾼涨幅</div>
</div>
<div class="uaser_a">
<div class="cont">紫天科技</div>
<div class="cont_p">97.06%</div>
<div class="cont_sent">⼊选最⾼涨幅</div>
</div>
<div class="uaser_a">
<div class="cont">紫天科技</div>
<div class="cont_p">97.06%</div>
<div class="cont_sent">⼊选最⾼涨幅</div>
</div> -->
</div>
<img
src=""
alt=""
style="width: 100%; height: 200px; border: 1px solid red"
/>
</div>
</template>
<script type="text/ecmascript-6">
export default {
setup() {
const onCdivckLeft = () => history.back();
return {
onCdivckLeft,
};
},
data() {
return {};
},
created() {},
mounted() {},
methods: {
getproduct_s(id){
let params={
}
this.server.getproduct_strge(params,id).then(res=>{
this.getList = res.data.data.list
console.log(res)
})
},
tab_oimg: function () {
this.$router.push("../strategyversion");
},
whole: function () {
this.$router.push("../record");
},
},
components: {},
};
</script>
<style scoped>
::v-deep .van-nav-bar__content {
position: relative;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
}
::v-deep .van-nav-bar__title {
max-width: 60%;
margin: 0 auto;
/* color: #323233; */
font-weight: 500;
font-size: 16px;
color: white !important;
}
.van-nav-bar {
position: relative;
z-index: 1;
background-color: #e03939;
-webkit-user-select: none;
color: white;
user-select: none;
}
::v-deep .van-nav-bar__content {
position: relative;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-adivgn: center;
-webkit-adivgn-items: center;
height: 194px;
}
.ster {
display: flex;
}
.deta {
width: 70%;
text-align: center;
margin-left: 34px;
font-size: 0.5rem;
color: white;
font-weight: bolder;
}
.contaion {
padding: 20px;
background: #e03939;
position: relative;
}
.contaion span {
font-size: 0.4rem;
color: white;
}
.tab_user {
font-size: 0.4rem;
color: white;
margin-bottom: 6px;
margin-top: 14px;
width: 50%;
}
.data_time {
color: red;
width: 76px;
font-size: 0.4rem;
border-bottom: 2px solid red;
padding-bottom: 6px;
margin: 20px;
font-weight: bolder;
}
.nav {
display: flex;
justify-content: space-around;
}
.nav div {
margin-bottom: 20px;
font-size: 0.4rem;
}
.oul {
display: flex;
justify-content: space-around;
border-bottom: 1px solid rgb(206, 198, 198);
margin-left: 3px;
margin-right: 10px;
padding-bottom: 9px;
padding-top: 15px;
display: none;
}
.oul .oli {
display: flex;
}
.odiv {
font-size: 0.3rem;
}
.oimg {
position: absolute;
right: 30px;
top: 44px;
}
.p_alog {
position: relative;
}
.sent {
/* text-align: center; */
}
.van-button--normal {
padding: 0 15px;
font-size: 14px;
}
.user_con{
text-align: center;
}
.usert_n {
font-size: 0.2rem;
margin-top: 25px;
width: 97%;
text-align: right;
}
.uaser_a {
width: 110px;
height: 102px;
position: relative;
background: #fffbe8;
border: 1px solid red;
border-radius: 6%;
}
.alogn {
display: flex;
justify-content: space-around;
margin-top: 22px;
}
.cont {
margin-top: 20px;
width: 95%;
font-size: 0.3rem;
}
.cont_p {
text-align:center;
margin-top: 10px;
font-size: 0.3rem;
}
.cont_sent {
margin-top: 5px;
font-size: 0.3rem;
text-align: center;
}
.data_time[data-v-6cf378d0] {
color: red;
width: 19%;
font-size: 0.4rem;
border-bottom: 2px solid red;
padding-bottom: 6px;
margin: 20px;
font-weight: bolder;
text-align: center;
}
.odiv_p {
color: red;
font-size: 0.3rem;
}
::v-deep .van-button--danger {
color: #fff;
background-color: #ee0a24;
border: 1px solid #ee0a24;
background: #e03939;
}
.cont {
height: 135px;
background: #f0f5f9;
display: flex;
margin-top: 10px;
}
.tab_p {
width: 40%;
height: 85%;
background: #fffbe8;
border: 1px solid red;
border-radius: 6%;
margin: 5px;
position: relative;
}
.jian{
width: 90px;
position: absolute;
bottom: 16px;
left: 8px;
}
.tab_img{
width: 90px;
position: absolute;
bottom: 16px;
left: 8px;
}
.name_u {
font-size: 0.3rem;
/* padding-left: 25px; */
padding-top: 14px;
text-align: center;
}
.user_t {
font-size: 0.46rem;
color: red;
/* padding-left: 19px; */
padding-top: 9px;
text-align: center;
}
.user_se {
font-size: 0.3rem;
padding-left: 9px;
padding-top: 9px;
text-align: center;
}
</style>
src/views/strategyversion/index.vue 0 → 100644
View file @ 819b0f78
<template>
<div class="">
<div class="contain">
<van-nav-bar title="策略版" left-text="" @click-left="onClickLeft" />
<!-- <van-notice-bar left-icon="volume-o" :scrollable="false">
<van-swipe
vertical
class="notice-swipe"
:autoplay="3000"
:show-indicators="false"
>
<van-swipe-item>内容 1</van-swipe-item>
<van-swipe-item>内容 2</van-swipe-item>
<van-swipe-item>内容 3</van-swipe-item>
</van-swipe>
</van-notice-bar> -->
<div class="user">
<div class="sre_p" @click="tab_let">
<div class="uset_a">
<span>热点精选</span>
<span class="num">324⼈订阅</span>
</div>
<div>
<span>综合胜率: <span>84.1%</span></span>
<span style="margin-left:14px">平均涨幅: <span>84.2%</span></span>
</div>
<div class="read">解锁订阅</div>
</div>
<div class="cont">
<div class="tab_p">
<img src="../../assets/jian.png" alt="" class="tab_img">
<div class="name_u">紫天科技</div>
<div class="user_t">97.06%</div>
<div class="user_se">⼊选最⾼涨幅</div>
</div>
<div class="tab_p">
<img src="../../assets/jian.png" alt="" class="tab_img">
<div class="name_u">紫天科技</div>
<div class="user_t">97.06%</div>
<div class="user_se">⼊选最⾼涨幅</div>
</div>
<div class="tab_p">
<img src="../../assets/jian.png" alt="" class="tab_img">
<div class="name_u">紫天科技</div>
<div class="user_t">97.06%</div>
<div class="user_se">⼊选最⾼涨幅</div>
</div>
</div>
</div>
<div class="user">
<div class="sre_p" @click="tab_let">
<div class="uset_a">
<span>热点精选</span>
<span class="num">324⼈订阅</span>
</div>
<div>
<span>综合胜率: <span>84.1%</span></span>
<span style="margin-left:14px">平均涨幅: <span>84.2%</span></span>
</div>
<div class="read">解锁订阅</div>
</div>
<div class="cont">
<div class="tab_p">
<img src="../../assets/jian.png" alt="" class="tab_img">
<div class="name_u">紫天科技</div>
<div class="user_t">97.06%</div>
<div class="user_se">⼊选最⾼涨幅</div>
</div>
<div class="tab_p">
<img src="../../assets/jian.png" alt="" class="tab_img">
<div class="name_u">紫天科技</div>
<div class="user_t">97.06%</div>
<div class="user_se">⼊选最⾼涨幅</div>
</div>
<div class="tab_p">
<img src="../../assets/jian.png" alt="" class="tab_img">
<div class="name_u">紫天科技</div>
<div class="user_t">97.06%</div>
<div class="user_se">⼊选最⾼涨幅</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
// import {getListAPI} from '../../api/test.js'
export default {
data() {
return {};
},
created() {},
mounted() {
this.getsent()
},
methods: {
getsent(){
let params={
}
this.server.getstrge(params).then(res=>{
if(res.code == 200){
this.getList = res.data.data.list
console.log(res)
}
})
},
tab_let() {
this.$router.push("../strategy");
},
onClickLeft() {
this.$router.push("../strategy");
Toast("返回");
},
},
components: {},
};
</script>
<style scoped>
.van-nav-bar {
position: relative;
z-index: 1;
background-color: #e03939;
-webkit-user-select: none;
color: white;
user-select: none;
}
::v-deep .van-nav-bar__content {
position: relative;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-adivgn: center;
-webkit-adivgn-items: center;
height: 94px;
}
.van-notice-bar {
position: relative;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
height: 40px;
padding: 0 16px;
color: #ed6a0c;
font-size: 14px;
line-height: 24px;
background-color: #f7eec2;
}
.tab_img{
width: 90px;
position: absolute;
bottom: 16px;
left: 8px;
}
::v-deep .van-nav-bar__title {
max-width: 60%;
margin: 0 auto;
/* color: #323233; */
font-weight: 500;
font-size: 16px;
color: white !important;
}
.notice-swipe {
height: 40px;
line-height: 40px;
}
.user {
width: 83%;
height: 300px;
margin: 30px;
}
.sre_p {
height: 120px;
background: #e03939;
position: relative;
padding-top: 20px;
padding-left: 20px;
}
.uset_a {
display: flex;
}
.cont {
height: 135px;
background: #f0f5f9;
display: flex;
margin-top: 10px;
}
.sre_p span {
font-size: 0.3rem;
color: white;
}
.num {
width: 29%;
height: 26px;
text-align: center;
display: block;
background: #e03939;
line-height: 28px;
margin-left: 10px;
}
.read {
position: absolute;
right: 5%;
font-size: 0.3rem;
top: 25%;
background: white;
color: red;
width: 22%;
line-height: 29px;
text-align: center;
height: 29px;
border-radius: 7% 7% 7% 7%;
}
.tab_p {
width: 40%;
height: 85%;
background: #fffbe8;
border: 1px solid red;
border-radius: 6%;
margin: 5px;
position: relative;
}
.name_u {
font-size: 0.3rem;
/* padding-left: 25px; */
padding-top: 14px;
text-align: center;
}
.user_t {
font-size: 0.46rem;
color: red;
/* padding-left: 19px; */
padding-top: 9px;
text-align: center;
}
.user_se {
font-size: 0.3rem;
padding-left: 9px;
padding-top: 9px;
text-align: center;
}
::v-deep .van-icon-arrow-left:before {
color: white;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment