|
@@ -1,7 +1,6 @@
|
|
|
<template>
|
|
|
<view class="container activity-content">
|
|
|
- <!-- tabs -->
|
|
|
- <view class="top-content">
|
|
|
+ <view class="top-content" id="idtop">
|
|
|
<view class="tab">
|
|
|
<view class="tab-item" v-for="(item, index) in tabs" :key="item.id">
|
|
|
<view class="scroll-tab-item" :class="{ active: tabsActive == index }"
|
|
@@ -12,12 +11,22 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <!-- 搜索 -->
|
|
|
- <view class="index-fixed" v-if="tabsActive == 0" @click="goSearch">
|
|
|
- <icon type="search" size="15" class="search_ico" />
|
|
|
- <text>请输入关键字</text>
|
|
|
+ </view>
|
|
|
+ <view class="dynamic-content" v-if="tabsActive == 0">
|
|
|
+ <view class="target-title">
|
|
|
+ 活动预告:
|
|
|
+ </view>
|
|
|
+ <view class="target-item" v-for="(item,index) in dynamicList" :key="index" @click="changeTarget(index,item)"
|
|
|
+ :class="{'bgcolor':spanIndex.indexOf(index)>-1}">
|
|
|
+ {{item.KeyWord}}
|
|
|
</view>
|
|
|
- <view class="select-conyent" v-if="tabsActive == 0">
|
|
|
+ <view class="target-item target-search" @click="goSearch">
|
|
|
+ <image src="../../static/img/search_iocn.png" mode=""></image>
|
|
|
+ <text style="margin-left: 10rpx;">更多...</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="select-sticky" v-if="tabsActive == 0">
|
|
|
+ <view class="select-conyent">
|
|
|
<van-dropdown-menu active-color="#333333">
|
|
|
<van-dropdown-item id="statusstate" :title="activeStateName" @close="closeTheWindow('statusstate')">
|
|
|
<view class="menu-items">
|
|
@@ -29,6 +38,19 @@
|
|
|
<text>{{ key.StatusName }}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
+ <view style="background-color: #f8f8fa;width: 100%;">
|
|
|
+ <view style="margin: 0 auto;width: 682rpx;border-bottom: 2rpx solid #E5E5E5;">
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="menu-items">
|
|
|
+ <view class="menu-items-box" @click="timeListBtn('statusstate', key)"
|
|
|
+ v-for="key in activityTimeList" :key="key.Id">
|
|
|
+ <view class="items-box">
|
|
|
+ <u-icon v-if="key.IsChoose" name="checkbox-mark" color="#2C83FF" size="24"></u-icon>
|
|
|
+ </view>
|
|
|
+ <text>{{ key.StatusName }}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
<view class="replacement-box">
|
|
|
<view class="replacement">
|
|
|
<text @click="replacementBtn('statusstate')" class="replacement-box">重置</text>
|
|
@@ -81,8 +103,11 @@
|
|
|
</van-dropdown-item>
|
|
|
</van-dropdown-menu>
|
|
|
</view>
|
|
|
+
|
|
|
</view>
|
|
|
- <view class="box-content" :class="{ head: tabsActive == 1 }" v-if="haveData">
|
|
|
+
|
|
|
+ <!-- </view> -->
|
|
|
+ <view class="box-content" id="contentList" :class="{ head: tabsActive == 1 }" v-if="haveData">
|
|
|
<view class="content-list" v-for="(item, index) in collectList" :key="index">
|
|
|
<view class="list-top" @click="goDetail(item)">
|
|
|
<view class="list-top-box">
|
|
@@ -124,7 +149,7 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
- <text style="padding-bottom: 30rpx">活动时间:{{ item.ActivityTime }}</text>
|
|
|
+ <text style="padding-bottom: 30rpx">活动时间:{{ item.ActivityTimeText }}</text>
|
|
|
</view>
|
|
|
<view class="" style="display: flex; align-items: center; padding-right: 30rpx">
|
|
|
<u-icon style="padding-bottom: 30rpx" name="arrow-right" color="#BDBDBD" size="34"></u-icon>
|
|
@@ -171,7 +196,7 @@
|
|
|
<u-loadmore :status="status" icon-type="flower" :load-text="loadText" margin-top="20"
|
|
|
v-if="totalPage > 1" />
|
|
|
</view>
|
|
|
- <view class="nodata" v-else>
|
|
|
+ <view class="nodata" :class="tabsActive == 0?'':'nodataTwo'" v-else>
|
|
|
<image src="@/static/img/act_search.png" mode="" class="nodata_ico"></image>
|
|
|
<text>{{tabsActive==1?'暂无日程':"暂无活动"}}</text>
|
|
|
</view>
|
|
@@ -216,19 +241,19 @@
|
|
|
tabsActive: 0,
|
|
|
totalPage: "",
|
|
|
haveData: true,
|
|
|
+ spanIndex: [],
|
|
|
activeStateName: "未开始",
|
|
|
activeState: "1", //活动进行状态
|
|
|
+ dynamicList: [],
|
|
|
+ dynamicLKeyWodr: [],
|
|
|
+ keyWord: ''
|
|
|
};
|
|
|
},
|
|
|
- watch: {
|
|
|
- tabsActive() {},
|
|
|
- },
|
|
|
mixins: [myMixin],
|
|
|
components: {
|
|
|
modalDialog,
|
|
|
areaCode,
|
|
|
},
|
|
|
-
|
|
|
onLoad(option) {
|
|
|
this.$store.dispatch("checkHandle", 'load').then(res => {
|
|
|
app.globalData.isAuth = res.IsAuth;
|
|
@@ -241,7 +266,9 @@
|
|
|
this.activeStateName = option.stateName;
|
|
|
this.chartPermissionName = option.chartName;
|
|
|
this.activityTypeName = option.typeName;
|
|
|
- // this.tabsActive = option.tabs;
|
|
|
+ this.activityTimeStatus = option.timeStatus;
|
|
|
+ this.spanIndex = option.indexs ? option.indexs.split(',').map(item => item - 0) : []
|
|
|
+ this.keyWord = option.keys
|
|
|
this.isGain = false;
|
|
|
} else {
|
|
|
this.isGain = true;
|
|
@@ -251,7 +278,7 @@
|
|
|
}
|
|
|
this.getUserSearchContent();
|
|
|
})
|
|
|
-
|
|
|
+ this.fastSearchKeWord()
|
|
|
},
|
|
|
//切换tabs 刷新页面
|
|
|
onTabItemTap() {
|
|
@@ -264,13 +291,58 @@
|
|
|
this.activityTypeIds = ""; //活动类型id 多个用 , 隔开
|
|
|
this.chartPermissionIds = ""; //行业id 多个用 , 隔开
|
|
|
this.page_no = 1;
|
|
|
- this.collectList = [];
|
|
|
+ this.collectList = [];
|
|
|
+ this.spanIndex=[]
|
|
|
+ this.keyWord= ''
|
|
|
+ this.activityTimeList.forEach(key => {key.IsChoose=false})
|
|
|
+ this.activityTimeStatus=''
|
|
|
this.getList();
|
|
|
this.getUserSearchContent();
|
|
|
}
|
|
|
|
|
|
},
|
|
|
methods: {
|
|
|
+ shareOption() {
|
|
|
+ const arr = this.activeState.split(',').map(item => item - 0)
|
|
|
+ this.listActivityStaus.forEach(item => {
|
|
|
+ if (arr.indexOf(item.Id) !== -1) {
|
|
|
+ item.IsChoose = true
|
|
|
+ } else {
|
|
|
+ item.IsChoose = false
|
|
|
+ }
|
|
|
+ })
|
|
|
+ const arrTwo = this.activityTimeStatus.split(',').map(item => item - 0)
|
|
|
+ this.activityTimeList.forEach(item => {
|
|
|
+ if (arrTwo.indexOf(item.Id) !== -1) {
|
|
|
+ item.IsChoose = true
|
|
|
+ } else {
|
|
|
+ item.IsChoose = false
|
|
|
+ }
|
|
|
+ })
|
|
|
+ const hyarr = this.chartPermissionIds.split(',').map(item => item - 0)
|
|
|
+ this.listChartPermission.forEach(key => {
|
|
|
+ if (hyarr.indexOf(key.ChartPermissionId) !== -1) {
|
|
|
+ key.IsChoose = true
|
|
|
+ } else {
|
|
|
+ key.IsChoose = false
|
|
|
+ }
|
|
|
+ })
|
|
|
+ const lxarr = this.activityTypeIds.split(',').map(item => item - 0)
|
|
|
+ this.listActivityType.forEach(key => {
|
|
|
+ if (lxarr.indexOf(key.ActivityTypeId) !== -1) {
|
|
|
+ key.IsChoose = true
|
|
|
+ } else {
|
|
|
+ key.IsChoose = false
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.preserve()
|
|
|
+ },
|
|
|
+ fastSearchKeWord() {
|
|
|
+ activity.fastSearchKeWord().then(res => {
|
|
|
+ if (res.Ret !== 200) return
|
|
|
+ this.dynamicList = res.Data.List || []
|
|
|
+ })
|
|
|
+ },
|
|
|
//获取列表
|
|
|
getList() {
|
|
|
activity
|
|
@@ -281,6 +353,8 @@
|
|
|
ActivityTypeIds: this.activityTypeIds, //活动类型id 多个用 , 隔开
|
|
|
ChartPermissionIds: this.chartPermissionIds, //行业id 多个用 , 隔开
|
|
|
IsShowJurisdiction: this.isId,
|
|
|
+ KeyWord: this.keyWord,
|
|
|
+ WhichDay: this.activityTimeStatus
|
|
|
})
|
|
|
.then((res) => {
|
|
|
if (res.Ret !== 200) return;
|
|
@@ -333,7 +407,7 @@
|
|
|
this.isShowJurisdiction = res.Data.IsShowJurisdiction;
|
|
|
this.listActivityStaus = res.Data.ListActivityStaus;
|
|
|
this.listActivityType = res.Data.ListActivityType;
|
|
|
- this.listChartPermission = res.Data.ListChartPermission || [];
|
|
|
+ this.listChartPermission = res.Data.ListChartPermission || [];
|
|
|
this.listChartPermissionInit = res.Data.ListChartPermission2
|
|
|
if (name == "traverse") {
|
|
|
const hyArr = [];
|
|
@@ -344,12 +418,13 @@
|
|
|
});
|
|
|
this.chartPermissionIds = hyArr.join(",");
|
|
|
}
|
|
|
+ if (this.isGain) {
|
|
|
+ // this.preserve()
|
|
|
+ } else {
|
|
|
+ this.shareOption()
|
|
|
+ }
|
|
|
});
|
|
|
- if (this.isGain) {
|
|
|
- // this.preserve()
|
|
|
- } else {
|
|
|
- this.shareOption();
|
|
|
- }
|
|
|
+
|
|
|
|
|
|
},
|
|
|
//头部tabs切换
|
|
@@ -507,8 +582,81 @@
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
+ //遍历
|
|
|
+ preserve() {
|
|
|
+ const arr = []
|
|
|
+ const str = []
|
|
|
+ this.listActivityStaus.forEach(item => {
|
|
|
+ if (item.IsChoose) {
|
|
|
+ arr.push(item.Id)
|
|
|
+ str.push(item.StatusName)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ if (str.length == this.listActivityStaus.length) {
|
|
|
+ this.activeStateName = '所有状态'
|
|
|
+ } else {
|
|
|
+ this.activeStateName = str.join(',')
|
|
|
+ }
|
|
|
+ this.activeState = arr.join(',')
|
|
|
+ const arrTwo = []
|
|
|
+ this.activityTimeList.forEach(key => {
|
|
|
+ if (key.IsChoose) {
|
|
|
+ arrTwo.push(key.Id)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.activityTimeStatus = arrTwo.join(',')
|
|
|
+ const hyArr = []
|
|
|
+ const hyStr = []
|
|
|
+ this.listChartPermission.forEach(key => {
|
|
|
+ if (key.IsChoose) {
|
|
|
+ hyArr.push(key.ChartPermissionId)
|
|
|
+ hyStr.push(key.PermissionName)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ if (hyStr.length == this.listChartPermission.length && hyStr.length > 0) {
|
|
|
+ this.chartPermissionName = '所有行业'
|
|
|
+ } else if (hyStr.length <= 0) {
|
|
|
+ this.chartPermissionName = '行业分类'
|
|
|
+ } else {
|
|
|
+ this.chartPermissionName = hyStr.join(',')
|
|
|
+ }
|
|
|
+ this.chartPermissionIds = hyArr.join(',')
|
|
|
+ const lxArr = []
|
|
|
+ const lxStr = []
|
|
|
+ this.listActivityType.forEach(key => {
|
|
|
+ if (key.IsChoose) {
|
|
|
+ lxArr.push(key.ActivityTypeId)
|
|
|
+ lxStr.push(key.ActivityTypeName)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ if (lxStr.length == this.listActivityType.length && lxStr.length > 0) {
|
|
|
+ this.activityTypeName = '所有活动'
|
|
|
+ } else if (lxStr.length <= 0) {
|
|
|
+ this.activityTypeName = '活动类型'
|
|
|
+ } else {
|
|
|
+ this.activityTypeName = lxStr.join(',')
|
|
|
+ }
|
|
|
+ this.activityTypeIds = lxArr.join(',')
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+ //选择标签
|
|
|
+ changeTarget(index, item) {
|
|
|
+ let arrIndex = this.spanIndex.indexOf(index);
|
|
|
+ if (arrIndex > -1) {
|
|
|
+ this.spanIndex.splice(arrIndex, 1);
|
|
|
+ this.dynamicLKeyWodr.splice(arrIndex, 1);
|
|
|
+ } else {
|
|
|
+ this.spanIndex.push(index);
|
|
|
+ this.dynamicLKeyWodr.push(item.KeyWord)
|
|
|
+ }
|
|
|
+ this.keyWord = this.dynamicLKeyWodr.join(',')
|
|
|
+ this.page_no = 1
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+ this.$store.dispatch("statistics",{PageType:'Activit'})
|
|
|
},
|
|
|
- onShow() {},
|
|
|
/**
|
|
|
* 用户点击分享
|
|
|
*/
|
|
@@ -534,7 +682,12 @@
|
|
|
"&typeName=" +
|
|
|
this.activityTypeName +
|
|
|
"&tabs=" +
|
|
|
- this.tabsActive,
|
|
|
+ this.tabsActive +
|
|
|
+ "&timeStatus=" +
|
|
|
+ this.activityTimeStatus +
|
|
|
+ "&indexs=" + this.spanIndex +
|
|
|
+ "&keys=" + this.keyWord,
|
|
|
+
|
|
|
success: (res) => {},
|
|
|
fail: (err) => {},
|
|
|
};
|
|
@@ -559,7 +712,7 @@
|
|
|
} else {
|
|
|
this.getScheduleList();
|
|
|
}
|
|
|
- }),
|
|
|
+ })
|
|
|
};
|
|
|
</script>
|
|
|
|
|
@@ -567,6 +720,135 @@
|
|
|
@import "../../activityPages/index.scss";
|
|
|
|
|
|
.box-content {
|
|
|
- padding: 290rpx 34rpx 20rpx !important;
|
|
|
+ padding: 0rpx 34rpx 20rpx !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .dynamic-content {
|
|
|
+ padding: 90rpx 30rpx 10rpx;
|
|
|
+ width: 100%;
|
|
|
+ background-color: #fff;
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ border-bottom: 3px solid #F7F7F7;
|
|
|
+
|
|
|
+ .target-title {
|
|
|
+ padding: 5rpx 20rpx 4rpx 5rpx;
|
|
|
+ border-radius: 20rpx;
|
|
|
+ margin: 15rpx 20rpx 15rpx 0;
|
|
|
+ font-size: 30rpx;
|
|
|
+ color: #2C83FF;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .target-item {
|
|
|
+ padding: 5rpx 20rpx;
|
|
|
+ color: #2C83FF;
|
|
|
+ font-size: 30rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ background-color: #EBF4FF;
|
|
|
+ margin: 15rpx 20rpx 15rpx 0;
|
|
|
+ border-radius: 27rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .target-search {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ image {
|
|
|
+ width: 30rpx;
|
|
|
+ height: 30rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .bgcolor {
|
|
|
+ background-color: #3385FF !important;
|
|
|
+ color: #fff !important;
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .select-sticky {
|
|
|
+ position: sticky !important;
|
|
|
+ width: 100%;
|
|
|
+ top: 78rpx;
|
|
|
+ z-index: 9999;
|
|
|
+ background-color: #fff;
|
|
|
+
|
|
|
+ .select-conyent {
|
|
|
+ padding: 0 30rpx;
|
|
|
+
|
|
|
+ .decide {
|
|
|
+ background-color: #F8F8FA;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ margin: 0 auto;
|
|
|
+ height: 110rpx;
|
|
|
+ width: 100%;
|
|
|
+ padding-left: 30rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .items-box {
|
|
|
+ width: 40rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .menu-items {
|
|
|
+ background-color: #F8F8FA;
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ padding: 30rpx 30rpx 0;
|
|
|
+
|
|
|
+ .menu-items-box {
|
|
|
+ display: flex;
|
|
|
+ width: 50%;
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ margin-bottom: 40rpx;
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .replacement-box {
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 0rpx 0rpx 16rpx 16rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .replacement {
|
|
|
+ margin: 0rpx 30rpx 20rpx;
|
|
|
+ display: flex;
|
|
|
+ background-color: #2C83FF;
|
|
|
+ opacity: 1;
|
|
|
+ height: 60rpx;
|
|
|
+ line-height: 58rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #FFFFFF;
|
|
|
+ border-radius: 30rpx;
|
|
|
+
|
|
|
+ text {
|
|
|
+ flex: 1;
|
|
|
+ text-align: center;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .replacement-box {
|
|
|
+ border: 1rpx solid #2C83FF;
|
|
|
+ opacity: 1;
|
|
|
+ color: #2C83FF;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 28rpx 0rpx 28rpx 28rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .activity-content .nodata {
|
|
|
+ padding-top: 80rpx !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .activity-content .nodataTwo {
|
|
|
+ padding-top: 280rpx !important;
|
|
|
}
|
|
|
</style>
|