5 changed files with 270 additions and 233 deletions
Unified View
Diff Options
-
+213 -184pages/mine/promotionRecord.vue
-
+18 -7pages/mine/releaseRecord.vue
-
+1 -1pages/mine/sonPage/promotion/promotionRecordList.vue
-
+24 -19pages/mine/sonPage/release/releaseList.vue
-
+14 -22pages/publish/postDetail.vue
+ 213
- 184
pages/mine/promotionRecord.vue
View File
| @ -1,192 +1,221 @@ | |||||
| <template> | <template> | ||||
| <view class="promotionRecord"> | |||||
| <!--顶部导航栏--> | |||||
| <navbar | |||||
| leftClick | |||||
| @leftClick="$utils.navigateBack" | |||||
| title="我的推广"/> | |||||
| <!--主页面--> | |||||
| <view class="frame"> | |||||
| <!--标题--> | |||||
| <view class="title"> | |||||
| <span>推广记录</span> | |||||
| </view> | |||||
| <!--搜索条件--> | |||||
| <view class="search"> | |||||
| <!--搜索框--> | |||||
| <view style="width:40%;height:100%"> | |||||
| <uv-input placeholder="请输入内容" border="surround" clearable></uv-input> | |||||
| </view> | |||||
| <!--开始时间--> | |||||
| <view class="dateTimeCls"> | |||||
| <view class="date" @click="startDateOpen"> | |||||
| <uv-datetime-picker ref="startDateRef" v-model="queryParams.startDate" mode="date" | |||||
| @confirm="startDateChange"> | |||||
| </uv-datetime-picker> | |||||
| </view> | |||||
| <view class="image"> | |||||
| <image src="/static/image/promotionRecord/2.svg" style="width: 100%;height: 100%"></image> | |||||
| </view> | |||||
| </view> | |||||
| <!--结束时间--> | |||||
| <view class="dateTimeCls"> | |||||
| <view class="date" @click="endDateOpen"> | |||||
| {{ queryParams.endDate }} | |||||
| <uv-datetime-picker ref="endDateRef" v-model="queryParams.endDate" mode="date" | |||||
| @confirm="endDateChange"> | |||||
| </uv-datetime-picker> | |||||
| </view> | |||||
| <view class="image"> | |||||
| <image src="/static/image/promotionRecord/2.svg" style="width: 100%;height: 100%"></image> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <!--发布列表--> | |||||
| <view style="" class="publishListClass"> | |||||
| <PromotionRecordList :list="promotionRecordList"/> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <view class="promotionRecord"> | |||||
| <!--顶部导航栏--> | |||||
| <navbar leftClick @leftClick="$utils.navigateBack" title="我的推广" /> | |||||
| <!--主页面--> | |||||
| <view class="frame"> | |||||
| <!--标题--> | |||||
| <view class="title"> | |||||
| <span>推广记录</span> | |||||
| </view> | |||||
| <!--搜索条件--> | |||||
| <view class="search"> | |||||
| <!--搜索框--> | |||||
| <view style="width:40%;height:100%"> | |||||
| <uv-input v-model="queryParams.keyWord" placeholder="请输入内容" border="surround" clearable | |||||
| @change="keyWordChange" | |||||
| ></uv-input> | |||||
| </view> | |||||
| <!--开始时间--> | |||||
| <view class="dateTimeCls"> | |||||
| <view class="date" @click="startDateOpen"> | |||||
| {{ queryParams.startDate }} | |||||
| <uv-datetime-picker ref="startDateRef" v-model="queryParams.startDate" mode="date" | |||||
| @confirm="startDateChange"> | |||||
| </uv-datetime-picker> | |||||
| </view> | |||||
| <view class="image"> | |||||
| <image src="/static/image/promotionRecord/2.svg" style="width: 100%;height: 100%"></image> | |||||
| </view> | |||||
| </view> | |||||
| <!--结束时间--> | |||||
| <view class="dateTimeCls"> | |||||
| <view class="date" @click="endDateOpen"> | |||||
| {{ queryParams.endDate }} | |||||
| <uv-datetime-picker ref="endDateRef" v-model="queryParams.endDate" mode="date" | |||||
| @confirm="endDateChange"> | |||||
| </uv-datetime-picker> | |||||
| </view> | |||||
| <view class="image"> | |||||
| <image src="/static/image/promotionRecord/2.svg" style="width: 100%;height: 100%"></image> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <!--发布列表--> | |||||
| <view style="" class="publishListClass"> | |||||
| <PromotionRecordList :list="promotionRecordList" /> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </template> | </template> | ||||
| <script> | <script> | ||||
| import PromotionRecordList from "@/pages/mine/sonPage/promotion/promotionRecordList.vue"; | |||||
| import moment from "moment"; | |||||
| export default { | |||||
| components: {PromotionRecordList}, | |||||
| data() { | |||||
| return { | |||||
| promotionRecordList: [ | |||||
| { | |||||
| title: "推广记录", | |||||
| createTime: '2024-08-22 09:00:00', | |||||
| createBy: "24小时", | |||||
| isPay: "￥100" | |||||
| }, | |||||
| ], | |||||
| queryParams: { | |||||
| pageNo: 1, | |||||
| pageSize: 10, | |||||
| startDate:moment(new Date()).format('YYYY-MM-DD'), | |||||
| endDate: moment(new Date()).format('YYYY-MM-DD'), | |||||
| import PromotionRecordList from "@/pages/mine/sonPage/promotion/promotionRecordList.vue"; | |||||
| import moment from "moment"; | |||||
| export default { | |||||
| components: { | |||||
| PromotionRecordList | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| promotionRecordList: [], | |||||
| queryParams: { | |||||
| pageNo: 1, | |||||
| pageSize: 10, | |||||
| startDate: moment(new Date()).format('YYYY-MM-DD'), | |||||
| endDate: moment(new Date()).format('YYYY-MM-DD'), | |||||
| keyWord: '', | |||||
| }, | |||||
| } | |||||
| }, | |||||
| onReachBottom() { | |||||
| console.log("=====") | |||||
| let allTotal = this.queryParams.pageNo * this.queryParams.pageSize | |||||
| if (allTotal < this.total) { | |||||
| //当前条数小于总条数 则增加请求数 | |||||
| this.queryParams.pageSize += 10 | |||||
| this.getData() //调用加载数据方法 | |||||
| } | |||||
| }, | |||||
| mounted() { | |||||
| console.log("====") | |||||
| this.getData() | |||||
| }, | |||||
| methods: { | |||||
| getData() { | |||||
| console.log("==getData==") | |||||
| this.$api('infoGetPromotionPage', { | |||||
| pageNo: this.queryParams.pageNo, | |||||
| pageSize: this.queryParams.pageSize, | |||||
| startDate: this.queryParams.startDate, | |||||
| endDate: this.queryParams.endDate, | |||||
| keyWord: this.queryParams.keyWord | |||||
| }, res => { | |||||
| if (res.code == 200) { | |||||
| this.promotionRecordList = res.result.records | |||||
| this.total = res.result.total | |||||
| } | |||||
| }) | |||||
| }, | |||||
| keyWordChange(val) { | |||||
| console.log("val",val) | |||||
| this.queryParams.keyWord = val | |||||
| this.getData() | |||||
| }, | }, | ||||
| } | |||||
| }, | |||||
| methods: { | |||||
| startDateChange(val) { | |||||
| console.log(val.value, "======startDateChange=======") | |||||
| this.queryParams.startDate = moment(new Date(val.value)).format('YYYY-MM-DD') | |||||
| }, | |||||
| startDateOpen() { | |||||
| this.$refs.startDateRef.open(); | |||||
| }, | |||||
| endDateChange(val) { | |||||
| console.log(val.value, "=======endDateChange======") | |||||
| var aaa = moment(new Date(val.value)).format('YYYY-MM-DD') | |||||
| console.log(aaa, "aaa") | |||||
| this.queryParams.endDate = val.value | |||||
| }, | |||||
| endDateOpen() { | |||||
| this.$refs.endDateRef.open(); | |||||
| }, | |||||
| startDateFormatter(type, value) { | |||||
| if (type === 'year') { | |||||
| return `${value}年` | |||||
| } | |||||
| if (type === 'month') { | |||||
| return `${value}月` | |||||
| } | |||||
| if (type === 'day') { | |||||
| return `${value}日` | |||||
| } | |||||
| return value | |||||
| }, | |||||
| endDateFormatter(type, value) { | |||||
| console.log(type, value, "======endDateFormatter=======") | |||||
| if (type === 'year') { | |||||
| return `${value}年` | |||||
| } | |||||
| if (type === 'month') { | |||||
| return `${value}月` | |||||
| } | |||||
| if (type === 'day') { | |||||
| return `${value}日` | |||||
| } | |||||
| return value | |||||
| } | |||||
| } | |||||
| } | |||||
| startDateChange(val) { | |||||
| this.queryParams.startDate = moment(new Date(val.value)).format('YYYY-MM-DD') | |||||
| this.getData() | |||||
| }, | |||||
| startDateOpen() { | |||||
| this.$refs.startDateRef.open(); | |||||
| }, | |||||
| endDateChange(val) { | |||||
| var aaa = moment(new Date(val.value)).format('YYYY-MM-DD') | |||||
| console.log(aaa,"aaaaaaaaaaaa") | |||||
| this.queryParams.endDate = aaa | |||||
| }, | |||||
| endDateOpen() { | |||||
| this.$refs.endDateRef.open(); | |||||
| }, | |||||
| // startDateFormatter(type, value) { | |||||
| // if (type === 'year') { | |||||
| // return `${value}年` | |||||
| // } | |||||
| // if (type === 'month') { | |||||
| // return `${value}月` | |||||
| // } | |||||
| // if (type === 'day') { | |||||
| // return `${value}日` | |||||
| // } | |||||
| // return value | |||||
| // }, | |||||
| // endDateFormatter(type, value) { | |||||
| // console.log(type, value, "======endDateFormatter=======") | |||||
| // if (type === 'year') { | |||||
| // return `${value}年` | |||||
| // } | |||||
| // if (type === 'month') { | |||||
| // return `${value}月` | |||||
| // } | |||||
| // if (type === 'day') { | |||||
| // return `${value}日` | |||||
| // } | |||||
| // return value | |||||
| // } | |||||
| } | |||||
| } | |||||
| </script> | </script> | ||||
| <style lang="scss" scoped> | <style lang="scss" scoped> | ||||
| * { | |||||
| box-sizing: border-box; | |||||
| margin: 0; | |||||
| padding: 0; | |||||
| } | |||||
| .promotionRecord { | |||||
| width: 100vw; | |||||
| height: 100vh; | |||||
| .frame { | |||||
| width: 100%; | |||||
| //height: calc(100vh - 220rpx); | |||||
| padding: 28rpx 28rpx 0 28rpx; | |||||
| .title { | |||||
| font-size: 34rpx; | |||||
| color: #333; | |||||
| font-weight: 700 | |||||
| } | |||||
| .search { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| gap: 10rpx; | |||||
| width: 100%; | |||||
| height: 80rpx; | |||||
| margin-top: 20rpx; | |||||
| .dateTimeCls { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: space-between; | |||||
| width: 25%; | |||||
| height: 80%; | |||||
| border: 1px solid #b0b2b3; | |||||
| padding: 5rpx; | |||||
| border-radius: 20rpx; | |||||
| .date { | |||||
| font-size: 25rpx; | |||||
| display: flex; | |||||
| align-items: center; | |||||
| width: 80%; | |||||
| height: 100%; | |||||
| color: #b0b2b3; | |||||
| } | |||||
| .image { | |||||
| width: 20%; | |||||
| height: 100%; | |||||
| } | |||||
| } | |||||
| } | |||||
| .publishListClass { | |||||
| margin-top: 10rpx; | |||||
| height: 78vh; | |||||
| overflow: auto; | |||||
| width: 100%; | |||||
| } | |||||
| } | |||||
| } | |||||
| </style> | |||||
| * { | |||||
| box-sizing: border-box; | |||||
| margin: 0; | |||||
| padding: 0; | |||||
| } | |||||
| .promotionRecord { | |||||
| width: 100vw; | |||||
| height: 100vh; | |||||
| .frame { | |||||
| width: 100%; | |||||
| //height: calc(100vh - 220rpx); | |||||
| padding: 28rpx 28rpx 0 28rpx; | |||||
| .title { | |||||
| font-size: 34rpx; | |||||
| color: #333; | |||||
| font-weight: 700 | |||||
| } | |||||
| .search { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| gap: 10rpx; | |||||
| width: 100%; | |||||
| height: 80rpx; | |||||
| margin-top: 20rpx; | |||||
| .dateTimeCls { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: space-between; | |||||
| width: 25%; | |||||
| height: 80%; | |||||
| border: 1px solid #b0b2b3; | |||||
| padding: 5rpx; | |||||
| border-radius: 20rpx; | |||||
| .date { | |||||
| font-size: 25rpx; | |||||
| display: flex; | |||||
| align-items: center; | |||||
| width: 80%; | |||||
| height: 100%; | |||||
| color: #b0b2b3; | |||||
| } | |||||
| .image { | |||||
| width: 20%; | |||||
| height: 100%; | |||||
| } | |||||
| } | |||||
| } | |||||
| .publishListClass { | |||||
| margin-top: 10rpx; | |||||
| height: 78vh; | |||||
| overflow: auto; | |||||
| width: 100%; | |||||
| } | |||||
| } | |||||
| } | |||||
| </style> | |||||