XiaoMo/gterFang
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改背景bug

Browse Source
This commit is contained in:
A1300399510
2023-07-12 19:07:15 +08:00
parent 773be0659b
commit 5dcf49533d
3 changed files with 245 additions and 226 deletions
Download Patch File Download Diff File Expand all files Collapse all files

289
src/views/edit.vue
View File

@@ -1,7 +1,7 @@
<template>
<header-nav :isNoTabList="true"></header-nav>
<map-component v-if="mapComponentState" :info="info" @choosingLocation="choosingLocation" />
<choosing-identity v-if="true"></choosing-identity>
<choosing-identity v-if="false"></choosing-identity>
<div class="content-box flexflex">
<!-- 左边的信息盒子 -->
<user-box :user="user" :type="type" :time="{ timestamp, updatetime, offshelftime }" :status="status"
@@ -53,8 +53,8 @@
ref="rentalduration" @click="setValue('rentalduration', 0)">随时</div>
<div class="modeTwo-item flexacenter" :class="{ 'pitch': info['rentalduration'] }"
ref="rentalduration">
<el-select class="flex1 modeTwo-select" v-model="info.rentalduration" placeholder="请选择">
<el-option :key="0" label="请选择" :value="0" v-show="false"></el-option>
<el-select class="flex1 modeTwo-select" v-model="info.rentalduration" placeholder="选择租期">
<el-option :key="0" label="选择租期" :value="0" v-show="false"></el-option>
<el-option v-for="item in item.choices" :key="item.key" :label="item.value"
:value="item.key"></el-option>
</el-select>
@@ -68,7 +68,8 @@
<div class="modeTwo-item flexcenter" :class="{ 'pitch': info['leasetime'] == 0 }" ref="leasetime"
@click="setValue('leasetime', 0)">随时</div>
<div class="modeTwo-item flexacenter" :class="{ 'pitch': info['leasetime'] }" ref="leasetime">
<el-date-picker v-model="info.leasetime" type="date" placeholder="选择日期"></el-date-picker>
<el-date-picker prefix-icon="" clear-icon="" v-model="info.leasetime" type="date"
placeholder="选择日期"></el-date-picker>
<img class="arrows-icon" src="@/assets/img/edit/arrows.svg" />
<img class="arrows-icon-pitch" src="@/assets/img/edit/blue-arrow.svg" />
</div>
@@ -261,12 +262,12 @@
<!-- 所在区域 -->
<div class="form-option modeOne flexacenter" v-if="intermediary != 6 && item.field == 'location'">
<el-popover placement="bottom" :width="640" :show-arrow="false" trigger="click">
<el-popover v-model:visible="areaPopState" placement="bottom" :width="640" :show-arrow="false"
trigger="click" popper-style="padding:0; border-radius:16px;" :disabled="verified == 1">
<template #reference>
<div ref="location" class="modeOne-item flexacenter"
:class="{ 'pitch': info['location'], 'disabled': verified == 1 }"
style="width: 640px;border-color: rgba(170, 170, 170, 1);"
@click="verified == 1 ? '' : areaPopState = true">
style="width: 640px;border-color: rgba(170, 170, 170, 1);">
<div class="modeOne-text flexacenter" v-if="info['location']">
{{ locationData[Math.floor(info.location)].name }}
<img class="form-arrows" src="@/assets/img/edit/thin-arrow.svg" />
@@ -352,29 +353,41 @@
<div class="form-title flexacenter">所属小区
</div>
<div class="form-option modeOne flexacenter">
<div v-if="info['communityid'] !== 0" ref="communityname" class="modeOne-item flexacenter"
:class="{ 'pitch': info['communityname'], 'disabled': verified == 1 }"
style="width: 640px;border-color: rgb(170, 170, 170);" @click="handleResidentialArea()">
<div class="modeOne-text flexacenter" v-if="info['communityname']">{{ info.communityname }}
<el-popover v-if="info['communityid'] !== 0" v-model:visible="residentialAreaState"
placement="bottom" :width="640" :show-arrow="false" trigger="click"
popper-style="padding:0; border-radius:16px;" :disabled="verified == 1">
<template #reference>
<div ref="communityname" class="modeOne-item flexacenter"
:class="{ 'pitch': info['communityname'], 'disabled': verified == 1 }"
style="width: 640px;border-color: rgb(170, 170, 170);" @click="handleResidentialArea()">
<div class="modeOne-text flexacenter" v-if="info['communityname']">{{ info.communityname
}}
</div>
<div class="modeOne-text flexacenter" style="color: #AAAAAA;" v-else>请选择</div>
<img class="arrows-icon" src="@/assets/img/edit/arrows.svg" />
<img class="arrows-icon arrows-disabled-icon"
src="@/assets/img/edit/disabled-icon.svg" />
<img class="arrows-icon-pitch" src="@/assets/img/edit/blue-arrow.svg" />
</div>
</template>
<div class="residential-area">
<div class="residential-item flexacenter" v-for="item in communityList" :key="item.id"
@click="clickResidentialArea(item.id, item.name)">
<div class="residential-dot"></div>
<div class="residential-text flex1 flexacenter"
:class="{ 'pitchpitch': item.id == info['communityid'] }">{{ item.name }}</div>
</div>
</div>
<div class="modeOne-text flexacenter" style="color: #AAAAAA;" v-else>请选择</div>
<img class="arrows-icon" src="@/assets/img/edit/arrows.svg" />
<img class="arrows-icon arrows-disabled-icon" src="@/assets/img/edit/disabled-icon.svg" />
<img class="arrows-icon-pitch" src="@/assets/img/edit/blue-arrow.svg" />
</div>
</el-popover>
<div v-else ref="communityname" class="modeOne-item flexacenter"
:class="{ 'pitch': info['communityname'], 'disabled': verified == 1 }"
style="width: 640px;border-color: rgb(170, 170, 170);">
<input class="communityname-input" v-model="info.communityname" placeholder="请填写" />
</div>
<div class="residential-area" v-if="residentialAreaState">
<div class="residential-item flexacenter" v-for="item in communityList" :key="item.id"
@click="clickResidentialArea(item.id, item.name)">
<div class="residential-dot"></div>
<div class="residential-text flex1 flexacenter"
:class="{ 'pitchpitch': item.id == info['communityid'] }">{{ item.name }}</div>
</div>
</div>
</div>
</div>
@@ -463,9 +476,10 @@
<template v-if="item['field'] == 'introduction'">
<div class="introduce-hint">{{ item.placeholder }}</div>
<div class="introduce-input" ref="introduction">
<el-input type="textarea" placeholder="请输入" v-model="info.introduction" resize="none"
show-word-limit maxlength="500">
<el-input :autosize="true" type="textarea" placeholder="请输入" v-model="info.introduction"
resize="none" maxlength="500">
</el-input>
<div class="residue">{{ info.introduction ? 500 - info.introduction.length : 500 }}</div>
</div>
</template>
</div>
@@ -507,8 +521,9 @@
<template v-if="item['field'] == 'subject'">
<div class="subject-input" ref="subject">
<el-input type="textarea" :placeholder="item.placeholder" v-model="info.subject" resize="none"
maxlength="80" show-word-limit>
maxlength="80">
</el-input>
<div class="residue">{{ info.subject ? 80 - info.subject.length : 80 }}</div>
</div>
</template>
</div>
@@ -530,10 +545,11 @@
<!-- 目标区域 - 弹窗 -->
<div class="flexcenter pop-mask" @click="targetAreaState = false" v-if="targetAreaState">
<div class="pop area-pop-box radius16 target-area">
<div class="pop area-pop-box radius16 target-area" @click.stop="">
<div class="area-pop-header">目标区域</div>
<div class="area-box flexflex">
<div class="target-area-left flex1">
<div class="target-area-item" v-for="(item, index) in locationData" :key="index">
<div class="target-area-head">{{ item.name }}</div>
<div class="box flexflex">
@@ -570,7 +586,9 @@
<div class="flexcenter pop-mask" @click="succeedPopState = 0" v-if="succeedPopState == 1">
<div class="pop succeed-box shadow radius16 flexflex"
:style="{ backgroundImage: `url(${require('@/assets/img/edit/succeed-pop-bj2.svg')})` }" @click.stop="">
<img class="pop-close" src="@/assets/img/edit/close-icon.svg" />
<a class="pop-close" :href="skipUrl" style="position: static;">
<img class="pop-close" src="@/assets/img/edit/close-icon.svg" />
</a>
<div class="succeed-title flexacenter" style="margin-bottom: 95px;">
<img class="succeed-icon" src="@/assets/img/edit/successfully-ticked.png" />发布成功
</div>
@@ -594,7 +612,10 @@
</div>
<div class="flexcenter pop-mask" @click="succeedPopState = 0" v-if="succeedPopState == 2">
<div class="pop succeed-box shadow radius16 flexflex" style="padding-bottom: 99px;" @click.stop="">
<img class="pop-close" src="@/assets/img/edit/close-icon.svg" />
<a class="pop-close" :href="skipUrl" style="position: static;">
<img class="pop-close" src="@/assets/img/edit/close-icon.svg" />
</a>
<div class="succeed-title flexacenter">
<img class="succeed-icon" src="@/assets/img/edit/successfully-ticked.png" />发布成功
</div>
@@ -611,9 +632,9 @@
<div class="flexcenter pop-mask" @click="succeedPopState = 0" v-if="succeedPopState == 3">
<div class="pop succeed-box shadow radius16 flexflex" style="padding-bottom: 58px;"
:style="{ backgroundImage: `url(${require('@/assets/img/edit/succeed-pop-bj1.svg')})` }" @click.stop="">
<img class="pop-close" src="@/assets/img/edit/close-icon.svg" />
<a class="pop-close" :href="skipUrl" style="position: static;">
<img class="pop-close" src="@/assets/img/edit/close-icon.svg" />
</a>
<div class="succeed-title flexacenter">
<img class="succeed-icon" src="@/assets/img/edit/successfully-ticked.png" />发布成功
</div>
@@ -657,7 +678,7 @@ export default {
return {
value: '',
user: {},
userIntermediary: false, // 用户是否是 认证中介，需要全局获取
userIntermediary: 0, // 用户是否是 认证中介，需要全局获取
allowpublishednum: 0,
fieldinfo: {}, // 字段配置
fieldinfoBasic: [],
@@ -798,7 +819,6 @@ export default {
this.loading = this.$loading({
lock: true,
text: 'Loading',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
});
@@ -854,7 +874,7 @@ export default {
if (info['type']) this.typeValue = info['type'] >>> 0
if (!info['leasetime']) info['leasetime'] = null
// if (!info['leasetime']) info['leasetime'] = null
let intermediary = data.intermediary
@@ -875,8 +895,8 @@ export default {
arr.forEach(element => {
if (info[element] && info[element].length == 1 && info[element][0] == 0) info[element] = []
if (info[element] && info[element].length == 1 && info[element][0] == 0) info[element] = []
if (info[element] && info[element].length != 0) {
info[element].forEach((ele, i) => {
info[element][i] = Number(ele)
@@ -994,7 +1014,6 @@ export default {
this.loading = this.$loading({
lock: true,
text: 'Loading',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
});
@@ -1142,7 +1161,6 @@ export default {
this.loading = this.$loading({
lock: true,
text: 'Loading',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
});
@@ -1324,11 +1342,12 @@ export default {
name: "以上都不是"
})
this.communityList = data
this.residentialAreaState = true
// this.residentialAreaState = true
this.isResidentialAreaUpdate = false
})
} else this.residentialAreaState = true
}
// else this.residentialAreaState = true
},
@@ -1388,6 +1407,7 @@ export default {
.arrows-icon-pitch {
width: 14px;
height: 14px;
transform: rotate(90deg);
}
.arrows-icon-pitch,
@@ -1538,12 +1558,17 @@ export default {
width: 100%;
height: 100%;
.el-input__prefix {
display: none;
}
.el-input__wrapper,
.el-input__inner {
height: 100%;
border: none;
font-size: 16px;
color: #555;
// color: #555;
color: #62B1FF;
padding-left: 0;
/* 修改 FireFox 内核浏览器的输入框提示文本样式 */
@@ -1557,6 +1582,11 @@ export default {
color: #555;
opacity: 1;
}
&::placeholder {
color: #555;
opacity: 1;
}
}
}
@@ -1874,70 +1904,6 @@ export default {
font-size: 16px;
}
.residential-area {
position: absolute;
top: 58px;
width: 640px;
height: 500px;
background-color: rgba(255, 255, 255, 1);
box-sizing: border-box;
border: 1px solid rgba(235, 235, 235, 1);
border-radius: 16px;
-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.0784313725490196);
-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.0784313725490196);
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.0784313725490196);
z-index: 101;
padding: 10px 30px;
overflow: auto;
/*滚动条样式*/
&::-webkit-scrollbar {
width: 8px;
}
&::-webkit-scrollbar-thumb {
border-radius: 10px;
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0);
background: rgba(242, 242, 242, 1);
}
&::-webkit-scrollbar-track {
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0);
border-radius: 0;
background: transparent;
}
.residential-item {
height: 60px;
cursor: pointer;
.residential-dot {
width: 6px;
height: 6px;
background: #62b1ff;
border-radius: 50%;
margin-right: 47px;
}
.residential-text {
height: 100%;
color: #555;
font-size: 16px;
&.pitchpitch {
color: #62b1ff;
}
}
&:not(:last-of-type) {
border-bottom: 1px solid rgba(242, 242, 242, 1);
}
}
}
}
.form-arrows {
@@ -1967,13 +1933,13 @@ export default {
&.pitch {
.media-cover-bnt {
background: rgba(80, 227, 194, 1);
background: rgba(98, 177, 255, 1);
border: none;
color: #fff;
}
.media-item-box {
border: 1px solid rgba(80, 227, 194, 1);
border: 1px solid rgba(98, 177, 255, 1);
}
}
@@ -2020,7 +1986,7 @@ export default {
.media-img {
width: 100px;
position: relative;
filter: brightness(0.5);
// filter: brightness(0.5);
}
.media-cover-bnt {
@@ -2056,13 +2022,23 @@ export default {
.introduce-input,
.subject-input {
width: 640px;
height: 200px;
border-radius: 10px;
border: 1px solid rgba(170, 170, 170, 1);
outline: none;
font-size: 16px;
resize: none;
overflow: hidden;
position: relative;
.residue {
position: absolute;
right: 8px;
bottom: 0;
color: #aaa;
font-size: 14px;
line-height: 30px;
height: 34px;
}
.el-textarea__inner {
height: 100%;
@@ -2071,12 +2047,15 @@ export default {
}
.introduce-input {
// height: 200px;
.el-textarea {
height: 100%;
/deep/ .el-textarea__inner {
box-shadow: none;
height: 100%;
min-height: 200px !important;
}
}
}
@@ -2555,10 +2534,32 @@ export default {
&.target-area {
width: 900px;
.area-box {
position: relative;
&::after {
content: "";
position: absolute;
left: 0;
bottom: 40px;
width: 560px;
height: 1px;
background-color: #ebebeb;
}
}
.target-area-left {
overflow: auto;
margin-top: 25px;
margin-bottom: 40px;
margin-right: 20px;
position: relative;
.target-area-bottom {
height: 40px;
width: 100%;
background-color: red;
}
/*滚动条样式*/
&::-webkit-scrollbar {
@@ -2580,7 +2581,6 @@ export default {
.target-area-item {
margin-bottom: 20px;
.target-area-head {
font-size: 18px;
color: #000;
@@ -2651,6 +2651,7 @@ export default {
font-weight: 400;
color: #7F7F7F;
font-size: 14px;
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
.target-area-num {
font-weight: 650;
@@ -2710,4 +2711,68 @@ export default {
}
}
.residential-area {
// position: absolute;
// top: 58px;
width: 640px;
height: 500px;
background-color: rgba(255, 255, 255, 1);
box-sizing: border-box;
border: 1px solid rgba(235, 235, 235, 1);
border-radius: 16px;
-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.0784313725490196);
-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.0784313725490196);
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.0784313725490196);
z-index: 101;
padding: 10px 30px;
overflow: auto;
/*滚动条样式*/
&::-webkit-scrollbar {
width: 8px;
}
&::-webkit-scrollbar-thumb {
border-radius: 10px;
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0);
background: rgba(242, 242, 242, 1);
}
&::-webkit-scrollbar-track {
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0);
border-radius: 0;
background: transparent;
}
.residential-item {
height: 60px;
cursor: pointer;
.residential-dot {
width: 6px;
height: 6px;
background: #62b1ff;
border-radius: 50%;
margin-right: 47px;
}
.residential-text {
height: 100%;
color: #555;
font-size: 16px;
&.pitchpitch {
color: #62b1ff;
}
}
&:not(:last-of-type) {
border-bottom: 1px solid rgba(242, 242, 242, 1);
}
}
}
</style>