Skip to content

R
revised-version-h5
Commit 86243cfc authored by mengqr's avatar mengqr
Browse files
Options

页面

parent 1fd00405
Show whitespace changes
Inline Side-by-side
Showing with 624 additions and 0 deletions
src/router/router_modular/index.js
View file @ 86243cfc
...@@ -12,6 +12,25 @@ const router_modular = [ ...@@ -12,6 +12,25 @@ const router_modular = [
// this generates a separate chunk (about.[hash].js) for this route // this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited. // which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ '@/views/AboutView.vue') component: () => import(/* webpackChunkName: "about" */ '@/views/AboutView.vue')
},{
path: '/actualCombat',
name: 'actualCombat',
component: () => import('@/views/actualCombat/index')
},
{
path: '/abnormalReview',
name: 'abnormalReview',
component: () => import('@/views/actualCombat/abnormalReview')
},
{
path: '/record',
name: 'record',
component: () => import('@/views/actualCombat/record')
},
{
path: '/detail',
name: 'detail',
component: () => import('@/views/actualCombat/detail')
} }
] ]
export default router_modular export default router_modular
\ No newline at end of file
src/views/actualCombat/abnormalReview.vue 0 → 100644
View file @ 86243cfc
<template>
<div class="content">
<div class="listBox">
<div class="left-box">
<div class="left-time">
<span style="display:block;font-size:0.3rem;color:gray">12-19</span>
<span style="display:block;font-size:0.3rem;color:gray">09:39</span>
</div>
<div class="left-line">
</div>
</div>
<div class="right-box">
<span style="display:block;font-size:0.5rem; font-weight: bold;margin-top:0.2rem">盘中点评</span>
<!-- <van-text-ellipsis :content="text" expand-text="展开" collapse-text="收起" /> -->
<span ref="myDiv" class="overText" style="font-size:0.35rem;margin-top:0.2rem;">盘中点评这是啊飒飒Asia哦撒发达啊沙发沙发破萨满怕是安检门破手机批发爱上方面强迫我反对换个地方恢复鬼画符发是反对鬼地方和梵蒂冈很快就会给客户票佛爱上放大泼妇发票豆腐干地方和广泛的回复</span>
</div>
</div>
</div>
</template>
<script>
// import { mapState, mapMutations } from "vuex";
// import testApi from "@/api/test";
export default {
computed: {
// ...mapState("store_modular", ["name"]),
},
data() {
return {
num: 0,
list: [],
};
},
methods: {
// ...mapMutations("store_modular", ["operation"]),
},
};
</script>
<style scoped>
.listBox{
height: 3rem;
width: 100%;
display: flex;
/* background-color: bisque; */
}
.left-box{
width: 15%;
text-align: center;
height: 3rem;
/* background-color:aqua; */
}
.left-time{
width: 100%;
height: 30%;
/* background-color: blueviolet; */
}
.right-box{
width: 80%;
height: 100%;
border-bottom: 1px solid gray;
margin-left: 2%;
}
.overText{
overflow: hidden;
text-overflow: ellipsis;
width: 100%;
/*将对象作为弹性伸缩盒子模型显示*/
display: -webkit-box;
/*限制文本行数*/
-webkit-line-clamp: 4;
/*子元素的排列方式*/
-webkit-box-orient: vertical;
/*将对象作为弹性伸缩盒子模型显示*/
}
</style>
\ No newline at end of file
src/views/actualCombat/detail.vue 0 → 100644
View file @ 86243cfc
<template>
<div class="content">
<div class="top-box">
<div class="typeList">
<div class="type-box">
<span>激进型</span>
</div>
<div class="type-box">
<span>中风险</span>
</div>
<span class="numberPeople">117人已订阅</span>
</div>
<span class="profit">总收益</span>
<span class="percentage">40.27%</span>
<!-- 线 -->
<div class="line"></div>
</div>
</div>
</template>
<script>
import { mapState, mapMutations } from "vuex";
// import testApi from "@/api/test";
export default {
computed: {
...mapState("store_modular", ["name"]),
},
data() {
return {
num: 0,
list: [],
};
},
methods: {
...mapMutations("store_modular", ["operation"]),
getList() {
this.server
.getListAPI({ num: this.num })
.then((res) => (this.list = res.data.data))
.catch((err) => console.log(err))
.finally(()=>{this.$toast.clear()});
if(this.num==0){
this.$toast.fail("数量不能为0");
return
}
// this.$toast.loading({
// message: '加载中...',
// forbidClick: true,
// duration:0
// });
},
},
};
</script>
<style scoped>
.top-box{
width: 100%;
height: 7rem;
padding-top: 0.3rem;
background-color: rgb(226, 74, 68);
/* border-radius: 0 0 3rem 3rem; */
}
.typeList{
height: 1rem;
width: 100%;
display: flex;
}
.type-box{
height: 0.7rem;
margin-left: 0.3rem;
width: 2rem;
border: 1px solid white;
color: white;
line-height: 0.7rem;
font-size: 0.3rem;
text-align: center;
}
.numberPeople{
font-size: 0.3rem;
color: white;
margin-left: 3.5rem;
margin-top: 0.2rem;
}
.profit{
display: block;
width: 100%;
height: 1.5rem;
text-align: center;
font-size: 0.5rem;
/* font-weight: bold; */
color: white;
margin-top: 1rem;
}
.percentage{
display: block;
width: 100%;
height: 1.5rem;
text-align: center;
font-size: 0.7rem;
font-weight: bold;
color: white;
/* margin-top: 0.1rem; */
}
.line{
height: 0.1rem;
width: 100%;
/* background-color: gray; */
border-bottom:1px solid gray ;
}
</style>
\ No newline at end of file
src/views/actualCombat/index.vue 0 → 100644
View file @ 86243cfc
<template>
<div class="content">
<div class="top-box">
<div class="analyst">
<span>明星分析师</span>
</div>
<div class="tab-box" >
<span :class="tabIndex==0?'table-contect':'table-contectHid'" @click="clickTab('0','总收益')">总收益</span>
<span :class="tabIndex==1?'table-contect':'table-contectHid'" @click="clickTab('1','今年收益')">今年收益</span>
<span :class="tabIndex==2?'table-contect':'table-contectHid'" @click="clickTab('2','月收益')">月收益</span>
<span :class="tabIndex==3?'table-contect':'table-contectHid'" @click="clickTab('3','回撤率')">回撤率</span>
<span :class="tabIndex==4?'table-contect':'table-contectHid'" @click="clickTab('4','胜率')">胜率</span>
<span :class="tabIndex==5?'table-contect':'table-contectHid'" @click="clickTab('5','仓位')">仓位</span>
<!-- <van-tabs type="card" >
<van-tab title="标签 1">内容 1</van-tab>
<van-tab title="标签 2">内容 2</van-tab>
<van-tab title="标签 3">内容 3</van-tab>
</van-tabs> -->
</div>
<!-- 卡片盒子 -->
<div class="card-box">
<div class="left-card">
<div class="card-title">
<span style="display:block;margin-bottom:0.1rem">{{tableName}}</span>
<span style="display:block;font-size:0.5rem;">34.59%</span>
</div>
<span class="left-contect">
大展宏图2024
</span>
<span class="clickBtn">解锁订阅</span>
</div>
<div class="center-card">
<div class="card-title">
<span style="display:block;margin-bottom:0.1rem">{{tableName}}</span>
<span style="display:block;font-size:0.5rem;">34.59%</span>
</div>
<span class="left-contect">
大展宏图2024
</span>
<span class="clickBtn">解锁订阅</span>
</div>
<div class="rigth-card">
<div class="card-title">
<span style="display:block;margin-bottom:0.1rem">{{tableName}}</span>
<span style="display:block;font-size:0.5rem;">34.59%</span>
</div>
<span class="left-contect">
大展宏图2024
</span>
<span class="clickBtn">解锁订阅</span>
</div>
</div>
<!-- 内容盒子 -->
<div class="bottomcontect-box">
<div class="topthis-box">
<div class="top-left">
<span style="display:block;font-size:0.5rem">大展宏图2024</span>
<span style="display:block;font-size:0.5rem">{{tableName}}: <span style="color:red">12.20%</span> </span>
</div>
<div class="top-right">
<span class="clickBtnTwo">解锁订阅</span>
</div>
</div>
<div class="bottomthis-box">
<span style="display:block;font-size:0.4rem;margin-left:0.2rem">仓位 99.90%</span><span style="display:block;font-size:0.5rem;font-size:0.4rem;margin-left:0.4rem">周收益 99.90%</span><span style="display:block;font-size:0.5rem;font-size:0.4rem;margin-left:0.4rem">月 99.90%</span>
</div>
</div>
</div>
<!-- <div style="font-size:18px">{{ name }}</div>
<div>
<van-button type="primary" @click="operation('点赞关注')"
>点我更改信息</van-button
>
</div>
<div>
<van-field v-model="num" label="数量" /><van-button
type="primary"
@click="getList"
>发送请求获取笑话</van-button
>
</div>
<div style="width: 100%">
<van-list>
<van-cell v-for="item in list" :key="item" :title="item" />
</van-list>
</div>
<van-button loading type="info" loading-text="加载中..." /> -->
</div>
</template>
<script>
import { mapState, mapMutations } from "vuex";
// import testApi from "@/api/test";
export default {
computed: {
...mapState("store_modular", ["name"]),
},
data() {
return {
num: 0,
list: [],
tabIndex:0,
tableName:'总收益'
};
},
methods: {
...mapMutations("store_modular", ["operation"]),
getList() {
this.server
.getListAPI({ num: this.num })
.then((res) => (this.list = res.data.data))
.catch((err) => console.log(err))
.finally(()=>{this.$toast.clear()});
if(this.num==0){
this.$toast.fail("数量不能为0");
return
}
// this.$toast.loading({
// message: '加载中...',
// forbidClick: true,
// duration:0
// });
},
//点击标签页
clickTab(index,name){
this.tabIndex=index
this.tableName=name
}
},
};
</script>
<style scoped>
.content{
background-color: rgb(239, 239, 239);
min-height: 100vh;
}
.analyst{
height: 0.8rem;
line-height: 0.8rem;
margin-left: 0.5rem;
/* margin-top: 0.2rem; */
color: white;
border-left: 0.1rem solid white;
width: 4rem;
padding-left: 0.3rem;
/* background-color: aqua; */
font-size: 0.5rem;
/* font-weight: bold; */
}
.top-box{
width: 100%;
height: 7.6rem;
padding-top: 0.3rem;
background-color: rgb(226, 74, 68);
border-radius: 0 0 3rem 3rem;
}
.tab-box{
margin-top: 0.7rem;
display: flex;
}
.table-contect{
background: rgb(251, 230, 230);
width: 16%;
border-radius: 0.1rem;
font-size: 0.35rem;
margin-left: 1%;
text-align: center;
color: rgb(226, 95, 0);
height: 0.8rem;
line-height: 0.8rem;
}
.table-contectHid{
background: rgb(226, 74, 68);
width: 16%;
border-radius: 0.1rem;
font-size: 0.35rem;
margin-left: 1%;
text-align: center;
color: white;
height: 0.8rem;
line-height: 0.8rem;
}
.card-box{
height: 5rem;
width: 90%;
margin: 1rem auto 0;
display: flex;
/* background-color: yellowgreen; */
}
.left-card{
width: 5rem;
height: 3.5rem;
background-color: white;
border-radius: 0.2rem;
margin-top: 1rem;
position: relative;
}
.center-card{
width: 5rem;
height: 4.1rem;
background-color: white;
border-radius: 0.2rem;
margin-top: 0.4rem;
position: relative;
}
.rigth-card{
width: 5rem;
height: 3.5rem;
background-color: white;
border-radius: 0.2rem;
margin-top: 1rem;
position: relative;
}
.left-contect{
font-size: 0.4rem;
}
.clickBtn{
width: 2rem;
line-height: 0.7rem;
border-radius: 1rem;
text-align: center;
height: 0.7rem;
font-size: 0.27rem;
display: block;
background: rgb(226, 74, 68);
color: white;
position: absolute;
bottom: 0.1rem;
left: 0.5rem;
}
.clickBtnTwo{
width: 2rem;
line-height: 0.7rem;
border-radius: 1rem;
text-align: center;
height: 0.7rem;
font-size: 0.27rem;
display: block;
background: rgb(226, 74, 68);
color: white;
margin: auto 0;
/* position: absolute;
bottom: 0.1rem;
left: 0.5rem; */
}
.card-title{
font-size: 0.4rem;
position: absolute;
top: -1.2rem;
left: 1rem;
color: white;
}
.bottomcontect-box{
height: 2.8rem;
width: 90%;
/* background-color: aqua; */
margin: 0 auto;
border-bottom: 1px solid gray ;
}
.topthis-box{
width: 100%;
height: 1.7rem;
display: flex;
/* background-color: yellow; */
}
.top-left{
height: 100%;
width: 70%;
}
.top-right{
height: 100%;
width: 29%;
padding-top: 0.3rem;
}
.bottomthis-box{
display: flex;
line-height: 1rem;
}
</style>
\ No newline at end of file
src/views/actualCombat/record.vue 0 → 100644
View file @ 86243cfc
<template>
<div class="content">
<div class="head-box">
<div class="tab-box">
<span>买/卖</span>
</div>
<div class="tab-box">
<span>当前持仓</span>
</div>
<div class="tab-box">
<span>价格</span>
</div>
<div class="tab-box">
<span>仓位</span>
</div>
<div class="tab-box">
<span>时间</span>
</div>
</div>
<!-- 灰线 -->
<div class="line">
</div>
<div class="contect-list">
<div class="mai">
<span >卖</span>
</div>
<div class="contectBox">
<span>300***</span>
</div>
<div class="contectBox">
<span>*</span>
</div>
<div class="contectBox">
<span>100%</span>
</div>
<div class="contectBox">
<span style="display:block;height:0.5rem;margin-top:-0.3rem">08/26</span>
<span>14:28</span>
</div>
</div>
<!-- 灰线 -->
<div class="lineTwo">
</div>
</div>
</template>
<script>
// import { mapState, mapMutations } from "vuex";
// import testApi from "@/api/test";
export default {
computed: {
// ...mapState("store_modular", ["name"]),
},
data() {
return {
num: 0,
list: [],
};
},
methods: {
// ...mapMutations("store_modular", ["operation"]),
},
};
</script>
<style scoped>
.head-box{
height: 1.2rem;
width: 100%;
display: flex;
background-color: yellow;
}
.tab-box{
width: 20%;
height: 100%;
text-align: center;
line-height: 1.2rem;
font-size: 0.35rem;
background-color: aquamarine;
}
.line{
width: 100%;
height: 0.3rem;
background-color:rgb(246, 247, 249) ;
}
.lineTwo{
width: 100%;
height: 0.5rem;
background-color:rgb(246, 247, 249) ;
}
.contect-list{
display: flex;
height: 1.5rem;
width: 100%;
background-color: yellowgreen;
font-size: 0.5rem;
}
.contectBox{
width: 20%;
height: 100%;
text-align: center;
line-height: 1.5rem;
}
.mai{
display: block;
height: 1rem;
width: 1rem;
border: 1px solid rgb(69, 137, 235);
color: rgb(69, 137, 235);
text-align: center;
line-height: 1rem;
margin: auto;
border-radius: 50%;
}
</style>
\ No newline at end of file
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