From 4b5f52c8fde65ac56be8bfddbebc805e5864548a Mon Sep 17 00:00:00 2001 From: Mila <Mila@pollex.com.tw> Date: 星期一, 08 十一月 2021 10:51:13 +0800 Subject: [PATCH] update: 首頁圖檔 (輪播、嚴選配對快速篩選按鈕、推薦保險顧問) --- PAMapp/pages/index.vue | 52 +++++++++++++++++++++++++++++++++++++++++++--------- 1 files changed, 43 insertions(+), 9 deletions(-) diff --git a/PAMapp/pages/index.vue b/PAMapp/pages/index.vue index a85fe90..bf84c89 100644 --- a/PAMapp/pages/index.vue +++ b/PAMapp/pages/index.vue @@ -4,13 +4,17 @@ <div class="page-container"> <h5 class="mdTxt mb-30">����憿批��</h5> <el-button - class="reserveBtn" + class="reserveBtn recommendConsultant" @click="routerPush('/recommendConsultant')" - >������</el-button> + > + <p>������</p> + </el-button> <el-button - class="reserveBtn" + class="reserveBtn quickFilter" @click="routerPush('/quickFilter')" - >敹恍�祟�</el-button> + > + <p>敹恍�祟�</p> + </el-button> <el-row class="mb-30 rowStyle"> <el-col :span="16"> <span class="mdTxt">���“���</span> @@ -23,7 +27,10 @@ :agents="consultantList.slice(0, 3)" @removeAgent="removeAgent" ></ConsultantList> - <h5 class="mdTxt mb-30 mt-30">��靽憿批��</h5> + <div class='pam-recommend pb-30 pt-30'> + <h5 class="mdTxt">��靽憿批��</h5> + <img class="absulate img" src="~/assets/images/index_recommend.svg" alt=""> + </div> <ConsultantSwiper :agents="agents"></ConsultantSwiper> </div> </div> @@ -61,7 +68,7 @@ } removeAgent(agentNo: number) { - const findIndex = this.agents.findIndex((item, i) => { + const findIndex = this.consultantList.findIndex((item, i) => { return item.agentNo === agentNo; }) this.consultantList.splice(findIndex, 1) @@ -76,23 +83,41 @@ padding: 0px 20px 30px 20px; } - .reserveBtn { + .reserveBtn.el-button--default { width: 100%; height: 110px; border-radius: 10px; - box-shadow: 0px 0px 6px #22222229; margin: 0 auto 17px auto; font-size: 32px; font-weight: 700; - color: $PRIMARY_BLACK; + background-position: right; + background-size: cover; + color: #68737A; + text-align: left; + background-repeat: no-repeat; + box-shadow: 0px 0px 6px #a79b9b29; + border-width: 0; + + p { + text-shadow: 1px 1px 5px $PRIMARY_WHITE; + } &:nth-child(3) { margin-bottom: 42px; } + } .reserveBtn+.reserveBtn { margin-left: 0px; + } + + .quickFilter { + background-image: url('~/assets/images/quickFilter/banner_mob.svg'); + } + + .recommendConsultant { + background-image: url('~/assets/images/recommendConsultant/banner_mob.svg'); } .rowStyle { @@ -119,7 +144,16 @@ margin-right: 15px; } } + } + .pam-recommend { + position: relative; + + .img { + position: absolute; + right: 20px; + bottom: 0px; + } } </style> -- Gitblit v1.8.0