Compare commits
2 Commits
e0f1eddfe0
...
c53cc10101
| Author | SHA1 | Date | |
|---|---|---|---|
|
c53cc10101 | ||
|
|
0227cf6db2 |
@@ -1,8 +1,6 @@
|
||||
<template>
|
||||
|
||||
<router-view />
|
||||
<login></login>
|
||||
>>>>>>> 542e853 (提交)
|
||||
</template>
|
||||
<script setup>
|
||||
import login from '@/components/public/login.vue'
|
||||
|
||||
BIN
src/assets/img/publicImage/transmit-icon.png
Normal file
BIN
src/assets/img/publicImage/transmit-icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.1 KiB |
@@ -18,7 +18,7 @@
|
||||
popper-style="background: transparent;padding:0;box-shadow: none;border: none;transform: translateX(50px);">
|
||||
<template #reference>
|
||||
<el-input class="search-input" v-model="pitchValue['keyword']" placeholder="搜索房源或输入房源ID"
|
||||
@keyup.enter='handleKeyword' style="height:48px;width:460px;"></el-input>
|
||||
@keyup.enter='handleKeyword(pitchValue["keyword"])' style="height:48px;width:460px;"></el-input>
|
||||
</template>
|
||||
<div class="dis-f al-item pos-r">
|
||||
<div class="seach-hiosory-box scrollbar" :class="{ 'seach-history-h': historyShow }">
|
||||
@@ -43,7 +43,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</el-popover>
|
||||
<div class="seach-btn dis-f al-item jus-x" @click="handleKeyword">
|
||||
<div class="seach-btn dis-f al-item jus-x" @click="handleKeyword(pitchValue['keyword'])">
|
||||
<img src="../../assets/homeImage/seachImg.svg" class="img" alt="">
|
||||
搜索
|
||||
</div>
|
||||
@@ -252,15 +252,23 @@ const rentInput = () => clearingAmountState = false
|
||||
|
||||
// 点击历史搜索和热门推荐
|
||||
const handleKeyword = value => {
|
||||
|
||||
|
||||
// pitchValue.value['keyword'] = value
|
||||
|
||||
console.log(pitchValue.value['keyword'], "pitchValue.value['keyword']");
|
||||
// console.log(pitchValue.value['keyword'], "pitchValue.value['keyword']");
|
||||
|
||||
return
|
||||
if (!value) value = pitchValue.value['keyword']
|
||||
// return
|
||||
// if (!value) pitchValue.value['keyword']
|
||||
// console.log(value, "value");
|
||||
|
||||
// return
|
||||
console.log("pitchValue.value['keyword']", pitchValue.value['keyword']);
|
||||
router.push(`/seachPage?keyword=${value}`)
|
||||
|
||||
if (historyArr.value.indexOf(value) == -1 && value) {
|
||||
historyArr.value.unshift(value)
|
||||
storingHistory()
|
||||
}
|
||||
// seachList()
|
||||
}
|
||||
|
||||
@@ -336,8 +344,7 @@ const selectOption = (type, value) => {
|
||||
}
|
||||
|
||||
.seach-box-bg {
|
||||
background: #d7d7d7 !important;
|
||||
background: inherit;
|
||||
background: #d7d7d7;
|
||||
border-radius: 16px;
|
||||
-moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
|
||||
-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
|
||||
|
||||
@@ -1,9 +1,38 @@
|
||||
<template>
|
||||
<page-top-bar></page-top-bar>
|
||||
|
||||
<div class="content"></div>
|
||||
<div class="content wid1200">
|
||||
<div class="header">
|
||||
<div class="top flexflex">
|
||||
<div class="brand-name flexcenter">ZHELI這裡</div>
|
||||
<div class="brand-abstract">高颜值高品质学生公寓，城理浸公学生首选</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="operate-box flexacenter">
|
||||
<div class="nav-box flexacenter">
|
||||
<div class="nav-item flexcenter" :class="{ 'pitch': item == 1 }" v-for="item in 5">优惠活动</div>
|
||||
</div>
|
||||
<div class="btn-box flexacenter">
|
||||
<div class="btn-item transmit-btn flexcenter">
|
||||
<img class="transmit-icon" src="@/assets/img/publicImage/transmit-icon.png" />
|
||||
转发
|
||||
</div>
|
||||
<div class="btn-item consult-btn flexcenter">咨询</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="details-box flexflex">
|
||||
<div class="details-left flex1">
|
||||
<div class="type-box">
|
||||
<div class="type-item">
|
||||
<div class="type-name">双人套间A</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="details-right"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
@@ -13,4 +42,125 @@ const uniqid = "1qfWOLTPbyPH"
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
||||
<style lang="less" scoped>
|
||||
.content {
|
||||
margin: 0 auto;
|
||||
height: 100px;
|
||||
background-color: rgb(13, 67, 114);
|
||||
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
|
||||
|
||||
.top {
|
||||
width: 1200px;
|
||||
height: 65px;
|
||||
background: -webkit-linear-gradient(356.899508550192deg, rgba(253, 218, 85, 1) 0%, rgba(229, 215, 190, 1) 50%, rgba(203, 254, 191, 1) 100%);
|
||||
background: -moz-linear-gradient(93.1004914498078deg, rgba(253, 218, 85, 1) 0%, rgba(229, 215, 190, 1) 50%, rgba(203, 254, 191, 1) 100%);
|
||||
background: linear-gradient(93.1004914498078deg, rgba(253, 218, 85, 1) 0%, rgba(229, 215, 190, 1) 50%, rgba(203, 254, 191, 1) 100%);
|
||||
border-radius: 16px 16px 0 0;
|
||||
padding: 0 30px;
|
||||
|
||||
.brand-name {
|
||||
height: 22px;
|
||||
background-color: rgba(128, 108, 36, 1);
|
||||
border-radius: 8px;
|
||||
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
|
||||
color: #FDDA55;
|
||||
padding: 0 11px;
|
||||
margin-top: 12px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.brand-abstract {
|
||||
color: #806C24;
|
||||
font-size: 14px;
|
||||
padding-top: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
.operate-box {
|
||||
width: 1200px;
|
||||
height: 70px;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
border: 1px solid rgba(235, 235, 235, 1);
|
||||
border-radius: 16px;
|
||||
-moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
|
||||
-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
|
||||
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
|
||||
font-size: 14px;
|
||||
padding: 0 30px;
|
||||
justify-content: space-between;
|
||||
|
||||
.nav-box {
|
||||
.nav-item {
|
||||
height: 40px;
|
||||
background-color: rgba(246, 246, 246, 1);
|
||||
border-radius: 8px;
|
||||
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
color: #7F7F7F;
|
||||
padding: 0 17px;
|
||||
cursor: pointer;
|
||||
|
||||
&.pitch {
|
||||
background-color: #000;
|
||||
font-weight: 650;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
&:not(:last-of-type) {
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn-box {
|
||||
|
||||
.btn-item {
|
||||
width: 100px;
|
||||
height: 40px;
|
||||
border-radius: 50px;
|
||||
cursor: pointer;
|
||||
|
||||
&.transmit-btn {
|
||||
border: 1px solid rgba(235, 235, 235, 1);
|
||||
color: #333333;
|
||||
margin-right: 10px;
|
||||
|
||||
.transmit-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
&.consult-btn {
|
||||
background: -webkit-linear-gradient(324.854454500294deg, rgba(98, 177, 255, 1) -11%, rgba(128, 255, 255, 1) 135%);
|
||||
background: -moz-linear-gradient(125.145545499706deg, rgba(98, 177, 255, 1) -11%, rgba(128, 255, 255, 1) 135%);
|
||||
background: linear-gradient(125.145545499706deg, rgba(98, 177, 255, 1) -11%, rgba(128, 255, 255, 1) 135%);
|
||||
font-size: 16px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.details-box {
|
||||
justify-content: space-between;
|
||||
height: 100px;
|
||||
background-color: #FDDA55;
|
||||
|
||||
.details-left {
|
||||
.type-box {
|
||||
.type-item {
|
||||
height: ;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.details-right {
|
||||
width: 304px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user