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>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<head>
<meta charset="UTF-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0"
/>
<title>商户检查页面</title>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" 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">
<meta charset="UTF-8" />
<meta
http-equiv="X-UA-Compatible"
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>
<link rel="stylesheet" href="index.css" />
<script type="text/javascript" src="./sdk/includeHead.js"></script>
</head>
<link
rel="stylesheet"
href="index.css"
/>
<script
type="text/javascript"
src="./sdk/includeHead.js"
></script>
</head>
<body>
<body>
<!-- 获取授权用户信息 本地token等操作 -->
<!-- <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'">
<img class="merchant-icon" src="image/code/zhengfu_logo.png" alt="">
<div
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">
<p>欢迎您，<br>进入安全“码”上查 </p>
<p>欢迎您，{{userInfo.deptName}}<br />进入安全“码”上查</p>
<div class="user_tag">
<img src="image/code/user.png" alt="">
<span>日常检查</span>
<img
src="image/code/user.png"
alt=""
/>
<span>{{userInfo.roleName}}</span>
</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">
<span>商家信息</span>
<div class="user_tag">
<img src="image/code/user.png" alt="">
<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="商户图标">
<img
class="merchant-icon"
src="image/code/sj.png"
alt="商户图标"
/>
</div>
<div class="right">
<div class="merchant-info">
<div class="name-rank">
<span class="merchant-name">威海市宝威酒店有限公司</span>
<span class="merchant-name">{{userInfo.unitName}}</span>
<span class="user-rank">安全等级:绿</span>
</div>
<div class="divider"></div>
<div class="type-address">
<p>场所类型：小餐饮</p>
<p>山东省威海市环翠区恒瑞街35-6</p>
<p>场所类型：{{userInfo.smallPlaceTypeName}}</p>
<p>{{userInfo.businessAddress}}</p>
</div>
</div>
</div>
......@@ -65,30 +99,44 @@
<div class="stats-header">
<div class="stats-title">数据统计</div>
<!-- <van-cell-group> -->
<div @click="showPopup('showPopup4completionDate')" style="position: absolute;
top: -.08rem;
right: .4rem;"><span class="formValue">{{formattedDate}}</span><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" />
<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"
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">75次</div>
<div class="stat-value">{{userData.checkCount}}次</div>
<div class="stat-label">检查数</div>
</div>
<div class="stat-item">
<div class="stat-value">50次</div>
<div class="stat-value">{{userData.checkSelfCount}}次</div>
<div class="stat-label">自查数</div>
</div>
<div class="stat-item">
<div class="stat-value">10处</div>
<div class="stat-value">{{userData.hiddenCount}}处</div>
<div class="stat-label">隐患数</div>
</div>
<div class="stat-item">
<div class="stat-value">5处</div>
<div class="stat-value">{{userData.hiddenNoReCount}}处</div>
<div class="stat-label">未整改</div>
</div>
</div>
......@@ -98,38 +146,18 @@
<div class="fourth-layer">
<h2>检查专区</h2>
<div class="check-modules">
<div class="check-module saoma" v-if="menuShowYN('saoma')" @click="scanCode">
<p>扫码检查 <van-icon name="arrow" /></p>
<p class="module-intro">扫码进行企业安全检查</p>
</div>
<div class="check-module jiancha" v-if="menuShowYN('jianchajilu')" @click="navTo('checkrecord')">
<p>检查记录 <van-icon name="arrow" /></p>
<p class="module-intro">查看商家检查自查记录</p>
</div>
<div class="check-module yinhuan" v-if="menuShowYN('yinhuanshenhe')" @click="navTo('yh-check')">
<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
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>
</div>
</div>
</div>
</body>
</body>
</html>
index.js
View file @ 9be7af28
This diff is collapsed.
sdk/axios_http.js
View file @ 9be7af28
......@@ -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
// post请求头
// 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.common['systemId'] = '1'
axios.defaults.headers.common['Authorization'] = localStorage.getItem('Authorization')
axios.defaults.headers.common['Authorization'] =
localStorage.getItem('Authorization')
// 请求拦截器
axios.interceptors.request.use(config => {
console.log('request拦截器', config)
axios.interceptors.request.use((config) => {
vant.Toast.loading({
message: '加载中...',
forbidClick: true,
loadingType: 'spinner',
});
})
return config
})
// 响应拦截器
axios.interceptors.response.use((res) => {
axios.interceptors.response.use(
(res) => {
// 成功的响应数据 服务器的相关的数据返回来之后，响应拦截器能够检测到，可以做一些事
vant.Toast.clear()
return res;
}, (error) => {
return res
},
(error) => {
// 响应失败的时候的回调函数
return Promise.reject(new Error(error))
})
}
)
var http = {
get: function(url, params) {
get: function (url, params) {
return new Promise((resolve, reject) => {
axios
.get(url, {
params: params
params: params,
})
.then(res => {
.then((res) => {
resolve(res.data)
})
.catch(err => {
.catch((err) => {
reject(err.data)
})
})
},
post: function(url, params) {
post: function (url, params) {
return new Promise((resolve, reject) => {
axios
.post(url, params)
.then(res => {
.then((res) => {
let response = res.data
console.log('res.statusCode', response)
if (response.statusCode >= 300 || response.status >= 300) {
......@@ -65,12 +67,12 @@ var http = {
}
resolve(res.data)
})
.catch(err => {
.catch((err) => {
reject(err.data)
})
})
},
postFile: function(url, params) {
postFile: function (url, params) {
return new Promise((resolve, reject) => {
axios({
url,
......@@ -78,9 +80,10 @@ var http = {
data: params,
headers: {
'Content-Type': 'application/json', // 'multipart/form-data;',
'Authorization': localStorage.getItem('Authorization')
Authorization: localStorage.getItem('Authorization'),
},
}).then(res => {
})
.then((res) => {
let response = res.data
console.log('res.statusCode', response)
if (response.statusCode >= 300 || response.status >= 300) {
......@@ -93,10 +96,9 @@ var http = {
}
resolve(res.data)
})
.catch(err => {
.catch((err) => {
reject(err.data)
})
})
},
}
sdk/includeHead.js
View file @ 9be7af28
......@@ -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/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/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>');
......
src/_checkrecord.html
View file @ 9be7af28
......@@ -14,36 +14,36 @@
<div class="header">
<!-- <div class="level">安全等级</div> -->
<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 class="detail">
<van-row>
<van-col span="24">场所类型: 小餐饮</van-col>
<van-col span="24">场所类型: {{userInfo.smallPlaceTypeName}}</van-col>
</van-row>
<van-row type="flex" justify="space-around"
style="width:100%; margin-top: .3rem; margin-bottom: .3rem;">
<van-col span="6">自查数:75</van-col>
<van-col span="6">检查数:75</van-col>
<van-col span="6">隐患数:75</van-col>
<van-col span="6">未整改:75</van-col>
<van-col span="6">自查数:{{userData.checkSelfCount}}</van-col>
<van-col span="6">检查数:{{userData.checkCount}}</van-col>
<van-col span="6">隐患数:{{userData.hiddenCount}}</van-col>
<van-col span="6">未整改:{{userData.hiddenNoReCount}}</van-col>
</van-row>
<van-row>
<van-col span="24">山东省威海市环翠区和谐街35-6</van-col>
<van-col span="24">{{userInfo.businessAddress}}</van-col>
</van-row>
</div>
<!-- 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;">
<van-tab title="检查记录"></van-tab>
<van-tab title="自查记录"></van-tab>
<van-tab title="检查记录" name="1"></van-tab>
<van-tab title="自查记录" name="2"></van-tab>
</van-tabs>
</div>
<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="
......@@ -54,17 +54,17 @@
font-size: 0.3rem;
font-weight: bold;
font-family: PingFang SC;
">{{ item.description }}</div>
">{{ item.remark }}</div>
<!-- 第二行：状态和时间 -->
<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 style="display: flex; justify-content: start; gap: .4rem; align-items: center;">
<span>检查人：XXX</span>
<span>隐患数：985</span>
<span>未整改：21</span>
<span>检查人：{{item.checkPeople}}</span>
<span>隐患数：{{item.hiddenCount}}</span>
<span>未整改：{{item.notRectifiedCount}}</span>
</div>
</div>
</van-cell>
......
src/_checkrecord.js
View file @ 9be7af28
// 在原有Vue实例中添加
new Vue({
var VUE = null
window.addEventListener('load', function () {
VUE = new Vue({
el: '#app',
data() {
return {
// 新增子Tab数据
subActiveTab: 0,
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: '1',
hazardList: [
// 更多示例数据...
],
activeTab: 0,
showTimePicker: false,
// 新增以下数据
showTypePicker: false,
typeOptions: ['小餐饮', '酒店', '商场', '学校', '医疗机构'],
formData: {
principal: '',
phone: '',
area: '',
businessHours: '',
type: '', // 新增类型字段
},
checkList: [{
id: 1,
date: '2024-03-15',
result: '合格'
userInfo: {},
userData: {
checkCount: 0, //检查数
checkSelfCount: 0, //自查数
hiddenCount: 0, //隐患数
hiddenNoReCount: 0, //未整改数
},
{
id: 2,
date: '2024-03-14',
result: '不合格'
}
]
}
},
computed: {
filteredHazards() {
const statusMap = ['全部', '待审核', '待整改', '已整改'];
return this.hazardList.filter(item =>
this.subActiveTab === 0 ? true : item.status === statusMap[this.subActiveTab]
);
}
created() {
this.init()
},
computed: {},
methods: {
// 新增选择确认方法
onConfirmType(value) {
this.formData.type = value;
this.showTypePicker = false;
},
onConfirmTime(time) {
this.formData.businessHours = time;
this.showTimePicker = false;
//初始化页面
init() {
this.getUserInfo()
this.getUserData()
this.getMerchantSelfCheckData()
},
statusTagType(status) {
const types = {
'待审核': 'warning',
'待整改': 'primary',
'已整改': 'success',
'整改逾期': 'danger',
};
return types[status] || '';
/**请求数据 */
// 获取用户数据的方法
getUserData() {
http
.get('/gq/checkRecord/merHomeStatistics?date=' + this.selectedDate)
.then((res) => {
if (res.code == 200) {
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实例中添加
new Vue({
var VUE = null
window.addEventListener("load", function() {
VUE = new Vue({
// 在原有Vue实例中添加
el: '#app',
data() {
return {
......@@ -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