378 lines
11 KiB
Vue
378 lines
11 KiB
Vue
<template>
|
||
<div class="main">
|
||
<div class="tabBox">
|
||
<div :class="selectTab === item.value ? 'tabItem selectTabItem' : 'tabItem'" v-for="(item, index) in tabList"
|
||
:key="index" @click="handleChangeTab(item.value)">
|
||
{{ item.label }}
|
||
</div>
|
||
</div>
|
||
|
||
<div class="contentList">
|
||
<div class="contentItem" v-for="(item, index) in messageList" :key="index" @click="handleGoDetail(item)">
|
||
<div class="left">
|
||
<!-- <div class="title">{{ item.NOTICEINFO_TITLE || "" }}</div> -->
|
||
<div class="title">{{ item.title || "" }}</div>
|
||
<!-- <div class="content">{{ item.NOTICEINFO_CONTENT || "" }}</div> -->
|
||
<div class="descBox">
|
||
<span class="name">{{ item.author || "-" }}</span>
|
||
<span class="time">{{ item.publishTime || "-" }}</span>
|
||
</div>
|
||
</div>
|
||
<div class="right">
|
||
<image class="leftIcon" :src="item.coverImg
|
||
? item.coverImg
|
||
: 'https://eshangtech.com/ShopICO/no-picture.png'
|
||
" />
|
||
</div>
|
||
</div>
|
||
<div v-if="!(messageList && messageList.length > 0)">
|
||
<no-data text="暂无内容" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import { mapGetters } from "vuex";
|
||
import NoData from "../../components/noData.vue";
|
||
export default {
|
||
data() {
|
||
return {
|
||
tabList: [],
|
||
selectTab: 0,
|
||
messageList: [],
|
||
};
|
||
},
|
||
components: {
|
||
NoData,
|
||
},
|
||
computed: {
|
||
...mapGetters({
|
||
user: "user",
|
||
}),
|
||
},
|
||
onLoad() {
|
||
// 拿到tab的数据
|
||
this.handleGetTabList();
|
||
// this.handleGetHighwayHeadlines()
|
||
this.$utils.addUserBehaviorNew();
|
||
},
|
||
methods: {
|
||
// 改变选中
|
||
handleChangeTab(value) {
|
||
this.selectTab = value;
|
||
this.handleGetHighwayHeadlines();
|
||
},
|
||
// 拿到tab的数据
|
||
async handleGetTabList() {
|
||
const data = await this.$api.$get(
|
||
"/EShangApiMain/FrameWork/GetFieldEnumTree",
|
||
{ FieldExplainField: "NOTICEINFO_TYPE" }
|
||
);
|
||
let list = this.$utils.wrapTreeNode(data.Result_Data.List);
|
||
let res = [];
|
||
if (list && list.length > 0) {
|
||
list.forEach((item) => {
|
||
if (item.children && item.children.length > 0) {
|
||
item.children.forEach((subItem) => {
|
||
res.push(subItem);
|
||
});
|
||
}
|
||
});
|
||
}
|
||
res.unshift({
|
||
label: "全部",
|
||
value: "all",
|
||
});
|
||
this.tabList = res;
|
||
console.log("tabList", res);
|
||
if (res && res.length > 0) {
|
||
this.selectTab = res[0].value;
|
||
}
|
||
// this.handleGetHighwayHeadlines();
|
||
this.handleGetHighwayHeadlines();
|
||
},
|
||
// 拿到消息列表
|
||
async handleGetHighwayHeadlines() {
|
||
console.log("this.user", this.user);
|
||
let req = {
|
||
SearchParameter: {
|
||
NOTICEINFO_TYPES: this.selectTab === "all" ? "" : this.selectTab,
|
||
PROVINCE_CODE: this.user.PROVINCE_CODE || "530000",
|
||
NOTICEINFO_STATE: 1,
|
||
},
|
||
PageIndex: 1,
|
||
PageSize: 999999,
|
||
};
|
||
const data = await this.$api.$post(
|
||
"/EShangApiMain/Notice/GetNOTICEINFOList",
|
||
req
|
||
);
|
||
console.log("handleGetHighwayHeadlines", data);
|
||
let list = data.Result_Data.List;
|
||
if (list && list.length > 0) {
|
||
this.messageList = list;
|
||
} else {
|
||
this.messageList = [];
|
||
}
|
||
|
||
// this.messageList.push({
|
||
// NOTICEINFO_TITLE: "最新放假通知：调休2天，免费8天！",
|
||
// messageType: "official",
|
||
// });
|
||
|
||
console.log("this.messageList", this.messageList);
|
||
},
|
||
// 跳转查看高速头条详情
|
||
handleGoDetail(obj) {
|
||
console.log("obj", obj);
|
||
if (obj.messageType === "official") {
|
||
uni.navigateTo({
|
||
url: "/pages/highwayHeadlines/minprogress",
|
||
});
|
||
} else {
|
||
uni.navigateTo({
|
||
// url: `/pages/highwayHeadlines/detail?id=${obj.NOTICEINFO_ID}`,
|
||
url: `/pages/highwayHeadlines/detail?id=${obj.id}`,
|
||
});
|
||
}
|
||
},
|
||
|
||
// 高速头条播报
|
||
async handleGetHighwayHeadlines() {
|
||
let start = `${this.$moment
|
||
.now()
|
||
.set("month", -1)
|
||
.format("YYYY-MM-DD")} 00:00:00`;
|
||
let end = `${this.$moment.now().format("YYYY-MM-DD")} 23:59:59`;
|
||
let params = {
|
||
startQueryTime: start, // 开始时间
|
||
endQueryTime: end, // 结束时间
|
||
};
|
||
let time = Math.ceil(new Date().getTime() / 1000);
|
||
|
||
let req = {
|
||
app_id: "530000301",
|
||
biz_content: JSON.stringify(params),
|
||
charset: "UTF-8",
|
||
pid: "530000301",
|
||
service: "trawe.eats.etc",
|
||
utc_timestamp: time,
|
||
version: "1.0",
|
||
sign_type: "RSA2",
|
||
};
|
||
let signText = `app_id=${req.app_id}&biz_content=${req.biz_content}&charset=UTF-8&pid=${req.app_id}&service=trawe.eats.etc&utc_timestamp=${req.utc_timestamp}&version=1.0`;
|
||
console.log("handleGetHighwayHeadlines", req);
|
||
console.log("signText", signText);
|
||
|
||
// 签名
|
||
const sign = await new Promise((resolve, reject) => {
|
||
uni.request({
|
||
url: "https://admin.es.eshangtech.com/prod-api/RSA/sign",
|
||
method: "POST",
|
||
data: {
|
||
originalText: signText,
|
||
privateKey:
|
||
"MIIEvAIBADANBgkqhkiG9w0BAQEFAASCBKYwggSiAgEAAoIBAQCtIkIJLbZYI9NvTRkRbqtjJ73gkAUJZBJw88Z+O8prX2HXMTIedmZZxTwbfM5kGpl9VmS0CY8QL0DnDsgHO8QnSDpN1jiqTD9lk1evycuF7ujmlOk/cJ5x2cLPn9rPIrQn1lxp9mBiO1m9vsrNOze/kx7wRyif/+hvn5Q9KtNEMy0K8oOE5vktnjkk1AhhXrTii9eIjOrO3pRgh9cFA9kqQpvD14CImD7tdCgyntKcYAB7rlin6a2N0yH9JJINjOyOiyHufP8sR7pb9VYXVYXukOCItdC9QQluQhSdyC/3BfZD5zV1A+X7pUle7dDLGG6aSZyCibg16siFIEX94KYfAgMBAAECggEAcP5uwrbGzvdywq06sxnbWTdSwQC9iMd7EaTH4xL6pOD3Zg6Be0givGvxMq9dtA94JUkBKE8kw5dTcHlBKxdiiZCmHK63BM4GgjCLhfrZjWvDLNn68KB7iCpq7j6R+6XWljlczvsxJGs/woqGqTMAy1MlWgPXC7Vk6ZTolpMglt0IJOzPtgJ66qU2CtNRjowkXSCHDO2RCjkmYcjU6W+eCvi9cXIXhLv5yra1PE0KOxn3NiEFwgGUXpu8LKqxuUfGLuHljoLxWV8EEfwZaWB6Wy1DHMMgxhKrO3xEmdMEqtvJmF98LRSYiJerkExY8Gdx8bkLPjlCLYKW4JVuPmyYgQKBgQD8l0lLtB94MQMib0t8RzqlbKcczTAkicjSms3/P4kwh50GC8OqwjJB75n4yQyDPgsjms/SnRMq1zjgm+MHSC4snpLCcvKFYLnvrslWGu/2lyUTwEwdUdQe1ILG4Y9NXKWg4zXpKfJ2Rz/cqw6bHGYhQWZ62AXQgiz+W7cIPrsHsQKBgQCveHGHF0WqtYAmrW7nf04PKmcJ5U2briYCWOtWJE5Mo5BYxsGLX6vI53DMNQ42hFk0ye61VNfcazAoGI3mM4+j6R9k3ek8EtkBYBro5eeoBtB7TMTJagQqzBLz316mJBsFmw3TiC9BzYhs3tKJnVxpfqXoqsyu2ZA6VG5Y/gXOzwKBgCbejPvmUvVm7WmOINqWB3NPXgPzm1X0EgA+rDZ8K3tZUxOMGeccDSnSWipLne5QTNyExThOzZVJG0qNEombVOeu2zyq/aECunoktnzWllim96CrdcsJPZAk+Z7rNOcdu6sfa7teph4HZs9pT00VOK4jZ0a+GV71uUDHEkplhNhxAoGAMDOi5BxFe/595KIR7C/xboMUaQh/iDuPn2dzxmcUx0LLPUfkFPhEBV1mhAIzFFDI/JJYK6HR5m/fe7Q7DritRbaddCTtlB4NVK5k1gOJ3oN4s9ZD3Jxt5p/GuQ1sP7F9Zs3QP4KSkL34MwgGx9zdbPFofACnV4TWdN+KrJGjYMsCgYAE0CMM7rYHGY3Vt3/WZZJ+DPlKE6Q+uvFDomtsB1IavCeEJyjBP9+GhBHat86aA3mCFjf4emj1or7OEgPc0gCMtKBG6m10CrzLjzdWnOTveqWVUW/FS2gf17cIO5/FK/4KmAjH/QN24KXm395Qu8C0UFfgA66yysakJFkvXVBiPg==",
|
||
},
|
||
header: {
|
||
"content-type": "application/json",
|
||
},
|
||
success(res) {
|
||
console.log("resresresresresresres", res);
|
||
resolve(res.data.data);
|
||
},
|
||
});
|
||
});
|
||
console.log("sign", sign);
|
||
|
||
req.sign = sign;
|
||
|
||
// 推文数据
|
||
const tweetsData = await new Promise((resolve, reject) => {
|
||
uni.request({
|
||
url: `https://sxgzh.etclife.cn/etc/api/v1/gzh/point/tweets`,
|
||
method: "POST",
|
||
data: req,
|
||
header: {
|
||
"content-type": "application/x-www-form-urlencoded",
|
||
},
|
||
success(res) {
|
||
console.log(
|
||
"resresresresresresresresres",
|
||
res.data.response.data.data.tweets
|
||
);
|
||
resolve(res.data.response.data.data.tweets);
|
||
},
|
||
});
|
||
});
|
||
|
||
console.log("tweetsData", tweetsData);
|
||
if (tweetsData && tweetsData.length > 0) {
|
||
this.messageList = tweetsData;
|
||
} else {
|
||
this.messageList = [];
|
||
}
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
<style scoped lang="less">
|
||
.main {
|
||
width: 100%;
|
||
height: 100vh;
|
||
|
||
.tabBox {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 22rpx 40rpx 22rpx;
|
||
overflow-x: auto;
|
||
display: flex;
|
||
border-bottom: 1px solid #f6f6f6;
|
||
|
||
.tabItem {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #716f69;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
display: inline-block;
|
||
margin-right: 56rpx;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.tabItem:nth-last-child(1) {
|
||
margin-right: 0;
|
||
}
|
||
|
||
.selectTabItem {
|
||
color: #130f05;
|
||
position: relative;
|
||
}
|
||
|
||
.selectTabItem::after {
|
||
content: "";
|
||
width: 2rem;
|
||
height: 6rpx;
|
||
background: #ba922f;
|
||
position: absolute;
|
||
bottom: -22rpx;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
}
|
||
}
|
||
|
||
.tabBox::-webkit-scrollbar {
|
||
display: none;
|
||
/* Chrome, Safari 和 Opera */
|
||
}
|
||
|
||
.contentList {
|
||
width: 100%;
|
||
height: calc(100vh - 50px);
|
||
overflow-y: auto;
|
||
|
||
.contentItem {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 32rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
border-bottom: 1px solid #f6f6f6;
|
||
|
||
.left {
|
||
width: calc(100% - 260rpx);
|
||
height: 220rpx;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: space-between;
|
||
|
||
.title {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #130f05;
|
||
line-height: 40rpx;
|
||
text-align: justify;
|
||
font-style: normal;
|
||
width: 100%;
|
||
display: -webkit-box;
|
||
/* 使用弹性盒模型 */
|
||
-webkit-box-orient: vertical;
|
||
/* 垂直排列 */
|
||
overflow: hidden;
|
||
/* 超出部分隐藏 */
|
||
-webkit-line-clamp: 3;
|
||
/* 限制最多显示3行文本 */
|
||
text-overflow: ellipsis;
|
||
/* 超出部分用省略号显示 */
|
||
}
|
||
|
||
.content {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #716f69;
|
||
line-height: 32rpx;
|
||
text-align: justify;
|
||
font-style: normal;
|
||
width: 100%;
|
||
display: -webkit-box;
|
||
/* 使用弹性盒模型 */
|
||
-webkit-box-orient: vertical;
|
||
/* 垂直排列 */
|
||
overflow: hidden;
|
||
/* 超出部分隐藏 */
|
||
-webkit-line-clamp: 2;
|
||
/* 限制最多显示3行文本 */
|
||
text-overflow: ellipsis;
|
||
/* 超出部分用省略号显示 */
|
||
}
|
||
|
||
.descBox {
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
margin-top: 12rpx;
|
||
|
||
.name {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #716f69;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.time {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #716f69;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
|
||
.right {
|
||
width: 220rpx;
|
||
height: 220rpx;
|
||
margin-left: 40rpx;
|
||
border-radius: 16rpx;
|
||
overflow: hidden;
|
||
|
||
.leftIcon {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style> |