166 lines
4.5 KiB
Vue
166 lines
4.5 KiB
Vue
<template>
|
|
<view>
|
|
<index v-if="curPageCode === 'indexPage'"></index>
|
|
<worker-circle v-if="curPageCode === 'workerCirclePage'"></worker-circle>
|
|
<personal-center v-if="curPageCode === 'myPage'"></personal-center>
|
|
<!-- <publish-home v-if="curPageCode === 'publishPage'"></publish-home> -->
|
|
<msg-page v-if="curPageCode === 'msgPage'"></msg-page>
|
|
<module-bar ref="moduleBar" :moduleBarInfos="moduleBarInfos"></module-bar>
|
|
<view class="cu-modal content-mask" :class="isShowPublish?'show':''">
|
|
<view class="cu-dialog bottom-dialog margin-bottom-with-bar">
|
|
<view class="padding-xl">
|
|
<view class="flex justify-start margin-tb-xl">
|
|
<view class="cu-avatar round middle-avatar first-avatar">
|
|
<view class="cuIcon-formfill"></view>
|
|
</view>
|
|
<view class="flex flex-column-around text-left margin-left-sm text-white" @click="showPage('/pages/publish/publish-task')">
|
|
<view class="text-xl">发布任务</view>
|
|
<view>公司、家居家政雇佣上门服务</view>
|
|
</view>
|
|
</view>
|
|
<view class="flex justify-start margin-tb-xl">
|
|
<view class="cu-avatar round middle-avatar second-avatar">
|
|
<view class="cuIcon-cameraaddfill"></view>
|
|
</view>
|
|
<view class="flex flex-column-around text-left margin-left-sm text-white">
|
|
<view class="text-xl">发闲置</view>
|
|
<view class="text-gray">30s发布宝贝</view>
|
|
<view class="text-sm">手机/家电卖出/非上门类</view>
|
|
</view>
|
|
</view>
|
|
<view class="flex justify-start margin-tb-xl">
|
|
<view class="cu-avatar round middle-avatar third-avatar">
|
|
<view class="cuIcon-footprint"></view>
|
|
</view>
|
|
<view class="flex flex-column-around text-left margin-left-sm text-white">
|
|
<view class="text-xl">社区跑腿</view>
|
|
<view>同楼盘跑腿服务</view>
|
|
</view>
|
|
</view>
|
|
<view class="flex justify-start margin-tb-xl">
|
|
<view class="cu-avatar round middle-avatar fourth-avatar">
|
|
<view class="cuIcon-shopfill"></view>
|
|
</view>
|
|
<view class="flex flex-column-around text-left margin-left-sm text-white">
|
|
<view class="text-xl">品牌厂商发布</view>
|
|
<view>销售商电商雇佣</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="cu-bar tabbar margin-bottom-xl fixed-bottom-bar">
|
|
<view class="action add-action">
|
|
<button class="cu-btn bg-gray cuIcon-close" @click="hidePublish"></button>
|
|
<text class="mask-close-text">关闭</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import moduleBar from '@/components/custom-bar/module-bar.vue';
|
|
import index from '@/pages/index/home.vue';
|
|
import workerCircle from '@/pages/index/worker-home.vue';
|
|
import personalCenter from '@/pages/index/my-home.vue';
|
|
import msgPage from '@/pages/index/msg-home.vue';
|
|
// import publishHome from '@/pages/index/publish-home.vue';
|
|
|
|
export default {
|
|
components: {
|
|
moduleBar,
|
|
index,
|
|
workerCircle,
|
|
personalCenter,
|
|
// msgPage
|
|
// publishHome
|
|
},
|
|
data() {
|
|
return {
|
|
moduleBarInfos: [],
|
|
curPageCode: 'indexPage',
|
|
isShowPublish: false
|
|
}
|
|
},
|
|
onLoad() {
|
|
this.loadData();
|
|
this.bindEvent();
|
|
},
|
|
onUnload() {
|
|
this.offEvent();
|
|
},
|
|
methods: {
|
|
async loadData() {
|
|
this.moduleBarInfos = await this.$api.data('moduleBarInfos');
|
|
},
|
|
bindEvent() {
|
|
uni.$on('getCurPageInfo', function(data) {
|
|
if (data.curPageCode === 'publishPage') {
|
|
this.isShowPublish = true;
|
|
} else {
|
|
this.isShowPublish = false;
|
|
this.curPageCode = data.curPageCode;
|
|
}
|
|
}.bind(this));
|
|
},
|
|
offEvent() {
|
|
uni.$off('getCurPageInfo')
|
|
},
|
|
hidePublish() {
|
|
this.isShowPublish = false;
|
|
},
|
|
showPage(url) {
|
|
console.log(url)
|
|
uni.navigateTo({
|
|
url: url
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.content-mask {
|
|
z-index: 9999;
|
|
background: rgba(0, 0, 0, 0.9);
|
|
}
|
|
|
|
.mask-close-text {
|
|
visibility: hidden;
|
|
}
|
|
|
|
.middle-avatar {
|
|
width: 120rpx;
|
|
height: 120rpx;
|
|
}
|
|
|
|
.middle-avatar [class*="cuIcon-"] {
|
|
font-size: 53rpx !important;
|
|
}
|
|
|
|
.cu-avatar.first-avatar {
|
|
background-color: #0081ff;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.cu-avatar.second-avatar {
|
|
background-color: #fbbd08;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.cu-avatar.third-avatar {
|
|
background-color: #f37b1d;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.cu-avatar.fourth-avatar {
|
|
background-color: #1cbbb4;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.cu-dialog.bottom-dialog {
|
|
background-color: unset;
|
|
vertical-align: bottom;
|
|
}
|
|
</style>
|