360 lines
9.6 KiB
Vue
360 lines
9.6 KiB
Vue
<template>
|
||
<div id="homeOut" class="homeOut">
|
||
<TopBox id="topBox"></TopBox>
|
||
|
||
<!-- <div class="search-box">
|
||
<search></search>
|
||
</div> -->
|
||
<div style="width: 100%;">
|
||
<router-view></router-view>
|
||
</div>
|
||
|
||
<!-- 发布商品/需求弹窗 -->
|
||
<el-dialog :title="publish_type === '2' ? '发布需求' : '发布商品'" width="60vw" top="5vh"
|
||
:visible.sync="sendProductVisible">
|
||
<sendProduct :isEdit="false" v-if="sendProductVisible" @success="sendProductSuccess" :publish_type="publish_type">
|
||
</sendProduct>
|
||
</el-dialog>
|
||
|
||
<!-- 审核提示弹窗 -->
|
||
<el-dialog title="温馨提示" :visible.sync="showTip" width="30%">
|
||
<span>您还没有完善企业信息，完善企业信息审核通过后您可以发布需求与商品。</span>
|
||
<span slot="footer" class="dialog-footer">
|
||
<span> <span style="margin-right: 10px;"> 跳转到</span> <el-button size="small" type="primary"
|
||
@click="goInfo">信息完善</el-button></span>
|
||
</span>
|
||
</el-dialog>
|
||
|
||
<el-dialog :title="productDetailInfo.publish_type === '1' ? '商品详情' : '需求详情'" top="5vh" :visible.sync="showProductDetail"
|
||
width="80%" @open="scrollToTop">
|
||
<ProductDetail></ProductDetail>
|
||
<span slot="footer" class="dialog-footer">
|
||
<el-button type="primary" @click="closeProductDetail">关 闭</el-button>
|
||
</span>
|
||
</el-dialog>
|
||
|
||
<!-- Footer -->
|
||
<div class="footer">
|
||
<div class="left-box" style="border-bottom: 1px solid #7A82A0">
|
||
<div style="display: flex;flex-direction: column">
|
||
<img v-if="JSON.stringify(logoInfoNew) !== '{}'" style="width: 148px;height: 48px;"
|
||
:src="logoInfoNew.home.logoImg" alt="" class="img">
|
||
<div class="content-main">
|
||
<ul class="info">
|
||
<li>地址：<span v-if="JSON.stringify(logoInfoNew) !== '{}'">{{ logoInfoNew.home.adress }}</span></li>
|
||
<li v-if="JSON.stringify(logoInfoNew) !== '{}'"> 邮箱：{{ logoInfoNew.home.email }}</li>
|
||
<li v-if="JSON.stringify(logoInfoNew) !== '{}'">电话： <span class="tel">{{ logoInfoNew.home.mobile }}</span></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<ul class="bigUl"></ul>
|
||
<div v-if="JSON.stringify(logoInfoNew) !== '{}' && logoInfoNew.home.bannerTitle !== '开元数智'" class="right-box">
|
||
<div class="qr-box">
|
||
<img src="../img/kefu.jpg" style="padding: 0.08rem" alt="">
|
||
<span class="qr-content">微信客服</span>
|
||
</div>
|
||
<div class="qr-box" style="margin-left: 0.667rem">
|
||
<img src="../img/img.png" alt="">
|
||
<span class="qr-content">关注公众号</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div style="display: flex;justify-content: center;align-items: center;width: 100%; ">
|
||
<span v-if="JSON.stringify(logoInfoNew) !== '{}'"
|
||
style="margin:15px 0 ;width: 1400px;display:flex;justify-content:center;align-items:center;color: #7A82A0;">
|
||
<span class="goStyle" @click="goOut('https://beian.miit.gov.cn/#/Integrated/index')">
|
||
京ICP备{{ logoInfoNew.home.license }}
|
||
</span>
|
||
{{ logoInfoNew.home.footerTitle }} {{ logoInfoNew.home.copyright }}
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import Vue from 'vue'
|
||
import TopBox from "@/views/homePage/components/topBox/index.vue";
|
||
import { mapGetters, mapState } from "vuex";
|
||
import search from "./search/index.vue";
|
||
import { reqEnterpriseAuditInfoSearch } from '@/api/ncmatch'
|
||
import productDetail from "./proDetail/index.vue";
|
||
export default Vue.extend({
|
||
name: "indexLast",
|
||
components: {
|
||
TopBox,
|
||
search,
|
||
ProductDetail: productDetail,
|
||
sendProduct: () => import('@/views/homePage/ncmatch/mainPage/sendProduct/index.vue')
|
||
},
|
||
data() {
|
||
return {
|
||
currentBaseMenu: "hot",
|
||
// 新增发布相关状态
|
||
sendProductVisible: false,
|
||
showTip: false,
|
||
publish_type: "",
|
||
}
|
||
},
|
||
computed: {
|
||
...mapGetters(["sidebar", "avatar", "device"]),
|
||
...mapState({
|
||
isShowPanel: (state) => state.product.showHomeNav,
|
||
productDetailInfo: state => state.ncmatch.productDetail,
|
||
navIndex: (state) => state.product.navIndex,
|
||
gridObj: state => state.operationAnalysis.gridObj,
|
||
mybalance: state => state.user.mybalance,
|
||
logoutUrl: state => state.login.logoutUrl,
|
||
loginState: state => state.login.loginState,
|
||
logoInfoNew: state => state.product.logoInfoNew,
|
||
}),
|
||
showProductDetail: {
|
||
get() {
|
||
return this.$store.state.ncmatch.showProductDetail;
|
||
},
|
||
set(value) {
|
||
this.$store.commit('SHOWPRODUCTDETAIL', value);
|
||
}
|
||
},
|
||
},
|
||
methods: {
|
||
closeProductDetail() {
|
||
this.$store.commit('SHOWPRODUCTDETAIL', false)
|
||
},
|
||
scrollToTop() {
|
||
this.$nextTick(() => {
|
||
const dialogBody = document.querySelector('.el-dialog__body');
|
||
if (dialogBody) {
|
||
dialogBody.scrollTop = 0;
|
||
}
|
||
});
|
||
},
|
||
goOut(url) {
|
||
window.open(url)
|
||
},
|
||
scrollToElement(id) {
|
||
const element = document.getElementById(id);
|
||
if (element) {
|
||
element.scrollIntoView({
|
||
behavior: 'smooth',
|
||
block: 'start',
|
||
});
|
||
}
|
||
},
|
||
clickBaseMenu(menu) {
|
||
this.currentBaseMenu = menu.id;
|
||
},
|
||
async goBaidu() {
|
||
this.scrollToElement('topBox')
|
||
await this.$store.commit('setShowHomeNav', true)
|
||
await this.$store.commit('setNavIndex', 0)
|
||
},
|
||
async goAliyun() {
|
||
this.scrollToElement('topBox')
|
||
await this.$store.commit('setShowHomeNav', true)
|
||
await this.$store.commit('setNavIndex', 1)
|
||
},
|
||
|
||
// 发布需求/商品方法
|
||
sendInfo(type) {
|
||
console.log("发布类型:", type);
|
||
if (this.loginState) {
|
||
reqEnterpriseAuditInfoSearch({
|
||
url_link: window.location.href,
|
||
}).then(res => {
|
||
const dataList = res && res.data && res.data.data
|
||
const hasAuditInfo = Array.isArray(dataList) && dataList.length !== 0
|
||
const roles = sessionStorage.getItem('jueseNew')
|
||
const isCustomer = roles ? roles.includes('客户') : true
|
||
|
||
if (hasAuditInfo && dataList[0]) {
|
||
const auditStatus = dataList[0].audit_status
|
||
|
||
if (auditStatus === 'pending') {
|
||
this.$message.warning('您的审核状态为待审核，请等待审核通过后发布~')
|
||
} else if (auditStatus === 'rejected') {
|
||
this.$message.warning('您的审核状态为驳回，请重新提交~')
|
||
} else {
|
||
// 审核通过，允许发布
|
||
this.publish_type = type
|
||
this.sendProductVisible = true
|
||
}
|
||
} else if (!isCustomer) {
|
||
// 非客户角色，允许发布
|
||
this.publish_type = type
|
||
this.sendProductVisible = true
|
||
} else {
|
||
// 没有审核信息且是客户角色，显示提示
|
||
this.showTip = true
|
||
}
|
||
})
|
||
} else {
|
||
this.$router.push('/login')
|
||
}
|
||
},
|
||
|
||
// 发布成功回调
|
||
sendProductSuccess() {
|
||
this.sendProductVisible = false;
|
||
this.$message.success(this.publish_type === '1' ? '商品发布成功' : '需求发布成功');
|
||
// 如果当前在供需广场页面，可以刷新列表数据
|
||
if (this.$route.path === '/supplyAndDemandSquare') {
|
||
// 触发供需广场页面的数据刷新
|
||
this.$bus.$emit('refreshSupplyDemandList');
|
||
}
|
||
},
|
||
|
||
// 跳转到信息完善页面
|
||
goInfo() {
|
||
this.showTip = false
|
||
this.$router.push('/customer/approve')
|
||
},
|
||
}
|
||
})
|
||
</script>
|
||
|
||
<style scoped lang="less">
|
||
|
||
|
||
.search-box {
|
||
width: 100%;
|
||
// margin: 45px 0 25px 0;
|
||
margin-bottom: 20px;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: flex-start;
|
||
}
|
||
|
||
.homeOut {
|
||
height: 100%;
|
||
overflow: auto !important;
|
||
min-width: 1500px;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: flex-start;
|
||
background-color: #f6f8fd;
|
||
}
|
||
|
||
.footer {
|
||
padding: 35px 0;
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: center;
|
||
flex-wrap: wrap;
|
||
}
|
||
|
||
.left-box {
|
||
width: 1400px;
|
||
height: 100%;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
padding-bottom: 15px;
|
||
}
|
||
|
||
.right-box {
|
||
height: 100%;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
}
|
||
|
||
.content-main {
|
||
mix-blend-mode: normal;
|
||
color: rgba(0, 0, 0, 1);
|
||
font-size: 0.187rem;
|
||
}
|
||
|
||
.qr-code {
|
||
img {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
width: 1.853rem;
|
||
height: 1.853rem;
|
||
}
|
||
|
||
.qr-content {
|
||
mix-blend-mode: normal;
|
||
color: rgba(24, 24, 24, 1);
|
||
font-family: PingFang SC, serif;
|
||
font-weight: 600;
|
||
font-size: 0.187rem;
|
||
}
|
||
|
||
.qr-box {
|
||
display: flex;
|
||
justify-content: center;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
img{
|
||
width: 120px;
|
||
height: 120px;
|
||
}
|
||
}
|
||
|
||
.bigUl {
|
||
margin: 0 15px;
|
||
margin-left: -250px;
|
||
width: fit-content;
|
||
display: flex;
|
||
justify-content: flex-start;
|
||
|
||
.bigLi {
|
||
margin: 0 25px;
|
||
}
|
||
height: 100%;
|
||
|
||
.title {
|
||
color: #222F60;
|
||
font-size: 18px;
|
||
font-weight: bold;
|
||
}
|
||
|
||
.smallUl {
|
||
font-size: 16px;
|
||
color: #7A82A0;
|
||
|
||
li {
|
||
margin: 10px 0;
|
||
}
|
||
}
|
||
}
|
||
|
||
.info {
|
||
font-size: 14px;
|
||
color: #7A82A0;
|
||
|
||
li {
|
||
margin: 10px 0;
|
||
}
|
||
}
|
||
|
||
.tel {
|
||
color: #222F60;
|
||
font-size: 20px;
|
||
}
|
||
|
||
.smallLi {
|
||
&:hover {
|
||
color: #1b5bff;
|
||
cursor: pointer;
|
||
}
|
||
}
|
||
|
||
.goStyle {
|
||
cursor: pointer;
|
||
transition: all .3s ease-in-out;
|
||
|
||
&:hover {
|
||
transition: all .3s ease-in-out;
|
||
color: #1b5bff;
|
||
}
|
||
}
|
||
/deep/.el-pagination{
|
||
text-align: center !important;
|
||
}
|
||
</style>
|