|
|
|
|
@ -56,7 +56,7 @@
|
|
|
|
|
flex-wrap: nowrap;
|
|
|
|
|
}
|
|
|
|
|
.main-left {
|
|
|
|
|
width: 22.3%;
|
|
|
|
|
width: 100%;
|
|
|
|
|
}
|
|
|
|
|
.fl {
|
|
|
|
|
float: left;
|
|
|
|
|
@ -119,26 +119,26 @@
|
|
|
|
|
background-size: cover;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.sidebar li {
|
|
|
|
|
border-bottom: 1px solid #E1E1E1;
|
|
|
|
|
line-height: 42px;
|
|
|
|
|
}
|
|
|
|
|
/*.sidebar li {*/
|
|
|
|
|
/* border-bottom: 1px solid #E1E1E1;*/
|
|
|
|
|
/* line-height: 42px;*/
|
|
|
|
|
/*}*/
|
|
|
|
|
|
|
|
|
|
.sidebar li a.active {
|
|
|
|
|
color: #0055A5;
|
|
|
|
|
}
|
|
|
|
|
.sidebar li a.active {
|
|
|
|
|
background: url(/home/base/p110.png) no-repeat 12%;
|
|
|
|
|
background-size: 5%;
|
|
|
|
|
}
|
|
|
|
|
/*.sidebar li a.active {*/
|
|
|
|
|
/* color: #0055A5;*/
|
|
|
|
|
/*}*/
|
|
|
|
|
/*.sidebar li a.active {*/
|
|
|
|
|
/* background: url(/home/base/p110.png) no-repeat 12%;*/
|
|
|
|
|
/* background-size: 5%;*/
|
|
|
|
|
/*}*/
|
|
|
|
|
|
|
|
|
|
.sidebar li a {
|
|
|
|
|
display: block;
|
|
|
|
|
background: url(/home/base/p111.png) no-repeat 12%;
|
|
|
|
|
background-size: 5%;
|
|
|
|
|
padding-left: 22%;
|
|
|
|
|
font-size: 16px;
|
|
|
|
|
}
|
|
|
|
|
/*.sidebar li a {*/
|
|
|
|
|
/* display: block;*/
|
|
|
|
|
/* background: url(/home/base/p111.png) no-repeat 12%;*/
|
|
|
|
|
/* background-size: 5%;*/
|
|
|
|
|
/* padding-left: 22%;*/
|
|
|
|
|
/* font-size: 16px;*/
|
|
|
|
|
/*}*/
|
|
|
|
|
|
|
|
|
|
.pag {
|
|
|
|
|
margin-top: 80px;
|
|
|
|
|
@ -170,6 +170,42 @@
|
|
|
|
|
display: block;
|
|
|
|
|
font-size: 16px;
|
|
|
|
|
}
|
|
|
|
|
.imageList li {
|
|
|
|
|
width: 25%;
|
|
|
|
|
}
|
|
|
|
|
.imageList ul li {
|
|
|
|
|
position: relative;
|
|
|
|
|
float: left;
|
|
|
|
|
}
|
|
|
|
|
.imageList ul li a {
|
|
|
|
|
position: relative;
|
|
|
|
|
display: block;
|
|
|
|
|
margin: 30px 10px 0;
|
|
|
|
|
font-size: 16px;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
text-align: center;
|
|
|
|
|
}
|
|
|
|
|
.imageList ul li a .place {
|
|
|
|
|
position: relative;
|
|
|
|
|
display: block;
|
|
|
|
|
padding-top: 56.25%;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
background-color: #f4f4f4;
|
|
|
|
|
}
|
|
|
|
|
.imageList ul li a .place .pic {
|
|
|
|
|
position: absolute;
|
|
|
|
|
top: 0;
|
|
|
|
|
right: 0;
|
|
|
|
|
left: 0;
|
|
|
|
|
bottom: 0;
|
|
|
|
|
z-index: 1;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
object-fit:cover;
|
|
|
|
|
transition:all .5s;
|
|
|
|
|
}
|
|
|
|
|
.imageList ul li:hover .pic{
|
|
|
|
|
transform: scale(1.1);
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
</head>
|
|
|
|
|
<body class="layui-bg-gray" style="">
|
|
|
|
|
@ -190,38 +226,24 @@
|
|
|
|
|
<div class="main">
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="main-left fl" id="app">
|
|
|
|
|
<h2>
|
|
|
|
|
<h2 style="width: 22.3%">
|
|
|
|
|
专题栏目
|
|
|
|
|
</h2>
|
|
|
|
|
<el-tree
|
|
|
|
|
ref="treeRef"
|
|
|
|
|
:data="treeData"
|
|
|
|
|
:props="defaultProps"
|
|
|
|
|
node-key="columnId"
|
|
|
|
|
:default-expanded-keys="defauleExpandedKeys"
|
|
|
|
|
:current-node-key="defaultSelected"
|
|
|
|
|
highlight-current
|
|
|
|
|
:expand-on-click-node="false"
|
|
|
|
|
@node-click="handleNodeClick"
|
|
|
|
|
>
|
|
|
|
|
<span slot-scope="{ node, data }" class="custom-tree-node" v-text="data.columnName" :title="data.columnName">
|
|
|
|
|
</span>
|
|
|
|
|
</el-tree>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="main-right fr common-list">
|
|
|
|
|
<ul class="list mt10" th:if="${page.list.size() > 0}">
|
|
|
|
|
<tbody th:each="special,status : ${page.list}">
|
|
|
|
|
<li>
|
|
|
|
|
<span style="color:#ccc;">-</span>
|
|
|
|
|
<a th:href="@{/public_view.html(type=5,id=${special.specialId})}" th:title="${special.specialTitle}" target="_blank">
|
|
|
|
|
[[${#strings.abbreviate(special.specialTitle,45)}]]
|
|
|
|
|
</a>
|
|
|
|
|
<span class="date">[[${#dates.format(special.createTime, 'yyyy年MM月dd日')}]]</span>
|
|
|
|
|
</li>
|
|
|
|
|
</tbody>
|
|
|
|
|
</ul>
|
|
|
|
|
<!--分页-->
|
|
|
|
|
<th:block th:include="home_page :: home_page"/>
|
|
|
|
|
<hr/>
|
|
|
|
|
<div class="imageList">
|
|
|
|
|
<ul>
|
|
|
|
|
<li th:each="column,status : ${columnList}">
|
|
|
|
|
<a th:href="@{/special_view.html(columnId=${column.columnId})}" th:title="${column.columnName}" target="_blank">
|
|
|
|
|
<div class="place">
|
|
|
|
|
<div class="pic">
|
|
|
|
|
<img style="height: 100%;width: 100% ;filter: brightness(1.1);" th:src="${column.columnUrl}">
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<span style="margin-top: 5px;font-size: 15px;">[[${column.columnName}]]</span >
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
@ -251,52 +273,38 @@
|
|
|
|
|
el: '#app',
|
|
|
|
|
data(){
|
|
|
|
|
return{
|
|
|
|
|
treeData: [],
|
|
|
|
|
defaultProps: {
|
|
|
|
|
children: 'children',
|
|
|
|
|
label: 'columnName',
|
|
|
|
|
id:'columnId'
|
|
|
|
|
},
|
|
|
|
|
defaultSelected:[[${columnId}]],
|
|
|
|
|
defauleExpandedKeys:[],
|
|
|
|
|
listData: [[${columnList}]],
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
mounted(){
|
|
|
|
|
this.getTreeData();
|
|
|
|
|
console.log(this.listData)
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
getTreeData(){
|
|
|
|
|
$.ajax({
|
|
|
|
|
type: "get",
|
|
|
|
|
url: "/columnTree/getTree",
|
|
|
|
|
success: function(res) {
|
|
|
|
|
if (res.code == 0) {
|
|
|
|
|
this.treeData = res.data;
|
|
|
|
|
this.$nextTick(()=>{
|
|
|
|
|
this.$refs.treeRef.setCurrentKey(this.defaultSelected)
|
|
|
|
|
var expandedKeys = JSON.parse(localStorage.getItem('expandedKeys'));
|
|
|
|
|
if (expandedKeys) {
|
|
|
|
|
this.defauleExpandedKeys.push(expandedKeys)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
}.bind(this)
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
handleNodeClick(data) {
|
|
|
|
|
localStorage.setItem('expandedKeys', JSON.stringify(data.columnId));
|
|
|
|
|
redirect("/special_view.html?columnId="+data.columnId);
|
|
|
|
|
console.log(data);
|
|
|
|
|
},
|
|
|
|
|
// getTreeData(){
|
|
|
|
|
// $.ajax({
|
|
|
|
|
// type: "get",
|
|
|
|
|
// url: "/columnTree/getTree",
|
|
|
|
|
// success: function(res) {
|
|
|
|
|
// if (res.code == 0) {
|
|
|
|
|
// this.treeData = res.data;
|
|
|
|
|
// this.$nextTick(()=>{
|
|
|
|
|
// this.$refs.treeRef.setCurrentKey(this.defaultSelected)
|
|
|
|
|
// var expandedKeys = JSON.parse(localStorage.getItem('expandedKeys'));
|
|
|
|
|
// if (expandedKeys) {
|
|
|
|
|
// this.defauleExpandedKeys.push(expandedKeys)
|
|
|
|
|
// }
|
|
|
|
|
// })
|
|
|
|
|
// }
|
|
|
|
|
// }.bind(this)
|
|
|
|
|
// });
|
|
|
|
|
// },
|
|
|
|
|
// handleNodeClick(data) {
|
|
|
|
|
// localStorage.setItem('expandedKeys', JSON.stringify(data.columnId));
|
|
|
|
|
// redirect("/special_view.html?columnId="+data.columnId);
|
|
|
|
|
// console.log(data);
|
|
|
|
|
// },
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
function redirect(url) {
|
|
|
|
|
window.location.href = url;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function openPopup(url) {
|
|
|
|
|
window.open(url, '_blank');
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
|
|
|
|
|
dshclm
5 days ago