Commit 52db3adb by 莫晓莉

文件管理系统

parent c9eb58c7

254 Bytes | W: | H:

429 Bytes | W: | H:

src/assets/home/btns/17.png
src/assets/table/name.png
src/assets/home/btns/17.png
src/assets/table/name.png
  • 2-up
  • Swipe
  • Onion skin

402 Bytes | W: | H:

463 Bytes | W: | H:

src/assets/home/btns/15.png
src/assets/table/xiazai.png
src/assets/home/btns/15.png
src/assets/table/xiazai.png
  • 2-up
  • Swipe
  • Onion skin
...@@ -13,67 +13,72 @@ Vue.prototype.push = function push(location) { ...@@ -13,67 +13,72 @@ Vue.prototype.push = function push(location) {
const constantRouterMap = [ const constantRouterMap = [
{ {
path: "/", // path: "/",
name: "home", // name: "home",
meta: { title: "首页", icon: "" }, // meta: { title: "首页", icon: "" },
component: home, // component: home,
redirect: "/homePage", // redirect: "/homePage",
children: [ path: '/',
name: 'home',
component: resolve => require(["@/views/home"], resolve),
meta: { title: '首页', icon: '' },
redirect: "/doc",
children: [
{ {
path: "/homePage", path: "/doc",
name: 'homePage', name: 'doc',
meta: { title: '首页', icon: '' }, meta: { title: '我的文档', icon: '' },
component: resolve => require(["@/views/homePage"], resolve), component: resolve => require(["@/views/doc"], resolve),
},
{
path: "/show",
name: 'show',
meta: { title: '详情', icon: '' },
component: resolve => require(["@/views/show"], resolve),
},
{
path: "/news",
name: 'news',
meta: { title: '法院新闻', icon: '' },
component: resolve => require(["@/views/news"], resolve),
},
{
path: "/list",
name: 'list',
meta: { title: '新闻列表', icon: '' },
component: resolve => require(["@/views/list"], resolve),
},
{
path: "/detail",
name: 'detail',
meta: { title: '详情', icon: '' },
component: resolve => require(["@/views/detail"], resolve),
},
{
path: "/manage",
name: 'manage',
meta: { title: '栏目', icon: '' },
component: resolve => require(["@/views/manage"], resolve),
}, },
{ {
path: "/search", path: "/group",
name: 'search', name: 'group',
meta: { title: '搜索', icon: '' }, meta: { title: '组织协作', icon: '' },
component: resolve => require(["@/views/search"], resolve), component: resolve => require(["@/views/group"], resolve),
}, },
{ {
path: "/more", path: "/mine",
name: 'more', name: 'mine',
meta: { title: '更多', icon: '' }, meta: { title: '我的协作', icon: '' },
component: resolve => require(["@/views/more"], resolve), component: resolve => require(["@/views/mine"], resolve),
},
{
path: "/zone",
name: 'zone',
meta: { title: '更多', icon: '' },
component: resolve => require(["@/views/zone"], resolve),
}, },
// { // {
// path: "/news",
// name: 'news',
// meta: { title: '法院新闻', icon: '' },
// component: resolve => require(["@/views/news"], resolve),
// },
// {
// path: "/list",
// name: 'list',
// meta: { title: '新闻列表', icon: '' },
// component: resolve => require(["@/views/list"], resolve),
// },
// {
// path: "/detail",
// name: 'detail',
// meta: { title: '详情', icon: '' },
// component: resolve => require(["@/views/detail"], resolve),
// },
// {
// path: "/search",
// name: 'search',
// meta: { title: '搜索', icon: '' },
// component: resolve => require(["@/views/search"], resolve),
// },
// {
// path: "/more",
// name: 'more',
// meta: { title: '更多', icon: '' },
// component: resolve => require(["@/views/more"], resolve),
// },
// {
// path: "/zone",
// name: 'zone',
// meta: { title: '更多', icon: '' },
// component: resolve => require(["@/views/zone"], resolve),
// },
// {
// path: "/homePage", // path: "/homePage",
// name: 'homePage', // name: 'homePage',
// meta: { title: '首页', icon: '' }, // meta: { title: '首页', icon: '' },
......
<template>
<div>
<el-row>
<el-col :span="18" :offset="3">
<el-row class="mt-20" :gutter="20">
<el-col :span="16">
<div class="zone-style">
<div style="">
<div style="">
<span>当前位置:</span>
<el-breadcrumb
style="display: inline-block"
separator-class="el-icon-arrow-right"
>
<!-- <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
<el-breadcrumb-item>活动管理</el-breadcrumb-item> -->
<el-breadcrumb-item v-for="(v,i) in breadList" :key="i">
<!-- <span v-if="i==breadList.length-1">{{ v.meta.title}}</span>
<router-link v-else>{{ v.meta.title}}</router-link> -->
<router-link :to="{name: v.name}" >{{ v.meta.title}}</router-link>
<!-- <router-link :to="v.path" >{{ v.meta.title}}</router-link> -->
</el-breadcrumb-item>
</el-breadcrumb>
</div>
<!-- 文章内容 -->
<el-row>
<h2 style=" text-align: center;">{{article.subject}}</h2>
<div v-if="article.newsTime" style="color: #999999; font-size: 12px;text-align:right">发布时间:{{article.newsTime.substring(0,10)}}</div>
<div>
<el-image style="margin-top:5px;width:100%;margin-bottom:5px;" fit="contain" v-for="item in attachList" :key="item.id" :src="item.downloadPath"></el-image>
</div>
<div class="view-html" style="width:100%;" v-html="article.content"></div>
<div class="wiriter-intro">作者: {{ article.provider }}</div>
</el-row>
</div>
<!--下载附件-->
<el-row
class="mt-15"
:gutter="20"
style="border-top: 1px solid #eee; padding: 35px 0"
>
<el-col>
<el-row :gutter="40">
<el-col v-for="item in attachList" :key="item.id" class="mb-10" :span="24" >
<div @click="downLoadFile(item)" class="k-flex k-align-center">
<img
class="mr-5 gong-icon"
style=""
src="../../assets/home/file.png"
/>
<div>下载附件:</div>
<div class="file-name">
{{item.attachName}}
</div>
</div>
</el-col>
<!-- <el-col class="mb-10" :span="12">
<div class="k-flex k-align-center">
<img
class="mr-5 gong-icon"
style=""
src="../../assets/home/gonggao.png"
/>
<div class="file-name">
namehghjsd结果来看和可管理回馈老顾客
</div>
</div>
</el-col>
<el-col class="mb-10" :span="12">
<div class="k-flex k-align-center">
<img
class="mr-5 gong-icon"
style=""
src="../../assets/home/gonggao.png"
/>
<div class="file-name">
namehghjsd结果来看和可管理回馈老顾客
</div>
</div>
</el-col> -->
</el-row>
</el-col>
</el-row>
<!--评论-->
<el-row>
<h5 v-if="messageDetailData.length==0" style="text-align: center">暂无评论</h5>
<h5 v-else style="text-align: center">评论</h5>
<div v-for="(item,index) in messageDetailData" :key="item.id" class="k-flex mb-15">
<el-image style="width:30px;height:30px;" fit="contain" :src="require('../../assets/home/user-o.png')"></el-image>
<div class="ml-5 k-all">
<div class="k-flex k-space-between" style="font-size:12px;color:#ccc;">
<div class="ml-5">{{item.userId}}</div>
<div class="mr-15">{{item.reTime}}</div>
</div>
<div class="mt-10" style="font-size:9px;">{{item.content}}</div>
<div v-if="item.subComments.length>0" style="margin-top:10px;font-size:9px;background:#eee;border-radius:5px;padding:15px;">
<!-- {{item.content}} -->
<div class="mb-5" v-for="tab in item.subComments" :key="tab.id">
<span>{{tab.nickName}}</span>
<span>{{ tab.content }}</span>
</div>
</div>
<div @click="returnEvent(item,index)" v-if=" user.id && !item.returnFlag" class="mt-10" style="font-size:10px;margin-left:10px;color:blue;">回复</div>
<!-- 回复开始 -->
<div v-if="item.returnFlag" class="k-flex k-align-center return-comment mt-15">
<el-input
class=""
type="textarea"
:rows="1"
v-model="reCommentContent"
placeholder="请输入回复内容"
></el-input>
<el-button class="ml-10 " type="primary" size="mini" @click="commentEvent(1,item.content,item.id)">发送</el-button>
</div>
<!-- 回复结束 -->
</div>
</div>
<!-- <div>
<button size="mini" type="primary">回复</button>
</div> -->
<el-input
class="mt-15"
type="textarea"
:rows="10"
v-model="commentContent"
placeholder="发表评论"
></el-input>
<div v-if="user.id" style="text-align:center;">
<el-button class="mt-15" s type="danger" size="mini" @click="commentEvent(0,'','')">发表</el-button>
</div>
<div
v-if="!user.id"
style="text-align: center; font-size: 14px; margin-top: 15px"
>
您必须先的<span style="color: #d33237" @click="loginEvent">登录</span>才能发表评论或者回复
</div>
</el-row>
</div>
</el-col>
<el-col :span="8">
<div class="zone-style">
<div @click="seeMoreEvent(5)" class="k-flex-between-center">
<div class="k-flex k-align-center">
<el-image
class="mr-5 gong-icon"
style=""
:src="require('../../assets/news/3.png')"
></el-image>
<div>精彩回顾</div>
</div>
<div @click="seeMoreEvent(5)" style="font-size: 12px; color: #999999">
<span>MORE></span>
</div>
</div>
<div @click="seeParams(highlightsData[0])" class="mt-10 mb-5 k-flex k-align-center">
<img
class="mr-5 gong-icon"
style=""
src="../../assets/home/gonggao.png"
/>
<div v-if="highlightsData[0]" class="gonggao-text">
<span>{{ highlightsData[0].subject }}</span>
<!-- <span v-html="highlightsData[0].content"></span> -->
</div>
</div>
<div
v-for="item in highlightsData"
:key="item.newsId"
class="k-flex k-space-between top-list"
@click="seeParams(item)">
<div class="article-name">
<span class="right-line">
{{ item.boardName }}
<span class="line-div"></span>
</span>
<span>{{item.subject}}</span>
</div>
<div>{{ item.date }}</div>
</div>
</div>
<div class="mt-15 zone-style">
<div class="mb-15 btns-switch">
<el-button
@click.native="switchBtn(0)"
:class="['btn-item', { sanjiao: activeItem == 0 }]"
>本月阅读排行</el-button
>
<el-button
@click.native="switchBtn(1)"
:class="['btn-item', { sanjiao: activeItem == 1 }]"
>评论排行</el-button
>
</div>
<div
v-for="(item, index) in commentRankData"
:key="index"
class="k-flex k-space-between top-list"
@click="seeParams(item)">
<div class="article-name">
<span class="num" style="">{{ index + 1 }}</span>
<span class="right-line">
{{ item.boardName }}
<span class="line-div"></span>
</span>
<span>{{ item.subject }}</span>
</div>
<!--<div>{{item.date}}</div>-->
</div>
<!-- <div
v-for="(item, index) in topList"
:key="index"
class="k-flex k-space-between top-list"
>
<div class="article-name">
<span class="num" style="">{{ index + 1 }}</span>
<span class="right-line">
我为群众办实事
<span class="line-div"></span>
</span>
<span>{{ item.name }}</span>
</div>
<div>{{item.date}}</div>
</div> -->
</div>
</el-col>
</el-row>
<!--<el-row class="top-info" style="">
<span class="fist-text" style=""></span>
<span>作信息</span>
<div style="float:right;">
<span>当前位置:</span>
<el-breadcrumb style="display:inline-block;" separator-class="el-icon-arrow-right">
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
<el-breadcrumb-item>活动管理</el-breadcrumb-item>
</el-breadcrumb>
</div>
</el-row>
<el-row :gutter="20">
<el-col :span="8">
<div class="list-container" style="">
<div class="list-title" style="">按分类查看</div>
<ul class="type-list">
<li><a href="#">最高法通报</a></li>
<li><a href="#">最高人民法院简报</a></li>
</ul>
</div>
</el-col>
<el-col :span="16">
<div style="min-height:76vh;">
<el-table
:header-cell-style="{'text-align':'center','font-size':'13px','color':'black'}"
:cell-style="{'font-size':'13px','border-bottom':'none'}"
ref="singleTable"
:data="tableData"
highlight-current-row
@current-change="handleCurrentChange"
style="width: 100%">
<el-table-column
property="address"
label="标题">
</el-table-column>
<el-table-column
align="center"
property="date"
label="时间"
width="150">
</el-table-column>
<el-table-column
align="center"
property="name"
label="点击"
width="120">
</el-table-column>
<el-table-column
align="center"
property="name"
label="评论"
width="50">
</el-table-column>
</el-table>
<div style="margin-top:10px;">
<el-pagination
prev-text="上一页"
next-text="下一页"
layout="total,sizes,prev, pager, next,jumper"
:total="1000"
page-sizes=""
page-size="15"
current-page="1"
@current-change=""
@size-change=""
/>
</div>
</div>
</el-col>
</el-row>-->
</el-col>
</el-row>
</div>
</template>
<script>
import {newsDetail} from "@/api/homePage.js"
import { messageDetail } from "@/api/manage/manage";
import { removeToken } from "@/utils/auth";
import { createMessage,commentRaking,monthClickRanking } from "@/api/detail";
// import { getUserInfo } from "@/utils/auth";
import { mapGetters, mapMutations } from "vuex";
import {
highlights,//精彩回顾
} from "@/api/news.js";
export default {
name: "show",
data() {
return {
highlightsData:[],//精彩回顾集合
commentRankData:[],//本月评论
reCommentContent:'',//回复内容
messageDetailData:[],//评论详情
returnFlag:false,//回复判断
commentContent:'',//评论内容
activeItem: 0,
topList: [
{
name: "开展司法教助全集中发放活动尽量克服冠军费德勒冠军费德勒空军航空发货过来会考虑好看",
date: "09-23",
},
{
name: "开展司法教助全集中发放活动",
date: "09-23",
},
{
name: "开展司法教助全集中发放活动",
date: "09-23",
},
{
name: "开展司法教助全集中发放活动",
date: "09-23",
},
{
name: "开展司法教助全集中发放活动",
date: "09-23",
},
{
name: "开展司法教助全集中发放活动",
date: "09-23",
},
{
name: "开展司法教助全集中发放活动",
date: "09-23",
},
],
tableData: [
{
date: "2016-05-02 12:00:00",
name: "24",
address: "【广西高院队...】广西高院队伍整顿简报",
},
{
date: "2016-05-04 12:00:00",
name: "45",
address: "上海市普陀区金沙江路 1517 弄",
},
{
date: "2016-05-01 12:00:00",
name: "67",
address: "上海市普陀区金沙江路 1519 弄",
},
{
date: "2016-05-03 12:00:00",
name: "89",
address: "上海市普陀区金沙江路 1516 弄",
},
],
article:{},
attachList:[],//附件
breadList:[],//面包屑列表
};
},
created() {
this.getBreadcrumb();
var self = this;
self.getParams();
},
//从vuex store获取用户信息判断是否登录
computed:{
...mapGetters(['user']),
},
//监听路由获取面包屑
watch:{
$route(to,from){
console.log('to===',to);
console.log('from===',from);
this.getBreadcrumb();
// if(next.path.indexOf("/detail")!=-1){
// next.meta.title =next.query+"异动情况详情"
// }
// let {path, meta, query} = next;
// this.pushTopTab({meta.title: meta.title, path, query});
}
},
methods: {
seeMoreEvent(type) {
// type=3;3是最新消息,1是关注自己的法院 5,精彩回顾
console.log("更多",type);
this.$router.push({
path: "/more", //跳转路由
query: {
//参数对象
type: type,
},
});
},
// 获取面包屑
getBreadcrumb(){
this.breadList=this.$route.matched.filter(item=>item.meta && item.meta.title);
console.log('this.breadList==',this.breadList);
console.log('this.$route==',this.$route);
},
// 获取精彩回顾
highlights(){
highlights({page:1,size:5,fyId:32}).then(res=>{
if(res.success){
this.highlightsData=res.data.records;
this.highlightsData.forEach(item=>{
item.date=(item.newsTime).substring(5,10);
})
}
})
},
//本月阅读排行
monthClickRanking(){
let params={};
var myDate = new Date();
var curMonth=myDate.getMonth(); //获取当前月份(0-11,0代表1月);
params.fyId=32;//传法院id,固定写死32,是固定的高院内网所以传 32
params.byMonth=curMonth;//按月
console.log('当前月份==',curMonth);//当前月份
monthClickRanking(JSON.stringify(params)).then(res=>{
if(res.success){
this.commentRankData=res.data;
}
})
},
//本月评论排行
commentRaking(){
let params={};
var myDate = new Date();
var curMonth=myDate.getMonth(); //获取当前月份(0-11,0代表1月);
params.fyId=32;//传法院id,固定写死32,是固定的高院内网所以传 32
params.byMonth=curMonth;//按月
console.log('当前月份==',curMonth);//当前月份
commentRaking(JSON.stringify(params)).then(res=>{
if(res.success){
this.commentRankData=res.data;
}
})
},
returnEvent(item,index){
console.log('回复',);
this.messageDetailData[index].returnFlag=!item.returnFlag;
this.$forceUpdate();
console.log('回复==',this.messageDetailData);
},
//下载文件
downLoadFile(item){
// alert('111');
console.log('下载附件==',item)
// 创建a标签
// let a = document.createElement('a')
// a.download = item.attachName; //下载后文件名
// a.setAttribute('href',item.downLoadFile)
// a.click(); //点击下载
// 创建a标签
let link = document.createElement('a')
// href链接
link.download = item.attachName; //下载后文件名
link.setAttribute('href',item.downloadPath);
// 自执行点击事件
link.click();
},
getParams(){//接收函数
console.log(this.$router.history.current.query.newsId)
// this.msg = this.$router.history.current.query.name;
this.newsDetailFun(this.$router.history.current.query.newsId);
this.messageDetail(this.$router.history.current.query.newsId);//获取评论详情
// this.commentRaking();//获取本月评论排行
this.monthClickRanking();//获取本月阅读排行
this.highlights();//获取精彩回顾
},
newsDetailFun(val){
newsDetail({newsId:val}).then(res=>{
let {newsDetail,attachList}=res.data;
this.article = newsDetail;
this.attachList=attachList;
})
},
//评论详情
messageDetail(newsId){
let params={};
params.newsId=newsId;
// params.newsId='f4bf8ffc4ec54e98a180f36b95668ec6';
messageDetail(JSON.stringify(params)).then(res=>{
if(res.success){
this.messageDetailData=res.data;
this.messageDetailData.forEach(item=>{
item.returnFlag=false;
})
}
})
},
switchBtn(i) {
console.log("111===", i);
this.activeItem = i;
if(this.activeItem==0){
this.monthClickRanking();//本月阅读排行
}else{
this.commentRaking();//获取评论排行
}
},
//发表评论
commentEvent(type,content,commentId){
var oldContent=content;
var params={};
// type=1是回复,type=0是发表评论
// this.reCommentContent=
if(type==0){
if(this.commentContent==''){
this.$message({
message:'请输入评论内容!',
type:'success'
});
return;
}
params.content=this.commentContent;
params.newsId=this.$router.history.current.query.newsId;
}
if(type==1){
if(this.reCommentContent==''){
this.$message({
message:'请输入回复内容!',
type:'success'
});
return;
}
// params.content=oldContent+'回复:'+this.reCommentContent+'。';
params.content='回复:'+this.reCommentContent+'。';
params.newsId=this.$router.history.current.query.newsId;
params.parentId=commentId;
}
createMessage(JSON.stringify(params)).then(res=>{
this.messageDetail(this.$router.history.current.query.newsId);
if(res.success){
this.$message({
message:'评论成功!',
type:'success'
})
}
})
},
loginEvent(){
removeToken();
// alert('11111',process.env.VUE_APP_LOGIN_API);
// removeToken();
// console.log('loginURL11111111111111==',loginURL );
// var loginURL  = process.env.VUE_APP_LOGIN_API;
console.log('loginURL222222222222==',process.env.VUE_APP_LOGIN_API);
// location.href = loginURL ;
location.href = process.env.VUE_APP_LOGIN_API
},
// 查看详情
seeParams(val){
this.$router.push({
path:'/detail',//跳转路由
query:{//参数对象
newsId:val.newsId
}
});
this.getParams();
},
},
};
</script>
<style lang="scss" scoped>
.wiriter-intro{
text-align:right;
margin-top:10px;
font-size:13px;
}
// 切换气泡按钮
.btns-switch .btn-item {
display: inline-block;
text-align: center;
border: 1px solid #ff756d;
border-radius: 5px;
color: #ff756d;
}
.btns-switch .sanjiao {
background: #d33237;
color: #fff;
position: relative;
}
.sanjiao:after {
position: absolute;
display: inline-block;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-top: 8px solid #d33237;
left: 30px;
bottom: -8px;
content: "";
}
.zone-style {
background-color: #fff;
padding: 15px 15px;
border-radius: 5px;
box-shadow: -5px 0px 20px 5px rgba(0, 0, 0, 0.05);
}
.top-list {
padding: 5px 0;
font-size: 10px;
// color:#999999;
color: black;
}
.top-list .article-name {
width: 85%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: #999999;
}
.file-name {
font-size: 14px;
}
.top-list:hover {
color: red;
}
.top-list:hover .article-name {
color: red;
}
.top-list .num {
// background:#D33237;
background: #cccccc;
color: #fff;
padding: 0 5px;
border-radius: 2px;
}
.top-list:hover .num {
background: #d33237;
}
.top-list .article-name .right-line {
padding-right: 2px;
// border-right:2px solid black;
margin-right: 5px;
position: relative;
color: black;
}
.top-list:hover .right-line {
color: red;
}
.line-div {
position: absolute;
right: 0;
top: 0;
height: 30px;
width: 2px;
background: black;
}
// 公告
.gong-icon {
width: 13px;
height: 13px;
}
.gonggao-text {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: #ff756d;
font-family: PingFang SC, PingFang SC-Medium;
font-size: 13px;
}
.top-info {
margin: 15px 0;
border-bottom: 2px solid #34bab2;
padding-bottom: 15px;
}
.fist-text {
display: inline-block;
width: 26px;
height: 26px;
line-height: 26px;
text-align: center;
font-size: 15px;
color: #fff;
border-radius: 50%;
background: #1a3784;
margin-right: 3px;
}
.list-container {
border: 2px solid #34bab2;
padding: 15px 15px;
margin-top: 40px;
}
.list-title {
border-bottom: 1px dashed #ccc;
line-height: 35px;
}
// 列表start
.type-list li {
list-style-type: square;
// color: #0099ff;
color: blue;
font-size: 16px;
line-height: 35px;
border-bottom: 1px dashed #ccc;
}
.type-list li a {
color: #333;
font-size: 14px;
text-decoration: none;
}
.type-list li:hover {
// color: #ff6900;
color: red;
}
.type-list li:hover a {
// color: #ff6900
color: red;
}
.type-list li:last-of-type {
border-bottom: none;
}
// 列表end
ul {
margin: 0px;
padding: 0px;
padding-left: 15px;
}
// 回复评论
.return-comment {
background: #eee;
color: #fff;
position: relative;
padding:10px;
margin-top:10px;
margin-bottom:10px;
border-radius:5px;
border:1px solid #eee;
}
.return-comment:after {
position: absolute;
display: inline-block;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-bottom: 8px solid #eee;
left: 30px;
top: -8px;
content: "";
}
// 图片溢出
::v-deep{
.view-html p img{
width: 100% !important;
}
}
</style>
\ No newline at end of file
<template>
<div class="my-tab">
<el-row >
<el-col :span="5">
<div class="list-container" style="">
<el-tree :data="fileTreedata" default-expand-all :props="defaultProps" @node-click="handleNodeClick"></el-tree>
</div>
</el-col>
<el-col :span="19">
<div>
<div class="container-title">所有文件夹</div>
<el-table
:data="tableData"
style="width: 100%;margin-bottom: 20px;"
row-key="id"
default-expand-all
:header-cell-style="{
'text-align': 'center',
'font-size': '15px',
'color':'#fff'
}"
:cell-style="{padding: '20px',color:'#fff'}"
:tree-props="{children: 'children', hasChildren: 'hasChildren'}">
<el-table-column
align="left"
prop="address"
label="名称">
<template slot-scope="scope" >
<!-- <div class="k-flex k-space-between">
<div> -->
<i class="el-icon-folder-opened"></i>
<span>{{scope.row.address}}</span>
<!-- </div> -->
<!-- <el-button
style="float:right;"
v-if="!scope.row.children"
type="text"
size="mini">
日志
</el-button> -->
<div style="float:right;">
<el-image @click="openShare" class="btn-image mr-25" :src="require('@/assets/table/fenxiang.png')"></el-image>
<el-image class="btn-image mr-25" :src="require('@/assets/table/xiazai.png')"></el-image>
<el-image class="btn-image mr-25" :src="require('@/assets/table/delete.png')"></el-image>
<el-image class="btn-image" :src="require('@/assets/table/name.png')"></el-image>
</div>
<!-- </div> -->
<!-- <el-table
:data="scope.row"
style="width: 100%;margin-bottom: 20px;"
row-key="id"
border
default-expand-all
>
<el-table-column
prop=""
width="180"
label="文件类型">
<template slot-scope="">
<i class="el-icon-folder-opened"></i>
</template>
</el-table-column>
</el-table> -->
</template>
</el-table-column>
<el-table-column
prop=""
align="center"
width="180"
label="文件类型">
<template slot-scope="">
文件夹
</template>
</el-table-column>
<el-table-column
prop="name"
align="center"
label="文件大小"
sortable
width="180">
</el-table-column>
<el-table-column
prop="date"
align="center"
label="操作时间"
sortable
width="180">
</el-table-column>
<!-- <el-table-column
prop="address"
label="地址">
</el-table-column> -->
</el-table>
</div>
</el-col>
</el-row>
<!---分享弹窗start-->
<el-dialog
title="分享文件"
:visible.sync="shareVisible"
width="40%"
:before-close="handleClose">
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="私密分享" name="first">
<div class="k-flex">
<div class="k-all">hhh</div>
<el-button size="mini" type="primary">复制链接</el-button>
</div>
<el-checkbox v-model="checked">同时邀请对方为管理员</el-checkbox>
</el-tab-pane>
<el-tab-pane label="公开分享" name="second">公开分享</el-tab-pane>
</el-tabs>
<!-- <span slot="footer" class="dialog-footer">
<el-button type="primary" @click="handleClose">关闭</el-button>
<el-button type="primary" @click="saveAdvise">确 定</el-button>
</span> -->
</el-dialog>
<!---4、审核列表--提建议弹窗end-->
</div>
</template>
<script>
export default {
name: "show",
data() {
return {
activeName:'first',
checked:false,
shareVisible:false,//分享弹窗
fileTreedata: [{
label: '一级 1',
children: [{
label: '二级 1-1',
children: [{
label: '三级 1-1-1'
}]
}]
}, {
label: '一级 2',
children: [{
label: '二级 2-1',
children: [{
label: '三级 2-1-1'
}]
}, {
label: '二级 2-2',
children: [{
label: '三级 2-2-1'
}]
}]
}, {
label: '一级 3',
children: [{
label: '二级 3-1',
children: [{
label: '三级 3-1-1'
}]
}, {
label: '二级 3-2',
children: [{
label: '三级 3-2-1'
}]
}]
}],
defaultProps: {
children: 'children',
label: 'label'
},
tableData: [{
id: 1,
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
id: 2,
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄'
}, {
id: 3,
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄',
children: [{
id: 31,
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
}, {
id: 32,
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
}]
}, {
id: 4,
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
}],
}
},
created() {
},
methods:{
handleNodeClick(data) {
console.log(data);
},
openShare(){
this.shareVisible=true;
},
handleClose(){
this.shareVisible=false;
}
}
}
</script>
<style lang="scss" scoped>
.my-tab{
background:#333;
}
.list-container{
height: 65vh;
overflow: hidden;
overflow:auto;
padding:15px;
border-right:1px solid #181818;
}
.container-title{
height:60px;
line-height:60px;
padding:0 15px;
color:#fff;
border-bottom:1px solid #181818;
}
.btn-image{
width:13px;
height:15px;
}
::v-deep{
.el-table th:first-child > .cell {
text-align: left !important;
padding-left:15px;
}
.el-dialog{
border-radius: 10px;
}
.el-dialog__header{
background:#3b6999;
border-radius: 10px 10px 0 0;
}
.el-dialog__title{
color: #fff!important;
}
}
// 树形菜单图标start-----------------------
.el-tree{
color:#fff;
}
.el-tree{
background:transparent;
}
.el-tree /deep/ .el-tree-node__expand-icon.expanded
{
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
/*//有子节点 且未展开*/
.el-tree /deep/ .el-icon-caret-right:before
{
background: url("../../assets/wjjg.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
/*//有子节点 且已展开*/
.el-tree /deep/ .el-tree-node__expand-icon.expanded.el-icon-caret-right:before
{
background: url("../../assets/wjjk.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
/*//没有子节点*/
.el-tree /deep/ .el-tree-node__expand-icon.is-leaf::before
{
background: url("../../assets/wj.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
// 树形菜单图标end-----------------------
// 表格背景色start
// .el-table--border, .el-table--group{
// border:none;
// }
/deep/.el-table td,
.el-table th.is-leaf {
// border-bottom: 1px solid rgb(51, 51, 51);
border-bottom: 1px solid #444444;
}
/deep/.el-table--enable-row-hover .el-table__body tr:hover>td {
// background-color: #424242;
background-color:#333;
color: rgb(207, 207, 207);
}
/deep/.el-table {
th,
tr {
// background-color: rgb(22, 22, 22);
background-color:#333;
.is-leaf {
// border-bottom: 1px solid rgb(51, 51, 51);
border-bottom: 1px solid #444444;
}
&:hover {
background-color: rgb(66, 66, 66);
}
}
&--border::after,
&--group::after,
&::before {
content: '';
position: absolute;
background-color: rgb(66, 66, 66);
// background-color:#333;
z-index: 1;
}
}
/deep/.el-table__body-wrapper {
// background-color: black;
background-color:#333;
}
// 表格背景色end
</style>
\ No newline at end of file
<template>
<div class="my-tab">
<el-row >
<el-col :span="5">
<div class="list-container" style="">
<el-tree :data="fileTreedata" default-expand-all :props="defaultProps" @node-click="handleNodeClick"></el-tree>
</div>
</el-col>
<el-col :span="19">
<div>
<div class="container-title">所有文件夹</div>
<el-table
:data="tableData"
style="width: 100%;margin-bottom: 20px;"
row-key="id"
default-expand-all
:header-cell-style="{
'text-align': 'center',
'font-size': '15px',
'color':'#fff'
}"
:cell-style="{padding: '20px',color:'#fff'}"
:tree-props="{children: 'children', hasChildren: 'hasChildren'}">
<el-table-column
align="left"
prop="address"
label="名称">
<template slot-scope="scope" >
<!-- <div class="k-flex k-space-between">
<div> -->
<i class="el-icon-folder-opened"></i>
<span>{{scope.row.address}}</span>
<!-- </div> -->
<!-- <el-button
style="float:right;"
v-if="!scope.row.children"
type="text"
size="mini">
日志
</el-button> -->
<div style="float:right;">
<el-image class="btn-image mr-25" :src="require('@/assets/table/fenxiang.png')"></el-image>
<el-image class="btn-image mr-25" :src="require('@/assets/table/xiazai.png')"></el-image>
<el-image class="btn-image mr-25" :src="require('@/assets/table/delete.png')"></el-image>
<el-image class="btn-image" :src="require('@/assets/table/name.png')"></el-image>
</div>
<!-- </div> -->
<!-- <el-table
:data="scope.row"
style="width: 100%;margin-bottom: 20px;"
row-key="id"
border
default-expand-all
>
<el-table-column
prop=""
width="180"
label="文件类型">
<template slot-scope="">
<i class="el-icon-folder-opened"></i>
</template>
</el-table-column>
</el-table> -->
</template>
</el-table-column>
<el-table-column
prop=""
align="center"
width="180"
label="文件类型">
<template slot-scope="">
文件夹
</template>
</el-table-column>
<el-table-column
prop="name"
align="center"
label="文件大小"
sortable
width="180">
</el-table-column>
<el-table-column
prop="date"
align="center"
label="操作时间"
sortable
width="180">
</el-table-column>
<!-- <el-table-column
prop="address"
label="地址">
</el-table-column> -->
</el-table>
</div>
</el-col>
</el-row>
</div>
</template>
<script>
export default {
name: "show",
data() {
return {
fileTreedata: [{
label: '一级 1',
children: [{
label: '二级 1-1',
children: [{
label: '三级 1-1-1'
}]
}]
}, {
label: '一级 2',
children: [{
label: '二级 2-1',
children: [{
label: '三级 2-1-1'
}]
}, {
label: '二级 2-2',
children: [{
label: '三级 2-2-1'
}]
}]
}, {
label: '一级 3',
children: [{
label: '二级 3-1',
children: [{
label: '三级 3-1-1'
}]
}, {
label: '二级 3-2',
children: [{
label: '三级 3-2-1'
}]
}]
}],
defaultProps: {
children: 'children',
label: 'label'
},
tableData: [{
id: 1,
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
id: 2,
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄'
}, {
id: 3,
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄',
children: [{
id: 31,
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
}, {
id: 32,
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
}]
}, {
id: 4,
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
}],
}
},
created() {
},
methods:{
handleNodeClick(data) {
console.log(data);
}
}
}
</script>
<style lang="scss" scoped>
.my-tab{
background:#333;
}
.list-container{
height: 65vh;
overflow: hidden;
overflow:auto;
padding:15px;
border-right:1px solid #181818;
}
.container-title{
height:60px;
line-height:60px;
padding:0 15px;
color:#fff;
border-bottom:1px solid #181818;
}
.btn-image{
width:13px;
height:15px;
}
::v-deep{
.el-table th:first-child > .cell {
text-align: left !important;
padding-left:15px;
}
}
// 树形菜单图标start-----------------------
.el-tree{
color:#fff;
}
.el-tree{
background:transparent;
}
.el-tree /deep/ .el-tree-node__expand-icon.expanded
{
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
/*//有子节点 且未展开*/
.el-tree /deep/ .el-icon-caret-right:before
{
background: url("../../assets/wjjg.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
/*//有子节点 且已展开*/
.el-tree /deep/ .el-tree-node__expand-icon.expanded.el-icon-caret-right:before
{
background: url("../../assets/wjjk.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
/*//没有子节点*/
.el-tree /deep/ .el-tree-node__expand-icon.is-leaf::before
{
background: url("../../assets/wj.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
// 树形菜单图标end-----------------------
// 表格背景色start
// .el-table--border, .el-table--group{
// border:none;
// }
/deep/.el-table td,
.el-table th.is-leaf {
// border-bottom: 1px solid rgb(51, 51, 51);
border-bottom: 1px solid #444444;
}
/deep/.el-table--enable-row-hover .el-table__body tr:hover>td {
// background-color: #424242;
background-color:#333;
color: rgb(207, 207, 207);
}
/deep/.el-table {
th,
tr {
// background-color: rgb(22, 22, 22);
background-color:#333;
.is-leaf {
// border-bottom: 1px solid rgb(51, 51, 51);
border-bottom: 1px solid #444444;
}
&:hover {
background-color: rgb(66, 66, 66);
}
}
&--border::after,
&--group::after,
&::before {
content: '';
position: absolute;
background-color: rgb(66, 66, 66);
// background-color:#333;
z-index: 1;
}
}
/deep/.el-table__body-wrapper {
// background-color: black;
background-color:#333;
}
// 表格背景色end
</style>
\ No newline at end of file
<template> <template>
<div class="page"> <div class="home">
<!--<el-header class="border-bt">--> <el-header class="myhead">
<!-- 顶部标题工具栏 --> <topHead />
<el-row > </el-header>
<el-col class="" :span="18" :offset="3">
<div style="float:right;margin-top:15px;color:#D33237;font-size:10px;padding-right:25px;"> <el-container class="my-container mt-15">
<div v-if="!userInfo.id" @click="loginEvent" class="k-flex k-align-center">
<div>
<el-image style="width:15px;height:16px;display:block;margin-right:5px;" :src="require('../assets/home/denglu.png')"></el-image>
</div>
<div>登录</div>
</div>
<div v-if="userInfo.id" class="k-flex k-align-center">
<el-image style="width:15px;height:16px;display:block;margin-right:5px;" :src="require('../assets/home/denglu.png')"></el-image>
<div class="center-txt mr-10" v-if="userInfo.id">
法院:{{ userInfo.courtCode }}&ensp;部门:{{ userInfo.dept?userInfo.dept.name:'' }}&ensp;姓名:{{ userInfo.nickName }}
</div>
<div @click="loginOut" class="k-flex k-align-center">
<el-image style="width:15px;height:16px;display:block;margin-right:5px;" :src="require('../assets/home/tuichu.png')"></el-image>
<div>退出</div>
</div>
</div>
</div>
<el-row :gutter="4" class="top-content">
<!-- <el-image style="width:100%;display:block;" :src="require('../assets/home/top.png')"></el-image> -->
<!-- <el-col :span="9" class="top-title">
<img :src="require('../assets/iconImg/01-首页/logo.png')" alt="" />
<div class="title-txt">广西法院内部信息网</div>
</el-col>
<el-col :span="10">
<div class="center-txt" v-if="userInfo.id">
法院:{{ userInfo.courtCode }}&ensp;部门:{{ userInfo.dept?userInfo.dept.name:'' }}&ensp;姓名:{{ userInfo.nickName }}
</div>
</el-col>
<el-col :span="5" class="top-btn"> -->
<!-- <div class="top-btn-item">
<img
:src="require('../assets/iconImg/01-首页/使用手册.png')"
alt=""
/>
<div class="top-btn-item-text">使用手册</div>
</div>
<div class="top-btn-item">
<img
:src="require('../assets/iconImg/01-首页/系统设置.png')"
alt=""
/>
<div class="top-btn-item-text">系统设置</div>
</div> -->
<!-- <div @click="loginOut" class="top-btn-item" v-if="userInfo.id">
<img :src="require('../assets/iconImg/01-首页/退出.png')" alt="" />
<div class="top-btn-item-text">退出</div>
</div>
</el-col> -->
</el-row>
</el-col>
</el-row>
<!--</el-header>-->
<el-container class="my-container">
<el-header> <el-header>
<menuHead/> <menuHead/>
</el-header> </el-header>
...@@ -67,21 +12,25 @@ ...@@ -67,21 +12,25 @@
<router-view /> <router-view />
</el-main> </el-main>
</el-container> </el-container>
<!-- <div style='position: relative;'>
<el-footer> <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
<div class="foot-div"> <el-tab-pane label="用户管理" name="first">用户管理</el-tab-pane>
<el-row> <el-tab-pane label="配置管理" name="second">配置管理</el-tab-pane>
<span>电话:0771-5788527 0771-5788292 0771-5788394</span> <el-tab-pane label="角色管理" name="third">角色管理</el-tab-pane>
</el-row> <el-tab-pane label="定时任务补偿" name="fourth">定时任务补偿</el-tab-pane>
<el-row> </el-tabs>
<span>Copyright 2015 by chinacourt.org All Rights Reserved</span> <div style='position: absolute;right:10px;top:5px;'>
</el-row> <el-button size='mini'>上传1</el-button>
<el-button size='mini'>上传2</el-button>
</div> </div>
</el-footer> </div> -->
</div> </div>
</template> </template>
<script> <script>
import topHead from "@/views/layout/head";
import menuHead from "@/views/layout/menu"; import menuHead from "@/views/layout/menu";
import { mapGetters, mapMutations } from "vuex"; import { mapGetters, mapMutations } from "vuex";
import { setUserInfo } from "@/utils/auth"; import { setUserInfo } from "@/utils/auth";
...@@ -93,11 +42,12 @@ import { ...@@ -93,11 +42,12 @@ import {
export default { export default {
components: { components: {
// topHead, topHead,
menuHead, menuHead,
}, },
data() { data() {
return { return {
activeName: 'first',
userInfo:{} userInfo:{}
}; };
}, },
...@@ -134,95 +84,76 @@ export default { ...@@ -134,95 +84,76 @@ export default {
console.log('loginURL222222222222==',process.env.VUE_APP_LOGIN_API); console.log('loginURL222222222222==',process.env.VUE_APP_LOGIN_API);
location.href = process.env.VUE_APP_LOGIN_API location.href = process.env.VUE_APP_LOGIN_API
}, },
enableTurnOnSystem(){ // enableTurnOnSystem(){
enableTurnOnSystem({fyId:32}).then((res) => { // enableTurnOnSystem({fyId:32}).then((res) => {
sessionStorage.setItem('publishFlag',res.success); // sessionStorage.setItem('publishFlag',res.success);
}); // });
} // }
handleClick(tab, event) {
console.log(tab, event);
}
}, },
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.page { // .page {
background-color:#FFFCDF; // background-color: #181818;
width: 100%; // width: 100%;
height: 100%; // height: 100%;
// height: 100vh; // }
.home {
background-color: #181818;
.myhead {
background:#333;
height: 60px;
// background-image: url('../assets/images/headbg.png');
// background-size: 100% 60px;
// background-repeat: no-repeat;
// background-position: bottom center;
}
.content-main {
// background-color: rgb(35, 35, 35);
.scrollbar_div {
height: calc(100vh - 100px);
}
}
} }
::v-deep{ ::v-deep{
.el-header{ .el-header{
// height: 12vh; // padding:0;
padding:0;
height:auto !important; height:auto !important;
} }
.el-main{ .el-main{
padding:0; padding:0;
padding:0 20px;
} }
} }
.top-content { // ::v-deep{
position:relative; // .el-header{
width: 100%; // padding:0;
height: 12vh; // height:auto !important;
display: flex; // }
justify-content: center; // .el-main{
align-items: center; // padding:0;
padding: 15px 15px; // }
// background-image: url("../assets/iconImg/01-首页/头部背景图.png"); // }
background-image: url("../assets/home/top.png");
background-repeat: no-repeat; // .top-content {
background-position: center center; // position:relative;
background-size: cover; // width: 100%;
} // height: 12vh;
.top-title { // display: flex;
display: flex; // justify-content: center;
align-items: center; // align-items: center;
// color: #fff; // padding: 15px 15px;
img { // background-image: url("../assets/home/top.png");
width: 2.5vw; // background-repeat: no-repeat;
margin-right: 15px; // background-position: center center;
} // background-size: cover;
.title-txt { // }
font-size: 1.6vw;
font-weight: bolder;
}
}
.center-txt {
// color: #fff;
font-size: 0.8vw;
}
.top-btn {
display: flex;
justify-content: space-around;
align-items: center;
&-item {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 33.3%;
img {
width: inherit;
margin-bottom: 5px;
}
&-text {
// color: #fff;
font-size: 1vw;
}
}
}
.el-footer {
margin-top: 20px;
border-top: 1px solid #ccc;
// padding: 25px 10px;
// padding-bottom: 10px;
width: 100%;
// background-color: rgba(0, 120, 255, 0.15);
text-align:center;
height:auto!important;
}
.foot-div{
padding: 25px 10px;
}
</style> </style>
<template>
<div >
<el-row >
<el-col :span="18" :offset="3">
<!--第一栏开始-->
<el-row :gutter="20" class="mt-15 first-zone-style">
<el-col :span="10" style="padding-left:0;padding-right:0;">
<div >
<el-carousel style="border-radius:8px;" height="280px" :interval="4000">
<el-carousel-item style="border-radius:8px;" v-for="(item,index) in headlineRotation.slice(0,3)" :key="index" >
<div v-if="item.attInfoList" class="carousel-div" style="border-radius:8px;" @click="setParams(item)">
<el-image v-if="item.attInfoList[0] && item.attInfoList[0].downloadPath" :src="item.attInfoList[0].downloadPath" fit="contain" style="width:100%;height:100%;"></el-image>
<div class="carousel-intro" style="">
<span>&ensp;{{item.subject}}&ensp;</span>
</div>
</div>
</el-carousel-item>
</el-carousel>
</div>
</el-col>
<el-col :span="10" style="">
<div class="zone-style">
<div class="k-flex-between-center">
<!--<span class="fist-text" style=""></span>
<span>日头条</span>-->
<div class="btns-switch">
<el-button @click.native="switchBtn(0)" :class="['btn-item',{'sanjiao':activeItem==0}]">今日头条</el-button>
<el-button @click.native="switchBtn(1)" :class="['btn-item',{'sanjiao':activeItem==1}]">工作信息</el-button>
</div>
<!-- 工作信息的boardId=1929 -->
<div @click="toTopMorelist(activeItem)" style="font-size:12px;color: #999999;">
<span>MORE></span>
</div>
</div>
<!--今日头条开始-->
<div v-if="activeItem==0">
<div class="mt-10 mb-5 k-flex k-align-center">
<img class="mr-5 gong-icon" style="" src="../../assets/home/gonggao.png"/>
<div v-if="topList" class="gonggao-text">
<span v-if="topList[0]">{{ topList[0].boardName }}&ensp;</span>
<span v-if="topList[0]">{{ topList[0].subject }}</span>
</div>
</div>
<div v-for="(item,index) in topList" :key="index" class="k-flex k-space-between top-list" @click="setParams(item)">
<div class="article-name k-flex k-align-center">
<span class="right-line">{{item.boardName}}</span>
<div class="k-all" style="overflow:hidden;text-overflow:ellipsis;">{{item.subject}}</div>
</div>
<div v-if="item.newsTime" style="white-space:nowrap;">{{item.newsTime.substring(5,10)}}</div>
</div>
</div>
<!--今日头条结束-->
<!--工作信息开始-->
<div v-if="activeItem==1" class="mt-15">
<el-row :gutter="20">
<el-col :span="8" style="">
<div class="work-tab-list" v-for="(item,index) in WorkButton" :key="index" >
<div style="font-size:8px;" class="tab-item" :class="[workActive==index? 'tab-item-active':'']" @click="informationSelection(item,index)">
{{item.boardName}}
</div>
</div>
</el-col >
<el-col :span="16" style="">
<div v-for="(item,index) in workList" :key="index" class="k-flex k-space-between work-top-list" @click="setParams(item)">
<div class="article-name k-flex k-align-center " style="overflow:h">
<span class="right-line">{{item.boardName}}</span>
<div class="k-all" style="overflow:hidden;text-overflow:ellipsis;">{{item.subject}}</div>
</div>
<div v-if="item.newsTime" style="white-space:nowrap;">{{item.newsTime.substring(5,10)}}</div>
</div>
</el-col >
</el-row>
</div>
<!--工作信息结束-->
</div>
</el-col>
<el-col :span="4" style="background:#fff;box-shadow: -5px 0px 20px 5px rgba(0,0,0,0.05); ">
<div class="partnerInfo">
<ul class="ul-list">
<li v-for="(item,index) in headlist" :key="index" class="k-flex k-align-center" >
<el-image class="mr-5" :src="item.icon"></el-image>
<div>
<div style="font-size:14px;">{{ item.name }}</div>
<div style="font-size:5px;">{{ item.nickName }}</div>
</div>
</li>
</ul>
</div>
</el-col>
</el-row>
<!--第一栏结束-->
<!--第二栏按钮列表开始-->
<el-row class="mt-15 out-zone-style" :gutter="10" >
<el-col class="mb-10" :span="3" v-for="(item,index) in btnsList" :key="index">
<el-button style="width:100%;">
<el-image class="mr-5 gong-icon" :src="item.icon"></el-image>
{{item.name}}
</el-button>
</el-col>
</el-row>
<!--第二栏按钮列表结束-->
<!--第三栏法院业务开始-->
<el-row class="mt-15 out-zone-style" :gutter="20" >
<el-col :span="13">
<div class="k-flex-between-center">
<div class="k-flex k-align-center">
<img class="mr-5 gong-icon" style="" src="../../assets/home/third.png"/>
<div>法院业务</div>
</div>
<div @click="toMorelist(130)" style="font-size:12px;color: #999999;">
<span>MORE></span>
</div>
</div>
<el-row class="mt-10" :gutter="20">
<el-col :span="10" style="background: #fafafa;padding:15px;">
<div style="height:250px;overflow-y:auto;">
<div class="tree-search mb-15">
<el-input
v-model="filterText"
placeholder="请输入内容"
clearable>
<!-- <i @click="findBoard" slot="suffix" class="el-input__icon el-icon-search"></i> -->
</el-input>
</div>
<el-tree
ref="tree"
default-expand-all
:filter-node-method="filterNode"
:data="dataTreeFile" :props="defaultProps" @node-click="handleNodeClick">
</el-tree>
</div>
</el-col>
<el-col :span="14">
<ul class="business-ul">
<li v-for="(item,index) in tableData" :key="index" class="k-flex k-space-between " @click="setParams(item)" >
<div class="article-name">
<span></span>
<span>{{item.boardName}}</span>
<span></span>
<span>{{item.subject}}</span></div>
<div>
<span class="" v-if="item.newsTime">{{item.newsTime.substring(5,10)}}</span></div>
</li>
</ul>
</el-col>
</el-row>
</el-col>
<!-- 法院业务右边轮播轮播图 -->
<el-col :span="11">
<el-carousel style="border-radius:8px;" height="280px" :interval="4000">
<el-carousel-item style="border-radius:8px;" v-for="(item,index) in tableDataAll.slice(0,3)" :key="item.id">
<div v-if="item.attInfoList && index<3" class="carousel-div" style="border-radius:8px;" @click="setParams(item)">
<el-image v-if="item.attInfoList[0] && item.attInfoList[0].downloadPath" :src="item.attInfoList[0].downloadPath" fit="contain" style="width:100%;height:100%;"></el-image>
<div class="carousel-intro" style="">
<span>&ensp;{{item.subject}}&ensp;</span>
</div>
</div>
</el-carousel-item>
</el-carousel>
</el-col>
</el-row>
<!--第三栏法院业务结束-->
<!--第四栏干警作品开始-->
<el-row class="mt-15" :gutter="20">
<el-col :span="14" >
<div class="zone-style">
<div class="k-flex-between-center">
<div class="k-flex k-align-center">
<img class="mr-5 gong-icon" style="" src="../../assets/home/fourth.png"/>
<div>干警作品</div>
</div>
<div @click="toMorelist(135)" style="font-size:12px;color: #999999;">
<span>MORE></span>
</div>
</div>
<el-row class="mt-15" :gutter="20">
<!--<el-col :span="8"></el-col>
<el-col :span="8"></el-col>
<el-col :span="8"></el-col>-->
<el-col style="border-radius:5px;" :span="8" v-for="item in policeOfficer.slice(0,5)" :key="item.id" >
<div v-if="item.attInfoList.length>0" class="imgs-div" style="width:100%;border-radius:8px;" @click="setParams(item)">
<el-image :src="item.attInfoList[0].downloadPath" fit="contain" style="width:100%;display:block;border-radius:5px;">
</el-image>
<div class="imgs-intro" style="width:100%;border-radius:0 0 5px 5px;">
<span>&ensp;{{item.subject}}&ensp;</span>
</div>
</div>
</el-col>
</el-row>
</div>
</el-col>
<el-col :span="10">
<div class="zone-style">
<div class="k-flex-between-center">
<div class="btns-switch">
<el-button @click.native="switchBtnPolice(0)" :class="['btn-item',{'sanjiao':activeItemPolice==0}]">视频点播</el-button>
<el-button @click.native="switchBtnPolice(1)" :class="['btn-item',{'sanjiao':activeItemPolice==1}]">全区速递</el-button>
</div>
<!-- 视频点播的id1965 -->
<div @click="toAllMorelist(activeItemPolice)" style="font-size:12px;color: #999999;">
<span>MORE></span>
</div>
</div>
<!--视频开始-->
<div class="mt-15" v-if="activeItemPolice==0">
<!--<div class="mt-10 mb-5 k-flex k-align-center">
<img class="mr-5 gong-icon" style="" src="../../assets/home/gonggao.png"></img>
<div class="gonggao-text">
<span >教育整顿进行时</span>
<span>鹿心社与自治区级政法机关领导班子成立交付给来访登记过了多久</span>
</div>
</div>-->
<div v-for="(item,index) in videoLiet" :key="'info2-'+index" class=" k-flex k-space-between top-list" @click="setParams(item)">
<div class="article-name">
<!--<span class="right-line">我为群众办实事</span>-->
<span >{{item.subject}}</span>
</div>
<div v-if="item.newsTime">{{item.newsTime.substring(5,10)}}</div>
</div>
</div>
<!--全部-->
<div v-if="activeItemPolice==1" class="mt-15">
<div v-for="(item,index) in whole" :key="index" class="k-flex k-space-between work-top-list" @click="setParams(item)">
<div class="article-name" style="">
<span >{{item.subject}}</span>
</div>
<div v-if="item.newsTime">{{item.newsTime.substring(5,10)}}</div>
</div>
</div>
</div>
</el-col>
</el-row >
<!--第四栏干警作品结束-->
<!--第五栏地区开始-->
<el-row class="mt-15" :gutter="20">
<el-col :span="22" :offset="1">
<el-row :gutter="20">
<el-col :span="4" >
<div class="k-flex k-center mt-10 info-tap">
<el-image style="width:35px;" :src="require('../../assets/home/bottom.png')"></el-image>
<div class="ml-10" style="font-weight:bold;font-size:15px;">
<div>
全国高院
</div>
<div style="text-align:right;">
网站群
</div>
</div>
<div class="line-div"></div>
</div>
</el-col>
<el-col :span="20">
<el-row :gutter="20">
<el-col style="text-align:center;" :span="2" v-for="(item,index) in placeList" :key="index">
<span style="font-size:10px;color:#444444;">{{item.name}}</span>
</el-col>
</el-row >
</el-col>
</el-row >
</el-col>
</el-row >
<!--第五栏地区结束-->
</el-col>
</el-row>
</div>
</template>
<script>
import {
getBoardTree,
topList,
newsFromBoard,
getSubLevelBoard,
getAllCourts,//获取全区法院
// searchForNews,//搜索新闻
getBoardAndSubAllNews,//获取栏目及子栏目全部新闻列表
getSelectedBoardTree,//获取指定栏目树
latestNewOfGXCourt,//获取全区速递
findBoard,//按栏目名搜索栏目
} from "@/api/homePage.js"
export default {
data() {
return {
filterText:'',//按栏目名搜索栏目
// boardNameSearch:'',//按栏目名搜索栏目
workActive:0,//工作信息选中
workList:[],//工作信息
allCourtsData:[],//全区法院
input:'',
activeItem:0,
activeItemPolice:0,
headlist:[
{
icon:require("../../assets/home/head/1.png"),
name:'绩效考评',
nickName:'Assessment'
},
{
icon:require("../../assets/home/head/2.png"),
name:'建党专栏',
nickName:'Special column'
},
{
icon:require("../../assets/home/head/3.png"),
name:'审判管理',
nickName:'Administer'
},
{
icon:require("../../assets/home/head/4.png"),
name:'论坛交流',
nickName:'Forum'
},
{
icon:require("../../assets/home/head/5.png"),
name:'案例与期刊',
nickName:'Case-Jourbal'
},
],
btnsList:[
{
icon:require("../../assets/home/btns/1-1.png"),
name:'综合门户',
},
{
icon:require("../../assets/home/btns/1.png"),
name:'公文汇总',
},
{
icon:require("../../assets/home/btns/2.png"),
name:'法律总库',
},
{
icon:require("../../assets/home/btns/3.png"),
name:'法律法规',
},
{
icon:require("../../assets/home/btns/4.png"),
name:'数据集中',
},
// {
// icon:require("../../assets/home/btns/5.png"),
// name:'公文汇总',
// },
{
icon:require("../../assets/home/btns/5.png"),
name:'即时通讯',
},
{
icon:require("../../assets/home/btns/6.png"),
name:'办公系统',
},
{
icon:require("../../assets/home/btns/7.png"),
name:'公文处理',
},
{
icon:require("../../assets/home/btns/8.png"),
name:'内部邮件',
},
{
icon:require("../../assets/home/btns/9.png"),
name:'院务公告',
},
{
icon:require("../../assets/home/btns/10.png"),
name:'手机短信',
},
{
icon:require("../../assets/home/btns/11.png"),
name:'工作流程',
},
{
icon:require("../../assets/home/btns/12.png"),
name:'文章简章',
},
{
icon:require("../../assets/home/btns/13.png"),
name:'人员查询',
},
{
icon:require("../../assets/home/btns/14.png"),
name:'科技法庭',
},
{
icon:require("../../assets/home/btns/15.png"),
name:'通讯录',
},
{
icon:require("../../assets/home/btns/16.png"),
name:'文书上网',
},
{
icon:require("../../assets/home/btns/17.png"),
name:'图书馆',
},
{
icon:require("../../assets/home/btns/18.png"),
name:'执行文书',
},
{
icon:require("../../assets/home/btns/19.png"),
name:'人民法院内网',
},
{
icon:require("../../assets/home/btns/20.png"),
name:'智能报表',
},
{
icon:require("../../assets/home/btns/21.png"),
name:'移动微学苑',
},
],
imagesBox:[
{id:0,idView:require("../../assets/pic.jpg")},
{id:1,idView:require("../../assets/1.png")},
{id:2,idView:require("../../assets/2.png")},
{id:3,idView:require("../../assets/3.png")},
{id:0,idView:require("../../assets/pic.jpg")},
{id:1,idView:require("../../assets/1.png")},
{id:2,idView:require("../../assets/2.png")},
{id:3,idView:require("../../assets/3.png")},
],
policeOfficer:[],
fiveNews: [],
topList:[],
headlineRotation:[],
topList2:[
{
name:'开展司法教助全集中发放活动尽量克服冠军费德勒冠军费德勒空军航空发货过来会考虑好看',
date:'09-23'
},
{
name:'开展司法教助全集中发放活动',
date:'09-23'
},
{
name:'开展司法教助全集中发放活动',
date:'09-23'
},
{
name:'开展司法教助全集中发放活动',
date:'09-23'
},
{
name:'开展司法教助全集中发放活动',
date:'09-23'
},
{
name:'开展司法教助全集中发放活动',
date:'09-23'
},
{
name:'开展司法教助全集中发放活动',
date:'09-23'
},
],
tableDataAll:[],//法院业务轮播图
tableData: [
// {
// date: '2016-05-02 12:00:00',
// name: '24',
// address: '【广西高院队就】广西高院队伍整顿简报官方首发的广东话合规合法的韩国和跟黑社会呵呵呵回复的环境'
// }, {
// date: '2016-05-04 12:00:00',
// name: '45',
// address: '上海市普陀区金沙江路 1517 弄还是个哈哈哈韩国发动机简洁大方'
// }, {
// date: '2016-05-01 12:00:00',
// name: '67',
// address: '上海市普陀区金沙江路 1519 弄好好说话'
// }, {
// date: '2016-05-03 12:00:00',
// name: '89',
// address: '上海市普陀区金沙江路 1516 弄合适的哈哈和'
// }
],
monthMeeting: [
{
month: "1月",
meeting: 0,
openFlag:true,
},
{
month: "2月",
meeting: 0,
openFlag:false,
},
{
month: "3月",
meeting: 0,
openFlag:false,
},
{
month: "4月",
meeting: 0,
openFlag:false,
},
{
month: "5月",
meeting: 0,
openFlag:false,
},
{
month: "6月",
meeting: 0,
openFlag:false,
},
{
month: "7月",
meeting: 0,
},
{
month: "8月",
meeting: 0,
openFlag:false,
},
{
month: "9月",
meeting: 0,
openFlag:false,
},
{
month: "10月",
meeting: 0,
openFlag:false,
},
{
month: "11月",
meeting: 0,
openFlag:false,
},
{
month: "12月",
meeting: 0,
openFlag:false,
},
],
groupList:[
{
name:'最高法',
},
{
name:'北京',
},
{
name:'天津',
},
{
name:'河北',
},
{
name:'山西',
},
{
name:'内蒙古',
},
{
name:'辽宁',
},
{
name:'吉林',
},
{
name:'上海',
},
{
name:'江苏',
},
{
name:'浙江',
},
{
name:'安徽',
},
{
name:'福建',
},
{
name:'黑龙江',
},
],
dataTreeFile: [],
defaultProps: {
children: 'children',
label: 'boardName'
},
placeList:[
{name:'最高法'},
{name:'北京'},
{name:'天津'},
{name:'河北'},
{name:'山西'},
{name:'内蒙古'},
{name:'辽宁'},
{name:'吉林'},
{name:'黑龙江'},
{name:'上海'},
{name:'江苏'},
{name:'浙江'},
{name:'安徽'},
{name:'福建'},
{name:'江西'},
{name:'山东'},
{name:'河南'},
{name:'湖北'},
{name:'湖南'},
{name:'广东'},
{name:'广西'},
{name:'海南'},
{name:'重庆'},
{name:'四川'},
{name:'贵州'},
{name:'云南'},
{name:'西藏'},
{name:'陕西'},
{name:'甘肃'},
{name:'青海'},
{name:'宁夏'},
{name:'新疆'},
{name:'新疆兵团'},
],
WorkButton:[{
boardName:'全部',
boardId:'1929',
}],
videoLiet:[],
whole:[],
}
},
watch: {
filterText(val) {
this.$refs.tree.filter(val);
}
},
created(){
this.getSubLevelBoardF()
this.topListFun()
this.initializationList();
// this.getAllCourts();//获取全区法院
},
methods: {
filterNode(value, data) {
console.log('value=',value);
console.log('data=',data);
if (!value) return true;
// return data.label.indexOf(value) !== -1;
return data.boardName.indexOf(value) !== -1;
},
// 按栏目名搜索栏目
findBoard(){
findBoard({boardName:this.boardNameSearch,deptId:32}).then(res=>{
if(res.success){
}
})
},
//获取全区法院
getAllCourts(){
getAllCourts().then(res=>{
if(res.success){
this.allCourtsData=res.data;
}
})
},
setParams(val){
this.$router.push({
path:'/detail',//跳转路由
query:{//参数对象
newsId:val.newsId
}
});
},
initializationList(){
// newsFromBoard({boardId:'1930',page:1,size:5}).then(res=>{
// this.tableData = res.data.newsList.records
// })
//获取法院业务初始加载全部信息 130
getBoardAndSubAllNews({boardId:130,page:1,size:10}).then(res=>{
if(res.success){
this.tableData=res.data.records;
this.tableDataAll=res.data.records;
}
})
newsFromBoard({boardId:'135',page:1,size:5}).then(res=>{
this.policeOfficer = res.data.newsList.records
})
// newsFromBoard({boardId:'3826',page:1,size:5}).then(res=>{
// 视频点播boardId是1965
newsFromBoard({boardId:'1965',page:1,size:5}).then(res=>{
this.videoLiet = res.data.newsList.records
})
// newsFromBoard({boardId:'130',page:1,size:5}).then(res=>{
// this.whole = res.data.newsList.records
// })
latestNewOfGXCourt({page:1,size:5}).then(res=>{
this.whole = res.data.records
})
},
newsFromBoard(val){
newsFromBoard({boardId:val.boardId,page:1,size:5}).then(res=>{
// this.topList = res.data.newsList.records
this.workList = res.data.newsList.records;//工作信息
})
},
// 工作信息切换
informationSelection(val,index){
console.log(val);
this.workActive=index;
if(val.boardName=='全部'){
this.getBoardAndSubAllNews(1929);//获取全部新闻 即工作信息大栏目1929id
}else{
this.newsFromBoard(val);
}
},
topListFun(){
topList({fyId:32,page:1,size:5}).then(res=>{
this.topList = res.data.records
this.headlineRotation = res.data.records
})
},
getSubLevelBoardF(){
// getSubLevelBoard({boardId:130}).then(res=>{
// console.log(res);
// this.dataTreeFile = res.data
// })
getSelectedBoardTree({boardId:130}).then(res=>{
console.log('获取指定栏目树=',res);
this.dataTreeFile = res.data
})
},
showHide(e){console.log(e);},
// changeFlag(i) {
// // console.log('ghjgjkjgl===', i)
// this.treeData[i].openFlag=!this.treeData[i].openFlag;
// this.$forceUpdate();//强制赋值
// },
showMeetingInfo(){},
switchBtn(i){
console.log('111===', i)
this.activeItem=i;
if (i==0) {
this.topListFun()
}else{
getSubLevelBoard({boardId:1929,}).then(res=>{
this.WorkButton = [{ boardName:'全部',boardId:1929}]
res.data.forEach(item => {
this.WorkButton.push(item)
});
})
// let val = {boardId:''}
// let val = {boardId:1929}
// this.newsFromBoard(val)
this.getBoardAndSubAllNews(1929);//获取全部的新闻的列表,工作信息1929
}
},
// 获取栏目及子栏目全部新闻列表
getBoardAndSubAllNews(boardId){
getBoardAndSubAllNews({boardId:boardId,page:1,size:10}).then(res=>{
if(res.success){
this.workList=res.data.records;
}
})
},
switchBtnPolice(i){
console.log('2222===', i)
this.activeItemPolice=i;
},
searchEvent(){},
handleNodeClick(data,node,obj){
console.log(data,node,obj);
newsFromBoard({boardId:data.boardId,page:1,size:5}).then(res=>{
this.tableData = res.data.newsList.records
})
},
// 跳转到全区速递和视频点播更多模块
toAllMorelist(activeItemPolice){
if(activeItemPolice==0){
// this.$router.push({
// path: "/list", //跳转路由
// query: {
// //参数对象
// boardId: 1965,//视频点播
// type:'menu'
// },
// });
this.$router.push({
path: "/zone", //跳转路由
query: {
//参数对象
type: 'vedio',
},
});
}else if(activeItemPolice==1){
this.$router.push({
path: "/zone", //跳转路由
query: {
//参数对象
type: 'all',
},
});
}
},
// 跳转到全区速递和视频点播更多模块
toTopMorelist(activeItem){
if(activeItem==0){
this.$router.push({
path: "/zone", //跳转路由
query: {
//参数对象
type: 'top',
},
});
}else if(activeItem==1){
this.$router.push({
path: "/list", //跳转路由工作信息
query: {
//参数对象
boardId: 1929,
type:'menu'
},
});
}
},
// 跳转到更所模块
toMorelist(boardId){
this.$router.push({
path: "/list", //跳转路由
query: {
//参数对象
boardId: boardId,
type:'menu'
},
});
},
},
}
</script>
<style lang="scss" scoped>
.el-col {
border-radius: 4px;
}
.bg-purple-dark {
background: #99a9bf;
}
.bg-purple {
background: #d3dce6;
}
.bg-purple-light {
background: #e5e9f2;
}
.grid-content {
border-radius: 4px;
min-height: 36px;
}
// 切换气泡按钮
.btns-switch .btn-item{
display:inline-block;
text-align:center;
border: 1px solid #ff756d;
border-radius: 5px;
color:#ff756d;
}
.btns-switch .sanjiao{
background:#D33237;
color:#fff;
position:relative;
}
.sanjiao:after {
position: absolute;
display: inline-block;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-top: 8px solid #D33237;
left:30px;
bottom: -8px;
content: '';
}
// 公告
.gong-icon{
width:13px;
height:13px;
}
.gonggao-text{
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
color:#FF756D;
font-family: PingFang SC, PingFang SC-Medium;
font-size:13px;
}
.partnerInfo ul li {
list-style: none;
line-height: 1;
}
.ul-list li{
border-radius:5px;
background:#fff;
padding:10px 10px;
font-size:12px;
}
.ul-list li .el-image{
width:30px;
height:30px;
}
.ul-list li:hover{
background:#D33237;
color:#fff;
}
// 按钮模块
.item-btns{
}
// 工作信息
.work-tab-list .tab-item:not(:nth-child(1)){
margin-top:5px;
}
.work-tab-list .tab-item{
padding:5px 0;
text-align:center;
background:#ccc;
cursor: pointer;
// font-size:10px;
font-size:10px !important;
border-radius:5px;
color:#fff;
}
.work-tab-list .tab-item:hover{
background:red;
}
.work-tab-list .tab-item-active{
background:red;
}
.work-top-list{
padding:5px 0;
font-size:10px;
}
.work-top-list:hover{
color:red;
}
.article-name{
width:85%;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.search-container{
width: 100%;
height: 500px;
background-image: url(../../assets/pic.jpg);
background-repeat: no-repeat;
background-size: 100% 100%;
}
.index-div{
position:absolute;
width: 100%;
border-radius: 5px;
top:30%;
}
.indexConFind{
// position:absolute;
width: 60%;
height: 180px;
background-color: rgba(5, 23, 17, 0.21);
margin: 0 auto;
// top:20%;
border-radius: 5px;
}
.seach-input{
width:60%;
}
.button-list{
margin-top:15px;
}
.button-list .el-button{
border-color:red;
font-size:12px;
color:black;
// width:11%;
}
::v-deep{
.button-list .el-button .el-icon-message{
color:red;
}
// 设置轮播图指示器大小
.el-carousel__button{
width:5px;
}
// .el-carousel__indicators--horizontal{
// right:0;
// }
}
.top-info{
margin:15px 0 5px 0;
border-bottom:2px solid #34bab2;
padding-bottom:5px;
}
.fist-text{
display:inline-block;
width:26px;
height:26px;
line-height:26px;
text-align:center;
font-size:15px;
color:#fff;
border-radius:50%;
background:#1a3784;
margin-right:3px;
}
// 轮播图
.carousel-div{
position:relative;
height:100%;
}
.carousel-intro{
position:absolute;
width:100%;
height:25px;
line-height:25px;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
background:rgba(5, 23, 17, 0.21);
color:#fff;
padding:0 5px;
font-size:12px;
left:0;
bottom:0;
}
.top-line{
padding:5px 15px;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
border-bottom:1px solid #ccc;
}
.right-line{
display:inline-block;
// width:20%;
overflow: hidden;
text-overflow: ellipsis;
padding-right:2px;
border-right:2px solid black;
margin-right:5px;
color:black;
}
.top-list{
padding:5px 0;
font-size:10px;
color:#999999;
}
.top-list:hover{
color:red;
}
.top-list :hover .right-line {
color:red !important;
}
.left-tab-list .tab-item:not(:nth-child(1)){
margin-top:5px;
}
.tab-item{
// margin: 10px 0;
margin: 7px 0;
padding:10px 0;
text-align:center;
background:#ccc;
cursor: pointer;
}
.left-tab-list .tab-item:hover{
background:red;
}
.right-list{
padding:5px 10px;
font-size:10px;
}
.job-btn-list .el-button{
width:100%;
color:#fff;
font-size:15px;
padding:10px
}
.job-btn-list .el-button+.el-button{
margin-left:0;
}
.job-btn-list .el-button .button-inner{
width:100%;
background:red;
padding:8px 0;
// padding-left:40%;
letter-spacing:10px;
}
.job-btn-list .el-button .el-image{
width:20px;
height:20px;
margin-right:10px;
margin-left:15%;
}
.business-ul{
margin:0;
margin-top:10px;
width:100%;
// white-space:nowrap;
// overflow:hidden;
// text-overflow:ellipsis;
list-style:none;
margin:0;
padding:0;
}
.business-ul li{
width:100%;
font-size:13px;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.business-ul li:hover {
color:red;
}
// .business-ul li .el-link{
// display:inline-block;
// text-decoration:none;
// width:100%;
// white-space:nowrap;
// overflow:hidden;
// text-overflow:ellipsis;
// }
// .business-ul li .el-link:hover {
// text-decoration:none;
// color:red;
// }
// .business-ul li:hover .el-link{
// text-decoration:none;
// }
.business-ul li+li{
margin-top:5px;
}
// 树形菜单开始
.search-box {
display: flex;
justify-content: flex-start;
align-items: center;
margin-bottom: 25px;
}
.left-box {
height: 100%;
display: flex;
flex-direction: column;
align-items: flex-start;
}
.meeting-item {
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: center;
}
.collect-box {
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
width: 100%;
margin-right: 15px;
.collect {
width: 12%;
img {
width: 100%;
}
}
}
.file {
&-container {
width: 100%;
}
&-box {
margin-left: 5%;
padding-left: 15%;
height: 100%;
display: flex;
flex-direction: column;
border-left: 1px dashed #6e6e6e;
}
&-title {
width: 90%;
height: 30px;
// color: #fff;
font-size:12px;
display: flex;
justify-content: flex-start;
align-items: center;
img {
width: 15%;
margin-right: 7px;
}
}
&-item {
height: 50px;
border-left: 1px dashed #6e6e6e;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
color: #6e6e6e;
.line-row {
width: 15%;
border-top: 1px dashed #6e6e6e;
}
.item-box {
display: flex;
align-items: center;
line-height: 50px;
padding: 0 15px;
border-radius: 5px;
font-size:12px;
img {
margin-right: 5px;
width:15%;
}
&-blue {
background-color: #304d79;
}
}
.item-box:hover {
background-color: #304d79;
cursor: default;
}
&:last-child {
margin-bottom: 40px;
}
}
}
.detail {
&-container {
overflow-y: scroll;
height: 55vh;
padding: 5px 10px;
}
&-content {
height: 60vh;
}
}
::v-deep {
.resourceSearch-btn {
background: none;
font-weight: bolder;
span {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
}
.search {
color: #fff;
border: none;
background: none;
background-color: #456e94;
font-size: 15px;
img {
margin-right: 5px;
}
}
.check {
color: #456e94;
img {
margin-right: 5px;
}
}
.el-input__inner {
background: none;
border-color: #363636;
height: 45px;
}
}
// 树形菜单结束
// 图片墙
.imgs-div{
position:relative;
height:100%;
}
.imgs-div{
margin-bottom:10px;
}
.imgs-intro{
position:absolute;
// width:100%;
height:25px;
line-height:25px;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
// background:rgba(5, 23, 17, 0.21);
background:#ccc;
color:#fff;
// padding:0 5px;
font-size:12px;
left:0;
bottom:0;
}
.group-list{
border:1px solid #34bab2;
padding:15px;
}
// 网站群
.group-ul{
margin:0;
padding:0;
list-style:none;
}
.group-ul li{
float:left;
// padding:0 10px;
width:60px;
margin-right:6px;
text-align:center;
font-size:12px;
margin-bottom:10px;
}
// 树形菜单图标start-----------------------
.el-tree /deep/ .el-tree-node__expand-icon.expanded
{
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
/*//有子节点 且未展开*/
.el-tree /deep/ .el-icon-caret-right:before
{
background: url("../../assets/wjjg.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
/*//有子节点 且已展开*/
.el-tree /deep/ .el-tree-node__expand-icon.expanded.el-icon-caret-right:before
{
background: url("../../assets/wjjk.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
/*//没有子节点*/
.el-tree /deep/ .el-tree-node__expand-icon.is-leaf::before
{
background: url("../../assets/wj.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
// 树形菜单图标end-----------------------
::v-deep{
.tree-search{
margin:0 15px;
.el-input__inner{
height:30px;
line-height:30px;
}
}
}
.zone-style{
background-color:#fff;
padding:15px 15px;
border-radius:5px;
box-shadow: -5px 0px 20px 5px rgba(0,0,0,0.05);
}
.out-zone-style{
background-color:#fff;
margin-left:0!important;
margin-right:0!important;
padding:15px;
border-radius:5px;
box-shadow: -5px 0px 20px 5px rgba(0,0,0,0.05);
}
.first-zone-style{
margin-left:0!important;
margin-right:0!important;
// padding:15px;
}
.info-tap{
position:relative;
}
.line-div{
width: 1px;
height: 30px;
background: #ccc;
position: absolute;
right: -1px;
top: 10px;
}
</style>
<template>
<div class="head">
<!-- <div class="title">
<img :src="require('@/assets/images/logo.png')" alt="" class="logo" />
<a class="title-text">广西法院政务管理系统</a>
<a class="title-setup">日程安排</a>
</div>
<div class="text-detail">
<span class="ml-15">{{'部门:'+userInfo.dept.name}}</span>
<span class="ml-15">{{'姓名:'+userInfo.nickName}}</span>
</div> -->
<!-- <el-button type="text">个人助理</el-button>
<el-button type="text">公文管理</el-button>
<el-button type="text" >公务邮件</el-button>
<el-button type="text" >信息资讯</el-button>
<el-button type="text" >行政管理</el-button>
<el-button type="text">会议管理</el-button>
<el-button type="text">督查督办</el-button>
<el-button type="text">任务管理</el-button>
<el-button type="text">快速业务</el-button>
<el-button type="text">信息报送</el-button> -->
<div class="head-btns">
<el-link v-for="(item,index) in linkList" :key="index" :underline="false">{{item.name}}</el-link>
<!-- <el-link :underline="false">主要链接</el-link>
<el-link :underline="false">成功链接</el-link>
<el-link :underline="false">警告链接</el-link>
<el-link :underline="false">危险链接</el-link>
<el-link :underline="false">信息链接</el-link> -->
</div>
<div class="k-flex k-align-center" style="color:#fff;">
<el-image style="display:block;" class="out-icon" :src="require('../../assets/out.png')"></el-image>
<div>退出</div>
</div>
</div>
</template>
<script>
import { getUserInfo } from "@/api/login";
export default {
data() {
return {
linkList:[
{
name:'个人助理'
},
{
name:'公文管理'
},
{
name:'公务邮件'
},
{
name:'信息资讯'
},
{
name:'行政管理'
},
{
name:'会议管理'
},
{
name:'督查督办'
},
{
name:'任务管理'
},
{
name:'快速业务'
},
{
name:'信息报送'
},
],
userInfo: {
dept:{}
}
}
},
methods: {
getUserInfo() {
getUserInfo().then(res=>{
this.userInfo = res.user
})
}
},
created () {
this.getUserInfo();
},
}
</script>
<style lang="scss" scoped>
// .head-btns{
// background:#333;
// }
.out-icon{
width:30px;
height:30px;
}
::v-deep{
.el-link.el-link--default{
padding: 0 25px;
color: #fff;
font-size: 16px;
}
// .el-link.el-link--default{
// padding: 0 25px;
// color: #fff;
// font-size: 16px;
// }
}
.head {
height: 60px;
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
border-color: rgb(187, 187, 187);
}
.logo {
width: 30px;
height: 34px;
}
.title {
display: flex;
align-items: center;
height: 100%;
&-text {
font-size: 20px;
color: #ffffff;
margin-left: 14px;
font-weight: bold;
}
&-setup {
font-size: 20px;
margin-left: 15px;
color: #ffffff;
padding: 0 15px;
border-left: 1px solid #fff;
font-weight: bold;
}
}
.text-detail {
color: #fff;
font-size: 12px;
font-family: SourceHanSansSC;
}
</style>
<template> <template>
<div> <div class="k-flex-between-center">
<el-row> <div class="k-flex k-align-center">
<el-col class="my-menu" :span="18" :offset="3"> <el-menu class="el-menu-demo" background-color="transparent" mode="horizontal" text-color="#999" active-text-color="#fff" :default-active="activePath" router>
<div class="nav k-flex-between-center"> <el-menu-item index="/doc">
<div class="nav-a"> <span>我的文档</span>
<ul class="nav-a-ul"> </el-menu-item>
<li <el-menu-item index="/group">
class="nav-a-li" <span>组织协作</span>
:class="classA == index ? 'main-active' : ''" </el-menu-item>
v-for="(item, index) in routesList" <el-menu-item index="/mine">
:key="index" <span>我的协作</span>
> </el-menu-item>
<el-link <!-- <el-menu-item index="/search">
@click.native="menuRouterClick(item, index)" <span>指派工作</span>
class="nav-a-text" </el-menu-item> -->
:underline="false" <!-- <el-menu-item >
>{{ item.meta.title }}</el-link <el-button size='mini'>上传1</el-button>
> <el-button size='mini'>上传2</el-button>
<div <el-button size='mini'>上传1</el-button>
v-if="item.children && item.children.length > 0" <el-button size='mini'>上传2</el-button>
class="submenu-container" </el-menu-item> -->
> </el-menu>
<ul class="menu_ul" :class="{ active: index === isShow }"> <div >
<li <el-button size='mini' type="warning">上传</el-button>
class="menu_li" <el-button size='mini' type="success">新建文件夹</el-button>
v-for="(nav, index) in item.children" <el-button size='mini' type="primary">日志查看</el-button>
:class="classB == nav ? 'active' : ''" <el-button size='mini' type="danger">回收站</el-button>
@click.stop="menuselected(item, nav)" </div>
:key="index" </div>
> <div class="k-flex seach-input k-align-center" >
<el-link <el-input v-model="searchSubject" placeholder="请输入搜索内容" clearable>
class="menu_ul_text" <i
:underline="false" @click="searchEvent"
:class="{ active: nav.path == linkClick }" slot="suffix"
>{{ nav.meta.title }}</el-link class="el-input__icon el-icon-search"
> ></i>
</li> </el-input>
</ul> </div>
</div> </div>
<div
v-if="item.name == 'allCourt'"
class="submenu-container-first"
>
<ul class="menu_ul" :class="{ active: index === isShow }">
<li
class="menu_li_court"
v-for="(item, index) in allCourtsData"
:class="classB == item ? 'active' : ''"
@click.stop="menuselected(item)"
:key="index"
>
<span class="menu_ul_text">{{ item.mc }}</span>
<div
v-if="item.children && item.children.length > 0"
class="submenu-container-court"
>
<ul
class="menu_ul"
:class="{ active: index === isShow }"
>
<li
class="menu_li_court"
v-for="(nav, index) in item.children"
:class="classB == nav ? 'active' : ''"
@click.stop="menuselected(item.nav)"
:key="index"
>
<span class="menu_ul_text">{{ nav.mc }}</span>
</li>
</ul>
</div>
</li>
</ul>
</div>
</li>
</ul>
</div>
<div class="k-flex seach-input k-align-center" style="width: 180px">
<el-input v-model="searchSubject" placeholder="请输入内容" clearable>
<i
@click="searchEvent"
slot="suffix"
class="el-input__icon el-icon-search"
></i>
</el-input>
</div>
</div>
</el-col>
</el-row>
<!-- <div class="nav">
<div class="nav-a">
<ul class="nav-a-ul">
<li class="nav-a-li" :class="classA == index ? 'active' : '' " @click="selected(index)" v-for="(item,index) in configNav" :key="index">
<div v-if="item.subItems" class="submenu-container" >
<ul class="menu_ul" :class="{'active' :index===isShow}">
<li class="menu_li" v-for = "(nav,index) in item.subItems" :class="classB == nav ? 'active' : '' " @click="menuselected(nav)" :key="index">
<router-link class="menu_ul_text" :to="nav.link" :class="{'active':nav.link == linkClick}" @click = "treeNavSwitch(nav)">{{nav.text}}</router-link>
</li>
</ul>
</div>
</li>
</ul>
</div>
</div> -->
<!-- :default-active="this.$router.path" @select="handleSelect" -->
<!-- <div>
<ul class="nav-list">
<li class="nav-li">
1
</li>
</ul>
</div> -->
<!-- <div>
<ul class="nav-list">
<items v-for="(model, index) in list" :model="model" :key="index"></items>
</ul>
</div> -->
<el-row>
<el-col class="my-menu k-flex-between-center" :span="18" :offset="3">
<!-- <el-menu
:default-active="$route.path"
exact
class="el-menu-demo"
mode="horizontal"
active-text-color="#ffd04b"
background-color="#D33237"
text-color="#fff"
router
> -->
<!-- 遍历菜单 -->
<!-- <template v-for="item in routesList"> -->
<!-- 含有子菜单 -->
<!-- <template v-if="item.children"> -->
<!-- 第一层 含有子菜单菜单 -->
<!-- <el-submenu :index="item.boardId" :key="item.boardId">
<template slot="title">
<span slot="title">{{ item.meta.title }}</span>
</template>
<sideItem v-for="(v,i) in item.children" :key="i" :item="v"/>
</el-submenu>
</template> -->
<!-- 第一层 不含子菜单 -->
<!-- <template v-else>
<el-menu-item :index="item.boardId" :key="item.boardId">
<span slot="title">{{ item.meta.title }}</span>
</el-menu-item>
</template>
</template>
<el-menu-item @click="openManage" >信息发布系统</el-menu-item>
</el-menu> -->
<!-- <el-menu
:default-active="$route.path"
class="el-menu-demo"
mode="horizontal"
active-text-color="#ffd04b"
background-color="#D33237"
text-color="#fff"
router>
<el-menu-item index="/homePage">首页</el-menu-item>
<el-menu-item index="/news" >法院新闻00</el-menu-item>
<el-submenu index="2" >
<template slot="title">法院新闻</template>
<el-menu-item index="/news">法院新闻</el-menu-item>
<el-menu-item index="2-2">选项2</el-menu-item>
<el-menu-item index="2-3">选项3</el-menu-item>
<el-submenu index="2-4">
<template slot="title">选项4</template>
<el-menu-item index="2-4-1">选项1</el-menu-item>
<el-menu-item index="2-4-2">选项2</el-menu-item>
<el-menu-item index="2-4-3">选项3</el-menu-item>
</el-submenu>
</el-submenu>
<el-submenu mode="horizontal" style="" index="list" id="myPopDown">
<template slot="title">工作信息</template>
<el-menu-item index="/list">列表1</el-menu-item>
<el-menu-item index="/detail">详情</el-menu-item>
<el-menu-item index="/show">列表2</el-menu-item>
</el-submenu>
<el-submenu index="4">
<template slot="title">法院业务</template>
<el-menu-item index="4-1">选项1</el-menu-item>
<el-menu-item index="4-2">选项2</el-menu-item>
<el-menu-item index="4-3">选项3</el-menu-item>
</el-submenu>
<el-submenu index="5">
<template slot="title">干警作品</template>
<el-menu-item index="5-1">选项1</el-menu-item>
<el-menu-item index="5-2">选项2</el-menu-item>
<el-menu-item index="5-3">选项3</el-menu-item>
</el-submenu>
<el-submenu index="/news">
<template slot="title">娱乐</template>
<el-menu-item index="6-1">选项1</el-menu-item>
<el-menu-item index="6-2">选项2</el-menu-item>
<el-menu-item index="6-3">选项3</el-menu-item>
</el-submenu>
<el-submenu index="7">
<template slot="title">全区法院</template>
<el-menu-item index="7-1">选项1</el-menu-item>
<el-menu-item index="7-2">选项2</el-menu-item>
<el-menu-item index="7-3">选项3</el-menu-item>
</el-submenu>
<el-menu-item @click="openManage" >信息发布系统</el-menu-item>
</el-menu> -->
<!-- <div class="k-flex seach-input k-align-center">
<el-input
placeholder="请输入内容"
clearable>
<i @click="searchEvent" slot="suffix" class="el-input__icon el-icon-search"></i>
</el-input>
</div> -->
</el-col>
</el-row>
</div>
</template> </template>
<script> <script>
import { mapGetters } from "vuex";
import sideItem from "./sideItem.vue";
import items from "./items.vue";
import {
getAllCourts, //获取全区法院
getSubLevelBoard, //获取子栏目
searchForNews,//搜索新闻
} from "@/api/homePage.js";
export default { export default {
components: { sideItem, items }, data() {
data() { return {
return { activePath: '/doc',
searchSubject:'',//搜索内容 searchSubject:'',
allCourtsData: [], //全区法院
childFlag: false,
activeIndex: "/homePage",
classA: 0,
classB: 0,
isShow: 0,
linkClick: "",
routesList: [
{
name: "homePage",
path: "/homePage",
meta: { title: "首页" },
},
{
name: "news",
path: "/news",
meta: { title: "法院新闻" },
children:[
{
name: "top",
path:'',
boardId:'',
type:'top',
meta:{title:'今日头条',},
},
{
name: "all",
path:'',
type:'all',
meta:{title:'全区速递',},
},
{
name: "vedio",
path:'',
boardId:1965,
type:'vedio',
meta:{title:'视频点播',},
},
]
// children:[
// {
// name: "news",
// path:'/news',
// boardId:129,
// meta:{title:'法院新闻',},
// },
// {
// name: "list",
// path:'/list',
// meta:{title:'列表1',},
// children:[
// {
// name: "子---",
// path:'3-1',
// meta:{title:'子-3-2',},
// },
// {
// name: "",
// path:'',
// meta:{title:'列表2',},
// },
// ]
// },
// {
// name: "show",
// path:'/show',
// meta:{title:'列表2',},
// },
// ]
},
{
name: "job",
path: "",
boardId: 1929,
meta: { title: "工作信息" },
},
{
name: "business",
path: "",
boardId: 130,
meta: { title: "法院业务" },
},
{
name: "work",
path: "",
boardId: 135,
meta: { title: "干警作品" },
},
{
name: "fun",
path: "",
meta: { title: "娱乐" },
// children: [
// {
// name: "fun1",
// path: "",
// meta: { title: "休闲娱乐" },
// },
// {
// name: "fun2",
// path: "",
// meta: { title: "论坛交流" },
// },
// ],
},
{
name: "allCourt",
path: "",
meta: { title: "全区法院" },
},
{
name: "manage",
path: "/manage",
meta: { title: "信息发布系统" },
},
],
};
},
computed: {
// ...mapGetters(["get_routes"]),
...mapGetters(["user"]),
},
created() {
this.getAllCourts(); //获取全区法院
// this.getSubLevelBoard(1, 129); //法院新闻
this.getSubLevelBoard(2, 1929); //工作信息
this.getSubLevelBoard(3, 130); //法院业务
this.getSubLevelBoard(4, 135); //干警作品
this.getSubLevelBoard(2, 130); //法院业务
},
methods: {
//1、点击一级导航
menuRouterClick(item, index) {
console.log("menuRouterClick-index==", index);
console.log("menuRouterClick-item==", item);
console.log('this.routesList==',this.routesList);
// this.classA = index;
console.log("this.classA==", this.classA);
this.classA = index;
item=this.routesList[this.classA];
// return;
if (item.name == "manage") {
// var url=process.env.VUE_APP_LOGIN_API+'/manage'
// window.open(url)
// window.open("/#/manage");
var userInfo=sessionStorage.getItem('userInfo');
var publishFlag=sessionStorage.getItem('publishFlag');
console.log('user==',userInfo);
if(!userInfo){
this.$message({
message:'请先登录!',
type:'error',
});
return;
}else{
console.log('publishFlag=',publishFlag);
if(publishFlag){
this.$router.push({
path: item.path, //跳转路由
});
}else{
this.$message({
message:'您的账号没有权限!',
type:'error',
});
return;
}
}
}else if(item.name == "homePage" || item.name == "news"){
this.$router.push({
path: item.path, //跳转路由
});
}else if(item.name == "fun"){
this.$message({
message:'维护中...',
type:'error',
duration:1000
});
return;
}else{
this.$router.push({
path: "/list", //跳转路由
query: {
//参数对象
boardId: item.boardId,
type:'menu'
},
});
}
},
// 2、点击二级子栏目--跳转到列表
menuselected(item, subItem) {
// alert('item');
console.log("点击子菜单1==", item);
console.log("点击子菜单2==", subItem);
console.log('this.routesList==',this.routesList);
for (var i = 0; i < this.routesList.length; i++) {
if (this.routesList[i].name == item.name) {
this.classA = i;
}
}
// if(item.name="fun"){
// this.$message({
// message:'开发中...',
// type:'error'
// });
// return;
// }
if(subItem.name=='top' || subItem.name=='all' || subItem.name=='vedio'){
this.$router.push({
path: "/zone", //跳转路由
query: {
//参数对象
boardId: subItem.boardId,
type:subItem.type
},
});
}else{
this.$router.push({
path: "/list", //跳转路由
query: {
//参数对象
boardId: subItem.boardId,
type:'sub'
},
});
}
},
// treeNavSwitch(){},
//获取全区法院
getAllCourts() {
getAllCourts().then((res) => {
if (res.success) {
this.allCourtsData = res.data;
}
});
},
//获取子栏目
getSubLevelBoard(index, boardId) {
let params = {};
// params.boardId='1929'
params.boardId = boardId;
getSubLevelBoard(JSON.stringify(params)).then((res) => {
if (res.success) {
// this.allCourtsData=res.data;
var arr = [];
res.data.forEach((item) => {
var obj = {};
obj.boardId = item.boardId;
obj.meta = {};
obj.meta.title = item.boardName;
obj.path = "/list";
obj.name = item.boardId;
arr.push(obj);
});
this.routesList[index].children = arr;
this.$forceUpdate();
console.log("工作信息子菜单==", this.routesList);
} }
}); }
},
// handleSelect(key,keyPath){
// console.log('key==',key);
// console.log('keyPath==',keyPath);
// if(key=='/manage'){
// window.open('/#/manage')
// }
// },
openManage() {
window.open("/#/manage");
},
selected() {},
// menuselected(){},
searchEvent() {
console.log("搜索");
// searchForNews().then(res=>{
// if(res.success){
// this
// }
// });
this.$router.push({
path: "/search", //跳转路由
query: {
//参数对象
subject: this.searchSubject,
},
});
},
toNews() {
console.log(4556);
this.$router.push({ name: "news" });
},
},
};
</script>
<style lang="scss" scoped>
.my-menu {
background: #d33237;
border-radius: 7px;
padding: 0 15px;
}
::v-deep {
.el-menu {
border-radius: 7px 0 0 7px;
}
.el-menu-item {
font-size: 13px;
padding: 0 15px;
}
.el-submenu__title {
padding: 0 15px;
}
.el-menu--horizontal > .el-submenu .el-submenu__title {
font-size: 13px;
}
}
// $childs: false;
//横向展示需要样式修改
.el-menu--horizontal .el-menu-item {
// float: left;
// float: if($childs, left, none);
// float: none;
height: 60px;
line-height: 60px;
margin: 0;
border-bottom: 2px solid transparent;
border-bottom-width: 2px;
border-bottom-style: solid;
border-bottom-color: transparent;
color: #909399;
} }
</script>
.el-submenu__icon-arrow { <style lang="scss" scoped>
position: static; // 路由导航
vertical-align: middle; .el-menu--horizontal>.el-menu-item {
margin-left: 8px; background-color: #333333;
margin-top: -3px; color: #fff;
color: #fff;
} }
.el-menu--horizontal .el-submenu.is-active .el-submenu__title { .el-menu--horizontal>.el-menu-item {
height: 60px; border-bottom: none;
line-height: 60px; background: #333333;
border-bottom: 2px solid #409eff;
color: #303133;
} }
// 自己画的横向导航 .el-menu--horizontal>.el-menu-item {
ul, height: 45px;
li { line-height: 45px;
padding: 0; margin-right: 10px;
margin: 0; border-radius: 5px 5px 0 0;
} font-size: 12px;
.nav { font-weight: bold;
width: 100%;
height: auto;
margin: 0px auto;
border-bottom: none;
line-height: 55px;
box-sizing: border-box;
}
.nav-a {
cursor: pointer;
letter-spacing: 4px;
position: relative;
text-align: center;
}
.nav-a-ul {
list-style: none;
line-height: 55px;
}
.nav-a-li {
display: inline-block;
margin: 0 16px;
}
.nav-a-text {
font-size: 15px;
color: #fff;
font-weight: bold;
text-decoration: none;
}
.menu_ul {
list-style: none;
background: #fff;
border-radius: 3px;
z-index: 999;
}
.menu_li {
position: relative;
float: left;
height: 30px;
line-height: 30px;
padding: 0 10px;
margin-bottom: 10px;
}
.menu_li::after {
content: "";
position: absolute;
width: 2px;
height: 12px;
background: #666;
right: 0;
top: 30%;
}
.menu_ul_text {
font-size: 14px;
color: #666;
letter-spacing: 0;
line-height: 30px;
height: 30px;
text-decoration: none;
// padding-left: 6px;
}
.submenu-container {
display: none;
width: 100%;
position: absolute;
border-radius: 5px;
padding: 15px;
bottom: -65;
}
.nav-a-li:hover .submenu-container {
display: block;
width: 100%;
max-width: 350px;
z-index: 19;
background: #fff;
box-shadow: -5px 0px 20px 5px rgba(0, 0, 0, 0.05);
}
.nav-a-li:hover .nav-a-text {
color: #ffd04b;
}
.main-active {
border-bottom: 2px solid #ffd04b;
}
.main-active .nav-a-text {
color: #ffd04b!important;
} }
.menu_ul_text:hover { .el-menu--horizontal>.el-menu-item.is-active {
color: #2589ff; background-color: #333333!important;
}
.menu_li.active .menu_ul_text {
color: #2589ff;
} }
.submenu-container-first { .el-menu.el-menu--horizontal {
display: none; border-bottom: none;
position: absolute;
width: 170px;
border-radius: 5px;
bottom: -65;
z-index:19;
}
.nav-a-li:hover .submenu-container-first {
display: block;
// width: 100%;
// max-width:350px;
z-index: 20;
background: #fff;
box-shadow: -5px 0px 20px 5px rgba(0, 0, 0, 0.05);
padding: 5px 0;
}
.menu_li_court {
position: relative;
height: 40px;
line-height: 40px;
padding: 0 5px;
}
.submenu-container-court {
display: none;
width: 100%;
position: absolute;
border-radius: 5px;
// padding:15px;
top: 0;
right: -100%;
}
.menu_li_court:hover .submenu-container-court {
display: block;
width: 100%;
//max-width:350px;
z-index: 19;
background: #fff;
box-shadow: -5px 0px 20px 5px rgba(0, 0, 0, 0.05);
}
.nav-a-li:hover .nav-a-text {
color: #ffd04b;
} }
// 搜索 .seach-input{
.search-container { width: 30%!important;;
width: 100%;
height: 500px;
background-image: url('../../assets/pic.jpg');
background-repeat: no-repeat;
background-size: 100% 100%;
}
.index-div {
position: absolute;
width: 100%;
border-radius: 5px;
top: 30%;
} }
.indexConFind {
width: 60%;
height: 180px;
background-color: rgba(5, 23, 17, 0.21);
margin: 0 auto;
border-radius: 5px;
}
.seach-input {
width: 60%;
}
</style> </style>
<template>
<div >
<el-row >
<el-col :span="18" :offset="3">
<!--<el-row class="top-info" style="">
<span class="fist-text" style=""></span>
<span>作信息</span>
<div style="float:right;">
<span>当前位置:</span>
<el-breadcrumb style="display:inline-block;" separator-class="el-icon-arrow-right">
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
<el-breadcrumb-item>活动管理</el-breadcrumb-item>
</el-breadcrumb>
</div>
</el-row>-->
<el-row class="mt-20 zone-style" :gutter="20" >
<!--左边栏目开始-->
<el-col :span="5" class="border-zone">
<div class="list-container" style="">
<!-- <a :href="process.env.VUE_APP_LOGIN_API">点击</a> -->
<div class="list-title mb-10" @click="loginEvent">选择栏目</div>
<!--<ul class="type-list">
<li><a href="#">最高法通报</a></li>
<li><a href="#">最高人民法院简报</a></li>
</ul>-->
<el-tree :data="dataTreeFile" :props="defaultProps" @node-click="handleNodeClick"></el-tree>
</div>
</el-col>
<!--左边栏目结束-->
<el-col :span="19">
<div v-if="!curBoardId==''">
<div >
<!--<div style="">
<span>当前位置:</span>
<el-breadcrumb style="display:inline-block;" separator-class="el-icon-arrow-right">
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
<el-breadcrumb-item>活动管理</el-breadcrumb-item>
</el-breadcrumb>
</div>-->
<!--<el-tabs v-model="activeName" type="card" @tab-click="handleClick">
<el-tab-pane label="用户管理" name="first">
<i class="el-icon-date"></i>
用户管理
</el-tab-pane>
<el-tab-pane label="配置管理" name="second">配置管理</el-tab-pane>
<el-tab-pane label="角色管理" name="third">角色管理</el-tab-pane>
<el-tab-pane label="定时任务补偿" name="fourth">定时任务补偿</el-tab-pane>
</el-tabs>-->
<el-tabs type="border-card" v-model="activeName" @tab-click="handleTabClick">
<el-tab-pane name="first">
<span slot="label"><i class="el-icon-date"></i> 管理列表</span>
<el-table
border
ref="multipleTable"
:data="manageList"
style="width: 100%"
height="550"
@selection-change="handleSelectionChange1">
<el-table-column
type="selection"
width="55">
</el-table-column>
<el-table-column
label="标题"
prop="subject"
>
</el-table-column>
<el-table-column
prop="boardName"
label="所属栏目"
>
</el-table-column>
<el-table-column
prop="provider"
label="责任编辑"
>
</el-table-column>
<el-table-column
prop="newsTime"
label="创建/修改时间"
>
</el-table-column>
<el-table-column
prop="clickCount"
label="点击次数"
width="50">
</el-table-column>
<el-table-column
prop="commentCount"
label="评论(条)"
width="50">
</el-table-column>
<el-table-column
prop="adviceCount"
label="建议(条)"
width="50">
</el-table-column>
<el-table-column
prop="publish"
label="审核发布状态"
>
<template slot-scope="scope">
<el-tag :type="scope.row.publish | statusFilters">
{{scope.row.publish | getStatus}}
</el-tag>
</template>
</el-table-column>
<el-table-column
prop=""
label="报送状态"
>
<!--<template slot-scope="scope">
<el-tag :type="scope.row.status | statusFilters">
{{scope.row.status?'正常':'禁用'}}
</el-tag>
</template>-->
</el-table-column>
<el-table-column
label="操作"
>
<template slot-scope="scope">
<el-button
@click="logDetailEvent(scope.row.newsId)"
type="text"
size="mini">
日志
</el-button>
<el-button
@click="handleEdit(scope.row.newsId)"
type="text"
size="mini">
修改
</el-button>
<el-button
@click="handleDelete(scope.row.newsId)"
type="text"
size="mini">
删除
</el-button>
<el-button
@click="commentEvent(scope.row.newsId)"
type="text"
size="mini">
评论
</el-button>
</template>
</el-table-column>
</el-table>
<el-row class="mt-10">
<el-button type="primary" size="mini" @click="upLetterEvent">提交短信审批</el-button>
</el-row>
<div style="margin-top:10px;">
<el-pagination
prev-text="上一页"
next-text="下一页"
layout="total,sizes,prev, pager, next,jumper"
:total="pageInfo.total"
:page-size="pageInfo.size"
:current-page="pageInfo.page"
@current-change="pageChange"
@size-change="sizeChange"
/>
</div>
</el-tab-pane>
<el-tab-pane name="second">
<span slot="label"><i class="el-icon-date"></i>添加信息</span>
<el-form ref="form" :model="newsForm" label-width="120px">
<el-form-item label="格式" >
<el-select v-model="newsForm.geshi" placeholder="请选择格式">
<el-option label="普通格式" value="普通格式"></el-option>
<!--<el-option label="区域二" value="beijing"></el-option>-->
</el-select>
<span class="ml-15">提示:在word文档中编辑好后,复制黏贴到编辑框</span>
</el-form-item>
<el-form-item label="所属栏目">
<el-row >
<el-col :span="6">
<!-- 工作信息->最高人民法院简报 -->
<span style="color:red;">{{newsForm.boardName}}</span>
</el-col>
<!-- <el-col :span="18">
<el-button>选择</el-button>
</el-col> -->
</el-row>
<el-row>
<span class="mr-15">发送到教育整顿:</span>
<!--<el-radio-group v-model="newsForm.sendToBoards">
<el-radio :label="'0'">无</el-radio>
<el-radio :label="'4263'">政治教育</el-radio>
<el-radio :label="'4264'">警示教育和英模教育</el-radio>
</el-radio-group>-->
<el-checkbox-group v-model="newsForm.sendToBoards">
<el-checkbox :label="'0'"></el-checkbox>
<el-checkbox :label="'4263'">政治教育</el-checkbox>
<el-checkbox :label="'4264'" >警示教育和英模教育</el-checkbox>
</el-checkbox-group>
</el-row>
</el-form-item>
<!--<el-form-item label="活动名称">
<el-input v-model="form.name"></el-input>
</el-form-item>
<el-form-item label="活动区域">
<el-select v-model="form.region" placeholder="请选择活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="活动时间">
<el-col :span="11">
<el-date-picker type="date" placeholder="选择日期" v-model="form.date1" style="width: 100%;"></el-date-picker>
</el-col>
<el-col class="line" :span="2">-</el-col>
<el-col :span="11">
<el-time-picker placeholder="选择时间" v-model="form.date2" style="width: 100%;"></el-time-picker>
</el-col>
</el-form-item>-->
<el-form-item label="标题">
<el-input v-model="newsForm.subject"></el-input>
</el-form-item>
<!-- <el-form-item label="附件">
<el-upload
class="upload-demo"
ref="noticeUpload"
multiple
:file-list="fileList"
:auto-upload="false"
action="#"
name="fileList"
:show-file-list="true"
:on-change="uploadSuccess"
>
<el-button class="area-btn" >
浏览文件
</el-button>
</el-upload>
</el-form-item> -->
<el-form-item label="多附件上传">
<el-upload
class="upload-demo"
ref="fileUpload"
multiple
:file-list="fileList"
:auto-upload="false"
action="#"
name="fileList"
:show-file-list="true"
:on-change="uploadSuccess"
:on-remove="handleRemove"
>
<el-button class="area-btn" >
浏览文件
</el-button>
</el-upload>
</el-form-item>
<el-form-item label="今日头条">
<!-- <el-checkbox-group v-model="newsForm.isTop">
<el-checkbox label="置于头条" name="isTop"></el-checkbox>
</el-checkbox-group> -->
<el-checkbox
v-model="newsForm.isTop"
true-label="1"
false-label="0"
>置于头条</el-checkbox
>
</el-form-item>
<el-form-item label="信息所属部门">
<!-- <el-select @click.native="selectDeptEvent()" v-model="newsForm.labelDept" placeholder="请选择信息所属部门" disabled>
</el-select> -->
<!-- <div class="searchSelect"> -->
<el-select v-model="newsForm.labelDept" clearable="">
<div class="searchDiv">
<el-input
placeholder="请输入"
v-model="searchTxt">
</el-input>
</div>
<el-option
v-for="item in searchResult"
:key="item.value"
:label="item.name"
:value="item.deptId">
<span v-html="listHtml(item)"></span>
</el-option>
</el-select>
<!-- </div> -->
</el-form-item>
<el-form-item label="信息所属分类">
<el-checkbox-group v-model="newsForm.typeIds">
<el-checkbox :label="'1'" >党员心得体会(篇)</el-checkbox>
<el-checkbox :label="'2'" >支部风采(次)</el-checkbox>
<el-checkbox :label="'11'" >党员大会(次)</el-checkbox>
<el-checkbox :label="'12'" >支部学习(次)</el-checkbox>
<el-checkbox :label="'13'" >主题党日(次)</el-checkbox>
<el-checkbox :label="'14'" >党课(次)</el-checkbox>
<el-checkbox :label="'15'" >组织生活会</el-checkbox>
</el-checkbox-group>
</el-form-item>
<!--<el-form-item label="特殊资源">
<el-radio-group v-model="form.resource">
<el-radio label="线上品牌商赞助"></el-radio>
<el-radio label="线下场地免费"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="活动形式">
<el-input type="textarea" v-model="form.desc"></el-input>
</el-form-item>-->
<!-- 如果是高院的就都没有上报高院和上报中院,中院有上报高院 ,就是sbGy,基层院有上报高院 还要上报中院 sbZy -->
<el-form-item label="上报高院" v-if="userLevel!='高院'">
<el-checkbox
v-model="newsForm.sbGy"
true-label="1"
false-label="0"
></el-checkbox
>
</el-form-item>
<el-form-item label="上报中院" v-if="userLevel!='高院' && userLevel=='中院'">
<el-checkbox
v-model="newsForm.sbZy"
true-label="1"
false-label="0"
></el-checkbox
>
</el-form-item>
<div class="mb-15" style="width:100%;">
<vue-ueditor-wrap v-model="htmlContent" :config="myConfig"></vue-ueditor-wrap>
</div>
<el-form-item align="center">
<!-- // 然后是publish ,点击发布的话是1,提交审核是4,保存是5 -->
<!-- <el-button type="primary" @click="createNewsEvent('1')">发布</el-button> -->
<!-- <el-button type="primary" @click="createNewsEvent('4')">提交审核</el-button>
<el-button type="primary" >建议</el-button> -->
<el-button type="primary" @click="createNewsEvent('5')">保存</el-button>
<el-button>取消</el-button>
</el-form-item>
</el-form>
<!-- UEditor -->
</el-tab-pane>
<el-tab-pane name="third">
<span slot="label"><i class="el-icon-date"></i>审核列表</span>
<el-table
ref="multipleTable1"
:data="assList"
tooltip-effect="dark"
style="width: 100%"
border
height="550"
@selection-change="handleSelectionChange2">
<el-table-column
type="selection"
width="55">
</el-table-column>
<el-table-column
prop="subject"
label="标题"
width="">
</el-table-column>
<el-table-column
prop="boardName"
label="所属栏目"
width="">
</el-table-column>
<el-table-column
prop="provider"
label="责任编辑"
show-overflow-tooltip>
</el-table-column>
<el-table-column
prop="newsTime"
label="创建/修改时间"
width="">
</el-table-column>
<el-table-column
prop="clickCount"
label="点击次数"
width="">
</el-table-column>
<el-table-column
prop="commentCount"
label="评论(条)"
width="">
</el-table-column>
<el-table-column
prop="adviceCount"
label="建议(条)"
width="">
</el-table-column>
<el-table-column
prop="publish"
label="状态"
width="">
<template slot-scope="scope">
<el-tag :type="scope.row.publish | statusFilters">
{{scope.row.publish | getStatus}}
</el-tag>
</template>
</el-table-column>
<el-table-column
label="操作"
width="120">
<template slot-scope="scope">
<el-button
@click="openAudit(scope.row.newsId)"
type="text"
size="small">
审核
</el-button>
<el-button
@click="openSuggest(scope.row.newsId)"
type="text"
size="small">
提建议
</el-button>
</template>
</el-table-column>
</el-table>
<el-row class="mt-10">
<!-- 创建未提交审核为5,提交审核为4,审核不通过为3,通过已发布为1 -->
<el-button type="primary" size="mini" @click="assInfoBatch">批量打开</el-button>
<el-button type="primary" size="mini" @click="assInfoBatchOp(1)">批量审核通过并发布</el-button>
<el-button type="primary" size="mini" @click="assInfoBatchOp(3)">批量审核不通过</el-button>
</el-row>
<div style="margin-top:10px;">
<el-pagination
prev-text="上一页"
next-text="下一页"
layout="total,sizes,prev, pager, next,jumper"
:total="pageInfoAss.total"
:page-size="pageInfoAss.size"
:current-page="pageInfoAss.page"
@current-change="pageChangeAss"
@size-change="sizeChangeAss"
/>
</div>
</el-tab-pane>
<el-tab-pane name="fourth">
<span slot="label"><i class="el-icon-date"></i>收报信息</span>
<el-table
border
height="550"
ref="multipleTable2"
:data="reportList"
tooltip-effect="dark"
style="width: 100%"
@selection-change="handleSelectionChange3">
<el-table-column
type="selection"
width="55">
</el-table-column>
<el-table-column
label="法院"
>
<template slot-scope="scope">{{ scope.row.date }}</template>
</el-table-column>
<el-table-column
prop="subject"
label="标题"
>
</el-table-column>
<el-table-column
prop=""
label="类型"
>
</el-table-column>
<el-table-column
prop="provider"
label="责任编辑"
>
</el-table-column>
<el-table-column
prop="newsTime"
label="创建/修改时间"
show-overflow-tooltip>
</el-table-column>
<el-table-column
prop=""
label="留言(条)"
>
</el-table-column>
<el-table-column
prop="publish"
label="报送状态"
width="">
</el-table-column>
<el-table-column
label="操作"
>
<template slot-scope="scope">
<el-button
@click="leaveDia(scope.row.newsId)"
type="text"
size="small">
留言
</el-button>
</template>
</el-table-column>
</el-table>
<!-- 如果是高院的就都没有上报高院和上报中院,中院有上报高院 ,就是sbGy,基层院有上报高院 还要上报中院 sbZy -->
<!-- <el-form-item label="上报高院" v-if="userLevel!='高院'">
<el-checkbox
v-model="newsForm.sbGy"
true-label="1"
false-label="0"
></el-checkbox
>
</el-form-item>
<el-form-item label="上报中院" v-if="userLevel!='高院' && userLevel=='中院'">
<el-checkbox
v-model="newsForm.sbZy"
true-label="1"
false-label="0"
></el-checkbox
>
</el-form-item> -->
<el-row class="mt-10">
<!-- 创建未提交审核为5,提交审核为4,审核不通过为3,通过已发布为1 -->
<el-button type="primary" size="mini" @click="sbBatch">批量打开</el-button>
<!-- 是否采用,3为采用,2为不采用即已阅 -->
<el-button type="primary" size="mini" @click="sbBatchUseOrNot(3)">批量采用</el-button>
<el-button type="primary" size="mini" @click="sbBatchUseOrNot(2)">批量不采用</el-button>
</el-row>
<div style="margin-top:10px;">
<el-pagination
prev-text="上一页"
next-text="下一页"
layout="total,sizes,prev, pager, next,jumper"
:total="pageInfoRe.total"
:page-size="pageInfoRe.size"
:current-page="pageInfoRe.page"
@current-change="pageChangeRe"
@size-change="sizeChangeRe"
/>
</div>
</el-tab-pane>
<el-tab-pane name="fifth">
<span slot="label"><i class="el-icon-date"></i>查询</span>
<el-form ref="searchForm" :model="form" label-width="80px">
<el-form-item label="格式">
<el-select v-model="pageInfoSearch.geshi" placeholder="请选择格式" clearable>
<el-option label="普通格式" value="普通格式"></el-option>
</el-select>
</el-form-item>
<el-form-item label="类型">
<!-- 创建未提交审核为5,提交审核为4,审核不通过为3,通过已发布为1 -->
<el-select v-model="pageInfoSearch.publish" placeholder="请选择类型" clearable>
<el-option label="创建未提交审核" value="5"></el-option>
<el-option label="提交审核" value="4"></el-option>
<el-option label="审核不通过" value="3"></el-option>
<el-option label="通过已发布" value="1"></el-option>
</el-select>
</el-form-item>
<!-- <el-form-item label="状态">
<el-select v-model="form.region" placeholder="请选择状态">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item> -->
<el-form-item label="状态">
<!-- 创建未提交审核为5,提交审核为4,审核不通过为3,通过已发布为1 -->
<el-select v-model="pageInfoSearch.publish" placeholder="请选择类型" clearable>
<el-option label="创建未提交审核" value="5"></el-option>
<el-option label="提交审核" value="4"></el-option>
<el-option label="审核不通过" value="3"></el-option>
<el-option label="通过已发布" value="1"></el-option>
</el-select>
</el-form-item>
<el-form-item label="标题">
<el-col :span="11" style="padding-left:0;padding-right:0;">
<el-input v-model="pageInfoSearch.subject"></el-input>
</el-col>
</el-form-item>
<el-form-item label="发布日期">
<el-col :span="11" style="padding-left:0;padding-right:0;">
<el-date-picker
v-model="pageInfoSearch.stime"
type="datetime"
placeholder="选择日期时间"
default-time="12:00:00"
value-format="yyyy-MM-dd HH:mm:ss"
>
</el-date-picker>
</el-col>
<el-col class="line" :span="2" style="text-align:center;">-</el-col>
<el-col :span="11">
<el-date-picker
v-model="pageInfoSearch.etime"
type="datetime"
placeholder="选择日期时间"
default-time="12:00:00"
value-format="yyyy-MM-dd HH:mm:ss"
>
</el-date-picker>
</el-col>
</el-form-item>
<el-form-item label="内容">
<el-col :span="11" style="padding-left:0;padding-right:0;">
<el-input v-model="pageInfoSearch.content"></el-input>
</el-col>
</el-form-item>
<el-form-item label="点击次数">
<el-col :span="11" style="padding-left:0;padding-right:0;">
<el-input v-model="pageInfoSearch.minClick" @input="changeInput1" placeholder="只能输入大于0的正整数"></el-input>
</el-col>
<el-col class="line" :span="2" style="text-align:center;white-space:nowrap;font-size:12px;"></el-col>
<el-col :span="11">
<el-input type="number" v-model="pageInfoSearch.maxClick" @input="changeInput2" placeholder="只能输入大于0的正整数"></el-input>
</el-col>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="findNews()">查询</el-button>
<el-button @click="resetSearch()">重置</el-button>
</el-form-item>
</el-form>
<el-row>
<el-table
border
:data="manageListSearch"
style="width: 100%"
>
<el-table-column
label="标题"
prop="subject"
>
</el-table-column>
<el-table-column
prop="boardName"
label="所属栏目"
>
</el-table-column>
<el-table-column
prop="address"
label="责任编辑"
>
</el-table-column>
<el-table-column
prop="newsTime"
label="创建/修改时间"
>
</el-table-column>
<el-table-column
prop="clickCount"
label="点击次数"
>
</el-table-column>
<el-table-column
prop="commentCount"
label="评论(条)"
>
</el-table-column>
<el-table-column
prop="commentCount"
label="建议(条)"
>
</el-table-column>
<el-table-column
prop="publish"
label="审核发布状态"
>
<template slot-scope="scope">
<el-tag :type="scope.row.publish | statusFilters">
{{scope.row.publish | getStatus}}
</el-tag>
</template>
</el-table-column>
<el-table-column
prop=""
label="报送状态"
>
<!-- <template slot-scope="scope">
<el-tag :type="scope.row.status | statusFilters">
{{scope.row.status?'正常':'禁用'}}
</el-tag>
</template> -->
</el-table-column>
</el-table>
<div style="margin-top:10px;">
<el-pagination
prev-text="上一页"
next-text="下一页"
layout="total,sizes,prev, pager, next,jumper"
:total="pageInfoSearch.total"
:page-size="pageInfoSearch.size"
:current-page="pageInfoSearch.page"
@current-change="pageChangeSearch"
@size-change="sizeChangeSearch"
/>
</div>
</el-row>
</el-tab-pane>
</el-tabs>
</div>
</div>
</el-col>
</el-row>
</el-col>
</el-row>
<!--1、管理列表---修改管理列表弹窗开始 -->
<el-dialog title="修改" width="70%" :visible.sync="editVisible" :before-close="handleCloseEdit">
<el-form ref="form" :model="newsFormEdit" label-width="120px">
<el-form-item label="格式" >
<el-select v-model="newsFormEdit.geshi" placeholder="请选择格式" >
<el-option label="普通格式" value="普通格式"></el-option>
</el-select>
<span class="ml-15">提示:在word文档中编辑好后,复制黏贴到编辑框</span>
</el-form-item>
<el-form-item label="所属栏目">
<el-row >
<el-col :span="6">
<!-- 工作信息->最高人民法院简报 -->
{{newsFormEdit.boardName}}
</el-col>
<!-- <el-col :span="18">
<el-button>选择</el-button>
</el-col> -->
</el-row>
<el-row :gutter="5">
<el-col :span="4">
<span class="mr-15">发送到教育整顿:</span>
</el-col>
<el-col :span="19">
<el-checkbox-group v-model="newsFormEdit.sendToBoards">
<el-checkbox :label="'0'"></el-checkbox>
<el-checkbox :label="'4263'">政治教育</el-checkbox>
<el-checkbox :label="'4264'" >警示教育和英模教育</el-checkbox>
</el-checkbox-group>
</el-col>
</el-row>
</el-form-item>
<el-form-item label="标题">
<el-input v-model="newsFormEdit.subject"></el-input>
</el-form-item>
<!-- <el-form-item label="附件">
<el-upload
class="upload-demo"
ref="noticeUpload"
multiple
:file-list="fileList"
:auto-upload="false"
action="#"
name="fileList"
:show-file-list="true"
:on-change="uploadSuccess"
>
<el-button class="area-btn" >
浏览文件
</el-button>
</el-upload>
</el-form-item> -->
<el-form-item label="多附件上传">
<el-upload
class="upload-demo"
ref="fileUpload"
multiple
:file-list="fileListEdit"
:auto-upload="false"
action="#"
name="fileList"
:show-file-list="true"
:on-change="uploadSuccessEdit"
:on-remove="handleRemoveEdit"
>
<el-button class="area-btn" >
浏览文件
</el-button>
</el-upload>
</el-form-item>
<el-form-item label="今日头条">
<el-checkbox
v-model="newsFormEdit.isTop"
true-label="1"
false-label="0"
>置于头条</el-checkbox
>
</el-form-item>
<el-form-item label="信息所属部门">
<el-select v-model="newsFormEdit.labelDept" clearable="">
<div class="searchDiv">
<el-input
placeholder="请输入"
v-model="searchTxt">
</el-input>
</div>
<el-option
v-for="item in searchResult"
:key="item.value"
:label="item.name"
:value="item.deptId">
<span v-html="listHtml(item)"></span>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="信息所属分类">
<el-checkbox-group v-model="newsFormEdit.typeIds">
<el-checkbox :label="'1'" >党员心得体会(篇)</el-checkbox>
<el-checkbox :label="'2'" >支部风采(次)</el-checkbox>
<el-checkbox :label="'11'" >党员大会(次)</el-checkbox>
<el-checkbox :label="'12'" >支部学习(次)</el-checkbox>
<el-checkbox :label="'13'" >主题党日(次)</el-checkbox>
<el-checkbox :label="'14'" >党课(次)</el-checkbox>
<el-checkbox :label="'15'" >组织生活会</el-checkbox>
</el-checkbox-group>
</el-form-item>
<div class="mb-15" style="width:100%;">
<vue-ueditor-wrap v-model="newsFormEdit.content" :config="myConfig"></vue-ueditor-wrap>
</div>
<el-form-item align="center">
<!-- //创建未提交审核即保存为5,提交审核为4,审核不通过为3,通过已发布为1 -->
<!-- <el-button type="primary" @click="updateNews('1')">修改</el-button> -->
<el-button type="primary" @click="updateNews('4')">提交审核</el-button>
<el-button type="primary" @click="openSuggest(newsFormEdit.newsId)">建议</el-button>
<el-button type="primary" @click="updateNews('5')">保存</el-button>
<el-button @click="handleCloseEdit">关闭</el-button>
</el-form-item>
</el-form>
</el-dialog>
<!-- 1、管理列表---修改管理列表弹窗结束 -->
<!-- 2、管理列表---评论弹窗start-->
<el-dialog
title="评论列表"
:visible.sync="commentDialog"
width="40%"
:before-close="handleComment">
<div>
<el-table
:data="messageDetailDataList"
border
:header-cell-style="{'text-align':'center','color':'#606266'}"
style="width: 100%"
row-key="id"
default-expand-all
:tree-props="{children: 'children', hasChildren: 'hasChildren'}">
<el-table-column
prop="content"
label="评论内容"
>
</el-table-column>
<el-table-column
prop="userId"
label="评论人"
>
</el-table-column>
<el-table-column
prop="reTime"
label="时间">
</el-table-column>
</el-table>
</div>
<span slot="footer" class="dialog-footer">
<!-- <el-button @click="handleComment">取 消</el-button>
<el-button type="primary" >确 定</el-button> -->
<el-button type="primary" @click="handleComment">关闭</el-button>
</span>
</el-dialog>
<!--2、管理列表---评论弹窗end-->
<!--3、审核列表--审核弹窗开始 -->
<el-dialog width="70%" :visible.sync="auditVisible" :before-close="handleCloseAudit">
<el-form ref="form" :model="newsForm" label-width="120px">
<el-form-item label="格式" >
<el-select v-model="newsFormEdit.geshi" placeholder="请选择格式" disabled>
<el-option label="普通格式" value="普通格式"></el-option>
<!--<el-option label="区域二" value="beijing"></el-option>-->
</el-select>
<span class="ml-15">提示:在word文档中编辑好后,复制黏贴到编辑框</span>
</el-form-item>
<el-form-item label="所属栏目">
<el-row >
<el-col :span="6">
<!-- 工作信息->最高人民法院简报 -->
{{newsFormEdit.boardName}}
</el-col>
<!-- <el-col :span="18">
<el-button>选择</el-button>
</el-col> -->
</el-row>
<el-row :gutter="5">
<el-col :span="4">
<span class="mr-15">发送到教育整顿:</span>
</el-col>
<el-col :span="19">
<el-checkbox-group v-model="newsFormEdit.sendToBoards" disabled>
<el-checkbox :label="'0'"></el-checkbox>
<el-checkbox :label="'4263'">政治教育</el-checkbox>
<el-checkbox :label="'4264'" >警示教育和英模教育</el-checkbox>
</el-checkbox-group>
</el-col>
</el-row>
</el-form-item>
<el-form-item label="标题">
<el-input v-model="newsFormEdit.subject" disabled></el-input>
</el-form-item>
<!-- <el-form-item label="附件">
<el-upload
class="upload-demo"
ref="noticeUpload"
multiple
:file-list="fileList"
:auto-upload="false"
action="#"
name="fileList"
:show-file-list="true"
:on-change="uploadSuccess"
>
<el-button class="area-btn" >
浏览文件
</el-button>
</el-upload>
</el-form-item> -->
<el-form-item label="多附件上传">
<el-upload
disabled
class="upload-demo"
ref="fileUpload"
multiple
:file-list="fileListEdit"
:auto-upload="false"
action="#"
name="fileList"
:show-file-list="true"
:on-change="uploadSuccessEdit"
:on-remove="handleRemoveEdit"
>
<el-button class="area-btn" >
浏览文件
</el-button>
</el-upload>
</el-form-item>
<el-form-item label="今日头条">
<!-- <el-checkbox-group v-model="newsForm.isTop">
<el-checkbox label="置于头条" name="isTop"></el-checkbox>
</el-checkbox-group> -->
<el-checkbox
disabled
v-model="newsFormEdit.isTop"
true-label="1"
false-label="0"
>置于头条</el-checkbox
>
</el-form-item>
<el-form-item label="信息所属部门">
<el-select v-model="newsFormEdit.labelDept" clearable disabled>
<div class="searchDiv">
<el-input
placeholder="请输入"
v-model="searchTxt">
</el-input>
</div>
<el-option
v-for="item in searchResult"
:key="item.value"
:label="item.name"
:value="item.deptId">
<span v-html="listHtml(item)"></span>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="信息所属分类">
<el-checkbox-group v-model="newsFormEdit.typeIds" disabled>
<el-checkbox :label="'1'" >党员心得体会(篇)</el-checkbox>
<el-checkbox :label="'2'" >支部风采(次)</el-checkbox>
<el-checkbox :label="'11'" >党员大会(次)</el-checkbox>
<el-checkbox :label="'12'" >支部学习(次)</el-checkbox>
<el-checkbox :label="'13'" >主题党日(次)</el-checkbox>
<el-checkbox :label="'14'" >党课(次)</el-checkbox>
<el-checkbox :label="'15'" >组织生活会</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="内容">
<!-- <div style="text-align:center;margin:15px auto;">文章内容</div> -->
<div class="mb-15" style="width:100%;">
<!-- <vue-ueditor-wrap ref="introduction" v-model="newsFormEdit.content" :config="myConfig" vue-ueditor-wrap></vue-ueditor-wrap> -->
<div v-html="newsFormEdit.content"></div>
</div>
</el-form-item>
<el-form-item align="center">
<!-- //创建未提交审核保存为5,提交审核为4,审核不通过为3,通过已发布为1 -->
<el-button type="primary" @click="updateNews('1')">通过</el-button>
<el-button @click="updateNews('3')">不通过</el-button>
</el-form-item>
</el-form>
</el-dialog>
<!--3、审核列表-- 审核弹窗结束 -->
<!---4、审核列表--提建议弹窗start-->
<el-dialog
title="提建议"
:visible.sync="suggestVisible"
width="40%"
:before-close="handleCloseSuggest">
<div>
<el-form ref="refAdviceForm" :model="adviceForm" label-width="80px">
<el-form-item label="内容:">
<el-input type="textarea" v-model="adviceForm.content" :rows="5"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="saveAdvise">确 定</el-button>
<el-button @click="clearSuggestForm">重置</el-button>
</el-form-item>
</el-form>
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>历史建议</span>
<!-- <el-button style="float: right; padding: 3px 0" type="text">操作按钮</el-button> -->
</div>
<el-table
:data="adviceDetailData"
border
style="width: 100%">
<el-table-column
prop="fromId"
label="建议人"
width="180">
</el-table-column>
<el-table-column
prop="content"
label="内容"
width="180">
</el-table-column>
<el-table-column
prop="sendTime"
label="时间">
</el-table-column>
</el-table>
</el-card>
</div>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="handleCloseSuggest">关闭</el-button>
<!-- <el-button type="primary" @click="saveAdvise">确 定</el-button> -->
</span>
</el-dialog>
<!---4、审核列表--提建议弹窗end-->
<!---5、收报信息--留言弹窗start-->
<el-dialog
title="留言"
:visible.sync="leaveVisible"
width="40%"
:before-close="handleCloseLeave">
<div>
<el-table
:data="messageDetailDataList"
border
:header-cell-style="{'text-align':'center','color':'#606266'}"
style="width: 100%"
row-key="id"
default-expand-all
:tree-props="{children: 'children', hasChildren: 'hasChildren'}">
<el-table-column
prop="content"
label="评论内容"
>
</el-table-column>
<el-table-column
prop="userId"
label="评论人"
>
</el-table-column>
<el-table-column
prop="reTime"
label="时间">
</el-table-column>
</el-table>
<!-- <el-form ref="formSubmit" :model="commentForm" label-width="80px">
<el-form-item label="审批意见:">
<el-input type="textarea" v-model="commentForm.approvalText"></el-input>
</el-form-item>
<el-form-item label="是否通过">
<el-radio-group v-model="commentForm.flowStatus">
<el-radio :label="1">通过</el-radio>
<el-radio :label="3">不通过</el-radio>
</el-radio-group>
</el-form-item>
</el-form> -->
</div>
<span slot="footer" class="dialog-footer">
<!-- <el-button @click="handleCloseLeave">取 消</el-button>
<el-button type="primary" >确 定</el-button> -->
<el-button type="primary" @click="handleCloseLeave">关闭</el-button>
</span>
</el-dialog>
<!---5、收报信息--留言弹窗end-->
<!---6、所属部门弹窗start-->
<dept-list ref="refDept" :deptVisible.sync="deptVisible"></dept-list>
<!---6、所属部门弹窗end-->
<!-- 7、日志弹窗start-->
<el-dialog
title="日志"
:visible.sync="logVisible"
width="40%"
:before-close="handleCloseLog">
<div style="height:50vh;overflow-y:auto;white-space:pre-line;" v-html="logDetailData">
</div>
<span slot="footer" class="dialog-footer">
<!-- <el-button @click="handleCloseLog">取 消</el-button> -->
<el-button type="primary" @click="handleCloseLog">关闭</el-button>
</span>
</el-dialog>
<!-- 7、日志弹窗end -->
<!-- 8、审核批量打开start -->
<el-dialog
title="批量打开新闻"
:visible.sync="batchDialogVisible"
top="3%"
width="60%"
:before-close="handleColseAssInfo"
center>
<div style="height:650px;over-flow:hidden;overflow-y:auto;">
<el-checkbox-group v-model="checkedCities" @change="handleCheckedCitiesChange">
<el-row style="padding:0 15px;" >
<div class="mb-30" v-for="(item,index) in batchList" :key="index">
<h2 style="color:red;font-size:13px;text-align:center!important;">{{item.newsDetail.subject}}</h2>
<div v-if="item.newsDetail.newsTime" style="color: #999999; font-size: 12px;text-align:right">发布时间:{{item.newsDetail.newsTime.substring(0,10)}}</div>
<div v-if="item.attachList">
<el-image style="margin-top:5px;width:100%;margin-bottom:5px;" fit="contain" v-for="v in item.attachList" :key="v.id" :src="v.downloadPath"></el-image>
</div>
<div class="view-html" style="width:100%;" v-html="item.newsDetail.content"></div>
<div class="wiriter-intro">作者: {{ item.newsDetail.provider }}</div>
<div style="text-align:center;margin-top:10px;">
<el-checkbox :label="item.newsDetail.newsId" :key="item.newsDetail.newsId">标记</el-checkbox>
<el-button class="ml-15" type="primary" @click="openSuggest(item.newsDetail.newsId)">提建议</el-button>
</div>
</div>
</el-row>
</el-checkbox-group>
</div>
<span slot="footer" class="dialog-footer">
<!-- <el-button @click="batchDialogVisible = false">取 消</el-button> -->
<el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全部标记</el-checkbox>
<el-button class="ml-15" type="primary" @click="assInfoBatchOp(1)">通过</el-button>
<el-button @click="assInfoBatchOp(3)">不通过</el-button>
<el-button @click="handleColseAssInfo">关闭</el-button>
</span>
</el-dialog>
<!-- 8、审核批量打开end -->
<!-- 9、收报批量打开start -->
<el-dialog
title="批量打开新闻"
:visible.sync="opendialogVisible"
top="3%"
width="60%"
:before-close="handleCloseGet"
center>
<div style="height:650px;over-flow:hidden;overflow-y:auto;">
<el-checkbox-group v-model="checkedCities" @change="handleCheckedCitiesChangegGet">
<el-row style="padding:0 15px;" >
<div class="mb-30" v-for="(item,index) in batchList" :key="index">
<h2 style="color:red;font-size:13px;text-align:center!important;">{{item.newsDetail.subject}}</h2>
<div v-if="item.newsDetail.newsTime" style="color: #999999; font-size: 12px;text-align:right">发布时间:{{item.newsDetail.newsTime.substring(0,10)}}</div>
<div v-if="item.attachList">
<el-image style="margin-top:5px;width:100%;margin-bottom:5px;" fit="contain" v-for="v in item.attachList" :key="v.id" :src="v.downloadPath"></el-image>
</div>
<div class="view-html" style="width:100%;" v-html="item.newsDetail.content"></div>
<div class="wiriter-intro">作者: {{ item.newsDetail.provider }}</div>
<div style="text-align:center;margin-top:10px;">
<el-checkbox :label="item.newsDetail.newsId" :key="item.newsDetail.newsId">标记</el-checkbox>
<el-button class="ml-15" type="primary" @click="openSuggest(item.newsDetail.newsId)">提建议</el-button>
</div>
</div>
</el-row>
</el-checkbox-group>
</div>
<span slot="footer" class="dialog-footer">
<!-- <el-button @click="batchDialogVisible = false">取 消</el-button> -->
<el-checkbox v-model="checkAll" @change="handleCheckAllChange2">全部标记</el-checkbox>
<el-button class="ml-15" type="primary" @click="sbBatchUseOrNot(3)">采用</el-button>
<el-button @click="sbBatchUseOrNot(1)">不采用</el-button>
<el-button @click="handleCloseGet">关闭</el-button>
</span>
</el-dialog>
<!-- 9、收报批量打开end -->
</div>
</template>
<script>
import vueUeditorWrap from 'vue-ueditor-wrap';
import deptList from '@/components/deptList';
import {
getBoardTree,
createNews,
findCurrentDepts,
getManageList,
userCourtLevel,
assInfoList,//审核列表
getSBList,//收报信息
deleteNews,//删除信息
newsDetail,//新闻详情
giveAdvise,//提建议
messageDetail,//留言详情
updateNews,//修改信息
assInfoBatch,//审核信息批量打开
assInfoBatchOp,//审核信息批量操作
batchOpenNews,//批量打开新闻
sbBatch,//收报批量打开
sbBatchUseOrNot,//收报批量采用或不采用
adviceDetail,//建议详情
logDetail,//日志详情
findNews,//搜索信息
delFile,//删除附件
sendBatchAssRemindSms,//批量短信
} from "@/api/manage/manage";
import { removeToken } from "@/utils/auth";
import { getInfo,logout } from "@/api/login";
import { getUserInfo } from "@/utils/auth";
// import Cookies from 'js-cookie'
const cityOptions = ['上海', '北京', '广州', '深圳'];
export default {
name: "show",
components: {
vueUeditorWrap,
deptList,//所属部门组件
},
data() {
return {
checkAll: false,
checkedCities: [],//批量打开审核的选择的标记集合
// cities: cityOptions,
isIndeterminate:false,
batchList:[],//批量打开集合
batchDialogVisible:false,// 审核批量打开弹窗
opendialogVisible:false,//收报批量打开弹窗
messageDetailDataList:[],
delFileList:[],//删除附件
userInfo:{},//用户信息
// selectData:'',//所属部门
logVisible:false,//日志弹窗
logDetailData:{},//日志详情
messageDetailData:{},//留言详情
searchTxt:'',//所属部门
deptListData:[],//所属部门
deptVisible:false,//所属部门弹窗
newsFormEdit:{},//新闻编辑修改
multipleSelection1:[],//勾选1
multipleSelection2:[],//勾选1
multipleSelection3:[],//勾选1
manageSearchList:[],//管理列表查询搜索
adviceForm:{
content:'',
},//提建议
adviceDetailData:[],//历史建议列表
commentDialog:false,//管理列表--评论弹窗
commentForm:{},//评论弹窗
pageInfo: {
page: 1,
size: 10,
total:0
},//管理
pageInfoSearch: {
page: 1,
size: 10,
total:0
},//管理
manageListSearch:[],
pageInfoAss: {
page: 1,
size: 10,
total:0
},//审核列表
pageInfoRe: {
page: 1,
size: 10,
total:0
},//收报信息
assList:[],//审核列表
reportList:[],//收报信息
// sbGy:'0',
// sbZy:'0',//中院
editVisible:false,//修改管理列表
userLevel:'',//用户法院等级
auditVisible:false,//审核弹窗
suggestVisible:false,//提建议弹窗
leaveVisible:false,//收报信息--留言
curBoardId:'',//当前栏目id
fileList:[],//上传附件
fileListEdit:[],//编辑附件
htmlContent:'',
// 富文本配置
myConfig: {
// 编辑器不自动被内容撑高
autoHeightEnabled: false,
// 初始容器高度
initialFrameHeight: 300,
// 初始容器宽度
initialFrameWidth: '99%',
// 上传文件接口
// serverUrl: "",
UEDITOR_HOME_URL: '/UEditor/',
},
deptList:[],//本院部门
manageList:[],//获取管理列表
newsForm: {
geshi:'普通格式',//格式
subject:'',//标题
boardName:'',//当前栏目名
boardId:'',//当前栏目id
isTop:'0',//是否头条 0否1是
typeIds:[],//信息所属分类
// deptId:2547,//用户部门id
sendToBoards:[],//发送到教育整顿
// labelDept:null,//信息所属部门
sbGy: '0',//上报高院
sbZy: '0',//上报中院
// name: '',
// region: '',
// date1: '',
// date2: '',
// delivery: false,
// type: [],
// resource: '',
// desc: ''
},
form: {
name: '',
region: '',
date1: '',
date2: '',
delivery: false,
type: [],
resource: '',
desc: ''
},
activeName: 'first',
// multipleSelection: [],
dataTreeFile: [
],
defaultProps: {
children: 'children',
label: 'boardName'
},
}
},
created() {
console.log('登录路径==',process.env.VUE_APP_LOGIN_API);
this.getBoardTree();//获取左边栏目树
this.findCurrentDepts();//获取本院部门
this.getUserCourtLevel();//用户法院等级
this.getUserInfo()
// let userInfo=getUserInfo();
// console.log('userInfo==',userInfo);
},
filters:{
statusFilters(status){
// 0是引用1是正常
const statusMap={3:'danger',1:'success',4:'info',5:'warning'}
return statusMap[status];
},
// 创建未提交审核为5,提交审核为4,审核不通过为3,通过已发布为1
getStatus(data){
switch(data){
case '1':
return '通过';
case '3':
return '审核不通过';
case '4':
return '提交审核';
case '5':
return '未提交审核';
default:
return data;
}
},
},
// 模糊搜索所属部门start
computed:{
searchResult(){
if(this.searchTxt){
return this.deptListData.filter(item=>item.name.includes(this.searchTxt))
}else{
return this.deptListData;
}
},
VUE_APP_LOGIN_API(){
console.log('登录路径',process.env.VUE_APP_LOGIN_API);
return process.env.VUE_APP_LOGIN_API
}
},
// 模糊搜索所属部门end
methods:{
//选择标记--审核
handleCheckedCitiesChange(value) {
console.log('批量选择标记=',value);
this.multipleSelection2=value;//复制给勾选的值
},
// 全部标记----审核
handleCheckAllChange(val) {
console.log('批量选择标记全选=',val);
let arr=[];
this.batchList.forEach(item=>{
arr.push(item.newsDetail.newsId);
})
this.checkedCities = val ? arr : [];
console.log('批量选择标记全选值=',this.checkedCities);
this.multipleSelection3=this.checkedCities;//复制给勾选的值
this.isIndeterminate = false;
},
//选择标记--收报
handleCheckedCitiesChangegGet(value) {
console.log('批量选择标记=',value);
this.multipleSelection2=value;//复制给勾选的值
},
// 全部标记--收报
handleCheckAllChange2(val) {
console.log('批量选择标记全选=',val);
let arr=[];
this.batchList.forEach(item=>{
arr.push(item.newsDetail.newsId);
})
this.checkedCities = val ? arr : [];
console.log('批量选择标记全选值=',this.checkedCities);
this.multipleSelection3=this.checkedCities;//复制给勾选的值
this.isIndeterminate = false;
},
getUserInfo() {
getInfo().then((res) => {
this.userInfo = res.user;
console.log('userInfo=======================',this.userInfo);
// this.SET_USER(res.user);
// setUserInfo(res.user);
});
},
//勾选管理列表
handleSelectionChange1(val){
console.log('勾选1==',val);
// this.multipleSelection1 = val;
var newsIdArr=[];
val.forEach(item=>{
newsIdArr.push(item.newsId);
})
this.multipleSelection1 = newsIdArr;
},
// 管理列表批量短信
upLetterEvent(){
let params={};
params.newsIds=this.multipleSelection1;
// params.publish=publish;
sendBatchAssRemindSms(JSON.stringify(params)).then(res=>{
if(res.success){
this.getManageList();//刷新列表
this.$message({
message:'批量审核成功!',
type:'success'
})
}
})
},
//勾选审核列表----接口用不了
handleSelectionChange2(val){
console.log('勾选2==',val);
var newsIdArr=[];
val.forEach(item=>{
newsIdArr.push(item.newsId);
})
this.multipleSelection2 = newsIdArr;
},
//勾选收报列表
handleSelectionChange3(val){
console.log('勾选3==',val);
// this.multipleSelection3 = val;
var newsIdArr=[];
val.forEach(item=>{
newsIdArr.push(item.newsId);
})
this.multipleSelection3 = newsIdArr;
},
// 审核信息批量打开
assInfoBatch(){
if(this.multipleSelection2.length==0){
this.$message({
message:'请选择新闻!',
type:'warning'
})
return;
}
this.batchDialogVisible=true;//批量打开弹窗
let params={};
params.newsIds=this.multipleSelection2;
batchOpenNews(JSON.stringify(params)).then(res=>{
if(res.success){
this.batchList=res.data;
}
})
},
//审核信息批量操作--通过/不通过
assInfoBatchOp(publish){
let params={};
params.newsIds=this.multipleSelection2;
params.publish=publish;
assInfoBatchOp(JSON.stringify(params)).then(res=>{
if(res.success){
this.getAssInfoList();//刷新列表
this.$message({
message:'批量审核成功!',
type:'success'
})
}
})
},
//关闭批量审核弹窗
handleColseAssInfo(){
this.batchDialogVisible=false;
this.multipleSelection2=[];//选择为空
this.checkedCities=[];//选择为空
this.$refs.multipleTable1.clearSelection();// 删除后清空之前选择的数据
this.$forceUpdate();
},
//收报批量打开
sbBatch(publish){
if(this.multipleSelection3.length==0){
this.$message({
message:'请选择新闻!',
type:'warning'
})
return;
}
this.opendialogVisible=true;//批量打开弹窗
let params={};
params.newsIds=this.multipleSelection3;
// params.publish
// assInfoBatch(JSON.stringify(params)).then(res=>{
batchOpenNews(JSON.stringify(params)).then(res=>{
if(res.success){
this.batchList=res.data;
}
})
},
//关闭批量收报弹窗
handleCloseGet(){
this.batchDialogVisible=false;
this.multipleSelection2=[];//选择为空
this.checkedCities=[];//选择为空
this.$refs.multipleTable2.clearSelection();// 删除后清空之前选择的数据
this.$forceUpdate();
},
// 收报批量采用不采用
sbBatchUseOrNot(status){
// 是否采用,3为采用,2为不采用即已阅
let params={};
params.isUse=status;
params.newsIds=this.multipleSelection3;
// params.publish=publish;
sbBatchUseOrNot(JSON.stringify(params)).then(res=>{
if(res.success){
this.getReportList();//刷新列表
var msg='收报批量采用成功!';
if(status==2){
msg='收报批量不采用成功!';
}else if(status==3){
msg='收报批量采用成功!';
}
this.$message({
message:msg,
type:'success'
})
}
})
},
listHtml(item){
return item.name.replace(new RegExp(this.searchTxt,'g'),'<b style="color:red;">'+this.searchTxt+'</b>')
},
//限制只能输入正整数
changeInput2() {
var pattern = /^[1-9][0-9]*$/ // 正整数的正则表达式
// 不符合正整数时
if (!pattern.test(this.pageInfo.maxClick)) {
// input 框绑定的内容为空
this.pageInfo.maxClick='';
}
},
//限制只能输入正整数
changeInput1() {
var pattern = /^[1-9][0-9]*$/ // 正整数的正则表达式
// 不符合正整数时
if (!pattern.test(this.pageInfo.minClick)) {
// input 框绑定的内容为空
this.pageInfo.minClick=0;
}
},
//切换选项卡
handleTabClick(tab,event){
// this.getAssInfoList();//获取审核列表
// this.getReportList();//获取收报信息列表
console.log(tab,event);
if(tab.name=='first'){
this.pageInfo.page = 1;
this.getManageList();//获取管理列表
}else if(tab.name=='second'){
}else if(tab.name=='third'){
this.pageInfoAss.page = 1;
this.getAssInfoList();//获取审核列表
}else if(tab.name=='fourth'){
this.pageInfoRe.page = 1;
this.getReportList();//获取收报信息列表
}else if(tab.name=='fifth'){
}
},
//用户法院等级
getUserCourtLevel(){
userCourtLevel().then(res=>{
console.log('用户等级==',res);
if(res.success){
let {courtLevel}=res.data;
this.userLevel=courtLevel;
console.log('用户等级11==',this.userLevel);
}
})
},
//获取左边栏目树
getBoardTree(){
getBoardTree().then(res=>{
if(res.success){
this.dataTreeFile=res.data;
}
})
},
//获取本院部门
findCurrentDepts(){
findCurrentDepts().then(res=>{
console.log('获取本院部门==',res);
if(res.success){
console.log('筛选本院部门前==',res.data);
// pid=32;//筛选出高院的部门,高院部门的pid==32
let newArr=res.data.filter(item=>{
return item.pid==32;
});
this.deptListData=newArr;
console.log('筛选本院部门后==',this.deptListData);
// this.deptList=res.data
}
})
},
//获取管理列表
getManageList(type){
// type 判断是查询还是管理列表查询要加isSearch='1'
// let params={};
this.pageInfo.boardId=this.curBoardId;
// type=this.activeName;
// if(type=='fifth'){
// this.pageInfo.isSearch='1';
// }
if(this.pageInfo.stime && this.pageInfo.etime){
console.log(1111111111);
var oDateStart = new Date(this.pageInfo.stime);
var oDateEnd = new Date(this.pageInfo.etime);
// console.log('oDateStart==',oDateStart);
// console.log('oDateEnd==',oDateEnd);
if(oDateStart>=oDateEnd) {
console.log(222);
this.$message({
type: "error",
message: "结束时间不能小于开始时间",
});
return;
}
}
if (this.pageInfo.maxClick && this.pageInfo.minClick) {
console.log('this.pageInfo.maxClick==',this.pageInfo.maxClick);
if (this.pageInfo.minClick>=this.pageInfo.maxClick) {
this.$message({
type: "error",
message: "最大点击数不能小于最小点击数",
});
return;
}
}
console.log('管理列表参数==',this.pageInfo);
getManageList(JSON.stringify(this.pageInfo)).then(res=>{
console.log('获取管理列表==',res);
if(res.success){
this.manageList = res.data.records
this.pageInfo.total = res.data.total
}else{
this.$message({
type: "error",
message: res.errMsg,
});
}
})
},
// 查询
findNews(){
this.pageInfoSearch.boardId=this.curBoardId;
if(this.pageInfoSearch.stime && this.pageInfoSearch.etime){
var oDateStart = new Date(this.pageInfoSearch.stime);
var oDateEnd = new Date(this.pageInfoSearch.etime);
if(oDateStart>=oDateEnd) {
console.log(222);
this.$message({
type: "error",
message: "结束时间不能小于开始时间",
});
return;
}
}
if (this.pageInfoSearch.maxClick && this.pageInfoSearch.minClick) {
console.log('this.pageInfoSearch.maxClick==',this.pageInfoSearch.maxClick);
if (this.pageInfoSearch.minClick>=this.pageInfoSearch.maxClick) {
this.$message({
type: "error",
message: "最大点击数不能小于最小点击数",
});
return;
}
}
console.log('管理查询参数==',this.pageInfoSearch);
findNews(JSON.stringify(this.pageInfoSearch)).then(res=>{
console.log('获取查询列表==',res);
if(res.success){
this.manageListSearch = res.data.records
this.pageInfoSearch.total = res.data.total
}
})
},
//resetSearch重置
resetSearch(){
this.$refs['searchForm'].resetFields();
this.pageInfoSearch={};
this.pageInfoSearch={
page: 1,
size: 10,
total:0
};//管理
},
// 管理列表--页面切换
pageChangeSearch(e) {
this.pageInfoSearch.page = e;
this.findNews();
},
sizeChangeSearch(e) {
this.pageInfo.size = e;
this.pageChange(1);
},
//上传附件
uploadSuccess(file, list) {
this.fileList = list;
console.log('fileList----',this.fileList);
},
handleRemove(file, list){
console.log('fileListHandleRemove----',list);
this.fileList = list;
},
//上传附件--编辑
uploadSuccessEdit(file, list) {
this.fileListEdit = list;
// this.addFileListEdit=list;
console.log('编辑新增----',this.list);
},
handleRemoveEdit(file, list){
console.log('fileListHandleRemove----',list);
for (var j = 0; j < this.fileListEdit.length; j++) {
// 含 status: ready 表示该附件为新增附件
if (this.fileListEdit[j].status == 'ready') {//新上传的附件
if (this.fileListEdit[j].uid == file.uid) {
this.fileListEdit.splice(j, 1)
console.log('-=-==-==-=-=-==-=--删除新增附件', this.fileListEdit)
break
}
} else if (this.fileListEdit[j].status == 'success') {//原来的附件
if (this.fileListEdit[j].id == file.id) {
this.fileListEdit.splice(j, 1)
console.log('-=-==-==-=-=-==-=--删除原附件', this.fileListEdit)
this.delFileList.push(file.id)
break
}
}
}
},
// 发布新闻
createNewsEvent(num){
// params.publish=num;// 然后是publish ,点击发布的话是1,提交审核是4,保存是5
if(this.newsForm.subject==''){
this.$message({
message: '请输入标题!',
type: 'warning'
});
return;
}
if(this.fileList.length==0){
this.$message({
message: '请上传图片附件!',
type: 'warning'
});
return;
}
let formData = new FormData();
formData.append('deptId', this.userInfo.dept.id);//用户部门id
for(let key in this.newsForm){
formData.append(key,this.newsForm[key])
}
formData.append('content', this.htmlContent);
this.fileList.forEach(item=>{
formData.append('fileList', item.raw)
})
formData.append('publish',num);// 然后是publish ,点击发布的话是1,提交审核是4,保存是5
console.log('formData==',formData);
createNews(formData).then(res=>{
this.newsForm.subject='';
if(res.success){
this.$message({
message: '添加信息成功!',
type: 'success'
});
// this.activeName="first"; //跳转到管理
// this.getManageList();//刷新列表
}else{
this.$message({
                type: "error",
                message: res.errMsg,
            });
}
})
},
//修改信息
updateNews(num){
if(this.newsFormEdit.subject==''){
this.$message({
message: '请输入标题!',
type: 'warning'
});
return;
}
// if(this.newsFormEdit.labelDept==null){
// this.$message({
// message: '请输入选择所属部门!',
// type: 'warning'
// });
// return;
// }
let formData = new FormData();
if(this.activeName='third'){//创建未提交审核为5,提交审核为4,审核不通过为3,通过已发布为1
this.newsFormEdit.publish=num;
};
if(this.newsFormEdit.clickCount==null){
console.log('111')
this.newsFormEdit.clickCount=0;
}
// if(this.newsFormEdit.fileList==null){
// this.newsFormEdit.fileList=[];
// }
delete this.newsFormEdit.attInfoList; //删除attInfoList参数不传这个参数否则接口报错
if(this.newsFormEdit.labelDept==null){
delete this.newsFormEdit.labelDept;
}
for(let key in this.newsFormEdit){
formData.append(key,this.newsFormEdit[key])
}
console.log('-=-=-=-=-=-=-=-=-==-===-=-=提交删除附件集合', this.delFileList)
//调用删除附件接口
if (this.delFileList.length != 0) {
console.log('-=-=-=-=-=-=-=-=-==-===-=-=删除附件集合', this.delFileList)
var delFileList={};
delFileList.delFileList=this.delFileList;
delFile(JSON.stringify(delFileList)).then((res) => {
if (res.success) {
console.log('-=-=-=-=-=-=-=-=-==-===-=-=删除附件接口', res)
}
})
}
console.log('-=-=-=-=-=-=-=--=需提交保存的附件列表', this.fileListEdit);
if(this.fileListEdit.length==0){
this.$message({
message: '请上传图片附件!',
type: 'warning'
});
return;
}
this.fileListEdit = [...new Set(this.fileListEdit)]
this.fileListEdit.forEach((item) => {
if (item.raw) {
formData.append('fileList', item.raw)
console.log(11111)
} else {
console.log(2222)
}
console.log('-=-=-=-=-=-=-=--=需提交的附件列表', formData.get('fileList'))
})
// formData.append('publish',num);// 然后是publish ,点击发布的话是1,提交审核是4,保存是5
console.log('formData==',formData);
// console.log('formData==',formData);
updateNews(formData).then(res=>{
// <!-- //创建未提交审核保存为5,提交审核为4,审核不通过为3,通过已发布为1 -->
var msg='修改保存成功!';
if(num=='4'){
this.activeName='third';
//刷新列表
// this.getManageList();
this.getAssInfoList();//获取审核列表
msg='提交审核成功!';
//关闭弹窗
this.editVisible=false;
}
if(num=='1' || num=='3'){
this.activeName='first';
// this.getAssInfoList();//获取审核列表
this.getManageList();
this.auditVisible=false;//关闭弹窗
msg='审核完毕!';
}
if(num=='5'){
this.activeName='first';
this.getAssInfoList();//获取审核列表
//关闭弹窗
this.editVisible=false;
}
if(res.success){
this.$message({
message: msg,
type: 'success'
});
}
})
},
handleNodeClick(param) {
console.log('点击的栏目',param);
let { boardId,boardName } = param;
this.newsForm.boardId=boardId;//当前栏目id
this.curBoardId=boardId;
this.newsForm.boardName=boardName;//当前栏目名
this.getManageList();//获取管理列表
// this.getAssInfoList();//获取审核列表
// this.getReportList();//获取收报信息列表
// this.curTreeDeptId=id;
// this.getDeptUserList(this.rowData.sid,id);
},
loginEvent(){
removeToken();
// location.href = loginURL ;
location.href = process.env.VUE_APP_LOGIN_API
},
loginOut() {
// alert('11111',process.env.VUE_APP_LOGIN_API);
// logout().then((res) => {
// removeToken();
// location.href = res.data;
// });
// var loginURL  = process.env.VUE_APP_LOGIN_API;
// console.log('loginURL222222222222==',loginURL );
// location.href = loginURL ;
location.href = process.env.VUE_APP_LOGIN_API
},
// 管理列表--页面切换
pageChange(e) {
this.pageInfo.page = e;
this.getManageList();
},
sizeChange(e) {
this.pageInfo.size = e;
this.pageChange(1);
},
// 管理列表--修改
handleEdit(newsId){
console.log('编辑',newsId);
let params={};
params.newsId=newsId;
console.log('修改',newsId);
newsDetail(JSON.stringify(params)).then(res=>{
if(res.success){
let{newsDetail,attachList}=res.data;
// this.newsListDetail=res.data;
this.newsFormEdit=newsDetail;
this.fileListEdit=attachList;
console.log('新闻详情this.fileList===',this.fileListEdit);
if (attachList.length >0) {
//显示已上传附件列表
for (let i = 0; i < this.fileListEdit.length; i++) {
this.fileListEdit[i].name = this.fileListEdit[i].attachName
}
}
}
})
this.editVisible=true;
},
// 管理列表--修改--关闭弹窗
handleCloseEdit(){
this.editVisible=false;
},
// 管理列表--删除文章
handleDelete(newsId){
let params={};
params.newsId=newsId;
console.log('删除',newsId);
this.$confirm("确定删除吗?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
}).then(() => {
deleteNews(JSON.stringify(params)).then(res=>{
if(res.success){
//刷新列表
this.getManageList();
this.$message({
message:'删除成功',
type:'success'
})
}
})
}).catch(() => {});
},
// 管理列表--评论
commentEvent(newsId){
console.log('评论',newsId);
let params={};
params.newsId=newsId;
// params.newsId='f4bf8ffc4ec54e98a180f36b95668ec6';
messageDetail(JSON.stringify(params)).then(res=>{
if(res.success){
this.messageDetailDataList=res.data;
//改变回复的属性名
this.messageDetailDataList.forEach(item=>{
if(item.subComments){
item.children=item.subComments;
delete item.subComments;
// item = JSON.parse(JSON.stringify(item).replace(/subComments/g, 'children'))
}
})
console.log('this.messageDetailDataList==',this.messageDetailDataList)
// this.messageDetailDataList = JSON.parse(JSON.stringify(this.messageDetailData).replace(/subComments/g, 'children'))
//navigationName 修改前的属性名 name要修改的属性名
}
})
this.commentDialog=true;
},
//日志详情
logDetailEvent(newsId){
let params={};
params.newsId=newsId;
logDetail(JSON.stringify(params)).then(res=>{
if(res.success){
this.logDetailData=res.data;
}
})
this.logVisible=true;
},
// 管理列表--关闭评论弹窗
handleComment(id){
console.log('评论',id);
this.commentDialog=false;
},
// 获取审核列表
getAssInfoList(){
this.pageInfoAss.boardId=this.curBoardId;
console.log('审核列表参数==',this.pageInfoAss);
assInfoList(JSON.stringify(this.pageInfoAss)).then(res=>{
if(res.success){
this.assList = res.data.records
this.pageInfoAss.total = res.data.total
}else{
this.$message({
                type: "error",
                message: res.errMsg,
            });
}
})
},
// 审核列表--页面切换
pageChangeAss(e) {
this.pageInfoAss.page = e;
this.getAssInfoList();
},
// 审核列表
sizeChangeAss(e) {
this.pageInfoAss.size = e;
this.pageChangeAss(1);
},
// 收报信息---列表
getReportList(){
this.pageInfoRe.boardId=this.curBoardId;
console.log('审核列表参数==',this.pageInfoRe);
getSBList(JSON.stringify(this.pageInfoRe)).then(res=>{
if(res.success){
this.reportList = res.data.records
this.pageInfoRe.total = res.data.total
}else{
this.$message({
                type: "error",
                message: res.data,
            });
}
})
},
// 收报信息--页面切换
pageChangeRe(e) {
this.pageInfoRe.page = e;
this.getReportList();
},
// 收报信息--页面切换
sizeChangeRe(e) {
this.pageInfoRe.size = e;
this.getReportList();
},
// 审核列表--审核按钮弹窗
openAudit(newsId){
console.log('审核',newsId);
let params={};
params.newsId=newsId;
console.log('修改',newsId);
newsDetail(JSON.stringify(params)).then(res=>{
if(res.success){
let{newsDetail,attachList}=res.data;
// this.newsListDetail=res.data;
this.newsFormEdit=newsDetail;
this.fileListEdit=attachList;
console.log('新闻详情this.fileList===',this.fileListEdit);
if (attachList.length >0) {
//显示已上传附件列表
for (let i = 0; i < this.fileListEdit.length; i++) {
this.fileListEdit[i].name = this.fileListEdit[i].attachName
}
}
}
})
this.auditVisible=true;
// this.$refs.introduction.setDisabled();
},
// 审核列表--关闭审核弹窗
handleCloseAudit(){
this.auditVisible=false;
},
// 审核列表-提建议按钮弹窗
openSuggest(newsId){
this.adviceForm.proId=newsId;//新闻 ID
this.adviceDetail();//建议历史列表
// 打开弹窗
this.suggestVisible=true;
},
//历史建议列表
adviceDetail(){
let params={};
params.newsId=this.adviceForm.proId;
adviceDetail(JSON.stringify(params)).then(res=>{
if(res.success){
this.adviceDetailData=res.data;
}
});
},
//提建议
clearSuggestForm(){
this.$refs['refAdviceForm'].resetFields();
this.adviceForm.content='';
},
//审核列表提建议保存
saveAdvise(){
if(this.adviceForm.content==''){
this.$message({
message:'请输入内容!',
type:'warning'
});
return;
}
let params={};
params.content=this.adviceForm.content;
params.proId=this.adviceForm.proId
giveAdvise(JSON.stringify(params)).then(res=>{
if(res.success){
this.$message({
message:'提建议成功!',
type:'success'
})
// 刷新列表
this.adviceDetail();
// 关闭弹窗
// this.suggestVisible=false;
}
})
},
// 审核列表-提建议
handleCloseSuggest(){
this.suggestVisible=false;
},
// 收报信息--留言
leaveDia(newsId){
let params={};
// params.newsId=newsId;
params.newsId='f4bf8ffc4ec54e98a180f36b95668ec6';
messageDetail(JSON.stringify(params)).then(res=>{
if(res.success){
this.messageDetailDataList=res.data;
this.messageDetailDataList.forEach(item=>{
//改变回复的属性名
if(item.subComments){
item.children=item.subComments;
delete item.subComments;
}
})
console.log('this.messageDetailDataList==',this.messageDetailDataList)
}
})
this.leaveVisible=true;
},
// 收报信息--留言
handleCloseLeave(){
this.leaveVisible=false;
},
//关闭日志
handleCloseLog(){
this.logVisible=false;
},
}
}
</script>
<style lang="scss" scoped>
// .searchSelect{
// width: 200px;
// margin: 300px auto;
// }
// .el-scrollbar{
// display: block !important;
// }
// 树形菜单图标start-----------------------
.el-tree{
background:transparent;
}
.el-tree /deep/ .el-tree-node__expand-icon.expanded
{
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
/*//有子节点 且未展开*/
.el-tree /deep/ .el-icon-caret-right:before
{
background: url("../../assets/wjjg.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
/*//有子节点 且已展开*/
.el-tree /deep/ .el-tree-node__expand-icon.expanded.el-icon-caret-right:before
{
background: url("../../assets/wjjk.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
/*//没有子节点*/
.el-tree /deep/ .el-tree-node__expand-icon.is-leaf::before
{
background: url("../../assets/wj.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
// 树形菜单图标end-----------------------
.top-info{
margin:15px 0;
border-bottom:2px solid #34bab2;
padding-bottom:15px;
}
.fist-text{
display:inline-block;
width:26px;
height:26px;
line-height:26px;
text-align:center;
font-size:15px;
color:#fff;
border-radius:50%;
background:#1a3784;
margin-right:3px;
}
.list-container{
// border:2px solid #34bab2;
// padding:15px 15px;
// margin-top:40px;
}
.list-title{
border-bottom:1px dashed #ccc;
line-height: 35px;
}
// 列表start
.type-list li{
list-style-type: square;
// color: #0099ff;
color: blue;
font-size: 16px;
line-height: 35px;
border-bottom: 1px dashed #ccc;
}
.type-list li a{
color: #333;
font-size: 14px;
text-decoration:none;
}
.type-list li:hover{
// color: #ff6900;
color: red;
}
.type-list li:hover a{
// color: #ff6900
color:red;
}
.type-list li:last-of-type{border-bottom:none;}
// 列表end
ul{
margin: 0px;
padding: 0px;
padding-left: 15px;
}
.zone-style{
background-color:#fff;
padding:15px 15px;
border-radius:5px;
box-shadow: -5px 0px 20px 5px rgba(0,0,0,0.05);
margin-left:0!important;
margin-right:0 !important;
}
.upload {
background-color: #161616;
// height: 50px;
display: flex;
justify-content: space-between;
align-items: center;
// padding: 0 15px;
padding: 15px;
border-bottom: 1px solid #6e6e6e;
}
::v-deep{
.el-tabs{
border-radius:5px;
}
.el-tabs__content{
height:69vh;
overflow: auto;
}
.el-table th:first-child>.cell{
text-align:left!important;
}
.note-btn {
background: none;
color: #fff;
border: none;
background: none;
background-color: #456e94;
font-weight: bolder;
// margin: 10px 0;
img {
margin-right: 5px;
}
span {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
font-size: 15px;
}
}
}
.border-zone{
border: 1px solid #eee;
border-radius: 5px;
height: 76vh;
overflow: hidden;
overflow-y: auto;
overflow-x: auto;
}
.wiriter-intro{
text-align:right;
margin-top:10px;
font-size:13px;
}
</style>
\ No newline at end of file
<template>
<div class="my-tab">
<el-row >
<el-col :span="5">
<div class="list-container" style="">
<el-tree :data="fileTreedata" default-expand-all :props="defaultProps" @node-click="handleNodeClick"></el-tree>
</div>
</el-col>
<el-col :span="19">
<div>
<div class="container-title">所有文件夹</div>
<el-table
:data="tableData"
style="width: 100%;margin-bottom: 20px;"
row-key="id"
default-expand-all
:header-cell-style="{
'text-align': 'center',
'font-size': '15px',
'color':'#fff'
}"
:cell-style="{padding: '20px',color:'#fff'}"
:tree-props="{children: 'children', hasChildren: 'hasChildren'}">
<el-table-column
align="left"
prop="address"
label="名称">
<template slot-scope="scope" >
<!-- <div class="k-flex k-space-between">
<div> -->
<i class="el-icon-folder-opened"></i>
<span>{{scope.row.address}}</span>
<!-- </div> -->
<!-- <el-button
style="float:right;"
v-if="!scope.row.children"
type="text"
size="mini">
日志
</el-button> -->
<div style="float:right;">
<el-image class="btn-image mr-25" :src="require('@/assets/table/fenxiang.png')"></el-image>
<el-image class="btn-image mr-25" :src="require('@/assets/table/xiazai.png')"></el-image>
<el-image class="btn-image mr-25" :src="require('@/assets/table/delete.png')"></el-image>
<el-image class="btn-image" :src="require('@/assets/table/name.png')"></el-image>
</div>
<!-- </div> -->
<!-- <el-table
:data="scope.row"
style="width: 100%;margin-bottom: 20px;"
row-key="id"
border
default-expand-all
>
<el-table-column
prop=""
width="180"
label="文件类型">
<template slot-scope="">
<i class="el-icon-folder-opened"></i>
</template>
</el-table-column>
</el-table> -->
</template>
</el-table-column>
<el-table-column
prop=""
align="center"
width="180"
label="文件类型">
<template slot-scope="">
文件夹
</template>
</el-table-column>
<el-table-column
prop="name"
align="center"
label="文件大小"
sortable
width="180">
</el-table-column>
<el-table-column
prop="date"
align="center"
label="操作时间"
sortable
width="180">
</el-table-column>
<!-- <el-table-column
prop="address"
label="地址">
</el-table-column> -->
</el-table>
</div>
</el-col>
</el-row>
</div>
</template>
<script>
export default {
name: "show",
data() {
return {
fileTreedata: [{
label: '一级 1',
children: [{
label: '二级 1-1',
children: [{
label: '三级 1-1-1'
}]
}]
}, {
label: '一级 2',
children: [{
label: '二级 2-1',
children: [{
label: '三级 2-1-1'
}]
}, {
label: '二级 2-2',
children: [{
label: '三级 2-2-1'
}]
}]
}, {
label: '一级 3',
children: [{
label: '二级 3-1',
children: [{
label: '三级 3-1-1'
}]
}, {
label: '二级 3-2',
children: [{
label: '三级 3-2-1'
}]
}]
}],
defaultProps: {
children: 'children',
label: 'label'
},
tableData: [{
id: 1,
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
id: 2,
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄'
}, {
id: 3,
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄',
children: [{
id: 31,
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
}, {
id: 32,
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
}]
}, {
id: 4,
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
}],
}
},
created() {
},
methods:{
handleNodeClick(data) {
console.log(data);
}
}
}
</script>
<style lang="scss" scoped>
.my-tab{
background:#333;
}
.list-container{
height: 65vh;
overflow: hidden;
overflow:auto;
padding:15px;
border-right:1px solid #181818;
}
.container-title{
height:60px;
line-height:60px;
padding:0 15px;
color:#fff;
border-bottom:1px solid #181818;
}
.btn-image{
width:13px;
height:15px;
}
::v-deep{
.el-table th:first-child > .cell {
text-align: left !important;
padding-left:15px;
}
}
// 树形菜单图标start-----------------------
.el-tree{
color:#fff;
}
.el-tree{
background:transparent;
}
.el-tree /deep/ .el-tree-node__expand-icon.expanded
{
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
/*//有子节点 且未展开*/
.el-tree /deep/ .el-icon-caret-right:before
{
background: url("../../assets/wjjg.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
/*//有子节点 且已展开*/
.el-tree /deep/ .el-tree-node__expand-icon.expanded.el-icon-caret-right:before
{
background: url("../../assets/wjjk.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
/*//没有子节点*/
.el-tree /deep/ .el-tree-node__expand-icon.is-leaf::before
{
background: url("../../assets/wj.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
// 树形菜单图标end-----------------------
// 表格背景色start
// .el-table--border, .el-table--group{
// border:none;
// }
/deep/.el-table td,
.el-table th.is-leaf {
// border-bottom: 1px solid rgb(51, 51, 51);
border-bottom: 1px solid #444444;
}
/deep/.el-table--enable-row-hover .el-table__body tr:hover>td {
// background-color: #424242;
background-color:#333;
color: rgb(207, 207, 207);
}
/deep/.el-table {
th,
tr {
// background-color: rgb(22, 22, 22);
background-color:#333;
.is-leaf {
// border-bottom: 1px solid rgb(51, 51, 51);
border-bottom: 1px solid #444444;
}
&:hover {
background-color: rgb(66, 66, 66);
}
}
&--border::after,
&--group::after,
&::before {
content: '';
position: absolute;
background-color: rgb(66, 66, 66);
// background-color:#333;
z-index: 1;
}
}
/deep/.el-table__body-wrapper {
// background-color: black;
background-color:#333;
}
// 表格背景色end
</style>
\ No newline at end of file
<template>
<div >
<el-row >
<el-col :span="18" :offset="3">
<el-row class="mt-20" :gutter="20">
<!--左边栏目开始-->
<!-- <el-col :span="5">
<div class="list-container" style="">
<div class="list-title mb-10" style="">按分类查看</div>
<ul class="type-list">
<li><a href="#">最高法通报</a></li>
<li><a href="#">最高人民法院简报</a></li>
</ul>
</div>
</el-col> -->
<!--左边栏目结束-->
<!-- <el-col :span="19"> -->
<div class="zone-style">
<div style="min-height:76vh;">
<el-table
:header-cell-style="{'text-align':'center','font-size':'15px','color':'black'}"
:cell-style="{'font-size':'13px','border-bottom':'none'}"
:data="moreNewsList"
highlight-current-row
style="width: 100%">
<el-table-column
align="left"
property="subject"
label="标题">
</el-table-column>
<el-table-column
align="center"
property="newsTime"
label="时间"
width="150">
</el-table-column>
<el-table-column
align="center"
property="clickCount"
label="点击"
width="120">
</el-table-column>
<el-table-column
align="center"
property="commentCount"
label="评论"
width="50">
</el-table-column>
<el-table-column
label="操作"
width="50"
align="center"
>
<template slot-scope="scope">
<el-button
@click="setParams(scope.row)"
type="text"
size="mini">
查看
</el-button>
</template>
</el-table-column>
</el-table>
<div style="margin-top:10px;">
<el-pagination
prev-text="上一页"
next-text="下一页"
layout="total,sizes,prev, pager, next,jumper"
:total="pageInfo.total"
:page-size="pageInfo.size"
:current-page="pageInfo.page"
@current-change="pageChange"
@size-change="sizeChange"
/>
</div>
</div>
</div>
<!-- </el-col> -->
</el-row>
</el-col>
</el-row>
</div>
</template>
<script>
import {
highlights,//精彩回顾
fyxwfromCourt, //获取法院新闻
} from "@/api/news.js";
export default {
name: "show",
data() {
return {
pageInfo:{
page:1,
size:10,
total:0
},
moreNewsList:[],//搜索出来的新闻
}
},
created() {
// this.searchForNews();//搜索新闻
// this.highlights();//获取精彩回顾
var type=this.$route.query.type;
// type=3;3是最新消息,1是关注自己的法院 5,精彩回顾
if(type==3 || type==1){
this.fyxwfromCourt(type);
}else if(type==5){
this.highlights();//获取精彩回顾
}
},
//监听路由获取面包屑
watch: {
$route() {
if (this.$route.query.type) {
// type=3;3是最新消息,1是关注自己的法院 5,精彩回顾
if(type==3 || type==1){
this.fyxwfromCourt(type);
}else if(type==5){
this.highlights();//获取精彩回顾
}
}
},
},
methods:{
// 获取精彩回顾
highlights(){
this.pageInfo.fyId=32;
highlights(this.pageInfo).then(res=>{
if(res.success){
this.moreNewsList=res.data.records;
this.pageInfo.total=res.data.total;
}
})
},
// searchForNews(){
// console.log("搜索");
// let newsTitle=this.$route.query.subject;
// this.pageInfo.subject=newsTitle;
// searchForNews(this.pageInfo).then(res=>{
// if(res.success){
// this.searchNewsList=res.data.records;
// this.pageInfo.total= res.data.total;
// }
// });
// },
// 获取最新消息和关注自己法院
fyxwfromCourt(type){
// 法院新闻类型,1本院,2全市,3全区 即最新消息是3 关注是1;fyId是写死的默认高院
this.pageInfo.fyId=32;
this.pageInfo.type=type;
fyxwfromCourt(this.pageInfo).then(res=>{
if(res.success){
this.moreNewsList=res.data.records;
this.pageInfo.total=res.data.total;
}
})
},
pageChange(e) {
this.pageInfo.page = e;
var type=this.$route.query.type;
// type=3;3是最新消息,1是关注自己的法院 5,精彩回顾
if(type==3 || type==1){
this.fyxwfromCourt(type);
}else if(type==5){
this.highlights();//获取精彩回顾
}
},
sizeChange(e) {
this.pageInfo.size = e;
this.pageChange(1);
},
// 查看详情
setParams(val){
this.$router.push({
path:'/detail',//跳转路由
query:{//参数对象
newsId:val.newsId
}
});
},
}
}
</script>
<style lang="scss" scoped>
// 树形菜单图标start-----------------------
.el-tree{
background:transparent;
}
.el-tree /deep/ .el-tree-node__expand-icon.expanded
{
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
/*//有子节点 且未展开*/
.el-tree /deep/ .el-icon-caret-right:before
{
background: url("../../assets/wjjg.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
/*//有子节点 且已展开*/
.el-tree /deep/ .el-tree-node__expand-icon.expanded.el-icon-caret-right:before
{
background: url("../../assets/wjjk.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
/*//没有子节点*/
.el-tree /deep/ .el-tree-node__expand-icon.is-leaf::before
{
background: url("../../assets/wj.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
// 树形菜单图标end-----------------------
.top-info{
margin:15px 0;
border-bottom:2px solid #34bab2;
padding-bottom:15px;
}
.fist-text{
display:inline-block;
width:26px;
height:26px;
line-height:26px;
text-align:center;
font-size:15px;
color:#fff;
border-radius:50%;
background:#1a3784;
margin-right:3px;
}
.list-container{
// border:2px solid #34bab2;
// padding:15px 15px;
// margin-top:40px;
}
.list-title{
border-bottom:1px dashed #ccc;
line-height: 35px;
}
// 列表start
.type-list li{
list-style-type: square;
// color: #0099ff;
color: blue;
font-size: 16px;
line-height: 35px;
border-bottom: 1px dashed #ccc;
}
.type-list li a{
color: #333;
font-size: 14px;
text-decoration:none;
}
.type-list li:hover{
// color: #ff6900;
color: red;
}
.type-list li:hover a{
// color: #ff6900
color:red;
}
.type-list li:last-of-type{border-bottom:none;}
// 列表end
ul{
margin: 0px;
padding: 0px;
padding-left: 15px;
}
.zone-style{
background-color:#fff;
padding:15px 15px;
border-radius:5px;
box-shadow: -5px 0px 20px 5px rgba(0,0,0,0.05);
}
::v-deep{
.el-table th:first-child>.cell{
text-align:left!important;
}
}
</style>
\ No newline at end of file
<template>
<div>
<el-row>
<el-col :span="16" :offset="4">
<el-row class="top-info" style="">
<!--<span class="fist-text" style=""></span>
<span>作信息</span>-->
<div >
<span>当前位置:</span>
<el-breadcrumb style="display:inline-block;" separator-class="el-icon-arrow-right">
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
<el-breadcrumb-item>法院新闻</el-breadcrumb-item>
</el-breadcrumb>
</div>
</el-row>
<el-row :gutter="20">
<el-col :span="8">
<el-carousel height="250px" indicator-position="outside" :interval="4000">
<el-carousel-item v-for="item in imagesBox" :key="item.id">
<div class="carousel-div" style="">
<el-image :src="item.idView" style="width:100%;height:100%;"></el-image>
<div class="carousel-intro" style="">
南宁中院:市首个族老矛盾调处中心成立
</div>
</div>
</el-carousel-item>
</el-carousel>
<el-row class="mb-20">
<div class="top-info-news">
<span>新闻类总排行</span>
</div>
<div class="type-div">
<el-button>今天</el-button>
<el-button>一周</el-button>
<el-button>一个月</el-button>
<ul class="left-business-ul" style="list-style:none;margin:0;">
<li v-for="(item,index) in tableData" :key="index">
<div class="k-flex k-center k-space-between">
<div class="name-txt" style="max-width:80%;">
<span class="mr-2" style="font-weight:bold;font-size:15px;font-style: italic">{{index+1}}</span>
{{item.address}}
</div>
<div>{{item.date}}</div>
</div>
</li>
</ul>
</div>
</el-row>
</el-col>
<el-col :span="8">
<el-row class="mb-20">
<div class="top-info-title">
<span>最新消息</span>
</div>
<ul class="business-ul">
<li v-for="(item,index) in tableData" :key="index">
<div class="k-flex k-center k-space-between">
<div class="name-txt" style="max-width:80%;">{{item.address}}</div>
<div>{{item.date}}</div>
</div>
</li>
</ul>
</el-row>
<el-row >
<div class="top-info-title">
<span>关注自己的法院</span>
</div>
<ul class="business-ul">
<li v-for="(item,index) in tableData" :key="index">
<div class="k-flex k-center k-space-between">
<div class="name-txt" style="max-width:80%;">{{item.address}}</div>
<div>{{item.date}}</div>
</div>
</li>
</ul>
</el-row>
</el-col>
<el-col :span="8">
<div class="mt-10 top-info-title" style="border-bottom:none;">
<span>精彩回顾</span>
</div>
<div class="mt-5" style="text-align:right;">
<el-button icon="el-icon-arrow-left" size="small"></el-button>
<el-button icon="el-icon-arrow-right" size="small"></el-button>
</div>
<el-row :gutter="10">
<el-col :span="12">
<el-image style="" :src="require('../../assets/pic.jpg')"></el-image>
</el-col :span="12">
<el-col :span="12">
<div>
结果立刻发动进攻类库的结构来看到付即可购房贷款逛街看到路上经过考虑工具开发架构框架
<span style="color:red;font-size:10px;">[详细]</span>
</div>
</el-col :span="12">
</el-row>
<ul class="business-ul">
<li v-for="(item,index) in tableData" :key="index">
<div class="k-flex k-center k-space-between">
<div class="name-txt" style="max-width:80%;">{{item.address}}</div>
<div>{{item.date}}</div>
</div>
</li>
</ul>
</el-col>
</el-row>
<el-row>
<div class="scroll-nav">
<ul class="scroll-imgs-list">
<li class="scroll-imgs-li" v-for="item in imagesBox" :key="item.id">
<el-image class="scroll-img" :src="item.idView" ></el-image>
</li>
<!--<li class="scroll-imgs-li" v-for="item in imagesBox" :key="item.id">
<el-image class="scroll-img" :src="item.idView" ></el-image>
</li>-->
</ul>
</div>
</el-row>
<!--<el-row>
<div class="back_add">
<div class="threeImg">
<div class="Containt">
<div class="iconleft" @click="zuohua">
<i class="el-icon-arrow-left"></i>
</div>
<ul :style="{'left':calleft + 'px'}" v-on:mouseover="stopmove()" v-on:mouseout="move()">
<li v-for="(item,index) in superurl" :key="index">
<img :src="item.img">
</li>
</ul>
<div class="iconright" @click="youhua">
<i class="el-icon-arrow-right"></i>
</div>
</div>
</div>
</div>
</el-row>-->
<!--<el-row class="project-case">
el-col :span="24" class="title">
<router-link to="/customerCase" tag="span">经典案例</router-link>
</el-col>
<div class="content">
<div
class="content-list"
ref="contentList"
@mousedown.prevent="contentListMouseDown"
>
<el-col
class="content-item"
:span="4"
v-for="(item, index) in dataList"
:key="index"
>
<router-link :to="item.path">
<el-image class="swip-img" @mousedown.prevent="" @click="routerLink(item)" :src="item.url" alt="" ></el-image>
</router-link>
</el-col>
</div>
</div>
</el-row>-->
<!--<vue-seamless-scroll style="border:1px solid red;margin-top:15px;" :data="dataList" :class-option="optionLeft" class="seamless-warp3">
<ul class="item">
<li v-for="item in newsList" v-text="item.title">
</li>
</ul>
<div class="scroll-nav">-->
<!--<ul class="item">
<li v-for="(item,index) in dataList" :key="index">
<el-image style="width:100%;height:100%;" :src="item.url"></el-image>
</li>
</ul>-->
<!--</div>
</vue-seamless-scroll>-->
<!--<vue-seamless-scroll :data="listData" class="seamless-warp">
<ul class="item">
<li v-for="item in listData">
<span class="title" v-text="item.title"></span><span class="date" v-text="item.date"></span>
</li>
</ul>
</vue-seamless-scroll>-->
<div ref="itemWrapper" class="container" style="margin-top:15px;">
<div class="scroll-inline-container">
<div class="scroll-container">
<img src="http://lorempixel.com/200/300?key=1" />
<img src="http://lorempixel.com/200/300?key=2" />
<img src="http://lorempixel.com/200/300?key=3" />
<img src="http://lorempixel.com/200/300?key=4" />
<img src="http://lorempixel.com/200/300?key=5" />
</div>
<div class="scroll-container">
<img src="http://lorempixel.com/200/300?key=1" />
<img src="http://lorempixel.com/200/300?key=2" />
<img src="http://lorempixel.com/200/300?key=3" />
<img src="http://lorempixel.com/200/300?key=4" />
<img src="http://lorempixel.com/200/300?key=5" />
</div>
</div>
</div>
</el-col>
</el-row>
</div>
</template>
<script>
export default {
data() {
return {
newsList: [
{'title': 'A simple, seamless scrolling for Vue.js'},
{'title': 'A curated list of awesome things related to Vue.js'}
],
// superurl: [
// {
// url: "",
// img:require("../../assets/1.png")
// },
// {
// url: "",
// img:require("../../assets/pic.jpg")
// },
// {
// url: "",
// img:require("../../assets/2.png")
// },
// {
// url: "",
// img:
// "https://img.mukewang.com/szimg/5c7e6835087ef3d806000338-360-202.jpg"
// },
// {
// url: "",
// img:
// "https://img.mukewang.com/szimg/59b8a486000107fb05400300-360-202.jpg"
// },
// {
// url: "",
// img:
// "https://img.mukewang.com/szimg/5c7516fa081aab2b06000338-360-202.jpg"
// }
// ],
calleft: 0,
// bgColors: ['#E65D6E', '#30B08F', '#4AB7BD', '#FEC171', '#1890ff'],
imagesBox:[
{id:0,idView:require("../../assets/pic.jpg")},
{id:1,idView:require("../../assets/1.png")},
{id:2,idView:require("../../assets/2.png")},
// {id:3,idView:require("../../assets/3.png")},
],
tableData: [{
date: '09-28',
name: '24',
address: '【广西高院队...】广西高院队伍整顿简报官方首发的广东话'
}, {
date: '09-28',
name: '45',
address: '上海市普陀区金沙江路 1517 弄还是个哈哈哈'
}, {
date: '09-28',
name: '67',
address: '上海市普陀区金沙江路 1519 弄好好说话'
}, {
date: '09-28',
name: '89',
address: '上海市普陀区金沙江路 1516 弄合适的哈哈和'
}],
// start------------
userImage:[
{ img: require("../../assets/pic.jpg")},
{ img: require("../../assets/1.png") },
{ img: require("../../assets/2.png") },
{ img: require("../../assets/3.png")},
],
dataList: [
// 开头填充
{ url: require("../../assets/1.png") },
{ url: require("../../assets/2.png") },
{ url: require("../../assets/3.png")},
{ url: require("../../assets/pic.jpg")},
// { url: require("../../assets/1.png"), path: "/softwareProduct?id=2" },
// { url: require("../../assets/1.png"), path: "/caseDetail?id=0" },
// { url: require("../../assets/1.png"), path: "/caseDetail?id=1" },
// { url: require("../../assets/1.png"), path: "/caseDetail?id=2" },
// { url: require("../../assets/1.png"), path: "/softwareProduct?id=0" },
// { url: require("../../assets/1.png"), path: "/softwareProduct?id=1" },
// { url: require("../../assets/1.png")", path: "/softwareProduct?id=2" },
// { url: require("../../assets/1.png"), path: "/caseDetail?id=0" },
// { url: require("../../assets/1.png"), path: "/caseDetail?id=1" },
// { url: require("../../assets/1.png"), path: "/caseDetail?id=2" },
// 主体数据开始
// { url: require("../../assets/1.png"), path: "" },
// { url: require("../../assets/1.png"), path: "/softwareProduct?id=1" },
// { url: require("../../assets/1.png"), path: "/softwareProduct?id=2" },
// { url: require("../../assets/1.png"), path: "/caseDetail?id=0" },
// { url: require("../../assets/1.png"), path: "/caseDetail?id=1" },
// { url: require("../../assets/1.png"), path: "/caseDetail?id=2" },
// 主体数据结束
// 末尾填充
// { url: require("../../assets/2.png"), path: "" },
// { url: require("../../assets/2.png"), path: "/softwareProduct?id=1" },
// { url: require("../../assets/1.png"), path: "/softwareProduct?id=2" },
// { url: require("../../assets/1.png"), path: "/caseDetail?id=0" },
// { url: require("../../assets/1.png"), path: "/caseDetail?id=1" },
// { url: require("../../assets/1.png"), path: "/caseDetail?id=2" },
// { url: require("../../assets/1.png"), path: "/softwareProduct?id=0" },
// { url: require("../../assets/1.png"), path: "/softwareProduct?id=1" },
// { url: require("../../assets/1.png"), path: "/softwareProduct?id=2" },
// { url: require("../../assets/1.png"), path: "/caseDetail?id=0" },
// { url: require("../../assets/1.png"), path: "/caseDetail?id=1" },
// { url: require("../../assets/1.png"), path: "/caseDetail?id=2" },
],
// timerId: "",
// count: 0,
// stopFlag: false,
// mousePosition_down: "",//鼠标点击时的位置
// contentListWidth:'',//list的宽度
// listLength:2,//要显示的图片占据的list
// moveFlag:false,//鼠标拖动时,阻止路由跳转
// mousePosition_up: "",
// end--------------
}
},
// computed: {
// optionCustomer(){
// return {
// // step: 0.2, // 数值越大速度滚动越快
// // direction: 2,// 0向下 1向上 2向左 3向右
// // limitMoveNum:2,// 开始无缝滚动的数据量 this.dataList.length
// // hoverStop: true, // 是否开启鼠标悬停stop
// // openWatch: true, // 开启数据实时监控刷新do
// // singleHeight: 0, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
// // singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
// // waitTime: 1000 // 单步运动停止的时间(默认值1000ms)
// step: 1,
// direction: 2,// 0向下 1向上 2向左 3向右
// limitMoveNum: 5,
// openTouch: false,
// // waitTime: 1,
// singleWidth: 30
// }
// }
// },
// computed: {
// optionLeft () {
// return {
// direction: 2,
// limitMoveNum: 4
// // direction:4,
// // limitMoveNum: 4
// }
// }
// },
// mounted() {
// setTimeout(() => {
// this._getItemLength()
// }, 20);
// }
created() {
// // 定时器滚动
// this.$refs.contentList.addEventListener("mouseenter", () => {
// this.stopFlag = true;
// });
// this.$refs.contentList.addEventListener("mouseleave", () => {
// this.stopFlag = false;
// // 在mouseleave时也移除move和up事件
// this.mouseUp()
// });
// this.contentListWidth = parseInt(getComputedStyle(this.$refs.contentList).width);
// this.count = parseInt(getComputedStyle(this.$refs.contentList).width);
// // console.log(this.count);
// this.timerId = setInterval(() => {
// if (this.stopFlag) return;
// this.count++;
// if (
// this.count == this.contentListWidth * this.listLength
// ) {
// this.count = this.contentListWidth
// }
// this.$refs.contentList.style.transform = `translateX(-${this.count}px)`;
// }, 15);
},
// beforeDestroy(){
// clearInterval(this.timerId)
// },
// created(){
// this.move();
// },
methods: {
_getItemLength() {
let children = this.$refs.itemWrapper.children;
console.log(children.length);
return children.length;
}
// routerLink(item){
// if(this.moveFlag) return
// this.$router.push(item.path)
// },
// // 鼠标按下时,添加move 和up事件
// contentListMouseDown(e) {
// // console.log("down", e.offsetX);
// this.mousePosition_down = e.offsetX;
// this.$refs.contentList.addEventListener("mousemove", this.mouseMove);
// this.$refs.contentList.addEventListener("mouseup", this.mouseUp);
// },
// // 鼠标up时,移除move和up事件
// mouseUp() {
// setTimeout(() => {
// this.moveFlag = false
// }, 0);
// // console.log("up", e.offsetX);
// this.removeListener()
// // 拖动到列表最前面时
// if(this.count < this.contentListWidth){
// console.log('小')
// this.count = parseInt(this.count) + this.contentListWidth * this.listLength
// this.$refs.contentList.style.transform = `translateX(-${this.count}px)`;
// }
// // 拖动到列表最后面时
// if(this.count > this.contentListWidth * (this.listLength + 1)){
// console.log(this.count / this.contentListWidth)
// console.log('最大')
// this.count = parseInt(this.count) - this.listLength * this.contentListWidth
// this.$refs.contentList.style.transform = `translateX(-${this.count}px)`;
// }
// },
// // 鼠标move时,list跟随移动
// mouseMove(e) {
// this.moveFlag = true
// // console.log("move", e.offsetX);
// let mousePosition_move = e.offsetX;
// this.count = parseInt(this.mousePosition_down) - mousePosition_move + parseInt(this.count);
// // console.log(this.count);
// this.$refs.contentList.style.transform = `translateX(-${this.count}px)`;
// },
// // 移除contentlist的mousemove 和 mouseup;在鼠标up、鼠标移出此元素、时。
// removeListener(){
// this.$refs.contentList.removeEventListener("mousemove", this.mouseMove);
// this.$refs.contentList.removeEventListener("mouseup", this.mouseUp);
// }
// //移动
// move() {
// this.timer = setInterval(this.starmove, 5000);
// },
// //开始移动
// starmove() {
// this.calleft -= 340;
// if (this.calleft < -1200) {
// this.calleft = 0;
// }
// },
// //鼠标悬停时停止移动
// stopmove() {
// clearInterval(this.timer);
// },
// //点击按钮左移
// zuohua() {
// this.calleft -= 340;
// if (this.calleft < -1200) {
// this.calleft = 0;
// }
// },
// //点击按钮右移
// youhua() {
// this.calleft += 340;
// if (this.calleft > 0) {
// this.calleft = -1020;
// }
// }
}
}
</script>
<style lang="scss" scoped>
.top-info{
margin:15px 0;
border-bottom:2px solid #34bab2;
padding-bottom:15px;
}
.top-info-title{
border-bottom:2px solid #34bab2;
padding-bottom:5px;
font-weight:bold;
}
.top-info-news{
border-bottom:2px solid black;
padding-bottom:5px;
font-weight:bold;
padding-left:5px;
}
.fist-text{
display:inline-block;
width:26px;
height:26px;
line-height:26px;
text-align:center;
font-size:15px;
color:#fff;
border-radius:50%;
background:#1a3784;
margin-right:3px;
}
.list-container{
border:2px solid #34bab2;
padding:15px 15px;
margin-top:40px;
}
.list-title{
border-bottom:1px dashed #ccc;
line-height: 35px;
}
// 列表start
.type-list li{
list-style-type: square;
// color: #0099ff;
color: blue;
font-size: 16px;
line-height: 35px;
border-bottom: 1px dashed #ccc;
}
.type-list li a{
color: #333;
font-size: 14px;
text-decoration:none;
}
.type-list li:hover{
// color: #ff6900;
color: red;
}
.type-list li:hover a{
// color: #ff6900
color:red;
}
.type-list li:last-of-type{border-bottom:none;}
// 列表end
ul{
margin: 0px;
padding: 0px;
padding-left: 15px;
}
// 轮播图
.carousel-div{
position:relative;
height:100%;
}
.carousel-intro{
position:absolute;
width:100%;
height:25px;
line-height:25px;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
background:rgba(5, 23, 17, 0.21);
color:#fff;
padding:0 5px;
font-size:12px;
left:0;
bottom:0;
}
.business-ul{
margin:0;
margin-top:10px;
}
.business-ul li{
width:100%;
font-size:13px;
}
.business-ul li .name-txt{
max-width:90%;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.business-ul li {
text-decoration:none;
width:100%;
}
.business-ul li :hover {
text-decoration:none;
color:red;
}
.business-ul li+li{
margin-top:5px;
}
.type-div{
padding:5px;
border-left:2px solid #34bab2;
border-right:2px solid #34bab2;
border-bottom:2px solid #34bab2;
}
.left-business-ul{
margin:0;
// padding-top:10px !important;
padding-left:0;
padding:5px;
// border-left:2px solid #34bab2;
// border-right:2px solid #34bab2;
// border-bottom:2px solid #34bab2;
}
.left-business-ul li{
width:100%;
font-size:13px;
height:30px;
line-height:30px;
margin:0 !important;
padding:0 !important;
}
.left-business-ul li:not(:last-child) {
border-bottom:1px solid #ccc;
}
.left-business-ul li .name-txt{
max-width:90%;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.left-business-ul li {
text-decoration:none;
width:100%;
}
.left-business-ul li :hover {
text-decoration:none;
color:red;
}
.left-business-ul li+li{
margin-top:5px;
}
// 图片持续滚动动画
.scroll-imgs-list {
list-style: none;
}
.scroll-nav {
// width: 750px;
// height: 170px;
border: 1px solid red;
// margin: 100px auto;
overflow: hidden;
}
.scroll-imgs-list {
width: 200%;
height: 100%;
// animation: picmove 5s linear infinite forwards;
animation:move 4s linear infinite;
}
// @keyframes move {
// 0% {
// transform: translateX(0);
// }
// 100% {
// transform: translateX(-100%);
// }
// }
// @keyframes picmove {
// from {
// transform: translate(0);
// }
// to {
// transform: translate(-750px);
// }
// }
.scroll-imgs-li{
float: left;
}
.scroll-imgs-list .scroll-img{
width: 250px;
height: 170px;
float: left;
}
.scroll-imgs-list:hover {
animation-play-state: paused;
}
// 跑马灯
// #wrap{
// width: 500px;
// height: 100px;
// border: 1px solid #000;
// position: relative;
// margin: 100px auto;
// overflow: hidden;
// }
// #list{
// position: absolute;
// left: 0;
// top: 0;
// margin: 0;
// padding: 0;
// -webkit-animation: 3s move infinite linear;
// width: 200%;
// }
// #list li {
// list-style: none;
// width: 98px;
// height: 98px;
// border: 1px solid #fff;
// background: #000;
// color: #fff;
// font: 50px/98px Arial;
// text-align: center;
// float: left;
// }
// @-webkit-keyframes move{
// 0% {
// left: 0;
// }
// 100% {
// left: -500px;
// }
// }
// @keyframes move {
// 0% {
// left: 0;
// }
// 100% {
// left: -500px;
// }
// }
// #wrap:hover #list {
// -webkit-animation-play-state: paused; /*动画暂停播放*/
// }
/*超链接图片*/
// #divAdd {
// background-color: #ededed;
// /*width: 100%;*/
// /*min-width: 1200px;*/
// width: 1000px;
// margin: 0px auto;
// }
// .divAdd-con {
// margin: 0px auto;
// width: 1000px;
// overflow: auto;
// padding: 30px 0px;
// }
// .divAdd-con img {
// float: left;
// }
// .indexrt {
// margin: 0px 40px;
// }
// .divAddleft img {
// float: left;
// margin-bottom: 7px;
// }
// .divAddleft {
// float: left;
// display: inline;
// width: 370px;
// }
// .divAddrt {
// float: right;
// display: inline;
// margin-top: 7px;
// }
// .back_add {
// background-color: #ededed;
// }
// .divAdd-con img {
// border: none;
// }
// a:focus,
// a:hover {
// color: #23527c;
// }
// .threeImg {
// height: 158px;
// background: #ededed;
// border-bottom: 3px solid #4679b2;
// min-width: 1000px;
// }
// .threeImg .Containt ul {
// margin: 0 auto;
// width: 2400px;
// position: absolute;
// left: 0px;
// cursor: pointer;
// height: 100%;
// }
// .threeImg .Containt ul li {
// width: 300px;
// margin-right: 40px;
// margin-top: 10px;
// float: left;
// }
// .threeImg .Containt ul li img {
// height: 128px;
// width: 100%;
// }
// .Containt {
// position: relative;
// width: 1000px;
// height: 130px;
// overflow: hidden;
// margin: 0 auto;
// }
// .iconleft {
// position: absolute;
// width: 20px;
// height: 80px;
// top: 10px;
// z-index: 99999;
// padding-top: 48px;
// background-color: #ddd;
// vertical-align: middle;
// }
// .iconright {
// position: relative;
// left: 978px;
// top: 70px;
// background-color: #ddd;
// /*position: absolute;*/
// width: 20px;
// height: 80px;
// top: 10px;
// z-index: 99999;
// padding-top: 48px;
// background-color: #ddd;
// vertical-align: middle;
// }
// 走马灯======================
// .project-case {
// padding-bottom: 3rem;
// overflow: hidden;
// .title {
// font-size: 3.6rem;
// padding: 5rem 0;
// span {
// cursor: pointer;
// }
// }
// .content {
// margin-top:15px;
// .content-list {
// user-select: none;
// transform: translateX(-33.33%);
// display: flex;
// flex-wrap: nowrap;
// width: 100%;
// .content-item {
// padding-right:10px;
// width:100%;
// .swip-img {
// transition: all 0.5s;
// width: 100%;
// cursor: pointer;
// &:hover {
// transform: scale(1.3);
// }
// }
// }
// }
// }
// }
.seamless-warp3 {
overflow: hidden;
height: 25px;
// width: 380px;
width: 100%;
ul{
list-style:none;
margin:0;
padding:0;
}
ul .item {
width: 120%;
// width: 580px;
// background:blue;
li {
float: left;
// width: 380px;
// height: 25px;
// margin-right: 10px;
}
}
}
</style>
<style lang="scss" scoped>
// .seamless-warp2 {
// margin-top:15px;
// border:1px solid red;
// overflow: hidden;
// height: 25px;
// width: 380px;
// ul.item {
// list-style:none;
// width: 580px;
// li {
// float: left;
// margin-right: 10px;
// }
// }
// }
// .userImage {
// overflow:hidden;
// .userImageAllWrapper {
// width:1160px;
// list-style:none;
// display:flex;
// // flex-wrap:wrap;
// &:last-child {
// margin-left: -40px;
// }
// li {
// margin-right: 20px;
// margin-bottom :20px;
// padding: 10px 30px;
// border: 1px solid #ECECEC;
// img {
// display:flex;
// }
// }
// }
// }
.container {
// width: 510px;
width: 100%;
height: 300px;
display: inline-block;
overflow: hidden;
}
.scroll-inline-container {
white-space: nowrap;
overflow-x: scroll;
font-size: 0;
}
.scroll-container {
display: inline-block;
animation: infiniteScroll 15s linear infinite;
}
.scroll-container img {
width: 200px;
height: 300px;
margin-right: 5px;
}
@keyframes infiniteScroll {
0% {
transform: translate3d(0, 0, 0);
}
100% {
transform: translate3d(-100%, 0, 0);
}
}
</style>
<template>
<div>
<el-row>
<el-col :span="18" :offset="3">
<!--<el-row class="top-info" style="">
<div >
<span>当前位置:</span>
<el-breadcrumb style="display:inline-block;" separator-class="el-icon-arrow-right">
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
<el-breadcrumb-item>法院新闻</el-breadcrumb-item>
</el-breadcrumb>
</div>
</el-row>-->
<!--第一栏开始-->
<el-row :gutter="20" class="mt-15 first-zone-style">
<el-col :span="8" style="padding-left:0;padding-right:0;">
<div >
<el-carousel style="border-radius:8px;" height="280px" :interval="4000">
<el-carousel-item style="border-radius:8px;" v-for="item in newestList.slice(0,3)" :key="item.newsId">
<div v-if="item.attInfoList" class="carousel-div" style="border-radius:8px;" @click="setParams(item)">
<el-image v-if="item.attInfoList[0] && item.attInfoList[0].downloadPath" :src="item.attInfoList[0].downloadPath" style="width:100%;height:100%;"></el-image>
<div class="carousel-intro" style="">
{{item.subject}}
</div>
</div>
</el-carousel-item>
</el-carousel>
</div>
<div class="mt-10 zone-style">
<div class="mb-15 k-flex-between-center">
<div class="k-flex k-align-center">
<el-image class="mr-5 gong-icon" style="" :src="require('../../assets/news/1.png')"></el-image>
<div>新闻总类排行</div>
</div>
<div style="font-size:12px;color: #999999;">
<!--<span>MORE></span>-->
<el-button :class="[{'active-btn':activeBtn==1}]" style="" @click="fyxwClickRaking(1)">今天</el-button>
<el-button :class="[{'active-btn':activeBtn==2}]" @click="fyxwClickRaking(2)">一周</el-button>
<el-button :class="[{'active-btn':activeBtn==3}]" @click="fyxwClickRaking(3)">一个月</el-button>
</div>
</div>
<div v-for="(item,index) in newsRankList" :key="index" class="k-flex k-space-between top-list" @click="setParams(item)">
<div class="article-name">
<span class="right-line">
{{ item.boardName }}
<span class="line-div"></span>
</span>
<span >{{item.subject}}</span>
</div>
<div>{{item.date}}</div>
</div>
</div>
</el-col>
<el-col :span="16" style="">
<el-row :gutter="20">
<el-col :span="12" style="">
<div class="zone-style">
<div class="k-flex-between-center">
<!--<span class="fist-text" style=""></span>
<span>日头条</span>-->
<div class="btns-switch">
<el-button @click.native="switchBtn(3)" :class="['btn-item',{'sanjiao':activeItem==3}]">最新消息</el-button>
<el-button @click.native="switchBtn(1)" :class="['btn-item',{'sanjiao':activeItem==1}]">关注自己的法院</el-button>
</div>
<div @click="seeMoreEvent(activeItem)" style="font-size:12px;color: #999999;">
<span>MORE></span>
</div>
</div>
<!--最新消息开始-->
<div v-if="activeItem==3">
<div @click="setParams(newestList[0])" class="mt-10 mb-5 k-flex k-align-center">
<el-image class="mr-5 gong-icon" style="width:13px;height:13px;" :src="require('../../assets/home/gonggao.png')"></el-image>
<div v-if="newestList[0]" class="gonggao-text">
<!-- <span >{{ newestList[0].boardName }}</span> -->
<span>{{newestList[0].subject}}</span>
</div>
</div>
<div v-for="(item,index) in newestList" :key="index" class="k-flex k-space-between top-list" @click="setParams(item)">
<div class="article-name">
<span class="right-line">
{{item.boardName}}
<span class="line-div"></span>
</span>
<span >{{item.subject}}</span>
</div>
<div>{{item.date}}</div>
</div>
</div>
<!-- 最新消息结束 -->
<!-- 关注自己的法院开始 -->
<div v-if="activeItem==1" class="mt-10">
<div v-for="(item,index) in newsConernList" :key="index" class="k-flex k-space-between top-list" @click="setParams(item)">
<div class="article-name">
<span class="right-line">
{{item.boardName}}
<span class="line-div"></span>
</span>
<span >{{item.subject}}</span>
</div>
<div>{{item.date}}</div>
</div>
</div>
<!--关注自己的法院结束-->
</div>
</el-col>
<el-col :span="12" >
<div class="zone-style">
<div class="k-flex-between-center">
<div class="k-flex k-align-center">
<el-image class="mr-5 gong-icon" style="" :src="require('../../assets/news/3.png')"></el-image>
<div>精彩回顾</div>
</div>
<div @click="seeMoreEvent(5)" style="font-size:12px;color: #999999;">
<span>MORE></span>
</div>
</div>
<el-row class="mt-10 mb-10" :gutter="10">
<el-col :span="12" v-if="highlightsData[0]">
<el-image v-if="highlightsData[0].attInfoList && highlightsData[0].attInfoList[0]" style="" :src="highlightsData[0].attInfoList[0].downloadPath"></el-image>
</el-col >
<el-col :span="12">
<div v-if="highlightsData[0]" class="re-see">
<div class="hightlight-v" v-html="highlightsData[0].content"></div>
<span @click="setParams(highlightsData[0])" style="color:red;font-size:10px;">[详细]</span>
</div>
</el-col >
</el-row>
<div v-for="item in highlightsData" :key="item.newsId" class="k-flex k-space-between top-list" @click="setParams(item)">
<div class="article-name">
<span class="right-line">{{item.subject}}</span>
</div>
<div>{{item.date}}</div>
</div>
</div>
</el-col>
</el-row>
<el-row class="mt-10">
<div class="zone-style">
<div class="k-flex-between-center">
<div class="k-flex k-align-center">
<el-image class="mr-5 gong-icon" style="" :src="require('../../assets/news/2.png')"></el-image>
<div>干警作品</div>
</div>
<div @click="toMorelist(135)" style="font-size:12px;color: #999999;">
<span>MORE></span>
</div>
</div>
<el-row class="mt-15" :gutter="20">
<el-col style="border-radius:5px;" :span="8" v-for="item in newsGanList.slice(0,5)" :key="item.id" >
<div class="imgs-div" style="width:100%;border-radius:8px;" @click="setParams(item)">
<el-image :src="item.attInfoList[0].downloadPath" style="width:100%;display:block;border-radius:5px;">
</el-image>
<div class="imgs-intro" style="width:100%;border-radius:0 0 5px 5px;">
<span>&ensp;{{item.subject}}&ensp;</span>
</div>
</div>
</el-col>
</el-row>
</div>
</el-row>
</el-col>
</el-row>
<!--第一栏结束-->
</el-col>
</el-row>
</div>
</template>
<script>
import {
fyxwfromCourt, //获取法院新闻
fyxwClickRaking,//法院新闻排行
highlights,//精彩回顾
} from "@/api/news.js";
import {
newsFromBoard, //获取栏目下的新闻列表
// getSubLevelBoard
} from "@/api/list.js"
export default {
data() {
return {
highlightsData:[],//精彩回顾集合
activeBtn:1,//新闻分类排行
pageInfo:{
page:1,
size:6,
},
newestList:[],//最新消息
newsConernList:[],//关注自己的法院
newsRankList:[],//法院新闻排行
newsGanList:[],//干警作品
activeItem:3,
newsList: [
// {'title': 'A simple, seamless scrolling for Vue.js'},
// {'title': 'A curated list of awesome things related to Vue.js'}
],
}
},
created() {
this.fyxwfromCourt(3);//一加载先获取最新消息
this.fyxwClickRaking(1);//获取法院新闻排行
this.newsFromBoard();//干警作品
this.highlights();//获取精彩回顾
},
methods: {
// 跳转到更所模块
toMorelist(boardId){
this.$router.push({
path: "/list", //跳转路由
query: {
//参数对象
boardId: boardId,
type:'menu'
},
});
},
// 获取精彩回顾
highlights(){
highlights({page:1,size:5,fyId:32}).then(res=>{
if(res.success){
this.highlightsData=res.data.records;
this.highlightsData.forEach(item=>{
item.date=(item.newsTime).substring(5,10);
})
}
})
},
// 获取最新消息和关注自己法院
fyxwfromCourt(type){
// 法院新闻类型,1本院,2全市,3全区 即最新消息是3 关注是1;fyId是写死的默认高院
fyxwfromCourt({fyId:32,page:1,size:5,type:type}).then(res=>{
if(res.success){
res.data.records.forEach(item=>{
item.date=(item.newsTime).substring(5,10);
})
if(type==3){
this.newestList=res.data.records;
console.log('this.newestList==',this.newestList);
}else if(type==1){
this.newsConernList=res.data.records;
console.log('this.newsConernList==',this.newsConernList);
}
}
})
},
//法院新闻排行
fyxwClickRaking(type){
this.activeBtn=type;
var params={};
// type为1按日,2按月,3按周
if(type==1){
params.byDay='1';//按日
}
if(type==2){
params.byMonth='1';//按月
}
if(type==3){
params.byWeek='1';//按周
}
// params.byDay='';//按日
// params.byMonth='';//按月
// params.byWeek='';//按周
// params.fyId=32;//法院id
// params.weekEnd=32;//周结束日
// params.weekStart=32;//周开始日
fyxwClickRaking(JSON.stringify(params)).then(res=>{
if(res.success){
this.newsRankList=res.data;
this.newsRankList.forEach(item=>{
item.date=(item.newsTime).substring(5,10);
})
console.log('this.newsRankList==',this.newsRankList);
}
})
},
//获取法院新闻列表--传固定boardId干警作品
newsFromBoard() {
this.pageInfo.boardId=135;//干警作品总的boardId
newsFromBoard(JSON.stringify(this.pageInfo)).then((res) => {
if (res.success) {
console.log(res);
let {newsList,top}=res.data;
this.newsGanList=newsList.records;
// this.pageInfo.total=newsList.total;
}
});
},
_getItemLength() {
let children = this.$refs.itemWrapper.children;
console.log(children.length);
return children.length;
},
switchBtn(i){
console.log('111===', i)
this.activeItem=i;
this.fyxwfromCourt(i);
},
// 查看详情
setParams(val){
console.log('val==',val);
this.$router.push({
path:'/detail',//跳转路由
query:{//参数对象
newsId:val.newsId
}
});
},
seeMoreEvent(type) {
// type=3;3是最新消息,1是关注自己的法院 5,精彩回顾
console.log("更多",type);
this.$router.push({
path: "/more", //跳转路由
query: {
//参数对象
type: type,
},
});
},
}
}
</script>
<style lang="scss" scoped>
// 精彩回顾
.hightlight-v{
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;
}
::v-deep{
// 设置轮播图指示器大小
.el-carousel__button{
width:5px;
}
}
.active-btn{
background:#D33237;
color:#fff;
}
// 第一栏
.first-zone-style{
margin-left:0!important;
margin-right:0!important;
}
.zone-style{
background-color:#fff;
padding:15px 15px;
border-radius:5px;
box-shadow: -5px 0px 20px 5px rgba(0,0,0,0.05);
}
.carousel-div{
position:relative;
height:100%;
}
.carousel-intro{
position:absolute;
width:100%;
height:25px;
line-height:25px;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
background:rgba(5, 23, 17, 0.21);
color:#fff;
padding:0 5px;
font-size:12px;
left:0;
bottom:0;
}
.zone-style{
background-color:#fff;
padding:15px 15px;
border-radius:5px;
box-shadow: -5px 0px 20px 5px rgba(0,0,0,0.05);
}
// 切换气泡按钮
.btns-switch .btn-item{
display:inline-block;
text-align:center;
border: 1px solid #ff756d;
border-radius: 5px;
color:#ff756d;
}
.btns-switch .sanjiao{
background:#D33237;
color:#fff;
position:relative;
}
.sanjiao:after {
position: absolute;
display: inline-block;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-top: 8px solid #D33237;
left:30px;
bottom: -8px;
content: '';
}
// 公告
.gong-icon{
width:15px;
height:15px;
}
.gonggao-text{
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
color:#FF756D;
font-family: PingFang SC, PingFang SC-Medium;
font-size:13px;
}
.top-info{
margin:15px 0;
border-bottom:2px solid #34bab2;
padding-bottom:15px;
}
.top-info-title{
border-bottom:2px solid #34bab2;
padding-bottom:5px;
font-weight:bold;
}
.top-info-news{
border-bottom:2px solid black;
padding-bottom:5px;
font-weight:bold;
padding-left:5px;
}
.fist-text{
display:inline-block;
width:26px;
height:26px;
line-height:26px;
text-align:center;
font-size:15px;
color:#fff;
border-radius:50%;
background:#1a3784;
margin-right:3px;
}
.list-container{
border:2px solid #34bab2;
padding:15px 15px;
margin-top:40px;
}
.list-title{
border-bottom:1px dashed #ccc;
line-height: 35px;
}
// 列表start
.type-list li{
list-style-type: square;
color: blue;
font-size: 16px;
line-height: 35px;
border-bottom: 1px dashed #ccc;
}
.type-list li a{
color: #333;
font-size: 14px;
text-decoration:none;
}
.type-list li:hover{
color: red;
}
.type-list li:hover a{
color:red;
}
.type-list li:last-of-type{border-bottom:none;}
// 列表end
ul{
margin: 0px;
padding: 0px;
padding-left: 15px;
}
// 轮播图
.carousel-div{
position:relative;
height:100%;
}
.carousel-intro{
position:absolute;
width:100%;
height:25px;
line-height:25px;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
background:rgba(5, 23, 17, 0.21);
color:#fff;
padding:0 5px;
font-size:12px;
left:0;
bottom:0;
}
.top-line{
padding:5px 15px;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
border-bottom:1px solid #ccc;
}
.top-list .article-name .right-line{
padding-right:2px;
margin-right:5px;
position:relative;
color:black;
}
.line-div{
position:absolute;
right:0;
top:0;
height:30px;
width:2px;
background:black;
}
.top-list .article-name{
width:85%;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
color:#999999;
}
.re-see{
font-size:12px;
color: #333333;
}
.top-list{
padding:5px 0;
font-size:10px;
color:black;
}
.top-list:hover{
color:red;
}
.top-list:hover .article-name{
color:red;
}
.top-list:hover .right-line{
color:red ;
}
// 图片墙
.imgs-div{
position:relative;
height:100%;
}
.imgs-div{
margin-bottom:10px;
}
.imgs-intro{
position:absolute;
height:25px;
line-height:25px;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
background:#ccc;
color:#fff;
font-size:12px;
left:0;
bottom:0;
}
.business-ul{
margin:0;
margin-top:10px;
}
.business-ul li{
width:100%;
font-size:13px;
}
.business-ul li .name-txt{
max-width:90%;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.business-ul li {
text-decoration:none;
width:100%;
}
.business-ul li :hover {
text-decoration:none;
color:red;
}
.business-ul li+li{
margin-top:5px;
}
.type-div{
padding:5px;
border-left:2px solid #34bab2;
border-right:2px solid #34bab2;
border-bottom:2px solid #34bab2;
}
.left-business-ul{
margin:0;
padding-left:0;
padding:5px;
}
.left-business-ul li{
width:100%;
font-size:13px;
height:30px;
line-height:30px;
margin:0 !important;
padding:0 !important;
}
.left-business-ul li:not(:last-child) {
border-bottom:1px solid #ccc;
}
.left-business-ul li .name-txt{
max-width:90%;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.left-business-ul li {
text-decoration:none;
width:100%;
}
.left-business-ul li :hover {
text-decoration:none;
color:red;
}
.left-business-ul li+li{
margin-top:5px;
}
// 图片持续滚动动画
.scroll-imgs-list {
list-style: none;
}
.scroll-nav {
border: 1px solid red;
overflow: hidden;
}
.scroll-imgs-list {
width: 200%;
height: 100%;
animation:move 4s linear infinite;
}
.scroll-imgs-li{
float: left;
}
.scroll-imgs-list .scroll-img{
width: 250px;
height: 170px;
float: left;
}
.scroll-imgs-list:hover {
animation-play-state: paused;
}
.seamless-warp3 {
overflow: hidden;
height: 25px;
// width: 380px;
width: 100%;
ul{
list-style:none;
margin:0;
padding:0;
}
ul .item {
width: 120%;
// width: 580px;
// background:blue;
li {
float: left;
// width: 380px;
// height: 25px;
// margin-right: 10px;
}
}
}
</style>
<style lang="scss" scoped>
.container {
width: 100%;
height: 300px;
display: inline-block;
overflow: hidden;
}
.scroll-inline-container {
white-space: nowrap;
overflow-x: scroll;
font-size: 0;
}
.scroll-container {
display: inline-block;
animation: infiniteScroll 15s linear infinite;
}
.scroll-container img {
width: 200px;
height: 300px;
margin-right: 5px;
}
@keyframes infiniteScroll {
0% {
transform: translate3d(0, 0, 0);
}
100% {
transform: translate3d(-100%, 0, 0);
}
}
</style>
<template>
<div >
<el-row >
<el-col :span="16" :offset="4">
<el-row class="top-info" style="">
<span class="fist-text" style=""></span>
<span>作信息</span>
<div style="float:right;">
<span>当前位置:</span>
<el-breadcrumb style="display:inline-block;" separator-class="el-icon-arrow-right">
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
<el-breadcrumb-item>活动管理</el-breadcrumb-item>
</el-breadcrumb>
</div>
</el-row>
<el-row :gutter="20">
<el-col :span="8">
<div class="list-container" style="">
<div class="list-title" style="">按分类查看</div>
<ul class="type-list">
<li><a href="#">最高法通报</a></li>
<li><a href="#">最高人民法院简报</a></li>
</ul>
</div>
</el-col>
<el-col :span="16">
<div style="min-height:76vh;">
<el-table
:header-cell-style="{'text-align':'center','font-size':'13px','color':'black'}"
:cell-style="{'font-size':'13px','border-bottom':'none'}"
ref="singleTable"
:data="tableData"
highlight-current-row
@current-change="handleCurrentChange"
style="width: 100%">
<el-table-column
property="address"
label="标题">
</el-table-column>
<el-table-column
align="center"
property="date"
label="时间"
width="150">
</el-table-column>
<el-table-column
align="center"
property="name"
label="点击"
width="120">
</el-table-column>
<el-table-column
align="center"
property="name"
label="评论"
width="50">
</el-table-column>
</el-table>
<div style="margin-top:10px;">
<el-pagination
prev-text="上一页"
next-text="下一页"
layout="total,sizes,prev, pager, next,jumper"
:total="1000"
page-sizes=""
page-size="15"
current-page="1"
@current-change=""
@size-change=""
/>
</div>
</div>
</el-col>
</el-row>
</el-col>
</el-row>
</div>
</template>
<script>
export default {
name: "show",
data() {
return {
tableData: [{
date: '2016-05-02 12:00:00',
name: '24',
address: '【广西高院队...】广西高院队伍整顿简报'
}, {
date: '2016-05-04 12:00:00',
name: '45',
address: '上海市普陀区金沙江路 1517 弄'
}, {
date: '2016-05-01 12:00:00',
name: '67',
address: '上海市普陀区金沙江路 1519 弄'
}, {
date: '2016-05-03 12:00:00',
name: '89',
address: '上海市普陀区金沙江路 1516 弄'
}],
}
},
created() {
},
methods:{
}
}
</script>
<style lang="scss" scoped>
.top-info{
margin:15px 0;
border-bottom:2px solid #34bab2;
padding-bottom:15px;
}
.fist-text{
display:inline-block;
width:26px;
height:26px;
line-height:26px;
text-align:center;
font-size:15px;
color:#fff;
border-radius:50%;
background:#1a3784;
margin-right:3px;
}
.list-container{
border:2px solid #34bab2;
padding:15px 15px;
margin-top:40px;
}
.list-title{
border-bottom:1px dashed #ccc;
line-height: 35px;
}
// 列表start
.type-list li{
list-style-type: square;
// color: #0099ff;
color: blue;
font-size: 16px;
line-height: 35px;
border-bottom: 1px dashed #ccc;
}
.type-list li a{
color: #333;
font-size: 14px;
text-decoration:none;
}
.type-list li:hover{
// color: #ff6900;
color: red;
}
.type-list li:hover a{
// color: #ff6900
color:red;
}
.type-list li:last-of-type{border-bottom:none;}
// 列表end
ul{
margin: 0px;
padding: 0px;
padding-left: 15px;
}
</style>
\ No newline at end of file
<template>
<div >
<el-row >
<el-col :span="18" :offset="3">
<!--<el-row class="top-info" style="">
<span class="fist-text" style=""></span>
<span>作信息</span>
<div style="float:right;">
<span>当前位置:</span>
<el-breadcrumb style="display:inline-block;" separator-class="el-icon-arrow-right">
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
<el-breadcrumb-item>活动管理</el-breadcrumb-item>
</el-breadcrumb>
</div>
</el-row>-->
<el-row class="mt-20" :gutter="20">
<!--左边栏目开始-->
<el-col :span="5">
<div class="list-container" style="">
<div class="list-title mb-10" style="">按分类查看</div>
<!--<ul class="type-list">
<li><a href="#">最高法通报</a></li>
<li><a href="#">最高人民法院简报</a></li>
</ul>-->
<!--<el-tree :data="dataTreeFile" :props="defaultProps" @node-click="handleNodeClick"></el-tree>-->
<ul class="type-list">
<li><a href="#">最高法通报</a></li>
<li><a href="#">最高人民法院简报</a></li>
</ul>
</div>
</el-col>
<!--左边栏目结束-->
<el-col :span="19">
<div class="zone-style">
<div style="min-height:76vh;">
<div style="">
<span>当前位置:</span>
<el-breadcrumb style="display:inline-block;" separator-class="el-icon-arrow-right">
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
<el-breadcrumb-item>活动管理</el-breadcrumb-item>
</el-breadcrumb>
</div>
<el-table
:header-cell-style="{'text-align':'center','font-size':'15px','color':'black'}"
:cell-style="{'font-size':'13px','border-bottom':'none'}"
ref="singleTable"
:data="tableData"
highlight-current-row
@current-change="handleCurrentChange"
style="width: 100%">
<el-table-column
align="left"
property="address"
label="标题">
<template slot-scope="scope">
<span style="white-space:nowrap;overflow:hidden;text-overflow:ellipsis;">{{scope.row.address}}</span>
</template>
</el-table-column>
<el-table-column
align="center"
property="date"
label="时间"
width="150">
</el-table-column>
<el-table-column
align="center"
property="name"
label="点击"
width="120">
</el-table-column>
<el-table-column
align="center"
property="name"
label="评论"
width="50">
</el-table-column>
</el-table>
<div style="margin-top:10px;">
<el-pagination
prev-text="上一页"
next-text="下一页"
layout="total,sizes,prev, pager, next,jumper"
:total="1000"
page-sizes=""
page-size="15"
current-page="1"
@current-change=""
@size-change=""
/>
</div>
</div>
</div>
</el-col>
</el-row>
</el-col>
</el-row>
</div>
</template>
<script>
export default {
name: "show",
data() {
return {
dataTreeFile: [{
label: '一级 1',
children: [{
label: '二级 1-1',
children: [{
label: '三级 1-1-1'
}]
}]
}, {
label: '一级 2',
children: [{
label: '二级 2-1',
children: [{
label: '三级 2-1-1'
}]
}, {
label: '二级 2-2',
children: [{
label: '三级 2-2-1'
}]
}]
}, {
label: '一级 3',
children: [{
label: '二级 3-1',
children: [{
label: '三级 3-1-1'
}]
}, {
label: '二级 3-2',
children: [{
label: '三级 3-2-1'
}]
}]
}],
defaultProps: {
children: 'children',
label: 'label'
},
tableData: [{
date: '2016-05-02 12:00:00',
name: '24',
address: '【广西高院队...】广西高院队伍整顿简报解放军过来了就收到了开花结果的工具打开两个换个角度思考和监控工具打开换个角度来看回家国家的客户给几个大客户就'
}, {
date: '2016-05-04 12:00:00',
name: '45',
address: '上海市普陀区金沙江路 1517 弄'
}, {
date: '2016-05-01 12:00:00',
name: '67',
address: '上海市普陀区金沙江路 1519 弄'
}, {
date: '2016-05-03 12:00:00',
name: '89',
address: '上海市普陀区金沙江路 1516 弄'
}],
}
},
created() {
},
methods:{
}
}
</script>
<style lang="scss" scoped>
// 树形菜单图标start-----------------------
.el-tree{
background:transparent;
}
.el-tree /deep/ .el-tree-node__expand-icon.expanded
{
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
/*//有子节点 且未展开*/
.el-tree /deep/ .el-icon-caret-right:before
{
background: url("../../assets/wjjg.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
/*//有子节点 且已展开*/
.el-tree /deep/ .el-tree-node__expand-icon.expanded.el-icon-caret-right:before
{
background: url("../../assets/wjjk.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
/*//没有子节点*/
.el-tree /deep/ .el-tree-node__expand-icon.is-leaf::before
{
background: url("../../assets/wj.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
// 树形菜单图标end-----------------------
.top-info{
margin:15px 0;
border-bottom:2px solid #34bab2;
padding-bottom:15px;
}
.fist-text{
display:inline-block;
width:26px;
height:26px;
line-height:26px;
text-align:center;
font-size:15px;
color:#fff;
border-radius:50%;
background:#1a3784;
margin-right:3px;
}
.list-container{
// border:2px solid #34bab2;
// padding:15px 15px;
// margin-top:40px;
}
.list-title{
border-bottom:1px dashed #ccc;
line-height: 35px;
}
// 列表start
.type-list li{
list-style-type: square;
// color: #0099ff;
color: blue;
font-size: 16px;
line-height: 35px;
border-bottom: 1px dashed #ccc;
}
.type-list li a{
color: #333;
font-size: 14px;
text-decoration:none;
}
.type-list li:hover{
// color: #ff6900;
color: red;
}
.type-list li:hover a{
// color: #ff6900
color:red;
}
.type-list li:last-of-type{border-bottom:none;}
// 列表end
ul{
margin: 0px;
padding: 0px;
padding-left: 15px;
}
.zone-style{
background-color:#fff;
padding:15px 15px;
border-radius:5px;
box-shadow: -5px 0px 20px 5px rgba(0,0,0,0.05);
}
::v-deep{
.el-table th:first-child>.cell{
text-align:left!important;
}
}
</style>
\ No newline at end of file
<template>
<div >
<el-row >
<el-col :span="18" :offset="3">
<el-row class="mt-20" :gutter="20">
<!--左边栏目开始-->
<el-col :span="5">
<div class="list-container" style="">
<div class="list-title mb-10" style="">按分类查看</div>
<ul class="type-list">
<li @click="switchMenu('top')"><a href="#">今日头条</a></li>
<li @click="switchMenu('all')"><a href="#">全区速递</a></li>
<li @click="switchMenu('vedio')"><a href="#">音视频点播</a></li>
</ul>
</div>
</el-col>
<!--左边栏目结束-->
<el-col :span="19">
<div class="zone-style">
<div style="min-height:76vh;">
<div class="mb-10" style="font-size:12px;font-weight:bold;">法院新闻:{{ menuName }}</div>
<!-- <el-breadcrumb-item v-for="(v,i) in breadList" :key="i">
<router-link :to="v.path" >{{ v.meta.title}}</router-link>
</el-breadcrumb-item> -->
<el-table
:header-cell-style="{'text-align':'center','font-size':'15px','color':'black'}"
:cell-style="{'font-size':'13px','border-bottom':'none'}"
:data="moreNewsList"
highlight-current-row
style="width: 100%">
<el-table-column
align="left"
property="subject"
label="标题">
</el-table-column>
<el-table-column
align="center"
property="newsTime"
label="时间"
width="150">
</el-table-column>
<el-table-column
align="center"
property="clickCount"
label="点击"
width="120">
</el-table-column>
<el-table-column
align="center"
property="commentCount"
label="评论"
width="50">
</el-table-column>
<el-table-column
label="操作"
width="50"
align="center"
>
<template slot-scope="scope">
<el-button
@click="setParams(scope.row)"
type="text"
size="mini">
查看
</el-button>
</template>
</el-table-column>
</el-table>
<div style="margin-top:10px;">
<el-pagination
prev-text="上一页"
next-text="下一页"
layout="total,sizes,prev, pager, next,jumper"
:total="pageInfo.total"
:page-size="pageInfo.size"
:current-page="pageInfo.page"
@current-change="pageChange"
@size-change="sizeChange"
/>
</div>
</div>
</div>
</el-col>
</el-row>
</el-col>
</el-row>
</div>
</template>
<script>
import {
newsFromBoard,
latestNewOfGXCourt,//获取全区速递
topList,//今日头条
} from "@/api/homePage.js"
export default {
name: "show",
data() {
return {
menuName:'',
breadList:[],//面包屑列表
pageInfo:{
page:1,
size:10,
total:0
},
moreNewsList:[],//搜索出来的新闻
}
},
created() {
// this.getBreadcrumb();
var type=this.$route.query.type;
if(type=='vedio'){
this.getVedio();
this.menuName='音视频点播'
}else if(type=='top'){
this.topListFun();//今日头条
this.menuName='今日头条'
}else if(type=='all'){
this.getLatestNewOfGXCourt();//获取全区速递
this.menuName='全区速递'
}
},
//监听路由获取面包屑
watch: {
$route() {
if (this.$route.query.type) {
// this.getBreadcrumb();
var type=this.$route.query.type;
if(type=='vedio'){
this.getVedio();
this.menuName='音视频点播'
}else if(type=='top'){
this.topListFun();//今日头条
this.menuName='今日头条'
}else if(type=='all'){
this.getLatestNewOfGXCourt();//获取全区速递
this.menuName='全区速递 '
}
}
},
},
methods:{
// 获取面包屑
// getBreadcrumb(){
// this.breadList=this.$route.matched.filter(item=>item.meta && item.meta.title);
// console.log('this.breadList==',this.breadList);
// },
//全区速递
getLatestNewOfGXCourt(){
// this.pageInfo.deptId=32;
latestNewOfGXCourt(this.pageInfo).then(res=>{
if(res.success){
this.moreNewsList=res.data.records;
this.pageInfo.total=res.data.total;
}
})
},
//今日头条
topListFun(){
this.pageInfo.fyId=32;
topList(this.pageInfo).then(res=>{
// this.topList = res.data.records
// this.headlineRotation = res.data.records
this.moreNewsList=res.data.records;
this.pageInfo.total=res.data.total;
})
},
// 视频点播
// 视频点播boardId是1965
getVedio(){
this.pageInfo.fyId=1965;
newsFromBoard(this.pageInfo).then(res=>{
// this.videoLiet = res.data.newsList.records
this.moreNewsList=res.data.newsList.records;
this.pageInfo.total=res.data.total;
})
},
pageChange(e) {
this.pageInfo.page = e;
// this.getLatestNewOfGXCourt();
var type=this.$route.query.type;
if(type=='vedio'){
this.getVedio();
}else if(type=='top'){
this.topListFun();//今日头条
}else if(type=='all'){
this.getLatestNewOfGXCourt();//获取全区速递
}
},
sizeChange(e) {
this.pageInfo.size = e;
this.pageChange(1);
},
// 查看详情
setParams(val){
this.$router.push({
path:'/detail',//跳转路由
query:{//参数对象
newsId:val.newsId
}
});
},
switchMenu(type){
this.pageInfo.page=1;
this.pageInfo.size=10;
this.pageInfo.total=0;
if(type=='vedio'){
this.getVedio();
this.menuName='音视频点播'
}else if(type=='top'){
this.topListFun();//今日头条
this.menuName='今日头条'
}else if(type=='all'){
this.getLatestNewOfGXCourt();//获取全区速递
this.menuName='全区速递'
}
}
}
}
</script>
<style lang="scss" scoped>
// 树形菜单图标start-----------------------
.el-tree{
background:transparent;
}
.el-tree /deep/ .el-tree-node__expand-icon.expanded
{
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
/*//有子节点 且未展开*/
.el-tree /deep/ .el-icon-caret-right:before
{
background: url("../../assets/wjjg.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
/*//有子节点 且已展开*/
.el-tree /deep/ .el-tree-node__expand-icon.expanded.el-icon-caret-right:before
{
background: url("../../assets/wjjk.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
/*//没有子节点*/
.el-tree /deep/ .el-tree-node__expand-icon.is-leaf::before
{
background: url("../../assets/wj.png") no-repeat 0 3px;
content: '';
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
// 树形菜单图标end-----------------------
.top-info{
margin:15px 0;
border-bottom:2px solid #34bab2;
padding-bottom:15px;
}
.fist-text{
display:inline-block;
width:26px;
height:26px;
line-height:26px;
text-align:center;
font-size:15px;
color:#fff;
border-radius:50%;
background:#1a3784;
margin-right:3px;
}
.list-container{
// border:2px solid #34bab2;
// padding:15px 15px;
// margin-top:40px;
}
.list-title{
border-bottom:1px dashed #ccc;
line-height: 35px;
}
// 列表start
.type-list li{
list-style-type: square;
// color: #0099ff;
color: blue;
font-size: 16px;
line-height: 35px;
border-bottom: 1px dashed #ccc;
}
.type-list li a{
color: #333;
font-size: 14px;
text-decoration:none;
}
.type-list li:hover{
// color: #ff6900;
color: red;
}
.type-list li:hover a{
// color: #ff6900
color:red;
}
.type-list li:last-of-type{border-bottom:none;}
// 列表end
ul{
margin: 0px;
padding: 0px;
padding-left: 15px;
}
.zone-style{
background-color:#fff;
padding:15px 15px;
border-radius:5px;
box-shadow: -5px 0px 20px 5px rgba(0,0,0,0.05);
}
::v-deep{
.el-table th:first-child>.cell{
text-align:left!important;
}
}
</style>
\ No newline at end of file
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