869 lines
23 KiB
Vue
869 lines
23 KiB
Vue
<template>
|
||
<div class="wrapper">
|
||
<header-nav :index_num="index_num"></header-nav>
|
||
<div id="box">
|
||
<!-- 公告 -->
|
||
<div class="top">
|
||
<img :src="imgUrl.xlb" alt />
|
||
<div class="div-v" v-if="cd !== 0">
|
||
<!-- <aside class="animation" v-for="(list,index) in bgValue.announcement" :key="index">
|
||
<span>{{list.name + list.pro_content}}</span>
|
||
<time>{{list.protime}}</time>
|
||
</aside>-->
|
||
<span>{{
|
||
bgValue.announcement[0].name + bgValue.announcement[0].pro_content
|
||
}}</span>
|
||
<time>{{ bgValue.announcement[0].protime }}</time>
|
||
</div>
|
||
<div v-else>
|
||
<span>暂无项目申报内容</span>
|
||
<time>{{
|
||
new Date().getFullYear() +
|
||
"-" +
|
||
(new Date().getMonth() + 1) +
|
||
"-" +
|
||
new Date().getDate()
|
||
}}</time>
|
||
</div>
|
||
</div>
|
||
<div class="bottom">
|
||
<!-- 表格 -->
|
||
<div class="table">
|
||
<div class="top-p">项目概览</div>
|
||
<div class="top-b">
|
||
<div>
|
||
<section>
|
||
<span>初筛通过</span>
|
||
<span>{{ bgValue.overview_one }}</span>
|
||
</section>
|
||
</div>
|
||
<div>
|
||
<section>
|
||
<span>立项通过</span>
|
||
<span>{{ bgValue.overview_two }}</span>
|
||
</section>
|
||
</div>
|
||
<div>
|
||
<section>
|
||
<span>执行中</span>
|
||
<span>{{ bgValue.overview_three }}</span>
|
||
</section>
|
||
</div>
|
||
<div>
|
||
<section>
|
||
<span>已完结</span>
|
||
<span>{{ bgValue.overview_four }}</span>
|
||
</section>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- 下拉框 -->
|
||
<div class="select">
|
||
<div class="block">
|
||
<el-date-picker
|
||
v-model="value_date"
|
||
type="daterange"
|
||
value-format="yyyy-MM-dd"
|
||
format="yyyy-MM-dd"
|
||
range-separator="至"
|
||
start-placeholder="开始日期"
|
||
end-placeholder="结束日期"
|
||
@change="bolting()"
|
||
></el-date-picker>
|
||
</div>
|
||
<select
|
||
class="two"
|
||
v-model="type_value"
|
||
name="type"
|
||
@change="bolting()"
|
||
>
|
||
<option>项目类型</option>
|
||
<template v-for="(type, index) in bgValue.type">
|
||
<option :key="index" :value="index">{{ type }}</option>
|
||
</template>
|
||
</select>
|
||
<select
|
||
class="two"
|
||
v-model="status_value"
|
||
name="status"
|
||
@change="bolting()"
|
||
>
|
||
<option>项目状态</option>
|
||
<template v-for="(status, index) in bgValue.status">
|
||
<option :key="index" :value="index">{{ status }}</option>
|
||
</template>
|
||
</select>
|
||
<select
|
||
class="three"
|
||
v-model="area_value"
|
||
name="area"
|
||
@change="bolting()"
|
||
>
|
||
<option>落地区域</option>
|
||
<template v-for="(area, index) in bgValue.area">
|
||
<option :key="index" :value="index">{{ area }}</option>
|
||
</template>
|
||
</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-if="cd > 0">
|
||
<div
|
||
class="list"
|
||
v-for="(item, index) in bgData.info"
|
||
:key="index"
|
||
@click="
|
||
item.tid == 1000
|
||
? $jP('application', { id: item.id })
|
||
: $jParams('schedule', { id: item.id })
|
||
"
|
||
>
|
||
<div class="div">
|
||
<div class="bb">
|
||
<h3>{{ item.name }}</h3>
|
||
<h5>活动</h5>
|
||
</div>
|
||
<time>{{ item.protime }}</time>
|
||
</div>
|
||
<dl>
|
||
<dt>
|
||
<img :src="imgUrl.tg" v-if="item.tid == 5" />
|
||
<img
|
||
:src="imgUrl.btg"
|
||
v-else-if="item.tid == 4 || item.tid == 9"
|
||
/>
|
||
<img :src="imgUrl.zxz" v-else-if="item.tid == 10" />
|
||
<img :src="imgUrl.wtj" v-else-if="item.tid == 1000" />
|
||
<img :src="imgUrl.shz" v-else />
|
||
</dt>
|
||
<dd>
|
||
<span class="iconfont icon-zuzhijiegou"></span>
|
||
<span>{{ item.party_id }}</span>
|
||
</dd>
|
||
<dd>
|
||
<span class="iconfont icon-weizhi"></span>
|
||
<span>{{ item.postaladdress }}</span>
|
||
</dd>
|
||
<dd>
|
||
<span class="iconfont icon-shenhetongguo1"></span>
|
||
<span class="block-k">
|
||
<b>项目状态：</b>
|
||
{{ item.status }}
|
||
</span>
|
||
</dd>
|
||
</dl>
|
||
</div>
|
||
</template>
|
||
<template v-else>
|
||
<span>您搜索的内容暂无！</span>
|
||
</template>
|
||
</div>
|
||
</div>
|
||
<!-- 分页按钮 -->
|
||
<div class="page">
|
||
<el-pagination
|
||
@size-change="handleSizeChange"
|
||
@current-change="handleCurrentChange"
|
||
:current-page="currentPage"
|
||
:page-size="pageSize"
|
||
:pager-count="5"
|
||
background
|
||
layout="prev, pager, next"
|
||
:total="totalCount"
|
||
></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"),
|
||
wtj: require("../../../static/img/wtj.png")
|
||
},
|
||
// text: ["全部", "项目初筛", "项目立项"],
|
||
text: ["全部"],
|
||
sub: 0,
|
||
bgData: [],
|
||
bgValue: [],
|
||
type_value: "项目类型",
|
||
status_value: "项目状态",
|
||
area_value: "落地区域",
|
||
value_date: "",
|
||
start_time: "",
|
||
end_time: "",
|
||
cd: Number
|
||
};
|
||
},
|
||
computed: {},
|
||
watch: {},
|
||
methods: {
|
||
/** 筛选函数 */
|
||
bolting() {
|
||
this.start_time = this.value_date[0];4
|
||
this.end_time = this.value_date[1]
|
||
this.getDataTwo(
|
||
this.start_time,
|
||
this.end_time,
|
||
this.type_value,
|
||
this.status_value,
|
||
this.area_value
|
||
);
|
||
},
|
||
/** 获取项目列表 */
|
||
getDataTwo(
|
||
start_time = this.start_time,
|
||
end_time = this.end_time,
|
||
type = this.type_value,
|
||
status = this.status_value,
|
||
area = this.area_value
|
||
) {
|
||
if (type === "项目类型") {
|
||
this.type_value = "";
|
||
type = "";
|
||
}
|
||
if (status === "项目状态") {
|
||
this.status_value = "";
|
||
status = "";
|
||
}
|
||
if (area === "落地区域") {
|
||
this.area_value = "";
|
||
area = "";
|
||
}
|
||
|
||
let _this = this;
|
||
this.$http({
|
||
method: "get",
|
||
url: "v1/project/list",
|
||
params: {
|
||
start_time: start_time,
|
||
end_time: end_time,
|
||
type: type,
|
||
area: area,
|
||
status: status,
|
||
page: _this.currentPage,
|
||
num: 6
|
||
}
|
||
})
|
||
.then(res => {
|
||
if (res.data.code === 200) {
|
||
_this.bgData = res.data.data.data;
|
||
_this.totalCount = _this.bgData.allPage;
|
||
_this.cd = _this.bgData.info.length;
|
||
} else {
|
||
_this.$message.error("请求数据有问题！");
|
||
}
|
||
})
|
||
// eslint-disable-next-line handle-callback-err
|
||
.catch(err => {
|
||
console.log(err);
|
||
});
|
||
|
||
if (this.type_value === "") {
|
||
this.type_value = "项目类型";
|
||
}
|
||
if (this.status_value === "") {
|
||
this.status_value = "项目状态";
|
||
}
|
||
if (this.area_value === "") {
|
||
this.area_value = "落地区域";
|
||
}
|
||
},
|
||
/** 获取下拉框数据 */
|
||
getDataOne() {
|
||
let _this = this;
|
||
this.$http({
|
||
method: "get",
|
||
url: "v1/project/get-info",
|
||
data: {}
|
||
})
|
||
.then(res => {
|
||
if (res.data.code === 200) {
|
||
_this.bgValue = res.data.data;
|
||
_this.cd = _this.bgValue.announcement.length;
|
||
} else {
|
||
_this.$message.error("请求数据有问题！");
|
||
}
|
||
})
|
||
// eslint-disable-next-line handle-callback-err
|
||
.catch(err => {
|
||
console.log(err);
|
||
});
|
||
},
|
||
btn(index) {
|
||
let s = this.sub;
|
||
s = index;
|
||
this.sub = s;
|
||
},
|
||
handleSizeChange(val) {
|
||
this.pageSize = val;
|
||
this.getPackData();
|
||
},
|
||
handleCurrentChange(val) {
|
||
this.currentPage = val;
|
||
this.getDataTwo();
|
||
this.getPackData();
|
||
},
|
||
getPackData() {}
|
||
},
|
||
created() {
|
||
this.currentPage = Number(localStorage.getItem("page")) || 1;
|
||
this.handleCurrentChange(this.currentPage);
|
||
this.getDataOne();
|
||
},
|
||
mounted() {},
|
||
beforeUpdate() {
|
||
localStorage.setItem("page", this.currentPage);
|
||
},
|
||
beforeDestroy() {
|
||
localStorage.setItem("page", 1);
|
||
},
|
||
destroyed() {
|
||
localStorage.removeItem("page");
|
||
}
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.wrapper {
|
||
min-width: 1280px;
|
||
box-sizing: border-box;
|
||
|
||
.footer {
|
||
margin-top: 80px;
|
||
}
|
||
|
||
#box {
|
||
margin: 0 auto;
|
||
width: 1200px;
|
||
box-sizing: border-box;
|
||
|
||
.bottom {
|
||
padding: 35px 30px 100px;
|
||
box-sizing: border-box;
|
||
width: 1200px;
|
||
// height: 1320px;
|
||
|
||
box-sizing: border-box;
|
||
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::after {
|
||
content: "";
|
||
width: 367px;
|
||
display: block;
|
||
height: 0px;
|
||
}
|
||
|
||
.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;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: space-between;
|
||
|
||
dd {
|
||
height: 20px;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.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;
|
||
}
|
||
|
||
.block-k {
|
||
width: 288px;
|
||
display: inline-block;
|
||
/* overflow: hidden;*/
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
|
||
b {
|
||
font-weight: 900;
|
||
}
|
||
}
|
||
}
|
||
|
||
dt {
|
||
img {
|
||
position: absolute;
|
||
right: -8.5%;
|
||
bottom: -26%;
|
||
width: 120px;
|
||
height: 90px;
|
||
}
|
||
}
|
||
}
|
||
|
||
.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;
|
||
|
||
.block {
|
||
/deep/.el-range-editor.el-input__inner {
|
||
width: 325px;
|
||
background: url("../../../static/img/xa.png") 90% center no-repeat;
|
||
background-color: #f9f8f8;
|
||
}
|
||
|
||
/deep/.el-date-editor .el-range-input {
|
||
background-color: #f9f8f8;
|
||
font-family: "MicrosoftYaHei";
|
||
font-size: 18px;
|
||
font-weight: normal;
|
||
font-stretch: normal;
|
||
line-height: 33px;
|
||
letter-spacing: 0px;
|
||
color: #666666;
|
||
}
|
||
|
||
/deep/.el-input__inner {
|
||
border: 1px solid #c7c7c7;
|
||
}
|
||
|
||
/deep/.el-date-editor .el-range-separator {
|
||
font-family: "MicrosoftYaHei";
|
||
font-size: 18px;
|
||
font-weight: normal;
|
||
font-stretch: normal;
|
||
line-height: 33px;
|
||
letter-spacing: 0px;
|
||
color: #666666;
|
||
}
|
||
|
||
/deep/ .el-input__icon {
|
||
width: 0px;
|
||
}
|
||
}
|
||
|
||
.one {
|
||
// padding-left: 30px;
|
||
box-sizing: border-box;
|
||
/* 清除默认的箭头样式 */
|
||
appearance: none;
|
||
-moz-appearance: none;
|
||
-webkit-appearance: none;
|
||
/* 右侧添加小箭头的背景图 */
|
||
background: url("../../../static/img/xa.png") 90% center no-repeat;
|
||
background-size: 14px 8px;
|
||
// width: 325px;
|
||
padding: 0px 30px;
|
||
height: 38px;
|
||
background-color: #f9f8f8;
|
||
border-radius: 4px;
|
||
border: solid 1px #c7c7c7;
|
||
outline: none;
|
||
font-size: 18px;
|
||
color: #666;
|
||
}
|
||
|
||
.two {
|
||
// padding-left: 30px;
|
||
// padding-right: 48px;
|
||
box-sizing: border-box;
|
||
/* 清除默认的箭头样式 */
|
||
appearance: none;
|
||
-moz-appearance: none;
|
||
-webkit-appearance: none;
|
||
/* 右侧添加小箭头的背景图 */
|
||
background: url("../../../static/img/xa.png") 90% center no-repeat;
|
||
background-size: 14px 8px;
|
||
// width: 134px;
|
||
padding: 0px 30px;
|
||
height: 38px;
|
||
background-color: #f9f8f8;
|
||
border-radius: 4px;
|
||
border: solid 1px #c7c7c7;
|
||
outline: none;
|
||
font-size: 18px;
|
||
color: #666;
|
||
text-align: center;
|
||
}
|
||
|
||
.three {
|
||
// padding-left: 30px;
|
||
/* 清除默认的箭头样式 */
|
||
appearance: none;
|
||
-moz-appearance: none;
|
||
-webkit-appearance: none;
|
||
/* 右侧添加小箭头的背景图 */
|
||
background: url("../../../static/img/xa.png") 90% center no-repeat;
|
||
background-size: 14px 8px;
|
||
// width: 134px;
|
||
padding: 0 35px 0 30px;
|
||
box-sizing: border-box;
|
||
height: 38px;
|
||
background-color: #f9f8f8;
|
||
border-radius: 4px;
|
||
border: solid 1px #c7c7c7;
|
||
outline: none;
|
||
font-size: 18px;
|
||
color: #666;
|
||
text-align: center;
|
||
}
|
||
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;
|
||
|
||
/*
|
||
|
||
.div-v {
|
||
width: 100%;
|
||
height: 100%;
|
||
overflow: hidden;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: flex-start;
|
||
align-items: flex-start;
|
||
}
|
||
|
||
.animation {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
animation: myMove 15s linear infinite;
|
||
animation-fill-mode: forwards;
|
||
width: 95%;
|
||
height: 100%;
|
||
margin-bottom: 25px;
|
||
margin-left: 25px;
|
||
}
|
||
*/
|
||
|
||
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;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
/*文字无缝滚动*/
|
||
@keyframes myMove {
|
||
0% {
|
||
transform: translateY(0);
|
||
}
|
||
100% {
|
||
transform: translateY(-150px);
|
||
}
|
||
}
|
||
</style>
|