群发审批
This commit is contained in:
liuye
178
src/project/pidu/AppExamineApprove/AppExamineApprove.vue
Normal file
178
src/project/pidu/AppExamineApprove/AppExamineApprove.vue
Normal file
@@ -0,0 +1,178 @@
|
||||
<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>
|
||||
185
src/project/pidu/AppExamineApprove/detail.vue
Normal file
185
src/project/pidu/AppExamineApprove/detail.vue
Normal file
@@ -0,0 +1,185 @@
|
||||
<template>
|
||||
<div class="detail">
|
||||
<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>
|
||||
<img src="https://img2.baidu.com/it/u=1361506290,4036378790&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=500" alt="" class="status-img">
|
||||
</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: "detail",
|
||||
data() {
|
||||
return {
|
||||
|
||||
};
|
||||
},
|
||||
onShow() {
|
||||
document.title = '群发审批'
|
||||
},
|
||||
methods: {
|
||||
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.detail {
|
||||
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;
|
||||
position: relative;
|
||||
.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;
|
||||
}
|
||||
}
|
||||
.status-img {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
.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>
|
||||
Reference in New Issue
Block a user