517 lines
10 KiB
Vue
517 lines
10 KiB
Vue
<template>
|
||
<view class="content">
|
||
<!-- 搜索 -->
|
||
<view class="head" v-if="token">
|
||
<piker-search @handleSearch="handleSearch" :placeholder='"找客户/找产品/找供应"' :width="'60'"></piker-search> -->
|
||
<view class="fangke">
|
||
<icon class="iconfont icon-remen"></icon>
|
||
<text>今日访客：{{todayviewer}}人</text>
|
||
</view>
|
||
</view>
|
||
<view v-else class="login" @click="handleLogin">
|
||
登录后查看更多内容资讯，点击此处<text>登录</text>
|
||
</view>
|
||
<!-- banner -->
|
||
<view class="tips" :style="{'margin':!token?'0':'110rpx 0 10px'}">
|
||
<text v-if="token&&!mobile" @click="navTo('/pageTwo/me/company')">请尽快完善企业信息</text>
|
||
</view>
|
||
<view class="f_banner">
|
||
<view v-if="fimages.length">
|
||
<swiper class="swiper" indicator-dots="true" autoplay="true">
|
||
<swiper-item v-for="(image, index) in fimages" :key="index" @click="detail(image.id,5)">
|
||
<image :src="image.headimg" />
|
||
</swiper-item>
|
||
</swiper>
|
||
</view>
|
||
</view>
|
||
<!-- 公告 -->
|
||
<view class="notice">
|
||
<text>头条</text>
|
||
<!-- -->
|
||
<swiper class="swiper" vertical="true" autoplay="true">
|
||
<swiper-item v-for="(item,index) in notices" :key="index" @click="detail(item.id,6)">
|
||
<view class='overflow'>{{item.title}}</view>
|
||
</swiper-item>
|
||
</swiper>
|
||
|
||
</view>
|
||
<!-- 工具 -->
|
||
<view class="tools">
|
||
<view class="item" v-for="(item,index) in navbarlist" :key="index" @click="handlePath(index,item.link)">
|
||
<image :src="item.image"></image>
|
||
<text>{{item.name}}</text>
|
||
</view>
|
||
</view>
|
||
<!-- 简介 -->
|
||
<view class="f_banner" style="margin-top: 15px;">
|
||
<view v-if="HomeContent&¢erList.length">
|
||
<swiper class="swiper" autoplay="true">
|
||
<swiper-item v-for="(image, index) in centerList" :key="index" @click="detail(image.id,5)">
|
||
<image :src="image.headimg" />
|
||
</swiper-item>
|
||
</swiper>
|
||
</view>
|
||
</view>
|
||
<!-- 风采 -->
|
||
<view class="tools fengcai" v-if="list.length">
|
||
<view class="title" @click="navTo('/pages/index/fengCai')">
|
||
<text class="ml-10">领导风采</text>
|
||
<text class="mr-10">查看更多></text>
|
||
</view>
|
||
<view class="item mt-15" v-for="(item,index) in list.length>5?list.slice(0,5):list" :key="index" @click="handleDetail(item)" >
|
||
<image :src="item.avatar" mode="aspectFill"></image>
|
||
<view class="name">{{item.name}}</view>
|
||
<view class="post">{{item.posname}}</view>
|
||
</view>
|
||
</view>
|
||
<!-- 资讯活动 -->
|
||
<view class="zixun">
|
||
<view class="title mt-10" @click="navTo('/pageTwo/news/list?type=1')">
|
||
<text>资讯活动</text>
|
||
<text v-if="newsList.length">查看更多></text>
|
||
</view>
|
||
<list :isAddress="1" :list="newsList" v-if="newsList.length"></list>
|
||
<view class="nolist" style="margin-top: 15px;" v-if="!newsList.length">
|
||
<image src="@/static/none.png"></image>
|
||
<text>暂无数据</text>
|
||
</view>
|
||
</view>
|
||
<!-- 客服 -->
|
||
<message></message>
|
||
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
mapState
|
||
} from "vuex";
|
||
import list from "@/components/newsList.vue"
|
||
import pikerSearch from "../../components/search.vue"
|
||
import UniNoticeBar from "../../uni_modules/uni-notice-bar/uni-notice-bar.vue"
|
||
export default {
|
||
data() {
|
||
return {
|
||
list: [],
|
||
token: '',
|
||
}
|
||
},
|
||
computed: {
|
||
...mapState(["user", "HomeContent", 'InfoList',"navbarlist"]),
|
||
mobile() {
|
||
return this.user.name ? this.user.cominfo.mobile : ''
|
||
},
|
||
centerList() {
|
||
return this.HomeContent ? this.HomeContent.centerbannerlist : []
|
||
},
|
||
todayviewer() {
|
||
return this.HomeContent ? this.HomeContent.todayviewer : []
|
||
},
|
||
fimages() {
|
||
return this.HomeContent ? this.HomeContent.bannerlist : []
|
||
},
|
||
notices() {
|
||
return this.HomeContent ? this.HomeContent.noticelist : []
|
||
},
|
||
newsList() {
|
||
return this.InfoList.rows ? this.InfoList.rows : []
|
||
},
|
||
tools() {
|
||
return this.$json.tools
|
||
},
|
||
},
|
||
components: {
|
||
list,
|
||
pikerSearch,
|
||
UniNoticeBar
|
||
},
|
||
async onLoad() {
|
||
let that = this
|
||
await that.login()
|
||
that.token = uni.getStorageSync('token')
|
||
that.$store.dispatch('getInfoList', {
|
||
searchValue: "",
|
||
pageNo: 1,
|
||
pageSize: 3,
|
||
})
|
||
that.handleVipList()
|
||
},
|
||
onShareAppMessage() {
|
||
let that = this
|
||
return {
|
||
title: "智造团",
|
||
path: '/pages/index/index',
|
||
imageUrl: '',
|
||
success: function(res) {
|
||
console.log("分享到朋友成功")
|
||
},
|
||
fail: function(res) {
|
||
console.log("分享到朋友失败")
|
||
},
|
||
}
|
||
},
|
||
methods: {
|
||
login() {
|
||
let that = this
|
||
uni.login({
|
||
success(res) {
|
||
if (res.code) {
|
||
if (res.errMsg = "login:ok") {
|
||
that.$model.onlogin({
|
||
code: res.code,
|
||
}).then(res => {
|
||
if (res.code == 2) {
|
||
that.token = null
|
||
uni.clearStorageSync()
|
||
uni.setStorageSync('sessionid', res.data.sessionid)
|
||
return
|
||
}
|
||
if (res.code == 0) {
|
||
that.token = res.data.token
|
||
uni.setStorageSync('token', res.data.token)
|
||
uni.setStorageSync('refreshtoken', res.data.refreshtoken)
|
||
uni.setStorageSync('sessionid', res.data.sessionid)
|
||
that.$store.dispatch("getUserInfo")
|
||
}
|
||
}).catch(e => {})
|
||
}
|
||
}
|
||
}
|
||
})
|
||
},
|
||
// 领导风采
|
||
handleVipList() {
|
||
let that = this
|
||
that.$model.getVipList({
|
||
pageNo: 1,
|
||
pageSize: 6,
|
||
}).then(res => {
|
||
if (res.code == 0) {
|
||
this.list = res.data.rows
|
||
}
|
||
})
|
||
},
|
||
// 领导风采详情
|
||
handleDetail(ite) {
|
||
let that = this
|
||
// if (!that.token) {
|
||
// that.$tools.msg("登录后查看更多")
|
||
// return
|
||
// }
|
||
uni.navigateTo({
|
||
url: "/pages/phoneList/detail?id=" + ite.id
|
||
})
|
||
},
|
||
|
||
// 全局搜索
|
||
handleSearch(ite) {
|
||
let that = this
|
||
console.log("搜索信息返回", ite)
|
||
// if (!that.token) {
|
||
// that.$tools.msg("登录后查看更多")
|
||
// return
|
||
// }
|
||
uni.navigateTo({
|
||
url: "/pages/index/searchList?ite=" + ite
|
||
})
|
||
},
|
||
// 工具栏跳转
|
||
handlePath(ind, url) {
|
||
let that = this
|
||
if (ind == 3) {
|
||
uni.switchTab({
|
||
url: url
|
||
})
|
||
} else if (ind == 2) {
|
||
uni.navigateTo({
|
||
url: url + "?content=2"
|
||
})
|
||
} else {
|
||
this.navTo(url)
|
||
}
|
||
},
|
||
// 轮播、公告、资讯详情
|
||
detail(id, type) {
|
||
let that = this
|
||
// if (!that.token) {
|
||
// that.$tools.msg("登录后查看更多")
|
||
// return
|
||
// }
|
||
return that.$model.getInfoDetail({
|
||
id: id,
|
||
type: type
|
||
}).then((res) => {
|
||
console.log("资讯列表", res)
|
||
if (res.code != 0) return
|
||
res.data.type = type
|
||
that.$tools.NewsPtype(res.data)
|
||
|
||
})
|
||
},
|
||
// 登录
|
||
handleLogin() {
|
||
uni.navigateTo({
|
||
url: "/pageTwo/login/login"
|
||
})
|
||
},
|
||
navTo(url, ) {
|
||
uni.navigateTo({
|
||
url: url
|
||
})
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.content {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 0 10px;
|
||
}
|
||
|
||
.head {
|
||
height: 35px;
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
right: 0;
|
||
padding: 0 10px 10px;
|
||
z-index: 9;
|
||
background-color: $blue;
|
||
}
|
||
|
||
.login {
|
||
width: 100%;
|
||
text-align: center;
|
||
height: 45px;
|
||
line-height: 45px;
|
||
border-radius: 5px;
|
||
|
||
text {
|
||
color: $blue;
|
||
font-size: 16px;
|
||
font-weight: bold;
|
||
margin-left: 5px;
|
||
padding: 0 3px;
|
||
border-bottom: 1px solid $blue;
|
||
}
|
||
}
|
||
|
||
.fangke {
|
||
position: fixed;
|
||
z-index: 9;
|
||
color: #fff;
|
||
right: 10px;
|
||
top: 0px;
|
||
font-size: 12px;
|
||
line-height: 35px;
|
||
display: flex;
|
||
|
||
icon {
|
||
color: red;
|
||
}
|
||
}
|
||
|
||
// banner
|
||
.f_banner {
|
||
width: 100%;
|
||
height: 240rpx;
|
||
|
||
/deep/swiper {
|
||
height: 240rpx;
|
||
}
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
background-size: 100%;
|
||
}
|
||
}
|
||
|
||
.notice {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
background-color: #fff;
|
||
margin-top: 10px;
|
||
border-radius: 10px;
|
||
|
||
text {
|
||
width: 60px;
|
||
font-size: 18px;
|
||
color: $red;
|
||
font-weight: bold;
|
||
text-align: center;
|
||
border-right: 1px solid #dfdfdf;
|
||
}
|
||
|
||
/deep/swiper {
|
||
width: calc(100% - 15px);
|
||
height: 40px;
|
||
line-height: 40px;
|
||
margin-left: 15px;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
}
|
||
|
||
.tools {
|
||
width: 100%;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
margin-top: 10px;
|
||
padding-top: 10px;
|
||
border-radius: 10px;
|
||
background-color: #fff;
|
||
|
||
.item {
|
||
width: 25%;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
justify-content: center;
|
||
padding-bottom: 10px;
|
||
|
||
text {
|
||
width: 100%;
|
||
display: block;
|
||
text-align: center;
|
||
margin-top: 5px;
|
||
}
|
||
}
|
||
|
||
image {
|
||
width: 45px;
|
||
height: 45px;
|
||
}
|
||
}
|
||
|
||
.jianjie {
|
||
width: 100%;
|
||
margin-top: 10px;
|
||
height: 100px;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
background-size: 100%;
|
||
}
|
||
}
|
||
|
||
.title {
|
||
width: 100%;
|
||
font-size: 32rpx;
|
||
font-weight: bold;
|
||
display: flex;
|
||
color: #000;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.fengcai {
|
||
.item {
|
||
width: 20%;
|
||
|
||
image {
|
||
width: 50px;
|
||
height: 50px;
|
||
border-radius: 50%;
|
||
}
|
||
|
||
.name,
|
||
.post {
|
||
width: 90%;
|
||
margin-top: 5px;
|
||
text-align: center;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.post {
|
||
background-color: #F7B133;
|
||
text-align: center;
|
||
font-size: 12px;
|
||
padding: 2px 0;
|
||
border-radius: 5px;
|
||
color: #fff;
|
||
}
|
||
}
|
||
}
|
||
|
||
.zixun {
|
||
width: calc(100% - 20px);
|
||
background: #fff;
|
||
margin-top: 10px;
|
||
margin-bottom: 15px;
|
||
padding: 0 10px;
|
||
|
||
.item {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
margin: 15px 10px 0;
|
||
padding-bottom: 10px;
|
||
border-bottom: 1px solid #f7f7f7;
|
||
|
||
.left {
|
||
width: calc(100% - 115px);
|
||
height: 70px;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
flex-flow: column;
|
||
justify-content: space-between;
|
||
|
||
.title {
|
||
width: 100%;
|
||
font-size: 14px;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
display: -webkit-box;
|
||
-webkit-box-orient: vertical;
|
||
-webkit-line-clamp: 2;
|
||
}
|
||
|
||
.time {
|
||
width: 100%;
|
||
margin-top: 10px;
|
||
|
||
view {
|
||
display: flex;
|
||
font-size: 12px;
|
||
align-items: center;
|
||
float: left;
|
||
}
|
||
}
|
||
}
|
||
|
||
.right {
|
||
width: 105px;
|
||
height: 70px;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.tips {
|
||
width: 100%;
|
||
|
||
text {
|
||
width: 100%;
|
||
color: #f5222d;
|
||
background: #fff1f0;
|
||
border: 1px solid #ffa39e;
|
||
height: 30px;
|
||
line-height: 30px;
|
||
text-align: center;
|
||
border-radius: 5px;
|
||
display: block;
|
||
}
|
||
}
|
||
</style> |