Skip to content

G
GaoQuYingJiH5-ASD
Commit fe84681d authored by xinzhedeai's avatar xinzhedeai
Browse files
Options

fix: 代码格式修改; 首页加载顺序代码重构promise

parent 504bc6ea
Hide whitespace changes
Inline Side-by-side
Showing with 198 additions and 243 deletions
home.css
View file @ fe84681d
......@@ -452,4 +452,5 @@ border-right: 1px solid #eee; */
font-size: 0.28rem;
color: #333333;
line-height: 1.2;
}
\ No newline at end of file
}
home.html
View file @ fe84681d
......@@ -29,128 +29,118 @@
</script>
<script type="text/javascript" src="./home.js"></script>
<div id="app" class="page_wrapper" v-cloak>
<!-- 第二层：商户图标、名称、等级、场所类型和地址 -->
<div class="second-layer second-layer-zf" v-if="showOrg" v-cloak>
<!-- v-show="" -->
<img class="merchant-icon" src="image/code/zhengfu_logo.png" alt="" />
<div class="merchant-info welcome" v-cloak>
<p>欢迎您，{{userInfo.deptName}}<br />进入安全“码”上查</p>
<div class="user_tag">
<img src="image/code/user.png" alt="" />
<span>{{userInfo.roleName}}</span>
</div>
</div>
</div>
<!-- 原有内容（数据加载完成后显示） -->
<div v-show="!isLoading">
<!-- 第二层：商户图标、名称、等级、场所类型和地址 -->
<div class="second-layer second-layer-zf" v-if="showOrg" v-cloak>
<!-- v-show="" -->
<img class="merchant-icon" src="image/code/zhengfu_logo.png" alt="" />
<div class="merchant-info welcome" v-cloak>
<p>欢迎您，{{userInfo.deptName}}<br />进入安全“码”上查</p>
<div class="user_tag">
<img src="image/code/user.png" alt="" />
<span>{{userInfo.roleName}}</span>
</div>
</div>
</div>
<!-- 第二层：商户图标、名称、等级、场所类型和地址 -->
<div class="second-layer-sj" v-if="showShop" v-cloak>
<div class="header">
<span>商家信息</span>
<div class="user_tag">
<img src="image/code/user.png" alt="" />
<span>商家</span>
</div>
</div>
<div class="bottom">
<div class="left">
<img class="merchant-icon" src="image/code/sj.png" alt="商户图标" />
</div>
<div class="right" v-cloak>
<div class="merchant-info">
<div class="name-rank">
<span class="merchant-name">{{userInfo.unitName}}</span>
<span class="user-rank green" v-if="userInfo.safeLevel==0" @click="gotoPage('anquan_level')">安全等级:绿</span>
<span class="user-rank yellow" v-if="userInfo.safeLevel==1"
@click="gotoPage('anquan_level')">安全等级:黄</span>
<span class="user-rank red" v-if="userInfo.safeLevel==2" @click="gotoPage('anquan_level')">安全等级:红</span>
<!-- 第二层：商户图标、名称、等级、场所类型和地址 -->
<div class="second-layer-sj" v-if="showShop" v-cloak>
<div class="header">
<span>商家信息</span>
<div class="user_tag">
<img src="image/code/user.png" alt="" />
<span>商家</span>
</div>
</div>
<div class="divider"></div>
<div class="type-address">
<p>场所类型：{{userInfo.smallPlaceTypeName}}</p>
<p>{{userInfo.businessAddress}}</p>
<div class="bottom">
<div class="left">
<img class="merchant-icon" src="image/code/sj.png" alt="商户图标" />
</div>
<div class="right" v-cloak>
<div class="merchant-info">
<div class="name-rank">
<span class="merchant-name">{{userInfo.unitName}}</span>
<span class="user-rank green" v-if="userInfo.safeLevel==0" @click="gotoPage('anquan_level')">安全等级:绿</span>
<span class="user-rank yellow" v-if="userInfo.safeLevel==1"
@click="gotoPage('anquan_level')">安全等级:黄</span>
<span class="user-rank red" v-if="userInfo.safeLevel==2" @click="gotoPage('anquan_level')">安全等级:红</span>
</div>
<div class="divider"></div>
<div class="type-address">
<p>场所类型：{{userInfo.smallPlaceTypeName}}</p>
<p>{{userInfo.businessAddress}}</p>
</div>
</div>
</div>
</div>
</div>
<!-- 第三层：统计信息 -->
<div class="third-layer" v-cloak>
<div class="stats-header">
<div class="stats-title" @click="openDebug">数据统计</div>
<!-- <van-cell-group> -->
<div @click="showPopup('showPopup4completionDate')" style="position: absolute; top: -0.08rem; right: 0.4rem">
<span class="formValue">{{showDate|formatterData}}</span><van-icon name="arrow-down" />
</div>
<van-popup v-model="showPopup4completionDate" position="bottom">
<van-datetime-picker v-model="selectedDate" :min-date="minDate" :max-date="maxDate" type="year-month"
title="选择年月" @confirm="confirm4completionDate" @cancel="showPopup4completionDate=false"
:formatter="needData" />
</van-popup>
<!-- </van-cell-group> -->
</div>
<div class="stats-content">
<div class="stat-item">
<div class="stat-value">{{userData.checkCount}}次</div>
<div class="stat-label">检查数</div>
</div>
<div class="stat-item">
<div class="stat-value">{{userData.checkSelfCount}}次</div>
<div class="stat-label">自查数</div>
</div>
<div class="stat-item">
<div class="stat-value">{{userData.hiddenCount}}处</div>
<div class="stat-label">隐患数</div>
</div>
<div class="stat-item">
<div class="stat-value">{{userData.hiddenNoReCount}}处</div>
<div class="stat-label">未整改</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 第三层：统计信息 -->
<div class="third-layer" v-cloak>
<div class="stats-header">
<div class="stats-title" @click="openDebug">数据统计</div>
<!-- <van-cell-group> -->
<div @click="showPopup('showPopup4completionDate')" style="position: absolute; top: -0.08rem; right: 0.4rem">
<span class="formValue">{{showDate|formatterData}}</span><van-icon name="arrow-down" />
</div>
<van-popup v-model="showPopup4completionDate" position="bottom">
<van-datetime-picker v-model="selectedDate" :min-date="minDate" :max-date="maxDate" type="year-month"
title="选择年月" @confirm="confirm4completionDate" @cancel="showPopup4completionDate=false"
:formatter="needData" />
</van-popup>
<!-- </van-cell-group> -->
</div>
<div class="stats-content">
<div class="stat-item">
<div class="stat-value">{{userData.checkCount}}次</div>
<div class="stat-label">检查数</div>
</div>
<div class="stat-item">
<div class="stat-value">{{userData.checkSelfCount}}次</div>
<div class="stat-label">自查数</div>
</div>
<div class="stat-item">
<div class="stat-value">{{userData.hiddenCount}}处</div>
<div class="stat-label">隐患数</div>
</div>
<div class="stat-item">
<div class="stat-value">{{userData.hiddenNoReCount}}处</div>
<div class="stat-label">未整改</div>
</div>
</div>
</div>
<!-- 第三层统计信息之后新增提醒模块（商户专属） -->
<div class="info-reminder" v-if="showShop">
<!-- 第一个提醒项：整改未通过 -->
<div class="reminder-item" v-for="item in remindStatistic" @click="navTo(`${item.name}`)">
<div class="reminder-badge" :class="`reminder-badge${item.icon}`">{{item.num}}</div>
<img :src="`./image/code/home/icon${item.icon}.png`" class="reminder-img" alt="整改未通过">
<p class="reminder-text">{{item.title}}</p>
</div>
<!-- <div class="reminder-item" @click="navTo('nopass')">
<div class="reminder-badge">3</div>
<img src="./image/code/home/icon1.png" class="reminder-img" alt="整改未通过">
<p class="reminder-text">整改未通过</p>
</div>
<div class="reminder-item" @click="navTo('willExpire')">
<div class="reminder-badge orange-badge">5</div>
<img src="./image/code/home/icon2.png" class="reminder-img" alt="整改未通过">
<p class="reminder-text">即将超期</p>
</div>
<div class="reminder-item" @click="navTo('expired')">
<div class="reminder-badge red-badge">2</div>
<img src="./image/code/home/icon3.png" class="reminder-img" alt="整改未通过">
<p class="reminder-text">整改超期</p>
</div> -->
</div>
<!-- 第三层统计信息之后新增提醒模块（商户专属） -->
<div class="info-reminder" v-if="showShop">
<!-- 第一个提醒项：整改未通过 -->
<div class="reminder-item" v-for="item in remindStatistic" @click="navTo(`${item.name}`)">
<div class="reminder-badge" :class="`reminder-badge${item.icon}`">{{item.num}}</div>
<img :src="`./image/code/home/icon${item.icon}.png`" class="reminder-img">
<p class="reminder-text">{{item.title}}</p>
</div>
</div>
<!-- 原第三层统计信息 -->
<div class="third-layer" v-cloak>
<!-- ... 原有统计内容保持不变 ... -->
</div>
<!-- 原第三层统计信息 -->
<div class="third-layer" v-cloak>
<!-- ... 原有统计内容保持不变 ... -->
</div>
<!-- 第四层：检查专区 -->
<div class="fourth-layer" v-cloak>
<h2>检查专区</h2>
<div class="check-modules">
<div class="check-module" v-for="(item,index) in menuList" :key="index" :class="item.className"
@click="scanCode(item.navTo)">
<p>{{item.title}} <van-icon name="arrow" /></p>
<p class="module-intro">{{item.remark}}</p>
<div class="new-badge" v-if="item.msgFlag">新</div>
<!-- 第四层：检查专区 -->
<div class="fourth-layer" v-cloak>
<h2>检查专区</h2>
<div class="check-modules">
<div class="check-module" v-for="(item,index) in menuList" :key="index" :class="item.className"
@click="scanCode(item.navTo)">
<p>{{item.title}} <van-icon name="arrow" /></p>
<p class="module-intro">{{item.remark}}</p>
<div class="new-badge" v-if="item.msgFlag">新</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
......
home.js
View file @ fe84681d
......@@ -6,6 +6,7 @@ window.onload = function () {
el: '#app',
data() {
return {
isLoading: true, // 新增：加载状态标记
showPopup4completionDate: false,
// 控制日期选择器弹窗的显示与隐藏
showPicker: false,
......@@ -19,19 +20,18 @@ window.onload = function () {
// maxDate: new Date(new Date().getFullYear() + 10, 11),
maxDate: new Date(),
userInfo: {
userType: 'sj1', // 登录用户type
userType: 'consumers', // 登录用户type
userType: '', // 登录用户type
userId: '1', // 登录用户id
userName: '张三', // 登录用户name
userName: '', // 登录用户name
deptId: '1', // 登录用户部门id
deptName: '部门1', // 登录用户部门name
deptName: '', // 登录用户部门name
safeLevel: '0', //0:绿、1:黄、2:红
role: 'dudao',
role: '',
roleName: '',
},
showOrg: false, //是否显示组织
showShop: false, //是否显示店铺
// 修改默认菜单结构为最小化配置
menuList: [],
// 初始化为空数组，等待接口数据填充
......@@ -41,8 +41,6 @@ window.onload = function () {
hiddenCount: 0, //隐患数
hiddenNoReCount: 0, //未整改数
},
page: 1, // 页码
size: 10, // 每页显示的数量
accessType: 'manage', // 访问类型 shop商家 saoma 扫码 manage 管理
remindStatistic: []
}
......@@ -156,11 +154,11 @@ window.onload = function () {
let url = gemhoUtil.setParameter(`src/_${stringifyUrl}.html`)
gemhoUtil.navigatePage(url, '跳转中...')
},
init() {
async init() {
// 在组件挂载后执行
// 调用你的方法
this.getUserInfo()
this.getUserData()
await this.getUserInfo();
await this.getStatisticData();
this.isLoading = false; // 数据加载完成后关闭加载状态
},
showPopup() {
this['showPopup4completionDate'] = true
......@@ -169,7 +167,7 @@ window.onload = function () {
this.selectedDate = gemhoUtil.getTargetDateYMByPara(value)
this.showDate = gemhoUtil.getTargetDateYMByPara(value)
this.showPopup4completionDate = false
this.getUserData()
this.getStatisticData()
},
// 格式化日期显示的函数，根据需要自定义
......@@ -186,37 +184,20 @@ window.onload = function () {
this.showPicker = false
},
getUserInfo() {
vant.Toast.loading({
message: '正在加载...',
forbidClick: true,
loadingType: 'spinner',
})
setTimeout(() => {
http2.post(
{
serviceId: API_KEY_MAP['no-page']['id'],
interfacePublicKey: API_KEY_MAP['no-page']['publicKey'],
interfacePrivateKey: API_KEY_MAP['no-page']['privateKey'],
reqParams: {
sign: 9,
pageNum: this.page++, // 每次请求增加下一页
pageSize: this.size,
sort: 'lawId,desc',
},
return new Promise((resolve) => {
http2.post({
serviceId: API_KEY_MAP['no-page']['id'],
interfacePublicKey: API_KEY_MAP['no-page']['publicKey'],
interfacePrivateKey: API_KEY_MAP['no-page']['privateKey'],
reqParams: {
sign: 9,
},
},
(res) => {
console.log(JSON.parse(res), 'JSON.parse(res)')
if (!res) {
// 中台返回为undefined 重新请求
vant.Toast.clear()
setTimeout(() => {
this.getUserInfo()
}, 0)
return
}
if (res) {
var result = JSON.parse(res)
if (result.code !== 200 && result.data == null) {
console.log('getUserInfo=>code200datanull')
return
}
this.userInfo = {
......@@ -250,52 +231,35 @@ window.onload = function () {
console.log('菜单', result.data.modules)
// 生成最终菜单列表
this.menuList = result.data.modules
resolve();
}
setTimeout(() => {
this.$nextTick(() => {
vant.Toast.clear()
})
}, 0)
}
)
}, 0)
})
});
},
// 获取用户数据的方法
getUserData() {
vant.Toast.loading({
message: '正在加载...',
forbidClick: true,
loadingType: 'spinner',
})
setTimeout(() => {
http2.post(
{
serviceId: API_KEY_MAP['no-page']['id'],
interfacePublicKey: API_KEY_MAP['no-page']['publicKey'],
interfacePrivateKey: API_KEY_MAP['no-page']['privateKey'],
reqParams: {
sign: 6,
date: this.selectedDate,
merId: gemhoUtil.getParameter('merId'),
},
getStatisticData() {
return new Promise((resolve) => {
http2.post({
serviceId: API_KEY_MAP['no-page']['id'],
interfacePublicKey: API_KEY_MAP['no-page']['publicKey'],
interfacePrivateKey: API_KEY_MAP['no-page']['privateKey'],
reqParams: {
sign: 6,
date: this.selectedDate,
merId: gemhoUtil.getParameter('merId')|| '',
},
},
(res) => {
if (!res) {
// 中台返回为undefined 重新请求
vant.Toast.clear()
setTimeout(() => {
this.getUserData()
}, 0)
return
}
if (res) {
var result = JSON.parse(res)
console.log('用户Data')
this.userData = result.data
resolve();
}
}
)
}, 0)
},
});
}
},
//过滤器
filters: {
......
sdk/jssdk2/index.js
View file @ fe84681d
......@@ -13,35 +13,35 @@ window.onload = function () {
} else {
let accessType = gemhoUtil.getParameter('accessType')
if (accessType == 'saoma') {
let param = {
accessType: accessType,
merId: gemhoUtil.getParameter('merId')
}
// 2025年5月30日08:45:33 添加消费者访问逻辑
console.log('userType', gemhoUtil.getCookie('userType') == 'consumers')
var url = ''
if(gemhoUtil.getCookie('userType') == 'consumers'){
url = gemhoUtil.setParameter(`./src/_consumer_home.html`, param)
}else{ // 非消费者
url = gemhoUtil.setParameter(`./src/_shanghu_home.html`, param)
}
console.log('userType-url', url)
gemhoUtil.navigatePage(url, '跳转中...')
let param = {
accessType: accessType,
merId: gemhoUtil.getParameter('merId')
}
// 2025年5月30日08:45:33 添加消费者访问逻辑
console.log('userType', gemhoUtil.getCookie('userType') == 'consumers')
var url = ''
if (gemhoUtil.getCookie('userType') == 'consumers') {
url = gemhoUtil.setParameter(`./src/_consumer_home.html`, param)
} else { // 非消费者
url = gemhoUtil.setParameter(`./src/_shanghu_home.html`, param)
}
console.log('userType-url', url)
gemhoUtil.navigatePage(url, '跳转中...')
} else {
if(gemhoUtil.getCookie('userType') == 'consumers'){
vant.Dialog.alert({
title: '信息提示',
message: '请扫描商户码访问~',
}).then(() => { // 关闭当前访问页面回到爱山东
lightAppJssdk.navigation.close({
success: function (data) { },
fail: function (data) { },
})
});
}else{
gemhoUtil.navigatePage('home.html', '跳转中...')
}
if (gemhoUtil.getCookie('userType') == 'consumers') {
vant.Dialog.alert({
title: '信息提示',
message: '请扫描商户码访问~',
}).then(() => { // 关闭当前访问页面回到爱山东
lightAppJssdk.navigation.close({
success: function (data) { },
fail: function (data) { },
})
});
} else {
gemhoUtil.navigatePage('home.html', '跳转中...')
}
}
}
}
......@@ -121,33 +121,33 @@ function getUserInfo() {
// localStorage.setItem('token', result.token)
if (result.code == 200) {
gemhoUtil.setCookie('token', result.token, 1) // 存储1天后过期
// 2025-5-30 08:54:47 新增消费者判断逻辑
// gemhoUtil.setCookie('userType', 'consumers') // 存储1天后过期
gemhoUtil.setCookie('userType', result.userType) // 存储1天后过期
if(gemhoUtil.getCookie('userType') == 'consumers'){
let merId = gemhoUtil.getParameter('merId')
if(!merId){
vant.Dialog.alert({
title: '信息提示',
message: '请扫描商户码访问~',
}).then(() => { // 关闭当前访问页面回到爱山东
lightAppJssdk.navigation.close({
success: function (data) { },
fail: function (data) { },
})
});
return
}
// 消费者扫码访问 添加逻辑 merId传参
let param = {
merId
}
let url = gemhoUtil.setParameter(`src/_consumer_home.html`, param)
gemhoUtil.navigatePage(url, '跳转中...')
return
}
// 2025-5-30 08:54:47 新增消费者判断逻辑
// gemhoUtil.setCookie('userType', 'consumers') // 存储1天后过期
gemhoUtil.setCookie('userType', result.userType) // 存储1天后过期
if (gemhoUtil.getCookie('userType') == 'consumers') {
let merId = gemhoUtil.getParameter('merId')
if (!merId) {
vant.Dialog.alert({
title: '信息提示',
message: '请扫描商户码访问~',
}).then(() => { // 关闭当前访问页面回到爱山东
lightAppJssdk.navigation.close({
success: function (data) { },
fail: function (data) { },
})
});
return
}
// 消费者扫码访问 添加逻辑 merId传参
let param = {
merId
}
let url = gemhoUtil.setParameter(`src/_consumer_home.html`, param)
gemhoUtil.navigatePage(url, '跳转中...')
return
}
gemhoUtil.navigatePage('home.html', '跳转中...')
} else {
vant.Dialog.alert({
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment