Commit 2e706508 authored by 吴冠's avatar 吴冠

信息公告

parent cb2bc4eb
...@@ -35,7 +35,7 @@ html { ...@@ -35,7 +35,7 @@ html {
*, *,
*::before, *::before,
*::after { *::after {
box-sizing: border-box; box-sizing: none;
margin: 0; margin: 0;
} }
......
<template> <template>
<div> <div>
<div class="message"> <div class="flex">
<div class="sidebar"> <div class="sidebar">
<div class="sidebar-title">信息公告</div> <div class="sidebar-title">信息公告</div>
<el-col :span="12"> <el-col :span="12">
<el-menu <el-menu
:default-active="activeName" :default-active="activeName"
class="el-menu-vertical-demo" class="el-menu-vertical-demo"
@select="handleSelect" @select="handleSelect"
>
<el-menu-item
:index="item.id + ''"
v-for="item in artList"
:key="item.id"
router
> >
<i class="el-icon-menu"></i> <el-menu-item
<span slot="title">{{ item.title }}</span> :index="item.id + ''"
</el-menu-item> v-for="item in artList"
</el-menu> :key="item.id"
</el-col> router
</div> >
<ul> <i class="el-icon-menu"></i>
<li <span slot="title">{{ item.title }}</span>
v-for="item in messageList" </el-menu-item>
:key="item.id" </el-menu>
@click="isClick(item.id)" </el-col>
v-show="isList" </div>
> <div class="message">
<!-- <nuxt-link :to="{name:'index-message-newsdetails',query:{id:(item.id)}}" class="flex-between link-style" >--> <ul>
<div class="flex-between link-style"> <li
<div class="t2">{{ item.title }}</div> v-for="item in messageList"
<div class="t1">发布时间:{{ item.createTime }}</div> :key="item.id"
@click="isClick(item.id)"
v-show="isList"
>
<!-- <nuxt-link :to="{name:'index-message-newsdetails',query:{id:(item.id)}}" class="flex-between link-style" >-->
<div class="flex-between link-style">
<div class="t2">{{ item.title }}</div>
<div class="t1">发布时间:{{ item.createTime }}</div>
</div>
<!-- </nuxt-link> -->
</li>
</ul>
<div class="content" v-show="!isList">
<div>
<h1>{{ detailList.title }}</h1>
<div class="flex-center pos">
<span style="margin-right: 20px"
>发布时间:{{ detailList.createTime }}</span
>
<span>作者:{{ detailList.author }}</span>
</div>
<div
v-html="detailList.content"
style="width: 600px; margin: 0 auto"
></div>
<div class="flex-center" style="margin-buttom: 40px">
<el-button
type="primary"
@click="returnPrev"
style="margin-top: 50px"
>返回</el-button
>
</div>
</div> </div>
<!-- </nuxt-link> --> </div>
</li> </div>
<div class="pagination" v-show="isList"> </div>
<!-- 分页 -->
<div class="pagination" v-show="isList">
<el-pagination <el-pagination
@size-change="handleSizeChange" @size-change="handleSizeChange"
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
...@@ -46,32 +74,7 @@ ...@@ -46,32 +74,7 @@
:total="total" :total="total"
> >
</el-pagination> </el-pagination>
</div>
</ul>
<div class="content" v-show="!isList">
<div>
<h1>{{ detailList.title }}</h1>
<div class="flex-center pos">
<span style="margin-right: 20px"
>发布时间:{{ detailList.createTime }}</span
>
<span>作者:{{ detailList.author }}</span>
</div>
<div
v-html="detailList.content"
style="width: 600px; margin: 0 auto"
></div>
<div class="flex-center" style="margin-buttom: 40px">
<el-button
type="primary"
@click="returnPrev"
style="margin-top: 50px"
>返回</el-button
>
</div>
</div>
</div> </div>
</div>
</div> </div>
</template> </template>
<script> <script>
...@@ -215,16 +218,15 @@ export default { ...@@ -215,16 +218,15 @@ export default {
<style scoped> <style scoped>
.pagination { .pagination {
flex:0 ;
position: absolute; position: absolute;
bottom: 5%; margin-top: 20px;
left: 50%; left: 56%;
transform: translateX(-50%); transform: translateX(-50%);
} }
.message { .message {
border: 1px solid rgba(219, 219, 219, 1); border: 1px solid rgba(219, 219, 219, 1);
min-height: 6.98rem; min-height: 6.8rem;
position: absolute;
left:33%;
width: 9.2rem; width: 9.2rem;
} }
...@@ -246,10 +248,9 @@ export default { ...@@ -246,10 +248,9 @@ export default {
} }
.sidebar { .sidebar {
width: 2.4rem; width: 2.4rem;
margin-right: .3rem;
border: 1px solid rgba(219, 219, 219, 1); border: 1px solid rgba(219, 219, 219, 1);
position: absolute; }
left: -30%
}
.sidebar > .sidebar-title { .sidebar > .sidebar-title {
width: 2.4rem; width: 2.4rem;
height: 0.6rem; height: 0.6rem;
...@@ -259,16 +260,17 @@ export default { ...@@ -259,16 +260,17 @@ export default {
font-size: 0.2rem; font-size: 0.2rem;
color: rgba(0, 0, 0, 1); color: rgba(0, 0, 0, 1);
font-weight: bold; font-weight: bold;
/* box-sizing: none; */
} }
.el-menu-vertical-demo { .el-menu-vertical-demo {
width: 2.4rem; width: 2.4rem;
/* box-sizing:none */
} }
.el-col-12 { .el-col-12 {
width: 100%; width: 100%;
} }
.content { .content {
width: 9.2rem; width: 9.2rem;
height: 100%;
} }
h1 { h1 {
display: flex; display: flex;
......
...@@ -286,7 +286,6 @@ import Cookies from 'js-cookie' ...@@ -286,7 +286,6 @@ import Cookies from 'js-cookie'
} }
.pagination{ .pagination{
position: absolute; position: absolute;
/* bottom: -2%; */
left: 50%; left: 50%;
transform:translateX(-50%); transform:translateX(-50%);
margin-top:20px margin-top:20px
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment