Commit fe84681d authored by xinzhedeai's avatar xinzhedeai

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

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