Skip to content

M
mcep-h5
提交 ac398206 编写于 作者: jiangzaicheng's avatar jiangzaicheng
浏览文件
操作

成长值

上级 25ab6006
隐藏空白字符变更
内嵌 并排
正在显示 包含 166 行增加 和 86 行删除
src/components/common/Tool.vue
浏览文件 @ ac398206
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: jiangzaicheng jiangzaicheng_jzc@163.com * @Author: jiangzaicheng jiangzaicheng_jzc@163.com
* @Date: 2022-07-04 16:24:00 * @Date: 2022-07-04 16:24:00
* @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com * @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com
* @LastEditTime: 2022-07-07 16:11:33 * @LastEditTime: 2022-07-26 15:20:42
* @FilePath: \mcep-h5\src\components\common\Tatle.vue * @FilePath: \mcep-h5\src\components\common\Tatle.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
--> -->
...@@ -36,7 +36,7 @@ ...@@ -36,7 +36,7 @@
<van-row class="imgNo"> <van-row class="imgNo">
<van-col span="6" class="imglocal">存款理想试算</van-col> <van-col span="6" class="imglocal">存款理想试算</van-col>
<van-col span="6" class="imglocal">理财产品 </van-col> <van-col span="6" class="imglocal">理财产品 </van-col>
<van-col span="6" class="imglocal">自主贷款</van-col> <van-col span="6" class="imglocal">自助贷款</van-col>
<van-col span="6" class="imglocal">积分商城</van-col> <van-col span="6" class="imglocal">积分商城</van-col>
</van-row> </van-row>
</div> </div>
......
src/views/workbench/Growth.vue
浏览文件 @ ac398206
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: jiangzaicheng jiangzaicheng_jzc@163.com * @Author: jiangzaicheng jiangzaicheng_jzc@163.com
* @Date: 2022-07-07 16:13:13 * @Date: 2022-07-07 16:13:13
* @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com * @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com
* @LastEditTime: 2022-07-25 19:37:06 * @LastEditTime: 2022-07-26 20:22:02
* @FilePath: \mcep-h5\src\components\common\Bottom.vue * @FilePath: \mcep-h5\src\components\common\Bottom.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
--> -->
...@@ -16,45 +16,57 @@ ...@@ -16,45 +16,57 @@
<van-col span="15">{{ tatleName }}</van-col> <van-col span="15">{{ tatleName }}</van-col>
</van-row> </van-row>
<div class="card"> <div class="card">
<van-row type="flex" justify="center" class="integral"> <div class="d-flex flex-column">
<van-col span="24" style="font-size: 24px;font-weight: 900; margin-top: 10%;">{{ number }}</van-col> <!-- <div class="d-flex p-3 text-white"> -->
</van-row> <van-row type="flex" justify="center" class="integral">
<van-row type="flex" justify="center" class="integrall"> <van-col span="24"
<van-col span="24">{{ growthName }}</van-col> style="font-size: 24px;font-weight: 900; margin-top: 2%;text-align: center;color:rgb(255, 147, 0);">{{
</van-row> number
<van-row type="flex" class="layoutStep" gutter="2"> }}</van-col>
<van-col span="24"> </van-row>
<van-steps :active="2" :active-icon="img" :finish-icon="img" active-color=" #FFA121"> <van-row type="flex" justify="center" class="integrall">
<van-step></van-step> <van-col span="24" style="text-align: center;color:rgb(255, 147, 0);">{{ growthName }}</van-col>
<van-step></van-step> </van-row>
<van-step></van-step> <van-row type="flex" class="layoutStep" gutter="2">
<van-step></van-step> <van-col span="24">
</van-steps> <van-steps :active="2" :active-icon="img" :finish-icon="img" active-color=" #FFA121">
</van-col> <van-step></van-step>
</van-row> <van-step></van-step>
<van-row type="flex" class="layoutDiv" gutter="2"> <van-step></van-step>
<van-col span="24" class="layoutName"> <van-step></van-step>
距离升级三星用户还差1468成长值 </van-steps>
</van-col>
</van-row>
</div>
<div class="frist_type">
<div class="layoutSeep" v-for="(item, index) in growthList" :key="index">
<van-row type="flex" class="layoutDetils">
<van-col span="12" class="repaymentName">
<van-row type="flex">
<van-col span="24" class="records">{{ item.records }}</van-col>
</van-row>
<van-row type="flex">
<van-col span="24" class="time">{{ item.time }}</van-col>
</van-row>
</van-col> </van-col>
<van-col span="12" class="repaymentNumber"> </van-row>
<van-col span="24" class="numberlive">{{ item.number }}</van-col> <van-row type="flex" class="layoutDiv" gutter="2">
<van-col span="24" class="layoutName">
距离升级三星用户还差1468成长值
</van-col> </van-col>
</van-row> </van-row>
<!-- </div> -->
</div> </div>
</div> </div>
<div class="frist_type">
<van-row type="flex" class="vanrowFlex">
<van-col span="24" class="vanclo">
<van-row v-for="(item, index) in growthList" :key="index" class="cardId">
<van-row type="flex">
<van-col span="12" class="repaymentName">
<van-row type="flex">
<van-col span="24" class="records">{{ item.records }}</van-col>
</van-row>
<van-row type="flex">
<van-col span="24" class="time">{{ item.time }}</van-col>
</van-row>
</van-col>
<van-col span="12" class="repaymentNumber">
<van-col span="24" class="numberlive">{{ item.number }}</van-col>
</van-col>
</van-row>
</van-row>
</van-col>
</van-row>
</div>
</div> </div>
</template> </template>
...@@ -70,7 +82,7 @@ import 'ant-design-vue/dist/antd' ...@@ -70,7 +82,7 @@ import 'ant-design-vue/dist/antd'
export default class Growth extends Vue { export default class Growth extends Vue {
number: string | undefined = "532"; //额度 number: string | undefined = "532"; //额度
growthName: string | undefined = " 成长值";//额度大写 growthName: string | undefined = " 成长值";//额度大写
tatleName = "成长值明细" tatleName = "成长值明细";
img = require("@/assets/images/stars.png") img = require("@/assets/images/stars.png")
//数据源growthList //数据源growthList
growthList = [{ growthList = [{
...@@ -86,7 +98,41 @@ export default class Growth extends Vue { ...@@ -86,7 +98,41 @@ export default class Growth extends Vue {
time: "2021/02/21 03:14:12", time: "2021/02/21 03:14:12",
number: "+10" number: "+10"
}] }]
imageBackage: any = require('@/assets/images/backageImg.png');
//返回上一级
retyen() {
this.$router.back();
}
//数表
tableData = [{
level: '免费转账',
name: '王小虎',
province: '上海',
city: '普陀区',
address: '上海市普陀区金沙江路 1518 弄',
zip: 200333
}, {
level: '客户',
name: '王小虎',
province: '上海',
city: '普陀区',
address: '上海市普陀区金沙江路 1518 弄',
zip: 200333
}, {
level: '存款加息',
name: '王小虎',
province: '上海',
city: '普陀区',
address: '上海市普陀区金沙江路 1518 弄',
zip: 200333
}, {
level: '贷款减息',
name: '王小虎',
province: '上海',
city: '普陀区',
address: '上海市普陀区金沙江路 1518 弄',
zip: 200333
}]
...@@ -95,54 +141,31 @@ export default class Growth extends Vue { ...@@ -95,54 +141,31 @@ export default class Growth extends Vue {
<style scoped lang="scss"> <style scoped lang="scss">
.card { .card {
//background-image: url("../../assets/images/mycard.png"); //background-image: url("../../assets/images/mycard.png");
margin: 0px auto; // background-color: #ffc14a;
background-color: rgba(255, 255, 255, 1); // position: absolute;
// top: 12%;
// left: 4%;
// right: 3%;
// width: 89%;
// height: 11%;
// margin: 2% auto;
// border-radius: 15px;
// display: flex;
// font-weight: 400;
// font-style: normal;
background-color: #ffffff;
position: absolute; position: absolute;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.12156862745098); top: 12%;
top: 13%; left: 1%;
/* left: calc(100vh - -15px); */ right: 3%;
margin: 0px auto; width: 98%;
right: 4%; height: 24%;
width: 90%; /* height: 22%; */
height: 30%;
/* margin: 2% auto; */ /* margin: 2% auto; */
border-radius: 5px; border-radius: 15px;
/* display: flex; */ display: flex;
font-weight: 400;
font-style: normal;
}
.layoutName {
text-align: center;
font-family: 'Arial Normal', 'Arial';
font-weight: 400; font-weight: 400;
font-style: normal; font-style: normal;
font-size: 10px;
letter-spacing: normal;
color: #333333;
}
.layoutStep {
text-align: center;
}
.integral {
//margin-top: 10%;
/* margin-left: 20%; */
text-align: center;
width: 90%;
height: 66px;
margin: 0px auto;
font-size: 36px;
color: #FFA121;
}
.integrall {
//margin-top: 10%;
/* margin-left: 20%; */
text-align: center;
color: #FFA121;
font-size: 12px;
} }
.last { .last {
...@@ -162,7 +185,7 @@ export default class Growth extends Vue { ...@@ -162,7 +185,7 @@ export default class Growth extends Vue {
// background-color: #fff; // background-color: #fff;
// } // }
.frist_type { .frist_type {
margin-top: 30%; margin-top: 15%;
background-image: url('../../assets/images/backageImg.png'); background-image: url('../../assets/images/backageImg.png');
background-size: 100% 100%; background-size: 100% 100%;
height: 85%; height: 85%;
...@@ -182,6 +205,46 @@ export default class Growth extends Vue { ...@@ -182,6 +205,46 @@ export default class Growth extends Vue {
margin: 0px auto; margin: 0px auto;
} }
.cardId {
margin-top: 4%;
box-shadow: 0px 0px 10px rgba(217, 209, 209, 0.996);
line-height: 44px;
width: 98%;
}
.records {
padding-left: 8%;
font-family: 'Arial Normal', 'Arial';
font-weight: 400;
font-style: normal;
font-size: 14px;
letter-spacing: normal;
color: rgba(0, 0, 0, 0.8);
}
.time {
padding-left: 8%;
font-family: 'Arial Normal', 'Arial';
font-weight: 400;
font-style: normal;
letter-spacing: normal;
font-size: 10px;
color: rgba(0, 0, 0, 0.4);
}
.numberlive {
font-size: 18px;
color: #FF9300;
font-family: 'Arial Normal', 'Arial';
font-weight: 400;
font-style: normal;
text-align: right;
padding-right: 7%;
padding-top: 12%;
letter-spacing: normal;
}
.third { .third {
width: 90%; width: 90%;
margin: 0px auto; margin: 0px auto;
...@@ -231,12 +294,12 @@ export default class Growth extends Vue { ...@@ -231,12 +294,12 @@ export default class Growth extends Vue {
} }
.vanclo { .vanclo {
margin: 20% 0% 4% 6%; margin: 38% 0% 3% 2%;
/* margin-left: 2%; */ /* margin-left: 2%; */
/* margin-top: 20%; */ /* margin-top: 20%; */
font-weight: 500; font-weight: 500;
font-size: 14px; font-size: 14px;
text-align: left; text-align: center
} }
.d-tattle { .d-tattle {
...@@ -278,8 +341,25 @@ export default class Growth extends Vue { ...@@ -278,8 +341,25 @@ export default class Growth extends Vue {
height: 40px; height: 40px;
} }
.ntegrall {
font-size: 24px;
font-weight: 900;
margin-top: 2%;
/* margin: 0px auto; */
text-align: center;
color: #CE8B0B;
}
.layoutName {
text-align: center;
}
.live { .live {
font-size: 12px; font-size: 12px;
color: #CE8B0B; color: #CE8B0B;
} }
.van-steps--horizontal {
padding: 0px 10px 0;
}
</style> </style>
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或