Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
B
bigwood
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
罗超
bigwood
Commits
99eb9318
Commit
99eb9318
authored
Apr 13, 2025
by
罗超
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
修改
parent
63575108
Hide whitespace changes
Inline
Side-by-side
Showing
6 changed files
with
345 additions
and
358 deletions
+345
-358
redEnvelope.vue
src/components/passbook/redEnvelope.vue
+215
-220
index.ts
src/i18n/en-US/index.ts
+2
-1
index.ts
src/i18n/ja-RB/index.ts
+3
-2
index.ts
src/i18n/zh-SW/index.ts
+3
-2
index.ts
src/i18n/zh-TW/index.ts
+3
-2
passbook.vue
src/pages/passbook/passbook.vue
+119
-131
No files found.
src/components/passbook/redEnvelope.vue
View file @
99eb9318
<
template
>
<
template
>
<div
class=
"bg-white q-mt-lg"
<div
class=
"bg-white q-mt-lg"
:style=
"
{ margin: $q.platform.is.mobile ? '20px 10px 0 10px' : '', 'border-radius': $q.platform.is.desktop ? '' : '10px' }">
:style=
"
{'margin':$q.platform.is.mobile?'20px 10px 0 10px':'',
<rebatehead
:title=
"titleHead"
/>
'border-radius':$q.platform.is.desktop?'':'10px'}">
<q-separator
color=
"grey-3"
class=
"q-my-sm"
/>
<rebatehead
:title=
"titleHead"
/>
<div
style=
"padding: 15px 0 0 0"
:class=
"[$q.platform.is.desktop ? 'row justify-between' : 'column mobile']"
>
<q-separator
color=
"grey-3"
class=
"q-my-sm"
/>
<div
class=
"column col redEnvelope-left fz14"
:class=
"[$q.platform.is.desktop ? 'q-pl-sm' : '']"
:style=
"
{ padding: $q.platform.is.desktop ? '0 25px 0 25px' : '' }">
<div
style=
"padding: 15px 0 0 0;"
<p
class=
"fz14 text-grey-7"
:class=
"[$q.platform.is.desktop ? '' : 'q-pl-md']"
>
{{
$t
(
'v104.passbook.titles.text6'
)
}}
</p>
:class=
"[$q.platform.is.desktop?'row justify-between':'column mobile']"
>
<div
ref=
"main"
:class=
"[$q.platform.is.desktop ? 'q-pt-lg' : '']"
style=
"height: 280px; position: relative; top: -30px"
:style=
"
{ width: $q.platform.is.desktop ? '100%' : '95%', left: $q.platform.is.desktop ? '-20px' : '10px', top: $q.platform.is.desktop ? '-30px' : '0' }">
</div>
<div
class=
"column col redEnvelope-left fz14"
</div>
:class=
"[$q.platform.is.desktop?'q-pl-sm':'']"
<div
v-if=
"$q.platform.is.desktop"
class=
"row justify-center"
>
:style=
"
{'padding':$q.platform.is.desktop?'0 25px 0 25px':''}">
<q-separator
vertical
inset
style=
"height: 50%; position: relative; top: 11%"
/>
<p
class=
"fz14 text-grey-7"
</div>
:class=
"[$q.platform.is.desktop?'':'q-pl-md']"
>
{{
$t
(
'v104.passbook.titles.text6'
)
}}
</p>
<div
class=
"redEnvelope-right"
:class=
"[$q.platform.is.desktop ? 'col-4 column q-px-lg' : 'col row q-px-sm']"
:style=
"
{ padding: $q.platform.is.desktop ? '0 30px 0 30px' : '' }">
<div
ref=
"main"
:class=
"[$q.platform.is.desktop?'q-pt-lg':'']"
style=
"height: 280px;position: relative;top: -30px;"
<div
:class=
"[$q.platform.is.desktop ? 'q-pb-sm' : 'col-6 text-center']"
>
:style=
"
{'width': $q.platform.is.desktop?'100%':'95%', 'left': $q.platform.is.desktop?'-20px':'10px','top': $q.platform.is.desktop?'-30px':'0'}">
</div>
<div
class=
"fz14 text-grey-7"
:class=
"[$q.platform.is.desktop ? 'q-pb-xs' : '']"
>
{{
$t
(
'v104.passbook.titles.text9'
)
}}
</div>
<div
class=
"row items-end"
:class=
"[$q.platform.is.desktop ? 'q-pt-sm q-pb-lg' : 'justify-center']"
>
<span
class=
"fz12"
></span>
<div
class=
"fz32 q-pl-sm"
>
<span
style=
"position: relative; top: 9px"
>
{{
datainfo
.
Amount
}}
</span>
</div>
</div>
<div
v-if=
"$q.platform.is.desktop"
class=
"row justify-center"
>
</div>
<q-separator
vertical
inset
style=
"height: 50%;position: relative;top: 11%;"
/>
</div>
</div>
<q-separator
v-if=
"$q.platform.is.desktop"
color=
"grey-3"
/>
<div
class=
"redEnvelope-right"
<div
:class=
"[$q.platform.is.desktop ? 'q-pb-sm' : 'col-6 text-center']"
>
:class=
"[$q.platform.is.desktop?'col-4 column q-px-lg':'col row q-px-sm']"
<div
class=
"fz14 text-grey-7"
:class=
"[$q.platform.is.desktop ? 'q-pb-xs q-pt-lg' : '']"
>
{{
$t
(
'v104.passbook.titles.text10'
)
}}
</div>
:style=
"
{'padding':$q.platform.is.desktop?'0 30px 0 30px':''}"
<div
class=
"row items-end"
:class=
"[$q.platform.is.desktop ? 'q-pt-sm q-pb-lg' : 'justify-center']"
>
>
<span
class=
"fz12"
>
¥
</span>
<div
:class=
"[$q.platform.is.desktop?'q-pb-sm':'col-6 text-center']"
>
<div
class=
"fz32 q-pl-sm"
>
<div
class=
"fz14 text-grey-7"
:class=
"[$q.platform.is.desktop?'q-pb-xs':'']"
>
{{
$t
(
'v104.passbook.titles.text9'
)
}}
</div>
<span
style=
"position: relative; top: 9px"
>
{{
datainfo
.
TotalMoney
}}
</span>
<div
class=
"row items-end"
:class=
"[$q.platform.is.desktop?'q-pt-sm q-pb-lg':'justify-center']"
>
<span
class=
"fz12"
>
¥
</span>
<div
class=
"fz32 q-pl-sm"
><span
style=
"position: relative;top: 9px;"
>
{{
datainfo
.
Amount
}}
</span></div>
</div>
</div>
<q-separator
v-if=
"$q.platform.is.desktop"
color=
"grey-3"
/>
<div
:class=
"[$q.platform.is.desktop?'q-pb-sm':'col-6 text-center']"
>
<div
class=
"fz14 text-grey-7"
:class=
"[$q.platform.is.desktop?'q-pb-xs q-pt-lg':'']"
>
{{
$t
(
'v104.passbook.titles.text10'
)
}}
</div>
<div
class=
"row items-end"
:class=
"[$q.platform.is.desktop?'q-pt-sm q-pb-lg':'justify-center']"
>
<span
class=
"fz12"
>
¥
</span>
<div
class=
"fz32 q-pl-sm"
><span
style=
"position: relative;top: 9px;"
>
{{
datainfo
.
TotalMoney
}}
</span></div>
</div>
</div>
<q-separator
v-if=
"$q.platform.is.desktop"
color=
"grey-3"
/>
</div>
</div>
<q-separator
v-if=
"$q.platform.is.mobile"
color=
"grey-3"
/>
</div>
</div>
<q-separator
v-if=
"$q.platform.is.desktop"
color=
"grey-3"
/>
</div>
<q-separator
v-if=
"$q.platform.is.mobile"
color=
"grey-3"
/>
</div>
<div
:class=
"[$q.platform.is.desktop ? 'q-pb-lg q-px-lg' : 'q-py-md q-px-md']"
>
<span>
{{
$t
(
'v104.passbook.titles.text11'
)
}}
:
</span><span
class=
"q-pl-lg"
></span><span
class=
"fz32 q-pl-sm"
>
{{
datainfo
.
Amount
.
toFixed
(
0
)
}}
</span>
</div>
<div
class=
"q-pt-sm"
:class=
"[$q.platform.is.desktop ? 'q-px-lg' : 'q-px-md']"
>
<div
class=
"q-pb-lg"
v-for=
"(item, index) in datainfo.RatioList"
:key=
"index"
:class=
"[$q.platform.is.desktop ? 'row items-center no-wrap' : 'column']"
>
<div
class=
"col"
>
<template
v-if=
"$q.platform.is.desktop"
>
<q-linear-progress
style=
"border-radius: 15px"
v-if=
"item.percent > 1"
stripe
rounded
size=
"20px"
:value=
"item.width / 1000"
color=
"orange-9"
/>
<q-linear-progress
style=
"border-radius: 15px"
v-else-if=
"item.percent
<
1
"
stripe
rounded
size=
"20px"
:value=
"item.width / 1000"
color=
"red-5"
/>
<q-linear-progress
style=
"border-radius: 15px"
v-else
stripe
rounded
size=
"20px"
:value=
"item.width / 1000"
color=
"cyan-4"
/>
</
template
>
<
template
v-else
>
<q-linear-progress
style=
"border-radius: 15px"
v-if=
"item.percent > 1"
stripe
rounded
size=
"10px"
:value=
"item.width / 1000"
color=
"orange-9"
/>
<q-linear-progress
style=
"border-radius: 15px"
v-else-if=
"item.percent
<
1
"
stripe
rounded
size=
"10px"
:value=
"item.width / 1000"
color=
"red-5"
/>
<q-linear-progress
style=
"border-radius: 15px"
v-else
stripe
rounded
size=
"10px"
:value=
"item.width / 1000"
color=
"cyan-4"
/>
</
template
>
</div>
</div>
<div
:class=
"[$q.platform.is.desktop?'q-pb-lg q-px-lg':'q-py-md q-px-md']"
><span>
{{
$t
(
'v104.passbook.titles.text11'
)
}}
:
</span><span
class=
"q-pl-lg"
>
¥
</span><span
class=
"fz32 q-pl-sm"
>
{{
datainfo
.
Amount
.
toFixed
(
2
)
}}
</span>
</div>
<div
class=
"row items-center no-wrap"
:class=
"[$q.platform.is.desktop ? 'col-4 q-ml-lg' : 'col']"
>
<div
class=
"q-pt-sm"
:class=
"[$q.platform.is.desktop?'q-px-lg':'q-px-md']"
>
<div
:class=
"[$q.platform.is.desktop ? '' : 'q-mr-sm']"
>
<div
class=
"q-pb-lg"
v-for=
"(item,index) in datainfo.RatioList"
:key=
"index"
<
template
v-if=
"$q.platform.is.desktop"
>
:class=
"[$q.platform.is.desktop?'row items-center no-wrap':'column']"
>
<q-img
v-if=
"item.percent > 1"
src=
"../../assets/images/personal/gou.png"
width=
"20px"
height=
"20px"
style=
"position: relative"
/>
<div
class=
"col"
>
<q-img
v-else
src=
"../../assets/images/personal/x1.png"
width=
"26px"
height=
"26px"
style=
"position: relative"
/>
<template
v-if=
"$q.platform.is.desktop"
>
</
template
>
<q-linear-progress
style=
"border-radius: 15px;"
v-if=
"item.percent>1"
stripe
rounded
size=
"20px"
:value=
"item.width/1000"
color=
"orange-9"
/>
<
template
v-else
>
<q-linear-progress
style=
"border-radius: 15px;"
v-else-if=
"item.percent
<1
"
stripe
rounded
size=
"20px"
:value=
"item.width/1000"
color=
"red-5"
/>
<q-img
v-if=
"item.percent > 1"
src=
"../../assets/images/personal/gou.png"
width=
"15px"
height=
"15px"
style=
"position: relative"
/>
<q-linear-progress
style=
"border-radius: 15px;"
v-else
stripe
rounded
size=
"20px"
:value=
"item.width/1000"
color=
"cyan-4"
/>
<q-img
v-else
src=
"../../assets/images/personal/x1.png"
width=
"16px"
height=
"16px"
style=
"position: relative"
/>
</
template
>
</
template
>
<
template
v-else
>
</div>
<q-linear-progress
style=
"border-radius: 15px;"
v-if=
"item.percent>1"
stripe
rounded
size=
"10px"
:value=
"item.width/1000"
color=
"orange-9"
/>
<q-linear-progress
style=
"border-radius: 15px;"
v-else-if=
"item.percent
<1
"
stripe
rounded
size=
"10px"
:value=
"item.width/1000"
color=
"red-5"
/>
<q-linear-progress
style=
"border-radius: 15px;"
v-else
stripe
rounded
size=
"10px"
:value=
"item.width/1000"
color=
"cyan-4"
/>
</
template
>
</div>
<div
:class=
"[$q.platform.is.desktop ? 'column q-ml-md' : 'row no-wrap items-center justify-between q-pt-xs']"
>
<div
class=
"row items-center no-wrap"
<span
class=
"row"
:class=
"[item.percent > 1 ? 'text-light-green-6' : item.percent < 1 ? 'text-red-5' : 'text-dark', $q.platform.is.desktop ? 'wrap fz16 text-weight-bold' : 'fz12 col-6']"
>
:class=
"[$q.platform.is.desktop?'col-4 q-ml-lg':'col']"
>
<
template
v-if=
"item.percent > 1"
>
<div
:class=
"[$q.platform.is.desktop?'':'q-mr-sm']"
>
{{
$t
(
'v104.passbook.titles.text12'
)
}}
<
template
v-if=
"$q.platform.is.desktop"
>
</
template
>
<q-img
v-if=
"item.percent>1"
src=
"../../assets/images/personal/gou.png"
width=
"20px"
height=
"20px"
style=
"position: relative;"
/>
<q-img
v-else
src=
"../../assets/images/personal/x1.png"
width=
"26px"
height=
"26px"
style=
"position: relative;"
/>
</
template
>
<
template
v-else
>
<q-img
v-if=
"item.percent>1"
src=
"../../assets/images/personal/gou.png"
width=
"15px"
height=
"15px"
style=
"position: relative;"
/>
<q-img
v-else
src=
"../../assets/images/personal/x1.png"
width=
"16px"
height=
"16px"
style=
"position: relative;"
/>
</
template
>
</div>
<div
<
template
v-if=
"item.percent < 1"
>
:class=
"[$q.platform.is.desktop?'column q-ml-md':'row no-wrap items-center justify-between q-pt-xs']"
>
{{
$t
(
'v104.passbook.titles.text13'
)
}}
<span
class=
"row"
{{
item
.
Money
-
datainfo
.
GuestNum
}}
/
{{
$t
(
'travel.people'
)
}}
,
:class=
"[item.percent>1?'text-light-green-6':item.percent<1?'text-red-5':'text-dark',$q.platform.is.desktop?'wrap fz16 text-weight-bold':'fz12 col-6']"
>
{{
$t
(
'v104.passbook.titles.text14'
)
}}
<
template
v-if=
"item.percent>1"
>
{{
$t
(
'v104.passbook.titles.text12'
)
}}
¥
{{
(
item
.
Money
*
item
.
Ratio
)
/
1000
}}
</
template
>
¥
{{
item
.
Ratio
}}
/
{{
$t
(
'travel.people'
)
}}
<
template
v-if=
"item.percent<1"
>
{{
$t
(
'v104.passbook.titles.text13'
)
}}
¥
{{
item
.
Money
-
datainfo
.
Amount
}}
,
{{
$t
(
'v104.passbook.titles.text14'
)
}}
¥
{{
(
item
.
Money
*
item
.
Ratio
)
/
1000
}}
</
template
>
</
template
>
</span>
</span>
<span
class=
"fz12 text-grey-6 q-pt-xs"
<span
class=
"fz12 text-grey-6 q-pt-xs"
:class=
"[$q.platform.is.desktop ? '' : 'col-6']"
>
:class=
"[$q.platform.is.desktop?'':'col-6']"
>
{{$t('v104.passbook.titles.text15')}} ¥ {{item.Money}} {{$t('v104.passbook.titles.text16')}}{{item.Ratio}}‰
</span>
{{ $t('v104.passbook.titles.text15') }}
</div>
{{ item.Money }}
</div>
<span
v-if=
"index<datainfo.RatioList.length-1"
>
</div>
-{{ datainfo.RatioList[index+1].Money-1 }}
</span>
<span
v-else
>
{{ $t('v104.passbook.titles.text17') }}
</span>
{{ $t('v104.passbook.titles.text16') }}
{{ item.Ratio }}/{{ $t('travel.people') }}
</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
</template>
<
script
lang=
"ts"
>
<
script
lang=
"ts"
>
import
{
ref
,
toRefs
,
onMounted
,
onBeforeUnmount
}
from
"vue"
;
import
{
ref
,
toRefs
,
onMounted
,
onBeforeUnmount
}
from
'vue'
import
{
useRouter
}
from
'vue-router'
;
import
{
useRouter
}
from
'vue-router'
import
{
useQuasar
}
from
'quasar'
import
{
useQuasar
}
from
'quasar'
import
{
defineComponent
,
ref
,
reactive
,
toRefs
}
from
'vue'
import
{
defineComponent
,
ref
,
reactive
,
toRefs
}
from
'vue'
import
{
useI18n
}
from
'vue-i18n'
import
{
useI18n
}
from
'vue-i18n'
import
*
as
echarts
from
"echarts"
import
*
as
echarts
from
'echarts'
import
rebatehead
from
'../../components/passbook/rebate/rebatehead.vue'
import
rebatehead
from
'../../components/passbook/rebate/rebatehead.vue'
export
default
defineComponent
({
export
default
defineComponent
({
name
:
'user-info'
,
name
:
'user-info'
,
components
:
{
rebatehead
},
components
:
{
rebatehead
},
props
:
{
props
:
{
Obj
:
{
Obj
:
{
type
:
Object
,
type
:
Object
,
require
:
true
require
:
true
},
info
:
{
type
:
Object
,
require
:
true
}
},
},
setup
(
props
)
{
info
:
{
const
$q
=
useQuasar
()
type
:
Object
,
const
{
t
}
=
useI18n
()
require
:
true
const
$router
=
useRouter
();
}
const
main
=
ref
();
},
const
data
=
reactive
({
setup
(
props
)
{
titleHead
:
t
(
'v104.passbook.titles.text5'
),
const
$q
=
useQuasar
()
xMonth
:[]
as
Array
<
any
>
,
const
{
t
}
=
useI18n
()
yMoney1
:[]
as
Array
<
any
>
,
const
$router
=
useRouter
()
yMoney2
:[]
as
Array
<
any
>
,
const
main
=
ref
()
datainfo
:
null
as
any
const
data
=
reactive
({
})
titleHead
:
t
(
'v104.passbook.titles.text5'
),
if
(
props
.
Obj
&&
props
.
info
){
xMonth
:
[]
as
Array
<
any
>
,
data
.
xMonth
=
props
.
Obj
.
xMonth
yMoney1
:
[]
as
Array
<
any
>
,
data
.
yMoney1
=
props
.
Obj
.
yMoney1
yMoney2
:
[]
as
Array
<
any
>
,
data
.
yMoney2
=
props
.
Obj
.
yMoney2
datainfo
:
null
as
any
data
.
datainfo
=
props
.
info
})
}
if
(
props
.
Obj
&&
props
.
info
)
{
let
chart
=
null
data
.
xMonth
=
props
.
Obj
.
xMonth
const
methods
=
{
data
.
yMoney1
=
props
.
Obj
.
yMoney1
getinit
()
{
data
.
yMoney2
=
props
.
Obj
.
yMoney2
// 基于准备好的dom,初始化echarts实例
data
.
datainfo
=
props
.
info
const
myChart
=
echarts
.
init
(
main
.
value
);
}
const
option
=
{
let
chart
=
null
xAxis
:
{
const
methods
=
{
type
:
"category"
,
getinit
()
{
boundaryGap
:
false
,
// 基于准备好的dom,初始化echarts实例
axisLine
:
{
const
myChart
=
echarts
.
init
(
main
.
value
)
show
:
false
,
const
option
=
{
lineStyle
:
{
xAxis
:
{
width
:
30
,
type
:
'category'
,
}
boundaryGap
:
false
,
},
axisLine
:
{
axisTick
:
false
,
show
:
false
,
data
:
data
.
xMonth
,
lineStyle
:
{
},
width
:
30
}
yAxis
:
{
},
type
:
"value"
,
axisTick
:
false
,
min
:
'10'
,
data
:
data
.
xMonth
axisTick
:
true
,
},
splitLine
:
{
show
:
true
,
lineStyle
:
{
color
:
"#fff"
}
},
},
grid
:
{
top
:
$q
.
platform
.
is
.
desktop
?
"30px"
:
"20px"
,
left
:
$q
.
platform
.
is
.
desktop
?
"45px"
:
"45px"
,
right
:
$q
.
platform
.
is
.
desktop
?
"30px"
:
"20px"
,
bottom
:
$q
.
platform
.
is
.
desktop
?
"50px"
:
"60px"
,
},
series
:
[
{
type
:
"line"
,
smooth
:
2
,
symbol
:
'none'
,
data
:
data
.
yMoney1
,
lineStyle
:
{
width
:
3
,
color
:
"#36C7D9"
,
},
itemStyle
:
{
borderWidth
:
5
,
color
:
"#FFFFFF"
,
},
areaStyle
:
{
color
:
"#A4E6EE"
}
},
{
type
:
"line"
,
smooth
:
2
,
data
:
data
.
yMoney2
,
lineStyle
:
{
width
:
3
,
color
:
"#ED6A6B"
,
type
:
'dashed'
},
itemStyle
:
{
borderWidth
:
5
,
},
areaStyle
:
{
yAxis
:
{
color
:
"#FAD2D2"
type
:
'value'
,
}
min
:
'10'
,
}
axisTick
:
true
,
]
splitLine
:
{
show
:
true
,
lineStyle
:
{
color
:
'#fff'
}
}
},
grid
:
{
top
:
$q
.
platform
.
is
.
desktop
?
'30px'
:
'20px'
,
left
:
$q
.
platform
.
is
.
desktop
?
'45px'
:
'45px'
,
right
:
$q
.
platform
.
is
.
desktop
?
'30px'
:
'20px'
,
bottom
:
$q
.
platform
.
is
.
desktop
?
'50px'
:
'60px'
},
series
:
[
{
type
:
'line'
,
smooth
:
2
,
symbol
:
'none'
,
data
:
data
.
yMoney1
,
lineStyle
:
{
width
:
3
,
color
:
'#36C7D9'
},
itemStyle
:
{
borderWidth
:
5
,
color
:
'#FFFFFF'
},
areaStyle
:
{
color
:
'#A4E6EE'
}
},
{
type
:
'line'
,
smooth
:
2
,
data
:
data
.
yMoney2
,
lineStyle
:
{
width
:
3
,
color
:
'#ED6A6B'
,
type
:
'dashed'
},
itemStyle
:
{
borderWidth
:
5
},
};
areaStyle
:
{
// 使用刚指定的配置项和数据显示图表。
color
:
'#FAD2D2'
myChart
.
setOption
(
option
);
}
}
]
}
}
// 使用刚指定的配置项和数据显示图表。
myChart
.
setOption
(
option
)
}
}
onBeforeUnmount
(()
=>
{
})
onMounted
(()
=>
{
methods
.
getinit
();
});
return
{...
toRefs
(
data
),
main
,...
methods
}
}
}
})
onBeforeUnmount
(()
=>
{})
</
script
>
onMounted
(()
=>
{
methods
.
getinit
()
})
return
{
...
toRefs
(
data
),
main
,
...
methods
}
}
})
</
script
>
<
style
scoped
>
<
style
scoped
>
.redEnvelope-form
{
.redEnvelope-form
{
padding
:
15px
30px
0
30px
;
padding
:
15px
30px
0
30px
;
}
}
.redEnvelope-form.mobile
{
.redEnvelope-form.mobile
{
padding
:
15px
10px
0
20px
;
padding
:
15px
10px
0
20px
;
}
}
.redEnvelope-left
{
.redEnvelope-left
{
}
}
.redEnvelope-right
{
.redEnvelope-right
{
}
</
style
>
}
</
style
>
\ No newline at end of file
src/i18n/en-US/index.ts
View file @
99eb9318
...
@@ -1524,7 +1524,7 @@ export default {
...
@@ -1524,7 +1524,7 @@ export default {
text6
:
'Revenue in the past six months'
,
text6
:
'Revenue in the past six months'
,
text7
:
'Time selection'
,
text7
:
'Time selection'
,
text8
:
'Select month'
,
text8
:
'Select month'
,
text9
:
'
Accumulated number of transactions
this year'
,
text9
:
'
Number of people
this year'
,
text10
:
'Accumulated revenue'
,
text10
:
'Accumulated revenue'
,
text11
:
'Month Number'
,
text11
:
'Month Number'
,
text12
:
'Activated, expected revenue'
,
text12
:
'Activated, expected revenue'
,
...
@@ -1532,6 +1532,7 @@ export default {
...
@@ -1532,6 +1532,7 @@ export default {
text14
:
'Estimated Revenue'
,
text14
:
'Estimated Revenue'
,
text15
:
'Monthly transaction amount has been reached'
,
text15
:
'Monthly transaction amount has been reached'
,
text16
:
'Return'
,
text16
:
'Return'
,
text17
:
'up'
,
},
},
col
:
{
col
:
{
title1
:
'Order'
,
title1
:
'Order'
,
...
...
src/i18n/ja-RB/index.ts
View file @
99eb9318
...
@@ -1522,14 +1522,15 @@ export default {
...
@@ -1522,14 +1522,15 @@ export default {
text6
:
'半年近くの収益'
,
text6
:
'半年近くの収益'
,
text7
:
'時間の選択'
,
text7
:
'時間の選択'
,
text8
:
'選択月'
,
text8
:
'選択月'
,
text9
:
'本年の累計
取引総額です
'
,
text9
:
'本年の累計
人数
'
,
text10
:
'累積収益'
,
text10
:
'累積収益'
,
text11
:
'
当面の取引額
'
,
text11
:
'
現在の人数
'
,
text12
:
'活性化しています,収益見込み'
,
text12
:
'活性化しています,収益見込み'
,
text13
:
'まだまだ'
,
text13
:
'まだまだ'
,
text14
:
'収益予想'
,
text14
:
'収益予想'
,
text15
:
'月の取引額はすでに達しました'
,
text15
:
'月の取引額はすでに達しました'
,
text16
:
'返します'
,
text16
:
'返します'
,
text17
:
'以下'
,
},
},
col
:{
col
:{
title1
:
'註文します'
,
title1
:
'註文します'
,
...
...
src/i18n/zh-SW/index.ts
View file @
99eb9318
...
@@ -1525,14 +1525,15 @@ export default {
...
@@ -1525,14 +1525,15 @@ export default {
text6
:
'近半年收益'
,
text6
:
'近半年收益'
,
text7
:
'时间选择'
,
text7
:
'时间选择'
,
text8
:
'选择月份'
,
text8
:
'选择月份'
,
text9
:
'本年累计
交易总额
'
,
text9
:
'本年累计
人数
'
,
text10
:
'累计收益'
,
text10
:
'累计收益'
,
text11
:
'当前
交易额
'
,
text11
:
'当前
人数
'
,
text12
:
'已激活,预计收益'
,
text12
:
'已激活,预计收益'
,
text13
:
'还差'
,
text13
:
'还差'
,
text14
:
'预计收益'
,
text14
:
'预计收益'
,
text15
:
'月交易额已达'
,
text15
:
'月交易额已达'
,
text16
:
'返'
,
text16
:
'返'
,
text17
:
'以上'
,
},
},
col
:{
col
:{
title1
:
'订单'
,
title1
:
'订单'
,
...
...
src/i18n/zh-TW/index.ts
View file @
99eb9318
...
@@ -1527,14 +1527,15 @@ export default {
...
@@ -1527,14 +1527,15 @@ export default {
text6
:
'近半年收益'
,
text6
:
'近半年收益'
,
text7
:
'時間選擇'
,
text7
:
'時間選擇'
,
text8
:
'選擇月份'
,
text8
:
'選擇月份'
,
text9
:
'本年累計
交易總額
'
,
text9
:
'本年累計
人數
'
,
text10
:
'累計收益'
,
text10
:
'累計收益'
,
text11
:
'當前
交易額
'
,
text11
:
'當前
人數
'
,
text12
:
'已激活,預計收益'
,
text12
:
'已激活,預計收益'
,
text13
:
'還差'
,
text13
:
'還差'
,
text14
:
'預計收益'
,
text14
:
'預計收益'
,
text15
:
'月交易額已達'
,
text15
:
'月交易額已達'
,
text16
:
'返'
,
text16
:
'返'
,
text17
:
'以上'
,
},
},
col
:{
col
:{
title1
:
'訂單'
,
title1
:
'訂單'
,
...
...
src/pages/passbook/passbook.vue
View file @
99eb9318
<
template
>
<
template
>
<div
class=
"column items-center"
>
<div
class=
"column items-center"
>
<div
class=
"q-mt-sm q-mb-lg"
<div
class=
"q-mt-sm q-mb-lg"
:class=
"[$q.platform.is.desktop ? 'passbook-form' : '']"
:style=
"
{ width: $q.platform.is.mobile ? '100%' : '' }">
:class=
"[$q.platform.is.desktop?'passbook-form':'']"
<transition-group
v-if=
"!isUseDetails"
appear
enter-active-class=
"animated fadeInRight"
leave-active-class=
"animated fadeInLeft"
>
:style=
"
{'width':$q.platform.is.mobile?'100%':''}">
<template
v-if=
"MonthObj && datainfo"
>
<transition-group
<passbookHead
:dataNum=
"datainfo ? datainfo.Client_Balance : 0"
/>
v-if=
"!isUseDetails"
<!--
<rebate/>
-->
appear
<redEnvelope
:Obj=
"MonthObj"
:info=
"datainfo"
/>
enter-active-class=
"animated fadeInRight"
</
template
>
leave-active-class=
"animated fadeInLeft"
</transition-group>
>
<transition
v-else
appear
enter-active-class=
"animated fadeInLeft"
leave-active-class=
"animated fadeInRight"
>
<template
v-if=
"MonthObj&&datainfo"
>
<useDetails
/>
<passbookHead
:dataNum=
"datainfo?datainfo.Client_Balance:0"
/>
</transition>
<!--
<rebate/>
-->
<redEnvelope
:Obj=
"MonthObj"
:info=
"datainfo"
/>
</
template
>
</transition-group>
<transition
v-else
appear
enter-active-class=
"animated fadeInLeft"
leave-active-class=
"animated fadeInRight"
>
<useDetails/>
</transition>
</div>
</div>
</div>
</div>
</template>
</template>
<
script
lang=
"ts"
>
<
script
lang=
"ts"
>
import
useMetaModule
from
'../../module/meta/metaModule'
import
useMetaModule
from
'../../module/meta/metaModule'
import
{
useRouter
}
from
'vue-router'
;
import
{
useRouter
}
from
'vue-router'
import
{
defineComponent
,
ref
,
reactive
,
toRefs
,
provide
,
inject
}
from
'vue'
import
{
defineComponent
,
ref
,
reactive
,
toRefs
,
provide
,
inject
}
from
'vue'
import
{
useQuasar
}
from
'quasar'
import
{
useQuasar
}
from
'quasar'
import
{
ApiResult
}
from
'../../@types/enumHelper'
import
{
ApiResult
}
from
'../../@types/enumHelper'
import
message
from
'../../utils/message'
import
message
from
'../../utils/message'
import
{
useI18n
}
from
'vue-i18n'
import
{
useI18n
}
from
'vue-i18n'
import
Store
from
'../../store'
import
Store
from
'../../store'
import
{
DirtionmaryHelper
}
from
'../../config/dictionary'
import
{
DirtionmaryHelper
}
from
'../../config/dictionary'
import
passbookHead
from
'../../components/passbook/passbookHead.vue'
import
passbookHead
from
'../../components/passbook/passbookHead.vue'
import
rebate
from
'../../components/passbook/rebate.vue'
import
rebate
from
'../../components/passbook/rebate.vue'
import
redEnvelope
from
'../../components/passbook/redEnvelope.vue'
import
redEnvelope
from
'../../components/passbook/redEnvelope.vue'
import
useDetails
from
'../../components/passbook/useDetails.vue'
import
useDetails
from
'../../components/passbook/useDetails.vue'
import
passbookService
from
'../../api/passbook'
import
passbookService
from
'../../api/passbook'
export
default
defineComponent
({
export
default
defineComponent
({
name
:
'user-info'
,
name
:
'user-info'
,
components
:
{
passbookHead
,
rebate
,
redEnvelope
,
useDetails
},
components
:
{
passbookHead
,
rebate
,
redEnvelope
,
useDetails
},
props
:
{},
props
:
{},
setup
()
{
setup
()
{
const
$router
=
useRouter
()
const
$q
=
useQuasar
()
const
data
=
reactive
({
datainfo
:
null
as
Object
,
xMonth
:
[]
as
Array
<
any
>
,
yMoney1
:
[]
as
Array
<
any
>
,
yMoney2
:
[]
as
Array
<
any
>
,
MonthObj
:
null
as
Object
})
const
$router
=
useRouter
();
let
{
setTitle
}
=
useMetaModule
()
const
$q
=
useQuasar
()
const
{
locale
,
t
}
=
useI18n
()
const
data
=
reactive
({
const
pageTitle
=
inject
(
DirtionmaryHelper
.
PAGE_TITLE_KEY
)
as
any
datainfo
:
null
as
Object
,
pageTitle
.
value
=
t
(
'v104.passbook.pageTitle'
)
xMonth
:[]
as
Array
<
any
>
,
setTitle
(
pageTitle
.
value
)
yMoney1
:[]
as
Array
<
any
>
,
const
ratioListBase
=
ref
([
yMoney2
:[]
as
Array
<
any
>
,
{
MonthObj
:
null
as
Object
Money
:
5
,
})
Ratio
:
100000
},
let
{
setTitle
}
=
useMetaModule
()
{
const
{
locale
,
t
}
=
useI18n
()
Money
:
11
,
const
pageTitle
=
inject
(
DirtionmaryHelper
.
PAGE_TITLE_KEY
)
as
any
Ratio
:
150000
pageTitle
.
value
=
t
(
'v104.passbook.pageTitle'
)
},
setTitle
(
pageTitle
.
value
)
{
const
ratioListBase
=
ref
([
Money
:
16
,
{
Ratio
:
200000
Money
:
5
,
},
Ratio
:
100000
,
{
},
Money
:
21
,
{
Ratio
:
250000
Money
:
11
,
}
Ratio
:
150000
,
])
},
const
isUseDetails
=
ref
(
false
)
{
provide
(
DirtionmaryHelper
.
PASSBOOK_DETAILS
,
isUseDetails
)
Money
:
16
,
const
methods
=
{
Ratio
:
200000
,
GetBigRedEnvelope
()
{
},
let
CustomerId
{
if
(
Store
.
state
&&
Store
.
state
.
user
?.
userDetail
)
{
Money
:
21
,
CustomerId
=
Store
.
state
.
user
?.
userDetail
?.
customerId
Ratio
:
250000
,
}
},
$q
.
loading
.
show
()
])
passbookService
const
isUseDetails
=
ref
(
false
)
.
GetCustomerBigRedEnvelope
(
CustomerId
)
provide
(
DirtionmaryHelper
.
PASSBOOK_DETAILS
,
isUseDetails
)
.
then
(
r
=>
{
const
methods
=
{
let
arr1
=
[
'-'
,
'-'
,
'-'
,
'-'
]
GetBigRedEnvelope
()
{
let
newarr
=
[]
let
CustomerId
if
(
r
.
data
.
resultCode
==
ApiResult
.
SUCCESS
)
{
if
(
Store
.
state
&&
Store
.
state
.
user
?.
userDetail
)
{
data
.
datainfo
=
r
.
data
.
data
CustomerId
=
Store
.
state
.
user
?.
userDetail
?.
customerId
data
.
datainfo
.
JQLRList
.
forEach
((
item
,
index
)
=>
{
}
data
.
xMonth
.
push
(
item
.
Date
)
$q
.
loading
.
show
()
if
(
index
<
5
)
{
passbookService
.
GetCustomerBigRedEnvelope
(
CustomerId
)
data
.
yMoney1
.
push
(
item
.
Money
)
.
then
(
r
=>
{
let
arr1
=
[
'-'
,
'-'
,
'-'
,
'-'
];
let
newarr
=
[];
if
(
r
.
data
.
resultCode
==
ApiResult
.
SUCCESS
)
{
data
.
datainfo
=
r
.
data
.
data
;
data
.
datainfo
.
JQLRList
.
forEach
((
item
,
index
)
=>
{
data
.
xMonth
.
push
(
item
.
Date
)
if
(
index
<
5
){
data
.
yMoney1
.
push
(
item
.
Money
)
}
if
(
index
>
3
){
newarr
.
push
(
item
.
Money
);
data
.
yMoney2
=
arr1
.
concat
(
newarr
);
}
})
data
.
datainfo
.
RatioList
=
ratioListBase
.
value
data
.
datainfo
.
RatioList
.
forEach
(
item
=>
{
item
.
percent
=
data
.
datainfo
.
Amount
/
item
.
Money
;
item
.
width
=
(
item
.
percent
)
*
100
;
})
console
.
log
(
data
.
datainfo
.
RatioList
)
data
.
yMoney1
=
data
.
yMoney1
.
concat
([
"-"
]);
data
.
MonthObj
=
{
xMonth
:
data
.
xMonth
,
yMoney1
:
data
.
yMoney1
,
yMoney2
:
data
.
yMoney2
}
}
}
else
{
if
(
index
>
3
)
{
message
.
errorMsg
(
r
.
data
.
message
)
newarr
.
push
(
item
.
Money
)
data
.
yMoney2
=
arr1
.
concat
(
newarr
)
}
})
data
.
datainfo
.
RatioList
=
ratioListBase
.
value
data
.
datainfo
.
GuestNum
=
data
.
datainfo
.
GuestNum
?
data
.
datainfo
.
GuestNum
:
0
data
.
datainfo
.
RatioList
.
forEach
(
item
=>
{
item
.
percent
=
data
.
datainfo
.
GuestNum
/
item
.
Money
item
.
width
=
item
.
percent
*
100
})
data
.
yMoney1
=
data
.
yMoney1
.
concat
([
'-'
])
data
.
MonthObj
=
{
xMonth
:
data
.
xMonth
,
yMoney1
:
data
.
yMoney1
,
yMoney2
:
data
.
yMoney2
}
}
$q
.
loading
.
hide
()
}
else
{
})
message
.
errorMsg
(
r
.
data
.
message
)
.
catch
(
r
=>
{
}
$q
.
loading
.
hide
()
$q
.
loading
.
hide
()
message
.
errorMsg
(
r
.
message
)
})
})
.
catch
(
r
=>
{
},
$q
.
loading
.
hide
()
message
.
errorMsg
(
r
.
message
)
})
}
}
methods
.
GetBigRedEnvelope
()
return
{...
toRefs
(
data
),
isUseDetails
,...
methods
}
}
}
})
methods
.
GetBigRedEnvelope
()
</
script
>
return
{
...
toRefs
(
data
),
isUseDetails
,
...
methods
}
}
})
</
script
>
<
style
>
<
style
>
.passbook-form
{
.passbook-form
{
width
:
963px
;
width
:
963px
;
/* min-width: 663px; */
/* min-width: 663px; */
}
}
</
style
>
</
style
>
\ No newline at end of file
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment