Skip to content

G
GaoQuYingJiH5-ASD
Commit 9be7af28 authored by lei's avatar lei
Browse files
Options

add:安全检查list接口、首页安全信息接口联调

parent f1d55a71
Expand all Show whitespace changes
Inline Side-by-side
Showing with 662 additions and 518 deletions
index.html
View file @ 9be7af28
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head>
<head> <meta charset="UTF-8" />
<meta charset="UTF-8"> <meta
<meta name="viewport" content="width=device-width, initial-scale=1.0"> name="viewport"
content="width=device-width, initial-scale=1.0"
/>
<title>商户检查页面</title> <title>商户检查页面</title>
<meta charset="UTF-8"> <meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta
<meta name="viewport" http-equiv="X-UA-Compatible"
content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0, viewprot-fit:cover"> content="IE=edge"
/>
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0, viewprot-fit:cover"
/>
<title>高区安全“码”上查监管平台-首页</title> <title>高区安全“码”上查监管平台-首页</title>
<link rel="stylesheet" href="index.css" /> <link
<script type="text/javascript" src="./sdk/includeHead.js"></script> rel="stylesheet"
href="index.css"
</head> />
<script
type="text/javascript"
src="./sdk/includeHead.js"
></script>
</head>
<body> <body>
<!-- 获取授权用户信息 本地token等操作 --> <!-- 获取授权用户信息 本地token等操作 -->
<!-- <script type="text/javascript" src="sdk/jssdk2/index.js"></script> --> <!-- <script type="text/javascript" src="sdk/jssdk2/index.js"></script> -->
<div id="app" class="page_wrapper"> <div
id="app"
class="page_wrapper"
>
<!-- 第二层：商户图标、名称、等级、场所类型和地址 --> <!-- 第二层：商户图标、名称、等级、场所类型和地址 -->
<div class="second-layer second-layer-zf" v-if="userInfo.userType!=='sj'"> <div
<img class="merchant-icon" src="image/code/zhengfu_logo.png" alt=""> class="second-layer second-layer-zf"
v-if="userInfo.userType!=='sj'"
>
<img
class="merchant-icon"
src="image/code/zhengfu_logo.png"
alt=""
/>
<div class="merchant-info welcome"> <div class="merchant-info welcome">
<p>欢迎您，<br>进入安全“码”上查 </p> <p>欢迎您，{{userInfo.deptName}}<br />进入安全“码”上查</p>
<div class="user_tag"> <div class="user_tag">
<img src="image/code/user.png" alt=""> <img
<span>日常检查</span> src="image/code/user.png"
alt=""
/>
<span>{{userInfo.roleName}}</span>
</div> </div>
</div> </div>
</div> </div>
<!-- 第二层：商户图标、名称、等级、场所类型和地址 --> <!-- 第二层：商户图标、名称、等级、场所类型和地址 -->
<div class="second-layer-sj" v-if="userInfo.userType=='sj'"> <div
class="second-layer-sj"
v-if="userInfo.userType=='sj'"
>
<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>
<div class="bottom"> <div class="bottom">
<div class="left"> <div class="left">
<img class="merchant-icon" src="image/code/sj.png" alt="商户图标"> <img
class="merchant-icon"
src="image/code/sj.png"
alt="商户图标"
/>
</div> </div>
<div class="right"> <div class="right">
<div class="merchant-info"> <div class="merchant-info">
<div class="name-rank"> <div class="name-rank">
<span class="merchant-name">威海市宝威酒店有限公司</span> <span class="merchant-name">{{userInfo.unitName}}</span>
<span class="user-rank">安全等级:绿</span> <span class="user-rank">安全等级:绿</span>
</div> </div>
<div class="divider"></div> <div class="divider"></div>
<div class="type-address"> <div class="type-address">
<p>场所类型：小餐饮</p> <p>场所类型：{{userInfo.smallPlaceTypeName}}</p>
<p>山东省威海市环翠区恒瑞街35-6</p> <p>{{userInfo.businessAddress}}</p>
</div> </div>
</div> </div>
</div> </div>
...@@ -65,30 +99,44 @@ ...@@ -65,30 +99,44 @@
<div class="stats-header"> <div class="stats-header">
<div class="stats-title">数据统计</div> <div class="stats-title">数据统计</div>
<!-- <van-cell-group> --> <!-- <van-cell-group> -->
<div @click="showPopup('showPopup4completionDate')" style="position: absolute; <div
top: -.08rem; @click="showPopup('showPopup4completionDate')"
right: .4rem;"><span class="formValue">{{formattedDate}}</span><van-icon name="arrow-down" /></div> style="position: absolute; top: -0.08rem; right: 0.4rem"
<van-popup v-model="showPopup4completionDate" position="bottom"> >
<van-datetime-picker v-model="selectedDate" :min-date="minDate" type="year-month" title="选择年月" <span class="formValue">{{showDate|formatterData}}</span
@confirm="confirm4completionDate" @cancel="showPopup4completionDate=false" /> ><van-icon name="arrow-down" />
</div>
<van-popup
v-model="showPopup4completionDate"
position="bottom"
>
<van-datetime-picker
v-model="selectedDate"
:min-date="minDate"
type="year-month"
title="选择年月"
@confirm="confirm4completionDate"
@cancel="showPopup4completionDate=false"
:formatter="needData"
/>
</van-popup> </van-popup>
<!-- </van-cell-group> --> <!-- </van-cell-group> -->
</div> </div>
<div class="stats-content"> <div class="stats-content">
<div class="stat-item"> <div class="stat-item">
<div class="stat-value">75次</div> <div class="stat-value">{{userData.checkCount}}次</div>
<div class="stat-label">检查数</div> <div class="stat-label">检查数</div>
</div> </div>
<div class="stat-item"> <div class="stat-item">
<div class="stat-value">50次</div> <div class="stat-value">{{userData.checkSelfCount}}次</div>
<div class="stat-label">自查数</div> <div class="stat-label">自查数</div>
</div> </div>
<div class="stat-item"> <div class="stat-item">
<div class="stat-value">10处</div> <div class="stat-value">{{userData.hiddenCount}}处</div>
<div class="stat-label">隐患数</div> <div class="stat-label">隐患数</div>
</div> </div>
<div class="stat-item"> <div class="stat-item">
<div class="stat-value">5处</div> <div class="stat-value">{{userData.hiddenNoReCount}}处</div>
<div class="stat-label">未整改</div> <div class="stat-label">未整改</div>
</div> </div>
</div> </div>
...@@ -98,38 +146,18 @@ ...@@ -98,38 +146,18 @@
<div class="fourth-layer"> <div class="fourth-layer">
<h2>检查专区</h2> <h2>检查专区</h2>
<div class="check-modules"> <div class="check-modules">
<div class="check-module saoma" v-if="menuShowYN('saoma')" @click="scanCode"> <div
<p>扫码检查 <van-icon name="arrow" /></p> class="check-module"
<p class="module-intro">扫码进行企业安全检查</p> v-for="(item,index) in menuList"
</div> :key="index"
<div class="check-module jiancha" v-if="menuShowYN('jianchajilu')" @click="navTo('checkrecord')"> :class="item.className"
<p>检查记录 <van-icon name="arrow" /></p> @click="scanCode(item.navTo)"
<p class="module-intro">查看商家检查自查记录</p> >
</div> <p>{{item.title}} <van-icon name="arrow" /></p>
<div class="check-module yinhuan" v-if="menuShowYN('yinhuanshenhe')" @click="navTo('yh-check')"> <p class="module-intro">{{item.remark}}</p>
<p>隐患审核 <van-icon name="arrow" /></p>
<p class="module-intro">对整改隐患进行审核</p>
</div>
<div class="check-module yinhuan" v-if="menuShowYN('yinhuanzhenggai')" @click="navTo('yh-check')">
<p>隐患整改 <van-icon name="arrow" /></p>
<p class="module-intro">对隐患进行整改</p><!-- UI设计图没这个原型有 -->
</div>
<!-- <div class="check-module anquan" v-if="menuShowYN('anquanchangshi')" @click="navTo('check_list')">
<p>安全常识 <van-icon name="arrow" /></p>
<p class="module-intro">查看安全常识培训资料</p>
</div> -->
<div class="check-module shangjia" v-if="menuShowYN('shangjiaxinxi')" @click="navTo('shanghu_detail')">
<p>商家信息 <van-icon name="arrow" /></p>
<p class="module-intro">查看商家基础信息</p>
</div>
<div class="check-module zicha" v-if="menuShowYN('anquanzicha')" @click="navTo('checkrecord')">
<p>安全自查 <van-icon name="arrow" /></p>
<p class="module-intro">进行企业安全自查</p>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</body> </body>
</html> </html>
index.js
View file @ 9be7af28
This diff is collapsed.
sdk/axios_http.js
View file @ 9be7af28
...@@ -2,57 +2,59 @@ ...@@ -2,57 +2,59 @@
* 请求拦截、相应拦截、错误统一处理 * 请求拦截、相应拦截、错误统一处理
*/ */
// 环境的切换 // 环境的切换
axios.defaults.baseURL = 'http://192.168.3.37:8036' axios.defaults.baseURL = 'http://192.168.2.16:8080'
axios.defaults.timeout = 50000 axios.defaults.timeout = 50000
// post请求头 // post请求头
// axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8' // axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8'
axios.defaults.headers.post['Content-Type'] = 'application/json' axios.defaults.headers.post['Content-Type'] = 'application/json'
axios.defaults.headers.common['systemId'] = '1' axios.defaults.headers.common['systemId'] = '1'
axios.defaults.headers.common['Authorization'] = localStorage.getItem('Authorization') axios.defaults.headers.common['Authorization'] =
localStorage.getItem('Authorization')
// 请求拦截器 // 请求拦截器
axios.interceptors.request.use(config => { axios.interceptors.request.use((config) => {
console.log('request拦截器', config)
vant.Toast.loading({ vant.Toast.loading({
message: '加载中...', message: '加载中...',
forbidClick: true, forbidClick: true,
loadingType: 'spinner', loadingType: 'spinner',
}); })
return config return config
}) })
// 响应拦截器 // 响应拦截器
axios.interceptors.response.use((res) => { axios.interceptors.response.use(
(res) => {
// 成功的响应数据 服务器的相关的数据返回来之后，响应拦截器能够检测到，可以做一些事 // 成功的响应数据 服务器的相关的数据返回来之后，响应拦截器能够检测到，可以做一些事
vant.Toast.clear() vant.Toast.clear()
return res; return res
}, (error) => { },
(error) => {
// 响应失败的时候的回调函数 // 响应失败的时候的回调函数
return Promise.reject(new Error(error)) return Promise.reject(new Error(error))
}) }
)
var http = { var http = {
get: function(url, params) { get: function (url, params) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
axios axios
.get(url, { .get(url, {
params: params params: params,
}) })
.then(res => { .then((res) => {
resolve(res.data) resolve(res.data)
}) })
.catch(err => { .catch((err) => {
reject(err.data) reject(err.data)
}) })
}) })
}, },
post: function(url, params) { post: function (url, params) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
axios axios
.post(url, params) .post(url, params)
.then(res => { .then((res) => {
let response = res.data let response = res.data
console.log('res.statusCode', response) console.log('res.statusCode', response)
if (response.statusCode >= 300 || response.status >= 300) { if (response.statusCode >= 300 || response.status >= 300) {
...@@ -65,12 +67,12 @@ var http = { ...@@ -65,12 +67,12 @@ var http = {
} }
resolve(res.data) resolve(res.data)
}) })
.catch(err => { .catch((err) => {
reject(err.data) reject(err.data)
}) })
}) })
}, },
postFile: function(url, params) { postFile: function (url, params) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
axios({ axios({
url, url,
...@@ -78,9 +80,10 @@ var http = { ...@@ -78,9 +80,10 @@ var http = {
data: params, data: params,
headers: { headers: {
'Content-Type': 'application/json', // 'multipart/form-data;', 'Content-Type': 'application/json', // 'multipart/form-data;',
'Authorization': localStorage.getItem('Authorization') Authorization: localStorage.getItem('Authorization'),
}, },
}).then(res => { })
.then((res) => {
let response = res.data let response = res.data
console.log('res.statusCode', response) console.log('res.statusCode', response)
if (response.statusCode >= 300 || response.status >= 300) { if (response.statusCode >= 300 || response.status >= 300) {
...@@ -93,10 +96,9 @@ var http = { ...@@ -93,10 +96,9 @@ var http = {
} }
resolve(res.data) resolve(res.data)
}) })
.catch(err => { .catch((err) => {
reject(err.data) reject(err.data)
}) })
}) })
}, },
} }
sdk/includeHead.js
View file @ 9be7af28
...@@ -34,6 +34,8 @@ document.write('<script type="text/javascript" src="' + contextPath + '/sdk/vue. ...@@ -34,6 +34,8 @@ document.write('<script type="text/javascript" src="' + contextPath + '/sdk/vue.
<script type="text/javascript" src="' + contextPath + '/sdk/flexible.js"></script>\ <script type="text/javascript" src="' + contextPath + '/sdk/flexible.js"></script>\
<script type="text/javascript" src="' + contextPath + '/sdk/util.js?rev=' + jsVersion + '"></script>\ <script type="text/javascript" src="' + contextPath + '/sdk/util.js?rev=' + jsVersion + '"></script>\
<script type="text/javascript" src="' + contextPath + '/sdk/jssdk2/apiKeyMap.js?rev=' + jsVersion + '"></script>\ <script type="text/javascript" src="' + contextPath + '/sdk/jssdk2/apiKeyMap.js?rev=' + jsVersion + '"></script>\
<script type="text/javascript" src="' + contextPath + '/sdk/axios.min.js"></script>\
<script type="text/javascript" src="' + contextPath + '/sdk/axios_http.js"></script>\
<script type="text/javascript" src="' + contextPath + '/sdk/http.js?rev=' + jsVersion + '"></script>'); <script type="text/javascript" src="' + contextPath + '/sdk/http.js?rev=' + jsVersion + '"></script>');
......
src/_checkrecord.html
View file @ 9be7af28
...@@ -14,36 +14,36 @@ ...@@ -14,36 +14,36 @@
<div class="header"> <div class="header">
<!-- <div class="level">安全等级</div> --> <!-- <div class="level">安全等级</div> -->
<div class="title"> <div class="title">
<img src="../image/code/sj.png" alt=""><span>威海市宝威酒店有限公司</span> <img src="../image/code/sj.png" alt=""><span>{{userInfo.unitName}}</span>
</div> </div>
<div class="detail"> <div class="detail">
<van-row> <van-row>
<van-col span="24">场所类型: 小餐饮</van-col> <van-col span="24">场所类型: {{userInfo.smallPlaceTypeName}}</van-col>
</van-row> </van-row>
<van-row type="flex" justify="space-around" <van-row type="flex" justify="space-around"
style="width:100%; margin-top: .3rem; margin-bottom: .3rem;"> style="width:100%; margin-top: .3rem; margin-bottom: .3rem;">
<van-col span="6">自查数:75</van-col> <van-col span="6">自查数:{{userData.checkSelfCount}}</van-col>
<van-col span="6">检查数:75</van-col> <van-col span="6">检查数:{{userData.checkCount}}</van-col>
<van-col span="6">隐患数:75</van-col> <van-col span="6">隐患数:{{userData.hiddenCount}}</van-col>
<van-col span="6">未整改:75</van-col> <van-col span="6">未整改:{{userData.hiddenNoReCount}}</van-col>
</van-row> </van-row>
<van-row> <van-row>
<van-col span="24">山东省威海市环翠区和谐街35-6</van-col> <van-col span="24">{{userInfo.businessAddress}}</van-col>
</van-row> </van-row>
</div> </div>
<!-- Tab栏 --> <!-- Tab栏 -->
<van-tabs v-model:active="activeTab" title-active-color="#1989fa" line-height="2px" <van-tabs v-model:active="activeTab" @click="getMerchantSelfCheckData" title-active-color="#1989fa" line-height="2px"
style="margin-bottom: 15px;"> style="margin-bottom: 15px;">
<van-tab title="检查记录"></van-tab> <van-tab title="检查记录" name="1"></van-tab>
<van-tab title="自查记录"></van-tab> <van-tab title="自查记录" name="2"></van-tab>
</van-tabs> </van-tabs>
</div> </div>
<van-list> <van-list>
<van-cell v-for="item in filteredHazards" :key="item.id"> <van-cell v-for="item in hazardList" :key="item.id">
<div style="width: 100%;"> <div style="width: 100%;">
<!-- 第一行：隐患描述 --> <!-- 第一行：隐患描述 -->
<div style=" <div style="
...@@ -54,17 +54,17 @@ ...@@ -54,17 +54,17 @@
font-size: 0.3rem; font-size: 0.3rem;
font-weight: bold; font-weight: bold;
font-family: PingFang SC; font-family: PingFang SC;
">{{ item.description }}</div> ">{{ item.remark }}</div>
<!-- 第二行：状态和时间 --> <!-- 第二行：状态和时间 -->
<div style="display: flex; justify-content: start; gap: .34rem; margin: 8px 0;"> <div style="display: flex; justify-content: start; gap: .34rem; margin: 8px 0;">
<span style="color: #737373; font-size: 0.28rem;">检查时间：{{ item.date }}</span> <span style="color: #737373; font-size: 0.28rem;">检查时间：{{ item.checkTime }}</span>
</div> </div>
<!-- 第三行：商家和箭头 --> <!-- 第三行：商家和箭头 -->
<div style="display: flex; justify-content: start; gap: .4rem; align-items: center;"> <div style="display: flex; justify-content: start; gap: .4rem; align-items: center;">
<span>检查人：XXX</span> <span>检查人：{{item.checkPeople}}</span>
<span>隐患数：985</span> <span>隐患数：{{item.hiddenCount}}</span>
<span>未整改：21</span> <span>未整改：{{item.notRectifiedCount}}</span>
</div> </div>
</div> </div>
</van-cell> </van-cell>
......
src/_checkrecord.js
View file @ 9be7af28
// 在原有Vue实例中添加 var VUE = null
new Vue({ window.addEventListener('load', function () {
VUE = new Vue({
el: '#app', el: '#app',
data() { data() {
return { return {
// 新增子Tab数据 // 新增子Tab数据
subActiveTab: 0, activeTab: '1',
hazardList: [{ hazardList: [
id: 1,
description: '消防通道被货物堵塞，存在严重安全隐患',
status: '待审核',
date: '2024-03-15',
shop: 'XX餐饮店',
type: 2
},
{
id: 2,
description: '消防通道被货物堵塞，存在严重安全隐患',
status: '待整改',
date: '2024-03-15',
shop: 'XX餐饮店',
type: 2
},
// 更多示例数据... // 更多示例数据...
], ],
activeTab: 0,
showTimePicker: false,
// 新增以下数据 // 新增以下数据
showTypePicker: false, userInfo: {},
typeOptions: ['小餐饮', '酒店', '商场', '学校', '医疗机构'], userData: {
formData: { checkCount: 0, //检查数
principal: '', checkSelfCount: 0, //自查数
phone: '', hiddenCount: 0, //隐患数
area: '', hiddenNoReCount: 0, //未整改数
businessHours: '',
type: '', // 新增类型字段
},
checkList: [{
id: 1,
date: '2024-03-15',
result: '合格'
}, },
{
id: 2,
date: '2024-03-14',
result: '不合格'
}
]
} }
}, },
computed: { created() {
filteredHazards() { this.init()
const statusMap = ['全部', '待审核', '待整改', '已整改'];
return this.hazardList.filter(item =>
this.subActiveTab === 0 ? true : item.status === statusMap[this.subActiveTab]
);
}
}, },
computed: {},
methods: { methods: {
// 新增选择确认方法 //初始化页面
onConfirmType(value) { init() {
this.formData.type = value; this.getUserInfo()
this.showTypePicker = false; this.getUserData()
}, this.getMerchantSelfCheckData()
onConfirmTime(time) {
this.formData.businessHours = time;
this.showTimePicker = false;
}, },
statusTagType(status) { /**请求数据 */
const types = { // 获取用户数据的方法
'待审核': 'warning', getUserData() {
'待整改': 'primary', http
'已整改': 'success', .get('/gq/checkRecord/merHomeStatistics?date=' + this.selectedDate)
'整改逾期': 'danger', .then((res) => {
}; if (res.code == 200) {
return types[status] || ''; this.userData = res.data
}
})
}, },
viewDetail(id) { //获取用户信息
console.log('查看详情:', id); getUserInfo() {
// 这里添加跳转逻辑 http.get('/gq/information/getAll/141 ').then((res) => {
if (res.code !== 200 && res.data == null) {
return
}
if (res.data.roleDeptNameVo.roleName == '商户') {
this.userInfo = {
userType: 'sj', // 登录用户type
userId: '1', // 登录用户id
userName: '张三', // 登录用户name
deptId: '1', // 登录用户部门id
deptName: res.data.roleDeptNameVo.deptName, // 登录用户部门name
businessAddress: res.data.merchantInfoNumVo.businessAddress, //
smallPlaceTypeName: res.data.merchantInfoNumVo.smallPlaceTypeName, //
unitName: res.data.merchantInfoNumVo.unitName, //
role: 'dudao',
roleName: '商家',
} }
} }
}); })
\ No newline at end of file },
//获取商户自查数据
getMerchantSelfCheckData() {
http
.get(
'/gq/checkRecord/list?merId=1&pageSize=10&pageNum=0&type=' +
this.activeTab
)
.then((res) => {
this.hazardList = res.rows
})
},
},
})
})
src/_yh-check.js
View file @ 9be7af28
// 在原有Vue实例中添加 var VUE = null
new Vue({ window.addEventListener("load", function() {
VUE = new Vue({
// 在原有Vue实例中添加
el: '#app', el: '#app',
data() { data() {
return { return {
...@@ -62,4 +64,5 @@ new Vue({ ...@@ -62,4 +64,5 @@ new Vue({
// 这里添加跳转逻辑 // 这里添加跳转逻辑
} }
} }
}); });
\ No newline at end of file })
\ No newline at end of file
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