Skip to content

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

fix: 商家信息页面

parent d0ce9436
Hide whitespace changes
Inline Side-by-side
Showing with 50 additions and 243 deletions
src/_shanghu_detail.html
View file @ 9fe6da05
...@@ -12,148 +12,17 @@ ...@@ -12,148 +12,17 @@
padding: 0.2rem; padding: 0.2rem;
background-color: #fff; background-color: #fff;
} }
.header {}
.header .title {
font-weight: 500;
font-size: 0.32rem;
color: #000000;
display: flex;
justify-content: start;
align-items: center;
gap: 0.2rem;
padding: 0.3rem 0.3rem;
}
.detail {
width: 6.88rem;
/* height: 1.88rem; */
background: #F5F6FA;
border-radius: 0.01rem;
/* padding-left: 0.2rem; */
padding:0.3rem;
margin-bottom: 0.2rem;
display: flex;
align-items: start;
flex-direction: column;
justify-content: space-around;
/* padding-bottom: 0.1rem;
gap: 0.1rem; */
}
.detail .van-col{
font-family: PingFang SC;
font-weight: 500;
font-size: 0.28rem;
color: #737373;
}
.detail span {
font-family: PingFang SC;
font-weight: 500;
font-size: 0.28rem;
color: #737373;
}
.func_btn {
width: 6.9rem;
height: 0.8rem;
background: #1081E3;
border-radius: 0.1rem;
font-family: PingFang SC;
font-weight: 500;
font-size: 0.3rem;
color: #FFFFFF;
margin: 0 auto;
border-width: 0;
}
.tag {
display: inline-block;
width: 0.9rem;
height: 0.42rem;
line-height: 0.42rem;
text-align: center;
background: #00B55E;
border-radius: 21px;
font-weight: 500;
font-size: 0.28rem;
color: #FFFFFF;
}
/* 添加以下样式 */ /* 添加以下样式 */
.van-tabs__line {
background-color: #1989fa;
}
.blue-text {
color: #1989fa;
font-weight: 500;
}
.van-list {
background: #fff;
border-radius: 8px;
margin: 0 0.1rem;
}
.van-cell { .van-cell {
padding: 12px 16px; padding: 12px 16px;
} }
.van-tab__text {
font-weight: bold;
font-size: 0.3rem;
}
.van-tab--active {
color: #1081E3;
}
.van-field__label { .van-field__label {
font-weight: bold; font-weight: bold;
} }
.van-field__control { .van-field__control {
color: #737373; color: #737373;
} }
.subNavWrapper{
background-color: #F5F6FA;
padding: 0.2rem 0.2rem;
}
.subNavWrapper .van-tabs__nav--card {
border: none !important;
}
.subNavWrapper .van-tabs--card{
margin-bottom: 0.3rem;
}
.subNavWrapper .van-tabs__nav--card .van-tab {
color: #5B5B5B;
border: none !important;
}
.subNavWrapper .van-tabs__nav--card .van-tab.van-tab--active {
color: #FFFFFF;
background: #58A5E8;
border-radius: 0.4rem;
}
.subNavWrapper .van-list{
background: #F5F6FA;
}
.subNavWrapper .van-cell{
margin-bottom: .3rem;
}
.subNavWrapper .van-tabs__nav{
background: #F5F6FA;
}
</style> </style>
</head> </head>
<div id="app"> <div id="app">
...@@ -162,23 +31,32 @@ ...@@ -162,23 +31,32 @@
<!-- 表单内容 --> <!-- 表单内容 -->
<van-cell-group inset> <van-cell-group inset>
<van-cell-group> <van-cell-group>
<van-field label="商家名称" v-model="formData.principal" /> <van-field label="商家名称" v-model="formData.sjName1" />
</van-cell-group> </van-cell-group>
<van-cell-group> <van-cell-group>
<van-field label="负责人" v-model="formData.phone" type="tel"/> <van-field label="负责人" v-model="formData.sjName2" type="tel"/>
</van-cell-group>
<van-cell-group>
<van-field label="电话" v-model="formData.sjName3" type="number" />
</van-cell-group> </van-cell-group>
<van-cell-group> <van-cell-group>
<van-field label="电话" v-model="formData.area" type="number" /> <van-field label="地址" v-model="formData.sjName4" />
</van-cell-group> </van-cell-group>
<van-cell-group> <van-cell-group>
<van-field label="地址" v-model="formData.businessHours" /> <van-field label="场所类型" v-model="formData.sjName5"/>
</van-cell-group> </van-cell-group>
<van-cell-group> <van-cell-group>
<van-field label="场所类型" v-model="formData.type"/> <van-field label="场所类型" v-model="formData.type" placeholder="请选择场所类型" readonly clickable
@click="showTypePicker = true" />
</van-cell-group> </van-cell-group>
<van-popup v-model:show="showTypePicker" position="bottom">
<van-picker show-toolbar :columns="typeOptions" @confirm="onConfirmType"
@cancel="showTypePicker = false" />
</van-popup>
<van-cell-group> <van-cell-group>
<van-field label="安全二维码" v-model="formData.type"/> <van-field label="安全二维码" v-model="formData.sjName6"/>
</van-cell-group> </van-cell-group>
</van-cell-group> </van-cell-group>
...@@ -196,12 +74,24 @@ ...@@ -196,12 +74,24 @@
area: '', area: '',
businessHours: '', businessHours: '',
type: '', // 新增类型字段 type: '', // 新增类型字段
sjName1:'威海市宝威酒店有限公司',
sjName2:'XXX',
sjName3:'0631-522221212',
sjName4:'威海市XXXXXXXXX',
sjName5:'小餐饮',
}, },
showTypePicker: false,
typeOptions: ['小餐饮', '酒店', '商场', '学校', '医疗机构'],
} }
}, },
computed: { computed: {
}, },
methods: { methods: {
// 新增选择确认方法
onConfirmType(value) {
this.formData.type = value;
this.showTypePicker = false;
},
viewDetail(id) { viewDetail(id) {
console.log('查看详情:', id); console.log('查看详情:', id);
// 这里添加跳转逻辑 // 这里添加跳转逻辑
......
src/_shanghu_home.html
View file @ 9fe6da05
...@@ -72,7 +72,7 @@ ...@@ -72,7 +72,7 @@
.tag { .tag {
display: inline-block; display: inline-block;
width: 0.9rem; width: 1.8rem;
height: 0.42rem; height: 0.42rem;
line-height: 0.42rem; line-height: 0.42rem;
text-align: center; text-align: center;
...@@ -153,6 +153,7 @@ ...@@ -153,6 +153,7 @@
} }
.subNavWrapper .van-tabs__nav{ .subNavWrapper .van-tabs__nav{
background: #F5F6FA; background: #F5F6FA;
margin: 0;
} }
</style> </style>
</head> </head>
...@@ -162,7 +163,7 @@ ...@@ -162,7 +163,7 @@
<div class="header"> <div class="header">
<!-- <div class="level">安全等级</div> --> <!-- <div class="level">安全等级</div> -->
<div class="title"><img src="https://dummyimage.com/26x26" alt=""><span>威海市宝威酒店有限公司</span><span <div class="title"><img src="https://dummyimage.com/26x26" alt=""><span>威海市宝威酒店有限公司</span><span
class="tag">绿</span> class="tag">安全等级-绿</span>
</div> </div>
<div class="detail"> <div class="detail">
<!-- <div><span>场所类型: 小餐饮</span> </div> <!-- <div><span>场所类型: 小餐饮</span> </div>
...@@ -193,46 +194,13 @@ ...@@ -193,46 +194,13 @@
<!-- Tab栏 --> <!-- Tab栏 -->
<van-tabs v-model:active="activeTab" title-active-color="#1989fa" line-height="2px" <van-tabs v-model:active="activeTab" title-active-color="#1989fa" line-height="2px"
style="margin-bottom: 15px;"> style="margin-bottom: 15px;">
<van-tab title="商家信息"></van-tab>
<van-tab title="隐患整改"></van-tab> <van-tab title="隐患整改"></van-tab>
<van-tab title="检查记录"></van-tab> <van-tab title="检查记录"></van-tab>
<van-tab title="自查记录"></van-tab> <van-tab title="自查记录"></van-tab>
<van-tab title="培训演练"></van-tab>
</van-tabs> </van-tabs>
<!-- 内容区 --> <div v-show="activeTab===0" class="subNavWrapper">
<div v-show="activeTab === 0">
<!-- 表单内容 -->
<van-cell-group inset>
<van-cell-group>
<van-field label="商家名称" v-model="formData.principal" placeholder="请输入负责人姓名" />
</van-cell-group>
<van-cell-group>
<van-field label="负责人" v-model="formData.phone" type="tel" placeholder="请输入联系方式" />
</van-cell-group>
<van-cell-group>
<van-field label="电话" v-model="formData.area" type="number" placeholder="请输入面积（㎡）" />
</van-cell-group>
<van-cell-group>
<van-field label="地址" v-model="formData.businessHours" placeholder="请选择时间" readonly
@click="showTimePicker = true" />
</van-cell-group>
<van-cell-group>
<van-field label="场所类型" v-model="formData.type" placeholder="请选择场所类型" readonly clickable
@click="showTypePicker = true" />
</van-cell-group>
<van-popup v-model:show="showTypePicker" position="bottom">
<van-picker show-toolbar :columns="typeOptions" @confirm="onConfirmType"
@cancel="showTypePicker = false" />
</van-popup>
<van-popup v-model:show="showTimePicker" position="bottom">
<van-datetime-picker type="time" @confirm="onConfirmTime" />
</van-popup>
</van-cell-group>
</div>
<div v-show="activeTab === 1" class="subNavWrapper">
<!-- 隐患记录子Tab --> <!-- 隐患记录子Tab -->
<van-tabs v-model:active="subActiveTab" type="card"> <van-tabs v-model:active="subActiveTab" type="card">
...@@ -240,6 +208,7 @@ ...@@ -240,6 +208,7 @@
<van-tab title="待审核"></van-tab> <van-tab title="待审核"></van-tab>
<van-tab title="待整改"></van-tab> <van-tab title="待整改"></van-tab>
<van-tab title="已整改"></van-tab> <van-tab title="已整改"></van-tab>
<van-tab title="逾期"></van-tab>
</van-tabs> </van-tabs>
<!-- 隐患列表 --> <!-- 隐患列表 -->
<van-list> <van-list>
...@@ -275,7 +244,7 @@ ...@@ -275,7 +244,7 @@
</div> </div>
<!-- 检查记录 --> <!-- 检查记录 -->
<div v-show="activeTab === 2" class="subNavWrapper"> <div v-show="activeTab>0" class="subNavWrapper">
<!-- 隐患列表 --> <!-- 隐患列表 -->
<van-list> <van-list>
......
src/_shanghu_list.html
View file @ 9fe6da05
...@@ -9,12 +9,20 @@ ...@@ -9,12 +9,20 @@
<title>高区“码”上</title> <title>高区“码”上</title>
<script type="text/javascript" src="../sdk/includeHead.js"></script> <script type="text/javascript" src="../sdk/includeHead.js"></script>
<style> <style>
html, body{
background-color: #F5F6FA;
}
.wrapper { .wrapper {
padding: 0.2rem; padding: 0.2rem;
background-color: #fff; background-color: #fff;
background: #F5F6FA; background: #F5F6FA;
} }
.header{
width: 99vw;
margin-left: -.15rem;
margin-top: -.15rem;
}
/* 条件查询样式 */ /* 条件查询样式 */
.header .van-search__label{ .header .van-search__label{
background-color: #fff; background-color: #fff;
...@@ -26,62 +34,6 @@ ...@@ -26,62 +34,6 @@
.header .van-search__content .van-cell{ .header .van-search__content .van-cell{
padding-left: 0.24rem; padding-left: 0.24rem;
} }
.tag {
display: inline-block;
width: 0.9rem;
height: 0.42rem;
line-height: 0.42rem;
text-align: center;
background: #00B55E;
border-radius: 21px;
font-weight: 500;
font-size: 0.28rem;
color: #FFFFFF;
}
/* 添加以下样式 */
.van-tabs__line {
background-color: #1989fa;
}
.blue-text {
color: #1989fa;
font-weight: 500;
}
.van-list {
background: #fff;
border-radius: 8px;
margin: 0 0.1rem;
}
.van-cell {
padding: 12px 16px;
}
.van-tab__text {
font-weight: bold;
font-size: 0.3rem;
}
.van-tab--active {
color: #1081E3;
}
.van-field__label {
font-weight: bold;
}
.van-field__control {
color: #737373;
}
</style> </style>
</head> </head>
...@@ -106,7 +58,7 @@ ...@@ -106,7 +58,7 @@
<!-- 隐患列表 --> <!-- 隐患列表 -->
<van-list> <van-list>
<van-cell v-for="item in filteredHazards" :key="item.id" style="margin-bottom: 0.15rem;margin-top: 0.15rem;"> <van-cell v-for="item in filteredHazards" :key="item.id" style="margin-bottom: 0.25rem;margin-top: 0.25rem;">
<div style="width: 100%;"> <div style="width: 100%;">
<!-- 第一行：隐患描述 --> <!-- 第一行：隐患描述 -->
<div style=" <div style="
...@@ -126,7 +78,7 @@ ...@@ -126,7 +78,7 @@
<!-- 第三行：商家和箭头 --> <!-- 第三行：商家和箭头 -->
<div style="display: flex; justify-content: space-between; align-items: center;"> <div style="display: flex; justify-content: space-between; align-items: center;">
<span style="color: #666; font-size: 0.28rem;">商家名称：威海市宝威酒店有限公司{{ item.shop }}</span> <span style="color: #666; font-size: 0.28rem;">威海市和谐路xxxx号</span>
</div> </div>
</div> </div>
</van-cell> </van-cell>
...@@ -144,31 +96,27 @@ ...@@ -144,31 +96,27 @@
subActiveTab: 0, subActiveTab: 0,
hazardList: [{ hazardList: [{
id: 1, id: 1,
description: '消防通道被货物堵塞，存在严重安全隐患需要立即整改', description: '威海市保卫酒店有限公司1',
status: '待审核', status: '待审核',
date: '2024-03-15', date: '场所类型：小餐饮',
shop: 'XX餐饮店', shop: 'XX餐饮店',
type: 2 type: 2
}, },
{ {
id: 2, id: 2,
description: '消防通道被货物堵塞，存在严重安全隐患需要立即整改', description: '威海市保卫酒店有限公司2',
status: '待整改', status: '待整改',
date: '2024-03-15', date: '场所类型：小餐饮',
shop: 'XX餐饮店', shop: 'XX餐饮店',
type: 2 type: 2
}, },
// 更多示例数据... // 更多示例数据...
], ],
activeTab: 0,
} }
}, },
computed: { computed: {
filteredHazards() { filteredHazards() {
const statusMap = ['全部', '待审核', '待整改', '已整改']; return this.hazardList
return this.hazardList.filter(item =>
this.subActiveTab === 0 ? true : item.status === statusMap[this.subActiveTab]
);
} }
}, },
methods: { methods: {
......
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