Browse Source

1.添加预警时间轴(折叠)

2.bug修改
v3
蟑螂恶霸 2 years ago
parent
commit
922e909bd9
  1. 173
      src/views/enforce/earlyWarning.vue
  2. 2
      src/views/enforce/enforcementPlan.vue
  3. 4
      src/views/enforce/enterpriseBaseInfo.vue
  4. 172
      src/views/enforce/enterpriseWarningInfo.vue

173
src/views/enforce/earlyWarning.vue

@ -64,7 +64,7 @@
<div class="goods_box" v-for="(item, index) in data?.dataList" :key="index">
<van-swipe-cell class="swipe_cell">
<div class="card_box">
<div :class="is_show ? 'new_detail' : 'work_detail'">
<div class="card_box_span">
<p>{{ item.createTime }}
</p>
@ -88,6 +88,29 @@
item.warningLevel==3?"Ⅲ级 (一般)": "Ⅳ (一般)"}}
</p>
</div>
<div class="timbox">
<div class="progress-box level-1">
<div class="timtit">2024-08-25 11:15:02</div>
<div class="prolist"><label>预警原因:</label><span>本月对该企业已检查8次</span></div>
<div class="prolist"><label>预警级别:</label><span>Ⅰ级 (严重)</span></div>
</div>
<div class="progress-box level-2">
<div class="timtit">2024-08-16 16:10:25</div>
<div class="prolist"><label>预警原因:</label><span>本月对该企业已检查6次</span></div>
<div class="prolist"><label>预警级别:</label><span>Ⅱ级 (较重)</span></div>
</div>
<div class="progress-box level-3">
<div class="timtit">2024-08-06 10:22:01</div>
<div class="prolist"><label>预警原因:</label><span>本月对该企业已检查3次</span></div>
<div class="prolist"><label>预警级别:</label><span>Ⅲ级 (一般)</span></div>
</div>
</div>
</div>
<div class="look_all" @click="is_show=!is_show" :class="{ new_up: !is_show }">
<!-- <span>{{words}}</span>-->
<van-icon v-if="!is_show" name="arrow-down" />
<van-icon v-else name="arrow-up" />
</div>
</div>
</van-swipe-cell>
</div>
@ -345,6 +368,29 @@
onRefresh();
}
</script>
<script>
export default {
data()
{
return {
is_show: false
}
},
computed: {
words()
{
if (this.is_show === false)
return '展开'
else if (this.is_show === true)
return '收起'
else if (this.is_show === '')
return null
else
return null
}
},
}
</script>
<style lang="less" scoped>
@ -544,4 +590,129 @@
font-size: 0.35rem;
}
/***折叠**/
.look_all {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 0.75rem;
font-size: 0.3rem;
color: #666;
cursor: pointer;
user-select: none;
border-radius: 0.05rem;
}
.look_all i {
margin: 0 0.2rem;
padding: 0.1rem 0.3rem 0;
color: rgba(0, 0, 0, 0.35);
font-size: 0.4rem;
height: 0.5rem;
/*background: linear-gradient(to bottom, rgba(0, 0, 0, .1), transparent);*/
border-radius: 0.2rem 0.2rem 0 0;
}
.new_detail {
padding-top: 0.3rem;
height: 100%;
transition: height 2s linear;
}
.work_detail {
padding-top: 0.3rem;
height: 3.0rem;
overflow: hidden;
}
.new_up {
position: absolute;
bottom: 0;
}
/***/
.timbox {
margin: 3% 0 3% 8%;
padding-bottom: 1rem;
width: 90%;
height: 94%;
font-size: 0.3rem;
box-sizing: border-box;
}
.timtit {
position: relative;
top: -0.2rem;
left: 1.5%;
margin: 0.2rem 0 0;
font-size: 0.4rem;
color: #999;
}
.progress-box {
position: relative;
float: left;
clear: both;
margin: 0 2% 0 3%;
padding: 0.1rem 0.2rem 0.3rem;
width: 95%;
}
.prolist {
margin: 0 0 0 1.5%;
width: 100%;
color: #666;
line-height: 1.75;
}
.progress-box::before {
position: absolute;
z-index: 10;
left: 0;
top: 0.1rem;
content: '';
width: 0.01rem;
height: 100%;
background-color: rgb(195, 195, 195);
}
.progress-box:last-child::before {
height: 0;
}
.progress-box::after {
position: absolute;
z-index: 10;
left: -0.2rem;
top: 0.1rem;
content: '';
width: 0.25rem;
height: 0.25rem;
border: 0.1rem solid #fff;
border-radius: 0.5rem;
background-color: rgb(155 155 155);
}
.progress-box.level-1::after {
background-color: #ff0000;
}
.progress-box.level-2::after {
background-color: #f78b00;
}
.progress-box.level-3::after {
background-color: #f5cf08;
}
.prolist label {
display: inline-block;
margin-right: 0.1rem;
min-width: 1.2rem;
color: #323233;
}
/**/
</style>

2
src/views/enforce/enforcementPlan.vue

@ -85,7 +85,7 @@
</div>
<div class="btn-list" >
<a v-if="item.isPublish == 0" @click.stop="update(item.id,1)"><van-icon name="edit" />发布</a>
<a v-if="item.isPublish == 1" @click.stop="update(item.id,0)"><van-icon name="edit" />取消发布</a>
<a v-if="item.isPublish == 1" @click.stop="update(item.id,0)"><van-icon name="cross" />取消发布</a>
</div>
</div>
</van-swipe-cell>

4
src/views/enforce/enterpriseBaseInfo.vue

@ -875,8 +875,8 @@ export default {
.look_all i {
margin: 0 0.2rem;
padding: 0.1rem 0.3rem 0;
color: rgba(0, 0, 0, 0.5);
font-size: 0.5rem;
color: rgba(0, 0, 0, 0.35);
font-size: 0.4rem;
height: 0.5rem;
/*background: linear-gradient(to bottom, rgba(0, 0, 0, .1), transparent);*/
border-radius: 0.2rem 0.2rem 0 0;

172
src/views/enforce/enterpriseWarningInfo.vue

@ -40,7 +40,7 @@
<div class="goods_box" v-for="(item, index) in data?.dataList" :key="index">
<van-swipe-cell class="swipe_cell">
<div class="card_box">
<div :class="is_show ? 'new_detail' : 'work_detail'">
<div class="card_box_span">
<p class="warn-time">{{ item.createTime }}
</p>
@ -62,6 +62,29 @@
{{ item.warningLevel==1?"Ⅰ级 (严重)":item.warningLevel==2?"Ⅱ级 (较严重)": item.warningLevel==3?"Ⅲ级 (一般)": "Ⅳ (一般)"}}
</p>
</div>
<div class="timbox">
<div class="progress-box level-1">
<div class="timtit">2024-08-25 11:15:02</div>
<div class="prolist"><label>预警原因:</label><span>本月对该企业已检查8次</span></div>
<div class="prolist"><label>预警级别:</label><span>Ⅰ级 (严重)</span></div>
</div>
<div class="progress-box level-2">
<div class="timtit">2024-08-16 16:10:25</div>
<div class="prolist"><label>预警原因:</label><span>本月对该企业已检查6次</span></div>
<div class="prolist"><label>预警级别:</label><span>Ⅱ级 (较重)</span></div>
</div>
<div class="progress-box level-3">
<div class="timtit">2024-08-06 10:22:01</div>
<div class="prolist"><label>预警原因:</label><span>本月对该企业已检查3次</span></div>
<div class="prolist"><label>预警级别:</label><span>Ⅲ级 (一般)</span></div>
</div>
</div>
</div>
<div class="look_all" @click="is_show=!is_show" :class="{ new_up: !is_show }">
<!-- <span>{{words}}</span>-->
<van-icon v-if="!is_show" name="arrow-down" />
<van-icon v-else name="arrow-up" />
</div>
</div>
</van-swipe-cell>
</div>
@ -271,6 +294,29 @@
queryList();
}
</script>
<script>
export default {
data()
{
return {
is_show: false
}
},
computed: {
words()
{
if (this.is_show === false)
return '展开'
else if (this.is_show === true)
return '收起'
else if (this.is_show === '')
return null
else
return null
}
},
}
</script>
<style lang="less" scoped>
.card_box_label {
@ -494,4 +540,128 @@
font-size: 0.35rem;
}
/***折叠**/
.look_all {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 0.75rem;
font-size: 0.3rem;
color: #666;
cursor: pointer;
user-select: none;
border-radius: 0.05rem;
}
.look_all i {
margin: 0 0.2rem;
padding: 0.1rem 0.3rem 0;
color: rgba(0, 0, 0, 0.35);
font-size: 0.4rem;
height: 0.5rem;
/*background: linear-gradient(to bottom, rgba(0, 0, 0, .1), transparent);*/
border-radius: 0.2rem 0.2rem 0 0;
}
.new_detail {
padding-top: 0.3rem;
height: 100%;
transition: height 2s linear;
}
.work_detail {
padding-top: 0.3rem;
height: 3.0rem;
overflow: hidden;
}
.new_up {
position: absolute;
bottom: 0;
}
/***/
.timbox {
margin: 3% 0 3% 8%;
padding-bottom: 1rem;
width: 90%;
height: 94%;
font-size: 0.3rem;
box-sizing: border-box;
}
.timtit {
position: relative;
top: -0.2rem;
left: 1.5%;
margin: 0.2rem 0 0;
font-size: 0.4rem;
color: #999;
}
.progress-box {
position: relative;
float: left;
clear: both;
margin: 0 2% 0 3%;
padding: 0.1rem 0.2rem 0.3rem;
width: 95%;
}
.prolist {
margin: 0 0 0 1.5%;
width: 100%;
color: #666;
line-height: 1.75;
}
.progress-box::before {
position: absolute;
z-index: 10;
left: 0;
top: 0.1rem;
content: '';
width: 0.01rem;
height: 100%;
background-color: rgb(195, 195, 195);
}
.progress-box:last-child::before {
height: 0;
}
.progress-box::after {
position: absolute;
z-index: 10;
left: -0.2rem;
top: 0.1rem;
content: '';
width: 0.25rem;
height: 0.25rem;
border: 0.1rem solid #fff;
border-radius: 0.5rem;
background-color: rgb(155 155 155);
}
.progress-box.level-1::after {
background-color: #ff0000;
}
.progress-box.level-2::after {
background-color: #f78b00;
}
.progress-box.level-3::after {
background-color: #f5cf08;
}
.prolist label {
display: inline-block;
margin-right: 0.1rem;
min-width: 1.2rem;
color: #323233;
}
/**/
</style>

Loading…
Cancel
Save