|
|
@@ -1,186 +1,207 @@
|
|
|
<template>
|
|
|
- <div class="new-list">
|
|
|
- <div class="serch-wrapper">
|
|
|
- <div class="search">
|
|
|
- <input type="text" v-model="keyword" placeholder="请输入内容进行搜索" class="" @keyup.enter="getList(keyword)" />
|
|
|
- <img src="../../assets/img/search.png" class="hand" @click="getList(keyword)">
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="empty" v-if="newList.length == 0">
|
|
|
- 暂无数据
|
|
|
- </div>
|
|
|
- <div class="new-item hand" v-for="item in newList" :key="item.id"
|
|
|
- @click="navTo('/organs/detail?id='+ item.id)">
|
|
|
- <div class="title clamp">
|
|
|
- <span class="title-icon"></span>
|
|
|
- {{ item.title }}
|
|
|
- </div>
|
|
|
- <div class="time">{{ item.release_time?item.release_time:item.add_time | time }}</div>
|
|
|
- </div>
|
|
|
- <el-pagination layout="prev, pager, next" :total="total" background prev-text="上一页" next-text="下一页"
|
|
|
- @current-change="currentChange" :page-size="15" hide-on-single-page></el-pagination>
|
|
|
- </div>
|
|
|
+ <div class="new-list">
|
|
|
+ <div class="serch-wrapper">
|
|
|
+ <div class="search">
|
|
|
+ <input
|
|
|
+ type="text"
|
|
|
+ v-model="keyword"
|
|
|
+ placeholder="请输入内容进行搜索"
|
|
|
+ class=""
|
|
|
+ @keyup.enter="getList(keyword)"
|
|
|
+ />
|
|
|
+ <img
|
|
|
+ src="../../assets/img/search.png"
|
|
|
+ class="hand"
|
|
|
+ @click="getList(keyword)"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="empty" v-if="newList.length == 0">暂无数据</div>
|
|
|
+ <div
|
|
|
+ class="new-item hand"
|
|
|
+ v-for="item in newList"
|
|
|
+ :key="item.id"
|
|
|
+ @click="navTo('/organs/detail?id=' + item.id)"
|
|
|
+ >
|
|
|
+ <div class="title clamp">
|
|
|
+ <span class="title-icon"></span>
|
|
|
+ {{ item.title }}
|
|
|
+ </div>
|
|
|
+ <div class="time">{{ item.releasetime | time }}</div>
|
|
|
+ </div>
|
|
|
+ <el-pagination
|
|
|
+ layout="prev, pager, next"
|
|
|
+ :total="total"
|
|
|
+ background
|
|
|
+ prev-text="上一页"
|
|
|
+ next-text="下一页"
|
|
|
+ @current-change="currentChange"
|
|
|
+ :page-size="15"
|
|
|
+ hide-on-single-page
|
|
|
+ ></el-pagination>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- import {
|
|
|
- loadIndexs,
|
|
|
- splist,
|
|
|
- loveList,
|
|
|
- friendList,
|
|
|
- newsList,
|
|
|
- openList,
|
|
|
- getList
|
|
|
- } from '../../request/api.js';
|
|
|
- export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- newList: [],
|
|
|
- total: 0,
|
|
|
- page: 1,
|
|
|
- limit: 15,
|
|
|
- keyword: ''
|
|
|
- };
|
|
|
- },
|
|
|
- filters: {
|
|
|
- time(val) {
|
|
|
- let arr = val.split(' ')
|
|
|
- let str = arr[0]
|
|
|
- str = str.replace(/-/g, '.')
|
|
|
- return str
|
|
|
- }
|
|
|
- },
|
|
|
- created() {
|
|
|
- this.getList()
|
|
|
- },
|
|
|
- methods: {
|
|
|
- navTo(url) {
|
|
|
- this.$router.push(url);
|
|
|
- },
|
|
|
- currentChange(e) {
|
|
|
- this.page = e
|
|
|
- this.getList()
|
|
|
- },
|
|
|
- getList(keyword) {
|
|
|
- let obj = this
|
|
|
- if (keyword) {
|
|
|
- obj.page = 1
|
|
|
- }
|
|
|
- getList({
|
|
|
- page: obj.page,
|
|
|
- limit: obj.limit,
|
|
|
- name: obj.keyword
|
|
|
- }, 61).then(res => {
|
|
|
- obj.newList = res.data.list.sort(this.compare('id'))
|
|
|
- // var newArrayData=res.data.list.sort(compare('Id'))
|
|
|
- obj.total = res.data.count
|
|
|
- })
|
|
|
- },
|
|
|
- compare(attribute) {
|
|
|
- return function(obj1, obj2) {
|
|
|
- var val1 = obj1[attribute];
|
|
|
- var val2 = obj2[attribute];
|
|
|
- if (val1 < val2) {
|
|
|
- return 1;
|
|
|
- } else if (val1 > val2) {
|
|
|
- return -1;
|
|
|
- } else {
|
|
|
- return 0;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- };
|
|
|
+import {
|
|
|
+ loadIndexs,
|
|
|
+ splist,
|
|
|
+ loveList,
|
|
|
+ friendList,
|
|
|
+ newsList,
|
|
|
+ openList,
|
|
|
+ getList,
|
|
|
+ getArtList,
|
|
|
+} from "../../request/api.js";
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ newList: [],
|
|
|
+ total: 0,
|
|
|
+ page: 1,
|
|
|
+ limit: 15,
|
|
|
+ keyword: "",
|
|
|
+ };
|
|
|
+ },
|
|
|
+ filters: {
|
|
|
+ time(val) {
|
|
|
+ let arr = val.split(" ");
|
|
|
+ let str = arr[0];
|
|
|
+ str = str.replace(/-/g, ".");
|
|
|
+ return str;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ navTo(url) {
|
|
|
+ this.$router.push(url);
|
|
|
+ },
|
|
|
+ currentChange(e) {
|
|
|
+ this.page = e;
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ getList(keyword) {
|
|
|
+ let obj = this;
|
|
|
+ if (keyword) {
|
|
|
+ obj.page = 1;
|
|
|
+ }
|
|
|
+ getArtList({
|
|
|
+ ifyid: 52,
|
|
|
+ page: obj.page,
|
|
|
+ limit: obj.limit,
|
|
|
+ key: keyword,
|
|
|
+ }).then((res) => {
|
|
|
+ obj.newList = res.data.list.sort(this.compare("id"));
|
|
|
+ // var newArrayData=res.data.list.sort(compare('Id'))
|
|
|
+ obj.total = res.data.count;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ compare(attribute) {
|
|
|
+ return function (obj1, obj2) {
|
|
|
+ var val1 = obj1[attribute];
|
|
|
+ var val2 = obj2[attribute];
|
|
|
+ if (val1 < val2) {
|
|
|
+ return 1;
|
|
|
+ } else if (val1 > val2) {
|
|
|
+ return -1;
|
|
|
+ } else {
|
|
|
+ return 0;
|
|
|
+ }
|
|
|
+ };
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
- .empty {
|
|
|
- text-align: center;
|
|
|
- color: #999;
|
|
|
- height: 400px;
|
|
|
- line-height: 400px;
|
|
|
- }
|
|
|
+.empty {
|
|
|
+ text-align: center;
|
|
|
+ color: #999;
|
|
|
+ height: 400px;
|
|
|
+ line-height: 400px;
|
|
|
+}
|
|
|
|
|
|
- .new-list {
|
|
|
- position: relative;
|
|
|
- .new-item {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- font-size: 18px;
|
|
|
- font-family: PingFang SC;
|
|
|
- font-weight: 500;
|
|
|
- color: #666666;
|
|
|
- height: 40px;
|
|
|
- border-bottom: 1px solid #E5E5E5;
|
|
|
- line-height: 40px;
|
|
|
+.new-list {
|
|
|
+ position: relative;
|
|
|
+ .new-item {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ font-size: 18px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #666666;
|
|
|
+ height: 40px;
|
|
|
+ border-bottom: 1px solid #e5e5e5;
|
|
|
+ line-height: 40px;
|
|
|
|
|
|
- &:hover {
|
|
|
- color: red;
|
|
|
+ &:hover {
|
|
|
+ color: red;
|
|
|
|
|
|
- .title {
|
|
|
- .title-icon {
|
|
|
- border-left-color: red;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
+ .title {
|
|
|
+ .title-icon {
|
|
|
+ border-left-color: red;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .title {
|
|
|
- width: 500px;
|
|
|
+ .title {
|
|
|
+ width: 500px;
|
|
|
|
|
|
- .title-icon {
|
|
|
- display: inline-block;
|
|
|
- width: 0;
|
|
|
- height: 0;
|
|
|
- width: 0;
|
|
|
- height: 0;
|
|
|
- border-top: 6px solid transparent;
|
|
|
- border-left: 8px solid #d2d2d2;
|
|
|
- border-bottom: 6px solid transparent;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
+ .title-icon {
|
|
|
+ display: inline-block;
|
|
|
+ width: 0;
|
|
|
+ height: 0;
|
|
|
+ width: 0;
|
|
|
+ height: 0;
|
|
|
+ border-top: 6px solid transparent;
|
|
|
+ border-left: 8px solid #d2d2d2;
|
|
|
+ border-bottom: 6px solid transparent;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
|
|
|
- /deep/ .el-pagination {
|
|
|
- margin-top: 50px;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
+/deep/ .el-pagination {
|
|
|
+ margin-top: 50px;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
|
|
|
- .serch-wrapper {
|
|
|
- display: flex;
|
|
|
- height: 33px;
|
|
|
- position: absolute;
|
|
|
- top: -80px;
|
|
|
- right: -50px;
|
|
|
+.serch-wrapper {
|
|
|
+ display: flex;
|
|
|
+ height: 33px;
|
|
|
+ position: absolute;
|
|
|
+ top: -80px;
|
|
|
+ right: -50px;
|
|
|
|
|
|
- .search {
|
|
|
+ .search {
|
|
|
+ padding-left: 13px;
|
|
|
+ padding-right: 13px;
|
|
|
+ width: 295px;
|
|
|
+ height: 33px;
|
|
|
+ line-height: 33px;
|
|
|
+ background: #ffffff;
|
|
|
+ border: 1px solid #cccccc;
|
|
|
+ border-radius: 10px;
|
|
|
+ // margin-bottom: 10px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
|
|
|
- padding-left: 13px;
|
|
|
- padding-right: 13px;
|
|
|
- width: 295px;
|
|
|
- height: 33px;
|
|
|
- line-height: 33px;
|
|
|
- background: #FFFFFF;
|
|
|
- border: 1px solid #CCCCCC;
|
|
|
- border-radius: 10px;
|
|
|
- // margin-bottom: 10px;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
+ input {
|
|
|
+ width: 235px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: bold;
|
|
|
+ outline: none;
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
|
|
|
- input {
|
|
|
- width: 235px;
|
|
|
- font-size: 16px;
|
|
|
- font-family: PingFang SC;
|
|
|
- font-weight: bold;
|
|
|
- outline: none;
|
|
|
- border: none;
|
|
|
- }
|
|
|
-
|
|
|
- img {
|
|
|
- width: 20px;
|
|
|
- height: 20px;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-</style>
|
|
|
+ img {
|
|
|
+ width: 20px;
|
|
|
+ height: 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
