|
|
@@ -47,7 +47,7 @@
|
|
|
<button
|
|
|
class="action-btn"
|
|
|
:class="item.status == 1 ? 'offline' : 'publish'"
|
|
|
- @click.stop="toggleStatus(item, index)"
|
|
|
+ @click.stop="openStatusToggle(item, index)"
|
|
|
>
|
|
|
{{ item.status == 1 ? '下架' : '发布' }}
|
|
|
</button>
|
|
|
@@ -77,6 +77,16 @@
|
|
|
:size="32"
|
|
|
padding="30rpx 30rpx"
|
|
|
/>
|
|
|
+
|
|
|
+ <modal-module
|
|
|
+ :show="statusModal"
|
|
|
+ @cancel="statusModal = false"
|
|
|
+ @click="statusModalClick"
|
|
|
+ :content="statusModalContent"
|
|
|
+ color="#333"
|
|
|
+ :size="32"
|
|
|
+ padding="30rpx 30rpx"
|
|
|
+ />
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
@@ -111,6 +121,9 @@ export default {
|
|
|
searchText: '',
|
|
|
appliedKeyword: '',
|
|
|
delModal: false,
|
|
|
+ statusModal: false,
|
|
|
+ statusModalContent: '',
|
|
|
+ pendingStatus: null,
|
|
|
operateData: {},
|
|
|
operateIndex: null,
|
|
|
searchTimer: null,
|
|
|
@@ -228,9 +241,24 @@ export default {
|
|
|
const pad = n => String(n).padStart(2, '0')
|
|
|
return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())} ${pad(d.getHours())}:${pad(d.getMinutes())}:${pad(d.getSeconds())}`
|
|
|
},
|
|
|
- toggleStatus(item, index) {
|
|
|
- const status = item.status == 1 ? 0 : 1
|
|
|
- updateShopNoticeStatus({ id: item.id, status }).then(res => {
|
|
|
+ // 打开发布/下架确认弹框
|
|
|
+ openStatusToggle(item, index) {
|
|
|
+ this.operateData = item
|
|
|
+ this.operateIndex = index
|
|
|
+ this.pendingStatus = item.status == 1 ? 0 : 1
|
|
|
+ this.statusModalContent = this.pendingStatus === 1 ? '确定发布该公告吗?' : '确定下架该公告吗?'
|
|
|
+ this.statusModal = true
|
|
|
+ },
|
|
|
+ // 确认发布/下架
|
|
|
+ statusModalClick(e) {
|
|
|
+ if (e.index === 0) {
|
|
|
+ this.statusModal = false
|
|
|
+ return
|
|
|
+ }
|
|
|
+ const status = this.pendingStatus
|
|
|
+ const index = this.operateIndex
|
|
|
+ updateShopNoticeStatus({ id: this.operateData.id, status }).then(res => {
|
|
|
+ this.statusModal = false
|
|
|
if (res.code == 1) {
|
|
|
this.$set(this.list.data[index], 'status', status)
|
|
|
if (status === 1) {
|
|
|
@@ -265,47 +293,47 @@ export default {
|
|
|
<style lang="scss" scoped>
|
|
|
.app-content {
|
|
|
min-height: 100vh;
|
|
|
- padding-bottom: calc(140rpx + env(safe-area-inset-bottom));
|
|
|
+ padding-bottom: calc(140upx + env(safe-area-inset-bottom));
|
|
|
background: #f3f4f6;
|
|
|
}
|
|
|
|
|
|
.search-wrap {
|
|
|
- padding: 24rpx 24rpx 8rpx;
|
|
|
+ padding: 24upx 24upx 8upx;
|
|
|
background: #f3f4f6;
|
|
|
|
|
|
::v-deep .app-search-module .map-search {
|
|
|
- border-radius: 20rpx;
|
|
|
- box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.04);
|
|
|
+ border-radius: 20upx;
|
|
|
+ box-shadow: 0 2upx 8upx rgba(0, 0, 0, 0.04);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.list-wrap {
|
|
|
- padding: 16rpx 24rpx 24rpx;
|
|
|
- min-height: 400rpx;
|
|
|
+ padding: 16upx 24upx 24upx;
|
|
|
+ min-height: 400upx;
|
|
|
}
|
|
|
|
|
|
.list-loading-placeholder {
|
|
|
- min-height: 400rpx;
|
|
|
+ min-height: 400upx;
|
|
|
}
|
|
|
|
|
|
.notice-card {
|
|
|
background: #fff;
|
|
|
- border-radius: 20rpx;
|
|
|
- padding: 28rpx 28rpx 24rpx;
|
|
|
- margin-bottom: 24rpx;
|
|
|
- box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
|
|
+ border-radius: 20upx;
|
|
|
+ padding: 28upx 28upx 24upx;
|
|
|
+ margin-bottom: 24upx;
|
|
|
+ box-shadow: 0 2upx 12upx rgba(0, 0, 0, 0.04);
|
|
|
}
|
|
|
|
|
|
.card-top {
|
|
|
display: flex;
|
|
|
align-items: flex-start;
|
|
|
justify-content: space-between;
|
|
|
- gap: 20rpx;
|
|
|
+ gap: 20upx;
|
|
|
}
|
|
|
|
|
|
.title {
|
|
|
flex: 1;
|
|
|
- font-size: 34rpx;
|
|
|
+ font-size: 34upx;
|
|
|
font-weight: 600;
|
|
|
color: $fontColorMain;
|
|
|
line-height: 1.4;
|
|
|
@@ -315,10 +343,10 @@ export default {
|
|
|
flex-shrink: 0;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
- gap: 6rpx;
|
|
|
- font-size: 24rpx;
|
|
|
- padding: 8rpx 18rpx;
|
|
|
- border-radius: 24rpx;
|
|
|
+ gap: 6upx;
|
|
|
+ font-size: 24upx;
|
|
|
+ padding: 8upx 18upx;
|
|
|
+ border-radius: 24upx;
|
|
|
white-space: nowrap;
|
|
|
|
|
|
&.active {
|
|
|
@@ -326,7 +354,7 @@ export default {
|
|
|
background: #e8f8ee;
|
|
|
.status-dot {
|
|
|
color: #07a94b;
|
|
|
- font-size: 18rpx;
|
|
|
+ font-size: 18upx;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
@@ -335,7 +363,7 @@ export default {
|
|
|
background: #f0f0f0;
|
|
|
.status-dot {
|
|
|
color: #bfbfbf;
|
|
|
- font-size: 18rpx;
|
|
|
+ font-size: 18upx;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
@@ -343,30 +371,30 @@ export default {
|
|
|
.position-row {
|
|
|
display: flex;
|
|
|
align-items: flex-start;
|
|
|
- margin-top: 24rpx;
|
|
|
- gap: 16rpx;
|
|
|
+ margin-top: 24upx;
|
|
|
+ gap: 16upx;
|
|
|
}
|
|
|
|
|
|
.position-label {
|
|
|
flex-shrink: 0;
|
|
|
- font-size: 26rpx;
|
|
|
+ font-size: 26upx;
|
|
|
color: #8c8c8c;
|
|
|
- line-height: 48rpx;
|
|
|
+ line-height: 48upx;
|
|
|
}
|
|
|
|
|
|
.position-tags {
|
|
|
flex: 1;
|
|
|
display: flex;
|
|
|
flex-wrap: wrap;
|
|
|
- gap: 12rpx;
|
|
|
+ gap: 12upx;
|
|
|
}
|
|
|
|
|
|
.tag {
|
|
|
- font-size: 24rpx;
|
|
|
+ font-size: 24upx;
|
|
|
color: #4a7fd0;
|
|
|
background: #eef4fc;
|
|
|
- padding: 8rpx 20rpx;
|
|
|
- border-radius: 8rpx;
|
|
|
+ padding: 8upx 20upx;
|
|
|
+ border-radius: 8upx;
|
|
|
line-height: 1.2;
|
|
|
}
|
|
|
|
|
|
@@ -374,20 +402,20 @@ export default {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: space-evenly;
|
|
|
- padding:20rpx 0;
|
|
|
- border-bottom: 1rpx solid #f5f5f5;
|
|
|
+ padding:20upx 0;
|
|
|
+ border-bottom: 1upx solid #f5f5f5;
|
|
|
}
|
|
|
|
|
|
.meta-left {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
- gap: 10rpx;
|
|
|
+ gap: 10upx;
|
|
|
}
|
|
|
|
|
|
.meta-clock {
|
|
|
- width: 24rpx;
|
|
|
- height: 24rpx;
|
|
|
- border: 2rpx solid #bfbfbf;
|
|
|
+ width: 24upx;
|
|
|
+ height: 24upx;
|
|
|
+ border: 2upx solid #bfbfbf;
|
|
|
border-radius: 50%;
|
|
|
position: relative;
|
|
|
flex-shrink: 0;
|
|
|
@@ -403,28 +431,28 @@ export default {
|
|
|
}
|
|
|
|
|
|
&::before {
|
|
|
- width: 2rpx;
|
|
|
- height: 7rpx;
|
|
|
- margin-left: -1rpx;
|
|
|
- margin-top: -7rpx;
|
|
|
+ width: 2upx;
|
|
|
+ height: 7upx;
|
|
|
+ margin-left: -1upx;
|
|
|
+ margin-top: -7upx;
|
|
|
}
|
|
|
|
|
|
&::after {
|
|
|
- width: 2rpx;
|
|
|
- height: 5rpx;
|
|
|
- margin-left: -1rpx;
|
|
|
- margin-top: -5rpx;
|
|
|
+ width: 2upx;
|
|
|
+ height: 5upx;
|
|
|
+ margin-left: -1upx;
|
|
|
+ margin-top: -5upx;
|
|
|
transform: rotate(90deg);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.meta-text{
|
|
|
- font-size: 24rpx;
|
|
|
+ font-size: 24upx;
|
|
|
color: #999;
|
|
|
}
|
|
|
.meta-sort {
|
|
|
- margin-left:20rpx;
|
|
|
- font-size: 24rpx;
|
|
|
+ margin-left:20upx;
|
|
|
+ font-size: 24upx;
|
|
|
color: #999;
|
|
|
}
|
|
|
|
|
|
@@ -432,19 +460,19 @@ export default {
|
|
|
display: flex;
|
|
|
justify-content: flex-end;
|
|
|
align-items: center;
|
|
|
- gap: 16rpx;
|
|
|
- margin-top: 24rpx;
|
|
|
+ gap: 16upx;
|
|
|
+ margin-top: 24upx;
|
|
|
}
|
|
|
|
|
|
.action-btn {
|
|
|
margin: 0;
|
|
|
- padding: 0 28rpx;
|
|
|
- height: 56rpx;
|
|
|
- line-height: 54rpx;
|
|
|
- font-size: 26rpx;
|
|
|
- border-radius: 12rpx;
|
|
|
+ padding: 0 28upx;
|
|
|
+ height: 56upx;
|
|
|
+ line-height: 54upx;
|
|
|
+ font-size: 26upx;
|
|
|
+ border-radius: 12upx;
|
|
|
background: #fff;
|
|
|
- border: 1rpx solid #e0e0e0;
|
|
|
+ border: 1upx solid #e0e0e0;
|
|
|
color: #666;
|
|
|
|
|
|
&::after {
|
|
|
@@ -481,21 +509,21 @@ export default {
|
|
|
left: 0;
|
|
|
right: 0;
|
|
|
bottom: 0;
|
|
|
- padding: 20rpx 30rpx calc(20rpx + env(safe-area-inset-bottom));
|
|
|
+ padding: 20upx 30upx calc(20upx + env(safe-area-inset-bottom));
|
|
|
background: #fff;
|
|
|
- box-shadow: 0 -2rpx 16rpx rgba(0, 0, 0, 0.06);
|
|
|
+ box-shadow: 0 -2upx 16upx rgba(0, 0, 0, 0.06);
|
|
|
}
|
|
|
|
|
|
.footer-btn {
|
|
|
width: 100%;
|
|
|
- height: 88rpx;
|
|
|
- line-height: 88rpx;
|
|
|
+ height: 88upx;
|
|
|
+ line-height: 88upx;
|
|
|
margin: 0;
|
|
|
padding: 0;
|
|
|
- font-size: 32rpx;
|
|
|
+ font-size: 32upx;
|
|
|
color: #fff;
|
|
|
background: $greenColor;
|
|
|
- border-radius: 22rpx;
|
|
|
+ border-radius: 22upx;
|
|
|
border: none;
|
|
|
|
|
|
&::after {
|