Refactor(ALL):Vue3同步调整为Vue2
This commit is contained in:
@@ -13,6 +13,12 @@ export default {
|
|||||||
defaultState: {
|
defaultState: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false
|
default: false
|
||||||
|
},
|
||||||
|
mark: {
|
||||||
|
type: Array,
|
||||||
|
default: () => {
|
||||||
|
return []
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
@@ -27,7 +33,7 @@ export default {
|
|||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
change() {
|
change() {
|
||||||
this.$emit('change', !this.isSelected)
|
this.$emit('change', !this.isSelected, this.mark)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,492 @@
|
|||||||
|
<template>
|
||||||
|
<view class="marquee_box" @touchstart='touchstartFn' @touchend='touchendFn'>
|
||||||
|
<block v-show="isShow">
|
||||||
|
<view class="" v-if="direction=='right'||direction=='left'">
|
||||||
|
<view v-if="broadcastType=='text'" class="marquee_container" :style="'background:'+broadcastStylees.back_color+';'">
|
||||||
|
<view v-if="broadcastIconIsDisplay" class="broadIcon" :style="'background:'+broadcastStylees.back_color+';font-size:28rpx;'">
|
||||||
|
<text class="iconfont icon-guangbozheng-"></text>
|
||||||
|
<text style="margin-left:12rpx;">{{broadcast_tit}}:</text>
|
||||||
|
</view>
|
||||||
|
<view class="boradcast_text_left_rig" :class='[direction=="left"?"marquee_text_left":direction=="right"?"marquee_text_right":"",animation_paused?"animation_pausedcss":""]'
|
||||||
|
:style="'--marqueeWidth--:'+(-broadcastStylees.width_mal)+'px;--speed--:'+broadcastStylees.time+'s;width:'+broadcastStylees.width_mal+'px;'">
|
||||||
|
<view v-for="(item,index) in broadcastDataes" @click.stop="click_event(index)" :key="index" :style="'color:'+broadcastStylees.text_color+';margin-left:'+(index!=0?item.starspos:0)+'px;font-size:'+broadcastStylees.font_size+'rpx;'">
|
||||||
|
{{item.text}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view v-if="broadcastType=='mould'" class="mould">
|
||||||
|
<view class="" style="width: 100%;position: relative;overflow: hidden;" :style="'height:'+viewHeight+'rpx;'">
|
||||||
|
<view class="broadcastTopBtm dsf" :class="[direction=='left'?'broadcastDataTopBtmDatacss_let':direction=='right'?'broadcastDataTopBtmDatacss_rig':'',animation_paused?'animation_pausedcss':'']"
|
||||||
|
:style="'--scrollWidth--:'+(-(scrlloWidth/2))+'px;--scrollSpeed2--:'+(scrlloWidth/broadcastStyle.speed)+'s;width:'+(scrlloWidth*2)+'px;'">
|
||||||
|
<view ref="mouldRef" class="bml01" style="display: flex;justify-content: space-between;">
|
||||||
|
<slot />
|
||||||
|
<!-- <slot /> -->
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view v-if="direction=='top'||direction=='bottom'" class="broadcastTopBtm" :style="'font-size:'+broadcastStyle.font_size+'rpx;color:'+broadcastStyle.text_color+';background:'+broadcastStyle.back_color+';height:'+viewHeight+'rpx;--scrollHeight--:'+(-broadcastTopBtmHeight/2)+'px;--scrollSpeed--:'+((broadcastTopBtmHeight/2)/broadcastStyle.speed)+'s;'">
|
||||||
|
<view v-if="broadcastType=='text'" :class="[direction=='top'?'broadcastDataTopBtmDatacss_top':direction=='bottom'?'broadcastDataTopBtmDatacss_bottom':'',animation_paused?'animation_pausedcss':'']">
|
||||||
|
<view v-for="(item,index) in broadcastDataTopBtmDataes" :key="index" @click.stop="click_event()" class="bdbd_item">
|
||||||
|
{{item}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view v-if="broadcastType=='mould'" :class="[direction=='top'?'broadcastDataTopBtmDatacss_top':direction=='bottom'?'broadcastDataTopBtmDatacss_bottom':'',animation_paused?'animation_pausedcss':'']">
|
||||||
|
<slot />
|
||||||
|
<!-- <slot /> -->
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</block>
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
/**
|
||||||
|
* author:G.bro
|
||||||
|
* date:20200513
|
||||||
|
* * **/
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
broadcastDataes: [],
|
||||||
|
broadcastDataTopBtmDataes: [],
|
||||||
|
broadcastStylees: {},
|
||||||
|
broadcastTopBtmHeight: 0,
|
||||||
|
scrlloWidth: 0,
|
||||||
|
animation_paused: false,
|
||||||
|
qualifications: true,
|
||||||
|
isShow: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
props: {
|
||||||
|
broadcastType: {
|
||||||
|
type: String,
|
||||||
|
default: 'text' //mould
|
||||||
|
},
|
||||||
|
imgdata: {
|
||||||
|
type: Array
|
||||||
|
},
|
||||||
|
broadcastData: {
|
||||||
|
type: Array
|
||||||
|
},
|
||||||
|
broadcastStyle: {
|
||||||
|
type: Object,
|
||||||
|
default () {
|
||||||
|
return {
|
||||||
|
speed: 90, //滚动速度,每秒3个字
|
||||||
|
font_size: "28", //字体大小(rpx)
|
||||||
|
text_color: "#fff", //字体颜色
|
||||||
|
back_color: "#815CD4", //背景色
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
broadcastIconIsDisplay: { //图标是否显示
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
// broadcast_icon: {
|
||||||
|
// type: String,
|
||||||
|
// default: ''
|
||||||
|
// },
|
||||||
|
broadcast_tit: {
|
||||||
|
type: String,
|
||||||
|
default: '今日热点'
|
||||||
|
},
|
||||||
|
direction: {
|
||||||
|
type: String,
|
||||||
|
default: 'left'
|
||||||
|
},
|
||||||
|
viewHeight: {
|
||||||
|
type: Number,
|
||||||
|
default: 200
|
||||||
|
},
|
||||||
|
touchEvent: {
|
||||||
|
type: true,
|
||||||
|
default: false
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
broadcastData(v) {
|
||||||
|
console.log(v, '---')
|
||||||
|
|
||||||
|
if (v.length) {
|
||||||
|
this.isShow = true;
|
||||||
|
this.initialization();
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
},
|
||||||
|
imgdata(v) {
|
||||||
|
console.log(v, '---')
|
||||||
|
this.isShow = true;
|
||||||
|
this.initialization();
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
|
||||||
|
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
|
||||||
|
// if(this.broadcastType=='text'){有偏差
|
||||||
|
// let assist = { ...this.broadcastStyle};
|
||||||
|
// const querys = uni.createSelectorQuery().in(this)
|
||||||
|
// querys.select('.boradcast_text_left_rig').boundingClientRect(rect => {
|
||||||
|
// assist.width_mal = rect.width;
|
||||||
|
// assist.time = rect.width/assist.speed;
|
||||||
|
// that.broadcastStylees=assist;
|
||||||
|
// }).exec()
|
||||||
|
// }
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
initialization() {
|
||||||
|
let that = this;
|
||||||
|
|
||||||
|
if (that.broadcastType == "text") {
|
||||||
|
if (that.direction == "right" || that.direction == "left") {
|
||||||
|
that.initial_let_rig();
|
||||||
|
} else {
|
||||||
|
let arr = [...that.broadcastData];
|
||||||
|
arr = arr.concat(arr);
|
||||||
|
that.broadcastDataTopBtmDataes = arr;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (that.direction == "top" || that.direction == "bottom") {
|
||||||
|
that.$nextTick(() => {
|
||||||
|
let dir = `.broadcastDataTopBtmDatacss_${that.direction}`
|
||||||
|
const query2 = uni.createSelectorQuery().in(that);
|
||||||
|
query2.select(dir).boundingClientRect(rect => {
|
||||||
|
that.broadcastTopBtmHeight = rect.height;
|
||||||
|
console.log(rect, '==rect.height')
|
||||||
|
|
||||||
|
if (that.viewHeight - rect.height > 10) {
|
||||||
|
that.qualifications = false;
|
||||||
|
that.animation_paused = true;
|
||||||
|
that.broadcastDataTopBtmDataes.splice(that.broadcastDataTopBtmDataes.length / 2, that.broadcastDataTopBtmDataes
|
||||||
|
.length - 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
}).exec();
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
if (that.direction == "left" || that.direction == "right") {
|
||||||
|
this.$nextTick(() => {
|
||||||
|
try {
|
||||||
|
if (that.broadcastType == 'mould') {
|
||||||
|
const query = uni.createSelectorQuery().in(that)
|
||||||
|
query.select('.bml01').boundingClientRect(rect => {
|
||||||
|
that.scrlloWidth = rect.width;
|
||||||
|
console.log(rect, '===================rect.width')
|
||||||
|
}).exec()
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
that.scrlloWidth = that.$refs.mouldRef.$el.clientWidth * 2
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
},
|
||||||
|
touchendFn(e) {
|
||||||
|
if (this.touchEvent && this.qualifications) {
|
||||||
|
this.animation_paused = false;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
touchstartFn(e) {
|
||||||
|
if (this.touchEvent && this.qualifications) {
|
||||||
|
this.animation_paused = true;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
initial_let_rig() {
|
||||||
|
let broadcastData = [...this.broadcastData];
|
||||||
|
console.log(this.direction, 'this.direction')
|
||||||
|
if (this.direction == "right") {
|
||||||
|
broadcastData.reverse();
|
||||||
|
}
|
||||||
|
|
||||||
|
let ititdata = broadcastData.map((item) => {
|
||||||
|
return {
|
||||||
|
"text": item,
|
||||||
|
"starspos": uni.getSystemInfoSync().windowWidth - 103
|
||||||
|
}
|
||||||
|
}),
|
||||||
|
assist = { ...this.broadcastStyle
|
||||||
|
},
|
||||||
|
this_width = 0,
|
||||||
|
spacing = 0,
|
||||||
|
speed = (assist.speed * assist.font_size); //m每秒行走的距离
|
||||||
|
|
||||||
|
for (let i in ititdata) {
|
||||||
|
this_width += ititdata[i].text.length * assist.font_size;
|
||||||
|
if (i != ititdata.length - 1) {
|
||||||
|
spacing += ititdata[i].starspos
|
||||||
|
}
|
||||||
|
}
|
||||||
|
let total_length = (this_width / 2) + spacing; //总长
|
||||||
|
assist.time = total_length / speed; /**滚动时间*/
|
||||||
|
assist.width_mal = total_length;
|
||||||
|
this.broadcastDataes = ititdata;
|
||||||
|
this.broadcastStylees = assist;
|
||||||
|
},
|
||||||
|
click_event(index) {
|
||||||
|
let i;
|
||||||
|
if (index > ((broadcastDataTopBtmDataes.length / 2) - 1)) {
|
||||||
|
i = index - (broadcastDataTopBtmDataes.length / 2);
|
||||||
|
} else {
|
||||||
|
i = index
|
||||||
|
}
|
||||||
|
this.$emit("changeEvent", {
|
||||||
|
i,
|
||||||
|
msg: `你点击了${i+1}条`
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
/* app端有可能要加上 */
|
||||||
|
/* page {
|
||||||
|
overflow: hidden;
|
||||||
|
width: 100%;
|
||||||
|
} */
|
||||||
|
|
||||||
|
.marquee_box {
|
||||||
|
width: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
position: inherit;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mould {
|
||||||
|
width: 750rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
position: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dsf {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.broadIcon {
|
||||||
|
/* width: 60rpx; */
|
||||||
|
padding: 0 22rpx;
|
||||||
|
height: 60rpx;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
color: #fff;
|
||||||
|
z-index: 999;
|
||||||
|
line-height: 60rpx;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.marquee_container {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: 60rpx;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.marquee_text_left {
|
||||||
|
display: flex;
|
||||||
|
white-space: nowrap;
|
||||||
|
animation-name: around_left;
|
||||||
|
animation-duration: var(--speed--);
|
||||||
|
animation-iteration-count: infinite;
|
||||||
|
animation-timing-function: linear;
|
||||||
|
line-height: 60rpx;
|
||||||
|
position: absolute;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes around_left {
|
||||||
|
from {
|
||||||
|
left: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
left: var(--marqueeWidth--);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.marquee_text_right {
|
||||||
|
display: flex;
|
||||||
|
white-space: nowrap;
|
||||||
|
animation-name: around_right;
|
||||||
|
animation-duration: var(--speed--);
|
||||||
|
animation-iteration-count: infinite;
|
||||||
|
animation-timing-function: linear;
|
||||||
|
line-height: 60rpx;
|
||||||
|
position: absolute;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes around_right {
|
||||||
|
from {
|
||||||
|
right: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
right: var(--marqueeWidth--);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.marquee_tit {
|
||||||
|
height: 60rpx;
|
||||||
|
line-height: 60rpx;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.broadcastTopBtm {
|
||||||
|
padding: 12rx;
|
||||||
|
overflow: hidden;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.broadcastDataTopBtmDatacss_top {
|
||||||
|
width: 100%;
|
||||||
|
animation-name: around_top;
|
||||||
|
animation-duration: var(--scrollSpeed--);
|
||||||
|
animation-iteration-count: infinite;
|
||||||
|
animation-timing-function: linear;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes around_top {
|
||||||
|
from {
|
||||||
|
top: 0%;
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
top: var(--scrollHeight--);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.broadcastDataTopBtmDatacss_bottom {
|
||||||
|
width: 100%;
|
||||||
|
animation-name: around_Bottom;
|
||||||
|
animation-duration: var(--scrollSpeed--);
|
||||||
|
animation-iteration-count: infinite;
|
||||||
|
animation-timing-function: linear;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes around_Bottom {
|
||||||
|
from {
|
||||||
|
bottom: 0%;
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
bottom: var(--scrollHeight--);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.broadcastDataTopBtmDatacss_let {
|
||||||
|
width: 100%;
|
||||||
|
animation-name: around_let;
|
||||||
|
animation-duration: var(--scrollSpeed2--);
|
||||||
|
animation-iteration-count: infinite;
|
||||||
|
animation-timing-function: linear;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.broadcastDataTopBtmDatacss_rig {
|
||||||
|
|
||||||
|
width: 100%;
|
||||||
|
animation-name: around_rig;
|
||||||
|
animation-duration: var(--scrollSpeed2--);
|
||||||
|
animation-iteration-count: infinite;
|
||||||
|
animation-timing-function: linear;
|
||||||
|
position: absolute;
|
||||||
|
right: 0%;
|
||||||
|
top: 0;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
}
|
||||||
|
|
||||||
|
.animation_pausedcss {
|
||||||
|
animation-play-state: paused;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes around_let {
|
||||||
|
from {
|
||||||
|
left: 0%;
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
left: var(--scrollWidth--);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes around_rig {
|
||||||
|
from {
|
||||||
|
right: 0%;
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
right: var(--scrollWidth--);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.bdbd_item {
|
||||||
|
padding: 0 12rpx;
|
||||||
|
line-height: 60rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: "iconfont";
|
||||||
|
src: url('//at.alicdn.com/t/font_1686137_9el2ov99ag.eot?t=1589197045289');
|
||||||
|
/* IE9 */
|
||||||
|
src: url('//at.alicdn.com/t/font_1686137_9el2ov99ag.eot?t=1589197045289#iefix') format('embedded-opentype'),
|
||||||
|
/* IE6-IE8 */
|
||||||
|
url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAANIAAsAAAAAByAAAAL7AAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCCcAqCJIIbATYCJAMICwYABCAFhG0HNxtIBhHVmxnIfiTYMS7bb8koPCedCeJJj2/e7iZfYqkjkZzk9lw0oCspm5uha1SEYUrOg//lO9IN4UL4FQBGHE6b4vPv8pzmojHnedQFGG8NaG9cCySQAgnMG8ZuIniA2yGAP8kUIg0ateiALwbQTwAZMXRwX3wLLgzGifoi2A1TDbIKC1+1WF0CVvLvy0fKxRcUlgYkthnUcAB13sA47XgOPSgBwXIGwJkFGigEDEiHRlMrtAwVovGPQoZ0OFa2wJs6nkf5h/3jgYDYgMxAABJ1/jMJsPBRMxUARq/vB7iTzgYmPjQ5vv+S6E4b/P2XXBBxLwYELI3pvDFm/XqMs27QknXgrK82yepoddiXOXTJhi3NTe/e7XznTqcNG7ZujLoN2Drexulwy99hXacl0UZCzNW77p1WfV52MOpyx+O3nVuFt1qs+xziN+DL8Q0BU2N17J84FTs1YMOXE/2dXf8DTwV62/5bne0/dmdranzv25uGonfvtepore/p0pXugqw9N2SpuKsuTSuYO7vtjzV1oka1azMqsm50/SYtYxvHNug6blqbRuGpQccDpjYpGzCwauyCmnETJpadjJjwO6teaETz1uHNQjPqfmhPHQC8q/q2Lvj3vyF17cvZvUOqvvkGGAAePO36jTu8q4ZhFvC9Q7PAnxYMzDOxCKjUI/MNs6JfzoECneta8QC2cJ5MVUe9VkzwJerlLD4kZdD4kkk01EJYBFAJG19q4U8BjWcHEME4NGL8gHzmaxBCOQlFMBehCeUy0VAfwyKaz7AJFQ1/OknEkgFki5dUfUYt6MD8IFnaPdKKEtk3DFfVnBdx2gv5TF4Yu6EcXXFHXmLE+Q6TiAfPtMGi7Ya1EhxMGa10UeSY+943XamztDWK+oxa0IH5QbK0e1pcVOXzNwxX1dyRM+J8IZ+pcRi7YQBxle+Dch5ln/MdJhEPnmmDRTNghSGCo7lTRitdnBA45t4o5IfKu+2V298tAfwBGiWwuSZo8KX3YOgfkRnbpgEA') format('woff2'),
|
||||||
|
url('//at.alicdn.com/t/font_1686137_9el2ov99ag.woff?t=1589197045289') format('woff'),
|
||||||
|
url('//at.alicdn.com/t/font_1686137_9el2ov99ag.ttf?t=1589197045289') format('truetype'),
|
||||||
|
/* chrome, firefox, opera, Safari, Android, iOS 4.2+ */
|
||||||
|
url('//at.alicdn.com/t/font_1686137_9el2ov99ag.svg?t=1589197045289#iconfont') format('svg');
|
||||||
|
/* iOS 4.1- */
|
||||||
|
}
|
||||||
|
|
||||||
|
.iconfont {
|
||||||
|
font-family: "iconfont" !important;
|
||||||
|
font-size: 16px;
|
||||||
|
font-style: normal;
|
||||||
|
-webkit-font-smoothing: antialiased;
|
||||||
|
-moz-osx-font-smoothing: grayscale;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-guangbozheng-:before {
|
||||||
|
content: "\e640";
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -15,9 +15,7 @@ import {
|
|||||||
WX_LIVE_APPID
|
WX_LIVE_APPID
|
||||||
} from "@/config";
|
} from "@/config";
|
||||||
import uView from "uview-ui";
|
import uView from "uview-ui";
|
||||||
import VueCompositionApi from '@vue/composition-api'
|
|
||||||
|
|
||||||
Vue.use(VueCompositionApi)
|
|
||||||
Vue.use(uView);
|
Vue.use(uView);
|
||||||
Vue.mixin(mixin)
|
Vue.mixin(mixin)
|
||||||
|
|
||||||
|
|||||||
+111
-92
@@ -10,12 +10,12 @@
|
|||||||
|
|
||||||
<view class="flex jc-between">
|
<view class="flex jc-between">
|
||||||
<view class="flex ai-center">
|
<view class="flex ai-center">
|
||||||
<CheckboxIcon style="margin-right: 24rpx;" :default-state="item['state']" @change="value => onChange(value, index, '')"/>
|
<CheckboxIcon style="margin-right: 24rpx;" :default-state="item['state']" :mark="[index]" @change="onChange"/>
|
||||||
<image class="store-cover" :src="item['merAvatar']"
|
<image class="store-cover" :src="item['merAvatar']"
|
||||||
mode="scaleToFill"/>
|
mode="scaleToFill"/>
|
||||||
<view style="color:#333333;font-size: 30rpx">{{ item['merName'] }}</view>
|
<view style="color:#333333;font-size: 30rpx">{{ item['merName'] }}</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="flex ai-center" style="color:#E92727;font-size: 24rpx" @click="navToStore(item['merId'])">
|
<view class="flex ai-center" style="color:#E92727;font-size: 24rpx" @click="navToStore(item['hotelId'])">
|
||||||
进店逛逛
|
进店逛逛
|
||||||
<image style="width: 24rpx;height: 24rpx" :src="webUrl+'/20240109234706982937.png'" mode="scaleToFill"/>
|
<image style="width: 24rpx;height: 24rpx" :src="webUrl+'/20240109234706982937.png'" mode="scaleToFill"/>
|
||||||
</view>
|
</view>
|
||||||
@@ -24,16 +24,20 @@
|
|||||||
<view class="goods-box">
|
<view class="goods-box">
|
||||||
<view class="goods flex ai-center" v-for="(goods,gIndex) in item['carts']" :key="gIndex">
|
<view class="goods flex ai-center" v-for="(goods,gIndex) in item['carts']" :key="gIndex">
|
||||||
<CheckboxIcon style="margin-right: 24rpx;" :default-state="goods['state']" :mark="[index,gIndex]"
|
<CheckboxIcon style="margin-right: 24rpx;" :default-state="goods['state']" :mark="[index,gIndex]"
|
||||||
@change="value => onChange(value, index, gIndex)"/>
|
@change="onChange"/>
|
||||||
<image class="goods-cover flex-0" :src="goods['productInfo']['attrInfo']['image']" mode="scaleToFill"
|
<image class="goods-cover flex-0" :src="goods['productInfo']['attrInfo']['image']" mode="scaleToFill"
|
||||||
|
@click="navToGoods(goods['productId'])"
|
||||||
v-if="goods['productInfo']['attrInfo']['image']"/>
|
v-if="goods['productInfo']['attrInfo']['image']"/>
|
||||||
<image class="goods-cover flex-0" :src="goods['productInfo']['image']" mode="scaleToFill" v-else/>
|
<image class="goods-cover flex-0" :src="goods['productInfo']['image']" mode="scaleToFill"
|
||||||
|
@click="navToGoods(goods['productId'])" v-else/>
|
||||||
|
|
||||||
<view style="width: 100%">
|
<view style="width: 100%">
|
||||||
<view class="one-t">{{ goods['productInfo']['storeName'] }}</view>
|
<view class="one-t" @click="navToGoods(goods['productId'])">{{ goods['productInfo']['storeName'] }}</view>
|
||||||
<view class="sku ai-center">规格:{{ goods['productInfo']['attrInfo']['sku'] }}</view>
|
<view class="sku ai-center" @click="navToGoods(goods['productId'])">
|
||||||
|
规格:{{ goods['productInfo']['attrInfo']['sku'] }}
|
||||||
|
</view>
|
||||||
<view class="flex jc-between ai-center" style="width: 100%;margin-top: 26rpx;">
|
<view class="flex jc-between ai-center" style="width: 100%;margin-top: 26rpx;">
|
||||||
<view style="color:#E92727;font-size: 32rpx;">
|
<view style="color:#E92727;font-size: 32rpx;" @click="navToGoods(goods['productId'])">
|
||||||
<text class="bold" style="font-size: 24rpx">¥</text>
|
<text class="bold" style="font-size: 24rpx">¥</text>
|
||||||
{{ goods['truePrice'] }}
|
{{ goods['truePrice'] }}
|
||||||
</view>
|
</view>
|
||||||
@@ -63,8 +67,8 @@
|
|||||||
|
|
||||||
<view class="footer-fixed flex jc-between ai-center">
|
<view class="footer-fixed flex jc-between ai-center">
|
||||||
<view style="margin-left: 32rpx;">
|
<view style="margin-left: 32rpx;">
|
||||||
<CheckboxIcon style="margin-right: 24rpx;" :default-state="isAll" @change="value => onAllChange(value)"/>
|
<CheckboxIcon style="margin-right: 24rpx;" :default-state="isAll" :mark="[-1]" @change="onChange"/>
|
||||||
<text style="color:#666666;font-size: 32rpx">已选({{ selectCount }})</text>
|
<text style="color:#666666;font-size: 32rpx">全选({{ selectCount }})</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="flex ai-center">
|
<view class="flex ai-center">
|
||||||
<view style="margin-right: 20rpx;color:#666666;font-size: 32rpx">合计:
|
<view style="margin-right: 20rpx;color:#666666;font-size: 32rpx">合计:
|
||||||
@@ -76,120 +80,133 @@
|
|||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script>
|
||||||
import {changeCartNum, getCartGroup, postCartDel} from "@/api/store";
|
import {changeCartNum, getCartGroup, postCartDel} from "@/api/store";
|
||||||
import {VUE_APP_RESOURCES_URL} from '../config/index'
|
|
||||||
import CheckboxIcon from "@/components/CheckboxIcon.vue";
|
import CheckboxIcon from "@/components/CheckboxIcon.vue";
|
||||||
|
import {VUE_APP_RESOURCES_URL} from '../config/index'
|
||||||
|
|
||||||
const webUrl = VUE_APP_RESOURCES_URL
|
const webUrl = VUE_APP_RESOURCES_URL
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'CartIndex',
|
components: {CheckboxIcon},
|
||||||
components: {
|
|
||||||
CheckboxIcon
|
|
||||||
},
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
webUrl,
|
|
||||||
ready: false,
|
ready: false,
|
||||||
isAll: false,
|
list: [],
|
||||||
selectCount: 0,
|
isAll: false
|
||||||
total: 0,
|
}
|
||||||
list: []
|
},
|
||||||
|
computed: {
|
||||||
|
total() {
|
||||||
|
let price = 0
|
||||||
|
this.list.forEach(item => {
|
||||||
|
item['carts'].forEach(goods => {
|
||||||
|
if (goods.state) price += Math.round(goods['cartNum'] * goods['truePrice'] * 100) / 100
|
||||||
|
})
|
||||||
|
})
|
||||||
|
return Math.round(price * 100) / 100
|
||||||
|
},
|
||||||
|
selectCount() {
|
||||||
|
let count = 0
|
||||||
|
this.list.forEach(item => {
|
||||||
|
item['carts'].forEach(goods => {
|
||||||
|
if (goods.state) count++
|
||||||
|
})
|
||||||
|
})
|
||||||
|
return count
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onShow() {
|
onShow() {
|
||||||
this.ready = true
|
|
||||||
this.getCart()
|
this.getCart()
|
||||||
|
this.ready = true
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
async getCart() {
|
async getCart() {
|
||||||
const res = await getCartGroup()
|
const res = await getCartGroup()
|
||||||
if (res.success) {
|
if (res.success) {
|
||||||
this.list = res.data['valid']
|
this.list = res.data['valid']
|
||||||
this.list.map(item => {
|
this.handleAll(false)
|
||||||
item.state = false
|
|
||||||
if (item.carts) {
|
|
||||||
item.carts.map(child => {
|
|
||||||
child.state = false
|
|
||||||
})
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this.handleAll(true)
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onChange(state, index, childIndex) {
|
|
||||||
if (childIndex === '') {
|
|
||||||
this.list[index].state = state
|
|
||||||
this.list[index].carts.map(good => {
|
|
||||||
good.state = state
|
|
||||||
})
|
|
||||||
} else {
|
|
||||||
this.list[index].carts[childIndex].state = state
|
|
||||||
let count = 0
|
|
||||||
this.list[index].carts.map(good => {
|
|
||||||
if (good.state) {
|
|
||||||
count++
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this.list[index].state = count === this.list[index].carts.length
|
|
||||||
}
|
|
||||||
this.$forceUpdate()
|
|
||||||
this.calcAll()
|
|
||||||
},
|
|
||||||
onAllChange() {
|
|
||||||
this.handleAll(!this.isAll)
|
|
||||||
},
|
|
||||||
handleAll(state) {
|
handleAll(state) {
|
||||||
this.list.map(item => {
|
|
||||||
item.state = state
|
|
||||||
if (item.carts) {
|
|
||||||
item.carts.map(good => {
|
|
||||||
good.state = state
|
|
||||||
})
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this.isAll = state
|
this.isAll = state
|
||||||
this.calcAll()
|
this.list = this.list.map(item => {
|
||||||
},
|
item.state = state
|
||||||
calcAll() {
|
item.carts = item.carts.map(goods => {
|
||||||
let total = 0
|
goods.state = state
|
||||||
let count = 0
|
return goods
|
||||||
let goodsAll = 0
|
})
|
||||||
this.list.map(item => {
|
return item
|
||||||
if (item.carts) {
|
|
||||||
item.carts.map(good => {
|
|
||||||
goodsAll++
|
|
||||||
if (good.state) {
|
|
||||||
total += good.cartNum * good.truePrice
|
|
||||||
count++
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
})
|
})
|
||||||
this.total = total
|
|
||||||
this.selectCount = count
|
|
||||||
this.isAll = goodsAll === count
|
|
||||||
},
|
},
|
||||||
|
|
||||||
navToStore(id) {
|
navToStore(id) {
|
||||||
|
if (id === 0) {
|
||||||
|
uni.showToast({
|
||||||
|
title: '店铺装修中~',
|
||||||
|
icon: 'none',
|
||||||
|
duration: 3000
|
||||||
|
})
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
uni.navigateTo({
|
uni.navigateTo({
|
||||||
url: '/pagesInn/inn/innHome?id=' + id
|
url: '/pagesInn/inn/innHome?id=' + id
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
|
onChange(state, mark) {
|
||||||
|
if (mark.length === 1) {
|
||||||
|
if (mark[0] === -1) {
|
||||||
|
this.handleAll(state)
|
||||||
|
} else {
|
||||||
|
this.list[mark[0]]['state'] = state
|
||||||
|
this.list[mark[0]]['carts'] = this.list[mark[0]]['carts'].map(goods => {
|
||||||
|
goods.state = state
|
||||||
|
return goods
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (mark.length === 2) {
|
||||||
|
this.list[mark[0]]['carts'][mark[1]]['state'] = state
|
||||||
|
const length = this.list[mark[0]]['carts'].length
|
||||||
|
let count = 0
|
||||||
|
this.list[mark[0]]['carts'] = this.list[mark[0]]['carts'].map((goods, gIndex) => {
|
||||||
|
if (gIndex === mark[1]) goods['state'] = state
|
||||||
|
if (goods['state']) count++
|
||||||
|
return goods
|
||||||
|
})
|
||||||
|
this.list[mark[0]]['state'] = count === length
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
changeNum(event) {
|
||||||
|
changeCartNum(event.name, event.value)
|
||||||
|
},
|
||||||
|
|
||||||
handleIds() {
|
handleIds() {
|
||||||
const ids = []
|
if (this.selectCount === 0) {
|
||||||
this.list.map(item => {
|
uni.showToast({
|
||||||
item.carts.map(good => {
|
title: "请选择产品",
|
||||||
if (good.state) {
|
icon: "none",
|
||||||
ids.push(good.id)
|
duration: 2000
|
||||||
}
|
})
|
||||||
|
return []
|
||||||
|
}
|
||||||
|
|
||||||
|
let ids = []
|
||||||
|
this.list.forEach(item => {
|
||||||
|
item['carts'].forEach(goods => {
|
||||||
|
if (goods['state']) ids.push(goods['id'])
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
return ids
|
return ids
|
||||||
},
|
},
|
||||||
|
|
||||||
remove() {
|
remove() {
|
||||||
const _this = this
|
const ids = this.handleIds()
|
||||||
const ids = _this.handleIds()
|
|
||||||
if (ids.length === 0) return
|
if (ids.length === 0) return
|
||||||
|
|
||||||
uni.showModal({
|
uni.showModal({
|
||||||
@@ -198,12 +215,15 @@ export default {
|
|||||||
showCancel: true,
|
showCancel: true,
|
||||||
cancelText: '取消',
|
cancelText: '取消',
|
||||||
confirmText: '确认',
|
confirmText: '确认',
|
||||||
success: async () => {
|
success: async (result) => {
|
||||||
const res = await postCartDel(ids)
|
if (result.confirm) {
|
||||||
if (res.success) await _this.getCart()
|
const res = await postCartDel(ids)
|
||||||
|
if (res.success) await this.getCart()
|
||||||
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
submit() {
|
submit() {
|
||||||
const ids = this.handleIds()
|
const ids = this.handleIds()
|
||||||
if (ids.length === 0) return
|
if (ids.length === 0) return
|
||||||
@@ -264,9 +284,8 @@ view {
|
|||||||
|
|
||||||
.sku {
|
.sku {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
height: 42rpx;
|
|
||||||
margin-top: 12rpx;
|
margin-top: 12rpx;
|
||||||
padding: 0 20rpx;
|
padding: 10rpx 20rpx;
|
||||||
border-radius: 22rpx;
|
border-radius: 22rpx;
|
||||||
background: #FDF1F3;
|
background: #FDF1F3;
|
||||||
color: #999999;
|
color: #999999;
|
||||||
|
|||||||
+415
-1127
File diff suppressed because it is too large
Load Diff
+80
-76
@@ -49,88 +49,92 @@
|
|||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script>
|
||||||
import {onMounted, ref} from '@vue/composition-api'
|
|
||||||
import {getCurAddress, getLocation} from "@/utils/common";
|
import {getCurAddress, getLocation} from "@/utils/common";
|
||||||
import {getVideoCity} from "@/api/video";
|
import {getVideoCity} from "@/api/video";
|
||||||
|
|
||||||
const watchCity = ref(uni.getStorageSync('watchCity') || [])
|
export default {
|
||||||
|
data() {
|
||||||
onMounted(() => {
|
return {
|
||||||
getMapData()
|
watchCity: [],
|
||||||
fetchList()
|
ready: false,
|
||||||
})
|
cityName: '',
|
||||||
|
keyword: '',
|
||||||
const ready = ref(false)
|
raw: null,
|
||||||
const cityName = ref('')
|
searchList: [],
|
||||||
const keyword = ref('')
|
indexList: ["A", "B", "C"],
|
||||||
|
itemArr: [
|
||||||
const onSearch = () => {
|
['列表A1', '列表A2', '列表A3'],
|
||||||
const name = keyword.value.trim()
|
['列表B1', '列表B2', '列表B3'],
|
||||||
if (name.length > 0) {
|
['列表C1', '列表C2', '列表C3']
|
||||||
navToWatch(name)
|
]
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
|
mounted() {
|
||||||
const raw = ref()
|
this.watchCity = uni.getStorageSync('watchCity') || []
|
||||||
const searchList = ref([])
|
this.getMapData()
|
||||||
const onChange = (value) => {
|
this.fetchList()
|
||||||
searchList.value = []
|
},
|
||||||
if (value.trim().length === 0) return
|
methods: {
|
||||||
searchList.value = raw.value.filter(city => {
|
async getMapData() {
|
||||||
if (city['name'].indexOf(value) > -1) return city
|
const map = await getLocation();
|
||||||
})
|
if (map.length > 1) {
|
||||||
}
|
const {latitude, longitude} = map[1];
|
||||||
|
const address = await getCurAddress(latitude, longitude);
|
||||||
const handleHistory = (name) => {
|
this.cityName = address[1].data.result['ad_info']['city']
|
||||||
for (let i = 0; i < watchCity.value.length; i++) {
|
|
||||||
if (name === watchCity.value[i]) return
|
|
||||||
}
|
|
||||||
if (watchCity.value.length === 4) {
|
|
||||||
watchCity.value.pop()
|
|
||||||
}
|
|
||||||
watchCity.value.unshift(name)
|
|
||||||
uni.setStorageSync('watchCity', watchCity.value)
|
|
||||||
}
|
|
||||||
|
|
||||||
const getMapData = async () => {
|
|
||||||
const map = await getLocation();
|
|
||||||
if (map.length > 1) {
|
|
||||||
const {latitude, longitude} = map[1];
|
|
||||||
const address = await getCurAddress(latitude, longitude);
|
|
||||||
cityName.value = address[1].data.result['ad_info']['city']
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const indexList = ref(["A", "B", "C"])
|
|
||||||
const itemArr = ref([
|
|
||||||
['列表A1', '列表A2', '列表A3'],
|
|
||||||
['列表B1', '列表B2', '列表B3'],
|
|
||||||
['列表C1', '列表C2', '列表C3']
|
|
||||||
])
|
|
||||||
|
|
||||||
const fetchList = async () => {
|
|
||||||
const res = await getVideoCity()
|
|
||||||
if (res.success) {
|
|
||||||
raw.value = res.data
|
|
||||||
const groupedByName = res.data.reduce((accumulator, current) => {
|
|
||||||
const groupKey = current['firstLetter'].toUpperCase()
|
|
||||||
if (!accumulator[groupKey]) {
|
|
||||||
accumulator[groupKey] = []
|
|
||||||
}
|
}
|
||||||
accumulator[groupKey].push(current)
|
},
|
||||||
return accumulator
|
|
||||||
}, {})
|
|
||||||
|
|
||||||
indexList.value = Object.keys(groupedByName)
|
async fetchList() {
|
||||||
itemArr.value = Object.values(groupedByName)
|
const res = await getVideoCity()
|
||||||
|
if (res.success) {
|
||||||
|
this.raw = res.data
|
||||||
|
const groupedByName = res.data.reduce((accumulator, current) => {
|
||||||
|
const groupKey = current['firstLetter'].toUpperCase()
|
||||||
|
if (!accumulator[groupKey]) {
|
||||||
|
accumulator[groupKey] = []
|
||||||
|
}
|
||||||
|
accumulator[groupKey].push(current)
|
||||||
|
return accumulator
|
||||||
|
}, {})
|
||||||
|
|
||||||
|
this.indexList = Object.keys(groupedByName)
|
||||||
|
this.itemArr = Object.values(groupedByName)
|
||||||
|
}
|
||||||
|
this.ready = true
|
||||||
|
},
|
||||||
|
|
||||||
|
onSearch () {
|
||||||
|
const name = this.keyword.trim()
|
||||||
|
if (name.length > 0) {
|
||||||
|
this.navToWatch(name)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
navToWatch (name) {
|
||||||
|
this.handleHistory(name)
|
||||||
|
uni.redirectTo({url: '/pkg-video/views/watch?name=' + name})
|
||||||
|
},
|
||||||
|
|
||||||
|
handleHistory (name) {
|
||||||
|
for (let i = 0; i < this.watchCity.length; i++) {
|
||||||
|
if (name === this.watchCity[i]) return
|
||||||
|
}
|
||||||
|
if (this.watchCity.length === 4) {
|
||||||
|
watchCity.value.pop()
|
||||||
|
}
|
||||||
|
this.watchCity.unshift(name)
|
||||||
|
uni.setStorageSync('watchCity', this.watchCity)
|
||||||
|
},
|
||||||
|
|
||||||
|
onChange (value) {
|
||||||
|
this.searchList = []
|
||||||
|
if (value.trim().length === 0) return
|
||||||
|
this.searchList = this.raw.filter(city => {
|
||||||
|
if (city['name'].indexOf(value) > -1) return city
|
||||||
|
})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
ready.value = true
|
|
||||||
}
|
|
||||||
|
|
||||||
const navToWatch = (name) => {
|
|
||||||
handleHistory(name)
|
|
||||||
uni.redirectTo({url: '/pkg-video/views/watch?name=' + name})
|
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|||||||
@@ -22,63 +22,71 @@
|
|||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script>
|
||||||
import {ref} from '@vue/composition-api'
|
|
||||||
import {onShow} from '@dcloudio/uni-app'
|
|
||||||
import {VUE_APP_RESOURCES_URL as webUrl} from '../../config/index'
|
|
||||||
import {getLogs, takePrize} from "@/api/lottery";
|
import {getLogs, takePrize} from "@/api/lottery";
|
||||||
|
|
||||||
const ready = ref(false)
|
export default {
|
||||||
|
data() {
|
||||||
onShow(() => {
|
return {
|
||||||
list.value = []
|
webUrl: this.$VUE_APP_RESOURCES_URL,
|
||||||
fetchList()
|
ready: false,
|
||||||
})
|
page: 1,
|
||||||
|
list: []
|
||||||
const page = ref(1)
|
}
|
||||||
const list = ref([])
|
},
|
||||||
const fetchList = async () => {
|
onShow() {
|
||||||
const res = await getLogs(page.value, 20)
|
this.page = 1
|
||||||
if (res.success) {
|
this.list = []
|
||||||
res.data['records']?.forEach(item => list.value.push(item))
|
this.fetchList()
|
||||||
ready.value = true
|
},
|
||||||
}
|
methods: {
|
||||||
}
|
async fetchList() {
|
||||||
|
const res = await getLogs(this.page, 20)
|
||||||
const onBottom = () => {
|
if (res.success) {
|
||||||
page.value++
|
res.data['records']?.forEach(item => this.list.push(item))
|
||||||
fetchList()
|
this.ready = true
|
||||||
}
|
|
||||||
|
|
||||||
const takeItem = async (item) => {
|
|
||||||
if (item['prizeType'] === 1 && item['status'] === 1) {
|
|
||||||
uni.navigateTo({
|
|
||||||
url: '/pages/order/OrderSubmission/index?lotteryRecordId=' + item['id']
|
|
||||||
})
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
const res = await takePrize(item.id)
|
|
||||||
if (res.success) {
|
|
||||||
item['status'] = 2
|
|
||||||
uni.showModal({
|
|
||||||
title: '领取成功',
|
|
||||||
content: '您的奖品已经领取成功,请前往我的订单查看奖品发货信息',
|
|
||||||
cancelText: '下次再说',
|
|
||||||
confirmText: '查看订单',
|
|
||||||
success: function (res) {
|
|
||||||
if (res.confirm) {
|
|
||||||
console.log('用户点击确定');
|
|
||||||
uni.navigateTo({
|
|
||||||
url: '/pages/order/MyOrder/index'
|
|
||||||
})
|
|
||||||
} else if (res.cancel) {
|
|
||||||
console.log('用户点击取消');
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
});
|
},
|
||||||
|
|
||||||
|
onBottom() {
|
||||||
|
this.page++
|
||||||
|
this.fetchList()
|
||||||
|
},
|
||||||
|
|
||||||
|
async takeItem (item) {
|
||||||
|
if (item['prizeType'] === 1 && item['status'] === 1) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/order/OrderSubmission/index?lotteryRecordId=' + item['id']
|
||||||
|
})
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const res = await takePrize(item.id)
|
||||||
|
if (res.success) {
|
||||||
|
item['status'] = 2
|
||||||
|
uni.showModal({
|
||||||
|
title: '领取成功',
|
||||||
|
content: '您的奖品已经领取成功,请前往我的订单查看奖品发货信息',
|
||||||
|
cancelText: '下次再说',
|
||||||
|
confirmText: '查看订单',
|
||||||
|
success: function (res) {
|
||||||
|
if (res.confirm) {
|
||||||
|
console.log('用户点击确定');
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/order/MyOrder/index'
|
||||||
|
})
|
||||||
|
} else if (res.cancel) {
|
||||||
|
console.log('用户点击取消');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="less">
|
<style scoped lang="less">
|
||||||
|
|||||||
+143
-115
@@ -16,14 +16,17 @@
|
|||||||
<view class="btn-close" @click="onlyClose"/>
|
<view class="btn-close" @click="onlyClose"/>
|
||||||
<view class="img-box flex flex-col ai-center" v-if="diceResult['prizeImage']">
|
<view class="img-box flex flex-col ai-center" v-if="diceResult['prizeImage']">
|
||||||
<image style="width: 240rpx;height: 240rpx" :src="diceResult['prizeImage']" mode="scaleToFill"/>
|
<image style="width: 240rpx;height: 240rpx" :src="diceResult['prizeImage']" mode="scaleToFill"/>
|
||||||
<image style="width: 80rpx;height: 80rpx;margin-top: 40rpx;" :src="diceResult['diceImage']"
|
<image style="width: 80rpx;height: 80rpx;margin-top: 34rpx;" :src="diceResult['diceImage']"
|
||||||
mode="scaleToFill"/>
|
mode="scaleToFill"/>
|
||||||
<view class="one-t bold" style="width:300rpx;margin-top: 40rpx;color:#F7E7B2">
|
<view class="one-t bold tc" style="width:300rpx;margin-top: 46rpx;color:#F7E7B2;font-size: 30rpx"
|
||||||
|
v-if="diceResult['isHit']===0">感谢您的参与
|
||||||
|
</view>
|
||||||
|
<view class="one-t bold tc" style="width:320rpx;margin-top: 46rpx;color:#F7E7B2;font-size: 30rpx" v-else>
|
||||||
获得{{ diceResult['prizeName'] }}一份
|
获得{{ diceResult['prizeName'] }}一份
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<image class="btn-result" style="width: 240rpx;height: 68rpx" :src="webUrl+'/20240125205521152611.png'"
|
<image class="btn-result" style="width: 240rpx;height: 68rpx" :src="webUrl+'/20240125205521152611.png'"
|
||||||
mode="scaleToFill" @click="closeResultModel"/>
|
mode="scaleToFill" @click="closeResultModel" v-if="diceResult['isHit']!==0"/>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="dialog-take flex jc-center" :style="{'backgroundImage':`url(${webUrl}/20240124210904824337.png)`}"
|
<view class="dialog-take flex jc-center" :style="{'backgroundImage':`url(${webUrl}/20240124210904824337.png)`}"
|
||||||
@@ -43,13 +46,19 @@
|
|||||||
<view class="btn-submit" @click="onSubmit"/>
|
<view class="btn-submit" @click="onSubmit"/>
|
||||||
<view class="today-limit">{{ lotteryDetail.todayLimit }}</view>
|
<view class="today-limit">{{ lotteryDetail.todayLimit }}</view>
|
||||||
|
|
||||||
<scroll-view class="prize-list flex" scroll-x="true" enable-flex="true">
|
<view class="prize-list">
|
||||||
<view class="item flex flex-0 jc-center ai-center"
|
<!-- mould 图文 模式 left -->
|
||||||
:style="{'backgroundImage':`url(${webUrl}/20240122212856857899.png)`}"
|
<gbro-marquee broadcastType='mould' @changeEvent='navToCoupons' direction="left" :viewHeight="300"
|
||||||
v-for="(item,index) in lotteryDetail.prizeList" :key="index">
|
:broadcastIconIsDisplay="!true" :touchEvent="true" :imgdata='imgData'
|
||||||
<image style="width: 120rpx;height: 120rpx" :src="item['prizeImage']" mode="scaleToFill"/>
|
:broadcastStyle='broadcastStyle2' style="width: 100%;margin-top: 20rpx;">
|
||||||
</view>
|
<block v-for="c in 2" :key="c"> <!--在小程序里遇到一个坑不能使用两个slot 所有统一复制一份做衔接 -->
|
||||||
</scroll-view>
|
<view class="flex flex-0 jc-center ai-center" style="width: 164rpx;height: 164rpx;background-size: 164rpx 164rpx;background-repeat: no-repeat;" :style="{'backgroundImage':`url(${webUrl}/20240122212856857899.png)`}" v-for="(item,index) in imgData" :key="index">
|
||||||
|
<image style="width: 120rpx;height: 120rpx" :src="item" mode="scaleToFill"></image>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
</gbro-marquee>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
<view class="hit-box flex" @click="navToCoupons">
|
<view class="hit-box flex" @click="navToCoupons">
|
||||||
<view class="img-first flex jc-center ai-center"
|
<view class="img-first flex jc-center ai-center"
|
||||||
@@ -63,111 +72,136 @@
|
|||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script>
|
||||||
import {onMounted, ref} from '@vue/composition-api'
|
|
||||||
import {VUE_APP_RESOURCES_URL as webUrl} from '../../config/index'
|
|
||||||
import {getDetail, getPrize, takePrize} from "@/api/lottery";
|
import {getDetail, getPrize, takePrize} from "@/api/lottery";
|
||||||
|
import gbroMarquee from "@/components/gbro-marquee/marquee.vue";
|
||||||
|
|
||||||
onMounted(() => {
|
export default {
|
||||||
init()
|
components: {gbroMarquee},
|
||||||
})
|
data() {
|
||||||
|
return {
|
||||||
|
ready: false,
|
||||||
|
webUrl: this.$VUE_APP_RESOURCES_URL,
|
||||||
|
lotteryDetail: {
|
||||||
|
diceConfig: {},
|
||||||
|
prizeList: [],
|
||||||
|
todayHitPrizeList: [],
|
||||||
|
todayLimit: 0
|
||||||
|
},
|
||||||
|
diceImg: '',
|
||||||
|
diceResult: {
|
||||||
|
prizeName: '',
|
||||||
|
prizeImage: '',
|
||||||
|
diceImage: '',
|
||||||
|
diceValue: 0
|
||||||
|
},
|
||||||
|
showDialog: false,
|
||||||
|
showRules: false,
|
||||||
|
showResult: false,
|
||||||
|
showTake: false,
|
||||||
|
broadcastStyle2: {
|
||||||
|
speed: 20,
|
||||||
|
font_size: "32", //字体大小(rpx)
|
||||||
|
text_color: "#333", //字体颜色
|
||||||
|
back_color: "red", //背景色
|
||||||
|
},
|
||||||
|
imgData: []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
moveDistance: function () {
|
||||||
|
const elWidth = this.lotteryDetail['prizeList'].length * 164
|
||||||
|
const diff = elWidth > 576 ? elWidth - 576 : 0
|
||||||
|
return uni.$u.getPx(diff + 'rpx')
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad() {
|
||||||
|
this.init()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
init() {
|
||||||
|
getDetail().then(res => {
|
||||||
|
if (res.success) {
|
||||||
|
this.lotteryDetail = res.data
|
||||||
|
this.diceImg = this.lotteryDetail.diceConfig['diceDefaultImage']
|
||||||
|
this.ready = true
|
||||||
|
setTimeout(()=>{
|
||||||
|
this.imgData = res.data['prizeList']?.map(item => item['prizeImage'])
|
||||||
|
},1000)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
const showDialog = ref(false)
|
onSubmit() {
|
||||||
const showRules = ref(false)
|
getPrize().then(res => {
|
||||||
const showResult = ref(false)
|
if (res.success) {
|
||||||
const showTake = ref(false)
|
this.diceResult = res.data
|
||||||
|
const diceIndex = this.lotteryDetail.diceConfig['diceValues'].findIndex(item => item['diceValue'] === this.diceResult.diceValue)
|
||||||
|
this.diceImg = this.lotteryDetail.diceConfig['diceValues'][diceIndex]['diceValueGif']
|
||||||
|
setTimeout(() => {
|
||||||
|
this.showDialog = true
|
||||||
|
this.showResult = true
|
||||||
|
this.diceImg = this.lotteryDetail.diceConfig['diceValues'][diceIndex]['diceValueImage']
|
||||||
|
setTimeout(() => {
|
||||||
|
this.init()
|
||||||
|
}, 1000)
|
||||||
|
}, 2800)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
const ready = ref(false)
|
navToLog() {
|
||||||
const lotteryDetail = ref({
|
uni.navigateTo({url: './lottery-log'})
|
||||||
diceConfig: {},
|
},
|
||||||
prizeList: [],
|
|
||||||
todayHitPrizeList: [],
|
|
||||||
todayLimit: 0
|
|
||||||
})
|
|
||||||
|
|
||||||
const navToLog = () => {
|
navToCoupons() {
|
||||||
uni.navigateTo({url: './lottery-log'})
|
uni.navigateTo({url: '/pkg_user/views/myCoupons'})
|
||||||
}
|
},
|
||||||
|
|
||||||
|
openRulesModel() {
|
||||||
|
this.showDialog = true
|
||||||
|
this.showRules = true
|
||||||
|
},
|
||||||
|
|
||||||
const openRulesModel = () => {
|
closeRulesModel() {
|
||||||
showDialog.value = true
|
this.showDialog = false
|
||||||
showRules.value = true
|
this.showRules = false
|
||||||
}
|
},
|
||||||
const closeRulesModel = () => {
|
|
||||||
showDialog.value = false
|
|
||||||
showRules.value = false
|
|
||||||
}
|
|
||||||
|
|
||||||
const init = async () => {
|
onlyClose() {
|
||||||
const res = await getDetail()
|
this.showResult = false
|
||||||
if (res.success) {
|
this.showDialog = false
|
||||||
lotteryDetail.value = res.data
|
},
|
||||||
diceImg.value = lotteryDetail.value.diceConfig['diceDefaultImage']
|
|
||||||
ready.value = true
|
closeResultModel() {
|
||||||
|
if (this.diceResult['prizeType'] === 4) {
|
||||||
|
this.showResult = false
|
||||||
|
this.showDialog = false
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (this.diceResult['prizeType'] === 1) {
|
||||||
|
this.showResult = false
|
||||||
|
this.showDialog = false
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/order/OrderSubmission/index?lotteryRecordId=' + this.diceResult['id']
|
||||||
|
})
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
takePrize(this.diceResult.id).then(res => {
|
||||||
|
if (res.success) {
|
||||||
|
this.showResult = false
|
||||||
|
this.showTake = true
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
closeTakeModel() {
|
||||||
|
this.showTake = false
|
||||||
|
this.showDialog = false
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const diceIndex = ref(0)
|
|
||||||
const diceImg = ref('')
|
|
||||||
const onSubmit = async () => {
|
|
||||||
const res = await getPrize()
|
|
||||||
if (res.success) diceResult.value = res.data
|
|
||||||
|
|
||||||
diceIndex.value = lotteryDetail.value.diceConfig['diceValues'].findIndex(item => item['diceValue'] === diceResult.value.diceValue)
|
|
||||||
diceImg.value = lotteryDetail.value.diceConfig['diceValues'][diceIndex.value]['diceValueGif']
|
|
||||||
setTimeout(() => {
|
|
||||||
diceImg.value = lotteryDetail.value.diceConfig['diceValues'][diceIndex.value]['diceValueImage']
|
|
||||||
setTimeout(() => {
|
|
||||||
init()
|
|
||||||
showDialog.value = true
|
|
||||||
showResult.value = true
|
|
||||||
}, 1000)
|
|
||||||
}, 3000)
|
|
||||||
}
|
|
||||||
|
|
||||||
const diceResult = ref({
|
|
||||||
prizeName: '',
|
|
||||||
prizeImage: '',
|
|
||||||
diceImage: '',
|
|
||||||
diceValue: 0
|
|
||||||
})
|
|
||||||
|
|
||||||
const navToCoupons = () => {
|
|
||||||
uni.navigateTo({url: '/pkg_user/views/myCoupons'})
|
|
||||||
}
|
|
||||||
|
|
||||||
const onlyClose = () => {
|
|
||||||
showResult.value = false
|
|
||||||
showDialog.value = false
|
|
||||||
}
|
|
||||||
|
|
||||||
const closeResultModel = async () => {
|
|
||||||
if (diceResult.value['prizeType'] === 4) {
|
|
||||||
showResult.value = false
|
|
||||||
showDialog.value = false
|
|
||||||
return
|
|
||||||
}
|
|
||||||
if (diceResult.value['prizeType'] === 1) {
|
|
||||||
showResult.value = false
|
|
||||||
showDialog.value = false
|
|
||||||
uni.navigateTo({
|
|
||||||
url: '/pages/order/OrderSubmission/index?lotteryRecordId=' + diceResult.value['id']
|
|
||||||
})
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
const res = await takePrize(diceResult.value.id)
|
|
||||||
if (res.success) {
|
|
||||||
showResult.value = false
|
|
||||||
showTake.value = true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const closeTakeModel = () => {
|
|
||||||
showTake.value = false
|
|
||||||
showDialog.value = false
|
|
||||||
}
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="less">
|
<style scoped lang="less">
|
||||||
@@ -232,8 +266,8 @@ image {
|
|||||||
.dialog-result {
|
.dialog-result {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
left: 50%;
|
left: 50%;
|
||||||
top: 50%;
|
top: 200rpx;
|
||||||
transform: translate(-50%, -50%);
|
transform: translate(-50%, 0);
|
||||||
width: 476rpx;
|
width: 476rpx;
|
||||||
height: 856rpx;
|
height: 856rpx;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
@@ -252,7 +286,7 @@ image {
|
|||||||
.img-box {
|
.img-box {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 50%;
|
left: 50%;
|
||||||
top: 345rpx;
|
top: 344rpx;
|
||||||
transform: translate(-50%, 0);
|
transform: translate(-50%, 0);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -314,13 +348,7 @@ image {
|
|||||||
top: 888rpx;
|
top: 888rpx;
|
||||||
width: 576rpx;
|
width: 576rpx;
|
||||||
height: 164rpx;
|
height: 164rpx;
|
||||||
|
overflow: hidden;
|
||||||
.item {
|
|
||||||
width: 164rpx;
|
|
||||||
height: 164rpx;
|
|
||||||
background-size: 164rpx 164rpx;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.hit-box {
|
.hit-box {
|
||||||
|
|||||||
+211
-204
@@ -14,19 +14,18 @@
|
|||||||
<view class="item">
|
<view class="item">
|
||||||
<video :id="`video-${index}`" :src="item['video']" loop :controls="false" :show-center-play-btn="false"/>
|
<video :id="`video-${index}`" :src="item['video']" loop :controls="false" :show-center-play-btn="false"/>
|
||||||
|
|
||||||
<view class="btn-play flex jc-center ai-center" @click="controlVideo">
|
<cover-view class="btn-play flex jc-center ai-center" @click="controlVideo">
|
||||||
<image style="width:57rpx;height:65rpx" :src="webUrl+'/20240123093125710999.png'" mode="scaleToFill"
|
<cover-image style="width:57rpx;height:65rpx" :src="webUrl+'/20240123093125710999.png'" v-if="showPlay"/>
|
||||||
v-if="showPlay"/>
|
</cover-view>
|
||||||
</view>
|
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="fixed-footer flex jc-between ai-end"
|
<cover-view class="fixed-footer flex jc-between ai-end"
|
||||||
:style="{'bottom':systemInfo['safeAreaInsets']['bottom']+'px'}" v-if="!showDialog">
|
:style="{'bottom':systemInfo['safeAreaInsets']['bottom']+'px'}" v-if="!showDialog">
|
||||||
<view class="flex ai-center">
|
<cover-view class="flex ai-center">
|
||||||
<cover-image style="width: 80rpx;height: 80rpx;border-radius: 50%;z-index: 10" :src="item['hotelLogo']"
|
<cover-image style="width: 80rpx;height: 80rpx;border-radius: 50%;z-index: 10" :src="item['hotelLogo']"
|
||||||
@click="navToStore(item['hotelId'])"/>
|
@click="navToStore(item['hotelId'])"/>
|
||||||
<cover-view class="more-t">{{ item['hotelName'] }}</cover-view>
|
<cover-view class="more-t">{{ item['hotelName'] }}</cover-view>
|
||||||
</view>
|
</cover-view>
|
||||||
|
|
||||||
<cover-view class="flex ai-center">
|
<cover-view class="flex ai-center">
|
||||||
<cover-view class="flex flex-col ai-center" style="width:78rpx;margin-right: 16rpx;"
|
<cover-view class="flex flex-col ai-center" style="width:78rpx;margin-right: 16rpx;"
|
||||||
@@ -48,7 +47,7 @@
|
|||||||
<cover-view class="one-t tc">{{ item['replyCount'] }}</cover-view>
|
<cover-view class="one-t tc">{{ item['replyCount'] }}</cover-view>
|
||||||
</cover-view>
|
</cover-view>
|
||||||
</cover-view>
|
</cover-view>
|
||||||
</view>
|
</cover-view>
|
||||||
</swiper-item>
|
</swiper-item>
|
||||||
</swiper>
|
</swiper>
|
||||||
|
|
||||||
@@ -81,210 +80,217 @@
|
|||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script>
|
||||||
import {ref} from '@vue/composition-api'
|
|
||||||
import {onLoad, onShow} from '@dcloudio/uni-app'
|
|
||||||
import {VUE_APP_RESOURCES_URL as webUrl} from '../../config/index'
|
|
||||||
import {getReplyList, likeVideo, randomList, removeFavoriteVideo, removeLikeVideo, submitReply} from "@/api/video";
|
import {getReplyList, likeVideo, randomList, removeFavoriteVideo, removeLikeVideo, submitReply} from "@/api/video";
|
||||||
import {addVideo} from "@/api/favorite";
|
import {addVideo} from "@/api/favorite";
|
||||||
import {getCurAddress, getLocation} from "@/utils/common";
|
import {getCurAddress, getLocation} from "@/utils/common";
|
||||||
|
|
||||||
const systemInfo = ref()
|
export default {
|
||||||
|
data() {
|
||||||
onLoad((options) => {
|
return {
|
||||||
uni.getSystemInfo({
|
webUrl: this.$VUE_APP_RESOURCES_URL,
|
||||||
success(res) {
|
systemInfo: null,
|
||||||
systemInfo.value = res
|
ready: false,
|
||||||
|
cityName: '',
|
||||||
|
videoId: '',
|
||||||
|
list: [],
|
||||||
|
current: 0,
|
||||||
|
showPlay: false,
|
||||||
|
currentContext: null,
|
||||||
|
showDialog: false,
|
||||||
|
comment: '',
|
||||||
|
page: 1,
|
||||||
|
replyList: []
|
||||||
}
|
}
|
||||||
})
|
},
|
||||||
|
onLoad(options) {
|
||||||
videoId.value = options.videoId || ''
|
let that = this
|
||||||
const name = options.name
|
uni.getSystemInfo({
|
||||||
if (name) {
|
success(res) {
|
||||||
cityName.value = name
|
that.systemInfo = res
|
||||||
fetchList()
|
|
||||||
} else {
|
|
||||||
getMapData()
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
onShow(() => {
|
|
||||||
ready.value = false
|
|
||||||
setTimeout(() => {
|
|
||||||
if (cityName.value) fetchList()
|
|
||||||
}, 1000)
|
|
||||||
})
|
|
||||||
|
|
||||||
const ready = ref(false)
|
|
||||||
const cityName = ref('')
|
|
||||||
const videoId = ref('')
|
|
||||||
|
|
||||||
const navToCity = () => {
|
|
||||||
uni.redirectTo({url: '/pkg-video/views/city'})
|
|
||||||
}
|
|
||||||
|
|
||||||
const navToHome = () => {
|
|
||||||
uni.switchTab({url: '/pages/home/index'})
|
|
||||||
}
|
|
||||||
|
|
||||||
const navToStore = (id) => {
|
|
||||||
console.log(typeof id, id)
|
|
||||||
uni.navigateTo({url: '/pagesInn/inn/innHome?id=' + id})
|
|
||||||
}
|
|
||||||
|
|
||||||
const getMapData = async () => {
|
|
||||||
const map = await getLocation();
|
|
||||||
if (map.length > 1) {
|
|
||||||
const {latitude, longitude} = map[1];
|
|
||||||
const address = await getCurAddress(latitude, longitude);
|
|
||||||
cityName.value = address[1].data.result['ad_info']['city']
|
|
||||||
}
|
|
||||||
|
|
||||||
await fetchList()
|
|
||||||
}
|
|
||||||
|
|
||||||
const list = ref([])
|
|
||||||
const fetchList = async () => {
|
|
||||||
let param
|
|
||||||
if (videoId.value) {
|
|
||||||
param = {
|
|
||||||
videoId: videoId.value,
|
|
||||||
limit: 2
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
param = {
|
|
||||||
cityName: cityName.value,
|
|
||||||
limit: 2
|
|
||||||
}
|
|
||||||
}
|
|
||||||
const res = await randomList(param)
|
|
||||||
if (res.success) {
|
|
||||||
res.data?.forEach(item => list.value.push(item))
|
|
||||||
if (!ready.value && list.value.length === 0) {
|
|
||||||
uni.showModal({
|
|
||||||
title: '',
|
|
||||||
content: '当前城市还没有视频,可以先看看其他城市的喔~',
|
|
||||||
cancelText: '返回',
|
|
||||||
cancelColor: '#3A87FC',
|
|
||||||
confirmText: '选择城市',
|
|
||||||
confirmColor: '#3A87FC',
|
|
||||||
success(res) {
|
|
||||||
if (res.confirm) {
|
|
||||||
navToCity()
|
|
||||||
} else if (res.cancel) {
|
|
||||||
navToHome()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
ready.value = true
|
|
||||||
if (list.value.length > 0) handleVideoPlay()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeLike = async (item) => {
|
|
||||||
const videoId = item['id']
|
|
||||||
if (item['hasLike']) {
|
|
||||||
const res = await removeLikeVideo(videoId)
|
|
||||||
if (res.success) {
|
|
||||||
item['hasLike'] = false
|
|
||||||
item['likeCount'] = res.data['likeCount']
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
const res = await likeVideo(videoId)
|
|
||||||
if (res.success) {
|
|
||||||
item['hasLike'] = true
|
|
||||||
item['likeCount'] = res.data['likeCount']
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeFav = async (item) => {
|
|
||||||
const videoId = item['id']
|
|
||||||
if (item['hasFavorite']) {
|
|
||||||
const res = await removeFavoriteVideo(videoId)
|
|
||||||
if (res.success) {
|
|
||||||
item['hasFavorite'] = false
|
|
||||||
item['favoriteCount'] = res.data['favoriteCount']
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
const res = await addVideo(videoId)
|
|
||||||
if (res.success) {
|
|
||||||
item['hasFavorite'] = true
|
|
||||||
item['favoriteCount'] = res.data['favoriteCount']
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const current = ref(0)
|
|
||||||
const onChange = (event) => {
|
|
||||||
current.value = event.detail.current
|
|
||||||
if (current.value + 2 >= list.value.length) fetchList()
|
|
||||||
handleVideoPlay()
|
|
||||||
}
|
|
||||||
|
|
||||||
const showPlay = ref(false)
|
|
||||||
const currentContext = ref()
|
|
||||||
const handleVideoPlay = () => {
|
|
||||||
for (let i = 0; i < list.value.length; i++) {
|
|
||||||
let id = `video-${i}`
|
|
||||||
let videoContext = uni.createVideoContext(id)
|
|
||||||
videoContext.pause()
|
|
||||||
if (current.value === i) videoContext.play()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
const controlVideo = () => {
|
|
||||||
let id = `video-${current.value}`
|
|
||||||
currentContext.value = uni.createVideoContext(id)
|
|
||||||
if (showPlay.value) {
|
|
||||||
currentContext.value.play()
|
|
||||||
} else {
|
|
||||||
currentContext.value.pause()
|
|
||||||
}
|
|
||||||
showPlay.value = !showPlay.value
|
|
||||||
}
|
|
||||||
|
|
||||||
const showDialog = ref(false)
|
|
||||||
const dialogClose = () => {
|
|
||||||
showDialog.value = false
|
|
||||||
}
|
|
||||||
const dialogOpen = () => {
|
|
||||||
comment.value = ''
|
|
||||||
page.value = 1
|
|
||||||
replyList.value = []
|
|
||||||
fetchReply()
|
|
||||||
}
|
|
||||||
const comment = ref('')
|
|
||||||
const page = ref(1)
|
|
||||||
|
|
||||||
const replyList = ref([])
|
|
||||||
const fetchReply = async () => {
|
|
||||||
const id = list.value[current.value]['id']
|
|
||||||
const res = await getReplyList(id, page.value)
|
|
||||||
if (res.success && res.data['records']?.length > 0) {
|
|
||||||
res.data['records']?.forEach(item => {
|
|
||||||
item.time = uni.$u.timeFrom(Date.parse(item.createTime))
|
|
||||||
replyList.value.push(item)
|
|
||||||
})
|
|
||||||
page.value++
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const onSubmit = async () => {
|
|
||||||
if (comment.value.trim().length === 0) return
|
|
||||||
const videoId = list.value[current.value]['id']
|
|
||||||
const res = await submitReply(videoId, comment.value)
|
|
||||||
if (res.success) {
|
|
||||||
uni.showToast({
|
|
||||||
title: '评论已发布',
|
|
||||||
icon: 'none',
|
|
||||||
success() {
|
|
||||||
list.value[current.value]['replyCount']++
|
|
||||||
showDialog.value = false
|
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
that.videoId = options.videoId || ''
|
||||||
|
const name = options.name
|
||||||
|
if (name) {
|
||||||
|
that.cityName = name
|
||||||
|
that.fetchList()
|
||||||
|
} else {
|
||||||
|
that.getMapData()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onShow() {
|
||||||
|
this.ready = false
|
||||||
|
setTimeout(() => {
|
||||||
|
if (this.cityName) this.fetchList()
|
||||||
|
}, 1000)
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
navToCity() {
|
||||||
|
uni.redirectTo({url: '/pkg-video/views/city'})
|
||||||
|
},
|
||||||
|
|
||||||
|
navToHome() {
|
||||||
|
uni.switchTab({url: '/pages/home/index'})
|
||||||
|
},
|
||||||
|
|
||||||
|
navToStore(id) {
|
||||||
|
uni.navigateTo({url: '/pagesInn/inn/innHome?id=' + id})
|
||||||
|
},
|
||||||
|
|
||||||
|
async getMapData() {
|
||||||
|
const map = await getLocation();
|
||||||
|
if (map.length > 1) {
|
||||||
|
const {latitude, longitude} = map[1];
|
||||||
|
const address = await getCurAddress(latitude, longitude);
|
||||||
|
this.cityName = address[1].data.result['ad_info']['city']
|
||||||
|
}
|
||||||
|
|
||||||
|
await this.fetchList()
|
||||||
|
},
|
||||||
|
|
||||||
|
async fetchList() {
|
||||||
|
let that = this
|
||||||
|
let param
|
||||||
|
if (this.videoId) {
|
||||||
|
param = {
|
||||||
|
videoId: this.videoId,
|
||||||
|
limit: 2
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
param = {
|
||||||
|
cityName: this.cityName,
|
||||||
|
limit: 2
|
||||||
|
}
|
||||||
|
}
|
||||||
|
const res = await randomList(param)
|
||||||
|
if (res.success) {
|
||||||
|
res.data?.forEach(item => this.list.push(item))
|
||||||
|
if (!this.ready && this.list.length === 0) {
|
||||||
|
uni.showModal({
|
||||||
|
title: '',
|
||||||
|
content: '当前城市还没有视频,可以先看看其他城市的喔~',
|
||||||
|
cancelText: '返回',
|
||||||
|
cancelColor: '#3A87FC',
|
||||||
|
confirmText: '选择城市',
|
||||||
|
confirmColor: '#3A87FC',
|
||||||
|
success(res) {
|
||||||
|
if (res.confirm) {
|
||||||
|
that.navToCity()
|
||||||
|
} else if (res.cancel) {
|
||||||
|
that.navToHome()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
that.ready = true
|
||||||
|
if (that.list.length > 0) that.handleVideoPlay()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
async changeLike(item) {
|
||||||
|
const videoId = item['id']
|
||||||
|
if (item['hasLike']) {
|
||||||
|
const res = await removeLikeVideo(videoId)
|
||||||
|
if (res.success) {
|
||||||
|
item['hasLike'] = false
|
||||||
|
item['likeCount'] = res.data['likeCount']
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
const res = await likeVideo(videoId)
|
||||||
|
if (res.success) {
|
||||||
|
item['hasLike'] = true
|
||||||
|
item['likeCount'] = res.data['likeCount']
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
async changeFav(item) {
|
||||||
|
const videoId = item['id']
|
||||||
|
if (item['hasFavorite']) {
|
||||||
|
const res = await removeFavoriteVideo(videoId)
|
||||||
|
if (res.success) {
|
||||||
|
item['hasFavorite'] = false
|
||||||
|
item['favoriteCount'] = res.data['favoriteCount']
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
const res = await addVideo(videoId)
|
||||||
|
if (res.success) {
|
||||||
|
item['hasFavorite'] = true
|
||||||
|
item['favoriteCount'] = res.data['favoriteCount']
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
onChange(event) {
|
||||||
|
this.current = event.detail.current
|
||||||
|
if (this.current + 2 >= this.list.length) this.fetchList()
|
||||||
|
this.handleVideoPlay()
|
||||||
|
},
|
||||||
|
|
||||||
|
handleVideoPlay() {
|
||||||
|
for (let i = 0; i < this.list.length; i++) {
|
||||||
|
let id = `video-${i}`
|
||||||
|
let videoContext = uni.createVideoContext(id)
|
||||||
|
videoContext.pause()
|
||||||
|
if (this.current === i) videoContext.play()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
controlVideo() {
|
||||||
|
let id = `video-${current.value}`
|
||||||
|
this.currentContext = uni.createVideoContext(id)
|
||||||
|
if (this.showPlay) {
|
||||||
|
this.currentContext.play()
|
||||||
|
} else {
|
||||||
|
this.currentContext.pause()
|
||||||
|
}
|
||||||
|
this.showPlay = !this.showPlay
|
||||||
|
},
|
||||||
|
|
||||||
|
dialogClose() {
|
||||||
|
this.showDialog = false
|
||||||
|
},
|
||||||
|
|
||||||
|
dialogOpen() {
|
||||||
|
this.comment = ''
|
||||||
|
this.page = 1
|
||||||
|
this.replyList = []
|
||||||
|
this.fetchReply()
|
||||||
|
},
|
||||||
|
|
||||||
|
async fetchReply() {
|
||||||
|
const id = this.list[this.current]['id']
|
||||||
|
const res = await getReplyList(id, this.page)
|
||||||
|
if (res.success && res.data['records']?.length > 0) {
|
||||||
|
res.data['records']?.forEach(item => {
|
||||||
|
item.time = uni.$u.timeFrom(Date.parse(item.createTime))
|
||||||
|
this.replyList.push(item)
|
||||||
|
})
|
||||||
|
this.page++
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
async onSubmit() {
|
||||||
|
if (this.comment.trim().length === 0) return
|
||||||
|
const videoId = this.list[this.current]['id']
|
||||||
|
const res = await submitReply(videoId, this.comment)
|
||||||
|
if (res.success) {
|
||||||
|
uni.showToast({
|
||||||
|
title: '评论已发布',
|
||||||
|
icon: 'none',
|
||||||
|
success() {
|
||||||
|
this.list[this.current]['replyCount']++
|
||||||
|
this.showDialog = false
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="less">
|
<style scoped lang="less">
|
||||||
@@ -328,6 +334,7 @@ video {
|
|||||||
color: #FFFFFF;
|
color: #FFFFFF;
|
||||||
font-size: 36rpx;
|
font-size: 36rpx;
|
||||||
line-height: 52rpx;
|
line-height: 52rpx;
|
||||||
|
white-space: pre-wrap;
|
||||||
z-index: 10;
|
z-index: 10;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -58,7 +58,7 @@
|
|||||||
<view class="tc" v-else>
|
<view class="tc" v-else>
|
||||||
<image class="img-nodata" :src="webUrl+'/20240106205121705480.png'" mode="scaleToFill"
|
<image class="img-nodata" :src="webUrl+'/20240106205121705480.png'" mode="scaleToFill"
|
||||||
v-if="tabIndex===0"/>
|
v-if="tabIndex===0"/>
|
||||||
<image class="img-nodata" :src="webUrl+'/20240106205115520933.png'" mode="scaleToFill" v-else/>
|
<image class="img-nodata" :src="webUrl+'/20240219170514226953.png'" mode="scaleToFill" v-else/>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|||||||
@@ -95,7 +95,7 @@ export default {
|
|||||||
.zero-coupons {
|
.zero-coupons {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 50%;
|
left: 50%;
|
||||||
top: 50%;
|
top: 40%;
|
||||||
transform: translate(-50%,-50%);
|
transform: translate(-50%,-50%);
|
||||||
width: 400rpx;
|
width: 400rpx;
|
||||||
height: 366rpx;
|
height: 366rpx;
|
||||||
|
|||||||
+254
-237
@@ -9,10 +9,13 @@
|
|||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="manage flex jc-end ai-center" @click="changeManage">
|
<view class="manage flex jc-end ai-center" @click="changeManage" v-if="!isManage">
|
||||||
<image :src="webUrl+'/20240107224533038041.png'" mode="scaleToFill"/>
|
<image :src="webUrl+'/20240107224533038041.png'" mode="scaleToFill"/>
|
||||||
管理
|
管理
|
||||||
</view>
|
</view>
|
||||||
|
<view class="manage flex jc-end ai-center" style="color:#C41617" @click="changeManage" v-else>
|
||||||
|
退出管理
|
||||||
|
</view>
|
||||||
<!--商品列表-->
|
<!--商品列表-->
|
||||||
<scroll-view class="scroll-box" :class="{'manage-state':isManage}" scroll-y
|
<scroll-view class="scroll-box" :class="{'manage-state':isManage}" scroll-y
|
||||||
@scrolltolower="fetchProduct()" v-if="tabsIndex===0">
|
@scrolltolower="fetchProduct()" v-if="tabsIndex===0">
|
||||||
@@ -25,11 +28,11 @@
|
|||||||
v-if="isManage"/>
|
v-if="isManage"/>
|
||||||
<image class="cover flex-0" :src="item['image']" mode="scaleToFill" @click="navToGoods(item['productId'])"/>
|
<image class="cover flex-0" :src="item['image']" mode="scaleToFill" @click="navToGoods(item['productId'])"/>
|
||||||
|
|
||||||
<view>
|
<view style="width: 100%">
|
||||||
<view class="more-t bold">{{ item['storeName'] }}</view>
|
<view class="more-t bold" @click="navToGoods(item['productId'])">{{ item['storeName'] }}</view>
|
||||||
<view class="sub">规格:{{ item['sku'] }}</view>
|
<view class="sub" @click="navToGoods(item['productId'])">规格:{{ item['sku'] }}</view>
|
||||||
<view class="flex jc-between ai-end">
|
<view class="flex jc-between ai-end">
|
||||||
<view class="price flex ai-end">
|
<view class="price flex ai-end" @click="navToGoods(item['productId'])">
|
||||||
<text style="color:#E92727">¥</text>
|
<text style="color:#E92727">¥</text>
|
||||||
<text style="color:#E92727;font-size: 32rpx;line-height: 48rpx">{{ item['price'] }}</text>
|
<text style="color:#E92727;font-size: 32rpx;line-height: 48rpx">{{ item['price'] }}</text>
|
||||||
<text style="margin-left: 10rpx;text-decoration:line-through">¥{{ item['otPrice'] }}</text>
|
<text style="margin-left: 10rpx;text-decoration:line-through">¥{{ item['otPrice'] }}</text>
|
||||||
@@ -59,7 +62,7 @@
|
|||||||
<view class="flex jc-between ai-start" style="width: 594rpx">
|
<view class="flex jc-between ai-start" style="width: 594rpx">
|
||||||
<view>
|
<view>
|
||||||
<view class="one-t bold">{{ item['name'] }}</view>
|
<view class="one-t bold">{{ item['name'] }}</view>
|
||||||
<view class="sub">{{ item['time'] === '刚刚' ? '刚刚' : item['time'] + '前收藏' }}</view>
|
<view class="sub">{{ item['time'] === '刚刚' ? '刚刚' : item['time'] + '收藏' }}</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="btn-nav flex jc-center ai-center" :style="{'margin-right':(isManage?48:0)+'rpx'}"
|
<view class="btn-nav flex jc-center ai-center" :style="{'margin-right':(isManage?48:0)+'rpx'}"
|
||||||
@click="navToStore(item['hotelId'])">进店逛逛
|
@click="navToStore(item['hotelId'])">进店逛逛
|
||||||
@@ -108,247 +111,261 @@
|
|||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script>
|
||||||
import {computed, onMounted, ref} from '@vue/composition-api'
|
|
||||||
import {VUE_APP_RESOURCES_URL as webUrl} from '../../config/index'
|
|
||||||
import {getProductList, getStoreList, getVideoList, removeFavorite} from "@/api/favorite";
|
import {getProductList, getStoreList, getVideoList, removeFavorite} from "@/api/favorite";
|
||||||
import {postCartAdd} from "@/api/store";
|
import {postCartAdd} from "@/api/store";
|
||||||
import CheckboxIcon from "@/components/CheckboxIcon.vue";
|
import CheckboxIcon from "@/components/CheckboxIcon.vue";
|
||||||
|
|
||||||
const ready = ref(false)
|
export default {
|
||||||
onMounted(() => {
|
components: {CheckboxIcon},
|
||||||
ready.value = true
|
data() {
|
||||||
fetchProduct()
|
return {
|
||||||
})
|
ready: false,
|
||||||
|
webUrl: this.$VUE_APP_RESOURCES_URL,
|
||||||
const navToGoods = (id) => {
|
tabs: [
|
||||||
uni.navigateTo({
|
{key: 0, label: '商品'},
|
||||||
url: "/pages/shop/GoodsCon/index?id=" + id
|
{key: 1, label: '店铺'},
|
||||||
})
|
{key: 2, label: '视频'},
|
||||||
}
|
],
|
||||||
|
tabsIndex: 0,
|
||||||
// 导航
|
isManage: false,
|
||||||
const tabs = ref([
|
isAll: false,
|
||||||
{key: 0, label: '商品'},
|
page: 1,
|
||||||
{key: 1, label: '店铺'},
|
productList: [],
|
||||||
{key: 2, label: '视频'},
|
storeList: [],
|
||||||
])
|
videoList: [],
|
||||||
const tabsIndex = ref(0)
|
|
||||||
const changeTabs = (index) => {
|
|
||||||
if (isManage.value) return
|
|
||||||
tabsIndex.value = index
|
|
||||||
page.value = 1
|
|
||||||
fetchData()
|
|
||||||
}
|
|
||||||
|
|
||||||
const fetchData = () => {
|
|
||||||
switch (tabsIndex.value) {
|
|
||||||
case 0:
|
|
||||||
fetchProduct()
|
|
||||||
break
|
|
||||||
case 1:
|
|
||||||
fetchStore()
|
|
||||||
break
|
|
||||||
case 2:
|
|
||||||
fetchVideo()
|
|
||||||
break
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const tabsVertical = computed(() => {
|
|
||||||
if (tabsIndex.value === 0) return 1
|
|
||||||
if (tabsIndex.value === 1) return -1
|
|
||||||
if (tabsIndex.value === 2) return 0
|
|
||||||
})
|
|
||||||
|
|
||||||
// 管理
|
|
||||||
const isManage = ref(false)
|
|
||||||
const changeManage = () => {
|
|
||||||
isManage.value = !isManage.value
|
|
||||||
}
|
|
||||||
const isAll = ref(false)
|
|
||||||
|
|
||||||
const selectCount = computed(() => {
|
|
||||||
let count = 0, countList
|
|
||||||
switch (tabsIndex.value) {
|
|
||||||
case 0:
|
|
||||||
countList = productList.value
|
|
||||||
break
|
|
||||||
case 1:
|
|
||||||
countList = storeList.value
|
|
||||||
break
|
|
||||||
case 2:
|
|
||||||
countList = videoList.value
|
|
||||||
break
|
|
||||||
}
|
|
||||||
|
|
||||||
countList.forEach(item => {
|
|
||||||
if (item['state']) count++
|
|
||||||
})
|
|
||||||
return count
|
|
||||||
})
|
|
||||||
const onChange = (state, mark) => {
|
|
||||||
if (mark[0] === -1) {
|
|
||||||
isAll.value = state
|
|
||||||
handleAll(state)
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
switch (tabsIndex.value) {
|
|
||||||
case 0:
|
|
||||||
productList.value[mark]['state'] = state
|
|
||||||
break
|
|
||||||
case 1:
|
|
||||||
storeList.value[mark]['state'] = state
|
|
||||||
break
|
|
||||||
case 2:
|
|
||||||
videoList.value[mark]['state'] = state
|
|
||||||
break
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleAll = (state) => {
|
|
||||||
switch (tabsIndex.value) {
|
|
||||||
case 0:
|
|
||||||
productList.value.forEach(item => item.state = state)
|
|
||||||
break
|
|
||||||
case 1:
|
|
||||||
storeList.value.forEach(item => item.state = state)
|
|
||||||
break
|
|
||||||
case 2:
|
|
||||||
videoList.value.forEach(item => item.state = state)
|
|
||||||
break
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const remove = async () => {
|
|
||||||
uni.showModal({
|
|
||||||
title: '确认删除已选项目?',
|
|
||||||
content: '',
|
|
||||||
showCancel: true,
|
|
||||||
cancelText: '取消',
|
|
||||||
confirmText: '确认',
|
|
||||||
success: async (r) => {
|
|
||||||
if (r.confirm) {
|
|
||||||
let ids = []
|
|
||||||
switch (tabsIndex.value) {
|
|
||||||
case 0:
|
|
||||||
productList.value.forEach(item => {
|
|
||||||
if (item['state']) ids.push(item.id)
|
|
||||||
})
|
|
||||||
break
|
|
||||||
case 1:
|
|
||||||
storeList.value.forEach(item => {
|
|
||||||
if (item['state']) ids.push(item.id)
|
|
||||||
})
|
|
||||||
break
|
|
||||||
case 2:
|
|
||||||
videoList.value.forEach(item => {
|
|
||||||
if (item['state']) ids.push(item.id)
|
|
||||||
})
|
|
||||||
break
|
|
||||||
}
|
|
||||||
|
|
||||||
const res = await removeFavorite(ids)
|
|
||||||
if (res.success) {
|
|
||||||
isAll.value = false
|
|
||||||
fetchData()
|
|
||||||
removeAfter()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
})
|
},
|
||||||
}
|
computed: {
|
||||||
|
tabsVertical: function () {
|
||||||
|
if (this.tabsIndex === 0) return 1
|
||||||
|
if (this.tabsIndex === 1) return -1
|
||||||
|
if (this.tabsIndex === 2) return 0
|
||||||
|
},
|
||||||
|
selectCount: function () {
|
||||||
|
let count = 0, countList
|
||||||
|
switch (this.tabsIndex) {
|
||||||
|
case 0:
|
||||||
|
countList = this.productList
|
||||||
|
break
|
||||||
|
case 1:
|
||||||
|
countList = this.storeList
|
||||||
|
break
|
||||||
|
case 2:
|
||||||
|
countList = this.videoList
|
||||||
|
break
|
||||||
|
}
|
||||||
|
|
||||||
const removeAfter = () => {
|
countList.forEach(item => {
|
||||||
switch (tabsIndex.value) {
|
if (item['state']) count++
|
||||||
case 0:
|
})
|
||||||
productList.value = productList.value.filter(item => !item['state'])
|
return count
|
||||||
break
|
}
|
||||||
case 1:
|
},
|
||||||
storeList.value = storeList.value.filter(item => !item['state'])
|
mounted() {
|
||||||
break
|
this.ready = true
|
||||||
case 2:
|
this.fetchProduct()
|
||||||
videoList.value = videoList.value.filter(item => !item['state'])
|
},
|
||||||
break
|
methods: {
|
||||||
|
navToGoods(id) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: "/pages/shop/GoodsCon/index?id=" + id
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
changeTabs(index) {
|
||||||
|
if (this.isManage) return
|
||||||
|
this.tabsIndex = index
|
||||||
|
this.page = 1
|
||||||
|
this.fetchData()
|
||||||
|
},
|
||||||
|
|
||||||
|
fetchData() {
|
||||||
|
switch (this.tabsIndex) {
|
||||||
|
case 0:
|
||||||
|
this.fetchProduct()
|
||||||
|
break
|
||||||
|
case 1:
|
||||||
|
this.fetchStore()
|
||||||
|
break
|
||||||
|
case 2:
|
||||||
|
this.fetchVideo()
|
||||||
|
break
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
changeManage() {
|
||||||
|
this.isManage = !this.isManage
|
||||||
|
},
|
||||||
|
|
||||||
|
onChange(state, mark) {
|
||||||
|
if (mark[0] === -1) {
|
||||||
|
this.isAll = state
|
||||||
|
this.handleAll(state)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
switch (this.tabsIndex) {
|
||||||
|
case 0:
|
||||||
|
this.productList[mark]['state'] = state
|
||||||
|
this.isAll = this.selectCount === this.productList.length
|
||||||
|
break
|
||||||
|
case 1:
|
||||||
|
this.storeList[mark]['state'] = state
|
||||||
|
this.isAll = this.selectCount === this.storeList.length
|
||||||
|
break
|
||||||
|
case 2:
|
||||||
|
this.videoList[mark]['state'] = state
|
||||||
|
this.isAll = this.selectCount === this.videoList.length
|
||||||
|
break
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
handleAll(state) {
|
||||||
|
switch (this.tabsIndex) {
|
||||||
|
case 0:
|
||||||
|
this.productList.forEach(item => item.state = state)
|
||||||
|
break
|
||||||
|
case 1:
|
||||||
|
this.storeList.forEach(item => item.state = state)
|
||||||
|
break
|
||||||
|
case 2:
|
||||||
|
this.videoList.forEach(item => item.state = state)
|
||||||
|
break
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
async remove() {
|
||||||
|
let that = this
|
||||||
|
uni.showModal({
|
||||||
|
title: '确认删除已选项目?',
|
||||||
|
content: '',
|
||||||
|
showCancel: true,
|
||||||
|
cancelText: '取消',
|
||||||
|
confirmText: '确认',
|
||||||
|
success: async (r) => {
|
||||||
|
if (r.confirm) {
|
||||||
|
let ids = []
|
||||||
|
switch (that.tabsIndex) {
|
||||||
|
case 0:
|
||||||
|
that.productList.forEach(item => {
|
||||||
|
if (item['state']) ids.push(item.id)
|
||||||
|
})
|
||||||
|
break
|
||||||
|
case 1:
|
||||||
|
that.storeList.forEach(item => {
|
||||||
|
if (item['state']) ids.push(item.id)
|
||||||
|
})
|
||||||
|
break
|
||||||
|
case 2:
|
||||||
|
that.videoList.forEach(item => {
|
||||||
|
if (item['state']) ids.push(item.id)
|
||||||
|
})
|
||||||
|
break
|
||||||
|
}
|
||||||
|
|
||||||
|
const res = await removeFavorite(ids)
|
||||||
|
if (res.success) {
|
||||||
|
that.isAll = false
|
||||||
|
that.fetchData()
|
||||||
|
that.removeAfter()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
removeAfter() {
|
||||||
|
switch (this.tabsIndex) {
|
||||||
|
case 0:
|
||||||
|
this.productList = this.productList.filter(item => !item['state'])
|
||||||
|
break
|
||||||
|
case 1:
|
||||||
|
this.storeList = this.storeList.filter(item => !item['state'])
|
||||||
|
break
|
||||||
|
case 2:
|
||||||
|
this.videoList = this.videoList.filter(item => !item['state'])
|
||||||
|
break
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
async fetchProduct() {
|
||||||
|
let that = this
|
||||||
|
if (that.page === 1) {
|
||||||
|
that.productList = []
|
||||||
|
}
|
||||||
|
const res = await getProductList(that.page)
|
||||||
|
if (res.success) {
|
||||||
|
res.data['records']?.forEach(item => {
|
||||||
|
item.state = false
|
||||||
|
that.productList.push(item)
|
||||||
|
})
|
||||||
|
that.page++
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
async fetchStore() {
|
||||||
|
let that = this
|
||||||
|
if (that.page === 1) {
|
||||||
|
that.storeList = []
|
||||||
|
}
|
||||||
|
const res = await getStoreList(that.page)
|
||||||
|
if (res.success) {
|
||||||
|
res.data['records']?.forEach(item => {
|
||||||
|
item.time = uni.$u.timeFrom(Date.parse(item.createTime))
|
||||||
|
item.state = false
|
||||||
|
that.storeList.push(item)
|
||||||
|
})
|
||||||
|
that.page++
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
async fetchVideo() {
|
||||||
|
let that = this
|
||||||
|
if (that.page === 1) {
|
||||||
|
that.videoList = []
|
||||||
|
}
|
||||||
|
const res = await getVideoList(that.page)
|
||||||
|
if (res.success) {
|
||||||
|
res.data['records']?.forEach(item => {
|
||||||
|
item.state = false
|
||||||
|
that.videoList.push(item)
|
||||||
|
})
|
||||||
|
that.page++
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
async addCart(item) {
|
||||||
|
const param = {
|
||||||
|
productId: item.productId,
|
||||||
|
uniqueId: item.uniqueId,
|
||||||
|
cartNum: 1
|
||||||
|
}
|
||||||
|
const res = await postCartAdd(param)
|
||||||
|
if (res.success) {
|
||||||
|
uni.showToast({
|
||||||
|
title: res.msg,
|
||||||
|
icon: 'none'
|
||||||
|
}).catch()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
navToStore(id) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pagesInn/inn/innHome?id=' + id
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
navToVideo(videoId) {
|
||||||
|
if (this.isManage) return
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pkg-video/views/watch?videoId=' + videoId
|
||||||
|
})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// 列表
|
|
||||||
const page = ref(1)
|
|
||||||
const productList = ref([])
|
|
||||||
const fetchProduct = async () => {
|
|
||||||
if (page.value === 1) {
|
|
||||||
productList.value = []
|
|
||||||
}
|
|
||||||
const res = await getProductList(page.value)
|
|
||||||
if (res.success) {
|
|
||||||
res.data['records']?.forEach(item => {
|
|
||||||
item.state = false
|
|
||||||
productList.value.push(item)
|
|
||||||
})
|
|
||||||
page.value++
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const storeList = ref([])
|
|
||||||
const fetchStore = async () => {
|
|
||||||
if (page.value === 1) {
|
|
||||||
storeList.value = []
|
|
||||||
}
|
|
||||||
const res = await getStoreList(page.value)
|
|
||||||
if (res.success) {
|
|
||||||
res.data['records']?.forEach(item => {
|
|
||||||
item.time = uni.$u.timeFrom(Date.parse(item.createTime))
|
|
||||||
item.state = false
|
|
||||||
storeList.value.push(item)
|
|
||||||
})
|
|
||||||
page.value++
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const videoList = ref([])
|
|
||||||
const fetchVideo = async () => {
|
|
||||||
if (page.value === 1) {
|
|
||||||
videoList.value = []
|
|
||||||
}
|
|
||||||
const res = await getVideoList(page.value)
|
|
||||||
if (res.success) {
|
|
||||||
res.data['records']?.forEach(item => {
|
|
||||||
item.state = false
|
|
||||||
videoList.value.push(item)
|
|
||||||
})
|
|
||||||
page.value++
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const addCart = async (item) => {
|
|
||||||
const param = {
|
|
||||||
productId: item.productId,
|
|
||||||
uniqueId: item.uniqueId,
|
|
||||||
cartNum: 1
|
|
||||||
}
|
|
||||||
const res = await postCartAdd(param)
|
|
||||||
if (res.success) {
|
|
||||||
uni.showToast({
|
|
||||||
title: res.msg,
|
|
||||||
icon: 'none'
|
|
||||||
}).catch()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const navToStore = (id) => {
|
|
||||||
uni.navigateTo({
|
|
||||||
url: '/pagesInn/inn/innHome?id=' + id
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
const navToVideo = (videoId) => {
|
|
||||||
if (isManage.value) return
|
|
||||||
uni.navigateTo({
|
|
||||||
url: '/pkg-video/views/watch?videoId=' + videoId
|
|
||||||
})
|
|
||||||
}
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="less">
|
<style scoped lang="less">
|
||||||
|
|||||||
@@ -31,34 +31,42 @@
|
|||||||
</scroll-view>
|
</scroll-view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script>
|
||||||
import {onMounted, ref} from '@vue/composition-api'
|
|
||||||
import {VUE_APP_RESOURCES_URL as webUrl} from '../../config/index'
|
|
||||||
import {payoutLog} from "@/api/user";
|
import {payoutLog} from "@/api/user";
|
||||||
|
|
||||||
const ready = ref(false)
|
export default {
|
||||||
onMounted(() => {
|
data() {
|
||||||
fetchData()
|
return {
|
||||||
ready.value = true
|
webUrl: this.$VUE_APP_RESOURCES_URL,
|
||||||
})
|
ready: false,
|
||||||
const list = ref([])
|
list: [],
|
||||||
const page = ref(1)
|
page: 1,
|
||||||
const fetchData = async () => {
|
}
|
||||||
const res = await payoutLog(page.value)
|
},
|
||||||
if (res.success) {
|
mounted() {
|
||||||
let count = 0
|
this.fetchData()
|
||||||
for (let i = 0; i < res.data.length; i++) {
|
this.ready = true
|
||||||
count++
|
},
|
||||||
list.value.push(res.data[i])
|
methods: {
|
||||||
|
async fetchData() {
|
||||||
|
const res = await payoutLog(this.page)
|
||||||
|
if (res.success) {
|
||||||
|
let count = 0
|
||||||
|
for (let i = 0; i < res.data.length; i++) {
|
||||||
|
count++
|
||||||
|
this.list.push(res.data[i])
|
||||||
|
}
|
||||||
|
if (count < 10 && this.page === 1) this.scrollToLower()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
scrollToLower() {
|
||||||
|
this.page++
|
||||||
|
this.fetchData()
|
||||||
}
|
}
|
||||||
if (count < 10 && page.value === 1) scrollToLower()
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const scrollToLower = () => {
|
|
||||||
page.value++
|
|
||||||
fetchData()
|
|
||||||
}
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="less">
|
<style scoped lang="less">
|
||||||
|
|||||||
Reference in New Issue
Block a user