Merge branch 'master' of https://gitee.com/xizuoyou/rising_sun
This commit is contained in:
沈学坤
@@ -1,64 +0,0 @@
|
||||
<template>
|
||||
<div id="wrapper-w" :style="{'background-image':'url('+imgUrl.foot+')'}">
|
||||
<div>
|
||||
<p>版权所有：朝阳区委社会工委区民政局</p>
|
||||
<p>京ICP备19040879号 Copyright 2019-2029 www.cyteam.orz.cn All Rights Reserved</p>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
components: {},
|
||||
props: {},
|
||||
data () {
|
||||
return {
|
||||
imgUrl: {
|
||||
foot: require('../../static/img/foot.png')
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
methods: {},
|
||||
created () {},
|
||||
mounted () {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang='scss' scoped>
|
||||
#wrapper-w {
|
||||
width: 1280px;
|
||||
height: 227px !important;
|
||||
background-size: 100% 100%;
|
||||
background-color: rgba($color: #000000, $alpha: 0.6);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
& > div {
|
||||
display: inline-block;
|
||||
height: 64px;
|
||||
text-align: center;
|
||||
|
||||
& > p:first-child {
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: -1px;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
& > p:last-child {
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
font-stretch: normal;
|
||||
line-height: 60px;
|
||||
letter-spacing: 0px;
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,85 +0,0 @@
|
||||
<template>
|
||||
<div id="wrapper" :style="{'background-image':'url('+imgUrl.home+')'}">
|
||||
<div class="box">
|
||||
<div @click="$jump('homePage')" :class="styleNum == 0 ? 'style': ''">党组织建设</div>
|
||||
<div
|
||||
@click="$jump('informationQuery',{id:1,text:'666'})"
|
||||
:class="styleNum == 1 ? 'style': ''"
|
||||
>社会组织信用信息查询</div>
|
||||
<div @click="$jump('project')" :class="styleNum == 2 ? 'style': ''">政府购买社会组织服务项目管理</div>
|
||||
<div @click="$jump('personalZte')" :class="styleNum == 3 ? 'style': ''">个人中心</div>
|
||||
<div>
|
||||
<span @click="$jump('login')">登录</span> |
|
||||
<span @click="$jump('registered')">注册</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
components: {},
|
||||
props: ['index_num'],
|
||||
data () {
|
||||
return {
|
||||
imgUrl: { home: require('../../static/img/home.png') },
|
||||
styleNum: 0
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
methods: {},
|
||||
created () {
|
||||
let sub = this.styleNum
|
||||
sub = this.$props.index_num
|
||||
this.styleNum = sub
|
||||
},
|
||||
mounted () {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang='scss' scoped>
|
||||
#wrapper {
|
||||
width: 1280px;
|
||||
height: 389px;
|
||||
box-sizing: border-box;
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
|
||||
.box {
|
||||
position: absolute;
|
||||
bottom: 0%;
|
||||
left: 0%;
|
||||
width: 1280px;
|
||||
height: 63px;
|
||||
background-color: rgba($color: #fff, $alpha: 0.5);
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
align-items: center;
|
||||
|
||||
& > div {
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #333333;
|
||||
text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.style {
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #ffffff;
|
||||
text-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.35);
|
||||
padding: 21px;
|
||||
background-color: #e60012;
|
||||
border-radius: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,761 +0,0 @@
|
||||
<template>
|
||||
<div class="wrapper">
|
||||
<header-nav :index_num="index_num"></header-nav>
|
||||
<div id="box">
|
||||
<h3>项目创建</h3>
|
||||
<!-- 导航 -->
|
||||
<div class="box">
|
||||
<div :class="sub == 0 ? 'color' : ''"
|
||||
:style="{'background-image': sub == 0 ? 'url('+imgUrl.bg0+')' : 'url('+imgUrl.bg1+')'}">1 填写基本信息</div>
|
||||
<div :class="sub == 1 ? 'color' : ''"
|
||||
:style="{'background-image': sub == 1 ? 'url('+imgUrl.bg0+')' : 'url('+imgUrl.bg1+')'}">2 填写详细信息</div>
|
||||
</div>
|
||||
<form action
|
||||
onsubmit="return false">
|
||||
<div v-if="sub == 0">
|
||||
<h4>一、基本信息</h4>
|
||||
<!-- start -->
|
||||
<aside>
|
||||
<div>
|
||||
<label for>项目名称:</label>
|
||||
<input type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
<div>
|
||||
<label for>项目申报单位:</label>
|
||||
<input type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
</aside>
|
||||
<!-- end -->
|
||||
<!-- start -->
|
||||
<aside>
|
||||
<div>
|
||||
<label for>项目类型:</label>
|
||||
<input type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
<div>
|
||||
<label for>项目落地区域:</label>
|
||||
<input type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
</aside>
|
||||
<!-- end -->
|
||||
<!-- start -->
|
||||
<aside>
|
||||
<div>
|
||||
<label for>一级项目方向:</label>
|
||||
<input type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
<div>
|
||||
<label for>二级项目方向:</label>
|
||||
<input type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
</aside>
|
||||
<!-- end -->
|
||||
<!-- start -->
|
||||
<aside>
|
||||
<div>
|
||||
<label for>项目服务领域:</label>
|
||||
<input type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
<div>
|
||||
<label for>申报单位属性:</label>
|
||||
<input type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
</aside>
|
||||
<!-- end -->
|
||||
<!-- start -->
|
||||
<aside>
|
||||
<div>
|
||||
<label for>申请日期:</label>
|
||||
<select name
|
||||
id>
|
||||
<option value>2019-01-31</option>
|
||||
<option value>2019-01-20</option>
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label for>截止日期:</label>
|
||||
<select name
|
||||
id>
|
||||
<option value>2019-01-31</option>
|
||||
<option value>2019-01-20</option>
|
||||
</select>
|
||||
</div>
|
||||
</aside>
|
||||
<!-- end -->
|
||||
<!-- start -->
|
||||
<aside>
|
||||
<div>
|
||||
<label for>通讯地址:</label>
|
||||
<input type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
<div>
|
||||
<label for>邮政编码:</label>
|
||||
<input type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
</aside>
|
||||
<!-- end -->
|
||||
<!-- start -->
|
||||
<aside>
|
||||
<div>
|
||||
<label for>电子信箱:</label>
|
||||
<input type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
<div>
|
||||
<label for>传真电话:</label>
|
||||
<input type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
</aside>
|
||||
<!-- end -->
|
||||
<!-- start -->
|
||||
<aside>
|
||||
<div>
|
||||
<label for>法定代表人:</label>
|
||||
<input type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
<div>
|
||||
<label for>法人代码:</label>
|
||||
<input type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
</aside>
|
||||
<!-- end -->
|
||||
<!-- start -->
|
||||
<aside>
|
||||
<div>
|
||||
<label for>负责人姓名:</label>
|
||||
<input class="i"
|
||||
type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
<div>
|
||||
<label for>职务:</label>
|
||||
<input class="i"
|
||||
type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
<div>
|
||||
<label for>办公电话:</label>
|
||||
<input class="i"
|
||||
type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
<div>
|
||||
<label for>手机:</label>
|
||||
<input class="i"
|
||||
type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
</aside>
|
||||
<!-- end -->
|
||||
<aside>
|
||||
<div>
|
||||
<label for>联系人姓名:</label>
|
||||
<input class="i"
|
||||
type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
<div>
|
||||
<label for>职务:</label>
|
||||
<input class="i"
|
||||
type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
<div>
|
||||
<label for>办公电话:</label>
|
||||
<input class="i"
|
||||
type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
<div>
|
||||
<label for>手机:</label>
|
||||
<input class="i"
|
||||
type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
</aside>
|
||||
<!-- end -->
|
||||
<div class="btn"
|
||||
@click="btn(1)">下一步</div>
|
||||
</div>
|
||||
<div v-if="sub == 1">
|
||||
<div class="cc">
|
||||
<!-- start -->
|
||||
<aside>
|
||||
<div>
|
||||
<label for>项目主责单位:</label>
|
||||
<input class="i-i"
|
||||
type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
</aside>
|
||||
<!-- end -->
|
||||
<!-- start -->
|
||||
<aside>
|
||||
<div>
|
||||
<label for>项目名称:</label>
|
||||
<input type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
<div>
|
||||
<label for>邮政编码:</label>
|
||||
<input type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
</aside>
|
||||
<!-- end -->
|
||||
<!-- start -->
|
||||
<aside>
|
||||
<div>
|
||||
<label for>电子信箱:</label>
|
||||
<input type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
<div>
|
||||
<label for>传真电话:</label>
|
||||
<input type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
</aside>
|
||||
<!-- end -->
|
||||
<!-- start -->
|
||||
<aside>
|
||||
<div>
|
||||
<label for>负责人姓名:</label>
|
||||
<input class="i"
|
||||
type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
<div>
|
||||
<label for>职务:</label>
|
||||
<input class="i"
|
||||
type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
<div>
|
||||
<label for>办公电话:</label>
|
||||
<input class="i"
|
||||
type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
<div>
|
||||
<label for>手机:</label>
|
||||
<input class="i"
|
||||
type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
</aside>
|
||||
<!-- end -->
|
||||
<aside>
|
||||
<div>
|
||||
<label for>联系人姓名:</label>
|
||||
<input class="i"
|
||||
type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
<div>
|
||||
<label for>职务:</label>
|
||||
<input class="i"
|
||||
type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
<div>
|
||||
<label for>办公电话:</label>
|
||||
<input class="i"
|
||||
type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
<div>
|
||||
<label for>手机:</label>
|
||||
<input class="i"
|
||||
type="text"
|
||||
name
|
||||
id />
|
||||
</div>
|
||||
</aside>
|
||||
<!-- end -->
|
||||
</div>
|
||||
<div>
|
||||
<div class="xx">
|
||||
<h5>二、申报单位简介</h5>
|
||||
<textarea name
|
||||
id></textarea>
|
||||
</div>
|
||||
<div class="xx">
|
||||
<h5>三、项目简介</h5>
|
||||
<textarea name
|
||||
id></textarea>
|
||||
</div>
|
||||
<div class="xx">
|
||||
<h5>四、项目论证</h5>
|
||||
<textarea name
|
||||
id></textarea>
|
||||
</div>
|
||||
<div class="xx">
|
||||
<h5>五、经费预算</h5>
|
||||
<textarea name
|
||||
id></textarea>
|
||||
</div>
|
||||
<div class="xxx">
|
||||
<h5>六、申报单位承诺</h5>
|
||||
<div class="plpl">
|
||||
<span @click="thf()"
|
||||
:class="thff ? 'ic' : ''"
|
||||
class="iconfont icon-fuxuankuang_xuanzhong"></span>
|
||||
<label for>我们确认项目中报内容的真实性,并愿意承担相应的责任</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="xxx">
|
||||
<h5>七、项目主责单位意见</h5>
|
||||
<div class="btnn">
|
||||
<label id="uploadFile">
|
||||
上传文件
|
||||
<input id="uploadFile"
|
||||
v-show="false"
|
||||
type="file"
|
||||
@change="getFile($event)" />
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ll">
|
||||
<div>保存</div>
|
||||
<input type="submit"
|
||||
name="submit"
|
||||
value="提交" />
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<footer-nav class="footer"></footer-nav>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable */
|
||||
import HeaderNav from "../../components/HeaderNav";
|
||||
/* eslint-disable */
|
||||
import FooterNav from "../../components/FooterNav";
|
||||
export default {
|
||||
components: {
|
||||
HeaderNav,
|
||||
FooterNav
|
||||
},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
index_num: 2,
|
||||
sub: 0,
|
||||
file: "",
|
||||
imgUrl: {
|
||||
bg0: require("../../../static/img/bg0.png"),
|
||||
bg1: require("../../../static/img/bg1.png"),
|
||||
xa: require("../../../static/img/xa.png")
|
||||
},
|
||||
thff: false
|
||||
};
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
methods: {
|
||||
thf() {
|
||||
this.thff = !this.thff;
|
||||
},
|
||||
btn(index) {
|
||||
let s = this.sub;
|
||||
s = index;
|
||||
this.sub = s;
|
||||
},
|
||||
getFile(event) {
|
||||
this.file = event.target.files[0];
|
||||
console.log(this.file);
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
mounted() {}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang='scss' scoped>
|
||||
.wrapper {
|
||||
width: 1280px;
|
||||
box-sizing: border-box;
|
||||
|
||||
#box {
|
||||
margin: 40px auto 0;
|
||||
padding: 34px 32px 100px 28px;
|
||||
box-sizing: border-box;
|
||||
width: 1200px;
|
||||
background-color: #ffffff;
|
||||
|
||||
form {
|
||||
.ll {
|
||||
margin-top: 80px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
div {
|
||||
margin-right: 152px;
|
||||
width: 197px;
|
||||
height: 63px;
|
||||
background-color: #ff9800;
|
||||
border-radius: 5px;
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 26px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
line-height: 63px;
|
||||
letter-spacing: 0px;
|
||||
color: #ffffff;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
input[type="submit"] {
|
||||
width: 197px;
|
||||
height: 63px;
|
||||
background-color: #e60012;
|
||||
border-radius: 5px;
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 26px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
line-height: 63px;
|
||||
text-align: center;
|
||||
letter-spacing: 0px;
|
||||
color: #ffffff;
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
|
||||
.xxx {
|
||||
margin-top: 60px;
|
||||
width: 100%;
|
||||
height: 72px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
|
||||
.plpl {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
label {
|
||||
margin-left: 16px;
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
line-height: 25px;
|
||||
letter-spacing: 0px;
|
||||
color: #323232;
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
font-size: 22px;
|
||||
color: #999;
|
||||
}
|
||||
.ic {
|
||||
color: #e60012;
|
||||
}
|
||||
}
|
||||
|
||||
.btnn {
|
||||
cursor: pointer;
|
||||
width: 96px;
|
||||
height: 32px;
|
||||
background-image: linear-gradient(
|
||||
69deg,
|
||||
#cc263f 0%,
|
||||
#f42b47 100%,
|
||||
#ed162d 100%,
|
||||
#e60012 100%
|
||||
),
|
||||
linear-gradient(#e60012, #e60012);
|
||||
background-blend-mode: normal, normal;
|
||||
border-radius: 4px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
label {
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.xx {
|
||||
margin-top: 60px;
|
||||
width: 100%;
|
||||
height: 188px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
|
||||
textarea {
|
||||
width: 1139px;
|
||||
height: 138px;
|
||||
background-color: #ffffff;
|
||||
border: solid 1px #c7c7c7;
|
||||
resize: none;
|
||||
}
|
||||
|
||||
h5 {
|
||||
width: 100%;
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 20px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.cc {
|
||||
width: 1140px;
|
||||
margin: 0 auto 0px;
|
||||
aside {
|
||||
width: 100%;
|
||||
height: 43px;
|
||||
div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
label {
|
||||
display: inline-block;
|
||||
width: 101px;
|
||||
height: 43px;
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
line-height: 43px;
|
||||
text-align: right;
|
||||
letter-spacing: 0px;
|
||||
color: #323232;
|
||||
}
|
||||
|
||||
.i-i {
|
||||
width: 1009px;
|
||||
height: 43px;
|
||||
background-color: #ffffff;
|
||||
border: solid 1px #c7c7c7;
|
||||
outline: none;
|
||||
margin-left: 30px;
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 18px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #323232;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
margin: 60px auto 0;
|
||||
width: 230px;
|
||||
height: 63px;
|
||||
background-color: #e60012;
|
||||
border-radius: 5px;
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 26px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
line-height: 63px;
|
||||
letter-spacing: 0px;
|
||||
text-align: center;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
aside {
|
||||
width: 1138px;
|
||||
height: 43px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 25px;
|
||||
|
||||
label {
|
||||
display: inline-block;
|
||||
width: 101px;
|
||||
height: 43px;
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
line-height: 43px;
|
||||
text-align: right;
|
||||
letter-spacing: 0px;
|
||||
color: #323232;
|
||||
}
|
||||
|
||||
select {
|
||||
/* 清除默认的箭头样式 */
|
||||
appearance: none;
|
||||
-moz-appearance: none;
|
||||
-webkit-appearance: none;
|
||||
/* 右侧添加小箭头的背景图 */
|
||||
background: url("../../../static/img/xa.png") 360px center no-repeat;
|
||||
background-size: 14px 8px;
|
||||
width: 386px;
|
||||
height: 43px;
|
||||
background-color: #ffffff;
|
||||
border: solid 1px #c7c7c7;
|
||||
padding-left: 83px;
|
||||
box-sizing: border-box;
|
||||
outline: none;
|
||||
margin-left: 30px;
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 18px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #323232;
|
||||
}
|
||||
|
||||
input {
|
||||
box-sizing: border-box;
|
||||
width: 386px;
|
||||
height: 43px;
|
||||
background-color: #ffffff;
|
||||
border: solid 1px #c7c7c7;
|
||||
outline: none;
|
||||
margin-left: 30px;
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 18px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #323232;
|
||||
}
|
||||
|
||||
.i {
|
||||
width: 151px;
|
||||
height: 43px;
|
||||
background-color: #ffffff;
|
||||
border: solid 1px #c7c7c7;
|
||||
outline: none;
|
||||
margin-left: 30px;
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 18px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #323232;
|
||||
}
|
||||
}
|
||||
|
||||
h4 {
|
||||
width: 1138px;
|
||||
height: 38px;
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 20px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #333333;
|
||||
padding-left: 30px;
|
||||
box-sizing: border-box;
|
||||
border-bottom: 1px solid #ccc;
|
||||
margin-bottom: 54px;
|
||||
}
|
||||
}
|
||||
|
||||
.box {
|
||||
width: 395px;
|
||||
height: 34px;
|
||||
margin: 44px auto 70px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
div {
|
||||
width: 192px;
|
||||
height: 34px;
|
||||
background-size: 100% 100%;
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
line-height: 34px;
|
||||
text-align: center;
|
||||
letter-spacing: 0px;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.color {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
h3 {
|
||||
width: 89px;
|
||||
height: 23px;
|
||||
margin: 0 auto;
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 22px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.footer {
|
||||
margin-top: 80px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,598 +0,0 @@
|
||||
<template>
|
||||
<div class="wrapper">
|
||||
<header-nav :index_num="index_num"></header-nav>
|
||||
<div id="box">
|
||||
<!-- 公告 -->
|
||||
<div class="top">
|
||||
<img :src="imgUrl.xlb"
|
||||
alt />
|
||||
<div>
|
||||
<span>世界婚博会已通过初审</span>
|
||||
<time>[2019-07-31]</time>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bottom">
|
||||
<!-- 表格 -->
|
||||
<div class="table">
|
||||
<div class="top-p">项目概览</div>
|
||||
<div class="top-b">
|
||||
<div>
|
||||
<section>
|
||||
<span>初筛通过</span>
|
||||
<span>10</span>
|
||||
</section>
|
||||
</div>
|
||||
<div>
|
||||
<section>
|
||||
<span>立项通过</span>
|
||||
<span>10</span>
|
||||
</section>
|
||||
</div>
|
||||
<div>
|
||||
<section>
|
||||
<span>执行中</span>
|
||||
<span>10</span>
|
||||
</section>
|
||||
</div>
|
||||
<div>
|
||||
<section>
|
||||
<span>已完结</span>
|
||||
<span>10</span>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 下拉框 -->
|
||||
<div class="select">
|
||||
<select class="one"
|
||||
name="date">
|
||||
<option value>2017/10/14 至 2017/10/15</option>
|
||||
<option value>2017/10/14 至 2017/10/15</option>
|
||||
</select>
|
||||
<select class="two"
|
||||
name="type">
|
||||
<option value>类型1</option>
|
||||
<option value>类型2</option>
|
||||
</select>
|
||||
<select class="three"
|
||||
name="area">
|
||||
<option value>区域1</option>
|
||||
<option value>区域2</option>
|
||||
</select>
|
||||
<span @click="$jump('application')">项目申报</span>
|
||||
</div>
|
||||
<!-- container -->
|
||||
<div class="con">
|
||||
<!-- 导航 -->
|
||||
<div class="top-t">
|
||||
<h3 @click="btn(index)"
|
||||
v-for="(item,index) in text"
|
||||
:key="index"
|
||||
:class="sub == index ? 'style' : ''">{{item}}</h3>
|
||||
</div>
|
||||
<!-- 主题内容 -->
|
||||
<div class="cc">
|
||||
<template v-for="(item,index) in sData">
|
||||
<div class="list"
|
||||
:key="index"
|
||||
v-if="index < 9"
|
||||
@click="$jump('schedule')">
|
||||
<div class="div">
|
||||
<div class="bb">
|
||||
<h3>世界婚博会</h3>
|
||||
<h5>活动</h5>
|
||||
</div>
|
||||
<time>2019-07-19</time>
|
||||
</div>
|
||||
<dl>
|
||||
<dt>
|
||||
<img :src="imgUrl.tg"
|
||||
v-if="item.state == 0" />
|
||||
<img :src="imgUrl.btg"
|
||||
v-if="item.state == 1" />
|
||||
<img :src="imgUrl.shz"
|
||||
v-if="item.state == 2" />
|
||||
<img :src="imgUrl.zxz"
|
||||
v-if="item.state == 3" />
|
||||
</dt>
|
||||
<dd>
|
||||
<span class="iconfont icon-zuzhijiegou"></span>
|
||||
<span>朝阳社会组织</span>
|
||||
</dd>
|
||||
<dd>
|
||||
<span class="iconfont icon-weizhi"></span>
|
||||
<span>北京市朝阳区建外街道</span>
|
||||
</dd>
|
||||
<dd>
|
||||
<span class="iconfont icon-shenhetongguo1"></span>
|
||||
<span>当前申报阶段：立项审核中</span>
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 分页按钮 -->
|
||||
<div class="page">
|
||||
<el-pagination @size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
:current-page="currentPage"
|
||||
:page-size="pageSize"
|
||||
background
|
||||
layout="prev, pager, next"
|
||||
:total="10"></el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<footer-nav class="footer"></footer-nav>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable */
|
||||
import HeaderNav from "../../components/HeaderNav";
|
||||
/* eslint-disable */
|
||||
import FooterNav from "../../components/FooterNav";
|
||||
export default {
|
||||
components: {
|
||||
HeaderNav,
|
||||
FooterNav
|
||||
},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
index_num: 2,
|
||||
pageSize: 1,
|
||||
currentPage: 1,
|
||||
totalCount: 1,
|
||||
imgUrl: {
|
||||
xlb: require("../../../static/img/xlb.png"),
|
||||
tg: require("../../../static/img/tg.png"),
|
||||
btg: require("../../../static/img/btg.png"),
|
||||
shz: require("../../../static/img/shz.png"),
|
||||
zxz: require("../../../static/img/zxz.png")
|
||||
},
|
||||
text: ["全部", "项目初筛", "项目立项"],
|
||||
sub: 0,
|
||||
sData: [
|
||||
{ state: 0 },
|
||||
{ state: 0 },
|
||||
{ state: 0 },
|
||||
{ state: 1 },
|
||||
{ state: 1 },
|
||||
{ state: 2 },
|
||||
{ state: 3 },
|
||||
{ state: 3 },
|
||||
{ state: 2 },
|
||||
{ state: 0 }
|
||||
]
|
||||
};
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
methods: {
|
||||
btn(index) {
|
||||
let s = this.sub;
|
||||
s = index;
|
||||
this.sub = s;
|
||||
},
|
||||
handleSizeChange(val) {
|
||||
this.pageNum = val;
|
||||
this.getPackData();
|
||||
},
|
||||
handleCurrentChange(val) {
|
||||
this.currentPage = val;
|
||||
this.getPackData();
|
||||
},
|
||||
getPackData() {}
|
||||
},
|
||||
created() {
|
||||
this.currentPage = Number(localStorage.getItem("pagination")) || 1;
|
||||
this.handleCurrentChange(this.currentPage);
|
||||
},
|
||||
mounted() {}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang='scss' scoped>
|
||||
.wrapper {
|
||||
width: 1280px;
|
||||
box-sizing: border-box;
|
||||
|
||||
.footer {
|
||||
margin-top: 80px;
|
||||
}
|
||||
|
||||
#box {
|
||||
margin: 0 auto;
|
||||
width: 1200px;
|
||||
box-sizing: border-box;
|
||||
|
||||
.bottom {
|
||||
padding: 35px 30px 0px;
|
||||
box-sizing: border-box;
|
||||
width: 1200px;
|
||||
height: 1320px;
|
||||
background-color: #ffffff;
|
||||
|
||||
.page {
|
||||
margin-top: 60px;
|
||||
height: 36px;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
|
||||
/deep/ .el-pagination.is-background .el-pager li {
|
||||
color: #333 !important;
|
||||
}
|
||||
|
||||
/deep/ .el-pagination.is-background .el-pager li:not(.disabled).active {
|
||||
background-color: #e60012;
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
/deep/ .el-icon.el-icon-arrow-left::before {
|
||||
content: "上一页";
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 12px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 1px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
/deep/ .el-pagination .btn-prev {
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
/deep/ .el-pagination .btn-next {
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
/deep/ .el-icon.el-icon-arrow-right::before {
|
||||
content: "下一页";
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 12px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 1px;
|
||||
color: #666;
|
||||
}
|
||||
}
|
||||
|
||||
.con {
|
||||
width: 1140px;
|
||||
height: 773px;
|
||||
|
||||
.cc {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
|
||||
.list {
|
||||
margin-bottom: 60px;
|
||||
width: 367px;
|
||||
height: 184px;
|
||||
background-color: #ffffff;
|
||||
box-shadow: 0px 19px 21px 3px rgba(145, 142, 142, 0.1);
|
||||
border-radius: 10px;
|
||||
padding: 19px 29px 0px 16px;
|
||||
box-sizing: border-box;
|
||||
|
||||
dl {
|
||||
width: 100%;
|
||||
height: 97px;
|
||||
margin-top: 25px;
|
||||
position: relative;
|
||||
|
||||
dd {
|
||||
margin-bottom: 22px;
|
||||
.iconfont {
|
||||
font-size: 17px;
|
||||
color: #ccc;
|
||||
margin-right: 16px;
|
||||
}
|
||||
span {
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
|
||||
dt {
|
||||
img {
|
||||
position: absolute;
|
||||
right: -8.5%;
|
||||
bottom: -26%;
|
||||
width: 119px;
|
||||
height: 95px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.div {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
time {
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #999999;
|
||||
}
|
||||
.bb {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
h5 {
|
||||
margin-left: 6px;
|
||||
height: 18px;
|
||||
color: #f6ad35;
|
||||
text-align: center;
|
||||
line-height: 18px;
|
||||
border: 1px solid #f6ad35;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
}
|
||||
h3 {
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.top-t {
|
||||
width: 1140px;
|
||||
height: 38px;
|
||||
padding-left: 12px;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: flex-start;
|
||||
border-bottom: 1px solid #ccc;
|
||||
margin-bottom: 60px;
|
||||
|
||||
h3 {
|
||||
text-align: center;
|
||||
margin-right: 78px;
|
||||
width: 90px;
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 20px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.style {
|
||||
color: #e60012;
|
||||
position: relative;
|
||||
&::after {
|
||||
content: "";
|
||||
width: 91px;
|
||||
height: 2px;
|
||||
background-image: linear-gradient(#e60012, #e60012),
|
||||
linear-gradient(#ff7f7f, #ff7f7f);
|
||||
background-blend-mode: normal, normal;
|
||||
position: absolute;
|
||||
left: 0%;
|
||||
bottom: -94%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.select {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-top: 50px;
|
||||
margin-bottom: 50px;
|
||||
|
||||
.one {
|
||||
padding-left: 30px;
|
||||
box-sizing: border-box;
|
||||
/* 清除默认的箭头样式 */
|
||||
appearance: none;
|
||||
-moz-appearance: none;
|
||||
-webkit-appearance: none;
|
||||
/* 右侧添加小箭头的背景图 */
|
||||
background: url("../../../static/img/xa.png") 280px center no-repeat;
|
||||
background-size: 14px 8px;
|
||||
width: 325px;
|
||||
height: 38px;
|
||||
background-color: #f9f8f8;
|
||||
border-radius: 4px;
|
||||
border: solid 1px #c7c7c7;
|
||||
outline: none;
|
||||
font-size: 18px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.two {
|
||||
padding-left: 30px;
|
||||
box-sizing: border-box;
|
||||
/* 清除默认的箭头样式 */
|
||||
appearance: none;
|
||||
-moz-appearance: none;
|
||||
-webkit-appearance: none;
|
||||
/* 右侧添加小箭头的背景图 */
|
||||
background: url("../../../static/img/xa.png") 90px center no-repeat;
|
||||
background-size: 14px 8px;
|
||||
width: 134px;
|
||||
height: 38px;
|
||||
background-color: #f9f8f8;
|
||||
border-radius: 4px;
|
||||
border: solid 1px #c7c7c7;
|
||||
outline: none;
|
||||
font-size: 18px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.three {
|
||||
padding-left: 30px;
|
||||
box-sizing: border-box;
|
||||
/* 清除默认的箭头样式 */
|
||||
appearance: none;
|
||||
-moz-appearance: none;
|
||||
-webkit-appearance: none;
|
||||
/* 右侧添加小箭头的背景图 */
|
||||
background: url("../../../static/img/xa.png") 90px center no-repeat;
|
||||
background-size: 14px 8px;
|
||||
width: 134px;
|
||||
height: 38px;
|
||||
background-color: #f9f8f8;
|
||||
border-radius: 4px;
|
||||
border: solid 1px #c7c7c7;
|
||||
outline: none;
|
||||
font-size: 18px;
|
||||
color: #666;
|
||||
}
|
||||
span {
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
line-height: 32px;
|
||||
width: 96px;
|
||||
height: 32px;
|
||||
background-image: linear-gradient(
|
||||
69deg,
|
||||
#cc263f 0%,
|
||||
#f42b47 100%,
|
||||
#ed162d 100%,
|
||||
#e60012 100%
|
||||
),
|
||||
linear-gradient(#e60012, #e60012);
|
||||
background-blend-mode: normal, normal;
|
||||
border-radius: 4px;
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
|
||||
.table {
|
||||
width: 1137px;
|
||||
height: 181px;
|
||||
border: solid 1px #dadada;
|
||||
background-color: #f6f6f6;
|
||||
box-sizing: border-box;
|
||||
|
||||
.top-b {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
div {
|
||||
width: 283px;
|
||||
height: 139px;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
section {
|
||||
width: 72px;
|
||||
height: 67px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
span:first-child {
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 18px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
span:last-child {
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 24px;
|
||||
font-weight: bold;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #e60012;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.top-p {
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 18px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #333333;
|
||||
width: 1136px;
|
||||
height: 40px;
|
||||
background-color: #f6f6f6;
|
||||
text-align: center;
|
||||
line-height: 40px;
|
||||
border-bottom: 1px solid #dadada;
|
||||
border-right: 1px solid #dadada;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.top {
|
||||
width: 732px;
|
||||
height: 40px;
|
||||
margin: 30px 0 30px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
img {
|
||||
width: 33px;
|
||||
height: 27px;
|
||||
}
|
||||
div {
|
||||
width: 672px;
|
||||
height: 21px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
span {
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 20px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
time {
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 20px;
|
||||
font-weight: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,595 +0,0 @@
|
||||
<template>
|
||||
<div class="wrapper">
|
||||
<header-nav :index_num="index_num"></header-nav>
|
||||
<div id="box">
|
||||
<!-- 导航 -->
|
||||
<div class="top">
|
||||
<div class="span">
|
||||
<span @click="btn(0)"
|
||||
:class="sub == 0 ? 'style' : ''">项目进度</span>
|
||||
<span @click="btn(1)"
|
||||
:class="sub == 1 ? 'style' : ''">项目信息</span>
|
||||
</div>
|
||||
<div class="daochu"
|
||||
v-if="sub == 1">项目导出</div>
|
||||
</div>
|
||||
<!-- 进度 -->
|
||||
<div class="img"
|
||||
v-if="sub == 0">
|
||||
<img :src="imgUrl.tg"
|
||||
v-if="state == 0" />
|
||||
<img :src="imgUrl.btg"
|
||||
v-if="state == 1" />
|
||||
<img :src="imgUrl.shz"
|
||||
v-if="state == 2" />
|
||||
<img :src="imgUrl.zxz"
|
||||
v-if="state == 3" />
|
||||
</div>
|
||||
<!-- 项目流程 -->
|
||||
<div class="bobb"
|
||||
v-if="sub == 0">
|
||||
<div class="left">
|
||||
<div class="time">
|
||||
<span>2019-09-01</span>
|
||||
<span>2019-09-01</span>
|
||||
<span>2019-09-01</span>
|
||||
<span>2019-09-01</span>
|
||||
<span>2019-09-01</span>
|
||||
</div>
|
||||
<div class="jdt">
|
||||
<!-- 已申报 -->
|
||||
<img class="sx0"
|
||||
:src="imgUrl.sx0"
|
||||
alt />
|
||||
<img class="d0"
|
||||
:src="imgUrl.d0"
|
||||
v-if="zt != 0" />
|
||||
<img class="d1"
|
||||
:src="imgUrl.d1"
|
||||
v-if="zt == 0" />
|
||||
<!-- 审核中 -->
|
||||
<img class="sx1"
|
||||
:src="imgUrl.sx1"
|
||||
alt />
|
||||
<img class="d0"
|
||||
:src="imgUrl.d0"
|
||||
v-if="zt != 1" />
|
||||
<img class="d1"
|
||||
:src="imgUrl.d1"
|
||||
v-if="zt == 1" />
|
||||
<!-- 审核通过 -->
|
||||
<img class="sx1"
|
||||
:src="imgUrl.sx1"
|
||||
alt />
|
||||
<img class="d0"
|
||||
:src="imgUrl.d0"
|
||||
v-if="zt != 2" />
|
||||
<img class="d1"
|
||||
:src="imgUrl.d1"
|
||||
v-if="zt == 2" />
|
||||
<!-- 评审中 -->
|
||||
<img class="sx1"
|
||||
:src="imgUrl.sx1"
|
||||
alt />
|
||||
<img class="d0"
|
||||
:src="imgUrl.d0"
|
||||
v-if="zt != 3" />
|
||||
<img class="d1"
|
||||
:src="imgUrl.d1"
|
||||
v-if="zt == 3" />
|
||||
<!-- 评审通过 -->
|
||||
<img class="sx1"
|
||||
:src="imgUrl.sx1"
|
||||
alt />
|
||||
<img class="d0"
|
||||
:src="imgUrl.d0"
|
||||
v-if="zt != 4" />
|
||||
<img class="d1"
|
||||
:src="imgUrl.d1"
|
||||
v-if="zt == 4" />
|
||||
<!-- end -->
|
||||
<img class="sx1"
|
||||
:src="imgUrl.sx1"
|
||||
alt />
|
||||
</div>
|
||||
<div class="bb">
|
||||
<div class="o">
|
||||
<span>项目已申报</span>
|
||||
<img class="oo"
|
||||
:src="imgUrl.d0"
|
||||
alt />
|
||||
</div>
|
||||
<div>
|
||||
<span>初筛审核中</span>
|
||||
<img class="oo"
|
||||
:src="imgUrl.d0"
|
||||
alt />
|
||||
</div>
|
||||
<div class="div-v">
|
||||
<span>初筛审核通过</span>
|
||||
<img class="oo"
|
||||
:src="imgUrl.d0"
|
||||
alt />
|
||||
<section>
|
||||
<span style="color:#e60012;font-size:20px;">总分: 71分</span>
|
||||
<span style="color:#999;font-size:16px;">（及格分数: 70）</span>
|
||||
</section>
|
||||
</div>
|
||||
<div>
|
||||
<span>立项评审中</span>
|
||||
<img class="oo"
|
||||
:src="imgUrl.d0"
|
||||
alt />
|
||||
</div>
|
||||
<div>
|
||||
<span>立项评审通过</span>
|
||||
<img class="oo"
|
||||
:src="imgUrl.d0"
|
||||
alt />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<p>项目流程说明</p>
|
||||
<ul>
|
||||
<li v-for="(list,index) in text"
|
||||
:key="index">{{list}}</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 项目信息 -->
|
||||
<div class="boxx"
|
||||
v-if="sub == 1">
|
||||
<h3>一、基本信息</h3>
|
||||
<div class="one-o">
|
||||
<ul v-for="(item,index) in arr"
|
||||
:key="index">
|
||||
<template v-for="(item,index) in text1">
|
||||
<li :key="index">{{item}}</li>
|
||||
</template>
|
||||
</ul>
|
||||
</div>
|
||||
<h3>二、申报单位简介:</h3>
|
||||
<div class="one-e">
|
||||
<p>我国仍处于井将长期处于社会主义初级阶段,是最大的国情和实际。“我们开展各项工作,要一切从实际出发,牢牢立足这个最大国情和实际,不要超越阶段。从能源来看,我国當富煤少油缺气?的资源禀赋,决定了煤炭在较长一个时期内作为我国主体能源的地位不会发玍变化,这就婓求我们坚持从煤炭资源丰富的囯情出发,切实抓好煤炭清洁高效利用。”章建华</p>
|
||||
</div>
|
||||
<h3>三、项目简介</h3>
|
||||
<div class="one-e">
|
||||
<p>我国仍处于井将长期处于社会主义初级阶段,是最大的国情和实际。“我们开展各项工作,要一切从实际出发,牢牢立足这个最大国情和实际,不要超越阶段。从能源来看,我国當富煤少油缺气?的资源禀赋,决定了煤炭在较长一个时期内作为我国主体能源的地位不会发玍变化,这就婓求我们坚持从煤炭资源丰富的囯情出发,切实抓好煤炭清洁高效利用。”章建华</p>
|
||||
</div>
|
||||
<h3>四、项目论证</h3>
|
||||
<div class="one-e">
|
||||
<p>我国仍处于井将长期处于社会主义初级阶段,是最大的国情和实际。“我们开展各项工作,要一切从实际出发,牢牢立足这个最大国情和实际,不要超越阶段。从能源来看,我国當富煤少油缺气?的资源禀赋,决定了煤炭在较长一个时期内作为我国主体能源的地位不会发玍变化,这就婓求我们坚持从煤炭资源丰富的囯情出发,切实抓好煤炭清洁高效利用。”章建华</p>
|
||||
</div>
|
||||
<h3>五、经费预算:</h3>
|
||||
<div class="one-e">
|
||||
<p>我国仍处于井将长期处于社会主义初级阶段,是最大的国情和实际。“我们开展各项工作,要一切从实际出发,牢牢立足这个最大国情和实际,不要超越阶段。从能源来看,我国當富煤少油缺气?的资源禀赋,决定了煤炭在较长一个时期内作为我国主体能源的地位不会发玍变化,这就婓求我们坚持从煤炭资源丰富的囯情出发,切实抓好煤炭清洁高效利用。”章建华</p>
|
||||
</div>
|
||||
<h3>六、申报单位承诺:</h3>
|
||||
<div class="one-e">
|
||||
<p>我们确认项目中报内容的真实性,并愿意承担相应的责任</p>
|
||||
</div>
|
||||
<h3>七、项目主责单位意见 :</h3>
|
||||
<div class="one-e">
|
||||
<p>
|
||||
<span>
|
||||
<span>下载</span>
|
||||
|
|
||||
<span>预览</span>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<footer-nav class="footer"></footer-nav>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable */
|
||||
import HeaderNav from "../../components/HeaderNav";
|
||||
/* eslint-disable */
|
||||
import FooterNav from "../../components/FooterNav";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
HeaderNav,
|
||||
FooterNav
|
||||
},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
index_num: 2,
|
||||
sub: 0,
|
||||
imgUrl: {
|
||||
tg: require("../../../static/img/tg.png"),
|
||||
btg: require("../../../static/img/btg.png"),
|
||||
shz: require("../../../static/img/shz.png"),
|
||||
zxz: require("../../../static/img/zxz.png"),
|
||||
sx0: require("../../../static/img/sx0.png"),
|
||||
sx1: require("../../../static/img/sx1.png"),
|
||||
d0: require("../../../static/img/d0.png"),
|
||||
d1: require("../../../static/img/d1.png")
|
||||
},
|
||||
state: 0,
|
||||
zt: 2,
|
||||
arr: [1, 2, 3],
|
||||
text: [
|
||||
"第一步：填写并提交项目申报书",
|
||||
"第二步：线上初筛审核",
|
||||
"第三步：项目初筛结果查询",
|
||||
"第四步：线下立项评审",
|
||||
"第五步：立项结果查询"
|
||||
],
|
||||
text1: [
|
||||
"项目名称：世界婚会",
|
||||
"项目申报单位：劳动社会组织",
|
||||
"项目类型：活动",
|
||||
"项目落地区域：北区",
|
||||
"一级项目方向：婚礼",
|
||||
"一级项目方向：婚礼",
|
||||
"项目服务领域：北区",
|
||||
"项目有效期：2019-09-02至2019-09-23",
|
||||
"申报单位属性：国企",
|
||||
"通讯地址：北京市海涟区",
|
||||
"电子信箱：15901401996@qq.com",
|
||||
"传真电话：81223221",
|
||||
"邮政编码：100000"
|
||||
]
|
||||
};
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
methods: {
|
||||
btn(index) {
|
||||
let s = this.sub;
|
||||
s = index;
|
||||
this.sub = s;
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
mounted() {}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang='scss' scoped>
|
||||
.wrapper {
|
||||
width: 1280px;
|
||||
box-sizing: border-box;
|
||||
|
||||
#box {
|
||||
margin: 40px auto 0;
|
||||
width: 1200px;
|
||||
background-color: #ffffff;
|
||||
padding: 35px 30px 100px;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
|
||||
.boxx {
|
||||
margin-top: 68px;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
|
||||
.one-e {
|
||||
width: 100%;
|
||||
margin-top: 27px;
|
||||
margin-bottom: 60px;
|
||||
|
||||
p {
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 18px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
line-height: 39px;
|
||||
letter-spacing: 0px;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
span {
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 18px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
line-height: 39px;
|
||||
letter-spacing: 0px;
|
||||
color: #7471ef;
|
||||
}
|
||||
}
|
||||
|
||||
.one-o {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-top: 30px;
|
||||
margin-bottom: 60px;
|
||||
|
||||
ul {
|
||||
width: 350px;
|
||||
height: 674px;
|
||||
box-shadow: 0px 4px 18px 0px rgba(0, 0, 0, 0.15);
|
||||
border-radius: 5px;
|
||||
padding: 30px 0 0 20px;
|
||||
box-sizing: border-box;
|
||||
|
||||
li {
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 18px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
margin-bottom: 28px;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
h3 {
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 20px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.bobb {
|
||||
margin-top: 110px;
|
||||
width: 100%;
|
||||
height: 974px;
|
||||
padding: 0 40px 0 11px;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.left {
|
||||
width: 419px;
|
||||
height: 974px;
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
align-items: flex-start;
|
||||
|
||||
.time {
|
||||
width: 120px;
|
||||
height: 734px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-direction: column;
|
||||
align-items: flex-end;
|
||||
margin-top: 72px;
|
||||
|
||||
.span {
|
||||
display: inline-block;
|
||||
width: 119px;
|
||||
height: 18px;
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 22px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.jdt {
|
||||
width: 32px;
|
||||
height: 974px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.sx0 {
|
||||
width: 3px;
|
||||
height: 79px;
|
||||
}
|
||||
|
||||
.sx1 {
|
||||
width: 3px;
|
||||
height: 153px;
|
||||
}
|
||||
|
||||
.wzx {
|
||||
width: 20px;
|
||||
height: 21px;
|
||||
}
|
||||
|
||||
.zx {
|
||||
width: 20px;
|
||||
height: 21px;
|
||||
}
|
||||
}
|
||||
|
||||
.bb {
|
||||
margin-top: 70px;
|
||||
width: 180px;
|
||||
height: 750px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
|
||||
.o {
|
||||
padding-left: 5px;
|
||||
box-sizing: border-box;
|
||||
width: 170px;
|
||||
height: 36px;
|
||||
position: relative;
|
||||
border-bottom: 2px solid #b0c3cd;
|
||||
|
||||
img {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
position: absolute;
|
||||
right: 0%;
|
||||
bottom: -16%;
|
||||
}
|
||||
}
|
||||
|
||||
div {
|
||||
padding-left: 5px;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
height: 36px;
|
||||
position: relative;
|
||||
border-bottom: 2px solid #b0c3cd;
|
||||
|
||||
img {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
position: absolute;
|
||||
right: 0%;
|
||||
bottom: -16%;
|
||||
}
|
||||
|
||||
section {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
width: 132%;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
font-family: "MicrosoftYaHei";
|
||||
position: absolute;
|
||||
left: -8%;
|
||||
bottom: -100%;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
span {
|
||||
display: inline-block;
|
||||
width: 135px;
|
||||
height: 22px;
|
||||
text-align: center;
|
||||
line-height: 22px;
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 22px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
padding: 35px 30px;
|
||||
box-sizing: border-box;
|
||||
width: 535px;
|
||||
height: 698px;
|
||||
box-shadow: 0px 4px 18px 0px rgba(0, 0, 0, 0.15);
|
||||
border-radius: 10px;
|
||||
|
||||
ul {
|
||||
margin-top: 48px;
|
||||
|
||||
li {
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 18px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
line-height: 48px;
|
||||
letter-spacing: 0px;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 24px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
line-height: 31px;
|
||||
letter-spacing: 0px;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.img {
|
||||
width: 119px;
|
||||
height: 95px;
|
||||
position: absolute;
|
||||
right: 0%;
|
||||
top: 1%;
|
||||
img {
|
||||
width: 119px;
|
||||
height: 95px;
|
||||
}
|
||||
}
|
||||
|
||||
.top {
|
||||
width: 1140px;
|
||||
height: 38px;
|
||||
border-bottom: 1px solid #ccc;
|
||||
padding-left: 12px;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.daochu {
|
||||
width: 96px;
|
||||
height: 32px;
|
||||
background-image: linear-gradient(
|
||||
69deg,
|
||||
#cc263f 0%,
|
||||
#f42b47 100%,
|
||||
#ed162d 100%,
|
||||
#e60012 100%
|
||||
),
|
||||
linear-gradient(#e60012, #e60012);
|
||||
background-blend-mode: normal, normal;
|
||||
border-radius: 4px;
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
line-height: 32px;
|
||||
text-align: center;
|
||||
letter-spacing: 0px;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.span {
|
||||
span {
|
||||
margin-right: 40px;
|
||||
display: inline-block;
|
||||
width: 120px;
|
||||
height: 38px;
|
||||
text-align: center;
|
||||
font-family: "MicrosoftYaHei";
|
||||
font-size: 20px;
|
||||
font-weight: normal;
|
||||
font-stretch: normal;
|
||||
letter-spacing: 0px;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.style {
|
||||
color: #e60012;
|
||||
position: relative;
|
||||
&::after {
|
||||
content: "";
|
||||
width: 120px;
|
||||
height: 2px;
|
||||
background-color: #e60012;
|
||||
position: absolute;
|
||||
bottom: 0%;
|
||||
left: 0%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.footer {
|
||||
margin-top: 80px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user