You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
482 lines
14 KiB
482 lines
14 KiB
<template>
|
|
<div class="home app_content">
|
|
<!-- 导航栏 -->
|
|
<!-- <div class="header_body"> -->
|
|
<!-- <header-nav :leftArrow="false" titelText="扫码入企"></header-nav> -->
|
|
<!-- <header-nav
|
|
:slefBack="true"
|
|
@goBack="goBack"
|
|
:titelText="`扫码入企`"
|
|
>
|
|
</header-nav>
|
|
</div> -->
|
|
|
|
<!-- 中间 -->
|
|
<div class="warp_body">
|
|
<!-- <refresh-list v-model:freshMap="freshMap" @refresh="onRefresh" @onLoad="onLoad"> -->
|
|
<div class="white-body">
|
|
<!-- <div class="carousel_box">
|
|
<div class="box-scan-one">
|
|
<span class="box-scan-text">扫一扫<br/>企业二维码</span>
|
|
</div>
|
|
<div class="box-scan-two">
|
|
<span class="box-scan-text">即可查看<br/>企业信息</span>
|
|
</div>
|
|
</div>-->
|
|
<div class="boutique_box">
|
|
<!-- <van-cell :border="false" title="精品" /> -->
|
|
<div class="boutique_body">
|
|
<!-- <goodsCard :goodsList="boutique" :cardAttr="boutiqueAttr"></goodsCard> -->
|
|
<div class="box-qr-code" @click="toScanPageView">
|
|
<!-- <img src="../../assets/images/scan.png" />
|
|
<span class="box-qr-code-text">执法监督码</span>-->
|
|
</div>
|
|
</div>
|
|
<div class="scan-note">扫一扫企业二维码，即可查看企业信息</div>
|
|
<div class="nocode" @click="toNoScanView">扫码不成功？手动输入关键词查询 >></div>
|
|
|
|
</div>
|
|
</div>
|
|
<!-- <div class="recommend_box">
|
|
<van-cell :border="false" title="推荐" />
|
|
<div class="recommend_body">
|
|
<goodsCard :goodsList="recommend"></goodsCard>
|
|
</div>
|
|
</div> -->
|
|
<!-- </refresh-list> -->
|
|
</div>
|
|
|
|
<!-- 底部 -->
|
|
<!-- <div class="footer_body">
|
|
<footer-nav></footer-nav>
|
|
</div> -->
|
|
</div>
|
|
<div v-if="visible" class="popup" v-show="isCheck">
|
|
<!-- 弹窗的内容 -->
|
|
<div class="popup-content">
|
|
<div class="subtitle">请选择不扫码的原因：</div>
|
|
<!-- 关闭按钮 -->
|
|
<label class="close-button" @click="closeReason"></label>
|
|
<div class="item-box">
|
|
<!-- <span :class="checkCss==1?'item-btn active':'item-btn'"-->
|
|
<!-- @click="checkReason('企业拒绝出示二维码', 1)">企业拒绝出示二维码</span>-->
|
|
<!-- <span :class="checkCss==2?'item-btn active':'item-btn'"-->
|
|
<!-- @click="checkReason('网络/设备故障', 2)">网络/设备故障</span>-->
|
|
<!-- <span :class="checkCss==3?'item-btn active':'item-btn'" -->
|
|
<!-- @click="checkReason('其它', 3)">其它</span>-->
|
|
|
|
<span v-for="(item, index) in dicts" :key="index" :class="checkCss==item.dictValue?'item-btn active':'item-btn'" @click="checkReason(item.dictLabel, item.dictValue)">{{item.dictLabel}}</span>
|
|
</div>
|
|
<div class="btnbox">
|
|
<!-- <button class='btn-reset' @click="">重置</button>-->
|
|
<button class='btn-search' @click="closeReason">确定</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup name="Home">
|
|
import Vconsole from "vconsole";
|
|
import {showFailToast} from 'vant';
|
|
import {getEnterpriseMerchantAuthorization} from '@/api/Home';
|
|
import {checkIsExists} from '@/api/enterprise';
|
|
import {checkIsState} from '@/api/enforce';
|
|
import {szyptGetToken} from "../../api/Home";
|
|
import wx from "weixin-js-sdk";
|
|
|
|
const {useCommon} = $globalStore;
|
|
const router = useRouter();
|
|
let carouselList = reactive([]); // 轮播列表
|
|
let boutique = reactive([]); // 精品数据
|
|
let recommend = reactive([]); // 推荐
|
|
let freshMap = reactive({
|
|
refreshLoad: false, // 是否刷新
|
|
listLoading: false, // 是否加载中
|
|
listFinished: false, // 是否加载完成标识
|
|
});
|
|
const data = reactive({});
|
|
const boutiqueAttr = reactive({
|
|
columnNum: 4,
|
|
itemClass: "boutique_item",
|
|
goodsCradclass: "boutique-crad",
|
|
}); // 商品卡片展示
|
|
|
|
//获取轮播
|
|
const getCarousel = async () => {
|
|
// const res = await useHome.getCarousel();
|
|
// if (res?.code === 20000) {
|
|
// carouselList = res?.data;
|
|
// }
|
|
};
|
|
|
|
//精品
|
|
const boutiqueGoods = async () => {
|
|
// const res = await useHome.boutiqueGoods();
|
|
// if (res?.code === 20000) {
|
|
// boutique = res?.data;
|
|
// }
|
|
};
|
|
|
|
const openScan = () => {
|
|
let fullUrl = window.location.href;
|
|
let code = fullUrl.substring(fullUrl.indexOf('code=') + 5, fullUrl.indexOf('&state='));
|
|
let paramUrl = window.location.href.split("#")[0];
|
|
let param = {code: code, url: paramUrl};
|
|
szyptGetToken(param, success => {
|
|
let resMsg = success.data;
|
|
console.log(resMsg);
|
|
wx.config({
|
|
// 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
|
|
debug: false,
|
|
// 必填，公众号的唯一标识
|
|
appId: resMsg.corpid,
|
|
// 必填，生成签名的时间戳
|
|
timestamp: resMsg.timestamp,
|
|
// 必填，生成签名的随机串
|
|
nonceStr: resMsg.nonceStr,
|
|
// 必填，签名，见附录1
|
|
signature: resMsg.signature,
|
|
// 必填，需要使用的JS接口列表，所有JS接口列表见附录2
|
|
jsApiList: ["scanQRCode"],
|
|
});
|
|
wx.ready(() => {
|
|
//微信扫一扫请求操作
|
|
ClickScan()
|
|
});
|
|
wx.error((res) => {
|
|
console.log("获取失败");
|
|
});
|
|
}, error => {
|
|
});
|
|
};
|
|
const ClickScan = () => {
|
|
wx.scanQRCode({
|
|
needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，
|
|
scanType: ['qrCode', 'barCode'], // 可以指定扫二维码还是一维码，默认二者都有
|
|
success: (res) => {
|
|
// 页面跳转
|
|
console.log("=========== 扫码返回 ===========")
|
|
console.log(res)
|
|
const scanObj = JSON.parse(res.resultStr);
|
|
// 判断二维码是否过期, 如果已过期则跳转提示页
|
|
checkIsState(scanObj.salt, scanObj.codeId, success => {
|
|
console.log(success)
|
|
if (success.data) {
|
|
router.push({
|
|
path: "/enterpriseScanPreview",
|
|
query: {
|
|
enterpriseNumber: scanObj.salt,
|
|
isNoScan: false
|
|
}
|
|
})
|
|
} else {
|
|
showFailToast(success.message);
|
|
router.push({
|
|
path: "/enforce/scanQrCode",
|
|
})
|
|
}
|
|
}, error => {
|
|
showFailToast("该二维码不正确");
|
|
})
|
|
// router.push({
|
|
// path: "/enterpriseScanPreview",
|
|
// query: {
|
|
// enterpriseNumber: res.resultStr
|
|
// }
|
|
// });
|
|
},
|
|
cancel: (res) => {
|
|
console.log('err', res);
|
|
},
|
|
});
|
|
};
|
|
|
|
const toScanPageView = async () => {
|
|
openScan();
|
|
// router.push({
|
|
// path: "/enforce/scanPage_szy",
|
|
// query: {}
|
|
// });
|
|
};
|
|
|
|
const toNoScanView = async () => {
|
|
router.push({
|
|
path: "/enforce/noScan",
|
|
query: {}
|
|
});
|
|
};
|
|
|
|
const toRegistrationListView = async () => {
|
|
router.push({
|
|
path: "/enterprise/registrationList",
|
|
});
|
|
}
|
|
const toComplaintView = async () => {
|
|
router.push({
|
|
path: "/enterprise/complaint",
|
|
});
|
|
}
|
|
|
|
//下拉刷新
|
|
const onRefresh = () => {
|
|
freshMap.listFinished = false;
|
|
freshMap.listLoading = true;
|
|
freshMap.refreshLoad = true;
|
|
// Promise.all([getCarousel(), boutiqueGoods(), recommendGoods()]).then(() => {
|
|
// freshMap.refreshLoad = false;
|
|
// });
|
|
};
|
|
|
|
// 触底加载
|
|
const onLoad = () => {
|
|
// recommendGoods(true);
|
|
};
|
|
|
|
onMounted(() => {
|
|
// new Vconsole();
|
|
getEnterpriseMerchantAuthorization({merchantTel: useCommon.phonenumber}, success => {
|
|
if (!(success.data == null && success.data.length == 0)) {
|
|
useCommon.SET_USER_ENTERPRISE_NUMBER(success.data[0].enterpriseNumber);
|
|
}
|
|
}, error => {
|
|
})
|
|
})
|
|
// 返回
|
|
const goBack = () => {
|
|
router.go(-1);
|
|
};
|
|
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
.home {
|
|
display: flex;
|
|
flex-direction: column;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
background-color: #ebf3fb;
|
|
|
|
.warp_body {
|
|
position: relative;
|
|
background-image: linear-gradient(to bottom, #ebf3fb, transparent);
|
|
|
|
.carousel_box {
|
|
position: relative;
|
|
top: 2%;
|
|
height: 4rem;
|
|
width: 100%;
|
|
background: url("/src/assets/images/scan-mean.jpg") no-repeat center center;
|
|
background-size: 60%;
|
|
opacity: 0.75;
|
|
|
|
.box-scan-one, .box-scan-two {
|
|
position: absolute;
|
|
top: 30%;
|
|
left: 15%;
|
|
height: 2.67rem;
|
|
width: 30%;
|
|
font-size: 0.4rem;
|
|
color: #999;
|
|
|
|
.box-scan-text {
|
|
margin-top: 70%;
|
|
display: block;
|
|
width: 100%;
|
|
text-align: center
|
|
}
|
|
}
|
|
|
|
.box-scan-two {
|
|
left: auto;
|
|
right: 12.5%;
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
.boutique_box {
|
|
position: relative;
|
|
top: 25%;
|
|
z-index: 100;
|
|
width: 100%;
|
|
|
|
.boutique_body {
|
|
padding: 0 0 0.27rem 0;
|
|
display: flex;
|
|
justify-content: center;
|
|
}
|
|
;
|
|
|
|
.box-qr-code {
|
|
width: 52%;
|
|
text-align: right;
|
|
height: 7rem;
|
|
//background-color: var(--van-primary-color);
|
|
background: url("../../assets/images/scan-btn.jpg") no-repeat center center;
|
|
background-size: 100%;
|
|
// border-radius: 0.27rem;
|
|
// background-size: cover;
|
|
// border-radius: 50%;
|
|
// background-image: url("@/assets/images/scan.png");
|
|
.box-qr-code-text {
|
|
margin-right: 25%;
|
|
margin-top: 70%;
|
|
display: block;
|
|
font-size: 0.45rem;
|
|
}
|
|
|
|
img {
|
|
position: absolute;
|
|
top: 0%;
|
|
left: 34%;
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.white-body {
|
|
margin: 0 3%;
|
|
width: 94%;
|
|
height: 99%;
|
|
background-color: #fff;
|
|
border-radius: 0.27rem;
|
|
}
|
|
|
|
.nocode {
|
|
margin: 15% 0 0;
|
|
width: 100%;
|
|
color: #fb7905;
|
|
font-size: 0.42rem;
|
|
text-align: center;
|
|
line-height: 5;
|
|
}
|
|
|
|
.scan-note {
|
|
width: 100%;
|
|
color: #bcbcbc;
|
|
font-size: 0.38rem;
|
|
text-align: center;
|
|
line-height: 2;
|
|
}
|
|
|
|
.popup {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background: rgba(0, 0, 0, 0.35);
|
|
}
|
|
|
|
.popup-content {
|
|
position: fixed;
|
|
z-index: 999;
|
|
bottom: 0;
|
|
left: 0;
|
|
padding: 0 3%;
|
|
width: 94%;
|
|
height: 35vh;
|
|
background: #fff;
|
|
overflow-y: auto;
|
|
font-size: 0.38rem;
|
|
}
|
|
|
|
.subtitle {
|
|
margin: 5% 2% 2%;
|
|
width: 96%;
|
|
/*font-size: 0.4rem;
|
|
font-weight: 600;*/
|
|
border-bottom: 1px solid #f4f4f4;
|
|
line-height: 2;
|
|
}
|
|
|
|
.item-btn {
|
|
float: left;
|
|
margin: 0.3rem 0.2rem;
|
|
padding: 0.2rem 0.3rem;
|
|
background-color: #f2f3f4;
|
|
color: #999;
|
|
border-radius: 1rem;
|
|
font-size: 0.35rem;
|
|
}
|
|
|
|
.item-btn.active {
|
|
background-color: #e9f2fb;
|
|
color: #1367fe;
|
|
}
|
|
|
|
.btnbox {
|
|
display: flex;
|
|
justify-content: center;
|
|
position: absolute;
|
|
bottom: 1rem;
|
|
left: 5%;
|
|
width: 90%;
|
|
height: 1rem;
|
|
}
|
|
|
|
.btn-reset {
|
|
display: inline-block;
|
|
margin: 0 2%;
|
|
padding: 0;
|
|
width: 60%;
|
|
color: #fff;
|
|
font-size: 0.35rem;
|
|
border-radius: 1rem;
|
|
background: #1367fe;
|
|
border: 1px solid #1367fe;
|
|
text-align: center;
|
|
}
|
|
.btn-search {
|
|
display: inline-block;
|
|
margin: 3% 7%;
|
|
padding: 0;
|
|
width: 70%;
|
|
color: #fff;
|
|
font-size: 0.35rem;
|
|
border-radius: 1rem;
|
|
background: #1367fe;
|
|
border: 1px solid #1367fe;
|
|
text-align: center;
|
|
height: 90%;
|
|
}
|
|
|
|
.btn-reset {
|
|
width: 35%;
|
|
background-color: #fff;
|
|
border-color: rgba(19, 103, 254, .7);
|
|
color: #1367fe;
|
|
}
|
|
|
|
.close-button {
|
|
position: absolute;
|
|
top: 0.15rem;
|
|
right: 0.1rem;
|
|
width: 0.8rem;
|
|
height: 0.8rem;
|
|
background-color: rgba(255, 255, 255, .5);
|
|
border: 0.05rem solid rgba(255, 255, 255, .7);
|
|
border-radius: 50%;
|
|
transform: rotate(45deg);
|
|
}
|
|
|
|
.close-button:before,
|
|
.close-button:after {
|
|
content: '';
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
background: #333;
|
|
border-radius: 50%;
|
|
transform: translate(-50%, -50%);
|
|
height: 0.4rem;
|
|
width: 0.02rem;
|
|
}
|
|
|
|
.close-button:after {
|
|
height: 0.02rem;
|
|
width: 0.4rem;
|
|
}
|
|
</style>
|
|
|