Files
sociology_app/pages/TaihuPublicWelfare/index/index.vue
2025-05-06 13:33:55 +08:00

819 lines
20 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<view class="commonPageBox" style="">
<public-module></public-module>
<view class="header_box">
<view class="header_bg" :style="``">
<text class="PM_font" style="color: #7f2000">太湖公益</text>
</view>
</view>
<!-- <view class="header_box">
<view class="header_bg" :style="`margin-top:${statusBarHeight * 2}rpx`">
<text class="PM_font" style="margin-left: 100rpx">太湖公益</text>
</view>
</view> -->
<!-- height: calc(100vh - 100px); -->
<view
class="main_content_box"
:style="``"
>
<view class="curriculum_box cate_box">
<view
:style="`background-image: url('${
currentCate == i ? v.activeImage : v.image
}');color:${currentCate == i ? '#fff' : '#3ab3ae'} !important;`"
class="curriculum_item_box icon_bg"
v-for="(v, i) in curriculumList"
@click="handleClickCurriculum(v, i)"
>
<!-- <view class="curriculum_item"> -->
<!-- <image
:src="v.imgUrl"
mode="aspectFill"
class="curriculum_item_img"
></image> -->
<view
class="curriculum_item_name"
style="margin-left: 100rpx"
:style="`;color:${currentCate == i ? '#fff' : v.color} !important;`"
>{{ v.name }}</view
>
<!-- </view> -->
</view>
</view>
<!-- <view class="cate_box">
<view
class="cate_item_box"
v-for="(v, i) in cateList"
@click="handleClickCate(v)"
>
<view class="cate_item_border">
<image :src="v.imgUrl" mode="aspectFill" :style="v.style"></image>
</view>
<view class="cate_item_name">{{ v.title }}</view>
</view>
</view> -->
<view class="flash_sale_box" v-if="currentCate == 0">
<view class="flash_sale_content">
<scroll-view
scroll-y="true"
class="scroll-Y"
style="height: 100%; width: 100%"
@scrolltolower="onReachBottom1"
>
<view
class="scroll-view-item flash_sale_content_item"
@click="goGoodsDetail(v)"
v-for="(v, i) in goodsList"
>
<image class="book_image" :src="v.productImages" mode="aspectFit">
</image>
<!-- <view class="active_price" v-if="v.activityPrice > 0">
<text>秒杀</text>
</view>-->
<view class="book_content">
<view class="book_name">{{ v.productName }}</view>
<!-- <view class="bottom">
<view class="book_price">
<view class="book_price_current">
<text class="price_icon"></text>
<text class="price">{{
v.activityPrice > 0 ? v.activityPrice : v.price
}}</text></view
>
<view class="book_price_old" v-if="v.activityPrice > 0"
>原价{{ v.price }}</view
>
</view>
<view class="sumSales">已售{{ v.sumSales }}</view>
</view> -->
</view>
</view>
</scroll-view>
</view>
</view>
<view class="flash_sale_box" v-if="currentCate == 1">
<view class="flash_sale_content">
<common-list
style="height: 100%; width: 100%"
noDataIcon="data"
:isCondition="true"
@lower="onReachBottom2"
:pagination="pagination"
:dataList="noticeList"
@hancleClick="gotoDetail"
label="title"
>
<template slot="labelSlot" slot-scope="slotProps">
<view class="related_courses_name hidden1">{{
slotProps.row.title
}}</view>
<!-- <text v-if="slotProps.row.conditions!='03'">试听</text> -->
</template>
</common-list>
</view>
</view>
</view>
<!-- <view style="padding-bottom: 20rpx">
<u-back-top
:scroll-top="scrollTop"
bottom="60"
:customStyle="bgiStyle"
:iconStyle="iconStyle"
>
</u-back-top>
</view> -->
</view>
</template>
<script>
import { mapState, mapMutations } from "vuex";
export default {
name: "music",
props: {},
data() {
return {
scrollTop: 0,
bgiStyle: {
background: "#bbe5d8",
},
iconStyle: {
fontSize: "40rpx",
fontWeight: "bold",
color: "#54a966",
},
noticeList: [], //秒杀列表
goodsList: [], //秒杀列表
studyList: [], //正在学习
dataInfo: {},
flashSaleList: [], //试听
miaoShaContent: "",
curriculumList: [
{
name: "太湖商品",
url: "/pages/courseInformation/index/index",
color: "#d93737",
// url: "",
image: require("@/static/icon/taihuicon2.png"),
activeImage: require("@/static/icon/taihuicon2_active.png"),
},
{
name: "太湖之光",
url: "/pages/curriculum/order/index/index",
color: "#3ab3ae",
// url: "",
image: require("@/static/icon/taihuicon1.png"),
activeImage: require("@/static/icon/taihuicon1_active.png"),
},
// {
// name: "吴门之光",
// url: "/pages/medicaldes/medicaldes",
// imgUrl: require("@/static/icon/homePage/wmzg.png"),
// },
],
pagination1: {
// 请求参数
page: 1, //页码
limit: 20, //每页显示
total: 0, //总条数
},
pagination: {
// 请求参数
page: 1, //页码
limit: 20, //每页显示
total: 0, //总条数
},
urlList: {
list: "app/phoneDoctor.do?toHomePage",
getGoodsList: "common/taihuWelfare/getTaihuWelfareProductList", //秒杀商品
article: "common/taihuWelfare/getTaihuWelfareArticleList", //消息
},
};
},
onReady() {},
onLoad() {},
async onShow() {
this.currentCate = 0;
console.log("at line 287:", this.userInfo);
this.requestAll();
},
async onTabItemTap() {
this.currentCate = 0;
console.log("at line 287:", this.userInfo);
this.requestAll();
},
methods: {
...mapMutations(["setUserInfo"]),
onReachBottom1() {
// 上拉加载
// 当列表数量不大于或等于总数量,则再次调用接口请求数据
// if (this.currentCate == 0) {
if (this.goodsList.length >= this.pagination1.total) return;
this.pagination1.page++;
this.getGoodsList();
// }
},
onReachBottom2() {
// 上拉加载
// 当列表数量不大于或等于总数量,则再次调用接口请求数据
// if (this.currentCate == 1) {
if (this.noticeList.length >= this.pagination.total) return;
this.pagination.page++;
this.getArticle();
// }
},
gotoDetail(data) {
uni.navigateTo({
url: `/pages/homePage/index/noticeDetail?id=${data.id}&type=taihu`,
});
},
requestAll() {
// 获取当前页面的栈
this.$nextTick(async () => {
this.pagination1 = {
// 请求参数
page: 1, //页码
limit: 20, //每页显示
total: 0, //总条数
};
this.goodsList = [];
await this.getGoodsList();
// await this.getSociologyLabels();
});
},
handleGoApp() {
if (plus.os.name == "Android") {
plus.runtime.launchApplication(
{
pname: "com.cn.nuttyreading",
},
function (e) {
console.log("Open system default browser failed: " + e.message);
},
);
} else if (plus.os.name == "iOS") {
plus.runtime.launchApplication(
{
action: "taobao://",
},
function (e) {
console.log("Open system default browser failed: " + e.message);
},
);
}
},
async getData() {
var that = this;
this.$http.post(this.urlList.getUserLateCourseList).then(async (res) => {
console.log(res, "7777777777777777777");
if (res.code == 0) {
that.studyList = res.page ? res.page : [];
}
});
},
async getArticle() {
if (this.pagination.page == 1) {
this.noticeList = [];
}
var that = this;
var data = {
...this.pagination,
};
this.$http
.request({
url: this.urlList.article,
method: "POST",
data: data,
header: {
//默认 无 说明:请求头
"Content-Type": "application/json",
},
})
.then(async (res) => {
console.log(res, "7777777777777777777");
var that = this;
// console.log("result at line 332:", result);
// that.noticeList = res.page ? result : [];
that.pagination.total = res.page.total;
if (res.page.total == 0) {
// this.isLoadingHide = true;
}
if (res.code == 0 && res.page && res.page.records.length > 0) {
that.noticeList = that.noticeList.concat(res.page.records);
that.$forceUpdate();
} else {
//
}
// if (res.page.records.length != 10) {
// that.status = 1;
// } else {
// that.status = 0;
// }
})
.catch((e) => {
console.log(e);
});
},
async getGoodsList() {
var that = this;
this.$http
.request({
url: this.urlList.getGoodsList,
method: "POST",
data: this.pagination1,
header: {
//默认 无 说明:请求头
"Content-Type": "application/json",
},
})
.then(async (res) => {
console.log(res, "999");
var that = this;
if (this.pagination1.page == 1) {
this.goodsList = [];
}
// console.log("result at line 332:", result);
// that.noticeList = res.page ? result : [];
that.pagination1.total = res.page.total;
if (res.page.total == 0) {
// this.isLoadingHide = true;
}
if (res.code == 0 && res.page && res.page.records.length > 0) {
that.goodsList = that.goodsList.concat(res.page.records);
that.$forceUpdate();
} else {
//
}
// that.goodsList = res.products.records ? res.products.records : [];
// that.$forceUpdate();
});
},
async getMarketCourseList() {
var that = this;
this.$http
.request({
url: this.urlList.getMarketCourseList,
method: "POST",
data: {
id: 4, //这个需要后台提供数值,比如秒杀商品
limit: 10,
page: 1,
},
header: {
//默认 无 说明:请求头
"Content-Type": "application/json",
},
})
.then(async (res) => {
console.log(res, "7777777777777777777");
that.flashSaleList = res.courseList.records
? res.courseList.records
: [];
});
},
async getSociologyLabels() {
var that = this;
this.$http
.request({
url: this.urlList.getSociologyLabels,
method: "POST",
data: {
id: 0,
},
header: {
//默认 无 说明:请求头
"Content-Type": "application/json",
},
})
.then(async (res) => {
console.log(res.labels, "8888");
that.cateList.forEach((e, i) => {
var data = res.labels.filter((item) => item.title === e.title);
console.log("data at line 315:", data);
if (data.length > 0) {
that.cateList[i] = {
...data[0],
...e,
};
}
});
that.$forceUpdate();
console.log("this.cateList at line 314:", this.cateList);
});
},
goCourseDescription(v) {
console.log(v);
uni.navigateTo({
// url: '../bookShop/commodityDetail?id=' + item.id
url: `/pages/curriculum/order/curriculum/index?navTitle=${v.title}&title=${v.title}&id=${v.id}`,
});
},
goGoodsDetail(v) {
console.log(v);
uni.navigateTo({
// url: '../bookShop/commodityDetail?id=' + item.id
url: `/pages/goods/index/index?navTitle=${v.title}&isMiaosha=0&title=${v.title}&id=${v.productId}`,
});
},
async handleClickCurriculum(v, index) {
this.currentCate = index;
if (index == 0) {
this.pagination1 = {
// 请求参数
page: 1, //页码
limit: 20, //每页显示
total: 0, //总条数
};
this.goodsList = [];
await this.getGoodsList();
}
if (index == 1) {
this.pagination = {
// 请求参数
page: 1, //页码
limit: 20, //每页显示
total: 0, //总条数
};
this.noticeList = [];
await this.getArticle();
}
this.$forceUpdate();
console.log(v);
//if (v.url) {
//uni.navigateTo({
// url: v.url,
//});
//} else {
//this.$commonJS.showToast("此功能暂未开放");
//}
},
handleClickCate(v) {
console.log(v);
uni.navigateTo({
url: `${v.url}?navTitle=${v.title}&title=${v.title}&id=${v.id}`,
});
},
//关闭或开启 音乐
},
computed: {
...mapState(["userInfo"]),
timer() {
return calcTimer(this.userInfo.currentTime);
},
overTimer() {
return calcTimer(this.userInfo.duration);
},
playStatus() {
var playFlag = false;
this.userInfo.playFlag !== undefined
? (playFlag = this.userInfo.playFlag)
: "";
console.log(playFlag, "playFlag");
return playFlag;
},
},
watch: {},
};
//时间换算
function calcTimer(timer) {
if (timer === 0 || typeof timer !== "number") {
return "00:00";
}
let mm = Math.floor(timer / 60);
let ss = Math.floor(timer % 60);
if (mm < 10) {
mm = "0" + mm;
}
if (ss < 10) {
ss = "0" + ss;
}
return mm + ":" + ss;
}
</script>
<style lang="scss" scoped>
@import "@/style/mixin.scss";
.header_box {
width: 100%;
height: 320rpx;
display: flex;
justify-content: center;
align-items: center;
overflow: hidden;
color: #fff;
font-size: 80rpx;
// line-height: 260rpx;
}
.cate_box {
display: flex;
align-items: center;
justify-content: center;
padding: 0 !important;
padding-top: 40rpx;
.icon_bg {
width: 48%;
height: 80rpx;
line-height: 80rpx;
background-repeat: no-repeat;
background-size: 100% 100%;
color: #018f89;
font-size: 48rpx;
}
}
.main_content_box {
width: 100%;
height: calc(100vh - 320rpx);
background-color: rgba(255, 255, 255, 0.65);
padding: 27rpx;
// padding-top: 0rpx;
box-sizing: border-box;
// padding-top: 75rpx;
.curriculum_box {
width: 100%;
// height: 198rpx;
display: flex;
align-items: center;
justify-content: space-around;
padding: 0px 37rpx 17rpx;
box-sizing: border-box;
.curriculum_item_box {
height: 100%;
display: flex;
align-items: center;
.curriculum_item_img {
width: 39rpx;
height: 38rpx;
float: left;
}
.curriculum_item_name {
margin-top: -10rpx;
font-family: MicrosoftYaHei;
font-weight: bold;
font-size: 30rpx;
color: #001b73;
margin-left: 21rpx;
// line-height: 46rpx;
}
}
}
.flash_sale_box {
height: calc(100% - 100rpx);
// animation: example1 1s ease-out 0s backwards;
width: 100%;
margin-top: 33rpx;
margin-bottom: 10rpx;
.flash_sale_top {
width: 100%;
height: 61rpx;
background: #b7e0e2;
box-shadow: 0rpx 0rpx 6rpx 0rpx #e9dccc;
border-radius: 7rpx;
padding: 3rpx 18rpx 3rpx 10rpx;
box-sizing: border-box;
display: flex;
align-items: center;
margin-bottom: 21rpx;
.miaoShaIcon {
margin-right: 16rpx;
}
.miaoShaTitle {
margin-right: 25rpx;
font-family: PangMenZhengDaoBiaoTiTiMianFeiBan;
font-weight: normal;
font-size: 35rpx;
color: #018f89;
line-height: 46rpx;
}
.miaoShaContent {
width: calc(100% - 172rpx);
margin-top: 1rpx;
font-family: Microsoft YaHei;
font-weight: 600;
font-size: 21rpx;
color: #018f89;
// line-height: 45rpx;
}
}
}
.flash_sale_content {
width: 100%;
display: flex;
overflow: hidden;
height: 100%;
.flash_sale_content_item {
position: relative;
display: inline-block;
width: 48%;
// height: 300rpx;
background-color: #fff;
float: left;
border-radius: 10rpx;
// overflow: hidden;
margin-right: 4%;
overflow: hidden;
margin-bottom: 20rpx;
}
.active_price {
position: absolute;
top: 0rpx;
right: 0rpx;
width: 70rpx;
height: 72rpx;
background-repeat: no-repeat;
line-height: 50rpx;
background-size: 100% 100%;
background-image: url("@/static/icon/taihuactiveprice.png");
color: #fff;
font-size: 20rpx;
font-weight: bold;
text-align: center;
// margin-top: -10rpx;
// box-shadow: 0 0 30px 0 rgb(255, 255, 255);
}
.flash_sale_content_item:nth-child(2n) {
margin-right: 0;
}
.book_image {
width: 100%;
height: 192rpx;
// border-radius: 10rpx;
background-color: #e9e9e9;
}
.book_content {
padding: 20rpx 15rpx 10rpx;
}
.book_name {
font-family: MicrosoftYaHei;
font-weight: 600;
font-size: 26rpx;
line-height: 24rpx;
height: 50rpx;
color: #020001;
// text-align: center;
// margin-top: 18rpx;
letter-spacing: 1rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
}
.scroll-X {
width: 100%;
height: 100%;
white-space: nowrap;
}
.commonPageBox {
width: 100%;
height: 100vh;
// background-image: linear-gradient(
// to bottom,
// #fff7ea 25%,
// #fffdf5 50%,
// #fffdfc 75%
// );
background-size: 100% 100%;
background-repeat: no-repeat;
background-image: url("@/static/icon/taihubg.png");
// background-size: 100% 100%; background-repeat: no-repeat;background-image: url('@/static/icon/taihubg.png');
// padding-bottom: 50rpx;
// box-sizing: border-box;
}
.noticeIcon {
width: 20rpx;
}
.u-notice-bar {
background-color: transparent !important;
}
.bottomBox {
width: 100%;
height: 200rpx;
display: flex;
align-items: center;
justify-content: space-between;
.item_img {
width: 48% !important;
height: 100%;
image {
width: 100%;
height: 100%;
}
}
}
.book_price {
display: flex;
align-items: center;
}
.book_price_current {
color: #ff5b36;
font-weight: bold;
.price_icon {
font-size: 22rpx;
}
}
.book_price_old {
color: #9c9a9b;
font-size: 20rpx;
margin-left: 10rpx;
// margin-top: -4rpx;
font-weight: normal;
text-decoration: line-through;
}
.sumSales {
color: #6c6c6c;
font-size: 20rpx;
font-weight: normal;
}
.bottom {
display: flex;
align-items: center;
justify-content: space-between;
}
::v-deep.list_item {
background-color: #fff;
display: flex;
align-items: center !important;
border-bottom: none;
padding: 10rpx 0 !important;
padding-right: 10rpx !important;
margin-bottom: 10rpx;
border-radius: 10rpx;
padding-left: 20rpx !important;
font-size: 24rpx;
font-weight: bold;
color: #020001;
.rightArrow {
width: 28rpx;
height: 28rpx;
}
.titleItem {
}
}
::v-deep.scroll-view-item:nth-child(2n-1) {
// background-color: #B7E0E2 !important;
background-color: #fff !important;
}
</style>