178 lines
4.0 KiB
Vue
178 lines
4.0 KiB
Vue
<template>
|
||
<div class="AppExamineApprove">
|
||
<p class="tips">请在12月13日 24:00前完成群发任务</p>
|
||
<div class="info">
|
||
<div class="title">群发客户群</div>
|
||
<div class="item">
|
||
<span class="label">任务名称</span>
|
||
<span class="value">居民社保最新政策</span>
|
||
</div>
|
||
<div class="item">
|
||
<span class="label">创建人</span>
|
||
<span class="value">李逸云</span>
|
||
</div>
|
||
</div>
|
||
<div class="content">
|
||
<div class="flex">
|
||
<span class="label">群发范围</span>
|
||
<span class="value">我的全部居民群<u-icon name="arrow-right" color="#CECECE" size="26"></u-icon></span>
|
||
</div>
|
||
<div class="flex">
|
||
<span class="label">群发内容</span>
|
||
</div>
|
||
<p class="text">构建全域数字大脑，助力政府科学决策，构建全域数字大脑，助力政府科学决策</p>
|
||
<div class="img-list">
|
||
<div class="item">
|
||
<img src="https://img2.baidu.com/it/u=1361506290,4036378790&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=500" alt="">
|
||
<div>
|
||
<p>数字乡村现场活动照.png</p>
|
||
<span>24K</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="bottom-btn">前往群发</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
name: "AppExamineApprove",
|
||
appName: "群发审批",
|
||
data() {
|
||
return {
|
||
|
||
};
|
||
},
|
||
onShow() {
|
||
document.title = '群发审批'
|
||
},
|
||
methods: {
|
||
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.AppExamineApprove {
|
||
height: 100%;
|
||
.tips {
|
||
padding: 32px;
|
||
background-color: #FFF8F3;
|
||
font-family: PingFangSC-Regular;
|
||
font-size: 30px;
|
||
color: #FF883C;
|
||
line-height: 40px;
|
||
}
|
||
.info {
|
||
border-radius: 8px;
|
||
background-color: #fff;
|
||
margin: 24px 32px;
|
||
.title {
|
||
padding: 26px 0 28px 32px;
|
||
font-family: PingFangSC-Medium;
|
||
font-weight: 500;
|
||
font-size: 32px;
|
||
color: #333;
|
||
line-height: 44px;
|
||
border-bottom: 1px solid #ddd;
|
||
}
|
||
.item {
|
||
padding: 28px 32px;
|
||
display: flex;
|
||
line-height: 40px;
|
||
font-size: 30px;
|
||
.label {
|
||
color: #999;
|
||
width: 176px;
|
||
}
|
||
.value {
|
||
color: #333;
|
||
width: calc(100% - 176px);
|
||
word-break: break-all;
|
||
}
|
||
}
|
||
}
|
||
.content{
|
||
border-radius: 8px;
|
||
padding-bottom: 40px;
|
||
background-color: #fff;
|
||
margin: 0 32px 120px;
|
||
.flex {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
line-height: 40px;
|
||
font-size: 30px;
|
||
padding: 28px 32px;
|
||
.label {
|
||
color: #999;
|
||
width: 176px;
|
||
}
|
||
.value {
|
||
color: #333;
|
||
width: calc(100% - 176px);
|
||
word-break: break-all;
|
||
text-align: right;
|
||
.u-icon {
|
||
margin-left: 8px;
|
||
}
|
||
}
|
||
}
|
||
.text {
|
||
padding: 20px;
|
||
font-family: PingFangSC-Regular;
|
||
font-size: 28px;
|
||
color: #333;
|
||
word-break: break-all;
|
||
line-height: 40px;
|
||
border-radius: 4px;
|
||
background-color: #F9F9F9;
|
||
margin: 0 32px 32px;
|
||
}
|
||
.img-list {
|
||
border-radius: 4px;
|
||
background-color: #F9F9F9;
|
||
margin: 0 32px 0;
|
||
.item {
|
||
padding: 20px;
|
||
display: flex;
|
||
img {
|
||
width: 160px;
|
||
height: 160px;
|
||
margin-right: 20px;
|
||
}
|
||
div {
|
||
width: calc(100% - 180px);
|
||
p {
|
||
font-family: PingFangSC-Regular;
|
||
font-size: 32px;
|
||
color: #333;
|
||
line-height: 44px;
|
||
word-break: break-all;
|
||
margin-bottom: 8px;
|
||
}
|
||
span {
|
||
font-family: PingFangSC-Regular;
|
||
font-size: 26px;
|
||
color: #9B9B9B;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.bottom-btn {
|
||
position: fixed;
|
||
bottom: 0;
|
||
left: 0;
|
||
width: 100%;
|
||
height: 112px;
|
||
line-height: 112px;
|
||
text-align: center;
|
||
background: #3975C6;
|
||
font-family: PingFangSC-Medium;
|
||
font-weight: 500;
|
||
font-size: 32px;
|
||
color: #FFF;
|
||
}
|
||
}
|
||
</style> |