Skip to content

M
mcep-h5
提交 87f8365a 编写于 作者: “grape”'s avatar “grape”
浏览文件
操作

主页单选

上级 ce638afd
显示空白字符变更
内嵌 并排
正在显示 包含 431 行增加 和 112 行删除
src/views/main/Main.vue
浏览文件 @ 87f8365a
...@@ -2,36 +2,61 @@ ...@@ -2,36 +2,61 @@
* @Author: jiangzaicheng jiangzaicheng_jzc@163.com * @Author: jiangzaicheng jiangzaicheng_jzc@163.com
* @Date: 2022-07-05 14:05:30 * @Date: 2022-07-05 14:05:30
* @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com * @LastEditors: jiangzaicheng jiangzaicheng_jzc@163.com
* @LastEditTime: 2022-08-18 13:52:56 * @LastEditTime: 2022-07-28 15:44:01
* @FilePath: \mcep-h5\src\views\main\MainView.vue * @FilePath: \mcep-h5\src\views\main\MainView.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
--> -->
<template> <template>
<div class="d-page d-flex flex-column" style=" background-color: #ebedf0"> <div class="d-page d-flex flex-column" style="background-color: #ebedf0">
<div class="rarle"> <div class="rarle">
<tools-bar :title="tatleName" style="width:100%;height: calc(25vh);"> <tools-bar :title="tatleName" style="width: 100%; height: calc(25vh)">
</tools-bar> </tools-bar>
</div> </div>
<div class="roolsolt"> <div class="roolsolt">
<van-row class="roll" background="#ecf9ff" style="background: #ecf9ff;width: 90%;height: 34px;margin: 2% auto; border-radius: 10px;position: absolute; top: 21%; <van-row
left: 5%;"> class="roll"
<van-col span="5" class="titleName" background="#ecf9ff"
style="height: 34px;margin: 7px auto 0px 8px; border-radius: 12px; color: #a2d2f4;"> style="
background: #ecf9ff;
width: 90%;
height: 34px;
margin: 2% auto;
border-radius: 10px;
position: absolute;
top: 21%;
left: 5%;
"
>
<van-col
span="5"
class="titleName"
style="
height: 34px;
margin: 7px auto 0px 8px;
border-radius: 12px;
color: #a2d2f4;
"
>
审批进度 审批进度
</van-col> </van-col>
<van-col span="18" class="notice"> <van-col span="18" class="notice">
<van-notice-bar left-icon="volume-o" color="#1989fa" background="#ecf9ff" <van-notice-bar
style="height: 34px; border-radius: 12px;"> left-icon="volume-o"
color="#1989fa"
background="#ecf9ff"
style="height: 34px; border-radius: 12px"
>
{{ notice }} {{ notice }}
</van-notice-bar> </van-notice-bar>
</van-col> </van-col>
</van-row> </van-row>
</div> </div>
<div style="background-color: #ffff; height: 18%">
<div style="background-color: #ffff;height: 18%;">
<div class="prudect"> <div class="prudect">
<span style="font-size: 18px;font-weight: 600;margin-left: 4%;">推荐产品</span> <span style="font-size: 18px; font-weight: 600; margin-left: 4%"
>推荐产品</span
>
</div> </div>
<div> <div>
<!-- <van-tabs v-model="activeName"> <!-- <van-tabs v-model="activeName">
...@@ -40,39 +65,156 @@ ...@@ -40,39 +65,156 @@
<van-tab title="期限" name="c"></van-tab> <van-tab title="期限" name="c"></van-tab>
<van-tab title="利率" name="d"></van-tab> <van-tab title="利率" name="d"></van-tab>
</van-tabs> --> </van-tabs> -->
<van-dropdown-menu style="height:100%;"> <van-dropdown-menu style="height: 100%">
<van-dropdown-item title="综合排序" ref="item" style="height:100%"> <van-dropdown-item title="综合排序" ref="item" style="height: 100%">
<div class="application" v-for="(item, index) in applicaList" :key="index"> <div
class="application"
v-for="(item, index) in applicaList.slice(0, 1)"
:key="index"
>
<van-row type="flex" class="applicationName"> <van-row type="flex" class="applicationName">
<van-col span="24">{{ item.name }}</van-col> <van-col span="24">{{ item.name }}</van-col>
</van-row> </van-row>
<van-row type="flex" class="applicationfale"> <van-row type="flex" class="applicationfale">
<van-col span="10">
<div class="vandiv">{{ item.min }}</div>
</van-col>
<van-col span="2">-</van-col>
<van-col span="10"> <van-col span="10">
<div class="vandiv">{{ item.max }}</div> <div class="vandiv">{{ item.max }}</div>
</van-col> </van-col>
</van-row>
<van-row type="flex" gutter="10" class="applicationfole">
<!-- div-->
<van-col span="6">
<div :class="vanvcol11" @click="clickButton1(index,1)">
{{ item.fristsize }}
</div>
</van-col>
<van-col span="6">
<div :class="vanvcol12" @click="clickButton1(index,2)">{{ item.secondsize }}</div>
</van-col>
<van-col span="6">
<div :class="vanvcol13" @click="clickButton1(index,3)">{{ item.thirdsize }}</div>
</van-col>
<van-col span="6">
<div :class="vanvcol14" @click="clickButton1(index,4)">{{ item.foursize }}</div>
</van-col>
</van-row>
<div
class="application"
v-for="(item, index) in applicaList.slice(1, 2)"
:key="index"
>
<van-row type="flex" class="applicationName">
<van-col span="24">{{ item.name }}</van-col>
</van-row>
<van-row type="flex" class="applicationfale">
<van-col span="10">
<div class="vandiv">{{ item.min }}</div>
</van-col>
<van-col span="2">-</van-col> <van-col span="2">-</van-col>
<van-col span="10">
<div class="vandiv">{{ item.max }}</div>
</van-col>
</van-row>
<van-row type="flex" gutter="10" class="applicationfole">
<!-- div-->
<van-col span="6">
<div :class="vanvcol21" @click="clickButton2(index,1)"> {{ item.fristsize }}
</div>
</van-col>
<van-col span="6">
<div :class="vanvcol22" @click="clickButton2(index,2)">{{ item.secondsize }}</div>
</van-col>
<van-col span="6">
<div :class="vanvcol23" @click="clickButton2(index,3)">{{ item.thirdsize }}</div>
</van-col>
<van-col span="6">
<div :class="vanvcol24" @click="clickButton2(index,4)">{{ item.foursize }}</div>
</van-col>
</van-row>
</div>
<div
class="application"
v-for="(item, index) in applicaList.slice(3, 4)"
:key="index"
>
<van-row type="flex" class="applicationName">
<van-col span="24">{{ item.name }}</van-col>
</van-row>
<van-row type="flex" class="applicationfale">
<van-col span="10"> <van-col span="10">
<div class="vandiv">{{ item.min }}</div> <div class="vandiv">{{ item.min }}</div>
</van-col> </van-col>
<van-col span="2">-</van-col>
<van-col span="10">
<div class="vandiv">{{ item.max }}</div>
</van-col>
</van-row> </van-row>
<van-row type="flex" gutter="10" class="applicationfole"> <van-row type="flex" gutter="10" class="applicationfole">
<!-- div--> <!-- div-->
<van-col span="6"> <van-col span="6">
<div class="vandilote">{{ item.fristsize }}</div> <div :class="vanvcol41" @click="clickButton4(index,1)"> {{ item.fristsize }}
</div>
</van-col> </van-col>
<van-col span="6"> <van-col span="6">
<div class="vandilote">{{ item.secondsize }}</div> <div :class="vanvcol42" @click="clickButton4(index,2)">{{ item.secondsize }}</div>
</van-col> </van-col>
<van-col span="6"> <van-col span="6">
<div class="vandilote">{{ item.thirdsize }}</div> <div :class="vanvcol43" @click="clickButton4(index,3)">{{ item.thirdsize }}</div>
</van-col> </van-col>
<van-col span="6"> <van-col span="6">
<div class="vandilote">{{ item.foursize }}</div> <div :class="vanvcol44" @click="clickButton4(index,4)">{{ item.foursize }}</div>
</van-col> </van-col>
</van-row> </van-row>
</div> </div>
<div style="margin-top: 4%;">
<div
class="application"
v-for="(item, index) in applicaList.slice(2, 3)"
:key="index"
>
<van-row type="flex" class="applicationName">
<van-col span="24">{{ item.name }}</van-col>
</van-row>
<van-row type="flex" class="applicationfale">
<van-col span="10">
<div class="vandiv">{{ item.min }}</div>
</van-col>
<van-col span="2">-</van-col>
<van-col span="10">
<div class="vandiv">{{ item.max }}</div>
</van-col>
</van-row>
<van-row type="flex" gutter="10" class="applicationfole">
<!-- div-->
<van-col span="6">
<div :class="vanvcol31" @click="clickButton3(index,1)"> {{ item.fristsize }}
</div>
</van-col>
<van-col span="6">
<div :class="vanvcol32" @click="clickButton3(index,2)">{{ item.secondsize }}</div>
</van-col>
<van-col span="6">
<div :class="vanvcol33" @click="clickButton3(index,3)">{{ item.thirdsize }}</div>
</van-col>
<van-col span="6">
<div :class="vanvcol34" @click="clickButton3(index,4)">{{ item.foursize }}</div>
</van-col>
</van-row>
</div>
</div>
<div style="margin-top: 4%">
<van-row type="flex"> <van-row type="flex">
<van-col span="12"> <van-col span="12">
<van-button square block type="default">重置</van-button> <van-button square block type="default">重置</van-button>
...@@ -84,37 +226,43 @@ ...@@ -84,37 +226,43 @@
</div> </div>
</van-dropdown-item> </van-dropdown-item>
<van-dropdown-item title="金额" ref="item"> <van-dropdown-item title="金额" ref="item">
<div class="application" v-for="(item, index) in applicaform" :key="index"> <div
class="application"
v-for="(item, index) in applicaList.slice(0, 1)"
:key="index"
>
<van-row type="flex" class="applicationName"> <van-row type="flex" class="applicationName">
<van-col span="24">{{ item.name }}</van-col> <van-col span="24">{{ item.name }}</van-col>
</van-row> </van-row>
<van-row type="flex" class="applicationfale"> <van-row type="flex" class="applicationfale">
<van-col span="10"> <van-col span="10">
<div class="vandiv">{{ item.max }}</div> <div class="vandiv">{{ item.min }}</div>
</van-col> </van-col>
<van-col span="2">-</van-col> <van-col span="2">-</van-col>
<van-col span="10"> <van-col span="10">
<div class="vandiv">{{ item.min }}</div> <div class="vandiv">{{ item.max }}</div>
</van-col> </van-col>
</van-row> </van-row>
<van-row type="flex" gutter="10" class="applicationfole"> <van-row type="flex" gutter="10" class="applicationfole">
<!-- div--> <!-- div-->
<van-col span="6"> <van-col span="6">
<div class="vandilote">{{ item.fristsize }}</div> <div :class="vanvcol11" @click="clickButton1(index,1)">
{{ item.fristsize }}
</div>
</van-col> </van-col>
<van-col span="6"> <van-col span="6">
<div class="vandilote">{{ item.secondsize }}</div> <div :class="vanvcol12" @click="clickButton1(index,2)">{{ item.secondsize }}</div>
</van-col> </van-col>
<van-col span="6"> <van-col span="6">
<div class="vandilote">{{ item.thirdsize }}</div> <div :class="vanvcol13" @click="clickButton1(index,3)">{{ item.thirdsize }}</div>
</van-col> </van-col>
<van-col span="6"> <van-col span="6">
<div class="vandilote">{{ item.foursize }}</div> <div :class="vanvcol14" @click="clickButton1(index,4)">{{ item.foursize }}</div>
</van-col> </van-col>
</van-row> </van-row>
</div> </div>
<div style="margin-top: 4%;"> <div style="margin-top: 4%">
<van-row type="flex"> <van-row type="flex">
<van-col span="12"> <van-col span="12">
<van-button square block type="default">重置</van-button> <van-button square block type="default">重置</van-button>
...@@ -126,37 +274,42 @@ ...@@ -126,37 +274,42 @@
</div> </div>
</van-dropdown-item> </van-dropdown-item>
<van-dropdown-item title="期限" ref="item"> <van-dropdown-item title="期限" ref="item">
<div class="application" v-for="(item, index) in applicaform" :key="index"> <div
class="application"
v-for="(item, index) in applicaList.slice(1, 2)"
:key="index"
>
<van-row type="flex" class="applicationName"> <van-row type="flex" class="applicationName">
<van-col span="24">{{ item.name }}</van-col> <van-col span="24">{{ item.name }}</van-col>
</van-row> </van-row>
<van-row type="flex" class="applicationfale"> <van-row type="flex" class="applicationfale">
<van-col span="10"> <van-col span="10">
<div class="vandiv">{{ item.max }}</div> <div class="vandiv">{{ item.min }}</div>
</van-col> </van-col>
<van-col span="2">-</van-col> <van-col span="2">-</van-col>
<van-col span="10"> <van-col span="10">
<div class="vandiv">{{ item.min }}</div> <div class="vandiv">{{ item.max }}</div>
</van-col> </van-col>
</van-row> </van-row>
<van-row type="flex" gutter="10" class="applicationfole"> <van-row type="flex" gutter="10" class="applicationfole">
<!-- div--> <!-- div-->
<van-col span="6"> <van-col span="6">
<div class="vandilote">{{ item.fristsize }}</div> <div :class="vanvcol21" @click="clickButton2(index,1)"> {{ item.fristsize }}
</div>
</van-col> </van-col>
<van-col span="6"> <van-col span="6">
<div class="vandilote">{{ item.secondsize }}</div> <div :class="vanvcol22" @click="clickButton2(index,2)">{{ item.secondsize }}</div>
</van-col> </van-col>
<van-col span="6"> <van-col span="6">
<div class="vandilote">{{ item.thirdsize }}</div> <div :class="vanvcol23" @click="clickButton2(index,3)">{{ item.thirdsize }}</div>
</van-col> </van-col>
<van-col span="6"> <van-col span="6">
<div class="vandilote">{{ item.foursize }}</div> <div :class="vanvcol24" @click="clickButton2(index,4)">{{ item.foursize }}</div>
</van-col> </van-col>
</van-row> </van-row>
</div> </div>
<div style="margin-top: 4%;"> <div style="margin-top: 4%">
<van-row type="flex"> <van-row type="flex">
<van-col span="12"> <van-col span="12">
<van-button square block type="default">重置</van-button> <van-button square block type="default">重置</van-button>
...@@ -168,37 +321,42 @@ ...@@ -168,37 +321,42 @@
</div> </div>
</van-dropdown-item> </van-dropdown-item>
<van-dropdown-item title="利率" ref="item"> <van-dropdown-item title="利率" ref="item">
<div class="application" v-for="(item, index) in applicaform" :key="index"> <div
class="application"
v-for="(item, index) in applicaList.slice(2, 3)"
:key="index"
>
<van-row type="flex" class="applicationName"> <van-row type="flex" class="applicationName">
<van-col span="24">{{ item.name }}</van-col> <van-col span="24">{{ item.name }}</van-col>
</van-row> </van-row>
<van-row type="flex" class="applicationfale"> <van-row type="flex" class="applicationfale">
<van-col span="10"> <van-col span="10">
<div class="vandiv">{{ item.max }}</div> <div class="vandiv">{{ item.min }}</div>
</van-col> </van-col>
<van-col span="2">-</van-col> <van-col span="2">-</van-col>
<van-col span="10"> <van-col span="10">
<div class="vandiv">{{ item.min }}</div> <div class="vandiv">{{ item.max }}</div>
</van-col> </van-col>
</van-row> </van-row>
<van-row type="flex" gutter="10" class="applicationfole"> <van-row type="flex" gutter="10" class="applicationfole">
<!-- div--> <!-- div-->
<van-col span="6"> <van-col span="6">
<div class="vandilote">{{ item.fristsize }}</div> <div :class="vanvcol31" @click="clickButton3(index,1)"> {{ item.fristsize }}
</div>
</van-col> </van-col>
<van-col span="6"> <van-col span="6">
<div class="vandilote">{{ item.secondsize }}</div> <div :class="vanvcol32" @click="clickButton3(index,2)">{{ item.secondsize }}</div>
</van-col> </van-col>
<van-col span="6"> <van-col span="6">
<div class="vandilote">{{ item.thirdsize }}</div> <div :class="vanvcol33" @click="clickButton3(index,3)">{{ item.thirdsize }}</div>
</van-col> </van-col>
<van-col span="6"> <van-col span="6">
<div class="vandilote">{{ item.foursize }}</div> <div :class="vanvcol34" @click="clickButton3(index,4)">{{ item.foursize }}</div>
</van-col> </van-col>
</van-row> </van-row>
</div> </div>
<div style="margin-top: 4%;"> <div style="margin-top: 4%">
<van-row type="flex"> <van-row type="flex">
<van-col span="12"> <van-col span="12">
<van-button square block type="default">重置</van-button> <van-button square block type="default">重置</van-button>
...@@ -211,64 +369,97 @@ ...@@ -211,64 +369,97 @@
</van-dropdown-item> </van-dropdown-item>
</van-dropdown-menu> </van-dropdown-menu>
</div> </div>
<scroller-view v-calculate-height :height="10000" > <scroller-view v-calculate-height>
<div v-for="(item, index) in productList" :key="index" style="margin: 4% auto;"> <div
<picket-bar :productname="item.productname" :describe="item.describe" :limitrange="item.limitrange" v-for="(item, index) in productList"
:interestrate="item.interestrate" :loanterm="item.loanterm" @onClickPicket="onClickPicket"></picket-bar> :key="index"
style="margin: 4% auto"
>
<picket-bar
:productname="item.productname"
:describe="item.describe"
:limitrange="item.limitrange"
:interestrate="item.interestrate"
:loanterm="item.loanterm"
@onClickPicket="onClickPicket"
></picket-bar>
</div> </div>
</scroller-view> </scroller-view>
</div> </div>
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts">
import { Component, Vue } from "vue-property-decorator"; import { Component, Vue } from "vue-property-decorator";
import { ProductData } from '@/model/entity/ProductData' import { ProductData } from "@/model/entity/ProductData";
import { i } from "mathjs";
@Component({ @Component({
name: "Main", name: "Main",
}) })
export default class Main extends Vue { export default class Main extends Vue {
tatleName = "线上金融服务平台" tatleName = "线上金融服务平台";
notice = "在代码阅读过程中人们说脏话的频率是衡量代码质量的唯一标准。" notice = "在代码阅读过程中人们说脏话的频率是衡量代码质量的唯一标准。";
vanvcol11 = "vandilote";
vanvcol12 ="vandilote";
vanvcol13 ="vandilote";
vanvcol14 ="vandilote";
vanvcol21 = "vandilote";
vanvcol22 ="vandilote";
vanvcol23 ="vandilote";
vanvcol24 ="vandilote";
vanvcol31 = "vandilote";
vanvcol32 ="vandilote";
vanvcol33 ="vandilote";
vanvcol34 ="vandilote";
vanvcol41 = "vandilote";
vanvcol42 ="vandilote";
vanvcol43 ="vandilote";
vanvcol44 ="vandilote";
//测试 //测试
demo() { demo() {
this.$router.push({ this.$router.push({
path: "/CustomerMgtView" path: "/CustomerMgtView",
} });
)
} }
//div列表 //div列表
applicaList: any = [ applicaList: any = [
{ {
name: "产品金额（万元）", name: "产品金额（万元）",
max: "最高", max: "最高",
min: "最低", min: "最低",
fristsize: "1-100", fristsize: "1~100",
secondsize: "100-500", secondsize: "100~500",
thirdsize: "500-1000", thirdsize: "500~1000",
foursize: "1000-2000" foursize: "1000~2000",
select: null,
}, },
{ {
name: "产品期限(月)", name: "产品期限(月)",
max: "最高", max: "最高",
min: "最低", min: "最低",
fristsize: "1-100", fristsize: "1~12",
secondsize: "100-500", secondsize: "1~24",
thirdsize: "500-1000", thirdsize: "12~24",
foursize: "1000-2000" foursize: "12~36",
select: null,
}, },
{ {
name: "产品利率(%)", name: "产品利率(%)",
max: "最高", max: "最高",
min: "最低", min: "最低",
fristsize: "1-100", fristsize: "1~3%",
secondsize: "100-500", secondsize: "2~4%",
thirdsize: "500-1000", thirdsize: "3~5%",
foursize: "1000-2000" foursize: "4~6%",
select: null,
}, },
{ {
name: "担保方式", name: "担保方式",
...@@ -277,8 +468,10 @@ export default class Main extends Vue { ...@@ -277,8 +468,10 @@ export default class Main extends Vue {
fristsize: "抵押", fristsize: "抵押",
secondsize: "质押", secondsize: "质押",
thirdsize: "信用", thirdsize: "信用",
foursize: "保证" foursize: "保证",
select: null,
}, },
// { // {
// name: "产品金额（万元）", // name: "产品金额（万元）",
// max: "最高", // max: "最高",
...@@ -306,7 +499,7 @@ export default class Main extends Vue { ...@@ -306,7 +499,7 @@ export default class Main extends Vue {
// thirdsize: "500-1000", // thirdsize: "500-1000",
// foursize: "1000-2000" // foursize: "1000-2000"
// } // }
] ];
//金额 //金额
applicaform: any = [ applicaform: any = [
{ {
...@@ -316,44 +509,31 @@ export default class Main extends Vue { ...@@ -316,44 +509,31 @@ export default class Main extends Vue {
fristsize: "1-100", fristsize: "1-100",
secondsize: "100-500", secondsize: "100-500",
thirdsize: "500-1000", thirdsize: "500-1000",
foursize: "1000-2000" foursize: "1000-2000",
} },
] ];
//按钮 //按钮
tabbarlist: any = { tabbarlist: any = {
name: "首页", name: "首页",
flag: true flag: true,
} };
productList: ProductData[] = [
productList: ProductData[] = [{
productname: "金融消费贷", //产品名称
describe: "一次核查 三年有效 随用随贷 循环使用",//描述
limitrange: "1000~2000",//额度范围
interestrate: "19%~20%",//利率
loanterm: "89个月",//贷款期限
},
{ {
productname: "白领贷", //产品名称
describe: "额度较大 使用人群 工薪阶级",//描述
limitrange: "1000~2000",//额度范围
interestrate: "19%~20%",//利率
loanterm: "89个月",//贷款期限
}, {
productname: "金融消费贷", //产品名称 productname: "金融消费贷", //产品名称
describe: "1年100万",//描述 describe: "1年100万", //描述
limitrange: "1000~2000",//额度范围 limitrange: "1000~2000", //额度范围
interestrate: "19%~20%",//利率 interestrate: "19%~20%", //利率
loanterm: "89个月",//贷款期限 loanterm: "89个月", //贷款期限
}, },
{ {
productname: "金融消费贷", //产品名称 productname: "金融消费贷", //产品名称
describe: "1年100万",//描述 describe: "1年100万三年内还清了", //描述
limitrange: "1000~2000",//额度范围 limitrange: "1000~2000", //额度范围
interestrate: "19%~20%",//利率 interestrate: "19%~20%", //利率
loanterm: "89个月",//贷款期限 loanterm: "89个月", //贷款期限
} },
]; ];
//点击picket跳转界面 //点击picket跳转界面
onClickPicket() { onClickPicket() {
...@@ -363,9 +543,138 @@ export default class Main extends Vue { ...@@ -363,9 +543,138 @@ export default class Main extends Vue {
// params:{ // params:{
// data:"" // data:""
// } // }
}) });
} }
} //切换
clickButton1(index: number,item:number) {
var select =this.applicaList[index].sellet=item;
console.log( this.applicaList[index].sellet);
if (item=== 1) {
this.vanvcol11 = "vancoll";
this.vanvcol12 = "vandilote";
this.vanvcol13 = "vandilote";
this.vanvcol14 = "vandilote";
console.log( this.applicaList[index].sellet);
} else if(item=== 2){
this.vanvcol11 = "vandilote";
this.vanvcol12 = "vancoll";
this.vanvcol13 = "vandilote";
this.vanvcol14 = "vandilote";
}else if(item=== 3){
this.vanvcol11 = "vandilote";
this.vanvcol12 = "vandilote";
this.vanvcol13 = "vancoll";
this.vanvcol14 = "vandilote";
}
else if(item=== 4){
this.vanvcol11 = "vandilote";
this.vanvcol12 = "vandilote";
this.vanvcol13 = "vandilote";
this.vanvcol14 = "vancoll";
}
}
clickButton2(index: number,item:number) {
var select =this.applicaList[index].sellet=item;
console.log( this.applicaList[index].sellet);
if (item=== 1) {
this.vanvcol21 = "vancoll";
this.vanvcol22 = "vandilote";
this.vanvcol23 = "vandilote";
this.vanvcol24 = "vandilote";
console.log( this.applicaList[index].sellet);
} else if(item=== 2){
this.vanvcol21 = "vandilote";
this.vanvcol22 = "vancoll";
this.vanvcol23 = "vandilote";
this.vanvcol24 = "vandilote";
}else if(item=== 3){
this.vanvcol21 = "vandilote";
this.vanvcol22 = "vandilote";
this.vanvcol23 = "vancoll";
this.vanvcol24 = "vandilote";
}
else if(item=== 4){
this.vanvcol21 = "vandilote";
this.vanvcol22 = "vandilote";
this.vanvcol23 = "vandilote";
this.vanvcol24 = "vancoll";
}
}
clickButton3(index: number,item:number) {
var select =this.applicaList[index].sellet=item;
console.log( this.applicaList[index].sellet);
if (item=== 1) {
this.vanvcol31 = "vancoll";
this.vanvcol32 = "vandilote";
this.vanvcol33 = "vandilote";
this.vanvcol34 = "vandilote";
console.log( this.applicaList[index].sellet);
} else if(item=== 2){
this.vanvcol31 = "vandilote";
this.vanvcol32 = "vancoll";
this.vanvcol33 = "vandilote";
this.vanvcol34 = "vandilote";
}else if(item=== 3){
this.vanvcol31 = "vandilote";
this.vanvcol32 = "vandilote";
this.vanvcol33 = "vancoll";
this.vanvcol34 = "vandilote";
}
else if(item=== 4){
this.vanvcol31 = "vandilote";
this.vanvcol32 = "vandilote";
this.vanvcol33 = "vandilote";
this.vanvcol34 = "vancoll";
}
}
clickButton4(index: number,item:number) {
var select =this.applicaList[index].sellet=item;
console.log( this.applicaList[index].sellet);
if (item=== 1) {
this.vanvcol41 = "vancoll";
this.vanvcol42 = "vandilote";
this.vanvcol43 = "vandilote";
this.vanvcol44 = "vandilote";
console.log( this.applicaList[index].sellet);
} else if(item=== 2){
this.vanvcol41 = "vandilote";
this.vanvcol42 = "vancoll";
this.vanvcol43 = "vandilote";
this.vanvcol44 = "vandilote";
}else if(item=== 3){
this.vanvcol41 = "vandilote";
this.vanvcol42 = "vandilote";
this.vanvcol43 = "vancoll";
this.vanvcol44 = "vandilote";
}
else if(item=== 4){
this.vanvcol41 = "vandilote";
this.vanvcol42 = "vandilote";
this.vanvcol43 = "vandilote";
this.vanvcol44 = "vancoll";
}
}
}
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.roll { .roll {
...@@ -379,7 +688,14 @@ export default class Main extends Vue { ...@@ -379,7 +688,14 @@ export default class Main extends Vue {
border-radius: 12px; border-radius: 12px;
color: #a2d2f4; color: #a2d2f4;
} }
.vancoll {
text-align: center;
background-color: rgba(242, 242, 242, 1);
font-size: 12px;
line-height: 40px;
border-radius: 4px;
background: #1890ff;
}
.prudect { .prudect {
line-height: 100%; line-height: 100%;
margin-top: 40px; margin-top: 40px;
...@@ -453,4 +769,7 @@ export default class Main extends Vue { ...@@ -453,4 +769,7 @@ export default class Main extends Vue {
overflow: hidden; overflow: hidden;
height: 100%; height: 100%;
} }
#fristsize {
background-color: #1890ff;
}
</style> </style>
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或